@spartan-ng/brain 0.0.1-alpha.613 → 0.0.1-alpha.628

package/autocomplete/index.d.ts

@@ -56,6 +56,7 @@ type AutocompleteItemToString<T> = (itemValue: T) => string;
 interface BrnAutocompleteConfig<T> {
     isItemEqualToValue: AutocompleteItemEqualToValue<T>;
     itemToString?: AutocompleteItemToString<T>;
+    autoHighlight: boolean;
 }
 declare function provideBrnAutocompleteConfig<T>(config: Partial<BrnAutocompleteConfig<T>>): ValueProvider;
 declare function injectBrnAutocompleteConfig<T>(): BrnAutocompleteConfig<T>;
@@ -79,6 +80,8 @@ declare class BrnAutocomplete<T> implements BrnAutocompleteBase<T>, ControlValue
     readonly isItemEqualToValue: _angular_core.InputSignal<AutocompleteItemEqualToValue<T>>;
     /** A function to convert an item to a string for display. */
     readonly itemToString: _angular_core.InputSignal<AutocompleteItemToString<T> | undefined>;
+    /** Whether to auto-highlight the first matching item. */
+    readonly autoHighlight: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
     /** The selected value of the autocomplete. */
     readonly value: _angular_core.ModelSignal<T | null>;
     /** The current search query. */
