multiple-select-vanilla
Version:
This lib allows you to select multiple elements with checkboxes
148 lines • 7.44 kB
TypeScript
import type { HtmlStruct, OptGroupRowData, OptionRowData } from './models/interfaces.js';
import type { MultipleSelectLocales } from './models/locale.interface.js';
import type { ClickedGroup, ClickedOption, CloseReason, MultipleSelectOption } from './models/multipleSelectOption.interface.js';
import { BindingEventService } from './services/binding-event.service.js';
import { VirtualScroll } from './services/virtual-scroll.js';
export declare class MultipleSelectInstance {
protected elm: HTMLSelectElement;
protected _bindEventService: BindingEventService;
protected isAllSelected: boolean;
protected isPartiallyAllSelected: boolean;
protected fromHtml: boolean;
protected choiceElm: HTMLButtonElement;
protected selectClearElm?: HTMLDivElement | null;
protected closeElm?: HTMLElement | null;
protected clearSearchIconElm?: HTMLElement | null;
protected filterText: string;
protected updateData: any[];
protected data?: Array<OptionRowData | OptGroupRowData>;
protected dataTotal?: any;
protected dropElm?: HTMLDivElement;
protected okButtonElm?: HTMLButtonElement;
protected filterParentElm?: HTMLDivElement | null;
protected lastFocusedItemKey: string;
protected lastMouseOverPosition: string;
protected ulElm?: HTMLUListElement | null;
protected parentElm: HTMLDivElement;
protected labelElm?: HTMLLabelElement | null;
protected selectAllParentElm?: HTMLDivElement | null;
protected selectAllElm?: HTMLInputElement | null;
protected searchInputElm?: HTMLInputElement | null;
protected selectGroupElms?: NodeListOf<HTMLInputElement>;
protected selectCheckboxElms?: NodeListOf<HTMLInputElement>;
protected noResultsElm?: HTMLDivElement | null;
protected options: MultipleSelectOption;
protected selectAllName: string;
protected selectGroupName: string;
protected selectItemName: string;
protected scrolledByMouse: boolean;
protected openDelayTimer?: number;
protected updateDataStart?: number;
protected updateDataEnd?: number;
protected virtualScroll?: VirtualScroll | null;
protected _currentHighlightIndex: number;
protected _currentSelectedElm?: HTMLLIElement | HTMLDivElement;
protected _isLazyLoaded: boolean;
protected isMoveUpRecalcRequired: boolean;
locales: MultipleSelectLocales;
get isRenderAsHtml(): boolean | undefined;
constructor(elm: HTMLSelectElement, options?: Partial<Omit<MultipleSelectOption, 'onHardDestroy' | 'onAfterHardDestroy'>>);
init(): void;
/**
* destroy the element, if a hard destroy is enabled then we'll also nullify it on the multipleSelect instance array.
* When a soft destroy is called, we'll only remove it from the DOM but we'll keep all multipleSelect instances
*/
destroy(hardDestroy?: boolean): void;
protected initLocale(): void;
protected initContainer(): void;
protected initData(): void;
protected initRow(elm: HTMLOptionElement, groupDisabled?: boolean): OptionRowData | OptGroupRowData | null;
protected initDrop(): void;
protected initFilter(): void;
/**
* initialize the select list, the boolean argument is to determine whether to render the filter and select all elements,
* which is disabled when using the lazyData option, otherwise this argument is set to true by default.
* @param renderFilterAndSearchAll - whether to render the filter and select all elements
*/
protected initList(renderFilterAndSearchAll?: boolean): void;
protected initListItems(): HtmlStruct[];
protected getEventTarget(e: Event & {
target: HTMLElement;
}): HTMLElement;
protected getListRows(): HtmlStruct[];
protected initListItem(dataRow: OptionRowData | OptGroupRowData, level?: number): HtmlStruct[];
protected initSelected(ignoreTrigger?: boolean): void;
protected initView(): void;
protected events(): void;
protected handleOnChange(eventName: string, item?: ClickedGroup | ClickedOption): void;
protected handleEscapeKey(): void;
/**
* Checks if user reached the end of the list through mouse scrolling and/or arrow down,
* then scroll back to the top whenever that happens.
*/
protected infiniteScrollHandler(e: (MouseEvent & {
target: HTMLElement;
}) | null, idx?: number, fullCount?: number): void;
/**
* Open the drop method, user could optionally provide a delay in ms to open the drop.
* The default delay is 0ms (which is 1 CPU cycle) when nothing is provided, to avoid a delay we can pass `-1` or `null`
* @param {number} [openDelay=0] - provide an optional delay, defaults to 0
*/
open(openDelay?: number | null): Promise<void>;
protected openDrop(): void;
protected adjustDropSizeAndPosition(): void;
protected focusSelectAllOrList(): void;
protected highlightCurrentOption(): void;
/** Change highlighted option, or remove highlight when nothing is provided */
protected changeCurrentOptionHighlight(optionElm?: HTMLLIElement | HTMLDivElement): void;
protected moveHighlightDown(): void;
protected moveHighlightUp(): void;
protected recalculateArrowMove(direction: 'up' | 'down'): void;
close(reason?: CloseReason): void;
/**
* apply value to an HTML element as text or as HTML with innerHTML when enabled
* @param elm
* @param value
*/
protected applyAsTextOrHtmlWhenEnabled(elmOrProp: HTMLElement | any, value: string): void;
protected update(ignoreTrigger?: boolean): void;
protected updateSelected(rows?: HtmlStruct[]): void;
getData(): import("./index.js").CollectionData | undefined;
getDataLength(): number;
/**
* Get current options, by default we'll return an immutable deep copy of the options to avoid conflicting with the lib
* but in rare occasion we might want to the return the actual, but mutable, options
* @param {Boolean} [returnDeepCopy]
*/
getOptions(returnDeepCopy?: boolean): MultipleSelectOption;
refreshOptions(options: Partial<MultipleSelectOption>): void;
getDropElement(): HTMLDivElement | undefined;
getParentElement(): HTMLDivElement;
getSelects<T extends 'text' | 'value'>(type?: T): T extends "text" ? string[] : Array<string | number | boolean>;
setSelects(values: any[], type?: string, ignoreTrigger?: boolean): void;
enable(): void;
disable(): void;
check(value: any): void;
uncheck(value: any): void;
protected _check(option: OptGroupRowData | OptionRowData, checked: boolean): void;
checkAll(): void;
uncheckAll(): void;
protected _checkAll(checked: boolean, ignoreUpdate?: boolean): void;
protected _checkGroup(group: any, checked: boolean, ignoreUpdate?: boolean): void;
checkInvert(): void;
focus(): void;
blur(): void;
refresh(): void;
protected filter(ignoreTrigger?: boolean): void;
protected adjustDropHeight(position: 'bottom' | 'top'): boolean;
protected adjustDropPosition(forceToggle: boolean): string;
protected adjustDropWidthByText(): void;
getScrollbarWidth(): number;
formatAllSelected(): string;
formatCountSelected(selectedCount: number, totalCount: number): string;
formatNoMatchesFound(): string;
formatOkButton(): string;
formatLazyLoading(): string;
formatSelectAll(): string;
}
//# sourceMappingURL=MultipleSelectInstance.d.ts.map