cerxos-ui 0.0.3 → 0.0.5

package/index.d.ts

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { EventEmitter, OnDestroy, ElementRef, Renderer2 } from '@angular/core';
+import { EventEmitter, OnChanges, AfterViewInit, OnDestroy, SimpleChanges, TemplateRef, ElementRef, Renderer2 } from '@angular/core';
 import { ControlValueAccessor } from '@angular/forms';
 
 declare class CerxosUi {
@@ -22,6 +22,33 @@ declare class CxsAlertComponent {
     static ɵcmp: i0.ɵɵComponentDeclaration<CxsAlertComponent, "cxs-alert", never, { "variant": { "alias": "variant"; "required": false; }; "title": { "alias": "title"; "required": false; }; "dismissible": { "alias": "dismissible"; "required": false; }; }, { "closed": "closed"; }, never, ["*"], true, never>;
 }
 
+type CxsAccordionSpacing = 'sm' | 'md' | 'lg';
+declare class CxsAccordionComponent {
+    spacing: CxsAccordionSpacing;
+    get accordionClass(): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CxsAccordionComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CxsAccordionComponent, "cxs-accordion", never, { "spacing": { "alias": "spacing"; "required": false; }; }, {}, never, ["*"], true, never>;
+}
+
+type CxsAccordionItemSize = 'sm' | 'md' | 'lg';
+declare class CxsAccordionItemComponent {
+    private static nextId;
+    title?: string;
+    expanded: boolean;
+    disabled: boolean;
+    size: CxsAccordionItemSize;
+    expandedChange: EventEmitter<boolean>;
+    readonly buttonId: string;
+    readonly contentId: string;
+    get itemClass(): string;
+    get headerClass(): string;
+    get contentClass(): string;
+    get iconClass(): string;
+    toggle(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CxsAccordionItemComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CxsAccordionItemComponent, "cxs-accordion-item", never, { "title": { "alias": "title"; "required": false; }; "expanded": { "alias": "expanded"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, { "expandedChange": "expandedChange"; }, never, ["[cxsAccordionTitle]", "*"], true, never>;
+}
+
 type CxsBadgeVariant = 'primary' | 'neutral' | 'danger';
 type CxsBadgeSize = 'sm' | 'md';
 declare class CxsBadgeComponent {
@@ -32,6 +59,31 @@ declare class CxsBadgeComponent {
     static ɵcmp: i0.ɵɵComponentDeclaration<CxsBadgeComponent, "cxs-badge", never, { "variant": { "alias": "variant"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, {}, never, ["*"], true, never>;
 }
 
+type CxsAvatarSize = 'sm' | 'md' | 'lg';
+type CxsAvatarShape = 'circle' | 'square';
+declare class CxsAvatarComponent {
+    private readonly hostClass;
+    private _src?;
+    set src(value: string | undefined);
+    get src(): string | undefined;
+    name?: string;
+    alt?: string;
+    size: CxsAvatarSize;
+    shape: CxsAvatarShape;
+    imageError: boolean;
+    constructor(hostClass: string | null);
+    get avatarClass(): string;
+    get fallbackClass(): string;
+    get altText(): string;
+    get fallbackLabel(): string;
+    get fallbackText(): string;
+    get showImage(): boolean;
+    onImageError(): void;
+    private getInitials;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CxsAvatarComponent, [{ attribute: "class"; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CxsAvatarComponent, "cxs-avatar", never, { "src": { "alias": "src"; "required": false; }; "name": { "alias": "name"; "required": false; }; "alt": { "alias": "alt"; "required": false; }; "size": { "alias": "size"; "required": false; }; "shape": { "alias": "shape"; "required": false; }; }, {}, never, never, true, never>;
+}
+
 type CxsBreadcrumbSize = 'sm' | 'md' | 'lg';
 type CxsBreadcrumbVariant = 'default' | 'muted';
 interface CxsBreadcrumbItem {
@@ -73,7 +125,7 @@ declare class CxsButtonComponent {
     get isDisabled(): boolean;
     get buttonClass(): string;
     static ɵfac: i0.ɵɵFactoryDeclaration<CxsButtonComponent, [{ attribute: "class"; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<CxsButtonComponent, "cxs-button", never, { "variant": { "alias": "variant"; "required": false; }; "size": { "alias": "size"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; "type": { "alias": "type"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CxsButtonComponent, "cxs-button", never, { "variant": { "alias": "variant"; "required": false; }; "size": { "alias": "size"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; "type": { "alias": "type"; "required": false; }; }, {}, never, ["[cxsButtonIcon]", "*"], true, never>;
 }
 
 type CxsCardVariant = 'surface' | 'muted' | 'outline';
@@ -121,6 +173,250 @@ declare class CxsCheckboxComponent implements ControlValueAccessor {
     static ɵcmp: i0.ɵɵComponentDeclaration<CxsCheckboxComponent, "cxs-checkbox", never, { "checked": { "alias": "checked"; "required": false; }; "indeterminate": { "alias": "indeterminate"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "label": { "alias": "label"; "required": false; }; "size": { "alias": "size"; "required": false; }; "id": { "alias": "id"; "required": false; }; "name": { "alias": "name"; "required": false; }; "required": { "alias": "required"; "required": false; }; "autofocus": { "alias": "autofocus"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "ariaDescribedby": { "alias": "ariaDescribedby"; "required": false; }; }, { "valueChange": "valueChange"; }, never, ["*"], true, never>;
 }
 
+interface CxsCarouselItem {
+    title?: string;
+    description?: string;
+    image?: string;
+    alt?: string;
+}
+declare class CxsCarouselComponent implements OnChanges, AfterViewInit, OnDestroy {
+    private readonly hostClass;
+    items: CxsCarouselItem[];
+    activeIndex: number;
+    autoplay: boolean;
+    interval: number;
+    loop: boolean;
+    showControls: boolean;
+    showIndicators: boolean;
+    ariaLabel: string;
+    activeIndexChange: EventEmitter<number>;
+    private timerId;
+    constructor(hostClass: string | null);
+    ngOnChanges(changes: SimpleChanges): void;
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    get wrapperClass(): string;
+    get trackStyle(): string;
+    get trackClass(): string;
+    get slideClass(): string;
+    get imageClass(): string;
+    get contentClass(): string;
+    get controlClass(): string;
+    get indicatorContainerClass(): string;
+    indicatorClass(isActive: boolean): string;
+    previous(): void;
+    next(): void;
+    goTo(index: number): void;
+    private normalizeIndex;
+    private clampIndex;
+    private resetAutoplay;
+    private clearAutoplay;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CxsCarouselComponent, [{ attribute: "class"; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CxsCarouselComponent, "cxs-carousel", never, { "items": { "alias": "items"; "required": false; }; "activeIndex": { "alias": "activeIndex"; "required": false; }; "autoplay": { "alias": "autoplay"; "required": false; }; "interval": { "alias": "interval"; "required": false; }; "loop": { "alias": "loop"; "required": false; }; "showControls": { "alias": "showControls"; "required": false; }; "showIndicators": { "alias": "showIndicators"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; }, { "activeIndexChange": "activeIndexChange"; }, never, never, true, never>;
+}
+
+type CxsDataTableAlign = 'left' | 'center' | 'right';
+type CxsDataTableSortDirection = 'asc' | 'desc';
+type CxsDataTableFilterType = 'text' | 'select' | 'number';
+type CxsDataTablePin = 'left' | 'right';
+interface CxsDataTableColumn {
+    key: string;
+    label: string;
+    align?: CxsDataTableAlign;
+    width?: string;
+    sortable?: boolean;
+    filterable?: boolean;
+    filterType?: CxsDataTableFilterType;
+    filterOptions?: Array<{
+        label: string;
+        value: string;
+    }>;
+    resizable?: boolean;
+    pinned?: CxsDataTablePin;
+    visible?: boolean;
+    minWidth?: number;
+    headerClass?: string;
+    cellClass?: string;
+    formatter?: (value: unknown, row: Record<string, unknown>) => string;
+}
+interface CxsDataTableSort {
+    key: string;
+    direction: CxsDataTableSortDirection;
+}
+declare class CxsDataTableComponent implements OnChanges {
+    private readonly hostClass;
+    columns: CxsDataTableColumn[];
+    data: Array<Record<string, unknown>>;
+    caption?: string;
+    ariaLabel: string;
+    striped: boolean;
+    bordered: boolean;
+    compact: boolean;
+    loading: boolean;
+    emptyMessage: string;
+    emptyCell: string;
+    pageSize: number;
+    pageIndex: number;
+    pageSizeOptions: number[];
+    showPagination: boolean;
+    showPageSize: boolean;
+    manualPagination: boolean;
+    total?: number;
+    sortKey?: string;
+    sortDirection: CxsDataTableSortDirection;
+    manualSort: boolean;
+    showToolbar: boolean;
+    showFilters: boolean;
+    showColumnVisibility: boolean;
+    showGlobalSearch: boolean;
+    manualFilter: boolean;
+    selectable: boolean;
+    rowKey: string;
+    selectedKeys: Array<string | number>;
+    bulkActions: Array<{
+        id: string;
+        label: string;
+    }>;
+    pageChange: EventEmitter<number>;
+    pageSizeChange: EventEmitter<number>;
+    sortChange: EventEmitter<CxsDataTableSort>;
+    filterChange: EventEmitter<{
+        global: string;
+        columns: Record<string, string>;
+    }>;
+    selectionChange: EventEmitter<(string | number)[]>;
+    bulkAction: EventEmitter<{
+        id: string;
+        selected: Array<Record<string, unknown>>;
+    }>;
+    private readonly cellTemplates?;
+    protected currentPage: number;
+    protected currentPageSize: number;
+    protected globalFilter: string;
+    protected columnFilters: Record<string, string>;
+    protected columnVisibility: Record<string, boolean>;
+    protected columnWidths: Record<string, string>;
+    protected isResizing: boolean;
+    protected resizingColumn?: string;
+    protected pinnedOffsetsLeft: Record<string, number>;
+    protected pinnedOffsetsRight: Record<string, number>;
+    protected filtersOpen: boolean;
+    private resizeStartX;
+    private resizeStartWidth;
+    constructor(hostClass: string | null);
+    ngOnChanges(changes: SimpleChanges): void;
+    get wrapperClass(): string;
+    get tableClass(): string;
+    get headerRowClass(): string;
+    get bodyRowClass(): string;
+    get emptyRowClass(): string;
+    get paginationClass(): string;
+    get pageButtonClass(): string;
+    get pageSelectClass(): string;
+    get toolbarClass(): string;
+    get toolbarGroupClass(): string;
+    get toolbarInputClass(): string;
+    get toolbarButtonClass(): string;
+    get bulkBarClass(): string;
+    get resizeHandleClass(): string;
+    get colSpan(): number;
+    get totalItems(): number;
+    get totalPages(): number;
+    get pageLabel(): string;
+    get displayRows(): Array<Record<string, unknown>>;
+    get visibleColumns(): CxsDataTableColumn[];
+    get selectedCount(): number;
+    get allVisibleSelected(): boolean;
+    get someVisibleSelected(): boolean;
+    headerCellClass(column: CxsDataTableColumn): string;
+    headerButtonClass(): string;
+    headerFilterInputClass(): string;
+    bodyCellClass(column: CxsDataTableColumn): string;
+    cellTemplate(columnKey: string): TemplateRef<CxsDataTableCellContext> | null;
+    cellValue(row: Record<string, unknown>, column: CxsDataTableColumn): string;
+    columnWidth(column: CxsDataTableColumn): string | null;
+    columnMinWidth(column: CxsDataTableColumn): string | null;
+    pinnedStyle(column: CxsDataTableColumn): Record<string, string> | null;
+    pinnedLeft(column: CxsDataTableColumn): string | null;
+    pinnedRight(column: CxsDataTableColumn): string | null;
+    pinnedClass(column: CxsDataTableColumn): string;
+    ariaSort(column: CxsDataTableColumn): 'ascending' | 'descending' | 'none' | null;
+    onSort(column: CxsDataTableColumn): void;
+    goToPage(page: number): void;
+    nextPage(): void;
+    previousPage(): void;
+    onPageSizeChange(value: string): void;
+    onGlobalFilterChange(value: string): void;
+    onColumnFilterChange(columnKey: string, value: string): void;
+    columnFilterValue(columnKey: string): string;
+    toggleColumnVisibility(columnKey: string): void;
+    toggleSelectAll(): void;
+    toggleRowSelection(row: Record<string, unknown>): void;
+    isSelected(row: Record<string, unknown>): boolean;
+    runBulkAction(actionId: string): void;
+    onResizeStart(event: MouseEvent, column: CxsDataTableColumn): void;
+    private getSortedData;
+    private getFilteredData;
+    private emitFilterChange;
+    private initializeVisibility;
+    private initializeWidths;
+    private updatePinnedOffsets;
+    private getWidthValue;
+    private rowIdentifier;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CxsDataTableComponent, [{ attribute: "class"; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CxsDataTableComponent, "cxs-data-table", never, { "columns": { "alias": "columns"; "required": false; }; "data": { "alias": "data"; "required": false; }; "caption": { "alias": "caption"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "striped": { "alias": "striped"; "required": false; }; "bordered": { "alias": "bordered"; "required": false; }; "compact": { "alias": "compact"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; "emptyMessage": { "alias": "emptyMessage"; "required": false; }; "emptyCell": { "alias": "emptyCell"; "required": false; }; "pageSize": { "alias": "pageSize"; "required": false; }; "pageIndex": { "alias": "pageIndex"; "required": false; }; "pageSizeOptions": { "alias": "pageSizeOptions"; "required": false; }; "showPagination": { "alias": "showPagination"; "required": false; }; "showPageSize": { "alias": "showPageSize"; "required": false; }; "manualPagination": { "alias": "manualPagination"; "required": false; }; "total": { "alias": "total"; "required": false; }; "sortKey": { "alias": "sortKey"; "required": false; }; "sortDirection": { "alias": "sortDirection"; "required": false; }; "manualSort": { "alias": "manualSort"; "required": false; }; "showToolbar": { "alias": "showToolbar"; "required": false; }; "showFilters": { "alias": "showFilters"; "required": false; }; "showColumnVisibility": { "alias": "showColumnVisibility"; "required": false; }; "showGlobalSearch": { "alias": "showGlobalSearch"; "required": false; }; "manualFilter": { "alias": "manualFilter"; "required": false; }; "selectable": { "alias": "selectable"; "required": false; }; "rowKey": { "alias": "rowKey"; "required": false; }; "selectedKeys": { "alias": "selectedKeys"; "required": false; }; "bulkActions": { "alias": "bulkActions"; "required": false; }; }, { "pageChange": "pageChange"; "pageSizeChange": "pageSizeChange"; "sortChange": "sortChange"; "filterChange": "filterChange"; "selectionChange": "selectionChange"; "bulkAction": "bulkAction"; }, ["cellTemplates"], never, true, never>;
+}
+
+interface CxsDataTableCellContext {
+    $implicit: Record<string, unknown>;
+    value: unknown;
+    column: CxsDataTableColumn;
+}
+declare class CxsDataTableCellDirective {
+    readonly template: TemplateRef<CxsDataTableCellContext>;
+    columnKey: string;
+    constructor(template: TemplateRef<CxsDataTableCellContext>);
+    static ɵfac: i0.ɵɵFactoryDeclaration<CxsDataTableCellDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CxsDataTableCellDirective, "[cxsDataTableCell]", never, { "columnKey": { "alias": "cxsDataTableCell"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+type CxsDialogSize = 'sm' | 'md' | 'lg';
+type CxsDialogCloseReason = 'dismiss' | 'backdrop' | 'escape';
+declare class CxsDialogComponent implements OnChanges, AfterViewInit {
+    private readonly hostClass;
+    private static nextId;
+    open: boolean;
+    title?: string;
+    description?: string;
+    ariaLabel: string;
+    size: CxsDialogSize;
+    dismissible: boolean;
+    closeOnBackdrop: boolean;
+    closeOnEscape: boolean;
+    openChange: EventEmitter<boolean>;
+    closed: EventEmitter<CxsDialogCloseReason>;
+    private readonly dialogPanel?;
+    readonly titleId: string;
+    readonly descriptionId: string;
+    constructor(hostClass: string | null);
+    ngOnChanges(changes: SimpleChanges): void;
+    ngAfterViewInit(): void;
+    get overlayClass(): string;
+    get panelClass(): string;
+    get titleClass(): string;
+    get descriptionClass(): string;
+    get bodyClass(): string;
+    get actionsClass(): string;
+    get closeButtonClass(): string;
+    get ariaLabelValue(): string | null;
+    requestClose(reason: CxsDialogCloseReason): void;
+    onBackdropClick(event: MouseEvent): void;
+    onKeydown(event: KeyboardEvent): void;
+    private focusPanelSoon;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CxsDialogComponent, [{ attribute: "class"; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CxsDialogComponent, "cxs-dialog", never, { "open": { "alias": "open"; "required": false; }; "title": { "alias": "title"; "required": false; }; "description": { "alias": "description"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "size": { "alias": "size"; "required": false; }; "dismissible": { "alias": "dismissible"; "required": false; }; "closeOnBackdrop": { "alias": "closeOnBackdrop"; "required": false; }; "closeOnEscape": { "alias": "closeOnEscape"; "required": false; }; }, { "openChange": "openChange"; "closed": "closed"; }, never, ["*", "[cxsDialogActions]"], true, never>;
+}
+
 type CxsDatepickerVariant = 'outline' | 'filled';
 type CxsDatepickerSize = 'sm' | 'md' | 'lg';
 type CxsCalendarDay = {
@@ -158,12 +454,18 @@ declare class CxsDatepickerComponent implements ControlValueAccessor {
     displayMonth: Date;
     calendarDays: CxsCalendarDay[];
     readonly weekDayLabels: string[];
+    readonly monthOptions: {
+        value: number;
+        label: string;
+    }[];
     get isDisabled(): boolean;
     get panelId(): string;
     get inputClass(): string;
     get popoverClass(): string;
     get navButtonClass(): string;
+    get selectClass(): string;
     get displayMonthLabel(): string;
+    get yearOptions(): number[];
     writeValue(value: string | null): void;
     registerOnChange(fn: (value: string) => void): void;
     registerOnTouched(fn: () => void): void;
@@ -175,6 +477,8 @@ declare class CxsDatepickerComponent implements ControlValueAccessor {
     toggle(): void;
     prevMonth(): void;
     nextMonth(): void;
+    onMonthChange(event: Event): void;
+    onYearChange(event: Event): void;
     dayButtonClass(day: CxsCalendarDay): string;
     onDocumentClick(event: MouseEvent): void;
     onEscape(): void;
@@ -225,6 +529,39 @@ declare class CxsInputComponent implements ControlValueAccessor {
     static ɵcmp: i0.ɵɵComponentDeclaration<CxsInputComponent, "cxs-input", never, { "value": { "alias": "value"; "required": false; }; "type": { "alias": "type"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "size": { "alias": "size"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "required": { "alias": "required"; "required": false; }; "invalid": { "alias": "invalid"; "required": false; }; "autofocus": { "alias": "autofocus"; "required": false; }; "id": { "alias": "id"; "required": false; }; "name": { "alias": "name"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "autocomplete": { "alias": "autocomplete"; "required": false; }; "inputmode": { "alias": "inputmode"; "required": false; }; "spellcheck": { "alias": "spellcheck"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "ariaDescribedby": { "alias": "ariaDescribedby"; "required": false; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
 }
 
+type CxsMenubarSize = 'sm' | 'md' | 'lg';
+type CxsMenubarVariant = 'default' | 'surface';
+interface CxsMenubarItem {
+    label: string;
+    href?: string;
+    target?: string;
+    rel?: string;
+    ariaLabel?: string;
+    disabled?: boolean;
+    active?: boolean;
+}
+declare class CxsMenubarComponent {
+    private readonly hostClass;
+    items: CxsMenubarItem[];
+    ariaLabel: string;
+    size: CxsMenubarSize;
+    variant: CxsMenubarVariant;
+    disabled: boolean;
+    itemSelected: EventEmitter<CxsMenubarItem>;
+    private readonly menuItems?;
+    constructor(hostClass: string | null);
+    get menubarClass(): string;
+    isItemDisabled(item: CxsMenubarItem): boolean;
+    getItemClass(item: CxsMenubarItem): string;
+    getItemHref(item: CxsMenubarItem): string | null;
+    getItemRel(item: CxsMenubarItem): string | null;
+    onItemClick(item: CxsMenubarItem, event: Event): void;
+    onKeydown(event: KeyboardEvent): void;
+    private getFocusableItems;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CxsMenubarComponent, [{ attribute: "class"; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CxsMenubarComponent, "cxs-menubar", never, { "items": { "alias": "items"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "size": { "alias": "size"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "itemSelected": "itemSelected"; }, never, never, true, never>;
+}
+
 type CxsRadioSize = 'sm' | 'md' | 'lg';
 type CxsRadioVariant = 'primary' | 'secondary';
 declare class CxsRadioComponent implements ControlValueAccessor {
@@ -291,6 +628,119 @@ declare class CxsSelectComponent implements ControlValueAccessor {
     static ɵcmp: i0.ɵɵComponentDeclaration<CxsSelectComponent, "cxs-select", never, { "value": { "alias": "value"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "size": { "alias": "size"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "required": { "alias": "required"; "required": false; }; "invalid": { "alias": "invalid"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "placeholderValue": { "alias": "placeholderValue"; "required": false; }; "id": { "alias": "id"; "required": false; }; "name": { "alias": "name"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "ariaDescribedby": { "alias": "ariaDescribedby"; "required": false; }; }, { "valueChange": "valueChange"; }, never, ["*"], true, never>;
 }
 
+type CxsTableAlign = 'left' | 'center' | 'right';
+interface CxsTableColumn {
+    key: string;
+    label: string;
+    align?: CxsTableAlign;
+    width?: string;
+    headerClass?: string;
+    cellClass?: string;
+}
+declare class CxsTableComponent {
+    private readonly hostClass;
+    columns: CxsTableColumn[];
+    data: Array<Record<string, unknown>>;
+    caption?: string;
+    ariaLabel: string;
+    striped: boolean;
+    bordered: boolean;
+    compact: boolean;
+    emptyMessage: string;
+    emptyCell: string;
+    constructor(hostClass: string | null);
+    get wrapperClass(): string;
+    get tableClass(): string;
+    get headerRowClass(): string;
+    get bodyRowClass(): string;
+    get emptyRowClass(): string;
+    get colSpan(): number;
+    headerCellClass(column: CxsTableColumn): string;
+    bodyCellClass(column: CxsTableColumn): string;
+    cellValue(row: Record<string, unknown>, column: CxsTableColumn): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CxsTableComponent, [{ attribute: "class"; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CxsTableComponent, "cxs-table", never, { "columns": { "alias": "columns"; "required": false; }; "data": { "alias": "data"; "required": false; }; "caption": { "alias": "caption"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "striped": { "alias": "striped"; "required": false; }; "bordered": { "alias": "bordered"; "required": false; }; "compact": { "alias": "compact"; "required": false; }; "emptyMessage": { "alias": "emptyMessage"; "required": false; }; "emptyCell": { "alias": "emptyCell"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+type CxsToggleSize = 'sm' | 'md' | 'lg';
+declare class CxsToggleComponent {
+    private static nextId;
+    checked: boolean;
+    disabled: boolean;
+    size: CxsToggleSize;
+    label?: string;
+    ariaLabel: string;
+    checkedChange: EventEmitter<boolean>;
+    readonly labelId: string;
+    get wrapperClass(): string;
+    get labelClass(): string;
+    get trackClass(): string;
+    get thumbClass(): string;
+    get ariaLabelValue(): string | null;
+    toggle(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CxsToggleComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CxsToggleComponent, "cxs-toggle", never, { "checked": { "alias": "checked"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "size": { "alias": "size"; "required": false; }; "label": { "alias": "label"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; }, { "checkedChange": "checkedChange"; }, never, never, true, never>;
+}
+
+type CxsToastVariant = 'info' | 'neutral' | 'danger';
+type CxsToastCloseReason = 'dismiss' | 'timeout';
+type CxsToastPosition = 'bottom-right' | 'bottom' | 'bottom-left' | 'top-right' | 'top' | 'top-left' | 'right' | 'left' | 'center';
+type CxsToastMaxWidth = 'sm' | 'md' | 'lg' | 'xl' | 'none';
+declare class CxsToastComponent implements OnChanges, OnDestroy {
+    private readonly hostClass;
+    open: boolean;
+    title?: string;
+    message?: string;
+    ariaLabel: string;
+    variant: CxsToastVariant;
+    dismissible: boolean;
+    duration: number;
+    position: CxsToastPosition;
+    maxWidth: CxsToastMaxWidth;
+    openChange: EventEmitter<boolean>;
+    dismissed: EventEmitter<CxsToastCloseReason>;
+    private timeoutId;
+    constructor(hostClass: string | null);
+    ngOnChanges(changes: SimpleChanges): void;
+    ngOnDestroy(): void;
+    get hostClassName(): string;
+    get toastClass(): string;
+    get titleClass(): string;
+    get messageClass(): string;
+    get actionsClass(): string;
+    get closeButtonClass(): string;
+    get role(): 'status' | 'alert';
+    get ariaLive(): 'polite' | 'assertive';
+    get ariaLabelValue(): string | null;
+    requestClose(reason: CxsToastCloseReason): void;
+    private resetTimer;
+    private clearTimer;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CxsToastComponent, [{ attribute: "class"; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CxsToastComponent, "cxs-toast", never, { "open": { "alias": "open"; "required": false; }; "title": { "alias": "title"; "required": false; }; "message": { "alias": "message"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "dismissible": { "alias": "dismissible"; "required": false; }; "duration": { "alias": "duration"; "required": false; }; "position": { "alias": "position"; "required": false; }; "maxWidth": { "alias": "maxWidth"; "required": false; }; }, { "openChange": "openChange"; "dismissed": "dismissed"; }, never, ["*", "[cxsToastAction]"], true, never>;
+}
+
+type CxsTooltipPosition = 'top' | 'right' | 'bottom' | 'left';
+declare class CxsTooltipComponent {
+    private static nextId;
+    text: string;
+    position: CxsTooltipPosition;
+    disabled: boolean;
+    open: boolean;
+    readonly tooltipId: string;
+    get wrapperClass(): string;
+    get tooltipClass(): string;
+    get describedBy(): string | null;
+    show(): void;
+    hide(): void;
+    onMouseEnter(): void;
+    onMouseLeave(): void;
+    onFocusIn(): void;
+    onFocusOut(): void;
+    onKeydown(event: KeyboardEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CxsTooltipComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CxsTooltipComponent, "cxs-tooltip", never, { "text": { "alias": "text"; "required": false; }; "position": { "alias": "position"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, {}, never, ["*"], true, never>;
+}
+
 type CxsThemeMode = 'light' | 'dark' | 'system';
 declare class CxsThemeDirective implements OnDestroy {
     private readonly host;
@@ -311,5 +761,5 @@ declare class CxsThemeDirective implements OnDestroy {
     static ɵdir: i0.ɵɵDirectiveDeclaration<CxsThemeDirective, "[cxsTheme]", never, { "cxsTheme": { "alias": "cxsTheme"; "required": false; }; "cxsThemeDarkClass": { "alias": "cxsThemeDarkClass"; "required": false; }; }, {}, never, never, true, never>;
 }
 
-export { CerxosUi, CxsAlertComponent, CxsBadgeComponent, CxsBreadcrumbComponent, CxsButtonComponent, CxsCardComponent, CxsCheckboxComponent, CxsDatepickerComponent, CxsInputComponent, CxsRadioComponent, CxsSelectComponent, CxsThemeDirective };
-export type { CxsAlertVariant, CxsBadgeSize, CxsBadgeVariant, CxsBreadcrumbItem, CxsBreadcrumbSize, CxsBreadcrumbVariant, CxsButtonSize, CxsButtonVariant, CxsCardSize, CxsCardVariant, CxsCheckboxSize, CxsDatepickerSize, CxsDatepickerVariant, CxsInputSize, CxsInputType, CxsInputVariant, CxsRadioSize, CxsRadioVariant, CxsSelectSize, CxsSelectVariant, CxsThemeMode };
+export { CerxosUi, CxsAccordionComponent, CxsAccordionItemComponent, CxsAlertComponent, CxsAvatarComponent, CxsBadgeComponent, CxsBreadcrumbComponent, CxsButtonComponent, CxsCardComponent, CxsCarouselComponent, CxsCheckboxComponent, CxsDataTableCellDirective, CxsDataTableComponent, CxsDatepickerComponent, CxsDialogComponent, CxsInputComponent, CxsMenubarComponent, CxsRadioComponent, CxsSelectComponent, CxsTableComponent, CxsThemeDirective, CxsToastComponent, CxsToggleComponent, CxsTooltipComponent };
+export type { CxsAccordionItemSize, CxsAccordionSpacing, CxsAlertVariant, CxsAvatarShape, CxsAvatarSize, CxsBadgeSize, CxsBadgeVariant, CxsBreadcrumbItem, CxsBreadcrumbSize, CxsBreadcrumbVariant, CxsButtonSize, CxsButtonVariant, CxsCardSize, CxsCardVariant, CxsCarouselItem, CxsCheckboxSize, CxsDataTableAlign, CxsDataTableCellContext, CxsDataTableColumn, CxsDataTableFilterType, CxsDataTablePin, CxsDataTableSort, CxsDataTableSortDirection, CxsDatepickerSize, CxsDatepickerVariant, CxsDialogCloseReason, CxsDialogSize, CxsInputSize, CxsInputType, CxsInputVariant, CxsMenubarItem, CxsMenubarSize, CxsMenubarVariant, CxsRadioSize, CxsRadioVariant, CxsSelectSize, CxsSelectVariant, CxsTableAlign, CxsTableColumn, CxsThemeMode, CxsToastCloseReason, CxsToastMaxWidth, CxsToastPosition, CxsToastVariant, CxsToggleSize, CxsTooltipPosition };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cerxos-ui",
-  "version": "0.0.3",
+  "version": "0.0.5",
   "peerDependencies": {
     "@angular/common": "^20.3.0",
     "@angular/core": "^20.3.0"

package/styles/tailwind.css

@@ -1,3 +1,3 @@
-@import "../tokens/theme-default.css";
-@import "../tokens/theme-dark.css";
-@import "tailwindcss";
+@import "../tokens/theme-default.css";
+@import "../tokens/theme-dark.css";
+@import "tailwindcss";

package/tokens/theme-dark.css

@@ -1,16 +1,16 @@
-.cxs-theme-dark {
-  color-scheme: dark;
-  --cxs-color-primary: #22c55e;
-  --cxs-color-primary-hover: #16a34a;
-  --cxs-color-primary-ghost: rgba(34, 197, 94, 0.16);
-  --cxs-color-on-primary: #0b0f0e;
-  --cxs-color-surface: #0b0f0e;
-  --cxs-color-surface-hover: #111827;
-  --cxs-color-on-surface: #e2e8f0;
-  --cxs-color-on-surface-muted: #94a3b8;
-  --cxs-color-border: #1f2937;
-  --cxs-color-danger: #f87171;
-  --cxs-color-focus: #f59e0b;
-  --cxs-radius-md: 8px;
-  --cxs-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.5);
-}
+.cxs-theme-dark {
+  color-scheme: dark;
+  --cxs-color-primary: #22c55e;
+  --cxs-color-primary-hover: #16a34a;
+  --cxs-color-primary-ghost: rgba(34, 197, 94, 0.16);
+  --cxs-color-on-primary: #0b0f0e;
+  --cxs-color-surface: #0b0f0e;
+  --cxs-color-surface-hover: #111827;
+  --cxs-color-on-surface: #e2e8f0;
+  --cxs-color-on-surface-muted: #94a3b8;
+  --cxs-color-border: #1f2937;
+  --cxs-color-danger: #f87171;
+  --cxs-color-focus: #f59e0b;
+  --cxs-radius-md: 8px;
+  --cxs-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.5);
+}

package/tokens/theme-default.css

@@ -1,15 +1,15 @@
-:root {
-  --cxs-color-primary: #1f7a4a;
-  --cxs-color-primary-hover: #17613a;
-  --cxs-color-primary-ghost: rgba(31, 122, 74, 0.12);
-  --cxs-color-on-primary: #ffffff;
-  --cxs-color-surface: #ffffff;
-  --cxs-color-surface-hover: #f6f8fa;
-  --cxs-color-on-surface: #0f172a;
-  --cxs-color-on-surface-muted: #64748b;
-  --cxs-color-border: #d0d7de;
-  --cxs-color-danger: #dc2626;
-  --cxs-color-focus: #f59e0b;
-  --cxs-radius-md: 8px;
-  --cxs-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.16);
-}
+:root {
+  --cxs-color-primary: #1f7a4a;
+  --cxs-color-primary-hover: #17613a;
+  --cxs-color-primary-ghost: rgba(31, 122, 74, 0.12);
+  --cxs-color-on-primary: #ffffff;
+  --cxs-color-surface: #ffffff;
+  --cxs-color-surface-hover: #f6f8fa;
+  --cxs-color-on-surface: #0f172a;
+  --cxs-color-on-surface-muted: #64748b;
+  --cxs-color-border: #d0d7de;
+  --cxs-color-danger: #dc2626;
+  --cxs-color-focus: #f59e0b;
+  --cxs-radius-md: 8px;
+  --cxs-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.16);
+}