@@ -112,7 +115,7 @@ declare class BrnAutocomplete<T> implements BrnAutocompleteBase<T>, ControlValue
     registerOnTouched(fn: TouchFn): void;
     setDisabledState(isDisabled: boolean): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<BrnAutocomplete<any>, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BrnAutocomplete<any>, "[brnAutocomplete]", never, { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "isItemEqualToValue": { "alias": "isItemEqualToValue"; "required": false; "isSignal": true; }; "itemToString": { "alias": "itemToString"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "search": { "alias": "search"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "search": "searchChange"; }, ["_searchInputWrapper", "items"], never, true, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BrnAutocomplete<any>, "[brnAutocomplete]", never, { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "isItemEqualToValue": { "alias": "isItemEqualToValue"; "required": false; "isSignal": true; }; "itemToString": { "alias": "itemToString"; "required": false; "isSignal": true; }; "autoHighlight": { "alias": "autoHighlight"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "search": { "alias": "search"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "search": "searchChange"; }, ["_searchInputWrapper", "items"], never, true, never>;
 }
 
 declare class BrnAutocompleteAnchor {
@@ -219,6 +222,8 @@ declare class BrnAutocompleteSearch<T> implements BrnAutocompleteBase<T>, Contro
     readonly disabledState: _angular_core.Signal<boolean>;
     /** A function to convert an item to a string for display. */
     readonly itemToString: _angular_core.InputSignal<AutocompleteItemToString<T> | undefined>;
+    /** Whether to auto-highlight the first matching item. */
+    readonly autoHighlight: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
     /** The selected value of the autocomplete. */
     readonly value: _angular_core.ModelSignal<string | null>;
     /** The current search query. */
@@ -252,7 +257,7 @@ declare class BrnAutocompleteSearch<T> implements BrnAutocompleteBase<T>, Contro
     registerOnTouched(fn: TouchFn): void;
     setDisabledState(isDisabled: boolean): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<BrnAutocompleteSearch<any>, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BrnAutocompleteSearch<any>, "[brnAutocomplete]", never, { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "itemToString": { "alias": "itemToString"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "search": { "alias": "search"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "search": "searchChange"; }, ["_searchInputWrapper", "items"], never, true, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BrnAutocompleteSearch<any>, "[brnAutocomplete]", never, { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "itemToString": { "alias": "itemToString"; "required": false; "isSignal": true; }; "autoHighlight": { "alias": "autoHighlight"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "search": { "alias": "search"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "search": "searchChange"; }, ["_searchInputWrapper", "items"], never, true, never>;
 }
 
 declare class BrnAutocompleteSeparator {

package/combobox/index.d.ts

@@ -32,6 +32,7 @@ declare class BrnComboboxItem<T> implements Highlightable {
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BrnComboboxItem<any>, "[brnComboboxItem]", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": true; "isSignal": true; }; "_disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
+type ComboboxInputMode = 'combobox' | 'popup';
 interface BrnComboboxBase<T> {
     filter: InputSignal<ComboboxFilter<T>>;
     itemToString: InputSignal<ComboboxItemToString<T> | undefined>;
@@ -44,15 +45,19 @@ interface BrnComboboxBase<T> {
     visibleItems: Signal<boolean>;
     isExpanded: Signal<boolean>;
     searchInputWrapperWidth: Signal<number | null>;
+    mode: Signal<ComboboxInputMode>;
     isSelected: (itemValue: T) => boolean;
     select: (itemValue: T) => void;
     open: () => void;
     resetValue: () => void;
+    resetSearch: () => void;
     /** Select the active item with Enter key. */
     selectActiveItem: () => void;
     /** Remove last selected item with Backspace key. Only works with multiple selection comboboxes. */
     removeLastSelectedItem: () => void;
     removeValue: (value: T) => void;
+    /** Register the combobox input component for single selection mode */
+    registerComboboxInput?: (input: BrnComboboxInput<T>) => void;
 }
 declare const BrnComboboxBaseToken: InjectionToken<BrnComboboxBase<unknown>>;
 declare function provideBrnComboboxBase<T>(instance: Type<BrnComboboxBase<T>>): ExistingProvider;
@@ -75,10 +80,30 @@ interface BrnComboboxConfig<T> {
     filter: ComboboxFilter<T>;
     isItemEqualToValue: ComboboxItemEqualToValue<T>;
     itemToString?: ComboboxItemToString<T>;
+    autoHighlight: boolean;
 }
 declare function provideBrnComboboxConfig<T>(config: Partial<BrnComboboxConfig<T>>): ValueProvider;
 declare function injectBrnComboboxConfig<T>(): BrnComboboxConfig<T>;
 
+declare class BrnComboboxInput<T> {
+    private static _id;
+    private readonly _el;
+    private readonly _combobox;
+    private readonly _content;
+    readonly mode: _angular_core.Signal<ComboboxInputMode>;
+    /** The id of the combobox input */
+    readonly id: _angular_core.InputSignal<string>;
+    readonly disabled: _angular_core.Signal<boolean>;
+    /** Whether the combobox panel is expanded */
+    protected readonly _isExpanded: _angular_core.Signal<boolean>;
+    constructor();
+    protected onInput(event: Event): void;
+    /** Listen for keydown events */
+    protected onKeyDown(event: KeyboardEvent): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<BrnComboboxInput<any>, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BrnComboboxInput<any>, "input[brnComboboxInput]", ["brnComboboxInput"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
 declare const BRN_COMBOBOX_VALUE_ACCESSOR: {
     provide: _angular_core.InjectionToken<readonly ControlValueAccessor[]>;
     useExisting: _angular_core.Type<any>;
@@ -104,6 +129,8 @@ declare class BrnCombobox<T> implements BrnComboboxBase<T>, ControlValueAccessor
     readonly itemToString: _angular_core.InputSignal<ComboboxItemToString<T> | undefined>;
     /** A custom filter function to use when searching. */
     readonly filter: _angular_core.InputSignal<ComboboxFilter<T>>;
+    /** Whether to auto-highlight the first matching item. */
+    readonly autoHighlight: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
     /** The selected value of the combobox. */
     readonly value: _angular_core.ModelSignal<T | null>;
     /** The current search query. */
@@ -119,14 +146,18 @@ declare class BrnCombobox<T> implements BrnComboboxBase<T>, ControlValueAccessor
     readonly keyManager: ActiveDescendantKeyManager<BrnComboboxItem<T>>;
     /** @internal Whether the combobox is expanded */
     readonly isExpanded: _angular_core.Signal<boolean>;
+    private readonly _comboboxInput;
+    readonly mode: _angular_core.Signal<ComboboxInputMode>;
     protected _onChange?: ChangeFn<T | null>;
     protected _onTouched?: TouchFn;
     constructor();
+    registerComboboxInput(input: BrnComboboxInput<T>): void;
     isSelected(itemValue: T): boolean;
     select(itemValue: T): void;
     /** Select the active item with Enter key. */
     selectActiveItem(): void;
     resetValue(): void;
+    resetSearch(): void;
     removeValue(_: T): void;
     removeLastSelectedItem(): void;
     open(): void;
@@ -137,7 +168,7 @@ declare class BrnCombobox<T> implements BrnComboboxBase<T>, ControlValueAccessor
     registerOnTouched(fn: TouchFn): void;
     setDisabledState(isDisabled: boolean): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<BrnCombobox<any>, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BrnCombobox<any>, "[brnCombobox]", never, { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "filterOptions": { "alias": "filterOptions"; "required": false; "isSignal": true; }; "isItemEqualToValue": { "alias": "isItemEqualToValue"; "required": false; "isSignal": true; }; "itemToString": { "alias": "itemToString"; "required": false; "isSignal": true; }; "filter": { "alias": "filter"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "search": { "alias": "search"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "search": "searchChange"; }, ["_searchInputWrapper", "items"], never, true, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BrnCombobox<any>, "[brnCombobox]", never, { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "filterOptions": { "alias": "filterOptions"; "required": false; "isSignal": true; }; "isItemEqualToValue": { "alias": "isItemEqualToValue"; "required": false; "isSignal": true; }; "itemToString": { "alias": "itemToString"; "required": false; "isSignal": true; }; "filter": { "alias": "filter"; "required": false; "isSignal": true; }; "autoHighlight": { "alias": "autoHighlight"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "search": { "alias": "search"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "search": "searchChange"; }, ["_searchInputWrapper", "items"], never, true, never>;
 }
 
 declare class BrnComboboxAnchor {
@@ -222,25 +253,6 @@ declare class BrnComboboxGroup {
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BrnComboboxGroup, "[brnComboboxGroup]", never, {}, {}, ["_items", "_label"], never, true, never>;
 }
 
-declare class BrnComboboxInput<T> {
-    private static _id;
-    private readonly _el;
-    private readonly _combobox;
-    private readonly _content;
-    private readonly _mode;
-    /** The id of the combobox input */
-    readonly id: _angular_core.InputSignal<string>;
-    readonly disabled: _angular_core.Signal<boolean>;
-    /** Whether the combobox panel is expanded */
-    protected readonly _isExpanded: _angular_core.Signal<boolean>;
-    constructor();
-    protected onInput(event: Event): void;
-    /** Listen for keydown events */
-    protected onKeyDown(event: KeyboardEvent): void;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<BrnComboboxInput<any>, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BrnComboboxInput<any>, "input[brnComboboxInput]", ["brnComboboxInput"], { "id": { "alias": "id"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
-}
-
 declare class BrnComboboxInputWrapper {
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<BrnComboboxInputWrapper, never>;
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BrnComboboxInputWrapper, "[brnComboboxInputWrapper]", never, {}, {}, never, never, true, never>;
@@ -290,6 +302,8 @@ declare class BrnComboboxMultiple<T> implements BrnComboboxBase<T>, ControlValue
     readonly itemToString: _angular_core.InputSignal<ComboboxItemToString<T> | undefined>;
     /** A custom filter function to use when searching. */
     readonly filter: _angular_core.InputSignal<ComboboxFilter<T>>;
+    /** Whether to auto-highlight the first matching item. */
+    readonly autoHighlight: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
     /** The selected values of the combobox. */
     readonly value: _angular_core.ModelSignal<T[] | null>;
     /** The current search query. */
@@ -304,6 +318,7 @@ declare class BrnComboboxMultiple<T> implements BrnComboboxBase<T>, ControlValue
     readonly keyManager: ActiveDescendantKeyManager<BrnComboboxItem<T>>;
     /** @internal Whether the autocomplete is expanded */
     readonly isExpanded: _angular_core.Signal<boolean>;
+    readonly mode: _angular_core.Signal<ComboboxInputMode>;
     protected _onChange?: ChangeFn<T[] | null>;
     protected _onTouched?: TouchFn;
     constructor();
@@ -312,6 +327,7 @@ declare class BrnComboboxMultiple<T> implements BrnComboboxBase<T>, ControlValue
     /** Select the active item with Enter key. */
     selectActiveItem(): void;
     resetValue(): void;
+    resetSearch(): void;
     removeValue(itemValue: T): void;
     removeLastSelectedItem(): void;
     open(): void;
@@ -322,7 +338,7 @@ declare class BrnComboboxMultiple<T> implements BrnComboboxBase<T>, ControlValue
     registerOnTouched(fn: TouchFn): void;
     setDisabledState(isDisabled: boolean): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<BrnComboboxMultiple<any>, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BrnComboboxMultiple<any>, "[brnCombobox]", never, { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "filterOptions": { "alias": "filterOptions"; "required": false; "isSignal": true; }; "isItemEqualToValue": { "alias": "isItemEqualToValue"; "required": false; "isSignal": true; }; "itemToString": { "alias": "itemToString"; "required": false; "isSignal": true; }; "filter": { "alias": "filter"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "search": { "alias": "search"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "search": "searchChange"; }, ["_searchInputWrapper", "items"], never, true, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BrnComboboxMultiple<any>, "[brnCombobox]", never, { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "filterOptions": { "alias": "filterOptions"; "required": false; "isSignal": true; }; "isItemEqualToValue": { "alias": "isItemEqualToValue"; "required": false; "isSignal": true; }; "itemToString": { "alias": "itemToString"; "required": false; "isSignal": true; }; "filter": { "alias": "filter"; "required": false; "isSignal": true; }; "autoHighlight": { "alias": "autoHighlight"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "search": { "alias": "search"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "search": "searchChange"; }, ["_searchInputWrapper", "items"], never, true, never>;
 }
 
 declare class BrnComboboxPopoverTrigger<T> {
@@ -374,9 +390,9 @@ declare const comboboxStartsWithFilter: BrnComboboxFilter;
 declare const comboboxEndsWithFilter: BrnComboboxFilter;
 
 declare const BrnComboboxItemToken: InjectionToken<BrnComboboxItem<unknown>>;
-declare function provideBrnComboboxItem<T>(Combobox: Type<BrnComboboxItem<T>>): ExistingProvider;
+declare function provideBrnComboboxItem<T>(comboboxItem: Type<BrnComboboxItem<T>>): ExistingProvider;
 
 declare const BrnComboboxImports: readonly [typeof BrnCombobox, typeof BrnComboboxAnchor, typeof BrnComboboxChip, typeof BrnComboboxChipInput, typeof BrnComboboxChipRemove, typeof BrnComboboxClear, typeof BrnComboboxContent, typeof BrnComboboxEmpty, typeof BrnComboboxGroup, typeof BrnComboboxInputWrapper, typeof BrnComboboxInput, typeof BrnComboboxItem, typeof BrnComboboxLabel, typeof BrnComboboxList, typeof BrnComboboxMultiple, typeof BrnComboboxPopoverTrigger, typeof BrnComboboxSeparator, typeof BrnComboboxStatus, typeof BrnComboboxTrigger, typeof BrnComboboxValue, typeof BrnComboboxValues];
 
 export { BRN_COMBOBOX_MULTIPLE_VALUE_ACCESSOR, BRN_COMBOBOX_VALUE_ACCESSOR, BrnCombobox, BrnComboboxAnchor, BrnComboboxBaseToken, BrnComboboxChip, BrnComboboxChipInput, BrnComboboxChipRemove, BrnComboboxClear, BrnComboboxContent, BrnComboboxEmpty, BrnComboboxGroup, BrnComboboxImports, BrnComboboxInput, BrnComboboxInputWrapper, BrnComboboxItem, BrnComboboxItemToken, BrnComboboxLabel, BrnComboboxList, BrnComboboxMultiple, BrnComboboxPopoverTrigger, BrnComboboxSeparator, BrnComboboxStatus, BrnComboboxTrigger, BrnComboboxValue, BrnComboboxValues, comboboxContainsFilter, comboboxEndsWithFilter, comboboxStartsWithFilter, injectBrnComboboxBase, injectBrnComboboxConfig, provideBrnComboboxBase, provideBrnComboboxConfig, provideBrnComboboxItem };
-export type { BrnComboboxBase, BrnComboboxConfig, BrnComboboxFilter, ComboboxFilter, ComboboxFilterOptions, ComboboxItemEqualToValue, ComboboxItemToString };
+export type { BrnComboboxBase, BrnComboboxConfig, BrnComboboxFilter, ComboboxFilter, ComboboxFilterOptions, ComboboxInputMode, ComboboxItemEqualToValue, ComboboxItemToString };

package/command/index.d.ts

@@ -3,7 +3,8 @@ import * as _angular_core from '@angular/core';
 import { InjectionToken, Type, ExistingProvider, ValueProvider, OnInit } from '@angular/core';
 import { ActiveDescendantKeyManager, Highlightable } from '@angular/cdk/a11y';
 import { BooleanInput } from '@angular/cdk/coercion';
-import { DefaultValueAccessor } from '@angular/forms';
+import { ControlValueAccessor } from '@angular/forms';
+import { ChangeFn, TouchFn } from '@spartan-ng/brain/forms';
 
 declare const BrnCommandToken: InjectionToken<BrnCommand>;
 declare function provideBrnCommand(command: Type<BrnCommand>): ExistingProvider;
@@ -15,7 +16,12 @@ interface BrnCommandConfig {
 declare function provideBrnCommandConfig(config: Partial<BrnCommandConfig>): ValueProvider;
 declare function injectBrnCommandConfig(): BrnCommandConfig;
 
-declare class BrnCommand {
+declare const BRN_COMMAND_VALUE_ACCESSOR: {
+    provide: _angular_core.InjectionToken<readonly ControlValueAccessor[]>;
+    useExisting: _angular_core.Type<any>;
+    multi: boolean;
+};
+declare class BrnCommand implements ControlValueAccessor {
     private static _id;
     private readonly _injector;
     private readonly _config;
@@ -23,20 +29,30 @@ declare class BrnCommand {
     readonly id: _angular_core.InputSignal<string>;
     /** A custom filter function to use when searching. */
     readonly filter: _angular_core.InputSignal<CommandFilter>;
+    /** Whether the command is disabled */
+    readonly disabled: _angular_core.InputSignalWithTransform<boolean, BooleanInput>;
+    private readonly _disabled;
+    /** @internal The disabled state as a readonly signal */
+    readonly disabledState: _angular_core.Signal<boolean>;
     /** when the selection has changed */
     readonly valueChange: _angular_core.OutputEmitterRef<string>;
-    /** @internal The search query */
-    readonly search: _angular_core.Signal<string>;
-    /** Access the search input if present */
-    private readonly _searchInput;
+    /** The current search query. */
+    readonly search: _angular_core.ModelSignal<string>;
     /** @internal Access all the items within the command */
     readonly items: _angular_core.Signal<readonly _spartan_ng_brain_command.BrnCommandItem[]>;
     /** @internal The key manager for managing active descendant */
     readonly keyManager: ActiveDescendantKeyManager<_spartan_ng_brain_command.BrnCommandItem>;
+    protected _onChange?: ChangeFn<string | null>;
+    protected _onTouched?: TouchFn;
     constructor();
     protected selectActiveItem(): void;
+    /** CONTROL VALUE ACCESSOR */
+    writeValue(value: string | null): void;
+    registerOnChange(fn: ChangeFn<string | null>): void;
+    registerOnTouched(fn: TouchFn): void;
+    setDisabledState(isDisabled: boolean): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<BrnCommand, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BrnCommand, "[brnCommand]", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "filter": { "alias": "filter"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; }, ["_searchInput", "items"], never, true, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BrnCommand, "[brnCommand]", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "filter": { "alias": "filter"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "search": { "alias": "search"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; "search": "searchChange"; }, ["items"], never, true, never>;
 }
 
 declare class BrnCommandEmpty {
@@ -62,6 +78,25 @@ declare class BrnCommandGroup {
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BrnCommandGroup, "[brnCommandGroup]", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; }, {}, ["_items"], never, true, never>;
 }
 
+declare class BrnCommandInput {
+    private static _id;
+    private readonly _el;
+    private readonly _command;
+    private readonly _initialId;
+    /** The id of the command input */
+    readonly id: _angular_core.InputSignalWithTransform<string, string | undefined>;
+    protected readonly _disabled: _angular_core.Signal<boolean>;
+    /** The id of the active option */
+    protected readonly _activeDescendant: _angular_core.WritableSignal<string | undefined>;
+    constructor();
+    /** Listen for changes to the input value */
+    protected onInput(): void;
+    /** Listen for keydown events */
+    protected onKeyDown(event: KeyboardEvent): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<BrnCommandInput, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BrnCommandInput, "input[brnCommandInput]", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
 declare class BrnCommandItem implements Highlightable, OnInit {
     private static _id;
     private readonly _platform;
@@ -109,30 +144,6 @@ declare class BrnCommandList {
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BrnCommandList, "[brnCommandList]", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
-declare class BrnCommandSearchInput extends DefaultValueAccessor implements OnInit {
-    private readonly _destroyRef;
-    private readonly _el;
-    private readonly _injector;
-    private readonly _command;
-    /** The initial value of the search input */
-    readonly value: _angular_core.InputSignal<string>;
-    /** @internal The mutable value of the search input */
-    readonly mutableValue: _angular_core.WritableSignal<string>;
-    /** @internal The "real" value of the search input */
-    readonly valueState: _angular_core.Signal<string>;
-    /** The id of the active option */
-    protected readonly _activeDescendant: _angular_core.WritableSignal<string | undefined>;
-    ngOnInit(): void;
-    /** Listen for changes to the input value */
-    protected onInput(): void;
-    /** Listen for keydown events */
-    protected onKeyDown(event: KeyboardEvent): void;
-    /** CONROL VALUE ACCESSOR */
-    writeValue(value: string | null): void;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<BrnCommandSearchInput, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BrnCommandSearchInput, "input[brnCommandSearchInput]", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
-}
-
 declare class BrnCommandSeparator {
     private readonly _command;
     /** Determine if the command has any visible items */
@@ -141,13 +152,13 @@ declare class BrnCommandSeparator {
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BrnCommandSeparator, "[brnCommandSeparator]", never, {}, {}, never, never, true, never>;
 }
 
+declare const BrnCommandInputToken: InjectionToken<BrnCommandInput>;
+declare function provideBrnCommandInput(command: Type<BrnCommandInput>): ExistingProvider;
+
 declare const BrnCommandItemToken: InjectionToken<BrnCommandItem>;
 declare function provideBrnCommandItem(command: Type<BrnCommandItem>): ExistingProvider;
 
-declare const BrnCommandSearchInputToken: InjectionToken<BrnCommandSearchInput>;
-declare function provideBrnCommandSearchInput(command: Type<BrnCommandSearchInput>): ExistingProvider;
-
-declare const BrnCommandImports: readonly [typeof BrnCommand, typeof BrnCommandEmpty, typeof BrnCommandGroup, typeof BrnCommandItem, typeof BrnCommandList, typeof BrnCommandSearchInput, typeof BrnCommandSeparator];
+declare const BrnCommandImports: readonly [typeof BrnCommand, typeof BrnCommandEmpty, typeof BrnCommandGroup, typeof BrnCommandInput, typeof BrnCommandItem, typeof BrnCommandList, typeof BrnCommandSeparator];
 
-export { BrnCommand, BrnCommandEmpty, BrnCommandGroup, BrnCommandImports, BrnCommandItem, BrnCommandItemToken, BrnCommandList, BrnCommandSearchInput, BrnCommandSearchInputToken, BrnCommandSeparator, BrnCommandToken, injectBrnCommand, injectBrnCommandConfig, provideBrnCommand, provideBrnCommandConfig, provideBrnCommandItem, provideBrnCommandSearchInput };
+export { BRN_COMMAND_VALUE_ACCESSOR, BrnCommand, BrnCommandEmpty, BrnCommandGroup, BrnCommandImports, BrnCommandInput, BrnCommandInputToken, BrnCommandItem, BrnCommandItemToken, BrnCommandList, BrnCommandSeparator, BrnCommandToken, injectBrnCommand, injectBrnCommandConfig, provideBrnCommand, provideBrnCommandConfig, provideBrnCommandInput, provideBrnCommandItem };
 export type { BrnCommandConfig, CommandFilter };

package/fesm2022/spartan-ng-brain-autocomplete.mjs

@@ -1,10 +1,10 @@
 import { ActiveDescendantKeyManager } from '@angular/cdk/a11y';
 import * as i0 from '@angular/core';
-import { Directive, InjectionToken, inject, forwardRef, Injector, input, booleanAttribute, linkedSignal, model, contentChild, ElementRef, computed, contentChildren, Renderer2, TemplateRef, ViewContainerRef, effect, PLATFORM_ID, signal } from '@angular/core';
+import { Directive, InjectionToken, inject, forwardRef, Injector, input, booleanAttribute, linkedSignal, model, contentChild, ElementRef, computed, contentChildren, afterNextRender, effect, untracked, Renderer2, TemplateRef, ViewContainerRef, PLATFORM_ID, signal } from '@angular/core';
 import { NG_VALUE_ACCESSOR } from '@angular/forms';
-import { stringifyAsLabel } from '@spartan-ng/brain/core';
 import { BrnPopover } from '@spartan-ng/brain/popover';
 import { BrnDialog } from '@spartan-ng/brain/dialog';
+import { stringifyAsLabel } from '@spartan-ng/brain/core';
 import { isPlatformBrowser } from '@angular/common';
 
 class BrnAutocompleteInputWrapper {
@@ -32,6 +32,7 @@ function getDefaultConfig() {
     return {
         isItemEqualToValue: (itemValue, selectedValue) => Object.is(itemValue, selectedValue),
         itemToString: undefined,
+        autoHighlight: false,
     };
 }
 const BrnAutocompleteConfigToken = new InjectionToken('BrnAutocompleteConfig');
@@ -62,6 +63,10 @@ class BrnAutocomplete {
     isItemEqualToValue = input(this._config.isItemEqualToValue);
     /** A function to convert an item to a string for display. */
     itemToString = input(this._config.itemToString);
+    /** Whether to auto-highlight the first matching item. */
+    autoHighlight = input(this._config.autoHighlight, {
+        transform: booleanAttribute,
+    });
     /** The selected value of the autocomplete. */
     value = model(null);
     /** The current search query. */
@@ -95,6 +100,21 @@ class BrnAutocomplete {
         this._brnPopover?.closed.subscribe(() => {
             this.keyManager.setActiveItem(-1);
         });
+        afterNextRender(() => {
+            effect(() => {
+                if (!this.autoHighlight() || !this.isExpanded() || !this.search())
+                    return;
+                const hasVisibleItems = this.visibleItems();
+                untracked(() => {
+                    if (hasVisibleItems) {
+                        this.keyManager.setFirstItemActive();
+                    }
+                    else {
+                        this.keyManager.setActiveItem(-1);
+                    }
+                });
+            }, { injector: this._injector });
+        });
     }
     updateSearch(value) {
         this.search.set(value);
@@ -109,7 +129,6 @@ class BrnAutocomplete {
     select(itemValue) {
         this.value.set(itemValue);
         this._onChange?.(itemValue);
-        this.search.set(stringifyAsLabel(itemValue, this.itemToString()));
         this.close();
     }
     /** Select the active item with Enter key. */
@@ -117,9 +136,12 @@ class BrnAutocomplete {
         if (!this.isExpanded())
             return;
         const value = this.keyManager.activeItem?.value();
-        if (value === undefined)
-            return;
-        this.select(value);
+        if (value) {
+            this.select(value);
+        }
+        else {
+            this.close();
+        }
     }
     resetValue() {
         this.value.set(null);
@@ -155,7 +177,7 @@ class BrnAutocomplete {
         this._disabled.set(isDisabled);
     }
     /** @nocollapse */ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.7", ngImport: i0, type: BrnAutocomplete, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    /** @nocollapse */ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "20.0.7", type: BrnAutocomplete, isStandalone: true, selector: "[brnAutocomplete]", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, isItemEqualToValue: { classPropertyName: "isItemEqualToValue", publicName: "isItemEqualToValue", isSignal: true, isRequired: false, transformFunction: null }, itemToString: { classPropertyName: "itemToString", publicName: "itemToString", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, search: { classPropertyName: "search", publicName: "search", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", search: "searchChange" }, providers: [provideBrnAutocompleteBase(BrnAutocomplete), BRN_AUTOCOMPLETE_VALUE_ACCESSOR], queries: [{ propertyName: "_searchInputWrapper", first: true, predicate: BrnAutocompleteInputWrapper, descendants: true, read: ElementRef, isSignal: true }, { propertyName: "items", predicate: BrnAutocompleteItemToken, descendants: true, isSignal: true }], ngImport: i0 });
+    /** @nocollapse */ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "20.0.7", type: BrnAutocomplete, isStandalone: true, selector: "[brnAutocomplete]", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, isItemEqualToValue: { classPropertyName: "isItemEqualToValue", publicName: "isItemEqualToValue", isSignal: true, isRequired: false, transformFunction: null }, itemToString: { classPropertyName: "itemToString", publicName: "itemToString", isSignal: true, isRequired: false, transformFunction: null }, autoHighlight: { classPropertyName: "autoHighlight", publicName: "autoHighlight", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, search: { classPropertyName: "search", publicName: "search", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", search: "searchChange" }, providers: [provideBrnAutocompleteBase(BrnAutocomplete), BRN_AUTOCOMPLETE_VALUE_ACCESSOR], queries: [{ propertyName: "_searchInputWrapper", first: true, predicate: BrnAutocompleteInputWrapper, descendants: true, read: ElementRef, isSignal: true }, { propertyName: "items", predicate: BrnAutocompleteItemToken, descendants: true, isSignal: true }], ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.7", ngImport: i0, type: BrnAutocomplete, decorators: [{
             type: Directive,
@@ -307,13 +329,13 @@ class BrnAutocompleteInput {
     constructor() {
         effect(() => {
             const value = this._autocomplete.value();
-            const search = this._autocomplete.search();
             const valueLabel = stringifyAsLabel(value, this._autocomplete.itemToString());
-            if (valueLabel === search) {
-                this._el.nativeElement.value = valueLabel;
-            }
-            else if (search === '') {
-                this._el.nativeElement.value = '';
+            this._el.nativeElement.value = valueLabel ?? '';
+        });
+        effect(() => {
+            const search = this._autocomplete.search();
+            if (this._el.nativeElement.value !== search) {
+                this._el.nativeElement.value = search;
             }
         });
     }
@@ -473,6 +495,10 @@ class BrnAutocompleteSearch {
     disabledState = this._disabled.asReadonly();
     /** A function to convert an item to a string for display. */
     itemToString = input(this._config.itemToString);
+    /** Whether to auto-highlight the first matching item. */
+    autoHighlight = input(this._config.autoHighlight, {
+        transform: booleanAttribute,
+    });
     /** The selected value of the autocomplete. */
     value = model(null);
     /** The current search query. */
@@ -506,6 +532,21 @@ class BrnAutocompleteSearch {
         this._brnPopover?.closed.subscribe(() => {
             this.keyManager.setActiveItem(-1);
         });
+        afterNextRender(() => {
+            effect(() => {
+                if (!this.autoHighlight() || !this.isExpanded() || !this.search())
+                    return;
+                const hasVisibleItems = this.visibleItems();
+                untracked(() => {
+                    if (hasVisibleItems) {
+                        this.keyManager.setFirstItemActive();
+                    }
+                    else {
+                        this.keyManager.setActiveItem(-1);
+                    }
+                });
+            }, { injector: this._injector });
+        });
     }
     updateSearch(value) {
         this.value.set(value);
@@ -531,9 +572,12 @@ class BrnAutocompleteSearch {
         if (!this.isExpanded())
             return;
         const value = this.keyManager.activeItem?.value();
-        if (value === undefined)
-            return;
-        this.select(value);
+        if (value) {
+            this.select(value);
+        }
+        else {
+            this.close();
+        }
     }
     resetValue() {
         this.value.set(null);
@@ -569,7 +613,7 @@ class BrnAutocompleteSearch {
         this._disabled.set(isDisabled);
     }
     /** @nocollapse */ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.7", ngImport: i0, type: BrnAutocompleteSearch, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    /** @nocollapse */ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "20.0.7", type: BrnAutocompleteSearch, isStandalone: true, selector: "[brnAutocomplete]", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, itemToString: { classPropertyName: "itemToString", publicName: "itemToString", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, search: { classPropertyName: "search", publicName: "search", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", search: "searchChange" }, providers: [provideBrnAutocompleteBase(BrnAutocompleteSearch), BRN_AUTOCOMPLETE_SEARCH_VALUE_ACCESSOR], queries: [{ propertyName: "_searchInputWrapper", first: true, predicate: BrnAutocompleteInputWrapper, descendants: true, read: ElementRef, isSignal: true }, { propertyName: "items", predicate: BrnAutocompleteItemToken, descendants: true, isSignal: true }], ngImport: i0 });
+    /** @nocollapse */ static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "20.0.7", type: BrnAutocompleteSearch, isStandalone: true, selector: "[brnAutocomplete]", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, itemToString: { classPropertyName: "itemToString", publicName: "itemToString", isSignal: true, isRequired: false, transformFunction: null }, autoHighlight: { classPropertyName: "autoHighlight", publicName: "autoHighlight", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, search: { classPropertyName: "search", publicName: "search", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", search: "searchChange" }, providers: [provideBrnAutocompleteBase(BrnAutocompleteSearch), BRN_AUTOCOMPLETE_SEARCH_VALUE_ACCESSOR], queries: [{ propertyName: "_searchInputWrapper", first: true, predicate: BrnAutocompleteInputWrapper, descendants: true, read: ElementRef, isSignal: true }, { propertyName: "items", predicate: BrnAutocompleteItemToken, descendants: true, isSignal: true }], ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.7", ngImport: i0, type: BrnAutocompleteSearch, decorators: [{
             type: Directive,