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

Sign up to get free protection for your applications and to get access to all the features.
Files changed (44) hide show
  1. package/README.md +342 -35
  2. package/lib/commonjs/createUnistyles.js +17 -3
  3. package/lib/commonjs/createUnistyles.js.map +1 -1
  4. package/lib/commonjs/hooks/index.js +13 -0
  5. package/lib/commonjs/hooks/index.js.map +1 -0
  6. package/lib/commonjs/hooks/useDimensions.js +19 -0
  7. package/lib/commonjs/hooks/useDimensions.js.map +1 -0
  8. package/lib/commonjs/hooks/useDimensions.web.js +31 -0
  9. package/lib/commonjs/hooks/useDimensions.web.js.map +1 -0
  10. package/lib/commonjs/utils/styles.js +20 -10
  11. package/lib/commonjs/utils/styles.js.map +1 -1
  12. package/lib/commonjs/utils/styles.spec.js +66 -0
  13. package/lib/commonjs/utils/styles.spec.js.map +1 -1
  14. package/lib/module/createUnistyles.js +17 -3
  15. package/lib/module/createUnistyles.js.map +1 -1
  16. package/lib/module/hooks/index.js +2 -0
  17. package/lib/module/hooks/index.js.map +1 -0
  18. package/lib/module/hooks/useDimensions.js +12 -0
  19. package/lib/module/hooks/useDimensions.js.map +1 -0
  20. package/lib/module/hooks/useDimensions.web.js +24 -0
  21. package/lib/module/hooks/useDimensions.web.js.map +1 -0
  22. package/lib/module/utils/styles.js +20 -10
  23. package/lib/module/utils/styles.js.map +1 -1
  24. package/lib/module/utils/styles.spec.js +66 -0
  25. package/lib/module/utils/styles.spec.js.map +1 -1
  26. package/lib/typescript/src/createUnistyles.d.ts +5 -1
  27. package/lib/typescript/src/createUnistyles.d.ts.map +1 -1
  28. package/lib/typescript/src/hooks/index.d.ts +2 -0
  29. package/lib/typescript/src/hooks/index.d.ts.map +1 -0
  30. package/lib/typescript/src/hooks/useDimensions.d.ts +3 -0
  31. package/lib/typescript/src/hooks/useDimensions.d.ts.map +1 -0
  32. package/lib/typescript/src/hooks/useDimensions.web.d.ts +3 -0
  33. package/lib/typescript/src/hooks/useDimensions.web.d.ts.map +1 -0
  34. package/lib/typescript/src/types.d.ts +26 -8
  35. package/lib/typescript/src/types.d.ts.map +1 -1
  36. package/lib/typescript/src/utils/styles.d.ts +1 -3
  37. package/lib/typescript/src/utils/styles.d.ts.map +1 -1
  38. package/package.json +1 -1
  39. package/src/createUnistyles.ts +20 -4
  40. package/src/hooks/index.ts +1 -0
  41. package/src/hooks/useDimensions.ts +11 -0
  42. package/src/hooks/useDimensions.web.ts +30 -0
  43. package/src/types.ts +64 -20
  44. package/src/utils/styles.ts +43 -13
@@ -93,6 +93,72 @@ describe('styles', () => {
93
93
  fontWeight: 'bold'
94
94
  });
95
95
  });
96
+ it('should correctly parse transform styles', () => {
97
+ const screenSize = {
98
+ width: 400,
99
+ height: 800
100
+ };
101
+ const breakpoint = 'sm';
102
+ const breakpoints = {
103
+ xs: 0,
104
+ sm: 400,
105
+ md: 800
106
+ };
107
+ const style = {
108
+ transform: [{
109
+ translateX: {
110
+ sm: 120,
111
+ md: 200
112
+ },
113
+ translateY: 200
114
+ }]
115
+ };
116
+ expect((0, _styles.parseStyle)(style, breakpoint, screenSize, breakpoints)).toEqual({
117
+ transform: [{
118
+ translateX: 120,
119
+ translateY: 200
120
+ }]
121
+ });
122
+ });
123
+ it('should correctly parse shadowOffset styles', () => {
124
+ const screenSize = {
125
+ width: 400,
126
+ height: 800
127
+ };
128
+ const breakpoint = 'sm';
129
+ const breakpoints = {
130
+ xs: 0,
131
+ sm: 400,
132
+ md: 800
133
+ };
134
+ const style = {
135
+ shadowOffset: {
136
+ width: 0,
137
+ height: 4
138
+ }
139
+ };
140
+ const styleWithBreakpoints = {
141
+ shadowOffset: {
142
+ width: 0,
143
+ height: {
144
+ sm: 10,
145
+ md: 20
146
+ }
147
+ }
148
+ };
149
+ expect((0, _styles.parseStyle)(style, breakpoint, screenSize, breakpoints)).toEqual({
150
+ shadowOffset: {
151
+ width: 0,
152
+ height: 4
153
+ }
154
+ });
155
+ expect((0, _styles.parseStyle)(styleWithBreakpoints, breakpoint, screenSize, breakpoints)).toEqual({
156
+ shadowOffset: {
157
+ width: 0,
158
+ height: 10
159
+ }
160
+ });
161
+ });
96
162
  });
97
163
  });
98
164
  //# sourceMappingURL=styles.spec.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["_styles","require","describe","it","screenSize","width","height","breakpoint","breakpoints","xs","sm","md","dynamicFunction","isEven","backgroundColor","expect","proxifyFunction","toEqual","style","fontSize","fontWeight","parseStyle"],"sourceRoot":"../../../src","sources":["utils/styles.spec.ts"],"mappings":"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"}
1
+ {"version":3,"names":["_styles","require","describe","it","screenSize","width","height","breakpoint","breakpoints","xs","sm","md","dynamicFunction","isEven","backgroundColor","expect","proxifyFunction","toEqual","style","fontSize","fontWeight","parseStyle","transform","translateX","translateY","shadowOffset","styleWithBreakpoints"],"sourceRoot":"../../../src","sources":["utils/styles.spec.ts"],"mappings":"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"}
@@ -1,14 +1,28 @@
1
1
  import { useContext } from 'react';
