@ui5/webcomponents 0.0.0-4e00e5559 → 0.0.0-4e88b8243

package/dist/ColorPickerTemplate.d.ts

@@ -0,0 +1,2 @@
+import type ColorPicker from "./ColorPicker.js";
+export default function ColorPickerTemplate(this: ColorPicker): import("@ui5/webcomponents-base/jsx-runtime").JSX.Element;

package/dist/ColorPickerTemplate.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@ui5/webcomponents-base/jsx-runtime";
+import Label from "./Label.js";
+import Slider from "./Slider.js";
+import Input from "./Input.js";
+export default function ColorPickerTemplate() {
+    return (_jsxs("section", { class: "ui5-color-picker-root", children: [_jsx("div", { class: "ui5-color-picker-main-color", style: { "background-color": `rgb(${this._mainValue.r}, ${this._mainValue.g}, ${this._mainValue.b})` }, onMouseDown: this._handleMouseDown, onMouseUp: this._handleMouseUp, onMouseMove: this._handleMouseMove, onMouseOut: this._handleMouseOut, children: _jsx("div", { class: "ui5-color-picker-circle", style: {
+                        left: `${this._selectedCoordinates.x}px`,
+                        top: `${this._selectedCoordinates.y}px`,
+                    } }) }), _jsxs("div", { class: "ui5-color-picker-sliders-wrapper", children: [_jsx(Slider, { disabled: this.inputsDisabled, class: "ui5-color-picker-hue-slider", min: 0, max: 360, step: 1, value: this._hue, accessibleName: this.hueSliderLabel, showTooltip: true, onInput: this._handleHueInput }), this._isDefaultPickerMode &&
+                        _jsx(Slider, { disabled: this.inputsDisabled, class: "ui5-color-picker-alpha-slider", min: 0, max: 1, step: 0.01, value: this._alpha, accessibleName: this.alphaSliderLabel, showTooltip: true, onInput: this._handleAlphaInputFromSlider })] }), _jsxs("div", { class: "ui5-color-picker-current-color", children: [_jsxs("div", { class: "ui5-color-picker-colors-wrapper", children: [_jsx("span", { class: "ui5-color-picker-white" }), _jsx("span", { class: "ui5-color-picker-color", children: _jsx("div", { class: "ui5-color-picker-color-inner", style: { "background-color": `rgba(${this._value.r}, ${this._value.g}, ${this._value.b}, ${this._alpha})` } }) })] }), _jsxs("div", { class: "ui5-color-picker-hex-input-wrapper", children: [_jsx(Label, { children: "Hex" }), _jsx(Input, { class: "ui5-color-picker-hex-input", value: this.hex, onKeyDown: this._onkeydown, accessibleName: this.hexInputLabel, onChange: this._handleHEXChange, valueState: this.hexInputErrorState })] })] }), this._isDefaultPickerMode &&
+                _jsxs("div", { class: "ui5-color-picker-rgb-wrapper", "onui5-change": this._handleRGBInputsChange, children: [_jsxs("div", { class: "ui5-color-picker-rgb", children: [_jsx(Input, { id: "red", class: "ui5-color-picker-rgb-input", disabled: this.inputsDisabled, accessibleName: this.redInputLabel, value: String(this._value.r) }), _jsx(Label, { children: "R" })] }), _jsxs("div", { class: "ui5-color-picker-rgb", children: [_jsx(Input, { id: "green", class: "ui5-color-picker-rgb-input", disabled: this.inputsDisabled, accessibleName: this.greenInputLabel, value: String(this._value.g) }), _jsx(Label, { children: "G" })] }), _jsxs("div", { class: "ui5-color-picker-rgb", children: [_jsx(Input, { id: "blue", class: "ui5-color-picker-rgb-input", disabled: this.inputsDisabled, accessibleName: this.blueInputLabel, value: String(this._value.b) }), _jsx(Label, { children: "B" })] }), _jsxs("div", { class: "ui5-color-picker-rgb", children: [_jsx(Input, { id: "alpha", disabled: this.inputsDisabled, class: "ui5-color-picker-rgb-input", value: String(this._alpha), accessibleName: this.alphaInputLabel, onChange: this._handleAlphaChange }), _jsx(Label, { children: "A" })] })] })] }));
+}
+//# sourceMappingURL=ColorPickerTemplate.js.map

