<div>
  <.button phx-click={show_bottom_sheet("bottom-sheet-single-default")}>
    Open Bottom Sheet
  </.button>
  <.bottom_sheet id="bottom-sheet-single-default">
    <div class="flex items-center justify-center h-full bg-brand-subtle text-brand">Content</div>
  </.bottom_sheet>
</div>

<div>
  <.button phx-click={show_bottom_sheet("bottom-sheet-single-full-featured")}>
    Open Bottom Sheet
  </.button>
  <.bottom_sheet id="bottom-sheet-single-full-featured" has_handle>
    <:header>
      Header
      <.bottom_sheet_close />
    </:header>
    <div class="flex items-center justify-center h-full bg-brand-subtle text-brand">Content</div>
  </.bottom_sheet>
</div>