@react-native-styled-system/core 1.3.1 → 1.4.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.
- 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 +14 -4
|
@@ -11,12 +11,18 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
|
|
|
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
13
|
function createSxComponent(Base) {
|
|
14
|
-
return (
|
|
14
|
+
return ({
|
|
15
|
+
defaultProps,
|
|
16
|
+
sxOptions
|
|
17
|
+
} = {}) => {
|
|
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
|
|
@@ -27,13 +33,20 @@ function createSxComponent(Base) {
|
|
|
27
33
|
};
|
|
28
34
|
}
|
|
29
35
|
function createSxTextComponent(Base) {
|
|
30
|
-
return (
|
|
36
|
+
return ({
|
|
37
|
+
defaultProps,
|
|
38
|
+
sxOptions
|
|
39
|
+
} = {}) => {
|
|
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":[]}
|
|
@@ -2,12 +2,18 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function
|
|
|
2
2
|
import React, { forwardRef } from 'react';
|
|
3
3
|
import { useSx } from '../hook/useSx';
|
|
4
4
|
export function createSxComponent(Base) {
|
|
5
|
-
return (
|
|
5
|
+
return ({
|
|
6
|
+
defaultProps,
|
|
7
|
+
sxOptions
|
|
8
|
+
} = {}) => {
|
|
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
|
|
@@ -18,13 +24,20 @@ export function createSxComponent(Base) {
|
|
|
18
24
|
};
|
|
19
25
|
}
|
|
20
26
|
export function createSxTextComponent(Base) {
|
|
21
|
-
return (
|
|
27
|
+
return ({
|
|
28
|
+
defaultProps,
|
|
29
|
+
sxOptions
|
|
30
|
+
} = {}) => {
|
|
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,CAA4BC,IAA0B,EAAE;EACvF,OAAO,CAAC;IACNC,YAAY;IACZC;EAC4D,CAAC,GAAG,CAAC,CAAC,KAAK;IACvE,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,CAA4Bb,IAA0B,EAAE;EAC3F,OAAO,CAAC;IACNC,YAAY;IACZC;EACgE,CAAC,GAAG,CAAC,CAAC,KAAK;IAC3E,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) | undefined;
|
|
7
|
+
sxOptions?: UseSxOptions | undefined;
|
|
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) | undefined;
|
|
11
|
+
sxOptions?: UseSxOptions | undefined;
|
|
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,EAAE,IAAI,EAAE,aAAa,CAAC,KAAK,CAAC;;;yGAetF;AAED,wBAAgB,qBAAqB,CAAC,KAAK,SAAS,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,aAAa,CAAC,KAAK,CAAC;;;6GAkB1F"}
|
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.1",
|
|
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": "1de6e96c0801bbe1658bf3a0d1d8d7a208c706d8"
|
|
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
8
|
export function createSxComponent<Props extends object, Ref>(Base: ComponentType<Props>) {
|
|
8
|
-
return (
|
|
9
|
+
return ({
|
|
10
|
+
defaultProps,
|
|
11
|
+
sxOptions,
|
|
12
|
+
}: { defaultProps?: Props & SxProps; sxOptions?: UseSxOptions } = {}) => {
|
|
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
|
});
|
|
@@ -19,9 +23,15 @@ export function createSxComponent<Props extends object, Ref>(Base: ComponentType
|
|
|
19
23
|
}
|
|
20
24
|
|
|
21
25
|
export function createSxTextComponent<Props extends object, Ref>(Base: ComponentType<Props>) {
|
|
22
|
-
return (
|
|
26
|
+
return ({
|
|
27
|
+
defaultProps,
|
|
28
|
+
sxOptions,
|
|
29
|
+
}: { defaultProps?: Props & TextSxProps; sxOptions?: UseSxOptions } = {}) => {
|
|
23
30
|
const Transformed = forwardRef<Ref, Props & TextSxProps>(function (props, ref) {
|
|
24
|
-
const { filteredProps, getStyle } = useSx(
|
|
31
|
+
const { filteredProps, getStyle } = useSx(
|
|
32
|
+
{ ...defaultProps, ...props },
|
|
33
|
+
{ styleType: 'TextStyle', ...sxOptions },
|
|
34
|
+
);
|
|
25
35
|
|
|
26
36
|
return <Base {...(filteredProps as any)} style={getStyle()} ref={ref as any} />;
|
|
27
37
|
});
|