package/dist/ColorPickerTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorPickerTemplate.js","sourceRoot":"","sources":["../src/ColorPickerTemplate.tsx"],"names":[],"mappings":"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","sourcesContent":["import type ColorPicker from \"./ColorPicker.js\";\nimport Label from \"./Label.js\";\nimport Slider from \"./Slider.js\";\nimport Input from \"./Input.js\";\n\nexport default function ColorPickerTemplate(this: ColorPicker) {\n\treturn (\n\t\t<section class=\"ui5-color-picker-root\">\n\t\t\t<div\n\t\t\t\tclass=\"ui5-color-picker-main-color\"\n\t\t\t\tstyle={{ \"background-color\": `rgb(${this._mainValue.r}, ${this._mainValue.g}, ${this._mainValue.b})` }}\n\t\t\t\tonMouseDown={this._handleMouseDown}\n\t\t\t\tonMouseUp={this._handleMouseUp}\n\t\t\t\tonMouseMove={this._handleMouseMove}\n\t\t\t\tonMouseOut={this._handleMouseOut}\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclass=\"ui5-color-picker-circle\"\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tleft: `${this._selectedCoordinates.x}px`,\n\t\t\t\t\t\ttop: `${this._selectedCoordinates.y}px`,\n\t\t\t\t\t}}\n\t\t\t\t></div>\n\t\t\t</div>\n\n\t\t\t<div class=\"ui5-color-picker-sliders-wrapper\">\n\t\t\t\t<Slider\n\t\t\t\t\tdisabled={this.inputsDisabled}\n\t\t\t\t\tclass=\"ui5-color-picker-hue-slider\"\n\t\t\t\t\tmin={0}\n\t\t\t\t\tmax={360}\n\t\t\t\t\tstep={1}\n\t\t\t\t\tvalue={this._hue}\n\t\t\t\t\taccessibleName={this.hueSliderLabel}\n\t\t\t\t\tshowTooltip={true}\n\t\t\t\t\tonInput={this._handleHueInput}\n\t\t\t\t/>\n\n\t\t\t\t{this._isDefaultPickerMode &&\n\t\t\t\t\t<Slider\n\t\t\t\t\t\tdisabled={this.inputsDisabled}\n\t\t\t\t\t\tclass=\"ui5-color-picker-alpha-slider\"\n\t\t\t\t\t\tmin={0}\n\t\t\t\t\t\tmax={1}\n\t\t\t\t\t\tstep={0.01}\n\t\t\t\t\t\tvalue={this._alpha}\n\t\t\t\t\t\taccessibleName={this.alphaSliderLabel}\n\t\t\t\t\t\tshowTooltip={true}\n\t\t\t\t\t\tonInput={this._handleAlphaInputFromSlider}\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t</div>\n\n\t\t\t<div class=\"ui5-color-picker-current-color\">\n\t\t\t\t<div class=\"ui5-color-picker-colors-wrapper\">\n\t\t\t\t\t<span class=\"ui5-color-picker-white\"></span>\n\t\t\t\t\t<span class=\"ui5-color-picker-color\">\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclass=\"ui5-color-picker-color-inner\"\n\t\t\t\t\t\t\tstyle={{ \"background-color\": `rgba(${this._value.r}, ${this._value.g}, ${this._value.b}, ${this._alpha})` }}\n\t\t\t\t\t\t></div>\n\t\t\t\t\t</span>\n\t\t\t\t</div>\n\n\t\t\t\t<div class=\"ui5-color-picker-hex-input-wrapper\">\n\t\t\t\t\t<Label>Hex</Label>\n\t\t\t\t\t<Input\n\t\t\t\t\t\tclass=\"ui5-color-picker-hex-input\"\n\t\t\t\t\t\tvalue={this.hex}\n\t\t\t\t\t\tonKeyDown={this._onkeydown}\n\t\t\t\t\t\taccessibleName={this.hexInputLabel}\n\t\t\t\t\t\tonChange={this._handleHEXChange}\n\t\t\t\t\t\tvalueState={this.hexInputErrorState}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t{this._isDefaultPickerMode &&\n\t\t\t\t<div\n\t\t\t\t\tclass=\"ui5-color-picker-rgb-wrapper\"\n\t\t\t\t\tonui5-change={this._handleRGBInputsChange}\n\t\t\t\t>\n\t\t\t\t\t<div class=\"ui5-color-picker-rgb\">\n\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\tid=\"red\"\n\t\t\t\t\t\t\tclass=\"ui5-color-picker-rgb-input\"\n\t\t\t\t\t\t\tdisabled={this.inputsDisabled}\n\t\t\t\t\t\t\taccessibleName={this.redInputLabel}\n\t\t\t\t\t\t\tvalue={String(this._value.r)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Label>R</Label>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class=\"ui5-color-picker-rgb\">\n\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\tid=\"green\"\n\t\t\t\t\t\t\tclass=\"ui5-color-picker-rgb-input\"\n\t\t\t\t\t\t\tdisabled={this.inputsDisabled}\n\t\t\t\t\t\t\taccessibleName={this.greenInputLabel}\n\t\t\t\t\t\t\tvalue={String(this._value.g)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Label>G</Label>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class=\"ui5-color-picker-rgb\">\n\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\tid=\"blue\"\n\t\t\t\t\t\t\tclass=\"ui5-color-picker-rgb-input\"\n\t\t\t\t\t\t\tdisabled={this.inputsDisabled}\n\t\t\t\t\t\t\taccessibleName={this.blueInputLabel}\n\t\t\t\t\t\t\tvalue={String(this._value.b)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Label>B</Label>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class=\"ui5-color-picker-rgb\">\n\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\tid=\"alpha\"\n\t\t\t\t\t\t\tdisabled={this.inputsDisabled}\n\t\t\t\t\t\t\tclass=\"ui5-color-picker-rgb-input\"\n\t\t\t\t\t\t\tvalue={String(this._alpha)}\n\t\t\t\t\t\t\taccessibleName={this.alphaInputLabel}\n\t\t\t\t\t\t\tonChange={this._handleAlphaChange}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Label>A</Label>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t}\n\t\t</section>\n\t);\n}\n"]}

