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

package/dist/UserSettingsDialog.js

@@ -14,7 +14,7 @@ import MediaRange from "@ui5/webcomponents-base/dist/MediaRange.js";
 import UserSettingsDialogTemplate from "./UserSettingsDialogTemplate.js";
 import UserSettingsDialogCss from "./generated/themes/UserSettingsDialog.css.js";
 // Texts
-import { USER_SETTINGS_DIALOG_ACCESSIBLE_NAME, USER_SETTINGS_LIST_ARIA_ROLE_DESC, USER_SETTINGS_DIALOG_CLOSE_BUTTON_TEXT, USER_SETTINGS_DIALOG_NO_SEARCH_RESULTS_TEXT, } from "./generated/i18n/i18n-defaults.js";
+import { USER_SETTINGS_DIALOG_ACCESSIBLE_NAME, USER_SETTINGS_LIST_ARIA_ROLE_DESC, USER_SETTINGS_DIALOG_CLOSE_BUTTON_TEXT, USER_SETTINGS_DIALOG_SAVE_BUTTON_TEXT, USER_SETTINGS_DIALOG_CANCEL_BUTTON_TEXT, USER_SETTINGS_DIALOG_NO_SEARCH_RESULTS_TEXT, } from "./generated/i18n/i18n-defaults.js";
 /**
  * @class
  * ### Overview
@@ -48,6 +48,18 @@ let UserSettingsDialog = UserSettingsDialog_1 = class UserSettingsDialog extends
          * @public
          */
         this.showSearchField = false;
+        /**
+         * Defines whether the dialog offers Save and Cancel actions in its footer.
+         *
+         * When true, the footer renders a Save (Emphasized) and a Cancel button
+         * instead of the default Close button. Save and Cancel each fire a
+         * corresponding event; the application is responsible for closing the
+         * dialog (typically after persisting or discarding the changes).
+         *
+         * @default false
+         * @public
+         */
+        this.saveMode = false;
         /**
          * @private
          */
@@ -156,6 +168,12 @@ let UserSettingsDialog = UserSettingsDialog_1 = class UserSettingsDialog extends
     get closeButtonText() {
         return UserSettingsDialog_1.i18nBundle.getText(USER_SETTINGS_DIALOG_CLOSE_BUTTON_TEXT);
     }
+    get saveButtonText() {
+        return UserSettingsDialog_1.i18nBundle.getText(USER_SETTINGS_DIALOG_SAVE_BUTTON_TEXT);
+    }
+    get cancelButtonText() {
+        return UserSettingsDialog_1.i18nBundle.getText(USER_SETTINGS_DIALOG_CANCEL_BUTTON_TEXT);
+    }
     get noSearchResultsText() {
         return UserSettingsDialog_1.i18nBundle.getText(USER_SETTINGS_DIALOG_NO_SEARCH_RESULTS_TEXT);
     }
@@ -171,6 +189,12 @@ let UserSettingsDialog = UserSettingsDialog_1 = class UserSettingsDialog extends
             this.open = false;
         }
     }
+    _handleSaveButtonClick() {
+        this.fireDecoratorEvent("save");
+    }
+    _handleCancelButtonClick() {
+        this.fireDecoratorEvent("cancel");
+    }
     _handleCollapseClick() {
         this._collapsed = false;
     }
