npm - @ui5/webcomponents - Versions diffs - 2.22.1-rc.0 → 2.23.0-rc.0 - Mend

@ui5/webcomponents 2.22.1-rc.0 → 2.23.0-rc.0

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 (105) hide show

package/dist/Icon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Icon.js","sourceRoot":"","sources":["../src/Icon.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport jsxRender from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport type { AriaRole } from \"@ui5/webcomponents-base/dist/types.js\";\nimport type { IconData, UnsafeIconData } from \"@ui5/webcomponents-base/dist/asset-registries/Icons.js\";\nimport { getIconData, getIconDataSync } from \"@ui5/webcomponents-base/dist/asset-registries/Icons.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type { I18nText } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport { isDesktop } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport { isSpace, isEnter } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport executeTemplate from \"@ui5/webcomponents-base/dist/renderer/executeTemplate.js\";\nimport IconTemplate from \"./IconTemplate.js\";\nimport type IconDesign from \"./types/IconDesign.js\";\nimport IconMode from \"./types/IconMode.js\";\n\nimport { ICON_ARIA_TYPE_IMAGE, ICON_ARIA_TYPE_INTERACTIVE } from \"./generated/i18n/i18n-defaults.js\";\n\n// Styles\nimport iconCss from \"./generated/themes/Icon.css.js\";\n\n/*\n Interface for components that represent an icon, usable in numerous higher-order components\n * @public\n /\ninterface IIcon extends HTMLElement { }\n\nconst ICON_NOT_FOUND = \"ICON_NOT_FOUND\";\n\n/\n @class\n * ### Overview\n \n The `ui5-icon` component represents an SVG icon.\n * There are two main scenarios how the `ui5-icon` component is used:\n * as a purely decorative element,\n * or as an interactive element that can be focused and clicked.\n \n ### Usage\n \n 1. Get familiar with the icons collections.\n \n Before displaying an icon, you need to explore the icons collections to find and import the desired icon.\n \n Currently there are 3 icons collection, available as 3 npm packages:\n \n - [@ui5/webcomponents-icons](https://www.npmjs.com/package/@ui5/webcomponents-icons) represents the \"SAP-icons\" collection and includes the following\n * [icons](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html#/overview/SAP-icons).\n * - [@ui5/webcomponents-icons-tnt](https://www.npmjs.com/package/@ui5/webcomponents-icons-tnt) represents the \"tnt\" collection and includes the following\n * [icons](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html#/overview/SAP-icons-TNT).\n * - [@ui5/webcomponents-icons-business-suite](https://www.npmjs.com/package/@ui5/webcomponents-icons-business-suite) represents the \"business-suite\" collection and includes the following\n * [icons](https://ui5.sap.com/test-resources/sap/m/demokit/iconExplorer/webapp/index.html#/overview/BusinessSuiteInAppSymbols).\n \n 2. After exploring the icons collections, add one or more of the packages as dependencies to your project.\n \n `npm i @ui5/webcomponents-icons`\n * `npm i @ui5/webcomponents-icons-tnt`\n * `npm i @ui5/webcomponents-icons-business-suite`\n \n 3. Then, import the desired icon.\n \n `import \"@ui5/\\{package_name\\}/dist/\\{icon_name\\}.js\";`\n \n For Example:\n \n For the standard \"SAP-icons\" icon collection, import an icon from the `@ui5/webcomponents-icons` package:\n \n `import \"@ui5/webcomponents-icons/dist/employee.js\";`\n \n For the \"tnt\" (SAP Fiori Tools) icon collection, import an icon from the `@ui5/webcomponents-icons-tnt` package:\n \n `import \"@ui5/webcomponents-icons-tnt/dist/antenna.js\";`\n \n For the \"business-suite\" (SAP Business Suite) icon collection, import an icon from the `@ui5/webcomponents-icons-business-suite` package:\n \n `import \"@ui5/webcomponents-icons-business-suite/dist/ab-testing.js\";`\n \n 4. Display the icon using the `ui5-icon` web component.\n * Set the icon collection (\"SAP-icons\", \"tnt\" or \"business-suite\" - \"SAP-icons\" is the default icon collection and can be skipped)\n * and the icon name to the `name` property.\n \n `<ui5-icon name=\"employee\"></ui5-icon>`\n * `<ui5-icon name=\"tnt/antenna\"></ui5-icon>`\n * `<ui5-icon name=\"business-suite/ab-testing\"></ui5-icon>`\n \n ### Keyboard Handling\n \n - [Space] / [Enter] or [Return] - Fires the `click` event if the `mode` property is set to `Interactive`.\n \n ### ES6 Module Import\n \n `import \"@ui5/webcomponents/dist/Icon.js\";`\n * @csspart root - Used to style the outermost wrapper of the `ui5-icon`.\n * @constructor\n * @extends UI5Element\n * @implements {IIcon}\n * @public\n /\n@customElement({\n\ttag: \"ui5-icon\",\n\tlanguageAware: true,\n\tthemeAware: true,\n\trenderer: jsxRender,\n\ttemplate: IconTemplate,\n\tstyles: iconCss,\n})\n/\n Fired when the component is activated by mouse/touch, keyboard (Enter or Space),\n * or screen reader virtual cursor activation.\n \n Note: The event will not be fired if the `mode` property is set to `Decorative` or `Image`.\n * @public\n * @since 2.11.0\n /\n@event(\"click\", {\n\tbubbles: true,\n})\nclass Icon extends UI5Element implements IIcon {\n\teventDetails!: {\n\t\tclick: void\n\t}\n\n\t@i18n(\"@ui5/webcomponents\")\n\tstatic i18nBundle: I18nBundle;\n\n\t/\n\t Defines the component semantic design.\n\t * @default \"Default\"\n\t * @public\n\t * @since 1.9.2\n\t /\n\t@property()\n\tdesign: `${IconDesign}` = \"Default\";\n\n\t/\n\t Defines the unique identifier (icon name) of the component.\n\t \n\t To browse all available icons, see the\n\t * [SAP Icons](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html),\n\t * [SAP Fiori Tools](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html#/overview/SAP-icons-TNT) and\n\t * [SAP Business Suite](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html)\n\t \n\t Example:\n\t * `name='add'`, `name='delete'`, `name='employee'`.\n\t \n\t Note: To use the SAP Fiori Tools icons,\n\t * you need to set the `tnt` prefix in front of the icon's name.\n\t \n\t Example:\n\t * `name='tnt/antenna'`, `name='tnt/actor'`, `name='tnt/api'`.\n\t \n\t Note: To use the SAP Business Suite icons,\n\t * you need to set the `business-suite` prefix in front of the icon's name.\n\t \n\t Example:\n\t * `name='business-suite/3d'`, `name='business-suite/1x2-grid-layout'`, `name='business-suite/4x4-grid-layout'`.\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\tname?: string;\n\n\t/\n\t Defines the text alternative of the component.\n\t * If not provided a default text alternative will be set, if present.\n\t \n\t Note: Every icon should have a text alternative in order to\n\t * calculate its accessible name.\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\taccessibleName?: string;\n\n\t/\n\t Defines whether the component should have a tooltip.\n\t \n\t Note: The tooltip text should be provided via the `accessible-name` property.\n\t * @default false\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\tshowTooltip = false;\n\n\t/\n\t Defines the mode of the component.\n\t * @default \"Decorative\"\n\t * @public\n\t * @since 2.0.0\n\t /\n\t@property()\n\tmode: `${IconMode}` = \"Decorative\";\n\n\t/\n\t @private\n\t /\n\t@property({ type: Array, noAttribute: true })\n\tpathData: Array<string> = [];\n\n\t/\n\t @private\n\t /\n\t@property({ type: Object, noAttribute: true })\n\taccData?: I18nText;\n\n\t/\n\t @private\n\t/\n\t@property({ type: Boolean })\n\tinvalid = false;\n\n\t/\n\t @private\n\t /\n\t@property({ noAttribute: true })\n\teffectiveAccessibleName?: string;\n\n\tltr?: boolean;\n\tpackageName?: string;\n\tviewBox?: string;\n\tcustomTemplate?: object;\n\tcustomTemplateAsString?: string;\n\n\t_onclick(e: MouseEvent) {\n\t\tif (this.mode !== IconMode.Interactive) {\n\t\t\treturn;\n\t\t}\n\n\t\t// prevents the native browser \"click\" event from firing\n\t\te.stopImmediatePropagation();\n\n\t\tthis.fireDecoratorEvent(\"click\");\n\t}\n\n\t_onkeydown(e: KeyboardEvent) {\n\t\tif (this.mode !== IconMode.Interactive) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (isEnter(e)) {\n\t\t\tthis.fireDecoratorEvent(\"click\");\n\t\t}\n\n\t\tif (isSpace(e)) {\n\t\t\te.preventDefault(); // prevent scrolling\n\t\t}\n\t}\n\n\t_onkeyup(e: KeyboardEvent) {\n\t\tif (this.mode === IconMode.Interactive && isSpace(e)) {\n\t\t\tthis.fireDecoratorEvent(\"click\");\n\t\t}\n\t}\n\n\t/\n\t Enforce \"ltr\" direction, based on the icons collection metadata.\n\t/\n\tget _dir() {\n\t\treturn this.ltr ? \"ltr\" : undefined;\n\t}\n\n\tget effectiveAriaHidden() {\n\t\treturn this.mode === IconMode.Decorative ? \"true\" : undefined;\n\t}\n\n\tget _tabIndex() {\n\t\treturn this.mode === IconMode.Interactive ? 0 : undefined;\n\t}\n\n\tget effectiveAccessibleRole() {\n\t\tswitch (this.mode) {\n\t\tcase IconMode.Interactive:\n\t\t\treturn \"button\";\n\t\tcase IconMode.Decorative:\n\t\t\treturn \"presentation\";\n\t\tdefault:\n\t\t\treturn \"img\";\n\t\t}\n\t}\n\n\tonEnterDOM() {\n\t\tif (isDesktop()) {\n\t\t\tthis.setAttribute(\"desktop\", \"\");\n\t\t}\n\t}\n\n\tasync onBeforeRendering() {\n\t\tconst name = this.name;\n\t\tif (!name) {\n\t\t\treturn;\n\t\t}\n\n\t\tlet iconData: typeof ICON_NOT_FOUND \| IconData \| UnsafeIconData \| undefined = getIconDataSync(name);\n\t\tif (!iconData) {\n\t\t\ticonData = await getIconData(name);\n\t\t}\n\n\t\tif (!iconData) {\n\t\t\tthis.invalid = true;\n\t\t\t/ eslint-disable-next-line /\n\t\t\treturn console.warn(`Required icon is not registered. Invalid icon name: ${this.name}`);\n\t\t}\n\n\t\tif (iconData === ICON_NOT_FOUND) {\n\t\t\tthis.invalid = true;\n\t\t\t/ eslint-disable-next-line */\n\t\t\treturn console.warn(`Required icon is not registered. You can either import the icon as a module in order to use it e.g. \"@ui5/webcomponents-icons/dist/${name.replace(\"sap-icon://\", \"\")}.js\", or setup a JSON build step and import \"@ui5/webcomponents-icons/dist/AllIcons.js\".`);\n\t\t}\n\n\t\tthis.viewBox = iconData.viewBox \|\| \"0 0 512 512\";\n\n\t\tif (\"customTemplate\" in iconData && iconData.customTemplate) {\n\t\t\tthis.customTemplate = executeTemplate(iconData.customTemplate, this);\n\t\t}\n\n\t\tif (\"customTemplateAsString\" in iconData) {\n\t\t\tthis.customTemplateAsString = iconData.customTemplateAsString;\n\t\t}\n\n\t\t// in case a new valid name is set, show the icon\n\t\tthis.invalid = false;\n\t\tif (\"pathData\" in iconData && iconData.pathData) {\n\t\t\tthis.pathData = Array.isArray(iconData.pathData) ? iconData.pathData : [iconData.pathData];\n\t\t}\n\n\t\tthis.accData = iconData.accData;\n\t\tthis.ltr = iconData.ltr;\n\t\tthis.packageName = iconData.packageName;\n\n\t\tif (this.accessibleName) {\n\t\t\tthis.effectiveAccessibleName = this.accessibleName;\n\t\t} else if (this.accData) {\n\t\t\tif (this.packageName) {\n\t\t\t\tconst i18nBundle = await getI18nBundle(this.packageName);\n\t\t\t\tthis.effectiveAccessibleName = i18nBundle.getText(this.accData) \|\| undefined;\n\t\t\t} else {\n\t\t\t\tthis.effectiveAccessibleName = this.accData?.defaultText \|\| undefined;\n\t\t\t}\n\t\t} else {\n\t\t\tthis.effectiveAccessibleName = undefined;\n\t\t}\n\t}\n\n\tget hasIconTooltip() {\n\t\treturn this.showTooltip && this.effectiveAccessibleName;\n\t}\n\n\t_getAriaTypeDescription() {\n\t\tswitch (this.mode) {\n\t\tcase IconMode.Interactive:\n\t\t\treturn Icon.i18nBundle.getText(ICON_ARIA_TYPE_INTERACTIVE);\n\t\tcase IconMode.Image:\n\t\t\treturn Icon.i18nBundle.getText(ICON_ARIA_TYPE_IMAGE);\n\t\tdefault:\n\t\t\treturn \"\";\n\t\t}\n\t}\n\n\tget accessibilityInfo() {\n\t\tif (this.mode === IconMode.Decorative) {\n\t\t\treturn {};\n\t\t}\n\n\t\treturn {\n\t\t\trole: this.effectiveAccessibleRole as AriaRole,\n\t\t\ttype: this._getAriaTypeDescription(),\n\t\t\tdescription: this.effectiveAccessibleName,\n\t\t};\n\t}\n}\n\nIcon.define();\n\nexport default Icon;\nexport type {\n\tIIcon,\n};\n"]}
1	+ {"version":3,"file":"Icon.js","sourceRoot":"","sources":["../src/Icon.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport jsxRender from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot-strict.js\";\nimport type { AriaRole } from \"@ui5/webcomponents-base/dist/types.js\";\nimport type { Slot } from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport type { IconData, UnsafeIconData } from \"@ui5/webcomponents-base/dist/asset-registries/Icons.js\";\nimport { getIconData, getIconDataSync } from \"@ui5/webcomponents-base/dist/asset-registries/Icons.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type { I18nText } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport { isDesktop } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport { isSpace, isEnter } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport executeTemplate from \"@ui5/webcomponents-base/dist/renderer/executeTemplate.js\";\nimport IconTemplate from \"./IconTemplate.js\";\nimport type IconDesign from \"./types/IconDesign.js\";\nimport IconMode from \"./types/IconMode.js\";\n\nimport { ICON_ARIA_TYPE_IMAGE, ICON_ARIA_TYPE_INTERACTIVE } from \"./generated/i18n/i18n-defaults.js\";\n\n// Styles\nimport iconCss from \"./generated/themes/Icon.css.js\";\n\n/*\n Interface for components that represent an icon, usable in numerous higher-order components\n * @public\n /\ninterface IIcon extends HTMLElement { }\n\nconst ICON_NOT_FOUND = \"ICON_NOT_FOUND\";\n\n/\n @class\n * ### Overview\n \n The `ui5-icon` component represents an SVG icon.\n * There are two main scenarios how the `ui5-icon` component is used:\n * as a purely decorative element,\n * or as an interactive element that can be focused and clicked.\n \n ### Usage\n \n 1. Get familiar with the icons collections.\n \n Before displaying an icon, you need to explore the icons collections to find and import the desired icon.\n \n Currently there are 3 icons collection, available as 3 npm packages:\n \n - [@ui5/webcomponents-icons](https://www.npmjs.com/package/@ui5/webcomponents-icons) represents the \"SAP-icons\" collection and includes the following\n * [icons](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html#/overview/SAP-icons).\n * - [@ui5/webcomponents-icons-tnt](https://www.npmjs.com/package/@ui5/webcomponents-icons-tnt) represents the \"tnt\" collection and includes the following\n * [icons](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html#/overview/SAP-icons-TNT).\n * - [@ui5/webcomponents-icons-business-suite](https://www.npmjs.com/package/@ui5/webcomponents-icons-business-suite) represents the \"business-suite\" collection and includes the following\n * [icons](https://ui5.sap.com/test-resources/sap/m/demokit/iconExplorer/webapp/index.html#/overview/BusinessSuiteInAppSymbols).\n \n 2. After exploring the icons collections, add one or more of the packages as dependencies to your project.\n \n `npm i @ui5/webcomponents-icons`\n * `npm i @ui5/webcomponents-icons-tnt`\n * `npm i @ui5/webcomponents-icons-business-suite`\n \n 3. Then, import the desired icon.\n \n `import \"@ui5/\\{package_name\\}/dist/\\{icon_name\\}.js\";`\n \n For Example:\n \n For the standard \"SAP-icons\" icon collection, import an icon from the `@ui5/webcomponents-icons` package:\n \n `import \"@ui5/webcomponents-icons/dist/employee.js\";`\n \n For the \"tnt\" (SAP Fiori Tools) icon collection, import an icon from the `@ui5/webcomponents-icons-tnt` package:\n \n `import \"@ui5/webcomponents-icons-tnt/dist/antenna.js\";`\n \n For the \"business-suite\" (SAP Business Suite) icon collection, import an icon from the `@ui5/webcomponents-icons-business-suite` package:\n \n `import \"@ui5/webcomponents-icons-business-suite/dist/ab-testing.js\";`\n \n 4. Display the icon using the `ui5-icon` web component.\n * Set the icon collection (\"SAP-icons\", \"tnt\" or \"business-suite\" - \"SAP-icons\" is the default icon collection and can be skipped)\n * and the icon name to the `name` property.\n \n `<ui5-icon name=\"employee\"></ui5-icon>`\n * `<ui5-icon name=\"tnt/antenna\"></ui5-icon>`\n * `<ui5-icon name=\"business-suite/ab-testing\"></ui5-icon>`\n \n ### Keyboard Handling\n \n - [Space] / [Enter] or [Return] - Fires the `click` event if the `mode` property is set to `Interactive`.\n \n ### ES6 Module Import\n \n `import \"@ui5/webcomponents/dist/Icon.js\";`\n * @csspart root - Used to style the outermost wrapper of the `ui5-icon`.\n * @constructor\n * @extends UI5Element\n * @implements {IIcon}\n * @public\n /\n@customElement({\n\ttag: \"ui5-icon\",\n\tlanguageAware: true,\n\tthemeAware: true,\n\trenderer: jsxRender,\n\ttemplate: IconTemplate,\n\tstyles: iconCss,\n})\n/\n Fired when the component is activated by mouse/touch, keyboard (Enter or Space),\n * or screen reader virtual cursor activation.\n \n Note: The event will not be fired if the `mode` property is set to `Decorative` or `Image`.\n * @public\n * @since 2.11.0\n /\n@event(\"click\", {\n\tbubbles: true,\n})\nclass Icon extends UI5Element implements IIcon {\n\teventDetails!: {\n\t\tclick: void\n\t}\n\n\t@i18n(\"@ui5/webcomponents\")\n\tstatic i18nBundle: I18nBundle;\n\n\t/\n\t Defines the component semantic design.\n\t * @default \"Default\"\n\t * @public\n\t * @since 1.9.2\n\t /\n\t@property()\n\tdesign: `${IconDesign}` = \"Default\";\n\n\t/\n\t Defines the unique identifier (icon name) of the component.\n\t \n\t To browse all available icons, see the\n\t * [SAP Icons](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html),\n\t * [SAP Fiori Tools](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html#/overview/SAP-icons-TNT) and\n\t * [SAP Business Suite](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html)\n\t \n\t Example:\n\t * `name='add'`, `name='delete'`, `name='employee'`.\n\t \n\t Note: To use the SAP Fiori Tools icons,\n\t * you need to set the `tnt` prefix in front of the icon's name.\n\t \n\t Example:\n\t * `name='tnt/antenna'`, `name='tnt/actor'`, `name='tnt/api'`.\n\t \n\t Note: To use the SAP Business Suite icons,\n\t * you need to set the `business-suite` prefix in front of the icon's name.\n\t \n\t Example:\n\t * `name='business-suite/3d'`, `name='business-suite/1x2-grid-layout'`, `name='business-suite/4x4-grid-layout'`.\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\tname?: string;\n\n\t/\n\t Defines the text alternative of the component.\n\t * If not provided a default text alternative will be set, if present.\n\t \n\t Note: Every icon should have a text alternative in order to\n\t * calculate its accessible name.\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\taccessibleName?: string;\n\n\t/\n\t Defines whether the component should have a tooltip.\n\t \n\t Note: The tooltip text should be provided via the `accessible-name` property.\n\t * @default false\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\tshowTooltip = false;\n\n\t/\n\t Defines the mode of the component.\n\t * @default \"Decorative\"\n\t * @public\n\t * @since 2.0.0\n\t /\n\t@property()\n\tmode: `${IconMode}` = \"Decorative\";\n\n\t/\n\t Defines the font icon to be used as an icon.\n\t * Intended for font-based icon libraries where\n\t * the application loads the font and provides a slotted element with the unicode character.\n\t * When this slot is used, the component renders a `<span>` instead of an `<svg>`.\n\t * Accessibility is fully delegated to the application — set `accessible-name` and `mode` explicitly.\n\t \n\t Example:\n\t * ```html\n\t * <ui5-icon mode=\"Image\" accessible-name=\"Home\">\n\t * <i class=\"fa fa-home\" slot=\"fontIcon\"></i>\n\t * </ui5-icon>\n\t * ```\n\t * @public\n\t * @since 2.23.0\n\t /\n\t@slot({ type: HTMLElement })\n\tfontIcon!: Slot<HTMLElement>;\n\n\t/\n\t @private\n\t /\n\t@property({ type: Array, noAttribute: true })\n\tpathData: Array<string> = [];\n\n\t/\n\t @private\n\t /\n\t@property({ type: Object, noAttribute: true })\n\taccData?: I18nText;\n\n\t/\n\t @private\n\t/\n\t@property({ type: Boolean })\n\tinvalid = false;\n\n\t/\n\t @private\n\t /\n\t@property({ noAttribute: true })\n\teffectiveAccessibleName?: string;\n\n\tltr?: boolean;\n\tpackageName?: string;\n\tviewBox?: string;\n\tcustomTemplate?: object;\n\tcustomTemplateAsString?: string;\n\n\t_onclick(e: MouseEvent) {\n\t\tif (this.mode !== IconMode.Interactive) {\n\t\t\treturn;\n\t\t}\n\n\t\t// prevents the native browser \"click\" event from firing\n\t\te.stopImmediatePropagation();\n\n\t\tthis.fireDecoratorEvent(\"click\");\n\t}\n\n\t_onkeydown(e: KeyboardEvent) {\n\t\tif (this.mode !== IconMode.Interactive) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (isEnter(e)) {\n\t\t\tthis.fireDecoratorEvent(\"click\");\n\t\t}\n\n\t\tif (isSpace(e)) {\n\t\t\te.preventDefault(); // prevent scrolling\n\t\t}\n\t}\n\n\t_onkeyup(e: KeyboardEvent) {\n\t\tif (this.mode === IconMode.Interactive && isSpace(e)) {\n\t\t\tthis.fireDecoratorEvent(\"click\");\n\t\t}\n\t}\n\n\t/\n\t Enforce \"ltr\" direction, based on the icons collection metadata.\n\t/\n\tget _dir() {\n\t\treturn this.ltr ? \"ltr\" : undefined;\n\t}\n\n\tget effectiveAriaHidden() {\n\t\treturn this.mode === IconMode.Decorative ? \"true\" : undefined;\n\t}\n\n\tget _tabIndex() {\n\t\treturn this.mode === IconMode.Interactive ? 0 : undefined;\n\t}\n\n\tget effectiveAccessibleRole() {\n\t\tswitch (this.mode) {\n\t\tcase IconMode.Interactive:\n\t\t\treturn \"button\";\n\t\tcase IconMode.Decorative:\n\t\t\treturn \"presentation\";\n\t\tdefault:\n\t\t\treturn \"img\";\n\t\t}\n\t}\n\n\tonEnterDOM() {\n\t\tif (isDesktop()) {\n\t\t\tthis.setAttribute(\"desktop\", \"\");\n\t\t}\n\t}\n\n\tasync onBeforeRendering() {\n\t\tif (this.fontIcon.length) {\n\t\t\t// Font-based icon via slot — skip registry, accessibility is app's responsibility\n\t\t\tif (!this.accessibleName) {\n\t\t\t\tthis.effectiveAccessibleName = undefined;\n\t\t\t} else {\n\t\t\t\tthis.effectiveAccessibleName = this.accessibleName;\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\n\t\tconst name = this.name;\n\t\tif (!name) {\n\t\t\treturn;\n\t\t}\n\n\t\tlet iconData: typeof ICON_NOT_FOUND \| IconData \| UnsafeIconData \| undefined = getIconDataSync(name);\n\t\tif (!iconData) {\n\t\t\ticonData = await getIconData(name);\n\t\t}\n\n\t\tif (!iconData) {\n\t\t\tthis.invalid = true;\n\t\t\t/ eslint-disable-next-line /\n\t\t\treturn console.warn(`Required icon is not registered. Invalid icon name: ${this.name}`);\n\t\t}\n\n\t\tif (iconData === ICON_NOT_FOUND) {\n\t\t\tthis.invalid = true;\n\t\t\t/ eslint-disable-next-line */\n\t\t\treturn console.warn(`Required icon is not registered. You can either import the icon as a module in order to use it e.g. \"@ui5/webcomponents-icons/dist/${name.replace(\"sap-icon://\", \"\")}.js\", or setup a JSON build step and import \"@ui5/webcomponents-icons/dist/AllIcons.js\".`);\n\t\t}\n\n\t\tthis.viewBox = iconData.viewBox \|\| \"0 0 512 512\";\n\n\t\tif (\"customTemplate\" in iconData && iconData.customTemplate) {\n\t\t\tthis.customTemplate = executeTemplate(iconData.customTemplate, this);\n\t\t}\n\n\t\tif (\"customTemplateAsString\" in iconData) {\n\t\t\tthis.customTemplateAsString = iconData.customTemplateAsString;\n\t\t}\n\n\t\t// in case a new valid name is set, show the icon\n\t\tthis.invalid = false;\n\t\tif (\"pathData\" in iconData && iconData.pathData) {\n\t\t\tthis.pathData = Array.isArray(iconData.pathData) ? iconData.pathData : [iconData.pathData];\n\t\t}\n\n\t\tthis.accData = iconData.accData;\n\t\tthis.ltr = iconData.ltr;\n\t\tthis.packageName = iconData.packageName;\n\n\t\tif (this.accessibleName) {\n\t\t\tthis.effectiveAccessibleName = this.accessibleName;\n\t\t} else if (this.accData) {\n\t\t\tif (this.packageName) {\n\t\t\t\tconst i18nBundle = await getI18nBundle(this.packageName);\n\t\t\t\tthis.effectiveAccessibleName = i18nBundle.getText(this.accData) \|\| undefined;\n\t\t\t} else {\n\t\t\t\tthis.effectiveAccessibleName = this.accData?.defaultText \|\| undefined;\n\t\t\t}\n\t\t} else {\n\t\t\tthis.effectiveAccessibleName = undefined;\n\t\t}\n\t}\n\n\tget hasFontIcon() {\n\t\treturn this.fontIcon.length > 0;\n\t}\n\n\tget hasIconTooltip() {\n\t\treturn this.showTooltip && this.effectiveAccessibleName;\n\t}\n\n\t_getAriaTypeDescription() {\n\t\tswitch (this.mode) {\n\t\tcase IconMode.Interactive:\n\t\t\treturn Icon.i18nBundle.getText(ICON_ARIA_TYPE_INTERACTIVE);\n\t\tcase IconMode.Image:\n\t\t\treturn Icon.i18nBundle.getText(ICON_ARIA_TYPE_IMAGE);\n\t\tdefault:\n\t\t\treturn \"\";\n\t\t}\n\t}\n\n\tget accessibilityInfo() {\n\t\tif (this.mode === IconMode.Decorative) {\n\t\t\treturn {};\n\t\t}\n\n\t\treturn {\n\t\t\trole: this.effectiveAccessibleRole as AriaRole,\n\t\t\ttype: this._getAriaTypeDescription(),\n\t\t\tdescription: this.effectiveAccessibleName,\n\t\t};\n\t}\n}\n\nIcon.define();\n\nexport default Icon;\nexport type {\n\tIIcon,\n};\n"]}

