@sdcorejs/angular 19.1.6 → 19.2.1

package/components/form-generic/src/models/form-generic-expression.model.d.ts

@@ -14,9 +14,9 @@ export interface SdFormGenericExpressionCondition {
     value: any;
     dayInfo: DayInfo;
 }
-export type Operator = 'EQUAL' | 'NOT_EQUAL' | 'GREATER_THAN' | 'LESS_THAN' | 'GREATER_OR_EQUAL' | 'LESS_OR_EQUAL' | 'NULL' | 'NOT_NULL';
-export declare const Operators: {
-    value: Operator;
+export type SdFormGenericOperator = 'EQUAL' | 'NOT_EQUAL' | 'GREATER_THAN' | 'LESS_THAN' | 'GREATER_OR_EQUAL' | 'LESS_OR_EQUAL' | 'NULL' | 'NOT_NULL';
+export declare const SdFormGenericOperators: {
+    value: SdFormGenericOperator;
     symbol?: string;
     display: string;
 }[];
@@ -43,16 +43,16 @@ export interface DayInfo {
     related?: 'LASTDAY' | 'NEXTDAY' | 'LASTWEEK' | 'NEXTWEEK' | 'LASTMONTH' | 'NEXTMONTH';
     relatedValue?: number;
 }
-export declare const DayInfoTypes: {
+export declare const SD_DAY_INFO_TYPES: {
     value: string;
     display: string;
 }[];
-export declare const DayInfoPreviouses: {
+export declare const SD_DAY_INFO_PREVIOUSES: {
     value: string;
     display: string;
     format: (n: number) => string;
 }[];
-export declare const GetDatetimeValue: (value: string) => string | undefined;
+export declare const sdGetDatetimeValue: (value: string) => string | undefined;
 interface AttributeValues {
     value: string;
     display: string;
@@ -62,13 +62,13 @@ interface AttributeValues {
         display: string;
     }[];
 }
-export declare const AttributeOperators: Record<Attribute['type'], {
-    value: Operator;
+export declare const SD_ATTRIBUTE_OPERATORS: Record<Attribute['type'], {
+    value: SdFormGenericOperator;
     symbol?: string;
     display: string;
 }[]>;
-export declare const GetAttributes: (components: (SdFormGenericComponent | SdFormGenericGroup)[]) => Attribute[];
-export declare const TemplateToCondition: (template: string | undefined | null, entity: Record<string, any>) => string | undefined;
-export declare const EvaluateExpression: (condition: SdFormGenericExpression | SdFormGenericExpressionCondition, entity: Record<string, any>) => boolean | undefined;
-export declare const ExpressionToJavascriptExpression: (condition: SdFormGenericExpression | SdFormGenericExpressionCondition) => string | undefined;
+export declare const sdGetAttributes: (components: (SdFormGenericComponent | SdFormGenericGroup)[]) => Attribute[];
+export declare const sdTemplateToCondition: (template: string | undefined | null, entity: Record<string, any>) => string | undefined;
+export declare const sdEvaluateExpression: (condition: SdFormGenericExpression | SdFormGenericExpressionCondition, entity: Record<string, any>) => boolean | undefined;
+export declare const sdExpressionToJavascriptExpression: (condition: SdFormGenericExpression | SdFormGenericExpressionCondition) => string | undefined;
 export {};

package/components/form-generic/src/models/index.d.ts

@@ -6,3 +6,4 @@ export type * from './form-generic-definition-selection.model';
 export type * from './form-generic-definition-table.model';
 export type * from './form-generic-definition-html.model';
 export * from './form-generic-expression.model';
+export * from './form-generic-validation.model';

package/components/form-generic/src/services/form-generic.service.d.ts

@@ -4,7 +4,7 @@ import * as i0 from "@angular/core";
 export declare class FormGenericService {
     #private;
     private readonly configuration;
-    get selections(): (() => Promise<SdFormGenericDefinitionSelection[]>) | SdFormGenericDefinitionSelection<any, any>[] | (() => SdFormGenericDefinitionSelection<any, any>[]);
+    get selections(): (() => Promise<SdFormGenericDefinitionSelection[]>) | SdFormGenericDefinitionSelection<any, unknown>[] | (() => SdFormGenericDefinitionSelection<any, unknown>[]);
     get tables(): import("@sdcorejs/angular/components/form-generic").SdFormGenericDefinitionTable<any>[];
     getSelection: (valuesKey: string | undefined | null) => Promise<SdFormGenericDefinitionSelection | undefined>;
     selection: {
@@ -12,7 +12,7 @@ export declare class FormGenericService {
         getDefinition: (valuesKey: string | undefined | null) => Promise<SdFormGenericDefinitionSelection | undefined>;
         items: (valuesKey: string | undefined | null, args: SdFormGenericArgs) => Promise<SdFormGenericSelectionItem[] | SdSearch<SdFormGenericSelectionItem>>;
         variables: {
-            detail: (valuesKey: string, values: string | number | string[] | number[], args: SdFormGenericArgs) => Promise<any>;
+            detail: (valuesKey: string, values: string | number | string[] | number[], args: SdFormGenericArgs) => Promise<unknown>;
         };
     };
     html: {

package/components/import-excel/src/import-excel.component.d.ts

@@ -36,6 +36,7 @@ export declare class SdImportExcel implements OnInit, OnDestroy {
     accept: () => void;
     setValidation: (validations: SdImportExcelValidation[]) => void;
     view: (showing?: "ALL" | "SUCCESS" | "WARNING" | "ERROR") => void;
+    onDownloadTemplateKeydown: (event: KeyboardEvent) => void;
     downloadTemplate: () => Promise<void>;
     export: () => Promise<void>;
     onClosed: () => void;

package/components/index.d.ts

@@ -11,12 +11,13 @@ export * from '@sdcorejs/angular/components/query-bar';
 export * from '@sdcorejs/angular/components/upload-file';
 export * from '@sdcorejs/angular/components/section';
 export * from '@sdcorejs/angular/components/inform';
+export * from '@sdcorejs/angular/components/form-generic';
 export * from '@sdcorejs/angular/components/anchor';
+export * from '@sdcorejs/angular/components/api-contract-builder';
 export * from '@sdcorejs/angular/components/query-builder';
 export * from '@sdcorejs/angular/components/org-chart';
 export * from '@sdcorejs/angular/components/tree';
 export * from '@sdcorejs/angular/components/import-excel';
-export * from '@sdcorejs/angular/components/document-builder';
 export * from '@sdcorejs/angular/components/mini-editor';
 export * from '@sdcorejs/angular/components/view';
 export * from '@sdcorejs/angular/components/code-editor';
@@ -29,3 +30,8 @@ export * from '@sdcorejs/angular/components/breadcrumb';
 export * from '@sdcorejs/angular/components/data-state';
 export * from '@sdcorejs/angular/components/job-progress';
 export * from '@sdcorejs/angular/components/audit-diff';
+export * from '@sdcorejs/angular/components/ckeditor-styles';
+export * from '@sdcorejs/angular/components/history';
+export * from '@sdcorejs/angular/components/operator';
+export * from '@sdcorejs/angular/components/stepper';
+export * from '@sdcorejs/angular/components/tab';

package/components/mini-editor/src/mini-editor.model.d.ts

@@ -14,7 +14,7 @@ export interface SdMiniEditorMentionConfig {
         attributes?: Record<string, string>;
     };
 }
-export type SdMiniEditorMentionItem<T = any> = MentionFeedObjectItem & {
+export type SdMiniEditorMentionItem<T = unknown> = MentionFeedObjectItem & {
     data?: T;
 };
 export interface SdMiniEditorOption {

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

@@ -1,8 +1,8 @@
-import { ElementRef, TemplateRef } from '@angular/core';
+import { ElementRef, OnDestroy, TemplateRef } from '@angular/core';
 import { Color } from '@sdcorejs/utils/models';
 import * as i0 from "@angular/core";
 export type SdModalBeforeClose = () => boolean | Promise<boolean>;
-export declare class SdModal {
+export declare class SdModal implements OnDestroy {
     #private;
     static index: import("@angular/core").WritableSignal<number>;
     templateRef: import("@angular/core").Signal<TemplateRef<any>>;
@@ -26,6 +26,7 @@ export declare class SdModal {
     isOpened: import("@angular/core").WritableSignal<boolean>;
     alreadyOpened: import("@angular/core").WritableSignal<boolean>;
     constructor();
+    ngOnDestroy(): void;
     open: () => void;
     close: () => void;
     requestClose: () => Promise<boolean>;

package/components/modal-resizable/src/modal-resizable.component.d.ts

@@ -1,11 +1,93 @@
 import { CdkPortal } from '@angular/cdk/portal';
 import * as i0 from "@angular/core";
+/**
+ * `<sd-modal-resizable>` — right-docked, non-modal panel that can be minimized, expanded or pushed
+ * fullscreen. Several panels stack side by side along the right edge of the viewport, so the user
+ * can keep multiple records open at once while still working with the page behind them.
+ *
+ * Use it for side-by-side comparison / inspector workflows. Use `<sd-modal>` when the task is
+ * blocking, and `<sd-side-drawer>` when a single overlay with a backdrop is enough.
+ *
+ * NOTE ON DOCS: this component deliberately has **no** sibling `sd-modal-resizable.md`. Every `*.md`
+ * under the library is swept into `published-docs/<version>/index.json` by `scripts/collect-docs.mjs`,
+ * and `scripts/generate-showcase-example-sources.test.mjs` asserts that list is 1:1 with the
+ * `publishedDocId` set in the showcase documentation registry. A published doc with no showcase page
+ * therefore turns that release guard red. Keep the reference here until the component ships a
+ * showcase demo + registry entry; only then add the `.md`.
+ *
+ * ```ts
+ * import { SdModalResizable } from '@sdcorejs/angular/components/modal-resizable';
+ * ```
+ *
+ * ```html
+ * <sd-button title="Open detail" type="fill" color="primary" (click)="panel.open()"></sd-button>
+ *
+ * <sd-modal-resizable #panel width="520px">
+ *   <span sdTitle>Đơn hàng #1024</span>
+ *
+ *   <div sdBody class="panel-body">
+ *     <sd-section icon="receipt" title="Thông tin chung">
+ *       <sd-section-item label="Khách hàng">Nguyen Van An</sd-section-item>
+ *     </sd-section>
+ *   </div>
+ *
+ *   <sd-button sdFooterRight type="text" title="Đóng" (click)="panel.close()"></sd-button>
+ * </sd-modal-resizable>
+ * ```
+ *
+ * ### Slots
+ * | Selector          | Where it renders          |
+ * | ----------------- | ------------------------- |
+ * | `[sdTitle]`       | Header title area.        |
+ * | `[sdBody]`        | Scrollable content area.  |
+ * | `[sdFooterLeft]`  | Footer left action group. |
+ * | `[sdFooterRight]` | Footer right action group.|
+ *
+ * Header, body and footer only render while the panel is open.
+ *
+ * ### Panel stacking
+ * The panel is portalled onto `document.body` (via `CdkPortal` + `DomPortalOutlet`), so laying panels
+ * out is a concern shared by all live instances rather than by a single view. Arrangement is scoped
+ * through the root-provided `SdModalResizableRegistry`: each instance registers its panel id on
+ * construction and unregisters it on destroy. `open`, `close`, `minimize`, `maximize` and
+ * `toggleMaximum` re-run the arrangement and rewrite inline `width` / `right` **only on registered,
+ * still-mounted panels**, in registration order. Consequences worth knowing:
+ * - Markup of your own that happens to carry the `.modal-resizable` class is **not** touched.
+ *   (Earlier builds ran `document.querySelectorAll('.modal-resizable')` and rewrote every match.)
+ * - A destroyed panel immediately stops taking up a slot for the instances that outlive it.
+ * - Panels marked `c-closed`, and expanded panels with no captured `data-width`, are skipped.
+ *
+ * ### Lifecycle / teardown
+ * `open()`, `close()` and the arrangement pass each schedule a short `setTimeout` (100ms / 100ms /
+ * 200ms) that mutates DOM. All of them are tracked and cleared in `DestroyRef.onDestroy`, together
+ * with unregistering from the registry and destroying the portal view. Destroying the component
+ * mid-animation cannot run layout work against a detached panel.
+ *
+ * ### Anti-patterns
+ * - Rendering it inside a scroll container and expecting it to be clipped — it lives on `<body>`.
+ * - Reusing the `.modal-resizable` class on your own elements to "join" the stack; register a real
+ *   component instead.
+ * - Writing inline `width` / `right` on a panel yourself — the next arrangement pass overwrites both.
+ *
+ * ### Tests
+ * `src/modal-resizable.component.spec.ts` — portal attach, open/close/minimize/maximize math,
+ * loading, editing, timer teardown, registry scoping. Run:
+ * `npx ng test sdcorejs-angular --watch=false --browsers=ChromeHeadless --include='projects/sdcorejs-angular/components/modal-resizable/src/modal-resizable.component.spec.ts'`
+ *
+ * ### Related
+ * `<sd-modal>` (blocking dialog / bottom-sheet), `<sd-side-drawer>` (single right-side overlay with
+ * a body scroll lock), `SdLoadingService` (powers `startLoading()` / `stopLoading()`).
+ */
 export declare class SdModalResizable {
     #private;
+    /** Generated DOM id of the panel element (`I<uuid>`). */
     readonly id: string;
     readonly portal: import("@angular/core").Signal<CdkPortal>;
+    /** Marks the panel as editable. Bare attribute = `true`. Default `false`. */
     readonly editable: import("@angular/core").InputSignalWithTransform<boolean, boolean | "">;
+    /** CSS width used while the panel is expanded (not a minimum). Default `'480px'`. */
     readonly width: import("@angular/core").InputSignal<string>;
+    /** Emitted by `toggleEditable()` with the new editing state. */
     readonly editingChanged: import("@angular/core").OutputEmitterRef<boolean>;
     readonly isEditing: import("@angular/core").WritableSignal<boolean>;
     readonly isOpened: import("@angular/core").WritableSignal<boolean>;
@@ -14,15 +96,25 @@ export declare class SdModalResizable {
     readonly isMinimum: import("@angular/core").WritableSignal<boolean>;
     readonly isMaximum: import("@angular/core").WritableSignal<boolean>;
     constructor();
+    /** Opens the panel, captures its rendered width, and expands it. */
     open: () => void;
+    /** Collapses the panel to zero width and stops loading. */
     close: () => void;
+    /** Shrinks the panel to the 300px minimum strip. */
     minimize: () => void;
+    /** Restores the panel to its expanded width. */
     maximize: () => void;
+    /** Toggles fullscreen (`calc(100% - 16px)`). */
     toggleMaximum: () => void;
+    /** Drives the scoped loading overlay through `SdLoadingService`. */
     startLoading: () => void;
+    /** Stops the scoped loading overlay. */
     stopLoading: () => void;
+    /** Flips `isEditing` and emits `editingChanged`. */
     toggleEditable(): void;
+    /** Hover state hook bound in the template. */
     onFocus: () => void;
+    /** Hover state hook bound in the template. */
     onBlur: () => void;
     static ɵfac: i0.ɵɵFactoryDeclaration<SdModalResizable, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<SdModalResizable, "sd-modal-resizable", never, { "editable": { "alias": "editable"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; }, { "editingChanged": "editingChanged"; }, never, ["[sdTitle]", "[sdBody]", "[sdFooterLeft]", "[sdFooterRight]"], true, never>;

package/components/modal-resizable/src/modal-resizable.registry.d.ts

@@ -0,0 +1,22 @@
+import * as i0 from "@angular/core";
+/**
+ * Sổ đăng ký các panel `<sd-modal-resizable>` đang sống.
+ *
+ * why: mỗi panel được portal ra thẳng `document.body` nên việc xếp chỗ (width/right) là bài toán
+ * chung của cả stack. Trước đây `#arrangePanels` quét `document.querySelectorAll('.modal-resizable')`
+ * — query đó bắt MỌI phần tử mang class này trong tài liệu, kể cả markup của component khác hoặc
+ * của app dùng trùng tên class, rồi ghi đè inline style lên chúng. Registry giới hạn phạm vi ghi
+ * đúng vào các instance do library tạo ra và còn sống.
+ */
+export declare class SdModalResizableRegistry {
+    #private;
+    register(id: string): void;
+    unregister(id: string): void;
+    /**
+     * Phần tử panel của các instance đã đăng ký và đang có mặt trong DOM.
+     * Instance đã destroy hoặc chưa attach portal sẽ bị bỏ qua.
+     */
+    panels(): HTMLElement[];
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdModalResizableRegistry, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<SdModalResizableRegistry>;
+}

package/components/org-chart/src/org-chart.component.d.ts

@@ -16,9 +16,15 @@ export declare class SdOrgChart {
     readonly resolvedItemTemplate: import("@angular/core").Signal<TemplateRef<SdOrgChartItemContext<SdOrgChartItem>> | undefined>;
     readonly trackByItem: (_index: number, item: SdOrgChartItem) => string | number;
     hasChildren: (item: SdOrgChartItem) => boolean;
+    /** why: trả về hằng số dùng chung thay vì `[]` mới, để leaf không cấp phát mỗi lần CD gọi tới. */
     childrenOf: (item: SdOrgChartItem) => SdOrgChartItem[];
     isExpanded: (item: SdOrgChartItem) => boolean;
     toggle: (item: SdOrgChartItem, event?: Event) => void;
+    /**
+     * Template context của một node. Ref ổn định giữa các lần CD nhờ `#contextByItem`.
+     * Item không nằm trong `resolvedItems()` (gọi thủ công từ bên ngoài) thì dựng mới — trường hợp
+     * này không nằm trên đường render nên không gây churn.
+     */
     createContext: (item: SdOrgChartItem, depth: number, parent: SdOrgChartItem | null) => SdOrgChartItemContext;
     nodeAutoId: (item: SdOrgChartItem, part: "node" | "image" | "title" | "description" | "toggle") => string | undefined;
     static ɵfac: i0.ɵɵFactoryDeclaration<SdOrgChart, never>;

package/components/preview/src/preview-image/preview-image.component.d.ts

@@ -7,6 +7,7 @@ export declare class SdPreviewImage implements OnDestroy {
     static readonly MAX_ZOOM = 4;
     static readonly ZOOM_STEP = 0.1;
     static readonly SWIPE_THRESHOLD = 40;
+    readonly stageId: string;
     readonly autoIdInput: import("@angular/core").InputSignal<string | null | undefined>;
     readonly autoId: import("@angular/core").Signal<string | undefined>;
     readonly autoIdPrev: import("@angular/core").Signal<string | undefined>;

package/components/query-bar/src/components/actions-bar/actions-bar.component.d.ts

@@ -11,17 +11,21 @@ import * as i0 from "@angular/core";
  * immediately before Search so the user sees one filter-cluster on the right.
  */
 export declare class SdQueryActionsBar {
+    #private;
     readonly showLogicToggle: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
     readonly logic: import("@angular/core").ModelSignal<SdQueryLogic>;
     readonly filtersCount: import("@angular/core").InputSignal<number>;
     readonly showSavedFilters: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
     readonly savedFiltersKey: import("@angular/core").InputSignal<string | undefined>;
-    readonly query: import("@angular/core").InputSignal<SdQuery<any>>;
-    readonly applyFilter: import("@angular/core").OutputEmitterRef<SdSavedFilter<any>>;
+    readonly query: import("@angular/core").InputSignal<SdQuery<unknown>>;
+    readonly applyFilter: import("@angular/core").OutputEmitterRef<SdSavedFilter<unknown>>;
     readonly showClearAll: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
     readonly clear: import("@angular/core").OutputEmitterRef<void>;
     readonly canSearch: import("@angular/core").InputSignal<boolean>;
     readonly search: import("@angular/core").OutputEmitterRef<void>;
+    readonly logicGroupLabel: import("@angular/core").Signal<string>;
+    readonly clearAllLabel: import("@angular/core").Signal<string>;
+    readonly searchLabel: import("@angular/core").Signal<string>;
     setLogic(value: SdQueryLogic): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<SdQueryActionsBar, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<SdQueryActionsBar, "sd-query-actions-bar", never, { "showLogicToggle": { "alias": "showLogicToggle"; "required": false; "isSignal": true; }; "logic": { "alias": "logic"; "required": false; "isSignal": true; }; "filtersCount": { "alias": "filtersCount"; "required": false; "isSignal": true; }; "showSavedFilters": { "alias": "showSavedFilters"; "required": false; "isSignal": true; }; "savedFiltersKey": { "alias": "savedFiltersKey"; "required": false; "isSignal": true; }; "query": { "alias": "query"; "required": false; "isSignal": true; }; "showClearAll": { "alias": "showClearAll"; "required": false; "isSignal": true; }; "canSearch": { "alias": "canSearch"; "required": false; "isSignal": true; }; }, { "logic": "logicChange"; "applyFilter": "applyFilter"; "clear": "clear"; "search": "search"; }, never, never, true, never>;

package/components/query-bar/src/components/build-chip/build-chip.component.d.ts

@@ -17,8 +17,11 @@ type Density = 'compact' | 'comfortable';
  *    operator step, disabled badge in value step) + the per-type picker + × cancel.
  */
 export declare class SdQueryBuildChip {
+    #private;
+    readonly booleanTrueLabel: import("@angular/core").Signal<string>;
+    readonly booleanFalseLabel: import("@angular/core").Signal<string>;
     /** Current build state — drives every visual branch. */
-    readonly building: import("@angular/core").InputSignal<BuildingChip<any>>;
+    readonly building: import("@angular/core").InputSignal<BuildingChip<unknown>>;
     /** Density preset — forwarded to the seamless chip + sizes the .c-token row. */
     readonly density: import("@angular/core").InputSignal<Density>;
     /** Operator set offered in the operator-step menu (parent's `allowedOperatorsFor(field)`). */

package/components/query-bar/src/components/chip-popover/chip-popover.component.d.ts

@@ -18,6 +18,14 @@ import * as i0 from "@angular/core";
  */
 export declare class SdQueryChipPopover {
     #private;
+    readonly swapFieldTooltip: import("@angular/core").Signal<string>;
+    readonly fromPlaceholder: import("@angular/core").Signal<string>;
+    readonly toPlaceholder: import("@angular/core").Signal<string>;
+    readonly booleanTrueLabel: import("@angular/core").Signal<string>;
+    readonly booleanFalseLabel: import("@angular/core").Signal<string>;
+    readonly selectValuePlaceholder: import("@angular/core").Signal<string>;
+    readonly enterValuePlaceholder: import("@angular/core").Signal<string>;
+    readonly loadingValuesLabel: import("@angular/core").Signal<string>;
     /** Resolved field of the currently editing chip — parent passes from `fieldByKey()`. */
     readonly field: import("@angular/core").InputSignal<SdQueryField | undefined>;
     /** The chip's current Filter — used by `seed()` for initial staging values. */

package/components/query-bar/src/components/field-picker/field-picker.component.d.ts

@@ -14,6 +14,8 @@ import * as i0 from "@angular/core";
  * chosen field through `(pick)`.
  */
 export declare class SdQueryFieldPicker {
+    #private;
+    readonly emptyLabel: import("@angular/core").Signal<string>;
     /** Field list shown in the menu (caller-supplied; rendered in input order). */
     readonly fields: import("@angular/core").InputSignal<SdQueryField[]>;
     /** Single key disabled with a trailing check — used in the chip-popover "Đổi field" flow. */

package/components/query-bar/src/components/inline-chip/inline-chip.component.d.ts

@@ -20,6 +20,8 @@ type Density = 'compact' | 'comfortable';
  */
 export declare class SdQueryInlineChip {
     #private;
+    readonly booleanTrueLabel: import("@angular/core").Signal<string>;
+    readonly booleanFalseLabel: import("@angular/core").Signal<string>;
     /** Resolved field — parent passes it (no lookup needed inside). */
     readonly field: import("@angular/core").InputSignal<SdQueryField>;
     /** The chip's Filter — used for `data` + `operator`. */

package/components/query-bar/src/components/inline-value-chip/inline-value-chip.component.d.ts

@@ -43,9 +43,9 @@ export declare class SdQueryInlineValueChip {
     readonly isBetween: import("@angular/core").Signal<boolean>;
     readonly isNoData: import("@angular/core").Signal<boolean>;
     readonly icon: import("@angular/core").Signal<string>;
-    readonly ph: import("@angular/core").Signal<"giá trị" | "nhập…">;
-    readonly phFrom: import("@angular/core").Signal<"Từ" | "từ…">;
-    readonly phTo: import("@angular/core").Signal<"Đến" | "đến…">;
+    readonly ph: import("@angular/core").Signal<string>;
+    readonly phFrom: import("@angular/core").Signal<string>;
+    readonly phTo: import("@angular/core").Signal<string>;
     readonly hasValue: import("@angular/core").Signal<boolean>;
     readonly state: import("@angular/core").Signal<ChipState>;
     constructor();

package/components/query-bar/src/components/saved-filters-menu/saved-filters-menu.component.d.ts

@@ -17,19 +17,24 @@ import * as i0 from "@angular/core";
  */
 export declare class SdQuerySavedFiltersMenu {
     #private;
+    readonly tooltipLabel: import("@angular/core").Signal<string>;
+    readonly tooltipDisabledLabel: import("@angular/core").Signal<string>;
+    readonly deleteLabel: import("@angular/core").Signal<string>;
+    readonly emptyLabel: import("@angular/core").Signal<string>;
+    readonly saveLabel: import("@angular/core").Signal<string>;
     /** Namespace key used to scope localStorage. `undefined` → menu disabled. */
     readonly key: import("@angular/core").InputSignal<string | undefined>;
     /** Current query the host wants to snapshot when the user clicks "Save current". */
-    readonly query: import("@angular/core").InputSignal<SdQuery<any>>;
+    readonly query: import("@angular/core").InputSignal<SdQuery<unknown>>;
     /** Fired when the user picks a saved filter from the list. */
-    readonly apply: import("@angular/core").OutputEmitterRef<SdSavedFilter<any>>;
-    readonly savedFilters: import("@angular/core").WritableSignal<SdSavedFilter<any>[]>;
+    readonly apply: import("@angular/core").OutputEmitterRef<SdSavedFilter<unknown>>;
+    readonly savedFilters: import("@angular/core").WritableSignal<SdSavedFilter<unknown>[]>;
     /**
      * Prompt for a name and append a snapshot of the current query as a new
      * saved filter. Public so the parent toolbar can wire its external "save"
      * button to this method without re-implementing persistence.
      */
-    promptSave(): void;
+    promptSave(): Promise<void>;
     /** Apply a saved filter — host re-installs filters/logic/search via `(apply)`. */
     pick(filter: SdSavedFilter): void;
     /** Delete a saved filter by id. Stops propagation so the parent button doesn't fire `pick`. */

package/components/query-bar/src/query-bar.component.d.ts

@@ -13,7 +13,7 @@ export declare class SdQueryBar {
     /** The extracted chip popover — owns operator+value staging + commit-on-close. */
     readonly chipPopover: import("@angular/core").Signal<SdQueryChipPopover | undefined>;
     /** Main option object. Prefer this API for new usage; individual inputs stay as a migration bridge. */
-    readonly option: import("@angular/core").InputSignal<SdQueryBarOption<any> | undefined>;
+    readonly option: import("@angular/core").InputSignal<SdQueryBarOption<unknown> | undefined>;
     /** Prefix for auto-generated `data-autoid` on inner controls (chips, operator/value editors, buttons). */
     readonly autoIdInput: import("@angular/core").InputSignalWithTransform<string | undefined, string | null | undefined>;
     /** Available fields the user can filter by. Required for the field picker. */
@@ -54,7 +54,7 @@ export declare class SdQueryBar {
      * Snapshot of the current query — fed into `<sd-query-saved-filters-menu [query]>` so
      * saving a filter captures live filters/logic/search.
      */
-    readonly currentQuery: import("@angular/core").Signal<SdQuery<any>>;
+    readonly currentQuery: import("@angular/core").Signal<SdQuery<unknown>>;
     /** Receive an applied filter from the saved-filters menu — re-install bar state + trigger apply. */
     onApplyFilter(saved: SdSavedFilter): void;
     /** Show AND/OR segmented toggle (renders only when there are ≥2 filters). */
@@ -64,9 +64,15 @@ export declare class SdQueryBar {
     /** Render the operator label on the chip face (default: hidden — operator only visible in popover). */
     readonly showOperatorOnChip: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
     /** Composite payload — emitted whenever filters / logic / search change. */
-    readonly queryChange: import("@angular/core").OutputEmitterRef<SdQuery<any>>;
+    readonly queryChange: import("@angular/core").OutputEmitterRef<SdQuery<unknown>>;
     /** Fires when the user presses "Áp dụng" inside a chip popover — host should reload data. */
-    readonly apply: import("@angular/core").OutputEmitterRef<SdQuery<any>>;
+    readonly apply: import("@angular/core").OutputEmitterRef<SdQuery<unknown>>;
+    /** Placeholder của ô tìm kiếm tự do bên trái. */
+    readonly searchPlaceholder: import("@angular/core").Signal<string>;
+    /** Tooltip nút "+" khi consumer chưa khai `fields`. */
+    readonly noFieldsLabel: import("@angular/core").Signal<string>;
+    /** Tooltip nút "+" ở trạng thái bình thường. */
+    readonly addFilterLabel: import("@angular/core").Signal<string>;
     /** Map of `field.key` → `SdQueryField` for fast lookup from filters[]. */
     readonly resolvedAutoId: import("@angular/core").Signal<string | undefined>;
     readonly resolvedFields: import("@angular/core").Signal<SdQueryField[]>;
@@ -96,13 +102,34 @@ export declare class SdQueryBar {
      * popover-mode chips read `multiple()` from the child popover directly.
      */
     multiple(op: Operator): boolean;
+    /**
+     * Stable track key of a filter row. Assigned lazily on first read.
+     *
+     * ⚠️ Hai ràng buộc với `filters`, đều là hợp đồng của consumer:
+     *
+     * 1. KHÔNG được chứa cùng một object `Filter` ở hai vị trí. Khoá theo identity nên hai vị trí sẽ
+     *    cho hai track key trùng nhau và Angular ném NG0955. Đã thử khử trùng bằng hậu tố `$index`
+     *    và HỎNG: Angular đánh giá biểu thức `track` trên CẢ collection cũ khi diff, nên một filter
+     *    vừa bị xoá cho `indexOf === -1`, key đổi, và MỌI chip bị huỷ rồi dựng lại. Để Angular báo
+     *    NG0955 là đúng — thông điệp của nó đã chỉ rõ vấn đề.
+     * 2. Object phải ỔN ĐỊNH giữa các lần change detection. Sinh lại object mới mỗi pass
+     *    (vd `[option]="{ filters: buildFilters() }"`) sẽ khiến mọi chip nhận id mới mỗi pass và bị
+     *    huỷ + dựng lại — tệ hơn cả `track $index` cũ.
+     */
+    rowId(filter: Filter): string;
     readonly iconFor: typeof sdQueryFieldIcon;
     /** Chip is "active" when it has a non-empty value OR a no-data operator (NULL/NOT_NULL). */
     isFilterActive(filter: Filter): boolean;
     /** Rendered value text on a chip. */
     chipValueText(filter: Filter): string;
     isNoDataOperator(op: Operator | string): boolean;
-    readonly building: import("@angular/core").Signal<BuildingChip<any> | null>;
+    readonly building: import("@angular/core").Signal<BuildingChip<unknown> | null>;
+    /**
+     * Allowed operators of `field` — safe to call from a template binding: `sdQueryAllowedOperators`
+     * memo hoá theo object field nên ref trả về ổn định giữa các chu kỳ CD.
+     * why: `<sd-query-build-chip [allowedOperators]>` là OnPush; ref mới mỗi CD sẽ dirty child liên
+     * tục (bug class cấp-phát-mỗi-CD).
+     */
     allowedOperatorsFor(field: SdQueryField): Operator[];
     inlineAutoId(index: number, role: string): string;
     /** Entry point from the field picker — start building a chip for `field`. */

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

@@ -2,7 +2,7 @@ import { Signal } from '@angular/core';
 import { SdSearch } from '@sdcorejs/angular/forms/models';
 import { Filter, NestedKeyOf, Operator } from '@sdcorejs/utils/models';
 export type SdQueryFieldType = 'string' | 'number' | 'boolean' | 'date' | 'datetime' | 'values' | 'lazy-values';
-interface SdQueryFieldBase<T = any> {
+interface SdQueryFieldBase<T = unknown> {
     /** Dot-notation field path (matches `Filter.field`). */
     key: NestedKeyOf<T>;
     /** Human-readable label shown on chip + field picker. */
@@ -27,10 +27,10 @@ interface SdQueryFieldBase<T = any> {
     /** Field is offered in picker but not interactive (read-only badge in chip). */
     disabled?: boolean;
 }
-export interface SdQueryFieldString<T = any> extends SdQueryFieldBase<T> {
+export interface SdQueryFieldString<T = unknown> extends SdQueryFieldBase<T> {
     type: 'string';
 }
-export interface SdQueryFieldNumber<T = any> extends SdQueryFieldBase<T> {
+export interface SdQueryFieldNumber<T = unknown> extends SdQueryFieldBase<T> {
     type: 'number';
     /** Bounds for the input control inside the chip popover. */
     min?: number;
@@ -38,13 +38,13 @@ export interface SdQueryFieldNumber<T = any> extends SdQueryFieldBase<T> {
     /** Step for the number input. */
     step?: number;
 }
-export interface SdQueryFieldBoolean<T = any> extends SdQueryFieldBase<T> {
+export interface SdQueryFieldBoolean<T = unknown> extends SdQueryFieldBase<T> {
     type: 'boolean';
     /** Labels rendered for the true/false buttons. Default: "Có" / "Không". */
     trueLabel?: string;
     falseLabel?: string;
 }
-export interface SdQueryFieldDate<T = any> extends SdQueryFieldBase<T> {
+export interface SdQueryFieldDate<T = unknown> extends SdQueryFieldBase<T> {
     type: 'date' | 'datetime';
     /** Restrict the picker calendar to this range. */
     min?: Date | string;
@@ -54,7 +54,7 @@ export interface SdQueryFieldDate<T = any> extends SdQueryFieldBase<T> {
  * Statically-known options (sync array, signal, or one-shot promise).
  * Mirrors `SdTableColumnValues.option`.
  */
-export interface SdQueryFieldValues<T = any, K = Record<string, any>> extends SdQueryFieldBase<T> {
+export interface SdQueryFieldValues<T = unknown, K = Record<string, any>> extends SdQueryFieldBase<T> {
     type: 'values';
     option: {
         items: K[] | Signal<K[]> | (() => Promise<K[]>);
@@ -68,7 +68,7 @@ export interface SdQueryFieldValues<T = any, K = Record<string, any>> extends Sd
  * `{ type: 'SEARCH', searchText }` for live queries and `{ type: 'VALUE', value }` for
  * resolving chip-display labels of already-selected IDs.
  */
-export interface SdQueryFieldLazyValues<T = any, K = Record<string, any>> extends SdQueryFieldBase<T> {
+export interface SdQueryFieldLazyValues<T = unknown, K = Record<string, any>> extends SdQueryFieldBase<T> {
     type: 'lazy-values';
     option: {
         search: SdSearch<K>;
@@ -76,16 +76,16 @@ export interface SdQueryFieldLazyValues<T = any, K = Record<string, any>> extend
         displayField: NestedKeyOf<K>;
     };
 }
-export type SdQueryField<T = any> = SdQueryFieldString<T> | SdQueryFieldNumber<T> | SdQueryFieldBoolean<T> | SdQueryFieldDate<T> | SdQueryFieldValues<T> | SdQueryFieldLazyValues<T>;
+export type SdQueryField<T = unknown> = SdQueryFieldString<T> | SdQueryFieldNumber<T> | SdQueryFieldBoolean<T> | SdQueryFieldDate<T> | SdQueryFieldValues<T> | SdQueryFieldLazyValues<T>;
 export type SdQueryLogic = 'AND' | 'OR';
-export interface SdQuery<T = any> {
+export interface SdQuery<T = unknown> {
     filters: Filter<T>[];
     /** Global connector between filters. Defaults to `'AND'`. */
     logic?: SdQueryLogic;
     /** Free-text search box (only present when `showSearch=true`). */
     search?: string;
 }
-export interface SdQueryBarOption<T = any> {
+export interface SdQueryBarOption<T = unknown> {
     /** Prefix for auto-generated `data-autoid` on inner controls. */
     autoId?: string;
     /** Available fields the user can filter by. */
@@ -108,7 +108,7 @@ export interface SdQueryBarOption<T = any> {
     onApply?: (query: SdQuery<T>) => void;
 }
 /** Persisted bookmark of a query (filters + logic + search) — managed by `[savedFiltersKey]`. */
-export interface SdSavedFilter<T = any> {
+export interface SdSavedFilter<T = unknown> {
     id: string;
     name: string;
     query: SdQuery<T>;
@@ -120,7 +120,7 @@ export interface SdSavedFilter<T = any> {
  *   - 'operator' — operator menu open, waiting for the user to pick a condition
  *   - 'value'    — operator locked, value picker / seamless input is the focus
  */
-export interface BuildingChip<T = any> {
+export interface BuildingChip<T = unknown> {
     field: SdQueryField<T>;
     operator?: Operator;
     step: 'operator' | 'value';
@@ -148,6 +148,9 @@ export declare function sdQueryDefaultOperator(field: SdQueryField): Operator;
  * - `operators === true` → full set for the type
  * - `operators` is an array → that array (deduped against the type set is the caller's job)
  * - otherwise (simple mode) → just the single default operator (no real choice)
+ *
+ * The returned array is referentially stable for a given `field` object, so it is safe to call
+ * straight from a template binding.
  */
 export declare function sdQueryAllowedOperators(field: SdQueryField): Operator[];
 /**