@@ -192,6 +216,9 @@ __decorate([
 __decorate([
     property({ type: Boolean })
 ], UserSettingsDialog.prototype, "showSearchField", void 0);
+__decorate([
+    property({ type: Boolean })
+], UserSettingsDialog.prototype, "saveMode", void 0);
 __decorate([
     slot({
         "default": true,
@@ -248,13 +275,16 @@ UserSettingsDialog = UserSettingsDialog_1 = __decorate([
         cancelable: true,
     })
     /**
-     * Fired when a settings dialog is open.
+     * Fired when the settings dialog is opened.
      * @public
      */
     ,
     event("open")
     /**
      * Fired before the settings dialog is closed.
+     *
+     * **Note:** This event is cancelable via `preventDefault()`, allowing the application to keep the
+     * dialog open — for example, to prompt the user about unsaved changes before dismissal.
      * @public
      */
     ,
@@ -262,11 +292,27 @@ UserSettingsDialog = UserSettingsDialog_1 = __decorate([
         cancelable: true,
     })
     /**
-     * Fired when a settings dialog is closed.
+     * Fired when the settings dialog is closed.
      * @public
      */
     ,
     event("close")
+    /**
+     * Fired when the Save button in the footer is clicked.
+     * The dialog does not close automatically — the application is responsible
+     * for closing it after persisting the changes.
+     * @public
+     */
+    ,
+    event("save")
+    /**
+     * Fired when the Cancel button in the footer is clicked.
+     * The dialog does not close automatically — the application is responsible
+     * for closing it after discarding the changes.
+     * @public
+     */
+    ,
+    event("cancel")
 ], UserSettingsDialog);
 UserSettingsDialog.define();
 export default UserSettingsDialog;

package/dist/UserSettingsDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"UserSettingsDialog.js","sourceRoot":"","sources":["../src/UserSettingsDialog.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 {\n\tcustomElement, property, slotStrict as slot, eventStrict as event,\n} from \"@ui5/webcomponents-base/dist/decorators.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport type Input from \"@ui5/webcomponents/dist/Input.js\";\nimport type { InputEventDetail } from \"@ui5/webcomponents/dist/Input.js\";\nimport type { ListItemClickEventDetail } from \"@ui5/webcomponents/dist/List.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type ListItemBase from \"@ui5/webcomponents/dist/ListItemBase.js\";\nimport type { PopupBeforeCloseEventDetail } from \"@ui5/webcomponents/dist/Popup.js\";\nimport { isPhone, isTablet, isCombi } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport MediaRange from \"@ui5/webcomponents-base/dist/MediaRange.js\";\nimport UserSettingsDialogTemplate from \"./UserSettingsDialogTemplate.js\";\nimport type UserSettingsItem from \"./UserSettingsItem.js\";\nimport UserSettingsDialogCss from \"./generated/themes/UserSettingsDialog.css.js\";\n\n// Texts\nimport {\n\tUSER_SETTINGS_DIALOG_ACCESSIBLE_NAME,\n\tUSER_SETTINGS_LIST_ARIA_ROLE_DESC,\n\tUSER_SETTINGS_DIALOG_CLOSE_BUTTON_TEXT,\n\tUSER_SETTINGS_DIALOG_NO_SEARCH_RESULTS_TEXT,\n} from \"./generated/i18n/i18n-defaults.js\";\n\ntype UserSettingsItemSelectEventDetail = {\n\titem: UserSettingsItem;\n}\n\ntype UserSettingsBeforeCloseEventDetail = PopupBeforeCloseEventDetail;\n\n/**\n * @class\n * ### Overview\n *\n * The `ui5-user-settings-dialog` is an SAP Fiori-specific web component used in the `ui5-user-menu`.\n * It allows the user to easily view information and settings for an account.\n *\n * ### ES6 Module Import\n * `import \"@ui5/webcomponents-fiori/dist/UserSettingsDialog.js\";`\n *\n * @constructor\n * @extends UI5Element\n * @public\n * @since 2.8.0\n */\n@customElement({\n\ttag: \"ui5-user-settings-dialog\",\n\trenderer: jsxRenderer,\n\ttemplate: UserSettingsDialogTemplate,\n\tstyles: [UserSettingsDialogCss],\n})\n\n/**\n * Fired when an item is selected.\n * @param {UserSettingsItem} item The selected `user settings item`.\n * @public\n */\n@event(\"selection-change\", {\n\tcancelable: true,\n})\n\n/**\n * Fired when a settings dialog is open.\n * @public\n */\n@event(\"open\")\n\n/**\n * Fired before the settings dialog is closed.\n * @public\n */\n@event(\"before-close\", {\n\tcancelable: true,\n})\n\n/**\n * Fired when a settings dialog is closed.\n * @public\n */\n@event(\"close\")\n\nclass UserSettingsDialog extends UI5Element {\n\teventDetails!: {\n\t\t\"selection-change\": UserSettingsItemSelectEventDetail,\n\t\t\"open\": void,\n\t\t\"before-close\": UserSettingsBeforeCloseEventDetail,\n\t\t\"close\": void,\n\t};\n\t/**\n\t * Defines, if the User Settings Dialog is opened.\n\t *\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\topen = false;\n\n\t/**\n\t * Defines the headerText of the item.\n\t *\n\t * @public\n\t * @default undefined\n\t */\n\t@property({ type: String })\n\theaderText?: string;\n\n\t/**\n\t * Defines if the Search Field would be displayed.\n\t *\n\t * **Note:** By default the Search Field is not displayed.\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tshowSearchField = false;\n\n\t/**\n\t * Defines the user settings items.\n\t *\n\t * **Note:**  If no setting item is set as `selected`, the first one will be selected.\n\t * @public\n\t */\n\t@slot({\n\t\t\"default\": true,\n\t\ttype: HTMLElement,\n\t\tindividualSlots: true,\n\t\tinvalidateOnChildChange: {\n\t\t\tproperties: true,\n\t\t\tslots: true,\n\t\t},\n\t})\n\titems!: DefaultSlot<UserSettingsItem>;\n\n\t/**\n\t * Defines the fixed user settings items.\n\t *\n\t * @public\n\t */\n\t@slot({\n\t\ttype: HTMLElement,\n\t\tindividualSlots: true,\n\t\tinvalidateOnChildChange: {\n\t\t\tproperties: true,\n\t\t\tslots: true,\n\t\t},\n\t})\n\tfixedItems!: Slot<UserSettingsItem>;\n\n\t@i18n(\"@ui5/webcomponents-fiori\")\n\tstatic i18nBundle: I18nBundle;\n\n\t/**\n\t * @private\n\t */\n\t@property({ type: String })\n\t_searchValue = \"\";\n\n\t/**\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\t_collapsed = false;\n\n\t/**\n\t * @private\n\t */\n\t@property({ type: Object })\n\t_selectedSetting?: UserSettingsItem;\n\n\t/**\n\t * @private\n\t */\n\t_filteredItems: Array<UserSettingsItem> = [];\n\n\t/**\n\t * @private\n\t */\n\t_filteredFixedItems: Array<UserSettingsItem> = [];\n\n\t/**\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\t_showNoSearchResult = false;\n\n\t/**\n\t * Defines the current media query size.\n\t * @private\n\t */\n\t@property({ type: String })\n\t_mediaRange?: any;\n\n\tonEnterDOM() {\n\t\tthis.setAttribute(\"data-sap-ui-fastnavgroup-container\", \"true\");\n\t}\n\n\tonBeforeRendering() {\n\t\tthis._mediaRange = MediaRange.getCurrentRange(MediaRange.RANGESETS.RANGE_4STEPS);\n\t\tconst searchValue = this._searchValue.toLowerCase();\n\t\tthis._filteredItems = [];\n\t\tthis._filteredFixedItems = [];\n\t\tconst siblingsWithIcon = this.items.some(item => !!item.icon);\n\t\tthis.items.forEach(item => {\n\t\t\tif (item.text.toLowerCase().includes(searchValue)) {\n\t\t\t\tthis._filteredItems.push(item);\n\t\t\t}\n\n\t\t\tif (item.selected) {\n\t\t\t\tthis._selectedSetting = item;\n\t\t\t}\n\t\t\titem._siblingsWithIcon = siblingsWithIcon;\n\t\t});\n\n\t\tthis.fixedItems.forEach(item => {\n\t\t\tif (item.text.toLowerCase().includes(searchValue)) {\n\t\t\t\tthis._filteredFixedItems.push(item);\n\t\t\t}\n\n\t\t\tif (item.selected) {\n\t\t\t\tthis._selectedSetting = item;\n\t\t\t}\n\t\t});\n\n\t\tif (this._filteredItems.length === 0 && this._filteredFixedItems.length === 0) {\n\t\t\tthis._showNoSearchResult = true;\n\t\t} else {\n\t\t\tthis._showNoSearchResult = false;\n\t\t}\n\n\t\tif (!this._selectedSetting) {\n\t\t\tthis._selectedSetting = this.items[0] || this.fixedItems[0];\n\t\t}\n\n\t\tconst allItems = [...this.items, ...this.fixedItems];\n\t\tallItems.forEach(item => {\n\t\t\tif (item === this._selectedSetting) {\n\t\t\t\titem.setAttribute(\"data-sap-ui-fastnavgroup\", \"true\");\n\t\t\t} else {\n\t\t\t\titem.removeAttribute(\"data-sap-ui-fastnavgroup\");\n\t\t\t}\n\t\t});\n\t}\n\n\t_handleItemClick(e: CustomEvent<ListItemClickEventDetail>) {\n\t\tconst setting = e.detail.item as ListItemBase & { associatedSettingItem: UserSettingsItem };\n\t\tconst settingItem = setting.associatedSettingItem;\n\t\tconst eventPrevented = !this.fireDecoratorEvent(\"selection-change\", {\n\t\t\titem: settingItem,\n\t\t});\n\t\tthis._collapsed = true;\n\n\t\tif (!eventPrevented) {\n\t\t\tthis.items.forEach(item => {\n\t\t\t\titem.selected = false;\n\t\t\t});\n\t\t\tthis.fixedItems.forEach(item => {\n\t\t\t\titem.selected = false;\n\t\t\t});\n\t\t\tsettingItem.selected = true;\n\t\t}\n\t}\n\n\t_handleDialogAfterOpen() {\n\t\tthis.fireDecoratorEvent(\"open\");\n\t}\n\n\t_handleDialogBeforeClose(e: CustomEvent<PopupBeforeCloseEventDetail>) {\n\t\tif (!e.detail.escPressed) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst eventPrevented = !this.fireDecoratorEvent(\"before-close\", e.detail);\n\n\t\tif (eventPrevented) {\n\t\t\te.preventDefault();\n\t\t}\n\t}\n\n\t_handleDialogAfterClose() {\n\t\tthis.open = false;\n\t\tthis.fireDecoratorEvent(\"close\");\n\t}\n\n\tget accessibleNameText() {\n\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_DIALOG_ACCESSIBLE_NAME);\n\t}\n\n\tget ariaRoleDescList() {\n\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_LIST_ARIA_ROLE_DESC);\n\t}\n\n\tget closeButtonText() {\n\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_DIALOG_CLOSE_BUTTON_TEXT);\n\t}\n\tget noSearchResultsText() {\n\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_DIALOG_NO_SEARCH_RESULTS_TEXT);\n\t}\n\n\tget _selectedItemSlotName() {\n\t\treturn this._selectedSetting ? this._selectedSetting._individualSlot : \"\";\n\t}\n\n\tget _showSettingWithNavigation() {\n\t\treturn (isPhone() || (isTablet() && !isCombi())) || (this._mediaRange === \"S\" || this._mediaRange === \"M\");\n\t}\n\n\t_handleCloseButtonClick() {\n\t\tconst eventPrevented = !this.fireDecoratorEvent(\"before-close\", { escPressed: false });\n\n\t\tif (!eventPrevented) {\n\t\t\tthis.open = false;\n\t\t}\n\t}\n\n\t_handleCollapseClick() {\n\t\tthis._collapsed = false;\n\t}\n\n\t_handleInput(e: CustomEvent<InputEventDetail>) {\n\t\tthis._searchValue = (e.target as Input).value;\n\t}\n\n\tcaptureRef(ref: HTMLElement & { associatedSettingItem?: UI5Element} | null) {\n\t\tif (ref) {\n\t\t\tref.associatedSettingItem = this;\n\t\t}\n\t}\n}\n\nUserSettingsDialog.define();\n\nexport default UserSettingsDialog;\nexport type {\n\tUserSettingsItemSelectEventDetail,\n\tUserSettingsBeforeCloseEventDetail,\n};\n"]}
+{"version":3,"file":"UserSettingsDialog.js","sourceRoot":"","sources":["../src/UserSettingsDialog.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 {\n\tcustomElement, property, slotStrict as slot, eventStrict as event,\n} from \"@ui5/webcomponents-base/dist/decorators.js\";\nimport jsxRenderer from \"@ui5/webcomponents-base/dist/renderer/JsxRenderer.js\";\nimport type Input from \"@ui5/webcomponents/dist/Input.js\";\nimport type { InputEventDetail } from \"@ui5/webcomponents/dist/Input.js\";\nimport type { ListItemClickEventDetail } from \"@ui5/webcomponents/dist/List.js\";\nimport i18n from \"@ui5/webcomponents-base/dist/decorators/i18n.js\";\nimport type I18nBundle from \"@ui5/webcomponents-base/dist/i18nBundle.js\";\nimport type ListItemBase from \"@ui5/webcomponents/dist/ListItemBase.js\";\nimport type { PopupBeforeCloseEventDetail } from \"@ui5/webcomponents/dist/Popup.js\";\nimport { isPhone, isTablet, isCombi } from \"@ui5/webcomponents-base/dist/Device.js\";\nimport MediaRange from \"@ui5/webcomponents-base/dist/MediaRange.js\";\nimport UserSettingsDialogTemplate from \"./UserSettingsDialogTemplate.js\";\nimport type UserSettingsItem from \"./UserSettingsItem.js\";\nimport UserSettingsDialogCss from \"./generated/themes/UserSettingsDialog.css.js\";\n\n// Texts\nimport {\n\tUSER_SETTINGS_DIALOG_ACCESSIBLE_NAME,\n\tUSER_SETTINGS_LIST_ARIA_ROLE_DESC,\n\tUSER_SETTINGS_DIALOG_CLOSE_BUTTON_TEXT,\n\tUSER_SETTINGS_DIALOG_SAVE_BUTTON_TEXT,\n\tUSER_SETTINGS_DIALOG_CANCEL_BUTTON_TEXT,\n\tUSER_SETTINGS_DIALOG_NO_SEARCH_RESULTS_TEXT,\n} from \"./generated/i18n/i18n-defaults.js\";\n\ntype UserSettingsItemSelectEventDetail = {\n\titem: UserSettingsItem;\n}\n\ntype UserSettingsBeforeCloseEventDetail = PopupBeforeCloseEventDetail;\n\n/**\n * @class\n * ### Overview\n *\n * The `ui5-user-settings-dialog` is an SAP Fiori-specific web component used in the `ui5-user-menu`.\n * It allows the user to easily view information and settings for an account.\n *\n * ### ES6 Module Import\n * `import \"@ui5/webcomponents-fiori/dist/UserSettingsDialog.js\";`\n *\n * @constructor\n * @extends UI5Element\n * @public\n * @since 2.8.0\n */\n@customElement({\n\ttag: \"ui5-user-settings-dialog\",\n\trenderer: jsxRenderer,\n\ttemplate: UserSettingsDialogTemplate,\n\tstyles: [UserSettingsDialogCss],\n})\n\n/**\n * Fired when an item is selected.\n * @param {UserSettingsItem} item The selected `user settings item`.\n * @public\n */\n@event(\"selection-change\", {\n\tcancelable: true,\n})\n\n/**\n * Fired when the settings dialog is opened.\n * @public\n */\n@event(\"open\")\n\n/**\n * Fired before the settings dialog is closed.\n *\n * **Note:** This event is cancelable via `preventDefault()`, allowing the application to keep the\n * dialog open — for example, to prompt the user about unsaved changes before dismissal.\n * @public\n */\n@event(\"before-close\", {\n\tcancelable: true,\n})\n\n/**\n * Fired when the settings dialog is closed.\n * @public\n */\n@event(\"close\")\n\n/**\n * Fired when the Save button in the footer is clicked.\n * The dialog does not close automatically — the application is responsible\n * for closing it after persisting the changes.\n * @public\n */\n@event(\"save\")\n\n/**\n * Fired when the Cancel button in the footer is clicked.\n * The dialog does not close automatically — the application is responsible\n * for closing it after discarding the changes.\n * @public\n */\n@event(\"cancel\")\n\nclass UserSettingsDialog extends UI5Element {\n\teventDetails!: {\n\t\t\"selection-change\": UserSettingsItemSelectEventDetail,\n\t\t\"open\": void,\n\t\t\"before-close\": UserSettingsBeforeCloseEventDetail,\n\t\t\"close\": void,\n\t\t\"save\": void,\n\t\t\"cancel\": void,\n\t};\n\t/**\n\t * Defines, if the User Settings Dialog is opened.\n\t *\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\topen = false;\n\n\t/**\n\t * Defines the headerText of the item.\n\t *\n\t * @public\n\t * @default undefined\n\t */\n\t@property({ type: String })\n\theaderText?: string;\n\n\t/**\n\t * Defines if the Search Field would be displayed.\n\t *\n\t * **Note:** By default the Search Field is not displayed.\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tshowSearchField = false;\n\n\t/**\n\t * Defines whether the dialog offers Save and Cancel actions in its footer.\n\t *\n\t * When true, the footer renders a Save (Emphasized) and a Cancel button\n\t * instead of the default Close button. Save and Cancel each fire a\n\t * corresponding event; the application is responsible for closing the\n\t * dialog (typically after persisting or discarding the changes).\n\t *\n\t * @default false\n\t * @public\n\t */\n\t@property({ type: Boolean })\n\tsaveMode = false;\n\n\t/**\n\t * Defines the user settings items.\n\t *\n\t * **Note:**  If no setting item is set as `selected`, the first one will be selected.\n\t * @public\n\t */\n\t@slot({\n\t\t\"default\": true,\n\t\ttype: HTMLElement,\n\t\tindividualSlots: true,\n\t\tinvalidateOnChildChange: {\n\t\t\tproperties: true,\n\t\t\tslots: true,\n\t\t},\n\t})\n\titems!: DefaultSlot<UserSettingsItem>;\n\n\t/**\n\t * Defines the fixed user settings items.\n\t *\n\t * @public\n\t */\n\t@slot({\n\t\ttype: HTMLElement,\n\t\tindividualSlots: true,\n\t\tinvalidateOnChildChange: {\n\t\t\tproperties: true,\n\t\t\tslots: true,\n\t\t},\n\t})\n\tfixedItems!: Slot<UserSettingsItem>;\n\n\t@i18n(\"@ui5/webcomponents-fiori\")\n\tstatic i18nBundle: I18nBundle;\n\n\t/**\n\t * @private\n\t */\n\t@property({ type: String })\n\t_searchValue = \"\";\n\n\t/**\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\t_collapsed = false;\n\n\t/**\n\t * @private\n\t */\n\t@property({ type: Object })\n\t_selectedSetting?: UserSettingsItem;\n\n\t/**\n\t * @private\n\t */\n\t_filteredItems: Array<UserSettingsItem> = [];\n\n\t/**\n\t * @private\n\t */\n\t_filteredFixedItems: Array<UserSettingsItem> = [];\n\n\t/**\n\t * @private\n\t */\n\t@property({ type: Boolean })\n\t_showNoSearchResult = false;\n\n\t/**\n\t * Defines the current media query size.\n\t * @private\n\t */\n\t@property({ type: String })\n\t_mediaRange?: any;\n\n\tonEnterDOM() {\n\t\tthis.setAttribute(\"data-sap-ui-fastnavgroup-container\", \"true\");\n\t}\n\n\tonBeforeRendering() {\n\t\tthis._mediaRange = MediaRange.getCurrentRange(MediaRange.RANGESETS.RANGE_4STEPS);\n\t\tconst searchValue = this._searchValue.toLowerCase();\n\t\tthis._filteredItems = [];\n\t\tthis._filteredFixedItems = [];\n\t\tconst siblingsWithIcon = this.items.some(item => !!item.icon);\n\t\tthis.items.forEach(item => {\n\t\t\tif (item.text.toLowerCase().includes(searchValue)) {\n\t\t\t\tthis._filteredItems.push(item);\n\t\t\t}\n\n\t\t\tif (item.selected) {\n\t\t\t\tthis._selectedSetting = item;\n\t\t\t}\n\t\t\titem._siblingsWithIcon = siblingsWithIcon;\n\t\t});\n\n\t\tthis.fixedItems.forEach(item => {\n\t\t\tif (item.text.toLowerCase().includes(searchValue)) {\n\t\t\t\tthis._filteredFixedItems.push(item);\n\t\t\t}\n\n\t\t\tif (item.selected) {\n\t\t\t\tthis._selectedSetting = item;\n\t\t\t}\n\t\t});\n\n\t\tif (this._filteredItems.length === 0 && this._filteredFixedItems.length === 0) {\n\t\t\tthis._showNoSearchResult = true;\n\t\t} else {\n\t\t\tthis._showNoSearchResult = false;\n\t\t}\n\n\t\tif (!this._selectedSetting) {\n\t\t\tthis._selectedSetting = this.items[0] || this.fixedItems[0];\n\t\t}\n\n\t\tconst allItems = [...this.items, ...this.fixedItems];\n\t\tallItems.forEach(item => {\n\t\t\tif (item === this._selectedSetting) {\n\t\t\t\titem.setAttribute(\"data-sap-ui-fastnavgroup\", \"true\");\n\t\t\t} else {\n\t\t\t\titem.removeAttribute(\"data-sap-ui-fastnavgroup\");\n\t\t\t}\n\t\t});\n\t}\n\n\t_handleItemClick(e: CustomEvent<ListItemClickEventDetail>) {\n\t\tconst setting = e.detail.item as ListItemBase & { associatedSettingItem: UserSettingsItem };\n\t\tconst settingItem = setting.associatedSettingItem;\n\t\tconst eventPrevented = !this.fireDecoratorEvent(\"selection-change\", {\n\t\t\titem: settingItem,\n\t\t});\n\t\tthis._collapsed = true;\n\n\t\tif (!eventPrevented) {\n\t\t\tthis.items.forEach(item => {\n\t\t\t\titem.selected = false;\n\t\t\t});\n\t\t\tthis.fixedItems.forEach(item => {\n\t\t\t\titem.selected = false;\n\t\t\t});\n\t\t\tsettingItem.selected = true;\n\t\t}\n\t}\n\n\t_handleDialogAfterOpen() {\n\t\tthis.fireDecoratorEvent(\"open\");\n\t}\n\n\t_handleDialogBeforeClose(e: CustomEvent<PopupBeforeCloseEventDetail>) {\n\t\tif (!e.detail.escPressed) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst eventPrevented = !this.fireDecoratorEvent(\"before-close\", e.detail);\n\n\t\tif (eventPrevented) {\n\t\t\te.preventDefault();\n\t\t}\n\t}\n\n\t_handleDialogAfterClose() {\n\t\tthis.open = false;\n\t\tthis.fireDecoratorEvent(\"close\");\n\t}\n\n\tget accessibleNameText() {\n\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_DIALOG_ACCESSIBLE_NAME);\n\t}\n\n\tget ariaRoleDescList() {\n\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_LIST_ARIA_ROLE_DESC);\n\t}\n\n\tget closeButtonText() {\n\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_DIALOG_CLOSE_BUTTON_TEXT);\n\t}\n\tget saveButtonText() {\n\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_DIALOG_SAVE_BUTTON_TEXT);\n\t}\n\tget cancelButtonText() {\n\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_DIALOG_CANCEL_BUTTON_TEXT);\n\t}\n\tget noSearchResultsText() {\n\t\treturn UserSettingsDialog.i18nBundle.getText(USER_SETTINGS_DIALOG_NO_SEARCH_RESULTS_TEXT);\n\t}\n\n\tget _selectedItemSlotName() {\n\t\treturn this._selectedSetting ? this._selectedSetting._individualSlot : \"\";\n\t}\n\n\tget _showSettingWithNavigation() {\n\t\treturn (isPhone() || (isTablet() && !isCombi())) || (this._mediaRange === \"S\" || this._mediaRange === \"M\");\n\t}\n\n\t_handleCloseButtonClick() {\n\t\tconst eventPrevented = !this.fireDecoratorEvent(\"before-close\", { escPressed: false });\n\n\t\tif (!eventPrevented) {\n\t\t\tthis.open = false;\n\t\t}\n\t}\n\n\t_handleSaveButtonClick() {\n\t\tthis.fireDecoratorEvent(\"save\");\n\t}\n\n\t_handleCancelButtonClick() {\n\t\tthis.fireDecoratorEvent(\"cancel\");\n\t}\n\n\t_handleCollapseClick() {\n\t\tthis._collapsed = false;\n\t}\n\n\t_handleInput(e: CustomEvent<InputEventDetail>) {\n\t\tthis._searchValue = (e.target as Input).value;\n\t}\n\n\tcaptureRef(ref: HTMLElement & { associatedSettingItem?: UI5Element} | null) {\n\t\tif (ref) {\n\t\t\tref.associatedSettingItem = this;\n\t\t}\n\t}\n}\n\nUserSettingsDialog.define();\n\nexport default UserSettingsDialog;\nexport type {\n\tUserSettingsItemSelectEventDetail,\n\tUserSettingsBeforeCloseEventDetail,\n};\n"]}

package/dist/UserSettingsDialogTemplate.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs } from "@ui5/webcomponents-base/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@ui5/webcomponents-base/jsx-runtime";
 import Dialog from "@ui5/webcomponents/dist/Dialog.js";
 import Title from "@ui5/webcomponents/dist/Title.js";
 import Input from "@ui5/webcomponents/dist/Input.js";
@@ -11,11 +11,11 @@ import Toolbar from "@ui5/webcomponents/dist/Toolbar.js";
 import search from "@ui5/webcomponents-icons/dist/search.js";
 export default function UserSettingsDialogTemplate() {
     return (_jsxs(Dialog, { class: "ui5-user-settings-dialog", open: this.open, stretch: true, accessibleName: this.accessibleNameText, "onui5-_collapse": this._handleCollapseClick, onOpen: this._handleDialogAfterOpen, onBeforeClose: this._handleDialogBeforeClose, onClose: this._handleDialogAfterClose, initialFocus: `setting-${this._selectedSetting?._id}`, children: [_jsxs("div", { class: "ui5-user-settings-root", children: [_jsxs("div", { class: "ui5-user-settings-side", "data-sap-ui-fastnavgroup": "true", "aria-orientation": "vertical", "aria-roledescription": this.ariaRoleDescList, children: [_jsxs("div", { class: "ui5-user-settings-side-header", children: [this.headerText &&
-                                        _jsx(Title, { level: "H1", size: "H4", children: this.headerText }), this.showSearchField &&
+                                        _jsx(Title, { level: "H1", size: "H5", children: this.headerText }), this.showSearchField &&
                                         _jsx(Input, { placeholder: "Search", type: "Search", class: "ui5-user-settings-side-search", onInput: this._handleInput, children: _jsx(Icon, { id: "searchFieldIcon", slot: "icon", name: search, showTooltip: true }) })] }), this._showNoSearchResult ?
                                 _jsx("div", { class: "ui5-user-settings-side-search", children: _jsx(Text, { children: this.noSearchResultsText }) })
                                 :
-                                    renderList.call(this, this._filteredItems, "ui5-user-settings-side-items"), this._filteredFixedItems.length > 0 && renderList.call(this, this._filteredFixedItems, "ui5-user-settings-side-fixedItems")] }), _jsx("div", { class: "ui5-user-settings-content", children: _jsx("slot", { name: this._selectedItemSlotName }) })] }), _jsx(Toolbar, { slot: "footer", design: "Transparent", "data-sap-ui-fastnavgroup": "true", children: _jsx(ToolbarButton, { design: "Transparent", text: this.closeButtonText, tooltip: this.closeButtonText, onClick: this._handleCloseButtonClick }) })] }));
+                                    renderList.call(this, this._filteredItems, "ui5-user-settings-side-items"), this._filteredFixedItems.length > 0 && renderList.call(this, this._filteredFixedItems, "ui5-user-settings-side-fixedItems")] }), _jsx("div", { class: "ui5-user-settings-content", children: _jsx("slot", { name: this._selectedItemSlotName }) })] }), _jsx(Toolbar, { slot: "footer", design: "Transparent", "data-sap-ui-fastnavgroup": "true", children: this.saveMode ? (_jsxs(_Fragment, { children: [_jsx(ToolbarButton, { design: "Emphasized", text: this.saveButtonText, onClick: this._handleSaveButtonClick }), _jsx(ToolbarButton, { design: "Transparent", text: this.cancelButtonText, onClick: this._handleCancelButtonClick })] })) : (_jsx(ToolbarButton, { design: "Transparent", text: this.closeButtonText, onClick: this._handleCloseButtonClick })) })] }));
 }
 function renderList(items = [], classes) {
     return _jsx(List, { accessibleRole: "Menu", onItemClick: this._handleItemClick, class: classes, separators: "None", "data-sap-ui-fastnavgroup": "false", children: items.map(item => (_jsx(ListItemStandard, { class: !item._icon && item._siblingsWithIcon ? "ui5-user-settings-item-no-icon" : "", id: `setting-${item._id}`, icon: !item._icon && item._siblingsWithIcon ? undefined : item._icon, tooltip: item._tooltip, ref: this.captureRef.bind(item), selected: item.selected, disabled: item.disabled, accessibleName: item.ariaLabelledByText, type: this._showSettingWithNavigation ? "Navigation" : "Active", children: item.text }))) });

package/dist/UserSettingsDialogTemplate.js.map

@@ -1 +1 @@
-{"version":3,"file":"UserSettingsDialogTemplate.js","sourceRoot":"","sources":["../src/UserSettingsDialogTemplate.tsx"],"names":[],"mappings":"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","sourcesContent":["import type UserSettingsDialog from \"./UserSettingsDialog.js\";\nimport Dialog from \"@ui5/webcomponents/dist/Dialog.js\";\nimport Title from \"@ui5/webcomponents/dist/Title.js\";\nimport Input from \"@ui5/webcomponents/dist/Input.js\";\nimport Text from \"@ui5/webcomponents/dist/Text.js\";\nimport Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport List from \"@ui5/webcomponents/dist/List.js\";\nimport ListItemStandard from \"@ui5/webcomponents/dist/ListItemStandard.js\";\nimport ToolbarButton from \"@ui5/webcomponents/dist/ToolbarButton.js\";\nimport Toolbar from \"@ui5/webcomponents/dist/Toolbar.js\";\nimport search from \"@ui5/webcomponents-icons/dist/search.js\";\nimport type UserSettingsItem from \"./UserSettingsItem.js\";\n\nexport default function UserSettingsDialogTemplate(this: UserSettingsDialog) {\n\treturn (\n\n\t\t<Dialog class=\"ui5-user-settings-dialog\"\n\t\t\topen={this.open}\n\t\t\tstretch\n\t\t\taccessibleName={this.accessibleNameText}\n\t\t\tonui5-_collapse={this._handleCollapseClick}\n\t\t\tonOpen={this._handleDialogAfterOpen}\n\t\t\tonBeforeClose={this._handleDialogBeforeClose}\n\t\t\tonClose={this._handleDialogAfterClose}\n\t\t\tinitialFocus={`setting-${this._selectedSetting?._id}`}\n\t\t>\n\t\t\t<div class=\"ui5-user-settings-root\">\n\t\t\t\t<div class=\"ui5-user-settings-side\" data-sap-ui-fastnavgroup=\"true\" aria-orientation=\"vertical\" aria-roledescription={this.ariaRoleDescList}>\n\t\t\t\t\t<div class=\"ui5-user-settings-side-header\">\n\t\t\t\t\t\t{this.headerText &&\n\t\t\t\t\t\t\t<Title level=\"H1\" size=\"H4\">{this.headerText}</Title>\n\t\t\t\t\t\t}\n\t\t\t\t\t\t{this.showSearchField &&\n\t\t\t\t\t\t\t<Input placeholder=\"Search\" type=\"Search\" class=\"ui5-user-settings-side-search\"\n\t\t\t\t\t\t\t\t   onInput={this._handleInput}>\n\t\t\t\t\t\t\t\t<Icon id=\"searchFieldIcon\" slot=\"icon\" name={search} showTooltip></Icon>\n\t\t\t\t\t\t\t</Input>\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>\n\t\t\t\t\t{this._showNoSearchResult ?\n\t\t\t\t\t\t<div class=\"ui5-user-settings-side-search\">\n\t\t\t\t\t\t\t<Text>{this.noSearchResultsText}</Text>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t:\n\t\t\t\t\t\trenderList.call(this, this._filteredItems, \"ui5-user-settings-side-items\")}\n\n\t\t\t\t\t{this._filteredFixedItems.length > 0 && renderList.call(this, this._filteredFixedItems, \"ui5-user-settings-side-fixedItems\")}\n\t\t\t\t</div>\n\n\t\t\t\t<div class=\"ui5-user-settings-content\">\n\t\t\t\t\t<slot name={this._selectedItemSlotName}></slot>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t<Toolbar slot=\"footer\" design=\"Transparent\" data-sap-ui-fastnavgroup=\"true\">\n\t\t\t\t<ToolbarButton design=\"Transparent\" text={this.closeButtonText} tooltip={this.closeButtonText} onClick={this._handleCloseButtonClick} />\n\t\t\t</Toolbar>\n\t\t</Dialog>\n\t);\n}\n\nfunction renderList(this: UserSettingsDialog, items: Array<UserSettingsItem> = [], classes: string) {\n\treturn <List accessibleRole=\"Menu\" onItemClick={this._handleItemClick} class={classes} separators=\"None\" data-sap-ui-fastnavgroup=\"false\">\n\t\t{items.map(item => (\n\t\t\t<ListItemStandard\n\t\t\t\tclass={!item._icon && item._siblingsWithIcon ? \"ui5-user-settings-item-no-icon\" : \"\"}\n\t\t\t\tid={`setting-${item._id}`}\n\t\t\t\ticon={!item._icon && item._siblingsWithIcon ? undefined : item._icon}\n\t\t\t\ttooltip={item._tooltip}\n\t\t\t\tref={this.captureRef.bind(item)}\n\t\t\t\tselected={item.selected}\n\t\t\t\tdisabled={item.disabled}\n\t\t\t\taccessibleName={item.ariaLabelledByText}\n\t\t\t\ttype={this._showSettingWithNavigation ? \"Navigation\" : \"Active\"}\n\t\t\t>\n\t\t\t\t{item.text}\n\t\t\t</ListItemStandard>\n\t\t))}\n\t</List>;\n}\n"]}
+{"version":3,"file":"UserSettingsDialogTemplate.js","sourceRoot":"","sources":["../src/UserSettingsDialogTemplate.tsx"],"names":[],"mappings":"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","sourcesContent":["import type UserSettingsDialog from \"./UserSettingsDialog.js\";\nimport Dialog from \"@ui5/webcomponents/dist/Dialog.js\";\nimport Title from \"@ui5/webcomponents/dist/Title.js\";\nimport Input from \"@ui5/webcomponents/dist/Input.js\";\nimport Text from \"@ui5/webcomponents/dist/Text.js\";\nimport Icon from \"@ui5/webcomponents/dist/Icon.js\";\nimport List from \"@ui5/webcomponents/dist/List.js\";\nimport ListItemStandard from \"@ui5/webcomponents/dist/ListItemStandard.js\";\nimport ToolbarButton from \"@ui5/webcomponents/dist/ToolbarButton.js\";\nimport Toolbar from \"@ui5/webcomponents/dist/Toolbar.js\";\nimport search from \"@ui5/webcomponents-icons/dist/search.js\";\nimport type UserSettingsItem from \"./UserSettingsItem.js\";\n\nexport default function UserSettingsDialogTemplate(this: UserSettingsDialog) {\n\treturn (\n\n\t\t<Dialog class=\"ui5-user-settings-dialog\"\n\t\t\topen={this.open}\n\t\t\tstretch\n\t\t\taccessibleName={this.accessibleNameText}\n\t\t\tonui5-_collapse={this._handleCollapseClick}\n\t\t\tonOpen={this._handleDialogAfterOpen}\n\t\t\tonBeforeClose={this._handleDialogBeforeClose}\n\t\t\tonClose={this._handleDialogAfterClose}\n\t\t\tinitialFocus={`setting-${this._selectedSetting?._id}`}\n\t\t>\n\t\t\t<div class=\"ui5-user-settings-root\">\n\t\t\t\t<div class=\"ui5-user-settings-side\" data-sap-ui-fastnavgroup=\"true\" aria-orientation=\"vertical\" aria-roledescription={this.ariaRoleDescList}>\n\t\t\t\t\t<div class=\"ui5-user-settings-side-header\">\n\t\t\t\t\t\t{this.headerText &&\n\t\t\t\t\t\t\t<Title level=\"H1\" size=\"H5\">{this.headerText}</Title>\n\t\t\t\t\t\t}\n\t\t\t\t\t\t{this.showSearchField &&\n\t\t\t\t\t\t\t<Input placeholder=\"Search\" type=\"Search\" class=\"ui5-user-settings-side-search\"\n\t\t\t\t\t\t\t\t   onInput={this._handleInput}>\n\t\t\t\t\t\t\t\t<Icon id=\"searchFieldIcon\" slot=\"icon\" name={search} showTooltip></Icon>\n\t\t\t\t\t\t\t</Input>\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>\n\t\t\t\t\t{this._showNoSearchResult ?\n\t\t\t\t\t\t<div class=\"ui5-user-settings-side-search\">\n\t\t\t\t\t\t\t<Text>{this.noSearchResultsText}</Text>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t:\n\t\t\t\t\t\trenderList.call(this, this._filteredItems, \"ui5-user-settings-side-items\")}\n\n\t\t\t\t\t{this._filteredFixedItems.length > 0 && renderList.call(this, this._filteredFixedItems, \"ui5-user-settings-side-fixedItems\")}\n\t\t\t\t</div>\n\n\t\t\t\t<div class=\"ui5-user-settings-content\">\n\t\t\t\t\t<slot name={this._selectedItemSlotName}></slot>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t<Toolbar slot=\"footer\" design=\"Transparent\" data-sap-ui-fastnavgroup=\"true\">\n\t\t\t\t{this.saveMode ? (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<ToolbarButton design=\"Emphasized\" text={this.saveButtonText} onClick={this._handleSaveButtonClick} />\n\t\t\t\t\t\t<ToolbarButton design=\"Transparent\" text={this.cancelButtonText} onClick={this._handleCancelButtonClick} />\n\t\t\t\t\t</>\n\t\t\t\t) : (\n\t\t\t\t\t<ToolbarButton design=\"Transparent\" text={this.closeButtonText} onClick={this._handleCloseButtonClick} />\n\t\t\t\t)}\n\t\t\t</Toolbar>\n\t\t</Dialog>\n\t);\n}\n\nfunction renderList(this: UserSettingsDialog, items: Array<UserSettingsItem> = [], classes: string) {\n\treturn <List accessibleRole=\"Menu\" onItemClick={this._handleItemClick} class={classes} separators=\"None\" data-sap-ui-fastnavgroup=\"false\">\n\t\t{items.map(item => (\n\t\t\t<ListItemStandard\n\t\t\t\tclass={!item._icon && item._siblingsWithIcon ? \"ui5-user-settings-item-no-icon\" : \"\"}\n\t\t\t\tid={`setting-${item._id}`}\n\t\t\t\ticon={!item._icon && item._siblingsWithIcon ? undefined : item._icon}\n\t\t\t\ttooltip={item._tooltip}\n\t\t\t\tref={this.captureRef.bind(item)}\n\t\t\t\tselected={item.selected}\n\t\t\t\tdisabled={item.disabled}\n\t\t\t\taccessibleName={item.ariaLabelledByText}\n\t\t\t\ttype={this._showSettingWithNavigation ? \"Navigation\" : \"Active\"}\n\t\t\t>\n\t\t\t\t{item.text}\n\t\t\t</ListItemStandard>\n\t\t))}\n\t</List>;\n}\n"]}

package/dist/UserSettingsItemTemplate.js

@@ -15,6 +15,6 @@ export default function UserSettingsItemTemplate() {
                     :
                         null });
     const loadingState = _jsx("div", { class: "ui5-user-settings-item-loading-container", children: _jsx(BusyIndicator, { active: this.loading, class: "ui5-user-settings-item-busy", delay: 0, "aria-description": this.loadingReason }) });
