Recurso
Base

Utilitários server-safe

Os utilitários exportados pelo entry server podem ser usados em Server Components, testes e código compartilhado. Eles não carregam hooks de cliente.

Utilitários públicos

Preview com as saídas atuais dos helpers exportados por cosmemilton-ui/server.

Classescm-card cm-card--active
NCM formatado0101.21.00
Data formatada31/05/2026
CPF formatado123.456.789-09
CNPJ numérico11.222.333/0001-81
CNPJ alfanumérico12.ABC.345/01DE-35
Telefone celular(11) 98765-4321
Densidadecm-density-compact
Tamanho CSS24px
Espaçamento CSSvar(--space-md, 1rem)
Valor responsivo{"base":"grid","sm":"grid","md":"flex","lg":"flex","xl":"flex"}
Número responsivo{"base":1,"sm":1,"md":1,"lg":3,"xl":3}

Snippets

Trechos prontos para colar no projeto.

Imports públicos

tsx
import {
  cn,
  cmDensityClass,
  cmSizeValue,
  cmSpacingValue,
  formatCNPJ,
  formatCPF,
  formatDate,
  formatNCM,
  formatPhone,
  resolveResponsiveNumber,
  resolveResponsiveValue,
} from "cosmemilton-ui/server";

Classe e formatação geral

Helpers pequenos para className, data em pt-BR e NCM.

tsx
import { cn, formatDate, formatNCM } from "cosmemilton-ui/server";

cn("cm-card", true && "cm-card--active", undefined);
// "cm-card cm-card--active"

formatNCM("01012100");
// "0101.21.00"

formatDate("2026-05-31");
// "31/05/2026"

Documentos e telefone

Formatadores para exibição de CPF, CNPJ numérico, CNPJ alfanumérico e telefones brasileiros.

tsx
import { formatCNPJ, formatCPF, formatPhone } from "cosmemilton-ui/server";

formatCPF("12345678909");
// "123.456.789-09"

formatCNPJ("11222333000181");
// "11.222.333/0001-81"

formatCNPJ("12ABC34501DE35");
// "12.ABC.345/01DE-35"

formatPhone("11987654321");
// "(11) 98765-4321"

formatPhone("5511987654321");
// "+55 (11) 98765-4321"

Tokens e responsividade

Helpers usados pelos primitivos para converter props em valores CSS previsíveis.

tsx
import {
  cmDensityClass,
  cmSizeValue,
  cmSpacingValue,
  resolveResponsiveNumber,
  resolveResponsiveValue,
} from "cosmemilton-ui/server";

cmDensityClass("compact");
// "cm-density-compact"

cmSizeValue(24);
// "24px"
cmSizeValue("2rem");
// "2rem"

cmSpacingValue("md");
// "var(--space-md, 1rem)"

resolveResponsiveValue({ base: "grid", md: "flex" }, "block");
// { base: "grid", sm: "grid", md: "flex", lg: "flex", xl: "flex" }

resolveResponsiveNumber({ base: 1, lg: 3 }, 1);
// { base: 1, sm: 1, md: 1, lg: 3, xl: 3 }

Notas

Lista pública atual em cosmemilton-ui/server: cn, formatNCM, formatDate, formatCPF, formatCNPJ, formatPhone, cmDensityClass, resolveResponsiveValue, resolveResponsiveNumber, cmSizeValue e cmSpacingValue.

formatNCM formata apenas códigos de 8 dígitos sem ponto. Se o valor já vier formatado ou tiver outro tamanho, retorna o valor original.

formatDate usa Date + toLocaleDateString com locale pt-BR e timezone UTC.

formatCNPJ aceita o formato numérico atual e o novo formato alfanumérico da Receita Federal: 12 caracteres alfanuméricos mais 2 dígitos verificadores numéricos.

formatCNPJ apenas aplica máscara para exibição; ele não valida nem calcula os dígitos verificadores.

No CNPJ alfanumérico, a Receita manteve o DV por módulo 11, convertendo letras pelo valor ASCII menos 48. Exemplo: A=17, B=18, C=19.

resolveResponsiveValue e resolveResponsiveNumber propagam o último valor conhecido pelos breakpoints base, sm, md, lg e xl.

cmSpacingValue resolve tokens none, xs, sm, md, lg, xl, 2xl e 3xl para variáveis CSS com fallback.