@react-native-styled-system/core 1.3.1 → 1.4.0
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.
- package/lib/commonjs/util/createSxComponent.js +18 -5
- package/lib/commonjs/util/createSxComponent.js.map +1 -1
- package/lib/module/util/createSxComponent.js +18 -5
- package/lib/module/util/createSxComponent.js.map +1 -1
- package/lib/typescript/src/util/createSxComponent.d.ts +9 -2
- package/lib/typescript/src/util/createSxComponent.d.ts.map +1 -1
- package/package.json +2 -2
- package/src/util/createSxComponent.tsx +17 -4
|
@@ -10,13 +10,19 @@ var _useSx = require("../hook/useSx");
|
|
|
10
10
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
11
11
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
12
12
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
13
|
-
function createSxComponent(Base
|
|
13
|
+
function createSxComponent(Base, {
|
|
14
|
+
defaultProps,
|
|
15
|
+
sxOptions
|
|
16
|
+
} = {}) {
|
|
14
17
|
return () => {
|
|
15
18
|
const Transformed = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
16
19
|
const {
|
|
17
20
|
filteredProps,
|
|
18
21
|
getStyle
|
|
19
|
-
} = (0, _useSx.useSx)(
|
|
22
|
+
} = (0, _useSx.useSx)({
|
|
23
|
+
...defaultProps,
|
|
24
|
+
...props
|
|
25
|
+
}, sxOptions);
|
|
20
26
|
return /*#__PURE__*/_react.default.createElement(Base, _extends({}, filteredProps, {
|
|
21
27
|
style: getStyle(),
|
|
22
28
|
ref: ref
|
|
@@ -26,14 +32,21 @@ function createSxComponent(Base) {
|
|
|
26
32
|
return Transformed;
|
|
27
33
|
};
|
|
28
34
|
}
|
|
29
|
-
function createSxTextComponent(Base
|
|
35
|
+
function createSxTextComponent(Base, {
|
|
36
|
+
defaultProps,
|
|
37
|
+
sxOptions
|
|
38
|
+
} = {}) {
|
|
30
39
|
return () => {
|
|
31
40
|
const Transformed = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
32
41
|
const {
|
|
33
42
|
filteredProps,
|
|
34
43
|
getStyle
|
|
35
|
-
} = (0, _useSx.useSx)(
|
|
36
|
-
|
|
44
|
+
} = (0, _useSx.useSx)({
|
|
45
|
+
...defaultProps,
|
|
46
|
+
...props
|
|
47
|
+
}, {
|
|
48
|
+
styleType: 'TextStyle',
|
|
49
|
+
...sxOptions
|
|
37
50
|
});
|
|
38
51
|
return /*#__PURE__*/_react.default.createElement(Base, _extends({}, filteredProps, {
|
|
39
52
|
style: getStyle(),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireWildcard","require","_useSx","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_extends","assign","bind","target","arguments","length","source","key","prototype","apply","createSxComponent","Base","Transformed","forwardRef","props","ref","filteredProps","getStyle","useSx","createElement","style","displayName","name","createSxTextComponent","styleType"],"sourceRoot":"../../../src","sources":["util/createSxComponent.tsx"],"mappings":";;;;;;;AACA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_useSx","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_extends","assign","bind","target","arguments","length","source","key","prototype","apply","createSxComponent","Base","defaultProps","sxOptions","Transformed","forwardRef","props","ref","filteredProps","getStyle","useSx","createElement","style","displayName","name","createSxTextComponent","styleType"],"sourceRoot":"../../../src","sources":["util/createSxComponent.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,13 +1,19 @@
|
|
|
1
1
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
2
|
import React, { forwardRef } from 'react';
|
|
3
3
|
import { useSx } from '../hook/useSx';
|
|
4
|
-
export function createSxComponent(Base
|
|
4
|
+
export function createSxComponent(Base, {
|
|
5
|
+
defaultProps,
|
|
6
|
+
sxOptions
|
|
7
|
+
} = {}) {
|
|
5
8
|
return () => {
|
|
6
9
|
const Transformed = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
7
10
|
const {
|
|
8
11
|
filteredProps,
|
|
9
12
|
getStyle
|
|
10
|
-
} = useSx(
|
|
13
|
+
} = useSx({
|
|
14
|
+
...defaultProps,
|
|
15
|
+
...props
|
|
16
|
+
}, sxOptions);
|
|
11
17
|
return /*#__PURE__*/React.createElement(Base, _extends({}, filteredProps, {
|
|
12
18
|
style: getStyle(),
|
|
13
19
|
ref: ref
|
|
@@ -17,14 +23,21 @@ export function createSxComponent(Base) {
|
|
|
17
23
|
return Transformed;
|
|
18
24
|
};
|
|
19
25
|
}
|
|
20
|
-
export function createSxTextComponent(Base
|
|
26
|
+
export function createSxTextComponent(Base, {
|
|
27
|
+
defaultProps,
|
|
28
|
+
sxOptions
|
|
29
|
+
} = {}) {
|
|
21
30
|
return () => {
|
|
22
31
|
const Transformed = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
23
32
|
const {
|
|
24
33
|
filteredProps,
|
|
25
34
|
getStyle
|
|
26
|
-
} = useSx(
|
|
27
|
-
|
|
35
|
+
} = useSx({
|
|
36
|
+
...defaultProps,
|
|
37
|
+
...props
|
|
38
|
+
}, {
|
|
39
|
+
styleType: 'TextStyle',
|
|
40
|
+
...sxOptions
|
|
28
41
|
});
|
|
29
42
|
return /*#__PURE__*/React.createElement(Base, _extends({}, filteredProps, {
|
|
30
43
|
style: getStyle(),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","forwardRef","useSx","createSxComponent","Base","Transformed","props","ref","filteredProps","getStyle","createElement","_extends","style","displayName","name","createSxTextComponent","styleType"],"sourceRoot":"../../../src","sources":["util/createSxComponent.tsx"],"mappings":";AACA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;
|
|
1
|
+
{"version":3,"names":["React","forwardRef","useSx","createSxComponent","Base","defaultProps","sxOptions","Transformed","props","ref","filteredProps","getStyle","createElement","_extends","style","displayName","name","createSxTextComponent","styleType"],"sourceRoot":"../../../src","sources":["util/createSxComponent.tsx"],"mappings":";AACA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AAIzC,SAASC,KAAK,QAAQ,eAAe;AAErC,OAAO,SAASC,iBAAiBA,CAC/BC,IAA0B,EAC1B;EAAEC,YAAY;EAAEC;AAAwE,CAAC,GAAG,CAAC,CAAC,EAC9F;EACA,OAAO,MAAM;IACX,MAAMC,WAAW,gBAAGN,UAAU,CAAuB,UAAUO,KAAK,EAAEC,GAAG,EAAE;MACzE,MAAM;QAAEC,aAAa;QAAEC;MAAS,CAAC,GAAGT,KAAK,CAAC;QAAE,GAAGG,YAAY;QAAE,GAAGG;MAAM,CAAC,EAAEF,SAAS,CAAC;MAEnF,oBAAON,KAAA,CAAAY,aAAA,CAACR,IAAI,EAAAS,QAAA,KAAMH,aAAa;QAAUI,KAAK,EAAEH,QAAQ,CAAC,CAAE;QAACF,GAAG,EAAEA;MAAW,EAAE,CAAC;IACjF,CAAC,CAAC;IAEFF,WAAW,CAACQ,WAAW,GAAI,MAAKX,IAAI,CAACW,WAAW,IAAIX,IAAI,CAACY,IAAI,IAAI,QAAS,EAAC;IAE3E,OAAOT,WAAW;EACpB,CAAC;AACH;AAEA,OAAO,SAASU,qBAAqBA,CACnCb,IAA0B,EAC1B;EACEC,YAAY;EACZC;AACgE,CAAC,GAAG,CAAC,CAAC,EACxE;EACA,OAAO,MAAM;IACX,MAAMC,WAAW,gBAAGN,UAAU,CAA2B,UAAUO,KAAK,EAAEC,GAAG,EAAE;MAC7E,MAAM;QAAEC,aAAa;QAAEC;MAAS,CAAC,GAAGT,KAAK,CACvC;QAAE,GAAGG,YAAY;QAAE,GAAGG;MAAM,CAAC,EAC7B;QAAEU,SAAS,EAAE,WAAW;QAAE,GAAGZ;MAAU,CACzC,CAAC;MAED,oBAAON,KAAA,CAAAY,aAAA,CAACR,IAAI,EAAAS,QAAA,KAAMH,aAAa;QAAUI,KAAK,EAAEH,QAAQ,CAAC,CAAE;QAACF,GAAG,EAAEA;MAAW,EAAE,CAAC;IACjF,CAAC,CAAC;IAEFF,WAAW,CAACQ,WAAW,GAAI,MAAKX,IAAI,CAACW,WAAW,IAAIX,IAAI,CAACY,IAAI,IAAI,QAAS,EAAC;IAE3E,OAAOT,WAAW;EACpB,CAAC;AACH","ignoreList":[]}
|
|
@@ -1,6 +1,13 @@
|
|
|
1
1
|
import type { ComponentType } from 'react';
|
|
2
2
|
import React from 'react';
|
|
3
3
|
import type { SxProps, TextSxProps } from '../@types/SxProps';
|
|
4
|
-
|
|
5
|
-
export declare function
|
|
4
|
+
import type { UseSxOptions } from '../hook/useSx';
|
|
5
|
+
export declare function createSxComponent<Props extends object, Ref>(Base: ComponentType<Props>, { defaultProps, sxOptions }?: {
|
|
6
|
+
defaultProps?: Props & SxProps;
|
|
7
|
+
sxOptions?: UseSxOptions;
|
|
8
|
+
}): () => React.ForwardRefExoticComponent<React.PropsWithoutRef<Props & SxProps> & React.RefAttributes<Ref>>;
|
|
9
|
+
export declare function createSxTextComponent<Props extends object, Ref>(Base: ComponentType<Props>, { defaultProps, sxOptions, }?: {
|
|
10
|
+
defaultProps?: Props & TextSxProps;
|
|
11
|
+
sxOptions?: UseSxOptions;
|
|
12
|
+
}): () => React.ForwardRefExoticComponent<React.PropsWithoutRef<Props & TextSxProps> & React.RefAttributes<Ref>>;
|
|
6
13
|
//# sourceMappingURL=createSxComponent.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"createSxComponent.d.ts","sourceRoot":"","sources":["../../../../src/util/createSxComponent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"createSxComponent.d.ts","sourceRoot":"","sources":["../../../../src/util/createSxComponent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAC9D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAGlD,wBAAgB,iBAAiB,CAAC,KAAK,SAAS,MAAM,EAAE,GAAG,EACzD,IAAI,EAAE,aAAa,CAAC,KAAK,CAAC,EAC1B,EAAE,YAAY,EAAE,SAAS,EAAE,GAAE;IAAE,YAAY,CAAC,EAAE,KAAK,GAAG,OAAO,CAAC;IAAC,SAAS,CAAC,EAAE,YAAY,CAAA;CAAO,4GAa/F;AAED,wBAAgB,qBAAqB,CAAC,KAAK,SAAS,MAAM,EAAE,GAAG,EAC7D,IAAI,EAAE,aAAa,CAAC,KAAK,CAAC,EAC1B,EACE,YAAY,EACZ,SAAS,GACV,GAAE;IAAE,YAAY,CAAC,EAAE,KAAK,GAAG,WAAW,CAAC;IAAC,SAAS,CAAC,EAAE,YAAY,CAAA;CAAO,gHAgBzE"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@react-native-styled-system/core",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.4.0",
|
|
4
4
|
"description": "React Native Styled System",
|
|
5
5
|
"main": "lib/commonjs/index.js",
|
|
6
6
|
"types": "lib/typescript/src/index.d.ts",
|
|
@@ -67,5 +67,5 @@
|
|
|
67
67
|
"**/*.test.*"
|
|
68
68
|
]
|
|
69
69
|
},
|
|
70
|
-
"gitHead": "
|
|
70
|
+
"gitHead": "59dfa9d5ca26a10f24ddfaebc67f29c20282e3b6"
|
|
71
71
|
}
|
|
@@ -2,12 +2,16 @@ import type { ComponentType } from 'react';
|
|
|
2
2
|
import React, { forwardRef } from 'react';
|
|
3
3
|
|
|
4
4
|
import type { SxProps, TextSxProps } from '../@types/SxProps';
|
|
5
|
+
import type { UseSxOptions } from '../hook/useSx';
|
|
5
6
|
import { useSx } from '../hook/useSx';
|
|
6
7
|
|
|
7
|
-
export function createSxComponent<Props extends object, Ref>(
|
|
8
|
+
export function createSxComponent<Props extends object, Ref>(
|
|
9
|
+
Base: ComponentType<Props>,
|
|
10
|
+
{ defaultProps, sxOptions }: { defaultProps?: Props & SxProps; sxOptions?: UseSxOptions } = {},
|
|
11
|
+
) {
|
|
8
12
|
return () => {
|
|
9
13
|
const Transformed = forwardRef<Ref, Props & SxProps>(function (props, ref) {
|
|
10
|
-
const { filteredProps, getStyle } = useSx(props);
|
|
14
|
+
const { filteredProps, getStyle } = useSx({ ...defaultProps, ...props }, sxOptions);
|
|
11
15
|
|
|
12
16
|
return <Base {...(filteredProps as any)} style={getStyle()} ref={ref as any} />;
|
|
13
17
|
});
|
|
@@ -18,10 +22,19 @@ export function createSxComponent<Props extends object, Ref>(Base: ComponentType
|
|
|
18
22
|
};
|
|
19
23
|
}
|
|
20
24
|
|
|
21
|
-
export function createSxTextComponent<Props extends object, Ref>(
|
|
25
|
+
export function createSxTextComponent<Props extends object, Ref>(
|
|
26
|
+
Base: ComponentType<Props>,
|
|
27
|
+
{
|
|
28
|
+
defaultProps,
|
|
29
|
+
sxOptions,
|
|
30
|
+
}: { defaultProps?: Props & TextSxProps; sxOptions?: UseSxOptions } = {},
|
|
31
|
+
) {
|
|
22
32
|
return () => {
|
|
23
33
|
const Transformed = forwardRef<Ref, Props & TextSxProps>(function (props, ref) {
|
|
24
|
-
const { filteredProps, getStyle } = useSx(
|
|
34
|
+
const { filteredProps, getStyle } = useSx(
|
|
35
|
+
{ ...defaultProps, ...props },
|
|
36
|
+
{ styleType: 'TextStyle', ...sxOptions },
|
|
37
|
+
);
|
|
25
38
|
|
|
26
39
|
return <Base {...(filteredProps as any)} style={getStyle()} ref={ref as any} />;
|
|
27
40
|
});
|