package/dist/IconTemplate.js CHANGED Viewed

@@ -1,5 +1,8 @@
-import { jsxs as _jsxs, jsx as _jsx } from "@ui5/webcomponents-base/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "@ui5/webcomponents-base/jsx-runtime";
 export default function IconTemplate() {
+    if (this.hasFontIcon) {
+        return (_jsx("span", { class: "ui5-icon-root", part: "root", tabindex: this._tabIndex, role: this.effectiveAccessibleRole, "aria-label": this.effectiveAccessibleName, "aria-hidden": this.effectiveAriaHidden, onKeyDown: this._onkeydown, onKeyUp: this._onkeyup, onClick: this._onclick, children: _jsx("slot", { name: "fontIcon" }) }));
+    }
     return (_jsxs("svg", { class: "ui5-icon-root", part: "root", tabindex: this._tabIndex, dir: this._dir, viewBox: this.viewBox, role: this.effectiveAccessibleRole, focusable: "false", preserveAspectRatio: "xMidYMid meet", "aria-label": this.effectiveAccessibleName, "aria-hidden": this.effectiveAriaHidden, xmlns: "http://www.w3.org/2000/svg", onKeyDown: this._onkeydown, onKeyUp: this._onkeyup, onClick: this._onclick, children: [this.hasIconTooltip &&
                 _jsxs("title", { id: `${this._id}-tooltip`, children: [" ", this.effectiveAccessibleName, " "] }), _jsx("g", { role: "presentation", children: content.call(this) })] }));
 }

