ZeeMeeDesign Exercise

Component

BottomSheet

Branded replacement for the iOS action sheet. Draggable handle, respects safe-area-bottom.

9:41

Towson Tigers

Tap a status to open the sheet.

The audit named the default iOS action sheet the single worst surface for the Admission Moment. This component keeps the bottom-sheet ergonomics and reframes the choice as a deliberate brand moment with full-size buttons.

Composition

<BottomSheet>
  <BottomSheetTrigger asChild>
    <Button>Open</Button>
  </BottomSheetTrigger>
  <BottomSheetContent>
    <BottomSheetHeader>
      <BottomSheetTitle>…</BottomSheetTitle>
      <BottomSheetDescription>…</BottomSheetDescription>
      <BottomSheetCloseButton />
    </BottomSheetHeader>
    {/* body */}
  </BottomSheetContent>
</BottomSheet>

Props (BottomSheetContent)

PropTypeDefaultDescription
showHandlebooleantrueShow the draggable handle at the top of the sheet.
...DialogContentPropsRadix Dialog.ContentAll Radix Dialog props (onOpenChange, modal, etc.) are forwarded.