- TRIGGER =
%w[
w-full rounded-(--sp-radius-md) border border-(--sp-color-muted-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) 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 =
%w[
py-(--sp-space-1) overflow-y-auto max-h-60
].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 =
%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 =
%w[flex gap-(--sp-space-2) overflow-hidden].freeze
- DATE_NAV =
%w[flex items-center justify-between gap-(--sp-space-1) mb-(--sp-space-2)].freeze
- DATE_NAV_BTN =
[
*Control::BASE,
"inline-flex items-center justify-center",
"size-(--sp-calendar-day-size) rounded-(--sp-radius-md)",
"text-(--sp-color-fg) hover:bg-(--sp-color-muted)",
"focus-visible:ring-(--sp-focus-ring-color)"
].freeze
- CONTAINER =
%w[relative].freeze
- POPOVER =
%w[absolute top-full left-0 min-w-full].freeze