bkp

dist/types/componentes/EliEntrada/EliEntradaDataHora.vue.d.ts

@@ -0,0 +1,231 @@
+import { PropType } from "vue";
+import type { CampoDensidade, CampoVariante } from "../../tipos";
+import type { PadroesEntradas } from "./tiposEntradas";
+type EntradaDataHora = PadroesEntradas["dataHora"];
+type PropsAntigas = {
+    modo?: "data" | "dataHora";
+    rotulo?: string;
+    placeholder?: string;
+    desabilitado?: boolean;
+    limpavel?: boolean;
+    erro?: boolean;
+    mensagensErro?: string | string[];
+    dica?: string;
+    dicaPersistente?: boolean;
+    densidade?: CampoDensidade;
+    variante?: CampoVariante;
+    min?: string;
+    max?: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    value: {
+        type: PropType<EntradaDataHora["value"]>;
+        default: undefined;
+    };
+    opcoes: {
+        type: PropType<EntradaDataHora["opcoes"]>;
+        required: false;
+        default: undefined;
+    };
+    modelValue: {
+        type: PropType<string | null>;
+        default: null;
+    };
+    modo: {
+        type: PropType<PropsAntigas["modo"]>;
+        default: undefined;
+    };
+    rotulo: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    placeholder: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    desabilitado: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    limpavel: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    erro: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    mensagensErro: {
+        type: PropType<string | string[]>;
+        default: undefined;
+    };
+    dica: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    dicaPersistente: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    densidade: {
+        type: PropType<CampoDensidade>;
+        default: undefined;
+    };
+    variante: {
+        type: PropType<CampoVariante>;
+        default: undefined;
+    };
+    min: {
+        type: PropType<string | undefined>;
+        default: undefined;
+    };
+    max: {
+        type: PropType<string | undefined>;
+        default: undefined;
+    };
+}>, {
+    attrs: {
+        [x: string]: unknown;
+    };
+    valor: import("vue").WritableComputedRef<string, string>;
+    tipoInput: import("vue").ComputedRef<"date" | "datetime-local">;
+    minLocal: import("vue").ComputedRef<string | undefined>;
+    maxLocal: import("vue").ComputedRef<string | undefined>;
+    opcoesEfetivas: import("vue").ComputedRef<{
+        rotulo: string;
+        placeholder?: string;
+    } & {
+        modo?: "data" | "dataHora";
+        limpavel?: boolean;
+        erro?: boolean;
+        mensagensErro?: string | string[];
+        dica?: string;
+        dicaPersistente?: boolean;
+        min?: string;
+        max?: string;
+        densidade?: import("../../tipos").CampoDensidade;
+        variante?: import("../../tipos").CampoVariante;
+    }>;
+    desabilitadoEfetivo: import("vue").ComputedRef<boolean>;
+    emitCompatFocus: () => void;
+    emitCompatBlur: () => void;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:value": (_v: string | null) => true;
+    input: (_v: string | null) => true;
+    change: (_v: string | null) => true;
+    "update:modelValue": (_v: string | null) => true;
+    alterar: (_v: string | null) => true;
+    foco: () => true;
+    desfoco: () => true;
+    focus: () => true;
+    blur: () => true;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    value: {
+        type: PropType<EntradaDataHora["value"]>;
+        default: undefined;
+    };
+    opcoes: {
+        type: PropType<EntradaDataHora["opcoes"]>;
+        required: false;
+        default: undefined;
+    };
+    modelValue: {
+        type: PropType<string | null>;
+        default: null;
+    };
+    modo: {
+        type: PropType<PropsAntigas["modo"]>;
+        default: undefined;
+    };
+    rotulo: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    placeholder: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    desabilitado: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    limpavel: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    erro: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    mensagensErro: {
+        type: PropType<string | string[]>;
+        default: undefined;
+    };
+    dica: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    dicaPersistente: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    densidade: {
+        type: PropType<CampoDensidade>;
+        default: undefined;
+    };
+    variante: {
+        type: PropType<CampoVariante>;
+        default: undefined;
+    };
+    min: {
+        type: PropType<string | undefined>;
+        default: undefined;
+    };
+    max: {
+        type: PropType<string | undefined>;
+        default: undefined;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((_v: string | null) => any) | undefined;
+    onChange?: ((_v: string | null) => any) | undefined;
+    onFocus?: (() => any) | undefined;
+    onBlur?: (() => any) | undefined;
+    onInput?: ((_v: string | null) => any) | undefined;
+    onAlterar?: ((_v: string | null) => any) | undefined;
+    "onUpdate:value"?: ((_v: string | null) => any) | undefined;
+    onFoco?: (() => any) | undefined;
+    onDesfoco?: (() => any) | undefined;
+}>, {
+    placeholder: string;
+    modelValue: string | null;
+    value: string | null | undefined;
+    max: string | undefined;
+    min: string | undefined;
+    erro: boolean;
+    rotulo: string;
+    modo: "data" | "dataHora" | undefined;
+    limpavel: boolean;
+    mensagensErro: string | string[];
+    dica: string;
+    dicaPersistente: boolean;
+    densidade: CampoDensidade;
+    variante: CampoVariante;
+    opcoes: {
+        rotulo: string;
+        placeholder?: string;
+    } & {
+        modo?: "data" | "dataHora";
+        limpavel?: boolean;
+        erro?: boolean;
+        mensagensErro?: string | string[];
+        dica?: string;
+        dicaPersistente?: boolean;
+        min?: string;
+        max?: string;
+        densidade?: import("../../tipos").CampoDensidade;
+        variante?: import("../../tipos").CampoVariante;
+    };
+    desabilitado: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

dist/types/componentes/EliEntrada/index.d.ts

@@ -1,4 +1,5 @@
 import EliEntradaTexto from "./EliEntradaTexto.vue";
 import EliEntradaNumero from "./EliEntradaNumero.vue";
-export { EliEntradaTexto, EliEntradaNumero };
+import EliEntradaDataHora from "./EliEntradaDataHora.vue";
+export { EliEntradaTexto, EliEntradaNumero, EliEntradaDataHora };
 export type { PadroesEntradas, TipoEntrada } from "./tiposEntradas";

dist/types/componentes/EliEntrada/registryEliEntradas.d.ts

@@ -103,4 +103,242 @@ export declare const registryTabelaCelulas: {
     }>, {
         value: number | null | undefined;
     }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+    readonly dataHora: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+        value: {
+            type: import("vue").PropType<string | null | undefined>;
+            default: undefined;
+        };
+        opcoes: {
+            type: import("vue").PropType<{
+                rotulo: string;
+                placeholder?: string;
+            } & {
+                modo?: "data" | "dataHora";
+                limpavel?: boolean;
+                erro?: boolean;
+                mensagensErro?: string | string[];
+                dica?: string;
+                dicaPersistente?: boolean;
+                min?: string;
+                max?: string;
+                densidade?: import("../../tipos/campo.js").CampoDensidade;
+                variante?: import("../../tipos/campo.js").CampoVariante;
+            }>;
+            required: false;
+            default: undefined;
+        };
+        modelValue: {
+            type: import("vue").PropType<string | null>;
+            default: null;
+        };
+        modo: {
+            type: import("vue").PropType<"data" | "dataHora" | undefined>;
+            default: undefined;
+        };
+        rotulo: {
+            type: StringConstructor;
+            default: undefined;
+        };
+        placeholder: {
+            type: StringConstructor;
+            default: undefined;
+        };
+        desabilitado: {
+            type: BooleanConstructor;
+            default: undefined;
+        };
+        limpavel: {
+            type: BooleanConstructor;
+            default: undefined;
+        };
+        erro: {
+            type: BooleanConstructor;
+            default: undefined;
+        };
+        mensagensErro: {
+            type: import("vue").PropType<string | string[]>;
+            default: undefined;
+        };
+        dica: {
+            type: StringConstructor;
+            default: undefined;
+        };
+        dicaPersistente: {
+            type: BooleanConstructor;
+            default: undefined;
+        };
+        densidade: {
+            type: import("vue").PropType<import("../../tipos/campo.js").CampoDensidade>;
+            default: undefined;
+        };
+        variante: {
+            type: import("vue").PropType<import("../../tipos/campo.js").CampoVariante>;
+            default: undefined;
+        };
+        min: {
+            type: import("vue").PropType<string | undefined>;
+            default: undefined;
+        };
+        max: {
+            type: import("vue").PropType<string | undefined>;
+            default: undefined;
+        };
+    }>, {
+        attrs: {
+            [x: string]: unknown;
+        };
+        valor: import("vue").WritableComputedRef<string, string>;
+        tipoInput: import("vue").ComputedRef<"date" | "datetime-local">;
+        minLocal: import("vue").ComputedRef<string | undefined>;
+        maxLocal: import("vue").ComputedRef<string | undefined>;
+        opcoesEfetivas: import("vue").ComputedRef<{
+            rotulo: string;
+            placeholder?: string;
+        } & {
+            modo?: "data" | "dataHora";
+            limpavel?: boolean;
+            erro?: boolean;
+            mensagensErro?: string | string[];
+            dica?: string;
+            dicaPersistente?: boolean;
+            min?: string;
+            max?: string;
+            densidade?: import("../../tipos/campo.js").CampoDensidade;
+            variante?: import("../../tipos/campo.js").CampoVariante;
+        }>;
+        desabilitadoEfetivo: import("vue").ComputedRef<boolean>;
+        emitCompatFocus: () => void;
+        emitCompatBlur: () => void;
+    }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+        "update:value": (_v: string | null) => true;
+        input: (_v: string | null) => true;
+        change: (_v: string | null) => true;
+        "update:modelValue": (_v: string | null) => true;
+        alterar: (_v: string | null) => true;
+        foco: () => true;
+        desfoco: () => true;
+        focus: () => true;
+        blur: () => true;
+    }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+        value: {
+            type: import("vue").PropType<string | null | undefined>;
+            default: undefined;
+        };
+        opcoes: {
+            type: import("vue").PropType<{
+                rotulo: string;
+                placeholder?: string;
+            } & {
+                modo?: "data" | "dataHora";
+                limpavel?: boolean;
+                erro?: boolean;
+                mensagensErro?: string | string[];
+                dica?: string;
+                dicaPersistente?: boolean;
+                min?: string;
+                max?: string;
+                densidade?: import("../../tipos/campo.js").CampoDensidade;
+                variante?: import("../../tipos/campo.js").CampoVariante;
+            }>;
+            required: false;
+            default: undefined;
+        };
+        modelValue: {
+            type: import("vue").PropType<string | null>;
+            default: null;
+        };
+        modo: {
+            type: import("vue").PropType<"data" | "dataHora" | undefined>;
+            default: undefined;
+        };
+        rotulo: {
+            type: StringConstructor;
+            default: undefined;
+        };
+        placeholder: {
+            type: StringConstructor;
+            default: undefined;
+        };
+        desabilitado: {
+            type: BooleanConstructor;
+            default: undefined;
+        };
+        limpavel: {
+            type: BooleanConstructor;
+            default: undefined;
+        };
+        erro: {
+            type: BooleanConstructor;
+            default: undefined;
+        };
+        mensagensErro: {
+            type: import("vue").PropType<string | string[]>;
+            default: undefined;
+        };
+        dica: {
+            type: StringConstructor;
+            default: undefined;
+        };
+        dicaPersistente: {
+            type: BooleanConstructor;
+            default: undefined;
+        };
+        densidade: {
+            type: import("vue").PropType<import("../../tipos/campo.js").CampoDensidade>;
+            default: undefined;
+        };
+        variante: {
+            type: import("vue").PropType<import("../../tipos/campo.js").CampoVariante>;
+            default: undefined;
+        };
+        min: {
+            type: import("vue").PropType<string | undefined>;
+            default: undefined;
+        };
+        max: {
+            type: import("vue").PropType<string | undefined>;
+            default: undefined;
+        };
+    }>> & Readonly<{
+        "onUpdate:modelValue"?: ((_v: string | null) => any) | undefined;
+        onChange?: ((_v: string | null) => any) | undefined;
+        onFocus?: (() => any) | undefined;
+        onBlur?: (() => any) | undefined;
+        onInput?: ((_v: string | null) => any) | undefined;
+        onAlterar?: ((_v: string | null) => any) | undefined;
+        "onUpdate:value"?: ((_v: string | null) => any) | undefined;
+        onFoco?: (() => any) | undefined;
+        onDesfoco?: (() => any) | undefined;
+    }>, {
+        placeholder: string;
+        modelValue: string | null;
+        value: string | null | undefined;
+        max: string | undefined;
+        min: string | undefined;
+        erro: boolean;
+        rotulo: string;
+        modo: "data" | "dataHora" | undefined;
+        limpavel: boolean;
+        mensagensErro: string | string[];
+        dica: string;
+        dicaPersistente: boolean;
+        densidade: import("../../tipos/campo.js").CampoDensidade;
+        variante: import("../../tipos/campo.js").CampoVariante;
+        opcoes: {
+            rotulo: string;
+            placeholder?: string;
+        } & {
+            modo?: "data" | "dataHora";
+            limpavel?: boolean;
+            erro?: boolean;
+            mensagensErro?: string | string[];
+            dica?: string;
+            dicaPersistente?: boolean;
+            min?: string;
+            max?: string;
+            densidade?: import("../../tipos/campo.js").CampoDensidade;
+            variante?: import("../../tipos/campo.js").CampoVariante;
+        };
+        desabilitado: boolean;
+    }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 };

