Class: Shadcn::Command::Component

Inherits:
ApplicationViewComponent show all
Defined in:
app/components/shadcn/command/component.rb

Overview

Port of registry/new-york-v4/ui/command.tsx, whose behaviour is cmdk — 1,091 lines of TSX plus a 162-line fuzzy scorer, over four Radix packages, vendored at vendor/cmdk/.

Every class is in the TSX, and unlike chart.tsx its selectors reach a DOM this port renders: [cmdk-item], [cmdk-group-heading], [cmdk-input-wrapper] are how shadcn spaces the palette out, so the parts carry those bare attributes and upstream's own rules apply. See features/command.md.

Constant Summary

Constants inherited from ApplicationViewComponent

ApplicationViewComponent::CONTENTS_STYLE, ApplicationViewComponent::VOID_TAGS

Instance Attribute Summary collapse

Attributes inherited from ApplicationViewComponent

#attributes

Instance Method Summary collapse

Methods inherited from ApplicationViewComponent

#css_classes, default_tag, #merged_style, #render_element, #shadcn_t, slot_name, #style_variants, #tag_name

Constructor Details

#initialize(label: nil, **attributes) ⇒ Component

label: names the listbox, as cmdk's own label prop does (vendor/cmdk/index.tsx:350): a list of options is a control, and a control with no name is one a screen reader reads as nothing.



30
31
32
33
# File 'app/components/shadcn/command/component.rb', line 30

def initialize(label: nil, **attributes)
  @label = label
  super(**attributes)
end

Instance Attribute Details

#labelObject (readonly)

Returns the value of attribute label.



25
26
27
# File 'app/components/shadcn/command/component.rb', line 25

def label
  @label
end

Instance Method Details

#callObject



49
50
51
# File 'app/components/shadcn/command/component.rb', line 49

def call
  render_element(body: safe_join([ hidden_label, command_input, command_list, content ].compact))
end

#element_attributes(**defaults) ⇒ Object



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

def element_attributes(**defaults)
  super(**{
    "cmdk-root" => "",
    "data-controller" => "shadcn--command"
  }.merge(defaults))
end

#idsObject

The three ids the ARIA wiring needs, decided once here and handed to the parts: an input points aria-controls at the list, and the list is named by a label that may not exist yet when the input renders.



38
39
40
# File 'app/components/shadcn/command/component.rb', line 38

def ids
  @ids ||= { input: generated(:input), list: generated(:list), label: generated(:label) }
end