react-native-unistyles 3.0.0-alpha.26 → 3.0.0-alpha.27

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 (61) hide show
  1. package/cxx/core/UnistylesState.cpp +4 -0
  2. package/cxx/core/UnistylesState.h +1 -0
  3. package/cxx/hybridObjects/HybridStyleSheet.cpp +4 -0
  4. package/lib/commonjs/core/useTheme.js.map +1 -1
  5. package/lib/commonjs/core/useTheme.native.js.map +1 -1
  6. package/lib/module/core/useTheme.js.map +1 -1
  7. package/lib/module/core/useTheme.native.js.map +1 -1
  8. package/lib/module/web/utils/unistyle.js.map +1 -1
  9. package/lib/typescript/src/core/useBreakpoint.d.ts +1 -1
  10. package/lib/typescript/src/core/useBreakpoint.d.ts.map +1 -1
  11. package/lib/typescript/src/core/useBreakpoint.native.d.ts +1 -1
  12. package/lib/typescript/src/core/useBreakpoint.native.d.ts.map +1 -1
  13. package/lib/typescript/src/core/useTheme.d.ts +2 -40
  14. package/lib/typescript/src/core/useTheme.d.ts.map +1 -1
  15. package/lib/typescript/src/core/useTheme.native.d.ts +2 -40
  16. package/lib/typescript/src/core/useTheme.native.d.ts.map +1 -1
  17. package/lib/typescript/src/global.d.ts +2 -0
  18. package/lib/typescript/src/global.d.ts.map +1 -1
  19. package/lib/typescript/src/types/variants.d.ts +1 -1
  20. package/lib/typescript/src/types/variants.d.ts.map +1 -1
  21. package/lib/typescript/src/web/create.d.ts +10 -1220
  22. package/lib/typescript/src/web/create.d.ts.map +1 -1
  23. package/lib/typescript/src/web/index.d.ts +10 -1220
  24. package/lib/typescript/src/web/index.d.ts.map +1 -1
  25. package/lib/typescript/src/web/runtime.d.ts +4 -4
  26. package/lib/typescript/src/web/runtime.d.ts.map +1 -1
  27. package/lib/typescript/src/web/state.d.ts +1 -2
  28. package/lib/typescript/src/web/state.d.ts.map +1 -1
  29. package/lib/typescript/src/web/utils/unistyle.d.ts +1 -1
  30. package/lib/typescript/src/web/utils/unistyle.d.ts.map +1 -1
  31. package/package.json +3 -4
  32. package/src/core/useTheme.native.ts +2 -1
  33. package/src/core/useTheme.ts +2 -1
  34. package/src/global.ts +4 -1
  35. package/src/types/variants.ts +1 -1
  36. package/src/web/utils/unistyle.ts +1 -1
  37. package/lib/typescript/example/App.d.ts +0 -4
  38. package/lib/typescript/example/App.d.ts.map +0 -1
  39. package/lib/typescript/example/Typography.d.ts +0 -35
  40. package/lib/typescript/example/Typography.d.ts.map +0 -1
  41. package/lib/typescript/example/unistyles.d.ts +0 -63
  42. package/lib/typescript/example/unistyles.d.ts.map +0 -1
  43. package/lib/typescript/expo-example/App.d.ts +0 -4
  44. package/lib/typescript/expo-example/App.d.ts.map +0 -1
  45. package/lib/typescript/expo-example/app/(tabs)/_layout.d.ts +0 -3
  46. package/lib/typescript/expo-example/app/(tabs)/_layout.d.ts.map +0 -1
  47. package/lib/typescript/expo-example/app/(tabs)/explore.d.ts +0 -3
  48. package/lib/typescript/expo-example/app/(tabs)/explore.d.ts.map +0 -1
  49. package/lib/typescript/expo-example/app/(tabs)/index.d.ts +0 -3
  50. package/lib/typescript/expo-example/app/(tabs)/index.d.ts.map +0 -1
  51. package/lib/typescript/expo-example/app/+html.d.ts +0 -4
  52. package/lib/typescript/expo-example/app/+html.d.ts.map +0 -1
  53. package/lib/typescript/expo-example/app/+not-found.d.ts +0 -3
  54. package/lib/typescript/expo-example/app/+not-found.d.ts.map +0 -1
  55. package/lib/typescript/expo-example/app/_layout.d.ts +0 -3
  56. package/lib/typescript/expo-example/app/_layout.d.ts.map +0 -1
  57. package/lib/typescript/expo-example/unistyles.d.ts +0 -63
  58. package/lib/typescript/expo-example/unistyles.d.ts.map +0 -1
  59. package/plugin/__tests__/dependencies.spec.js +0 -448
  60. package/plugin/__tests__/ref.spec.js +0 -1427
  61. package/plugin/__tests__/stylesheet.spec.js +0 -507
