@ui5/webcomponents-base 0.0.0-2bd2204ed → 0.0.0-2c875c3d3

package/dist/animations/scroll.js

@@ -1,28 +1,19 @@
-import animate from "./animate.js";
-import animationConfig from "./config.js";
-
-export default ({
-	element = animationConfig.element,
-	duration = animationConfig.duration,
-	progress: progressCallback = animationConfig.identity,
-	dx = 0,
-	dy = 0,
-}) => {
-	let scrollLeft;
-	let scrollTop;
-
-	return animate({
-		beforeStart: () => {
-			scrollLeft = element.scrollLeft;
-			scrollTop = element.scrollTop;
-		},
-		duration,
-		element,
-		progress: progress => {
-			progressCallback(progress);
-
-			element.scrollLeft = scrollLeft + (progress * dx); // easing - linear
-			element.scrollTop = scrollTop + (progress * dy); // easing - linear
-		},
-	});
+import animate, { duration } from "./animate.js";
+const scroll = (element, dx, dy) => {
+    let scrollLeft;
+    let scrollTop;
+    return animate({
+        beforeStart: () => {
+            scrollLeft = element.scrollLeft;
+            scrollTop = element.scrollTop;
+        },
+        duration,
+        element,
+        advance: progress => {
+            element.scrollLeft = scrollLeft + (progress * dx); // easing - linear
+            element.scrollTop = scrollTop + (progress * dy); // easing - linear
+        },
+    });
 };
+export default scroll;
+//# sourceMappingURL=scroll.js.map

package/dist/animations/scroll.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scroll.js","sourceRoot":"","sources":["../../src/animations/scroll.ts"],"names":[],"mappings":"AAAA,OAAO,OAAO,EAAE,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAEjD,MAAM,MAAM,GAAG,CAAC,OAAoB,EAAE,EAAU,EAAE,EAAU,EAAE,EAAE;IAC/D,IAAI,UAAkB,CAAC;IACvB,IAAI,SAAiB,CAAC;IAEtB,OAAO,OAAO,CAAC;QACd,WAAW,EAAE,GAAG,EAAE;YACjB,UAAU,GAAG,OAAO,CAAC,UAAU,CAAC;YAChC,SAAS,GAAG,OAAO,CAAC,SAAS,CAAC;QAC/B,CAAC;QACD,QAAQ;QACR,OAAO;QACP,OAAO,EAAE,QAAQ,CAAC,EAAE;YACnB,OAAO,CAAC,UAAU,GAAG,UAAU,GAAG,CAAC,QAAQ,GAAG,EAAE,CAAC,CAAC,CAAC,kBAAkB;YACrE,OAAO,CAAC,SAAS,GAAG,SAAS,GAAG,CAAC,QAAQ,GAAG,EAAE,CAAC,CAAC,CAAC,kBAAkB;QACpE,CAAC;KACD,CAAC,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,MAAM,CAAC","sourcesContent":["import animate, { duration } from \"./animate.js\";\n\nconst scroll = (element: HTMLElement, dx: number, dy: number) => {\n\tlet scrollLeft: number;\n\tlet scrollTop: number;\n\n\treturn animate({\n\t\tbeforeStart: () => {\n\t\t\tscrollLeft = element.scrollLeft;\n\t\t\tscrollTop = element.scrollTop;\n\t\t},\n\t\tduration,\n\t\telement,\n\t\tadvance: progress => {\n\t\t\telement.scrollLeft = scrollLeft + (progress * dx); // easing - linear\n\t\t\telement.scrollTop = scrollTop + (progress * dy); // easing - linear\n\t\t},\n\t});\n};\n\nexport default scroll;\n"]}

package/dist/animations/slideDown.d.ts

@@ -0,0 +1,5 @@
+declare const slideDown: (element: HTMLElement) => {
+    promise: () => Promise<void | Error>;
+    stop: () => () => void;
+};
+export default slideDown;

package/dist/animations/slideDown.js

