first commit

node_modules/expo-router/build/modal/web/ModalStack.d.ts

@@ -0,0 +1,25 @@
+import { ParamListBase } from '@react-navigation/native';
+import React from 'react';
+declare const RouterModal: React.ForwardRefExoticComponent<Omit<import("../..").PickPartial<any, "children">, "ref"> & React.RefAttributes<unknown>> & {
+    Screen: (props: import("../..").ScreenProps<object, Readonly<{
+        key: string;
+        index: number;
+        routeNames: string[];
+        history?: unknown[];
+        routes: import("@react-navigation/native").NavigationRoute<ParamListBase, string>[];
+        type: string;
+        stale: false;
+    }>, import("@react-navigation/native").EventMapBase>) => null;
+    Protected: typeof import("../../views/Protected").Protected;
+};
+declare const RouterModalScreen: (props: import("../..").ScreenProps<object, Readonly<{
+    key: string;
+    index: number;
+    routeNames: string[];
+    history?: unknown[];
+    routes: import("@react-navigation/native").NavigationRoute<ParamListBase, string>[];
+    type: string;
+    stale: false;
+}>, import("@react-navigation/native").EventMapBase>) => null;
+export { RouterModal, RouterModalScreen };
+//# sourceMappingURL=ModalStack.d.ts.map

node_modules/expo-router/build/modal/web/ModalStack.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalStack.d.ts","sourceRoot":"","sources":["../../../src/modal/web/ModalStack.tsx"],"names":[],"mappings":"AACA,OAAO,EAGL,aAAa,EASd,MAAM,0BAA0B,CAAC;AAMlC,OAAO,KAAiC,MAAM,OAAO,CAAC;AA8HtD,QAAA,MAAM,WAAW;;;;;;;;;;;CAAkD,CAAC;AACpE,QAAA,MAAM,iBAAiB;;;;;;;;6DAAqB,CAAC;AAE7C,OAAO,EAAE,WAAW,EAAE,iBAAiB,EAAE,CAAC"}

node_modules/expo-router/build/modal/web/ModalStack.js

@@ -0,0 +1,109 @@
+"use strict";
+'use client';
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RouterModalScreen = exports.RouterModal = void 0;
+const native_1 = require("@react-navigation/native");
+const native_stack_1 = require("@react-navigation/native-stack");
+const react_1 = __importStar(require("react"));
+const ModalStackRouteDrawer_1 = require("./ModalStackRouteDrawer");
+const TransparentModalStackRouteDrawer_1 = require("./TransparentModalStackRouteDrawer");
+const utils_1 = require("./utils");
+const withLayoutContext_1 = require("../../layouts/withLayoutContext");
+function ModalStackNavigator({ initialRouteName, children, screenOptions, }) {
+    const { state, navigation, descriptors, NavigationContent, describe } = (0, native_1.useNavigationBuilder)(native_1.StackRouter, {
+        children,
+        screenOptions,
+        initialRouteName,
+    });
+    (0, react_1.useEffect)(() => 
+    // @ts-expect-error: there may not be a tab navigator in parent
+    navigation?.addListener?.('tabPress', (e) => {
+        const isFocused = navigation.isFocused();
+        // Run the operation in the next frame so we're sure all listeners have been run
+        // This is necessary to know if preventDefault() has been called
+        requestAnimationFrame(() => {
+            if (state.index > 0 && isFocused && !e.defaultPrevented) {
+                // When user taps on already focused tab and we're inside the tab,
+                // reset the stack to replicate native behaviour
+                navigation.dispatch({
+                    ...native_1.StackActions.popToTop(),
+                    target: state.key,
+                });
+            }
+        });
+    }), [navigation, state.index, state.key]);
+    return (<NavigationContent>
+      <ModalStackView state={state} navigation={navigation} descriptors={descriptors} describe={describe}/>
+    </NavigationContent>);
+}
+const ModalStackView = ({ state, navigation, descriptors, describe }) => {
+    const isWeb = process.env.EXPO_OS === 'web';
+    const { colors } = (0, native_1.useTheme)();
+    const { preventedRoutes } = (0, native_1.usePreventRemoveContext)();
+    const { routes: filteredRoutes, index: nonModalIndex } = (0, utils_1.convertStackStateToNonModalState)(state, descriptors, isWeb);
+    const newStackState = {
+        ...state,
+        routes: filteredRoutes,
+        index: nonModalIndex,
+    };
+    const dismiss = (0, react_1.useCallback)(() => {
+        navigation.goBack();
+    }, [navigation]);
+    const overlayRoutes = react_1.default.useMemo(() => {
+        if (!isWeb)
+            return [];
+        const idx = (0, utils_1.findLastNonModalIndex)(state, descriptors);
+        return state.routes.slice(idx + 1);
+    }, [isWeb, state, descriptors]);
+    return (<div style={{ flex: 1, display: 'flex' }}>
+      <native_stack_1.NativeStackView state={newStackState} navigation={navigation} descriptors={descriptors} describe={describe}/>
+      {isWeb &&
+            overlayRoutes.map((route) => {
+                const isTransparentModal = (0, utils_1.isTransparentModalPresentation)(descriptors[route.key].options);
+                const isRemovePrevented = preventedRoutes[route.key]?.preventRemove;
+                const ModalComponent = isTransparentModal
+                    ? TransparentModalStackRouteDrawer_1.TransparentModalStackRouteDrawer
+                    : ModalStackRouteDrawer_1.ModalStackRouteDrawer;
+                return (<ModalComponent key={route.key} routeKey={route.key} options={descriptors[route.key].options} renderScreen={descriptors[route.key].render} onDismiss={dismiss} dismissible={isRemovePrevented ? false : undefined} themeColors={colors}/>);
+            })}
+    </div>);
+};
+const createModalStack = (0, native_1.createNavigatorFactory)(ModalStackNavigator);
+const RouterModal = (0, withLayoutContext_1.withLayoutContext)(createModalStack().Navigator);
+exports.RouterModal = RouterModal;
+const RouterModalScreen = RouterModal.Screen;
+exports.RouterModalScreen = RouterModalScreen;
+//# sourceMappingURL=ModalStack.js.map