dist/types/componentes/EliEntrada/tiposEntradas.d.ts

@@ -57,6 +57,28 @@ export type PadroesEntradas = {
          */
         precisao?: number;
     }>;
+    dataHora: tipoPadraoEntrada<string | null | undefined, {
+        /** Define o tipo de entrada. - `dataHora`: datetime-local - `data`: date */
+        modo?: "data" | "dataHora";
+        /** Se true, mostra ícone para limpar o valor (Vuetify clearable). */
+        limpavel?: boolean;
+        /** Estado de erro (visual). */
+        erro?: boolean;
+        /** Mensagens de erro. */
+        mensagensErro?: string | string[];
+        /** Texto de apoio. */
+        dica?: string;
+        /** Mantém a dica sempre visível. */
+        dicaPersistente?: boolean;
+        /** Valor mínimo permitido (ISO 8601 - offset ou Z). */
+        min?: string;
+        /** Valor máximo permitido (ISO 8601 - offset ou Z). */
+        max?: string;
+        /** Densidade do campo (Vuetify). */
+        densidade?: import("../../tipos").CampoDensidade;
+        /** Variante do v-text-field (Vuetify). */
+        variante?: import("../../tipos").CampoVariante;
+    }>;
 };
 /**
  * União dos tipos de entrada suportados.

dist/types/componentes/data_hora/EliDataHora.vue.d.ts

@@ -1,221 +0,0 @@
-import { PropType } from "vue";
-import type { CampoDensidade, CampoVariante } from "../../tipos";
-declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-    /**
-     * Valor em ISO 8601:
-     * - com offset (ex.: `2026-01-09T13:15:00-03:00`)
-     * - ou UTC absoluto (ex.: `2026-01-09T16:15:00Z`)
-     */
-    modelValue: {
-        type: PropType<string | null>;
-        default: null;
-    };
-    /**
-     * Define o tipo de entrada.
-     * - `dataHora`: usa `datetime-local`
-     * - `data`: usa `date`
-     */
-    modo: {
-        type: PropType<"data" | "dataHora">;
-        default: string;
-    };
-    /** Rótulo exibido no v-text-field (Vuetify). */
-    rotulo: {
-        type: StringConstructor;
-        default: string;
-    };
-    /** Placeholder do input. */
-    placeholder: {
-        type: StringConstructor;
-        default: string;
-    };
-    /** Desabilita a interação. */
-    desabilitado: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /** Se true, mostra ícone para limpar o valor (Vuetify clearable). */
-    limpavel: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /** Estado de erro (visual). */
-    erro: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /** Mensagens de erro. */
-    mensagensErro: {
-        type: PropType<string | string[]>;
-        default: () => never[];
-    };
-    /** Texto de apoio. */
-    dica: {
-        type: StringConstructor;
-        default: string;
-    };
-    /** Mantém a dica sempre visível. */
-    dicaPersistente: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /** Densidade do campo (Vuetify). */
-    densidade: {
-        type: PropType<CampoDensidade>;
-        default: string;
-    };
-    /** Variante do v-text-field (Vuetify). */
-    variante: {
-        type: PropType<CampoVariante>;
-        default: string;
-    };
-    /**
-     * Valor mínimo permitido.
-     * ISO 8601 (offset ou `Z`).
-     */
-    min: {
-        type: PropType<string | undefined>;
-        default: undefined;
-    };
-    /**
-     * Valor máximo permitido.
-     * ISO 8601 (offset ou `Z`).
-     */
-    max: {
-        type: PropType<string | undefined>;
-        default: undefined;
-    };
-}>, {
-    attrs: {
-        [x: string]: unknown;
-    };
-    valor: import("vue").WritableComputedRef<string, string>;
-    emit: ((event: "update:modelValue", _valor: string | null) => void) & ((event: "alterar", _valor: string | null) => void) & ((event: "foco") => void) & ((event: "desfoco") => void);
-    minLocal: import("vue").ComputedRef<string | undefined>;
-    maxLocal: import("vue").ComputedRef<string | undefined>;
-    tipoInput: import("vue").ComputedRef<"date" | "datetime-local">;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    /** v-model padrão. */
-    "update:modelValue": (_valor: string | null) => true;
-    /** Alias para consumidores que querem um evento semântico. */
-    alterar: (_valor: string | null) => true;
-    foco: () => true;
-    desfoco: () => true;
-}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    /**
-     * Valor em ISO 8601:
-     * - com offset (ex.: `2026-01-09T13:15:00-03:00`)
-     * - ou UTC absoluto (ex.: `2026-01-09T16:15:00Z`)
-     */
-    modelValue: {
-        type: PropType<string | null>;
-        default: null;
-    };
-    /**
-     * Define o tipo de entrada.
-     * - `dataHora`: usa `datetime-local`
-     * - `data`: usa `date`
-     */
-    modo: {
-        type: PropType<"data" | "dataHora">;
-        default: string;
-    };
-    /** Rótulo exibido no v-text-field (Vuetify). */
-    rotulo: {
-        type: StringConstructor;
-        default: string;
-    };
-    /** Placeholder do input. */
-    placeholder: {
-        type: StringConstructor;
-        default: string;
-    };
-    /** Desabilita a interação. */
-    desabilitado: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /** Se true, mostra ícone para limpar o valor (Vuetify clearable). */
-    limpavel: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /** Estado de erro (visual). */
-    erro: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /** Mensagens de erro. */
-    mensagensErro: {
-        type: PropType<string | string[]>;
-        default: () => never[];
-    };
-    /** Texto de apoio. */
-    dica: {
-        type: StringConstructor;
-        default: string;
-    };
-    /** Mantém a dica sempre visível. */
-    dicaPersistente: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    /** Densidade do campo (Vuetify). */
-    densidade: {
-        type: PropType<CampoDensidade>;
-        default: string;
-    };
-    /** Variante do v-text-field (Vuetify). */
-    variante: {
-        type: PropType<CampoVariante>;
-        default: string;
-    };
-    /**
-     * Valor mínimo permitido.
-     * ISO 8601 (offset ou `Z`).
-     */
-    min: {
-        type: PropType<string | undefined>;
-        default: undefined;
-    };
-    /**
-     * Valor máximo permitido.
-     * ISO 8601 (offset ou `Z`).
-     */
-    max: {
-        type: PropType<string | undefined>;
-        default: undefined;
-    };
-}>> & Readonly<{
-    "onUpdate:modelValue"?: ((_valor: string | null) => any) | undefined;
-    onAlterar?: ((_valor: string | null) => any) | undefined;
-    onFoco?: (() => any) | undefined;
-    onDesfoco?: (() => any) | undefined;
-}>, {
-    placeholder: string;
-    modelValue: string | null;
-    modo: "data" | "dataHora";
-    rotulo: string;
-    desabilitado: boolean;
-    limpavel: boolean;
-    erro: boolean;
-    mensagensErro: string | string[];
-    dica: string;
-    dicaPersistente: boolean;
-    densidade: CampoDensidade;
-    variante: CampoVariante;
-    min: string | undefined;
-    max: string | undefined;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
-/**
- * EliDataHora
- *
- * Campo para entrada de data + hora.
- *
- * Modelo:
- * - O componente **recebe** `modelValue` em ISO 8601 (UTC `Z` ou com offset)
- * - Converte para horário local para exibir (`date` ou `datetime-local`)
- * - Ao editar, **emite** ISO 8601 com o **offset local**
- */
-declare const _default: typeof __VLS_export;
-export default _default;

dist/types/componentes/data_hora/index.d.ts

@@ -1 +1 @@
-export { default as EliDataHora } from "./EliDataHora.vue";
+export { default as EliEntradaDataHora } from "../EliEntrada/EliEntradaDataHora.vue";

dist/types/index.d.ts

@@ -5,16 +5,14 @@ import { EliBotao } from "./componentes/botao";
 import { EliBadge } from "./componentes/indicador";
 import { EliInput } from "./componentes/campo";
 import { EliCartao } from "./componentes/cartao";
-import { EliDataHora } from "./componentes/data_hora";
 import { EliTabela } from "./componentes/EliTabela";
-import { EliEntradaTexto, EliEntradaNumero } from "./componentes/EliEntrada";
+import { EliEntradaTexto, EliEntradaNumero, EliEntradaDataHora } from "./componentes/EliEntrada";
 export { EliOlaMundo };
 export { EliBotao };
 export { EliBadge };
 export { EliInput };
 export { EliCartao };
-export { EliDataHora };
 export { EliTabela };
-export { EliEntradaTexto, EliEntradaNumero };
+export { EliEntradaTexto, EliEntradaNumero, EliEntradaDataHora };
 declare const EliVue: Plugin;
 export default EliVue;

package.json

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

src/componentes/EliEntrada/EliEntradaDataHora.vue

@@ -0,0 +1,220 @@
+<template>
+  <div class="eli-data-hora">
+    <v-text-field
+      v-model="valor"
+      :type="tipoInput"
+      :label="opcoesEfetivas.rotulo"
+      :placeholder="opcoesEfetivas.placeholder"
+      :disabled="desabilitadoEfetivo"
+      :clearable="Boolean(opcoesEfetivas.limpavel)"
+      :error="Boolean(opcoesEfetivas.erro)"
+      :error-messages="opcoesEfetivas.mensagensErro"
+      :hint="opcoesEfetivas.dica"
+      :persistent-hint="Boolean(opcoesEfetivas.dicaPersistente)"
+      :density="opcoesEfetivas.densidade ?? 'comfortable'"
+      :variant="opcoesEfetivas.variante ?? 'outlined'"
+      :min="minLocal"
+      :max="maxLocal"
+      v-bind="attrs"
+      @focus="emitCompatFocus"
+      @blur="emitCompatBlur"
+    />
+  </div>
+</template>
+
+<script lang="ts">
+import { computed, defineComponent, PropType } from "vue";
+import dayjs from "dayjs";
+import type { CampoDensidade, CampoVariante } from "../../tipos";
+import type { PadroesEntradas } from "./tiposEntradas";
+
+type EntradaDataHora = PadroesEntradas["dataHora"];
+
+type PropsAntigas = {
+  modo?: "data" | "dataHora";
+  rotulo?: string;
+  placeholder?: string;
+  desabilitado?: boolean;
+  limpavel?: boolean;
+  erro?: boolean;
+  mensagensErro?: string | string[];
+  dica?: string;
+  dicaPersistente?: boolean;
+  densidade?: CampoDensidade;
+  variante?: CampoVariante;
+  min?: string;
+  max?: string;
+};
+
+export default defineComponent({
+  name: "EliEntradaDataHora",
+  inheritAttrs: false,
+  props: {
+    // --- Novo padrão EliEntrada ---
+    value: {
+      type: String as PropType<EntradaDataHora["value"]>,
+      default: undefined,
+    },
+    opcoes: {
+      type: Object as PropType<EntradaDataHora["opcoes"]>,
+      required: false,
+      default: undefined,
+    },
+
+    // --- Compatibilidade com componente antigo EliDataHora ---
+    modelValue: {
+      type: String as PropType<string | null>,
+      default: null,
+    },
+    modo: { type: String as PropType<PropsAntigas["modo"]>, default: undefined },
+    rotulo: { type: String, default: undefined },
+    placeholder: { type: String, default: undefined },
+    desabilitado: { type: Boolean, default: undefined },
+    limpavel: { type: Boolean, default: undefined },
+    erro: { type: Boolean, default: undefined },
+    mensagensErro: {
+      type: [String, Array] as PropType<string | string[]>,
+      default: undefined,
+    },
+    dica: { type: String, default: undefined },
+    dicaPersistente: { type: Boolean, default: undefined },
+    densidade: { type: String as PropType<CampoDensidade>, default: undefined },
+    variante: { type: String as PropType<CampoVariante>, default: undefined },
+    min: { type: String as PropType<string | undefined>, default: undefined },
+    max: { type: String as PropType<string | undefined>, default: undefined },
+  },
+  emits: {
+    // Novo padrão
+    "update:value": (_v: string | null) => true,
+    input: (_v: string | null) => true, // compat Vue2
+    change: (_v: string | null) => true,
+
+    // Compat antigo
+    "update:modelValue": (_v: string | null) => true,
+    alterar: (_v: string | null) => true,
+    foco: () => true,
+    desfoco: () => true,
+    focus: () => true,
+    blur: () => true,
+  },
+  setup(props, { emit, attrs }) {
+    const opcoesEfetivas = computed<EntradaDataHora["opcoes"]>(() => {
+      // 1) se veio `opcoes` (novo), usa
+      if (props.opcoes) return props.opcoes;
+
+      // 2) fallback: constrói a partir das props antigas
+      return {
+        rotulo: props.rotulo ?? "Data e hora",
+        placeholder: props.placeholder ?? "",
+        modo: props.modo ?? "dataHora",
+        limpavel: props.limpavel,
+        erro: props.erro,
+        mensagensErro: props.mensagensErro,
+        dica: props.dica,
+        dicaPersistente: props.dicaPersistente,
+        densidade: props.densidade,
+        variante: props.variante,
+        min: props.min,
+        max: props.max,
+      };
+    });
+
+    const modoEfetivo = computed<"data" | "dataHora">(
+      () => opcoesEfetivas.value.modo ?? "dataHora"
+    );
+
+    const desabilitadoEfetivo = computed<boolean>(() => Boolean(props.desabilitado));
+
+    const tipoInput = computed<"date" | "datetime-local">(() =>
+      modoEfetivo.value === "data" ? "date" : "datetime-local"
+    );
+
+    function isoParaInputDatetime(valorIso: string): string {
+      if (modoEfetivo.value === "data") {
+        return dayjs(valorIso).format("YYYY-MM-DD");
+      }
+      return dayjs(valorIso).format("YYYY-MM-DDTHH:mm");
+    }
+
+    function inputDatetimeParaIsoLocal(valorInput: string): string {
+      if (modoEfetivo.value === "data") {
+        return dayjs(`${valorInput}T00:00`).format();
+      }
+      return dayjs(valorInput).format();
+    }
+
+    const effectiveModelValue = computed<string | null>(() => {
+      // Prioridade: value (novo) se vier definido; senão usa modelValue (antigo)
+      return props.value !== undefined ? (props.value ?? null) : props.modelValue;
+    });
+
+    const valor = computed<string>({
+      get: () => {
+        if (!effectiveModelValue.value) return "";
+        return isoParaInputDatetime(effectiveModelValue.value);
+      },
+      set: (v) => {
+        const normalizado = v && v.length > 0 ? v : null;
+        if (!normalizado) {
+          emit("update:value", null);
+          emit("input", null);
+          emit("change", null);
+
+          emit("update:modelValue", null);
+          emit("alterar", null);
+          return;
+        }
+
+        const valorEmitido = inputDatetimeParaIsoLocal(normalizado);
+
+        emit("update:value", valorEmitido);
+        emit("input", valorEmitido);
+        emit("change", valorEmitido);
+
+        emit("update:modelValue", valorEmitido);
+        emit("alterar", valorEmitido);
+      },
+    });
+
+    const minLocal = computed<string | undefined>(() => {
+      const min = opcoesEfetivas.value.min;
+      if (!min) return undefined;
+      return isoParaInputDatetime(min);
+    });
+
+    const maxLocal = computed<string | undefined>(() => {
+      const max = opcoesEfetivas.value.max;
+      if (!max) return undefined;
+      return isoParaInputDatetime(max);
+    });
+
+    function emitCompatFocus() {
+      emit("foco");
+      emit("focus");
+    }
+
+    function emitCompatBlur() {
+      emit("desfoco");
+      emit("blur");
+    }
+
+    return {
+      attrs,
+      valor,
+      tipoInput,
+      minLocal,
+      maxLocal,
+      opcoesEfetivas,
+      desabilitadoEfetivo,
+      emitCompatFocus,
+      emitCompatBlur,
+    };
+  },
+});
+</script>
+
+<style scoped>
+.eli-data-hora {
+  width: 100%;
+}
+</style>

src/componentes/EliEntrada/README.md

@@ -0,0 +1,176 @@
+# EliEntrada (Padrão de Entradas)
+
+Esta pasta define o **padrão EliEntrada**: um conjunto de componentes de entrada (inputs) com uma **API uniforme**.
+
+> TL;DR
+> - Toda entrada recebe **`value`** (estado) e **`opcoes`** (configuração).
+> - O padrão de uso é **`v-model:value`**.
+> - Mantemos compatibilidade com Vue 2 via evento **`input`**.
+
+---
+
+## Para humanos (uso no dia-a-dia)
+
+### Conceito
+
+Um componente **EliEntrada** recebe **duas propriedades**:
+
+- `value`: o valor atual do campo (entrada e saída)
+- `opcoes`: um objeto que configura o componente (rótulo, placeholder e opções específicas do tipo)
+
+Essa padronização facilita:
+- gerar formulários dinamicamente
+- trocar tipos de entrada com o mínimo de refactor
+- documentar e tipar de forma previsível
+
+### Tipos e contratos
+
+Os contratos ficam em: [`tiposEntradas.ts`](./tiposEntradas.ts)
+
+- `PadroesEntradas`: mapa de tipos suportados (ex.: `texto`, `numero`, `dataHora`)
+- `TipoEntrada`: união das chaves do mapa (ex.: `"texto" | "numero" | "dataHora"`)
+
+### Componentes disponíveis
+
+#### 1) `EliEntradaTexto`
+
+**Value**: `string | null | undefined`
+
+**Opções** (além de `rotulo`/`placeholder`):
+- `limiteCaracteres?: number`
+
+Exemplo:
+
+```vue
+<template>
+  <EliEntradaTexto
+    v-model:value="nome"
+    :opcoes="{ rotulo: 'Nome', placeholder: 'Digite seu nome', limiteCaracteres: 50 }"
+  />
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import { EliEntradaTexto } from '@/index'
+
+const nome = ref<string | null>(null)
+</script>
+```
+
+---
+
+#### 2) `EliEntradaNumero`
+
+**Value**: `number | null | undefined`
+
+**Opções**:
+- `precisao?: number`
+  - `1`    => inteiro
+  - `0.1`  => 1 casa decimal
+  - `0.01` => 2 casas decimais
+- `prefixo?: string` (ex.: `"R$"`)
+- `sufixo?: string` (ex.: `"kg"`)
+
+Comportamento:
+- Quando `precisao < 1` o componente entra em modo **fixed-point**: você digita números continuamente e ele insere a vírgula automaticamente.
+- O que é exibido sempre corresponde ao `value` emitido.
+
+Exemplos:
+
+```vue
+<EliEntradaNumero
+  v-model:value="quantidade"
+  :opcoes="{ rotulo: 'Quantidade', placeholder: 'Ex: 10', precisao: 1, sufixo: 'kg' }"
+/>
+
+<EliEntradaNumero
+  v-model:value="preco"
+  :opcoes="{ rotulo: 'Preço', placeholder: 'Digite', precisao: 0.01, prefixo: 'R$' }"
+/>
+```
+
+---
+
+#### 3) `EliEntradaDataHora`
+
+**Value**: `string | null | undefined` (ISO 8601 com offset ou `Z`)
+
+**Opções**:
+- `modo?: "data" | "dataHora"` (default: `dataHora`)
+- `min?: string` (ISO)
+- `max?: string` (ISO)
+- `limpavel?: boolean`
+- `erro?: boolean`
+- `mensagensErro?: string | string[]`
+- `dica?: string`
+- `dicaPersistente?: boolean`
+- `densidade?: CampoDensidade`
+- `variante?: CampoVariante`
+
+Importante:
+- O input nativo `datetime-local` não carrega timezone.
+- O componente converte ISO (Z/offset) para **local** para exibir.
+- Ao alterar, emite ISO 8601 com o **offset local**.
+
+Exemplo:
+
+```vue
+<EliEntradaDataHora
+  v-model:value="agendamento"
+  :opcoes="{ rotulo: 'Agendar', modo: 'dataHora', min, max, limpavel: true }"
+/>
+```
+
+### Compatibilidade Vue 2 / Vue 3
+
+Padrão recomendado (Vue 3):
+- `v-model:value`
+
+Compat Vue 2:
+- todos os EliEntradas também emitem `input`.
+- isso permite consumir com o padrão `value + input` quando necessário.
+
+### Playground
+
+- Entradas: `src/playground/entradas.playground.vue`
+- Data/hora: `src/playground/data_hora.playground.vue`
+
+---
+
+## Para IA (contratos, invariantes e padrões de evolução)
+
+### Contratos (não quebrar)
+
+1) **Todo EliEntrada tem**:
+   - prop `value`
+   - prop `opcoes`
+   - evento `update:value`
+
+2) **Compatibilidade**:
+   - emitir `input` (compat Vue 2) é obrigatório
+
+3) **Tipagem**:
+   - `PadroesEntradas` é a fonte única do contrato (value/opcoes)
+   - `TipoEntrada = keyof PadroesEntradas`
+
+4) **Sanitização/Normalização**:
+   - `EliEntradaNumero` deve bloquear caracteres inválidos e manter display coerente com `value`
+   - `EliEntradaDataHora` deve receber/emitir ISO e converter para local apenas para exibição
+
+### Como adicionar uma nova entrada (checklist)
+
+1) Adicionar chave em `PadroesEntradas` em `tiposEntradas.ts`
+2) Criar `EliEntradaX.vue` seguindo o padrão:
+   - `value` + `opcoes`
+   - emite `update:value`, `input`, `change`
+3) Exportar no `src/componentes/EliEntrada/index.ts`
+4) Registrar no `src/componentes/EliEntrada/registryEliEntradas.ts`
+5) Criar/atualizar playground (`src/playground/*.playground.vue`)
+6) Validar `pnpm -s run build:types` e `pnpm -s run build`
+
+### Padrões de mudança (refactors seguros)
+
+- Se precisar mudar o contrato, faça **migração incremental**:
+  - manter props/eventos antigos como fallback temporário
+  - atualizar playground e exemplos
+  - rodar `build:types` para garantir geração de `.d.ts`