package/dist/IconTemplate.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"IconTemplate.js","sourceRoot":"","sources":["../src/IconTemplate.tsx"],"names":[],"mappings":";AAEA,MAAM,CAAC,OAAO,UAAU,YAAY;IACnC,OAAO,CACN,eACC,KAAK,EAAC,eAAe,EACrB,IAAI,EAAC,MAAM,EACX,QAAQ,EAAE,IAAI,CAAC,SAAS,EACxB,GAAG,EAAE,IAAI,CAAC,IAAI,EACd,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,IAAI,EAAE,IAAI,CAAC,uBAAuB,EAClC,SAAS,EAAC,OAAO,EACjB,mBAAmB,EAAC,eAAe,gBACvB,IAAI,CAAC,uBAAuB,iBAC3B,IAAI,CAAC,mBAAmB,EACrC,KAAK,EAAC,4BAA4B,EAClC,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,OAAO,EAAE,IAAI,CAAC,QAAQ,aAEpB,IAAI,CAAC,cAAc;gBACR,iBAAO,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,UAAU,kBAAK,IAAI,CAAC,uBAAuB,SAAU,EAGxF,YAAG,IAAI,EAAC,cAAc,YACnB,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,GACjB,IACC,CACN,CAAC;AACH,CAAC;AAED,SAAS,OAAO;IACf,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;QACzB,OAAO,IAAI,CAAC,cAAc,CAAC;IAC5B,CAAC;IAED,IAAI,IAAI,CAAC,sBAAsB,EAAE,CAAC;QACjC,OAAO,YAAG,uBAAuB,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,sBAAsB,EAAE,GAAM,CAAC;IAClF,CAAC;IAED,OAAO,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAChC,eAAM,CAAC,EAAE,IAAI,GAAS,CACtB,CAAC,CAAC;AACJ,CAAC","sourcesContent":["import type Icon from \"./Icon.js\";\n\nexport default function IconTemplate(this: Icon) {\n\treturn (\n\t\t<svg\n\t\t\tclass=\"ui5-icon-root\"\n\t\t\tpart=\"root\"\n\t\t\ttabindex={this._tabIndex}\n\t\t\tdir={this._dir}\n\t\t\tviewBox={this.viewBox}\n\t\t\trole={this.effectiveAccessibleRole}\n\t\t\tfocusable=\"false\"\n\t\t\tpreserveAspectRatio=\"xMidYMid meet\"\n\t\t\taria-label={this.effectiveAccessibleName}\n\t\t\taria-hidden={this.effectiveAriaHidden}\n\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\tonKeyDown={this._onkeydown}\n\t\t\tonKeyUp={this._onkeyup}\n\t\t\tonClick={this._onclick}\n\t\t>\n\t\t\t{ this.hasIconTooltip &&\n <title id={`${this._id}-tooltip`} > {this.effectiveAccessibleName} </title>\n\t\t\t}\n\n\t\t\t<g role=\"presentation\">\n\t\t\t\t{ content.call(this) }\n\t\t\t</g>\n\t\t</svg>\n\t);\n}\n\nfunction content(this: Icon) {\n\tif (this.customTemplate) {\n\t\treturn this.customTemplate;\n\t}\n\n\tif (this.customTemplateAsString) {\n\t\treturn <g dangerouslySetInnerHTML={{ __html: this.customTemplateAsString }}></g>;\n\t}\n\n\treturn this.pathData.map(path => (\n\t\t<path d={path}></path>\n\t));\n}\n"]}
1	+ {"version":3,"file":"IconTemplate.js","sourceRoot":"","sources":["../src/IconTemplate.tsx"],"names":[],"mappings":";AAEA,MAAM,CAAC,OAAO,UAAU,YAAY;IACnC,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;QACtB,OAAO,CACN,eACC,KAAK,EAAC,eAAe,EACrB,IAAI,EAAC,MAAM,EACX,QAAQ,EAAE,IAAI,CAAC,SAAS,EACxB,IAAI,EAAE,IAAI,CAAC,uBAAuB,gBACtB,IAAI,CAAC,uBAAuB,iBAC3B,IAAI,CAAC,mBAAmB,EACrC,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,OAAO,EAAE,IAAI,CAAC,QAAQ,YAEtB,eAAM,IAAI,EAAC,UAAU,GAAQ,GACvB,CACP,CAAC;IACH,CAAC;IAED,OAAO,CACN,eACC,KAAK,EAAC,eAAe,EACrB,IAAI,EAAC,MAAM,EACX,QAAQ,EAAE,IAAI,CAAC,SAAS,EACxB,GAAG,EAAE,IAAI,CAAC,IAAI,EACd,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,IAAI,EAAE,IAAI,CAAC,uBAAuB,EAClC,SAAS,EAAC,OAAO,EACjB,mBAAmB,EAAC,eAAe,gBACvB,IAAI,CAAC,uBAAuB,iBAC3B,IAAI,CAAC,mBAAmB,EACrC,KAAK,EAAC,4BAA4B,EAClC,SAAS,EAAE,IAAI,CAAC,UAAU,EAC1B,OAAO,EAAE,IAAI,CAAC,QAAQ,EACtB,OAAO,EAAE,IAAI,CAAC,QAAQ,aAEpB,IAAI,CAAC,cAAc;gBACR,iBAAO,EAAE,EAAE,GAAG,IAAI,CAAC,GAAG,UAAU,kBAAK,IAAI,CAAC,uBAAuB,SAAU,EAGxF,YAAG,IAAI,EAAC,cAAc,YACnB,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,GACjB,IACC,CACN,CAAC;AACH,CAAC;AAED,SAAS,OAAO;IACf,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;QACzB,OAAO,IAAI,CAAC,cAAc,CAAC;IAC5B,CAAC;IAED,IAAI,IAAI,CAAC,sBAAsB,EAAE,CAAC;QACjC,OAAO,YAAG,uBAAuB,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,sBAAsB,EAAE,GAAM,CAAC;IAClF,CAAC;IAED,OAAO,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAChC,eAAM,CAAC,EAAE,IAAI,GAAS,CACtB,CAAC,CAAC;AACJ,CAAC","sourcesContent":["import type Icon from \"./Icon.js\";\n\nexport default function IconTemplate(this: Icon) {\n\tif (this.hasFontIcon) {\n\t\treturn (\n\t\t\t<span\n\t\t\t\tclass=\"ui5-icon-root\"\n\t\t\t\tpart=\"root\"\n\t\t\t\ttabindex={this._tabIndex}\n\t\t\t\trole={this.effectiveAccessibleRole}\n\t\t\t\taria-label={this.effectiveAccessibleName}\n\t\t\t\taria-hidden={this.effectiveAriaHidden}\n\t\t\t\tonKeyDown={this._onkeydown}\n\t\t\t\tonKeyUp={this._onkeyup}\n\t\t\t\tonClick={this._onclick}\n\t\t\t>\n\t\t\t\t<slot name=\"fontIcon\"></slot>\n\t\t\t</span>\n\t\t);\n\t}\n\n\treturn (\n\t\t<svg\n\t\t\tclass=\"ui5-icon-root\"\n\t\t\tpart=\"root\"\n\t\t\ttabindex={this._tabIndex}\n\t\t\tdir={this._dir}\n\t\t\tviewBox={this.viewBox}\n\t\t\trole={this.effectiveAccessibleRole}\n\t\t\tfocusable=\"false\"\n\t\t\tpreserveAspectRatio=\"xMidYMid meet\"\n\t\t\taria-label={this.effectiveAccessibleName}\n\t\t\taria-hidden={this.effectiveAriaHidden}\n\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\tonKeyDown={this._onkeydown}\n\t\t\tonKeyUp={this._onkeyup}\n\t\t\tonClick={this._onclick}\n\t\t>\n\t\t\t{ this.hasIconTooltip &&\n <title id={`${this._id}-tooltip`} > {this.effectiveAccessibleName} </title>\n\t\t\t}\n\n\t\t\t<g role=\"presentation\">\n\t\t\t\t{ content.call(this) }\n\t\t\t</g>\n\t\t</svg>\n\t);\n}\n\nfunction content(this: Icon) {\n\tif (this.customTemplate) {\n\t\treturn this.customTemplate;\n\t}\n\n\tif (this.customTemplateAsString) {\n\t\treturn <g dangerouslySetInnerHTML={{ __html: this.customTemplateAsString }}></g>;\n\t}\n\n\treturn this.pathData.map(path => (\n\t\t<path d={path}></path>\n\t));\n}\n"]}

package/dist/MultiInput.js CHANGED Viewed

