cerxos-ui 0.0.2 → 0.0.4

package/index.d.ts

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { EventEmitter } from '@angular/core';
+import { EventEmitter, OnChanges, AfterViewInit, OnDestroy, SimpleChanges, ElementRef, Renderer2 } from '@angular/core';
 import { ControlValueAccessor } from '@angular/forms';
 
 declare class CerxosUi {
@@ -7,18 +7,474 @@ declare class CerxosUi {
     static ɵcmp: i0.ɵɵComponentDeclaration<CerxosUi, "cxs-cerxos-ui", never, {}, {}, never, never, true, never>;
 }
 
+type CxsAlertVariant = 'info' | 'neutral' | 'danger';
+declare class CxsAlertComponent {
+    variant: CxsAlertVariant;
+    title?: string;
+    dismissible: boolean;
+    closed: EventEmitter<void>;
+    isVisible: boolean;
+    get alertClass(): string;
+    get titleClass(): string;
+    get closeButtonClass(): string;
+    onClose(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CxsAlertComponent, never>;
+    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 {
+    variant: CxsBadgeVariant;
+    size: CxsBadgeSize;
+    get badgeClass(): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CxsBadgeComponent, never>;
+    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 {
+    label: string;
+    href?: string;
+    target?: string;
+    rel?: string;
+    ariaLabel?: string;
+    disabled?: boolean;
+}
+declare class CxsBreadcrumbComponent {
+    items: CxsBreadcrumbItem[];
+    separator: string;
+    ariaLabel: string;
+    size: CxsBreadcrumbSize;
+    variant: CxsBreadcrumbVariant;
+    disabled: boolean;
+    get listClass(): string;
+    get itemClass(): string;
+    get separatorClass(): string;
+    isLink(item: CxsBreadcrumbItem, isLast: boolean): boolean;
+    getLinkClass(item: CxsBreadcrumbItem): string;
+    getLabelClass(item: CxsBreadcrumbItem, isLast: boolean): string;
+    getItemRel(item: CxsBreadcrumbItem): string | null;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CxsBreadcrumbComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CxsBreadcrumbComponent, "cxs-breadcrumb", never, { "items": { "alias": "items"; "required": false; }; "separator": { "alias": "separator"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "size": { "alias": "size"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, {}, never, never, true, never>;
+}
+
 type CxsButtonVariant = 'primary' | 'secondary' | 'ghost';
 type CxsButtonSize = 'sm' | 'md' | 'lg';
 declare class CxsButtonComponent {
+    private readonly hostClass;
     variant: CxsButtonVariant;
     size: CxsButtonSize;
     disabled: boolean;
     loading: boolean;
     type: 'button' | 'submit' | 'reset';
+    constructor(hostClass: string | null);
     get isDisabled(): boolean;
     get buttonClass(): string;
-    static ɵfac: i0.ɵɵFactoryDeclaration<CxsButtonComponent, 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, ["*"], true, never>;
+    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, ["[cxsButtonIcon]", "*"], true, never>;
+}
+
+type CxsCardVariant = 'surface' | 'muted' | 'outline';
+type CxsCardSize = 'sm' | 'md' | 'lg';
+declare class CxsCardComponent {
+    variant: CxsCardVariant;
+    size: CxsCardSize;
+    elevated: boolean;
+    ariaLabel?: string;
+    ariaLabelledby?: string;
+    get cardClass(): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CxsCardComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CxsCardComponent, "cxs-card", never, { "variant": { "alias": "variant"; "required": false; }; "size": { "alias": "size"; "required": false; }; "elevated": { "alias": "elevated"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "ariaLabelledby": { "alias": "ariaLabelledby"; "required": false; }; }, {}, never, ["*"], true, never>;
+}
+
+type CxsCheckboxSize = 'sm' | 'md' | 'lg';
+declare class CxsCheckboxComponent implements ControlValueAccessor {
+    checked: boolean;
+    indeterminate: boolean;
+    disabled: boolean;
+    label?: string;
+    size: CxsCheckboxSize;
+    id?: string;
+    name?: string;
+    required: boolean;
+    autofocus: boolean;
+    ariaLabel?: string;
+    ariaDescribedby?: string;
+    valueChange: EventEmitter<boolean>;
+    private disabledFromControl;
+    private onChange;
+    private onTouched;
+    get isDisabled(): boolean;
+    get wrapperClass(): string;
+    get labelClass(): string;
+    get controlClass(): string;
+    get ariaChecked(): 'mixed' | null;
+    writeValue(value: boolean | null): void;
+    registerOnChange(fn: (value: boolean) => void): void;
+    registerOnTouched(fn: () => void): void;
+    setDisabledState(isDisabled: boolean): void;
+    onCheckboxChange(event: Event): void;
+    onBlur(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CxsCheckboxComponent, never>;
+    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>>;
+    }>;
+    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;
+    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"; }, 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 = {
+    date: Date;
+    label: string;
+    inMonth: boolean;
+    disabled: boolean;
+    isToday: boolean;
+    key: string;
+};
+declare class CxsDatepickerComponent implements ControlValueAccessor {
+    value: string;
+    variant: CxsDatepickerVariant;
+    size: CxsDatepickerSize;
+    useNative: boolean;
+    disabled: boolean;
+    readonly: boolean;
+    required: boolean;
+    invalid: boolean;
+    autofocus: boolean;
+    id?: string;
+    name?: string;
+    min?: string;
+    max?: string;
+    placeholder?: string;
+    ariaLabel?: string;
+    ariaDescribedby?: string;
+    valueChange: EventEmitter<string>;
+    private static nextId;
+    private readonly fallbackId;
+    private disabledFromControl;
+    private onChange;
+    private onTouched;
+    isOpen: boolean;
+    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;
+    setDisabledState(isDisabled: boolean): void;
+    onInput(event: Event): void;
+    onDateSelect(day: CxsCalendarDay): void;
+    onBlur(): void;
+    open(): void;
+    toggle(): void;
+    prevMonth(): void;
+    nextMonth(): void;
+    onMonthChange(event: Event): void;
+    onYearChange(event: Event): void;
+    dayButtonClass(day: CxsCalendarDay): string;
+    onDocumentClick(event: MouseEvent): void;
+    onEscape(): void;
+    private syncDisplayMonthWithValue;
+    private updateCalendar;
+    private isSelected;
+    private parseDate;
+    private formatDate;
+    private stripTime;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CxsDatepickerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CxsDatepickerComponent, "cxs-datepicker", never, { "value": { "alias": "value"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "size": { "alias": "size"; "required": false; }; "useNative": { "alias": "useNative"; "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; }; "min": { "alias": "min"; "required": false; }; "max": { "alias": "max"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "ariaDescribedby": { "alias": "ariaDescribedby"; "required": false; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
 }
 
 type CxsInputVariant = 'outline' | 'filled';
@@ -58,6 +514,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 {
@@ -124,5 +613,138 @@ 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>;
 }
 
-export { CerxosUi, CxsButtonComponent, CxsInputComponent, CxsRadioComponent, CxsSelectComponent };
-export type { CxsButtonSize, CxsButtonVariant, CxsInputSize, CxsInputType, CxsInputVariant, CxsRadioSize, CxsRadioVariant, CxsSelectSize, CxsSelectVariant };
+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;
+    private readonly renderer;
+    private mode;
+    private darkClass;
+    private mediaQuery;
+    private mediaListener;
+    constructor(host: ElementRef<HTMLElement>, renderer: Renderer2);
+    set cxsTheme(value: CxsThemeMode | null | undefined);
+    set cxsThemeDarkClass(value: string | null | undefined);
+    ngOnDestroy(): void;
+    private applyTheme;
+    private prefersDark;
+    private attachMediaListener;
+    private detachMediaListener;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CxsThemeDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CxsThemeDirective, "[cxsTheme]", never, { "cxsTheme": { "alias": "cxsTheme"; "required": false; }; "cxsThemeDarkClass": { "alias": "cxsThemeDarkClass"; "required": false; }; }, {}, never, never, true, never>;
+}
+
+export { CerxosUi, CxsAccordionComponent, CxsAccordionItemComponent, CxsAlertComponent, CxsAvatarComponent, CxsBadgeComponent, CxsBreadcrumbComponent, CxsButtonComponent, CxsCardComponent, CxsCarouselComponent, CxsCheckboxComponent, 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, 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 };