@keenmate/web-multiselect 1.8.4 → 1.8.6

package/dist/index.d.ts

@@ -0,0 +1,669 @@
+import { Placement } from '@floating-ui/dom';
+
+/**
+ * Action button configuration for dropdown actions (Select All, Clear All, custom actions)
+ * @template T The type of data items
+ */
+declare interface ActionButton<T = any> {
+    /** Action identifier ('select-all', 'clear-all', or 'custom' for custom actions) */
+    action: 'select-all' | 'clear-all' | 'custom';
+    /** Button text label */
+    text: string;
+    /** Optional CSS class(es) to add to the button */
+    cssClass?: string;
+    /** Optional tooltip text */
+    tooltip?: string;
+    /** Static visibility - set to false to hide button */
+    isVisible?: boolean;
+    /** Static disabled state - set to true to disable button */
+    isDisabled?: boolean;
+    /** Custom click handler (required for 'custom' action) */
+    onClick?: (multiselect: any) => void | Promise<void>;
+    /** Dynamic visibility callback - return false to hide button (takes priority over isVisible) */
+    isVisibleCallback?: (multiselect: any) => boolean;
+    /** Dynamic disabled state callback - return true to disable button (takes priority over isDisabled) */
+    isDisabledCallback?: (multiselect: any) => boolean;
+    /** Dynamic text callback - return button text (takes priority over text) */
+    getTextCallback?: (multiselect: any) => string;
+    /** Dynamic CSS class callback - return class name(s) (takes priority over cssClass) */
+    getClassCallback?: (multiselect: any) => string | string[];
+    /** Dynamic tooltip callback - return tooltip text (takes priority over tooltip) */
+    getTooltipCallback?: (multiselect: any) => string;
+}
+
+/**
+ * Layout mode for action buttons container
+ * - 'nowrap': Buttons stay in single row (default)
+ * - 'wrap': Buttons wrap to multiple rows when needed
+ */
+declare type ActionsLayout = 'nowrap' | 'wrap';
+
+/**
+ * Context provided to renderBadgeContentCallback
+ */
+declare interface BadgeContentRenderContext {
+    /** Current badges display mode */
+    displayMode: BadgesDisplayMode;
+    /** Whether the badge is being rendered in the selected items popover */
+    isInPopover: boolean;
+}
+
+/**
+ * Display mode for selected items (badges area)
+ */
+export declare type BadgesDisplayMode = 'badges' | 'count' | 'compact' | 'partial' | 'none';
+
+/**
+ * Position of the badges container relative to the input
+ */
+export declare type BadgesPosition = 'top' | 'bottom' | 'left' | 'right';
+
+/**
+ * Threshold behavior mode when badges exceed threshold
+ */
+export declare type BadgesThresholdMode = 'count' | 'partial';
+
+declare const BaseElement: typeof HTMLElement;
+
+export declare const dataLogger: any;
+
+/**
+ * Disable all logging (set to silent level)
+ */
+export declare function disableLogging(): void;
+
+/**
+ * Enable all logging (set to debug level)
+ */
+export declare function enableLogging(): void;
+
+export declare interface GlobalMultiSelectAPI {
+    version: () => string;
+    config: {
+        name: string;
+        version: string;
+        author: string;
+        license: string;
+        repository: string;
+        homepage: string;
+    };
+    logging: {
+        enableLogging: () => void;
+        disableLogging: () => void;
+        setLogLevel: (level: string) => void;
+        setCategoryLevel: (category: string, level: string) => void;
+        getCategories: () => string[];
+    };
+    register: () => void;
+    getInstances: () => HTMLElement[];
+}
+
+export declare const initLogger: any;
+
+export declare const interactionLogger: any;
+
+/**
+ * List of all logging categories for introspection
+ */
+export declare const LOGGING_CATEGORIES: string[];
+
+/**
+ * Generic configuration options for the MultiSelect component
+ * @template T The type of data items
+ */
+declare interface MultiSelectConfig<T = any> {
+    /** Options array - can be objects or [key, value] tuples */
+    options?: T[];
+    /** Member property name for value/ID extraction */
+    valueMember?: string;
+    /** Callback to extract value/ID from item */
+    getValueCallback?: (item: T) => string | number;
+    /** Member property name for display value extraction */
+    displayValueMember?: string;
+    /** Callback to extract display value from item */
+    getDisplayValueCallback?: (item: T) => string;
+    /** Callback to customize badge display text (defaults to display value if not provided) */
+    getBadgeDisplayCallback?: (item: T) => string;
+    /** Callback to add custom CSS classes to badges - return string or array of class names */
+    getBadgeClassCallback?: (item: T) => string | string[];
+    /** Callback to inject custom CSS into Shadow DOM - return CSS string for styling custom classes */
+    customStylesCallback?: () => string;
+    /** Member property name for search value extraction */
+    searchValueMember?: string;
+    /** Callback to extract search value from item */
+    getSearchValueCallback?: (item: T) => string;
+    /** Member property name for icon extraction */
+    iconMember?: string;
+    /** Callback to extract icon from item */
+    getIconCallback?: (item: T) => string;
+    /** Member property name for subtitle extraction */
+    subtitleMember?: string;
+    /** Callback to extract subtitle from item */
+    getSubtitleCallback?: (item: T) => string;
+    /** Member property name for group extraction */
+    groupMember?: string;
+    /** Callback to extract group from item */
+    getGroupCallback?: (item: T) => string;
+    /** Callback to customize group label content (can return HTML) */
+    renderGroupLabelContentCallback?: (groupName: string) => string | HTMLElement;
+    /** Member property name for disabled state extraction */
+    disabledMember?: string;
+    /** Callback to extract disabled state from item */
+    getDisabledCallback?: (item: T) => boolean;
+    /** Custom renderer for dropdown option content - return HTML string or HTMLElement */
+    renderOptionContentCallback?: (item: T, context: OptionContentRenderContext) => string | HTMLElement;
+    /** Custom renderer for badge content (main badges area) - return HTML string or HTMLElement */
+    renderBadgeContentCallback?: (item: T, context: BadgeContentRenderContext) => string | HTMLElement;
+    /** Custom renderer for selected item content in popover - return HTML string or HTMLElement */
+    renderSelectedItemContentCallback?: (item: T) => string | HTMLElement;
+    /** Callback to add custom CSS classes to selected items in popover - return string or array of class names */
+    getSelectedItemClassCallback?: (item: T) => string | string[];
+    /** Custom renderer for selected item display in single-select mode - return plain text */
+    renderSelectedContentCallback?: (item: T) => string;
+    /** HTML form field ID/name for hidden input */
+    formFieldId?: string;
+    /** Format for value serialization (forms and callbacks) */
+    valueFormat?: ValueFormat;
+    /** Custom callback to format value */
+    getValueFormatCallback?: (selectedValues: (string | number)[]) => string;
+    /** Allow multiple selections (internal: isMultipleEnabled) */
+    isMultipleEnabled?: boolean;
+    /** Enable search/filtering (internal: isSearchEnabled) */
+    isSearchEnabled?: boolean;
+    /** Allow grouping of options (internal: isGroupsAllowed) */
+    isGroupsAllowed?: boolean;
+    /** Action buttons configuration (Select All, Clear All, custom actions) */
+    actionButtons?: ActionButton<T>[];
+    /** Show checkboxes next to options (internal: isCheckboxesShown) */
+    isCheckboxesShown?: boolean;
+    /** Keep Select All/Clear All buttons fixed at top while scrolling (internal: isActionsSticky) */
+    isActionsSticky?: boolean;
+    /** Close dropdown after selecting an option (internal: isCloseOnSelect) */
+    isCloseOnSelect?: boolean;
+    /** Lock dropdown placement after first open (internal: isPlacementLocked) */
+    isPlacementLocked?: boolean;
+    /** Allow adding new options not in the list (internal: isAddNewAllowed) */
+    isAddNewAllowed?: boolean;
+    /** Show count badge next to toggle icon (internal: isCounterShown) */
+    isCounterShown?: boolean;
+    /** Keep initial options visible when searchCallback is active and search term is empty/short (internal: isKeepOptionsOnSearch) */
+    isKeepOptionsOnSearch?: boolean;
+    /** Keep search text and filtered results when dropdown closes (default: true) */
+    shouldKeepSearchOnClose?: boolean;
+    /** Enable virtual scrolling for large datasets (internal: isVirtualScrollEnabled) */
+    isVirtualScrollEnabled?: boolean;
+    /** Vertical alignment of checkboxes relative to option content */
+    checkboxAlign?: 'top' | 'center' | 'bottom';
+    /** Hint text shown above the input when focused */
+    searchHint?: string;
+    /** Placeholder text for the search input */
+    searchPlaceholder?: string;
+    /** Minimum width for the dropdown (e.g., '20rem', '300px') */
+    dropdownMinWidth?: string | null;
+    /** Maximum width for the dropdown (e.g., '40rem', '500px') */
+    dropdownMaxWidth?: string | null;
+    /** Display mode for selected items in badges area */
+    badgesDisplayMode?: BadgesDisplayMode;
+    /** Position of badges container */
+    badgesPosition?: BadgesPosition;
+    /** Threshold behavior mode: 'count' shows count badge, 'partial' shows limited badges + more badge */
+    badgesThresholdMode?: BadgesThresholdMode;
+    /** Maximum height for dropdown */
+    maxHeight?: string;
+    /** Message shown when no results found */
+    emptyMessage?: string;
+    /** Message shown while loading async data */
+    loadingMessage?: string;
+    /** Search input display mode */
+    searchInputMode?: SearchInputMode;
+    /** Search behavior mode: 'filter' (hide non-matches) or 'navigate' (jump to matches, keep all visible) */
+    searchMode?: SearchMode;
+    /** Layout mode for action buttons: 'nowrap' (default) or 'wrap' for multi-row */
+    actionsLayout?: ActionsLayout;
+    /** Auto-switch from badges to count when threshold is exceeded */
+    badgesThreshold?: number | null;
+    /** Maximum number of badges to show in partial mode (used with thresholdMode='partial') */
+    badgesMaxVisible?: number | null;
+    /** Minimum search length before loading data */
+    minSearchLength?: number;
+    /** Minimum items before virtual scroll activates (default: 100) */
+    virtualScrollThreshold?: number;
+    /** Fixed height for each option in pixels (required for virtual scroll, default: 50) */
+    optionHeight?: number;
+    /** Fixed height for each badge in selected items popover in pixels (required for virtual scroll, default: 36) */
+    badgeHeight?: number;
+    /** Buffer size for virtual scroll - items above/below viewport (default: 10) */
+    virtualScrollBuffer?: number;
+    /** Pre-process search term before calling searchCallback. Return null to prevent search. Use for accent removal, validation, etc. */
+    beforeSearchCallback?: ((searchTerm: string) => string | null) | null;
+    /** Async function to load data: (searchTerm) => Promise<options[]> */
+    searchCallback?: ((searchTerm: string) => Promise<T[]>) | null;
+    /** Callback to add a new option when isAddNewAllowed is true */
+    addNewCallback?: ((value: string) => T | Promise<T>) | null;
+    /** Callback when an option is selected */
+    selectCallback?: ((option: T) => void) | null;
+    /** Callback when an option is deselected */
+    deselectCallback?: ((option: T) => void) | null;
+    /** Callback when selection changes */
+    changeCallback?: ((selectedOptions: T[]) => void) | null;
+    /** Callback to format count badge text (for i18n/pluralization). When moreCount is provided, it's for the "+X more" badge in partial mode. */
+    getCounterCallback?: ((count: number, moreCount?: number) => string) | null;
+    /** Enable tooltips on selected item badges (internal: isBadgeTooltipsEnabled) */
+    isBadgeTooltipsEnabled?: boolean;
+    /** Callback to generate custom tooltip content for a badge */
+    getBadgeTooltipCallback?: ((item: T) => string | HTMLElement) | null;
+    /** Callback to generate custom tooltip text for a remove button */
+    getRemoveButtonTooltipCallback?: ((item: T) => string) | null;
+    /** Format string for remove button tooltip text. Use {0} as placeholder for item name. Default: "Remove {0}" */
+    removeButtonTooltipText?: string;
+    /** Tooltip placement relative to badge */
+    badgeTooltipPlacement?: Placement;
+    /** Delay before showing tooltip in milliseconds */
+    badgeTooltipDelay?: number;
+    /** Offset distance for tooltip in pixels */
+    badgeTooltipOffset?: number;
+    /** Container element for dropdown/hint/popover (for Shadow DOM support) */
+    container?: HTMLElement | null;
+    /** Host element for appending hidden inputs (for form integration with shadow DOM) */
+    hostElement?: HTMLElement;
+}
+
+export declare class MultiSelectElement<T = any> extends BaseElement {
+    private picker?;
+    private containerElement?;
+    private shadow;
+    private _options?;
+    private _valueMember?;
+    private _getValueCallback?;
+    private _displayValueMember?;
+    private _getDisplayValueCallback?;
+    private _getBadgeDisplayCallback?;
+    private _getBadgeClassCallback?;
+    private _customStylesCallback?;
+    private _searchValueMember?;
+    private _getSearchValueCallback?;
+    private _iconMember?;
+    private _getIconCallback?;
+    private _subtitleMember?;
+    private _getSubtitleCallback?;
+    private _groupMember?;
+    private _getGroupCallback?;
+    private _renderGroupLabelContentCallback?;
+    private _disabledMember?;
+    private _getDisabledCallback?;
+    private _getValueFormatCallback?;
+    private _getBadgeTooltipCallback?;
+    private _getRemoveButtonTooltipCallback?;
+    private _renderOptionContentCallback?;
+    private _renderBadgeContentCallback?;
+    private _renderSelectedItemContentCallback?;
+    private _getSelectedItemClassCallback?;
+    private _renderSelectedContentCallback?;
+    private _getCounterCallback?;
+    private _actionButtons?;
+    private _beforeSearchCallback?;
+    private _searchCallback?;
+    private _addNewCallback?;
+    private _selectCallback?;
+    private _deselectCallback?;
+    private _changeCallback?;
+    static get observedAttributes(): string[];
+    constructor();
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
+    private render;
+    private renderDebugInfo;
+    private updateDebugInfo;
+    /**
+     * Parse declarative <option> and <optgroup> elements from Light DOM
+     * Returns array of options in the format expected by the picker
+     */
+    private parseDeclarativeOptions;
+    private _declarativeSelectedValues?;
+    private initializePicker;
+    private reinitialize;
+    get options(): T[] | undefined;
+    set options(value: T[] | undefined);
+    set valueMember(value: string | null);
+    get valueMember(): string | null;
+    set displayValueMember(value: string | null);
+    get displayValueMember(): string | null;
+    set searchValueMember(value: string | null);
+    get searchValueMember(): string | null;
+    set iconMember(value: string | null);
+    get iconMember(): string | null;
+    set subtitleMember(value: string | null);
+    get subtitleMember(): string | null;
+    set groupMember(value: string | null);
+    get groupMember(): string | null;
+    set disabledMember(value: string | null);
+    get disabledMember(): string | null;
+    set getValueCallback(callback: ((item: T) => string | number) | undefined);
+    get getValueCallback(): ((item: T) => string | number) | undefined;
+    set getDisplayValueCallback(callback: ((item: T) => string) | undefined);
+    get getDisplayValueCallback(): ((item: T) => string) | undefined;
+    set getBadgeDisplayCallback(callback: ((item: T) => string) | undefined);
+    get getBadgeDisplayCallback(): ((item: T) => string) | undefined;
+    set getBadgeClassCallback(callback: ((item: T) => string | string[]) | undefined);
+    get getBadgeClassCallback(): ((item: T) => string | string[]) | undefined;
+    set customStylesCallback(value: (() => string) | undefined);
+    get customStylesCallback(): (() => string) | undefined;
+    set getSearchValueCallback(callback: ((item: T) => string) | undefined);
+    get getSearchValueCallback(): ((item: T) => string) | undefined;
+    set getIconCallback(callback: ((item: T) => string) | undefined);
+    get getIconCallback(): ((item: T) => string) | undefined;
+    set getSubtitleCallback(callback: ((item: T) => string) | undefined);
+    get getSubtitleCallback(): ((item: T) => string) | undefined;
+    set getGroupCallback(callback: ((item: T) => string) | undefined);
+    get getGroupCallback(): ((item: T) => string) | undefined;
+    set renderGroupLabelContentCallback(callback: ((groupName: string) => string | HTMLElement) | undefined);
+    get renderGroupLabelContentCallback(): ((groupName: string) => string | HTMLElement) | undefined;
+    set getDisabledCallback(callback: ((item: T) => boolean) | undefined);
+    get getDisabledCallback(): ((item: T) => boolean) | undefined;
+    set renderOptionContentCallback(callback: ((item: T, context: OptionContentRenderContext) => string | HTMLElement) | undefined);
+    get renderOptionContentCallback(): ((item: T, context: OptionContentRenderContext) => string | HTMLElement) | undefined;
+    set renderBadgeContentCallback(callback: ((item: T, context: BadgeContentRenderContext) => string | HTMLElement) | undefined);
+    get renderBadgeContentCallback(): ((item: T, context: BadgeContentRenderContext) => string | HTMLElement) | undefined;
+    set renderSelectedItemContentCallback(callback: ((item: T) => string | HTMLElement) | undefined);
+    get renderSelectedItemContentCallback(): ((item: T) => string | HTMLElement) | undefined;
+    set getSelectedItemClassCallback(callback: ((item: T) => string | string[]) | undefined);
+    get getSelectedItemClassCallback(): ((item: T) => string | string[]) | undefined;
+    set renderSelectedContentCallback(callback: ((item: T) => string) | undefined);
+    get renderSelectedContentCallback(): ((item: T) => string) | undefined;
+    set name(value: string | null);
+    get name(): string | null;
+    set valueFormat(value: 'json' | 'csv' | 'array' | null);
+    get valueFormat(): string | null;
+    set getValueFormatCallback(callback: ((values: (string | number)[]) => string) | undefined);
+    get getValueFormatCallback(): ((values: (string | number)[]) => string) | undefined;
+    set thresholdMode(value: 'count' | 'partial' | null);
+    get thresholdMode(): string | null;
+    set badgesMaxVisible(value: number | null);
+    get badgesMaxVisible(): number | null;
+    set checkboxAlign(value: 'top' | 'center' | 'bottom' | null);
+    get checkboxAlign(): string | null;
+    set enableBadgeTooltips(value: boolean);
+    get enableBadgeTooltips(): boolean;
+    set badgeTooltipPlacement(value: string | null);
+    get badgeTooltipPlacement(): string | null;
+    set getBadgeTooltipCallback(callback: ((item: T) => string | HTMLElement) | undefined);
+    get getBadgeTooltipCallback(): ((item: T) => string | HTMLElement) | undefined;
+    set getRemoveButtonTooltipCallback(callback: ((item: T) => string) | undefined);
+    get getRemoveButtonTooltipCallback(): ((item: T) => string) | undefined;
+    set removeButtonTooltipText(value: string | null);
+    get removeButtonTooltipText(): string | null;
+    set getCounterCallback(callback: ((count: number, moreCount?: number) => string) | undefined);
+    get getCounterCallback(): ((count: number, moreCount?: number) => string) | undefined;
+    get beforeSearchCallback(): ((searchTerm: string) => string | null) | undefined;
+    set beforeSearchCallback(callback: ((searchTerm: string) => string | null) | undefined);
+    get searchCallback(): ((searchTerm: string) => Promise<T[]>) | undefined;
+    set searchCallback(callback: ((searchTerm: string) => Promise<T[]>) | undefined);
+    get addNewCallback(): ((value: string) => T | Promise<T>) | undefined;
+    set addNewCallback(callback: ((value: string) => T | Promise<T>) | undefined);
+    get selectCallback(): ((option: T) => void) | undefined;
+    set selectCallback(callback: ((option: T) => void) | undefined);
+    get deselectCallback(): ((option: T) => void) | undefined;
+    set deselectCallback(callback: ((option: T) => void) | undefined);
+    get changeCallback(): ((selectedOptions: T[]) => void) | undefined;
+    set changeCallback(callback: ((selectedOptions: T[]) => void) | undefined);
+    get actionButtons(): any[] | undefined;
+    set actionButtons(value: any[] | undefined);
+    get selectedValue(): string | number | (string | number)[] | null;
+    get selectedItem(): T | null;
+    getSelected(): T[];
+    setSelected(values: (string | number)[]): void;
+    getValue(): string | number | (string | number)[] | null;
+    destroy(): void;
+}
+
+/**
+ * Event detail structure for multiselect events
+ * @template T The type of data items
+ */
+export declare interface MultiSelectEventDetail<T = any> {
+    /** Currently selected options */
+    selectedOptions: T[];
+    /** Selected values array */
+    selectedValues: (string | number)[];
+    /** The option that triggered the event (for select/deselect) */
+    option?: T;
+}
+
+/**
+ * Legacy interface for backward reference
+ * Note: New code should use generic types with member/callback properties
+ * @deprecated Use generic types with valueMember/displayValueMember instead
+ */
+export declare interface MultiSelectOption {
+    /** Unique identifier for the option */
+    value: string;
+    /** Display label */
+    label: string;
+    /** Optional icon or emoji */
+    icon?: string;
+    /** Optional subtitle/description */
+    subtitle?: string;
+    /** Optional group name */
+    group?: string;
+    /** Whether the option is disabled */
+    disabled?: boolean;
+}
+
+/**
+ * Legacy options interface
+ * @deprecated Use MultiSelectConfig<T> instead
+ */
+export declare interface MultiSelectOptions extends MultiSelectConfig<MultiSelectOption> {
+    options?: MultiSelectOption[];
+    searchCallback?: ((searchTerm: string) => Promise<MultiSelectOption[]>) | null;
+    addNewCallback?: ((value: string) => MultiSelectOption | Promise<MultiSelectOption>) | null;
+    selectCallback?: ((option: MultiSelectOption) => void) | null;
+    deselectCallback?: ((option: MultiSelectOption) => void) | null;
+    changeCallback?: ((selectedOptions: MultiSelectOption[]) => void) | null;
+}
+
+/**
+ * Context provided to renderOptionContentCallback
+ */
+declare interface OptionContentRenderContext {
+    /** Index of the option in the filtered list */
+    index: number;
+    /** Whether the option is currently selected */
+    isSelected: boolean;
+    /** Whether the option is currently focused (keyboard navigation) */
+    isFocused: boolean;
+    /** Whether the option matches the current search term (navigate mode only) */
+    isMatched: boolean;
+    /** Whether the option is disabled */
+    isDisabled: boolean;
+}
+
+/**
+ * Search input display mode
+ */
+export declare type SearchInputMode = 'normal' | 'readonly' | 'hidden';
+
+/**
+ * Search behavior mode
+ * - 'filter': Hide non-matching options (default)
+ * - 'navigate': Keep all options visible, jump to matches
+ */
+export declare type SearchMode = 'filter' | 'navigate';
+
+/**
+ * Set log level for a specific category
+ * @param category Category logger to configure (e.g., 'MULTISELECT:UI')
+ * @param level Log level to set ('trace' | 'debug' | 'info' | 'warn' | 'error' | 'silent')
+ */
+export declare function setCategoryLevel(category: string, level: string): void;
+
+/**
+ * Set log level for all loggers
+ * @param level Log level to set ('trace' | 'debug' | 'info' | 'warn' | 'error' | 'silent')
+ */
+export declare function setLogLevel(level: string): void;
+
+export declare const uiLogger: any;
+
+/**
+ * Value format for serialization (forms and callbacks)
+ */
+export declare type ValueFormat = 'json' | 'csv' | 'array';
+
+export declare class WebMultiSelect<T = any> {
+    private element;
+    private instanceId;
+    private options;
+    private isOpen;
+    private selectedValues;
+    private selectedOptions;
+    private allOptions;
+    private filteredOptions;
+    private hiddenInputs;
+    private focusedIndex;
+    private matchingIndices;
+    private searchTerm;
+    private isLoading;
+    private showSelectedPopover;
+    private selectedPopoverPlacement;
+    private dropdownPlacement;
+    private isRTL;
+    private effectiveBadgesPosition;
+    private justClosedViaClick;
+    private dropdownCleanup;
+    private hintCleanup;
+    private selectedPopoverCleanup;
+    private badgeTooltips;
+    private badgeTooltipCleanups;
+    private badgeTooltipShowTimeouts;
+    private badgeTooltipHideTimeouts;
+    private actionButtonTooltips;
+    private actionButtonTooltipCleanups;
+    private virtualScroll;
+    private optionsContainer;
+    private selectedPopoverVirtualScroll;
+    private selectedPopoverContainer;
+    private input;
+    private dropdown;
+    private dropdownInner;
+    private badgesContainer;
+    private counter;
+    private hint?;
+    private selectedPopover;
+    private documentKeydownHandler;
+    private documentClickHandler;
+    /**
+     * Extract value/ID from item
+     * Precedence: tuple[0] -> valueMember -> getValueCallback -> '[N/A]'
+     */
+    private getItemValue;
+    /**
+     * Extract display value from item
+     * Precedence: tuple[1] -> displayValueMember -> getDisplayValueCallback -> '[N/A]'
+     */
+    private getItemDisplayValue;
+    /**
+     * Extract badge display value from item
+     * Precedence: getBadgeDisplayCallback -> getItemDisplayValue()
+     * This allows customizing badge text separately from dropdown display text
+     */
+    private getItemBadgeDisplayValue;
+    /**
+     * Extract search value from item
+     * Precedence: searchValueMember -> getSearchValueCallback -> displayValue
+     */
+    private getItemSearchValue;
+    /**
+     * Extract icon from item
+     */
+    private getItemIcon;
+    /**
+     * Extract subtitle from item
+     */
+    private getItemSubtitle;
+    /**
+     * Extract group from item
+     */
+    private getItemGroup;
+    /**
+     * Extract disabled state from item
+     */
+    private getItemDisabled;
+    constructor(element: HTMLElement, options?: Partial<MultiSelectConfig<T>>);
+    private init;
+    private parseOptions;
+    private buildHTML;
+    /**
+     * Check if virtual scroll should be used
+     */
+    private shouldUseVirtualScroll;
+    /**
+     * Check if any options have groups
+     */
+    private hasGroups;
+    private renderDropdown;
+    /**
+     * Render dropdown with virtual scrolling
+     */
+    private renderDropdownVirtual;
+    private renderOption;
+    private highlightMatch;
+    private groupOptions;
+    private renderBadges;
+    private attachEvents;
+    private handleSearch;
+    private handleKeydown;
+    private handleDropdownClick;
+    private handleBadgeClick;
+    private handleClickOutside;
+    private focusNext;
+    private focusPrevious;
+    private focusFirst;
+    private focusLast;
+    private focusNextMatch;
+    private focusPreviousMatch;
+    private focusPageUp;
+    private focusPageDown;
+    private scrollToFocused;
+    private toggleOption;
+    private handleAddNew;
+    private selectOption;
+    private deselectOption;
+    private selectAll;
+    private clearAll;
+    private open;
+    private close;
+    private positionDropdown;
+    private positionHint;
+    private parseInitialSelection;
+    private toggleSelectedPopover;
+    private showPopover;
+    private hideSelectedPopover;
+    private renderSelectedPopover;
+    private renderSelectedPopoverVirtual;
+    private renderBadgeForPopover;
+    private handleSelectedPopoverClick;
+    private positionSelectedPopover;
+    private updateHiddenInput;
+    private getFormValue;
+    getSelected(): T[];
+    setSelected(values: (string | number)[]): void;
+    get selectedItem(): T | null;
+    get selectedValue(): string | number | (string | number)[] | null;
+    getValue(): string | number | (string | number)[] | null;
+    private attachBadgeTooltips;
+    private createTooltipForElement;
+    private createRemoveButtonTooltip;
+    private positionBadgeTooltip;
+    private cleanupBadgeTooltip;
+    private destroyAllBadgeTooltips;
+    private attachActionButtonTooltips;
+    private createActionButtonTooltip;
+    private positionActionButtonTooltip;
+    private cleanupActionButtonTooltip;
+    private destroyAllActionButtonTooltips;
+    destroy(): void;
+}
+
+export { }