Sheet

      <%= render(RailsUi::Sheet::Component.new) do |sheet| %>
      <% sheet.with_trigger do %>
        <button data-action="ui-sheet#open" class="px-4 py-2 bg-primary text-primary-foreground rounded">Open Sheet</button>
      <% end %>
      
        <h3 class="text-lg font-semibold">Are you sure absolutely sure?</h3>
        <p class="mt-2 text-sm text-muted-foreground">This action cannot be undone. This will permanently delete your account and remove your data from our servers.</p>
        <div class="mt-5 flex justify-end space-x-2">
          <button data-action="ui-sheet#close" class="px-3 py-2 bg-secondary text-secondary-foreground rounded">Cancel</button>
          <button class="px-3 py-2 bg-primary text-primary-foreground rounded">Continue</button>
        </div>
     
    <% end %>

      <%= render(RailsUi::Sheet::Component.new(side: :left)) do |sheet| %>
      <% sheet.with_trigger do %>
        <button data-action="ui-sheet#open" class="px-4 py-2 bg-primary text-primary-foreground rounded">Open Left Sheet</button>
      <% end %>
     
        <h3 class="text-lg font-semibold">Left Side Sheet</h3>
        <p class="mt-2 text-sm text-muted-foreground">This is a sheet that slides in from the left side.</p>
      
    <% end %>

      <%= render(RailsUi::Sheet::Component.new(side: :top)) do |sheet| %>
      <% sheet.with_trigger do %>
        <button data-action="ui-sheet#open" class="px-4 py-2 bg-primary text-primary-foreground rounded">Open Top Sheet</button>
      <% end %>
     
        <h3 class="text-lg font-semibold">Top Sheet</h3>
        <p class="mt-2 text-sm text-muted-foreground">This is a sheet that slides in from the top.</p>
     
    <% end %>

      <%= render(RailsUi::Sheet::Component.new(side: :bottom)) do |sheet| %>
      <% sheet.with_trigger do %>
        <button data-action="ui-sheet#open" class="px-4 py-2 bg-primary text-primary-foreground rounded">Open Bottom Sheet</button>
      <% end %>
      
        <h3 class="text-lg font-semibold">Bottom Sheet</h3>
        <p class="mt-2 text-sm text-muted-foreground">This is a sheet that slides in from the bottom.</p>
     
    <% end %>

      <%= render(RailsUi::Sheet::Component.new(size: :lg)) do |sheet| %>
      <% sheet.with_trigger do %>
        <button data-action="ui-sheet#open" class="px-4 py-2 bg-primary text-primary-foreground rounded">Open Large Sheet</button>
      <% end %>
        <h3 class="text-lg font-semibold">Large Sheet</h3>
        <p class="mt-2 text-sm text-muted-foreground">This is a large sheet with more content space.</p>
      
    <% end %>