@snksergio/design-system 0.4.0 → 0.5.1

package/dist-lib/src/components/ui/PageHeader/page-header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"page-header.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/PageHeader/page-header.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAE3D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,WAAW,EACX,KAAK,EACL,OAAO,EACP,QAAQ,EACR,gBAAuB,EACvB,oBAA2B,EAC3B,SAAS,GACV,EAAE,eAAe,2CA8BjB;yBAvCe,UAAU"}

package/dist-lib/src/components/ui/PageHeader/page-header.styles.d.ts

@@ -0,0 +1,96 @@
+/**
+ * PageHeader styles — bloco de título de página colocado dentro do body
+ * do `<AppShell>`.
+ *
+ * Layout desktop:
+ *   ┌──────────────────────────────────────────────────────────┐
+ *   │ [title] [badge]              [action1] [action2] [CTA]   │
+ *   │ description                                              │
+ *   ├──────────────────────────────────────────────────────────┤
+ *   │ {children — ex: <Tabs />}                                │
+ *   └──────────────────────────────────────────────────────────┘
+ *
+ * Mobile:
+ *   - Text section sai (hideTextOnMobile, default true)
+ *   - Actions ocupam toda a largura; último botão vira fluid (CTA primary)
+ */
+export declare const pageHeaderStyles: import('tailwind-variants').TVReturnType<{
+    hideTextOnMobile: {
+        true: {
+            textCol: string;
+        };
+        false: {};
+    };
+    /**
+     * Mobile: actions ocupa o espaço (text hidden) + último filho vira fluid.
+     * Off = mantém actions square e shrink-0 (mesmo comportamento desktop).
+     */
+    mobileFluid: {
+        true: {
+            actionsRow: string[];
+        };
+        false: {};
+    };
+}, {
+    root: string;
+    topRow: string;
+    textCol: string;
+    titleRow: string;
+    title: string;
+    description: string[];
+    actionsRow: string;
+    extraRow: string;
+}, undefined, {
+    hideTextOnMobile: {
+        true: {
+            textCol: string;
+        };
+        false: {};
+    };
+    /**
+     * Mobile: actions ocupa o espaço (text hidden) + último filho vira fluid.
+     * Off = mantém actions square e shrink-0 (mesmo comportamento desktop).
+     */
+    mobileFluid: {
+        true: {
+            actionsRow: string[];
+        };
+        false: {};
+    };
+}, {
+    root: string;
+    topRow: string;
+    textCol: string;
+    titleRow: string;
+    title: string;
+    description: string[];
+    actionsRow: string;
+    extraRow: string;
+}, import('tailwind-variants').TVReturnType<{
+    hideTextOnMobile: {
+        true: {
+            textCol: string;
+        };
+        false: {};
+    };
+    /**
+     * Mobile: actions ocupa o espaço (text hidden) + último filho vira fluid.
+     * Off = mantém actions square e shrink-0 (mesmo comportamento desktop).
+     */
+    mobileFluid: {
+        true: {
+            actionsRow: string[];
+        };
+        false: {};
+    };
+}, {
+    root: string;
+    topRow: string;
+    textCol: string;
+    titleRow: string;
+    title: string;
+    description: string[];
+    actionsRow: string;
+    extraRow: string;
+}, undefined, unknown, unknown, undefined>>;
+//# sourceMappingURL=page-header.styles.d.ts.map

package/dist-lib/src/components/ui/PageHeader/page-header.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"page-header.styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/PageHeader/page-header.styles.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,gBAAgB;;;;;;;IAmBzB;;;OAGG;;;;;;;;;;;;;;;;;;;;;;;IAHH;;;OAGG;;;;;;;;;;;;;;;;;;;;;;;IAHH;;;OAGG;;;;;;;;;;;;;;;;2CAeL,CAAC"}

package/dist-lib/src/components/ui/PageHeader/page-header.types.d.ts