@@ -1,79 +1,54 @@
-import animationConfig from "./config.js";
-import animate from "./animate.js";
-
-export default ({
-	element = animationConfig.element,
-	duration = animationConfig.defaultDuration,
-	progress: progressCallback = animationConfig.identity,
-}) => {
-	let computedStyles,
-		paddingTop,
-		paddingBottom,
-		marginTop,
-		marginBottom,
-		height;
-	let storedOverflow,
-		storedPaddingTop,
-		storedPaddingBottom,
-		storedMarginTop,
-		storedMarginBottom,
-		storedHeight;
-
-	const animation = animate({
-		beforeStart: () => {
-			// Show the element to measure its properties
-			element.style.display = "block";
-
-			// Get Computed styles
-			computedStyles = getComputedStyle(element);
-			paddingTop = parseFloat(computedStyles.paddingTop);
-			paddingBottom = parseFloat(computedStyles.paddingBottom);
-			marginTop = parseFloat(computedStyles.marginTop);
-			marginBottom = parseFloat(computedStyles.marginBottom);
-			height = parseFloat(computedStyles.height);
-
-			// Store inline styles
-			storedOverflow = element.style.overflow;
-			storedPaddingTop = element.style.paddingTop;
-			storedPaddingBottom = element.style.paddingBottom;
-			storedMarginTop = element.style.marginTop;
-			storedMarginBottom = element.style.marginBottom;
-			storedHeight = element.style.height;
-
-			element.style.overflow = "hidden";
-			element.style.paddingTop = 0;
-			element.style.paddingBottom = 0;
-			element.style.marginTop = 0;
-			element.style.marginBottom = 0;
-			element.style.height = 0;
-		},
-		duration,
-		element,
-		progress(progress) {
-			progressCallback(progress);
-
-			// WORKAROUND
-			element.style.display = "block";
-			// END OF WORKAROUND
-
-			/* eslint-disable */
-			element.style.paddingTop = 0 + (paddingTop * progress) + "px";
-			element.style.paddingBottom = 0 + (paddingBottom * progress) + "px";
-			element.style.marginTop = 0 + (marginTop * progress) + "px";
-			element.style.marginBottom = 0 + (marginBottom * progress) + "px";
-			element.style.height = 0 + (height * progress) + "px";
-			/* eslint-enable */
-		},
-	});
-
-	animation.promise().then(() => {
-		element.style.overflow = storedOverflow;
-		element.style.paddingTop = storedPaddingTop;
-		element.style.paddingBottom = storedPaddingBottom;
-		element.style.marginTop = storedMarginTop;
-		element.style.marginBottom = storedMarginBottom;
-		element.style.height = storedHeight;
-	});
-
-	return animation;
+import animate, { duration } from "./animate.js";
+const slideDown = (element) => {
+    let computedStyles, paddingTop, paddingBottom, marginTop, marginBottom, height;
+    let storedOverflow, storedPaddingTop, storedPaddingBottom, storedMarginTop, storedMarginBottom, storedHeight;
+    const animation = animate({
+        beforeStart: () => {
+            // Show the element to measure its properties
+            element.style.display = "block";
+            // Get Computed styles
+            computedStyles = getComputedStyle(element);
+            paddingTop = parseFloat(computedStyles.paddingTop);
+            paddingBottom = parseFloat(computedStyles.paddingBottom);
+            marginTop = parseFloat(computedStyles.marginTop);
+            marginBottom = parseFloat(computedStyles.marginBottom);
+            height = parseFloat(computedStyles.height);
+            // Store inline styles
+            storedOverflow = element.style.overflow;
+            storedPaddingTop = element.style.paddingTop;
+            storedPaddingBottom = element.style.paddingBottom;
+            storedMarginTop = element.style.marginTop;
+            storedMarginBottom = element.style.marginBottom;
+            storedHeight = element.style.height;
+            element.style.overflow = "hidden";
+            element.style.paddingTop = "0";
+            element.style.paddingBottom = "0";
+            element.style.marginTop = "0";
+            element.style.marginBottom = "0";
+            element.style.height = "0";
+        },
+        duration,
+        element,
+        advance: progress => {
+            // WORKAROUND
+            element.style.display = "block";
+            // END OF WORKAROUND
+            element.style.paddingTop = `${(paddingTop * progress)}px`;
+            element.style.paddingBottom = `${(paddingBottom * progress)}px`;
+            element.style.marginTop = `${(marginTop * progress)}px`;
+            element.style.marginBottom = `${(marginBottom * progress)}px`;
+            element.style.height = `${(height * progress)}px`;
+        },
+    });
+    animation.promise().then(() => {
+        element.style.overflow = storedOverflow;
+        element.style.paddingTop = storedPaddingTop;
+        element.style.paddingBottom = storedPaddingBottom;
+        element.style.marginTop = storedMarginTop;
+        element.style.marginBottom = storedMarginBottom;
+        element.style.height = storedHeight;
+    });
+    return animation;
 };
+export default slideDown;
+//# sourceMappingURL=slideDown.js.map

package/dist/animations/slideDown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"slideDown.js","sourceRoot":"","sources":["../../src/animations/slideDown.ts"],"names":[],"mappings":"AAAA,OAAO,OAAO,EAAE,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAEjD,MAAM,SAAS,GAAG,CAAC,OAAoB,EAAE,EAAE;IAC1C,IAAI,cAAmC,EACtC,UAAkB,EAClB,aAAqB,EACrB,SAAiB,EACjB,YAAoB,EACpB,MAAc,CAAC;IAChB,IAAI,cAAsB,EACzB,gBAAwB,EACxB,mBAA2B,EAC3B,eAAuB,EACvB,kBAA0B,EAC1B,YAAoB,CAAC;IAEtB,MAAM,SAAS,GAAG,OAAO,CAAC;QACzB,WAAW,EAAE,GAAG,EAAE;YACjB,6CAA6C;YAC7C,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,OAAO,CAAC;YAEhC,sBAAsB;YACtB,cAAc,GAAG,gBAAgB,CAAC,OAAO,CAAC,CAAC;YAC3C,UAAU,GAAG,UAAU,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC;YACnD,aAAa,GAAG,UAAU,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC;YACzD,SAAS,GAAG,UAAU,CAAC,cAAc,CAAC,SAAS,CAAC,CAAC;YACjD,YAAY,GAAG,UAAU,CAAC,cAAc,CAAC,YAAY,CAAC,CAAC;YACvD,MAAM,GAAG,UAAU,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC;YAE3C,sBAAsB;YACtB,cAAc,GAAG,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC;YACxC,gBAAgB,GAAG,OAAO,CAAC,KAAK,CAAC,UAAU,CAAC;YAC5C,mBAAmB,GAAG,OAAO,CAAC,KAAK,CAAC,aAAa,CAAC;YAClD,eAAe,GAAG,OAAO,CAAC,KAAK,CAAC,SAAS,CAAC;YAC1C,kBAAkB,GAAG,OAAO,CAAC,KAAK,CAAC,YAAY,CAAC;YAChD,YAAY,GAAG,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC;YAEpC,OAAO,CAAC,KAAK,CAAC,QAAQ,GAAG,QAAQ,CAAC;YAClC,OAAO,CAAC,KAAK,CAAC,UAAU,GAAG,GAAG,CAAC;YAC/B,OAAO,CAAC,KAAK,CAAC,aAAa,GAAG,GAAG,CAAC;YAClC,OAAO,CAAC,KAAK,CAAC,SAAS,GAAG,GAAG,CAAC;YAC9B,OAAO,CAAC,KAAK,CAAC,YAAY,GAAG,GAAG,CAAC;YACjC,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,CAAC;QAC5B,CAAC;QACD,QAAQ;QACR,OAAO;QACP,OAAO,EAAE,QAAQ,CAAC,EAAE;YACnB,aAAa;YACb,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,OAAO,CAAC;YAChC,oBAAoB;YAEpB,OAAO,CAAC,KAAK,CAAC,UAAU,GAAG,GAAG,CAAC,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC;YAC1D,OAAO,CAAC,KAAK,CAAC,aAAa,GAAG,GAAG,CAAC,aAAa,GAAG,QAAQ,CAAC,IAAI,CAAC;YAChE,OAAO,CAAC,KAAK,CAAC,SAAS,GAAG,GAAG,CAAC,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC;YACxD,OAAO,CAAC,KAAK,CAAC,YAAY,GAAG,GAAG,CAAC,YAAY,GAAG,QAAQ,CAAC,IAAI,CAAC;YAC9D,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,CAAC,MAAM,GAAG,QAAQ,CAAC,IAAI,CAAC;QACnD,CAAC;KACD,CAAC,CAAC;IAEH,SAAS,CAAC,OAAO,EAAE,CAAC,IAAI,CAAC,GAAG,EAAE;QAC7B,OAAO,CAAC,KAAK,CAAC,QAAQ,GAAG,cAAc,CAAC;QACxC,OAAO,CAAC,KAAK,CAAC,UAAU,GAAG,gBAAgB,CAAC;QAC5C,OAAO,CAAC,KAAK,CAAC,aAAa,GAAG,mBAAmB,CAAC;QAClD,OAAO,CAAC,KAAK,CAAC,SAAS,GAAG,eAAe,CAAC;QAC1C,OAAO,CAAC,KAAK,CAAC,YAAY,GAAG,kBAAkB,CAAC;QAChD,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,YAAY,CAAC;IACrC,CAAC,CAAC,CAAC;IAEH,OAAO,SAAS,CAAC;AAClB,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC","sourcesContent":["import animate, { duration } from \"./animate.js\";\n\nconst slideDown = (element: HTMLElement) => {\n\tlet computedStyles: CSSStyleDeclaration,\n\t\tpaddingTop: number,\n\t\tpaddingBottom: number,\n\t\tmarginTop: number,\n\t\tmarginBottom: number,\n\t\theight: number;\n\tlet storedOverflow: string,\n\t\tstoredPaddingTop: string,\n\t\tstoredPaddingBottom: string,\n\t\tstoredMarginTop: string,\n\t\tstoredMarginBottom: string,\n\t\tstoredHeight: string;\n\n\tconst animation = animate({\n\t\tbeforeStart: () => {\n\t\t\t// Show the element to measure its properties\n\t\t\telement.style.display = \"block\";\n\n\t\t\t// Get Computed styles\n\t\t\tcomputedStyles = getComputedStyle(element);\n\t\t\tpaddingTop = parseFloat(computedStyles.paddingTop);\n\t\t\tpaddingBottom = parseFloat(computedStyles.paddingBottom);\n\t\t\tmarginTop = parseFloat(computedStyles.marginTop);\n\t\t\tmarginBottom = parseFloat(computedStyles.marginBottom);\n\t\t\theight = parseFloat(computedStyles.height);\n\n\t\t\t// Store inline styles\n\t\t\tstoredOverflow = element.style.overflow;\n\t\t\tstoredPaddingTop = element.style.paddingTop;\n\t\t\tstoredPaddingBottom = element.style.paddingBottom;\n\t\t\tstoredMarginTop = element.style.marginTop;\n\t\t\tstoredMarginBottom = element.style.marginBottom;\n\t\t\tstoredHeight = element.style.height;\n\n\t\t\telement.style.overflow = \"hidden\";\n\t\t\telement.style.paddingTop = \"0\";\n\t\t\telement.style.paddingBottom = \"0\";\n\t\t\telement.style.marginTop = \"0\";\n\t\t\telement.style.marginBottom = \"0\";\n\t\t\telement.style.height = \"0\";\n\t\t},\n\t\tduration,\n\t\telement,\n\t\tadvance: progress => {\n\t\t\t// WORKAROUND\n\t\t\telement.style.display = \"block\";\n\t\t\t// END OF WORKAROUND\n\n\t\t\telement.style.paddingTop = `${(paddingTop * progress)}px`;\n\t\t\telement.style.paddingBottom = `${(paddingBottom * progress)}px`;\n\t\t\telement.style.marginTop = `${(marginTop * progress)}px`;\n\t\t\telement.style.marginBottom = `${(marginBottom * progress)}px`;\n\t\t\telement.style.height = `${(height * progress)}px`;\n\t\t},\n\t});\n\n\tanimation.promise().then(() => {\n\t\telement.style.overflow = storedOverflow;\n\t\telement.style.paddingTop = storedPaddingTop;\n\t\telement.style.paddingBottom = storedPaddingBottom;\n\t\telement.style.marginTop = storedMarginTop;\n\t\telement.style.marginBottom = storedMarginBottom;\n\t\telement.style.height = storedHeight;\n\t});\n\n\treturn animation;\n};\n\nexport default slideDown;\n"]}