-    return (_jsxs("div", { class: "ui5-user-settings-item", children: [_jsx("header", { class: "ui5-user-settings-item-header-container", children: _jsxs("div", { class: "ui5-user-settings-item-header", children: [_jsx(Button, { icon: "nav-back", design: "Transparent", onClick: this._handleBackButtonClick, class: "ui5-user-settings-item-collapse-btn", style: { display: this._shouldShowBackButton ? "block" : "" } }), _jsx(Title, { level: "H2", size: "H4", children: this._hasSelectedPageView ? this._selectedPageView.text : this.headerText })] }) }), this.loading ? loadingState : content] }));
+    return (_jsxs("div", { class: "ui5-user-settings-item", children: [_jsx("header", { class: "ui5-user-settings-item-header-container", children: _jsxs("div", { class: "ui5-user-settings-item-header", children: [_jsx(Button, { icon: "nav-back", design: "Transparent", onClick: this._handleBackButtonClick, class: "ui5-user-settings-item-collapse-btn", style: { display: this._shouldShowBackButton ? "block" : "" } }), _jsx(Title, { level: "H2", size: "H5", children: this._hasSelectedPageView ? this._selectedPageView.text : this.headerText })] }) }), this.loading ? loadingState : content] }));
 }
 //# sourceMappingURL=UserSettingsItemTemplate.js.map

package/dist/UserSettingsItemTemplate.js.map

