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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/lib/index.d.ts CHANGED
@@ -98,16 +98,6 @@ type MakeItResponsive = ({
98
98
  theme?: Theme$1;
99
99
  [key: string]: any;
100
100
  }) => any;
101
- /**
102
- * Core responsive engine used by every styled component in the system.
103
- *
104
- * Returns a styled-components interpolation function that:
105
- * 1. Reads the component's theme prop (via `key` or direct `theme`)
106
- * 2. Without breakpoints → renders plain CSS
107
- * 3. With breakpoints → normalizes, transforms (property-per-breakpoint →
108
- * breakpoint-per-property), optimizes (deduplicates identical breakpoints),
109
- * and wraps each breakpoint's styles in the appropriate `@media` query.
110
- */
111
101
  declare const makeItResponsive: MakeItResponsive;
112
102
  //#endregion
113
103
  //#region src/responsive/normalizeTheme.d.ts
package/lib/index.js CHANGED
@@ -154,7 +154,10 @@ const transformTheme = ({ theme, breakpoints }) => {
154
154
  * breakpoint-per-property), optimizes (deduplicates identical breakpoints),
155
155
  * and wraps each breakpoint's styles in the appropriate `@media` query.
156
156
  */
157
- const makeItResponsive = ({ theme: customTheme, key = "", css, styles, normalize = false }) => ({ theme = {}, ...props }) => {
157
+ let lastThemeRef = null;
158
+ let lastBreakpointsRef = null;
159
+ let lastOptimized = null;
160
+ const makeItResponsive = ({ theme: customTheme, key = "", css, styles, normalize = true }) => ({ theme = {}, ...props }) => {
158
161
  const internalTheme = customTheme || props[key];
159
162
  if (isEmpty(internalTheme)) return "";
160
163
  const { rootSize, breakpoints, __VITUS_LABS__, ...restTheme } = theme;
@@ -168,18 +171,25 @@ const makeItResponsive = ({ theme: customTheme, key = "", css, styles, normalize
168
171
  ${renderStyles(internalTheme)}
169
172
  `;
170
173
  const { media, sortedBreakpoints } = __VITUS_LABS__;
171
- let helperTheme = internalTheme;
172
- if (normalize) helperTheme = normalizeTheme({
173
- theme: internalTheme,
174
- breakpoints: sortedBreakpoints
175
- });
176
- const optimizedTheme = optimizeTheme({
177
- theme: transformTheme({
178
- theme: helperTheme,
174
+ let optimizedTheme;
175
+ if (internalTheme === lastThemeRef && sortedBreakpoints === lastBreakpointsRef && lastOptimized) optimizedTheme = lastOptimized;
176
+ else {
177
+ let helperTheme = internalTheme;
178
+ if (normalize) helperTheme = normalizeTheme({
179
+ theme: internalTheme,
179
180
  breakpoints: sortedBreakpoints
180
- }),
181
- breakpoints: sortedBreakpoints
182
- });
181
+ });
182
+ optimizedTheme = optimizeTheme({
183
+ theme: transformTheme({
184
+ theme: helperTheme,
185
+ breakpoints: sortedBreakpoints
186
+ }),
187
+ breakpoints: sortedBreakpoints
188
+ });
189
+ lastThemeRef = internalTheme;
190
+ lastBreakpointsRef = sortedBreakpoints;
191
+ lastOptimized = optimizedTheme;
192
+ }
183
193
  return sortedBreakpoints.map((item) => {
184
194
  const breakpointTheme = optimizedTheme[item];
185
195
  if (!breakpointTheme || !media) return "";
@@ -154,7 +154,10 @@ const transformTheme = ({ theme, breakpoints }) => {
154
154
  * breakpoint-per-property), optimizes (deduplicates identical breakpoints),
155
155
  * and wraps each breakpoint's styles in the appropriate `@media` query.
156
156
  */
157
- const makeItResponsive = ({ theme: customTheme, key = "", css, styles, normalize = false }) => ({ theme = {}, ...props }) => {
157
+ let lastThemeRef = null;
158
+ let lastBreakpointsRef = null;
159
+ let lastOptimized = null;
160
+ const makeItResponsive = ({ theme: customTheme, key = "", css, styles, normalize = true }) => ({ theme = {}, ...props }) => {
158
161
  const internalTheme = customTheme || props[key];
159
162
  if (isEmpty(internalTheme)) return "";
160
163
  const { rootSize, breakpoints, __VITUS_LABS__, ...restTheme } = theme;
@@ -168,18 +171,25 @@ const makeItResponsive = ({ theme: customTheme, key = "", css, styles, normalize
168
171
  ${renderStyles(internalTheme)}
169
172
  `;
170
173
  const { media, sortedBreakpoints } = __VITUS_LABS__;
171
- let helperTheme = internalTheme;
172
- if (normalize) helperTheme = normalizeTheme({
173
- theme: internalTheme,
174
- breakpoints: sortedBreakpoints
175
- });
176
- const optimizedTheme = optimizeTheme({
177
- theme: transformTheme({
178
- theme: helperTheme,
174
+ let optimizedTheme;
175
+ if (internalTheme === lastThemeRef && sortedBreakpoints === lastBreakpointsRef && lastOptimized) optimizedTheme = lastOptimized;
176
+ else {
177
+ let helperTheme = internalTheme;
178
+ if (normalize) helperTheme = normalizeTheme({
179
+ theme: internalTheme,
179
180
  breakpoints: sortedBreakpoints
180
- }),
181
- breakpoints: sortedBreakpoints
182
- });
181
+ });
182
+ optimizedTheme = optimizeTheme({
183
+ theme: transformTheme({
184
+ theme: helperTheme,
185
+ breakpoints: sortedBreakpoints
186
+ }),
187
+ breakpoints: sortedBreakpoints
188
+ });
189
+ lastThemeRef = internalTheme;
190
+ lastBreakpointsRef = sortedBreakpoints;
191
+ lastOptimized = optimizedTheme;
192
+ }
183
193
  return sortedBreakpoints.map((item) => {
184
194
  const breakpointTheme = optimizedTheme[item];
185
195
  if (!breakpointTheme || !media) return "";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vitus-labs/unistyle",
3
- "version": "1.4.2",
3
+ "version": "1.4.3-alpha.1+cf4e0a6",
4
4
  "license": "MIT",
5
5
  "author": "Vit Bokisch <vit@bokisch.cz>",
6
6
  "maintainers": [
@@ -9,6 +9,7 @@
9
9
  "type": "module",
10
10
  "sideEffects": false,
11
11
  "exports": {
12
+ "source": "./src/index.ts",
12
13
  "import": "./lib/index.js",
13
14
  "types": "./lib/index.d.ts"
14
15
  },
@@ -51,9 +52,9 @@
51
52
  "react": ">= 19"
52
53
  },
53
54
  "devDependencies": {
54
- "@vitus-labs/core": "1.4.2",
55
+ "@vitus-labs/core": "1.4.3-alpha.1+cf4e0a6",
55
56
  "@vitus-labs/tools-rolldown": "^1.6.0",
56
57
  "@vitus-labs/tools-typescript": "^1.6.0"
57
58
  },
58
- "gitHead": "f12f43c61149964ff4f3f4b80cb6f92da2825915"
59
+ "gitHead": "cf4e0a6230687c5c7acc2e07a3248bae4ae55f07"
59
60
  }