@ui5/webcomponents 2.21.0-rc.2 → 2.21.0-rc.4

package/dist/Avatar.d.ts

@@ -245,6 +245,11 @@ declare class Avatar extends UI5Element implements ITabbable, IAvatarGroupItem {
     _onImageLoad(e: Event): void;
     _onImageError(e: Event): void;
     get accessibilityInfo(): {
+        role?: undefined;
+        type?: undefined;
+        description?: undefined;
+        disabled?: undefined;
+    } | {
         role: AriaRole;
         type: string;
         description: string;

package/dist/Avatar.js

@@ -356,6 +356,9 @@ let Avatar = Avatar_1 = class Avatar extends UI5Element {
         this._imageLoadError = true;
     }
     get accessibilityInfo() {
+        if (this.mode === AvatarMode.Decorative) {
+            return {};
+        }
         return {
             role: this._role,
             type: this._interactive ? Avatar_1.i18nBundle.getText(AVATAR_TYPE_BUTTON) : Avatar_1.i18nBundle.getText(AVATAR_TYPE_IMAGE),

package/dist/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../src/Avatar.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,UAAU,MAAM,4CAA4C,CAAC;AAEpE,OAAO,aAAa,MAAM,0DAA0D,CAAC;AACrF,OAAO,QAAQ,MAAM,qDAAqD,CAAC;AAC3E,OAAO,IAAI,MAAM,wDAAwD,CAAC;AAC1E,OAAO,KAAK,MAAM,yDAAyD,CAAC;AAC5E,OAAO,IAAI,MAAM,iDAAiD,CAAC;AACnE,OAAO,WAAW,MAAM,sDAAsD,CAAC;AAI/E,OAAO,aAAa,MAAM,wDAAwD,CAAC;AAEnF,OAAO,EAAE,cAAc,EAAE,MAAM,wCAAwC,CAAC;AACxE,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AAEnE,WAAW;AACX,OAAO,cAAc,MAAM,qBAAqB,CAAC;AAEjD,OAAO,EACN,cAAc,EACd,kBAAkB,EAClB,iBAAiB,GACjB,MAAM,mCAAmC,CAAC;AAE3C,SAAS;AACT,OAAO,SAAS,MAAM,kCAAkC,CAAC;AAGzD,OAAO,UAAU,MAAM,uBAAuB,CAAC;AAG/C,OAAO,UAAU,MAAM,uBAAuB,CAAC;AAE/C,OAAO;AACP,OAAO,2CAA2C,CAAC;AAInD;;;;;;;;;;;;;;;;;;;;;;GAsBG;AAmBH,IAAM,MAAM,cAAZ,MAAM,MAAO,SAAQ,UAAU;IA4M9B;QACC,KAAK,EAAE,CAAC;QAzMT;;;;;;WAMG;QAEH,aAAQ,GAAG,KAAK,CAAC;QAEjB;;;;;;;;;;;WAWG;QAEH,gBAAW,GAAG,KAAK,CAAC;QAEpB;;;;;;;;;;;;;WAaG;QAEH,SAAI,GAAoB,OAAO,CAAC;QAsBhC;;;;;;;;;;;;;;;;;;WAkBG;QAEH,iBAAY,GAAG,UAAU,CAAC;QAY1B;;;;WAIG;QAEH,UAAK,GAAqB,QAAQ,CAAC;QAEnC;;;;WAIG;QAEH,SAAI,GAAoB,GAAG,CAAC;QAE5B;;;;;;WAMG;QAEH,gBAAW,GAA2B,MAAM,CAAC;QAE7C;;WAEG;QAEH,iBAAY,GAA2B,MAAM,CAAC;QAY9C;;;;;;;;;;WAUG;QAEH,4BAAuB,GAAkC,EAAE,CAAC;QAK5D;;WAEG;QAEH,cAAS,GAAG,KAAK,CAAC;QAElB;;WAEG;QAEH,oBAAe,GAAG,KAAK,CAAC;QAwCvB,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACvD,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACtD,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACzD,CAAC;IAED,iBAAiB;QAChB,IAAI,CAAC,yBAAyB,EAAE,CAAC;QACjC,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC;IAChC,CAAC;IAED,IAAI,QAAQ;QACX,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YACzB,OAAO,QAAQ,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;QACtC,CAAC;QACD,OAAO,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAC1C,CAAC;IAED;;;;OAIG;IACH,IAAI,aAAa;QAChB,sFAAsF;QACtF,OAAO,IAAI,CAAC,YAAY,CAAC,MAAM,CAAe,IAAI,UAAU,CAAC,CAAC,CAAC;IAChE,CAAC;IAED;;;;OAIG;IACH,IAAI,wBAAwB;QAC3B,kGAAkG;QAClG,OAAO,IAAI,CAAC,YAAY,CAAC,cAAc,CAAsB,IAAI,IAAI,CAAC,YAAY,CAAC;IACpF,CAAC;IAED,IAAI,KAAK;QACR,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;YACvB,OAAO,QAAQ,CAAC;QACjB,CAAC;QACD,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,CAAC,UAAU,EAAE,CAAC;YACzC,OAAO,cAAc,CAAC;QACvB,CAAC;QACD,OAAO,KAAK,CAAC;IACd,CAAC;IAED,IAAI,mBAAmB;QACtB,wEAAwE;QACxE,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;YACtB,OAAO,SAAS,CAAC;QAClB,CAAC;QACD,OAAO,IAAI,CAAC,IAAI,KAAK,UAAU,CAAC,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC;IACjE,CAAC;IAED,IAAI,aAAa;QAChB,OAAO,IAAI,CAAC,gBAAgB,EAAE,CAAC;IAChC,CAAC;IAED,IAAI,YAAY;QACf,OAAO,CAAC,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC;IACrF,CAAC;IAED,IAAI,aAAa;QAChB,yDAAyD;QACzD,MAAM,aAAa,GAAG,uBAAuB,EAC5C,gBAAgB,GAAG,IAAI,CAAC,QAAQ,IAAI,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QAEvE,IAAI,gBAAgB,EAAE,CAAC;YACtB,OAAO,IAAI,CAAC,QAAQ,CAAC;QACtB,CAAC;QAED,OAAO,IAAI,CAAC;IACb,CAAC;IAED,IAAI,kBAAkB;QACrB,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YACzB,OAAO,IAAI,CAAC,cAAc,CAAC;QAC5B,CAAC;QAED,MAAM,YAAY,GAAG,QAAM,CAAC,UAAU,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;QAE/D,OAAO,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,YAAY,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC;IACjF,CAAC;IAED,IAAI,QAAQ;QACX,OAAO,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC;IACrD,CAAC;IAED,IAAI,OAAO;QACV,OAAO,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,YAAY,gBAAgB,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;IAC3E,CAAC;IAED,IAAI,iBAAiB;QACpB,OAAO,IAAI,CAAC,SAAS,EAAG,CAAC,aAAa,CAAC,sBAAsB,CAAC,CAAC;IAChE,CAAC;IAED,IAAI,kBAAkB;QACrB,OAAO,IAAI,CAAC,SAAS,EAAG,CAAC,aAAa,CAAC,2BAA2B,CAAC,CAAC;IACrE,CAAC;IAED,KAAK,CAAC,gBAAgB;QACrB,MAAM,cAAc,EAAE,CAAC;QACvB,IAAI,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YACjC,IAAI,CAAC,cAAc,EAAE,CAAC;QACvB,CAAC;IACF,CAAC;IAED,UAAU;QACT,IAAI,SAAS,EAAE,EAAE,CAAC;YACjB,IAAI,CAAC,YAAY,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC;QAClC,CAAC;QAED,IAAI,CAAC,iBAAiB,IAAI,aAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,iBAAiB,EACtE,IAAI,CAAC,kBAAkB,CAAC,CAAC;IAC3B,CAAC;IAED,SAAS;QACR,IAAI,CAAC,iBAAiB,IAAI,aAAa,CAAC,UAAU,CAAC,IAAI,CAAC,iBAAiB,EACxE,IAAI,CAAC,kBAAkB,CAAC,CAAC;QAE1B,IAAI,CAAC,yBAAyB,EAAE,CAAC;IAClC,CAAC;IAED,YAAY;QACX,IAAI,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YACjC,IAAI,CAAC,cAAc,EAAE,CAAC;QACvB,CAAC;IACF,CAAC;IAED,cAAc;QACb,MAAM,MAAM,GAAG,IAAI,CAAC,SAAS,EAAG,CAAC;QACjC,MAAM,cAAc,GAAG,MAAM,CAAC,aAAa,CAAC,sBAAsB,CAAC,CAAC;QACpE,MAAM,aAAa,GAAG,IAAI,CAAC,aAAa,IAAI,cAAc,IAAI,cAAc,CAAC,WAAW,IAAI,MAAM,CAAC,WAAW,CAAC;QAE/G,IAAI,aAAa,EAAE,CAAC;YACnB,IAAI,CAAC,YAAY,EAAE,CAAC;YACpB,OAAO;QACR,CAAC;QACD,IAAI,CAAC,gBAAgB,EAAE,CAAC;IACzB,CAAC;IAED,gBAAgB;QACf,IAAI,CAAC,iBAAiB,EAAE,SAAS,CAAC,GAAG,CAAC,4BAA4B,CAAC,CAAC;QACpE,IAAI,CAAC,kBAAkB,EAAE,SAAS,CAAC,MAAM,CAAC,iCAAiC,CAAC,CAAC;IAC9E,CAAC;IAED,YAAY;QACX,IAAI,CAAC,iBAAiB,EAAE,SAAS,CAAC,MAAM,CAAC,4BAA4B,CAAC,CAAC;QACvE,IAAI,CAAC,kBAAkB,EAAE,SAAS,CAAC,GAAG,CAAC,iCAAiC,CAAC,CAAC;IAC3E,CAAC;IAED,QAAQ,CAAC,CAAa;QACrB,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,IAAI,CAAC,UAAU,EAAE,CAAC;IACnB,CAAC;IAED,UAAU,CAAC,CAAgB;QAC1B,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC;YACxB,OAAO;QACR,CAAC;QAED,IAAI,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC;YAChB,IAAI,CAAC,UAAU,EAAE,CAAC;QACnB,CAAC;QAED,IAAI,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC;YAChB,CAAC,CAAC,cAAc,EAAE,CAAC,CAAC,oBAAoB;QACzC,CAAC;IACF,CAAC;IAED,QAAQ,CAAC,CAAgB;QACxB,IAAI,IAAI,CAAC,YAAY,IAAI,CAAC,CAAC,CAAC,QAAQ,IAAI,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC;YACpD,IAAI,CAAC,UAAU,EAAE,CAAC;QACnB,CAAC;IACF,CAAC;IAED,UAAU;QACT,IAAI,CAAC,kBAAkB,CAAC,OAAO,CAAC,CAAC;IAClC,CAAC;IAED,gBAAgB;QACf,MAAM,YAAY,GAAG,IAAI,CAAC,uBAAuB,CAAC,QAAQ,CAAC;QAE3D,wDAAwD;QACxD,IAAI,CAAC,IAAI,CAAC,YAAY,IAAI,CAAC,YAAY,EAAE,CAAC;YACzC,OAAO;QACR,CAAC;QAED,OAAO,YAAY,CAAC;IACrB,CAAC;IAED,yBAAyB;QACxB,MAAM,KAAK,GAAG,IAAI,CAAC,OAAO,CAAC;QAC3B,IAAI,CAAC,KAAK,EAAE,CAAC;YACZ,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;YAC7B,OAAO;QACR,CAAC;QAED,+CAA+C;QAC/C,KAAK,CAAC,mBAAmB,CAAC,MAAM,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC;QAC1D,KAAK,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;QAE5D,sBAAsB;QACtB,KAAK,CAAC,gBAAgB,CAAC,MAAM,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC;QACvD,KAAK,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;QAEzD,6BAA6B;QAC7B,IAAI,CAAC,wBAAwB,EAAE,CAAC;IACjC,CAAC;IAED,wBAAwB;QACvB,MAAM,KAAK,GAAG,IAAI,CAAC,OAAO,CAAC;QAC3B,IAAI,CAAC,KAAK,EAAE,CAAC;YACZ,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;YAC7B,OAAO;QACR,CAAC;QAED,IAAI,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,YAAY,KAAK,CAAC,EAAE,CAAC;YAChD,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,CAAC,iBAAiB;QAC/C,CAAC;aAAM,IAAI,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,YAAY,GAAG,CAAC,EAAE,CAAC;YACrD,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC,CAAC,iBAAiB;QAChD,CAAC;aAAM,CAAC;YACP,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC,CAAC,eAAe;QAC9C,CAAC;IACF,CAAC;IAED,yBAAyB;QACxB,MAAM,KAAK,GAAG,IAAI,CAAC,OAAO,CAAC;QAC3B,IAAI,CAAC,KAAK,EAAE,CAAC;YACZ,OAAO;QACR,CAAC;QAED,KAAK,CAAC,mBAAmB,CAAC,MAAM,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC;QAC1D,KAAK,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;IAC7D,CAAC;IAED,YAAY,CAAC,CAAQ;QACpB,IAAI,CAAC,CAAC,MAAM,KAAK,IAAI,CAAC,OAAO,EAAE,CAAC;YAC9B,CAAC,CAAC,MAA2B,EAAE,mBAAmB,CAAC,MAAM,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC;YACpF,OAAO;QACR,CAAC;QACD,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;IAC9B,CAAC;IAED,aAAa,CAAC,CAAQ;QACrB,IAAI,CAAC,CAAC,MAAM,KAAK,IAAI,CAAC,OAAO,EAAE,CAAC;YAC9B,CAAC,CAAC,MAA2B,EAAE,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;YACtF,OAAO;QACR,CAAC;QACD,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;IAC7B,CAAC;IAED,IAAI,iBAAiB;QACpB,OAAO;YACN,IAAI,EAAE,IAAI,CAAC,KAAiB;YAC5B,IAAI,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,QAAM,CAAC,UAAU,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,QAAM,CAAC,UAAU,CAAC,OAAO,CAAC,iBAAiB,CAAC;YACtH,WAAW,EAAE,IAAI,CAAC,kBAAkB;YACpC,QAAQ,EAAE,IAAI,CAAC,QAAQ;SACvB,CAAC;IACH,CAAC;CACD,CAAA;AAxcA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;wCACX;AAejB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;2CACR;AAiBpB;IADC,QAAQ,EAAE;oCACqB;AAoBhC;IADC,QAAQ,EAAE;oCACG;AAsBd;IADC,QAAQ,EAAE;4CACe;AAU1B;IADC,QAAQ,EAAE;wCACO;AAQlB;IADC,QAAQ,EAAE;qCACwB;AAQnC;IADC,QAAQ,EAAE;oCACiB;AAU5B;IADC,QAAQ,EAAE;2CACkC;AAM7C;IADC,QAAQ,EAAE;4CACmC;AAU9C;IADC,QAAQ,EAAE;8CACa;AAcxB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uDACiC;AAG5D;IADC,QAAQ,CAAC,EAAE,WAAW,EAAE,IAAI,EAAE,CAAC;8CACR;AAMxB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;yCACV;AAMlB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,CAAC;+CACvB;AAaxB;IADC,IAAI,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;qCACZ;AAejC;IADC,IAAI,EAAE;qCACmB;AAGnB;IADN,IAAI,CAAC,oBAAoB,CAAC;gCACG;AAtMzB,MAAM;IAlBX,aAAa,CAAC;QACd,GAAG,EAAE,YAAY;QACjB,aAAa,EAAE,IAAI;QACnB,QAAQ,EAAE,WAAW;QACrB,MAAM,EAAE,SAAS;QACjB,QAAQ,EAAE,cAAc;KACxB,CAAC;IACF;;;;;;;OAOG;;IACF,KAAK,CAAC,OAAO,EAAE;QACf,OAAO,EAAE,IAAI;KACb,CAAC;GACI,MAAM,CAodX;AAED,MAAM,CAAC,MAAM,EAAE,CAAC;AAEhB,eAAe,MAAM,CAAC","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport type { Slot, DefaultSlot } from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot-strict.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport type { AccessibilityAttributes, AriaRole } from \"@ui5/webcomponents-base/dist/types.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 { isDesktop } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport type { IAvatarGroupItem } from \"./AvatarGroup.js\";\n// Template\nimport AvatarTemplate from \"./AvatarTemplate.js\";\n\nimport {\n\tAVATAR_TOOLTIP,\n\tAVATAR_TYPE_BUTTON,\n\tAVATAR_TYPE_IMAGE,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// Styles\nimport AvatarCss from \"./generated/themes/Avatar.css.js\";\n\nimport type Icon from \"./Icon.js\";\nimport AvatarSize from \"./types/AvatarSize.js\";\nimport type AvatarShape from \"./types/AvatarShape.js\";\nimport type AvatarColorScheme from \"./types/AvatarColorScheme.js\";\nimport AvatarMode from \"./types/AvatarMode.js\";\n\n// Icon\nimport \"@ui5/webcomponents-icons/dist/employee.js\";\n\ntype AvatarAccessibilityAttributes = Pick<AccessibilityAttributes, \"hasPopup\">;\n\n/**\n * @class\n * ### Overview\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 * ### Keyboard Handling\n *\n * - [Space] / [Enter] or [Return] - Fires the `click` event if the `mode` is set to `Interactive` or the deprecated `interactive` property is set to true.\n * - [Shift] - If [Space] is pressed, pressing [Shift] releases the component without triggering the click event.\n *\n * ### ES6 Module Import\n * `import \"@ui5/webcomponents/dist/Avatar.js\";`\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: jsxRenderer,\n\tstyles: AvatarCss,\n\ttemplate: AvatarTemplate,\n})\n/**\n * Fired on mouseup, space and enter if avatar is interactive\n *\n * **Note:** The event will not be fired if the `disabled`\n * property is set to `true`.\n * @public\n * @since 2.11.0\n */\n@event(\"click\", {\n\tbubbles: true,\n})\nclass Avatar extends UI5Element implements ITabbable, IAvatarGroupItem {\n\teventDetails!: {\n\t\tclick: void,\n\t}\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 * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tdisabled = false;\n\n\t/**\n\t * Defines if the avatar is interactive (focusable and pressable).\n\t *\n\t * **Note:** When set to `true`, this property takes precedence over the `mode` property,\n\t * and the avatar will be rendered as interactive (role=\"button\", focusable) regardless of the `mode` value.\n\t *\n\t * **Note:** This property won't have effect if the `disabled`\n\t * property is set to `true`.\n\t * @default false\n\t * @public\n\t * @deprecated Set `mode=\"Interactive\"` instead for the same functionality with proper accessibility.\n\t */\n\t@property({ type: Boolean })\n\tinteractive = false;\n\n\t/**\n\t * Defines the mode of the component.\n\t *\n\t * **Note:**\n\t * - `Image` (default) - renders with role=\"img\"\n\t * - `Decorative` - renders with role=\"presentation\" and aria-hidden=\"true\", making it purely decorative\n\t * - `Interactive` - renders with role=\"button\", focusable (tabindex=\"0\"), and supports keyboard interaction\n\t *\n\t * **Note:** This property is ignored when the `interactive` property is set to `true`.\n\t * In that case, the avatar will always be rendered as interactive.\n\t * @default \"Image\"\n\t * @public\n\t * @since 2.20\n\t */\n\t@property()\n\tmode: `${AvatarMode}` = \"Image\";\n\n\t/**\n\t * Defines the name of the UI5 Icon, that will be displayed.\n\t *\n\t * **Note:** If `image` slot is provided, the property will be ignored.\n\t *\n\t * **Note:** You should import the desired icon first, then use its name as \"icon\".\n\t *\n\t * `import \"@ui5/webcomponents-icons/dist/{icon_name}.js\"`\n\t *\n\t * `<ui5-avatar icon=\"employee\">`\n\t *\n\t * **Note:** 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 [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).\n\t * @default undefined\n\t * @public\n\t */\n\t@property()\n\ticon?: string;\n\n\t/**\n\t * Defines the name of the fallback icon, which should be displayed in the following cases:\n\t *\n\t * \t- If the initials are not valid (more than 3 letters, unsupported languages or empty initials).\n\t * \t- If there are three initials and they do not fit in the shape (e.g. WWW for some of the sizes).\n\t * \t- If the image src is wrong.\n\t *\n\t * **Note:** If not set, a default fallback icon \"employee\" is displayed.\n\t *\n\t * **Note:** You should import the desired icon first, then use its name as \"fallback-icon\".\n\t *\n\t * `import \"@ui5/webcomponents-icons/dist/{icon_name}.js\"`\n\t *\n\t * `<ui5-avatar fallback-icon=\"alert\">`\n\t *\n\t * See all the available icons in the [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).\n\t * @default \"employee\"\n\t * @public\n\t */\n\t@property()\n\tfallbackIcon = \"employee\";\n\n\t/**\n\t * Defines the displayed initials.\n\t *\n\t * Up to three Latin letters can be displayed as initials.\n\t * @default undefined\n\t * @public\n\t */\n\t@property()\n\tinitials?: string;\n\n\t/**\n\t * Defines the shape of the component.\n\t * @default \"Circle\"\n\t * @public\n\t */\n\t@property()\n\tshape: `${AvatarShape}` = \"Circle\";\n\n\t/**\n\t * Defines predefined size of the component.\n\t * @default \"S\"\n\t * @public\n\t */\n\t@property()\n\tsize: `${AvatarSize}` = \"S\";\n\n\t/**\n\t * Defines the background color of the desired image.\n\t * If `colorScheme` is set to `Auto`, the avatar will be displayed with the `Accent6` color.\n\t *\n\t * @default \"Auto\"\n\t * @public\n\t */\n\t@property()\n\tcolorScheme: `${AvatarColorScheme}` = \"Auto\";\n\n\t/**\n\t * @private\n\t */\n\t@property()\n\t_colorScheme: `${AvatarColorScheme}` = \"Auto\";\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 * @default undefined\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 additional accessibility attributes that will be applied to the component.\n\t * The following field is supported:\n\t *\n\t * - **hasPopup**: Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by the button.\n\t * Accepts the following string values: `dialog`, `grid`, `listbox`, `menu` or `tree`.\n\t *\n\t * @public\n\t * @since 2.0.0\n\t * @default {}\n\t */\n\t@property({ type: Object })\n\taccessibilityAttributes: AvatarAccessibilityAttributes = {};\n\n\t@property({ noAttribute: true })\n\tforcedTabIndex?: string;\n\n\t/**\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\t_hasImage = false;\n\n\t/**\n\t * @private\n\t */\n\t@property({ type: Boolean, noAttribute: true })\n\t_imageLoadError = false;\n\n\t/**\n\t * Receives the desired `<img>` tag\n\t *\n\t * **Note:** If you experience flickering of the provided image, you can hide the component until it is defined with the following CSS:<br/>\n\t * `ui5-avatar:not(:defined) {`<br/>\n\t * &nbsp;&nbsp;&nbsp;&nbsp;`visibility: hidden;`<br/>\n\t * `}`\n\t * @public\n\t * @since 1.0.0-rc.15\n\t */\n\t@slot({ type: HTMLElement, \"default\": true })\n\timage!: DefaultSlot<HTMLElement>;\n\n\t/**\n\t * Defines the optional badge that will be used for visual affordance.\n\t *\n\t * **Recommendation:** While badges are supported on all avatars, it is recommended\n\t * to use them with interactive avatars (via `mode=\"Interactive\"` or `interactive` attribute)\n\t * to provide better user experience and accessibility.\n\t *\n\t * **Note:** While the slot allows for custom badges, to achieve\n\t * the Fiori design, use the `ui5-avatar-badge` component.\n\t * @public\n\t * @since 1.7.0\n\t */\n\t@slot()\n\tbadge!: Slot<HTMLElement>;\n\n\t@i18n(\"@ui5/webcomponents\")\n\tstatic i18nBundle: I18nBundle;\n\n\t_handleResizeBound: ResizeObserverCallback;\n\t_onImageLoadBound: (e: Event) => void;\n\t_onImageErrorBound: (e: Event) => void;\n\n\tconstructor() {\n\t\tsuper();\n\n\t\tthis._handleResizeBound = this.handleResize.bind(this);\n\t\tthis._onImageLoadBound = this._onImageLoad.bind(this);\n\t\tthis._onImageErrorBound = this._onImageError.bind(this);\n\t}\n\n\tonBeforeRendering() {\n\t\tthis._attachImageEventHandlers();\n\t\tthis._hasImage = this.hasImage;\n\t}\n\n\tget tabindex() {\n\t\tif (this.forcedTabIndex) {\n\t\t\treturn parseInt(this.forcedTabIndex);\n\t\t}\n\t\treturn this._interactive ? 0 : undefined;\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 || AvatarSize.S;\n\t}\n\n\t/**\n\t * Returns the effective background color.\n\t * @default \"Auto\"\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\tif (this._interactive) {\n\t\t\treturn \"button\";\n\t\t}\n\t\tif (this.mode === AvatarMode.Decorative) {\n\t\t\treturn \"presentation\";\n\t\t}\n\t\treturn \"img\";\n\t}\n\n\tget effectiveAriaHidden() {\n\t\t// interactive property takes precedence - never hidden when interactive\n\t\tif (this.interactive) {\n\t\t\treturn undefined;\n\t\t}\n\t\treturn this.mode === AvatarMode.Decorative ? \"true\" : undefined;\n\t}\n\n\tget _ariaHasPopup() {\n\t\treturn this._getAriaHasPopup();\n\t}\n\n\tget _interactive() {\n\t\treturn (this.interactive || this.mode === AvatarMode.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\tconst defaultLabel = Avatar.i18nBundle.getText(AVATAR_TOOLTIP);\n\n\t\treturn this.initials ? `${defaultLabel} ${this.initials}`.trim() : defaultLabel;\n\t}\n\n\tget hasImage() {\n\t\treturn !!this.image.length && !this._imageLoadError;\n\t}\n\n\tget imageEl(): HTMLImageElement | null {\n\t\treturn this.image?.[0] instanceof HTMLImageElement ? this.image[0] : null;\n\t}\n\n\tget initialsContainer(): HTMLObjectElement | null {\n\t\treturn this.getDomRef()!.querySelector(\".ui5-avatar-initials\");\n\t}\n\n\tget fallBackIconDomRef(): Icon | null {\n\t\treturn this.getDomRef()!.querySelector(\".ui5-avatar-icon-fallback\");\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\tif (isDesktop()) {\n\t\t\tthis.setAttribute(\"desktop\", \"\");\n\t\t}\n\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\n\t\tthis._detachImageEventHandlers();\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\tconst avatarInitials = avatar.querySelector(\".ui5-avatar-initials\");\n\t\tconst validInitials = this.validInitials && avatarInitials && avatarInitials.scrollWidth <= avatar.scrollWidth;\n\n\t\tif (validInitials) {\n\t\t\tthis.showInitials();\n\t\t\treturn;\n\t\t}\n\t\tthis.showFallbackIcon();\n\t}\n\n\tshowFallbackIcon() {\n\t\tthis.initialsContainer?.classList.add(\"ui5-avatar-initials-hidden\");\n\t\tthis.fallBackIconDomRef?.classList.remove(\"ui5-avatar-fallback-icon-hidden\");\n\t}\n\n\tshowInitials() {\n\t\tthis.initialsContainer?.classList.remove(\"ui5-avatar-initials-hidden\");\n\t\tthis.fallBackIconDomRef?.classList.add(\"ui5-avatar-fallback-icon-hidden\");\n\t}\n\n\t_onclick(e: MouseEvent) {\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.fireDecoratorEvent(\"click\");\n\t}\n\n\t_getAriaHasPopup() {\n\t\tconst ariaHaspopup = this.accessibilityAttributes.hasPopup;\n\n\t\t// aria-haspopup only applies when avatar is interactive\n\t\tif (!this._interactive || !ariaHaspopup) {\n\t\t\treturn;\n\t\t}\n\n\t\treturn ariaHaspopup;\n\t}\n\n\t_attachImageEventHandlers() {\n\t\tconst imgEl = this.imageEl;\n\t\tif (!imgEl) {\n\t\t\tthis._imageLoadError = false;\n\t\t\treturn;\n\t\t}\n\n\t\t// Remove previous handlers to avoid duplicates\n\t\timgEl.removeEventListener(\"load\", this._onImageLoadBound);\n\t\timgEl.removeEventListener(\"error\", this._onImageErrorBound);\n\n\t\t// Attach new handlers\n\t\timgEl.addEventListener(\"load\", this._onImageLoadBound);\n\t\timgEl.addEventListener(\"error\", this._onImageErrorBound);\n\n\t\t// Check existing image state\n\t\tthis._checkExistingImageState();\n\t}\n\n\t_checkExistingImageState() {\n\t\tconst imgEl = this.imageEl;\n\t\tif (!imgEl) {\n\t\t\tthis._imageLoadError = false;\n\t\t\treturn;\n\t\t}\n\n\t\tif (imgEl.complete && imgEl.naturalWidth === 0) {\n\t\t\tthis._imageLoadError = true; // Already broken\n\t\t} else if (imgEl.complete && imgEl.naturalWidth > 0) {\n\t\t\tthis._imageLoadError = false; // Already loaded\n\t\t} else {\n\t\t\tthis._imageLoadError = false; // Pending load\n\t\t}\n\t}\n\n\t_detachImageEventHandlers() {\n\t\tconst imgEl = this.imageEl;\n\t\tif (!imgEl) {\n\t\t\treturn;\n\t\t}\n\n\t\timgEl.removeEventListener(\"load\", this._onImageLoadBound);\n\t\timgEl.removeEventListener(\"error\", this._onImageErrorBound);\n\t}\n\n\t_onImageLoad(e: Event) {\n\t\tif (e.target !== this.imageEl) {\n\t\t\t(e.target as HTMLImageElement)?.removeEventListener(\"load\", this._onImageLoadBound);\n\t\t\treturn;\n\t\t}\n\t\tthis._imageLoadError = false;\n\t}\n\n\t_onImageError(e: Event) {\n\t\tif (e.target !== this.imageEl) {\n\t\t\t(e.target as HTMLImageElement)?.removeEventListener(\"error\", this._onImageErrorBound);\n\t\t\treturn;\n\t\t}\n\t\tthis._imageLoadError = true;\n\t}\n\n\tget accessibilityInfo() {\n\t\treturn {\n\t\t\trole: this._role as AriaRole,\n\t\t\ttype: this._interactive ? Avatar.i18nBundle.getText(AVATAR_TYPE_BUTTON) : Avatar.i18nBundle.getText(AVATAR_TYPE_IMAGE),\n\t\t\tdescription: this.accessibleNameText,\n\t\t\tdisabled: this.disabled,\n\t\t};\n\t}\n}\n\nAvatar.define();\n\nexport default Avatar;\nexport type {\n\tAvatarAccessibilityAttributes,\n};\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 type { Slot, DefaultSlot } from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot-strict.js\";\nimport event from \"@ui5/webcomponents-base/dist/decorators/event-strict.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport type { AccessibilityAttributes, AriaRole } from \"@ui5/webcomponents-base/dist/types.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 { isDesktop } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport type { IAvatarGroupItem } from \"./AvatarGroup.js\";\n// Template\nimport AvatarTemplate from \"./AvatarTemplate.js\";\n\nimport {\n\tAVATAR_TOOLTIP,\n\tAVATAR_TYPE_BUTTON,\n\tAVATAR_TYPE_IMAGE,\n} from \"./generated/i18n/i18n-defaults.js\";\n\n// Styles\nimport AvatarCss from \"./generated/themes/Avatar.css.js\";\n\nimport type Icon from \"./Icon.js\";\nimport AvatarSize from \"./types/AvatarSize.js\";\nimport type AvatarShape from \"./types/AvatarShape.js\";\nimport type AvatarColorScheme from \"./types/AvatarColorScheme.js\";\nimport AvatarMode from \"./types/AvatarMode.js\";\n\n// Icon\nimport \"@ui5/webcomponents-icons/dist/employee.js\";\n\ntype AvatarAccessibilityAttributes = Pick<AccessibilityAttributes, \"hasPopup\">;\n\n/**\n * @class\n * ### Overview\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 * ### Keyboard Handling\n *\n * - [Space] / [Enter] or [Return] - Fires the `click` event if the `mode` is set to `Interactive` or the deprecated `interactive` property is set to true.\n * - [Shift] - If [Space] is pressed, pressing [Shift] releases the component without triggering the click event.\n *\n * ### ES6 Module Import\n * `import \"@ui5/webcomponents/dist/Avatar.js\";`\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: jsxRenderer,\n\tstyles: AvatarCss,\n\ttemplate: AvatarTemplate,\n})\n/**\n * Fired on mouseup, space and enter if avatar is interactive\n *\n * **Note:** The event will not be fired if the `disabled`\n * property is set to `true`.\n * @public\n * @since 2.11.0\n */\n@event(\"click\", {\n\tbubbles: true,\n})\nclass Avatar extends UI5Element implements ITabbable, IAvatarGroupItem {\n\teventDetails!: {\n\t\tclick: void,\n\t}\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 * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tdisabled = false;\n\n\t/**\n\t * Defines if the avatar is interactive (focusable and pressable).\n\t *\n\t * **Note:** When set to `true`, this property takes precedence over the `mode` property,\n\t * and the avatar will be rendered as interactive (role=\"button\", focusable) regardless of the `mode` value.\n\t *\n\t * **Note:** This property won't have effect if the `disabled`\n\t * property is set to `true`.\n\t * @default false\n\t * @public\n\t * @deprecated Set `mode=\"Interactive\"` instead for the same functionality with proper accessibility.\n\t */\n\t@property({ type: Boolean })\n\tinteractive = false;\n\n\t/**\n\t * Defines the mode of the component.\n\t *\n\t * **Note:**\n\t * - `Image` (default) - renders with role=\"img\"\n\t * - `Decorative` - renders with role=\"presentation\" and aria-hidden=\"true\", making it purely decorative\n\t * - `Interactive` - renders with role=\"button\", focusable (tabindex=\"0\"), and supports keyboard interaction\n\t *\n\t * **Note:** This property is ignored when the `interactive` property is set to `true`.\n\t * In that case, the avatar will always be rendered as interactive.\n\t * @default \"Image\"\n\t * @public\n\t * @since 2.20\n\t */\n\t@property()\n\tmode: `${AvatarMode}` = \"Image\";\n\n\t/**\n\t * Defines the name of the UI5 Icon, that will be displayed.\n\t *\n\t * **Note:** If `image` slot is provided, the property will be ignored.\n\t *\n\t * **Note:** You should import the desired icon first, then use its name as \"icon\".\n\t *\n\t * `import \"@ui5/webcomponents-icons/dist/{icon_name}.js\"`\n\t *\n\t * `<ui5-avatar icon=\"employee\">`\n\t *\n\t * **Note:** 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 [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).\n\t * @default undefined\n\t * @public\n\t */\n\t@property()\n\ticon?: string;\n\n\t/**\n\t * Defines the name of the fallback icon, which should be displayed in the following cases:\n\t *\n\t * \t- If the initials are not valid (more than 3 letters, unsupported languages or empty initials).\n\t * \t- If there are three initials and they do not fit in the shape (e.g. WWW for some of the sizes).\n\t * \t- If the image src is wrong.\n\t *\n\t * **Note:** If not set, a default fallback icon \"employee\" is displayed.\n\t *\n\t * **Note:** You should import the desired icon first, then use its name as \"fallback-icon\".\n\t *\n\t * `import \"@ui5/webcomponents-icons/dist/{icon_name}.js\"`\n\t *\n\t * `<ui5-avatar fallback-icon=\"alert\">`\n\t *\n\t * See all the available icons in the [Icon Explorer](https://sdk.openui5.org/test-resources/sap/m/demokit/iconExplorer/webapp/index.html).\n\t * @default \"employee\"\n\t * @public\n\t */\n\t@property()\n\tfallbackIcon = \"employee\";\n\n\t/**\n\t * Defines the displayed initials.\n\t *\n\t * Up to three Latin letters can be displayed as initials.\n\t * @default undefined\n\t * @public\n\t */\n\t@property()\n\tinitials?: string;\n\n\t/**\n\t * Defines the shape of the component.\n\t * @default \"Circle\"\n\t * @public\n\t */\n\t@property()\n\tshape: `${AvatarShape}` = \"Circle\";\n\n\t/**\n\t * Defines predefined size of the component.\n\t * @default \"S\"\n\t * @public\n\t */\n\t@property()\n\tsize: `${AvatarSize}` = \"S\";\n\n\t/**\n\t * Defines the background color of the desired image.\n\t * If `colorScheme` is set to `Auto`, the avatar will be displayed with the `Accent6` color.\n\t *\n\t * @default \"Auto\"\n\t * @public\n\t */\n\t@property()\n\tcolorScheme: `${AvatarColorScheme}` = \"Auto\";\n\n\t/**\n\t * @private\n\t */\n\t@property()\n\t_colorScheme: `${AvatarColorScheme}` = \"Auto\";\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 * @default undefined\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 additional accessibility attributes that will be applied to the component.\n\t * The following field is supported:\n\t *\n\t * - **hasPopup**: Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by the button.\n\t * Accepts the following string values: `dialog`, `grid`, `listbox`, `menu` or `tree`.\n\t *\n\t * @public\n\t * @since 2.0.0\n\t * @default {}\n\t */\n\t@property({ type: Object })\n\taccessibilityAttributes: AvatarAccessibilityAttributes = {};\n\n\t@property({ noAttribute: true })\n\tforcedTabIndex?: string;\n\n\t/**\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\t_hasImage = false;\n\n\t/**\n\t * @private\n\t */\n\t@property({ type: Boolean, noAttribute: true })\n\t_imageLoadError = false;\n\n\t/**\n\t * Receives the desired `<img>` tag\n\t *\n\t * **Note:** If you experience flickering of the provided image, you can hide the component until it is defined with the following CSS:<br/>\n\t * `ui5-avatar:not(:defined) {`<br/>\n\t * &nbsp;&nbsp;&nbsp;&nbsp;`visibility: hidden;`<br/>\n\t * `}`\n\t * @public\n\t * @since 1.0.0-rc.15\n\t */\n\t@slot({ type: HTMLElement, \"default\": true })\n\timage!: DefaultSlot<HTMLElement>;\n\n\t/**\n\t * Defines the optional badge that will be used for visual affordance.\n\t *\n\t * **Recommendation:** While badges are supported on all avatars, it is recommended\n\t * to use them with interactive avatars (via `mode=\"Interactive\"` or `interactive` attribute)\n\t * to provide better user experience and accessibility.\n\t *\n\t * **Note:** While the slot allows for custom badges, to achieve\n\t * the Fiori design, use the `ui5-avatar-badge` component.\n\t * @public\n\t * @since 1.7.0\n\t */\n\t@slot()\n\tbadge!: Slot<HTMLElement>;\n\n\t@i18n(\"@ui5/webcomponents\")\n\tstatic i18nBundle: I18nBundle;\n\n\t_handleResizeBound: ResizeObserverCallback;\n\t_onImageLoadBound: (e: Event) => void;\n\t_onImageErrorBound: (e: Event) => void;\n\n\tconstructor() {\n\t\tsuper();\n\n\t\tthis._handleResizeBound = this.handleResize.bind(this);\n\t\tthis._onImageLoadBound = this._onImageLoad.bind(this);\n\t\tthis._onImageErrorBound = this._onImageError.bind(this);\n\t}\n\n\tonBeforeRendering() {\n\t\tthis._attachImageEventHandlers();\n\t\tthis._hasImage = this.hasImage;\n\t}\n\n\tget tabindex() {\n\t\tif (this.forcedTabIndex) {\n\t\t\treturn parseInt(this.forcedTabIndex);\n\t\t}\n\t\treturn this._interactive ? 0 : undefined;\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 || AvatarSize.S;\n\t}\n\n\t/**\n\t * Returns the effective background color.\n\t * @default \"Auto\"\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\tif (this._interactive) {\n\t\t\treturn \"button\";\n\t\t}\n\t\tif (this.mode === AvatarMode.Decorative) {\n\t\t\treturn \"presentation\";\n\t\t}\n\t\treturn \"img\";\n\t}\n\n\tget effectiveAriaHidden() {\n\t\t// interactive property takes precedence - never hidden when interactive\n\t\tif (this.interactive) {\n\t\t\treturn undefined;\n\t\t}\n\t\treturn this.mode === AvatarMode.Decorative ? \"true\" : undefined;\n\t}\n\n\tget _ariaHasPopup() {\n\t\treturn this._getAriaHasPopup();\n\t}\n\n\tget _interactive() {\n\t\treturn (this.interactive || this.mode === AvatarMode.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\tconst defaultLabel = Avatar.i18nBundle.getText(AVATAR_TOOLTIP);\n\n\t\treturn this.initials ? `${defaultLabel} ${this.initials}`.trim() : defaultLabel;\n\t}\n\n\tget hasImage() {\n\t\treturn !!this.image.length && !this._imageLoadError;\n\t}\n\n\tget imageEl(): HTMLImageElement | null {\n\t\treturn this.image?.[0] instanceof HTMLImageElement ? this.image[0] : null;\n\t}\n\n\tget initialsContainer(): HTMLObjectElement | null {\n\t\treturn this.getDomRef()!.querySelector(\".ui5-avatar-initials\");\n\t}\n\n\tget fallBackIconDomRef(): Icon | null {\n\t\treturn this.getDomRef()!.querySelector(\".ui5-avatar-icon-fallback\");\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\tif (isDesktop()) {\n\t\t\tthis.setAttribute(\"desktop\", \"\");\n\t\t}\n\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\n\t\tthis._detachImageEventHandlers();\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\tconst avatarInitials = avatar.querySelector(\".ui5-avatar-initials\");\n\t\tconst validInitials = this.validInitials && avatarInitials && avatarInitials.scrollWidth <= avatar.scrollWidth;\n\n\t\tif (validInitials) {\n\t\t\tthis.showInitials();\n\t\t\treturn;\n\t\t}\n\t\tthis.showFallbackIcon();\n\t}\n\n\tshowFallbackIcon() {\n\t\tthis.initialsContainer?.classList.add(\"ui5-avatar-initials-hidden\");\n\t\tthis.fallBackIconDomRef?.classList.remove(\"ui5-avatar-fallback-icon-hidden\");\n\t}\n\n\tshowInitials() {\n\t\tthis.initialsContainer?.classList.remove(\"ui5-avatar-initials-hidden\");\n\t\tthis.fallBackIconDomRef?.classList.add(\"ui5-avatar-fallback-icon-hidden\");\n\t}\n\n\t_onclick(e: MouseEvent) {\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.fireDecoratorEvent(\"click\");\n\t}\n\n\t_getAriaHasPopup() {\n\t\tconst ariaHaspopup = this.accessibilityAttributes.hasPopup;\n\n\t\t// aria-haspopup only applies when avatar is interactive\n\t\tif (!this._interactive || !ariaHaspopup) {\n\t\t\treturn;\n\t\t}\n\n\t\treturn ariaHaspopup;\n\t}\n\n\t_attachImageEventHandlers() {\n\t\tconst imgEl = this.imageEl;\n\t\tif (!imgEl) {\n\t\t\tthis._imageLoadError = false;\n\t\t\treturn;\n\t\t}\n\n\t\t// Remove previous handlers to avoid duplicates\n\t\timgEl.removeEventListener(\"load\", this._onImageLoadBound);\n\t\timgEl.removeEventListener(\"error\", this._onImageErrorBound);\n\n\t\t// Attach new handlers\n\t\timgEl.addEventListener(\"load\", this._onImageLoadBound);\n\t\timgEl.addEventListener(\"error\", this._onImageErrorBound);\n\n\t\t// Check existing image state\n\t\tthis._checkExistingImageState();\n\t}\n\n\t_checkExistingImageState() {\n\t\tconst imgEl = this.imageEl;\n\t\tif (!imgEl) {\n\t\t\tthis._imageLoadError = false;\n\t\t\treturn;\n\t\t}\n\n\t\tif (imgEl.complete && imgEl.naturalWidth === 0) {\n\t\t\tthis._imageLoadError = true; // Already broken\n\t\t} else if (imgEl.complete && imgEl.naturalWidth > 0) {\n\t\t\tthis._imageLoadError = false; // Already loaded\n\t\t} else {\n\t\t\tthis._imageLoadError = false; // Pending load\n\t\t}\n\t}\n\n\t_detachImageEventHandlers() {\n\t\tconst imgEl = this.imageEl;\n\t\tif (!imgEl) {\n\t\t\treturn;\n\t\t}\n\n\t\timgEl.removeEventListener(\"load\", this._onImageLoadBound);\n\t\timgEl.removeEventListener(\"error\", this._onImageErrorBound);\n\t}\n\n\t_onImageLoad(e: Event) {\n\t\tif (e.target !== this.imageEl) {\n\t\t\t(e.target as HTMLImageElement)?.removeEventListener(\"load\", this._onImageLoadBound);\n\t\t\treturn;\n\t\t}\n\t\tthis._imageLoadError = false;\n\t}\n\n\t_onImageError(e: Event) {\n\t\tif (e.target !== this.imageEl) {\n\t\t\t(e.target as HTMLImageElement)?.removeEventListener(\"error\", this._onImageErrorBound);\n\t\t\treturn;\n\t\t}\n\t\tthis._imageLoadError = true;\n\t}\n\n\tget accessibilityInfo() {\n\t\tif (this.mode === AvatarMode.Decorative) {\n\t\t\treturn {};\n\t\t}\n\n\t\treturn {\n\t\t\trole: this._role as AriaRole,\n\t\t\ttype: this._interactive ? Avatar.i18nBundle.getText(AVATAR_TYPE_BUTTON) : Avatar.i18nBundle.getText(AVATAR_TYPE_IMAGE),\n\t\t\tdescription: this.accessibleNameText,\n\t\t\tdisabled: this.disabled,\n\t\t};\n\t}\n}\n\nAvatar.define();\n\nexport default Avatar;\nexport type {\n\tAvatarAccessibilityAttributes,\n};\n"]}

package/dist/ComboBox.d.ts

@@ -362,6 +362,12 @@ declare class ComboBox extends UI5Element implements IFormInputElement {
     _closeRespPopover(e?: Event | null): void;
     _openRespPopover(): void;
     _filterItems(str: string): IComboBoxItem[];
+    /**
+     * Sets the markupText property of an item with highlighted first match.
+     * @param item The ComboBox item to highlight
+     * @private
+     */
+    _highlightItem(item: ComboBoxItem): void;
     _getFirstMatchingItem(current: string): IComboBoxItem | void;
     _applyAtomicValueAndSelection(item: IComboBoxItem, filterValue: string): void;
     _selectMatchingItem(): void;

package/dist/ComboBox.js

@@ -27,6 +27,7 @@ import { submitForm } from "@ui5/webcomponents-base/dist/features/InputElementsF
 import { isBackSpace, isDelete, isShow, isUp, isDown, isEnter, isEscape, isTabNext, isTabPrevious, isPageUp, isPageDown, isHome, isEnd, isCtrlAltF8, } from "@ui5/webcomponents-base/dist/Keys.js";
 import { attachListeners } from "@ui5/webcomponents-base/dist/util/valueStateNavigation.js";
 import arraysAreEqual from "@ui5/webcomponents-base/dist/util/arraysAreEqual.js";
+import generateHighlightedMarkupFirstMatch from "@ui5/webcomponents-base/dist/util/generateHighlightedMarkupFirstMatch.js";
 import * as Filters from "./Filters.js";
 import { VALUE_STATE_SUCCESS, VALUE_STATE_ERROR, VALUE_STATE_WARNING, VALUE_STATE_INFORMATION, VALUE_STATE_TYPE_SUCCESS, VALUE_STATE_TYPE_INFORMATION, VALUE_STATE_TYPE_ERROR, VALUE_STATE_TYPE_WARNING, VALUE_STATE_LINK, VALUE_STATE_LINKS, VALUE_STATE_LINK_MAC, VALUE_STATE_LINKS_MAC, INPUT_SUGGESTIONS_TITLE, COMBOBOX_AVAILABLE_OPTIONS, COMBOBOX_DIALOG_OK_BUTTON, COMBOBOX_DIALOG_CANCEL_BUTTON, SELECT_OPTIONS, LIST_ITEM_POSITION, LIST_ITEM_GROUP_HEADER, INPUT_CLEAR_ICON_ACC_NAME, FORM_TEXTFIELD_REQUIRED, } from "./generated/i18n/i18n-defaults.js";
 // Templates
@@ -284,6 +285,23 @@ let ComboBox = ComboBox_1 = class ComboBox extends UI5Element {
         if (this.selectedValue) {
             this._useSelectedValue = true;
         }
+        // Highlight filtered items
+        this._filteredItems.forEach(item => {
+            if (!item) {
+                return;
+            }
+            if (isInstanceOfComboBoxItemGroup(item)) {
+                // For grouped items, highlight each item in the group
+                item.items.forEach(nestedItem => {
+                    if (nestedItem) {
+                        this._highlightItem(nestedItem);
+                    }
+                });
+            }
+            else {
+                this._highlightItem(item);
+            }
+        });
         this._selectMatchingItem();
         this._initialRendering = false;
         this.style.setProperty("--_ui5-input-icons-count", `${this.iconsCount}`);
@@ -796,6 +814,14 @@ let ComboBox = ComboBox_1 = class ComboBox extends UI5Element {
         });
         return [...filteredItemGroups, ...filteredItems];
     }
+    /**
+     * Sets the markupText property of an item with highlighted first match.
+     * @param item The ComboBox item to highlight
+     * @private
+     */
+    _highlightItem(item) {
+        item.markupText = generateHighlightedMarkupFirstMatch(item.text || "", this.filterValue);
+    }
     _getFirstMatchingItem(current) {
         const allItems = this._getItems();
         const currentlyFocusedItem = allItems.find(item => item.focused === true);
@@ -930,6 +956,11 @@ let ComboBox = ComboBox_1 = class ComboBox extends UI5Element {
             return this._closeRespPopover();
         }
         this.value = this._selectedItemText;
+        // On first item select the _useSelectedValue is still false.
+        // In case the item has a value property, we set the _useSelectedValue to true to start working with the value instead with the text.
+        if (!this._useSelectedValue && item.value !== undefined) {
+            this._useSelectedValue = true;
+        }
         if (this._useSelectedValue) {
             this.selectedValue = item.value;
         }