@sd-angular/core 19.0.0-beta.99 → 19.0.4

package/components/query-builder/src/query-builder.model.d.ts

@@ -0,0 +1,118 @@
+import { Operator } from '@sdcorejs/utils/models';
+/** Field kinds the builder understands. Drives the operator set + value editor. */
+export type SdQueryBuilderFieldType = 'string' | 'number' | 'boolean' | 'date' | 'datetime' | 'values';
+/** One option for a `values`-type field (enum / lookup). */
+export interface SdQueryBuilderFieldOption {
+    /** Stored value (sent inside the `Filter`). */
+    value: any;
+    /** Human-readable label shown in the select + view-mode string. */
+    display: string;
+}
+/**
+ * One filterable field. `key` matches `Filter.field` (dot-notation allowed);
+ * `label` is what the view-mode raw string renders (field token = label).
+ */
+export interface SdQueryBuilderField {
+    /** Dot-notation field path — written to `Filter.field`. */
+    key: string;
+    /** Human label — shown in the field picker AND as the view-mode field token. */
+    label: string;
+    /** Field type — picks the default operator set + value editor control. */
+    type: SdQueryBuilderFieldType;
+    /** Override the allowed operator set (otherwise `QB_OPERATORS_BY_TYPE[type]`). */
+    operators?: Operator[];
+    /** Override the starting operator (otherwise `QB_DEFAULT_OPERATOR_BY_TYPE[type]`). */
+    defaultOperator?: Operator;
+    /** Options for `type: 'values'` — the select list + display-label lookup. */
+    values?: SdQueryBuilderFieldOption[];
+    /** Label for the `true` branch of a boolean field (default `'Có'`). */
+    trueLabel?: string;
+    /** Label for the `false` branch of a boolean field (default `'Không'`). */
+    falseLabel?: string;
+    /** Lower bound for number / date value editors. */
+    min?: number | string;
+    /** Upper bound for number / date value editors. */
+    max?: number | string;
+}
+export type QbNode = QbGroup | QbRule;
+/** A logical group of nodes joined by AND / OR. Maps to `FilterAndOr`. */
+export interface QbGroup {
+    id: string;
+    kind: 'group';
+    logic: 'AND' | 'OR';
+    children: QbNode[];
+    /** UI-only: whether this group's "+" dropdown is open. */
+    open?: boolean;
+}
+/** A single `field operator value` condition. Maps to a leaf `Filter`. */
+export interface QbRule {
+    id: string;
+    kind: 'rule';
+    field?: string;
+    operator?: Operator;
+    /** Single value, `{ from, to }` for BETWEEN, or an array for IN / NOT_IN. */
+    value?: any;
+}
+/** Type guard — narrows a `QbNode` to a `QbGroup`. */
+export declare function isQbGroup(node: QbNode): node is QbGroup;
+export type QbTokenKind = 'field' | 'op' | 'value' | 'logic' | 'paren' | 'plain';
+/** One piece of the rendered raw query string, tagged for highlight styling. */
+export interface QbToken {
+    text: string;
+    kind: QbTokenKind;
+}
+/** Allowed operators per field type — used when `field.operators` is not set. */
+export declare const QB_OPERATORS_BY_TYPE: Record<SdQueryBuilderFieldType, Operator[]>;
+/** Default operator when a rule is first created for a field. */
+export declare const QB_DEFAULT_OPERATOR_BY_TYPE: Record<SdQueryBuilderFieldType, Operator>;
+/** Operators with no value payload — the value editor is hidden for these. */
+export declare const QB_NO_DATA_OPERATORS: Operator[];
+/** Operators whose value is an array — the value editor offers multi-select. */
+export declare const QB_MULTI_OPERATORS: Operator[];
+/** Operators allowed for `field` — explicit override wins, else the per-type set. */
+export declare function qbAllowedOperators(field: SdQueryBuilderField | undefined): Operator[];
+/** Starting operator for a new rule on `field` — falls back to the per-type default. */
+export declare function qbDefaultOperator(field: SdQueryBuilderField | undefined): Operator | undefined;
+/** True when `op` is NULL / NOT_NULL (no value editor). */
+export declare function qbIsNoDataOperator(op: Operator | undefined): boolean;
+/** True when `op` is IN / NOT_IN (array value). */
+export declare function qbIsMultiOperator(op: Operator | undefined): boolean;
+/** Next stable node id with the given prefix. */
+export declare function qbId(prefix?: string): string;
+/** Build a fresh rule node (optionally pre-filled). */
+export declare function qbNewRule(field?: string, operator?: Operator, value?: any): QbRule;
+/** Build a fresh group node. */
+export declare function qbNewGroup(logic?: 'AND' | 'OR', children?: QbNode[]): QbGroup;
+/** Offset unit for a relative date. */
+export type SdQbRelativeUnit = 'day' | 'week' | 'month';
+/** Offset direction for a relative date. */
+export type SdQbRelativeDirection = 'previous' | 'next';
+/** A relative (resolved-at-query-time) date value stored in `Filter.data`. */
+export interface SdQbRelativeDate {
+    /** `'now'` = current moment / today · `'offset'` = now ± amount × unit. */
+    rel: 'now' | 'offset';
+    /** Offset unit — only for `rel: 'offset'`. */
+    unit?: SdQbRelativeUnit;
+    /** Offset magnitude (>= 1) — only for `rel: 'offset'`. */
+    amount?: number;
+    /** Offset direction — only for `rel: 'offset'`. */
+    direction?: SdQbRelativeDirection;
+}
+/** Date value editor mode for a date/datetime rule (derived from the rule value). */
+export type QbDateMode = 'absolute' | 'now' | 'relative';
+/** Type guard — narrows an arbitrary value to a relative-date spec. */
+export declare function qbIsRelativeDate(v: any): v is SdQbRelativeDate;
+/** Starting relative value when a rule first switches to "relative" mode. */
+export declare function qbDefaultRelative(): SdQbRelativeDate;
+/** Stable option list for the date-mode select (module ref — never reallocated). */
+export declare const QB_DATE_MODES: ReadonlyArray<{
+    value: QbDateMode;
+    display: string;
+}>;
+/** Stable combined direction×unit option list (token `'unit:direction'`). */
+export declare const QB_RELATIVE_UNIT_OPTIONS: ReadonlyArray<{
+    value: string;
+    display: string;
+}>;
+/** Shared empty option array — stable ref for fallbacks (avoids per-call allocation). */
+export declare const QB_EMPTY_OPTIONS: SdQueryBuilderFieldOption[];

