@archbase/components 3.0.0

package/dist/printer/ArchbaseThermalPrinter.types.d.ts

@@ -0,0 +1,199 @@
+import type { CSSProperties, ReactNode } from 'react';
+/**
+ * Larguras de papel em mm
+ */
+export type PaperWidth = 58 | 80 | 112;
+/**
+ * Alinhamento do texto
+ */
+export type TextAlign = 'left' | 'center' | 'right';
+/**
+ * Estilo de barra
+ */
+export type BarStyle = 'single' | 'double' | 'dashed';
+/**
+ * Tamanhos de fonte (8dots/mm)
+ */
+export type FontSize = 'normal' | 'small' | 'large' | 'extra-large';
+/**
+ * Densidade de impressão
+ */
+export type PrintDensity = 8 | 12 | 15;
+/**
+ * Corte do papel
+ */
+export type CutMode = 'full' | 'partial' | 'none';
+/**
+ * Status da impressora
+ */
+export type PrinterStatus = 'idle' | 'printing' | 'error' | 'success';
+/**
+ * Dados de um item de receipt
+ */
+export interface ReceiptItem {
+    /** Nome do item */
+    name: string;
+    /** Quantidade */
+    quantity: number;
+    /** Preço unitário */
+    price: number;
+    /** Desconto */
+    discount?: number;
+}
+/**
+ * Dados do pagamento
+ */
+export interface PaymentData {
+    /** Método de pagamento */
+    method: 'cash' | 'credit' | 'debit' | 'pix' | 'transfer';
+    /** Valor pago */
+    amount: number;
+    /** Troco */
+    change?: number;
+}
+/**
+ * Dados do receipt/cupom
+ */
+export interface ReceiptData {
+    /** Cabeçalho */
+    header?: {
+        /** Título/Logo */
+        title?: string;
+        /** Linhas de endereço */
+        address?: string[];
+        /** CNPJ */
+        document?: string;
+        /** Data */
+        date?: Date;
+        /** Número do cupom */
+        number?: string;
+        /** Operador */
+        operator?: string;
+    };
+    /** Itens */
+    items?: ReceiptItem[];
+    /** Resumo */
+    summary?: {
+        /** Subtotal */
+        subtotal?: number;
+        /** Desconto total */
+        discount?: number;
+        /** Taxa de serviço */
+        serviceFee?: number;
+        /** Total */
+        total: number;
+    };
+    /** Pagamentos */
+    payments?: PaymentData[];
+    /** Rodapé */
+    footer?: {
+        /** Mensagens */
+        messages?: string[];
+        /** QR Code (PIX) */
+        qrCode?: string;
+        /** Código de barras */
+        barcode?: string;
+    };
+}
+/**
+ * Opções de impressão
+ */
+export interface PrintOptions {
+    /** Largura do papel (mm) */
+    paperWidth?: PaperWidth;
+    /** Densidade de impressão */
+    density?: PrintDensity;
+    /** Número de cópias */
+    copies?: number;
+    /** Cortar após impressão */
+    cut?: CutMode;
+    /** Abrir gaveta de dinheiro */
+    openCashDrawer?: boolean;
+    /** Timeout de impressão (ms) */
+    timeout?: number;
+}
+/**
+ * Props do componente ArchbaseThermalPrinter
+ */
+export interface ArchbaseThermalPrinterProps {
+    /** Dados do receipt */
+    data: ReceiptData;
+    /** --- Opções de Impressão --- */
+    options?: PrintOptions;
+    /** Impressora destino (deixe vazio para usar padrão) */
+    printerId?: string;
+    /** Executar impressão automaticamente ao montar */
+    autoPrint?: boolean;
+    /** --- Template Customizado --- */
+    /** Template customizado para o receipt */
+    template?: (data: ReceiptData) => ReactNode;
+    /** --- Estilização --- */
+    style?: CSSProperties;
+    className?: string;
+    /** --- Estados --- */
+    disabled?: boolean;
+    loading?: ReactNode;
+    error?: ReactNode;
+    /** --- Eventos --- */
+    onPrintStart?: () => void;
+    onPrintComplete?: () => void;
+    onError?: (error: Error) => void;
+    onStatusChange?: (status: PrinterStatus) => void;
+    /** --- Preview --- */
+    /** Mostrar preview antes de imprimir */
+    showPreview?: boolean;
+    /** Botões de ação no preview */
+    previewActions?: boolean;
+    /** --- Acessibilidade --- */
+    ariaLabel?: string;
+    title?: string;
+}
+/**
+ * Props para componente de receipt
+ */
+export interface ReceiptProps {
+    data: ReceiptData;
+    paperWidth?: PaperWidth;
+    align?: TextAlign;
+    showLogo?: boolean;
+    style?: CSSProperties;
+    className?: string;
+}
+/**
+ * Props para componente de Label
+ */
+export interface LabelProps {
+    /** Conteúdo da etiqueta */
+    content: string | string[];
+    /** Código de barras */
+    barcode?: string;
+    /** QR Code */
+    qrCode?: string;
+    /** Largura da etiqueta (mm) */
+    width?: number;
+    /** Altura da etiqueta (mm) */
+    height?: number;
+    /** Número de cópias */
+    copies?: number;
+    style?: CSSProperties;
+    className?: string;
+}
+/**
+ * Props para componente de Barcode
+ */
+export interface BarcodeProps {
+    /** Dados do código de barras */
+    value: string;
+    /** Tipo de código de barras */
+    type?: 'CODE128' | 'CODE39' | 'EAN13' | 'EAN8' | 'UPC' | 'ITF' | 'CODABAR';
+    /** Altura (dots) */
+    height?: number;
+    /** Largura das barras (1-3) */
+    width?: number;
+    /** Mostrar texto abaixo */
+    text?: boolean;
+    /** Alinhamento do texto */
+    textAlign?: TextAlign;
+    style?: CSSProperties;
+    className?: string;
+}

