@tamagui/sheet 1.58.7 → 1.59.0

package/src/SheetImplementationCustom.tsx

@@ -36,7 +36,7 @@ import { SHEET_HIDDEN_STYLESHEET } from './constants'
 import { ParentSheetContext, SheetInsideSheetContext } from './contexts'
 import { resisted } from './helpers'
 import { SheetProvider } from './SheetContext'
-import { SheetProps } from './types'
+import { SheetProps, SnapPointsMode } from './types'
 import { useSheetOpenState } from './useSheetOpenState'
 import { useSheetProviderProps } from './useSheetProviderProps'
 
@@ -65,10 +65,13 @@ export const SheetImplementationCustom = themeable(
       frameSize,
       setFrameSize,
       snapPoints,
+      snapPointsMode,
+      hasFit,
       position,
       setPosition,
       scrollBridge,
       screenSize,
+      setMaxContentSize,
       maxSnapPoint,
     } = providerProps
     const { open, controller, isHidden } = state
@@ -87,8 +90,11 @@ export const SheetImplementationCustom = themeable(
     }, [])
 
     const positions = useMemo(
-      () => snapPoints.map((point) => getPercentSize(point, screenSize)),
-      [frameSize, snapPoints]
+      () =>
+        snapPoints.map((point) =>
+          getYPositions(snapPointsMode, point, screenSize, frameSize)
+        ),
+      [screenSize, frameSize, snapPoints, snapPointsMode]
     )
 
     const driver = useAnimationDriver()
@@ -178,11 +184,11 @@ export const SheetImplementationCustom = themeable(
     }, [hasntMeasured, screenSize])
 
     useIsomorphicLayoutEffect(() => {
-      if (!frameSize || isHidden || (hasntMeasured && !open)) {
+      if (!frameSize || !screenSize || isHidden || (hasntMeasured && !open)) {
         return
       }
       animateTo(position)
-    }, [isHidden, frameSize, open, position])
+    }, [isHidden, frameSize, screenSize, open, position])
 
     const disableDrag = props.disableDrag ?? controller?.disableDrag
     const themeName = useThemeName()
@@ -314,6 +320,15 @@ export const SheetImplementationCustom = themeable(
       [keyboardIsVisible]
     )
 
+    const handleMaxContentViewLayout = useCallback(
+      (e: LayoutChangeEvent) => {
+        const next = e.nativeEvent?.layout.height
+        if (!next) return
+        setMaxContentSize(next)
+      },
+      [keyboardIsVisible]
+    )
+
     const animatedStyle = useAnimatedNumberStyle(animatedNumber, (val) => {
       'worklet'
       const translateY = frameSize === 0 ? hiddenSize : val
@@ -362,6 +377,12 @@ export const SheetImplementationCustom = themeable(
       }
     }, [open])
 
+    const forcedContentHeight = hasFit
+      ? frameSize
+      : snapPointsMode === 'percent'
+      ? `${maxSnapPoint}%`
+      : maxSnapPoint
+
     const contents = (
       <ParentSheetContext.Provider value={nextParentContext}>
         <SheetProvider {...providerProps}>
@@ -369,10 +390,25 @@ export const SheetImplementationCustom = themeable(
             {shouldHideParentSheet || !open ? null : overlayComponent}
           </AnimatePresence>
 
+          {snapPointsMode !== 'percent' && (
+            <View
+              style={{
+                opacity: 0,
+                position: 'absolute',
+                top: 0,
+                left: 0,
+                right: 0,
+                bottom: 0,
+                pointerEvents: 'none',
+              }}
+              pointerEvents="none"
+              onLayout={handleMaxContentViewLayout}
+            />
+          )}
           <AnimatedView
             ref={ref}
             {...panResponder?.panHandlers}
-            onLayout={handleAnimationViewLayout}
+            onLayout={hasFit ? undefined : handleAnimationViewLayout}
             pointerEvents={open && !shouldHideParentSheet ? 'auto' : 'none'}
             //  @ts-ignore
             animation={props.animation}
@@ -381,8 +417,8 @@ export const SheetImplementationCustom = themeable(
                 position: 'absolute',
                 zIndex,
                 width: '100%',
-                height: `${maxSnapPoint}%`,
-                minHeight: `${maxSnapPoint}%`,
+                height: forcedContentHeight,
+                minHeight: forcedContentHeight,
                 opacity,
               },
               animatedStyle,
@@ -428,14 +464,48 @@ export const SheetImplementationCustom = themeable(
   })
 )
 
