Stack navigator
Screens push in from the side and pop back, like a native navigation stack.
Messages
Implementation
1"use client";2 3import { useLayoutEffect, useRef, useState } from "react";4import type { HTMLAttributes, ReactNode } from "react";5import { ViewTransitionSafe } from "./ViewTransitionSafe";6import { runViewTransition } from "@/lib/view-transition";7 8export type StackScreen = {9 id: string;10 /** Row and detail title. */11 title: string;12 /** Short line under the row title. */13 preview?: string;14 /** Small trailing value in the row, for example a time. */15 meta?: string;16 /** Monogram shown in the row avatar. */17 initials?: string;18 /** Detail screen content. */19 body: ReactNode;20 /** Optional pinned footer for the detail screen. */21 footer?: ReactNode;22};23 24export type StackNavigatorProps = Omit<25 HTMLAttributes<HTMLDivElement>,26 "children"27> & {28 /** One entry per screen; the row pushes into its detail. */