@ui5/webcomponents-base 0.0.0-2db62badf → 0.0.0-2f7664755

package/dist/util/isElementHidden.js

@@ -0,0 +1,8 @@
+const isElementHidden = (el) => {
+    if (el.nodeName === "SLOT") {
+        return false;
+    }
+    return (el.offsetWidth <= 0 && el.offsetHeight <= 0) || (el.style && el.style.visibility === "hidden");
+};
+export default isElementHidden;
+//# sourceMappingURL=isElementHidden.js.map

package/dist/util/isElementHidden.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"isElementHidden.js","sourceRoot":"","sources":["../../src/util/isElementHidden.ts"],"names":[],"mappings":"AAAA,MAAM,eAAe,GAAG,CAAC,EAAe,EAAE,EAAE;IAC3C,IAAI,EAAE,CAAC,QAAQ,KAAK,MAAM,EAAE;QAC3B,OAAO,KAAK,CAAC;KACb;IAED,OAAO,CAAC,EAAE,CAAC,WAAW,IAAI,CAAC,IAAI,EAAE,CAAC,YAAY,IAAI,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,KAAK,IAAI,EAAE,CAAC,KAAK,CAAC,UAAU,KAAK,QAAQ,CAAC,CAAC;AACxG,CAAC,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/dist/util/isElementInView.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Determines if the element is within the viewport.
+ * @param el {HTMLElement}
+ */
+declare const isElementInView: (el: HTMLElement) => boolean;
+export default isElementInView;

package/dist/util/isElementInView.js

@@ -0,0 +1,12 @@
+/**
+ * Determines if the element is within the viewport.
+ * @param el {HTMLElement}
+ */
+const isElementInView = (el) => {
+    const rect = el.getBoundingClientRect();
+    return (rect.top >= 0 && rect.left >= 0
+        && rect.bottom <= (window.innerHeight || document.documentElement.clientHeight)
+        && rect.right <= (window.innerWidth || document.documentElement.clientWidth));
+};
+export default isElementInView;
+//# sourceMappingURL=isElementInView.js.map

