adiconado imput de porcentagem

src/componentes/campo/EliInput.vue

@@ -17,6 +17,7 @@
       :variant="variant"
       :color="internalColor"
       :inputmode="inputMode"
+      :suffix="type === 'porcentagem' ? '%' : undefined"
       v-bind="attrs"
       @focus="onFocus"
       @blur="onBlur"
@@ -110,7 +111,7 @@ import type {
 } from "../../tipos";
 import { formatarCpfCnpj } from "./utils/cpfCnpj";
 import { formatTelefone } from "./utils/telefone";
-import { formatarDecimal, formatarMoeda, somenteNumeros } from "./utils/numerico"
+import { formatarDecimal, formatarMoeda, formatarPorcentagem, somenteNumeros } from "./utils/numerico"
 import { formatarCep } from "./utils/cep";
 
 export default defineComponent({
@@ -182,6 +183,7 @@ export default defineComponent({
         "numericoInteiro",
         "numericoDecimal",
         "numericoMoeda",
+        "porcentagem",
         "cep",
       ].includes(props.type)
     );
@@ -196,6 +198,7 @@ export default defineComponent({
 
     const inputMode = computed(() => {
       if (props.type === "telefone") return "tel";
+      if (props.type === "porcentagem") return "decimal";
       if (props.type.startsWith("numerico")) return "numeric";
       return undefined;
     });
@@ -221,6 +224,10 @@ export default defineComponent({
           resultado = formatarMoeda(resultado);
           break;
 
+        case "porcentagem":
+          resultado = formatarPorcentagem(resultado);
+          break;
+
         case "telefone":
           resultado = formatTelefone(resultado);
           break;

src/componentes/campo/README.md

@@ -37,7 +37,7 @@ type Option = { label: string; value: ValorCampo; disabled?: boolean };
 
 type InputVariant = 'outlined' | 'filled' | 'plain' | 'solo' | 'solo-filled' | 'solo-inverted' | 'underlined';
 type Density = 'default' | 'comfortable' | 'compact';
-type TipoNumerico = 'numericoInteiro' | 'numericoDecimal' | 'numericoMoeda';
+type TipoNumerico = 'numericoInteiro' | 'numericoDecimal' | 'numericoMoeda' | 'porcentagem';
 
 type InputType =
   | 'text' | 'password' | 'email' | 'search' | 'url' | 'textarea'
@@ -103,6 +103,7 @@ type InputType =
 * numericoInteiro — remove tudo que não for dígito.
 * numericoDecimal — mantém separador decimal (aplica formatarDecimal).
 * numericoMoeda — formata para moeda conforme util (formatarMoeda).
+* porcentagem — aplica formatação decimal e exibe sufixo `%` automaticamente.
 * telefone — aplica máscara/format formatTelefone.
 * cpfCnpj — aplica formatarCpfCnpj.
 * cep — aplica formatarCep.

src/componentes/campo/utils/numerico.ts

@@ -8,6 +8,15 @@ export function formatarDecimal(valor: string) {
   return partes.length > 2 ? partes[0] + "," + partes.slice(1).join("") : limpo;
 }
 
+/**
+ * Formatação para percentual:
+ * - remove '%' caso venha junto (ex: colar "10%")
+ * - mantém apenas dígitos e vírgula (no máximo uma)
+ */
+export function formatarPorcentagem(valor: string) {
+  return formatarDecimal(valor.replace(/%/g, ""));
+}
+
 export function formatarMoeda(valor: string) {
   const numero = somenteNumeros(valor);
   if (!numero) return "";