react-native-unistyles 1.1.2 → 1.1.3
Sign up to get free protection for your applications and to get access to all the features.
- package/lib/commonjs/UnistylesTheme.js +6 -1
- package/lib/commonjs/UnistylesTheme.js.map +1 -1
- package/lib/commonjs/hooks/useDimensions.web.js +2 -3
- package/lib/commonjs/hooks/useDimensions.web.js.map +1 -1
- package/lib/module/UnistylesTheme.js +7 -2
- package/lib/module/UnistylesTheme.js.map +1 -1
- package/lib/module/hooks/useDimensions.web.js +2 -3
- package/lib/module/hooks/useDimensions.web.js.map +1 -1
- package/lib/typescript/src/UnistylesTheme.d.ts.map +1 -1
- package/lib/typescript/src/hooks/useDimensions.web.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/UnistylesTheme.tsx +15 -6
- package/src/hooks/useDimensions.web.ts +3 -8
@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
});
|
6
6
|
exports.UnistylesTheme = exports.UnistylesContext = void 0;
|
7
7
|
var _react = _interopRequireWildcard(require("react"));
|
8
|
+
var _utils = require("./utils");
|
8
9
|
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); }
|
9
10
|
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 && Object.prototype.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; }
|
10
11
|
const UnistylesContext = exports.UnistylesContext = /*#__PURE__*/(0, _react.createContext)({});
|
@@ -13,9 +14,13 @@ const UnistylesTheme = _ref => {
|
|
13
14
|
theme,
|
14
15
|
children
|
15
16
|
} = _ref;
|
17
|
+
const [isClient, setIsClient] = (0, _react.useState)(!_utils.isServer);
|
18
|
+
(0, _react.useEffect)(() => {
|
19
|
+
setIsClient(true);
|
20
|
+
}, []);
|
16
21
|
return /*#__PURE__*/_react.default.createElement(UnistylesContext.Provider, {
|
17
22
|
value: theme
|
18
|
-
}, children);
|
23
|
+
}, isClient ? children : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null));
|
19
24
|
};
|
20
25
|
exports.UnistylesTheme = UnistylesTheme;
|
21
26
|
//# sourceMappingURL=UnistylesTheme.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireWildcard","require","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","UnistylesContext","exports","createContext","UnistylesTheme","_ref","theme","children","createElement","Provider","value"],"sourceRoot":"../../src","sources":["UnistylesTheme.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_utils","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","UnistylesContext","exports","createContext","UnistylesTheme","_ref","theme","children","isClient","setIsClient","useState","isServer","useEffect","createElement","Provider","value","Fragment"],"sourceRoot":"../../src","sources":["UnistylesTheme.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AAEA,IAAAC,MAAA,GAAAD,OAAA;AAAkC,SAAAE,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAJ,wBAAAI,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAjB,CAAA,EAAAc,CAAA,SAAAI,CAAA,GAAAR,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAI,CAAA,KAAAA,CAAA,CAAAX,GAAA,IAAAW,CAAA,CAAAC,GAAA,IAAAR,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAI,CAAA,IAAAV,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAgB,GAAA,CAAAnB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAM3B,MAAMY,gBAAgB,GAAAC,OAAA,CAAAD,gBAAA,gBAAG,IAAAE,oBAAa,EAAC,CAAC,CAAC,CAAC;AAE1C,MAAMC,cAA4D,GAAGC,IAAA,IAGtE;EAAA,IAHuE;IACzEC,KAAK;IACLC;EACJ,CAAC,GAAAF,IAAA;EACG,MAAM,CAACG,QAAQ,EAAEC,WAAW,CAAC,GAAG,IAAAC,eAAQ,EAAC,CAACC,eAAQ,CAAC;EAEnD,IAAAC,gBAAS,EAAC,MAAM;IACZH,WAAW,CAAC,IAAI,CAAC;EACrB,CAAC,EAAE,EAAE,CAAC;EAEN,oBACIjC,MAAA,CAAAU,OAAA,CAAA2B,aAAA,CAACZ,gBAAgB,CAACa,QAAQ;IAACC,KAAK,EAAET;EAAM,GACnCE,QAAQ,GAAGD,QAAQ,gBAAG/B,MAAA,CAAAU,OAAA,CAAA2B,aAAA,CAACrC,MAAA,CAAAU,OAAK,CAAC8B,QAAQ,MAAE,CACjB,CAAC;AAEpC,CAAC;AAAAd,OAAA,CAAAE,cAAA,GAAAA,cAAA"}
|
@@ -5,12 +5,11 @@ Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
});
|
6
6
|
exports.useDimensions = void 0;
|
7
7
|
var _react = require("react");
|
8
|
-
var _utils = require("../utils");
|
9
8
|
const useDimensions = () => {
|
10
9
|
const timerRef = (0, _react.useRef)();
|
11
10
|
const [screenSize, setScreenSize] = (0, _react.useState)({
|
12
|
-
width:
|
13
|
-
height:
|
11
|
+
width: window.innerWidth,
|
12
|
+
height: window.innerHeight
|
14
13
|
});
|
15
14
|
(0, _react.useEffect)(() => {
|
16
15
|
const handleResize = () => {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["_react","require","
|
1
|
+
{"version":3,"names":["_react","require","useDimensions","timerRef","useRef","screenSize","setScreenSize","useState","width","window","innerWidth","height","innerHeight","useEffect","handleResize","clearTimeout","current","setTimeout","addEventListener","removeEventListener","exports"],"sourceRoot":"../../../src","sources":["hooks/useDimensions.web.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAGO,MAAMC,aAAa,GAAGA,CAAA,KAAkB;EAC3C,MAAMC,QAAQ,GAAG,IAAAC,aAAM,EAAgC,CAAC;EACxD,MAAM,CAACC,UAAU,EAAEC,aAAa,CAAC,GAAG,IAAAC,eAAQ,EAAa;IACrDC,KAAK,EAAEC,MAAM,CAACC,UAAU;IACxBC,MAAM,EAAEF,MAAM,CAACG;EACnB,CAAC,CAAC;EAEF,IAAAC,gBAAS,EAAC,MAAM;IACZ,MAAMC,YAAY,GAAGA,CAAA,KAAM;MACvBC,YAAY,CAACZ,QAAQ,CAACa,OAAO,CAAC;MAE9Bb,QAAQ,CAACa,OAAO,GAAGC,UAAU,CAAC,MAAMX,aAAa,CAAC;QAC9CE,KAAK,EAAEC,MAAM,CAACC,UAAU;QACxBC,MAAM,EAAEF,MAAM,CAACG;MACnB,CAAC,CAAC,EAAE,GAAG,CAAC;IACZ,CAAC;IAEDH,MAAM,CAACS,gBAAgB,CAAC,QAAQ,EAAEJ,YAAY,CAAC;IAE/C,OAAO,MAAM;MACTL,MAAM,CAACU,mBAAmB,CAAC,QAAQ,EAAEL,YAAY,CAAC;MAClDC,YAAY,CAACZ,QAAQ,CAACa,OAAO,CAAC;IAClC,CAAC;EACL,CAAC,EAAE,EAAE,CAAC;EAEN,OAAOX,UAAU;AACrB,CAAC;AAAAe,OAAA,CAAAlB,aAAA,GAAAA,aAAA"}
|
@@ -1,12 +1,17 @@
|
|
1
|
-
import React, { createContext } from 'react';
|
1
|
+
import React, { createContext, useEffect, useState } from 'react';
|
2
|
+
import { isServer } from './utils';
|
2
3
|
export const UnistylesContext = /*#__PURE__*/createContext({});
|
3
4
|
export const UnistylesTheme = _ref => {
|
4
5
|
let {
|
5
6
|
theme,
|
6
7
|
children
|
7
8
|
} = _ref;
|
9
|
+
const [isClient, setIsClient] = useState(!isServer);
|
10
|
+
useEffect(() => {
|
11
|
+
setIsClient(true);
|
12
|
+
}, []);
|
8
13
|
return /*#__PURE__*/React.createElement(UnistylesContext.Provider, {
|
9
14
|
value: theme
|
10
|
-
}, children);
|
15
|
+
}, isClient ? children : /*#__PURE__*/React.createElement(React.Fragment, null));
|
11
16
|
};
|
12
17
|
//# sourceMappingURL=UnistylesTheme.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["React","createContext","UnistylesContext","UnistylesTheme","_ref","theme","children","createElement","Provider","value"],"sourceRoot":"../../src","sources":["UnistylesTheme.tsx"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,aAAa,QAAQ,OAAO;
|
1
|
+
{"version":3,"names":["React","createContext","useEffect","useState","isServer","UnistylesContext","UnistylesTheme","_ref","theme","children","isClient","setIsClient","createElement","Provider","value","Fragment"],"sourceRoot":"../../src","sources":["UnistylesTheme.tsx"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,aAAa,EAAEC,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAEjE,SAASC,QAAQ,QAAQ,SAAS;AAMlC,OAAO,MAAMC,gBAAgB,gBAAGJ,aAAa,CAAC,CAAC,CAAC,CAAC;AAEjD,OAAO,MAAMK,cAA4D,GAAGC,IAAA,IAGtE;EAAA,IAHuE;IACzEC,KAAK;IACLC;EACJ,CAAC,GAAAF,IAAA;EACG,MAAM,CAACG,QAAQ,EAAEC,WAAW,CAAC,GAAGR,QAAQ,CAAC,CAACC,QAAQ,CAAC;EAEnDF,SAAS,CAAC,MAAM;IACZS,WAAW,CAAC,IAAI,CAAC;EACrB,CAAC,EAAE,EAAE,CAAC;EAEN,oBACIX,KAAA,CAAAY,aAAA,CAACP,gBAAgB,CAACQ,QAAQ;IAACC,KAAK,EAAEN;EAAM,GACnCE,QAAQ,GAAGD,QAAQ,gBAAGT,KAAA,CAAAY,aAAA,CAACZ,KAAK,CAACe,QAAQ,MAAE,CACjB,CAAC;AAEpC,CAAC"}
|
@@ -1,10 +1,9 @@
|
|
1
1
|
import { useEffect, useRef, useState } from 'react';
|
2
|
-
import { isServer } from '../utils';
|
3
2
|
export const useDimensions = () => {
|
4
3
|
const timerRef = useRef();
|
5
4
|
const [screenSize, setScreenSize] = useState({
|
6
|
-
width:
|
7
|
-
height:
|
5
|
+
width: window.innerWidth,
|
6
|
+
height: window.innerHeight
|
8
7
|
});
|
9
8
|
useEffect(() => {
|
10
9
|
const handleResize = () => {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["useEffect","useRef","useState","
|
1
|
+
{"version":3,"names":["useEffect","useRef","useState","useDimensions","timerRef","screenSize","setScreenSize","width","window","innerWidth","height","innerHeight","handleResize","clearTimeout","current","setTimeout","addEventListener","removeEventListener"],"sourceRoot":"../../../src","sources":["hooks/useDimensions.web.ts"],"mappings":"AAAA,SAASA,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AAGnD,OAAO,MAAMC,aAAa,GAAGA,CAAA,KAAkB;EAC3C,MAAMC,QAAQ,GAAGH,MAAM,CAAgC,CAAC;EACxD,MAAM,CAACI,UAAU,EAAEC,aAAa,CAAC,GAAGJ,QAAQ,CAAa;IACrDK,KAAK,EAAEC,MAAM,CAACC,UAAU;IACxBC,MAAM,EAAEF,MAAM,CAACG;EACnB,CAAC,CAAC;EAEFX,SAAS,CAAC,MAAM;IACZ,MAAMY,YAAY,GAAGA,CAAA,KAAM;MACvBC,YAAY,CAACT,QAAQ,CAACU,OAAO,CAAC;MAE9BV,QAAQ,CAACU,OAAO,GAAGC,UAAU,CAAC,MAAMT,aAAa,CAAC;QAC9CC,KAAK,EAAEC,MAAM,CAACC,UAAU;QACxBC,MAAM,EAAEF,MAAM,CAACG;MACnB,CAAC,CAAC,EAAE,GAAG,CAAC;IACZ,CAAC;IAEDH,MAAM,CAACQ,gBAAgB,CAAC,QAAQ,EAAEJ,YAAY,CAAC;IAE/C,OAAO,MAAM;MACTJ,MAAM,CAACS,mBAAmB,CAAC,QAAQ,EAAEL,YAAY,CAAC;MAClDC,YAAY,CAACT,QAAQ,CAACU,OAAO,CAAC;IAClC,CAAC;EACL,CAAC,EAAE,EAAE,CAAC;EAEN,OAAOT,UAAU;AACrB,CAAC"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"UnistylesTheme.d.ts","sourceRoot":"","sources":["../../../src/UnistylesTheme.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
1
|
+
{"version":3,"file":"UnistylesTheme.d.ts","sourceRoot":"","sources":["../../../src/UnistylesTheme.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6C,MAAM,OAAO,CAAA;AACjE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAG9C,UAAU,mBAAoB,SAAQ,iBAAiB;IACnD,KAAK,EAAE,GAAG,CAAA;CACb;AAED,eAAO,MAAM,gBAAgB,mBAAoB,CAAA;AAEjD,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,iBAAiB,CAAC,mBAAmB,CAevE,CAAA"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"useDimensions.web.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useDimensions.web.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;
|
1
|
+
{"version":3,"file":"useDimensions.web.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useDimensions.web.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAE1C,eAAO,MAAM,aAAa,QAAO,UA0BhC,CAAA"}
|
package/package.json
CHANGED
package/src/UnistylesTheme.tsx
CHANGED
@@ -1,5 +1,6 @@
|
|
1
|
-
import React, { createContext } from 'react'
|
1
|
+
import React, { createContext, useEffect, useState } from 'react'
|
2
2
|
import type { PropsWithChildren } from 'react'
|
3
|
+
import { isServer } from './utils'
|
3
4
|
|
4
5
|
interface UnistylesThemeProps extends PropsWithChildren {
|
5
6
|
theme: any
|
@@ -10,8 +11,16 @@ export const UnistylesContext = createContext({})
|
|
10
11
|
export const UnistylesTheme: React.FunctionComponent<UnistylesThemeProps> = ({
|
11
12
|
theme,
|
12
13
|
children
|
13
|
-
}) =>
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
)
|
14
|
+
}) => {
|
15
|
+
const [isClient, setIsClient] = useState(!isServer)
|
16
|
+
|
17
|
+
useEffect(() => {
|
18
|
+
setIsClient(true)
|
19
|
+
}, [])
|
20
|
+
|
21
|
+
return (
|
22
|
+
<UnistylesContext.Provider value={theme}>
|
23
|
+
{isClient ? children : <React.Fragment /> }
|
24
|
+
</UnistylesContext.Provider>
|
25
|
+
)
|
26
|
+
}
|
@@ -1,17 +1,12 @@
|
|
1
1
|
import { useEffect, useRef, useState } from 'react'
|
2
2
|
import type { ScreenSize } from '../types'
|
3
|
-
import { isServer } from '../utils'
|
4
3
|
|
5
4
|
export const useDimensions = (): ScreenSize => {
|
6
5
|
const timerRef = useRef<ReturnType<typeof setTimeout>>()
|
7
6
|
const [screenSize, setScreenSize] = useState<ScreenSize>({
|
8
|
-
width:
|
9
|
-
|
10
|
-
|
11
|
-
height: isServer
|
12
|
-
? undefined
|
13
|
-
: window.innerHeight
|
14
|
-
} as ScreenSize)
|
7
|
+
width: window.innerWidth,
|
8
|
+
height: window.innerHeight
|
9
|
+
})
|
15
10
|
|
16
11
|
useEffect(() => {
|
17
12
|
const handleResize = () => {
|