2
- import { useWindowDimensions } from 'react-native';
3
2
  import { UnistylesContext } from './UnistylesTheme';
4
3
  import { getBreakpointFromScreenWidth, proxifyFunction, parseStyle, sortAndValidateBreakpoints } from './utils';
4
+ import { useDimensions } from './hooks';
5
5
  export const createUnistyles = breakpoints => {
6
6
  const sortedBreakpoints = sortAndValidateBreakpoints(breakpoints);
7
7
  return {
8
- createStyles: styles => styles,
8
+ /**
9
+ * @deprecated The method should not be used, proposed version by the community is createStyleSheet, will be removed in RC
10
+ */
11
+ createStyles: styles => {
12
+ if (typeof styles === 'function') {
13
+ return styles;
14
+ }
15
+ return styles;
16
+ },
17
+ createStyleSheet: styles => {
18
+ if (typeof styles === 'function') {
19
+ return styles;
20
+ }
21
+ return styles;
22
+ },
9
23
  useStyles: stylesheet => {
10
24
  const theme = useContext(UnistylesContext);
11
- const dimensions = useWindowDimensions();
25
+ const dimensions = useDimensions();
12
26
  const breakpoint = getBreakpointFromScreenWidth(dimensions.width, sortedBreakpoints);
13
27
  const screenSize = {
14
28
  width: dimensions.width,
@@ -1 +1 @@
1
- {"version":3,"names":["useContext","useWindowDimensions","UnistylesContext","getBreakpointFromScreenWidth","proxifyFunction","parseStyle","sortAndValidateBreakpoints","createUnistyles","breakpoints","sortedBreakpoints","createStyles","styles","useStyles","stylesheet","theme","dimensions","breakpoint","width","screenSize","height","parsedStyles","dynamicStyleSheet","Object","entries","reduce","acc","_ref","key","value","x"],"sourceRoot":"../../src","sources":["createUnistyles.ts"],"mappings":"AAAA,SAASA,UAAU,QAAQ,OAAO;AAClC,SAASC,mBAAmB,QAAQ,cAAc;AAElD,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,SAASC,4BAA4B,EAAEC,eAAe,EAAEC,UAAU,EAAEC,0BAA0B,QAAQ,SAAS;AAE/G,OAAO,MAAMC,eAAe,GAA8CC,WAAc,IAAK;EACzF,MAAMC,iBAAiB,GAAGH,0BAA0B,CAACE,WAAW,CAAM;EAEtE,OAAO;IACHE,YAAY,EAAsCC,MAAqC,IAAKA,MAAW;IACvGC,SAAS,EAAwCC,UAA4C,IAAK;MAC9F,MAAMC,KAAK,GAAGd,UAAU,CAACE,gBAAgB,CAAM;MAC/C,MAAMa,UAAU,GAAGd,mBAAmB,CAAC,CAAC;MACxC,MAAMe,UAAU,GAAGb,4BAA4B,CAAIY,UAAU,CAACE,KAAK,EAAER,iBAAiB,CAAC;MACvF,MAAMS,UAAsB,GAAG;QAC3BD,KAAK,EAAEF,UAAU,CAACE,KAAK;QACvBE,MAAM,EAAEJ,UAAU,CAACI;MACvB,CAAC;MAED,IAAI,CAACN,UAAU,EAAE;QACb,OAAO;UACHC,KAAK;UACLH,MAAM,EAAE,CAAC;QACb,CAAC;MACL;MAEA,MAAMS,YAAY,GAAG,OAAOP,UAAU,KAAK,UAAU,GAC/CA,UAAU,CAACC,KAAK,CAAC,GACjBD,UAAU;MAEhB,MAAMQ,iBAAiB,GAAGC,MAAM,CAC3BC,OAAO,CAACH,YAAY,CAAC,CACrBI,MAAM,CAAC,CAACC,GAAG,EAAAC,IAAA,KAAmB;QAAA,IAAjB,CAACC,GAAG,EAAEC,KAAK,CAAC,GAAAF,IAAA;QACtB,MAAMG,CAAC,GAAGD,KAAiC;QAE3C,IAAI,OAAOA,KAAK,KAAK,UAAU,EAAE;UAC7B,OAAO;YACH,GAAGH,GAAG;YACN,CAACE,GAAG,GAAGvB,eAAe,CAAIwB,KAAK,EAAEZ,UAAU,EAAEE,UAAU,EAAET,iBAAiB;UAC9E,CAAC;QACL;QAEA,OAAO;UACH,GAAGgB,GAAG;UACN,CAACE,GAAG,GAAGtB,UAAU,CAAQwB,CAAC,EAAEb,UAAU,EAAEE,UAAU,EAAET,iBAAiB;QACzE,CAAC;MACL,CAAC,EAAE,CAAC,CAAO,CAAC;MAEhB,OAAO;QACHK,KAAK;QACLH,MAAM,EAAEU;MACZ,CAAC;IACL;EACJ,CAAC;AACL,CAAC"}
1
+ {"version":3,"names":["useContext","UnistylesContext","getBreakpointFromScreenWidth","proxifyFunction","parseStyle","sortAndValidateBreakpoints","useDimensions","createUnistyles","breakpoints","sortedBreakpoints","createStyles","styles","createStyleSheet","useStyles","stylesheet","theme","dimensions","breakpoint","width","screenSize","height","parsedStyles","dynamicStyleSheet","Object","entries","reduce","acc","_ref","key","value","x"],"sourceRoot":"../../src","sources":["createUnistyles.ts"],"mappings":"AAAA,SAASA,UAAU,QAAQ,OAAO;AAElC,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,SAASC,4BAA4B,EAAEC,eAAe,EAAEC,UAAU,EAAEC,0BAA0B,QAAQ,SAAS;AAC/G,SAASC,aAAa,QAAQ,SAAS;AAEvC,OAAO,MAAMC,eAAe,GAA8CC,WAAc,IAAK;EACzF,MAAMC,iBAAiB,GAAGJ,0BAA0B,CAACG,WAAW,CAAC;EAEjE,OAAO;IACH;AACR;AACA;IACQE,YAAY,EAAyCC,MAAqF,IAAY;MAClJ,IAAI,OAAOA,MAAM,KAAK,UAAU,EAAE;QAC9B,OAAOA,MAAM;MACjB;MAEA,OAAOA,MAAM;IACjB,CAAC;IACDC,gBAAgB,EAAyCD,MAAqF,IAAY;MACtJ,IAAI,OAAOA,MAAM,KAAK,UAAU,EAAE;QAC9B,OAAOA,MAAM;MACjB;MAEA,OAAOA,MAAM;IACjB,CAAC;IACDE,SAAS,EAAwCC,UAA4C,IAAK;MAC9F,MAAMC,KAAK,GAAGf,UAAU,CAACC,gBAAgB,CAAM;MAC/C,MAAMe,UAAU,GAAGV,aAAa,CAAC,CAAC;MAClC,MAAMW,UAAU,GAAGf,4BAA4B,CAAIc,UAAU,CAACE,KAAK,EAAET,iBAAiB,CAAC;MACvF,MAAMU,UAAsB,GAAG;QAC3BD,KAAK,EAAEF,UAAU,CAACE,KAAK;QACvBE,MAAM,EAAEJ,UAAU,CAACI;MACvB,CAAC;MAED,IAAI,CAACN,UAAU,EAAE;QACb,OAAO;UACHC,KAAK;UACLJ,MAAM,EAAE,CAAC;QACb,CAAC;MACL;MAEA,MAAMU,YAAY,GAAG,OAAOP,UAAU,KAAK,UAAU,GAC/CA,UAAU,CAACC,KAAK,CAAC,GACjBD,UAAU;MAEhB,MAAMQ,iBAAiB,GAAGC,MAAM,CAC3BC,OAAO,CAACH,YAAY,CAAC,CACrBI,MAAM,CAAC,CAACC,GAAG,EAAAC,IAAA,KAAmB;QAAA,IAAjB,CAACC,GAAG,EAAEC,KAAK,CAAC,GAAAF,IAAA;QACtB,MAAMG,CAAC,GAAGD,KAAiC;QAE3C,IAAI,OAAOA,KAAK,KAAK,UAAU,EAAE;UAC7B,OAAO;YACH,GAAGH,GAAG;YACN,CAACE,GAAG,GAAGzB,eAAe,CAAI0B,KAAK,EAAEZ,UAAU,EAAEE,UAAU,EAAEV,iBAAiB;UAC9E,CAAC;QACL;QAEA,OAAO;UACH,GAAGiB,GAAG;UACN,CAACE,GAAG,GAAGxB,UAAU,CAAQ0B,CAAC,EAAEb,UAAU,EAAEE,UAAU,EAAEV,iBAAiB;QACzE,CAAC;MACL,CAAC,EAAE,CAAC,CAAO,CAAC;MAEhB,OAAO;QACHM,KAAK;QACLJ,MAAM,EAAEW;MACZ,CAAC;IACL;EACJ,CAAC;AACL,CAAC"}
@@ -0,0 +1,2 @@
1
+ export { useDimensions } from './useDimensions';
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["useDimensions"],"sourceRoot":"../../../src","sources":["hooks/index.ts"],"mappings":"AAAA,SAASA,aAAa,QAAQ,iBAAiB"}
@@ -0,0 +1,12 @@
1
+ import { useWindowDimensions } from 'react-native';
2
+ export const useDimensions = () => {
3
+ const {
4
+ width,
5
+ height
6
+ } = useWindowDimensions();
7
+ return {
8
+ width,
9
+ height
10
+ };
11
+ };
12
+ //# sourceMappingURL=useDimensions.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["useWindowDimensions","useDimensions","width","height"],"sourceRoot":"../../../src","sources":["hooks/useDimensions.ts"],"mappings":"AAAA,SAASA,mBAAmB,QAAQ,cAAc;AAGlD,OAAO,MAAMC,aAAa,GAAGA,CAAA,KAAkB;EAC3C,MAAM;IAAEC,KAAK;IAAEC;EAAO,CAAC,GAAGH,mBAAmB,CAAC,CAAC;EAE/C,OAAO;IACHE,KAAK;IACLC;EACJ,CAAC;AACL,CAAC"}
@@ -0,0 +1,24 @@
1
+ import { useEffect, useRef, useState } from 'react';
2
+ export const useDimensions = () => {
3
+ const timerRef = useRef();
4
+ const [screenSize, setScreenSize] = useState({
5
+ width: window.innerWidth,
6
+ height: window.innerHeight
7
+ });
8
+ useEffect(() => {
9
+ const handleResize = () => {
10
+ clearTimeout(timerRef.current);
11
+ timerRef.current = setTimeout(() => setScreenSize({
12
+ width: window.innerWidth,
13
+ height: window.innerHeight
14
+ }), 100);
15
+ };
16
+ window.addEventListener('resize', handleResize);
17
+ return () => {
18
+ window.removeEventListener('resize', handleResize);
19
+ clearTimeout(timerRef.current);
20
+ };
21
+ }, []);
22
+ return screenSize;
23
+ };
24
+ //# sourceMappingURL=useDimensions.web.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["useEffect","useRef","useState","useDimensions","timerRef","screenSize","setScreenSize","width","window","innerWidth","height","innerHeight","handleResize","clearTimeout","current","setTimeout","addEventListener","removeEventListener"],"sourceRoot":"../../../src","sources":["hooks/useDimensions.web.ts"],"mappings":"AAAA,SAASA,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AAGnD,OAAO,MAAMC,aAAa,GAAGA,CAAA,KAAkB;EAC3C,MAAMC,QAAQ,GAAGH,MAAM,CAAgC,CAAC;EACxD,MAAM,CAACI,UAAU,EAAEC,aAAa,CAAC,GAAGJ,QAAQ,CAAa;IACrDK,KAAK,EAAEC,MAAM,CAACC,UAAU;IACxBC,MAAM,EAAEF,MAAM,CAACG;EACnB,CAAC,CAAC;EAEFX,SAAS,CAAC,MAAM;IACZ,MAAMY,YAAY,GAAGA,CAAA,KAAM;MACvBC,YAAY,CAACT,QAAQ,CAACU,OAAO,CAAC;MAE9BV,QAAQ,CAACU,OAAO,GAAGC,UAAU,CAAC,MAAMT,aAAa,CAAC;QAC9CC,KAAK,EAAEC,MAAM,CAACC,UAAU;QACxBC,MAAM,EAAEF,MAAM,CAACG;MACnB,CAAC,CAAC,EAAE,GAAG,CAAC;IACZ,CAAC;IAEDH,MAAM,CAACQ,gBAAgB,CAAC,QAAQ,EAAEJ,YAAY,CAAC;IAE/C,OAAO,MAAM;MACTJ,MAAM,CAACS,mBAAmB,CAAC,QAAQ,EAAEL,YAAY,CAAC;MAClDC,YAAY,CAACT,QAAQ,CAACU,OAAO,CAAC;IAClC,CAAC;EACL,CAAC,EAAE,EAAE,CAAC;EAEN,OAAOT,UAAU;AACrB,CAAC"}
@@ -50,14 +50,24 @@ export const proxifyFunction = (fn, breakpoint, screenSize, breakpoints) => new
50
50
  * const parsedStyle = parseStyle(style, 'sm', screenSize, breakpoints)
51
51
  * // { fontSize: '12px' }
52
52
  */
53
- export const parseStyle = (style, breakpoint, screenSize, breakpoints) => Object.fromEntries(Object.entries(style).map(_ref => {
54
- let [key, value] = _ref;
55
- const isDynamicFunction = typeof value === 'function';
56
- const isValidStyle = typeof value !== 'object' || key === 'transform';
57
- if (isDynamicFunction || isValidStyle) {
58
- return [key, value];
59
- }
60
- const valueWithBreakpoint = value;
61
- return [key, getValueForBreakpoint(valueWithBreakpoint, breakpoint, screenSize, breakpoints)];
62
- }));
53
+ export const parseStyle = (style, breakpoint, screenSize, breakpoints) => {
54
+ const entries = Object.entries(style);
55
+ return Object.fromEntries(entries.map(_ref => {
56
+ let [key, value] = _ref;
57
+ const isNestedStyle = key === 'shadowOffset';
58
+ if (isNestedStyle) {
59
+ return [key, parseStyle(value, breakpoint, screenSize, breakpoints)];
60
+ }
61
+ const isTransform = key === 'transform';
62
+ if (isTransform && Array.isArray(value)) {
63
+ return [key, value.map(value => parseStyle(value, breakpoint, screenSize, breakpoints))];
64
+ }
65
+ const isDynamicFunction = typeof value === 'function';
66
+ const isValidStyle = typeof value !== 'object';
67
+ if (isDynamicFunction || isValidStyle) {
68
+ return [key, value];
69
+ }
70
+ return [key, getValueForBreakpoint(value, breakpoint, screenSize, breakpoints)];
71
+ }));
72
+ };
63
73
  //# sourceMappingURL=styles.js.map
@@ -1 +1 @@
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"}
1
+ {"version":3,"names":["getValueForBreakpoint","proxifyFunction","fn","breakpoint","screenSize","breakpoints","Proxy","apply","target","thisArg","argumentsList","parseStyle","style","entries","Object","fromEntries","map","_ref","key","value","isNestedStyle","isTransform","Array","isArray","isDynamicFunction","isValidStyle"],"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,KACV;EACJ,MAAMQ,OAAO,GAAGC,MAAM,CAACD,OAAO,CAACD,KAAK,CAGnC;EAED,OAAOE,MAAM,CACRC,WAAW,CAACF,OAAO,CACfG,GAAG,CAACC,IAAA,IAAkB;IAAA,IAAjB,CAACC,GAAG,EAAEC,KAAK,CAAC,GAAAF,IAAA;IACd,MAAMG,aAAa,GAAGF,GAAG,KAAK,cAAc;IAE5C,IAAIE,aAAa,EAAE;MACf,OAAO,CACHF,GAAG,EACHP,UAAU,CAACQ,KAAK,EAA6BhB,UAAU,EAAEC,UAAU,EAAEC,WAAW,CAAC,CACpF;IACL;IAEA,MAAMgB,WAAW,GAAGH,GAAG,KAAK,WAAW;IAEvC,IAAIG,WAAW,IAAIC,KAAK,CAACC,OAAO,CAACJ,KAAK,CAAC,EAAE;MACrC,OAAO,CACHD,GAAG,EACHC,KAAK,CAACH,GAAG,CAACG,KAAK,IAAIR,UAAU,CAACQ,KAAK,EAAEhB,UAAU,EAAEC,UAAU,EAAEC,WAAW,CAAC,CAAC,CAC7E;IACL;IAEA,MAAMmB,iBAAiB,GAAG,OAAOL,KAAK,KAAK,UAAU;IACrD,MAAMM,YAAY,GAAG,OAAON,KAAK,KAAK,QAAQ;IAE9C,IAAIK,iBAAiB,IAAIC,YAAY,EAAE;MACnC,OAAO,CAACP,GAAG,EAAEC,KAAK,CAAC;IACvB;IAEA,OAAO,CACHD,GAAG,EACHlB,qBAAqB,CACjBmB,KAAK,EACLhB,UAAU,EACVC,UAAU,EACVC,WACJ,CAAC,CACJ;EACL,CAAC,CACL,CAAC;AACT,CAAC"}
@@ -91,6 +91,72 @@ describe('styles', () => {
91
91
  fontWeight: 'bold'
92
92
  });
93
93
  });
94
+ it('should correctly parse transform styles', () => {
95
+ const screenSize = {
96
+ width: 400,
97
+ height: 800
98
+ };
99
+ const breakpoint = 'sm';
100
+ const breakpoints = {
101
+ xs: 0,
102
+ sm: 400,
103
+ md: 800
104
+ };
105
+ const style = {
106
+ transform: [{
107
+ translateX: {
108
+ sm: 120,
109
+ md: 200
110
+ },
111
+ translateY: 200
112
+ }]
113
+ };
114
+ expect(parseStyle(style, breakpoint, screenSize, breakpoints)).toEqual({
115
+ transform: [{
116
+ translateX: 120,
117
+ translateY: 200
118
+ }]
119
+ });
120
+ });
121
+ it('should correctly parse shadowOffset styles', () => {
122
+ const screenSize = {
123
+ width: 400,
124
+ height: 800
125
+ };
126
+ const breakpoint = 'sm';
127
+ const breakpoints = {
128
+ xs: 0,
129
+ sm: 400,
130
+ md: 800
131
+ };
132
+ const style = {
133
+ shadowOffset: {
134
+ width: 0,
135
+ height: 4
136
+ }
137
+ };
138
+ const styleWithBreakpoints = {
139
+ shadowOffset: {
140
+ width: 0,
141
+ height: {
142
+ sm: 10,
143
+ md: 20
144
+ }
145
+ }
146
+ };
147
+ expect(parseStyle(style, breakpoint, screenSize, breakpoints)).toEqual({
148
+ shadowOffset: {
149
+ width: 0,
150
+ height: 4
151
+ }
152
+ });
153
+ expect(parseStyle(styleWithBreakpoints, breakpoint, screenSize, breakpoints)).toEqual({
154
+ shadowOffset: {
155
+ width: 0,
156
+ height: 10
157
+ }
158
+ });
159
+ });
94
160
  });
