@ngneers/controls 0.0.1-next.0

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

@@ -0,0 +1,609 @@
+import * as _angular_core from '@angular/core';
+import * as _ngneers_signal_translate from '@ngneers/signal-translate';
+import * as _ngneers_controls_api_ng from '@ngneers/controls/api/ng';
+import { Anchor } from '@ngneers/controls/api/ng';
+import * as _ngneers_controls_themes from '@ngneers/controls-themes';
+import { NgnItem } from '@ngneers/controls/api';
+import { ValueControlBase } from '@ngneers/controls/base';
+import { PopoverOptions } from '@ngneers/controls/popover';
+
+type NgnFilterDataType = 'string' | 'number' | 'date' | 'dateTime' | 'boolean' | 'custom' | 'list';
+type NgnFilterMode = 'inline' | 'input' | 'headless';
+type NgnFilterMatchMode = 'any' | 'all';
+type NgnFilterOperatorId = 'isEqual' | 'isNotEqual' | 'contains' | 'startsWith' | 'endsWith' | 'in' | 'isEmpty' | 'isNotEmpty' | 'greaterThan' | 'greaterThanOrEqual' | 'lessThan' | 'lessThanOrEqual' | 'isTrue' | 'isFalse' | 'custom';
+/**
+ * A single configured filter condition.
+ * This is intentionally data-free and serializable (useful for server-side filtering).
+ */
+type NgnFilterConditionConfig = {
+    operator: NgnFilterOperatorId;
+    /** Raw user-entered value (string from the input), or null when empty. */
+    rawValue: string | null;
+};
+/**
+ * Complete filter configuration without any actual dataset/result.
+ */
+type NgnFilterConfig = {
+    /** The chosen datatype for the filter value. */
+    dataType: NgnFilterDataType;
+    /** How multiple conditions should be combined. */
+    matchMode: NgnFilterMatchMode;
+    /** Configured conditions (may include empty values depending on operator). */
+    conditions: readonly NgnFilterConditionConfig[];
+};
+type NgnFilterCondition = {
+    operator: NgnFilterOperatorId;
+    value: unknown;
+};
+/**
+ * Full client-side filter result (configuration + filtered dataset).
+ * Prefer {@link NgnFilterConfig} when you only need the config.
+ */
+type NgnFilterOutput<T> = NgnFilterConfig & {
+    /** The active (parsed) conditions used for local evaluation. */
+    activeConditions: readonly NgnFilterCondition[];
+    /** The filtered data result. */
+    filtered: readonly T[];
+};
+
+/**
+ * @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", "summary", "icon", "popover-content", "rows", "row", "condition-divider", "footer", "footer-actions", "active-indicator"], readonly [{
+        readonly class: "popover";
+        readonly template: _ngneers_controls_themes.ControlTemplate<"popover", ["root", "content", "content-closing"], readonly []>;
+    }, {
+        readonly class: "input-field";
+        readonly template: _ngneers_controls_themes.ControlTemplate<"input-field", ["root", "host", "disabled", "readonly", "invalid", "label", "clear-button", `labelKind-${string}`], readonly [{
+            readonly class: "input";
+            readonly template: _ngneers_controls_themes.ControlTemplate<"input", ["root", "invalid", "empty"], readonly []>;
+            readonly projected: true;
+        }]>;
+    }, {
+        readonly class: "value";
+        readonly template: _ngneers_controls_themes.ControlTemplate<"input-field", ["root", "host", "disabled", "readonly", "invalid", "label", "clear-button", `labelKind-${string}`], readonly [{
+            readonly class: "input";
+            readonly template: _ngneers_controls_themes.ControlTemplate<"input", ["root", "invalid", "empty"], readonly []>;
+            readonly projected: true;
+        }]>;
+    }, {
+        readonly class: "operator";
+        readonly template: _ngneers_controls_themes.ControlTemplate<"input-field", ["root", "host", "disabled", "readonly", "invalid", "label", "clear-button", `labelKind-${string}`], readonly [{
+            readonly class: "input";
+            readonly template: _ngneers_controls_themes.ControlTemplate<"input", ["root", "invalid", "empty"], readonly []>;
+            readonly projected: true;
+        }]>;
+    }, {
+        readonly class: "list-select";
+        readonly template: _ngneers_controls_themes.ControlTemplate<"select", ["root", "combobox", "input", "icon", "input-editable", "popover-content", "filter-icon", "list-box-empty"], readonly [{
+            readonly class: "popover";
+            readonly template: _ngneers_controls_themes.ControlTemplate<"popover", ["root", "content", "content-closing"], readonly []>;
+        }, {
+            readonly class: "list-box";
+            readonly template: _ngneers_controls_themes.ControlTemplate<"list-box", ["root", "empty", "invalid", "item", "group", "default-item", "default-group", "item-selected", "item-highlighted", "item-disabled"], readonly [{
+                readonly class: "checkbox";
+                readonly template: _ngneers_controls_themes.ControlTemplate<"checkbox", ["root", "input", "box", "box-checked", "box-indeterminate", "box-icon", "box-icon-visible", "invalid"], readonly []>;
+            }, {
+                readonly class: "scroller";
+                readonly template: _ngneers_controls_themes.ControlTemplate<"scroller", ["root", "virtual", "item", "item-sticky"], readonly []>;
+            }]>;
+        }, {
+            readonly class: "filter";
+            readonly template: _ngneers_controls_themes.ControlTemplate<"input-field", ["root", "host", "disabled", "readonly", "invalid", "label", "clear-button", `labelKind-${string}`], readonly [{
+                readonly class: "input";
+                readonly template: _ngneers_controls_themes.ControlTemplate<"input", ["root", "invalid", "empty"], readonly []>;
+                readonly projected: true;
+            }]>;
+        }]>;
+    }, {
+        readonly class: "operator-select";
+        readonly template: _ngneers_controls_themes.ControlTemplate<"select", ["root", "combobox", "input", "icon", "input-editable", "popover-content", "filter-icon", "list-box-empty"], readonly [{
+            readonly class: "popover";
+            readonly template: _ngneers_controls_themes.ControlTemplate<"popover", ["root", "content", "content-closing"], readonly []>;
+        }, {
+            readonly class: "list-box";
+            readonly template: _ngneers_controls_themes.ControlTemplate<"list-box", ["root", "empty", "invalid", "item", "group", "default-item", "default-group", "item-selected", "item-highlighted", "item-disabled"], readonly [{
+                readonly class: "checkbox";
+                readonly template: _ngneers_controls_themes.ControlTemplate<"checkbox", ["root", "input", "box", "box-checked", "box-indeterminate", "box-icon", "box-icon-visible", "invalid"], readonly []>;
+            }, {
+                readonly class: "scroller";
+                readonly template: _ngneers_controls_themes.ControlTemplate<"scroller", ["root", "virtual", "item", "item-sticky"], readonly []>;
+            }]>;
+        }, {
+            readonly class: "filter";
+            readonly template: _ngneers_controls_themes.ControlTemplate<"input-field", ["root", "host", "disabled", "readonly", "invalid", "label", "clear-button", `labelKind-${string}`], readonly [{
+                readonly class: "input";
+                readonly template: _ngneers_controls_themes.ControlTemplate<"input", ["root", "invalid", "empty"], readonly []>;
+                readonly projected: true;
+            }]>;
+        }]>;
+    }, {
+        readonly class: "calendar";
+        readonly template: _ngneers_controls_themes.ControlTemplate<"calendar", ["root", "inline", "invalid", "details", "header", "navigation", "days", "week-day", "day", "day-selected", "day-today", "day-other-month", "months", "month", "time", "input-field"], readonly [{
+            readonly class: "input";
+            readonly template: _ngneers_controls_themes.ControlTemplate<"mask-input", ["root", "section", "section-active", "section-placeholder", "separator", "proxy", "sr-only"], readonly []>;
+        }, {
+            readonly class: "trigger-icon";
+            readonly template: _ngneers_controls_themes.ControlTemplate<"icon", ["root", "default"], readonly []>;
+        }, {
+            readonly class: "popover";
+            readonly template: _ngneers_controls_themes.ControlTemplate<"popover", ["root", "content", "content-closing"], readonly []>;
+        }, {
+            readonly class: "previous";
+            readonly template: _ngneers_controls_themes.ControlTemplate<"button", ["root", "inline", "loading", `kind-${string}`, `color-${string}`], readonly []>;
+        }, {
+            readonly class: "next";
+            readonly template: _ngneers_controls_themes.ControlTemplate<"button", ["root", "inline", "loading", `kind-${string}`, `color-${string}`], readonly []>;
+        }, {
+            readonly class: "current-month";
+            readonly template: _ngneers_controls_themes.ControlTemplate<"select", ["root", "combobox", "input", "icon", "input-editable", "popover-content", "filter-icon", "list-box-empty"], readonly [{
+                readonly class: "popover";
+                readonly template: _ngneers_controls_themes.ControlTemplate<"popover", ["root", "content", "content-closing"], readonly []>;
+            }, {
+                readonly class: "list-box";
+                readonly template: _ngneers_controls_themes.ControlTemplate<"list-box", ["root", "empty", "invalid", "item", "group", "default-item", "default-group", "item-selected", "item-highlighted", "item-disabled"], readonly [{
+                    readonly class: "checkbox";
+                    readonly template: _ngneers_controls_themes.ControlTemplate<"checkbox", ["root", "input", "box", "box-checked", "box-indeterminate", "box-icon", "box-icon-visible", "invalid"], readonly []>;
+                }, {
+                    readonly class: "scroller";
+                    readonly template: _ngneers_controls_themes.ControlTemplate<"scroller", ["root", "virtual", "item", "item-sticky"], readonly []>;
+                }]>;
+            }, {
+                readonly class: "filter";
+                readonly template: _ngneers_controls_themes.ControlTemplate<"input-field", ["root", "host", "disabled", "readonly", "invalid", "label", "clear-button", `labelKind-${string}`], readonly [{
+                    readonly class: "input";
+                    readonly template: _ngneers_controls_themes.ControlTemplate<"input", ["root", "invalid", "empty"], readonly []>;
+                    readonly projected: true;
+                }]>;
+            }]>;
+        }, {
+            readonly class: "current-year";
+            readonly template: _ngneers_controls_themes.ControlTemplate<"select", ["root", "combobox", "input", "icon", "input-editable", "popover-content", "filter-icon", "list-box-empty"], readonly [{
+                readonly class: "popover";
+                readonly template: _ngneers_controls_themes.ControlTemplate<"popover", ["root", "content", "content-closing"], readonly []>;
+            }, {
+                readonly class: "list-box";
+                readonly template: _ngneers_controls_themes.ControlTemplate<"list-box", ["root", "empty", "invalid", "item", "group", "default-item", "default-group", "item-selected", "item-highlighted", "item-disabled"], readonly [{
+                    readonly class: "checkbox";
+                    readonly template: _ngneers_controls_themes.ControlTemplate<"checkbox", ["root", "input", "box", "box-checked", "box-indeterminate", "box-icon", "box-icon-visible", "invalid"], readonly []>;
+                }, {
+                    readonly class: "scroller";
+                    readonly template: _ngneers_controls_themes.ControlTemplate<"scroller", ["root", "virtual", "item", "item-sticky"], readonly []>;
+                }]>;
+            }, {
+                readonly class: "filter";
+                readonly template: _ngneers_controls_themes.ControlTemplate<"input-field", ["root", "host", "disabled", "readonly", "invalid", "label", "clear-button", `labelKind-${string}`], readonly [{
+                    readonly class: "input";
+                    readonly template: _ngneers_controls_themes.ControlTemplate<"input", ["root", "invalid", "empty"], readonly []>;
+                    readonly projected: true;
+                }]>;
+            }]>;
+        }, {
+            readonly class: "current-month-field";
+            readonly template: _ngneers_controls_themes.ControlTemplate<"input-field", ["root", "host", "disabled", "readonly", "invalid", "label", "clear-button", `labelKind-${string}`], readonly [{
+                readonly class: "input";
+                readonly template: _ngneers_controls_themes.ControlTemplate<"input", ["root", "invalid", "empty"], readonly []>;
+                readonly projected: true;
+            }]>;
+        }, {
+            readonly class: "current-year-field";
+            readonly template: _ngneers_controls_themes.ControlTemplate<"input-field", ["root", "host", "disabled", "readonly", "invalid", "label", "clear-button", `labelKind-${string}`], readonly [{
+                readonly class: "input";
+                readonly template: _ngneers_controls_themes.ControlTemplate<"input", ["root", "invalid", "empty"], readonly []>;
+                readonly projected: true;
+            }]>;
+        }]>;
+    }, {
+        readonly class: "input";
+        readonly template: _ngneers_controls_themes.ControlTemplate<"input", ["root", "invalid", "empty"], readonly []>;
+    }, {
+        readonly class: "remove-btn";
+        readonly template: _ngneers_controls_themes.ControlTemplate<"button", ["root", "inline", "loading", `kind-${string}`, `color-${string}`], readonly []>;
+    }, {
+        readonly class: "add-button";
+        readonly template: _ngneers_controls_themes.ControlTemplate<"button", ["root", "inline", "loading", `kind-${string}`, `color-${string}`], readonly []>;
+    }, {
+        readonly class: "cancel-button";
+        readonly template: _ngneers_controls_themes.ControlTemplate<"button", ["root", "inline", "loading", `kind-${string}`, `color-${string}`], readonly []>;
+    }, {
+        readonly class: "apply-button";
+        readonly template: _ngneers_controls_themes.ControlTemplate<"button", ["root", "inline", "loading", `kind-${string}`, `color-${string}`], readonly []>;
+    }, {
+        readonly class: "clear-button";
+        readonly template: _ngneers_controls_themes.ControlTemplate<"button", ["root", "inline", "loading", `kind-${string}`, `color-${string}`], readonly []>;
+    }]>>;
+    private readonly _i18n;
+    protected readonly i18n: _ngneers_signal_translate.TranslationsSignal<{
+        calendar: {
+            today: string;
+            input: string;
+            selectYear: string;
+            selectMonth: string;
+            previousMonth: string;
+            nextMonth: string;
+            weekdays: {
+                monday: string;
+                tuesday: string;
+                wednesday: string;
+                thursday: string;
+                friday: string;
+                saturday: string;
+                sunday: string;
+            };
+            weekdaysShort: {
+                monday: string;
+                tuesday: string;
+                wednesday: string;
+                thursday: string;
+                friday: string;
+                saturday: string;
+                sunday: string;
+            };
+            months: {
+                january: string;
+                february: string;
+                march: string;
+                april: string;
+                may: string;
+                june: string;
+                july: string;
+                august: string;
+                september: string;
+                october: string;
+                november: string;
+                december: string;
+            };
+        };
+        editInplace: {
+            placeholder: string;
+            confirm: string;
+        };
+        filter: {
+            noFilter: string;
+            addCondition: string;
+            removeCondition: string;
+            operator: string;
+            value: string;
+            clear: string;
+            apply: string;
+            cancel: string;
+            matchModeLabel: string;
+            match: {
+                all: string;
+                any: string;
+                and: string;
+                or: string;
+            };
+            selected: string;
+            conditions: string;
+            operators: {
+                isEqual: string;
+                isNotEqual: string;
+                contains: string;
+                startsWith: string;
+                endsWith: string;
+                in: string;
+                isEmpty: string;
+                isNotEmpty: string;
+                greaterThan: string;
+                greaterThanOrEqual: string;
+                lessThan: string;
+                lessThanOrEqual: string;
+                after: string;
+                onOrAfter: string;
+                before: string;
+                onOrBefore: string;
+                isTrue: string;
+                isFalse: string;
+                custom: string;
+            };
+        };
+        splitter: {
+            handleLabel: string;
+        };
+        inputField: {
+            clearInput: string;
+        };
+        maskInput: {
+            roleDescription: string;
+            segmentRange: string;
+            optionSeparator: string;
+        };
+        drawer: {
+            close: string;
+        };
+        dialog: {
+            close: string;
+        };
+        chip: {
+            close: string;
+        };
+        breadcrumb: {
+            overflow: string;
+        };
+        toast: {
+            close: string;
+            region: string;
+        };
+        snackbar: {
+            close: string;
+            region: string;
+            severity: {
+                error: string;
+                warning: string;
+                success: string;
+                info: string;
+            };
+        };
+        upload: {
+            upload: string;
+            uploadNamed: string;
+            retryNamed: string;
+            cancelNamed: string;
+            removeNamed: string;
+            progressNamed: string;
+        };
+        select: {
+            filterOptions: string;
+        };
+        paginator: {
+            previousPage: string;
+            nextPage: string;
+        };
+        listBox: {
+            noItemsFound: string;
+        };
+        tree: {
+            noItemsFound: string;
+        };
+        table: {
+            selectAllRows: string;
+            selectRow: string;
+            sortedBy: string;
+            sortAscending: string;
+            sortDescending: string;
+            sortCleared: string;
+            selectedCount: string;
+            page: string;
+            resultCount: string;
+        };
+        state: {
+            loading: string;
+            success: string;
+            warning: string;
+            error: string;
+            cancelled: string;
+        };
+    }, "_">;
+    protected readonly unsafeI18n: (key: string) => _angular_core.Signal<string>;
+    private readonly _destroyRef;
+    /**
+     * Data to filter.
+     * @default []
+     */
+    readonly data: _angular_core.InputSignal<readonly T[]>;
+    /**
+     * Datatype of the values in {@link data}. Determines the available operators and editor UI.
+     * @default 'string'
+     */
+    readonly dataType: _angular_core.InputSignal<NgnFilterDataType>;
+    /**
+     * Allows multiple conditions and a match mode (any/all).
+     * @default false
+     */
+    readonly allowMultiple: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Options for `dataType="list"`.
+     * When provided, they are used as-is. When `null` or `undefined`, options are derived from {@link data}.
+     * @default undefined
+     */
+    readonly listOptions: _angular_core.InputSignal<readonly string[] | null | undefined>;
+    /**
+     * Controls how the filter is rendered.
+     * - `inline`: renders the filter rows directly
+     * - `input`: renders an input-like trigger that opens a popover (default)
+     * - `headless`: renders only the popover and can be opened programmatically via {@link show}
+     * @default 'input'
+     */
+    readonly mode: _angular_core.InputSignal<NgnFilterMode>;
+    /**
+     * Popover anchor used only in `headless` mode.
+     * In `input` mode the anchor is the internal input-field.
+     * @default null
+     */
+    readonly anchor: _angular_core.InputSignal<Anchor | null>;
+    /**
+     * When true, the component will filter {@link data} locally and emit the filtered result
+     * via {@link filterResultChange}. When false, only the filter configuration is emitted
+     * (useful for server-side filtering).
+     * @default true
+     */
+    readonly filterLocally: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * When true, filters apply automatically as the user types/selects.
+     * When false, the user must click "Apply" to commit the filter.
+     * @default true
+     */
+    readonly autoApply: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Debounce time in milliseconds for auto-apply mode.
+     * Only relevant when {@link autoApply} is `true`.
+     * @default 300
+     */
+    readonly autoApplyDebounce: _angular_core.InputSignalWithTransform<number, unknown>;
+    /**
+     * Options for the popover (when {@link mode} is not `inline`).
+     * @default {}
+     */
+    readonly popoverOptions: _angular_core.InputSignal<PopoverOptions>;
+    protected readonly appliedPopoverOptions: _angular_core.Signal<PopoverOptions>;
+    /** Emits whenever the filter configuration changes. */
+    readonly filterChange: _angular_core.OutputEmitterRef<NgnFilterConfig | null>;
+    /** 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.
+     * 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[]>;
+    protected readonly operatorDefs: _angular_core.Signal<[{
+        readonly id: "isEqual";
+        readonly labelKey: "filter_operators_isEqual";
+        readonly requiresValue: true;
+    }, {
+        readonly id: "isNotEqual";
+        readonly labelKey: "filter_operators_isNotEqual";
+        readonly requiresValue: true;
+    }, {
+        readonly id: "contains";
+        readonly labelKey: "filter_operators_contains";
+        readonly requiresValue: true;
+    }, {
+        readonly id: "startsWith";
+        readonly labelKey: "filter_operators_startsWith";
+        readonly requiresValue: true;
+    }, {
+        readonly id: "endsWith";
+        readonly labelKey: "filter_operators_endsWith";
+        readonly requiresValue: true;
+    }, {
+        readonly id: "isEmpty";
+        readonly labelKey: "filter_operators_isEmpty";
+        readonly requiresValue: false;
+    }, {
+        readonly id: "isNotEmpty";
+        readonly labelKey: "filter_operators_isNotEmpty";
+        readonly requiresValue: false;
+    }] | [{
+        readonly id: "isEqual";
+        readonly labelKey: "filter_operators_isEqual";
+        readonly requiresValue: true;
+    }, {
+        readonly id: "isNotEqual";
+        readonly labelKey: "filter_operators_isNotEqual";
+        readonly requiresValue: true;
+    }, {
+        readonly id: "greaterThan";
+        readonly labelKey: "filter_operators_greaterThan";
+        readonly requiresValue: true;
+    }, {
+        readonly id: "greaterThanOrEqual";
+        readonly labelKey: "filter_operators_greaterThanOrEqual";
+        readonly requiresValue: true;
+    }, {
+        readonly id: "lessThan";
+        readonly labelKey: "filter_operators_lessThan";
+        readonly requiresValue: true;
+    }, {
+        readonly id: "lessThanOrEqual";
+        readonly labelKey: "filter_operators_lessThanOrEqual";
+        readonly requiresValue: true;
+    }] | [{
+        readonly id: "isEqual";
+        readonly labelKey: "filter_operators_isEqual";
+        readonly requiresValue: true;
+    }, {
+        readonly id: "isNotEqual";
+        readonly labelKey: "filter_operators_isNotEqual";
+        readonly requiresValue: true;
+    }, {
+        readonly id: "greaterThan";
+        readonly labelKey: "filter_operators_after";
+        readonly requiresValue: true;
+    }, {
+        readonly id: "greaterThanOrEqual";
+        readonly labelKey: "filter_operators_onOrAfter";
+        readonly requiresValue: true;
+    }, {
+        readonly id: "lessThan";
+        readonly labelKey: "filter_operators_before";
+        readonly requiresValue: true;
+    }, {
+        readonly id: "lessThanOrEqual";
+        readonly labelKey: "filter_operators_onOrBefore";
+        readonly requiresValue: true;
+    }] | [{
+        readonly id: "isTrue";
+        readonly labelKey: "filter_operators_isTrue";
+        readonly requiresValue: false;
+    }, {
+        readonly id: "isFalse";
+        readonly labelKey: "filter_operators_isFalse";
+        readonly requiresValue: false;
+    }] | [{
+        readonly id: "custom";
+        readonly labelKey: "filter_operators_custom";
+        readonly requiresValue: true;
+    }] | [{
+        readonly id: "in";
+        readonly labelKey: "filter_operators_in";
+        readonly requiresValue: true;
+    }]>;
+    protected readonly operatorOptions: _angular_core.Signal<NgnItem[]>;
+    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 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;
+    /** Hides the filter popup. Only works when {@link mode} is not `inline`. */
+    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; }; "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 };
+export type { NgnFilterCondition, NgnFilterConditionConfig, NgnFilterConfig, NgnFilterDataType, NgnFilterMatchMode, NgnFilterMode, NgnFilterOperatorId, NgnFilterOutput };