node_modules/expo-router/build/modal/web/ModalStackRouteDrawer.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { ExtendedStackNavigationOptions } from '../../layouts/StackClient';
+declare function ModalStackRouteDrawer({ routeKey, options, dismissible, renderScreen, onDismiss, themeColors, }: {
+    routeKey: string;
+    options: ExtendedStackNavigationOptions;
+    renderScreen: () => React.ReactNode;
+    onDismiss: () => void;
+    themeColors: {
+        card: string;
+        background: string;
+    };
+    dismissible?: boolean;
+}): React.JSX.Element;
+export { ModalStackRouteDrawer };
+//# sourceMappingURL=ModalStackRouteDrawer.d.ts.map

node_modules/expo-router/build/modal/web/ModalStackRouteDrawer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalStackRouteDrawer.d.ts","sourceRoot":"","sources":["../../../src/modal/web/ModalStackRouteDrawer.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,EAAE,8BAA8B,EAAE,MAAM,2BAA2B,CAAC;AAE3E,iBAAS,qBAAqB,CAAC,EAC7B,QAAQ,EACR,OAAO,EACP,WAAW,EACX,YAAY,EACZ,SAAS,EACT,WAAW,GACZ,EAAE;IACD,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,8BAA8B,CAAC;IACxC,YAAY,EAAE,MAAM,KAAK,CAAC,SAAS,CAAC;IACpC,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,WAAW,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,MAAM,CAAA;KAAE,CAAC;IAClD,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,qBAsMA;AAED,OAAO,EAAE,qBAAqB,EAAE,CAAC"}

node_modules/expo-router/build/modal/web/ModalStackRouteDrawer.js