package/components/query-builder/src/query-builder.serializer.d.ts

@@ -0,0 +1,32 @@
+import { Filter } from '@sdcorejs/utils/models';
+import { QbGroup, QbToken, SdQueryBuilderField } from './query-builder.model';
+/**
+ * Map the internal builder tree to the public `Filter` (the root is always a
+ * `FilterAndOr`). Rules missing field / operator / value — and empty nested
+ * groups — are dropped so the result is always a valid `Filter`.
+ *
+ * @param group - the editable tree's root group.
+ * @returns the canonical nested `Filter`, or `null` when no complete rule survives.
+ */
+export declare function treeToFilter(group: QbGroup): Filter | null;
+/**
+ * Inverse of {@link treeToFilter} — rebuild the editable tree from a `Filter` so a
+ * consumer can seed `[value]`. A non-group (bare) filter is wrapped in an AND root;
+ * `null` yields an empty AND root.
+ *
+ * @param filter - a `Filter` (group or leaf), or `null` / `undefined` for an empty tree.
+ * @returns a fresh root `QbGroup` mirroring the filter's structure.
+ */
+export declare function filterToTree(filter: Filter | null | undefined): QbGroup;
+/**
+ * Render a `Filter` to a SQL-ish token stream for view mode. Field tokens use the
+ * matching field's `label`; operators map to SQL syntax (`= != like between is null …`);
+ * `and` / `or` are lowercase; nested multi-child groups are wrapped in parentheses.
+ * Returns a token stream (not a string) so the template can wrap each piece in a
+ * highlight `<span>` keyed by `QbToken.kind`.
+ *
+ * @param filter - the `Filter` to render, or `null` / `undefined`.
+ * @param fields - field metadata, used to resolve each field key to its display label + value formatting.
+ * @returns the ordered tokens, or `[]` when `filter` is empty.
+ */
+export declare function filterToTokens(filter: Filter | null | undefined, fields: SdQueryBuilderField[]): QbToken[];

package/components/section/src/section.component.d.ts

@@ -1,11 +1,11 @@
-import { SdBaseSecureComponent } from '@sd-angular/core/components/base';
+import { Color } from '@sdcorejs/utils/models';
 import * as i0 from "@angular/core";
