npm - @ui5/webcomponents-fiori - Versions diffs - 2.25.0-rc.0 → 2.25.0 - Mend

@ui5/webcomponents-fiori 2.25.0-rc.0 → 2.25.0

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

Files changed (216) hide show

package/dist/IllustratedMessage.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
-import type { Slot, DefaultSlot } from "@ui5/webcomponents-base/dist/UI5Element.js";
+import type { Slot, DefaultSlot, ChangeInfo } from "@ui5/webcomponents-base/dist/UI5Element.js";
 import type { ResizeObserverCallback } from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js";
 import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
 import type { IButton } from "@ui5/webcomponents/dist/Button.js";
@@ -199,10 +199,9 @@ declare class IllustratedMessage extends UI5Element {
     illustrationTitle?: string;
     illustrationSubtitle?: string;
     static i18nBundle: I18nBundle;
-    _lastKnownOffsetWidthForMedia: Record<string, number>;
-    _lastKnownOffsetHeightForMedia: Record<string, number>;
-    _lastKnownMedia: string;
+    _contentHeightForMedia: Record<string, number>;
     _handleResize: ResizeObserverCallback;
+    _handleThemeLoaded: () => void;
     constructor();
     static get BREAKPOINTS(): {
         DIALOG: number;
@@ -210,12 +209,6 @@ declare class IllustratedMessage extends UI5Element {
         DOT: number;
         BASE: number;
     };
-    static get BREAKPOINTS_HEIGHT(): {
-        DIALOG: number;
-        SPOT: number;
-        DOT: number;
-        BASE: number;
-    };
     static get MEDIA(): {
         BASE: string;
         DOT: string;
@@ -226,10 +219,17 @@ declare class IllustratedMessage extends UI5Element {
     onBeforeRendering(): Promise<void>;
     onEnterDOM(): void;
     onExitDOM(): void;
+    onInvalidation(changeInfo: ChangeInfo): void;
     handleResize(): void;
-    _applyMedia(heightChange?: boolean): void;
+    /**
+     * Checks if the current height of the component is enough to display the illustration, title, subtitle and actions.
+     * If not, the minimum required height for the current media is stored in the `_contentHeightForMedia` object.
+     * @private
+     */
+    _checkHeightConstraints(): void;
+    _applyMedia(): void;
+    _mediaExceedsContainerHeight(media: string): boolean;
     _setSVGAccAttrs(): void;
-    _adjustHeightToFitContainer(): void;
     onAfterRendering(): void;
     /**
      * Modifies the IM styles in accordance to the `size` property's value.

package/dist/IllustratedMessage.js CHANGED Viewed

@@ -11,6 +11,7 @@ import property from "@ui5/webcomponents-base/dist/decorators/property.js";
 import slot from "@ui5/webcomponents-base/dist/decorators/slot-strict.js";
 import i18n from "@ui5/webcomponents-base/dist/decorators/i18n.js";
 import ResizeHandler from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js";
+import { attachThemeLoaded, detachThemeLoaded } from "@ui5/webcomponents-base/dist/Theming.js";
 import { getIllustrationDataSync, getIllustrationData } from "@ui5/webcomponents-base/dist/asset-registries/Illustrations.js";
 import { getEffectiveAriaLabelText } from "@ui5/webcomponents-base/dist/util/AccessibilityTextsHelper.js";
 import jsxRenderer from "@ui5/webcomponents-base/dist/renderer/JsxRenderer.js";
@@ -122,11 +123,13 @@ let IllustratedMessage = IllustratedMessage_1 = class IllustratedMessage extends
         */
         this.decorative = false;
         this._handleResize = this.handleResize.bind(this);
-        // this will store the last known offsetWidth of the IllustratedMessage DOM node for a given media (e.g. "Spot")
-        this._lastKnownOffsetWidthForMedia = {};
-        this._lastKnownOffsetHeightForMedia = {};
-        // this will store the last known media, in order to detect if IllustratedMessage has been hidden by expand/collapse container
-        this._lastKnownMedia = "base";
+        this._handleThemeLoaded = () => {
+            // Cached content-height are theme-dependent, so clear them when the theme changes.
+            // This hook is needed because `onInvalidation` does not fire when the theme changes
+            this._contentHeightForMedia = {};
+        };
+        // this will store the height of the inner content of the IllustratedMessage (illustration + title + subtitle + actions) for a given media (e.g. "Spot")
+        this._contentHeightForMedia = {};
     }
     static get BREAKPOINTS() {
         return {
@@ -136,14 +139,6 @@ let IllustratedMessage = IllustratedMessage_1 = class IllustratedMessage extends
             BASE: 160,
         };
     }
-    static get BREAKPOINTS_HEIGHT() {
-        return {
-            DIALOG: 415,
-            SPOT: 284,
-            DOT: 207,
-            BASE: 61,
-        };
-    }
     static get MEDIA() {
         return {
             BASE: "base",
@@ -199,49 +194,68 @@ let IllustratedMessage = IllustratedMessage_1 = class IllustratedMessage extends
     }
     onEnterDOM() {
         ResizeHandler.register(this, this._handleResize);
+        attachThemeLoaded(this._handleThemeLoaded);
     }
     onExitDOM() {
         ResizeHandler.deregister(this, this._handleResize);
+        detachThemeLoaded(this._handleThemeLoaded);
+    }
+    onInvalidation(changeInfo) {
+        if ((changeInfo.type === "property" && ["name", "titleText", "subtitleText"].includes(changeInfo.name))
+            || (changeInfo.type === "slot" && ["title", "subtitle", "default"].includes(changeInfo.name))) {
+            this._contentHeightForMedia = {};
+        }
     }
     handleResize() {
-        if (this.design !== IllustrationMessageDesign.Auto) {
-            this._adjustHeightToFitContainer();
-            return;
+        if (this.design === IllustrationMessageDesign.Auto) {
+            this._checkHeightConstraints();
+            this._applyMedia();
         }
-        this._applyMedia();
-        window.requestAnimationFrame(this._adjustHeightToFitContainer.bind(this));
     }
-    _applyMedia(heightChange) {
-        const currOffsetWidth = this.offsetWidth, currOffsetHeight = this.offsetHeight;
-        const design = heightChange ? currOffsetHeight : currOffsetWidth, oBreakpounts = heightChange ? IllustratedMessage_1.BREAKPOINTS_HEIGHT : IllustratedMessage_1.BREAKPOINTS;
-        let newMedia = "";
-        if (design <= oBreakpounts.BASE) {
-            newMedia = IllustratedMessage_1.MEDIA.BASE;
+    /**
+     * Checks if the current height of the component is enough to display the illustration, title, subtitle and actions.
+     * If not, the minimum required height for the current media is stored in the `_contentHeightForMedia` object.
+     * @private
+     */
+    _checkHeightConstraints() {
+        // The `scrollHeight > clientHeight` guard is load-bearing: the cache must be populated ONLY
+        // when the content genuinely overflows the container. When the host container has
+        // `height: auto`, its clientHeight equals the content height and there is by definition no
+        // real constraint — recording that height would falsely poison `_contentHeightForMedia` and
+        // cause spurious downgrades on the next render (e.g. after a width shrink-and-grow).
+        if (this.media && this.scrollHeight > this.clientHeight) { // needs vertical responsiveness
+            const innerEl = this.shadowRoot.querySelector(".ui5-illustrated-message-inner");
+            const innerElHeight = innerEl ? innerEl.scrollHeight : 0;
+            innerElHeight && (this._contentHeightForMedia[this.media] = innerElHeight);
         }
-        else if (design <= oBreakpounts.DOT) {
-            newMedia = IllustratedMessage_1.MEDIA.DOT;
+    }
+    _applyMedia() {
+        const width = this.offsetWidth;
+        let media = "", mediaIndex = -1;
+        if (width <= IllustratedMessage_1.BREAKPOINTS.BASE) {
+            media = IllustratedMessage_1.MEDIA.BASE;
+        }
+        else if (width <= IllustratedMessage_1.BREAKPOINTS.DOT) {
+            media = IllustratedMessage_1.MEDIA.DOT;
         }
-        else if (design <= oBreakpounts.SPOT) {
-            newMedia = IllustratedMessage_1.MEDIA.SPOT;
+        else if (width <= IllustratedMessage_1.BREAKPOINTS.SPOT) {
+            media = IllustratedMessage_1.MEDIA.SPOT;
         }
-        else if (design <= oBreakpounts.DIALOG) {
-            newMedia = IllustratedMessage_1.MEDIA.DIALOG;
+        else if (width <= IllustratedMessage_1.BREAKPOINTS.DIALOG) {
+            media = IllustratedMessage_1.MEDIA.DIALOG;
         }
         else {
-            newMedia = IllustratedMessage_1.MEDIA.SCENE;
+            media = IllustratedMessage_1.MEDIA.SCENE;
         }
-        const lastKnownOffsetWidth = this._lastKnownOffsetWidthForMedia[newMedia], lastKnownOffsetHeight = this._lastKnownOffsetHeightForMedia[newMedia];
-        // prevents infinite resizing, when same width is detected for the same media,
-        // excluding the case in which, the control is placed inside expand/collapse container
-        if (!(lastKnownOffsetWidth && currOffsetWidth === lastKnownOffsetWidth
-            && lastKnownOffsetHeight && currOffsetHeight === lastKnownOffsetHeight)
-            || this._lastKnownOffsetWidthForMedia[this._lastKnownMedia] === 0
-            || this._lastKnownOffsetHeightForMedia[this._lastKnownMedia] === 0) {
-            this.media = newMedia;
-            this._lastKnownOffsetWidthForMedia[newMedia] = currOffsetWidth;
-            this._lastKnownOffsetHeightForMedia[newMedia] = currOffsetHeight;
-            this._lastKnownMedia = newMedia;
+        mediaIndex = Object.values(IllustratedMessage_1.MEDIA).indexOf(media);
+        while (mediaIndex > 0 && this._mediaExceedsContainerHeight(media)) {
+            mediaIndex--;
+            media = Object.values(IllustratedMessage_1.MEDIA)[mediaIndex];
         }
+        this.media = media;
+    }
+    _mediaExceedsContainerHeight(media) {
+        return !!this._contentHeightForMedia[media] && this.clientHeight < this._contentHeightForMedia[media];
     }
     _setSVGAccAttrs() {
         const svg = this.shadowRoot.querySelector(".ui5-illustrated-message-illustration svg");
@@ -265,18 +279,17 @@ let IllustratedMessage = IllustratedMessage_1 = class IllustratedMessage extends
             }
         }
     }
-    _adjustHeightToFitContainer() {
-        const illustrationWrapper = this.shadowRoot.querySelector(".ui5-illustrated-message-illustration"), illustration = illustrationWrapper.querySelector("svg");
-        if (illustration) {
-            illustrationWrapper.classList.toggle("ui5-illustrated-message-illustration-fit-content", false);
-            if (this.getDomRef().scrollHeight > this.getDomRef().offsetHeight) {
-                illustrationWrapper.classList.toggle("ui5-illustrated-message-illustration-fit-content", true);
-                this._applyMedia(true /* height change */);
-            }
-        }
-    }
     onAfterRendering() {
         this._setSVGAccAttrs();
+        if (this.design !== IllustrationMessageDesign.Auto) {
+            return;
+        }
+        const heightMeasurementNeeded = this.media && !(this.media in this._contentHeightForMedia);
+        const mightOverflow = this.scrollHeight > this.clientHeight;
+        if (heightMeasurementNeeded || mightOverflow) {
+            this._checkHeightConstraints();
+            this._applyMedia();
+        }
     }
     /**
      * Modifies the IM styles in accordance to the `size` property's value.

package/dist/IllustratedMessage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"IllustratedMessage.js","sourceRoot":"","sources":["../src/IllustratedMessage.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 i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport type { ResizeObserverCallback } from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport { getIllustrationDataSync, getIllustrationData } from \"@ui5/webcomponents-base/dist/asset-registries/Illustrations.js\";\nimport { getEffectiveAriaLabelText } from \"@ui5/webcomponents-base/dist/util/AccessibilityTextsHelper.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport executeTemplate from \"@ui5/webcomponents-base/dist/renderer/executeTemplate.js\";\nimport type { IButton } from \"@ui5/webcomponents/dist/Button.js\";\nimport IllustrationMessageDesign from \"./types/IllustrationMessageDesign.js\";\nimport IllustrationMessageType from \"./types/IllustrationMessageType.js\";\nimport \"./illustrations/BeforeSearch.js\";\n\n// Styles\nimport IllustratedMessageCss from \"./generated/themes/IllustratedMessage.css.js\";\n\n// Template\nimport IllustratedMessageTemplate from \"./IllustratedMessageTemplate.js\";\n\nconst getEffectiveIllustrationName = (name: string): string => {\n\tif (name.startsWith(\"Tnt\")) {\n\t\treturn name.replace(\"Tnt\", \"tnt/\");\n\t}\n\n\tif (name.includes(\"/\")) {\n\t\treturn name;\n\t}\n\n\treturn `fiori/${name}`;\n};\n\n/*\n @class\n \n ### Overview\n * An IllustratedMessage is a recommended combination of a solution-oriented message, an engaging\n * illustration, and conversational tone to better communicate an empty or a success state than just show\n * a message alone.\n \n Each illustration has default internationalised title and subtitle texts. Also they can be managed with\n * `titleText` and `subtitleText` properties.\n \n To display the desired illustration, use the `name` property, where you can find the list of all available illustrations.\n \n Note: By default the “BeforeSearch” illustration is loaded. To use other illustrations, make sure you import them in addition, for example:\n \n `import \"@ui5/webcomponents-fiori/dist/illustrations/NoData.js\"`\n \n Note: Illustrations starting with the “Tnt” prefix are part of another illustration set. For example to use the “TntSuccess” illustration, add the following import::\n \n `import \"@ui5/webcomponents-fiori/dist/illustrations/tnt/Success.js\"`\n \n ### Structure\n * The IllustratedMessage consists of the following elements, which are displayed below each other in the following order:\n \n - Illustration\n * - Title\n * - Subtitle\n * - Actions\n \n ### Usage\n * `ui5-illustrated-message` is meant to be used inside container component, for example a `ui5-card`,\n * a `ui5-dialog` or a `ui5-page`\n \n ### ES6 Module Import\n \n `import \"@ui5/webcomponents-fiori/dist/IllustratedMessage.js\";`\n * @csspart subtitle - Used to style the subtitle wrapper of the `ui5-illustrated-message`\n * @constructor\n * @extends UI5Element\n * @public\n * @since 1.0.0-rc.15\n /\n\n@customElement({\n\ttag: \"ui5-illustrated-message\",\n\tlanguageAware: true,\n\tthemeAware: true,\n\trenderer: jsxRenderer,\n\tstyles: IllustratedMessageCss,\n\ttemplate: IllustratedMessageTemplate,\n})\nclass IllustratedMessage extends UI5Element {\n\t/\n\t Defines the illustration name that will be displayed in the component.\n\t\n\t Example:\n\t\n\t `name='BeforeSearch'`, `name='UnableToUpload'`, etc..\n\t\n\t Note: To use the TNT illustrations,\n\t* you need to set the `tnt` or `Tnt` prefix in front of the icon's name.\n\t\n\t Example:\n\t\n\t `name='tnt/Avatar'` or `name='TntAvatar'`.\n\t\n\t Note: By default the `BeforeSearch` illustration is loaded.\n\t* When using an illustration type, other than the default, it should be loaded in addition:\n\t\n\t `import \"@ui5/webcomponents-fiori/dist/illustrations/NoData.js\";`\n\t\n\t For TNT illustrations:\n\t\n\t `import \"@ui5/webcomponents-fiori/dist/illustrations/tnt/SessionExpired.js\";`\n\t* @default \"BeforeSearch\"\n\t* @public\n\t/\n\t@property()\n\tname = \"BeforeSearch\";\n\n\t/\n\t Determines which illustration breakpoint variant is used.\n\t\n\t As `IllustratedMessage` adapts itself around the `Illustration`, the other\n\t* elements of the component are displayed differently on the different breakpoints/illustration designs.\n\t* @default \"Auto\"\n\t* @public\n\t* @since 2.0.0\n\t/\n\t@property()\n\tdesign: `${IllustrationMessageDesign}` = \"Auto\";\n\n\t/\n\t Defines the subtitle of the component.\n\t\n\t Note: Using this property, the default subtitle text of illustration will be overwritten.\n\t\n\t Note: Using `subtitle` slot, the default of this property will be overwritten.\n\t* @default undefined\n\t* @public\n\t/\n\t@property()\n\tsubtitleText?: string;\n\n\t/\n\t Defines the title of the component.\n\t\n\t Note: Using this property, the default title text of illustration will be overwritten.\n\t* @default undefined\n\t* @public\n\t/\n\t@property()\n\ttitleText?: string;\n\n\t/\n\t Receives id(or many ids) of the elements that label the component.\n\t* @default undefined\n\t* @public\n\t* @since 1.7.0\n\t/\n\t@property()\n\taccessibleNameRef?: string;\n\n\t/\n\t Illustration breakpoint variant for the <code>Dot</code> design.\n\t\n\t @private\n\t* @since 1.24.0\n\t/\n\t@property({ noAttribute: true })\n\tdotSvg?: string;\n\n\t/\n\t Illustration breakpoint variant for the <code>Spot</code> design.\n\t\n\t @private\n\t* @since 1.9.0\n\t/\n\t@property({ noAttribute: true })\n\tspotSvg?: string;\n\n\t/\n\t Illustration breakpoint variant for the `Scene` design.\n\t* @private\n\t* @since 1.9.0\n\t/\n\t@property({ noAttribute: true })\n\tsceneSvg?: string;\n\n\t/\n\t Illustration breakpoint variant for the `Dialog` design.\n\t* @private\n\t* @since 1.9.0\n\t/\n\t@property({ noAttribute: true })\n\tdialogSvg?: string;\n\n\t/\n\t Template function for the Dot design (safe variant).\n\t* @private\n\t* @since 2.16.0\n\t/\n\t@property({ noAttribute: true })\n\tdotTemplate?: object;\n\n\t/\n\t Template function for the Spot design (safe variant).\n\t* @private\n\t* @since 2.16.0\n\t/\n\t@property({ noAttribute: true })\n\tspotTemplate?: object;\n\n\t/\n\t Template function for the Scene design (safe variant).\n\t* @private\n\t* @since 2.16.0\n\t/\n\t@property({ noAttribute: true })\n\tsceneTemplate?: object;\n\n\t/\n\t Template function for the Dialog design (safe variant).\n\t* @private\n\t* @since 2.16.0\n\t/\n\t@property({ noAttribute: true })\n\tdialogTemplate?: object;\n\n\t/\n\t Determinates what is the current media of the component based on its width.\n\t* @private\n\t/\n\t@property()\n\tmedia?: string;\n\n\t/\n \t Defines whether the illustration is decorative.\n\t\n\t When set to `true`, the attributes `role=\"presentation\"` and `aria-hidden=\"true\"` are applied to the SVG element.\n\t* @default false\n\t* @public\n \t* @since 2.10.0\n\t/\n\t@property({ type: Boolean })\n\tdecorative = false;\n\n\t/\n\t Defines the title of the component.\n\t\n\t Note: Using this slot, the default title text of illustration and the value of `title` property will be overwritten.\n\t* @public\n\t* @since 1.7.0\n\t/\n\t@slot({ type: HTMLElement })\n\ttitle!: Slot<HTMLElement> & string;\n\n\t/\n\t Defines the subtitle of the component.\n\t\n\t Note: Using this slot, the default subtitle text of illustration and the value of `subtitleText` property will be overwritten.\n\t* @public\n\t* @since 1.0.0-rc.16\n\t/\n\t@slot({ type: HTMLElement })\n\tsubtitle!: Slot<HTMLElement>;\n\n\t/\n\t Defines the component actions.\n\t\n\t Note: Not displayed when the `design` property is set to `Base`.\n\t* @public\n\t/\n\t@slot({ type: HTMLElement, \"default\": true })\n\tactions!: DefaultSlot<IButton>;\n\n\tillustrationTitle?: string;\n\tillustrationSubtitle?: string;\n\n\t@i18n(\"@ui5/webcomponents-fiori\")\n\tstatic i18nBundle: I18nBundle;\n\t_lastKnownOffsetWidthForMedia: Record<string, number>;\n\t_lastKnownOffsetHeightForMedia: Record<string, number>;\n\t_lastKnownMedia: string;\n\t_handleResize: ResizeObserverCallback;\n\n\tconstructor() {\n\t\tsuper();\n\n\t\tthis._handleResize = this.handleResize.bind(this);\n\t\t// this will store the last known offsetWidth of the IllustratedMessage DOM node for a given media (e.g. \"Spot\")\n\t\tthis._lastKnownOffsetWidthForMedia = {};\n\t\tthis._lastKnownOffsetHeightForMedia = {};\n\t\t// this will store the last known media, in order to detect if IllustratedMessage has been hidden by expand/collapse container\n\t\tthis._lastKnownMedia = \"base\";\n\t}\n\n\tstatic get BREAKPOINTS() {\n\t\treturn {\n\t\t\tDIALOG: 681,\n\t\t\tSPOT: 360,\n\t\t\tDOT: 260,\n\t\t\tBASE: 160,\n\t\t};\n\t}\n\n\tstatic get BREAKPOINTS_HEIGHT() {\n\t\treturn {\n\t\t\tDIALOG: 415,\n\t\t\tSPOT: 284,\n\t\t\tDOT: 207,\n\t\t\tBASE: 61,\n\t\t};\n\t}\n\n\tstatic get MEDIA() {\n\t\treturn {\n\t\t\tBASE: \"base\",\n\t\t\tDOT: \"dot\",\n\t\t\tSPOT: \"spot\",\n\t\t\tDIALOG: \"dialog\",\n\t\t\tSCENE: \"scene\",\n\t\t};\n\t}\n\n\tasync onBeforeRendering() {\n\t\t// Gets the current illustration name given in the \"name\" attribute\n\t\tlet effectiveName = getEffectiveIllustrationName(this.name);\n\t\tlet illustrationData = getIllustrationDataSync(effectiveName);\n\n\t\tif (this.hasAttribute(\"name\") && !this.isValidIllustration(effectiveName)) {\n\t\t\teffectiveName = getEffectiveIllustrationName(IllustrationMessageType.BeforeSearch);\n\t\t\t// eslint-disable-next-line\n\t\t\tconsole.warn(`The illustration \"${effectiveName!}\" does not exist. The default illustration \"${IllustrationMessageType.BeforeSearch}\" is loaded instead.`);\n\t\t}\n\n\t\tif (illustrationData === undefined) {\n\t\t\tillustrationData = await getIllustrationData(effectiveName);\n\t\t}\n\n\t\t// Check if illustration uses templates (safe variant)\n\t\tif (illustrationData && \"dotTemplate\" in illustrationData && illustrationData.dotTemplate) {\n\t\t\tthis.dotTemplate = executeTemplate(illustrationData.dotTemplate, this);\n\t\t}\n\t\tif (illustrationData && \"spotTemplate\" in illustrationData && illustrationData.spotTemplate) {\n\t\t\tthis.spotTemplate = executeTemplate(illustrationData.spotTemplate, this);\n\t\t}\n\t\tif (illustrationData && \"dialogTemplate\" in illustrationData && illustrationData.dialogTemplate) {\n\t\t\tthis.dialogTemplate = executeTemplate(illustrationData.dialogTemplate, this);\n\t\t}\n\t\tif (illustrationData && \"sceneTemplate\" in illustrationData && illustrationData.sceneTemplate) {\n\t\t\tthis.sceneTemplate = executeTemplate(illustrationData.sceneTemplate, this);\n\t\t}\n\n\t\t// Check if illustration uses SVG strings (unsafe variant)\n\t\tif (illustrationData && \"dotSvg\" in illustrationData) {\n\t\t\tthis.dotSvg = illustrationData.dotSvg;\n\t\t}\n\t\tif (illustrationData && \"spotSvg\" in illustrationData) {\n\t\t\tthis.spotSvg = illustrationData.spotSvg;\n\t\t}\n\t\tif (illustrationData && \"dialogSvg\" in illustrationData) {\n\t\t\tthis.dialogSvg = illustrationData.dialogSvg;\n\t\t}\n\t\tif (illustrationData && \"sceneSvg\" in illustrationData) {\n\t\t\tthis.sceneSvg = illustrationData.sceneSvg;\n\t\t}\n\n\t\tthis.illustrationTitle = IllustratedMessage.i18nBundle.getText(illustrationData!.title);\n\t\tthis.illustrationSubtitle = IllustratedMessage.i18nBundle.getText(illustrationData!.subtitle);\n\n\t\tif (this.design !== IllustrationMessageDesign.Auto) {\n\t\t\tthis._handleCustomSize();\n\t\t}\n\t}\n\n\tonEnterDOM() {\n\t\tResizeHandler.register(this, this._handleResize);\n\t}\n\n\tonExitDOM() {\n\t\tResizeHandler.deregister(this, this._handleResize);\n\t}\n\n\thandleResize() {\n\t\tif (this.design !== IllustrationMessageDesign.Auto) {\n\t\t\tthis._adjustHeightToFitContainer();\n\t\t\treturn;\n\t\t}\n\n\t\tthis._applyMedia();\n\t\twindow.requestAnimationFrame(this._adjustHeightToFitContainer.bind(this));\n\t}\n\n\t_applyMedia(heightChange?: boolean) {\n\t\tconst currOffsetWidth = this.offsetWidth,\n\t\t\tcurrOffsetHeight = this.offsetHeight;\n\n\t\tconst design = heightChange ? currOffsetHeight : currOffsetWidth,\n\t\t\toBreakpounts = heightChange ? IllustratedMessage.BREAKPOINTS_HEIGHT : IllustratedMessage.BREAKPOINTS;\n\t\tlet newMedia = \"\";\n\n\t\tif (design <= oBreakpounts.BASE) {\n\t\t\tnewMedia = IllustratedMessage.MEDIA.BASE;\n\t\t} else if (design <= oBreakpounts.DOT) {\n\t\t\tnewMedia = IllustratedMessage.MEDIA.DOT;\n\t\t} else if (design <= oBreakpounts.SPOT) {\n\t\t\tnewMedia = IllustratedMessage.MEDIA.SPOT;\n\t\t} else if (design <= oBreakpounts.DIALOG) {\n\t\t\tnewMedia = IllustratedMessage.MEDIA.DIALOG;\n\t\t} else {\n\t\t\tnewMedia = IllustratedMessage.MEDIA.SCENE;\n\t\t}\n\t\tconst lastKnownOffsetWidth = this._lastKnownOffsetWidthForMedia[newMedia],\n\t\t\tlastKnownOffsetHeight = this._lastKnownOffsetHeightForMedia[newMedia];\n\t\t // prevents infinite resizing, when same width is detected for the same media,\n\t\t // excluding the case in which, the control is placed inside expand/collapse container\n\t\tif (!(lastKnownOffsetWidth && currOffsetWidth === lastKnownOffsetWidth\n\t\t\t&& lastKnownOffsetHeight && currOffsetHeight === lastKnownOffsetHeight)\n\t\t\t\|\| this._lastKnownOffsetWidthForMedia[this._lastKnownMedia] === 0\n\t\t\t\|\| this._lastKnownOffsetHeightForMedia[this._lastKnownMedia] === 0) {\n\t\t\tthis.media = newMedia;\n\t\t\tthis._lastKnownOffsetWidthForMedia[newMedia] = currOffsetWidth;\n\t\t\tthis._lastKnownOffsetHeightForMedia[newMedia] = currOffsetHeight;\n\t\t\tthis._lastKnownMedia = newMedia;\n\t\t}\n\t}\n\n\t_setSVGAccAttrs() {\n\t\tconst svg = this.shadowRoot!.querySelector(\".ui5-illustrated-message-illustration svg\");\n\n\t\tif (!svg) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this.decorative) {\n\t\t\tsvg.setAttribute(\"role\", \"presentation\");\n\t\t\tsvg.setAttribute(\"aria-hidden\", \"true\");\n\t\t\tsvg.removeAttribute(\"aria-label\");\n\t\t} else {\n\t\t\tsvg.removeAttribute(\"role\");\n\t\t\tsvg.removeAttribute(\"aria-hidden\");\n\n\t\t\t// Set aria-label only when not decorative and text exists\n\t\t\tif (this.ariaLabelText) {\n\t\t\t\tsvg.setAttribute(\"aria-label\", this.ariaLabelText);\n\t\t\t} else {\n\t\t\t\tsvg.removeAttribute(\"aria-label\");\n\t\t\t}\n\t\t}\n\t}\n\n\t_adjustHeightToFitContainer() {\n\t\tconst illustrationWrapper = <HTMLElement> this.shadowRoot!.querySelector(\".ui5-illustrated-message-illustration\"),\n\t\t\tillustration = illustrationWrapper.querySelector(\"svg\");\n\n\t\tif (illustration) {\n\t\t\tillustrationWrapper.classList.toggle(\"ui5-illustrated-message-illustration-fit-content\", false);\n\t\t\tif (this.getDomRef()!.scrollHeight > this.getDomRef()!.offsetHeight) {\n\t\t\t\tillustrationWrapper.classList.toggle(\"ui5-illustrated-message-illustration-fit-content\", true);\n\t\t\t\tthis._applyMedia(true / height change /);\n\t\t\t}\n\t\t}\n\t}\n\n\tonAfterRendering() {\n\t\tthis._setSVGAccAttrs();\n\t}\n\n\t/\n\t Modifies the IM styles in accordance to the `size` property's value.\n\t * Note: The resize handler has no effect when size is different than \"Auto\".\n\t * @private\n\t * @since 1.5.0\n\t */\n\t_handleCustomSize() {\n\t\tswitch (this.design) {\n\t\tcase IllustrationMessageDesign.Base:\n\t\t\tthis.media = IllustratedMessage.MEDIA.BASE;\n\t\t\treturn;\n\t\tcase IllustrationMessageDesign.Dot:\n\t\t\tthis.media = IllustratedMessage.MEDIA.DOT;\n\t\t\treturn;\n\t\tcase IllustrationMessageDesign.Spot:\n\t\t\tthis.media = IllustratedMessage.MEDIA.SPOT;\n\t\t\treturn;\n\t\tcase IllustrationMessageDesign.Dialog:\n\t\t\tthis.media = IllustratedMessage.MEDIA.DIALOG;\n\t\t\treturn;\n\t\tcase IllustrationMessageDesign.ExtraSmall:\n\t\t\tthis.media = IllustratedMessage.MEDIA.DOT;\n\t\t\treturn;\n\t\tcase IllustrationMessageDesign.Small:\n\t\t\tthis.media = IllustratedMessage.MEDIA.SPOT;\n\t\t\treturn;\n\t\tcase IllustrationMessageDesign.Medium:\n\t\t\tthis.media = IllustratedMessage.MEDIA.DIALOG;\n\t\t\treturn;\n\t\tdefault:\n\t\t\tthis.media = IllustratedMessage.MEDIA.SCENE;\n\t\t}\n\t}\n\n\tget ariaLabelText(): string \| undefined {\n\t\treturn getEffectiveAriaLabelText(this);\n\t}\n\n\tget effectiveIllustration(): string \| object \| undefined {\n\t\tswitch (this.media) {\n\t\tcase IllustratedMessage.MEDIA.DOT:\n\t\t\treturn this.dotTemplate \|\| this.dotSvg;\n\t\tcase IllustratedMessage.MEDIA.SPOT:\n\t\t\treturn this.spotTemplate \|\| this.spotSvg;\n\t\tcase IllustratedMessage.MEDIA.DIALOG:\n\t\t\treturn this.dialogTemplate \|\| this.dialogSvg;\n\t\tcase IllustratedMessage.MEDIA.SCENE:\n\t\t\treturn this.sceneTemplate \|\| this.sceneSvg;\n\t\tdefault:\n\t\t\treturn \"\";\n\t\t}\n\t}\n\n\tget hasFormattedSubtitle(): boolean {\n\t\treturn !!this.subtitle.length;\n\t}\n\n\tget hasFormattedTitle(): boolean {\n\t\treturn !!this.title.length;\n\t}\n\n\tget effectiveTitleText(): string \| undefined {\n\t\treturn this.titleText ? this.titleText : this.illustrationTitle;\n\t}\n\n\tget effectiveSubitleText(): string \| undefined {\n\t\treturn this.subtitleText ? this.subtitleText : this.illustrationSubtitle;\n\t}\n\n\tget hasTitle(): boolean {\n\t\treturn !!(this.hasFormattedTitle \|\| this.titleText \|\| this.illustrationTitle);\n\t}\n\n\tget hasSubtitle(): boolean {\n\t\treturn !!(this.hasFormattedSubtitle \|\| this.subtitleText \|\| this.illustrationSubtitle);\n\t}\n\n\tget hasActions(): boolean {\n\t\treturn !!this.actions.length && this.media !== IllustratedMessage.MEDIA.BASE;\n\t}\n\n\tisValidIllustration(currentIllustration: string): boolean {\n\t\tcurrentIllustration = currentIllustration.startsWith(\"tnt/\") ? currentIllustration.replace(\"tnt/\", \"Tnt\") : currentIllustration.replace(\"fiori/\", \"\");\n\n\t\treturn currentIllustration in IllustrationMessageType;\n\t}\n}\n\nIllustratedMessage.define();\n\nexport default IllustratedMessage;\n"]}
1	+ {"version":3,"file":"IllustratedMessage.js","sourceRoot":"","sources":["../src/IllustratedMessage.ts"],"names":[],"mappings":"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","sourcesContent":["import UI5Element from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport type { Slot, DefaultSlot, ChangeInfo } from \"@ui5/webcomponents-base/dist/UI5Element.js\";\nimport customElement from \"@ui5/webcomponents-base/dist/decorators/customElement.js\";\nimport property from \"@ui5/webcomponents-base/dist/decorators/property.js\";\nimport slot from \"@ui5/webcomponents-base/dist/decorators/slot-strict.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport ResizeHandler from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport type { ResizeObserverCallback } from \"@ui5/webcomponents-base/dist/delegate/ResizeHandler.js\";\nimport { attachThemeLoaded, detachThemeLoaded } from \"@ui5/webcomponents-base/dist/Theming.js\";\nimport { getIllustrationDataSync, getIllustrationData } from \"@ui5/webcomponents-base/dist/asset-registries/Illustrations.js\";\nimport { getEffectiveAriaLabelText } from \"@ui5/webcomponents-base/dist/util/AccessibilityTextsHelper.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport executeTemplate from \"@ui5/webcomponents-base/dist/renderer/executeTemplate.js\";\nimport type { IButton } from \"@ui5/webcomponents/dist/Button.js\";\nimport IllustrationMessageDesign from \"./types/IllustrationMessageDesign.js\";\nimport IllustrationMessageType from \"./types/IllustrationMessageType.js\";\nimport \"./illustrations/BeforeSearch.js\";\n\n// Styles\nimport IllustratedMessageCss from \"./generated/themes/IllustratedMessage.css.js\";\n\n// Template\nimport IllustratedMessageTemplate from \"./IllustratedMessageTemplate.js\";\n\nconst getEffectiveIllustrationName = (name: string): string => {\n\tif (name.startsWith(\"Tnt\")) {\n\t\treturn name.replace(\"Tnt\", \"tnt/\");\n\t}\n\n\tif (name.includes(\"/\")) {\n\t\treturn name;\n\t}\n\n\treturn `fiori/${name}`;\n};\n\n/*\n @class\n \n ### Overview\n * An IllustratedMessage is a recommended combination of a solution-oriented message, an engaging\n * illustration, and conversational tone to better communicate an empty or a success state than just show\n * a message alone.\n \n Each illustration has default internationalised title and subtitle texts. Also they can be managed with\n * `titleText` and `subtitleText` properties.\n \n To display the desired illustration, use the `name` property, where you can find the list of all available illustrations.\n \n Note: By default the “BeforeSearch” illustration is loaded. To use other illustrations, make sure you import them in addition, for example:\n \n `import \"@ui5/webcomponents-fiori/dist/illustrations/NoData.js\"`\n \n Note: Illustrations starting with the “Tnt” prefix are part of another illustration set. For example to use the “TntSuccess” illustration, add the following import::\n \n `import \"@ui5/webcomponents-fiori/dist/illustrations/tnt/Success.js\"`\n \n ### Structure\n * The IllustratedMessage consists of the following elements, which are displayed below each other in the following order:\n \n - Illustration\n * - Title\n * - Subtitle\n * - Actions\n \n ### Usage\n * `ui5-illustrated-message` is meant to be used inside container component, for example a `ui5-card`,\n * a `ui5-dialog` or a `ui5-page`\n \n ### ES6 Module Import\n \n `import \"@ui5/webcomponents-fiori/dist/IllustratedMessage.js\";`\n * @csspart subtitle - Used to style the subtitle wrapper of the `ui5-illustrated-message`\n * @constructor\n * @extends UI5Element\n * @public\n * @since 1.0.0-rc.15\n /\n\n@customElement({\n\ttag: \"ui5-illustrated-message\",\n\tlanguageAware: true,\n\tthemeAware: true,\n\trenderer: jsxRenderer,\n\tstyles: IllustratedMessageCss,\n\ttemplate: IllustratedMessageTemplate,\n})\nclass IllustratedMessage extends UI5Element {\n\t/\n\t Defines the illustration name that will be displayed in the component.\n\t\n\t Example:\n\t\n\t `name='BeforeSearch'`, `name='UnableToUpload'`, etc..\n\t\n\t Note: To use the TNT illustrations,\n\t* you need to set the `tnt` or `Tnt` prefix in front of the icon's name.\n\t\n\t Example:\n\t\n\t `name='tnt/Avatar'` or `name='TntAvatar'`.\n\t\n\t Note: By default the `BeforeSearch` illustration is loaded.\n\t* When using an illustration type, other than the default, it should be loaded in addition:\n\t\n\t `import \"@ui5/webcomponents-fiori/dist/illustrations/NoData.js\";`\n\t\n\t For TNT illustrations:\n\t\n\t `import \"@ui5/webcomponents-fiori/dist/illustrations/tnt/SessionExpired.js\";`\n\t* @default \"BeforeSearch\"\n\t* @public\n\t/\n\t@property()\n\tname = \"BeforeSearch\";\n\n\t/\n\t Determines which illustration breakpoint variant is used.\n\t\n\t As `IllustratedMessage` adapts itself around the `Illustration`, the other\n\t* elements of the component are displayed differently on the different breakpoints/illustration designs.\n\t* @default \"Auto\"\n\t* @public\n\t* @since 2.0.0\n\t/\n\t@property()\n\tdesign: `${IllustrationMessageDesign}` = \"Auto\";\n\n\t/\n\t Defines the subtitle of the component.\n\t\n\t Note: Using this property, the default subtitle text of illustration will be overwritten.\n\t\n\t Note: Using `subtitle` slot, the default of this property will be overwritten.\n\t* @default undefined\n\t* @public\n\t/\n\t@property()\n\tsubtitleText?: string;\n\n\t/\n\t Defines the title of the component.\n\t\n\t Note: Using this property, the default title text of illustration will be overwritten.\n\t* @default undefined\n\t* @public\n\t/\n\t@property()\n\ttitleText?: string;\n\n\t/\n\t Receives id(or many ids) of the elements that label the component.\n\t* @default undefined\n\t* @public\n\t* @since 1.7.0\n\t/\n\t@property()\n\taccessibleNameRef?: string;\n\n\t/\n\t Illustration breakpoint variant for the <code>Dot</code> design.\n\t\n\t @private\n\t* @since 1.24.0\n\t/\n\t@property({ noAttribute: true })\n\tdotSvg?: string;\n\n\t/\n\t Illustration breakpoint variant for the <code>Spot</code> design.\n\t\n\t @private\n\t* @since 1.9.0\n\t/\n\t@property({ noAttribute: true })\n\tspotSvg?: string;\n\n\t/\n\t Illustration breakpoint variant for the `Scene` design.\n\t* @private\n\t* @since 1.9.0\n\t/\n\t@property({ noAttribute: true })\n\tsceneSvg?: string;\n\n\t/\n\t Illustration breakpoint variant for the `Dialog` design.\n\t* @private\n\t* @since 1.9.0\n\t/\n\t@property({ noAttribute: true })\n\tdialogSvg?: string;\n\n\t/\n\t Template function for the Dot design (safe variant).\n\t* @private\n\t* @since 2.16.0\n\t/\n\t@property({ noAttribute: true })\n\tdotTemplate?: object;\n\n\t/\n\t Template function for the Spot design (safe variant).\n\t* @private\n\t* @since 2.16.0\n\t/\n\t@property({ noAttribute: true })\n\tspotTemplate?: object;\n\n\t/\n\t Template function for the Scene design (safe variant).\n\t* @private\n\t* @since 2.16.0\n\t/\n\t@property({ noAttribute: true })\n\tsceneTemplate?: object;\n\n\t/\n\t Template function for the Dialog design (safe variant).\n\t* @private\n\t* @since 2.16.0\n\t/\n\t@property({ noAttribute: true })\n\tdialogTemplate?: object;\n\n\t/\n\t Determinates what is the current media of the component based on its width.\n\t* @private\n\t/\n\t@property()\n\tmedia?: string;\n\n\t/\n \t Defines whether the illustration is decorative.\n\t\n\t When set to `true`, the attributes `role=\"presentation\"` and `aria-hidden=\"true\"` are applied to the SVG element.\n\t* @default false\n\t* @public\n \t* @since 2.10.0\n\t/\n\t@property({ type: Boolean })\n\tdecorative = false;\n\n\t/\n\t Defines the title of the component.\n\t\n\t Note: Using this slot, the default title text of illustration and the value of `title` property will be overwritten.\n\t* @public\n\t* @since 1.7.0\n\t/\n\t@slot({ type: HTMLElement })\n\ttitle!: Slot<HTMLElement> & string;\n\n\t/\n\t Defines the subtitle of the component.\n\t\n\t Note: Using this slot, the default subtitle text of illustration and the value of `subtitleText` property will be overwritten.\n\t* @public\n\t* @since 1.0.0-rc.16\n\t/\n\t@slot({ type: HTMLElement })\n\tsubtitle!: Slot<HTMLElement>;\n\n\t/\n\t Defines the component actions.\n\t\n\t Note: Not displayed when the `design` property is set to `Base`.\n\t* @public\n\t/\n\t@slot({ type: HTMLElement, \"default\": true })\n\tactions!: DefaultSlot<IButton>;\n\n\tillustrationTitle?: string;\n\tillustrationSubtitle?: string;\n\n\t@i18n(\"@ui5/webcomponents-fiori\")\n\tstatic i18nBundle: I18nBundle;\n\t_contentHeightForMedia: Record<string, number>;\n\t_handleResize: ResizeObserverCallback;\n\t_handleThemeLoaded: () => void;\n\n\tconstructor() {\n\t\tsuper();\n\n\t\tthis._handleResize = this.handleResize.bind(this);\n\t\tthis._handleThemeLoaded = () => {\n\t\t\t// Cached content-height are theme-dependent, so clear them when the theme changes.\n\t\t\t// This hook is needed because `onInvalidation` does not fire when the theme changes\n\t\t\tthis._contentHeightForMedia = {};\n\t\t};\n\t\t// this will store the height of the inner content of the IllustratedMessage (illustration + title + subtitle + actions) for a given media (e.g. \"Spot\")\n\t\tthis._contentHeightForMedia = {};\n\t}\n\n\tstatic get BREAKPOINTS() {\n\t\treturn {\n\t\t\tDIALOG: 681,\n\t\t\tSPOT: 360,\n\t\t\tDOT: 260,\n\t\t\tBASE: 160,\n\t\t};\n\t}\n\n\tstatic get MEDIA() {\n\t\treturn {\n\t\t\tBASE: \"base\",\n\t\t\tDOT: \"dot\",\n\t\t\tSPOT: \"spot\",\n\t\t\tDIALOG: \"dialog\",\n\t\t\tSCENE: \"scene\",\n\t\t};\n\t}\n\n\tasync onBeforeRendering() {\n\t\t// Gets the current illustration name given in the \"name\" attribute\n\t\tlet effectiveName = getEffectiveIllustrationName(this.name);\n\t\tlet illustrationData = getIllustrationDataSync(effectiveName);\n\n\t\tif (this.hasAttribute(\"name\") && !this.isValidIllustration(effectiveName)) {\n\t\t\teffectiveName = getEffectiveIllustrationName(IllustrationMessageType.BeforeSearch);\n\t\t\t// eslint-disable-next-line\n\t\t\tconsole.warn(`The illustration \"${effectiveName!}\" does not exist. The default illustration \"${IllustrationMessageType.BeforeSearch}\" is loaded instead.`);\n\t\t}\n\n\t\tif (illustrationData === undefined) {\n\t\t\tillustrationData = await getIllustrationData(effectiveName);\n\t\t}\n\n\t\t// Check if illustration uses templates (safe variant)\n\t\tif (illustrationData && \"dotTemplate\" in illustrationData && illustrationData.dotTemplate) {\n\t\t\tthis.dotTemplate = executeTemplate(illustrationData.dotTemplate, this);\n\t\t}\n\t\tif (illustrationData && \"spotTemplate\" in illustrationData && illustrationData.spotTemplate) {\n\t\t\tthis.spotTemplate = executeTemplate(illustrationData.spotTemplate, this);\n\t\t}\n\t\tif (illustrationData && \"dialogTemplate\" in illustrationData && illustrationData.dialogTemplate) {\n\t\t\tthis.dialogTemplate = executeTemplate(illustrationData.dialogTemplate, this);\n\t\t}\n\t\tif (illustrationData && \"sceneTemplate\" in illustrationData && illustrationData.sceneTemplate) {\n\t\t\tthis.sceneTemplate = executeTemplate(illustrationData.sceneTemplate, this);\n\t\t}\n\n\t\t// Check if illustration uses SVG strings (unsafe variant)\n\t\tif (illustrationData && \"dotSvg\" in illustrationData) {\n\t\t\tthis.dotSvg = illustrationData.dotSvg;\n\t\t}\n\t\tif (illustrationData && \"spotSvg\" in illustrationData) {\n\t\t\tthis.spotSvg = illustrationData.spotSvg;\n\t\t}\n\t\tif (illustrationData && \"dialogSvg\" in illustrationData) {\n\t\t\tthis.dialogSvg = illustrationData.dialogSvg;\n\t\t}\n\t\tif (illustrationData && \"sceneSvg\" in illustrationData) {\n\t\t\tthis.sceneSvg = illustrationData.sceneSvg;\n\t\t}\n\n\t\tthis.illustrationTitle = IllustratedMessage.i18nBundle.getText(illustrationData!.title);\n\t\tthis.illustrationSubtitle = IllustratedMessage.i18nBundle.getText(illustrationData!.subtitle);\n\n\t\tif (this.design !== IllustrationMessageDesign.Auto) {\n\t\t\tthis._handleCustomSize();\n\t\t}\n\t}\n\n\tonEnterDOM() {\n\t\tResizeHandler.register(this, this._handleResize);\n\t\tattachThemeLoaded(this._handleThemeLoaded);\n\t}\n\n\tonExitDOM() {\n\t\tResizeHandler.deregister(this, this._handleResize);\n\t\tdetachThemeLoaded(this._handleThemeLoaded);\n\t}\n\n\tonInvalidation(changeInfo: ChangeInfo) {\n\t\tif (\n\t\t\t(changeInfo.type === \"property\" && [\"name\", \"titleText\", \"subtitleText\"].includes(changeInfo.name))\n\t\t\t\|\| (changeInfo.type === \"slot\" && [\"title\", \"subtitle\", \"default\"].includes(changeInfo.name))\n\t\t) {\n\t\t\tthis._contentHeightForMedia = {};\n\t\t}\n\t}\n\n\thandleResize() {\n\t\tif (this.design === IllustrationMessageDesign.Auto) {\n\t\t\tthis._checkHeightConstraints();\n\t\t\tthis._applyMedia();\n\t\t}\n\t}\n\n\t/\n\t Checks if the current height of the component is enough to display the illustration, title, subtitle and actions.\n\t * If not, the minimum required height for the current media is stored in the `_contentHeightForMedia` object.\n\t * @private\n\t /\n\t_checkHeightConstraints() {\n\t\t// The `scrollHeight > clientHeight` guard is load-bearing: the cache must be populated ONLY\n\t\t// when the content genuinely overflows the container. When the host container has\n\t\t// `height: auto`, its clientHeight equals the content height and there is by definition no\n\t\t// real constraint — recording that height would falsely poison `_contentHeightForMedia` and\n\t\t// cause spurious downgrades on the next render (e.g. after a width shrink-and-grow).\n\t\tif (this.media && this.scrollHeight > this.clientHeight) { // needs vertical responsiveness\n\t\t\tconst innerEl = this.shadowRoot!.querySelector<HTMLElement>(\".ui5-illustrated-message-inner\");\n\t\t\tconst innerElHeight = innerEl ? innerEl.scrollHeight : 0;\n\t\t\tinnerElHeight && (this._contentHeightForMedia[this.media] = innerElHeight);\n\t\t}\n\t}\n\n\t_applyMedia() {\n\t\tconst width = this.offsetWidth;\n\t\tlet media = \"\",\n\t\t\tmediaIndex = -1;\n\n\t\tif (width <= IllustratedMessage.BREAKPOINTS.BASE) {\n\t\t\tmedia = IllustratedMessage.MEDIA.BASE;\n\t\t} else if (width <= IllustratedMessage.BREAKPOINTS.DOT) {\n\t\t\tmedia = IllustratedMessage.MEDIA.DOT;\n\t\t} else if (width <= IllustratedMessage.BREAKPOINTS.SPOT) {\n\t\t\tmedia = IllustratedMessage.MEDIA.SPOT;\n\t\t} else if (width <= IllustratedMessage.BREAKPOINTS.DIALOG) {\n\t\t\tmedia = IllustratedMessage.MEDIA.DIALOG;\n\t\t} else {\n\t\t\tmedia = IllustratedMessage.MEDIA.SCENE;\n\t\t}\n\n\t\tmediaIndex = Object.values(IllustratedMessage.MEDIA).indexOf(media);\n\n\t\twhile (mediaIndex > 0 && this._mediaExceedsContainerHeight(media)) {\n\t\t\tmediaIndex--;\n\t\t\tmedia = Object.values(IllustratedMessage.MEDIA)[mediaIndex];\n\t\t}\n\n\t\tthis.media = media;\n\t}\n\n\t_mediaExceedsContainerHeight(media: string): boolean {\n\t\treturn !!this._contentHeightForMedia[media] && this.clientHeight < this._contentHeightForMedia[media];\n\t}\n\n\t_setSVGAccAttrs() {\n\t\tconst svg = this.shadowRoot!.querySelector(\".ui5-illustrated-message-illustration svg\");\n\n\t\tif (!svg) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this.decorative) {\n\t\t\tsvg.setAttribute(\"role\", \"presentation\");\n\t\t\tsvg.setAttribute(\"aria-hidden\", \"true\");\n\t\t\tsvg.removeAttribute(\"aria-label\");\n\t\t} else {\n\t\t\tsvg.removeAttribute(\"role\");\n\t\t\tsvg.removeAttribute(\"aria-hidden\");\n\n\t\t\t// Set aria-label only when not decorative and text exists\n\t\t\tif (this.ariaLabelText) {\n\t\t\t\tsvg.setAttribute(\"aria-label\", this.ariaLabelText);\n\t\t\t} else {\n\t\t\t\tsvg.removeAttribute(\"aria-label\");\n\t\t\t}\n\t\t}\n\t}\n\n\tonAfterRendering() {\n\t\tthis._setSVGAccAttrs();\n\t\tif (this.design !== IllustrationMessageDesign.Auto) {\n\t\t\treturn;\n\t\t}\n\t\tconst heightMeasurementNeeded = this.media && !(this.media in this._contentHeightForMedia);\n\t\tconst mightOverflow = this.scrollHeight > this.clientHeight;\n\t\tif (heightMeasurementNeeded \|\| mightOverflow) {\n\t\t\tthis._checkHeightConstraints();\n\t\t\tthis._applyMedia();\n\t\t}\n\t}\n\n\t/\n\t Modifies the IM styles in accordance to the `size` property's value.\n\t * Note: The resize handler has no effect when size is different than \"Auto\".\n\t * @private\n\t * @since 1.5.0\n\t */\n\t_handleCustomSize() {\n\t\tswitch (this.design) {\n\t\tcase IllustrationMessageDesign.Base:\n\t\t\tthis.media = IllustratedMessage.MEDIA.BASE;\n\t\t\treturn;\n\t\tcase IllustrationMessageDesign.Dot:\n\t\t\tthis.media = IllustratedMessage.MEDIA.DOT;\n\t\t\treturn;\n\t\tcase IllustrationMessageDesign.Spot:\n\t\t\tthis.media = IllustratedMessage.MEDIA.SPOT;\n\t\t\treturn;\n\t\tcase IllustrationMessageDesign.Dialog:\n\t\t\tthis.media = IllustratedMessage.MEDIA.DIALOG;\n\t\t\treturn;\n\t\tcase IllustrationMessageDesign.ExtraSmall:\n\t\t\tthis.media = IllustratedMessage.MEDIA.DOT;\n\t\t\treturn;\n\t\tcase IllustrationMessageDesign.Small:\n\t\t\tthis.media = IllustratedMessage.MEDIA.SPOT;\n\t\t\treturn;\n\t\tcase IllustrationMessageDesign.Medium:\n\t\t\tthis.media = IllustratedMessage.MEDIA.DIALOG;\n\t\t\treturn;\n\t\tdefault:\n\t\t\tthis.media = IllustratedMessage.MEDIA.SCENE;\n\t\t}\n\t}\n\n\tget ariaLabelText(): string \| undefined {\n\t\treturn getEffectiveAriaLabelText(this);\n\t}\n\n\tget effectiveIllustration(): string \| object \| undefined {\n\t\tswitch (this.media) {\n\t\tcase IllustratedMessage.MEDIA.DOT:\n\t\t\treturn this.dotTemplate \|\| this.dotSvg;\n\t\tcase IllustratedMessage.MEDIA.SPOT:\n\t\t\treturn this.spotTemplate \|\| this.spotSvg;\n\t\tcase IllustratedMessage.MEDIA.DIALOG:\n\t\t\treturn this.dialogTemplate \|\| this.dialogSvg;\n\t\tcase IllustratedMessage.MEDIA.SCENE:\n\t\t\treturn this.sceneTemplate \|\| this.sceneSvg;\n\t\tdefault:\n\t\t\treturn \"\";\n\t\t}\n\t}\n\n\tget hasFormattedSubtitle(): boolean {\n\t\treturn !!this.subtitle.length;\n\t}\n\n\tget hasFormattedTitle(): boolean {\n\t\treturn !!this.title.length;\n\t}\n\n\tget effectiveTitleText(): string \| undefined {\n\t\treturn this.titleText ? this.titleText : this.illustrationTitle;\n\t}\n\n\tget effectiveSubitleText(): string \| undefined {\n\t\treturn this.subtitleText ? this.subtitleText : this.illustrationSubtitle;\n\t}\n\n\tget hasTitle(): boolean {\n\t\treturn !!(this.hasFormattedTitle \|\| this.titleText \|\| this.illustrationTitle);\n\t}\n\n\tget hasSubtitle(): boolean {\n\t\treturn !!(this.hasFormattedSubtitle \|\| this.subtitleText \|\| this.illustrationSubtitle);\n\t}\n\n\tget hasActions(): boolean {\n\t\treturn !!this.actions.length && this.media !== IllustratedMessage.MEDIA.BASE;\n\t}\n\n\tisValidIllustration(currentIllustration: string): boolean {\n\t\tcurrentIllustration = currentIllustration.startsWith(\"tnt/\") ? currentIllustration.replace(\"tnt/\", \"Tnt\") : currentIllustration.replace(\"fiori/\", \"\");\n\n\t\treturn currentIllustration in IllustrationMessageType;\n\t}\n}\n\nIllustratedMessage.define();\n\nexport default IllustratedMessage;\n"]}

package/dist/MediaGalleryTemplate.js CHANGED Viewed

@@ -5,6 +5,6 @@ import Button from "@ui5/webcomponents/dist/Button.js";
 export default function MediaGalleryTemplate() {
     return (_jsxs("div", { class: "ui5-media-gallery-root", children: [_jsx("div", { class: "ui5-media-gallery-display-wrapper", children: _jsx("div", { class: "ui5-media-gallery-display", onClick: this._onDisplayAreaClick, children: this._isPhonePlatform
                         ? _jsx(Carousel, { onNavigate: this._onCarouselNavigate, hideNavigationArrows: true, children: this._selectableItems.map(item => _jsx("slot", { name: item._individualSlot })) })
-                        : _jsx(MediaGalleryItem, { _interactive: this.interactiveDisplayArea, _square: this._shouldHaveSquareDisplay, tabIndex: this._mainItemTabIndex }) }) }), this._showThumbnails && _jsx("div", { class: "ui5-media-gallery-thumbnails-wrapper", children: _jsxs("ul", { children: [this._visibleItems.map(item => _jsx("li", { id: item.id, class: "ui5-media-gallery-thumbnail", role: "option", onClick: this._onThumbnailClick, children: _jsx("slot", { name: item._individualSlot }) })), this._showOverflowBtn && _jsx("li", { class: "ui5-media-gallery-overflow", children: _jsxs(Button, { onClick: this._onOverflowBtnClick, children: ["+", this._overflowSize] }) })] }) })] }));
+                        : _jsx(MediaGalleryItem, { _interactive: this.interactiveDisplayArea, _square: this._shouldHaveSquareDisplay, tabIndex: this._mainItemTabIndex }) }) }), this._showThumbnails && _jsx("div", { class: "ui5-media-gallery-thumbnails-wrapper", children: _jsxs("ul", { role: "listbox", children: [this._visibleItems.map(item => _jsx("li", { id: item.id, class: "ui5-media-gallery-thumbnail", role: "option", "aria-checked": item.selected, onClick: this._onThumbnailClick, children: _jsx("slot", { name: item._individualSlot }) })), this._showOverflowBtn && _jsx("li", { class: "ui5-media-gallery-overflow", role: "option", "aria-checked": "false", children: _jsxs(Button, { onClick: this._onOverflowBtnClick, children: ["+", this._overflowSize] }) })] }) })] }));
 }
 //# sourceMappingURL=MediaGalleryTemplate.js.map

package/dist/MediaGalleryTemplate.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MediaGalleryTemplate.js","sourceRoot":"","sources":["../src/MediaGalleryTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,gBAAgB,MAAM,uBAAuB,CAAC;AACrD,OAAO,QAAQ,MAAM,qCAAqC,CAAC;AAC3D,OAAO,MAAM,MAAM,mCAAmC,CAAC;AAEvD,MAAM,CAAC,OAAO,UAAU,oBAAoB;IAC3C,OAAO,CACN,eAAK,KAAK,EAAC,wBAAwB,aAClC,cAAK,KAAK,EAAC,mCAAmC,YAC7C,cAAK,KAAK,EAAC,2BAA2B,EACrC,OAAO,EAAE,IAAI,CAAC,mBAAmB,YAChC,IAAI,CAAC,gBAAgB;wBACrB,CAAC,CAAC,KAAC,QAAQ,IACV,UAAU,EAAE,IAAI,CAAC,mBAAmB,EACpC,oBAAoB,EAAE,IAAI,YAEzB,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CACjC,eAAM,IAAI,EAAE,IAAI,CAAC,eAAe,GAAS,CACzC,GACS;wBACX,CAAC,CAAC,KAAC,gBAAgB,IAClB,YAAY,EAAE,IAAI,CAAC,sBAAsB,EACzC,OAAO,EAAE,IAAI,CAAC,wBAAwB,EACtC,QAAQ,EAAE,IAAI,CAAC,iBAAiB,GACb,GAEhB,GACD,EAEL,IAAI,CAAC,eAAe,IAAI,cAAK,KAAK,EAAC,sCAAsC,YACzE,~~yBACE~~,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAC9B,aAAI,EAAE,EAAE,IAAI,CAAC,EAAE,EACd,KAAK,EAAC,6BAA6B,EACnC,IAAI,EAAC,QAAQ,~~EACb~~,OAAO,EAAE,IAAI,CAAC,iBAAiB,YAE/B,eAAM,IAAI,EAAE,IAAI,CAAC,eAAe,GAAS,GACrC,CACL,EACA,IAAI,CAAC,gBAAgB,IAAI,aAAI,KAAK,EAAC,4BAA4B,~~YAC~~/D,MAAC,MAAM,IAAC,OAAO,EAAE,IAAI,CAAC,mBAAmB,kBACtC,IAAI,CAAC,aAAa,IACZ,GACL,IACD,GACA,IACD,CACN,CAAC;AACH,CAAC","sourcesContent":["import type MediaGallery from \"./MediaGallery.js\";\nimport MediaGalleryItem from \"./MediaGalleryItem.js\";\nimport Carousel from \"@ui5/webcomponents/dist/Carousel.js\";\nimport Button from \"@ui5/webcomponents/dist/Button.js\";\n\nexport default function MediaGalleryTemplate(this: MediaGallery) {\n\treturn (\n\t\t<div class=\"ui5-media-gallery-root\">\n\t\t\t<div class=\"ui5-media-gallery-display-wrapper\">\n\t\t\t\t<div class=\"ui5-media-gallery-display\"\n\t\t\t\t\tonClick={this._onDisplayAreaClick}>\n\t\t\t\t\t{this._isPhonePlatform\n\t\t\t\t\t\t? <Carousel\n\t\t\t\t\t\t\tonNavigate={this._onCarouselNavigate}\n\t\t\t\t\t\t\thideNavigationArrows={true}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{this._selectableItems.map(item =>\n\t\t\t\t\t\t\t\t<slot name={item._individualSlot}></slot>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</Carousel>\n\t\t\t\t\t\t: <MediaGalleryItem\n\t\t\t\t\t\t\t_interactive={this.interactiveDisplayArea}\n\t\t\t\t\t\t\t_square={this._shouldHaveSquareDisplay}\n\t\t\t\t\t\t\ttabIndex={this._mainItemTabIndex}\n\t\t\t\t\t\t></MediaGalleryItem>\n\t\t\t\t\t}\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t{this._showThumbnails && <div class=\"ui5-media-gallery-thumbnails-wrapper\">\n\t\t\t\t<ul>\n\t\t\t\t\t{this._visibleItems.map(item =>\n\t\t\t\t\t\t<li id={item.id}\n\t\t\t\t\t\t\tclass=\"ui5-media-gallery-thumbnail\"\n\t\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\t\tonClick={this._onThumbnailClick}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<slot name={item._individualSlot}></slot>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t)}\n\t\t\t\t\t{this._showOverflowBtn && <li class=\"ui5-media-gallery-overflow\">\n\t\t\t\t\t\t<Button onClick={this._onOverflowBtnClick}>\n\t\t\t\t\t\t\t+{this._overflowSize}\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</li>}\n\t\t\t\t</ul>\n\t\t\t</div>}\n\t\t</div>\n\t);\n}\n"]}
1	+ {"version":3,"file":"MediaGalleryTemplate.js","sourceRoot":"","sources":["../src/MediaGalleryTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,gBAAgB,MAAM,uBAAuB,CAAC;AACrD,OAAO,QAAQ,MAAM,qCAAqC,CAAC;AAC3D,OAAO,MAAM,MAAM,mCAAmC,CAAC;AAEvD,MAAM,CAAC,OAAO,UAAU,oBAAoB;IAC3C,OAAO,CACN,eAAK,KAAK,EAAC,wBAAwB,aAClC,cAAK,KAAK,EAAC,mCAAmC,YAC7C,cAAK,KAAK,EAAC,2BAA2B,EACrC,OAAO,EAAE,IAAI,CAAC,mBAAmB,YAChC,IAAI,CAAC,gBAAgB;wBACrB,CAAC,CAAC,KAAC,QAAQ,IACV,UAAU,EAAE,IAAI,CAAC,mBAAmB,EACpC,oBAAoB,EAAE,IAAI,YAEzB,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CACjC,eAAM,IAAI,EAAE,IAAI,CAAC,eAAe,GAAS,CACzC,GACS;wBACX,CAAC,CAAC,KAAC,gBAAgB,IAClB,YAAY,EAAE,IAAI,CAAC,sBAAsB,EACzC,OAAO,EAAE,IAAI,CAAC,wBAAwB,EACtC,QAAQ,EAAE,IAAI,CAAC,iBAAiB,GACb,GAEhB,GACD,EAEL,IAAI,CAAC,eAAe,IAAI,cAAK,KAAK,EAAC,sCAAsC,YACzE,cAAI,IAAI,EAAC,SAAS,aAChB,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAC9B,aAAI,EAAE,EAAE,IAAI,CAAC,EAAE,EACd,KAAK,EAAC,6BAA6B,EACnC,IAAI,EAAC,QAAQ,kBACC,IAAI,CAAC,QAAQ,EAC3B,OAAO,EAAE,IAAI,CAAC,iBAAiB,YAE/B,eAAM,IAAI,EAAE,IAAI,CAAC,eAAe,GAAS,GACrC,CACL,EACA,IAAI,CAAC,gBAAgB,IAAI,aAAI,KAAK,EAAC,4BAA4B,EAC/D,IAAI,EAAC,QAAQ,kBACA,OAAO,YAEpB,MAAC,MAAM,IAAC,OAAO,EAAE,IAAI,CAAC,mBAAmB,kBACtC,IAAI,CAAC,aAAa,IACZ,GACL,IACD,GACA,IACD,CACN,CAAC;AACH,CAAC","sourcesContent":["import type MediaGallery from \"./MediaGallery.js\";\nimport MediaGalleryItem from \"./MediaGalleryItem.js\";\nimport Carousel from \"@ui5/webcomponents/dist/Carousel.js\";\nimport Button from \"@ui5/webcomponents/dist/Button.js\";\n\nexport default function MediaGalleryTemplate(this: MediaGallery) {\n\treturn (\n\t\t<div class=\"ui5-media-gallery-root\">\n\t\t\t<div class=\"ui5-media-gallery-display-wrapper\">\n\t\t\t\t<div class=\"ui5-media-gallery-display\"\n\t\t\t\t\tonClick={this._onDisplayAreaClick}>\n\t\t\t\t\t{this._isPhonePlatform\n\t\t\t\t\t\t? <Carousel\n\t\t\t\t\t\t\tonNavigate={this._onCarouselNavigate}\n\t\t\t\t\t\t\thideNavigationArrows={true}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{this._selectableItems.map(item =>\n\t\t\t\t\t\t\t\t<slot name={item._individualSlot}></slot>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</Carousel>\n\t\t\t\t\t\t: <MediaGalleryItem\n\t\t\t\t\t\t\t_interactive={this.interactiveDisplayArea}\n\t\t\t\t\t\t\t_square={this._shouldHaveSquareDisplay}\n\t\t\t\t\t\t\ttabIndex={this._mainItemTabIndex}\n\t\t\t\t\t\t></MediaGalleryItem>\n\t\t\t\t\t}\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t{this._showThumbnails && <div class=\"ui5-media-gallery-thumbnails-wrapper\">\n\t\t\t\t<ul role=\"listbox\">\n\t\t\t\t\t{this._visibleItems.map(item =>\n\t\t\t\t\t\t<li id={item.id}\n\t\t\t\t\t\t\tclass=\"ui5-media-gallery-thumbnail\"\n\t\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\t\taria-checked={item.selected}\n\t\t\t\t\t\t\tonClick={this._onThumbnailClick}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<slot name={item._individualSlot}></slot>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t)}\n\t\t\t\t\t{this._showOverflowBtn && <li class=\"ui5-media-gallery-overflow\"\n\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\taria-checked=\"false\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<Button onClick={this._onOverflowBtnClick}>\n\t\t\t\t\t\t\t+{this._overflowSize}\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</li>}\n\t\t\t\t</ul>\n\t\t\t</div>}\n\t\t</div>\n\t);\n}\n"]}

package/dist/ShellBar.js CHANGED Viewed

@@ -463,6 +463,7 @@ let ShellBar = ShellBar_1 = class ShellBar extends UI5Element {
             getSearchState: () => this.enabledFeatures.search && this.showSearchField,
             getCSSVariable: (cssVar) => this.getCSSVariable(cssVar),
             setSearchState: (expanded) => this.setSearchState(expanded),
+            handleSearchButtonClick: () => this.handleSearchButtonClick(),
             getOverflowed: () => this.overflow.isOverflowing(this.overflowOuter, this.overflowInner),
         };
     }
@@ -473,7 +474,9 @@ let ShellBar = ShellBar_1 = class ShellBar extends UI5Element {
         return this._searchAdaptorLegacy;
     }
     handleSearchButtonClick() {
-        const searchButton = this.shadowRoot.querySelector(".ui5-shellbar-search-button");
+        const searchButton = this.isSelfCollapsibleSearch
+            ? this.search?.shadowRoot?.querySelector(".ui5-shell-search-field-button") ?? null
+            : this.shadowRoot.querySelector(".ui5-shellbar-search-button");
         const defaultPrevented = !this.fireDecoratorEvent("search-button-click", {
             targetRef: searchButton,
             searchFieldVisible: this.showSearchField,
@@ -686,6 +689,9 @@ let ShellBar = ShellBar_1 = class ShellBar extends UI5Element {
      */
     async getSearchButtonDomRef() {
         await renderFinished();
+        if (this.isSelfCollapsibleSearch) {
+            return this.search.getSearchButtonDomRef();
+        }
         return this.shadowRoot.querySelector(`*[data-ui5-stable="toggle-search"]`);
     }
     _fireClickEvent(eventName, domRef) {