ng-select2-component

import { CdkDragDrop } from '@angular/cdk/drag-drop'; import { CdkConnectedOverlay } from '@angular/cdk/overlay'; import { ViewportRuler } from '@angular/cdk/scrolling'; import { AfterViewInit, ChangeDetectorRef, DoCheck, ElementRef, OnChanges, OnDestroy, OnInit, SimpleChanges, TemplateRef } from '@angular/core'; import { ControlValueAccessor, FormGroupDirective, NgControl, NgForm } from '@angular/forms'; import { Select2AutoCreateEvent, Select2Data, Select2Group, Select2Option, Select2RemoveEvent, Select2ScrollEvent, Select2SearchEvent, Select2SelectionOverride, Select2Template, Select2UpdateEvent, Select2UpdateValue } from './select2-interfaces'; import * as i0 from "@angular/core"; export declare class Select2 implements ControlValueAccessor, OnInit, DoCheck, AfterViewInit, OnDestroy, OnChanges { protected _viewportRuler: ViewportRuler; private _changeDetectorRef; private _parentForm; private _parentFormGroup; _control: NgControl; readonly _uid: string; /** data of options & option groups */ readonly data: import("@angular/core").InputSignal<Select2Data>; /** minimum characters to start filter search */ readonly minCharForSearch: import("@angular/core").InputSignalWithTransform<number, unknown>; /** text placeholder */ readonly displaySearchStatus: import("@angular/core").InputSignal<"default" | "hidden" | "always" | undefined>; /** text placeholder */ readonly placeholder: import("@angular/core").InputSignal<string | undefined>; /** in multiple: maximum selection element (0 = no limit) */ readonly limitSelection: import("@angular/core").InputSignalWithTransform<number, unknown>; /** dropdown position */ readonly listPosition: import("@angular/core").InputSignal<"above" | "below" | "auto">; /** overlay with CDK Angular position */ readonly overlay: import("@angular/core").InputSignalWithTransform<boolean, unknown>; /** select one or more item */ readonly multiple: import("@angular/core").InputSignalWithTransform<boolean, unknown>; /** drag'n drop list of items in multiple */ readonly multipleDrag: import("@angular/core").InputSignalWithTransform<boolean, unknown>; /** use the material style */ readonly styleMode: import("@angular/core").InputSignal<"default" | "material" | "noStyle" | "borderless">; /** message when no result */ readonly noResultMessage: import("@angular/core").InputSignal<string | undefined>; /** maximum results limit (0 = no limit) */ readonly maxResults: import("@angular/core").InputSignalWithTransform<number, unknown>; /** message when maximum results */ readonly maxResultsMessage: import("@angular/core").InputSignal<string>; /** infinite scroll distance */ readonly infiniteScrollDistance: import("@angular/core").InputSignalWithTransform<number, unknown>; /** infinite scroll distance */ readonly infiniteScrollThrottle: import("@angular/core").InputSignalWithTransform<number, unknown>; /** infinite scroll activated */ readonly infiniteScroll: import("@angular/core").InputSignalWithTransform<boolean, unknown>; /** auto create if not exist */ readonly autoCreate: import("@angular/core").InputSignalWithTransform<boolean, unknown>; /** no template for label selection */ readonly noLabelTemplate: import("@angular/core").InputSignalWithTransform<boolean, unknown>; /** use it for change the pattern of the filter search */ readonly editPattern: import("@angular/core").InputSignal<((str: string) => string) | undefined>; /** template(s) for formatting */ readonly templates: import("@angular/core").InputSignal<Select2Template>; /** template for formatting selected option */ readonly templateSelection: import("@angular/core").InputSignal<TemplateRef<any> | undefined>; /** the max height of the results container when opening the select */ readonly resultMaxHeight: import("@angular/core").InputSignal<string>; /** Active Search event */ readonly customSearchEnabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>; /** minimal data of show the search field */ readonly minCountForSearch: import("@angular/core").InputSignalWithTransform<number | undefined, unknown>; /** Unique id of the element. */ readonly id: import("@angular/core").InputSignal<string>; /** Unique id of label element. */ readonly idLabel: import("@angular/core").Signal<string>; /** Unique id of combo element. */ readonly idCombo: import("@angular/core").Signal<string>; /** Unique id of options element. */ readonly idOptions: import("@angular/core").Signal<string>; /** Unique id of overlay element. */ readonly idOverlay: import("@angular/core").Signal<string>; /** Whether the element is required. */ readonly required: import("@angular/core").InputSignalWithTransform<boolean, unknown>; /** Whether selected items should be hidden. */ readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>; /** Whether items are hidden when has. */ readonly hideSelectedItems: import("@angular/core").InputSignalWithTransform<boolean, unknown>; /** Whether the element is readonly. */ readonly readonly: import("@angular/core").InputSignalWithTransform<boolean, unknown>; /** The input element's value. */ readonly value: import("@angular/core").InputSignal<Select2UpdateValue>; /** Tab index for the select2 element. */ readonly tabIndex: import("@angular/core").InputSignalWithTransform<number, unknown>; /** reset with no selected value */ readonly resettable: import("@angular/core").InputSignalWithTransform<boolean, unknown>; /** selected value when × is clicked */ readonly resetSelectedValue: import("@angular/core").InputSignal<any>; /** like native select keyboard navigation (only single mode) */ readonly nativeKeyboard: import("@angular/core").InputSignalWithTransform<boolean, unknown>; /** grid: item by line * * 0 = no grid * * number = item by line (4) * * string = minimal size item (100px) */ readonly grid: import("@angular/core").InputSignal<string>; /** * Replace selection by a text * * if string: `%size%` = total selected options * * if function: juste show the string */ readonly selectionOverride: import("@angular/core").InputSignal<Select2SelectionOverride | undefined>; /** force selection on one line */ readonly selectionNoWrap: import("@angular/core").InputSignalWithTransform<boolean, unknown>; /** Add an option to select or remove all (if all is selected) */ readonly showSelectAll: import("@angular/core").InputSignalWithTransform<boolean, unknown>; /** Text for remove all options */ readonly removeAllText: import("@angular/core").InputSignal<string>; /** Text for select all options */ readonly selectAllText: import("@angular/core").InputSignal<string>; /** title attribute applied to the input */ readonly title: import("@angular/core").InputSignal<string | undefined>; /** aria-labelledby attribute applied to the input, to specify en external label */ readonly ariaLabelledby: import("@angular/core").InputSignal<string | undefined>; /** aria-describedby attribute applied to the input */ readonly ariaDescribedby: import("@angular/core").InputSignal<string | undefined>; /** aria-invalid attribute applied to the input, to force error state */ readonly ariaInvalid: import("@angular/core").InputSignalWithTransform<boolean, unknown>; /** description of the reset button when using 'resettable'. Default value : 'Reset' */ readonly ariaResetButtonDescription: import("@angular/core").InputSignal<string>; readonly update: import("@angular/core").OutputEmitterRef<Select2UpdateEvent<Select2UpdateValue>>; readonly autoCreateItem: import("@angular/core").OutputEmitterRef<Select2AutoCreateEvent<Select2UpdateValue>>; readonly open: import("@angular/core").OutputEmitterRef<Select2>; readonly close: import("@angular/core").OutputEmitterRef<Select2>; readonly focus: import("@angular/core").OutputEmitterRef<Select2>; readonly blur: import("@angular/core").OutputEmitterRef<Select2>; readonly search: import("@angular/core").OutputEmitterRef<Select2SearchEvent<Select2UpdateValue>>; readonly scroll: import("@angular/core").OutputEmitterRef<Select2ScrollEvent>; readonly removeOption: import("@angular/core").OutputEmitterRef<Select2RemoveEvent<Select2UpdateValue>>; readonly cdkConnectedOverlay: import("@angular/core").Signal<CdkConnectedOverlay>; readonly selection: import("@angular/core").Signal<ElementRef<HTMLElement>>; readonly resultContainer: import("@angular/core").Signal<ElementRef<HTMLElement> | undefined>; readonly results: import("@angular/core").Signal<readonly ElementRef<any>[]>; readonly searchInput: import("@angular/core").Signal<ElementRef<HTMLElement> | undefined>; readonly dropdown: import("@angular/core").Signal<ElementRef<HTMLElement> | undefined>; get classMaterial(): boolean; get classNostyle(): boolean; get classBorderless(): boolean; get select2above(): boolean; selectedOption: Select2Option | Select2Option[] | null; isOpen: boolean; searchStyle: string | undefined; /** Whether the element is focused or not. */ focused: boolean; filteredData: import("@angular/core").WritableSignal<Select2Data | undefined>; get select2Options(): Select2Option[]; get select2Option(): Select2Option | null; get searchText(): string; protected set searchText(text: string); get disabledState(): boolean; protected overlayWidth: number | string; protected overlayHeight: number | string; protected _triggerRect: DOMRect | undefined; protected _dropdownRect: DOMRect | undefined; protected get _positions(): any; protected maxResultsExceeded: boolean | undefined; private hoveringOption; hoveringOptionId: import("@angular/core").Signal<string | null>; private innerSearchText; protected isSearchboxHidden: boolean | undefined; private selectionElement; private get resultsElement(); private _stateChanges; /** Tab index for the element. */ protected get _tabIndex(): number; private _data; private _disabled; protected _value: Select2UpdateValue | null; private _previousNativeValue; private _overlayPosition; private toObservable; constructor(_viewportRuler: ViewportRuler, _changeDetectorRef: ChangeDetectorRef, _parentForm: NgForm, _parentFormGroup: FormGroupDirective, _control: NgControl, tabIndex: string); ngOnChanges(changes: SimpleChanges): void; clickDetection(e: MouseEvent): void; /** View -> model callback called when select has been touched */ private _onTouched; /** View -> model callback called when value changes */ private _onChange; ngOnInit(): void; ngAfterViewInit(): void; ngDoCheck(): void; ngOnDestroy(): void; fixValue(): void; updateSearchBox(): void; getOptionStyle(option: Select2Option): string; mouseenter(option: Select2Option): void; click(option: Select2Option): void; reset(event?: MouseEvent): void; prevChange(event: Event): void; stopEvent(event: Event): void; toggleOpenAndClose(focus?: boolean, open?: boolean, event?: KeyboardEvent): void; hasTemplate(option: Select2Option | Select2Group, defaultValue: string, select?: boolean): boolean; getTemplate(option: Select2Option | Select2Group, defaultValue: string, select?: boolean): any; triggerRect(): void; isNumber(o: any): boolean; selectAll(): void; selectAllTest(): boolean; private testSelection; private testValueChange; private updateFilteredData; private clickExit; private isInSelect; private ifParentContainsClass; private ifParentContainsId; private getParentElementByClass; private getParentElementById; private containClasses; private containAlmostOneClasses; private clickOnSelect2Element; focusin(options?: FocusOptions): void; focusout(event: FocusEvent): void; select(option: Select2Option | null, emit?: boolean, closeOnSelect?: boolean): void; private testDiffValue; keyDown(event: KeyboardEvent, create?: boolean): void; private actionAfterKeyDownMoveAction; openKey(event: KeyboardEvent, create?: boolean): void; searchUpdate(e: Event): void; isSelected(option: Select2Option): "true" | "false"; isDisabled(option: Select2Option): "true" | "false"; removeSelection(e: MouseEvent | KeyboardEvent | Event, option: Select2Option): void; /** * Sets the model value. Implemented as part of ControlValueAccessor. * @param value */ writeValue(value: any): void; /** * Saves a callback function to be invoked when the select's value * changes from user input. Part of the ControlValueAccessor interface * required to integrate with Angular's core forms API. * * @param fn Callback to be triggered when the value changes. */ registerOnChange(fn: (value: any) => void): void; /** * Saves a callback function to be invoked when the select is blurred * by the user. Part of the ControlValueAccessor interface required * to integrate with Angular's core forms API. * * @param fn Callback to be triggered when the component has been touched. */ registerOnTouched(fn: () => void): void; /** * Sets whether the component should be disabled. * Implemented as part of ControlValueAccessor. * @param isDisabled */ setDisabledState(isDisabled: boolean): void; onScroll(way: 'up' | 'down'): void; drop(event: CdkDragDrop<string[], string[], any>): void; _isErrorState(): boolean; _selectionOverrideLabel(): string | undefined; getElementId(elt: Select2Group | Select2Option | null): string | null; _getElementPath(elt: Select2Group | Select2Option): number[]; _toGroup(group: Select2Option | Select2Group): Select2Group; _toOption(option: Select2Option | Select2Group): Select2Option; private updateEvent; private optionsSize; private addItem; private createAndAdd; private moveUp; private moveDown; private moveStart; private moveEnd; private updateScrollFromOption; private selectByEnter; private _testKey; /** * Sets the selected option based on a value. If no option can be * found with the designated value, the select trigger is cleared. */ private _setSelectionByValue; /** Does some manual dirty checking on the native input `value` property. */ private _dirtyCheckNativeValue; private _focusSearchbox; private _focus; private _isAbobeOverlay; protected _updateFocusState(state: boolean): void; static ɵfac: i0.ɵɵFactoryDeclaration<Select2, [null, null, { optional: true; }, { optional: true; }, { optional: true; self: true; }, { attribute: "tabindex"; }]>; static ɵcmp: i0.ɵɵComponentDeclaration<Select2, "select2, ng-select2", never, { "data": { "alias": "data"; "required": true; "isSignal": true; }; "minCharForSearch": { "alias": "minCharForSearch"; "required": false; "isSignal": true; }; "displaySearchStatus": { "alias": "displaySearchStatus"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "limitSelection": { "alias": "limitSelection"; "required": false; "isSignal": true; }; "listPosition": { "alias": "listPosition"; "required": false; "isSignal": true; }; "overlay": { "alias": "overlay"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "multipleDrag": { "alias": "multipleDrag"; "required": false; "isSignal": true; }; "styleMode": { "alias": "styleMode"; "required": false; "isSignal": true; }; "noResultMessage": { "alias": "noResultMessage"; "required": false; "isSignal": true; }; "maxResults": { "alias": "maxResults"; "required": false; "isSignal": true; }; "maxResultsMessage": { "alias": "maxResultsMessage"; "required": false; "isSignal": true; }; "infiniteScrollDistance": { "alias": "infiniteScrollDistance"; "required": false; "isSignal": true; }; "infiniteScrollThrottle": { "alias": "infiniteScrollThrottle"; "required": false; "isSignal": true; }; "infiniteScroll": { "alias": "infiniteScroll"; "required": false; "isSignal": true; }; "autoCreate": { "alias": "autoCreate"; "required": false; "isSignal": true; }; "noLabelTemplate": { "alias": "noLabelTemplate"; "required": false; "isSignal": true; }; "editPattern": { "alias": "editPattern"; "required": false; "isSignal": true; }; "templates": { "alias": "templates"; "required": false; "isSignal": true; }; "templateSelection": { "alias": "templateSelection"; "required": false; "isSignal": true; }; "resultMaxHeight": { "alias": "resultMaxHeight"; "required": false; "isSignal": true; }; "customSearchEnabled": { "alias": "customSearchEnabled"; "required": false; "isSignal": true; }; "minCountForSearch": { "alias": "minCountForSearch"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "hideSelectedItems": { "alias": "hideSelectedItems"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "tabIndex": { "alias": "tabIndex"; "required": false; "isSignal": true; }; "resettable": { "alias": "resettable"; "required": false; "isSignal": true; }; "resetSelectedValue": { "alias": "resetSelectedValue"; "required": false; "isSignal": true; }; "nativeKeyboard": { "alias": "nativeKeyboard"; "required": false; "isSignal": true; }; "grid": { "alias": "grid"; "required": false; "isSignal": true; }; "selectionOverride": { "alias": "selectionOverride"; "required": false; "isSignal": true; }; "selectionNoWrap": { "alias": "selectionNoWrap"; "required": false; "isSignal": true; }; "showSelectAll": { "alias": "showSelectAll"; "required": false; "isSignal": true; }; "removeAllText": { "alias": "removeAllText"; "required": false; "isSignal": true; }; "selectAllText": { "alias": "selectAllText"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "ariaLabelledby": { "alias": "ariaLabelledby"; "required": false; "isSignal": true; }; "ariaDescribedby": { "alias": "ariaDescribedby"; "required": false; "isSignal": true; }; "ariaInvalid": { "alias": "ariaInvalid"; "required": false; "isSignal": true; }; "ariaResetButtonDescription": { "alias": "ariaResetButtonDescription"; "required": false; "isSignal": true; }; }, { "update": "update"; "autoCreateItem": "autoCreateItem"; "open": "open"; "close": "close"; "focus": "focus"; "blur": "blur"; "search": "search"; "scroll": "scroll"; "removeOption": "removeOption"; }, never, ["select2-label, ng-select2-label", "select2-hint, ng-select2-hint"], true, never>; } //# sourceMappingURL=select2.component.d.ts.map