expo-router
Version:
Expo Router is a file-based router for React Native and web applications.
28 lines • 1.55 kB
JavaScript
;
'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