@openui5/sap.ui.webc.common 1.96.2 → 1.97.0

package/.reuse/dep5

@@ -418,7 +418,7 @@ Comment: these files contain content from SAP and BooleanExpressionEvaluator: Bo
 
 # Library: sap.ui.webc.common:
 
-Files: src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/base/*.* src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/theme-base/*.* src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/localization/*.* src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/icons/*.* src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/icons-tnt/*.*
+Files: src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/base/*.* src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/theming/*.* src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/localization/*.* src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/icons/*.* src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/icons-tnt/*.* src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/icons-business-suite/*.*
 Copyright: SAP
 License: Apache-2.0
 Comment: these files belong to: UI5 Web Components

package/THIRDPARTY.txt

@@ -412,10 +412,11 @@ Copyright: SAP
 License: Apache-2.0
 License Text: https://github.com/SAP/openui5/blob/master/LICENSES/Apache-2.0.txt
 Contained in: src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/base/*.*
-	src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/theme-base/*.*
+	src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/theming/*.*
 	src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/localization/*.*
 	src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/icons/*.*
 	src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/icons-tnt/*.*
+	src/sap.ui.webc.common/src/sap/ui/webc/common/thirdparty/icons-business-suite/*.*
 
 Component: lit-html, version: 1.4.1
 Copyright: Google LLC

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openui5/sap.ui.webc.common",
-  "version": "1.96.2",
+  "version": "1.97.0",
   "description": "OpenUI5 UI Library sap.ui.webc.common",
   "author": "SAP SE (https://www.sap.com)",
   "license": "Apache-2.0",
@@ -16,6 +16,6 @@
     "url": "https://github.com/SAP/openui5.git"
   },
   "dependencies": {
-    "@openui5/sap.ui.core": "1.96.2"
+    "@openui5/sap.ui.core": "1.97.0"
   }
 }

package/src/sap/ui/webc/common/.library

@@ -3,7 +3,7 @@
 
 	<name>sap.ui.webc.common</name>
 	<vendor>SAP SE</vendor>
-	<version>1.96.2</version>
+	<version>1.97.0</version>
 	<copyright>OpenUI5
  * (c) Copyright 2009-2021 SAP SE or an SAP affiliate company.
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.</copyright>
@@ -31,10 +31,11 @@
 				<license url="https://github.com/SAP/ui5-webcomponents/blob/master/LICENSE.txt" type="Apache-2.0"></license>
 				<copyright>SAP</copyright>
 				<pattern>sap/ui/webc/common/thirdparty/base/*.*</pattern>
-				<pattern>sap/ui/webc/common/thirdparty/theme-base/*.*</pattern>
+				<pattern>sap/ui/webc/common/thirdparty/theming/*.*</pattern>
 				<pattern>sap/ui/webc/common/thirdparty/localization/*.*</pattern>
 				<pattern>sap/ui/webc/common/thirdparty/icons/*.*</pattern>
 				<pattern>sap/ui/webc/common/thirdparty/icons-tnt/*.*</pattern>
+				<pattern>sap/ui/webc/common/thirdparty/icons-business-suite/*.*</pattern>
 			</lib>
 			<lib name="lit-html" displayName="lit-html" version="1.4.1" homepage="https://lit-html.polymer-project.org">
 				<license url="https://github.com/lit/lit/blob/main/LICENSE" type="BSD-3-Clause"></license>

package/src/sap/ui/webc/common/Icons.js

@@ -2,7 +2,9 @@ sap.ui.define([
 	"./thirdparty/icons/Assets",
 	"./thirdparty/icons/AllIcons",
 	"./thirdparty/icons-tnt/Assets",
-	"./thirdparty/icons-tnt/AllIcons"
+	"./thirdparty/icons-tnt/AllIcons",
+	"./thirdparty/icons-business-suite/Assets",
+	"./thirdparty/icons-business-suite/AllIcons"
 ], function() {
 	"use strict";
 });

package/src/sap/ui/webc/common/WebComponent.js

@@ -104,7 +104,7 @@ sap.ui.define([
 		 *
 		 * @extends sap.ui.core.Control
 		 * @author SAP SE
-		 * @version 1.96.2
+		 * @version 1.97.0
 		 * @public
 		 * @since 1.92.0
 		 * @alias sap.ui.webc.common.WebComponent
@@ -123,15 +123,13 @@ sap.ui.define([
 				Control.apply(this, arguments);
 
 				this.__onInvalidationBound = this.__onInvalidation.bind(this);
+				this.__handleCustomEventBound = this.__handleCustomEvent.bind(this);
 
-				// After the DOM element is rendered for the first time, attach the invalidation callback (in __onAfterRenderingDelegate)
 				this.__delegates = {
+					onBeforeRendering: this.__onBeforeRenderingDelegate,
 					onAfterRendering: this.__onAfterRenderingDelegate
 				};
 				this.addDelegate(this.__delegates, true, this, false);
-
-				// Listen for all DOM events, described in the Component Wrapper's metadata
-				this.__attachCustomEventsListeners();
 			},
 
 			renderer: WebComponentRenderer
@@ -243,12 +241,19 @@ sap.ui.define([
 		};
 
 		/**
-		 * Implement the onInvalidation hook for each UI5 Web Component, and update __slot, if the component has an individual slot
+		 * @private
+		 */
+		WebComponent.prototype.__onBeforeRenderingDelegate = function() {
+			this.__detachCustomEventsListeners();
+		};
+
+		/**
 		 * @private
 		 */
 		WebComponent.prototype.__onAfterRenderingDelegate = function() {
-			var oDomRef = this.getDomRef();
+			this.__attachCustomEventsListeners();
 
+			var oDomRef = this.getDomRef();
 			window.customElements.whenDefined(oDomRef.localName).then(function() {
 				oDomRef.attachInvalidate(this.__onInvalidationBound);
 
@@ -297,16 +302,21 @@ sap.ui.define([
 			var oEvents = this.getMetadata().getEvents();
 			for (var sEventName in oEvents) {
 				var sCustomEventName = hyphenate(sEventName);
-				this.attachBrowserEvent(sCustomEventName, this.__handleCustomEvent, this);
+				this.getDomRef().addEventListener(sCustomEventName, this.__handleCustomEventBound);
 			}
 		};
 
 		WebComponent.prototype.__detachCustomEventsListeners = function() {
+			var oDomRef = this.getDomRef();
+			if (!oDomRef) {
+				return;
+			}
+
 			var oEvents = this.getMetadata().getEvents();
 			for (var sEventName in oEvents) {
 				if (oEvents.hasOwnProperty(sEventName)) {
 					var sCustomEventName = hyphenate(sEventName);
-					this.detachBrowserEvent(sCustomEventName, this.__handleCustomEvent, this);
+					oDomRef.removeEventListener(sCustomEventName, this.__handleCustomEventBound);
 				}
 			}
 		};
@@ -359,7 +369,6 @@ sap.ui.define([
 			return this.getDomRef()[name];
 		};
 
-
 		WebComponent.prototype.destroy = function() {
 			var oDomRef = this.getDomRef();
 			this.__detachCustomEventsListeners();

package/src/sap/ui/webc/common/WebComponentMetadata.js

@@ -22,7 +22,7 @@ sap.ui.define([
 		 *
 		 * @class
 		 * @author SAP SE
-		 * @version 1.96.2
+		 * @version 1.97.0
 		 * @since 1.92.0
 		 * @experimental Since 1.92.0 The API might change. It is not intended for productive usage yet!
 		 * @alias sap.ui.webc.common.WebComponentMetadata

package/src/sap/ui/webc/common/library.js

@@ -13,16 +13,17 @@ sap.ui.define([
 		"./Icons",
 		"./thirdparty/base/features/OpenUI5Support",
 		"./thirdparty/base/AssetRegistry",
-		"./thirdparty/base/CustomElementsScope"
+		"./thirdparty/base/CustomElementsScope",
+		"./thirdparty/base/CSP"
 	],
-	function(coreLibrary, DataType, Icons, OpenUI5Support, AssetRegistry, CustomElementsScope) {
+	function(coreLibrary, DataType, Icons, OpenUI5Support, AssetRegistry, CustomElementsScope, CSP) {
 
 	"use strict";
 
 	// delegate further initialization of this library to the Core
 	sap.ui.getCore().initLibrary({
 		name : "sap.ui.webc.common",
-		version: "1.96.2",
+		version: "1.97.0",
 		dependencies : ["sap.ui.core"],
 		noLibraryCSS: true,
 		designtime: "sap/ui/webc/common/designtime/library.designtime",
@@ -45,7 +46,7 @@ sap.ui.define([
 	 * @namespace
 	 * @alias sap.ui.webc
 	 * @author SAP SE
-	 * @version 1.96.2
+	 * @version 1.97.0
 	 * @public
 	 * @since 1.92.0
 	 * @experimental Since 1.92.0
@@ -57,7 +58,7 @@ sap.ui.define([
 	 * @namespace
 	 * @alias sap.ui.webc.common
 	 * @author SAP SE
-	 * @version 1.96.2
+	 * @version 1.97.0
 	 * @public
 	 * @since 1.92.0
 	 * @experimental Since 1.92.0
@@ -66,5 +67,10 @@ sap.ui.define([
 
 	CustomElementsScope.setCustomElementsScopingSuffix("ui5");
 
+	CSP.setUseLinks(!document.adoptedStyleSheets);
+	CSP.setPreloadLinks(false);
+	CSP.setPackageCSSRoot("@ui5/webcomponents-base", sap.ui.require.toUrl("sap/ui/webc/common/thirdparty/base/css/"));
+	CSP.setPackageCSSRoot("@ui5/webcomponents-theming", sap.ui.require.toUrl("sap/ui/webc/common/thirdparty/theming/css/"));
+
 	return thisLib;
 });

package/src/sap/ui/webc/common/thirdparty/base/CSP.js

@@ -0,0 +1,34 @@
+sap.ui.define(['exports'], function (exports) { 'use strict';
+
+	const roots = new Map();
+	let useLinks = false;
+	let preloadLinks = true;
+	const setPackageCSSRoot = (packageName, root) => {
+		roots.set(packageName, root);
+	};
+	const getUrl = (packageName, path) => {
+		return `${roots.get(packageName)}${path}`;
+	};
+	const setUseLinks = use => {
+		useLinks = use;
+	};
+	const setPreloadLinks = preload => {
+		preloadLinks = preload;
+	};
+	const shouldUseLinks = () => {
+		return useLinks;
+	};
+	const shouldPreloadLinks = () => {
+		return preloadLinks;
+	};
+
+	exports.getUrl = getUrl;
+	exports.setPackageCSSRoot = setPackageCSSRoot;
+	exports.setPreloadLinks = setPreloadLinks;
+	exports.setUseLinks = setUseLinks;
+	exports.shouldPreloadLinks = shouldPreloadLinks;
+	exports.shouldUseLinks = shouldUseLinks;
+
+	Object.defineProperty(exports, '__esModule', { value: true });
+
+});

package/src/sap/ui/webc/common/thirdparty/base/Device.js

@@ -74,8 +74,12 @@ sap.ui.define(['exports'], function (exports) { 'use strict';
 	const isDesktop = () => {
 		return (!isTablet() && !isPhone()) || isWindows8OrAbove();
 	};
+	const isCombi = () => {
+		return isTablet() && isDesktop();
+	};
 
 	exports.isChrome = isChrome;
+	exports.isCombi = isCombi;
 	exports.isDesktop = isDesktop;
 	exports.isIE = isIE;
 	exports.isPhone = isPhone;

package/src/sap/ui/webc/common/thirdparty/base/EventProvider.js

@@ -17,11 +17,14 @@ sap.ui.define(function () { 'use strict';
 		}
 		detachEvent(eventName, fnFunction) {
 			const eventRegistry = this._eventRegistry;
-			let eventListeners = eventRegistry.get(eventName);
+			const eventListeners = eventRegistry.get(eventName);
 			if (!eventListeners) {
 				return;
 			}
-			eventListeners = eventListeners.filter(fn => fn !== fnFunction);
+			const indexOfFnToDetach = eventListeners.indexOf(fnFunction);
+			if (indexOfFnToDetach !== -1) {
+				eventListeners.splice(indexOfFnToDetach, 1);
+			}
 			if (eventListeners.length === 0) {
 				eventRegistry.delete(eventName);
 			}

package/src/sap/ui/webc/common/thirdparty/base/FontFace.js

@@ -1,58 +1,5 @@
-sap.ui.define(['./util/createStyleInHead', './FeaturesRegistry'], function (createStyleInHead, FeaturesRegistry) { 'use strict';
+sap.ui.define(['./ManagedStyles', './FeaturesRegistry', './generated/css/FontFace.css', './generated/css/OverrideFontFace.css'], function (ManagedStyles, FeaturesRegistry, FontFace_css, OverrideFontFace_css) { 'use strict';
 
-	const font72RegularWoff = `https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Regular.woff?ui5-webcomponents`;
-	const font72RegularWoff2 = `https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Regular.woff2?ui5-webcomponents`;
-	const font72RegularFullWoff = `https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Regular-full.woff?ui5-webcomponents`;
-	const font72RegularFullWoff2 = `https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Regular-full.woff2?ui5-webcomponents`;
-	const font72BoldWoff = `https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold.woff?ui5-webcomponents`;
-	const font72BoldWoff2 = `https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold.woff2?ui5-webcomponents`;
-	const font72BoldFullWoff = `https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold-full.woff?ui5-webcomponents`;
-	const font72BoldFullWoff2 = `https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold-full.woff2?ui5-webcomponents`;
-	const fontFaceCSS = `
-	@font-face {
-		font-family: "72";
-		font-style: normal;
-		font-weight: 400;
-		src: local("72"),
-			url(${font72RegularWoff2}) format("woff2"),
-			url(${font72RegularWoff}) format("woff");
-	}
-	
-	@font-face {
-		font-family: "72full";
-		font-style: normal;
-		font-weight: 400;
-		src: local('72-full'),
-			url(${font72RegularFullWoff2}) format("woff2"),
-			url(${font72RegularFullWoff}) format("woff");
-		
-	}
-	
-	@font-face {
-		font-family: "72";
-		font-style: normal;
-		font-weight: 700;
-		src: local('72-Bold'),
-			url(${font72BoldWoff2}) format("woff2"),
-			url(${font72BoldWoff}) format("woff");
-	}
-	
-	@font-face {
-		font-family: "72full";
-		font-style: normal;
-		font-weight: 700;
-		src: local('72-Bold-full'),
-			url(${font72BoldFullWoff2}) format("woff2"),
-			url(${font72BoldFullWoff}) format("woff");
-	}
-`;
-	const overrideFontFaceCSS = `
-	@font-face {
-		font-family: '72override';
-		unicode-range: U+0102-0103, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EB7, U+1EB8-1EC7, U+1EC8-1ECB, U+1ECC-1EE3, U+1EE4-1EF1, U+1EF4-1EF7;
-		src: local('Arial'), local('Helvetica'), local('sans-serif');
-	}
-`;
 	const insertFontFace = () => {
 		const OpenUI5Support = FeaturesRegistry.getFeature("OpenUI5Support");
 		if (!OpenUI5Support || !OpenUI5Support.isLoaded()) {
@@ -61,13 +8,13 @@ sap.ui.define(['./util/createStyleInHead', './FeaturesRegistry'], function (crea
 		insertOverrideFontFace();
 	};
 	const insertMainFontFace = () => {
-		if (!document.querySelector(`head>style[data-ui5-font-face]`)) {
-			createStyleInHead(fontFaceCSS, { "data-ui5-font-face": "" });
+		if (!ManagedStyles.hasStyle("data-ui5-font-face")) {
+			ManagedStyles.createStyle(FontFace_css, "data-ui5-font-face");
 		}
 	};
 	const insertOverrideFontFace = () => {
-		if (!document.querySelector(`head>style[data-ui5-font-face-override]`)) {
-			createStyleInHead(overrideFontFaceCSS, { "data-ui5-font-face-override": "" });
+		if (!ManagedStyles.hasStyle("data-ui5-font-face-override")) {
+			ManagedStyles.createStyle(OverrideFontFace_css, "data-ui5-font-face-override");
 		}
 	};
 

package/src/sap/ui/webc/common/thirdparty/base/InitialConfiguration.js

@@ -10,7 +10,6 @@ sap.ui.define(['exports', './thirdparty/merge', './FeaturesRegistry', './generat
 		noConflict: false,
 		formatSettings: {},
 		fetchDefaultLanguage: false,
-		assetsPath: "",
 	};
 	const getAnimationMode = () => {
 		initConfiguration();
@@ -44,10 +43,6 @@ sap.ui.define(['exports', './thirdparty/merge', './FeaturesRegistry', './generat
 		initConfiguration();
 		return initialConfig.formatSettings;
 	};
-	const getAssetsPath = () => {
-		initConfiguration();
-		return initialConfig.assetsPath;
-	};
 	const booleanMapping = new Map();
 	booleanMapping.set("true", true);
 	booleanMapping.set("false", false);
@@ -81,12 +76,19 @@ sap.ui.define(['exports', './thirdparty/merge', './FeaturesRegistry', './generat
 			applyURLParam(key, value, "sap-ui");
 		});
 	};
+	const normalizeParamValue = (param, value) => {
+		if (param === "theme" && value.includes("@")) {
+			return value.split("@")[0];
+		}
+		return value;
+	};
 	const applyURLParam = (key, value, paramType) => {
 		const lowerCaseValue = value.toLowerCase();
 		const param = key.split(`${paramType}-`)[1];
 		if (booleanMapping.has(value)) {
 			value = booleanMapping.get(lowerCaseValue);
 		}
+		value = normalizeParamValue(param, value);
 		initialConfig[param] = value;
 	};
 	const applyOpenUI5Configuration = () => {
@@ -108,7 +110,6 @@ sap.ui.define(['exports', './thirdparty/merge', './FeaturesRegistry', './generat
 	};
 
 	exports.getAnimationMode = getAnimationMode;
-	exports.getAssetsPath = getAssetsPath;
 	exports.getCalendarType = getCalendarType;
 	exports.getFetchDefaultLanguage = getFetchDefaultLanguage;
 	exports.getFormatSettings = getFormatSettings;

package/src/sap/ui/webc/common/thirdparty/base/ManagedStyles.js

@@ -0,0 +1,74 @@
+sap.ui.define(['exports', './util/createStyleInHead', './util/createLinkInHead', './CSP'], function (exports, createStyleInHead, createLinkInHead, CSP) { 'use strict';
+
+	const getStyleId = (name, value) => {
+		return value ? `${name}|${value}` : name;
+	};
+	const createStyle = (data, name, value = "") => {
+		const content = typeof data === "string" ? data : data.content;
+		if (CSP.shouldUseLinks()) {
+			const attributes = {};
+			attributes[name] = value;
+			const href = CSP.getUrl(data.packageName, data.fileName);
+			createLinkInHead(href, attributes);
+		} else if (document.adoptedStyleSheets) {
+			const stylesheet = new CSSStyleSheet();
+			stylesheet.replaceSync(content);
+			stylesheet._ui5StyleId = getStyleId(name, value);
+			document.adoptedStyleSheets = [...document.adoptedStyleSheets, stylesheet];
+		} else {
+			const attributes = {};
+			attributes[name] = value;
+			createStyleInHead(content, attributes);
+		}
+	};
+	const updateStyle = (data, name, value = "") => {
+		const content = typeof data === "string" ? data : data.content;
+		if (CSP.shouldUseLinks()) {
+			document.querySelector(`head>link[${name}="${value}"]`).href = CSP.getUrl(data.packageName, data.fileName);
+		} else if (document.adoptedStyleSheets) {
+			document.adoptedStyleSheets.find(sh => sh._ui5StyleId === getStyleId(name, value)).replaceSync(content || "");
+		} else {
+			document.querySelector(`head>style[${name}="${value}"]`).textContent = content || "";
+		}
+	};
+	const hasStyle = (name, value = "") => {
+		if (CSP.shouldUseLinks()) {
+			return !!document.querySelector(`head>link[${name}="${value}"]`);
+		}
+		if (document.adoptedStyleSheets) {
+			return !!document.adoptedStyleSheets.find(sh => sh._ui5StyleId === getStyleId(name, value));
+		}
+		return !!document.querySelector(`head>style[${name}="${value}"]`);
+	};
+	const removeStyle = (name, value = "") => {
+		if (CSP.shouldUseLinks()) {
+			const linkElement = document.querySelector(`head>link[${name}="${value}"]`);
+			if (linkElement) {
+				linkElement.parentElement.removeChild(linkElement);
+			}
+		} else if (document.adoptedStyleSheets) {
+			document.adoptedStyleSheets = document.adoptedStyleSheets.filter(sh => sh._ui5StyleId !== getStyleId(name, value));
+		} else {
+			const styleElement = document.querySelector(`head > style[${name}="${value}"]`);
+			if (styleElement) {
+				styleElement.parentElement.removeChild(styleElement);
+			}
+		}
+	};
+	const createOrUpdateStyle = (data, name, value = "") => {
+		if (hasStyle(name, value)) {
+			updateStyle(data, name, value);
+		} else {
+			createStyle(data, name, value);
+		}
+	};
+
+	exports.createOrUpdateStyle = createOrUpdateStyle;
+	exports.createStyle = createStyle;
+	exports.hasStyle = hasStyle;
+	exports.removeStyle = removeStyle;
+	exports.updateStyle = updateStyle;
+
+	Object.defineProperty(exports, '__esModule', { value: true });
+
+});

package/src/sap/ui/webc/common/thirdparty/base/SystemCSSVars.js

@@ -1,29 +1,9 @@
-sap.ui.define(['./util/createStyleInHead'], function (createStyleInHead) { 'use strict';
+sap.ui.define(['./ManagedStyles', './generated/css/SystemCSSVars.css'], function (ManagedStyles, SystemCSSVars_css) { 'use strict';
 
-	const systemCSSVars = `
-	:root {
-		--_ui5_content_density:cozy;
-	}
-	
-	[data-ui5-compact-size],
-	.ui5-content-density-compact,
-	.sapUiSizeCompact {
-		--_ui5_content_density:compact;
-	}
-	
-	[dir="rtl"] {
-		--_ui5_dir:rtl;
-	}
-	
-	[dir="ltr"] {
-		--_ui5_dir:ltr;
-	}
-`;
 	const insertSystemCSSVars = () => {
-		if (document.querySelector(`head>style[data-ui5-system-css-vars]`)) {
-			return;
+		if (!ManagedStyles.hasStyle("data-ui5-system-css-vars")) {
+			ManagedStyles.createStyle(SystemCSSVars_css, "data-ui5-system-css-vars");
 		}
-		createStyleInHead(systemCSSVars, { "data-ui5-system-css-vars": "" });
 	};
 
 	return insertSystemCSSVars;

package/src/sap/ui/webc/common/thirdparty/base/UI5Element.js

@@ -1,4 +1,4 @@
-sap.ui.define(['./thirdparty/merge', './Boot', './UI5ElementMetadata', './EventProvider', './util/getSingletonElementInstance', './StaticAreaItem', './updateShadowRoot', './Render', './CustomElementsRegistry', './DOMObserver', './config/NoConflict', './locale/getEffectiveDir', './types/DataType', './util/StringHelper', './util/isValidPropertyName', './util/isDescendantOf', './util/SlotsHelper', './util/arraysAreEqual', './util/getClassCopy', './locale/RTLAwareRegistry', './isLegacyBrowser'], function (merge, Boot, UI5ElementMetadata, EventProvider, getSingletonElementInstance, StaticAreaItem, updateShadowRoot, Render, CustomElementsRegistry, DOMObserver, NoConflict, getEffectiveDir, DataType, StringHelper, isValidPropertyName, isDescendantOf, SlotsHelper, arraysAreEqual, getClassCopy, RTLAwareRegistry, isLegacyBrowser) { 'use strict';
+sap.ui.define(['./thirdparty/merge', './Boot', './UI5ElementMetadata', './EventProvider', './util/getSingletonElementInstance', './StaticAreaItem', './updateShadowRoot', './Render', './CustomElementsRegistry', './DOMObserver', './config/NoConflict', './locale/getEffectiveDir', './types/DataType', './util/StringHelper', './util/isValidPropertyName', './util/isDescendantOf', './util/SlotsHelper', './util/arraysAreEqual', './util/getClassCopy', './locale/RTLAwareRegistry', './theming/preloadLinks'], function (merge, Boot, UI5ElementMetadata, EventProvider, getSingletonElementInstance, StaticAreaItem, updateShadowRoot, Render, CustomElementsRegistry, DOMObserver, NoConflict, getEffectiveDir, DataType, StringHelper, isValidPropertyName, isDescendantOf, SlotsHelper, arraysAreEqual, getClassCopy, RTLAwareRegistry, preloadLinks) { 'use strict';
 
 	let autoId = 0;
 	const elementTimeouts = new Map();
@@ -323,15 +323,11 @@ sap.ui.define(['./thirdparty/merge', './Boot', './UI5ElementMetadata', './EventP
 			if (!this.shadowRoot || this.shadowRoot.children.length === 0) {
 				return;
 			}
-			this._assertShadowRootStructure();
-			return this.shadowRoot.children.length === 1
-				? this.shadowRoot.children[0] : this.shadowRoot.children[1];
-		}
-		_assertShadowRootStructure() {
-			const expectedChildrenCount = document.adoptedStyleSheets || isLegacyBrowser() ? 1 : 2;
-			if (this.shadowRoot.children.length !== expectedChildrenCount) {
+			const children = [...this.shadowRoot.children].filter(child => !["link", "style"].includes(child.localName));
+			if (children.length !== 1) {
 				console.warn(`The shadow DOM for ${this.constructor.getMetadata().getTag()} does not have a top level element, the getDomRef() method might not work as expected`);
 			}
+			return children[0];
 		}
 		getFocusDomRef() {
 			const domRef = this.getDomRef();
@@ -537,6 +533,7 @@ sap.ui.define(['./thirdparty/merge', './Boot', './UI5ElementMetadata', './EventP
 				this._generateAccessors();
 				CustomElementsRegistry.registerTag(tag);
 				window.customElements.define(tag, this);
+				preloadLinks(this);
 				if (altTag && !customElements.get(altTag)) {
 					CustomElementsRegistry.registerTag(altTag);
 					window.customElements.define(altTag, getClassCopy(this, () => {

package/src/sap/ui/webc/common/thirdparty/base/asset-registries/Illustrations.js

@@ -2,8 +2,8 @@ sap.ui.define(['exports', '../getSharedResource'], function (exports, getSharedR
 
 	const registry = getSharedResource("SVGIllustration.registry", new Map());
 	const ILLUSTRATION_NOT_FOUND = "ILLUSTRATION_NOT_FOUND";
-	const registerIllustration = (name, { dialogSvg, sceneSvg, spotSvg, title, subtitle } = {}) => {
-		registry.set(name, {
+	const registerIllustration = (name, { dialogSvg, sceneSvg, spotSvg, set, title, subtitle } = {}) => {
+		registry.set(`${set}/${name}`, {
 			dialogSvg,
 			sceneSvg,
 			spotSvg,
@@ -12,7 +12,12 @@ sap.ui.define(['exports', '../getSharedResource'], function (exports, getSharedR
 		});
 	};
 	const getIllustrationDataSync = nameProp => {
-		return registry.get(nameProp) || ILLUSTRATION_NOT_FOUND;
+		let set = "fiori";
+		if (nameProp.startsWith("Tnt")) {
+			set = "tnt";
+			nameProp = nameProp.replace(/^Tnt/, "");
+		}
+		return registry.get(`${set}/${nameProp}`) || ILLUSTRATION_NOT_FOUND;
 	};
 
 	exports.getIllustrationDataSync = getIllustrationDataSync;

package/src/sap/ui/webc/common/thirdparty/base/asset-registries/LocaleData.js

@@ -12,10 +12,13 @@ sap.ui.define(['exports', '../locale/languageChange', '../locale/getLocale', '..
 		"sh": "sr",
 	};
 	const _showAssetsWarningOnce = localeId => {
-		if (!warningShown) {
+		if (warningShown) {
+			return;
+		}
+		{
 			console.warn(`[LocaleData] Supported locale "${localeId}" not configured, import the "Assets.js" module from the webcomponents package you are using.`);
-			warningShown = true;
 		}
+		warningShown = true;
 	};
 	const calcLocale = (language, region, script) => {
 		language = (language && M_ISO639_OLD_TO_NEW[language]) || language;

package/src/sap/ui/webc/common/thirdparty/base/css/FontFace.css

@@ -0,0 +1,45 @@
+@font-face {
+    font-family: "72";
+    font-style: normal;
+    font-weight: 400;
+    src: local("72"),
+    url(https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Regular.woff?ui5-webcomponents) format("woff2"),
+    url(https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Regular.woff2?ui5-webcomponents) format("woff");
+}
+
+@font-face {
+    font-family: "72full";
+    font-style: normal;
+    font-weight: 400;
+    src: local('72-full'),
+    url(https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Regular-full.woff?ui5-webcomponents) format("woff2"),
+    url(https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Regular-full.woff2?ui5-webcomponents) format("woff");
+
+}
+
+@font-face {
+    font-family: "72";
+    font-style: normal;
+    font-weight: 700;
+    src: local('72-Bold'),
+    url(https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold.woff?ui5-webcomponents) format("woff2"),
+    url(https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold.woff2?ui5-webcomponents) format("woff");
+}
+
+@font-face {
+    font-family: "72full";
+    font-style: normal;
+    font-weight: 700;
+    src: local('72-Bold-full'),
+    url(https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold-full.woff?ui5-webcomponents) format("woff2"),
+    url(https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold-full.woff2?ui5-webcomponents) format("woff");
+}
+
+@font-face {
+    font-family: "72Black";
+    font-style: bold;
+    font-weight: 900;
+    src: local('72Black'),
+    url(https://openui5nightly.hana.ondemand.com/resources/sap/ui/core/themes/sap_horizon/fonts/72-Black.woff?ui5-webcomponents) format("woff2"),
+    url(https://openui5nightly.hana.ondemand.com/resources/sap/ui/core/themes/sap_horizon/fonts/72-Black.woff2?ui5-webcomponents) format("woff");
+}