Skip to content

RangeCalendarCellTrigger

Source: client/lib/theme/vueda-tailwind/controls/index.js

The pressable day button inside a RangeCalendarCell.root. See also: CalendarCellTrigger.root; delta is that the single data-selected state is replaced by paired data-selection-start / data-selection-end states that paint --primary only at the two endpoints, leaving the middle of the range to read through the --accent fill that RangeCalendarCell.root paints on its cell.

Vue component: RangeCalendarCellTrigger

SlotDefault classesDescription
root7 classesThe pressable day button inside a RangeCalendarCell.root. See also: CalendarCellTrigger.root; delta is that the single data-selected state is replaced by paired data-selection-start / data-selection-end states that paint --primary only at the two endpoints, leaving the middle of the range to read through the --accent fill that RangeCalendarCell.root paints on its cell.

root

The pressable day button inside a RangeCalendarCell.root. See also: CalendarCellTrigger.root; delta is that the single data-selected state is replaced by paired data-selection-start / data-selection-end states that paint --primary only at the two endpoints, leaving the middle of the range to read through the --accent fill that RangeCalendarCell.root paints on its cell.

Default classes:

text
h-[var(--vueda-cal-day)] w-[var(--vueda-cal-day)] p-0 font-normal data-[selected]:opacity-100
[&[data-today]:not([data-selected])]:bg-accent [&[data-today]:not([data-selected])]:text-accent-foreground
data-[selection-start]:bg-primary data-[selection-start]:text-primary-foreground data-[selection-start]:hover:bg-primary data-[selection-start]:hover:text-primary-foreground data-[selection-start]:focus:bg-primary data-[selection-start]:focus:text-primary-foreground
data-[selection-end]:bg-primary data-[selection-end]:text-primary-foreground data-[selection-end]:hover:bg-primary data-[selection-end]:hover:text-primary-foreground data-[selection-end]:focus:bg-primary data-[selection-end]:focus:text-primary-foreground
data-[outside-view]:text-muted-foreground
data-[disabled]:text-muted-foreground data-[disabled]:opacity-50
data-[unavailable]:text-destructive data-[unavailable]:line-through

Composes: _ButtonBase.root _ButtonGhost.root

Source: client/lib/theme/vueda-tailwind/controls/RangeCalendarCellTrigger.theme.js:20

Documents matching: server v3.0.0a1.post1client v3.0.0-alpha.2