Class: Shadcn::SheetComponent

Inherits:
BaseComponent
  • Object
show all
Defined in:
app/components/shadcn/sheet_component.rb

Overview

Sheet component for slide-out panels Matches shadcn/ui Sheet component Uses Stimulus for interactivity

Examples:

Basic sheet

<%= render Shadcn::SheetComponent.new(side: :right) do |sheet| %>
  <% sheet.with_trigger do %>
    <%= render Shadcn::ButtonComponent.new(variant: :outline) { "Open Sheet" } %>
  <% end %>
  <% sheet.with_content do |content| %>
    <% content.with_header do %>
      <% content.with_title { "Edit Profile" } %>
      <% content.with_description { "Make changes to your profile." } %>
    <% end %>
    <div class="py-4">
      Sheet body content
    </div>
    <% content.with_footer do %>
      <%= render Shadcn::ButtonComponent.new { "Save changes" } %>
    <% end %>
  <% end %>
<% end %>

Constant Summary collapse

SIDES =
{
  top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
  bottom: "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
  left: "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm",
  right: "inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm"
}.freeze

Instance Attribute Summary

Attributes inherited from BaseComponent

#class_name, #data, #html_options

Instance Method Summary collapse

Methods inherited from BaseComponent

#content

Methods included from Rails::Helpers::ClassNameHelper

#cn

Constructor Details

#initialize(side: :right, open: false, **options) ⇒ SheetComponent

Returns a new instance of SheetComponent.

Parameters:

  • side (Symbol) (defaults to: :right)

    Side to show sheet (:top, :right, :bottom, :left)

  • open (Boolean) (defaults to: false)

    Whether sheet starts open



42
43
44
45
46
# File 'app/components/shadcn/sheet_component.rb', line 42

def initialize(side: :right, open: false, **options)
  super(**options)
  @side = side.to_sym
  @open = open
end