95
161
  });
96
162
  //# sourceMappingURL=styles.spec.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["parseStyle","proxifyFunction","describe","it","screenSize","width","height","breakpoint","breakpoints","xs","sm","md","dynamicFunction","isEven","backgroundColor","expect","toEqual","style","fontSize","fontWeight"],"sourceRoot":"../../../src","sources":["utils/styles.spec.ts"],"mappings":"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"}
1
+ {"version":3,"names":["parseStyle","proxifyFunction","describe","it","screenSize","width","height","breakpoint","breakpoints","xs","sm","md","dynamicFunction","isEven","backgroundColor","expect","toEqual","style","fontSize","fontWeight","transform","translateX","translateY","shadowOffset","styleWithBreakpoints"],"sourceRoot":"../../../src","sources":["utils/styles.spec.ts"],"mappings":"AAAA,SAASA,UAAU,EAAEC,eAAe,QAAQ,UAAU;AAGtDC,QAAQ,CAAC,QAAQ,EAAE,MAAM;EACrBA,QAAQ,CAAC,iBAAiB,EAAE,MAAM;IAC9BC,EAAE,CAAC,yCAAyC,EAAE,MAAM;MAChD,MAAMC,UAAsB,GAAG;QAC3BC,KAAK,EAAE,GAAG;QACVC,MAAM,EAAE;MACZ,CAAC;MACD,MAAMC,UAAU,GAAG,IAAI;MACvB,MAAMC,WAAW,GAAG;QAChBC,EAAE,EAAE,CAAC;QACLC,EAAE,EAAE,GAAG;QACPC,EAAE,EAAE;MACR,CAAC;MACD,MAAMC,eAAe,GAAIC,MAAe,KAAM;QAC1CC,eAAe,EAAE;UACbJ,EAAE,EAAEG,MAAM,GACJ,OAAO,GACP,KAAK;UACXF,EAAE,EAAEE,MAAM,GACJ,QAAQ,GACR;QACV;MACJ,CAAC,CAAC;MAEFE,MAAM,CAACd,eAAe,CAACW,eAAe,EAAEL,UAAU,EAAEH,UAAU,EAAEI,WAAW,CAAC,CAAC,IAAI,CAAC,CAAC,CAACQ,OAAO,CAAC;QACxFF,eAAe,EAAE;MACrB,CAAC,CAAC;IACN,CAAC,CAAC;IAEFX,EAAE,CAAC,yDAAyD,EAAE,MAAM;MAChE,MAAMC,UAAsB,GAAG;QAC3BC,KAAK,EAAE,GAAG;QACVC,MAAM,EAAE;MACZ,CAAC;MACD,MAAMC,UAAU,GAAG,IAAI;MACvB,MAAMC,WAAW,GAAG;QAChBC,EAAE,EAAE,CAAC;QACLC,EAAE,EAAE,GAAG;QACPC,EAAE,EAAE;MACR,CAAC;MACD,MAAMC,eAAe,GAAIC,MAAe,KAAM;QAC1CC,eAAe,EAAE;UACb,UAAU,EAAED,MAAM,GACZ,OAAO,GACP,KAAK;UACX,SAAS,EAAEA,MAAM,GACX,QAAQ,GACR;QACV;MACJ,CAAC,CAAC;MAEFE,MAAM,CAACd,eAAe,CAACW,eAAe,EAAEL,UAAU,EAAEH,UAAU,EAAEI,WAAW,CAAC,CAAC,KAAK,CAAC,CAAC,CAACQ,OAAO,CAAC;QACzFF,eAAe,EAAE;MACrB,CAAC,CAAC;IACN,CAAC,CAAC;IAEFX,EAAE,CAAC,kEAAkE,EAAE,MAAM;MACzE,MAAMC,UAAsB,GAAG;QAC3BC,KAAK,EAAE,GAAG;QACVC,MAAM,EAAE;MACZ,CAAC;MACD,MAAMC,UAAU,GAAG,IAAI;MACvB,MAAMC,WAAW,GAAG;QAChBC,EAAE,EAAE,CAAC;QACLC,EAAE,EAAE,GAAG;QACPC,EAAE,EAAE;MACR,CAAC;MACD,MAAMC,eAAe,GAAIC,MAAe,KAAM;QAC1CC,eAAe,EAAED,MAAM,GACjB,MAAM,GACN;MACV,CAAC,CAAC;MAEFE,MAAM,CAACd,eAAe,CAACW,eAAe,EAAEL,UAAU,EAAEH,UAAU,EAAEI,WAAW,CAAC,CAAC,KAAK,CAAC,CAAC,CAACQ,OAAO,CAAC;QACzFF,eAAe,EAAE;MACrB,CAAC,CAAC;IACN,CAAC,CAAC;EACN,CAAC,CAAC;EAEFZ,QAAQ,CAAC,YAAY,EAAE,MAAM;IACzBC,EAAE,CAAC,+BAA+B,EAAE,MAAM;MACtC,MAAMC,UAAsB,GAAG;QAC3BC,KAAK,EAAE,GAAG;QACVC,MAAM,EAAE;MACZ,CAAC;MACD,MAAMC,UAAU,GAAG,IAAI;MACvB,MAAMC,WAAW,GAAG;QAChBC,EAAE,EAAE,CAAC;QACLC,EAAE,EAAE,GAAG;QACPC,EAAE,EAAE;MACR,CAAC;MACD,MAAMM,KAAK,GAAG;QACVC,QAAQ,EAAE;UACNR,EAAE,EAAE,EAAE;UACNC,EAAE,EAAE;QACR,CAAC;QACDG,eAAe,EAAE;UACbL,EAAE,EAAE,MAAM;UACVE,EAAE,EAAE;QACR,CAAC;QACDQ,UAAU,EAAE;MAChB,CAAC;MAEDJ,MAAM,CAACf,UAAU,CAACiB,KAAK,EAAyDV,UAAU,EAAEH,UAAU,EAAEI,WAAW,CAAC,CAAC,CAACQ,OAAO,CAAC;QAC1HE,QAAQ,EAAE,EAAE;QACZJ,eAAe,EAAE,MAAM;QACvBK,UAAU,EAAE;MAChB,CAAC,CAAC;IACN,CAAC,CAAC;IAEFhB,EAAE,CAAC,yCAAyC,EAAE,MAAM;MAChD,MAAMC,UAAsB,GAAG;QAC3BC,KAAK,EAAE,GAAG;QACVC,MAAM,EAAE;MACZ,CAAC;MACD,MAAMC,UAAU,GAAG,IAAI;MACvB,MAAMC,WAAW,GAAG;QAChBC,EAAE,EAAE,CAAC;QACLC,EAAE,EAAE,GAAG;QACPC,EAAE,EAAE;MACR,CAAC;MACD,MAAMM,KAAK,GAAG;QACVG,SAAS,EAAE,CACP;UACIC,UAAU,EAAE;YACRX,EAAE,EAAE,GAAG;YACPC,EAAE,EAAE;UACR,CAAC;UACDW,UAAU,EAAE;QAChB,CAAC;MAET,CAAC;MAEDP,MAAM,CAACf,UAAU,CAACiB,KAAK,EAAyDV,UAAU,EAAEH,UAAU,EAAEI,WAAW,CAAC,CAAC,CAACQ,OAAO,CAAC;QAC1HI,SAAS,EAAE,CACP;UACIC,UAAU,EAAE,GAAG;UACfC,UAAU,EAAE;QAChB,CAAC;MAET,CAAC,CAAC;IACN,CAAC,CAAC;IAEFnB,EAAE,CAAC,4CAA4C,EAAE,MAAM;MACnD,MAAMC,UAAsB,GAAG;QAC3BC,KAAK,EAAE,GAAG;QACVC,MAAM,EAAE;MACZ,CAAC;MACD,MAAMC,UAAU,GAAG,IAAI;MACvB,MAAMC,WAAW,GAAG;QAChBC,EAAE,EAAE,CAAC;QACLC,EAAE,EAAE,GAAG;QACPC,EAAE,EAAE;MACR,CAAC;MACD,MAAMM,KAAK,GAAG;QACVM,YAAY,EAAE;UACVlB,KAAK,EAAE,CAAC;UACRC,MAAM,EAAE;QACZ;MACJ,CAAC;MACD,MAAMkB,oBAAoB,GAAG;QACzBD,YAAY,EAAE;UACVlB,KAAK,EAAE,CAAC;UACRC,MAAM,EAAE;YACJI,EAAE,EAAE,EAAE;YACNC,EAAE,EAAE;UACR;QACJ;MACJ,CAAC;MAEDI,MAAM,CAACf,UAAU,CAACiB,KAAK,EAAyDV,UAAU,EAAEH,UAAU,EAAEI,WAAW,CAAC,CAAC,CAACQ,OAAO,CAAC;QAC1HO,YAAY,EAAE;UACVlB,KAAK,EAAE,CAAC;UACRC,MAAM,EAAE;QACZ;MACJ,CAAC,CAAC;MACFS,MAAM,CAACf,UAAU,CAACwB,oBAAoB,EAAyDjB,UAAU,EAAEH,UAAU,EAAEI,WAAW,CAAC,CAAC,CAACQ,OAAO,CAAC;QACzIO,YAAY,EAAE;UACVlB,KAAK,EAAE,CAAC;UACRC,MAAM,EAAE;QACZ;MACJ,CAAC,CAAC;IACN,CAAC,CAAC;EACN,CAAC,CAAC;AACN,CAAC,CAAC"}
@@ -1,6 +1,10 @@
1
1
  import type { CreateStylesFactory, CustomNamedStyles, ExtractBreakpoints, RemoveKeysWithPrefix } from './types';
