react-native-bottom-sheet-stack 1.4.3 → 1.5.1

package/src/useBottomSheetManager.tsx

@@ -2,25 +2,17 @@ import React from 'react';
 
 import { useBottomSheetStore, type OpenMode } from './bottomSheet.store';
 import { useMaybeBottomSheetManagerContext } from './BottomSheetManager.provider';
-import { sheetRefs } from './refsMap';
+import { setSheetRef } from './refsMap';
 import type { BottomSheetMethods } from '@gorhom/bottom-sheet/lib/typescript/types';
 import { shallow } from 'zustand/shallow';
 
 export const useBottomSheetManager = () => {
   const bottomSheetManagerContext = useMaybeBottomSheetManagerContext();
 
-  const {
-    pushBottomSheet,
-    replaceBottomSheet,
-    switchBottomSheet,
-    startClosing,
-    storeClearAll,
-  } = useBottomSheetStore(
+  const { storeOpen, startClosing, storeClearGroup } = useBottomSheetStore(
     (store) => ({
-      storeClearAll: store.clearAll,
-      replaceBottomSheet: store.replace,
-      pushBottomSheet: store.push,
-      switchBottomSheet: store.switch,
+      storeOpen: store.open,
+      storeClearGroup: store.clearGroup,
       startClosing: store.startClosing,
     }),
     shallow
@@ -41,25 +33,21 @@ export const useBottomSheetManager = () => {
     const id = options.id || Math.random().toString(36);
     const ref = React.createRef<BottomSheetMethods>();
 
-    sheetRefs[id] = ref;
+    setSheetRef(id, ref);
 
-    // @ts-ignore
-    const contentWithRef = React.cloneElement(content, { ref });
+    const contentWithRef = React.cloneElement(content, {
+      ref,
+    } as { ref: typeof ref });
 
-    const sheetData = {
-      id,
-      groupId,
-      content: contentWithRef,
-      scaleBackground: options.scaleBackground,
-    };
-
-    if (options.mode === 'replace') {
-      replaceBottomSheet(sheetData);
-    } else if (options.mode === 'switch') {
-      switchBottomSheet(sheetData);
-    } else {
-      pushBottomSheet(sheetData);
-    }
+    storeOpen(
+      {
+        id,
+        groupId,
+        content: contentWithRef,
+        scaleBackground: options.scaleBackground,
+      },
+      options.mode
+    );
 
     return id;
   };
@@ -68,15 +56,18 @@ export const useBottomSheetManager = () => {
     startClosing(id);
   };
 
-  const clearAll = () => {
-    storeClearAll();
+  const clear = () => {
+    const groupId = bottomSheetManagerContext?.groupId || 'default';
+    storeClearGroup(groupId);
   };
 
   return {
-    clearAll,
+    open: openBottomSheet,
     close,
+    clear,
+    /** @deprecated Use `open` instead */
     openBottomSheet,
-    pushBottomSheet,
-    replaceBottomSheet,
+    /** @deprecated Use `clear` instead */
+    clearAll: clear,
   };
 };

package/src/useBottomSheetState.ts

@@ -8,26 +8,23 @@ import type {
   BottomSheetPortalParams,
 } from './portal.types';
 
-// Marker type to detect when no generic is provided
-declare const UNSPECIFIED: unique symbol;
-type Unspecified = typeof UNSPECIFIED;
-
-type ResolveParams<T> = T extends Unspecified
-  ? unknown
-  : T extends BottomSheetPortalId
-    ? BottomSheetPortalParams<T>
-    : unknown;
-
-export interface UseBottomSheetStateReturn<T> {
+export interface UseBottomSheetContextReturn<TParams> {
   bottomSheetState: BottomSheetState;
-  params: ResolveParams<T>;
+  params: TParams;
   close: () => void;
+  /** @deprecated Use `close` instead */
   closeBottomSheet: () => void;
 }
 
-export function useBottomSheetState<
-  T extends BottomSheetPortalId | Unspecified = Unspecified,
->(): UseBottomSheetStateReturn<T> {
+/** Without generic - params typed as unknown */
+export function useBottomSheetContext(): UseBottomSheetContextReturn<unknown>;
+/** With generic - params typed based on portal registry */
+export function useBottomSheetContext<
+  T extends BottomSheetPortalId,
+>(): UseBottomSheetContextReturn<BottomSheetPortalParams<T>>;
+export function useBottomSheetContext<
+  T extends BottomSheetPortalId,
+>(): UseBottomSheetContextReturn<BottomSheetPortalParams<T> | unknown> {
   const context = useMaybeBottomSheetContext();
 
   const bottomSheetState = useBottomSheetStore(
@@ -38,7 +35,7 @@ export function useBottomSheetState<
 
   if (!bottomSheetState) {
     throw new Error(
-      'useBottomSheetState must be used within a BottomSheetProvider'
+      'useBottomSheetContext must be used within a BottomSheet component'
     );
   }
 
@@ -46,8 +43,13 @@ export function useBottomSheetState<
 
   return {
     bottomSheetState,
-    params: bottomSheetState.params as ResolveParams<T>,
+    params: bottomSheetState.params as BottomSheetPortalParams<T>,
     close,
     closeBottomSheet: close,
   };
 }
+
+/**
+ * @deprecated Use `useBottomSheetContext` instead
+ */
+export const useBottomSheetState = useBottomSheetContext;

package/src/useBottomSheetStatus.ts

@@ -0,0 +1,25 @@
+import {
+  useBottomSheetStore,
+  type BottomSheetStatus,
+} from './bottomSheet.store';
+import type { BottomSheetPortalId } from './portal.types';
+
+export interface UseBottomSheetStatusReturn {
+  status: BottomSheetStatus | null;
+  isOpen: boolean;
+}
+
+export function useBottomSheetStatus(
+  id: BottomSheetPortalId
+): UseBottomSheetStatusReturn {
+  const status = useBottomSheetStore(
+    (state) => state.sheetsById[id]?.status ?? null
+  );
+
+  const isOpen = status === 'open' || status === 'opening';
+
+  return {
+    status,
+    isOpen,
+  };
+}

package/src/useScaleAnimation.ts

@@ -78,7 +78,12 @@ export function useScaleDepth(groupId: string, sheetId?: string): number {
  * Returns animated style for scale effect based on depth.
  * Uses power scaling: scale^depth for cascading effect.
  */
-export function useScaleAnimatedStyle(depth: number, config?: ScaleConfig) {
+export function useScaleAnimatedStyle(
+  { groupId, id }: { groupId: string; id?: string },
+  config?: ScaleConfig
+) {
+  const scaleDepth = useScaleDepth(groupId, id);
+
   const {
     scale = DEFAULT_CONFIG.scale,
     translateY = DEFAULT_CONFIG.translateY,
@@ -87,7 +92,7 @@ export function useScaleAnimatedStyle(depth: number, config?: ScaleConfig) {
   } = config ?? {};
 
   const progress = useDerivedValue(() => {
-    return withTiming(depth, { duration });
+    return withTiming(scaleDepth, { duration });
   });
 
   return useAnimatedStyle(() => {