package/dist/animations/slideUp.d.ts

@@ -0,0 +1,5 @@
+declare const slideUp: (element: HTMLElement) => {
+    promise: () => Promise<void | Error>;
+    stop: () => () => void;
+};
+export default slideUp;

package/dist/animations/slideUp.js

@@ -1,71 +1,50 @@
-import animationConfig from "./config.js";
-import animate from "./animate.js";
-
-export default ({
-	element = animationConfig.element,
-	duration = animationConfig.defaultDuration,
-	progress: progressCallback = animationConfig.identity,
-}) => {
-	// Get Computed styles
-	let computedStyles,
-		paddingTop,
-		paddingBottom,
-		marginTop,
-		marginBottom,
-		height;
-
-	// Store inline styles
-	let storedOverflow,
-		storedPaddingTop,
-		storedPaddingBottom,
-		storedMarginTop,
-		storedMarginBottom,
-		storedHeight;
-
-	const animation = animate({
-		beforeStart: () => {
-			// Get Computed styles
-			computedStyles = getComputedStyle(element);
-			paddingTop = parseFloat(computedStyles.paddingTop);
-			paddingBottom = parseFloat(computedStyles.paddingBottom);
-			marginTop = parseFloat(computedStyles.marginTop);
-			marginBottom = parseFloat(computedStyles.marginBottom);
-			height = parseFloat(computedStyles.height);
-
-			// Store inline styles
-			storedOverflow = element.style.overflow;
-			storedPaddingTop = element.style.paddingTop;
-			storedPaddingBottom = element.style.paddingBottom;
-			storedMarginTop = element.style.marginTop;
-			storedMarginBottom = element.style.marginBottom;
-			storedHeight = element.style.height;
-
-			element.style.overflow = "hidden";
-		},
-		duration,
-		element,
-		progress(progress) {
-			progressCallback(progress);
-
-			element.style.paddingTop = `${paddingTop - (paddingTop * progress)}px`;
-			element.style.paddingBottom = `${paddingBottom - (paddingBottom * progress)}px`;
-			element.style.marginTop = `${marginTop - (marginTop * progress)}px`;
-			element.style.marginBottom = `${marginBottom - (marginBottom * progress)}px`;
-			element.style.height = `${height - (height * progress)}px`;
-		},
-	});
-
-	animation.promise().then(oReason => {
-		if (!(oReason instanceof Error)) {
-			element.style.overflow = storedOverflow;
-			element.style.paddingTop = storedPaddingTop;
-			element.style.paddingBottom = storedPaddingBottom;
-			element.style.marginTop = storedMarginTop;
-			element.style.marginBottom = storedMarginBottom;
-			element.style.height = storedHeight;
-			element.style.display = "none";
-		}
-	});
-
-	return animation;
+import animate, { duration } from "./animate.js";
+const slideUp = (element) => {
+    // Get Computed styles
+    let computedStyles, paddingTop, paddingBottom, marginTop, marginBottom, height;
+    // Store inline styles
+    let storedOverflow, storedPaddingTop, storedPaddingBottom, storedMarginTop, storedMarginBottom, storedHeight;
+    const animation = animate({
+        beforeStart: () => {
+            // Get Computed styles
+            const el = element;
+            computedStyles = getComputedStyle(el);
+            paddingTop = parseFloat(computedStyles.paddingTop);
+            paddingBottom = parseFloat(computedStyles.paddingBottom);
+            marginTop = parseFloat(computedStyles.marginTop);
+            marginBottom = parseFloat(computedStyles.marginBottom);
+            height = parseFloat(computedStyles.height);
+            // Store inline styles
+            storedOverflow = el.style.overflow;
+            storedPaddingTop = el.style.paddingTop;
+            storedPaddingBottom = el.style.paddingBottom;
+            storedMarginTop = el.style.marginTop;
+            storedMarginBottom = el.style.marginBottom;
+            storedHeight = el.style.height;
+            el.style.overflow = "hidden";
+        },
+        duration,
+        element,
+        advance: progress => {
+            element.style.paddingTop = `${paddingTop - (paddingTop * progress)}px`;
+            element.style.paddingBottom = `${paddingBottom - (paddingBottom * progress)}px`;
+            element.style.marginTop = `${marginTop - (marginTop * progress)}px`;
+            element.style.marginBottom = `${marginBottom - (marginBottom * progress)}px`;
+            element.style.height = `${height - (height * progress)}px`;
+        },
+    });
+    animation.promise().then(reason => {
+        if (!(reason instanceof Error)) {
+            element.style.overflow = storedOverflow;
+            element.style.paddingTop = storedPaddingTop;
+            element.style.paddingBottom = storedPaddingBottom;
+            element.style.marginTop = storedMarginTop;
+            element.style.marginBottom = storedMarginBottom;
+            element.style.height = storedHeight;
+            element.style.display = "none";
+        }
+    });
+    return animation;
 };
+export default slideUp;
+//# sourceMappingURL=slideUp.js.map

package/dist/animations/slideUp.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"slideUp.js","sourceRoot":"","sources":["../../src/animations/slideUp.ts"],"names":[],"mappings":"AAAA,OAAO,OAAO,EAAE,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAEjD,MAAM,OAAO,GAAG,CAAC,OAAoB,EAAE,EAAE;IACxC,sBAAsB;IACtB,IAAI,cAAmC,EACtC,UAAkB,EAClB,aAAqB,EACrB,SAAiB,EACjB,YAAoB,EACpB,MAAc,CAAC;IAEhB,sBAAsB;IACtB,IAAI,cAAsB,EACzB,gBAAwB,EACxB,mBAA2B,EAC3B,eAAuB,EACvB,kBAA0B,EAC1B,YAAoB,CAAC;IAEtB,MAAM,SAAS,GAAG,OAAO,CAAC;QACzB,WAAW,EAAE,GAAG,EAAE;YACjB,sBAAsB;YACtB,MAAM,EAAE,GAAG,OAAO,CAAC;YACnB,cAAc,GAAG,gBAAgB,CAAC,EAAE,CAAC,CAAC;YACtC,UAAU,GAAG,UAAU,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC;YACnD,aAAa,GAAG,UAAU,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC;YACzD,SAAS,GAAG,UAAU,CAAC,cAAc,CAAC,SAAS,CAAC,CAAC;YACjD,YAAY,GAAG,UAAU,CAAC,cAAc,CAAC,YAAY,CAAC,CAAC;YACvD,MAAM,GAAG,UAAU,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC;YAE3C,sBAAsB;YACtB,cAAc,GAAG,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC;YACnC,gBAAgB,GAAG,EAAE,CAAC,KAAK,CAAC,UAAU,CAAC;YACvC,mBAAmB,GAAG,EAAE,CAAC,KAAK,CAAC,aAAa,CAAC;YAC7C,eAAe,GAAG,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC;YACrC,kBAAkB,GAAG,EAAE,CAAC,KAAK,CAAC,YAAY,CAAC;YAC3C,YAAY,GAAG,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC;YAE/B,EAAE,CAAC,KAAK,CAAC,QAAQ,GAAG,QAAQ,CAAC;QAC9B,CAAC;QACD,QAAQ;QACR,OAAO;QACP,OAAO,EAAE,QAAQ,CAAC,EAAE;YACnB,OAAO,CAAC,KAAK,CAAC,UAAU,GAAG,GAAG,UAAU,GAAG,CAAC,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC;YACvE,OAAO,CAAC,KAAK,CAAC,aAAa,GAAG,GAAG,aAAa,GAAG,CAAC,aAAa,GAAG,QAAQ,CAAC,IAAI,CAAC;YAChF,OAAO,CAAC,KAAK,CAAC,SAAS,GAAG,GAAG,SAAS,GAAG,CAAC,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC;YACpE,OAAO,CAAC,KAAK,CAAC,YAAY,GAAG,GAAG,YAAY,GAAG,CAAC,YAAY,GAAG,QAAQ,CAAC,IAAI,CAAC;YAC7E,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,MAAM,GAAG,CAAC,MAAM,GAAG,QAAQ,CAAC,IAAI,CAAC;QAC5D,CAAC;KACD,CAAC,CAAC;IAEH,SAAS,CAAC,OAAO,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE;QACjC,IAAI,CAAC,CAAC,MAAM,YAAY,KAAK,CAAC,EAAE,CAAC;YAChC,OAAO,CAAC,KAAK,CAAC,QAAQ,GAAG,cAAc,CAAC;YACxC,OAAO,CAAC,KAAK,CAAC,UAAU,GAAG,gBAAgB,CAAC;YAC5C,OAAO,CAAC,KAAK,CAAC,aAAa,GAAG,mBAAmB,CAAC;YAClD,OAAO,CAAC,KAAK,CAAC,SAAS,GAAG,eAAe,CAAC;YAC1C,OAAO,CAAC,KAAK,CAAC,YAAY,GAAG,kBAAkB,CAAC;YAChD,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,YAAY,CAAC;YACpC,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM,CAAC;QAChC,CAAC;IACF,CAAC,CAAC,CAAC;IAEH,OAAO,SAAS,CAAC;AAClB,CAAC,CAAC;AAEF,eAAe,OAAO,CAAC","sourcesContent":["import animate, { duration } from \"./animate.js\";\n\nconst slideUp = (element: HTMLElement) => {\n\t// Get Computed styles\n\tlet computedStyles: CSSStyleDeclaration,\n\t\tpaddingTop: number,\n\t\tpaddingBottom: number,\n\t\tmarginTop: number,\n\t\tmarginBottom: number,\n\t\theight: number;\n\n\t// Store inline styles\n\tlet storedOverflow: string,\n\t\tstoredPaddingTop: string,\n\t\tstoredPaddingBottom: string,\n\t\tstoredMarginTop: string,\n\t\tstoredMarginBottom: string,\n\t\tstoredHeight: string;\n\n\tconst animation = animate({\n\t\tbeforeStart: () => {\n\t\t\t// Get Computed styles\n\t\t\tconst el = element;\n\t\t\tcomputedStyles = getComputedStyle(el);\n\t\t\tpaddingTop = parseFloat(computedStyles.paddingTop);\n\t\t\tpaddingBottom = parseFloat(computedStyles.paddingBottom);\n\t\t\tmarginTop = parseFloat(computedStyles.marginTop);\n\t\t\tmarginBottom = parseFloat(computedStyles.marginBottom);\n\t\t\theight = parseFloat(computedStyles.height);\n\n\t\t\t// Store inline styles\n\t\t\tstoredOverflow = el.style.overflow;\n\t\t\tstoredPaddingTop = el.style.paddingTop;\n\t\t\tstoredPaddingBottom = el.style.paddingBottom;\n\t\t\tstoredMarginTop = el.style.marginTop;\n\t\t\tstoredMarginBottom = el.style.marginBottom;\n\t\t\tstoredHeight = el.style.height;\n\n\t\t\tel.style.overflow = \"hidden\";\n\t\t},\n\t\tduration,\n\t\telement,\n\t\tadvance: progress => {\n\t\t\telement.style.paddingTop = `${paddingTop - (paddingTop * progress)}px`;\n\t\t\telement.style.paddingBottom = `${paddingBottom - (paddingBottom * progress)}px`;\n\t\t\telement.style.marginTop = `${marginTop - (marginTop * progress)}px`;\n\t\t\telement.style.marginBottom = `${marginBottom - (marginBottom * progress)}px`;\n\t\t\telement.style.height = `${height - (height * progress)}px`;\n\t\t},\n\t});\n\n\tanimation.promise().then(reason => {\n\t\tif (!(reason instanceof Error)) {\n\t\t\telement.style.overflow = storedOverflow;\n\t\t\telement.style.paddingTop = storedPaddingTop;\n\t\t\telement.style.paddingBottom = storedPaddingBottom;\n\t\t\telement.style.marginTop = storedMarginTop;\n\t\t\telement.style.marginBottom = storedMarginBottom;\n\t\t\telement.style.height = storedHeight;\n\t\t\telement.style.display = \"none\";\n\t\t}\n\t});\n\n\treturn animation;\n};\n\nexport default slideUp;\n"]}