@@ -1 +1 @@
-{"version":3,"file":"UserSettingsItemTemplate.js","sourceRoot":"","sources":["../src/UserSettingsItemTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,aAAa,MAAM,0CAA0C,CAAC;AACrE,OAAO,MAAM,MAAM,mCAAmC,CAAC;AACvD,OAAO,YAAY,MAAM,yCAAyC,CAAC;AACnE,OAAO,GAAG,MAAM,gCAAgC,CAAC;AACjD,OAAO,KAAK,MAAM,kCAAkC,CAAC;AACrD,OAAO,wCAAwC,CAAC;AAChD,OAAO,2CAA2C,CAAC;AAEnD,MAAM,CAAC,OAAO,UAAU,wBAAwB;IAC/C,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;QACnE,KAAC,YAAY,IAAC,uBAAuB,EAAC,aAAa,EAAC,KAAK,EAAC,6BAA6B,EAAC,WAAW,EAAE,IAAI,CAAC,gBAAgB,YACxH,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CACrB,KAAC,GAAG,IAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,GAAG,EAAE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,YAC7E,eAAM,IAAI,EAAE,IAAI,CAAC,eAAe,GAAI,GAC/B,CACN,GACa;QACf,CAAC;YACD,4BACE,IAAI,CAAC,iBAAiB,CAAC,CAAC;oBACxB,cAAK,KAAK,EAAC,uCAAuC,YACjD,eAAM,IAAI,EAAE,IAAI,CAAC,iBAAiB,CAAC,eAAe,GAAI,GACjD;oBACN,CAAC;wBACD,IAAI,GAEH,CAAC;IAEL,MAAM,YAAY,GAAG,cAAK,KAAK,EAAC,0CAA0C,YACzE,KAAC,aAAa,IACb,MAAM,EAAE,IAAI,CAAC,OAAO,EACpB,KAAK,EAAC,6BAA6B,EACnC,KAAK,EAAE,CAAC,sBACU,IAAI,CAAC,aAAa,GACrB,GACX,CAAC;IAEP,OAAO,CACN,eAAK,KAAK,EAAC,wBAAwB,aAClC,iBAAQ,KAAK,EAAC,yCAAyC,YACtD,eAAK,KAAK,EAAC,+BAA+B,aACzC,KAAC,MAAM,IAAC,IAAI,EAAC,UAAU,EAAC,MAAM,EAAC,aAAa,EAAC,OAAO,EAAE,IAAI,CAAC,sBAAsB,EAAE,KAAK,EAAC,qCAAqC,EAAC,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE,GAAW,EAEvM,KAAC,KAAK,IAAC,KAAK,EAAC,IAAI,EAAC,IAAI,EAAC,IAAI,YAAE,IAAI,CAAC,oBAAoB,CAAC,CAAC,CAAC,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,UAAU,GAAS,IAC1G,GACE,EAER,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,OAAO,IACjC,CACN,CAAC;AACH,CAAC","sourcesContent":["import type UserSettingsItem from \"./UserSettingsItem.js\";\nimport BusyIndicator from \"@ui5/webcomponents/dist/BusyIndicator.js\";\nimport Button from \"@ui5/webcomponents/dist/Button.js\";\nimport TabContainer from \"@ui5/webcomponents/dist/TabContainer.js\";\nimport Tab from \"@ui5/webcomponents/dist/Tab.js\";\nimport Title from \"@ui5/webcomponents/dist/Title.js\";\nimport \"@ui5/webcomponents-icons/dist/globe.js\";\nimport \"@ui5/webcomponents-icons/dist/nav-back.js\";\n\nexport default function UserSettingsItemTemplate(this: UserSettingsItem) {\n\tconst content = this.tabs.length > 0 && !this._hasSelectedPageView ?\n\t\t<TabContainer contentBackgroundDesign=\"Transparent\" class=\"ui5-user-settings-item-tabs\" onTabSelect={this._handleTabSelect}>\n\t\t\t{this.tabs.map(view =>\n\t\t\t\t<Tab text={view.text} selected={view.selected} ref={this.captureRef.bind(view)}>\n\t\t\t\t\t<slot name={view._individualSlot} />\n\t\t\t\t</Tab>\n\t\t\t)}\n\t\t</TabContainer>\n\t\t:\n\t\t<>\n\t\t\t{this._selectedPageView ?\n\t\t\t\t<div class=\"ui5-user-settings-item-view-container\">\n\t\t\t\t\t<slot name={this._selectedPageView._individualSlot} />\n\t\t\t\t</div>\n\t\t\t\t:\n\t\t\t\tnull\n\t\t\t}\n\t\t</>;\n\n\tconst loadingState = <div class=\"ui5-user-settings-item-loading-container\">\n\t\t<BusyIndicator\n\t\t\tactive={this.loading}\n\t\t\tclass=\"ui5-user-settings-item-busy\"\n\t\t\tdelay={0}\n\t\t\taria-description={this.loadingReason}>\n\t\t</BusyIndicator>\n\t</div>;\n\n\treturn (\n\t\t<div class=\"ui5-user-settings-item\">\n\t\t\t<header class=\"ui5-user-settings-item-header-container\">\n\t\t\t\t<div class=\"ui5-user-settings-item-header\">\n\t\t\t\t\t<Button icon=\"nav-back\" design=\"Transparent\" onClick={this._handleBackButtonClick} class=\"ui5-user-settings-item-collapse-btn\" style={{ display: this._shouldShowBackButton ? \"block\" : \"\" }}></Button>\n\n\t\t\t\t\t<Title level=\"H2\" size=\"H4\">{this._hasSelectedPageView ? this._selectedPageView.text : this.headerText}</Title>\n\t\t\t\t</div>\n\t\t\t</header>\n\n\t\t\t{this.loading ? loadingState : content}\n\t\t</div>\n\t);\n}\n"]}
+{"version":3,"file":"UserSettingsItemTemplate.js","sourceRoot":"","sources":["../src/UserSettingsItemTemplate.tsx"],"names":[],"mappings":";AACA,OAAO,aAAa,MAAM,0CAA0C,CAAC;AACrE,OAAO,MAAM,MAAM,mCAAmC,CAAC;AACvD,OAAO,YAAY,MAAM,yCAAyC,CAAC;AACnE,OAAO,GAAG,MAAM,gCAAgC,CAAC;AACjD,OAAO,KAAK,MAAM,kCAAkC,CAAC;AACrD,OAAO,wCAAwC,CAAC;AAChD,OAAO,2CAA2C,CAAC;AAEnD,MAAM,CAAC,OAAO,UAAU,wBAAwB;IAC/C,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;QACnE,KAAC,YAAY,IAAC,uBAAuB,EAAC,aAAa,EAAC,KAAK,EAAC,6BAA6B,EAAC,WAAW,EAAE,IAAI,CAAC,gBAAgB,YACxH,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CACrB,KAAC,GAAG,IAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,GAAG,EAAE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,YAC7E,eAAM,IAAI,EAAE,IAAI,CAAC,eAAe,GAAI,GAC/B,CACN,GACa;QACf,CAAC;YACD,4BACE,IAAI,CAAC,iBAAiB,CAAC,CAAC;oBACxB,cAAK,KAAK,EAAC,uCAAuC,YACjD,eAAM,IAAI,EAAE,IAAI,CAAC,iBAAiB,CAAC,eAAe,GAAI,GACjD;oBACN,CAAC;wBACD,IAAI,GAEH,CAAC;IAEL,MAAM,YAAY,GAAG,cAAK,KAAK,EAAC,0CAA0C,YACzE,KAAC,aAAa,IACb,MAAM,EAAE,IAAI,CAAC,OAAO,EACpB,KAAK,EAAC,6BAA6B,EACnC,KAAK,EAAE,CAAC,sBACU,IAAI,CAAC,aAAa,GACrB,GACX,CAAC;IAEP,OAAO,CACN,eAAK,KAAK,EAAC,wBAAwB,aAClC,iBAAQ,KAAK,EAAC,yCAAyC,YACtD,eAAK,KAAK,EAAC,+BAA+B,aACzC,KAAC,MAAM,IAAC,IAAI,EAAC,UAAU,EAAC,MAAM,EAAC,aAAa,EAAC,OAAO,EAAE,IAAI,CAAC,sBAAsB,EAAE,KAAK,EAAC,qCAAqC,EAAC,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE,GAAW,EAEvM,KAAC,KAAK,IAAC,KAAK,EAAC,IAAI,EAAC,IAAI,EAAC,IAAI,YAAE,IAAI,CAAC,oBAAoB,CAAC,CAAC,CAAC,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,UAAU,GAAS,IAC1G,GACE,EAER,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,OAAO,IACjC,CACN,CAAC;AACH,CAAC","sourcesContent":["import type UserSettingsItem from \"./UserSettingsItem.js\";\nimport BusyIndicator from \"@ui5/webcomponents/dist/BusyIndicator.js\";\nimport Button from \"@ui5/webcomponents/dist/Button.js\";\nimport TabContainer from \"@ui5/webcomponents/dist/TabContainer.js\";\nimport Tab from \"@ui5/webcomponents/dist/Tab.js\";\nimport Title from \"@ui5/webcomponents/dist/Title.js\";\nimport \"@ui5/webcomponents-icons/dist/globe.js\";\nimport \"@ui5/webcomponents-icons/dist/nav-back.js\";\n\nexport default function UserSettingsItemTemplate(this: UserSettingsItem) {\n\tconst content = this.tabs.length > 0 && !this._hasSelectedPageView ?\n\t\t<TabContainer contentBackgroundDesign=\"Transparent\" class=\"ui5-user-settings-item-tabs\" onTabSelect={this._handleTabSelect}>\n\t\t\t{this.tabs.map(view =>\n\t\t\t\t<Tab text={view.text} selected={view.selected} ref={this.captureRef.bind(view)}>\n\t\t\t\t\t<slot name={view._individualSlot} />\n\t\t\t\t</Tab>\n\t\t\t)}\n\t\t</TabContainer>\n\t\t:\n\t\t<>\n\t\t\t{this._selectedPageView ?\n\t\t\t\t<div class=\"ui5-user-settings-item-view-container\">\n\t\t\t\t\t<slot name={this._selectedPageView._individualSlot} />\n\t\t\t\t</div>\n\t\t\t\t:\n\t\t\t\tnull\n\t\t\t}\n\t\t</>;\n\n\tconst loadingState = <div class=\"ui5-user-settings-item-loading-container\">\n\t\t<BusyIndicator\n\t\t\tactive={this.loading}\n\t\t\tclass=\"ui5-user-settings-item-busy\"\n\t\t\tdelay={0}\n\t\t\taria-description={this.loadingReason}>\n\t\t</BusyIndicator>\n\t</div>;\n\n\treturn (\n\t\t<div class=\"ui5-user-settings-item\">\n\t\t\t<header class=\"ui5-user-settings-item-header-container\">\n\t\t\t\t<div class=\"ui5-user-settings-item-header\">\n\t\t\t\t\t<Button icon=\"nav-back\" design=\"Transparent\" onClick={this._handleBackButtonClick} class=\"ui5-user-settings-item-collapse-btn\" style={{ display: this._shouldShowBackButton ? \"block\" : \"\" }}></Button>\n\n\t\t\t\t\t<Title level=\"H2\" size=\"H5\">{this._hasSelectedPageView ? this._selectedPageView.text : this.headerText}</Title>\n\t\t\t\t</div>\n\t\t\t</header>\n\n\t\t\t{this.loading ? loadingState : content}\n\t\t</div>\n\t);\n}\n"]}

package/dist/css/themes/UserSettingsAccountView.css

@@ -1 +1 @@
-.ui5-user-settings-account{display:flex;align-items:center;flex-direction:column}.ui5-user-settings-account-avatar{display:flex;max-width:7rem;max-height:7rem;justify-content:center;align-items:center;gap:.625rem}.ui5-user-settings-account-title{text-align:center;margin-top:.25rem;font-family:var(--sapFontFamily);font-size:var(--sapFontLargeSize);color:var(--sapTextColor)}.ui5-user-settings-account-subtitleText,.ui5-user-settings-account-description{text-align:center;margin-bottom:.25rem;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);color:var(--sapContent_LabelColor);overflow:hidden;text-overflow:ellipsis}.ui5-user-settings-account-btn{display:flex;justify-content:center;align-items:center;gap:.625rem;border-radius:var(--sapButton_BorderCornerRadius);border:var(--sapButton_BorderWidth) solid var(--sapButton_BorderColor);background:var(--sapButton_Background)}.ui5-user-settings-account-btn::part(button){padding:.375rem}
+.ui5-user-settings-account{display:flex;align-items:center;flex-direction:column;margin-top:2.5rem}.ui5-user-settings-account-avatar{display:flex;max-width:7rem;max-height:7rem;justify-content:center;align-items:center;gap:.625rem}.ui5-user-settings-account-title{text-align:center;margin-top:.25rem;margin-bottom:.25rem;font-family:var(--sapFontFamily);font-size:var(--sapFontLargeSize);color:var(--sapTextColor)}.ui5-user-settings-account-subtitleText,.ui5-user-settings-account-description{text-align:center;margin-bottom:.25rem;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);color:var(--sapContent_LabelColor);overflow:hidden;text-overflow:ellipsis}.ui5-user-settings-account-btn{display:flex;justify-content:center;align-items:center;gap:.625rem;border-radius:var(--sapButton_BorderCornerRadius);border:var(--sapButton_BorderWidth) solid var(--sapButton_BorderColor);background:var(--sapButton_Background)}.ui5-user-settings-account-btn::part(button){padding:.375rem}

package/dist/css/themes/UserSettingsAppearanceViewItem.css

@@ -1 +1 @@
-.list-item{display:flex;align-items:center;justify-content:space-between;padding:.625rem 0;width:100%}.item-left{display:flex;align-items:center;gap:.75rem;flex:1}.avatar-cozy{display:var(--_ui5_user_settings_avatar_cozy_display)}.avatar-compact{display:var(--_ui5_user_settings_avatar_compact_display)}.item-texts{display:flex;flex-direction:column}.item-title{font-weight:600;font-size:var(--_ui5_list_item_title_size);color:var(--sapList_TextColor);margin:.5rem}.item-subtitle{color:var(--sapContent_LabelColor);font-size:var(--sapFontSize);margin:.5rem}.item-right{display:flex;align-items:center;gap:.5rem}
+.list-item{display:flex;align-items:center;justify-content:space-between;padding:.625rem 0;width:100%}.item-left{display:flex;align-items:center;gap:.75rem;flex:1}.item-texts{display:flex;flex-direction:column}.item-title{font-family:var(--sapFontFamily);font-size:var(--sapFontLargeSize);font-weight:400;color:var(--sapList_TextColor);margin:.5rem}.item-subtitle{color:var(--sapContent_LabelColor);font-size:var(--sapFontSize);margin:.5rem}.item-right{display:flex;align-items:center;gap:.5rem}

package/dist/css/themes/UserSettingsDialog.css

