@ui5/webcomponents 1.22.0-rc.2 → 1.22.0

package/dist/Avatar.d.ts

@@ -2,7 +2,7 @@ import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
 import type { ITabbable } from "@ui5/webcomponents-base/dist/delegate/ItemNavigation.js";
 import type { ResizeObserverCallback } from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js";
-import type { IAvatar } from "./Interfaces.js";
+import type { IAvatarGroupItem } from "./AvatarGroup.js";
 import AvatarSize from "./types/AvatarSize.js";
 import AvatarShape from "./types/AvatarShape.js";
 import AvatarColorScheme from "./types/AvatarColorScheme.js";
@@ -35,10 +35,10 @@ import "@ui5/webcomponents-icons/dist/alert.js";
  * @constructor
  * @extends UI5Element
  * @since 1.0.0-rc.6
- * @implements {IAvatar}
+ * @implements {IAvatarGroupItem}
  * @public
  */
-declare class Avatar extends UI5Element implements ITabbable, IAvatar {
+declare class Avatar extends UI5Element implements ITabbable, IAvatarGroupItem {
     /**
      * Defines whether the component is disabled.
      * A disabled component can't be pressed or
@@ -161,7 +161,7 @@ declare class Avatar extends UI5Element implements ITabbable, IAvatar {
      * @protected
      */
     ariaHaspopup: string;
-    _tabIndex: string;
+    forcedTabIndex: string;
     _hasImage: boolean;
     /**
      * Receives the desired <code>&lt;img&gt;</code> tag
@@ -212,13 +212,13 @@ declare class Avatar extends UI5Element implements ITabbable, IAvatar {
      * @default "S"
      * @private
      */
-    get _effectiveSize(): AvatarSize;
+    get effectiveSize(): AvatarSize;
     /**
      * Returns the effective background color.
      * @default "Accent6"
      * @private
      */
-    get _effectiveBackgroundColor(): AvatarColorScheme;
+    get еffectiveBackgroundColor(): AvatarColorScheme;
     get _role(): "button" | "img";
     get _ariaHasPopup(): string | undefined;
     get _fallbackIcon(): string;

package/dist/Avatar.js

@@ -54,7 +54,7 @@ import "@ui5/webcomponents-icons/dist/alert.js";
  * @constructor
  * @extends UI5Element
  * @since 1.0.0-rc.6
- * @implements {IAvatar}
+ * @implements {IAvatarGroupItem}
  * @public
  */
 let Avatar = Avatar_1 = class Avatar extends UI5Element {
@@ -66,14 +66,14 @@ let Avatar = Avatar_1 = class Avatar extends UI5Element {
         Avatar_1.i18nBundle = await getI18nBundle("@ui5/webcomponents");
     }
     get tabindex() {
-        return this._tabIndex || (this._interactive ? "0" : "-1");
+        return this.forcedTabIndex || (this._interactive ? "0" : "-1");
     }
     /**
      * Returns the effective avatar size.
      * @default "S"
      * @private
      */
-    get _effectiveSize() {
+    get effectiveSize() {
         // we read the attribute, because the "size" property will always have a default value
         return this.getAttribute("size") || this._size;
     }
@@ -82,7 +82,7 @@ let Avatar = Avatar_1 = class Avatar extends UI5Element {
      * @default "Accent6"
      * @private
      */
-    get _effectiveBackgroundColor() {
+    get еffectiveBackgroundColor() {
         // we read the attribute, because the "background-color" property will always have a default value
         return this.getAttribute("color-scheme") || this._colorScheme;
     }
@@ -241,7 +241,7 @@ __decorate([
 ], Avatar.prototype, "ariaHaspopup", void 0);
 __decorate([
     property({ noAttribute: true })
-], Avatar.prototype, "_tabIndex", void 0);
+], Avatar.prototype, "forcedTabIndex", void 0);
 __decorate([
     property({ type: Boolean })
 ], Avatar.prototype, "_hasImage", void 0);

package/dist/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../src/Avatar.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type { ITabbable } from \"@ui5/webcomponents-base/dist/delegate/ItemNavigation.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport type { ResizeObserverCallback } from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport { renderFinished } from \"@ui5/webcomponents-base/dist/Render.js\";\nimport { isEnter, isSpace } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport type { IAvatar } from \"./Interfaces.js\";\n// Template\nimport AvatarTemplate from \"./generated/templates/AvatarTemplate.lit.js\";\n\nimport { AVATAR_TOOLTIP } from \"./generated/i18n/i18n-defaults.js\";\n\n// Styles\nimport AvatarCss from \"./generated/themes/Avatar.css.js\";\n\nimport Icon from \"./Icon.js\";\nimport AvatarSize from \"./types/AvatarSize.js\";\nimport AvatarShape from \"./types/AvatarShape.js\";\nimport AvatarColorScheme from \"./types/AvatarColorScheme.js\";\n\n// Icon\nimport \"@ui5/webcomponents-icons/dist/employee.js\";\nimport \"@ui5/webcomponents-icons/dist/alert.js\";\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n * An image-like component that has different display options for representing images and icons\n * in different shapes and sizes, depending on the use case.\n *\n * The shape can be circular or square. There are several predefined sizes, as well as an option to\n * set a custom size.\n *\n * <br><br>\n * <h3>Keyboard Handling</h3>\n *\n * <ul>\n * <li>[SPACE, ENTER, RETURN] - Fires the <code>click</code> event if the <code>interactive</code> property is set to true.</li>\n * <li>[SHIFT] - If [SPACE] is pressed, pressing [SHIFT] releases the component without triggering the click event.</li>\n * </ul>\n * <br><br>\n *\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@ui5/webcomponents/dist/Avatar.js\";</code>\n *\n * @constructor\n * @extends UI5Element\n * @since 1.0.0-rc.6\n * @implements {IAvatar}\n * @public\n */\n@customElement({\n\ttag: \"ui5-avatar\",\n\tlanguageAware: true,\n\trenderer: litRender,\n\tstyles: AvatarCss,\n\ttemplate: AvatarTemplate,\n\tdependencies: [Icon],\n})\n/**\n* Fired on mouseup, space and enter if avatar is interactive\n* <b>Note:</b> The event will not be fired if the <code>disabled</code>\n* property is set to <code>true</code>.\n* @private\n* @since 1.0.0-rc.11\n*/\n@event(\"click\")\nclass Avatar extends UI5Element implements ITabbable, IAvatar {\n\t/**\n\t * Defines whether the component is disabled.\n\t * A disabled component can't be pressed or\n\t * focused, and it is not in the tab chain.\n\t *\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tdisabled!: boolean;\n\n\t/**\n\t * Defines if the avatar is interactive (focusable and pressable).\n\t * <b>Note:</b> This property won't have effect if the <code>disabled</code>\n\t * property is set to <code>true</code>.\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tinteractive!: boolean;\n\n\t/**\n\t * Indicates if the elements is on focus\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\tfocused!: boolean;\n\n\t/**\n\t * Indicates if the elements is pressed\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\tpressed!: boolean;\n\n\t/**\n\t * Defines the name of the UI5 Icon, that will be displayed.\n\t * <br>\n\t * <b>Note:</b> If <code>image</code> slot is provided, the property will be ignored.\n\t * <br>\n\t * <b>Note:</b> You should import the desired icon first, then use its name as \"icon\".\n\t * <br><br>\n\t * import \"@ui5/webcomponents-icons/dist/{icon_name}.js\"\n\t * <br>\n\t * <pre>&lt;ui5-avatar icon=\"employee\"></pre>\n\t * <br>\n\t * <b>Note:</b> If no icon or an empty one is provided, by default the \"employee\" icon should be displayed.\n\t *\n\t * See all the available icons in the <ui5-link target=\"_blank\" href=\"https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html\">Icon Explorer</ui5-link>.\n\t * @default \"\"\n\t * @public\n\t */\n\t@property()\n\ticon!: string;\n\n\t/**\n\t * Defines the name of the fallback icon, which should be displayed in the following cases:\n\t * <ul>\n\t * \t<li>If the initials are not valid (more than 3 letters, unsupported languages or empty initials).</li>\n\t * \t<li>If there are three initials and they do not fit in the shape (e.g. WWW for some of the sizes).</li>\n\t * \t<li>If the image src is wrong.</li>\n\t * </ul>\n\t *\n\t * <br>\n\t * <b>Note:</b> If not set, a default fallback icon \"employee\" is displayed.\n\t * <br>\n\t * <b>Note:</b> You should import the desired icon first, then use its name as \"fallback-icon\".\n\t * <br><br>\n\t * import \"@ui5/webcomponents-icons/dist/{icon_name}.js\"\n\t * <br>\n\t * <pre>&lt;ui5-avatar fallback-icon=\"alert\"></pre>\n\t * <br>\n\t *\n\t * See all the available icons in the <ui5-link target=\"_blank\" href=\"https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html\">Icon Explorer</ui5-link>.\n\t * @default \"\"\n\t * @public\n\t */\n\t@property()\n\tfallbackIcon!: string;\n\n\t/**\n\t * Defines the displayed initials.\n\t * <br>\n\t * Up to three Latin letters can be displayed as initials.\n\t *\n\t * @default \"\"\n\t * @public\n\t */\n\t@property()\n\tinitials!: string;\n\n\t/**\n\t * Defines the shape of the component.\n\t *\n\t * @default \"Circle\"\n\t * @public\n\t */\n\t@property({ type: AvatarShape, defaultValue: AvatarShape.Circle })\n\tshape!: `${AvatarShape}`;\n\n\t/**\n\t * Defines predefined size of the component.\n\t *\n\t * @default \"S\"\n\t * @public\n\t */\n\t@property({ type: AvatarSize, defaultValue: AvatarSize.S })\n\tsize!: `${AvatarSize}`;\n\n\t/**\n\t * @private\n\t */\n\t@property({ type: AvatarSize, defaultValue: AvatarSize.S })\n\t_size!: AvatarSize;\n\n\t/**\n\t * Defines the background color of the desired image.\n\t *\n\t * @default \"Accent6\"\n\t * @public\n\t */\n\t@property({ type: AvatarColorScheme, defaultValue: AvatarColorScheme.Accent6 })\n\tcolorScheme!: `${AvatarColorScheme}`;\n\n\t/**\n\t * @private\n\t */\n\t@property({ type: AvatarColorScheme, defaultValue: AvatarColorScheme.Accent6 })\n\t_colorScheme!: AvatarColorScheme;\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 * @default \"\"\n\t * @public\n\t * @since 1.0.0-rc.7\n\t */\n\t@property()\n\taccessibleName!: string;\n\n\t/**\n\t * Defines the aria-haspopup value of the component when <code>interactive</code> property is <code>true</code>.\n\t * <br><br>\n\t * @since 1.0.0-rc.15\n\t * @protected\n\t */\n\t@property()\n\tariaHaspopup!: string;\n\n\t@property({ noAttribute: true })\n\t_tabIndex!: string;\n\n\t@property({ type: Boolean })\n\t_hasImage!: boolean;\n\n\t/**\n\t * Receives the desired <code>&lt;img&gt;</code> tag\n\t *\n\t * <b>Note:</b> If you experience flickering of the provided image, you can hide the component until it is being defined with the following CSS:\n\t * <br /> <br />\n\t * <code>\n\t *\t\tui5-avatar:not(:defined) { <br />\n\t *\t\t\t&nbsp;visibility: hidden; <br />\n\t *\t\t} <br />\n\t * </code>\n\t * @public\n\t * @since 1.0.0-rc.15\n\t */\n\t@slot({ type: HTMLElement, \"default\": true })\n\timage!: Array<HTMLElement>;\n\n\t/**\n\t * Defines the optional badge that will be used for visual affordance.\n\t * <b>Note:</b> While the slot allows for custom badges, to achieve\n\t * the Fiori design, please use <code>ui5-badge</code> with <code>ui5-icon</code>\n\t * in the corresponding <code>icon</code> slot, without text nodes.\n\t * <br><br>\n\t * Example:\n\t * <br><br>\n\t * &lt;ui5-avatar><br>\n\t * &nbsp;&nbsp;&nbsp;&nbsp;&lt;ui5-badge slot=\"badge\"><br>\n\t * &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;ui5-icon slot=\"icon\" name=\"employee\">&lt;/ui5-icon><br>\n\t * &nbsp;&nbsp;&nbsp;&nbsp;&lt;/ui5-badge><br>\n\t * &lt;/ui5-avatar>\n\t * <br><br>\n\t * <ui5-avatar initials=\"AB\" color-scheme=\"Accent1\">\n\t * <ui5-badge slot=\"badge\">\n\t * <ui5-icon slot=\"icon\" name=\"accelerated\"></ui5-icon>\n\t * </ui5-badge>\n\t * </ui5-avatar>\n\t *\n\t * @public\n\t * @since 1.7.0\n\t */\n\t@slot()\n\tbadge!: Array<HTMLElement>;\n\n\t_onclick?: (e: MouseEvent) => void;\n\tstatic i18nBundle: I18nBundle;\n\t_handleResizeBound: ResizeObserverCallback;\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis._handleResizeBound = this.handleResize.bind(this);\n\t}\n\n\tstatic async onDefine() {\n\t\tAvatar.i18nBundle = await getI18nBundle(\"@ui5/webcomponents\");\n\t}\n\n\tget tabindex() {\n\t\treturn this._tabIndex || (this._interactive ? \"0\" : \"-1\");\n\t}\n\n\t/**\n\t * Returns the effective avatar size.\n\t * @default \"S\"\n\t * @private\n\t */\n\tget _effectiveSize(): AvatarSize {\n\t\t// we read the attribute, because the \"size\" property will always have a default value\n\t\treturn this.getAttribute(\"size\") as AvatarSize || this._size;\n\t}\n\n\t/**\n\t * Returns the effective background color.\n\t * @default \"Accent6\"\n\t * @private\n\t */\n\tget _effectiveBackgroundColor(): AvatarColorScheme {\n\t\t// we read the attribute, because the \"background-color\" property will always have a default value\n\t\treturn this.getAttribute(\"color-scheme\") as AvatarColorScheme || this._colorScheme;\n\t}\n\n\tget _role() {\n\t\treturn this._interactive ? \"button\" : \"img\";\n\t}\n\n\tget _ariaHasPopup() {\n\t\treturn this._getAriaHasPopup();\n\t}\n\n\tget _fallbackIcon() {\n\t\tif (this.fallbackIcon === \"\") {\n\t\t\tthis.fallbackIcon = \"employee\";\n\t\t}\n\n\t\treturn this.fallbackIcon;\n\t}\n\n\tget _interactive() {\n\t\treturn this.interactive && !this.disabled;\n\t}\n\n\tget validInitials() {\n\t\t// initials should consist of only 1,2 or 3 latin letters\n\t\tconst validInitials = /^[a-zA-Zà-üÀ-Ü]{1,3}$/,\n\t\t\tareInitialsValid = this.initials && validInitials.test(this.initials);\n\n\t\tif (areInitialsValid) {\n\t\t\treturn this.initials;\n\t\t}\n\n\t\treturn null;\n\t}\n\n\tget accessibleNameText() {\n\t\tif (this.accessibleName) {\n\t\t\treturn this.accessibleName;\n\t\t}\n\n\t\treturn Avatar.i18nBundle.getText(AVATAR_TOOLTIP) || undefined;\n\t}\n\n\tget hasImage() {\n\t\tthis._hasImage = !!this.image.length;\n\t\treturn this._hasImage;\n\t}\n\n\tget initialsContainer(): HTMLObjectElement | null {\n\t\treturn this.getDomRef()!.querySelector(\".ui5-avatar-initials\");\n\t }\n\n\tonBeforeRendering() {\n\t\tthis._onclick = this._interactive ? this._onClickHandler.bind(this) : undefined;\n\t}\n\n\tasync onAfterRendering() {\n\t\tawait renderFinished();\n\t\tif (this.initials && !this.icon) {\n\t\t\tthis._checkInitials();\n\t\t}\n\t}\n\n\tonEnterDOM() {\n\t\tthis.initialsContainer && ResizeHandler.register(this.initialsContainer,\n\t\t\tthis._handleResizeBound);\n\t}\n\n\tonExitDOM() {\n\t\tthis.initialsContainer && ResizeHandler.deregister(this.initialsContainer,\n\t\t\tthis._handleResizeBound);\n\t}\n\n\thandleResize() {\n\t\tif (this.initials && !this.icon) {\n\t\t\tthis._checkInitials();\n\t\t}\n\t}\n\n\t_checkInitials() {\n\t\tconst avatar = this.getDomRef()!,\n\t\t\tavatarInitials = avatar.querySelector(\".ui5-avatar-initials\");\n\t\t// if there aren`t initalts set - the fallBack icon should be shown\n\t\tif (!this.validInitials) {\n\t\t\tavatarInitials!.classList.add(\"ui5-avatar-initials-hidden\");\n\t\t\treturn;\n\t\t}\n\t\t// if initials` width is bigger than the avatar, an icon should be shown inside the avatar\n\t\tavatarInitials && avatarInitials.classList.remove(\"ui5-avatar-initials-hidden\");\n\t\tif (this.initials && this.initials.length === 3) {\n\t\t\tif (avatarInitials && avatarInitials.scrollWidth > avatar.scrollWidth) {\n\t\t\t\tavatarInitials.classList.add(\"ui5-avatar-initials-hidden\");\n\t\t\t}\n\t\t}\n\t}\n\n\t_onClickHandler(e: MouseEvent) {\n\t\t// prevent the native event and fire custom event to ensure the noConfict \"ui5-click\" is fired\n\t\te.stopPropagation();\n\t\tthis._fireClick();\n\t}\n\n\t_onkeydown(e: KeyboardEvent) {\n\t\tif (!this._interactive) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (isEnter(e)) {\n\t\t\tthis._fireClick();\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._interactive && !e.shiftKey && isSpace(e)) {\n\t\t\tthis._fireClick();\n\t\t}\n\t}\n\n\t_fireClick() {\n\t\tthis.fireEvent(\"click\");\n\t\tthis.pressed = !this.pressed;\n\t}\n\n\t_onfocusout() {\n\t\tthis.focused = false;\n\t}\n\n\t_onfocusin() {\n\t\tif (this._interactive) {\n\t\t\tthis.focused = true;\n\t\t}\n\t}\n\n\t_getAriaHasPopup() {\n\t\tif (!this._interactive || this.ariaHaspopup === \"\") {\n\t\t\treturn;\n\t\t}\n\n\t\treturn this.ariaHaspopup;\n\t}\n}\n\nAvatar.define();\n\nexport default Avatar;\n"]}
+{"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../src/Avatar.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type { ITabbable } from \"@ui5/webcomponents-base/dist/delegate/ItemNavigation.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport type { ResizeObserverCallback } from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport { renderFinished } from \"@ui5/webcomponents-base/dist/Render.js\";\nimport { isEnter, isSpace } from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport type { IAvatarGroupItem } from \"./AvatarGroup.js\";\n// Template\nimport AvatarTemplate from \"./generated/templates/AvatarTemplate.lit.js\";\n\nimport { AVATAR_TOOLTIP } from \"./generated/i18n/i18n-defaults.js\";\n\n// Styles\nimport AvatarCss from \"./generated/themes/Avatar.css.js\";\n\nimport Icon from \"./Icon.js\";\nimport AvatarSize from \"./types/AvatarSize.js\";\nimport AvatarShape from \"./types/AvatarShape.js\";\nimport AvatarColorScheme from \"./types/AvatarColorScheme.js\";\n\n// Icon\nimport \"@ui5/webcomponents-icons/dist/employee.js\";\nimport \"@ui5/webcomponents-icons/dist/alert.js\";\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n * An image-like component that has different display options for representing images and icons\n * in different shapes and sizes, depending on the use case.\n *\n * The shape can be circular or square. There are several predefined sizes, as well as an option to\n * set a custom size.\n *\n * <br><br>\n * <h3>Keyboard Handling</h3>\n *\n * <ul>\n * <li>[SPACE, ENTER, RETURN] - Fires the <code>click</code> event if the <code>interactive</code> property is set to true.</li>\n * <li>[SHIFT] - If [SPACE] is pressed, pressing [SHIFT] releases the component without triggering the click event.</li>\n * </ul>\n * <br><br>\n *\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@ui5/webcomponents/dist/Avatar.js\";</code>\n *\n * @constructor\n * @extends UI5Element\n * @since 1.0.0-rc.6\n * @implements {IAvatarGroupItem}\n * @public\n */\n@customElement({\n\ttag: \"ui5-avatar\",\n\tlanguageAware: true,\n\trenderer: litRender,\n\tstyles: AvatarCss,\n\ttemplate: AvatarTemplate,\n\tdependencies: [Icon],\n})\n/**\n* Fired on mouseup, space and enter if avatar is interactive\n* <b>Note:</b> The event will not be fired if the <code>disabled</code>\n* property is set to <code>true</code>.\n* @private\n* @since 1.0.0-rc.11\n*/\n@event(\"click\")\nclass Avatar extends UI5Element implements ITabbable, IAvatarGroupItem {\n\t/**\n\t * Defines whether the component is disabled.\n\t * A disabled component can't be pressed or\n\t * focused, and it is not in the tab chain.\n\t *\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tdisabled!: boolean;\n\n\t/**\n\t * Defines if the avatar is interactive (focusable and pressable).\n\t * <b>Note:</b> This property won't have effect if the <code>disabled</code>\n\t * property is set to <code>true</code>.\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tinteractive!: boolean;\n\n\t/**\n\t * Indicates if the elements is on focus\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\tfocused!: boolean;\n\n\t/**\n\t * Indicates if the elements is pressed\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\tpressed!: boolean;\n\n\t/**\n\t * Defines the name of the UI5 Icon, that will be displayed.\n\t * <br>\n\t * <b>Note:</b> If <code>image</code> slot is provided, the property will be ignored.\n\t * <br>\n\t * <b>Note:</b> You should import the desired icon first, then use its name as \"icon\".\n\t * <br><br>\n\t * import \"@ui5/webcomponents-icons/dist/{icon_name}.js\"\n\t * <br>\n\t * <pre>&lt;ui5-avatar icon=\"employee\"></pre>\n\t * <br>\n\t * <b>Note:</b> If no icon or an empty one is provided, by default the \"employee\" icon should be displayed.\n\t *\n\t * See all the available icons in the <ui5-link target=\"_blank\" href=\"https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html\">Icon Explorer</ui5-link>.\n\t * @default \"\"\n\t * @public\n\t */\n\t@property()\n\ticon!: string;\n\n\t/**\n\t * Defines the name of the fallback icon, which should be displayed in the following cases:\n\t * <ul>\n\t * \t<li>If the initials are not valid (more than 3 letters, unsupported languages or empty initials).</li>\n\t * \t<li>If there are three initials and they do not fit in the shape (e.g. WWW for some of the sizes).</li>\n\t * \t<li>If the image src is wrong.</li>\n\t * </ul>\n\t *\n\t * <br>\n\t * <b>Note:</b> If not set, a default fallback icon \"employee\" is displayed.\n\t * <br>\n\t * <b>Note:</b> You should import the desired icon first, then use its name as \"fallback-icon\".\n\t * <br><br>\n\t * import \"@ui5/webcomponents-icons/dist/{icon_name}.js\"\n\t * <br>\n\t * <pre>&lt;ui5-avatar fallback-icon=\"alert\"></pre>\n\t * <br>\n\t *\n\t * See all the available icons in the <ui5-link target=\"_blank\" href=\"https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html\">Icon Explorer</ui5-link>.\n\t * @default \"\"\n\t * @public\n\t */\n\t@property()\n\tfallbackIcon!: string;\n\n\t/**\n\t * Defines the displayed initials.\n\t * <br>\n\t * Up to three Latin letters can be displayed as initials.\n\t *\n\t * @default \"\"\n\t * @public\n\t */\n\t@property()\n\tinitials!: string;\n\n\t/**\n\t * Defines the shape of the component.\n\t *\n\t * @default \"Circle\"\n\t * @public\n\t */\n\t@property({ type: AvatarShape, defaultValue: AvatarShape.Circle })\n\tshape!: `${AvatarShape}`;\n\n\t/**\n\t * Defines predefined size of the component.\n\t *\n\t * @default \"S\"\n\t * @public\n\t */\n\t@property({ type: AvatarSize, defaultValue: AvatarSize.S })\n\tsize!: `${AvatarSize}`;\n\n\t/**\n\t * @private\n\t */\n\t@property({ type: AvatarSize, defaultValue: AvatarSize.S })\n\t_size!: AvatarSize;\n\n\t/**\n\t * Defines the background color of the desired image.\n\t *\n\t * @default \"Accent6\"\n\t * @public\n\t */\n\t@property({ type: AvatarColorScheme, defaultValue: AvatarColorScheme.Accent6 })\n\tcolorScheme!: `${AvatarColorScheme}`;\n\n\t/**\n\t * @private\n\t */\n\t@property({ type: AvatarColorScheme, defaultValue: AvatarColorScheme.Accent6 })\n\t_colorScheme!: AvatarColorScheme;\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 * @default \"\"\n\t * @public\n\t * @since 1.0.0-rc.7\n\t */\n\t@property()\n\taccessibleName!: string;\n\n\t/**\n\t * Defines the aria-haspopup value of the component when <code>interactive</code> property is <code>true</code>.\n\t * <br><br>\n\t * @since 1.0.0-rc.15\n\t * @protected\n\t */\n\t@property()\n\tariaHaspopup!: string;\n\n\t@property({ noAttribute: true })\n\tforcedTabIndex!: string;\n\n\t@property({ type: Boolean })\n\t_hasImage!: boolean;\n\n\t/**\n\t * Receives the desired <code>&lt;img&gt;</code> tag\n\t *\n\t * <b>Note:</b> If you experience flickering of the provided image, you can hide the component until it is being defined with the following CSS:\n\t * <br /> <br />\n\t * <code>\n\t *\t\tui5-avatar:not(:defined) { <br />\n\t *\t\t\t&nbsp;visibility: hidden; <br />\n\t *\t\t} <br />\n\t * </code>\n\t * @public\n\t * @since 1.0.0-rc.15\n\t */\n\t@slot({ type: HTMLElement, \"default\": true })\n\timage!: Array<HTMLElement>;\n\n\t/**\n\t * Defines the optional badge that will be used for visual affordance.\n\t * <b>Note:</b> While the slot allows for custom badges, to achieve\n\t * the Fiori design, please use <code>ui5-badge</code> with <code>ui5-icon</code>\n\t * in the corresponding <code>icon</code> slot, without text nodes.\n\t * <br><br>\n\t * Example:\n\t * <br><br>\n\t * &lt;ui5-avatar><br>\n\t * &nbsp;&nbsp;&nbsp;&nbsp;&lt;ui5-badge slot=\"badge\"><br>\n\t * &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;ui5-icon slot=\"icon\" name=\"employee\">&lt;/ui5-icon><br>\n\t * &nbsp;&nbsp;&nbsp;&nbsp;&lt;/ui5-badge><br>\n\t * &lt;/ui5-avatar>\n\t * <br><br>\n\t * <ui5-avatar initials=\"AB\" color-scheme=\"Accent1\">\n\t * <ui5-badge slot=\"badge\">\n\t * <ui5-icon slot=\"icon\" name=\"accelerated\"></ui5-icon>\n\t * </ui5-badge>\n\t * </ui5-avatar>\n\t *\n\t * @public\n\t * @since 1.7.0\n\t */\n\t@slot()\n\tbadge!: Array<HTMLElement>;\n\n\t_onclick?: (e: MouseEvent) => void;\n\tstatic i18nBundle: I18nBundle;\n\t_handleResizeBound: ResizeObserverCallback;\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis._handleResizeBound = this.handleResize.bind(this);\n\t}\n\n\tstatic async onDefine() {\n\t\tAvatar.i18nBundle = await getI18nBundle(\"@ui5/webcomponents\");\n\t}\n\n\tget tabindex() {\n\t\treturn this.forcedTabIndex || (this._interactive ? \"0\" : \"-1\");\n\t}\n\n\t/**\n\t * Returns the effective avatar size.\n\t * @default \"S\"\n\t * @private\n\t */\n\tget effectiveSize(): AvatarSize {\n\t\t// we read the attribute, because the \"size\" property will always have a default value\n\t\treturn this.getAttribute(\"size\") as AvatarSize || this._size;\n\t}\n\n\t/**\n\t * Returns the effective background color.\n\t * @default \"Accent6\"\n\t * @private\n\t */\n\tget еffectiveBackgroundColor(): AvatarColorScheme {\n\t\t// we read the attribute, because the \"background-color\" property will always have a default value\n\t\treturn this.getAttribute(\"color-scheme\") as AvatarColorScheme || this._colorScheme;\n\t}\n\n\tget _role() {\n\t\treturn this._interactive ? \"button\" : \"img\";\n\t}\n\n\tget _ariaHasPopup() {\n\t\treturn this._getAriaHasPopup();\n\t}\n\n\tget _fallbackIcon() {\n\t\tif (this.fallbackIcon === \"\") {\n\t\t\tthis.fallbackIcon = \"employee\";\n\t\t}\n\n\t\treturn this.fallbackIcon;\n\t}\n\n\tget _interactive() {\n\t\treturn this.interactive && !this.disabled;\n\t}\n\n\tget validInitials() {\n\t\t// initials should consist of only 1,2 or 3 latin letters\n\t\tconst validInitials = /^[a-zA-Zà-üÀ-Ü]{1,3}$/,\n\t\t\tareInitialsValid = this.initials && validInitials.test(this.initials);\n\n\t\tif (areInitialsValid) {\n\t\t\treturn this.initials;\n\t\t}\n\n\t\treturn null;\n\t}\n\n\tget accessibleNameText() {\n\t\tif (this.accessibleName) {\n\t\t\treturn this.accessibleName;\n\t\t}\n\n\t\treturn Avatar.i18nBundle.getText(AVATAR_TOOLTIP) || undefined;\n\t}\n\n\tget hasImage() {\n\t\tthis._hasImage = !!this.image.length;\n\t\treturn this._hasImage;\n\t}\n\n\tget initialsContainer(): HTMLObjectElement | null {\n\t\treturn this.getDomRef()!.querySelector(\".ui5-avatar-initials\");\n\t }\n\n\tonBeforeRendering() {\n\t\tthis._onclick = this._interactive ? this._onClickHandler.bind(this) : undefined;\n\t}\n\n\tasync onAfterRendering() {\n\t\tawait renderFinished();\n\t\tif (this.initials && !this.icon) {\n\t\t\tthis._checkInitials();\n\t\t}\n\t}\n\n\tonEnterDOM() {\n\t\tthis.initialsContainer && ResizeHandler.register(this.initialsContainer,\n\t\t\tthis._handleResizeBound);\n\t}\n\n\tonExitDOM() {\n\t\tthis.initialsContainer && ResizeHandler.deregister(this.initialsContainer,\n\t\t\tthis._handleResizeBound);\n\t}\n\n\thandleResize() {\n\t\tif (this.initials && !this.icon) {\n\t\t\tthis._checkInitials();\n\t\t}\n\t}\n\n\t_checkInitials() {\n\t\tconst avatar = this.getDomRef()!,\n\t\t\tavatarInitials = avatar.querySelector(\".ui5-avatar-initials\");\n\t\t// if there aren`t initalts set - the fallBack icon should be shown\n\t\tif (!this.validInitials) {\n\t\t\tavatarInitials!.classList.add(\"ui5-avatar-initials-hidden\");\n\t\t\treturn;\n\t\t}\n\t\t// if initials` width is bigger than the avatar, an icon should be shown inside the avatar\n\t\tavatarInitials && avatarInitials.classList.remove(\"ui5-avatar-initials-hidden\");\n\t\tif (this.initials && this.initials.length === 3) {\n\t\t\tif (avatarInitials && avatarInitials.scrollWidth > avatar.scrollWidth) {\n\t\t\t\tavatarInitials.classList.add(\"ui5-avatar-initials-hidden\");\n\t\t\t}\n\t\t}\n\t}\n\n\t_onClickHandler(e: MouseEvent) {\n\t\t// prevent the native event and fire custom event to ensure the noConfict \"ui5-click\" is fired\n\t\te.stopPropagation();\n\t\tthis._fireClick();\n\t}\n\n\t_onkeydown(e: KeyboardEvent) {\n\t\tif (!this._interactive) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (isEnter(e)) {\n\t\t\tthis._fireClick();\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._interactive && !e.shiftKey && isSpace(e)) {\n\t\t\tthis._fireClick();\n\t\t}\n\t}\n\n\t_fireClick() {\n\t\tthis.fireEvent(\"click\");\n\t\tthis.pressed = !this.pressed;\n\t}\n\n\t_onfocusout() {\n\t\tthis.focused = false;\n\t}\n\n\t_onfocusin() {\n\t\tif (this._interactive) {\n\t\t\tthis.focused = true;\n\t\t}\n\t}\n\n\t_getAriaHasPopup() {\n\t\tif (!this._interactive || this.ariaHaspopup === \"\") {\n\t\t\treturn;\n\t\t}\n\n\t\treturn this.ariaHaspopup;\n\t}\n}\n\nAvatar.define();\n\nexport default Avatar;\n"]}

package/dist/AvatarGroup.d.ts

@@ -1,11 +1,23 @@
 import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 import ItemNavigation from "@ui5/webcomponents-base/dist/delegate/ItemNavigation.js";
+import type { ITabbable } from "@ui5/webcomponents-base/dist/delegate/ItemNavigation.js";
 import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
 import Button from "./Button.js";
-import type IAvatar from "./Avatar.js";
+import AvatarSize from "./types/AvatarSize.js";
 import AvatarGroupType from "./types/AvatarGroupType.js";
 import AvatarColorScheme from "./types/AvatarColorScheme.js";
-import { IButton } from "./Interfaces.js";
+import type { IButton } from "./Button.js";
+/**
+ * Interface for components that represent an avatar and may be slotted in numerous higher-order components such as <code>ui5-avatar-group</code>
+ *
+ * @public
+ */
+interface IAvatarGroupItem extends HTMLElement, ITabbable {
+    еffectiveBackgroundColor: AvatarColorScheme;
+    size: `${AvatarSize}`;
+    effectiveSize: AvatarSize;
+    interactive: boolean;
+}
 type AvatarGroupClickEventDetail = {
     targetRef: HTMLElement;
     overflowButtonClicked: boolean;
@@ -113,7 +125,7 @@ declare class AvatarGroup extends UI5Element {
      * as the built-in overflow action has "Circle" shape.
      * @public
      */
-    items: Array<IAvatar>;
+    items: Array<IAvatarGroupItem>;
     /**
      * Defines the overflow button of the component.
      * <b>Note:</b> We recommend using the <code>ui5-button</code> component.
@@ -136,7 +148,7 @@ declare class AvatarGroup extends UI5Element {
      * @default []
      * @public
      */
-    get hiddenItems(): IAvatar[];
+    get hiddenItems(): IAvatarGroupItem[];
     /**
      * Returns an array containing the <code>AvatarColorScheme</code> values that correspond to the avatars in the component.
      * @default []
@@ -211,4 +223,4 @@ declare class AvatarGroup extends UI5Element {
     _getAriaHasPopup(): string | undefined;
 }
 export default AvatarGroup;
-export type { AvatarGroupClickEventDetail, };
+export type { AvatarGroupClickEventDetail, IAvatarGroupItem, };

package/dist/AvatarGroup.js

@@ -24,7 +24,6 @@ import { AVATAR_GROUP_DISPLAYED_HIDDEN_LABEL, AVATAR_GROUP_SHOW_COMPLETE_LIST_LA
 import AvatarGroupCss from "./generated/themes/AvatarGroup.css.js";
 // Template
 import AvatarGroupTemplate from "./generated/templates/AvatarGroupTemplate.lit.js";
-import "./Interfaces.js";
 const OVERFLOW_BTN_CLASS = "ui5-avatar-group-overflow-btn";
 const AVATAR_GROUP_OVERFLOW_BTN_SELECTOR = `.${OVERFLOW_BTN_CLASS}`;
 // based on RTL/LTR a margin-left/right is set respectfully
@@ -150,7 +149,7 @@ let AvatarGroup = AvatarGroup_1 = class AvatarGroup extends UI5Element {
      * @public
      */
     get colorScheme() {
-        return this.items.map(avatar => avatar._effectiveBackgroundColor);
+        return this.items.map(avatar => avatar.еffectiveBackgroundColor);
     }
     get _customOverflowButton() {
         return this.overflowButton.length ? this.overflowButton[0] : undefined;
@@ -236,11 +235,11 @@ let AvatarGroup = AvatarGroup_1 = class AvatarGroup extends UI5Element {
         return {
             overflowButton: {
                 "ui5-avatar-group-overflow-btn": true,
-                "ui5-avatar-group-overflow-btn-xs": this.firstAvatarSize === "XS",
-                "ui5-avatar-group-overflow-btn-s": this.firstAvatarSize === "S",
-                "ui5-avatar-group-overflow-btn-m": this.firstAvatarSize === "M",
-                "ui5-avatar-group-overflow-btn-l": this.firstAvatarSize === "L",
-                "ui5-avatar-group-overflow-btn-xl": this.firstAvatarSize === "XL",
+                "ui5-avatar-group-overflow-btn-xs": this.firstAvatarSize === AvatarSize.XS,
+                "ui5-avatar-group-overflow-btn-s": this.firstAvatarSize === AvatarSize.S,
+                "ui5-avatar-group-overflow-btn-m": this.firstAvatarSize === AvatarSize.M,
+                "ui5-avatar-group-overflow-btn-l": this.firstAvatarSize === AvatarSize.L,
+                "ui5-avatar-group-overflow-btn-xl": this.firstAvatarSize === AvatarSize.XL,
             },
         };
     }
@@ -324,7 +323,7 @@ let AvatarGroup = AvatarGroup_1 = class AvatarGroup extends UI5Element {
             // last avatar should not be offset as it breaks the container width and focus styles are no set correctly
             if (index !== this._itemsCount - 1 || this._customOverflowButton) {
                 // based on RTL the browser automatically sets left or right margin to avatars
-                avatar.style.marginInlineEnd = offsets[avatar._effectiveSize][this.type];
+                avatar.style.marginInlineEnd = offsets[avatar.effectiveSize][this.type];
             }
         });
     }

package/dist/AvatarGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarGroup.js","sourceRoot":"","sources":["../src/AvatarGroup.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,UAAU,MAAM,4CAA4C,CAAC;AACpE,OAAO,SAAS,MAAM,sDAAsD,CAAC;AAC7E,OAAO,aAAa,MAAM,wDAAwD,CAAC;AACnF,OAAO,cAAc,MAAM,yDAAyD,CAAC;AACrF,OAAO,EAAE,aAAa,EAAE,MAAM,4CAA4C,CAAC;AAE3E,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,IAAI,MAAM,iDAAiD,CAAC;AACnE,OAAO,KAAK,MAAM,kDAAkD,CAAC;AAErE,OAAO,EACN,OAAO,EACP,OAAO,GACP,MAAM,sCAAsC,CAAC;AAC9C,OAAO,MAAM,MAAM,aAAa,CAAC;AAEjC,OAAO,UAAU,MAAM,uBAAuB,CAAC;AAC/C,OAAO,eAAe,MAAM,4BAA4B,CAAC;AACzD,OAAO,iBAAiB,MAAM,8BAA8B,CAAC;AAE7D,OAAO,EACN,mCAAmC,EACnC,qCAAqC,EACrC,kCAAkC,EAClC,6BAA6B,EAC7B,iBAAiB,GACjB,MAAM,mCAAmC,CAAC;AAE3C,SAAS;AACT,OAAO,cAAc,MAAM,uCAAuC,CAAC;AAEnE,WAAW;AACX,OAAO,mBAAmB,MAAM,kDAAkD,CAAC;AACnF,OAAwB,iBAAiB,CAAC;AAE1C,MAAM,kBAAkB,GAAG,+BAA+B,CAAC;AAC3D,MAAM,kCAAkC,GAAG,IAAI,kBAAkB,EAAE,CAAC;AAEpE,2DAA2D;AAC3D,MAAM,OAAO,GAAG;IACf,CAAC,UAAU,CAAC,EAAE,CAAC,EAAE;QAChB,CAAC,eAAe,CAAC,UAAU,CAAC,EAAE,WAAW;QACzC,CAAC,eAAe,CAAC,KAAK,CAAC,EAAE,UAAU;KACnC;IACD,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE;QACf,CAAC,eAAe,CAAC,UAAU,CAAC,EAAE,UAAU;QACxC,CAAC,eAAe,CAAC,KAAK,CAAC,EAAE,UAAU;KACnC;IACD,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE;QACf,CAAC,eAAe,CAAC,UAAU,CAAC,EAAE,UAAU;QACxC,CAAC,eAAe,CAAC,KAAK,CAAC,EAAE,WAAW;KACpC;IACD,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE;QACf,CAAC,eAAe,CAAC,UAAU,CAAC,EAAE,UAAU;QACxC,CAAC,eAAe,CAAC,KAAK,CAAC,EAAE,QAAQ;KACjC;IACD,CAAC,UAAU,CAAC,EAAE,CAAC,EAAE;QAChB,CAAC,eAAe,CAAC,UAAU,CAAC,EAAE,SAAS;QACvC,CAAC,eAAe,CAAC,KAAK,CAAC,EAAE,UAAU;KACnC;CACD,CAAC;AAOF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsEG;AAqCH,IAAM,WAAW,mBAAjB,MAAM,WAAY,SAAQ,UAAU;IA2DnC;QACC,KAAK,EAAE,CAAC;QAER,IAAI,CAAC,eAAe,GAAG,IAAI,cAAc,CAAC,IAAI,EAAE;YAC/C,gBAAgB,EAAE,GAAG,EAAE;gBACtB,OAAO,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC;YACzE,CAAC;SACD,CAAC,CAAC;QACH,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC;QACrB,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC;QACtB,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACnD,CAAC;IAED,MAAM,CAAC,KAAK,CAAC,QAAQ;QACpB,aAAW,CAAC,UAAU,GAAG,MAAM,aAAa,CAAC,oBAAoB,CAAC,CAAC;IACpE,CAAC;IAED;;;;OAIG;IACH,IAAI,WAAW;QACd,OAAO,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;IACjD,CAAC;IAED;;;;OAIG;IACH,IAAI,WAAW;QACd,OAAO,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,yBAAyB,CAAC,CAAC;IACnE,CAAC;IAED,IAAI,qBAAqB;QACxB,OAAO,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IACxE,CAAC;IAED,IAAI,cAAc;QACjB,MAAM,gBAAgB,GAAG,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC;QACjD,MAAM,YAAY,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,6BAA6B,CAAC,CAAC,CAAC,kCAAkC,CAAC;QAExG,oBAAoB;QACpB,IAAI,IAAI,GAAG,aAAW,CAAC,UAAU,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC;QAExD,qCAAqC;QACrC,IAAI,IAAI,IAAI,aAAW,CAAC,UAAU,CAAC,OAAO,CAAC,mCAAmC,EAAE,IAAI,CAAC,WAAW,GAAG,gBAAgB,EAAE,gBAAgB,CAAC,EAAE,CAAC;QAEzI,IAAI,IAAI,CAAC,QAAQ,EAAE;YAClB,+EAA+E;YAC/E,IAAI,IAAI,IAAI,aAAW,CAAC,UAAU,CAAC,OAAO,CAAC,qCAAqC,CAAC,EAAE,CAAC;SACpF;aAAM;YACN,mEAAmE;YACnE,IAAI,IAAI,IAAI,aAAW,CAAC,UAAU,CAAC,OAAO,CAAC,iBAAiB,CAAC,EAAE,CAAC;SAChE;QAED,OAAO,IAAI,CAAC;IACb,CAAC;IAED,IAAI,4BAA4B;QAC/B,OAAO,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,aAAW,CAAC,UAAU,CAAC,OAAO,CAAC,qCAAqC,CAAC,CAAC;IAC1G,CAAC;IAED,IAAI,sBAAsB;QACzB,OAAO,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,gBAAgB,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC;IAC5D,CAAC;IAED,IAAI,4BAA4B;QAC/B,OAAO;YACN,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,gBAAgB,EAAE;SAC7D,CAAC;IACH,CAAC;IAED,IAAI,KAAK;QACR,OAAO,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC;IAC3C,CAAC;IAED,IAAI,iBAAiB;QACpB,OAAO,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,YAAY,CAAC;IAC7C,CAAC;IAED,IAAI,kBAAkB;QACrB,OAAO,IAAI,CAAC,YAAY,KAAK,CAAC,CAAC;IAChC,CAAC;IAED,IAAI,QAAQ;QACX,OAAO,IAAI,CAAC,IAAI,KAAK,eAAe,CAAC,KAAK,CAAC;IAC5C,CAAC;IAED,IAAI,WAAW;QACd,OAAO,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;IAC1B,CAAC;IAED,IAAI,cAAc;QACjB,OAAO,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC;IACnC,CAAC;IAED,IAAI,eAAe;QAClB,OAAO,IAAI,CAAC,UAAW,CAAC,aAAa,CAAS,kCAAkC,CAAC,CAAC;IACnF,CAAC;IAED;;;;;;;OAOG;IACH,IAAI,6BAA6B;QAChC,MAAM,MAAM,GAAG,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,IAAI,CAAC,eAAe,CAAC;QAC9F,kFAAkF;QAElF,IAAI,CAAC,MAAM,EAAE;YACZ,OAAO,CAAC,CAAC;SACT;QAED,IAAI,IAAI,CAAC,QAAQ,EAAE;YAClB,IAAI,IAAI,GAAgB,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;YACtC,MAAM,iBAAiB,GAAG,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC;YAE5D,2FAA2F;YAC3F,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,MAAM,EAAE;gBACzB,IAAI,GAAG,MAAM,CAAC;aACd;YAED,OAAO,IAAI,CAAC,YAAY,KAAK,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,iBAAiB,CAAC;SACpF;QAED,OAAO,MAAM,CAAC,WAAW,CAAC;IAC3B,CAAC;IAED,IAAI,eAAe;QAClB,OAAO,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;IAC3B,CAAC;IAED,IAAI,OAAO;QACV,OAAO;YACN,cAAc,EAAE;gBACf,+BAA+B,EAAE,IAAI;gBACrC,kCAAkC,EAAE,IAAI,CAAC,eAAe,KAAK,IAAI;gBACjE,iCAAiC,EAAE,IAAI,CAAC,eAAe,KAAK,GAAG;gBAC/D,iCAAiC,EAAE,IAAI,CAAC,eAAe,KAAK,GAAG;gBAC/D,iCAAiC,EAAE,IAAI,CAAC,eAAe,KAAK,GAAG;gBAC/D,kCAAkC,EAAE,IAAI,CAAC,eAAe,KAAK,IAAI;aACjE;SACD,CAAC;IACH,CAAC;IAED,gBAAgB;QACf,IAAI,CAAC,cAAc,EAAE,CAAC;IACvB,CAAC;IAED,iBAAiB;QAChB,IAAI,IAAI,CAAC,qBAAqB,EAAE;YAC/B,IAAI,CAAC,qBAAqB,CAAC,cAAc,GAAG,IAAI,CAAC,QAAQ,CAAC;SAC1D;QAED,IAAI,CAAC,eAAe,EAAE,CAAC;IACxB,CAAC;IAED,UAAU;QACT,aAAa,CAAC,QAAQ,CAAC,IAAI,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;IACrD,CAAC;IAED,SAAS;QACR,aAAa,CAAC,UAAU,CAAC,IAAI,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;IACvD,CAAC;IAED,SAAS;QACR,IAAI,CAAC,cAAc,EAAE,CAAC;IACvB,CAAC;IAED,UAAU,CAAC,CAAgB;QAC1B,+DAA+D;QAC/D,yDAAyD;QACzD,0EAA0E;QAC1E,IAAI,IAAI,CAAC,QAAQ,EAAE;YAClB,IAAI,OAAO,CAAC,CAAC,CAAC,EAAE;gBACf,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,MAAqB,CAAC,CAAC;aAC9C;iBAAM,IAAI,OAAO,CAAC,CAAC,CAAC,EAAE;gBACtB,oBAAoB;gBACpB,CAAC,CAAC,cAAc,EAAE,CAAC;aACnB;SACD;IACF,CAAC;IAED,QAAQ,CAAC,CAAgB;QACxB,IAAI,CAAC,CAAC,CAAC,QAAQ,IAAI,OAAO,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,QAAQ,EAAE;YAC/C,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,MAAqB,CAAC,CAAC;YAC9C,CAAC,CAAC,cAAc,EAAE,CAAC;SACnB;IACF,CAAC;IAED,eAAe,CAAC,SAAsB;QACrC,MAAM,uBAAuB,GAAG,SAAS,CAAC,SAAS,CAAC,QAAQ,CAAC,kBAAkB,CAAC,IAAI,SAAS,KAAK,IAAI,CAAC,qBAAqB,CAAC;QAE7H,IAAI,CAAC,SAAS,CAA8B,OAAO,EAAE;YACpD,SAAS;YACT,qBAAqB,EAAE,uBAAuB;SAC9C,CAAC,CAAC;IACJ,CAAC;IAED,QAAQ,CAAC,CAAa;QACrB,MAAM,MAAM,GAAG,CAAC,CAAC,MAAqB,CAAC;QACvC,mHAAmH;QACnH,MAAM,QAAQ,GAAG,MAAM,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC;QACnD,CAAC,CAAC,eAAe,EAAE,CAAC;QAEpB,IAAI,IAAI,CAAC,QAAQ,IAAI,QAAQ,EAAE;YAC9B,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;SAC7B;IACF,CAAC;IAED,WAAW,CAAC,CAAa;QACxB,MAAM,MAAM,GAAG,CAAC,CAAC,MAAqB,CAAC;QACvC,iEAAiE;QACjE,MAAM,QAAQ,GAAG,MAAM,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC;QACnD,CAAC,CAAC,eAAe,EAAE,CAAC;QAEpB,IAAI,QAAQ,EAAE;YACb,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;SAC7B;IACF,CAAC;IAED;;;;OAIG;IACH,eAAe;QACd,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC;QAErB,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;YACpC,MAAM,UAAU,GAAG,IAAI,CAAC,uBAAuB,EAAE,CAAC;YAClD,MAAM,CAAC,WAAW,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;YAEpC,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,eAAe,CAAC,EAAE;gBAC1C,gDAAgD;gBAChD,MAAM,CAAC,YAAY,CAAC,eAAe,EAAE,iBAAiB,CAAC,SAAS,UAAU,EAAoC,CAAC,CAAC,CAAC;aACjH;YAED,0GAA0G;YAC1G,IAAI,KAAK,KAAK,IAAI,CAAC,WAAW,GAAG,CAAC,IAAI,IAAI,CAAC,qBAAqB,EAAE;gBACjE,8EAA8E;gBAC9E,MAAM,CAAC,KAAK,CAAC,eAAe,GAAG,OAAO,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;aACzE;QACF,CAAC,CAAC,CAAC;IACJ,CAAC;IAED,UAAU,CAAC,CAAa;QACvB,IAAI,CAAC,eAAe,CAAC,cAAc,CAAC,CAAC,CAAC,MAAiB,CAAC,CAAC;IAC1D,CAAC;IAED;;;;;OAKG;IACH,eAAe,CAAC,IAAiB;QAChC,MAAM,KAAK,GAAG,IAAI,CAAC,YAAY,KAAK,KAAK,CAAC;QAC1C,MAAM,cAAc,GAAG,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC;QAEzD,IAAI,KAAK,EAAE;YACV,MAAM,gBAAgB,GAAG,IAAI,CAAC,YAA2B,CAAC;YAE1D,kFAAkF;YAClF,gEAAgE;YAEhE,IAAI,CAAC,gBAAgB,EAAE;gBACtB,OAAO,CAAC,CAAC;aACT;YAED,OAAO,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,WAAW,CAAC;SACzE;QAED,OAAO,cAAc,CAAC;IACvB,CAAC;IAED;;;OAGG;IACH,cAAc;QACb,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;YAC1B,8BAA8B;YAC9B,OAAO;SACP;QAED,IAAI,WAAW,GAAG,CAAC,CAAC;QAEpB,KAAK,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC,WAAW,EAAE,KAAK,EAAE,EAAE;YACtD,MAAM,IAAI,GAAY,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;YAExC,+DAA+D;YAC/D,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;YAEpB,wDAAwD;YACxD,8EAA8E;YAC9E,IAAI,UAAU,GAAG,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,WAAW,CAAC;YAE/D,IAAI,KAAK,KAAK,IAAI,CAAC,WAAW,GAAG,CAAC,IAAI,IAAI,CAAC,qBAAqB,EAAE;gBACjE,UAAU,IAAI,IAAI,CAAC,6BAA6B,CAAC;aACjD;YAED,IAAI,UAAU,GAAG,IAAI,CAAC,WAAW,EAAE;gBAClC,WAAW,GAAG,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;gBACvC,MAAM;aACN;SACD;QAED,qDAAqD;QACrD,IAAI,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;IACnC,CAAC;IAED,uBAAuB;QACtB,yGAAyG;QACzG,IAAI,EAAE,IAAI,CAAC,WAAW,GAAG,EAAE,EAAE;YAC5B,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC;SACrB;QACD,OAAO,IAAI,CAAC,WAAW,CAAC;IACzB,CAAC;IAED,eAAe,CAAC,WAAmB;QAClC,MAAM,eAAe,GAAG,IAAI,CAAC,YAAY,KAAK,WAAW,CAAC;QAE1D,IAAI,CAAC,YAAY,GAAG,WAAW,CAAC;QAEhC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;YAClC,IAAI,CAAC,MAAM,GAAG,KAAK,IAAI,IAAI,CAAC,iBAAiB,CAAC;QAC/C,CAAC,CAAC,CAAC;QAEH,IAAI,CAAC,mBAAmB,GAAG,IAAI,WAAW,GAAG,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;QAErE,IAAI,eAAe,EAAE;YACpB,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;SAC3B;IACF,CAAC;IAED,gBAAgB;QACf,IAAI,IAAI,CAAC,YAAY,KAAK,EAAE,EAAE;YAC7B,OAAO;SACP;QAED,OAAO,IAAI,CAAC,YAAY,CAAC;IAC1B,CAAC;CACD,CAAA;AA/YA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,eAAe,EAAE,YAAY,EAAE,eAAe,CAAC,KAAK,EAAE,CAAC;yCAC7C;AAc5B;IADC,QAAQ,EAAE;iDACW;AAMtB;IADC,QAAQ,CAAC,EAAE,WAAW,EAAE,IAAI,EAAE,CAAC;wDACH;AAW7B;IADC,IAAI,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;0CACtB;AAYvB;IADC,IAAI,EAAE;mDACyB;AAnD3B,WAAW;IAnChB,aAAa,CAAC;QACd,GAAG,EAAE,kBAAkB;QACvB,QAAQ,EAAE,SAAS;QACnB,QAAQ,EAAE,mBAAmB;QAC7B,MAAM,EAAE,cAAc;QACtB,YAAY,EAAE,CAAC,MAAM,CAAC;KACtB,CAAC;IACF;;;;;;;MAOE;;IACD,KAAK,CAA8B,OAAO,EAAE;QAC5C,MAAM,EAAE;YACP;;cAEE;YACF,SAAS,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE;YAChC;;cAEE;YACF,qBAAqB,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE;SACxC;KACD,CAAC;IAEF;;;;;MAKE;;IACD,KAAK,CAAC,UAAU,CAAC;GACZ,WAAW,CAuZhB;AAED,WAAW,CAAC,MAAM,EAAE,CAAC;AAErB,eAAe,WAAW,CAAC","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport ItemNavigation from \"@ui5/webcomponents-base/dist/delegate/ItemNavigation.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event.js\";\n\nimport {\n\tisEnter,\n\tisSpace,\n} from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport Button from \"./Button.js\";\nimport type IAvatar from \"./Avatar.js\";\nimport AvatarSize from \"./types/AvatarSize.js\";\nimport AvatarGroupType from \"./types/AvatarGroupType.js\";\nimport AvatarColorScheme from \"./types/AvatarColorScheme.js\";\n\nimport {\n\tAVATAR_GROUP_DISPLAYED_HIDDEN_LABEL,\n\tAVATAR_GROUP_SHOW_COMPLETE_LIST_LABEL,\n\tAVATAR_GROUP_ARIA_LABEL_INDIVIDUAL,\n\tAVATAR_GROUP_ARIA_LABEL_GROUP,\n\tAVATAR_GROUP_MOVE,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// Styles\nimport AvatarGroupCss from \"./generated/themes/AvatarGroup.css.js\";\n\n// Template\nimport AvatarGroupTemplate from \"./generated/templates/AvatarGroupTemplate.lit.js\";\nimport { IButton } from \"./Interfaces.js\";\n\nconst OVERFLOW_BTN_CLASS = \"ui5-avatar-group-overflow-btn\";\nconst AVATAR_GROUP_OVERFLOW_BTN_SELECTOR = `.${OVERFLOW_BTN_CLASS}`;\n\n// based on RTL/LTR a margin-left/right is set respectfully\nconst offsets = {\n\t[AvatarSize.XS]: {\n\t\t[AvatarGroupType.Individual]: \"0.0625rem\",\n\t\t[AvatarGroupType.Group]: \"-0.75rem\",\n\t},\n\t[AvatarSize.S]: {\n\t\t[AvatarGroupType.Individual]: \"0.125rem\",\n\t\t[AvatarGroupType.Group]: \"-1.25rem\",\n\t},\n\t[AvatarSize.M]: {\n\t\t[AvatarGroupType.Individual]: \"0.125rem\",\n\t\t[AvatarGroupType.Group]: \"-1.625rem\",\n\t},\n\t[AvatarSize.L]: {\n\t\t[AvatarGroupType.Individual]: \"0.125rem\",\n\t\t[AvatarGroupType.Group]: \" -2rem\",\n\t},\n\t[AvatarSize.XL]: {\n\t\t[AvatarGroupType.Individual]: \"0.25rem\",\n\t\t[AvatarGroupType.Group]: \"-2.75rem\",\n\t},\n};\n\ntype AvatarGroupClickEventDetail = {\n\ttargetRef: HTMLElement,\n\toverflowButtonClicked: boolean,\n};\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n * Displays a group of avatars arranged horizontally. It is useful to visually\n * showcase a group of related avatars, such as, project team members or employees.\n *\n * The component allows you to display the avatars in different sizes,\n * depending on your use case.\n *\n * The <code>AvatarGroup</code> component has two group types:\n * <ul>\n * <li><code>Group</code> type: The avatars are displayed as partially overlapped on\n * top of each other and the entire group has one click/tap area.</li>\n * <li><code>Individual</code> type: The avatars are displayed side-by-side and each\n * avatar has its own click/tap area.</li>\n * </ul>\n *\n * <h3>Responsive Behavior</h3>\n *\n * When the available space is less than the width required to display all avatars,\n * an overflow visualization appears as a button placed at the end with the same shape\n * and size as the avatars. The visualization displays the number of avatars that have overflowed\n * and are not currently visible.\n *\n * <h3>Usage</h3>\n *\n * Use the <code>AvatarGroup</code> if:\n * <ul>\n * <li>You want to display a group of avatars.</li>\n * <li>You want to display several avatars which have something in common.</li>\n * </ul>\n *\n * Do not use the <code>AvatarGroup</code> if:\n * <ul>\n * <li>You want to display a single avatar.</li>\n * <li>You want to display a gallery for simple images.</li>\n * <li>You want to use it for other visual content than avatars.</li>\n * </ul>\n *\n * <h3>Keyboard Handling</h3>\n * The component provides advanced keyboard handling.\n * When focused, the user can use the following keyboard\n * shortcuts in order to perform a navigation:\n *\n * <br>\n * <code>type</code> Individual:\n * <br>\n * <ul>\n * <li>[TAB] - Move focus to the overflow button</li>\n * <li>[LEFT] - Navigate one avatar to the left</li>\n * <li>[RIGHT] - Navigate one avatar to the right</li>\n * <li>[HOME] - Navigate to the first avatar</li>\n * <li>[END] - Navigate to the last avatar</li>\n * <li>[SPACE],[ENTER],[RETURN] - Trigger <code>ui5-click</code> event</li>\n * </ul>\n * <br>\n * <code>type</code> Group:\n * <br>\n * <ul>\n * <li>[TAB] - Move focus to the next interactive element after the component</li>\n * <li>[SPACE],[ENTER],[RETURN] - Trigger <code>ui5-click</code> event</li>\n * </ul>\n * <br>\n *\n * @constructor\n * @extends UI5Element\n * @since 1.0.0-rc.11\n * @public\n */\n\n@customElement({\n\ttag: \"ui5-avatar-group\",\n\trenderer: litRender,\n\ttemplate: AvatarGroupTemplate,\n\tstyles: AvatarGroupCss,\n\tdependencies: [Button],\n})\n/**\n* Fired when the component is activated either with a\n* click/tap or by using the Enter or Space key.\n* @param {HTMLElement} targetRef The DOM ref of the clicked item.\n* @param {boolean} overflowButtonClicked indicates if the overflow button is clicked\n* @public\n* @since 1.0.0-rc.11\n*/\n@event<AvatarGroupClickEventDetail>(\"click\", {\n\tdetail: {\n\t\t/**\n\t\t* @public\n\t\t*/\n\t\ttargetRef: { type: HTMLElement },\n\t\t/**\n\t\t* @public\n\t\t*/\n\t\toverflowButtonClicked: { type: Boolean },\n\t},\n})\n\n/**\n* Fired when the count of visible <code>ui5-avatar</code> elements in the\n* component has changed\n* @public\n* @since 1.0.0-rc.13\n*/\n@event(\"overflow\")\nclass AvatarGroup extends UI5Element {\n\t/**\n\t * Defines the mode of the <code>AvatarGroup</code>.\n\t *\n\t * @default \"Group\"\n\t * @public\n\t */\n\t@property({ type: AvatarGroupType, defaultValue: AvatarGroupType.Group })\n\ttype!: `${AvatarGroupType}`;\n\n\t/**\n\t * Defines the aria-haspopup value of the component on:\n\t * <br><br>\n\t * <ul>\n\t * <li> the whole container when <code>type</code> property is <code>Group</code></li>\n\t * <li> the default \"More\" overflow button when <code>type</code> is <code>Individual</code></li>\n\t * </ul>\n\t * <br><br>\n\t * @since 1.0.0-rc.15\n\t * @protected\n\t */\n\t@property()\n\tariaHaspopup!: string;\n\n\t/**\n\t * @private\n\t */\n\t@property({ noAttribute: true })\n\t_overflowButtonText!: string;\n\n\t/**\n\t * Defines the items of the component. Use the <code>ui5-avatar</code> component as an item.\n\t * <br><br>\n\t * <b>Note:</b> The UX guidelines recommends using avatars with \"Circle\" shape.\n\t * Moreover, if you use avatars with \"Square\" shape, there will be visual inconsistency\n\t * as the built-in overflow action has \"Circle\" shape.\n\t * @public\n\t */\n\t@slot({ type: HTMLElement, \"default\": true })\n\titems!: Array<IAvatar>;\n\n\t/**\n\t * Defines the overflow button of the component.\n\t * <b>Note:</b> We recommend using the <code>ui5-button</code> component.\n\t * <br><br>\n\t * <b>Note:</b> If this slot is not used, the component will\n\t * display the built-in overflow button.\n\t * @public\n\t * @since 1.0.0-rc.13\n\t */\n\t@slot()\n\toverflowButton!: Array<IButton>;\n\n\tstatic i18nBundle: I18nBundle;\n\t_onResizeHandler: () => void;\n\t_colorIndex: number;\n\t_hiddenItems: number;\n\t_itemNavigation: ItemNavigation;\n\n\tconstructor() {\n\t\tsuper();\n\n\t\tthis._itemNavigation = new ItemNavigation(this, {\n\t\t\tgetItemsCallback: () => {\n\t\t\t\treturn this._isGroup ? [] : this.items.slice(0, this._hiddenStartIndex);\n\t\t\t},\n\t\t});\n\t\tthis._colorIndex = 0;\n\t\tthis._hiddenItems = 0;\n\t\tthis._onResizeHandler = this._onResize.bind(this);\n\t}\n\n\tstatic async onDefine() {\n\t\tAvatarGroup.i18nBundle = await getI18nBundle(\"@ui5/webcomponents\");\n\t}\n\n\t/**\n\t * Returns an array containing the <code>ui5-avatar</code> instances that are currently not displayed due to lack of space.\n\t * @default []\n\t * @public\n\t */\n\tget hiddenItems(): IAvatar[] {\n\t\treturn this.items.slice(this._hiddenStartIndex);\n\t}\n\n\t/**\n\t * Returns an array containing the <code>AvatarColorScheme</code> values that correspond to the avatars in the component.\n\t * @default []\n\t * @public\n\t */\n\tget colorScheme(): AvatarColorScheme[] {\n\t\treturn this.items.map(avatar => avatar._effectiveBackgroundColor);\n\t}\n\n\tget _customOverflowButton() {\n\t\treturn this.overflowButton.length ? this.overflowButton[0] : undefined;\n\t}\n\n\tget _ariaLabelText() {\n\t\tconst hiddenItemsCount = this.hiddenItems.length;\n\t\tconst typeLabelKey = this._isGroup ? AVATAR_GROUP_ARIA_LABEL_GROUP : AVATAR_GROUP_ARIA_LABEL_INDIVIDUAL;\n\n\t\t// avatar type label\n\t\tlet text = AvatarGroup.i18nBundle.getText(typeLabelKey);\n\n\t\t// add displayed-hidden avatars label\n\t\ttext += ` ${AvatarGroup.i18nBundle.getText(AVATAR_GROUP_DISPLAYED_HIDDEN_LABEL, this._itemsCount - hiddenItemsCount, hiddenItemsCount)}`;\n\n\t\tif (this._isGroup) {\n\t\t\t// the container role is \"button\", add the message for complete list activation\n\t\t\ttext += ` ${AvatarGroup.i18nBundle.getText(AVATAR_GROUP_SHOW_COMPLETE_LIST_LABEL)}`;\n\t\t} else {\n\t\t\t// the container role is \"group\", add the \"how to navigate\" message\n\t\t\ttext += ` ${AvatarGroup.i18nBundle.getText(AVATAR_GROUP_MOVE)}`;\n\t\t}\n\n\t\treturn text;\n\t}\n\n\tget _overflowButtonAriaLabelText() {\n\t\treturn this._isGroup ? undefined : AvatarGroup.i18nBundle.getText(AVATAR_GROUP_SHOW_COMPLETE_LIST_LABEL);\n\t}\n\n\tget _containerAriaHasPopup() {\n\t\treturn this._isGroup ? this._getAriaHasPopup() : undefined;\n\t}\n\n\tget _overflowButtonAccAttributes() {\n\t\treturn {\n\t\t\thasPopup: this._isGroup ? undefined : this._getAriaHasPopup(),\n\t\t};\n\t}\n\n\tget _role() {\n\t\treturn this._isGroup ? \"button\" : \"group\";\n\t}\n\n\tget _hiddenStartIndex() {\n\t\treturn this._itemsCount - this._hiddenItems;\n\t}\n\n\tget _overflowBtnHidden() {\n\t\treturn this._hiddenItems === 0;\n\t}\n\n\tget _isGroup() {\n\t\treturn this.type === AvatarGroupType.Group;\n\t}\n\n\tget _itemsCount() {\n\t\treturn this.items.length;\n\t}\n\n\tget _groupTabIndex() {\n\t\treturn this._isGroup ? \"0\" : \"-1\";\n\t}\n\n\tget _overflowButton() {\n\t\treturn this.shadowRoot!.querySelector<Button>(AVATAR_GROUP_OVERFLOW_BTN_SELECTOR);\n\t}\n\n\t/**\n\t * Return the effective overflow button width\n\t * Differences are that when in \"Group\" type the button is offset and overlaps the avatars\n\t *\n\t * 1) In case of \"Group\", (LTR/RTL aware) button width is qual to second item offset left/right\n\t * 2) In case of \"Individual\" group type width is directly taken from button element\n\t * @private\n\t */\n\tget _overflowButtonEffectiveWidth() {\n\t\tconst button = this._customOverflowButton ? this._customOverflowButton : this._overflowButton;\n\t\t// if in \"Group\" mode overflow button size is equal to the offset from second item\n\n\t\tif (!button) {\n\t\t\treturn 0;\n\t\t}\n\n\t\tif (this._isGroup) {\n\t\t\tlet item: HTMLElement = this.items[1];\n\t\t\tconst ltrEffectiveWidth = item.offsetLeft - this.offsetLeft;\n\n\t\t\t// in some cases when second avatar is overflowed the offset of the button is the right one\n\t\t\tif (!item || item.hidden) {\n\t\t\t\titem = button;\n\t\t\t}\n\n\t\t\treturn this.effectiveDir === \"rtl\" ? this._getWidthToItem(item) : ltrEffectiveWidth;\n\t\t}\n\n\t\treturn button.offsetWidth;\n\t}\n\n\tget firstAvatarSize() {\n\t\treturn this.items[0].size;\n\t}\n\n\tget classes() {\n\t\treturn {\n\t\t\toverflowButton: {\n\t\t\t\t\"ui5-avatar-group-overflow-btn\": true,\n\t\t\t\t\"ui5-avatar-group-overflow-btn-xs\": this.firstAvatarSize === \"XS\",\n\t\t\t\t\"ui5-avatar-group-overflow-btn-s\": this.firstAvatarSize === \"S\",\n\t\t\t\t\"ui5-avatar-group-overflow-btn-m\": this.firstAvatarSize === \"M\",\n\t\t\t\t\"ui5-avatar-group-overflow-btn-l\": this.firstAvatarSize === \"L\",\n\t\t\t\t\"ui5-avatar-group-overflow-btn-xl\": this.firstAvatarSize === \"XL\",\n\t\t\t},\n\t\t};\n\t}\n\n\tonAfterRendering() {\n\t\tthis._overflowItems();\n\t}\n\n\tonBeforeRendering() {\n\t\tif (this._customOverflowButton) {\n\t\t\tthis._customOverflowButton.nonInteractive = this._isGroup;\n\t\t}\n\n\t\tthis._prepareAvatars();\n\t}\n\n\tonEnterDOM() {\n\t\tResizeHandler.register(this, this._onResizeHandler);\n\t}\n\n\tonExitDOM() {\n\t\tResizeHandler.deregister(this, this._onResizeHandler);\n\t}\n\n\t_onResize() {\n\t\tthis._overflowItems();\n\t}\n\n\t_onkeydown(e: KeyboardEvent) {\n\t\t// when type is \"Individual\" the ui5-avatar and ui5-button both\n\t\t// fire \"click\" event when SPACE or ENTER are pressed and\n\t\t// AvatarGroup \"click\" is fired in their handlers (_onClick, _onUI5Click).\n\t\tif (this._isGroup) {\n\t\t\tif (isEnter(e)) {\n\t\t\t\tthis._fireGroupEvent(e.target as HTMLElement);\n\t\t\t} else if (isSpace(e)) {\n\t\t\t\t// prevent scrolling\n\t\t\t\te.preventDefault();\n\t\t\t}\n\t\t}\n\t}\n\n\t_onkeyup(e: KeyboardEvent) {\n\t\tif (!e.shiftKey && isSpace(e) && this._isGroup) {\n\t\t\tthis._fireGroupEvent(e.target as HTMLElement);\n\t\t\te.preventDefault();\n\t\t}\n\t}\n\n\t_fireGroupEvent(targetRef: HTMLElement) {\n\t\tconst isOverflowButtonClicked = targetRef.classList.contains(OVERFLOW_BTN_CLASS) || targetRef === this._customOverflowButton;\n\n\t\tthis.fireEvent<AvatarGroupClickEventDetail>(\"click\", {\n\t\t\ttargetRef,\n\t\t\toverflowButtonClicked: isOverflowButtonClicked,\n\t\t});\n\t}\n\n\t_onClick(e: MouseEvent) {\n\t\tconst target = e.target as HTMLElement;\n\t\t// no matter the value of noConflict, the ui5-button and the group container (div) always fire a native click event\n\t\tconst isButton = target.hasAttribute(\"ui5-button\");\n\t\te.stopPropagation();\n\n\t\tif (this._isGroup || isButton) {\n\t\t\tthis._fireGroupEvent(target);\n\t\t}\n\t}\n\n\t_onUI5Click(e: MouseEvent) {\n\t\tconst target = e.target as HTMLElement;\n\t\t// when noConflict=true only ui5-avatar will fire ui5-click event\n\t\tconst isAvatar = target.hasAttribute(\"ui5-avatar\");\n\t\te.stopPropagation();\n\n\t\tif (isAvatar) {\n\t\t\tthis._fireGroupEvent(target);\n\t\t}\n\t}\n\n\t/**\n\t * Modifies avatars to the needs of avatar group properties. Respects already set size and background color.\n\t * Set the margins (offsets) based on RTL/LTR.\n\t * @private\n\t */\n\t_prepareAvatars() {\n\t\tthis._colorIndex = 0;\n\n\t\tthis.items.forEach((avatar, index) => {\n\t\t\tconst colorIndex = this._getNextBackgroundColor();\n\t\t\tavatar.interactive = !this._isGroup;\n\n\t\t\tif (!avatar.getAttribute(\"_color-scheme\")) {\n\t\t\t\t// AvatarGroup respects colors set to ui5-avatar\n\t\t\t\tavatar.setAttribute(\"_color-scheme\", AvatarColorScheme[`Accent${colorIndex}` as keyof typeof AvatarColorScheme]);\n\t\t\t}\n\n\t\t\t// last avatar should not be offset as it breaks the container width and focus styles are no set correctly\n\t\t\tif (index !== this._itemsCount - 1 || this._customOverflowButton) {\n\t\t\t\t// based on RTL the browser automatically sets left or right margin to avatars\n\t\t\t\tavatar.style.marginInlineEnd = offsets[avatar._effectiveSize][this.type];\n\t\t\t}\n\t\t});\n\t}\n\n\t_onfocusin(e: FocusEvent) {\n\t\tthis._itemNavigation.setCurrentItem(e.target as IAvatar);\n\t}\n\n\t/**\n\t * Returns the total width to item excluding the item width\n\t * RTL/LTR aware\n\t * @private\n\t * @param item\n\t */\n\t_getWidthToItem(item: HTMLElement) {\n\t\tconst isRTL = this.effectiveDir === \"rtl\";\n\t\tconst ltrWidthToItem = item.offsetLeft - this.offsetLeft;\n\n\t\tif (isRTL) {\n\t\t\tconst itemOffsetParent = item.offsetParent as HTMLElement;\n\n\t\t\t// in RTL the total width is equal to difference of the parent container width and\n\t\t\t// how much is the item offset to the left minus its offsetWidth\n\n\t\t\tif (!itemOffsetParent) {\n\t\t\t\treturn 0;\n\t\t\t}\n\n\t\t\treturn itemOffsetParent.offsetWidth - item.offsetLeft - item.offsetWidth;\n\t\t}\n\n\t\treturn ltrWidthToItem;\n\t}\n\n\t/**\n\t * Overflows items that were not able to fit the container\n\t * @private\n\t */\n\t_overflowItems() {\n\t\tif (this.items.length < 2) {\n\t\t\t// no need to overflow avatars\n\t\t\treturn;\n\t\t}\n\n\t\tlet hiddenItems = 0;\n\n\t\tfor (let index = 0; index < this._itemsCount; index++) {\n\t\t\tconst item: IAvatar = this.items[index];\n\n\t\t\t// show item to determine if it will fit the new container size\n\t\t\titem.hidden = false;\n\n\t\t\t// container width to current item + item width (avatar)\n\t\t\t// used to determine whether the following items will fit the container or not\n\t\t\tlet totalWidth = this._getWidthToItem(item) + item.offsetWidth;\n\n\t\t\tif (index !== this._itemsCount - 1 || this._customOverflowButton) {\n\t\t\t\ttotalWidth += this._overflowButtonEffectiveWidth;\n\t\t\t}\n\n\t\t\tif (totalWidth > this.offsetWidth) {\n\t\t\t\thiddenItems = this._itemsCount - index;\n\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\n\t\t// hide the items that did not fit the container size\n\t\tthis._setHiddenItems(hiddenItems);\n\t}\n\n\t_getNextBackgroundColor() {\n\t\t// counter is to automatically assign background colors to avatars, `Accent10` is the highest color value\n\t\tif (++this._colorIndex > 10) {\n\t\t\tthis._colorIndex = 1;\n\t\t}\n\t\treturn this._colorIndex;\n\t}\n\n\t_setHiddenItems(hiddenItems: number) {\n\t\tconst shouldFireEvent = this._hiddenItems !== hiddenItems;\n\n\t\tthis._hiddenItems = hiddenItems;\n\n\t\tthis.items.forEach((item, index) => {\n\t\t\titem.hidden = index >= this._hiddenStartIndex;\n\t\t});\n\n\t\tthis._overflowButtonText = `+${hiddenItems > 99 ? 99 : hiddenItems}`;\n\n\t\tif (shouldFireEvent) {\n\t\t\tthis.fireEvent(\"overflow\");\n\t\t}\n\t}\n\n\t_getAriaHasPopup() {\n\t\tif (this.ariaHaspopup === \"\") {\n\t\t\treturn;\n\t\t}\n\n\t\treturn this.ariaHaspopup;\n\t}\n}\n\nAvatarGroup.define();\n\nexport default AvatarGroup;\nexport type {\n\tAvatarGroupClickEventDetail,\n};\n"]}
+{"version":3,"file":"AvatarGroup.js","sourceRoot":"","sources":["../src/AvatarGroup.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,UAAU,MAAM,4CAA4C,CAAC;AACpE,OAAO,SAAS,MAAM,sDAAsD,CAAC;AAC7E,OAAO,aAAa,MAAM,wDAAwD,CAAC;AACnF,OAAO,cAAc,MAAM,yDAAyD,CAAC;AAErF,OAAO,EAAE,aAAa,EAAE,MAAM,4CAA4C,CAAC;AAE3E,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,IAAI,MAAM,iDAAiD,CAAC;AACnE,OAAO,KAAK,MAAM,kDAAkD,CAAC;AAErE,OAAO,EACN,OAAO,EACP,OAAO,GACP,MAAM,sCAAsC,CAAC;AAC9C,OAAO,MAAM,MAAM,aAAa,CAAC;AACjC,OAAO,UAAU,MAAM,uBAAuB,CAAC;AAC/C,OAAO,eAAe,MAAM,4BAA4B,CAAC;AACzD,OAAO,iBAAiB,MAAM,8BAA8B,CAAC;AAG7D,OAAO,EACN,mCAAmC,EACnC,qCAAqC,EACrC,kCAAkC,EAClC,6BAA6B,EAC7B,iBAAiB,GACjB,MAAM,mCAAmC,CAAC;AAE3C,SAAS;AACT,OAAO,cAAc,MAAM,uCAAuC,CAAC;AAEnE,WAAW;AACX,OAAO,mBAAmB,MAAM,kDAAkD,CAAC;AAcnF,MAAM,kBAAkB,GAAG,+BAA+B,CAAC;AAC3D,MAAM,kCAAkC,GAAG,IAAI,kBAAkB,EAAE,CAAC;AAEpE,2DAA2D;AAC3D,MAAM,OAAO,GAAG;IACf,CAAC,UAAU,CAAC,EAAE,CAAC,EAAE;QAChB,CAAC,eAAe,CAAC,UAAU,CAAC,EAAE,WAAW;QACzC,CAAC,eAAe,CAAC,KAAK,CAAC,EAAE,UAAU;KACnC;IACD,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE;QACf,CAAC,eAAe,CAAC,UAAU,CAAC,EAAE,UAAU;QACxC,CAAC,eAAe,CAAC,KAAK,CAAC,EAAE,UAAU;KACnC;IACD,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE;QACf,CAAC,eAAe,CAAC,UAAU,CAAC,EAAE,UAAU;QACxC,CAAC,eAAe,CAAC,KAAK,CAAC,EAAE,WAAW;KACpC;IACD,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE;QACf,CAAC,eAAe,CAAC,UAAU,CAAC,EAAE,UAAU;QACxC,CAAC,eAAe,CAAC,KAAK,CAAC,EAAE,QAAQ;KACjC;IACD,CAAC,UAAU,CAAC,EAAE,CAAC,EAAE;QAChB,CAAC,eAAe,CAAC,UAAU,CAAC,EAAE,SAAS;QACvC,CAAC,eAAe,CAAC,KAAK,CAAC,EAAE,UAAU;KACnC;CACD,CAAC;AAOF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsEG;AAqCH,IAAM,WAAW,mBAAjB,MAAM,WAAY,SAAQ,UAAU;IA2DnC;QACC,KAAK,EAAE,CAAC;QAER,IAAI,CAAC,eAAe,GAAG,IAAI,cAAc,CAAC,IAAI,EAAE;YAC/C,gBAAgB,EAAE,GAAG,EAAE;gBACtB,OAAO,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC;YACzE,CAAC;SACD,CAAC,CAAC;QACH,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC;QACrB,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC;QACtB,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACnD,CAAC;IAED,MAAM,CAAC,KAAK,CAAC,QAAQ;QACpB,aAAW,CAAC,UAAU,GAAG,MAAM,aAAa,CAAC,oBAAoB,CAAC,CAAC;IACpE,CAAC;IAED;;;;OAIG;IACH,IAAI,WAAW;QACd,OAAO,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;IACjD,CAAC;IAED;;;;OAIG;IACH,IAAI,WAAW;QACd,OAAO,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,wBAAwB,CAAC,CAAC;IAClE,CAAC;IAED,IAAI,qBAAqB;QACxB,OAAO,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IACxE,CAAC;IAED,IAAI,cAAc;QACjB,MAAM,gBAAgB,GAAG,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC;QACjD,MAAM,YAAY,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,6BAA6B,CAAC,CAAC,CAAC,kCAAkC,CAAC;QAExG,oBAAoB;QACpB,IAAI,IAAI,GAAG,aAAW,CAAC,UAAU,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC;QAExD,qCAAqC;QACrC,IAAI,IAAI,IAAI,aAAW,CAAC,UAAU,CAAC,OAAO,CAAC,mCAAmC,EAAE,IAAI,CAAC,WAAW,GAAG,gBAAgB,EAAE,gBAAgB,CAAC,EAAE,CAAC;QAEzI,IAAI,IAAI,CAAC,QAAQ,EAAE;YAClB,+EAA+E;YAC/E,IAAI,IAAI,IAAI,aAAW,CAAC,UAAU,CAAC,OAAO,CAAC,qCAAqC,CAAC,EAAE,CAAC;SACpF;aAAM;YACN,mEAAmE;YACnE,IAAI,IAAI,IAAI,aAAW,CAAC,UAAU,CAAC,OAAO,CAAC,iBAAiB,CAAC,EAAE,CAAC;SAChE;QAED,OAAO,IAAI,CAAC;IACb,CAAC;IAED,IAAI,4BAA4B;QAC/B,OAAO,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,aAAW,CAAC,UAAU,CAAC,OAAO,CAAC,qCAAqC,CAAC,CAAC;IAC1G,CAAC;IAED,IAAI,sBAAsB;QACzB,OAAO,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,gBAAgB,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC;IAC5D,CAAC;IAED,IAAI,4BAA4B;QAC/B,OAAO;YACN,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,gBAAgB,EAAE;SAC7D,CAAC;IACH,CAAC;IAED,IAAI,KAAK;QACR,OAAO,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC;IAC3C,CAAC;IAED,IAAI,iBAAiB;QACpB,OAAO,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,YAAY,CAAC;IAC7C,CAAC;IAED,IAAI,kBAAkB;QACrB,OAAO,IAAI,CAAC,YAAY,KAAK,CAAC,CAAC;IAChC,CAAC;IAED,IAAI,QAAQ;QACX,OAAO,IAAI,CAAC,IAAI,KAAK,eAAe,CAAC,KAAK,CAAC;IAC5C,CAAC;IAED,IAAI,WAAW;QACd,OAAO,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;IAC1B,CAAC;IAED,IAAI,cAAc;QACjB,OAAO,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC;IACnC,CAAC;IAED,IAAI,eAAe;QAClB,OAAO,IAAI,CAAC,UAAW,CAAC,aAAa,CAAS,kCAAkC,CAAC,CAAC;IACnF,CAAC;IAED;;;;;;;OAOG;IACH,IAAI,6BAA6B;QAChC,MAAM,MAAM,GAAG,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,IAAI,CAAC,eAAe,CAAC;QAC9F,kFAAkF;QAElF,IAAI,CAAC,MAAM,EAAE;YACZ,OAAO,CAAC,CAAC;SACT;QAED,IAAI,IAAI,CAAC,QAAQ,EAAE;YAClB,IAAI,IAAI,GAAgB,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;YACtC,MAAM,iBAAiB,GAAG,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC;YAE5D,2FAA2F;YAC3F,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,MAAM,EAAE;gBACzB,IAAI,GAAG,MAAM,CAAC;aACd;YAED,OAAO,IAAI,CAAC,YAAY,KAAK,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,iBAAiB,CAAC;SACpF;QAED,OAAO,MAAM,CAAC,WAAW,CAAC;IAC3B,CAAC;IAED,IAAI,eAAe;QAClB,OAAO,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;IAC3B,CAAC;IAED,IAAI,OAAO;QACV,OAAO;YACN,cAAc,EAAE;gBACf,+BAA+B,EAAE,IAAI;gBACrC,kCAAkC,EAAE,IAAI,CAAC,eAAe,KAAK,UAAU,CAAC,EAAE;gBAC1E,iCAAiC,EAAE,IAAI,CAAC,eAAe,KAAK,UAAU,CAAC,CAAC;gBACxE,iCAAiC,EAAE,IAAI,CAAC,eAAe,KAAK,UAAU,CAAC,CAAC;gBACxE,iCAAiC,EAAE,IAAI,CAAC,eAAe,KAAK,UAAU,CAAC,CAAC;gBACxE,kCAAkC,EAAE,IAAI,CAAC,eAAe,KAAK,UAAU,CAAC,EAAE;aAC1E;SACD,CAAC;IACH,CAAC;IAED,gBAAgB;QACf,IAAI,CAAC,cAAc,EAAE,CAAC;IACvB,CAAC;IAED,iBAAiB;QAChB,IAAI,IAAI,CAAC,qBAAqB,EAAE;YAC/B,IAAI,CAAC,qBAAqB,CAAC,cAAc,GAAG,IAAI,CAAC,QAAQ,CAAC;SAC1D;QAED,IAAI,CAAC,eAAe,EAAE,CAAC;IACxB,CAAC;IAED,UAAU;QACT,aAAa,CAAC,QAAQ,CAAC,IAAI,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;IACrD,CAAC;IAED,SAAS;QACR,aAAa,CAAC,UAAU,CAAC,IAAI,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;IACvD,CAAC;IAED,SAAS;QACR,IAAI,CAAC,cAAc,EAAE,CAAC;IACvB,CAAC;IAED,UAAU,CAAC,CAAgB;QAC1B,+DAA+D;QAC/D,yDAAyD;QACzD,0EAA0E;QAC1E,IAAI,IAAI,CAAC,QAAQ,EAAE;YAClB,IAAI,OAAO,CAAC,CAAC,CAAC,EAAE;gBACf,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,MAAqB,CAAC,CAAC;aAC9C;iBAAM,IAAI,OAAO,CAAC,CAAC,CAAC,EAAE;gBACtB,oBAAoB;gBACpB,CAAC,CAAC,cAAc,EAAE,CAAC;aACnB;SACD;IACF,CAAC;IAED,QAAQ,CAAC,CAAgB;QACxB,IAAI,CAAC,CAAC,CAAC,QAAQ,IAAI,OAAO,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,QAAQ,EAAE;YAC/C,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,MAAqB,CAAC,CAAC;YAC9C,CAAC,CAAC,cAAc,EAAE,CAAC;SACnB;IACF,CAAC;IAED,eAAe,CAAC,SAAsB;QACrC,MAAM,uBAAuB,GAAG,SAAS,CAAC,SAAS,CAAC,QAAQ,CAAC,kBAAkB,CAAC,IAAI,SAAS,KAAK,IAAI,CAAC,qBAAqB,CAAC;QAE7H,IAAI,CAAC,SAAS,CAA8B,OAAO,EAAE;YACpD,SAAS;YACT,qBAAqB,EAAE,uBAAuB;SAC9C,CAAC,CAAC;IACJ,CAAC;IAED,QAAQ,CAAC,CAAa;QACrB,MAAM,MAAM,GAAG,CAAC,CAAC,MAAqB,CAAC;QACvC,mHAAmH;QACnH,MAAM,QAAQ,GAAG,MAAM,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC;QACnD,CAAC,CAAC,eAAe,EAAE,CAAC;QAEpB,IAAI,IAAI,CAAC,QAAQ,IAAI,QAAQ,EAAE;YAC9B,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;SAC7B;IACF,CAAC;IAED,WAAW,CAAC,CAAa;QACxB,MAAM,MAAM,GAAG,CAAC,CAAC,MAAqB,CAAC;QACvC,iEAAiE;QACjE,MAAM,QAAQ,GAAG,MAAM,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC;QACnD,CAAC,CAAC,eAAe,EAAE,CAAC;QAEpB,IAAI,QAAQ,EAAE;YACb,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;SAC7B;IACF,CAAC;IAED;;;;OAIG;IACH,eAAe;QACd,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC;QAErB,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;YACpC,MAAM,UAAU,GAAG,IAAI,CAAC,uBAAuB,EAAE,CAAC;YAClD,MAAM,CAAC,WAAW,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;YAEpC,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,eAAe,CAAC,EAAE;gBAC1C,gDAAgD;gBAChD,MAAM,CAAC,YAAY,CAAC,eAAe,EAAE,iBAAiB,CAAC,SAAS,UAAU,EAAoC,CAAC,CAAC,CAAC;aACjH;YAED,0GAA0G;YAC1G,IAAI,KAAK,KAAK,IAAI,CAAC,WAAW,GAAG,CAAC,IAAI,IAAI,CAAC,qBAAqB,EAAE;gBACjE,8EAA8E;gBAC9E,MAAM,CAAC,KAAK,CAAC,eAAe,GAAG,OAAO,CAAC,MAAM,CAAC,aAAa,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;aACxE;QACF,CAAC,CAAC,CAAC;IACJ,CAAC;IAED,UAAU,CAAC,CAAa;QACvB,IAAI,CAAC,eAAe,CAAC,cAAc,CAAC,CAAC,CAAC,MAA0B,CAAC,CAAC;IACnE,CAAC;IAED;;;;;OAKG;IACH,eAAe,CAAC,IAAiB;QAChC,MAAM,KAAK,GAAG,IAAI,CAAC,YAAY,KAAK,KAAK,CAAC;QAC1C,MAAM,cAAc,GAAG,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC;QAEzD,IAAI,KAAK,EAAE;YACV,MAAM,gBAAgB,GAAG,IAAI,CAAC,YAA2B,CAAC;YAE1D,kFAAkF;YAClF,gEAAgE;YAEhE,IAAI,CAAC,gBAAgB,EAAE;gBACtB,OAAO,CAAC,CAAC;aACT;YAED,OAAO,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,WAAW,CAAC;SACzE;QAED,OAAO,cAAc,CAAC;IACvB,CAAC;IAED;;;OAGG;IACH,cAAc;QACb,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;YAC1B,8BAA8B;YAC9B,OAAO;SACP;QAED,IAAI,WAAW,GAAG,CAAC,CAAC;QAEpB,KAAK,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC,WAAW,EAAE,KAAK,EAAE,EAAE;YACtD,MAAM,IAAI,GAAqB,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;YAEjD,+DAA+D;YAC/D,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;YAEpB,wDAAwD;YACxD,8EAA8E;YAC9E,IAAI,UAAU,GAAG,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,WAAW,CAAC;YAE/D,IAAI,KAAK,KAAK,IAAI,CAAC,WAAW,GAAG,CAAC,IAAI,IAAI,CAAC,qBAAqB,EAAE;gBACjE,UAAU,IAAI,IAAI,CAAC,6BAA6B,CAAC;aACjD;YAED,IAAI,UAAU,GAAG,IAAI,CAAC,WAAW,EAAE;gBAClC,WAAW,GAAG,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;gBACvC,MAAM;aACN;SACD;QAED,qDAAqD;QACrD,IAAI,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;IACnC,CAAC;IAED,uBAAuB;QACtB,yGAAyG;QACzG,IAAI,EAAE,IAAI,CAAC,WAAW,GAAG,EAAE,EAAE;YAC5B,IAAI,CAAC,WAAW,GAAG,CAAC,CAAC;SACrB;QACD,OAAO,IAAI,CAAC,WAAW,CAAC;IACzB,CAAC;IAED,eAAe,CAAC,WAAmB;QAClC,MAAM,eAAe,GAAG,IAAI,CAAC,YAAY,KAAK,WAAW,CAAC;QAE1D,IAAI,CAAC,YAAY,GAAG,WAAW,CAAC;QAEhC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;YAClC,IAAI,CAAC,MAAM,GAAG,KAAK,IAAI,IAAI,CAAC,iBAAiB,CAAC;QAC/C,CAAC,CAAC,CAAC;QAEH,IAAI,CAAC,mBAAmB,GAAG,IAAI,WAAW,GAAG,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;QAErE,IAAI,eAAe,EAAE;YACpB,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;SAC3B;IACF,CAAC;IAED,gBAAgB;QACf,IAAI,IAAI,CAAC,YAAY,KAAK,EAAE,EAAE;YAC7B,OAAO;SACP;QAED,OAAO,IAAI,CAAC,YAAY,CAAC;IAC1B,CAAC;CACD,CAAA;AA/YA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,eAAe,EAAE,YAAY,EAAE,eAAe,CAAC,KAAK,EAAE,CAAC;yCAC7C;AAc5B;IADC,QAAQ,EAAE;iDACW;AAMtB;IADC,QAAQ,CAAC,EAAE,WAAW,EAAE,IAAI,EAAE,CAAC;wDACH;AAW7B;IADC,IAAI,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;0CACb;AAYhC;IADC,IAAI,EAAE;mDACyB;AAnD3B,WAAW;IAnChB,aAAa,CAAC;QACd,GAAG,EAAE,kBAAkB;QACvB,QAAQ,EAAE,SAAS;QACnB,QAAQ,EAAE,mBAAmB;QAC7B,MAAM,EAAE,cAAc;QACtB,YAAY,EAAE,CAAC,MAAM,CAAC;KACtB,CAAC;IACF;;;;;;;MAOE;;IACD,KAAK,CAA8B,OAAO,EAAE;QAC5C,MAAM,EAAE;YACP;;cAEE;YACF,SAAS,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE;YAChC;;cAEE;YACF,qBAAqB,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE;SACxC;KACD,CAAC;IAEF;;;;;MAKE;;IACD,KAAK,CAAC,UAAU,CAAC;GACZ,WAAW,CAuZhB;AAED,WAAW,CAAC,MAAM,EAAE,CAAC;AAErB,eAAe,WAAW,CAAC","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport ItemNavigation from \"@ui5/webcomponents-base/dist/delegate/ItemNavigation.js\";\nimport type { ITabbable } from \"@ui5/webcomponents-base/dist/delegate/ItemNavigation.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event.js\";\n\nimport {\n\tisEnter,\n\tisSpace,\n} from \"@ui5/webcomponents-base/dist/Keys.js\";\nimport Button from \"./Button.js\";\nimport AvatarSize from \"./types/AvatarSize.js\";\nimport AvatarGroupType from \"./types/AvatarGroupType.js\";\nimport AvatarColorScheme from \"./types/AvatarColorScheme.js\";\nimport type { IButton } from \"./Button.js\";\n\nimport {\n\tAVATAR_GROUP_DISPLAYED_HIDDEN_LABEL,\n\tAVATAR_GROUP_SHOW_COMPLETE_LIST_LABEL,\n\tAVATAR_GROUP_ARIA_LABEL_INDIVIDUAL,\n\tAVATAR_GROUP_ARIA_LABEL_GROUP,\n\tAVATAR_GROUP_MOVE,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// Styles\nimport AvatarGroupCss from \"./generated/themes/AvatarGroup.css.js\";\n\n// Template\nimport AvatarGroupTemplate from \"./generated/templates/AvatarGroupTemplate.lit.js\";\n\n/**\n * Interface for components that represent an avatar and may be slotted in numerous higher-order components such as <code>ui5-avatar-group</code>\n *\n * @public\n */\ninterface IAvatarGroupItem extends HTMLElement, ITabbable {\n\tеffectiveBackgroundColor: AvatarColorScheme;\n\tsize: `${AvatarSize}`;\n\teffectiveSize: AvatarSize;\n\tinteractive: boolean;\n}\n\nconst OVERFLOW_BTN_CLASS = \"ui5-avatar-group-overflow-btn\";\nconst AVATAR_GROUP_OVERFLOW_BTN_SELECTOR = `.${OVERFLOW_BTN_CLASS}`;\n\n// based on RTL/LTR a margin-left/right is set respectfully\nconst offsets = {\n\t[AvatarSize.XS]: {\n\t\t[AvatarGroupType.Individual]: \"0.0625rem\",\n\t\t[AvatarGroupType.Group]: \"-0.75rem\",\n\t},\n\t[AvatarSize.S]: {\n\t\t[AvatarGroupType.Individual]: \"0.125rem\",\n\t\t[AvatarGroupType.Group]: \"-1.25rem\",\n\t},\n\t[AvatarSize.M]: {\n\t\t[AvatarGroupType.Individual]: \"0.125rem\",\n\t\t[AvatarGroupType.Group]: \"-1.625rem\",\n\t},\n\t[AvatarSize.L]: {\n\t\t[AvatarGroupType.Individual]: \"0.125rem\",\n\t\t[AvatarGroupType.Group]: \" -2rem\",\n\t},\n\t[AvatarSize.XL]: {\n\t\t[AvatarGroupType.Individual]: \"0.25rem\",\n\t\t[AvatarGroupType.Group]: \"-2.75rem\",\n\t},\n};\n\ntype AvatarGroupClickEventDetail = {\n\ttargetRef: HTMLElement,\n\toverflowButtonClicked: boolean,\n};\n\n/**\n * @class\n *\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n * Displays a group of avatars arranged horizontally. It is useful to visually\n * showcase a group of related avatars, such as, project team members or employees.\n *\n * The component allows you to display the avatars in different sizes,\n * depending on your use case.\n *\n * The <code>AvatarGroup</code> component has two group types:\n * <ul>\n * <li><code>Group</code> type: The avatars are displayed as partially overlapped on\n * top of each other and the entire group has one click/tap area.</li>\n * <li><code>Individual</code> type: The avatars are displayed side-by-side and each\n * avatar has its own click/tap area.</li>\n * </ul>\n *\n * <h3>Responsive Behavior</h3>\n *\n * When the available space is less than the width required to display all avatars,\n * an overflow visualization appears as a button placed at the end with the same shape\n * and size as the avatars. The visualization displays the number of avatars that have overflowed\n * and are not currently visible.\n *\n * <h3>Usage</h3>\n *\n * Use the <code>AvatarGroup</code> if:\n * <ul>\n * <li>You want to display a group of avatars.</li>\n * <li>You want to display several avatars which have something in common.</li>\n * </ul>\n *\n * Do not use the <code>AvatarGroup</code> if:\n * <ul>\n * <li>You want to display a single avatar.</li>\n * <li>You want to display a gallery for simple images.</li>\n * <li>You want to use it for other visual content than avatars.</li>\n * </ul>\n *\n * <h3>Keyboard Handling</h3>\n * The component provides advanced keyboard handling.\n * When focused, the user can use the following keyboard\n * shortcuts in order to perform a navigation:\n *\n * <br>\n * <code>type</code> Individual:\n * <br>\n * <ul>\n * <li>[TAB] - Move focus to the overflow button</li>\n * <li>[LEFT] - Navigate one avatar to the left</li>\n * <li>[RIGHT] - Navigate one avatar to the right</li>\n * <li>[HOME] - Navigate to the first avatar</li>\n * <li>[END] - Navigate to the last avatar</li>\n * <li>[SPACE],[ENTER],[RETURN] - Trigger <code>ui5-click</code> event</li>\n * </ul>\n * <br>\n * <code>type</code> Group:\n * <br>\n * <ul>\n * <li>[TAB] - Move focus to the next interactive element after the component</li>\n * <li>[SPACE],[ENTER],[RETURN] - Trigger <code>ui5-click</code> event</li>\n * </ul>\n * <br>\n *\n * @constructor\n * @extends UI5Element\n * @since 1.0.0-rc.11\n * @public\n */\n\n@customElement({\n\ttag: \"ui5-avatar-group\",\n\trenderer: litRender,\n\ttemplate: AvatarGroupTemplate,\n\tstyles: AvatarGroupCss,\n\tdependencies: [Button],\n})\n/**\n* Fired when the component is activated either with a\n* click/tap or by using the Enter or Space key.\n* @param {HTMLElement} targetRef The DOM ref of the clicked item.\n* @param {boolean} overflowButtonClicked indicates if the overflow button is clicked\n* @public\n* @since 1.0.0-rc.11\n*/\n@event<AvatarGroupClickEventDetail>(\"click\", {\n\tdetail: {\n\t\t/**\n\t\t* @public\n\t\t*/\n\t\ttargetRef: { type: HTMLElement },\n\t\t/**\n\t\t* @public\n\t\t*/\n\t\toverflowButtonClicked: { type: Boolean },\n\t},\n})\n\n/**\n* Fired when the count of visible <code>ui5-avatar</code> elements in the\n* component has changed\n* @public\n* @since 1.0.0-rc.13\n*/\n@event(\"overflow\")\nclass AvatarGroup extends UI5Element {\n\t/**\n\t * Defines the mode of the <code>AvatarGroup</code>.\n\t *\n\t * @default \"Group\"\n\t * @public\n\t */\n\t@property({ type: AvatarGroupType, defaultValue: AvatarGroupType.Group })\n\ttype!: `${AvatarGroupType}`;\n\n\t/**\n\t * Defines the aria-haspopup value of the component on:\n\t * <br><br>\n\t * <ul>\n\t * <li> the whole container when <code>type</code> property is <code>Group</code></li>\n\t * <li> the default \"More\" overflow button when <code>type</code> is <code>Individual</code></li>\n\t * </ul>\n\t * <br><br>\n\t * @since 1.0.0-rc.15\n\t * @protected\n\t */\n\t@property()\n\tariaHaspopup!: string;\n\n\t/**\n\t * @private\n\t */\n\t@property({ noAttribute: true })\n\t_overflowButtonText!: string;\n\n\t/**\n\t * Defines the items of the component. Use the <code>ui5-avatar</code> component as an item.\n\t * <br><br>\n\t * <b>Note:</b> The UX guidelines recommends using avatars with \"Circle\" shape.\n\t * Moreover, if you use avatars with \"Square\" shape, there will be visual inconsistency\n\t * as the built-in overflow action has \"Circle\" shape.\n\t * @public\n\t */\n\t@slot({ type: HTMLElement, \"default\": true })\n\titems!: Array<IAvatarGroupItem>;\n\n\t/**\n\t * Defines the overflow button of the component.\n\t * <b>Note:</b> We recommend using the <code>ui5-button</code> component.\n\t * <br><br>\n\t * <b>Note:</b> If this slot is not used, the component will\n\t * display the built-in overflow button.\n\t * @public\n\t * @since 1.0.0-rc.13\n\t */\n\t@slot()\n\toverflowButton!: Array<IButton>;\n\n\tstatic i18nBundle: I18nBundle;\n\t_onResizeHandler: () => void;\n\t_colorIndex: number;\n\t_hiddenItems: number;\n\t_itemNavigation: ItemNavigation;\n\n\tconstructor() {\n\t\tsuper();\n\n\t\tthis._itemNavigation = new ItemNavigation(this, {\n\t\t\tgetItemsCallback: () => {\n\t\t\t\treturn this._isGroup ? [] : this.items.slice(0, this._hiddenStartIndex);\n\t\t\t},\n\t\t});\n\t\tthis._colorIndex = 0;\n\t\tthis._hiddenItems = 0;\n\t\tthis._onResizeHandler = this._onResize.bind(this);\n\t}\n\n\tstatic async onDefine() {\n\t\tAvatarGroup.i18nBundle = await getI18nBundle(\"@ui5/webcomponents\");\n\t}\n\n\t/**\n\t * Returns an array containing the <code>ui5-avatar</code> instances that are currently not displayed due to lack of space.\n\t * @default []\n\t * @public\n\t */\n\tget hiddenItems(): IAvatarGroupItem[] {\n\t\treturn this.items.slice(this._hiddenStartIndex);\n\t}\n\n\t/**\n\t * Returns an array containing the <code>AvatarColorScheme</code> values that correspond to the avatars in the component.\n\t * @default []\n\t * @public\n\t */\n\tget colorScheme(): AvatarColorScheme[] {\n\t\treturn this.items.map(avatar => avatar.еffectiveBackgroundColor);\n\t}\n\n\tget _customOverflowButton() {\n\t\treturn this.overflowButton.length ? this.overflowButton[0] : undefined;\n\t}\n\n\tget _ariaLabelText() {\n\t\tconst hiddenItemsCount = this.hiddenItems.length;\n\t\tconst typeLabelKey = this._isGroup ? AVATAR_GROUP_ARIA_LABEL_GROUP : AVATAR_GROUP_ARIA_LABEL_INDIVIDUAL;\n\n\t\t// avatar type label\n\t\tlet text = AvatarGroup.i18nBundle.getText(typeLabelKey);\n\n\t\t// add displayed-hidden avatars label\n\t\ttext += ` ${AvatarGroup.i18nBundle.getText(AVATAR_GROUP_DISPLAYED_HIDDEN_LABEL, this._itemsCount - hiddenItemsCount, hiddenItemsCount)}`;\n\n\t\tif (this._isGroup) {\n\t\t\t// the container role is \"button\", add the message for complete list activation\n\t\t\ttext += ` ${AvatarGroup.i18nBundle.getText(AVATAR_GROUP_SHOW_COMPLETE_LIST_LABEL)}`;\n\t\t} else {\n\t\t\t// the container role is \"group\", add the \"how to navigate\" message\n\t\t\ttext += ` ${AvatarGroup.i18nBundle.getText(AVATAR_GROUP_MOVE)}`;\n\t\t}\n\n\t\treturn text;\n\t}\n\n\tget _overflowButtonAriaLabelText() {\n\t\treturn this._isGroup ? undefined : AvatarGroup.i18nBundle.getText(AVATAR_GROUP_SHOW_COMPLETE_LIST_LABEL);\n\t}\n\n\tget _containerAriaHasPopup() {\n\t\treturn this._isGroup ? this._getAriaHasPopup() : undefined;\n\t}\n\n\tget _overflowButtonAccAttributes() {\n\t\treturn {\n\t\t\thasPopup: this._isGroup ? undefined : this._getAriaHasPopup(),\n\t\t};\n\t}\n\n\tget _role() {\n\t\treturn this._isGroup ? \"button\" : \"group\";\n\t}\n\n\tget _hiddenStartIndex() {\n\t\treturn this._itemsCount - this._hiddenItems;\n\t}\n\n\tget _overflowBtnHidden() {\n\t\treturn this._hiddenItems === 0;\n\t}\n\n\tget _isGroup() {\n\t\treturn this.type === AvatarGroupType.Group;\n\t}\n\n\tget _itemsCount() {\n\t\treturn this.items.length;\n\t}\n\n\tget _groupTabIndex() {\n\t\treturn this._isGroup ? \"0\" : \"-1\";\n\t}\n\n\tget _overflowButton() {\n\t\treturn this.shadowRoot!.querySelector<Button>(AVATAR_GROUP_OVERFLOW_BTN_SELECTOR);\n\t}\n\n\t/**\n\t * Return the effective overflow button width\n\t * Differences are that when in \"Group\" type the button is offset and overlaps the avatars\n\t *\n\t * 1) In case of \"Group\", (LTR/RTL aware) button width is qual to second item offset left/right\n\t * 2) In case of \"Individual\" group type width is directly taken from button element\n\t * @private\n\t */\n\tget _overflowButtonEffectiveWidth() {\n\t\tconst button = this._customOverflowButton ? this._customOverflowButton : this._overflowButton;\n\t\t// if in \"Group\" mode overflow button size is equal to the offset from second item\n\n\t\tif (!button) {\n\t\t\treturn 0;\n\t\t}\n\n\t\tif (this._isGroup) {\n\t\t\tlet item: HTMLElement = this.items[1];\n\t\t\tconst ltrEffectiveWidth = item.offsetLeft - this.offsetLeft;\n\n\t\t\t// in some cases when second avatar is overflowed the offset of the button is the right one\n\t\t\tif (!item || item.hidden) {\n\t\t\t\titem = button;\n\t\t\t}\n\n\t\t\treturn this.effectiveDir === \"rtl\" ? this._getWidthToItem(item) : ltrEffectiveWidth;\n\t\t}\n\n\t\treturn button.offsetWidth;\n\t}\n\n\tget firstAvatarSize() {\n\t\treturn this.items[0].size;\n\t}\n\n\tget classes() {\n\t\treturn {\n\t\t\toverflowButton: {\n\t\t\t\t\"ui5-avatar-group-overflow-btn\": true,\n\t\t\t\t\"ui5-avatar-group-overflow-btn-xs\": this.firstAvatarSize === AvatarSize.XS,\n\t\t\t\t\"ui5-avatar-group-overflow-btn-s\": this.firstAvatarSize === AvatarSize.S,\n\t\t\t\t\"ui5-avatar-group-overflow-btn-m\": this.firstAvatarSize === AvatarSize.M,\n\t\t\t\t\"ui5-avatar-group-overflow-btn-l\": this.firstAvatarSize === AvatarSize.L,\n\t\t\t\t\"ui5-avatar-group-overflow-btn-xl\": this.firstAvatarSize === AvatarSize.XL,\n\t\t\t},\n\t\t};\n\t}\n\n\tonAfterRendering() {\n\t\tthis._overflowItems();\n\t}\n\n\tonBeforeRendering() {\n\t\tif (this._customOverflowButton) {\n\t\t\tthis._customOverflowButton.nonInteractive = this._isGroup;\n\t\t}\n\n\t\tthis._prepareAvatars();\n\t}\n\n\tonEnterDOM() {\n\t\tResizeHandler.register(this, this._onResizeHandler);\n\t}\n\n\tonExitDOM() {\n\t\tResizeHandler.deregister(this, this._onResizeHandler);\n\t}\n\n\t_onResize() {\n\t\tthis._overflowItems();\n\t}\n\n\t_onkeydown(e: KeyboardEvent) {\n\t\t// when type is \"Individual\" the ui5-avatar and ui5-button both\n\t\t// fire \"click\" event when SPACE or ENTER are pressed and\n\t\t// AvatarGroup \"click\" is fired in their handlers (_onClick, _onUI5Click).\n\t\tif (this._isGroup) {\n\t\t\tif (isEnter(e)) {\n\t\t\t\tthis._fireGroupEvent(e.target as HTMLElement);\n\t\t\t} else if (isSpace(e)) {\n\t\t\t\t// prevent scrolling\n\t\t\t\te.preventDefault();\n\t\t\t}\n\t\t}\n\t}\n\n\t_onkeyup(e: KeyboardEvent) {\n\t\tif (!e.shiftKey && isSpace(e) && this._isGroup) {\n\t\t\tthis._fireGroupEvent(e.target as HTMLElement);\n\t\t\te.preventDefault();\n\t\t}\n\t}\n\n\t_fireGroupEvent(targetRef: HTMLElement) {\n\t\tconst isOverflowButtonClicked = targetRef.classList.contains(OVERFLOW_BTN_CLASS) || targetRef === this._customOverflowButton;\n\n\t\tthis.fireEvent<AvatarGroupClickEventDetail>(\"click\", {\n\t\t\ttargetRef,\n\t\t\toverflowButtonClicked: isOverflowButtonClicked,\n\t\t});\n\t}\n\n\t_onClick(e: MouseEvent) {\n\t\tconst target = e.target as HTMLElement;\n\t\t// no matter the value of noConflict, the ui5-button and the group container (div) always fire a native click event\n\t\tconst isButton = target.hasAttribute(\"ui5-button\");\n\t\te.stopPropagation();\n\n\t\tif (this._isGroup || isButton) {\n\t\t\tthis._fireGroupEvent(target);\n\t\t}\n\t}\n\n\t_onUI5Click(e: MouseEvent) {\n\t\tconst target = e.target as HTMLElement;\n\t\t// when noConflict=true only ui5-avatar will fire ui5-click event\n\t\tconst isAvatar = target.hasAttribute(\"ui5-avatar\");\n\t\te.stopPropagation();\n\n\t\tif (isAvatar) {\n\t\t\tthis._fireGroupEvent(target);\n\t\t}\n\t}\n\n\t/**\n\t * Modifies avatars to the needs of avatar group properties. Respects already set size and background color.\n\t * Set the margins (offsets) based on RTL/LTR.\n\t * @private\n\t */\n\t_prepareAvatars() {\n\t\tthis._colorIndex = 0;\n\n\t\tthis.items.forEach((avatar, index) => {\n\t\t\tconst colorIndex = this._getNextBackgroundColor();\n\t\t\tavatar.interactive = !this._isGroup;\n\n\t\t\tif (!avatar.getAttribute(\"_color-scheme\")) {\n\t\t\t\t// AvatarGroup respects colors set to ui5-avatar\n\t\t\t\tavatar.setAttribute(\"_color-scheme\", AvatarColorScheme[`Accent${colorIndex}` as keyof typeof AvatarColorScheme]);\n\t\t\t}\n\n\t\t\t// last avatar should not be offset as it breaks the container width and focus styles are no set correctly\n\t\t\tif (index !== this._itemsCount - 1 || this._customOverflowButton) {\n\t\t\t\t// based on RTL the browser automatically sets left or right margin to avatars\n\t\t\t\tavatar.style.marginInlineEnd = offsets[avatar.effectiveSize][this.type];\n\t\t\t}\n\t\t});\n\t}\n\n\t_onfocusin(e: FocusEvent) {\n\t\tthis._itemNavigation.setCurrentItem(e.target as IAvatarGroupItem);\n\t}\n\n\t/**\n\t * Returns the total width to item excluding the item width\n\t * RTL/LTR aware\n\t * @private\n\t * @param item\n\t */\n\t_getWidthToItem(item: HTMLElement) {\n\t\tconst isRTL = this.effectiveDir === \"rtl\";\n\t\tconst ltrWidthToItem = item.offsetLeft - this.offsetLeft;\n\n\t\tif (isRTL) {\n\t\t\tconst itemOffsetParent = item.offsetParent as HTMLElement;\n\n\t\t\t// in RTL the total width is equal to difference of the parent container width and\n\t\t\t// how much is the item offset to the left minus its offsetWidth\n\n\t\t\tif (!itemOffsetParent) {\n\t\t\t\treturn 0;\n\t\t\t}\n\n\t\t\treturn itemOffsetParent.offsetWidth - item.offsetLeft - item.offsetWidth;\n\t\t}\n\n\t\treturn ltrWidthToItem;\n\t}\n\n\t/**\n\t * Overflows items that were not able to fit the container\n\t * @private\n\t */\n\t_overflowItems() {\n\t\tif (this.items.length < 2) {\n\t\t\t// no need to overflow avatars\n\t\t\treturn;\n\t\t}\n\n\t\tlet hiddenItems = 0;\n\n\t\tfor (let index = 0; index < this._itemsCount; index++) {\n\t\t\tconst item: IAvatarGroupItem = this.items[index];\n\n\t\t\t// show item to determine if it will fit the new container size\n\t\t\titem.hidden = false;\n\n\t\t\t// container width to current item + item width (avatar)\n\t\t\t// used to determine whether the following items will fit the container or not\n\t\t\tlet totalWidth = this._getWidthToItem(item) + item.offsetWidth;\n\n\t\t\tif (index !== this._itemsCount - 1 || this._customOverflowButton) {\n\t\t\t\ttotalWidth += this._overflowButtonEffectiveWidth;\n\t\t\t}\n\n\t\t\tif (totalWidth > this.offsetWidth) {\n\t\t\t\thiddenItems = this._itemsCount - index;\n\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\n\t\t// hide the items that did not fit the container size\n\t\tthis._setHiddenItems(hiddenItems);\n\t}\n\n\t_getNextBackgroundColor() {\n\t\t// counter is to automatically assign background colors to avatars, `Accent10` is the highest color value\n\t\tif (++this._colorIndex > 10) {\n\t\t\tthis._colorIndex = 1;\n\t\t}\n\t\treturn this._colorIndex;\n\t}\n\n\t_setHiddenItems(hiddenItems: number) {\n\t\tconst shouldFireEvent = this._hiddenItems !== hiddenItems;\n\n\t\tthis._hiddenItems = hiddenItems;\n\n\t\tthis.items.forEach((item, index) => {\n\t\t\titem.hidden = index >= this._hiddenStartIndex;\n\t\t});\n\n\t\tthis._overflowButtonText = `+${hiddenItems > 99 ? 99 : hiddenItems}`;\n\n\t\tif (shouldFireEvent) {\n\t\t\tthis.fireEvent(\"overflow\");\n\t\t}\n\t}\n\n\t_getAriaHasPopup() {\n\t\tif (this.ariaHaspopup === \"\") {\n\t\t\treturn;\n\t\t}\n\n\t\treturn this.ariaHaspopup;\n\t}\n}\n\nAvatarGroup.define();\n\nexport default AvatarGroup;\nexport type {\n\tAvatarGroupClickEventDetail,\n\tIAvatarGroupItem,\n};\n"]}

