@granite-js/react-native 0.1.20 → 0.1.22

package/CHANGELOG.md

@@ -1,5 +1,32 @@
 # @granite-js/react-native
 
+## 0.1.22
+
+### Patch Changes
+
+- @granite-js/cli@0.1.22
+- @granite-js/image@0.1.22
+- @granite-js/jest@0.1.22
+- @granite-js/lottie@0.1.22
+- @granite-js/mpack@0.1.22
+- @granite-js/native@0.1.22
+- @granite-js/plugin-core@0.1.22
+- @granite-js/style-utils@0.1.22
+
+## 0.1.21
+
+### Patch Changes
+
+- 1a15a19: Add setIosSwipeGestureEnabled
+  - @granite-js/cli@0.1.21
+  - @granite-js/image@0.1.21
+  - @granite-js/jest@0.1.21
+  - @granite-js/lottie@0.1.21
+  - @granite-js/mpack@0.1.21
+  - @granite-js/native@0.1.21
+  - @granite-js/plugin-core@0.1.21
+  - @granite-js/style-utils@0.1.21
+
 ## 0.1.20
 
 ### Patch Changes

package/dist/app/AppRoot.d.ts

@@ -1 +1 @@
-export declare function AppRoot({ appName, context, container: Container, initialProps, initialScheme, router }: AppRootProps): import("react/jsx-runtime").JSX.Element;
+export declare function AppRoot({ appName, context, container: Container, initialProps, initialScheme, router, setIosSwipeGestureEnabled, }: AppRootProps): import("react/jsx-runtime").JSX.Element;

package/dist/app/Granite.d.ts

@@ -24,6 +24,13 @@ export interface GraniteProps {
      * The initial scheme of the app.
      */
     initialScheme?: string;
+    /**
+     * @description
+     * The function to set the iOS swipe gesture enabled.
+     */
+    setIosSwipeGestureEnabled?: ({ isEnabled }: {
+        isEnabled: boolean;
+    }) => void;
 }
 /**
  * @public
@@ -60,7 +67,7 @@ export interface GraniteProps {
  * ```
  */
 export declare const Granite: {
-    registerApp(AppContainer: ComponentType<PropsWithChildren<InitialProps>>, { appName, context, router, initialScheme }: GraniteProps): (initialProps: InitialProps) => JSX.Element;
+    registerApp(AppContainer: ComponentType<PropsWithChildren<InitialProps>>, { appName, context, router, initialScheme, setIosSwipeGestureEnabled }: GraniteProps): (initialProps: InitialProps) => JSX.Element;
     registerHostApp(AppContainer: ComponentType<PropsWithChildren<InitialProps>>, { appName }: Pick<GraniteProps, "appName">): (initialProps: InitialProps) => JSX.Element;
     readonly appName: string;
 };

package/dist/router/Router.d.ts

