@ui5/webcomponents 0.0.0-037d08c67

package/dist/MenuItemGroup.js

@@ -0,0 +1,143 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var MenuItemGroup_1;
+import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
+import property from "@ui5/webcomponents-base/dist/decorators/property.js";
+import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js";
+import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js";
+import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js";
+import { isInstanceOfMenuItem } from "./MenuItem.js";
+import MenuItemGroupTemplate from "./MenuItemGroupTemplate.js";
+import MenuItemGroupCheckMode from "./types/MenuItemGroupCheckMode.js";
+import { MENU_ITEM_GROUP_NONE_ACCESSIBLE_NAME, MENU_ITEM_GROUP_SINGLE_ACCESSIBLE_NAME, MENU_ITEM_GROUP_MULTI_ACCESSIBLE_NAME, } from "./generated/i18n/i18n-defaults.js";
+import createInstanceChecker from "@ui5/webcomponents-base/dist/util/createInstanceChecker.js";
+/**
+ * @class
+ *
+ * ### Overview
+ *
+ * The `ui5-menu-item-group` component represents a group of items designed for use inside a `ui5-menu`.
+ * Items belonging to the same group should be wrapped by a `ui5-menu-item-group`.
+ * Each group can have an `checkMode` property, which defines the check mode for the items within the group.
+ * The possible values for `checkMode` are:
+ * - 'None' (default) - no items can be checked
+ * - 'Single' - Only one item can be checked at a time
+ * - 'Multiple' - Multiple items can be checked simultaneously
+ *
+ * **Note:** If the `checkMode` property is set to 'Single', only one item can remain checked at any given time.
+ * If multiple items are marked as checked, the last checked item will take precedence.
+ *
+ * ### Usage
+ *
+ * `ui5-menu-item-group` represents a collection of `ui5-menu-item` components that can have the same check mode.
+ * The items are addeed to the group's `items` slot.
+ *
+ * ### ES6 Module Import
+ *
+ * `import "@ui5/webcomponents/dist/MenuItemGroup.js";`
+ * @constructor
+ * @extends UI5Element
+ * @implements {IMenuItem}
+ * @since 2.12.0
+ * @public
+ */
+let MenuItemGroup = MenuItemGroup_1 = class MenuItemGroup extends UI5Element {
+    constructor() {
+        super(...arguments);
+        /**
+         * Defines the component's check mode.
+         * @default "None"
+         * @public
+         */
+        this.checkMode = "None";
+    }
+    get ariaLabelText() {
+        switch (this.checkMode) {
+            case MenuItemGroupCheckMode.None:
+                return MenuItemGroup_1.i18nBundle.getText(MENU_ITEM_GROUP_NONE_ACCESSIBLE_NAME);
+            case MenuItemGroupCheckMode.Single:
+                return MenuItemGroup_1.i18nBundle.getText(MENU_ITEM_GROUP_SINGLE_ACCESSIBLE_NAME);
+            case MenuItemGroupCheckMode.Multiple:
+                return MenuItemGroup_1.i18nBundle.getText(MENU_ITEM_GROUP_MULTI_ACCESSIBLE_NAME);
+            default:
+                return undefined;
+        }
+    }
+    get isGroup() {
+        return true;
+    }
+    get _menuItems() {
+        return this.items.filter(isInstanceOfMenuItem);
+    }
+    onBeforeRendering() {
+        this._updateItemsCheckMode();
+        if (this.checkMode === MenuItemGroupCheckMode.Single) {
+            this._ensureSingleItemIsChecked();
+        }
+    }
+    /**
+     * Sets <code>_checkMode</code> property of all menu items in the group.
+     * @private
+     */
+    _updateItemsCheckMode() {
+        this._menuItems.forEach((item) => {
+            item._checkMode = this.checkMode;
+        });
+    }
+    /**
+     * Sets <code>checked</code> property of all items in the group to <code>false</code>.
+     * @private
+     */
+    _clearCheckedItems() {
+        this._menuItems.forEach((item) => { item.checked = false; });
+    }
+    /**
+     * Ensures that only one item can remain checked at any given time. If multiple items are marked as checked,
+     * the last checked item will take precedence.
+     * @private
+     */
+    _ensureSingleItemIsChecked() {
+        const lastCheckedItem = this._menuItems.findLast((item) => item.checked);
+        this._clearCheckedItems();
+        if (lastCheckedItem) {
+            lastCheckedItem.checked = true;
+        }
+    }
+    /**
+     * Handles the checking of an item in the group and unchecks other items if the item check mode is Single.
+     * @private
+     */
+    _handleItemCheck(e) {
+        const clickedItem = e.target;
+        const isChecked = clickedItem.checked;
+        if (this.checkMode === MenuItemGroupCheckMode.Single) {
+            this._clearCheckedItems();
+            clickedItem.checked = isChecked;
+        }
+    }
+};
+__decorate([
+    property()
+], MenuItemGroup.prototype, "checkMode", void 0);
+__decorate([
+    slot({ "default": true, type: HTMLElement, invalidateOnChildChange: true })
+], MenuItemGroup.prototype, "items", void 0);
+__decorate([
+    i18n("@ui5/webcomponents")
+], MenuItemGroup, "i18nBundle", void 0);
+MenuItemGroup = MenuItemGroup_1 = __decorate([
+    customElement({
+        tag: "ui5-menu-item-group",
+        renderer: jsxRenderer,
+        template: MenuItemGroupTemplate,
+    })
+], MenuItemGroup);
+MenuItemGroup.define();
+export default MenuItemGroup;
+export const isInstanceOfMenuItemGroup = createInstanceChecker("isGroup");
+//# sourceMappingURL=MenuItemGroup.js.map

