@epilot/spark-ui 0.18.1 → 0.18.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/accordion.cjs +2 -2
- package/dist/components/accordion.d.ts +1 -1
- package/dist/components/accordion.js +1 -1
- package/dist/components/alert-dialog.cjs +1 -1
- package/dist/components/alert-dialog.js +1 -1
- package/dist/components/autocomplete.cjs +1 -1
- package/dist/components/autocomplete.js +1 -1
- package/dist/components/bar-chart.js +1 -1
- package/dist/components/battery-progress-row.cjs +1 -1
- package/dist/components/battery-progress-row.js +1 -1
- package/dist/components/breadcrumbs.cjs +1 -1
- package/dist/components/breadcrumbs.cjs.map +1 -1
- package/dist/components/breadcrumbs.js +1 -1
- package/dist/components/breadcrumbs.js.map +1 -1
- package/dist/components/bubble.d.cts +1 -1
- package/dist/components/bubble.d.ts +1 -1
- package/dist/components/button-group.cjs +1 -1
- package/dist/components/button-group.cjs.map +1 -1
- package/dist/components/button-group.js +1 -1
- package/dist/components/button-group.js.map +1 -1
- package/dist/components/button.d.cts +3 -3
- package/dist/components/button.d.ts +3 -3
- package/dist/components/calendar.cjs +4 -4
- package/dist/components/calendar.cjs.map +1 -1
- package/dist/components/calendar.js +4 -4
- package/dist/components/calendar.js.map +1 -1
- package/dist/components/callout.cjs +1 -1
- package/dist/components/callout.d.cts +1 -1
- package/dist/components/callout.d.ts +2 -2
- package/dist/components/callout.js +1 -1
- package/dist/components/checkbox.cjs +1 -1
- package/dist/components/checkbox.cjs.map +1 -1
- package/dist/components/checkbox.js +1 -1
- package/dist/components/checkbox.js.map +1 -1
- package/dist/components/day-of-week-picker.cjs +2 -2
- package/dist/components/day-of-week-picker.cjs.map +1 -1
- package/dist/components/day-of-week-picker.js +2 -2
- package/dist/components/day-of-week-picker.js.map +1 -1
- package/dist/components/device-card.d.ts +1 -1
- package/dist/components/dialog.cjs +1 -1
- package/dist/components/dialog.js +1 -1
- package/dist/components/dropdown-menu.cjs +9 -9
- package/dist/components/dropdown-menu.cjs.map +1 -1
- package/dist/components/dropdown-menu.js +9 -9
- package/dist/components/dropdown-menu.js.map +1 -1
- package/dist/components/empty-state.d.ts +1 -1
- package/dist/components/input-date.cjs +1 -1
- package/dist/components/input-date.js +1 -1
- package/dist/components/input-group.d.cts +1 -1
- package/dist/components/input-group.d.ts +1 -1
- package/dist/components/line-chart.cjs +1 -1
- package/dist/components/line-chart.js +2 -2
- package/dist/components/list.cjs +2 -2
- package/dist/components/list.cjs.map +1 -1
- package/dist/components/list.js +2 -2
- package/dist/components/list.js.map +1 -1
- package/dist/components/marker.cjs +2 -2
- package/dist/components/marker.cjs.map +1 -1
- package/dist/components/marker.js +2 -2
- package/dist/components/marker.js.map +1 -1
- package/dist/components/message-scroller.cjs +2 -2
- package/dist/components/message-scroller.js +2 -2
- package/dist/components/on-off-button.cjs +1 -1
- package/dist/components/on-off-button.cjs.map +1 -1
- package/dist/components/on-off-button.js +1 -1
- package/dist/components/on-off-button.js.map +1 -1
- package/dist/components/page-header.cjs +1 -1
- package/dist/components/page-header.d.cts +1 -1
- package/dist/components/page-header.d.ts +1 -1
- package/dist/components/page-header.js +1 -1
- package/dist/components/pill.cjs +1 -1
- package/dist/components/pill.js +1 -1
- package/dist/components/power-history-chart.cjs +1 -1
- package/dist/components/power-history-chart.js +2 -2
- package/dist/components/power-history.cjs +1 -1
- package/dist/components/power-history.js +1 -1
- package/dist/components/power-network.cjs +2 -2
- package/dist/components/power-network.js +2 -2
- package/dist/components/radio.cjs +1 -1
- package/dist/components/radio.cjs.map +1 -1
- package/dist/components/radio.js +1 -1
- package/dist/components/radio.js.map +1 -1
- package/dist/components/schedule-list.cjs +2 -2
- package/dist/components/schedule-list.cjs.map +1 -1
- package/dist/components/schedule-list.js +2 -2
- package/dist/components/schedule-list.js.map +1 -1
- package/dist/components/scroll-area.cjs +2 -2
- package/dist/components/scroll-area.cjs.map +1 -1
- package/dist/components/scroll-area.js +2 -2
- package/dist/components/scroll-area.js.map +1 -1
- package/dist/components/segmented-control.cjs +1 -1
- package/dist/components/segmented-control.cjs.map +1 -1
- package/dist/components/segmented-control.js +1 -1
- package/dist/components/segmented-control.js.map +1 -1
- package/dist/components/select.cjs +5 -5
- package/dist/components/select.cjs.map +1 -1
- package/dist/components/select.js +5 -5
- package/dist/components/select.js.map +1 -1
- package/dist/components/series-legend.cjs +2 -2
- package/dist/components/series-legend.cjs.map +1 -1
- package/dist/components/series-legend.js +2 -2
- package/dist/components/series-legend.js.map +1 -1
- package/dist/components/sheet.cjs +1 -1
- package/dist/components/sheet.js +1 -1
- package/dist/components/slider.cjs +1 -1
- package/dist/components/slider.cjs.map +1 -1
- package/dist/components/slider.js +1 -1
- package/dist/components/slider.js.map +1 -1
- package/dist/components/smart-toggle-button.cjs +1 -1
- package/dist/components/smart-toggle-button.cjs.map +1 -1
- package/dist/components/smart-toggle-button.js +1 -1
- package/dist/components/smart-toggle-button.js.map +1 -1
- package/dist/components/solar-forecast-chart.d.ts +1 -1
- package/dist/components/stepper.cjs +3 -3
- package/dist/components/stepper.cjs.map +1 -1
- package/dist/components/stepper.js +3 -3
- package/dist/components/stepper.js.map +1 -1
- package/dist/components/switch.cjs +1 -1
- package/dist/components/switch.cjs.map +1 -1
- package/dist/components/switch.js +1 -1
- package/dist/components/switch.js.map +1 -1
- package/dist/components/tabs.cjs +3 -3
- package/dist/components/tabs.cjs.map +1 -1
- package/dist/components/tabs.js +3 -3
- package/dist/components/tabs.js.map +1 -1
- package/dist/components/theme.cjs.map +1 -1
- package/dist/components/theme.d.cts +2 -2
- package/dist/components/theme.d.ts +2 -2
- package/dist/components/theme.js.map +1 -1
- package/dist/components/time-picker.cjs +1 -1
- package/dist/components/time-picker.cjs.map +1 -1
- package/dist/components/time-picker.js +1 -1
- package/dist/components/time-picker.js.map +1 -1
- package/dist/components/toast.cjs +1 -1
- package/dist/components/toast.js +1 -1
- package/dist/components/tooltip.cjs +2 -2
- package/dist/components/tooltip.cjs.map +1 -1
- package/dist/components/tooltip.js +2 -2
- package/dist/components/tooltip.js.map +1 -1
- package/dist/lib/accent-theme.cjs +59 -7
- package/dist/lib/accent-theme.cjs.map +1 -1
- package/dist/lib/accent-theme.d.cts +8 -1
- package/dist/lib/accent-theme.d.ts +8 -1
- package/dist/lib/accent-theme.js +59 -7
- package/dist/lib/accent-theme.js.map +1 -1
- package/dist/lib/container-chrome.cjs +1 -1
- package/dist/lib/container-chrome.cjs.map +1 -1
- package/dist/lib/container-chrome.js +1 -1
- package/dist/lib/container-chrome.js.map +1 -1
- package/dist/styles/index.css +0 -27
- package/dist/styles/spark-default.css +347 -12
- package/package.json +17 -1
|
@@ -98,7 +98,7 @@ const DayOfWeekPicker = react.forwardRef(({ className, disabled, onValueChange,
|
|
|
98
98
|
"aria-label": dayAriaLabels?.[day.value] ?? label,
|
|
99
99
|
disabled,
|
|
100
100
|
onClick: () => toggle(day.value),
|
|
101
|
-
className: (0, cnfast.cn)("inline-flex h-9 flex-1 items-center justify-center rounded-full text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50", checked ? "bg-base-accent-solid text-accent-contrast hover:bg-spark-9" : "bg-base-gray-soft text-gray-light hover:bg-gray-a4"),
|
|
101
|
+
className: (0, cnfast.cn)("touch-target inline-flex h-9 flex-1 items-center justify-center rounded-full text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 motion-reduce:transition-none", checked ? "bg-base-accent-solid text-accent-contrast hover:bg-spark-9" : "bg-base-gray-soft text-gray-light hover:bg-gray-a4"),
|
|
102
102
|
children: label
|
|
103
103
|
}, day.value);
|
|
104
104
|
})
|
|
@@ -112,7 +112,7 @@ function PresetButton({ active, children, disabled, onClick }) {
|
|
|
112
112
|
onClick,
|
|
113
113
|
disabled,
|
|
114
114
|
"aria-pressed": active,
|
|
115
|
-
className: (0, cnfast.cn)("inline-flex h-7 items-center justify-center rounded-full px-3 text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50", active ? "bg-base-accent-soft text-accent" : "bg-transparent text-gray-light hover:bg-gray-a3"),
|
|
115
|
+
className: (0, cnfast.cn)("touch-target inline-flex h-7 items-center justify-center rounded-full px-3 text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 motion-reduce:transition-none", active ? "bg-base-accent-soft text-accent" : "bg-transparent text-gray-light hover:bg-gray-a3"),
|
|
116
116
|
children
|
|
117
117
|
});
|
|
118
118
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"day-of-week-picker.cjs","names":["React"],"sources":["../../src/components/day-of-week-picker.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cn } from '../utils/cn'\n\nexport type WeekDay =\n | 'monday'\n | 'tuesday'\n | 'wednesday'\n | 'thursday'\n | 'friday'\n | 'saturday'\n | 'sunday'\n\nexport const WEEK_DAYS: ReadonlyArray<{ value: WeekDay; short: string }> = [\n { value: 'monday', short: 'Mon' },\n { value: 'tuesday', short: 'Tue' },\n { value: 'wednesday', short: 'Wed' },\n { value: 'thursday', short: 'Thu' },\n { value: 'friday', short: 'Fri' },\n { value: 'saturday', short: 'Sat' },\n { value: 'sunday', short: 'Sun' },\n]\n\nconst WEEKDAYS_ONLY: WeekDay[] = [\n 'monday',\n 'tuesday',\n 'wednesday',\n 'thursday',\n 'friday',\n]\nconst WEEKEND_ONLY: WeekDay[] = ['saturday', 'sunday']\nconst ALL_DAYS: WeekDay[] = WEEK_DAYS.map((d) => d.value)\n\ninterface DayOfWeekPickerProps {\n value: WeekDay[]\n onValueChange: (next: WeekDay[]) => void\n disabled?: boolean\n /** Show \"Weekdays / Weekend / Every day\" preset shortcuts above the chips. */\n showPresets?: boolean\n className?: string\n /** Short labels (e.g. \"Mon\", \"Tue\") shown on each day chip. Defaults to English. */\n dayLabels?: Partial<Record<WeekDay, string>>\n /**\n * Full accessible names per day (e.g. \"Monday\"). Used as each chip's\n * `aria-label`. Falls back to the visible short label when omitted.\n */\n dayAriaLabels?: Partial<Record<WeekDay, string>>\n /** Preset button labels. Each defaults to its English name. */\n presetLabels?: {\n weekdays?: React.ReactNode\n weekend?: React.ReactNode\n everyDay?: React.ReactNode\n }\n /** Accessible label for the preset row. Defaults to `\"Day presets\"`. */\n presetsAriaLabel?: string\n /** Accessible label for the day chip group. Defaults to `\"Days of the week\"`. */\n daysAriaLabel?: string\n}\n\nconst DayOfWeekPicker = React.forwardRef<HTMLDivElement, DayOfWeekPickerProps>(\n (\n {\n className,\n disabled,\n onValueChange,\n showPresets = false,\n value,\n dayLabels,\n dayAriaLabels,\n presetLabels,\n presetsAriaLabel = 'Day presets',\n daysAriaLabel = 'Days of the week',\n },\n ref,\n ) => {\n const selected = React.useMemo(() => new Set(value), [value])\n\n const toggle = (day: WeekDay) => {\n const next = new Set(selected)\n if (next.has(day)) {\n next.delete(day)\n } else {\n next.add(day)\n }\n onValueChange(ALL_DAYS.filter((d) => next.has(d)))\n }\n\n const matches = (preset: WeekDay[]) =>\n selected.size === preset.length && preset.every((d) => selected.has(d))\n\n const setPreset = (preset: WeekDay[]) => {\n onValueChange(preset)\n }\n\n return (\n <div ref={ref} className={cn('flex flex-col gap-2', className)}>\n {showPresets && (\n <div\n role=\"group\"\n aria-label={presetsAriaLabel}\n className=\"flex flex-wrap gap-1.5\"\n >\n <PresetButton\n active={matches(WEEKDAYS_ONLY)}\n disabled={disabled}\n onClick={() => setPreset(WEEKDAYS_ONLY)}\n >\n {presetLabels?.weekdays ?? 'Weekdays'}\n </PresetButton>\n <PresetButton\n active={matches(WEEKEND_ONLY)}\n disabled={disabled}\n onClick={() => setPreset(WEEKEND_ONLY)}\n >\n {presetLabels?.weekend ?? 'Weekend'}\n </PresetButton>\n <PresetButton\n active={matches(ALL_DAYS)}\n disabled={disabled}\n onClick={() => setPreset(ALL_DAYS)}\n >\n {presetLabels?.everyDay ?? 'Every day'}\n </PresetButton>\n </div>\n )}\n <div role=\"group\" aria-label={daysAriaLabel} className=\"flex gap-1\">\n {WEEK_DAYS.map((day) => {\n const checked = selected.has(day.value)\n const label = dayLabels?.[day.value] ?? day.short\n const ariaLabel = dayAriaLabels?.[day.value] ?? label\n return (\n <button\n key={day.value}\n type=\"button\"\n role=\"checkbox\"\n aria-checked={checked}\n aria-label={ariaLabel}\n disabled={disabled}\n onClick={() => toggle(day.value)}\n className={cn(\n 'inline-flex h-9 flex-1 items-center justify-center rounded-full text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50',\n checked\n ? 'bg-base-accent-solid text-accent-contrast hover:bg-spark-9'\n : 'bg-base-gray-soft text-gray-light hover:bg-gray-a4',\n )}\n >\n {label}\n </button>\n )\n })}\n </div>\n </div>\n )\n },\n)\n\nDayOfWeekPicker.displayName = 'DayOfWeekPicker'\n\ninterface PresetButtonProps {\n active: boolean\n disabled?: boolean\n onClick: () => void\n children: React.ReactNode\n}\n\nfunction PresetButton({\n active,\n children,\n disabled,\n onClick,\n}: PresetButtonProps) {\n return (\n <button\n type=\"button\"\n onClick={onClick}\n disabled={disabled}\n aria-pressed={active}\n className={cn(\n 'inline-flex h-7 items-center justify-center rounded-full px-3 text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50',\n active\n ? 'bg-base-accent-soft text-accent'\n : 'bg-transparent text-gray-light hover:bg-gray-a3',\n )}\n >\n {children}\n </button>\n )\n}\n\nexport { DayOfWeekPicker }\n"],"mappings":";;;;;;;;AAYA,MAAa,YAA8D;CACzE;EAAE,OAAO;EAAU,OAAO;CAAM;CAChC;EAAE,OAAO;EAAW,OAAO;CAAM;CACjC;EAAE,OAAO;EAAa,OAAO;CAAM;CACnC;EAAE,OAAO;EAAY,OAAO;CAAM;CAClC;EAAE,OAAO;EAAU,OAAO;CAAM;CAChC;EAAE,OAAO;EAAY,OAAO;CAAM;CAClC;EAAE,OAAO;EAAU,OAAO;CAAM;AAClC;AAEA,MAAM,gBAA2B;CAC/B;CACA;CACA;CACA;CACA;AACF;AACA,MAAM,eAA0B,CAAC,YAAY,QAAQ;AACrD,MAAM,WAAsB,UAAU,KAAK,MAAM,EAAE,KAAK;AA4BxD,MAAM,kBAAkBA,MAAM,YAE1B,EACE,WACA,UACA,eACA,cAAc,OACd,OACA,WACA,eACA,cACA,mBAAmB,eACnB,gBAAgB,sBAElB,QACG;CACH,MAAM,WAAWA,MAAM,cAAc,IAAI,IAAI,KAAK,GAAG,CAAC,KAAK,CAAC;CAE5D,MAAM,UAAU,QAAiB;EAC/B,MAAM,OAAO,IAAI,IAAI,QAAQ;EAC7B,IAAI,KAAK,IAAI,GAAG,GACd,KAAK,OAAO,GAAG;OAEf,KAAK,IAAI,GAAG;EAEd,cAAc,SAAS,QAAQ,MAAM,KAAK,IAAI,CAAC,CAAC,CAAC;CACnD;CAEA,MAAM,WAAW,WACf,SAAS,SAAS,OAAO,UAAU,OAAO,OAAO,MAAM,SAAS,IAAI,CAAC,CAAC;CAExE,MAAM,aAAa,WAAsB;EACvC,cAAc,MAAM;CACtB;CAEA,OACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;EAAU;EAAK,YAAA,GAAA,OAAA,IAAc,uBAAuB,SAAS;YAA7D,CACG,eACC,iBAAA,GAAA,kBAAA,MAAC,OAAD;GACE,MAAK;GACL,cAAY;GACZ,WAAU;aAHZ;IAKE,iBAAA,GAAA,kBAAA,KAAC,cAAD;KACE,QAAQ,QAAQ,aAAa;KACnB;KACV,eAAe,UAAU,aAAa;eAErC,cAAc,YAAY;IACf,CAAA;IACd,iBAAA,GAAA,kBAAA,KAAC,cAAD;KACE,QAAQ,QAAQ,YAAY;KAClB;KACV,eAAe,UAAU,YAAY;eAEpC,cAAc,WAAW;IACd,CAAA;IACd,iBAAA,GAAA,kBAAA,KAAC,cAAD;KACE,QAAQ,QAAQ,QAAQ;KACd;KACV,eAAe,UAAU,QAAQ;eAEhC,cAAc,YAAY;IACf,CAAA;GACX;MAEP,iBAAA,GAAA,kBAAA,KAAC,OAAD;GAAK,MAAK;GAAQ,cAAY;GAAe,WAAU;aACpD,UAAU,KAAK,QAAQ;IACtB,MAAM,UAAU,SAAS,IAAI,IAAI,KAAK;IACtC,MAAM,QAAQ,YAAY,IAAI,UAAU,IAAI;IAE5C,OACE,iBAAA,GAAA,kBAAA,KAAC,UAAD;KAEE,MAAK;KACL,MAAK;KACL,gBAAc;KACd,cAPc,gBAAgB,IAAI,UAAU;KAQlC;KACV,eAAe,OAAO,IAAI,KAAK;KAC/B,YAAA,GAAA,OAAA,IACE,
|
|
1
|
+
{"version":3,"file":"day-of-week-picker.cjs","names":["React"],"sources":["../../src/components/day-of-week-picker.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cn } from '../utils/cn'\n\nexport type WeekDay =\n | 'monday'\n | 'tuesday'\n | 'wednesday'\n | 'thursday'\n | 'friday'\n | 'saturday'\n | 'sunday'\n\nexport const WEEK_DAYS: ReadonlyArray<{ value: WeekDay; short: string }> = [\n { value: 'monday', short: 'Mon' },\n { value: 'tuesday', short: 'Tue' },\n { value: 'wednesday', short: 'Wed' },\n { value: 'thursday', short: 'Thu' },\n { value: 'friday', short: 'Fri' },\n { value: 'saturday', short: 'Sat' },\n { value: 'sunday', short: 'Sun' },\n]\n\nconst WEEKDAYS_ONLY: WeekDay[] = [\n 'monday',\n 'tuesday',\n 'wednesday',\n 'thursday',\n 'friday',\n]\nconst WEEKEND_ONLY: WeekDay[] = ['saturday', 'sunday']\nconst ALL_DAYS: WeekDay[] = WEEK_DAYS.map((d) => d.value)\n\ninterface DayOfWeekPickerProps {\n value: WeekDay[]\n onValueChange: (next: WeekDay[]) => void\n disabled?: boolean\n /** Show \"Weekdays / Weekend / Every day\" preset shortcuts above the chips. */\n showPresets?: boolean\n className?: string\n /** Short labels (e.g. \"Mon\", \"Tue\") shown on each day chip. Defaults to English. */\n dayLabels?: Partial<Record<WeekDay, string>>\n /**\n * Full accessible names per day (e.g. \"Monday\"). Used as each chip's\n * `aria-label`. Falls back to the visible short label when omitted.\n */\n dayAriaLabels?: Partial<Record<WeekDay, string>>\n /** Preset button labels. Each defaults to its English name. */\n presetLabels?: {\n weekdays?: React.ReactNode\n weekend?: React.ReactNode\n everyDay?: React.ReactNode\n }\n /** Accessible label for the preset row. Defaults to `\"Day presets\"`. */\n presetsAriaLabel?: string\n /** Accessible label for the day chip group. Defaults to `\"Days of the week\"`. */\n daysAriaLabel?: string\n}\n\nconst DayOfWeekPicker = React.forwardRef<HTMLDivElement, DayOfWeekPickerProps>(\n (\n {\n className,\n disabled,\n onValueChange,\n showPresets = false,\n value,\n dayLabels,\n dayAriaLabels,\n presetLabels,\n presetsAriaLabel = 'Day presets',\n daysAriaLabel = 'Days of the week',\n },\n ref,\n ) => {\n const selected = React.useMemo(() => new Set(value), [value])\n\n const toggle = (day: WeekDay) => {\n const next = new Set(selected)\n if (next.has(day)) {\n next.delete(day)\n } else {\n next.add(day)\n }\n onValueChange(ALL_DAYS.filter((d) => next.has(d)))\n }\n\n const matches = (preset: WeekDay[]) =>\n selected.size === preset.length && preset.every((d) => selected.has(d))\n\n const setPreset = (preset: WeekDay[]) => {\n onValueChange(preset)\n }\n\n return (\n <div ref={ref} className={cn('flex flex-col gap-2', className)}>\n {showPresets && (\n <div\n role=\"group\"\n aria-label={presetsAriaLabel}\n className=\"flex flex-wrap gap-1.5\"\n >\n <PresetButton\n active={matches(WEEKDAYS_ONLY)}\n disabled={disabled}\n onClick={() => setPreset(WEEKDAYS_ONLY)}\n >\n {presetLabels?.weekdays ?? 'Weekdays'}\n </PresetButton>\n <PresetButton\n active={matches(WEEKEND_ONLY)}\n disabled={disabled}\n onClick={() => setPreset(WEEKEND_ONLY)}\n >\n {presetLabels?.weekend ?? 'Weekend'}\n </PresetButton>\n <PresetButton\n active={matches(ALL_DAYS)}\n disabled={disabled}\n onClick={() => setPreset(ALL_DAYS)}\n >\n {presetLabels?.everyDay ?? 'Every day'}\n </PresetButton>\n </div>\n )}\n <div role=\"group\" aria-label={daysAriaLabel} className=\"flex gap-1\">\n {WEEK_DAYS.map((day) => {\n const checked = selected.has(day.value)\n const label = dayLabels?.[day.value] ?? day.short\n const ariaLabel = dayAriaLabels?.[day.value] ?? label\n return (\n <button\n key={day.value}\n type=\"button\"\n role=\"checkbox\"\n aria-checked={checked}\n aria-label={ariaLabel}\n disabled={disabled}\n onClick={() => toggle(day.value)}\n className={cn(\n 'touch-target inline-flex h-9 flex-1 items-center justify-center rounded-full text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 motion-reduce:transition-none',\n checked\n ? 'bg-base-accent-solid text-accent-contrast hover:bg-spark-9'\n : 'bg-base-gray-soft text-gray-light hover:bg-gray-a4',\n )}\n >\n {label}\n </button>\n )\n })}\n </div>\n </div>\n )\n },\n)\n\nDayOfWeekPicker.displayName = 'DayOfWeekPicker'\n\ninterface PresetButtonProps {\n active: boolean\n disabled?: boolean\n onClick: () => void\n children: React.ReactNode\n}\n\nfunction PresetButton({\n active,\n children,\n disabled,\n onClick,\n}: PresetButtonProps) {\n return (\n <button\n type=\"button\"\n onClick={onClick}\n disabled={disabled}\n aria-pressed={active}\n className={cn(\n 'touch-target inline-flex h-7 items-center justify-center rounded-full px-3 text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 motion-reduce:transition-none',\n active\n ? 'bg-base-accent-soft text-accent'\n : 'bg-transparent text-gray-light hover:bg-gray-a3',\n )}\n >\n {children}\n </button>\n )\n}\n\nexport { DayOfWeekPicker }\n"],"mappings":";;;;;;;;AAYA,MAAa,YAA8D;CACzE;EAAE,OAAO;EAAU,OAAO;CAAM;CAChC;EAAE,OAAO;EAAW,OAAO;CAAM;CACjC;EAAE,OAAO;EAAa,OAAO;CAAM;CACnC;EAAE,OAAO;EAAY,OAAO;CAAM;CAClC;EAAE,OAAO;EAAU,OAAO;CAAM;CAChC;EAAE,OAAO;EAAY,OAAO;CAAM;CAClC;EAAE,OAAO;EAAU,OAAO;CAAM;AAClC;AAEA,MAAM,gBAA2B;CAC/B;CACA;CACA;CACA;CACA;AACF;AACA,MAAM,eAA0B,CAAC,YAAY,QAAQ;AACrD,MAAM,WAAsB,UAAU,KAAK,MAAM,EAAE,KAAK;AA4BxD,MAAM,kBAAkBA,MAAM,YAE1B,EACE,WACA,UACA,eACA,cAAc,OACd,OACA,WACA,eACA,cACA,mBAAmB,eACnB,gBAAgB,sBAElB,QACG;CACH,MAAM,WAAWA,MAAM,cAAc,IAAI,IAAI,KAAK,GAAG,CAAC,KAAK,CAAC;CAE5D,MAAM,UAAU,QAAiB;EAC/B,MAAM,OAAO,IAAI,IAAI,QAAQ;EAC7B,IAAI,KAAK,IAAI,GAAG,GACd,KAAK,OAAO,GAAG;OAEf,KAAK,IAAI,GAAG;EAEd,cAAc,SAAS,QAAQ,MAAM,KAAK,IAAI,CAAC,CAAC,CAAC;CACnD;CAEA,MAAM,WAAW,WACf,SAAS,SAAS,OAAO,UAAU,OAAO,OAAO,MAAM,SAAS,IAAI,CAAC,CAAC;CAExE,MAAM,aAAa,WAAsB;EACvC,cAAc,MAAM;CACtB;CAEA,OACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;EAAU;EAAK,YAAA,GAAA,OAAA,IAAc,uBAAuB,SAAS;YAA7D,CACG,eACC,iBAAA,GAAA,kBAAA,MAAC,OAAD;GACE,MAAK;GACL,cAAY;GACZ,WAAU;aAHZ;IAKE,iBAAA,GAAA,kBAAA,KAAC,cAAD;KACE,QAAQ,QAAQ,aAAa;KACnB;KACV,eAAe,UAAU,aAAa;eAErC,cAAc,YAAY;IACf,CAAA;IACd,iBAAA,GAAA,kBAAA,KAAC,cAAD;KACE,QAAQ,QAAQ,YAAY;KAClB;KACV,eAAe,UAAU,YAAY;eAEpC,cAAc,WAAW;IACd,CAAA;IACd,iBAAA,GAAA,kBAAA,KAAC,cAAD;KACE,QAAQ,QAAQ,QAAQ;KACd;KACV,eAAe,UAAU,QAAQ;eAEhC,cAAc,YAAY;IACf,CAAA;GACX;MAEP,iBAAA,GAAA,kBAAA,KAAC,OAAD;GAAK,MAAK;GAAQ,cAAY;GAAe,WAAU;aACpD,UAAU,KAAK,QAAQ;IACtB,MAAM,UAAU,SAAS,IAAI,IAAI,KAAK;IACtC,MAAM,QAAQ,YAAY,IAAI,UAAU,IAAI;IAE5C,OACE,iBAAA,GAAA,kBAAA,KAAC,UAAD;KAEE,MAAK;KACL,MAAK;KACL,gBAAc;KACd,cAPc,gBAAgB,IAAI,UAAU;KAQlC;KACV,eAAe,OAAO,IAAI,KAAK;KAC/B,YAAA,GAAA,OAAA,IACE,kRACA,UACI,+DACA,oDACN;eAEC;IACK,GAfD,IAAI,KAeH;GAEZ,CAAC;EACE,CAAA,CACF;;AAET,CACF;AAEA,gBAAgB,cAAc;AAS9B,SAAS,aAAa,EACpB,QACA,UACA,UACA,WACoB;CACpB,OACE,iBAAA,GAAA,kBAAA,KAAC,UAAD;EACE,MAAK;EACI;EACC;EACV,gBAAc;EACd,YAAA,GAAA,OAAA,IACE,gRACA,SACI,oCACA,iDACN;EAEC;CACK,CAAA;AAEZ"}
|
|
@@ -95,7 +95,7 @@ const DayOfWeekPicker = React$1.forwardRef(({ className, disabled, onValueChange
|
|
|
95
95
|
"aria-label": dayAriaLabels?.[day.value] ?? label,
|
|
96
96
|
disabled,
|
|
97
97
|
onClick: () => toggle(day.value),
|
|
98
|
-
className: cn("inline-flex h-9 flex-1 items-center justify-center rounded-full text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50", checked ? "bg-base-accent-solid text-accent-contrast hover:bg-spark-9" : "bg-base-gray-soft text-gray-light hover:bg-gray-a4"),
|
|
98
|
+
className: cn("touch-target inline-flex h-9 flex-1 items-center justify-center rounded-full text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 motion-reduce:transition-none", checked ? "bg-base-accent-solid text-accent-contrast hover:bg-spark-9" : "bg-base-gray-soft text-gray-light hover:bg-gray-a4"),
|
|
99
99
|
children: label
|
|
100
100
|
}, day.value);
|
|
101
101
|
})
|
|
@@ -109,7 +109,7 @@ function PresetButton({ active, children, disabled, onClick }) {
|
|
|
109
109
|
onClick,
|
|
110
110
|
disabled,
|
|
111
111
|
"aria-pressed": active,
|
|
112
|
-
className: cn("inline-flex h-7 items-center justify-center rounded-full px-3 text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50", active ? "bg-base-accent-soft text-accent" : "bg-transparent text-gray-light hover:bg-gray-a3"),
|
|
112
|
+
className: cn("touch-target inline-flex h-7 items-center justify-center rounded-full px-3 text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 motion-reduce:transition-none", active ? "bg-base-accent-soft text-accent" : "bg-transparent text-gray-light hover:bg-gray-a3"),
|
|
113
113
|
children
|
|
114
114
|
});
|
|
115
115
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"day-of-week-picker.js","names":["React"],"sources":["../../src/components/day-of-week-picker.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cn } from '../utils/cn'\n\nexport type WeekDay =\n | 'monday'\n | 'tuesday'\n | 'wednesday'\n | 'thursday'\n | 'friday'\n | 'saturday'\n | 'sunday'\n\nexport const WEEK_DAYS: ReadonlyArray<{ value: WeekDay; short: string }> = [\n { value: 'monday', short: 'Mon' },\n { value: 'tuesday', short: 'Tue' },\n { value: 'wednesday', short: 'Wed' },\n { value: 'thursday', short: 'Thu' },\n { value: 'friday', short: 'Fri' },\n { value: 'saturday', short: 'Sat' },\n { value: 'sunday', short: 'Sun' },\n]\n\nconst WEEKDAYS_ONLY: WeekDay[] = [\n 'monday',\n 'tuesday',\n 'wednesday',\n 'thursday',\n 'friday',\n]\nconst WEEKEND_ONLY: WeekDay[] = ['saturday', 'sunday']\nconst ALL_DAYS: WeekDay[] = WEEK_DAYS.map((d) => d.value)\n\ninterface DayOfWeekPickerProps {\n value: WeekDay[]\n onValueChange: (next: WeekDay[]) => void\n disabled?: boolean\n /** Show \"Weekdays / Weekend / Every day\" preset shortcuts above the chips. */\n showPresets?: boolean\n className?: string\n /** Short labels (e.g. \"Mon\", \"Tue\") shown on each day chip. Defaults to English. */\n dayLabels?: Partial<Record<WeekDay, string>>\n /**\n * Full accessible names per day (e.g. \"Monday\"). Used as each chip's\n * `aria-label`. Falls back to the visible short label when omitted.\n */\n dayAriaLabels?: Partial<Record<WeekDay, string>>\n /** Preset button labels. Each defaults to its English name. */\n presetLabels?: {\n weekdays?: React.ReactNode\n weekend?: React.ReactNode\n everyDay?: React.ReactNode\n }\n /** Accessible label for the preset row. Defaults to `\"Day presets\"`. */\n presetsAriaLabel?: string\n /** Accessible label for the day chip group. Defaults to `\"Days of the week\"`. */\n daysAriaLabel?: string\n}\n\nconst DayOfWeekPicker = React.forwardRef<HTMLDivElement, DayOfWeekPickerProps>(\n (\n {\n className,\n disabled,\n onValueChange,\n showPresets = false,\n value,\n dayLabels,\n dayAriaLabels,\n presetLabels,\n presetsAriaLabel = 'Day presets',\n daysAriaLabel = 'Days of the week',\n },\n ref,\n ) => {\n const selected = React.useMemo(() => new Set(value), [value])\n\n const toggle = (day: WeekDay) => {\n const next = new Set(selected)\n if (next.has(day)) {\n next.delete(day)\n } else {\n next.add(day)\n }\n onValueChange(ALL_DAYS.filter((d) => next.has(d)))\n }\n\n const matches = (preset: WeekDay[]) =>\n selected.size === preset.length && preset.every((d) => selected.has(d))\n\n const setPreset = (preset: WeekDay[]) => {\n onValueChange(preset)\n }\n\n return (\n <div ref={ref} className={cn('flex flex-col gap-2', className)}>\n {showPresets && (\n <div\n role=\"group\"\n aria-label={presetsAriaLabel}\n className=\"flex flex-wrap gap-1.5\"\n >\n <PresetButton\n active={matches(WEEKDAYS_ONLY)}\n disabled={disabled}\n onClick={() => setPreset(WEEKDAYS_ONLY)}\n >\n {presetLabels?.weekdays ?? 'Weekdays'}\n </PresetButton>\n <PresetButton\n active={matches(WEEKEND_ONLY)}\n disabled={disabled}\n onClick={() => setPreset(WEEKEND_ONLY)}\n >\n {presetLabels?.weekend ?? 'Weekend'}\n </PresetButton>\n <PresetButton\n active={matches(ALL_DAYS)}\n disabled={disabled}\n onClick={() => setPreset(ALL_DAYS)}\n >\n {presetLabels?.everyDay ?? 'Every day'}\n </PresetButton>\n </div>\n )}\n <div role=\"group\" aria-label={daysAriaLabel} className=\"flex gap-1\">\n {WEEK_DAYS.map((day) => {\n const checked = selected.has(day.value)\n const label = dayLabels?.[day.value] ?? day.short\n const ariaLabel = dayAriaLabels?.[day.value] ?? label\n return (\n <button\n key={day.value}\n type=\"button\"\n role=\"checkbox\"\n aria-checked={checked}\n aria-label={ariaLabel}\n disabled={disabled}\n onClick={() => toggle(day.value)}\n className={cn(\n 'inline-flex h-9 flex-1 items-center justify-center rounded-full text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50',\n checked\n ? 'bg-base-accent-solid text-accent-contrast hover:bg-spark-9'\n : 'bg-base-gray-soft text-gray-light hover:bg-gray-a4',\n )}\n >\n {label}\n </button>\n )\n })}\n </div>\n </div>\n )\n },\n)\n\nDayOfWeekPicker.displayName = 'DayOfWeekPicker'\n\ninterface PresetButtonProps {\n active: boolean\n disabled?: boolean\n onClick: () => void\n children: React.ReactNode\n}\n\nfunction PresetButton({\n active,\n children,\n disabled,\n onClick,\n}: PresetButtonProps) {\n return (\n <button\n type=\"button\"\n onClick={onClick}\n disabled={disabled}\n aria-pressed={active}\n className={cn(\n 'inline-flex h-7 items-center justify-center rounded-full px-3 text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50',\n active\n ? 'bg-base-accent-soft text-accent'\n : 'bg-transparent text-gray-light hover:bg-gray-a3',\n )}\n >\n {children}\n </button>\n )\n}\n\nexport { DayOfWeekPicker }\n"],"mappings":";;;;;AAYA,MAAa,YAA8D;CACzE;EAAE,OAAO;EAAU,OAAO;CAAM;CAChC;EAAE,OAAO;EAAW,OAAO;CAAM;CACjC;EAAE,OAAO;EAAa,OAAO;CAAM;CACnC;EAAE,OAAO;EAAY,OAAO;CAAM;CAClC;EAAE,OAAO;EAAU,OAAO;CAAM;CAChC;EAAE,OAAO;EAAY,OAAO;CAAM;CAClC;EAAE,OAAO;EAAU,OAAO;CAAM;AAClC;AAEA,MAAM,gBAA2B;CAC/B;CACA;CACA;CACA;CACA;AACF;AACA,MAAM,eAA0B,CAAC,YAAY,QAAQ;AACrD,MAAM,WAAsB,UAAU,KAAK,MAAM,EAAE,KAAK;AA4BxD,MAAM,kBAAkBA,QAAM,YAE1B,EACE,WACA,UACA,eACA,cAAc,OACd,OACA,WACA,eACA,cACA,mBAAmB,eACnB,gBAAgB,sBAElB,QACG;CACH,MAAM,WAAWA,QAAM,cAAc,IAAI,IAAI,KAAK,GAAG,CAAC,KAAK,CAAC;CAE5D,MAAM,UAAU,QAAiB;EAC/B,MAAM,OAAO,IAAI,IAAI,QAAQ;EAC7B,IAAI,KAAK,IAAI,GAAG,GACd,KAAK,OAAO,GAAG;OAEf,KAAK,IAAI,GAAG;EAEd,cAAc,SAAS,QAAQ,MAAM,KAAK,IAAI,CAAC,CAAC,CAAC;CACnD;CAEA,MAAM,WAAW,WACf,SAAS,SAAS,OAAO,UAAU,OAAO,OAAO,MAAM,SAAS,IAAI,CAAC,CAAC;CAExE,MAAM,aAAa,WAAsB;EACvC,cAAc,MAAM;CACtB;CAEA,OACE,qBAAC,OAAD;EAAU;EAAK,WAAW,GAAG,uBAAuB,SAAS;YAA7D,CACG,eACC,qBAAC,OAAD;GACE,MAAK;GACL,cAAY;GACZ,WAAU;aAHZ;IAKE,oBAAC,cAAD;KACE,QAAQ,QAAQ,aAAa;KACnB;KACV,eAAe,UAAU,aAAa;eAErC,cAAc,YAAY;IACf,CAAA;IACd,oBAAC,cAAD;KACE,QAAQ,QAAQ,YAAY;KAClB;KACV,eAAe,UAAU,YAAY;eAEpC,cAAc,WAAW;IACd,CAAA;IACd,oBAAC,cAAD;KACE,QAAQ,QAAQ,QAAQ;KACd;KACV,eAAe,UAAU,QAAQ;eAEhC,cAAc,YAAY;IACf,CAAA;GACX;MAEP,oBAAC,OAAD;GAAK,MAAK;GAAQ,cAAY;GAAe,WAAU;aACpD,UAAU,KAAK,QAAQ;IACtB,MAAM,UAAU,SAAS,IAAI,IAAI,KAAK;IACtC,MAAM,QAAQ,YAAY,IAAI,UAAU,IAAI;IAE5C,OACE,oBAAC,UAAD;KAEE,MAAK;KACL,MAAK;KACL,gBAAc;KACd,cAPc,gBAAgB,IAAI,UAAU;KAQlC;KACV,eAAe,OAAO,IAAI,KAAK;KAC/B,WAAW,GACT,
|
|
1
|
+
{"version":3,"file":"day-of-week-picker.js","names":["React"],"sources":["../../src/components/day-of-week-picker.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cn } from '../utils/cn'\n\nexport type WeekDay =\n | 'monday'\n | 'tuesday'\n | 'wednesday'\n | 'thursday'\n | 'friday'\n | 'saturday'\n | 'sunday'\n\nexport const WEEK_DAYS: ReadonlyArray<{ value: WeekDay; short: string }> = [\n { value: 'monday', short: 'Mon' },\n { value: 'tuesday', short: 'Tue' },\n { value: 'wednesday', short: 'Wed' },\n { value: 'thursday', short: 'Thu' },\n { value: 'friday', short: 'Fri' },\n { value: 'saturday', short: 'Sat' },\n { value: 'sunday', short: 'Sun' },\n]\n\nconst WEEKDAYS_ONLY: WeekDay[] = [\n 'monday',\n 'tuesday',\n 'wednesday',\n 'thursday',\n 'friday',\n]\nconst WEEKEND_ONLY: WeekDay[] = ['saturday', 'sunday']\nconst ALL_DAYS: WeekDay[] = WEEK_DAYS.map((d) => d.value)\n\ninterface DayOfWeekPickerProps {\n value: WeekDay[]\n onValueChange: (next: WeekDay[]) => void\n disabled?: boolean\n /** Show \"Weekdays / Weekend / Every day\" preset shortcuts above the chips. */\n showPresets?: boolean\n className?: string\n /** Short labels (e.g. \"Mon\", \"Tue\") shown on each day chip. Defaults to English. */\n dayLabels?: Partial<Record<WeekDay, string>>\n /**\n * Full accessible names per day (e.g. \"Monday\"). Used as each chip's\n * `aria-label`. Falls back to the visible short label when omitted.\n */\n dayAriaLabels?: Partial<Record<WeekDay, string>>\n /** Preset button labels. Each defaults to its English name. */\n presetLabels?: {\n weekdays?: React.ReactNode\n weekend?: React.ReactNode\n everyDay?: React.ReactNode\n }\n /** Accessible label for the preset row. Defaults to `\"Day presets\"`. */\n presetsAriaLabel?: string\n /** Accessible label for the day chip group. Defaults to `\"Days of the week\"`. */\n daysAriaLabel?: string\n}\n\nconst DayOfWeekPicker = React.forwardRef<HTMLDivElement, DayOfWeekPickerProps>(\n (\n {\n className,\n disabled,\n onValueChange,\n showPresets = false,\n value,\n dayLabels,\n dayAriaLabels,\n presetLabels,\n presetsAriaLabel = 'Day presets',\n daysAriaLabel = 'Days of the week',\n },\n ref,\n ) => {\n const selected = React.useMemo(() => new Set(value), [value])\n\n const toggle = (day: WeekDay) => {\n const next = new Set(selected)\n if (next.has(day)) {\n next.delete(day)\n } else {\n next.add(day)\n }\n onValueChange(ALL_DAYS.filter((d) => next.has(d)))\n }\n\n const matches = (preset: WeekDay[]) =>\n selected.size === preset.length && preset.every((d) => selected.has(d))\n\n const setPreset = (preset: WeekDay[]) => {\n onValueChange(preset)\n }\n\n return (\n <div ref={ref} className={cn('flex flex-col gap-2', className)}>\n {showPresets && (\n <div\n role=\"group\"\n aria-label={presetsAriaLabel}\n className=\"flex flex-wrap gap-1.5\"\n >\n <PresetButton\n active={matches(WEEKDAYS_ONLY)}\n disabled={disabled}\n onClick={() => setPreset(WEEKDAYS_ONLY)}\n >\n {presetLabels?.weekdays ?? 'Weekdays'}\n </PresetButton>\n <PresetButton\n active={matches(WEEKEND_ONLY)}\n disabled={disabled}\n onClick={() => setPreset(WEEKEND_ONLY)}\n >\n {presetLabels?.weekend ?? 'Weekend'}\n </PresetButton>\n <PresetButton\n active={matches(ALL_DAYS)}\n disabled={disabled}\n onClick={() => setPreset(ALL_DAYS)}\n >\n {presetLabels?.everyDay ?? 'Every day'}\n </PresetButton>\n </div>\n )}\n <div role=\"group\" aria-label={daysAriaLabel} className=\"flex gap-1\">\n {WEEK_DAYS.map((day) => {\n const checked = selected.has(day.value)\n const label = dayLabels?.[day.value] ?? day.short\n const ariaLabel = dayAriaLabels?.[day.value] ?? label\n return (\n <button\n key={day.value}\n type=\"button\"\n role=\"checkbox\"\n aria-checked={checked}\n aria-label={ariaLabel}\n disabled={disabled}\n onClick={() => toggle(day.value)}\n className={cn(\n 'touch-target inline-flex h-9 flex-1 items-center justify-center rounded-full text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 motion-reduce:transition-none',\n checked\n ? 'bg-base-accent-solid text-accent-contrast hover:bg-spark-9'\n : 'bg-base-gray-soft text-gray-light hover:bg-gray-a4',\n )}\n >\n {label}\n </button>\n )\n })}\n </div>\n </div>\n )\n },\n)\n\nDayOfWeekPicker.displayName = 'DayOfWeekPicker'\n\ninterface PresetButtonProps {\n active: boolean\n disabled?: boolean\n onClick: () => void\n children: React.ReactNode\n}\n\nfunction PresetButton({\n active,\n children,\n disabled,\n onClick,\n}: PresetButtonProps) {\n return (\n <button\n type=\"button\"\n onClick={onClick}\n disabled={disabled}\n aria-pressed={active}\n className={cn(\n 'touch-target inline-flex h-7 items-center justify-center rounded-full px-3 text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 motion-reduce:transition-none',\n active\n ? 'bg-base-accent-soft text-accent'\n : 'bg-transparent text-gray-light hover:bg-gray-a3',\n )}\n >\n {children}\n </button>\n )\n}\n\nexport { DayOfWeekPicker }\n"],"mappings":";;;;;AAYA,MAAa,YAA8D;CACzE;EAAE,OAAO;EAAU,OAAO;CAAM;CAChC;EAAE,OAAO;EAAW,OAAO;CAAM;CACjC;EAAE,OAAO;EAAa,OAAO;CAAM;CACnC;EAAE,OAAO;EAAY,OAAO;CAAM;CAClC;EAAE,OAAO;EAAU,OAAO;CAAM;CAChC;EAAE,OAAO;EAAY,OAAO;CAAM;CAClC;EAAE,OAAO;EAAU,OAAO;CAAM;AAClC;AAEA,MAAM,gBAA2B;CAC/B;CACA;CACA;CACA;CACA;AACF;AACA,MAAM,eAA0B,CAAC,YAAY,QAAQ;AACrD,MAAM,WAAsB,UAAU,KAAK,MAAM,EAAE,KAAK;AA4BxD,MAAM,kBAAkBA,QAAM,YAE1B,EACE,WACA,UACA,eACA,cAAc,OACd,OACA,WACA,eACA,cACA,mBAAmB,eACnB,gBAAgB,sBAElB,QACG;CACH,MAAM,WAAWA,QAAM,cAAc,IAAI,IAAI,KAAK,GAAG,CAAC,KAAK,CAAC;CAE5D,MAAM,UAAU,QAAiB;EAC/B,MAAM,OAAO,IAAI,IAAI,QAAQ;EAC7B,IAAI,KAAK,IAAI,GAAG,GACd,KAAK,OAAO,GAAG;OAEf,KAAK,IAAI,GAAG;EAEd,cAAc,SAAS,QAAQ,MAAM,KAAK,IAAI,CAAC,CAAC,CAAC;CACnD;CAEA,MAAM,WAAW,WACf,SAAS,SAAS,OAAO,UAAU,OAAO,OAAO,MAAM,SAAS,IAAI,CAAC,CAAC;CAExE,MAAM,aAAa,WAAsB;EACvC,cAAc,MAAM;CACtB;CAEA,OACE,qBAAC,OAAD;EAAU;EAAK,WAAW,GAAG,uBAAuB,SAAS;YAA7D,CACG,eACC,qBAAC,OAAD;GACE,MAAK;GACL,cAAY;GACZ,WAAU;aAHZ;IAKE,oBAAC,cAAD;KACE,QAAQ,QAAQ,aAAa;KACnB;KACV,eAAe,UAAU,aAAa;eAErC,cAAc,YAAY;IACf,CAAA;IACd,oBAAC,cAAD;KACE,QAAQ,QAAQ,YAAY;KAClB;KACV,eAAe,UAAU,YAAY;eAEpC,cAAc,WAAW;IACd,CAAA;IACd,oBAAC,cAAD;KACE,QAAQ,QAAQ,QAAQ;KACd;KACV,eAAe,UAAU,QAAQ;eAEhC,cAAc,YAAY;IACf,CAAA;GACX;MAEP,oBAAC,OAAD;GAAK,MAAK;GAAQ,cAAY;GAAe,WAAU;aACpD,UAAU,KAAK,QAAQ;IACtB,MAAM,UAAU,SAAS,IAAI,IAAI,KAAK;IACtC,MAAM,QAAQ,YAAY,IAAI,UAAU,IAAI;IAE5C,OACE,oBAAC,UAAD;KAEE,MAAK;KACL,MAAK;KACL,gBAAc;KACd,cAPc,gBAAgB,IAAI,UAAU;KAQlC;KACV,eAAe,OAAO,IAAI,KAAK;KAC/B,WAAW,GACT,kRACA,UACI,+DACA,oDACN;eAEC;IACK,GAfD,IAAI,KAeH;GAEZ,CAAC;EACE,CAAA,CACF;;AAET,CACF;AAEA,gBAAgB,cAAc;AAS9B,SAAS,aAAa,EACpB,QACA,UACA,UACA,WACoB;CACpB,OACE,oBAAC,UAAD;EACE,MAAK;EACI;EACC;EACV,gBAAc;EACd,WAAW,GACT,gRACA,SACI,oCACA,iDACN;EAEC;CACK,CAAA;AAEZ"}
|
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
3
|
const require_chunk = require("../chunk-DY84GLCh.cjs");
|
|
4
4
|
const require_components_button = require("./button.cjs");
|
|
5
|
+
let _epilot_spark_icons = require("@epilot/spark-icons");
|
|
5
6
|
let react = require("react");
|
|
6
7
|
react = require_chunk.__toESM(react);
|
|
7
|
-
let _epilot_spark_icons = require("@epilot/spark-icons");
|
|
8
8
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
9
9
|
let _base_ui_react_dialog = require("@base-ui/react/dialog");
|
|
10
10
|
let cnfast = require("cnfast");
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { cn } from "../utils/cn.js";
|
|
3
3
|
import { buttonVariants } from "./button.js";
|
|
4
|
-
import "react";
|
|
5
4
|
import { Close } from "@epilot/spark-icons";
|
|
5
|
+
import "react";
|
|
6
6
|
import { jsx } from "react/jsx-runtime";
|
|
7
7
|
import { Dialog as Dialog$1 } from "@base-ui/react/dialog";
|
|
8
8
|
//#region src/components/dialog.tsx
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
3
|
const require_chunk = require("../chunk-DY84GLCh.cjs");
|
|
4
|
+
let _epilot_spark_icons = require("@epilot/spark-icons");
|
|
4
5
|
let react = require("react");
|
|
5
6
|
react = require_chunk.__toESM(react);
|
|
6
|
-
let _epilot_spark_icons = require("@epilot/spark-icons");
|
|
7
7
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
8
8
|
let _base_ui_react_menu = require("@base-ui/react/menu");
|
|
9
9
|
let cnfast = require("cnfast");
|
|
@@ -34,7 +34,7 @@ function DropdownMenuContent({ className, align = "start", alignOffset, side, si
|
|
|
34
34
|
sideOffset,
|
|
35
35
|
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_menu.Menu.Popup, {
|
|
36
36
|
"data-slot": "dropdown-menu-content",
|
|
37
|
-
className: (0, cnfast.cn)("z-50 max-h-(--available-height) min-w-40 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg border border-gray-a1 bg-gray-1 p-1 text-gray-a12 shadow-lg outline-none", "transition-[opacity,scale,translate] duration-100 data-ending-style:scale-95 data-ending-style:opacity-0 data-starting-style:scale-95 data-starting-style:opacity-0", "data-[side=bottom]:data-starting-style:-translate-y-2 data-[side=left]:data-starting-style:translate-x-2 data-[side=right]:data-starting-style:-translate-x-2 data-[side=top]:data-starting-style:translate-y-2", className),
|
|
37
|
+
className: (0, cnfast.cn)("z-50 max-h-(--available-height) min-w-40 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg border border-gray-a1 bg-gray-1 p-1 text-gray-a12 shadow-lg outline-none [[data-high-contrast]_&]:border-gray-a11", "transition-[opacity,scale,translate] duration-100 data-ending-style:scale-95 data-ending-style:opacity-0 data-starting-style:scale-95 data-starting-style:opacity-0 motion-reduce:transition-none", "data-[side=bottom]:data-starting-style:-translate-y-2 data-[side=left]:data-starting-style:translate-x-2 data-[side=right]:data-starting-style:-translate-x-2 data-[side=top]:data-starting-style:translate-y-2", className),
|
|
38
38
|
...props
|
|
39
39
|
})
|
|
40
40
|
})
|
|
@@ -51,7 +51,7 @@ function DropdownMenuItem({ className, inset, variant = "default", ...props }) {
|
|
|
51
51
|
"data-slot": "dropdown-menu-item",
|
|
52
52
|
"data-inset": inset,
|
|
53
53
|
"data-variant": variant,
|
|
54
|
-
className: (0, cnfast.cn)("group/dropdown-menu-item relative flex min-h-7 cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden transition-colors select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 data-[variant=destructive]:text-error data-[variant=destructive]:data-highlighted:bg-base-error-soft [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4", className),
|
|
54
|
+
className: (0, cnfast.cn)("group/dropdown-menu-item relative flex min-h-7 cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden transition-colors select-none touch-target-row data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 data-[variant=destructive]:text-error data-[variant=destructive]:data-highlighted:bg-base-error-soft motion-reduce:transition-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4", className),
|
|
55
55
|
...props
|
|
56
56
|
});
|
|
57
57
|
}
|
|
@@ -59,7 +59,7 @@ function DropdownMenuCheckboxItem({ className, children, checked, inset, ...prop
|
|
|
59
59
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_base_ui_react_menu.Menu.CheckboxItem, {
|
|
60
60
|
"data-slot": "dropdown-menu-checkbox-item",
|
|
61
61
|
"data-inset": inset,
|
|
62
|
-
className: (0, cnfast.cn)("relative flex min-h-7 cursor-pointer items-center gap-2 rounded-sm py-1.5 pr-10 pl-2 text-sm outline-hidden transition-colors select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4", className),
|
|
62
|
+
className: (0, cnfast.cn)("relative flex min-h-7 cursor-pointer items-center gap-2 rounded-sm py-1.5 pr-10 pl-2 text-sm outline-hidden transition-colors select-none touch-target-row data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 motion-reduce:transition-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4", className),
|
|
63
63
|
checked,
|
|
64
64
|
...props,
|
|
65
65
|
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
|
|
@@ -79,7 +79,7 @@ function DropdownMenuRadioItem({ className, children, inset, ...props }) {
|
|
|
79
79
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_base_ui_react_menu.Menu.RadioItem, {
|
|
80
80
|
"data-slot": "dropdown-menu-radio-item",
|
|
81
81
|
"data-inset": inset,
|
|
82
|
-
className: (0, cnfast.cn)("relative flex min-h-7 cursor-pointer items-center gap-2 rounded-sm py-1.5 pr-10 pl-2 text-sm outline-hidden transition-colors select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4", className),
|
|
82
|
+
className: (0, cnfast.cn)("relative flex min-h-7 cursor-pointer items-center gap-2 rounded-sm py-1.5 pr-10 pl-2 text-sm outline-hidden transition-colors select-none touch-target-row data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 motion-reduce:transition-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4", className),
|
|
83
83
|
...props,
|
|
84
84
|
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
|
|
85
85
|
className: "pointer-events-none absolute inset-y-0 top-1 right-2 flex items-center justify-center",
|
|
@@ -92,21 +92,21 @@ function DropdownMenuLabel({ className, inset, ...props }) {
|
|
|
92
92
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
93
93
|
"data-slot": "dropdown-menu-label",
|
|
94
94
|
"data-inset": inset,
|
|
95
|
-
className: (0, cnfast.cn)("px-2 py-1 text-xs text-gray-light data-[inset=true]:pl-7", className),
|
|
95
|
+
className: (0, cnfast.cn)("px-2 py-1 text-xs text-gray-light data-[inset=true]:pl-7 [[data-high-contrast]_&]:text-gray-a12", className),
|
|
96
96
|
...props
|
|
97
97
|
});
|
|
98
98
|
}
|
|
99
99
|
function DropdownMenuSeparator({ className, ...props }) {
|
|
100
100
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_menu.Menu.Separator, {
|
|
101
101
|
"data-slot": "dropdown-menu-separator",
|
|
102
|
-
className: (0, cnfast.cn)("-mx-1 my-1 h-px bg-gray-a3", className),
|
|
102
|
+
className: (0, cnfast.cn)("-mx-1 my-1 h-px bg-gray-a3 [[data-high-contrast]_&]:bg-gray-a6", className),
|
|
103
103
|
...props
|
|
104
104
|
});
|
|
105
105
|
}
|
|
106
106
|
function DropdownMenuShortcut({ className, ...props }) {
|
|
107
107
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
|
|
108
108
|
"data-slot": "dropdown-menu-shortcut",
|
|
109
|
-
className: (0, cnfast.cn)("ml-auto text-xs tracking-widest text-gray-light", className),
|
|
109
|
+
className: (0, cnfast.cn)("ml-auto text-xs tracking-widest text-gray-light [[data-high-contrast]_&]:text-gray-a12", className),
|
|
110
110
|
...props
|
|
111
111
|
});
|
|
112
112
|
}
|
|
@@ -120,7 +120,7 @@ function DropdownMenuSubTrigger({ className, inset, children, ...props }) {
|
|
|
120
120
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_base_ui_react_menu.Menu.SubmenuTrigger, {
|
|
121
121
|
"data-slot": "dropdown-menu-sub-trigger",
|
|
122
122
|
"data-inset": inset,
|
|
123
|
-
className: (0, cnfast.cn)("flex min-h-7 cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden transition-colors select-none data-highlighted:bg-gray-a3 data-popup-open:bg-gray-a3 data-[inset=true]:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4", className),
|
|
123
|
+
className: (0, cnfast.cn)("flex min-h-7 cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden transition-colors select-none touch-target-row data-highlighted:bg-gray-a3 data-popup-open:bg-gray-a3 data-[inset=true]:pl-7 motion-reduce:transition-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4", className),
|
|
124
124
|
...props,
|
|
125
125
|
children: [children, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_epilot_spark_icons.ChevronRight, { className: "ml-auto text-sm text-gray-light" })]
|
|
126
126
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropdown-menu.cjs","names":["MenuPrimitive","Check","ChevronRight"],"sources":["../../src/components/dropdown-menu.tsx"],"sourcesContent":["import { Menu as MenuPrimitive } from '@base-ui/react/menu'\nimport { Check, ChevronRight } from '@epilot/spark-icons'\nimport * as React from 'react'\nimport { cn } from '../utils/cn'\n\nfunction DropdownMenu({\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.Root>) {\n return <MenuPrimitive.Root {...props} />\n}\n\nfunction DropdownMenuPortal({\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.Portal>) {\n return <MenuPrimitive.Portal data-slot=\"dropdown-menu-portal\" {...props} />\n}\n\nfunction DropdownMenuTrigger({\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.Trigger>) {\n return <MenuPrimitive.Trigger data-slot=\"dropdown-menu-trigger\" {...props} />\n}\n\ntype DropdownMenuContentProps = React.ComponentProps<\n typeof MenuPrimitive.Popup\n> &\n Pick<\n MenuPrimitive.Positioner.Props,\n 'align' | 'alignOffset' | 'side' | 'sideOffset'\n > & {\n container?: React.ComponentProps<typeof MenuPrimitive.Portal>['container']\n }\n\nfunction DropdownMenuContent({\n className,\n align = 'start',\n alignOffset,\n side,\n sideOffset = 4,\n container,\n ...props\n}: DropdownMenuContentProps) {\n return (\n <MenuPrimitive.Portal container={container}>\n <MenuPrimitive.Positioner\n align={align}\n alignOffset={alignOffset}\n className=\"isolate z-50 outline-none\"\n side={side}\n sideOffset={sideOffset}\n >\n <MenuPrimitive.Popup\n data-slot=\"dropdown-menu-content\"\n className={cn(\n 'z-50 max-h-(--available-height) min-w-40 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg border border-gray-a1 bg-gray-1 p-1 text-gray-a12 shadow-lg outline-none',\n 'transition-[opacity,scale,translate] duration-100 data-ending-style:scale-95 data-ending-style:opacity-0 data-starting-style:scale-95 data-starting-style:opacity-0',\n 'data-[side=bottom]:data-starting-style:-translate-y-2 data-[side=left]:data-starting-style:translate-x-2 data-[side=right]:data-starting-style:-translate-x-2 data-[side=top]:data-starting-style:translate-y-2',\n className,\n )}\n {...props}\n />\n </MenuPrimitive.Positioner>\n </MenuPrimitive.Portal>\n )\n}\n\nfunction DropdownMenuGroup({\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.Group>) {\n return <MenuPrimitive.Group data-slot=\"dropdown-menu-group\" {...props} />\n}\n\nfunction DropdownMenuItem({\n className,\n inset,\n variant = 'default',\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.Item> & {\n inset?: boolean\n variant?: 'default' | 'destructive'\n}) {\n return (\n <MenuPrimitive.Item\n data-slot=\"dropdown-menu-item\"\n data-inset={inset}\n data-variant={variant}\n className={cn(\n 'group/dropdown-menu-item relative flex min-h-7 cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden transition-colors select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 data-[variant=destructive]:text-error data-[variant=destructive]:data-highlighted:bg-base-error-soft [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4',\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuCheckboxItem({\n className,\n children,\n checked,\n inset,\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.CheckboxItem> & {\n inset?: boolean\n}) {\n return (\n <MenuPrimitive.CheckboxItem\n data-slot=\"dropdown-menu-checkbox-item\"\n data-inset={inset}\n className={cn(\n 'relative flex min-h-7 cursor-pointer items-center gap-2 rounded-sm py-1.5 pr-10 pl-2 text-sm outline-hidden transition-colors select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4',\n className,\n )}\n checked={checked}\n {...props}\n >\n <span\n className=\"pointer-events-none absolute inset-y-0 top-1 right-2 flex items-center justify-center\"\n data-slot=\"dropdown-menu-checkbox-item-indicator\"\n >\n <MenuPrimitive.CheckboxItemIndicator>\n <Check className=\"text-sm\" />\n </MenuPrimitive.CheckboxItemIndicator>\n </span>\n {children}\n </MenuPrimitive.CheckboxItem>\n )\n}\n\nfunction DropdownMenuRadioGroup({\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.RadioGroup>) {\n return (\n <MenuPrimitive.RadioGroup\n data-slot=\"dropdown-menu-radio-group\"\n {...props}\n />\n )\n}\n\nfunction DropdownMenuRadioItem({\n className,\n children,\n inset,\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.RadioItem> & {\n inset?: boolean\n}) {\n return (\n <MenuPrimitive.RadioItem\n data-slot=\"dropdown-menu-radio-item\"\n data-inset={inset}\n className={cn(\n 'relative flex min-h-7 cursor-pointer items-center gap-2 rounded-sm py-1.5 pr-10 pl-2 text-sm outline-hidden transition-colors select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4',\n className,\n )}\n {...props}\n >\n <span\n className=\"pointer-events-none absolute inset-y-0 top-1 right-2 flex items-center justify-center\"\n data-slot=\"dropdown-menu-radio-item-indicator\"\n >\n <MenuPrimitive.RadioItemIndicator>\n <Check className=\"text-sm\" />\n </MenuPrimitive.RadioItemIndicator>\n </span>\n {children}\n </MenuPrimitive.RadioItem>\n )\n}\n\n// plain div, not Menu.GroupLabel: Base UI's GroupLabel throws outside a\n// Group, while our labels float freely (radix Label was an unwired div too)\nfunction DropdownMenuLabel({\n className,\n inset,\n ...props\n}: React.ComponentProps<'div'> & {\n inset?: boolean\n}) {\n return (\n <div\n data-slot=\"dropdown-menu-label\"\n data-inset={inset}\n className={cn(\n 'px-2 py-1 text-xs text-gray-light data-[inset=true]:pl-7',\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuSeparator({\n className,\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.Separator>) {\n return (\n <MenuPrimitive.Separator\n data-slot=\"dropdown-menu-separator\"\n className={cn('-mx-1 my-1 h-px bg-gray-a3', className)}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuShortcut({\n className,\n ...props\n}: React.ComponentProps<'span'>) {\n return (\n <span\n data-slot=\"dropdown-menu-shortcut\"\n className={cn(\n 'ml-auto text-xs tracking-widest text-gray-light',\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuSub({\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.SubmenuRoot>) {\n return <MenuPrimitive.SubmenuRoot data-slot=\"dropdown-menu-sub\" {...props} />\n}\n\nfunction DropdownMenuSubTrigger({\n className,\n inset,\n children,\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.SubmenuTrigger> & {\n inset?: boolean\n}) {\n return (\n <MenuPrimitive.SubmenuTrigger\n data-slot=\"dropdown-menu-sub-trigger\"\n data-inset={inset}\n className={cn(\n 'flex min-h-7 cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden transition-colors select-none data-highlighted:bg-gray-a3 data-popup-open:bg-gray-a3 data-[inset=true]:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4',\n className,\n )}\n {...props}\n >\n {children}\n <ChevronRight className=\"ml-auto text-sm text-gray-light\" />\n </MenuPrimitive.SubmenuTrigger>\n )\n}\n\n// composes the public Content; the align/offset defaults visually align the\n// submenu with its parent menu\nfunction DropdownMenuSubContent({\n className,\n ...props\n}: DropdownMenuContentProps) {\n return (\n <DropdownMenuContent\n data-slot=\"dropdown-menu-sub-content\"\n align=\"start\"\n alignOffset={-3}\n side=\"right\"\n sideOffset={0}\n className={cn('w-auto min-w-32', className)}\n {...props}\n />\n )\n}\n\nexport {\n DropdownMenu,\n DropdownMenuCheckboxItem,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuPortal,\n DropdownMenuRadioGroup,\n DropdownMenuRadioItem,\n DropdownMenuSeparator,\n DropdownMenuShortcut,\n DropdownMenuSub,\n DropdownMenuSubContent,\n DropdownMenuSubTrigger,\n DropdownMenuTrigger,\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"dropdown-menu.cjs","names":["MenuPrimitive","Check","ChevronRight"],"sources":["../../src/components/dropdown-menu.tsx"],"sourcesContent":["import { Menu as MenuPrimitive } from '@base-ui/react/menu'\nimport { Check, ChevronRight } from '@epilot/spark-icons'\nimport * as React from 'react'\nimport { cn } from '../utils/cn'\n\nfunction DropdownMenu({\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.Root>) {\n return <MenuPrimitive.Root {...props} />\n}\n\nfunction DropdownMenuPortal({\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.Portal>) {\n return <MenuPrimitive.Portal data-slot=\"dropdown-menu-portal\" {...props} />\n}\n\nfunction DropdownMenuTrigger({\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.Trigger>) {\n return <MenuPrimitive.Trigger data-slot=\"dropdown-menu-trigger\" {...props} />\n}\n\ntype DropdownMenuContentProps = React.ComponentProps<\n typeof MenuPrimitive.Popup\n> &\n Pick<\n MenuPrimitive.Positioner.Props,\n 'align' | 'alignOffset' | 'side' | 'sideOffset'\n > & {\n container?: React.ComponentProps<typeof MenuPrimitive.Portal>['container']\n }\n\nfunction DropdownMenuContent({\n className,\n align = 'start',\n alignOffset,\n side,\n sideOffset = 4,\n container,\n ...props\n}: DropdownMenuContentProps) {\n return (\n <MenuPrimitive.Portal container={container}>\n <MenuPrimitive.Positioner\n align={align}\n alignOffset={alignOffset}\n className=\"isolate z-50 outline-none\"\n side={side}\n sideOffset={sideOffset}\n >\n <MenuPrimitive.Popup\n data-slot=\"dropdown-menu-content\"\n className={cn(\n 'z-50 max-h-(--available-height) min-w-40 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg border border-gray-a1 bg-gray-1 p-1 text-gray-a12 shadow-lg outline-none [[data-high-contrast]_&]:border-gray-a11',\n 'transition-[opacity,scale,translate] duration-100 data-ending-style:scale-95 data-ending-style:opacity-0 data-starting-style:scale-95 data-starting-style:opacity-0 motion-reduce:transition-none',\n 'data-[side=bottom]:data-starting-style:-translate-y-2 data-[side=left]:data-starting-style:translate-x-2 data-[side=right]:data-starting-style:-translate-x-2 data-[side=top]:data-starting-style:translate-y-2',\n className,\n )}\n {...props}\n />\n </MenuPrimitive.Positioner>\n </MenuPrimitive.Portal>\n )\n}\n\nfunction DropdownMenuGroup({\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.Group>) {\n return <MenuPrimitive.Group data-slot=\"dropdown-menu-group\" {...props} />\n}\n\nfunction DropdownMenuItem({\n className,\n inset,\n variant = 'default',\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.Item> & {\n inset?: boolean\n variant?: 'default' | 'destructive'\n}) {\n return (\n <MenuPrimitive.Item\n data-slot=\"dropdown-menu-item\"\n data-inset={inset}\n data-variant={variant}\n className={cn(\n 'group/dropdown-menu-item relative flex min-h-7 cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden transition-colors select-none touch-target-row data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 data-[variant=destructive]:text-error data-[variant=destructive]:data-highlighted:bg-base-error-soft motion-reduce:transition-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4',\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuCheckboxItem({\n className,\n children,\n checked,\n inset,\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.CheckboxItem> & {\n inset?: boolean\n}) {\n return (\n <MenuPrimitive.CheckboxItem\n data-slot=\"dropdown-menu-checkbox-item\"\n data-inset={inset}\n className={cn(\n 'relative flex min-h-7 cursor-pointer items-center gap-2 rounded-sm py-1.5 pr-10 pl-2 text-sm outline-hidden transition-colors select-none touch-target-row data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 motion-reduce:transition-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4',\n className,\n )}\n checked={checked}\n {...props}\n >\n <span\n className=\"pointer-events-none absolute inset-y-0 top-1 right-2 flex items-center justify-center\"\n data-slot=\"dropdown-menu-checkbox-item-indicator\"\n >\n <MenuPrimitive.CheckboxItemIndicator>\n <Check className=\"text-sm\" />\n </MenuPrimitive.CheckboxItemIndicator>\n </span>\n {children}\n </MenuPrimitive.CheckboxItem>\n )\n}\n\nfunction DropdownMenuRadioGroup({\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.RadioGroup>) {\n return (\n <MenuPrimitive.RadioGroup\n data-slot=\"dropdown-menu-radio-group\"\n {...props}\n />\n )\n}\n\nfunction DropdownMenuRadioItem({\n className,\n children,\n inset,\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.RadioItem> & {\n inset?: boolean\n}) {\n return (\n <MenuPrimitive.RadioItem\n data-slot=\"dropdown-menu-radio-item\"\n data-inset={inset}\n className={cn(\n 'relative flex min-h-7 cursor-pointer items-center gap-2 rounded-sm py-1.5 pr-10 pl-2 text-sm outline-hidden transition-colors select-none touch-target-row data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 motion-reduce:transition-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4',\n className,\n )}\n {...props}\n >\n <span\n className=\"pointer-events-none absolute inset-y-0 top-1 right-2 flex items-center justify-center\"\n data-slot=\"dropdown-menu-radio-item-indicator\"\n >\n <MenuPrimitive.RadioItemIndicator>\n <Check className=\"text-sm\" />\n </MenuPrimitive.RadioItemIndicator>\n </span>\n {children}\n </MenuPrimitive.RadioItem>\n )\n}\n\n// plain div, not Menu.GroupLabel: Base UI's GroupLabel throws outside a\n// Group, while our labels float freely (radix Label was an unwired div too)\nfunction DropdownMenuLabel({\n className,\n inset,\n ...props\n}: React.ComponentProps<'div'> & {\n inset?: boolean\n}) {\n return (\n <div\n data-slot=\"dropdown-menu-label\"\n data-inset={inset}\n className={cn(\n 'px-2 py-1 text-xs text-gray-light data-[inset=true]:pl-7 [[data-high-contrast]_&]:text-gray-a12',\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuSeparator({\n className,\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.Separator>) {\n return (\n <MenuPrimitive.Separator\n data-slot=\"dropdown-menu-separator\"\n className={cn(\n '-mx-1 my-1 h-px bg-gray-a3 [[data-high-contrast]_&]:bg-gray-a6',\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuShortcut({\n className,\n ...props\n}: React.ComponentProps<'span'>) {\n return (\n <span\n data-slot=\"dropdown-menu-shortcut\"\n className={cn(\n 'ml-auto text-xs tracking-widest text-gray-light [[data-high-contrast]_&]:text-gray-a12',\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuSub({\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.SubmenuRoot>) {\n return <MenuPrimitive.SubmenuRoot data-slot=\"dropdown-menu-sub\" {...props} />\n}\n\nfunction DropdownMenuSubTrigger({\n className,\n inset,\n children,\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.SubmenuTrigger> & {\n inset?: boolean\n}) {\n return (\n <MenuPrimitive.SubmenuTrigger\n data-slot=\"dropdown-menu-sub-trigger\"\n data-inset={inset}\n className={cn(\n 'flex min-h-7 cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden transition-colors select-none touch-target-row data-highlighted:bg-gray-a3 data-popup-open:bg-gray-a3 data-[inset=true]:pl-7 motion-reduce:transition-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4',\n className,\n )}\n {...props}\n >\n {children}\n <ChevronRight className=\"ml-auto text-sm text-gray-light\" />\n </MenuPrimitive.SubmenuTrigger>\n )\n}\n\n// composes the public Content; the align/offset defaults visually align the\n// submenu with its parent menu\nfunction DropdownMenuSubContent({\n className,\n ...props\n}: DropdownMenuContentProps) {\n return (\n <DropdownMenuContent\n data-slot=\"dropdown-menu-sub-content\"\n align=\"start\"\n alignOffset={-3}\n side=\"right\"\n sideOffset={0}\n className={cn('w-auto min-w-32', className)}\n {...props}\n />\n )\n}\n\nexport {\n DropdownMenu,\n DropdownMenuCheckboxItem,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuPortal,\n DropdownMenuRadioGroup,\n DropdownMenuRadioItem,\n DropdownMenuSeparator,\n DropdownMenuShortcut,\n DropdownMenuSub,\n DropdownMenuSubContent,\n DropdownMenuSubTrigger,\n DropdownMenuTrigger,\n}\n"],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { cn } from "../utils/cn.js";
|
|
3
|
-
import "react";
|
|
4
3
|
import { Check, ChevronRight } from "@epilot/spark-icons";
|
|
4
|
+
import "react";
|
|
5
5
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
6
6
|
import { Menu } from "@base-ui/react/menu";
|
|
7
7
|
//#region src/components/dropdown-menu.tsx
|
|
@@ -31,7 +31,7 @@ function DropdownMenuContent({ className, align = "start", alignOffset, side, si
|
|
|
31
31
|
sideOffset,
|
|
32
32
|
children: /* @__PURE__ */ jsx(Menu.Popup, {
|
|
33
33
|
"data-slot": "dropdown-menu-content",
|
|
34
|
-
className: cn("z-50 max-h-(--available-height) min-w-40 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg border border-gray-a1 bg-gray-1 p-1 text-gray-a12 shadow-lg outline-none", "transition-[opacity,scale,translate] duration-100 data-ending-style:scale-95 data-ending-style:opacity-0 data-starting-style:scale-95 data-starting-style:opacity-0", "data-[side=bottom]:data-starting-style:-translate-y-2 data-[side=left]:data-starting-style:translate-x-2 data-[side=right]:data-starting-style:-translate-x-2 data-[side=top]:data-starting-style:translate-y-2", className),
|
|
34
|
+
className: cn("z-50 max-h-(--available-height) min-w-40 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg border border-gray-a1 bg-gray-1 p-1 text-gray-a12 shadow-lg outline-none [[data-high-contrast]_&]:border-gray-a11", "transition-[opacity,scale,translate] duration-100 data-ending-style:scale-95 data-ending-style:opacity-0 data-starting-style:scale-95 data-starting-style:opacity-0 motion-reduce:transition-none", "data-[side=bottom]:data-starting-style:-translate-y-2 data-[side=left]:data-starting-style:translate-x-2 data-[side=right]:data-starting-style:-translate-x-2 data-[side=top]:data-starting-style:translate-y-2", className),
|
|
35
35
|
...props
|
|
36
36
|
})
|
|
37
37
|
})
|
|
@@ -48,7 +48,7 @@ function DropdownMenuItem({ className, inset, variant = "default", ...props }) {
|
|
|
48
48
|
"data-slot": "dropdown-menu-item",
|
|
49
49
|
"data-inset": inset,
|
|
50
50
|
"data-variant": variant,
|
|
51
|
-
className: cn("group/dropdown-menu-item relative flex min-h-7 cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden transition-colors select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 data-[variant=destructive]:text-error data-[variant=destructive]:data-highlighted:bg-base-error-soft [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4", className),
|
|
51
|
+
className: cn("group/dropdown-menu-item relative flex min-h-7 cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden transition-colors select-none touch-target-row data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 data-[variant=destructive]:text-error data-[variant=destructive]:data-highlighted:bg-base-error-soft motion-reduce:transition-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4", className),
|
|
52
52
|
...props
|
|
53
53
|
});
|
|
54
54
|
}
|
|
@@ -56,7 +56,7 @@ function DropdownMenuCheckboxItem({ className, children, checked, inset, ...prop
|
|
|
56
56
|
return /* @__PURE__ */ jsxs(Menu.CheckboxItem, {
|
|
57
57
|
"data-slot": "dropdown-menu-checkbox-item",
|
|
58
58
|
"data-inset": inset,
|
|
59
|
-
className: cn("relative flex min-h-7 cursor-pointer items-center gap-2 rounded-sm py-1.5 pr-10 pl-2 text-sm outline-hidden transition-colors select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4", className),
|
|
59
|
+
className: cn("relative flex min-h-7 cursor-pointer items-center gap-2 rounded-sm py-1.5 pr-10 pl-2 text-sm outline-hidden transition-colors select-none touch-target-row data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 motion-reduce:transition-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4", className),
|
|
60
60
|
checked,
|
|
61
61
|
...props,
|
|
62
62
|
children: [/* @__PURE__ */ jsx("span", {
|
|
@@ -76,7 +76,7 @@ function DropdownMenuRadioItem({ className, children, inset, ...props }) {
|
|
|
76
76
|
return /* @__PURE__ */ jsxs(Menu.RadioItem, {
|
|
77
77
|
"data-slot": "dropdown-menu-radio-item",
|
|
78
78
|
"data-inset": inset,
|
|
79
|
-
className: cn("relative flex min-h-7 cursor-pointer items-center gap-2 rounded-sm py-1.5 pr-10 pl-2 text-sm outline-hidden transition-colors select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4", className),
|
|
79
|
+
className: cn("relative flex min-h-7 cursor-pointer items-center gap-2 rounded-sm py-1.5 pr-10 pl-2 text-sm outline-hidden transition-colors select-none touch-target-row data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 motion-reduce:transition-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4", className),
|
|
80
80
|
...props,
|
|
81
81
|
children: [/* @__PURE__ */ jsx("span", {
|
|
82
82
|
className: "pointer-events-none absolute inset-y-0 top-1 right-2 flex items-center justify-center",
|
|
@@ -89,21 +89,21 @@ function DropdownMenuLabel({ className, inset, ...props }) {
|
|
|
89
89
|
return /* @__PURE__ */ jsx("div", {
|
|
90
90
|
"data-slot": "dropdown-menu-label",
|
|
91
91
|
"data-inset": inset,
|
|
92
|
-
className: cn("px-2 py-1 text-xs text-gray-light data-[inset=true]:pl-7", className),
|
|
92
|
+
className: cn("px-2 py-1 text-xs text-gray-light data-[inset=true]:pl-7 [[data-high-contrast]_&]:text-gray-a12", className),
|
|
93
93
|
...props
|
|
94
94
|
});
|
|
95
95
|
}
|
|
96
96
|
function DropdownMenuSeparator({ className, ...props }) {
|
|
97
97
|
return /* @__PURE__ */ jsx(Menu.Separator, {
|
|
98
98
|
"data-slot": "dropdown-menu-separator",
|
|
99
|
-
className: cn("-mx-1 my-1 h-px bg-gray-a3", className),
|
|
99
|
+
className: cn("-mx-1 my-1 h-px bg-gray-a3 [[data-high-contrast]_&]:bg-gray-a6", className),
|
|
100
100
|
...props
|
|
101
101
|
});
|
|
102
102
|
}
|
|
103
103
|
function DropdownMenuShortcut({ className, ...props }) {
|
|
104
104
|
return /* @__PURE__ */ jsx("span", {
|
|
105
105
|
"data-slot": "dropdown-menu-shortcut",
|
|
106
|
-
className: cn("ml-auto text-xs tracking-widest text-gray-light", className),
|
|
106
|
+
className: cn("ml-auto text-xs tracking-widest text-gray-light [[data-high-contrast]_&]:text-gray-a12", className),
|
|
107
107
|
...props
|
|
108
108
|
});
|
|
109
109
|
}
|
|
@@ -117,7 +117,7 @@ function DropdownMenuSubTrigger({ className, inset, children, ...props }) {
|
|
|
117
117
|
return /* @__PURE__ */ jsxs(Menu.SubmenuTrigger, {
|
|
118
118
|
"data-slot": "dropdown-menu-sub-trigger",
|
|
119
119
|
"data-inset": inset,
|
|
120
|
-
className: cn("flex min-h-7 cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden transition-colors select-none data-highlighted:bg-gray-a3 data-popup-open:bg-gray-a3 data-[inset=true]:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4", className),
|
|
120
|
+
className: cn("flex min-h-7 cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden transition-colors select-none touch-target-row data-highlighted:bg-gray-a3 data-popup-open:bg-gray-a3 data-[inset=true]:pl-7 motion-reduce:transition-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4", className),
|
|
121
121
|
...props,
|
|
122
122
|
children: [children, /* @__PURE__ */ jsx(ChevronRight, { className: "ml-auto text-sm text-gray-light" })]
|
|
123
123
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropdown-menu.js","names":["MenuPrimitive"],"sources":["../../src/components/dropdown-menu.tsx"],"sourcesContent":["import { Menu as MenuPrimitive } from '@base-ui/react/menu'\nimport { Check, ChevronRight } from '@epilot/spark-icons'\nimport * as React from 'react'\nimport { cn } from '../utils/cn'\n\nfunction DropdownMenu({\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.Root>) {\n return <MenuPrimitive.Root {...props} />\n}\n\nfunction DropdownMenuPortal({\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.Portal>) {\n return <MenuPrimitive.Portal data-slot=\"dropdown-menu-portal\" {...props} />\n}\n\nfunction DropdownMenuTrigger({\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.Trigger>) {\n return <MenuPrimitive.Trigger data-slot=\"dropdown-menu-trigger\" {...props} />\n}\n\ntype DropdownMenuContentProps = React.ComponentProps<\n typeof MenuPrimitive.Popup\n> &\n Pick<\n MenuPrimitive.Positioner.Props,\n 'align' | 'alignOffset' | 'side' | 'sideOffset'\n > & {\n container?: React.ComponentProps<typeof MenuPrimitive.Portal>['container']\n }\n\nfunction DropdownMenuContent({\n className,\n align = 'start',\n alignOffset,\n side,\n sideOffset = 4,\n container,\n ...props\n}: DropdownMenuContentProps) {\n return (\n <MenuPrimitive.Portal container={container}>\n <MenuPrimitive.Positioner\n align={align}\n alignOffset={alignOffset}\n className=\"isolate z-50 outline-none\"\n side={side}\n sideOffset={sideOffset}\n >\n <MenuPrimitive.Popup\n data-slot=\"dropdown-menu-content\"\n className={cn(\n 'z-50 max-h-(--available-height) min-w-40 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg border border-gray-a1 bg-gray-1 p-1 text-gray-a12 shadow-lg outline-none',\n 'transition-[opacity,scale,translate] duration-100 data-ending-style:scale-95 data-ending-style:opacity-0 data-starting-style:scale-95 data-starting-style:opacity-0',\n 'data-[side=bottom]:data-starting-style:-translate-y-2 data-[side=left]:data-starting-style:translate-x-2 data-[side=right]:data-starting-style:-translate-x-2 data-[side=top]:data-starting-style:translate-y-2',\n className,\n )}\n {...props}\n />\n </MenuPrimitive.Positioner>\n </MenuPrimitive.Portal>\n )\n}\n\nfunction DropdownMenuGroup({\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.Group>) {\n return <MenuPrimitive.Group data-slot=\"dropdown-menu-group\" {...props} />\n}\n\nfunction DropdownMenuItem({\n className,\n inset,\n variant = 'default',\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.Item> & {\n inset?: boolean\n variant?: 'default' | 'destructive'\n}) {\n return (\n <MenuPrimitive.Item\n data-slot=\"dropdown-menu-item\"\n data-inset={inset}\n data-variant={variant}\n className={cn(\n 'group/dropdown-menu-item relative flex min-h-7 cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden transition-colors select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 data-[variant=destructive]:text-error data-[variant=destructive]:data-highlighted:bg-base-error-soft [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4',\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuCheckboxItem({\n className,\n children,\n checked,\n inset,\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.CheckboxItem> & {\n inset?: boolean\n}) {\n return (\n <MenuPrimitive.CheckboxItem\n data-slot=\"dropdown-menu-checkbox-item\"\n data-inset={inset}\n className={cn(\n 'relative flex min-h-7 cursor-pointer items-center gap-2 rounded-sm py-1.5 pr-10 pl-2 text-sm outline-hidden transition-colors select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4',\n className,\n )}\n checked={checked}\n {...props}\n >\n <span\n className=\"pointer-events-none absolute inset-y-0 top-1 right-2 flex items-center justify-center\"\n data-slot=\"dropdown-menu-checkbox-item-indicator\"\n >\n <MenuPrimitive.CheckboxItemIndicator>\n <Check className=\"text-sm\" />\n </MenuPrimitive.CheckboxItemIndicator>\n </span>\n {children}\n </MenuPrimitive.CheckboxItem>\n )\n}\n\nfunction DropdownMenuRadioGroup({\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.RadioGroup>) {\n return (\n <MenuPrimitive.RadioGroup\n data-slot=\"dropdown-menu-radio-group\"\n {...props}\n />\n )\n}\n\nfunction DropdownMenuRadioItem({\n className,\n children,\n inset,\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.RadioItem> & {\n inset?: boolean\n}) {\n return (\n <MenuPrimitive.RadioItem\n data-slot=\"dropdown-menu-radio-item\"\n data-inset={inset}\n className={cn(\n 'relative flex min-h-7 cursor-pointer items-center gap-2 rounded-sm py-1.5 pr-10 pl-2 text-sm outline-hidden transition-colors select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4',\n className,\n )}\n {...props}\n >\n <span\n className=\"pointer-events-none absolute inset-y-0 top-1 right-2 flex items-center justify-center\"\n data-slot=\"dropdown-menu-radio-item-indicator\"\n >\n <MenuPrimitive.RadioItemIndicator>\n <Check className=\"text-sm\" />\n </MenuPrimitive.RadioItemIndicator>\n </span>\n {children}\n </MenuPrimitive.RadioItem>\n )\n}\n\n// plain div, not Menu.GroupLabel: Base UI's GroupLabel throws outside a\n// Group, while our labels float freely (radix Label was an unwired div too)\nfunction DropdownMenuLabel({\n className,\n inset,\n ...props\n}: React.ComponentProps<'div'> & {\n inset?: boolean\n}) {\n return (\n <div\n data-slot=\"dropdown-menu-label\"\n data-inset={inset}\n className={cn(\n 'px-2 py-1 text-xs text-gray-light data-[inset=true]:pl-7',\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuSeparator({\n className,\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.Separator>) {\n return (\n <MenuPrimitive.Separator\n data-slot=\"dropdown-menu-separator\"\n className={cn('-mx-1 my-1 h-px bg-gray-a3', className)}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuShortcut({\n className,\n ...props\n}: React.ComponentProps<'span'>) {\n return (\n <span\n data-slot=\"dropdown-menu-shortcut\"\n className={cn(\n 'ml-auto text-xs tracking-widest text-gray-light',\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuSub({\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.SubmenuRoot>) {\n return <MenuPrimitive.SubmenuRoot data-slot=\"dropdown-menu-sub\" {...props} />\n}\n\nfunction DropdownMenuSubTrigger({\n className,\n inset,\n children,\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.SubmenuTrigger> & {\n inset?: boolean\n}) {\n return (\n <MenuPrimitive.SubmenuTrigger\n data-slot=\"dropdown-menu-sub-trigger\"\n data-inset={inset}\n className={cn(\n 'flex min-h-7 cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden transition-colors select-none data-highlighted:bg-gray-a3 data-popup-open:bg-gray-a3 data-[inset=true]:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4',\n className,\n )}\n {...props}\n >\n {children}\n <ChevronRight className=\"ml-auto text-sm text-gray-light\" />\n </MenuPrimitive.SubmenuTrigger>\n )\n}\n\n// composes the public Content; the align/offset defaults visually align the\n// submenu with its parent menu\nfunction DropdownMenuSubContent({\n className,\n ...props\n}: DropdownMenuContentProps) {\n return (\n <DropdownMenuContent\n data-slot=\"dropdown-menu-sub-content\"\n align=\"start\"\n alignOffset={-3}\n side=\"right\"\n sideOffset={0}\n className={cn('w-auto min-w-32', className)}\n {...props}\n />\n )\n}\n\nexport {\n DropdownMenu,\n DropdownMenuCheckboxItem,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuPortal,\n DropdownMenuRadioGroup,\n DropdownMenuRadioItem,\n DropdownMenuSeparator,\n DropdownMenuShortcut,\n DropdownMenuSub,\n DropdownMenuSubContent,\n DropdownMenuSubTrigger,\n DropdownMenuTrigger,\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"dropdown-menu.js","names":["MenuPrimitive"],"sources":["../../src/components/dropdown-menu.tsx"],"sourcesContent":["import { Menu as MenuPrimitive } from '@base-ui/react/menu'\nimport { Check, ChevronRight } from '@epilot/spark-icons'\nimport * as React from 'react'\nimport { cn } from '../utils/cn'\n\nfunction DropdownMenu({\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.Root>) {\n return <MenuPrimitive.Root {...props} />\n}\n\nfunction DropdownMenuPortal({\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.Portal>) {\n return <MenuPrimitive.Portal data-slot=\"dropdown-menu-portal\" {...props} />\n}\n\nfunction DropdownMenuTrigger({\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.Trigger>) {\n return <MenuPrimitive.Trigger data-slot=\"dropdown-menu-trigger\" {...props} />\n}\n\ntype DropdownMenuContentProps = React.ComponentProps<\n typeof MenuPrimitive.Popup\n> &\n Pick<\n MenuPrimitive.Positioner.Props,\n 'align' | 'alignOffset' | 'side' | 'sideOffset'\n > & {\n container?: React.ComponentProps<typeof MenuPrimitive.Portal>['container']\n }\n\nfunction DropdownMenuContent({\n className,\n align = 'start',\n alignOffset,\n side,\n sideOffset = 4,\n container,\n ...props\n}: DropdownMenuContentProps) {\n return (\n <MenuPrimitive.Portal container={container}>\n <MenuPrimitive.Positioner\n align={align}\n alignOffset={alignOffset}\n className=\"isolate z-50 outline-none\"\n side={side}\n sideOffset={sideOffset}\n >\n <MenuPrimitive.Popup\n data-slot=\"dropdown-menu-content\"\n className={cn(\n 'z-50 max-h-(--available-height) min-w-40 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg border border-gray-a1 bg-gray-1 p-1 text-gray-a12 shadow-lg outline-none [[data-high-contrast]_&]:border-gray-a11',\n 'transition-[opacity,scale,translate] duration-100 data-ending-style:scale-95 data-ending-style:opacity-0 data-starting-style:scale-95 data-starting-style:opacity-0 motion-reduce:transition-none',\n 'data-[side=bottom]:data-starting-style:-translate-y-2 data-[side=left]:data-starting-style:translate-x-2 data-[side=right]:data-starting-style:-translate-x-2 data-[side=top]:data-starting-style:translate-y-2',\n className,\n )}\n {...props}\n />\n </MenuPrimitive.Positioner>\n </MenuPrimitive.Portal>\n )\n}\n\nfunction DropdownMenuGroup({\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.Group>) {\n return <MenuPrimitive.Group data-slot=\"dropdown-menu-group\" {...props} />\n}\n\nfunction DropdownMenuItem({\n className,\n inset,\n variant = 'default',\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.Item> & {\n inset?: boolean\n variant?: 'default' | 'destructive'\n}) {\n return (\n <MenuPrimitive.Item\n data-slot=\"dropdown-menu-item\"\n data-inset={inset}\n data-variant={variant}\n className={cn(\n 'group/dropdown-menu-item relative flex min-h-7 cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden transition-colors select-none touch-target-row data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 data-[variant=destructive]:text-error data-[variant=destructive]:data-highlighted:bg-base-error-soft motion-reduce:transition-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4',\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuCheckboxItem({\n className,\n children,\n checked,\n inset,\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.CheckboxItem> & {\n inset?: boolean\n}) {\n return (\n <MenuPrimitive.CheckboxItem\n data-slot=\"dropdown-menu-checkbox-item\"\n data-inset={inset}\n className={cn(\n 'relative flex min-h-7 cursor-pointer items-center gap-2 rounded-sm py-1.5 pr-10 pl-2 text-sm outline-hidden transition-colors select-none touch-target-row data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 motion-reduce:transition-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4',\n className,\n )}\n checked={checked}\n {...props}\n >\n <span\n className=\"pointer-events-none absolute inset-y-0 top-1 right-2 flex items-center justify-center\"\n data-slot=\"dropdown-menu-checkbox-item-indicator\"\n >\n <MenuPrimitive.CheckboxItemIndicator>\n <Check className=\"text-sm\" />\n </MenuPrimitive.CheckboxItemIndicator>\n </span>\n {children}\n </MenuPrimitive.CheckboxItem>\n )\n}\n\nfunction DropdownMenuRadioGroup({\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.RadioGroup>) {\n return (\n <MenuPrimitive.RadioGroup\n data-slot=\"dropdown-menu-radio-group\"\n {...props}\n />\n )\n}\n\nfunction DropdownMenuRadioItem({\n className,\n children,\n inset,\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.RadioItem> & {\n inset?: boolean\n}) {\n return (\n <MenuPrimitive.RadioItem\n data-slot=\"dropdown-menu-radio-item\"\n data-inset={inset}\n className={cn(\n 'relative flex min-h-7 cursor-pointer items-center gap-2 rounded-sm py-1.5 pr-10 pl-2 text-sm outline-hidden transition-colors select-none touch-target-row data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-gray-a3 data-[inset=true]:pl-7 motion-reduce:transition-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4',\n className,\n )}\n {...props}\n >\n <span\n className=\"pointer-events-none absolute inset-y-0 top-1 right-2 flex items-center justify-center\"\n data-slot=\"dropdown-menu-radio-item-indicator\"\n >\n <MenuPrimitive.RadioItemIndicator>\n <Check className=\"text-sm\" />\n </MenuPrimitive.RadioItemIndicator>\n </span>\n {children}\n </MenuPrimitive.RadioItem>\n )\n}\n\n// plain div, not Menu.GroupLabel: Base UI's GroupLabel throws outside a\n// Group, while our labels float freely (radix Label was an unwired div too)\nfunction DropdownMenuLabel({\n className,\n inset,\n ...props\n}: React.ComponentProps<'div'> & {\n inset?: boolean\n}) {\n return (\n <div\n data-slot=\"dropdown-menu-label\"\n data-inset={inset}\n className={cn(\n 'px-2 py-1 text-xs text-gray-light data-[inset=true]:pl-7 [[data-high-contrast]_&]:text-gray-a12',\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuSeparator({\n className,\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.Separator>) {\n return (\n <MenuPrimitive.Separator\n data-slot=\"dropdown-menu-separator\"\n className={cn(\n '-mx-1 my-1 h-px bg-gray-a3 [[data-high-contrast]_&]:bg-gray-a6',\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuShortcut({\n className,\n ...props\n}: React.ComponentProps<'span'>) {\n return (\n <span\n data-slot=\"dropdown-menu-shortcut\"\n className={cn(\n 'ml-auto text-xs tracking-widest text-gray-light [[data-high-contrast]_&]:text-gray-a12',\n className,\n )}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuSub({\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.SubmenuRoot>) {\n return <MenuPrimitive.SubmenuRoot data-slot=\"dropdown-menu-sub\" {...props} />\n}\n\nfunction DropdownMenuSubTrigger({\n className,\n inset,\n children,\n ...props\n}: React.ComponentProps<typeof MenuPrimitive.SubmenuTrigger> & {\n inset?: boolean\n}) {\n return (\n <MenuPrimitive.SubmenuTrigger\n data-slot=\"dropdown-menu-sub-trigger\"\n data-inset={inset}\n className={cn(\n 'flex min-h-7 cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden transition-colors select-none touch-target-row data-highlighted:bg-gray-a3 data-popup-open:bg-gray-a3 data-[inset=true]:pl-7 motion-reduce:transition-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=size-])]:size-4',\n className,\n )}\n {...props}\n >\n {children}\n <ChevronRight className=\"ml-auto text-sm text-gray-light\" />\n </MenuPrimitive.SubmenuTrigger>\n )\n}\n\n// composes the public Content; the align/offset defaults visually align the\n// submenu with its parent menu\nfunction DropdownMenuSubContent({\n className,\n ...props\n}: DropdownMenuContentProps) {\n return (\n <DropdownMenuContent\n data-slot=\"dropdown-menu-sub-content\"\n align=\"start\"\n alignOffset={-3}\n side=\"right\"\n sideOffset={0}\n className={cn('w-auto min-w-32', className)}\n {...props}\n />\n )\n}\n\nexport {\n DropdownMenu,\n DropdownMenuCheckboxItem,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuPortal,\n DropdownMenuRadioGroup,\n DropdownMenuRadioItem,\n DropdownMenuSeparator,\n DropdownMenuShortcut,\n DropdownMenuSub,\n DropdownMenuSubContent,\n DropdownMenuSubTrigger,\n DropdownMenuTrigger,\n}\n"],"mappings":"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"}
|
|
@@ -6,9 +6,9 @@ const require_components_button = require("./button.cjs");
|
|
|
6
6
|
const require_components_input_group = require("./input-group.cjs");
|
|
7
7
|
const require_components_calendar = require("./calendar.cjs");
|
|
8
8
|
const require_components_popover = require("./popover.cjs");
|
|
9
|
+
let _epilot_spark_icons = require("@epilot/spark-icons");
|
|
9
10
|
let react = require("react");
|
|
10
11
|
react = require_chunk.__toESM(react);
|
|
11
|
-
let _epilot_spark_icons = require("@epilot/spark-icons");
|
|
12
12
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
13
13
|
let ictus = require("ictus");
|
|
14
14
|
let cnfast = require("cnfast");
|
|
@@ -5,8 +5,8 @@ import { Button } from "./button.js";
|
|
|
5
5
|
import { InputGroup, InputGroupAddon, InputGroupInput } from "./input-group.js";
|
|
6
6
|
import { Calendar } from "./calendar.js";
|
|
7
7
|
import { Popover, PopoverAnchor, PopoverContent, PopoverTrigger } from "./popover.js";
|
|
8
|
-
import * as React$1 from "react";
|
|
9
8
|
import { CalendarMonth } from "@epilot/spark-icons";
|
|
9
|
+
import * as React$1 from "react";
|
|
10
10
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
11
11
|
import { apply, formatDate, isDateMaskKey, parseDate } from "ictus";
|
|
12
12
|
//#region src/components/input-date.tsx
|
|
@@ -10,7 +10,7 @@ declare function InputGroup({
|
|
|
10
10
|
...props
|
|
11
11
|
}: React$1.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
|
|
12
12
|
declare const inputGroupAddonVariants: (props?: ({
|
|
13
|
-
align?: "inline-
|
|
13
|
+
align?: "inline-end" | "inline-start" | null | undefined;
|
|
14
14
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
15
15
|
declare function InputGroupAddon({
|
|
16
16
|
className,
|
|
@@ -10,7 +10,7 @@ declare function InputGroup({
|
|
|
10
10
|
...props
|
|
11
11
|
}: React$1.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
|
|
12
12
|
declare const inputGroupAddonVariants: (props?: ({
|
|
13
|
-
align?: "inline-
|
|
13
|
+
align?: "inline-end" | "inline-start" | null | undefined;
|
|
14
14
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
15
15
|
declare function InputGroupAddon({
|
|
16
16
|
className,
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
3
|
const require_chunk = require("../chunk-DY84GLCh.cjs");
|
|
4
|
-
const require_hooks_use_chart_zoom = require("../hooks/use-chart-zoom.cjs");
|
|
5
4
|
const require_hooks_use_reduced_motion = require("../hooks/use-reduced-motion.cjs");
|
|
6
5
|
const require_utils_format = require("../utils/format.cjs");
|
|
7
6
|
const require_utils_chart_scale = require("../utils/chart-scale.cjs");
|
|
8
7
|
const require_components_chart = require("./chart.cjs");
|
|
8
|
+
const require_hooks_use_chart_zoom = require("../hooks/use-chart-zoom.cjs");
|
|
9
9
|
const require_utils_chart_time_ticks = require("../utils/chart-time-ticks.cjs");
|
|
10
10
|
let react = require("react");
|
|
11
11
|
react = require_chunk.__toESM(react);
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { useAnimatedChartDomain, useChartZoom } from "../hooks/use-chart-zoom.js";
|
|
3
|
-
import { useReducedMotion } from "../hooks/use-reduced-motion.js";
|
|
4
2
|
import { cn } from "../utils/cn.js";
|
|
3
|
+
import { useReducedMotion } from "../hooks/use-reduced-motion.js";
|
|
5
4
|
import { localeNumberFormat } from "../utils/format.js";
|
|
6
5
|
import { buildYAxisScale, formatYAxisTick } from "../utils/chart-scale.js";
|
|
7
6
|
import { ChartTooltipCard, ChartZoomResetButton, clampTooltipPosition, useMeasuredSize } from "./chart.js";
|
|
7
|
+
import { useAnimatedChartDomain, useChartZoom } from "../hooks/use-chart-zoom.js";
|
|
8
8
|
import { buildTimeTicks } from "../utils/chart-time-ticks.js";
|
|
9
9
|
import * as React$1 from "react";
|
|
10
10
|
import { useCallback, useMemo } from "react";
|
package/dist/components/list.cjs
CHANGED
|
@@ -31,8 +31,8 @@ function List({ className, variant = "soft", color = "neutral", radius = "lg", g
|
|
|
31
31
|
style: {
|
|
32
32
|
"--list-gap-steps": gap,
|
|
33
33
|
...variant === "solid" && {
|
|
34
|
-
"--list-item-fg": color === "accent" ? "var(--spark-contrast)" : "var(--neutral-
|
|
35
|
-
"--list-item-fg-muted": color === "accent" ? "var(--spark-contrast)" : "var(--neutral-
|
|
34
|
+
"--list-item-fg": color === "accent" ? "var(--spark-contrast)" : "var(--neutral-12)",
|
|
35
|
+
"--list-item-fg-muted": color === "accent" ? "var(--spark-contrast)" : "var(--neutral-12)"
|
|
36
36
|
},
|
|
37
37
|
...style
|
|
38
38
|
},
|