2
2
  export declare const createUnistyles: <B extends Record<string, number>, T = {}>(breakpoints: B) => {
3
- createStyles: <S extends CustomNamedStyles<S, B>>(styles: S | CreateStylesFactory<S, T>) => S;
3
+ /**
4
+ * @deprecated The method should not be used, proposed version by the community is createStyleSheet, will be removed in RC
5
+ */
6
+ createStyles: <S extends CustomNamedStyles<S, B>, X>(styles: S | X | CustomNamedStyles<S, B> | ((theme: T) => X | CustomNamedStyles<X, B>)) => S | X;
7
+ createStyleSheet: <S_1 extends CustomNamedStyles<S_1, B>, X_1>(styles: S_1 | X_1 | CustomNamedStyles<S_1, B> | ((theme: T) => X_1 | CustomNamedStyles<X_1, B>)) => S_1 | X_1;
4
8
  useStyles: <ST extends CustomNamedStyles<ST, B>>(stylesheet?: ST | CreateStylesFactory<ST, T> | undefined) => {
5
9
  theme: T;
6
10
  styles: ExtractBreakpoints<RemoveKeysWithPrefix<ST, B>, B>;
@@ -1 +1 @@
1
- {"version":3,"file":"createUnistyles.d.ts","sourceRoot":"","sources":["../../../src/createUnistyles.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,mBAAmB,EAAE,iBAAiB,EAAc,kBAAkB,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAI3H,eAAO,MAAM,eAAe;;;;;;CAiD3B,CAAA"}
1
+ {"version":3,"file":"createUnistyles.d.ts","sourceRoot":"","sources":["../../../src/createUnistyles.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAE,iBAAiB,EAAc,kBAAkB,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAK3H,eAAO,MAAM,eAAe;IAIpB;;OAEG;;;;;;;CA2DV,CAAA"}
@@ -0,0 +1,2 @@
1
+ export { useDimensions } from './useDimensions';
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA"}
@@ -0,0 +1,3 @@
1
+ import type { ScreenSize } from '../types';
2
+ export declare const useDimensions: () => ScreenSize;
3
+ //# sourceMappingURL=useDimensions.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useDimensions.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useDimensions.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAE1C,eAAO,MAAM,aAAa,QAAO,UAOhC,CAAA"}
@@ -0,0 +1,3 @@
1
+ import type { ScreenSize } from '../types';
2
+ export declare const useDimensions: () => ScreenSize;
3
+ //# sourceMappingURL=useDimensions.web.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useDimensions.web.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useDimensions.web.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAE1C,eAAO,MAAM,aAAa,QAAO,UA0BhC,CAAA"}
@@ -1,19 +1,37 @@
1
- import type { ImageStyle, TextStyle, TransformsStyle, ViewStyle } from 'react-native';
2
- import type { CSSProperties } from 'react';
1
+ import type { ImageStyle, TextStyle, ViewStyle } from 'react-native';
2
+ import type { MatrixTransform, PerpectiveTransform, RotateTransform, RotateXTransform, RotateYTransform, RotateZTransform, ScaleTransform, ScaleXTransform, ScaleYTransform, SkewXTransform, SkewYTransform, TranslateXTransform, TranslateYTransform } from 'react-native/Libraries/StyleSheet/StyleSheetTypes';
3
3
  export type ScreenSize = {
4
4
  width: number;
5
5
  height: number;
6
6
  };
7
- export type CreateStylesFactory<T, Theme> = (theme: Theme) => T;
7
+ export type CreateStylesFactory<ST, Theme> = (theme: Theme) => ST;
8
8
  type StyleProperty<T, B extends Record<string, number>> = {
9
- [key in keyof T]?: {
10
- [innerKey in keyof B]?: T[key];
9
+ [K in keyof T]: {
10
+ [innerKey in keyof B]?: T[K];
11
11
  } | {
12
- [innerKey in `:w${string}` | `:h${string}`]?: T[key];
13
- } | T[key];
12
+ [innerKey in string]?: T[K];
13
+ } | T[K];
14
14
  };
15
+ type ShadowOffsetProps<B extends Record<string, number>> = {
16
+ shadowOffset: {
17
+ width: number | {
18
+ [innerKey in keyof B]?: number;
19
+ };
20
+ height: number | {
21
+ [innerKey in keyof B]?: number;
22
+ };
23
+ };
24
+ };
25
+ type TransformStyles<B extends Record<string, number>> = PerpectiveTransform | StyleProperty<PerpectiveTransform, B> | RotateTransform | StyleProperty<RotateTransform, B> | RotateXTransform | StyleProperty<RotateXTransform, B> | RotateYTransform | StyleProperty<RotateYTransform, B> | RotateZTransform | StyleProperty<RotateZTransform, B> | ScaleTransform | StyleProperty<ScaleTransform, B> | ScaleXTransform | StyleProperty<ScaleXTransform, B> | ScaleYTransform | StyleProperty<ScaleYTransform, B> | TranslateXTransform | StyleProperty<TranslateXTransform, B> | TranslateYTransform | StyleProperty<TranslateYTransform, B> | SkewXTransform | StyleProperty<SkewXTransform, B> | SkewYTransform | StyleProperty<SkewYTransform, B> | MatrixTransform | StyleProperty<MatrixTransform, B>;
26
+ type TransformProps<B extends Record<string, number>> = {
27
+ transform: Array<TransformStyles<B>>;
28
+ };
29
+ type UnistyleView = Omit<Omit<ViewStyle, 'shadowOffset'>, 'transform'>;
30
+ type UnistyleText = Omit<Omit<TextStyle, 'shadowOffset'>, 'transform'>;
31
+ type UnistyleImage = Omit<Omit<ImageStyle, 'shadowOffset'>, 'transform'>;
32
+ export type StaticStyles<B extends Record<string, number>> = (UnistyleView | StyleProperty<UnistyleView, B>) | (UnistyleText | StyleProperty<UnistyleText, B>) | (UnistyleImage | StyleProperty<UnistyleImage, B>) & TransformProps<B> & ShadowOffsetProps<B>;
15
33
  export type CustomNamedStyles<T, B extends Record<string, number>> = {
16
- [P in keyof T]: ViewStyle | TextStyle | ImageStyle | TransformsStyle | CSSProperties | StyleProperty<ViewStyle, B> | StyleProperty<ImageStyle, B> | StyleProperty<TextStyle, B> | ((...args: Array<never>) => ViewStyle | TextStyle | ImageStyle | TransformsStyle | CSSProperties | StyleProperty<ViewStyle, B> | StyleProperty<ImageStyle, B> | StyleProperty<TextStyle, B>);
34
+ [K in keyof T]: T[K] extends (...args: infer A) => unknown ? (...args: A) => StaticStyles<B> : StaticStyles<B>;
17
35
  };
18
36
  export type ExtractBreakpoints<T, B extends Record<string, number>> = T extends Partial<Record<keyof B & string, infer V>> ? V : T extends (...args: infer A) => infer R ? (...args: A) => ExtractBreakpoints<R, B> : {
19
37
  [K in keyof T]: T[K] extends (...args: infer A) => infer R ? (...args: A) => ExtractBreakpoints<R, B> : T[K] extends object ? ExtractBreakpoints<T[K], B> : T[K];
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.ts"],"names":[],"mappings":"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"}
@@ -46,7 +46,5 @@ export declare const proxifyFunction: <B extends Record<string, number>>(fn: Fun
46
46
  * const parsedStyle = parseStyle(style, 'sm', screenSize, breakpoints)
47
47
  * // { fontSize: '12px' }
48
48
  */
49
- export declare const parseStyle: <T, B extends Record<string, number>>(style: CustomNamedStyles<T, B>, breakpoint: keyof B & string, screenSize: ScreenSize, breakpoints: B) => {
50
- [k: string]: unknown;
51
- };
49
+ export declare const parseStyle: <T, B extends Record<string, number>>(style: CustomNamedStyles<T, B>, breakpoint: keyof B & string, screenSize: ScreenSize, breakpoints: B) => T;
52
50
  //# sourceMappingURL=styles.d.ts.map
@@ -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;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,eAAO,MAAM,eAAe,yCACpB,QAAQ,4CACA,UAAU,qBAEvB,QAGD,CAAA;AAEF;;;;;;;;;;;;;;;;;;;;;;;;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,sBA+CzB,CAAA"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-native-unistyles",
3
- "version": "1.0.0-beta.2",
3
+ "version": "1.0.0-beta.4",
4
4
  "description": "Level up your React Native StyleSheet",
5
5
  "scripts": {
6
6
  "test": "jest",
@@ -1,17 +1,33 @@
1
1
  import { useContext } from 'react'
2
- import { useWindowDimensions } from 'react-native'
3
2
  import type { CreateStylesFactory, CustomNamedStyles, ScreenSize, ExtractBreakpoints, RemoveKeysWithPrefix } from './types'
4
3
  import { UnistylesContext } from './UnistylesTheme'
5
4
  import { getBreakpointFromScreenWidth, proxifyFunction, parseStyle, sortAndValidateBreakpoints } from './utils'
5
+ import { useDimensions } from './hooks'
6
6
 
7
7
  export const createUnistyles = <B extends Record<string, number>, T = {}>(breakpoints: B) => {
8
- const sortedBreakpoints = sortAndValidateBreakpoints(breakpoints) as B
8
+ const sortedBreakpoints = sortAndValidateBreakpoints(breakpoints)
9
9
 
10
10
  return {
11
- createStyles: <S extends CustomNamedStyles<S, B>>(styles: S | CreateStylesFactory<S, T>) => styles as S,
11
+ /**
12
+ * @deprecated The method should not be used, proposed version by the community is createStyleSheet, will be removed in RC
13
+ */
14
+ createStyles: <S extends CustomNamedStyles<S, B>, X>(styles: S | CustomNamedStyles<S, B> | X | ((theme: T) => X | CustomNamedStyles<X, B>)): S | X => {
15
+ if (typeof styles === 'function') {
16
+ return styles as X
17
+ }
18
+
19
+ return styles as S
20
+ },
21
+ createStyleSheet: <S extends CustomNamedStyles<S, B>, X>(styles: S | CustomNamedStyles<S, B> | X | ((theme: T) => X | CustomNamedStyles<X, B>)): S | X => {
22
+ if (typeof styles === 'function') {
23
+ return styles as X
24
+ }
25
+
26
+ return styles as S
27
+ },
12
28
  useStyles: <ST extends CustomNamedStyles<ST, B>>(stylesheet?: ST | CreateStylesFactory<ST, T>) => {
13
29
  const theme = useContext(UnistylesContext) as T
14
- const dimensions = useWindowDimensions()
30
+ const dimensions = useDimensions()
15
31
  const breakpoint = getBreakpointFromScreenWidth<B>(dimensions.width, sortedBreakpoints)
16
32
  const screenSize: ScreenSize = {
17
33
  width: dimensions.width,
@@ -0,0 +1 @@
1
+ export { useDimensions } from './useDimensions'
@@ -0,0 +1,11 @@
1
+ import { useWindowDimensions } from 'react-native'
2
+ import type { ScreenSize } from '../types'
3
+
4
+ export const useDimensions = (): ScreenSize => {
5
+ const { width, height } = useWindowDimensions()
6
+
7
+ return {
8
+ width,
9
+ height
10
+ }
11
+ }
@@ -0,0 +1,30 @@
1
+ import { useEffect, useRef, useState } from 'react'
2
+ import type { ScreenSize } from '../types'
3
+
4
+ export const useDimensions = (): ScreenSize => {
5
+ const timerRef = useRef<ReturnType<typeof setTimeout>>()
6
+ const [screenSize, setScreenSize] = useState<ScreenSize>({
7
+ width: window.innerWidth,
8
+ height: window.innerHeight
9
+ })
10
+
11
+ useEffect(() => {
12
+ const handleResize = () => {
13
+ clearTimeout(timerRef.current)
14
+
15
+ timerRef.current = setTimeout(() => setScreenSize({
16
+ width: window.innerWidth,
17
+ height: window.innerHeight
18
+ }), 100)
19
+ }
20
+
21
+ window.addEventListener('resize', handleResize)
22
+
23
+ return () => {
24
+ window.removeEventListener('resize', handleResize)
25
+ clearTimeout(timerRef.current)
26
+ }
27
+ }, [])
28
+
29
+ return screenSize
30
+ }