package/dist/MenuItemGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItemGroup.js","sourceRoot":"","sources":["../src/MenuItemGroup.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport type { DefaultSlot } from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot-strict.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type MenuItem from \"./MenuItem.js\";\nimport { isInstanceOfMenuItem } from \"./MenuItem.js\";\nimport MenuItemGroupTemplate from \"./MenuItemGroupTemplate.js\";\nimport MenuItemGroupCheckMode from \"./types/MenuItemGroupCheckMode.js\";\nimport type { IMenuItem } from \"./Menu.js\";\nimport {\n\tMENU_ITEM_GROUP_NONE_ACCESSIBLE_NAME,\n\tMENU_ITEM_GROUP_SINGLE_ACCESSIBLE_NAME,\n\tMENU_ITEM_GROUP_MULTI_ACCESSIBLE_NAME,\n} from \"./generated/i18n/i18n-defaults.js\";\nimport createInstanceChecker from \"@ui5/webcomponents-base/dist/util/createInstanceChecker.js\";\n\n/**\n * @class\n *\n * ### Overview\n *\n * The `ui5-menu-item-group` component represents a group of items designed for use inside a `ui5-menu`.\n * Items belonging to the same group should be wrapped by a `ui5-menu-item-group`.\n * Each group can have an `checkMode` property, which defines the check mode for the items within the group.\n * The possible values for `checkMode` are:\n * - 'None' (default) - no items can be checked\n * - 'Single' - Only one item can be checked at a time\n * - 'Multiple' - Multiple items can be checked simultaneously\n *\n * **Note:** If the `checkMode` property is set to 'Single', only one item can remain checked at any given time.\n * If multiple items are marked as checked, the last checked item will take precedence.\n *\n * ### Usage\n *\n * `ui5-menu-item-group` represents a collection of `ui5-menu-item` components that can have the same check mode.\n * The items are addeed to the group's `items` slot.\n *\n * ### ES6 Module Import\n *\n * `import \"@ui5/webcomponents/dist/MenuItemGroup.js\";`\n * @constructor\n * @extends UI5Element\n * @implements {IMenuItem}\n * @since 2.12.0\n * @public\n */\n@customElement({\n\ttag: \"ui5-menu-item-group\",\n\trenderer: jsxRenderer,\n\ttemplate: MenuItemGroupTemplate,\n})\n\nclass MenuItemGroup extends UI5Element implements IMenuItem {\n\t/**\n\t * Defines the component's check mode.\n\t * @default \"None\"\n\t * @public\n\t */\n\t@property()\n\tcheckMode: `${MenuItemGroupCheckMode}` = \"None\";\n\n\t/**\n\t * Defines the items of this component.\n\t * **Note:** The slot can hold any combination of components of type `ui5-menu-item` or `ui5-menu-separator` or both.\n\t * @public\n\t */\n\t@slot({ \"default\": true, type: HTMLElement, invalidateOnChildChange: true })\n\titems!: DefaultSlot<IMenuItem>;\n\n\t@i18n(\"@ui5/webcomponents\")\n\tstatic i18nBundle: I18nBundle;\n\n\tget ariaLabelText(): string | undefined {\n\t\tswitch (this.checkMode) {\n\t\tcase MenuItemGroupCheckMode.None:\n\t\t\treturn MenuItemGroup.i18nBundle.getText(MENU_ITEM_GROUP_NONE_ACCESSIBLE_NAME);\n\t\tcase MenuItemGroupCheckMode.Single:\n\t\t\treturn MenuItemGroup.i18nBundle.getText(MENU_ITEM_GROUP_SINGLE_ACCESSIBLE_NAME);\n\t\tcase MenuItemGroupCheckMode.Multiple:\n\t\t\treturn MenuItemGroup.i18nBundle.getText(MENU_ITEM_GROUP_MULTI_ACCESSIBLE_NAME);\n\t\tdefault:\n\t\t\treturn undefined;\n\t\t}\n\t}\n\n\tget isGroup(): boolean {\n\t\treturn true;\n\t}\n\n\tget _menuItems() {\n\t\treturn this.items.filter(isInstanceOfMenuItem);\n\t}\n\n\tonBeforeRendering() {\n\t\tthis._updateItemsCheckMode();\n\n\t\tif (this.checkMode === MenuItemGroupCheckMode.Single) {\n\t\t\tthis._ensureSingleItemIsChecked();\n\t\t}\n\t}\n\n\t/**\n\t * Sets <code>_checkMode</code> property of all menu items in the group.\n\t * @private\n\t */\n\t_updateItemsCheckMode() {\n\t\tthis._menuItems.forEach((item: MenuItem) => {\n\t\t\titem._checkMode = this.checkMode;\n\t\t});\n\t}\n\n\t/**\n\t * Sets <code>checked</code> property of all items in the group to <code>false</code>.\n\t * @private\n\t */\n\t_clearCheckedItems() {\n\t\tthis._menuItems.forEach((item: MenuItem) => { item.checked = false; });\n\t}\n\n\t/**\n\t * Ensures that only one item can remain checked at any given time. If multiple items are marked as checked,\n\t * the last checked item will take precedence.\n\t * @private\n\t */\n\t_ensureSingleItemIsChecked() {\n\t\tconst lastCheckedItem = this._menuItems.findLast((item: MenuItem) => item.checked);\n\n\t\tthis._clearCheckedItems();\n\t\tif (lastCheckedItem) {\n\t\t\tlastCheckedItem.checked = true;\n\t\t}\n\t}\n\n\t/**\n\t * Handles the checking of an item in the group and unchecks other items if the item check mode is Single.\n\t * @private\n\t */\n\t_handleItemCheck(e: CustomEvent) {\n\t\tconst clickedItem = e.target as MenuItem;\n\t\tconst isChecked = clickedItem.checked;\n\n\t\tif (this.checkMode === MenuItemGroupCheckMode.Single) {\n\t\t\tthis._clearCheckedItems();\n\t\t\tclickedItem.checked = isChecked;\n\t\t}\n\t}\n}\n\nMenuItemGroup.define();\n\nexport default MenuItemGroup;\n\nexport const isInstanceOfMenuItemGroup = createInstanceChecker<MenuItemGroup>(\"isGroup\");\n"]}

