@vxrn/safe-area 1.14.4 → 1.15.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/.turbo/turbo-build.log +1 -1
- package/dist/cjs/InitialWindow.cjs +14 -12
- package/dist/cjs/InitialWindow.native.js +14 -12
- package/dist/cjs/InitialWindow.native.js.map +1 -1
- package/dist/cjs/NativeSafeAreaProvider.cjs +98 -61
- package/dist/cjs/NativeSafeAreaProvider.native.js +115 -79
- package/dist/cjs/NativeSafeAreaProvider.native.js.map +1 -1
- package/dist/cjs/SafeArea-types.cjs +7 -5
- package/dist/cjs/SafeArea-types.native.js +7 -5
- package/dist/cjs/SafeArea-types.native.js.map +1 -1
- package/dist/cjs/SafeAreaContext.cjs +82 -55
- package/dist/cjs/SafeAreaContext.native.js +88 -70
- package/dist/cjs/SafeAreaContext.native.js.map +1 -1
- package/dist/cjs/SafeAreaView.cjs +94 -92
- package/dist/cjs/SafeAreaView.native.js +97 -95
- package/dist/cjs/SafeAreaView.native.js.map +1 -1
- package/dist/cjs/index.cjs +7 -5
- package/dist/cjs/index.native.js +7 -5
- package/dist/cjs/index.native.js.map +1 -1
- package/dist/esm/InitialWindow.mjs +2 -2
- package/dist/esm/InitialWindow.mjs.map +1 -1
- package/dist/esm/InitialWindow.native.js +2 -2
- package/dist/esm/InitialWindow.native.js.map +1 -1
- package/dist/esm/NativeSafeAreaProvider.mjs +71 -36
- package/dist/esm/NativeSafeAreaProvider.mjs.map +1 -1
- package/dist/esm/NativeSafeAreaProvider.native.js +81 -47
- package/dist/esm/NativeSafeAreaProvider.native.js.map +1 -1
- package/dist/esm/SafeAreaContext.mjs +54 -29
- package/dist/esm/SafeAreaContext.mjs.map +1 -1
- package/dist/esm/SafeAreaContext.native.js +60 -44
- package/dist/esm/SafeAreaContext.native.js.map +1 -1
- package/dist/esm/SafeAreaView.mjs +65 -65
- package/dist/esm/SafeAreaView.mjs.map +1 -1
- package/dist/esm/SafeAreaView.native.js +69 -69
- package/dist/esm/SafeAreaView.native.js.map +1 -1
- package/package.json +2 -2
- package/src/SafeAreaContext.tsx +8 -2
- package/types/SafeAreaContext.d.ts.map +1 -1
|
@@ -14,44 +14,52 @@ function NativeSafeAreaProvider(param) {
|
|
|
14
14
|
style,
|
|
15
15
|
onInsetsChange
|
|
16
16
|
} = param;
|
|
17
|
-
|
|
18
|
-
if (
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
x: 0,
|
|
36
|
-
y: 0,
|
|
37
|
-
width: document.documentElement.offsetWidth,
|
|
38
|
-
height: document.documentElement.offsetHeight
|
|
39
|
-
};
|
|
40
|
-
onInsetsChange({
|
|
41
|
-
nativeEvent: {
|
|
42
|
-
insets,
|
|
43
|
-
frame
|
|
44
|
-
}
|
|
45
|
-
});
|
|
17
|
+
React.useEffect(function () {
|
|
18
|
+
if (typeof document === "undefined") {
|
|
19
|
+
return;
|
|
20
|
+
}
|
|
21
|
+
var element = createContextElement();
|
|
22
|
+
document.body.appendChild(element);
|
|
23
|
+
var onEnd = function () {
|
|
24
|
+
var {
|
|
25
|
+
paddingTop,
|
|
26
|
+
paddingBottom,
|
|
27
|
+
paddingLeft,
|
|
28
|
+
paddingRight
|
|
29
|
+
} = window.getComputedStyle(element);
|
|
30
|
+
var insets = {
|
|
31
|
+
top: paddingTop ? Number.parseInt(paddingTop, 10) : 0,
|
|
32
|
+
bottom: paddingBottom ? Number.parseInt(paddingBottom, 10) : 0,
|
|
33
|
+
left: paddingLeft ? Number.parseInt(paddingLeft, 10) : 0,
|
|
34
|
+
right: paddingRight ? Number.parseInt(paddingRight, 10) : 0
|
|
46
35
|
};
|
|
47
|
-
|
|
48
|
-
|
|
36
|
+
var frame = {
|
|
37
|
+
x: 0,
|
|
38
|
+
y: 0,
|
|
39
|
+
width: document.documentElement.offsetWidth,
|
|
40
|
+
height: document.documentElement.offsetHeight
|
|
49
41
|
};
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
42
|
+
onInsetsChange({
|
|
43
|
+
nativeEvent: {
|
|
44
|
+
insets,
|
|
45
|
+
frame
|
|
46
|
+
}
|
|
47
|
+
});
|
|
48
|
+
};
|
|
49
|
+
element.addEventListener(getSupportedTransitionEvent(), onEnd);
|
|
50
|
+
onEnd();
|
|
51
|
+
return function () {
|
|
52
|
+
document.body.removeChild(element);
|
|
53
|
+
element.removeEventListener(getSupportedTransitionEvent(), onEnd);
|
|
54
|
+
};
|
|
55
|
+
}, [onInsetsChange]);
|
|
56
|
+
if (style) {
|
|
57
|
+
return /* @__PURE__ */_jsx(View, {
|
|
58
|
+
style,
|
|
59
|
+
children
|
|
60
|
+
});
|
|
61
|
+
}
|
|
62
|
+
return /* @__PURE__ */_jsx("div", {
|
|
55
63
|
style: {
|
|
56
64
|
display: "contents"
|
|
57
65
|
},
|
|
@@ -60,32 +68,58 @@ function NativeSafeAreaProvider(param) {
|
|
|
60
68
|
}
|
|
61
69
|
var _supportedTransitionEvent = null;
|
|
62
70
|
function getSupportedTransitionEvent() {
|
|
63
|
-
if (_supportedTransitionEvent != null)
|
|
71
|
+
if (_supportedTransitionEvent != null) {
|
|
72
|
+
return _supportedTransitionEvent;
|
|
73
|
+
}
|
|
64
74
|
var element = document.createElement("invalidtype");
|
|
65
75
|
_supportedTransitionEvent = CSSTransitions.Transition;
|
|
66
|
-
for (var key in CSSTransitions)
|
|
67
|
-
|
|
68
|
-
|
|
76
|
+
for (var key in CSSTransitions) {
|
|
77
|
+
if (element.style[key] !== void 0) {
|
|
78
|
+
_supportedTransitionEvent = CSSTransitions[key];
|
|
79
|
+
break;
|
|
80
|
+
}
|
|
69
81
|
}
|
|
70
82
|
return _supportedTransitionEvent;
|
|
71
83
|
}
|
|
72
84
|
var _supportedEnv = null;
|
|
73
85
|
function getSupportedEnv() {
|
|
74
|
-
if (_supportedEnv !== null)
|
|
86
|
+
if (_supportedEnv !== null) {
|
|
87
|
+
return _supportedEnv;
|
|
88
|
+
}
|
|
75
89
|
var {
|
|
76
90
|
CSS
|
|
77
91
|
} = window;
|
|
78
|
-
|
|
92
|
+
if (CSS && CSS.supports && CSS.supports("top: constant(safe-area-inset-top)")) {
|
|
93
|
+
_supportedEnv = "constant";
|
|
94
|
+
} else {
|
|
95
|
+
_supportedEnv = "env";
|
|
96
|
+
}
|
|
97
|
+
return _supportedEnv;
|
|
79
98
|
}
|
|
80
99
|
function getInset(side) {
|
|
81
100
|
return `${getSupportedEnv()}(safe-area-inset-${side})`;
|
|
82
101
|
}
|
|
83
102
|
function createContextElement() {
|
|
84
|
-
var element = document.createElement("div")
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
103
|
+
var element = document.createElement("div");
|
|
104
|
+
var {
|
|
105
|
+
style
|
|
106
|
+
} = element;
|
|
107
|
+
style.position = "fixed";
|
|
108
|
+
style.left = "0";
|
|
109
|
+
style.top = "0";
|
|
110
|
+
style.width = "0";
|
|
111
|
+
style.height = "0";
|
|
112
|
+
style.zIndex = "-1";
|
|
113
|
+
style.overflow = "hidden";
|
|
114
|
+
style.visibility = "hidden";
|
|
115
|
+
style.transitionDuration = "0.05s";
|
|
116
|
+
style.transitionProperty = "padding";
|
|
117
|
+
style.transitionDelay = "0s";
|
|
118
|
+
style.paddingTop = getInset("top");
|
|
119
|
+
style.paddingBottom = getInset("bottom");
|
|
120
|
+
style.paddingLeft = getInset("left");
|
|
121
|
+
style.paddingRight = getInset("right");
|
|
122
|
+
return element;
|
|
89
123
|
}
|
|
90
124
|
export { NativeSafeAreaProvider };
|
|
91
125
|
//# sourceMappingURL=NativeSafeAreaProvider.native.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["jsx","_jsx","React","View","CSSTransitions","WebkitTransition","Transition","MozTransition","MSTransition","OTransition","NativeSafeAreaProvider","param","children","style","onInsetsChange","useEffect","document","element","createContextElement","body","appendChild","onEnd","paddingTop","paddingBottom","paddingLeft","paddingRight","window","getComputedStyle","insets","top","Number","parseInt","bottom","left","right","frame","x","y","width","documentElement","offsetWidth","height","offsetHeight","nativeEvent","addEventListener","getSupportedTransitionEvent","removeChild","removeEventListener","display","_supportedTransitionEvent","createElement","key","_supportedEnv","getSupportedEnv"],"sources":["../../src/NativeSafeAreaProvider.tsx"],"sourcesContent":[null],"mappings":"AAEA,SAAAA,GAAY,IAAAC,IAAA,QAAW;AACvB,YAASC,KAAA,MAAY;AA+DV,SAAAC,IAAA;AApDX,IAAAC,cAAM;EACJC,gBAAA,EAAkB;EAClBC,UAAA,EAAY;EACZC,aAAA,EAAe;EACfC,YAAA,EAAc;EACdC,WAAA,EAAa;AACf;AAEO,SAASC,uBAAuBC,KAAA;EACrC;IAAAC,QAAA;IAAAC,KAAA;IAAAC;EAAA,IAAAH,KAAA;
|
|
1
|
+
{"version":3,"names":["jsx","_jsx","React","View","CSSTransitions","WebkitTransition","Transition","MozTransition","MSTransition","OTransition","NativeSafeAreaProvider","param","children","style","onInsetsChange","useEffect","document","element","createContextElement","body","appendChild","onEnd","paddingTop","paddingBottom","paddingLeft","paddingRight","window","getComputedStyle","insets","top","Number","parseInt","bottom","left","right","frame","x","y","width","documentElement","offsetWidth","height","offsetHeight","nativeEvent","addEventListener","getSupportedTransitionEvent","removeChild","removeEventListener","display","_supportedTransitionEvent","createElement","key","_supportedEnv","getSupportedEnv","CSS","supports","getInset","side","position"],"sources":["../../src/NativeSafeAreaProvider.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
|
|
@@ -2,40 +2,61 @@ import * as React from "react";
|
|
|
2
2
|
import { Dimensions } from "react-native-web";
|
|
3
3
|
import { NativeSafeAreaProvider } from "./NativeSafeAreaProvider.mjs";
|
|
4
4
|
import { jsx } from "react/jsx-runtime";
|
|
5
|
-
const isDev = process.env.NODE_ENV !== "production"
|
|
6
|
-
|
|
7
|
-
|
|
5
|
+
const isDev = process.env.NODE_ENV !== "production";
|
|
6
|
+
const SafeAreaInsetsContext = React.createContext(null);
|
|
7
|
+
if (isDev) {
|
|
8
|
+
SafeAreaInsetsContext.displayName = "SafeAreaInsetsContext";
|
|
9
|
+
}
|
|
8
10
|
const SafeAreaFrameContext = React.createContext(null);
|
|
9
|
-
|
|
11
|
+
if (isDev) {
|
|
12
|
+
SafeAreaFrameContext.displayName = "SafeAreaFrameContext";
|
|
13
|
+
}
|
|
14
|
+
const ZERO_INSETS = {
|
|
15
|
+
top: 0,
|
|
16
|
+
bottom: 0,
|
|
17
|
+
left: 0,
|
|
18
|
+
right: 0
|
|
19
|
+
};
|
|
10
20
|
function SafeAreaProvider({
|
|
11
21
|
children,
|
|
12
22
|
initialMetrics,
|
|
13
23
|
initialSafeAreaInsets,
|
|
14
24
|
...others
|
|
15
25
|
}) {
|
|
16
|
-
const parentInsets = useParentSafeAreaInsets()
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
26
|
+
const parentInsets = useParentSafeAreaInsets();
|
|
27
|
+
const parentFrame = useParentSafeAreaFrame();
|
|
28
|
+
const [insets, setInsets] = React.useState(initialMetrics?.insets ?? initialSafeAreaInsets ?? parentInsets ?? ZERO_INSETS);
|
|
29
|
+
const [frame, setFrame] = React.useState(initialMetrics?.frame ?? parentFrame ?? {
|
|
30
|
+
// Backwards compat so we render anyway if we don't have frame.
|
|
31
|
+
x: 0,
|
|
32
|
+
y: 0,
|
|
33
|
+
width: Dimensions.get("window").width,
|
|
34
|
+
height: Dimensions.get("window").height
|
|
35
|
+
});
|
|
36
|
+
const onInsetsChange = React.useCallback(event => {
|
|
37
|
+
const {
|
|
38
|
+
nativeEvent: {
|
|
39
|
+
frame: nextFrame,
|
|
40
|
+
insets: nextInsets
|
|
41
|
+
}
|
|
42
|
+
} = event;
|
|
43
|
+
React.startTransition(() => {
|
|
44
|
+
setFrame(curFrame => {
|
|
45
|
+
if (
|
|
35
46
|
// Backwards compat with old native code that won't send frame.
|
|
36
|
-
nextFrame && (nextFrame.height !== curFrame.height || nextFrame.width !== curFrame.width || nextFrame.x !== curFrame.x || nextFrame.y !== curFrame.y)
|
|
47
|
+
nextFrame && (nextFrame.height !== curFrame.height || nextFrame.width !== curFrame.width || nextFrame.x !== curFrame.x || nextFrame.y !== curFrame.y)) {
|
|
48
|
+
return nextFrame;
|
|
49
|
+
}
|
|
50
|
+
return curFrame;
|
|
51
|
+
});
|
|
52
|
+
setInsets(curInsets => {
|
|
53
|
+
if (!curInsets || nextInsets.bottom !== curInsets.bottom || nextInsets.left !== curInsets.left || nextInsets.right !== curInsets.right || nextInsets.top !== curInsets.top) {
|
|
54
|
+
return nextInsets;
|
|
55
|
+
}
|
|
56
|
+
return curInsets;
|
|
37
57
|
});
|
|
38
|
-
}
|
|
58
|
+
});
|
|
59
|
+
}, []);
|
|
39
60
|
return /* @__PURE__ */jsx(NativeSafeAreaProvider, {
|
|
40
61
|
onInsetsChange,
|
|
41
62
|
...others,
|
|
@@ -57,12 +78,16 @@ function useParentSafeAreaFrame() {
|
|
|
57
78
|
const NO_INSETS_ERROR = "No safe area value available. Make sure you are rendering `<SafeAreaProvider>` at the top of your app.";
|
|
58
79
|
function useSafeAreaInsets() {
|
|
59
80
|
const insets = React.useContext(SafeAreaInsetsContext);
|
|
60
|
-
if (insets == null)
|
|
81
|
+
if (insets == null) {
|
|
82
|
+
throw new Error(NO_INSETS_ERROR);
|
|
83
|
+
}
|
|
61
84
|
return insets;
|
|
62
85
|
}
|
|
63
86
|
function useSafeAreaFrame() {
|
|
64
87
|
const frame = React.useContext(SafeAreaFrameContext);
|
|
65
|
-
if (frame == null)
|
|
88
|
+
if (frame == null) {
|
|
89
|
+
throw new Error(NO_INSETS_ERROR);
|
|
90
|
+
}
|
|
66
91
|
return frame;
|
|
67
92
|
}
|
|
68
93
|
function withSafeAreaInsets(WrappedComponent) {
|
|
@@ -78,7 +103,7 @@ function withSafeAreaInsets(WrappedComponent) {
|
|
|
78
103
|
function useSafeArea() {
|
|
79
104
|
return useSafeAreaInsets();
|
|
80
105
|
}
|
|
81
|
-
const SafeAreaConsumer = SafeAreaInsetsContext.Consumer
|
|
82
|
-
|
|
106
|
+
const SafeAreaConsumer = SafeAreaInsetsContext.Consumer;
|
|
107
|
+
const SafeAreaContext = SafeAreaInsetsContext;
|
|
83
108
|
export { SafeAreaConsumer, SafeAreaContext, SafeAreaFrameContext, SafeAreaInsetsContext, SafeAreaProvider, useSafeArea, useSafeAreaFrame, useSafeAreaInsets, withSafeAreaInsets };
|
|
84
109
|
//# sourceMappingURL=SafeAreaContext.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","Dimensions","NativeSafeAreaProvider","jsx","isDev","process","env","NODE_ENV","SafeAreaInsetsContext","createContext","displayName","SafeAreaFrameContext","SafeAreaProvider","children","initialMetrics","initialSafeAreaInsets","others","parentInsets","useParentSafeAreaInsets","parentFrame","useParentSafeAreaFrame","insets","setInsets","useState","frame","setFrame","x","y","width","get","height","onInsetsChange","useCallback","event","nativeEvent","nextFrame","nextInsets","startTransition","curFrame","curInsets","
|
|
1
|
+
{"version":3,"names":["React","Dimensions","NativeSafeAreaProvider","jsx","isDev","process","env","NODE_ENV","SafeAreaInsetsContext","createContext","displayName","SafeAreaFrameContext","ZERO_INSETS","top","bottom","left","right","SafeAreaProvider","children","initialMetrics","initialSafeAreaInsets","others","parentInsets","useParentSafeAreaInsets","parentFrame","useParentSafeAreaFrame","insets","setInsets","useState","frame","setFrame","x","y","width","get","height","onInsetsChange","useCallback","event","nativeEvent","nextFrame","nextInsets","startTransition","curFrame","curInsets","Provider","value","useContext","NO_INSETS_ERROR","useSafeAreaInsets","Error","useSafeAreaFrame","withSafeAreaInsets","WrappedComponent","forwardRef","props","ref","useSafeArea","SafeAreaConsumer","Consumer","SafeAreaContext"],"sources":["../../src/SafeAreaContext.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
|
|
@@ -2,51 +2,63 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import * as React from "react";
|
|
3
3
|
import { Dimensions } from "react-native";
|
|
4
4
|
import { NativeSafeAreaProvider } from "./NativeSafeAreaProvider.native.js";
|
|
5
|
-
var isDev = process.env.NODE_ENV !== "production"
|
|
6
|
-
|
|
7
|
-
|
|
5
|
+
var isDev = process.env.NODE_ENV !== "production";
|
|
6
|
+
var SafeAreaInsetsContext = /* @__PURE__ */React.createContext(null);
|
|
7
|
+
if (isDev) {
|
|
8
|
+
SafeAreaInsetsContext.displayName = "SafeAreaInsetsContext";
|
|
9
|
+
}
|
|
8
10
|
var SafeAreaFrameContext = /* @__PURE__ */React.createContext(null);
|
|
9
|
-
|
|
11
|
+
if (isDev) {
|
|
12
|
+
SafeAreaFrameContext.displayName = "SafeAreaFrameContext";
|
|
13
|
+
}
|
|
14
|
+
var ZERO_INSETS = {
|
|
15
|
+
top: 0,
|
|
16
|
+
bottom: 0,
|
|
17
|
+
left: 0,
|
|
18
|
+
right: 0
|
|
19
|
+
};
|
|
10
20
|
function SafeAreaProvider(param) {
|
|
11
21
|
var {
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
22
|
+
children,
|
|
23
|
+
initialMetrics,
|
|
24
|
+
initialSafeAreaInsets,
|
|
25
|
+
...others
|
|
26
|
+
} = param;
|
|
27
|
+
var _ref, _ref1, _ref2, _ref3, _ref4;
|
|
28
|
+
var parentInsets = useParentSafeAreaInsets();
|
|
29
|
+
var parentFrame = useParentSafeAreaFrame();
|
|
30
|
+
var [insets, setInsets] = React.useState((_ref = (_ref1 = (_ref2 = initialMetrics === null || initialMetrics === void 0 ? void 0 : initialMetrics.insets) !== null && _ref2 !== void 0 ? _ref2 : initialSafeAreaInsets) !== null && _ref1 !== void 0 ? _ref1 : parentInsets) !== null && _ref !== void 0 ? _ref : ZERO_INSETS);
|
|
31
|
+
var [frame, setFrame] = React.useState((_ref3 = (_ref4 = initialMetrics === null || initialMetrics === void 0 ? void 0 : initialMetrics.frame) !== null && _ref4 !== void 0 ? _ref4 : parentFrame) !== null && _ref3 !== void 0 ? _ref3 : {
|
|
32
|
+
// Backwards compat so we render anyway if we don't have frame.
|
|
33
|
+
x: 0,
|
|
34
|
+
y: 0,
|
|
35
|
+
width: Dimensions.get("window").width,
|
|
36
|
+
height: Dimensions.get("window").height
|
|
37
|
+
});
|
|
38
|
+
var onInsetsChange = React.useCallback(function (event) {
|
|
39
|
+
var {
|
|
40
|
+
nativeEvent: {
|
|
41
|
+
frame: nextFrame,
|
|
42
|
+
insets: nextInsets
|
|
43
|
+
}
|
|
44
|
+
} = event;
|
|
45
|
+
React.startTransition(function () {
|
|
46
|
+
setFrame(function (curFrame) {
|
|
47
|
+
if (
|
|
48
|
+
// Backwards compat with old native code that won't send frame.
|
|
49
|
+
nextFrame && (nextFrame.height !== curFrame.height || nextFrame.width !== curFrame.width || nextFrame.x !== curFrame.x || nextFrame.y !== curFrame.y)) {
|
|
50
|
+
return nextFrame;
|
|
37
51
|
}
|
|
38
|
-
|
|
39
|
-
React.startTransition(function () {
|
|
40
|
-
setFrame(function (curFrame) {
|
|
41
|
-
return (
|
|
42
|
-
// Backwards compat with old native code that won't send frame.
|
|
43
|
-
nextFrame && (nextFrame.height !== curFrame.height || nextFrame.width !== curFrame.width || nextFrame.x !== curFrame.x || nextFrame.y !== curFrame.y) ? nextFrame : curFrame
|
|
44
|
-
);
|
|
45
|
-
}), setInsets(function (curInsets) {
|
|
46
|
-
return !curInsets || nextInsets.bottom !== curInsets.bottom || nextInsets.left !== curInsets.left || nextInsets.right !== curInsets.right || nextInsets.top !== curInsets.top ? nextInsets : curInsets;
|
|
47
|
-
});
|
|
52
|
+
return curFrame;
|
|
48
53
|
});
|
|
49
|
-
|
|
54
|
+
setInsets(function (curInsets) {
|
|
55
|
+
if (!curInsets || nextInsets.bottom !== curInsets.bottom || nextInsets.left !== curInsets.left || nextInsets.right !== curInsets.right || nextInsets.top !== curInsets.top) {
|
|
56
|
+
return nextInsets;
|
|
57
|
+
}
|
|
58
|
+
return curInsets;
|
|
59
|
+
});
|
|
60
|
+
});
|
|
61
|
+
}, []);
|
|
50
62
|
return /* @__PURE__ */_jsx(NativeSafeAreaProvider, {
|
|
51
63
|
onInsetsChange,
|
|
52
64
|
...others,
|
|
@@ -68,12 +80,16 @@ function useParentSafeAreaFrame() {
|
|
|
68
80
|
var NO_INSETS_ERROR = "No safe area value available. Make sure you are rendering `<SafeAreaProvider>` at the top of your app.";
|
|
69
81
|
function useSafeAreaInsets() {
|
|
70
82
|
var insets = React.useContext(SafeAreaInsetsContext);
|
|
71
|
-
if (insets == null)
|
|
83
|
+
if (insets == null) {
|
|
84
|
+
throw new Error(NO_INSETS_ERROR);
|
|
85
|
+
}
|
|
72
86
|
return insets;
|
|
73
87
|
}
|
|
74
88
|
function useSafeAreaFrame() {
|
|
75
89
|
var frame = React.useContext(SafeAreaFrameContext);
|
|
76
|
-
if (frame == null)
|
|
90
|
+
if (frame == null) {
|
|
91
|
+
throw new Error(NO_INSETS_ERROR);
|
|
92
|
+
}
|
|
77
93
|
return frame;
|
|
78
94
|
}
|
|
79
95
|
function withSafeAreaInsets(WrappedComponent) {
|
|
@@ -89,7 +105,7 @@ function withSafeAreaInsets(WrappedComponent) {
|
|
|
89
105
|
function useSafeArea() {
|
|
90
106
|
return useSafeAreaInsets();
|
|
91
107
|
}
|
|
92
|
-
var SafeAreaConsumer = SafeAreaInsetsContext.Consumer
|
|
93
|
-
|
|
108
|
+
var SafeAreaConsumer = SafeAreaInsetsContext.Consumer;
|
|
109
|
+
var SafeAreaContext = SafeAreaInsetsContext;
|
|
94
110
|
export { SafeAreaConsumer, SafeAreaContext, SafeAreaFrameContext, SafeAreaInsetsContext, SafeAreaProvider, useSafeArea, useSafeAreaFrame, useSafeAreaInsets, withSafeAreaInsets };
|
|
95
111
|
//# sourceMappingURL=SafeAreaContext.native.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["jsx","_jsx","React","Dimensions","NativeSafeAreaProvider","isDev","process","env","NODE_ENV","SafeAreaInsetsContext","createContext","displayName","SafeAreaFrameContext","SafeAreaProvider","param","children","initialMetrics","initialSafeAreaInsets","others","_ref","_ref1","_ref2","_ref3","_ref4","parentInsets","useParentSafeAreaInsets","parentFrame","useParentSafeAreaFrame","insets","setInsets","useState","frame","setFrame","x","y","width","get","height","onInsetsChange","useCallback","event","nativeEvent","nextFrame","nextInsets","startTransition","curFrame","curInsets","
|
|
1
|
+
{"version":3,"names":["jsx","_jsx","React","Dimensions","NativeSafeAreaProvider","isDev","process","env","NODE_ENV","SafeAreaInsetsContext","createContext","displayName","SafeAreaFrameContext","ZERO_INSETS","top","bottom","left","right","SafeAreaProvider","param","children","initialMetrics","initialSafeAreaInsets","others","_ref","_ref1","_ref2","_ref3","_ref4","parentInsets","useParentSafeAreaInsets","parentFrame","useParentSafeAreaFrame","insets","setInsets","useState","frame","setFrame","x","y","width","get","height","onInsetsChange","useCallback","event","nativeEvent","nextFrame","nextInsets","startTransition","curFrame","curInsets","Provider","value","useContext","NO_INSETS_ERROR","useSafeAreaInsets","Error","useSafeAreaFrame","withSafeAreaInsets","WrappedComponent","forwardRef","props","ref"],"sources":["../../src/SafeAreaContext.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
|
|
@@ -2,71 +2,71 @@ import * as React from "react";
|
|
|
2
2
|
import { View, StyleSheet } from "react-native-web";
|
|
3
3
|
import { useSafeAreaInsets } from "./SafeAreaContext.mjs";
|
|
4
4
|
import { jsx } from "react/jsx-runtime";
|
|
5
|
-
const TOP = 8
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
});
|
|
5
|
+
const TOP = 8;
|
|
6
|
+
const RIGHT = 4;
|
|
7
|
+
const BOTTOM = 2;
|
|
8
|
+
const LEFT = 1;
|
|
9
|
+
const ALL = 15;
|
|
10
|
+
const edgeBitmaskMap = {
|
|
11
|
+
top: TOP,
|
|
12
|
+
right: RIGHT,
|
|
13
|
+
bottom: BOTTOM,
|
|
14
|
+
left: LEFT
|
|
15
|
+
};
|
|
16
|
+
const SafeAreaView = React.forwardRef(({
|
|
17
|
+
style = {},
|
|
18
|
+
mode,
|
|
19
|
+
edges,
|
|
20
|
+
...rest
|
|
21
|
+
}, ref) => {
|
|
22
|
+
const insets = useSafeAreaInsets();
|
|
23
|
+
const edgeBitmask = edges != null ? Array.isArray(edges) ? edges.reduce((acc, edge) => acc | edgeBitmaskMap[edge], 0) : Object.keys(edges).reduce((acc, edge) => acc | edgeBitmaskMap[edge], 0) : ALL;
|
|
24
|
+
const appliedStyle = React.useMemo(() => {
|
|
25
|
+
const insetTop = edgeBitmask & TOP ? insets.top : 0;
|
|
26
|
+
const insetRight = edgeBitmask & RIGHT ? insets.right : 0;
|
|
27
|
+
const insetBottom = edgeBitmask & BOTTOM ? insets.bottom : 0;
|
|
28
|
+
const insetLeft = edgeBitmask & LEFT ? insets.left : 0;
|
|
29
|
+
const flatStyle = StyleSheet.flatten(style);
|
|
30
|
+
if (mode === "margin") {
|
|
31
|
+
const {
|
|
32
|
+
margin = 0,
|
|
33
|
+
marginVertical = margin,
|
|
34
|
+
marginHorizontal = margin,
|
|
35
|
+
marginTop = marginVertical,
|
|
36
|
+
marginRight = marginHorizontal,
|
|
37
|
+
marginBottom = marginVertical,
|
|
38
|
+
marginLeft = marginHorizontal
|
|
39
|
+
} = flatStyle;
|
|
40
|
+
const marginStyle = {
|
|
41
|
+
marginTop: marginTop + insetTop,
|
|
42
|
+
marginRight: marginRight + insetRight,
|
|
43
|
+
marginBottom: marginBottom + insetBottom,
|
|
44
|
+
marginLeft: marginLeft + insetLeft
|
|
45
|
+
};
|
|
46
|
+
return [style, marginStyle];
|
|
47
|
+
}
|
|
48
|
+
const {
|
|
49
|
+
padding = 0,
|
|
50
|
+
paddingVertical = padding,
|
|
51
|
+
paddingHorizontal = padding,
|
|
52
|
+
paddingTop = paddingVertical,
|
|
53
|
+
paddingRight = paddingHorizontal,
|
|
54
|
+
paddingBottom = paddingVertical,
|
|
55
|
+
paddingLeft = paddingHorizontal
|
|
56
|
+
} = flatStyle;
|
|
57
|
+
const paddingStyle = {
|
|
58
|
+
paddingTop: paddingTop + insetTop,
|
|
59
|
+
paddingRight: paddingRight + insetRight,
|
|
60
|
+
paddingBottom: paddingBottom + insetBottom,
|
|
61
|
+
paddingLeft: paddingLeft + insetLeft
|
|
62
|
+
};
|
|
63
|
+
return [style, paddingStyle];
|
|
64
|
+
}, [style, insets, mode, edgeBitmask]);
|
|
65
|
+
return /* @__PURE__ */jsx(View, {
|
|
66
|
+
style: appliedStyle,
|
|
67
|
+
...rest,
|
|
68
|
+
ref
|
|
70
69
|
});
|
|
70
|
+
});
|
|
71
71
|
export { SafeAreaView };
|
|
72
72
|
//# sourceMappingURL=SafeAreaView.mjs.map
|