Bottom Sheet

1"use client";
2import * as React from "react";
3import { BottomSheet } from "@/components/ui/bottom-sheet";
4
5export function TripDetails() {
6  const [open, setOpen] = React.useState(false);
7  return (
8    <>
9      <button onClick={() => setOpen(true)}>Show trip details</button>
10      <BottomSheet
11        open={open}
12        onOpenChange={setOpen}
13        snapPoints={[0.25, 0.55, 0.9]}
14        defaultSnap={1}
15        title="Your ride to GetUrUI HQ"
16        description="Arriving in 4 min"
17      >
18        <p>Driver, stops and fare go here.</p>
19      </BottomSheet>
20    </>
21  );
22}