@@ -221,7 +221,8 @@ let MultiInput = MultiInput_1 = class MultiInput extends Input {
         const relatedTarget = e.relatedTarget;
         const insideDOM = this.contains(relatedTarget);
         const insideShadowDom = this.shadowRoot.contains(relatedTarget);
-        if (!insideDOM && !insideShadowDom) {
+        const hasTokenToBeDeleted = this.tokenizer._tokens.some(token => token.toBeDeleted);
+        if (!insideDOM && !insideShadowDom && !hasTokenToBeDeleted) {
             this.tokenizer.expanded = false;
         }
         if (this.contains(relatedTarget) && relatedTarget.hasAttribute("ui5-token")) {

package/dist/MultiInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MultiInput.js","sourceRoot":"","sources":["../src/MultiInput.ts"],"names":[],"mappings":"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","sourcesContent":["import type UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot-strict.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 {\n\tisShow,\n\tisBackSpace,\n\tisLeft,\n\tisRight,\n\tisRightCtrl,\n\tisHome,\n\tisEnd,\n\tisDown,\n\tisEnter,\n\tisTabNext,\n} from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport { isPhone } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport type { ITabbable } from \"@ui5/webcomponents-base/dist/delegate/ItemNavigation.js\";\nimport type { IFormInputElement } from \"@ui5/webcomponents-base/dist/features/InputElementsFormSupport.js\";\nimport {\n\tMULTIINPUT_ROLEDESCRIPTION_TEXT,\n\tMULTIINPUT_VALUE_HELP_LABEL,\n\tMULTIINPUT_VALUE_HELP,\n\tFORM_MIXED_TEXTFIELD_REQUIRED,\n\tMULTIINPUT_FILTER_BUTTON_LABEL,\n} from \"./generated/i18n/i18n-defaults.js\";\nimport Input from \"./Input.js\";\nimport MultiInputTemplate from \"./MultiInputTemplate.js\";\nimport styles from \"./generated/themes/MultiInput.css.js\";\nimport type Token from \"./Token.js\";\nimport type Tokenizer from \"./Tokenizer.js\";\nimport { getTokensCountText } from \"./Tokenizer.js\";\nimport type { TokenizerTokenDeleteEventDetail } from \"./Tokenizer.js\";\n\nimport type {\n\tInputSelectionChangeEventDetail as MultiInputSelectionChangeEventDetail,\n} from \"./Input.js\";\nimport type { Slot } from \"@ui5/webcomponents-base/dist/UI5Element.js\";\n\ninterface IToken extends UI5Element, ITabbable {\n\ttext?: string;\n\treadonly: boolean,\n\tselected: boolean,\n\tisTruncatable: boolean,\n}\n\ntype MultiInputTokenDeleteEventDetail = {\n\ttokens: Token[];\n}\n\n/*\n @class\n * ### Overview\n * A `ui5-multi-input` field allows the user to enter multiple values, which are displayed as `ui5-token`.\n \n User can choose interaction for creating tokens.\n * Fiori Guidelines say that user should create tokens when:\n \n - Type a value in the input and press enter or focus out the input field (`change` event is fired)\n * - Move between suggestion items (`selection-change` event is fired)\n * - Clicking on a suggestion item (`selection-change` event is fired if the clicked item is different than the current value. Also `change` event is fired )\n \n ### ES6 Module Import\n \n `import \"@ui5/webcomponents/dist/MultiInput.js\";`\n * @constructor\n * @extends Input\n * @since 1.0.0-rc.9\n * @public\n /\n@customElement({\n\ttag: \"ui5-multi-input\",\n\trenderer: jsxRenderer,\n\tformAssociated: true,\n\ttemplate: MultiInputTemplate,\n\tstyles: [Input.styles, styles],\n})\n/\n Fired when the value help icon is pressed\n * and F4 or ALT/OPTION + ARROW_UP/ARROW_DOWN keyboard keys are used.\n * @public\n /\n@event(\"value-help-trigger\", {\n\tbubbles: true,\n})\n\n/\n Fired when tokens are being deleted.\n * @param {Array} tokens An array containing the deleted tokens.\n * @public\n /\n@event(\"token-delete\", {\n\tbubbles: true,\n})\n\nclass MultiInput extends Input implements IFormInputElement {\n\teventDetails!: Input[\"eventDetails\"] & {\n\t\t\"value-help-trigger\": void,\n\t\t\"token-delete\": MultiInputTokenDeleteEventDetail,\n\t}\n\t/\n\t Determines whether a value help icon will be visualized in the end of the input.\n\t * Pressing the icon will fire `value-help-trigger` event.\n\t * @default false\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\tshowValueHelpIcon = false;\n\n\t/\n\t Indicates whether the tokenizer has tokens\n\t * @default false\n\t * @private\n\t /\n\t@property({ type: Boolean })\n\ttokenizerAvailable = false;\n\n\t/\n\t Determines the name by which the component will be identified upon submission in an HTML form.\n\t \n\t Note: This property is only applicable within the context of an HTML Form element.\n\t * Note: When the component is used inside a form element,\n\t * the value is sent as the first element in the form data, even if it's empty.\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\tdeclare name?: string;\n\n\t/\n\t Indicates whether to show tokens in suggestions popover\n\t * @default false\n\t * @private\n\t /\n\t@property({ type: Boolean })\n\t_showTokensInSuggestions = false;\n\n\t/\n\t Tracks whether user has explicitly toggled the show tokens state\n\t * @default false\n\t * @private\n\t /\n\t@property({ type: Boolean })\n\t_userToggledShowTokens = false;\n\n\t/\n\t Defines the component tokens.\n\t * @public\n\t /\n\t@slot({ type: HTMLElement, individualSlots: true })\n\ttokens!: Slot<IToken>;\n\n\t_skipOpenSuggestions: boolean;\n\t_valueHelpIconPressed: boolean;\n\t_focusInTokenizer: boolean;\n\n\tget formValidityMessage() {\n\t\treturn MultiInput.i18nBundle.getText(FORM_MIXED_TEXTFIELD_REQUIRED);\n\t}\n\n\tget formValidity(): ValidityStateFlags {\n\t\tconst tokens = (this.tokens \|\| []);\n\n\t\treturn { valueMissing: this.required && !this.value && !tokens.length };\n\t}\n\n\tget formFormattedValue(): FormData \| string \| null {\n\t\tconst tokens = (this.tokens \|\| []);\n\n\t\tif (tokens.length && this.name) {\n\t\t\tconst formData = new FormData();\n\n\t\t\tformData.append(this.name, this.value);\n\n\t\t\tfor (let i = 0; i < tokens.length; i++) {\n\t\t\t\tformData.append(this.name, (tokens[i].text \|\| \"\"));\n\t\t\t}\n\n\t\t\treturn formData;\n\t\t}\n\n\t\treturn this.value;\n\t}\n\n\tconstructor() {\n\t\tsuper();\n\n\t\t// Prevent suggestions' opening.\n\t\tthis._skipOpenSuggestions = false;\n\t\tthis._valueHelpIconPressed = false;\n\t\tthis._focusInTokenizer = false;\n\t}\n\n\tvalueHelpPress() {\n\t\tthis.closeValueStatePopover();\n\t\tthis.fireDecoratorEvent(\"value-help-trigger\");\n\t}\n\n\ttokenDelete(e: CustomEvent<TokenizerTokenDeleteEventDetail>) {\n\t\tconst deletedTokens = e.detail.tokens;\n\t\tconst selectedTokens = this.tokens.filter(token => token.selected);\n\t\tconst shouldFocusInput = this.tokens.length - 1 === 0 \|\| this.tokens.length === selectedTokens.length;\n\n\t\tif (this._readonly) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (deletedTokens) {\n\t\t\tthis.fireDecoratorEvent(\"token-delete\", { tokens: deletedTokens });\n\n\t\t\tif (shouldFocusInput) {\n\t\t\t\tthis.focus();\n\t\t\t}\n\t\t}\n\t}\n\n\tvalueHelpMouseDown(e: MouseEvent) {\n\t\te.preventDefault();\n\t\tthis.focus();\n\t\tthis.closeValueStatePopover();\n\t\tthis.tokenizer.open = false;\n\t\tthis._valueHelpIconPressed = true;\n\t}\n\n\t_tokenizerFocusOut(e: FocusEvent) {\n\t\tif (!this.contains(e.relatedTarget as HTMLElement) && !this.shadowRoot!.contains(e.relatedTarget as HTMLElement)) {\n\t\t\tthis.tokenizer._tokens.forEach(token => { token.selected = false; });\n\t\t}\n\t\tthis._focusInTokenizer = false;\n\t}\n\n\tvalueHelpMouseUp() {\n\t\tsetTimeout(() => {\n\t\t\tthis._valueHelpIconPressed = false;\n\t\t}, 0);\n\t}\n\n\tinnerFocusIn() {\n\t\tthis.focused = true;\n\t\tthis.tokenizer._scrollToEndOnExpand = true;\n\t\tthis.tokenizer.expanded = true;\n\t\tthis.tokens.forEach(token => {\n\t\t\ttoken.selected = false;\n\t\t});\n\t}\n\n\t_showMoreItemsPress() {\n\t\tthis.tokenizer._scrollToEndOnExpand = true;\n\t}\n\n\t_onkeydown(e: KeyboardEvent) {\n\t\t!this._isComposing && super._onkeydown(e);\n\t\tthis._isKeyNavigation = true;\n\n\t\tconst target = e.target as HTMLInputElement;\n\t\tconst isHomeInBeginning = isHome(e) && target.selectionStart === 0;\n\n\t\tif (isHomeInBeginning) {\n\t\t\tthis._skipOpenSuggestions = true; // Prevent input focus when navigating through the tokens\n\t\t\treturn this._focusFirstToken(e);\n\t\t}\n\n\t\tif (isLeft(e)) {\n\t\t\tthis._skipOpenSuggestions = true;\n\t\t\treturn this._handleLeft(e);\n\t\t}\n\n\t\tif (isBackSpace(e)) {\n\t\t\tthis._skipOpenSuggestions = true;\n\t\t\treturn this._handleBackspace(e);\n\t\t}\n\n\t\tthis._skipOpenSuggestions = false;\n\n\t\tif ((isEnter(e) \|\| isTabNext(e)) && this.previousValue !== this.value) {\n\t\t\tthis._handleChange();\n\t\t\treturn;\n\t\t}\n\n\t\tif (isShow(e)) {\n\t\t\tthis.valueHelpPress();\n\t\t}\n\n\t\tthis._isKeyNavigation = false;\n\t}\n\n\t_onTokenizerKeydown(e: KeyboardEvent) {\n\t\tconst rightCtrl = isRightCtrl(e);\n\t\tif (isRight(e) \|\| isDown(e) \|\| isEnd(e) \|\| rightCtrl) {\n\t\t\te.preventDefault();\n\t\t\tconst lastTokenIndex = this.tokens.length - 1;\n\n\t\t\tif (e.target === this.tokens[lastTokenIndex] && this.tokens[lastTokenIndex] === document.activeElement) {\n\t\t\t\tsetTimeout(() => {\n\t\t\t\t\tthis.focus();\n\t\t\t\t}, 0);\n\t\t\t}\n\t\t}\n\t}\n\n\t_handleLeft(e: KeyboardEvent) {\n\t\tconst cursorPosition = this.getDomRef()!.querySelector(`input`)!.selectionStart;\n\t\tconst tokens = this.tokens;\n\t\tconst lastToken = tokens.length && tokens[tokens.length - 1];\n\n\t\t// selectionStart property applies only to inputs of types text, search, URL, tel, and password\n\t\tif (((cursorPosition === null && !this.value) \|\| cursorPosition === 0) && lastToken) {\n\t\t\te.preventDefault();\n\t\t\tthis._focusToken(lastToken);\n\t\t}\n\t}\n\n\t_focusToken(tokenToFocus: IToken) {\n\t\tthis._focusInTokenizer = true;\n\t\ttokenToFocus.focus();\n\t\tthis.tokenizer._itemNav.setCurrentItem(tokenToFocus);\n\t}\n\n\t/\n\t @override\n\t /\n\t_handleChange() {\n\t\tif (this._focusInTokenizer) {\n\t\t\treturn;\n\t\t}\n\n\t\tsuper._handleChange();\n\t}\n\n\t_handleBackspace(e: KeyboardEvent) {\n\t\tconst tokens = this.tokens;\n\t\tconst lastToken = tokens.length && tokens[tokens.length - 1];\n\n\t\t// Only move focus to the last token if the input is empty\n\t\tif (!this.value && lastToken) {\n\t\t\te.preventDefault();\n\t\t\tthis._focusToken(lastToken);\n\t\t}\n\t}\n\n\t_focusFirstToken(e: KeyboardEvent) {\n\t\tconst tokens = this.tokens;\n\t\tconst firstToken = tokens.length && tokens[0];\n\n\t\tif (firstToken) {\n\t\t\te.preventDefault();\n\t\t\tthis._focusToken(firstToken);\n\t\t}\n\t}\n\n\t_onfocusout(e: FocusEvent) {\n\t\tsuper._onfocusout(e);\n\t\tconst relatedTarget = e.relatedTarget as HTMLElement;\n\t\tconst insideDOM = this.contains(relatedTarget);\n\t\tconst insideShadowDom = this.shadowRoot!.contains(relatedTarget);\n\n\t\tif (!insideDOM && !insideShadowDom) {\n\t\t\tthis.tokenizer.expanded = false;\n\t\t}\n\n\t\tif (this.contains(relatedTarget) && relatedTarget.hasAttribute(\"ui5-token\")) {\n\t\t\tthis.focused = false;\n\t\t}\n\t}\n\n\t/\n\t @override\n\t /\n\t_onfocusin(e: FocusEvent) {\n\t\tconst inputDomRef = this.getInputDOMRef();\n\t\tconst wasTokenFocused = e.relatedTarget instanceof HTMLElement && e.relatedTarget.hasAttribute(\"ui5-token\");\n\n\t\tif (e.target === inputDomRef) {\n\t\t\tif (wasTokenFocused) {\n\t\t\t\tthis.focused = true;\n\t\t\t\tthis.open = true;\n\t\t\t\tthis._inputIconFocused = false;\n\t\t\t\tthis._focusedAfterClear = false;\n\t\t\t} else {\n\t\t\t\tsuper._onfocusin(e);\n\t\t\t}\n\t\t}\n\t}\n\n\tonBeforeRendering() {\n\t\tsuper.onBeforeRendering();\n\n\t\tthis.style.setProperty(\"--_ui5-input-icons-count\", `${this.iconsCount}`);\n\t\tthis.tokenizerAvailable = this.tokens && this.tokens.length > 0;\n\n\t\tif (this.tokenizer) {\n\t\t\tthis.tokenizer.readonly = this.readonly;\n\n\t\t\t// Set the CSS variable on the tokenizer element so it's available in the shadow DOM\n\t\t\tthis.tokenizer.style.setProperty(\"--_ui5-input-icons-count\", `${this.iconsCount}`);\n\t\t}\n\t}\n\n\t/\n\t Override the _handlePickerAfterOpen method to handle token display based on device type\n\t /\n\t_handlePickerAfterOpen() {\n\t\tif (this.tokens.length > 0) {\n\t\t\t// On mobile: show tokens by default (for filter dialog feature)\n\t\t\t// On desktop: keep showing suggestions (default behavior)\n\t\t\tif (isPhone()) {\n\t\t\t\tthis._showTokensInSuggestions = true;\n\t\t\t}\n\t\t\tthis._userToggledShowTokens = false;\n\n\t\t\t// Expand tokenizer to show all tokens and prevent cut-off\n\t\t\tthis.tokenizer._scrollToEndOnExpand = true;\n\t\t\tthis.tokenizer.expanded = true;\n\t\t}\n\n\t\tsuper._handlePickerAfterOpen();\n\t}\n\n\tonAfterRendering() {\n\t\tsuper.onAfterRendering();\n\n\t\tthis.tokenizer.preventInitialFocus = true;\n\t}\n\n\tget iconsCount() {\n\t\treturn super.iconsCount + (this.showValueHelpIcon ? 1 : 0);\n\t}\n\n\tget tokenizer() {\n\t\treturn this.shadowRoot!.querySelector<Tokenizer>(\"[ui5-tokenizer]\")!;\n\t}\n\n\tget tokenizerExpanded() {\n\t\treturn this.tokenizer && this.tokenizer.expanded;\n\t}\n\n\tget _tokensCountText() {\n\t\treturn getTokensCountText(this.tokens.length);\n\t}\n\n\tget _valueHelpText() {\n\t\treturn MultiInput.i18nBundle.getText(MULTIINPUT_VALUE_HELP);\n\t}\n\n\tget _filterButtonAccessibleName() {\n\t\treturn MultiInput.i18nBundle.getText(MULTIINPUT_FILTER_BUTTON_LABEL);\n\t}\n\n\tget _tokensCountTextId() {\n\t\treturn `hiddenText-nMore`;\n\t}\n\n\tget _valueHelpTextId() {\n\t\treturn this.showValueHelpIcon ? `hiddenText-value-help` : \"\";\n\t}\n\n\t/\n\t Returns the placeholder value when there are no tokens.\n\t * @protected\n\t /\n\tget _placeholder() {\n\t\tif (this.tokens.length) {\n\t\t\treturn \"\";\n\t\t}\n\n\t\treturn this.placeholder;\n\t}\n\n\tget accInfo() {\n\t\tconst ariaDescribedBy = `${this._tokensCountTextId} ${this.suggestionsTextId} ${this.valueStateTextId} ${this._valueStateLinksShortcutsTextAccId} ${this._valueHelpTextId}`.trim();\n\t\treturn {\n\t\t\t...super.accInfo,\n\t\t\t\"ariaRoledescription\": this.ariaRoleDescription,\n\t\t\t\"ariaDescribedBy\": ariaDescribedBy,\n\t\t};\n\t}\n\n\tget valueHelpLabel() {\n\t\treturn MultiInput.i18nBundle.getText(MULTIINPUT_VALUE_HELP_LABEL);\n\t}\n\n\tget ariaRoleDescription() {\n\t\treturn MultiInput.i18nBundle.getText(MULTIINPUT_ROLEDESCRIPTION_TEXT);\n\t}\n\n\tget morePopoverOpener(): HTMLElement {\n\t\tif (this.tokens.length === 1 && this.tokens[0].isTruncatable) {\n\t\t\treturn this.tokens[0];\n\t\t}\n\n\t\treturn this;\n\t}\n\n\tget shouldDisplayOnlyValueStateMessage() {\n\t\treturn this.hasValueStateMessage && !this.readonly && !this.open && this.focused && !this.tokenizer.open;\n\t}\n\n\t/\n\t Computes the effective state for showing tokens in suggestions.\n\t * Returns false (show suggestions) by default, true only when explicitly set.\n\t */\n\tget _effectiveShowTokensInSuggestions() {\n\t\t// If no tokens exist, always show suggestions\n\t\tif (this.tokens.length === 0) {\n\t\t\treturn false;\n\t\t}\n\n\t\t// Return the current state (will be true on mobile after picker opens, false otherwise)\n\t\treturn this._showTokensInSuggestions;\n\t}\n}\n\nMultiInput.define();\n\nexport default MultiInput;\nexport type {\n\tIToken,\n\tMultiInputTokenDeleteEventDetail,\n\tMultiInputSelectionChangeEventDetail,\n};\n"]}
1	+ {"version":3,"file":"MultiInput.js","sourceRoot":"","sources":["../src/MultiInput.ts"],"names":[],"mappings":"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","sourcesContent":["import type UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot-strict.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 {\n\tisShow,\n\tisBackSpace,\n\tisLeft,\n\tisRight,\n\tisRightCtrl,\n\tisHome,\n\tisEnd,\n\tisDown,\n\tisEnter,\n\tisTabNext,\n} from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport { isPhone } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport type { ITabbable } from \"@ui5/webcomponents-base/dist/delegate/ItemNavigation.js\";\nimport type { IFormInputElement } from \"@ui5/webcomponents-base/dist/features/InputElementsFormSupport.js\";\nimport {\n\tMULTIINPUT_ROLEDESCRIPTION_TEXT,\n\tMULTIINPUT_VALUE_HELP_LABEL,\n\tMULTIINPUT_VALUE_HELP,\n\tFORM_MIXED_TEXTFIELD_REQUIRED,\n\tMULTIINPUT_FILTER_BUTTON_LABEL,\n} from \"./generated/i18n/i18n-defaults.js\";\nimport Input from \"./Input.js\";\nimport MultiInputTemplate from \"./MultiInputTemplate.js\";\nimport styles from \"./generated/themes/MultiInput.css.js\";\nimport type Token from \"./Token.js\";\nimport type Tokenizer from \"./Tokenizer.js\";\nimport { getTokensCountText } from \"./Tokenizer.js\";\nimport type { TokenizerTokenDeleteEventDetail } from \"./Tokenizer.js\";\n\nimport type {\n\tInputSelectionChangeEventDetail as MultiInputSelectionChangeEventDetail,\n} from \"./Input.js\";\nimport type { Slot } from \"@ui5/webcomponents-base/dist/UI5Element.js\";\n\ninterface IToken extends UI5Element, ITabbable {\n\ttext?: string;\n\treadonly: boolean,\n\tselected: boolean,\n\tisTruncatable: boolean,\n}\n\ntype MultiInputTokenDeleteEventDetail = {\n\ttokens: Token[];\n}\n\n/*\n @class\n * ### Overview\n * A `ui5-multi-input` field allows the user to enter multiple values, which are displayed as `ui5-token`.\n \n User can choose interaction for creating tokens.\n * Fiori Guidelines say that user should create tokens when:\n \n - Type a value in the input and press enter or focus out the input field (`change` event is fired)\n * - Move between suggestion items (`selection-change` event is fired)\n * - Clicking on a suggestion item (`selection-change` event is fired if the clicked item is different than the current value. Also `change` event is fired )\n \n ### ES6 Module Import\n \n `import \"@ui5/webcomponents/dist/MultiInput.js\";`\n * @constructor\n * @extends Input\n * @since 1.0.0-rc.9\n * @public\n /\n@customElement({\n\ttag: \"ui5-multi-input\",\n\trenderer: jsxRenderer,\n\tformAssociated: true,\n\ttemplate: MultiInputTemplate,\n\tstyles: [Input.styles, styles],\n})\n/\n Fired when the value help icon is pressed\n * and F4 or ALT/OPTION + ARROW_UP/ARROW_DOWN keyboard keys are used.\n * @public\n /\n@event(\"value-help-trigger\", {\n\tbubbles: true,\n})\n\n/\n Fired when tokens are being deleted.\n * @param {Array} tokens An array containing the deleted tokens.\n * @public\n /\n@event(\"token-delete\", {\n\tbubbles: true,\n})\n\nclass MultiInput extends Input implements IFormInputElement {\n\teventDetails!: Input[\"eventDetails\"] & {\n\t\t\"value-help-trigger\": void,\n\t\t\"token-delete\": MultiInputTokenDeleteEventDetail,\n\t}\n\t/\n\t Determines whether a value help icon will be visualized in the end of the input.\n\t * Pressing the icon will fire `value-help-trigger` event.\n\t * @default false\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\tshowValueHelpIcon = false;\n\n\t/\n\t Indicates whether the tokenizer has tokens\n\t * @default false\n\t * @private\n\t /\n\t@property({ type: Boolean })\n\ttokenizerAvailable = false;\n\n\t/\n\t Determines the name by which the component will be identified upon submission in an HTML form.\n\t \n\t Note: This property is only applicable within the context of an HTML Form element.\n\t * Note: When the component is used inside a form element,\n\t * the value is sent as the first element in the form data, even if it's empty.\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\tdeclare name?: string;\n\n\t/\n\t Indicates whether to show tokens in suggestions popover\n\t * @default false\n\t * @private\n\t /\n\t@property({ type: Boolean })\n\t_showTokensInSuggestions = false;\n\n\t/\n\t Tracks whether user has explicitly toggled the show tokens state\n\t * @default false\n\t * @private\n\t /\n\t@property({ type: Boolean })\n\t_userToggledShowTokens = false;\n\n\t/\n\t Defines the component tokens.\n\t * @public\n\t /\n\t@slot({ type: HTMLElement, individualSlots: true })\n\ttokens!: Slot<IToken>;\n\n\t_skipOpenSuggestions: boolean;\n\t_valueHelpIconPressed: boolean;\n\t_focusInTokenizer: boolean;\n\n\tget formValidityMessage() {\n\t\treturn MultiInput.i18nBundle.getText(FORM_MIXED_TEXTFIELD_REQUIRED);\n\t}\n\n\tget formValidity(): ValidityStateFlags {\n\t\tconst tokens = (this.tokens \|\| []);\n\n\t\treturn { valueMissing: this.required && !this.value && !tokens.length };\n\t}\n\n\tget formFormattedValue(): FormData \| string \| null {\n\t\tconst tokens = (this.tokens \|\| []);\n\n\t\tif (tokens.length && this.name) {\n\t\t\tconst formData = new FormData();\n\n\t\t\tformData.append(this.name, this.value);\n\n\t\t\tfor (let i = 0; i < tokens.length; i++) {\n\t\t\t\tformData.append(this.name, (tokens[i].text \|\| \"\"));\n\t\t\t}\n\n\t\t\treturn formData;\n\t\t}\n\n\t\treturn this.value;\n\t}\n\n\tconstructor() {\n\t\tsuper();\n\n\t\t// Prevent suggestions' opening.\n\t\tthis._skipOpenSuggestions = false;\n\t\tthis._valueHelpIconPressed = false;\n\t\tthis._focusInTokenizer = false;\n\t}\n\n\tvalueHelpPress() {\n\t\tthis.closeValueStatePopover();\n\t\tthis.fireDecoratorEvent(\"value-help-trigger\");\n\t}\n\n\ttokenDelete(e: CustomEvent<TokenizerTokenDeleteEventDetail>) {\n\t\tconst deletedTokens = e.detail.tokens;\n\t\tconst selectedTokens = this.tokens.filter(token => token.selected);\n\t\tconst shouldFocusInput = this.tokens.length - 1 === 0 \|\| this.tokens.length === selectedTokens.length;\n\n\t\tif (this._readonly) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (deletedTokens) {\n\t\t\tthis.fireDecoratorEvent(\"token-delete\", { tokens: deletedTokens });\n\n\t\t\tif (shouldFocusInput) {\n\t\t\t\tthis.focus();\n\t\t\t}\n\t\t}\n\t}\n\n\tvalueHelpMouseDown(e: MouseEvent) {\n\t\te.preventDefault();\n\t\tthis.focus();\n\t\tthis.closeValueStatePopover();\n\t\tthis.tokenizer.open = false;\n\t\tthis._valueHelpIconPressed = true;\n\t}\n\n\t_tokenizerFocusOut(e: FocusEvent) {\n\t\tif (!this.contains(e.relatedTarget as HTMLElement) && !this.shadowRoot!.contains(e.relatedTarget as HTMLElement)) {\n\t\t\tthis.tokenizer._tokens.forEach(token => { token.selected = false; });\n\t\t}\n\t\tthis._focusInTokenizer = false;\n\t}\n\n\tvalueHelpMouseUp() {\n\t\tsetTimeout(() => {\n\t\t\tthis._valueHelpIconPressed = false;\n\t\t}, 0);\n\t}\n\n\tinnerFocusIn() {\n\t\tthis.focused = true;\n\t\tthis.tokenizer._scrollToEndOnExpand = true;\n\t\tthis.tokenizer.expanded = true;\n\t\tthis.tokens.forEach(token => {\n\t\t\ttoken.selected = false;\n\t\t});\n\t}\n\n\t_showMoreItemsPress() {\n\t\tthis.tokenizer._scrollToEndOnExpand = true;\n\t}\n\n\t_onkeydown(e: KeyboardEvent) {\n\t\t!this._isComposing && super._onkeydown(e);\n\t\tthis._isKeyNavigation = true;\n\n\t\tconst target = e.target as HTMLInputElement;\n\t\tconst isHomeInBeginning = isHome(e) && target.selectionStart === 0;\n\n\t\tif (isHomeInBeginning) {\n\t\t\tthis._skipOpenSuggestions = true; // Prevent input focus when navigating through the tokens\n\t\t\treturn this._focusFirstToken(e);\n\t\t}\n\n\t\tif (isLeft(e)) {\n\t\t\tthis._skipOpenSuggestions = true;\n\t\t\treturn this._handleLeft(e);\n\t\t}\n\n\t\tif (isBackSpace(e)) {\n\t\t\tthis._skipOpenSuggestions = true;\n\t\t\treturn this._handleBackspace(e);\n\t\t}\n\n\t\tthis._skipOpenSuggestions = false;\n\n\t\tif ((isEnter(e) \|\| isTabNext(e)) && this.previousValue !== this.value) {\n\t\t\tthis._handleChange();\n\t\t\treturn;\n\t\t}\n\n\t\tif (isShow(e)) {\n\t\t\tthis.valueHelpPress();\n\t\t}\n\n\t\tthis._isKeyNavigation = false;\n\t}\n\n\t_onTokenizerKeydown(e: KeyboardEvent) {\n\t\tconst rightCtrl = isRightCtrl(e);\n\t\tif (isRight(e) \|\| isDown(e) \|\| isEnd(e) \|\| rightCtrl) {\n\t\t\te.preventDefault();\n\t\t\tconst lastTokenIndex = this.tokens.length - 1;\n\n\t\t\tif (e.target === this.tokens[lastTokenIndex] && this.tokens[lastTokenIndex] === document.activeElement) {\n\t\t\t\tsetTimeout(() => {\n\t\t\t\t\tthis.focus();\n\t\t\t\t}, 0);\n\t\t\t}\n\t\t}\n\t}\n\n\t_handleLeft(e: KeyboardEvent) {\n\t\tconst cursorPosition = this.getDomRef()!.querySelector(`input`)!.selectionStart;\n\t\tconst tokens = this.tokens;\n\t\tconst lastToken = tokens.length && tokens[tokens.length - 1];\n\n\t\t// selectionStart property applies only to inputs of types text, search, URL, tel, and password\n\t\tif (((cursorPosition === null && !this.value) \|\| cursorPosition === 0) && lastToken) {\n\t\t\te.preventDefault();\n\t\t\tthis._focusToken(lastToken);\n\t\t}\n\t}\n\n\t_focusToken(tokenToFocus: IToken) {\n\t\tthis._focusInTokenizer = true;\n\t\ttokenToFocus.focus();\n\t\tthis.tokenizer._itemNav.setCurrentItem(tokenToFocus);\n\t}\n\n\t/\n\t @override\n\t /\n\t_handleChange() {\n\t\tif (this._focusInTokenizer) {\n\t\t\treturn;\n\t\t}\n\n\t\tsuper._handleChange();\n\t}\n\n\t_handleBackspace(e: KeyboardEvent) {\n\t\tconst tokens = this.tokens;\n\t\tconst lastToken = tokens.length && tokens[tokens.length - 1];\n\n\t\t// Only move focus to the last token if the input is empty\n\t\tif (!this.value && lastToken) {\n\t\t\te.preventDefault();\n\t\t\tthis._focusToken(lastToken);\n\t\t}\n\t}\n\n\t_focusFirstToken(e: KeyboardEvent) {\n\t\tconst tokens = this.tokens;\n\t\tconst firstToken = tokens.length && tokens[0];\n\n\t\tif (firstToken) {\n\t\t\te.preventDefault();\n\t\t\tthis._focusToken(firstToken);\n\t\t}\n\t}\n\n\t_onfocusout(e: FocusEvent) {\n\t\tsuper._onfocusout(e);\n\t\tconst relatedTarget = e.relatedTarget as HTMLElement;\n\t\tconst insideDOM = this.contains(relatedTarget);\n\t\tconst insideShadowDom = this.shadowRoot!.contains(relatedTarget);\n\n\t\tconst hasTokenToBeDeleted = this.tokenizer._tokens.some(token => token.toBeDeleted);\n\n\t\tif (!insideDOM && !insideShadowDom && !hasTokenToBeDeleted) {\n\t\t\tthis.tokenizer.expanded = false;\n\t\t}\n\n\t\tif (this.contains(relatedTarget) && relatedTarget.hasAttribute(\"ui5-token\")) {\n\t\t\tthis.focused = false;\n\t\t}\n\t}\n\n\t/\n\t @override\n\t /\n\t_onfocusin(e: FocusEvent) {\n\t\tconst inputDomRef = this.getInputDOMRef();\n\t\tconst wasTokenFocused = e.relatedTarget instanceof HTMLElement && e.relatedTarget.hasAttribute(\"ui5-token\");\n\n\t\tif (e.target === inputDomRef) {\n\t\t\tif (wasTokenFocused) {\n\t\t\t\tthis.focused = true;\n\t\t\t\tthis.open = true;\n\t\t\t\tthis._inputIconFocused = false;\n\t\t\t\tthis._focusedAfterClear = false;\n\t\t\t} else {\n\t\t\t\tsuper._onfocusin(e);\n\t\t\t}\n\t\t}\n\t}\n\n\tonBeforeRendering() {\n\t\tsuper.onBeforeRendering();\n\n\t\tthis.style.setProperty(\"--_ui5-input-icons-count\", `${this.iconsCount}`);\n\t\tthis.tokenizerAvailable = this.tokens && this.tokens.length > 0;\n\n\t\tif (this.tokenizer) {\n\t\t\tthis.tokenizer.readonly = this.readonly;\n\n\t\t\t// Set the CSS variable on the tokenizer element so it's available in the shadow DOM\n\t\t\tthis.tokenizer.style.setProperty(\"--_ui5-input-icons-count\", `${this.iconsCount}`);\n\t\t}\n\t}\n\n\t/\n\t Override the _handlePickerAfterOpen method to handle token display based on device type\n\t /\n\t_handlePickerAfterOpen() {\n\t\tif (this.tokens.length > 0) {\n\t\t\t// On mobile: show tokens by default (for filter dialog feature)\n\t\t\t// On desktop: keep showing suggestions (default behavior)\n\t\t\tif (isPhone()) {\n\t\t\t\tthis._showTokensInSuggestions = true;\n\t\t\t}\n\t\t\tthis._userToggledShowTokens = false;\n\n\t\t\t// Expand tokenizer to show all tokens and prevent cut-off\n\t\t\tthis.tokenizer._scrollToEndOnExpand = true;\n\t\t\tthis.tokenizer.expanded = true;\n\t\t}\n\n\t\tsuper._handlePickerAfterOpen();\n\t}\n\n\tonAfterRendering() {\n\t\tsuper.onAfterRendering();\n\n\t\tthis.tokenizer.preventInitialFocus = true;\n\t}\n\n\tget iconsCount() {\n\t\treturn super.iconsCount + (this.showValueHelpIcon ? 1 : 0);\n\t}\n\n\tget tokenizer() {\n\t\treturn this.shadowRoot!.querySelector<Tokenizer>(\"[ui5-tokenizer]\")!;\n\t}\n\n\tget tokenizerExpanded() {\n\t\treturn this.tokenizer && this.tokenizer.expanded;\n\t}\n\n\tget _tokensCountText() {\n\t\treturn getTokensCountText(this.tokens.length);\n\t}\n\n\tget _valueHelpText() {\n\t\treturn MultiInput.i18nBundle.getText(MULTIINPUT_VALUE_HELP);\n\t}\n\n\tget _filterButtonAccessibleName() {\n\t\treturn MultiInput.i18nBundle.getText(MULTIINPUT_FILTER_BUTTON_LABEL);\n\t}\n\n\tget _tokensCountTextId() {\n\t\treturn `hiddenText-nMore`;\n\t}\n\n\tget _valueHelpTextId() {\n\t\treturn this.showValueHelpIcon ? `hiddenText-value-help` : \"\";\n\t}\n\n\t/\n\t Returns the placeholder value when there are no tokens.\n\t * @protected\n\t /\n\tget _placeholder() {\n\t\tif (this.tokens.length) {\n\t\t\treturn \"\";\n\t\t}\n\n\t\treturn this.placeholder;\n\t}\n\n\tget accInfo() {\n\t\tconst ariaDescribedBy = `${this._tokensCountTextId} ${this.suggestionsTextId} ${this.valueStateTextId} ${this._valueStateLinksShortcutsTextAccId} ${this._valueHelpTextId}`.trim();\n\t\treturn {\n\t\t\t...super.accInfo,\n\t\t\t\"ariaRoledescription\": this.ariaRoleDescription,\n\t\t\t\"ariaDescribedBy\": ariaDescribedBy,\n\t\t};\n\t}\n\n\tget valueHelpLabel() {\n\t\treturn MultiInput.i18nBundle.getText(MULTIINPUT_VALUE_HELP_LABEL);\n\t}\n\n\tget ariaRoleDescription() {\n\t\treturn MultiInput.i18nBundle.getText(MULTIINPUT_ROLEDESCRIPTION_TEXT);\n\t}\n\n\tget morePopoverOpener(): HTMLElement {\n\t\tif (this.tokens.length === 1 && this.tokens[0].isTruncatable) {\n\t\t\treturn this.tokens[0];\n\t\t}\n\n\t\treturn this;\n\t}\n\n\tget shouldDisplayOnlyValueStateMessage() {\n\t\treturn this.hasValueStateMessage && !this.readonly && !this.open && this.focused && !this.tokenizer.open;\n\t}\n\n\t/\n\t Computes the effective state for showing tokens in suggestions.\n\t * Returns false (show suggestions) by default, true only when explicitly set.\n\t */\n\tget _effectiveShowTokensInSuggestions() {\n\t\t// If no tokens exist, always show suggestions\n\t\tif (this.tokens.length === 0) {\n\t\t\treturn false;\n\t\t}\n\n\t\t// Return the current state (will be true on mobile after picker opens, false otherwise)\n\t\treturn this._showTokensInSuggestions;\n\t}\n}\n\nMultiInput.define();\n\nexport default MultiInput;\nexport type {\n\tIToken,\n\tMultiInputTokenDeleteEventDetail,\n\tMultiInputSelectionChangeEventDetail,\n};\n"]}

package/dist/Panel.d.ts CHANGED Viewed

@@ -58,7 +58,8 @@ import type PanelAccessibleRole from "./types/PanelAccessibleRole.js";
  * @extends UI5Element
  * @public
  * @slot {Array<Node>} default - Defines the content of the component. The content is visible only when the component is expanded.
- * @csspart header - Used to style the wrapper of the header.
+ * @csspart header-wrapper - Used to style the outermost header wrapper, useful for adjusting sticky header position.
+ * @csspart header - Used to style the header.
  * @csspart content - Used to style the wrapper of the content.
  */
 declare class Panel extends UI5Element {
@@ -142,12 +143,6 @@ declare class Panel extends UI5Element {
     _animationRunning: boolean;
     _pendingToggle: boolean;
     _touched: boolean;
-    /**
-     * Indicates whether the content area should be focusable.
-     * This is true when content is scrollable and has no focusable children.
-     * @private
-     */
-    _contentFocusable: boolean;
     /**
      * Defines the component header area.
      *
@@ -157,7 +152,6 @@ declare class Panel extends UI5Element {
     header: Slot<HTMLElement>;
     static i18nBundle: I18nBundle;
     onBeforeRendering(): void;
-    onAfterRendering(): void;
     shouldToggle(element: HTMLElement): boolean;
     get shouldNotAnimate(): boolean;
     _isMobile(): void;
@@ -168,21 +162,6 @@ declare class Panel extends UI5Element {
     _headerKeyUp(e: KeyboardEvent): void;
     _toggleOpen(): void;
     _headerOnTarget(target: HTMLElement): boolean;
-    /**
-     * Updates the focusability of the content area.
-     * Content becomes focusable when:
-     * - Panel is expanded (not collapsed)
-     * - Content is scrollable (scrollHeight > clientHeight or scrollWidth > clientWidth)
-     * - No focusable children exist inside
-     * @private
-     */
-    _updateContentFocusable(): void;
-    /**
-     * Returns the tabindex for the content area.
-     * Returns 0 when content should be focusable, undefined otherwise (removes attribute).
-     * @private
-     */
-    get _contentTabIndex(): number | undefined;
     get toggleButtonTitle(): string;
     get expanded(): boolean;
     get accRole(): Lowercase<PanelAccessibleRole>;

package/dist/Panel.js CHANGED Viewed

@@ -18,7 +18,6 @@ import AnimationMode from "@ui5/webcomponents-base/dist/types/AnimationMode.js";
 import { getAnimationMode } from "@ui5/webcomponents-base/dist/config/AnimationMode.js";
 import { supportsTouch } from "@ui5/webcomponents-base/dist/Device.js";
 import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js";
-import { getTabbableElements } from "@ui5/webcomponents-base/dist/util/TabbableElements.js";
 import PanelTemplate from "./PanelTemplate.js";
 import { PANEL_ICON } from "./generated/i18n/i18n-defaults.js";
 // Styles
@@ -76,7 +75,8 @@ import panelCss from "./generated/themes/Panel.css.js";
  * @extends UI5Element
  * @public
  * @slot {Array<Node>} default - Defines the content of the component. The content is visible only when the component is expanded.
- * @csspart header - Used to style the wrapper of the header.
+ * @csspart header-wrapper - Used to style the outermost header wrapper, useful for adjusting sticky header position.
+ * @csspart header - Used to style the header.
  * @csspart content - Used to style the wrapper of the content.
  */
 let Panel = Panel_1 = class Panel extends UI5Element {
@@ -143,12 +143,6 @@ let Panel = Panel_1 = class Panel extends UI5Element {
         this._animationRunning = false;
         this._pendingToggle = false;
         this._touched = false;
-        /**
-         * Indicates whether the content area should be focusable.
-         * This is true when content is scrollable and has no focusable children.
-         * @private
-         */
-        this._contentFocusable = false;
     }
     onBeforeRendering() {
         // If the animation is running, it will set the content expanded state at the end
@@ -157,9 +151,6 @@ let Panel = Panel_1 = class Panel extends UI5Element {
         }
         this._hasHeader = !!this.header.length;
     }
-    onAfterRendering() {
-        this._updateContentFocusable();
-    }
     shouldToggle(element) {
         const customContent = this.header.length;
         if (customContent) {
@@ -250,44 +241,6 @@ let Panel = Panel_1 = class Panel extends UI5Element {
     _headerOnTarget(target) {
         return target.classList.contains("sapMPanelWrappingDiv");
     }
-    /**
-     * Updates the focusability of the content area.
-     * Content becomes focusable when:
-     * - Panel is expanded (not collapsed)
-     * - Content is scrollable (scrollHeight > clientHeight or scrollWidth > clientWidth)
-     * - No focusable children exist inside
-     * @private
-     */
-    _updateContentFocusable() {
-        // Not focusable when collapsed
-        if (this.collapsed) {
-            this._contentFocusable = false;
-            return;
-        }
-        const contentDom = this.shadowRoot?.querySelector(".ui5-panel-content");
-        if (!contentDom) {
-            this._contentFocusable = false;
-            return;
-        }
-        // Check if scrollable (vertical OR horizontal)
-        const isScrollable = contentDom.scrollHeight > contentDom.clientHeight
-            || contentDom.scrollWidth > contentDom.clientWidth;
-        if (!isScrollable) {
-            this._contentFocusable = false;
-            return;
-        }
-        // Check for focusable children (synchronous)
-        const tabbables = getTabbableElements(contentDom);
-        this._contentFocusable = tabbables.length === 0;
-    }
-    /**
-     * Returns the tabindex for the content area.
-     * Returns 0 when content should be focusable, undefined otherwise (removes attribute).
-     * @private
-     */
-    get _contentTabIndex() {
-        return this._contentFocusable ? 0 : undefined;
-    }
     get toggleButtonTitle() {
         return Panel_1.i18nBundle.getText(PANEL_ICON);
     }
@@ -385,9 +338,6 @@ __decorate([
 __decorate([
     property({ type: Boolean })
 ], Panel.prototype, "_touched", void 0);
-__decorate([
-    property({ type: Boolean, noAttribute: true })
-], Panel.prototype, "_contentFocusable", void 0);
 __decorate([
     slot()
 ], Panel.prototype, "header", void 0);

package/dist/Panel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Panel.js","sourceRoot":"","sources":["../src/Panel.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport type { Slot } from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot-strict.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport slideDown from \"@ui5/webcomponents-base/dist/animations/slideDown.js\";\nimport slideUp from \"@ui5/webcomponents-base/dist/animations/slideUp.js\";\nimport { isSpace, isEnter, isEscape } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport AnimationMode from \"@ui5/webcomponents-base/dist/types/AnimationMode.js\";\nimport { getAnimationMode } from \"@ui5/webcomponents-base/dist/config/AnimationMode.js\";\nimport { supportsTouch } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type { UI5CustomEvent } from \"@ui5/webcomponents-base\";\nimport { getTabbableElements } from \"@ui5/webcomponents-base/dist/util/TabbableElements.js\";\nimport type TitleLevel from \"./types/TitleLevel.js\";\nimport type Button from \"./Button.js\";\nimport type PanelAccessibleRole from \"./types/PanelAccessibleRole.js\";\nimport PanelTemplate from \"./PanelTemplate.js\";\nimport { PANEL_ICON } from \"./generated/i18n/i18n-defaults.js\";\n\n// Styles\nimport panelCss from \"./generated/themes/Panel.css.js\";\n\n/*\n @class\n \n ### Overview\n \n The `ui5-panel` component is a container which has a header and a\n * content area and is used\n * for grouping and displaying information. It can be collapsed to save space on the screen.\n \n ### Guidelines:\n \n - Nesting two or more panels is not recommended.\n * - Do not stack too many panels on one page.\n \n ### Structure\n * The panel's header area consists of a title bar with a header text or custom header.\n \n The header is clickable and can be used to toggle between the expanded and collapsed state. It includes an icon which rotates depending on the state.\n \n The custom header can be set through the `header` slot and it may contain arbitraray content, such as: title, buttons or any other HTML elements.\n \n The content area can contain an arbitrary set of controls.\n \n Note: The custom header is not clickable out of the box, but in this case the icon is interactive and allows to show/hide the content area.\n \n ### Responsive Behavior\n \n - If the width of the panel is set to 100% (default), the panel and its children are\n * resized responsively,\n * depending on its parent container.\n * - If the panel has a fixed height, it will take up the space even if the panel is\n * collapsed.\n * - When the panel is expandable (the `fixed` property is set to `false`),\n * an arrow icon (pointing to the right) appears in front of the header.\n * - When the animation is activated, expand/collapse uses a smooth animation to open or\n * close the content area.\n * - When the panel expands/collapses, the arrow icon rotates 90 degrees\n * clockwise/counter-clockwise.\n \n ### Keyboard Handling\n \n #### Fast Navigation\n * 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].\n * In order to use this functionality, you need to import the following module:\n * `import \"@ui5/webcomponents-base/dist/features/F6Navigation.js\"`\n \n ### ES6 Module Import\n \n `import \"@ui5/webcomponents/dist/Panel.js\";`\n * @constructor\n * @extends UI5Element\n * @public\n * @slot {Array<Node>} default - Defines the content of the component. The content is visible only when the component is expanded.\n * @csspart header - Used to style the wrapper of the header.\n * @csspart content - Used to style the wrapper of the content.\n /\n@customElement({\n\ttag: \"ui5-panel\",\n\tfastNavigation: true,\n\tlanguageAware: true,\n\trenderer: jsxRenderer,\n\ttemplate: PanelTemplate,\n\tstyles: panelCss,\n})\n/\n Fired when the component is expanded/collapsed by user interaction.\n * @public\n /\n@event(\"toggle\", {\n\tbubbles: true,\n})\nclass Panel extends UI5Element {\n\teventDetails!: {\n\t\ttoggle: void,\n\t}\n\t/\n\t This property is used to set the header text of the component.\n\t * The text is visible in both expanded and collapsed states.\n\t \n\t Note: This property is overridden by the `header` slot.\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\theaderText?: string;\n\n\t/\n\t Determines whether the component is in a fixed state that is not\n\t * expandable/collapsible by user interaction.\n\t * @default false\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\tfixed = false;\n\n\t/\n\t Indicates whether the component is collapsed and only the header is displayed.\n\t * @default false\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\tcollapsed = false;\n\n\t/\n\t Indicates whether the transition between the expanded and the collapsed state of the component is animated. By default the animation is enabled.\n\t * @default false\n\t * @public\n\t * @since 1.0.0-rc.16\n\t /\n\t@property({ type: Boolean })\n\tnoAnimation = false;\n\n\t/\n\t Sets the accessible ARIA role of the component.\n\t * Depending on the usage, you can change the role from the default `Form`\n\t * to `Region` or `Complementary`.\n\t * @default \"Form\"\n\t * @public\n\t /\n\t@property()\n\taccessibleRole: `${PanelAccessibleRole}` = \"Form\";\n\n\t/\n\t Defines the \"aria-level\" of component heading,\n\t * set by the `headerText`.\n\t * @default \"H2\"\n\t * @public\n\t/\n\t@property()\n\theaderLevel: `${TitleLevel}` = \"H2\";\n\n\t/\n\t Defines the accessible ARIA name of the component.\n\t * @default undefined\n\t * @public\n\t * @since 1.0.0-rc.15\n\t /\n\t@property()\n\taccessibleName?: string;\n\n\t/\n\t Indicates whether the Panel header is sticky or not.\n\t * If stickyHeader is set to true, then whenever you scroll the content or\n\t * the application, the header of the panel will be always visible and\n\t * a solid color will be used for its design.\n\t * @default false\n\t * @public\n\t * @since 1.16.0-rc.1\n\t /\n\t@property({ type: Boolean })\n\tstickyHeader = false;\n\n\t/\n\t When set to `true`, the `accessibleName` property will be\n\t * applied not only on the panel root itself, but on its toggle button too.\n\t * Note: This property only has effect if `accessibleName` is set and a header slot is provided.\n\t * @default false\n\t * @private\n\t /\n\t@property({ type: Boolean })\n\tuseAccessibleNameForToggleButton = false;\n\n\t/\n\t @private\n\t /\n\t@property({ type: Boolean })\n\t_hasHeader = false;\n\n\t@property({ type: Boolean, noAttribute: true })\n\t_contentExpanded = false;\n\n\t@property({ type: Boolean, noAttribute: true })\n\t_animationRunning = false;\n\n\t@property({ type: Boolean, noAttribute: true })\n\t_pendingToggle = false;\n\n\t@property({ type: Boolean })\n\t_touched = false;\n\n\t/\n\t Indicates whether the content area should be focusable.\n\t * This is true when content is scrollable and has no focusable children.\n\t * @private\n\t /\n\t@property({ type: Boolean, noAttribute: true })\n\t_contentFocusable = false;\n\n\t/\n\t Defines the component header area.\n\t \n\t Note: When a header is provided, the `headerText` property is ignored.\n\t * @public\n\t /\n\t@slot()\n\theader!: Slot<HTMLElement>;\n\n\t@i18n(\"@ui5/webcomponents\")\n\tstatic i18nBundle: I18nBundle;\n\n\tonBeforeRendering() {\n\t\t// If the animation is running, it will set the content expanded state at the end\n\t\tif (!this._animationRunning) {\n\t\t\tthis._contentExpanded = !this.collapsed;\n\t\t}\n\n\t\tthis._hasHeader = !!this.header.length;\n\t}\n\n\tonAfterRendering() {\n\t\tthis._updateContentFocusable();\n\t}\n\n\tshouldToggle(element: HTMLElement): boolean {\n\t\tconst customContent = this.header.length;\n\t\tif (customContent) {\n\t\t\treturn element.classList.contains(\"ui5-panel-header-button\");\n\t\t}\n\t\treturn true;\n\t}\n\n\tget shouldNotAnimate() {\n\t\treturn this.noAnimation \|\| getAnimationMode() === AnimationMode.None;\n\t}\n\n\t_isMobile() {\n\t\tif (supportsTouch()) {\n\t\t\tthis._touched = true;\n\t\t}\n\t}\n\n\t_headerFocusOut() {\n\t\tthis._touched = false;\n\t}\n\n\t_headerClick(e: MouseEvent) {\n\t\tif (!this.shouldToggle(e.target as HTMLElement)) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._toggleOpen();\n\t}\n\n\t_toggleButtonClick(e: UI5CustomEvent<Button, \"click\">) {\n\t\tif (e.detail.originalEvent.x === 0 && e.detail.originalEvent.y === 0) {\n\t\t\te.stopImmediatePropagation();\n\t\t}\n\t}\n\n\t_headerKeyDown(e: KeyboardEvent) {\n\t\tif (!this.shouldToggle(e.target as HTMLElement)) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (isEnter(e)) {\n\t\t\tthis._toggleOpen();\n\t\t}\n\n\t\tif (isSpace(e)) {\n\t\t\te.preventDefault();\n\t\t\tthis._pendingToggle = true;\n\t\t}\n\n\t\t// Cancel toggle if Escape is pressed\n\t\tif (isEscape(e) && this._pendingToggle) {\n\t\t\te.preventDefault();\n\t\t\tthis._pendingToggle = false;\n\t\t}\n\t}\n\n\t_headerKeyUp(e: KeyboardEvent) {\n\t\tif (!this.shouldToggle(e.target as HTMLElement)) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (isEnter(e)) {\n\t\t\te.preventDefault();\n\t\t}\n\n\t\tif (isSpace(e)) {\n\t\t\t// Only toggle if space was pressed and escape wasn't pressed to cancel\n\t\t\tif (this._pendingToggle) {\n\t\t\t\tthis._toggleOpen();\n\t\t\t}\n\t\t\tthis._pendingToggle = false;\n\t\t}\n\t}\n\n\t_toggleOpen() {\n\t\tif (this.fixed) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.collapsed = !this.collapsed;\n\n\t\tif (this.shouldNotAnimate) {\n\t\t\tthis.fireDecoratorEvent(\"toggle\");\n\t\t\treturn;\n\t\t}\n\n\t\tthis._animationRunning = true;\n\n\t\tconst elements = this.getDomRef()!.querySelectorAll(\".ui5-panel-content\");\n\t\tconst animations: Array<Promise<void \| Error>> = [];\n\n\t\t[].forEach.call(elements, oElement => {\n\t\t\tif (this.collapsed) {\n\t\t\t\tanimations.push(slideUp(oElement).promise());\n\t\t\t} else {\n\t\t\t\tanimations.push(slideDown(oElement).promise());\n\t\t\t}\n\t\t});\n\n\t\tPromise.all(animations).then(() => {\n\t\t\tthis._animationRunning = false;\n\t\t\tthis._contentExpanded = !this.collapsed;\n\t\t\tthis.fireDecoratorEvent(\"toggle\");\n\t\t});\n\t}\n\n\t_headerOnTarget(target: HTMLElement) {\n\t\treturn target.classList.contains(\"sapMPanelWrappingDiv\");\n\t}\n\n\t/\n\t Updates the focusability of the content area.\n\t * Content becomes focusable when:\n\t * - Panel is expanded (not collapsed)\n\t * - Content is scrollable (scrollHeight > clientHeight or scrollWidth > clientWidth)\n\t * - No focusable children exist inside\n\t * @private\n\t /\n\t_updateContentFocusable() {\n\t\t// Not focusable when collapsed\n\t\tif (this.collapsed) {\n\t\t\tthis._contentFocusable = false;\n\t\t\treturn;\n\t\t}\n\n\t\tconst contentDom = this.shadowRoot?.querySelector(\".ui5-panel-content\") as HTMLElement \| null;\n\t\tif (!contentDom) {\n\t\t\tthis._contentFocusable = false;\n\t\t\treturn;\n\t\t}\n\n\t\t// Check if scrollable (vertical OR horizontal)\n\t\tconst isScrollable = contentDom.scrollHeight > contentDom.clientHeight\n\t\t\t\|\| contentDom.scrollWidth > contentDom.clientWidth;\n\n\t\tif (!isScrollable) {\n\t\t\tthis._contentFocusable = false;\n\t\t\treturn;\n\t\t}\n\n\t\t// Check for focusable children (synchronous)\n\t\tconst tabbables = getTabbableElements(contentDom);\n\t\tthis._contentFocusable = tabbables.length === 0;\n\t}\n\n\t/\n\t Returns the tabindex for the content area.\n\t * Returns 0 when content should be focusable, undefined otherwise (removes attribute).\n\t * @private\n\t */\n\tget _contentTabIndex(): number \| undefined {\n\t\treturn this._contentFocusable ? 0 : undefined;\n\t}\n\n\tget toggleButtonTitle() {\n\t\treturn Panel.i18nBundle.getText(PANEL_ICON);\n\t}\n\n\tget expanded() {\n\t\treturn !this.collapsed;\n\t}\n\n\tget accRole() {\n\t\treturn this.accessibleRole.toLowerCase() as Lowercase<PanelAccessibleRole>;\n\t}\n\n\tget effectiveAccessibleName() {\n\t\treturn typeof this.accessibleName === \"string\" && this.accessibleName.length ? this.accessibleName : undefined;\n\t}\n\n\tget accInfo() {\n\t\treturn {\n\t\t\t\"button\": {\n\t\t\t\t\"accessibilityAttributes\": {\n\t\t\t\t\t\"expanded\": this.expanded,\n\t\t\t\t},\n\t\t\t\t\"title\": this.toggleButtonTitle,\n\t\t\t\t\"ariaLabelButton\": !this.nonFocusableButton && this.useAccessibleNameForToggleButton ? this.effectiveAccessibleName : undefined,\n\t\t\t},\n\t\t\t\"ariaExpanded\": this.nonFixedInternalHeader ? this.expanded : undefined,\n\t\t\t\"ariaControls\": this.nonFixedInternalHeader ? `${this._id}-content` : undefined,\n\t\t\t\"ariaLabelledby\": this.nonFocusableButton ? this.ariaLabelledbyReference : undefined,\n\t\t\t\"role\": this.nonFixedInternalHeader ? \"button\" : undefined as \"button\" \| undefined,\n\t\t};\n\t}\n\n\tget ariaLabelledbyReference() {\n\t\treturn (this.nonFocusableButton && this.headerText && !this.fixed) ? `${this._id}-header-title` : undefined;\n\t}\n\n\tget fixedPanelAriaLabelledbyReference() {\n\t\treturn this.fixed && !this.effectiveAccessibleName ? `${this._id}-header-title` : undefined;\n\t}\n\n\tget headerAriaLevel() {\n\t\treturn Number.parseInt(this.headerLevel.slice(1));\n\t}\n\n\tget headerTabIndex() {\n\t\treturn (this.header.length \|\| this.fixed) ? -1 : 0;\n\t}\n\n\tget headingWrapperAriaLevel() {\n\t\treturn !this._hasHeader ? this.headerAriaLevel : undefined;\n\t}\n\n\tget headingWrapperRole() {\n\t\treturn !this._hasHeader ? \"heading\" : undefined;\n\t}\n\n\tget nonFixedInternalHeader() {\n\t\treturn !this._hasHeader && !this.fixed;\n\t}\n\n\tget hasHeaderOrHeaderText() {\n\t\treturn this._hasHeader \|\| this.headerText;\n\t}\n\n\tget nonFocusableButton() {\n\t\treturn !this.header.length;\n\t}\n}\n\nPanel.define();\n\nexport default Panel;\n"]}
1	+ {"version":3,"file":"Panel.js","sourceRoot":"","sources":["../src/Panel.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport type { Slot } from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot-strict.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport slideDown from \"@ui5/webcomponents-base/dist/animations/slideDown.js\";\nimport slideUp from \"@ui5/webcomponents-base/dist/animations/slideUp.js\";\nimport { isSpace, isEnter, isEscape } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport AnimationMode from \"@ui5/webcomponents-base/dist/types/AnimationMode.js\";\nimport { getAnimationMode } from \"@ui5/webcomponents-base/dist/config/AnimationMode.js\";\nimport { supportsTouch } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type { UI5CustomEvent } from \"@ui5/webcomponents-base\";\nimport type TitleLevel from \"./types/TitleLevel.js\";\nimport type Button from \"./Button.js\";\nimport type PanelAccessibleRole from \"./types/PanelAccessibleRole.js\";\nimport PanelTemplate from \"./PanelTemplate.js\";\nimport { PANEL_ICON } from \"./generated/i18n/i18n-defaults.js\";\n\n// Styles\nimport panelCss from \"./generated/themes/Panel.css.js\";\n\n/*\n @class\n \n ### Overview\n \n The `ui5-panel` component is a container which has a header and a\n * content area and is used\n * for grouping and displaying information. It can be collapsed to save space on the screen.\n \n ### Guidelines:\n \n - Nesting two or more panels is not recommended.\n * - Do not stack too many panels on one page.\n \n ### Structure\n * The panel's header area consists of a title bar with a header text or custom header.\n \n The header is clickable and can be used to toggle between the expanded and collapsed state. It includes an icon which rotates depending on the state.\n \n The custom header can be set through the `header` slot and it may contain arbitraray content, such as: title, buttons or any other HTML elements.\n \n The content area can contain an arbitrary set of controls.\n \n Note: The custom header is not clickable out of the box, but in this case the icon is interactive and allows to show/hide the content area.\n \n ### Responsive Behavior\n \n - If the width of the panel is set to 100% (default), the panel and its children are\n * resized responsively,\n * depending on its parent container.\n * - If the panel has a fixed height, it will take up the space even if the panel is\n * collapsed.\n * - When the panel is expandable (the `fixed` property is set to `false`),\n * an arrow icon (pointing to the right) appears in front of the header.\n * - When the animation is activated, expand/collapse uses a smooth animation to open or\n * close the content area.\n * - When the panel expands/collapses, the arrow icon rotates 90 degrees\n * clockwise/counter-clockwise.\n \n ### Keyboard Handling\n \n #### Fast Navigation\n * 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].\n * In order to use this functionality, you need to import the following module:\n * `import \"@ui5/webcomponents-base/dist/features/F6Navigation.js\"`\n \n ### ES6 Module Import\n \n `import \"@ui5/webcomponents/dist/Panel.js\";`\n * @constructor\n * @extends UI5Element\n * @public\n * @slot {Array<Node>} default - Defines the content of the component. The content is visible only when the component is expanded.\n * @csspart header-wrapper - Used to style the outermost header wrapper, useful for adjusting sticky header position.\n * @csspart header - Used to style the header.\n * @csspart content - Used to style the wrapper of the content.\n /\n@customElement({\n\ttag: \"ui5-panel\",\n\tfastNavigation: true,\n\tlanguageAware: true,\n\trenderer: jsxRenderer,\n\ttemplate: PanelTemplate,\n\tstyles: panelCss,\n})\n/\n Fired when the component is expanded/collapsed by user interaction.\n * @public\n /\n@event(\"toggle\", {\n\tbubbles: true,\n})\nclass Panel extends UI5Element {\n\teventDetails!: {\n\t\ttoggle: void,\n\t}\n\t/\n\t This property is used to set the header text of the component.\n\t * The text is visible in both expanded and collapsed states.\n\t \n\t Note: This property is overridden by the `header` slot.\n\t * @default undefined\n\t * @public\n\t /\n\t@property()\n\theaderText?: string;\n\n\t/\n\t Determines whether the component is in a fixed state that is not\n\t * expandable/collapsible by user interaction.\n\t * @default false\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\tfixed = false;\n\n\t/\n\t Indicates whether the component is collapsed and only the header is displayed.\n\t * @default false\n\t * @public\n\t /\n\t@property({ type: Boolean })\n\tcollapsed = false;\n\n\t/\n\t Indicates whether the transition between the expanded and the collapsed state of the component is animated. By default the animation is enabled.\n\t * @default false\n\t * @public\n\t * @since 1.0.0-rc.16\n\t /\n\t@property({ type: Boolean })\n\tnoAnimation = false;\n\n\t/\n\t Sets the accessible ARIA role of the component.\n\t * Depending on the usage, you can change the role from the default `Form`\n\t * to `Region` or `Complementary`.\n\t * @default \"Form\"\n\t * @public\n\t /\n\t@property()\n\taccessibleRole: `${PanelAccessibleRole}` = \"Form\";\n\n\t/\n\t Defines the \"aria-level\" of component heading,\n\t * set by the `headerText`.\n\t * @default \"H2\"\n\t * @public\n\t/\n\t@property()\n\theaderLevel: `${TitleLevel}` = \"H2\";\n\n\t/\n\t Defines the accessible ARIA name of the component.\n\t * @default undefined\n\t * @public\n\t * @since 1.0.0-rc.15\n\t /\n\t@property()\n\taccessibleName?: string;\n\n\t/\n\t Indicates whether the Panel header is sticky or not.\n\t * If stickyHeader is set to true, then whenever you scroll the content or\n\t * the application, the header of the panel will be always visible and\n\t * a solid color will be used for its design.\n\t * @default false\n\t * @public\n\t * @since 1.16.0-rc.1\n\t /\n\t@property({ type: Boolean })\n\tstickyHeader = false;\n\n\t/\n\t When set to `true`, the `accessibleName` property will be\n\t * applied not only on the panel root itself, but on its toggle button too.\n\t * Note: This property only has effect if `accessibleName` is set and a header slot is provided.\n\t * @default false\n\t * @private\n\t /\n\t@property({ type: Boolean })\n\tuseAccessibleNameForToggleButton = false;\n\n\t/\n\t @private\n\t /\n\t@property({ type: Boolean })\n\t_hasHeader = false;\n\n\t@property({ type: Boolean, noAttribute: true })\n\t_contentExpanded = false;\n\n\t@property({ type: Boolean, noAttribute: true })\n\t_animationRunning = false;\n\n\t@property({ type: Boolean, noAttribute: true })\n\t_pendingToggle = false;\n\n\t@property({ type: Boolean })\n\t_touched = false;\n\n\t/\n\t Defines the component header area.\n\t \n\t Note: When a header is provided, the `headerText` property is ignored.\n\t * @public\n\t */\n\t@slot()\n\theader!: Slot<HTMLElement>;\n\n\t@i18n(\"@ui5/webcomponents\")\n\tstatic i18nBundle: I18nBundle;\n\n\tonBeforeRendering() {\n\t\t// If the animation is running, it will set the content expanded state at the end\n\t\tif (!this._animationRunning) {\n\t\t\tthis._contentExpanded = !this.collapsed;\n\t\t}\n\n\t\tthis._hasHeader = !!this.header.length;\n\t}\n\n\tshouldToggle(element: HTMLElement): boolean {\n\t\tconst customContent = this.header.length;\n\t\tif (customContent) {\n\t\t\treturn element.classList.contains(\"ui5-panel-header-button\");\n\t\t}\n\t\treturn true;\n\t}\n\n\tget shouldNotAnimate() {\n\t\treturn this.noAnimation \|\| getAnimationMode() === AnimationMode.None;\n\t}\n\n\t_isMobile() {\n\t\tif (supportsTouch()) {\n\t\t\tthis._touched = true;\n\t\t}\n\t}\n\n\t_headerFocusOut() {\n\t\tthis._touched = false;\n\t}\n\n\t_headerClick(e: MouseEvent) {\n\t\tif (!this.shouldToggle(e.target as HTMLElement)) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis._toggleOpen();\n\t}\n\n\t_toggleButtonClick(e: UI5CustomEvent<Button, \"click\">) {\n\t\tif (e.detail.originalEvent.x === 0 && e.detail.originalEvent.y === 0) {\n\t\t\te.stopImmediatePropagation();\n\t\t}\n\t}\n\n\t_headerKeyDown(e: KeyboardEvent) {\n\t\tif (!this.shouldToggle(e.target as HTMLElement)) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (isEnter(e)) {\n\t\t\tthis._toggleOpen();\n\t\t}\n\n\t\tif (isSpace(e)) {\n\t\t\te.preventDefault();\n\t\t\tthis._pendingToggle = true;\n\t\t}\n\n\t\t// Cancel toggle if Escape is pressed\n\t\tif (isEscape(e) && this._pendingToggle) {\n\t\t\te.preventDefault();\n\t\t\tthis._pendingToggle = false;\n\t\t}\n\t}\n\n\t_headerKeyUp(e: KeyboardEvent) {\n\t\tif (!this.shouldToggle(e.target as HTMLElement)) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (isEnter(e)) {\n\t\t\te.preventDefault();\n\t\t}\n\n\t\tif (isSpace(e)) {\n\t\t\t// Only toggle if space was pressed and escape wasn't pressed to cancel\n\t\t\tif (this._pendingToggle) {\n\t\t\t\tthis._toggleOpen();\n\t\t\t}\n\t\t\tthis._pendingToggle = false;\n\t\t}\n\t}\n\n\t_toggleOpen() {\n\t\tif (this.fixed) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.collapsed = !this.collapsed;\n\n\t\tif (this.shouldNotAnimate) {\n\t\t\tthis.fireDecoratorEvent(\"toggle\");\n\t\t\treturn;\n\t\t}\n\n\t\tthis._animationRunning = true;\n\n\t\tconst elements = this.getDomRef()!.querySelectorAll(\".ui5-panel-content\");\n\t\tconst animations: Array<Promise<void \| Error>> = [];\n\n\t\t[].forEach.call(elements, oElement => {\n\t\t\tif (this.collapsed) {\n\t\t\t\tanimations.push(slideUp(oElement).promise());\n\t\t\t} else {\n\t\t\t\tanimations.push(slideDown(oElement).promise());\n\t\t\t}\n\t\t});\n\n\t\tPromise.all(animations).then(() => {\n\t\t\tthis._animationRunning = false;\n\t\t\tthis._contentExpanded = !this.collapsed;\n\t\t\tthis.fireDecoratorEvent(\"toggle\");\n\t\t});\n\t}\n\n\t_headerOnTarget(target: HTMLElement) {\n\t\treturn target.classList.contains(\"sapMPanelWrappingDiv\");\n\t}\n\n\tget toggleButtonTitle() {\n\t\treturn Panel.i18nBundle.getText(PANEL_ICON);\n\t}\n\n\tget expanded() {\n\t\treturn !this.collapsed;\n\t}\n\n\tget accRole() {\n\t\treturn this.accessibleRole.toLowerCase() as Lowercase<PanelAccessibleRole>;\n\t}\n\n\tget effectiveAccessibleName() {\n\t\treturn typeof this.accessibleName === \"string\" && this.accessibleName.length ? this.accessibleName : undefined;\n\t}\n\n\tget accInfo() {\n\t\treturn {\n\t\t\t\"button\": {\n\t\t\t\t\"accessibilityAttributes\": {\n\t\t\t\t\t\"expanded\": this.expanded,\n\t\t\t\t},\n\t\t\t\t\"title\": this.toggleButtonTitle,\n\t\t\t\t\"ariaLabelButton\": !this.nonFocusableButton && this.useAccessibleNameForToggleButton ? this.effectiveAccessibleName : undefined,\n\t\t\t},\n\t\t\t\"ariaExpanded\": this.nonFixedInternalHeader ? this.expanded : undefined,\n\t\t\t\"ariaControls\": this.nonFixedInternalHeader ? `${this._id}-content` : undefined,\n\t\t\t\"ariaLabelledby\": this.nonFocusableButton ? this.ariaLabelledbyReference : undefined,\n\t\t\t\"role\": this.nonFixedInternalHeader ? \"button\" : undefined as \"button\" \| undefined,\n\t\t};\n\t}\n\n\tget ariaLabelledbyReference() {\n\t\treturn (this.nonFocusableButton && this.headerText && !this.fixed) ? `${this._id}-header-title` : undefined;\n\t}\n\n\tget fixedPanelAriaLabelledbyReference() {\n\t\treturn this.fixed && !this.effectiveAccessibleName ? `${this._id}-header-title` : undefined;\n\t}\n\n\tget headerAriaLevel() {\n\t\treturn Number.parseInt(this.headerLevel.slice(1));\n\t}\n\n\tget headerTabIndex() {\n\t\treturn (this.header.length \|\| this.fixed) ? -1 : 0;\n\t}\n\n\tget headingWrapperAriaLevel() {\n\t\treturn !this._hasHeader ? this.headerAriaLevel : undefined;\n\t}\n\n\tget headingWrapperRole() {\n\t\treturn !this._hasHeader ? \"heading\" : undefined;\n\t}\n\n\tget nonFixedInternalHeader() {\n\t\treturn !this._hasHeader && !this.fixed;\n\t}\n\n\tget hasHeaderOrHeaderText() {\n\t\treturn this._hasHeader \|\| this.headerText;\n\t}\n\n\tget nonFocusableButton() {\n\t\treturn !this.header.length;\n\t}\n}\n\nPanel.define();\n\nexport default Panel;\n"]}

package/dist/PanelTemplate.js CHANGED Viewed

@@ -8,7 +8,7 @@ export default function PanelTemplate() {
                     _jsx("div", { class: {
                             "ui5-panel-heading-wrapper": true,
                             "ui5-panel-heading-wrapper-sticky": this.stickyHeader,
-                        }, role: this.headingWrapperRole, "aria-level": this.headingWrapperAriaLevel, children: _jsxs("div", { onClick: this._headerClick, onKeyDown: this._headerKeyDown, onKeyUp: this._headerKeyUp, onTouchStart: this._isMobile, onFocusOut: this._headerFocusOut, class: "ui5-panel-header", tabindex: this.headerTabIndex, role: this.accInfo.role, "aria-expanded": this.accInfo.ariaExpanded, "aria-controls": this.accInfo.ariaControls, "aria-labelledby": this.accInfo.ariaLabelledby, part: "header", children: [!this.fixed &&
+                        }, role: this.headingWrapperRole, "aria-level": this.headingWrapperAriaLevel, part: "header-wrapper", children: _jsxs("div", { onClick: this._headerClick, onKeyDown: this._headerKeyDown, onKeyUp: this._headerKeyUp, onTouchStart: this._isMobile, onFocusOut: this._headerFocusOut, class: "ui5-panel-header", tabindex: this.headerTabIndex, role: this.accInfo.role, "aria-expanded": this.accInfo.ariaExpanded, "aria-controls": this.accInfo.ariaControls, "aria-labelledby": this.accInfo.ariaLabelledby, part: "header", children: [!this.fixed &&
                                     _jsx("div", { class: "ui5-panel-header-button-root", children: this._hasHeader ?
                                             _jsx(Button, { design: "Transparent", class: "ui5-panel-header-button ui5-panel-header-button-with-icon", onClick: this._toggleButtonClick, accessibilityAttributes: this.accInfo.button.accessibilityAttributes, tooltip: this.accInfo.button.title, accessibleName: this.accInfo.button.ariaLabelButton, children: _jsx("div", { class: "ui5-panel-header-icon-wrapper", children: _jsx(Icon, { class: {
                                                             "ui5-panel-header-icon": true,
@@ -22,11 +22,8 @@ export default function PanelTemplate() {
                                                     }, name: slimArrowRight, showTooltip: true, accessibleName: this.toggleButtonTitle }) }), this._hasHeader ?
                                     _jsx("slot", { name: "header" })
                                     : // else
-                                        _jsx("div", { id: `${this._id}-header-title`, class: "ui5-panel-header-title", children: this.headerText })] }) }), _jsx("div", { class: {
-                        "ui5-panel-content-wrapper": true,
-                        "ui5-panel-content-focusable": this._contentFocusable,
-                    }, style: {
+                                        _jsx("div", { id: `${this._id}-header-title`, class: "ui5-panel-header-title", children: this.headerText })] }) }), _jsx("div", { class: "ui5-panel-content", id: `${this._id}-content`, tabindex: -1, style: {
                         display: this._contentExpanded ? "block" : "none",
-                    }, children: _jsx("div", { class: "ui5-panel-content", id: `${this._id}-content`, tabindex: this._contentTabIndex, part: "content", children: _jsx("slot", {}) }) })] }) }));
+                    }, part: "content", children: _jsx("slot", {}) })] }) }));
 }
 //# sourceMappingURL=PanelTemplate.js.map