src/componentes/EliEntrada/index.ts

@@ -1,5 +1,6 @@
 import EliEntradaTexto from "./EliEntradaTexto.vue";
 import EliEntradaNumero from "./EliEntradaNumero.vue";
+import EliEntradaDataHora from "./EliEntradaDataHora.vue";
 
-export { EliEntradaTexto, EliEntradaNumero };
+export { EliEntradaTexto, EliEntradaNumero, EliEntradaDataHora };
 export type { PadroesEntradas, TipoEntrada } from "./tiposEntradas";

src/componentes/EliEntrada/registryEliEntradas.ts

@@ -2,10 +2,12 @@ import type { Component } from "vue";
 
 import EliEntradaTexto from "./EliEntradaTexto.vue";
 import EliEntradaNumero from "./EliEntradaNumero.vue";
+import EliEntradaDataHora from "./EliEntradaDataHora.vue";
 
 import type { TipoEntrada } from "./tiposEntradas";
 
 export const registryTabelaCelulas = {
   texto: EliEntradaTexto,
   numero: EliEntradaNumero,
+  dataHora: EliEntradaDataHora,
 } as const satisfies Record<TipoEntrada, Component>;

src/componentes/EliEntrada/tiposEntradas.ts

@@ -72,6 +72,41 @@ export type PadroesEntradas = {
       precisao?: number
     }
   >
