nave-ui-library 1.0.0-beta.41 → 1.0.0-beta.43

package/dist/lit/index.d.ts

@@ -1,1423 +1,57 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as React$1 from 'react';
-import { CSSProperties } from 'react';
+import * as React from 'react';
+import * as LabelPrimitive from '@radix-ui/react-label';
+import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
+import * as SwitchPrimitive from '@radix-ui/react-switch';
 import * as class_variance_authority_types from 'class-variance-authority/types';
-import * as AvatarPrimitive from '@radix-ui/react-avatar';
-import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
-import * as PopoverPrimitive from '@radix-ui/react-popover';
-import * as TooltipPrimitive from '@radix-ui/react-tooltip';
 import { VariantProps } from 'class-variance-authority';
 import { Loader2Icon } from 'lucide-react';
 import * as ProgressPrimitive from '@radix-ui/react-progress';
-import * as AccordionPrimitive from '@radix-ui/react-accordion';
-import { DayPicker } from 'react-day-picker';
-import * as LabelPrimitive from '@radix-ui/react-label';
-import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
-import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
-import * as SwitchPrimitive from '@radix-ui/react-switch';
-import * as vaul from 'vaul';
-import { Drawer as Drawer$1 } from 'vaul';
-import * as _radix_ui_react_dialog from '@radix-ui/react-dialog';
-import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
-import * as TabsPrimitive from '@radix-ui/react-tabs';
+import * as AvatarPrimitive from '@radix-ui/react-avatar';
 import * as SeparatorPrimitive from '@radix-ui/react-separator';
-import { ClassValue } from 'clsx';
-
-type AITask = 'smartSearch' | 'textAssist' | 'formHelper' | 'tagSuggest' | 'emptyState' | 'dataInsights' | 'translate' | 'explainCode';
-type AIRequest<TContext = unknown> = {
-    task: AITask;
-    input?: string;
-    context?: TContext;
-    data?: unknown;
-    options?: Record<string, unknown>;
-};
-type AIResponse<T = unknown> = {
-    output: T;
-    raw?: unknown;
-};
-type AIRequestFn = <T = unknown>(payload: AIRequest) => Promise<AIResponse<T>>;
-
-type AIProviderProps = {
-    request: AIRequestFn;
-    children: React$1.ReactNode;
-};
-declare function AIProvider({ request, children }: AIProviderProps): react_jsx_runtime.JSX.Element;
-declare function useAI(): AIRequestFn | null;
 
 interface ThemeTokensBase {
     [key: string]: unknown;
 }
