@vitus-labs/unistyle 1.4.2 → 1.4.3-alpha.3

package/lib/index.d.ts

@@ -98,16 +98,6 @@ type MakeItResponsive = ({
   theme?: Theme$1;
   [key: string]: any;
 }) => any;
-/**
- * Core responsive engine used by every styled component in the system.
- *
- * Returns a styled-components interpolation function that:
- * 1. Reads the component's theme prop (via `key` or direct `theme`)
- * 2. Without breakpoints → renders plain CSS
- * 3. With breakpoints → normalizes, transforms (property-per-breakpoint →
- *    breakpoint-per-property), optimizes (deduplicates identical breakpoints),
- *    and wraps each breakpoint's styles in the appropriate `@media` query.
- */
 declare const makeItResponsive: MakeItResponsive;
 //#endregion
 //#region src/responsive/normalizeTheme.d.ts

package/lib/index.js

@@ -154,7 +154,8 @@ const transformTheme = ({ theme, breakpoints }) => {
 *    breakpoint-per-property), optimizes (deduplicates identical breakpoints),
 *    and wraps each breakpoint's styles in the appropriate `@media` query.
 */
-const makeItResponsive = ({ theme: customTheme, key = "", css, styles, normalize = false }) => ({ theme = {}, ...props }) => {
+const themeCache = /* @__PURE__ */ new WeakMap();
+const makeItResponsive = ({ theme: customTheme, key = "", css, styles, normalize = true }) => ({ theme = {}, ...props }) => {
 	const internalTheme = customTheme || props[key];
 	if (isEmpty(internalTheme)) return "";
 	const { rootSize, breakpoints, __VITUS_LABS__, ...restTheme } = theme;
@@ -168,18 +169,27 @@ const makeItResponsive = ({ theme: customTheme, key = "", css, styles, normalize
         ${renderStyles(internalTheme)}
       `;
 	const { media, sortedBreakpoints } = __VITUS_LABS__;
-	let helperTheme = internalTheme;
-	if (normalize) helperTheme = normalizeTheme({
-		theme: internalTheme,
-		breakpoints: sortedBreakpoints
-	});
-	const optimizedTheme = optimizeTheme({
-		theme: transformTheme({
-			theme: helperTheme,
+	let optimizedTheme;
+	const cached = themeCache.get(internalTheme);
+	if (cached && cached.breakpoints === sortedBreakpoints) optimizedTheme = cached.optimized;
+	else {
+		let helperTheme = internalTheme;
+		if (normalize) helperTheme = normalizeTheme({
+			theme: internalTheme,
 			breakpoints: sortedBreakpoints
-		}),
-		breakpoints: sortedBreakpoints
-	});
+		});
+		optimizedTheme = optimizeTheme({
+			theme: transformTheme({
+				theme: helperTheme,
+				breakpoints: sortedBreakpoints
+			}),
+			breakpoints: sortedBreakpoints
+		});
+		themeCache.set(internalTheme, {
+			breakpoints: sortedBreakpoints,
+			optimized: optimizedTheme
+		});
+	}
 	return sortedBreakpoints.map((item) => {
 		const breakpointTheme = optimizedTheme[item];
 		if (!breakpointTheme || !media) return "";

package/lib/vitus-labs-unistyle.native.js

@@ -154,7 +154,8 @@ const transformTheme = ({ theme, breakpoints }) => {
 *    breakpoint-per-property), optimizes (deduplicates identical breakpoints),
 *    and wraps each breakpoint's styles in the appropriate `@media` query.
 */
-const makeItResponsive = ({ theme: customTheme, key = "", css, styles, normalize = false }) => ({ theme = {}, ...props }) => {
+const themeCache = /* @__PURE__ */ new WeakMap();
+const makeItResponsive = ({ theme: customTheme, key = "", css, styles, normalize = true }) => ({ theme = {}, ...props }) => {
 	const internalTheme = customTheme || props[key];
 	if (isEmpty(internalTheme)) return "";
 	const { rootSize, breakpoints, __VITUS_LABS__, ...restTheme } = theme;
@@ -168,18 +169,27 @@ const makeItResponsive = ({ theme: customTheme, key = "", css, styles, normalize
         ${renderStyles(internalTheme)}
       `;
 	const { media, sortedBreakpoints } = __VITUS_LABS__;
-	let helperTheme = internalTheme;
-	if (normalize) helperTheme = normalizeTheme({
-		theme: internalTheme,
-		breakpoints: sortedBreakpoints
-	});
-	const optimizedTheme = optimizeTheme({
-		theme: transformTheme({
-			theme: helperTheme,
+	let optimizedTheme;
+	const cached = themeCache.get(internalTheme);
+	if (cached && cached.breakpoints === sortedBreakpoints) optimizedTheme = cached.optimized;
+	else {
+		let helperTheme = internalTheme;
+		if (normalize) helperTheme = normalizeTheme({
+			theme: internalTheme,
 			breakpoints: sortedBreakpoints
-		}),
-		breakpoints: sortedBreakpoints
-	});
+		});
+		optimizedTheme = optimizeTheme({
+			theme: transformTheme({
+				theme: helperTheme,
+				breakpoints: sortedBreakpoints
+			}),
+			breakpoints: sortedBreakpoints
+		});
+		themeCache.set(internalTheme, {
+			breakpoints: sortedBreakpoints,
+			optimized: optimizedTheme
+		});
+	}
 	return sortedBreakpoints.map((item) => {
 		const breakpointTheme = optimizedTheme[item];
 		if (!breakpointTheme || !media) return "";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vitus-labs/unistyle",
-  "version": "1.4.2",
+  "version": "1.4.3-alpha.3+16703b4",
   "license": "MIT",
   "author": "Vit Bokisch <vit@bokisch.cz>",
   "maintainers": [
@@ -9,6 +9,7 @@
   "type": "module",
   "sideEffects": false,
   "exports": {
+    "source": "./src/index.ts",
     "import": "./lib/index.js",
     "types": "./lib/index.d.ts"
   },
@@ -51,9 +52,9 @@
     "react": ">= 19"
   },
   "devDependencies": {
-    "@vitus-labs/core": "1.4.2",
+    "@vitus-labs/core": "1.4.3-alpha.3+16703b4",
     "@vitus-labs/tools-rolldown": "^1.6.0",
     "@vitus-labs/tools-typescript": "^1.6.0"
   },
-  "gitHead": "f12f43c61149964ff4f3f4b80cb6f92da2825915"
+  "gitHead": "16703b4c8dc0525bd504c531aeb082bf593579cc"
 }