@@ -0,0 +1,162 @@
+"use strict";
+'use client';
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ModalStackRouteDrawer = ModalStackRouteDrawer;
+const react_1 = __importDefault(require("react"));
+const vaul_1 = require("vaul");
+const modalStyles_1 = __importDefault(require("./modalStyles"));
+const utils_1 = require("./utils");
+function ModalStackRouteDrawer({ routeKey, options, dismissible, renderScreen, onDismiss, themeColors, }) {
+    const [open, setOpen] = react_1.default.useState(true);
+    // Determine sheet vs. modal with an SSR-safe hook. The first render (during
+    // hydration) always assumes mobile/sheet to match the server markup; an
+    // effect then updates the state after mount if the viewport is desktop.
+    const isDesktop = (0, utils_1.useIsDesktop)();
+    const isSheet = !isDesktop;
+    // Resolve snap points logic.
+    const allowed = options.sheetAllowedDetents;
+    const isArrayDetents = Array.isArray(allowed);
+    const useCustomSnapPoints = isArrayDetents && !(allowed.length === 1 && allowed[0] === 1);
+    let snapPoints = useCustomSnapPoints
+        ? allowed
+        : undefined;
+    if (!isSheet) {
+        snapPoints = [1];
+    }
+    const [snap, setSnap] = react_1.default.useState(useCustomSnapPoints && isArrayDetents ? allowed[0] : 1);
+    // Update the snap value when custom snap points change.
+    react_1.default.useEffect(() => {
+        if (isSheet) {
+            const next = useCustomSnapPoints && isArrayDetents ? allowed[0] : 1;
+            setSnap(next);
+        }
+        else {
+            // Desktop modal always fixed snap at 1
+            setSnap(1);
+        }
+    }, [isSheet, useCustomSnapPoints, isArrayDetents, allowed]);
+    // Map react-native-screens ios sheet undimmed logic to Vaul's fadeFromIndex
+    const fadeFromIndex = isSheet
+        ? options.sheetLargestUndimmedDetentIndex === 'last'
+            ? (snapPoints?.length ?? 0)
+            : typeof options.sheetLargestUndimmedDetentIndex === 'number'
+                ? options.sheetLargestUndimmedDetentIndex + 1
+                : 0
+        : 0;
+    // --- Styling -----------------------------------------------------------
+    // Using CSS variables so defaults live in CSS and can be overridden via props.
+    const modalStyleVars = {
+        backgroundColor: themeColors.background,
+    };
+    if (!isSheet) {
+        if (options.webModalStyle?.width) {
+            modalStyleVars['--expo-router-modal-width'] =
+                typeof options.webModalStyle.width === 'number'
+                    ? `${options.webModalStyle.width}px`
+                    : options.webModalStyle.width;
+            modalStyleVars['--expo-router-modal-max-width'] =
+                typeof options.webModalStyle.width === 'number'
+                    ? `${options.webModalStyle.width}px`
+                    : options.webModalStyle.width;
+            // Also set explicit width so browsers that ignore CSS vars in `width` prop still work.
+            modalStyleVars.width =
+                typeof options.webModalStyle.width === 'number'
+                    ? `${options.webModalStyle.width}px`
+                    : options.webModalStyle.width;
+        }
+        // Min width override
+        if (options.webModalStyle?.minWidth) {
+            const mw = typeof options.webModalStyle.minWidth === 'number'
+                ? `${options.webModalStyle.minWidth}px`
+                : options.webModalStyle.minWidth;
+            modalStyleVars['--expo-router-modal-min-width'] = mw;
+            modalStyleVars.minWidth = mw;
+        }
+        if (options.webModalStyle?.height) {
+            const h = typeof options.webModalStyle.height === 'number'
+                ? `${options.webModalStyle.height}px`
+                : options.webModalStyle.height;
+            modalStyleVars['--expo-router-modal-height'] = h;
+            modalStyleVars.maxHeight = h;
+            modalStyleVars.height = h;
+            modalStyleVars.minHeight = h;
+        }
+        // Separate min-height override (takes precedence over modalHeight)
+        if (options.webModalStyle?.minHeight) {
+            const mh = typeof options.webModalStyle.minHeight === 'number'
+                ? `${options.webModalStyle.minHeight}px`
+                : options.webModalStyle.minHeight;
+            modalStyleVars['--expo-router-modal-min-height'] = mh;
+            modalStyleVars.minHeight = mh;
+        }
+    }
+    const fitToContents = options.sheetAllowedDetents === 'fitToContents';
+    if (fitToContents) {
+        modalStyleVars.height = 'auto';
+        modalStyleVars.minHeight = 'auto';
+        // TODO:(@Hirbod) Clarify if we should limit maxHeight to sheets only
+        // Allow sheet to grow with content but never exceed viewport height
+        // dvh is important, otherwise it will scale over the visible viewport height
+        modalStyleVars.maxHeight = '100dvh';
+    }
+    // Apply corner radius (default 24px for iOS 26)
+    const radiusValue = options.sheetCornerRadius ?? 24;
+    const radiusCss = typeof radiusValue === 'number' ? `${radiusValue}px` : radiusValue;
+    if (options.webModalStyle?.border) {
+        modalStyleVars['--expo-router-modal-border'] = options.webModalStyle.border;
+    }
+    if (options.webModalStyle?.shadow) {
+        modalStyleVars['--expo-router-modal-shadow'] = options.webModalStyle.shadow;
+    }
+    if (isSheet) {
+        // Only top corners for mobile sheet
+        modalStyleVars.borderTopLeftRadius = radiusCss;
+        modalStyleVars.borderTopRightRadius = radiusCss;
+        // Always set CSS var to ensure consistency with default iOS 26 radius
+        modalStyleVars['--expo-router-modal-border-radius'] = radiusCss;
+    }
+    else {
+        // All corners for desktop modal - always set CSS var for iOS 26 default
+        modalStyleVars['--expo-router-modal-border-radius'] = radiusCss;
+    }
+    // --- End Styling -----------------------------------------------------------
+    const handleOpenChange = (open) => {
+        if (!open)
+            onDismiss();
+    };
+    // Props that only make sense for sheets
+    const sheetProps = isSheet
+        ? {
+            snapPoints: snapPoints,
+            activeSnapPoint: snap,
+            setActiveSnapPoint: setSnap,
+            fadeFromIndex,
+        }
+        : {};
+    return (<vaul_1.Drawer.Root key={`${routeKey}-${isSheet ? 'sheet' : 'modal'}`} open={open} dismissible={dismissible ?? options.gestureEnabled ?? true} onAnimationEnd={handleOpenChange} shouldScaleBackground autoFocus onOpenChange={setOpen} {...sheetProps}>
+      <vaul_1.Drawer.Portal>
+        <vaul_1.Drawer.Overlay className={modalStyles_1.default.overlay} style={options.webModalStyle?.overlayBackground
+            ? {
+                '--expo-router-modal-overlay-background': options.webModalStyle.overlayBackground,
+            }
+            : undefined}/>
+        <vaul_1.Drawer.Content aria-describedby="modal-description" className={modalStyles_1.default.drawerContent} style={{
+            pointerEvents: 'none',
+            // This needs to be limited to sheets, otherwise it will position the modal at the bottom of the screen
+            ...(isSheet && fitToContents ? { height: 'auto' } : null),
+        }}>
+          <div className={modalStyles_1.default.modal} data-presentation={isSheet ? 'formSheet' : 'modal'} style={modalStyleVars}>
+            {/* TODO:(@Hirbod) Figure out how to add title and description to the modal for screen readers in a meaningful way */}
+            <vaul_1.Drawer.Title about="" aria-describedby="" className={modalStyles_1.default.srOnly}/>
+            <vaul_1.Drawer.Description about="" className={modalStyles_1.default.srOnly}/>
+            {/* Render the screen content */}
+            <div className={modalStyles_1.default.modalBody}>{renderScreen()}</div>
+          </div>
+        </vaul_1.Drawer.Content>
+      </vaul_1.Drawer.Portal>
+    </vaul_1.Drawer.Root>);
+}
+//# sourceMappingURL=ModalStackRouteDrawer.js.map