+
+  dataHora: tipoPadraoEntrada<
+    string | null | undefined,
+    {
+      /** Define o tipo de entrada. - `dataHora`: datetime-local - `data`: date */
+      modo?: "data" | "dataHora"
+
+      /** Se true, mostra ícone para limpar o valor (Vuetify clearable). */
+      limpavel?: boolean
+
+      /** Estado de erro (visual). */
+      erro?: boolean
+
+      /** Mensagens de erro. */
+      mensagensErro?: string | string[]
+
+      /** Texto de apoio. */
+      dica?: string
+
+      /** Mantém a dica sempre visível. */
+      dicaPersistente?: boolean
+
+      /** Valor mínimo permitido (ISO 8601 - offset ou Z). */
+      min?: string
+
+      /** Valor máximo permitido (ISO 8601 - offset ou Z). */
+      max?: string
+
+      /** Densidade do campo (Vuetify). */
+      densidade?: import("../../tipos").CampoDensidade
+
+      /** Variante do v-text-field (Vuetify). */
+      variante?: import("../../tipos").CampoVariante
+    }
+  >
 }
 
 /**

src/componentes/data_hora/EliDataHora.vue

@@ -1,231 +0,0 @@
-<template>
-  <div class="eli-data-hora">
-    <!--
-      Implementação propositalmente “simples” e estável:
-      - Usa o input nativo `datetime-local` (ou `date`) dentro do v-text-field.
-      - Evita depender de componentes experimentais (labs) do Vuetify.
-      - Recebe ISO 8601 (UTC/offset) e emite ISO 8601 com offset local.
-
-      Observação importante:
-      - `datetime-local` NÃO armazena timezone.
-      - Este componente converte a entrada para local para exibir ao usuário.
-    -->
-    <v-text-field
-      v-model="valor"
-      :type="tipoInput"
-      :label="rotulo"
-      :placeholder="placeholder"
-      :disabled="desabilitado"
-      :clearable="limpavel"
-      :error="erro"
-      :error-messages="mensagensErro"
-      :hint="dica"
-      :persistent-hint="dicaPersistente"
-      :density="densidade"
-      :variant="variante"
-      :min="minLocal"
-      :max="maxLocal"
-      v-bind="attrs"
-      @focus="emit('foco')"
-      @blur="emit('desfoco')"
-    />
-  </div>
-</template>
-
-<script lang="ts">
-import { computed, defineComponent, PropType } from "vue";
-import dayjs from "dayjs";
-import type { CampoDensidade, CampoVariante } from "../../tipos";
-
-/**
- * EliDataHora
- *
- * Campo para entrada de data + hora.
- *
- * Modelo:
- * - O componente **recebe** `modelValue` em ISO 8601 (UTC `Z` ou com offset)
- * - Converte para horário local para exibir (`date` ou `datetime-local`)
- * - Ao editar, **emite** ISO 8601 com o **offset local**
- */
-export default defineComponent({
-  name: "EliDataHora",
-  inheritAttrs: false,
-
-  props: {
-    /**
-     * Valor em ISO 8601:
-     * - com offset (ex.: `2026-01-09T13:15:00-03:00`)
-     * - ou UTC absoluto (ex.: `2026-01-09T16:15:00Z`)
-     */
-    modelValue: {
-      type: String as PropType<string | null>,
-      default: null,
-    },
-
-    /**
-     * Define o tipo de entrada.
-     * - `dataHora`: usa `datetime-local`
-     * - `data`: usa `date`
-     */
-    modo: {
-      type: String as PropType<"data" | "dataHora">,
-      default: "dataHora",
-    },
-
-    /** Rótulo exibido no v-text-field (Vuetify). */
-    rotulo: {
-      type: String,
-      default: "Data e hora",
-    },
-
-    /** Placeholder do input. */
-    placeholder: {
-      type: String,
-      default: "",
-    },
-
-    /** Desabilita a interação. */
-    desabilitado: {
-      type: Boolean,
-      default: false,
-    },
-
-    /** Se true, mostra ícone para limpar o valor (Vuetify clearable). */
-    limpavel: {
-      type: Boolean,
-      default: false,
-    },
-
-    /** Estado de erro (visual). */
-    erro: {
-      type: Boolean,
-      default: false,
-    },
-
-    /** Mensagens de erro. */
-    mensagensErro: {
-      type: [String, Array] as PropType<string | string[]>,
-      default: () => [],
-    },
-
-    /** Texto de apoio. */
-    dica: {
-      type: String,
-      default: "",
-    },
-
-    /** Mantém a dica sempre visível. */
-    dicaPersistente: {
-      type: Boolean,
-      default: false,
-    },
-
-    /** Densidade do campo (Vuetify). */
-    densidade: {
-      type: String as PropType<CampoDensidade>,
-      default: "comfortable",
-    },
-
-    /** Variante do v-text-field (Vuetify). */
-    variante: {
-      type: String as PropType<CampoVariante>,
-      default: "outlined",
-    },
-
-    /**
-     * Valor mínimo permitido.
-     * ISO 8601 (offset ou `Z`).
-     */
-    min: {
-      // ISO 8601 (offset ou Z)
-      type: String as PropType<string | undefined>,
-      default: undefined,
-    },
-
-    /**
-     * Valor máximo permitido.
-     * ISO 8601 (offset ou `Z`).
-     */
-    max: {
-      // ISO 8601 (offset ou Z)
-      type: String as PropType<string | undefined>,
-      default: undefined,
-    },
-  },
-
-  emits: {
-    /** v-model padrão. */
-    "update:modelValue": (_valor: string | null) => true,
-    /** Alias para consumidores que querem um evento semântico. */
-    alterar: (_valor: string | null) => true,
-    foco: () => true,
-    desfoco: () => true,
-  },
-
-  setup(props, { emit, attrs }) {
-    const tipoInput = computed<"date" | "datetime-local">(() =>
-      props.modo === "data" ? "date" : "datetime-local"
-    );
-
-    // Converte ISO (Z/offset) para o formato que o `datetime-local` aceita.
-    function isoParaInputDatetime(valorIso: string): string {
-      // `dayjs(valorIso)` interpreta ISO com timezone e converte para o local do usuário.
-      if (props.modo === "data") {
-        return dayjs(valorIso).format("YYYY-MM-DD");
-      }
-
-      return dayjs(valorIso).format("YYYY-MM-DDTHH:mm");
-    }
-
-    // Converte o valor do input (`YYYY-MM-DDTHH:mm`) para ISO 8601 com offset local.
-    function inputDatetimeParaIsoLocal(valorInput: string): string {
-      // `format()` retorna ISO 8601 com offset local.
-      // Em modo `data`, normalizamos para o começo do dia (00:00:00) no fuso local.
-      if (props.modo === "data") {
-        return dayjs(`${valorInput}T00:00`).format();
-      }
-
-      return dayjs(valorInput).format();
-    }
-
-    const valor = computed<string>({
-      get: () => {
-        if (!props.modelValue) return "";
-        return isoParaInputDatetime(props.modelValue);
-      },
-      set: (v) => {
-        // O `datetime-local` entrega string ou "" quando limpo.
-        const normalizado = v && v.length > 0 ? v : null;
-        if (!normalizado) {
-          emit("update:modelValue", null);
-          emit("alterar", null);
-          return;
-        }
-
-        const valorEmitido = inputDatetimeParaIsoLocal(normalizado);
-        emit("update:modelValue", valorEmitido);
-        emit("alterar", valorEmitido);
-      },
-    });
-
-    const minLocal = computed<string | undefined>(() => {
-      if (!props.min) return undefined;
-      return isoParaInputDatetime(props.min);
-    });
-
-    const maxLocal = computed<string | undefined>(() => {
-      if (!props.max) return undefined;
-      return isoParaInputDatetime(props.max);
-    });
-
-    return { attrs, valor, emit, minLocal, maxLocal, tipoInput };
-  },
-});
-</script>
-
-<style scoped>
-.eli-data-hora {
-  width: 100%;
-}
-</style>
-

