@ffid-br/tailor-ui 0.6.0 → 0.7.0

package/dist/types/components/TailorTable.d.ts

@@ -0,0 +1,58 @@
+import { default as React } from 'react';
+/** Como o valor aparece e se alinha. `percent` recebe fração (0,123 = 12,3%). */
+export type TailorColumnType = 'text' | 'number' | 'currency' | 'percent' | 'date' | 'id';
+export type TailorTableColumn<T> = {
+    key: string;
+    header: React.ReactNode;
+    type?: TailorColumnType;
+    /** Valor para ordenar e formatar. Padrão: `row[key]`. */
+    value?: (row: T) => unknown;
+    /** Célula própria (badge, link). Sem ela, o valor formatado pelo `type`. */
+    cell?: (row: T) => React.ReactNode;
+    align?: 'left' | 'center' | 'right';
+    sortable?: boolean;
+    width?: string;
+    /** Linha de total: um valor pronto ou uma conta sobre as linhas (todas, não só a página). */
+    total?: React.ReactNode | ((rows: T[]) => unknown);
+};
+export type TailorTableSort = {
+    key: string;
+    direction: 'asc' | 'desc';
+};
+export type TailorTableProps<T> = {
+    columns: Array<TailorTableColumn<T>>;
+    rows: T[];
+    rowKey: (row: T, index: number) => string | number;
+    /** Título acessível da tabela (vira `<caption>`, só para leitor de tela). */
+    caption: string;
+    loading?: boolean;
+    /** O que aparece sem linhas. Padrão: o texto `empty` do idioma. */
+    empty?: React.ReactNode;
+    /** Ordem controlada (servidor). Sem `onSortChange`, a tabela ordena sozinha. */
+    sort?: TailorTableSort;
+    onSortChange?: (sort: TailorTableSort) => void;
+    defaultSort?: TailorTableSort;
+    /** Paginação no navegador. */
+    pageSize?: number;
+    /** Paginação no servidor: a tabela só mostra as `rows` que recebeu. */
+    pagination?: {
+        page: number;
+        totalPages: number;
+        onPageChange: (page: number) => void;
+        totalRows?: number;
+    };
+    onRowClick?: (row: T) => void;
+    /** Cabeçalho preso ao rolar a página. */
+    stickyHeader?: boolean;
+    className?: string;
+};
+/** Formata pelo tipo da coluna; vazio vira traço. */
+export declare function formatValue(v: unknown, type?: TailorColumnType, locale?: string, currency?: string): React.ReactNode;
+/**
+ * Tabela de relatório: cabeçalho em overline, números tabulares à direita, IDs
+ * em mono, ordenação, paginação (navegador ou servidor) e linha de total.
+ * Visual por variáveis `--tailor-brand-*` e `--tailor-table-*`, como o cabeçalho.
+ */
+export declare function TailorTable<T>({ columns, rows, rowKey, caption, loading, empty, sort, onSortChange, defaultSort, pageSize, pagination, onRowClick, stickyHeader, className, }: TailorTableProps<T>): React.JSX.Element;
+/** Soma de uma coluna, para usar em `total`. */
+export declare const sumBy: <T>(value: (r: T) => number) => (rows: T[]) => number;

package/dist/types/components/TailorToaster.d.ts

@@ -0,0 +1,19 @@
+import { default as React } from 'react';
+export type TailorToastType = 'success' | 'error' | 'info';
+export type TailorToastOptions = {
+    description?: React.ReactNode; /** ms. Padrão: 4000; erro, 8000. */
+    duration?: number;
+};
+/** `toast.success('Saved')`. Precisa de um `<TailorToaster />` montado no app. Devolve o id, para `toast.dismiss`. */
+export declare const toast: {
+    success: (title: React.ReactNode, options?: TailorToastOptions) => number;
+    error: (title: React.ReactNode, options?: TailorToastOptions) => number;
+    info: (title: React.ReactNode, options?: TailorToastOptions) => number;
+    dismiss: (id: number) => void;
+};
+/**
+ * Os avisos (toasts) da marca: caixa preta com a borda da cor do tipo; o ponto
+ * escreve o título e vira check (ou X); barra do tempo restante. Monte uma vez,
+ * perto da raiz do app.
+ */
+export declare function TailorToaster(): React.JSX.Element;

package/dist/types/components/TailorTypewriter.d.ts