node_modules/expo-router/build/modal/web/TransparentModalStackRouteDrawer.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { ExtendedStackNavigationOptions } from '../../layouts/StackClient';
+declare function TransparentModalStackRouteDrawer({ routeKey, options, dismissible, renderScreen, onDismiss, }: {
+    routeKey: string;
+    options: ExtendedStackNavigationOptions;
+    renderScreen: () => React.ReactNode;
+    onDismiss: () => void;
+    dismissible?: boolean;
+}): React.JSX.Element;
+export { TransparentModalStackRouteDrawer };
+//# sourceMappingURL=TransparentModalStackRouteDrawer.d.ts.map

node_modules/expo-router/build/modal/web/TransparentModalStackRouteDrawer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TransparentModalStackRouteDrawer.d.ts","sourceRoot":"","sources":["../../../src/modal/web/TransparentModalStackRouteDrawer.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,8BAA8B,EAAE,MAAM,2BAA2B,CAAC;AAE3E,iBAAS,gCAAgC,CAAC,EACxC,QAAQ,EACR,OAAO,EACP,WAAW,EACX,YAAY,EACZ,SAAS,GACV,EAAE;IACD,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,8BAA8B,CAAC;IACxC,YAAY,EAAE,MAAM,KAAK,CAAC,SAAS,CAAC;IACpC,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,qBAuBA;AAED,OAAO,EAAE,gCAAgC,EAAE,CAAC"}

node_modules/expo-router/build/modal/web/TransparentModalStackRouteDrawer.js

