@lodev09/react-native-true-sheet 3.1.0-beta.9 → 3.1.0

package/lib/typescript/src/navigation/createTrueSheetNavigator.d.ts

@@ -0,0 +1,35 @@
+import { type NavigatorTypeBagBase, type ParamListBase, type StaticConfig, type TypedNavigator } from '@react-navigation/native';
+import type { TrueSheetNavigationEventMap, TrueSheetNavigationOptions, TrueSheetNavigationProp, TrueSheetNavigationState, TrueSheetNavigatorProps } from './types';
+declare function TrueSheetNavigator({ id, initialRouteName, children, screenListeners, screenOptions, }: TrueSheetNavigatorProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * Creates a TrueSheet navigator.
+ *
+ * @example
+ * ```tsx
+ * const Sheet = createTrueSheetNavigator();
+ *
+ * function App() {
+ *   return (
+ *     <Sheet.Navigator>
+ *       <Sheet.Screen name="Home" component={HomeScreen} />
+ *       <Sheet.Screen
+ *         name="Details"
+ *         component={DetailsSheet}
+ *         options={{ detents: [0.5, 1] }}
+ *       />
+ *     </Sheet.Navigator>
+ *   );
+ * }
+ * ```
+ */
+export declare const createTrueSheetNavigator: <const ParamList extends ParamListBase, const NavigatorID extends string | undefined = undefined, const TypeBag extends NavigatorTypeBagBase = {
+    ParamList: ParamList;
+    NavigatorID: NavigatorID;
+    State: TrueSheetNavigationState<ParamList>;
+    ScreenOptions: TrueSheetNavigationOptions;
+    EventMap: TrueSheetNavigationEventMap;
+    NavigationList: { [RouteName in keyof ParamList]: TrueSheetNavigationProp<ParamList, RouteName, NavigatorID>; };
+    Navigator: typeof TrueSheetNavigator;
+}, const Config extends StaticConfig<TypeBag> = StaticConfig<TypeBag>>(config?: Config) => TypedNavigator<TypeBag, Config>;
+export {};
+//# sourceMappingURL=createTrueSheetNavigator.d.ts.map

package/lib/typescript/src/navigation/createTrueSheetNavigator.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createTrueSheetNavigator.d.ts","sourceRoot":"","sources":["../../../../src/navigation/createTrueSheetNavigator.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,oBAAoB,EACzB,KAAK,aAAa,EAClB,KAAK,YAAY,EACjB,KAAK,cAAc,EAEpB,MAAM,0BAA0B,CAAC;AAIlC,OAAO,KAAK,EAEV,2BAA2B,EAC3B,0BAA0B,EAC1B,uBAAuB,EACvB,wBAAwB,EACxB,uBAAuB,EACxB,MAAM,SAAS,CAAC;AAEjB,iBAAS,kBAAkB,CAAC,EAC1B,EAAE,EACF,gBAAgB,EAChB,QAAQ,EACR,eAAe,EACf,aAAa,GACd,EAAE,uBAAuB,2CAoBzB;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,eAAO,MAAM,wBAAwB,GACnC,KAAK,CAAC,SAAS,SAAS,aAAa,EACrC,KAAK,CAAC,WAAW,SAAS,MAAM,GAAG,SAAS,GAAG,SAAS,EACxD,KAAK,CAAC,OAAO,SAAS,oBAAoB,GAAG;IAC3C,SAAS,EAAE,SAAS,CAAC;IACrB,WAAW,EAAE,WAAW,CAAC;IACzB,KAAK,EAAE,wBAAwB,CAAC,SAAS,CAAC,CAAC;IAC3C,aAAa,EAAE,0BAA0B,CAAC;IAC1C,QAAQ,EAAE,2BAA2B,CAAC;IACtC,cAAc,EAAE,GACb,SAAS,IAAI,MAAM,SAAS,GAAG,uBAAuB,CAAC,SAAS,EAAE,SAAS,EAAE,WAAW,CAAC,GAC3F,CAAC;IACF,SAAS,EAAE,OAAO,kBAAkB,CAAC;CACtC,EACD,KAAK,CAAC,MAAM,SAAS,YAAY,CAAC,OAAO,CAAC,GAAG,YAAY,CAAC,OAAO,CAAC,EAElE,SAAS,MAAM,KACd,cAAc,CAAC,OAAO,EAAE,MAAM,CAEhC,CAAC"}

package/lib/typescript/src/navigation/index.d.ts

@@ -0,0 +1,6 @@
+export { createTrueSheetNavigator } from './createTrueSheetNavigator';
+export { TrueSheetActions, type TrueSheetActionType } from './TrueSheetRouter';
+export { useTrueSheetNavigation } from './useTrueSheetNavigation';
+export type { DetentInfoEventPayload, PositionChangeEventPayload } from '../TrueSheet.types';
+export type { TrueSheetNavigationEventMap, TrueSheetNavigationHelpers, TrueSheetNavigationOptions, TrueSheetNavigationProp, TrueSheetNavigationState, TrueSheetScreenProps, } from './types';
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/navigation/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/navigation/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,EAAE,MAAM,4BAA4B,CAAC;AACtE,OAAO,EAAE,gBAAgB,EAAE,KAAK,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAC/E,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAElE,YAAY,EAAE,sBAAsB,EAAE,0BAA0B,EAAE,MAAM,oBAAoB,CAAC;AAE7F,YAAY,EACV,2BAA2B,EAC3B,0BAA0B,EAC1B,0BAA0B,EAC1B,uBAAuB,EACvB,wBAAwB,EACxB,oBAAoB,GACrB,MAAM,SAAS,CAAC"}

package/lib/typescript/src/navigation/types.d.ts

@@ -0,0 +1,125 @@
+import type { DefaultNavigatorOptions, Descriptor, NavigationHelpers, NavigationProp, NavigationState, ParamListBase, RouteProp, StackActionHelpers } from '@react-navigation/native';
+import type { DetentInfoEventPayload, PositionChangeEventPayload, TrueSheetProps } from '../TrueSheet.types';
+export type TrueSheetNavigationEventMap = {
+    /**
+     * Event fired when the sheet is about to be presented.
+     */
+    sheetWillPresent: {
+        data: DetentInfoEventPayload;
+    };
+    /**
+     * Event fired when the sheet has been presented.
+     */
+    sheetDidPresent: {
+        data: DetentInfoEventPayload;
+    };
+    /**
+     * Event fired when the sheet is about to be dismissed.
+     */
+    sheetWillDismiss: {
+        data: undefined;
+    };
+    /**
+     * Event fired when the sheet has been dismissed.
+     */
+    sheetDidDismiss: {
+        data: undefined;
+    };
+    /**
+     * Event fired when the sheet's detent changes.
+     */
+    sheetDetentChange: {
+        data: DetentInfoEventPayload;
+    };
+    /**
+     * Event fired when the user starts dragging the sheet.
+     */
+    sheetDragBegin: {
+        data: DetentInfoEventPayload;
+    };
+    /**
+     * Event fired while the user is dragging the sheet.
+     */
+    sheetDragChange: {
+        data: DetentInfoEventPayload;
+    };
+    /**
+     * Event fired when the user stops dragging the sheet.
+     */
+    sheetDragEnd: {
+        data: DetentInfoEventPayload;
+    };
+    /**
+     * Event fired when the sheet's position changes.
+     */
+    sheetPositionChange: {
+        data: PositionChangeEventPayload;
+    };
+    /**
+     * Event fired when the sheet is about to regain focus.
+     */
+    sheetWillFocus: {
+        data: undefined;
+    };
+    /**
+     * Event fired when the sheet regains focus.
+     */
+    sheetDidFocus: {
+        data: undefined;
+    };
+    /**
+     * Event fired when the sheet is about to lose focus.
+     */
+    sheetWillBlur: {
+        data: undefined;
+    };
+    /**
+     * Event fired when the sheet loses focus.
+     */
+    sheetDidBlur: {
+        data: undefined;
+    };
+};
+export type TrueSheetNavigationState<ParamList extends ParamListBase> = Omit<NavigationState<ParamList>, 'routes'> & {
+    type: 'true-sheet';
+    routes: (NavigationState<ParamList>['routes'][number] & {
+        resizeIndex?: number;
+        resizeKey?: number;
+        closing?: boolean;
+    })[];
+};
+export type TrueSheetActionHelpers<ParamList extends ParamListBase> = StackActionHelpers<ParamList> & {
+    /**
+     * Resize the sheet to a specific detent index.
+     */
+    resize(index?: number): void;
+};
+export type TrueSheetNavigationProp<ParamList extends ParamListBase, RouteName extends keyof ParamList = string, NavigatorID extends string | undefined = undefined> = NavigationProp<ParamList, RouteName, NavigatorID, TrueSheetNavigationState<ParamList>, TrueSheetNavigationOptions, TrueSheetNavigationEventMap> & TrueSheetActionHelpers<ParamList>;
+export type TrueSheetScreenProps<ParamList extends ParamListBase, RouteName extends keyof ParamList = string, NavigatorID extends string | undefined = undefined> = {
+    navigation: TrueSheetNavigationProp<ParamList, RouteName, NavigatorID>;
+    route: RouteProp<ParamList, RouteName>;
+};
+export type TrueSheetNavigationHelpers = NavigationHelpers<ParamListBase, TrueSheetNavigationEventMap>;
+/**
+ * Screen options for TrueSheet navigator screens.
+ */
+export type TrueSheetNavigationOptions = Pick<TrueSheetProps, 'detents' | 'backgroundColor' | 'cornerRadius' | 'dismissible' | 'draggable' | 'grabber' | 'grabberOptions' | 'dimmed' | 'dimmedDetentIndex' | 'blurTint' | 'blurOptions' | 'maxHeight' | 'edgeToEdgeFullScreen' | 'scrollable' | 'keyboardMode' | 'pageSizing' | 'header' | 'footer'> & {
+    /**
+     * The detent index to present at.
+     * @default 0
+     */
+    detentIndex?: number;
+};
+export type TrueSheetNavigatorProps = DefaultNavigatorOptions<ParamListBase, string | undefined, TrueSheetNavigationState<ParamListBase>, TrueSheetNavigationOptions, TrueSheetNavigationEventMap, unknown> & {
+    /**
+     * The name of the route to use as the base screen.
+     * This screen will be rendered as a regular screen, while other screens are presented as sheets.
+     * Defaults to the first screen defined in the navigator.
+     */
+    initialRouteName?: string;
+};
+export type TrueSheetDescriptor = Descriptor<TrueSheetNavigationOptions, TrueSheetNavigationProp<ParamListBase>, RouteProp<ParamListBase>>;
+export type TrueSheetDescriptorMap = {
+    [key: string]: TrueSheetDescriptor;
+};
+//# sourceMappingURL=types.d.ts.map

package/lib/typescript/src/navigation/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/navigation/types.ts"],"names":[],"mappings":"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"}

package/lib/typescript/src/navigation/useTrueSheetNavigation.d.ts

@@ -0,0 +1,23 @@
+import { type ParamListBase } from '@react-navigation/native';
+import type { TrueSheetNavigationProp } from './types';
+/**
+ * Hook to access TrueSheet navigation with the resize helper.
+ *
+ * @example
+ * ```tsx
+ * function MySheet() {
+ *   const navigation = useTrueSheetNavigation();
+ *
+ *   // Resize to a specific detent
+ *   const handleExpand = () => {
+ *     navigation.resize(1); // Resize to second detent
+ *   };
+ *
+ *   return (
+ *     <Button title="Expand" onPress={handleExpand} />
+ *   );
+ * }
+ * ```
+ */
+export declare function useTrueSheetNavigation<T extends ParamListBase = ParamListBase>(): TrueSheetNavigationProp<T>;
+//# sourceMappingURL=useTrueSheetNavigation.d.ts.map

package/lib/typescript/src/navigation/useTrueSheetNavigation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTrueSheetNavigation.d.ts","sourceRoot":"","sources":["../../../../src/navigation/useTrueSheetNavigation.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAE7E,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,SAAS,CAAC;AAEvD;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,sBAAsB,CACpC,CAAC,SAAS,aAAa,GAAG,aAAa,KACpC,uBAAuB,CAAC,CAAC,CAAC,CAE9B"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lodev09/react-native-true-sheet",
-  "version": "3.1.0-beta.9",
+  "version": "3.1.0",
   "description": "The true native bottom sheet experience for your React Native Apps.",
   "source": "./src/index.ts",
   "main": "./lib/module/index.js",
@@ -16,6 +16,11 @@
       "types": "./lib/typescript/src/reanimated/index.d.ts",
       "default": "./lib/module/reanimated/index.js"
     },
