@bearmenu/ui 0.8.24 → 0.8.26
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/{chunk-5LTILG3L.js → chunk-5HHRVJOT.js} +14 -1
- package/dist/{chunk-SDWN6L4O.js → chunk-AHHDC7ML.js} +1 -1
- package/dist/{chunk-I4RUOAU7.js → chunk-AHL45DD2.js} +11 -38
- package/dist/{chunk-TIQNM4XD.js → chunk-F3XK34DV.js} +25 -1
- package/dist/{chunk-5XREWOBB.js → chunk-IEIJP73R.js} +14 -1
- package/dist/chunk-L3CDXVEP.js +56 -0
- package/dist/{chunk-BKKQ7GCZ.js → chunk-QG6I2ILT.js} +1 -1
- package/dist/{chunk-CZK2MRS2.js → chunk-VEFKZIK6.js} +13 -3
- package/dist/components/alert-dialog.js +1 -1
- package/dist/components/badge.d.ts +1 -1
- package/dist/components/badge.js +1 -1
- package/dist/components/banner.d.ts +36 -0
- package/dist/components/banner.js +29 -0
- package/dist/components/booking-row.d.ts +60 -0
- package/dist/components/booking-row.js +103 -0
- package/dist/components/booking-summary-card.d.ts +38 -0
- package/dist/components/booking-summary-card.js +67 -0
- package/dist/components/button.d.ts +2 -2
- package/dist/components/button.js +1 -1
- package/dist/components/calendar.d.ts +17 -3
- package/dist/components/calendar.js +100 -12
- package/dist/components/carousel.js +1 -1
- package/dist/components/checkbox.d.ts +9 -2
- package/dist/components/checkbox.js +1 -1
- package/dist/components/coach-marks.js +1 -1
- package/dist/components/combobox.js +1 -1
- package/dist/components/concept-convergence.js +2 -2
- package/dist/components/currency-input.js +1 -1
- package/dist/components/date-input.js +1 -1
- package/dist/components/drift-rail.d.ts +2 -29
- package/dist/components/drift-rail.js +1 -3
- package/dist/components/empty-state.js +1 -1
- package/dist/components/event-card.js +1 -1
- package/dist/components/event-compact-row.js +1 -1
- package/dist/components/event-detail-panel.js +2 -2
- package/dist/components/event-index-row.js +1 -1
- package/dist/components/event-list-row-wide.js +3 -3
- package/dist/components/event-list-row.js +2 -2
- package/dist/components/field.d.ts +15 -1
- package/dist/components/field.js +62 -21
- package/dist/components/filter-category-row.js +1 -1
- package/dist/components/hold-countdown.d.ts +43 -0
- package/dist/components/hold-countdown.js +90 -0
- package/dist/components/input.d.ts +1 -0
- package/dist/components/input.js +1 -1
- package/dist/components/link-button.js +1 -1
- package/dist/components/menu-family-block.js +1 -1
- package/dist/components/menu-index-list.js +1 -1
- package/dist/components/menu-item.js +3 -3
- package/dist/components/motion-icon-set.d.ts +2 -1
- package/dist/components/motion-icon-set.js +27 -1
- package/dist/components/multi-select-combobox.js +3 -3
- package/dist/components/multi-select-menu.js +1 -1
- package/dist/components/pagination.js +1 -1
- package/dist/components/party-counter.d.ts +36 -0
- package/dist/components/party-counter.js +61 -0
- package/dist/components/place-card.js +1 -1
- package/dist/components/place-details-mobile.js +1 -1
- package/dist/components/poster-tape.d.ts +2 -15
- package/dist/components/poster-tape.js +3 -12
- package/dist/components/searchable-select.js +1 -1
- package/dist/components/signature-chip.js +2 -2
- package/dist/components/sliding-panels.js +1 -1
- package/dist/components/textarea.d.ts +10 -3
- package/dist/components/textarea.js +21 -6
- package/dist/components/time-slot.d.ts +73 -0
- package/dist/components/time-slot.js +106 -0
- package/dist/components/toggle-group.js +15 -2
- package/dist/components/toggle.d.ts +1 -1
- package/dist/components/toggle.js +1 -1
- package/dist/components/top-ranking-entry.js +3 -3
- package/dist/components/weekday-chip.d.ts +33 -0
- package/dist/components/weekday-chip.js +48 -0
- package/package.json +207 -23
- package/src/components/badge.stories.tsx +17 -0
- package/src/components/badge.tsx +15 -0
- package/src/components/banner.stories.tsx +36 -0
- package/src/components/banner.tsx +58 -0
- package/src/components/booking-details-primitives.test.tsx +75 -0
- package/src/components/booking-primitives.test.tsx +180 -0
- package/src/components/booking-row.stories.tsx +66 -0
- package/src/components/booking-row.tsx +168 -0
- package/src/components/booking-summary-card.stories.tsx +41 -0
- package/src/components/booking-summary-card.tsx +109 -0
- package/src/components/button.stories.tsx +23 -0
- package/src/components/button.tsx +13 -0
- package/src/components/calendar.stories.tsx +27 -0
- package/src/components/calendar.tsx +110 -3
- package/src/components/checkbox.tsx +49 -23
- package/src/components/drift-rail.stories.tsx +1 -29
- package/src/components/drift-rail.tsx +4 -71
- package/src/components/field.stories.tsx +51 -1
- package/src/components/field.tsx +68 -9
- package/src/components/hold-countdown.stories.tsx +68 -0
- package/src/components/hold-countdown.tsx +140 -0
- package/src/components/input.tsx +13 -2
- package/src/components/motion-icon-set.stories.tsx +2 -0
- package/src/components/motion-icon-set.tsx +42 -0
- package/src/components/party-counter.stories.tsx +57 -0
- package/src/components/party-counter.tsx +93 -0
- package/src/components/poster-tape.stories.tsx +0 -29
- package/src/components/poster-tape.tsx +5 -21
- package/src/components/textarea.tsx +25 -7
- package/src/components/time-slot.stories.tsx +85 -0
- package/src/components/time-slot.tsx +186 -0
- package/src/components/toggle-group.stories.tsx +27 -0
- package/src/components/toggle-group.tsx +14 -1
- package/src/components/toggle.tsx +24 -0
- package/src/components/weekday-chip.stories.tsx +54 -0
- package/src/components/weekday-chip.tsx +75 -0
- package/dist/chunk-NMEVJT5Q.js +0 -26
- package/src/components/drift-rail.test.tsx +0 -125
- package/src/components/poster-tape.test.tsx +0 -42
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
import { cn } from '../chunk-FEK5XGZW.js';
|
|
2
|
+
import '../chunk-MMUBH76A.js';
|
|
3
|
+
import { CalendarDays, Clock, MapPin } from 'lucide-react';
|
|
4
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
5
|
+
|
|
6
|
+
function Row({ icon, children }) {
|
|
7
|
+
return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2.5 text-[13px] leading-4 text-ink-secondary [&+&]:mt-[7px]", children: [
|
|
8
|
+
/* @__PURE__ */ jsx("span", { className: "flex w-4 shrink-0 justify-center text-muted-foreground", "aria-hidden": true, children: icon }),
|
|
9
|
+
/* @__PURE__ */ jsx("span", { children })
|
|
10
|
+
] });
|
|
11
|
+
}
|
|
12
|
+
var ICON = "size-3.5 [stroke-width:1.8]";
|
|
13
|
+
function SeatIcon({ className }) {
|
|
14
|
+
return /* @__PURE__ */ jsxs(
|
|
15
|
+
"svg",
|
|
16
|
+
{
|
|
17
|
+
viewBox: "0 0 24 24",
|
|
18
|
+
fill: "none",
|
|
19
|
+
stroke: "currentColor",
|
|
20
|
+
strokeLinecap: "round",
|
|
21
|
+
strokeLinejoin: "round",
|
|
22
|
+
className,
|
|
23
|
+
"aria-hidden": true,
|
|
24
|
+
children: [
|
|
25
|
+
/* @__PURE__ */ jsx("path", { d: "M5 11V7a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v4" }),
|
|
26
|
+
/* @__PURE__ */ jsx("path", { d: "M5 11a2 2 0 0 0 0 4h14a2 2 0 0 0 0-4" }),
|
|
27
|
+
/* @__PURE__ */ jsx("path", { d: "M6 15v3M18 15v3M7 15h10" })
|
|
28
|
+
]
|
|
29
|
+
}
|
|
30
|
+
);
|
|
31
|
+
}
|
|
32
|
+
function BookingSummaryCard({
|
|
33
|
+
venueName,
|
|
34
|
+
date,
|
|
35
|
+
timeAndParty,
|
|
36
|
+
seating,
|
|
37
|
+
address,
|
|
38
|
+
code,
|
|
39
|
+
labels,
|
|
40
|
+
className
|
|
41
|
+
}) {
|
|
42
|
+
return /* @__PURE__ */ jsxs(
|
|
43
|
+
"div",
|
|
44
|
+
{
|
|
45
|
+
"data-slot": "booking-summary-card",
|
|
46
|
+
className: cn(
|
|
47
|
+
"rounded-[14px] border border-border bg-card p-[15px] leading-[1.2] shadow-[0_1px_3px_oklch(0.5_0_0/0.1)]",
|
|
48
|
+
className
|
|
49
|
+
),
|
|
50
|
+
children: [
|
|
51
|
+
/* @__PURE__ */ jsx("b", { className: "text-base leading-5 font-bold text-foreground", children: venueName }),
|
|
52
|
+
/* @__PURE__ */ jsxs("div", { className: "mt-[11px]", children: [
|
|
53
|
+
/* @__PURE__ */ jsx(Row, { icon: /* @__PURE__ */ jsx(CalendarDays, { className: ICON }), children: date }),
|
|
54
|
+
/* @__PURE__ */ jsx(Row, { icon: /* @__PURE__ */ jsx(Clock, { className: ICON }), children: timeAndParty }),
|
|
55
|
+
seating && /* @__PURE__ */ jsx(Row, { icon: /* @__PURE__ */ jsx(SeatIcon, { className: ICON }), children: seating }),
|
|
56
|
+
address && /* @__PURE__ */ jsx(Row, { icon: /* @__PURE__ */ jsx(MapPin, { className: ICON }), children: address })
|
|
57
|
+
] }),
|
|
58
|
+
/* @__PURE__ */ jsxs("div", { className: "mt-[13px] flex items-center justify-between border-t border-line-soft pt-[13px]", children: [
|
|
59
|
+
/* @__PURE__ */ jsx("span", { className: "text-[10.5px] tracking-[0.05em] text-muted-foreground uppercase", children: labels.code }),
|
|
60
|
+
/* @__PURE__ */ jsx("b", { className: "font-mono text-[15px] font-bold tabular-nums text-foreground", children: code })
|
|
61
|
+
] })
|
|
62
|
+
]
|
|
63
|
+
}
|
|
64
|
+
);
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
export { BookingSummaryCard };
|
|
@@ -3,8 +3,8 @@ import * as React from 'react';
|
|
|
3
3
|
import { VariantProps } from 'class-variance-authority';
|
|
4
4
|
|
|
5
5
|
declare const buttonVariants: (props?: ({
|
|
6
|
-
variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | "glass" | "overlay" | "ink" | "brown" | "warning" | null | undefined;
|
|
7
|
-
size?: "default" | "xs" | "sm" | "lg" | "pill" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
|
|
6
|
+
variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | "glass" | "overlay" | "ink" | "brown" | "warning" | "cta" | null | undefined;
|
|
7
|
+
size?: "default" | "cta" | "xs" | "sm" | "lg" | "pill" | "cta-sm" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
|
|
8
8
|
fullWidth?: boolean | null | undefined;
|
|
9
9
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
10
10
|
interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
|
|
@@ -1,13 +1,27 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
import * as React from 'react';
|
|
3
|
-
import {
|
|
3
|
+
import { DayButton, DayPicker } from 'react-day-picker';
|
|
4
4
|
import { Button } from './button.js';
|
|
5
5
|
import 'class-variance-authority/types';
|
|
6
6
|
import 'class-variance-authority';
|
|
7
7
|
|
|
8
|
-
|
|
8
|
+
/**
|
|
9
|
+
* `appearance="booking"` is the month grid of the booking flow's "When are you
|
|
10
|
+
* coming?" (desktop), measured from its design (`.cal`): seven equal columns
|
|
11
|
+
* 3px apart; single-letter weekdays at 9.5px bold, muted; days as 32px round
|
|
12
|
+
* cells in mono 12.5px medium, secondary ink; the chosen day filled with
|
|
13
|
+
* `--gradient-primary`, white and bold; past days at 30%; a day the venue is
|
|
14
|
+
* closed struck through in a lighter ink. No outside days. Mark closed days
|
|
15
|
+
* with `modifiers={{ closed: … }}` — the appearance styles the `closed`
|
|
16
|
+
* modifier; `disabled` covers past days and the booking window.
|
|
17
|
+
*/
|
|
18
|
+
type CalendarAppearance = "default" | "booking";
|
|
19
|
+
declare function Calendar({ className, classNames, showOutsideDays, captionLayout, buttonVariant, appearance, formatters, components, modifiersClassNames, ...props }: React.ComponentProps<typeof DayPicker> & {
|
|
9
20
|
buttonVariant?: React.ComponentProps<typeof Button>["variant"];
|
|
21
|
+
appearance?: CalendarAppearance;
|
|
10
22
|
}): react_jsx_runtime.JSX.Element;
|
|
11
23
|
declare function CalendarDayButton({ className, day, modifiers, ...props }: React.ComponentProps<typeof DayButton>): react_jsx_runtime.JSX.Element;
|
|
24
|
+
/** The booking appearance's day: a 32px round cell, see `BOOKING_CLASSNAMES`. */
|
|
25
|
+
declare function BookingDayButton({ className, day, modifiers, ...props }: React.ComponentProps<typeof DayButton>): react_jsx_runtime.JSX.Element;
|
|
12
26
|
|
|
13
|
-
export { Calendar, CalendarDayButton };
|
|
27
|
+
export { BookingDayButton, Calendar, CalendarDayButton };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { buttonVariants, Button } from '../chunk-
|
|
1
|
+
import { buttonVariants, Button } from '../chunk-5HHRVJOT.js';
|
|
2
2
|
import '../chunk-RIH2IS7X.js';
|
|
3
3
|
import '../chunk-5YNIQ2BL.js';
|
|
4
4
|
import { cn } from '../chunk-FEK5XGZW.js';
|
|
@@ -8,29 +8,80 @@ import { ChevronLeftIcon, ChevronRightIcon, ChevronDownIcon } from 'lucide-react
|
|
|
8
8
|
import { getDefaultClassNames, DayPicker } from 'react-day-picker';
|
|
9
9
|
import { jsx } from 'react/jsx-runtime';
|
|
10
10
|
|
|
11
|
+
var BOOKING_CLASSNAMES = {
|
|
12
|
+
root: "w-full",
|
|
13
|
+
months: "relative flex flex-col",
|
|
14
|
+
month: "flex w-full flex-col",
|
|
15
|
+
// The caption row is 15px with 7px under it; the chevrons sit in that row.
|
|
16
|
+
nav: "absolute inset-x-0 top-0 flex h-[15px] w-full items-center justify-between",
|
|
17
|
+
button_previous: "grid size-6 -m-[4.5px] cursor-pointer place-items-center rounded-full text-muted-foreground hover:bg-surface-2 hover:text-foreground aria-disabled:pointer-events-none aria-disabled:opacity-30 [&_svg]:size-3.5",
|
|
18
|
+
button_next: "grid size-6 -m-[4.5px] cursor-pointer place-items-center rounded-full text-muted-foreground hover:bg-surface-2 hover:text-foreground aria-disabled:pointer-events-none aria-disabled:opacity-30 [&_svg]:size-3.5",
|
|
19
|
+
month_caption: "mb-[7px] flex h-[15px] w-full items-center justify-center",
|
|
20
|
+
caption_label: "text-[12.5px] leading-[15px] font-bold text-foreground select-none",
|
|
21
|
+
month_grid: "w-full border-collapse",
|
|
22
|
+
weekdays: "grid grid-cols-7 gap-[3px]",
|
|
23
|
+
weekday: "pb-[3px] text-center text-[9.5px] font-bold text-muted-foreground select-none",
|
|
24
|
+
week: "mt-[3px] grid grid-cols-7 gap-[3px]",
|
|
25
|
+
day: "p-0 text-center select-none",
|
|
26
|
+
today: "",
|
|
27
|
+
outside: "invisible",
|
|
28
|
+
disabled: "",
|
|
29
|
+
hidden: "invisible"
|
|
30
|
+
};
|
|
11
31
|
function Calendar(_a) {
|
|
12
32
|
var _b = _a, {
|
|
13
33
|
className,
|
|
14
34
|
classNames,
|
|
15
|
-
showOutsideDays
|
|
35
|
+
showOutsideDays,
|
|
16
36
|
captionLayout = "label",
|
|
17
37
|
buttonVariant = "ghost",
|
|
38
|
+
appearance = "default",
|
|
18
39
|
formatters,
|
|
19
|
-
components
|
|
40
|
+
components,
|
|
41
|
+
modifiersClassNames
|
|
20
42
|
} = _b, props = __objRest(_b, [
|
|
21
43
|
"className",
|
|
22
44
|
"classNames",
|
|
23
45
|
"showOutsideDays",
|
|
24
46
|
"captionLayout",
|
|
25
47
|
"buttonVariant",
|
|
48
|
+
"appearance",
|
|
26
49
|
"formatters",
|
|
27
|
-
"components"
|
|
50
|
+
"components",
|
|
51
|
+
"modifiersClassNames"
|
|
28
52
|
]);
|
|
29
53
|
const defaultClassNames = getDefaultClassNames();
|
|
54
|
+
if (appearance === "booking") {
|
|
55
|
+
return /* @__PURE__ */ jsx(
|
|
56
|
+
DayPicker,
|
|
57
|
+
__spreadValues({
|
|
58
|
+
showOutsideDays: showOutsideDays != null ? showOutsideDays : false,
|
|
59
|
+
className: cn("group/calendar w-full", className),
|
|
60
|
+
captionLayout: "label",
|
|
61
|
+
formatters: __spreadValues({
|
|
62
|
+
formatWeekdayName: (date) => date.toLocaleString("default", { weekday: "narrow" })
|
|
63
|
+
}, formatters),
|
|
64
|
+
classNames: __spreadValues(__spreadValues({}, BOOKING_CLASSNAMES), classNames),
|
|
65
|
+
modifiersClassNames: __spreadValues({ closed: "is-closed" }, modifiersClassNames),
|
|
66
|
+
components: __spreadValues({
|
|
67
|
+
Root: (_a2) => {
|
|
68
|
+
var _b2 = _a2, { className: className2, rootRef } = _b2, rootProps = __objRest(_b2, ["className", "rootRef"]);
|
|
69
|
+
return /* @__PURE__ */ jsx("div", __spreadValues({ "data-slot": "calendar", "data-appearance": "booking", ref: rootRef, className: cn(className2) }, rootProps));
|
|
70
|
+
},
|
|
71
|
+
Chevron: (_c) => {
|
|
72
|
+
var _d = _c, { className: className2, orientation } = _d, chevronProps = __objRest(_d, ["className", "orientation"]);
|
|
73
|
+
return orientation === "left" ? /* @__PURE__ */ jsx(ChevronLeftIcon, __spreadValues({ className: cn("size-4", className2) }, chevronProps)) : /* @__PURE__ */ jsx(ChevronRightIcon, __spreadValues({ className: cn("size-4", className2) }, chevronProps));
|
|
74
|
+
},
|
|
75
|
+
DayButton: BookingDayButton
|
|
76
|
+
}, components)
|
|
77
|
+
}, props)
|
|
78
|
+
);
|
|
79
|
+
}
|
|
30
80
|
return /* @__PURE__ */ jsx(
|
|
31
81
|
DayPicker,
|
|
32
82
|
__spreadValues({
|
|
33
|
-
showOutsideDays,
|
|
83
|
+
showOutsideDays: showOutsideDays != null ? showOutsideDays : true,
|
|
84
|
+
modifiersClassNames,
|
|
34
85
|
className: cn(
|
|
35
86
|
"group/calendar bg-background p-3 [--cell-size:--spacing(9)] [[data-slot=card-content]_&]:bg-transparent [[data-slot=popover-content]_&]:bg-transparent",
|
|
36
87
|
String.raw`rtl:**:[.rdp-button\_next>svg]:rotate-180`,
|
|
@@ -109,12 +160,12 @@ function Calendar(_a) {
|
|
|
109
160
|
hidden: cn("invisible", defaultClassNames.hidden)
|
|
110
161
|
}, classNames),
|
|
111
162
|
components: __spreadValues({
|
|
112
|
-
Root: (
|
|
113
|
-
var
|
|
163
|
+
Root: (_e) => {
|
|
164
|
+
var _f = _e, { className: className2, rootRef } = _f, props2 = __objRest(_f, ["className", "rootRef"]);
|
|
114
165
|
return /* @__PURE__ */ jsx("div", __spreadValues({ "data-slot": "calendar", ref: rootRef, className: cn(className2) }, props2));
|
|
115
166
|
},
|
|
116
|
-
Chevron: (
|
|
117
|
-
var
|
|
167
|
+
Chevron: (_g) => {
|
|
168
|
+
var _h = _g, { className: className2, orientation } = _h, props2 = __objRest(_h, ["className", "orientation"]);
|
|
118
169
|
if (orientation === "left") {
|
|
119
170
|
return /* @__PURE__ */ jsx(ChevronLeftIcon, __spreadValues({ className: cn("size-4", className2) }, props2));
|
|
120
171
|
}
|
|
@@ -124,8 +175,8 @@ function Calendar(_a) {
|
|
|
124
175
|
return /* @__PURE__ */ jsx(ChevronDownIcon, __spreadValues({ className: cn("size-4", className2) }, props2));
|
|
125
176
|
},
|
|
126
177
|
DayButton: CalendarDayButton,
|
|
127
|
-
WeekNumber: (
|
|
128
|
-
var
|
|
178
|
+
WeekNumber: (_i) => {
|
|
179
|
+
var _j = _i, { children } = _j, props2 = __objRest(_j, ["children"]);
|
|
129
180
|
return /* @__PURE__ */ jsx("td", __spreadProps(__spreadValues({}, props2), { children: /* @__PURE__ */ jsx("div", { className: "flex size-(--cell-size) items-center justify-center text-center", children }) }));
|
|
130
181
|
}
|
|
131
182
|
}, components)
|
|
@@ -167,5 +218,42 @@ function CalendarDayButton(_a) {
|
|
|
167
218
|
}, props)
|
|
168
219
|
);
|
|
169
220
|
}
|
|
221
|
+
function BookingDayButton(_a) {
|
|
222
|
+
var _b = _a, {
|
|
223
|
+
className,
|
|
224
|
+
day,
|
|
225
|
+
modifiers
|
|
226
|
+
} = _b, props = __objRest(_b, [
|
|
227
|
+
"className",
|
|
228
|
+
"day",
|
|
229
|
+
"modifiers"
|
|
230
|
+
]);
|
|
231
|
+
const ref = React.useRef(null);
|
|
232
|
+
React.useEffect(() => {
|
|
233
|
+
var _a2;
|
|
234
|
+
if (modifiers.focused) (_a2 = ref.current) == null ? void 0 : _a2.focus();
|
|
235
|
+
}, [modifiers.focused]);
|
|
236
|
+
const closed = Boolean(modifiers.closed);
|
|
237
|
+
return /* @__PURE__ */ jsx(
|
|
238
|
+
"button",
|
|
239
|
+
__spreadValues({
|
|
240
|
+
ref,
|
|
241
|
+
type: "button",
|
|
242
|
+
"data-day": day.date.toLocaleDateString(),
|
|
243
|
+
"data-selected": modifiers.selected || void 0,
|
|
244
|
+
"data-closed": closed || void 0,
|
|
245
|
+
className: cn(
|
|
246
|
+
"grid h-8 w-full cursor-pointer place-items-center rounded-full font-mono text-[12.5px] leading-none font-medium text-ink-secondary tabular-nums",
|
|
247
|
+
"transition-colors duration-150 hover:bg-surface-2 motion-reduce:transition-none",
|
|
248
|
+
"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1 focus-visible:ring-offset-background",
|
|
249
|
+
modifiers.selected && "bg-[image:var(--gradient-primary)] font-bold text-white hover:bg-transparent hover:brightness-[0.94]",
|
|
250
|
+
modifiers.disabled && !closed && "cursor-not-allowed opacity-30 hover:bg-transparent",
|
|
251
|
+
// A closed day is also disabled; it reads as closed, not as past.
|
|
252
|
+
closed && "cursor-not-allowed text-[oklch(0.7_0_0)] line-through hover:bg-transparent dark:text-ink-tertiary",
|
|
253
|
+
className
|
|
254
|
+
)
|
|
255
|
+
}, props)
|
|
256
|
+
);
|
|
257
|
+
}
|
|
170
258
|
|
|
171
|
-
export { Calendar, CalendarDayButton };
|
|
259
|
+
export { BookingDayButton, Calendar, CalendarDayButton };
|
|
@@ -1,6 +1,13 @@
|
|
|
1
|
+
import * as class_variance_authority_types from 'class-variance-authority/types';
|
|
1
2
|
import * as React from 'react';
|
|
2
3
|
import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
|
|
4
|
+
import { VariantProps } from 'class-variance-authority';
|
|
3
5
|
|
|
4
|
-
declare const
|
|
6
|
+
declare const checkboxVariants: (props?: ({
|
|
7
|
+
appearance?: "default" | "booking" | null | undefined;
|
|
8
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
9
|
+
declare const Checkbox: React.ForwardRefExoticComponent<Omit<CheckboxPrimitive.CheckboxProps & React.RefAttributes<HTMLButtonElement>, "ref"> & VariantProps<(props?: ({
|
|
10
|
+
appearance?: "default" | "booking" | null | undefined;
|
|
11
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string> & React.RefAttributes<HTMLButtonElement>>;
|
|
5
12
|
|
|
6
|
-
export { Checkbox };
|
|
13
|
+
export { Checkbox, checkboxVariants };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { Popover, PopoverTrigger, PopoverContent } from '../chunk-2ADCZXZJ.js';
|
|
2
2
|
import { Command, CommandInput, CommandList, CommandLoading, CommandEmpty, CommandGroup, CommandItem } from '../chunk-MCOHLWRS.js';
|
|
3
3
|
import '../chunk-PDTPO6NG.js';
|
|
4
|
-
import { Button } from '../chunk-
|
|
4
|
+
import { Button } from '../chunk-5HHRVJOT.js';
|
|
5
5
|
import '../chunk-RIH2IS7X.js';
|
|
6
6
|
import '../chunk-5YNIQ2BL.js';
|
|
7
7
|
import { cn } from '../chunk-FEK5XGZW.js';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { PhotoGround } from '../chunk-SWD6CJ35.js';
|
|
2
1
|
import { Convergence } from '../chunk-4XDJXMLF.js';
|
|
3
2
|
import '../chunk-OIV7B44M.js';
|
|
4
|
-
import {
|
|
3
|
+
import { PhotoGround } from '../chunk-SWD6CJ35.js';
|
|
4
|
+
import { Badge } from '../chunk-IEIJP73R.js';
|
|
5
5
|
import { cn } from '../chunk-FEK5XGZW.js';
|
|
6
6
|
import '../chunk-MMUBH76A.js';
|
|
7
7
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
@@ -26,28 +26,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
|
26
26
|
* work nobody can see. `prefers-reduced-motion` removes the drift entirely;
|
|
27
27
|
* the rail stays scrollable by hand, which is more than the static strip it
|
|
28
28
|
* used to collapse to.
|
|
29
|
-
*
|
|
30
|
-
* THE READER CAN STOP IT FOR GOOD. Hover and touch are holds; a rail that
|
|
31
|
-
* drifts for longer than five seconds also needs a control the reader can
|
|
32
|
-
* press (WCAG 2.2.2), and a low-vision reader who cannot follow the motion
|
|
33
|
-
* needs it to stay stopped. Pass `labels` and the rail renders a pause/play
|
|
34
|
-
* toggle under its right edge — the same latch, glyph and 44px target as
|
|
35
|
-
* `WeekendPanel`'s, so the hub's rails all answer to one control. It is not
|
|
36
|
-
* rendered under `prefers-reduced-motion`, where there is nothing to stop.
|
|
37
|
-
*
|
|
38
|
-
* THE DUPLICATE IS INERT. The second copy is what makes the loop seamless,
|
|
39
|
-
* but its links are the same links again: `aria-hidden` kept them out of the
|
|
40
|
-
* accessibility tree and left them in the tab order, so a keyboard reader
|
|
41
|
-
* tabbed through every item twice. `inert` removes them from focus and
|
|
42
|
-
* hit-testing as well.
|
|
43
29
|
*/
|
|
44
|
-
/** Accessible names for the pause/play toggle, injected so the DS owns no copy. */
|
|
45
|
-
type DriftRailLabels = {
|
|
46
|
-
/** Name announced while the rail drifts (the button pauses it). */
|
|
47
|
-
pause: string;
|
|
48
|
-
/** Name announced while the rail is paused (the button resumes it). */
|
|
49
|
-
play: string;
|
|
50
|
-
};
|
|
51
30
|
type DriftRailProps = {
|
|
52
31
|
children: React.ReactNode;
|
|
53
32
|
/** Runs the loop right-to-left instead of left-to-right. */
|
|
@@ -56,14 +35,8 @@ type DriftRailProps = {
|
|
|
56
35
|
durationSeconds?: number;
|
|
57
36
|
/** Pauses the loop while the pointer hovers the rail. */
|
|
58
37
|
pauseOnHover?: boolean;
|
|
59
|
-
/**
|
|
60
|
-
* Accessible names for the pause/play toggle. When given, the toggle
|
|
61
|
-
* renders whenever the rail drifts (never under `prefers-reduced-motion`);
|
|
62
|
-
* without it there is no control, as before.
|
|
63
|
-
*/
|
|
64
|
-
labels?: DriftRailLabels;
|
|
65
38
|
className?: string;
|
|
66
39
|
};
|
|
67
|
-
declare function DriftRail({ children, reverse, durationSeconds, pauseOnHover,
|
|
40
|
+
declare function DriftRail({ children, reverse, durationSeconds, pauseOnHover, className, }: DriftRailProps): react_jsx_runtime.JSX.Element;
|
|
68
41
|
|
|
69
|
-
export { DriftRail, type
|
|
42
|
+
export { DriftRail, type DriftRailProps };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { TagGroup } from '../chunk-PX6RICS5.js';
|
|
2
|
-
import { Tag } from '../chunk-MWB7S54O.js';
|
|
3
2
|
import { resolveEventEntryFee } from '../chunk-DNSXMHYX.js';
|
|
3
|
+
import { Tag } from '../chunk-MWB7S54O.js';
|
|
4
4
|
import { EventPosterFallback } from '../chunk-FDITZ2VM.js';
|
|
5
5
|
import { Skeleton } from '../chunk-XBBEX4SF.js';
|
|
6
6
|
import { cn } from '../chunk-FEK5XGZW.js';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { TagGroup } from '../chunk-PX6RICS5.js';
|
|
2
|
-
import { Tag } from '../chunk-MWB7S54O.js';
|
|
3
2
|
import { resolveEventEntryFee } from '../chunk-DNSXMHYX.js';
|
|
3
|
+
import { Tag } from '../chunk-MWB7S54O.js';
|
|
4
4
|
import { EventPosterFallback } from '../chunk-FDITZ2VM.js';
|
|
5
5
|
import { Skeleton } from '../chunk-XBBEX4SF.js';
|
|
6
6
|
import { cn } from '../chunk-FEK5XGZW.js';
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { resolveEventEntryFee } from '../chunk-DNSXMHYX.js';
|
|
2
|
-
import { EventPosterFallback } from '../chunk-FDITZ2VM.js';
|
|
3
2
|
import { Separator } from '../chunk-NWZGSLPU.js';
|
|
3
|
+
import { EventPosterFallback } from '../chunk-FDITZ2VM.js';
|
|
4
4
|
import { Skeleton } from '../chunk-XBBEX4SF.js';
|
|
5
|
-
import { Button } from '../chunk-
|
|
5
|
+
import { Button } from '../chunk-5HHRVJOT.js';
|
|
6
6
|
import '../chunk-RIH2IS7X.js';
|
|
7
7
|
import '../chunk-5YNIQ2BL.js';
|
|
8
8
|
import { cn } from '../chunk-FEK5XGZW.js';
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { TagGroup } from '../chunk-PX6RICS5.js';
|
|
2
2
|
import { Tag } from '../chunk-MWB7S54O.js';
|
|
3
|
-
import { EventPosterFallback } from '../chunk-FDITZ2VM.js';
|
|
4
3
|
import { Separator } from '../chunk-NWZGSLPU.js';
|
|
4
|
+
import { EventPosterFallback } from '../chunk-FDITZ2VM.js';
|
|
5
5
|
import { cn } from '../chunk-FEK5XGZW.js';
|
|
6
6
|
import { __objRest, __spreadValues } from '../chunk-MMUBH76A.js';
|
|
7
7
|
import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { Tag } from '../chunk-MWB7S54O.js';
|
|
2
1
|
import { resolveEventEntryFee } from '../chunk-DNSXMHYX.js';
|
|
3
|
-
import {
|
|
2
|
+
import { Tag } from '../chunk-MWB7S54O.js';
|
|
4
3
|
import { Separator } from '../chunk-NWZGSLPU.js';
|
|
4
|
+
import { EventPosterFallback } from '../chunk-FDITZ2VM.js';
|
|
5
5
|
import { Skeleton } from '../chunk-XBBEX4SF.js';
|
|
6
|
-
import { buttonVariants } from '../chunk-
|
|
6
|
+
import { buttonVariants } from '../chunk-5HHRVJOT.js';
|
|
7
7
|
import '../chunk-RIH2IS7X.js';
|
|
8
8
|
import '../chunk-5YNIQ2BL.js';
|
|
9
9
|
import { cn } from '../chunk-FEK5XGZW.js';
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { TagGroup } from '../chunk-PX6RICS5.js';
|
|
2
|
-
import { Tag } from '../chunk-MWB7S54O.js';
|
|
3
2
|
import { resolveEventEntryFee } from '../chunk-DNSXMHYX.js';
|
|
4
|
-
import {
|
|
3
|
+
import { Tag } from '../chunk-MWB7S54O.js';
|
|
5
4
|
import { Separator } from '../chunk-NWZGSLPU.js';
|
|
5
|
+
import { EventPosterFallback } from '../chunk-FDITZ2VM.js';
|
|
6
6
|
import { Skeleton } from '../chunk-XBBEX4SF.js';
|
|
7
7
|
import { cn } from '../chunk-FEK5XGZW.js';
|
|
8
8
|
import { __objRest, __spreadValues } from '../chunk-MMUBH76A.js';
|
|
@@ -1,9 +1,17 @@
|
|
|
1
1
|
import * as _radix_ui_react_slot from '@radix-ui/react-slot';
|
|
2
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
3
|
import * as class_variance_authority from 'class-variance-authority';
|
|
3
4
|
import * as class_variance_authority_types from 'class-variance-authority/types';
|
|
4
5
|
import * as LabelPrimitive from '@radix-ui/react-label';
|
|
5
6
|
import * as React from 'react';
|
|
6
7
|
|
|
8
|
+
/**
|
|
9
|
+
* `booking` — the booking flow's fields (booking flow.html, `.fld`): the
|
|
10
|
+
* label a 10.5px uppercase caption in the muted ink that stays muted when
|
|
11
|
+
* the field is invalid (the hairline and the line under it carry the error),
|
|
12
|
+
* the error at 11.5px, 5px between label, control and error.
|
|
13
|
+
*/
|
|
14
|
+
type FieldAppearance = "default" | "booking";
|
|
7
15
|
declare const Field: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
|
|
8
16
|
/** Field id. Auto-generated if omitted. */
|
|
9
17
|
id?: string;
|
|
@@ -11,12 +19,18 @@ declare const Field: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDi
|
|
|
11
19
|
invalid?: boolean;
|
|
12
20
|
/** Lay out content horizontally instead of stacked. */
|
|
13
21
|
orientation?: "vertical" | "horizontal";
|
|
22
|
+
appearance?: FieldAppearance;
|
|
14
23
|
} & React.RefAttributes<HTMLDivElement>>;
|
|
15
24
|
declare const FieldLabel: React.ForwardRefExoticComponent<Omit<Omit<LabelPrimitive.LabelProps & React.RefAttributes<HTMLLabelElement>, "ref"> & class_variance_authority.VariantProps<(props?: class_variance_authority_types.ClassProp | undefined) => string> & React.RefAttributes<HTMLLabelElement>, "ref"> & React.RefAttributes<HTMLLabelElement>>;
|
|
25
|
+
/**
|
|
26
|
+
* "(optional)" after a label's text — sentence case, regular weight, a
|
|
27
|
+
* shade quieter than the label (booking flow.html's EMAIL (optional)).
|
|
28
|
+
*/
|
|
29
|
+
declare function FieldOptional({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): react_jsx_runtime.JSX.Element;
|
|
16
30
|
declare const FieldControl: React.ForwardRefExoticComponent<Omit<_radix_ui_react_slot.SlotProps & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLElement>>;
|
|
17
31
|
declare const FieldDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
|
|
18
32
|
declare const FieldError: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
|
|
19
33
|
declare const FieldSet: React.ForwardRefExoticComponent<React.FieldsetHTMLAttributes<HTMLFieldSetElement> & React.RefAttributes<HTMLFieldSetElement>>;
|
|
20
34
|
declare const FieldLegend: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLLegendElement> & React.RefAttributes<HTMLLegendElement>>;
|
|
21
35
|
|
|
22
|
-
export { Field, FieldControl, FieldDescription, FieldError, FieldLabel, FieldLegend, FieldSet };
|
|
36
|
+
export { Field, FieldControl, FieldDescription, FieldError, FieldLabel, FieldLegend, FieldOptional, FieldSet };
|