@@ -1 +1 @@
-.ui5-user-settings-dialog{max-width:calc(100% - 2px);max-height:calc(100% - 2px);width:100%;height:100%}.ui5-user-settings-dialog::part(content){padding:0}.ui5-user-settings-dialog::part(footer){padding:0}.ui5-user-settings-root{display:flex;height:100%}.ui5-user-settings-side{flex:1;box-sizing:border-box;display:flex;flex-direction:column;max-width:100%;overflow:hidden}.ui5-user-settings-side-header{display:flex;flex-direction:column;gap:.5rem;padding:1rem}.ui5-user-settings-side-search{width:100%}.ui5-user-settings-side-items,.ui5-user-settings-side-fixedItems{border-top:.0625rem solid var(--sapList_BorderColor)}.ui5-user-settings-side-items{flex:1;min-height:0}.ui5-user-settings-side-text{align-self:center}.ui5-user-settings-side-fixedItems :last-child{border-bottom:none}.ui5-user-settings-content{display:none;flex:1;background-color:var(--sapGroup_ContentBackground);height:100%;overflow:hidden}.ui5-user-settings-dialog[on-phone]{border-radius:0}.ui5-user-settings-item-no-icon::part(title){padding-left:1.875rem}@media screen and (width >= 37.5rem) and (width < 64rem){.ui5-user-settings-dialog:not([on-phone]){max-width:min(40rem,80%);max-height:min(42.5rem,88%)}}@media screen and (width < 64rem){:host([_collapsed]) .ui5-user-settings-content{display:block}:host([_collapsed]) .ui5-user-settings-side{display:none}}@media screen and (width >= 64rem){.ui5-user-settings-dialog{width:60rem;max-height:min(42.5rem,88%)}.ui5-user-settings-side{max-width:20rem}:dir(ltr) .ui5-user-settings-side{border-right:.0625rem solid var(--sapList_BorderColor)}:dir(rtl) .ui5-user-settings-side{border-left:.0625rem solid var(--sapList_BorderColor)}.ui5-user-settings-content{display:block}}
+.ui5-user-settings-dialog{max-width:calc(100% - 2px);max-height:calc(100% - 2px);width:100%;height:100%}.ui5-user-settings-dialog::part(content){padding:0}.ui5-user-settings-dialog::part(footer){padding:0}.ui5-user-settings-root{display:flex;height:100%}.ui5-user-settings-side{flex:1;box-sizing:border-box;display:flex;flex-direction:column;max-width:100%;overflow:hidden}.ui5-user-settings-side-header{display:flex;flex-direction:column;gap:.5rem;padding:1rem;border-bottom:.0625rem solid var(--sapList_BorderColor)}.ui5-user-settings-side-search{width:100%}.ui5-user-settings-side-items,.ui5-user-settings-side-fixedItems{border-top:0}.ui5-user-settings-side-fixedItems{border-top:.0625rem solid var(--sapList_BorderColor)}.ui5-user-settings-side-items{flex:1;min-height:0}.ui5-user-settings-side-text{align-self:center}.ui5-user-settings-side-fixedItems :last-child{border-bottom:none}.ui5-user-settings-content{display:none;flex:1;background-color:var(--sapGroup_ContentBackground);height:100%;overflow:hidden}.ui5-user-settings-dialog[on-phone]{border-radius:0}.ui5-user-settings-item-no-icon::part(title){padding-left:1.875rem}@media screen and (width >= 37.5rem) and (width < 64rem){.ui5-user-settings-dialog:not([on-phone]){max-width:min(40rem,80%);max-height:min(42.5rem,88%)}}@media screen and (width < 64rem){:host([_collapsed]) .ui5-user-settings-content{display:block}:host([_collapsed]) .ui5-user-settings-side{display:none}}@media screen and (width >= 64rem){.ui5-user-settings-dialog{width:60rem;max-height:min(42.5rem,88%)}.ui5-user-settings-side{max-width:20rem}:dir(ltr) .ui5-user-settings-side{border-right:.0625rem solid var(--sapList_BorderColor)}:dir(rtl) .ui5-user-settings-side{border-left:.0625rem solid var(--sapList_BorderColor)}.ui5-user-settings-content{display:block}}

package/dist/css/themes/UserSettingsItem.css

@@ -1 +1 @@
-.ui5-user-settings-item{height:100%;display:flex;flex-direction:column}.ui5-user-settings-item-header-container{container-type:inline-size}.ui5-user-settings-item-header{display:flex;gap:.5rem;align-items:center;padding:1rem 1rem .5rem;font-size:var(--sapFontHeader5Size);font-family:var(--sapFontBoldFamily)}.ui5-user-settings-item-loading-container{position:relative}.ui5-user-settings-item-view-container,.ui5-user-settings-item-loading-container,.ui5-user-settings-item-tabs{flex:1;min-height:0}.ui5-user-settings-item-tabs::part(content){padding:0;border-bottom:0}.ui5-user-settings-item-view-container{overflow:auto}:host([disabled]){pointer-events:initial;opacity:initial}:host([disabled])::part(content){opacity:var(--_ui5-listitembase_disabled_opacity)}.ui5-user-settings-item-busy{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:42;width:100%;height:100%;display:flex;justify-content:center;align-items:center;pointer-events:all}.ui5-user-settings-item-busy:not([active]){display:none}@media screen and (width >= 64rem){.ui5-user-settings-item-collapse-btn{display:none}}@container (width > 37.5rem){.ui5-user-settings-item-header{padding-inline:2rem}}
+.ui5-user-settings-item{height:100%;display:flex;flex-direction:column}.ui5-user-settings-item-header-container{container-type:inline-size}.ui5-user-settings-item-header{display:flex;gap:.5rem;align-items:center;padding:1rem;font-size:var(--sapFontHeader5Size);font-family:var(--sapFontBoldFamily);border-bottom:.0625rem solid var(--sapList_BorderColor)}.ui5-user-settings-item-loading-container{position:relative}.ui5-user-settings-item-view-container,.ui5-user-settings-item-loading-container,.ui5-user-settings-item-tabs{flex:1;min-height:0}.ui5-user-settings-item-tabs::part(content){padding:0;border-bottom:0}.ui5-user-settings-item-view-container{overflow:auto}:host([disabled]){pointer-events:initial;opacity:initial}:host([disabled])::part(content){opacity:var(--_ui5-listitembase_disabled_opacity)}.ui5-user-settings-item-busy{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:42;width:100%;height:100%;display:flex;justify-content:center;align-items:center;pointer-events:all}.ui5-user-settings-item-busy:not([active]){display:none}@media screen and (width >= 64rem){.ui5-user-settings-item-collapse-btn{display:none}}@container (width > 37.5rem){.ui5-user-settings-item-header{padding-inline:1rem}}

package/dist/css/themes/UserSettingsView.css

@@ -1 +1 @@
-.ui5-user-settings-view-container{container-type:inline-size}.ui5-user-settings-view{padding:1rem}@container (width > 37.5rem){.ui5-user-settings-view{padding-inline:2rem}}.user-settings-appearance-view-list-header{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;box-sizing:border-box;font-size:var(--sapFontHeader4Size);font-family:var(--sapFontFamily);color:var(--sapGroup_TitleTextColor);height:3rem;line-height:3rem;padding:0 1rem;background-color:var(--sapGroup_TitleBackground);border-bottom:1px solid var(--sapGroup_TitleBorderColor)}
+.ui5-user-settings-view-container{container-type:inline-size}.ui5-user-settings-view{padding:1rem}.user-settings-appearance-view-top-header{margin-top:.5rem}.user-settings-appearance-view-top-header::part(title){font-size:var(--sapFontHeader5Size)}

package/dist/css/themes/sap_horizon/parameters-bundle.css

