@ngneers/controls 0.0.1-pre1 → 0.0.1-pre2

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

@@ -0,0 +1,101 @@
+import * as _floating_ui_dom from '@floating-ui/dom';
+import { Placement } from '@floating-ui/dom';
+import * as _angular_core from '@angular/core';
+import { TemplateRef, ElementRef } from '@angular/core';
+import * as _ngneers_controls_api_ng from '@ngneers/controls/api/ng';
+import { PositioningSizeConstraints, Openable, Anchor, PopoverCloseBy } from '@ngneers/controls/api/ng';
+import * as _ngneers_controls_themes from '@ngneers/controls-themes';
+import { NgnBase } from '@ngneers/controls/base';
+
+type PopoverOptions = {
+    /**
+     * Constraints for the size of the popover.
+     */
+    sizeConstraints?: PositioningSizeConstraints;
+    /**
+     * If true, the content of the popover will be cached and not recreated on each open.
+     * This is useful for performance when the content is expensive to create.
+     */
+    cache?: boolean;
+    /**
+     * The placement of the popover relative to the anchor element.
+     */
+    placement?: Placement;
+    /**
+     * The padding of the popover content.
+     */
+    padding?: number;
+};
+
+/**
+ * @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[]>[]>>;
+    /**
+     * Emits when the popover has fully closed.
+     */
+    readonly closed: _angular_core.OutputEmitterRef<void>;
+    /**
+     * Emits when the popover is closed.
+     */
+    readonly closing: _angular_core.OutputEmitterRef<void>;
+    /**
+     * Shows or hides the popover.
+     *
+     * You probably want to react to openChange events from outside to update your variable accordingly.
+     */
+    readonly open: _angular_core.ModelSignal<boolean>;
+    /**
+     * The element to which the popover is anchored.
+     */
+    readonly anchor: _angular_core.InputSignal<Anchor>;
+    /**
+     * The popover options.
+     */
+    readonly options: _angular_core.InputSignal<PopoverOptions | undefined>;
+    /**
+     * Set to true for scrollable/shrink-able content
+     */
+    readonly hasShrinkableContent: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * How the drawer closes depending on user interaction.
+     * @default 'any'
+     */
+    readonly closeBy: _angular_core.InputSignal<PopoverCloseBy>;
+    protected readonly lazyContent: _angular_core.Signal<TemplateRef<unknown> | undefined>;
+    protected readonly _content: _angular_core.Signal<ElementRef<HTMLElement>>;
+    protected readonly closeByPopover: _angular_core.Signal<"auto" | "manual">;
+    protected readonly isFullyClosed: _angular_core.WritableSignal<boolean>;
+    private _skipEmitCloseEvent;
+    private _triggeredByInput;
+    protected readonly appliedOptions: _angular_core.Signal<{
+        sizeConstraints?: _ngneers_controls_api_ng.PositioningSizeConstraints;
+        cache: boolean;
+        placement?: _floating_ui_dom.Placement;
+        padding?: number;
+    }>;
+    private readonly _injector;
+    private readonly _popoverRef;
+    private readonly _popover;
+    private readonly _autoPos;
+    constructor();
+    /**
+     * Opens the drawer. Alternatively, you can also set the `open` input to `true`.
+     */
+    show(): void;
+    /**
+     * Closes the drawer. Alternatively, you can also set the `open` input to `false`.
+     */
+    hide(emitCloseEvent?: boolean): void;
+    /**
+     * Toggles the drawer open or closed. Alternatively, you can also set the `open` input accordingly.
+     */
+    toggle(): void;
+    protected onToggle(event: Event): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgnPopover, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgnPopover, "ngn-popover", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "anchor": { "alias": "anchor"; "required": true; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "hasShrinkableContent": { "alias": "hasShrinkableContent"; "required": false; "isSignal": true; }; "closeBy": { "alias": "closeBy"; "required": false; "isSignal": true; }; }, { "closed": "closed"; "closing": "closing"; "open": "openChange"; }, ["lazyContent"], ["*"], true, never>;
+}
+
+export { NgnPopover };
+export type { PopoverOptions };

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