+    "./navigation": {
+      "source": "./src/navigation/index.ts",
+      "types": "./lib/typescript/src/navigation/index.d.ts",
+      "default": "./lib/module/navigation/index.js"
+    },
     "./package.json": "./package.json"
   },
   "files": [
@@ -81,6 +86,7 @@
     "@evilmartians/lefthook": "^2.0.4",
     "@react-native/babel-preset": "^0.82.1",
     "@react-native/eslint-config": "^0.82.1",
+    "@react-navigation/native": "^7.1.6",
     "@release-it/conventional-changelog": "^10.0.1",
     "@testing-library/react-native": "^13.3.3",
     "@types/babel__core": "^7",
@@ -92,6 +98,7 @@
     "eslint-config-prettier": "^10.1.8",
     "eslint-plugin-prettier": "^5.5.4",
     "jest": "^29.7.0",
+    "nanoid": "^5.1.5",
     "prettier": "^3.0.3",
     "react": "19.1.1",
     "react-native": "0.82.1",
@@ -107,12 +114,16 @@
     "@types/react": "19.1.1"
   },
   "peerDependencies": {
+    "@react-navigation/native": ">=6.0.0",
     "react": "*",
     "react-native": "*",
     "react-native-reanimated": ">=4.0.0",
     "react-native-worklets": "*"
   },
   "peerDependenciesMeta": {
+    "@react-navigation/native": {
+      "optional": true
+    },
     "react-native-reanimated": {
       "optional": true
     },

package/src/navigation/TrueSheetRouter.ts

@@ -0,0 +1,172 @@
+import { nanoid } from 'nanoid/non-secure';
+import {
+  type CommonActions,
+  type ParamListBase,
+  type Router,
+  StackRouter,
+  type StackActionType,
+  StackActions,
+  type StackRouterOptions,
+} from '@react-navigation/native';
+
+import type { TrueSheetNavigationState } from './types';
+
+export type TrueSheetRouterOptions = StackRouterOptions;
+
+export type TrueSheetActionType =
+  | StackActionType
+  | ReturnType<typeof CommonActions.goBack>
+  | {
+      type: 'RESIZE';
+      index: number;
+      source?: string;
+      target?: string;
+    }
+  | {
+      type: 'DISMISS';
+      source?: string;
+      target?: string;
+    }
+  | {
+      type: 'REMOVE';
+      source?: string;
+      target?: string;
+    };
+
+export const TrueSheetActions = {
+  ...StackActions,
+  resize(index: number): TrueSheetActionType {
+    return { type: 'RESIZE', index };
+  },
+  dismiss(): TrueSheetActionType {
+    return { type: 'DISMISS' };
+  },
+  remove(): TrueSheetActionType {
+    return { type: 'REMOVE' };
+  },
+};
+
+export function TrueSheetRouter(
+  routerOptions: StackRouterOptions
+): Router<TrueSheetNavigationState<ParamListBase>, TrueSheetActionType> {
+  const baseRouter = StackRouter(routerOptions) as unknown as Router<
+    TrueSheetNavigationState<ParamListBase>,
+    TrueSheetActionType
+  >;
+
+  return {
+    ...baseRouter,
+    type: 'true-sheet',
+
+    getInitialState(options) {
+      const state = baseRouter.getInitialState(options);
+
+      return {
+        ...state,
+        stale: false,
+        type: 'true-sheet',
+        key: `true-sheet-${nanoid()}`,
+      };
+    },
+
+    getStateForAction(state, action, options) {
+      switch (action.type) {
+        case 'RESIZE': {
+          const routeIndex =
+            action.target === state.key && action.source
+              ? state.routes.findIndex((r) => r.key === action.source)
+              : state.index;
+
+          return {
+            ...state,
+            routes: state.routes.map((route, i) =>
+              i === routeIndex
+                ? {
+                    ...route,
+                    resizeIndex: action.index,
+                    resizeKey: (route.resizeKey ?? 0) + 1,
+                  }
+                : route
+            ),
+          };
+        }
+
+        case 'GO_BACK':
+        case 'POP':
+        case 'DISMISS': {
+          // Only base screen remains - let parent navigator handle it
+          if (state.routes.length <= 1) {
+            return null;
+          }
+
+          // Find the route to dismiss
+          const routeIndex =
+            action.target === state.key && 'source' in action && action.source
+              ? state.routes.findIndex((r) => r.key === action.source)
+              : state.index;
+
+          // Base screen - let parent navigator handle it
+          if (routeIndex === 0) {
+            return null;
+          }
+
+          // Mark the route as closing instead of removing it
+          return {
+            ...state,
+            routes: state.routes.map((route, i) =>
+              i === routeIndex
+                ? {
+                    ...route,
+                    closing: true,
+                  }
+                : route
+            ),
+          };
+        }
+
+        case 'REMOVE': {
+          // Actually remove the closing route
+          const routeKey = action.source;
+          const routeIndex = routeKey
+            ? state.routes.findIndex((r) => r.key === routeKey)
+            : state.routes.findIndex((r) => r.closing);
+
+          if (routeIndex === -1) {
+            return state;
+          }
+
+          const routes = state.routes.filter((_, i) => i !== routeIndex);
+
+          return {
+            ...state,
+            index: Math.min(state.index, routes.length - 1),
+            routes,
+          };
+        }
+
+        default:
+          return baseRouter.getStateForAction(state, action, options);
+      }
+    },
+
+    getRehydratedState(partialState, { routeNames, routeParamList, routeGetIdList }) {
+      if (partialState.stale === false) {
+        return partialState;
+      }
+
+      const state = baseRouter.getRehydratedState(partialState, {
+        routeNames,
+        routeParamList,
+        routeGetIdList,
+      });
+
+      return {
+        ...state,
+        type: 'true-sheet',
+        key: `true-sheet-${nanoid()}`,
+      };
+    },
+
+    actionCreators: TrueSheetActions,
+  };
+}