bkp

IA.md

@@ -69,6 +69,8 @@ import {
   EliEntradaTexto,
   EliEntradaNumero,
   EliEntradaDataHora,
+  EliEntradaParagrafo,
+  EliEntradaSelecao,
 } from "eli-vue";
 ```
 
@@ -116,6 +118,57 @@ export default defineComponent({
 </script>
 ```
 
+#### Parágrafo (textarea)
+
+```vue
+<template>
+  <EliEntradaParagrafo
+    v-model:value="descricao"
+    :opcoes="{ rotulo: 'Descrição', placeholder: 'Digite...', linhas: 5 }"
+  />
+</template>
+
+<script lang="ts">
+import { defineComponent, ref } from "vue";
+
+export default defineComponent({
+  setup() {
+    const descricao = ref<string | null>("");
+    return { descricao };
+  },
+});
+</script>
+```
+
+#### Seleção (select)
+
+```vue
+<template>
+  <EliEntradaSelecao
+    v-model:value="categoria"
+    :opcoes="{
+      rotulo: 'Categoria',
+      placeholder: 'Selecione...',
+      itens: async () => [
+        { chave: 'a', rotulo: 'Categoria A' },
+        { chave: 'b', rotulo: 'Categoria B' },
+      ],
+    }"
+  />
+</template>
+
+<script lang="ts">
+import { defineComponent, ref } from "vue";
+
+export default defineComponent({
+  setup() {
+    const categoria = ref<string | null>(null);
+    return { categoria };
+  },
+});
+</script>
+```
+
 #### Texto com formato/máscara
 
 > Regra importante: o `value` emitido é **sempre o texto formatado** (igual ao que aparece no input).
@@ -226,6 +279,48 @@ const tabela: EliTabelaConsulta<Linha> = {
     valor: { quantidade: 0, valores: [] },
   }),
 };
+
+```
+
+---
+
+## Células da EliTabela (celulaTabela)
+
+O `eli-vue` expõe o helper `celulaTabela(tipo, dados)` para construir células tipadas.
+
+Tipos disponíveis atualmente:
+
+- `textoSimples`: `{ texto: string; acao?: () => void }`
+- `textoTruncado`: `{ texto: string; acao?: () => void }`
+- `numero`: `{ numero: number; prefixo?: string; sufixo?: string; acao?: () => void }`
+- `tags`: `{ opcoes: { rotulo: string; cor?: string; icone?: LucideIcon; acao?: () => void }[] }`
+- `data`: `{ valor: string; formato: "data" | "data_hora" | "relativo"; acao?: () => void }`
+
+### Exemplo: célula `tags`
+
+```ts
+import { celulaTabela } from "eli-vue";
+import { BadgeCheck, Pencil } from "lucide-vue-next";
+
+celula: (l) =>
+  celulaTabela("tags", {
+    opcoes: [
+      { rotulo: "Ativo", cor: "success", icone: BadgeCheck },
+      { rotulo: "Editar", cor: "primary", icone: Pencil, acao: () => editar(l) },
+    ],
+  })
+```
+
+### Exemplo: célula `data`
+
+```ts
+import { celulaTabela } from "eli-vue";
+
+celula: (l) =>
+  celulaTabela("data", {
+    valor: l.criado_em, // ISO
+    formato: "data", // "data" | "data_hora" | "relativo"
+  })
 ```
 
 > Observação: em modo simulação/local, a tabela pode buscar uma lista completa e aplicar filtro/paginação localmente.