@@ -0,0 +1,28 @@
+"use strict";
+'use client';
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TransparentModalStackRouteDrawer = TransparentModalStackRouteDrawer;
+const react_1 = __importDefault(require("react"));
+const vaul_1 = require("vaul");
+const modalStyles_1 = __importDefault(require("./modalStyles"));
+function TransparentModalStackRouteDrawer({ routeKey, options, dismissible, renderScreen, onDismiss, }) {
+    const handleOpenChange = (open) => {
+        if (!open)
+            onDismiss();
+    };
+    return (<vaul_1.Drawer.Root defaultOpen autoFocus key={`${routeKey}-transparent`} dismissible={dismissible ?? options.gestureEnabled ?? false} onAnimationEnd={handleOpenChange}>
+      <vaul_1.Drawer.Portal>
+        <vaul_1.Drawer.Content className={modalStyles_1.default.transparentDrawerContent}>
+          {/* TODO:(@Hirbod) Figure out how to add title and description to the modal for screen readers in a meaningful way */}
+          <vaul_1.Drawer.Title about="" aria-describedby="" className={modalStyles_1.default.srOnly}/>
+          <vaul_1.Drawer.Description about="" className={modalStyles_1.default.srOnly}/>
+          {/* Render the screen content */}
+          <div className={modalStyles_1.default.modalBody}>{renderScreen()}</div>
+        </vaul_1.Drawer.Content>
+      </vaul_1.Drawer.Portal>
+    </vaul_1.Drawer.Root>);
+}
+//# sourceMappingURL=TransparentModalStackRouteDrawer.js.map

node_modules/expo-router/build/modal/web/TransparentModalStackRouteDrawer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TransparentModalStackRouteDrawer.js","sourceRoot":"","sources":["../../../src/modal/web/TransparentModalStackRouteDrawer.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAC;;;;;AA4CJ,4EAAgC;AA3CzC,kDAA0B;AAC1B,+BAA8B;AAE9B,gEAAwC;AAGxC,SAAS,gCAAgC,CAAC,EACxC,QAAQ,EACR,OAAO,EACP,WAAW,EACX,YAAY,EACZ,SAAS,GAOV;IACC,MAAM,gBAAgB,GAAG,CAAC,IAAa,EAAE,EAAE;QACzC,IAAI,CAAC,IAAI;YAAE,SAAS,EAAE,CAAC;IACzB,CAAC,CAAC;IAEF,OAAO,CACL,CAAC,aAAM,CAAC,IAAI,CACV,WAAW,CACX,SAAS,CACT,GAAG,CAAC,CAAC,GAAG,QAAQ,cAAc,CAAC,CAC/B,WAAW,CAAC,CAAC,WAAW,IAAI,OAAO,CAAC,cAAc,IAAI,KAAK,CAAC,CAC5D,cAAc,CAAC,CAAC,gBAAgB,CAAC,CACjC;MAAA,CAAC,aAAM,CAAC,MAAM,CACZ;QAAA,CAAC,aAAM,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,qBAAW,CAAC,wBAAwB,CAAC,CAC9D;UAAA,CAAC,oHAAoH,CACrH;UAAA,CAAC,aAAM,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,qBAAW,CAAC,MAAM,CAAC,EACzE;UAAA,CAAC,aAAM,CAAC,WAAW,CAAC,KAAK,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,qBAAW,CAAC,MAAM,CAAC,EAC3D;UAAA,CAAC,+BAA+B,CAChC;UAAA,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,qBAAW,CAAC,SAAS,CAAC,CAAC,CAAC,YAAY,EAAE,CAAC,EAAE,GAAG,CAC9D;QAAA,EAAE,aAAM,CAAC,OAAO,CAClB;MAAA,EAAE,aAAM,CAAC,MAAM,CACjB;IAAA,EAAE,aAAM,CAAC,IAAI,CAAC,CACf,CAAC;AACJ,CAAC","sourcesContent":["'use client';\nimport React from 'react';\nimport { Drawer } from 'vaul';\n\nimport modalStyles from './modalStyles';\nimport { ExtendedStackNavigationOptions } from '../../layouts/StackClient';\n\nfunction TransparentModalStackRouteDrawer({\n  routeKey,\n  options,\n  dismissible,\n  renderScreen,\n  onDismiss,\n}: {\n  routeKey: string;\n  options: ExtendedStackNavigationOptions;\n  renderScreen: () => React.ReactNode;\n  onDismiss: () => void;\n  dismissible?: boolean;\n}) {\n  const handleOpenChange = (open: boolean) => {\n    if (!open) onDismiss();\n  };\n\n  return (\n    <Drawer.Root\n      defaultOpen\n      autoFocus\n      key={`${routeKey}-transparent`}\n      dismissible={dismissible ?? options.gestureEnabled ?? false}\n      onAnimationEnd={handleOpenChange}>\n      <Drawer.Portal>\n        <Drawer.Content className={modalStyles.transparentDrawerContent}>\n          {/* TODO:(@Hirbod) Figure out how to add title and description to the modal for screen readers in a meaningful way */}\n          <Drawer.Title about=\"\" aria-describedby=\"\" className={modalStyles.srOnly} />\n          <Drawer.Description about=\"\" className={modalStyles.srOnly} />\n          {/* Render the screen content */}\n          <div className={modalStyles.modalBody}>{renderScreen()}</div>\n        </Drawer.Content>\n      </Drawer.Portal>\n    </Drawer.Root>\n  );\n}\n\nexport { TransparentModalStackRouteDrawer };\n"]}