package/dist/printer/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * ArchbaseThermalPrinter - Thermal Printer Component
+ *
+ * Impressão térmica ESC/POS para receipts, labels e códigos de barras.
+ * Suporta impressoras térmicas padrão de mercado (58mm, 80mm, 112mm).
+ */
+export { ArchbaseThermalPrinter, QuickPrintButton } from './ArchbaseThermalPrinter';
+export type { ArchbaseThermalPrinterProps, ReceiptData, ReceiptItem, PaymentData, PrintOptions, PrinterStatus, PaperWidth, CutMode, PrintDensity, TextAlign, FontSize, BarStyle, ReceiptProps, LabelProps, BarcodeProps, } from './ArchbaseThermalPrinter.types';
+export { formatCurrency as formatCurrencyReceipt, formatDate as formatDateReceipt, line, divider, centerText, rightAlignText, escposInit, escposAlign, escposFontSize, escposBold, escposUnderline, escposFeed, escposCut, escposOpenCashDrawer, escposQRCode, escposBarcode, escposFinalize, stringToUint8Array, stringsToUint8Array, combineCommands, getCharsWidth, generateReceiptEscpos, } from './utils/escpos';

package/dist/printer/utils/escpos.d.ts

@@ -0,0 +1,127 @@
+import type { PaperWidth, PrintDensity, CutMode, TextAlign, FontSize, BarStyle } from '../ArchbaseThermalPrinter.types';
+/**
+ * Comandos ESC/POS básicos
+ */
+export declare const ESC = "\u001B";
+export declare const GS = "\u001D";
+export declare const DLE = "\u0010";
+export declare const CAN = "\u0018";
+/**
+ * Formata número como moeda (BRL)
+ */
+export declare function formatCurrency(value: number): string;
+/**
+ * Formata data para receipt
+ */
+export declare function formatDate(date?: Date): string;
+/**
+ * Gera linha de caracteres
+ */
+export declare function line(char?: string, length?: number): string;
+/**
+ * Gera linha divisória
+ */
+export declare function divider(barStyle?: BarStyle, length?: number): string;
+/**
+ * Centraliza texto
+ */
+export declare function centerText(text: string, width?: number): string;
+/**
+ * Alinha texto à direita
+ */
+export declare function rightAlignText(text: string, width?: number): string;
+/**
+ * Cabeçalho ESC/POS para inicializar impressora
+ */
+export declare function escposInit(paperWidth?: PaperWidth, density?: PrintDensity): Uint8Array;
+/**
+ * Define alinhamento
+ */
+export declare function escposAlign(align: TextAlign): Uint8Array;
+/**
+ * Define tamanho da fonte
+ */
+export declare function escposFontSize(size: FontSize): Uint8Array;
+/**
+ * Define negrito (on/off)
+ */
+export declare function escposBold(enabled?: boolean): Uint8Array;
+/**
+ * Define sublinhado (on/off)
+ */
+export declare function escposUnderline(enabled?: boolean): Uint8Array;
+/**
+ * Alimenta linhas
+ */
+export declare function escposFeed(lines?: number): Uint8Array;
+/**
+ * Corte de papel
+ */
+export declare function escposCut(mode?: CutMode): Uint8Array;
+/**
+ * Abre gaveta de dinheiro
+ */
+export declare function escposOpenCashDrawer(): Uint8Array;
+/**
+ * Gera QR Code
+ */
+export declare function escposQRCode(data: string, size?: number): Uint8Array;
+/**
+ * Gera código de barras (CODE128)
+ */
+export declare function escposBarcode(data: string, height?: number): Uint8Array;
+/**
+ * Finaliza e adiciona feed + cut
+ */
+export declare function escposFinalize(cutMode?: CutMode, feedLines?: number): Uint8Array;
+/**
+ * Converte string para Uint8Array (UTF-8)
+ */
+export declare function stringToUint8Array(str: string): Uint8Array;
+/**
+ * Converte array de strings para Uint8Array
+ */
+export declare function stringsToUint8Array(strings: string[]): Uint8Array;
+/**
+ * Combina múltiplos comandos ESC/POS
+ */
+export declare function combineCommands(...commands: Uint8Array[]): Uint8Array;
+/**
+ * Calcula largura em caracteres baseada na largura do papel
+ * Aproximadamente 48 caracteres para 80mm, 32 para 58mm
+ */
+export declare function getCharsWidth(paperWidth: PaperWidth): number;
+/**
+ * Gera receipt completo como Uint8Array
+ */
+export declare function generateReceiptEscpos(data: {
+    header?: {
+        title?: string;
+        address?: string[];
+        document?: string;
+        date?: Date;
+        number?: string;
+        operator?: string;
+    };
+    items?: Array<{
+        name: string;
+        quantity: number;
+        price: number;
+        discount?: number;
+    }>;
+    summary?: {
+        subtotal?: number;
+        discount?: number;
+        serviceFee?: number;
+        total: number;
+    };
+    payments?: Array<{
+        method: string;
+        amount: number;
+    }>;
+    footer?: {
+        messages?: string[];
+        qrCode?: string;
+        barcode?: string;
+    };
+}, paperWidth?: PaperWidth, cutMode?: CutMode): Uint8Array;