-function getPercentSize(point?: number, screenSize?: number) {
-  if (!screenSize) return 0
-  if (point === undefined) {
-    console.warn('No snapPoint')
+function getYPositions(
+  mode: SnapPointsMode,
+  point: string | number,
+  screenSize?: number,
+  frameSize?: number
+) {
+  if (!screenSize || !frameSize) return 0
+
+  if (mode === 'mixed') {
+    if (typeof point === 'number') {
+      return screenSize - Math.min(screenSize, Math.max(0, point))
+    }
+    if (point === 'fit') {
+      return screenSize - frameSize
+    }
+    if (point.endsWith('%')) {
+      const pct = Math.min(100, Math.max(0, Number(point.slice(0, -1)))) / 100
+      if (Number.isNaN(pct)) {
+        console.warn('Invalid snapPoint percentage string')
+        return 0
+      }
+      const next = Math.round(screenSize - pct * screenSize)
+      return next
+    }
+    console.warn('Invalid snapPoint unknown value')
+    return 0
+  }
+
+  if (mode === 'fit') {
+    if (point === 0) return screenSize
+    return screenSize - Math.min(screenSize, frameSize)
+  }
+
+  if (mode === 'constant' && typeof point === 'number') {
+    return screenSize - Math.min(screenSize, Math.max(0, point))
+  }
+
+  const pct = Math.min(100, Math.max(0, Number(point))) / 100
+  if (Number.isNaN(pct)) {
+    console.warn('Invalid snapPoint percentage')
     return 0
   }
-  const pct = point / 100
-  const next = Math.round(screenSize - pct * screenSize)
 
-  return next
+  return Math.round(screenSize - pct * screenSize)
 }

package/src/createSheet.tsx

@@ -11,8 +11,15 @@ import {
   withStaticProperties,
 } from '@tamagui/core'
 import { RemoveScroll } from '@tamagui/remove-scroll'
-import { FunctionComponent, RefAttributes, forwardRef, memo, useMemo } from 'react'
-import { Platform, View } from 'react-native'
+import {
+  FunctionComponent,
+  RefAttributes,
+  forwardRef,
+  memo,
+  useCallback,
+  useMemo,
+} from 'react'
+import { LayoutChangeEvent, Platform, View } from 'react-native'
 
 import { SHEET_HANDLE_NAME, SHEET_NAME, SHEET_OVERLAY_NAME } from './constants'
 import { getNativeSheet } from './nativeSheet'
@@ -126,10 +133,21 @@ export function createSheet<
         const composedContentRef = useComposedRefs(forwardedRef, contentRef)
         const offscreenSize = useSheetOffscreenSize(context)
 
+        const handleLayoutChange = useCallback((e: LayoutChangeEvent) => {
+          const next = e.nativeEvent?.layout.height
+          if (!next) return
+          context.setFrameSize(next)
+        }, [])
+
         const sheetContents = useMemo(() => {
           return (
             // @ts-ignore
-            <Frame ref={composedContentRef} height={frameSize} {...props}>
+            <Frame
+              ref={composedContentRef}
+              height={context.hasFit ? undefined : frameSize}
+              onLayout={context.hasFit ? handleLayoutChange : undefined}
+              {...props}
+            >
               {children}
               <Stack data-sheet-offscreen-pad height={offscreenSize} width="100%" />
             </Frame>

package/src/types.tsx

@@ -11,7 +11,8 @@ export type SheetProps = ScopedProps<
     onOpenChange?: OpenChangeHandler
     position?: number
     defaultPosition?: number
-    snapPoints?: number[]
+    snapPoints?: (string | number)[]
+    snapPointsMode?: SnapPointsMode
     onPositionChange?: PositionChangeHandler
     children?: ReactNode
     dismissOnOverlayPress?: boolean
@@ -54,6 +55,8 @@ type OpenChangeHandler =
 
 export type RemoveScrollProps = React.ComponentProps<typeof RemoveScroll>
 
+export type SnapPointsMode = 'percent' | 'constant' | 'fit' | 'mixed'
+
 export type SheetScopedProps<A> = ScopedProps<A, 'Sheet'>
 
 export type ScrollBridge = {

package/src/useSheetOffscreenSize.tsx

@@ -4,10 +4,46 @@ export const useSheetOffscreenSize = ({
   snapPoints,
   position,
   screenSize,
+  frameSize,
+  snapPointsMode,
 }: SheetContextValue) => {
-  const maxPercentOpened = snapPoints[0] / 100
-  const percentOpened = (snapPoints[position] || 0) / 100
-  const percentHidden = 1 - maxPercentOpened - percentOpened
-  const offscreenSize = percentHidden * screenSize
+  if (snapPointsMode === 'fit') {
+    return 0
+  }
+
+  if (snapPointsMode === 'constant') {
+    const maxSize = Number(snapPoints[0])
+    const currentSize = Number(snapPoints[position] ?? 0)
+    const offscreenSize = maxSize - currentSize
+    return offscreenSize
+  }
+
+  if (snapPointsMode === 'percent') {
+    const maxPercentOpened = Number(snapPoints[0]) / 100
+    const percentOpened = Number(snapPoints[position] ?? 0) / 100
+    const percentHidden = 1 - maxPercentOpened - percentOpened
+    const offscreenSize = percentHidden * screenSize
+    return offscreenSize
+  }
+
+  // mixed:
+  const maxSnapPoint = snapPoints[0]
+  const maxSize =
+    maxSnapPoint === 'fit'
+      ? frameSize
+      : typeof maxSnapPoint === 'string'
+      ? (Number(maxSnapPoint.slice(0, -1)) / 100) * screenSize
+      : maxSnapPoint
+  const currentSnapPoint = snapPoints[position] ?? 0
+  const currentSize =
+    currentSnapPoint === 'fit'
+      ? frameSize
+      : typeof currentSnapPoint === 'string'
+      ? (Number(currentSnapPoint.slice(0, -1)) / 100) * screenSize
+      : currentSnapPoint
+  const offscreenSize = maxSize - currentSize
+  if (Number.isNaN(offscreenSize)) {
+    return 0
+  }
   return offscreenSize
 }

package/src/useSheetProviderProps.tsx

@@ -17,7 +17,16 @@ export function useSheetProviderProps(
 ) {
   const contentRef = React.useRef<TamaguiElement>(null)
   const [frameSize, setFrameSize] = useState<number>(0)
-  const snapPointsProp = props.snapPoints || [80]
+  const [maxContentSize, setMaxContentSize] = useState<number>(0)
+  const snapPointsMode = props.snapPointsMode ?? 'percent'
+  const snapPointsProp: (string | number)[] =
+    props.snapPoints ??
+    (snapPointsMode === 'percent'
+      ? [80]
+      : snapPointsMode === 'constant'
+      ? [256]
+      : ['fit'])
+  const hasFit = snapPointsProp[0] === 'fit'
 
   const snapPoints = useMemo(
     () => (props.dismissOnSnapToBottom ? [...snapPointsProp, 0] : snapPointsProp),
@@ -51,9 +60,54 @@ export function useSheetProviderProps(
   )
 
   if (process.env.NODE_ENV === 'development') {
-    if (snapPoints.some((p) => p < 0 || p > 100)) {
+    if (
+      snapPointsMode === 'mixed' &&
+      snapPoints.some((p) => {
+        if (typeof p === 'string') {
+          if (p === 'fit') {
+            return false
+          }
+          if (p.endsWith('%')) {
+            const n = Number(p.slice(0, -1))
+            return n < 0 || n > 100
+          }
+          return true
+        }
+        return typeof p !== 'number' || p < 0
+      })
+    ) {
       console.warn(
-        '⚠️ Invalid snapPoint given, snapPoints must be between 0 and 100, equal to percent height of frame'
+        '⚠️ Invalid snapPoint given, snapPoints must be positive numeric values, string percentages between 0-100%, or "fit" when snapPointsMode is mixed'
+      )
+    }
+    if (snapPointsMode === 'mixed' && snapPoints.indexOf('fit') > 0) {
+      console.warn(
+        '⚠️ Invalid snapPoint given, "fit" must be the first/largest snap point when snapPointsMode is mixed'
+      )
+    }
+    if (
+      snapPointsMode === 'fit' &&
+      (snapPoints.length !== (props.dismissOnSnapToBottom ? 2 : 1) ||
+        snapPoints[0] !== 'fit')
+    ) {
+      console.warn(
+        '⚠️ Invalid snapPoint given, there are no snap points when snapPointsMode is fit'
+      )
+    }
+    if (
+      snapPointsMode === 'constant' &&
+      snapPoints.some((p) => typeof p !== 'number' || p < 0)
+    ) {
+      console.warn(
+        '⚠️ Invalid snapPoint given, snapPoints must be positive numeric values when snapPointsMode is constant'
+      )
+    }
+    if (
+      snapPointsMode === 'percent' &&
+      snapPoints.some((p) => typeof p !== 'number' || p < 0 || p > 100)
+    ) {
+      console.warn(
+        '⚠️ Invalid snapPoint given, snapPoints must be numeric values between 0 and 100 when snapPointsMode is percent'
       )
     }
   }
@@ -89,8 +143,11 @@ export function useSheetProviderProps(
 
   const removeScrollEnabled = props.forceRemoveScrollEnabled ?? (open && props.modal)
 
-  const maxSnapPoint = snapPoints.reduce((prev, cur) => Math.max(prev, cur))
-  const screenSize = frameSize / (maxSnapPoint / 100)
+  const maxSnapPoint = snapPoints[0]
+  const screenSize =
+    snapPointsMode === 'percent'
+      ? frameSize / ((typeof maxSnapPoint === 'number' ? maxSnapPoint : 100) / 100)
+      : maxContentSize
 
   const providerProps = {
     screenSize,
@@ -108,8 +165,11 @@ export function useSheetProviderProps(
     dismissOnSnapToBottom: props.dismissOnSnapToBottom ?? false,
     onOverlayComponent: options.onOverlayComponent,
     scope: props.__scopeSheet,
+    hasFit,
     position,
     snapPoints,
+    snapPointsMode,
+    setMaxContentSize,
     setPosition,
     setPositionImmediate,
     onlyShowFrame: false,

package/types/Sheet.d.ts

@@ -198,7 +198,8 @@ export declare const Sheet: import("react").ForwardRefExoticComponent<{
     onOpenChange?: (((open: boolean) => void) | import("react").Dispatch<import("react").SetStateAction<boolean>>) | undefined;
     position?: number | undefined;
     defaultPosition?: number | undefined;
-    snapPoints?: number[] | undefined;
+    snapPoints?: (string | number)[] | undefined;
+    snapPointsMode?: import("./types").SnapPointsMode | undefined;
     onPositionChange?: import("./types").PositionChangeHandler | undefined;
     children?: import("react").ReactNode;
     dismissOnOverlayPress?: boolean | undefined;

package/types/Sheet.d.ts.map

@@ -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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAIhB,CAAA;AAEF,uCAAuC;AACvC,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAAU,CAAA;AAExC,uCAAuC;AACvC,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAAS,CAAA"}
+{"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"}

package/types/SheetContext.d.ts

@@ -12,7 +12,7 @@ export declare const createSheetContext: <ContextValueType extends object | null
 export declare const SheetProvider: {
     (props: {
         screenSize: number;
-        maxSnapPoint: number;
+        maxSnapPoint: string | number;
         removeScrollEnabled: boolean | undefined;
         scrollBridge: import("./types").ScrollBridge;
         modal: boolean;
@@ -26,15 +26,18 @@ export declare const SheetProvider: {
         dismissOnSnapToBottom: boolean;
         onOverlayComponent: ((comp: any) => void) | undefined;
         scope: import("@tamagui/create-context").Scope<any>;
+        hasFit: boolean;
         position: number;
-        snapPoints: number[];
+        snapPoints: (string | number)[];
+        snapPointsMode: import("./types").SnapPointsMode;
+        setMaxContentSize: import("react").Dispatch<import("react").SetStateAction<number>>;
         setPosition: (next: number) => void;
         setPositionImmediate: import("react").Dispatch<import("react").SetStateAction<number>>;
         onlyShowFrame: boolean;
     } & {
         scope: import("@tamagui/create-context").Scope<{
             screenSize: number;
-            maxSnapPoint: number;
+            maxSnapPoint: string | number;
             removeScrollEnabled: boolean | undefined;
             scrollBridge: import("./types").ScrollBridge;
             modal: boolean;
@@ -48,8 +51,11 @@ export declare const SheetProvider: {
             dismissOnSnapToBottom: boolean;
             onOverlayComponent: ((comp: any) => void) | undefined;
             scope: import("@tamagui/create-context").Scope<any>;
+            hasFit: boolean;
             position: number;
-            snapPoints: number[];
+            snapPoints: (string | number)[];
+            snapPointsMode: import("./types").SnapPointsMode;
+            setMaxContentSize: import("react").Dispatch<import("react").SetStateAction<number>>;
             setPosition: (next: number) => void;
             setPositionImmediate: import("react").Dispatch<import("react").SetStateAction<number>>;
             onlyShowFrame: boolean;
@@ -59,7 +65,7 @@ export declare const SheetProvider: {
     displayName: string;
 }, useSheetContext: (consumerName: string, scope: import("@tamagui/create-context").Scope<{
     screenSize: number;
-    maxSnapPoint: number;
+    maxSnapPoint: string | number;
     removeScrollEnabled: boolean | undefined;
     scrollBridge: import("./types").ScrollBridge;
     modal: boolean;
@@ -73,8 +79,11 @@ export declare const SheetProvider: {
     dismissOnSnapToBottom: boolean;
     onOverlayComponent: ((comp: any) => void) | undefined;
     scope: import("@tamagui/create-context").Scope<any>;
+    hasFit: boolean;
     position: number;
-    snapPoints: number[];
+    snapPoints: (string | number)[];
+    snapPointsMode: import("./types").SnapPointsMode;
+    setMaxContentSize: import("react").Dispatch<import("react").SetStateAction<number>>;
     setPosition: (next: number) => void;
     setPositionImmediate: import("react").Dispatch<import("react").SetStateAction<number>>;
     onlyShowFrame: boolean;
@@ -82,7 +91,7 @@ export declare const SheetProvider: {
     warn?: boolean | undefined;
     fallback?: Partial<{
         screenSize: number;
-        maxSnapPoint: number;
+        maxSnapPoint: string | number;
         removeScrollEnabled: boolean | undefined;
         scrollBridge: import("./types").ScrollBridge;
         modal: boolean;
@@ -96,15 +105,18 @@ export declare const SheetProvider: {
         dismissOnSnapToBottom: boolean;
         onOverlayComponent: ((comp: any) => void) | undefined;
         scope: import("@tamagui/create-context").Scope<any>;
+        hasFit: boolean;
         position: number;
-        snapPoints: number[];
+        snapPoints: (string | number)[];
+        snapPointsMode: import("./types").SnapPointsMode;
+        setMaxContentSize: import("react").Dispatch<import("react").SetStateAction<number>>;
         setPosition: (next: number) => void;
         setPositionImmediate: import("react").Dispatch<import("react").SetStateAction<number>>;
         onlyShowFrame: boolean;
     }> | undefined;
 } | undefined) => {
     screenSize: number;
-    maxSnapPoint: number;
+    maxSnapPoint: string | number;
     removeScrollEnabled: boolean | undefined;
     scrollBridge: import("./types").ScrollBridge;
     modal: boolean;
@@ -118,8 +130,11 @@ export declare const SheetProvider: {
     dismissOnSnapToBottom: boolean;
     onOverlayComponent: ((comp: any) => void) | undefined;
     scope: import("@tamagui/create-context").Scope<any>;
+    hasFit: boolean;
     position: number;
-    snapPoints: number[];
+    snapPoints: (string | number)[];
+    snapPointsMode: import("./types").SnapPointsMode;
+    setMaxContentSize: import("react").Dispatch<import("react").SetStateAction<number>>;
     setPosition: (next: number) => void;
     setPositionImmediate: import("react").Dispatch<import("react").SetStateAction<number>>;
     onlyShowFrame: boolean;

package/types/SheetContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SheetContext.d.ts","sourceRoot":"","sources":["../src/SheetContext.tsx"],"names":[],"mappings":";AAKA,eAAO,MAAO,kBAAkB;;;;;;;;;qCAAE,gBAAgB,+CAAkC,CAAA;AAEpF,eAAO,MAAO,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAAE,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAG3C,CAAA"}
+{"version":3,"file":"SheetContext.d.ts","sourceRoot":"","sources":["../src/SheetContext.tsx"],"names":[],"mappings":";AAKA,eAAO,MAAO,kBAAkB;;;;;;;;;qCAAE,gBAAgB,+CAAkC,CAAA;AAEpF,eAAO,MAAO,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAAE,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAG3C,CAAA"}

package/types/SheetImplementationCustom.d.ts

@@ -1,12 +1,14 @@
 /// <reference types="react" />
 import { View } from 'react-native';
+import { SnapPointsMode } from './types';
 export declare const SheetImplementationCustom: (props: Omit<{
     open?: boolean | undefined;
     defaultOpen?: boolean | undefined;
     onOpenChange?: (((open: boolean) => void) | import("react").Dispatch<import("react").SetStateAction<boolean>>) | undefined;
     position?: number | undefined;
     defaultPosition?: number | undefined;
-    snapPoints?: number[] | undefined;
+    snapPoints?: (string | number)[] | undefined;
+    snapPointsMode?: SnapPointsMode | undefined;
     onPositionChange?: import("./types").PositionChangeHandler | undefined;
     children?: import("react").ReactNode;
     dismissOnOverlayPress?: boolean | undefined;

package/types/SheetImplementationCustom.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SheetImplementationCustom.d.ts","sourceRoot":"","sources":["../src/SheetImplementationCustom.tsx"],"names":[],"mappings":";AAwBA,OAAO,EAOL,IAAI,EACL,MAAM,cAAc,CAAA;AAYrB,eAAO,MAAM,yBAAyB;;;;;;;;;;;;;;;;;;;;;;;;6MAgYrC,CAAA"}
+{"version":3,"file":"SheetImplementationCustom.d.ts","sourceRoot":"","sources":["../src/SheetImplementationCustom.tsx"],"names":[],"mappings":";AAwBA,OAAO,EAOL,IAAI,EACL,MAAM,cAAc,CAAA;AAMrB,OAAO,EAAc,cAAc,EAAE,MAAM,SAAS,CAAA;AAMpD,eAAO,MAAM,yBAAyB;;;;;;;;;;;;;;;;;;;;;;;;;6MAoarC,CAAA"}

package/types/createSheet.d.ts

@@ -17,7 +17,8 @@ export declare function createSheet<H extends SheetStyledComponent | TamaguiComp
     onOpenChange?: (((open: boolean) => void) | import("react").Dispatch<import("react").SetStateAction<boolean>>) | undefined;
     position?: number | undefined;
     defaultPosition?: number | undefined;
-    snapPoints?: number[] | undefined;
+    snapPoints?: (string | number)[] | undefined;
+    snapPointsMode?: import("./types").SnapPointsMode | undefined;
     onPositionChange?: import("./types").PositionChangeHandler | undefined;
     children?: import("react").ReactNode;
     dismissOnOverlayPress?: boolean | undefined;

package/types/createSheet.d.ts.map

@@ -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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+DA+B9C,iBAAiB,SAAS,cAAc,CAAC,CAAC;6CA7B5B,iBAAiB,SAAS,aAAa,CAAC,CAAC;;;;;;;;;;;;2DA6BvD,iBAAiB,SAAS,cAAc,CAAC,CAAC;yCA7B5B,iBAAiB,SAAS,aAAa,CAAC,CAAC;;;;;;;;EAiLzE"}
+{"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,EACL,iBAAiB,EACjB,aAAa,EAKd,MAAM,OAAO,CAAA;AACd,OAAO,EAA+B,IAAI,EAAE,MAAM,cAAc,CAAA;AAOhE,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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;+DA+B9C,iBAAiB,SAAS,cAAc,CAAC,CAAC;6CA7B5B,iBAAiB,SAAS,aAAa,CAAC,CAAC;;;;;;;;;;;;2DA6BvD,iBAAiB,SAAS,cAAc,CAAC,CAAC;yCA7B5B,iBAAiB,SAAS,aAAa,CAAC,CAAC;;;;;;;;EA4LzE"}

package/types/types.d.ts

@@ -9,7 +9,8 @@ export type SheetProps = ScopedProps<{
     onOpenChange?: OpenChangeHandler;
     position?: number;
     defaultPosition?: number;
-    snapPoints?: number[];
+    snapPoints?: (string | number)[];
+    snapPointsMode?: SnapPointsMode;
     onPositionChange?: PositionChangeHandler;
     children?: ReactNode;
     dismissOnOverlayPress?: boolean;
@@ -41,6 +42,7 @@ export type SheetProps = ScopedProps<{
 export type PositionChangeHandler = (position: number) => void;
 type OpenChangeHandler = ((open: boolean) => void) | React.Dispatch<React.SetStateAction<boolean>>;
 export type RemoveScrollProps = React.ComponentProps<typeof RemoveScroll>;
+export type SnapPointsMode = 'percent' | 'constant' | 'fit' | 'mixed';
 export type SheetScopedProps<A> = ScopedProps<A, 'Sheet'>;
 export type ScrollBridge = {
     enabled: boolean;

package/types/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,aAAa,EAAE,MAAM,eAAe,CAAA;AACrE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAA;AAC1D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAA;AACrD,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAExC,MAAM,MAAM,UAAU,GAAG,WAAW,CAClC;IACE,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,YAAY,CAAC,EAAE,iBAAiB,CAAA;IAChC,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,UAAU,CAAC,EAAE,MAAM,EAAE,CAAA;IACrB,gBAAgB,CAAC,EAAE,qBAAqB,CAAA;IACxC,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,qBAAqB,CAAC,EAAE,OAAO,CAAA;IAC/B,qBAAqB,CAAC,EAAE,OAAO,CAAA;IAC/B,wBAAwB,CAAC,EAAE,OAAO,CAAA;IAClC,eAAe,CAAC,EAAE,sBAAsB,CAAA;IAExC;;OAEG;IACH,yBAAyB,CAAC,EAAE,OAAO,CAAA;IAEnC;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,EAAE,GAAG,OAAO,CAAA;IAE1B;;OAEG;IACH,SAAS,CAAC,EAAE,aAAa,CAAA;IACzB,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,WAAW,CAAC,EAAE,WAAW,CAAA;IACzB;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAA;CAC/B,EACD,OAAO,CACR,CAAA;AAED,MAAM,MAAM,qBAAqB,GAAG,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAA;AAE9D,KAAK,iBAAiB,GAClB,CAAC,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC,GACzB,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAA;AAEjD,MAAM,MAAM,iBAAiB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,YAAY,CAAC,CAAA;AAEzE,MAAM,MAAM,gBAAgB,CAAC,CAAC,IAAI,WAAW,CAAC,CAAC,EAAE,OAAO,CAAC,CAAA;AAEzD,MAAM,MAAM,YAAY,GAAG;IACzB,OAAO,EAAE,OAAO,CAAA;IAChB,CAAC,EAAE,MAAM,CAAA;IACT,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,MAAM,CAAA;IAChB,YAAY,EAAE,MAAM,CAAA;IACpB,IAAI,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IAC1B,OAAO,EAAE,CAAC,KAAK,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAA;IACxD,UAAU,EAAE,OAAO,CAAA;IACnB,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;CAC7B,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,aAAa,EAAE,MAAM,eAAe,CAAA;AACrE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAA;AAC1D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAA;AACrD,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAExC,MAAM,MAAM,UAAU,GAAG,WAAW,CAClC;IACE,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,YAAY,CAAC,EAAE,iBAAiB,CAAA;IAChC,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,UAAU,CAAC,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,CAAA;IAChC,cAAc,CAAC,EAAE,cAAc,CAAA;IAC/B,gBAAgB,CAAC,EAAE,qBAAqB,CAAA;IACxC,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,qBAAqB,CAAC,EAAE,OAAO,CAAA;IAC/B,qBAAqB,CAAC,EAAE,OAAO,CAAA;IAC/B,wBAAwB,CAAC,EAAE,OAAO,CAAA;IAClC,eAAe,CAAC,EAAE,sBAAsB,CAAA;IAExC;;OAEG;IACH,yBAAyB,CAAC,EAAE,OAAO,CAAA;IAEnC;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,EAAE,GAAG,OAAO,CAAA;IAE1B;;OAEG;IACH,SAAS,CAAC,EAAE,aAAa,CAAA;IACzB,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,WAAW,CAAC,EAAE,WAAW,CAAA;IACzB;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAA;CAC/B,EACD,OAAO,CACR,CAAA;AAED,MAAM,MAAM,qBAAqB,GAAG,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAA;AAE9D,KAAK,iBAAiB,GAClB,CAAC,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC,GACzB,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAA;AAEjD,MAAM,MAAM,iBAAiB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,YAAY,CAAC,CAAA;AAEzE,MAAM,MAAM,cAAc,GAAG,SAAS,GAAG,UAAU,GAAG,KAAK,GAAG,OAAO,CAAA;AAErE,MAAM,MAAM,gBAAgB,CAAC,CAAC,IAAI,WAAW,CAAC,CAAC,EAAE,OAAO,CAAC,CAAA;AAEzD,MAAM,MAAM,YAAY,GAAG;IACzB,OAAO,EAAE,OAAO,CAAA;IAChB,CAAC,EAAE,MAAM,CAAA;IACT,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,MAAM,CAAA;IAChB,YAAY,EAAE,MAAM,CAAA;IACpB,IAAI,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;IAC1B,OAAO,EAAE,CAAC,KAAK,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAA;IACxD,UAAU,EAAE,OAAO,CAAA;IACnB,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;CAC7B,CAAA"}

package/types/useSheet.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 export declare const useSheet: () => {
     screenSize: number;
-    maxSnapPoint: number;
+    maxSnapPoint: string | number;
     removeScrollEnabled: boolean | undefined;
     scrollBridge: import("./types").ScrollBridge;
     modal: boolean;
@@ -15,8 +15,11 @@ export declare const useSheet: () => {
     dismissOnSnapToBottom: boolean;
     onOverlayComponent: ((comp: any) => void) | undefined;
     scope: import("@tamagui/create-context").Scope<any>;
+    hasFit: boolean;
     position: number;
-    snapPoints: number[];
+    snapPoints: (string | number)[];
+    snapPointsMode: import("./types").SnapPointsMode;
+    setMaxContentSize: import("react").Dispatch<import("react").SetStateAction<number>>;
     setPosition: (next: number) => void;
     setPositionImmediate: import("react").Dispatch<import("react").SetStateAction<number>>;
     onlyShowFrame: boolean;

package/types/useSheet.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useSheet.d.ts","sourceRoot":"","sources":["../src/useSheet.tsx"],"names":[],"mappings":";AAEA,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;CAAuC,CAAA"}
+{"version":3,"file":"useSheet.d.ts","sourceRoot":"","sources":["../src/useSheet.tsx"],"names":[],"mappings":";AAEA,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;CAAuC,CAAA"}

package/types/useSheetOffscreenSize.d.ts

@@ -1,3 +1,3 @@
 import { SheetContextValue } from './useSheetProviderProps';
-export declare const useSheetOffscreenSize: ({ snapPoints, position, screenSize, }: SheetContextValue) => number;
+export declare const useSheetOffscreenSize: ({ snapPoints, position, screenSize, frameSize, snapPointsMode, }: SheetContextValue) => number;
 //# sourceMappingURL=useSheetOffscreenSize.d.ts.map

package/types/useSheetOffscreenSize.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useSheetOffscreenSize.d.ts","sourceRoot":"","sources":["../src/useSheetOffscreenSize.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAA;AAE3D,eAAO,MAAM,qBAAqB,0CAI/B,iBAAiB,WAMnB,CAAA"}
+{"version":3,"file":"useSheetOffscreenSize.d.ts","sourceRoot":"","sources":["../src/useSheetOffscreenSize.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAA;AAE3D,eAAO,MAAM,qBAAqB,qEAM/B,iBAAiB,WAwCnB,CAAA"}

package/types/useSheetProviderProps.d.ts

@@ -7,7 +7,7 @@ export declare function useSheetProviderProps(props: SheetProps, state: SheetOpe
     onOverlayComponent?: (comp: any) => void;
 }): {
     screenSize: number;
-    maxSnapPoint: number;
+    maxSnapPoint: string | number;
     removeScrollEnabled: boolean | undefined;
     scrollBridge: ScrollBridge;
     modal: boolean;
@@ -21,8 +21,11 @@ export declare function useSheetProviderProps(props: SheetProps, state: SheetOpe
     dismissOnSnapToBottom: boolean;
     onOverlayComponent: ((comp: any) => void) | undefined;
     scope: import("@tamagui/create-context").Scope<any>;
+    hasFit: boolean;
     position: number;
-    snapPoints: number[];
+    snapPoints: (string | number)[];
+    snapPointsMode: import("./types").SnapPointsMode;
+    setMaxContentSize: React.Dispatch<React.SetStateAction<number>>;
     setPosition: (next: number) => void;
     setPositionImmediate: React.Dispatch<React.SetStateAction<number>>;
     onlyShowFrame: boolean;

package/types/useSheetProviderProps.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useSheetProviderProps.d.ts","sourceRoot":"","sources":["../src/useSheetProviderProps.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAsB,MAAM,eAAe,CAAA;AAGlE,OAAO,KAAoD,MAAM,OAAO,CAAA;AAExE,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAClD,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAA;AAEpD,MAAM,MAAM,iBAAiB,GAAG,UAAU,CAAC,OAAO,qBAAqB,CAAC,CAAA;AAExE,wBAAgB,qBAAqB,CACnC,KAAK,EAAE,UAAU,EACjB,KAAK,EAAE,cAAc,EACrB,OAAO,GAAE;IACP,kBAAkB,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAA;CACpC;;;;;;;;;;;;;;gCADwB,GAAG,KAAK,IAAI;;;;wBA2BjC,MAAM;;;EA6EhB"}
+{"version":3,"file":"useSheetProviderProps.d.ts","sourceRoot":"","sources":["../src/useSheetProviderProps.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAsB,MAAM,eAAe,CAAA;AAGlE,OAAO,KAAoD,MAAM,OAAO,CAAA;AAExE,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAClD,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAA;AAEpD,MAAM,MAAM,iBAAiB,GAAG,UAAU,CAAC,OAAO,qBAAqB,CAAC,CAAA;AAExE,wBAAgB,qBAAqB,CACnC,KAAK,EAAE,UAAU,EACjB,KAAK,EAAE,cAAc,EACrB,OAAO,GAAE;IACP,kBAAkB,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAA;CACpC;;;;;;;;;;;;;;gCADwB,GAAG,KAAK,IAAI;;;;;;;wBAoCjC,MAAM;;;EAgIhB"}