@material/web 1.0.0-pre.5 → 1.0.0-pre.7

package/select/lib/outlined-select-styles.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"outlined-select-styles.css.js","sourceRoot":"","sources":["outlined-select-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n  * @license\n  * Copyright 2022 Google LLC\n  * SPDX-License-Identifier: Apache-2.0\n  */\n import {css} from 'lit';\n export const styles = css`:host{--_text-field-container-shape: var(--md-outlined-select-text-field-container-shape, 4px);--_text-field-disabled-input-text-color: var(--md-outlined-select-text-field-disabled-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_text-field-disabled-input-text-opacity: var(--md-outlined-select-text-field-disabled-input-text-opacity, 0.38);--_text-field-disabled-label-text-color: var(--md-outlined-select-text-field-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_text-field-disabled-label-text-opacity: var(--md-outlined-select-text-field-disabled-label-text-opacity, 0.38);--_text-field-disabled-leading-icon-color: var(--md-outlined-select-text-field-disabled-leading-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_text-field-disabled-leading-icon-opacity: var(--md-outlined-select-text-field-disabled-leading-icon-opacity, 0.38);--_text-field-disabled-outline-color: var(--md-outlined-select-text-field-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_text-field-disabled-outline-opacity: var(--md-outlined-select-text-field-disabled-outline-opacity, 0.12);--_text-field-disabled-outline-width: var(--md-outlined-select-text-field-disabled-outline-width, 1px);--_text-field-disabled-supporting-text-color: var(--md-outlined-select-text-field-disabled-supporting-text-color, var(--md-sys-color-on-surface, #1d1b20));--_text-field-disabled-supporting-text-opacity: var(--md-outlined-select-text-field-disabled-supporting-text-opacity, 0.38);--_text-field-disabled-trailing-icon-color: var(--md-outlined-select-text-field-disabled-trailing-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_text-field-disabled-trailing-icon-opacity: var(--md-outlined-select-text-field-disabled-trailing-icon-opacity, 0.38);--_text-field-error-focus-input-text-color: var(--md-outlined-select-text-field-error-focus-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_text-field-error-focus-label-text-color: var(--md-outlined-select-text-field-error-focus-label-text-color, var(--md-sys-color-error, #b3261e));--_text-field-error-focus-leading-icon-color: var(--md-outlined-select-text-field-error-focus-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_text-field-error-focus-outline-color: var(--md-outlined-select-text-field-error-focus-outline-color, var(--md-sys-color-error, #b3261e));--_text-field-error-focus-supporting-text-color: var(--md-outlined-select-text-field-error-focus-supporting-text-color, var(--md-sys-color-error, #b3261e));--_text-field-error-focus-trailing-icon-color: var(--md-outlined-select-text-field-error-focus-trailing-icon-color, var(--md-sys-color-error, #b3261e));--_text-field-error-hover-input-text-color: var(--md-outlined-select-text-field-error-hover-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_text-field-error-hover-label-text-color: var(--md-outlined-select-text-field-error-hover-label-text-color, var(--md-sys-color-on-error-container, #410e0b));--_text-field-error-hover-leading-icon-color: var(--md-outlined-select-text-field-error-hover-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_text-field-error-hover-outline-color: var(--md-outlined-select-text-field-error-hover-outline-color, var(--md-sys-color-on-error-container, #410e0b));--_text-field-error-hover-supporting-text-color: var(--md-outlined-select-text-field-error-hover-supporting-text-color, var(--md-sys-color-error, #b3261e));--_text-field-error-hover-trailing-icon-color: var(--md-outlined-select-text-field-error-hover-trailing-icon-color, var(--md-sys-color-on-error-container, #410e0b));--_text-field-error-input-text-color: var(--md-outlined-select-text-field-error-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_text-field-error-label-text-color: var(--md-outlined-select-text-field-error-label-text-color, var(--md-sys-color-error, #b3261e));--_text-field-error-leading-icon-color: var(--md-outlined-select-text-field-error-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_text-field-error-outline-color: var(--md-outlined-select-text-field-error-outline-color, var(--md-sys-color-error, #b3261e));--_text-field-error-supporting-text-color: var(--md-outlined-select-text-field-error-supporting-text-color, var(--md-sys-color-error, #b3261e));--_text-field-error-trailing-icon-color: var(--md-outlined-select-text-field-error-trailing-icon-color, var(--md-sys-color-error, #b3261e));--_text-field-focus-input-text-color: var(--md-outlined-select-text-field-focus-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_text-field-focus-label-text-color: var(--md-outlined-select-text-field-focus-label-text-color, var(--md-sys-color-primary, #6750a4));--_text-field-focus-leading-icon-color: var(--md-outlined-select-text-field-focus-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_text-field-focus-outline-color: var(--md-outlined-select-text-field-focus-outline-color, var(--md-sys-color-primary, #6750a4));--_text-field-focus-outline-width: var(--md-outlined-select-text-field-focus-outline-width, 2px);--_text-field-focus-supporting-text-color: var(--md-outlined-select-text-field-focus-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_text-field-focus-trailing-icon-color: var(--md-outlined-select-text-field-focus-trailing-icon-color, var(--md-sys-color-primary, #6750a4));--_text-field-hover-input-text-color: var(--md-outlined-select-text-field-hover-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_text-field-hover-label-text-color: var(--md-outlined-select-text-field-hover-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_text-field-hover-leading-icon-color: var(--md-outlined-select-text-field-hover-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_text-field-hover-outline-color: var(--md-outlined-select-text-field-hover-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_text-field-hover-outline-width: var(--md-outlined-select-text-field-hover-outline-width, 1px);--_text-field-hover-supporting-text-color: var(--md-outlined-select-text-field-hover-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_text-field-hover-trailing-icon-color: var(--md-outlined-select-text-field-hover-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_text-field-input-text-color: var(--md-outlined-select-text-field-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_text-field-input-text-type: var(--md-outlined-select-text-field-input-text-type, 400 1rem / 1.5rem var(--md-ref-typeface-plain, Roboto));--_text-field-label-text-color: var(--md-outlined-select-text-field-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_text-field-label-text-populated-line-height: var(--md-outlined-select-text-field-label-text-populated-line-height, 1rem);--_text-field-label-text-populated-size: var(--md-outlined-select-text-field-label-text-populated-size, 0.75rem);--_text-field-label-text-type: var(--md-outlined-select-text-field-label-text-type, 400 1rem / 1.5rem var(--md-ref-typeface-plain, Roboto));--_text-field-leading-icon-color: var(--md-outlined-select-text-field-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_text-field-leading-icon-size: var(--md-outlined-select-text-field-leading-icon-size, 24px);--_text-field-outline-color: var(--md-outlined-select-text-field-outline-color, var(--md-sys-color-outline, #79747e));--_text-field-outline-width: var(--md-outlined-select-text-field-outline-width, 1px);--_text-field-supporting-text-color: var(--md-outlined-select-text-field-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_text-field-supporting-text-type: var(--md-outlined-select-text-field-supporting-text-type, 400 0.75rem / 1rem var(--md-ref-typeface-plain, Roboto));--_text-field-trailing-icon-color: var(--md-outlined-select-text-field-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_text-field-trailing-icon-size: var(--md-outlined-select-text-field-trailing-icon-size, 24px);--md-outlined-field-container-shape-start-start:var(--md-outlined-field-container-shape, var(--_text-field-container-shape));--md-outlined-field-container-shape-start-end:var(--md-outlined-field-container-shape, var(--_text-field-container-shape));--md-outlined-field-container-shape-end-end:var(--md-outlined-field-container-shape, var(--_text-field-container-shape));--md-outlined-field-container-shape-end-start:var(--md-outlined-field-container-shape, var(--_text-field-container-shape));--md-outlined-field-content-color:var(--_text-field-input-text-color);--md-outlined-field-content-type:var(--_text-field-input-text-type);--md-outlined-field-disabled-content-color:var(--_text-field-disabled-input-text-color);--md-outlined-field-disabled-content-opacity:var(--_text-field-disabled-input-text-opacity);--md-outlined-field-disabled-label-text-color:var(--_text-field-disabled-label-text-color);--md-outlined-field-disabled-label-text-opacity:var(--_text-field-disabled-label-text-opacity);--md-outlined-field-disabled-leading-content-color:var(--_text-field-disabled-leading-icon-color);--md-outlined-field-disabled-leading-content-opacity:var(--_text-field-disabled-leading-icon-opacity);--md-outlined-field-disabled-outline-color:var(--_text-field-disabled-outline-color);--md-outlined-field-disabled-outline-opacity:var(--_text-field-disabled-outline-opacity);--md-outlined-field-disabled-outline-width:var(--_text-field-disabled-outline-width);--md-outlined-field-disabled-supporting-text-color:var(--_text-field-disabled-supporting-text-color);--md-outlined-field-disabled-supporting-text-opacity:var(--_text-field-disabled-supporting-text-opacity);--md-outlined-field-disabled-trailing-content-color:var(--_text-field-disabled-trailing-icon-color);--md-outlined-field-disabled-trailing-content-opacity:var(--_text-field-disabled-trailing-icon-opacity);--md-outlined-field-error-content-color:var(--_text-field-error-input-text-color);--md-outlined-field-error-focus-content-color:var(--_text-field-error-focus-input-text-color);--md-outlined-field-error-focus-label-text-color:var(--_text-field-error-focus-label-text-color);--md-outlined-field-error-focus-leading-content-color:var(--_text-field-error-focus-leading-icon-color);--md-outlined-field-error-focus-outline-color:var(--_text-field-error-focus-outline-color);--md-outlined-field-error-focus-supporting-text-color:var(--_text-field-error-focus-supporting-text-color);--md-outlined-field-error-focus-trailing-content-color:var(--_text-field-error-focus-trailing-icon-color);--md-outlined-field-error-hover-content-color:var(--_text-field-error-hover-input-text-color);--md-outlined-field-error-hover-label-text-color:var(--_text-field-error-hover-label-text-color);--md-outlined-field-error-hover-leading-content-color:var(--_text-field-error-hover-leading-icon-color);--md-outlined-field-error-hover-outline-color:var(--_text-field-error-hover-outline-color);--md-outlined-field-error-hover-supporting-text-color:var(--_text-field-error-hover-supporting-text-color);--md-outlined-field-error-hover-trailing-content-color:var(--_text-field-error-hover-trailing-icon-color);--md-outlined-field-error-label-text-color:var(--_text-field-error-label-text-color);--md-outlined-field-error-leading-content-color:var(--_text-field-error-leading-icon-color);--md-outlined-field-error-outline-color:var(--_text-field-error-outline-color);--md-outlined-field-error-supporting-text-color:var(--_text-field-error-supporting-text-color);--md-outlined-field-error-trailing-content-color:var(--_text-field-error-trailing-icon-color);--md-outlined-field-focus-content-color:var(--_text-field-focus-input-text-color);--md-outlined-field-focus-label-text-color:var(--_text-field-focus-label-text-color);--md-outlined-field-focus-leading-content-color:var(--_text-field-focus-leading-icon-color);--md-outlined-field-focus-outline-color:var(--_text-field-focus-outline-color);--md-outlined-field-focus-outline-width:var(--_text-field-focus-outline-width);--md-outlined-field-focus-supporting-text-color:var(--_text-field-focus-supporting-text-color);--md-outlined-field-focus-trailing-content-color:var(--_text-field-focus-trailing-icon-color);--md-outlined-field-hover-content-color:var(--_text-field-hover-input-text-color);--md-outlined-field-hover-label-text-color:var(--_text-field-hover-label-text-color);--md-outlined-field-hover-leading-content-color:var(--_text-field-hover-leading-icon-color);--md-outlined-field-hover-outline-color:var(--_text-field-hover-outline-color);--md-outlined-field-hover-outline-width:var(--_text-field-hover-outline-width);--md-outlined-field-hover-supporting-text-color:var(--_text-field-hover-supporting-text-color);--md-outlined-field-hover-trailing-content-color:var(--_text-field-hover-trailing-icon-color);--md-outlined-field-label-text-color:var(--_text-field-label-text-color);--md-outlined-field-label-text-populated-line-height:var(--_text-field-label-text-populated-line-height);--md-outlined-field-label-text-populated-size:var(--_text-field-label-text-populated-size);--md-outlined-field-label-text-type:var(--_text-field-label-text-type);--md-outlined-field-leading-content-color:var(--_text-field-leading-icon-color);--md-outlined-field-outline-color:var(--_text-field-outline-color);--md-outlined-field-outline-width:var(--_text-field-outline-width);--md-outlined-field-supporting-text-color:var(--_text-field-supporting-text-color);--md-outlined-field-supporting-text-type:var(--_text-field-supporting-text-type);--md-outlined-field-trailing-content-color:var(--_text-field-trailing-icon-color)}[hasstart] .icon.leading{font-size:var(--_text-field-leading-icon-size);height:var(--_text-field-leading-icon-size);width:var(--_text-field-leading-icon-size)}[hasend] .icon.trailing{font-size:var(--_text-field-trailing-icon-size);height:var(--_text-field-trailing-icon-size);width:var(--_text-field-trailing-icon-size)}/*# sourceMappingURL=outlined-select-styles.css.map */\n`;\n "]}