package/dist/MenuItemGroupTemplate.d.ts

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

package/dist/MenuItemGroupTemplate.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "@ui5/webcomponents-base/jsx-runtime";
+export default function MenuItemGroupTemplate() {
+    return (_jsx("div", { role: "group", "aria-label": this.ariaLabelText, "onui5-check": this._handleItemCheck, children: _jsx("slot", {}) }));
+}
+//# sourceMappingURL=MenuItemGroupTemplate.js.map

package/dist/MenuItemGroupTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItemGroupTemplate.js","sourceRoot":"","sources":["../src/MenuItemGroupTemplate.tsx"],"names":[],"mappings":";AAEA,MAAM,CAAC,OAAO,UAAU,qBAAqB;IAC5C,OAAO,CACN,cACC,IAAI,EAAC,OAAO,gBACA,IAAI,CAAC,aAAa,iBACjB,IAAI,CAAC,gBAAgB,YAElC,gBAAa,GACR,CACN,CAAC;AACH,CAAC","sourcesContent":["import type MenuItemGroup from \"./MenuItemGroup.js\";\n\nexport default function MenuItemGroupTemplate(this: MenuItemGroup) {\n\treturn (\n\t\t<div\n\t\t\trole=\"group\"\n\t\t\taria-label={this.ariaLabelText}\n\t\t\tonui5-check={this._handleItemCheck}\n\t\t>\n\t\t\t<slot></slot>\n\t\t</div>\n\t);\n}\n"]}

package/dist/MenuItemTemplate.d.ts

@@ -0,0 +1,3 @@
+import type MenuItem from "./MenuItem.js";
+import type { ListItemHooks } from "./ListItemTemplate.js";
+export default function MenuItemTemplate(this: MenuItem, hooks?: Partial<ListItemHooks>): import("@ui5/webcomponents-base/jsx-runtime").JSX.Element;

package/dist/MenuItemTemplate.js

@@ -0,0 +1,47 @@
+import { Fragment as _Fragment, jsxs as _jsxs, jsx as _jsx } from "@ui5/webcomponents-base/jsx-runtime";
+import PopoverPlacement from "./types/PopoverPlacement.js";
+import ResponsivePopover from "./ResponsivePopover.js";
+import Button from "./Button.js";
+import List from "./List.js";
+import BusyIndicator from "./BusyIndicator.js";
+import navBackIcon from "@ui5/webcomponents-icons/dist/nav-back.js";
+import checkIcon from "@ui5/webcomponents-icons/dist/accept.js";
+import slimArrowRight from "@ui5/webcomponents-icons/dist/slim-arrow-right.js";
+import Icon from "./Icon.js";
+import ListItemTemplate from "./ListItemTemplate.js";
+const predefinedHooks = {
+    listItemContent,
+    iconBegin,
+};
+export default function MenuItemTemplate(hooks) {
+    const currentHooks = { ...predefinedHooks, ...hooks };
+    return _jsxs(_Fragment, { children: [ListItemTemplate.call(this, currentHooks), listItemPostContent.call(this)] });
+}
+function listItemContent() {
+    return (_jsxs(_Fragment, { children: [this.text && _jsx("div", { class: "ui5-menu-item-text", children: this.text }), rightContent.call(this), checkmarkContent.call(this)] }));
+}
+function checkmarkContent() {
+    return !this._markChecked ? "" : (_jsx("div", { class: "ui5-menu-item-checked", children: _jsx(Icon, { name: checkIcon, class: "ui5-menu-item-icon-checked" }) }));
+}
+function rightContent() {
+    switch (true) {
+        case this.hasSubmenu:
+            return (_jsx("div", { class: "ui5-menu-item-submenu-icon", children: _jsx(Icon, { part: "subicon", name: slimArrowRight, class: "ui5-menu-item-icon-end" }) }));
+        case this.hasEndContent:
+            return _jsx("slot", { name: "endContent", onKeyDown: this._endContentKeyDown });
+        case !!this.additionalText:
+            return (_jsx("span", { part: "additional-text", class: "ui5-li-additional-text", "aria-hidden": this._accInfo.ariaHidden, children: this.additionalText }));
+    }
+}
+function iconBegin() {
+    if (this.hasIcon) {
+        return _jsx(Icon, { class: "ui5-li-icon", name: this.icon });
+    }
+    if (this._siblingsWithIcon) {
+        return _jsx("div", { class: "ui5-menu-item-dummy-icon" });
+    }
+}
+function listItemPostContent() {
+    return this.hasSubmenu && _jsxs(ResponsivePopover, { id: `${this._id}-menu-rp`, class: "ui5-menu-rp ui5-menu-rp-sub-menu", preventInitialFocus: true, preventFocusRestore: true, hideArrow: true, allowTargetOverlap: true, placement: PopoverPlacement.End, verticalAlign: "Top", accessibleName: this.accessibleNameText, onBeforeOpen: this._beforePopoverOpen, onOpen: this._afterPopoverOpen, onBeforeClose: this._beforePopoverClose, onClose: this._afterPopoverClose, children: [this.isPhone && (_jsx(_Fragment, { children: _jsxs("div", { slot: "header", class: "ui5-menu-dialog-header", children: [_jsx(Button, { icon: navBackIcon, class: "ui5-menu-back-button", design: "Transparent", "aria-label": this.labelBack, onClick: this._close }), _jsx("div", { class: "ui5-menu-dialog-title", children: _jsx("div", { children: this.text }) })] }) })), _jsx("div", { id: `${this._id}-menu-main`, class: this.loading ? "menu-busy-indicator-main" : "", children: this.items.length ? (_jsx(List, { id: `${this._id}-menu-list`, selectionMode: "None", separators: "None", accessibleRole: "Menu", loading: this.loading, loadingDelay: this.loadingDelay, onMouseOver: this._itemMouseOver, onKeyDown: this._itemKeyDown, onKeyUp: this._itemKeyUp, "onui5-close-menu": this._close, "onui5-exit-end-content": this._navigateOutOfEndContent, children: _jsx("slot", {}) })) : this.loading && _jsx(BusyIndicator, { id: `${this._id}-menu-busy-indicator`, delay: this.loadingDelay, class: "ui5-menu-busy-indicator", active: true }) }), this.isPhone && (_jsx("div", { slot: "footer", class: "ui5-menu-dialog-footer", children: _jsx(Button, { design: "Transparent", onClick: this._closeAll, children: this.labelCancel }) }))] });
+}
+//# sourceMappingURL=MenuItemTemplate.js.map