@@ -1,2 +1,2 @@
-:host{--_ui5_banner_background: var(--sapShell_Banner_Background, var(--sapHighlightColor));--_ui5_banner_text_color: var(--sapShell_Banner_TextColor, var(--sapContent_ContrastTextColor));--_ui5_banner_border_radius: var(--sapTile_BorderCornerRadius);--_ui5_banner_box_shadow: var(--sapContent_Shadow0);--_ui5_banner_background_image: var(--sapShell_HeroBanner_BackgroundImage);--_ui5_timeline_scroll_container_offset: .5rem;--_ui5_shellbar_notification_btn_count_offset: .125rem;--_ui5_side_navigation_item_expand_icon_hover_left: auto;--_ui5_side_navigation_item_expand_icon_hover_right: 0;--_ui5_fcl_solid_bg: var(--sapShell_Background);--_ui5_fcl_column_border: solid .0625rem var(--sapGroup_ContentBorderColor);--_ui5_fcl_decoration_top: linear-gradient(to top, var(--sapHighlightColor), transparent);--_ui5_fcl_decoration_bottom: linear-gradient(to bottom, var(--sapHighlightColor), transparent);--_ui5_media_gallery_overflow_btn_background: var(--sapButton_Background);--_ui5_media_gallery_overflow_btn_color: var(--sapButton_TextColor);--_ui5_media_gallery_overflow_btn_border: 1px solid var(--sapButton_BorderColor);--_ui5_media_gallery_thumbnail_border: 1px solid var(--sapContent_ForegroundColor);--_ui5_media_gallery_thumbnail_selected_border: 2px solid var(--sapSelectedColor);--_ui5_media_gallery_thumbnail_focus_outline: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);--_ui5_media_gallery_item_overlay_box_shadow: inset 0px 0px 80px rgba(0, 0, 0, .2);--_ui5-notification_item-border-radius: var(--sapTile_BorderCornerRadius);--_ui5-notification_group_header-border-bottom-width: 0;--_ui5-notification_group_header-margin: 0px;--_ui5-notification_group_header-margin-expanded: .5rem;--_ui5-notification_group_header-padding: .5rem;--_ui5-notification_item-state-icon-padding: .25rem;--_ui5-notification_item-border-bottom: var(--sapList_BorderWidth) solid var(--sapList_BorderColor);--_ui5-notification_item-border-top-left-right: var(--sapList_BorderWidth) solid var(--sapList_BorderColor);--_ui5-notification_item-margin: 0 .5rem .5rem .5rem;--_ui5-notification_item-background-color-hover: var(--sapList_Hover_Background);--_ui5-notification_item-background-color-active: var(--sapList_SelectionBackgroundColor);--_ui5-notification_item-border-active: 1px solid var(--sapList_SelectionBorderColor);--_ui5-notification_item-root-padding-inline: 1rem;--_ui5-notification_item-content-padding: .75rem 0;--_ui5-notification_item-title-margin-bottom: 0;--_ui5-notification_item-title-padding-end-two-buttons: var(--_ui5-compact-size, 3.875rem)  var(--_ui5-cozy-size, 4.375rem);--_ui5-notification_item-title-padding-end-one-button: var(--_ui5-compact-size, 1.875rem)  var(--_ui5-cozy-size, 2.125rem);--_ui5-notification_item-description-margin-top: var(--_ui5-compact-size, .5rem)  var(--_ui5-cozy-size, .75rem);--_ui5-notification_item-footer-margin-top: var(--_ui5-compact-size, .5rem)  var(--_ui5-cozy-size, .75rem);--_ui5-notification_item-focus-offset: .1875rem;--_ui5-notification_item-outline-offset: -.375rem;--_ui5-notification_item-growing-btn-background-color-active: var(--_ui5-notification_item-background-color-active);--_ui5_page_list_bg: var(--sapGroup_ContentBackground);--_ui5_page_transparent_bg: transparent;--_ui5_vsd_header_container: var(--_ui5-compact-size, 2.5rem)  var(--_ui5-cozy-size, 2.75rem);--_ui5_vsd_sub_header_container_height: var(--_ui5-compact-size, 2rem)  var(--_ui5-cozy-size, 2.75rem);--_ui5_vsd_content_li_padding: .375rem;--_ui5_vsd_content_height: 23.4375rem;--_ui5_vsd_expand_content_height: var(--_ui5-compact-size, 25.4375rem)  var(--_ui5-cozy-size, 26.1875rem);--_ui5_product_switch_item_width: 11.25rem;--_ui5_product_switch_item_height: 7rem;--_ui5_product_switch_item_active_outline_color: var(--sapContent_FocusColor);--_ui5_product_switch_item_outline_offset: -.1875rem;--_ui5_shellbar_root_height: 3.25rem;--_ui5_shellbar_logo_outline_color: var(--sapContent_FocusColor);--_ui5_shellbar_logo_outline: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--_ui5_shellbar_logo_outline_color);--_ui5_shellbar_outline_offset: -.25rem;--_ui5_shellbar_button_box_shadow: var(--sapContent_Interaction_Shadow);--_ui5_shellbar_button_box_shadow_active: inset 0 0 0 .0625rem var(--sapButton_Lite_Active_BorderColor);--_ui5_shellbar_button_border: none;--_ui5_shellbar_button_border_radius: var(--sapButton_BorderCornerRadius);--_ui5_shellbar_button_focused_border: .125rem solid var(--sapContent_FocusColor);--_ui5_shellbar_button_active_color: var(--sapShell_Active_TextColor);--_ui5_shellbar_search_field_background: var(--sapShell_InteractiveBackground);--_ui5_shellbar_search_field_border: none;--_ui5_shellbar_search_field_box_shadow: var(--sapField_Shadow), inset 0 -.0625rem var(--sapField_BorderColor);--_ui5_shellbar_search_field_color: var(--sapShell_InteractiveTextColor);--_ui5_shellbar_search_field_outline_focused: .0625rem dotted var(--sapContent_ContrastFocusColor);--_ui5_shellbar_search_field_width: 25rem;--_ui5_shellbar_input_focus_outline_color: var(--sapField_Active_BorderColor);--_ui5_shellbar_overflow_container_middle_height: 3rem;--_ui5_shellbar_menu_button_title_font_size: var(--sapFontHeader5Size);--_ui5_shellbar_image_button_border_radius: 50%;--_ui5-shellbar-content-margin-start: .5rem;--_ui5-shellbar-overflow-button-margin: .5rem;--_ui5-shellbar_separator-color: var(--sapToolbar_SeparatorColor);--_ui5-shellbar_cancel-button-color: var(--sapButton_Lite_TextColor);--_ui5_shellbar_button_badge_border: 1px solid var(--sapContent_BadgeBackground);--_ui5_shellbar_logo_border_radius: .5rem;--_ui5_shellbar_search_field_background_hover: var(--sapShell_Hover_Background);--_ui5_shellbar_search_field_box_shadow_hover: var(--sapField_Hover_Shadow), inset 0 -.0625rem var(--sapField_Hover_BorderColor);--_ui5_shellbar_input_border_radius: 1.125rem;--_ui5_shellbar_input_focus_border_radius: 1.125rem;--_ui5_shellbar_input_background_color: var(--sapShell_InteractiveBackground);--_ui5_TimelineItem_arrow_size: 1.625rem;--_ui5_TimelineItem_bubble_border_width: .125rem;--_ui5_TimelineItem_bubble_border_style: solid;--_ui5_TimelineItem_bubble_border_radius: var(--sapElement_BorderCornerRadius);--_ui5_TimelineItem_bubble_border_color: var(--sapGroup_ContentBorderColor);--_ui5_TimelineItem_bubble_border_top: -.25rem;--_ui5_TimelineItem_bubble_border_right: -.25rem;--_ui5_TimelineItem_bubble_border_bottom: -.25rem;--_ui5_TimelineItem_bubble_border_left: -.75rem;--_ui5_TimelineItem_bubble_rtl_left_offset: -.25rem;--_ui5_TimelineItem_bubble_rtl_right_offset: -.75rem;--_ui5_TimelineItem_bubble_focus_border_radius: .875rem;--_ui5_TimelineItem_horizontal_bubble_focus_top_offset: -.75rem;--_ui5_TimelineItem_horizontal_bubble_focus_left_offset: -.25rem;--_ui5_TimelineItem_bubble_content_padding: .5rem;--_ui5_TimelineItem_bubble_content_subtitle_padding_top: .125rem;--_ui5_TimelineItem_bubble_content_description_padding_top: .5rem;--_ui5_tl_bubble_padding: var(--_ui5-compact-size, .5rem)  var(--_ui5-cozy-size, 1rem);--_ui5_tl_padding: var(--_ui5-compact-size, .5rem)  var(--_ui5-cozy-size, 1rem 1rem 1rem .5rem);--_ui5_tl_li_margin_bottom: var(--_ui5-compact-size, .5rem)  var(--_ui5-cozy-size, 1.625rem);--_ui5_timeline_tli_indicator_before_bottom: var(--_ui5-compact-size, -.75rem)  var(--_ui5-cozy-size, -1.5rem);--_ui5_timeline_tli_indicator_before_right: var(--_ui5-compact-size, -.5rem)  var(--_ui5-cozy-size, -1.625rem);--_ui5_timeline_tli_indicator_before_without_icon_bottom: var(--_ui5-compact-size, -1rem)  var(--_ui5-cozy-size, -1.875rem);--_ui5_timeline_tli_indicator_before_without_icon_right: var(--_ui5-compact-size, -.8125rem)  var(--_ui5-cozy-size, -1.9375rem);--_ui5_timeline_tli_indicator_after_top: var(--_ui5-compact-size, calc(-100% + .9375rem) )  var(--_ui5-cozy-size, calc(-100% - 1rem) );--_ui5_timeline_tli_indicator_after_height: var(--_ui5-compact-size, calc(100% - .75rem) )  var(--_ui5-cozy-size, calc(100% + 1rem) );--_ui5_timeline_tli_indicator_before_height: var(--_ui5-compact-size, calc(100% - 1.25rem) )  var(--_ui5-cozy-size, 100%);--_ui5_timeline_tli_horizontal_indicator_after_width: var(--_ui5-compact-size, var(--_ui5_timeline_tli_indicator_after_height))  var(--_ui5-cozy-size, calc(100% + .25rem) );--_ui5_timeline_tli_horizontal_indicator_after_left: var(--_ui5-compact-size, 1.8625rem)  var(--_ui5-cozy-size, 1.9375rem);--_ui5_timeline_tli_horizontal_without_icon_indicator_before_width: var(--_ui5-compact-size, var(--_ui5_timeline_tli_indicator_after_height))  var(--_ui5-cozy-size, calc(100% + .5rem) );--_ui5_timeline_tli_horizontal_indicator_before_width: var(--_ui5-compact-size, var(--_ui5_timeline_tli_indicator_after_height))  var(--_ui5-cozy-size, calc(100% + .5rem) );--_ui5_timeline_tli_icon_horizontal_indicator_after_width: var(--_ui5-compact-size, var(--_ui5_timeline_tli_indicator_after_height))  var(--_ui5-cozy-size, calc(100% + .25rem) );--_ui5_timeline_tli_without_icon_horizontal_indicator_before_width: var(--_ui5-compact-size, calc(100% - .625rem) )  var(--_ui5-cozy-size, calc(100% + .375rem) );--_ui5_timeline_tli_horizontal_indicator_short_after_width: var(--_ui5-compact-size, calc(100% - 1rem) )  var(--_ui5-cozy-size, 100%);--_ui5_side_navigation_width: 16rem;--_ui5_side_navigation_collapsed_width: 4rem;--_ui5_side_navigation_navigation_separator_margin: .25rem .5rem .25rem .5rem;--_ui5_side_navigation_navigation_separator_background_color: var(--sapToolbar_SeparatorColor);--_ui5_side_navigation_navigation_separator_radius: .125rem;--_ui5_side_navigation_navigation_separator_height: .0625rem;--_ui5_side_navigation_triangle_color: var(--sapContent_NonInteractiveIconColor);--_ui5_side_navigation_border_right: 0;--_ui5_side_navigation_box_shadow: var(--sapContent_Shadow0);--_ui5_side_navigation_triangle_display: none;--_ui5_side_navigation_icon_color: var(--sapList_TextColor);--_ui5_side_navigation_expand_icon_color: var(--sapList_TextColor);--_ui5_side_navigation_expand_icon_width: 2.25rem;--_ui5_side_navigation_hover_border_style_color: none;--_ui5_side_navigation_hover_border_width: 0;--_ui5_side_navigation_group_border_style_color: none;--_ui5_side_navigation_group_border_width: 0 0 .0625rem 0;--_ui5_side_navigation_item_border_style_color: none;--_ui5_side_navigation_item_border_width: 0;--_ui5_side_navigation_item_height: var(--_ui5-compact-size, 2rem)  var(--_ui5-cozy-size, 2.75rem);--_ui5_side_navigation_item_margin: var(--_ui5-compact-size, .5rem)  var(--_ui5-cozy-size, .875rem);--_ui5_side_navigation_item_expand_arrow_padding: var(--_ui5-compact-size, .3125rem)  var(--_ui5-cozy-size, .6875rem);--_ui5_side_navigation_item_border_radius: .375rem;--_ui5_side_navigation_item_bottom_margin: .25rem;--_ui5_side_navigation_item_padding_start_in_popup: 1rem;--_ui5_side_navigation_item_padding_start_in_overflow_popup: 1rem;--_ui5_side_navigation_item_transition: background-color .3s ease-in-out;--_ui5_side_navigation_item_padding_left: 1rem;--_ui5_side_navigation_item_focus_border_offset: calc(-1 * var(--sapContent_FocusWidth));--_ui5_side_navigation_item_focus_border_radius: calc(var(--_ui5_side_navigation_item_border_radius) + var(--sapContent_FocusWidth));--_ui5_side_navigation_collapsed_selected_item_background: 0 100% / .188rem 100% no-repeat linear-gradient(0deg, var(--sapHighlightColor), var(--sapHighlightColor)), var(--sapList_SelectionBackgroundColor);--_ui5_side_navigation_collapsed_selected_item_background_hover: 0 100% / .188rem 100% no-repeat linear-gradient(0deg, var(--sapHighlightColor), var(--sapHighlightColor)), var(--sapList_Hover_SelectionBackground);--_ui5_side_navigation_selected_item_border_color: var(--sapList_SelectionBorderColor);--_ui5_side_navigation_selected_border_style_color: none;--_ui5_side_navigation_selected_and_focused_border_style_color: var(--_ui5_side_navigation_selected_border_style_color);--_ui5_side_navigation_selected_border_width: 0 0 .0625rem 0;--_ui5_side_navigation_group_expanded_border_width: 0;--_ui5_side_navigation_group_icon_width: 2.5rem;--_ui5_side_navigation_icon_padding_inline_end: .5rem;--_ui5_side_navigation_item_font_family: var(--sapFontFamily);--_ui5_side_navigation_parent_item_font_family: var(--sapFontSemiboldDuplexFamily);--_ui5_side_navigation_group_padding: 1rem;--_ui5_side_navigation_padding-flexible: .5rem .5rem 0 .5rem;--_ui5_side_navigation_padding-fixed: 0 .5rem .5rem .5rem;--_ui5_side_navigation_popup_padding: .5rem;--_ui5_side_navigation_popup_title_line_height: 1.5rem;--_ui5_side_navigation_first_fixed_item_margin_top: .125rem;--_ui5_side_navigation_item_expand_icon_visibility: block;--_ui5_side_navigation_item_collapsed_hover_focus_width: fit-content;--_ui5_side_navigation_item_collapsed_hover_focus_display: block;--_ui5_side_navigation_item_collapsed_hover_focus_padding_right: 1rem;--_ui5_side_navigation_action_item_collapsed_padding: 1rem;--_ui5_side_navigation_item_collapsed_padding: 3rem;--_ui5_side_navigation_action_item_border_hover: var(--sapButton_BorderWidth) solid var(--sapButton_Hover_BorderColor);--_ui5_side_navigation_action_item_border_active: var(--sapButton_BorderWidth) solid var(--sapButton_Active_BorderColor);--_ui5_side_navigation_item_expand_icon_right: -.5rem;--_ui5_side_navigation_active_text_color: var(--sapButton_TextColor);--ui5_upload_collection_drag_overlay_border: .125rem dashed var(--sapField_BorderColor);--ui5_upload_collection_drop_overlay_border: .125rem solid var(--sapContent_DragAndDropActiveColor);--ui5_upload_collection_drop_overlay_background: var(--sapContent_DragAndDropActiveColor);--ui5_upload_collection_thumbnail_size: 3rem;--ui5_upload_collection_thumbnail_margin_inline_end: .75rem;--ui5_upload_collection_small_size_buttons_margin_block_start: .5rem;--ui5_upload_collection_small_size_buttons_margin_inline_start: 0;--ui5_upload_collection_drag_overlay_text_color: var(--sapTextColor);--ui5_upload_collection_drag_overlay_icon_color: var(--sapTextColor);--ui5_upload_collection_drag_overlay_border_radius: .5rem;--ui5_upload_collection_drag_overlay_opacity: .5;--_ui5_wiz_content_item_wrapper_padding: 1rem;--_ui5_wiz_content_item_wrapper_bg: var(--sapGroup_ContentBackground);--_ui5_wiz_tab_focus_outline: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);--_ui5_wiz_tab_selected_bg: var(--sapContent_Selected_ForegroundColor);--_ui5_wiz_tab_border: 1px solid var(--sapContent_Selected_ForegroundColor);--_ui5_wiz_tab_selection_line: var(--sapSelectedColor);--_ui5_wiz_tab_icon_color: var(--sapSelectedColor);--_ui5_wiz_tab_active_separator_color: var(--sapContent_Selected_ForegroundColor);--_ui5_wiz_tab_title_color: var(--sapTextColor);--_ui5_wiz_tab_title_font_family: var(--sapFontBoldFamily);--_ui5_wiz_tab_focus_border_radius: 8px;--_ui5_dynamic_page_footer_spacer: 4rem;--_ui5_dynamic_page_title_padding_S: .5rem 1rem;--_ui5_dynamic_page_title_padding_M: .5rem 2rem;--_ui5_dynamic_page_title_padding_L: .5rem 2rem;--_ui5_dynamic_page_title_padding_XL: .5rem 3rem;--_ui5_dynamic_page_header_padding_S: .5rem 1rem .125rem;--_ui5_dynamic_page_header_padding_M: 1rem 2rem;--_ui5_dynamic_page_header_padding_L: 1rem 2rem;--_ui5_dynamic_page_header_padding_XL: 1rem 3rem;--_ui5_dynamic_page_content_padding_S: 1rem 0 0;--_ui5_dynamic_page_content_padding_M: 1rem 1rem 0;--_ui5_dynamic_page_content_padding_L: 1rem 1rem 0;--_ui5_dynamic_page_content_padding_XL: 1rem 2rem 0;--ui5_dynamic_page_background: var(--sapBackgroundColor);--_ui5_search_icon_border_radius: 1.125rem;--_ui5_search_input_border_radius: 1.125rem;--_ui5-search-border: none;--_ui5-search-icon-border: none;--_ui5-search-wrapper-background: var(--sapShell_InteractiveBackground);--_ui5_search_separator_background: var(--sapShell_InteractiveBorderColor);--_ui5-search-wrapper-hover-background: var(--sapField_Hover_BackgroundStyle);--_ui5-search-wrapper-hover-background-color: var(--sapField_Hover_Background);--_ui5-search-elements-hover-background: none;--_ui5-search-elements-active-background: none;--_ui5_search_input_scope_margin: 0 .125rem 0 .5rem;--_ui5-search_input_scope_hover_shadow: inset 0 0 0 var(--sapField_BorderWidth) var(--sapButton_Lite_Hover_BorderColor);--_ui5-search_input_scope_active_shadow: inset 0 0 0 var(--sapField_BorderWidth) var(--sapButton_Lite_Active_BorderColor);--_ui5-search-elements-background: inherit;--_ui5_search_wrapper_outline: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapField_Active_BorderColor);--_ui5_search_input_outline: none;--_ui5_search_filter_button_border_radius: 1.125rem;--_ui5_seach_filter_button_border_hover: 1px solid var(--sapButton_Hover_BorderColor);--_ui5_search_filter_button_border: none;--_ui5-search-filter_button_background_color: inherit;--ui5_search_filter_button_background_active: inherit;--_ui5_search_icon_size: 1.75rem;--_ui5_search_icon_size_default: 2.25rem;--_ui5_search_icon_padding: .375rem;--_ui5_search_icon_hover_padding: .3125rem;--_ui5_search_input_start_margin: 0;--_ui5_search_input_end_padding: 0;--_ui5-search-input-start-padding: .5rem;--_ui5-search-select-height: 1.625rem;--_ui5-search-loading-overlay-background: var(--sapBackgroundColor);--_ui5-search-loading-overlay-transparency: .72;--_ui5-search-field-text-color: var(--sapField_TextColor);--_ui5_search_item_vertical_padding: var(--_ui5-compact-size, .5rem)  var(--_ui5-cozy-size, 1rem);--_ui5_search_byline_vertical_padding: .5rem;--_ui5_search_popover_max_height: 39rem;--_ui5_dynamic_page_title_padding_top: .5rem;--_ui5_dynamic_page_title_padding_bottom: .5rem;--_ui5_dynamic_page_title_min_height: 4rem;--_ui5_dynamic_page_title_focus_outline: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);--_ui5_dynamic_page_title_focus_outline_offset: -.125rem;--_ui5_dynamic_page_title_breadcrumbs_padding_top: .5rem;--_ui5_dynamic_page_title_breadcrumbs_padding_bottom: .25rem;--_ui5_dynamic_page_title_heading_padding_top: .3125rem;--_ui5_dynamic_page_title_subheading_margin_top: .25rem;--_ui5_dynamic_page_title_hover_background: var(--sapObjectHeader_Hover_Background);--_ui5_dynamic_page_snapped_title_on_mobile_line_height: 2rem;--_ui5_dynamic_page_snapped_title_on_mobile_min_height: 2rem;--_ui5_dynamic_page_header_background_color: var(--sapObjectHeader_Background);--_ui5_dynamic_page_header-actions-box-shadow: var(--sapContent_Shadow0);--_ui5_dynamic_page_header-box-shadow: var(--sapContent_HeaderShadow);--_ui5_dynamic_page_actions-lines-color: var(--sapObjectHeader_BorderColor);--_ui5_dynamic_page_header-actions-background: var(--sapObjectHeader_Background);--_ui5_dynamic_page_header-actions-color: var(--sapButton_TextColor);--_ui5_dynamic_page_header-actions-background-pressed: var(--_ui5_dynamic_page_header-actions-background);--_ui5_dynamic_page_header-actions-color-pressed: var(--_ui5_dynamic_page_header-actions-color);--_ui5_timeline_tlgi_line_horizontal_height: 14.8125rem;--_ui5_timeline_tlgi_root_horizontal_height: var(--_ui5-compact-size, 19.375rem)  var(--_ui5-cozy-size, 19.9375rem);--_ui5_timeline_tlgi_compact_icon_before_height: var(--_ui5-compact-size, calc(100% + 1.5rem) ) var(--_ui5-cozy-size, var(--_ui5-f2d95f8));--_ui5_timeline_tlgi_horizontal_line_placeholder_before_width: var(--_ui5-compact-size, var(--_ui5_timeline_tlgi_compact_icon_before_height)) var(--_ui5-cozy-size, var(--_ui5-f2d95f8));--_ui5_timeline_tlgi_horizontal_compact_root_margin_left: var(--_ui5-compact-size, .5rem) var(--_ui5-cozy-size, var(--_ui5-f2d95f8));--_ui5_timeline_tlgi_compact_root_gap: var(--_ui5-compact-size, .5rem) var(--_ui5-cozy-size, var(--_ui5-f2d95f8));--_ui5_user_settings_avatar_cozy_display: var(--_ui5-compact-size, none)  var(--_ui5-cozy-size, inline-block);--_ui5_user_settings_avatar_compact_display: var(--_ui5-compact-size, inline-block)  var(--_ui5-cozy-size, none);--_ui5_user_settings_item_title_font_size: var(--_ui5-compact-size, var(--sapFontLargeSize))  var(--_ui5-cozy-size, var(--sapFontSize))}
+:host{--_ui5_banner_background: var(--sapShell_HeroBanner_Background, var(--sapHighlightColor));--_ui5_banner_text_color: var(--sapShell_HeroBanner_TextColor, var(--sapContent_ContrastTextColor));--_ui5_banner_border_radius: var(--sapTile_BorderCornerRadius);--_ui5_banner_box_shadow: var(--sapContent_Shadow0);--_ui5_banner_background_image: var(--sapShell_HeroBanner_BackgroundImage);--_ui5_timeline_scroll_container_offset: .5rem;--_ui5_shellbar_notification_btn_count_offset: .125rem;--_ui5_side_navigation_item_expand_icon_hover_left: auto;--_ui5_side_navigation_item_expand_icon_hover_right: 0;--_ui5_fcl_solid_bg: var(--sapShell_Background);--_ui5_fcl_column_border: solid .0625rem var(--sapGroup_ContentBorderColor);--_ui5_fcl_decoration_top: linear-gradient(to top, var(--sapHighlightColor), transparent);--_ui5_fcl_decoration_bottom: linear-gradient(to bottom, var(--sapHighlightColor), transparent);--_ui5_media_gallery_overflow_btn_background: var(--sapButton_Background);--_ui5_media_gallery_overflow_btn_color: var(--sapButton_TextColor);--_ui5_media_gallery_overflow_btn_border: 1px solid var(--sapButton_BorderColor);--_ui5_media_gallery_thumbnail_border: 1px solid var(--sapContent_ForegroundColor);--_ui5_media_gallery_thumbnail_selected_border: 2px solid var(--sapSelectedColor);--_ui5_media_gallery_thumbnail_focus_outline: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);--_ui5_media_gallery_item_overlay_box_shadow: inset 0px 0px 80px rgba(0, 0, 0, .2);--_ui5-notification_item-border-radius: var(--sapTile_BorderCornerRadius);--_ui5-notification_group_header-border-bottom-width: 0;--_ui5-notification_group_header-margin: 0px;--_ui5-notification_group_header-margin-expanded: .5rem;--_ui5-notification_group_header-padding: .5rem;--_ui5-notification_item-state-icon-padding: .25rem;--_ui5-notification_item-border-bottom: var(--sapList_BorderWidth) solid var(--sapList_BorderColor);--_ui5-notification_item-border-top-left-right: var(--sapList_BorderWidth) solid var(--sapList_BorderColor);--_ui5-notification_item-margin: 0 .5rem .5rem .5rem;--_ui5-notification_item-background-color-hover: var(--sapList_Hover_Background);--_ui5-notification_item-background-color-active: var(--sapList_SelectionBackgroundColor);--_ui5-notification_item-border-active: 1px solid var(--sapList_SelectionBorderColor);--_ui5-notification_item-root-padding-inline: 1rem;--_ui5-notification_item-content-padding: .75rem 0;--_ui5-notification_item-title-margin-bottom: 0;--_ui5-notification_item-title-padding-end-two-buttons: var(--_ui5-compact-size, 3.875rem)  var(--_ui5-cozy-size, 4.375rem);--_ui5-notification_item-title-padding-end-one-button: var(--_ui5-compact-size, 1.875rem)  var(--_ui5-cozy-size, 2.125rem);--_ui5-notification_item-description-margin-top: var(--_ui5-compact-size, .5rem)  var(--_ui5-cozy-size, .75rem);--_ui5-notification_item-footer-margin-top: var(--_ui5-compact-size, .5rem)  var(--_ui5-cozy-size, .75rem);--_ui5-notification_item-focus-offset: .1875rem;--_ui5-notification_item-outline-offset: -.375rem;--_ui5-notification_item-growing-btn-background-color-active: var(--_ui5-notification_item-background-color-active);--_ui5_page_list_bg: var(--sapGroup_ContentBackground);--_ui5_page_transparent_bg: transparent;--_ui5_vsd_header_container: var(--_ui5-compact-size, 2.5rem)  var(--_ui5-cozy-size, 2.75rem);--_ui5_vsd_sub_header_container_height: var(--_ui5-compact-size, 2rem)  var(--_ui5-cozy-size, 2.75rem);--_ui5_vsd_content_li_padding: .375rem;--_ui5_vsd_content_height: 23.4375rem;--_ui5_vsd_expand_content_height: var(--_ui5-compact-size, 25.4375rem)  var(--_ui5-cozy-size, 26.1875rem);--_ui5_product_switch_item_width: 11.25rem;--_ui5_product_switch_item_height: 7rem;--_ui5_product_switch_item_active_outline_color: var(--sapContent_FocusColor);--_ui5_product_switch_item_outline_offset: -.1875rem;--_ui5_shellbar_root_height: 3.25rem;--_ui5_shellbar_logo_outline_color: var(--sapContent_FocusColor);--_ui5_shellbar_logo_outline: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--_ui5_shellbar_logo_outline_color);--_ui5_shellbar_outline_offset: -.25rem;--_ui5_shellbar_button_box_shadow: var(--sapContent_Interaction_Shadow);--_ui5_shellbar_button_box_shadow_active: inset 0 0 0 .0625rem var(--sapButton_Lite_Active_BorderColor);--_ui5_shellbar_button_border: none;--_ui5_shellbar_button_border_radius: var(--sapButton_BorderCornerRadius);--_ui5_shellbar_button_focused_border: .125rem solid var(--sapContent_FocusColor);--_ui5_shellbar_button_active_color: var(--sapShell_Active_TextColor);--_ui5_shellbar_search_field_background: var(--sapShell_InteractiveBackground);--_ui5_shellbar_search_field_border: none;--_ui5_shellbar_search_field_box_shadow: var(--sapField_Shadow), inset 0 -.0625rem var(--sapField_BorderColor);--_ui5_shellbar_search_field_color: var(--sapShell_InteractiveTextColor);--_ui5_shellbar_search_field_outline_focused: .0625rem dotted var(--sapContent_ContrastFocusColor);--_ui5_shellbar_search_field_width: 25rem;--_ui5_shellbar_input_focus_outline_color: var(--sapField_Active_BorderColor);--_ui5_shellbar_overflow_container_middle_height: 3rem;--_ui5_shellbar_menu_button_title_font_size: var(--sapFontHeader5Size);--_ui5_shellbar_image_button_border_radius: 50%;--_ui5-shellbar-content-margin-start: .5rem;--_ui5-shellbar-overflow-button-margin: .5rem;--_ui5-shellbar_separator-color: var(--sapToolbar_SeparatorColor);--_ui5-shellbar_cancel-button-color: var(--sapButton_Lite_TextColor);--_ui5_shellbar_button_badge_border: 1px solid var(--sapContent_BadgeBackground);--_ui5_shellbar_logo_border_radius: .5rem;--_ui5_shellbar_search_field_background_hover: var(--sapShell_Hover_Background);--_ui5_shellbar_search_field_box_shadow_hover: var(--sapField_Hover_Shadow), inset 0 -.0625rem var(--sapField_Hover_BorderColor);--_ui5_shellbar_input_border_radius: 1.125rem;--_ui5_shellbar_input_focus_border_radius: 1.125rem;--_ui5_shellbar_input_background_color: var(--sapShell_InteractiveBackground);--_ui5_TimelineItem_arrow_size: 1.625rem;--_ui5_TimelineItem_bubble_border_width: .125rem;--_ui5_TimelineItem_bubble_border_style: solid;--_ui5_TimelineItem_bubble_border_radius: var(--sapElement_BorderCornerRadius);--_ui5_TimelineItem_bubble_border_color: var(--sapGroup_ContentBorderColor);--_ui5_TimelineItem_bubble_border_top: -.25rem;--_ui5_TimelineItem_bubble_border_right: -.25rem;--_ui5_TimelineItem_bubble_border_bottom: -.25rem;--_ui5_TimelineItem_bubble_border_left: -.75rem;--_ui5_TimelineItem_bubble_rtl_left_offset: -.25rem;--_ui5_TimelineItem_bubble_rtl_right_offset: -.75rem;--_ui5_TimelineItem_bubble_focus_border_radius: .875rem;--_ui5_TimelineItem_horizontal_bubble_focus_top_offset: -.75rem;--_ui5_TimelineItem_horizontal_bubble_focus_left_offset: -.25rem;--_ui5_TimelineItem_bubble_content_padding: .5rem;--_ui5_TimelineItem_bubble_content_subtitle_padding_top: .125rem;--_ui5_TimelineItem_bubble_content_description_padding_top: .5rem;--_ui5_tl_bubble_padding: var(--_ui5-compact-size, .5rem)  var(--_ui5-cozy-size, 1rem);--_ui5_tl_padding: var(--_ui5-compact-size, .5rem)  var(--_ui5-cozy-size, 1rem 1rem 1rem .5rem);--_ui5_tl_li_margin_bottom: var(--_ui5-compact-size, .5rem)  var(--_ui5-cozy-size, 1.625rem);--_ui5_timeline_tli_indicator_before_bottom: var(--_ui5-compact-size, -.75rem)  var(--_ui5-cozy-size, -1.5rem);--_ui5_timeline_tli_indicator_before_right: var(--_ui5-compact-size, -.5rem)  var(--_ui5-cozy-size, -1.625rem);--_ui5_timeline_tli_indicator_before_without_icon_bottom: var(--_ui5-compact-size, -1rem)  var(--_ui5-cozy-size, -1.875rem);--_ui5_timeline_tli_indicator_before_without_icon_right: var(--_ui5-compact-size, -.8125rem)  var(--_ui5-cozy-size, -1.9375rem);--_ui5_timeline_tli_indicator_after_top: var(--_ui5-compact-size, calc(-100% + .9375rem) )  var(--_ui5-cozy-size, calc(-100% - 1rem) );--_ui5_timeline_tli_indicator_after_height: var(--_ui5-compact-size, calc(100% - .75rem) )  var(--_ui5-cozy-size, calc(100% + 1rem) );--_ui5_timeline_tli_indicator_before_height: var(--_ui5-compact-size, calc(100% - 1.25rem) )  var(--_ui5-cozy-size, 100%);--_ui5_timeline_tli_horizontal_indicator_after_width: var(--_ui5-compact-size, var(--_ui5_timeline_tli_indicator_after_height))  var(--_ui5-cozy-size, calc(100% + .25rem) );--_ui5_timeline_tli_horizontal_indicator_after_left: var(--_ui5-compact-size, 1.8625rem)  var(--_ui5-cozy-size, 1.9375rem);--_ui5_timeline_tli_horizontal_without_icon_indicator_before_width: var(--_ui5-compact-size, var(--_ui5_timeline_tli_indicator_after_height))  var(--_ui5-cozy-size, calc(100% + .5rem) );--_ui5_timeline_tli_horizontal_indicator_before_width: var(--_ui5-compact-size, var(--_ui5_timeline_tli_indicator_after_height))  var(--_ui5-cozy-size, calc(100% + .5rem) );--_ui5_timeline_tli_icon_horizontal_indicator_after_width: var(--_ui5-compact-size, var(--_ui5_timeline_tli_indicator_after_height))  var(--_ui5-cozy-size, calc(100% + .25rem) );--_ui5_timeline_tli_without_icon_horizontal_indicator_before_width: var(--_ui5-compact-size, calc(100% - .625rem) )  var(--_ui5-cozy-size, calc(100% + .375rem) );--_ui5_timeline_tli_horizontal_indicator_short_after_width: var(--_ui5-compact-size, calc(100% - 1rem) )  var(--_ui5-cozy-size, 100%);--_ui5_side_navigation_width: 16rem;--_ui5_side_navigation_collapsed_width: 4rem;--_ui5_side_navigation_navigation_separator_margin: .25rem .5rem .25rem .5rem;--_ui5_side_navigation_navigation_separator_background_color: var(--sapToolbar_SeparatorColor);--_ui5_side_navigation_navigation_separator_radius: .125rem;--_ui5_side_navigation_navigation_separator_height: .0625rem;--_ui5_side_navigation_triangle_color: var(--sapContent_NonInteractiveIconColor);--_ui5_side_navigation_border_right: 0;--_ui5_side_navigation_box_shadow: var(--sapContent_Shadow0);--_ui5_side_navigation_triangle_display: none;--_ui5_side_navigation_icon_color: var(--sapList_TextColor);--_ui5_side_navigation_expand_icon_color: var(--sapList_TextColor);--_ui5_side_navigation_expand_icon_width: 2.25rem;--_ui5_side_navigation_hover_border_style_color: none;--_ui5_side_navigation_hover_border_width: 0;--_ui5_side_navigation_group_border_style_color: none;--_ui5_side_navigation_group_border_width: 0 0 .0625rem 0;--_ui5_side_navigation_item_border_style_color: none;--_ui5_side_navigation_item_border_width: 0;--_ui5_side_navigation_item_height: var(--_ui5-compact-size, 2rem)  var(--_ui5-cozy-size, 2.75rem);--_ui5_side_navigation_item_margin: var(--_ui5-compact-size, .5rem)  var(--_ui5-cozy-size, .875rem);--_ui5_side_navigation_item_expand_arrow_padding: var(--_ui5-compact-size, .3125rem)  var(--_ui5-cozy-size, .6875rem);--_ui5_side_navigation_item_border_radius: .375rem;--_ui5_side_navigation_item_bottom_margin: .25rem;--_ui5_side_navigation_item_padding_start_in_popup: 1rem;--_ui5_side_navigation_item_padding_start_in_overflow_popup: 1rem;--_ui5_side_navigation_item_transition: background-color .3s ease-in-out;--_ui5_side_navigation_item_padding_left: 1rem;--_ui5_side_navigation_item_focus_border_offset: calc(-1 * var(--sapContent_FocusWidth));--_ui5_side_navigation_item_focus_border_radius: calc(var(--_ui5_side_navigation_item_border_radius) + var(--sapContent_FocusWidth));--_ui5_side_navigation_collapsed_selected_item_background: 0 100% / .188rem 100% no-repeat linear-gradient(0deg, var(--sapHighlightColor), var(--sapHighlightColor)), var(--sapList_SelectionBackgroundColor);--_ui5_side_navigation_collapsed_selected_item_background_hover: 0 100% / .188rem 100% no-repeat linear-gradient(0deg, var(--sapHighlightColor), var(--sapHighlightColor)), var(--sapList_Hover_SelectionBackground);--_ui5_side_navigation_selected_item_border_color: var(--sapList_SelectionBorderColor);--_ui5_side_navigation_selected_border_style_color: none;--_ui5_side_navigation_selected_and_focused_border_style_color: var(--_ui5_side_navigation_selected_border_style_color);--_ui5_side_navigation_selected_border_width: 0 0 .0625rem 0;--_ui5_side_navigation_group_expanded_border_width: 0;--_ui5_side_navigation_group_icon_width: 2.5rem;--_ui5_side_navigation_icon_padding_inline_end: .5rem;--_ui5_side_navigation_item_font_family: var(--sapFontFamily);--_ui5_side_navigation_parent_item_font_family: var(--sapFontSemiboldDuplexFamily);--_ui5_side_navigation_group_padding: 1rem;--_ui5_side_navigation_padding-flexible: .5rem .5rem 0 .5rem;--_ui5_side_navigation_padding-fixed: 0 .5rem .5rem .5rem;--_ui5_side_navigation_popup_padding: .5rem;--_ui5_side_navigation_popup_title_line_height: 1.5rem;--_ui5_side_navigation_first_fixed_item_margin_top: .125rem;--_ui5_side_navigation_item_expand_icon_visibility: block;--_ui5_side_navigation_item_collapsed_hover_focus_width: fit-content;--_ui5_side_navigation_item_collapsed_hover_focus_display: block;--_ui5_side_navigation_item_collapsed_hover_focus_padding_right: 1rem;--_ui5_side_navigation_action_item_collapsed_padding: 1rem;--_ui5_side_navigation_item_collapsed_padding: 3rem;--_ui5_side_navigation_action_item_border_hover: var(--sapButton_BorderWidth) solid var(--sapButton_Hover_BorderColor);--_ui5_side_navigation_action_item_border_active: var(--sapButton_BorderWidth) solid var(--sapButton_Active_BorderColor);--_ui5_side_navigation_item_expand_icon_right: -.5rem;--_ui5_side_navigation_active_text_color: var(--sapButton_TextColor);--ui5_upload_collection_drag_overlay_border: .125rem dashed var(--sapField_BorderColor);--ui5_upload_collection_drop_overlay_border: .125rem solid var(--sapContent_DragAndDropActiveColor);--ui5_upload_collection_drop_overlay_background: var(--sapContent_DragAndDropActiveColor);--ui5_upload_collection_thumbnail_size: 3rem;--ui5_upload_collection_thumbnail_margin_inline_end: .75rem;--ui5_upload_collection_small_size_buttons_margin_block_start: .5rem;--ui5_upload_collection_small_size_buttons_margin_inline_start: 0;--ui5_upload_collection_drag_overlay_text_color: var(--sapTextColor);--ui5_upload_collection_drag_overlay_icon_color: var(--sapTextColor);--ui5_upload_collection_drag_overlay_border_radius: .5rem;--ui5_upload_collection_drag_overlay_opacity: .5;--_ui5_wiz_content_item_wrapper_padding: 1rem;--_ui5_wiz_content_item_wrapper_bg: var(--sapGroup_ContentBackground);--_ui5_wiz_tab_focus_outline: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);--_ui5_wiz_tab_selected_bg: var(--sapContent_Selected_ForegroundColor);--_ui5_wiz_tab_border: 1px solid var(--sapContent_Selected_ForegroundColor);--_ui5_wiz_tab_selection_line: var(--sapSelectedColor);--_ui5_wiz_tab_icon_color: var(--sapSelectedColor);--_ui5_wiz_tab_active_separator_color: var(--sapContent_Selected_ForegroundColor);--_ui5_wiz_tab_title_color: var(--sapTextColor);--_ui5_wiz_tab_title_font_family: var(--sapFontBoldFamily);--_ui5_wiz_tab_focus_border_radius: 8px;--_ui5_dynamic_page_footer_spacer: 4rem;--_ui5_dynamic_page_title_padding_S: .5rem 1rem;--_ui5_dynamic_page_title_padding_M: .5rem 2rem;--_ui5_dynamic_page_title_padding_L: .5rem 2rem;--_ui5_dynamic_page_title_padding_XL: .5rem 3rem;--_ui5_dynamic_page_header_padding_S: .5rem 1rem .125rem;--_ui5_dynamic_page_header_padding_M: 1rem 2rem;--_ui5_dynamic_page_header_padding_L: 1rem 2rem;--_ui5_dynamic_page_header_padding_XL: 1rem 3rem;--_ui5_dynamic_page_content_padding_S: 1rem 0 0;--_ui5_dynamic_page_content_padding_M: 1rem 1rem 0;--_ui5_dynamic_page_content_padding_L: 1rem 1rem 0;--_ui5_dynamic_page_content_padding_XL: 1rem 2rem 0;--ui5_dynamic_page_background: var(--sapBackgroundColor);--_ui5_search_icon_border_radius: 1.125rem;--_ui5_search_input_border_radius: 1.125rem;--_ui5-search-border: none;--_ui5-search-icon-border: none;--_ui5-search-wrapper-background: var(--sapShell_InteractiveBackground);--_ui5_search_separator_background: var(--sapShell_InteractiveBorderColor);--_ui5-search-wrapper-hover-background: var(--sapField_Hover_BackgroundStyle);--_ui5-search-wrapper-hover-background-color: var(--sapField_Hover_Background);--_ui5-search-elements-hover-background: none;--_ui5-search-elements-active-background: none;--_ui5_search_input_scope_margin: 0 .125rem 0 .5rem;--_ui5-search_input_scope_hover_shadow: inset 0 0 0 var(--sapField_BorderWidth) var(--sapButton_Lite_Hover_BorderColor);--_ui5-search_input_scope_active_shadow: inset 0 0 0 var(--sapField_BorderWidth) var(--sapButton_Lite_Active_BorderColor);--_ui5-search-elements-background: inherit;--_ui5_search_wrapper_outline: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapField_Active_BorderColor);--_ui5_search_input_outline: none;--_ui5_search_filter_button_border_radius: 1.125rem;--_ui5_seach_filter_button_border_hover: 1px solid var(--sapButton_Hover_BorderColor);--_ui5_search_filter_button_border: none;--_ui5-search-filter_button_background_color: inherit;--ui5_search_filter_button_background_active: inherit;--_ui5_search_icon_size: 1.75rem;--_ui5_search_icon_size_default: 2.25rem;--_ui5_search_icon_padding: .375rem;--_ui5_search_icon_hover_padding: .3125rem;--_ui5_search_input_start_margin: 0;--_ui5_search_input_end_padding: 0;--_ui5-search-input-start-padding: .5rem;--_ui5-search-select-height: 1.625rem;--_ui5-search-loading-overlay-background: var(--sapBackgroundColor);--_ui5-search-loading-overlay-transparency: .72;--_ui5-search-field-text-color: var(--sapField_TextColor);--_ui5_search_item_vertical_padding: var(--_ui5-compact-size, .5rem)  var(--_ui5-cozy-size, 1rem);--_ui5_search_byline_vertical_padding: .5rem;--_ui5_search_popover_max_height: 39rem;--_ui5_dynamic_page_title_padding_top: .5rem;--_ui5_dynamic_page_title_padding_bottom: .5rem;--_ui5_dynamic_page_title_min_height: 4rem;--_ui5_dynamic_page_title_focus_outline: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);--_ui5_dynamic_page_title_focus_outline_offset: -.125rem;--_ui5_dynamic_page_title_breadcrumbs_padding_top: .5rem;--_ui5_dynamic_page_title_breadcrumbs_padding_bottom: .25rem;--_ui5_dynamic_page_title_heading_padding_top: .3125rem;--_ui5_dynamic_page_title_subheading_margin_top: .25rem;--_ui5_dynamic_page_title_hover_background: var(--sapObjectHeader_Hover_Background);--_ui5_dynamic_page_snapped_title_on_mobile_line_height: 2rem;--_ui5_dynamic_page_snapped_title_on_mobile_min_height: 2rem;--_ui5_dynamic_page_header_background_color: var(--sapObjectHeader_Background);--_ui5_dynamic_page_header-actions-box-shadow: var(--sapContent_Shadow0);--_ui5_dynamic_page_header-box-shadow: var(--sapContent_HeaderShadow);--_ui5_dynamic_page_actions-lines-color: var(--sapObjectHeader_BorderColor);--_ui5_dynamic_page_header-actions-background: var(--sapObjectHeader_Background);--_ui5_dynamic_page_header-actions-color: var(--sapButton_TextColor);--_ui5_dynamic_page_header-actions-background-pressed: var(--_ui5_dynamic_page_header-actions-background);--_ui5_dynamic_page_header-actions-color-pressed: var(--_ui5_dynamic_page_header-actions-color);--_ui5_timeline_tlgi_line_horizontal_height: 14.8125rem;--_ui5_timeline_tlgi_root_horizontal_height: var(--_ui5-compact-size, 19.375rem)  var(--_ui5-cozy-size, 19.9375rem);--_ui5_timeline_tlgi_compact_icon_before_height: var(--_ui5-compact-size, calc(100% + 1.5rem) ) var(--_ui5-cozy-size, var(--_ui5-f2d95f8));--_ui5_timeline_tlgi_horizontal_line_placeholder_before_width: var(--_ui5-compact-size, var(--_ui5_timeline_tlgi_compact_icon_before_height)) var(--_ui5-cozy-size, var(--_ui5-f2d95f8));--_ui5_timeline_tlgi_horizontal_compact_root_margin_left: var(--_ui5-compact-size, .5rem) var(--_ui5-cozy-size, var(--_ui5-f2d95f8));--_ui5_timeline_tlgi_compact_root_gap: var(--_ui5-compact-size, .5rem) var(--_ui5-cozy-size, var(--_ui5-f2d95f8));--_ui5_user_settings_avatar_cozy_display: var(--_ui5-compact-size, none)  var(--_ui5-cozy-size, inline-block);--_ui5_user_settings_avatar_compact_display: var(--_ui5-compact-size, inline-block)  var(--_ui5-cozy-size, none);--_ui5_user_settings_item_title_font_size: var(--_ui5-compact-size, var(--sapFontLargeSize))  var(--_ui5-cozy-size, var(--sapFontSize))}
 :dir(rtl){--_ui5_timeline_scroll_container_offset: -.5rem;--_ui5_shellbar_notification_btn_count_offset: auto;--_ui5_side_navigation_item_expand_icon_hover_left: 0;--_ui5_side_navigation_item_expand_icon_hover_right: auto}

