npm - @ui5/webcomponents - Versions diffs - 2.11.0-rc.3 → 2.11.0-rc.4 - Mend

@ui5/webcomponents 2.11.0-rc.3 → 2.11.0-rc.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (624) hide show

package/dist/Toolbar.js CHANGED Viewed

@@ -22,7 +22,6 @@ import ToolbarTemplate from "./ToolbarTemplate.js";
 import ToolbarCss from "./generated/themes/Toolbar.css.js";
 import ToolbarPopoverCss from "./generated/themes/ToolbarPopover.css.js";
 import ToolbarItemOverflowBehavior from "./types/ToolbarItemOverflowBehavior.js";
-import { getRegisteredToolbarItem, getRegisteredStyles, } from "./ToolbarRegistry.js";
 function calculateCSSREMValue(styleSet, propertyName) {
     return Number(styleSet.getPropertyValue(propertyName).replace("rem", "")) * parseInt(getComputedStyle(document.body).getPropertyValue("font-size"));
 }
@@ -52,11 +51,9 @@ function parsePxValue(styleSet, propertyName) {
  */
 let Toolbar = Toolbar_1 = class Toolbar extends UI5Element {
     static get styles() {
-        const styles = getRegisteredStyles();
         return [
             ToolbarCss,
             ToolbarPopoverCss,
-            ...styles,
         ];
     }
     constructor() {
@@ -83,7 +80,6 @@ let Toolbar = Toolbar_1 = class Toolbar extends UI5Element {
         this.itemsToOverflow = [];
         this.itemsWidth = 0;
         this.minContentWidth = 0;
-        this.itemsWidthMeasured = false;
         this.ITEMS_WIDTH_MAP = new Map();
         this._onResize = this.onResize.bind(this);
         this._onCloseOverflow = this.closeOverflow.bind(this);
@@ -107,11 +103,11 @@ let Toolbar = Toolbar_1 = class Toolbar extends UI5Element {
     }
     get overflowItems() {
         // spacers are ignored
-        const overflowItems = this.getItemsInfo(this.itemsToOverflow.filter(item => !item.ignoreSpace));
+        const overflowItems = this.itemsToOverflow.filter(item => !item.ignoreSpace);
         return this.reverseOverflow ? overflowItems.reverse() : overflowItems;
     }
     get standardItems() {
-        return this.getItemsInfo(this.items.filter(item => this.itemsToOverflow.indexOf(item) === -1));
+        return this.items.filter(item => this.itemsToOverflow.indexOf(item) === -1);
     }
     get hideOverflowButton() {
         return this.itemsToOverflow.filter(item => !(item.ignoreSpace || item.isSeparator)).length === 0;
@@ -156,12 +152,6 @@ let Toolbar = Toolbar_1 = class Toolbar extends UI5Element {
     get overflowButtonDOM() {
         return this.shadowRoot.querySelector(".ui5-tb-overflow-btn");
     }
-    get itemsDOM() {
-        return this.shadowRoot.querySelector(".ui5-tb-items");
-    }
-    get hasItemWithText() {
-        return this.itemsToOverflow.some((item) => item.containsText);
-    }
     get hasFlexibleSpacers() {
         return this.items.some((item) => item.hasFlexibleWidth);
     }
@@ -182,12 +172,14 @@ let Toolbar = Toolbar_1 = class Toolbar extends UI5Element {
     onBeforeRendering() {
         this.detachListeners();
         this.attachListeners();
-        this.preprocessItems();
     }
     async onAfterRendering() {
         await renderFinished();
         this.storeItemsWidth();
         this.processOverflowLayout();
+        this.items.forEach(item => {
+            item.isOverflowed = this.overflowItems.map(overflowItem => overflowItem).indexOf(item) !== -1;
+        });
     }
     /**
      * Returns if the overflow popup is open.
@@ -341,21 +333,6 @@ let Toolbar = Toolbar_1 = class Toolbar extends UI5Element {
         this.itemsToOverflow = [];
         this.contentWidth = 0; // re-render
     }
-    getItemsInfo(items) {
-        return items.map((item) => {
-            const ctor = item.constructor;
-            const ElementClass = getRegisteredToolbarItem(ctor.getMetadata().getPureTag());
-            if (!ElementClass) {
-                return null;
-            }
-            const toolbarItem = {
-                toolbarTemplate: ElementClass.toolbarTemplate,
-                toolbarPopoverTemplate: ElementClass.toolbarPopoverTemplate,
-                context: item,
-            };
-            return toolbarItem;
-        }).filter(item => !!item);
-    }
     getItemWidth(item) {
         // Spacer width - always 0 for flexible spacers, so that they shrink, otherwise - measure the width normally
         if (item.ignoreSpace || item.isSeparator) {
@@ -363,9 +340,9 @@ let Toolbar = Toolbar_1 = class Toolbar extends UI5Element {
         }
         const id = item._id;
         // Measure rendered width for spacers with width, and for normal items
-        const renderedItem = this.getRegisteredToolbarItemByID(id);
+        const renderedItem = this.shadowRoot.querySelector(`#${item.slot}`);
         let itemWidth = 0;
-        if (renderedItem) {
+        if (renderedItem && renderedItem.offsetWidth) {
             const ItemCSSStyleSet = getComputedStyle(renderedItem);
             itemWidth = renderedItem.offsetWidth + parsePxValue(ItemCSSStyleSet, "margin-inline-end")
                 + parsePxValue(ItemCSSStyleSet, "margin-inline-start");
@@ -378,18 +355,6 @@ let Toolbar = Toolbar_1 = class Toolbar extends UI5Element {
     getCachedItemWidth(id) {
         return this.ITEMS_WIDTH_MAP.get(id);
     }
-    getItemByID(id) {
-        return this.items.find(item => item._id === id);
-    }
-    getRegisteredToolbarItemByID(id) {
-        return this.itemsDOM.querySelector(`[data-ui5-external-action-item-id="${id}"]`);
-    }
-    preprocessItems() {
-        this.items.forEach(item => {
-            item._getRealDomRef = () => this.getDomRef().querySelector(`[data-ui5-stable*=${item.stableDomRef}]`)
-                ?? this.getOverflowPopover().querySelector(`[data-ui5-stable*=${item.stableDomRef}]`);
-        });
-    }
 };
 __decorate([
     property()
@@ -416,7 +381,9 @@ __decorate([
     property({ type: Boolean })
 ], Toolbar.prototype, "popoverOpen", void 0);
 __decorate([
-    slot({ "default": true, type: HTMLElement, invalidateOnChildChange: true })
+    slot({
+        "default": true, type: HTMLElement, invalidateOnChildChange: true, individualSlots: true,
+    })
 ], Toolbar.prototype, "items", void 0);
 __decorate([
     i18n("@ui5/webcomponents")

package/dist/Toolbar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Toolbar.js","sourceRoot":"","sources":["../src/Toolbar.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport type { ChangeInfo } from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport type { UI5CustomEvent } from \"@ui5/webcomponents-base\";\nimport { renderFinished } from \"@ui5/webcomponents-base/dist/Render.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport type { ResizeObserverCallback } from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport { getEffectiveAriaLabelText } from \"@ui5/webcomponents-base/dist/util/AccessibilityTextsHelper.js\";\nimport \"@ui5/webcomponents-icons/dist/overflow.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport { getScopedVarName } from \"@ui5/webcomponents-base/dist/CustomElementsScope.js\";\n\nimport {\n\tTOOLBAR_OVERFLOW_BUTTON_ARIA_LABEL,\n\tTOOLBAR_POPOVER_AVAILABLE_VALUES,\n} from \"./generated/i18n/i18n-defaults.js\";\n\nimport ToolbarTemplate from \"./ToolbarTemplate.js\";\nimport ToolbarCss from \"./generated/themes/Toolbar.css.js\";\n\nimport ToolbarPopoverCss from \"./generated/themes/ToolbarPopover.css.js\";\n\nimport type ToolbarAlign from \"./types/ToolbarAlign.js\";\nimport type ToolbarDesign from \"./types/ToolbarDesign.js\";\nimport ToolbarItemOverflowBehavior from \"./types/ToolbarItemOverflowBehavior.js\";\n\nimport type ToolbarItem from \"./ToolbarItem.js\";\nimport type ToolbarSeparator from \"./ToolbarSeparator.js\";\n\nimport {\n\tgetRegisteredToolbarItem,\n\tgetRegisteredStyles,\n} from \"./ToolbarRegistry.js\";\n\nimport type Button from \"./Button.js\";\nimport type Popover from \"./Popover.js\";\n\ntype ToolbarMinWidthChangeEventDetail = {\n\tminWidth: number,\n};\n\nfunction calculateCSSREMValue(styleSet: CSSStyleDeclaration, propertyName: string): number {\n\treturn Number(styleSet.getPropertyValue(propertyName).replace(\"rem\", \"\")) * parseInt(getComputedStyle(document.body).getPropertyValue(\"font-size\"));\n}\n\nfunction parsePxValue(styleSet: CSSStyleDeclaration, propertyName: string): number {\n\treturn Number(styleSet.getPropertyValue(propertyName).replace(\"px\", \"\"));\n}\n\n/*\n @class\n \n ### Overview\n \n The `ui5-toolbar` component is used to create a horizontal layout with items.\n * The items can be overflowing in a popover, when the space is not enough to show all of them.\n \n ### Keyboard Handling\n * The `ui5-toolbar` provides advanced keyboard handling.\n \n - The control is not interactive, but can contain of interactive elements\n * - [Tab] - iterates through elements\n \n ### ES6 Module Import\n * `import \"@ui5/webcomponents/dist/Toolbar.js\";`\n * @constructor\n * @extends UI5Element\n * @public\n * @since 1.17.0\n /\n@customElement({\n\ttag: \"ui5-toolbar\",\n\tlanguageAware: true,\n\trenderer: jsxRenderer,\n\ttemplate: ToolbarTemplate,\n})\n/\n @private\n/\n@event(\"_min-content-width-change\", {\n\tbubbles: true,\n})\n\nclass Toolbar extends UI5Element {\n\teventDetails!: {\n\t\t\"_min-content-width-change\": ToolbarMinWidthChangeEventDetail\n\t}\n\t@i18n(\"@ui5/webcomponents\")\n\tstatic i18nBundle: I18nBundle;\n\n\t/\n\t Indicated the direction in which the Toolbar items will be aligned.\n\t * @public\n\t * @default \"End\"\n\t /\n\t@property()\n\talignContent: `${ToolbarAlign}` = \"End\";\n\n\t/\n\t Calculated width of the whole toolbar.\n\t * @private\n\t * @default undefined\n\t /\n\t@property({ type: Number })\n\twidth?: number;\n\n\t/\n\t Calculated width of the toolbar content.\n\t * @private\n\t * @default undefined\n\t /\n\t@property({ type: Number })\n\tcontentWidth?: number;\n\n\t/\n\t Notifies the toolbar if it should show the items in a reverse way if Toolbar Popover needs to be placed on \"Top\" position.\n\t * @private\n\t /\n\t@property({ type: Boolean })\n\treverseOverflow = false;\n\n\t/\n\t Defines the accessible ARIA name of the component.\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\taccessibleName?: string;\n\n\t/\n\t Receives id(or many ids) of the elements that label the input.\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\taccessibleNameRef?: string;\n\n\t/\n\t Defines the toolbar design.\n\t * @public\n\t * @default \"Solid\"\n\t * @since 2.0.0\n\t /\n\t@property()\n\tdesign: `${ToolbarDesign}` = \"Solid\"\n\n\t@property({ type: Boolean })\n\tpopoverOpen = false;\n\n\t/\n\t Defines the items of the component.\n \n Note: Currently only `ui5-toolbar-button`, `ui5-toolbar-select`, `ui5-toolbar-separator` and `ui5-toolbar-spacer` are allowed here.\n\t * @public\n\t /\n\t@slot({ \"default\": true, type: HTMLElement, invalidateOnChildChange: true })\n\titems!: Array<ToolbarItem>\n\n\t_onResize!: ResizeObserverCallback;\n\t_onCloseOverflow!: EventListener;\n\titemsToOverflow: Array<ToolbarItem> = [];\n\titemsWidth = 0;\n\tminContentWidth = 0;\n\titemsWidthMeasured = false;\n\n\tITEMS_WIDTH_MAP: Map<string, number> = new Map();\n\n\tstatic get styles() {\n\t\tconst styles = getRegisteredStyles();\n\t\treturn [\n\t\t\tToolbarCss,\n\t\t\tToolbarPopoverCss,\n\t\t\t...styles,\n\t\t];\n\t}\n\n\tconstructor() {\n\t\tsuper();\n\n\t\tthis._onResize = this.onResize.bind(this);\n\t\tthis._onCloseOverflow = this.closeOverflow.bind(this);\n\t}\n\n\t/\n\t Read-only members\n\t /\n\n\tget overflowButtonSize(): number {\n\t\treturn this.overflowButtonDOM?.getBoundingClientRect().width \|\| 0;\n\t}\n\n\tget padding(): number {\n\t\tconst toolbarComputedStyle = getComputedStyle(this.getDomRef()!);\n\t\treturn calculateCSSREMValue(toolbarComputedStyle, getScopedVarName(\"--_ui5-toolbar-padding-left\"))\n\t\t\t+ calculateCSSREMValue(toolbarComputedStyle, getScopedVarName(\"--_ui5-toolbar-padding-right\"));\n\t}\n\n\tget alwaysOverflowItems() {\n\t\treturn this.items.filter((item: ToolbarItem) => item.overflowPriority === ToolbarItemOverflowBehavior.AlwaysOverflow);\n\t}\n\n\tget movableItems() {\n\t\treturn this.items.filter((item: ToolbarItem) => item.overflowPriority !== ToolbarItemOverflowBehavior.AlwaysOverflow && item.overflowPriority !== ToolbarItemOverflowBehavior.NeverOverflow);\n\t}\n\n\tget overflowItems() {\n\t\t// spacers are ignored\n\t\tconst overflowItems = this.getItemsInfo(this.itemsToOverflow.filter(item => !item.ignoreSpace));\n\t\treturn this.reverseOverflow ? overflowItems.reverse() : overflowItems;\n\t}\n\n\tget standardItems() {\n\t\treturn this.getItemsInfo(this.items.filter(item => this.itemsToOverflow.indexOf(item) === -1));\n\t}\n\n\tget hideOverflowButton() {\n\t\treturn this.itemsToOverflow.filter(item => !(item.ignoreSpace \|\| item.isSeparator)).length === 0;\n\t}\n\n\tget interactiveItemsCount() {\n\t\treturn this.items.filter((item: ToolbarItem) => item.isInteractive).length;\n\t}\n\n\t/\n\t Accessibility\n\t /\n\n\tget hasAriaSemantics() {\n\t\treturn this.interactiveItemsCount > 1;\n\t}\n\n\tget accessibleRole() {\n\t\treturn this.hasAriaSemantics ? \"toolbar\" as const : undefined;\n\t}\n\n\tget ariaLabelText() {\n\t\treturn this.hasAriaSemantics ? getEffectiveAriaLabelText(this) : undefined;\n\t}\n\n\tget accInfo() {\n\t\treturn {\n\t\t\troot: {\n\t\t\t\trole: this.accessibleRole,\n\t\t\t\taccessibleName: this.ariaLabelText,\n\t\t\t},\n\t\t\toverflowButton: {\n\t\t\t\taccessibleName: Toolbar.i18nBundle.getText(TOOLBAR_OVERFLOW_BUTTON_ARIA_LABEL),\n\t\t\t\ttooltip: Toolbar.i18nBundle.getText(TOOLBAR_OVERFLOW_BUTTON_ARIA_LABEL),\n\t\t\t\taccessibilityAttributes: {\n\t\t\t\t\texpanded: this.popoverOpen,\n\t\t\t\t\thasPopup: \"menu\" as const,\n\t\t\t\t},\n\t\t\t},\n\t\t\tpopover: {\n\t\t\t\taccessibleName: Toolbar.i18nBundle.getText(TOOLBAR_POPOVER_AVAILABLE_VALUES),\n\t\t\t},\n\t\t};\n\t}\n\n\t/\n\t Toolbar Overflow Popover\n\t /\n\n\tget overflowButtonDOM(): Button \| null {\n\t\treturn this.shadowRoot!.querySelector(\".ui5-tb-overflow-btn\");\n\t}\n\n\tget itemsDOM() {\n\t\treturn this.shadowRoot!.querySelector(\".ui5-tb-items\");\n\t}\n\n\tget hasItemWithText(): boolean {\n\t\treturn this.itemsToOverflow.some((item: ToolbarItem) => item.containsText);\n\t}\n\n\tget hasFlexibleSpacers() {\n\t\treturn this.items.some((item: ToolbarItem) => item.hasFlexibleWidth);\n\t}\n\n\t/\n\t Lifecycle methods\n\t /\n\tonEnterDOM() {\n\t\tResizeHandler.register(this, this._onResize);\n\t}\n\n\tonExitDOM() {\n\t\tResizeHandler.deregister(this, this._onResize);\n\t}\n\n\tonInvalidation(changeInfo: ChangeInfo) {\n\t\tif (changeInfo.reason === \"childchange\" && changeInfo.child === this.itemsToOverflow[0]) {\n\t\t\tthis.onToolbarItemChange();\n\t\t}\n\t}\n\n\tonBeforeRendering() {\n\t\tthis.detachListeners();\n\t\tthis.attachListeners();\n\n\t\tthis.preprocessItems();\n\t}\n\n\tasync onAfterRendering() {\n\t\tawait renderFinished();\n\n\t\tthis.storeItemsWidth();\n\t\tthis.processOverflowLayout();\n\t}\n\n\t/\n\t Returns if the overflow popup is open.\n\t * @public\n\t /\n\tisOverflowOpen(): boolean {\n\t\tconst overflowPopover = this.getOverflowPopover();\n\t\treturn overflowPopover.open;\n\t}\n\n\topenOverflow(): void {\n\t\tconst overflowPopover = this.getOverflowPopover();\n\t\toverflowPopover.opener = this.overflowButtonDOM!;\n\t\toverflowPopover.open = true;\n\t\tthis.reverseOverflow = overflowPopover.actualPlacement === \"Top\";\n\t}\n\n\tcloseOverflow() {\n\t\tconst overflowPopover = this.getOverflowPopover();\n\t\toverflowPopover.open = false;\n\t}\n\n\ttoggleOverflow() {\n\t\tif (this.popoverOpen) {\n\t\t\tthis.closeOverflow();\n\t\t} else {\n\t\t\tthis.openOverflow();\n\t\t}\n\t}\n\n\tgetOverflowPopover(): Popover {\n\t\treturn this.shadowRoot!.querySelector<Popover>(\".ui5-overflow-popover\")!;\n\t}\n\n\t/\n\t Layout management\n\t /\n\n\tprocessOverflowLayout() {\n\t\tif (this.offsetWidth === 0) {\n\t\t\treturn;\n\t\t}\n\t\tconst containerWidth = this.offsetWidth - this.padding;\n\t\tconst contentWidth = this.itemsWidth;\n\t\tlet overflowSpace = contentWidth - containerWidth + this.overflowButtonSize;\n\n\t\tif (contentWidth <= containerWidth) {\n\t\t\toverflowSpace = 0;\n\t\t}\n\n\t\t// skip calculation if the width has not been changed or if the items width has not been changed\n\t\tif (this.width === containerWidth && this.contentWidth === contentWidth) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.distributeItems(overflowSpace);\n\t\tthis.width = containerWidth;\n\t\tthis.contentWidth = contentWidth;\n\t}\n\n\tstoreItemsWidth() {\n\t\tlet totalWidth = 0,\n\t\t\tminWidth = 0;\n\n\t\tthis.items.forEach((item: ToolbarItem) => {\n\t\t\tconst itemWidth = this.getItemWidth(item);\n\t\t\ttotalWidth += itemWidth;\n\t\t\tif (item.overflowPriority === ToolbarItemOverflowBehavior.NeverOverflow) {\n\t\t\t\tminWidth += itemWidth;\n\t\t\t}\n\t\t\tthis.ITEMS_WIDTH_MAP.set(item._id, itemWidth);\n\t\t});\n\n\t\tif (minWidth !== this.minContentWidth) {\n\t\t\tconst spaceAroundContent = this.offsetWidth - this.getDomRef()!.offsetWidth;\n\t\t\tthis.fireDecoratorEvent(\"_min-content-width-change\", {\n\t\t\t\tminWidth: minWidth + spaceAroundContent + this.overflowButtonSize,\n\t\t\t});\n\t\t}\n\n\t\tthis.itemsWidth = totalWidth;\n\t\tthis.minContentWidth = minWidth;\n\t}\n\n\tdistributeItems(overflowSpace = 0) {\n\t\tconst movableItems = this.movableItems.reverse();\n\t\tlet index = 0;\n\t\tlet currentItem = movableItems[index];\n\n\t\tthis.itemsToOverflow = [];\n\n\t\t// distribute items that always overflow\n\t\tthis.distributeItemsThatAlwaysOverflow();\n\n\t\twhile (overflowSpace > 0 && currentItem) {\n\t\t\tthis.itemsToOverflow.unshift(currentItem);\n\t\t\toverflowSpace -= this.getCachedItemWidth(currentItem?._id) \|\| 0;\n\t\t\tindex++;\n\t\t\tcurrentItem = movableItems[index];\n\t\t}\n\n\t\t// If the last bar item is a spacer, force it to the overflow even if there is enough space for it\n\t\tif (index < movableItems.length) {\n\t\t\tlet lastItem = movableItems[index];\n\t\t\twhile (index <= movableItems.length - 1 && lastItem.isSeparator) {\n\t\t\t\tthis.itemsToOverflow.unshift(lastItem);\n\t\t\t\tindex++;\n\t\t\t\tlastItem = movableItems[index];\n\t\t\t}\n\t\t}\n\n\t\tthis.setSeperatorsVisibilityInOverflow();\n\t}\n\n\tdistributeItemsThatAlwaysOverflow() {\n\t\tthis.alwaysOverflowItems.forEach((item: ToolbarItem) => {\n\t\t\tthis.itemsToOverflow.push(item);\n\t\t});\n\t}\n\n\tsetSeperatorsVisibilityInOverflow() {\n\t\tthis.itemsToOverflow.forEach((item, idx, items) => {\n\t\t\tif (item.isSeparator) {\n\t\t\t\t(item as ToolbarSeparator).visible = this.shouldShowSeparatorInOverflow(idx, items);\n\t\t\t}\n\t\t});\n\t}\n\n\tshouldShowSeparatorInOverflow(separatorIdx: number, overflowItems: Array<ToolbarItem>) {\n\t\tlet foundPrevNonSeparatorItem = false;\n\t\tlet foundNextNonSeperatorItem = false;\n\n\t\t// search for non-separator item before and after the seperator\n\t\toverflowItems.forEach((item, idx) => {\n\t\t\tif (idx < separatorIdx && !item.isSeparator) {\n\t\t\t\tfoundPrevNonSeparatorItem = true;\n\t\t\t}\n\t\t\tif (idx > separatorIdx && !item.isSeparator) {\n\t\t\t\tfoundNextNonSeperatorItem = true;\n\t\t\t}\n\t\t});\n\n\t\treturn foundPrevNonSeparatorItem && foundNextNonSeperatorItem;\n\t}\n\n\t/\n\t Event Handlers\n\t /\n\n\tonOverflowPopoverClosed() {\n\t\tthis.popoverOpen = false;\n\t}\n\n\tonBeforeClose(e: UI5CustomEvent<Popover, \"before-close\">) {\n\t\te.preventDefault();\n\t}\n\n\tonOverflowPopoverOpened() {\n\t\tthis.popoverOpen = true;\n\t}\n\n\tonResize() {\n\t\tif (!this.itemsWidth) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.closeOverflow();\n\t\tthis.processOverflowLayout();\n\t}\n\n\t/\n\t Private members\n\t /\n\n\tattachListeners() {\n\t\tthis.addEventListener(\"ui5-close-overflow\", this._onCloseOverflow);\n\t}\n\n\tdetachListeners() {\n\t\tthis.removeEventListener(\"ui5-close-overflow\", this._onCloseOverflow);\n\t}\n\n\tonToolbarItemChange() {\n\t\t// some items were updated reset the cache and trigger a re-render\n\t\tthis.itemsToOverflow = [];\n\t\tthis.contentWidth = 0; // re-render\n\t}\n\n\tgetItemsInfo(items: Array<ToolbarItem>) {\n\t\treturn items.map((item: ToolbarItem) => {\n\t\t\tconst ctor = item.constructor as typeof ToolbarItem;\n\t\t\tconst ElementClass = getRegisteredToolbarItem(ctor.getMetadata().getPureTag());\n\n\t\t\tif (!ElementClass) {\n\t\t\t\treturn null;\n\t\t\t}\n\n\t\t\tconst toolbarItem = {\n\t\t\t\ttoolbarTemplate: ElementClass.toolbarTemplate,\n\t\t\t\ttoolbarPopoverTemplate: ElementClass.toolbarPopoverTemplate,\n\t\t\t\tcontext: item,\n\t\t\t};\n\n\t\t\treturn toolbarItem;\n\t\t}).filter(item => !!item);\n\t}\n\n\tgetItemWidth(item: ToolbarItem): number {\n\t\t// Spacer width - always 0 for flexible spacers, so that they shrink, otherwise - measure the width normally\n\t\tif (item.ignoreSpace \|\| item.isSeparator) {\n\t\t\treturn 0;\n\t\t}\n\t\tconst id: string = item._id;\n\t\t// Measure rendered width for spacers with width, and for normal items\n\t\tconst renderedItem = this.getRegisteredToolbarItemByID(id);\n\n\t\tlet itemWidth = 0;\n\n\t\tif (renderedItem) {\n\t\t\tconst ItemCSSStyleSet = getComputedStyle(renderedItem);\n\t\t\titemWidth = renderedItem.offsetWidth + parsePxValue(ItemCSSStyleSet, \"margin-inline-end\")\n\t\t\t\t+ parsePxValue(ItemCSSStyleSet, \"margin-inline-start\");\n\t\t} else {\n\t\t\titemWidth = this.getCachedItemWidth(id) \|\| 0;\n\t\t}\n\n\t\treturn Math.ceil(itemWidth);\n\t}\n\n\tgetCachedItemWidth(id: string) {\n\t\treturn this.ITEMS_WIDTH_MAP.get(id);\n\t}\n\n\tgetItemByID(id: string) {\n\t\treturn this.items.find(item => item._id === id);\n\t}\n\n\tgetRegisteredToolbarItemByID(id: string): HTMLElement \| null {\n\t\treturn this.itemsDOM!.querySelector(`[data-ui5-external-action-item-id=\"${id}\"]`);\n\t}\n\n\tpreprocessItems() {\n\t\tthis.items.forEach(item => {\n\t\t\titem._getRealDomRef = () => this.getDomRef()!.querySelector(`[data-ui5-stable=${item.stableDomRef}]`)\n\t\t\t\t?? this.getOverflowPopover().querySelector(`[data-ui5-stable*=${item.stableDomRef}]`)!;\n\t\t});\n\t}\n}\n\nToolbar.define();\n\nexport default Toolbar;\nexport type {\n\tToolbarMinWidthChangeEventDetail,\n};\n"]}
1	+ {"version":3,"file":"Toolbar.js","sourceRoot":"","sources":["../src/Toolbar.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport type { ChangeInfo } from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport type { UI5CustomEvent } from \"@ui5/webcomponents-base\";\nimport { renderFinished } from \"@ui5/webcomponents-base/dist/Render.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport type { ResizeObserverCallback } from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport { getEffectiveAriaLabelText } from \"@ui5/webcomponents-base/dist/util/AccessibilityTextsHelper.js\";\nimport \"@ui5/webcomponents-icons/dist/overflow.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport { getScopedVarName } from \"@ui5/webcomponents-base/dist/CustomElementsScope.js\";\n\nimport {\n\tTOOLBAR_OVERFLOW_BUTTON_ARIA_LABEL,\n\tTOOLBAR_POPOVER_AVAILABLE_VALUES,\n} from \"./generated/i18n/i18n-defaults.js\";\n\nimport ToolbarTemplate from \"./ToolbarTemplate.js\";\nimport ToolbarCss from \"./generated/themes/Toolbar.css.js\";\n\nimport ToolbarPopoverCss from \"./generated/themes/ToolbarPopover.css.js\";\n\nimport type ToolbarAlign from \"./types/ToolbarAlign.js\";\nimport type ToolbarDesign from \"./types/ToolbarDesign.js\";\nimport ToolbarItemOverflowBehavior from \"./types/ToolbarItemOverflowBehavior.js\";\n\nimport type ToolbarItem from \"./ToolbarItem.js\";\nimport type ToolbarSeparator from \"./ToolbarSeparator.js\";\n\nimport type Button from \"./Button.js\";\nimport type Popover from \"./Popover.js\";\n\ntype ToolbarMinWidthChangeEventDetail = {\n\tminWidth: number,\n};\n\nfunction calculateCSSREMValue(styleSet: CSSStyleDeclaration, propertyName: string): number {\n\treturn Number(styleSet.getPropertyValue(propertyName).replace(\"rem\", \"\")) * parseInt(getComputedStyle(document.body).getPropertyValue(\"font-size\"));\n}\n\nfunction parsePxValue(styleSet: CSSStyleDeclaration, propertyName: string): number {\n\treturn Number(styleSet.getPropertyValue(propertyName).replace(\"px\", \"\"));\n}\n\n/*\n @class\n \n ### Overview\n \n The `ui5-toolbar` component is used to create a horizontal layout with items.\n * The items can be overflowing in a popover, when the space is not enough to show all of them.\n \n ### Keyboard Handling\n * The `ui5-toolbar` provides advanced keyboard handling.\n \n - The control is not interactive, but can contain of interactive elements\n * - [Tab] - iterates through elements\n \n ### ES6 Module Import\n * `import \"@ui5/webcomponents/dist/Toolbar.js\";`\n * @constructor\n * @extends UI5Element\n * @public\n * @since 1.17.0\n /\n@customElement({\n\ttag: \"ui5-toolbar\",\n\tlanguageAware: true,\n\trenderer: jsxRenderer,\n\ttemplate: ToolbarTemplate,\n})\n/\n @private\n/\n@event(\"_min-content-width-change\", {\n\tbubbles: true,\n})\n\nclass Toolbar extends UI5Element {\n\teventDetails!: {\n\t\t\"_min-content-width-change\": ToolbarMinWidthChangeEventDetail\n\t}\n\t@i18n(\"@ui5/webcomponents\")\n\tstatic i18nBundle: I18nBundle;\n\n\t/\n\t Indicated the direction in which the Toolbar items will be aligned.\n\t * @public\n\t * @default \"End\"\n\t /\n\t@property()\n\talignContent: `${ToolbarAlign}` = \"End\";\n\n\t/\n\t Calculated width of the whole toolbar.\n\t * @private\n\t * @default undefined\n\t /\n\t@property({ type: Number })\n\twidth?: number;\n\n\t/\n\t Calculated width of the toolbar content.\n\t * @private\n\t * @default undefined\n\t /\n\t@property({ type: Number })\n\tcontentWidth?: number;\n\n\t/\n\t Notifies the toolbar if it should show the items in a reverse way if Toolbar Popover needs to be placed on \"Top\" position.\n\t * @private\n\t /\n\t@property({ type: Boolean })\n\treverseOverflow = false;\n\n\t/\n\t Defines the accessible ARIA name of the component.\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\taccessibleName?: string;\n\n\t/\n\t Receives id(or many ids) of the elements that label the input.\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\taccessibleNameRef?: string;\n\n\t/\n\t Defines the toolbar design.\n\t * @public\n\t * @default \"Solid\"\n\t * @since 2.0.0\n\t /\n\t@property()\n\tdesign: `${ToolbarDesign}` = \"Solid\"\n\n\t@property({ type: Boolean })\n\tpopoverOpen = false;\n\n\t/\n\t Defines the items of the component.\n \n Note: Currently only `ui5-toolbar-button`, `ui5-toolbar-select`, `ui5-toolbar-separator` and `ui5-toolbar-spacer` are allowed here.\n\t * @public\n\t /\n\t@slot({\n\t\t\"default\": true, type: HTMLElement, invalidateOnChildChange: true, individualSlots: true,\n\t})\n\titems!: Array<ToolbarItem>\n\n\t_onResize!: ResizeObserverCallback;\n\t_onCloseOverflow!: EventListener;\n\titemsToOverflow: Array<ToolbarItem> = [];\n\titemsWidth = 0;\n\tminContentWidth = 0;\n\n\tITEMS_WIDTH_MAP: Map<string, number> = new Map();\n\n\tstatic get styles() {\n\t\treturn [\n\t\t\tToolbarCss,\n\t\t\tToolbarPopoverCss,\n\t\t];\n\t}\n\n\tconstructor() {\n\t\tsuper();\n\n\t\tthis._onResize = this.onResize.bind(this);\n\t\tthis._onCloseOverflow = this.closeOverflow.bind(this);\n\t}\n\n\t/\n\t Read-only members\n\t /\n\n\tget overflowButtonSize(): number {\n\t\treturn this.overflowButtonDOM?.getBoundingClientRect().width \|\| 0;\n\t}\n\n\tget padding(): number {\n\t\tconst toolbarComputedStyle = getComputedStyle(this.getDomRef()!);\n\t\treturn calculateCSSREMValue(toolbarComputedStyle, getScopedVarName(\"--_ui5-toolbar-padding-left\"))\n\t\t\t+ calculateCSSREMValue(toolbarComputedStyle, getScopedVarName(\"--_ui5-toolbar-padding-right\"));\n\t}\n\n\tget alwaysOverflowItems() {\n\t\treturn this.items.filter((item: ToolbarItem) => item.overflowPriority === ToolbarItemOverflowBehavior.AlwaysOverflow);\n\t}\n\n\tget movableItems() {\n\t\treturn this.items.filter((item: ToolbarItem) => item.overflowPriority !== ToolbarItemOverflowBehavior.AlwaysOverflow && item.overflowPriority !== ToolbarItemOverflowBehavior.NeverOverflow);\n\t}\n\n\tget overflowItems() {\n\t\t// spacers are ignored\n\t\tconst overflowItems = this.itemsToOverflow.filter(item => !item.ignoreSpace);\n\t\treturn this.reverseOverflow ? overflowItems.reverse() : overflowItems;\n\t}\n\n\tget standardItems() {\n\t\treturn this.items.filter(item => this.itemsToOverflow.indexOf(item) === -1);\n\t}\n\n\tget hideOverflowButton() {\n\t\treturn this.itemsToOverflow.filter(item => !(item.ignoreSpace \|\| item.isSeparator)).length === 0;\n\t}\n\n\tget interactiveItemsCount() {\n\t\treturn this.items.filter((item: ToolbarItem) => item.isInteractive).length;\n\t}\n\n\t/\n\t Accessibility\n\t /\n\n\tget hasAriaSemantics() {\n\t\treturn this.interactiveItemsCount > 1;\n\t}\n\n\tget accessibleRole() {\n\t\treturn this.hasAriaSemantics ? \"toolbar\" as const : undefined;\n\t}\n\n\tget ariaLabelText() {\n\t\treturn this.hasAriaSemantics ? getEffectiveAriaLabelText(this) : undefined;\n\t}\n\n\tget accInfo() {\n\t\treturn {\n\t\t\troot: {\n\t\t\t\trole: this.accessibleRole,\n\t\t\t\taccessibleName: this.ariaLabelText,\n\t\t\t},\n\t\t\toverflowButton: {\n\t\t\t\taccessibleName: Toolbar.i18nBundle.getText(TOOLBAR_OVERFLOW_BUTTON_ARIA_LABEL),\n\t\t\t\ttooltip: Toolbar.i18nBundle.getText(TOOLBAR_OVERFLOW_BUTTON_ARIA_LABEL),\n\t\t\t\taccessibilityAttributes: {\n\t\t\t\t\texpanded: this.popoverOpen,\n\t\t\t\t\thasPopup: \"menu\" as const,\n\t\t\t\t},\n\t\t\t},\n\t\t\tpopover: {\n\t\t\t\taccessibleName: Toolbar.i18nBundle.getText(TOOLBAR_POPOVER_AVAILABLE_VALUES),\n\t\t\t},\n\t\t};\n\t}\n\n\t/\n\t Toolbar Overflow Popover\n\t /\n\n\tget overflowButtonDOM(): Button \| null {\n\t\treturn this.shadowRoot!.querySelector(\".ui5-tb-overflow-btn\");\n\t}\n\n\tget hasFlexibleSpacers() {\n\t\treturn this.items.some((item: ToolbarItem) => item.hasFlexibleWidth);\n\t}\n\n\t/\n\t Lifecycle methods\n\t /\n\tonEnterDOM() {\n\t\tResizeHandler.register(this, this._onResize);\n\t}\n\n\tonExitDOM() {\n\t\tResizeHandler.deregister(this, this._onResize);\n\t}\n\n\tonInvalidation(changeInfo: ChangeInfo) {\n\t\tif (changeInfo.reason === \"childchange\" && changeInfo.child === this.itemsToOverflow[0]) {\n\t\t\tthis.onToolbarItemChange();\n\t\t}\n\t}\n\n\tonBeforeRendering() {\n\t\tthis.detachListeners();\n\t\tthis.attachListeners();\n\t}\n\n\tasync onAfterRendering() {\n\t\tawait renderFinished();\n\n\t\tthis.storeItemsWidth();\n\t\tthis.processOverflowLayout();\n\t\tthis.items.forEach(item => {\n\t\t\t item.isOverflowed = this.overflowItems.map(overflowItem => overflowItem).indexOf(item) !== -1;\n\t\t});\n\t}\n\n\t/\n\t Returns if the overflow popup is open.\n\t * @public\n\t /\n\tisOverflowOpen(): boolean {\n\t\tconst overflowPopover = this.getOverflowPopover();\n\t\treturn overflowPopover.open;\n\t}\n\n\topenOverflow(): void {\n\t\tconst overflowPopover = this.getOverflowPopover();\n\t\toverflowPopover.opener = this.overflowButtonDOM!;\n\t\toverflowPopover.open = true;\n\t\tthis.reverseOverflow = overflowPopover.actualPlacement === \"Top\";\n\t}\n\n\tcloseOverflow() {\n\t\tconst overflowPopover = this.getOverflowPopover();\n\t\toverflowPopover.open = false;\n\t}\n\n\ttoggleOverflow() {\n\t\tif (this.popoverOpen) {\n\t\t\tthis.closeOverflow();\n\t\t} else {\n\t\t\tthis.openOverflow();\n\t\t}\n\t}\n\n\tgetOverflowPopover(): Popover {\n\t\treturn this.shadowRoot!.querySelector<Popover>(\".ui5-overflow-popover\")!;\n\t}\n\n\t/\n\t Layout management\n\t /\n\n\tprocessOverflowLayout() {\n\t\tif (this.offsetWidth === 0) {\n\t\t\treturn;\n\t\t}\n\t\tconst containerWidth = this.offsetWidth - this.padding;\n\t\tconst contentWidth = this.itemsWidth;\n\t\tlet overflowSpace = contentWidth - containerWidth + this.overflowButtonSize;\n\n\t\tif (contentWidth <= containerWidth) {\n\t\t\toverflowSpace = 0;\n\t\t}\n\n\t\t// skip calculation if the width has not been changed or if the items width has not been changed\n\t\tif (this.width === containerWidth && this.contentWidth === contentWidth) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.distributeItems(overflowSpace);\n\t\tthis.width = containerWidth;\n\t\tthis.contentWidth = contentWidth;\n\t}\n\n\tstoreItemsWidth() {\n\t\tlet totalWidth = 0,\n\t\t\tminWidth = 0;\n\n\t\tthis.items.forEach((item: ToolbarItem) => {\n\t\t\tconst itemWidth = this.getItemWidth(item);\n\t\t\ttotalWidth += itemWidth;\n\t\t\tif (item.overflowPriority === ToolbarItemOverflowBehavior.NeverOverflow) {\n\t\t\t\tminWidth += itemWidth;\n\t\t\t}\n\t\t\tthis.ITEMS_WIDTH_MAP.set(item._id, itemWidth);\n\t\t});\n\n\t\tif (minWidth !== this.minContentWidth) {\n\t\t\tconst spaceAroundContent = this.offsetWidth - this.getDomRef()!.offsetWidth;\n\t\t\tthis.fireDecoratorEvent(\"_min-content-width-change\", {\n\t\t\t\tminWidth: minWidth + spaceAroundContent + this.overflowButtonSize,\n\t\t\t});\n\t\t}\n\n\t\tthis.itemsWidth = totalWidth;\n\t\tthis.minContentWidth = minWidth;\n\t}\n\n\tdistributeItems(overflowSpace = 0) {\n\t\tconst movableItems = this.movableItems.reverse();\n\t\tlet index = 0;\n\t\tlet currentItem = movableItems[index];\n\n\t\tthis.itemsToOverflow = [];\n\n\t\t// distribute items that always overflow\n\t\tthis.distributeItemsThatAlwaysOverflow();\n\n\t\twhile (overflowSpace > 0 && currentItem) {\n\t\t\tthis.itemsToOverflow.unshift(currentItem);\n\t\t\toverflowSpace -= this.getCachedItemWidth(currentItem?._id) \|\| 0;\n\t\t\tindex++;\n\t\t\tcurrentItem = movableItems[index];\n\t\t}\n\n\t\t// If the last bar item is a spacer, force it to the overflow even if there is enough space for it\n\t\tif (index < movableItems.length) {\n\t\t\tlet lastItem = movableItems[index];\n\t\t\twhile (index <= movableItems.length - 1 && lastItem.isSeparator) {\n\t\t\t\tthis.itemsToOverflow.unshift(lastItem);\n\t\t\t\tindex++;\n\t\t\t\tlastItem = movableItems[index];\n\t\t\t}\n\t\t}\n\n\t\tthis.setSeperatorsVisibilityInOverflow();\n\t}\n\n\tdistributeItemsThatAlwaysOverflow() {\n\t\tthis.alwaysOverflowItems.forEach((item: ToolbarItem) => {\n\t\t\tthis.itemsToOverflow.push(item);\n\t\t});\n\t}\n\n\tsetSeperatorsVisibilityInOverflow() {\n\t\tthis.itemsToOverflow.forEach((item, idx, items) => {\n\t\t\tif (item.isSeparator) {\n\t\t\t\t(item as ToolbarSeparator).visible = this.shouldShowSeparatorInOverflow(idx, items);\n\t\t\t}\n\t\t});\n\t}\n\n\tshouldShowSeparatorInOverflow(separatorIdx: number, overflowItems: Array<ToolbarItem>) {\n\t\tlet foundPrevNonSeparatorItem = false;\n\t\tlet foundNextNonSeperatorItem = false;\n\n\t\t// search for non-separator item before and after the seperator\n\t\toverflowItems.forEach((item, idx) => {\n\t\t\tif (idx < separatorIdx && !item.isSeparator) {\n\t\t\t\tfoundPrevNonSeparatorItem = true;\n\t\t\t}\n\t\t\tif (idx > separatorIdx && !item.isSeparator) {\n\t\t\t\tfoundNextNonSeperatorItem = true;\n\t\t\t}\n\t\t});\n\n\t\treturn foundPrevNonSeparatorItem && foundNextNonSeperatorItem;\n\t}\n\n\t/\n\t Event Handlers\n\t /\n\n\tonOverflowPopoverClosed() {\n\t\tthis.popoverOpen = false;\n\t}\n\n\tonBeforeClose(e: UI5CustomEvent<Popover, \"before-close\">) {\n\t\te.preventDefault();\n\t}\n\n\tonOverflowPopoverOpened() {\n\t\tthis.popoverOpen = true;\n\t}\n\n\tonResize() {\n\t\tif (!this.itemsWidth) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.closeOverflow();\n\t\tthis.processOverflowLayout();\n\t}\n\n\t/\n\t Private members\n\t */\n\n\tattachListeners() {\n\t\tthis.addEventListener(\"ui5-close-overflow\", this._onCloseOverflow);\n\t}\n\n\tdetachListeners() {\n\t\tthis.removeEventListener(\"ui5-close-overflow\", this._onCloseOverflow);\n\t}\n\n\tonToolbarItemChange() {\n\t\t// some items were updated reset the cache and trigger a re-render\n\t\tthis.itemsToOverflow = [];\n\t\tthis.contentWidth = 0; // re-render\n\t}\n\n\tgetItemWidth(item: ToolbarItem): number {\n\t\t// Spacer width - always 0 for flexible spacers, so that they shrink, otherwise - measure the width normally\n\t\tif (item.ignoreSpace \|\| item.isSeparator) {\n\t\t\treturn 0;\n\t\t}\n\t\tconst id: string = item._id;\n\t\t// Measure rendered width for spacers with width, and for normal items\n\t\tconst renderedItem = this.shadowRoot!.querySelector<HTMLElement>(`#${item.slot}`);\n\n\t\tlet itemWidth = 0;\n\n\t\tif (renderedItem && renderedItem.offsetWidth) {\n\t\t\tconst ItemCSSStyleSet = getComputedStyle(renderedItem);\n\t\t\titemWidth = renderedItem.offsetWidth + parsePxValue(ItemCSSStyleSet, \"margin-inline-end\")\n\t\t\t\t+ parsePxValue(ItemCSSStyleSet, \"margin-inline-start\");\n\t\t} else {\n\t\t\titemWidth = this.getCachedItemWidth(id) \|\| 0;\n\t\t}\n\n\t\treturn Math.ceil(itemWidth);\n\t}\n\n\tgetCachedItemWidth(id: string) {\n\t\treturn this.ITEMS_WIDTH_MAP.get(id);\n\t}\n}\n\nToolbar.define();\n\nexport default Toolbar;\nexport type {\n\tToolbarMinWidthChangeEventDetail,\n};\n"]}

package/dist/ToolbarButton.d.ts CHANGED Viewed

@@ -1,8 +1,6 @@
 import type { ButtonAccessibilityAttributes } from "./Button.js";
 import type ButtonDesign from "./types/ButtonDesign.js";
 import ToolbarItem from "./ToolbarItem.js";
-import ToolbarButtonTemplate from "./ToolbarButtonTemplate.js";
-import ToolbarPopoverButtonTemplate from "./ToolbarPopoverButtonTemplate.js";
 type ToolbarButtonAccessibilityAttributes = ButtonAccessibilityAttributes;
 /**
  * @class
@@ -109,20 +107,21 @@ declare class ToolbarButton extends ToolbarItem {
      * @public
      */
     width?: string;
-    /**
-     * Defines if the toolbar button is hidden.
-     * @private
-     * @default false
-     */
-    hidden: boolean;
     get styles(): {
         width: string | undefined;
         display: string;
     };
-    get containsText(): boolean;
-    static get toolbarTemplate(): typeof ToolbarButtonTemplate;
-    static get toolbarPopoverTemplate(): typeof ToolbarPopoverButtonTemplate;
     onClick(e: Event): void;
+    /**
+     * @override
+     */
+    get classes(): {
+        root: {
+            "ui5-tb-button": boolean;
+            "ui5-tb-popover-item": boolean;
+            "ui5-tb-item": boolean;
+        };
+    };
 }
 export default ToolbarButton;
 export type { ToolbarButtonAccessibilityAttributes, };

package/dist/ToolbarButton.js CHANGED Viewed

@@ -4,14 +4,12 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     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 jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js";
 import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
 import property from "@ui5/webcomponents-base/dist/decorators/property.js";
 import event from "@ui5/webcomponents-base/dist/decorators/event-strict.js";
 import ToolbarItem from "./ToolbarItem.js";
 import ToolbarButtonTemplate from "./ToolbarButtonTemplate.js";
-import ToolbarPopoverButtonTemplate from "./ToolbarPopoverButtonTemplate.js";
-import ToolbarButtonPopoverCss from "./generated/themes/ToolbarButtonPopover.css.js";
-import { registerToolbarItem } from "./ToolbarRegistry.js";
 /**
  * @class
  *
@@ -62,12 +60,6 @@ let ToolbarButton = class ToolbarButton extends ToolbarItem {
          * @public
          */
         this.accessibilityAttributes = {};
-        /**
-         * Defines if the toolbar button is hidden.
-         * @private
-         * @default false
-         */
-        this.hidden = false;
     }
     get styles() {
         return {
@@ -75,15 +67,6 @@ let ToolbarButton = class ToolbarButton extends ToolbarItem {
             display: this.hidden ? "none" : "inline-block",
         };
     }
-    get containsText() {
-        return true;
-    }
-    static get toolbarTemplate() {
-        return ToolbarButtonTemplate;
-    }
-    static get toolbarPopoverTemplate() {
-        return ToolbarPopoverButtonTemplate;
-    }
     onClick(e) {
         e.stopImmediatePropagation();
         const prevented = !this.fireDecoratorEvent("click", { targetRef: e.target });
@@ -91,6 +74,17 @@ let ToolbarButton = class ToolbarButton extends ToolbarItem {
             this.fireDecoratorEvent("close-overflow");
         }
     }
+    /**
+     * @override
+     */
+    get classes() {
+        return {
+            root: {
+                ...super.classes.root,
+                "ui5-tb-button": true,
+            },
+        };
+    }
 };
 __decorate([
     property({ type: Boolean })
@@ -122,13 +116,11 @@ __decorate([
 __decorate([
     property()
 ], ToolbarButton.prototype, "width", void 0);
-__decorate([
-    property({ type: Boolean })
-], ToolbarButton.prototype, "hidden", void 0);
 ToolbarButton = __decorate([
     customElement({
         tag: "ui5-toolbar-button",
-        styles: ToolbarButtonPopoverCss,
+        template: ToolbarButtonTemplate,
+        renderer: jsxRenderer,
     })
     /**
      * Fired when the component is activated either with a
@@ -144,7 +136,6 @@ ToolbarButton = __decorate([
         cancelable: true,
     })
 ], ToolbarButton);
-registerToolbarItem(ToolbarButton);
 ToolbarButton.define();
 export default ToolbarButton;
 //# sourceMappingURL=ToolbarButton.js.map

package/dist/ToolbarButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ToolbarButton.js","sourceRoot":"","sources":["../src/ToolbarButton.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,KAAK,MAAM,yDAAyD,CAAC;AAI5E,OAAO,WAAW,MAAM,kBAAkB,CAAC;AAC3C,OAAO,qBAAqB,MAAM,4BAA4B,CAAC;~~AAC~~/D~~,OAAO,4BAA4B,MAAM,mCAAmC,CAAC;AAE7E,OAAO,uBAAuB,MAAM,gDAAgD,CAAC;AAErF,OAAO,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAI3D~~;;;;;;;;;;;;;;GAcG;~~AAkBH~~,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,WAAW;IAAvC;;QACC;;;;;;WAMG;QAEH,aAAQ,GAAG,KAAK,CAAC;QAEjB;;;;WAIG;QAEH,WAAM,GAAsB,SAAS,CAAC;QAuDtC;;;;;;;;;;;;;;;;WAgBG;QAEH,4BAAuB,GAAyC,EAAE,CAAC;~~QAoBnE;;;;WAIM;QAEN~~,~~WAAM,GAAG,KAAK,~~CAAC;~~IA4BhB,CAAC;~~IA1BA,IAAI,MAAM;QACT,OAAO;YACN,KAAK,EAAE,IAAI,CAAC,KAAK;YACjB,OAAO,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,cAAc;SAC9C,CAAC;IACH,CAAC;IAED,~~IAAI,YAAY;QACf,~~OAAO,~~IAAI,~~CAAC~~;IACb~~,~~CAAC;IAED,MAAM,KAAK,eAAe;QACzB,OAAO,qBAAqB,CAAC;IAC9B,CAAC;IAED,MAAM,KAAK,sBAAsB;QAChC,OAAO,4BAA4B,CAAC;IACrC,CAAC;IAED,OAAO,CAAC,~~CAAQ;QACf,CAAC,CAAC,wBAAwB,EAAE,CAAC;QAC7B,MAAM,SAAS,GAAG,CAAC,IAAI,CAAC,kBAAkB,CAAC,OAAO,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC,MAAqB,EAAE,CAAC,CAAC;QAC5F,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,sBAAsB,EAAE,CAAC;YAChD,IAAI,CAAC,kBAAkB,CAAC,gBAAgB,CAAC,CAAC;QAC3C,CAAC;IACF,CAAC;CACD,CAAA;~~AAvIA~~;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;+CACX;AAQjB;IADC,QAAQ,EAAE;6CAC2B;AAWtC;IADC,QAAQ,EAAE;2CACE;AAgBb;IADC,QAAQ,EAAE;8CACM;AAUjB;IADC,QAAQ,EAAE;8CACK;AAQhB;IADC,QAAQ,EAAE;qDACa;AAQxB;IADC,QAAQ,EAAE;wDACgB;AAoB3B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8DACwC;AAQnE;IADC,QAAQ,EAAE;2CACG;AAUd;IADC,QAAQ,EAAE;4CACI;~~AAQf;IADC~~,~~QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;6CACb;AApHV,~~aAAa;~~IAjBlB~~,aAAa,CAAC;QACd,GAAG,EAAE,oBAAoB;QACzB,~~MAAM~~,EAAE,~~uBAAuB~~;~~KAC~~/B,CAAC;IAEF;;;;;;;OAOG;;IACF,KAAK,CAAC,OAAO,EAAE;QACf,OAAO,EAAE,IAAI;QACb,UAAU,EAAE,IAAI;KAChB,CAAC;GACI,aAAa,~~CAgJlB~~;AAED,~~mBAAmB,CAAC,~~aAAa,CAAC,~~CAAC;AAEnC,aAAa,CAAC,~~MAAM,EAAE,CAAC;AAEvB,eAAe,aAAa,CAAC","sourcesContent":["import customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport type { ButtonAccessibilityAttributes } from \"./Button.js\";\nimport type ButtonDesign from \"./types/ButtonDesign.js\";\n\nimport ToolbarItem from \"./ToolbarItem.js\";\nimport ToolbarButtonTemplate from \"./ToolbarButtonTemplate.js\";\~~nimport ToolbarPopoverButtonTemplate from \"./ToolbarPopoverButtonTemplate.js\";\~~n\~~nimport ToolbarButtonPopoverCss from \"./generated/themes/ToolbarButtonPopover.css.js\";\n\nimport { registerToolbarItem } from \"./ToolbarRegistry.js\";\n\~~ntype ToolbarButtonAccessibilityAttributes = ButtonAccessibilityAttributes;\n\n/*\n @class\n \n ### Overview\n * The `ui5-toolbar-button` represents an abstract action,\n * used in the `ui5-toolbar`.\n \n ### ES6 Module Import\n * `import \"@ui5/webcomponents/dist/ToolbarButton.js\";`\n * @constructor\n * @abstract\n * @extends ToolbarItem\n * @public\n * @since 1.17.0\n /\n@customElement({\n\ttag: \"ui5-toolbar-button\",\n\~~tstyles~~: ~~ToolbarButtonPopoverCss~~,\n})\n\n/\n Fired when the component is activated either with a\n * mouse/tap or by using the Enter or Space key.\n \n Note: The event will not be fired if the `disabled`\n * property is set to `true`.\n * @public\n /\n@event(\"click\", {\n\tbubbles: true,\n\tcancelable: true,\n})\nclass ToolbarButton extends ToolbarItem {\n\t/\n\t Defines if the action is disabled.\n\t \n\t Note: a disabled action can't be pressed or focused, and it is not in the tab chain.\n\t * @default false\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\tdisabled = false;\n\n\t/\n\t Defines the action design.\n\t * @default \"Default\"\n\t * @public\n\t /\n\t@property()\n\tdesign: `${ButtonDesign}` = \"Default\";\n\n\t/\n\t Defines the `icon` source URI.\n\t \n\t Note: SAP-icons font provides numerous buil-in icons. To find all the available icons, see the\n\t * [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\ticon?: string\n\n\t/\n\t Defines the icon, displayed as graphical element within the component after the button text.\n\t \n\t Note: It is highly recommended to use `endIcon` property only together with `icon` and/or `text` properties.\n\t * Usage of `endIcon` only should be avoided.\n\t \n\t The SAP-icons font provides numerous options.\n\t \n\t Example:\n\t * See all the available icons within the [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\tendIcon?: string;\n\n\t/\n\t Defines the tooltip of the component.\n\t \n\t Note: A tooltip attribute should be provided for icon-only buttons, in order to represent their exact meaning/function.\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\ttooltip?: string\n\n\t/\n\t Defines the accessible ARIA name of the component.\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\taccessibleName?: string;\n\n\t/\n\t Receives id(or many ids) of the elements that label the component.\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\taccessibleNameRef?: string;\n\n\t/\n\t Defines the additional accessibility attributes that will be applied to the component.\n\t \n\t The following fields are supported:\n\t \n\t - expanded: Indicates whether the button, or another grouping element it controls, is currently expanded or collapsed.\n\t * Accepts the following string values: `true` or `false`\n\t \n\t - hasPopup: Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by the button.\n\t * Accepts the following string values: `dialog`, `grid`, `listbox`, `menu` or `tree`.\n\t \n\t - controls: Identifies the element (or elements) whose contents or presence are controlled by the button element.\n\t * Accepts a lowercase string value.\n\t \n\t @default {}\n\t * @public\n\t /\n\t@property({ type: Object })\n\taccessibilityAttributes: ToolbarButtonAccessibilityAttributes = {};\n\n\t/\n\t Button text\n\t * @public\n\t * @default undefined\n\t /\n\t@property()\n\ttext?: string;\n\n\t/\n\t Defines the width of the button.\n\t \n\t Note: all CSS sizes are supported - 'percentage', 'px', 'rem', 'auto', etc.\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\twidth?: string;\n\n\~~t/\n Defines if the toolbar button is hidden.\n * @private\n * @default false\n */\n\t@property({ type: Boolean })\n\thidden = false;\n\n\~~tget styles() {\n\t\treturn {\n\t\t\twidth: this.width,\n\t\t\tdisplay: this.hidden ? \"none\" : \"inline-block\",\n\t\t};\n\t}\n\n\tget containsText() {\n\t\treturn true;\n\t}\n\n\tstatic get toolbarTemplate() {\n\t\treturn ToolbarButtonTemplate;\n\t}\n\n\tstatic get toolbarPopoverTemplate() {\n\t\treturn ToolbarPopoverButtonTemplate;\n\t}\n\n\tonClick(e: Event) {\n\t\te.stopImmediatePropagation();\n\t\tconst prevented = !this.fireDecoratorEvent(\"click\", { targetRef: e.target as HTMLElement });\n\t\tif (!prevented && !this.preventOverflowClosing) {\n\t\t\tthis.fireDecoratorEvent(\"close-overflow\");\n\t\t}\n\t}\n}\n\~~nregisterToolbarItem~~(~~ToolbarButton~~);\n\nToolbarButton.define();\n\nexport default ToolbarButton;\n\nexport type {\n\tToolbarButtonAccessibilityAttributes,\n};\n"]}
1	+ {"version":3,"file":"ToolbarButton.js","sourceRoot":"","sources":["../src/ToolbarButton.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,WAAW,MAAM,sDAAsD,CAAC;AAC/E,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,KAAK,MAAM,yDAAyD,CAAC;AAI5E,OAAO,WAAW,MAAM,kBAAkB,CAAC;AAC3C,OAAO,qBAAqB,MAAM,4BAA4B,CAAC;AAI/D;;;;;;;;;;;;;;GAcG;AAmBH,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,WAAW;IAAvC;;QACC;;;;;;WAMG;QAEH,aAAQ,GAAG,KAAK,CAAC;QAEjB;;;;WAIG;QAEH,WAAM,GAAsB,SAAS,CAAC;QAuDtC;;;;;;;;;;;;;;;;WAgBG;QAEH,4BAAuB,GAAyC,EAAE,CAAC;IA8CpE,CAAC;IA1BA,IAAI,MAAM;QACT,OAAO;YACN,KAAK,EAAE,IAAI,CAAC,KAAK;YACjB,OAAO,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,cAAc;SAC9C,CAAC;IACH,CAAC;IAED,OAAO,CAAC,CAAQ;QACf,CAAC,CAAC,wBAAwB,EAAE,CAAC;QAC7B,MAAM,SAAS,GAAG,CAAC,IAAI,CAAC,kBAAkB,CAAC,OAAO,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC,MAAqB,EAAE,CAAC,CAAC;QAC5F,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,sBAAsB,EAAE,CAAC;YAChD,IAAI,CAAC,kBAAkB,CAAC,gBAAgB,CAAC,CAAC;QAC3C,CAAC;IACF,CAAC;IAED;;OAEG;IACH,IAAI,OAAO;QACV,OAAO;YACN,IAAI,EAAE;gBACL,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI;gBACrB,eAAe,EAAE,IAAI;aACrB;SACD,CAAC;IACH,CAAC;CACD,CAAA;AA/HA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;+CACX;AAQjB;IADC,QAAQ,EAAE;6CAC2B;AAWtC;IADC,QAAQ,EAAE;2CACE;AAgBb;IADC,QAAQ,EAAE;8CACM;AAUjB;IADC,QAAQ,EAAE;8CACK;AAQhB;IADC,QAAQ,EAAE;qDACa;AAQxB;IADC,QAAQ,EAAE;wDACgB;AAoB3B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8DACwC;AAQnE;IADC,QAAQ,EAAE;2CACG;AAUd;IADC,QAAQ,EAAE;4CACI;AA5GV,aAAa;IAlBlB,aAAa,CAAC;QACd,GAAG,EAAE,oBAAoB;QACzB,QAAQ,EAAE,qBAAqB;QAC/B,QAAQ,EAAE,WAAW;KACrB,CAAC;IAEF;;;;;;;OAOG;;IACF,KAAK,CAAC,OAAO,EAAE;QACf,OAAO,EAAE,IAAI;QACb,UAAU,EAAE,IAAI;KAChB,CAAC;GACI,aAAa,CAwIlB;AAED,aAAa,CAAC,MAAM,EAAE,CAAC;AAEvB,eAAe,aAAa,CAAC","sourcesContent":["import jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport type { ButtonAccessibilityAttributes } from \"./Button.js\";\nimport type ButtonDesign from \"./types/ButtonDesign.js\";\n\nimport ToolbarItem from \"./ToolbarItem.js\";\nimport ToolbarButtonTemplate from \"./ToolbarButtonTemplate.js\";\n\ntype ToolbarButtonAccessibilityAttributes = ButtonAccessibilityAttributes;\n\n/*\n @class\n \n ### Overview\n * The `ui5-toolbar-button` represents an abstract action,\n * used in the `ui5-toolbar`.\n \n ### ES6 Module Import\n * `import \"@ui5/webcomponents/dist/ToolbarButton.js\";`\n * @constructor\n * @abstract\n * @extends ToolbarItem\n * @public\n * @since 1.17.0\n /\n@customElement({\n\ttag: \"ui5-toolbar-button\",\n\ttemplate: ToolbarButtonTemplate,\n\trenderer: jsxRenderer,\n})\n\n/\n Fired when the component is activated either with a\n * mouse/tap or by using the Enter or Space key.\n \n Note: The event will not be fired if the `disabled`\n * property is set to `true`.\n * @public\n /\n@event(\"click\", {\n\tbubbles: true,\n\tcancelable: true,\n})\nclass ToolbarButton extends ToolbarItem {\n\t/\n\t Defines if the action is disabled.\n\t \n\t Note: a disabled action can't be pressed or focused, and it is not in the tab chain.\n\t * @default false\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\tdisabled = false;\n\n\t/\n\t Defines the action design.\n\t * @default \"Default\"\n\t * @public\n\t /\n\t@property()\n\tdesign: `${ButtonDesign}` = \"Default\";\n\n\t/\n\t Defines the `icon` source URI.\n\t \n\t Note: SAP-icons font provides numerous buil-in icons. To find all the available icons, see the\n\t * [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\ticon?: string\n\n\t/\n\t Defines the icon, displayed as graphical element within the component after the button text.\n\t \n\t Note: It is highly recommended to use `endIcon` property only together with `icon` and/or `text` properties.\n\t * Usage of `endIcon` only should be avoided.\n\t \n\t The SAP-icons font provides numerous options.\n\t \n\t Example:\n\t * See all the available icons within the [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\tendIcon?: string;\n\n\t/\n\t Defines the tooltip of the component.\n\t \n\t Note: A tooltip attribute should be provided for icon-only buttons, in order to represent their exact meaning/function.\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\ttooltip?: string\n\n\t/\n\t Defines the accessible ARIA name of the component.\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\taccessibleName?: string;\n\n\t/\n\t Receives id(or many ids) of the elements that label the component.\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\taccessibleNameRef?: string;\n\n\t/\n\t Defines the additional accessibility attributes that will be applied to the component.\n\t \n\t The following fields are supported:\n\t \n\t - expanded: Indicates whether the button, or another grouping element it controls, is currently expanded or collapsed.\n\t * Accepts the following string values: `true` or `false`\n\t \n\t - hasPopup: Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by the button.\n\t * Accepts the following string values: `dialog`, `grid`, `listbox`, `menu` or `tree`.\n\t \n\t - controls: Identifies the element (or elements) whose contents or presence are controlled by the button element.\n\t * Accepts a lowercase string value.\n\t \n\t @default {}\n\t * @public\n\t /\n\t@property({ type: Object })\n\taccessibilityAttributes: ToolbarButtonAccessibilityAttributes = {};\n\n\t/\n\t Button text\n\t * @public\n\t * @default undefined\n\t /\n\t@property()\n\ttext?: string;\n\n\t/\n\t Defines the width of the button.\n\t \n\t Note: all CSS sizes are supported - 'percentage', 'px', 'rem', 'auto', etc.\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\twidth?: string;\n\n\tget styles() {\n\t\treturn {\n\t\t\twidth: this.width,\n\t\t\tdisplay: this.hidden ? \"none\" : \"inline-block\",\n\t\t};\n\t}\n\n\tonClick(e: Event) {\n\t\te.stopImmediatePropagation();\n\t\tconst prevented = !this.fireDecoratorEvent(\"click\", { targetRef: e.target as HTMLElement });\n\t\tif (!prevented && !this.preventOverflowClosing) {\n\t\t\tthis.fireDecoratorEvent(\"close-overflow\");\n\t\t}\n\t}\n\n\t/\n\t @override\n\t */\n\tget classes() {\n\t\treturn {\n\t\t\troot: {\n\t\t\t\t...super.classes.root,\n\t\t\t\t\"ui5-tb-button\": true,\n\t\t\t},\n\t\t};\n\t}\n}\n\nToolbarButton.define();\n\nexport default ToolbarButton;\n\nexport type {\n\tToolbarButtonAccessibilityAttributes,\n};\n"]}

package/dist/ToolbarButtonTemplate.js CHANGED Viewed

@@ -1,9 +1,8 @@
 import { jsx as _jsx } from "@ui5/webcomponents-base/jsx-runtime";
 import Button from "./Button.js";
 export default function ToolbarButtonTemplate() {
-    return (_jsx(Button, { class: "ui5-tb-button ui5-tb-item", id: this.id, style: {
-            width: this.width,
-            display: this.hidden ? "none" : "inline-block",
+    return (_jsx(Button, { class: this.classes.root, id: this.id, style: {
+            width: this.width || "100%",
         }, icon: this.icon, endIcon: this.endIcon, tooltip: this.tooltip, accessibleName: this.accessibleName, accessibleNameRef: this.accessibleNameRef, accessibilityAttributes: this.accessibilityAttributes, design: this.design, disabled: this.disabled, hidden: this.hidden, "data-ui5-external-action-item-id": this._id, "data-ui5-stable": this.stableDomRef, onClick: (...args) => this.onClick(...args), children: this.text }));
 }
 //# sourceMappingURL=ToolbarButtonTemplate.js.map

package/dist/ToolbarButtonTemplate.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ToolbarButtonTemplate.js","sourceRoot":"","sources":["../src/ToolbarButtonTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,MAAM,CAAC,OAAO,UAAU,qBAAqB;IAC5C,OAAO,CACN,KAAC,MAAM,IACN,KAAK,~~EAAC~~,~~2BAA2B~~,~~EACjC~~,EAAE,EAAE,IAAI,CAAC,EAAE,EACX,KAAK,EAAE;YACN,KAAK,EAAE,IAAI,CAAC,KAAK~~;YACjB~~,~~OAAO,EAAE,~~IAAI,~~CAAC,~~MAAM~~,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,cAAc~~;~~SAC9C~~,EACD,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,cAAc,EAAE,IAAI,CAAC,cAAc,EACnC,iBAAiB,EAAE,IAAI,CAAC,iBAAiB,EACzC,uBAAuB,EAAE,IAAI,CAAC,uBAAuB,EACrD,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,MAAM,EAAE,IAAI,CAAC,MAAM,sCACe,IAAI,CAAC,GAAG,qBACzB,IAAI,CAAC,YAAY,EAClC,OAAO,EAAE,CAAC,GAAG,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,GAAG,IAAI,CAAC,YAE1C,IAAI,CAAC,IAAI,GACF,CACT,CAAC;AACH,CAAC","sourcesContent":["import type ToolbarButton from \"./ToolbarButton.js\";\nimport Button from \"./Button.js\";\n\nexport default function ToolbarButtonTemplate(this: ToolbarButton) {\n\treturn (\n\t\t<Button\n\t\t\tclass~~=\"ui5-tb-button ui5-tb-item~~\"\n\t\t\tid={this.id}\n\t\t\tstyle={{\n\t\t\t\twidth: this.width~~,\n\t\t\t\tdisplay:~~ ~~this.hidden~~ ? \"~~none\~~" ~~: \"inline-block\"~~,\n\t\t\t}}\n\t\t\ticon={this.icon}\n\t\t\tendIcon={this.endIcon}\n\t\t\ttooltip={this.tooltip}\n\t\t\taccessibleName={this.accessibleName}\n\t\t\taccessibleNameRef={this.accessibleNameRef}\n\t\t\taccessibilityAttributes={this.accessibilityAttributes}\n\t\t\tdesign={this.design}\n\t\t\tdisabled={this.disabled}\n\t\t\thidden={this.hidden}\n\t\t\tdata-ui5-external-action-item-id={this._id}\n\t\t\tdata-ui5-stable={this.stableDomRef}\n\t\t\tonClick={(...args) => this.onClick(...args)}\n\t\t>\n\t\t\t{this.text}\n\t\t</Button>\n\t);\n}\n"]}
1	+ {"version":3,"file":"ToolbarButtonTemplate.js","sourceRoot":"","sources":["../src/ToolbarButtonTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,MAAM,CAAC,OAAO,UAAU,qBAAqB;IAC5C,OAAO,CACN,KAAC,MAAM,IACN,KAAK,EAAE,IAAI,CAAC,OAAO,CAAC,IAAI,EACxB,EAAE,EAAE,IAAI,CAAC,EAAE,EACX,KAAK,EAAE;YACN,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,MAAM;SAC3B,EACD,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,cAAc,EAAE,IAAI,CAAC,cAAc,EACnC,iBAAiB,EAAE,IAAI,CAAC,iBAAiB,EACzC,uBAAuB,EAAE,IAAI,CAAC,uBAAuB,EACrD,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,MAAM,EAAE,IAAI,CAAC,MAAM,sCACe,IAAI,CAAC,GAAG,qBACzB,IAAI,CAAC,YAAY,EAClC,OAAO,EAAE,CAAC,GAAG,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,GAAG,IAAI,CAAC,YAE1C,IAAI,CAAC,IAAI,GACF,CACT,CAAC;AACH,CAAC","sourcesContent":["import type ToolbarButton from \"./ToolbarButton.js\";\nimport Button from \"./Button.js\";\n\nexport default function ToolbarButtonTemplate(this: ToolbarButton) {\n\treturn (\n\t\t<Button\n\t\t\tclass={this.classes.root}\n\t\t\tid={this.id}\n\t\t\tstyle={{\n\t\t\t\twidth: this.width \|\| \"100%\",\n\t\t\t}}\n\t\t\ticon={this.icon}\n\t\t\tendIcon={this.endIcon}\n\t\t\ttooltip={this.tooltip}\n\t\t\taccessibleName={this.accessibleName}\n\t\t\taccessibleNameRef={this.accessibleNameRef}\n\t\t\taccessibilityAttributes={this.accessibilityAttributes}\n\t\t\tdesign={this.design}\n\t\t\tdisabled={this.disabled}\n\t\t\thidden={this.hidden}\n\t\t\tdata-ui5-external-action-item-id={this._id}\n\t\t\tdata-ui5-stable={this.stableDomRef}\n\t\t\tonClick={(...args) => this.onClick(...args)}\n\t\t>\n\t\t\t{this.text}\n\t\t</Button>\n\t);\n}\n"]}

package/dist/ToolbarItem.d.ts CHANGED Viewed

@@ -1,5 +1,4 @@
 import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-import type { TemplateFunction } from "@ui5/webcomponents-base/dist/renderer/executeTemplate.js";
 import type ToolbarItemOverflowBehavior from "./types/ToolbarItemOverflowBehavior.js";
 type IEventOptions = {
     preventClosing: boolean;
@@ -26,17 +25,18 @@ declare class ToolbarItem extends UI5Element {
      * @public
      */
     preventOverflowClosing: boolean;
+    /**
+     * Defines if the toolbar item is overflowed.
+     * @default false
+     * @protected
+     * @since 2.11.0
+     */
+    isOverflowed: boolean;
     /**
     * Defines if the width of the item should be ignored in calculating the whole width of the toolbar
     * @protected
     */
     get ignoreSpace(): boolean;
-    /**
-     * Returns if the item contains text. Used to position the text properly inside the popover.
-     * Aligned left if the item has text, default aligned otherwise.
-     * @protected
-     */
-    get containsText(): boolean;
     /**
      * Returns if the item is flexible. An item that is returning true for this property will make
      * the toolbar expand to fill the 100% width of its container.
@@ -55,17 +55,13 @@ declare class ToolbarItem extends UI5Element {
      * @protected
      */
     get isSeparator(): boolean;
-    /**
-     * Returns the template for the toolbar item.
-     * @protected
-     */
-    static get toolbarTemplate(): TemplateFunction;
-    /**
-     * Returns the template for the toolbar item popover.
-     * @protected
-     */
-    static get toolbarPopoverTemplate(): TemplateFunction;
     get stableDomRef(): string;
+    get classes(): {
+        root: {
+            "ui5-tb-popover-item": boolean;
+            "ui5-tb-item": boolean;
+        };
+    };
 }
 export type { IEventOptions, ToolbarItemEventDetail, };
 export default ToolbarItem;

package/dist/ToolbarItem.js CHANGED Viewed

@@ -35,6 +35,13 @@ class ToolbarItem extends UI5Element {
          * @public
          */
         this.preventOverflowClosing = false;
+        /**
+         * Defines if the toolbar item is overflowed.
+         * @default false
+         * @protected
+         * @since 2.11.0
+         */
+        this.isOverflowed = false;
     }
     /**
     * Defines if the width of the item should be ignored in calculating the whole width of the toolbar
@@ -43,14 +50,6 @@ class ToolbarItem extends UI5Element {
     get ignoreSpace() {
         return false;
     }
-    /**
-     * Returns if the item contains text. Used to position the text properly inside the popover.
-     * Aligned left if the item has text, default aligned otherwise.
-     * @protected
-     */
-    get containsText() {
-        return false;
-    }
     /**
      * Returns if the item is flexible. An item that is returning true for this property will make
      * the toolbar expand to fill the 100% width of its container.
@@ -75,23 +74,17 @@ class ToolbarItem extends UI5Element {
     get isSeparator() {
         return false;
     }
-    /**
-     * Returns the template for the toolbar item.
-     * @protected
-     */
-    static get toolbarTemplate() {
-        throw new Error("Template must be defined");
-    }
-    /**
-     * Returns the template for the toolbar item popover.
-     * @protected
-     */
-    static get toolbarPopoverTemplate() {
-        throw new Error("Popover template must be defined");
-    }
     get stableDomRef() {
         return this.getAttribute("stable-dom-ref") || `${this._id}-stable-dom-ref`;
     }
+    get classes() {
+        return {
+            root: {
+                "ui5-tb-popover-item": this.isOverflowed,
+                "ui5-tb-item": true,
+            },
+        };
+    }
 };
 __decorate([
     property()
@@ -99,6 +92,9 @@ __decorate([
 __decorate([
     property({ type: Boolean })
 ], ToolbarItem.prototype, "preventOverflowClosing", void 0);
+__decorate([
+    property({ type: Boolean })
+], ToolbarItem.prototype, "isOverflowed", void 0);
 ToolbarItem = __decorate([
     event("close-overflow", {
         bubbles: true,

package/dist/ToolbarItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ToolbarItem.js","sourceRoot":"","sources":["../src/ToolbarItem.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,UAAU,MAAM,4CAA4C,CAAC;~~AAEpE~~,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,KAAK,MAAM,yDAAyD,CAAC;AA0B5E,IAAM,WAAW;AAVjB;;;;;;;;;GASG;AACH,MAAM,WAAY,SAAQ,UAAU;IAApC;;QAMC;;;;;WAKG;QAEH,qBAAgB,GAAqC,SAAS,CAAC;QAE/D;;;;;WAKG;QAEH,2BAAsB,GAAG,KAAK,CAAC;~~IAiEhC,CAAC;IA~~/~~DA;;;MAGE~~;~~IACF~~,~~IAAI~~,~~WAAW;QACd~~,~~OAAO,~~KAAK,CAAC;~~IACd~~,CAAC;~~IAED;;;;OAIG~~;~~IACH~~,IAAI,~~YAAY~~;~~QACf~~,OAAO,KAAK,CAAC;IACd,CAAC;IAED;;;;OAIG;IACH,IAAI,gBAAgB;QACnB,OAAO,KAAK,CAAC;IACd,CAAC;IAED;;;;;OAKG;IACH,IAAI,aAAa;QAChB,OAAO,IAAI,CAAC;IACb,CAAC;IAED;;;OAGG;IACH,IAAI,WAAW;QACd,OAAO,KAAK,CAAC;IACd,CAAC;IAED~~;;;OAGG;IACH~~,~~MAAM~~,~~KAAK,eAAe~~;~~QACzB~~,~~MAAM~~,IAAI,~~KAAK,~~CAAC,~~0BAA0B~~,CAAC,~~CAAC;IAC7C~~,CAAC~~;IAED;;;OAGG;IACH~~,~~MAAM~~,~~KAAK~~,~~sBAAsB;QAChC,MAAM,~~IAAI,~~KAAK,~~CAAC,~~kCAAkC~~,~~CAAC~~,CAAC;~~IACrD~~,CAAC;IAED,IAAI,~~YAAY~~;~~QACf~~,OAAO,IAAI,~~CAAC~~,~~YAAY~~,~~CAAC~~,~~gBAAgB~~,CAAC,~~IAAI~~,~~GAAG~~,IAAI,CAAC~~,GAAG,iBAAiB,CAAC~~;~~IAC5E~~,CAAC;CACD,CAAA;~~AA1EA~~;IADC,QAAQ,EAAE;qDACoD;AAS/D;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;2DACG;~~AAtB1B~~,WAAW;IAdhB,KAAK,CAAC,gBAAgB,EAAE;QACxB,OAAO,EAAE,IAAI;KACb,CAAC;IAEF;;;;;;;;;OASG;GACG,WAAW,~~CAuFhB~~;AAMD,eAAe,WAAW,CAAC","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport ~~type { TemplateFunction } from \"@ui5/webcomponents-base/dist/renderer/executeTemplate.js\";\nimport~~ property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\n\nimport type ToolbarItemOverflowBehavior from \"./types/ToolbarItemOverflowBehavior.js\";\n\ntype IEventOptions = {\n\tpreventClosing: boolean;\n}\n\ntype ToolbarItemEventDetail = {\n\ttargetRef: HTMLElement;\n}\n\n@event(\"close-overflow\", {\n\tbubbles: true,\n})\n\n/*\n @class\n \n Represents an abstract class for items, used in the `ui5-toolbar`.\n * @constructor\n * @extends UI5Element\n * @abstract\n * @public\n * @since 1.17.0\n /\nclass ToolbarItem extends UI5Element {\n\t// strictEvents: needed for parent class\n\teventDetails!: {\n\t\tclick: ToolbarItemEventDetail,\n\t\t\"close-overflow\": void;\n\t}\n\t/\n\t Property used to define the access of the item to the overflow Popover. If \"NeverOverflow\" option is set,\n\t * the item never goes in the Popover, if \"AlwaysOverflow\" - it never comes out of it.\n\t * @public\n\t * @default \"Default\"\n\t /\n\t@property()\n\toverflowPriority: `${ToolbarItemOverflowBehavior}` = \"Default\";\n\n\t/\n\t Defines if the toolbar overflow popup should close upon intereaction with the item.\n\t * It will close by default.\n\t * @default false\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\tpreventOverflowClosing = false;\n\n\t/\n\t Defines if the ~~width~~ ~~of the~~ item ~~should~~ be ~~ignored~~ in ~~calculating~~ ~~the~~ ~~whole width of the toolbar~~\n\t* @~~protected~~\n\t/\n\~~tget~~ ~~ignoreSpace()~~: ~~boolean~~ {\n\~~t\treturn~~ false;\n\~~t}\~~n\n\t/\n\t ~~Returns~~ if the ~~item~~ ~~contains~~ ~~text.~~ ~~Used~~ to ~~position~~ ~~the~~ ~~text~~ ~~properly~~ ~~inside~~ the ~~popover.\n\t~~ * ~~Aligned~~ ~~left if~~ the ~~item has text, default aligned otherwise.\~~n\t * @protected\n\t /\n\tget ~~containsText~~(): boolean {\n\t\treturn false;\n\t}\n\n\t/\n\t Returns if the item is flexible. An item that is returning true for this property will make\n\t * the toolbar expand to fill the 100% width of its container.\n\t * @protected\n\t /\n\tget hasFlexibleWidth(): boolean {\n\t\treturn false;\n\t}\n\n\t/\n\t Returns if the item is interactive.\n\t * This value is used to determinate if the toolbar should have its accessibility role and attributes set.\n\t * At least two interactive items are needed for the toolbar to have the role=\"toolbar\" attribute set.\n\t * @protected\n\t /\n\tget isInteractive(): boolean {\n\t\treturn true;\n\t}\n\n\t/\n\t Returns if the item is separator.\n\t * @protected\n\t /\n\tget isSeparator() {\n\t\treturn false;\n\t}\n\n\~~t/\n\t~~ Returns the template for the toolbar item.\n\t * @protected\n\t /\n\tstatic get toolbarTemplate(): ~~TemplateFunction~~ {\n\t\~~tthrow~~ ~~new Error~~(\"~~Template must be defined~~\");\n\t}\n\n\~~t/\n\t~~ ~~Returns the template for the toolbar item popover.\~~n\t * @protected\n\t */\n\~~tstatic get toolbarPopoverTemplate()~~: ~~TemplateFunction~~ {\n\t\~~tthrow new Error(~~\"~~Popover template must be defined~~\"~~);\~~n\t}\n\n\~~tget stableDomRef() {\n\~~t\~~treturn this.getAttribute(\~~"~~stable~~-~~dom~~-~~ref~~\") ~~\|\| `${this._id~~}~~-stable-dom-ref`;\~~n\t}\n}\n\nexport type {\n\tIEventOptions,\n\tToolbarItemEventDetail,\n};\nexport default ToolbarItem;\n"]}
1	+ {"version":3,"file":"ToolbarItem.js","sourceRoot":"","sources":["../src/ToolbarItem.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,UAAU,MAAM,4CAA4C,CAAC;AACpE,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,KAAK,MAAM,yDAAyD,CAAC;AA0B5E,IAAM,WAAW;AAVjB;;;;;;;;;GASG;AACH,MAAM,WAAY,SAAQ,UAAU;IAApC;;QAMC;;;;;WAKG;QAEH,qBAAgB,GAAqC,SAAS,CAAC;QAE/D;;;;;WAKG;QAEH,2BAAsB,GAAG,KAAK,CAAC;QAE/B;;;;;WAKG;QAGH,iBAAY,GAAY,KAAK,CAAC;IAiD/B,CAAC;IA/CA;;;MAGE;IACF,IAAI,WAAW;QACd,OAAO,KAAK,CAAC;IACd,CAAC;IAED;;;;OAIG;IACH,IAAI,gBAAgB;QACnB,OAAO,KAAK,CAAC;IACd,CAAC;IAED;;;;;OAKG;IACH,IAAI,aAAa;QAChB,OAAO,IAAI,CAAC;IACb,CAAC;IAED;;;OAGG;IACH,IAAI,WAAW;QACd,OAAO,KAAK,CAAC;IACd,CAAC;IAED,IAAI,YAAY;QACf,OAAO,IAAI,CAAC,YAAY,CAAC,gBAAgB,CAAC,IAAI,GAAG,IAAI,CAAC,GAAG,iBAAiB,CAAC;IAC5E,CAAC;IAED,IAAI,OAAO;QACV,OAAO;YACN,IAAI,EAAE;gBACL,qBAAqB,EAAE,IAAI,CAAC,YAAY;gBACxC,aAAa,EAAE,IAAI;aACnB;SACD,CAAC;IACH,CAAC;CACD,CAAA;AApEA;IADC,QAAQ,EAAE;qDACoD;AAS/D;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;2DACG;AAU/B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;iDACE;AAhCzB,WAAW;IAdhB,KAAK,CAAC,gBAAgB,EAAE;QACxB,OAAO,EAAE,IAAI;KACb,CAAC;IAEF;;;;;;;;;OASG;GACG,WAAW,CAiFhB;AAMD,eAAe,WAAW,CAAC","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\n\nimport type ToolbarItemOverflowBehavior from \"./types/ToolbarItemOverflowBehavior.js\";\n\ntype IEventOptions = {\n\tpreventClosing: boolean;\n}\n\ntype ToolbarItemEventDetail = {\n\ttargetRef: HTMLElement;\n}\n\n@event(\"close-overflow\", {\n\tbubbles: true,\n})\n\n/*\n @class\n \n Represents an abstract class for items, used in the `ui5-toolbar`.\n * @constructor\n * @extends UI5Element\n * @abstract\n * @public\n * @since 1.17.0\n /\nclass ToolbarItem extends UI5Element {\n\t// strictEvents: needed for parent class\n\teventDetails!: {\n\t\tclick: ToolbarItemEventDetail,\n\t\t\"close-overflow\": void;\n\t}\n\t/\n\t Property used to define the access of the item to the overflow Popover. If \"NeverOverflow\" option is set,\n\t * the item never goes in the Popover, if \"AlwaysOverflow\" - it never comes out of it.\n\t * @public\n\t * @default \"Default\"\n\t /\n\t@property()\n\toverflowPriority: `${ToolbarItemOverflowBehavior}` = \"Default\";\n\n\t/\n\t Defines if the toolbar overflow popup should close upon intereaction with the item.\n\t * It will close by default.\n\t * @default false\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\tpreventOverflowClosing = false;\n\n\t/\n\t Defines if the toolbar item is overflowed.\n\t * @default false\n\t * @protected\n\t * @since 2.11.0\n\t /\n\n\t@property({ type: Boolean })\n\tisOverflowed: boolean = false;\n\n\t/\n\t Defines if the width of the item should be ignored in calculating the whole width of the toolbar\n\t* @protected\n\t/\n\tget ignoreSpace(): boolean {\n\t\treturn false;\n\t}\n\n\t/\n\t Returns if the item is flexible. An item that is returning true for this property will make\n\t * the toolbar expand to fill the 100% width of its container.\n\t * @protected\n\t /\n\tget hasFlexibleWidth(): boolean {\n\t\treturn false;\n\t}\n\n\t/\n\t Returns if the item is interactive.\n\t * This value is used to determinate if the toolbar should have its accessibility role and attributes set.\n\t * At least two interactive items are needed for the toolbar to have the role=\"toolbar\" attribute set.\n\t * @protected\n\t /\n\tget isInteractive(): boolean {\n\t\treturn true;\n\t}\n\n\t/\n\t Returns if the item is separator.\n\t * @protected\n\t */\n\tget isSeparator() {\n\t\treturn false;\n\t}\n\n\tget stableDomRef() {\n\t\treturn this.getAttribute(\"stable-dom-ref\") \|\| `${this._id}-stable-dom-ref`;\n\t}\n\n\tget classes() {\n\t\treturn {\n\t\t\troot: {\n\t\t\t\t\"ui5-tb-popover-item\": this.isOverflowed,\n\t\t\t\t\"ui5-tb-item\": true,\n\t\t\t},\n\t\t};\n\t}\n}\n\nexport type {\n\tIEventOptions,\n\tToolbarItemEventDetail,\n};\nexport default ToolbarItem;\n"]}

package/dist/ToolbarSelect.d.ts CHANGED Viewed

@@ -1,6 +1,4 @@
 import type ValueState from "@ui5/webcomponents-base/dist/types/ValueState.js";
-import ToolbarSelectTemplate from "./ToolbarSelectTemplate.js";
-import ToolbarPopoverSelectTemplate from "./ToolbarPopoverSelectTemplate.js";
 import ToolbarItem from "./ToolbarItem.js";
 import type { ToolbarItemEventDetail } from "./ToolbarItem.js";
 import type ToolbarSelectOption from "./ToolbarSelectOption.js";
@@ -73,8 +71,6 @@ declare class ToolbarSelect extends ToolbarItem {
      * @public
      */
     accessibleNameRef?: string;
-    static get toolbarTemplate(): typeof ToolbarSelectTemplate;
-    static get toolbarPopoverTemplate(): typeof ToolbarPopoverSelectTemplate;
     onClick(e: Event): void;
     onOpen(e: Event): void;
     onClose(e: Event): void;