package/dist/MenuItemTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItemTemplate.js","sourceRoot":"","sources":["../src/MenuItemTemplate.tsx"],"names":[],"mappings":"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","sourcesContent":["import type MenuItem from \"./MenuItem.js\";\nimport PopoverPlacement from \"./types/PopoverPlacement.js\";\nimport ResponsivePopover from \"./ResponsivePopover.js\";\nimport Button from \"./Button.js\";\nimport List from \"./List.js\";\nimport BusyIndicator from \"./BusyIndicator.js\";\nimport navBackIcon from \"@ui5/webcomponents-icons/dist/nav-back.js\";\nimport checkIcon from \"@ui5/webcomponents-icons/dist/accept.js\";\nimport slimArrowRight from \"@ui5/webcomponents-icons/dist/slim-arrow-right.js\";\nimport Icon from \"./Icon.js\";\nimport ListItemTemplate from \"./ListItemTemplate.js\";\nimport type { ListItemHooks } from \"./ListItemTemplate.js\";\n\nconst predefinedHooks: Partial<ListItemHooks> = {\n\tlistItemContent,\n\ticonBegin,\n};\n\nexport default function MenuItemTemplate(this: MenuItem, hooks?: Partial<ListItemHooks>) {\n\tconst currentHooks = { ...predefinedHooks, ...hooks };\n\n\treturn <>\n\t\t{ListItemTemplate.call(this, currentHooks)}\n\n\t\t{listItemPostContent.call(this)}\n\t</>;\n}\n\nfunction listItemContent(this: MenuItem) {\n\treturn (<>\n\t\t{this.text && <div class=\"ui5-menu-item-text\">{this.text}</div>}\n\n\t\t{rightContent.call(this)}\n\t\t{checkmarkContent.call(this)}\n\t</>);\n}\n\nfunction checkmarkContent(this: MenuItem) {\n\treturn !this._markChecked ? \"\" : (\n\t\t<div class=\"ui5-menu-item-checked\">\n\t\t\t<Icon\n\t\t\t\tname={checkIcon}\n\t\t\t\tclass=\"ui5-menu-item-icon-checked\"\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nfunction rightContent(this: MenuItem) {\n\tswitch (true) {\n\tcase this.hasSubmenu:\n\t\treturn (\n\t\t\t<div class=\"ui5-menu-item-submenu-icon\" >\n\t\t\t\t<Icon\n\t\t\t\t\tpart=\"subicon\"\n\t\t\t\t\tname={slimArrowRight}\n\t\t\t\t\tclass=\"ui5-menu-item-icon-end\"\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\tcase this.hasEndContent:\n\t\treturn <slot name=\"endContent\" onKeyDown={this._endContentKeyDown}></slot>;\n\tcase !!this.additionalText:\n\t\treturn (\n\t\t\t<span\n\t\t\t\tpart=\"additional-text\"\n\t\t\t\tclass=\"ui5-li-additional-text\"\n\t\t\t\taria-hidden={this._accInfo.ariaHidden}\n\t\t\t>\n\t\t\t\t{this.additionalText}\n\t\t\t</span>\n\t\t);\n\t}\n}\n\nfunction iconBegin(this: MenuItem) {\n\tif (this.hasIcon) {\n\t\treturn <Icon class=\"ui5-li-icon\" name={this.icon} />;\n\t}\n\n\tif (this._siblingsWithIcon) {\n\t\treturn <div class=\"ui5-menu-item-dummy-icon\"></div>;\n\t}\n}\n\nfunction listItemPostContent(this: MenuItem) {\n\treturn this.hasSubmenu && <ResponsivePopover\n\t\tid={`${this._id}-menu-rp`}\n\t\tclass=\"ui5-menu-rp ui5-menu-rp-sub-menu\"\n\t\tpreventInitialFocus={true}\n\t\tpreventFocusRestore={true}\n\t\thideArrow={true}\n\t\tallowTargetOverlap={true}\n\t\tplacement={PopoverPlacement.End}\n\t\tverticalAlign=\"Top\"\n\t\taccessibleName={this.accessibleNameText}\n\t\tonBeforeOpen={this._beforePopoverOpen}\n\t\tonOpen={this._afterPopoverOpen}\n\t\tonBeforeClose={this._beforePopoverClose}\n\t\tonClose={this._afterPopoverClose}\n\t>\n\t\t{\n\t\t\tthis.isPhone && (\n\t\t\t\t<>\n\t\t\t\t\t<div slot=\"header\" class=\"ui5-menu-dialog-header\" >\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\ticon={navBackIcon}\n\t\t\t\t\t\t\tclass=\"ui5-menu-back-button\"\n\t\t\t\t\t\t\tdesign=\"Transparent\"\n\t\t\t\t\t\t\taria-label={this.labelBack}\n\t\t\t\t\t\t\tonClick={this._close}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<div class=\"ui5-menu-dialog-title\" >\n\t\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t\t{this.text}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div >\n\t\t\t\t</>\n\t\t\t)\n\t\t}\n\n\t\t<div\n\t\t\tid={`${this._id}-menu-main`}\n\t\t\tclass={this.loading ? \"menu-busy-indicator-main\" : \"\"}\n\t\t>\n\t\t\t{\n\t\t\t\tthis.items.length ? (\n\t\t\t\t\t<List\n\t\t\t\t\t\tid={`${this._id}-menu-list`}\n\t\t\t\t\t\tselectionMode=\"None\"\n\t\t\t\t\t\tseparators=\"None\"\n\t\t\t\t\t\taccessibleRole=\"Menu\"\n\t\t\t\t\t\tloading={this.loading}\n\t\t\t\t\t\tloadingDelay={this.loadingDelay}\n\t\t\t\t\t\tonMouseOver={this._itemMouseOver}\n\t\t\t\t\t\tonKeyDown={this._itemKeyDown}\n\t\t\t\t\t\tonKeyUp={this._itemKeyUp}\n\t\t\t\t\t\t// handles event from slotted children\n\t\t\t\t\t\tonui5-close-menu={this._close}\n\t\t\t\t\t\tonui5-exit-end-content={this._navigateOutOfEndContent}\n\t\t\t\t\t>\n\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t</List>\n\t\t\t\t) : this.loading && <BusyIndicator\n\t\t\t\t\tid={`${this._id}-menu-busy-indicator`}\n\t\t\t\t\tdelay={this.loadingDelay}\n\t\t\t\t\tclass=\"ui5-menu-busy-indicator\"\n\t\t\t\t\tactive={true}\n\t\t\t\t/>\n\t\t\t}\n\t\t</div >\n\t\t{\n\t\t\tthis.isPhone && (\n\t\t\t\t<div slot=\"footer\" class=\"ui5-menu-dialog-footer\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tdesign=\"Transparent\"\n\t\t\t\t\t\tonClick={this._closeAll}\n\t\t\t\t\t>\n\t\t\t\t\t\t{this.labelCancel}\n\t\t\t\t\t</Button>\n\t\t\t\t</div>\n\t\t\t)\n\t\t}\n\t</ResponsivePopover>;\n}\n"]}

