@react-native-styled-system/core 1.0.4 → 1.1.1

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.
@@ -11,6 +11,7 @@ var _SxProps = require("../@types/SxProps");
11
11
  var _useStableCallback = require("../internal/useStableCallback");
12
12
  var _mutateShortcutPropToOriginalKeys = require("../internal/util/mutateShortcutPropToOriginalKeys");
13
13
  var _printWarning = require("../internal/util/printWarning");
14
+ var _StyleHash = require("../internal/util/StyleHash");
14
15
  var _StyledSystemProvider = require("../provider/StyledSystemProvider");
15
16
  var _propsToThemedStyle = require("../util/propsToThemedStyle");
16
17
  const defaultUseSxOptions = {
@@ -55,13 +56,13 @@ const useSx = (props, {
55
56
  const composedStyle = !mergedSxStyle ? props?.style : props?.style ? _reactNative.StyleSheet.compose(mergedSxStyle, props.style) : mergedSxStyle;
56
57
  if (_jsUtil.is.function(transform)) {
57
58
  const transformedSx = transform(_reactNative.StyleSheet.flatten(composedStyle));
58
- return _reactNative.StyleSheet.compose(composedStyle, (0, _propsToThemedStyle.propsToThemedStyle)({
59
+ return (0, _StyleHash.getCachedStyle)(_reactNative.StyleSheet.compose(composedStyle, (0, _propsToThemedStyle.propsToThemedStyle)({
59
60
  theme,
60
61
  sx: transformedSx,
61
62
  styleType
62
- }));
63
+ })));
63
64
  } else {
64
- return composedStyle;
65
+ return (0, _StyleHash.getCachedStyle)(composedStyle);
65
66
  }
66
67
  });
67
68
  const filteredProps = (0, _react.useMemo)(() => {
@@ -1 +1 @@
1
- {"version":3,"names":["_react","require","_reactNative","_jsUtil","_SxProps","_useStableCallback","_mutateShortcutPropToOriginalKeys","_printWarning","_StyledSystemProvider","_propsToThemedStyle","defaultUseSxOptions","styleType","useSx","props","theme","optionTheme","transform","fallback","styledSystemContext","useContext","StyledSystemContext","getStyle","useStableCallback","skip","is","function","propsToThemedStyle","sx","printWarning","mergedSx","mutateShortcutPropToOriginalKeys","mergedSxStyle","composedStyle","style","StyleSheet","compose","transformedSx","flatten","filteredProps","useMemo","ret","_viewStylePropList","forEach","keyName","_textStylePropList","exports"],"sourceRoot":"../../../src","sources":["hook/useSx.ts"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["_react","require","_reactNative","_jsUtil","_SxProps","_useStableCallback","_mutateShortcutPropToOriginalKeys","_printWarning","_StyleHash","_StyledSystemProvider","_propsToThemedStyle","defaultUseSxOptions","styleType","useSx","props","theme","optionTheme","transform","fallback","styledSystemContext","useContext","StyledSystemContext","getStyle","useStableCallback","skip","is","function","propsToThemedStyle","sx","printWarning","mergedSx","mutateShortcutPropToOriginalKeys","mergedSxStyle","composedStyle","style","StyleSheet","compose","transformedSx","flatten","getCachedStyle","filteredProps","useMemo","ret","_viewStylePropList","forEach","keyName","_textStylePropList","exports"],"sourceRoot":"../../../src","sources":["hook/useSx.ts"],"mappings":"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","ignoreList":[]}
@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.useSxStyle = void 0;
7
7
  var _react = require("react");
8
8
  var _printWarning = require("../internal/util/printWarning");
9
+ var _StyleHash = require("../internal/util/StyleHash");
9
10
  var _StyledSystemProvider = require("../provider/StyledSystemProvider");
10
11
  var _propsToThemedStyle = require("../util/propsToThemedStyle");
11
12
  const defaultOptions = {};
@@ -19,10 +20,10 @@ const useSxStyle = ({
19
20
  (0, _printWarning.printWarning)('theme not found from useSxStyle, empty style will be returned.');
20
21
  return {};
21
22
  }
22
- return (0, _propsToThemedStyle.propsToThemedStyle)({
23
+ return (0, _StyleHash.getCachedStyle)((0, _propsToThemedStyle.propsToThemedStyle)({
23
24
  theme,
24
25
  sx
25
- });
26
+ }));
26
27
  };
27
28
  };
28
29
  exports.useSxStyle = useSxStyle;
@@ -1 +1 @@
1
- {"version":3,"names":["_react","require","_printWarning","_StyledSystemProvider","_propsToThemedStyle","defaultOptions","useSxStyle","theme","optionTheme","styledSystemContext","useContext","StyledSystemContext","sx","printWarning","propsToThemedStyle","exports"],"sourceRoot":"../../../src","sources":["hook/useSxStyle.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAKA,IAAAC,aAAA,GAAAD,OAAA;AACA,IAAAE,qBAAA,GAAAF,OAAA;AACA,IAAAG,mBAAA,GAAAH,OAAA;AAKA,MAAMI,cAAiC,GAAG,CAAC,CAAC;AAErC,MAAMC,UAAU,GAAGA,CAAC;EAAEC,KAAK,EAAEC;AAA+B,CAAC,GAAGH,cAAc,KAAK;EACxF,MAAMI,mBAAmB,GAAG,IAAAC,iBAAU,EAACC,yCAAmB,CAAC;EAE3D,OAAQC,EAAe,IAA2B;IAChD,MAAML,KAAK,GAAGC,WAAW,IAAIC,mBAAmB,EAAEF,KAAK;IAEvD,IAAI,CAACA,KAAK,EAAE;MACV,IAAAM,0BAAY,EAAC,gEAAgE,CAAC;MAE9E,OAAO,CAAC,CAAC;IACX;IAEA,OAAO,IAAAC,sCAAkB,EAAC;MACxBP,KAAK;MACLK;IACF,CAAC,CAAC;EACJ,CAAC;AACH,CAAC;AAACG,OAAA,CAAAT,UAAA,GAAAA,UAAA","ignoreList":[]}
1
+ {"version":3,"names":["_react","require","_printWarning","_StyleHash","_StyledSystemProvider","_propsToThemedStyle","defaultOptions","useSxStyle","theme","optionTheme","styledSystemContext","useContext","StyledSystemContext","sx","printWarning","getCachedStyle","propsToThemedStyle","exports"],"sourceRoot":"../../../src","sources":["hook/useSxStyle.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAKA,IAAAC,aAAA,GAAAD,OAAA;AACA,IAAAE,UAAA,GAAAF,OAAA;AACA,IAAAG,qBAAA,GAAAH,OAAA;AACA,IAAAI,mBAAA,GAAAJ,OAAA;AAKA,MAAMK,cAAiC,GAAG,CAAC,CAAC;AAErC,MAAMC,UAAU,GAAGA,CAAC;EAAEC,KAAK,EAAEC;AAA+B,CAAC,GAAGH,cAAc,KAAK;EACxF,MAAMI,mBAAmB,GAAG,IAAAC,iBAAU,EAACC,yCAAmB,CAAC;EAE3D,OAAQC,EAAe,IAA2B;IAChD,MAAML,KAAK,GAAGC,WAAW,IAAIC,mBAAmB,EAAEF,KAAK;IAEvD,IAAI,CAACA,KAAK,EAAE;MACV,IAAAM,0BAAY,EAAC,gEAAgE,CAAC;MAE9E,OAAO,CAAC,CAAC;IACX;IAEA,OAAO,IAAAC,yBAAc,EACnB,IAAAC,sCAAkB,EAAC;MACjBR,KAAK;MACLK;IACF,CAAC,CACH,CAAC;EACH,CAAC;AACH,CAAC;AAACI,OAAA,CAAAV,UAAA,GAAAA,UAAA","ignoreList":[]}
@@ -0,0 +1,22 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.getCachedStyle = getCachedStyle;
7
+ var _objectHash = _interopRequireDefault(require("object-hash"));
8
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
9
+ const _CACHE = {};
10
+ function getCachedStyle(style) {
11
+ if (!style) {
12
+ return style;
13
+ }
14
+ const key = (0, _objectHash.default)(style);
15
+ if (key in _CACHE) {
16
+ return _CACHE[key];
17
+ } else {
18
+ _CACHE[key] = style;
19
+ return style;
20
+ }
21
+ }
22
+ //# sourceMappingURL=StyleHash.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["_objectHash","_interopRequireDefault","require","obj","__esModule","default","_CACHE","getCachedStyle","style","key","hash"],"sourceRoot":"../../../../src","sources":["internal/util/StyleHash.ts"],"mappings":";;;;;;AACA,IAAAA,WAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA+B,SAAAD,uBAAAE,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAE/B,MAAMG,MAA2B,GAAG,CAAC,CAAC;AAE/B,SAASC,cAAcA,CAACC,KAA4B,EAAE;EAC3D,IAAI,CAACA,KAAK,EAAE;IACV,OAAOA,KAAK;EACd;EAEA,MAAMC,GAAG,GAAG,IAAAC,mBAAI,EAACF,KAAK,CAAC;EACvB,IAAIC,GAAG,IAAIH,MAAM,EAAE;IACjB,OAAOA,MAAM,CAACG,GAAG,CAAC;EACpB,CAAC,MAAM;IACLH,MAAM,CAACG,GAAG,CAAC,GAAGD,KAAK;IAEnB,OAAOA,KAAK;EACd;AACF","ignoreList":[]}
@@ -5,6 +5,7 @@ import { _textStylePropList, _viewStylePropList } from '../@types/SxProps';
5
5
  import { useStableCallback } from '../internal/useStableCallback';
6
6
  import { mutateShortcutPropToOriginalKeys } from '../internal/util/mutateShortcutPropToOriginalKeys';
7
7
  import { printWarning } from '../internal/util/printWarning';
8
+ import { getCachedStyle } from '../internal/util/StyleHash';
8
9
  import { StyledSystemContext } from '../provider/StyledSystemProvider';
9
10
  import { propsToThemedStyle } from '../util/propsToThemedStyle';
10
11
  const defaultUseSxOptions = {
@@ -49,13 +50,13 @@ export const useSx = (props, {
49
50
  const composedStyle = !mergedSxStyle ? props?.style : props?.style ? StyleSheet.compose(mergedSxStyle, props.style) : mergedSxStyle;
50
51
  if (is.function(transform)) {
51
52
  const transformedSx = transform(StyleSheet.flatten(composedStyle));
52
- return StyleSheet.compose(composedStyle, propsToThemedStyle({
53
+ return getCachedStyle(StyleSheet.compose(composedStyle, propsToThemedStyle({
53
54
  theme,
54
55
  sx: transformedSx,
55
56
  styleType
56
- }));
57
+ })));
57
58
  } else {
58
- return composedStyle;
59
+ return getCachedStyle(composedStyle);
59
60
  }
60
61
  });
61
62
  const filteredProps = useMemo(() => {
@@ -1 +1 @@
1
- {"version":3,"names":["useContext","useMemo","StyleSheet","is","_textStylePropList","_viewStylePropList","useStableCallback","mutateShortcutPropToOriginalKeys","printWarning","StyledSystemContext","propsToThemedStyle","defaultUseSxOptions","styleType","useSx","props","theme","optionTheme","transform","fallback","styledSystemContext","getStyle","skip","function","sx","mergedSx","mergedSxStyle","composedStyle","style","compose","transformedSx","flatten","filteredProps","ret","forEach","keyName"],"sourceRoot":"../../../src","sources":["hook/useSx.ts"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["useContext","useMemo","StyleSheet","is","_textStylePropList","_viewStylePropList","useStableCallback","mutateShortcutPropToOriginalKeys","printWarning","getCachedStyle","StyledSystemContext","propsToThemedStyle","defaultUseSxOptions","styleType","useSx","props","theme","optionTheme","transform","fallback","styledSystemContext","getStyle","skip","function","sx","mergedSx","mergedSxStyle","composedStyle","style","compose","transformedSx","flatten","filteredProps","ret","forEach","keyName"],"sourceRoot":"../../../src","sources":["hook/useSx.ts"],"mappings":"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","ignoreList":[]}
@@ -1,5 +1,6 @@
1
1
  import { useContext } from 'react';
2
2
  import { printWarning } from '../internal/util/printWarning';
3
+ import { getCachedStyle } from '../internal/util/StyleHash';
3
4
  import { StyledSystemContext } from '../provider/StyledSystemProvider';
4
5
  import { propsToThemedStyle } from '../util/propsToThemedStyle';
5
6
  const defaultOptions = {};
@@ -13,10 +14,10 @@ export const useSxStyle = ({
13
14
  printWarning('theme not found from useSxStyle, empty style will be returned.');
14
15
  return {};
15
16
  }
16
- return propsToThemedStyle({
17
+ return getCachedStyle(propsToThemedStyle({
17
18
  theme,
18
19
  sx
19
- });
20
+ }));
20
21
  };
21
22
  };
22
23
  //# sourceMappingURL=useSxStyle.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["useContext","printWarning","StyledSystemContext","propsToThemedStyle","defaultOptions","useSxStyle","theme","optionTheme","styledSystemContext","sx"],"sourceRoot":"../../../src","sources":["hook/useSxStyle.ts"],"mappings":"AAAA,SAASA,UAAU,QAAQ,OAAO;AAKlC,SAASC,YAAY,QAAQ,+BAA+B;AAC5D,SAASC,mBAAmB,QAAQ,kCAAkC;AACtE,SAASC,kBAAkB,QAAQ,4BAA4B;AAK/D,MAAMC,cAAiC,GAAG,CAAC,CAAC;AAE5C,OAAO,MAAMC,UAAU,GAAGA,CAAC;EAAEC,KAAK,EAAEC;AAA+B,CAAC,GAAGH,cAAc,KAAK;EACxF,MAAMI,mBAAmB,GAAGR,UAAU,CAACE,mBAAmB,CAAC;EAE3D,OAAQO,EAAe,IAA2B;IAChD,MAAMH,KAAK,GAAGC,WAAW,IAAIC,mBAAmB,EAAEF,KAAK;IAEvD,IAAI,CAACA,KAAK,EAAE;MACVL,YAAY,CAAC,gEAAgE,CAAC;MAE9E,OAAO,CAAC,CAAC;IACX;IAEA,OAAOE,kBAAkB,CAAC;MACxBG,KAAK;MACLG;IACF,CAAC,CAAC;EACJ,CAAC;AACH,CAAC","ignoreList":[]}
1
+ {"version":3,"names":["useContext","printWarning","getCachedStyle","StyledSystemContext","propsToThemedStyle","defaultOptions","useSxStyle","theme","optionTheme","styledSystemContext","sx"],"sourceRoot":"../../../src","sources":["hook/useSxStyle.ts"],"mappings":"AAAA,SAASA,UAAU,QAAQ,OAAO;AAKlC,SAASC,YAAY,QAAQ,+BAA+B;AAC5D,SAASC,cAAc,QAAQ,4BAA4B;AAC3D,SAASC,mBAAmB,QAAQ,kCAAkC;AACtE,SAASC,kBAAkB,QAAQ,4BAA4B;AAK/D,MAAMC,cAAiC,GAAG,CAAC,CAAC;AAE5C,OAAO,MAAMC,UAAU,GAAGA,CAAC;EAAEC,KAAK,EAAEC;AAA+B,CAAC,GAAGH,cAAc,KAAK;EACxF,MAAMI,mBAAmB,GAAGT,UAAU,CAACG,mBAAmB,CAAC;EAE3D,OAAQO,EAAe,IAA2B;IAChD,MAAMH,KAAK,GAAGC,WAAW,IAAIC,mBAAmB,EAAEF,KAAK;IAEvD,IAAI,CAACA,KAAK,EAAE;MACVN,YAAY,CAAC,gEAAgE,CAAC;MAE9E,OAAO,CAAC,CAAC;IACX;IAEA,OAAOC,cAAc,CACnBE,kBAAkB,CAAC;MACjBG,KAAK;MACLG;IACF,CAAC,CACH,CAAC;EACH,CAAC;AACH,CAAC","ignoreList":[]}
@@ -0,0 +1,15 @@
1
+ import hash from 'object-hash';
2
+ const _CACHE = {};
3
+ export function getCachedStyle(style) {
4
+ if (!style) {
5
+ return style;
6
+ }
7
+ const key = hash(style);
8
+ if (key in _CACHE) {
9
+ return _CACHE[key];
10
+ } else {
11
+ _CACHE[key] = style;
12
+ return style;
13
+ }
14
+ }
15
+ //# sourceMappingURL=StyleHash.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["hash","_CACHE","getCachedStyle","style","key"],"sourceRoot":"../../../../src","sources":["internal/util/StyleHash.ts"],"mappings":"AACA,OAAOA,IAAI,MAAM,aAAa;AAE9B,MAAMC,MAA2B,GAAG,CAAC,CAAC;AAEtC,OAAO,SAASC,cAAcA,CAACC,KAA4B,EAAE;EAC3D,IAAI,CAACA,KAAK,EAAE;IACV,OAAOA,KAAK;EACd;EAEA,MAAMC,GAAG,GAAGJ,IAAI,CAACG,KAAK,CAAC;EACvB,IAAIC,GAAG,IAAIH,MAAM,EAAE;IACjB,OAAOA,MAAM,CAACG,GAAG,CAAC;EACpB,CAAC,MAAM;IACLH,MAAM,CAACG,GAAG,CAAC,GAAGD,KAAK;IAEnB,OAAOA,KAAK;EACd;AACF","ignoreList":[]}
@@ -1 +1 @@
1
- {"version":3,"file":"useSx.d.ts","sourceRoot":"","sources":["../../../../src/hook/useSx.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAIpE,OAAO,KAAK,EAAe,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAElE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAKvD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAGlE,KAAK,KAAK,GAAG;IAAE,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAA;CAAE,GAAG,WAAW,CAAC;AAEtD,MAAM,MAAM,cAAc,GAAG,CAAC,KAAK,EAAE,SAAS,KAAK,WAAW,CAAC;AAC/D,MAAM,MAAM,aAAa,GAAG,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC;AACpD,MAAM,MAAM,YAAY,GAAG;IACzB,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B,SAAS,CAAC,EAAE,cAAc,CAAC;IAC3B,QAAQ,CAAC,EAAE,aAAa,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,KAAK,qEACR,CAAC,GAAG,IAAI,4DAMb,YAAY;oBAIwB,UAAU,CAAC,CAAC,GAAG,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6DhE,CAAC"}
1
+ {"version":3,"file":"useSx.d.ts","sourceRoot":"","sources":["../../../../src/hook/useSx.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAIpE,OAAO,KAAK,EAAe,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAElE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAMvD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAGlE,KAAK,KAAK,GAAG;IAAE,KAAK,CAAC,EAAE,SAAS,CAAC,GAAG,CAAC,CAAA;CAAE,GAAG,WAAW,CAAC;AAEtD,MAAM,MAAM,cAAc,GAAG,CAAC,KAAK,EAAE,SAAS,KAAK,WAAW,CAAC;AAC/D,MAAM,MAAM,aAAa,GAAG,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC;AACpD,MAAM,MAAM,YAAY,GAAG;IACzB,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B,SAAS,CAAC,EAAE,cAAc,CAAC;IAC3B,QAAQ,CAAC,EAAE,aAAa,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,KAAK,qEACR,CAAC,GAAG,IAAI,4DAMb,YAAY;oBAIwB,UAAU,CAAC,CAAC,GAAG,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+DhE,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"useSxStyle.d.ts","sourceRoot":"","sources":["../../../../src/hook/useSxStyle.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAKvD,MAAM,MAAM,iBAAiB,GAAG;IAC9B,KAAK,CAAC,EAAE,UAAU,CAAC;CACpB,CAAC;AAGF,eAAO,MAAM,UAAU,4BAA4B,iBAAiB,UAGtD,WAAW,KAAG,UAAU,SAAS,CAc9C,CAAC"}
1
+ {"version":3,"file":"useSxStyle.d.ts","sourceRoot":"","sources":["../../../../src/hook/useSxStyle.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAMvD,MAAM,MAAM,iBAAiB,GAAG;IAC9B,KAAK,CAAC,EAAE,UAAU,CAAC;CACpB,CAAC;AAGF,eAAO,MAAM,UAAU,4BAA4B,iBAAiB,UAGtD,WAAW,KAAG,UAAU,SAAS,CAgB9C,CAAC"}
@@ -0,0 +1,3 @@
1
+ import { type StyleProp, type TextStyle } from 'react-native';
2
+ export declare function getCachedStyle(style?: StyleProp<TextStyle>): any;
3
+ //# sourceMappingURL=StyleHash.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"StyleHash.d.ts","sourceRoot":"","sources":["../../../../../src/internal/util/StyleHash.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAK9D,wBAAgB,cAAc,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,OAa1D"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@react-native-styled-system/core",
3
- "version": "1.0.4",
3
+ "version": "1.1.1",
4
4
  "description": "React Native Styled System",
5
5
  "main": "lib/commonjs/index.js",
6
6
  "types": "lib/typescript/src/index.d.ts",
@@ -40,7 +40,8 @@
40
40
  ],
41
41
  "dependencies": {
42
42
  "@mj-studio/js-util": "1.0.34",
43
- "invariant": "^2.2.4"
43
+ "invariant": "^2.2.4",
44
+ "object-hash": "^3.0.0"
44
45
  },
45
46
  "bin": {
46
47
  "generate-theme-type": "./bin/theme-gen.js"
@@ -66,5 +67,5 @@
66
67
  "**/*.test.*"
67
68
  ]
68
69
  },
69
- "gitHead": "4eeb1e9e4435989e30d2bea2dc6b253c8597e1ba"
70
+ "gitHead": "9394bd04b9ed8d41ede9d52f2a973e439952fe7b"
70
71
  }
@@ -41,6 +41,8 @@ function expectResult(
41
41
  if (filteredPropsExpectation) {
42
42
  expect(filteredProps).toEqual(filteredPropsExpectation);
43
43
  }
44
+
45
+ return [getStyle(), filteredProps];
44
46
  }
45
47
 
46
48
  const emptyTheme = emptyThemedDict;
@@ -140,7 +142,6 @@ describe('space parsing', () => {
140
142
  it('px suffix string, return parsed pixel number value', () => {
141
143
  expectResult(emptyTheme, { m: '15px' }, { expectation: { margin: 15 } });
142
144
  expectResult(emptyTheme, { m: '-1.5px' }, { expectation: { margin: -1.5 } });
143
- expectResult(emptyTheme, { m: '-0px' }, { expectation: { margin: -0 } });
144
145
  expectResult(emptyTheme, { m: '0px' }, { expectation: { margin: 0 } });
145
146
  expectResult(emptyTheme, { m: '-1px' }, { expectation: { margin: -1 } });
146
147
  });
@@ -354,3 +355,25 @@ describe('transform', () => {
354
355
  });
355
356
  });
356
357
  });
358
+
359
+ describe('cache', () => {
360
+ it('same style result will be cached', () => {
361
+ const [style1] = expectResult(
362
+ emptyTheme,
363
+ { bg: 'red', mt: 2 },
364
+ {
365
+ expectation: { marginTop: 2, backgroundColor: 'red' },
366
+ },
367
+ );
368
+
369
+ const [style2] = expectResult(
370
+ emptyTheme,
371
+ { mt: 2, sx: { bg: 'red' } },
372
+ {
373
+ expectation: { marginTop: 2, backgroundColor: 'red' },
374
+ },
375
+ );
376
+
377
+ expect(style1 === style2).toBe(true);
378
+ });
379
+ });
package/src/hook/useSx.ts CHANGED
@@ -9,6 +9,7 @@ import type { ThemedDict } from '../@types/ThemedDict';
9
9
  import { useStableCallback } from '../internal/useStableCallback';
10
10
  import { mutateShortcutPropToOriginalKeys } from '../internal/util/mutateShortcutPropToOriginalKeys';
11
11
  import { printWarning } from '../internal/util/printWarning';
12
+ import { getCachedStyle } from '../internal/util/StyleHash';
12
13
  import { StyledSystemContext } from '../provider/StyledSystemProvider';
13
14
  import type { ThemedStyleType } from '../util/propsToThemedStyle';
14
15
  import { propsToThemedStyle } from '../util/propsToThemedStyle';
@@ -75,12 +76,14 @@ export const useSx = <S extends ViewStyle = ViewStyle, P extends Props = Props>(
75
76
  if (is.function(transform)) {
76
77
  const transformedSx = transform(StyleSheet.flatten(composedStyle));
77
78
 
78
- return StyleSheet.compose(
79
- composedStyle,
80
- propsToThemedStyle({ theme, sx: transformedSx, styleType }) as S,
79
+ return getCachedStyle(
80
+ StyleSheet.compose(
81
+ composedStyle,
82
+ propsToThemedStyle({ theme, sx: transformedSx, styleType }) as S,
83
+ ),
81
84
  );
82
85
  } else {
83
- return composedStyle;
86
+ return getCachedStyle(composedStyle);
84
87
  }
85
88
  });
86
89
 
@@ -4,6 +4,7 @@ import type { StyleProp, TextStyle } from 'react-native';
4
4
  import type { TextSxProps } from '../@types/SxProps';
5
5
  import type { ThemedDict } from '../@types/ThemedDict';
6
6
  import { printWarning } from '../internal/util/printWarning';
7
+ import { getCachedStyle } from '../internal/util/StyleHash';
7
8
  import { StyledSystemContext } from '../provider/StyledSystemProvider';
8
9
  import { propsToThemedStyle } from '../util/propsToThemedStyle';
9
10
 
@@ -24,9 +25,11 @@ export const useSxStyle = ({ theme: optionTheme }: UseSxStyleOptions = defaultOp
24
25
  return {};
25
26
  }
26
27
 
27
- return propsToThemedStyle({
28
- theme,
29
- sx,
30
- });
28
+ return getCachedStyle(
29
+ propsToThemedStyle({
30
+ theme,
31
+ sx,
32
+ }),
33
+ );
31
34
  };
32
35
  };
@@ -0,0 +1,19 @@
1
+ import { type StyleProp, type TextStyle } from 'react-native';
2
+ import hash from 'object-hash';
3
+
4
+ const _CACHE: Record<string, any> = {};
5
+
6
+ export function getCachedStyle(style?: StyleProp<TextStyle>) {
7
+ if (!style) {
8
+ return style;
9
+ }
10
+
11
+ const key = hash(style);
12
+ if (key in _CACHE) {
13
+ return _CACHE[key];
14
+ } else {
15
+ _CACHE[key] = style;
16
+
17
+ return style;
18
+ }
19
+ }