node_modules/expo-router/build/modal/web/modalStyles.d.ts

@@ -0,0 +1,3 @@
+import styles from '../../../assets/modal.module.css';
+export default styles;
+//# sourceMappingURL=modalStyles.d.ts.map

node_modules/expo-router/build/modal/web/modalStyles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"modalStyles.d.ts","sourceRoot":"","sources":["../../../src/modal/web/modalStyles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,kCAAkC,CAAC;AAEtD,eAAe,MAAM,CAAC"}

node_modules/expo-router/build/modal/web/modalStyles.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const modal_module_css_1 = __importDefault(require("../../../assets/modal.module.css"));
+exports.default = modal_module_css_1.default;
+//# sourceMappingURL=modalStyles.js.map

node_modules/expo-router/build/modal/web/modalStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"modalStyles.js","sourceRoot":"","sources":["../../../src/modal/web/modalStyles.ts"],"names":[],"mappings":";;;;;AAAA,wFAAsD;AAEtD,kBAAe,0BAAM,CAAC","sourcesContent":["import styles from '../../../assets/modal.module.css';\n\nexport default styles;\n"]}

node_modules/expo-router/build/modal/web/types.d.ts

@@ -0,0 +1,14 @@
+import { ParamListBase, StackActionHelpers, StackNavigationState, StackRouterOptions, useNavigationBuilder } from '@react-navigation/native';
+import { NativeStackNavigationEventMap, NativeStackNavigationOptions } from '@react-navigation/native-stack';
+import { ExtendedStackNavigationOptions } from '../../layouts/StackClient';
+export type ModalStackNavigatorProps = {
+    initialRouteName?: string;
+    screenOptions?: ExtendedStackNavigationOptions;
+    children: React.ReactNode;
+};
+export type ModalStackViewProps = Omit<ReturnType<typeof useNavigationBuilder<StackNavigationState<ParamListBase>, StackRouterOptions, StackActionHelpers<ParamListBase>, NativeStackNavigationOptions, NativeStackNavigationEventMap>>, 'NavigationContent'>;
+export type CSSWithVars = React.CSSProperties & {
+    [key: `--${string}`]: string | number;
+};
+export type PresentationOptions = Partial<Pick<ExtendedStackNavigationOptions, 'presentation'>>;
+//# sourceMappingURL=types.d.ts.map

node_modules/expo-router/build/modal/web/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/modal/web/types.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,aAAa,EACb,kBAAkB,EAClB,oBAAoB,EACpB,kBAAkB,EAClB,oBAAoB,EACrB,MAAM,0BAA0B,CAAC;AAClC,OAAO,EACL,6BAA6B,EAC7B,4BAA4B,EAC7B,MAAM,gCAAgC,CAAC;AAExC,OAAO,EAAE,8BAA8B,EAAE,MAAM,2BAA2B,CAAC;AAE3E,MAAM,MAAM,wBAAwB,GAAG;IACrC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,aAAa,CAAC,EAAE,8BAA8B,CAAC;IAC/C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,IAAI,CACpC,UAAU,CACR,OAAO,oBAAoB,CACzB,oBAAoB,CAAC,aAAa,CAAC,EACnC,kBAAkB,EAClB,kBAAkB,CAAC,aAAa,CAAC,EACjC,4BAA4B,EAC5B,6BAA6B,CAC9B,CACF,EACD,mBAAmB,CACpB,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG,KAAK,CAAC,aAAa,GAAG;IAC9C,CAAC,GAAG,EAAE,KAAK,MAAM,EAAE,GAAG,MAAM,GAAG,MAAM,CAAC;CACvC,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,OAAO,CAAC,IAAI,CAAC,8BAA8B,EAAE,cAAc,CAAC,CAAC,CAAC"}

node_modules/expo-router/build/modal/web/types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=types.js.map

