prefixo tipo

This commit is contained in:
Luiz Silva 2026-02-12 18:14:28 -03:00
parent cb81107199
commit db7fdadc81
38 changed files with 179 additions and 179 deletions

10
IA.md
View file

@ -98,7 +98,7 @@ import {
celulaTabela,
// Tipos
EliTabelaConsulta,
tipoEliTabelaConsulta,
EliColuna,
EliTabelaAcao,
CartaoStatus // Tipos compartilhados
@ -307,7 +307,7 @@ export default defineComponent({
## EliTabela (Tabela Avançada)
O componente `EliTabela` suporta ordenação, paginação, busca e **filtro avançado**.
Para type-safety, recomenda-se definir a estrutura da consulta usando `EliTabelaConsulta<T>`.
Para type-safety, recomenda-se definir a estrutura da consulta usando `tipoEliTabelaConsulta<T>`.
### Barra de Busca e Filtros
@ -416,7 +416,7 @@ consulta: async (params) => {
```ts
import { defineComponent } from "vue";
import { EliTabela, celulaTabela } from "eli-vue";
import type { EliTabelaConsulta } from "eli-vue";
import type { tipoEliTabelaConsulta } from "eli-vue";
// Tipos auxiliares (opcionais, mas úteis)
import { BadgeCheck, Pencil } from "lucide-vue-next";
@ -431,7 +431,7 @@ type Usuario = {
};
// 2. Defina a configuração da tabela
const tabelaUsuarios: EliTabelaConsulta<Usuario> = {
const tabelaUsuarios: tipoEliTabelaConsulta<Usuario> = {
nome: "Usuarios",
mostrarCaixaDeBusca: true,
registros_por_consulta: 10,
@ -558,7 +558,7 @@ Quando for integrar `eli-vue` num projeto existente:
2) Prefira usar o **plugin** do `eli-vue` (simplifica registro global).
3) Garanta o import do CSS do pacote (`eli-vue/dist/eli-vue.css`).
4) Use `celulaTabela` para construir colunas de tabelas de forma tipada.
5) Ao definir tabelas, use `EliTabelaConsulta<T>` para garantir que colunas e filtros batam com o tipo de dados.
5) Ao definir tabelas, use `tipoEliTabelaConsulta<T>` para garantir que colunas e filtros batam com o tipo de dados.
---

2
dist/eli-vue.css vendored

File diff suppressed because one or more lines are too long

16
dist/eli-vue.es.js vendored
View file

@ -933,7 +933,7 @@ function Zt(e, a, o, r, i, f) {
onClick: a[0] || (a[0] = ue((l) => e.dados.acao(), ["stop", "prevent"]))
}, F((n = e.dados) == null ? void 0 : n.texto), 1)) : (c(), $("span", Wt, F((d = e.dados) == null ? void 0 : d.texto), 1));
}
const Xt = /* @__PURE__ */ L(Jt, [["render", Zt], ["__scopeId", "data-v-7a629ffa"]]), Gt = N({
const Xt = /* @__PURE__ */ L(Jt, [["render", Zt], ["__scopeId", "data-v-4ed44efe"]]), Gt = N({
name: "EliTabelaCelulaTextoTruncado",
props: {
dados: {
@ -961,7 +961,7 @@ function xt(e, a, o, r, i, f) {
title: (l = e.dados) == null ? void 0 : l.texto
}, F((u = e.dados) == null ? void 0 : u.texto), 9, Qt));
}
const eo = /* @__PURE__ */ L(Gt, [["render", xt], ["__scopeId", "data-v-20b03658"]]), ao = N({
const eo = /* @__PURE__ */ L(Gt, [["render", xt], ["__scopeId", "data-v-8caeb784"]]), ao = N({
name: "EliTabelaCelulaNumero",
components: {},
props: {
@ -987,7 +987,7 @@ function oo(e, a, o, r, i, f) {
onClick: a[0] || (a[0] = ue((n) => e.dados.acao(), ["stop", "prevent"]))
}, F(e.textoNumero), 1)) : (c(), $("span", to, F(e.textoNumero), 1));
}
const no = /* @__PURE__ */ L(ao, [["render", oo], ["__scopeId", "data-v-69c890c4"]]), ro = N({
const no = /* @__PURE__ */ L(ao, [["render", oo], ["__scopeId", "data-v-0729177a"]]), ro = N({
name: "EliTabelaCelulaTags",
components: { VChip: Pa },
props: {
@ -1027,7 +1027,7 @@ function io(e, a, o, r, i, f) {
}, 1032, ["color", "clickable", "onClick"]))), 128))
]);
}
const so = /* @__PURE__ */ L(ro, [["render", io], ["__scopeId", "data-v-a9c83dbe"]]);
const so = /* @__PURE__ */ L(ro, [["render", io], ["__scopeId", "data-v-06edd0aa"]]);
function va(e) {
return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
}
@ -1385,7 +1385,7 @@ function $o(e, a, o, r, i, f) {
onClick: a[0] || (a[0] = ue((n) => e.dados.acao(), ["stop", "prevent"]))
}, F(e.textoData), 1)) : (c(), $("span", go, F(e.textoData), 1));
}
const yo = /* @__PURE__ */ L(ho, [["render", $o], ["__scopeId", "data-v-2b88bbb2"]]), _o = {
const yo = /* @__PURE__ */ L(ho, [["render", $o], ["__scopeId", "data-v-71374786"]]), _o = {
textoSimples: Xt,
textoTruncado: eo,
numero: no,
@ -1438,7 +1438,7 @@ function Mo(e, a, o, r, i, f) {
]))), 128))
]);
}
const Bo = /* @__PURE__ */ L(Ao, [["render", Mo], ["__scopeId", "data-v-f1ee8d20"]]), To = N({
const Bo = /* @__PURE__ */ L(Ao, [["render", Mo], ["__scopeId", "data-v-1df19e6a"]]), To = N({
name: "EliTabelaBody",
components: {
EliTabelaCelula: pa,
@ -1970,7 +1970,7 @@ function un(e, a, o, r, i, f) {
])
])) : Q("", !0);
}
const cn = /* @__PURE__ */ L(Ko, [["render", un], ["__scopeId", "data-v-b8f693ef"]]);
const cn = /* @__PURE__ */ L(Ko, [["render", un], ["__scopeId", "data-v-94476d90"]]);
function dn(e) {
if (!Number.isFinite(e) || e <= 0 || e >= 1) return 0;
const a = e.toString();
@ -2572,7 +2572,7 @@ function Yn(e, a, o, r, i, f) {
])
])) : Q("", !0);
}
const Rn = /* @__PURE__ */ L(wn, [["render", Yn], ["__scopeId", "data-v-cdc3f41a"]]), Jn = "eli:tabela";
const Rn = /* @__PURE__ */ L(wn, [["render", Yn], ["__scopeId", "data-v-729a5ac7"]]), Jn = "eli:tabela";
function ha(e) {
return `${Jn}:${e}:colunas`;
}

2
dist/eli-vue.umd.js vendored

File diff suppressed because one or more lines are too long

View file

@ -4,19 +4,19 @@
*/
/** Dependências do Vue (Composition API) */
import { PropType } from "vue";
import type { EliColuna } from "./types-eli-tabela";
import type { tipoEliColuna } from "./types-eli-tabela";
/** Tipos da configuração/contrato da tabela */
import type { EliTabelaConsulta } from "./types-eli-tabela";
import type { tipoEliTabelaConsulta } from "./types-eli-tabela";
import { type EliTabelaColunasConfig } from "./colunasStorage";
declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
/** Configuração principal da tabela (colunas, consulta e ações) */
tabela: {
type: PropType<EliTabelaConsulta<any>>;
type: PropType<tipoEliTabelaConsulta<any>>;
required: true;
};
}>, {
isDev: boolean;
tabela: import("vue").ComputedRef<EliTabelaConsulta<any>>;
tabela: import("vue").ComputedRef<tipoEliTabelaConsulta<any>>;
carregando: import("vue").Ref<boolean, boolean>;
erro: import("vue").Ref<string | null, string | null>;
linhas: import("vue").Ref<unknown[], unknown[]>;
@ -59,7 +59,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
invisiveis: string[];
}>;
temColunasInvisiveis: import("vue").ComputedRef<boolean>;
colunasInvisiveisEfetivas: import("vue").ComputedRef<EliColuna<any>[]>;
colunasInvisiveisEfetivas: import("vue").ComputedRef<tipoEliColuna<any>[]>;
linhasExpandidas: import("vue").Ref<Record<number, boolean>, Record<number, boolean>>;
abrirModalColunas: () => void;
abrirModalFiltro: () => void;
@ -84,7 +84,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
atualizarBusca: (texto: string) => void;
irParaPagina: (pagina: number) => void;
acoesDisponiveisPorLinha: (i: number) => {
acao: import("./types-eli-tabela").EliTabelaAcao<any>;
acao: import("./types-eli-tabela").tipoEliTabelaAcao<any>;
indice: number;
visivel: boolean;
}[];
@ -116,7 +116,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
/** Configuração principal da tabela (colunas, consulta e ações) */
tabela: {
type: PropType<EliTabelaConsulta<any>>;
type: PropType<tipoEliTabelaConsulta<any>>;
required: true;
};
}>> & Readonly<{}>, {}, {}, {
@ -308,7 +308,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
EliTabelaHead: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
colunas: {
type: PropType<Array<EliColuna<any>>>;
type: PropType<Array<tipoEliColuna<any>>>;
required: true;
};
temAcoes: {
@ -336,7 +336,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
alternarOrdenacao(chave: string): boolean;
}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
colunas: {
type: PropType<Array<EliColuna<any>>>;
type: PropType<Array<tipoEliColuna<any>>>;
required: true;
};
temAcoes: {
@ -363,11 +363,11 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
EliTabelaBody: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
colunas: {
type: PropType<Array<EliColuna<any>>>;
type: PropType<Array<tipoEliColuna<any>>>;
required: true;
};
colunasInvisiveis: {
type: PropType<Array<EliColuna<any>>>;
type: PropType<Array<tipoEliColuna<any>>>;
required: true;
};
temColunasInvisiveis: {
@ -407,11 +407,11 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
ChevronDown: import("vue").FunctionalComponent<import("lucide-vue-next").LucideProps, {}, any, {}>;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
colunas: {
type: PropType<Array<EliColuna<any>>>;
type: PropType<Array<tipoEliColuna<any>>>;
required: true;
};
colunasInvisiveis: {
type: PropType<Array<EliColuna<any>>>;
type: PropType<Array<tipoEliColuna<any>>>;
required: true;
};
temColunasInvisiveis: {
@ -449,7 +449,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
}>> & Readonly<{}>, {}, {}, {
EliTabelaCelula: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
celula: {
type: PropType<import("./types-eli-tabela").ComponenteCelula>;
type: PropType<import("./types-eli-tabela").tipoComponenteCelula>;
required: true;
};
}>, {
@ -497,7 +497,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
}>;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
celula: {
type: PropType<import("./types-eli-tabela").ComponenteCelula>;
type: PropType<import("./types-eli-tabela").tipoComponenteCelula>;
required: true;
};
}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@ -507,7 +507,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
required: true;
};
colunasInvisiveis: {
type: PropType<Array<EliColuna<any>>>;
type: PropType<Array<tipoEliColuna<any>>>;
required: true;
};
}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
@ -516,13 +516,13 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
required: true;
};
colunasInvisiveis: {
type: PropType<Array<EliColuna<any>>>;
type: PropType<Array<tipoEliColuna<any>>>;
required: true;
};
}>> & Readonly<{}>, {}, {}, {
EliTabelaCelula: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
celula: {
type: PropType<import("./types-eli-tabela").ComponenteCelula>;
type: PropType<import("./types-eli-tabela").tipoComponenteCelula>;
required: true;
};
}>, {
@ -570,7 +570,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
}>;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
celula: {
type: PropType<import("./types-eli-tabela").ComponenteCelula>;
type: PropType<import("./types-eli-tabela").tipoComponenteCelula>;
required: true;
};
}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@ -593,7 +593,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
};
acoes: {
type: PropType<Array<{
acao: import("./types-eli-tabela").EliTabelaAcao<any>;
acao: import("./types-eli-tabela").tipoEliTabelaAcao<any>;
indice: number;
visivel: boolean;
}>>;
@ -607,11 +607,11 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
menuEl: import("vue").Ref<HTMLElement | null, HTMLElement | null>;
possuiAcoes: import("vue").ComputedRef<boolean>;
emitExecutar: (item: {
acao: import("./types-eli-tabela").EliTabelaAcao<any>;
acao: import("./types-eli-tabela").tipoEliTabelaAcao<any>;
}) => void;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
executar(payload: {
acao: import("./types-eli-tabela").EliTabelaAcao<any>;
acao: import("./types-eli-tabela").tipoEliTabelaAcao<any>;
linha: unknown;
}): boolean;
}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
@ -628,7 +628,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
};
acoes: {
type: PropType<Array<{
acao: import("./types-eli-tabela").EliTabelaAcao<any>;
acao: import("./types-eli-tabela").tipoEliTabelaAcao<any>;
indice: number;
visivel: boolean;
}>>;
@ -640,7 +640,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
};
}>> & Readonly<{
onExecutar?: ((payload: {
acao: import("./types-eli-tabela").EliTabelaAcao<any>;
acao: import("./types-eli-tabela").tipoEliTabelaAcao<any>;
linha: unknown;
}) => any) | undefined;
}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@ -701,7 +701,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
required: true;
};
colunas: {
type: PropType<Array<EliColuna<any>>>;
type: PropType<Array<tipoEliColuna<any>>>;
required: true;
};
}>, {
@ -729,7 +729,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
required: true;
};
colunas: {
type: PropType<Array<EliColuna<any>>>;
type: PropType<Array<tipoEliColuna<any>>>;
required: true;
};
}>> & Readonly<{

View file

@ -1,12 +1,12 @@
import { PropType } from "vue";
import type { EliColuna } from "./types-eli-tabela";
import type { tipoEliColuna } from "./types-eli-tabela";
declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
colunas: {
type: PropType<Array<EliColuna<any>>>;
type: PropType<Array<tipoEliColuna<any>>>;
required: true;
};
colunasInvisiveis: {
type: PropType<Array<EliColuna<any>>>;
type: PropType<Array<tipoEliColuna<any>>>;
required: true;
};
temColunasInvisiveis: {
@ -46,11 +46,11 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
ChevronDown: import("vue").FunctionalComponent<import("lucide-vue-next").LucideProps, {}, any, {}>;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
colunas: {
type: PropType<Array<EliColuna<any>>>;
type: PropType<Array<tipoEliColuna<any>>>;
required: true;
};
colunasInvisiveis: {
type: PropType<Array<EliColuna<any>>>;
type: PropType<Array<tipoEliColuna<any>>>;
required: true;
};
temColunasInvisiveis: {
@ -88,7 +88,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
}>> & Readonly<{}>, {}, {}, {
EliTabelaCelula: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
celula: {
type: PropType<import("./types-eli-tabela").ComponenteCelula>;
type: PropType<import("./types-eli-tabela").tipoComponenteCelula>;
required: true;
};
}>, {
@ -118,7 +118,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
}>;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
celula: {
type: PropType<import("./types-eli-tabela").ComponenteCelula>;
type: PropType<import("./types-eli-tabela").tipoComponenteCelula>;
required: true;
};
}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@ -128,7 +128,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
required: true;
};
colunasInvisiveis: {
type: PropType<Array<EliColuna<any>>>;
type: PropType<Array<tipoEliColuna<any>>>;
required: true;
};
}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
@ -137,13 +137,13 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
required: true;
};
colunasInvisiveis: {
type: PropType<Array<EliColuna<any>>>;
type: PropType<Array<tipoEliColuna<any>>>;
required: true;
};
}>> & Readonly<{}>, {}, {}, {
EliTabelaCelula: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
celula: {
type: PropType<import("./types-eli-tabela").ComponenteCelula>;
type: PropType<import("./types-eli-tabela").tipoComponenteCelula>;
required: true;
};
}>, {
@ -173,7 +173,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
}>;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
celula: {
type: PropType<import("./types-eli-tabela").ComponenteCelula>;
type: PropType<import("./types-eli-tabela").tipoComponenteCelula>;
required: true;
};
}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

View file

@ -1,12 +1,12 @@
import { PropType } from "vue";
import type { EliColuna } from "./types-eli-tabela";
import type { tipoEliColuna } from "./types-eli-tabela";
declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
linha: {
type: PropType<unknown>;
required: true;
};
colunasInvisiveis: {
type: PropType<Array<EliColuna<any>>>;
type: PropType<Array<tipoEliColuna<any>>>;
required: true;
};
}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
@ -15,13 +15,13 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
required: true;
};
colunasInvisiveis: {
type: PropType<Array<EliColuna<any>>>;
type: PropType<Array<tipoEliColuna<any>>>;
required: true;
};
}>> & Readonly<{}>, {}, {}, {
EliTabelaCelula: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
celula: {
type: PropType<import("./types-eli-tabela").ComponenteCelula>;
type: PropType<import("./types-eli-tabela").tipoComponenteCelula>;
required: true;
};
}>, {
@ -51,7 +51,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
}>;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
celula: {
type: PropType<import("./types-eli-tabela").ComponenteCelula>;
type: PropType<import("./types-eli-tabela").tipoComponenteCelula>;
required: true;
};
}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

View file

@ -1,8 +1,8 @@
import { PropType } from "vue";
import type { EliColuna } from "./types-eli-tabela";
import type { tipoEliColuna } from "./types-eli-tabela";
declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
colunas: {
type: PropType<Array<EliColuna<any>>>;
type: PropType<Array<tipoEliColuna<any>>>;
required: true;
};
temAcoes: {
@ -30,7 +30,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
alternarOrdenacao(chave: string): boolean;
}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
colunas: {
type: PropType<Array<EliColuna<any>>>;
type: PropType<Array<tipoEliColuna<any>>>;
required: true;
};
temAcoes: {

View file

@ -1,7 +1,7 @@
import { PropType } from "vue";
import type { EliTabelaAcao } from "./types-eli-tabela";
import type { tipoEliTabelaAcao } from "./types-eli-tabela";
type ItemAcao<T> = {
acao: EliTabelaAcao<T>;
acao: tipoEliTabelaAcao<T>;
indice: number;
visivel: boolean;
};
@ -29,11 +29,11 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
menuEl: import("vue").Ref<HTMLElement | null, HTMLElement | null>;
possuiAcoes: import("vue").ComputedRef<boolean>;
emitExecutar: (item: {
acao: EliTabelaAcao<any>;
acao: tipoEliTabelaAcao<any>;
}) => void;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
executar(payload: {
acao: EliTabelaAcao<any>;
acao: tipoEliTabelaAcao<any>;
linha: unknown;
}): boolean;
}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
@ -58,7 +58,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
};
}>> & Readonly<{
onExecutar?: ((payload: {
acao: EliTabelaAcao<any>;
acao: tipoEliTabelaAcao<any>;
linha: unknown;
}) => any) | undefined;
}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

View file

@ -1,6 +1,6 @@
import { PropType } from "vue";
import type { EliTabelaColunasConfig } from "./colunasStorage";
import type { EliColuna } from "./types-eli-tabela";
import type { tipoEliColuna } from "./types-eli-tabela";
type OrigemLista = "visiveis" | "invisiveis";
declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
aberto: {
@ -16,7 +16,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
required: true;
};
colunas: {
type: PropType<Array<EliColuna<any>>>;
type: PropType<Array<tipoEliColuna<any>>>;
required: true;
};
}>, {
@ -44,7 +44,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
required: true;
};
colunas: {
type: PropType<Array<EliColuna<any>>>;
type: PropType<Array<tipoEliColuna<any>>>;
required: true;
};
}>> & Readonly<{

View file

@ -1,7 +1,7 @@
import { PropType } from "vue";
import type { ComponenteEntrada } from "../EliEntrada/tiposEntradas";
import type { EliTabelaConsulta } from "./types-eli-tabela";
type FiltroBase<T> = NonNullable<EliTabelaConsulta<T>["filtroAvancado"]>[number];
import type { tipoEliTabelaConsulta } from "./types-eli-tabela";
type FiltroBase<T> = NonNullable<tipoEliTabelaConsulta<T>["filtroAvancado"]>[number];
type LinhaFiltro<T> = {
coluna: keyof T;
entrada: ComponenteEntrada;

View file

@ -1,9 +1,9 @@
import type { Component } from "vue";
import { PropType } from "vue";
import type { ComponenteCelula } from "../types-eli-tabela";
import type { tipoComponenteCelula } from "../types-eli-tabela";
declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
celula: {
type: PropType<ComponenteCelula>;
type: PropType<tipoComponenteCelula>;
required: true;
};
}>, {
@ -33,7 +33,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
}>;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
celula: {
type: PropType<ComponenteCelula>;
type: PropType<tipoComponenteCelula>;
required: true;
};
}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

View file

@ -1,8 +1,8 @@
import { PropType } from "vue";
import type { TiposTabelaCelulas } from "./tiposTabelaCelulas";
import type { tiposTabelaCelulas } from "./tiposTabelaCelulas";
declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
dados: {
type: PropType<TiposTabelaCelulas["data"]>;
type: PropType<tiposTabelaCelulas["data"]>;
required: false;
};
}>, {
@ -14,7 +14,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
textoData: import("vue").ComputedRef<string>;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
dados: {
type: PropType<TiposTabelaCelulas["data"]>;
type: PropType<tiposTabelaCelulas["data"]>;
required: false;
};
}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

View file

@ -1,8 +1,8 @@
import { PropType } from "vue";
import type { TiposTabelaCelulas } from "./tiposTabelaCelulas";
import type { tiposTabelaCelulas } from "./tiposTabelaCelulas";
declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
dados: {
type: PropType<TiposTabelaCelulas["numero"]>;
type: PropType<tiposTabelaCelulas["numero"]>;
};
}>, {
dados: {
@ -14,7 +14,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
textoNumero: import("vue").ComputedRef<string>;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
dados: {
type: PropType<TiposTabelaCelulas["numero"]>;
type: PropType<tiposTabelaCelulas["numero"]>;
};
}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
declare const _default: typeof __VLS_export;

View file

@ -1,8 +1,8 @@
import { PropType } from "vue";
import type { TiposTabelaCelulas } from "./tiposTabelaCelulas";
import type { tiposTabelaCelulas } from "./tiposTabelaCelulas";
declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
dados: {
type: PropType<TiposTabelaCelulas["tags"]>;
type: PropType<tiposTabelaCelulas["tags"]>;
required: false;
};
}>, {
@ -16,7 +16,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
} | undefined;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
dados: {
type: PropType<TiposTabelaCelulas["tags"]>;
type: PropType<tiposTabelaCelulas["tags"]>;
required: false;
};
}>> & Readonly<{}>, {}, {}, {

View file

@ -1,8 +1,8 @@
import { PropType } from "vue";
import type { TiposTabelaCelulas } from "./tiposTabelaCelulas";
import type { tiposTabelaCelulas } from "./tiposTabelaCelulas";
declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
dados: {
type: PropType<TiposTabelaCelulas["textoSimples"]>;
type: PropType<tiposTabelaCelulas["textoSimples"]>;
};
}>, {
dados: {
@ -11,7 +11,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
} | undefined;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
dados: {
type: PropType<TiposTabelaCelulas["textoSimples"]>;
type: PropType<tiposTabelaCelulas["textoSimples"]>;
};
}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
declare const _default: typeof __VLS_export;

View file

@ -1,8 +1,8 @@
import { PropType } from "vue";
import type { TiposTabelaCelulas } from "./tiposTabelaCelulas";
import type { tiposTabelaCelulas } from "./tiposTabelaCelulas";
declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
dados: {
type: PropType<TiposTabelaCelulas["textoTruncado"]>;
type: PropType<tiposTabelaCelulas["textoTruncado"]>;
};
}>, {
dados: {
@ -11,7 +11,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
} | undefined;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
dados: {
type: PropType<TiposTabelaCelulas["textoTruncado"]>;
type: PropType<tiposTabelaCelulas["textoTruncado"]>;
};
}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
declare const _default: typeof __VLS_export;

View file

@ -1,7 +1,7 @@
export declare const registryTabelaCelulas: {
readonly textoSimples: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
dados: {
type: import("vue").PropType<import("./tiposTabelaCelulas").TiposTabelaCelulas["textoSimples"]>;
type: import("vue").PropType<import("./tiposTabelaCelulas").tiposTabelaCelulas["textoSimples"]>;
};
}>, {
dados: {
@ -10,12 +10,12 @@ export declare const registryTabelaCelulas: {
} | undefined;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
dados: {
type: import("vue").PropType<import("./tiposTabelaCelulas").TiposTabelaCelulas["textoSimples"]>;
type: import("vue").PropType<import("./tiposTabelaCelulas").tiposTabelaCelulas["textoSimples"]>;
};
}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
readonly textoTruncado: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
dados: {
type: import("vue").PropType<import("./tiposTabelaCelulas").TiposTabelaCelulas["textoTruncado"]>;
type: import("vue").PropType<import("./tiposTabelaCelulas").tiposTabelaCelulas["textoTruncado"]>;
};
}>, {
dados: {
@ -24,12 +24,12 @@ export declare const registryTabelaCelulas: {
} | undefined;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
dados: {
type: import("vue").PropType<import("./tiposTabelaCelulas").TiposTabelaCelulas["textoTruncado"]>;
type: import("vue").PropType<import("./tiposTabelaCelulas").tiposTabelaCelulas["textoTruncado"]>;
};
}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
readonly numero: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
dados: {
type: import("vue").PropType<import("./tiposTabelaCelulas").TiposTabelaCelulas["numero"]>;
type: import("vue").PropType<import("./tiposTabelaCelulas").tiposTabelaCelulas["numero"]>;
};
}>, {
dados: {
@ -41,12 +41,12 @@ export declare const registryTabelaCelulas: {
textoNumero: import("vue").ComputedRef<string>;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
dados: {
type: import("vue").PropType<import("./tiposTabelaCelulas").TiposTabelaCelulas["numero"]>;
type: import("vue").PropType<import("./tiposTabelaCelulas").tiposTabelaCelulas["numero"]>;
};
}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
readonly tags: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
dados: {
type: import("vue").PropType<import("./tiposTabelaCelulas").TiposTabelaCelulas["tags"]>;
type: import("vue").PropType<import("./tiposTabelaCelulas").tiposTabelaCelulas["tags"]>;
required: false;
};
}>, {
@ -60,7 +60,7 @@ export declare const registryTabelaCelulas: {
} | undefined;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
dados: {
type: import("vue").PropType<import("./tiposTabelaCelulas").TiposTabelaCelulas["tags"]>;
type: import("vue").PropType<import("./tiposTabelaCelulas").tiposTabelaCelulas["tags"]>;
required: false;
};
}>> & Readonly<{}>, {}, {}, {
@ -725,7 +725,7 @@ export declare const registryTabelaCelulas: {
}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
readonly data: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
dados: {
type: import("vue").PropType<import("./tiposTabelaCelulas").TiposTabelaCelulas["data"]>;
type: import("vue").PropType<import("./tiposTabelaCelulas").tiposTabelaCelulas["data"]>;
required: false;
};
}>, {
@ -737,7 +737,7 @@ export declare const registryTabelaCelulas: {
textoData: import("vue").ComputedRef<string>;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
dados: {
type: import("vue").PropType<import("./tiposTabelaCelulas").TiposTabelaCelulas["data"]>;
type: import("vue").PropType<import("./tiposTabelaCelulas").tiposTabelaCelulas["data"]>;
required: false;
};
}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

View file

@ -2,7 +2,7 @@
* Tipagem dos dados de entrada dos componentes de celulas
*/
import type { LucideIcon } from "lucide-vue-next";
export type TiposTabelaCelulas = {
export type tiposTabelaCelulas = {
textoSimples: {
texto: string;
acao?: () => void;
@ -40,4 +40,4 @@ export type TiposTabelaCelulas = {
acao?: () => void;
};
};
export type TipoTabelaCelula = keyof TiposTabelaCelulas;
export type tipoTabelaCelula = keyof tiposTabelaCelulas;

View file

@ -1,20 +1,20 @@
import type { tipoResposta } from "p-respostas";
import type { LucideIcon } from "lucide-vue-next";
import type { TipoTabelaCelula, TiposTabelaCelulas } from "./celulas/tiposTabelaCelulas";
import type { tipoTabelaCelula, tiposTabelaCelulas } from "./celulas/tiposTabelaCelulas";
import { operadores, zFiltro } from "p-comuns";
import { ComponenteEntrada } from "../EliEntrada/tiposEntradas";
export type tipoFiltro = ReturnType<(typeof zFiltro)["parse"]>;
export type ComponenteCelulaBase<T extends TipoTabelaCelula> = readonly [T, TiposTabelaCelulas[T]];
export type ComponenteCelula = {
[K in TipoTabelaCelula]: ComponenteCelulaBase<K>;
}[TipoTabelaCelula];
export declare const celulaTabela: <T extends TipoTabelaCelula>(tipo: T, dados: TiposTabelaCelulas[T]) => ComponenteCelulaBase<T>;
export type { TipoTabelaCelula, TiposTabelaCelulas };
export type EliColuna<T> = {
export type tipoComponenteCelulaBase<T extends tipoTabelaCelula> = readonly [T, tiposTabelaCelulas[T]];
export type tipoComponenteCelula = {
[K in tipoTabelaCelula]: tipoComponenteCelulaBase<K>;
}[tipoTabelaCelula];
export declare const celulaTabela: <T extends tipoTabelaCelula>(tipo: T, dados: tiposTabelaCelulas[T]) => tipoComponenteCelulaBase<T>;
export type { tipoTabelaCelula, tiposTabelaCelulas };
export type tipoEliColuna<T> = {
/** Texto exibido no cabeçalho da coluna. */
rotulo: string;
/** Função responsável por renderizar o conteúdo da célula. */
celula: (linha: T) => ComponenteCelula;
celula: (linha: T) => tipoComponenteCelula;
/** Ação opcional disparada ao clicar na célula. */
/**
* Campo de ordenação associado à coluna. Caso informado, a coluna passa a
@ -27,13 +27,13 @@ export type EliColuna<T> = {
*/
visivel: boolean;
};
export type EliConsultaPaginada<T> = {
export type tipoEliConsultaPaginada<T> = {
/** Registros retornados na consulta. */
valores: T[];
/** Total de registros disponíveis no backend. */
quantidade: number;
};
export type EliTabelaAcao<T> = {
export type tipoEliTabelaAcao<T> = {
/** Ícone (Lucide) exibido para representar a ação. */
icone: LucideIcon;
/** Cor aplicada ao ícone e rótulo. */
@ -55,13 +55,13 @@ export type EliTabelaAcao<T> = {
* - `consulta`: função que recupera os dados, com suporte a ordenação/paginação
* - `mostrarCaixaDeBusca`: habilita um campo de busca textual no cabeçalho
*/
export type EliTabelaConsulta<T> = {
export type tipoEliTabelaConsulta<T> = {
/** nome da tabela, um identificador unico */
nome: string;
/** Indica se a caixa de busca deve ser exibida acima da tabela. */
mostrarCaixaDeBusca?: boolean;
/** Lista de colunas da tabela. */
colunas: EliColuna<T>[];
colunas: tipoEliColuna<T>[];
/** Quantidade de registros solicitados por consulta (padrão `10`). */
registros_por_consulta?: number;
/**
@ -76,13 +76,13 @@ export type EliTabelaConsulta<T> = {
limit?: number;
/** Texto digitado na caixa de busca, quando habilitada. */
texto_busca?: string;
}) => Promise<tipoResposta<EliConsultaPaginada<T>>>;
}) => Promise<tipoResposta<tipoEliConsultaPaginada<T>>>;
/** Quantidade máxima de botões exibidos na paginação (padrão `7`). */
maximo_botoes_paginacao?: number;
/** Mensagem exibida quando a consulta retorna ok porém sem dados. */
mensagemVazio?: string;
/** Ações exibidas à direita de cada linha. */
acoesLinha?: EliTabelaAcao<T>[];
acoesLinha?: tipoEliTabelaAcao<T>[];
/**
* Configurações dos botões que serão inseridos a direita da caixa de busca.
* Seu uso mais comum será para criar novos registros, mas poderá ter outras utilidades.

View file

@ -1,6 +1,6 @@
{
"name": "eli-vue",
"version": "0.1.85",
"version": "0.1.87",
"private": false,
"main": "./dist/eli-vue.umd.js",
"module": "./dist/eli-vue.es.js",

View file

@ -117,9 +117,9 @@ import EliTabelaMenuAcoes from "./EliTabelaMenuAcoes.vue";
import EliTabelaPaginacao from "./EliTabelaPaginacao.vue";
import EliTabelaModalColunas from "./EliTabelaModalColunas.vue";
import EliTabelaModalFiltroAvancado from "./EliTabelaModalFiltroAvancado.vue";
import type { EliColuna } from "./types-eli-tabela";
import type { tipoEliColuna } from "./types-eli-tabela";
/** Tipos da configuração/contrato da tabela */
import type { EliTabelaConsulta } from "./types-eli-tabela";
import type { tipoEliTabelaConsulta } from "./types-eli-tabela";
import type { tipoFiltro } from "./types-eli-tabela";
// operadores usados no tipo de configuração; o operador aplicado vem travado no filtroAvancado.
import {
@ -151,7 +151,7 @@ export default defineComponent({
props: {
/** Configuração principal da tabela (colunas, consulta e ações) */
tabela: {
type: Object as PropType<EliTabelaConsulta<any>>,
type: Object as PropType<tipoEliTabelaConsulta<any>>,
required: true,
},
},
@ -256,7 +256,7 @@ export default defineComponent({
const rotulosColunas = computed(() => props.tabela.colunas.map((c) => c.rotulo));
const colunasInvisiveisEfetivas = computed(() => {
const colunas = props.tabela.colunas as Array<EliColuna<any>>;
const colunas = props.tabela.colunas as Array<tipoEliColuna<any>>;
const configTemDados =
(configColunas.value.visiveis?.length ?? 0) > 0 ||
@ -271,12 +271,12 @@ export default defineComponent({
// ordenação: usa a lista (salva ou derivada do default) e adiciona novas ao final
const ordemSalva = invisiveisBaseRotulos;
const mapa = new Map<string, EliColuna<any>>();
const mapa = new Map<string, tipoEliColuna<any>>();
for (const c of base) {
if (!mapa.has(c.rotulo)) mapa.set(c.rotulo, c);
}
const ordenadas: Array<EliColuna<any>> = [];
const ordenadas: Array<tipoEliColuna<any>> = [];
for (const r of ordemSalva) {
const c = mapa.get(r);
if (c) ordenadas.push(c);
@ -300,7 +300,7 @@ export default defineComponent({
const invisiveisBaseRotulos = configTemDados
? configColunas.value.invisiveis ?? []
: (props.tabela.colunas as Array<EliColuna<any>>)
: (props.tabela.colunas as Array<tipoEliColuna<any>>)
.filter((c) => c.visivel === false)
.map((c) => c.rotulo);

View file

@ -77,7 +77,7 @@ import { defineComponent, PropType } from "vue";
import { ChevronDown, ChevronRight, MoreVertical } from "lucide-vue-next";
import EliTabelaCelula from "./celulas/EliTabelaCelula.vue";
import EliTabelaDetalhesLinha from "./EliTabelaDetalhesLinha.vue";
import type { EliColuna } from "./types-eli-tabela";
import type { tipoEliColuna } from "./types-eli-tabela";
export default defineComponent({
name: "EliTabelaBody",
@ -90,11 +90,11 @@ export default defineComponent({
},
props: {
colunas: {
type: Array as PropType<Array<EliColuna<any>>>,
type: Array as PropType<Array<tipoEliColuna<any>>>,
required: true,
},
colunasInvisiveis: {
type: Array as PropType<Array<EliColuna<any>>>,
type: Array as PropType<Array<tipoEliColuna<any>>>,
required: true,
},
temColunasInvisiveis: {

View file

@ -12,7 +12,7 @@
<script lang="ts">
import { defineComponent, PropType } from "vue";
import EliTabelaCelula from "./celulas/EliTabelaCelula.vue";
import type { EliColuna } from "./types-eli-tabela";
import type { tipoEliColuna } from "./types-eli-tabela";
export default defineComponent({
name: "EliTabelaDetalhesLinha",
@ -23,7 +23,7 @@ export default defineComponent({
required: true,
},
colunasInvisiveis: {
type: Array as PropType<Array<EliColuna<any>>>,
type: Array as PropType<Array<tipoEliColuna<any>>>,
required: true,
},
},

View file

@ -51,14 +51,14 @@
<script lang="ts">
import { defineComponent, PropType } from "vue";
import { ArrowDown, ArrowUp } from "lucide-vue-next";
import type { EliColuna } from "./types-eli-tabela";
import type { tipoEliColuna } from "./types-eli-tabela";
export default defineComponent({
name: "EliTabelaHead",
components: { ArrowUp, ArrowDown },
props: {
colunas: {
type: Array as PropType<Array<EliColuna<any>>>,
type: Array as PropType<Array<tipoEliColuna<any>>>,
required: true,
},
temAcoes: {

View file

@ -44,10 +44,10 @@
<script lang="ts">
import { computed, defineComponent, PropType, ref } from "vue";
import type { EliTabelaAcao } from "./types-eli-tabela";
import type { tipoEliTabelaAcao } from "./types-eli-tabela";
type ItemAcao<T> = {
acao: EliTabelaAcao<T>;
acao: tipoEliTabelaAcao<T>;
indice: number;
visivel: boolean;
};
@ -74,7 +74,7 @@ export default defineComponent({
},
},
emits: {
executar(payload: { acao: EliTabelaAcao<any>; linha: unknown }) {
executar(payload: { acao: tipoEliTabelaAcao<any>; linha: unknown }) {
return payload !== null && typeof payload === "object";
},
},
@ -84,7 +84,7 @@ export default defineComponent({
const possuiAcoes = computed(() => props.acoes.length > 0);
function emitExecutar(item: { acao: EliTabelaAcao<any> }) {
function emitExecutar(item: { acao: tipoEliTabelaAcao<any> }) {
if (!props.linha) return;
emit("executar", { acao: item.acao, linha: props.linha });
}

View file

@ -74,7 +74,7 @@
<script lang="ts">
import { defineComponent, PropType, ref, watch } from "vue";
import type { EliTabelaColunasConfig } from "./colunasStorage";
import type { EliColuna } from "./types-eli-tabela";
import type { tipoEliColuna } from "./types-eli-tabela";
type OrigemLista = "visiveis" | "invisiveis";
@ -102,7 +102,7 @@ export default defineComponent({
required: true,
},
colunas: {
type: Array as PropType<Array<EliColuna<any>>>,
type: Array as PropType<Array<tipoEliColuna<any>>>,
required: true,
},
},

View file

@ -77,9 +77,9 @@
import { computed, defineComponent, PropType, ref, watch } from "vue";
import { EliEntradaTexto, EliEntradaNumero, EliEntradaDataHora } from "../EliEntrada";
import type { ComponenteEntrada, TipoEntrada } from "../EliEntrada/tiposEntradas";
import type { EliTabelaConsulta } from "./types-eli-tabela";
import type { tipoEliTabelaConsulta } from "./types-eli-tabela";
type FiltroBase<T> = NonNullable<EliTabelaConsulta<T>["filtroAvancado"]>[number];
type FiltroBase<T> = NonNullable<tipoEliTabelaConsulta<T>["filtroAvancado"]>[number];
type LinhaFiltro<T> = {
coluna: keyof T;

View file

@ -11,7 +11,7 @@
import type { Component } from "vue";
import { computed, defineComponent, PropType } from "vue";
import type { ComponenteCelula, TipoTabelaCelula, TiposTabelaCelulas } from "../types-eli-tabela";
import type { tipoComponenteCelula, tipoTabelaCelula, tiposTabelaCelulas } from "../types-eli-tabela";
import { registryTabelaCelulas } from "./registryTabelaCelulas";
export default defineComponent({
@ -19,13 +19,13 @@ export default defineComponent({
props: {
celula: {
// `ComponenteCelula` é uma tupla `readonly [tipo, dados]`.
type: Array as unknown as PropType<ComponenteCelula>,
type: Array as unknown as PropType<tipoComponenteCelula>,
required: true,
},
},
setup(props) {
const tipo = computed(() => props.celula[0] as TipoTabelaCelula);
const dados = computed(() => props.celula[1] as TiposTabelaCelulas[TipoTabelaCelula]);
const tipo = computed(() => props.celula[0] as tipoTabelaCelula);
const dados = computed(() => props.celula[1] as tiposTabelaCelulas[tipoTabelaCelula]);
// Observação: mantemos o registry tipado, mas o TS do template não consegue
// fazer narrowing do componente com base em `tipo`, então tipamos como `Component`.

View file

@ -16,7 +16,7 @@ import { computed, defineComponent, PropType } from "vue";
import dayjs from "dayjs";
import relativeTime from "dayjs/plugin/relativeTime";
import type { TiposTabelaCelulas } from "./tiposTabelaCelulas";
import type { tiposTabelaCelulas } from "./tiposTabelaCelulas";
// Necessário para `fromNow()`.
dayjs.extend(relativeTime);
@ -25,7 +25,7 @@ export default defineComponent({
name: "EliTabelaCelulaData",
props: {
dados: {
type: Object as PropType<TiposTabelaCelulas["data"]>,
type: Object as PropType<tiposTabelaCelulas["data"]>,
required: false,
},
},

View file

@ -12,14 +12,14 @@
<script lang="ts">
import { computed, defineComponent, PropType } from "vue"
import type { TiposTabelaCelulas } from "./tiposTabelaCelulas";
import type { tiposTabelaCelulas } from "./tiposTabelaCelulas";
export default defineComponent({
name: "EliTabelaCelulaNumero",
components: {},
props: {
dados: {
type: Object as PropType<TiposTabelaCelulas["numero"]>,
type: Object as PropType<tiposTabelaCelulas["numero"]>,
},
},
setup({ dados }) {

View file

@ -26,14 +26,14 @@
import { defineComponent, PropType } from "vue";
import { VChip } from "vuetify/components";
import type { TiposTabelaCelulas } from "./tiposTabelaCelulas";
import type { tiposTabelaCelulas } from "./tiposTabelaCelulas";
export default defineComponent({
name: "EliTabelaCelulaTags",
components: { VChip },
props: {
dados: {
type: Object as PropType<TiposTabelaCelulas["tags"]>,
type: Object as PropType<tiposTabelaCelulas["tags"]>,
required: false,
},
},

View file

@ -12,14 +12,14 @@
<script lang="ts">
import { defineComponent, PropType } from "vue"
import type { TiposTabelaCelulas } from "./tiposTabelaCelulas";
import type { tiposTabelaCelulas } from "./tiposTabelaCelulas";
export default defineComponent({
name: "EliTabelaCelulaTextoSimples",
components: {},
props: {
dados: {
type: Object as PropType<TiposTabelaCelulas["textoSimples"]>,
type: Object as PropType<tiposTabelaCelulas["textoSimples"]>,
},
},
data() {

View file

@ -14,13 +14,13 @@
<script lang="ts">
import { defineComponent, PropType } from "vue";
import type { TiposTabelaCelulas } from "./tiposTabelaCelulas";
import type { tiposTabelaCelulas } from "./tiposTabelaCelulas";
export default defineComponent({
name: "EliTabelaCelulaTextoTruncado",
props: {
dados: {
type: Object as PropType<TiposTabelaCelulas["textoTruncado"]>,
type: Object as PropType<tiposTabelaCelulas["textoTruncado"]>,
},
},
setup({ dados }) {

View file

@ -5,7 +5,7 @@ import EliTabelaCelulaTextoTruncado from "./EliTabelaCelulaTextoTruncado.vue";
import EliTabelaCelulaNumero from "./EliTabelaCelulaNumero.vue";
import EliTabelaCelulaTags from "./EliTabelaCelulaTags.vue";
import EliTabelaCelulaData from "./EliTabelaCelulaData.vue";
import type { TipoTabelaCelula } from "./tiposTabelaCelulas";
import type { tipoTabelaCelula } from "./tiposTabelaCelulas";
export const registryTabelaCelulas = {
textoSimples: EliTabelaCelulaTextoSimples,
@ -13,4 +13,4 @@ export const registryTabelaCelulas = {
numero: EliTabelaCelulaNumero,
tags: EliTabelaCelulaTags,
data: EliTabelaCelulaData,
} as const satisfies Record<TipoTabelaCelula, Component>;
} as const satisfies Record<tipoTabelaCelula, Component>;

View file

@ -4,7 +4,7 @@
import type { LucideIcon } from "lucide-vue-next";
export type TiposTabelaCelulas = {
export type tiposTabelaCelulas = {
textoSimples: {
texto: string;
acao?: () => void;
@ -45,5 +45,5 @@ export type TiposTabelaCelulas = {
};
};
export type TipoTabelaCelula = keyof TiposTabelaCelulas;
export type tipoTabelaCelula = keyof tiposTabelaCelulas;

View file

@ -1,6 +1,6 @@
import type { tipoResposta } from "p-respostas";
import type { LucideIcon } from "lucide-vue-next";
import type { TipoTabelaCelula, TiposTabelaCelulas } from "./celulas/tiposTabelaCelulas";
import type { tipoTabelaCelula, tiposTabelaCelulas } from "./celulas/tiposTabelaCelulas";
import { operadores, zFiltro } from "p-comuns";
import { ComponenteEntrada } from "../EliEntrada/tiposEntradas";
@ -11,30 +11,30 @@ export type tipoFiltro = ReturnType<(typeof zFiltro)["parse"]>
export type ComponenteCelulaBase<T extends TipoTabelaCelula> =
readonly [T, TiposTabelaCelulas[T]]
export type tipoComponenteCelulaBase<T extends tipoTabelaCelula> =
readonly [T, tiposTabelaCelulas[T]]
export type ComponenteCelula = {
[K in TipoTabelaCelula]: ComponenteCelulaBase<K>
}[TipoTabelaCelula]
export type tipoComponenteCelula = {
[K in tipoTabelaCelula]: tipoComponenteCelulaBase<K>
}[tipoTabelaCelula]
export const celulaTabela = <T extends TipoTabelaCelula>(
export const celulaTabela = <T extends tipoTabelaCelula>(
tipo: T,
dados: TiposTabelaCelulas[T],
): ComponenteCelulaBase<T> => {
dados: tiposTabelaCelulas[T],
): tipoComponenteCelulaBase<T> => {
return [tipo, dados] as const
}
export type { TipoTabelaCelula, TiposTabelaCelulas };
export type { tipoTabelaCelula, tiposTabelaCelulas };
export type EliColuna<T> = {
export type tipoEliColuna<T> = {
/** Texto exibido no cabeçalho da coluna. */
rotulo: string;
/** Função responsável por renderizar o conteúdo da célula. */
celula: (linha: T) => ComponenteCelula;
celula: (linha: T) => tipoComponenteCelula;
/** Ação opcional disparada ao clicar na célula. */
/**
@ -50,14 +50,14 @@ export type EliColuna<T> = {
visivel: boolean
};
export type EliConsultaPaginada<T> = {
export type tipoEliConsultaPaginada<T> = {
/** Registros retornados na consulta. */
valores: T[];
/** Total de registros disponíveis no backend. */
quantidade: number;
};
export type EliTabelaAcao<T> = {
export type tipoEliTabelaAcao<T> = {
/** Ícone (Lucide) exibido para representar a ação. */
icone: LucideIcon;
/** Cor aplicada ao ícone e rótulo. */
@ -81,13 +81,13 @@ export type EliTabelaAcao<T> = {
* - `consulta`: função que recupera os dados, com suporte a ordenação/paginação
* - `mostrarCaixaDeBusca`: habilita um campo de busca textual no cabeçalho
*/
export type EliTabelaConsulta<T> = {
export type tipoEliTabelaConsulta<T> = {
/** nome da tabela, um identificador unico */
nome: string
/** Indica se a caixa de busca deve ser exibida acima da tabela. */
mostrarCaixaDeBusca?: boolean;
/** Lista de colunas da tabela. */
colunas: EliColuna<T>[];
colunas: tipoEliColuna<T>[];
/** Quantidade de registros solicitados por consulta (padrão `10`). */
registros_por_consulta?: number;
/**
@ -104,13 +104,13 @@ export type EliTabelaConsulta<T> = {
limit?: number;
/** Texto digitado na caixa de busca, quando habilitada. */
texto_busca?: string;
}) => Promise<tipoResposta<EliConsultaPaginada<T>>>;
}) => Promise<tipoResposta<tipoEliConsultaPaginada<T>>>;
/** Quantidade máxima de botões exibidos na paginação (padrão `7`). */
maximo_botoes_paginacao?: number;
/** Mensagem exibida quando a consulta retorna ok porém sem dados. */
mensagemVazio?: string;
/** Ações exibidas à direita de cada linha. */
acoesLinha?: EliTabelaAcao<T>[];
acoesLinha?: tipoEliTabelaAcao<T>[];
/**
* Configurações dos botões que serão inseridos a direita da caixa de busca.
* Seu uso mais comum será para criar novos registros, mas poderá ter outras utilidades.

View file

@ -17,7 +17,7 @@ import { codigosResposta } from "p-respostas";
import { BadgeCheck, Eye, Pencil, Plus, Trash2 } from "lucide-vue-next";
import { celulaTabela, EliTabela } from "@/componentes/EliTabela";
import type { ComponenteEntrada } from "@/componentes/EliEntrada/tiposEntradas";
import type { EliTabelaConsulta } from "@/componentes/EliTabela";
import type { tipoEliTabelaConsulta } from "@/componentes/EliTabela";
import type { tipoFiltro } from "@/componentes/EliTabela/types-eli-tabela";
type Linha = {
@ -36,7 +36,7 @@ export default defineComponent({
name: "TabelaPlayground",
components: { EliTabela },
setup() {
const acoesLinha: EliTabelaConsulta<Linha>["acoesLinha"] = [
const acoesLinha: tipoEliTabelaConsulta<Linha>["acoesLinha"] = [
{
icone: Eye,
cor: "#2563eb",
@ -392,7 +392,7 @@ export default defineComponent({
});
};
const tabelaOk: EliTabelaConsulta<Linha> = {
const tabelaOk: tipoEliTabelaConsulta<Linha> = {
nome: 'Exemplo',
registros_por_consulta: 10,
mostrarCaixaDeBusca: true,
@ -555,7 +555,7 @@ export default defineComponent({
},
};
const tabelaVazia: EliTabelaConsulta<Linha> = {
const tabelaVazia: tipoEliTabelaConsulta<Linha> = {
nome: "Exemplo",
registros_por_consulta: tabelaOk.registros_por_consulta,
mostrarCaixaDeBusca: tabelaOk.mostrarCaixaDeBusca,
@ -576,7 +576,7 @@ export default defineComponent({
acoesLinha: acoesLinha,
};
const tabelaErro: EliTabelaConsulta<Linha> = {
const tabelaErro: tipoEliTabelaConsulta<Linha> = {
nome: "Exemplo",
registros_por_consulta: tabelaOk.registros_por_consulta,
mostrarCaixaDeBusca: tabelaOk.mostrarCaixaDeBusca,