-export declare class SdSection extends SdBaseSecureComponent {
+export declare class SdSection {
     #private;
     title: import("@angular/core").InputSignal<string | null | undefined>;
     subTitle: import("@angular/core").InputSignal<string | null | undefined>;
     icon: import("@angular/core").InputSignal<string | null | undefined>;
-    iconColor: import("@angular/core").InputSignal<import("@sdcorejs/utils/models").Color>;
+    iconColor: import("@angular/core").InputSignal<Color>;
     collapsed: import("@angular/core").ModelSignal<boolean>;
     collapsable: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
     hideHeader: import("@angular/core").InputSignalWithTransform<boolean, unknown>;

package/components/side-drawer/src/side-drawer.component.d.ts

@@ -1,8 +1,7 @@
 import { CdkPortal } from '@angular/cdk/portal';
-import { SdBaseSecureComponent } from '@sd-angular/core/components/base';
 import { Observable } from 'rxjs';
 import * as i0 from "@angular/core";
-export declare class SdSideDrawer extends SdBaseSecureComponent {
+export declare class SdSideDrawer {
     #private;
     id: string;
     portal: import("@angular/core").Signal<CdkPortal>;

package/components/stepper/index.d.ts

@@ -0,0 +1,2 @@
+export * from './src/step.component';
+export * from './src/stepper.component';

package/components/stepper/src/step.component.d.ts

@@ -0,0 +1,17 @@
+import { TemplateRef } from '@angular/core';
+import { AbstractControl } from '@angular/forms';
+import * as i0 from "@angular/core";
+export type SdStepState = 'pending' | 'active' | 'completed' | 'error' | string;
+export declare class SdStep {
+    label: import("@angular/core").InputSignal<string>;
+    icon: import("@angular/core").InputSignal<string | null | undefined>;
+    optional: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    editable: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    stepControl: import("@angular/core").InputSignal<AbstractControl<any, any> | null | undefined>;
+    state: import("@angular/core").InputSignal<string | undefined>;
+    errorMessage: import("@angular/core").InputSignal<string | undefined>;
+    selectChange: import("@angular/core").OutputEmitterRef<void>;
+    bodyTpl: import("@angular/core").Signal<TemplateRef<unknown>>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdStep, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdStep, "sd-step", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "optional": { "alias": "optional"; "required": false; "isSignal": true; }; "editable": { "alias": "editable"; "required": false; "isSignal": true; }; "stepControl": { "alias": "stepControl"; "required": false; "isSignal": true; }; "state": { "alias": "state"; "required": false; "isSignal": true; }; "errorMessage": { "alias": "errorMessage"; "required": false; "isSignal": true; }; }, { "selectChange": "selectChange"; }, never, ["*"], true, never>;
+}

package/components/stepper/src/stepper.component.d.ts

@@ -0,0 +1,32 @@
+import { StepperSelectionEvent } from '@angular/cdk/stepper';
+import { MatStepper } from '@angular/material/stepper';
+import { Color } from '@sdcorejs/utils/models';
+import { SdStep } from './step.component';
+import * as i0 from "@angular/core";
+export declare class SdStepper {
+    steps: import("@angular/core").Signal<readonly SdStep[]>;
+    selectedIndex: import("@angular/core").ModelSignal<number>;
+    linear: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    orientation: import("@angular/core").InputSignal<"horizontal" | "vertical">;
+    labelPosition: import("@angular/core").InputSignal<"end" | "bottom">;
+    headerPosition: import("@angular/core").InputSignal<"bottom" | "top">;
+    animationDuration: import("@angular/core").InputSignal<string>;
+    disableRipple: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    color: import("@angular/core").InputSignal<Color>;
+    autoId: import("@angular/core").InputSignal<string | undefined>;
+    selectionChange: import("@angular/core").OutputEmitterRef<StepperSelectionEvent>;
+    protected matStepper: import("@angular/core").Signal<MatStepper | undefined>;
+    get autoIdAttr(): string | null;
+    get cssActive(): string;
+    get cssActiveBg(): string;
+    get cssCompleted(): string;
+    get cssLine(): string;
+    constructor();
+    next(): void;
+    previous(): void;
+    reset(): void;
+    goTo(index: number): void;
+    protected onSelectionChange(ev: StepperSelectionEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdStepper, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdStepper, "sd-stepper", never, { "selectedIndex": { "alias": "selectedIndex"; "required": false; "isSignal": true; }; "linear": { "alias": "linear"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "labelPosition": { "alias": "labelPosition"; "required": false; "isSignal": true; }; "headerPosition": { "alias": "headerPosition"; "required": false; "isSignal": true; }; "animationDuration": { "alias": "animationDuration"; "required": false; "isSignal": true; }; "disableRipple": { "alias": "disableRipple"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "autoId": { "alias": "autoId"; "required": false; "isSignal": true; }; }, { "selectedIndex": "selectedIndexChange"; "selectionChange": "selectionChange"; }, ["steps"], never, true, never>;
+}

package/components/tab/index.d.ts

@@ -0,0 +1,2 @@
+export * from './src/tab.component';
+export * from './src/tab-group.component';

package/components/tab/src/tab-group.component.d.ts

@@ -0,0 +1,36 @@
+import { MatTabGroup } from '@angular/material/tabs';
+import { Color } from '@sdcorejs/utils/models';
+import { SdTab } from './tab.component';
+import * as i0 from "@angular/core";
+export interface SdTabClosedEvent {
+    index: number;
+    tab: SdTab;
+}
+export declare class SdTabGroup {
+    tabs: import("@angular/core").Signal<readonly SdTab[]>;
+    selectedIndex: import("@angular/core").ModelSignal<number>;
+    variant: import("@angular/core").InputSignal<"line" | "pills" | "segmented">;
+    color: import("@angular/core").InputSignal<Color>;
+    headerPosition: import("@angular/core").InputSignal<"above" | "below">;
+    alignTabs: import("@angular/core").InputSignal<"start" | "center" | "end">;
+    stretchTabs: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    animationDuration: import("@angular/core").InputSignal<string>;
+    disableRipple: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    dynamicHeight: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    autoId: import("@angular/core").InputSignal<string | undefined>;
+    tabClosed: import("@angular/core").OutputEmitterRef<SdTabClosedEvent>;
+    protected matTabGroup: import("@angular/core").Signal<MatTabGroup | undefined>;
+    get autoIdAttr(): string | null;
+    get isPills(): boolean;
+    get isSegmented(): boolean;
+    get cssIndicator(): string;
+    get cssActive(): string;
+    get cssBadgeBg(): string;
+    get cssBadgeColor(): string;
+    constructor();
+    selectTab(index: number): void;
+    realignInkBar(): void;
+    protected onClose(tab: SdTab, index: number, event: MouseEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdTabGroup, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdTabGroup, "sd-tab-group", never, { "selectedIndex": { "alias": "selectedIndex"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "headerPosition": { "alias": "headerPosition"; "required": false; "isSignal": true; }; "alignTabs": { "alias": "alignTabs"; "required": false; "isSignal": true; }; "stretchTabs": { "alias": "stretchTabs"; "required": false; "isSignal": true; }; "animationDuration": { "alias": "animationDuration"; "required": false; "isSignal": true; }; "disableRipple": { "alias": "disableRipple"; "required": false; "isSignal": true; }; "dynamicHeight": { "alias": "dynamicHeight"; "required": false; "isSignal": true; }; "autoId": { "alias": "autoId"; "required": false; "isSignal": true; }; }, { "selectedIndex": "selectedIndexChange"; "tabClosed": "tabClosed"; }, ["tabs"], never, true, never>;
+}

package/components/tab/src/tab.component.d.ts

@@ -0,0 +1,13 @@
+import { TemplateRef } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class SdTab {
+    label: import("@angular/core").InputSignal<string>;
+    icon: import("@angular/core").InputSignal<string | null | undefined>;
+    badge: import("@angular/core").InputSignal<string | number | null | undefined>;
+    disabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    closable: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    close: import("@angular/core").OutputEmitterRef<void>;
+    bodyTpl: import("@angular/core").Signal<TemplateRef<unknown>>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdTab, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdTab, "sd-tab", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "badge": { "alias": "badge"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "closable": { "alias": "closable"; "required": false; "isSignal": true; }; }, { "close": "close"; }, never, ["*"], true, never>;
+}

package/components/tab-router/src/decorators/tab.decorator.d.ts

@@ -1,5 +1,5 @@
 import { Type } from '@angular/core';
-import { SdColor } from '@sd-angular/core/utilities/models';
+import { Color } from '@sdcorejs/utils/models';
 export interface SdTabComponentArgs {
     url?: string;
     params?: any;
@@ -11,6 +11,6 @@ export declare interface SdTabComponentBuilder {
     name: string | ((args: SdTabComponentArgs) => string);
     icon?: string | ((args: SdTabComponentArgs) => string);
     tooltip?: string | ((args: SdTabComponentArgs) => string);
-    color?: SdColor | ((args: SdTabComponentArgs) => SdColor);
+    color?: Color | ((args: SdTabComponentArgs) => Color);
 }
 export declare function SdTabComponent<T>(builder: SdTabComponentBuilder): (constructor: T) => void;

package/components/tab-router/src/models/tab-router.model.d.ts

@@ -1,11 +1,11 @@
 import { Type } from '@angular/core';
-import { SdColor } from '@sd-angular/core/utilities/models';
+import { Color } from '@sdcorejs/utils/models';
 import { Subject } from 'rxjs';
 export interface SdTabInfo {
     name: string;
     icon?: string;
     tooltip?: string;
-    color?: SdColor;
+    color?: Color;
 }
 export interface SdTab {
     component: Type<any>;

package/components/table/index.d.ts

@@ -2,6 +2,7 @@ export * from './src/directives/sd-table-cell-def.directive';
 export * from './src/directives/sd-table-expand-def.directive';
 export * from './src/directives/sd-table-filter-def.directive';
 export * from './src/directives/sd-table-footer-def.directive';
+export * from './src/directives/sd-table-group-def.directive';
 export * from './src/directives/sd-table-title-def.directive';
 export * from './src/table.component';
 export * from './src/services/table-filter/table-filter.model';

package/components/table/src/components/column-title/column-title.component.d.ts

@@ -3,7 +3,7 @@ import { SdTableColumn } from '../../models/table-column.model';
 import * as i0 from "@angular/core";
 export declare class ColumnTitleComponent {
     column: import("@angular/core").InputSignal<SdTableColumn>;
-    titleDef: import("@angular/core").InputSignal<SdTableTitleDefDirective | undefined>;
+    titleDef: import("@angular/core").InputSignal<SdTableTitleDefDirective<any> | undefined>;
     templateRef: import("@angular/core").Signal<import("@angular/core").TemplateRef<any> | undefined>;
     static ɵfac: i0.ɵɵFactoryDeclaration<ColumnTitleComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<ColumnTitleComponent, "column-title", never, { "column": { "alias": "column"; "required": true; "isSignal": true; }; "titleDef": { "alias": "titleDef"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;

package/components/table/src/components/config/config.component.d.ts

@@ -6,8 +6,10 @@ import { SdTableOption } from '../../models/table-option.model';
 import * as i0 from "@angular/core";
 export declare class ConfigComponent {
     #private;
+    autoIdInput: import("@angular/core").InputSignal<string | null | undefined>;
     tableOption: import("@angular/core").InputSignal<SdTableOption | undefined>;
     changes: import("@angular/core").OutputEmitterRef<ConfiguredTableResult>;
+    autoId: import("@angular/core").Signal<string>;
     modal: import("@angular/core").Signal<SdModal | undefined>;
     table: import("@angular/core").Signal<MatTable<SdTableColumn>>;
     configuration: import("@angular/core").WritableSignal<ConfiguredTable | undefined>;
@@ -21,5 +23,5 @@ export declare class ConfigComponent {
     handleMouseDown(): void;
     handleMouseUp(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ConfigComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ConfigComponent, "config", never, { "tableOption": { "alias": "tableOption"; "required": false; "isSignal": true; }; }, { "changes": "changes"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ConfigComponent, "config", never, { "autoIdInput": { "alias": "autoId"; "required": false; "isSignal": true; }; "tableOption": { "alias": "tableOption"; "required": false; "isSignal": true; }; }, { "changes": "changes"; }, never, never, true, never>;
 }

package/components/table/src/components/desktop-cell/desktop-cell.component.d.ts

@@ -1,4 +1,4 @@
-import { ElementRef } from '@angular/core';
+import { ElementRef, TemplateRef } from '@angular/core';
 import { SdTableCellDefDirective } from '../../directives/sd-table-cell-def.directive';
 import { SdTableColumn } from '../../models/table-column.model';
 import { SdTableItem } from '../../models/table-item.model';
@@ -8,13 +8,13 @@ export declare class DesktopCellComponent {
     contentContainer: import("@angular/core").Signal<ElementRef<HTMLElement> | undefined>;
     column: import("@angular/core").InputSignal<SdTableColumn>;
     item: import("@angular/core").InputSignal<SdTableItem<any>>;
-    cellDef: import("@angular/core").InputSignal<Record<string, SdTableCellDefDirective>>;
+    cellDef: import("@angular/core").InputSignal<Record<string, SdTableCellDefDirective<any>>>;
     value: import("@angular/core").Signal<any>;
     key: import("@angular/core").Signal<any>;
     autoId: import("@angular/core").Signal<string>;
     truncateEnable: import("@angular/core").Signal<boolean | undefined>;
     truncateWidth: import("@angular/core").Signal<string | undefined>;
-    templateRef: import("@angular/core").Signal<import("@angular/core").TemplateRef<any>>;
+    templateRef: import("@angular/core").Signal<TemplateRef<any> | undefined>;
     isCollapsed: import("@angular/core").WritableSignal<boolean>;
     isOverflowing: import("@angular/core").WritableSignal<boolean>;
     constructor();

package/components/table/src/components/filter/column-filter/column-filter.component.d.ts

@@ -18,19 +18,15 @@ export declare class ColumnFilterComponent {
     label: Signal<string | undefined>;
     operators: Signal<{
         value: Operator;
-        symbol?: string;
+        icon: string;
         display: string;
     }[]>;
-    inlineSymbol: Signal<string>;
+    operatorValues: Signal<Operator[]>;
+    operatorWrapperClass: Signal<"mb-4 mr-2" | "mr-2">;
     items: Signal<any[] | SdSearch | Signal<any[]>>;
     constructor();
     onFilterChange: () => void;
     onFilterCommit: () => void;
-    onChangeOperator: (operator: {
-        value: Operator;
-        symbol?: string;
-        display: string;
-    } | undefined) => void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ColumnFilterComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<ColumnFilterComponent, "column-filter", never, { "autoIdInput": { "alias": "autoId"; "required": false; "isSignal": true; }; "column": { "alias": "column"; "required": true; "isSignal": true; }; "columnFilter": { "alias": "columnFilter"; "required": false; "isSignal": true; }; "cacheValues": { "alias": "cacheValues"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "operator": { "alias": "operator"; "required": false; "isSignal": true; }; "isMobile": { "alias": "isMobile"; "required": false; "isSignal": true; }; }, { "operator": "operatorChange"; "filterChange": "filterChange"; "filterCommit": "filterCommit"; }, never, never, true, never>;
 }

package/components/table/src/components/selector-action/selector-action.component.d.ts

@@ -4,13 +4,15 @@ import { Action } from './action-filter.pipe';
 import * as i0 from "@angular/core";
 export declare class SelectorActionComponent {
     #private;
+    autoIdInput: import("@angular/core").InputSignal<string | null | undefined>;
     tableOption: import("@angular/core").InputSignal<SdTableOption | undefined>;
     selectedTableItems: import("@angular/core").InputSignal<SdTableItem<any>[] | undefined>;
     clear: import("@angular/core").OutputEmitterRef<void>;
+    autoId: import("@angular/core").Signal<string>;
     message: import("@angular/core").Signal<string>;
     opened: import("@angular/core").Signal<boolean>;
     onClear: () => void;
     onClickAction: (action: Action) => void;
     static ɵfac: i0.ɵɵFactoryDeclaration<SelectorActionComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SelectorActionComponent, "selector-action", never, { "tableOption": { "alias": "tableOption"; "required": false; "isSignal": true; }; "selectedTableItems": { "alias": "selectedTableItems"; "required": false; "isSignal": true; }; }, { "clear": "clear"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SelectorActionComponent, "selector-action", never, { "autoIdInput": { "alias": "autoId"; "required": false; "isSignal": true; }; "tableOption": { "alias": "tableOption"; "required": false; "isSignal": true; }; "selectedTableItems": { "alias": "selectedTableItems"; "required": false; "isSignal": true; }; }, { "clear": "clear"; }, never, never, true, never>;
 }

package/components/table/src/configurations/table.configuration.d.ts

@@ -1,7 +1,7 @@
 import { InjectionToken } from '@angular/core';
 import { SdTableOptionPaginate } from '../models/table-option-paginate.model';
 import { SdTableOptionFilter } from '../services/table-filter/table-filter.model';
-import { SdOperator } from '@sd-angular/core/utilities';
+import { Operator } from '@sdcorejs/utils/models';
 import { SdTableColumn } from '../models';
 export interface ISdTableConfiguration {
     paginate?: {
@@ -21,8 +21,8 @@ export interface ISdTableConfiguration {
         /** Ẩn toolbar (xóa bộ lọc, thiết lập) của external filter, khi có ít external filter user không cần chức năng này, mặc định là false */
         hideExternalFilterToolbar?: SdTableOptionFilter['hideExternalFilterToolbar'];
         operator?: {
-            list?: Partial<Record<SdTableColumn['type'], SdOperator[]>>;
-            default?: Partial<Record<SdTableColumn['type'], SdOperator>>;
+            list?: Partial<Record<SdTableColumn['type'], Operator[]>>;
+            default?: Partial<Record<SdTableColumn['type'], Operator>>;
         };
     };
     images?: {

package/components/table/src/directives/index.d.ts

@@ -2,4 +2,5 @@ export * from './sd-table-column-filter-def.directive';
 export * from './sticky-shadow.directive';
 export * from './sd-table-title-def.directive';
 export * from './sd-table-cell-def.directive';
+export * from './sd-table-group-def.directive';
 export * from './sd-column-resize.directive';

package/components/table/src/directives/sd-table-cell-def.directive.d.ts

@@ -1,8 +1,16 @@
 import { TemplateRef } from '@angular/core';
+import { SdTableColumn } from '../models/table-column.model';
 import * as i0 from "@angular/core";
-export declare class SdTableCellDefDirective {
+interface Context<T = any> {
+    item: T;
+    column: SdTableColumn<T>;
+    autoId: string;
+}
+export declare class SdTableCellDefDirective<T = any> {
+    static ngTemplateContextGuard<T>(_dir: SdTableCellDefDirective<T>, _ctx: unknown): _ctx is Context<T>;
     sdTableCellDef: import("@angular/core").InputSignal<string>;
-    templateRef: TemplateRef<any>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<SdTableCellDefDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<SdTableCellDefDirective, "[sdTableCellDef]", never, { "sdTableCellDef": { "alias": "sdTableCellDef"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+    templateRef: TemplateRef<Context<T>>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdTableCellDefDirective<any>, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<SdTableCellDefDirective<any>, "[sdTableCellDef]", never, { "sdTableCellDef": { "alias": "sdTableCellDef"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
 }
+export {};

package/components/table/src/directives/sd-table-column-filter-def.directive.d.ts

@@ -1,8 +1,16 @@
 import { TemplateRef } from '@angular/core';
+import { SdTableColumn } from '../models/table-column.model';
 import * as i0 from "@angular/core";
-export declare class SdTableColumnFilterDefDirective {
+interface Context<T = any> {
+    column: SdTableColumn<T>;
+    field: string;
+    disabled?: boolean;
+}
+export declare class SdTableColumnFilterDefDirective<T = any> {
+    static ngTemplateContextGuard<T>(_dir: SdTableColumnFilterDefDirective<T>, _ctx: unknown): _ctx is Context<T>;
     sdTableColumnFilterDef: import("@angular/core").InputSignal<string>;
-    templateRef: TemplateRef<any>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<SdTableColumnFilterDefDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<SdTableColumnFilterDefDirective, "[sdTableColumnFilterDef]", never, { "sdTableColumnFilterDef": { "alias": "sdTableColumnFilterDef"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+    templateRef: TemplateRef<Context<T>>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdTableColumnFilterDefDirective<any>, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<SdTableColumnFilterDefDirective<any>, "[sdTableColumnFilterDef]", never, { "sdTableColumnFilterDef": { "alias": "sdTableColumnFilterDef"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
 }
+export {};

package/components/table/src/directives/sd-table-expand-def.directive.d.ts

@@ -1,7 +1,13 @@
 import { TemplateRef } from '@angular/core';
+import { SdTableItem } from '../models/table-item.model';
 import * as i0 from "@angular/core";
-export declare class SdTableExpandDefDirective {
-    templateRef: TemplateRef<any>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<SdTableExpandDefDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<SdTableExpandDefDirective, "[sdTableExpandDef]", never, {}, {}, never, never, true, never>;
+interface Context<T = any> {
+    item: SdTableItem<T>;
 }
+export declare class SdTableExpandDefDirective<T = any> {
+    static ngTemplateContextGuard<T>(_dir: SdTableExpandDefDirective<T>, _ctx: unknown): _ctx is Context<T>;
+    templateRef: TemplateRef<Context<T>>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdTableExpandDefDirective<any>, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<SdTableExpandDefDirective<any>, "[sdTableExpandDef]", never, {}, {}, never, never, true, never>;
+}
+export {};

package/components/table/src/directives/sd-table-filter-def.directive.d.ts

@@ -1,13 +1,13 @@
 import { TemplateRef } from '@angular/core';
 import * as i0 from "@angular/core";
 interface Context {
-    externalFilter?: Record<string, any>;
+    externalFilter?: Record<string, unknown>;
 }
 export declare class SdTableFilterDefDirective {
-    static ngTemplateContextGuard(dir: Context, ctx: unknown): ctx is Context;
+    static ngTemplateContextGuard(_dir: SdTableFilterDefDirective, _ctx: unknown): _ctx is Context;
     sdTableFilterDef: import("@angular/core").InputSignal<string>;
     defaultShowing: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
-    templateRef: TemplateRef<any> | null;
+    templateRef: TemplateRef<Context> | null;
     static ɵfac: i0.ɵɵFactoryDeclaration<SdTableFilterDefDirective, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<SdTableFilterDefDirective, "[sdTableFilterDef]", never, { "sdTableFilterDef": { "alias": "sdTableFilterDef"; "required": true; "isSignal": true; }; "defaultShowing": { "alias": "defaultShowing"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }

package/components/table/src/directives/sd-table-footer-def.directive.d.ts

@@ -1,8 +1,16 @@
 import { TemplateRef } from '@angular/core';
+import { SdTableColumn } from '../models/table-column.model';
+import { SdTableItem } from '../models/table-item.model';
 import * as i0 from "@angular/core";
-export declare class SdMaterialFooterDefDirective {
+interface Context<T = any> {
+    items: SdTableItem<T>[];
+    column: SdTableColumn<T>;
+}
+export declare class SdMaterialFooterDefDirective<T = any> {
+    static ngTemplateContextGuard<T>(_dir: SdMaterialFooterDefDirective<T>, _ctx: unknown): _ctx is Context<T>;
     sdTableFooterDef: import("@angular/core").InputSignal<string>;
-    templateRef: TemplateRef<any>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<SdMaterialFooterDefDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<SdMaterialFooterDefDirective, "[sdTableFooterDef]", never, { "sdTableFooterDef": { "alias": "sdTableFooterDef"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+    templateRef: TemplateRef<Context<T>>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdMaterialFooterDefDirective<any>, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<SdMaterialFooterDefDirective<any>, "[sdTableFooterDef]", never, { "sdTableFooterDef": { "alias": "sdTableFooterDef"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
 }
+export {};

package/components/table/src/directives/sd-table-group-def.directive.d.ts

@@ -0,0 +1,44 @@
+import { TemplateRef } from '@angular/core';
+import { SdTableItem } from '../models/table-item.model';
+import * as i0 from "@angular/core";
+export interface SdTableGroupDefContext<T = any> {
+    /** Children items thuộc group hiện tại (kèm wrapper SdTableItem). */
+    items: SdTableItem<T>[];
+    /** Children raw data (đã unwrap khỏi SdTableItem) — tiện dùng trong template. */
+    data: T[];
+    /** Hash key của group (Utilities.hash(values)). */
+    key: string;
+    /** Resolved giá trị các field group — vd `{ customerId: 1, customerName: 'A' }`. */
+    values: Record<string, any>;
+    /** true nếu group đang expand, false nếu collapse (chỉ ý nghĩa khi option.group.collapsible). */
+    isExpanded: boolean;
+    /** true nếu mọi children selectable đều selected. */
+    isSelected: boolean;
+    /** true nếu một phần children selected (partial). */
+    indeterminate: boolean;
+    /** Toggle expand/collapse (chỉ chạy nếu collapsible). */
+    toggleExpand: () => void;
+    /** Toggle select-all cho cả group (chỉ chạy nếu selector visible). */
+    toggleSelect: () => void;
+}
+/**
+ * Directive cung cấp custom template render group header row trong sd-table.
+ * Thay thế cho htmlTemplate callback cũ — cho phép Angular template binding,
+ * pipes, components con (sd-badge, sd-button, …) bên trong.
+ *
+ * Ví dụ:
+ * ```html
+ * <sd-table [option]="opt">
+ *   <ng-template sdTableGroupDef let-values="values" let-items="items" let-indeterminate="indeterminate">
+ *     <b>Khách hàng: {{ values.customerName }}</b>
+ *     <span>{{ items.length }} đơn hàng</span>
+ *   </ng-template>
+ * </sd-table>
+ * ```
+ */
+export declare class SdTableGroupDefDirective<T = any> {
+    static ngTemplateContextGuard<T>(_dir: SdTableGroupDefDirective<T>, _ctx: unknown): _ctx is SdTableGroupDefContext<T>;
+    templateRef: TemplateRef<SdTableGroupDefContext<T>>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdTableGroupDefDirective<any>, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<SdTableGroupDefDirective<any>, "[sdTableGroupDef]", never, {}, {}, never, never, true, never>;
+}