node_modules/expo-router/build/modal/web/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/modal/web/types.ts"],"names":[],"mappings":"","sourcesContent":["import {\n  ParamListBase,\n  StackActionHelpers,\n  StackNavigationState,\n  StackRouterOptions,\n  useNavigationBuilder,\n} from '@react-navigation/native';\nimport {\n  NativeStackNavigationEventMap,\n  NativeStackNavigationOptions,\n} from '@react-navigation/native-stack';\n\nimport { ExtendedStackNavigationOptions } from '../../layouts/StackClient';\n\nexport type ModalStackNavigatorProps = {\n  initialRouteName?: string;\n  screenOptions?: ExtendedStackNavigationOptions;\n  children: React.ReactNode;\n};\n\nexport type ModalStackViewProps = Omit<\n  ReturnType<\n    typeof useNavigationBuilder<\n      StackNavigationState<ParamListBase>,\n      StackRouterOptions,\n      StackActionHelpers<ParamListBase>,\n      NativeStackNavigationOptions,\n      NativeStackNavigationEventMap\n    >\n  >,\n  'NavigationContent'\n>;\n\nexport type CSSWithVars = React.CSSProperties & {\n  [key: `--${string}`]: string | number;\n};\n\nexport type PresentationOptions = Partial<Pick<ExtendedStackNavigationOptions, 'presentation'>>;\n"]}

node_modules/expo-router/build/modal/web/utils.d.ts

@@ -0,0 +1,61 @@
+import { ParamListBase, StackNavigationState } from '@react-navigation/native';
+import { ExtendedStackNavigationOptions } from '../../layouts/StackClient';
+/**
+ * A minimal subset of `ExtendedStackNavigationOptions` needed for the helper
+ * @internal
+ */
+export type PresentationOptions = Partial<Pick<ExtendedStackNavigationOptions, 'presentation'>>;
+/**
+ * Helper to determine if a given screen should be treated as a transparent modal-type presentation
+ *
+ * @param options - The navigation options.
+ * @returns Whether the screen should be treated as a transparent modal-type presentation.
+ *
+ * @internal
+ */
+export declare function isTransparentModalPresentation(options?: PresentationOptions | null): boolean;
+/**
+ * SSR-safe viewport detection: initial render always returns `false` so that
+ * server and client markup match. The actual media query evaluation happens
+ * after mount.
+ *
+ * @internal
+ */
+export declare function useIsDesktop(breakpoint?: number): boolean;
+/**
+ * Returns a copy of the given Stack navigation state with any modal-type routes removed
+ * (only when running on the web) and a recalculated `index` that still points at the
+ * currently active non-modal route. If the active route *is* a modal that gets
+ * filtered out, we fall back to the last remaining route – this matches the logic
+ * used inside `ModalStackView` so that the underlying `NativeStackView` never tries
+ * to render a modal screen that is simultaneously being shown in the overlay.
+ *
+ * This helper is exported primarily for unit-testing; it should be considered
+ * internal to `ModalStack.web` and not a public API.
+ *
+ * @param state - The navigation state.
+ * @param descriptors - The navigation descriptors.
+ * @param isWeb - Whether the current platform is web.
+ * @returns The navigation state with any modal-type routes removed.
+ *
+ * @internal
+ */
+export declare function convertStackStateToNonModalState(state: StackNavigationState<ParamListBase>, descriptors: Record<string, {
+    options: ExtendedStackNavigationOptions;
+}>, isWeb: boolean): {
+    routes: import("@react-navigation/native").NavigationRoute<ParamListBase, string>[];
+    index: number;
+};
+/**
+ * Returns the index of the last route in the stack that is *not* a modal.
+ *
+ * @param state - The navigation state.
+ * @param descriptors - The navigation descriptors.
+ * @returns The index of the last non-modal route.
+ *
+ * @internal
+ */
+export declare function findLastNonModalIndex(state: StackNavigationState<ParamListBase>, descriptors: Record<string, {
+    options: ExtendedStackNavigationOptions;
+}>): number;
+//# sourceMappingURL=utils.d.ts.map

node_modules/expo-router/build/modal/web/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/modal/web/utils.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,oBAAoB,EAAE,MAAM,0BAA0B,CAAC;AAG/E,OAAO,EAAE,8BAA8B,EAAE,MAAM,2BAA2B,CAAC;AAG3E;;;GAGG;AACH,MAAM,MAAM,mBAAmB,GAAG,OAAO,CAAC,IAAI,CAAC,8BAA8B,EAAE,cAAc,CAAC,CAAC,CAAC;AAEhG;;;;;;;GAOG;AACH,wBAAgB,8BAA8B,CAAC,OAAO,CAAC,EAAE,mBAAmB,GAAG,IAAI,WAGlF;AAED;;;;;;GAMG;AACH,wBAAgB,YAAY,CAAC,UAAU,GAAE,MAAY,WAoBpD;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,gCAAgC,CAC9C,KAAK,EAAE,oBAAoB,CAAC,aAAa,CAAC,EAC1C,WAAW,EAAE,MAAM,CAAC,MAAM,EAAE;IAAE,OAAO,EAAE,8BAA8B,CAAA;CAAE,CAAC,EACxE,KAAK,EAAE,OAAO;;;EAmBf;AAED;;;;;;;;GAQG;AACH,wBAAgB,qBAAqB,CACnC,KAAK,EAAE,oBAAoB,CAAC,aAAa,CAAC,EAC1C,WAAW,EAAE,MAAM,CAAC,MAAM,EAAE;IAAE,OAAO,EAAE,8BAA8B,CAAA;CAAE,CAAC,UASzE"}

