react-modal-sheet 4.2.0 → 4.3.0

package/src/types.tsx

@@ -85,6 +85,7 @@ export type SheetBackdropProps = Omit<
 
 export type SheetScrollerProps = HTMLAttributes<HTMLDivElement> & {
   draggableAt?: 'top' | 'bottom' | 'both';
+  disableScroll?: boolean;
 };
 
 export interface SheetDragProps {

package/src/utils.ts

@@ -1,5 +1,6 @@
 import { type ForwardedRef, type RefCallback, type RefObject } from 'react';
 import { IS_SSR } from './constants';
+import type { SheetDetent } from './types';
 
 /**
  * Get the rounded height of the sheet element and log a warning if the
@@ -45,6 +46,39 @@ export function getSnapPoints({
   return snapPointValues;
 }
 
+export function getClosestSnapPoint({
+  snapPoints,
+  currentY,
+  sheetHeight,
+  detent,
+}: {
+  snapPoints: number[];
+  currentY: number;
+  sheetHeight: number;
+  detent?: SheetDetent;
+}) {
+  // Inverse values are the values that can be passed to `animate`
+  const snapInverse = snapPoints.map(
+    (p) => sheetHeight - Math.min(p, sheetHeight)
+  );
+
+  // Allow snapping to the top of the sheet if detent is set to `content-height`
+  if (detent === 'content-height' && !snapInverse.includes(0)) {
+    snapInverse.unshift(0);
+  }
+
+  // Get the closest snap point
+  const snapTo = getClosest(snapInverse, currentY);
+  const snapIndex = snapInverse.indexOf(snapTo);
+
+  const snapY = validateSnapTo({
+    snapTo: getClosest(snapInverse, currentY),
+    sheetHeight,
+  });
+
+  return { snapY, snapIndex };
+}
+
 /**
  * Get the closest number to the goal from the array of numbers.
  */