package/dist/ComboBox.d.ts

@@ -0,0 +1,362 @@
+import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+import ValueState from "@ui5/webcomponents-base/dist/types/ValueState.js";
+import "@ui5/webcomponents-icons/dist/slim-arrow-down.js";
+import "@ui5/webcomponents-icons/dist/decline.js";
+import "@ui5/webcomponents-icons/dist/not-editable.js";
+import "@ui5/webcomponents-icons/dist/error.js";
+import "@ui5/webcomponents-icons/dist/alert.js";
+import "@ui5/webcomponents-icons/dist/sys-enter-2.js";
+import "@ui5/webcomponents-icons/dist/information.js";
+import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
+import type { IFormInputElement } from "@ui5/webcomponents-base/dist/features/InputElementsFormSupport.js";
+import type { IIcon } from "./Icon.js";
+import "./ComboBoxItem.js";
+import type ComboBoxItem from "./ComboBoxItem.js";
+import type Popover from "./Popover.js";
+import type ResponsivePopover from "./ResponsivePopover.js";
+import type List from "./List.js";
+import type { ListItemClickEventDetail } from "./List.js";
+import "./ComboBoxItemGroup.js";
+import type ComboBoxFilter from "./types/ComboBoxFilter.js";
+import PopoverHorizontalAlign from "./types/PopoverHorizontalAlign.js";
+import type { InputEventDetail } from "./Input.js";
+/**
+ * Interface for components that may be slotted inside a `ui5-combobox`
+ * @public
+ */
+interface IComboBoxItem extends UI5Element {
+    text?: string;
+    headerText?: string;
+    focused: boolean;
+    isGroupItem?: boolean;
+    selected?: boolean;
+    additionalText?: string;
+    _isVisible?: boolean;
+    items?: Array<IComboBoxItem>;
+}
+type ValueStateAnnouncement = Record<Exclude<ValueState, ValueState.None>, string>;
+type ValueStateTypeAnnouncement = Record<Exclude<ValueState, ValueState.None>, string>;
+type ComboBoxSelectionChangeEventDetail = {
+    item: ComboBoxItem;
+};
+/**
+ * @class
+ *
+ * ### Overview
+ *
+ * The `ui5-combobox` component represents a drop-down menu with a list of the available options and a text input field to narrow down the options.
+ *
+ * It is commonly used to enable users to select an option from a predefined list.
+ *
+ * ### Structure
+ * The `ui5-combobox` consists of the following elements:
+ *
+ * -  Input field - displays the selected option or a custom user entry. Users can type to narrow down the list or enter their own value.
+ * -  Drop-down arrow - expands\collapses the option list.
+ * -  Option list - the list of available options.
+ *
+ * ### Keyboard Handling
+ *
+ * The `ui5-combobox` provides advanced keyboard handling.
+ *
+ * - [F4], [Alt]+[Up], or [Alt]+[Down] - Toggles the picker.
+ * - [Escape] - Closes the picker, if open. If closed, cancels changes and reverts the typed in value.
+ * - [Enter] or [Return] - If picker is open, takes over the currently selected item and closes it.
+ * - [Down] - Selects the next matching item in the picker.
+ * - [Up] - Selects the previous matching item in the picker.
+ * - [Page Down] - Moves selection down by page size (10 items by default).
+ * - [Page Up] - Moves selection up by page size (10 items by default).
+ * - [Home] - If focus is in the ComboBox, moves cursor at the beginning of text. If focus is in the picker, selects the first item.
+ * - [End] - If focus is in the ComboBox, moves cursor at the end of text. If focus is in the picker, selects the last item.
+ *
+ * ### ES6 Module Import
+ *
+ * `import "@ui5/webcomponents/dist/ComboBox.js";`
+ * @constructor
+ * @extends UI5Element
+ * @public
+ * @since 1.0.0-rc.6
+ */
+declare class ComboBox extends UI5Element implements IFormInputElement {
+    eventDetails: {
+        "change": void;
+        "input": void;
+        "selection-change": ComboBoxSelectionChangeEventDetail;
+    };
+    /**
+     * Defines the value of the component.
+     * @default ""
+     * @formEvents change input
+     * @formProperty
+     * @public
+     */
+    value: string;
+    /**
+     * Determines the name by which the component will be identified upon submission in an HTML form.
+     *
+     * **Note:** This property is only applicable within the context of an HTML Form element.
+     * @default undefined
+     * @public
+     * @since 2.0.0
+     */
+    name?: string;
+    /**
+     * Defines whether the value will be autocompleted to match an item
+     * @default false
+     * @public
+     * @since 1.19.0
+     */
+    noTypeahead: boolean;
+    /**
+     * Defines the "live" value of the component.
+     *
+     * **Note:** If we have an item e.g. "Bulgaria", "B" is typed, "ulgaria" is typed ahead, value will be "Bulgaria", filterValue will be "B".
+     *
+     * **Note:** Initially the filter value is synced with value.
+     * @default ""
+     * @private
+     */
+    filterValue: string;
+    /**
+     * Defines a short hint intended to aid the user with data entry when the
+     * component has no value.
+     * @default undefined
+     * @public
+     */
+    placeholder?: string;
+    /**
+     * Defines whether the component is in disabled state.
+     *
+     * **Note:** A disabled component is completely noninteractive.
+     * @default false
+     * @public
+     */
+    disabled: boolean;
+    /**
+     * Defines the value state of the component.
+     * @default "None"
+     * @public
+     */
+    valueState: `${ValueState}`;
+    /**
+     * Defines whether the component is read-only.
+     *
+     * **Note:** A read-only component is not editable,
+     * but still provides visual feedback upon user interaction.
+     * @default false
+     * @public
+     */
+    readonly: boolean;
+    /**
+     * Defines whether the component is required.
+     * @default false
+     * @public
+     */
+    required: boolean;
+    /**
+     * Indicates whether a loading indicator should be shown in the picker.
+     * @default false
+     * @public
+     */
+    loading: boolean;
+    /**
+     * Defines the filter type of the component.
+     * @default "StartsWithPerTerm"
+     * @public
+     */
+    filter: `${ComboBoxFilter}`;
+    /**
+     * Defines whether the clear icon of the combobox will be shown.
+     * @default false
+     * @public
+     * @since 1.20.1
+     */
+    showClearIcon: boolean;
+    /**
+     * Indicates whether the input is focssed
+     * @private
+     */
+    focused: boolean;
+    /**
+     * Indicates whether the visual focus is on the value state header
+     * @private
+     */
+    _isValueStateFocused: boolean;
+    /**
+     * Defines the accessible ARIA name of the component.
+     * @default undefined
+     * @public
+     * @since 1.0.0-rc.15
+     */
+    accessibleName?: string;
+    /**
+     * Receives id(or many ids) of the elements that label the component
+     * @default undefined
+     * @public
+     * @since 1.0.0-rc.15
+     */
+    accessibleNameRef?: string;
+    _iconPressed: boolean;
+    _filteredItems: Array<IComboBoxItem>;
+    _listWidth?: number;
+    _effectiveShowClearIcon: boolean;
+    /**
+     * Indicates whether the value state message popover is open.
+     * @private
+     * @since 2.0.0
+     */
+    valueStateOpen: boolean;
+    /**
+     * Indicates whether the items picker is open.
+     * @private
+     * @since 2.0.0
+     */
+    open: boolean;
+    /**
+     * Defines the component items.
+     * @public
+     */
+    items: Array<IComboBoxItem>;
+    /**
+     * Defines the value state message that will be displayed as pop up under the component.
+     * The value state message slot should contain only one root element.
+     *
+     * **Note:** If not specified, a default text (in the respective language) will be displayed.
+     *
+     * **Note:** The `valueStateMessage` would be displayed,
+     * when the `ui5-combobox` is in `Information`, `Critical` or `Negative` value state.
+     * @since 1.0.0-rc.9
+     * @public
+     */
+    valueStateMessage: Array<HTMLElement>;
+    /**
+     * Defines the icon to be displayed in the input field.
+     * @public
+     * @since 1.0.0-rc.9
+     */
+    icon: Array<IIcon>;
+    _initialRendering: boolean;
+    _itemFocused: boolean;
+    _autocomplete: boolean;
+    _isKeyNavigation: boolean;
+    _selectionPerformed: boolean;
+    _lastValue: string;
+    _selectedItemText: string;
+    _userTypedValue: string;
+    static i18nBundle: I18nBundle;
+    get formValidityMessage(): string;
+    get formValidity(): ValidityStateFlags;
+    formElementAnchor(): Promise<HTMLElement | undefined>;
+    get formFormattedValue(): string;
+    constructor();
+    onBeforeRendering(): void;
+    get iconsCount(): number;
+    onAfterRendering(): void;
+    _focusin(e: FocusEvent): void;
+    _focusout(e: FocusEvent): void;
+    _beforeOpenPopover(): void;
+    _afterOpenPopover(): void;
+    _afterClosePopover(): void;
+    _toggleRespPopover(): void;
+    storeResponsivePopoverWidth(): void;
+    _handleValueStatePopoverFocusout(): void;
+    _handleValueStatePopoverAfterClose(): void;
+    _getValueStatePopover(): Popover;
+    _getItemsList(): List;
+    _resetFilter(): void;
+    _resetItemVisibility(): void;
+    _arrowClick(): void;
+    _handleMobileKeydown(e: KeyboardEvent): void;
+    _handleMobileInput(e: CustomEvent<InputEventDetail>): void;
+    _input(e: InputEvent): void;
+    shouldAutocomplete(e: InputEvent): boolean;
+    _startsWithMatchingItems(str: string): Array<IComboBoxItem>;
+    _clearFocus(): void;
+    _getItems(): IComboBoxItem[];
+    handleNavKeyPress(e: KeyboardEvent): void;
+    _handleItemNavigation(e: KeyboardEvent, indexOfItem: number, isForward: boolean): void;
+    _handleTypeAhead(value: string, filterValue: string, checkForGroupItem: boolean): void;
+    _handleArrowDown(e: KeyboardEvent, indexOfItem: number): void;
+    _handleArrowUp(e: KeyboardEvent, indexOfItem: number): void;
+    _handlePageUp(e: KeyboardEvent, indexOfItem: number): void;
+    _handlePageDown(e: KeyboardEvent, indexOfItem: number): void;
+    _handleHome(e: KeyboardEvent): void;
+    _handleEnd(e: KeyboardEvent): void;
+    _keyup(): void;
+    _keydown(e: KeyboardEvent): void;
+    _handlePopoverKeydown(e: KeyboardEvent): void;
+    _handlePopoverFocusout(): void;
+    _click(): void;
+    _closeRespPopover(e?: Event | null): void;
+    _openRespPopover(): void;
+    _filterItems(str: string): IComboBoxItem[];
+    _getFirstMatchingItem(current: string): IComboBoxItem | void;
+    _applyAtomicValueAndSelection(item: IComboBoxItem, filterValue: string): void;
+    _selectMatchingItem(): void;
+    _fireChangeEvent(): void;
+    _inputChange(e: Event): void;
+    _itemMousedown(e: MouseEvent): void;
+    _selectItem(e: CustomEvent<ListItemClickEventDetail>): void;
+    _onItemFocus(): void;
+    _announceSelectedItem(indexOfItem: number): void;
+    _clear(): void;
+    _makeAllVisible(item: IComboBoxItem): void;
+    _scrollToItem(indexOfItem: number): void;
+    _announceValueStateText(): void;
+    get _headerTitleText(): string;
+    get _iconAccessibleNameText(): string;
+    get _popupLabel(): string;
+    get inner(): HTMLInputElement;
+    _getPicker(): ResponsivePopover;
+    _getPickerInput(): HTMLInputElement;
+    get openOnMobile(): boolean;
+    get hasValueState(): boolean;
+    get hasValueStateText(): boolean;
+    get ariaValueStateHiddenText(): string;
+    get valueStateDefaultText(): string | undefined;
+    get valueStateTextMappings(): ValueStateAnnouncement;
+    get valueStateTypeMappings(): ValueStateTypeAnnouncement;
+    get shouldOpenValueStateMessagePopover(): boolean;
+    get shouldDisplayDefaultValueStateMessage(): boolean;
+    get _valueStatePopoverHorizontalAlign(): `${PopoverHorizontalAlign}`;
+    /**
+     * This method is relevant for sap_horizon theme only
+     */
+    get _valueStateMessageIcon(): string;
+    get _isPhone(): boolean;
+    get itemTabIndex(): undefined;
+    get ariaLabelText(): string | undefined;
+    get clearIconAccessibleName(): string;
+    get responsivePopoverId(): string;
+    get styles(): {
+        popoverHeader: {
+            width: string;
+        };
+        suggestionPopoverHeader: {
+            display: string;
+            width: string;
+        };
+        suggestionsPopover: {
+            "min-width": string;
+            "max-width": string;
+        };
+        popoverValueStateMessage: {};
+    };
+    get classes(): {
+        popover: {
+            "ui5-suggestions-popover": boolean;
+            "ui5-popover-with-value-state-header-phone": boolean;
+            "ui5-popover-with-value-state-header": boolean;
+        };
+        popoverValueState: {
+            "ui5-valuestatemessage-header": boolean;
+            "ui5-valuestatemessage-root": boolean;
+            "ui5-valuestatemessage--success": boolean;
+            "ui5-valuestatemessage--error": boolean;
+            "ui5-valuestatemessage--warning": boolean;
+            "ui5-valuestatemessage--information": boolean;
+        };
+    };
+}
+export default ComboBox;
+export type { ComboBoxSelectionChangeEventDetail, IComboBoxItem, };