expo-dynamic-tray

A morphing, keyboard-aware bottom-sheet tray for React Native.

✨ Features

• 🫧 Morphing presentation — a single spring drives translateY, backdrop opacity, and sheet scale together, so the tray grows into place instead of just sliding
• 📐 Auto-sizing — the sheet springs to whatever its content measures; no fixed heights to maintain
• 🧭 Multi-view navigation with a real history stack — setView("…") pushes, goBack() unwinds however deep you went
• 🎞️ Crossfade + scale morph between views (incoming views scale/fade in, outgoing ones fade out) for a continuous, first-party feel
• ⌨️ Keyboard-following via react-native-keyboard-controller — the tray lifts itself above the keyboard and stays glued to it
• 👆 Swipe / flick to dismiss with both distance-threshold and velocity detection, plus a spring rubber-band return
• 🧩 Persistent footer slot — pass footer per view; it never unmounts while switching views, so buttons don't pop or collide
• 🪝 Imperative or declarative — open with `` or drive it from anywhere with useTray().open()
• 🧠 TypeScript-first, fully typed surface

---

⚙️ Installation

git clone https://github.com/rit3zh/expo-dynamic-tray
cd expo-dynamic-tray
bun start -c

Peer dependencies (already wired up in this template):

bun add react-native-reanimated react-native-gesture-handler react-native-safe-area-context react-native-keyboard-controller @expo/ui expo-symbols

---

🚀 Usage

Wrap your app once with GestureHandlerRootView and KeyboardProvider, then compose a `` anywhere in the tree.

// app/_layout.tsx
import { GestureHandlerRootView } from "react-native-gesture-handler";
import { KeyboardProvider } from "react-native-keyboard-controller";

export default function RootLayout() {
  return (
    
      
        
      
    
  );
}

The simplest possible tray — one trigger, one view:

import { Tray } from "@/components/tray";
import { Text, View } from "react-native";

export function Example() {
  return (
    
      
        Show Tray
      

      
        
          
            Dynamic Tray
            Springs to its content's size and follows the keyboard.
          
        
      
    
  );
}

Preview

https://github.com/user-attachments/assets/f4359500-fa88-464f-a4e9-894903401c1a

Opening imperati