package/dist/spreadsheet/ArchbaseSpreadsheetImport.d.ts

@@ -0,0 +1,4 @@
+import type { ArchbaseSpreadsheetImportProps } from './ArchbaseSpreadsheetImport.types';
+export declare function ArchbaseSpreadsheetImport<T = any>({ dataSource, onDataLoaded, onRowAdded, fields, isOpen, onClose, title, description, allowedFileTypes, maxFileSize, // 10MB
+maxRows, customHeaderComponent, customButtonComponent, translations, style, className, disabled, initialData, mapRows, validationCallback, }: ArchbaseSpreadsheetImportProps<T>): import("react/jsx-runtime").JSX.Element;
+export type { ArchbaseSpreadsheetImportProps, SpreadsheetField, SpreadsheetRow, SpreadsheetFileType, } from './ArchbaseSpreadsheetImport.types';

package/dist/spreadsheet/ArchbaseSpreadsheetImport.types.d.ts

@@ -0,0 +1,65 @@
+import type { CSSProperties, ReactNode } from 'react';
+import type { IArchbaseDataSourceBase } from '@archbase/data';
+export type SpreadsheetFileType = 'csv' | 'xlsx' | 'xls' | 'all';
+export interface SpreadsheetField {
+    key: string;
+    label: string;
+    required?: boolean;
+    fieldType?: 'text' | 'number' | 'date' | 'email' | 'boolean' | 'select';
+    options?: string[];
+    validations?: {
+        min?: number;
+        max?: number;
+        pattern?: string;
+        custom?: (value: any) => boolean | string;
+    };
+}
+export interface SpreadsheetRow {
+    [key: string]: any;
+}
+export interface ArchbaseSpreadsheetImportProps<T = any> {
+    dataSource?: IArchbaseDataSourceBase<T>;
+    onDataLoaded?: (data: T[]) => void;
+    onRowAdded?: (row: T) => void;
+    fields?: SpreadsheetField[];
+    isOpen?: boolean;
+    onClose?: () => void;
+    title?: string;
+    description?: string;
+    allowedFileTypes?: SpreadsheetFileType[];
+    maxFileSize?: number;
+    maxRows?: number;
+    customHeaderComponent?: ReactNode;
+    customButtonComponent?: ReactNode;
+    translations?: {
+        uploadStep?: string;
+        selectFile?: string;
+        dragDrop?: string;
+        supportedFormats?: string;
+        reviewStep?: string;
+        reviewDescription?: string;
+        confirmStep?: string;
+        confirmDescription?: string;
+        successStep?: string;
+        successDescription?: string;
+        uploadButton?: string;
+        nextButton?: string;
+        backButton?: string;
+        confirmButton?: string;
+        doneButton?: string;
+        closeButton?: string;
+        invalidRow?: string;
+        requiredField?: string;
+        rowsAdded?: string;
+        rowsSkipped?: string;
+    };
+    style?: CSSProperties;
+    className?: string;
+    disabled?: boolean;
+    initialData?: SpreadsheetRow[];
+    mapRows?: (rows: SpreadsheetRow[]) => T[];
+    validationCallback?: (row: SpreadsheetRow, index: number) => {
+        valid: boolean;
+        errors?: string[];
+    };
+}

