react-native-unistyles 2.0.0-alpha.12 → 2.0.0-alpha.14
Sign up to get free protection for your applications and to get access to all the features.
- package/lib/commonjs/core/UnistyleRegistry.js +3 -2
- package/lib/commonjs/core/UnistyleRegistry.js.map +1 -1
- package/lib/commonjs/plugins/withPlugins.js +2 -6
- package/lib/commonjs/plugins/withPlugins.js.map +1 -1
- package/lib/commonjs/useStyles.js +7 -11
- package/lib/commonjs/useStyles.js.map +1 -1
- package/lib/commonjs/utils/index.js +0 -7
- package/lib/commonjs/utils/index.js.map +1 -1
- package/lib/commonjs/utils/styles.js +8 -18
- package/lib/commonjs/utils/styles.js.map +1 -1
- package/lib/commonjs/utils/variants.js +17 -2
- package/lib/commonjs/utils/variants.js.map +1 -1
- package/lib/module/core/UnistyleRegistry.js +4 -3
- package/lib/module/core/UnistyleRegistry.js.map +1 -1
- package/lib/module/plugins/withPlugins.js +2 -6
- package/lib/module/plugins/withPlugins.js.map +1 -1
- package/lib/module/useStyles.js +7 -11
- package/lib/module/useStyles.js.map +1 -1
- package/lib/module/utils/index.js +0 -1
- package/lib/module/utils/index.js.map +1 -1
- package/lib/module/utils/styles.js +9 -19
- package/lib/module/utils/styles.js.map +1 -1
- package/lib/module/utils/variants.js +16 -1
- package/lib/module/utils/variants.js.map +1 -1
- package/lib/typescript/src/core/UnistyleRegistry.d.ts.map +1 -1
- package/lib/typescript/src/plugins/withPlugins.d.ts +3 -2
- package/lib/typescript/src/plugins/withPlugins.d.ts.map +1 -1
- package/lib/typescript/src/useStyles.d.ts.map +1 -1
- package/lib/typescript/src/utils/index.d.ts +0 -1
- package/lib/typescript/src/utils/index.d.ts.map +1 -1
- package/lib/typescript/src/utils/styles.d.ts +4 -4
- package/lib/typescript/src/utils/styles.d.ts.map +1 -1
- package/lib/typescript/src/utils/variants.d.ts +2 -2
- package/lib/typescript/src/utils/variants.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/core/UnistyleRegistry.ts +6 -3
- package/src/plugins/withPlugins.ts +13 -15
- package/src/useStyles.ts +15 -9
- package/src/utils/index.ts +0 -1
- package/src/utils/styles.ts +14 -32
- package/src/utils/variants.ts +26 -2
@@ -5,9 +5,10 @@ Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
});
|
6
6
|
exports.UnistyleRegistry = void 0;
|
7
7
|
var _common = require("../common");
|
8
|
+
var _plugins = require("../plugins");
|
8
9
|
class UnistyleRegistry {
|
9
10
|
config = {};
|
10
|
-
plugins = [];
|
11
|
+
plugins = _common.isWeb ? [_plugins.normalizeWebStylesPlugin] : [];
|
11
12
|
themeNames = [];
|
12
13
|
themes = {};
|
13
14
|
breakpoints = {};
|
@@ -64,7 +65,7 @@ class UnistyleRegistry {
|
|
64
65
|
})) {
|
65
66
|
throw new Error(_common.UnistylesError.DuplicatePluginName);
|
66
67
|
}
|
67
|
-
_this.plugins = _this.plugins
|
68
|
+
_this.plugins = [plugin].concat(_this.plugins);
|
68
69
|
_this.unistylesBridge.addPlugin(plugin.name, notify);
|
69
70
|
};
|
70
71
|
})();
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["_common","require","UnistyleRegistry","config","plugins","themeNames","themes","breakpoints","sortedBreakpointPairs","constructor","unistylesBridge","addThemes","keys","Object","addBreakpoints","useBreakpoints","addConfig","adaptiveThemes","useAdaptiveThemes","experimentalPlugins","forEach","plugin","addPlugin","initialTheme","useTheme","getTheme","forName","length","hasTheme","Error","UnistylesError","ThemeNotFound","_this","notify","arguments","undefined","name","startsWith","InvalidPluginName","some","_ref","DuplicatePluginName","concat","removePlugin","CantRemoveInternalPlugin","filter","_ref2","exports"],"sourceRoot":"../../../src","sources":["core/UnistyleRegistry.ts"],"mappings":";;;;;;AAEA,IAAAA,OAAA,GAAAC,OAAA;AAEO,
|
1
|
+
{"version":3,"names":["_common","require","_plugins","UnistyleRegistry","config","plugins","isWeb","normalizeWebStylesPlugin","themeNames","themes","breakpoints","sortedBreakpointPairs","constructor","unistylesBridge","addThemes","keys","Object","addBreakpoints","useBreakpoints","addConfig","adaptiveThemes","useAdaptiveThemes","experimentalPlugins","forEach","plugin","addPlugin","initialTheme","useTheme","getTheme","forName","length","hasTheme","Error","UnistylesError","ThemeNotFound","_this","notify","arguments","undefined","name","startsWith","InvalidPluginName","some","_ref","DuplicatePluginName","concat","removePlugin","CantRemoveInternalPlugin","filter","_ref2","exports"],"sourceRoot":"../../../src","sources":["core/UnistyleRegistry.ts"],"mappings":"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"}
|
@@ -4,13 +4,9 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
5
5
|
});
|
6
6
|
exports.withPlugins = void 0;
|
7
|
-
|
8
|
-
var _common = require("../common");
|
9
|
-
var _core = require("../core");
|
10
|
-
const UNISTYLES_PLUGINS = _common.isWeb ? [_normalizeWebStylesPlugin.normalizeWebStylesPlugin] : [];
|
11
|
-
const withPlugins = (key, style) => _core.unistyles.registry.plugins.concat(UNISTYLES_PLUGINS).reduce((acc, plugin) => {
|
7
|
+
const withPlugins = (key, style, plugins, runtime) => plugins.reduce((acc, plugin) => {
|
12
8
|
if (plugin.onParsedStyle) {
|
13
|
-
return plugin.onParsedStyle(key, acc,
|
9
|
+
return plugin.onParsedStyle(key, acc, runtime);
|
14
10
|
}
|
15
11
|
return acc;
|
16
12
|
}, style);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["
|
1
|
+
{"version":3,"names":["withPlugins","key","style","plugins","runtime","reduce","acc","plugin","onParsedStyle","exports"],"sourceRoot":"../../../src","sources":["plugins/withPlugins.ts"],"mappings":";;;;;;AAGO,MAAMA,WAAW,GAAGA,CACvBC,GAAW,EACXC,KAAc,EACdC,OAA+B,EAC/BC,OAAyB,KACxBD,OAAO,CAACE,MAAM,CAAC,CAACC,GAAG,EAAEC,MAAM,KAAK;EACjC,IAAIA,MAAM,CAACC,aAAa,EAAE;IACtB,OAAOD,MAAM,CAACC,aAAa,CAACP,GAAG,EAAEK,GAAG,EAAEF,OAAO,CAAC;EAClD;EAEA,OAAOE,GAAG;AACd,CAAC,EAAEJ,KAAK,CAAC;AAAAO,OAAA,CAAAT,WAAA,GAAAA,WAAA"}
|
@@ -8,41 +8,37 @@ var _react = require("react");
|
|
8
8
|
var _reactNative = require("react-native");
|
9
9
|
var _utils = require("./utils");
|
10
10
|
var _hooks = require("./hooks");
|
11
|
+
var _core = require("./core");
|
11
12
|
const useStyles = (stylesheet, variant) => {
|
12
13
|
const {
|
13
14
|
theme,
|
14
15
|
layout,
|
15
16
|
plugins
|
16
17
|
} = (0, _hooks.useUnistyles)();
|
17
|
-
const {
|
18
|
-
screenSize,
|
19
|
-
breakpoint
|
20
|
-
} = layout;
|
21
18
|
if (!stylesheet) {
|
22
19
|
return {
|
23
20
|
theme,
|
24
|
-
breakpoint,
|
21
|
+
breakpoint: layout.breakpoint,
|
25
22
|
styles: {}
|
26
23
|
};
|
27
24
|
}
|
28
|
-
const parsedStyles = (0, _react.useMemo)(() => typeof stylesheet === 'function' ? stylesheet(theme) : stylesheet, [theme, stylesheet]);
|
25
|
+
const parsedStyles = (0, _react.useMemo)(() => typeof stylesheet === 'function' ? stylesheet(theme) : stylesheet, [theme, stylesheet, layout]);
|
29
26
|
const dynamicStyleSheet = (0, _react.useMemo)(() => Object.entries(parsedStyles).reduce((acc, _ref) => {
|
30
27
|
let [key, value] = _ref;
|
31
|
-
const style = value;
|
32
28
|
if (typeof value === 'function') {
|
33
29
|
return {
|
34
30
|
...acc,
|
35
|
-
[key]: (0, _utils.proxifyFunction)(key, value,
|
31
|
+
[key]: (0, _utils.proxifyFunction)(key, value, _core.unistyles.registry.plugins, _core.unistyles.runtime, variant)
|
36
32
|
};
|
37
33
|
}
|
38
34
|
return _reactNative.StyleSheet.create({
|
39
35
|
...acc,
|
40
|
-
[key]: (0, _utils.parseStyle)(key,
|
36
|
+
[key]: (0, _utils.parseStyle)(key, value, _core.unistyles.registry.plugins, _core.unistyles.runtime, variant)
|
41
37
|
});
|
42
|
-
}, {}), [
|
38
|
+
}, {}), [layout, parsedStyles, variant, plugins]);
|
43
39
|
return {
|
44
40
|
theme,
|
45
|
-
breakpoint,
|
41
|
+
breakpoint: layout.breakpoint,
|
46
42
|
styles: dynamicStyleSheet
|
47
43
|
};
|
48
44
|
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["_react","require","_reactNative","_utils","_hooks","useStyles","stylesheet","variant","theme","layout","plugins","useUnistyles","
|
1
|
+
{"version":3,"names":["_react","require","_reactNative","_utils","_hooks","_core","useStyles","stylesheet","variant","theme","layout","plugins","useUnistyles","breakpoint","styles","parsedStyles","useMemo","dynamicStyleSheet","Object","entries","reduce","acc","_ref","key","value","proxifyFunction","unistyles","registry","runtime","StyleSheet","create","parseStyle","exports"],"sourceRoot":"../../src","sources":["useStyles.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,MAAA,GAAAF,OAAA;AAQA,IAAAG,MAAA,GAAAH,OAAA;AAEA,IAAAI,KAAA,GAAAJ,OAAA;AAQO,MAAMK,SAAS,GAAGA,CACrBC,UAAyD,EACzDC,OAAyD,KAClC;EACvB,MAAM;IAAEC,KAAK;IAAEC,MAAM;IAAEC;EAAQ,CAAC,GAAG,IAAAC,mBAAY,EAAC,CAAC;EAEjD,IAAI,CAACL,UAAU,EAAE;IACb,OAAO;MACHE,KAAK;MACLI,UAAU,EAAEH,MAAM,CAACG,UAAU;MAC7BC,MAAM,EAAE,CAAC;IACb,CAAC;EACL;EAEA,MAAMC,YAAY,GAAG,IAAAC,cAAO,EAAC,MAAM,OAAOT,UAAU,KAAK,UAAU,GAC7DA,UAAU,CAACE,KAAK,CAAC,GACjBF,UAAU,EAAE,CAACE,KAAK,EAAEF,UAAU,EAAEG,MAAM,CAAC,CAAC;EAE9C,MAAMO,iBAAiB,GAAG,IAAAD,cAAO,EAAC,MAAME,MAAM,CACzCC,OAAO,CAACJ,YAAY,CAAC,CACrBK,MAAM,CAAC,CAACC,GAAG,EAAAC,IAAA,KAAmB;IAAA,IAAjB,CAACC,GAAG,EAAEC,KAAK,CAAC,GAAAF,IAAA;IACtB,IAAI,OAAOE,KAAK,KAAK,UAAU,EAAE;MAC7B,OAAO;QACH,GAAGH,GAAG;QACN,CAACE,GAAG,GAAG,IAAAE,sBAAe,EAACF,GAAG,EAAEC,KAAK,EAACE,eAAS,CAACC,QAAQ,CAAChB,OAAO,EAAEe,eAAS,CAACE,OAAO,EAAEpB,OAAO;MAC5F,CAAC;IACL;IAEA,OAAOqB,uBAAU,CAACC,MAAM,CAAC;MACrB,GAAGT,GAAG;MACN,CAACE,GAAG,GAAG,IAAAQ,iBAAU,EACbR,GAAG,EACHC,KAAK,EACLE,eAAS,CAACC,QAAQ,CAAChB,OAAO,EAC1Be,eAAS,CAACE,OAAO,EACjBpB,OACJ;IACJ,CAAC,CAAC;EACN,CAAC,EAAE,CAAC,CAAO,CAAC,EAChB,CAACE,MAAM,EAAEK,YAAY,EAAEP,OAAO,EAAEG,OAAO,CACvC,CAA8B;EAE9B,OAAO;IACHF,KAAK;IACLI,UAAU,EAAEH,MAAM,CAACG,UAAU;IAC7BC,MAAM,EAAEG;EACZ,CAAC;AACL,CAAC;AAAAe,OAAA,CAAA1B,SAAA,GAAAA,SAAA"}
|
@@ -15,12 +15,6 @@ Object.defineProperty(exports, "getKeyForUnistylesMediaQuery", {
|
|
15
15
|
return _mqParser.getKeyForUnistylesMediaQuery;
|
16
16
|
}
|
17
17
|
});
|
18
|
-
Object.defineProperty(exports, "getKeyForVariant", {
|
19
|
-
enumerable: true,
|
20
|
-
get: function () {
|
21
|
-
return _variants.getKeyForVariant;
|
22
|
-
}
|
23
|
-
});
|
24
18
|
Object.defineProperty(exports, "getValueForBreakpoint", {
|
25
19
|
enumerable: true,
|
26
20
|
get: function () {
|
@@ -64,7 +58,6 @@ Object.defineProperty(exports, "proxifyFunction", {
|
|
64
58
|
}
|
65
59
|
});
|
66
60
|
var _mq = require("./mq");
|
67
|
-
var _variants = require("./variants");
|
68
61
|
var _mqParser = require("./mqParser");
|
69
62
|
var _breakpoints = require("./breakpoints");
|
70
63
|
var _styles = require("./styles");
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["_mq","require","
|
1
|
+
{"version":3,"names":["_mq","require","_mqParser","_breakpoints","_styles"],"sourceRoot":"../../../src","sources":["utils/index.ts"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,GAAA,GAAAC,OAAA;AACA,IAAAC,SAAA,GAAAD,OAAA;AACA,IAAAE,YAAA,GAAAF,OAAA;AACA,IAAAG,OAAA,GAAAH,OAAA"}
|
@@ -8,8 +8,8 @@ var _breakpoints = require("./breakpoints");
|
|
8
8
|
var _common = require("../common");
|
9
9
|
var _variants = require("./variants");
|
10
10
|
var _plugins = require("../plugins");
|
11
|
-
const proxifyFunction = (key, fn,
|
12
|
-
apply: (target, thisArg, argumentsList) => parseStyle(key, target.apply(thisArg, argumentsList),
|
11
|
+
const proxifyFunction = (key, fn, plugins, runtime, variant) => new Proxy(fn, {
|
12
|
+
apply: (target, thisArg, argumentsList) => parseStyle(key, target.apply(thisArg, argumentsList), plugins, runtime, variant)
|
13
13
|
});
|
14
14
|
exports.proxifyFunction = proxifyFunction;
|
15
15
|
const isPlatformColor = value => {
|
@@ -19,27 +19,17 @@ const isPlatformColor = value => {
|
|
19
19
|
return _common.isAndroid && 'resource_paths' in value && typeof value.resource_paths === 'object';
|
20
20
|
};
|
21
21
|
exports.isPlatformColor = isPlatformColor;
|
22
|
-
const parseStyle = (key, style,
|
23
|
-
const entries = Object.entries(style || {})
|
22
|
+
const parseStyle = (key, style, plugins, runtime, variant) => {
|
23
|
+
const entries = Object.entries((0, _variants.getStyleWithVariant)(style || {}, variant));
|
24
|
+
const parsedStyles = Object.fromEntries(entries.map(_ref => {
|
24
25
|
let [key, value] = _ref;
|
25
|
-
if (key !== 'variants') {
|
26
|
-
return [key, value];
|
27
|
-
}
|
28
|
-
const variantKey = (0, _variants.getKeyForVariant)(value, variant);
|
29
|
-
if (!variantKey) {
|
30
|
-
return undefined;
|
31
|
-
}
|
32
|
-
return Object.entries(value[variantKey]).flat();
|
33
|
-
}).filter(Boolean);
|
34
|
-
const parsedStyles = Object.fromEntries(entries.map(_ref2 => {
|
35
|
-
let [key, value] = _ref2;
|
36
26
|
const hasNestedProperties = key === 'shadowOffset' || key === 'textShadowOffset';
|
37
27
|
if (hasNestedProperties) {
|
38
|
-
return [key, parseStyle(key, value,
|
28
|
+
return [key, parseStyle(key, value, plugins, runtime, variant)];
|
39
29
|
}
|
40
30
|
const isTransform = key === 'transform';
|
41
31
|
if (isTransform && Array.isArray(value)) {
|
42
|
-
return [key, value.map(value => parseStyle(key, value,
|
32
|
+
return [key, value.map(value => parseStyle(key, value, plugins, runtime, variant))];
|
43
33
|
}
|
44
34
|
const isDynamicFunction = typeof value === 'function';
|
45
35
|
const isValidStyle = typeof value !== 'object' || isPlatformColor(value);
|
@@ -48,7 +38,7 @@ const parseStyle = (key, style, breakpoint, screenSize, variant) => {
|
|
48
38
|
}
|
49
39
|
return [key, (0, _breakpoints.getValueForBreakpoint)(value)];
|
50
40
|
}));
|
51
|
-
return (0, _plugins.withPlugins)(key, parsedStyles);
|
41
|
+
return (0, _plugins.withPlugins)(key, parsedStyles, plugins, runtime);
|
52
42
|
};
|
53
43
|
exports.parseStyle = parseStyle;
|
54
44
|
//# sourceMappingURL=styles.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["_breakpoints","require","_common","_variants","_plugins","proxifyFunction","key","fn","
|
1
|
+
{"version":3,"names":["_breakpoints","require","_common","_variants","_plugins","proxifyFunction","key","fn","plugins","runtime","variant","Proxy","apply","target","thisArg","argumentsList","parseStyle","exports","isPlatformColor","value","isIOS","semantic","isAndroid","resource_paths","style","entries","Object","getStyleWithVariant","parsedStyles","fromEntries","map","_ref","hasNestedProperties","isTransform","Array","isArray","isDynamicFunction","isValidStyle","getValueForBreakpoint","withPlugins"],"sourceRoot":"../../../src","sources":["utils/styles.ts"],"mappings":";;;;;;AACA,IAAAA,YAAA,GAAAC,OAAA;AAEA,IAAAC,OAAA,GAAAD,OAAA;AACA,IAAAE,SAAA,GAAAF,OAAA;AACA,IAAAG,QAAA,GAAAH,OAAA;AAEO,MAAMI,eAAe,GAAGA,CAC3BC,GAAW,EACXC,EAAY,EACZC,OAA+B,EAC/BC,OAAyB,EACzBC,OAAgB,KACL,IAAIC,KAAK,CAACJ,EAAE,EAAE;EACzBK,KAAK,EAAEA,CAACC,MAAM,EAAEC,OAAO,EAAEC,aAAa,KAClCC,UAAU,CAACV,GAAG,EAAEO,MAAM,CAACD,KAAK,CAACE,OAAO,EAAEC,aAAa,CAAC,EAAEP,OAAO,EAAEC,OAAO,EAAEC,OAAO;AACvF,CAAC,CAAC;AAAAO,OAAA,CAAAZ,eAAA,GAAAA,eAAA;AAEK,MAAMa,eAAe,GAAkBC,KAAQ,IAAc;EAChE,IAAIC,aAAK,EAAE;IACP,OAAO,UAAU,IAAID,KAAK,IAAI,OAAOA,KAAK,CAACE,QAAQ,KAAK,QAAQ;EACpE;EAEA,OAAOC,iBAAS,IAAI,gBAAgB,IAAIH,KAAK,IAAI,OAAOA,KAAK,CAACI,cAAc,KAAK,QAAQ;AAC7F,CAAC;AAAAN,OAAA,CAAAC,eAAA,GAAAA,eAAA;AAEM,MAAMF,UAAU,GAAGA,CACtBV,GAAW,EACXkB,KAA2B,EAC3BhB,OAA+B,EAC/BC,OAAyB,EACzBC,OAAgB,KACZ;EACJ,MAAMe,OAAO,GAAGC,MAAM,CACjBD,OAAO,CAAC,IAAAE,6BAAmB,EAACH,KAAK,IAAI,CAAC,CAAC,EAAEd,OAAO,CAAC,CAAyD;EAE/G,MAAMkB,YAAY,GAAGF,MAAM,CACtBG,WAAW,CAACJ,OAAO,CACfK,GAAG,CAACC,IAAA,IAAkB;IAAA,IAAjB,CAACzB,GAAG,EAAEa,KAAK,CAAC,GAAAY,IAAA;IACd,MAAMC,mBAAmB,GAAG1B,GAAG,KAAK,cAAc,IAAIA,GAAG,KAAK,kBAAkB;IAEhF,IAAI0B,mBAAmB,EAAE;MACrB,OAAO,CACH1B,GAAG,EACHU,UAAU,CAACV,GAAG,EAAEa,KAAK,EAA0BX,OAAO,EAAEC,OAAO,EAAEC,OAAO,CAAC,CAC5E;IACL;IAEA,MAAMuB,WAAW,GAAG3B,GAAG,KAAK,WAAW;IAEvC,IAAI2B,WAAW,IAAIC,KAAK,CAACC,OAAO,CAAChB,KAAK,CAAC,EAAE;MACrC,OAAO,CACHb,GAAG,EACHa,KAAK,CAACW,GAAG,CAACX,KAAK,IAAIH,UAAU,CAACV,GAAG,EAAEa,KAAK,EAAEX,OAAO,EAAEC,OAAO,EAAEC,OAAO,CAAC,CAAC,CACxE;IACL;IAEA,MAAM0B,iBAAiB,GAAG,OAAOjB,KAAK,KAAK,UAAU;IACrD,MAAMkB,YAAY,GAAG,OAAOlB,KAAK,KAAK,QAAQ,IAAID,eAAe,CAACC,KAAK,CAAC;IAExE,IAAIiB,iBAAiB,IAAIC,YAAY,EAAE;MACnC,OAAO,CAAC/B,GAAG,EAAEa,KAAK,CAAC;IACvB;IAEA,OAAO,CACHb,GAAG,EACH,IAAAgC,kCAAqB,EAACnB,KAAoB,CAAC,CAC9C;EACL,CAAC,CACL,CAAM;EAEV,OAAO,IAAAoB,oBAAW,EAACjC,GAAG,EAAEsB,YAAY,EAAEpB,OAAO,EAAEC,OAAO,CAAC;AAC3D,CAAC;AAAAQ,OAAA,CAAAD,UAAA,GAAAA,UAAA"}
|
@@ -3,7 +3,7 @@
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
4
4
|
value: true
|
5
5
|
});
|
6
|
-
exports.
|
6
|
+
exports.getStyleWithVariant = void 0;
|
7
7
|
const getKeyForVariant = (value, variant) => {
|
8
8
|
if (variant && variant in value) {
|
9
9
|
return variant;
|
@@ -13,5 +13,20 @@ const getKeyForVariant = (value, variant) => {
|
|
13
13
|
}
|
14
14
|
return undefined;
|
15
15
|
};
|
16
|
-
|
16
|
+
const getStyleWithVariant = (style, variant) => {
|
17
|
+
if (!('variants' in style)) {
|
18
|
+
return style;
|
19
|
+
}
|
20
|
+
const variantKey = getKeyForVariant(style.variants, variant);
|
21
|
+
const variantValue = variantKey ? style.variants[variantKey] : {};
|
22
|
+
const {
|
23
|
+
variants,
|
24
|
+
...otherStyles
|
25
|
+
} = style;
|
26
|
+
return {
|
27
|
+
...otherStyles,
|
28
|
+
...variantValue
|
29
|
+
};
|
30
|
+
};
|
31
|
+
exports.getStyleWithVariant = getStyleWithVariant;
|
17
32
|
//# sourceMappingURL=variants.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["getKeyForVariant","value","variant","undefined","exports"],"sourceRoot":"../../../src","sources":["utils/variants.ts"],"mappings":";;;;;;
|
1
|
+
{"version":3,"names":["getKeyForVariant","value","variant","undefined","getStyleWithVariant","style","variantKey","variants","variantValue","otherStyles","exports"],"sourceRoot":"../../../src","sources":["utils/variants.ts"],"mappings":";;;;;;AAEA,MAAMA,gBAAgB,GAAGA,CAACC,KAAkC,EAAEC,OAAgB,KAAuB;EACjG,IAAIA,OAAO,IAAIA,OAAO,IAAID,KAAK,EAAE;IAC7B,OAAOC,OAAO;EAClB;EAEA,IAAI,SAAS,IAAID,KAAK,EAAE;IACpB,OAAO,SAAS;EACpB;EAEA,OAAOE,SAAS;AACpB,CAAC;AAEM,MAAMC,mBAAmB,GAAGA,CAC/BC,KAA2B,EAC3BH,OAAgB,KACf;EACD,IAAI,EAAE,UAAU,IAAIG,KAAK,CAAC,EAAE;IACxB,OAAOA,KAAK;EAChB;EAEA,MAAMC,UAAU,GAAGN,gBAAgB,CAC/BK,KAAK,CAACE,QAAQ,EACdL,OACJ,CAAC;EACD,MAAMM,YAAY,GAAGF,UAAU,GACxBD,KAAK,CAACE,QAAQ,CAAiCD,UAAU,CAAC,GAC3D,CAAC,CAAC;EAER,MAAM;IAAEC,QAAQ;IAAE,GAAGE;EAAY,CAAC,GAAGJ,KAAK;EAE1C,OAAO;IACH,GAAGI,WAAW;IACd,GAAGD;EACP,CAAC;AACL,CAAC;AAAAE,OAAA,CAAAN,mBAAA,GAAAA,mBAAA"}
|
@@ -1,7 +1,8 @@
|
|
1
|
-
import { UnistylesError } from '../common';
|
1
|
+
import { isWeb, UnistylesError } from '../common';
|
2
|
+
import { normalizeWebStylesPlugin } from '../plugins';
|
2
3
|
export class UnistyleRegistry {
|
3
4
|
config = {};
|
4
|
-
plugins = [];
|
5
|
+
plugins = isWeb ? [normalizeWebStylesPlugin] : [];
|
5
6
|
themeNames = [];
|
6
7
|
themes = {};
|
7
8
|
breakpoints = {};
|
@@ -58,7 +59,7 @@ export class UnistyleRegistry {
|
|
58
59
|
})) {
|
59
60
|
throw new Error(UnistylesError.DuplicatePluginName);
|
60
61
|
}
|
61
|
-
_this.plugins = _this.plugins
|
62
|
+
_this.plugins = [plugin].concat(_this.plugins);
|
62
63
|
_this.unistylesBridge.addPlugin(plugin.name, notify);
|
63
64
|
};
|
64
65
|
})();
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["UnistylesError","UnistyleRegistry","config","plugins","themeNames","themes","breakpoints","sortedBreakpointPairs","constructor","unistylesBridge","addThemes","keys","Object","addBreakpoints","useBreakpoints","addConfig","adaptiveThemes","useAdaptiveThemes","experimentalPlugins","forEach","plugin","addPlugin","initialTheme","useTheme","getTheme","forName","length","hasTheme","Error","ThemeNotFound","_this","notify","arguments","undefined","name","startsWith","InvalidPluginName","some","_ref","DuplicatePluginName","concat","removePlugin","CantRemoveInternalPlugin","filter","_ref2"],"sourceRoot":"../../../src","sources":["core/UnistyleRegistry.ts"],"mappings":"AAEA,SAASA,cAAc,QAAQ,WAAW;
|
1
|
+
{"version":3,"names":["isWeb","UnistylesError","normalizeWebStylesPlugin","UnistyleRegistry","config","plugins","themeNames","themes","breakpoints","sortedBreakpointPairs","constructor","unistylesBridge","addThemes","keys","Object","addBreakpoints","useBreakpoints","addConfig","adaptiveThemes","useAdaptiveThemes","experimentalPlugins","forEach","plugin","addPlugin","initialTheme","useTheme","getTheme","forName","length","hasTheme","Error","ThemeNotFound","_this","notify","arguments","undefined","name","startsWith","InvalidPluginName","some","_ref","DuplicatePluginName","concat","removePlugin","CantRemoveInternalPlugin","filter","_ref2"],"sourceRoot":"../../../src","sources":["core/UnistyleRegistry.ts"],"mappings":"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"}
|
@@ -1,10 +1,6 @@
|
|
1
|
-
|
2
|
-
import { isWeb } from '../common';
|
3
|
-
import { unistyles } from '../core';
|
4
|
-
const UNISTYLES_PLUGINS = isWeb ? [normalizeWebStylesPlugin] : [];
|
5
|
-
export const withPlugins = (key, style) => unistyles.registry.plugins.concat(UNISTYLES_PLUGINS).reduce((acc, plugin) => {
|
1
|
+
export const withPlugins = (key, style, plugins, runtime) => plugins.reduce((acc, plugin) => {
|
6
2
|
if (plugin.onParsedStyle) {
|
7
|
-
return plugin.onParsedStyle(key, acc,
|
3
|
+
return plugin.onParsedStyle(key, acc, runtime);
|
8
4
|
}
|
9
5
|
return acc;
|
10
6
|
}, style);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["
|
1
|
+
{"version":3,"names":["withPlugins","key","style","plugins","runtime","reduce","acc","plugin","onParsedStyle"],"sourceRoot":"../../../src","sources":["plugins/withPlugins.ts"],"mappings":"AAGA,OAAO,MAAMA,WAAW,GAAGA,CACvBC,GAAW,EACXC,KAAc,EACdC,OAA+B,EAC/BC,OAAyB,KACxBD,OAAO,CAACE,MAAM,CAAC,CAACC,GAAG,EAAEC,MAAM,KAAK;EACjC,IAAIA,MAAM,CAACC,aAAa,EAAE;IACtB,OAAOD,MAAM,CAACC,aAAa,CAACP,GAAG,EAAEK,GAAG,EAAEF,OAAO,CAAC;EAClD;EAEA,OAAOE,GAAG;AACd,CAAC,EAAEJ,KAAK,CAAC"}
|
package/lib/module/useStyles.js
CHANGED
@@ -2,41 +2,37 @@ import { useMemo } from 'react';
|
|
2
2
|
import { StyleSheet } from 'react-native';
|
3
3
|
import { parseStyle, proxifyFunction } from './utils';
|
4
4
|
import { useUnistyles } from './hooks';
|
5
|
+
import { unistyles } from './core';
|
5
6
|
export const useStyles = (stylesheet, variant) => {
|
6
7
|
const {
|
7
8
|
theme,
|
8
9
|
layout,
|
9
10
|
plugins
|
10
11
|
} = useUnistyles();
|
11
|
-
const {
|
12
|
-
screenSize,
|
13
|
-
breakpoint
|
14
|
-
} = layout;
|
15
12
|
if (!stylesheet) {
|
16
13
|
return {
|
17
14
|
theme,
|
18
|
-
breakpoint,
|
15
|
+
breakpoint: layout.breakpoint,
|
19
16
|
styles: {}
|
20
17
|
};
|
21
18
|
}
|
22
|
-
const parsedStyles = useMemo(() => typeof stylesheet === 'function' ? stylesheet(theme) : stylesheet, [theme, stylesheet]);
|
19
|
+
const parsedStyles = useMemo(() => typeof stylesheet === 'function' ? stylesheet(theme) : stylesheet, [theme, stylesheet, layout]);
|
23
20
|
const dynamicStyleSheet = useMemo(() => Object.entries(parsedStyles).reduce((acc, _ref) => {
|
24
21
|
let [key, value] = _ref;
|
25
|
-
const style = value;
|
26
22
|
if (typeof value === 'function') {
|
27
23
|
return {
|
28
24
|
...acc,
|
29
|
-
[key]: proxifyFunction(key, value,
|
25
|
+
[key]: proxifyFunction(key, value, unistyles.registry.plugins, unistyles.runtime, variant)
|
30
26
|
};
|
31
27
|
}
|
32
28
|
return StyleSheet.create({
|
33
29
|
...acc,
|
34
|
-
[key]: parseStyle(key,
|
30
|
+
[key]: parseStyle(key, value, unistyles.registry.plugins, unistyles.runtime, variant)
|
35
31
|
});
|
36
|
-
}, {}), [
|
32
|
+
}, {}), [layout, parsedStyles, variant, plugins]);
|
37
33
|
return {
|
38
34
|
theme,
|
39
|
-
breakpoint,
|
35
|
+
breakpoint: layout.breakpoint,
|
40
36
|
styles: dynamicStyleSheet
|
41
37
|
};
|
42
38
|
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["useMemo","StyleSheet","parseStyle","proxifyFunction","useUnistyles","useStyles","stylesheet","variant","theme","layout","plugins","
|
1
|
+
{"version":3,"names":["useMemo","StyleSheet","parseStyle","proxifyFunction","useUnistyles","unistyles","useStyles","stylesheet","variant","theme","layout","plugins","breakpoint","styles","parsedStyles","dynamicStyleSheet","Object","entries","reduce","acc","_ref","key","value","registry","runtime","create"],"sourceRoot":"../../src","sources":["useStyles.ts"],"mappings":"AAAA,SAASA,OAAO,QAAQ,OAAO;AAC/B,SAASC,UAAU,QAAQ,cAAc;AACzC,SAASC,UAAU,EAAEC,eAAe,QAAQ,SAAS;AAQrD,SAASC,YAAY,QAAQ,SAAS;AAEtC,SAASC,SAAS,QAAQ,QAAQ;AAQlC,OAAO,MAAMC,SAAS,GAAGA,CACrBC,UAAyD,EACzDC,OAAyD,KAClC;EACvB,MAAM;IAAEC,KAAK;IAAEC,MAAM;IAAEC;EAAQ,CAAC,GAAGP,YAAY,CAAC,CAAC;EAEjD,IAAI,CAACG,UAAU,EAAE;IACb,OAAO;MACHE,KAAK;MACLG,UAAU,EAAEF,MAAM,CAACE,UAAU;MAC7BC,MAAM,EAAE,CAAC;IACb,CAAC;EACL;EAEA,MAAMC,YAAY,GAAGd,OAAO,CAAC,MAAM,OAAOO,UAAU,KAAK,UAAU,GAC7DA,UAAU,CAACE,KAAK,CAAC,GACjBF,UAAU,EAAE,CAACE,KAAK,EAAEF,UAAU,EAAEG,MAAM,CAAC,CAAC;EAE9C,MAAMK,iBAAiB,GAAGf,OAAO,CAAC,MAAMgB,MAAM,CACzCC,OAAO,CAACH,YAAY,CAAC,CACrBI,MAAM,CAAC,CAACC,GAAG,EAAAC,IAAA,KAAmB;IAAA,IAAjB,CAACC,GAAG,EAAEC,KAAK,CAAC,GAAAF,IAAA;IACtB,IAAI,OAAOE,KAAK,KAAK,UAAU,EAAE;MAC7B,OAAO;QACH,GAAGH,GAAG;QACN,CAACE,GAAG,GAAGlB,eAAe,CAACkB,GAAG,EAAEC,KAAK,EAACjB,SAAS,CAACkB,QAAQ,CAACZ,OAAO,EAAEN,SAAS,CAACmB,OAAO,EAAEhB,OAAO;MAC5F,CAAC;IACL;IAEA,OAAOP,UAAU,CAACwB,MAAM,CAAC;MACrB,GAAGN,GAAG;MACN,CAACE,GAAG,GAAGnB,UAAU,CACbmB,GAAG,EACHC,KAAK,EACLjB,SAAS,CAACkB,QAAQ,CAACZ,OAAO,EAC1BN,SAAS,CAACmB,OAAO,EACjBhB,OACJ;IACJ,CAAC,CAAC;EACN,CAAC,EAAE,CAAC,CAAO,CAAC,EAChB,CAACE,MAAM,EAAEI,YAAY,EAAEN,OAAO,EAAEG,OAAO,CACvC,CAA8B;EAE9B,OAAO;IACHF,KAAK;IACLG,UAAU,EAAEF,MAAM,CAACE,UAAU;IAC7BC,MAAM,EAAEE;EACZ,CAAC;AACL,CAAC"}
|
@@ -1,5 +1,4 @@
|
|
1
1
|
export { mq, MQSymbol } from './mq';
|
2
|
-
export { getKeyForVariant } from './variants';
|
3
2
|
export { getKeyForUnistylesMediaQuery, isWithinTheWidthAndHeight, isValidMq, parseMq } from './mqParser';
|
4
3
|
export { getValueForBreakpoint } from './breakpoints';
|
5
4
|
export { proxifyFunction, parseStyle } from './styles';
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["mq","MQSymbol","
|
1
|
+
{"version":3,"names":["mq","MQSymbol","getKeyForUnistylesMediaQuery","isWithinTheWidthAndHeight","isValidMq","parseMq","getValueForBreakpoint","proxifyFunction","parseStyle"],"sourceRoot":"../../../src","sources":["utils/index.ts"],"mappings":"AAAA,SAASA,EAAE,EAAEC,QAAQ,QAAQ,MAAM;AACnC,SAASC,4BAA4B,EAAEC,yBAAyB,EAAEC,SAAS,EAAEC,OAAO,QAAQ,YAAY;AACxG,SAASC,qBAAqB,QAAQ,eAAe;AACrD,SAASC,eAAe,EAAEC,UAAU,QAAQ,UAAU"}
|
@@ -1,9 +1,9 @@
|
|
1
1
|
import { getValueForBreakpoint } from './breakpoints';
|
2
2
|
import { isAndroid, isIOS } from '../common';
|
3
|
-
import {
|
3
|
+
import { getStyleWithVariant } from './variants';
|
4
4
|
import { withPlugins } from '../plugins';
|
5
|
-
export const proxifyFunction = (key, fn,
|
6
|
-
apply: (target, thisArg, argumentsList) => parseStyle(key, target.apply(thisArg, argumentsList),
|
5
|
+
export const proxifyFunction = (key, fn, plugins, runtime, variant) => new Proxy(fn, {
|
6
|
+
apply: (target, thisArg, argumentsList) => parseStyle(key, target.apply(thisArg, argumentsList), plugins, runtime, variant)
|
7
7
|
});
|
8
8
|
export const isPlatformColor = value => {
|
9
9
|
if (isIOS) {
|
@@ -11,27 +11,17 @@ export const isPlatformColor = value => {
|
|
11
11
|
}
|
12
12
|
return isAndroid && 'resource_paths' in value && typeof value.resource_paths === 'object';
|
13
13
|
};
|
14
|
-
export const parseStyle = (key, style,
|
15
|
-
const entries = Object.entries(style || {})
|
14
|
+
export const parseStyle = (key, style, plugins, runtime, variant) => {
|
15
|
+
const entries = Object.entries(getStyleWithVariant(style || {}, variant));
|
16
|
+
const parsedStyles = Object.fromEntries(entries.map(_ref => {
|
16
17
|
let [key, value] = _ref;
|
17
|
-
if (key !== 'variants') {
|
18
|
-
return [key, value];
|
19
|
-
}
|
20
|
-
const variantKey = getKeyForVariant(value, variant);
|
21
|
-
if (!variantKey) {
|
22
|
-
return undefined;
|
23
|
-
}
|
24
|
-
return Object.entries(value[variantKey]).flat();
|
25
|
-
}).filter(Boolean);
|
26
|
-
const parsedStyles = Object.fromEntries(entries.map(_ref2 => {
|
27
|
-
let [key, value] = _ref2;
|
28
18
|
const hasNestedProperties = key === 'shadowOffset' || key === 'textShadowOffset';
|
29
19
|
if (hasNestedProperties) {
|
30
|
-
return [key, parseStyle(key, value,
|
20
|
+
return [key, parseStyle(key, value, plugins, runtime, variant)];
|
31
21
|
}
|
32
22
|
const isTransform = key === 'transform';
|
33
23
|
if (isTransform && Array.isArray(value)) {
|
34
|
-
return [key, value.map(value => parseStyle(key, value,
|
24
|
+
return [key, value.map(value => parseStyle(key, value, plugins, runtime, variant))];
|
35
25
|
}
|
36
26
|
const isDynamicFunction = typeof value === 'function';
|
37
27
|
const isValidStyle = typeof value !== 'object' || isPlatformColor(value);
|
@@ -40,6 +30,6 @@ export const parseStyle = (key, style, breakpoint, screenSize, variant) => {
|
|
40
30
|
}
|
41
31
|
return [key, getValueForBreakpoint(value)];
|
42
32
|
}));
|
43
|
-
return withPlugins(key, parsedStyles);
|
33
|
+
return withPlugins(key, parsedStyles, plugins, runtime);
|
44
34
|
};
|
45
35
|
//# sourceMappingURL=styles.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["getValueForBreakpoint","isAndroid","isIOS","
|
1
|
+
{"version":3,"names":["getValueForBreakpoint","isAndroid","isIOS","getStyleWithVariant","withPlugins","proxifyFunction","key","fn","plugins","runtime","variant","Proxy","apply","target","thisArg","argumentsList","parseStyle","isPlatformColor","value","semantic","resource_paths","style","entries","Object","parsedStyles","fromEntries","map","_ref","hasNestedProperties","isTransform","Array","isArray","isDynamicFunction","isValidStyle"],"sourceRoot":"../../../src","sources":["utils/styles.ts"],"mappings":"AACA,SAASA,qBAAqB,QAAQ,eAAe;AAErD,SAASC,SAAS,EAAEC,KAAK,QAAQ,WAAW;AAC5C,SAASC,mBAAmB,QAAQ,YAAY;AAChD,SAASC,WAAW,QAAQ,YAAY;AAExC,OAAO,MAAMC,eAAe,GAAGA,CAC3BC,GAAW,EACXC,EAAY,EACZC,OAA+B,EAC/BC,OAAyB,EACzBC,OAAgB,KACL,IAAIC,KAAK,CAACJ,EAAE,EAAE;EACzBK,KAAK,EAAEA,CAACC,MAAM,EAAEC,OAAO,EAAEC,aAAa,KAClCC,UAAU,CAACV,GAAG,EAAEO,MAAM,CAACD,KAAK,CAACE,OAAO,EAAEC,aAAa,CAAC,EAAEP,OAAO,EAAEC,OAAO,EAAEC,OAAO;AACvF,CAAC,CAAC;AAEF,OAAO,MAAMO,eAAe,GAAkBC,KAAQ,IAAc;EAChE,IAAIhB,KAAK,EAAE;IACP,OAAO,UAAU,IAAIgB,KAAK,IAAI,OAAOA,KAAK,CAACC,QAAQ,KAAK,QAAQ;EACpE;EAEA,OAAOlB,SAAS,IAAI,gBAAgB,IAAIiB,KAAK,IAAI,OAAOA,KAAK,CAACE,cAAc,KAAK,QAAQ;AAC7F,CAAC;AAED,OAAO,MAAMJ,UAAU,GAAGA,CACtBV,GAAW,EACXe,KAA2B,EAC3Bb,OAA+B,EAC/BC,OAAyB,EACzBC,OAAgB,KACZ;EACJ,MAAMY,OAAO,GAAGC,MAAM,CACjBD,OAAO,CAACnB,mBAAmB,CAACkB,KAAK,IAAI,CAAC,CAAC,EAAEX,OAAO,CAAC,CAAyD;EAE/G,MAAMc,YAAY,GAAGD,MAAM,CACtBE,WAAW,CAACH,OAAO,CACfI,GAAG,CAACC,IAAA,IAAkB;IAAA,IAAjB,CAACrB,GAAG,EAAEY,KAAK,CAAC,GAAAS,IAAA;IACd,MAAMC,mBAAmB,GAAGtB,GAAG,KAAK,cAAc,IAAIA,GAAG,KAAK,kBAAkB;IAEhF,IAAIsB,mBAAmB,EAAE;MACrB,OAAO,CACHtB,GAAG,EACHU,UAAU,CAACV,GAAG,EAAEY,KAAK,EAA0BV,OAAO,EAAEC,OAAO,EAAEC,OAAO,CAAC,CAC5E;IACL;IAEA,MAAMmB,WAAW,GAAGvB,GAAG,KAAK,WAAW;IAEvC,IAAIuB,WAAW,IAAIC,KAAK,CAACC,OAAO,CAACb,KAAK,CAAC,EAAE;MACrC,OAAO,CACHZ,GAAG,EACHY,KAAK,CAACQ,GAAG,CAACR,KAAK,IAAIF,UAAU,CAACV,GAAG,EAAEY,KAAK,EAAEV,OAAO,EAAEC,OAAO,EAAEC,OAAO,CAAC,CAAC,CACxE;IACL;IAEA,MAAMsB,iBAAiB,GAAG,OAAOd,KAAK,KAAK,UAAU;IACrD,MAAMe,YAAY,GAAG,OAAOf,KAAK,KAAK,QAAQ,IAAID,eAAe,CAACC,KAAK,CAAC;IAExE,IAAIc,iBAAiB,IAAIC,YAAY,EAAE;MACnC,OAAO,CAAC3B,GAAG,EAAEY,KAAK,CAAC;IACvB;IAEA,OAAO,CACHZ,GAAG,EACHN,qBAAqB,CAACkB,KAAoB,CAAC,CAC9C;EACL,CAAC,CACL,CAAM;EAEV,OAAOd,WAAW,CAACE,GAAG,EAAEkB,YAAY,EAAEhB,OAAO,EAAEC,OAAO,CAAC;AAC3D,CAAC"}
|
@@ -1,4 +1,4 @@
|
|
1
|
-
|
1
|
+
const getKeyForVariant = (value, variant) => {
|
2
2
|
if (variant && variant in value) {
|
3
3
|
return variant;
|
4
4
|
}
|
@@ -7,4 +7,19 @@ export const getKeyForVariant = (value, variant) => {
|
|
7
7
|
}
|
8
8
|
return undefined;
|
9
9
|
};
|
10
|
+
export const getStyleWithVariant = (style, variant) => {
|
11
|
+
if (!('variants' in style)) {
|
12
|
+
return style;
|
13
|
+
}
|
14
|
+
const variantKey = getKeyForVariant(style.variants, variant);
|
15
|
+
const variantValue = variantKey ? style.variants[variantKey] : {};
|
16
|
+
const {
|
17
|
+
variants,
|
18
|
+
...otherStyles
|
19
|
+
} = style;
|
20
|
+
return {
|
21
|
+
...otherStyles,
|
22
|
+
...variantValue
|
23
|
+
};
|
24
|
+
};
|
10
25
|
//# sourceMappingURL=variants.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["getKeyForVariant","value","variant","undefined"],"sourceRoot":"../../../src","sources":["utils/variants.ts"],"mappings":"AAEA,
|
1
|
+
{"version":3,"names":["getKeyForVariant","value","variant","undefined","getStyleWithVariant","style","variantKey","variants","variantValue","otherStyles"],"sourceRoot":"../../../src","sources":["utils/variants.ts"],"mappings":"AAEA,MAAMA,gBAAgB,GAAGA,CAACC,KAAkC,EAAEC,OAAgB,KAAuB;EACjG,IAAIA,OAAO,IAAIA,OAAO,IAAID,KAAK,EAAE;IAC7B,OAAOC,OAAO;EAClB;EAEA,IAAI,SAAS,IAAID,KAAK,EAAE;IACpB,OAAO,SAAS;EACpB;EAEA,OAAOE,SAAS;AACpB,CAAC;AAED,OAAO,MAAMC,mBAAmB,GAAGA,CAC/BC,KAA2B,EAC3BH,OAAgB,KACf;EACD,IAAI,EAAE,UAAU,IAAIG,KAAK,CAAC,EAAE;IACxB,OAAOA,KAAK;EAChB;EAEA,MAAMC,UAAU,GAAGN,gBAAgB,CAC/BK,KAAK,CAACE,QAAQ,EACdL,OACJ,CAAC;EACD,MAAMM,YAAY,GAAGF,UAAU,GACxBD,KAAK,CAACE,QAAQ,CAAiCD,UAAU,CAAC,GAC3D,CAAC,CAAC;EAER,MAAM;IAAEC,QAAQ;IAAE,GAAGE;EAAY,CAAC,GAAGJ,KAAK;EAE1C,OAAO;IACH,GAAGI,WAAW;IACd,GAAGD;EACP,CAAC;AACL,CAAC"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"UnistyleRegistry.d.ts","sourceRoot":"","sources":["../../../../src/core/UnistyleRegistry.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AACjF,OAAO,KAAK,EAAE,oBAAoB,EAAE,eAAe,EAAE,MAAM,WAAW,CAAA;
|
1
|
+
{"version":3,"file":"UnistyleRegistry.d.ts","sourceRoot":"","sources":["../../../../src/core/UnistyleRegistry.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AACjF,OAAO,KAAK,EAAE,oBAAoB,EAAE,eAAe,EAAE,MAAM,WAAW,CAAA;AAItE,qBAAa,gBAAgB;IAUb,OAAO,CAAC,eAAe;IAT5B,MAAM,EAAE,eAAe,CAAK;IAC5B,OAAO,EAAE,KAAK,CAAC,eAAe,CAAC,CAE9B;IACD,UAAU,EAAE,KAAK,CAAC,MAAM,eAAe,CAAC,CAAK;IAC7C,MAAM,EAAE,eAAe,CAAwB;IAC/C,WAAW,EAAE,oBAAoB,CAA6B;IAC9D,qBAAqB,EAAE,KAAK,CAAC,CAAC,MAAM,oBAAoB,EAAE,oBAAoB,CAAC,MAAM,oBAAoB,CAAC,CAAC,CAAC,CAAK;gBAEpG,eAAe,EAAE,eAAe;IAE7C,SAAS,WAAY,eAAe,UAS1C;IAEM,cAAc,gBAAiB,oBAAoB,UAMzD;IAEM,SAAS,WAAY,eAAe,UAc1C;IAEM,QAAQ,YAAa,MAAM,eAAe,WAUhD;IAEM,SAAS,WAAY,eAAe,WAAU,OAAO,UAW3D;IAEM,YAAY,WAAY,eAAe,UAO7C;IAEM,QAAQ,SAAU,MAAM,eAAe,aAAwB;CACzE"}
|
@@ -1,3 +1,4 @@
|
|
1
|
-
import type { RNStyle } from '../types';
|
2
|
-
|
1
|
+
import type { RNStyle, UnistylesPlugin } from '../types';
|
2
|
+
import type { UnistylesRuntime } from '../core';
|
3
|
+
export declare const withPlugins: (key: string, style: RNStyle, plugins: Array<UnistylesPlugin>, runtime: UnistylesRuntime) => RNStyle;
|
3
4
|
//# sourceMappingURL=withPlugins.d.ts.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"withPlugins.d.ts","sourceRoot":"","sources":["../../../../src/plugins/withPlugins.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,UAAU,CAAA;
|
1
|
+
{"version":3,"file":"withPlugins.d.ts","sourceRoot":"","sources":["../../../../src/plugins/withPlugins.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AACxD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAE/C,eAAO,MAAM,WAAW,QACf,MAAM,SACJ,OAAO,WACL,MAAM,eAAe,CAAC,WACtB,gBAAgB,YAOpB,CAAA"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"useStyles.d.ts","sourceRoot":"","sources":["../../../src/useStyles.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACR,mBAAmB,EACnB,iBAAiB,EACjB,mBAAmB,EACnB,qBAAqB,EACrB,cAAc,EACjB,MAAM,SAAS,CAAA;AAEhB,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAA;
|
1
|
+
{"version":3,"file":"useStyles.d.ts","sourceRoot":"","sources":["../../../src/useStyles.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACR,mBAAmB,EACnB,iBAAiB,EACjB,mBAAmB,EACnB,qBAAqB,EACrB,cAAc,EACjB,MAAM,SAAS,CAAA;AAEhB,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAA;AAGpD,KAAK,gBAAgB,CAAC,EAAE,SAAS,iBAAiB,CAAC,EAAE,CAAC,IAAI;IACtD,KAAK,EAAE,cAAc,CAAC;IACtB,UAAU,EAAE,MAAM,oBAAoB,CAAC;IACvC,MAAM,EAAE,qBAAqB,CAAC,EAAE,CAAC,CAAA;CACpC,CAAA;AAED,eAAO,MAAM,SAAS,oLA+CrB,CAAA"}
|
@@ -1,5 +1,4 @@
|
|
1
1
|
export { mq, MQSymbol } from './mq';
|
2
|
-
export { getKeyForVariant } from './variants';
|
3
2
|
export { getKeyForUnistylesMediaQuery, isWithinTheWidthAndHeight, isValidMq, parseMq } from './mqParser';
|
4
3
|
export { getValueForBreakpoint } from './breakpoints';
|
5
4
|
export { proxifyFunction, parseStyle } from './styles';
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,QAAQ,EAAE,MAAM,MAAM,CAAA;AACnC,OAAO,EAAE,
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,QAAQ,EAAE,MAAM,MAAM,CAAA;AACnC,OAAO,EAAE,4BAA4B,EAAE,yBAAyB,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,YAAY,CAAA;AACxG,OAAO,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAA;AACrD,OAAO,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA"}
|
@@ -1,6 +1,6 @@
|
|
1
|
-
import type { CustomNamedStyles,
|
2
|
-
import type {
|
3
|
-
export declare const proxifyFunction: (key: string, fn: Function,
|
1
|
+
import type { CustomNamedStyles, RNStyle, UnistylesPlugin } from '../types';
|
2
|
+
import type { UnistylesRuntime } from '../core';
|
3
|
+
export declare const proxifyFunction: (key: string, fn: Function, plugins: Array<UnistylesPlugin>, runtime: UnistylesRuntime, variant?: string) => Function;
|
4
4
|
export declare const isPlatformColor: <T extends {}>(value: T) => boolean;
|
5
|
-
export declare const parseStyle: <T extends RNStyle>(key: string, style: CustomNamedStyles<T>,
|
5
|
+
export declare const parseStyle: <T extends RNStyle>(key: string, style: CustomNamedStyles<T>, plugins: Array<UnistylesPlugin>, runtime: UnistylesRuntime, variant?: string) => T;
|
6
6
|
//# 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,
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/utils/styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAe,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAExF,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAK/C,eAAO,MAAM,eAAe,QACnB,MAAM,MACP,QAAQ,WACH,MAAM,eAAe,CAAC,WACtB,gBAAgB,YACf,MAAM,KACjB,QAGD,CAAA;AAEF,eAAO,MAAM,eAAe,8BAA6B,OAMxD,CAAA;AAED,eAAO,MAAM,UAAU,2BACd,MAAM,wCAEF,MAAM,eAAe,CAAC,WACtB,gBAAgB,YACf,MAAM,MAyCnB,CAAA"}
|
@@ -1,3 +1,3 @@
|
|
1
|
-
import type {
|
2
|
-
export declare const
|
1
|
+
import type { CustomNamedStyles } from '../types';
|
2
|
+
export declare const getStyleWithVariant: <T>(style: CustomNamedStyles<T>, variant?: string) => CustomNamedStyles<T> | Omit<CustomNamedStyles<T> & Record<"variants", unknown>, "variants">;
|
3
3
|
//# sourceMappingURL=variants.d.ts.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"variants.d.ts","sourceRoot":"","sources":["../../../../src/utils/variants.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,
|
1
|
+
{"version":3,"file":"variants.d.ts","sourceRoot":"","sources":["../../../../src/utils/variants.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAY,iBAAiB,EAAe,MAAM,UAAU,CAAA;AAcxE,eAAO,MAAM,mBAAmB,6CAElB,MAAM,gGAoBnB,CAAA"}
|
package/package.json
CHANGED
@@ -1,10 +1,13 @@
|
|
1
1
|
import type { UnistylesBridge, UnistylesConfig, UnistylesPlugin } from '../types'
|
2
2
|
import type { UnistylesBreakpoints, UnistylesThemes } from '../global'
|
3
|
-
import { UnistylesError } from '../common'
|
3
|
+
import { isWeb, UnistylesError } from '../common'
|
4
|
+
import { normalizeWebStylesPlugin } from '../plugins'
|
4
5
|
|
5
6
|
export class UnistyleRegistry {
|
6
7
|
public config: UnistylesConfig = {}
|
7
|
-
public plugins: Array<UnistylesPlugin> =
|
8
|
+
public plugins: Array<UnistylesPlugin> = isWeb
|
9
|
+
? [normalizeWebStylesPlugin]
|
10
|
+
: []
|
8
11
|
public themeNames: Array<keyof UnistylesThemes> = []
|
9
12
|
public themes: UnistylesThemes = {} as UnistylesThemes
|
10
13
|
public breakpoints: UnistylesBreakpoints = {} as UnistylesBreakpoints
|
@@ -68,7 +71,7 @@ export class UnistyleRegistry {
|
|
68
71
|
throw new Error(UnistylesError.DuplicatePluginName)
|
69
72
|
}
|
70
73
|
|
71
|
-
this.plugins = this.plugins
|
74
|
+
this.plugins = [plugin].concat(this.plugins)
|
72
75
|
this.unistylesBridge.addPlugin(plugin.name, notify)
|
73
76
|
}
|
74
77
|
|
@@ -1,17 +1,15 @@
|
|
1
|
-
import type { RNStyle } from '../types'
|
2
|
-
import {
|
3
|
-
import { isWeb } from '../common'
|
4
|
-
import { unistyles } from '../core'
|
1
|
+
import type { RNStyle, UnistylesPlugin } from '../types'
|
2
|
+
import type { UnistylesRuntime } from '../core'
|
5
3
|
|
6
|
-
const
|
7
|
-
|
8
|
-
:
|
4
|
+
export const withPlugins = (
|
5
|
+
key: string,
|
6
|
+
style: RNStyle,
|
7
|
+
plugins: Array<UnistylesPlugin>,
|
8
|
+
runtime: UnistylesRuntime
|
9
|
+
) => plugins.reduce((acc, plugin) => {
|
10
|
+
if (plugin.onParsedStyle) {
|
11
|
+
return plugin.onParsedStyle(key, acc, runtime)
|
12
|
+
}
|
9
13
|
|
10
|
-
|
11
|
-
|
12
|
-
if (plugin.onParsedStyle) {
|
13
|
-
return plugin.onParsedStyle(key, acc, unistyles.runtime)
|
14
|
-
}
|
15
|
-
|
16
|
-
return acc
|
17
|
-
}, style)
|
14
|
+
return acc
|
15
|
+
}, style)
|
package/src/useStyles.ts
CHANGED
@@ -10,6 +10,7 @@ import type {
|
|
10
10
|
} from './types'
|
11
11
|
import { useUnistyles } from './hooks'
|
12
12
|
import type { UnistylesBreakpoints } from './global'
|
13
|
+
import { unistyles } from './core'
|
13
14
|
|
14
15
|
type ParsedStylesheet<ST extends CustomNamedStyles<ST>> = {
|
15
16
|
theme: UnistylesTheme,
|
@@ -22,41 +23,46 @@ export const useStyles = <ST extends CustomNamedStyles<ST>>(
|
|
22
23
|
variant?: ExtractVariantNames<typeof stylesheet> & string
|
23
24
|
): ParsedStylesheet<ST> => {
|
24
25
|
const { theme, layout, plugins } = useUnistyles()
|
25
|
-
const { screenSize, breakpoint } = layout
|
26
26
|
|
27
27
|
if (!stylesheet) {
|
28
28
|
return {
|
29
29
|
theme,
|
30
|
-
breakpoint,
|
30
|
+
breakpoint: layout.breakpoint,
|
31
31
|
styles: {} as ReactNativeStyleSheet<ST>
|
32
32
|
}
|
33
33
|
}
|
34
34
|
|
35
35
|
const parsedStyles = useMemo(() => typeof stylesheet === 'function'
|
36
36
|
? stylesheet(theme)
|
37
|
-
: stylesheet, [theme, stylesheet])
|
37
|
+
: stylesheet, [theme, stylesheet, layout])
|
38
38
|
|
39
39
|
const dynamicStyleSheet = useMemo(() => Object
|
40
40
|
.entries(parsedStyles)
|
41
41
|
.reduce((acc, [key, value]) => {
|
42
|
-
const style = value as CustomNamedStyles<ST>
|
43
|
-
|
44
42
|
if (typeof value === 'function') {
|
45
43
|
return {
|
46
44
|
...acc,
|
47
|
-
[key]: proxifyFunction(key, value,
|
45
|
+
[key]: proxifyFunction(key, value,unistyles.registry.plugins, unistyles.runtime, variant)
|
48
46
|
}
|
49
47
|
}
|
50
48
|
|
51
49
|
return StyleSheet.create({
|
52
50
|
...acc,
|
53
|
-
[key]: parseStyle<ST>(
|
51
|
+
[key]: parseStyle<ST>(
|
52
|
+
key,
|
53
|
+
value as CustomNamedStyles<ST>,
|
54
|
+
unistyles.registry.plugins,
|
55
|
+
unistyles.runtime,
|
56
|
+
variant
|
57
|
+
)
|
54
58
|
})
|
55
|
-
}, {} as ST),
|
59
|
+
}, {} as ST),
|
60
|
+
[layout, parsedStyles, variant, plugins]
|
61
|
+
) as ReactNativeStyleSheet<ST>
|
56
62
|
|
57
63
|
return {
|
58
64
|
theme,
|
59
|
-
breakpoint,
|
65
|
+
breakpoint: layout.breakpoint,
|
60
66
|
styles: dynamicStyleSheet
|
61
67
|
}
|
62
68
|
}
|
package/src/utils/index.ts
CHANGED
@@ -1,5 +1,4 @@
|
|
1
1
|
export { mq, MQSymbol } from './mq'
|
2
|
-
export { getKeyForVariant } from './variants'
|
3
2
|
export { getKeyForUnistylesMediaQuery, isWithinTheWidthAndHeight, isValidMq, parseMq } from './mqParser'
|
4
3
|
export { getValueForBreakpoint } from './breakpoints'
|
5
4
|
export { proxifyFunction, parseStyle } from './styles'
|
package/src/utils/styles.ts
CHANGED
@@ -1,18 +1,19 @@
|
|
1
|
-
import type { CustomNamedStyles,
|
1
|
+
import type { CustomNamedStyles, NestedStyle, RNStyle, UnistylesPlugin } from '../types'
|
2
2
|
import { getValueForBreakpoint } from './breakpoints'
|
3
|
-
import type {
|
3
|
+
import type { UnistylesRuntime } from '../core'
|
4
4
|
import { isAndroid, isIOS } from '../common'
|
5
|
-
import {
|
5
|
+
import { getStyleWithVariant } from './variants'
|
6
6
|
import { withPlugins } from '../plugins'
|
7
7
|
|
8
8
|
export const proxifyFunction = (
|
9
9
|
key: string,
|
10
|
-
fn: Function,
|
11
|
-
|
10
|
+
fn: Function,
|
11
|
+
plugins: Array<UnistylesPlugin>,
|
12
|
+
runtime: UnistylesRuntime,
|
12
13
|
variant?: string
|
13
14
|
): Function => new Proxy(fn, {
|
14
15
|
apply: (target, thisArg, argumentsList) =>
|
15
|
-
parseStyle(key, target.apply(thisArg, argumentsList),
|
16
|
+
parseStyle(key, target.apply(thisArg, argumentsList), plugins, runtime, variant)
|
16
17
|
})
|
17
18
|
|
18
19
|
export const isPlatformColor = <T extends {}>(value: T): boolean => {
|
@@ -26,31 +27,12 @@ export const isPlatformColor = <T extends {}>(value: T): boolean => {
|
|
26
27
|
export const parseStyle = <T extends RNStyle>(
|
27
28
|
key: string,
|
28
29
|
style: CustomNamedStyles<T>,
|
29
|
-
|
30
|
-
|
30
|
+
plugins: Array<UnistylesPlugin>,
|
31
|
+
runtime: UnistylesRuntime,
|
31
32
|
variant?: string
|
32
33
|
): T => {
|
33
|
-
const entries =
|
34
|
-
.entries(style || {}) as Array<[keyof T, CustomNamedStyles<T> | NestedStyle]>
|
35
|
-
.map(([key, value]) => {
|
36
|
-
if (key !== 'variants') {
|
37
|
-
return [key, value]
|
38
|
-
}
|
39
|
-
|
40
|
-
const variantKey = getKeyForVariant(
|
41
|
-
value as NestedStyle,
|
42
|
-
variant
|
43
|
-
)
|
44
|
-
|
45
|
-
if (!variantKey) {
|
46
|
-
return undefined
|
47
|
-
}
|
48
|
-
|
49
|
-
return Object
|
50
|
-
.entries(value[variantKey as keyof typeof value] as NestedStyle)
|
51
|
-
.flat()
|
52
|
-
})
|
53
|
-
.filter(Boolean) as Array<[keyof T, CustomNamedStyles<T> | NestedStyle]>
|
34
|
+
const entries = Object
|
35
|
+
.entries(getStyleWithVariant(style || {}, variant)) as Array<[keyof T, CustomNamedStyles<T> | NestedStyle]>
|
54
36
|
|
55
37
|
const parsedStyles = Object
|
56
38
|
.fromEntries(entries
|
@@ -60,7 +42,7 @@ export const parseStyle = <T extends RNStyle>(
|
|
60
42
|
if (hasNestedProperties) {
|
61
43
|
return [
|
62
44
|
key,
|
63
|
-
parseStyle(key, value as CustomNamedStyles<T>,
|
45
|
+
parseStyle(key, value as CustomNamedStyles<T>, plugins, runtime, variant)
|
64
46
|
]
|
65
47
|
}
|
66
48
|
|
@@ -69,7 +51,7 @@ export const parseStyle = <T extends RNStyle>(
|
|
69
51
|
if (isTransform && Array.isArray(value)) {
|
70
52
|
return [
|
71
53
|
key,
|
72
|
-
value.map(value => parseStyle(key, value,
|
54
|
+
value.map(value => parseStyle(key, value, plugins, runtime, variant))
|
73
55
|
]
|
74
56
|
}
|
75
57
|
|
@@ -87,5 +69,5 @@ export const parseStyle = <T extends RNStyle>(
|
|
87
69
|
})
|
88
70
|
) as T
|
89
71
|
|
90
|
-
return withPlugins(key, parsedStyles) as T
|
72
|
+
return withPlugins(key, parsedStyles, plugins, runtime) as T
|
91
73
|
}
|
package/src/utils/variants.ts
CHANGED
@@ -1,6 +1,6 @@
|
|
1
|
-
import type { Optional, NestedStyle } from '../types'
|
1
|
+
import type { Optional, CustomNamedStyles, NestedStyle } from '../types'
|
2
2
|
|
3
|
-
|
3
|
+
const getKeyForVariant = (value: Record<string, NestedStyle>, variant?: string): Optional<string> => {
|
4
4
|
if (variant && variant in value) {
|
5
5
|
return variant
|
6
6
|
}
|
@@ -11,3 +11,27 @@ export const getKeyForVariant = (value: NestedStyle, variant?: string): Optional
|
|
11
11
|
|
12
12
|
return undefined
|
13
13
|
}
|
14
|
+
|
15
|
+
export const getStyleWithVariant = <T>(
|
16
|
+
style: CustomNamedStyles<T>,
|
17
|
+
variant?: string
|
18
|
+
) => {
|
19
|
+
if (!('variants' in style)) {
|
20
|
+
return style
|
21
|
+
}
|
22
|
+
|
23
|
+
const variantKey = getKeyForVariant(
|
24
|
+
style.variants as Record<string, NestedStyle>,
|
25
|
+
variant
|
26
|
+
)
|
27
|
+
const variantValue = variantKey
|
28
|
+
? (style.variants as Record<string, NestedStyle>)[variantKey]
|
29
|
+
: {}
|
30
|
+
|
31
|
+
const { variants, ...otherStyles } = style
|
32
|
+
|
33
|
+
return {
|
34
|
+
...otherStyles,
|
35
|
+
...variantValue
|
36
|
+
}
|
37
|
+
}
|