Class: Shadcn::CommandDialogComponent

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

Overview

Command Dialog component - command palette in a modal dialog Combines Dialog and Command components

Examples:

Basic command dialog

<%= render Shadcn::CommandDialogComponent.new do |dialog| %>
  <% dialog.with_trigger do %>
    <button>Open Command</button>
  <% end %>
  <% dialog.with_command do |command| %>
    <% command.with_input(placeholder: "Type a command...") %>
    <% command.with_list do |list| %>
      <% list.with_empty { "No results found." } %>
      <% list.with_group(heading: "Suggestions") do |group| %>
        <% group.with_item(value: "calendar") { "Calendar" } %>
      <% end %>
    <% end %>
  <% end %>
<% end %>

Constant Summary collapse

OVERLAY_CLASSES = 
"fixed inset-0 z-50 bg-black/80"
CONTENT_CLASSES = 
"fixed left-[50%] top-[50%] z-50 translate-x-[-50%] translate-y-[-50%] shadow-lg"
COMMAND_CLASSES = 
"[&_[data-shadcn--command-target='input']]:h-12"

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(shortcut: nil, **options) ⇒ CommandDialogComponent

Returns a new instance of CommandDialogComponent.

Parameters:

  • shortcut (String) (defaults to: nil) —

    Keyboard shortcut to open (e.g., "k" for Cmd+K)



39
40
41
42
 
# File 'app/components/shadcn/command_dialog_component.rb', line 39

def initialize(shortcut: nil, **options)
  super(**options)
  @shortcut = shortcut
end

Instance Method Details

#call ⇒ Object 



44
45
46
 
# File 'app/components/shadcn/command_dialog_component.rb', line 44

def call
  content_tag(:div, dialog_content, **dialog_attributes)
end