True Sheet

Product page: what this module adds to ReadyNative

This gives you a native bottom sheet on iOS and Android through @lodev09/react-native-true-sheet: a panel that slides up with snap points, a grabber and swipe-to-dismiss, drawn by UIKit on iOS and by Material on Android. You open it from code with sheet.current?.present() and close it with dismiss(). The module adds one example, /examples/sheet: a button that opens a sheet with a short text and a Close button. The core tree never imports the library; only the example route and its screen do.

SetupCopy Anchor Link

bun run setup --sheet true-sheet

1. Make a dev build: npx expo run:ios (or npx expo run:android, or eas build --profile development). True Sheet is a native module, so Expo Go can't load it.
2. On iOS, build with Xcode 26.1 or newer, which the library requires.
3. Open /examples/sheet in the dev build and present the sheet.
4. Run bun run doctor - the dev build row for this module should be green.

The module installs @lodev09/react-native-true-sheet with npx expo install. The library has no config plugin, so nothing goes into app.config.ts.

UsageCopy Anchor Link

import { TrueSheet } from "@lodev09/react-native-true-sheet";
import { useRef } from "react";

import { Box, Button, Text } from "@/ui";

export function Demo() {
  const sheet = useRef<TrueSheet>(null);

  return (
    <>
      <Button onPress={() => void sheet.current?.present()}>Open</Button>
      <TrueSheet ref={sheet} detents={["auto", 1]} cornerRadius={24}>
        <Box gap={4} p={5}>
          <Text variant="heading">Details</Text>
          <Button variant="outline" onPress={() => void sheet.current?.dismiss()}>
            Close
          </Button>
        </Box>
      </TrueSheet>
    </>
  );
}

detents are the heights the sheet rests at, smallest first: "auto" fits the content, "peek" rests at the collapsed height of the header and footer, and a number from 0 to 1 is a fraction of the available height. present(index) opens it at a detent, resize(index) moves it to another one, and dismiss() closes it together with any sheet presented on top. cornerRadius sets the corner radius; leave it out for the system default.

GotchasCopy Anchor Link

• Dev build only. Expo Go can't load the native module, and the package throws at import when it is missing, so reach the sheet only in a dev build.
• At most three detents: collapsed, half-expanded and expanded. Sort them from smallest to largest, and put "auto" first when the content changes.
• "auto" needs iOS 16 or newer; on older iOS use fixed fractions.
• Jest: __mocks__/@lodev09/react-native-true-sheet.tsx stands in for the package in every test. It renders the children and records present, dismiss and resize as jest.fns, which the example's test reads with jest.requireMock. The library also ships its own mock at @lodev09/react-native-true-sheet/mock if you want that one instead.
• The example route is one of the examples that bun run clean removes; the library and the sheet you build stay, so you can open a sheet from any screen.

Remove itCopy Anchor Link

While modules/ exists (a tree set up with --keep-modules), setup does all of it:

bun run setup --sheet none --yes --keep-modules

In a finalized tree setup is a stub, so you undo it by hand. Here is everything this module added:

1. Delete the files that are still there (the demo screens are gone already unless you set up with --with-examples): __mocks__/@lodev09/react-native-true-sheet.tsx, src/app/examples/sheet.tsx, src/screens/examples/__tests__/sheet-example-screen.test.tsx, src/screens/examples/sheet-example-screen.tsx.
2. Uninstall the dependencies: bun remove @lodev09/react-native-true-sheet.
3. Check it: bun run typecheck and bun run lint point at anything that still imports the removed files; bun run gen:graph refreshes docs/ARCHITECTURE.md.

ReferenceCopy Anchor Link

Everything below is generated from modules/sheet/true-sheet/module.json - the same file bun run setup reads, so it is what actually lands in your repo.

InstallCopy Anchor Link

bun run setup --sheet true-sheet

Module id: sheet/true-sheet (the default for this category).

DependenciesCopy Anchor Link

Doctor checksCopy Anchor Link

• dev build toolchain (Xcode / Android SDK)

After setupCopy Anchor Link

1. Make a dev build with npx expo run:ios / npx expo run:android (or eas build --profile development). True Sheet is a native module with no config plugin: Expo Go cannot load it, and the package throws at import when the native module is missing.
2. The iOS build needs Xcode 26.1 or newer (True Sheet 4 prerequisite). Open /examples/sheet in the dev build to try it.

FilesCopy Anchor Link