@@ -0,0 +1,15 @@
+export type TailorTypewriterProps = {
+    /** Frases em ciclo: escreve, espera, apaga, escreve a próxima. Uma frase só repete. */
+    texts: string[];
+    /** Escreve a primeira e para (o cursor some). Para títulos de aviso. */
+    once?: boolean;
+    /** Chamado quando `once` termina de escrever. */
+    onDone?: () => void;
+    className?: string;
+};
+/**
+ * O ponto da marca como cursor: escreve a frase, pisca, apaga e escreve a
+ * próxima. O leitor de tela recebe a frase inteira, não letra por letra; quem
+ * pediu menos movimento vê a frase pronta.
+ */
+export declare function TailorTypewriter({ texts, once, onDone, className }: TailorTypewriterProps): import("react").JSX.Element;

package/dist/types/i18n.d.ts

@@ -0,0 +1,35 @@
+import { default as React } from 'react';
+/** Textos que os componentes mostram. Troque um por um em `messages`, ou o idioma inteiro em `locale`. */
+export type TailorMessages = {
+    loading: string;
+    done: string;
+    empty: string;
+    total: string;
+    pagination: string;
+    page: (page: number, totalPages: number) => string;
+    rows: (count: string) => string;
+    previous: string;
+    next: string;
+    breadcrumb: string;
+    dismiss: string;
+    skip: string;
+    required: string;
+};
+export declare const TAILOR_MESSAGES: Record<string, TailorMessages>;
+export type TailorLocale = {
+    /** BCP 47. Formata números e datas; escolhe os textos (`pt-BR` e `en` inclusos; outro idioma cai no `en`). */
+    locale: string;
+    /** ISO 4217 para colunas `currency`. */
+    currency: string;
+    messages: TailorMessages;
+};
+export type TailorLocaleProviderProps = {
+    locale?: string;
+    currency?: string;
+    /** Sobrescreve textos do idioma escolhido. */
+    messages?: Partial<TailorMessages>;
+    children: React.ReactNode;
+};
+/** Idioma, moeda e textos dos componentes. Sem provider: pt-BR e BRL. */
+export declare function TailorLocaleProvider({ locale, currency, messages, children }: TailorLocaleProviderProps): React.JSX.Element;
+export declare const useTailorLocale: () => TailorLocale;

package/dist/types/index.d.ts

@@ -18,5 +18,19 @@ export { EquipeDock } from './components/EquipeDock';
 export type { EquipeDockProps, AgenteDaEquipe } from './components/EquipeDock';
 export { TailorPageHeader } from './components/TailorPageHeader';
 export type { TailorPageHeaderProps, TailorPageHeaderLink } from './components/TailorPageHeader';
-export { TailorMarca, temaParaVariaveis, temaDoWhitelabel, contraste } from './components/TailorMarca';
-export type { TailorMarcaProps, TailorTema, WhitelabelDoCliente } from './components/TailorMarca';
+export { TailorBrand, themeToVars, themeFromWhitelabel, contrast } from './components/TailorBrand';
+export type { TailorBrandProps, TailorTheme, TailorWhitelabel } from './components/TailorBrand';
+export { TailorTable, formatValue, sumBy } from './components/TailorTable';
+export type { TailorTableProps, TailorTableColumn, TailorTableSort, TailorColumnType } from './components/TailorTable';
+export { TailorSkeleton } from './components/TailorSkeleton';
+export type { TailorSkeletonProps } from './components/TailorSkeleton';
+export { TailorToaster, toast } from './components/TailorToaster';
+export type { TailorToastType, TailorToastOptions } from './components/TailorToaster';
+export { TailorTypewriter } from './components/TailorTypewriter';
+export type { TailorTypewriterProps } from './components/TailorTypewriter';
+export { TailorResult } from './components/TailorResult';
+export type { TailorResultProps } from './components/TailorResult';
+export { TailorLocaleProvider, useTailorLocale, TAILOR_MESSAGES } from './i18n';
+export type { TailorLocaleProviderProps, TailorLocale, TailorMessages } from './i18n';
+export { TailorField } from './components/TailorField';
+export type { TailorFieldProps } from './components/TailorField';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@ffid-br/tailor-ui",
   "private": false,
-  "version": "0.6.0",
+  "version": "0.7.0",
   "description": "Primitivos de marca Tailor.ia em React: loader, intro, transição de login, lockup e barra lateral.",
   "type": "module",
   "main": "dist/index.umd.js",