package/dist/css/themes/sap_horizon_auto/parameters-bundle.css

@@ -1,6 +1,6 @@
 :host {
-    --_ui5_banner_background: light-dark(var(--sapShell_Banner_Background, var(--sapHighlightColor)), var(--sapShell_HeroBanner_Background));
-    --_ui5_banner_text_color: light-dark(var(--sapShell_Banner_TextColor, var(--sapContent_ContrastTextColor)), var(--sapShell_HeroBanner_TextColor));
+    --_ui5_banner_background: light-dark(var(--sapShell_HeroBanner_Background, var(--sapHighlightColor)), var(--sapShell_HeroBanner_Background));
+    --_ui5_banner_text_color: light-dark(var(--sapShell_HeroBanner_TextColor, var(--sapContent_ContrastTextColor)), var(--sapShell_HeroBanner_TextColor));
     --_ui5_banner_border_radius: var(--sapTile_BorderCornerRadius);
     --_ui5_banner_box_shadow: var(--sapContent_Shadow0);
     --_ui5_banner_background_image: var(--sapShell_HeroBanner_BackgroundImage);

package/dist/css/themes/sap_horizon_exp/parameters-bundle.css

@@ -1,6 +1,6 @@
 :host{
-    --_ui5_banner_background: var(--sapShell_Banner_Background, var(--sapHighlightColor));
-    --_ui5_banner_text_color: var(--sapShell_Banner_TextColor, var(--sapContent_ContrastTextColor));
+    --_ui5_banner_background: var(--sapShell_HeroBanner_Background, var(--sapHighlightColor));
+    --_ui5_banner_text_color: var(--sapShell_HeroBanner_TextColor, var(--sapContent_ContrastTextColor));
     --_ui5_banner_border_radius: var(--sapTile_BorderCornerRadius);
     --_ui5_banner_box_shadow: var(--sapContent_Shadow0);
     --_ui5_banner_background_image: var(--sapShell_HeroBanner_BackgroundImage);

package/dist/custom-elements-internal.json

@@ -14197,6 +14197,16 @@
               "description": "Defines, if the User Settings Dialog is opened.",
               "privacy": "public"
             },
+            {
+              "kind": "field",
+              "name": "saveMode",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Defines whether the dialog offers Save and Cancel actions in its footer.\n\nWhen true, the footer renders a Save (Emphasized) and a Cancel button\ninstead of the default Close button. Save and Cancel each fire a\ncorresponding event; the application is responsible for closing the\ndialog (typically after persisting or discarding the changes).",
+              "privacy": "public"
+            },
             {
               "kind": "field",
               "name": "showSearchField",
@@ -14215,18 +14225,29 @@
               "type": {
                 "text": "CustomEvent"
               },
-              "description": "Fired before the settings dialog is closed.",
+              "description": "Fired before the settings dialog is closed.\n\n**Note:** This event is cancelable via `preventDefault()`, allowing the application to keep the\ndialog open — for example, to prompt the user about unsaved changes before dismissal.",
               "_ui5Cancelable": true,
               "_ui5allowPreventDefault": true,
               "_ui5Bubbles": false
             },
+            {
+              "name": "cancel",
+              "_ui5privacy": "public",
+              "type": {
+                "text": "CustomEvent"
+              },
+              "description": "Fired when the Cancel button in the footer is clicked.\nThe dialog does not close automatically — the application is responsible\nfor closing it after discarding the changes.",
+              "_ui5Cancelable": false,
+              "_ui5allowPreventDefault": false,
+              "_ui5Bubbles": false
+            },
             {
               "name": "close",
               "_ui5privacy": "public",
               "type": {
                 "text": "CustomEvent"
               },
-              "description": "Fired when a settings dialog is closed.",
+              "description": "Fired when the settings dialog is closed.",
               "_ui5Cancelable": false,
               "_ui5allowPreventDefault": false,
               "_ui5Bubbles": false
@@ -14237,7 +14258,18 @@
               "type": {
                 "text": "CustomEvent"
               },
-              "description": "Fired when a settings dialog is open.",
+              "description": "Fired when the settings dialog is opened.",
+              "_ui5Cancelable": false,
+              "_ui5allowPreventDefault": false,
+              "_ui5Bubbles": false
+            },
+            {
+              "name": "save",
+              "_ui5privacy": "public",
+              "type": {
+                "text": "CustomEvent"
+              },
+              "description": "Fired when the Save button in the footer is clicked.\nThe dialog does not close automatically — the application is responsible\nfor closing it after persisting the changes.",
               "_ui5Cancelable": false,
               "_ui5allowPreventDefault": false,
               "_ui5Bubbles": false
@@ -14297,6 +14329,15 @@
                 "text": "boolean"
               }
             },