node_modules/expo-router/build/modal/web/utils.js

@@ -0,0 +1,100 @@
+"use strict";
+'use client';
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isTransparentModalPresentation = isTransparentModalPresentation;
+exports.useIsDesktop = useIsDesktop;
+exports.convertStackStateToNonModalState = convertStackStateToNonModalState;
+exports.findLastNonModalIndex = findLastNonModalIndex;
+const react_1 = __importDefault(require("react"));
+const stackPresentation_1 = require("../../utils/stackPresentation");
+/**
+ * Helper to determine if a given screen should be treated as a transparent modal-type presentation
+ *
+ * @param options - The navigation options.
+ * @returns Whether the screen should be treated as a transparent modal-type presentation.
+ *
+ * @internal
+ */
+function isTransparentModalPresentation(options) {
+    const presentation = options?.presentation;
+    return presentation === 'transparentModal' || presentation === 'containedTransparentModal';
+}
+/**
+ * SSR-safe viewport detection: initial render always returns `false` so that
+ * server and client markup match. The actual media query evaluation happens
+ * after mount.
+ *
+ * @internal
+ */
+function useIsDesktop(breakpoint = 768) {
+    const isWeb = process.env.EXPO_OS === 'web';
+    // Ensure server-side and initial client render agree (mobile first).
+    const [isDesktop, setIsDesktop] = react_1.default.useState(false);
+    react_1.default.useEffect(() => {
+        if (!isWeb || typeof window === 'undefined')
+            return;
+        const mql = window.matchMedia(`(min-width: ${breakpoint}px)`);
+        const listener = (e) => setIsDesktop(e.matches);
+        // Update immediately after mount
+        setIsDesktop(mql.matches);
+        mql.addEventListener('change', listener);
+        return () => mql.removeEventListener('change', listener);
+    }, [breakpoint, isWeb]);
+    return isDesktop;
+}
+/**
+ * Returns a copy of the given Stack navigation state with any modal-type routes removed
+ * (only when running on the web) and a recalculated `index` that still points at the
+ * currently active non-modal route. If the active route *is* a modal that gets
+ * filtered out, we fall back to the last remaining route – this matches the logic
+ * used inside `ModalStackView` so that the underlying `NativeStackView` never tries
+ * to render a modal screen that is simultaneously being shown in the overlay.
+ *
+ * This helper is exported primarily for unit-testing; it should be considered
+ * internal to `ModalStack.web` and not a public API.
+ *
+ * @param state - The navigation state.
+ * @param descriptors - The navigation descriptors.
+ * @param isWeb - Whether the current platform is web.
+ * @returns The navigation state with any modal-type routes removed.
+ *
+ * @internal
+ */
+function convertStackStateToNonModalState(state, descriptors, isWeb) {
+    if (!isWeb) {
+        return { routes: state.routes, index: state.index };
+    }
+    // Remove every modal-type route from the stack on web.
+    const routes = state.routes.filter((route) => {
+        return !(0, stackPresentation_1.isModalPresentation)(descriptors[route.key].options);
+    });
+    // Recalculate the active index so it still points at the same non-modal route, or –
+    // if that route was filtered out – at the last remaining route.
+    let index = routes.findIndex((r) => r.key === state.routes[state.index]?.key);
+    if (index < 0) {
+        index = routes.length > 0 ? routes.length - 1 : 0;
+    }
+    return { routes, index };
+}
+/**
+ * Returns the index of the last route in the stack that is *not* a modal.
+ *
+ * @param state - The navigation state.
+ * @param descriptors - The navigation descriptors.
+ * @returns The index of the last non-modal route.
+ *
+ * @internal
+ */
+function findLastNonModalIndex(state, descriptors) {
+    // Iterate backwards through the stack to find the last non-modal route.
+    for (let i = state.routes.length - 1; i >= 0; i--) {
+        if (!(0, stackPresentation_1.isModalPresentation)(descriptors[state.routes[i].key].options)) {
+            return i;
+        }
+    }
+    return -1;
+}
+//# sourceMappingURL=utils.js.map