src/componentes/data_hora/index.ts

@@ -1 +1 @@
-export { default as EliDataHora } from "./EliDataHora.vue";
+export { default as EliEntradaDataHora } from "../EliEntrada/EliEntradaDataHora.vue";

src/index.ts

@@ -5,18 +5,16 @@ import { EliBotao } from "./componentes/botao";
 import { EliBadge } from "./componentes/indicador";
 import { EliInput } from "./componentes/campo";
 import { EliCartao } from "./componentes/cartao";
-import { EliDataHora } from "./componentes/data_hora";
 import { EliTabela } from "./componentes/EliTabela";
-import { EliEntradaTexto, EliEntradaNumero } from "./componentes/EliEntrada";
+import { EliEntradaTexto, EliEntradaNumero, EliEntradaDataHora } from "./componentes/EliEntrada";
 
 export { EliOlaMundo };
 export { EliBotao };
 export { EliBadge };
 export { EliInput };
 export { EliCartao };
-export { EliDataHora };
 export { EliTabela };
-export { EliEntradaTexto, EliEntradaNumero };
+export { EliEntradaTexto, EliEntradaNumero, EliEntradaDataHora };
 
 const EliVue: Plugin = {
   install(app: App) {
@@ -25,10 +23,10 @@ const EliVue: Plugin = {
     app.component("EliBadge", EliBadge);
     app.component("EliInput", EliInput);
     app.component("EliCartao", EliCartao);
-    app.component("EliDataHora", EliDataHora);
     app.component("EliTabela", EliTabela);
     app.component("EliEntradaTexto", EliEntradaTexto);
     app.component("EliEntradaNumero", EliEntradaNumero);
+    app.component("EliEntradaDataHora", EliEntradaDataHora);
   },
 };
 

src/playground/data_hora.playground.vue

@@ -2,12 +2,52 @@
   <section class="stack">
     <h2>EliDataHora (entrada de data e hora)</h2>
 
+    <h3 class="mt-2">Novo padrão (EliEntradaDataHora: value + opcoes)</h3>
+
     <div class="grid">
-      <!-- variação 1: padrão -->
+      <EliEntradaDataHora
-      <EliDataHora v-model="dataHora" />
+        v-model:value="dataHora"
+        :opcoes="{
+          rotulo: 'Data e hora (novo)',
+          placeholder: 'Selecione',
+          modo: 'dataHora',
+        }"
+      />
+
+      <EliEntradaDataHora
+        v-model:value="somenteData"
+        :opcoes="{
+          rotulo: 'Somente data (novo)',
+          modo: 'data',
+          dica: 'Emite ISO com offset local às 00:00:00',
+          dicaPersistente: true,
+        }"
+      />
+
+      <EliEntradaDataHora
+        v-model:value="dataHoraComLimite"
+        :opcoes="{
+          rotulo: 'Agendamento (novo, com limite)',
+          modo: 'dataHora',
+          min,
+          max,
+          limpavel: true,
+          dica: 'Escolha um horário dentro do intervalo',
+          dicaPersistente: true,
+        }"
+      />
+    </div>
+
+    <v-divider class="my-6" />
+
+    <h3 class="mt-2">Compat (API antiga usando o mesmo componente)</h3>
+
+    <div class="grid">
+      <!-- variação 1: padrão (API antiga via props) -->
+      <EliEntradaDataHora v-model="dataHora" />
 
       <!-- variação 1a: somente data -->