package/dist/asset-registries/Icons.d.ts

@@ -0,0 +1,73 @@
+import type { I18nText } from "../i18nBundle.js";
+import type { TemplateFunction } from "../renderer/executeTemplate.js";
+type IconLoader = (collectionName: string) => Promise<CollectionData | Array<CollectionData>>;
+type CollectionData = {
+    collection: string;
+    packageName: string;
+    themeFamily?: "legacy" | "sap_horizon";
+    version?: string;
+    data: Record<string, {
+        path?: string;
+        paths?: Array<string>;
+        ltr?: boolean;
+        acc?: I18nText;
+    }>;
+};
+type IconDatabase = {
+    collection: string;
+    packageName?: string;
+    viewBox?: string;
+    ltr?: boolean;
+    accData?: I18nText;
+};
+type IconData = IconDatabase & {
+    pathData?: string | string[];
+    customTemplate?: TemplateFunction;
+};
+type UnsafeIconData = IconDatabase & {
+    customTemplateAsString: string;
+};
+declare const registerIconLoader: (collectionName: string, loader: IconLoader) => void;
+/**
+ * Registers a SVG icon with the given name and associated icon data.
+ *
+ * This method is used to add an icon to the registry, making it available for use
+ * in the application.
+ *
+ * @public
+ * @param { string } name - The name of the icon to register.
+ * @param { IconData } iconData - The data associated with the icon: `collection`, `pathData`, `packageName`
+ * `customTemplate`, `viewBox`, `ltr`, `accData`.
+ *
+ * <b>Note:</b> Properties `pathData` and `customTemplate` are mutually exclusive.
+ * If both are set, `customTemplate` will be used.
+ */
+declare const registerIcon: (name: string, iconData: IconData) => void;
+/**
+ * Registers a SVG icon in the registry with the given name and icon data.
+ *
+ * <b>Note:</b> This method is unsafe as it allows the SVG content to be passed as a string
+ * through the `customTemplateAsString` property of the `iconData`.
+ * Ensure that the SVG content is properly validated.
+ * Improperly sanitized SVG strings can lead to security vulnerabilities such as XSS (Cross-Site Scripting).
+ *
+ * @public
+ * @param { string } name - The name of the icon to register.
+ * @param { UnsafeIconData } iconData - The data for the icon: `collection`, `customTemplateAsString`, `packageName`
+ * `viewBox`, `ltr` and `accData`.
+ * @since 2.14.0
+ */
+declare const unsafeRegisterIcon: (name: string, iconData: UnsafeIconData) => void;
+declare const getIconDataSync: (iconName: string) => IconData | UnsafeIconData | undefined;
+declare const getIconData: (iconName: string) => Promise<IconData | UnsafeIconData | "ICON_NOT_FOUND" | undefined>;
+/**
+ * Returns the accessible name for the given icon,
+ * or undefined if accessible name is not present.
+ *
+ * @param { string } name
+ * @return { Promise }
+ */
+declare const getIconAccessibleName: (name: string | undefined) => Promise<string | undefined>;
+declare const _getRegisteredNames: () => Promise<string[]>;
+export { registerIconLoader, getIconData, getIconDataSync, getIconAccessibleName, registerIcon, unsafeRegisterIcon, _getRegisteredNames, };
+export type { IconData, UnsafeIconData, CollectionData, };

