import IdsDropdown from '../ids-dropdown/ids-dropdown'; import { IdsDropdownOptions } from '../ids-dropdown/ids-dropdown-common'; import '../ids-tag/ids-tag'; import '../ids-text/ids-text'; import '../ids-list-box/ids-list-box-option'; import '../ids-search-field/ids-search-field'; import type IdsListBoxOption from '../ids-list-box/ids-list-box-option'; /** * IDS Multiselect Component * @type {IdsMultiselect} * @inherits IdsDropdown * @part container - the container element */ declare class IdsMultiselect extends IdsDropdown { #private; constructor(); /** * Invoked each time the custom element is add into a document-connected element */ connectedCallback(): void; disconnectedCallback(): void; /** * Watches for changes * @property {MutationObserver} mo this button component's mutation observer */ private mo?; optionsData: IdsDropdownOptions; internalSelectedList: Array; private initialSelectedList; /** * Return the attributes we handle as getters and setters * @returns {Array} The attributes in an array */ static get attributes(): any[]; /** * Sets the disabled attribute * @param {boolean | string} value string value from the disabled attribute */ set disabled(value: boolean | string); /** * Gets the value of the disabled property * @returns {boolean} a boolean indicating the elements disabled status */ get disabled(): boolean | string; /** * Sets the tags attribute which determines if selected options are displayed as tags * @param {boolean | string} value string or boolean that sets the use of tag attribute */ set tags(value: boolean | string); /** * returns whether the multiselect is set to display selections as tags * @returns {boolean | string} a boolean indicating tags setting */ get tags(): boolean | string; /** * Sets the placeholder attribute * @param {string} value - the placeholder text */ set placeholder(value: string); /** * Get the placeholder attribute * @returns {string} the placeholder text */ get placeholder(): string; /** * sets the max possible selections for multiselect * @param {string|number} value the max number of selections allowed */ set max(value: any); /** * returns the maximum number of allowed selections * @returns {number} the maximum number of selectable options */ get max(): number; /** * Sets the select-all attribute which enables a select all option * @param {boolean | string} value string or boolean that enables select all */ set selectAll(value: boolean | string); /** * returns whether the multiselect has select all enabled * @returns {boolean | string} a boolean indicating select all setting */ get selectAll(): boolean | string; /** * Sets the tag-color attribute which determines the color of tags * @param {string} value the color value for tags */ set tagColor(value: string); /** * Gets the tag color * @returns {string} the tag color value */ get tagColor(): string; /** * Sets the show-apply attribute * @param {boolean | string} value string or boolean that shows apply button */ set showApply(value: boolean | string); /** * Gets whether the multiselect shows apply button * @returns {boolean} a boolean indicating show apply setting */ get showApply(): boolean; /** * Sets the show-cancel attribute * @param {boolean | string} value string or boolean that shows cancel button */ set showCancel(value: boolean | string); /** * Gets whether the multiselect shows cancel button * @returns {boolean} a boolean indicating show cancel setting */ get showCancel(): boolean; /** * Sets the show-clear attribute * @param {boolean | string} value string or boolean that shows clear button */ set showClear(value: boolean | string); /** * Gets whether the multiselect shows clear button * @returns {boolean} a boolean indicating show clear setting */ get showClear(): boolean; /** * Set the selected values of the multiselect using the provided array * @param {Array} value the array of values to set as selected */ set value(value: any); /** * Gets the current value of the component. * @returns {Array|string} Returns the internal selected list if it exists and has items, * otherwise returns the value attribute from the element. * @property {Array|string} value - The current selected value(s). */ get value(): any; /** * Returns the selected Listbox option based on the Dropdown's value. * @returns {IdsListBoxOption[]} the selected option */ get selectedOptions(): IdsListBoxOption[]; /** * Sets up a MutationObserver to watch for changes in the list box children. * When child elements are added or removed, triggers repopulation of selected items. * @private * @returns {void} */ private mountMutationObservables; /** * Push label-position to the container element * @returns {void} */ onLabelPositionChange(): void; /** * Push label-width to the container element * @returns {void} */ onLabelWidthChange(): void; /** * Push label-align-y to the container element * @returns {void} */ onLabelAlignYChange(): void; /** * Update selected options */ updateSelected(): void; /** * Rewriting dropdown click events */ attachClickEvent(): void; /** * Toggles the visibility of the multiselect dropdown * @param {boolean} [isOpen] - Optional parameter to force open (true) or closed (false) state * If not provided, toggles based on current state * @returns {void} */ toggle(isOpen?: boolean): Promise; /** * Restore the initial selected state (used by cancel functionality) */ restoreInitialState(): void; /** * Establish selection event for keyboard interactions. * Overrides a similiar method from IdsDropdown for Multiselect-specific behavior. */ attachKeyboardSelectionEvent(): void; /** * Removes selected attributes from an option * @param {HTMLElement} option element to remove attributes */ deselectOption(option: HTMLElement | undefined | null): void; /** * Closes all other open multiselect and dropdown filters to ensure only one filter is open at a time. * Searches both regular DOM and data grid shadow DOM for open filters. * @returns {void} */ closeOtherFilters(): void; /** * Close the dropdown popup * Rewriting it to add multiselect value update * @param {boolean} noFocus if true do not focus on close */ close(noFocus?: boolean): void; /** * Add select all option to the list box */ private addSelectAllOption; /** * Set typeahead attribute * @param {boolean | string} value typeahead value */ set typeahead(value: boolean | string); /** * Get the typeahead attribute * @returns {boolean} typeahead attribute value converted to boolean */ get typeahead(): boolean; /** * Handle select all checkbox toggle * @param {IdsListBoxOption} selectAllOption the select all option element */ private handleSelectAll; /** * Get all selectable options (excluding select-all and group labels) * @returns {IdsListBoxOption[]} array of selectable options */ private getAllSelectableOptions; /** * Update select all checkbox state based on current selections */ updateSelectAllState(): void; } export default IdsMultiselect;