package/dist/MenuSeparator.d.ts

@@ -0,0 +1,27 @@
+import type { ClassMap } from "@ui5/webcomponents-base/dist/types.js";
+import ListItemBase from "./ListItemBase.js";
+import type { IMenuItem } from "./Menu.js";
+/**
+ * @class
+ * The `ui5-menu-separator` represents a horizontal line to separate menu items inside a `ui5-menu`.
+ * @constructor
+ * @extends ListItemBase
+ * @implements {IMenuItem}
+ * @public
+ * @since 2.0.0
+ */
+declare class MenuSeparator extends ListItemBase implements IMenuItem {
+    eventDetails: ListItemBase["eventDetails"];
+    get isSeparator(): boolean;
+    get classes(): ClassMap;
+    /**
+     * @override
+     */
+    get _focusable(): boolean;
+    /**
+     * @override
+     */
+    get _pressable(): boolean;
+}
+export default MenuSeparator;
+export declare const isInstanceOfMenuSeparator: (object: any) => object is MenuSeparator;

package/dist/MenuSeparator.js

@@ -0,0 +1,57 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
+import jsxRendererer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js";
+import menuSeparatorTemplate from "./MenuSeparatorTemplate.js";
+import menuSeparatorCss from "./generated/themes/MenuSeparator.css.js";
+import ListItemBase from "./ListItemBase.js";
+import createInstanceChecker from "@ui5/webcomponents-base/dist/util/createInstanceChecker.js";
+/**
+ * @class
+ * The `ui5-menu-separator` represents a horizontal line to separate menu items inside a `ui5-menu`.
+ * @constructor
+ * @extends ListItemBase
+ * @implements {IMenuItem}
+ * @public
+ * @since 2.0.0
+ */
+let MenuSeparator = class MenuSeparator extends ListItemBase {
+    get isSeparator() {
+        return true;
+    }
+    get classes() {
+        return {
+            main: {
+                "ui5-menu-separator": true,
+            },
+        };
+    }
+    /**
+     * @override
+     */
+    get _focusable() {
+        return false;
+    }
+    /**
+     * @override
+     */
+    get _pressable() {
+        return false;
+    }
+};
+MenuSeparator = __decorate([
+    customElement({
+        tag: "ui5-menu-separator",
+        renderer: jsxRendererer,
+        styles: [menuSeparatorCss],
+        template: menuSeparatorTemplate,
+    })
+], MenuSeparator);
+MenuSeparator.define();
+export default MenuSeparator;
+export const isInstanceOfMenuSeparator = createInstanceChecker("isSeparator");
+//# sourceMappingURL=MenuSeparator.js.map