@@ -0,0 +1,38 @@
+import { ReactNode } from 'react';
+export type PageHeaderProps = {
+    /** Título principal da página (h1, text-title-md). */
+    title?: string;
+    /** Descrição/subtítulo logo abaixo do title. */
+    description?: string;
+    /**
+     * Chip/badge inline ao lado do title (ex: contador de registros, status).
+     * Aceita qualquer ReactNode mas normalmente é um `<Chip>` do DS.
+     */
+    badge?: ReactNode;
+    /**
+     * Slot do bloco de ações à direita (Buttons, dropdowns, etc).
+     * No mobile (<md), por default o ÚLTIMO filho ganha `flex-1` pra virar
+     * fluido. Desligue via `fluidPrimaryOnMobile={false}`.
+     */
+    actions?: ReactNode;
+    /**
+     * Conteúdo extra renderizado abaixo da linha title/actions — útil pra
+     * tabs, filtros secundários, etc. Recebe largura total do header.
+     */
+    children?: ReactNode;
+    /**
+     * Em mobile (<md), esconde o bloco title/description/badge.
+     *  - Default: `true` (pq o AppShell global já mostra o breadcrumb/título
+     *    no Header — duplicação prejudica espaço vertical em telas pequenas).
+     *  - `false`: mantém o bloco visível em qualquer viewport.
+     */
+    hideTextOnMobile?: boolean;
+    /**
+     * Em mobile, faz o último filho do `actions` ocupar o espaço restante
+     * (vira CTA full-width). Default: `true`.
+     */
+    fluidPrimaryOnMobile?: boolean;
+    /** className extra no `<header>` root. */
+    className?: string;
+};
+//# sourceMappingURL=page-header.types.d.ts.map

package/dist-lib/src/components/ui/PageHeader/page-header.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"page-header.types.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/PageHeader/page-header.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,MAAM,eAAe,GAAG;IAC5B,sDAAsD;IACtD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gDAAgD;IAChD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;OAIG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;;OAGG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAE/B,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC"}

package/dist-lib/src/components/ui/Panel/index.d.ts

@@ -0,0 +1,11 @@
+export { Panel } from './panel';
+export { PanelHeader } from './panel-header';
+export type { PanelHeaderProps } from './panel-header';
+export { PanelBody } from './panel-body';
+export type { PanelBodyProps } from './panel-body';
+export { PanelFooter } from './panel-footer';
+export type { PanelFooterProps } from './panel-footer';
+export { Sheet as PanelRoot, SheetTrigger as PanelTrigger, SheetClose as PanelCloseAction, SheetContent as PanelContent, } from '../../shadcn/sheet';
+export { panelContainer } from './panel.styles';
+export type { PanelProps, PanelSide, PanelSize } from './panel.types';
+//# sourceMappingURL=index.d.ts.map

package/dist-lib/src/components/ui/Panel/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/Panel/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAGhC,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,YAAY,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAEvD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,YAAY,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAEnD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,YAAY,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAGvD,OAAO,EACL,KAAK,IAAI,SAAS,EAClB,YAAY,IAAI,YAAY,EAC5B,UAAU,IAAI,gBAAgB,EAC9B,YAAY,IAAI,YAAY,GAC7B,MAAM,oBAAoB,CAAC;AAG5B,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAGhD,YAAY,EAAE,UAAU,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC"}

package/dist-lib/src/components/ui/Panel/panel-body.d.ts

@@ -0,0 +1,10 @@
+import { ReactNode } from 'react';
+export type PanelBodyProps = {
+    children: ReactNode;
+    className?: string;
+};
+/**
+ * Container do body do panel — scroll interno, gap padrão entre seções.
+ */
+export declare function PanelBody({ children, className }: PanelBodyProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=panel-body.d.ts.map

package/dist-lib/src/components/ui/Panel/panel-body.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"panel-body.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/Panel/panel-body.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,MAAM,MAAM,cAAc,GAAG;IAC3B,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF;;GAEG;AACH,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,cAAc,2CAEhE"}

package/dist-lib/src/components/ui/Panel/panel-footer.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react';
+export type PanelFooterProps = {
+    children: ReactNode;
+    className?: string;
+};
+/**
+ * Footer do panel — geralmente botões de ação alinhados à direita
+ * (Cancelar / Salvar). Padding e border-top já aplicados.
+ */
+export declare function PanelFooter({ children, className }: PanelFooterProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=panel-footer.d.ts.map

package/dist-lib/src/components/ui/Panel/panel-footer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"panel-footer.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/Panel/panel-footer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,MAAM,MAAM,gBAAgB,GAAG;IAC7B,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF;;;GAGG;AACH,wBAAgB,WAAW,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,gBAAgB,2CAEpE"}

package/dist-lib/src/components/ui/Panel/panel-header.d.ts

