@tamagui/sheet 1.61.2 → 1.62.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.js +16 -30
- package/dist/cjs/Sheet.js.map +1 -1
- package/dist/cjs/Sheet.native.js +119 -0
- package/dist/cjs/Sheet.native.js.map +6 -0
- package/dist/cjs/SheetContext.js +7 -13
- package/dist/cjs/SheetContext.js.map +1 -1
- package/dist/cjs/SheetContext.native.js +36 -0
- package/dist/cjs/SheetContext.native.js.map +6 -0
- package/dist/cjs/SheetController.js +7 -15
- package/dist/cjs/SheetController.js.map +1 -1
- package/dist/cjs/SheetController.native.js +42 -0
- package/dist/cjs/SheetController.native.js.map +6 -0
- package/dist/cjs/SheetImplementationCustom.js +99 -240
- package/dist/cjs/SheetImplementationCustom.js.map +2 -2
- package/dist/cjs/SheetImplementationCustom.native.js +281 -0
- package/dist/cjs/SheetImplementationCustom.native.js.map +6 -0
- package/dist/cjs/SheetScrollView.js +18 -44
- package/dist/cjs/SheetScrollView.js.map +1 -1
- package/dist/cjs/SheetScrollView.native.js +69 -0
- package/dist/cjs/SheetScrollView.native.js.map +6 -0
- package/dist/cjs/constants.js +7 -17
- package/dist/cjs/constants.js.map +1 -1
- package/dist/cjs/constants.native.js +36 -0
- package/dist/cjs/constants.native.js.map +6 -0
- package/dist/cjs/contexts.js +6 -11
- package/dist/cjs/contexts.js.map +1 -1
- package/dist/cjs/contexts.native.js +31 -0
- package/dist/cjs/contexts.native.js.map +6 -0
- package/dist/cjs/createSheet.js +42 -90
- package/dist/cjs/createSheet.js.map +2 -2
- package/dist/cjs/createSheet.native.js +146 -0
- package/dist/cjs/createSheet.native.js.map +6 -0
- package/dist/cjs/helpers.js +6 -13
- package/dist/cjs/helpers.js.map +1 -1
- package/dist/cjs/helpers.native.js +32 -0
- package/dist/cjs/helpers.native.js.map +6 -0
- package/dist/cjs/index.js +6 -11
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/index.native.js +36 -0
- package/dist/cjs/index.native.js.map +6 -0
- package/dist/cjs/nativeSheet.js +25 -42
- package/dist/cjs/nativeSheet.js.map +1 -1
- package/dist/cjs/nativeSheet.native.js +55 -0
- package/dist/cjs/nativeSheet.native.js.map +6 -0
- package/dist/cjs/types.js +3 -6
- package/dist/cjs/types.js.map +1 -1
- package/dist/cjs/types.native.js +15 -0
- package/dist/cjs/types.native.js.map +6 -0
- package/dist/cjs/useSheet.js +5 -9
- package/dist/cjs/useSheet.js.map +1 -1
- package/dist/cjs/useSheet.native.js +27 -0
- package/dist/cjs/useSheet.native.js.map +6 -0
- package/dist/cjs/useSheetController.js +8 -15
- package/dist/cjs/useSheetController.js.map +1 -1
- package/dist/cjs/useSheetController.native.js +39 -0
- package/dist/cjs/useSheetController.native.js.map +6 -0
- package/dist/cjs/useSheetOffscreenSize.js +13 -30
- package/dist/cjs/useSheetOffscreenSize.js.map +2 -2
- package/dist/cjs/useSheetOffscreenSize.native.js +48 -0
- package/dist/cjs/useSheetOffscreenSize.native.js.map +6 -0
- package/dist/cjs/useSheetOpenState.js +12 -21
- package/dist/cjs/useSheetOpenState.js.map +1 -1
- package/dist/cjs/useSheetOpenState.native.js +43 -0
- package/dist/cjs/useSheetOpenState.native.js.map +6 -0
- package/dist/cjs/useSheetProviderProps.js +44 -96
- package/dist/cjs/useSheetProviderProps.js.map +1 -1
- package/dist/cjs/useSheetProviderProps.native.js +116 -0
- package/dist/cjs/useSheetProviderProps.native.js.map +6 -0
- package/dist/esm/Sheet.js +9 -14
- package/dist/esm/Sheet.js.map +1 -1
- package/dist/esm/SheetContext.js +1 -2
- package/dist/esm/SheetContext.js.map +1 -1
- package/dist/esm/SheetController.js +2 -3
- package/dist/esm/SheetController.js.map +1 -1
- package/dist/esm/SheetImplementationCustom.js +95 -217
- package/dist/esm/SheetImplementationCustom.js.map +2 -2
- package/dist/esm/SheetScrollView.js +13 -31
- package/dist/esm/SheetScrollView.js.map +1 -1
- package/dist/esm/constants.js +2 -8
- package/dist/esm/constants.js.map +1 -1
- package/dist/esm/contexts.js +1 -2
- package/dist/esm/contexts.js.map +1 -1
- package/dist/esm/createSheet.js +38 -70
- package/dist/esm/createSheet.js.map +2 -2
- package/dist/esm/helpers.js +1 -4
- package/dist/esm/helpers.js.map +1 -1
- package/dist/esm/nativeSheet.js +20 -27
- package/dist/esm/nativeSheet.js.map +1 -1
- package/dist/esm/useSheetController.js +3 -6
- package/dist/esm/useSheetController.js.map +1 -1
- package/dist/esm/useSheetOffscreenSize.js +8 -21
- package/dist/esm/useSheetOffscreenSize.js.map +2 -2
- package/dist/esm/useSheetOpenState.js +6 -10
- package/dist/esm/useSheetOpenState.js.map +1 -1
- package/dist/esm/useSheetProviderProps.js +36 -79
- package/dist/esm/useSheetProviderProps.js.map +1 -1
- package/dist/jsx/Sheet.js +9 -14
- package/dist/jsx/Sheet.js.map +1 -1
- package/dist/jsx/Sheet.native.js +95 -0
- package/dist/jsx/Sheet.native.js.map +6 -0
- package/dist/jsx/SheetContext.js +1 -2
- package/dist/jsx/SheetContext.js.map +1 -1
- package/dist/jsx/SheetContext.native.js +13 -0
- package/dist/jsx/SheetContext.native.js.map +6 -0
- package/dist/jsx/SheetController.js +1 -2
- package/dist/jsx/SheetController.js.map +1 -1
- package/dist/jsx/SheetController.native.js +23 -0
- package/dist/jsx/SheetController.native.js.map +6 -0
- package/dist/jsx/SheetImplementationCustom.js +90 -210
- package/dist/jsx/SheetImplementationCustom.js.map +2 -2
- package/dist/jsx/SheetImplementationCustom.native.js +288 -0
- package/dist/jsx/SheetImplementationCustom.native.js.map +6 -0
- package/dist/jsx/SheetScrollView.js +12 -30
- package/dist/jsx/SheetScrollView.js.map +1 -1
- package/dist/jsx/SheetScrollView.native.js +47 -0
- package/dist/jsx/SheetScrollView.native.js.map +6 -0
- package/dist/jsx/constants.js +2 -8
- package/dist/jsx/constants.js.map +1 -1
- package/dist/jsx/constants.native.js +11 -0
- package/dist/jsx/constants.native.js.map +6 -0
- package/dist/jsx/contexts.js +1 -2
- package/dist/jsx/contexts.js.map +1 -1
- package/dist/jsx/contexts.native.js +9 -0
- package/dist/jsx/contexts.native.js.map +6 -0
- package/dist/jsx/createSheet.js +30 -61
- package/dist/jsx/createSheet.js.map +2 -2
- package/dist/jsx/createSheet.native.js +128 -0
- package/dist/jsx/createSheet.native.js.map +6 -0
- package/dist/jsx/helpers.js +1 -4
- package/dist/jsx/helpers.js.map +1 -1
- package/dist/jsx/helpers.native.js +11 -0
- package/dist/jsx/helpers.native.js.map +6 -0
- package/dist/jsx/index.native.js +10 -0
- package/dist/jsx/index.native.js.map +6 -0
- package/dist/jsx/nativeSheet.js +21 -27
- package/dist/jsx/nativeSheet.js.map +1 -1
- package/dist/jsx/nativeSheet.native.js +40 -0
- package/dist/jsx/nativeSheet.native.js.map +6 -0
- package/dist/jsx/types.native.js +1 -0
- package/dist/jsx/types.native.js.map +6 -0
- package/dist/jsx/useSheet.native.js +6 -0
- package/dist/jsx/useSheet.native.js.map +6 -0
- package/dist/jsx/useSheetController.js +2 -5
- package/dist/jsx/useSheetController.js.map +1 -1
- package/dist/jsx/useSheetController.native.js +17 -0
- package/dist/jsx/useSheetController.native.js.map +6 -0
- package/dist/jsx/useSheetOffscreenSize.js +8 -21
- package/dist/jsx/useSheetOffscreenSize.js.map +2 -2
- package/dist/jsx/useSheetOffscreenSize.native.js +27 -0
- package/dist/jsx/useSheetOffscreenSize.native.js.map +6 -0
- package/dist/jsx/useSheetOpenState.js +5 -8
- package/dist/jsx/useSheetOpenState.js.map +1 -1
- package/dist/jsx/useSheetOpenState.native.js +23 -0
- package/dist/jsx/useSheetOpenState.native.js.map +6 -0
- package/dist/jsx/useSheetProviderProps.js +36 -79
- package/dist/jsx/useSheetProviderProps.js.map +1 -1
- package/dist/jsx/useSheetProviderProps.native.js +90 -0
- package/dist/jsx/useSheetProviderProps.native.js.map +6 -0
- package/package.json +14 -14
- package/src/SheetImplementationCustom.tsx +21 -3
- package/src/createSheet.tsx +21 -3
- package/types/Sheet.d.ts +2 -0
- package/types/Sheet.d.ts.map +1 -1
- package/types/SheetImplementationCustom.d.ts.map +1 -1
- package/types/createSheet.d.ts +22 -0
- package/types/createSheet.d.ts.map +1 -1
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
const useSheetOffscreenSize = ({
|
|
2
|
+
snapPoints,
|
|
3
|
+
position,
|
|
4
|
+
screenSize,
|
|
5
|
+
frameSize,
|
|
6
|
+
snapPointsMode
|
|
7
|
+
}) => {
|
|
8
|
+
if (snapPointsMode === "fit")
|
|
9
|
+
return 0;
|
|
10
|
+
if (snapPointsMode === "constant") {
|
|
11
|
+
const maxSize2 = Number(snapPoints[0]), currentSize2 = Number(snapPoints[position] ?? 0);
|
|
12
|
+
return maxSize2 - currentSize2;
|
|
13
|
+
}
|
|
14
|
+
if (snapPointsMode === "percent") {
|
|
15
|
+
const maxPercentOpened = Number(snapPoints[0]) / 100, percentOpened = Number(snapPoints[position] ?? 0) / 100;
|
|
16
|
+
return (maxPercentOpened - percentOpened) * screenSize;
|
|
17
|
+
}
|
|
18
|
+
const maxSnapPoint = snapPoints[0];
|
|
19
|
+
if (maxSnapPoint === "fit")
|
|
20
|
+
return 0;
|
|
21
|
+
const maxSize = typeof maxSnapPoint == "string" ? Number(maxSnapPoint.slice(0, -1)) / 100 * screenSize : maxSnapPoint, currentSnapPoint = snapPoints[position] ?? 0, currentSize = typeof currentSnapPoint == "string" ? Number(currentSnapPoint.slice(0, -1)) / 100 * screenSize : currentSnapPoint, offscreenSize = maxSize - currentSize;
|
|
22
|
+
return Number.isNaN(offscreenSize) ? 0 : offscreenSize;
|
|
23
|
+
};
|
|
24
|
+
export {
|
|
25
|
+
useSheetOffscreenSize
|
|
26
|
+
};
|
|
27
|
+
//# sourceMappingURL=useSheetOffscreenSize.js.map
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/useSheetOffscreenSize.tsx"],
|
|
4
|
+
"mappings": "AAEO,MAAM,wBAAwB,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAyB;AACvB,MAAI,mBAAmB;AACrB,WAAO;AAGT,MAAI,mBAAmB,YAAY;AACjC,UAAMA,WAAU,OAAO,WAAW,CAAC,CAAC,GAC9BC,eAAc,OAAO,WAAW,QAAQ,KAAK,CAAC;AAEpD,WADsBD,WAAUC;AAAA,EAElC;AAEA,MAAI,mBAAmB,WAAW;AAChC,UAAM,mBAAmB,OAAO,WAAW,CAAC,CAAC,IAAI,KAC3C,gBAAgB,OAAO,WAAW,QAAQ,KAAK,CAAC,IAAI;AAG1D,YAFsB,mBAAmB,iBACH;AAAA,EAExC;AAGA,QAAM,eAAe,WAAW,CAAC;AACjC,MAAI,iBAAiB;AACnB,WAAO;AAGT,QAAM,UACJ,OAAO,gBAAiB,WACnB,OAAO,aAAa,MAAM,GAAG,EAAE,CAAC,IAAI,MAAO,aAC5C,cACA,mBAAmB,WAAW,QAAQ,KAAK,GAC3C,cACJ,OAAO,oBAAqB,WACvB,OAAO,iBAAiB,MAAM,GAAG,EAAE,CAAC,IAAI,MAAO,aAChD,kBACA,gBAAgB,UAAU;AAChC,SAAI,OAAO,MAAM,aAAa,IACrB,IAEF;AACT;",
|
|
5
|
+
"names": ["maxSize", "currentSize"]
|
|
6
|
+
}
|
|
@@ -1,17 +1,14 @@
|
|
|
1
1
|
import { useControllableState } from "@tamagui/use-controllable-state";
|
|
2
2
|
import { useSheetController } from "./useSheetController";
|
|
3
3
|
const useSheetOpenState = (props) => {
|
|
4
|
-
const { isHidden, controller } = useSheetController()
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
props.onOpenChange?.(val);
|
|
8
|
-
};
|
|
9
|
-
const [open, setOpen] = useControllableState({
|
|
4
|
+
const { isHidden, controller } = useSheetController(), onOpenChangeInternal = (val) => {
|
|
5
|
+
controller?.onOpenChange?.(val), props.onOpenChange?.(val);
|
|
6
|
+
}, [open, setOpen] = useControllableState({
|
|
10
7
|
prop: controller?.open ?? props.open,
|
|
11
|
-
defaultProp: props.defaultOpen ??
|
|
8
|
+
defaultProp: props.defaultOpen ?? !1,
|
|
12
9
|
onChange: onOpenChangeInternal,
|
|
13
10
|
strategy: "most-recent-wins",
|
|
14
|
-
transition:
|
|
11
|
+
transition: !0
|
|
15
12
|
});
|
|
16
13
|
return {
|
|
17
14
|
open,
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/useSheetOpenState.tsx"],
|
|
4
|
-
"mappings": "AAAA,SAAS,4BAA4B;AAGrC,SAAS,0BAA0B;AAE5B,MAAM,oBAAoB,CAAC,UAAsB;AACtD,QAAM,EAAE,UAAU,WAAW,IAAI,mBAAmB
|
|
4
|
+
"mappings": "AAAA,SAAS,4BAA4B;AAGrC,SAAS,0BAA0B;AAE5B,MAAM,oBAAoB,CAAC,UAAsB;AACtD,QAAM,EAAE,UAAU,WAAW,IAAI,mBAAmB,GAE9C,uBAAuB,CAAC,QAAiB;AAC7C,gBAAY,eAAe,GAAG,GAC9B,MAAM,eAAe,GAAG;AAAA,EAC1B,GAEM,CAAC,MAAM,OAAO,IAAI,qBAAqB;AAAA,IAC3C,MAAM,YAAY,QAAQ,MAAM;AAAA,IAChC,aAAa,MAAM,eAAe;AAAA,IAClC,UAAU;AAAA,IACV,UAAU;AAAA,IACV,YAAY;AAAA,EACd,CAAC;AAED,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { useControllableState } from "@tamagui/use-controllable-state";
|
|
2
|
+
import { useSheetController } from "./useSheetController";
|
|
3
|
+
const useSheetOpenState = (props) => {
|
|
4
|
+
const { isHidden, controller } = useSheetController(), onOpenChangeInternal = (val) => {
|
|
5
|
+
controller?.onOpenChange?.(val), props.onOpenChange?.(val);
|
|
6
|
+
}, [open, setOpen] = useControllableState({
|
|
7
|
+
prop: controller?.open ?? props.open,
|
|
8
|
+
defaultProp: props.defaultOpen ?? !1,
|
|
9
|
+
onChange: onOpenChangeInternal,
|
|
10
|
+
strategy: "most-recent-wins",
|
|
11
|
+
transition: !0
|
|
12
|
+
});
|
|
13
|
+
return {
|
|
14
|
+
open,
|
|
15
|
+
setOpen,
|
|
16
|
+
isHidden,
|
|
17
|
+
controller
|
|
18
|
+
};
|
|
19
|
+
};
|
|
20
|
+
export {
|
|
21
|
+
useSheetOpenState
|
|
22
|
+
};
|
|
23
|
+
//# sourceMappingURL=useSheetOpenState.js.map
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/useSheetOpenState.tsx"],
|
|
4
|
+
"mappings": "AAAA,SAAS,4BAA4B;AAGrC,SAAS,0BAA0B;AAE5B,MAAM,oBAAoB,CAAC,UAAsB;AACtD,QAAM,EAAE,UAAU,WAAW,IAAI,mBAAmB,GAE9C,uBAAuB,CAAC,QAAiB;AAC7C,gBAAY,eAAe,GAAG,GAC9B,MAAM,eAAe,GAAG;AAAA,EAC1B,GAEM,CAAC,MAAM,OAAO,IAAI,qBAAqB;AAAA,IAC3C,MAAM,YAAY,QAAQ,MAAM;AAAA,IAChC,aAAa,MAAM,eAAe;AAAA,IAClC,UAAU;AAAA,IACV,UAAU;AAAA,IACV,YAAY;AAAA,EACd,CAAC;AAED,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
|
|
5
|
+
"names": []
|
|
6
|
+
}
|
|
@@ -3,90 +3,51 @@ import { useConstant } from "@tamagui/use-constant";
|
|
|
3
3
|
import { useControllableState } from "@tamagui/use-controllable-state";
|
|
4
4
|
import React, { useCallback, useEffect, useMemo, useState } from "react";
|
|
5
5
|
function useSheetProviderProps(props, state, options = {}) {
|
|
6
|
-
const contentRef = React.useRef(null)
|
|
7
|
-
const [frameSize, setFrameSize] = useState(0);
|
|
8
|
-
const [maxContentSize, setMaxContentSize] = useState(0);
|
|
9
|
-
const snapPointsMode = props.snapPointsMode ?? "percent";
|
|
10
|
-
const snapPointsProp = props.snapPoints ?? (snapPointsMode === "percent" ? [80] : snapPointsMode === "constant" ? [256] : ["fit"]);
|
|
11
|
-
const hasFit = snapPointsProp[0] === "fit";
|
|
12
|
-
const snapPoints = useMemo(
|
|
6
|
+
const contentRef = React.useRef(null), [frameSize, setFrameSize] = useState(0), [maxContentSize, setMaxContentSize] = useState(0), snapPointsMode = props.snapPointsMode ?? "percent", snapPointsProp = props.snapPoints ?? (snapPointsMode === "percent" ? [80] : snapPointsMode === "constant" ? [256] : ["fit"]), hasFit = snapPointsProp[0] === "fit", snapPoints = useMemo(
|
|
13
7
|
() => props.dismissOnSnapToBottom ? [...snapPointsProp, 0] : snapPointsProp,
|
|
14
8
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
15
9
|
[JSON.stringify(snapPointsProp), props.dismissOnSnapToBottom]
|
|
16
|
-
)
|
|
17
|
-
const [position_, setPositionImmediate] = useControllableState({
|
|
10
|
+
), [position_, setPositionImmediate] = useControllableState({
|
|
18
11
|
prop: props.position,
|
|
19
12
|
defaultProp: props.defaultPosition || (state.open ? 0 : -1),
|
|
20
13
|
onChange: props.onPositionChange,
|
|
21
14
|
strategy: "most-recent-wins",
|
|
22
|
-
transition:
|
|
23
|
-
})
|
|
24
|
-
const position = state.open === false ? -1 : position_;
|
|
25
|
-
const { open } = state;
|
|
26
|
-
const setPosition = useCallback(
|
|
15
|
+
transition: !0
|
|
16
|
+
}), position = state.open === !1 ? -1 : position_, { open } = state, setPosition = useCallback(
|
|
27
17
|
(next) => {
|
|
28
|
-
|
|
29
|
-
state.setOpen(false);
|
|
30
|
-
} else {
|
|
31
|
-
setPositionImmediate(next);
|
|
32
|
-
}
|
|
18
|
+
props.dismissOnSnapToBottom && next === snapPoints.length - 1 ? state.setOpen(!1) : setPositionImmediate(next);
|
|
33
19
|
},
|
|
34
20
|
[props.dismissOnSnapToBottom, snapPoints.length, setPositionImmediate, state.setOpen]
|
|
35
21
|
);
|
|
36
|
-
|
|
37
|
-
if (
|
|
38
|
-
if (
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
const n = Number(p.slice(0, -1));
|
|
44
|
-
return n < 0 || n > 100;
|
|
45
|
-
}
|
|
46
|
-
return true;
|
|
22
|
+
process.env.NODE_ENV === "development" && (snapPointsMode === "mixed" && snapPoints.some((p) => {
|
|
23
|
+
if (typeof p == "string") {
|
|
24
|
+
if (p === "fit")
|
|
25
|
+
return !1;
|
|
26
|
+
if (p.endsWith("%")) {
|
|
27
|
+
const n = Number(p.slice(0, -1));
|
|
28
|
+
return n < 0 || n > 100;
|
|
47
29
|
}
|
|
48
|
-
return
|
|
49
|
-
})) {
|
|
50
|
-
console.warn(
|
|
51
|
-
'\u26A0\uFE0F Invalid snapPoint given, snapPoints must be positive numeric values, string percentages between 0-100%, or "fit" when snapPointsMode is mixed'
|
|
52
|
-
);
|
|
53
|
-
}
|
|
54
|
-
if (snapPointsMode === "mixed" && snapPoints.indexOf("fit") > 0) {
|
|
55
|
-
console.warn(
|
|
56
|
-
'\u26A0\uFE0F Invalid snapPoint given, "fit" must be the first/largest snap point when snapPointsMode is mixed'
|
|
57
|
-
);
|
|
58
|
-
}
|
|
59
|
-
if (snapPointsMode === "fit" && (snapPoints.length !== (props.dismissOnSnapToBottom ? 2 : 1) || snapPoints[0] !== "fit")) {
|
|
60
|
-
console.warn(
|
|
61
|
-
"\u26A0\uFE0F Invalid snapPoint given, there are no snap points when snapPointsMode is fit"
|
|
62
|
-
);
|
|
30
|
+
return !0;
|
|
63
31
|
}
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
setPositionImmediate(0);
|
|
77
|
-
}
|
|
32
|
+
return typeof p != "number" || p < 0;
|
|
33
|
+
}) && console.warn(
|
|
34
|
+
'\u26A0\uFE0F Invalid snapPoint given, snapPoints must be positive numeric values, string percentages between 0-100%, or "fit" when snapPointsMode is mixed'
|
|
35
|
+
), snapPointsMode === "mixed" && snapPoints.indexOf("fit") > 0 && console.warn(
|
|
36
|
+
'\u26A0\uFE0F Invalid snapPoint given, "fit" must be the first/largest snap point when snapPointsMode is mixed'
|
|
37
|
+
), snapPointsMode === "fit" && (snapPoints.length !== (props.dismissOnSnapToBottom ? 2 : 1) || snapPoints[0] !== "fit") && console.warn(
|
|
38
|
+
"\u26A0\uFE0F Invalid snapPoint given, there are no snap points when snapPointsMode is fit"
|
|
39
|
+
), snapPointsMode === "constant" && snapPoints.some((p) => typeof p != "number" || p < 0) && console.warn(
|
|
40
|
+
"\u26A0\uFE0F Invalid snapPoint given, snapPoints must be positive numeric values when snapPointsMode is constant"
|
|
41
|
+
), snapPointsMode === "percent" && snapPoints.some((p) => typeof p != "number" || p < 0 || p > 100) && console.warn(
|
|
42
|
+
"\u26A0\uFE0F Invalid snapPoint given, snapPoints must be numeric values between 0 and 100 when snapPointsMode is percent"
|
|
43
|
+
)), open && props.dismissOnSnapToBottom && position === snapPoints.length - 1 && setPositionImmediate(0);
|
|
78
44
|
const shouldSetPositionOpen = open && position < 0;
|
|
79
|
-
useEffect(() => {
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
}
|
|
83
|
-
}, [setPosition, shouldSetPositionOpen]);
|
|
84
|
-
const driver = useAnimationDriver();
|
|
85
|
-
if (!driver) {
|
|
45
|
+
if (useEffect(() => {
|
|
46
|
+
shouldSetPositionOpen && setPosition(0);
|
|
47
|
+
}, [setPosition, shouldSetPositionOpen]), !useAnimationDriver())
|
|
86
48
|
throw new Error("Must set animations in tamagui.config.ts");
|
|
87
|
-
}
|
|
88
49
|
const scrollBridge = useConstant(() => ({
|
|
89
|
-
enabled:
|
|
50
|
+
enabled: !1,
|
|
90
51
|
y: 0,
|
|
91
52
|
paneY: 0,
|
|
92
53
|
paneMinY: 0,
|
|
@@ -95,13 +56,10 @@ function useSheetProviderProps(props, state, options = {}) {
|
|
|
95
56
|
},
|
|
96
57
|
release: () => {
|
|
97
58
|
},
|
|
98
|
-
scrollLock:
|
|
99
|
-
}));
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
const screenSize = snapPointsMode === "percent" ? frameSize / ((typeof maxSnapPoint === "number" ? maxSnapPoint : 100) / 100) : maxContentSize;
|
|
103
|
-
const providerProps = {
|
|
104
|
-
screenSize,
|
|
59
|
+
scrollLock: !1
|
|
60
|
+
})), removeScrollEnabled = props.forceRemoveScrollEnabled ?? (open && props.modal), maxSnapPoint = snapPoints[0];
|
|
61
|
+
return {
|
|
62
|
+
screenSize: snapPointsMode === "percent" ? frameSize / ((typeof maxSnapPoint == "number" ? maxSnapPoint : 100) / 100) : maxContentSize,
|
|
105
63
|
maxSnapPoint,
|
|
106
64
|
removeScrollEnabled,
|
|
107
65
|
scrollBridge,
|
|
@@ -112,8 +70,8 @@ function useSheetProviderProps(props, state, options = {}) {
|
|
|
112
70
|
contentRef,
|
|
113
71
|
frameSize,
|
|
114
72
|
setFrameSize,
|
|
115
|
-
dismissOnOverlayPress: props.dismissOnOverlayPress ??
|
|
116
|
-
dismissOnSnapToBottom: props.dismissOnSnapToBottom ??
|
|
73
|
+
dismissOnOverlayPress: props.dismissOnOverlayPress ?? !0,
|
|
74
|
+
dismissOnSnapToBottom: props.dismissOnSnapToBottom ?? !1,
|
|
117
75
|
onOverlayComponent: options.onOverlayComponent,
|
|
118
76
|
scope: props.__scopeSheet,
|
|
119
77
|
hasFit,
|
|
@@ -123,9 +81,8 @@ function useSheetProviderProps(props, state, options = {}) {
|
|
|
123
81
|
setMaxContentSize,
|
|
124
82
|
setPosition,
|
|
125
83
|
setPositionImmediate,
|
|
126
|
-
onlyShowFrame:
|
|
84
|
+
onlyShowFrame: !1
|
|
127
85
|
};
|
|
128
|
-
return providerProps;
|
|
129
86
|
}
|
|
130
87
|
export {
|
|
131
88
|
useSheetProviderProps
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/useSheetProviderProps.tsx"],
|
|
4
|
-
"mappings": "AAAA,SAAyB,0BAA0B;AACnD,SAAS,mBAAmB;AAC5B,SAAS,4BAA4B;AACrC,OAAO,SAAS,aAAa,WAAW,SAAS,gBAAgB;AAO1D,SAAS,sBACd,OACA,OACA,UAEI,CAAC,GACL;AACA,QAAM,aAAa,MAAM,OAAuB,IAAI
|
|
4
|
+
"mappings": "AAAA,SAAyB,0BAA0B;AACnD,SAAS,mBAAmB;AAC5B,SAAS,4BAA4B;AACrC,OAAO,SAAS,aAAa,WAAW,SAAS,gBAAgB;AAO1D,SAAS,sBACd,OACA,OACA,UAEI,CAAC,GACL;AACA,QAAM,aAAa,MAAM,OAAuB,IAAI,GAC9C,CAAC,WAAW,YAAY,IAAI,SAAiB,CAAC,GAC9C,CAAC,gBAAgB,iBAAiB,IAAI,SAAiB,CAAC,GACxD,iBAAiB,MAAM,kBAAkB,WACzC,iBACJ,MAAM,eACL,mBAAmB,YAChB,CAAC,EAAE,IACH,mBAAmB,aACnB,CAAC,GAAG,IACJ,CAAC,KAAK,IACN,SAAS,eAAe,CAAC,MAAM,OAE/B,aAAa;AAAA,IACjB,MAAO,MAAM,wBAAwB,CAAC,GAAG,gBAAgB,CAAC,IAAI;AAAA;AAAA,IAE9D,CAAC,KAAK,UAAU,cAAc,GAAG,MAAM,qBAAqB;AAAA,EAC9D,GAGM,CAAC,WAAW,oBAAoB,IAAI,qBAAqB;AAAA,IAC7D,MAAM,MAAM;AAAA,IACZ,aAAa,MAAM,oBAAoB,MAAM,OAAO,IAAI;AAAA,IACxD,UAAU,MAAM;AAAA,IAChB,UAAU;AAAA,IACV,YAAY;AAAA,EACd,CAAC,GAEK,WAAW,MAAM,SAAS,KAAQ,KAAK,WAEvC,EAAE,KAAK,IAAI,OAEX,cAAc;AAAA,IAClB,CAAC,SAAiB;AAEhB,MAAI,MAAM,yBAAyB,SAAS,WAAW,SAAS,IAC9D,MAAM,QAAQ,EAAK,IAEnB,qBAAqB,IAAI;AAAA,IAE7B;AAAA,IACA,CAAC,MAAM,uBAAuB,WAAW,QAAQ,sBAAsB,MAAM,OAAO;AAAA,EACtF;AAEA,EAAI,QAAQ,IAAI,aAAa,kBAEzB,mBAAmB,WACnB,WAAW,KAAK,CAAC,MAAM;AACrB,QAAI,OAAO,KAAM,UAAU;AACzB,UAAI,MAAM;AACR,eAAO;AAET,UAAI,EAAE,SAAS,GAAG,GAAG;AACnB,cAAM,IAAI,OAAO,EAAE,MAAM,GAAG,EAAE,CAAC;AAC/B,eAAO,IAAI,KAAK,IAAI;AAAA,MACtB;AACA,aAAO;AAAA,IACT;AACA,WAAO,OAAO,KAAM,YAAY,IAAI;AAAA,EACtC,CAAC,KAED,QAAQ;AAAA,IACN;AAAA,EACF,GAEE,mBAAmB,WAAW,WAAW,QAAQ,KAAK,IAAI,KAC5D,QAAQ;AAAA,IACN;AAAA,EACF,GAGA,mBAAmB,UAClB,WAAW,YAAY,MAAM,wBAAwB,IAAI,MACxD,WAAW,CAAC,MAAM,UAEpB,QAAQ;AAAA,IACN;AAAA,EACF,GAGA,mBAAmB,cACnB,WAAW,KAAK,CAAC,MAAM,OAAO,KAAM,YAAY,IAAI,CAAC,KAErD,QAAQ;AAAA,IACN;AAAA,EACF,GAGA,mBAAmB,aACnB,WAAW,KAAK,CAAC,MAAM,OAAO,KAAM,YAAY,IAAI,KAAK,IAAI,GAAG,KAEhE,QAAQ;AAAA,IACN;AAAA,EACF,IAKA,QAAQ,MAAM,yBAAyB,aAAa,WAAW,SAAS,KAC1E,qBAAqB,CAAC;AAIxB,QAAM,wBAAwB,QAAQ,WAAW;AAQjD,MAPA,UAAU,MAAM;AACd,IAAI,yBACF,YAAY,CAAC;AAAA,EAEjB,GAAG,CAAC,aAAa,qBAAqB,CAAC,GAGnC,CADW,mBAAmB;AAEhC,UAAM,IAAI,MAAM,0CAA0C;AAG5D,QAAM,eAAe,YAA0B,OAAO;AAAA,IACpD,SAAS;AAAA,IACT,GAAG;AAAA,IACH,OAAO;AAAA,IACP,UAAU;AAAA,IACV,cAAc;AAAA,IACd,MAAM,MAAM;AAAA,IAAC;AAAA,IACb,SAAS,MAAM;AAAA,IAAC;AAAA,IAChB,YAAY;AAAA,EACd,EAAE,GAEI,sBAAsB,MAAM,6BAA6B,QAAQ,MAAM,QAEvE,eAAe,WAAW,CAAC;AAgCjC,SA1BsB;AAAA,IACpB,YALA,mBAAmB,YACf,cAAc,OAAO,gBAAiB,WAAW,eAAe,OAAO,OACvE;AAAA,IAIJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,CAAC,CAAC,MAAM;AAAA,IACf,MAAM,MAAM;AAAA,IACZ,SAAS,MAAM;AAAA,IACf,QAAQ,CAAC,CAAC,MAAM;AAAA,IAChB;AAAA,IACA;AAAA,IACA;AAAA,IACA,uBAAuB,MAAM,yBAAyB;AAAA,IACtD,uBAAuB,MAAM,yBAAyB;AAAA,IACtD,oBAAoB,QAAQ;AAAA,IAC5B,OAAO,MAAM;AAAA,IACb;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,EACjB;AAGF;",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|
|
@@ -0,0 +1,90 @@
|
|
|
1
|
+
import { useAnimationDriver } from "@tamagui/core";
|
|
2
|
+
import { useConstant } from "@tamagui/use-constant";
|
|
3
|
+
import { useControllableState } from "@tamagui/use-controllable-state";
|
|
4
|
+
import React, { useCallback, useEffect, useMemo, useState } from "react";
|
|
5
|
+
function useSheetProviderProps(props, state, options = {}) {
|
|
6
|
+
const contentRef = React.useRef(null), [frameSize, setFrameSize] = useState(0), [maxContentSize, setMaxContentSize] = useState(0), snapPointsMode = props.snapPointsMode ?? "percent", snapPointsProp = props.snapPoints ?? (snapPointsMode === "percent" ? [80] : snapPointsMode === "constant" ? [256] : ["fit"]), hasFit = snapPointsProp[0] === "fit", snapPoints = useMemo(
|
|
7
|
+
() => props.dismissOnSnapToBottom ? [...snapPointsProp, 0] : snapPointsProp,
|
|
8
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
9
|
+
[JSON.stringify(snapPointsProp), props.dismissOnSnapToBottom]
|
|
10
|
+
), [position_, setPositionImmediate] = useControllableState({
|
|
11
|
+
prop: props.position,
|
|
12
|
+
defaultProp: props.defaultPosition || (state.open ? 0 : -1),
|
|
13
|
+
onChange: props.onPositionChange,
|
|
14
|
+
strategy: "most-recent-wins",
|
|
15
|
+
transition: !0
|
|
16
|
+
}), position = state.open === !1 ? -1 : position_, { open } = state, setPosition = useCallback(
|
|
17
|
+
(next) => {
|
|
18
|
+
props.dismissOnSnapToBottom && next === snapPoints.length - 1 ? state.setOpen(!1) : setPositionImmediate(next);
|
|
19
|
+
},
|
|
20
|
+
[props.dismissOnSnapToBottom, snapPoints.length, setPositionImmediate, state.setOpen]
|
|
21
|
+
);
|
|
22
|
+
process.env.NODE_ENV === "development" && (snapPointsMode === "mixed" && snapPoints.some((p) => {
|
|
23
|
+
if (typeof p == "string") {
|
|
24
|
+
if (p === "fit")
|
|
25
|
+
return !1;
|
|
26
|
+
if (p.endsWith("%")) {
|
|
27
|
+
const n = Number(p.slice(0, -1));
|
|
28
|
+
return n < 0 || n > 100;
|
|
29
|
+
}
|
|
30
|
+
return !0;
|
|
31
|
+
}
|
|
32
|
+
return typeof p != "number" || p < 0;
|
|
33
|
+
}) && console.warn(
|
|
34
|
+
'\u26A0\uFE0F Invalid snapPoint given, snapPoints must be positive numeric values, string percentages between 0-100%, or "fit" when snapPointsMode is mixed'
|
|
35
|
+
), snapPointsMode === "mixed" && snapPoints.indexOf("fit") > 0 && console.warn(
|
|
36
|
+
'\u26A0\uFE0F Invalid snapPoint given, "fit" must be the first/largest snap point when snapPointsMode is mixed'
|
|
37
|
+
), snapPointsMode === "fit" && (snapPoints.length !== (props.dismissOnSnapToBottom ? 2 : 1) || snapPoints[0] !== "fit") && console.warn(
|
|
38
|
+
"\u26A0\uFE0F Invalid snapPoint given, there are no snap points when snapPointsMode is fit"
|
|
39
|
+
), snapPointsMode === "constant" && snapPoints.some((p) => typeof p != "number" || p < 0) && console.warn(
|
|
40
|
+
"\u26A0\uFE0F Invalid snapPoint given, snapPoints must be positive numeric values when snapPointsMode is constant"
|
|
41
|
+
), snapPointsMode === "percent" && snapPoints.some((p) => typeof p != "number" || p < 0 || p > 100) && console.warn(
|
|
42
|
+
"\u26A0\uFE0F Invalid snapPoint given, snapPoints must be numeric values between 0 and 100 when snapPointsMode is percent"
|
|
43
|
+
)), open && props.dismissOnSnapToBottom && position === snapPoints.length - 1 && setPositionImmediate(0);
|
|
44
|
+
const shouldSetPositionOpen = open && position < 0;
|
|
45
|
+
if (useEffect(() => {
|
|
46
|
+
shouldSetPositionOpen && setPosition(0);
|
|
47
|
+
}, [setPosition, shouldSetPositionOpen]), !useAnimationDriver())
|
|
48
|
+
throw new Error("Must set animations in tamagui.config.ts");
|
|
49
|
+
const scrollBridge = useConstant(() => ({
|
|
50
|
+
enabled: !1,
|
|
51
|
+
y: 0,
|
|
52
|
+
paneY: 0,
|
|
53
|
+
paneMinY: 0,
|
|
54
|
+
scrollStartY: -1,
|
|
55
|
+
drag: () => {
|
|
56
|
+
},
|
|
57
|
+
release: () => {
|
|
58
|
+
},
|
|
59
|
+
scrollLock: !1
|
|
60
|
+
})), removeScrollEnabled = props.forceRemoveScrollEnabled ?? (open && props.modal), maxSnapPoint = snapPoints[0];
|
|
61
|
+
return {
|
|
62
|
+
screenSize: snapPointsMode === "percent" ? frameSize / ((typeof maxSnapPoint == "number" ? maxSnapPoint : 100) / 100) : maxContentSize,
|
|
63
|
+
maxSnapPoint,
|
|
64
|
+
removeScrollEnabled,
|
|
65
|
+
scrollBridge,
|
|
66
|
+
modal: !!props.modal,
|
|
67
|
+
open: state.open,
|
|
68
|
+
setOpen: state.setOpen,
|
|
69
|
+
hidden: !!state.isHidden,
|
|
70
|
+
contentRef,
|
|
71
|
+
frameSize,
|
|
72
|
+
setFrameSize,
|
|
73
|
+
dismissOnOverlayPress: props.dismissOnOverlayPress ?? !0,
|
|
74
|
+
dismissOnSnapToBottom: props.dismissOnSnapToBottom ?? !1,
|
|
75
|
+
onOverlayComponent: options.onOverlayComponent,
|
|
76
|
+
scope: props.__scopeSheet,
|
|
77
|
+
hasFit,
|
|
78
|
+
position,
|
|
79
|
+
snapPoints,
|
|
80
|
+
snapPointsMode,
|
|
81
|
+
setMaxContentSize,
|
|
82
|
+
setPosition,
|
|
83
|
+
setPositionImmediate,
|
|
84
|
+
onlyShowFrame: !1
|
|
85
|
+
};
|
|
86
|
+
}
|
|
87
|
+
export {
|
|
88
|
+
useSheetProviderProps
|
|
89
|
+
};
|
|
90
|
+
//# sourceMappingURL=useSheetProviderProps.js.map
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/useSheetProviderProps.tsx"],
|
|
4
|
+
"mappings": "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",
|
|
5
|
+
"names": []
|
|
6
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tamagui/sheet",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.62.0",
|
|
4
4
|
"sideEffects": [
|
|
5
5
|
"*.css"
|
|
6
6
|
],
|
|
@@ -31,25 +31,25 @@
|
|
|
31
31
|
}
|
|
32
32
|
},
|
|
33
33
|
"dependencies": {
|
|
34
|
-
"@tamagui/animate-presence": "1.
|
|
35
|
-
"@tamagui/animations-react-native": "1.
|
|
36
|
-
"@tamagui/compose-refs": "1.
|
|
37
|
-
"@tamagui/core": "1.
|
|
38
|
-
"@tamagui/create-context": "1.
|
|
39
|
-
"@tamagui/portal": "1.
|
|
40
|
-
"@tamagui/remove-scroll": "1.
|
|
41
|
-
"@tamagui/scroll-view": "1.
|
|
42
|
-
"@tamagui/stacks": "1.
|
|
43
|
-
"@tamagui/use-constant": "1.
|
|
44
|
-
"@tamagui/use-controllable-state": "1.
|
|
45
|
-
"@tamagui/use-keyboard-visible": "1.
|
|
34
|
+
"@tamagui/animate-presence": "1.62.0",
|
|
35
|
+
"@tamagui/animations-react-native": "1.62.0",
|
|
36
|
+
"@tamagui/compose-refs": "1.62.0",
|
|
37
|
+
"@tamagui/core": "1.62.0",
|
|
38
|
+
"@tamagui/create-context": "1.62.0",
|
|
39
|
+
"@tamagui/portal": "1.62.0",
|
|
40
|
+
"@tamagui/remove-scroll": "1.62.0",
|
|
41
|
+
"@tamagui/scroll-view": "1.62.0",
|
|
42
|
+
"@tamagui/stacks": "1.62.0",
|
|
43
|
+
"@tamagui/use-constant": "1.62.0",
|
|
44
|
+
"@tamagui/use-controllable-state": "1.62.0",
|
|
45
|
+
"@tamagui/use-keyboard-visible": "1.62.0"
|
|
46
46
|
},
|
|
47
47
|
"peerDependencies": {
|
|
48
48
|
"react": "*",
|
|
49
49
|
"react-native": "*"
|
|
50
50
|
},
|
|
51
51
|
"devDependencies": {
|
|
52
|
-
"@tamagui/build": "1.
|
|
52
|
+
"@tamagui/build": "1.62.0",
|
|
53
53
|
"react": "^18.2.0",
|
|
54
54
|
"react-native": "^0.72.1"
|
|
55
55
|
},
|
|
@@ -3,6 +3,7 @@ import { AnimatePresence } from '@tamagui/animate-presence'
|
|
|
3
3
|
import { useComposedRefs } from '@tamagui/compose-refs'
|
|
4
4
|
import {
|
|
5
5
|
Theme,
|
|
6
|
+
getConfig,
|
|
6
7
|
isTouchable,
|
|
7
8
|
isWeb,
|
|
8
9
|
themeable,
|
|
@@ -47,7 +48,8 @@ export const SheetImplementationCustom = themeable(
|
|
|
47
48
|
const parentSheet = useContext(ParentSheetContext)
|
|
48
49
|
|
|
49
50
|
const {
|
|
50
|
-
|
|
51
|
+
animation,
|
|
52
|
+
animationConfig: animationConfigProp,
|
|
51
53
|
modal = false,
|
|
52
54
|
zIndex = parentSheet.zIndex + 1,
|
|
53
55
|
moveOnKeyboardChange = false,
|
|
@@ -79,6 +81,24 @@ export const SheetImplementationCustom = themeable(
|
|
|
79
81
|
const sheetRef = useRef<View>(null)
|
|
80
82
|
const ref = useComposedRefs(forwardedRef, sheetRef)
|
|
81
83
|
|
|
84
|
+
// TODO this can be extracted into a helper getAnimationConfig(animationProp as array | string)
|
|
85
|
+
const animationConfig = (() => {
|
|
86
|
+
const [animationProp, animationPropConfig] = !animation
|
|
87
|
+
? []
|
|
88
|
+
: Array.isArray(animation)
|
|
89
|
+
? animation
|
|
90
|
+
: ([animation] as const)
|
|
91
|
+
return (
|
|
92
|
+
animationConfigProp ??
|
|
93
|
+
(animationProp
|
|
94
|
+
? {
|
|
95
|
+
...(getConfig().animations.animations[animationProp as string] as Object),
|
|
96
|
+
...animationPropConfig,
|
|
97
|
+
}
|
|
98
|
+
: null)
|
|
99
|
+
)
|
|
100
|
+
})()
|
|
101
|
+
|
|
82
102
|
/**
|
|
83
103
|
* This is a hacky workaround for native:
|
|
84
104
|
*/
|
|
@@ -410,8 +430,6 @@ export const SheetImplementationCustom = themeable(
|
|
|
410
430
|
{...panResponder?.panHandlers}
|
|
411
431
|
onLayout={handleAnimationViewLayout}
|
|
412
432
|
pointerEvents={open && !shouldHideParentSheet ? 'auto' : 'none'}
|
|
413
|
-
// @ts-ignore
|
|
414
|
-
animation={props.animation}
|
|
415
433
|
style={[
|
|
416
434
|
{
|
|
417
435
|
position: 'absolute',
|
package/src/createSheet.tsx
CHANGED
|
@@ -112,11 +112,25 @@ export function createSheet<
|
|
|
112
112
|
(
|
|
113
113
|
{
|
|
114
114
|
__scopeSheet,
|
|
115
|
+
adjustPaddingForOffscreenContent,
|
|
116
|
+
disableHideBottomOverflow,
|
|
115
117
|
children,
|
|
116
118
|
...props
|
|
117
119
|
}: SheetScopedProps<
|
|
118
120
|
GetProps<typeof Frame> & {
|
|
121
|
+
/**
|
|
122
|
+
* By default the sheet adds a view below its bottom that extends down another 50%,
|
|
123
|
+
* this is useful if your Sheet has a spring animation that bounces "past" the top when
|
|
124
|
+
* opening, preventing it from showing the content underneath.
|
|
125
|
+
*/
|
|
119
126
|
disableHideBottomOverflow?: boolean
|
|
127
|
+
|
|
128
|
+
/**
|
|
129
|
+
* Adds padding accounting for the currently offscreen content, so if you put a flex element inside
|
|
130
|
+
* the sheet, it will always flex to the height of the visible amount of the sheet. If this is not
|
|
131
|
+
* turned on, the inner content is always set to the max height of the sheet.
|
|
132
|
+
*/
|
|
133
|
+
adjustPaddingForOffscreenContent?: boolean
|
|
120
134
|
}
|
|
121
135
|
>,
|
|
122
136
|
forwardedRef
|
|
@@ -125,6 +139,7 @@ export function createSheet<
|
|
|
125
139
|
const { hasFit, removeScrollEnabled, frameSize, contentRef } = context
|
|
126
140
|
const composedContentRef = useComposedRefs(forwardedRef, contentRef)
|
|
127
141
|
const offscreenSize = useSheetOffscreenSize(context)
|
|
142
|
+
|
|
128
143
|
const sheetContents = useMemo(() => {
|
|
129
144
|
return (
|
|
130
145
|
// @ts-ignore
|
|
@@ -135,10 +150,13 @@ export function createSheet<
|
|
|
135
150
|
{...props}
|
|
136
151
|
>
|
|
137
152
|
{children}
|
|
138
|
-
|
|
153
|
+
|
|
154
|
+
{adjustPaddingForOffscreenContent && (
|
|
155
|
+
<Stack data-sheet-offscreen-pad height={offscreenSize} width="100%" />
|
|
156
|
+
)}
|
|
139
157
|
</Frame>
|
|
140
158
|
)
|
|
141
|
-
}, [props, frameSize, offscreenSize, hasFit])
|
|
159
|
+
}, [props, frameSize, offscreenSize, adjustPaddingForOffscreenContent, hasFit])
|
|
142
160
|
|
|
143
161
|
return (
|
|
144
162
|
<>
|
|
@@ -154,7 +172,7 @@ export function createSheet<
|
|
|
154
172
|
</RemoveScroll>
|
|
155
173
|
|
|
156
174
|
{/* below frame hide when bouncing past 100% */}
|
|
157
|
-
{!
|
|
175
|
+
{!disableHideBottomOverflow && (
|
|
158
176
|
// @ts-ignore
|
|
159
177
|
<Frame
|
|
160
178
|
{...props}
|
package/types/Sheet.d.ts
CHANGED
|
@@ -242,6 +242,7 @@ export declare const Sheet: import("react").ForwardRefExoticComponent<{
|
|
|
242
242
|
readonly unstyled?: boolean | undefined;
|
|
243
243
|
}>> & {
|
|
244
244
|
disableHideBottomOverflow?: boolean | undefined;
|
|
245
|
+
adjustPaddingForOffscreenContent?: boolean | undefined;
|
|
245
246
|
} & {
|
|
246
247
|
__scopeSheet?: import("@tamagui/create-context").Scope<any>;
|
|
247
248
|
} & import("react").RefAttributes<unknown>>;
|
|
@@ -362,6 +363,7 @@ export declare const Sheet: import("react").ForwardRefExoticComponent<{
|
|
|
362
363
|
readonly unstyled?: boolean | undefined;
|
|
363
364
|
}>> & {
|
|
364
365
|
disableHideBottomOverflow?: boolean | undefined;
|
|
366
|
+
adjustPaddingForOffscreenContent?: boolean | undefined;
|
|
365
367
|
} & {
|
|
366
368
|
__scopeSheet?: import("@tamagui/create-context").Scope<any>;
|
|
367
369
|
} & import("react").RefAttributes<unknown>>;
|
package/types/Sheet.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Sheet.d.ts","sourceRoot":"","sources":["../src/Sheet.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AACjD,cAAc,SAAS,CAAA;AAMvB,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAkCjB,CAAA;AAMF,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA6BlB,CAAA;AAMF,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAoBhB,CAAA;AAEF,eAAO,MAAM,KAAK
|
|
1
|
+
{"version":3,"file":"Sheet.d.ts","sourceRoot":"","sources":["../src/Sheet.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AACjD,cAAc,SAAS,CAAA;AAMvB,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAkCjB,CAAA;AAMF,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA6BlB,CAAA;AAMF,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAoBhB,CAAA;AAEF,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAIhB,CAAA;AAEF,uCAAuC;AACvC,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAAU,CAAA;AAExC,uCAAuC;AACvC,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAAS,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SheetImplementationCustom.d.ts","sourceRoot":"","sources":["../src/SheetImplementationCustom.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"SheetImplementationCustom.d.ts","sourceRoot":"","sources":["../src/SheetImplementationCustom.tsx"],"names":[],"mappings":";AAyBA,OAAO,EAOL,IAAI,EACL,MAAM,cAAc,CAAA;AAMrB,OAAO,EAAc,cAAc,EAAE,MAAM,SAAS,CAAA;AAMpD,eAAO,MAAM,yBAAyB;;;;;;;;;;;;;;;;;;;;;;;;;6MAqbrC,CAAA"}
|
package/types/createSheet.d.ts
CHANGED
|
@@ -39,7 +39,18 @@ export declare function createSheet<H extends SheetStyledComponent | TamaguiComp
|
|
|
39
39
|
} & RefAttributes<View>> & {
|
|
40
40
|
Controlled: FunctionComponent<Omit<SheetProps, "open" | "onOpenChange"> & RefAttributes<View>> & {
|
|
41
41
|
Frame: import("react").ForwardRefExoticComponent<import("react").PropsWithoutRef<SheetScopedProps<GetProps<F> & {
|
|
42
|
+
/**
|
|
43
|
+
* By default the sheet adds a view below its bottom that extends down another 50%,
|
|
44
|
+
* this is useful if your Sheet has a spring animation that bounces "past" the top when
|
|
45
|
+
* opening, preventing it from showing the content underneath.
|
|
46
|
+
*/
|
|
42
47
|
disableHideBottomOverflow?: boolean | undefined;
|
|
48
|
+
/**
|
|
49
|
+
* Adds padding accounting for the currently offscreen content, so if you put a flex element inside
|
|
50
|
+
* the sheet, it will always flex to the height of the visible amount of the sheet. If this is not
|
|
51
|
+
* turned on, the inner content is always set to the max height of the sheet.
|
|
52
|
+
*/
|
|
53
|
+
adjustPaddingForOffscreenContent?: boolean | undefined;
|
|
43
54
|
}>> & RefAttributes<unknown>>;
|
|
44
55
|
Overlay: import("react").MemoExoticComponent<(propsIn: SheetScopedProps<GetProps<typeof Overlay>>) => null>;
|
|
45
56
|
Handle: ({ __scopeSheet, ...props }: SheetScopedProps<GetProps<typeof Handle>>) => JSX.Element | null;
|
|
@@ -52,7 +63,18 @@ export declare function createSheet<H extends SheetStyledComponent | TamaguiComp
|
|
|
52
63
|
}>> & RefAttributes<import("react-native").ScrollView>>;
|
|
53
64
|
};
|
|
54
65
|
Frame: import("react").ForwardRefExoticComponent<import("react").PropsWithoutRef<SheetScopedProps<GetProps<F> & {
|
|
66
|
+
/**
|
|
67
|
+
* By default the sheet adds a view below its bottom that extends down another 50%,
|
|
68
|
+
* this is useful if your Sheet has a spring animation that bounces "past" the top when
|
|
69
|
+
* opening, preventing it from showing the content underneath.
|
|
70
|
+
*/
|
|
55
71
|
disableHideBottomOverflow?: boolean | undefined;
|
|
72
|
+
/**
|
|
73
|
+
* Adds padding accounting for the currently offscreen content, so if you put a flex element inside
|
|
74
|
+
* the sheet, it will always flex to the height of the visible amount of the sheet. If this is not
|
|
75
|
+
* turned on, the inner content is always set to the max height of the sheet.
|
|
76
|
+
*/
|
|
77
|
+
adjustPaddingForOffscreenContent?: boolean | undefined;
|
|
56
78
|
}>> & RefAttributes<unknown>>;
|
|
57
79
|
Overlay: import("react").MemoExoticComponent<(propsIn: SheetScopedProps<GetProps<typeof Overlay>>) => null>;
|
|
58
80
|
Handle: ({ __scopeSheet, ...props }: SheetScopedProps<GetProps<typeof Handle>>) => JSX.Element | null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"createSheet.d.ts","sourceRoot":"","sources":["../src/createSheet.tsx"],"names":[],"mappings":"AACA,OAAO,EACL,QAAQ,EAER,UAAU,EACV,gBAAgB,EAChB,iCAAiC,EAKlC,MAAM,eAAe,CAAA;AAEtB,OAAO,EAAE,iBAAiB,EAAE,aAAa,EAA6B,MAAM,OAAO,CAAA;AACnF,OAAO,EAAY,IAAI,EAAE,MAAM,cAAc,CAAA;AAO7C,OAAO,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAItD,KAAK,gBAAgB,GAAG;IACtB,IAAI,CAAC,EAAE,OAAO,CAAA;CACf,CAAA;AAED,KAAK,SAAS,GAAG,UAAU,GAAG,gBAAgB,CAAA;AAE9C,KAAK,oBAAoB,GAAG,iCAAiC,CAAC,SAAS,EAAE,gBAAgB,CAAC,CAAA;AAE1F,wBAAgB,WAAW,CACzB,CAAC,SAAS,oBAAoB,GAAG,gBAAgB,EACjD,CAAC,SAAS,oBAAoB,GAAG,gBAAgB,EACjD,CAAC,SAAS,oBAAoB,GAAG,gBAAgB,EACjD,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE;IAAE,MAAM,EAAE,CAAC,CAAC;IAAC,KAAK,EAAE,CAAC,CAAC;IAAC,OAAO,EAAE,CAAC,CAAA;CAAE
|
|
1
|
+
{"version":3,"file":"createSheet.d.ts","sourceRoot":"","sources":["../src/createSheet.tsx"],"names":[],"mappings":"AACA,OAAO,EACL,QAAQ,EAER,UAAU,EACV,gBAAgB,EAChB,iCAAiC,EAKlC,MAAM,eAAe,CAAA;AAEtB,OAAO,EAAE,iBAAiB,EAAE,aAAa,EAA6B,MAAM,OAAO,CAAA;AACnF,OAAO,EAAY,IAAI,EAAE,MAAM,cAAc,CAAA;AAO7C,OAAO,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAItD,KAAK,gBAAgB,GAAG;IACtB,IAAI,CAAC,EAAE,OAAO,CAAA;CACf,CAAA;AAED,KAAK,SAAS,GAAG,UAAU,GAAG,gBAAgB,CAAA;AAE9C,KAAK,oBAAoB,GAAG,iCAAiC,CAAC,SAAS,EAAE,gBAAgB,CAAC,CAAA;AAE1F,wBAAgB,WAAW,CACzB,CAAC,SAAS,oBAAoB,GAAG,gBAAgB,EACjD,CAAC,SAAS,oBAAoB,GAAG,gBAAgB,EACjD,CAAC,SAAS,oBAAoB,GAAG,gBAAgB,EACjD,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE;IAAE,MAAM,EAAE,CAAC,CAAC;IAAC,KAAK,EAAE,CAAC,CAAC;IAAC,OAAO,EAAE,CAAC,CAAA;CAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;YAmFrD;;;;eAIG;;YAGH;;;;eAIG;;;+DA/DI,iBAAiB,SAAS,cAAc,CAAC,CAAC;6CA7B5B,iBAAiB,SAAS,aAAa,CAAC,CAAC;;;;;;;;;;QAiF9D;;;;WAIG;;QAGH;;;;WAIG;;;2DA/DI,iBAAiB,SAAS,cAAc,CAAC,CAAC;yCA7B5B,iBAAiB,SAAS,aAAa,CAAC,CAAC;;;;;;;;EAuMzE"}
|