react-native-unistyles 1.0.0-beta.1 → 1.0.0-beta.2

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.
Files changed (9) hide show
  1. package/README.md +81 -1
  2. package/lib/commonjs/utils/styles.js +4 -16
  3. package/lib/commonjs/utils/styles.js.map +1 -1
  4. package/lib/module/utils/styles.js +4 -16
  5. package/lib/module/utils/styles.js.map +1 -1
  6. package/lib/typescript/src/utils/styles.d.ts +1 -5
  7. package/lib/typescript/src/utils/styles.d.ts.map +1 -1
  8. package/package.json +1 -1
  9. package/src/utils/styles.ts +5 -21
package/README.md CHANGED
@@ -7,7 +7,7 @@
7
7
  </picture>
8
8
 
9
9
  ## Features
10
- - ⚡ Blazing fast, adds around ~5ms on top of StyleSheet*
10
+ - ⚡ Blazing fast, adds around ~3ms on top of StyleSheet*
11
11
  - 🎳 Share up to 100% of your styles across platforms in monorepo
12
12
  - 🎯 Doesn't introduce new components
13
13
  - 🖥️ Supports custom breakpoints and css-like media queries
@@ -230,6 +230,86 @@ const stylesheet = createStyles(theme => ({
230
230
  }))
231
231
  ```
232
232
 
233
+ ## Dynamic functions
234
+
235
+ Every style can be transformed to dynamic function to take additional parameters from JSX:
236
+
237
+ ```tsx
238
+ export const ExampleUnistyles = () => {
239
+ const { styles } = useStyles(stylesheet)
240
+
241
+ return (
242
+ <ScrollView contentContainerStyle={styles.scrollContainer}>
243
+ {posts.map((post, index) => (
244
+ <View
245
+ key={post.key}
246
+ // call it as regular function
247
+ style={styles.post(index)}
248
+ >
249
+ <Text>
250
+ {post.title}
251
+ </Text>
252
+ </View>
253
+ ))}
254
+ </ScrollView>
255
+ )
256
+ }
257
+
258
+ const stylesheet = createStyles({
259
+ scrollContainer: {
260
+ flex: 1,
261
+ justifyContent: 'center',
262
+ alignItems: 'center',
263
+ },
264
+ // dynamic function
265
+ post: (index: number) => ({
266
+ backgroundColor: index % 2 === 0 ? 'gold' : 'silver',
267
+ })
268
+ })
269
+ ```
270
+
271
+ ## Migrate from StyleSheet
272
+
273
+ `react-native-unistyles` embraces the simplicity of `StyleSheet`, making it easy to integrate into your project.
274
+
275
+ You can replace `StyleSheet.create` with `createStyles` and it will work exactly the same:
276
+
277
+ ```diff
278
+ -const styles = StyleSheet.create({
279
+ +const styles = createStyles({
280
+ scrollContainer: {
281
+ flex: 1,
282
+ justifyContent: 'center',
283
+ alignItems: 'center',
284
+ }
285
+ })
286
+ ```
287
+
288
+ If you need additional functionalities such as `breakpoints`, `media-queries` or `theme` you can incrementally pass `style(sheet)` into the `useStyles` hook:
289
+
290
+ ```ts
291
+ export const ExampleUnistyles = () => {
292
+ const { styles } = useStyles(stylesheet)
293
+ // ... your component code
294
+ }
295
+ ```
296
+
297
+ With the hook in place, you can now use `breakpoints` and `media-queries`.
298
+
299
+ Additionally, to access the `theme` use a function instead of an `object`:
300
+
301
+ ```diff
302
+ -const stylesheet = createStyles({
303
+ +const stylesheet = createStyles(theme => ({
304
+ scrollContainer: {
305
+ flex: 1,
306
+ justifyContent: 'center',
307
+ alignItems: 'center',
308
+ backgroundColor: theme.colors.background
309
+ }
310
+ }))
311
+ ```
312
+
233
313
  ## Example
234
314
 
235
315
  In order to check out working example go to [example/](./example).
package/lib/commonjs/utils/styles.js CHANGED
@@ -8,10 +8,6 @@ var _breakpoints = require("./breakpoints");
8
8
  /**
9
9
  * Proxies a function to parse its return value for custom media queries or breakpoints.
10
10
  *
11
- * If the function's string representation contains a custom media query or a defined breakpoint,
12
- * the returned function will be proxied to parse its return value based on the provided screen size and breakpoints.
13
- * If neither is found, the original function is returned.
14
- *
15
11
  * @template B - An object type where keys represent breakpoint names and values represent breakpoint values.
16
12
  *
17
13
  * @param {Function} fn - The function to be proxified.
@@ -19,7 +15,7 @@ var _breakpoints = require("./breakpoints");
19
15
  * @param {ScreenSize} screenSize - An object representing the screen size to be checked against the media queries.
20
16
  * @param {B} breakpoints - An object representing the defined breakpoints.
21
17
  *
22
- * @returns {Function} Returns the proxified function or the original function if no custom media query or breakpoint is found in its string representation.
18
+ * @returns {Function} Returns the proxified function
23
19
  *
24
20
  * @example
25
21
  *
@@ -30,17 +26,9 @@ var _breakpoints = require("./breakpoints");
30
26
  * const proxifiedFunction = proxifyFunction(myFunction, 'sm', screenSize, breakpoints)
31
27
  * proxifiedFunction() // parsed style based on screenSize and breakpoints
32
28
  */
33
- const proxifyFunction = (fn, breakpoint, screenSize, breakpoints) => {
34
- const stringifiedFunction = fn.toString();
35
- const hasCustomMediaQuery = stringifiedFunction.includes(':w[') || stringifiedFunction.includes(':h[');
36
- const hasBreakpoint = Object.keys(breakpoints).some(bp => stringifiedFunction.includes(bp));
37
- if (!hasCustomMediaQuery && !hasBreakpoint) {
38
- return fn;
39
- }
40
- return new Proxy(fn, {
41
- apply: (target, thisArg, argumentsList) => parseStyle(target.apply(thisArg, argumentsList), breakpoint, screenSize, breakpoints)
42
- });
43
- };
29
+ const proxifyFunction = (fn, breakpoint, screenSize, breakpoints) => new Proxy(fn, {
30
+ apply: (target, thisArg, argumentsList) => parseStyle(target.apply(thisArg, argumentsList), breakpoint, screenSize, breakpoints)
31
+ });
44
32
 
45
33
  /**
46
34
  * Parses a style object to resolve custom media queries or breakpoints based on the provided screen size and breakpoints.
package/lib/commonjs/utils/styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["_breakpoints","require","proxifyFunction","fn","breakpoint","screenSize","breakpoints","stringifiedFunction","toString","hasCustomMediaQuery","includes","hasBreakpoint","Object","keys","some","bp","Proxy","apply","target","thisArg","argumentsList","parseStyle","exports","style","fromEntries","entries","map","_ref","key","value","isDynamicFunction","isValidStyle","valueWithBreakpoint","getValueForBreakpoint"],"sourceRoot":"../../../src","sources":["utils/styles.ts"],"mappings":";;;;;;AACA,IAAAA,YAAA,GAAAC,OAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMC,eAAe,GAAGA,CAC3BC,EAAY,EAAEC,UAA4B,EAC1CC,UAAsB,EACtBC,WAAc,KACH;EACX,MAAMC,mBAAmB,GAAGJ,EAAE,CAACK,QAAQ,CAAC,CAAC;EACzC,MAAMC,mBAAmB,GAAGF,mBAAmB,CAACG,QAAQ,CAAC,KAAK,CAAC,IAAIH,mBAAmB,CAACG,QAAQ,CAAC,KAAK,CAAC;EACtG,MAAMC,aAAa,GAAGC,MAAM,CACvBC,IAAI,CAACP,WAAW,CAAC,CACjBQ,IAAI,CAACC,EAAE,IAAIR,mBAAmB,CAACG,QAAQ,CAACK,EAAE,CAAC,CAAC;EAEjD,IAAI,CAACN,mBAAmB,IAAI,CAACE,aAAa,EAAE;IACxC,OAAOR,EAAE;EACb;EAEA,OAAO,IAAIa,KAAK,CAACb,EAAE,EAAE;IACjBc,KAAK,EAAEA,CAACC,MAAM,EAAEC,OAAO,EAAEC,aAAa,KAClCC,UAAU,CAACH,MAAM,CAACD,KAAK,CAACE,OAAO,EAAEC,aAAa,CAAC,EAAEhB,UAAU,EAAEC,UAAU,EAAEC,WAAW;EAC5F,CAAC,CAAC;AACN,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAxBAgB,OAAA,CAAApB,eAAA,GAAAA,eAAA;AAyBO,MAAMmB,UAAU,GAAGA,CACtBE,KAA8B,EAC9BnB,UAA4B,EAC5BC,UAAsB,EACtBC,WAAc,KACbM,MAAM,CACNY,WAAW,CAACZ,MAAM,CACda,OAAO,CAACF,KAAK,CAAC,CACdG,GAAG,CAACC,IAAA,IAAkB;EAAA,IAAjB,CAACC,GAAG,EAAEC,KAAK,CAAC,GAAAF,IAAA;EACd,MAAMG,iBAAiB,GAAG,OAAOD,KAAK,KAAK,UAAU;EACrD,MAAME,YAAY,GAAG,OAAOF,KAAK,KAAK,QAAQ,IAAID,GAAG,KAAK,WAAW;EAErE,IAAIE,iBAAiB,IAAIC,YAAY,EAAE;IACnC,OAAO,CAACH,GAAG,EAAEC,KAAK,CAAC;EACvB;EAEA,MAAMG,mBAAmB,GAAGH,KAAkD;EAE9E,OAAO,CAACD,GAAG,EAAE,IAAAK,kCAAqB,EAAID,mBAAmB,EAAE5B,UAAU,EAAEC,UAAU,EAAEC,WAAW,CAAC,CAAC;AACpG,CAAC,CACL,CAAC;AAAAgB,OAAA,CAAAD,UAAA,GAAAA,UAAA"}
1
+ {"version":3,"names":["_breakpoints","require","proxifyFunction","fn","breakpoint","screenSize","breakpoints","Proxy","apply","target","thisArg","argumentsList","parseStyle","exports","style","Object","fromEntries","entries","map","_ref","key","value","isDynamicFunction","isValidStyle","valueWithBreakpoint","getValueForBreakpoint"],"sourceRoot":"../../../src","sources":["utils/styles.ts"],"mappings":";;;;;;AACA,IAAAA,YAAA,GAAAC,OAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMC,eAAe,GAAGA,CAC3BC,EAAY,EAAEC,UAA4B,EAC1CC,UAAsB,EACtBC,WAAc,KACH,IAAIC,KAAK,CAACJ,EAAE,EAAE;EACzBK,KAAK,EAAEA,CAACC,MAAM,EAAEC,OAAO,EAAEC,aAAa,KAClCC,UAAU,CAACH,MAAM,CAACD,KAAK,CAACE,OAAO,EAAEC,aAAa,CAAC,EAAEP,UAAU,EAAEC,UAAU,EAAEC,WAAW;AAC5F,CAAC,CAAC;;AAEF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAxBAO,OAAA,CAAAX,eAAA,GAAAA,eAAA;AAyBO,MAAMU,UAAU,GAAGA,CACtBE,KAA8B,EAC9BV,UAA4B,EAC5BC,UAAsB,EACtBC,WAAc,KACbS,MAAM,CACNC,WAAW,CAACD,MAAM,CACdE,OAAO,CAACH,KAAK,CAAC,CACdI,GAAG,CAACC,IAAA,IAAkB;EAAA,IAAjB,CAACC,GAAG,EAAEC,KAAK,CAAC,GAAAF,IAAA;EACd,MAAMG,iBAAiB,GAAG,OAAOD,KAAK,KAAK,UAAU;EACrD,MAAME,YAAY,GAAG,OAAOF,KAAK,KAAK,QAAQ,IAAID,GAAG,KAAK,WAAW;EAErE,IAAIE,iBAAiB,IAAIC,YAAY,EAAE;IACnC,OAAO,CAACH,GAAG,EAAEC,KAAK,CAAC;EACvB;EAEA,MAAMG,mBAAmB,GAAGH,KAAkD;EAE9E,OAAO,CAACD,GAAG,EAAE,IAAAK,kCAAqB,EAAID,mBAAmB,EAAEpB,UAAU,EAAEC,UAAU,EAAEC,WAAW,CAAC,CAAC;AACpG,CAAC,CACL,CAAC;AAAAO,OAAA,CAAAD,UAAA,GAAAA,UAAA"}
package/lib/module/utils/styles.js CHANGED
@@ -3,10 +3,6 @@ import { getValueForBreakpoint } from './breakpoints';
3
3
  /**
4
4
  * Proxies a function to parse its return value for custom media queries or breakpoints.
5
5
  *
6
- * If the function's string representation contains a custom media query or a defined breakpoint,
7
- * the returned function will be proxied to parse its return value based on the provided screen size and breakpoints.
8
- * If neither is found, the original function is returned.
9
- *
10
6
  * @template B - An object type where keys represent breakpoint names and values represent breakpoint values.
11
7
  *
12
8
  * @param {Function} fn - The function to be proxified.
@@ -14,7 +10,7 @@ import { getValueForBreakpoint } from './breakpoints';
14
10
  * @param {ScreenSize} screenSize - An object representing the screen size to be checked against the media queries.
15
11
  * @param {B} breakpoints - An object representing the defined breakpoints.
16
12
  *
17
- * @returns {Function} Returns the proxified function or the original function if no custom media query or breakpoint is found in its string representation.
13
+ * @returns {Function} Returns the proxified function
18
14
  *
19
15
  * @example
20
16
  *
@@ -25,17 +21,9 @@ import { getValueForBreakpoint } from './breakpoints';
25
21
  * const proxifiedFunction = proxifyFunction(myFunction, 'sm', screenSize, breakpoints)
26
22
  * proxifiedFunction() // parsed style based on screenSize and breakpoints
27
23
  */
28
- export const proxifyFunction = (fn, breakpoint, screenSize, breakpoints) => {
29
- const stringifiedFunction = fn.toString();
30
- const hasCustomMediaQuery = stringifiedFunction.includes(':w[') || stringifiedFunction.includes(':h[');
31
- const hasBreakpoint = Object.keys(breakpoints).some(bp => stringifiedFunction.includes(bp));
32
- if (!hasCustomMediaQuery && !hasBreakpoint) {
33
- return fn;
34
- }
35
- return new Proxy(fn, {
36
- apply: (target, thisArg, argumentsList) => parseStyle(target.apply(thisArg, argumentsList), breakpoint, screenSize, breakpoints)
37
- });
38
- };
24
+ export const proxifyFunction = (fn, breakpoint, screenSize, breakpoints) => new Proxy(fn, {
25
+ apply: (target, thisArg, argumentsList) => parseStyle(target.apply(thisArg, argumentsList), breakpoint, screenSize, breakpoints)
26
+ });
39
27
 
40
28
  /**
41
29
  * Parses a style object to resolve custom media queries or breakpoints based on the provided screen size and breakpoints.
package/lib/module/utils/styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["getValueForBreakpoint","proxifyFunction","fn","breakpoint","screenSize","breakpoints","stringifiedFunction","toString","hasCustomMediaQuery","includes","hasBreakpoint","Object","keys","some","bp","Proxy","apply","target","thisArg","argumentsList","parseStyle","style","fromEntries","entries","map","_ref","key","value","isDynamicFunction","isValidStyle","valueWithBreakpoint"],"sourceRoot":"../../../src","sources":["utils/styles.ts"],"mappings":"AACA,SAASA,qBAAqB,QAAQ,eAAe;;AAErD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,eAAe,GAAGA,CAC3BC,EAAY,EAAEC,UAA4B,EAC1CC,UAAsB,EACtBC,WAAc,KACH;EACX,MAAMC,mBAAmB,GAAGJ,EAAE,CAACK,QAAQ,CAAC,CAAC;EACzC,MAAMC,mBAAmB,GAAGF,mBAAmB,CAACG,QAAQ,CAAC,KAAK,CAAC,IAAIH,mBAAmB,CAACG,QAAQ,CAAC,KAAK,CAAC;EACtG,MAAMC,aAAa,GAAGC,MAAM,CACvBC,IAAI,CAACP,WAAW,CAAC,CACjBQ,IAAI,CAACC,EAAE,IAAIR,mBAAmB,CAACG,QAAQ,CAACK,EAAE,CAAC,CAAC;EAEjD,IAAI,CAACN,mBAAmB,IAAI,CAACE,aAAa,EAAE;IACxC,OAAOR,EAAE;EACb;EAEA,OAAO,IAAIa,KAAK,CAACb,EAAE,EAAE;IACjBc,KAAK,EAAEA,CAACC,MAAM,EAAEC,OAAO,EAAEC,aAAa,KAClCC,UAAU,CAACH,MAAM,CAACD,KAAK,CAACE,OAAO,EAAEC,aAAa,CAAC,EAAEhB,UAAU,EAAEC,UAAU,EAAEC,WAAW;EAC5F,CAAC,CAAC;AACN,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMe,UAAU,GAAGA,CACtBC,KAA8B,EAC9BlB,UAA4B,EAC5BC,UAAsB,EACtBC,WAAc,KACbM,MAAM,CACNW,WAAW,CAACX,MAAM,CACdY,OAAO,CAACF,KAAK,CAAC,CACdG,GAAG,CAACC,IAAA,IAAkB;EAAA,IAAjB,CAACC,GAAG,EAAEC,KAAK,CAAC,GAAAF,IAAA;EACd,MAAMG,iBAAiB,GAAG,OAAOD,KAAK,KAAK,UAAU;EACrD,MAAME,YAAY,GAAG,OAAOF,KAAK,KAAK,QAAQ,IAAID,GAAG,KAAK,WAAW;EAErE,IAAIE,iBAAiB,IAAIC,YAAY,EAAE;IACnC,OAAO,CAACH,GAAG,EAAEC,KAAK,CAAC;EACvB;EAEA,MAAMG,mBAAmB,GAAGH,KAAkD;EAE9E,OAAO,CAACD,GAAG,EAAE1B,qBAAqB,CAAI8B,mBAAmB,EAAE3B,UAAU,EAAEC,UAAU,EAAEC,WAAW,CAAC,CAAC;AACpG,CAAC,CACL,CAAC"}
1
+ {"version":3,"names":["getValueForBreakpoint","proxifyFunction","fn","breakpoint","screenSize","breakpoints","Proxy","apply","target","thisArg","argumentsList","parseStyle","style","Object","fromEntries","entries","map","_ref","key","value","isDynamicFunction","isValidStyle","valueWithBreakpoint"],"sourceRoot":"../../../src","sources":["utils/styles.ts"],"mappings":"AACA,SAASA,qBAAqB,QAAQ,eAAe;;AAErD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,eAAe,GAAGA,CAC3BC,EAAY,EAAEC,UAA4B,EAC1CC,UAAsB,EACtBC,WAAc,KACH,IAAIC,KAAK,CAACJ,EAAE,EAAE;EACzBK,KAAK,EAAEA,CAACC,MAAM,EAAEC,OAAO,EAAEC,aAAa,KAClCC,UAAU,CAACH,MAAM,CAACD,KAAK,CAACE,OAAO,EAAEC,aAAa,CAAC,EAAEP,UAAU,EAAEC,UAAU,EAAEC,WAAW;AAC5F,CAAC,CAAC;;AAEF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMM,UAAU,GAAGA,CACtBC,KAA8B,EAC9BT,UAA4B,EAC5BC,UAAsB,EACtBC,WAAc,KACbQ,MAAM,CACNC,WAAW,CAACD,MAAM,CACdE,OAAO,CAACH,KAAK,CAAC,CACdI,GAAG,CAACC,IAAA,IAAkB;EAAA,IAAjB,CAACC,GAAG,EAAEC,KAAK,CAAC,GAAAF,IAAA;EACd,MAAMG,iBAAiB,GAAG,OAAOD,KAAK,KAAK,UAAU;EACrD,MAAME,YAAY,GAAG,OAAOF,KAAK,KAAK,QAAQ,IAAID,GAAG,KAAK,WAAW;EAErE,IAAIE,iBAAiB,IAAIC,YAAY,EAAE;IACnC,OAAO,CAACH,GAAG,EAAEC,KAAK,CAAC;EACvB;EAEA,MAAMG,mBAAmB,GAAGH,KAAkD;EAE9E,OAAO,CAACD,GAAG,EAAElB,qBAAqB,CAAIsB,mBAAmB,EAAEnB,UAAU,EAAEC,UAAU,EAAEC,WAAW,CAAC,CAAC;AACpG,CAAC,CACL,CAAC"}
package/lib/typescript/src/utils/styles.d.ts CHANGED
@@ -2,10 +2,6 @@ import type { CustomNamedStyles, ScreenSize } from '../types';
2
2
  /**
3
3
  * Proxies a function to parse its return value for custom media queries or breakpoints.
4
4
  *
5
- * If the function's string representation contains a custom media query or a defined breakpoint,
6
- * the returned function will be proxied to parse its return value based on the provided screen size and breakpoints.
7
- * If neither is found, the original function is returned.
8
- *
9
5
  * @template B - An object type where keys represent breakpoint names and values represent breakpoint values.
10
6
  *
11
7
  * @param {Function} fn - The function to be proxified.
@@ -13,7 +9,7 @@ import type { CustomNamedStyles, ScreenSize } from '../types';
13
9
  * @param {ScreenSize} screenSize - An object representing the screen size to be checked against the media queries.
14
10
  * @param {B} breakpoints - An object representing the defined breakpoints.
15
11
  *
16
- * @returns {Function} Returns the proxified function or the original function if no custom media query or breakpoint is found in its string representation.
12
+ * @returns {Function} Returns the proxified function
17
13
  *
18
14
  * @example
19
15
  *
package/lib/typescript/src/utils/styles.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/utils/styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAG7D;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,eAAO,MAAM,eAAe,yCACpB,QAAQ,4CACA,UAAU,qBAEvB,QAeF,CAAA;AAED;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,eAAO,MAAM,UAAU,kHAGP,UAAU;;CAiBrB,CAAA"}
1
+ {"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/utils/styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAG7D;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,eAAO,MAAM,eAAe,yCACpB,QAAQ,4CACA,UAAU,qBAEvB,QAGD,CAAA;AAEF;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,eAAO,MAAM,UAAU,kHAGP,UAAU;;CAiBrB,CAAA"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-native-unistyles",
3
- "version": "1.0.0-beta.1",
3
+ "version": "1.0.0-beta.2",
4
4
  "description": "Level up your React Native StyleSheet",
5
5
  "scripts": {
6
6
  "test": "jest",
package/src/utils/styles.ts CHANGED
@@ -4,10 +4,6 @@ import { getValueForBreakpoint } from './breakpoints'
4
4
  /**
5
5
  * Proxies a function to parse its return value for custom media queries or breakpoints.
6
6
  *
7
- * If the function's string representation contains a custom media query or a defined breakpoint,
8
- * the returned function will be proxied to parse its return value based on the provided screen size and breakpoints.
9
- * If neither is found, the original function is returned.
10
- *
11
7
  * @template B - An object type where keys represent breakpoint names and values represent breakpoint values.
12
8
  *
13
9
  * @param {Function} fn - The function to be proxified.
@@ -15,7 +11,7 @@ import { getValueForBreakpoint } from './breakpoints'
15
11
  * @param {ScreenSize} screenSize - An object representing the screen size to be checked against the media queries.
16
12
  * @param {B} breakpoints - An object representing the defined breakpoints.
17
13
  *
18
- * @returns {Function} Returns the proxified function or the original function if no custom media query or breakpoint is found in its string representation.
14
+ * @returns {Function} Returns the proxified function
19
15
  *
20
16
  * @example
21
17
  *
@@ -30,22 +26,10 @@ export const proxifyFunction = <B extends Record<string, number>>(
30
26
  fn: Function, breakpoint: keyof B & string,
31
27
  screenSize: ScreenSize,
32
28
  breakpoints: B
33
- ): Function => {
34
- const stringifiedFunction = fn.toString()
35
- const hasCustomMediaQuery = stringifiedFunction.includes(':w[') || stringifiedFunction.includes(':h[')
36
- const hasBreakpoint = Object
37
- .keys(breakpoints)
38
- .some(bp => stringifiedFunction.includes(bp))
39
-
40
- if (!hasCustomMediaQuery && !hasBreakpoint) {
41
- return fn
42
- }
43
-
44
- return new Proxy(fn, {
45
- apply: (target, thisArg, argumentsList) =>
46
- parseStyle(target.apply(thisArg, argumentsList), breakpoint, screenSize, breakpoints)
47
- })
48
- }
29
+ ): Function => new Proxy(fn, {
30
+ apply: (target, thisArg, argumentsList) =>
31
+ parseStyle(target.apply(thisArg, argumentsList), breakpoint, screenSize, breakpoints)
32
+ })
49
33
 
50
34
  /**
51
35
  * Parses a style object to resolve custom media queries or breakpoints based on the provided screen size and breakpoints.