@tamagui/sheet 3.0.0-beta.922.1 → 3.0.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/dist/cjs/Sheet.cjs +48 -16
- package/dist/cjs/Sheet.native.cjs +46 -17
- package/dist/cjs/Sheet.native.js +46 -17
- package/dist/cjs/Sheet.native.js.map +1 -1
- package/dist/cjs/SheetDragSurface.cjs +50 -0
- package/dist/{jsx/GestureDetectorWrapper.native.js → cjs/SheetDragSurface.native.cjs} +24 -12
- package/dist/cjs/{GestureDetectorWrapper.native.js → SheetDragSurface.native.js} +25 -11
- package/dist/cjs/SheetDragSurface.native.js.map +1 -0
- package/dist/cjs/SheetImplementationCustom.cjs +41 -58
- package/dist/cjs/SheetImplementationCustom.native.cjs +43 -59
- package/dist/cjs/SheetImplementationCustom.native.js +43 -59
- package/dist/cjs/SheetImplementationCustom.native.js.map +1 -1
- package/dist/cjs/SheetScrollView.cjs +15 -3
- package/dist/cjs/SheetScrollView.native.cjs +17 -4
- package/dist/cjs/SheetScrollView.native.js +17 -4
- package/dist/cjs/SheetScrollView.native.js.map +1 -1
- package/dist/cjs/nativeSheet.cjs +3 -59
- package/dist/cjs/nativeSheet.native.cjs +70 -58
- package/dist/cjs/nativeSheet.native.js +70 -58
- package/dist/cjs/nativeSheet.native.js.map +1 -1
- package/dist/cjs/stableViewportHeight.cjs +27 -0
- package/dist/cjs/stableViewportHeight.native.cjs +29 -0
- package/dist/cjs/stableViewportHeight.native.js +31 -0
- package/dist/cjs/stableViewportHeight.native.js.map +1 -0
- package/dist/cjs/useSheetOffscreenSize.cjs +3 -1
- package/dist/cjs/useSheetOffscreenSize.native.cjs +3 -2
- package/dist/cjs/useSheetOffscreenSize.native.js +3 -2
- package/dist/cjs/useSheetOffscreenSize.native.js.map +1 -1
- package/dist/cjs/useSheetOpenState.cjs +13 -6
- package/dist/cjs/useSheetOpenState.native.cjs +15 -5
- package/dist/cjs/useSheetOpenState.native.js +15 -5
- package/dist/cjs/useSheetOpenState.native.js.map +1 -1
- package/dist/cjs/useSheetProviderProps.cjs +5 -94
- package/dist/cjs/useSheetProviderProps.native.cjs +5 -103
- package/dist/cjs/useSheetProviderProps.native.js +5 -103
- package/dist/cjs/useSheetProviderProps.native.js.map +1 -1
- package/dist/cjs/useSheetState.cjs +120 -0
- package/dist/cjs/useSheetState.native.cjs +131 -0
- package/dist/cjs/useSheetState.native.js +133 -0
- package/dist/cjs/useSheetState.native.js.map +1 -0
- package/dist/esm/Sheet.mjs +48 -15
- package/dist/esm/Sheet.mjs.map +1 -1
- package/dist/esm/Sheet.native.js +46 -17
- package/dist/esm/Sheet.native.js.map +1 -1
- package/dist/esm/SheetDragSurface.mjs +25 -0
- package/dist/esm/SheetDragSurface.mjs.map +1 -0
- package/dist/esm/SheetDragSurface.native.js +34 -0
- package/dist/esm/SheetDragSurface.native.js.map +1 -0
- package/dist/esm/SheetImplementationCustom.mjs +39 -56
- package/dist/esm/SheetImplementationCustom.mjs.map +1 -1
- package/dist/esm/SheetImplementationCustom.native.js +41 -57
- package/dist/esm/SheetImplementationCustom.native.js.map +1 -1
- package/dist/esm/SheetScrollView.mjs +16 -4
- package/dist/esm/SheetScrollView.mjs.map +1 -1
- package/dist/esm/SheetScrollView.native.js +18 -5
- package/dist/esm/SheetScrollView.native.js.map +1 -1
- package/dist/esm/nativeSheet.mjs +3 -60
- package/dist/esm/nativeSheet.mjs.map +1 -1
- package/dist/esm/nativeSheet.native.js +70 -58
- package/dist/esm/nativeSheet.native.js.map +1 -1
- package/dist/esm/stableViewportHeight.mjs +8 -0
- package/dist/esm/stableViewportHeight.mjs.map +1 -0
- package/dist/esm/stableViewportHeight.native.js +8 -0
- package/dist/esm/stableViewportHeight.native.js.map +1 -0
- package/dist/esm/useKeyboardControllerSheet.native.js +0 -5
- package/dist/esm/useSheetOffscreenSize.mjs +3 -1
- package/dist/esm/useSheetOffscreenSize.mjs.map +1 -1
- package/dist/esm/useSheetOffscreenSize.native.js +3 -2
- package/dist/esm/useSheetOffscreenSize.native.js.map +1 -1
- package/dist/esm/useSheetOpenState.mjs +14 -7
- package/dist/esm/useSheetOpenState.mjs.map +1 -1
- package/dist/esm/useSheetOpenState.native.js +16 -6
- package/dist/esm/useSheetOpenState.native.js.map +1 -1
- package/dist/esm/useSheetProviderProps.mjs +5 -88
- package/dist/esm/useSheetProviderProps.mjs.map +1 -1
- package/dist/esm/useSheetProviderProps.native.js +5 -97
- package/dist/esm/useSheetProviderProps.native.js.map +1 -1
- package/dist/esm/useSheetState.mjs +95 -0
- package/dist/esm/useSheetState.mjs.map +1 -0
- package/dist/esm/useSheetState.native.js +104 -0
- package/dist/esm/useSheetState.native.js.map +1 -0
- package/dist/jsx/Sheet.mjs +48 -15
- package/dist/jsx/Sheet.mjs.map +1 -1
- package/dist/jsx/Sheet.native.cjs +46 -17
- package/dist/jsx/Sheet.native.js +46 -17
- package/dist/jsx/Sheet.native.js.map +1 -1
- package/dist/jsx/SheetDragSurface.mjs +25 -0
- package/dist/jsx/SheetDragSurface.mjs.map +1 -0
- package/dist/{cjs/GestureDetectorWrapper.native.cjs → jsx/SheetDragSurface.native.cjs} +24 -10
- package/dist/jsx/{GestureDetectorWrapper.native.cjs → SheetDragSurface.native.js} +26 -10
- package/dist/jsx/SheetDragSurface.native.js.map +1 -0
- package/dist/jsx/SheetImplementationCustom.mjs +39 -56
- package/dist/jsx/SheetImplementationCustom.mjs.map +1 -1
- package/dist/jsx/SheetImplementationCustom.native.cjs +43 -59
- package/dist/jsx/SheetImplementationCustom.native.js +43 -59
- package/dist/jsx/SheetImplementationCustom.native.js.map +1 -1
- package/dist/jsx/SheetScrollView.mjs +16 -4
- package/dist/jsx/SheetScrollView.mjs.map +1 -1
- package/dist/jsx/SheetScrollView.native.cjs +17 -4
- package/dist/jsx/SheetScrollView.native.js +17 -4
- package/dist/jsx/SheetScrollView.native.js.map +1 -1
- package/dist/jsx/nativeSheet.mjs +3 -60
- package/dist/jsx/nativeSheet.mjs.map +1 -1
- package/dist/jsx/nativeSheet.native.cjs +70 -58
- package/dist/jsx/nativeSheet.native.js +70 -58
- package/dist/jsx/nativeSheet.native.js.map +1 -1
- package/dist/jsx/stableViewportHeight.mjs +8 -0
- package/dist/jsx/stableViewportHeight.mjs.map +1 -0
- package/dist/jsx/stableViewportHeight.native.cjs +29 -0
- package/dist/jsx/stableViewportHeight.native.js +31 -0
- package/dist/jsx/stableViewportHeight.native.js.map +1 -0
- package/dist/jsx/useSheetOffscreenSize.mjs +3 -1
- package/dist/jsx/useSheetOffscreenSize.mjs.map +1 -1
- package/dist/jsx/useSheetOffscreenSize.native.cjs +3 -2
- package/dist/jsx/useSheetOffscreenSize.native.js +3 -2
- package/dist/jsx/useSheetOffscreenSize.native.js.map +1 -1
- package/dist/jsx/useSheetOpenState.mjs +14 -7
- package/dist/jsx/useSheetOpenState.mjs.map +1 -1
- package/dist/jsx/useSheetOpenState.native.cjs +15 -5
- package/dist/jsx/useSheetOpenState.native.js +15 -5
- package/dist/jsx/useSheetOpenState.native.js.map +1 -1
- package/dist/jsx/useSheetProviderProps.mjs +5 -88
- package/dist/jsx/useSheetProviderProps.mjs.map +1 -1
- package/dist/jsx/useSheetProviderProps.native.cjs +5 -103
- package/dist/jsx/useSheetProviderProps.native.js +5 -103
- package/dist/jsx/useSheetProviderProps.native.js.map +1 -1
- package/dist/jsx/useSheetState.mjs +95 -0
- package/dist/jsx/useSheetState.mjs.map +1 -0
- package/dist/jsx/useSheetState.native.cjs +131 -0
- package/dist/jsx/useSheetState.native.js +133 -0
- package/dist/jsx/useSheetState.native.js.map +1 -0
- package/package.json +27 -22
- package/src/Sheet.tsx +45 -18
- package/src/SheetDragSurface.native.tsx +42 -0
- package/src/SheetDragSurface.tsx +40 -0
- package/src/SheetImplementationCustom.tsx +67 -92
- package/src/SheetScrollView.tsx +26 -4
- package/src/nativeSheet.native.tsx +110 -0
- package/src/nativeSheet.ts +16 -0
- package/src/stableViewportHeight.native.ts +9 -0
- package/src/stableViewportHeight.ts +15 -0
- package/src/types.tsx +44 -1
- package/src/useSheetOffscreenSize.tsx +3 -7
- package/src/useSheetOpenState.tsx +18 -8
- package/src/useSheetProviderProps.tsx +18 -149
- package/src/useSheetScrollViewGestures.native.ts +4 -1
- package/src/useSheetState.tsx +139 -0
- package/types/Sheet.d.ts +71 -167
- package/types/Sheet.d.ts.map +1 -1
- package/types/SheetDragSurface.d.ts +11 -0
- package/types/SheetDragSurface.d.ts.map +1 -0
- package/types/SheetDragSurface.native.d.ts +11 -0
- package/types/SheetDragSurface.native.d.ts.map +1 -0
- package/types/SheetImplementationCustom.d.ts +1 -2
- package/types/SheetImplementationCustom.d.ts.map +1 -1
- package/types/SheetScrollView.d.ts +3 -3
- package/types/SheetScrollView.d.ts.map +1 -1
- package/types/nativeSheet.d.ts +8 -9
- package/types/nativeSheet.d.ts.map +1 -1
- package/types/nativeSheet.native.d.ts +4 -0
- package/types/nativeSheet.native.d.ts.map +1 -0
- package/types/stableViewportHeight.d.ts +12 -0
- package/types/stableViewportHeight.d.ts.map +1 -0
- package/types/stableViewportHeight.native.d.ts +6 -0
- package/types/stableViewportHeight.native.d.ts.map +1 -0
- package/types/types.d.ts +34 -1
- package/types/types.d.ts.map +1 -1
- package/types/useSheetOffscreenSize.d.ts +1 -1
- package/types/useSheetOffscreenSize.d.ts.map +1 -1
- package/types/useSheetOpenState.d.ts +3 -1
- package/types/useSheetOpenState.d.ts.map +1 -1
- package/types/useSheetProviderProps.d.ts +15 -13
- package/types/useSheetProviderProps.d.ts.map +1 -1
- package/types/useSheetScrollViewGestures.native.d.ts +1 -1
- package/types/useSheetScrollViewGestures.native.d.ts.map +1 -1
- package/types/useSheetState.d.ts +26 -0
- package/types/useSheetState.d.ts.map +1 -0
- package/dist/cjs/GestureDetectorWrapper.cjs +0 -44
- package/dist/cjs/GestureDetectorWrapper.native.js.map +0 -1
- package/dist/esm/GestureDetectorWrapper.mjs +0 -25
- package/dist/esm/GestureDetectorWrapper.mjs.map +0 -1
- package/dist/esm/GestureDetectorWrapper.native.js +0 -26
- package/dist/esm/GestureDetectorWrapper.native.js.map +0 -1
- package/dist/jsx/GestureDetectorWrapper.mjs +0 -25
- package/dist/jsx/GestureDetectorWrapper.mjs.map +0 -1
- package/dist/jsx/GestureDetectorWrapper.native.js.map +0 -1
- package/src/GestureDetectorWrapper.tsx +0 -38
- package/src/nativeSheet.tsx +0 -86
- package/types/GestureDetectorWrapper.d.ts +0 -14
- package/types/GestureDetectorWrapper.d.ts.map +0 -1
|
@@ -0,0 +1,104 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { useControllableState } from "@tamagui/use-controllable-state";
|
|
3
|
+
|
|
4
|
+
function useSheetState(props, state) {
|
|
5
|
+
var handleRef = React.useRef(null);
|
|
6
|
+
var contentRef = React.useRef(null);
|
|
7
|
+
var [frameSize, setFrameSize] = React.useState(0);
|
|
8
|
+
var [maxContentSize, setMaxContentSize] = React.useState(0);
|
|
9
|
+
var _props_snapPointsMode;
|
|
10
|
+
var snapPointsMode = (_props_snapPointsMode = props.snapPointsMode) !== null && _props_snapPointsMode !== void 0 ? _props_snapPointsMode : "percent";
|
|
11
|
+
var _props_snapPoints;
|
|
12
|
+
var snapPointsProp = (_props_snapPoints = props.snapPoints) !== null && _props_snapPoints !== void 0 ? _props_snapPoints : snapPointsMode === "percent" ? [80] : snapPointsMode === "constant" ? [256] : ["fit"];
|
|
13
|
+
var hasFit = snapPointsProp[0] === "fit";
|
|
14
|
+
var snapPoints = React.useMemo(function() {
|
|
15
|
+
return props.dismissOnSnapToBottom ? [...snapPointsProp, 0] : snapPointsProp;
|
|
16
|
+
}, [JSON.stringify(snapPointsProp), props.dismissOnSnapToBottom]);
|
|
17
|
+
var [position_, setPositionImmediate] = useControllableState({
|
|
18
|
+
prop: props.position,
|
|
19
|
+
defaultProp: props.defaultPosition || (state.open ? 0 : -1),
|
|
20
|
+
onChange: props.onPositionChange,
|
|
21
|
+
strategy: state.strategy
|
|
22
|
+
});
|
|
23
|
+
var position = state.open === false ? -1 : position_;
|
|
24
|
+
var { open } = state;
|
|
25
|
+
var setPosition = React.useCallback(function(next) {
|
|
26
|
+
if (props.dismissOnSnapToBottom && next === snapPoints.length - 1) {
|
|
27
|
+
state.setOpen(false);
|
|
28
|
+
} else {
|
|
29
|
+
setPositionImmediate(next);
|
|
30
|
+
}
|
|
31
|
+
}, [
|
|
32
|
+
props.dismissOnSnapToBottom,
|
|
33
|
+
snapPoints.length,
|
|
34
|
+
setPositionImmediate,
|
|
35
|
+
state.setOpen
|
|
36
|
+
]);
|
|
37
|
+
if (process.env.NODE_ENV === "development") {
|
|
38
|
+
if (snapPointsMode === "mixed" && snapPoints.some(function(p) {
|
|
39
|
+
if (typeof p === "string") {
|
|
40
|
+
if (p === "fit") {
|
|
41
|
+
return false;
|
|
42
|
+
}
|
|
43
|
+
if (p.endsWith("%")) {
|
|
44
|
+
var n = Number(p.slice(0, -1));
|
|
45
|
+
return n < 0 || n > 100;
|
|
46
|
+
}
|
|
47
|
+
return true;
|
|
48
|
+
}
|
|
49
|
+
return typeof p !== "number" || p < 0;
|
|
50
|
+
})) {
|
|
51
|
+
console.warn("⚠️ Invalid snapPoint given, snapPoints must be positive numeric values, string percentages between 0-100%, or \"fit\" when snapPointsMode is mixed");
|
|
52
|
+
}
|
|
53
|
+
if (snapPointsMode === "mixed" && snapPoints.indexOf("fit") > 0) {
|
|
54
|
+
console.warn("⚠️ Invalid snapPoint given, \"fit\" must be the first/largest snap point when snapPointsMode is mixed");
|
|
55
|
+
}
|
|
56
|
+
if (snapPointsMode === "fit" && (snapPoints.length !== (props.dismissOnSnapToBottom ? 2 : 1) || snapPoints[0] !== "fit")) {
|
|
57
|
+
console.warn("⚠️ Invalid snapPoint given, there are no snap points when snapPointsMode is fit");
|
|
58
|
+
}
|
|
59
|
+
if (snapPointsMode === "constant" && snapPoints.some(function(p) {
|
|
60
|
+
return typeof p !== "number" || p < 0;
|
|
61
|
+
})) {
|
|
62
|
+
console.warn("⚠️ Invalid snapPoint given, snapPoints must be positive numeric values when snapPointsMode is constant");
|
|
63
|
+
}
|
|
64
|
+
if (snapPointsMode === "percent" && snapPoints.some(function(p) {
|
|
65
|
+
return typeof p !== "number" || p < 0 || p > 100;
|
|
66
|
+
})) {
|
|
67
|
+
console.warn("⚠️ Invalid snapPoint given, snapPoints must be numeric values between 0 and 100 when snapPointsMode is percent");
|
|
68
|
+
}
|
|
69
|
+
}
|
|
70
|
+
if (open && props.dismissOnSnapToBottom && position === snapPoints.length - 1) {
|
|
71
|
+
setPositionImmediate(0);
|
|
72
|
+
}
|
|
73
|
+
var shouldSetPositionOpen = open && position < 0;
|
|
74
|
+
React.useEffect(function() {
|
|
75
|
+
if (shouldSetPositionOpen) {
|
|
76
|
+
setPosition(0);
|
|
77
|
+
}
|
|
78
|
+
}, [setPosition, shouldSetPositionOpen]);
|
|
79
|
+
var _props_dismissOnOverlayPress, _props_dismissOnSnapToBottom, _props_scope;
|
|
80
|
+
return {
|
|
81
|
+
modal: !!props.modal,
|
|
82
|
+
open: state.open,
|
|
83
|
+
setOpen: state.setOpen,
|
|
84
|
+
hidden: !!state.isHidden,
|
|
85
|
+
contentRef,
|
|
86
|
+
handleRef,
|
|
87
|
+
frameSize,
|
|
88
|
+
setFrameSize,
|
|
89
|
+
maxContentSize,
|
|
90
|
+
dismissOnOverlayPress: (_props_dismissOnOverlayPress = props.dismissOnOverlayPress) !== null && _props_dismissOnOverlayPress !== void 0 ? _props_dismissOnOverlayPress : true,
|
|
91
|
+
dismissOnSnapToBottom: (_props_dismissOnSnapToBottom = props.dismissOnSnapToBottom) !== null && _props_dismissOnSnapToBottom !== void 0 ? _props_dismissOnSnapToBottom : false,
|
|
92
|
+
scope: (_props_scope = props.scope) !== null && _props_scope !== void 0 ? _props_scope : "",
|
|
93
|
+
hasFit,
|
|
94
|
+
position,
|
|
95
|
+
snapPoints,
|
|
96
|
+
snapPointsMode,
|
|
97
|
+
setMaxContentSize,
|
|
98
|
+
setPosition,
|
|
99
|
+
setPositionImmediate
|
|
100
|
+
};
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
export { useSheetState };
|
|
104
|
+
//# sourceMappingURL=useSheetState.native.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useSheetState.native.js","names":[],"sources":["esm/useSheetState.native.js"],"sourcesContent":["import React from \"react\";\nimport { useControllableState } from \"@tamagui/use-controllable-state\";\nfunction useSheetState(props, state) {\n var handleRef = React.useRef(null);\n var contentRef = React.useRef(null);\n var [frameSize, setFrameSize] = React.useState(0);\n var [maxContentSize, setMaxContentSize] = React.useState(0);\n var _props_snapPointsMode;\n var snapPointsMode = (_props_snapPointsMode = props.snapPointsMode) !== null && _props_snapPointsMode !== void 0 ? _props_snapPointsMode : \"percent\";\n var _props_snapPoints;\n var snapPointsProp = (_props_snapPoints = props.snapPoints) !== null && _props_snapPoints !== void 0 ? _props_snapPoints : snapPointsMode === \"percent\" ? [\n 80\n ] : snapPointsMode === \"constant\" ? [\n 256\n ] : [\n \"fit\"\n ];\n var hasFit = snapPointsProp[0] === \"fit\";\n var snapPoints = React.useMemo(function() {\n return props.dismissOnSnapToBottom ? [\n ...snapPointsProp,\n 0\n ] : snapPointsProp;\n }, [\n JSON.stringify(snapPointsProp),\n props.dismissOnSnapToBottom\n ]);\n var [position_, setPositionImmediate] = useControllableState({\n prop: props.position,\n defaultProp: props.defaultPosition || (state.open ? 0 : -1),\n onChange: props.onPositionChange,\n strategy: state.strategy\n });\n var position = state.open === false ? -1 : position_;\n var { open } = state;\n var setPosition = React.useCallback(function(next) {\n if (props.dismissOnSnapToBottom && next === snapPoints.length - 1) {\n state.setOpen(false);\n } else {\n setPositionImmediate(next);\n }\n }, [\n props.dismissOnSnapToBottom,\n snapPoints.length,\n setPositionImmediate,\n state.setOpen\n ]);\n if (process.env.NODE_ENV === \"development\") {\n if (snapPointsMode === \"mixed\" && snapPoints.some(function(p) {\n if (typeof p === \"string\") {\n if (p === \"fit\") {\n return false;\n }\n if (p.endsWith(\"%\")) {\n var n = Number(p.slice(0, -1));\n return n < 0 || n > 100;\n }\n return true;\n }\n return typeof p !== \"number\" || p < 0;\n })) {\n console.warn('\\u26A0\\uFE0F Invalid snapPoint given, snapPoints must be positive numeric values, string percentages between 0-100%, or \"fit\" when snapPointsMode is mixed');\n }\n if (snapPointsMode === \"mixed\" && snapPoints.indexOf(\"fit\") > 0) {\n console.warn('\\u26A0\\uFE0F Invalid snapPoint given, \"fit\" must be the first/largest snap point when snapPointsMode is mixed');\n }\n if (snapPointsMode === \"fit\" && (snapPoints.length !== (props.dismissOnSnapToBottom ? 2 : 1) || snapPoints[0] !== \"fit\")) {\n console.warn(\"\\u26A0\\uFE0F Invalid snapPoint given, there are no snap points when snapPointsMode is fit\");\n }\n if (snapPointsMode === \"constant\" && snapPoints.some(function(p) {\n return typeof p !== \"number\" || p < 0;\n })) {\n console.warn(\"\\u26A0\\uFE0F Invalid snapPoint given, snapPoints must be positive numeric values when snapPointsMode is constant\");\n }\n if (snapPointsMode === \"percent\" && snapPoints.some(function(p) {\n return typeof p !== \"number\" || p < 0 || p > 100;\n })) {\n console.warn(\"\\u26A0\\uFE0F Invalid snapPoint given, snapPoints must be numeric values between 0 and 100 when snapPointsMode is percent\");\n }\n }\n if (open && props.dismissOnSnapToBottom && position === snapPoints.length - 1) {\n setPositionImmediate(0);\n }\n var shouldSetPositionOpen = open && position < 0;\n React.useEffect(function() {\n if (shouldSetPositionOpen) {\n setPosition(0);\n }\n }, [\n setPosition,\n shouldSetPositionOpen\n ]);\n var _props_dismissOnOverlayPress, _props_dismissOnSnapToBottom, _props_scope;\n return {\n modal: !!props.modal,\n open: state.open,\n setOpen: state.setOpen,\n hidden: !!state.isHidden,\n contentRef,\n handleRef,\n frameSize,\n setFrameSize,\n maxContentSize,\n dismissOnOverlayPress: (_props_dismissOnOverlayPress = props.dismissOnOverlayPress) !== null && _props_dismissOnOverlayPress !== void 0 ? _props_dismissOnOverlayPress : true,\n dismissOnSnapToBottom: (_props_dismissOnSnapToBottom = props.dismissOnSnapToBottom) !== null && _props_dismissOnSnapToBottom !== void 0 ? _props_dismissOnSnapToBottom : false,\n scope: (_props_scope = props.scope) !== null && _props_scope !== void 0 ? _props_scope : \"\",\n hasFit,\n position,\n snapPoints,\n snapPointsMode,\n setMaxContentSize,\n setPosition,\n setPositionImmediate\n };\n}\nexport {\n useSheetState\n};\n//# sourceMappingURL=useSheetState.js.map\n"],"mappings":"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"}
|
package/dist/jsx/Sheet.mjs
CHANGED
|
@@ -9,8 +9,8 @@ import { XStack, YStack } from "@tamagui/stacks";
|
|
|
9
9
|
import { useDidFinishSSR } from "@tamagui/use-did-finish-ssr";
|
|
10
10
|
import { StackZIndexContext } from "@tamagui/z-index-stack";
|
|
11
11
|
import { useContext, useEffect, useMemo, useRef } from "react";
|
|
12
|
-
import { Platform } from "react-native-web";
|
|
13
12
|
import { SHEET_BACKGROUND_NAME, SHEET_CONTAINER_NAME, SHEET_HANDLE_NAME, SHEET_OVERLAY_MARKER, SHEET_OVERLAY_NAME } from "./constants.mjs";
|
|
13
|
+
import { getNativeSheet } from "./nativeSheet.mjs";
|
|
14
14
|
import { SheetOverlayLayerContext, useAnimatedPosition, useSheetContext } from "./SheetContext.mjs";
|
|
15
15
|
import { SheetImplementationCustom } from "./SheetImplementationCustom.mjs";
|
|
16
16
|
import { SheetScrollView } from "./SheetScrollView.mjs";
|
|
@@ -32,7 +32,7 @@ const SheetOverlayFrame = styled(YStack, {
|
|
|
32
32
|
displayName: SHEET_OVERLAY_NAME,
|
|
33
33
|
inset: 0,
|
|
34
34
|
position: "absolute",
|
|
35
|
-
zIndex:
|
|
35
|
+
zIndex: 1e5 - 1,
|
|
36
36
|
pointerEvents: "auto",
|
|
37
37
|
variants: { open: {
|
|
38
38
|
true: { pointerEvents: "auto" },
|
|
@@ -45,8 +45,7 @@ const SheetContainerFrame = styled(YStack, {
|
|
|
45
45
|
flex: 1,
|
|
46
46
|
position: "relative",
|
|
47
47
|
zIndex: 0,
|
|
48
|
-
width: "100%"
|
|
49
|
-
maxHeight: "100%"
|
|
48
|
+
width: "100%"
|
|
50
49
|
});
|
|
51
50
|
const SheetBackgroundFrame = styled(YStack, {
|
|
52
51
|
displayName: SHEET_BACKGROUND_NAME,
|
|
@@ -64,10 +63,14 @@ const SheetHandle = createStyledHOC(SheetHandleFrame, ({ scope, ...props }, forw
|
|
|
64
63
|
useEffect(() => {
|
|
65
64
|
if (!context.scrollBridge) return;
|
|
66
65
|
return context.scrollBridge.onParentDragging((isDragging) => {
|
|
67
|
-
if (isDragging)
|
|
66
|
+
if (isDragging) {
|
|
67
|
+
wasDraggingRef.current = true;
|
|
68
|
+
}
|
|
68
69
|
});
|
|
69
70
|
}, [context.scrollBridge]);
|
|
70
|
-
if (context.onlyShowContainer)
|
|
71
|
+
if (context.onlyShowContainer) {
|
|
72
|
+
return null;
|
|
73
|
+
}
|
|
71
74
|
return /* @__PURE__ */ jsx(SheetHandleFrame, {
|
|
72
75
|
ref: composedRef,
|
|
73
76
|
onPressIn: () => {
|
|
@@ -91,7 +94,9 @@ const SheetOverlay = createStyledHOC(SheetOverlayFrame, (propsIn, ref) => {
|
|
|
91
94
|
const context = useSheetContext(scope);
|
|
92
95
|
const isInOverlayLayer = useContext(SheetOverlayLayerContext);
|
|
93
96
|
const didWarn = useRef(false);
|
|
94
|
-
if (context.onlyShowContainer)
|
|
97
|
+
if (context.onlyShowContainer) {
|
|
98
|
+
return null;
|
|
99
|
+
}
|
|
95
100
|
if (!isInOverlayLayer) {
|
|
96
101
|
if (process.env.NODE_ENV === "development" && !didWarn.current) {
|
|
97
102
|
didWarn.current = true;
|
|
@@ -109,19 +114,40 @@ const SheetOverlay = createStyledHOC(SheetOverlayFrame, (propsIn, ref) => {
|
|
|
109
114
|
});
|
|
110
115
|
const SheetContainer = createStyledHOC(SheetContainerFrame, ({ scope, adjustPaddingForOffscreenContent, children, ...props }, forwardedRef) => {
|
|
111
116
|
const context = useSheetContext(scope);
|
|
112
|
-
const { hasFit,
|
|
117
|
+
const { hasFit, frameSize, contentRef, open } = context;
|
|
113
118
|
const composedContentRef = useComposedRefs(forwardedRef, contentRef);
|
|
114
119
|
const offscreenSize = useSheetOffscreenSize(context);
|
|
115
120
|
const stableFrameSize = useRef(frameSize);
|
|
116
121
|
useEffect(() => {
|
|
117
|
-
if (open && frameSize)
|
|
122
|
+
if (open && frameSize) {
|
|
123
|
+
stableFrameSize.current = frameSize;
|
|
124
|
+
}
|
|
118
125
|
}, [open, frameSize]);
|
|
119
126
|
const sheetContents = useMemo(() => {
|
|
127
|
+
if (context.onlyShowContainer) {
|
|
128
|
+
return /* @__PURE__ */ jsx(SheetContainerFrame, {
|
|
129
|
+
ref: composedContentRef,
|
|
130
|
+
flex: hasFit ? 0 : 1,
|
|
131
|
+
flexBasis: hasFit ? "auto" : void 0,
|
|
132
|
+
maxHeight: hasFit ? void 0 : "100%",
|
|
133
|
+
pointerEvents: open ? "auto" : "none",
|
|
134
|
+
"data-state": open ? "open" : "closed",
|
|
135
|
+
...props,
|
|
136
|
+
onLayout: composeEventHandlers(props.onLayout, (event) => {
|
|
137
|
+
context.setFrameSize(event.nativeEvent.layout.height);
|
|
138
|
+
}),
|
|
139
|
+
children: /* @__PURE__ */ jsx(StackZIndexContext, {
|
|
140
|
+
zIndex: resolveViewZIndex(props.zIndex),
|
|
141
|
+
children
|
|
142
|
+
})
|
|
143
|
+
});
|
|
144
|
+
}
|
|
120
145
|
const shouldUseFixedHeight = hasFit && !open && stableFrameSize.current;
|
|
121
146
|
return /* @__PURE__ */ jsxs(SheetContainerFrame, {
|
|
122
147
|
ref: composedContentRef,
|
|
123
148
|
flex: hasFit && open ? 0 : 1,
|
|
124
149
|
flexBasis: hasFit ? "auto" : void 0,
|
|
150
|
+
maxHeight: "100%",
|
|
125
151
|
height: shouldUseFixedHeight ? stableFrameSize.current : hasFit ? void 0 : frameSize,
|
|
126
152
|
pointerEvents: open ? "auto" : "none",
|
|
127
153
|
"data-state": open ? "open" : "closed",
|
|
@@ -141,15 +167,19 @@ const SheetContainer = createStyledHOC(SheetContainerFrame, ({ scope, adjustPadd
|
|
|
141
167
|
frameSize,
|
|
142
168
|
offscreenSize,
|
|
143
169
|
adjustPaddingForOffscreenContent,
|
|
144
|
-
hasFit
|
|
170
|
+
hasFit,
|
|
171
|
+
context.onlyShowContainer,
|
|
172
|
+
context.setFrameSize
|
|
145
173
|
]);
|
|
174
|
+
if (context.onlyShowContainer) return sheetContents;
|
|
146
175
|
return /* @__PURE__ */ jsx(RemoveScroll, {
|
|
147
|
-
enabled: !disableRemoveScroll && context.open,
|
|
176
|
+
enabled: !context.disableRemoveScroll && context.open,
|
|
148
177
|
children: sheetContents
|
|
149
178
|
});
|
|
150
179
|
});
|
|
151
180
|
const SheetBackground = createStyledHOC(SheetBackgroundFrame, ({ scope, disableHideBottomOverflow, ...props }, forwardedRef) => {
|
|
152
181
|
const context = useSheetContext(scope);
|
|
182
|
+
if (context.onlyShowContainer) return null;
|
|
153
183
|
const bottomOverflow = isWeb ? Math.max(context.frameSize, getMaxViewportHeight()) : context.frameSize;
|
|
154
184
|
return /* @__PURE__ */ jsx(SheetBackgroundFrame, {
|
|
155
185
|
ref: forwardedRef,
|
|
@@ -163,10 +193,13 @@ const SheetRoot = createRefComponent(function SheetRoot2(props, ref) {
|
|
|
163
193
|
const isAdapted = useAdaptIsActive();
|
|
164
194
|
const adaptContext = useAdaptContext();
|
|
165
195
|
const { isShowingNonSheet } = useSheetController(props.scope);
|
|
166
|
-
const
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
196
|
+
const shouldUseAdapt = Boolean(adaptContext.open !== void 0 || adaptContext.onOpenChange);
|
|
197
|
+
const isShowingAdaptNonSheet = shouldUseAdapt && !adaptContext.active && adaptContext.open;
|
|
198
|
+
const nativeImplementation = props.native === true || Array.isArray(props.native) && props.native.includes("ios") ? getNativeSheet("ios") : null;
|
|
199
|
+
const SheetImplementation = nativeImplementation ?? SheetImplementationCustom;
|
|
200
|
+
if (isShowingAdaptNonSheet || isShowingNonSheet || !hydrated) {
|
|
201
|
+
return null;
|
|
202
|
+
}
|
|
170
203
|
const implementation = /* @__PURE__ */ jsx(SheetImplementation, {
|
|
171
204
|
ref,
|
|
172
205
|
...props
|
package/dist/jsx/Sheet.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Sheet.js","names":[],"sources":["jsx/Sheet.js"],"sourcesContent":["import { AdaptCapabilities, useAdaptContext, useAdaptIsActive } from \"@tamagui/adapt\";\nimport { useComposedRefs } from \"@tamagui/compose-refs\";\nimport { isWeb } from \"@tamagui/constants\";\nimport { View, createRefComponent, createStyledHOC, styled } from \"@tamagui/core\";\nimport { composeEventHandlers, withStaticProperties } from \"@tamagui/helpers\";\nimport { resolveViewZIndex } from \"@tamagui/portal\";\nimport { RemoveScroll } from \"@tamagui/remove-scroll\";\nimport { XStack, YStack } from \"@tamagui/stacks\";\nimport { useDidFinishSSR } from \"@tamagui/use-did-finish-ssr\";\nimport { StackZIndexContext } from \"@tamagui/z-index-stack\";\nimport { useContext, useEffect, useMemo, useRef } from \"react\";\nimport { Platform } from \"react-native-web\";\nimport { SHEET_BACKGROUND_NAME, SHEET_CONTAINER_NAME, SHEET_HANDLE_NAME, SHEET_OVERLAY_MARKER, SHEET_OVERLAY_NAME } from \"./constants\";\nimport { SheetOverlayLayerContext, useAnimatedPosition, useSheetContext } from \"./SheetContext\";\nimport { SheetImplementationCustom } from \"./SheetImplementationCustom\";\nimport { SheetScrollView } from \"./SheetScrollView\";\nimport { useSheetController } from \"./useSheetController\";\nimport { useSheetOffscreenSize } from \"./useSheetOffscreenSize\";\nimport { getMaxViewportHeight } from \"./webViewport\";\nimport { jsx, jsxs } from \"react/jsx-runtime\";\n\nexport * from \"./types\"\n\nconst SheetHandleFrame = styled(XStack, {\n\tdisplayName: SHEET_HANDLE_NAME,\n\tvariants: { open: {\n\t\ttrue: { pointerEvents: \"auto\" },\n\t\tfalse: { pointerEvents: \"none\" }\n\t} }\n});\nconst SheetOverlayFrame = styled(YStack, {\n\tdisplayName: SHEET_OVERLAY_NAME,\n\tinset: 0,\n\tposition: \"absolute\",\n\tzIndex: 99999,\n\tpointerEvents: \"auto\",\n\tvariants: { open: {\n\t\ttrue: { pointerEvents: \"auto\" },\n\t\tfalse: { pointerEvents: \"none\" }\n\t} }\n});\nObject.assign(SheetOverlayFrame.staticConfig, { [SHEET_OVERLAY_MARKER]: true });\nconst SheetContainerFrame = styled(YStack, {\n\tdisplayName: SHEET_CONTAINER_NAME,\n\tflex: 1,\n\tposition: \"relative\",\n\tzIndex: 0,\n\twidth: \"100%\",\n\tmaxHeight: \"100%\"\n});\nconst SheetBackgroundFrame = styled(YStack, {\n\tdisplayName: SHEET_BACKGROUND_NAME,\n\tposition: \"absolute\",\n\ttop: 0,\n\tleft: 0,\n\tright: 0,\n\tzIndex: -1,\n\tpointerEvents: \"none\"\n});\nconst SheetHandle = createStyledHOC(SheetHandleFrame, ({ scope, ...props }, forwardedRef) => {\n\tconst context = useSheetContext(scope);\n\tconst composedRef = useComposedRefs(context.handleRef, forwardedRef);\n\tconst wasDraggingRef = useRef(false);\n\tuseEffect(() => {\n\t\tif (!context.scrollBridge) return;\n\t\treturn context.scrollBridge.onParentDragging((isDragging) => {\n\t\t\tif (isDragging) wasDraggingRef.current = true;\n\t\t});\n\t}, [context.scrollBridge]);\n\tif (context.onlyShowContainer) return null;\n\treturn /* @__PURE__ */ jsx(SheetHandleFrame, {\n\t\tref: composedRef,\n\t\tonPressIn: () => {\n\t\t\twasDraggingRef.current = false;\n\t\t},\n\t\tonPress: () => {\n\t\t\tif (wasDraggingRef.current) {\n\t\t\t\twasDraggingRef.current = false;\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst max = context.snapPoints.length + (context.dismissOnSnapToBottom ? -1 : 0);\n\t\t\tconst nextPos = (context.position + 1) % max;\n\t\t\tcontext.setPosition(nextPos);\n\t\t},\n\t\topen: context.open,\n\t\t...props\n\t});\n});\nconst SheetOverlay = createStyledHOC(SheetOverlayFrame, (propsIn, ref) => {\n\tconst { scope, ...props } = propsIn;\n\tconst context = useSheetContext(scope);\n\tconst isInOverlayLayer = useContext(SheetOverlayLayerContext);\n\tconst didWarn = useRef(false);\n\tif (context.onlyShowContainer) return null;\n\tif (!isInOverlayLayer) {\n\t\tif (process.env.NODE_ENV === \"development\" && !didWarn.current) {\n\t\t\tdidWarn.current = true;\n\t\t\tconsole.error(\"Sheet.Overlay must be a direct child of Sheet. Move it next to Sheet.Handle and Sheet.Container.\");\n\t\t}\n\t\treturn null;\n\t}\n\treturn /* @__PURE__ */ jsx(SheetOverlayFrame, {\n\t\t...props,\n\t\tref,\n\t\tonPress: composeEventHandlers(props.onPress, context.dismissOnOverlayPress ? () => {\n\t\t\tcontext.setOpen(false);\n\t\t} : void 0)\n\t});\n});\nconst SheetContainer = createStyledHOC(SheetContainerFrame, ({ scope, adjustPaddingForOffscreenContent, children, ...props }, forwardedRef) => {\n\tconst context = useSheetContext(scope);\n\tconst { hasFit, disableRemoveScroll, frameSize, contentRef, open } = context;\n\tconst composedContentRef = useComposedRefs(forwardedRef, contentRef);\n\tconst offscreenSize = useSheetOffscreenSize(context);\n\tconst stableFrameSize = useRef(frameSize);\n\tuseEffect(() => {\n\t\tif (open && frameSize) stableFrameSize.current = frameSize;\n\t}, [open, frameSize]);\n\tconst sheetContents = useMemo(() => {\n\t\tconst shouldUseFixedHeight = hasFit && !open && stableFrameSize.current;\n\t\treturn /* @__PURE__ */ jsxs(SheetContainerFrame, {\n\t\t\tref: composedContentRef,\n\t\t\tflex: hasFit && open ? 0 : 1,\n\t\t\tflexBasis: hasFit ? \"auto\" : void 0,\n\t\t\theight: shouldUseFixedHeight ? stableFrameSize.current : hasFit ? void 0 : frameSize,\n\t\t\tpointerEvents: open ? \"auto\" : \"none\",\n\t\t\t\"data-state\": open ? \"open\" : \"closed\",\n\t\t\t...props,\n\t\t\tchildren: [/* @__PURE__ */ jsx(StackZIndexContext, {\n\t\t\t\tzIndex: resolveViewZIndex(props.zIndex),\n\t\t\t\tchildren\n\t\t\t}), adjustPaddingForOffscreenContent && /* @__PURE__ */ jsx(View, {\n\t\t\t\t\"data-sheet-offscreen-pad\": true,\n\t\t\t\theight: offscreenSize,\n\t\t\t\twidth: \"100%\"\n\t\t\t})]\n\t\t});\n\t}, [\n\t\topen,\n\t\tprops,\n\t\tframeSize,\n\t\toffscreenSize,\n\t\tadjustPaddingForOffscreenContent,\n\t\thasFit\n\t]);\n\treturn /* @__PURE__ */ jsx(RemoveScroll, {\n\t\tenabled: !disableRemoveScroll && context.open,\n\t\tchildren: sheetContents\n\t});\n});\nconst SheetBackground = createStyledHOC(SheetBackgroundFrame, ({ scope, disableHideBottomOverflow, ...props }, forwardedRef) => {\n\tconst context = useSheetContext(scope);\n\tconst bottomOverflow = isWeb ? Math.max(context.frameSize, getMaxViewportHeight()) : context.frameSize;\n\treturn /* @__PURE__ */ jsx(SheetBackgroundFrame, {\n\t\tref: forwardedRef,\n\t\t\"data-sheet-background\": \"\",\n\t\tbottom: disableHideBottomOverflow ? 0 : -bottomOverflow,\n\t\t...props\n\t});\n});\nconst SheetRoot = createRefComponent(function SheetRoot2(props, ref) {\n\tconst hydrated = useDidFinishSSR();\n\tconst isAdapted = useAdaptIsActive();\n\tconst adaptContext = useAdaptContext();\n\tconst { isShowingNonSheet } = useSheetController(props.scope);\n\tconst isShowingAdaptNonSheet = Boolean(adaptContext.open !== void 0 || adaptContext.onOpenChange) && !adaptContext.active && adaptContext.open;\n\tlet SheetImplementation = SheetImplementationCustom;\n\tif (props.native && Platform.OS === \"ios\") {}\n\tif (isShowingAdaptNonSheet || isShowingNonSheet || !hydrated) return null;\n\tconst implementation = /* @__PURE__ */ jsx(SheetImplementation, {\n\t\tref,\n\t\t...props\n\t});\n\treturn isAdapted ? /* @__PURE__ */ jsx(AdaptCapabilities, {\n\t\tscroll: true,\n\t\toverlay: true,\n\t\tdismiss: true,\n\t\tchildren: implementation\n\t}) : implementation;\n});\nconst sheetParts = {\n\tContainer: SheetContainer,\n\tBackground: SheetBackground,\n\tOverlay: SheetOverlay,\n\tHandle: SheetHandle,\n\tScrollView: SheetScrollView\n};\nconst SheetControlled = withStaticProperties(SheetRoot, sheetParts);\nconst Sheet = withStaticProperties(SheetRoot, {\n\tRoot: SheetRoot,\n\tControlled: SheetControlled,\n\tuseAnimatedPosition,\n\t...sheetParts\n});\n\nexport { Sheet, SheetBackground, SheetContainer, SheetControlled, SheetHandle, SheetOverlay, SheetRoot };"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Sheet.js","names":[],"sources":["jsx/Sheet.js"],"sourcesContent":["import { AdaptCapabilities, useAdaptContext, useAdaptIsActive } from \"@tamagui/adapt\";\nimport { useComposedRefs } from \"@tamagui/compose-refs\";\nimport { isWeb } from \"@tamagui/constants\";\nimport {\n createRefComponent,\n createStyledHOC,\n styled,\n View\n} from \"@tamagui/core\";\nimport { composeEventHandlers, withStaticProperties } from \"@tamagui/helpers\";\nimport { resolveViewZIndex } from \"@tamagui/portal\";\nimport { RemoveScroll } from \"@tamagui/remove-scroll\";\nimport { XStack, YStack } from \"@tamagui/stacks\";\nimport { useDidFinishSSR } from \"@tamagui/use-did-finish-ssr\";\nimport { StackZIndexContext } from \"@tamagui/z-index-stack\";\nimport { useContext, useEffect, useMemo, useRef } from \"react\";\nimport {\n SHEET_BACKGROUND_NAME,\n SHEET_CONTAINER_NAME,\n SHEET_HANDLE_NAME,\n SHEET_OVERLAY_MARKER,\n SHEET_OVERLAY_NAME\n} from \"./constants\";\nimport { getNativeSheet } from \"./nativeSheet\";\nimport {\n SheetOverlayLayerContext,\n useAnimatedPosition,\n useSheetContext\n} from \"./SheetContext\";\nimport { SheetImplementationCustom } from \"./SheetImplementationCustom\";\nimport { SheetScrollView } from \"./SheetScrollView\";\nimport { useSheetController } from \"./useSheetController\";\nimport { useSheetOffscreenSize } from \"./useSheetOffscreenSize\";\nimport { getMaxViewportHeight } from \"./webViewport\";\nexport * from \"./types\";\nimport { jsx, jsxs } from \"react/jsx-runtime\";\nconst SheetHandleFrame = styled(XStack, {\n displayName: SHEET_HANDLE_NAME,\n // the behavior Handle ships no opacity rules; open/close aesthetics (fade in\n // when open, dim when idle) live in the copied skin. see the canonical skin.\n variants: {\n open: {\n true: {\n pointerEvents: \"auto\"\n },\n false: {\n pointerEvents: \"none\"\n }\n }\n }\n});\nconst SheetOverlayFrame = styled(YStack, {\n displayName: SHEET_OVERLAY_NAME,\n inset: 0,\n position: \"absolute\",\n zIndex: 1e5 - 1,\n pointerEvents: \"auto\",\n variants: {\n open: {\n true: {\n pointerEvents: \"auto\"\n },\n false: {\n pointerEvents: \"none\"\n }\n }\n }\n});\nObject.assign(SheetOverlayFrame.staticConfig, { [SHEET_OVERLAY_MARKER]: true });\nconst SheetContainerFrame = styled(YStack, {\n displayName: SHEET_CONTAINER_NAME,\n flex: 1,\n position: \"relative\",\n zIndex: 0,\n width: \"100%\"\n});\nconst SheetBackgroundFrame = styled(YStack, {\n displayName: SHEET_BACKGROUND_NAME,\n position: \"absolute\",\n top: 0,\n left: 0,\n right: 0,\n zIndex: -1,\n pointerEvents: \"none\"\n});\nconst SheetHandle = createStyledHOC(\n SheetHandleFrame,\n ({ scope, ...props }, forwardedRef) => {\n const context = useSheetContext(scope);\n const composedRef = useComposedRefs(context.handleRef, forwardedRef);\n const wasDraggingRef = useRef(false);\n useEffect(() => {\n if (!context.scrollBridge) return;\n return context.scrollBridge.onParentDragging((isDragging) => {\n if (isDragging) {\n wasDraggingRef.current = true;\n }\n });\n }, [context.scrollBridge]);\n if (context.onlyShowContainer) {\n return null;\n }\n return /* @__PURE__ */ jsx(\n SheetHandleFrame,\n {\n ref: composedRef,\n onPressIn: () => {\n wasDraggingRef.current = false;\n },\n onPress: () => {\n if (wasDraggingRef.current) {\n wasDraggingRef.current = false;\n return;\n }\n const max = context.snapPoints.length + (context.dismissOnSnapToBottom ? -1 : 0);\n const nextPos = (context.position + 1) % max;\n context.setPosition(nextPos);\n },\n open: context.open,\n ...props\n }\n );\n }\n);\nconst SheetOverlay = createStyledHOC(\n SheetOverlayFrame,\n (propsIn, ref) => {\n const { scope, ...props } = propsIn;\n const context = useSheetContext(scope);\n const isInOverlayLayer = useContext(SheetOverlayLayerContext);\n const didWarn = useRef(false);\n if (context.onlyShowContainer) {\n return null;\n }\n if (!isInOverlayLayer) {\n if (process.env.NODE_ENV === \"development\" && !didWarn.current) {\n didWarn.current = true;\n console.error(\n \"Sheet.Overlay must be a direct child of Sheet. Move it next to Sheet.Handle and Sheet.Container.\"\n );\n }\n return null;\n }\n return /* @__PURE__ */ jsx(\n SheetOverlayFrame,\n {\n ...props,\n ref,\n onPress: composeEventHandlers(\n props.onPress,\n context.dismissOnOverlayPress ? () => {\n context.setOpen(false);\n } : void 0\n )\n }\n );\n }\n);\nconst SheetContainer = createStyledHOC(\n SheetContainerFrame,\n ({\n scope,\n adjustPaddingForOffscreenContent,\n children,\n ...props\n }, forwardedRef) => {\n const context = useSheetContext(scope);\n const { hasFit, frameSize, contentRef, open } = context;\n const composedContentRef = useComposedRefs(forwardedRef, contentRef);\n const offscreenSize = useSheetOffscreenSize(context);\n const stableFrameSize = useRef(frameSize);\n useEffect(() => {\n if (open && frameSize) {\n stableFrameSize.current = frameSize;\n }\n }, [open, frameSize]);\n const sheetContents = useMemo(() => {\n if (context.onlyShowContainer) {\n return /* @__PURE__ */ jsx(\n SheetContainerFrame,\n {\n ref: composedContentRef,\n flex: hasFit ? 0 : 1,\n flexBasis: hasFit ? \"auto\" : void 0,\n maxHeight: hasFit ? void 0 : \"100%\",\n pointerEvents: open ? \"auto\" : \"none\",\n \"data-state\": open ? \"open\" : \"closed\",\n ...props,\n onLayout: composeEventHandlers(props.onLayout, (event) => {\n context.setFrameSize(event.nativeEvent.layout.height);\n }),\n children: /* @__PURE__ */ jsx(StackZIndexContext, { zIndex: resolveViewZIndex(props.zIndex), children })\n }\n );\n }\n const shouldUseFixedHeight = hasFit && !open && stableFrameSize.current;\n return /* @__PURE__ */ jsxs(\n SheetContainerFrame,\n {\n ref: composedContentRef,\n flex: hasFit && open ? 0 : 1,\n flexBasis: hasFit ? \"auto\" : void 0,\n maxHeight: \"100%\",\n height: shouldUseFixedHeight ? stableFrameSize.current : hasFit ? void 0 : frameSize,\n pointerEvents: open ? \"auto\" : \"none\",\n \"data-state\": open ? \"open\" : \"closed\",\n ...props,\n children: [\n /* @__PURE__ */ jsx(StackZIndexContext, { zIndex: resolveViewZIndex(props.zIndex), children }),\n adjustPaddingForOffscreenContent && /* @__PURE__ */ jsx(View, { \"data-sheet-offscreen-pad\": true, height: offscreenSize, width: \"100%\" })\n ]\n }\n );\n }, [\n open,\n props,\n frameSize,\n offscreenSize,\n adjustPaddingForOffscreenContent,\n hasFit,\n context.onlyShowContainer,\n context.setFrameSize\n ]);\n if (context.onlyShowContainer) return sheetContents;\n return /* @__PURE__ */ jsx(RemoveScroll, { enabled: !context.disableRemoveScroll && context.open, children: sheetContents });\n }\n);\nconst SheetBackground = createStyledHOC(\n SheetBackgroundFrame,\n ({ scope, disableHideBottomOverflow, ...props }, forwardedRef) => {\n const context = useSheetContext(scope);\n if (context.onlyShowContainer) return null;\n const bottomOverflow = isWeb ? Math.max(context.frameSize, getMaxViewportHeight()) : context.frameSize;\n return /* @__PURE__ */ jsx(\n SheetBackgroundFrame,\n {\n ref: forwardedRef,\n \"data-sheet-background\": \"\",\n bottom: disableHideBottomOverflow ? 0 : -bottomOverflow,\n ...props\n }\n );\n }\n);\nconst SheetRoot = createRefComponent(\n function SheetRoot2(props, ref) {\n const hydrated = useDidFinishSSR();\n const isAdapted = useAdaptIsActive();\n const adaptContext = useAdaptContext();\n const { isShowingNonSheet } = useSheetController(props.scope);\n const shouldUseAdapt = Boolean(\n adaptContext.open !== void 0 || adaptContext.onOpenChange\n );\n const isShowingAdaptNonSheet = shouldUseAdapt && !adaptContext.active && adaptContext.open;\n const nativeImplementation = props.native === true || Array.isArray(props.native) && props.native.includes(\"ios\") ? getNativeSheet(\"ios\") : null;\n const SheetImplementation = nativeImplementation ?? SheetImplementationCustom;\n if (isShowingAdaptNonSheet || isShowingNonSheet || !hydrated) {\n return null;\n }\n const implementation = /* @__PURE__ */ jsx(SheetImplementation, { ref, ...props });\n return isAdapted ? /* @__PURE__ */ jsx(AdaptCapabilities, { scroll: true, overlay: true, dismiss: true, children: implementation }) : implementation;\n }\n);\nconst sheetParts = {\n Container: SheetContainer,\n Background: SheetBackground,\n Overlay: SheetOverlay,\n Handle: SheetHandle,\n ScrollView: SheetScrollView\n};\nconst SheetControlled = withStaticProperties(\n SheetRoot,\n sheetParts\n);\nconst Sheet = withStaticProperties(SheetRoot, {\n Root: SheetRoot,\n Controlled: SheetControlled,\n useAnimatedPosition,\n ...sheetParts\n});\nexport {\n Sheet,\n SheetBackground,\n SheetContainer,\n SheetControlled,\n SheetHandle,\n SheetOverlay,\n SheetRoot\n};\n//# sourceMappingURL=Sheet.js.map\n"],"mappings":"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"}
|
|
@@ -44,7 +44,6 @@ var import_stacks = require("@tamagui/stacks");
|
|
|
44
44
|
var import_use_did_finish_ssr = require("@tamagui/use-did-finish-ssr");
|
|
45
45
|
var import_z_index_stack = require("@tamagui/z-index-stack");
|
|
46
46
|
var import_react = require("react");
|
|
47
|
-
var import_react_native = require("react-native");
|
|
48
47
|
var import_constants2 = require("./constants.native.js");
|
|
49
48
|
var import_nativeSheet = require("./nativeSheet.native.js");
|
|
50
49
|
var import_SheetContext = require("./SheetContext.native.js");
|
|
@@ -65,7 +64,7 @@ var SheetOverlayFrame = (0, import_core.styled)(import_stacks.YStack, {
|
|
|
65
64
|
displayName: import_constants2.SHEET_OVERLAY_NAME,
|
|
66
65
|
inset: 0,
|
|
67
66
|
position: "absolute",
|
|
68
|
-
zIndex:
|
|
67
|
+
zIndex: 1e5 - 1,
|
|
69
68
|
pointerEvents: "auto",
|
|
70
69
|
variants: { open: {
|
|
71
70
|
true: { pointerEvents: "auto" },
|
|
@@ -78,8 +77,7 @@ var SheetContainerFrame = (0, import_core.styled)(import_stacks.YStack, {
|
|
|
78
77
|
flex: 1,
|
|
79
78
|
position: "relative",
|
|
80
79
|
zIndex: 0,
|
|
81
|
-
width: "100%"
|
|
82
|
-
maxHeight: "100%"
|
|
80
|
+
width: "100%"
|
|
83
81
|
});
|
|
84
82
|
var SheetBackgroundFrame = (0, import_core.styled)(import_stacks.YStack, {
|
|
85
83
|
displayName: import_constants2.SHEET_BACKGROUND_NAME,
|
|
@@ -98,10 +96,14 @@ var SheetHandle = (0, import_core.createStyledHOC)(SheetHandleFrame, function(pa
|
|
|
98
96
|
(0, import_react.useEffect)(function() {
|
|
99
97
|
if (!context.scrollBridge) return;
|
|
100
98
|
return context.scrollBridge.onParentDragging(function(isDragging) {
|
|
101
|
-
if (isDragging)
|
|
99
|
+
if (isDragging) {
|
|
100
|
+
wasDraggingRef.current = true;
|
|
101
|
+
}
|
|
102
102
|
});
|
|
103
103
|
}, [context.scrollBridge]);
|
|
104
|
-
if (context.onlyShowContainer)
|
|
104
|
+
if (context.onlyShowContainer) {
|
|
105
|
+
return null;
|
|
106
|
+
}
|
|
105
107
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SheetHandleFrame, {
|
|
106
108
|
ref: composedRef,
|
|
107
109
|
onPressIn: function() {
|
|
@@ -125,7 +127,9 @@ var SheetOverlay = (0, import_core.createStyledHOC)(SheetOverlayFrame, function(
|
|
|
125
127
|
var context = (0, import_SheetContext.useSheetContext)(scope);
|
|
126
128
|
var isInOverlayLayer = (0, import_react.useContext)(import_SheetContext.SheetOverlayLayerContext);
|
|
127
129
|
var didWarn = (0, import_react.useRef)(false);
|
|
128
|
-
if (context.onlyShowContainer)
|
|
130
|
+
if (context.onlyShowContainer) {
|
|
131
|
+
return null;
|
|
132
|
+
}
|
|
129
133
|
if (!isInOverlayLayer) {
|
|
130
134
|
if (process.env.NODE_ENV === "development" && !didWarn.current) {
|
|
131
135
|
didWarn.current = true;
|
|
@@ -144,19 +148,40 @@ var SheetOverlay = (0, import_core.createStyledHOC)(SheetOverlayFrame, function(
|
|
|
144
148
|
var SheetContainer = (0, import_core.createStyledHOC)(SheetContainerFrame, function(param, forwardedRef) {
|
|
145
149
|
var { scope, adjustPaddingForOffscreenContent, children, ...props } = param;
|
|
146
150
|
var context = (0, import_SheetContext.useSheetContext)(scope);
|
|
147
|
-
var { hasFit,
|
|
151
|
+
var { hasFit, frameSize, contentRef, open } = context;
|
|
148
152
|
var composedContentRef = (0, import_compose_refs.useComposedRefs)(forwardedRef, contentRef);
|
|
149
153
|
var offscreenSize = (0, import_useSheetOffscreenSize.useSheetOffscreenSize)(context);
|
|
150
154
|
var stableFrameSize = (0, import_react.useRef)(frameSize);
|
|
151
155
|
(0, import_react.useEffect)(function() {
|
|
152
|
-
if (open && frameSize)
|
|
156
|
+
if (open && frameSize) {
|
|
157
|
+
stableFrameSize.current = frameSize;
|
|
158
|
+
}
|
|
153
159
|
}, [open, frameSize]);
|
|
154
160
|
var sheetContents = (0, import_react.useMemo)(function() {
|
|
161
|
+
if (context.onlyShowContainer) {
|
|
162
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SheetContainerFrame, {
|
|
163
|
+
ref: composedContentRef,
|
|
164
|
+
flex: hasFit ? 0 : 1,
|
|
165
|
+
flexBasis: hasFit ? "auto" : void 0,
|
|
166
|
+
maxHeight: hasFit ? void 0 : "100%",
|
|
167
|
+
pointerEvents: open ? "auto" : "none",
|
|
168
|
+
"data-state": open ? "open" : "closed",
|
|
169
|
+
...props,
|
|
170
|
+
onLayout: (0, import_helpers.composeEventHandlers)(props.onLayout, function(event) {
|
|
171
|
+
context.setFrameSize(event.nativeEvent.layout.height);
|
|
172
|
+
}),
|
|
173
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_z_index_stack.StackZIndexContext, {
|
|
174
|
+
zIndex: (0, import_portal.resolveViewZIndex)(props.zIndex),
|
|
175
|
+
children
|
|
176
|
+
})
|
|
177
|
+
});
|
|
178
|
+
}
|
|
155
179
|
var shouldUseFixedHeight = hasFit && !open && stableFrameSize.current;
|
|
156
180
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(SheetContainerFrame, {
|
|
157
181
|
ref: composedContentRef,
|
|
158
182
|
flex: hasFit && open ? 0 : 1,
|
|
159
183
|
flexBasis: hasFit ? "auto" : void 0,
|
|
184
|
+
maxHeight: "100%",
|
|
160
185
|
height: shouldUseFixedHeight ? stableFrameSize.current : hasFit ? void 0 : frameSize,
|
|
161
186
|
pointerEvents: open ? "auto" : "none",
|
|
162
187
|
"data-state": open ? "open" : "closed",
|
|
@@ -176,16 +201,20 @@ var SheetContainer = (0, import_core.createStyledHOC)(SheetContainerFrame, funct
|
|
|
176
201
|
frameSize,
|
|
177
202
|
offscreenSize,
|
|
178
203
|
adjustPaddingForOffscreenContent,
|
|
179
|
-
hasFit
|
|
204
|
+
hasFit,
|
|
205
|
+
context.onlyShowContainer,
|
|
206
|
+
context.setFrameSize
|
|
180
207
|
]);
|
|
208
|
+
if (context.onlyShowContainer) return sheetContents;
|
|
181
209
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_remove_scroll.RemoveScroll, {
|
|
182
|
-
enabled: !disableRemoveScroll && context.open,
|
|
210
|
+
enabled: !context.disableRemoveScroll && context.open,
|
|
183
211
|
children: sheetContents
|
|
184
212
|
});
|
|
185
213
|
});
|
|
186
214
|
var SheetBackground = (0, import_core.createStyledHOC)(SheetBackgroundFrame, function(param, forwardedRef) {
|
|
187
215
|
var { scope, disableHideBottomOverflow, ...props } = param;
|
|
188
216
|
var context = (0, import_SheetContext.useSheetContext)(scope);
|
|
217
|
+
if (context.onlyShowContainer) return null;
|
|
189
218
|
var bottomOverflow = import_constants.isWeb ? Math.max(context.frameSize, (0, import_webViewport.getMaxViewportHeight)()) : context.frameSize;
|
|
190
219
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SheetBackgroundFrame, {
|
|
191
220
|
ref: forwardedRef,
|
|
@@ -199,13 +228,13 @@ var SheetRoot = (0, import_core.createRefComponent)(function SheetRoot2(props, r
|
|
|
199
228
|
var isAdapted = (0, import_adapt.useAdaptIsActive)();
|
|
200
229
|
var adaptContext = (0, import_adapt.useAdaptContext)();
|
|
201
230
|
var { isShowingNonSheet } = (0, import_useSheetController.useSheetController)(props.scope);
|
|
202
|
-
var
|
|
203
|
-
var
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
231
|
+
var shouldUseAdapt = Boolean(adaptContext.open !== void 0 || adaptContext.onOpenChange);
|
|
232
|
+
var isShowingAdaptNonSheet = shouldUseAdapt && !adaptContext.active && adaptContext.open;
|
|
233
|
+
var nativeImplementation = props.native === true || Array.isArray(props.native) && props.native.includes("ios") ? (0, import_nativeSheet.getNativeSheet)("ios") : null;
|
|
234
|
+
var SheetImplementation = nativeImplementation !== null && nativeImplementation !== void 0 ? nativeImplementation : import_SheetImplementationCustom.SheetImplementationCustom;
|
|
235
|
+
if (isShowingAdaptNonSheet || isShowingNonSheet || !hydrated) {
|
|
236
|
+
return null;
|
|
207
237
|
}
|
|
208
|
-
if (isShowingAdaptNonSheet || isShowingNonSheet || !hydrated) return null;
|
|
209
238
|
var implementation = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SheetImplementation, {
|
|
210
239
|
ref,
|
|
211
240
|
...props
|
package/dist/jsx/Sheet.native.js
CHANGED
|
@@ -44,7 +44,6 @@ var import_stacks = require("@tamagui/stacks");
|
|
|
44
44
|
var import_use_did_finish_ssr = require("@tamagui/use-did-finish-ssr");
|
|
45
45
|
var import_z_index_stack = require("@tamagui/z-index-stack");
|
|
46
46
|
var import_react = require("react");
|
|
47
|
-
var import_react_native = require("react-native");
|
|
48
47
|
var import_constants2 = require("./constants.native.js");
|
|
49
48
|
var import_nativeSheet = require("./nativeSheet.native.js");
|
|
50
49
|
var import_SheetContext = require("./SheetContext.native.js");
|
|
@@ -65,7 +64,7 @@ var SheetOverlayFrame = (0, import_core.styled)(import_stacks.YStack, {
|
|
|
65
64
|
displayName: import_constants2.SHEET_OVERLAY_NAME,
|
|
66
65
|
inset: 0,
|
|
67
66
|
position: "absolute",
|
|
68
|
-
zIndex:
|
|
67
|
+
zIndex: 1e5 - 1,
|
|
69
68
|
pointerEvents: "auto",
|
|
70
69
|
variants: { open: {
|
|
71
70
|
true: { pointerEvents: "auto" },
|
|
@@ -78,8 +77,7 @@ var SheetContainerFrame = (0, import_core.styled)(import_stacks.YStack, {
|
|
|
78
77
|
flex: 1,
|
|
79
78
|
position: "relative",
|
|
80
79
|
zIndex: 0,
|
|
81
|
-
width: "100%"
|
|
82
|
-
maxHeight: "100%"
|
|
80
|
+
width: "100%"
|
|
83
81
|
});
|
|
84
82
|
var SheetBackgroundFrame = (0, import_core.styled)(import_stacks.YStack, {
|
|
85
83
|
displayName: import_constants2.SHEET_BACKGROUND_NAME,
|
|
@@ -98,10 +96,14 @@ var SheetHandle = (0, import_core.createStyledHOC)(SheetHandleFrame, function(pa
|
|
|
98
96
|
(0, import_react.useEffect)(function() {
|
|
99
97
|
if (!context.scrollBridge) return;
|
|
100
98
|
return context.scrollBridge.onParentDragging(function(isDragging) {
|
|
101
|
-
if (isDragging)
|
|
99
|
+
if (isDragging) {
|
|
100
|
+
wasDraggingRef.current = true;
|
|
101
|
+
}
|
|
102
102
|
});
|
|
103
103
|
}, [context.scrollBridge]);
|
|
104
|
-
if (context.onlyShowContainer)
|
|
104
|
+
if (context.onlyShowContainer) {
|
|
105
|
+
return null;
|
|
106
|
+
}
|
|
105
107
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SheetHandleFrame, {
|
|
106
108
|
ref: composedRef,
|
|
107
109
|
onPressIn: function() {
|
|
@@ -125,7 +127,9 @@ var SheetOverlay = (0, import_core.createStyledHOC)(SheetOverlayFrame, function(
|
|
|
125
127
|
var context = (0, import_SheetContext.useSheetContext)(scope);
|
|
126
128
|
var isInOverlayLayer = (0, import_react.useContext)(import_SheetContext.SheetOverlayLayerContext);
|
|
127
129
|
var didWarn = (0, import_react.useRef)(false);
|
|
128
|
-
if (context.onlyShowContainer)
|
|
130
|
+
if (context.onlyShowContainer) {
|
|
131
|
+
return null;
|
|
132
|
+
}
|
|
129
133
|
if (!isInOverlayLayer) {
|
|
130
134
|
if (process.env.NODE_ENV === "development" && !didWarn.current) {
|
|
131
135
|
didWarn.current = true;
|
|
@@ -144,19 +148,40 @@ var SheetOverlay = (0, import_core.createStyledHOC)(SheetOverlayFrame, function(
|
|
|
144
148
|
var SheetContainer = (0, import_core.createStyledHOC)(SheetContainerFrame, function(param, forwardedRef) {
|
|
145
149
|
var { scope, adjustPaddingForOffscreenContent, children, ...props } = param;
|
|
146
150
|
var context = (0, import_SheetContext.useSheetContext)(scope);
|
|
147
|
-
var { hasFit,
|
|
151
|
+
var { hasFit, frameSize, contentRef, open } = context;
|
|
148
152
|
var composedContentRef = (0, import_compose_refs.useComposedRefs)(forwardedRef, contentRef);
|
|
149
153
|
var offscreenSize = (0, import_useSheetOffscreenSize.useSheetOffscreenSize)(context);
|
|
150
154
|
var stableFrameSize = (0, import_react.useRef)(frameSize);
|
|
151
155
|
(0, import_react.useEffect)(function() {
|
|
152
|
-
if (open && frameSize)
|
|
156
|
+
if (open && frameSize) {
|
|
157
|
+
stableFrameSize.current = frameSize;
|
|
158
|
+
}
|
|
153
159
|
}, [open, frameSize]);
|
|
154
160
|
var sheetContents = (0, import_react.useMemo)(function() {
|
|
161
|
+
if (context.onlyShowContainer) {
|
|
162
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SheetContainerFrame, {
|
|
163
|
+
ref: composedContentRef,
|
|
164
|
+
flex: hasFit ? 0 : 1,
|
|
165
|
+
flexBasis: hasFit ? "auto" : void 0,
|
|
166
|
+
maxHeight: hasFit ? void 0 : "100%",
|
|
167
|
+
pointerEvents: open ? "auto" : "none",
|
|
168
|
+
"data-state": open ? "open" : "closed",
|
|
169
|
+
...props,
|
|
170
|
+
onLayout: (0, import_helpers.composeEventHandlers)(props.onLayout, function(event) {
|
|
171
|
+
context.setFrameSize(event.nativeEvent.layout.height);
|
|
172
|
+
}),
|
|
173
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_z_index_stack.StackZIndexContext, {
|
|
174
|
+
zIndex: (0, import_portal.resolveViewZIndex)(props.zIndex),
|
|
175
|
+
children
|
|
176
|
+
})
|
|
177
|
+
});
|
|
178
|
+
}
|
|
155
179
|
var shouldUseFixedHeight = hasFit && !open && stableFrameSize.current;
|
|
156
180
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(SheetContainerFrame, {
|
|
157
181
|
ref: composedContentRef,
|
|
158
182
|
flex: hasFit && open ? 0 : 1,
|
|
159
183
|
flexBasis: hasFit ? "auto" : void 0,
|
|
184
|
+
maxHeight: "100%",
|
|
160
185
|
height: shouldUseFixedHeight ? stableFrameSize.current : hasFit ? void 0 : frameSize,
|
|
161
186
|
pointerEvents: open ? "auto" : "none",
|
|
162
187
|
"data-state": open ? "open" : "closed",
|
|
@@ -176,16 +201,20 @@ var SheetContainer = (0, import_core.createStyledHOC)(SheetContainerFrame, funct
|
|
|
176
201
|
frameSize,
|
|
177
202
|
offscreenSize,
|
|
178
203
|
adjustPaddingForOffscreenContent,
|
|
179
|
-
hasFit
|
|
204
|
+
hasFit,
|
|
205
|
+
context.onlyShowContainer,
|
|
206
|
+
context.setFrameSize
|
|
180
207
|
]);
|
|
208
|
+
if (context.onlyShowContainer) return sheetContents;
|
|
181
209
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_remove_scroll.RemoveScroll, {
|
|
182
|
-
enabled: !disableRemoveScroll && context.open,
|
|
210
|
+
enabled: !context.disableRemoveScroll && context.open,
|
|
183
211
|
children: sheetContents
|
|
184
212
|
});
|
|
185
213
|
});
|
|
186
214
|
var SheetBackground = (0, import_core.createStyledHOC)(SheetBackgroundFrame, function(param, forwardedRef) {
|
|
187
215
|
var { scope, disableHideBottomOverflow, ...props } = param;
|
|
188
216
|
var context = (0, import_SheetContext.useSheetContext)(scope);
|
|
217
|
+
if (context.onlyShowContainer) return null;
|
|
189
218
|
var bottomOverflow = import_constants.isWeb ? Math.max(context.frameSize, (0, import_webViewport.getMaxViewportHeight)()) : context.frameSize;
|
|
190
219
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SheetBackgroundFrame, {
|
|
191
220
|
ref: forwardedRef,
|
|
@@ -199,13 +228,13 @@ var SheetRoot = (0, import_core.createRefComponent)(function SheetRoot2(props, r
|
|
|
199
228
|
var isAdapted = (0, import_adapt.useAdaptIsActive)();
|
|
200
229
|
var adaptContext = (0, import_adapt.useAdaptContext)();
|
|
201
230
|
var { isShowingNonSheet } = (0, import_useSheetController.useSheetController)(props.scope);
|
|
202
|
-
var
|
|
203
|
-
var
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
231
|
+
var shouldUseAdapt = Boolean(adaptContext.open !== void 0 || adaptContext.onOpenChange);
|
|
232
|
+
var isShowingAdaptNonSheet = shouldUseAdapt && !adaptContext.active && adaptContext.open;
|
|
233
|
+
var nativeImplementation = props.native === true || Array.isArray(props.native) && props.native.includes("ios") ? (0, import_nativeSheet.getNativeSheet)("ios") : null;
|
|
234
|
+
var SheetImplementation = nativeImplementation !== null && nativeImplementation !== void 0 ? nativeImplementation : import_SheetImplementationCustom.SheetImplementationCustom;
|
|
235
|
+
if (isShowingAdaptNonSheet || isShowingNonSheet || !hydrated) {
|
|
236
|
+
return null;
|
|
207
237
|
}
|
|
208
|
-
if (isShowingAdaptNonSheet || isShowingNonSheet || !hydrated) return null;
|
|
209
238
|
var implementation = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SheetImplementation, {
|
|
210
239
|
ref,
|
|
211
240
|
...props
|