+            {
+              "description": "Defines whether the dialog offers Save and Cancel actions in its footer.\n\nWhen true, the footer renders a Save (Emphasized) and a Cancel button\ninstead of the default Close button. Save and Cancel each fire a\ncorresponding event; the application is responsible for closing the\ndialog (typically after persisting or discarding the changes).",
+              "name": "save-mode",
+              "default": "false",
+              "fieldName": "saveMode",
+              "type": {
+                "text": "boolean"
+              }
+            },
             {
               "description": "Defines if the Search Field would be displayed.\n\n**Note:** By default the Search Field is not displayed.",
               "name": "show-search-field",

package/dist/custom-elements.json

@@ -11413,6 +11413,16 @@
               "description": "Defines, if the User Settings Dialog is opened.",
               "privacy": "public"
             },
+            {
+              "kind": "field",
+              "name": "saveMode",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Defines whether the dialog offers Save and Cancel actions in its footer.\n\nWhen true, the footer renders a Save (Emphasized) and a Cancel button\ninstead of the default Close button. Save and Cancel each fire a\ncorresponding event; the application is responsible for closing the\ndialog (typically after persisting or discarding the changes).",
+              "privacy": "public"
+            },
             {
               "kind": "field",
               "name": "showSearchField",
@@ -11430,21 +11440,35 @@
               "type": {
                 "text": "CustomEvent"
               },
-              "description": "Fired before the settings dialog is closed."
+              "description": "Fired before the settings dialog is closed.\n\n**Note:** This event is cancelable via `preventDefault()`, allowing the application to keep the\ndialog open — for example, to prompt the user about unsaved changes before dismissal."
+            },
+            {
+              "name": "cancel",
+              "type": {
+                "text": "CustomEvent"
+              },
+              "description": "Fired when the Cancel button in the footer is clicked.\nThe dialog does not close automatically — the application is responsible\nfor closing it after discarding the changes."
             },
             {
               "name": "close",
               "type": {
                 "text": "CustomEvent"
               },
-              "description": "Fired when a settings dialog is closed."
+              "description": "Fired when the settings dialog is closed."
             },
             {
               "name": "open",
               "type": {
                 "text": "CustomEvent"
               },
-              "description": "Fired when a settings dialog is open."
+              "description": "Fired when the settings dialog is opened."
+            },
+            {
+              "name": "save",
+              "type": {
+                "text": "CustomEvent"
+              },
+              "description": "Fired when the Save button in the footer is clicked.\nThe dialog does not close automatically — the application is responsible\nfor closing it after persisting the changes."
             },
             {
               "name": "selection-change",
@@ -11480,6 +11504,15 @@
                 "text": "boolean"
               }
             },
+            {
+              "description": "Defines whether the dialog offers Save and Cancel actions in its footer.\n\nWhen true, the footer renders a Save (Emphasized) and a Cancel button\ninstead of the default Close button. Save and Cancel each fire a\ncorresponding event; the application is responsible for closing the\ndialog (typically after persisting or discarding the changes).",
+              "name": "save-mode",
+              "default": "false",
+              "fieldName": "saveMode",
+              "type": {
+                "text": "boolean"
+              }
+            },
             {
               "description": "Defines if the Search Field would be displayed.\n\n**Note:** By default the Search Field is not displayed.",
               "name": "show-search-field",