package/dist/asset-registries/Icons.js

@@ -1,24 +1,179 @@
-import { registerIcon, registerCollectionPromise } from "../SVGIconRegistry.js";
-import { fetchJsonOnce } from "../util/FetchHelper.js";
-
-const registerIconBundle = async (collectionName, bundleData) => {
-	let resolveFn;
-	const collectionFetched = new Promise(resolve => {
-		resolveFn = resolve;
-	});
-	registerCollectionPromise(collectionName, collectionFetched);
-
-	if (typeof bundleData !== "object") { // not inlined from build -> fetch it
-		bundleData = await fetchJsonOnce(bundleData);
-	}
-	fillRegistry(bundleData);
-	resolveFn();
-};
-
-const fillRegistry = bundleData => {
-	Object.keys(bundleData.data).forEach(iconName => {
-		registerIcon(iconName, { pathData: bundleData.data[iconName], accData: bundleData.accData[iconName], collection: bundleData.collection });
-	});
-};
-
-export { registerIconBundle }; // eslint-disable-line
+import getSharedResource from "../getSharedResource.js";
+import { getIconCollectionByAlias } from "./util/IconCollectionsAlias.js";
+import { registerIconCollectionForTheme } from "./util/IconCollectionsByTheme.js";
+import getEffectiveIconCollection from "./util/getIconCollectionByTheme.js";
+import { getI18nBundle } from "../i18nBundle.js";
+const DEFAULT_THEME_FAMILY = "legacy"; // includes sap_fiori_*
+const loaders = new Map();
+const registry = getSharedResource("SVGIcons.registry", new Map());
+const iconCollectionPromises = getSharedResource("SVGIcons.promises", new Map());
+const ICON_NOT_FOUND = "ICON_NOT_FOUND";
+const registerIconLoader = (collectionName, loader) => {
+    loaders.set(collectionName, loader);
+};
+const _loadIconCollectionOnce = async (collectionName) => {
+    if (!iconCollectionPromises.has(collectionName)) {
+        if (!loaders.has(collectionName)) {
+            throw new Error(`No loader registered for the ${collectionName} icons collection. Probably you forgot to import the "AllIcons.js" module for the respective package.`);
+        }
+        const loadIcons = loaders.get(collectionName);
+        iconCollectionPromises.set(collectionName, loadIcons(collectionName));
+    }
+    return iconCollectionPromises.get(collectionName);
+};
+const _fillRegistry = (bundleData) => {
+    Object.keys(bundleData.data).forEach(iconName => {
+        const iconData = bundleData.data[iconName];
+        registerIcon(iconName, {
+            pathData: (iconData.path || iconData.paths),
+            ltr: iconData.ltr,
+            accData: iconData.acc,
+            collection: bundleData.collection,
+            packageName: bundleData.packageName,
+        });
+    });
+};
+/**
+ * Registers a SVG icon with the given name and associated icon data.
+ *
+ * This method is used to add an icon to the registry, making it available for use
+ * in the application.
+ *
+ * @public
+ * @param { string } name - The name of the icon to register.
+ * @param { IconData } iconData - The data associated with the icon: `collection`, `pathData`, `packageName`
+ * `customTemplate`, `viewBox`, `ltr`, `accData`.
+ *
+ * <b>Note:</b> Properties `pathData` and `customTemplate` are mutually exclusive.
+ * If both are set, `customTemplate` will be used.
+ */
+const registerIcon = (name, iconData) => {
+    const key = `${iconData.collection}/${name}`;
+    const data = {
+        collection: iconData.collection,
+        packageName: iconData.packageName,
+        pathData: iconData.pathData,
+        viewBox: iconData.viewBox,
+        ltr: iconData.ltr,
+        accData: iconData.accData,
+        customTemplate: iconData.customTemplate,
+    };
+    registry.set(key, data);
+};
+/**
+ * Registers a SVG icon in the registry with the given name and icon data.
+ *
+ * <b>Note:</b> This method is unsafe as it allows the SVG content to be passed as a string
+ * through the `customTemplateAsString` property of the `iconData`.
+ * Ensure that the SVG content is properly validated.
+ * Improperly sanitized SVG strings can lead to security vulnerabilities such as XSS (Cross-Site Scripting).
+ *
+ * @public
+ * @param { string } name - The name of the icon to register.
+ * @param { UnsafeIconData } iconData - The data for the icon: `collection`, `customTemplateAsString`, `packageName`
+ * `viewBox`, `ltr` and `accData`.
+ * @since 2.14.0
+ */
+const unsafeRegisterIcon = (name, iconData) => {
+    const key = `${iconData.collection}/${name}`;
+    const data = {
+        collection: iconData.collection,
+        customTemplateAsString: iconData.customTemplateAsString,
+        packageName: iconData.packageName,
+        viewBox: iconData.viewBox,
+        ltr: iconData.ltr,
+        accData: iconData.accData,
+    };
+    registry.set(key, data);
+};
+/**
+ * Processes the full icon name and splits it into - "name", "collection".
+ * - removes legacy protocol ("sap-icon://")
+ * - resolves aliases (f.e "SAP-icons-TNT/actor" => "tnt/actor")
+ *
+ * @param { string } name
+ * @return { object }
+ */
+const processName = (name) => {
+    // silently support ui5-compatible URIs
+    if (name.startsWith("sap-icon://")) {
+        name = name.replace("sap-icon://", "");
+    }
+    let collection;
+    [name, collection] = name.split("/").reverse();
+    name = name.replace("icon-", "");
+    if (collection) {
+        collection = getIconCollectionByAlias(collection);
+    }
+    return { name, collection };
+};
+const getIconDataSync = (iconName) => {
+    const { name, collection } = processName(iconName);
+    return getRegisteredIconData(collection, name);
+};
+const getIconData = async (iconName) => {
+    const { name, collection } = processName(iconName);
+    let iconData = ICON_NOT_FOUND;
+    try {
+        iconData = (await _loadIconCollectionOnce(getEffectiveIconCollection(collection)));
+    }
+    catch (error) {
+        const e = error;
+        console.error(e.message); /* eslint-disable-line */
+    }
+    if (iconData === ICON_NOT_FOUND) {
+        return iconData;
+    }
+    const registeredIconData = getRegisteredIconData(collection, name);
+    if (registeredIconData) {
+        return registeredIconData;
+    }
+    // not filled by another await. many getters will await on the same loader, but fill only once
+    if (Array.isArray(iconData)) {
+        iconData.forEach(data => {
+            _fillRegistry(data);
+            registerIconCollectionForTheme(collection, { [data.themeFamily || DEFAULT_THEME_FAMILY]: data.collection });
+        });
+    }
+    else {
+        _fillRegistry(iconData);
+    }
+    return getRegisteredIconData(collection, name);
+};
+const getRegisteredIconData = (collection, name) => {
+    const registryKey = `${getEffectiveIconCollection(collection)}/${name}`;
+    return registry.get(registryKey);
+};
+/**
+ * Returns the accessible name for the given icon,
+ * or undefined if accessible name is not present.
+ *
+ * @param { string } name
+ * @return { Promise }
+ */
+const getIconAccessibleName = async (name) => {
+    if (!name) {
+        return;
+    }
+    let iconData = getIconDataSync(name);
+    if (!iconData) {
+        iconData = await getIconData(name);
+    }
+    if (iconData && iconData !== ICON_NOT_FOUND && iconData.accData) {
+        if (iconData.packageName) {
+            const i18nBundle = await getI18nBundle(iconData.packageName);
+            return i18nBundle.getText(iconData.accData);
+        }
+        return iconData.accData?.defaultText || "";
+    }
+};
+// test page usage only
+const _getRegisteredNames = async () => {
+    // fetch one icon of each collection to trigger the bundle load
+    await getIconData("edit");
+    await getIconData("tnt/arrow");
+    await getIconData("business-suite/3d");
+    return Array.from(registry.keys());
+};
+export { registerIconLoader, getIconData, getIconDataSync, getIconAccessibleName, registerIcon, unsafeRegisterIcon, _getRegisteredNames, };
+//# sourceMappingURL=Icons.js.map