@lion/ui
Version: 
A package of extendable web components
63 lines • 2.22 kB
TypeScript
/**
 * LionSelect: wraps the native HTML element select
 *
 * <lion-select>
 *   <label slot="label">My Input</label>
 *   <select slot="input">
 *    <option value="top">top</option>
 *    <option value="bottom">bottom</option>
 *   </select>
 * </lion-select>
 *
 * You can preselect an option by setting the property modelValue.
 *   Example:
 *     <lion-select .modelValue="${'<value of option 2>'}">
 *
 * It extends LionField so it inherits required and disabled.
 *
 * The option element needs to be a direct child of the select element.
 *
 * You cannot use interactive elements inside the options. Avoid very long names to
 * facilitate the understandability and perceivability for screen reader users. Sets of options
 * where each option name starts with the same word or phrase can also significantly degrade
 * usability for keyboard and screen reader users.
 *
 * @customElement lion-select
 */
export class LionSelect extends LionFieldWithSelect {
    __selectObserver: MutationObserver | undefined;
    /** @param {import('lit').PropertyValues } changedProperties */
    updated(changedProperties: import('lit').PropertyValues): void;
    /**
     * @override FormatMixin - set formattedValue to selected option text
     * @param {*} v - modelValue: can be an Object, Number, String depending on the
     * input type(date, number, email etc)
     * @returns {string} formattedValue
     */
    override formatter(v: any): string;
    /** @protected */
    protected _proxyChangeEvent(): void;
}
export type FormatOptions = import('../../localize/types/LocalizeMixinTypes.js').FormatNumberOptions;
/**
 * @typedef {import('../../localize/types/LocalizeMixinTypes.js').FormatNumberOptions} FormatOptions
 */
/**
 * @customElement lion-field-with-select
 */
declare class LionFieldWithSelect extends LionField {
    /** @type {any} */
    static get properties(): any;
    /**
     * Delegates autocomplete to select
     * @type {string|undefined}
     */
    autocomplete: string | undefined;
    /**
     * @returns {HTMLSelectElement}
     */
    get _inputNode(): HTMLSelectElement;
}
import { LionField } from "../../../exports/form-core.js";
export {};
//# sourceMappingURL=LionSelect.d.ts.map