@@ -0,0 +1,12 @@
+import { LucideIcon } from 'lucide-react';
+export type PanelHeaderProps = {
+    title?: string;
+    description?: string;
+    titleIcon?: LucideIcon;
+    /** Esconde o botão X de fechar */
+    hideClose?: boolean;
+    /** className do container do header */
+    className?: string;
+};
+export declare function PanelHeader({ title, description, titleIcon: TitleIcon, hideClose, className, }: PanelHeaderProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=panel-header.d.ts.map

package/dist-lib/src/components/ui/Panel/panel-header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"panel-header.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/Panel/panel-header.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE/C,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,UAAU,CAAC;IACvB,kCAAkC;IAClC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,uCAAuC;IACvC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,WAAW,EACX,SAAS,EAAE,SAAS,EACpB,SAAS,EACT,SAAS,GACV,EAAE,gBAAgB,2CAyBlB"}

package/dist-lib/src/components/ui/Panel/panel.d.ts

@@ -0,0 +1,15 @@
+import { PanelProps } from './panel.types';
+/**
+ * Panel — drawer "card flutuante" estilo iGreen.
+ *
+ * Alinhado com `.tbl-form-drawer` do design-and-table-v2:
+ *   - Slide-in lateral (default: right) com gutter de 24px do viewport
+ *   - Radius 14px + halo outline + shadow-2xl
+ *   - Header (title + close X) + Body scrollável + Footer (actions)
+ *   - Mobile-adapt: gutter reduzido, full-width responsivo
+ *
+ * Construído direto sobre SheetPrimitive.Content pra controle total do
+ * positioning (evita conflito com inset-y-0/right-0/h-full do SheetContent).
+ */
+export declare function Panel({ open, defaultOpen, onOpenChange, trigger, side, size, title, description, titleIcon, hideClose, footer, children, className, }: PanelProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=panel.d.ts.map

package/dist-lib/src/components/ui/Panel/panel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"panel.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/Panel/panel.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,UAAU,EAAwB,MAAM,eAAe,CAAC;AAwCtE;;;;;;;;;;;GAWG;AACH,wBAAgB,KAAK,CAAC,EACpB,IAAI,EACJ,WAAW,EACX,YAAY,EACZ,OAAO,EACP,IAAc,EACd,IAAW,EACX,KAAK,EACL,WAAW,EACX,SAAS,EACT,SAAS,EACT,MAAM,EACN,QAAQ,EACR,SAAS,GACV,EAAE,UAAU,2CA6BZ"}

package/dist-lib/src/components/ui/Panel/panel.styles.d.ts

