refactor(tipos): centralizar tipagens em src/tipos

This commit is contained in:
Luiz Silva 2026-01-02 21:24:44 -03:00
parent eb4538f4ba
commit 7c274583ec
8 changed files with 138 additions and 99 deletions

View file

@ -14,19 +14,7 @@
<script lang="ts">
import { defineComponent, PropType } from "vue";
type BotaoVariant =
| "elevated"
| "flat"
| "outlined"
| "text"
| "tonal"
type BotaoSize =
| "x-small"
| "small"
| "default"
| "large"
import type { BotaoTamanho, BotaoVariante } from "../../tipos";
export default defineComponent({
name: "EliBotao",
@ -40,12 +28,12 @@ export default defineComponent({
},
variant: {
type: String as PropType<BotaoVariant>,
type: String as PropType<BotaoVariante>,
default: "elevated",
},
size: {
type: String as PropType<BotaoSize>,
type: String as PropType<BotaoTamanho>,
default: "default",
},
@ -61,4 +49,4 @@ export default defineComponent({
}
})
</script>
</script>

View file

@ -99,63 +99,20 @@
<script lang="ts">
import { defineComponent, ref, computed, PropType } from "vue";
import type {
CampoDensidade,
CampoOpcao,
CampoOpcaoBruta,
CampoTipo,
CampoValor,
CampoValorMultiplo,
CampoVariante,
} from "../../tipos";
import { formatarCpfCnpj } from "./utils/cpfCnpj";
import { formatTelefone } from "./utils/telefone";
import { formatarDecimal, formatarMoeda, somenteNumeros } from "./utils/numerico"
import { formatarCep } from "./utils/cep";
/**
* Tipos base do EliInput.
* Mantidos aqui para evitar exports internos não documentados.
*/
type ValorCampo = string | number | boolean | null;
type ValorCampoMultiplo = ValorCampo[];
type OpcaoCampo<TValor extends ValorCampo = ValorCampo> = {
label: string;
value: TValor;
disabled?: boolean;
};
type OpcaoBruta<TValor extends ValorCampo = ValorCampo> =
| TValor
| {
label?: string;
value: TValor;
disabled?: boolean;
};
type InputVariant =
| "outlined"
| "filled"
| "plain"
| "solo"
| "solo-filled"
| "solo-inverted"
| "underlined";
type Density = "default" | "comfortable" | "compact";
type TipoNumerico =
| "numericoInteiro"
| "numericoDecimal"
| "numericoMoeda";
type InputType =
| "text"
| "password"
| "email"
| "search"
| "url"
| "textarea"
| "radio"
| "checkbox"
| "telefone"
| "cpfCnpj"
| "cep"
| "select"
| TipoNumerico;
export default defineComponent({
name: "EliInput",
inheritAttrs: false,
@ -166,10 +123,10 @@ export default defineComponent({
* O componente não converte tipos automaticamente: mantém o que receber.
*/
modelValue: {
type: [String, Number, Boolean, Array] as PropType<ValorCampo | ValorCampoMultiplo>,
type: [String, Number, Boolean, Array] as PropType<CampoValor | CampoValorMultiplo>,
default: "",
},
type: { type: String as PropType<InputType>, default: "text" },
type: { type: String as PropType<CampoTipo>, default: "text" },
label: String,
placeholder: String,
disabled: Boolean,
@ -186,12 +143,12 @@ export default defineComponent({
* Aceita lista normalizada ({ label, value }) ou valores primitivos.
*/
options: {
type: Array as PropType<Array<OpcaoBruta>>,
type: Array as PropType<Array<CampoOpcaoBruta>>,
default: () => [],
},
clearable: Boolean,
variant: { type: String as PropType<InputVariant>, default: "outlined" },
density: { type: String as PropType<Density>, default: "comfortable" },
variant: { type: String as PropType<CampoVariante>, default: "outlined" },
density: { type: String as PropType<CampoDensidade>, default: "comfortable" },
color: { type: String, default: "primary" },
row: Boolean,
showPasswordToggle: Boolean,
@ -207,7 +164,7 @@ export default defineComponent({
const value = computed({
get: () => props.modelValue,
set: (v: ValorCampo | ValorCampoMultiplo) => {
set: (v: CampoValor | CampoValorMultiplo) => {
emit("update:modelValue", v);
emit("change", v);
},
@ -287,11 +244,11 @@ export default defineComponent({
}
// --- Helpers para select / radio / checkbox (aceita objetos ou primitivos) ---
const computedItems = computed<Array<OpcaoCampo>>(() => {
const computedItems = computed<Array<CampoOpcao>>(() => {
// Normaliza options para [{ label, value, disabled? }]
return (props.options || []).map((o) => {
if (o && typeof o === "object" && "value" in o) {
const valor = o.value as ValorCampo;
const valor = o.value as CampoValor;
return {
label: o.label ?? String(valor),
value: valor,
@ -299,7 +256,7 @@ export default defineComponent({
};
}
const valor = o as ValorCampo;
const valor = o as CampoValor;
return { label: String(valor), value: valor };
});
});

View file

@ -20,24 +20,14 @@
<script lang="ts">
import { computed, defineComponent, PropType } from "vue";
import type {
CssLength,
IndicadorLocalizacao,
IndicadorOffset,
IndicadorPresetRaio,
} from "../../tipos";
type LocalBadge =
| "top right"
| "right center"
| "bottom right"
| "top center"
| "bottom center"
| "top left"
| "left center"
| "bottom left";
type Offset = "-20" | "-15" | "-10" | "-5" | "0" | "20" | "15" | "10" | "5";
type BadgeRadiusPreset = "suave" | "pill";
type CssLength = `${number}px` | `${number}rem` | `${number}%` | "0";
const RADIUS_MAP: Record<BadgeRadiusPreset, string> = {
const RADIUS_MAP: Record<IndicadorPresetRaio, string> = {
suave: "4px",
pill: "10px",
};
@ -54,17 +44,17 @@ export default defineComponent({
},
location: {
type: String as PropType<LocalBadge>,
type: String as PropType<IndicadorLocalizacao>,
default: "top right",
},
offsetX: {
type: String as PropType<Offset>,
type: String as PropType<IndicadorOffset>,
default: "0",
},
offsetY: {
type: String as PropType<Offset>,
type: String as PropType<IndicadorOffset>,
default: "0",
},
@ -85,7 +75,7 @@ export default defineComponent({
/** 🔥 NOVO: controla só o radius */
radius: {
type: String as PropType<BadgeRadiusPreset | CssLength>,
type: String as PropType<IndicadorPresetRaio | CssLength>,
default: "suave",
},
},
@ -95,7 +85,7 @@ export default defineComponent({
const resolvedRadius = computed(() => {
// preset conhecido
if (props.radius in RADIUS_MAP) {
return RADIUS_MAP[props.radius as BadgeRadiusPreset];
return RADIUS_MAP[props.radius as IndicadorPresetRaio];
}
// valor custom (ex: "8px", "50%", "0")