react-native-unistyles 2.0.0-alpha.3 → 2.0.0-alpha.4

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 (71) hide show
  1. package/ios/UnistylesHelpers.h +4 -0
  2. package/ios/UnistylesHelpers.mm +20 -0
  3. package/ios/UnistylesModule.h +1 -3
  4. package/ios/UnistylesModule.mm +55 -65
  5. package/lib/commonjs/UnistyleRegistry.js +12 -1
  6. package/lib/commonjs/UnistyleRegistry.js.map +1 -1
  7. package/lib/commonjs/UnistylesRuntime.js +5 -2
  8. package/lib/commonjs/UnistylesRuntime.js.map +1 -1
  9. package/lib/commonjs/hooks/useDimensions.web.js +7 -5
  10. package/lib/commonjs/hooks/useDimensions.web.js.map +1 -1
  11. package/lib/commonjs/index.js +2 -1
  12. package/lib/commonjs/index.js.map +1 -1
  13. package/lib/commonjs/types/cxx.js +4 -0
  14. package/lib/commonjs/types/cxx.js.map +1 -1
  15. package/lib/commonjs/useInitialTheme.js +1 -1
  16. package/lib/commonjs/useInitialTheme.js.map +1 -1
  17. package/lib/commonjs/utils/breakpoints.js.map +1 -1
  18. package/lib/module/UnistyleRegistry.js +12 -1
  19. package/lib/module/UnistyleRegistry.js.map +1 -1
  20. package/lib/module/UnistylesRuntime.js +5 -2
  21. package/lib/module/UnistylesRuntime.js.map +1 -1
  22. package/lib/module/hooks/useDimensions.web.js +8 -6
  23. package/lib/module/hooks/useDimensions.web.js.map +1 -1
  24. package/lib/module/index.js +1 -0
  25. package/lib/module/index.js.map +1 -1
  26. package/lib/module/types/cxx.js +4 -0
  27. package/lib/module/types/cxx.js.map +1 -1
  28. package/lib/module/useInitialTheme.js +2 -2
  29. package/lib/module/useInitialTheme.js.map +1 -1
  30. package/lib/module/utils/breakpoints.js.map +1 -1
  31. package/lib/typescript/src/UnistyleRegistry.d.ts +2 -0
  32. package/lib/typescript/src/UnistyleRegistry.d.ts.map +1 -1
  33. package/lib/typescript/src/UnistylesRuntime.d.ts +4 -40
  34. package/lib/typescript/src/UnistylesRuntime.d.ts.map +1 -1
  35. package/lib/typescript/src/global.d.ts +1 -0
  36. package/lib/typescript/src/global.d.ts.map +1 -1
  37. package/lib/typescript/src/hooks/useDimensions.web.d.ts.map +1 -1
  38. package/lib/typescript/src/index.d.ts +1 -0
  39. package/lib/typescript/src/index.d.ts.map +1 -1
  40. package/lib/typescript/src/types/cxx.d.ts +7 -2
  41. package/lib/typescript/src/types/cxx.d.ts.map +1 -1
  42. package/lib/typescript/src/useStyles.d.ts +3 -39
  43. package/lib/typescript/src/useStyles.d.ts.map +1 -1
  44. package/lib/typescript/src/useUnistyles.d.ts +2 -38
  45. package/lib/typescript/src/useUnistyles.d.ts.map +1 -1
  46. package/package.json +12 -13
  47. package/react-native-unistyles.podspec +2 -1
  48. package/src/UnistyleRegistry.ts +16 -1
  49. package/src/UnistylesRuntime.ts +6 -2
  50. package/src/global.ts +3 -1
  51. package/src/hooks/useDimensions.web.ts +9 -6
  52. package/src/index.ts +2 -0
  53. package/src/types/cxx.ts +9 -2
  54. package/src/useInitialTheme.ts +2 -2
  55. package/src/utils/breakpoints.ts +1 -1
  56. package/ios/UnistylesRuntime.h +0 -48
  57. package/ios/UnistylesRuntime.mm +0 -228
  58. package/lib/typescript/examples/expo/src/App.d.ts +0 -3
  59. package/lib/typescript/examples/expo/src/App.d.ts.map +0 -1
  60. package/lib/typescript/examples/expo/src/examples/Cxx.d.ts +0 -3
  61. package/lib/typescript/examples/expo/src/examples/Cxx.d.ts.map +0 -1
  62. package/lib/typescript/examples/expo/src/examples/index.d.ts +0 -2
  63. package/lib/typescript/examples/expo/src/examples/index.d.ts.map +0 -1
  64. package/lib/typescript/examples/expo/src/index.d.ts +0 -2
  65. package/lib/typescript/examples/expo/src/index.d.ts.map +0 -1
  66. package/lib/typescript/examples/expo/src/styles/breakpoints.d.ts +0 -8
  67. package/lib/typescript/examples/expo/src/styles/breakpoints.d.ts.map +0 -1
  68. package/lib/typescript/examples/expo/src/styles/index.d.ts +0 -16
  69. package/lib/typescript/examples/expo/src/styles/index.d.ts.map +0 -1
  70. package/lib/typescript/examples/expo/src/styles/theme.d.ts +0 -40
  71. package/lib/typescript/examples/expo/src/styles/theme.d.ts.map +0 -1