package/select/lib/outlined-select-styles.scss

@@ -0,0 +1,10 @@
+//
+// Copyright 2023 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+
+// go/keep-sorted start
+@use './outlined-select';
+// go/keep-sorted end
+
+@include outlined-select.styles();

package/select/lib/outlined-select.d.ts

@@ -0,0 +1,10 @@
+/**
+ * @license
+ * Copyright 2023 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import '../../field/outlined-field.js';
+import { Select } from './select.js';
+export declare abstract class OutlinedSelect extends Select {
+    protected readonly fieldTag: import("lit-html/static.js").StaticValue;
+}

package/select/lib/outlined-select.js

@@ -0,0 +1,16 @@
+/**
+ * @license
+ * Copyright 2023 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import '../../field/outlined-field.js';
+import { literal } from 'lit/static-html.js';
+import { Select } from './select.js';
+// tslint:disable-next-line:enforce-comments-on-exported-symbols
+export class OutlinedSelect extends Select {
+    constructor() {
+        super(...arguments);
+        this.fieldTag = literal `md-outlined-field`;
+    }
+}
+//# sourceMappingURL=outlined-select.js.map

package/select/lib/outlined-select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"outlined-select.js","sourceRoot":"","sources":["outlined-select.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,+BAA+B,CAAC;AAEvC,OAAO,EAAC,OAAO,EAAC,MAAM,oBAAoB,CAAC;AAE3C,OAAO,EAAC,MAAM,EAAC,MAAM,aAAa,CAAC;AAEnC,gEAAgE;AAChE,MAAM,OAAgB,cAAe,SAAQ,MAAM;IAAnD;;QACqB,aAAQ,GAAG,OAAO,CAAA,mBAAmB,CAAC;IAC3D,CAAC;CAAA","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport '../../field/outlined-field.js';\n\nimport {literal} from 'lit/static-html.js';\n\nimport {Select} from './select.js';\n\n// tslint:disable-next-line:enforce-comments-on-exported-symbols\nexport abstract class OutlinedSelect extends Select {\n  protected readonly fieldTag = literal`md-outlined-field`;\n}\n"]}

package/select/lib/select.d.ts

@@ -0,0 +1,218 @@
+/**
+ * @license
+ * Copyright 2023 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import '../../menu/menu.js';
+import { LitElement, nothing, PropertyValues, TemplateResult } from 'lit';
+import { ClassInfo } from 'lit/directives/class-map.js';
+import { StaticValue } from 'lit/static-html.js';
+import { Field } from '../../field/lib/field.js';
+import { Menu } from '../../menu/lib/menu.js';
+import { DefaultCloseMenuEvent } from '../../menu/lib/shared.js';
+import { RequestDeselectionEvent, RequestSelectionEvent, SelectOption, SelectOptionRecord } from './shared.js';
+/**
+ * @fires input Fired when a selection is made by the user via mouse or keyboard
+ * interaction.
+ * @fires change Fired when a selection is made by the user via mouse or
+ * keyboard interaction.
+ */
+export declare abstract class Select extends LitElement {
+    /**
+     * Opens the menu synchronously with no animation.
+     */
+    quick: boolean;
+    /**
+     * Whether or not the select is required.
+     */
+    required: boolean;
+    /**
+     * Disables the select.
+     */
+    disabled: boolean;
+    /**
+     * The error message that replaces supporting text when `error` is true. If
+     * `errorText` is an empty string, then the supporting text will continue to
+     * show.
+     *
+     * Calling `reportValidity()` will automatically update `errorText` to the
+     * native `validationMessage`.
+     */
+    errorText: string;
+    /**
+     * The floating label for the field.
+     */
+    label: string;
+    /**
+     * Conveys additional information below the text field, such as how it should
+     * be used.
+     */
+    supportingText: string;
+    /**
+     * Gets or sets whether or not the text field is in a visually invalid state.
+     *
+     * Calling `reportValidity()` will automatically update `error`.
+     */
+    error: boolean;
+    /**
+     * Whether or not the underlying md-menu should be position: fixed to display
+     * in a top-level manner.
+     */
+    menuFixed: boolean;
+    /**
+     * The max time between the keystrokes of the typeahead select / menu behavior
+     * before it clears the typeahead buffer.
+     */
+    typeaheadBufferTime: number;
+    /**
+     * Whether or not the text field has a leading icon. Used for SSR.
+     */
+    hasLeadingIcon: boolean;
+    /**
+     * Whether or not the text field has a trailing icon. Used for SSR.
+     */
+    hasTrailingIcon: boolean;
+    /**
+     * Text to display in the field. Only set for SSR.
+     */
+    displayText: string;
+    /**
+     * When set to true, the error text's `role="alert"` will be removed, then
+     * re-added after an animation frame. This will re-announce an error message
+     * to screen readers.
+     */
+    protected refreshErrorAlert: boolean;
+    protected focused: boolean;
+    protected open: boolean;
+    protected field: Field;
+    protected menu: Menu;
+    protected readonly leadingIcons: Element[];
+    protected readonly trailingIcons: Element[];
+    /**
+     * The value of the currently selected option.
+     *
+     * Note: For SSR, set `[selected]` on the requested option and `displayText`
+     * rather than setting `value` setting `value` will incur a DOM query.
+     */
+    get value(): string;
+    set value(value: string);
+    get options(): SelectOption[];
+    /**
+     * The index of the currently selected option.
+     *
+     * Note: For SSR, set `[selected]` on the requested option and `displayText`
+     * rather than setting `selectedIndex` setting `selectedIndex` will incur a
+     * DOM query.
+     */
+    get selectedIndex(): number;
+    set selectedIndex(index: number);
+    /**
+     * Returns an array of selected options.
+     *
+     * NOTE: md-select only suppoprts single selection.
+     */
+    get selectedOptions(): SelectOption[];
+    protected abstract readonly fieldTag: StaticValue;
+    protected _value: string;
+    /**
+     * Used for initializing select when the user sets the `value` directly.
+     */
+    protected lastUserSetValue: string | null;
+    /**
+     * Used for initializing select when the user sets the `selectedIndex`
+     * directly.
+     */
+    protected lastUserSetSelectedIndex: number | null;
+    /**
+     * Used for `input` and `change` event change detection.
+     */
+    protected lastSelectedOption: SelectOption | null;
+    protected _lastSelectedOptionRecords: SelectOptionRecord[];
+    render(): TemplateResult;
+    protected getRenderClasses(): ClassInfo;
+    protected renderField(): TemplateResult<2 | 1>;
+    protected renderFieldContent(): (symbol | TemplateResult<1>)[];
+    protected renderLeadingIcon(): TemplateResult<1>;
+    protected renderTrailingIcon(): TemplateResult<1>;
+    protected renderLabel(): TemplateResult<1>;
+    protected renderSupportingText(): TemplateResult<1> | typeof nothing;
+    protected getSupportingText(): string;
+    protected shouldErrorAnnounce(): boolean;
+    protected renderMenu(): TemplateResult;
+    protected renderMenuContent(): TemplateResult;
+    /**
+     * Handles opening the select on keydown and typahead selection when the menu
+     * is closed.
+     */
+    protected handleKeydown(e: KeyboardEvent): void;
+    protected handleClick(): void;
+    protected handleFocus(): void;
+    protected handleBlur(): void;
+    /**
+     * Handles closing the menu when the focus leaves the select's subtree.
+     */
+    protected handleFocusout(e: FocusEvent): void;
+    /**
+     * Gets a list of all selected select options as a list item record array.
+     *
+     * @return An array of selected list option records.
+     */
+    protected getSelectedOptions(): SelectOptionRecord[];
+    getUpdateComplete(): Promise<boolean>;
+    /**
+     * Gets the selected options from the DOM, and updates the value and display
+     * text to the first selected option's value and headline respectively.
+     *
+     * @return Whether or not the selected option has changed since last update.
+     */
+    protected updateValueAndDisplayText(): boolean;
+    update(changed: PropertyValues<this>): void;
+    firstUpdated(changed: PropertyValues<this>): Promise<void>;
+    protected updated(changedProperties: PropertyValues): void;
+    /**
+     * Focuses and activates the last selected item upon opening, and resets other
+     * active items.
+     */
+    protected handleOpening(): Promise<void>;
+    protected handleClosing(): void;
+    /**
+     * Determines the reason for closing, and updates the UI accordingly.
+     */
+    protected handleCloseMenu(e: InstanceType<typeof DefaultCloseMenuEvent>): void;
+    /**
+     * Selects a given option, deselects other options, and updates the UI.
+     *
+     * @return Whether the last selected option has changed.
+     */
+    protected selectItem(item: SelectOption): boolean;
+    /**
+     * Handles updating selection when an option element requests selection via
+     * property / attribute change.
+     */
+    protected handleRequestSelection(e: RequestSelectionEvent): void;
+    /**
+     * Handles updating selection when an option element requests deselection via
+     * property / attribute change.
+     */
+    protected handleRequestDeselection(e: RequestDeselectionEvent): void;
+    /**
+     * Selects an option given the value of the option, and updates MdSelect's
+     * value.
+     */
+    select(value: string): void;
+    /**
+     * Selects an option given the index of the option, and updates MdSelect's
+     * value.
+     */
+    selectIndex(index: number): void;
+    /**
+     * Attempts to initialize the selected option from user-settable values like
+     * SSR, setting `value`, or `selectedIndex` at startup.
+     */
+    protected initUserSelection(): void;
+    protected handleIconChange(): void;
+    /**
+     * Dispatches the `input` and `change` events.
+     */
+    protected dispatchInteractionEvents(): void;
+}