@@ -0,0 +1,44 @@
+import * as _angular_core from '@angular/core';
+import * as _ngneers_controls_api_ng from '@ngneers/controls/api/ng';
+import * as _ngneers_controls_themes from '@ngneers/controls-themes';
+import { NgnBase } from '@ngneers/controls/base';
+
+/**
+ * @category control
+ */
+declare class NgnProgress extends NgnBase<'progress'> {
+    protected readonly theme: _ngneers_controls_api_ng.ControlTemplateInfo<_ngneers_controls_themes.ControlTemplate<"progress", ["root", "svg", "track", "indeterminate", "circular", "fill", "fill2"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>>;
+    /**
+     * The current progress value (0-100).
+     */
+    readonly value: _angular_core.InputSignal<number>;
+    /**
+     * Whether the progress indicator is indeterminate.
+     */
+    readonly indeterminate: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Whether the progress indicator is circular.
+     */
+    readonly circular: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Radius of the circular progress indicator (in px).
+     */
+    readonly radius: _angular_core.InputSignal<number>;
+    /**
+     * Thickness of the circular progress indicator stroke (in px).
+     */
+    readonly thickness: _angular_core.InputSignal<number>;
+    protected readonly safeValue: _angular_core.Signal<number>;
+    protected readonly safeRadius: _angular_core.Signal<number>;
+    protected readonly safeThickness: _angular_core.Signal<number>;
+    protected readonly svgSize: _angular_core.Signal<number>;
+    protected readonly svgCenter: _angular_core.Signal<number>;
+    protected readonly circumference: _angular_core.Signal<number>;
+    protected readonly strokeDasharray: _angular_core.Signal<string>;
+    protected readonly strokeDashoffset: _angular_core.Signal<string>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgnProgress, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgnProgress, "ngn-progress", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "indeterminate": { "alias": "indeterminate"; "required": false; "isSignal": true; }; "circular": { "alias": "circular"; "required": false; "isSignal": true; }; "radius": { "alias": "radius"; "required": false; "isSignal": true; }; "thickness": { "alias": "thickness"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+export { NgnProgress };

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

@@ -0,0 +1,137 @@
+import * as _angular_core from '@angular/core';
+import { TemplateRef, AfterViewInit } from '@angular/core';
+import * as _ngneers_controls_api_ng from '@ngneers/controls/api/ng';
+import * as _ngneers_controls_themes from '@ngneers/controls-themes';
+import { AllKeysOfUnion } from '@ngneers/controls/utils';
+import { NgnBase } from '@ngneers/controls/base';
+import * as i1 from '@ngneers/controls/directives';
+
+declare abstract class ScrollerTemplates<T> extends NgnBase<'scroller'> {
+    /**
+     * The template to be used for rendering each item in the scroller.
+     * Can also be set using the `item` content child.
+     */
+    readonly templateItem: _angular_core.InputSignal<TemplateRef<{
+        $implicit: T;
+        index: number;
+    }> | null>;
+    private readonly _userItemTemplate;
+    protected readonly itemTemplate: _angular_core.Signal<TemplateRef<{
+        $implicit: T;
+        index: number;
+    }> | null>;
+    /**
+     * Template types for the scroller.
+     * Can be used with the {@link NgnTemplate} directive for type safe ng-templates.
+     */
+    readonly templateTypes: {
+        item: {
+            $implicit: T;
+            index: number;
+        };
+    } & {
+        $implicit: {
+            item: Partial<{
+                $implicit: T;
+                index: number;
+            }>;
+        };
+    };
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ScrollerTemplates<any>, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<ScrollerTemplates<any>, never, never, { "templateItem": { "alias": "templateItem"; "required": false; "isSignal": true; }; }, {}, ["_userItemTemplate"], never, true, never>;
+}
+
+/**
+ * @category control
+ */
+declare class NgnScroller<T> extends ScrollerTemplates<T> {
+    protected readonly theme: _ngneers_controls_api_ng.ControlTemplateInfo<_ngneers_controls_themes.ControlTemplate<"scroller", ["root", "virtual", "item", "spacer", "item-sticky"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>>;
+    private readonly _el;
+    private readonly _scrollAmount;
+    /**
+     * The items to be displayed in the scroller.
+     * This is a required input and should be an array of items of type {@link T}.
+     */
+    readonly items: _angular_core.InputSignal<readonly T[]>;
+    /**
+     * The field of the item that uniquely identifies it.
+     */
+    readonly fieldId: _angular_core.InputSignal<keyof T | undefined>;
+    /**
+     * Whether the scroller should use virtual scrolling.
+     * When set to true, the scroller will only render the items that are currently visible
+     * on the screen, improving performance for large lists.
+     *
+     * When virtual scrolling is enabled, {@link itemHeight} must be set to a non-zero value.
+     * @default `false`
+     */
+    readonly virtual: _angular_core.InputSignal<boolean | undefined>;
+    /**
+     * When {@link virtual} scrolling is enabled, this input is required to define the height of each item in pixels.
+     */
+    readonly itemHeight: _angular_core.InputSignal<number | undefined>;
+    /**
+     * When {@link virtual} scrolling is enabled, this input defines the number of items to be rendered above and below the visible area.
+     * This can help to reduce flickering when scrolling.
+     * @default `2`
+     */
+    readonly virtualPadding: _angular_core.InputSignal<number>;
+    /**
+     * Determines whether the scroller should have a tab index and be focusable.
+     * @default `false`
+     */
+    readonly focusable: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Determines whether an item is sticky or not.
+     * 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;
+    private readonly _itemHeightPx;
+    private readonly _visibleItemCount;
+    private readonly _scrollTop;
+    /**
+     * The index of the first item that is rendered in the (virtual) scroller.
+     */
+    readonly itemStartIndex: _angular_core.Signal<number>;
+    private readonly _itemEndIndex;
+    protected readonly paddingTop: _angular_core.Signal<number>;
+    protected readonly paddingBottom: _angular_core.Signal<number>;
+    protected readonly visibleItems: _angular_core.Signal<{
+        item: T;
+        index: number;
+    }[]>;
+    /**
+     * Returns the last sticky item that is not rendered regularly in the list.
+     * Required because sticky items might need to be rendered longer than they would.
+     * Only applicable when virtual scrolling is enabled.
+     */
+    protected readonly latestStickyItem: _angular_core.Signal<{
+        item: T;
+        index: number;
+    } | null>;
+    constructor();
+    /**
+     * Scrolls the item with the given index into view.
+     * @param index The index of the item to scroll to.
+     */
+    scrollToIndex(index: number, position?: ScrollLogicalPosition): void;
+    protected track(item: {
+        item: 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: {}; }]>;
+}
+
+declare class NgnScrollerItem implements AfterViewInit {
+    private readonly _el;
+    readonly ngnScrollerItem: _angular_core.InputSignal<object>;
+    private readonly _scroller;
+    ngAfterViewInit(): void;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgnScrollerItem, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NgnScrollerItem, "[ngnScrollerItem]", never, { "ngnScrollerItem": { "alias": "ngnScrollerItem"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+export { NgnScroller, NgnScrollerItem };

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

@@ -0,0 +1,37 @@
+import * as _angular_core from '@angular/core';
+import * as _ngneers_controls_api_ng from '@ngneers/controls/api/ng';
+import * as _ngneers_controls_themes from '@ngneers/controls-themes';
+import { ValueControlBase } from '@ngneers/controls/base';
+import { maybeCallback } from '@ngneers/controls/utils';
+import { NgnActionItemFlat, NgnItem } from '@ngneers/controls/api';
+
+/**
+ * @category control
+ */
+declare class NgnSelectButton<V> extends ValueControlBase<'selectButton', V> {
+    protected readonly theme: _ngneers_controls_api_ng.ControlTemplateInfo<_ngneers_controls_themes.ControlTemplate<"select-button", ["root", "button", "invalid"], readonly _ngneers_controls_themes.ControlTemplate<string, string[], readonly any[]>[]>>;
+    /**
+     * Defines the orientation of the select buttons.
+     * - 'auto' - The orientation is determined based on the available space.
+     * - 'horizontal' - The buttons are arranged horizontally. (Default for `auto` if enough space)
+     * - 'vertical' - The buttons are arranged vertically.
+     * @default 'auto'
+     */
+    readonly orientation: _angular_core.InputSignal<"vertical" | "horizontal" | "auto">;
+    /**
+     * Defines the options for the select button.
+     */
+    readonly options: _angular_core.InputSignal<readonly NgnActionItemFlat<NgnItem<unknown, V>>[]>;
+    /**
+     * When `true`, allows unselecting the currently selected option by clicking on it again.
+     * If `false`, clicking on the selected option will not change the selection.
+     * @default false
+     */
+    readonly allowUnselect: _angular_core.InputSignal<boolean>;
+    protected readonly maybeCallback: typeof maybeCallback;
+    protected valueChange(value: V): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgnSelectButton<any>, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgnSelectButton<any>, "ngn-select-button", never, { "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": true; "isSignal": true; }; "allowUnselect": { "alias": "allowUnselect"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+export { NgnSelectButton };

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

@@ -0,0 +1,314 @@
+import * as _angular_core from '@angular/core';
+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 { PopoverOptions } from '@ngneers/controls/popover';
+import { InputGeneric, maybeCallback } from '@ngneers/controls/utils';
+import { ValueControlBase } from '@ngneers/controls/base';
+
+/**
+ * This type determines the value type for the select control.
+ * * If `multiple` is true, the value is an array of items: `T[K][]`.
+ * * If `editable` is true, the value is a `string`.
+ * * If neither is true, the value is the item's value type `T[K]`.
+ */
+type ValueType<V, Editable extends boolean, Multiple extends boolean> = InputGeneric<Multiple, false> extends true ? V[] : InputGeneric<Editable, false> extends true ? string : V;
+declare abstract class SelectTemplates<V, Editable extends boolean, Multiple extends boolean> extends ValueControlBase<'select', ValueType<V, Editable, Multiple> | null> {
+    private readonly _defaultItemTemplate;
+    private readonly _userItemTemplate;
+    /**
+     * Set a custom template for an item of the select control.
+     * Can also be set using an `<ng-template>` element with `#item` template reference variable.
+     */
+    readonly templateItem: _angular_core.InputSignal<TemplateRef<{
+        $implicit: NgnItem<unknown, V> | undefined;
+    }> | null>;
+    protected readonly itemTemplate: _angular_core.Signal<TemplateRef<{
+        $implicit: NgnItem<unknown, V> | undefined;
+    }>>;
+    private readonly _defaultSelectedItemTemplate;
+    private readonly _userSelectedItemTemplate;
+    /**
+     * Set a custom template for the selected item of the select control.
+     * Can also be set using an `<ng-template>` element with `#selectedItem` template reference variable.
+     */
+    readonly templateSelectedItem: _angular_core.InputSignal<TemplateRef<{
+        $implicit: NgnItem<unknown, V> | undefined;
+    }> | null>;
+    protected readonly selectedItemTemplate: _angular_core.Signal<TemplateRef<{
+        $implicit: NgnItem<unknown, V> | undefined;
+    }>>;
+    private readonly _defaultSelectedItemsTemplate;
+    private readonly _userSelectedItemsTemplate;
+    /**
+     * Set a custom template for the selected items of the select control if {@link multiple} is `true`.
+     * Can also be set using an `<ng-template>` element with `#selectedItems` template reference variable.
+     */
+    readonly templateSelectedItems: _angular_core.InputSignal<TemplateRef<{
+        $implicit: NgnItem<unknown, V>[];
+    }> | null>;
+    protected readonly selectedItemsTemplate: _angular_core.Signal<TemplateRef<{
+        $implicit: NgnItem<unknown, V>[];
+    }>>;
+    private readonly _defaultGroupTemplate;
+    private readonly _userGroupTemplate;
+    /**
+     * Set a custom template for a group in the select control.
+     * Can also be set using an `<ng-template>` element with `#group` template reference variable.
+     */
+    readonly templateGroup: _angular_core.InputSignal<TemplateRef<{
+        $implicit: NgnItem<unknown, V> | undefined;
+    }> | null>;
+    protected readonly groupTemplate: _angular_core.Signal<TemplateRef<{
+        $implicit: NgnItem<unknown, V> | undefined;
+    }>>;
+    private readonly _userNoItemsTemplate;
+    /**
+     * Set a custom template for the no items state of the select control.
+     * Can also be set using an `<ng-template>` element with `#noItems` template reference variable.
+     */
+    readonly templateNoItems: _angular_core.InputSignal<TemplateRef<unknown> | null>;
+    protected readonly noItemsTemplate: _angular_core.Signal<TemplateRef<unknown> | null>;
+    /**
+     * Types for the dialog templates.
+     */
+    readonly templateTypes: {
+        item: {
+            $implicit: NgnItem<unknown, V> | undefined;
+        };
+        selectedItems: {
+            $implicit: NgnItem<unknown, V>[];
+        };
+    } & {
+        $implicit: {
+            item: Partial<{
+                $implicit: NgnItem<unknown, V> | undefined;
+            }>;
+            selectedItems: Partial<{
+                $implicit: NgnItem<unknown, V>[];
+            }>;
+        };
+    };
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SelectTemplates<any, any, any>, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<SelectTemplates<any, any, any>, never, never, { "templateItem": { "alias": "templateItem"; "required": false; "isSignal": true; }; "templateSelectedItem": { "alias": "templateSelectedItem"; "required": false; "isSignal": true; }; "templateSelectedItems": { "alias": "templateSelectedItems"; "required": false; "isSignal": true; }; "templateGroup": { "alias": "templateGroup"; "required": false; "isSignal": true; }; "templateNoItems": { "alias": "templateNoItems"; "required": false; "isSignal": true; }; }, {}, ["_userItemTemplate", "_userSelectedItemTemplate", "_userSelectedItemsTemplate", "_userGroupTemplate", "_userNoItemsTemplate"], never, true, never>;
+}
+
+type _SelectFilterOptions = {
+    clearFilterOnClose?: boolean;
+};
+type SelectFilterOptions<T extends object> = _SelectFilterOptions & FilterConfig<T>;
+type SelectFilterOptionsInternal<T extends object> = _SelectFilterOptions & FilterConfigInternal<T>;
+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", "spacer", "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;
+            selectYear: 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;
+        };
+        filter: {
+            noFilter: string;
+            addCondition: string;
+            removeCondition: string;
+            clear: string;
+            matchModeLabel: string;
+            match: {
+                all: string;
+                any: 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;
+        };
+        drawer: {
+            close: string;
+        };
+    }, "_">;
+    private readonly _popover;
+    private readonly _customEditableInput;
+    private _customEditableSub?;
+    /**
+     * Options for the popover.
+     */
+    readonly popoverOptions: _angular_core.InputSignal<PopoverOptions>;
+    protected readonly appliedPopoverOptions: Signal<{
+        sizeConstraints: {
+            width: number;
+            maxWidth: number;
+            minHeight: string;
+            maxHeight: string;
+        };
+    } & PopoverOptions>;
+    /**
+     * The available options to choose from. They can either be
+     * * A list of {@link NgnItem} objects
+     * * A list of plain objects. You'll have to provide a {@link fields} input to specify how to map the plain objects to {@link NgnItem} objects.
+     */
+    readonly options: _angular_core.InputSignal<readonly NgnItem<unknown, V>[]>;
+    /**
+     * Accepts a boolean value that determines whether the filter is enabled.
+     * Alternatively, you can provide `SelectFilterOptions` to customize the filter behavior.
+     * @default `false`
+     */
+    readonly filter: _angular_core.InputSignal<boolean | SelectFilterOptions<NgnItem<unknown, V>>>;
+    /**
+     * Manually set the filter text.
+     */
+    readonly filterText: _angular_core.InputSignal<string | null>;
+    /**
+     * The icon to display in the filter input.
+     */
+    readonly filterIcon: _angular_core.InputSignal<string | undefined>;
+    /**
+     * The icon to display in the dropdown.
+     */
+    readonly dropdownIcon: _angular_core.InputSignal<string | undefined>;
+    /**
+     * Whether the select is virtualized.
+     * @default `false`
+     */
+    readonly virtual: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * When {@link virtual} is enabled, this property defines the height of each item in the list.
+     */
+    readonly itemHeight: _angular_core.InputSignal<number | undefined>;
+    /**
+     * Enable this to allow the user to type in a value that is not in the list.
+     * When enabled, the value of the control becomes the label of a selected item or the typed value.
+     *
+     * Cannot be used with
+     * * {@link multiple} selection
+     * * {@link filter} without also setting {@link editableAutoFilter} to `false`
+     *
+     * @default `false`
+     */
+    readonly editable: _angular_core.InputSignal<Editable | undefined>;
+    /**
+     * Whether to automatically filter the options based on the user's input in the {@link editable} input.
+     * @default `true`
+     */
+    readonly editableAutoFilter: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Enable this to allow the user to select multiple values.
+     * When enabled, the value of the control becomes an array of selected items.
+     *
+     * This is only applicable when {@link editable} is `false`.
+     * @default `false`
+     */
+    readonly multiple: _angular_core.InputSignal<Multiple | undefined>;
+    /**
+     * Whether to scroll to the selected item when the dropdown is opened.
+     * @default `true`
+     */
+    readonly scrollToSelectedItemOnOpen: _angular_core.InputSignal<boolean | ScrollLogicalPosition>;
+    /**
+     * Tabindex for the select control.
+     * @default `0`
+     */
+    readonly tabindex: _angular_core.InputSignal<number>;
+    /**
+     * Whether to use a checkbox to indicate selection state.
+     *
+     * This option is true per default when {@link multiple} is `true`.
+     * @default multiple()
+     */
+    readonly checkbox: _angular_core.InputSignal<boolean | undefined>;
+    protected readonly maybeCallback: typeof maybeCallback;
+    private readonly _listbox;
+    private _userChangedEditableInput;
+    protected readonly filterTextInternal: _angular_core.WritableSignal<string | null>;
+    protected readonly currentHighlightedValue: _angular_core.WritableSignal<V | null>;
+    protected readonly valueStr: Signal<(ValueType<V, Editable, Multiple> & string) | null>;
+    protected readonly valueArray: Signal<(ValueType<V, Editable, Multiple> & any[]) | NonNullable<ValueType<V, Editable, Multiple>>[]>;
+    protected readonly appliedFilter: Signal<FilterConfig<NgnItem> | boolean>;
+    private readonly _flatOptions;
+    protected readonly selectedItems: Signal<(NgnItem<any, any> | undefined)[]>;
+    protected readonly selectedItemsValues: Signal<any[]>;
+    constructor();
+    protected onKeyDown(event: KeyboardEvent): void;
+    protected onPopoverClosed(): void;
+    protected onSelect(value: ValueType<V, false, Multiple> | null): void;
+    protected onItemClicked(): void;
+    /**
+     * Shows the select dropdown.
+     */
+    show(): void;
+    /**
+     * Hides the select dropdown.
+     */
+    hide(): void;
+    protected onEditableChange(value: string | null): void;
+    protected potentiallyBlurred(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgnSelect<any, any, any>, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgnSelect<any, any, any>, "ngn-select", never, { "popoverOptions": { "alias": "popoverOptions"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "filter": { "alias": "filter"; "required": false; "isSignal": true; }; "filterText": { "alias": "filterText"; "required": false; "isSignal": true; }; "filterIcon": { "alias": "filterIcon"; "required": false; "isSignal": true; }; "dropdownIcon": { "alias": "dropdownIcon"; "required": false; "isSignal": true; }; "virtual": { "alias": "virtual"; "required": false; "isSignal": true; }; "itemHeight": { "alias": "itemHeight"; "required": false; "isSignal": true; }; "editable": { "alias": "editable"; "required": false; "isSignal": true; }; "editableAutoFilter": { "alias": "editableAutoFilter"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "scrollToSelectedItemOnOpen": { "alias": "scrollToSelectedItemOnOpen"; "required": false; "isSignal": true; }; "tabindex": { "alias": "tabindex"; "required": false; "isSignal": true; }; "checkbox": { "alias": "checkbox"; "required": false; "isSignal": true; }; }, {}, ["_customEditableInput"], ["[ngnInput]"], true, never>;
+}
+
+export { NgnSelect };
+export type { SelectFilterFn, SelectFilterOptions, SelectFilterOptionsInternal };