Module: StimulusPlumbers::Themes::Tailwind::Combobox

Included in:

StimulusPlumbers::Themes::TailwindTheme

Defined in:

lib/stimulus_plumbers/themes/tailwind/combobox.rb

Constant Summary

CONTAINER =

── Container / popover ───────────────────────────────────────────────

%w[relative].freeze

POPOVER =

%w[absolute top-full left-0 min-w-full].freeze

TRIGGER =

── Trigger ───────────────────────────────────────────────────────────

%w[
  w-full rounded-(--sp-radius-md) border border-(--sp-color-muted-fg) hover:border-(--sp-color-fg)
  px-(--sp-space-3) py-(--sp-space-2)
  text-(length:--sp-text-sm) text-(--sp-color-fg) bg-(--sp-color-bg)
  focus:outline-none focus:ring-2 focus:ring-(--sp-focus-ring-color)
].freeze

TRIGGER_GROUP =

%w[
  flex items-center gap-(--sp-space-2) overflow-hidden
  rounded-(--sp-radius-md) border border-(--sp-color-muted-fg) hover:border-(--sp-color-fg) bg-(--sp-color-bg)
  px-(--sp-space-3) py-(--sp-space-2)
  focus-within:outline-none focus-within:ring-2 focus-within:ring-(--sp-focus-ring-color)
  [&>input]:border-0 [&>input]:rounded-none
  [&>input]:px-0 [&>input]:py-0
  [&>input]:bg-transparent [&>input]:shadow-none
  [&>input]:focus:ring-0
].freeze

LISTBOX =

── Listbox / options ─────────────────────────────────────────────────

%w[
  py-(--sp-space-1) overflow-y-auto max-h-60 min-h-(--sp-space-6)
].freeze

OPTION_BASE =

%w[
  flex items-center gap-(--sp-space-2) w-full
  px-(--sp-space-2) py-(--sp-space-1)
  rounded-(--sp-radius-sm) text-(length:--sp-text-sm)
  cursor-pointer select-none outline-none
  hover:bg-(--sp-color-muted) focus:bg-(--sp-color-muted)
].freeze

OPTION_SELECTED =

%w[
  bg-(--sp-color-primary)/10 text-(--sp-color-primary)
].freeze

OPTION_DISABLED =

%w[
  opacity-50 cursor-not-allowed pointer-events-none
].freeze

OPTION_GROUP =

%w[py-(--sp-space-1)].freeze

TYPEAHEAD_LOADING =

── Typeahead states ──────────────────────────────────────────────────

%w[
  flex items-center justify-center
  py-(--sp-space-2) text-(length:--sp-text-sm) text-(--sp-color-muted-fg)
].freeze

TYPEAHEAD_EMPTY =

%w[
  flex items-center justify-center
  py-(--sp-space-2) text-(length:--sp-text-sm) text-(--sp-color-muted-fg)
].freeze

TIME =

── Time picker ───────────────────────────────────────────────────────

%w[flex gap-(--sp-space-2) overflow-hidden].freeze

TIME_DRUM_UNIT =

%w[flex-1 min-w-0].freeze

TIME_DRUM_PERIOD =

%w[shrink-0].freeze

DATE_NAV =

── Date navigation ───────────────────────────────────────────────────

%w[flex items-center justify-between gap-(--sp-space-1) mb-(--sp-space-2)].freeze

DATE_NAV_BTN =

%w[].freeze

DATE_NAV_TITLE =

%w[flex-1 text-center].freeze