package/dist/MenuSeparator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuSeparator.js","sourceRoot":"","sources":["../src/MenuSeparator.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,aAAa,MAAM,sDAAsD,CAAC;AAEjF,OAAO,qBAAqB,MAAM,4BAA4B,CAAC;AAC/D,OAAO,gBAAgB,MAAM,yCAAyC,CAAC;AACvE,OAAO,YAAY,MAAM,mBAAmB,CAAC;AAE7C,OAAO,qBAAqB,MAAM,4DAA4D,CAAC;AAC/F;;;;;;;;GAQG;AAQH,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,YAAY;IAGvC,IAAI,WAAW;QACd,OAAO,IAAI,CAAC;IACb,CAAC;IAED,IAAI,OAAO;QACV,OAAO;YACN,IAAI,EAAE;gBACL,oBAAoB,EAAE,IAAI;aAC1B;SACD,CAAC;IACH,CAAC;IAED;;OAEG;IACH,IAAI,UAAU;QACb,OAAO,KAAK,CAAC;IACd,CAAC;IAED;;OAEG;IACH,IAAI,UAAU;QACb,OAAO,KAAK,CAAC;IACd,CAAC;CACD,CAAA;AA5BK,aAAa;IAPlB,aAAa,CAAC;QACd,GAAG,EAAE,oBAAoB;QACzB,QAAQ,EAAE,aAAa;QACvB,MAAM,EAAE,CAAC,gBAAgB,CAAC;QAC1B,QAAQ,EAAE,qBAAqB;KAC/B,CAAC;GAEI,aAAa,CA4BlB;AAED,aAAa,CAAC,MAAM,EAAE,CAAC;AAEvB,eAAe,aAAa,CAAC;AAE7B,MAAM,CAAC,MAAM,yBAAyB,GAAG,qBAAqB,CAAgB,aAAa,CAAC,CAAC","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport jsxRendererer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport type { ClassMap } from \"@ui5/webcomponents-base/dist/types.js\";\nimport menuSeparatorTemplate from \"./MenuSeparatorTemplate.js\";\nimport menuSeparatorCss from \"./generated/themes/MenuSeparator.css.js\";\nimport ListItemBase from \"./ListItemBase.js\";\nimport type { IMenuItem } from \"./Menu.js\";\nimport createInstanceChecker from \"@ui5/webcomponents-base/dist/util/createInstanceChecker.js\";\n/**\n * @class\n * The `ui5-menu-separator` represents a horizontal line to separate menu items inside a `ui5-menu`.\n * @constructor\n * @extends ListItemBase\n * @implements {IMenuItem}\n * @public\n * @since 2.0.0\n */\n@customElement({\n\ttag: \"ui5-menu-separator\",\n\trenderer: jsxRendererer,\n\tstyles: [menuSeparatorCss],\n\ttemplate: menuSeparatorTemplate,\n})\n\nclass MenuSeparator extends ListItemBase implements IMenuItem {\n\teventDetails!: ListItemBase[\"eventDetails\"];\n\n\tget isSeparator() {\n\t\treturn true;\n\t}\n\n\tget classes(): ClassMap {\n\t\treturn {\n\t\t\tmain: {\n\t\t\t\t\"ui5-menu-separator\": true,\n\t\t\t},\n\t\t};\n\t}\n\n\t/**\n\t * @override\n\t */\n\tget _focusable() {\n\t\treturn false;\n\t}\n\n\t/**\n\t * @override\n\t */\n\tget _pressable() {\n\t\treturn false;\n\t}\n}\n\nMenuSeparator.define();\n\nexport default MenuSeparator;\n\nexport const isInstanceOfMenuSeparator = createInstanceChecker<MenuSeparator>(\"isSeparator\");\n"]}

package/dist/MenuSeparatorTemplate.d.ts

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

package/dist/MenuSeparatorTemplate.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "@ui5/webcomponents-base/jsx-runtime";
+import ListItemCustom from "./ListItemCustom.js";
+export default function MenuSeparatorTemplate() {
+    return (_jsx(ListItemCustom, { class: "ui5-menu-separator", _forcedAccessibleRole: "separator", disabled: true }));
+}
+//# sourceMappingURL=MenuSeparatorTemplate.js.map

package/dist/MenuSeparatorTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuSeparatorTemplate.js","sourceRoot":"","sources":["../src/MenuSeparatorTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,cAAc,MAAM,qBAAqB,CAAC;AAEjD,MAAM,CAAC,OAAO,UAAU,qBAAqB;IAC5C,OAAO,CACN,KAAC,cAAc,IACd,KAAK,EAAC,oBAAoB,EAC1B,qBAAqB,EAAC,WAAW,EACjC,QAAQ,EAAE,IAAI,GACb,CACF,CAAC;AACH,CAAC","sourcesContent":["import type MenuSeparator from \"./MenuSeparator.js\";\nimport ListItemCustom from \"./ListItemCustom.js\";\n\nexport default function MenuSeparatorTemplate(this: MenuSeparator) {\n\treturn (\n\t\t<ListItemCustom\n\t\t\tclass=\"ui5-menu-separator\"\n\t\t\t_forcedAccessibleRole=\"separator\"\n\t\t\tdisabled={true}\n\t\t/>\n\t);\n}\n"]}

package/dist/MenuTemplate.d.ts

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

package/dist/MenuTemplate.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@ui5/webcomponents-base/jsx-runtime";
+import ResponsivePopover from "./ResponsivePopover.js";
+import List from "./List.js";
+import BusyIndicator from "./BusyIndicator.js";
+import Button from "./Button.js";
+export default function MenuTemplate() {
+    return (_jsxs(ResponsivePopover, { id: `${this._id}-menu-rp`, class: "ui5-menu-rp", placement: this.placement, verticalAlign: "Bottom", horizontalAlign: this.horizontalAlign, opener: this.opener, open: this.open, preventInitialFocus: true, hideArrow: true, allowTargetOverlap: true, accessibleName: this.accessibleNameText, onBeforeOpen: this._beforePopoverOpen, onOpen: this._afterPopoverOpen, onBeforeClose: this._beforePopoverClose, onClose: this._afterPopoverClose, children: [this.isPhone &&
+                _jsx("div", { slot: "header", class: "ui5-menu-dialog-header", children: _jsx("div", { class: "ui5-menu-dialog-title", children: _jsx("h1", { children: this.headerText }) }) }), _jsx("div", { id: `${this._id}-menu-main`, class: this.loading ? "ui5-menu-busy-indicator-main" : "", children: this.items.length ?
+                    (_jsx(List, { id: `${this._id}- menu-list`, selectionMode: "None", loading: this.loading, loadingDelay: this.loadingDelay, separators: "None", accessibleRole: "Menu", onItemClick: this._itemClick, onMouseOver: this._itemMouseOver, onKeyDown: this._itemKeyDown, "onui5-close-menu": this._close, "onui5-exit-end-content": this._navigateOutOfEndContent, children: _jsx("slot", {}) }))
+                    : this.loading && (_jsx(BusyIndicator, { id: `${this._id}-menu-busy-indicator`, delay: this.loadingDelay, class: "ui5-menu-busy-indicator", active: true })) }), this.isPhone &&
+                _jsx("div", { slot: "footer", class: "ui5-menu-dialog-footer", children: _jsx(Button, { design: "Transparent", onClick: this._close, children: this.labelCancel }) })] }));
+}
+//# sourceMappingURL=MenuTemplate.js.map