@@ -1,228 +0,0 @@
1
- #import "UnistylesRuntime.h"
2
-
3
- std::vector<jsi::PropNameID> UnistylesRuntime::getPropertyNames(jsi::Runtime& rt) {
4
- std::vector<jsi::PropNameID> properties;
5
-
6
- // getters
7
- properties.push_back(jsi::PropNameID::forUtf8(rt, std::string("screenWidth")));
8
- properties.push_back(jsi::PropNameID::forUtf8(rt, std::string("screenHeight")));
9
- properties.push_back(jsi::PropNameID::forUtf8(rt, std::string("hasAdaptiveThemes")));
10
- properties.push_back(jsi::PropNameID::forUtf8(rt, std::string("theme")));
11
- properties.push_back(jsi::PropNameID::forUtf8(rt, std::string("breakpoint")));
12
- properties.push_back(jsi::PropNameID::forUtf8(rt, std::string("colorScheme")));
13
- properties.push_back(jsi::PropNameID::forUtf8(rt, std::string("sortedBreakpointPairs")));
14
-
15
- // setters
16
- properties.push_back(jsi::PropNameID::forUtf8(rt, std::string("themes")));
17
- properties.push_back(jsi::PropNameID::forUtf8(rt, std::string("useBreakpoints")));
18
- properties.push_back(jsi::PropNameID::forUtf8(rt, std::string("useTheme")));
19
- properties.push_back(jsi::PropNameID::forUtf8(rt, std::string("useAdaptiveThemes")));
20
-
21
- return properties;
22
- }
23
-
24
-
25
- jsi::Value UnistylesRuntime::get(jsi::Runtime& runtime, const jsi::PropNameID& propNameId) {
26
- std::string propName = propNameId.utf8(runtime);
27
-
28
- if (propName == "screenWidth") {
29
- return jsi::Value(this->screenWidth);
30
- }
31
-
32
- if (propName == "screenHeight") {
33
- return jsi::Value(this->screenHeight);
34
- }
35
-
36
- if (propName == "hasAdaptiveThemes") {
37
- return jsi::Value(this->hasAdaptiveThemes);
38
- }
39
-
40
- if (propName == "theme") {
41
- return !this->theme.empty()
42
- ? jsi::Value(jsi::String::createFromUtf8(runtime, this->theme))
43
- : this->getThemeOrFail(runtime);
44
- }
45
-
46
- if (propName == "breakpoint") {
47
- return !this->breakpoint.empty()
48
- ? jsi::Value(jsi::String::createFromUtf8(runtime, this->breakpoint))
49
- : jsi::Value::undefined();
50
- }
51
-
52
- if (propName == "colorScheme") {
53
- return jsi::Value(jsi::String::createFromUtf8(runtime, this->colorScheme));
54
- }
55
-
56
- if (propName == "sortedBreakpointPairs") {
57
- std::unique_ptr<jsi::Array> sortedBreakpointEntriesArray = std::make_unique<jsi::Array>(runtime, this->sortedBreakpointEntries.size());
58
-
59
- for (size_t i = 0; i < this->sortedBreakpointEntries.size(); ++i) {
60
- std::unique_ptr<jsi::Array> pairArray = std::make_unique<jsi::Array>(runtime, 2);
61
- jsi::String nameValue = jsi::String::createFromUtf8(runtime, this->sortedBreakpointEntries[i].first);
62
-
63
- pairArray->setValueAtIndex(runtime, 0, nameValue);
64
- pairArray->setValueAtIndex(runtime, 1, jsi::Value(this->sortedBreakpointEntries[i].second));
65
- sortedBreakpointEntriesArray->setValueAtIndex(runtime, i, *pairArray);
66
- }
67
-
68
- return jsi::Value(runtime, *sortedBreakpointEntriesArray);
69
- }
70
-
71
- if (propName == "useBreakpoints") {
72
- return jsi::Function::createFromHostFunction(
73
- runtime,
74
- jsi::PropNameID::forAscii(runtime, "useBreakpoints"),
75
- 1,
76
- [this](jsi::Runtime &runtime, const jsi::Value &thisVal, const jsi::Value *arguments, size_t count) -> jsi::Value {
77
- jsi::Object breakpointsObj = arguments[0].asObject(runtime);
78
- jsi::Array propertyNames = breakpointsObj.getPropertyNames(runtime);
79
- std::vector<std::pair<std::string, double>> sortedBreakpointEntriesVec;
80
-
81
- for (size_t i = 0; i < propertyNames.size(runtime); ++i) {
82
- jsi::Value propNameValue = propertyNames.getValueAtIndex(runtime, i);
83
- std::string name = propNameValue.asString(runtime).utf8(runtime);
84
- jsi::PropNameID propNameID = jsi::PropNameID::forUtf8(runtime, name);
85
- jsi::Value value = breakpointsObj.getProperty(runtime, propNameID);
86
-
87
- if (value.isNumber()) {
88
- double breakpointValue = value.asNumber();
89
- sortedBreakpointEntriesVec.push_back(std::make_pair(name, breakpointValue));
90
- }
91
- }
92
-
93
- std::sort(sortedBreakpointEntriesVec.begin(), sortedBreakpointEntriesVec.end(), [](const std::pair<std::string, double>& a, const std::pair<std::string, double>& b) {
94
- return a.second < b.second;
95
- });
96
-
97
- this->sortedBreakpointEntries = sortedBreakpointEntriesVec;
98
-
99
- std::string breakpoint = this->getBreakpointFromScreenWidth(this->screenWidth, sortedBreakpointEntriesVec);
100
-
101
- this->breakpoint = breakpoint;
102
-
103
- return jsi::Value::undefined();
104
- }
105
- );
106
- }
107
-
108
- if (propName == "useTheme") {
109
- return jsi::Function::createFromHostFunction(runtime,
110
- jsi::PropNameID::forAscii(runtime, "useTheme"),
111
- 1,
112
- [this](jsi::Runtime &runtime, const jsi::Value &thisVal, const jsi::Value *arguments, size_t count) -> jsi::Value {
113
- std::string themeName = arguments[0].asString(runtime).utf8(runtime);
114
- NSString *currentTheme = [NSString stringWithUTF8String:themeName.c_str()];
115
-
116
- this->theme = themeName;
117
- this->onThemeChange(themeName);
118
-
119
- return jsi::Value::undefined();
120
- }
121
- );
122
- }
123
-
124
- if (propName == "useAdaptiveThemes") {
125
- return jsi::Function::createFromHostFunction(runtime,
126
- jsi::PropNameID::forAscii(runtime, "useAdaptiveThemes"),
127
- 1,
128
- [this](jsi::Runtime &runtime, const jsi::Value &thisVal, const jsi::Value *arguments, size_t count) -> jsi::Value {
129
- bool enableAdaptiveThemes = arguments[0].asBool();
130
-
131
- this->hasAdaptiveThemes = enableAdaptiveThemes;
132
-
133
- if (!enableAdaptiveThemes || !this->supportsAutomaticColorScheme) {
134
- return jsi::Value::undefined();
135
- }
136
-
137
- this->theme = this->colorScheme;
138
- // this->onThemeChange(this->theme);
139
-
140
- return jsi::Value::undefined();
141
- }
142
- );
143
- }
144
-
145
- return jsi::Value::undefined();
146
- }
147
-
148
- void UnistylesRuntime::set(jsi::Runtime& runtime, const jsi::PropNameID& propNameId, const jsi::Value& value) {
149
- std::string propName = propNameId.utf8(runtime);
150
-
151
- if (propName == "themes" && value.isObject()) {
152
- jsi::Array themes = value.asObject(runtime).asArray(runtime);
153
- std::vector<std::string> themesVector;
154
- size_t length = themes.size(runtime);
155
-
156
- for (size_t i = 0; i < length; ++i) {
157
- jsi::Value element = themes.getValueAtIndex(runtime, i);
158
-
159
- if (element.isString()) {
160
- std::string theme = element.asString(runtime).utf8(runtime);
161
- themesVector.push_back(theme);
162
- }
163
- }
164
-
165
- this->themes = themesVector;
166
-
167
- bool hasLightTheme = std::find(themesVector.begin(), themesVector.end(), "light") != themesVector.end();
168
- bool hasDarkTheme = std::find(themesVector.begin(), themesVector.end(), "dark") != themesVector.end();
169
-
170
- this->supportsAutomaticColorScheme = hasLightTheme && hasDarkTheme;
171
-
172
- return;
173
- }
174
- }
175
-
176
- std::string UnistylesRuntime::getBreakpointFromScreenWidth(double width, const std::vector<std::pair<std::string, double>>& sortedBreakpointEntries) {
177
- for (size_t i = 0; i < sortedBreakpointEntries.size(); ++i) {
178
- const auto& [key, value] = sortedBreakpointEntries[i];
179
- const double maxVal = (i + 1 < sortedBreakpointEntries.size()) ? sortedBreakpointEntries[i + 1].second : std::numeric_limits<double>::infinity();
180
-
181
- if (width >= value && width < maxVal) {
182
- return key;
183
- }
184
- }
185
-
186
- return sortedBreakpointEntries.empty() ? "" : sortedBreakpointEntries.back().first;
187
- }
188
-
189
- void UnistylesRuntime::handleScreenSizeChange(int width, int height) {
190
- if (width != this->screenWidth) {
191
- this->screenWidth = width;
192
- }
193
-
194
- if (height != this->screenHeight) {
195
- this->screenHeight = height;
196
- }
197
-
198
- std::string currentBreakpoint = this->breakpoint;
199
- std::string nextBreakpoint = this->getBreakpointFromScreenWidth(width, this->sortedBreakpointEntries);
200
-
201
- if (currentBreakpoint != nextBreakpoint) {
202
- this->breakpoint = nextBreakpoint;
203
- this->onBreakpointChange(nextBreakpoint);
204
- }
205
- }
206
-
207
- void UnistylesRuntime::handleAppearanceChange(std::string colorScheme) {
208
- this->colorScheme = colorScheme;
209
-
210
- if (!this->supportsAutomaticColorScheme || !this->hasAdaptiveThemes) {
211
- return;
212
- }
213
-
214
- this->theme = this->colorScheme;
215
- this->onThemeChange(this->theme);
216
- }
217
-
218
- jsi::Value UnistylesRuntime::getThemeOrFail(jsi::Runtime& runtime) {
219
- if (this->themes.size() == 1) {
220
- std::string themeName = this->themes.at(0);
221
-
222
- this->theme = themeName;
223
-
224
- return jsi::String::createFromUtf8(runtime, themeName);
225
- }
226
-
227
- return jsi::Value().undefined();
228
- }
@@ -1,3 +0,0 @@
1
- import React from 'react';
2
- export declare const App: React.FunctionComponent;
3
- //# sourceMappingURL=App.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"App.d.ts","sourceRoot":"","sources":["../../../../../examples/expo/src/App.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAgBzB,eAAO,MAAM,GAAG,EAAE,KAAK,CAAC,iBAMvB,CAAA"}
@@ -1,3 +0,0 @@
1
- import React from 'react';
2
- export declare const Cxx: () => React.JSX.Element;
3
- //# sourceMappingURL=Cxx.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Cxx.d.ts","sourceRoot":"","sources":["../../../../../../examples/expo/src/examples/Cxx.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,eAAO,MAAM,GAAG,yBA8Ef,CAAA"}
@@ -1,2 +0,0 @@
1
- export { Cxx } from './Cxx';
2
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../examples/expo/src/examples/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAA"}
@@ -1,2 +0,0 @@
1
- export {};
2
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../examples/expo/src/index.ts"],"names":[],"mappings":""}
@@ -1,8 +0,0 @@
1
- export declare const breakpoints: {
2
- xs: number;
3
- sm: number;
4
- md: number;
5
- lg: number;
6
- xl: number;
7
- };
8
- //# sourceMappingURL=breakpoints.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"breakpoints.d.ts","sourceRoot":"","sources":["../../../../../../examples/expo/src/styles/breakpoints.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,WAAW;;;;;;CAMvB,CAAA"}
@@ -1,16 +0,0 @@
1
- import { breakpoints } from './breakpoints';
2
- import { lightTheme, darkTheme, premiumTheme } from './theme';
3
- type AppBreakpoints = typeof breakpoints;
4
- type AppThemes = {
5
- light: typeof lightTheme;
6
- dark: typeof darkTheme;
7
- premium: typeof premiumTheme;
8
- };
9
- declare module 'react-native-unistyles' {
10
- interface UnistylesThemes extends AppThemes {
11
- }
12
- interface UnistylesBreakpoints extends AppBreakpoints {
13
- }
14
- }
15
- export { lightTheme, darkTheme, premiumTheme, breakpoints };
16
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../examples/expo/src/styles/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAC3C,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAE7D,KAAK,cAAc,GAAG,OAAO,WAAW,CAAA;AACxC,KAAK,SAAS,GAAG;IACb,KAAK,EAAE,OAAO,UAAU,CAAA;IACxB,IAAI,EAAE,OAAO,SAAS,CAAA;IACtB,OAAO,EAAE,OAAO,YAAY,CAAA;CAC/B,CAAA;AAED,OAAO,QAAQ,wBAAwB,CAAC;IACpC,UAAiB,eAAgB,SAAQ,SAAS;KAAG;IAErD,UAAiB,oBAAqB,SAAQ,cAAc;KAAG;CAClE;AAED,OAAO,EACH,UAAU,EACV,SAAS,EACT,YAAY,EACZ,WAAW,EACd,CAAA"}
@@ -1,40 +0,0 @@
1
- export declare const lightTheme: {
2
- colors: {
3
- backgroundColor: string;
4
- typography: string;
5
- accent: string;
6
- barbie: string;
7
- oak: string;
8
- sky: string;
9
- fog: string;
10
- aloes: string;
11
- blood: string;
12
- };
13
- };
14
- export declare const darkTheme: {
15
- colors: {
16
- backgroundColor: string;
17
- typography: string;
18
- accent: string;
19
- barbie: string;
20
- oak: string;
21
- sky: string;
22
- fog: string;
23
- aloes: string;
24
- blood: string;
25
- };
26
- };
27
- export declare const premiumTheme: {
28
- colors: {
29
- backgroundColor: string;
30
- typography: string;
31
- accent: string;
32
- barbie: string;
33
- oak: string;
34
- sky: string;
35
- fog: string;
36
- aloes: string;
37
- blood: string;
38
- };
39
- };
40
- //# sourceMappingURL=theme.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../../../../examples/expo/src/styles/theme.ts"],"names":[],"mappings":"AASA,eAAO,MAAM,UAAU;;;;;;;;;;;;CAQtB,CAAA;AAED,eAAO,MAAM,SAAS;;;;;;;;;;;;CAQrB,CAAA;AAED,eAAO,MAAM,YAAY;;;;;;;;;;;;CAQxB,CAAA"}