-      <EliDataHora
+      <EliEntradaDataHora
         v-model="somenteData"
         modo="data"
         rotulo="Somente data"
@@ -16,7 +56,7 @@
       />
 
       <!-- variação 1b: recebendo UTC (Z) e exibindo local -->
-      <EliDataHora
+      <EliEntradaDataHora
         v-model="dataHoraUtcEntrada"
         rotulo="Entrada vinda do backend (UTC/Z)"
         dica="O valor chega em UTC, mas o campo mostra em horário local"
@@ -24,7 +64,7 @@
       />
 
       <!-- variação 2: com limites min/max -->
-      <EliDataHora
+      <EliEntradaDataHora
         v-model="dataHoraComLimite"
         rotulo="Agendamento (com limite)"
         :min="min"
@@ -35,21 +75,17 @@
       />
 
       <!-- variação 3: estado de erro + desabilitado -->
-      <EliDataHora
+      <EliEntradaDataHora
         v-model="dataHoraObrigatoria"
         rotulo="Obrigatório"
         :erro="!dataHoraObrigatoria"
         :mensagens-erro="!dataHoraObrigatoria ? ['Obrigatório'] : []"
       />
 
-      <EliDataHora
+      <EliEntradaDataHora v-model="dataHoraDesabilitado" rotulo="Desabilitado" desabilitado />
-        v-model="dataHoraDesabilitado"
-        rotulo="Desabilitado"
-        desabilitado
-      />
 
       <!-- variação 4: saída sempre em ISO com offset local -->
-      <EliDataHora
+      <EliEntradaDataHora
         v-model="dataHoraUtcEmitida"
         rotulo="Emitindo ISO com offset local"
         dica="Ao alterar, o v-model vira ISO 8601 com offset do seu fuso"
@@ -63,11 +99,12 @@
 
 <script lang="ts">
 import { computed, defineComponent, ref } from "vue";
-import { EliDataHora } from "@/componentes/data_hora";
+import { EliEntradaDataHora } from "@/componentes/EliEntrada";
+import { VDivider } from "vuetify/components";
 
 export default defineComponent({
   name: "DataHoraPlayground",
-  components: { EliDataHora },
+  components: { EliEntradaDataHora, VDivider },
   setup() {
     const dataHora = ref<string | null>("2026-01-09T13:15:00-03:00");