package/dist/util/isElementInView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"isElementInView.js","sourceRoot":"","sources":["../../src/util/isElementInView.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,MAAM,eAAe,GAAG,CAAC,EAAe,EAAE,EAAE;IAC3C,MAAM,IAAI,GAAG,EAAE,CAAC,qBAAqB,EAAE,CAAC;IAExC,OAAO,CACN,IAAI,CAAC,GAAG,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,IAAI,CAAC;WAC3B,IAAI,CAAC,MAAM,IAAI,CAAC,MAAM,CAAC,WAAW,IAAI,QAAQ,CAAC,eAAe,CAAC,YAAY,CAAC;WAC5E,IAAI,CAAC,KAAK,IAAI,CAAC,MAAM,CAAC,UAAU,IAAI,QAAQ,CAAC,eAAe,CAAC,WAAW,CAAC,CAC7E,CAAC;AACH,CAAC,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/dist/util/isElementTabbable.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Returns if the HTMLElement is tabbable.
+ *
+ * @public
+ * @param { HTMLElement } el the component to operate on (component that slots or contains within its shadow root the items the user navigates among)
+ * @returns { boolean } true if the element is tabbable or false - if not
+ */
+declare const isElementTabbable: (el: HTMLElement) => boolean;
+export default isElementTabbable;

package/dist/util/isElementTabbable.js

@@ -0,0 +1,30 @@
+import isElementHidden from "./isElementHidden.js";
+/**
+ * Returns if the HTMLElement is tabbable.
+ *
+ * @public
+ * @param { HTMLElement } el the component to operate on (component that slots or contains within its shadow root the items the user navigates among)
+ * @returns { boolean } true if the element is tabbable or false - if not
+ */
+const isElementTabbable = (el) => {
+    if (!el) {
+        return false;
+    }
+    const nodeName = el.nodeName.toLowerCase();
+    if (el.hasAttribute("data-sap-no-tab-ref")) {
+        return false;
+    }
+    if (isElementHidden(el)) {
+        return false;
+    }
+    const tabIndex = el.getAttribute("tabindex");
+    if (tabIndex !== null && tabIndex !== undefined) {
+        return parseInt(tabIndex) >= 0;
+    }
+    if (nodeName === "a" || /input|select|textarea|button|object/.test(nodeName)) {
+        return !el.disabled;
+    }
+    return false;
+};
+export default isElementTabbable;
+//# sourceMappingURL=isElementTabbable.js.map

package/dist/util/isElementTabbable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"isElementTabbable.js","sourceRoot":"","sources":["../../src/util/isElementTabbable.ts"],"names":[],"mappings":"AAAA,OAAO,eAAe,MAAM,sBAAsB,CAAC;AAEnD;;;;;;GAMG;AACH,MAAM,iBAAiB,GAAG,CAAC,EAAe,EAAW,EAAE;IACtD,IAAI,CAAC,EAAE,EAAE;QACR,OAAO,KAAK,CAAC;KACb;IAED,MAAM,QAAQ,GAAG,EAAE,CAAC,QAAQ,CAAC,WAAW,EAAE,CAAC;IAE3C,IAAI,EAAE,CAAC,YAAY,CAAC,qBAAqB,CAAC,EAAE;QAC3C,OAAO,KAAK,CAAC;KACb;IAED,IAAI,eAAe,CAAC,EAAE,CAAC,EAAE;QACxB,OAAO,KAAK,CAAC;KACb;IAED,MAAM,QAAQ,GAAG,EAAE,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC;IAC7C,IAAI,QAAQ,KAAK,IAAI,IAAI,QAAQ,KAAK,SAAS,EAAE;QAChD,OAAO,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;KAC/B;IAED,IAAI,QAAQ,KAAK,GAAG,IAAI,qCAAqC,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE;QAC7E,OAAO,CAAE,EAAsB,CAAC,QAAQ,CAAC;KACzC;IAED,OAAO,KAAK,CAAC;AACd,CAAC,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/dist/util/isValidPropertyName.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Checks whether a property name is valid (does not collide with existing DOM API properties)
+ *
+ * @param name
+ * @returns {boolean}
+ */
+declare const isValidPropertyName: (name: string) => boolean;
+export default isValidPropertyName;

package/dist/util/isValidPropertyName.js

@@ -1,20 +1,28 @@
+// Note: disabled is present in IE so we explicitly allow it here.
+// Others, such as title/hidden, we explicitly override, so valid too
+const allowList = [
+    "disabled",
+    "title",
+    "hidden",
+    "role",
+    "draggable",
+];
 /**
  * Checks whether a property name is valid (does not collide with existing DOM API properties)
- * Note: disabled is present in IE so we explicitly allow it here.
  *
  * @param name
  * @returns {boolean}
  */
-const isValidPropertyName = name => {
-	if (name === "disabled") {
-		return true;
-	}
-	const classes = [
-		HTMLElement,
-		Element,
-		Node,
-	];
-	return !classes.some(klass => klass.prototype.hasOwnProperty(name)); // eslint-disable-line
+const isValidPropertyName = (name) => {
+    if (allowList.includes(name) || name.startsWith("aria")) {
+        return true;
+    }
+    const classes = [
+        HTMLElement,
+        Element,
+        Node,
+    ];
+    return !classes.some(klass => klass.prototype.hasOwnProperty(name)); // eslint-disable-line
 };
-
 export default isValidPropertyName;
+//# sourceMappingURL=isValidPropertyName.js.map

package/dist/util/isValidPropertyName.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"isValidPropertyName.js","sourceRoot":"","sources":["../../src/util/isValidPropertyName.ts"],"names":[],"mappings":"AAAA,kEAAkE;AAClE,qEAAqE;AACrE,MAAM,SAAS,GAAG;IACjB,UAAU;IACV,OAAO;IACP,QAAQ;IACR,MAAM;IACN,WAAW;CACX,CAAC;AAEF;;;;;GAKG;AACH,MAAM,mBAAmB,GAAG,CAAC,IAAY,EAAE,EAAE;IAC5C,IAAI,SAAS,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,EAAE;QACxD,OAAO,IAAI,CAAC;KACZ;IACD,MAAM,OAAO,GAAG;QACf,WAAW;QACX,OAAO;QACP,IAAI;KACJ,CAAC;IACF,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,sBAAsB;AAC5F,CAAC,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/dist/util/whenDOMReady.d.ts

@@ -0,0 +1,2 @@
+declare const whenDOMReady: () => Promise<void>;
+export default whenDOMReady;

package/dist/util/whenDOMReady.js

@@ -1,13 +1,14 @@
 const whenDOMReady = () => {
-	return new Promise(resolve => {
-		if (document.body) {
-			resolve();
-		} else {
-			document.addEventListener("DOMContentLoaded", () => {
-				resolve();
-			});
-		}
-	});
+    return new Promise(resolve => {
+        if (document.body) {
+            resolve();
+        }
+        else {
+            document.addEventListener("DOMContentLoaded", () => {
+                resolve();
+            });
+        }
+    });
 };
-
 export default whenDOMReady;
+//# sourceMappingURL=whenDOMReady.js.map

package/dist/util/whenDOMReady.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"whenDOMReady.js","sourceRoot":"","sources":["../../src/util/whenDOMReady.ts"],"names":[],"mappings":"AAAA,MAAM,YAAY,GAAG,GAAG,EAAE;IACzB,OAAO,IAAI,OAAO,CAAO,OAAO,CAAC,EAAE;QAClC,IAAI,QAAQ,CAAC,IAAI,EAAE;YAClB,OAAO,EAAE,CAAC;SACV;aAAM;YACN,QAAQ,CAAC,gBAAgB,CAAC,kBAAkB,EAAE,GAAG,EAAE;gBAClD,OAAO,EAAE,CAAC;YACX,CAAC,CAAC,CAAC;SACH;IACF,CAAC,CAAC,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/util/willShowContent.d.ts

@@ -0,0 +1,2 @@
+declare const willShowContent: (childNodes: Array<Node>) => boolean;
+export default willShowContent;

package/dist/util/willShowContent.js

@@ -0,0 +1,7 @@
+const willShowContent = (childNodes) => {
+    return Array.from(childNodes).filter(node => {
+        return node.nodeType !== Node.COMMENT_NODE && (node.nodeType !== Node.TEXT_NODE || (node.nodeValue || "").trim().length !== 0);
+    }).length > 0;
+};
+export default willShowContent;
+//# sourceMappingURL=willShowContent.js.map

package/dist/util/willShowContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"willShowContent.js","sourceRoot":"","sources":["../../src/util/willShowContent.ts"],"names":[],"mappings":"AAAA,MAAM,eAAe,GAAG,CAAC,UAAuB,EAAE,EAAE;IACnD,OAAO,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE;QAC3C,OAAO,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,YAAY,IAAI,CAAC,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,SAAS,IAAI,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC;IAChI,CAAC,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;AACf,CAAC,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/dist/validateThemeRoot.d.ts

@@ -0,0 +1,2 @@
+declare const validateThemeRoot: (themeRoot: string) => string | undefined;
+export default validateThemeRoot;

package/dist/validateThemeRoot.js

@@ -0,0 +1,47 @@
+const getMetaTagValue = (metaTagName) => {
+    const metaTag = document.querySelector(`META[name="${metaTagName}"]`), metaTagContent = metaTag && metaTag.getAttribute("content");
+    return metaTagContent;
+};
+const validateThemeOrigin = (origin) => {
+    const allowedOrigins = getMetaTagValue("sap-allowedThemeOrigins");
+    return allowedOrigins && allowedOrigins.split(",").some(allowedOrigin => {
+        return allowedOrigin === "*" || origin === allowedOrigin.trim();
+    });
+};
+const buildCorrectUrl = (oldUrl, newOrigin) => {
+    const oldUrlPath = new URL(oldUrl).pathname;
+    return new URL(oldUrlPath, newOrigin).toString();
+};
+const validateThemeRoot = (themeRoot) => {
+    let themeRootURL, resultUrl;
+    try {
+        themeRootURL = new URL(themeRoot);
+        const origin = themeRootURL.origin;
+        themeRootURL = themeRootURL.toString();
+        if (themeRootURL.startsWith(".") || themeRootURL.startsWith("/")) {
+            // Handle relative url
+            // new URL("/newExmPath", "http://example.com/exmPath") => http://example.com/newExmPath
+            // new URL("./newExmPath", "http://example.com/exmPath") => http://example.com/exmPath/newExmPath
+            // new URL("../newExmPath", "http://example.com/exmPath") => http://example.com/newExmPath
+            resultUrl = new URL(themeRootURL, window.location.href).toString();
+        }
+        else if (origin && validateThemeOrigin(origin)) {
+            // If origin is allowed, use it
+            resultUrl = themeRootURL.toString();
+        }
+        else {
+            // If origin is not allow and the URL is not relative, we have to replace the origin
+            // with current location
+            resultUrl = buildCorrectUrl(themeRootURL, window.location.href);
+        }
+        if (!resultUrl.endsWith("/")) {
+            resultUrl = `${resultUrl}/`;
+        }
+        return `${resultUrl}UI5/`;
+    }
+    catch (e) {
+        // Catch if URL is not correct
+    }
+};
+export default validateThemeRoot;
+//# sourceMappingURL=validateThemeRoot.js.map

package/dist/validateThemeRoot.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"validateThemeRoot.js","sourceRoot":"","sources":["../src/validateThemeRoot.ts"],"names":[],"mappings":"AAAA,MAAM,eAAe,GAAG,CAAC,WAAmB,EAAE,EAAE;IAC/C,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,cAAc,WAAW,IAAI,CAAC,EACpE,cAAc,GAAG,OAAO,IAAI,OAAO,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC;IAE7D,OAAO,cAAc,CAAC;AACvB,CAAC,CAAC;AAEF,MAAM,mBAAmB,GAAG,CAAC,MAAc,EAAE,EAAE;IAC9C,MAAM,cAAc,GAAG,eAAe,CAAC,yBAAyB,CAAC,CAAC;IAElE,OAAO,cAAc,IAAI,cAAc,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,EAAE;QACvE,OAAO,aAAa,KAAK,GAAG,IAAI,MAAM,KAAK,aAAa,CAAC,IAAI,EAAE,CAAC;IACjE,CAAC,CAAC,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,eAAe,GAAG,CAAC,MAAc,EAAE,SAAiB,EAAE,EAAE;IAC7D,MAAM,UAAU,GAAG,IAAI,GAAG,CAAC,MAAM,CAAC,CAAC,QAAQ,CAAC;IAE5C,OAAO,IAAI,GAAG,CAAC,UAAU,EAAE,SAAS,CAAC,CAAC,QAAQ,EAAE,CAAC;AAClD,CAAC,CAAC;AAEF,MAAM,iBAAiB,GAAG,CAAC,SAAiB,EAAE,EAAE;IAC/C,IAAI,YAAY,EACf,SAAS,CAAC;IAEX,IAAI;QACH,YAAY,GAAG,IAAI,GAAG,CAAC,SAAS,CAAC,CAAC;QAElC,MAAM,MAAM,GAAG,YAAY,CAAC,MAAM,CAAC;QAEnC,YAAY,GAAG,YAAY,CAAC,QAAQ,EAAE,CAAC;QAEvC,IAAI,YAAY,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,YAAY,CAAC,UAAU,CAAC,GAAG,CAAC,EAAE;YACjE,sBAAsB;YACtB,wFAAwF;YACxF,iGAAiG;YACjG,0FAA0F;YAC1F,SAAS,GAAG,IAAI,GAAG,CAAC,YAAY,EAAE,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,QAAQ,EAAE,CAAC;SACnE;aAAM,IAAI,MAAM,IAAI,mBAAmB,CAAC,MAAM,CAAC,EAAE;YACjD,+BAA+B;YAC/B,SAAS,GAAG,YAAY,CAAC,QAAQ,EAAE,CAAC;SACpC;aAAM;YACN,oFAAoF;YACpF,wBAAwB;YACxB,SAAS,GAAG,eAAe,CAAC,YAAY,EAAE,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;SAChE;QAED,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;YAC7B,SAAS,GAAG,GAAG,SAAS,GAAG,CAAC;SAC5B;QAED,OAAO,GAAG,SAAS,MAAM,CAAC;KAC1B;IAAC,OAAO,CAAC,EAAE;QACX,8BAA8B;KAC9B;AACF,CAAC,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/index.js

@@ -1,4 +1,4 @@
-import UI5Element from "./src/UI5Element.js";
+import UI5Element from "./dist/UI5Element.js";
 
 export default UI5Element;
 export { UI5Element };

package/lib/generate-asset-parameters/index.js

@@ -0,0 +1,25 @@
+const fs = require('fs').promises;
+const assets = require('@ui5/webcomponents-tools/assets-meta.js');
+
+const fileContent = `const assetParameters = ${JSON.stringify(assets)};
+
+const DEFAULT_THEME = assetParameters.themes.default;
+const DEFAULT_LANGUAGE = assetParameters.languages.default;
+const DEFAULT_LOCALE = assetParameters.locales.default;
+const SUPPORTED_LOCALES = assetParameters.locales.all;
+
+export {
+	DEFAULT_THEME,
+	DEFAULT_LANGUAGE,
+	DEFAULT_LOCALE,
+	SUPPORTED_LOCALES,
+};`;
+
+const generate = async () => {
+	await fs.mkdir("dist/generated/", { recursive: true });
+	return fs.writeFile("dist/generated/AssetParameters.js", fileContent);
+}
+
+generate().then(() => {
+	console.log("Assets parameters generated.");
+});

package/lib/generate-styles/index.js

@@ -0,0 +1,31 @@
+const fs = require('fs').promises;
+const path = require('path');
+const CleanCSS = require('clean-css');
+
+const generate = async () => {
+	await fs.mkdir("src/generated/css/", {recursive: true});
+
+	const files = (await fs.readdir("src/css/")).filter(file => file.endsWith(".css"));
+	const filesPromises = files.map(async file => {
+		let content = await fs.readFile(path.join("src/css/", file));
+		const res = new CleanCSS().minify(`${content}`);
+		content = `import type { StyleData } from "../../types.js";
+
+const styleData: StyleData = {
+	packageName: "@ui5/webcomponents-base",
+	fileName: "${file}",
+	content: \`${res.styles}\`,
+};
+
+export default styleData;
+`;
+
+		return fs.writeFile(path.join("src/generated/css/", `${file}.ts`), content);
+	});
+
+	return Promise.all(filesPromises);
+};
+
+generate().then(() => {
+	console.log("Styles files generated.");
+});

package/lib/generate-version-info/index.js

@@ -0,0 +1,32 @@
+const fs = require('fs').promises;
+
+const generate = async () => {
+	const version = JSON.parse(await fs.readFile("package.json")).version;
+
+	// Parse version
+	const matches = version.match(/^([0-9]+)\.([0-9]+)\.([0-9]+)(.*)$/);
+	if (!matches) {
+		throw new Error("Unsupported version format");
+	}
+
+	const isNext = version.match(/[a-f0-9]{9}$/);
+	const buildTime = Math.floor(new Date().getTime() / 1000);
+
+	const fileContent = `const VersionInfo = {
+	version: "${version}",
+	major: ${matches[1]},
+	minor: ${matches[2]},
+	patch: ${matches[3]},
+	suffix: "${matches[4]}",
+	isNext: ${isNext ? "true" : "false"},
+	buildTime: ${buildTime},
+};
+export default VersionInfo;`;
+
+	await fs.mkdir("dist/generated/", { recursive: true });
+	await fs.writeFile("dist/generated/VersionInfo.js", fileContent);
+}
+
+generate().then(() => {
+	console.log("Version info file generated.");
+});

package/package-scripts.js

@@ -1,39 +1,64 @@
-const serveConfig = `../tools/components-package/serve.json`;
-const port = `9191`;
+const resolve = require("resolve");
+const path = require("path");
+
+const assetParametersScript = resolve.sync("@ui5/webcomponents-base/lib/generate-asset-parameters/index.js");
+const stylesScript = resolve.sync("@ui5/webcomponents-base/lib/generate-styles/index.js");
+const versionScript = resolve.sync("@ui5/webcomponents-base/lib/generate-version-info/index.js");
+const copyUsedModules = resolve.sync("@ui5/webcomponents-tools/lib/copy-list/index.js");
+const esmAbsToRel = resolve.sync("@ui5/webcomponents-tools/lib/esm-abs-to-rel/index.js");
+const preprocessJSDocScript = resolve.sync("@ui5/webcomponents-tools/lib/jsdoc/preprocess.js");
+
+const LIB = path.join(__dirname, `../tools/lib/`);
+
+const viteConfig = `-c "${require.resolve("@ui5/webcomponents-tools/components-package/vite.config.js")}"`;
+const eslintConfig = `--config ${require.resolve("@ui5/webcomponents-tools/components-package/eslint.js")}`;
 
 const scripts = {
-	clean: "rimraf dist",
-	lint: "eslint . --config config/.eslintrc.js",
-	prepare: "nps clean copy",
+	clean: "rimraf jsdoc-dist && rimraf src/generated && rimraf dist && rimraf .port",
+	lint: `eslint . ${eslintConfig}`,
+	prepare: "nps clean integrate copy generateAssetParameters generateVersionInfo generateStyles generateTemplates typescript generateAPI",
+	typescript: "tsc",
+	integrate: {
+		default: "nps integrate.copy-used-modules integrate.replace-amd integrate.amd-to-es6 integrate.esm-abs-to-rel integrate.third-party",
+		"copy-used-modules": `node "${copyUsedModules}" ./used-modules.txt dist/`,
+		"replace-amd": "replace-in-file sap.ui.define define dist/**/*.js",
+		"amd-to-es6": "amdtoes6 --src=dist/ --replace --glob=**/*.js",
+		"esm-abs-to-rel": `node "${esmAbsToRel}" dist/ dist/`,
+		"third-party": {
+			default: "nps integrate.third-party.copy integrate.third-party.fix",
+			copy: "mkdirp dist/sap/ui/thirdparty/ && copy-and-watch ../../node_modules/@openui5/sap.ui.core/src/sap/ui/thirdparty/caja-html-sanitizer.js dist/sap/ui/thirdparty/",
+			fix: "replace-in-file 240 xA0 dist/sap/ui/thirdparty/caja-html-sanitizer.js"
+		},
+	},
 	build: {
-		default: "nps lint prepare build.bundle",
-		bundle: "rollup --config config/rollup.config.js --environment ES5_BUILD",
+		default: `nps prepare lint build.bundle`,
+		bundle: `vite build ${viteConfig}`,
 	},
 	copy: {
-		default: "nps copy.cldr copy.src copy.test copy.webcomponents-polyfill",
-		cldr: 'copy-and-watch "../../node_modules/@ui5/webcomponents-utils/dist/**/cldr/*.json" dist/generated/assets/cldr/',
-		src: "copy-and-watch \"src/**/*.js\" dist/",
-		test: "copy-and-watch \"test/**/*.*\" dist/test-resources",
-		"webcomponents-polyfill": "copy-and-watch \"../../node_modules/@webcomponents/webcomponentsjs/**/*.*\" dist/webcomponentsjs/",
+		default: "nps copy.src",
+		src: `copy-and-watch "src/**/*.{js,css,d.ts}" dist/`,
+	},
+	generateAssetParameters: `node "${assetParametersScript}"`,
+	generateVersionInfo: `node "${versionScript}"`,
+	generateStyles: `node "${stylesScript}"`,
+	generateTemplates: `mkdirp dist/generated/templates && node "${LIB}/hbs2ui5/index.js" -d test/elements -o dist/generated/templates`,
+	generateAPI: {
+		default: "nps generateAPI.prepare generateAPI.preprocess generateAPI.jsdoc generateAPI.cleanup",
+		prepare: `copy-and-watch "dist/**/*.js" jsdoc-dist/`,
+		preprocess: `node "${preprocessJSDocScript}" jsdoc-dist/`,
+		jsdoc: `jsdoc -c "${LIB}/jsdoc/configTypescript.json"`,
+		cleanup: "rimraf jsdoc-dist/"
 	},
 	watch: {
-		default: 'concurrently "nps watch.test" "nps watch.src" "nps watch.bundle"',
+		default: 'concurrently "nps watch.src" "nps watch.styles" "nps watch.typescript"',
+		withBundle: 'concurrently "nps watch.src" "nps watch.bundle" "nps watch.styles" "nps watch.typescript"',
 		src: 'nps "copy.src --watch --skip-initial-copy"',
-		test: 'nps "copy.test --watch --skip-initial-copy"',
-		bundle: "rollup --config config/rollup.config.js -w --environment ES5_BUILD,DEV",
-	},
-	dev: 'concurrently "nps serve" "nps watch"',
-	start: "nps prepare dev",
-	serve: {
-		default: "nps serve.prepare serve.run",
-		prepare: `copy-and-watch "${serveConfig}" dist/`,
-		run: `serve --no-clipboard -l ${port} dist`,
-	},
-	test: {
-		// --success first - report the exit code of the test run (first command to finish), as serve is always terminated and has a non-0 exit code
-		default: 'concurrently "nps serve" "nps test.run" --kill-others --success first',
-		run: "cross-env WDIO_LOG_LEVEL=error FORCE_COLOR=0 wdio config/wdio.conf.js",
+		typescript: 'tsc --watch',
+		bundle: `node ${LIB}/dev-server/dev-server.js ${viteConfig}`,
+		styles: 'chokidar "src/css/*.css" -c "nps generateStyles"'
 	},
+	start: "nps prepare watch.withBundle",
+	test: `node "${LIB}/test-runner/test-runner.js"`,
 };
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ui5/webcomponents-base",
-  "version": "0.0.0-2db62badf",
+  "version": "0.0.0-2f7664755",
   "description": "UI5 Web Components: webcomponents.base",
   "author": "SAP SE (https://www.sap.com)",
   "license": "Apache-2.0",
@@ -15,27 +15,35 @@
     "url": "https://github.com/SAP/ui5-webcomponents.git",
     "directory": "packages/base"
   },
+  "exports": {
+    ".": "./index.js",
+    "./dist/*": "./dist/*",
+    "./package.json": "./package.json",
+    "./bundle.esm.js": "./bundle.esm.js",
+    "./*": "./dist/*"
+  },
   "scripts": {
     "clean": "nps clean",
     "lint": "nps lint",
     "start": "nps start",
     "build": "nps build",
-    "test": "nps test"
+    "test": "nps test",
+    "prepublishOnly": "npm run clean && npm run build"
   },
   "dependencies": {
-    "@ui5/webcomponents-utils": "0.0.0-2db62badf",
-    "css-vars-ponyfill": "^2.1.2",
-    "lit-html": "^1.0.0",
-    "regenerator-runtime": "0.12.1",
-    "url-search-params-polyfill": "^5.0.0"
+    "lit-html": "^2.0.1"
   },
   "devDependencies": {
-    "@ui5/webcomponents-tools": "0.0.0-2db62badf",
-    "array-uniq": "^2.0.0",
-    "copy-and-watch": "^0.1.4",
-    "eslint": "^5.13.0",
-    "eslint-config-airbnb-base": "^13.1.0",
-    "npm-run-all": "^4.1.5",
-    "path-exists-cli": "^1.0.0"
+    "@buxlabs/amd-to-es6": "0.16.1",
+    "@openui5/sap.ui.core": "1.109.0",
+    "@ui5/webcomponents-tools": "0.0.0-2f7664755",
+    "chromedriver": "109.0.0",
+    "clean-css": "^5.2.2",
+    "copy-and-watch": "^0.1.5",
+    "cross-env": "^7.0.3",
+    "eslint": "^7.22.0",
+    "mkdirp": "^1.0.4",
+    "replace-in-file": "^6.3.5",
+    "resolve": "^1.20.0"
   }
 }