@@ -1,507 +0,0 @@
1
- import { pluginTester } from 'babel-plugin-tester'
2
- import plugin from '../'
3
-
4
- pluginTester({
5
- plugin,
6
- pluginOptions: {
7
- debug: false
8
- },
9
- babelOptions: {
10
- plugins: ['@babel/plugin-syntax-jsx'],
11
- generatorOpts: {
12
- retainLines: true
13
- }
14
- },
15
- tests: [
16
- {
17
- title: 'Should not add dependencies to StyleSheet if user is not using theme or miniRuntime',
18
- code: `
19
- import { View, Text } from 'react-native'
20
- import { StyleSheet } from 'react-native-unistyles'
21
-
22
- export const Example = () => {
23
- return (
24
- <View style={styles.container}>
25
- <Text>Hello world</Text>
26
- </View>
27
- )
28
- }
29
-
30
- const styles = StyleSheet.create({
31
- container: {
32
- backgroundColor: 'red'
33
- }
34
- })
35
- `,
36
- output: `
37
- import { UnistylesShadowRegistry } from 'react-native-unistyles'
38
- import { View, Text } from 'react-native'
39
- import { StyleSheet } from 'react-native-unistyles'
40
-
41
- export const Example = () => {
42
- return (
43
- <View
44
- style={[styles.container]}
45
- ref={ref => {
46
- UnistylesShadowRegistry.add(ref, styles.container, undefined, undefined)
47
- return () => UnistylesShadowRegistry.remove(ref)
48
- }}
49
- >
50
- <Text>Hello world</Text>
51
- </View>
52
- )
53
- }
54
-
55
- const styles = StyleSheet.create(
56
- {
57
- container: {
58
- backgroundColor: 'red'
59
- }
60
- },
61
- 793953373
62
- )
63
- `
64
- },
65
- {
66
- title: 'Should add dependencies to StyleSheet if user is using theme',
67
- code: `
68
- import { View, Text } from 'react-native'
69
- import { StyleSheet } from 'react-native-unistyles'
70
-
71
- export const Example = () => {
72
- return (
73
- <View style={styles.container}>
74
- <Text>Hello world</Text>
75
- </View>
76
- )
77
- }
78
-
79
- const styles = StyleSheet.create(theme => ({
80
- container: {
81
- backgroundColor: theme.colors.background
82
- }
83
- }))
84
- `,
85
- output: `
86
- import { UnistylesShadowRegistry } from 'react-native-unistyles'
87
- import { View, Text } from 'react-native'
88
- import { StyleSheet } from 'react-native-unistyles'
89
-
90
- export const Example = () => {
91
- return (
92
- <View
93
- style={[styles.container]}
94
- ref={ref => {
95
- UnistylesShadowRegistry.add(ref, styles.container, undefined, undefined)
96
- return () => UnistylesShadowRegistry.remove(ref)
97
- }}
98
- >
99
- <Text>Hello world</Text>
100
- </View>
101
- )
102
- }
103
-
104
- const styles = StyleSheet.create(
105
- theme => ({
106
- container: {
107
- backgroundColor: theme.colors.background,
108
- uni__dependencies: [0]
109
- }
110
- }),
111
- 793953373
112
- )
113
- `
114
- },
115
- {
116
- title: 'Should add dependencies to StyleSheet even if user did rename import',
117
- code: `
118
- import { View, Text } from 'react-native'
119
- import { StyleSheet as ST } from 'react-native-unistyles'
120
-
121
- export const Example = () => {
122
- return (
123
- <View style={styles.container}>
124
- <Text>Hello world</Text>
125
- </View>
126
- )
127
- }
128
-
129
- const styles = ST.create(theme => ({
130
- container: {
131
- backgroundColor: theme.colors.background
132
- }
133
- }))
134
- `,
135
- output: `
136
- import { UnistylesShadowRegistry } from 'react-native-unistyles'
137
- import { View, Text } from 'react-native'
138
- import { StyleSheet as ST } from 'react-native-unistyles'
139
-
140
- export const Example = () => {
141
- return (
142
- <View
143
- style={[styles.container]}
144
- ref={ref => {
145
- UnistylesShadowRegistry.add(ref, styles.container, undefined, undefined)
146
- return () => UnistylesShadowRegistry.remove(ref)
147
- }}
148
- >
149
- <Text>Hello world</Text>
150
- </View>
151
- )
152
- }
153
-
154
- const styles = ST.create(
155
- theme => ({
156
- container: {
157
- backgroundColor: theme.colors.background,
158
- uni__dependencies: [0]
159
- }
160
- }),
161
- 793953373
162
- )
163
- `
164
- },
165
- {
166
- title: 'Should detect variants for object StyleSheet',
167
- code: `
168
- import { View, Text } from 'react-native'
169
- import { StyleSheet } from 'react-native-unistyles'
170
-
171
- export const Example = () => {
172
- return (
173
- <View style={styles.container}>
174
- <Text>Hello world</Text>
175
- </View>
176
- )
177
- }
178
-
179
- const styles = StyleSheet.create({
180
- container: {
181
- backgroundColor: 'red',
182
- variants: {}
183
- }
184
- })
185
- `,
186
- output: `
187
- import { UnistylesShadowRegistry } from 'react-native-unistyles'
188
- import { View, Text } from 'react-native'
189
- import { StyleSheet } from 'react-native-unistyles'
190
-
191
- export const Example = () => {
192
- return (
193
- <View
194
- style={[styles.container]}
195
- ref={ref => {
196
- UnistylesShadowRegistry.add(ref, styles.container, undefined, undefined)
197
- return () => UnistylesShadowRegistry.remove(ref)
198
- }}
199
- >
200
- <Text>Hello world</Text>
201
- </View>
202
- )
203
- }
204
-
205
- const styles = StyleSheet.create(
206
- {
207
- container: {
208
- backgroundColor: 'red',
209
- variants: {},
210
- uni__dependencies: [4]
211
- }
212
- },
213
- 793953373
214
- )
215
- `
216
- },
217
- {
218
- title: 'Should detect variants for object StyleSheet and dynamic function',
219
- code: `
220
- import { View, Text } from 'react-native'
221
- import { StyleSheet } from 'react-native-unistyles'
222
-
223
- export const Example = () => {
224
- return (
225
- <View style={styles.container}>
226
- <Text>Hello world</Text>
227
- </View>
228
- )
229
- }
230
-
231
- const styles = StyleSheet.create({
232
- container: () => ({
233
- backgroundColor: 'red',
234
- variants: {}
235
- })
236
- })
237
- `,
238
- output: `
239
- import { UnistylesShadowRegistry } from 'react-native-unistyles'
240
- import { View, Text } from 'react-native'
241
- import { StyleSheet } from 'react-native-unistyles'
242
-
243
- export const Example = () => {
244
- return (
245
- <View
246
- style={[styles.container]}
247
- ref={ref => {
248
- UnistylesShadowRegistry.add(ref, styles.container, undefined, undefined)
249
- return () => UnistylesShadowRegistry.remove(ref)
250
- }}
251
- >
252
- <Text>Hello world</Text>
253
- </View>
254
- )
255
- }
256
-
257
- const styles = StyleSheet.create(
258
- {
259
- container: () => ({
260
- backgroundColor: 'red',
261
- variants: {},
262
- uni__dependencies: [4]
263
- })
264
- },
265
- 793953373
266
- )
267
- `
268
- },
269
- {
270
- title: 'Should detect miniRuntime dependency',
271
- code: `
272
- import { View, Text } from 'react-native'
273
- import { StyleSheet } from 'react-native-unistyles'
274
-
275
- export const Example = () => {
276
- return (
277
- <View style={styles.container}>
278
- <Text>Hello world</Text>
279
- </View>
280
- )
281
- }
282
-
283
- const styles = StyleSheet.create((_, rt) => ({
284
- container: () => ({
285
- backgroundColor: 'red',
286
- variants: {},
287
- paddingTop: rt.insets.top
288
- })
289
- }))
290
- `,
291
- output: `
292
- import { UnistylesShadowRegistry } from 'react-native-unistyles'
293
- import { View, Text } from 'react-native'
294
- import { StyleSheet } from 'react-native-unistyles'
295
-
296
- export const Example = () => {
297
- return (
298
- <View
299
- style={[styles.container]}
300
- ref={ref => {
301
- UnistylesShadowRegistry.add(ref, styles.container, undefined, undefined)
302
- return () => UnistylesShadowRegistry.remove(ref)
303
- }}
304
- >
305
- <Text>Hello world</Text>
306
- </View>
307
- )
308
- }
309
-
310
- const styles = StyleSheet.create(
311
- (_, rt) => ({
312
- container: () => ({
313
- backgroundColor: 'red',
314
- variants: {},
315
- paddingTop: rt.insets.top,
316
- uni__dependencies: [4, 9]
317
- })
318
- }),
319
- 793953373
320
- )
321
- `
322
- },
323
- {
324
- title: 'Should detect miniRuntime and theme dependencies even if user renamed it\'s names',
325
- code: `
326
- import { View, Text } from 'react-native'
327
- import { StyleSheet } from 'react-native-unistyles'
328
-
329
- export const Example = () => {
330
- return (
331
- <View style={styles.container}>
332
- <Text>Hello world</Text>
333
- </View>
334
- )
335
- }
336
-
337
- const styles = StyleSheet.create((hhsa, dee) => ({
338
- container: () => ({
339
- backgroundColor: hhsa.colors.background,
340
- variants: {},
341
- paddingTop: dee.colorScheme === 'dark' ? 0 : 10
342
- })
343
- }))
344
- `,
345
- output: `
346
- import { UnistylesShadowRegistry } from 'react-native-unistyles'
347
- import { View, Text } from 'react-native'
348
- import { StyleSheet } from 'react-native-unistyles'
349
-
350
- export const Example = () => {
351
- return (
352
- <View
353
- style={[styles.container]}
354
- ref={ref => {
355
- UnistylesShadowRegistry.add(ref, styles.container, undefined, undefined)
356
- return () => UnistylesShadowRegistry.remove(ref)
357
- }}
358
- >
359
- <Text>Hello world</Text>
360
- </View>
361
- )
362
- }
363
-
364
- const styles = StyleSheet.create(
365
- (hhsa, dee) => ({
366
- container: () => ({
367
- backgroundColor: hhsa.colors.background,
368
- variants: {},
369
- paddingTop: dee.colorScheme === 'dark' ? 0 : 10,
370
- uni__dependencies: [0, 4, 5]
371
- })
372
- }),
373
- 793953373
374
- )
375
- `
376
- },
377
- {
378
- title: 'Should detect dependencies in function',
379
- code: `
380
- import { View, Text } from 'react-native'
381
- import { StyleSheet } from 'react-native-unistyles'
382
-
383
- export const Example = () => {
384
- return (
385
- <View style={styles.container}>
386
- <Text>Hello world</Text>
387
- </View>
388
- )
389
- }
390
-
391
- const styles = StyleSheet.create((theme, rt) => {
392
- return {
393
- container: () => ({
394
- backgroundColor: theme.colors.background,
395
- variants: {},
396
- paddingTop: rt.insets.top
397
- })
398
- }
399
- })
400
- `,
401
- output: `
402
- import { UnistylesShadowRegistry } from 'react-native-unistyles'
403
- import { View, Text } from 'react-native'
404
- import { StyleSheet } from 'react-native-unistyles'
405
-
406
- export const Example = () => {
407
- return (
408
- <View
409
- style={[styles.container]}
410
- ref={ref => {
411
- UnistylesShadowRegistry.add(ref, styles.container, undefined, undefined)
412
- return () => UnistylesShadowRegistry.remove(ref)
413
- }}
414
- >
415
- <Text>Hello world</Text>
416
- </View>
417
- )
418
- }
419
-
420
- const styles = StyleSheet.create((theme, rt) => {
421
- return {
422
- container: () => ({
423
- backgroundColor: theme.colors.background,
424
- variants: {},
425
- paddingTop: rt.insets.top,
426
- uni__dependencies: [0, 4, 9]
427
- })
428
- }
429
- }, 793953373)
430
- `
431
- },
432
- {
433
- title: 'Should generates two different ids for 2 stylesheets in the same file',
434
- code: `
435
- import { View, Text } from 'react-native'
436
- import { StyleSheet } from 'react-native-unistyles'
437
-
438
- export const Example = () => {
439
- return (
440
- <View style={styles.container}>
441
- <Text>Hello world</Text>
442
- </View>
443
- )
444
- }
445
-
446
- const styles = StyleSheet.create((theme, rt) => {
447
- return {
448
- container: () => ({
449
- backgroundColor: theme.colors.background,
450
- variants: {},
451
- paddingTop: rt.insets.top
452
- })
453
- }
454
- })
455
- const styles2 = StyleSheet.create((theme, rt) => {
456
- return {
457
- container: () => ({
458
- backgroundColor: theme.colors.background,
459
- variants: {},
460
- paddingTop: rt.insets.top
461
- })
462
- }
463
- })
464
- `,
465
- output: `
466
- import { UnistylesShadowRegistry } from 'react-native-unistyles'
467
- import { View, Text } from 'react-native'
468
- import { StyleSheet } from 'react-native-unistyles'
469
-
470
- export const Example = () => {
471
- return (
472
- <View
473
- style={[styles.container]}
474
- ref={ref => {
475
- UnistylesShadowRegistry.add(ref, styles.container, undefined, undefined)
476
- return () => UnistylesShadowRegistry.remove(ref)
477
- }}
478
- >
479
- <Text>Hello world</Text>
480
- </View>
481
- )
482
- }
483
-
484
- const styles = StyleSheet.create((theme, rt) => {
485
- return {
486
- container: () => ({
487
- backgroundColor: theme.colors.background,
488
- variants: {},
489
- paddingTop: rt.insets.top,
490
- uni__dependencies: [0, 4, 9]
491
- })
492
- }
493
- }, 793953373)
494
- const styles2 = StyleSheet.create((theme, rt) => {
495
- return {
496
- container: () => ({
497
- backgroundColor: theme.colors.background,
498
- variants: {},
499
- paddingTop: rt.insets.top,
500
- uni__dependencies: [0, 4, 9]
501
- })
502
- }
503
- }, 793953374)
504
- `
505
- },
506
- ]
507
- })