package/dist/MenuTemplate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuTemplate.js","sourceRoot":"","sources":["../src/MenuTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,iBAAiB,MAAM,wBAAwB,CAAC;AACvD,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,aAAa,MAAM,oBAAoB,CAAC;AAC/C,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,MAAM,CAAC,OAAO,UAAU,YAAY;IACnC,OAAO,CACN,MAAC,iBAAiB,IACjB,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,UAAU,EACzB,KAAK,EAAC,aAAa,EACnB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,aAAa,EAAC,QAAQ,EACtB,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,mBAAmB,EAAE,IAAI,EACzB,SAAS,EAAE,IAAI,EACf,kBAAkB,EAAE,IAAI,EACxB,cAAc,EAAE,IAAI,CAAC,kBAAkB,EACvC,YAAY,EAAE,IAAI,CAAC,kBAAkB,EACrC,MAAM,EAAE,IAAI,CAAC,iBAAiB,EAC9B,aAAa,EAAE,IAAI,CAAC,mBAAmB,EACvC,OAAO,EAAE,IAAI,CAAC,kBAAkB,aAE/B,IAAI,CAAC,OAAO;gBACZ,cAAK,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,wBAAwB,YAChD,cAAK,KAAK,EAAC,uBAAuB,YACjC,uBACE,IAAI,CAAC,UAAU,GACZ,GACA,GACD,EAEP,cACC,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,YAAY,EAC3B,KAAK,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,8BAA8B,CAAC,CAAC,CAAC,EAAE,YAExD,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;oBACnB,CAAC,KAAC,IAAI,IACL,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,aAAa,EAC5B,aAAa,EAAC,MAAM,EACpB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,UAAU,EAAC,MAAM,EACjB,cAAc,EAAC,MAAM,EACrB,WAAW,EAAE,IAAI,CAAC,UAAU,EAC5B,WAAW,EAAE,IAAI,CAAC,cAAc,EAChC,SAAS,EAAE,IAAI,CAAC,YAAY,sBAEV,IAAI,CAAC,MAAM,4BACL,IAAI,CAAC,wBAAwB,YAErD,gBAAa,GACP,CAAC;oBACR,CAAC,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,KAAC,aAAa,IAChC,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,sBAAsB,EACrC,KAAK,EAAE,IAAI,CAAC,YAAY,EACxB,KAAK,EAAC,yBAAyB,EAC/B,MAAM,EAAE,IAAI,GACX,CACD,GAEG,EACL,IAAI,CAAC,OAAO;gBACZ,cAAK,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,wBAAwB,YAChD,KAAC,MAAM,IACN,MAAM,EAAC,aAAa,EACpB,OAAO,EAAE,IAAI,CAAC,MAAM,YAEnB,IAAI,CAAC,WAAW,GACT,GACJ,IAEa,CACrB,CAAC;AACH,CAAC","sourcesContent":["import type Menu from \"./Menu.js\";\nimport ResponsivePopover from \"./ResponsivePopover.js\";\nimport List from \"./List.js\";\nimport BusyIndicator from \"./BusyIndicator.js\";\nimport Button from \"./Button.js\";\n\nexport default function MenuTemplate(this: Menu) {\n\treturn (\n\t\t<ResponsivePopover\n\t\t\tid={`${this._id}-menu-rp`}\n\t\t\tclass=\"ui5-menu-rp\"\n\t\t\tplacement={this.placement}\n\t\t\tverticalAlign=\"Bottom\"\n\t\t\thorizontalAlign={this.horizontalAlign}\n\t\t\topener={this.opener}\n\t\t\topen={this.open}\n\t\t\tpreventInitialFocus={true}\n\t\t\thideArrow={true}\n\t\t\tallowTargetOverlap={true}\n\t\t\taccessibleName={this.accessibleNameText}\n\t\t\tonBeforeOpen={this._beforePopoverOpen}\n\t\t\tonOpen={this._afterPopoverOpen}\n\t\t\tonBeforeClose={this._beforePopoverClose}\n\t\t\tonClose={this._afterPopoverClose}\n\t\t>\n\t\t\t{this.isPhone &&\n\t\t\t\t<div slot=\"header\" class=\"ui5-menu-dialog-header\">\n\t\t\t\t\t<div class=\"ui5-menu-dialog-title\">\n\t\t\t\t\t\t<h1>\n\t\t\t\t\t\t\t{this.headerText}\n\t\t\t\t\t\t</h1>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t}\n\t\t\t<div\n\t\t\t\tid={`${this._id}-menu-main`}\n\t\t\t\tclass={this.loading ? \"ui5-menu-busy-indicator-main\" : \"\"}\n\t\t\t>\n\t\t\t\t{this.items.length ?\n\t\t\t\t\t(<List\n\t\t\t\t\t\tid={`${this._id}- menu-list`}\n\t\t\t\t\t\tselectionMode=\"None\"\n\t\t\t\t\t\tloading={this.loading}\n\t\t\t\t\t\tloadingDelay={this.loadingDelay}\n\t\t\t\t\t\tseparators=\"None\"\n\t\t\t\t\t\taccessibleRole=\"Menu\"\n\t\t\t\t\t\tonItemClick={this._itemClick}\n\t\t\t\t\t\tonMouseOver={this._itemMouseOver}\n\t\t\t\t\t\tonKeyDown={this._itemKeyDown}\n\t\t\t\t\t\t// handles event from slotted children\n\t\t\t\t\t\tonui5-close-menu={this._close}\n\t\t\t\t\t\tonui5-exit-end-content={this._navigateOutOfEndContent}\n\t\t\t\t\t>\n\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t</List>)\n\t\t\t\t\t: this.loading && (<BusyIndicator\n\t\t\t\t\t\tid={`${this._id}-menu-busy-indicator`}\n\t\t\t\t\t\tdelay={this.loadingDelay}\n\t\t\t\t\t\tclass=\"ui5-menu-busy-indicator\"\n\t\t\t\t\t\tactive={true}\n\t\t\t\t\t/>\n\t\t\t\t\t)\n\t\t\t\t}\n\t\t\t</div>\n\t\t\t{this.isPhone &&\n\t\t\t\t<div slot=\"footer\" class=\"ui5-menu-dialog-footer\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tdesign=\"Transparent\"\n\t\t\t\t\t\tonClick={this._close}\n\t\t\t\t\t>\n\t\t\t\t\t\t{this.labelCancel}\n\t\t\t\t\t</Button>\n\t\t\t\t</div>\n\t\t\t}\n\t\t</ResponsivePopover >\n\t);\n}\n"]}