package/dist/PanelTemplate.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PanelTemplate.js","sourceRoot":"","sources":["../src/PanelTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,MAAM,aAAa,CAAC;AACjC,OAAO,IAAI,MAAM,WAAW,CAAC;AAE7B,OAAO,cAAc,MAAM,mDAAmD,CAAC;AAE/E,MAAM,CAAC,OAAO,UAAU,aAAa;IACpC,OAAO,CAAC,4BACP,eACC,KAAK,EAAC,gBAAgB,EACtB,IAAI,EAAE,IAAI,CAAC,OAAO,gBACN,IAAI,CAAC,uBAAuB,qBACvB,IAAI,CAAC,iCAAiC,aAErD,IAAI,CAAC,qBAAqB;oBAC3B,+CAA+C;oBAC/C,cACC,KAAK,EAAE;4BACN,2BAA2B,EAAE,IAAI;4BACjC,kCAAkC,EAAE,IAAI,CAAC,YAAY;yBACrD,EACD,IAAI,EAAE,IAAI,CAAC,kBAAkB,gBACjB,IAAI,CAAC,uBAAuB,~~YAExC~~,eACC,OAAO,EAAE,IAAI,CAAC,YAAY,EAC1B,SAAS,EAAE,IAAI,CAAC,cAAc,EAC9B,OAAO,EAAE,IAAI,CAAC,YAAY,EAC1B,YAAY,EAAE,IAAI,CAAC,SAAS,EAC5B,UAAU,EAAE,IAAI,CAAC,eAAe,EAChC,KAAK,EAAC,kBAAkB,EACxB,QAAQ,EAAE,IAAI,CAAC,cAAc,EAC7B,IAAI,EAAE,IAAI,CAAC,OAAO,CAAC,IAAI,mBACR,IAAI,CAAC,OAAO,CAAC,YAAY,mBACzB,IAAI,CAAC,OAAO,CAAC,YAAY,qBACvB,IAAI,CAAC,OAAO,CAAC,cAAc,EAC5C,IAAI,EAAC,QAAQ,aAEX,CAAC,IAAI,CAAC,KAAK;oCACZ,cAAK,KAAK,EAAC,8BAA8B,YACtC,IAAI,CAAC,UAAU,CAAC,CAAC;4CAClB,KAAC,MAAM,IACN,MAAM,EAAC,aAAa,EACpB,KAAK,EAAC,2DAA2D,EACjE,OAAO,EAAE,IAAI,CAAC,kBAAkB,EAChC,uBAAuB,EAAE,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,uBAAuB,EACpE,OAAO,EAAE,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,EAClC,cAAc,EAAE,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,eAAe,YAEnD,cAAK,KAAK,EAAC,+BAA+B,YACzC,KAAC,IAAI,IACJ,KAAK,EAAE;4DACN,uBAAuB,EAAE,IAAI;4DAC7B,kCAAkC,EAAE,CAAC,IAAI,CAAC,gBAAgB;yDAC1D,EACD,IAAI,EAAE,cAAc,GAEd,GACF,GACE;4CACT,CAAC,CAAC,OAAO;gDACT,KAAC,IAAI,IACJ,KAAK,EAAE;wDACN,yBAAyB,EAAE,IAAI;wDAC/B,uBAAuB,EAAE,IAAI;wDAC7B,kCAAkC,EAAE,CAAC,IAAI,CAAC,gBAAgB;qDAC1D,EACD,IAAI,EAAE,cAAc,EACpB,WAAW,EAAE,IAAI,EACjB,cAAc,EAAE,IAAI,CAAC,iBAAiB,GACrC,GAEE,EAGL,IAAI,CAAC,UAAU,CAAC,CAAC;oCAClB,eAAM,IAAI,EAAC,QAAQ,GAAQ;oCAC3B,CAAC,CAAC,OAAO;wCACT,cACC,EAAE,EAAG,GAAG,IAAI,CAAC,GAAG,eAAe,EAC/B,KAAK,EAAC,wBAAwB,YAE5B,IAAI,CAAC,UAAU,GACZ,IAEF,GACD,EAIP,cACC,KAAK,~~EAAE;wBACN~~,~~2BAA2B~~,EAAE,IAAI~~;wBACjC~~,~~6BAA6B~~,~~EAAE~~,~~IAAI~~,CAAC,~~iBAAiB;qBACrD~~,~~EACD~~,KAAK,EAAE;wBACN,OAAO,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM;qBACjD,~~YAED~~,~~cACC,KAAK,EAAC,mBAAmB,EACzB,EAAE,EAAG,GAAG,~~IAAI,~~CAAC,GAAG,UAAU,EAC1B,QAAQ,EAAG,IAAI,CAAC,gBAAgB,EAChC,IAAI,~~EAAC,SAAS,YAEd,gBAAa,GACR,~~GACD,~~IACD,GACJ,CAAC,CAAC;AACN,CAAC","sourcesContent":["import type Panel from \"./Panel.js\";\nimport Button from \"./Button.js\";\nimport Icon from \"./Icon.js\";\n\nimport slimArrowRight from \"@ui5/webcomponents-icons/dist/slim-arrow-right.js\";\n\nexport default function PanelTemplate(this: Panel) {\n\treturn (<>\n\t\t<div\n\t\t\tclass=\"ui5-panel-root\"\n\t\t\trole={this.accRole}\n\t\t\taria-label={this.effectiveAccessibleName}\n\t\t\taria-labelledby={this.fixedPanelAriaLabelledbyReference}\n\t\t>\n\t\t\t{ this.hasHeaderOrHeaderText &&\n\t\t\t\t// header: either header or h1 with header text\n\t\t\t\t<div\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t\"ui5-panel-heading-wrapper\": true,\n\t\t\t\t\t\t\"ui5-panel-heading-wrapper-sticky\": this.stickyHeader,\n\t\t\t\t\t}}\n\t\t\t\t\trole={this.headingWrapperRole}\n\t\t\t\t\taria-level={this.headingWrapperAriaLevel}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tonClick={this._headerClick}\n\t\t\t\t\t\tonKeyDown={this._headerKeyDown}\n\t\t\t\t\t\tonKeyUp={this._headerKeyUp}\n\t\t\t\t\t\tonTouchStart={this._isMobile}\n\t\t\t\t\t\tonFocusOut={this._headerFocusOut}\n\t\t\t\t\t\tclass=\"ui5-panel-header\"\n\t\t\t\t\t\ttabindex={this.headerTabIndex}\n\t\t\t\t\t\trole={this.accInfo.role}\n\t\t\t\t\t\taria-expanded={this.accInfo.ariaExpanded}\n\t\t\t\t\t\taria-controls={this.accInfo.ariaControls}\n\t\t\t\t\t\taria-labelledby={this.accInfo.ariaLabelledby}\n\t\t\t\t\t\tpart=\"header\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ !this.fixed &&\n\t\t\t\t\t\t\t<div class=\"ui5-panel-header-button-root\">\n\t\t\t\t\t\t\t\t{ this._hasHeader ?\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tdesign=\"Transparent\"\n\t\t\t\t\t\t\t\t\t\tclass=\"ui5-panel-header-button ui5-panel-header-button-with-icon\"\n\t\t\t\t\t\t\t\t\t\tonClick={this._toggleButtonClick}\n\t\t\t\t\t\t\t\t\t\taccessibilityAttributes={this.accInfo.button.accessibilityAttributes}\n\t\t\t\t\t\t\t\t\t\ttooltip={this.accInfo.button.title}\n\t\t\t\t\t\t\t\t\t\taccessibleName={this.accInfo.button.ariaLabelButton}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<div class=\"ui5-panel-header-icon-wrapper\">\n\t\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\"ui5-panel-header-icon\": true,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\"ui5-panel-header-button-animated\": !this.shouldNotAnimate,\n\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\tname={slimArrowRight}\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t</Icon>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t\t: // else\n\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\t\"ui5-panel-header-button\": true,\n\t\t\t\t\t\t\t\t\t\t\t\"ui5-panel-header-icon\": true,\n\t\t\t\t\t\t\t\t\t\t\t\"ui5-panel-header-button-animated\": !this.shouldNotAnimate,\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\tname={slimArrowRight}\n\t\t\t\t\t\t\t\t\t\tshowTooltip={true}\n\t\t\t\t\t\t\t\t\t\taccessibleName={this.toggleButtonTitle}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t{ this._hasHeader ?\n\t\t\t\t\t\t\t<slot name=\"header\"></slot>\n\t\t\t\t\t\t\t: // else\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tid={ `${this._id}-header-title` }\n\t\t\t\t\t\t\t\tclass=\"ui5-panel-header-title\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ this.headerText }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t}\n\n\t\t\t{/* content area */}\n\t\t\t<div\n\t\t\t\tclass~~={{\n\t\t\t\t\t\~~"ui5-panel-content~~-wrapper~~\"~~: true,\~~n\t\t\t\~~t\t\"ui5~~-~~panel-~~content~~-focusable~~\~~": this._contentFocusable,\~~n\t\t\t\t}}\n\t\t\t\tstyle={{\n\t\t\t\t\tdisplay: this._contentExpanded ? \"block\" : \"none\",\n\t\t\t\t}}\n\t\t\t~~>\n~~\~~t\t\t\t<div\n\t\t\t\t\tclass=\"ui5-panel-content\"\n\t\t\t\t\tid={ `${this._id}-content` }\n\t\t\t\t\ttabindex={ this._contentTabIndex }\n\t\t\t\t\~~tpart=\"content\"\n\t\t\t\t>\n\t\t\t\t\t<slot></slot>\n\t\t\t\t</div>\n\t\t\t</div>\n\t~~\t</div>\n\t~~</>);\n}\n"]}
1	+ {"version":3,"file":"PanelTemplate.js","sourceRoot":"","sources":["../src/PanelTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,MAAM,aAAa,CAAC;AACjC,OAAO,IAAI,MAAM,WAAW,CAAC;AAE7B,OAAO,cAAc,MAAM,mDAAmD,CAAC;AAE/E,MAAM,CAAC,OAAO,UAAU,aAAa;IACpC,OAAO,CAAC,4BACP,eACC,KAAK,EAAC,gBAAgB,EACtB,IAAI,EAAE,IAAI,CAAC,OAAO,gBACN,IAAI,CAAC,uBAAuB,qBACvB,IAAI,CAAC,iCAAiC,aAErD,IAAI,CAAC,qBAAqB;oBAC3B,+CAA+C;oBAC/C,cACC,KAAK,EAAE;4BACN,2BAA2B,EAAE,IAAI;4BACjC,kCAAkC,EAAE,IAAI,CAAC,YAAY;yBACrD,EACD,IAAI,EAAE,IAAI,CAAC,kBAAkB,gBACjB,IAAI,CAAC,uBAAuB,EACxC,IAAI,EAAC,gBAAgB,YAErB,eACC,OAAO,EAAE,IAAI,CAAC,YAAY,EAC1B,SAAS,EAAE,IAAI,CAAC,cAAc,EAC9B,OAAO,EAAE,IAAI,CAAC,YAAY,EAC1B,YAAY,EAAE,IAAI,CAAC,SAAS,EAC5B,UAAU,EAAE,IAAI,CAAC,eAAe,EAChC,KAAK,EAAC,kBAAkB,EACxB,QAAQ,EAAE,IAAI,CAAC,cAAc,EAC7B,IAAI,EAAE,IAAI,CAAC,OAAO,CAAC,IAAI,mBACR,IAAI,CAAC,OAAO,CAAC,YAAY,mBACzB,IAAI,CAAC,OAAO,CAAC,YAAY,qBACvB,IAAI,CAAC,OAAO,CAAC,cAAc,EAC5C,IAAI,EAAC,QAAQ,aAEX,CAAC,IAAI,CAAC,KAAK;oCACZ,cAAK,KAAK,EAAC,8BAA8B,YACtC,IAAI,CAAC,UAAU,CAAC,CAAC;4CAClB,KAAC,MAAM,IACN,MAAM,EAAC,aAAa,EACpB,KAAK,EAAC,2DAA2D,EACjE,OAAO,EAAE,IAAI,CAAC,kBAAkB,EAChC,uBAAuB,EAAE,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,uBAAuB,EACpE,OAAO,EAAE,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,EAClC,cAAc,EAAE,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,eAAe,YAEnD,cAAK,KAAK,EAAC,+BAA+B,YACzC,KAAC,IAAI,IACJ,KAAK,EAAE;4DACN,uBAAuB,EAAE,IAAI;4DAC7B,kCAAkC,EAAE,CAAC,IAAI,CAAC,gBAAgB;yDAC1D,EACD,IAAI,EAAE,cAAc,GAEd,GACF,GACE;4CACT,CAAC,CAAC,OAAO;gDACT,KAAC,IAAI,IACJ,KAAK,EAAE;wDACN,yBAAyB,EAAE,IAAI;wDAC/B,uBAAuB,EAAE,IAAI;wDAC7B,kCAAkC,EAAE,CAAC,IAAI,CAAC,gBAAgB;qDAC1D,EACD,IAAI,EAAE,cAAc,EACpB,WAAW,EAAE,IAAI,EACjB,cAAc,EAAE,IAAI,CAAC,iBAAiB,GACrC,GAEE,EAGL,IAAI,CAAC,UAAU,CAAC,CAAC;oCAClB,eAAM,IAAI,EAAC,QAAQ,GAAQ;oCAC3B,CAAC,CAAC,OAAO;wCACT,cACC,EAAE,EAAG,GAAG,IAAI,CAAC,GAAG,eAAe,EAC/B,KAAK,EAAC,wBAAwB,YAE5B,IAAI,CAAC,UAAU,GACZ,IAEF,GACD,EAIP,cACC,KAAK,EAAC,mBAAmB,EACzB,EAAE,EAAG,GAAG,IAAI,CAAC,GAAG,UAAU,EAC1B,QAAQ,EAAG,CAAC,CAAC,EACb,KAAK,EAAE;wBACN,OAAO,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM;qBACjD,EACD,IAAI,EAAC,SAAS,YAEd,gBAAa,GACR,IACD,GACJ,CAAC,CAAC;AACN,CAAC","sourcesContent":["import type Panel from \"./Panel.js\";\nimport Button from \"./Button.js\";\nimport Icon from \"./Icon.js\";\n\nimport slimArrowRight from \"@ui5/webcomponents-icons/dist/slim-arrow-right.js\";\n\nexport default function PanelTemplate(this: Panel) {\n\treturn (<>\n\t\t<div\n\t\t\tclass=\"ui5-panel-root\"\n\t\t\trole={this.accRole}\n\t\t\taria-label={this.effectiveAccessibleName}\n\t\t\taria-labelledby={this.fixedPanelAriaLabelledbyReference}\n\t\t>\n\t\t\t{ this.hasHeaderOrHeaderText &&\n\t\t\t\t// header: either header or h1 with header text\n\t\t\t\t<div\n\t\t\t\t\tclass={{\n\t\t\t\t\t\t\"ui5-panel-heading-wrapper\": true,\n\t\t\t\t\t\t\"ui5-panel-heading-wrapper-sticky\": this.stickyHeader,\n\t\t\t\t\t}}\n\t\t\t\t\trole={this.headingWrapperRole}\n\t\t\t\t\taria-level={this.headingWrapperAriaLevel}\n\t\t\t\t\tpart=\"header-wrapper\"\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tonClick={this._headerClick}\n\t\t\t\t\t\tonKeyDown={this._headerKeyDown}\n\t\t\t\t\t\tonKeyUp={this._headerKeyUp}\n\t\t\t\t\t\tonTouchStart={this._isMobile}\n\t\t\t\t\t\tonFocusOut={this._headerFocusOut}\n\t\t\t\t\t\tclass=\"ui5-panel-header\"\n\t\t\t\t\t\ttabindex={this.headerTabIndex}\n\t\t\t\t\t\trole={this.accInfo.role}\n\t\t\t\t\t\taria-expanded={this.accInfo.ariaExpanded}\n\t\t\t\t\t\taria-controls={this.accInfo.ariaControls}\n\t\t\t\t\t\taria-labelledby={this.accInfo.ariaLabelledby}\n\t\t\t\t\t\tpart=\"header\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ !this.fixed &&\n\t\t\t\t\t\t\t<div class=\"ui5-panel-header-button-root\">\n\t\t\t\t\t\t\t\t{ this._hasHeader ?\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tdesign=\"Transparent\"\n\t\t\t\t\t\t\t\t\t\tclass=\"ui5-panel-header-button ui5-panel-header-button-with-icon\"\n\t\t\t\t\t\t\t\t\t\tonClick={this._toggleButtonClick}\n\t\t\t\t\t\t\t\t\t\taccessibilityAttributes={this.accInfo.button.accessibilityAttributes}\n\t\t\t\t\t\t\t\t\t\ttooltip={this.accInfo.button.title}\n\t\t\t\t\t\t\t\t\t\taccessibleName={this.accInfo.button.ariaLabelButton}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<div class=\"ui5-panel-header-icon-wrapper\">\n\t\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\"ui5-panel-header-icon\": true,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\"ui5-panel-header-button-animated\": !this.shouldNotAnimate,\n\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\tname={slimArrowRight}\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t</Icon>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t\t: // else\n\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\tclass={{\n\t\t\t\t\t\t\t\t\t\t\t\"ui5-panel-header-button\": true,\n\t\t\t\t\t\t\t\t\t\t\t\"ui5-panel-header-icon\": true,\n\t\t\t\t\t\t\t\t\t\t\t\"ui5-panel-header-button-animated\": !this.shouldNotAnimate,\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\tname={slimArrowRight}\n\t\t\t\t\t\t\t\t\t\tshowTooltip={true}\n\t\t\t\t\t\t\t\t\t\taccessibleName={this.toggleButtonTitle}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t{ this._hasHeader ?\n\t\t\t\t\t\t\t<slot name=\"header\"></slot>\n\t\t\t\t\t\t\t: // else\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tid={ `${this._id}-header-title` }\n\t\t\t\t\t\t\t\tclass=\"ui5-panel-header-title\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ this.headerText }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t}\n\n\t\t\t{/* content area */}\n\t\t\t<div\n\t\t\t\tclass=\"ui5-panel-content\"\n\t\t\t\tid={ `${this._id}-content` }\n\t\t\t\ttabindex={ -1 }\n\t\t\t\tstyle={{\n\t\t\t\t\tdisplay: this._contentExpanded ? \"block\" : \"none\",\n\t\t\t\t}}\n\t\t\t\tpart=\"content\"\n\t\t\t>\n\t\t\t\t<slot></slot>\n\t\t\t</div>\n\t\t</div>\n\t</>);\n}\n"]}

package/dist/TabContainer.js CHANGED Viewed

@@ -926,7 +926,9 @@ let TabContainer = TabContainer_1 = class TabContainer extends UI5Element {
             return [];
         }
         const focusableRefs = [];
-        if (!this._getStartOverflow().hasAttribute("hidden")) {
+        const startOverflow = this._getStartOverflow();
+        const endOverflow = this._getEndOverflow();
+        if (startOverflow && !startOverflow.hasAttribute("hidden")) {
             focusableRefs.push(this.startOverflowButton[0] || this._getStartOverflowBtnDOM());
         }
         this._getTabs().forEach(tab => {
@@ -936,7 +938,7 @@ let TabContainer = TabContainer_1 = class TabContainer extends UI5Element {
                 focusableRefs.push(tab);
             }
         });
-        if (!this._getEndOverflow().hasAttribute("hidden")) {
+        if (endOverflow && !endOverflow.hasAttribute("hidden")) {
             focusableRefs.push(this.overflowButton[0] || this._getEndOverflowBtnDOM());
         }
         return focusableRefs;