package/src/AssetRegistry.ts

@@ -0,0 +1,11 @@
+import { registerI18nLoader } from "./asset-registries/i18n.js";
+import { registerLocaleDataLoader } from "./asset-registries/LocaleData.js";
+import { registerThemePropertiesLoader } from "./asset-registries/Themes.js";
+import { registerIconLoader } from "./asset-registries/Icons.js";
+
+export {
+	registerI18nLoader,
+	registerLocaleDataLoader,
+	registerThemePropertiesLoader,
+	registerIconLoader,
+};

package/src/Boot.ts

@@ -0,0 +1,61 @@
+import whenDOMReady from "./util/whenDOMReady.js";
+import insertFontFace from "./FontFace.js";
+import insertSystemCSSVars from "./SystemCSSVars.js";
+import { getTheme } from "./config/Theme.js";
+import applyTheme from "./theming/applyTheme.js";
+import { registerCurrentRuntime } from "./Runtimes.js";
+import { getFeature } from "./FeaturesRegistry.js";
+import type OpenUI5Support from "./features/OpenUI5Support.js";
+import type F6Navigation from "./features/F6Navigation.js";
+import { PromiseResolve } from "./types.js";
+
+let bootPromise: Promise<void>;
+
+/**
+ * Attach  a callback that will be executed on boot
+ * @public
+ * @param listener
+ */
+const attachBoot = async (listener: () => void) => {
+	await boot();
+	listener();
+};
+
+const boot = async (): Promise<void> => {
+	if (bootPromise !== undefined) {
+		return bootPromise;
+	}
+
+	const bootExecutor = async (resolve: PromiseResolve) => {
+		registerCurrentRuntime();
+
+		const openUI5Support = getFeature<typeof OpenUI5Support>("OpenUI5Support");
+		const isOpenUI5Loaded = openUI5Support ? openUI5Support.isLoaded() : false;
+		const f6Navigation = getFeature<typeof F6Navigation>("F6Navigation");
+
+		if (openUI5Support) {
+			await openUI5Support.init();
+		}
+
+		if (f6Navigation && !isOpenUI5Loaded) {
+			f6Navigation.init();
+		}
+
+		await whenDOMReady();
+		await applyTheme(getTheme());
+		openUI5Support && openUI5Support.attachListeners();
+		insertFontFace();
+		insertSystemCSSVars();
+
+		resolve();
+	};
+
+	bootPromise = new Promise(bootExecutor as (resolve: PromiseResolve) => void);
+
+	return bootPromise;
+};
+
+export {
+	boot,
+	attachBoot,
+};