package/dist/MessageStrip.d.ts

@@ -0,0 +1,110 @@
+import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
+import type { Slot } from "@ui5/webcomponents-base/dist/UI5Element.js";
+import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
+import type MessageStripDesign from "./types/MessageStripDesign.js";
+import type { IIcon } from "./Icon.js";
+declare enum DesignClassesMapping {
+    Information = "ui5-message-strip-root--info",
+    Positive = "ui5-message-strip-root--positive",
+    Negative = "ui5-message-strip-root--negative",
+    Critical = "ui5-message-strip-root--critical",
+    ColorSet1 = "ui5-message-strip-root--color-set-1",
+    ColorSet2 = "ui5-message-strip-root--color-set-2"
+}
+type DesignTypeAnnouncemnt = Record<MessageStripDesign, string>;
+type DesignCloseButtonTooltip = Record<MessageStripDesign, string>;
+/**
+ * @class
+ *
+ * ### Overview
+ *
+ * The ui5-message-strip component allows for the embedding of application-related messages.
+ * It supports four semantic designs, each with its own color and icon: "Information", "Positive", "Critical", and "Negative".
+ * Additionally, users can choose from two color sets ("ColorSet1" and "ColorSet2"), each containing 10 predefined color schemes.
+ * Each message shows a "Close" button, so that it can be removed from the UI, if needed.
+
+ * ### Usage
+ *
+ * For the `ui5-message-strip` component, you can define whether it displays
+ * an icon in the beginning and a close button. Moreover, its size and background
+ * can be controlled with CSS.
+ *
+ * ### Keyboard Handling
+ *
+ * #### Fast Navigation
+ * This component provides a build in fast navigation group which can be used via [F6] / [Shift] + [F6] / [Ctrl] + [Alt/Option] / [Down] or [Ctrl] + [Alt/Option] + [Up].
+ * In order to use this functionality, you need to import the following module:
+ * `import "@ui5/webcomponents-base/dist/features/F6Navigation.js"`
+ *
+ * ### ES6 Module Import
+ *
+ * `import "@ui5/webcomponents/dist/MessageStrip.js";`
+ * @constructor
+ * @extends UI5Element
+ * @public
+ * @since 0.9.0
+ * @slot {Array<Node>} default
+ * Defines the text of the component.
+ *
+ * **Note:** Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.
+ */
+declare class MessageStrip extends UI5Element {
+    eventDetails: {
+        close: void;
+    };
+    /**
+     * Defines the component type.
+     * @default "Information"
+     * @public
+     * @since 1.0.0-rc.15
+     */
+    design: `${MessageStripDesign}`;
+    /**
+     * Defines the color scheme of the component.
+     * There are 10 predefined schemes.
+     * To use one you can set a number from `"1"` to `"10"`. The `colorScheme` `"1"` will be set by default.
+     *
+     * @default "1"
+     * @public
+     * @since 2.0.0
+     */
+    colorScheme: string;
+    /**
+     * Defines whether the MessageStrip will show an icon in the beginning.
+     * You can directly provide an icon with the `icon` slot. Otherwise, the default icon for the type will be used.
+     *
+     *  * **Note:** If <code>MessageStripDesign.ColorSet1</code> or <code>MessageStripDesign.ColorSet2</code> value is set to the <code>design</code> property, default icon will not be presented.
+     *
+     * @default false
+     * @public
+     * @since 1.0.0-rc.15
+     */
+    hideIcon: boolean;
+    /**
+     * Defines whether the MessageStrip renders close button.
+     * @default false
+     * @public
+     */
+    hideCloseButton: boolean;
+    /**
+     * Defines the content to be displayed as graphical element within the component.
+     *
+     * **Note:** If no icon is given, the default icon for the component type will be used.
+     * The SAP-icons font provides numerous options.
+     *
+     * See all the available icons in the [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).
+     * @public
+     */
+    icon: Slot<IIcon>;
+    static i18nBundle: I18nBundle;
+    _closeClick(): void;
+    static designAnnouncementMappings(): DesignTypeAnnouncemnt;
+    get hiddenText(): string;
+    get shouldHideIcon(): boolean;
+    static closeButtonMappings(): DesignCloseButtonTooltip;
+    get _closeButtonText(): string;
+    get _closableText(): string;
+    get iconProvided(): boolean;
+    get designClasses(): DesignClassesMapping;
+}
+export default MessageStrip;