dap-design-system/dist/components/combobox/comboboxBase.d.ts

Official design system for the DÁP (dap.gov.hu)

import { PropertyValueMap } from 'lit';
import { PopupPlacement } from '../../common/types';
import { GenericFormElement } from '../../internal/mixin/genericFormElement';
import { default as DapDSOptionList } from '../option-list/option-list.component';
export default class ComboboxBaseElement extends GenericFormElement {
    readonly triggerInput: HTMLInputElement;
    readonly optionList: DapDSOptionList;
    placement: PopupPlacement;
    opened: boolean;
    searchMode: 'none' | 'typehead' | 'autocomplete' | 'manual';
    search: boolean;
    clearButton?: string;
    placeholder: string | null;
    sync?: boolean;
    allowManualInput?: boolean;
    searchForText?: boolean;
    searchOnValueSet?: string | undefined;
    loading?: boolean;
    selectable?: string;
    noAnimation?: boolean;
    textComplete?: boolean;
    openOnEmpty?: boolean;
    disableViewportAutoClose: boolean;
    searchButtonAriaLabel?: string;
    subtle: boolean;
    multiselect: boolean;
    maxSelections?: number;
    /** `data-testid` for the clear button. */
    clearButtonTestId: string;
    /** `data-testid` for the search button. */
    searchButtonTestId: string;
    /**
     * When enabled, the search button (the trailing icon button in search mode) is
     * automatically disabled while the input is empty and re-enabled as soon as the
     * user types. Opt-in; does not affect the input itself, which stays editable.
     */
    disableSearchWhenEmpty: boolean;
    /** True when the search input currently holds non-whitespace text. */
    private get hasSearchText();
    selectedItem: any;
    selectedItems: any[];
    currentItem: any;
    selectedText: string;
    private optionListObserver;
    private isUserInteraction;
    private pendingInitialValues;
    static readonly styles: import('lit').CSSResult;
    protected firstUpdated(_changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): Promise<void>;
    protected updated(_changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void;
    private get isFreeTextSearch();
    /**
     * Handles value changes from outside the component
     * This ensures the selection state is updated when the value is set programmatically
     */
    private handleValueChange;
    private setupOptionListObserver;
    private updateComboboxState;
    /**
     * Updates the selection state based on the current value
     * This is useful when options are loaded asynchronously
     */
    private updateSelectionFromValue;
    private cleanupOptionListObserver;
    disconnectedCallback(): void;
    attributeChangedCallback(name: string, _old: string | null, value: string | null): void;
    get isAutoComplete(): boolean;
    /**
     * Get all option items directly from the combobox element
     * This is more reliable for dynamic updates than the option list component
     */
    private getComboboxOptions;
    get isOpenOnEmpty(): boolean;
    get isOpenOnAutocomplete(): boolean;
    get shouldHideClearIcon(): boolean;
    handleClick: () => void;
    private handleEnterKey;
    private handleCurrentItemEnter;
    private handleSearchEnter;
    private handleDefaultEnter;
    private handleSelectedItemChange;
    private handleTextSearch;
    private handleArrowKeys;
    handleKeyDown: (event: KeyboardEvent) => Promise<false | void | 0>;
    handleInput: (event: InputEvent) => Promise<void>;
    clearSelection(): Promise<void>;
    /**
     * Multiselect helper methods
     */
    private getSelectedValues;
    private isMaxSelectionsReached;
    private addSelectedItem;
    private removeSelectedItem;
    private clearAllSelections;
    private updateMultipleSelectionsFromValues;
    /**
     * Override value getter/setter to handle multiselect mode
     */
    get value(): string | undefined;
    set value(val: string | undefined);
    handleListKeyDown: (event: CustomEvent) => void;
    handleDocumentMouseDown: (event: MouseEvent) => void;
    private readonly handlePopupAutoClose;
    handleFocus: () => void;
    handleBlur: () => void;
    showDropDown(): Promise<void>;
    hideDropDown(options?: {
        skipFocus?: boolean;
    }): Promise<void>;
    get focusElement(): HTMLInputElement;
    handleSelectedChange: (event: CustomEvent) => Promise<void>;
    handleOptionDeselect: (event: CustomEvent) => void;
    handleCurrentOptionChange: (event: CustomEvent) => void;
    handleListChanged: (event: CustomEvent) => void;
    handleClearClick: () => void;
    handleSearchClick: (event: MouseEvent) => void;
    private setSelectionRange;
    private clearSelectionRange;
    getValidity(): boolean;
    formResetCallback(): void;
    private getMultiSelectValidity;
    private getAutoCompleteValidity;
    private getManualInputValidity;
    private getSearchTextValidity;
    private getSelectedItemValidity;
    private getBasicValidity;
    get validity(): ValidityState;
    get validationMessage(): string;
    checkValidity(): boolean;
    reportValidity(): boolean;
    setValidity(): void;
    handleInvalid(event: Event): void;
    getActiveDescendant(): HTMLInputElement | import('../option-item/option-item.component').default | null | undefined;
    getSearchIconSize(size: string): "sm" | "md" | "lg";
    getInnerIconSize(size: string): 16 | 10;
    private handleChipRemove;
    private renderChip;
    private renderChips;
    private renderInput;
    private renderClearButton;
    private renderIndicatorIcon;
    private renderSelectActions;
    private renderOptionList;
    renderCombobox(): import('lit-html').TemplateResult;
}