@bsginstitute/bsg-integra 0.0.3 → 0.0.5

package/index.d.ts

@@ -1,5 +1,5 @@
 import * as _angular_core from '@angular/core';
-import { OnInit, ElementRef, AfterContentInit, ChangeDetectorRef, AfterViewInit, OnDestroy } from '@angular/core';
+import { OnInit, ElementRef, AfterContentInit, ChangeDetectorRef, AfterViewInit, OnDestroy, TemplateRef, EventEmitter } from '@angular/core';
 import { VariantProps } from 'class-variance-authority';
 import * as class_variance_authority_types from 'class-variance-authority/types';
 import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
@@ -313,92 +313,53 @@ type BadgeVariantsProps = VariantProps<typeof badgeVariants>;
 declare const badgeIconVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
 type BadgeIconVariantsProps = VariantProps<typeof badgeIconVariants>;
 
-/**
- * Button variants
- *
- * Controls the button styles including size, variant, shape, and state
- */
 declare const buttonVariants: (props?: ({
     size?: "sm" | "md" | "lg" | null | undefined;
     variant?: "default" | "destructive" | "secondary" | "outline" | "ghost" | "link" | null | undefined;
     shape?: "rectangular" | "pill" | "icon" | "icon-text" | "icon-only" | null | undefined;
     disabled?: boolean | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
-/**
- * Button icon variants
- *
- * Controls the icon styling within buttons
- */
 declare const buttonIconVariants: (props?: ({
     position?: "left" | "right" | "center" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
-/**
- * Button label variants
- *
- * Controls the label text styling
- */
 declare const buttonLabelVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
-/**
- * Button icon-only wrapper variants
- *
- * Controls the icon wrapper for icon-only buttons
- */
 declare const buttonIconOnlyVariants: (props?: ({
     size?: "sm" | "md" | "lg" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
+/** ✅ nuevo: spinner overlay centrado */
+declare const buttonSpinnerVariants: (props?: ({
+    shape?: "rectangular" | "pill" | "icon" | "icon-text" | "icon-only" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
 
 type ButtonSize = 'sm' | 'md' | 'lg';
 type ButtonVariant = 'default' | 'secondary' | 'outline' | 'ghost' | 'link' | 'destructive';
 type ButtonShape = 'rectangular' | 'pill' | 'icon' | 'icon-text' | 'icon-only';
-type IconName = 'check' | 'chevron-left' | 'chevron-right' | 'chevron-up' | 'chevron-down' | 'none';
 type ButtonVariantsProps = VariantProps<typeof buttonVariants>;
-/**
- * Button Component - Interactive button with multiple variants
- *
- * Following shadcn/ui pattern:
- * ```html
- * <bsg-button
- *   [variant]="'default'"
- *   [size]="'md'"
- *   [shape]="'rectangular'"
- *   [label]="'Click me'"
- *   (Click)="onClick()"
- * />
- * ```
- */
 declare class ButtonComponent {
-    private sanitizer;
-    constructor(sanitizer: DomSanitizer);
-    /** Size of the button */
     readonly size: _angular_core.InputSignal<ButtonSize>;
-    /** Visual variant of the button */
     readonly variant: _angular_core.InputSignal<ButtonVariant>;
-    /** Shape of the button */
     readonly shape: _angular_core.InputSignal<ButtonShape>;
-    /** Button label text */
     readonly label: _angular_core.InputSignal<string>;
-    /** Show icon */
-    readonly icon: _angular_core.InputSignal<boolean>;
-    /** Icon position (left or right) */
-    readonly iconPosition: _angular_core.InputSignal<"left" | "right">;
-    /** Icon name for icon-only buttons */
-    readonly iconName: _angular_core.InputSignal<IconName>;
-    /** Disabled state */
     readonly disabled: _angular_core.InputSignal<boolean>;
-    /** Additional CSS classes */
+    /** ✅ nuevo: muestra spinner y bloquea click */
+    readonly spinner: _angular_core.InputSignal<boolean>;
+    /** Accesibilidad para icon buttons */
+    readonly ariaLabel: _angular_core.InputSignal<string | null>;
     readonly className: _angular_core.InputSignal<string | undefined>;
-    /** Click event emitter */
     readonly Click: _angular_core.OutputEmitterRef<Event>;
     readonly isDisabled: _angular_core.Signal<boolean>;
+    readonly isIconButton: _angular_core.Signal<boolean>;
+    readonly buttonSquarePx: _angular_core.Signal<27 | 43 | 35>;
+    readonly iconFontPx: _angular_core.Signal<15 | 22 | 18>;
+    readonly spinnerPx: _angular_core.Signal<14 | 20 | 16>;
     readonly buttonClasses: _angular_core.Signal<string>;
-    iconClasses(position: 'left' | 'right' | 'center'): string;
     readonly labelClasses: _angular_core.Signal<string>;
     readonly iconOnlyClasses: _angular_core.Signal<string>;
-    readonly iconColor: _angular_core.Signal<"#2563EB" | "#7C3AED" | "#1E293B" | "white">;
-    getIconSvg(iconName: string): SafeHtml;
+    readonly spinnerClasses: _angular_core.Signal<string>;
+    iconClasses(position: 'left' | 'right' | 'center'): string;
     handleClick(event: Event): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<ButtonComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ButtonComponent, "bsg-button", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "shape": { "alias": "shape"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "iconPosition": { "alias": "iconPosition"; "required": false; "isSignal": true; }; "iconName": { "alias": "iconName"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; }, { "Click": "Click"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ButtonComponent, "bsg-button", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "shape": { "alias": "shape"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "spinner": { "alias": "spinner"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; }, { "Click": "Click"; }, never, ["*", "[left-icon]", "[right-icon]"], true, never>;
 }
 
 /**
@@ -1135,7 +1096,7 @@ declare class RadioComponent {
     readonly focusRingClasses: _angular_core.Signal<string>;
     readonly outerClasses: _angular_core.Signal<string>;
     readonly innerClasses: _angular_core.Signal<string>;
-    readonly outerSize: _angular_core.Signal<16 | 20>;
+    readonly outerSize: _angular_core.Signal<20 | 16>;
     readonly innerSize: _angular_core.Signal<14 | 10>;
     readonly focusRingSize: _angular_core.Signal<26 | 22>;
     readonly outerCircleClasses: _angular_core.Signal<"stroke-muted-foreground fill-muted-foreground" | "stroke-primary/70 fill-none" | "stroke-primary fill-none" | "stroke-muted-foreground fill-none">;
@@ -1475,7 +1436,7 @@ declare const sidebarProviderVariants: (props?: class_variance_authority_types.C
  * Sidebar container variants (following shadcn pattern)
  */
 declare const sidebarVariants: (props?: ({
-    collapsible?: "icon" | "none" | "offcanvas" | null | undefined;
+    collapsible?: "icon" | "offcanvas" | "none" | null | undefined;
     side?: "left" | "right" | null | undefined;
     variant?: "sidebar" | "floating" | "inset" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
@@ -2151,6 +2112,56 @@ declare class SkeletonComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkeletonComponent, "bsg-skeleton", never, { "type": { "alias": "type"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
+/**
+ * Spinner variants
+ *
+ * Controls the spinner appearance including size and color variants.
+ * Based on shadcn/ui spinner pattern.
+ */
+declare const spinnerVariants: (props?: ({
+    size?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
+    variant?: "default" | "info" | "success" | "warning" | "destructive" | "secondary" | "brand" | "primary" | "muted" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+
+type SpinnerSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+type SpinnerVariant = 'default' | 'primary' | 'secondary' | 'muted' | 'destructive' | 'success' | 'warning' | 'info' | 'brand';
+type SpinnerVariantsProps = VariantProps<typeof spinnerVariants>;
+/**
+ * Spinner Component
+ *
+ * A loading indicator that shows a spinning animation.
+ * Based on shadcn/ui spinner pattern using an SVG loader icon.
+ *
+ * @example
+ * ```html
+ * <!-- Basic usage -->
+ * <bsg-spinner />
+ *
+ * <!-- With size -->
+ * <bsg-spinner size="lg" />
+ *
+ * <!-- With variant (color) -->
+ * <bsg-spinner variant="destructive" />
+ *
+ * <!-- Custom aria-label -->
+ * <bsg-spinner ariaLabel="Processing request..." />
+ * ```
+ */
+declare class SpinnerComponent {
+    /** Spinner size */
+    readonly size: _angular_core.InputSignal<SpinnerSize>;
+    /** Spinner color variant */
+    readonly variant: _angular_core.InputSignal<SpinnerVariant>;
+    /** Accessibility label for screen readers */
+    readonly ariaLabel: _angular_core.InputSignal<string>;
+    /** Additional CSS classes */
+    readonly className: _angular_core.InputSignal<string | undefined>;
+    /** Computed spinner classes */
+    readonly spinnerClasses: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SpinnerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SpinnerComponent, "bsg-spinner", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
 /**
  * Switch root variants
  *
@@ -2208,9 +2219,761 @@ declare class SwitchComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<SwitchComponent, "bsg-switch", never, { "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; "checkedChange": "checkedChange"; }, never, never, true, never>;
 }
 
+/**
+ * Tabs Root Component
+ *
+ * The root container for a set of tabs. Manages the active tab state.
+ *
+ * Usage:
+ * ```html
+ * <bsg-tabs [defaultValue]="0" (valueChange)="onTabChange($event)">
+ *   <bsg-tabs-list>
+ *     <bsg-tabs-trigger [value]="0">Tab 1</bsg-tabs-trigger>
+ *     <bsg-tabs-trigger [value]="1">Tab 2</bsg-tabs-trigger>
+ *   </bsg-tabs-list>
+ *   <bsg-tabs-content [value]="0">Content 1</bsg-tabs-content>
+ *   <bsg-tabs-content [value]="1">Content 2</bsg-tabs-content>
+ * </bsg-tabs>
+ * ```
+ */
+declare class TabsComponent {
+    /** Default active tab value */
+    readonly defaultValue: _angular_core.InputSignal<string | number>;
+    /** Additional CSS classes */
+    readonly className: _angular_core.InputSignal<string | undefined>;
+    /** Controlled value (if you want to control the tab from outside) */
+    readonly value: _angular_core.InputSignal<string | number | null>;
+    /** Event emitted when tab changes */
+    readonly valueChange: _angular_core.OutputEmitterRef<string | number>;
+    private readonly _internalValue;
+    readonly activeValue: _angular_core.Signal<string | number>;
+    readonly computedClasses: _angular_core.Signal<string>;
+    /**
+     * Set the active tab value
+     */
+    setValue(value: number | string): void;
+    /**
+     * Get the current active tab value
+     */
+    getValue(): number | string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TabsComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TabsComponent, "bsg-tabs", never, { "defaultValue": { "alias": "defaultValue"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; }, never, ["*"], true, never>;
+}
+
+type TabSize = 'sm' | 'md' | 'lg';
+type TabVariant = 'text' | 'icon-text';
+type TabLayout = 'default' | 'carousel';
+type TabColor = 'default' | 'info' | 'success' | 'warning' | 'destructive';
+/**
+ * Tab Navigation container variants
+ *
+ * Controls the overall tab navigation container layout
+ */
+declare const tabNavigationVariants: (props?: ({
+    layout?: "default" | "carousel" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+/**
+ * Tab Item variants
+ *
+ * Controls the individual tab button styles with size, variant, and color combinations
+ */
+declare const tabItemVariants: (props?: ({
+    variant?: "text" | "icon-text" | null | undefined;
+    size?: "sm" | "md" | "lg" | null | undefined;
+    color?: "default" | "info" | "success" | "warning" | "destructive" | null | undefined;
+    disabled?: boolean | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+/**
+ * Tab Icon Circle variants
+ *
+ * Controls the circular icon container in icon-text variant
+ */
+declare const tabIconCircleVariants: (props?: ({
+    color?: "default" | "info" | "success" | "warning" | "destructive" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+/**
+ * Tab Icon Content variants
+ *
+ * Controls the icon + label container layout
+ */
+declare const tabIconContentVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * Tab Label variants
+ *
+ * Controls the label text in icon-text variant
+ */
+declare const tabLabelVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * Tab Text Content variants
+ *
+ * Controls the text content in text variant
+ */
+declare const tabTextContentVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+
+/**
+ * Tabs List Component
+ *
+ * Container for tab triggers. This is where you place your bsg-tabs-trigger components.
+ *
+ * Usage:
+ * ```html
+ * <bsg-tabs-list>
+ *   <bsg-tabs-trigger [value]="0">Tab 1</bsg-tabs-trigger>
+ *   <bsg-tabs-trigger [value]="1">Tab 2</bsg-tabs-trigger>
+ * </bsg-tabs-list>
+ * ```
+ *
+ * Carousel layout with navigation buttons:
+ * ```html
+ * <bsg-tabs-list layout="carousel">
+ *   <bsg-tabs-trigger [value]="0">Tab 1</bsg-tabs-trigger>
+ *   <bsg-tabs-trigger [value]="1">Tab 2</bsg-tabs-trigger>
+ *   <!-- Many more tabs... -->
+ * </bsg-tabs-list>
+ * ```
+ */
+declare class TabsListComponent implements AfterViewInit, OnDestroy {
+    /** Layout mode: default (wraps) or carousel (scrolls horizontally) */
+    readonly layout: _angular_core.InputSignal<TabLayout>;
+    /** Additional CSS classes */
+    readonly className: _angular_core.InputSignal<string | undefined>;
+    readonly scrollContainer: _angular_core.Signal<ElementRef<HTMLDivElement> | undefined>;
+    readonly canScrollLeft: _angular_core.WritableSignal<boolean>;
+    readonly canScrollRight: _angular_core.WritableSignal<boolean>;
+    private resizeObserver;
+    constructor();
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    private setupResizeObserver;
+    readonly isCarousel: _angular_core.Signal<boolean>;
+    readonly containerClasses: _angular_core.Signal<string>;
+    readonly computedClasses: _angular_core.Signal<string>;
+    scrollLeft(): void;
+    scrollRight(): void;
+    onScroll(): void;
+    private updateScrollButtons;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TabsListComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TabsListComponent, "bsg-tabs-list", never, { "layout": { "alias": "layout"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+type TabsTriggerVariantsProps = VariantProps<typeof tabItemVariants>;
+/**
+ * Tabs Trigger Component
+ *
+ * A clickable tab that activates its associated content panel.
+ *
+ * Usage for text variant:
+ * ```html
+ * <bsg-tabs-trigger [value]="0">
+ *   Tab Label
+ * </bsg-tabs-trigger>
+ * ```
+ *
+ * Usage for icon-text variant:
+ * ```html
+ * <bsg-tabs-trigger [value]="0" variant="icon-text">
+ *   <svg slot="icon">...</svg>
+ *   <span slot="label">Tab Label</span>
+ * </bsg-tabs-trigger>
+ * ```
+ */
+declare class TabsTriggerComponent {
+    private readonly tabs;
+    /** The value that identifies this tab */
+    readonly value: _angular_core.InputSignal<string | number>;
+    /** Tab visual variant */
+    readonly variant: _angular_core.InputSignal<TabVariant>;
+    /** Tab size variant */
+    readonly size: _angular_core.InputSignal<TabSize>;
+    /** Tab color scheme */
+    readonly color: _angular_core.InputSignal<TabColor>;
+    /** Whether the tab is disabled */
+    readonly disabled: _angular_core.InputSignal<boolean>;
+    /** Additional CSS classes */
+    readonly className: _angular_core.InputSignal<string | undefined>;
+    readonly isActive: _angular_core.Signal<boolean>;
+    readonly computedClasses: _angular_core.Signal<string>;
+    readonly iconContentClasses: _angular_core.Signal<string>;
+    readonly iconCircleClasses: _angular_core.Signal<string>;
+    readonly labelClasses: _angular_core.Signal<string>;
+    readonly textContentClasses: _angular_core.Signal<string>;
+    handleClick(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TabsTriggerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TabsTriggerComponent, "bsg-tabs-trigger", never, { "value": { "alias": "value"; "required": true; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; }, {}, never, ["[slot='icon']", "[slot='label']", "*"], true, never>;
+}
+
+/**
+ * Tabs Content Component
+ *
+ * A container for tab panel content. Only displays when its value matches the active tab.
+ *
+ * Usage:
+ * ```html
+ * <bsg-tabs-content [value]="0">
+ *   <p>Content for tab 0</p>
+ * </bsg-tabs-content>
+ * ```
+ */
+declare class TabsContentComponent {
+    private readonly tabs;
+    /** The value that identifies which tab this content belongs to */
+    readonly value: _angular_core.InputSignal<string | number>;
+    /** Additional CSS classes */
+    readonly className: _angular_core.InputSignal<string | undefined>;
+    readonly isActive: _angular_core.Signal<boolean>;
+    readonly computedClasses: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TabsContentComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TabsContentComponent, "bsg-tabs-content", never, { "value": { "alias": "value"; "required": true; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+/**
+ * Directive to mark content that should be projected into a specific tab panel
+ *
+ * Usage:
+ * ```html
+ * <bsg-tab-navigation [tabs]="tabs">
+ *   <ng-template bsgTabContent>Content for tab 0</ng-template>
+ *   <ng-template bsgTabContent>Content for tab 1</ng-template>
+ * </bsg-tab-navigation>
+ * ```
+ */
+declare class TabContentDirective {
+    template: TemplateRef<unknown>;
+    constructor(template: TemplateRef<unknown>);
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TabContentDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<TabContentDirective, "[bsgTabContent]", never, {}, {}, never, never, true, never>;
+}
+interface TabItem {
+    label: string;
+    count?: number;
+    icon?: boolean;
+}
+type TabItemVariantsProps = VariantProps<typeof tabItemVariants>;
+/**
+ * Tab Navigation Component
+ *
+ * A tabbed navigation component with support for text and icon-text variants.
+ * Follows the shadcn/ui tabs pattern with separated TabsList and TabsContent.
+ *
+ * Usage:
+ * ```html
+ * <bsg-tab-navigation
+ *   [tabs]="tabs"
+ *   [variant]="'text'"
+ *   [size]="'md'"
+ *   [color]="'default'"
+ *   [activeIndex]="0"
+ *   (tabChange)="onTabChange($event)"
+ * >
+ *   <ng-template bsgTabContent>Content for first tab</ng-template>
+ *   <ng-template bsgTabContent>Content for second tab</ng-template>
+ * </bsg-tab-navigation>
+ * ```
+ */
+declare class TabNavigationComponent {
+    /** Tab size variant */
+    readonly size: _angular_core.InputSignal<TabSize>;
+    /** Tab visual variant */
+    readonly variant: _angular_core.InputSignal<TabVariant>;
+    /** Tab color scheme */
+    readonly color: _angular_core.InputSignal<TabColor>;
+    /** Whether all tabs are disabled */
+    readonly disabled: _angular_core.InputSignal<boolean>;
+    /** List of tab items */
+    readonly tabs: _angular_core.InputSignal<TabItem[]>;
+    /** Active tab index */
+    readonly activeIndex: _angular_core.InputSignal<number>;
+    /** Additional CSS classes for container */
+    readonly className: _angular_core.InputSignal<string | undefined>;
+    /** Tab change event */
+    readonly tabChange: _angular_core.OutputEmitterRef<number>;
+    /** Content children (tab content templates) */
+    readonly tabContents: _angular_core.Signal<readonly TabContentDirective[]>;
+    private readonly _activeIndex;
+    readonly internalActiveIndex: _angular_core.Signal<number>;
+    readonly containerClasses: _angular_core.Signal<string>;
+    readonly tabsListClasses: _angular_core.Signal<string>;
+    readonly tabContentClasses: _angular_core.Signal<string>;
+    readonly iconContentClasses: _angular_core.Signal<string>;
+    readonly labelClasses: _angular_core.Signal<string>;
+    readonly textContentClasses: _angular_core.Signal<string>;
+    getTabClasses(index: number): string;
+    getIconCircleClasses(): string;
+    getIconStroke(_index: number): string;
+    handleTabClick(index: number): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TabNavigationComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TabNavigationComponent, "bsg-tab-navigation", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "tabs": { "alias": "tabs"; "required": false; "isSignal": true; }; "activeIndex": { "alias": "activeIndex"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; }, { "tabChange": "tabChange"; }, ["tabContents"], never, true, never>;
+}
+
+/**
+ * Table Component
+ *
+ * A responsive table wrapper with semantic HTML table element.
+ * Follows shadcn/ui table structure.
+ *
+ * Usage:
+ * ```html
+ * <bsg-table>
+ *   <bsg-table-caption>A list of your recent invoices.</bsg-table-caption>
+ *   <bsg-table-header>
+ *     <bsg-table-row>
+ *       <bsg-table-head>Invoice</bsg-table-head>
+ *       <bsg-table-head>Status</bsg-table-head>
+ *     </bsg-table-row>
+ *   </bsg-table-header>
+ *   <bsg-table-body>
+ *     <bsg-table-row>
+ *       <bsg-table-cell>INV001</bsg-table-cell>
+ *       <bsg-table-cell>Paid</bsg-table-cell>
+ *     </bsg-table-row>
+ *   </bsg-table-body>
+ * </bsg-table>
+ * ```
+ */
+declare class TableComponent {
+    /** Additional CSS classes for wrapper */
+    readonly wrapperClassName: _angular_core.InputSignal<string | undefined>;
+    /** Additional CSS classes for table */
+    readonly className: _angular_core.InputSignal<string | undefined>;
+    readonly wrapperClasses: _angular_core.Signal<string>;
+    readonly tableClasses: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TableComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TableComponent, "bsg-table", never, { "wrapperClassName": { "alias": "wrapperClassName"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+/**
+ * Table Header Component
+ *
+ * Wraps table header rows (thead element).
+ *
+ * Usage:
+ * ```html
+ * <bsg-table-header>
+ *   <bsg-table-row>
+ *     <bsg-table-head>Column 1</bsg-table-head>
+ *     <bsg-table-head>Column 2</bsg-table-head>
+ *   </bsg-table-row>
+ * </bsg-table-header>
+ * ```
+ */
+declare class TableHeaderComponent {
+    /** Additional CSS classes */
+    readonly className: _angular_core.InputSignal<string | undefined>;
+    readonly computedClasses: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TableHeaderComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TableHeaderComponent, "bsg-table-header", never, { "className": { "alias": "className"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+/**
+ * Table Body Component
+ *
+ * Wraps table body rows (tbody element).
+ *
+ * Usage:
+ * ```html
+ * <bsg-table-body>
+ *   <bsg-table-row>
+ *     <bsg-table-cell>Cell 1</bsg-table-cell>
+ *     <bsg-table-cell>Cell 2</bsg-table-cell>
+ *   </bsg-table-row>
+ * </bsg-table-body>
+ * ```
+ */
+declare class TableBodyComponent {
+    /** Additional CSS classes */
+    readonly className: _angular_core.InputSignal<string | undefined>;
+    readonly computedClasses: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TableBodyComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TableBodyComponent, "bsg-table-body", never, { "className": { "alias": "className"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+/**
+ * Table Footer Component
+ *
+ * Wraps table footer rows (tfoot element).
+ *
+ * Usage:
+ * ```html
+ * <bsg-table-footer>
+ *   <bsg-table-row>
+ *     <bsg-table-cell colSpan="3">Total</bsg-table-cell>
+ *     <bsg-table-cell>$2,500.00</bsg-table-cell>
+ *   </bsg-table-row>
+ * </bsg-table-footer>
+ * ```
+ */
+declare class TableFooterComponent {
+    /** Additional CSS classes */
+    readonly className: _angular_core.InputSignal<string | undefined>;
+    readonly computedClasses: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TableFooterComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TableFooterComponent, "bsg-table-footer", never, { "className": { "alias": "className"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+/**
+ * Table Row Component
+ *
+ * A table row element (tr).
+ *
+ * Usage:
+ * ```html
+ * <bsg-table-row>
+ *   <bsg-table-cell>Cell 1</bsg-table-cell>
+ *   <bsg-table-cell>Cell 2</bsg-table-cell>
+ * </bsg-table-row>
+ * ```
+ */
+declare class TableRowComponent {
+    /** Additional CSS classes */
+    readonly className: _angular_core.InputSignal<string | undefined>;
+    /** Whether the row is selected */
+    readonly selected: _angular_core.InputSignal<boolean>;
+    readonly computedClasses: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TableRowComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TableRowComponent, "bsg-table-row", never, { "className": { "alias": "className"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+/**
+ * Table Head Component
+ *
+ * A table header cell element (th).
+ *
+ * Usage:
+ * ```html
+ * <bsg-table-head>Column Name</bsg-table-head>
+ * <bsg-table-head className="w-[100px]">ID</bsg-table-head>
+ * <bsg-table-head className="text-right">Amount</bsg-table-head>
+ * ```
+ */
+declare class TableHeadComponent {
+    /** Additional CSS classes */
+    readonly className: _angular_core.InputSignal<string | undefined>;
+    /** Column span */
+    readonly colSpan: _angular_core.InputSignal<number | undefined>;
+    /** Scope attribute for accessibility */
+    readonly scope: _angular_core.InputSignal<"col" | "colgroup" | "row" | "rowgroup">;
+    readonly computedClasses: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TableHeadComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TableHeadComponent, "bsg-table-head", never, { "className": { "alias": "className"; "required": false; "isSignal": true; }; "colSpan": { "alias": "colSpan"; "required": false; "isSignal": true; }; "scope": { "alias": "scope"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+/**
+ * Table Cell Component
+ *
+ * A table data cell element (td).
+ *
+ * Usage:
+ * ```html
+ * <bsg-table-cell>Cell content</bsg-table-cell>
+ * <bsg-table-cell className="font-medium">Bold content</bsg-table-cell>
+ * <bsg-table-cell className="text-right">$250.00</bsg-table-cell>
+ * <bsg-table-cell [colSpan]="3">Spanning cell</bsg-table-cell>
+ * ```
+ */
+declare class TableCellComponent {
+    /** Additional CSS classes */
+    readonly className: _angular_core.InputSignal<string | undefined>;
+    /** Column span */
+    readonly colSpan: _angular_core.InputSignal<number | undefined>;
+    readonly computedClasses: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TableCellComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TableCellComponent, "bsg-table-cell", never, { "className": { "alias": "className"; "required": false; "isSignal": true; }; "colSpan": { "alias": "colSpan"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+/**
+ * Table Card Component
+ *
+ * A wrapper that provides a polished card container for tables,
+ * using content projection for header and footer sections.
+ *
+ * UX Considerations:
+ * - Clear visual hierarchy with prominent header
+ * - Consistent spacing and alignment
+ * - Subtle shadows for depth without distraction
+ * - Flexible composition with header/footer slots
+ *
+ * Usage:
+ * ```html
+ * <bsg-table-card>
+ *   <bsg-tableCard-header title="My Table Title">
+ *     <button slot="action">New Item</button>
+ *   </bsg-tableCard-header>
+ *
+ *   <bsg-table>
+ *     ...
+ *   </bsg-table>
+ *
+ *   <bsg-tableCard-footer>
+ *     <span>Showing 1-10 of 100</span>
+ *   </bsg-tableCard-footer>
+ * </bsg-table-card>
+ * ```
+ */
+declare class TableCardComponent {
+    /** Additional CSS classes for the card container */
+    readonly className: _angular_core.InputSignal<string | undefined>;
+    readonly cardClasses: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TableCardComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TableCardComponent, "bsg-table-card", never, { "className": { "alias": "className"; "required": false; "isSignal": true; }; }, {}, never, ["bsg-tableCard-header", "*", "bsg-tableCard-footer"], true, never>;
+}
+
+type TableCardHeaderColor = 'default' | 'info' | 'success' | 'warning' | 'destructive';
+/**
+ * Table Card Header Component
+ *
+ * Header section for table cards with content projection for icon and title.
+ *
+ * Usage:
+ * ```html
+ * <!-- Simple title -->
+ * <bsg-tableCard-header>
+ *   <span>Titulo de la Tabla</span>
+ * </bsg-tableCard-header>
+ *
+ * <!-- With icon and title -->
+ * <bsg-tableCard-header color="info">
+ *   <svg class="size-5">...</svg>
+ *   <span>Titulo de la Tabla</span>
+ * </bsg-tableCard-header>
+ *
+ * <!-- With icon, title and action -->
+ * <bsg-tableCard-header color="success">
+ *   <svg class="size-5">...</svg>
+ *   <span>Titulo de la Tabla</span>
+ *   <button slot="action">Nueva Accion</button>
+ * </bsg-tableCard-header>
+ * ```
+ */
+declare class TableCardHeaderComponent {
+    /** Semantic color variant */
+    readonly color: _angular_core.InputSignal<TableCardHeaderColor>;
+    /** Additional CSS classes for header */
+    readonly className: _angular_core.InputSignal<string | undefined>;
+    readonly headerClasses: _angular_core.Signal<string>;
+    readonly contentClasses: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TableCardHeaderComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TableCardHeaderComponent, "bsg-tableCard-header", never, { "color": { "alias": "color"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; }, {}, never, ["*", "[slot='action']"], true, never>;
+}
+
+/**
+ * Table Card Footer Component
+ *
+ * Footer section for table cards, typically used for pagination,
+ * summary info, or action buttons.
+ *
+ * Usage:
+ * ```html
+ * <bsg-tableCard-footer>
+ *   <span>Showing 1-10 of 100</span>
+ *   <div>
+ *     <button>Previous</button>
+ *     <button>Next</button>
+ *   </div>
+ * </bsg-tableCard-footer>
+ * ```
+ */
+declare class TableCardFooterComponent {
+    /** Additional CSS classes */
+    readonly className: _angular_core.InputSignal<string | undefined>;
+    readonly footerClasses: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TableCardFooterComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TableCardFooterComponent, "bsg-tableCard-footer", never, { "className": { "alias": "className"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+type TableVariant = 'table-actions' | 'table-basic' | 'table-tabs' | 'list-content';
+interface TableColumn {
+    key: string;
+    label: string;
+    width?: string;
+}
+interface TableRow {
+    [key: string]: any;
+}
+interface ListItem {
+    text: string;
+}
+interface TabConfig extends TabItem {
+    tableData?: {
+        columns: TableColumn[];
+        rows: TableRow[];
+    };
+}
+interface TableAction {
+    label: string;
+    variant?: 'approve' | 'reject' | 'view';
+    onClick?: () => void;
+}
+/**
+ * @deprecated Use the new composable table components (TableComponent, TableHeader, TableBody, etc.) instead.
+ * This component is kept for backwards compatibility.
+ */
+declare class TableContainerComponent {
+    /** Container title */
+    title: string;
+    /** Display variant */
+    variant: TableVariant;
+    /** Header action button (e.g., "Nuevo mensaje") */
+    headerAction?: {
+        label: string;
+        variant?: ButtonVariant;
+        size?: ButtonSize;
+    };
+    isCollapsible: boolean;
+    isExpanded: boolean;
+    disableExpansion: boolean;
+    tableColumns: TableColumn[];
+    tableRows: TableRow[];
+    tablePagination?: {
+        currentPage: number;
+        totalPages: number;
+        pageSize: number;
+        pageSizeOptions: number[];
+        totalItems: number;
+        rangeLabel: string;
+    };
+    showActionsColumn: boolean;
+    actionsColumnLabel: string;
+    actionsColumnWidth: string;
+    listItems: ListItem[];
+    tabs: TabConfig[];
+    activeTabIndex: number;
+    tabsPagination: any[];
+    headerActionClick: EventEmitter<void>;
+    collapseToggle: EventEmitter<boolean>;
+    tabChange: EventEmitter<number>;
+    tablePageChange: EventEmitter<number>;
+    tablePageSizeChange: EventEmitter<number>;
+    tableRefresh: EventEmitter<void>;
+    tabPageChange: EventEmitter<{
+        tabIndex: number;
+        page: number;
+    }>;
+    tabPageSizeChange: EventEmitter<{
+        tabIndex: number;
+        pageSize: number;
+    }>;
+    tabRefresh: EventEmitter<number>;
+    rowAction: EventEmitter<{
+        rowIndex: number;
+        action: TableAction;
+    }>;
+    get containerClasses(): string[];
+    toggleCollapse(): void;
+    onHeaderAction(): void;
+    onTabChange(index: number): void;
+    onTablePageChange(page: number): void;
+    onTablePageSizeChange(pageSize: number): void;
+    onTableRefresh(): void;
+    onTabPageChange(tabIndex: number, page: number): void;
+    onTabPageSizeChange(tabIndex: number, pageSize: number): void;
+    onTabRefresh(tabIndex: number): void;
+    onRowAction(rowIndex: number, action: TableAction): void;
+    getActionVariant(actionVariant?: string): ButtonVariant;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TableContainerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TableContainerComponent, "bsg-table-container", never, { "title": { "alias": "title"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "headerAction": { "alias": "headerAction"; "required": false; }; "isCollapsible": { "alias": "isCollapsible"; "required": false; }; "isExpanded": { "alias": "isExpanded"; "required": false; }; "disableExpansion": { "alias": "disableExpansion"; "required": false; }; "tableColumns": { "alias": "tableColumns"; "required": false; }; "tableRows": { "alias": "tableRows"; "required": false; }; "tablePagination": { "alias": "tablePagination"; "required": false; }; "showActionsColumn": { "alias": "showActionsColumn"; "required": false; }; "actionsColumnLabel": { "alias": "actionsColumnLabel"; "required": false; }; "actionsColumnWidth": { "alias": "actionsColumnWidth"; "required": false; }; "listItems": { "alias": "listItems"; "required": false; }; "tabs": { "alias": "tabs"; "required": false; }; "activeTabIndex": { "alias": "activeTabIndex"; "required": false; }; "tabsPagination": { "alias": "tabsPagination"; "required": false; }; }, { "headerActionClick": "headerActionClick"; "collapseToggle": "collapseToggle"; "tabChange": "tabChange"; "tablePageChange": "tablePageChange"; "tablePageSizeChange": "tablePageSizeChange"; "tableRefresh": "tableRefresh"; "tabPageChange": "tabPageChange"; "tabPageSizeChange": "tabPageSizeChange"; "tabRefresh": "tabRefresh"; "rowAction": "rowAction"; }, never, never, true, never>;
+}
+
+/**
+ * Table wrapper variants
+ *
+ * Container with subtle shadow for depth and rounded corners
+ * for a modern, polished look
+ */
+declare const tableWrapperVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * Table variants
+ *
+ * Clean table with proper spacing and typography
+ */
+declare const tableVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * Table Header variants
+ *
+ * Distinct header with subtle background gradient
+ * and clear visual separation from body
+ */
+declare const tableHeaderVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * Table Body variants
+ *
+ * Clean body with alternating row colors option
+ */
+declare const tableBodyVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * Table Footer variants
+ *
+ * Distinct footer for totals and summaries
+ */
+declare const tableFooterVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * Table Row variants
+ *
+ * Interactive rows with clear hover and selected states
+ * Following UX best practices for discoverability
+ */
+declare const tableRowVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * Table Head variants
+ *
+ * Clear, readable headers with proper hierarchy
+ * Using semibold weight and blue accent for brand consistency
+ */
+declare const tableHeadVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * Table Cell variants
+ *
+ * Readable cells with proper spacing and alignment
+ */
+declare const tableCellVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * Table Card Header variants
+ *
+ * Prominent header with semantic colors and clear hierarchy
+ * Following UX principles for visual weight distribution
+ */
+declare const tableCardHeaderVariants: (props?: ({
+    color?: "default" | "info" | "success" | "warning" | "destructive" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+/**
+ * Table Card Footer variants
+ *
+ * Clean footer area for pagination and actions
+ */
+declare const tableCardFooterVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * Table Pagination wrapper variants
+ *
+ * Clean pagination area with proper spacing
+ */
+declare const tablePaginationVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * Table Empty State variants
+ *
+ * For when table has no data
+ */
+declare const tableEmptyStateVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * Table Loading State variants
+ *
+ * For skeleton loading states
+ */
+declare const tableLoadingVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * Striped table modifier
+ *
+ * Apply to tbody for alternating row colors
+ */
+declare const tableStripedVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * Compact table modifier
+ *
+ * Reduced padding for dense data
+ */
+declare const tableCompactVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+
 declare const textareaVariants: (props?: ({
     size?: "default" | "sm" | "lg" | null | undefined;
-    resize?: "none" | "horizontal" | "vertical" | "both" | null | undefined;
+    resize?: "horizontal" | "vertical" | "none" | "both" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 type TextareaSize = VariantProps<typeof textareaVariants>['size'];
 type TextareaResize = VariantProps<typeof textareaVariants>['resize'];
@@ -2222,7 +2985,7 @@ declare class TextareaComponent implements ControlValueAccessor, Validator {
     rows: _angular_core.InputSignal<number>;
     ariaInvalid: _angular_core.InputSignal<boolean | undefined>;
     size: _angular_core.InputSignal<"default" | "sm" | "lg" | null | undefined>;
-    resize: _angular_core.InputSignal<"none" | "horizontal" | "vertical" | "both" | null | undefined>;
+    resize: _angular_core.InputSignal<"horizontal" | "vertical" | "none" | "both" | null | undefined>;
     className: _angular_core.InputSignal<string | undefined>;
     get hostClasses(): string;
     value: _angular_core.WritableSignal<string>;
@@ -2585,5 +3348,5 @@ declare class TooltipComponent implements AfterContentInit {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<TooltipComponent, "bsg-tooltip", never, { "content": { "alias": "content"; "required": false; "isSignal": true; }; "placement": { "alias": "placement"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "triggerClassName": { "alias": "triggerClassName"; "required": false; "isSignal": true; }; "contentClassName": { "alias": "contentClassName"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 
-export { AccordionComponent, AccordionContentComponent, AccordionItemComponent, AccordionTriggerComponent, AlertComponent, AvatarComponent, BadgeComponent, ButtonComponent, CardBodyComponent, CardComponent, CardFooterComponent, CardHeaderComponent, CarouselComponent, CarouselItemComponent, CheckboxComponent, CollapsibleComponent, CollapsibleContentComponent, CollapsibleTriggerDirective, ComboboxComponent, DialogComponent, InputComponent, LabelComponent, RadioComponent, RadioGroupComponent, SelectComponent, SidebarComponent, SidebarContentComponent, SidebarFooterComponent, SidebarGroupActionComponent, SidebarGroupComponent, SidebarGroupContentComponent, SidebarGroupLabelComponent, SidebarHeaderComponent, SidebarInsetComponent, SidebarMenuActionComponent, SidebarMenuBadgeComponent, SidebarMenuButtonComponent, SidebarMenuComponent, SidebarMenuItemComponent, SidebarMenuSubButtonComponent, SidebarMenuSubComponent, SidebarMenuSubItemComponent, SidebarProviderComponent, SidebarRailComponent, SidebarSeparatorComponent, SidebarService, SidebarTriggerComponent, SkeletonComponent, SwitchComponent, TextareaComponent, TimePickerComponent, ToastComponent, TooltipComponent, accordionContentVariants, accordionItemVariants, accordionTriggerVariants, accordionVariants, alertCloseVariants, alertContentVariants, alertIconVariants, alertVariants, avatarIconVariants, avatarImgVariants, avatarInitialsVariants, avatarVariants, badgeIconVariants, badgeVariants, buttonIconOnlyVariants, buttonIconVariants, buttonLabelVariants, buttonVariants, cardActionIconVariants, cardCurrencyContentVariants, cardCurrencyIconVariants, cardCurrencyLabelVariants, cardCurrencyTextVariants, cardHeaderRowVariants, cardHeaderVariants, cardHelperDescriptionVariants, cardHelperRowVariants, cardHelperVariants, cardInfoIconVariants, cardInfoLabelVariants, cardInfoTextVariants, cardMetricTitleVariants, cardMetricValueVariants, cardSlotBodyVariants, cardSlotFooterVariants, cardSlotHeaderVariants, cardValueVariants, cardVariants, carouselArrowVariants, carouselChevronVariants, carouselContainerVariants, carouselIndicatorVariants, carouselIndicatorsVariants, carouselRootVariants, carouselTrackVariants, carouselViewportVariants, checkboxVariants, comboboxDropdownVariants, comboboxEmptyStateVariants, comboboxErrorMessageVariants, comboboxIconVariants, comboboxOptionVariants, comboboxOptionsContainerVariants, comboboxSearchInputVariants, comboboxSearchWrapperVariants, comboboxTriggerVariants, comboboxValueVariants, comboboxWrapperVariants, dialogBodyVariants, dialogContentVariants, dialogFooterVariants, dialogHeaderVariants, dialogOverlayVariants, inputVariants, labelVariants, radioFocusRingVariants, radioGroupVariants, radioInnerVariants, radioLabelVariants, radioOptionVariants, radioOuterVariants, radioWrapperVariants, selectDropdownVariants, selectErrorVariants, selectIconVariants, selectOptionVariants, selectTriggerVariants, selectValueVariants, selectWrapperVariants, sidebarChevronVariants, sidebarContentVariants, sidebarFooterVariants, sidebarGroupActionVariants, sidebarGroupContentVariants, sidebarGroupLabelVariants, sidebarGroupVariants, sidebarHeaderVariants, sidebarInsetVariants, sidebarMenuActionVariants, sidebarMenuBadgeVariants, sidebarMenuButtonVariants, sidebarMenuItemVariants, sidebarMenuSkeletonVariants, sidebarMenuSubButtonVariants, sidebarMenuSubItemVariants, sidebarMenuSubVariants, sidebarMenuVariants, sidebarProviderVariants, sidebarRailVariants, sidebarSeparatorVariants, sidebarTriggerVariants, sidebarVariants, sidebarWrapperVariants, skeletonVariants, switchRootVariants, switchThumbVariants, textareaVariants, timepickerActionButtonVariants, timepickerActionsVariants, timepickerColumnHeaderVariants, timepickerColumnVariants, timepickerDropdownVariants, timepickerErrorMessageVariants, timepickerFieldVariants, timepickerIconButtonVariants, timepickerInputVariants, timepickerLabelVariants, timepickerListVariants, timepickerOptionVariants, timepickerSelectionAreaVariants, timepickerSeparatorVariants, timepickerWrapperVariants, toastAccentVariants, toastCloseVariants, toastContentVariants, toastIconVariants, toastVariants, tooltipArrowVariants, tooltipContentVariants, tooltipTriggerVariants };
-export type { AccordionType, AccordionVariant, AccordionVariantsProps, AlertVariant, AlertVariantsProps, AvatarSize, AvatarType, AvatarVariantsProps, BadgeIconVariantsProps, BadgeLayout, BadgeSize, BadgeVariant, BadgeVariantsProps, ButtonShape, ButtonSize, ButtonVariant, ButtonVariantsProps, CardContentVariant, CardVariant, CardVariantsProps, CarouselArrowVariantsProps, CarouselIndicatorVariantsProps, CheckboxSize, ComboboxOption, ComboboxSize, ComboboxState, ComboboxTriggerVariantsProps, ComboboxWrapperVariantsProps, DialogBodyVariantsProps, DialogContentVariantsProps, DialogFooterVariantsProps, DialogHeaderTone, DialogHeaderVariantsProps, DialogSize, IconName, InputSize, RadioFocusRingVariantsProps, RadioGroupOption, RadioGroupOrientation, RadioGroupVariantsProps, RadioInnerVariantsProps, RadioLabelVariantsProps, RadioOptionVariantsProps, RadioOuterVariantsProps, RadioSize, RadioState, RadioWrapperVariantsProps, SelectOption, SelectSize, SelectState, SelectTriggerVariantsProps, SidebarCollapsible, SidebarMenuActionVariantsProps, SidebarMenuButtonVariantsProps, SidebarMenuSubButtonVariantsProps, SidebarSide, SidebarState, SidebarVariant, SkeletonType, SkeletonVariantsProps, SwitchSize, SwitchVariantsProps, TextareaResize, TextareaSize, TimePickerSize, TimePickerState, TimePickerWrapperVariantsProps, ToastVariant, ToastVariantsProps, TooltipContentVariantsProps, TooltipPlacement };
+export { AccordionComponent, AccordionContentComponent, AccordionItemComponent, AccordionTriggerComponent, AlertComponent, AvatarComponent, BadgeComponent, ButtonComponent, CardBodyComponent, CardComponent, CardFooterComponent, CardHeaderComponent, CarouselComponent, CarouselItemComponent, CheckboxComponent, CollapsibleComponent, CollapsibleContentComponent, CollapsibleTriggerDirective, ComboboxComponent, DialogComponent, InputComponent, LabelComponent, RadioComponent, RadioGroupComponent, SelectComponent, SidebarComponent, SidebarContentComponent, SidebarFooterComponent, SidebarGroupActionComponent, SidebarGroupComponent, SidebarGroupContentComponent, SidebarGroupLabelComponent, SidebarHeaderComponent, SidebarInsetComponent, SidebarMenuActionComponent, SidebarMenuBadgeComponent, SidebarMenuButtonComponent, SidebarMenuComponent, SidebarMenuItemComponent, SidebarMenuSubButtonComponent, SidebarMenuSubComponent, SidebarMenuSubItemComponent, SidebarProviderComponent, SidebarRailComponent, SidebarSeparatorComponent, SidebarService, SidebarTriggerComponent, SkeletonComponent, SpinnerComponent, SwitchComponent, TabContentDirective, TabNavigationComponent, TableBodyComponent, TableCardComponent, TableCardFooterComponent, TableCardHeaderComponent, TableCellComponent, TableComponent, TableContainerComponent, TableFooterComponent, TableHeadComponent, TableHeaderComponent, TableRowComponent, TabsComponent, TabsContentComponent, TabsListComponent, TabsTriggerComponent, TextareaComponent, TimePickerComponent, ToastComponent, TooltipComponent, accordionContentVariants, accordionItemVariants, accordionTriggerVariants, accordionVariants, alertCloseVariants, alertContentVariants, alertIconVariants, alertVariants, avatarIconVariants, avatarImgVariants, avatarInitialsVariants, avatarVariants, badgeIconVariants, badgeVariants, buttonIconOnlyVariants, buttonIconVariants, buttonLabelVariants, buttonSpinnerVariants, buttonVariants, cardActionIconVariants, cardCurrencyContentVariants, cardCurrencyIconVariants, cardCurrencyLabelVariants, cardCurrencyTextVariants, cardHeaderRowVariants, cardHeaderVariants, cardHelperDescriptionVariants, cardHelperRowVariants, cardHelperVariants, cardInfoIconVariants, cardInfoLabelVariants, cardInfoTextVariants, cardMetricTitleVariants, cardMetricValueVariants, cardSlotBodyVariants, cardSlotFooterVariants, cardSlotHeaderVariants, cardValueVariants, cardVariants, carouselArrowVariants, carouselChevronVariants, carouselContainerVariants, carouselIndicatorVariants, carouselIndicatorsVariants, carouselRootVariants, carouselTrackVariants, carouselViewportVariants, checkboxVariants, comboboxDropdownVariants, comboboxEmptyStateVariants, comboboxErrorMessageVariants, comboboxIconVariants, comboboxOptionVariants, comboboxOptionsContainerVariants, comboboxSearchInputVariants, comboboxSearchWrapperVariants, comboboxTriggerVariants, comboboxValueVariants, comboboxWrapperVariants, dialogBodyVariants, dialogContentVariants, dialogFooterVariants, dialogHeaderVariants, dialogOverlayVariants, inputVariants, labelVariants, radioFocusRingVariants, radioGroupVariants, radioInnerVariants, radioLabelVariants, radioOptionVariants, radioOuterVariants, radioWrapperVariants, selectDropdownVariants, selectErrorVariants, selectIconVariants, selectOptionVariants, selectTriggerVariants, selectValueVariants, selectWrapperVariants, sidebarChevronVariants, sidebarContentVariants, sidebarFooterVariants, sidebarGroupActionVariants, sidebarGroupContentVariants, sidebarGroupLabelVariants, sidebarGroupVariants, sidebarHeaderVariants, sidebarInsetVariants, sidebarMenuActionVariants, sidebarMenuBadgeVariants, sidebarMenuButtonVariants, sidebarMenuItemVariants, sidebarMenuSkeletonVariants, sidebarMenuSubButtonVariants, sidebarMenuSubItemVariants, sidebarMenuSubVariants, sidebarMenuVariants, sidebarProviderVariants, sidebarRailVariants, sidebarSeparatorVariants, sidebarTriggerVariants, sidebarVariants, sidebarWrapperVariants, skeletonVariants, spinnerVariants, switchRootVariants, switchThumbVariants, tabIconCircleVariants, tabIconContentVariants, tabItemVariants, tabLabelVariants, tabNavigationVariants, tabTextContentVariants, tableBodyVariants, tableCardFooterVariants, tableCardHeaderVariants, tableCellVariants, tableCompactVariants, tableEmptyStateVariants, tableFooterVariants, tableHeadVariants, tableHeaderVariants, tableLoadingVariants, tablePaginationVariants, tableRowVariants, tableStripedVariants, tableVariants, tableWrapperVariants, textareaVariants, timepickerActionButtonVariants, timepickerActionsVariants, timepickerColumnHeaderVariants, timepickerColumnVariants, timepickerDropdownVariants, timepickerErrorMessageVariants, timepickerFieldVariants, timepickerIconButtonVariants, timepickerInputVariants, timepickerLabelVariants, timepickerListVariants, timepickerOptionVariants, timepickerSelectionAreaVariants, timepickerSeparatorVariants, timepickerWrapperVariants, toastAccentVariants, toastCloseVariants, toastContentVariants, toastIconVariants, toastVariants, tooltipArrowVariants, tooltipContentVariants, tooltipTriggerVariants };
+export type { AccordionType, AccordionVariant, AccordionVariantsProps, AlertVariant, AlertVariantsProps, AvatarSize, AvatarType, AvatarVariantsProps, BadgeIconVariantsProps, BadgeLayout, BadgeSize, BadgeVariant, BadgeVariantsProps, ButtonShape, ButtonSize, ButtonVariant, ButtonVariantsProps, CardContentVariant, CardVariant, CardVariantsProps, CarouselArrowVariantsProps, CarouselIndicatorVariantsProps, CheckboxSize, ComboboxOption, ComboboxSize, ComboboxState, ComboboxTriggerVariantsProps, ComboboxWrapperVariantsProps, DialogBodyVariantsProps, DialogContentVariantsProps, DialogFooterVariantsProps, DialogHeaderTone, DialogHeaderVariantsProps, DialogSize, InputSize, ListItem, RadioFocusRingVariantsProps, RadioGroupOption, RadioGroupOrientation, RadioGroupVariantsProps, RadioInnerVariantsProps, RadioLabelVariantsProps, RadioOptionVariantsProps, RadioOuterVariantsProps, RadioSize, RadioState, RadioWrapperVariantsProps, SelectOption, SelectSize, SelectState, SelectTriggerVariantsProps, SidebarCollapsible, SidebarMenuActionVariantsProps, SidebarMenuButtonVariantsProps, SidebarMenuSubButtonVariantsProps, SidebarSide, SidebarState, SidebarVariant, SkeletonType, SkeletonVariantsProps, SpinnerSize, SpinnerVariant, SpinnerVariantsProps, SwitchSize, SwitchVariantsProps, TabColor, TabConfig, TabItem, TabItemVariantsProps, TabLayout, TabSize, TabVariant, TableAction, TableCardHeaderColor, TableColumn, TableRow, TableVariant, TabsTriggerVariantsProps, TextareaResize, TextareaSize, TimePickerSize, TimePickerState, TimePickerWrapperVariantsProps, ToastVariant, ToastVariantsProps, TooltipContentVariantsProps, TooltipPlacement };