@@ -0,0 +1,47 @@
+/**
+ * Panel styles — alinhado com `.tbl-form-drawer` do design-and-table-v2.
+ *
+ * Spec sandbox:
+ *   - position: fixed top/right/bottom 24px (gutter)
+ *   - width: 560px (default), max-width: calc(100vw - 48px)
+ *   - bg-bg-surface (light) / bg-bg-canvas (dark)
+ *   - border 1px + radius 14px (= radius-xl)
+ *   - shadow-sh-2xl + halo outline (6px alpha)
+ *   - flex column, overflow-hidden
+ *   - Mobile: ocupa quase tudo (gutter reduzido)
+ */
+/**
+ * Container "card flutuante" estilo iGreen — fica destacado do viewport com
+ * gutter de 24px, radius e halo. Responsivo: gutter encolhe no mobile.
+ */
+export declare const panelContainer: import('tailwind-variants').TVReturnType<{
+    side: {
+        right: string[];
+        left: string[];
+        top: string[];
+        bottom: string[];
+    };
+}, undefined, string[], {
+    side: {
+        right: string[];
+        left: string[];
+        top: string[];
+        bottom: string[];
+    };
+}, undefined, import('tailwind-variants').TVReturnType<{
+    side: {
+        right: string[];
+        left: string[];
+        top: string[];
+        bottom: string[];
+    };
+}, undefined, string[], unknown, unknown, undefined>>;
+export declare const panelHeader: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
+export declare const panelHeaderText: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "flex flex-col gap-gp-2xs min-w-0", {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "flex flex-col gap-gp-2xs min-w-0", unknown, unknown, undefined>>;
+export declare const panelTitle: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
+export declare const panelTitleIcon: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "size-[18px] text-fg-brand shrink-0", {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "size-[18px] text-fg-brand shrink-0", unknown, unknown, undefined>>;
+export declare const panelDescription: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "text-body-md text-fg-muted", {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "text-body-md text-fg-muted", unknown, unknown, undefined>>;
+export declare const panelClose: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
+export declare const panelBody: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
+export declare const panelFooter: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
+//# sourceMappingURL=panel.styles.d.ts.map

package/dist-lib/src/components/ui/Panel/panel.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"panel.styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/Panel/panel.styles.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AAGH;;;GAGG;AACH,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;qDA8BzB,CAAC;AAGH,eAAO,MAAM,WAAW,sMAMtB,CAAC;AAEH,eAAO,MAAM,eAAe,0PAE1B,CAAC;AAEH,eAAO,MAAM,UAAU,sMAMrB,CAAC;AAEH,eAAO,MAAM,cAAc,8PAEzB,CAAC;AAEH,eAAO,MAAM,gBAAgB,8OAE3B,CAAC;AAEH,eAAO,MAAM,UAAU,sMAWrB,CAAC;AAGH,eAAO,MAAM,SAAS,sMAOpB,CAAC;AAGH,eAAO,MAAM,WAAW,sMAMtB,CAAC"}

package/dist-lib/src/components/ui/Panel/panel.types.d.ts

@@ -0,0 +1,33 @@
+import { ReactNode } from 'react';
+import { LucideIcon } from 'lucide-react';
+/** Lado de entrada do panel — default: "right" */
+export type PanelSide = "left" | "right" | "top" | "bottom";
+/** Sizes pré-definidos. `full` ocupa quase 100% do viewport (com gutter de 24px). */
+export type PanelSize = "sm" | "md" | "lg" | "xl" | "full";
+export type PanelProps = {
+    /** Controlled open state */
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    /** Trigger element (typed) — use `<PanelTrigger asChild>` pra composição manual */
+    trigger?: ReactNode;
+    /** Side de entrada. Default: "right" */
+    side?: PanelSide;
+    /** Tamanho. Default: "md" (560px). Aceita também string CSS arbitrária. */
+    size?: PanelSize | string;
+    /** Título exibido no header */
+    title?: string;
+    /** Descrição abaixo do título (opcional, mas recomendado pra acessibilidade) */
+    description?: string;
+    /** Ícone à esquerda do título (cor brand por default) */
+    titleIcon?: LucideIcon;
+    /** Esconde o botão X de fechar no header. Default: false */
+    hideClose?: boolean;
+    /** Footer — geralmente botões de ação (Cancelar / Salvar) */
+    footer?: ReactNode;
+    /** Conteúdo do body (scrollable) */
+    children: ReactNode;
+    /** className do <SheetContent> (override de width/position) */
+    className?: string;
+};
+//# sourceMappingURL=panel.types.d.ts.map

package/dist-lib/src/components/ui/Panel/panel.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"panel.types.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/Panel/panel.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE/C,kDAAkD;AAClD,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,CAAC;AAE5D,qFAAqF;AACrF,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;AAE3D,MAAM,MAAM,UAAU,GAAG;IACvB,4BAA4B;IAC5B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAEvC,mFAAmF;IACnF,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB,wCAAwC;IACxC,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB,2EAA2E;IAC3E,IAAI,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;IAE1B,+BAA+B;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gFAAgF;IAChF,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,yDAAyD;IACzD,SAAS,CAAC,EAAE,UAAU,CAAC;IAEvB,4DAA4D;IAC5D,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,6DAA6D;IAC7D,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB,oCAAoC;IACpC,QAAQ,EAAE,SAAS,CAAC;IAEpB,+DAA+D;IAC/D,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC"}

package/dist-lib/src/components/ui/TabelaTeste/index.d.ts

@@ -0,0 +1,2 @@
+export { TabelaTeste } from './tabela-teste';
+//# sourceMappingURL=index.d.ts.map

package/dist-lib/src/components/ui/TabelaTeste/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/TabelaTeste/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC"}

package/dist-lib/src/components/ui/TabelaTeste/mock-data.d.ts

@@ -0,0 +1,90 @@
+import { LucideIcon } from 'lucide-react';
+export type TabelaCol = {
+    key: string;
+    type: "select" | "id" | "person" | "email" | "phone" | "status" | "category" | "agent" | "currency" | "date" | "text" | "actions";
+    label?: string;
+    icon?: LucideIcon;
+    width?: number;
+    minWidth?: number;
+    sorted?: boolean;
+};
+export declare const COLUMNS: TabelaCol[];
+export declare function getColCellStyle(col: TabelaCol): React.CSSProperties;
+export declare const STATUSES: {
+    readonly active: {
+        readonly label: "Ativo";
+        readonly color: "var(--color-fg-success)";
+    };
+    readonly pending: {
+        readonly label: "Pendente";
+        readonly color: "var(--color-fg-warning)";
+    };
+    readonly paused: {
+        readonly label: "Pausado";
+        readonly color: "var(--color-fg-info)";
+    };
+    readonly inactive: {
+        readonly label: "Inativo";
+        readonly color: "var(--color-fg-muted)";
+    };
+};
+export declare const CATEGORIES: {
+    royal: {
+        label: string;
+        kind: "warning";
+    };
+    licenciado: {
+        label: string;
+        kind: "info";
+    };
+    lead: {
+        label: string;
+        kind: "success";
+    };
+};
+export declare const AGENTS: {
+    readonly you: {
+        readonly name: "Você";
+        readonly initials: "VC";
+        readonly color: "#0a3a2e";
+    };
+    readonly aline: {
+        readonly name: "Aline Castro";
+        readonly initials: "AC";
+        readonly color: "#f59e0b";
+    };
+    readonly carlos: {
+        readonly name: "Carlos Souza";
+        readonly initials: "CS";
+        readonly color: "#8754ec";
+    };
+    readonly maria: {
+        readonly name: "Maria Lima";
+        readonly initials: "ML";
+        readonly color: "#ef4444";
+    };
+};
+export type TabelaRow = {
+    id: string;
+    name: string;
+    initials: string;
+    avatarColor: string;
+    email: string;
+    phone: string;
+    statusId: keyof typeof STATUSES;
+    categoryId: keyof typeof CATEGORIES;
+    location: string;
+    value: number;
+    agentId: keyof typeof AGENTS;
+    createdAt: number;
+    lastContact: number;
+};
+/**
+ * Dataset estendido — 50 rows.
+ * 5 ciclos de ROWS_BASE com IDs sequenciais (CLI-2401 → CLI-2450) e pequenas
+ * variações em nome/cidade/valor pra dar a sensação de dataset real.
+ */
+export declare const ROWS_MOCK: TabelaRow[];
+export declare function formatCurrency(value: number): string;
+export declare function formatDateShort(value: number): string;
+//# sourceMappingURL=mock-data.d.ts.map

package/dist-lib/src/components/ui/TabelaTeste/mock-data.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mock-data.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/TabelaTeste/mock-data.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAQ/C,MAAM,MAAM,SAAS,GAAG;IACtB,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,QAAQ,GAAG,IAAI,GAAG,QAAQ,GAAG,OAAO,GAAG,OAAO,GAAG,QAAQ,GAAG,UAAU,GAAG,OAAO,GAAG,UAAU,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;IAClI,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,SAAS,EAc9B,CAAC;AAEF,wBAAgB,eAAe,CAAC,GAAG,EAAE,SAAS,GAAG,KAAK,CAAC,aAAa,CAInE;AAID,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;CAKX,CAAC;AAEX,eAAO,MAAM,UAAU;;;;;;;;;;;;;CAItB,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;CAKT,CAAC;AAIX,MAAM,MAAM,SAAS,GAAG;IACtB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,OAAO,QAAQ,CAAC;IAChC,UAAU,EAAE,MAAM,OAAO,UAAU,CAAC;IACpC,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,OAAO,MAAM,CAAC;IAC7B,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;CACrB,CAAC;AAsBF;;;;GAIG;AACH,eAAO,MAAM,SAAS,EAAE,SAAS,EAc/B,CAAC;AAIH,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,UAE3C;AAGD,wBAAgB,eAAe,CAAC,KAAK,EAAE,MAAM,UAK5C"}

package/dist-lib/src/components/ui/TabelaTeste/tabela-teste.d.ts

@@ -0,0 +1,12 @@
+/**
+ * TabelaTeste — réplica visual da tabela do sandbox `/design-and-table-v2`.
+ *
+ * Hardcoded por design: sem props além do nada. 13 colunas fixas, 10 rows mock,
+ * densidade comfortable, cell-borders on. Toggle de seleção e detail panel
+ * (state local).
+ *
+ * Serve como referência visual fixa pra outros componentes Table do DS — o
+ * mapeamento de tokens, espaçamentos e estados está aqui de forma literal.
+ */
+export declare function TabelaTeste(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=tabela-teste.d.ts.map

package/dist-lib/src/components/ui/TabelaTeste/tabela-teste.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabela-teste.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/TabelaTeste/tabela-teste.tsx"],"names":[],"mappings":"AAgBA;;;;;;;;;GASG;AACH,wBAAgB,WAAW,4CAiE1B"}

package/dist-lib/src/components/ui/TabelaTeste/tabela-teste.styles.d.ts

@@ -0,0 +1,184 @@
+/**
+ * TabelaTeste — réplica visual da tabela do sandbox /design-and-table-v2.
+ *
+ * Componente de referência hardcoded: sem props, sem variants, sem flexibility.
+ * Serve pra fixar como tokens DS mapeiam pra esse visual específico — outros
+ * componentes (Table) podem usar essas classes como guia.
+ *
+ * Os estilos abaixo são literais — cada key corresponde a uma classe do
+ * sandbox. Densidade default = comfortable (56px), cellBorders ON.
+ */
+export declare const tabelaStyles: {
+    wrap: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
+    table: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "block min-w-max", {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "block min-w-max", unknown, unknown, undefined>>;
+    thead: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
+    trHead: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "flex bg-bg-table-head", {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "flex bg-bg-table-head", unknown, unknown, undefined>>;
+    th: import('tailwind-variants').TVReturnType<{
+        sorted: {
+            true: string;
+        };
+    }, undefined, string[], {
+        sorted: {
+            true: string;
+        };
+    }, undefined, import('tailwind-variants').TVReturnType<{
+        sorted: {
+            true: string;
+        };
+    }, undefined, string[], unknown, unknown, undefined>>;
+    thSelect: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
+    thActions: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
+    thLabel: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "flex-1 min-w-0 whitespace-nowrap overflow-hidden text-ellipsis text-left", {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "flex-1 min-w-0 whitespace-nowrap overflow-hidden text-ellipsis text-left", unknown, unknown, undefined>>;
+    thTypeIcon: import('tailwind-variants').TVReturnType<{
+        sorted: {
+            true: string;
+        };
+    }, undefined, string[], {
+        sorted: {
+            true: string;
+        };
+    }, undefined, import('tailwind-variants').TVReturnType<{
+        sorted: {
+            true: string;
+        };
+    }, undefined, string[], unknown, unknown, undefined>>;
+    thSort: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "inline-flex items-center gap-[4px] shrink-0 text-fg-default", {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "inline-flex items-center gap-[4px] shrink-0 text-fg-default", unknown, unknown, undefined>>;
+    thSortIndex: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
+    thSortHint: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
+    thMenu: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
+    thResize: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
+    tbody: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "bg-bg-surface", {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "bg-bg-surface", unknown, unknown, undefined>>;
+    tr: import('tailwind-variants').TVReturnType<{
+        density: {
+            compact: string;
+            comfortable: string;
+            spacious: string;
+        };
+        selected: {
+            true: string;
+        };
+    }, undefined, string[], {
+        density: {
+            compact: string;
+            comfortable: string;
+            spacious: string;
+        };
+        selected: {
+            true: string;
+        };
+    }, undefined, import('tailwind-variants').TVReturnType<{
+        density: {
+            compact: string;
+            comfortable: string;
+            spacious: string;
+        };
+        selected: {
+            true: string;
+        };
+    }, undefined, string[], unknown, unknown, undefined>>;
+    td: import('tailwind-variants').TVReturnType<{
+        density: {
+            compact: string;
+            comfortable: string;
+            spacious: string;
+        };
+    }, undefined, string[], {
+        density: {
+            compact: string;
+            comfortable: string;
+            spacious: string;
+        };
+    }, undefined, import('tailwind-variants').TVReturnType<{
+        density: {
+            compact: string;
+            comfortable: string;
+            spacious: string;
+        };
+    }, undefined, string[], unknown, unknown, undefined>>;
+    tdSelect: import('tailwind-variants').TVReturnType<{
+        density: {
+            compact: string;
+            comfortable: string;
+            spacious: string;
+        };
+    }, undefined, string[], {
+        density: {
+            compact: string;
+            comfortable: string;
+            spacious: string;
+        };
+    }, undefined, import('tailwind-variants').TVReturnType<{
+        density: {
+            compact: string;
+            comfortable: string;
+            spacious: string;
+        };
+    }, undefined, string[], unknown, unknown, undefined>>;
+    tdActions: import('tailwind-variants').TVReturnType<{
+        density: {
+            compact: string;
+            comfortable: string;
+            spacious: string;
+        };
+        selected: {
+            true: string;
+        };
+    }, undefined, string[], {
+        density: {
+            compact: string;
+            comfortable: string;
+            spacious: string;
+        };
+        selected: {
+            true: string;
+        };
+    }, undefined, import('tailwind-variants').TVReturnType<{
+        density: {
+            compact: string;
+            comfortable: string;
+            spacious: string;
+        };
+        selected: {
+            true: string;
+        };
+    }, undefined, string[], unknown, unknown, undefined>>;
+    rowMenuBtn: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
+    cellBorderTh: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "border-r border-border-table", {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "border-r border-border-table", unknown, unknown, undefined>>;
+    cellBorderTd: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "border-r border-border-table", {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "border-r border-border-table", unknown, unknown, undefined>>;
+    cellId: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "text-body-sm font-normal text-fg-muted [font-variant-numeric:tabular-nums]", {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "text-body-sm font-normal text-fg-muted [font-variant-numeric:tabular-nums]", unknown, unknown, undefined>>;
+    cellCurrency: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "[font-variant-numeric:tabular-nums] font-semibold", {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "[font-variant-numeric:tabular-nums] font-semibold", unknown, unknown, undefined>>;
+    cellDate: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "[font-variant-numeric:tabular-nums] text-fg-muted", {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "[font-variant-numeric:tabular-nums] text-fg-muted", unknown, unknown, undefined>>;
+    cellStatus: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "inline-flex items-center gap-gp-md text-body-sm font-normal text-fg-default dark:text-fg-muted", {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "inline-flex items-center gap-gp-md text-body-sm font-normal text-fg-default dark:text-fg-muted", unknown, unknown, undefined>>;
+    dot: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "size-[8px] rounded-radius-full shrink-0", {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "size-[8px] rounded-radius-full shrink-0", unknown, unknown, undefined>>;
+    cellPerson: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "inline-flex items-center gap-gp-md whitespace-nowrap overflow-hidden", {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "inline-flex items-center gap-gp-md whitespace-nowrap overflow-hidden", unknown, unknown, undefined>>;
+    cellPersonName: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "whitespace-nowrap overflow-hidden text-ellipsis font-medium", {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "whitespace-nowrap overflow-hidden text-ellipsis font-medium", unknown, unknown, undefined>>;
+    cellAgent: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "inline-flex items-center gap-gp-md whitespace-nowrap overflow-hidden", {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "inline-flex items-center gap-gp-md whitespace-nowrap overflow-hidden", unknown, unknown, undefined>>;
+    avatar: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
+    avatarSm: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
+    cellLink: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "text-fg-brand no-underline hover:underline", {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "text-fg-brand no-underline hover:underline", unknown, unknown, undefined>>;
+    cellMuted: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "text-fg-muted", {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "text-fg-muted", unknown, unknown, undefined>>;
+    checkbox: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
+    chip: import('tailwind-variants').TVReturnType<{
+        kind: {
+            success: string;
+            warning: string;
+            info: string;
+            danger: string;
+        };
+    }, undefined, string[], {
+        kind: {
+            success: string;
+            warning: string;
+            info: string;
+            danger: string;
+        };
+    }, undefined, import('tailwind-variants').TVReturnType<{
+        kind: {
+            success: string;
+            warning: string;
+            info: string;
+            danger: string;
+        };
+    }, undefined, string[], unknown, unknown, undefined>>;
+};
+//# sourceMappingURL=tabela-teste.styles.d.ts.map

package/dist-lib/src/components/ui/TabelaTeste/tabela-teste.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabela-teste.styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/TabelaTeste/tabela-teste.styles.ts"],"names":[],"mappings":"AAEA;;;;;;;;;GASG;AAEH,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiVxB,CAAC"}