@coreui/angular-pro 4.7.11 → 5.0.0-alpha.10

package/lib/progress/progress-bar.directive.d.ts

@@ -0,0 +1,58 @@
+import { Colors } from '../coreui.types';
+import { IProgressBar } from './progress.type';
+import * as i0 from "@angular/core";
+export declare class ProgressBarDirective implements IProgressBar {
+    #private;
+    constructor();
+    readonly percent: import("@angular/core").Signal<number>;
+    /**
+     * Use to animate the stripes right to left via CSS3 animations.
+     * @type boolean
+     */
+    animated?: boolean;
+    /**
+     * Sets the color context of the component to one of CoreUI’s themed colors.
+     * @values 'primary', 'secondary', 'success', 'danger', 'warning', 'info', 'dark', 'light'
+     */
+    color?: Colors;
+    precision: number;
+    /**
+     * The percent value the ProgressBar.
+     * @type number
+     * @default 0
+     */
+    set value(value: number | undefined);
+    get value(): number | undefined;
+    set width(value: number | undefined);
+    /**
+     * Set the progress bar variant to optional striped.
+     * @values 'striped'
+     * @default undefined
+     */
+    variant?: 'striped';
+    /**
+     * The max value of the ProgressBar.
+     * @type number
+     * @default 100
+     */
+    set max(max: number);
+    /**
+     * Stacked ProgressBars.
+     * @type boolean
+     * @default false
+     */
+    stacked?: boolean;
+    /**
+     * Set default html role attribute.
+     * @type string
+     */
+    role: string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ProgressBarDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ProgressBarDirective, "[cProgressBar]", never, { "animated": { "alias": "animated"; "required": false; }; "color": { "alias": "color"; "required": false; }; "precision": { "alias": "precision"; "required": false; }; "value": { "alias": "value"; "required": false; }; "width": { "alias": "width"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "max": { "alias": "max"; "required": false; }; "stacked": { "alias": "stacked"; "required": false; }; "role": { "alias": "role"; "required": false; }; }, {}, never, never, true, never>;
+    static ngAcceptInputType_animated: unknown;
+    static ngAcceptInputType_precision: unknown;
+    static ngAcceptInputType_value: unknown;
+    static ngAcceptInputType_width: unknown;
+    static ngAcceptInputType_max: unknown;
+    static ngAcceptInputType_stacked: unknown;
+}

package/lib/progress/progress-stacked.component.d.ts

@@ -0,0 +1,7 @@
+import { IProgressBarStacked } from './progress.type';
+import * as i0 from "@angular/core";
+export declare class ProgressStackedComponent implements IProgressBarStacked {
+    stacked: boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ProgressStackedComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ProgressStackedComponent, "c-progress-stacked", never, { "stacked": { "alias": "stacked"; "required": false; }; }, {}, never, ["*"], true, never>;
+}

package/lib/progress/progress.component.d.ts

@@ -1,24 +1,33 @@
+import { QueryList } from '@angular/core';
+import { IProgress } from './progress.type';
+import { ProgressBarComponent } from './progress-bar.component';
+import { ProgressBarDirective } from './progress-bar.directive';
 import * as i0 from "@angular/core";
-export declare class ProgressComponent {
+import * as i1 from "./progress-bar.directive";
+export declare class ProgressComponent implements IProgress {
+    #private;
+    protected readonly pbd: ProgressBarDirective | null;
+    constructor();
+    contentProgressBars: QueryList<ProgressBarComponent>;
     /**
      * Sets the height of the component. If you set that value the inner `<CProgressBar>` will automatically resize accordingly.
      * @type number
      */
-    height: string | number;
+    height: number;
     /**
      * Displays thin progress.
      * @type boolean
      */
-    thin: string | boolean;
+    thin: boolean;
     /**
      * Change the default color to white.
      * @type boolean
      */
-    white: string | boolean;
-    get hostClasses(): any;
+    white: boolean;
+    get hostClasses(): Record<string, boolean>;
     get hostStyle(): any;
     static ɵfac: i0.ɵɵFactoryDeclaration<ProgressComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ProgressComponent, "c-progress", never, { "height": { "alias": "height"; "required": false; }; "thin": { "alias": "thin"; "required": false; }; "white": { "alias": "white"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ProgressComponent, "c-progress", never, { "height": { "alias": "height"; "required": false; }; "thin": { "alias": "thin"; "required": false; }; "white": { "alias": "white"; "required": false; }; }, {}, ["contentProgressBars"], ["*"], true, [{ directive: typeof i1.ProgressBarDirective; inputs: { "animated": "animated"; "color": "color"; "max": "max"; "role": "role"; "value": "value"; "variant": "variant"; }; outputs: {}; }]>;
     static ngAcceptInputType_height: unknown;
     static ngAcceptInputType_thin: unknown;
     static ngAcceptInputType_white: unknown;

package/lib/progress/progress.module.d.ts

@@ -1,8 +1,10 @@
 import * as i0 from "@angular/core";
 import * as i1 from "./progress.component";
 import * as i2 from "./progress-bar.component";
+import * as i3 from "./progress-bar.directive";
+import * as i4 from "./progress-stacked.component";
 export declare class ProgressModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<ProgressModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<ProgressModule, never, [typeof i1.ProgressComponent, typeof i2.ProgressBarComponent], [typeof i1.ProgressComponent, typeof i2.ProgressBarComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ProgressModule, never, [typeof i1.ProgressComponent, typeof i2.ProgressBarComponent, typeof i3.ProgressBarDirective, typeof i4.ProgressStackedComponent], [typeof i1.ProgressComponent, typeof i2.ProgressBarComponent, typeof i3.ProgressBarDirective, typeof i4.ProgressStackedComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<ProgressModule>;
 }

package/lib/progress/progress.type.d.ts

@@ -0,0 +1,18 @@
+import { Colors } from '../coreui.types';
+export interface IProgress {
+    height: number;
+    thin: boolean;
+    white: boolean;
+}
+export interface IProgressBar extends IProgressBarStacked {
+    animated?: boolean;
+    color?: Colors;
+    max?: number;
+    precision: number;
+    value?: number;
+    variant?: 'striped';
+    width?: number;
+}
+export interface IProgressBarStacked {
+    stacked?: boolean;
+}

package/lib/progress/public_api.d.ts

@@ -1,4 +1,6 @@
-export { IStackedBar } from './progress-bar';
+export { IProgress, IProgressBar, IProgressBarStacked } from './progress.type';
 export { ProgressComponent } from './progress.component';
+export { ProgressStackedComponent } from './progress-stacked.component';
 export { ProgressBarComponent } from './progress-bar.component';
+export { ProgressBarDirective } from './progress-bar.directive';
 export { ProgressModule } from './progress.module';

package/lib/services/color-mode.service.d.ts

@@ -0,0 +1,17 @@
+import { WritableSignal } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class ColorModeService {
+    #private;
+    readonly eventName: WritableSignal<string>;
+    readonly localStorageItemName: WritableSignal<string>;
+    readonly localStorageItemName$: import("rxjs").Observable<string>;
+    readonly colorMode: WritableSignal<'light' | 'dark' | 'auto'>;
+    readonly colorModeEffect: import("@angular/core").EffectRef;
+    constructor();
+    getStoredTheme(localStorageItemName: string): any;
+    setStoredTheme(localStorageItemName: string, colorMode: string): void;
+    getPreferredColorScheme(localStorageItemName: string): any;
+    setTheme(colorMode: string): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ColorModeService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<ColorModeService>;
+}

package/lib/services/in-memory-storage.service.d.ts

@@ -0,0 +1,13 @@
+import * as i0 from "@angular/core";
+export declare class InMemoryStorageService implements Storage {
+    #private;
+    constructor();
+    setItem(key: string, data: any): void;
+    getItem(key: string): any;
+    removeItem(key: string): void;
+    clear(): void;
+    get length(): number;
+    key(index: number): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<InMemoryStorageService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<InMemoryStorageService>;
+}

package/lib/services/local-storage.service.d.ts

@@ -0,0 +1,18 @@
+import * as i0 from "@angular/core";
+export declare class LocalStorageService {
+    #private;
+    private platformId;
+    private document;
+    localStorage: Storage;
+    constructor(platformId: Object, document: Document);
+    data$: import("rxjs").Observable<{
+        key: string;
+        data: any;
+    } | null>;
+    setItem(key: string, data: any): void;
+    getItem(key: string): any;
+    removeItem(key: string): void;
+    clear(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<LocalStorageService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<LocalStorageService>;
+}

package/lib/services/public_api.d.ts

@@ -1,3 +1,6 @@
 export { IntersectionService, IIntersectionObserverInit } from './intersection.service';
 export { ListenersService, IListenersConfig } from './listeners.service';
 export { ClassToggleService } from './class-toggle.service';
+export { LocalStorageService } from './local-storage.service';
+export { InMemoryStorageService } from './in-memory-storage.service';
+export { ColorModeService } from './color-mode.service';

package/lib/shared/public_api.d.ts

@@ -1,3 +1,4 @@
 export { SharedModule } from './shared.module';
 export { HtmlAttributesDirective } from './html-attr.directive';
 export { TemplateIdDirective } from './template-id.directive';
+export { ThemeDirective } from './theme.directive';

package/lib/shared/shared.module.d.ts

@@ -2,9 +2,10 @@ import { ModuleWithProviders } from '@angular/core';
 import * as i0 from "@angular/core";
 import * as i1 from "./html-attr.directive";
 import * as i2 from "./template-id.directive";
+import * as i3 from "./theme.directive";
 export declare class SharedModule {
     static forRoot(): ModuleWithProviders<SharedModule>;
     static ɵfac: i0.ɵɵFactoryDeclaration<SharedModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<SharedModule, never, [typeof i1.HtmlAttributesDirective, typeof i2.TemplateIdDirective], [typeof i1.HtmlAttributesDirective, typeof i2.TemplateIdDirective]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<SharedModule, never, [typeof i1.HtmlAttributesDirective, typeof i2.TemplateIdDirective, typeof i3.ThemeDirective], [typeof i1.HtmlAttributesDirective, typeof i2.TemplateIdDirective, typeof i3.ThemeDirective]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<SharedModule>;
 }

package/lib/shared/theme.directive.d.ts

@@ -0,0 +1,19 @@
+import * as i0 from "@angular/core";
+export declare class ThemeDirective {
+    #private;
+    /**
+     * Add dark theme attribute.
+     * @type 'dark' | 'light' | undefined
+     */
+    set colorScheme(scheme: 'dark' | 'light' | undefined);
+    /**
+     * Add dark theme attribute.
+     * @type boolean
+     */
+    set dark(darkTheme: boolean);
+    setTheme(theme?: string): void;
+    unsetTheme(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<ThemeDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ThemeDirective, "[cTheme]", never, { "colorScheme": { "alias": "colorScheme"; "required": false; }; "dark": { "alias": "dark"; "required": false; }; }, {}, never, never, true, never>;
+    static ngAcceptInputType_dark: unknown;
+}

package/lib/sidebar/public_api.d.ts

@@ -2,7 +2,7 @@ export { SidebarComponent } from './sidebar/sidebar.component';
 export { SidebarService } from './sidebar.service';
 export { SidebarBrandComponent } from './sidebar-brand/sidebar-brand.component';
 export { SidebarToggleDirective } from './sidebar-toggle/sidebar-toggle.directive';
-export { SidebarTogglerComponent } from './sidebar-toggler/sidebar-toggler.component';
+export { SidebarTogglerDirective } from './sidebar-toggler/sidebar-toggler.directive';
 export { SidebarHeaderComponent } from './sidebar-header/sidebar-header.component';
 export { SidebarFooterComponent } from './sidebar-footer/sidebar-footer.component';
 export { SidebarNavComponent, INavData, SidebarNavHelper } from './sidebar-nav';

package/lib/sidebar/sidebar-nav/sidebar-nav.component.d.ts

@@ -18,6 +18,7 @@ export declare class SidebarNavGroupComponent implements OnInit, OnDestroy {
     item: any;
     dropdownMode: 'path' | 'none' | 'close';
     show?: boolean;
+    compact?: boolean;
     get hostClasses(): any;
     sidebarNav: ElementRef;
     navigationEndObservable: Observable<NavigationEnd>;
@@ -34,7 +35,8 @@ export declare class SidebarNavGroupComponent implements OnInit, OnDestroy {
     onAnimationStart($event: AnimationEvent): void;
     onAnimationDone($event: AnimationEvent): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<SidebarNavGroupComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SidebarNavGroupComponent, "c-sidebar-nav-group", never, { "item": { "alias": "item"; "required": false; }; "dropdownMode": { "alias": "dropdownMode"; "required": false; }; "show": { "alias": "show"; "required": false; }; }, {}, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SidebarNavGroupComponent, "c-sidebar-nav-group", never, { "item": { "alias": "item"; "required": false; }; "dropdownMode": { "alias": "dropdownMode"; "required": false; }; "show": { "alias": "show"; "required": false; }; "compact": { "alias": "compact"; "required": false; }; }, {}, never, never, true, never>;
+    static ngAcceptInputType_compact: unknown;
 }
 export declare class SidebarNavComponent implements OnChanges {
     sidebar: SidebarComponent;
@@ -49,11 +51,12 @@ export declare class SidebarNavComponent implements OnChanges {
     groupItems?: boolean;
     compact?: boolean;
     get hostClasses(): any;
-    get sidebarNavGroupItemsClass(): boolean;
     role: string;
     navItemsArray: INavData[];
     ngOnChanges(changes: SimpleChanges): void;
     hideMobile(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<SidebarNavComponent, [{ optional: true; }, null, null, null, null, null]>;
     static ɵcmp: i0.ɵɵComponentDeclaration<SidebarNavComponent, "c-sidebar-nav", never, { "navItems": { "alias": "navItems"; "required": false; }; "dropdownMode": { "alias": "dropdownMode"; "required": false; }; "groupItems": { "alias": "groupItems"; "required": false; }; "compact": { "alias": "compact"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ngAcceptInputType_groupItems: unknown;
+    static ngAcceptInputType_compact: unknown;
 }

package/lib/sidebar/sidebar-toggler/sidebar-toggler.directive.d.ts

@@ -0,0 +1,9 @@
+import * as i0 from "@angular/core";
+import * as i1 from "../sidebar-toggle/sidebar-toggle.directive";
+export declare class SidebarTogglerDirective {
+    role: string;
+    sidebarTogglerClass: boolean;
+    get getStyles(): any;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SidebarTogglerDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<SidebarTogglerDirective, "[cSidebarToggler]", never, { "role": { "alias": "role"; "required": false; }; }, {}, never, never, true, [{ directive: typeof i1.SidebarToggleDirective; inputs: { "cSidebarToggle": "cSidebarToggler"; "toggle": "toggle"; }; outputs: {}; }]>;
+}

package/lib/sidebar/sidebar.module.d.ts

@@ -13,9 +13,9 @@ import * as i11 from "./sidebar-nav/sidebar-nav-link.component";
 import * as i12 from "./sidebar-nav/sidebar-nav-link.pipe";
 import * as i13 from "./sidebar-nav/sidebar-nav-title.component";
 import * as i14 from "./sidebar-toggle/sidebar-toggle.directive";
-import * as i15 from "./sidebar-toggler/sidebar-toggler.component";
+import * as i15 from "./sidebar-toggler/sidebar-toggler.directive";
 export declare class SidebarModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<SidebarModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<SidebarModule, never, [typeof i1.SidebarComponent, typeof i2.SidebarBrandComponent, typeof i3.SidebarFooterComponent, typeof i4.SidebarHeaderComponent, typeof i5.SidebarNavComponent, typeof i6.SidebarNavBadgePipe, typeof i7.SidebarNavDividerComponent, typeof i5.SidebarNavGroupComponent, typeof i8.SidebarNavIconPipe, typeof i9.SidebarNavItemClassPipe, typeof i10.SidebarNavLabelComponent, typeof i11.SidebarNavLinkComponent, typeof i11.SidebarNavLinkContentComponent, typeof i12.SidebarNavLinkPipe, typeof i13.SidebarNavTitleComponent, typeof i14.SidebarToggleDirective, typeof i15.SidebarTogglerComponent], [typeof i1.SidebarComponent, typeof i14.SidebarToggleDirective, typeof i15.SidebarTogglerComponent, typeof i2.SidebarBrandComponent, typeof i5.SidebarNavComponent, typeof i4.SidebarHeaderComponent, typeof i3.SidebarFooterComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<SidebarModule, never, [typeof i1.SidebarComponent, typeof i2.SidebarBrandComponent, typeof i3.SidebarFooterComponent, typeof i4.SidebarHeaderComponent, typeof i5.SidebarNavComponent, typeof i6.SidebarNavBadgePipe, typeof i7.SidebarNavDividerComponent, typeof i5.SidebarNavGroupComponent, typeof i8.SidebarNavIconPipe, typeof i9.SidebarNavItemClassPipe, typeof i10.SidebarNavLabelComponent, typeof i11.SidebarNavLinkComponent, typeof i11.SidebarNavLinkContentComponent, typeof i12.SidebarNavLinkPipe, typeof i13.SidebarNavTitleComponent, typeof i14.SidebarToggleDirective, typeof i15.SidebarTogglerDirective], [typeof i1.SidebarComponent, typeof i14.SidebarToggleDirective, typeof i15.SidebarTogglerDirective, typeof i2.SidebarBrandComponent, typeof i5.SidebarNavComponent, typeof i4.SidebarHeaderComponent, typeof i3.SidebarFooterComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<SidebarModule>;
 }

package/lib/smart-table/smart-table/smart-table.component.d.ts

@@ -1,22 +1,19 @@
-import { AfterContentInit, EventEmitter, IterableDiffers, KeyValueDiffers, OnChanges, QueryList, SimpleChanges, TemplateRef } from '@angular/core';
-import { BooleanInput, NumberInput } from '@angular/cdk/coercion';
+import { AfterContentInit, EventEmitter, IterableDiffers, KeyValueDiffers, OnChanges, QueryList, SimpleChanges, TemplateRef, WritableSignal } from '@angular/core';
 import { BehaviorSubject } from 'rxjs';
 import { ITable } from '../../table/table.type';
-import { IColumn, IColumnFilter, IColumnFilterValue, IItem, IItemInternal, ISmartTable, ISorter, ISorterValue, ITableFilter, ITableGroupProps, ItemsPerPageSelect } from '../smart-table.type';
+import { IColumn, IColumnFilter, IColumnFilterValue, IGroup, IItem, IItemInternal, ISmartTable, ISorter, ISorterValue, ITableFilter, ITableSectionProps, ItemsPerPageSelect, SortOrder } from '../smart-table.type';
 import { TemplateIdDirective } from '../../shared';
 import * as i0 from "@angular/core";
 export declare class SmartTableComponent implements ISmartTable, AfterContentInit, OnChanges {
     private iterableDiffers;
     private keyValueDiffers;
-    static ngAcceptInputType_activePage: NumberInput;
-    static ngAcceptInputType_cleaner: BooleanInput;
-    static ngAcceptInputType_clickableRows: BooleanInput;
-    static ngAcceptInputType_footer: BooleanInput;
-    static ngAcceptInputType_header: BooleanInput;
-    static ngAcceptInputType_itemsPerPage: NumberInput;
-    static ngAcceptInputType_pagination: BooleanInput;
-    static ngAcceptInputType_selectable: BooleanInput;
     constructor(iterableDiffers: IterableDiffers, keyValueDiffers: KeyValueDiffers);
+    readonly getColumnKey: (column: string | IColumn) => string;
+    readonly getTableDataCellClass: (column: IColumn, item: IItem) => {
+        [x: string]: boolean;
+    };
+    readonly getTableDataCellProps: (column: IColumn, item: IItem) => {};
+    readonly getTableDataCellStyles: (column: IColumn, item: IItem) => Partial<CSSStyleDeclaration>;
     readonly selectedAllSubject: BehaviorSubject<boolean | "indeterminate">;
     private readonly itemsDiffer;
     private readonly itemsFilteredDiffer;
@@ -25,28 +22,23 @@ export declare class SmartTableComponent implements ISmartTable, AfterContentIni
     set activePage(value: number);
     get activePage(): number;
     private _activePage;
-    set cleaner(value: boolean);
-    get cleaner(): boolean;
-    private _cleaner;
-    set clickableRows(value: boolean);
-    get clickableRows(): boolean;
-    private _clickableRows;
-    set columns(value: (string | IColumn)[]);
-    get columns(): (string | IColumn)[];
-    private _columns?;
+    cleaner: boolean;
+    clickableRows: boolean;
+    set columns(value: (string | IColumn | IGroup)[]);
+    get columns(): IColumn[];
+    columns$: WritableSignal<IColumn[]>;
+    columnGroups$: WritableSignal<IGroup[][]>;
+    showGroups$: import("@angular/core").Signal<boolean>;
     columnFilter?: boolean | IColumnFilter;
     set columnFilterValue(value: IColumnFilterValue);
     get columnFilterValue(): IColumnFilterValue;
     private _columnFilterValue;
     columnSorter?: boolean | ISorter;
-    set footer(value: boolean);
-    get footer(): boolean;
-    private _footer;
-    set header(value: boolean);
-    get header(): boolean;
-    private _header;
+    footer: boolean;
+    header: boolean;
     set items(value: IItem[]);
     get items(): IItem[];
+    items$: WritableSignal<IItemInternal[]>;
     private _items;
     set itemsPerPage(value: number);
     get itemsPerPage(): number;
@@ -56,15 +48,11 @@ export declare class SmartTableComponent implements ISmartTable, AfterContentIni
     itemsPerPageSelect?: boolean | ItemsPerPageSelect;
     loading?: boolean;
     noItemsLabel: string | TemplateRef<any>;
-    set pagination(value: boolean);
-    get pagination(): boolean;
-    private _pagination;
+    pagination: boolean;
     set selectable(value: boolean);
     get selectable(): boolean;
     private _selectable;
-    set selectAll(value: boolean);
-    get selectAll(): boolean;
-    private _selectAll;
+    selectAll: boolean;
     set sorterValue(value: ISorterValue);
     get sorterValue(): ISorterValue;
     private _sorterValue;
@@ -76,9 +64,9 @@ export declare class SmartTableComponent implements ISmartTable, AfterContentIni
     set tableFilterValue(value: string);
     get tableFilterValue(): string;
     private _tableFilterValue;
-    tableBodyProps?: ITableGroupProps;
-    tableFootProps?: ITableGroupProps;
-    tableHeadProps?: ITableGroupProps;
+    tableBodyProps?: ITableSectionProps;
+    tableFootProps?: ITableSectionProps;
+    tableHeadProps?: ITableSectionProps;
     tableProps?: ITable;
     readonly selectedItemsChange: EventEmitter<IItem[]>;
     readonly sorterValueChange: EventEmitter<ISorterValue>;
@@ -108,9 +96,8 @@ export declare class SmartTableComponent implements ISmartTable, AfterContentIni
     get firstItemOnActivePageIndex(): number;
     get itemsOnActivePage(): IItemInternal[];
     get currentItems(): IItemInternal[];
-    get genCols(): string[];
-    get rawColumnNames(): string[];
-    get itemsDataColumns(): string[];
+    rawColumnNames$: import("@angular/core").Signal<string[]>;
+    itemsDataColumns$: import("@angular/core").Signal<string[]>;
     get sortedItems(): IItemInternal[];
     get tableFilterEvent(): 'change' | 'input';
     private _columnFiltered;
@@ -121,9 +108,10 @@ export declare class SmartTableComponent implements ISmartTable, AfterContentIni
     handleSortChange($event: {
         columnKey: string;
         index: number;
+        order?: SortOrder;
     }): void;
     isSortable(i: number): boolean | undefined;
-    handleSorterChange(column: string, index: number): void;
+    handleSorterChange(column: string, index: number, order?: SortOrder): void;
     setActivePage($event: number): void;
     handleColumnFilterChange($event: any): void;
     handleTableFilterChange($event: {
@@ -134,18 +122,6 @@ export declare class SmartTableComponent implements ISmartTable, AfterContentIni
     handleItemsPerPageChange(value: number): void;
     handleRowChecked($event: Event, item: IItemInternal): void;
     handleSelectAllChange($event: any): void;
-    tableDataCellProps(item: IItem, colName: string): {
-        active?: boolean | undefined;
-        align?: "top" | "middle" | "bottom" | undefined;
-        color?: string | undefined;
-        _attributes?: {
-            [key: string]: any;
-        } | undefined;
-    } | undefined;
-    tableDataCellClasses(item: IItem, colName: string): string | string[] | Set<string> | {
-        [klass: string]: any;
-    } | undefined;
-    getColumnName($event: MouseEvent): string;
     handleRowClick(param: {
         $event: MouseEvent;
         item: IItemInternal;
@@ -154,4 +130,13 @@ export declare class SmartTableComponent implements ISmartTable, AfterContentIni
     ngOnChanges(changes: SimpleChanges): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<SmartTableComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<SmartTableComponent, "c-smart-table", ["cSmartTable"], { "activePage": { "alias": "activePage"; "required": false; }; "cleaner": { "alias": "cleaner"; "required": false; }; "clickableRows": { "alias": "clickableRows"; "required": false; }; "columns": { "alias": "columns"; "required": false; }; "columnFilter": { "alias": "columnFilter"; "required": false; }; "columnFilterValue": { "alias": "columnFilterValue"; "required": false; }; "columnSorter": { "alias": "columnSorter"; "required": false; }; "footer": { "alias": "footer"; "required": false; }; "header": { "alias": "header"; "required": false; }; "items": { "alias": "items"; "required": false; }; "itemsPerPage": { "alias": "itemsPerPage"; "required": false; }; "itemsPerPageLabel": { "alias": "itemsPerPageLabel"; "required": false; }; "itemsPerPageOptions": { "alias": "itemsPerPageOptions"; "required": false; }; "itemsPerPageSelect": { "alias": "itemsPerPageSelect"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; "noItemsLabel": { "alias": "noItemsLabel"; "required": false; }; "pagination": { "alias": "pagination"; "required": false; }; "selectable": { "alias": "selectable"; "required": false; }; "selectAll": { "alias": "selectAll"; "required": false; }; "sorterValue": { "alias": "sorterValue"; "required": false; }; "tableFilter": { "alias": "tableFilter"; "required": false; }; "tableFilterLabel": { "alias": "tableFilterLabel"; "required": false; }; "tableFilterPlaceholder": { "alias": "tableFilterPlaceholder"; "required": false; }; "tableFilterValue": { "alias": "tableFilterValue"; "required": false; }; "tableBodyProps": { "alias": "tableBodyProps"; "required": false; }; "tableFootProps": { "alias": "tableFootProps"; "required": false; }; "tableHeadProps": { "alias": "tableHeadProps"; "required": false; }; "tableProps": { "alias": "tableProps"; "required": false; }; }, { "selectedItemsChange": "selectedItemsChange"; "sorterValueChange": "sorterValueChange"; "activePageChange": "activePageChange"; "itemsPerPageChange": "itemsPerPageChange"; "rowClick": "rowClick"; "columnFilterValueChange": "columnFilterValueChange"; "filteredItemsChange": "filteredItemsChange"; "tableFilterValueChange": "tableFilterValueChange"; }, ["columnTemplates"], ["[customHeader]"], true, never>;
+    static ngAcceptInputType_activePage: unknown;
+    static ngAcceptInputType_cleaner: unknown;
+    static ngAcceptInputType_clickableRows: unknown;
+    static ngAcceptInputType_footer: unknown;
+    static ngAcceptInputType_header: unknown;
+    static ngAcceptInputType_itemsPerPage: unknown;
+    static ngAcceptInputType_pagination: unknown;
+    static ngAcceptInputType_selectable: unknown;
+    static ngAcceptInputType_selectAll: unknown;
 }

package/lib/smart-table/smart-table-head/smart-table-column-label.pipe.d.ts

@@ -3,7 +3,6 @@ import { IColumn } from '../smart-table.type';
 import * as i0 from "@angular/core";
 export declare class SmartTableColumnLabelPipe implements PipeTransform {
     transform(column: IColumn | string, ...args: unknown[]): unknown;
-    prettifyName(name: string): string;
     static ɵfac: i0.ɵɵFactoryDeclaration<SmartTableColumnLabelPipe, never>;
     static ɵpipe: i0.ɵɵPipeDeclaration<SmartTableColumnLabelPipe, "columnLabel", true>;
 }

package/lib/smart-table/smart-table-head/smart-table-head.component.d.ts

@@ -1,21 +1,31 @@
-import { EventEmitter, OnInit, TemplateRef } from '@angular/core';
+import { EventEmitter, OnInit, TemplateRef, WritableSignal } from '@angular/core';
 import { BehaviorSubject } from 'rxjs';
-import { IColumn, IColumnFilter, IColumnFilterValue, ISorter, ISorterValue } from '../smart-table.type';
+import { IColumn, IColumnFilter, IColumnFilterValue, IGroup, ISorter, ISorterValue, SortOrder } from '../smart-table.type';
 import { Colors } from '../../coreui.types';
 import * as i0 from "@angular/core";
 export declare class SmartTableHeadComponent implements OnInit {
     #private;
     constructor();
+    protected readonly getTableHeaderCellStyles: (column: IColumn, columnSorter: boolean | ISorter | undefined) => Partial<CSSStyleDeclaration>;
+    protected readonly getTableHeaderCellProps: (column: string | IColumn) => {
+        [key: string]: any;
+    };
+    protected readonly getTableHeaderCellClass: (column: IColumn) => {
+        [x: string]: boolean;
+    };
     columnFilter?: boolean | IColumnFilter;
     columnFilterState: IColumnFilterValue;
     columnSorter?: boolean | ISorter;
     component?: string;
-    columns?: (IColumn | string)[];
+    set columns(value: (IColumn | IGroup)[] | undefined);
+    get columns(): (IColumn | IGroup)[] | undefined;
+    set columnGroups(value: IGroup[][]);
+    columnGroups$: WritableSignal<IGroup[][]>;
     selectable?: boolean;
-    set selectAll(value: boolean);
-    get selectAll(): boolean;
+    selectAll: boolean;
     set selectedAll(value: boolean | 'indeterminate');
     get selectedAll(): boolean | 'indeterminate';
+    showGroups: boolean;
     sorterValue?: ISorterValue;
     set columnFilterTemplates(value: any);
     get columnFilterTemplates(): any;
@@ -32,14 +42,11 @@ export declare class SmartTableHeadComponent implements OnInit {
         tfoot: boolean;
     };
     ngOnInit(): void;
-    tableHeaderCellProps(column: IColumn | string): {
-        [key: string]: any;
-    };
     tableHeaderCellColor(column: IColumn | string): Colors;
-    tableHeaderCellStyles(column: IColumn | string): any;
     columnKey(column: IColumn | string): string;
     getColumnSorterState(column: IColumn | string): string | number;
-    handleSortClick(column: IColumn | string, i: number): void;
+    handleSortClick(column: IColumn | string, i: number, order?: SortOrder): void;
+    handleSortKeyDown($event: KeyboardEvent, column: IColumn | string, i: number): void;
     columnFilterEnabled(column: IColumn | string): boolean | ((column: import("../smart-table.type").IItem, value: string) => boolean);
     columnSorterEnabled(column: IColumn | string): boolean | ((a: import("../smart-table.type").IItem, b: import("../smart-table.type").IItem) => number);
     handleColumnFilterValueChange($event: {
@@ -51,6 +58,9 @@ export declare class SmartTableHeadComponent implements OnInit {
     getColumnFilter(column: IColumn | string): string;
     getColumnLabel(column: IColumn | string): string;
     get columnFilterEvent(): 'change' | 'input';
+    getAriaSort(column: IColumn | string): "ascending" | "descending" | null;
     static ɵfac: i0.ɵɵFactoryDeclaration<SmartTableHeadComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SmartTableHeadComponent, "c-smart-table-head", never, { "columnFilter": { "alias": "columnFilter"; "required": false; }; "columnFilterState": { "alias": "columnFilterState"; "required": false; }; "columnSorter": { "alias": "columnSorter"; "required": false; }; "component": { "alias": "component"; "required": false; }; "columns": { "alias": "columns"; "required": false; }; "selectable": { "alias": "selectable"; "required": false; }; "selectAll": { "alias": "selectAll"; "required": false; }; "selectedAll": { "alias": "selectedAll"; "required": false; }; "sorterValue": { "alias": "sorterValue"; "required": false; }; "columnFilterTemplates": { "alias": "columnFilterTemplates"; "required": false; }; "columnLabelTemplates": { "alias": "columnLabelTemplates"; "required": false; }; "summaryRowTemplate": { "alias": "summaryRowTemplate"; "required": false; }; }, { "columnFilterStateChange": "columnFilterStateChange"; "sorterStateChange": "sorterStateChange"; "selectAllChange": "selectAllChange"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SmartTableHeadComponent, "c-smart-table-head", never, { "columnFilter": { "alias": "columnFilter"; "required": false; }; "columnFilterState": { "alias": "columnFilterState"; "required": false; }; "columnSorter": { "alias": "columnSorter"; "required": false; }; "component": { "alias": "component"; "required": false; }; "columns": { "alias": "columns"; "required": false; }; "columnGroups": { "alias": "columnGroups"; "required": false; }; "selectable": { "alias": "selectable"; "required": false; }; "selectAll": { "alias": "selectAll"; "required": false; }; "selectedAll": { "alias": "selectedAll"; "required": false; }; "showGroups": { "alias": "showGroups"; "required": false; }; "sorterValue": { "alias": "sorterValue"; "required": false; }; "columnFilterTemplates": { "alias": "columnFilterTemplates"; "required": false; }; "columnLabelTemplates": { "alias": "columnLabelTemplates"; "required": false; }; "summaryRowTemplate": { "alias": "summaryRowTemplate"; "required": false; }; }, { "columnFilterStateChange": "columnFilterStateChange"; "sorterStateChange": "sorterStateChange"; "selectAllChange": "selectAllChange"; }, never, never, true, never>;
+    static ngAcceptInputType_selectAll: unknown;
+    static ngAcceptInputType_showGroups: unknown;
 }