Module: UI::KbdBehavior

Included in:
Kbd, KbdComponent
Defined in:
app/behaviors/ui/kbd_behavior.rb

Overview

UI::KbdBehavior

Instance Method Summary collapse

Instance Method Details

#kbd_classes ⇒ Object

Returns combined CSS classes for the kbd element



26
27
28
29
30
31
32
33
 
# File 'app/behaviors/ui/kbd_behavior.rb', line 26

def kbd_classes
  classes_value = respond_to?(:classes, true) ? classes : @classes
  base = "bg-muted text-muted-foreground pointer-events-none inline-flex h-5 w-fit min-w-5 items-center justify-center gap-1 rounded-sm px-1 font-sans text-xs font-medium select-none"
  svg_sizing = "[&_svg:not([class*='size-'])]:size-3"
  tooltip_styling = "[[data-slot=tooltip-content]_&]:bg-background/20 [[data-slot=tooltip-content]_&]:text-background dark:[[data-slot=tooltip-content]_&]:bg-background/10"

  TailwindMerge::Merger.new.merge([base, svg_sizing, tooltip_styling, classes_value].compact.join(" "))
end

#kbd_html_attributes ⇒ Object

Returns HTML attributes for the kbd element



17
18
19
20
21
22
23
 
# File 'app/behaviors/ui/kbd_behavior.rb', line 17

def kbd_html_attributes
  attributes_value = respond_to?(:attributes, true) ? attributes : @attributes
  {
    class: kbd_classes,
    "data-slot": "kbd"
  }.merge(attributes_value).compact
end