@ngneers/controls 0.0.1-pre5 → 0.0.1-pre6

package/types/ngneers-controls-filter.d.ts

@@ -50,7 +50,7 @@ type NgnFilterOutput<T> = NgnFilterConfig & {
  * @category control
  */
 declare class NgnFilter<T = unknown> extends ValueControlBase<'filter', NgnFilterConfig | null> {
-    protected readonly theme: _ngneers_controls_api_ng.ControlTemplateInfo<_ngneers_controls_themes.ControlTemplate<"filter", ["root", "inline", "input-field", "summary", "icon", "popover-content", "rows", "row", "operator", "value", "row-actions", "match", "footer"], readonly [_ngneers_controls_themes.ControlTemplate<"popover", ["root", "content", "content-closing", "anim-in", "anim-out"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>, _ngneers_controls_themes.ControlTemplate<"input-field", ["root", "host", "disabled", "readonly", "invalid", "label", "clear-button", `labelKind-${string}`], readonly [_ngneers_controls_themes.ControlTemplate<"input", ["root", "invalid", "empty"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>]>, _ngneers_controls_themes.ControlTemplate<"input", ["root", "invalid", "empty"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>, _ngneers_controls_themes.ControlTemplate<"select", ["root", "combobox", "input", "icon", "input-editable", "popover-content", "filter", "filter-icon", "list-box", "list-box-empty"], readonly [_ngneers_controls_themes.ControlTemplate<"popover", ["root", "content", "content-closing", "anim-in", "anim-out"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>, _ngneers_controls_themes.ControlTemplate<"list-box", ["root", "empty", "invalid", "item", "group", "default-item", "default-group", "scroller", "item-selected", "item-highlighted"], readonly [_ngneers_controls_themes.ControlTemplate<"checkbox", ["root", "input", "box", "box-checked", "box-indeterminate", "box-icon", "anim-box-icon-enter", "anim-box-icon-leave", "invalid"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>, _ngneers_controls_themes.ControlTemplate<"scroller", ["root", "virtual", "item", "item-sticky"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>]>, _ngneers_controls_themes.ControlTemplate<"input-field", ["root", "host", "disabled", "readonly", "invalid", "label", "clear-button", `labelKind-${string}`], readonly [_ngneers_controls_themes.ControlTemplate<"input", ["root", "invalid", "empty"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>]>]>, _ngneers_controls_themes.ControlTemplate<"button", ["root", "inline", "loading", `kind-${string}`, `color-${string}`], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>]>>;
+    protected readonly theme: _ngneers_controls_api_ng.ControlTemplateInfo<_ngneers_controls_themes.ControlTemplate<"filter", ["root", "inline", "input-field", "summary", "icon", "popover-content", "rows", "row", "operator", "value", "remove-btn", "condition-divider", "footer", "footer-actions", "active-indicator"], readonly [_ngneers_controls_themes.ControlTemplate<"popover", ["root", "content", "content-closing"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>, _ngneers_controls_themes.ControlTemplate<"input-field", ["root", "host", "disabled", "readonly", "invalid", "label", "clear-button", `labelKind-${string}`], readonly [_ngneers_controls_themes.ControlTemplate<"input", ["root", "invalid", "empty"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>]>, _ngneers_controls_themes.ControlTemplate<"input", ["root", "invalid", "empty"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>, _ngneers_controls_themes.ControlTemplate<"select", ["root", "combobox", "input", "icon", "input-editable", "popover-content", "filter", "filter-icon", "list-box", "list-box-empty"], readonly [_ngneers_controls_themes.ControlTemplate<"popover", ["root", "content", "content-closing"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>, _ngneers_controls_themes.ControlTemplate<"list-box", ["root", "empty", "invalid", "item", "group", "default-item", "default-group", "scroller", "item-selected", "item-highlighted"], readonly [_ngneers_controls_themes.ControlTemplate<"checkbox", ["root", "input", "box", "box-checked", "box-indeterminate", "box-icon", "box-icon-visible", "invalid"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>, _ngneers_controls_themes.ControlTemplate<"scroller", ["root", "virtual", "item", "item-sticky"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>]>, _ngneers_controls_themes.ControlTemplate<"input-field", ["root", "host", "disabled", "readonly", "invalid", "label", "clear-button", `labelKind-${string}`], readonly [_ngneers_controls_themes.ControlTemplate<"input", ["root", "invalid", "empty"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>]>]>, _ngneers_controls_themes.ControlTemplate<"button", ["root", "inline", "loading", `kind-${string}`, `color-${string}`], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>, _ngneers_controls_themes.ControlTemplate<"calendar", ["root", "inline", "input", "input-field", "details", "header", "navigation", "days", "week-day", "day", "day-selected", "day-today", "day-other-month", "months", "month", "current-month", "current-year", "time", "next", "previous"], readonly [_ngneers_controls_themes.ControlTemplate<"button", ["root", "inline", "loading", `kind-${string}`, `color-${string}`], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>, _ngneers_controls_themes.ControlTemplate<"select", ["root", "combobox", "input", "icon", "input-editable", "popover-content", "filter", "filter-icon", "list-box", "list-box-empty"], readonly [_ngneers_controls_themes.ControlTemplate<"popover", ["root", "content", "content-closing"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>, _ngneers_controls_themes.ControlTemplate<"list-box", ["root", "empty", "invalid", "item", "group", "default-item", "default-group", "scroller", "item-selected", "item-highlighted"], readonly [_ngneers_controls_themes.ControlTemplate<"checkbox", ["root", "input", "box", "box-checked", "box-indeterminate", "box-icon", "box-icon-visible", "invalid"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>, _ngneers_controls_themes.ControlTemplate<"scroller", ["root", "virtual", "item", "item-sticky"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>]>, _ngneers_controls_themes.ControlTemplate<"input-field", ["root", "host", "disabled", "readonly", "invalid", "label", "clear-button", `labelKind-${string}`], readonly [_ngneers_controls_themes.ControlTemplate<"input", ["root", "invalid", "empty"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>]>]>, _ngneers_controls_themes.ControlTemplate<"input", ["root", "invalid", "empty"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>, _ngneers_controls_themes.ControlTemplate<"input-field", ["root", "host", "disabled", "readonly", "invalid", "label", "clear-button", `labelKind-${string}`], readonly [_ngneers_controls_themes.ControlTemplate<"input", ["root", "invalid", "empty"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>]>]>]>>;
     protected readonly i18n: _ngneers_signal_translate.TranslationsSignal<{
         calendar: {
             today: string;
@@ -96,10 +96,14 @@ declare class NgnFilter<T = unknown> extends ValueControlBase<'filter', NgnFilte
             addCondition: string;
             removeCondition: string;
             clear: string;
+            apply: string;
+            cancel: string;
             matchModeLabel: string;
             match: {
                 all: string;
                 any: string;
+                and: string;
+                or: string;
             };
             selected: string;
             conditions: string;
@@ -136,6 +140,7 @@ declare class NgnFilter<T = unknown> extends ValueControlBase<'filter', NgnFilte
         };
     }, "_">;
     protected readonly unsafeI18n: (key: string) => _angular_core.Signal<string>;
+    private readonly _destroyRef;
     /** Data to filter. */
     readonly data: _angular_core.InputSignal<readonly T[]>;
     /** Datatype of the values in {@link data}. */
@@ -164,6 +169,16 @@ declare class NgnFilter<T = unknown> extends ValueControlBase<'filter', NgnFilte
      * When false, only the filter configuration is emitted (useful for server-side filtering).
      */
     readonly filterLocally: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * When true (default), filters apply automatically as the user types/selects.
+     * When false, the user must click "Apply" to commit the filter.
+     */
+    readonly autoApply: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Debounce time in milliseconds for auto-apply mode.
+     * Only relevant when {@link autoApply} is `true`.
+     */
+    readonly autoApplyDebounce: _angular_core.InputSignalWithTransform<number, unknown>;
     /** Options for the popover (when {@link mode} is not `inline`). */
     readonly popoverOptions: _angular_core.InputSignal<PopoverOptions>;
     protected readonly appliedPopoverOptions: _angular_core.Signal<PopoverOptions>;
@@ -172,11 +187,24 @@ declare class NgnFilter<T = unknown> extends ValueControlBase<'filter', NgnFilte
     /** Emits the filtered data whenever local filtering is enabled. */
     readonly filterResultChange: _angular_core.OutputEmitterRef<readonly T[]>;
     private readonly _popover;
+    /**
+     * Internal working config that the template binds to.
+     * In auto-apply mode, this syncs to value() via debounce.
+     * In manual mode, only apply() commits this to value().
+     */
+    protected readonly workingConfig: _angular_core.WritableSignal<NgnFilterConfig | null>;
+    /** Snapshot of value() taken when popover opens in manual mode, for cancel to restore. */
+    private _snapshotConfig;
+    /** Debounce timer handle for auto-apply. */
+    private _debounceTimer;
+    /** Whether there is an active filter applied. */
+    protected readonly hasActiveFilter: _angular_core.Signal<boolean>;
     private createCondition;
     private defaultConfig;
     /**
      * Config used for UI rendering.
-     * Falls back to a default config when the actual {@link value} is null.
+     * Always reads from workingConfig (the live editing state).
+     * Falls back to a default config when null.
      */
     protected readonly templateConfig: _angular_core.Signal<NgnFilterConfig>;
     protected readonly templateListSelection: _angular_core.Signal<readonly string[]>;
@@ -277,19 +305,40 @@ declare class NgnFilter<T = unknown> extends ValueControlBase<'filter', NgnFilte
     protected readonly autoListOptions: _angular_core.Signal<readonly NgnItem[]>;
     protected readonly resolvedListOptions: _angular_core.Signal<readonly NgnItem[]>;
     protected readonly matchModeOptions: readonly NgnItem[];
-    protected readonly inputType: _angular_core.Signal<"number" | "date" | "text" | "datetime-local">;
+    protected readonly inputType: _angular_core.Signal<"text" | "number" | "date" | "datetime-local">;
+    protected readonly isDateType: _angular_core.Signal<boolean>;
+    protected readonly isShowTime: _angular_core.Signal<boolean>;
+    /** Parse a rawValue string to a Date for the calendar component. */
+    protected parseRawDate(rawValue: string | null): Date | null;
+    /** Convert a Date from the calendar to a rawValue string. */
+    protected dateToRaw(date: Date | null): string | null;
     protected readonly summaryText: _angular_core.Signal<string | undefined>;
     protected readonly activeConditionConfigs: _angular_core.Signal<readonly NgnFilterConditionConfig[]>;
     protected readonly activeConditions: _angular_core.Signal<readonly NgnFilterCondition[]>;
     protected readonly filteredData: _angular_core.Signal<readonly T[]>;
+    /** The current match mode label for the condition divider */
+    protected readonly matchModeLabel: _angular_core.Signal<string>;
     constructor();
+    /**
+     * Commits the working config to the actual value, with optional debounce.
+     * Called after every working config change.
+     */
+    private commitWorkingConfig;
+    /** Updates the working config and optionally auto-applies. */
+    private updateWorkingConfig;
+    protected toggleMatchMode(): void;
     protected setMatchMode(value: unknown): void;
     protected operatorRequiresValue(operator: NgnFilterOperatorId): boolean;
     protected setOperator(index: number, operator: NgnFilterOperatorId | null): void;
     protected setRawValue(index: number, rawValue: string | null): void;
+    protected setDateValue(index: number, date: Date | null): void;
     protected addCondition(): void;
     protected removeCondition(index: number): void;
     protected setListSelection(value: unknown): void;
+    /** Applies the working config (manual mode). */
+    protected apply(): void;
+    /** Cancels changes and restores the snapshot (manual mode). */
+    protected cancelChanges(): void;
     protected clear(): void;
     /** Shows the filter popup. Only works when {@link mode} is not `inline`. */
     show(): void;
@@ -297,7 +346,7 @@ declare class NgnFilter<T = unknown> extends ValueControlBase<'filter', NgnFilte
     hide(): void;
     protected onKeyDown(event: KeyboardEvent): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgnFilter<any>, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgnFilter<any>, "ngn-filter", never, { "data": { "alias": "data"; "required": false; "isSignal": true; }; "dataType": { "alias": "dataType"; "required": false; "isSignal": true; }; "allowMultiple": { "alias": "allowMultiple"; "required": false; "isSignal": true; }; "listOptions": { "alias": "listOptions"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "anchor": { "alias": "anchor"; "required": false; "isSignal": true; }; "filterLocally": { "alias": "filterLocally"; "required": false; "isSignal": true; }; "popoverOptions": { "alias": "popoverOptions"; "required": false; "isSignal": true; }; }, { "filterChange": "filterChange"; "filterResultChange": "filterResultChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgnFilter<any>, "ngn-filter", never, { "data": { "alias": "data"; "required": false; "isSignal": true; }; "dataType": { "alias": "dataType"; "required": false; "isSignal": true; }; "allowMultiple": { "alias": "allowMultiple"; "required": false; "isSignal": true; }; "listOptions": { "alias": "listOptions"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "anchor": { "alias": "anchor"; "required": false; "isSignal": true; }; "filterLocally": { "alias": "filterLocally"; "required": false; "isSignal": true; }; "autoApply": { "alias": "autoApply"; "required": false; "isSignal": true; }; "autoApplyDebounce": { "alias": "autoApplyDebounce"; "required": false; "isSignal": true; }; "popoverOptions": { "alias": "popoverOptions"; "required": false; "isSignal": true; }; }, { "filterChange": "filterChange"; "filterResultChange": "filterResultChange"; }, never, never, true, never>;
 }
 
 export { NgnFilter };

package/types/ngneers-controls-i18n.d.ts

@@ -47,10 +47,14 @@ declare const _default: {
         addCondition: string;
         removeCondition: string;
         clear: string;
+        apply: string;
+        cancel: string;
         matchModeLabel: string;
         match: {
             all: string;
             any: string;
+            and: string;
+            or: string;
         };
         selected: string;
         conditions: string;

package/types/ngneers-controls-icon.d.ts

@@ -1,5 +1,5 @@
 import * as _angular_core from '@angular/core';
-import { TemplateRef, OnDestroy } from '@angular/core';
+import { OnDestroy, TemplateRef } from '@angular/core';
 import { IconType } from '@ngneers/controls-custom-types';
 import * as _ngneers_controls_icon from '@ngneers/controls/icon';
 import * as _angular_platform_browser from '@angular/platform-browser';

package/types/ngneers-controls-input-field.d.ts

@@ -55,10 +55,14 @@ declare class NgnInputField extends NgnBase<'inputField'> {
             addCondition: string;
             removeCondition: string;
             clear: string;
+            apply: string;
+            cancel: string;
             matchModeLabel: string;
             match: {
                 all: string;
                 any: string;
+                and: string;
+                or: string;
             };
             selected: string;
             conditions: string;

package/types/ngneers-controls-list-box.d.ts

@@ -126,10 +126,14 @@ declare class NgnListBox<Items extends readonly NgnItem[], Multiple extends bool
             addCondition: string;
             removeCondition: string;
             clear: string;
+            apply: string;
+            cancel: string;
             matchModeLabel: string;
             match: {
                 all: string;
                 any: string;
+                and: string;
+                or: string;
             };
             selected: string;
             conditions: string;
@@ -165,7 +169,7 @@ declare class NgnListBox<Items extends readonly NgnItem[], Multiple extends bool
             close: string;
         };
     }, "_">;
-    protected readonly theme: _ngneers_controls_api_ng.ControlTemplateInfo<_ngneers_controls_themes.ControlTemplate<"list-box", ["root", "empty", "invalid", "item", "group", "default-item", "default-group", "scroller", "item-selected", "item-highlighted"], readonly [_ngneers_controls_themes.ControlTemplate<"checkbox", ["root", "input", "box", "box-checked", "box-indeterminate", "box-icon", "anim-box-icon-enter", "anim-box-icon-leave", "invalid"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>, _ngneers_controls_themes.ControlTemplate<"scroller", ["root", "virtual", "item", "item-sticky"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>]>>;
+    protected readonly theme: _ngneers_controls_api_ng.ControlTemplateInfo<_ngneers_controls_themes.ControlTemplate<"list-box", ["root", "empty", "invalid", "item", "group", "default-item", "default-group", "scroller", "item-selected", "item-highlighted"], readonly [_ngneers_controls_themes.ControlTemplate<"checkbox", ["root", "input", "box", "box-checked", "box-indeterminate", "box-icon", "box-icon-visible", "invalid"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>, _ngneers_controls_themes.ControlTemplate<"scroller", ["root", "virtual", "item", "item-sticky"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>]>>;
     private readonly _scroller;
     readonly items: _angular_core.InputSignal<Items>;
     readonly scrollToSelectedItemOnInit: _angular_core.InputSignal<boolean | ScrollLogicalPosition>;

package/types/ngneers-controls-menu.d.ts

@@ -84,7 +84,7 @@ declare abstract class MenuTemplates extends NgnBase<'menu'> {
  * @category control
  */
 declare class NgnMenu extends MenuTemplates implements Openable {
-    protected readonly theme: _ngneers_controls_api_ng.ControlTemplateInfo<_ngneers_controls_themes.ControlTemplate<"menu", ["root", "submenu", "popover", "item", "item-opened", "icon-children", "separator"], readonly [_ngneers_controls_themes.ControlTemplate<"popover", ["root", "content", "content-closing", "anim-in", "anim-out"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>]>>;
+    protected readonly theme: _ngneers_controls_api_ng.ControlTemplateInfo<_ngneers_controls_themes.ControlTemplate<"menu", ["root", "submenu", "popover", "item", "item-opened", "icon-children", "separator"], readonly [_ngneers_controls_themes.ControlTemplate<"popover", ["root", "content", "content-closing"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>]>>;
     protected readonly elementId: _angular_core.InputSignal<string>;
     /**
      * The element to which the menu is anchored. Required if `popover` is true.

package/types/ngneers-controls-paginator.d.ts

@@ -76,10 +76,14 @@ declare class NgnPaginator extends NgnBase<'paginator'> {
             addCondition: string;
             removeCondition: string;
             clear: string;
+            apply: string;
+            cancel: string;
             matchModeLabel: string;
             match: {
                 all: string;
                 any: string;
+                and: string;
+                or: string;
             };
             selected: string;
             conditions: string;

package/types/ngneers-controls-popover.d.ts

@@ -31,7 +31,7 @@ type PopoverOptions = {
  * @category control
  */
 declare class NgnPopover extends NgnBase<'popover'> implements Openable {
-    protected readonly theme: _ngneers_controls_api_ng.ControlTemplateInfo<_ngneers_controls_themes.ControlTemplate<"popover", ["root", "content", "content-closing", "anim-in", "anim-out"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>>;
+    protected readonly theme: _ngneers_controls_api_ng.ControlTemplateInfo<_ngneers_controls_themes.ControlTemplate<"popover", ["root", "content", "content-closing"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>>;
     /**
      * Emits when the popover has fully closed.
      */

package/types/ngneers-controls-scroller.d.ts

@@ -86,8 +86,18 @@ declare class NgnScroller<T> extends ScrollerTemplates<T> {
      * If set, the scroller will stick the items with a truthy value for the specified field to the top of the scroller.
      */
     readonly fieldSticky: _angular_core.InputSignal<AllKeysOfUnion<T> | null>;
-    private readonly _elementSize;
+    /**
+     * Viewport size — tracks the scroll ancestor's dimensions so that virtual
+     * scrolling works when an outer element handles overflow (e.g. table wrapper).
+     */
+    private readonly _viewportSize;
     private readonly _itemHeightPx;
+    /**
+     * Vertical offset between the scroll container's top and the scroller element.
+     * Non-zero when a parent (e.g. table wrapper) owns the scroll and the scroller
+     * is positioned below other content (e.g. a sticky header row).
+     */
+    private readonly _scrollOffset;
     private readonly _visibleItemCount;
     private readonly _scrollTop;
     /**
@@ -121,7 +131,7 @@ declare class NgnScroller<T> extends ScrollerTemplates<T> {
         index: number;
     }): unknown;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgnScroller<any>, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgnScroller<any>, "ngn-scroller, [ngn-scroller]", never, { "items": { "alias": "items"; "required": true; "isSignal": true; }; "fieldId": { "alias": "fieldId"; "required": false; "isSignal": true; }; "virtual": { "alias": "virtual"; "required": false; "isSignal": true; }; "itemHeight": { "alias": "itemHeight"; "required": false; "isSignal": true; }; "virtualPadding": { "alias": "virtualPadding"; "required": false; "isSignal": true; }; "focusable": { "alias": "focusable"; "required": false; "isSignal": true; }; "fieldSticky": { "alias": "fieldSticky"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.NgnScrollAmount; inputs: {}; outputs: {}; }]>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgnScroller<any>, "ngn-scroller, [ngn-scroller]", never, { "items": { "alias": "items"; "required": true; "isSignal": true; }; "fieldId": { "alias": "fieldId"; "required": false; "isSignal": true; }; "virtual": { "alias": "virtual"; "required": false; "isSignal": true; }; "itemHeight": { "alias": "itemHeight"; "required": false; "isSignal": true; }; "virtualPadding": { "alias": "virtualPadding"; "required": false; "isSignal": true; }; "focusable": { "alias": "focusable"; "required": false; "isSignal": true; }; "fieldSticky": { "alias": "fieldSticky"; "required": false; "isSignal": true; }; }, {}, never, never, true, [{ directive: typeof i1.NgnScrollAmount; inputs: { "scrollContainer": "scrollContainer"; }; outputs: {}; }]>;
 }
 
 declare class NgnScrollerItem implements AfterViewInit {

package/types/ngneers-controls-select.d.ts

@@ -3,7 +3,7 @@ import { TemplateRef, Signal } from '@angular/core';
 import * as _ngneers_signal_translate from '@ngneers/signal-translate';
 import * as _ngneers_controls_api_ng from '@ngneers/controls/api/ng';
 import * as _ngneers_controls_themes from '@ngneers/controls-themes';
-import { NgnItem, FilterConfig, FilterConfigInternal, FilterFn } from '@ngneers/controls/api';
+import { NgnItem, FilterConfig, FilterFn, FilterConfigInternal } from '@ngneers/controls/api';
 import { PopoverOptions } from '@ngneers/controls/popover';
 import { InputGeneric, maybeCallback } from '@ngneers/controls/utils';
 import { ValueControlBase } from '@ngneers/controls/base';
@@ -106,7 +106,7 @@ type SelectFilterFn<T extends object> = FilterFn<NgnItem<T>>;
  * @category control
  */
 declare class NgnSelect<V, Editable extends boolean = false, Multiple extends boolean = false> extends SelectTemplates<V, Editable, Multiple> {
-    protected readonly theme: _ngneers_controls_api_ng.ControlTemplateInfo<_ngneers_controls_themes.ControlTemplate<"select", ["root", "combobox", "input", "icon", "input-editable", "popover-content", "filter", "filter-icon", "list-box", "list-box-empty"], readonly [_ngneers_controls_themes.ControlTemplate<"popover", ["root", "content", "content-closing", "anim-in", "anim-out"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>, _ngneers_controls_themes.ControlTemplate<"list-box", ["root", "empty", "invalid", "item", "group", "default-item", "default-group", "scroller", "item-selected", "item-highlighted"], readonly [_ngneers_controls_themes.ControlTemplate<"checkbox", ["root", "input", "box", "box-checked", "box-indeterminate", "box-icon", "anim-box-icon-enter", "anim-box-icon-leave", "invalid"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>, _ngneers_controls_themes.ControlTemplate<"scroller", ["root", "virtual", "item", "item-sticky"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>]>, _ngneers_controls_themes.ControlTemplate<"input-field", ["root", "host", "disabled", "readonly", "invalid", "label", "clear-button", `labelKind-${string}`], readonly [_ngneers_controls_themes.ControlTemplate<"input", ["root", "invalid", "empty"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>]>]>>;
+    protected readonly theme: _ngneers_controls_api_ng.ControlTemplateInfo<_ngneers_controls_themes.ControlTemplate<"select", ["root", "combobox", "input", "icon", "input-editable", "popover-content", "filter", "filter-icon", "list-box", "list-box-empty"], readonly [_ngneers_controls_themes.ControlTemplate<"popover", ["root", "content", "content-closing"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>, _ngneers_controls_themes.ControlTemplate<"list-box", ["root", "empty", "invalid", "item", "group", "default-item", "default-group", "scroller", "item-selected", "item-highlighted"], readonly [_ngneers_controls_themes.ControlTemplate<"checkbox", ["root", "input", "box", "box-checked", "box-indeterminate", "box-icon", "box-icon-visible", "invalid"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>, _ngneers_controls_themes.ControlTemplate<"scroller", ["root", "virtual", "item", "item-sticky"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>]>, _ngneers_controls_themes.ControlTemplate<"input-field", ["root", "host", "disabled", "readonly", "invalid", "label", "clear-button", `labelKind-${string}`], readonly [_ngneers_controls_themes.ControlTemplate<"input", ["root", "invalid", "empty"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>]>]>>;
     protected readonly i18n: _ngneers_signal_translate.TranslationsSignal<{
         calendar: {
             today: string;
@@ -152,10 +152,14 @@ declare class NgnSelect<V, Editable extends boolean = false, Multiple extends bo
             addCondition: string;
             removeCondition: string;
             clear: string;
+            apply: string;
+            cancel: string;
             matchModeLabel: string;
             match: {
                 all: string;
                 any: string;
+                and: string;
+                or: string;
             };
             selected: string;
             conditions: string;

package/types/ngneers-controls-spinner.d.ts

@@ -1,5 +1,5 @@
 import * as _angular_core from '@angular/core';
-import { Injector, ElementRef, Signal } from '@angular/core';
+import { ElementRef, Signal, Injector } from '@angular/core';
 import { CustomColor } from '@ngneers/controls-custom-types';
 import * as _ngneers_controls_api_ng from '@ngneers/controls/api/ng';
 import * as _ngneers_controls_themes from '@ngneers/controls-themes';

package/types/ngneers-controls-splitter.d.ts

@@ -29,6 +29,8 @@ type SplitterPanelSize<U extends SplitterPanelSizeUnit = SplitterPanelSizeUnit>
 type SplitterPanelSizeLimitUnit = 'px' | '%';
 type SplitterPanelSizeLimit<U extends SplitterPanelSizeLimitUnit = SplitterPanelSizeLimitUnit> = `${number}${U}`;
 type SplitterLayout = 'horizontal' | 'vertical';
+/** Splitter supports adjacent and proportional resize modes (not push). */
+type SplitterResizeMode = 'adjacent' | 'proportional';
 type _SplitterState = {
     layout?: SplitterLayout;
     panelOrder?: string[] | null;
@@ -39,15 +41,6 @@ type SplitterState = _SplitterState & {
     [key: string]: unknown;
 };
 
-type ExpandedSplitterPanelSize = {
-    value: number;
-    unit: SplitterPanelSizeUnit;
-};
-type ExpandedSplitterPanelSizeLimit = {
-    value: number;
-    unit: SplitterPanelSizeLimitUnit;
-};
-
 /**
  * Type interface for the {@link SplitterCalculator} interface.
  */
@@ -109,36 +102,6 @@ interface SplitterCalculator {
      */
     moveDivider(index: number, pxDelta: number): void;
 }
-type SplitterFractionFactors = {
-    /**
-     * The number of fraction units per pixel.
-     * This is used to convert pixel values to fraction values.
-     */
-    frPerPx: number;
-    /**
-     * The number of pixels per fraction unit.
-     * This is used to convert fraction values to pixel values.
-     */
-    pxPerFr: number;
-};
-type SplitterDragContextPanel = {
-    /**
-     * A reference to the panel component.
-     */
-    panel: NgnSplitterPanel;
-    /**
-     * The starting size of the panel at the beginning of the drag operation.
-     */
-    startSize: ExpandedSplitterPanelSize;
-    /**
-     * The minimum size limit of the panel.
-     */
-    minSize: ExpandedSplitterPanelSizeLimit;
-    /**
-     * The maximum size limit of the panel.
-     */
-    maxSize: ExpandedSplitterPanelSizeLimit;
-};
 /**
  * Represents the context of a drag operation in the splitter.
  */
@@ -155,17 +118,10 @@ type SplitterDragContext = {
      * The starting position of the pointer when the drag operation started, in pixels.
      */
     startPosition: number;
-    /**
-     * An array of panels involved in the drag operation.
-     */
-    panels: SplitterDragContextPanel[];
-    /**
-     * The fraction factors used for calculating sizes during the drag operation.
-     */
-    fractionFactors: SplitterFractionFactors;
 };
 /**
  * Default implementation of the {@link SplitterCalculator} interface.
+ * Delegates all resize math to the generic {@link ResizeEngine}.
  */
 declare class DefaultSplitterCalculator implements SplitterCalculator {
     protected readonly panels: Signal<readonly NgnSplitterPanel[]>;
@@ -173,6 +129,7 @@ declare class DefaultSplitterCalculator implements SplitterCalculator {
     protected readonly panelOrder: Signal<readonly string[] | null | undefined>;
     protected readonly layout: Signal<SplitterLayout>;
     protected readonly splitterSize: Signal<number>;
+    private readonly _engine;
     constructor(splitter: NgnSplitter);
     readonly orderedPanels: Signal<readonly NgnSplitterPanel[]>;
     readonly gridTemplateSizes: Signal<string>;
@@ -181,21 +138,17 @@ declare class DefaultSplitterCalculator implements SplitterCalculator {
     readonly maxSize: Signal<string>;
     readonly dragContext: _angular_core.WritableSignal<SplitterDragContext | null>;
     protected readonly dividerSizes: Signal<number[]>;
-    protected readonly totalDividerSize: Signal<number>;
-    protected readonly totalPanelSizes: Signal<{
-        px: number;
-        fr: number;
-    }>;
     startDrag(index: number, event: PointerEvent): void;
     drag(index: number, event: PointerEvent): void;
     endDrag(index: number, event: PointerEvent, isCancel: boolean): void;
     moveDivider(index: number, pxDelta: number): void;
+    /**
+     * Ensures all panels respect their min/max size constraints.
+     * Delegates to the underlying {@link ResizeEngine}.
+     */
     ensureMinMaxSizes(): void;
-    private createContextPanel;
-    private getCurrentFractionFactors;
-    private setPanelSize;
-    private isPanelSizeCalculated;
-    private applyDividerDelta;
+    /** @internal — used by tests to seed panel sizes into the engine. */
+    setPanelSize(panel: NgnSplitterPanel, size: string): void;
 }
 
 /**
@@ -250,10 +203,14 @@ declare class NgnSplitter extends NgnBase<'splitter'> implements OnDestroy {
             addCondition: string;
             removeCondition: string;
             clear: string;
+            apply: string;
+            cancel: string;
             matchModeLabel: string;
             match: {
                 all: string;
                 any: string;
+                and: string;
+                or: string;
             };
             selected: string;
             conditions: string;
@@ -322,6 +279,19 @@ declare class NgnSplitter extends NgnBase<'splitter'> implements OnDestroy {
      * @default `DefaultSplitterCalculator`
      */
     readonly calculatorType: _angular_core.InputSignal<SplitterCalculatorType>;
+    /**
+     * The resize distribution mode for the splitter.
+     * - `'adjacent'` (default): Only the panels adjacent to the divider are resized.
+     * - `'proportional'`: The deficit is distributed proportionally across all panels on the other side.
+     */
+    readonly resizeMode: _angular_core.InputSignal<SplitterResizeMode>;
+    /**
+     * Whether to lock affected panels to fixed `px` values after a resize completes.
+     * When `true`, panels whose size changed are converted from their original unit to `px`.
+     * When `false`, panels keep their original units (`fr`, `px`).
+     * @default false
+     */
+    readonly lockSizes: _angular_core.InputSignal<boolean>;
     /**
      * The step size for moving the dividers using the keyboard.
      * This can be a pixel value (e.g., '5px') or a percentage value (e.g., '5%').
@@ -378,7 +348,7 @@ declare class NgnSplitter extends NgnBase<'splitter'> implements OnDestroy {
     private applyFromState;
     private getStepInPx;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgnSplitter, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgnSplitter, "ngn-splitter", never, { "layout": { "alias": "layout"; "required": true; "isSignal": true; }; "panelOrder": { "alias": "panelOrder"; "required": false; "isSignal": true; }; "stateStorage": { "alias": "stateStorage"; "required": false; "isSignal": true; }; "stateKey": { "alias": "stateKey"; "required": false; "isSignal": true; }; "stateData": { "alias": "stateData"; "required": false; "isSignal": true; }; "calculatorType": { "alias": "calculatorType"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; }, { "layout": "layoutChange"; "panelOrder": "panelOrderChange"; "stateSaving": "stateSaving"; "stateLoading": "stateLoading"; }, ["panels"], ["*"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgnSplitter, "ngn-splitter", never, { "layout": { "alias": "layout"; "required": true; "isSignal": true; }; "panelOrder": { "alias": "panelOrder"; "required": false; "isSignal": true; }; "stateStorage": { "alias": "stateStorage"; "required": false; "isSignal": true; }; "stateKey": { "alias": "stateKey"; "required": false; "isSignal": true; }; "stateData": { "alias": "stateData"; "required": false; "isSignal": true; }; "calculatorType": { "alias": "calculatorType"; "required": false; "isSignal": true; }; "resizeMode": { "alias": "resizeMode"; "required": false; "isSignal": true; }; "lockSizes": { "alias": "lockSizes"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; }, { "layout": "layoutChange"; "panelOrder": "panelOrderChange"; "stateSaving": "stateSaving"; "stateLoading": "stateLoading"; }, ["panels"], ["*"], true, never>;
 }
 
 declare class NgnSplitterModule {
@@ -388,4 +358,4 @@ declare class NgnSplitterModule {
 }
 
 export { DefaultSplitterCalculator, NgnSplitter, NgnSplitterModule, NgnSplitterPanel };
-export type { SplitterCalculator, SplitterCalculatorType, SplitterDragContext, SplitterLayout, SplitterPanelSize, SplitterPanelSizeLimit, SplitterPanelSizeLimitUnit, SplitterPanelSizeUnit, SplitterState, SplitterStateData };
+export type { SplitterCalculator, SplitterCalculatorType, SplitterDragContext, SplitterLayout, SplitterPanelSize, SplitterPanelSizeLimit, SplitterPanelSizeLimitUnit, SplitterPanelSizeUnit, SplitterResizeMode, SplitterState, SplitterStateData };