package/src/CSP.ts

@@ -0,0 +1,66 @@
+const roots = new Map<string, string>();
+let useLinks = false;
+let preloadLinks = true;
+
+/**
+ * Use this function to provide the path to the directory where the css resources for the given package will be served from.
+ *
+ * @public
+ * @param packageName name of the package that is being configured
+ * @param root path, accessible by the server that will serve the css resources
+ */
+const setPackageCSSRoot = (packageName: string, root: string) => {
+	roots.set(packageName, root);
+};
+
+const getUrl = (packageName: string, path: string) => {
+	const packageCSSRoot = roots.get(packageName);
+
+	if (!packageCSSRoot) {
+		console.warn(`Root path to the CSS resources ${packageName} not provided - use "setPackageCSSRoot" to provide the root.`); // eslint-disable-line
+		return "";
+	}
+
+	return `${packageCSSRoot}${path}`;
+};
+
+/**
+ * Call this function to enable or disable the usage of <link> tags instead of <style> tags to achieve CSP compliance
+ * Example: "setUseLinks(true)" will unconditionally use <link> tags for all browsers;
+ * Example: "setUseLinks(!document.adoptedStyleSheets) will only enable the usage of <link> tags for browsers that do not support constructable stylesheets.
+ *
+ * @public
+ * @param use whether links will be used
+ */
+const setUseLinks = (use: boolean) => {
+	useLinks = use;
+};
+
+/**
+ * Call this function to enable or disable the preloading of <link> tags.
+ * Note: only taken into account when <link> tags are being used.
+ * Note: links are being preloaded by default, so call "setPreloadLinks(false)" to opt out of this.
+ *
+ * @public
+ * @param preload
+ */
+const setPreloadLinks = (preload: boolean) => {
+	preloadLinks = preload;
+};
+
+const shouldUseLinks = () => {
+	return useLinks;
+};
+
+const shouldPreloadLinks = () => {
+	return preloadLinks;
+};
+
+export {
+	setPackageCSSRoot,
+	getUrl,
+	setUseLinks,
+	setPreloadLinks,
+	shouldUseLinks,
+	shouldPreloadLinks,
+};