@m1z23r/ngx-ui 1.1.32 → 1.1.34

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@m1z23r/ngx-ui",
-  "version": "1.1.32",
+  "version": "1.1.34",
   "description": "A modern Angular UI component library with themeable components and responsive layout system",
   "license": "MIT",
   "author": "m1z23r",

package/types/m1z23r-ngx-ui.d.ts

@@ -811,8 +811,26 @@ declare class OptionComponent<T = unknown> {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<OptionComponent<any>, "ui-option", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "deleteClicked": "deleteClicked"; }, never, ["*"], true, never>;
 }
 
+interface OptionTemplateContext<T> {
+    $implicit: T;
+    option: T;
+    selected: boolean;
+    disabled: boolean;
+}
+declare class OptionTemplateDirective<T = unknown> {
+    readonly templateRef: TemplateRef<any>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<OptionTemplateDirective<any>, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<OptionTemplateDirective<any>, "[uiOptionTemplate]", never, {}, {}, never, never, true, never>;
+}
+
 type SelectVariant = 'default' | 'outlined' | 'filled';
 type SelectSize = 'sm' | 'md' | 'lg';
+interface AsyncSelectOption<T = unknown> {
+    value: T;
+    label: string;
+    disabled?: boolean;
+}
+type AsyncSearchFn<T> = (query: string) => Promise<AsyncSelectOption<T>[]>;
 declare class SelectComponent<T = unknown> implements AfterContentInit, OnDestroy {
     readonly variant: _angular_core.InputSignal<SelectVariant>;
     readonly size: _angular_core.InputSignal<SelectSize>;
@@ -827,18 +845,27 @@ declare class SelectComponent<T = unknown> implements AfterContentInit, OnDestro
     readonly creatable: _angular_core.InputSignal<boolean>;
     readonly deletable: _angular_core.InputSignal<boolean>;
     readonly selectable: _angular_core.InputSignal<boolean>;
+    readonly asyncSearch: _angular_core.InputSignal<AsyncSearchFn<T> | null>;
+    readonly debounceTime: _angular_core.InputSignal<number>;
+    readonly minSearchLength: _angular_core.InputSignal<number>;
     readonly value: _angular_core.ModelSignal<T | T[] | null>;
     readonly opened: _angular_core.OutputEmitterRef<void>;
     readonly closed: _angular_core.OutputEmitterRef<void>;
     readonly created: _angular_core.OutputEmitterRef<string>;
     readonly deleted: _angular_core.OutputEmitterRef<T>;
     readonly options: _angular_core.Signal<readonly OptionComponent<any>[]>;
+    readonly optionTemplate: _angular_core.Signal<OptionTemplateDirective<any> | undefined>;
     triggerRef: ElementRef<HTMLElement>;
     dropdownRef: ElementRef<HTMLElement>;
     searchInputRef?: ElementRef<HTMLInputElement>;
     readonly isOpen: _angular_core.WritableSignal<boolean>;
     readonly searchQuery: _angular_core.WritableSignal<string>;
     readonly focusedIndex: _angular_core.WritableSignal<number>;
+    readonly asyncLoading: _angular_core.WritableSignal<boolean>;
+    readonly asyncOptions: _angular_core.WritableSignal<AsyncSelectOption<T>[]>;
+    readonly asyncError: _angular_core.WritableSignal<string | null>;
+    private asyncSearchAbortController;
+    private debounceTimer;
     private readonly elementRef;
     private positionCleanup;
     private readonly initializedOptions;
@@ -850,41 +877,39 @@ declare class SelectComponent<T = unknown> implements AfterContentInit, OnDestro
     protected readonly hasValue: _angular_core.Signal<boolean>;
     protected readonly displayValue: _angular_core.Signal<string>;
     protected readonly inputPlaceholder: _angular_core.Signal<string>;
+    protected readonly isAsyncMode: _angular_core.Signal<boolean>;
     protected readonly visibleOptions: _angular_core.Signal<OptionComponent<any>[]>;
+    protected readonly visibleAsyncOptions: _angular_core.Signal<AsyncSelectOption<T>[]>;
     protected readonly exactMatchExists: _angular_core.Signal<boolean>;
+    protected readonly totalVisibleCount: _angular_core.Signal<number>;
     onDocumentClick(event: MouseEvent): void;
     toggle(): void;
     open(): void;
     close(): void;
+    private cancelAsyncSearch;
     selectOption(option: OptionComponent<T>, event?: MouseEvent): void;
     clear(event: MouseEvent): void;
+    selectAsyncOption(option: AsyncSelectOption<T>, event?: MouseEvent): void;
+    isAsyncOptionSelected(option: AsyncSelectOption<T>): boolean;
     deleteOption(optionValue: T): void;
     protected handleTriggerKeydown(event: KeyboardEvent): void;
     protected handleSearchInputKeydown(event: KeyboardEvent): void;
+    private selectFocusedOption;
     protected onSearchInput(value: string): void;
+    private triggerAsyncSearch;
+    private executeAsyncSearch;
     protected handleCreate(): void;
     private focusNext;
     private focusPrevious;
     private scrollToFocused;
+    private scrollToFocusedAsync;
     private portalDropdown;
     private unportalDropdown;
     private updateDropdownPosition;
     private addPositionListeners;
     private removePositionListeners;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SelectComponent<any>, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SelectComponent<any>, "ui-select", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "searchable": { "alias": "searchable"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "creatable": { "alias": "creatable"; "required": false; "isSignal": true; }; "deletable": { "alias": "deletable"; "required": false; "isSignal": true; }; "selectable": { "alias": "selectable"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "opened": "opened"; "closed": "closed"; "created": "created"; "deleted": "deleted"; }, ["options"], ["*"], true, never>;
-}
-
-interface OptionTemplateContext<T> {
-    $implicit: T;
-    option: T;
-    selected: boolean;
-    disabled: boolean;
-}
-declare class OptionTemplateDirective<T = unknown> {
-    readonly templateRef: TemplateRef<any>;
-    static ɵfac: _angular_core.ɵɵFactoryDeclaration<OptionTemplateDirective<any>, never>;
-    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<OptionTemplateDirective<any>, "[uiOptionTemplate]", never, {}, {}, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SelectComponent<any>, "ui-select", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "searchable": { "alias": "searchable"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "creatable": { "alias": "creatable"; "required": false; "isSignal": true; }; "deletable": { "alias": "deletable"; "required": false; "isSignal": true; }; "selectable": { "alias": "selectable"; "required": false; "isSignal": true; }; "asyncSearch": { "alias": "asyncSearch"; "required": false; "isSignal": true; }; "debounceTime": { "alias": "debounceTime"; "required": false; "isSignal": true; }; "minSearchLength": { "alias": "minSearchLength"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "opened": "opened"; "closed": "closed"; "created": "created"; "deleted": "deleted"; }, ["options", "optionTemplate"], ["*"], true, never>;
 }
 
 declare class DropdownTriggerDirective {
@@ -2012,4 +2037,4 @@ declare class TemplateInputComponent implements OnDestroy {
 }
 
 export { AccordionComponent, AccordionHeaderDirective, AccordionItemComponent, AlertComponent, BadgeComponent, ButtonComponent, CardComponent, CellTemplateDirective, CellValuePipe, CheckboxComponent, ChipInputComponent, ChipTemplateDirective, CircularProgressComponent, ContentComponent, ContextMenuDirective, DIALOG_DATA, DIALOG_REF, DatepickerComponent, DatetimepickerComponent, DialogRef, DialogService, DropdownComponent, DropdownDividerComponent, DropdownItemComponent, DropdownTriggerDirective, DynamicTabsComponent, FileChooserComponent, FilePreviewPipe, FileSizePipe, FooterComponent, InputComponent, LOADABLE, LoadingDirective, LoadingService, ModalComponent, NavbarComponent, OptionComponent, OptionTemplateDirective, PaginationComponent, ProgressComponent, RadioComponent, RadioGroupComponent, SelectComponent, ShellComponent, SidebarComponent, SidebarService, SidebarToggleComponent, SliderComponent, SpinnerComponent, SplitComponent, SplitPaneComponent, SwitchComponent, TAB_DATA, TAB_REF, TREE_HOST, TabActivePipe, TabComponent, TabIconDirective, TabRef, TableComponent, TabsComponent, TabsService, TemplateInputComponent, TextareaComponent, TimepickerComponent, ToastRef, ToastService, TooltipDirective, TreeComponent, TreeNodeComponent, Validators, VariablePopoverDirective };
-export type { AccordionVariant, AlertVariant, BadgeSize, BadgeVariant, ButtonColor, ButtonSize, ButtonVariant, CardPadding, CardVariant, CheckboxSize, ChipInputSize, ChipInputVariant, ChipTemplateContext, CircularProgressSize, CircularProgressVariant, DateRange, DatepickerSize, DatepickerVariant, DatepickerView, DatetimepickerSize, DatetimepickerVariant, DatetimepickerView, DialogConfig, DropdownAlign, DropdownPosition, DynamicTabConfig, DynamicTabsSize, DynamicTabsVariant, FileChooserSize, FileChooserVariant, InputType, Loadable, ModalSize, OptionTemplateContext, PaginationSize, ProgressSize, ProgressVariant, RadioGroupOrientation, RadioGroupSize, RadioGroupVariant, SelectSize, SelectVariant, ShellVariant, SliderSize, SortDirection, SortState, SpinnerSize, SpinnerVariant, SplitGutterSize, SplitOrientation, SplitSizeChange, SwitchSize, TabRenderMode, TableColumn, TabsSize, TabsVariant, TemplateVariable, TextareaResize, TimeFormat, TimeValue, TimepickerSize, TimepickerVariant, ToastConfig, ToastPosition, ToastVariant, TooltipPosition, TreeDropPosition, TreeNode, TreeNodeDropEvent, ValidationError, ValidationState, ValidatorFn, VariablePopoverContext, VariableState };
+export type { AccordionVariant, AlertVariant, AsyncSearchFn, AsyncSelectOption, BadgeSize, BadgeVariant, ButtonColor, ButtonSize, ButtonVariant, CardPadding, CardVariant, CheckboxSize, ChipInputSize, ChipInputVariant, ChipTemplateContext, CircularProgressSize, CircularProgressVariant, DateRange, DatepickerSize, DatepickerVariant, DatepickerView, DatetimepickerSize, DatetimepickerVariant, DatetimepickerView, DialogConfig, DropdownAlign, DropdownPosition, DynamicTabConfig, DynamicTabsSize, DynamicTabsVariant, FileChooserSize, FileChooserVariant, InputType, Loadable, ModalSize, OptionTemplateContext, PaginationSize, ProgressSize, ProgressVariant, RadioGroupOrientation, RadioGroupSize, RadioGroupVariant, SelectSize, SelectVariant, ShellVariant, SliderSize, SortDirection, SortState, SpinnerSize, SpinnerVariant, SplitGutterSize, SplitOrientation, SplitSizeChange, SwitchSize, TabRenderMode, TableColumn, TabsSize, TabsVariant, TemplateVariable, TextareaResize, TimeFormat, TimeValue, TimepickerSize, TimepickerVariant, ToastConfig, ToastPosition, ToastVariant, TooltipPosition, TreeDropPosition, TreeNode, TreeNodeDropEvent, ValidationError, ValidationState, ValidatorFn, VariablePopoverContext, VariableState };