package/dist/spreadsheet/index.d.ts

@@ -0,0 +1,2 @@
+export { ArchbaseSpreadsheetImport, } from './ArchbaseSpreadsheetImport';
+export type { ArchbaseSpreadsheetImportProps, SpreadsheetField, SpreadsheetRow, SpreadsheetFileType, } from './ArchbaseSpreadsheetImport.types';

package/dist/theme-editor/ArchbaseThemeEditor.d.ts

@@ -0,0 +1,17 @@
+import type { ArchbaseThemeEditorProps } from './ArchbaseThemeEditor.types';
+/**
+ * Componente ArchbaseThemeEditor - Editor de temas Mantine
+ *
+ * @example
+ * ```tsx
+ * <ArchbaseThemeEditor
+ *   theme={{ primaryColor: 'blue' }}
+ *   onChange={(theme) => console.log('Theme changed:', theme)}
+ *   onApply={(theme) => setMantineTheme(theme)}
+ * />
+ * ```
+ */
+export declare function ArchbaseThemeEditor({ theme: initialTheme, onChange, onApply, options, initialSection, initialPreset, exportFormats, onExport, themeName, width, height, layout, style, className, editorClassName, previewClassName, disabled, loading, readOnly, hidePreview, ariaLabel, title, actions, header, footer, }: ArchbaseThemeEditorProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace ArchbaseThemeEditor {
+    var displayName: string;
+}

package/dist/theme-editor/ArchbaseThemeEditor.types.d.ts

@@ -0,0 +1,187 @@
+import type { CSSProperties, ReactNode } from 'react';
+import type { MantineTheme } from '@mantine/core';
+/**
+ * Formato de exportação do tema
+ */
+export type ThemeExportFormat = 'json' | 'typescript' | 'css' | 'mantine';
+/**
+ * Preset de cores
+ */
+export interface ColorPreset {
+    /** Nome do preset */
+    name: string;
+    /** Cores principais */
+    colors: Record<string, string>;
+    /** Cores de primary */
+    primary?: Record<string, string>;
+    /** Cores de accent */
+    accent?: Record<string, string>;
+}
+/**
+ * Configuração de fonte
+ */
+export interface FontConfig {
+    /** Família da fonte */
+    family: string;
+    /** Tamanhos disponíveis */
+    sizes: Record<string, string | number>;
+    /** Altura de linha */
+    lineHeight?: Record<string, number>;
+    /** Peso da fonte */
+    weights?: Record<string, number>;
+}
+/**
+ * Configuração de espaçamento
+ */
+export interface SpacingConfig {
+    /** Valores de escala */
+    scale: number;
+    /** Valores customizados */
+    values?: Record<string, number>;
+}
+/**
+ * Configuração de bordas
+ */
+export interface BorderConfig {
+    /** Radius padrão */
+    radius: Record<string, string | number>;
+    /** Width de bordas */
+    widths?: Record<string, string | number>;
+}
+/**
+ * Configuração de sombra
+ */
+export interface ShadowConfig {
+    /** Sombras customizadas */
+    shadows: Record<string, string>;
+}
+/**
+ * Opções de preview
+ */
+export interface PreviewOptions {
+    /** Mostrar grid de cores */
+    showColors?: boolean;
+    /** Mostrar tipografia */
+    showTypography?: boolean;
+    /** Mostrar componentes */
+    showComponents?: boolean;
+    /** Layout do preview */
+    layout?: 'vertical' | 'horizontal' | 'tabs';
+}
+/**
+ * Opções do editor
+ */
+export interface ThemeEditorOptions {
+    /** Seções editáveis */
+    sections?: ('colors' | 'typography' | 'spacing' | 'borders' | 'shadows' | 'breakpoints')[];
+    /** Presets disponíveis */
+    presets?: ColorPreset[];
+    /** Opções de preview */
+    preview?: PreviewOptions;
+    /** Exportar ao mudar */
+    autoExport?: boolean;
+    /** Callback de mudança */
+    onChange?: (theme: MantineTheme) => void;
+}
+/**
+ * Seção do tema
+ */
+export type ThemeSection = 'colors' | 'typography' | 'spacing' | 'borders' | 'shadows' | 'breakpoints';
+/**
+ * Props do componente ArchbaseThemeEditor
+ */
+export interface ArchbaseThemeEditorProps {
+    /** Tema atual */
+    theme?: Partial<MantineTheme>;
+    /** Callback quando tema muda */
+    onChange?: (theme: Partial<MantineTheme>) => void;
+    /** Callback ao aplicar tema */
+    onApply?: (theme: MantineTheme) => void;
+    /** --- Opções --- */
+    options?: ThemeEditorOptions;
+    /** Seção inicial */
+    initialSection?: ThemeSection;
+    /** Preset inicial */
+    initialPreset?: string;
+    /** --- Exportação --- */
+    /** Formatos disponíveis para exportação */
+    exportFormats?: ThemeExportFormat[];
+    /** Callback ao exportar */
+    onExport?: (format: ThemeExportFormat, data: string) => void;
+    /** Nome do tema para exportação */
+    themeName?: string;
+    /** --- Layout --- */
+    /** Largura */
+    width?: string | number;
+    /** Altura */
+    height?: string | number;
+    /** Layout do editor */
+    layout?: 'inline' | 'sidebar' | 'modal' | 'floating';
+    /** --- Estilização --- */
+    style?: CSSProperties;
+    className?: string;
+    editorClassName?: string;
+    previewClassName?: string;
+    /** --- Estados --- */
+    disabled?: boolean;
+    loading?: ReactNode;
+    /** Modo apenas leitura */
+    readOnly?: boolean;
+    /** Esconder preview */
+    hidePreview?: boolean;
+    /** --- Acessibilidade --- */
+    ariaLabel?: string;
+    title?: string;
+    /** --- Outros --- */
+    /** Botões de ação customizados */
+    actions?: ReactNode;
+    /** Header customizado */
+    header?: ReactNode;
+    /** Footer customizado */
+    footer?: ReactNode;
+}
+/**
+ * Props para ColorPicker
+ */
+export interface ColorPickerProps {
+    /** Cor atual */
+    value: string;
+    /** Callback de mudança */
+    onChange: (color: string) => void;
+    /** Label */
+    label?: string;
+    /** Presets de cores */
+    presets?: string[];
+    /** Alpha */
+    withAlpha?: boolean;
+    /** Desabilitado */
+    disabled?: boolean;
+    /** Nome da variável CSS */
+    cssVar?: string;
+}
+/**
+ * Props para TypographyEditor
+ */
+export interface TypographyEditorProps {
+    /** Config de fontes */
+    value: FontConfig;
+    /** Callback de mudança */
+    onChange: (config: FontConfig) => void;
+    /** Preview text */
+    previewText?: string;
+    /** Desabilitado */
+    disabled?: boolean;
+}
+/**
+ * Props para SpacingEditor
+ */
+export interface SpacingEditorProps {
+    /** Config de espaçamento */
+    value: SpacingConfig;
+    /** Callback de mudança */
+    onChange: (config: SpacingConfig) => void;
+    /** Mostrar preview */
+    showPreview?: boolean;
+    /** Desabilitado */
+    disabled?: boolean;
+}

package/dist/theme-editor/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * ArchbaseThemeColorEditor - Theme Color Editor Component
+ *
+ * Editor visual de temas para Mantine v7+
+ * Suporte a cores, tipografia, espaçamento e bordas.
+ */
+export { ArchbaseThemeEditor as ArchbaseThemeColorEditor } from './ArchbaseThemeEditor';
+export type { ArchbaseThemeEditorProps as ArchbaseThemeColorEditorProps, ThemeSection, ThemeEditorOptions, ThemeExportFormat, ColorPreset, FontConfig, SpacingConfig, BorderConfig, ShadowConfig, PreviewOptions, ColorPickerProps, TypographyEditorProps, SpacingEditorProps, } from './ArchbaseThemeEditor.types';
+export { COLOR_PRESETS, exportTheme, exportThemeAsJSON, exportThemeAsTypeScript, exportThemeAsCSS, exportThemeForMantine, downloadTheme, copyThemeToClipboard, mergeTheme, extractColorPalette, themeFromPreset, isValidColor, hexToRgb, rgbToHex, generateColorScale, } from './utils/themeExport';