@ui5/webcomponents-base 1.1.2 → 1.2.2

package/dist/util/InvisibleMessage.js

@@ -5,18 +5,20 @@ import { attachBoot } from "../Boot.js";
 let politeSpan;
 let assertiveSpan;
 
+const setOutOfViewportStyles = el => {
+	el.style.position = "absolute";
+	el.style.clip = "rect(1px,1px,1px,1px)";
+	el.style.userSelect = "none";
+	el.style.left = "-1000px";
+	el.style.top = "-1000px";
+	el.style.pointerEvents = "none";
+};
+
 attachBoot(() => {
 	if (politeSpan && assertiveSpan) {
 		return;
 	}
 
-	const styles = `position: absolute;
-	clip: rect(1px,1px,1px,1px);
-	user-select: none;
-	left: -1000px;
-	top: -1000px;
-	pointer-events: none;`;
-
 	politeSpan = document.createElement("span");
 	assertiveSpan = document.createElement("span");
 
@@ -29,8 +31,8 @@ attachBoot(() => {
 	politeSpan.setAttribute("role", "alert");
 	assertiveSpan.setAttribute("role", "alert");
 
-	politeSpan.style.cssText = styles;
-	assertiveSpan.style.cssText = styles;
+	setOutOfViewportStyles(politeSpan);
+	setOutOfViewportStyles(assertiveSpan);
 
 	getSingletonElementInstance("ui5-static-area").appendChild(politeSpan);
 	getSingletonElementInstance("ui5-static-area").appendChild(assertiveSpan);

package/dist/util/TabbableElements.js

@@ -27,6 +27,10 @@ const getTabbables = (nodes, tabbables) => {
 			currentNode = Array.from(children).find(node => node.tagName !== "STYLE");
 		}
 
+		if (!currentNode) {
+			return;
+		}
+
 		if (isNodeTabbable(currentNode)) {
 			tabbablesNodes.push(currentNode);
 		}

package/hash.txt

@@ -1 +1 @@
-8tp6F3Mz0kW7xUTtxVN0BiPw7WM=
+46lbK6+vsQuteRCCbgMD8Xa14pY=

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ui5/webcomponents-base",
-  "version": "1.1.2",
+  "version": "1.2.2",
   "description": "UI5 Web Components: webcomponents.base",
   "author": "SAP SE (https://www.sap.com)",
   "license": "Apache-2.0",
@@ -37,8 +37,8 @@
   "devDependencies": {
     "@buxlabs/amd-to-es6": "0.16.1",
     "@openui5/sap.ui.core": "1.94.0",
-    "@ui5/webcomponents-tools": "1.1.2",
-    "chromedriver": "96.0.0",
+    "@ui5/webcomponents-tools": "1.2.2",
+    "chromedriver": "99.0.0",
     "clean-css": "^5.2.2",
     "copy-and-watch": "^0.1.5",
     "eslint": "^7.22.0",

package/src/Boot.js

@@ -1,4 +1,3 @@
-import EventProvider from "./EventProvider.js";
 import whenDOMReady from "./util/whenDOMReady.js";
 import insertFontFace from "./FontFace.js";
 import insertSystemCSSVars from "./SystemCSSVars.js";
@@ -8,15 +7,15 @@ import { registerCurrentRuntime } from "./Runtimes.js";
 import { getFeature } from "./FeaturesRegistry.js";
 
 let bootPromise;
-const eventProvider = new EventProvider();
 
 /**
  * Attach a callback that will be executed on boot
  * @public
  * @param listener
  */
-const attachBoot = listener => {
-	eventProvider.attachEvent("boot", listener);
+const attachBoot = async listener => {
+	await boot();
+	listener();
 };
 
 const boot = async () => {
@@ -46,7 +45,6 @@ const boot = async () => {
 		OpenUI5Support && OpenUI5Support.attachListeners();
 		insertFontFace();
 		insertSystemCSSVars();
-		await eventProvider.fireEventAsync("boot");
 
 		resolve();
 	});

package/src/Keys.js

@@ -153,8 +153,12 @@ const isEnd = event => (event.key ? event.key === "End" : event.keyCode === KeyC
 
 const isHomeCtrl = event => (event.key ? event.key === "Home" : event.keyCode === KeyCodes.HOME) && checkModifierKeys(event, true, false, false);
 
+const isHomeShift = event => (event.key ? event.key === "Home" : event.keyCode === KeyCodes.HOME) && checkModifierKeys(event, false, false, true);
+
 const isEndCtrl = event => (event.key ? event.key === "End" : event.keyCode === KeyCodes.END) && checkModifierKeys(event, true, false, false);
 
+const isEndShift = event => (event.key ? event.key === "End" : event.keyCode === KeyCodes.END) && checkModifierKeys(event, false, false, true);
+
 const isEscape = event => (event.key ? event.key === "Escape" || event.key === "Esc" : event.keyCode === KeyCodes.ESCAPE) && !hasModifierKeys(event);
 
 const isTabNext = event => (event.key ? event.key === "Tab" : event.keyCode === KeyCodes.TAB) && !hasModifierKeys(event);
@@ -213,6 +217,8 @@ const isShowByArrows = event => {
 
 const isShift = event => event.key === "Shift" || event.keyCode === KeyCodes.SHIFT;
 
+const isCtrlA = event => ((event.key === "A" || event.key === "a") || event.which === KeyCodes.A) && checkModifierKeys(event, true, false, false);
+
 const hasModifierKeys = event => event.shiftKey || event.altKey || getCtrlKey(event);
 
 const getCtrlKey = event => !!(event.metaKey || event.ctrlKey); // double negation doesn't have effect on boolean but ensures null and undefined are equivalent to false.
@@ -248,6 +254,8 @@ export {
 	isMinus,
 	isHomeCtrl,
 	isEndCtrl,
+	isHomeShift,
+	isEndShift,
 	isEscape,
 	isTabNext,
 	isTabPrevious,
@@ -268,4 +276,5 @@ export {
 	isPageUpShiftCtrl,
 	isPageDownShiftCtrl,
 	isShift,
+	isCtrlA,
 };

package/src/asset-registries/Icons.js

@@ -1,6 +1,6 @@
 import getSharedResource from "../getSharedResource.js";
 import IconCollectionsAlias from "../assets-meta/IconCollectionsAlias.js";
-import { isTheme } from "../config/Theme.js";
+import { isThemeFamily } from "../config/Theme.js";
 
 const loaders = new Map();
 const registry = getSharedResource("SVGIcons.registry", new Map());
@@ -118,7 +118,7 @@ const _getRegisteredNames = async () => {
 };
 
 const _getDefaultCollection = () => {
-	return isTheme("sap_horizon") ? "SAP-icons-v5" : "SAP-icons";
+	return isThemeFamily("sap_horizon") ? "SAP-icons-v5" : "SAP-icons";
 };
 
 const _normalizeCollection = collectionName => {

package/src/asset-registries/LocaleData.js

@@ -13,7 +13,6 @@ const M_ISO639_OLD_TO_NEW = {
 	"iw": "he",
 	"ji": "yi",
 	"in": "id",
-	"sh": "sr",
 };
 
 const DEV_MODE = false;
@@ -48,6 +47,12 @@ const calcLocale = (language, region, script) => {
 		}
 	}
 
+	// Special case 3: for Serbian, there are cyrillic and latin scripts, "sh" and "sr-latn" map to "latin", "sr" maps to cyrillic.
+	if (language === "sh" || (language === "sr" && script === "Latn")) {
+		language = "sr";
+		region = "Latn";
+	}
+
 	// try language + region
 	let localeId = `${language}_${region}`;
 	if (SUPPORTED_LOCALES.includes(localeId)) {

package/src/config/Theme.js

@@ -35,8 +35,19 @@ const isTheme = _theme => {
 	return currentTheme === _theme || currentTheme === `${_theme}_exp`;
 };
 
+/**
+ * Returns if the current theme is part of given theme family
+ * @private
+ * @param {String} the theme family
+ * @returns {boolean}
+ */
+const isThemeFamily = _theme => {
+	return getTheme().startsWith(_theme);
+};
+
 export {
 	getTheme,
 	setTheme,
 	isTheme,
+	isThemeFamily,
 };

package/src/css/FontFace.css

@@ -35,6 +35,36 @@
     url(https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold-full.woff?ui5-webcomponents) format("woff");
 }
 
+@font-face {
+    font-family: '72-Bold';
+    font-style: normal;
+    src: local('72-Bold'),
+    url(https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold.woff2?ui5-webcomponents) format("woff2"),
+    url(https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold.woff?ui5-webcomponents) format("woff");
+}
+
+@font-face {
+    font-family: '72-Boldfull';
+    font-style: normal;
+    src: url(https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold-full.woff2?ui5-webcomponents) format("woff2"),
+         url(https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Bold-full.woff?ui5-webcomponents) format("woff");
+}
+
+@font-face {
+    font-family: '72-Light';
+    font-style: normal;
+    src: local('72-Light'),
+        url(https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Light.woff2?ui5-webcomponents) format("woff2"),
+        url(https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Light.woff?ui5-webcomponents) format("woff");
+}
+
+@font-face {
+    font-family: '72-Lightfull';
+    font-style: normal;
+    src: url(https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Light-full.woff2?ui5-webcomponents) format("woff2"),
+    url(https://ui5.sap.com/sdk/resources/sap/ui/core/themes/sap_fiori_3/fonts/72-Light-full.woff?ui5-webcomponents) format("woff");
+}
+
 @font-face {
     font-family: "72Black";
     font-style: bold;

package/src/util/InvisibleMessage.js

@@ -5,18 +5,20 @@ import { attachBoot } from "../Boot.js";
 let politeSpan;
 let assertiveSpan;
 
+const setOutOfViewportStyles = el => {
+	el.style.position = "absolute";
+	el.style.clip = "rect(1px,1px,1px,1px)";
+	el.style.userSelect = "none";
+	el.style.left = "-1000px";
+	el.style.top = "-1000px";
+	el.style.pointerEvents = "none";
+};
+
 attachBoot(() => {
 	if (politeSpan && assertiveSpan) {
 		return;
 	}
 
-	const styles = `position: absolute;
-	clip: rect(1px,1px,1px,1px);
-	user-select: none;
-	left: -1000px;
-	top: -1000px;
-	pointer-events: none;`;
-
 	politeSpan = document.createElement("span");
 	assertiveSpan = document.createElement("span");
 
@@ -29,8 +31,8 @@ attachBoot(() => {
 	politeSpan.setAttribute("role", "alert");
 	assertiveSpan.setAttribute("role", "alert");
 
-	politeSpan.style.cssText = styles;
-	assertiveSpan.style.cssText = styles;
+	setOutOfViewportStyles(politeSpan);
+	setOutOfViewportStyles(assertiveSpan);
 
 	getSingletonElementInstance("ui5-static-area").appendChild(politeSpan);
 	getSingletonElementInstance("ui5-static-area").appendChild(assertiveSpan);

package/src/util/TabbableElements.js

@@ -27,6 +27,10 @@ const getTabbables = (nodes, tabbables) => {
 			currentNode = Array.from(children).find(node => node.tagName !== "STYLE");
 		}
 
+		if (!currentNode) {
+			return;
+		}
+
 		if (isNodeTabbable(currentNode)) {
 			tabbablesNodes.push(currentNode);
 		}