package/dist/Badge.d.ts

@@ -1,6 +1,6 @@
 import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
 import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
-import type { IIcon } from "./Interfaces.js";
+import type { IIcon } from "./Icon.js";
 import "@ui5/webcomponents-icons/dist/sys-help-2.js";
 import "@ui5/webcomponents-icons/dist/sys-enter-2.js";
 import "@ui5/webcomponents-icons/dist/error.js";
@@ -114,7 +114,7 @@ declare class Badge extends UI5Element {
     get iconOnly(): boolean;
     get _title(): string | undefined;
     get badgeDescription(): string | undefined;
-    get _semanticIconName(): "error" | "alert" | "sys-enter-2" | "information" | "sys-help-2" | null;
+    get _semanticIconName(): "sys-help-2" | "sys-enter-2" | "error" | "alert" | "information" | null;
     _onclick(): void;
 }
 export default Badge;

package/dist/Badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.js","sourceRoot":"","sources":["../src/Badge.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element 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.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport willShowContent from \"@ui5/webcomponents-base/dist/util/willShowContent.js\";\nimport type { IIcon } from \"./Interfaces.js\";\nimport Icon from \"./Icon.js\";\nimport \"@ui5/webcomponents-icons/dist/sys-help-2.js\";\nimport \"@ui5/webcomponents-icons/dist/sys-enter-2.js\";\nimport \"@ui5/webcomponents-icons/dist/error.js\";\nimport \"@ui5/webcomponents-icons/dist/alert.js\";\nimport \"@ui5/webcomponents-icons/dist/information.js\";\nimport WrappingType from \"./types/WrappingType.js\";\nimport BadgeDesign from \"./types/BadgeDesign.js\";\n// Template\nimport BadgeTemplate from \"./generated/templates/BadgeTemplate.lit.js\";\n\nimport {\n\tBADGE_DESCRIPTION_BADGE,\n\tBADGE_DESCRIPTION_TAG,\n\tBADGE_ROLE_DESCRIPTION,\n\tBADGE_ERROR,\n\tBADGE_WARNING,\n\tBADGE_SUCCESS,\n\tBADGE_INFORMATION,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// Styles\nimport badgeCss from \"./generated/themes/Badge.css.js\";\n\n/**\n * @class\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n * The <code>ui5-badge</code> is a component which serves\n * the purpose to attract the user attention to some piece\n * of information (state, quantity, condition, etc.).\n * It can contain icon and text information, and its design can be chosen from specific design types.\n *\n * <h3>Usage Guidelines</h3>\n * <ul>\n * <li>If the text is longer than the width of the component, it can wrap, or it can show ellipsis, depending on the <code>wrappingType</code> property.</li>\n  * <li>Colors can be semantic or not semantic.</li>\n * </ul>\n *\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@ui5/webcomponents/dist/Badge\";</code>\n *\n * @constructor\n * @extends UI5Element\n * @since 0.12.0\n * @public\n */\n@customElement({\n\ttag: \"ui5-badge\",\n\tlanguageAware: true,\n\trenderer: litRender,\n\ttemplate: BadgeTemplate,\n\tstyles: badgeCss,\n\tdependencies: [\n\t\tIcon,\n\t],\n})\n\n/**\n * Fired when the user clicks on an interactive badge.\n * <b>Note:</b> The event will be fired if the <code>interactive</code> property is <code>true</code>\n * @public\n * @since 1.20\n */\n@event(\"click\")\nclass Badge extends UI5Element {\n\t/**\n\t * Defines the design type of the component.\n\t * @default \"Set3\"\n\t * @public\n\t * @since 1.20\n\t */\n\t@property({ defaultValue: BadgeDesign.Set3 })\n\tdesign!: `${BadgeDesign}`;\n\n\t/**\n\t * Defines the color scheme of the component.\n\t * There are 10 predefined schemes.\n\t * To use one you can set a number from <code>\"1\"</code> to <code>\"10\"</code>. The <code>colorScheme</code> <code>\"1\"</code> will be set by default.\n\t * <br><br>\n\t * <b>Note:</b> Color schemes have no visual representation in High Contrast Black (sap_belize_hcb) theme.\n\t * @default \"1\"\n\t * @public\n\t */\n\t@property({ defaultValue: \"1\" })\n\tcolorScheme!: string;\n\n\t/**\n\t * Defines if the default state icon is shown.\n\t * @default false\n\t * @public\n\t * @since 1.20\n\t */\n\t@property({ type: Boolean })\n\thideStateIcon!: boolean;\n\n\t/**\n\t * Defines if the component is interactive (focusable and pressable).\n\t * <br><b>Note:</b> The badge cannot be <code>interactive</code>\n\t * when <code>design</code> property is <code>BadgeDesign.Set3</code>\n\t * @default false\n\t * @public\n\t * @since 1.20\n\t */\n\t@property({ type: Boolean })\n\tinteractive!: boolean;\n\n\t/**\n\t * Defines how the text of a component will be displayed when there is not enough space.\n\t * <br><b>Note:</b> For option \"Normal\" the text will wrap and the\n\t * words will not be broken based on hyphenation.\n\t *\n\t * @default \"None\"\n\t * @public\n\t * @since 1.20\n\t */\n\t@property({ type: WrappingType, defaultValue: WrappingType.None })\n\twrappingType!: `${WrappingType}`;\n\n\t/**\n\t * Defines if the badge has an icon.\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\t_hasIcon!: boolean;\n\n\t/**\n\t * Defines if the badge has only an icon (and no text).\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\t_iconOnly!: boolean;\n\n\t/**\n\t * Defines if the badge has \"Tag\" design type.\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\t_isTagDesign!: boolean;\n\n\t/**\n\t * Defines the text of the component.\n\t * <br><b>Note:</b> Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.\n\t *\n\t * @public\n\t */\n\t@slot({ type: Node, \"default\": true })\n\ttext!: Array<Node>;\n\n\t/**\n\t * Defines the icon to be displayed in the component.\n\t *\n\t * @public\n\t */\n\t@slot()\n\ticon!: Array<IIcon>;\n\n\tstatic i18nBundle: I18nBundle;\n\n\tstatic async onDefine() {\n\t\tBadge.i18nBundle = await getI18nBundle(\"@ui5/webcomponents\");\n\t}\n\n\tonBeforeRendering() {\n\t\tthis._hasIcon = this.hasIcon || !!this._semanticIconName;\n\t\tthis._iconOnly = this.iconOnly;\n\t\tthis._isTagDesign = this.design !== BadgeDesign.Set3;\n\t}\n\n\tget _roleDescription() {\n\t\treturn Badge.i18nBundle.getText(BADGE_ROLE_DESCRIPTION);\n\t}\n\n\tget _valueState() {\n\t\tswitch (this.design) {\n\t\tcase BadgeDesign.Positive:\n\t\t\treturn Badge.i18nBundle.getText(BADGE_SUCCESS);\n\t\tcase BadgeDesign.Negative:\n\t\t\treturn Badge.i18nBundle.getText(BADGE_ERROR);\n\t\tcase BadgeDesign.Critical:\n\t\t\treturn Badge.i18nBundle.getText(BADGE_WARNING);\n\t\tcase BadgeDesign.Information:\n\t\t\treturn Badge.i18nBundle.getText(BADGE_INFORMATION);\n\t\t}\n\n\t\treturn undefined;\n\t}\n\n\tget hasText() {\n\t\treturn willShowContent(this.text);\n\t}\n\n\tget hasIcon() {\n\t\treturn !!this.icon.length;\n\t}\n\n\tget iconOnly() {\n\t\treturn this.hasIcon && !this.hasText;\n\t}\n\n\tget _title() {\n\t\treturn this.title || undefined;\n\t}\n\n\tget badgeDescription() {\n\t\tif (this.interactive) {\n\t\t\treturn undefined;\n\t\t}\n\n\t\tif (this.design === BadgeDesign.Set3) {\n\t\t\treturn Badge.i18nBundle.getText(BADGE_DESCRIPTION_BADGE);\n\t\t}\n\n\t\tconst valueState = this._valueState;\n\t\tlet description = Badge.i18nBundle.getText(BADGE_DESCRIPTION_TAG);\n\n\t\tif (valueState) {\n\t\t\tdescription = `${description} ${valueState}`;\n\t\t}\n\n\t\treturn description;\n\t}\n\n\tget _semanticIconName() {\n\t\tif (this.hideStateIcon || this.hasIcon) {\n\t\t\treturn null;\n\t\t}\n\n\t\tswitch (this.design) {\n\t\tcase BadgeDesign.Neutral:\n\t\t\treturn \"sys-help-2\";\n\t\tcase BadgeDesign.Positive:\n\t\t\treturn \"sys-enter-2\";\n\t\tcase BadgeDesign.Negative:\n\t\t\treturn \"error\";\n\t\tcase BadgeDesign.Critical:\n\t\t\treturn \"alert\";\n\t\tcase BadgeDesign.Information:\n\t\t\treturn \"information\";\n\t\tdefault:\n\t\t\treturn null;\n\t\t}\n\t}\n\n\t_onclick() {\n\t\tthis.fireEvent(\"click\");\n\t}\n}\n\nBadge.define();\n\nexport default Badge;\n"]}
+{"version":3,"file":"Badge.js","sourceRoot":"","sources":["../src/Badge.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element 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.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot.js\";\nimport litRender from \"@ui5/webcomponents-base/dist/renderer/LitRenderer.js\";\nimport { getI18nBundle } from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport willShowContent from \"@ui5/webcomponents-base/dist/util/willShowContent.js\";\nimport type { IIcon } from \"./Icon.js\";\nimport Icon from \"./Icon.js\";\nimport \"@ui5/webcomponents-icons/dist/sys-help-2.js\";\nimport \"@ui5/webcomponents-icons/dist/sys-enter-2.js\";\nimport \"@ui5/webcomponents-icons/dist/error.js\";\nimport \"@ui5/webcomponents-icons/dist/alert.js\";\nimport \"@ui5/webcomponents-icons/dist/information.js\";\nimport WrappingType from \"./types/WrappingType.js\";\nimport BadgeDesign from \"./types/BadgeDesign.js\";\n// Template\nimport BadgeTemplate from \"./generated/templates/BadgeTemplate.lit.js\";\n\nimport {\n\tBADGE_DESCRIPTION_BADGE,\n\tBADGE_DESCRIPTION_TAG,\n\tBADGE_ROLE_DESCRIPTION,\n\tBADGE_ERROR,\n\tBADGE_WARNING,\n\tBADGE_SUCCESS,\n\tBADGE_INFORMATION,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// Styles\nimport badgeCss from \"./generated/themes/Badge.css.js\";\n\n/**\n * @class\n * <h3 class=\"comment-api-title\">Overview</h3>\n *\n * The <code>ui5-badge</code> is a component which serves\n * the purpose to attract the user attention to some piece\n * of information (state, quantity, condition, etc.).\n * It can contain icon and text information, and its design can be chosen from specific design types.\n *\n * <h3>Usage Guidelines</h3>\n * <ul>\n * <li>If the text is longer than the width of the component, it can wrap, or it can show ellipsis, depending on the <code>wrappingType</code> property.</li>\n  * <li>Colors can be semantic or not semantic.</li>\n * </ul>\n *\n * <h3>ES6 Module Import</h3>\n *\n * <code>import \"@ui5/webcomponents/dist/Badge\";</code>\n *\n * @constructor\n * @extends UI5Element\n * @since 0.12.0\n * @public\n */\n@customElement({\n\ttag: \"ui5-badge\",\n\tlanguageAware: true,\n\trenderer: litRender,\n\ttemplate: BadgeTemplate,\n\tstyles: badgeCss,\n\tdependencies: [\n\t\tIcon,\n\t],\n})\n\n/**\n * Fired when the user clicks on an interactive badge.\n * <b>Note:</b> The event will be fired if the <code>interactive</code> property is <code>true</code>\n * @public\n * @since 1.20\n */\n@event(\"click\")\nclass Badge extends UI5Element {\n\t/**\n\t * Defines the design type of the component.\n\t * @default \"Set3\"\n\t * @public\n\t * @since 1.20\n\t */\n\t@property({ defaultValue: BadgeDesign.Set3 })\n\tdesign!: `${BadgeDesign}`;\n\n\t/**\n\t * Defines the color scheme of the component.\n\t * There are 10 predefined schemes.\n\t * To use one you can set a number from <code>\"1\"</code> to <code>\"10\"</code>. The <code>colorScheme</code> <code>\"1\"</code> will be set by default.\n\t * <br><br>\n\t * <b>Note:</b> Color schemes have no visual representation in High Contrast Black (sap_belize_hcb) theme.\n\t * @default \"1\"\n\t * @public\n\t */\n\t@property({ defaultValue: \"1\" })\n\tcolorScheme!: string;\n\n\t/**\n\t * Defines if the default state icon is shown.\n\t * @default false\n\t * @public\n\t * @since 1.20\n\t */\n\t@property({ type: Boolean })\n\thideStateIcon!: boolean;\n\n\t/**\n\t * Defines if the component is interactive (focusable and pressable).\n\t * <br><b>Note:</b> The badge cannot be <code>interactive</code>\n\t * when <code>design</code> property is <code>BadgeDesign.Set3</code>\n\t * @default false\n\t * @public\n\t * @since 1.20\n\t */\n\t@property({ type: Boolean })\n\tinteractive!: boolean;\n\n\t/**\n\t * Defines how the text of a component will be displayed when there is not enough space.\n\t * <br><b>Note:</b> For option \"Normal\" the text will wrap and the\n\t * words will not be broken based on hyphenation.\n\t *\n\t * @default \"None\"\n\t * @public\n\t * @since 1.20\n\t */\n\t@property({ type: WrappingType, defaultValue: WrappingType.None })\n\twrappingType!: `${WrappingType}`;\n\n\t/**\n\t * Defines if the badge has an icon.\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\t_hasIcon!: boolean;\n\n\t/**\n\t * Defines if the badge has only an icon (and no text).\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\t_iconOnly!: boolean;\n\n\t/**\n\t * Defines if the badge has \"Tag\" design type.\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\t_isTagDesign!: boolean;\n\n\t/**\n\t * Defines the text of the component.\n\t * <br><b>Note:</b> Although this slot accepts HTML Elements, it is strongly recommended that you only use text in order to preserve the intended design.\n\t *\n\t * @public\n\t */\n\t@slot({ type: Node, \"default\": true })\n\ttext!: Array<Node>;\n\n\t/**\n\t * Defines the icon to be displayed in the component.\n\t *\n\t * @public\n\t */\n\t@slot()\n\ticon!: Array<IIcon>;\n\n\tstatic i18nBundle: I18nBundle;\n\n\tstatic async onDefine() {\n\t\tBadge.i18nBundle = await getI18nBundle(\"@ui5/webcomponents\");\n\t}\n\n\tonBeforeRendering() {\n\t\tthis._hasIcon = this.hasIcon || !!this._semanticIconName;\n\t\tthis._iconOnly = this.iconOnly;\n\t\tthis._isTagDesign = this.design !== BadgeDesign.Set3;\n\t}\n\n\tget _roleDescription() {\n\t\treturn Badge.i18nBundle.getText(BADGE_ROLE_DESCRIPTION);\n\t}\n\n\tget _valueState() {\n\t\tswitch (this.design) {\n\t\tcase BadgeDesign.Positive:\n\t\t\treturn Badge.i18nBundle.getText(BADGE_SUCCESS);\n\t\tcase BadgeDesign.Negative:\n\t\t\treturn Badge.i18nBundle.getText(BADGE_ERROR);\n\t\tcase BadgeDesign.Critical:\n\t\t\treturn Badge.i18nBundle.getText(BADGE_WARNING);\n\t\tcase BadgeDesign.Information:\n\t\t\treturn Badge.i18nBundle.getText(BADGE_INFORMATION);\n\t\t}\n\n\t\treturn undefined;\n\t}\n\n\tget hasText() {\n\t\treturn willShowContent(this.text);\n\t}\n\n\tget hasIcon() {\n\t\treturn !!this.icon.length;\n\t}\n\n\tget iconOnly() {\n\t\treturn this.hasIcon && !this.hasText;\n\t}\n\n\tget _title() {\n\t\treturn this.title || undefined;\n\t}\n\n\tget badgeDescription() {\n\t\tif (this.interactive) {\n\t\t\treturn undefined;\n\t\t}\n\n\t\tif (this.design === BadgeDesign.Set3) {\n\t\t\treturn Badge.i18nBundle.getText(BADGE_DESCRIPTION_BADGE);\n\t\t}\n\n\t\tconst valueState = this._valueState;\n\t\tlet description = Badge.i18nBundle.getText(BADGE_DESCRIPTION_TAG);\n\n\t\tif (valueState) {\n\t\t\tdescription = `${description} ${valueState}`;\n\t\t}\n\n\t\treturn description;\n\t}\n\n\tget _semanticIconName() {\n\t\tif (this.hideStateIcon || this.hasIcon) {\n\t\t\treturn null;\n\t\t}\n\n\t\tswitch (this.design) {\n\t\tcase BadgeDesign.Neutral:\n\t\t\treturn \"sys-help-2\";\n\t\tcase BadgeDesign.Positive:\n\t\t\treturn \"sys-enter-2\";\n\t\tcase BadgeDesign.Negative:\n\t\t\treturn \"error\";\n\t\tcase BadgeDesign.Critical:\n\t\t\treturn \"alert\";\n\t\tcase BadgeDesign.Information:\n\t\t\treturn \"information\";\n\t\tdefault:\n\t\t\treturn null;\n\t\t}\n\t}\n\n\t_onclick() {\n\t\tthis.fireEvent(\"click\");\n\t}\n}\n\nBadge.define();\n\nexport default Badge;\n"]}