-/**
- * Recursive token map returned by `resolveTokens`.
- *
- * Values are typed as `any` because token structures come from runtime JSON
- * configuration and their shapes vary per component. This enables ergonomic
- * deep chaining without casts:
- *
- * ```ts
- * const tokens = resolveTokens({ componentName: 'button', variant }, theme);
- * tokens?.hover?.background   // any
- * tokens?.sizes?.medium        // any
- * ```
- *
- * For component-specific token shapes with full autocomplete, define a typed
- * interface and pass it as a generic:
- *
- * ```ts
- * const tokens = resolveTokens<ButtonTokens>({ componentName: 'button', variant }, theme);
- * tokens?.hover?.background   // string | undefined  (narrowed by ButtonTokens)
- * ```
- */
-interface ResolvedTokenMap {
-    [key: string]: any;
-}
-/**
- * Type-safe descent into a token branch (e.g. `sizes`, `variants`, `tones`).
- *
- * Navigates through nested keys and returns a `ResolvedTokenMap` at the target.
- * Returns `{}` when any segment along the path is missing or not an object.
- *
- * ```ts
- * const sizeTokens = tokenAt(mergedTokens, 'sizes', 'medium');
- * sizeTokens?.fontSize   // string | number | ...
- * sizeTokens?.height     // string | number | ...
- * ```
- */
-declare function tokenAt(tokens: ResolvedTokenMap, ...keys: string[]): ResolvedTokenMap;
-
-declare function useTheme<T extends ThemeTokensBase = ThemeTokensBase>(): T;
-
-type ResolveTokensParams = {
-    componentName: string;
-    variant?: string;
-    size?: string;
-    tone?: string;
-    tokens?: Partial<ThemeTokensBase>;
-};
-
-declare function resolveTokens<T extends ResolvedTokenMap = ResolvedTokenMap>({ componentName, variant, size, tone, tokens }: ResolveTokensParams, theme: ThemeTokensBase): T;
 
 /**
- * Typed token contracts for every component.
- *
- * Each interface describes the **resolved** shape returned by `resolveTokens`
- * after base / variant / size / tone merging.  Passing the generic to
- * `resolveTokens<ButtonTokens>(…)` gives full autocomplete and catches typos
- * at compile time.
+ * Theme bridge for Web Components.
  *
- * Every contract extends `ResolvedTokenMap` so the result remains compatible
- * with `mapTokenStyles(mergedTokens, MAP)` which expects `Record<string, unknown>`.
+ * Solves the fundamental issue that each `nave-*` custom element is an
+ * isolated React root, so React Context does NOT flow between them.
  *
- * @module token-types
- */
-
-/** Common typography tokens shared by most components. */
-interface TypographyTokens {
-    fontFamily?: string;
-    lineHeight?: string;
-    letterSpacing?: string;
-}
-/** Foreground + background + border bundle (buttons, inputs, alerts, …). */
-interface ColorBundle {
-    background?: string;
-    color?: string;
-    border?: string;
-}
-/** Extended color bundle with box-shadow (inputs, badges, …). */
-interface ColorBundleWithShadow extends ColorBundle {
-    boxShadow?: string;
-}
-/** Font sizing subset used by multiple size-aware components. */
-interface FontSizeTokens {
-    fontSize?: string;
-    fontWeight?: string | number;
-}
-/** Font sizing + color subset used by labels / helpers inside inputs. */
-interface LabeledFontTokens extends FontSizeTokens {
-    labelFontSize?: string;
-    inputFontSize?: string;
-    helperFontSize?: string;
-    labelFontWeight?: string | number;
-    inputFontWeight?: string | number;
-    helperFontWeight?: string | number;
-    labelColor?: string;
-    helperColor?: string;
-    descriptionColor?: string;
-}
-/** Padding / height subset shared by input-family sizes. */
-interface InputSizeDimensions extends LabeledFontTokens {
-    height?: string;
-    padding?: string;
-    iconSize?: string | number;
-}
-interface ButtonTokens extends TypographyTokens, ResolvedTokenMap {
-    radius?: string;
-    transition?: string;
-    gap?: string;
-    sizes?: Record<string, {
-        height?: string;
-        paddingX?: string;
-        fontSize?: string;
-        fontWeight?: string | number;
-        iconSize?: string | number;
-    }>;
-    variants?: Record<string, ColorBundle & {
-        hover?: ColorBundle;
-        disabled?: ColorBundle;
-        loading?: ColorBundle;
-        focus?: {
-            boxShadow?: string;
-        };
-    }>;
-}
-interface InputTokens extends TypographyTokens, ResolvedTokenMap {
-    background?: string;
-    color?: string;
-    radius?: string;
-    border?: string;
-    boxShadow?: string;
-    hover?: ColorBundleWithShadow;
-    focus?: ColorBundleWithShadow;
-    filled?: ColorBundleWithShadow;
-    disabled?: ColorBundleWithShadow;
-    error?: ColorBundleWithShadow & {
-        filled?: ColorBundleWithShadow;
-        focus?: ColorBundleWithShadow;
-        hover?: ColorBundleWithShadow;
-    };
-    sizes?: Record<string, InputSizeDimensions>;
-}
-interface SelectTokens extends InputTokens, ResolvedTokenMap {
-}
-interface LabelTokens extends ResolvedTokenMap {
-    fontSize?: string;
-    color?: string;
-    fontWeight?: string | number;
-    padding?: string;
-}
-interface CalendarTokens extends TypographyTokens, ResolvedTokenMap {
-    background?: string;
-    text?: string;
-    muted?: string;
-    radius?: string;
-    border?: string;
-    item?: {
-        size?: string;
-        radius?: string;
-        hover?: {
-            background?: string;
-        };
-        current?: {
-            background?: string;
-        };
-        active?: {
-            background?: string;
-            color?: string;
-        };
-    };
-}
-interface SwitchTokens extends TypographyTokens, ResolvedTokenMap {
-    gap?: string;
-    textGap?: string;
-    background?: string;
-    track?: {
-        offBackgroundHover?: string;
-        onBackground?: string;
-        onBackgroundHover?: string;
-    };
-    handle?: {
-        color?: string;
-    };
-    disabled?: {
-        background?: string;
-        text?: string;
-        track?: string;
-    };
-    motion?: {
-        duration?: string;
-    };
-    sizes?: Record<string, {
-        labelFontWeight?: string | number;
-        descriptionFontWeight?: string | number;
-        labelFontSize?: string;
-        descriptionFontSize?: string;
-        labelColor?: string;
-        descriptionColor?: string;
-        track?: {
-            width?: string;
-            height?: string;
-        };
-        handle?: {
-            size?: string;
-            translate?: string;
-        };
-    }>;
-}
-interface RadioTokens extends TypographyTokens, ResolvedTokenMap {
-    outer?: {
-        background?: string;
-        border?: string;
-        focusBorder?: string;
-        hoverBorder?: string;
-    };
-    checked?: {
-        background?: string;
-        backgroundHover?: string;
-    };
-    disabled?: {
-        background?: string;
-        border?: string;
-        dot?: string;
-        text?: string;
-    };
-    gap?: string;
-    textGap?: string;
-    motion?: {
-        duration?: string;
-    };
-    sizes?: Record<string, {
-        outer?: {
-            size?: string;
-        };
-        dot?: {
-            size?: string;
-        };
-        labelFontSize?: string;
-        descriptionFontSize?: string;
-        labelFontWeight?: string | number;
-        descriptionFontWeight?: string | number;
-        labelColor?: string;
-        descriptionColor?: string;
-    }>;
-}
-interface CheckboxTokens extends TypographyTokens, ResolvedTokenMap {
-    fontWeight?: string | number;
-    gap?: string;
-    textGap?: string;
-    disabled?: {
-        text?: string;
-    };
-    track?: {
-        background?: string;
-        border?: string;
-        focusBorder?: string;
-    };
-    checked?: {
-        background?: string;
-        backgroundHover?: string;
-    };
-    thumb?: {
-        color?: string;
-    };
-    sizes?: Record<string, {
-        control?: string;
-        icon?: string;
-        labelFontSize?: string;
-        descriptionFontSize?: string;
-        labelFontWeight?: string | number;
-        descriptionFontWeight?: string | number;
-        labelColor?: string;
-        descriptionColor?: string;
-    }>;
-}
-interface SeparatorTokens extends ResolvedTokenMap {
-    color?: string;
-    opacity?: string | number;
-    orientation?: {
-        horizontal?: {
-            width?: string;
-            height?: string;
-        };
-        vertical?: {
-            width?: string;
-            height?: string;
-        };
-    };
-}
-interface PaginationTokens extends TypographyTokens, ResolvedTokenMap {
-    gap?: string;
-    radius?: string;
-    pageNumber?: FontSizeTokens;
-    icon?: {
-        size?: string;
-        color?: string;
-    };
-    item?: {
-        default?: ColorBundle;
-        hover?: {
-            background?: string;
-            border?: string;
-        };
-        active?: {
-            background?: string;
-            text?: string;
-            border?: string;
-        };
-        focus?: {
-            border?: string;
-        };
-        disabled?: {
-            background?: string;
-            text?: string;
-            opacity?: string | number;
-        };
-    };
-}
-interface TabsTokens extends TypographyTokens, ResolvedTokenMap {
-    tabsList?: {
-        background?: string;
-        color?: string;
-        radius?: string;
-    };
-    tabsTrigger?: {
-        color?: string;
-        active?: {
-            background?: string;
-            color?: string;
-            boxShadow?: string;
-        };
-        hover?: {
-            background?: string;
-        };
-        disabled?: {
-            opacity?: string | number;
-            background?: string;
-            color?: string;
-        };
-    };
-    tabsFocusRing?: {
-        innerColor?: string;
-        outerColor?: string;
-        innerSize?: string;
-        outerSize?: string;
-    };
-    sizes?: Record<string, FontSizeTokens>;
-}
-interface SidebarTokens extends ResolvedTokenMap {
-    container?: {
-        background?: string;
-        border?: string;
-        width?: string;
-        collapsedWidth?: string;
-        padding?: string;
-    };
-    header?: {
-        minHeight?: string;
-        titleColor?: string;
-        titleFontSize?: string;
-        titleFontWeight?: string | number;
-        titleFontFamily?: string;
-        titleLineHeight?: string;
-        titleLetterSpacing?: string;
-    };
-    item?: {
-        radius?: string;
-        height?: string;
-        paddingX?: string;
-        gap?: string;
-        fontSize?: string;
-        fontWeight?: string | number;
-        color?: string;
-        fontFamily?: string;
-        lineHeight?: string;
-        letterSpacing?: string;
-        hover?: {
-            background?: string;
-            color?: string;
-        };
-        active?: {
-            background?: string;
-            color?: string;
-        };
-    };
-    section?: {
-        titleColor?: string;
-        titleFontSize?: string;
-        titleFontFamily?: string;
-        titleLineHeight?: string;
-        titleLetterSpacing?: string;
-        gap?: string;
-    };
-    toggle?: {
-        color?: string;
-        hoverColor?: string;
-    };
-    motion?: {
-        duration?: string;
-    };
-}
-interface TourTokens extends TypographyTokens, ResolvedTokenMap {
-    backgroundColor?: string;
-    borderColor?: string;
-    borderRadius?: string;
-    padding?: string;
-    shadow?: string;
-    gap?: string;
-    step?: TypographyTokens & FontSizeTokens & {
-        color?: string;
-    };
-    title?: TypographyTokens & FontSizeTokens & {
-        color?: string;
-    };
-    description?: TypographyTokens & FontSizeTokens & {
-        color?: string;
-    };
-    actions?: {
-        gap?: string;
-    };
-    arrow?: {
-        size?: string;
-        background?: string;
-        borderColor?: string;
-    };
-}
-interface NavbarTokens extends TypographyTokens, ResolvedTokenMap {
-    container?: {
-        height?: string;
-        background?: string;
-        border?: string;
-        radius?: string;
-        iconColor?: string;
-    };
-    expanded?: {
-        background?: string;
-    };
-    content?: {
-        maxWidth?: string;
-        paddingX?: string;
-        gap?: string;
-    };
-    start?: {
-        gap?: string;
-    };
-    end?: {
-        gap?: string;
-    };
-    logo?: {
-        gap?: string;
-    };
-    motion?: {
-        duration?: string;
-    };
-    merchant?: TypographyTokens & {
-        color?: string;
-        fontSize?: string;
-        fontWeight?: string | number;
-        gap?: string;
-        triggerGap?: string;
-        paddingX?: string;
-        paddingY?: string;
-    };
-    user?: {
-        nameColor?: string;
-        roleColor?: string;
-        nameFontFamily?: string;
-        roleFontFamily?: string;
-        nameFontSize?: string;
-        roleFontSize?: string;
-        nameFontWeight?: string | number;
-        roleFontWeight?: string | number;
-        nameLineHeight?: string;
-        roleLineHeight?: string;
-        nameLetterSpacing?: string;
-        roleLetterSpacing?: string;
-        gap?: string;
-        paddingX?: string;
-        paddingY?: string;
-        triggerHover?: string;
-        focusColor?: string;
-    };
-}
-interface ModalDialogTokens extends TypographyTokens, ResolvedTokenMap {
-    overlay?: {
-        background?: string;
-    };
-    content?: {
-        background?: string;
-        radius?: string;
-        borderColor?: string;
-        width?: string;
-        maxWidth?: string;
-        maxHeight?: string;
-        padding?: string;
-        gap?: string;
-    };
-    header?: {
-        gap?: string;
-    };
-    footer?: {
-        gap?: string;
-    };
-    title?: TypographyTokens & FontSizeTokens & {
-        color?: string;
-    };
-    description?: TypographyTokens & FontSizeTokens & {
-        color?: string;
-    };
-    sizes?: Record<string, {
-        padding?: string;
-        gap?: string;
-        headerGap?: string;
-        footerGap?: string;
-    }>;
-}
-interface HeaderTokens extends ResolvedTokenMap {
-    container?: {
-        gapMobile?: string;
-        gapDesktop?: string;
-        minHeightMobile?: string;
-        minHeightDesktop?: string;
-    };
-    title?: TypographyTokens & FontSizeTokens & {
-        color?: string;
-        fontSizeMobile?: string;
-        fontSizeDesktop?: string;
-    };
-    description?: TypographyTokens & FontSizeTokens & {
-        color?: string;
-        fontSizeMobile?: string;
-        fontSizeDesktop?: string;
-    };
-}
-interface BreadcrumbTokens extends TypographyTokens, ResolvedTokenMap {
-    fontSize?: string;
-    gap?: string;
-    itemMinHeight?: string;
-    maxLabelLength?: string | number;
-    link?: {
-        default?: {
-            color?: string;
-            fontWeight?: string | number;
-        };
-        hover?: {
-            color?: string;
-            textDecoration?: string;
-        };
-    };
-    page?: {
-        color?: string;
-        fontWeight?: string | number;
-    };
-    separator?: {
-        color?: string;
-        size?: string;
-    };
-}
-interface DrawerTokens extends ResolvedTokenMap {
-    overlay?: {
-        background?: string;
-        opacity?: string | number;
-        backdropBlur?: string;
-    };
-    content?: ColorBundle & {
-        radius?: string;
-        shadow?: string;
-        maxHeight?: string;
-    };
-    title?: TypographyTokens & FontSizeTokens & {
-        color?: string;
-    };
-    description?: TypographyTokens & FontSizeTokens & {
-        color?: string;
-    };
-}
-interface IconTokens extends ResolvedTokenMap {
-    color?: string;
-    sizes?: Record<string, number | string>;
-}
-interface ModuleBoxTokens extends TypographyTokens, ResolvedTokenMap {
-    backgroundColor?: string;
-    borderColor?: string;
-    borderRadius?: string;
-    padding?: string;
-    gap?: string;
-    header?: {
-        gap?: string;
-    };
-    footer?: {
-        gap?: string;
-    };
-    slot?: {
-        background?: string;
-        border?: string;
-        borderRadius?: string;
-        padding?: string;
-        minHeight?: string;
-        color?: string;
-    };
-    title?: {
-        color?: string;
-        fontSize?: string;
-        fontWeight?: string | number;
-        fontStyle?: string;
-        fontFamily?: string;
-    };
-}
-interface PopoverTokens extends TypographyTokens, ResolvedTokenMap {
-    color?: string;
-    background?: string;
-    radius?: string;
-    border?: string;
-    shadow?: string;
-    padding?: string;
-    fontSize?: string;
-    fontWeight?: string | number;
-    zIndex?: string | number;
-}
-interface TooltipTokens extends TypographyTokens, ResolvedTokenMap {
-    color?: string;
-    background?: string;
-    radius?: string;
-    maxWidth?: string;
-    minHeight?: string;
-    gap?: string;
-    zIndex?: string | number;
-    paddingX?: string;
-    paddingY?: string;
-    fontSize?: string;
-    fontWeight?: string | number;
-    textAlign?: string;
-    caretColor?: string;
-    caretSize?: string | number;
-}
-interface FileUploadTokens extends TypographyTokens, ResolvedTokenMap {
-    container?: {
-        background?: string;
-        padding?: string;
-        radius?: string;
-    };
-    dropzone?: {
-        borderWidth?: string;
-        borderStyle?: string;
-        borderColor?: Record<string, string>;
-        gap?: string;
-    };
-    icon?: {
-        size?: string;
-        wrapperSize?: string;
-        color?: string;
-        wrapperBg?: string;
-        wrapperRadius?: string;
-    };
-    title?: FontSizeTokens & {
-        color?: string;
-    };
-    description?: FontSizeTokens & {
-        color?: string;
-    };
-}
-interface LoaderTokens extends TypographyTokens, ResolvedTokenMap {
-    color?: string;
-    sizes?: Record<string, {
-        spinnerSize?: string | number;
-        size?: string | number;
-        minWidth?: string;
-        maxWidth?: string;
-        minHeight?: string;
-        paddingX?: string;
-        paddingY?: string;
-        contentGap?: string;
-        textGap?: string;
-        labelFontSize?: string;
-        descriptionFontSize?: string;
-        labelFontWeight?: string | number;
-        descriptionFontWeight?: string | number;
-        labelColor?: string;
-        descriptionColor?: string;
-    }>;
-    variants?: Record<string, {
-        color?: string;
-    }>;
-}
-interface EmptyStateTokens extends TypographyTokens, ResolvedTokenMap {
-    container?: {
-        background?: string;
-        paddingY?: string;
-        paddingX?: string;
-        gap?: string;
-    };
-    content?: {
-        gap?: string;
-    };
-    text?: {
-        gap?: string;
-    };
-    actions?: {
-        gap?: string;
-    };
-    icon?: {
-        containerPadding?: string;
-        color?: string;
-    };
-    minWidth?: string;
-    maxWidth?: string;
-    iconSize?: string;
-    titleSize?: string;
-    descriptionSize?: string;
-    title?: {
-        color?: string;
-        fontWeight?: string | number;
-    };
-    description?: {
-        color?: string;
-        fontWeight?: string | number;
-    };
-}
-interface ProgressTokens extends TypographyTokens, ResolvedTokenMap {
-    track?: {
-        height?: string;
-        radius?: string;
-        background?: string;
-    };
-    indicator?: {
-        background?: string;
-    };
-    motion?: {
-        duration?: string;
-        easing?: string;
-    };
-    labelColor?: string;
-    labelFontSize?: string;
-    labelFontWeight?: string | number;
-    descriptionColor?: string;
-    descriptionFontSize?: string;
-    gap?: string;
-}
-interface BadgeTokens extends TypographyTokens, ResolvedTokenMap {
-    fontWeight?: string | number;
-    sizes?: Record<string, {
-        fontSize?: string;
-        height?: string;
-        padding?: string;
-    }>;
-    tones?: Record<string, ColorBundle>;
-    shapes?: Record<string, {
-        radius?: string;
-    }>;
-}
-interface AlertTokens extends TypographyTokens, ResolvedTokenMap {
-    base?: {
-        radius?: string;
-        lineHeight?: string;
-        letterSpacing?: string;
-    };
-    title?: TypographyTokens & FontSizeTokens & {
-        color?: string;
-    };
-    description?: TypographyTokens & FontSizeTokens & {
-        color?: string;
-    };
-    cta?: TypographyTokens & FontSizeTokens;
-    icon?: {
-        containerSize?: string;
-        containerRadius?: string;
-    };
-    close?: {
-        iconSize?: string;
-    };
-    sizes?: Record<string, {
-        paddingY?: string;
-        paddingX?: string;
-        gap?: string;
-        minHeight?: string;
-        titleMaxLines?: number;
-        descriptionMaxLines?: number;
-    }>;
-    tones?: Record<string, {
-        background?: string;
-        border?: string;
-        action?: string;
-        iconColor?: string;
-        iconBg?: string;
-    }>;
-}
-interface DropdownTokens extends TypographyTokens, ResolvedTokenMap {
-    background?: string;
-    color?: string;
-    fontSize?: string;
-    fontWeight?: string | number;
-    border?: string;
-    radius?: string;
-    shadow?: string;
-    item?: {
-        color?: string;
-        fontSize?: string;
-        fontWeight?: string | number;
-        background?: string;
-        hoverBackground?: string;
-        borderRadius?: string;
-        activeBackground?: string;
-        disabledOpacity?: string | number;
-        iconSize?: string;
-        iconColor?: string;
-    };
-    section?: {
-        separatorColor?: string;
-    };
-}
-interface TableTokens extends TypographyTokens, ResolvedTokenMap {
-    background?: string;
-    border?: string;
-    radius?: string;
-    shadow?: string;
-    headerBackground?: string;
-    headerTextColor?: string;
-    headerFontSize?: string;
-    headerFontWeight?: string | number;
-    rowHoverBackground?: string;
-    rowSelectedBackground?: string;
-    cellTextColor?: string;
-    cellFontSize?: string;
-    descriptionColor?: string;
-    descriptionFontSize?: string;
-    descriptionFontWeight?: string | number;
-}
-interface ChartsTokens extends TypographyTokens, ResolvedTokenMap {
-    height?: string | number;
-    backgroundColor?: string;
-    borderColor?: string;
-    borderRadius?: string;
-    padding?: string;
-    title?: FontSizeTokens & {
-        color?: string;
-    };
-    subtitle?: FontSizeTokens & {
-        color?: string;
-    };
-    grid?: {
-        color?: string;
-        dasharray?: string;
-    };
-    axis?: {
-        lineColor?: string;
-        labelColor?: string;
-        fontSize?: string;
-    };
-    baseline?: {
-        color?: string;
-        strokeWidth?: string | number;
-        dasharray?: string;
-    };
-    legend?: {
-        color?: string;
-        fontSize?: string;
-        fontWeight?: string | number;
-        dotSize?: string | number;
-        gap?: string;
-    };
-    tooltip?: {
-        background?: string;
-        borderColor?: string;
-        radius?: string;
-        titleColor?: string;
-        valueColor?: string;
-        titleFontSize?: string;
-        titleFontWeight?: string | number;
-        valueFontSize?: string;
-        valueFontWeight?: string | number;
-    };
-    palette?: string[];
-    line?: {
-        stroke?: string;
-        strokeWidth?: string | number;
-        areaFrom?: string;
-        areaTo?: string;
-        curveType?: string;
-        activeDotRadius?: number;
-        palette?: string[];
-    };
-    bar?: {
-        radius?: string | number;
-        gap?: string | number;
-        categoryGap?: string | number;
-        maxBarSize?: number;
-        palette?: string[];
-    };
-    pie?: {
-        innerRadius?: string | number;
-        outerRadius?: string | number;
-        paddingAngle?: number;
-        strokeColor?: string;
-        strokeWidth?: string | number;
-        palette?: string[];
-    };
-    donut?: {
-        innerRadius?: string | number;
-        outerRadius?: string | number;
-        centerValueColor?: string;
-        centerValueSize?: string;
-        centerValueWeight?: string | number;
-        centerLabelColor?: string;
-        centerLabelSize?: string;
-        centerLabelWeight?: string | number;
-    };
-    emptyState?: TypographyTokens & FontSizeTokens & {
-        color?: string;
-    };
-}
-interface AccordionTokens extends TypographyTokens, ResolvedTokenMap {
-    background?: string;
-    borderColor?: string;
-    radius?: string;
-    borderWidth?: string;
-    fontWeight?: string | number;
-    text?: {
-        title?: string;
-        content?: string;
-        icon?: string;
-    };
-    states?: {
-        hover?: {
-            text?: string;
-        };
-        focus?: {
-            borderColor?: string;
-        };
-    };
-    sizes?: Record<string, {
-        trigger?: FontSizeTokens;
-    }>;
-}
-interface AvatarTokens extends TypographyTokens, ResolvedTokenMap {
-    fontFamily?: string;
-    fallback?: {
-        background?: string;
-        color?: string;
-        fontWeight?: string | number;
-    };
-    shapes?: {
-        radius?: string;
-    };
-    sizes?: Record<string, {
-        size?: string;
-        border?: string;
-        fontSize?: string;
-    }>;
-}
-interface IntegrationCardTokens extends ResolvedTokenMap {
-    backgroundColor?: string;
-    borderColor?: string;
-    borderRadius?: string;
-    title?: {
-        color?: string;
-    };
-    description?: {
-        color?: string;
-    };
-    link?: {
-        color?: string;
-    };
-}
-interface PromoBannerTokens extends TypographyTokens, ResolvedTokenMap {
-    background?: string;
-    border?: string;
-    iconBg?: string;
-    iconColor?: string;
-    action?: string;
-    borderRadius?: string;
-    padding?: string;
-    imageBg?: string;
-    imageRadius?: string;
-    title?: TypographyTokens & FontSizeTokens & {
-        color?: string;
-    };
-    description?: TypographyTokens & FontSizeTokens & {
-        color?: string;
-    };
-    variants?: Record<string, {
-        background?: string;
-        border?: string;
-        iconBg?: string;
-        iconColor?: string;
-        action?: string;
-        borderRadius?: string;
-        padding?: string;
-        imageBg?: string;
-        imageRadius?: string;
-    }>;
-}
-interface DragSliderTokens extends ResolvedTokenMap {
-    gap?: string;
-    cursorGrab?: string;
-    cursorGrabbing?: string;
-}
-interface CardTokens extends ResolvedTokenMap {
-    backgroundColor?: string;
-    borderColor?: string;
-    color?: string;
-    borderRadius?: string;
-    padding?: string;
-    title?: {
-        fontSize?: string;
-        fontWeight?: string | number;
-        letterSpacing?: string;
-        lineHeight?: string;
-    };
-}
-interface BannerTokens extends ResolvedTokenMap {
-    tones?: Record<string, {
-        background?: string;
-        border?: string;
-        text?: string;
-        iconBg?: string;
-        iconColor?: string;
-        action?: string;
-    }>;
-}
-
-type ButtonProps = React$1.ComponentProps<'button'> & {
-    tokens?: Partial<ThemeTokensBase>;
-    variant?: 'primary' | 'secondary' | 'tertiary' | 'neutral';
-    size?: 'small' | 'medium' | 'large' | 'icon' | 'icon-small' | 'icon-large';
-    asChild?: boolean;
-    textPaddingX?: string | number;
-    startIcon?: React$1.ReactNode;
-    endIcon?: React$1.ReactNode;
-    loading?: boolean;
-    loadingLabel?: React$1.ReactNode;
-};
-declare const buttonBaseClasses: (props?: ({
-    variant?: "primary" | "secondary" | "tertiary" | "neutral" | null | undefined;
-    size?: "icon" | "sm" | "md" | "lg" | "icon-sm" | "icon-lg" | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
-declare function Button({ className, variant, size, asChild, tokens, textPaddingX, startIcon, endIcon, loading, loadingLabel, style, children, ...props }: ButtonProps): react_jsx_runtime.JSX.Element;
-
-type AvatarSize = 'sm' | 'md' | 'lg';
-type AvatarProps = React$1.ComponentProps<typeof AvatarPrimitive.Root> & {
-    size?: AvatarSize;
-    src?: string;
-    alt?: string;
-    fallback?: React$1.ReactNode;
-    name?: string;
-    imageClassName?: string;
-    fallbackClassName?: string;
-    tokens?: Partial<ThemeTokensBase>;
-    asChild?: boolean;
-};
-declare function Avatar({ className, size, src, alt, fallback, name, imageClassName, fallbackClassName, tokens, asChild, style, children, ...props }: AvatarProps): react_jsx_runtime.JSX.Element;
-declare function AvatarImage({ className, ...props }: React$1.ComponentProps<typeof AvatarPrimitive.Image>): react_jsx_runtime.JSX.Element;
-declare function AvatarFallback({ className, ...props }: React$1.ComponentProps<typeof AvatarPrimitive.Fallback>): react_jsx_runtime.JSX.Element;
-
-type ListItemStatus = {
-    label: string;
-    variant?: 'default' | 'secondary' | 'destructive' | 'outline';
-};
-type ListItemProps = {
-    id: string;
-    /** Texto superior (ej: fecha) */
-    overline?: string;
-    /** Título principal */
-    title: string;
-    /** Subtítulo opcional */
-    subtitle?: string;
-    /** Valor alineado a la derecha */
-    amount?: string;
-    /** Estado opcional (badge) */
-    status?: ListItemStatus;
-    /** Click del item completo */
-    onItemClick?: (id: string) => void;
-    /** Clases extra */
-    className?: string;
-};
-declare function ListItem({ id, overline, title, subtitle, amount, status, onItemClick, className, }: ListItemProps): react_jsx_runtime.JSX.Element;
-
-declare function Table({ className, tokens, ...props }: React$1.ComponentProps<'table'> & {
-    tokens?: Partial<ThemeTokensBase>;
-}): react_jsx_runtime.JSX.Element;
-declare function TableHeader(props: React$1.ComponentProps<'thead'>): react_jsx_runtime.JSX.Element;
-declare function TableBody(props: React$1.ComponentProps<'tbody'>): react_jsx_runtime.JSX.Element;
-declare function TableRow(props: React$1.ComponentProps<'tr'>): react_jsx_runtime.JSX.Element;
-declare function TableHead(props: React$1.ComponentProps<'th'>): react_jsx_runtime.JSX.Element;
-declare function TableCell(props: React$1.ComponentProps<'td'>): react_jsx_runtime.JSX.Element;
-declare function TableCellDescription({ className, ...props }: React$1.ComponentProps<'p'>): react_jsx_runtime.JSX.Element;
-declare function TableFooter({ children, className, ...props }: React$1.ComponentProps<'tfoot'>): react_jsx_runtime.JSX.Element;
-declare function TableCaption(props: React$1.ComponentProps<'caption'>): react_jsx_runtime.JSX.Element;
-
-interface DropdownItemProps {
-    iconLeft?: React$1.ReactNode;
-    iconRight?: React$1.ReactNode;
-    selected?: boolean;
-    disabled?: boolean;
-    destructive?: boolean;
-}
-type ThemedProps = {
-    variant?: string;
-    tokens?: Partial<ThemeTokensBase>;
-};
-declare function DropdownMenu(props: React$1.ComponentProps<typeof DropdownMenuPrimitive.Root> & {
-    tokens?: Partial<ThemeTokensBase>;
-}): react_jsx_runtime.JSX.Element;
-declare function DropdownMenuPortal(props: React$1.ComponentProps<typeof DropdownMenuPrimitive.Portal>): react_jsx_runtime.JSX.Element;
-declare function DropdownMenuTrigger(props: React$1.ComponentProps<typeof DropdownMenuPrimitive.Trigger>): react_jsx_runtime.JSX.Element;
-declare function DropdownMenuContent({ className, sideOffset, ...props }: React$1.ComponentProps<typeof DropdownMenuPrimitive.Content> & ThemedProps): react_jsx_runtime.JSX.Element | null;
-declare function DropdownMenuGroup(props: React$1.ComponentProps<typeof DropdownMenuPrimitive.Group>): react_jsx_runtime.JSX.Element;
-declare function DropdownMenuItem({ className, iconLeft, iconRight, selected, destructive, ...props }: React$1.ComponentProps<typeof DropdownMenuPrimitive.Item> & DropdownItemProps): react_jsx_runtime.JSX.Element;
-declare function DropdownMenuCheckboxItem({ className, children, checked, ...props }: React$1.ComponentProps<typeof DropdownMenuPrimitive.CheckboxItem>): react_jsx_runtime.JSX.Element;
-declare function DropdownMenuRadioGroup(props: React$1.ComponentProps<typeof DropdownMenuPrimitive.RadioGroup>): react_jsx_runtime.JSX.Element;
-declare function DropdownMenuRadioItem({ className, children, ...props }: React$1.ComponentProps<typeof DropdownMenuPrimitive.RadioItem>): react_jsx_runtime.JSX.Element;
-declare function DropdownMenuLabel({ className, inset, ...props }: React$1.ComponentProps<typeof DropdownMenuPrimitive.Label> & {
-    inset?: boolean;
-}): react_jsx_runtime.JSX.Element;
-declare function DropdownMenuSeparator(props: React$1.ComponentProps<typeof DropdownMenuPrimitive.Separator>): react_jsx_runtime.JSX.Element;
-declare function DropdownMenuShortcut(props: React$1.ComponentProps<'span'>): react_jsx_runtime.JSX.Element;
-declare function DropdownMenuSub(props: React$1.ComponentProps<typeof DropdownMenuPrimitive.Sub>): react_jsx_runtime.JSX.Element;
-declare function DropdownMenuSubTrigger({ className, inset, children, ...props }: React$1.ComponentProps<typeof DropdownMenuPrimitive.SubTrigger> & {
-    inset?: boolean;
-}): react_jsx_runtime.JSX.Element;
-declare function DropdownMenuSubContent({ className, ...props }: React$1.ComponentProps<typeof DropdownMenuPrimitive.SubContent>): react_jsx_runtime.JSX.Element;
-
-declare function Popover({ ...props }: React$1.ComponentProps<typeof PopoverPrimitive.Root>): react_jsx_runtime.JSX.Element;
-declare function PopoverTrigger({ ...props }: React$1.ComponentProps<typeof PopoverPrimitive.Trigger>): react_jsx_runtime.JSX.Element;
-declare function PopoverContent({ className, align, sideOffset, tokens, style, ...props }: React$1.ComponentProps<typeof PopoverPrimitive.Content> & {
-    tokens?: Partial<ThemeTokensBase>;
-}): react_jsx_runtime.JSX.Element;
-declare function PopoverAnchor({ ...props }: React$1.ComponentProps<typeof PopoverPrimitive.Anchor>): react_jsx_runtime.JSX.Element;
-
-declare function TooltipProvider({ delayDuration, ...props }: React$1.ComponentProps<typeof TooltipPrimitive.Provider>): react_jsx_runtime.JSX.Element;
-declare function Tooltip({ tokens, ...props }: React$1.ComponentProps<typeof TooltipPrimitive.Root> & {
-    tokens?: Partial<ThemeTokensBase>;
-}): react_jsx_runtime.JSX.Element;
-declare function TooltipTrigger({ ...props }: React$1.ComponentProps<typeof TooltipPrimitive.Trigger>): react_jsx_runtime.JSX.Element;
-declare function TooltipContent({ className, sideOffset, tokens, children, ...props }: React$1.ComponentProps<typeof TooltipPrimitive.Content> & {
-    tokens?: Partial<ThemeTokensBase>;
-}): react_jsx_runtime.JSX.Element;
-
-declare const alertVariants: (props?: ({
-    size?: "inline" | "full-width" | "stacked" | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
-type AlertTone = 'success' | 'warning' | 'error' | 'info';
-interface AlertProps extends Omit<React$1.ComponentProps<'div'>, 'title'>, VariantProps<typeof alertVariants> {
-    tone?: AlertTone;
-    icon: React$1.ReactNode;
-    title: React$1.ReactNode;
-    description: React$1.ReactNode;
-    subtitle?: React$1.ReactNode;
-    ctaLabel?: React$1.ReactNode;
-    ctaHref?: string;
-    ctaTarget?: React$1.HTMLAttributeAnchorTarget;
-    onCtaClick?: () => void;
-    closeLabel?: string;
-    label?: React$1.ReactNode;
-    onClose?: () => void;
-    titleMaxLines?: number;
-    descriptionMaxLines?: number;
-    tokens?: Partial<ThemeTokensBase>;
-}
-declare function Alert({ className, style, size, tone, icon, title, description, subtitle, ctaLabel, ctaHref, ctaTarget, onCtaClick, closeLabel, label, onClose, titleMaxLines, descriptionMaxLines, tokens, ...props }: AlertProps): react_jsx_runtime.JSX.Element;
-
-type BadgeTone = 'neutral' | 'brand' | 'success' | 'info' | 'warning' | 'error';
-type BadgeSize = 'small' | 'medium' | 'large';
-type BadgeShape = 'rounded' | 'square';
-declare function Badge({ className, tone, size, shape, asChild, tokens, style, ...props }: React$1.ComponentProps<'span'> & {
-    children: React$1.ReactNode;
-    tone?: BadgeTone;
-    size?: BadgeSize;
-    shape?: BadgeShape;
-    asChild?: boolean;
-    tokens?: Partial<ThemeTokensBase>;
-}): react_jsx_runtime.JSX.Element;
-
-type EmptyStateProps = {
-    tokens?: Partial<ThemeTokensBase>;
-    icon?: React$1.ReactNode;
-    title: React$1.ReactNode;
-    description?: React$1.ReactNode;
-    actions?: React$1.ReactNode;
-    align?: 'center' | 'left';
-    size?: 'small' | 'medium';
-    className?: string;
-};
-declare function EmptyState({ icon, title, description, actions, align, className, size, tokens, }: EmptyStateProps): react_jsx_runtime.JSX.Element;
-
-type LoaderSize = 'small' | 'medium' | 'large' | 'extraLarge';
-type LoaderVariant = 'default' | 'primary';
-type LoaderProps = React$1.ComponentProps<'div'> & {
-    size?: LoaderSize;
-    variant?: LoaderVariant;
-    tokens?: Partial<ThemeTokensBase>;
-    label?: string;
-    description?: React$1.ReactNode;
-    spinnerClassName?: string;
-    spinnerProps?: Omit<React$1.ComponentProps<typeof Loader2Icon>, 'size'>;
-};
-declare function Loader({ className, style, size, variant, tokens, label, description, spinnerClassName, spinnerProps, ...props }: LoaderProps): react_jsx_runtime.JSX.Element;
-
-type ProgressProps = React$1.ComponentProps<typeof ProgressPrimitive.Root> & {
-    value: number;
-    label?: string;
-    showValue?: boolean;
-    description?: string;
-    icon?: React$1.ReactNode;
-    variant?: string;
-    tokens?: Partial<ThemeTokensBase>;
-};
-declare function Progress({ className, style, value, label, showValue, description, icon, variant, tokens, ...props }: ProgressProps): react_jsx_runtime.JSX.Element;
-
-type FileUploadState = 'default' | 'drag' | 'error' | 'disabled';
-type FileUploadProps = {
-    accept?: string[];
-    maxSizeMB?: number;
-    multiple?: boolean;
-    title?: string;
-    tokens?: Partial<ThemeTokensBase>;
-    description?: string;
-    buttonLabel?: string;
-    icon?: React$1.ReactNode;
-    state?: FileUploadState;
-    className?: string;
-    isDragging?: boolean;
-    onFilesChange?: (files: File[]) => void;
-    onError?: (errors: string[]) => void;
-    actions?: React$1.ReactNode;
-};
-declare function FileUpload({ accept, maxSizeMB, multiple, title, description, buttonLabel, icon, state, className, actions, tokens, onFilesChange, onError, }: FileUploadProps): react_jsx_runtime.JSX.Element;
-
-type Variant = 'primary' | 'secondary' | 'tertiary';
-type Orientation = 'horizontal' | 'vertical';
-type ImagePosition = 'left' | 'right' | 'top' | 'bottom';
-type ContentAlign = 'left' | 'center';
-type ImageDisplay = 'inline' | 'background';
-type HeroContentPosition = 'top' | 'center' | 'between' | 'bottom';
-declare const bannerVariants: (props?: ({
-    size?: "compact" | "full" | null | undefined;
-    orientation?: "horizontal" | "vertical" | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
-type BannerProps = React$1.ComponentProps<'div'> & VariantProps<typeof bannerVariants> & {
-    asChild?: boolean;
-    tokens?: Partial<ThemeTokensBase>;
-    variant?: Variant;
-    orientation?: Orientation;
-    imagePosition?: ImagePosition;
-    contentAlign?: ContentAlign;
-    imageDisplay?: ImageDisplay;
-    heroContentPosition?: HeroContentPosition;
-    heroMinHeight?: string;
-    heroOverlay?: string;
-    title: React$1.ReactNode;
-    description?: React$1.ReactNode;
-    cta?: React$1.ReactNode;
-    imageSrc: string;
-    imageAlt?: string;
-    icon?: React$1.ReactNode;
-    endSlot?: React$1.ReactNode;
-};
-declare function Banner({ className, asChild, tokens, variant, size, orientation, imagePosition, contentAlign, imageDisplay, heroContentPosition, heroMinHeight, heroOverlay, title, description, cta, imageSrc, imageAlt, icon, endSlot, ...props }: BannerProps): react_jsx_runtime.JSX.Element;
-
-type CardProps = React$1.HTMLAttributes<HTMLDivElement> & {
-    title?: React$1.ReactNode;
-    action?: React$1.ReactNode;
-    tokens?: Partial<ThemeTokensBase>;
-    variant?: 'primary' | 'secondary' | 'tertiary';
-    width?: number | string;
-};
-declare function Card({ className, title, action, tokens, variant, width, children, style, ...props }: CardProps): react_jsx_runtime.JSX.Element;
-
-type DragSliderProps = {
-    children: React$1.ReactNode;
-    className?: string;
-    tokens?: Partial<ThemeTokensBase>;
-};
-declare function DragSlider({ children, className, tokens: customTokens, }: DragSliderProps): react_jsx_runtime.JSX.Element;
-
-declare const integrationCardVariants: (props?: ({
-    variant?: "default" | "none" | "subtle" | null | undefined;
-    logoSize?: "small" | "large" | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
-
-type IntegrationCardProps = React$1.ComponentProps<'div'> & VariantProps<typeof integrationCardVariants> & {
-    asChild?: boolean;
-    tokens?: Partial<ThemeTokensBase>;
-    badgeText?: React$1.ReactNode;
-    logoSlot?: React$1.ReactNode;
-    logoSrc?: string;
-    logoAlt?: string;
-    initials?: React$1.ReactNode;
-    bannerClassName?: string;
-    title: React$1.ReactNode;
-    description?: React$1.ReactNode;
-    linkLabel?: React$1.ReactNode;
-    linkHref?: string;
-    onLinkClick?: () => void;
-    logoClassName?: string;
-    badgeClassName?: string;
-    contentClassName?: string;
-    linkClassName?: string;
-};
-declare function IntegrationCard({ className, variant, logoSize, asChild, tokens, badgeText, logoSlot, logoSrc, logoAlt, initials, bannerClassName, title, description, linkLabel, linkHref, onLinkClick, logoClassName, badgeClassName, contentClassName, linkClassName, style, ...props }: IntegrationCardProps): react_jsx_runtime.JSX.Element;
-
-interface ColorExampleProps {
-    className?: string;
-    colorToken: string;
-    colorName: string;
-}
-declare function ColorExample({ className, colorToken, colorName }: ColorExampleProps): react_jsx_runtime.JSX.Element;
-
-declare const accordionTriggerVariants: (props?: ({
-    size?: "sm" | "md" | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
-declare const accordionContentVariants: (props?: ({
-    size?: "sm" | "md" | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
-
-declare function Accordion({ size, tokens, ...props }: React$1.ComponentProps<typeof AccordionPrimitive.Root> & {
-    size?: 'sm' | 'md';
-    tokens?: Partial<ThemeTokensBase>;
-}): react_jsx_runtime.JSX.Element;
-declare function AccordionItem({ className, ...props }: React$1.ComponentProps<typeof AccordionPrimitive.Item>): react_jsx_runtime.JSX.Element;
-declare function AccordionTrigger({ className, children, ...props }: React$1.ComponentProps<typeof AccordionPrimitive.Trigger> & {
-    size?: 'sm' | 'md';
-}): react_jsx_runtime.JSX.Element;
-declare function AccordionContent({ className, children, ...props }: React$1.ComponentProps<typeof AccordionPrimitive.Content> & {
-    size?: 'sm' | 'md';
-}): react_jsx_runtime.JSX.Element;
+ * This module:
+ *  1. Maintains a global theme store (module-level singleton).
+ *  2. Provides a `withTheme` HOC that wraps any React component with
+ *     `ThemeContext.Provider` reading from the global store.
+ *  3. Exposes helpers to set the theme and notify all mounted elements.
+ */
 
-type ModuleBoxProps = React$1.HTMLAttributes<HTMLDivElement> & {
-    title?: React$1.ReactNode;
-    headerActions?: React$1.ReactNode;
-    footerActions?: React$1.ReactNode;
-    slotPlaceholder?: React$1.ReactNode;
-    tokens?: Partial<ThemeTokensBase>;
-    headerClassName?: string;
-    slotClassName?: string;
-    footerClassName?: string;
-};
-declare function ModuleBox({ className, title, headerActions, footerActions, slotPlaceholder, tokens, headerClassName, slotClassName, footerClassName, children, style, ...props }: ModuleBoxProps): react_jsx_runtime.JSX.Element;
+declare function getGlobalTheme(): ThemeTokensBase;
+declare function setGlobalTheme(theme: ThemeTokensBase): void;
+declare class NaveThemeProviderElement extends HTMLElement {
+    private _channelId;
+    private _theme;
+    static get observedAttributes(): string[];
+    set theme(value: ThemeTokensBase);
+    get theme(): ThemeTokensBase | null;
+    attributeChangedCallback(name: string, _old: string | null, value: string | null): void;
+    connectedCallback(): void;
+    private _loadTheme;
+}
 
-type ChartType = 'bar' | 'line' | 'donut' | 'pie';
-type ChartDatum = {
-    label: string;
-    value: number;
-    color?: string;
-    [key: string]: string | number | undefined;
-};
-type ChartsProps = React$1.HTMLAttributes<HTMLDivElement> & {
-    type?: ChartType;
-    data: ChartDatum[];
-    title?: React$1.ReactNode;
-    subtitle?: React$1.ReactNode;
-    showLegend?: boolean;
-    showGrid?: boolean;
-    showBaseline?: boolean;
-    showXAxis?: boolean;
-    showYAxis?: boolean;
-    showTooltip?: boolean;
-    height?: number;
-    donutCenterValue?: React$1.ReactNode;
-    donutCenterLabel?: React$1.ReactNode;
-    legendTitle?: React$1.ReactNode;
-    valueFormatter?: (value: number) => string;
-    xDataKey?: string;
-    yDataKey?: string;
-    nameKey?: string;
-    showLineArea?: boolean;
-    emptyStateLabel?: React$1.ReactNode;
+type ButtonProps = React.ComponentProps<'button'> & {
     tokens?: Partial<ThemeTokensBase>;
+    variant?: 'primary' | 'secondary' | 'tertiary' | 'neutral';
+    size?: 'small' | 'medium' | 'large' | 'icon' | 'icon-small' | 'icon-large';
+    asChild?: boolean;
+    textPaddingX?: string | number;
+    startIcon?: React.ReactNode;
+    endIcon?: React.ReactNode;
+    loading?: boolean;
+    loadingLabel?: React.ReactNode;
 };
-declare function Charts({ className, type, data, title, subtitle, showLegend, showGrid, showBaseline, showXAxis, showYAxis, showTooltip, height, donutCenterValue, donutCenterLabel, legendTitle, valueFormatter, xDataKey, yDataKey, nameKey, showLineArea, emptyStateLabel, tokens, style, ...props }: ChartsProps): react_jsx_runtime.JSX.Element;
-
-declare function Calendar({ className, classNames, showOutsideDays, captionLayout, tokens, formatters, components, ...props }: React$1.ComponentProps<typeof DayPicker> & {
-    tokens?: Partial<ThemeTokensBase>;
-}): react_jsx_runtime.JSX.Element;
+declare function Button({ className, variant, size, asChild, tokens, textPaddingX, startIcon, endIcon, loading, loadingLabel, style, children, ...props }: ButtonProps): react_jsx_runtime.JSX.Element;
 
 interface ComboboxItem {
     label: string;
@@ -1443,11 +77,11 @@ interface ComboboxProps {
     /** Placeholder for the search input inside the dropdown. @default "Buscar..." */
     searchPlaceholder?: string;
     /** Ref forwarded to the inner search `<input>`. Consumers can use it to manage focus. */
-    searchRef?: React$1.Ref<HTMLInputElement>;
+    searchRef?: React.Ref<HTMLInputElement>;
 }
 declare function Combobox({ value, onValueChange, placeholder, items, label, size, error, disabled, tokens, className, open: openProp, onOpenChange, closeOnSelect, searchPlaceholder, searchRef, }: ComboboxProps): react_jsx_runtime.JSX.Element;
 
-interface DatePickerInputProps extends Omit<React$1.ComponentProps<'input'>, 'size' | 'type'> {
+interface DatePickerInputProps extends Omit<React.ComponentProps<'input'>, 'size' | 'type'> {
     tokens?: Partial<ThemeTokensBase>;
     size?: 'small' | 'medium';
     label?: string;
@@ -1456,7 +90,7 @@ interface DatePickerInputProps extends Omit<React$1.ComponentProps<'input'>, 'si
 }
 declare function DatePickerInput({ className, size, label, helperText, error, disabled, tokens, style, ...props }: DatePickerInputProps): react_jsx_runtime.JSX.Element;
 
-interface InputProps extends Omit<React$1.ComponentProps<'input'>, 'size'> {
+interface InputProps extends Omit<React.ComponentProps<'input'>, 'size'> {
     tokens?: Partial<ThemeTokensBase>;
     size?: 'small' | 'medium';
     label?: string;
@@ -1465,12 +99,12 @@ interface InputProps extends Omit<React$1.ComponentProps<'input'>, 'size'> {
 }
 declare function Input({ className, type, size, label, helperText, error, disabled, tokens, style, ...props }: InputProps): react_jsx_runtime.JSX.Element;
 
-interface LabelProps extends React$1.ComponentProps<typeof LabelPrimitive.Root> {
+interface LabelProps extends React.ComponentProps<typeof LabelPrimitive.Root> {
     tokens?: Partial<ThemeTokensBase>;
 }
 declare function Label({ className, tokens, style, ...props }: LabelProps): react_jsx_runtime.JSX.Element;
 
-interface PasswordInputProps extends Omit<React$1.ComponentProps<'input'>, 'size' | 'type'> {
+interface PasswordInputProps extends Omit<React.ComponentProps<'input'>, 'size' | 'type'> {
     tokens?: Partial<ThemeTokensBase>;
     size?: 'small' | 'medium';
     label?: string;
@@ -1479,7 +113,7 @@ interface PasswordInputProps extends Omit<React$1.ComponentProps<'input'>, 'size
 }
 declare function PasswordInput({ className, size, label, helperText, error, disabled, tokens, style, ...props }: PasswordInputProps): react_jsx_runtime.JSX.Element;
 
-interface SearchBarProps extends Omit<React$1.ComponentProps<'input'>, 'size' | 'type'> {
+interface SearchBarProps extends Omit<React.ComponentProps<'input'>, 'size' | 'type'> {
     tokens?: Partial<ThemeTokensBase>;
     size?: 'small' | 'medium';
     label?: string;
@@ -1514,11 +148,11 @@ interface SelectProps {
     /** Placeholder for the search input (only when searchable is true). @default "Buscar..." */
     searchPlaceholder?: string;
     /** Ref forwarded to the search input. Consumers can use it to manage focus. */
-    searchRef?: React$1.Ref<HTMLInputElement>;
+    searchRef?: React.Ref<HTMLInputElement>;
 }
 declare function Select({ value, onValueChange, placeholder, items, label, size, error, disabled, tokens, className, open: openProp, onOpenChange, closeOnSelect, searchable, searchPlaceholder, searchRef, }: SelectProps): react_jsx_runtime.JSX.Element;
 
-interface TextareaProps extends Omit<React$1.ComponentProps<'textarea'>, 'size'> {
+interface TextareaProps extends Omit<React.ComponentProps<'textarea'>, 'size'> {
     tokens?: Partial<ThemeTokensBase>;
     size?: 'small' | 'medium';
     label?: string;
@@ -1527,7 +161,7 @@ interface TextareaProps extends Omit<React$1.ComponentProps<'textarea'>, 'size'>
 }
 declare function Textarea({ className, style, tokens, size, label, helperText, error, disabled, ...props }: TextareaProps): react_jsx_runtime.JSX.Element;
 
-interface CheckboxProps extends React$1.ComponentProps<typeof CheckboxPrimitive.Root> {
+interface CheckboxProps extends React.ComponentProps<typeof CheckboxPrimitive.Root> {
     tokens?: Partial<ThemeTokensBase>;
     size?: 'regular' | 'small' | 'extraSmall';
     tone?: 'brand' | 'neutral' | 'destructive';
@@ -1537,19 +171,7 @@ interface CheckboxProps extends React$1.ComponentProps<typeof CheckboxPrimitive.
 }
 declare function Checkbox({ className, tokens, size, tone, label, description, disabled, style, ...props }: CheckboxProps): react_jsx_runtime.JSX.Element;
 
-interface RadioGroupProps extends React$1.ComponentProps<typeof RadioGroupPrimitive.Root> {
-}
-interface RadioItemProps extends React$1.ComponentProps<typeof RadioGroupPrimitive.Item> {
-    size?: 'regular' | 'small' | 'extraSmall';
-    label?: string;
-    description?: string;
-    disabled?: boolean;
-    tokens?: Partial<ThemeTokensBase>;
-}
-declare function RadioGroup({ className, ...props }: RadioGroupProps): react_jsx_runtime.JSX.Element;
-declare function RadioItem({ className, size, label, description, disabled, tokens, value, ...props }: RadioItemProps): react_jsx_runtime.JSX.Element;
-
-interface SwitchProps extends React$1.ComponentProps<typeof SwitchPrimitive.Root> {
+interface SwitchProps extends React.ComponentProps<typeof SwitchPrimitive.Root> {
     tokens?: Partial<ThemeTokensBase>;
     size?: 'regular' | 'small' | 'extraSmall';
     label?: string;
@@ -1558,143 +180,232 @@ interface SwitchProps extends React$1.ComponentProps<typeof SwitchPrimitive.Root
 }
 declare const Switch: ({ className, tokens, size, label, description, disabled, style, ...props }: SwitchProps) => react_jsx_runtime.JSX.Element;
 
-type BreadcrumbSize = 'small' | 'medium';
-interface BreadcrumbProps extends React$1.ComponentProps<'nav'> {
+declare const alertVariants: (props?: ({
+    size?: "inline" | "full-width" | "stacked" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type AlertTone = 'success' | 'warning' | 'error' | 'info';
+interface AlertProps extends Omit<React.ComponentProps<'div'>, 'title'>, VariantProps<typeof alertVariants> {
+    tone?: AlertTone;
+    icon: React.ReactNode;
+    title: React.ReactNode;
+    description: React.ReactNode;
+    subtitle?: React.ReactNode;
+    ctaLabel?: React.ReactNode;
+    ctaHref?: string;
+    ctaTarget?: React.HTMLAttributeAnchorTarget;
+    onCtaClick?: () => void;
+    closeLabel?: string;
+    label?: React.ReactNode;
+    onClose?: () => void;
+    titleMaxLines?: number;
+    descriptionMaxLines?: number;
     tokens?: Partial<ThemeTokensBase>;
-    size?: BreadcrumbSize;
 }
-declare function Breadcrumb({ className, tokens, style, size, children, ...props }: BreadcrumbProps): react_jsx_runtime.JSX.Element;
-declare function BreadcrumbList({ className, ...props }: React$1.ComponentProps<'ol'>): react_jsx_runtime.JSX.Element;
-declare function BreadcrumbItem({ className, ...props }: React$1.ComponentProps<'li'>): react_jsx_runtime.JSX.Element;
-declare function BreadcrumbLink({ asChild, className, ...props }: React$1.ComponentProps<'a'> & {
+declare function Alert({ className, style, size, tone, icon, title, description, subtitle, ctaLabel, ctaHref, ctaTarget, onCtaClick, closeLabel, label, onClose, titleMaxLines, descriptionMaxLines, tokens, ...props }: AlertProps): react_jsx_runtime.JSX.Element;
+
+type BadgeTone = 'neutral' | 'brand' | 'success' | 'info' | 'warning' | 'error';
+type BadgeSize = 'small' | 'medium' | 'large';
+type BadgeShape = 'rounded' | 'square';
+declare function Badge({ className, tone, size, shape, asChild, tokens, style, ...props }: React.ComponentProps<'span'> & {
+    children: React.ReactNode;
+    tone?: BadgeTone;
+    size?: BadgeSize;
+    shape?: BadgeShape;
     asChild?: boolean;
+    tokens?: Partial<ThemeTokensBase>;
 }): react_jsx_runtime.JSX.Element;
-declare function BreadcrumbPage({ className, ...props }: React$1.ComponentProps<'span'>): react_jsx_runtime.JSX.Element;
-declare function BreadcrumbSeparator({ children, className, ...props }: React$1.ComponentProps<'li'>): react_jsx_runtime.JSX.Element;
-declare function BreadcrumbEllipsis({ className, ...props }: React$1.ComponentProps<'span'>): react_jsx_runtime.JSX.Element;
 
-type DrawerSlotTokens = {
-    overlay?: Partial<ThemeTokensBase>;
-    container?: Partial<ThemeTokensBase>;
-    close?: Partial<ThemeTokensBase>;
-    title?: Partial<ThemeTokensBase>;
-    description?: Partial<ThemeTokensBase>;
-};
-type DrawerProps = React$1.ComponentProps<typeof Drawer$1.Root> & {
-    tokens?: Partial<DrawerSlotTokens>;
+type EmptyStateProps = {
+    tokens?: Partial<ThemeTokensBase>;
+    icon?: React.ReactNode;
+    title: React.ReactNode;
+    description?: React.ReactNode;
+    actions?: React.ReactNode;
+    align?: 'center' | 'left';
+    size?: 'small' | 'medium';
+    className?: string;
 };
-declare function Drawer({ tokens, ...props }: DrawerProps): react_jsx_runtime.JSX.Element;
-declare const DrawerTrigger: React$1.ForwardRefExoticComponent<_radix_ui_react_dialog.DialogTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
-declare const DrawerPortal: typeof vaul.Portal;
-declare const DrawerClose: React$1.ForwardRefExoticComponent<_radix_ui_react_dialog.DialogCloseProps & React$1.RefAttributes<HTMLButtonElement>>;
-declare function DrawerOverlay({ className, ...props }: React$1.ComponentProps<typeof Drawer$1.Overlay>): react_jsx_runtime.JSX.Element | null;
-declare function DrawerContent({ className, children, ...props }: React$1.ComponentProps<typeof Drawer$1.Content>): react_jsx_runtime.JSX.Element | null;
-declare const DrawerHeader: ({ className, ...props }: React$1.ComponentProps<"div">) => react_jsx_runtime.JSX.Element;
-declare const DrawerBody: ({ className, ...props }: React$1.ComponentProps<"div">) => react_jsx_runtime.JSX.Element;
-declare const DrawerFooter: ({ className, ...props }: React$1.ComponentProps<"div">) => react_jsx_runtime.JSX.Element;
-declare function DrawerCloseButton({ className, ...props }: React$1.ComponentProps<typeof Drawer$1.Close>): react_jsx_runtime.JSX.Element;
-declare function DrawerTitle({ className, ...props }: React$1.ComponentProps<typeof Drawer$1.Title>): react_jsx_runtime.JSX.Element | null;
-declare function DrawerDescription({ className, ...props }: React$1.ComponentProps<typeof Drawer$1.Description>): react_jsx_runtime.JSX.Element | null;
+declare function EmptyState({ icon, title, description, actions, align, className, size, tokens, }: EmptyStateProps): react_jsx_runtime.JSX.Element;
 
-type HeaderSize = 'desktop' | 'mobile';
-type HeaderProps = {
-    title: React$1.ReactNode;
-    description?: React$1.ReactNode;
-    action?: React$1.ReactNode;
-    size?: HeaderSize;
+type FileUploadState = 'default' | 'drag' | 'error' | 'disabled';
+type FileUploadProps = {
+    accept?: string[];
+    maxSizeMB?: number;
+    multiple?: boolean;
+    title?: string;
+    tokens?: Partial<ThemeTokensBase>;
+    description?: string;
+    buttonLabel?: string;
+    icon?: React.ReactNode;
+    state?: FileUploadState;
     className?: string;
-    titleClassName?: string;
-    descriptionClassName?: string;
-    descriptionMaxLines?: number;
+    isDragging?: boolean;
+    onFilesChange?: (files: File[]) => void;
+    onError?: (errors: string[]) => void;
+    actions?: React.ReactNode;
+};
+declare function FileUpload({ accept, maxSizeMB, multiple, title, description, buttonLabel, icon, state, className, actions, tokens, onFilesChange, onError, }: FileUploadProps): react_jsx_runtime.JSX.Element;
+
+type LoaderSize = 'small' | 'medium' | 'large' | 'extraLarge';
+type LoaderVariant = 'default' | 'primary';
+type LoaderProps = React.ComponentProps<'div'> & {
+    size?: LoaderSize;
+    variant?: LoaderVariant;
     tokens?: Partial<ThemeTokensBase>;
+    label?: string;
+    description?: React.ReactNode;
+    spinnerClassName?: string;
+    spinnerProps?: Omit<React.ComponentProps<typeof Loader2Icon>, 'size'>;
 };
-declare function Header({ title, description, action, size, className, titleClassName, descriptionClassName, descriptionMaxLines, tokens, }: HeaderProps): react_jsx_runtime.JSX.Element;
+declare function Loader({ className, style, size, variant, tokens, label, description, spinnerClassName, spinnerProps, ...props }: LoaderProps): react_jsx_runtime.JSX.Element;
 
-type AlertDialogAlignment = 'left' | 'center';
-interface AlertDialogProps extends React$1.ComponentProps<typeof AlertDialogPrimitive.Root> {
+type ProgressProps = React.ComponentProps<typeof ProgressPrimitive.Root> & {
+    value: number;
+    label?: string;
+    showValue?: boolean;
+    description?: string;
+    icon?: React.ReactNode;
+    variant?: string;
     tokens?: Partial<ThemeTokensBase>;
-    alignment?: AlertDialogAlignment;
-    size?: 'regular';
-}
-declare function AlertDialog({ tokens, alignment, size, ...props }: AlertDialogProps): react_jsx_runtime.JSX.Element;
-declare const AlertDialogTrigger: React$1.ForwardRefExoticComponent<AlertDialogPrimitive.AlertDialogTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
-declare const AlertDialogPortal: React$1.FC<AlertDialogPrimitive.AlertDialogPortalProps>;
-declare function AlertDialogOverlay(props: React$1.ComponentProps<typeof AlertDialogPrimitive.Overlay>): react_jsx_runtime.JSX.Element;
-declare function AlertDialogContent({ className, alignment, ...props }: React$1.ComponentProps<typeof AlertDialogPrimitive.Content> & {
-    alignment?: AlertDialogAlignment;
-}): react_jsx_runtime.JSX.Element;
-declare function AlertDialogHeader({ className, ...props }: React$1.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
-declare function AlertDialogFooter({ className, ...props }: React$1.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
-declare function AlertDialogTitle(props: React$1.ComponentProps<typeof AlertDialogPrimitive.Title>): react_jsx_runtime.JSX.Element;
-declare function AlertDialogDescription(props: React$1.ComponentProps<typeof AlertDialogPrimitive.Description>): react_jsx_runtime.JSX.Element;
-declare function AlertDialogAction({ className, children, ...props }: React$1.ComponentProps<typeof AlertDialogPrimitive.Action>): react_jsx_runtime.JSX.Element;
-declare function AlertDialogCancel({ className, children, ...props }: React$1.ComponentProps<typeof AlertDialogPrimitive.Cancel>): react_jsx_runtime.JSX.Element;
+};
+declare function Progress({ className, style, value, label, showValue, description, icon, variant, tokens, ...props }: ProgressProps): react_jsx_runtime.JSX.Element;
 
-type Merchant = {
-    id: string;
-    name: string;
+type Variant = 'primary' | 'secondary' | 'tertiary';
+type Orientation = 'horizontal' | 'vertical';
+type ImagePosition = 'left' | 'right' | 'top' | 'bottom';
+type ContentAlign = 'left' | 'center';
+type ImageDisplay = 'inline' | 'background';
+type HeroContentPosition = 'top' | 'center' | 'between' | 'bottom';
+declare const bannerVariants: (props?: ({
+    size?: "compact" | "full" | null | undefined;
+    orientation?: "horizontal" | "vertical" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type BannerProps = React.ComponentProps<'div'> & VariantProps<typeof bannerVariants> & {
+    asChild?: boolean;
+    tokens?: Partial<ThemeTokensBase>;
+    variant?: Variant;
+    orientation?: Orientation;
+    imagePosition?: ImagePosition;
+    contentAlign?: ContentAlign;
+    imageDisplay?: ImageDisplay;
+    heroContentPosition?: HeroContentPosition;
+    heroMinHeight?: string;
+    heroOverlay?: string;
+    title: React.ReactNode;
+    description?: React.ReactNode;
+    cta?: React.ReactNode;
+    imageSrc: string;
+    imageAlt?: string;
+    icon?: React.ReactNode;
+    endSlot?: React.ReactNode;
 };
-type NavbarUser = {
-    name: string;
-    role?: string;
-    avatarUrl?: string;
-    menu: {
-        id: string;
-        label: string;
-        onClick: () => void;
-    }[];
+declare function Banner({ className, asChild, tokens, variant, size, orientation, imagePosition, contentAlign, imageDisplay, heroContentPosition, heroMinHeight, heroOverlay, title, description, cta, imageSrc, imageAlt, icon, endSlot, ...props }: BannerProps): react_jsx_runtime.JSX.Element;
+
+type CardProps = React.HTMLAttributes<HTMLDivElement> & {
+    title?: React.ReactNode;
+    action?: React.ReactNode;
+    tokens?: Partial<ThemeTokensBase>;
+    variant?: 'primary' | 'secondary' | 'tertiary';
+    width?: number | string;
 };
-type NavbarProps = {
-    children: React$1.ReactNode;
-    open?: boolean;
-    expandedContent?: React$1.ReactNode;
+declare function Card({ className, title, action, tokens, variant, width, children, style, ...props }: CardProps): react_jsx_runtime.JSX.Element;
+
+interface ColorExampleProps {
     className?: string;
+    colorToken: string;
+    colorName: string;
+}
+declare function ColorExample({ className, colorToken, colorName }: ColorExampleProps): react_jsx_runtime.JSX.Element;
+
+declare const integrationCardVariants: (props?: ({
+    variant?: "default" | "none" | "subtle" | null | undefined;
+    logoSize?: "small" | "large" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+
+type IntegrationCardProps = React.ComponentProps<'div'> & VariantProps<typeof integrationCardVariants> & {
+    asChild?: boolean;
+    tokens?: Partial<ThemeTokensBase>;
+    badgeText?: React.ReactNode;
+    logoSlot?: React.ReactNode;
+    logoSrc?: string;
+    logoAlt?: string;
+    initials?: React.ReactNode;
+    bannerClassName?: string;
+    title: React.ReactNode;
+    description?: React.ReactNode;
+    linkLabel?: React.ReactNode;
+    linkHref?: string;
+    onLinkClick?: () => void;
+    logoClassName?: string;
+    badgeClassName?: string;
+    contentClassName?: string;
+    linkClassName?: string;
 };
-type NavbarComponent = React$1.FC<NavbarProps> & {
-    Start: React$1.FC<{
-        children: React$1.ReactNode;
-    }>;
-    End: React$1.FC<{
-        children: React$1.ReactNode;
-    }>;
-    Slot: React$1.FC<{
-        children: React$1.ReactNode;
-    }>;
-    Logo: typeof NavbarLogo;
-    Merchant: typeof NavbarMerchant;
-    User: typeof NavbarUserMenu;
+declare function IntegrationCard({ className, variant, logoSize, asChild, tokens, badgeText, logoSlot, logoSrc, logoAlt, initials, bannerClassName, title, description, linkLabel, linkHref, onLinkClick, logoClassName, badgeClassName, contentClassName, linkClassName, style, ...props }: IntegrationCardProps): react_jsx_runtime.JSX.Element;
+
+type AvatarSize = 'sm' | 'md' | 'lg';
+type AvatarProps = React.ComponentProps<typeof AvatarPrimitive.Root> & {
+    size?: AvatarSize;
+    src?: string;
+    alt?: string;
+    fallback?: React.ReactNode;
+    name?: string;
+    imageClassName?: string;
+    fallbackClassName?: string;
+    tokens?: Partial<ThemeTokensBase>;
+    asChild?: boolean;
 };
-declare const Navbar: NavbarComponent;
-declare function NavbarLogo({ children }: {
-    children?: React$1.ReactNode;
-}): react_jsx_runtime.JSX.Element;
-declare function NavbarMerchant({ merchants, currentId, onChange, }: {
-    merchants?: Merchant[];
-    currentId?: string;
-    onChange?: (id: string) => void;
-}): react_jsx_runtime.JSX.Element | null;
-declare function NavbarUserMenu({ user }: {
-    user: NavbarUser;
+declare function Avatar({ className, size, src, alt, fallback, name, imageClassName, fallbackClassName, tokens, asChild, style, children, ...props }: AvatarProps): react_jsx_runtime.JSX.Element;
+declare function AvatarImage({ className, ...props }: React.ComponentProps<typeof AvatarPrimitive.Image>): react_jsx_runtime.JSX.Element;
+declare function AvatarFallback({ className, ...props }: React.ComponentProps<typeof AvatarPrimitive.Fallback>): react_jsx_runtime.JSX.Element;
+
+type ListItemStatus = {
+    label: string;
+    variant?: 'default' | 'secondary' | 'destructive' | 'outline';
+};
+type ListItemProps = {
+    id: string;
+    /** Texto superior (ej: fecha) */
+    overline?: string;
+    /** Título principal */
+    title: string;
+    /** Subtítulo opcional */
+    subtitle?: string;
+    /** Valor alineado a la derecha */
+    amount?: string;
+    /** Estado opcional (badge) */
+    status?: ListItemStatus;
+    /** Click del item completo */
+    onItemClick?: (id: string) => void;
+    /** Clases extra */
+    className?: string;
+};
+declare function ListItem({ id, overline, title, subtitle, amount, status, onItemClick, className, }: ListItemProps): react_jsx_runtime.JSX.Element;
+
+declare function LoaderInit({ size, className, }: {
+    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+    color?: string;
+    className?: string;
 }): react_jsx_runtime.JSX.Element;
 
-declare function Pagination({ className, tokens: customTokens, style, ...props }: React$1.ComponentProps<'nav'> & {
+type HeaderSize = 'desktop' | 'mobile';
+type HeaderProps = {
+    title: React.ReactNode;
+    description?: React.ReactNode;
+    action?: React.ReactNode;
+    size?: HeaderSize;
+    className?: string;
+    titleClassName?: string;
+    descriptionClassName?: string;
+    descriptionMaxLines?: number;
     tokens?: Partial<ThemeTokensBase>;
-}): react_jsx_runtime.JSX.Element;
-type PaginationLinkProps = {
-    isActive?: boolean;
-    disabled?: boolean;
-} & React$1.ComponentProps<'a'>;
-declare function PaginationLink({ className, isActive, disabled, ...props }: PaginationLinkProps): react_jsx_runtime.JSX.Element;
-declare function PaginationContent({ className, ...props }: React$1.ComponentProps<'ul'>): react_jsx_runtime.JSX.Element;
-declare function PaginationItem(props: React$1.ComponentProps<'li'>): react_jsx_runtime.JSX.Element;
-declare function PaginationPrevious({ className, ...props }: React$1.ComponentProps<typeof PaginationLink>): react_jsx_runtime.JSX.Element;
-declare function PaginationNext({ className, ...props }: React$1.ComponentProps<typeof PaginationLink>): react_jsx_runtime.JSX.Element;
-declare function PaginationEllipsis({ className, ...props }: React$1.ComponentProps<'span'>): react_jsx_runtime.JSX.Element;
+};
+declare function Header({ title, description, action, size, className, titleClassName, descriptionClassName, descriptionMaxLines, tokens, }: HeaderProps): react_jsx_runtime.JSX.Element;
 
 type SidebarItem = {
     id: string;
     label: string;
-    icon: React$1.ReactNode;
+    icon: React.ReactNode;
     active?: boolean;
     href?: string;
 };
@@ -1715,26 +426,15 @@ type SidebarProps = {
 };
 declare function Sidebar({ title, sections, items, collapsed, onToggleCollapse, onItemClick, className, tokens, }: SidebarProps): react_jsx_runtime.JSX.Element;
 
-declare function Tabs({ className, size, tokens, ...props }: React$1.ComponentProps<typeof TabsPrimitive.Root> & {
-    size: TabsSize;
-    tokens?: Partial<ThemeTokensBase>;
-}): react_jsx_runtime.JSX.Element;
-type TabsSize = 'medium' | 'small';
-declare function TabsList({ className, ...props }: React$1.ComponentProps<typeof TabsPrimitive.List> & {
-    size?: TabsSize;
-}): react_jsx_runtime.JSX.Element;
-declare function TabsTrigger({ className, ...props }: React$1.ComponentProps<typeof TabsPrimitive.Trigger>): react_jsx_runtime.JSX.Element;
-declare function TabsContent({ className, ...props }: React$1.ComponentProps<typeof TabsPrimitive.Content>): react_jsx_runtime.JSX.Element;
-
-type TourProps = React$1.HTMLAttributes<HTMLDivElement> & {
+type TourProps = React.HTMLAttributes<HTMLDivElement> & {
     currentStep: number;
     totalSteps: number;
-    title: React$1.ReactNode;
-    description: React$1.ReactNode;
+    title: React.ReactNode;
+    description: React.ReactNode;
     onBack: () => void;
     onNext: () => void;
-    backLabel?: React$1.ReactNode;
-    nextLabel?: React$1.ReactNode;
+    backLabel?: React.ReactNode;
+    nextLabel?: React.ReactNode;
     disableBack?: boolean;
     disableNext?: boolean;
     showPointer?: boolean;
@@ -1742,160 +442,210 @@ type TourProps = React$1.HTMLAttributes<HTMLDivElement> & {
 };
 declare function Tour({ className, currentStep, totalSteps, title, description, onBack, onNext, backLabel, nextLabel, disableBack, disableNext, showPointer, tokens, style, ...props }: TourProps): react_jsx_runtime.JSX.Element;
 
-type IconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
-type IconVariant = 'default' | 'primary' | 'muted' | 'danger' | 'success';
-type IconProps = React$1.HTMLAttributes<HTMLSpanElement> & {
-    children?: React$1.ReactNode;
-    size?: IconSize;
-    color?: IconVariant;
-    tokens?: Partial<ThemeTokensBase>;
-    asChild?: boolean;
-};
-declare function Icon({ className, size, color, tokens: customTokens, asChild, style, children, ...props }: IconProps): react_jsx_runtime.JSX.Element;
-
-type IconLabelProps = {
-    icon: React$1.ReactNode;
-    label: React$1.ReactNode;
-    iconPosition?: 'left' | 'right';
-    className?: string;
-};
-declare function IconLabel({ icon, label, iconPosition, className, }: IconLabelProps): react_jsx_runtime.JSX.Element;
-
-declare function LoaderInit({ size, className, }: {
-    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
-    color?: string;
-    className?: string;
-}): react_jsx_runtime.JSX.Element;
-
-type SeparatorProps = React$1.ComponentProps<typeof SeparatorPrimitive.Root> & {
+type SeparatorProps = React.ComponentProps<typeof SeparatorPrimitive.Root> & {
     tokens?: Partial<ThemeTokensBase>;
 };
 declare function Separator({ className, orientation, decorative, tokens, ...props }: SeparatorProps): react_jsx_runtime.JSX.Element;
 
-declare function ThemeProvider({ channelId, theme, children, }: {
-    channelId?: string;
-    theme?: any;
-    children: React.ReactNode;
-}): react_jsx_runtime.JSX.Element;
-
-declare function cn(...inputs: ClassValue[]): string;
-
-declare enum COMPONENT_NAMES {
-    ACCORDION = "accordion",
-    BADGE = "badge",
-    BUTTON = "button",
-    CHECKBOX = "checkbox",
-    DRAWER = "drawer",
-    EMPTY_STATE = "emptyState",
-    INPUT = "input",
-    LABEL = "label",
-    MODAL_DIALOG = "alertDialog",
-    NAVBAR = "navbar",
-    POPOVER = "popover",
-    RADIO = "radio",
-    SEPARATOR = "separator",
-    SIDEBAR = "sidebar",
-    SWITCH = "switch",
-    TABS = "tabs",
-    TOUR = "tour",
-    TABLE = "table",
-    AVATAR = "avatar",
-    CARD = "card",
-    BANNER = "banner",
-    PROMO_BANNER = "promoBanner",
-    PROGRESS = "progress",
-    LOADER = "loader",
-    FILE_UPLOAD = "fileUpload",
-    DROPDOWN = "dropdown",
-    TOOLTIP = "tooltip",
-    DRAG_SLIDER = "dragSlider",
-    MODULE_BOX = "moduleBox",
-    CHARTS = "charts",
-    PAGINATION = "pagination",
-    HEADER = "header",
-    BREADCRUMB = "breadcrumb",
-    ICON = "icon",
-    SELECT = "select",
-    ALERT = "alert",
-    CALENDAR = "calendar"
-}
-
-/**
- * `CSSProperties` extended with arbitrary CSS custom properties (`--*`).
- * Use this instead of `as React.CSSProperties` when passing objects that
- * include `--my-var` keys.
- */
-type CSSPropertiesWithVars = CSSProperties & Record<`--${string}`, string | number>;
-/**
- * A single CSS variable mapping entry.
- *
- * - `tokenPath` — dot-separated path into the resolved tokens object
- *   (e.g. `'hover.background'`, `'title.fontSize'`)
- * - `fallback`  — hardcoded default used when the token is not found
- */
-type TokenVarEntry = {
-    tokenPath: string;
-    fallback?: string | number;
-};
-/**
- * Declarative mapping from CSS custom-property names to token paths.
- *
- * Example:
- * ```ts
- * const map = {
- *   '--card-bg':     { tokenPath: 'backgroundColor', fallback: '#ffffff' },
- *   '--card-radius': { tokenPath: 'borderRadius',    fallback: '16px' },
- * };
- * ```
- */
-type TokenStyleMap = Record<string, TokenVarEntry>;
-/**
- * Map an **already-resolved** token object to CSS custom properties.
- *
- * ### Usage
- * ```tsx
- * const theme = useTheme();
- * const mergedTokens = resolveTokens<CardTokens>({ componentName: 'card', variant, tokens }, theme);
- * const styles = mapTokenStyles(mergedTokens, CARD_TOKEN_MAP);
- * ```
- *
- * @param resolvedTokens — the raw result of `resolveTokens(…)`
- * @param map            — declarative CSS-var → token-path mapping
- * @param extra          — optional extra styles (supports CSS custom properties)
- */
-declare function mapTokenStyles(resolvedTokens: Record<string, unknown>, map: TokenStyleMap, extra?: CSSPropertiesWithVars | CSSProperties): CSSPropertiesWithVars;
-
-/**
- * Shared token map for all input-family components
- * (Input, SearchBar, Select, Textarea, PasswordInput, DatePicker, Combobox).
- *
- * Eliminates ~40 lines of boilerplate per component.
- */
-declare const INPUT_TOKEN_MAP: TokenStyleMap;
-/**
- * Build extra size-specific styles from the resolved size tokens.
- * Used with `mapTokenStyles(..., extra)`.
- */
-declare function inputSizeExtras(sizeTokens: Record<string, any>): Record<string, unknown>;
-
-/**
- * Hook para resolver tokens y mapear estilos en un solo paso.
- * Elimina el boilerplate repetido de useTheme + resolveTokens + mapTokenStyles.
- *
- * @param componentName Nombre del componente (ej: 'button')
- * @param tokenMap Mapeo declarativo de CSS vars
- * @param options Opciones: variant, size, tone, tokens, extra
- */
-declare function useTokenStyles<T extends ResolvedTokenMap = ResolvedTokenMap>(componentName: string, tokenMap: TokenStyleMap, options?: {
-    variant?: string;
-    size?: string;
-    tone?: string;
-    tokens?: Partial<ThemeTokensBase>;
-    shape?: string;
-    extra?: CSSPropertiesWithVars | React.CSSProperties;
-}): {
-    styles: CSSPropertiesWithVars;
-    tokens: T;
-};
-
-export { AIProvider, type AIProviderProps, type AIRequest, type AIRequestFn, type AIResponse, type AITask, Accordion, AccordionContent, AccordionItem, type AccordionTokens, AccordionTrigger, Alert, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, type AlertProps, type AlertTokens, Avatar, AvatarFallback, AvatarImage, type AvatarSize, type AvatarTokens, Badge, type BadgeShape, type BadgeSize, type BadgeTokens, type BadgeTone, Banner, type BannerProps, type BannerTokens, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, type BreadcrumbSize, type BreadcrumbTokens, Button, type ButtonProps, type ButtonTokens, COMPONENT_NAMES, type CSSPropertiesWithVars, Calendar, type CalendarTokens, Card, type CardProps, type CardTokens, type ChartDatum, type ChartType, Charts, type ChartsProps, type ChartsTokens, Checkbox, type CheckboxTokens, type ColorBundle, type ColorBundleWithShadow, ColorExample, Combobox, DatePickerInput, DragSlider, type DragSliderProps, type DragSliderTokens, Drawer, DrawerBody, DrawerClose, DrawerCloseButton, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, type DrawerSlotTokens, DrawerTitle, type DrawerTokens, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, type DropdownTokens, EmptyState, type EmptyStateProps, type EmptyStateTokens, FileUpload, type FileUploadProps, type FileUploadState, type FileUploadTokens, type FontSizeTokens, Header, type HeaderProps, type HeaderSize, type HeaderTokens, INPUT_TOKEN_MAP, Icon, IconLabel, type IconLabelProps, type IconProps, type IconSize, type IconTokens, type IconVariant, Input, type InputSizeDimensions, type InputTokens, IntegrationCard, type IntegrationCardProps, type IntegrationCardTokens, Label, type LabelTokens, type LabeledFontTokens, ListItem, type ListItemProps, type ListItemStatus, Loader, LoaderInit, type LoaderProps, type LoaderSize, type LoaderTokens, type LoaderVariant, type Merchant, type ModalDialogTokens, ModuleBox, type ModuleBoxProps, type ModuleBoxTokens, Navbar, NavbarLogo, NavbarMerchant, type NavbarTokens, type NavbarUser, NavbarUserMenu, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, type PaginationTokens, PasswordInput, Popover, PopoverAnchor, PopoverContent, type PopoverTokens, PopoverTrigger, Progress, type ProgressTokens, type PromoBannerTokens, RadioGroup, RadioItem, type RadioTokens, type ResolvedTokenMap, SearchBar, Select, type SelectTokens, Separator, type SeparatorTokens, Sidebar, type SidebarItem, type SidebarProps, type SidebarSection, type SidebarTokens, Switch, type SwitchTokens, Table, TableBody, TableCaption, TableCell, TableCellDescription, TableFooter, TableHead, TableHeader, TableRow, type TableTokens, Tabs, TabsContent, TabsList, type TabsSize, type TabsTokens, TabsTrigger, Textarea, ThemeProvider, type ThemeTokensBase, type TokenStyleMap, Tooltip, TooltipContent, TooltipProvider, type TooltipTokens, TooltipTrigger, Tour, type TourProps, type TourTokens, type TypographyTokens, accordionContentVariants, accordionTriggerVariants, bannerVariants, buttonBaseClasses, cn, inputSizeExtras, mapTokenStyles, resolveTokens, tokenAt, useAI, useTheme, useTokenStyles };
+declare global {
+    interface NaveButtonAttributes {
+        variant?: 'primary' | 'secondary' | 'tertiary' | 'neutral';
+        size?: 'small' | 'medium' | 'large' | 'icon' | 'icon-small' | 'icon-large';
+        disabled?: boolean;
+        loading?: boolean;
+        'loading-label'?: string;
+    }
+    interface NaveInputAttributes {
+        type?: string;
+        placeholder?: string;
+        value?: string;
+        disabled?: boolean;
+        label?: string;
+        error?: string;
+        hint?: string;
+        size?: 'small' | 'medium' | 'large';
+    }
+    interface NaveTextareaAttributes {
+        placeholder?: string;
+        value?: string;
+        disabled?: boolean;
+        label?: string;
+        error?: string;
+        hint?: string;
+        rows?: number;
+    }
+    interface NaveLabelAttributes {
+        htmlFor?: string;
+    }
+    interface NaveSearchBarAttributes {
+        placeholder?: string;
+        value?: string;
+        disabled?: boolean;
+    }
+    interface NavePasswordInputAttributes {
+        placeholder?: string;
+        value?: string;
+        disabled?: boolean;
+        label?: string;
+        error?: string;
+        hint?: string;
+    }
+    interface NaveSelectAttributes {
+        placeholder?: string;
+        value?: string;
+        disabled?: boolean;
+        label?: string;
+        error?: string;
+    }
+    interface NaveComboboxAttributes {
+        placeholder?: string;
+        value?: string;
+        disabled?: boolean;
+        label?: string;
+    }
+    interface NaveDatePickerAttributes {
+        placeholder?: string;
+        value?: string;
+        disabled?: boolean;
+        label?: string;
+    }
+    interface NaveCheckboxAttributes {
+        checked?: boolean;
+        disabled?: boolean;
+        label?: string;
+        value?: string;
+        indeterminate?: boolean;
+    }
+    interface NaveSwitchAttributes {
+        checked?: boolean;
+        disabled?: boolean;
+        label?: string;
+    }
+    interface NaveAlertAttributes {
+        variant?: 'info' | 'success' | 'warning' | 'error';
+        title?: string;
+        description?: string;
+        dismissible?: boolean;
+    }
+    interface NaveBadgeAttributes {
+        variant?: 'default' | 'secondary' | 'outline' | 'destructive';
+        size?: 'small' | 'medium' | 'large';
+    }
+    interface NaveLoaderAttributes {
+        size?: 'small' | 'medium' | 'large';
+        description?: string;
+    }
+    interface NaveProgressAttributes {
+        value?: number;
+        max?: number;
+    }
+    interface NaveEmptyStateAttributes {
+        title?: string;
+        description?: string;
+    }
+    interface NaveFileUploadAttributes {
+        name?: string;
+        size?: string;
+        status?: string;
+    }
+    interface NaveBannerAttributes {
+        variant?: 'info' | 'success' | 'warning' | 'error';
+        title?: string;
+        description?: string;
+        dismissible?: boolean;
+    }
+    interface NaveCardAttributes {
+        title?: string;
+        variant?: string;
+    }
+    interface NaveIntegrationCardAttributes {
+        title?: string;
+        description?: string;
+        'badge-text'?: string;
+        'link-label'?: string;
+        href?: string;
+    }
+    interface NaveColorExampleAttributes {
+        color?: string;
+        name?: string;
+        value?: string;
+    }
+    interface NaveListItemAttributes {
+        title?: string;
+        description?: string;
+        href?: string;
+    }
+    interface NaveAvatarAttributes {
+        size?: 'small' | 'medium' | 'large';
+    }
+    interface NaveHeaderAttributes {
+        title?: string;
+        description?: string;
+    }
+    interface NaveTourAttributes {
+        title?: string;
+        description?: string;
+        step?: number;
+        'total-steps'?: number;
+        'back-label'?: string;
+        'next-label'?: string;
+        open?: boolean;
+    }
+    interface NaveSidebarAttributes {
+        collapsed?: boolean;
+    }
+    interface NaveSeparatorAttributes {
+        orientation?: 'horizontal' | 'vertical';
+        decorative?: boolean;
+    }
+    interface NaveLoaderInitAttributes {
+        size?: 'small' | 'medium' | 'large';
+    }
+    interface NaveAvatarFallbackAttributes {
+    }
+    interface NaveAvatarImageAttributes {
+        src?: string;
+        alt?: string;
+    }
+    interface HTMLElementTagNameMap {
+        'nave-button': HTMLElement & NaveButtonAttributes;
+        'nave-input': HTMLElement & NaveInputAttributes;
+        'nave-textarea': HTMLElement & NaveTextareaAttributes;
+        'nave-label': HTMLElement & NaveLabelAttributes;
+        'nave-search-bar': HTMLElement & NaveSearchBarAttributes;
+        'nave-password-input': HTMLElement & NavePasswordInputAttributes;
+        'nave-select': HTMLElement & NaveSelectAttributes;
+        'nave-combobox': HTMLElement & NaveComboboxAttributes;
+        'nave-date-picker': HTMLElement & NaveDatePickerAttributes;
+        'nave-checkbox': HTMLElement & NaveCheckboxAttributes;
+        'nave-switch': HTMLElement & NaveSwitchAttributes;
+        'nave-alert': HTMLElement & NaveAlertAttributes;
+        'nave-badge': HTMLElement & NaveBadgeAttributes;
+        'nave-loader': HTMLElement & NaveLoaderAttributes;
+        'nave-progress': HTMLElement & NaveProgressAttributes;
+        'nave-empty-state': HTMLElement & NaveEmptyStateAttributes;
+        'nave-file-upload': HTMLElement & NaveFileUploadAttributes;
+        'nave-banner': HTMLElement & NaveBannerAttributes;
+        'nave-card': HTMLElement & NaveCardAttributes;
+        'nave-integration-card': HTMLElement & NaveIntegrationCardAttributes;
+        'nave-color-example': HTMLElement & NaveColorExampleAttributes;
+        'nave-list-item': HTMLElement & NaveListItemAttributes;
+        'nave-avatar': HTMLElement & NaveAvatarAttributes;
+        'nave-avatar-fallback': HTMLElement & NaveAvatarFallbackAttributes;
+        'nave-avatar-image': HTMLElement & NaveAvatarImageAttributes;
+        'nave-loader-init': HTMLElement & NaveLoaderInitAttributes;
+        'nave-header': HTMLElement & NaveHeaderAttributes;
+        'nave-tour': HTMLElement & NaveTourAttributes;
+        'nave-sidebar': HTMLElement & NaveSidebarAttributes;
+        'nave-separator': HTMLElement & NaveSeparatorAttributes;
+        'nave-theme-provider': NaveThemeProviderElement;
+    }
+    interface NaveThemeProviderElement extends HTMLElement {
+        /** Set the channel ID to auto-fetch the theme from CDN */
+        'channel-id'?: string;
+        /** Set a theme object directly via JS property */
+        theme: ThemeTokensBase | null;
+    }
+}
+
+export { Alert, Avatar, AvatarFallback, AvatarImage, Badge, Banner, Button, Card, Checkbox, ColorExample, Combobox, DatePickerInput, EmptyState, FileUpload, Header, Input, IntegrationCard, Label, ListItem, Loader, LoaderInit, NaveThemeProviderElement, PasswordInput, Progress, SearchBar, Select, Separator, Sidebar, Switch, Textarea, Tour, getGlobalTheme, setGlobalTheme };