@@ -55,5 +55,5 @@ type NavigationContainerProps = Pick<ComponentProps<typeof NavigationContainer>,
  * }
  * ```
  */
-export declare function Router({ prefix, context, container: Container, initialProps, initialScheme, navigationContainerRef, defaultScreenOption, screenContainer, ...navigationContainerProps }: InternalRouterProps & RouterProps): ReactElement;
+export declare function Router({ prefix, context, container: Container, initialProps, initialScheme, navigationContainerRef, defaultScreenOption, screenContainer, setIosSwipeGestureEnabled, ...navigationContainerProps }: InternalRouterProps & RouterProps): ReactElement;
 export {};

package/dist/router/components/CanGoBackGuard.d.ts

@@ -1,6 +1,9 @@
 import { ReactNode } from 'react';
-export declare function CanGoBackGuard({ children, canGoBack, onBack, }: {
+export declare function CanGoBackGuard({ children, canGoBack, onBack, setIosSwipeGestureEnabled, }: {
     canGoBack: boolean;
     children: ReactNode;
     onBack?: () => void;
+    setIosSwipeGestureEnabled?: ({ isEnabled }: {
+        isEnabled: boolean;
+    }) => void;
 }): import("react/jsx-runtime").JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@granite-js/react-native",
-  "version": "0.1.20",
+  "version": "0.1.22",
   "description": "The Granite Framework",
   "bin": {
     "granite": "./bin/cli.js"
@@ -86,7 +86,7 @@
     "@babel/core": "^7.24.9",
     "@babel/preset-env": "^7.24.8",
     "@babel/preset-typescript": "^7.24.7",
-    "@granite-js/native": "0.1.20",
+    "@granite-js/native": "0.1.22",
     "@testing-library/dom": "^10.4.0",
     "@testing-library/react": "^16.1.0",
     "@types/babel__core": "^7",
@@ -112,13 +112,13 @@
     "react-native": "*"
   },
   "dependencies": {
-    "@granite-js/cli": "0.1.20",
-    "@granite-js/image": "0.1.20",
-    "@granite-js/jest": "0.1.20",
-    "@granite-js/lottie": "0.1.20",
-    "@granite-js/mpack": "0.1.20",
-    "@granite-js/plugin-core": "0.1.20",
-    "@granite-js/style-utils": "0.1.20",
+    "@granite-js/cli": "0.1.22",
+    "@granite-js/image": "0.1.22",
+    "@granite-js/jest": "0.1.22",
+    "@granite-js/lottie": "0.1.22",
+    "@granite-js/mpack": "0.1.22",
+    "@granite-js/plugin-core": "0.1.22",
+    "@granite-js/style-utils": "0.1.22",
     "es-toolkit": "^1.39.8",
     "react-native-url-polyfill": "1.3.0"
   }

package/src/app/AppRoot.tsx

@@ -15,9 +15,18 @@ interface AppRootProps extends GraniteProps {
   container: ComponentType<PropsWithChildren<InitialProps>>;
   initialProps: InitialProps;
   initialScheme: string;
+  setIosSwipeGestureEnabled?: ({ isEnabled }: { isEnabled: boolean }) => void;
 }
 
-export function AppRoot({ appName, context, container: Container, initialProps, initialScheme, router }: AppRootProps) {
+export function AppRoot({
+  appName,
+  context,
+  container: Container,
+  initialProps,
+  initialScheme,
+  router,
+  setIosSwipeGestureEnabled,
+}: AppRootProps) {
   const prefix = getSchemePrefix({
     appName,
     scheme: global.__granite.app.scheme,
@@ -35,6 +44,7 @@ export function AppRoot({ appName, context, container: Container, initialProps,
               initialScheme={initialScheme}
               container={Container}
               prefix={prefix}
+              setIosSwipeGestureEnabled={setIosSwipeGestureEnabled}
               {...router}
             />
           </BackEventProvider>

package/src/app/Granite.tsx

@@ -31,6 +31,12 @@ export interface GraniteProps {
    * The initial scheme of the app.
    */
   initialScheme?: string;
+
+  /**
+   * @description
+   * The function to set the iOS swipe gesture enabled.
+   */
+  setIosSwipeGestureEnabled?: ({ isEnabled }: { isEnabled: boolean }) => void;
 }
 
 const createApp = () => {
@@ -47,7 +53,7 @@ const createApp = () => {
   return {
     registerApp(
       AppContainer: ComponentType<PropsWithChildren<InitialProps>>,
-      { appName, context, router, initialScheme }: GraniteProps
+      { appName, context, router, initialScheme, setIosSwipeGestureEnabled }: GraniteProps
     ): (initialProps: InitialProps) => JSX.Element {
       if (appName === ENTRY_BUNDLE_NAME) {
         throw new Error(`Reserved app name 'shared' cannot be used`);
@@ -59,6 +65,7 @@ const createApp = () => {
             container={AppContainer}
             initialProps={initialProps}
             initialScheme={initialScheme ?? getSchemeUri()}
+            setIosSwipeGestureEnabled={setIosSwipeGestureEnabled}
             appName={appName}
             context={context}
             router={router}

package/src/router/Router.tsx

@@ -56,6 +56,7 @@ export interface InternalRouterProps {
   container: ComponentType<PropsWithChildren<InitialProps>>;
   initialProps: InitialProps;
   initialScheme: string;
+  setIosSwipeGestureEnabled?: ({ isEnabled }: { isEnabled: boolean }) => Promise<void> | void;
 }
 
 export type RouterProps = StackNavigatorProps & NavigationContainerProps;
@@ -129,6 +130,7 @@ export function Router({
   defaultScreenOption,
   screenContainer,
   // Public props (StackNavigator)
+  setIosSwipeGestureEnabled,
   ...navigationContainerProps
 }: InternalRouterProps & RouterProps): ReactElement {
   const initialRouteName = useInitialRouteName({ prefix, initialScheme });
@@ -163,7 +165,7 @@ export function Router({
 
   return (
     <NavigationContainer ref={ref} {...navigationContainerProps} linking={linkingOptions}>
-      <CanGoBackGuard canGoBack={canGoBack} onBack={onBack}>
+      <CanGoBackGuard canGoBack={canGoBack} onBack={onBack} setIosSwipeGestureEnabled={setIosSwipeGestureEnabled}>
         <Container {...initialProps}>
           <StackNavigator.Navigator initialRouteName={initialRouteName} screenOptions={screenOptions}>
             {Screens}

package/src/router/components/CanGoBackGuard.tsx

@@ -1,17 +1,34 @@
 import { ReactNode, useEffect } from 'react';
 import { BackHandler } from 'react-native';
+import { useIsInitialScreen } from '../hooks/useIsInitialScreen';
 
 export function CanGoBackGuard({
   children,
   canGoBack,
   onBack,
+  setIosSwipeGestureEnabled,
 }: {
   canGoBack: boolean;
   children: ReactNode;
   onBack?: () => void;
+  setIosSwipeGestureEnabled?: ({ isEnabled }: { isEnabled: boolean }) => void;
 }) {
+  const isInitialScreen = useIsInitialScreen();
+
   const shouldBlockGoingBack = !canGoBack;
 
+  useEffect(() => {
+    if (!isInitialScreen || !canGoBack) {
+      setIosSwipeGestureEnabled?.({ isEnabled: false });
+
+      return () => {
+        setIosSwipeGestureEnabled?.({ isEnabled: true });
+      };
+    }
+
+    return;
+  }, [canGoBack, isInitialScreen, setIosSwipeGestureEnabled]);
+
   useEffect(() => {
     if (shouldBlockGoingBack) {
       const subscription = BackHandler.addEventListener('hardwareBackPress', () => {