package/dist/Breadcrumbs.d.ts

@@ -9,7 +9,6 @@ import BreadcrumbsSeparatorStyle from "./types/BreadcrumbsSeparatorStyle.js";
 import BreadcrumbsItem from "./BreadcrumbsItem.js";
 import Link from "./Link.js";
 import type { LinkClickEventDetail } from "./Link.js";
-import Label from "./Label.js";
 import ResponsivePopover from "./ResponsivePopover.js";
 import type { ListSelectionChangeEventDetail } from "./List.js";
 import "@ui5/webcomponents-icons/dist/slim-arrow-down.js";
@@ -20,9 +19,6 @@ type BreadcrumbsItemClickEventDetail = {
     metaKey: boolean;
     shiftKey: boolean;
 };
-type FocusAdaptor = ITabbable & {
-    getlabelWrapper: () => Element | null;
-};
 /**
  * @class
  *
@@ -93,7 +89,6 @@ declare class Breadcrumbs extends UI5Element {
     _breadcrumbItemWidths: WeakMap<BreadcrumbsItem, number>;
     _dropdownArrowLinkWidth: number;
     responsivePopover?: ResponsivePopover;
-    _labelFocusAdaptor: FocusAdaptor;
     static i18nBundle: I18nBundle;
     constructor();
     onInvalidation(changeInfo: ChangeInfo): void;
@@ -120,7 +115,6 @@ declare class Breadcrumbs extends UI5Element {
     _getElementWidth(element: HTMLElement): number;
     _getTotalContentWidth(): number;
     _onLinkPress(e: CustomEvent<LinkClickEventDetail>): void;
-    _onLabelPress(e: MouseEvent | KeyboardEvent): void;
     _onOverflowListItemSelect(e: CustomEvent<ListSelectionChangeEventDetail>): void;
     _respPopover(): Promise<ResponsivePopover>;
     _toggleRespPopover(): Promise<void>;
@@ -131,13 +125,9 @@ declare class Breadcrumbs extends UI5Element {
     _preprocessItems(): void;
     _getItemPositionText(position: number, size: number): string;
     _getItemAccessibleName(item: BreadcrumbsItem, position: number, size: number): string;
-    getCurrentLocationLabelWrapper(): HTMLElement | null;
     get _visibleItems(): BreadcrumbsItem[];
-    get _endsWithCurrentLocationLabel(): boolean;
-    get _currentLocationText(): string;
-    get _currentLocationLabel(): Label | null;
+    get _endsWithCurrentPageItem(): boolean;
     get _isDropdownArrowFocused(): boolean;
-    get _isCurrentLocationLabelFocused(): boolean | null;
     /**
      * Returns the maximum allowed count of items in the overflow
      * with respect to the UX requirement to never overflow the last visible item
@@ -156,10 +146,6 @@ declare class Breadcrumbs extends UI5Element {
      * Getter for the list of abstract breadcrumb items to be rendered as links outside the overflow
      */
     get _linksData(): BreadcrumbsItem[];
-    /**
-     * Getter for accessible name of the current location. Includes the position of the current location and the size of the breadcrumbs
-     */
-    get _currentLocationAccName(): string;
     /**
      * Getter for the list of links corresponding to the abstract breadcrumb items
      */