@alexgorbatchev/shadcn 0.0.30 → 0.0.32
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/README.md +26 -22
- package/THIRD_PARTY_NOTICES.md +10 -0
- package/dist/{chunk-0ewzb2ax.js → chunk-0kyfh857.js} +1 -1
- package/dist/chunk-1xncv9gb.js +19 -0
- package/dist/chunk-2dxa9enk.js +98 -0
- package/dist/{chunk-8wfy03bp.js → chunk-6kwf9644.js} +1 -1
- package/dist/{chunk-82e7fbmq.js → chunk-9vyg3854.js} +2 -1
- package/dist/chunk-c6g2rbhv.js +3940 -0
- package/dist/chunk-dzvsjw59.js +200 -0
- package/dist/{chunk-g238nezp.js → chunk-pg9rhbgm.js} +4 -2
- package/dist/{chunk-5da3rzn5.js → chunk-s0typ7hv.js} +1 -1
- package/dist/chunk-tch86q2w.js +6050 -0
- package/dist/{chunk-eehfrrdz.js → chunk-tnnf8ydf.js} +1 -15
- package/dist/chunk-yfr9syen.js +363 -0
- package/dist/{chunk-53q730zs.js → chunk-zdt8xxzy.js} +3 -0
- package/dist/components/Alert.d.ts +1 -1
- package/dist/components/Table.d.ts +1 -0
- package/dist/components/assistant-ui/elements/Chart.js +2 -2
- package/dist/components/assistant-ui/elements/GuardrailNotice.js +2 -2
- package/dist/components/assistant-ui/elements/OptionList.js +3 -2
- package/dist/components/assistant-ui/elements/QuestionFlow.js +4 -3
- package/dist/components/assistant-ui/index.js +8 -7
- package/dist/components/assistant-ui/native/Sources.d.ts +1 -1
- package/dist/components/carousel/index.js +15 -204
- package/dist/components/chart/AnalyticsChart.d.ts +3 -2
- package/dist/components/chart/Chart.d.ts +1 -1
- package/dist/components/chart/index.js +24 -10
- package/dist/components/chart/types.d.ts +1 -0
- package/dist/components/data-grid/DataGrid.d.ts +48 -9
- package/dist/components/data-grid/DataGridColumnOptions.d.ts +14 -0
- package/dist/components/data-grid/DataGridColumnResizer.d.ts +13 -0
- package/dist/components/data-grid/getDataGridColumnSizeVariables.d.ts +6 -0
- package/dist/components/data-grid/hooks/useDataGridColumnSizes.d.ts +8 -0
- package/dist/components/data-grid/index.d.ts +3 -2
- package/dist/components/data-grid/index.js +124 -199
- package/dist/components/data-grid/moveDataGridColumn.d.ts +5 -0
- package/dist/components/event-calendar/index.js +4 -2
- package/dist/components/json-render/JsonAccordion.d.ts +3 -0
- package/dist/components/json-render/JsonAlert.d.ts +3 -0
- package/dist/components/json-render/JsonAvatar.d.ts +3 -0
- package/dist/components/json-render/JsonBadge.d.ts +3 -0
- package/dist/components/json-render/JsonButton.d.ts +3 -0
- package/dist/components/json-render/JsonButtonGroup.d.ts +3 -0
- package/dist/components/json-render/JsonCard.d.ts +3 -0
- package/dist/components/json-render/JsonCarousel.d.ts +3 -0
- package/dist/components/json-render/JsonCheckbox.d.ts +3 -0
- package/dist/components/json-render/JsonCollapsible.d.ts +3 -0
- package/dist/components/json-render/JsonDialog.d.ts +3 -0
- package/dist/components/json-render/JsonDrawer.d.ts +3 -0
- package/dist/components/json-render/JsonDropdownMenu.d.ts +3 -0
- package/dist/components/json-render/JsonGrid.d.ts +3 -0
- package/dist/components/json-render/JsonHeading.d.ts +3 -0
- package/dist/components/json-render/JsonImage.d.ts +3 -0
- package/dist/components/json-render/JsonInput.d.ts +3 -0
- package/dist/components/json-render/JsonLink.d.ts +3 -0
- package/dist/components/json-render/JsonPagination.d.ts +3 -0
- package/dist/components/json-render/JsonPopover.d.ts +3 -0
- package/dist/components/json-render/JsonProgress.d.ts +3 -0
- package/dist/components/json-render/JsonRadio.d.ts +3 -0
- package/dist/components/json-render/JsonSelect.d.ts +3 -0
- package/dist/components/json-render/JsonSeparator.d.ts +3 -0
- package/dist/components/json-render/JsonSkeleton.d.ts +3 -0
- package/dist/components/json-render/JsonSlider.d.ts +3 -0
- package/dist/components/json-render/JsonSpinner.d.ts +3 -0
- package/dist/components/json-render/JsonStack.d.ts +3 -0
- package/dist/components/json-render/JsonSwitch.d.ts +3 -0
- package/dist/components/json-render/JsonTable.d.ts +3 -0
- package/dist/components/json-render/JsonTabs.d.ts +3 -0
- package/dist/components/json-render/JsonText.d.ts +3 -0
- package/dist/components/json-render/JsonTextarea.d.ts +3 -0
- package/dist/components/json-render/JsonToggle.d.ts +3 -0
- package/dist/components/json-render/JsonToggleGroup.d.ts +3 -0
- package/dist/components/json-render/JsonTooltip.d.ts +3 -0
- package/dist/components/json-render/catalog.d.ts +548 -0
- package/dist/components/json-render/catalog.js +6 -0
- package/dist/components/json-render/getPaginationRange.d.ts +1 -0
- package/dist/components/json-render/index.d.ts +39 -0
- package/dist/components/json-render/index.js +1254 -0
- package/dist/components/virtual-data-grid/VirtualDataGrid.d.ts +26 -0
- package/dist/components/virtual-data-grid/index.d.ts +2 -0
- package/dist/components/virtual-data-grid/index.js +88 -0
- package/dist/components/virtual-table/index.js +4 -96
- package/dist/index.d.ts +1 -0
- package/dist/index.js +569 -4189
- package/licenses/json-render-APACHE-2.0.txt +201 -0
- package/llms/components/data-display/AnalyticsChart.md +34 -0
- package/llms/components/data-display/DataGridColumnOptions.md +22 -0
- package/llms/components/data-display/JsonRender.md +476 -0
- package/llms/components/data-display/VirtualDataGrid.md +71 -0
- package/llms/components/feedback/Alert.md +20 -4
- package/llms/setup.md +26 -22
- package/llms.txt +3 -0
- package/package.json +24 -2
|
@@ -0,0 +1,3940 @@
|
|
|
1
|
+
import {
|
|
2
|
+
cn2
|
|
3
|
+
} from "./chunk-cp2m7y7v.js";
|
|
4
|
+
import {
|
|
5
|
+
buttonVariants2,
|
|
6
|
+
Button2
|
|
7
|
+
} from "./chunk-q7p28b89.js";
|
|
8
|
+
import {
|
|
9
|
+
DensityContext,
|
|
10
|
+
useDensity
|
|
11
|
+
} from "./chunk-e6hk39ev.js";
|
|
12
|
+
import {
|
|
13
|
+
usePortalContainer2
|
|
14
|
+
} from "./chunk-j89xg1ak.js";
|
|
15
|
+
import {
|
|
16
|
+
usePortalNode,
|
|
17
|
+
PortalProvider2
|
|
18
|
+
} from "./chunk-aa7m22zj.js";
|
|
19
|
+
import {
|
|
20
|
+
useDirection2
|
|
21
|
+
} from "./chunk-jpvw9xqy.js";
|
|
22
|
+
import {
|
|
23
|
+
DropdownMenu2,
|
|
24
|
+
DropdownMenuPortal2,
|
|
25
|
+
DropdownMenuTrigger2,
|
|
26
|
+
DropdownMenuContent2,
|
|
27
|
+
DropdownMenuGroup2,
|
|
28
|
+
DropdownMenuLabel2,
|
|
29
|
+
DropdownMenuItem2,
|
|
30
|
+
DropdownMenuSub2,
|
|
31
|
+
DropdownMenuSubTrigger2,
|
|
32
|
+
DropdownMenuSubContent2,
|
|
33
|
+
DropdownMenuRadioGroup2,
|
|
34
|
+
DropdownMenuSeparator2,
|
|
35
|
+
DropdownMenuShortcut2
|
|
36
|
+
} from "./chunk-d4bm5rzy.js";
|
|
37
|
+
import {
|
|
38
|
+
Skeleton2
|
|
39
|
+
} from "./chunk-d70rcwk7.js";
|
|
40
|
+
import {
|
|
41
|
+
Input2
|
|
42
|
+
} from "./chunk-59p19t57.js";
|
|
43
|
+
import {
|
|
44
|
+
Separator2
|
|
45
|
+
} from "./chunk-rajgnfbr.js";
|
|
46
|
+
import {
|
|
47
|
+
FieldGroup2,
|
|
48
|
+
Field2,
|
|
49
|
+
FieldLabel2,
|
|
50
|
+
FieldDescription2
|
|
51
|
+
} from "./chunk-6jpz5geq.js";
|
|
52
|
+
import {
|
|
53
|
+
Textarea2
|
|
54
|
+
} from "./chunk-hz9azhzx.js";
|
|
55
|
+
import {
|
|
56
|
+
TooltipProvider2,
|
|
57
|
+
Tooltip2,
|
|
58
|
+
TooltipTrigger2,
|
|
59
|
+
TooltipContent2
|
|
60
|
+
} from "./chunk-mz3e810d.js";
|
|
61
|
+
import {
|
|
62
|
+
Card2,
|
|
63
|
+
CardHeader2,
|
|
64
|
+
CardTitle2,
|
|
65
|
+
CardDescription2,
|
|
66
|
+
CardContent2,
|
|
67
|
+
CardFooter2
|
|
68
|
+
} from "./chunk-bygq5yqf.js";
|
|
69
|
+
import {
|
|
70
|
+
InputGroup2,
|
|
71
|
+
InputGroupAddon2,
|
|
72
|
+
InputGroupButton2,
|
|
73
|
+
InputGroupInput2
|
|
74
|
+
} from "./chunk-57jj9v64.js";
|
|
75
|
+
import {
|
|
76
|
+
Badge2
|
|
77
|
+
} from "./chunk-wjx6zf94.js";
|
|
78
|
+
import {
|
|
79
|
+
Empty2,
|
|
80
|
+
EmptyHeader2,
|
|
81
|
+
EmptyTitle2,
|
|
82
|
+
EmptyDescription2,
|
|
83
|
+
EmptyContent2
|
|
84
|
+
} from "./chunk-9de1htr5.js";
|
|
85
|
+
import {
|
|
86
|
+
ThemeContext
|
|
87
|
+
} from "./chunk-1j2hz3w9.js";
|
|
88
|
+
import {
|
|
89
|
+
useMediaQuery
|
|
90
|
+
} from "./chunk-k99h6evz.js";
|
|
91
|
+
import {
|
|
92
|
+
Alert2,
|
|
93
|
+
AlertTitle2,
|
|
94
|
+
AlertDescription2
|
|
95
|
+
} from "./chunk-zdt8xxzy.js";
|
|
96
|
+
import {
|
|
97
|
+
Avatar2,
|
|
98
|
+
AvatarImage2,
|
|
99
|
+
AvatarFallback2
|
|
100
|
+
} from "./chunk-hyq4nwg2.js";
|
|
101
|
+
import {
|
|
102
|
+
Spinner2
|
|
103
|
+
} from "./chunk-1xncv9gb.js";
|
|
104
|
+
import {
|
|
105
|
+
NativeSelect2,
|
|
106
|
+
NativeSelectOption2
|
|
107
|
+
} from "./chunk-r9qrb6b6.js";
|
|
108
|
+
import {
|
|
109
|
+
SidebarProvider2,
|
|
110
|
+
Sidebar2,
|
|
111
|
+
SidebarTrigger2,
|
|
112
|
+
SidebarInset2,
|
|
113
|
+
SidebarHeader2,
|
|
114
|
+
SidebarFooter2,
|
|
115
|
+
SidebarContent2,
|
|
116
|
+
SidebarGroup2,
|
|
117
|
+
SidebarMenu2,
|
|
118
|
+
SidebarMenuItem2,
|
|
119
|
+
SidebarMenuButton2
|
|
120
|
+
} from "./chunk-8vfh3ez0.js";
|
|
121
|
+
// src/components/ButtonLink.tsx
|
|
122
|
+
import { mergeProps } from "@base-ui/react/merge-props";
|
|
123
|
+
import { useRender } from "@base-ui/react/use-render";
|
|
124
|
+
import { jsx } from "react/jsx-runtime";
|
|
125
|
+
function ButtonLink2({
|
|
126
|
+
density,
|
|
127
|
+
className,
|
|
128
|
+
variant = "default",
|
|
129
|
+
size = "default",
|
|
130
|
+
align = "center",
|
|
131
|
+
truncate = false,
|
|
132
|
+
fullWidth = false,
|
|
133
|
+
render,
|
|
134
|
+
children,
|
|
135
|
+
...props
|
|
136
|
+
}) {
|
|
137
|
+
return useRender({
|
|
138
|
+
defaultTagName: "a",
|
|
139
|
+
props: mergeProps({
|
|
140
|
+
className: cn2(buttonVariants2({ variant, size, align, truncate, fullWidth }), className),
|
|
141
|
+
children: truncate ? /* @__PURE__ */ jsx("span", {
|
|
142
|
+
className: "min-w-0 truncate",
|
|
143
|
+
children
|
|
144
|
+
}) : children
|
|
145
|
+
}, props),
|
|
146
|
+
render,
|
|
147
|
+
state: {
|
|
148
|
+
slot: "button-link",
|
|
149
|
+
density
|
|
150
|
+
}
|
|
151
|
+
});
|
|
152
|
+
}
|
|
153
|
+
// src/components/Accordion.tsx
|
|
154
|
+
import { Accordion as AccordionPrimitive } from "@base-ui/react/accordion";
|
|
155
|
+
import { ChevronDownIcon, ChevronUpIcon } from "lucide-react";
|
|
156
|
+
import { jsx as jsx2, jsxs } from "react/jsx-runtime";
|
|
157
|
+
function Accordion2({ density, className, ...props }) {
|
|
158
|
+
return /* @__PURE__ */ jsx2(AccordionPrimitive.Root, {
|
|
159
|
+
"data-density": density,
|
|
160
|
+
"data-slot": "accordion",
|
|
161
|
+
className: (state) => cn2("flex w-full flex-col", typeof className === "function" ? className(state) : className),
|
|
162
|
+
...props
|
|
163
|
+
});
|
|
164
|
+
}
|
|
165
|
+
function AccordionItem2({ density, className, ...props }) {
|
|
166
|
+
return /* @__PURE__ */ jsx2(AccordionPrimitive.Item, {
|
|
167
|
+
"data-density": density,
|
|
168
|
+
"data-slot": "accordion-item",
|
|
169
|
+
className: (state) => cn2("not-last:border-b", typeof className === "function" ? className(state) : className),
|
|
170
|
+
...props
|
|
171
|
+
});
|
|
172
|
+
}
|
|
173
|
+
function AccordionTrigger2({ density, className, children, ...props }) {
|
|
174
|
+
return /* @__PURE__ */ jsx2(AccordionPrimitive.Header, {
|
|
175
|
+
className: "flex",
|
|
176
|
+
children: /* @__PURE__ */ jsxs(AccordionPrimitive.Trigger, {
|
|
177
|
+
"data-density": density,
|
|
178
|
+
"data-slot": "accordion-trigger",
|
|
179
|
+
className: (state) => cn2("group/accordion-trigger relative flex flex-1 items-start justify-between rounded-sm border border-transparent py-2.5 text-start text-sm font-medium transition-colors outline-none hover:underline focus-visible:border-ring focus-visible:ring-1 focus-visible:ring-ring focus-visible:after:border-ring aria-disabled:pointer-events-none aria-disabled:opacity-50 **:data-[slot=accordion-trigger-icon]:ms-auto **:data-[slot=accordion-trigger-icon]:size-4 **:data-[slot=accordion-trigger-icon]:text-muted-foreground", typeof className === "function" ? className(state) : className),
|
|
180
|
+
...props,
|
|
181
|
+
children: [
|
|
182
|
+
children,
|
|
183
|
+
/* @__PURE__ */ jsx2(ChevronDownIcon, {
|
|
184
|
+
"data-slot": "accordion-trigger-icon",
|
|
185
|
+
className: "pointer-events-none shrink-0 group-aria-expanded/accordion-trigger:hidden"
|
|
186
|
+
}),
|
|
187
|
+
/* @__PURE__ */ jsx2(ChevronUpIcon, {
|
|
188
|
+
"data-slot": "accordion-trigger-icon",
|
|
189
|
+
className: "pointer-events-none hidden shrink-0 group-aria-expanded/accordion-trigger:inline"
|
|
190
|
+
})
|
|
191
|
+
]
|
|
192
|
+
})
|
|
193
|
+
});
|
|
194
|
+
}
|
|
195
|
+
function AccordionContent2({ density, className, children, ...props }) {
|
|
196
|
+
return /* @__PURE__ */ jsx2(AccordionPrimitive.Panel, {
|
|
197
|
+
"data-density": density,
|
|
198
|
+
"data-slot": "accordion-content",
|
|
199
|
+
className: (state) => cn2("h-(--accordion-panel-height) overflow-hidden text-sm transition-[height] duration-200 ease-out data-ending-style:h-0 data-starting-style:h-0", typeof className === "function" ? className(state) : className),
|
|
200
|
+
...props,
|
|
201
|
+
children: /* @__PURE__ */ jsx2("div", {
|
|
202
|
+
className: "pt-0 pb-2.5 [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground [&_p:not(:last-child)]:mb-4",
|
|
203
|
+
children
|
|
204
|
+
})
|
|
205
|
+
});
|
|
206
|
+
}
|
|
207
|
+
// src/components/Combobox.tsx
|
|
208
|
+
import { useDirection } from "@base-ui/react/direction-provider";
|
|
209
|
+
import { Combobox as ComboboxPrimitive } from "@base-ui/react/combobox";
|
|
210
|
+
import { ChevronDownIcon as ChevronDownIcon2, XIcon, CheckIcon } from "lucide-react";
|
|
211
|
+
import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
212
|
+
var Combobox2 = ComboboxPrimitive.Root;
|
|
213
|
+
function ComboboxValue2({ ...props }) {
|
|
214
|
+
return /* @__PURE__ */ jsx3(ComboboxPrimitive.Value, {
|
|
215
|
+
...props
|
|
216
|
+
});
|
|
217
|
+
}
|
|
218
|
+
function ComboboxTrigger2({ density, className, children, ...props }) {
|
|
219
|
+
return /* @__PURE__ */ jsxs2(ComboboxPrimitive.Trigger, {
|
|
220
|
+
"data-density": density,
|
|
221
|
+
"data-slot": "combobox-trigger",
|
|
222
|
+
className: (state) => cn2("[&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
|
|
223
|
+
...props,
|
|
224
|
+
children: [
|
|
225
|
+
children,
|
|
226
|
+
/* @__PURE__ */ jsx3(ChevronDownIcon2, {
|
|
227
|
+
className: "pointer-events-none size-4 text-muted-foreground"
|
|
228
|
+
})
|
|
229
|
+
]
|
|
230
|
+
});
|
|
231
|
+
}
|
|
232
|
+
function ComboboxClear({ density, className, ...props }) {
|
|
233
|
+
return /* @__PURE__ */ jsx3(ComboboxPrimitive.Clear, {
|
|
234
|
+
"data-density": density,
|
|
235
|
+
"data-slot": "combobox-clear",
|
|
236
|
+
render: /* @__PURE__ */ jsx3(InputGroupButton2, {
|
|
237
|
+
variant: "ghost",
|
|
238
|
+
size: "icon-xs"
|
|
239
|
+
}),
|
|
240
|
+
className: (state) => cn2(typeof className === "function" ? className(state) : className),
|
|
241
|
+
...props,
|
|
242
|
+
children: /* @__PURE__ */ jsx3(XIcon, {
|
|
243
|
+
className: "pointer-events-none"
|
|
244
|
+
})
|
|
245
|
+
});
|
|
246
|
+
}
|
|
247
|
+
function ComboboxInput2({
|
|
248
|
+
density,
|
|
249
|
+
className,
|
|
250
|
+
children,
|
|
251
|
+
disabled = false,
|
|
252
|
+
showTrigger = true,
|
|
253
|
+
showClear = false,
|
|
254
|
+
frameClassName,
|
|
255
|
+
triggerLabel = "Open popup",
|
|
256
|
+
clearLabel = "Clear selection",
|
|
257
|
+
...props
|
|
258
|
+
}) {
|
|
259
|
+
return /* @__PURE__ */ jsxs2(InputGroup2, {
|
|
260
|
+
density,
|
|
261
|
+
className: cn2("w-auto", frameClassName),
|
|
262
|
+
children: [
|
|
263
|
+
/* @__PURE__ */ jsx3(ComboboxPrimitive.Input, {
|
|
264
|
+
disabled,
|
|
265
|
+
className,
|
|
266
|
+
render: /* @__PURE__ */ jsx3(InputGroupInput2, {}),
|
|
267
|
+
...props
|
|
268
|
+
}),
|
|
269
|
+
/* @__PURE__ */ jsxs2(InputGroupAddon2, {
|
|
270
|
+
align: "inline-end",
|
|
271
|
+
children: [
|
|
272
|
+
showTrigger && /* @__PURE__ */ jsx3(InputGroupButton2, {
|
|
273
|
+
size: "icon-xs",
|
|
274
|
+
variant: "ghost",
|
|
275
|
+
render: /* @__PURE__ */ jsx3(ComboboxTrigger2, {}),
|
|
276
|
+
"aria-label": triggerLabel,
|
|
277
|
+
"data-density": density,
|
|
278
|
+
"data-slot": "input-group-button",
|
|
279
|
+
className: "group-has-data-[slot=combobox-clear]/input-group:hidden data-pressed:bg-transparent",
|
|
280
|
+
disabled
|
|
281
|
+
}),
|
|
282
|
+
showClear && /* @__PURE__ */ jsx3(ComboboxClear, {
|
|
283
|
+
disabled,
|
|
284
|
+
"aria-label": clearLabel
|
|
285
|
+
})
|
|
286
|
+
]
|
|
287
|
+
}),
|
|
288
|
+
children
|
|
289
|
+
]
|
|
290
|
+
});
|
|
291
|
+
}
|
|
292
|
+
function ComboboxContent2({
|
|
293
|
+
density,
|
|
294
|
+
className,
|
|
295
|
+
side = "bottom",
|
|
296
|
+
sideOffset = 6,
|
|
297
|
+
align = "start",
|
|
298
|
+
alignOffset = 0,
|
|
299
|
+
anchor,
|
|
300
|
+
...props
|
|
301
|
+
}) {
|
|
302
|
+
const resolvedDensity = useDensity(density);
|
|
303
|
+
const direction = useDirection();
|
|
304
|
+
const container = usePortalContainer2();
|
|
305
|
+
const portal = usePortalNode();
|
|
306
|
+
return /* @__PURE__ */ jsx3(ComboboxPrimitive.Portal, {
|
|
307
|
+
container,
|
|
308
|
+
ref: portal.ref,
|
|
309
|
+
children: /* @__PURE__ */ jsx3(PortalProvider2, {
|
|
310
|
+
container: portal.node,
|
|
311
|
+
children: /* @__PURE__ */ jsx3(ComboboxPrimitive.Positioner, {
|
|
312
|
+
side,
|
|
313
|
+
sideOffset,
|
|
314
|
+
align,
|
|
315
|
+
alignOffset,
|
|
316
|
+
anchor,
|
|
317
|
+
className: "isolate ",
|
|
318
|
+
children: /* @__PURE__ */ jsx3(ComboboxPrimitive.Popup, {
|
|
319
|
+
dir: direction,
|
|
320
|
+
"data-density": resolvedDensity,
|
|
321
|
+
"data-slot": "combobox-content",
|
|
322
|
+
"data-chips": !!anchor,
|
|
323
|
+
className: (state) => cn2("group/combobox-content relative max-h-(--available-height) w-(--anchor-width) max-w-(--available-width) min-w-[calc(var(--anchor-width)+--spacing(7))] origin-(--transform-origin) overflow-hidden rounded-md bg-popover text-popover-foreground border border-frame-edge shadow-frame duration-120 data-[chips=true]:min-w-(--anchor-width) *:data-[slot=input-group]:m-1 *:data-[slot=input-group]:mb-0 *:data-[slot=input-group]:h-control *:data-[slot=input-group]:border-input/30 *:data-[slot=input-group]:bg-input/30 *:data-[slot=input-group]:shadow-none data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0 motion-reduce:data-open:animate-none motion-reduce:data-closed:animate-none", typeof className === "function" ? className(state) : className),
|
|
324
|
+
...props
|
|
325
|
+
})
|
|
326
|
+
})
|
|
327
|
+
})
|
|
328
|
+
});
|
|
329
|
+
}
|
|
330
|
+
function ComboboxList2({ density, className, ...props }) {
|
|
331
|
+
return /* @__PURE__ */ jsx3(ComboboxPrimitive.List, {
|
|
332
|
+
"data-density": density,
|
|
333
|
+
"data-slot": "combobox-list",
|
|
334
|
+
className: (state) => cn2("no-scrollbar max-h-[min(calc(--spacing(72)---spacing(9)),calc(var(--available-height)---spacing(9)))] scroll-py-1 overflow-y-auto overscroll-contain p-1 data-empty:p-0", typeof className === "function" ? className(state) : className),
|
|
335
|
+
...props
|
|
336
|
+
});
|
|
337
|
+
}
|
|
338
|
+
function ComboboxItem2({ density, className, children, ...props }) {
|
|
339
|
+
return /* @__PURE__ */ jsxs2(ComboboxPrimitive.Item, {
|
|
340
|
+
"data-density": density,
|
|
341
|
+
"data-slot": "combobox-item",
|
|
342
|
+
className: (state) => cn2("relative flex w-full cursor-default items-center gap-2 rounded-md py-1 pe-8 ps-1.5 text-sm outline-hidden select-none data-highlighted:bg-accent data-highlighted:text-accent-foreground not-data-[variant=destructive]:data-highlighted:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
|
|
343
|
+
...props,
|
|
344
|
+
children: [
|
|
345
|
+
children,
|
|
346
|
+
/* @__PURE__ */ jsx3(ComboboxPrimitive.ItemIndicator, {
|
|
347
|
+
render: /* @__PURE__ */ jsx3("span", {
|
|
348
|
+
className: "pointer-events-none absolute end-2 flex size-4 items-center justify-center"
|
|
349
|
+
}),
|
|
350
|
+
children: /* @__PURE__ */ jsx3(CheckIcon, {
|
|
351
|
+
className: "pointer-events-none"
|
|
352
|
+
})
|
|
353
|
+
})
|
|
354
|
+
]
|
|
355
|
+
});
|
|
356
|
+
}
|
|
357
|
+
function ComboboxGroup2({ density, className, ...props }) {
|
|
358
|
+
return /* @__PURE__ */ jsx3(ComboboxPrimitive.Group, {
|
|
359
|
+
"data-density": density,
|
|
360
|
+
"data-slot": "combobox-group",
|
|
361
|
+
className: (state) => cn2(typeof className === "function" ? className(state) : className),
|
|
362
|
+
...props
|
|
363
|
+
});
|
|
364
|
+
}
|
|
365
|
+
function ComboboxLabel2({ density, className, ...props }) {
|
|
366
|
+
return /* @__PURE__ */ jsx3(ComboboxPrimitive.GroupLabel, {
|
|
367
|
+
"data-density": density,
|
|
368
|
+
"data-slot": "combobox-label",
|
|
369
|
+
className: (state) => cn2("px-2 py-1.5 text-xs text-muted-foreground", typeof className === "function" ? className(state) : className),
|
|
370
|
+
...props
|
|
371
|
+
});
|
|
372
|
+
}
|
|
373
|
+
function ComboboxCollection2({ ...props }) {
|
|
374
|
+
return /* @__PURE__ */ jsx3(ComboboxPrimitive.Collection, {
|
|
375
|
+
...props
|
|
376
|
+
});
|
|
377
|
+
}
|
|
378
|
+
function ComboboxEmpty2({ density, className, ...props }) {
|
|
379
|
+
return /* @__PURE__ */ jsx3(ComboboxPrimitive.Empty, {
|
|
380
|
+
"data-density": density,
|
|
381
|
+
"data-slot": "combobox-empty",
|
|
382
|
+
className: (state) => cn2("flex w-full justify-center py-2 empty:p-0 text-center text-sm text-muted-foreground", typeof className === "function" ? className(state) : className),
|
|
383
|
+
...props
|
|
384
|
+
});
|
|
385
|
+
}
|
|
386
|
+
function ComboboxSeparator2({ density, className, ...props }) {
|
|
387
|
+
return /* @__PURE__ */ jsx3(ComboboxPrimitive.Separator, {
|
|
388
|
+
"data-density": density,
|
|
389
|
+
"data-slot": "combobox-separator",
|
|
390
|
+
className: (state) => cn2("-mx-1 my-1 h-px bg-border", typeof className === "function" ? className(state) : className),
|
|
391
|
+
...props
|
|
392
|
+
});
|
|
393
|
+
}
|
|
394
|
+
function ComboboxChips2({ density, className, ...props }) {
|
|
395
|
+
return /* @__PURE__ */ jsx3(ComboboxPrimitive.Chips, {
|
|
396
|
+
"data-density": density,
|
|
397
|
+
"data-slot": "combobox-chips",
|
|
398
|
+
className: (state) => cn2("flex min-h-control flex-wrap items-center gap-1 rounded-sm border border-input bg-transparent bg-clip-padding px-control-x py-px text-sm transition-colors focus-within:border-ring focus-within:ring-1 focus-within:ring-ring has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive has-data-[slot=combobox-chip]:px-1", typeof className === "function" ? className(state) : className),
|
|
399
|
+
...props
|
|
400
|
+
});
|
|
401
|
+
}
|
|
402
|
+
function ComboboxChip2({
|
|
403
|
+
density,
|
|
404
|
+
className,
|
|
405
|
+
children,
|
|
406
|
+
showRemove = true,
|
|
407
|
+
removeLabel = "Remove item",
|
|
408
|
+
...props
|
|
409
|
+
}) {
|
|
410
|
+
return /* @__PURE__ */ jsxs2(ComboboxPrimitive.Chip, {
|
|
411
|
+
"data-density": density,
|
|
412
|
+
"data-slot": "combobox-chip",
|
|
413
|
+
className: (state) => cn2("flex h-tag w-fit items-center justify-center gap-1 rounded-sm bg-muted px-1.5 text-xs font-medium whitespace-nowrap text-foreground has-disabled:pointer-events-none has-disabled:cursor-not-allowed has-disabled:opacity-50 has-data-[slot=combobox-chip-remove]:pe-0", typeof className === "function" ? className(state) : className),
|
|
414
|
+
...props,
|
|
415
|
+
children: [
|
|
416
|
+
children,
|
|
417
|
+
showRemove && /* @__PURE__ */ jsx3(ComboboxPrimitive.ChipRemove, {
|
|
418
|
+
render: /* @__PURE__ */ jsx3(Button2, {
|
|
419
|
+
variant: "ghost",
|
|
420
|
+
size: "icon-xs"
|
|
421
|
+
}),
|
|
422
|
+
className: "size-tag -ms-1 opacity-50 hover:opacity-100",
|
|
423
|
+
"data-slot": "combobox-chip-remove",
|
|
424
|
+
"aria-label": removeLabel,
|
|
425
|
+
children: /* @__PURE__ */ jsx3(XIcon, {
|
|
426
|
+
className: "pointer-events-none"
|
|
427
|
+
})
|
|
428
|
+
})
|
|
429
|
+
]
|
|
430
|
+
});
|
|
431
|
+
}
|
|
432
|
+
function ComboboxChipsInput2({ density, className, ...props }) {
|
|
433
|
+
return /* @__PURE__ */ jsx3(ComboboxPrimitive.Input, {
|
|
434
|
+
"data-density": density,
|
|
435
|
+
"data-slot": "combobox-chip-input",
|
|
436
|
+
className: (state) => cn2("h-tag min-w-16 flex-1 py-0 text-sm leading-none outline-none", typeof className === "function" ? className(state) : className),
|
|
437
|
+
...props
|
|
438
|
+
});
|
|
439
|
+
}
|
|
440
|
+
// src/components/EmptyState.tsx
|
|
441
|
+
import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
442
|
+
function EmptyState3({ title, description, children }) {
|
|
443
|
+
return /* @__PURE__ */ jsxs3(Empty2, {
|
|
444
|
+
children: [
|
|
445
|
+
/* @__PURE__ */ jsxs3(EmptyHeader2, {
|
|
446
|
+
children: [
|
|
447
|
+
/* @__PURE__ */ jsx4(EmptyTitle2, {
|
|
448
|
+
children: title
|
|
449
|
+
}),
|
|
450
|
+
/* @__PURE__ */ jsx4(EmptyDescription2, {
|
|
451
|
+
children: description
|
|
452
|
+
})
|
|
453
|
+
]
|
|
454
|
+
}),
|
|
455
|
+
children && /* @__PURE__ */ jsx4(EmptyContent2, {
|
|
456
|
+
children
|
|
457
|
+
})
|
|
458
|
+
]
|
|
459
|
+
});
|
|
460
|
+
}
|
|
461
|
+
// src/components/PageMessage.tsx
|
|
462
|
+
import { useId } from "react";
|
|
463
|
+
import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
464
|
+
function PageMessage2({ title, description, children }) {
|
|
465
|
+
const titleId = useId();
|
|
466
|
+
const descriptionId = useId();
|
|
467
|
+
return /* @__PURE__ */ jsx5("main", {
|
|
468
|
+
"aria-labelledby": titleId,
|
|
469
|
+
"aria-describedby": description == null ? undefined : descriptionId,
|
|
470
|
+
className: "grid min-h-dvh w-full place-items-center bg-background text-foreground",
|
|
471
|
+
children: /* @__PURE__ */ jsxs4(Empty2, {
|
|
472
|
+
children: [
|
|
473
|
+
/* @__PURE__ */ jsxs4(EmptyHeader2, {
|
|
474
|
+
children: [
|
|
475
|
+
/* @__PURE__ */ jsx5(EmptyTitle2, {
|
|
476
|
+
children: /* @__PURE__ */ jsx5("h1", {
|
|
477
|
+
id: titleId,
|
|
478
|
+
children: title
|
|
479
|
+
})
|
|
480
|
+
}),
|
|
481
|
+
description != null && /* @__PURE__ */ jsx5(EmptyDescription2, {
|
|
482
|
+
id: descriptionId,
|
|
483
|
+
children: description
|
|
484
|
+
})
|
|
485
|
+
]
|
|
486
|
+
}),
|
|
487
|
+
children != null && /* @__PURE__ */ jsx5(EmptyContent2, {
|
|
488
|
+
children
|
|
489
|
+
})
|
|
490
|
+
]
|
|
491
|
+
})
|
|
492
|
+
});
|
|
493
|
+
}
|
|
494
|
+
// src/components/JsonViewer.tsx
|
|
495
|
+
import { jsx as jsx6 } from "react/jsx-runtime";
|
|
496
|
+
function JsonViewer2({ value, label = "JSON", rows = 12 }) {
|
|
497
|
+
return /* @__PURE__ */ jsx6(Textarea2, {
|
|
498
|
+
readOnly: true,
|
|
499
|
+
rows,
|
|
500
|
+
"aria-label": label,
|
|
501
|
+
value: JSON.stringify(value ?? null, null, 2) ?? "null"
|
|
502
|
+
});
|
|
503
|
+
}
|
|
504
|
+
// src/components/AlertDialog.tsx
|
|
505
|
+
import { AlertDialog as AlertDialogPrimitive } from "@base-ui/react/alert-dialog";
|
|
506
|
+
import { useDirection as useDirection3 } from "@base-ui/react/direction-provider";
|
|
507
|
+
import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
508
|
+
"use client";
|
|
509
|
+
function AlertDialog2({ ...props }) {
|
|
510
|
+
return /* @__PURE__ */ jsx7(AlertDialogPrimitive.Root, {
|
|
511
|
+
"data-slot": "alert-dialog",
|
|
512
|
+
...props
|
|
513
|
+
});
|
|
514
|
+
}
|
|
515
|
+
function AlertDialogTrigger2({ ...props }) {
|
|
516
|
+
return /* @__PURE__ */ jsx7(AlertDialogPrimitive.Trigger, {
|
|
517
|
+
"data-slot": "alert-dialog-trigger",
|
|
518
|
+
...props
|
|
519
|
+
});
|
|
520
|
+
}
|
|
521
|
+
function AlertDialogPortal2({ container, ref, children, ...props }) {
|
|
522
|
+
const resolvedContainer = usePortalContainer2(container);
|
|
523
|
+
const portal = usePortalNode(ref);
|
|
524
|
+
return /* @__PURE__ */ jsx7(AlertDialogPrimitive.Portal, {
|
|
525
|
+
"data-slot": "alert-dialog-portal",
|
|
526
|
+
container: resolvedContainer,
|
|
527
|
+
ref: portal.ref,
|
|
528
|
+
...props,
|
|
529
|
+
children: /* @__PURE__ */ jsx7(PortalProvider2, {
|
|
530
|
+
container: portal.node,
|
|
531
|
+
children
|
|
532
|
+
})
|
|
533
|
+
});
|
|
534
|
+
}
|
|
535
|
+
function AlertDialogOverlay2({ density, className, ...props }) {
|
|
536
|
+
const resolvedDensity = useDensity(density);
|
|
537
|
+
return /* @__PURE__ */ jsx7(AlertDialogPrimitive.Backdrop, {
|
|
538
|
+
"data-density": resolvedDensity,
|
|
539
|
+
"data-slot": "alert-dialog-overlay",
|
|
540
|
+
className: (state) => cn2("fixed inset-0 isolate bg-backdrop duration-120 data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0 motion-reduce:data-open:animate-none motion-reduce:data-closed:animate-none", typeof className === "function" ? className(state) : className),
|
|
541
|
+
...props
|
|
542
|
+
});
|
|
543
|
+
}
|
|
544
|
+
function AlertDialogContent2({ density, className, size = "default", ...props }) {
|
|
545
|
+
const resolvedDensity = useDensity(density);
|
|
546
|
+
const direction = useDirection3();
|
|
547
|
+
return /* @__PURE__ */ jsxs5(AlertDialogPortal2, {
|
|
548
|
+
children: [
|
|
549
|
+
/* @__PURE__ */ jsx7(AlertDialogOverlay2, {}),
|
|
550
|
+
/* @__PURE__ */ jsx7(AlertDialogPrimitive.Popup, {
|
|
551
|
+
dir: direction,
|
|
552
|
+
"data-density": resolvedDensity,
|
|
553
|
+
"data-slot": "alert-dialog-content",
|
|
554
|
+
"data-scroll": "none",
|
|
555
|
+
"data-size": size,
|
|
556
|
+
className: (state) => cn2("group/alert-dialog-content fixed top-1/2 left-1/2 grid w-full -translate-x-1/2 -translate-y-1/2 gap-panel rounded-md bg-popover p-panel text-popover-foreground border border-frame-edge shadow-frame duration-120 outline-none data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0 motion-reduce:data-open:animate-none motion-reduce:data-closed:animate-none", typeof className === "function" ? className(state) : className),
|
|
557
|
+
...props
|
|
558
|
+
})
|
|
559
|
+
]
|
|
560
|
+
});
|
|
561
|
+
}
|
|
562
|
+
function AlertDialogHeader2({ density, className, ...props }) {
|
|
563
|
+
return /* @__PURE__ */ jsx7("div", {
|
|
564
|
+
"data-density": density,
|
|
565
|
+
"data-slot": "alert-dialog-header",
|
|
566
|
+
className: cn2("grid grid-rows-[auto_1fr] place-items-center gap-control-gap text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-4 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-start sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]", className),
|
|
567
|
+
...props
|
|
568
|
+
});
|
|
569
|
+
}
|
|
570
|
+
function AlertDialogFooter2({ density, className, ...props }) {
|
|
571
|
+
return /* @__PURE__ */ jsx7("div", {
|
|
572
|
+
"data-density": density,
|
|
573
|
+
"data-slot": "alert-dialog-footer",
|
|
574
|
+
className: cn2("-mx-panel -mb-panel flex flex-col-reverse gap-2 rounded-b-md border-t bg-muted/50 p-panel group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end", className),
|
|
575
|
+
...props
|
|
576
|
+
});
|
|
577
|
+
}
|
|
578
|
+
function AlertDialogMedia2({ density, className, ...props }) {
|
|
579
|
+
return /* @__PURE__ */ jsx7("div", {
|
|
580
|
+
"data-density": density,
|
|
581
|
+
"data-slot": "alert-dialog-media",
|
|
582
|
+
className: cn2("mb-2 inline-flex size-10 items-center justify-center rounded-md bg-muted sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-control-xs", className),
|
|
583
|
+
...props
|
|
584
|
+
});
|
|
585
|
+
}
|
|
586
|
+
function AlertDialogTitle2({ density, className, ...props }) {
|
|
587
|
+
return /* @__PURE__ */ jsx7(AlertDialogPrimitive.Title, {
|
|
588
|
+
"data-density": density,
|
|
589
|
+
"data-slot": "alert-dialog-title",
|
|
590
|
+
className: (state) => cn2("text-base font-medium sm:group-data-[size=default]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2", typeof className === "function" ? className(state) : className),
|
|
591
|
+
...props
|
|
592
|
+
});
|
|
593
|
+
}
|
|
594
|
+
function AlertDialogDescription2({ density, className, ...props }) {
|
|
595
|
+
return /* @__PURE__ */ jsx7(AlertDialogPrimitive.Description, {
|
|
596
|
+
"data-density": density,
|
|
597
|
+
"data-slot": "alert-dialog-description",
|
|
598
|
+
className: (state) => cn2("text-sm text-balance text-muted-foreground md:text-pretty *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground", typeof className === "function" ? className(state) : className),
|
|
599
|
+
...props
|
|
600
|
+
});
|
|
601
|
+
}
|
|
602
|
+
function AlertDialogAction2({ density, className, ...props }) {
|
|
603
|
+
return /* @__PURE__ */ jsx7(Button2, {
|
|
604
|
+
"data-density": density,
|
|
605
|
+
"data-slot": "alert-dialog-action",
|
|
606
|
+
className,
|
|
607
|
+
...props
|
|
608
|
+
});
|
|
609
|
+
}
|
|
610
|
+
function AlertDialogCancel2({
|
|
611
|
+
density,
|
|
612
|
+
className,
|
|
613
|
+
variant = "outline",
|
|
614
|
+
size = "default",
|
|
615
|
+
...props
|
|
616
|
+
}) {
|
|
617
|
+
return /* @__PURE__ */ jsx7(AlertDialogPrimitive.Close, {
|
|
618
|
+
"data-density": density,
|
|
619
|
+
"data-slot": "alert-dialog-cancel",
|
|
620
|
+
className,
|
|
621
|
+
render: /* @__PURE__ */ jsx7(Button2, {
|
|
622
|
+
variant,
|
|
623
|
+
size
|
|
624
|
+
}),
|
|
625
|
+
...props
|
|
626
|
+
});
|
|
627
|
+
}
|
|
628
|
+
// src/components/Select.tsx
|
|
629
|
+
import { Select as SelectPrimitive } from "@base-ui/react/select";
|
|
630
|
+
import { useDirection as useDirection4 } from "@base-ui/react/direction-provider";
|
|
631
|
+
import { ChevronDownIcon as ChevronDownIcon3, CheckIcon as CheckIcon2, ChevronUpIcon as ChevronUpIcon2 } from "lucide-react";
|
|
632
|
+
import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
633
|
+
"use client";
|
|
634
|
+
var Select2 = SelectPrimitive.Root;
|
|
635
|
+
function SelectGroup2({ density, className, ...props }) {
|
|
636
|
+
return /* @__PURE__ */ jsx8(SelectPrimitive.Group, {
|
|
637
|
+
"data-density": density,
|
|
638
|
+
"data-slot": "select-group",
|
|
639
|
+
className: (state) => cn2("scroll-my-1 p-1", typeof className === "function" ? className(state) : className),
|
|
640
|
+
...props
|
|
641
|
+
});
|
|
642
|
+
}
|
|
643
|
+
function SelectValue2({ density, className, ...props }) {
|
|
644
|
+
return /* @__PURE__ */ jsx8(SelectPrimitive.Value, {
|
|
645
|
+
"data-density": density,
|
|
646
|
+
"data-slot": "select-value",
|
|
647
|
+
className: (state) => cn2("flex flex-1 text-start", typeof className === "function" ? className(state) : className),
|
|
648
|
+
...props
|
|
649
|
+
});
|
|
650
|
+
}
|
|
651
|
+
function SelectTrigger2({ density, className, size = "default", children, ...props }) {
|
|
652
|
+
return /* @__PURE__ */ jsxs6(SelectPrimitive.Trigger, {
|
|
653
|
+
"data-density": density,
|
|
654
|
+
"data-slot": "select-trigger",
|
|
655
|
+
"data-size": size,
|
|
656
|
+
className: (state) => cn2("flex w-fit items-center justify-between gap-control-gap rounded-sm border border-input bg-transparent py-2 pe-2 ps-2.5 text-sm whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive data-placeholder:text-muted-foreground data-[size=default]:h-control data-[size=sm]:h-control-sm data-[size=sm]:rounded-sm *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-control-gap [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
|
|
657
|
+
...props,
|
|
658
|
+
children: [
|
|
659
|
+
children,
|
|
660
|
+
/* @__PURE__ */ jsx8(SelectPrimitive.Icon, {
|
|
661
|
+
render: /* @__PURE__ */ jsx8(ChevronDownIcon3, {
|
|
662
|
+
className: "pointer-events-none size-4 text-muted-foreground"
|
|
663
|
+
})
|
|
664
|
+
})
|
|
665
|
+
]
|
|
666
|
+
});
|
|
667
|
+
}
|
|
668
|
+
function SelectContent2({
|
|
669
|
+
density,
|
|
670
|
+
className,
|
|
671
|
+
children,
|
|
672
|
+
side = "bottom",
|
|
673
|
+
sideOffset = 4,
|
|
674
|
+
align = "center",
|
|
675
|
+
alignOffset = 0,
|
|
676
|
+
alignItemWithTrigger = true,
|
|
677
|
+
...props
|
|
678
|
+
}) {
|
|
679
|
+
const resolvedDensity = useDensity(density);
|
|
680
|
+
const direction = useDirection4();
|
|
681
|
+
const container = usePortalContainer2();
|
|
682
|
+
const portal = usePortalNode();
|
|
683
|
+
return /* @__PURE__ */ jsx8(SelectPrimitive.Portal, {
|
|
684
|
+
container,
|
|
685
|
+
ref: portal.ref,
|
|
686
|
+
children: /* @__PURE__ */ jsx8(PortalProvider2, {
|
|
687
|
+
container: portal.node,
|
|
688
|
+
children: /* @__PURE__ */ jsx8(SelectPrimitive.Positioner, {
|
|
689
|
+
side,
|
|
690
|
+
sideOffset,
|
|
691
|
+
align,
|
|
692
|
+
alignOffset,
|
|
693
|
+
alignItemWithTrigger,
|
|
694
|
+
className: "isolate ",
|
|
695
|
+
children: /* @__PURE__ */ jsxs6(SelectPrimitive.Popup, {
|
|
696
|
+
dir: direction,
|
|
697
|
+
"data-density": resolvedDensity,
|
|
698
|
+
"data-slot": "select-content",
|
|
699
|
+
"data-align-trigger": alignItemWithTrigger,
|
|
700
|
+
className: (state) => cn2("relative isolate max-h-(--available-height) w-(--anchor-width) min-w-36 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-md bg-popover text-popover-foreground border border-frame-edge shadow-frame duration-120 data-[align-trigger=true]:animate-none data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0 motion-reduce:animate-none", typeof className === "function" ? className(state) : className),
|
|
701
|
+
...props,
|
|
702
|
+
children: [
|
|
703
|
+
/* @__PURE__ */ jsx8(SelectScrollUpButton2, {}),
|
|
704
|
+
/* @__PURE__ */ jsx8(SelectPrimitive.List, {
|
|
705
|
+
children
|
|
706
|
+
}),
|
|
707
|
+
/* @__PURE__ */ jsx8(SelectScrollDownButton2, {})
|
|
708
|
+
]
|
|
709
|
+
})
|
|
710
|
+
})
|
|
711
|
+
})
|
|
712
|
+
});
|
|
713
|
+
}
|
|
714
|
+
function SelectLabel2({ density, className, ...props }) {
|
|
715
|
+
return /* @__PURE__ */ jsx8(SelectPrimitive.GroupLabel, {
|
|
716
|
+
"data-density": density,
|
|
717
|
+
"data-slot": "select-label",
|
|
718
|
+
className: (state) => cn2("px-1.5 py-1 text-xs text-muted-foreground", typeof className === "function" ? className(state) : className),
|
|
719
|
+
...props
|
|
720
|
+
});
|
|
721
|
+
}
|
|
722
|
+
function SelectItem2({ density, className, children, ...props }) {
|
|
723
|
+
return /* @__PURE__ */ jsxs6(SelectPrimitive.Item, {
|
|
724
|
+
"data-density": density,
|
|
725
|
+
"data-slot": "select-item",
|
|
726
|
+
className: (state) => cn2("relative flex w-full cursor-default items-center gap-control-gap rounded-md py-1 pe-8 ps-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2", typeof className === "function" ? className(state) : className),
|
|
727
|
+
...props,
|
|
728
|
+
children: [
|
|
729
|
+
/* @__PURE__ */ jsx8(SelectPrimitive.ItemText, {
|
|
730
|
+
className: "flex flex-1 shrink-0 gap-2 whitespace-nowrap",
|
|
731
|
+
children
|
|
732
|
+
}),
|
|
733
|
+
/* @__PURE__ */ jsx8(SelectPrimitive.ItemIndicator, {
|
|
734
|
+
render: /* @__PURE__ */ jsx8("span", {
|
|
735
|
+
className: "pointer-events-none absolute end-2 flex size-4 items-center justify-center"
|
|
736
|
+
}),
|
|
737
|
+
children: /* @__PURE__ */ jsx8(CheckIcon2, {
|
|
738
|
+
className: "pointer-events-none"
|
|
739
|
+
})
|
|
740
|
+
})
|
|
741
|
+
]
|
|
742
|
+
});
|
|
743
|
+
}
|
|
744
|
+
function SelectSeparator2({ density, className, ...props }) {
|
|
745
|
+
return /* @__PURE__ */ jsx8(SelectPrimitive.Separator, {
|
|
746
|
+
"data-density": density,
|
|
747
|
+
"data-slot": "select-separator",
|
|
748
|
+
className: (state) => cn2("pointer-events-none -mx-1 my-1 h-px bg-border", typeof className === "function" ? className(state) : className),
|
|
749
|
+
...props
|
|
750
|
+
});
|
|
751
|
+
}
|
|
752
|
+
function SelectScrollUpButton2({ density, className, ...props }) {
|
|
753
|
+
return /* @__PURE__ */ jsx8(SelectPrimitive.ScrollUpArrow, {
|
|
754
|
+
"data-density": density,
|
|
755
|
+
"data-slot": "select-scroll-up-button",
|
|
756
|
+
className: (state) => cn2("top-0 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
|
|
757
|
+
...props,
|
|
758
|
+
children: /* @__PURE__ */ jsx8(ChevronUpIcon2, {})
|
|
759
|
+
});
|
|
760
|
+
}
|
|
761
|
+
function SelectScrollDownButton2({ density, className, ...props }) {
|
|
762
|
+
return /* @__PURE__ */ jsx8(SelectPrimitive.ScrollDownArrow, {
|
|
763
|
+
"data-density": density,
|
|
764
|
+
"data-slot": "select-scroll-down-button",
|
|
765
|
+
className: (state) => cn2("bottom-0 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
|
|
766
|
+
...props,
|
|
767
|
+
children: /* @__PURE__ */ jsx8(ChevronDownIcon3, {})
|
|
768
|
+
});
|
|
769
|
+
}
|
|
770
|
+
// src/components/DensityProvider.tsx
|
|
771
|
+
import { mergeProps as mergeProps2 } from "@base-ui/react/merge-props";
|
|
772
|
+
import { useRender as useRender2 } from "@base-ui/react/use-render";
|
|
773
|
+
import { jsx as jsx9 } from "react/jsx-runtime";
|
|
774
|
+
function DensityProvider2({
|
|
775
|
+
density = "comfortable",
|
|
776
|
+
className,
|
|
777
|
+
render,
|
|
778
|
+
...props
|
|
779
|
+
}) {
|
|
780
|
+
const element = useRender2({
|
|
781
|
+
defaultTagName: "div",
|
|
782
|
+
props: mergeProps2({ className: cn2("font-sans text-base leading-(--ag-leading)", className) }, props),
|
|
783
|
+
render,
|
|
784
|
+
state: { slot: "density-provider", density }
|
|
785
|
+
});
|
|
786
|
+
return /* @__PURE__ */ jsx9(DensityContext.Provider, {
|
|
787
|
+
value: density,
|
|
788
|
+
children: element
|
|
789
|
+
});
|
|
790
|
+
}
|
|
791
|
+
// src/hooks/useDocumentGuard.ts
|
|
792
|
+
import { useEffect } from "react";
|
|
793
|
+
var registrations = new WeakMap;
|
|
794
|
+
function useDocumentGuard(observe, ownerDocument) {
|
|
795
|
+
useEffect(() => {
|
|
796
|
+
if (process.env.NODE_ENV === "production")
|
|
797
|
+
return;
|
|
798
|
+
const target = ownerDocument ?? document;
|
|
799
|
+
let observers = registrations.get(target);
|
|
800
|
+
if (!observers) {
|
|
801
|
+
observers = new Map;
|
|
802
|
+
registrations.set(target, observers);
|
|
803
|
+
}
|
|
804
|
+
let registration = observers.get(observe);
|
|
805
|
+
if (!registration) {
|
|
806
|
+
registration = { users: 0, disconnect: observe(target) };
|
|
807
|
+
observers.set(observe, registration);
|
|
808
|
+
}
|
|
809
|
+
registration.users++;
|
|
810
|
+
return () => {
|
|
811
|
+
registration.users--;
|
|
812
|
+
if (!registration.users) {
|
|
813
|
+
registration.disconnect();
|
|
814
|
+
observers.delete(observe);
|
|
815
|
+
if (!observers.size)
|
|
816
|
+
registrations.delete(target);
|
|
817
|
+
}
|
|
818
|
+
};
|
|
819
|
+
}, [observe, ownerDocument]);
|
|
820
|
+
}
|
|
821
|
+
|
|
822
|
+
// src/utils/getLayoutAnimations.ts
|
|
823
|
+
function getLayoutAnimations(root) {
|
|
824
|
+
const document2 = root.ownerDocument ?? root;
|
|
825
|
+
const view = document2.defaultView;
|
|
826
|
+
if (!view)
|
|
827
|
+
return [];
|
|
828
|
+
const boundaries = [...root.querySelectorAll("[data-layout-boundary]")];
|
|
829
|
+
if (root instanceof view.Element && root.hasAttribute("data-layout-boundary"))
|
|
830
|
+
boundaries.push(root);
|
|
831
|
+
return document2.getAnimations().filter((animation) => {
|
|
832
|
+
if (animation.playState !== "running" || animation.effect?.getComputedTiming().iterations === Infinity)
|
|
833
|
+
return false;
|
|
834
|
+
const target = animation.effect instanceof view.KeyframeEffect ? animation.effect.target : null;
|
|
835
|
+
return target instanceof view.Element && boundaries.some((boundary) => boundary.contains(target) || target.contains(boundary));
|
|
836
|
+
});
|
|
837
|
+
}
|
|
838
|
+
|
|
839
|
+
// src/utils/collectLayoutViolations.ts
|
|
840
|
+
function identify(element) {
|
|
841
|
+
const slot = element.getAttribute("data-slot");
|
|
842
|
+
const name = element.getAttribute("aria-label") ?? element.textContent?.trim().slice(0, 60);
|
|
843
|
+
return `${element.localName}${element.id ? `#${element.id}` : slot ? `[data-slot="${slot}"]` : ""}${name ? ` "${name}"` : ""}`;
|
|
844
|
+
}
|
|
845
|
+
function isHidden(element, view) {
|
|
846
|
+
if (element.closest('[inert], [data-layout-exclude]:not([data-layout-exclude=""])'))
|
|
847
|
+
return true;
|
|
848
|
+
if (!element.checkVisibility({ visibilityProperty: true, opacityProperty: true }))
|
|
849
|
+
return true;
|
|
850
|
+
const style = view.getComputedStyle(element);
|
|
851
|
+
return style.clip === "rect(0px, 0px, 0px, 0px)" || style.clipPath === "inset(50%)";
|
|
852
|
+
}
|
|
853
|
+
function collectLayoutViolations2(root, tolerance = 1) {
|
|
854
|
+
const document2 = root.nodeType === Node.DOCUMENT_NODE ? root : root.ownerDocument;
|
|
855
|
+
const view = document2.defaultView;
|
|
856
|
+
if (!view)
|
|
857
|
+
return [];
|
|
858
|
+
const boundaries = [...root.querySelectorAll("[data-layout-boundary]")];
|
|
859
|
+
if (root instanceof view.Element && root.hasAttribute("data-layout-boundary"))
|
|
860
|
+
boundaries.unshift(root);
|
|
861
|
+
const violations = [];
|
|
862
|
+
for (const boundary of boundaries) {
|
|
863
|
+
if (isHidden(boundary, view))
|
|
864
|
+
continue;
|
|
865
|
+
const bounds = boundary.getBoundingClientRect();
|
|
866
|
+
const axis = boundary.getAttribute("data-layout-boundary");
|
|
867
|
+
for (const element of [boundary, ...boundary.querySelectorAll("*")]) {
|
|
868
|
+
if (isHidden(element, view) || element.parentElement?.closest("svg"))
|
|
869
|
+
continue;
|
|
870
|
+
let checkX = axis !== "y";
|
|
871
|
+
let checkY = axis !== "x";
|
|
872
|
+
const isControl = element.matches("button, a[href], input, select, textarea, [tabindex], [role=button]");
|
|
873
|
+
const elementBounds = element.getBoundingClientRect();
|
|
874
|
+
const limits = { left: bounds.left, right: bounds.right, top: bounds.top, bottom: bounds.bottom };
|
|
875
|
+
if (isControl) {
|
|
876
|
+
limits.left = Math.max(limits.left, elementBounds.left);
|
|
877
|
+
limits.right = Math.min(limits.right, elementBounds.right);
|
|
878
|
+
limits.top = Math.max(limits.top, elementBounds.top);
|
|
879
|
+
limits.bottom = Math.min(limits.bottom, elementBounds.bottom);
|
|
880
|
+
}
|
|
881
|
+
let ancestor = element === boundary ? null : element.parentElement;
|
|
882
|
+
let hidden = false;
|
|
883
|
+
while (ancestor && ancestor !== boundary) {
|
|
884
|
+
if (isHidden(ancestor, view)) {
|
|
885
|
+
hidden = true;
|
|
886
|
+
break;
|
|
887
|
+
}
|
|
888
|
+
const style = view.getComputedStyle(ancestor);
|
|
889
|
+
if (isControl) {
|
|
890
|
+
const clip = ancestor.getBoundingClientRect();
|
|
891
|
+
if (["hidden", "clip"].includes(style.overflowX)) {
|
|
892
|
+
limits.left = Math.max(limits.left, clip.left);
|
|
893
|
+
limits.right = Math.min(limits.right, clip.right);
|
|
894
|
+
}
|
|
895
|
+
if (["hidden", "clip"].includes(style.overflowY)) {
|
|
896
|
+
limits.top = Math.max(limits.top, clip.top);
|
|
897
|
+
limits.bottom = Math.min(limits.bottom, clip.bottom);
|
|
898
|
+
}
|
|
899
|
+
}
|
|
900
|
+
if (["auto", "scroll"].includes(style.overflowX))
|
|
901
|
+
checkX = false;
|
|
902
|
+
if (["auto", "scroll"].includes(style.overflowY))
|
|
903
|
+
checkY = false;
|
|
904
|
+
ancestor = ancestor.parentElement;
|
|
905
|
+
}
|
|
906
|
+
if (hidden)
|
|
907
|
+
continue;
|
|
908
|
+
const rectangles = [...element.getClientRects()];
|
|
909
|
+
const style = view.getComputedStyle(element);
|
|
910
|
+
if (style.textOverflow !== "ellipsis") {
|
|
911
|
+
for (const child of element.childNodes) {
|
|
912
|
+
if (child.nodeType !== Node.TEXT_NODE || !child.textContent?.trim())
|
|
913
|
+
continue;
|
|
914
|
+
const range = document2.createRange();
|
|
915
|
+
range.selectNodeContents(child);
|
|
916
|
+
rectangles.push(...range.getClientRects());
|
|
917
|
+
}
|
|
918
|
+
}
|
|
919
|
+
for (const edge of ["left", "right", "top", "bottom"]) {
|
|
920
|
+
if (edge === "left" || edge === "right" ? !checkX : !checkY)
|
|
921
|
+
continue;
|
|
922
|
+
const overflow = Math.max(0, ...rectangles.map((rect) => edge === "left" || edge === "top" ? limits[edge] - rect[edge] : rect[edge] - limits[edge]));
|
|
923
|
+
if (overflow <= tolerance)
|
|
924
|
+
continue;
|
|
925
|
+
violations.push({
|
|
926
|
+
boundary,
|
|
927
|
+
element,
|
|
928
|
+
edge,
|
|
929
|
+
overflow,
|
|
930
|
+
message: `${identify(element)} exceeds ${identify(boundary)} ${edge} edge by ${Math.round(overflow * 100) / 100}px`
|
|
931
|
+
});
|
|
932
|
+
}
|
|
933
|
+
}
|
|
934
|
+
}
|
|
935
|
+
return violations;
|
|
936
|
+
}
|
|
937
|
+
|
|
938
|
+
// src/utils/observeLayoutChanges.ts
|
|
939
|
+
function observeLayoutChanges(ownerDocument, selector, checkLayout) {
|
|
940
|
+
const view = ownerDocument.defaultView;
|
|
941
|
+
if (!view)
|
|
942
|
+
return () => {};
|
|
943
|
+
let isConnected = true;
|
|
944
|
+
let frame;
|
|
945
|
+
let needsRefresh = true;
|
|
946
|
+
let guarded = [];
|
|
947
|
+
const observed = new Set;
|
|
948
|
+
const schedule = () => {
|
|
949
|
+
if (!isConnected)
|
|
950
|
+
return;
|
|
951
|
+
frame ??= view.requestAnimationFrame(check);
|
|
952
|
+
};
|
|
953
|
+
const resizeObserver = new view.ResizeObserver(schedule);
|
|
954
|
+
const refresh = () => {
|
|
955
|
+
guarded = [...ownerDocument.querySelectorAll(selector)];
|
|
956
|
+
const targets = new Set(guarded.flatMap((element) => [element, ...element.querySelectorAll("*")]));
|
|
957
|
+
for (const element of observed) {
|
|
958
|
+
if (!targets.has(element)) {
|
|
959
|
+
resizeObserver.unobserve(element);
|
|
960
|
+
observed.delete(element);
|
|
961
|
+
}
|
|
962
|
+
}
|
|
963
|
+
for (const element of targets) {
|
|
964
|
+
if (!observed.has(element)) {
|
|
965
|
+
resizeObserver.observe(element);
|
|
966
|
+
observed.add(element);
|
|
967
|
+
}
|
|
968
|
+
}
|
|
969
|
+
needsRefresh = false;
|
|
970
|
+
};
|
|
971
|
+
const check = () => {
|
|
972
|
+
frame = undefined;
|
|
973
|
+
if (needsRefresh)
|
|
974
|
+
refresh();
|
|
975
|
+
checkLayout(guarded, schedule);
|
|
976
|
+
};
|
|
977
|
+
const mutations = new view.MutationObserver((records) => {
|
|
978
|
+
needsRefresh ||= records.some((record) => record.type === "childList" || record.type === "attributes");
|
|
979
|
+
schedule();
|
|
980
|
+
});
|
|
981
|
+
mutations.observe(ownerDocument.documentElement, {
|
|
982
|
+
subtree: true,
|
|
983
|
+
childList: true,
|
|
984
|
+
characterData: true,
|
|
985
|
+
attributes: true
|
|
986
|
+
});
|
|
987
|
+
view.addEventListener("resize", schedule);
|
|
988
|
+
ownerDocument.addEventListener("scroll", schedule, true);
|
|
989
|
+
ownerDocument.addEventListener("load", schedule, true);
|
|
990
|
+
ownerDocument.addEventListener("transitionend", schedule, true);
|
|
991
|
+
ownerDocument.addEventListener("animationend", schedule, true);
|
|
992
|
+
ownerDocument.fonts.addEventListener("loadingdone", schedule);
|
|
993
|
+
schedule();
|
|
994
|
+
return () => {
|
|
995
|
+
isConnected = false;
|
|
996
|
+
mutations.disconnect();
|
|
997
|
+
resizeObserver.disconnect();
|
|
998
|
+
if (frame !== undefined)
|
|
999
|
+
view.cancelAnimationFrame(frame);
|
|
1000
|
+
view.removeEventListener("resize", schedule);
|
|
1001
|
+
ownerDocument.removeEventListener("scroll", schedule, true);
|
|
1002
|
+
ownerDocument.removeEventListener("load", schedule, true);
|
|
1003
|
+
ownerDocument.removeEventListener("transitionend", schedule, true);
|
|
1004
|
+
ownerDocument.removeEventListener("animationend", schedule, true);
|
|
1005
|
+
ownerDocument.fonts.removeEventListener("loadingdone", schedule);
|
|
1006
|
+
};
|
|
1007
|
+
}
|
|
1008
|
+
|
|
1009
|
+
// src/utils/observeLayoutGuards.ts
|
|
1010
|
+
function throwViolation(error) {
|
|
1011
|
+
throw error;
|
|
1012
|
+
}
|
|
1013
|
+
function observeLayoutGuards(document2, report = throwViolation) {
|
|
1014
|
+
const pending = new WeakSet;
|
|
1015
|
+
let previous = "";
|
|
1016
|
+
return observeLayoutChanges(document2, "[data-layout-boundary]", (_elements, schedule) => {
|
|
1017
|
+
const animations = getLayoutAnimations(document2);
|
|
1018
|
+
for (const animation of animations) {
|
|
1019
|
+
if (pending.has(animation))
|
|
1020
|
+
continue;
|
|
1021
|
+
pending.add(animation);
|
|
1022
|
+
const settled = () => {
|
|
1023
|
+
pending.delete(animation);
|
|
1024
|
+
schedule();
|
|
1025
|
+
};
|
|
1026
|
+
animation.finished.then(settled, settled);
|
|
1027
|
+
}
|
|
1028
|
+
if (animations.length)
|
|
1029
|
+
return;
|
|
1030
|
+
const message = collectLayoutViolations2(document2).map((violation) => violation.message).join("; ");
|
|
1031
|
+
const hasChanged = message !== previous;
|
|
1032
|
+
previous = message;
|
|
1033
|
+
if (message && hasChanged)
|
|
1034
|
+
report(new Error(`[shadcn] Layout containment: ${message}`));
|
|
1035
|
+
});
|
|
1036
|
+
}
|
|
1037
|
+
|
|
1038
|
+
// src/components/LayoutGuard.tsx
|
|
1039
|
+
"use client";
|
|
1040
|
+
function LayoutGuard2({ ownerDocument }) {
|
|
1041
|
+
useDocumentGuard(observeLayoutGuards, ownerDocument);
|
|
1042
|
+
return null;
|
|
1043
|
+
}
|
|
1044
|
+
|
|
1045
|
+
// src/components/ThemeProvider.tsx
|
|
1046
|
+
import { useMemo } from "react";
|
|
1047
|
+
import { useIsomorphicLayoutEffect, useTernaryDarkMode } from "usehooks-ts";
|
|
1048
|
+
|
|
1049
|
+
// src/utils/observeScrollGuards.ts
|
|
1050
|
+
function throwViolation2(error) {
|
|
1051
|
+
throw error;
|
|
1052
|
+
}
|
|
1053
|
+
function getViolation(element, view) {
|
|
1054
|
+
if (!element.getClientRects().length)
|
|
1055
|
+
return;
|
|
1056
|
+
const style = view.getComputedStyle(element);
|
|
1057
|
+
if (style.visibility !== "visible")
|
|
1058
|
+
return;
|
|
1059
|
+
const axes = [];
|
|
1060
|
+
if (["auto", "scroll"].includes(style.overflowX) && element.scrollWidth > element.clientWidth) {
|
|
1061
|
+
axes.push(`horizontal: ${element.scrollWidth}px > ${element.clientWidth}px`);
|
|
1062
|
+
}
|
|
1063
|
+
if (["auto", "scroll"].includes(style.overflowY) && element.scrollHeight > element.clientHeight) {
|
|
1064
|
+
axes.push(`vertical: ${element.scrollHeight}px > ${element.clientHeight}px`);
|
|
1065
|
+
}
|
|
1066
|
+
if (!axes.length)
|
|
1067
|
+
return;
|
|
1068
|
+
const slot = element.getAttribute("data-slot");
|
|
1069
|
+
const identity = element.id ? ` id="${element.id}"` : slot ? ` data-slot="${slot}"` : "";
|
|
1070
|
+
return `<${element.localName}${identity}> (${axes.join(", ")})`;
|
|
1071
|
+
}
|
|
1072
|
+
function observeScrollGuards(ownerDocument, reportViolation = throwViolation2) {
|
|
1073
|
+
const reported = new WeakSet;
|
|
1074
|
+
return observeLayoutChanges(ownerDocument, '[data-scroll="none"]', (guarded) => {
|
|
1075
|
+
const view = ownerDocument.defaultView;
|
|
1076
|
+
const violations = [];
|
|
1077
|
+
for (const element of guarded) {
|
|
1078
|
+
const violation = getViolation(element, view);
|
|
1079
|
+
if (!violation)
|
|
1080
|
+
reported.delete(element);
|
|
1081
|
+
else if (!reported.has(element)) {
|
|
1082
|
+
reported.add(element);
|
|
1083
|
+
violations.push(violation);
|
|
1084
|
+
}
|
|
1085
|
+
}
|
|
1086
|
+
if (violations.length)
|
|
1087
|
+
reportViolation(new Error('[shadcn] Scrolling is forbidden by data-scroll="none": ' + violations.join("; ") + ". " + "Move scrolling content into a nested ScrollArea or another explicit scroll viewport."));
|
|
1088
|
+
});
|
|
1089
|
+
}
|
|
1090
|
+
|
|
1091
|
+
// src/components/ScrollGuard.tsx
|
|
1092
|
+
"use client";
|
|
1093
|
+
function ScrollGuard2({ ownerDocument }) {
|
|
1094
|
+
useDocumentGuard(observeScrollGuards, ownerDocument);
|
|
1095
|
+
return null;
|
|
1096
|
+
}
|
|
1097
|
+
|
|
1098
|
+
// src/components/ThemeProvider.tsx
|
|
1099
|
+
import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
1100
|
+
function StoredThemeProvider({
|
|
1101
|
+
children,
|
|
1102
|
+
defaultTheme = "system",
|
|
1103
|
+
storageKey = "shadcn-alexgorbatchev-theme",
|
|
1104
|
+
forcedTheme
|
|
1105
|
+
}) {
|
|
1106
|
+
const { isDarkMode, ternaryDarkMode, setTernaryDarkMode } = useTernaryDarkMode({
|
|
1107
|
+
defaultValue: defaultTheme,
|
|
1108
|
+
localStorageKey: storageKey
|
|
1109
|
+
});
|
|
1110
|
+
return /* @__PURE__ */ jsx10(ThemePalette, {
|
|
1111
|
+
theme: forcedTheme ?? ternaryDarkMode,
|
|
1112
|
+
resolvedTheme: forcedTheme ?? (isDarkMode ? "dark" : "light"),
|
|
1113
|
+
setTheme: setTernaryDarkMode,
|
|
1114
|
+
children
|
|
1115
|
+
});
|
|
1116
|
+
}
|
|
1117
|
+
function ThemePalette({
|
|
1118
|
+
children,
|
|
1119
|
+
theme,
|
|
1120
|
+
resolvedTheme,
|
|
1121
|
+
setTheme
|
|
1122
|
+
}) {
|
|
1123
|
+
useIsomorphicLayoutEffect(() => {
|
|
1124
|
+
document.documentElement.dataset.theme = resolvedTheme;
|
|
1125
|
+
document.documentElement.style.colorScheme = resolvedTheme;
|
|
1126
|
+
}, [resolvedTheme]);
|
|
1127
|
+
const value = useMemo(() => ({ theme, resolvedTheme, setTheme }), [theme, resolvedTheme, setTheme]);
|
|
1128
|
+
return /* @__PURE__ */ jsxs7(ThemeContext.Provider, {
|
|
1129
|
+
value,
|
|
1130
|
+
children: [
|
|
1131
|
+
/* @__PURE__ */ jsx10(ScrollGuard2, {}),
|
|
1132
|
+
/* @__PURE__ */ jsx10(LayoutGuard2, {}),
|
|
1133
|
+
children
|
|
1134
|
+
]
|
|
1135
|
+
});
|
|
1136
|
+
}
|
|
1137
|
+
function ControlledThemeProvider({
|
|
1138
|
+
children,
|
|
1139
|
+
controlledTheme,
|
|
1140
|
+
forcedTheme
|
|
1141
|
+
}) {
|
|
1142
|
+
const isDark = useMediaQuery("(prefers-color-scheme: dark)");
|
|
1143
|
+
const { theme, setTheme } = controlledTheme;
|
|
1144
|
+
const resolvedTheme = forcedTheme ?? (theme === "system" ? isDark ? "dark" : "light" : theme);
|
|
1145
|
+
return /* @__PURE__ */ jsx10(ThemePalette, {
|
|
1146
|
+
theme: forcedTheme ?? theme,
|
|
1147
|
+
resolvedTheme,
|
|
1148
|
+
setTheme,
|
|
1149
|
+
children
|
|
1150
|
+
});
|
|
1151
|
+
}
|
|
1152
|
+
function ThemeProvider2(props) {
|
|
1153
|
+
if (props.controlledTheme)
|
|
1154
|
+
return /* @__PURE__ */ jsx10(ControlledThemeProvider, {
|
|
1155
|
+
...props,
|
|
1156
|
+
controlledTheme: props.controlledTheme
|
|
1157
|
+
});
|
|
1158
|
+
return /* @__PURE__ */ jsx10(StoredThemeProvider, {
|
|
1159
|
+
...props
|
|
1160
|
+
});
|
|
1161
|
+
}
|
|
1162
|
+
// src/hooks/useComboboxAnchor.ts
|
|
1163
|
+
import { useRef } from "react";
|
|
1164
|
+
function useComboboxAnchor2() {
|
|
1165
|
+
return useRef(null);
|
|
1166
|
+
}
|
|
1167
|
+
// src/components/AspectRatio.tsx
|
|
1168
|
+
import { jsx as jsx11 } from "react/jsx-runtime";
|
|
1169
|
+
function AspectRatio2({ ratio, className, style, ...props }) {
|
|
1170
|
+
return /* @__PURE__ */ jsx11("div", {
|
|
1171
|
+
"data-slot": "aspect-ratio",
|
|
1172
|
+
className: cn2("relative", className),
|
|
1173
|
+
style: { aspectRatio: ratio, ...style },
|
|
1174
|
+
...props
|
|
1175
|
+
});
|
|
1176
|
+
}
|
|
1177
|
+
// src/components/Breadcrumb.tsx
|
|
1178
|
+
import { ChevronRightIcon, MoreHorizontalIcon } from "lucide-react";
|
|
1179
|
+
import { mergeProps as mergeProps3 } from "@base-ui/react/merge-props";
|
|
1180
|
+
import { useRender as useRender3 } from "@base-ui/react/use-render";
|
|
1181
|
+
import { jsx as jsx12, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
1182
|
+
function Breadcrumb2({ density, className, ...props }) {
|
|
1183
|
+
return /* @__PURE__ */ jsx12("nav", {
|
|
1184
|
+
"aria-label": "breadcrumb",
|
|
1185
|
+
"data-density": density,
|
|
1186
|
+
"data-slot": "breadcrumb",
|
|
1187
|
+
className: cn2(className),
|
|
1188
|
+
...props
|
|
1189
|
+
});
|
|
1190
|
+
}
|
|
1191
|
+
function BreadcrumbList2({ density, className, ...props }) {
|
|
1192
|
+
return /* @__PURE__ */ jsx12("ol", {
|
|
1193
|
+
"data-density": density,
|
|
1194
|
+
"data-slot": "breadcrumb-list",
|
|
1195
|
+
className: cn2("flex flex-wrap items-center gap-control-gap text-sm wrap-break-word text-muted-foreground", className),
|
|
1196
|
+
...props
|
|
1197
|
+
});
|
|
1198
|
+
}
|
|
1199
|
+
function BreadcrumbItem2({ density, className, ...props }) {
|
|
1200
|
+
return /* @__PURE__ */ jsx12("li", {
|
|
1201
|
+
"data-density": density,
|
|
1202
|
+
"data-slot": "breadcrumb-item",
|
|
1203
|
+
className: cn2("inline-flex items-center gap-1", className),
|
|
1204
|
+
...props
|
|
1205
|
+
});
|
|
1206
|
+
}
|
|
1207
|
+
function BreadcrumbLink2({ density, className, render, ...props }) {
|
|
1208
|
+
return useRender3({
|
|
1209
|
+
defaultTagName: "a",
|
|
1210
|
+
props: mergeProps3({
|
|
1211
|
+
className: cn2("transition-colors hover:text-foreground", className)
|
|
1212
|
+
}, props),
|
|
1213
|
+
render,
|
|
1214
|
+
state: {
|
|
1215
|
+
density,
|
|
1216
|
+
slot: "breadcrumb-link"
|
|
1217
|
+
}
|
|
1218
|
+
});
|
|
1219
|
+
}
|
|
1220
|
+
function BreadcrumbPage2({ density, className, ...props }) {
|
|
1221
|
+
return /* @__PURE__ */ jsx12("span", {
|
|
1222
|
+
"data-density": density,
|
|
1223
|
+
"data-slot": "breadcrumb-page",
|
|
1224
|
+
role: "link",
|
|
1225
|
+
"aria-disabled": "true",
|
|
1226
|
+
"aria-current": "page",
|
|
1227
|
+
className: cn2("font-normal text-foreground", className),
|
|
1228
|
+
...props
|
|
1229
|
+
});
|
|
1230
|
+
}
|
|
1231
|
+
function BreadcrumbSeparator2({ density, children, className, ...props }) {
|
|
1232
|
+
return /* @__PURE__ */ jsx12("li", {
|
|
1233
|
+
"data-density": density,
|
|
1234
|
+
"data-slot": "breadcrumb-separator",
|
|
1235
|
+
role: "presentation",
|
|
1236
|
+
"aria-hidden": "true",
|
|
1237
|
+
className: cn2("[&>svg]:size-3.5", className),
|
|
1238
|
+
...props,
|
|
1239
|
+
children: children ?? /* @__PURE__ */ jsx12(ChevronRightIcon, {
|
|
1240
|
+
className: "rtl:rotate-180"
|
|
1241
|
+
})
|
|
1242
|
+
});
|
|
1243
|
+
}
|
|
1244
|
+
function BreadcrumbEllipsis2({ density, className, ...props }) {
|
|
1245
|
+
return /* @__PURE__ */ jsxs8("span", {
|
|
1246
|
+
"data-density": density,
|
|
1247
|
+
"data-slot": "breadcrumb-ellipsis",
|
|
1248
|
+
role: "presentation",
|
|
1249
|
+
"aria-hidden": "true",
|
|
1250
|
+
className: cn2("flex size-5 items-center justify-center [&>svg]:size-4", className),
|
|
1251
|
+
...props,
|
|
1252
|
+
children: [
|
|
1253
|
+
/* @__PURE__ */ jsx12(MoreHorizontalIcon, {}),
|
|
1254
|
+
/* @__PURE__ */ jsx12("span", {
|
|
1255
|
+
className: "sr-only",
|
|
1256
|
+
children: "More"
|
|
1257
|
+
})
|
|
1258
|
+
]
|
|
1259
|
+
});
|
|
1260
|
+
}
|
|
1261
|
+
// src/components/ButtonGroup.tsx
|
|
1262
|
+
import { mergeProps as mergeProps4 } from "@base-ui/react/merge-props";
|
|
1263
|
+
import { useRender as useRender4 } from "@base-ui/react/use-render";
|
|
1264
|
+
import { cva } from "class-variance-authority";
|
|
1265
|
+
import { jsx as jsx13 } from "react/jsx-runtime";
|
|
1266
|
+
var buttonGroupVariants2 = cva("flex w-fit items-stretch *:focus-visible:relative *:focus-visible:z-10 has-[>[data-slot=button-group]]:gap-2 has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-e-sm [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1", {
|
|
1267
|
+
variants: {
|
|
1268
|
+
layout: {
|
|
1269
|
+
content: "",
|
|
1270
|
+
equal: "grid w-full grid-flow-col auto-cols-fr data-[orientation=vertical]:grid-flow-row"
|
|
1271
|
+
},
|
|
1272
|
+
orientation: {
|
|
1273
|
+
horizontal: "*:data-slot:rounded-e-none [&>[data-slot]:not(:has(~[data-slot]))]:rounded-e-sm! [&>[data-slot]~[data-slot]]:rounded-s-none [&>[data-slot]~[data-slot]]:border-s-0",
|
|
1274
|
+
vertical: "flex-col *:data-slot:rounded-b-none [&>[data-slot]:not(:has(~[data-slot]))]:rounded-b-sm! [&>[data-slot]~[data-slot]]:rounded-t-none [&>[data-slot]~[data-slot]]:border-t-0"
|
|
1275
|
+
}
|
|
1276
|
+
},
|
|
1277
|
+
defaultVariants: {
|
|
1278
|
+
orientation: "horizontal"
|
|
1279
|
+
}
|
|
1280
|
+
});
|
|
1281
|
+
function ButtonGroup2({
|
|
1282
|
+
density,
|
|
1283
|
+
className,
|
|
1284
|
+
orientation,
|
|
1285
|
+
layout = "content",
|
|
1286
|
+
...props
|
|
1287
|
+
}) {
|
|
1288
|
+
return /* @__PURE__ */ jsx13("div", {
|
|
1289
|
+
role: "group",
|
|
1290
|
+
"data-density": density,
|
|
1291
|
+
"data-slot": "button-group",
|
|
1292
|
+
"data-orientation": orientation,
|
|
1293
|
+
className: cn2(buttonGroupVariants2({ orientation, layout }), className),
|
|
1294
|
+
...props
|
|
1295
|
+
});
|
|
1296
|
+
}
|
|
1297
|
+
function ButtonGroupText2({ density, className, render, ...props }) {
|
|
1298
|
+
return useRender4({
|
|
1299
|
+
defaultTagName: "div",
|
|
1300
|
+
props: mergeProps4({
|
|
1301
|
+
className: cn2("flex items-center gap-2 rounded-sm border bg-muted px-control-x text-sm font-medium [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", className)
|
|
1302
|
+
}, props),
|
|
1303
|
+
render,
|
|
1304
|
+
state: {
|
|
1305
|
+
density,
|
|
1306
|
+
slot: "button-group-text"
|
|
1307
|
+
}
|
|
1308
|
+
});
|
|
1309
|
+
}
|
|
1310
|
+
function ButtonGroupSeparator2({
|
|
1311
|
+
density,
|
|
1312
|
+
className,
|
|
1313
|
+
orientation = "vertical",
|
|
1314
|
+
...props
|
|
1315
|
+
}) {
|
|
1316
|
+
return /* @__PURE__ */ jsx13(Separator2, {
|
|
1317
|
+
"data-density": density,
|
|
1318
|
+
"data-slot": "button-group-separator",
|
|
1319
|
+
orientation,
|
|
1320
|
+
className: (state) => cn2("relative self-stretch bg-input data-[orientation=horizontal]:mx-px data-[orientation=horizontal]:w-auto data-[orientation=vertical]:my-px data-[orientation=vertical]:h-auto", typeof className === "function" ? className(state) : className),
|
|
1321
|
+
...props
|
|
1322
|
+
});
|
|
1323
|
+
}
|
|
1324
|
+
// src/components/Item.tsx
|
|
1325
|
+
import { mergeProps as mergeProps5 } from "@base-ui/react/merge-props";
|
|
1326
|
+
import { useRender as useRender5 } from "@base-ui/react/use-render";
|
|
1327
|
+
import { cva as cva2 } from "class-variance-authority";
|
|
1328
|
+
import { jsx as jsx14 } from "react/jsx-runtime";
|
|
1329
|
+
function ItemGroup2({ density, className, ...props }) {
|
|
1330
|
+
return /* @__PURE__ */ jsx14("div", {
|
|
1331
|
+
role: "list",
|
|
1332
|
+
"data-density": density,
|
|
1333
|
+
"data-slot": "item-group",
|
|
1334
|
+
className: cn2("group/item-group flex w-full flex-col gap-4 has-data-[size=sm]:gap-2.5 has-data-[size=xs]:gap-2", className),
|
|
1335
|
+
...props
|
|
1336
|
+
});
|
|
1337
|
+
}
|
|
1338
|
+
function ItemSeparator2({ density, className, ...props }) {
|
|
1339
|
+
return /* @__PURE__ */ jsx14(Separator2, {
|
|
1340
|
+
"data-density": density,
|
|
1341
|
+
"data-slot": "item-separator",
|
|
1342
|
+
orientation: "horizontal",
|
|
1343
|
+
className: (state) => cn2("my-2", typeof className === "function" ? className(state) : className),
|
|
1344
|
+
...props
|
|
1345
|
+
});
|
|
1346
|
+
}
|
|
1347
|
+
var itemVariants = cva2("group/item flex w-full flex-wrap items-center rounded-sm border text-sm transition-colors duration-100 outline-none focus-visible:border-ring focus-visible:ring-1 focus-visible:ring-ring [a]:transition-colors [a]:hover:bg-muted", {
|
|
1348
|
+
variants: {
|
|
1349
|
+
variant: {
|
|
1350
|
+
default: "border-transparent",
|
|
1351
|
+
outline: "border-border",
|
|
1352
|
+
muted: "border-transparent bg-muted/50"
|
|
1353
|
+
},
|
|
1354
|
+
size: {
|
|
1355
|
+
default: "gap-panel p-panel",
|
|
1356
|
+
sm: "gap-panel p-panel",
|
|
1357
|
+
xs: "gap-2 px-control-x py-2 in-data-[slot=dropdown-menu-content]:p-0"
|
|
1358
|
+
}
|
|
1359
|
+
},
|
|
1360
|
+
defaultVariants: {
|
|
1361
|
+
variant: "default",
|
|
1362
|
+
size: "default"
|
|
1363
|
+
}
|
|
1364
|
+
});
|
|
1365
|
+
function Item2({
|
|
1366
|
+
density,
|
|
1367
|
+
className,
|
|
1368
|
+
variant = "default",
|
|
1369
|
+
size = "default",
|
|
1370
|
+
render,
|
|
1371
|
+
...props
|
|
1372
|
+
}) {
|
|
1373
|
+
return useRender5({
|
|
1374
|
+
defaultTagName: "div",
|
|
1375
|
+
props: mergeProps5({
|
|
1376
|
+
className: cn2(itemVariants({ variant, size, className }))
|
|
1377
|
+
}, props),
|
|
1378
|
+
render,
|
|
1379
|
+
state: {
|
|
1380
|
+
density,
|
|
1381
|
+
slot: "item",
|
|
1382
|
+
variant,
|
|
1383
|
+
size
|
|
1384
|
+
}
|
|
1385
|
+
});
|
|
1386
|
+
}
|
|
1387
|
+
var itemMediaVariants = cva2("flex shrink-0 items-center justify-center gap-2 group-has-data-[slot=item-description]/item:translate-y-0.5 group-has-data-[slot=item-description]/item:self-start [&_svg]:pointer-events-none", {
|
|
1388
|
+
variants: {
|
|
1389
|
+
variant: {
|
|
1390
|
+
default: "bg-transparent",
|
|
1391
|
+
icon: "[&_svg:not([class*='size-'])]:size-4",
|
|
1392
|
+
image: "size-10 overflow-hidden rounded-sm group-data-[size=sm]/item:size-8 group-data-[size=xs]/item:size-6 [&_img]:size-full [&_img]:object-cover"
|
|
1393
|
+
}
|
|
1394
|
+
},
|
|
1395
|
+
defaultVariants: {
|
|
1396
|
+
variant: "default"
|
|
1397
|
+
}
|
|
1398
|
+
});
|
|
1399
|
+
function ItemMedia2({ density, className, variant = "default", ...props }) {
|
|
1400
|
+
return /* @__PURE__ */ jsx14("div", {
|
|
1401
|
+
"data-density": density,
|
|
1402
|
+
"data-slot": "item-media",
|
|
1403
|
+
"data-variant": variant,
|
|
1404
|
+
className: cn2(itemMediaVariants({ variant, className })),
|
|
1405
|
+
...props
|
|
1406
|
+
});
|
|
1407
|
+
}
|
|
1408
|
+
function ItemContent2({ density, className, ...props }) {
|
|
1409
|
+
return /* @__PURE__ */ jsx14("div", {
|
|
1410
|
+
"data-density": density,
|
|
1411
|
+
"data-slot": "item-content",
|
|
1412
|
+
className: cn2("flex flex-1 flex-col gap-1 group-data-[size=xs]/item:gap-0 [&+[data-slot=item-content]]:flex-none", className),
|
|
1413
|
+
...props
|
|
1414
|
+
});
|
|
1415
|
+
}
|
|
1416
|
+
function ItemTitle2({ density, className, ...props }) {
|
|
1417
|
+
return /* @__PURE__ */ jsx14("div", {
|
|
1418
|
+
"data-density": density,
|
|
1419
|
+
"data-slot": "item-title",
|
|
1420
|
+
className: cn2("line-clamp-1 flex w-fit items-center gap-2 text-sm leading-snug font-medium underline-offset-4", className),
|
|
1421
|
+
...props
|
|
1422
|
+
});
|
|
1423
|
+
}
|
|
1424
|
+
function ItemDescription2({ density, className, ...props }) {
|
|
1425
|
+
return /* @__PURE__ */ jsx14("p", {
|
|
1426
|
+
"data-density": density,
|
|
1427
|
+
"data-slot": "item-description",
|
|
1428
|
+
className: cn2("line-clamp-2 text-start text-sm leading-normal font-normal text-muted-foreground group-data-[size=xs]/item:text-xs [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary", className),
|
|
1429
|
+
...props
|
|
1430
|
+
});
|
|
1431
|
+
}
|
|
1432
|
+
function ItemActions2({ density, className, ...props }) {
|
|
1433
|
+
return /* @__PURE__ */ jsx14("div", {
|
|
1434
|
+
"data-density": density,
|
|
1435
|
+
"data-slot": "item-actions",
|
|
1436
|
+
className: cn2("flex items-center gap-2", className),
|
|
1437
|
+
...props
|
|
1438
|
+
});
|
|
1439
|
+
}
|
|
1440
|
+
function ItemHeader2({ density, className, ...props }) {
|
|
1441
|
+
return /* @__PURE__ */ jsx14("div", {
|
|
1442
|
+
"data-density": density,
|
|
1443
|
+
"data-slot": "item-header",
|
|
1444
|
+
className: cn2("flex basis-full items-center justify-between gap-2", className),
|
|
1445
|
+
...props
|
|
1446
|
+
});
|
|
1447
|
+
}
|
|
1448
|
+
function ItemFooter2({ density, className, ...props }) {
|
|
1449
|
+
return /* @__PURE__ */ jsx14("div", {
|
|
1450
|
+
"data-density": density,
|
|
1451
|
+
"data-slot": "item-footer",
|
|
1452
|
+
className: cn2("flex basis-full items-center justify-between gap-2", className),
|
|
1453
|
+
...props
|
|
1454
|
+
});
|
|
1455
|
+
}
|
|
1456
|
+
// src/components/Pagination.tsx
|
|
1457
|
+
import { ChevronLeftIcon, ChevronRightIcon as ChevronRightIcon2, MoreHorizontalIcon as MoreHorizontalIcon2 } from "lucide-react";
|
|
1458
|
+
import { jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
1459
|
+
function Pagination2({ density, className, ...props }) {
|
|
1460
|
+
return /* @__PURE__ */ jsx15("nav", {
|
|
1461
|
+
role: "navigation",
|
|
1462
|
+
"aria-label": "pagination",
|
|
1463
|
+
"data-density": density,
|
|
1464
|
+
"data-slot": "pagination",
|
|
1465
|
+
className: cn2("mx-auto flex w-full justify-center", className),
|
|
1466
|
+
...props
|
|
1467
|
+
});
|
|
1468
|
+
}
|
|
1469
|
+
function PaginationContent2({ density, className, ...props }) {
|
|
1470
|
+
return /* @__PURE__ */ jsx15("ul", {
|
|
1471
|
+
"data-density": density,
|
|
1472
|
+
"data-slot": "pagination-content",
|
|
1473
|
+
className: cn2("flex items-center gap-0.5", className),
|
|
1474
|
+
...props
|
|
1475
|
+
});
|
|
1476
|
+
}
|
|
1477
|
+
function PaginationItem2({ ...props }) {
|
|
1478
|
+
return /* @__PURE__ */ jsx15("li", {
|
|
1479
|
+
"data-slot": "pagination-item",
|
|
1480
|
+
...props
|
|
1481
|
+
});
|
|
1482
|
+
}
|
|
1483
|
+
function PaginationLink2({
|
|
1484
|
+
density,
|
|
1485
|
+
className,
|
|
1486
|
+
isActive,
|
|
1487
|
+
size = "icon",
|
|
1488
|
+
...props
|
|
1489
|
+
}) {
|
|
1490
|
+
return /* @__PURE__ */ jsx15("a", {
|
|
1491
|
+
"data-density": density,
|
|
1492
|
+
className: cn2(buttonVariants2({ variant: isActive ? "outline" : "ghost", size }), className),
|
|
1493
|
+
"aria-current": isActive ? "page" : undefined,
|
|
1494
|
+
"data-slot": "pagination-link",
|
|
1495
|
+
"data-active": isActive,
|
|
1496
|
+
...props
|
|
1497
|
+
});
|
|
1498
|
+
}
|
|
1499
|
+
function PaginationPrevious2({
|
|
1500
|
+
density,
|
|
1501
|
+
className,
|
|
1502
|
+
text = "Previous",
|
|
1503
|
+
...props
|
|
1504
|
+
}) {
|
|
1505
|
+
return /* @__PURE__ */ jsxs9(PaginationLink2, {
|
|
1506
|
+
density,
|
|
1507
|
+
"aria-label": "Go to previous page",
|
|
1508
|
+
size: "default",
|
|
1509
|
+
className: cn2("ps-1.5!", className),
|
|
1510
|
+
...props,
|
|
1511
|
+
children: [
|
|
1512
|
+
/* @__PURE__ */ jsx15(ChevronLeftIcon, {
|
|
1513
|
+
"data-icon": "inline-start",
|
|
1514
|
+
className: "rtl:rotate-180"
|
|
1515
|
+
}),
|
|
1516
|
+
/* @__PURE__ */ jsx15("span", {
|
|
1517
|
+
className: "hidden sm:block",
|
|
1518
|
+
children: text
|
|
1519
|
+
})
|
|
1520
|
+
]
|
|
1521
|
+
});
|
|
1522
|
+
}
|
|
1523
|
+
function PaginationNext2({ density, className, text = "Next", ...props }) {
|
|
1524
|
+
return /* @__PURE__ */ jsxs9(PaginationLink2, {
|
|
1525
|
+
density,
|
|
1526
|
+
"aria-label": "Go to next page",
|
|
1527
|
+
size: "default",
|
|
1528
|
+
className: cn2("pe-1.5!", className),
|
|
1529
|
+
...props,
|
|
1530
|
+
children: [
|
|
1531
|
+
/* @__PURE__ */ jsx15("span", {
|
|
1532
|
+
className: "hidden sm:block",
|
|
1533
|
+
children: text
|
|
1534
|
+
}),
|
|
1535
|
+
/* @__PURE__ */ jsx15(ChevronRightIcon2, {
|
|
1536
|
+
"data-icon": "inline-end",
|
|
1537
|
+
className: "rtl:rotate-180"
|
|
1538
|
+
})
|
|
1539
|
+
]
|
|
1540
|
+
});
|
|
1541
|
+
}
|
|
1542
|
+
function PaginationEllipsis2({ density, className, ...props }) {
|
|
1543
|
+
return /* @__PURE__ */ jsxs9("span", {
|
|
1544
|
+
"aria-hidden": true,
|
|
1545
|
+
"data-density": density,
|
|
1546
|
+
"data-slot": "pagination-ellipsis",
|
|
1547
|
+
className: cn2("flex size-control items-center justify-center [&_svg:not([class*='size-'])]:size-4", className),
|
|
1548
|
+
...props,
|
|
1549
|
+
children: [
|
|
1550
|
+
/* @__PURE__ */ jsx15(MoreHorizontalIcon2, {}),
|
|
1551
|
+
/* @__PURE__ */ jsx15("span", {
|
|
1552
|
+
className: "sr-only",
|
|
1553
|
+
children: "More pages"
|
|
1554
|
+
})
|
|
1555
|
+
]
|
|
1556
|
+
});
|
|
1557
|
+
}
|
|
1558
|
+
// src/components/ScrollArea.tsx
|
|
1559
|
+
import { ScrollArea as ScrollAreaPrimitive } from "@base-ui/react/scroll-area";
|
|
1560
|
+
import { jsx as jsx16, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
1561
|
+
function ScrollArea2({
|
|
1562
|
+
density,
|
|
1563
|
+
className,
|
|
1564
|
+
children,
|
|
1565
|
+
scrollbars = /* @__PURE__ */ jsx16(ScrollBar2, {}),
|
|
1566
|
+
...props
|
|
1567
|
+
}) {
|
|
1568
|
+
return /* @__PURE__ */ jsxs10(ScrollAreaPrimitive.Root, {
|
|
1569
|
+
"data-density": density,
|
|
1570
|
+
"data-slot": "scroll-area",
|
|
1571
|
+
className: (state) => cn2("relative flex min-h-0 flex-col", typeof className === "function" ? className(state) : className),
|
|
1572
|
+
...props,
|
|
1573
|
+
children: [
|
|
1574
|
+
/* @__PURE__ */ jsx16(ScrollAreaPrimitive.Viewport, {
|
|
1575
|
+
"data-slot": "scroll-area-viewport",
|
|
1576
|
+
className: "size-full min-h-0 flex-1 rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:outline-1",
|
|
1577
|
+
children
|
|
1578
|
+
}),
|
|
1579
|
+
scrollbars,
|
|
1580
|
+
/* @__PURE__ */ jsx16(ScrollAreaPrimitive.Corner, {})
|
|
1581
|
+
]
|
|
1582
|
+
});
|
|
1583
|
+
}
|
|
1584
|
+
function ScrollBar2({ density, className, orientation = "vertical", ...props }) {
|
|
1585
|
+
return /* @__PURE__ */ jsx16(ScrollAreaPrimitive.Scrollbar, {
|
|
1586
|
+
"data-density": density,
|
|
1587
|
+
"data-slot": "scroll-area-scrollbar",
|
|
1588
|
+
"data-orientation": orientation,
|
|
1589
|
+
orientation,
|
|
1590
|
+
className: (state) => cn2("flex touch-none p-px transition-colors select-none data-[orientation=horizontal]:h-2.5 data-[orientation=horizontal]:flex-col data-[orientation=horizontal]:border-t data-[orientation=horizontal]:border-t-transparent data-[orientation=vertical]:w-2.5 data-[orientation=vertical]:border-s data-[orientation=vertical]:border-s-transparent", typeof className === "function" ? className(state) : className),
|
|
1591
|
+
...props,
|
|
1592
|
+
children: /* @__PURE__ */ jsx16(ScrollAreaPrimitive.Thumb, {
|
|
1593
|
+
"data-slot": "scroll-area-thumb",
|
|
1594
|
+
className: "relative flex-1 rounded-full bg-border"
|
|
1595
|
+
})
|
|
1596
|
+
});
|
|
1597
|
+
}
|
|
1598
|
+
// src/components/Drawer.tsx
|
|
1599
|
+
import { useMemo as useMemo2 } from "react";
|
|
1600
|
+
|
|
1601
|
+
// src/drawer/DrawerContext.ts
|
|
1602
|
+
import { createContext } from "react";
|
|
1603
|
+
var DrawerContext = createContext(null);
|
|
1604
|
+
|
|
1605
|
+
// src/hooks/useDrawer.ts
|
|
1606
|
+
import { useContext } from "react";
|
|
1607
|
+
function useDrawer() {
|
|
1608
|
+
const context = useContext(DrawerContext);
|
|
1609
|
+
if (!context) {
|
|
1610
|
+
throw new Error("useDrawer must be used within a Drawer.");
|
|
1611
|
+
}
|
|
1612
|
+
return context;
|
|
1613
|
+
}
|
|
1614
|
+
|
|
1615
|
+
// src/components/Drawer.tsx
|
|
1616
|
+
import { Drawer as DrawerPrimitive } from "@base-ui/react/drawer";
|
|
1617
|
+
import { jsx as jsx17, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
1618
|
+
function Drawer2({
|
|
1619
|
+
modal = true,
|
|
1620
|
+
showSwipeHandle = false,
|
|
1621
|
+
snapPoints,
|
|
1622
|
+
swipeDirection = "down",
|
|
1623
|
+
...props
|
|
1624
|
+
}) {
|
|
1625
|
+
const hasSnapPoints = snapPoints != null && snapPoints.length > 0;
|
|
1626
|
+
const contextValue = useMemo2(() => ({ hasSnapPoints, modal, showSwipeHandle, swipeDirection }), [hasSnapPoints, modal, showSwipeHandle, swipeDirection]);
|
|
1627
|
+
return /* @__PURE__ */ jsx17(DrawerContext.Provider, {
|
|
1628
|
+
value: contextValue,
|
|
1629
|
+
children: /* @__PURE__ */ jsx17(DrawerPrimitive.Root, {
|
|
1630
|
+
"data-slot": "drawer",
|
|
1631
|
+
modal,
|
|
1632
|
+
snapPoints,
|
|
1633
|
+
swipeDirection,
|
|
1634
|
+
...props
|
|
1635
|
+
})
|
|
1636
|
+
});
|
|
1637
|
+
}
|
|
1638
|
+
function DrawerTrigger2({ ...props }) {
|
|
1639
|
+
return /* @__PURE__ */ jsx17(DrawerPrimitive.Trigger, {
|
|
1640
|
+
"data-slot": "drawer-trigger",
|
|
1641
|
+
...props
|
|
1642
|
+
});
|
|
1643
|
+
}
|
|
1644
|
+
function DrawerPortal2({ container, ref, children, ...props }) {
|
|
1645
|
+
const resolvedContainer = usePortalContainer2(container);
|
|
1646
|
+
const portal = usePortalNode(ref);
|
|
1647
|
+
return /* @__PURE__ */ jsx17(DrawerPrimitive.Portal, {
|
|
1648
|
+
"data-slot": "drawer-portal",
|
|
1649
|
+
container: resolvedContainer,
|
|
1650
|
+
ref: portal.ref,
|
|
1651
|
+
...props,
|
|
1652
|
+
children: /* @__PURE__ */ jsx17(PortalProvider2, {
|
|
1653
|
+
container: portal.node,
|
|
1654
|
+
children
|
|
1655
|
+
})
|
|
1656
|
+
});
|
|
1657
|
+
}
|
|
1658
|
+
function DrawerClose2({ ...props }) {
|
|
1659
|
+
return /* @__PURE__ */ jsx17(DrawerPrimitive.Close, {
|
|
1660
|
+
"data-slot": "drawer-close",
|
|
1661
|
+
...props
|
|
1662
|
+
});
|
|
1663
|
+
}
|
|
1664
|
+
function DrawerOverlay2({ density, className, ...props }) {
|
|
1665
|
+
const resolvedDensity = useDensity(density);
|
|
1666
|
+
return /* @__PURE__ */ jsx17(DrawerPrimitive.Backdrop, {
|
|
1667
|
+
"data-density": resolvedDensity,
|
|
1668
|
+
"data-slot": "drawer-overlay",
|
|
1669
|
+
className: (state) => cn2("fixed inset-0 min-h-dvh bg-backdrop opacity-[max(var(--drawer-overlay-min-opacity,0),calc(1-var(--drawer-swipe-progress)))] transition-opacity duration-450 ease-[cubic-bezier(0.32,0.72,0,1)] select-none data-ending-style:pointer-events-none data-ending-style:opacity-0 data-ending-style:duration-[calc(var(--drawer-swipe-strength)*400ms)] data-snap-points:[--drawer-overlay-min-opacity:0.5] data-starting-style:opacity-0 data-swiping:duration-0 supports-[-webkit-touch-callout:none]:absolute", typeof className === "function" ? className(state) : className),
|
|
1670
|
+
...props
|
|
1671
|
+
});
|
|
1672
|
+
}
|
|
1673
|
+
function DrawerSwipeHandle2({ density, className, ...props }) {
|
|
1674
|
+
return /* @__PURE__ */ jsx17("div", {
|
|
1675
|
+
"data-density": density,
|
|
1676
|
+
"data-slot": "drawer-swipe-handle",
|
|
1677
|
+
"aria-hidden": "true",
|
|
1678
|
+
className: cn2("relative flex shrink-0 cursor-grab transition-opacity duration-200 group-data-nested-drawer-open/drawer-popup:opacity-0 group-data-nested-drawer-swiping/drawer-popup:opacity-100 group-data-[swipe-axis=x]/drawer-popup:h-full group-data-[swipe-axis=x]/drawer-popup:w-3 group-data-[swipe-axis=x]/drawer-popup:items-center group-data-[swipe-axis=y]/drawer-popup:h-3 group-data-[swipe-axis=y]/drawer-popup:w-full group-data-[swipe-axis=y]/drawer-popup:justify-center group-data-[swipe-direction=down]/drawer-popup:items-end group-data-[swipe-direction=left]/drawer-popup:order-last group-data-[swipe-direction=left]/drawer-popup:justify-start group-data-[swipe-direction=right]/drawer-popup:justify-end group-data-[swipe-direction=up]/drawer-popup:order-last group-data-[swipe-direction=up]/drawer-popup:items-start after:block after:shrink-0 after:rounded-full after:bg-muted group-data-[swipe-axis=x]/drawer-popup:after:h-24 group-data-[swipe-axis=x]/drawer-popup:after:w-1 group-data-[swipe-axis=y]/drawer-popup:after:h-1 group-data-[swipe-axis=y]/drawer-popup:after:w-24 active:cursor-grabbing", className),
|
|
1679
|
+
...props
|
|
1680
|
+
});
|
|
1681
|
+
}
|
|
1682
|
+
function DrawerContent2({ density, className, children, ...props }) {
|
|
1683
|
+
const resolvedDensity = useDensity(density);
|
|
1684
|
+
const direction = useDirection2();
|
|
1685
|
+
const { hasSnapPoints, modal, showSwipeHandle, swipeDirection } = useDrawer();
|
|
1686
|
+
const swipeAxis = swipeDirection === "down" || swipeDirection === "up" ? "y" : "x";
|
|
1687
|
+
return /* @__PURE__ */ jsxs11(DrawerPortal2, {
|
|
1688
|
+
"data-slot": "drawer-portal",
|
|
1689
|
+
children: [
|
|
1690
|
+
modal === true && /* @__PURE__ */ jsx17(DrawerOverlay2, {
|
|
1691
|
+
"data-snap-points": hasSnapPoints ? "" : undefined
|
|
1692
|
+
}),
|
|
1693
|
+
/* @__PURE__ */ jsx17(DrawerPrimitive.Viewport, {
|
|
1694
|
+
dir: direction,
|
|
1695
|
+
"data-slot": "drawer-viewport",
|
|
1696
|
+
"data-modal": modal,
|
|
1697
|
+
className: "pointer-events-none fixed inset-0 select-none data-[modal=true]:pointer-events-auto",
|
|
1698
|
+
children: /* @__PURE__ */ jsxs11(DrawerPrimitive.Popup, {
|
|
1699
|
+
"data-density": resolvedDensity,
|
|
1700
|
+
"data-slot": "drawer-popup",
|
|
1701
|
+
"data-scroll": "none",
|
|
1702
|
+
"data-swipe-axis": swipeAxis,
|
|
1703
|
+
"data-snap-points": hasSnapPoints ? "" : undefined,
|
|
1704
|
+
className: (state) => cn2("group/drawer-popup pointer-events-auto fixed m-(--drawer-inset,0px) flex h-(--drawer-content-height) max-h-(--drawer-content-max-height,none) min-h-0 w-(--drawer-content-width,auto) transform-[translate3d(var(--translate-x,0px),var(--translate-y,0px),0)] flex-col border border-frame-edge shadow-frame bg-popover text-sm text-popover-foreground transition-[transform,height,opacity,filter] duration-450 ease-[cubic-bezier(0.22,1,0.36,1)] will-change-transform outline-none select-none [interpolate-size:allow-keywords] data-[swipe-direction=down]:rounded-t-md data-[swipe-direction=down]:border-t data-[swipe-direction=left]:rounded-r-md data-[swipe-direction=left]:border-r data-[swipe-direction=right]:rounded-l-md data-[swipe-direction=right]:border-l data-[swipe-direction=up]:rounded-b-md data-[swipe-direction=up]:border-b", "data-nested-drawer-open:overflow-hidden data-nested-drawer-open:brightness-95", "after:pointer-events-none after:absolute after:bg-(--drawer-bleed-background,var(--color-popover)) data-[swipe-axis=x]:after:inset-y-0 data-[swipe-axis=x]:after:w-(--bleed) data-[swipe-axis=y]:after:inset-x-0 data-[swipe-axis=y]:after:h-(--bleed) data-[swipe-direction=down]:after:top-full data-[swipe-direction=left]:after:right-full data-[swipe-direction=right]:after:left-full data-[swipe-direction=up]:after:bottom-full", "[--drawer-content-height:var(--drawer-height,auto)] data-[swipe-axis=x]:[--drawer-content-width:75%] data-[swipe-axis=y]:[--drawer-content-max-height:calc(100dvh-6rem)] data-[swipe-axis=y]:data-snap-points:[--drawer-content-height:100dvh] data-[swipe-axis=x]:sm:[--drawer-content-width:24rem]", "[--bleed:3rem] [--peek:1rem] [--stack-height:var(--drawer-frontmost-height,var(--drawer-height,0px))] [--stack-peek-offset:max(0px,calc((var(--nested-drawers)-var(--stack-progress))*var(--peek)))] [--stack-progress:clamp(0,var(--drawer-swipe-progress),1)] [--stack-shrink:0]", "data-ending-style:transform-(--closed-transform) data-ending-style:opacity-[0.9999] data-ending-style:duration-[calc(var(--drawer-swipe-strength)*400ms)] data-nested-drawer-swiping:duration-0 data-ending-style:data-nested-drawer-swiping:duration-[calc(var(--drawer-swipe-strength)*400ms)] data-starting-style:transform-(--closed-transform) data-swiping:duration-0 data-ending-style:data-swiping:duration-[calc(var(--drawer-swipe-strength)*400ms)]", "data-[swipe-axis=y]:inset-x-0 data-[swipe-axis=y]:data-nested-drawer-open:h-(--stack-height)", "data-[swipe-axis=x]:inset-y-0 data-[swipe-axis=x]:flex-row", "data-[swipe-direction=down]:bottom-0 data-[swipe-direction=down]:origin-bottom data-[swipe-direction=down]:[--closed-transform:translate3d(0,calc(100%+var(--drawer-inset,0px)+2px),0)] data-[swipe-direction=down]:[--translate-y:calc(var(--drawer-snap-point-offset,0px)+var(--drawer-swipe-movement-y)-var(--stack-peek-offset)-(var(--stack-shrink)*var(--stack-height)))]", "data-[swipe-direction=up]:top-0 data-[swipe-direction=up]:origin-top data-[swipe-direction=up]:[--closed-transform:translate3d(0,calc(-100%-var(--drawer-inset,0px)-2px),0)] data-[swipe-direction=up]:[--translate-y:calc(var(--drawer-snap-point-offset,0px)+var(--drawer-swipe-movement-y)+var(--stack-peek-offset)+(var(--stack-shrink)*var(--stack-height)))]", "data-[swipe-direction=left]:left-0 data-[swipe-direction=left]:origin-left data-[swipe-direction=left]:[--closed-transform:translate3d(calc(-100%-var(--drawer-inset,0px)-2px),0,0)] data-[swipe-direction=left]:[--translate-x:calc(var(--drawer-swipe-movement-x)+var(--stack-peek-offset)+(var(--stack-shrink)*100%))]", "data-[swipe-direction=right]:right-0 data-[swipe-direction=right]:origin-right data-[swipe-direction=right]:[--closed-transform:translate3d(calc(100%+var(--drawer-inset,0px)+2px),0,0)] data-[swipe-direction=right]:[--translate-x:calc(var(--drawer-swipe-movement-x)-var(--stack-peek-offset)-(var(--stack-shrink)*100%))]", typeof className === "function" ? className(state) : className),
|
|
1705
|
+
...props,
|
|
1706
|
+
children: [
|
|
1707
|
+
showSwipeHandle && /* @__PURE__ */ jsx17(DrawerSwipeHandle2, {}),
|
|
1708
|
+
/* @__PURE__ */ jsx17(DrawerPrimitive.Content, {
|
|
1709
|
+
"data-slot": "drawer-content",
|
|
1710
|
+
"data-scroll": "none",
|
|
1711
|
+
className: "flex min-h-0 flex-1 flex-col overflow-hidden overscroll-contain rounded-[inherit] transition-opacity duration-300 ease-out select-text group-data-nested-drawer-open/drawer-popup:opacity-0 group-data-nested-drawer-swiping/drawer-popup:opacity-100 group-data-swiping/drawer-popup:select-none",
|
|
1712
|
+
children
|
|
1713
|
+
})
|
|
1714
|
+
]
|
|
1715
|
+
})
|
|
1716
|
+
})
|
|
1717
|
+
]
|
|
1718
|
+
});
|
|
1719
|
+
}
|
|
1720
|
+
function DrawerHeader2({ density, className, ...props }) {
|
|
1721
|
+
return /* @__PURE__ */ jsx17("div", {
|
|
1722
|
+
"data-density": density,
|
|
1723
|
+
"data-slot": "drawer-header",
|
|
1724
|
+
className: cn2("flex shrink-0 flex-col gap-0.5 p-panel pb-0 group-data-[swipe-axis=y]/drawer-popup:text-center md:gap-0.5 md:text-start md:group-data-[swipe-axis=y]/drawer-popup:text-start", className),
|
|
1725
|
+
...props
|
|
1726
|
+
});
|
|
1727
|
+
}
|
|
1728
|
+
function DrawerFooter2({ density, className, ...props }) {
|
|
1729
|
+
return /* @__PURE__ */ jsx17("div", {
|
|
1730
|
+
"data-density": density,
|
|
1731
|
+
"data-slot": "drawer-footer",
|
|
1732
|
+
className: cn2("mt-auto flex shrink-0 flex-col gap-2 p-panel pt-0", className),
|
|
1733
|
+
...props
|
|
1734
|
+
});
|
|
1735
|
+
}
|
|
1736
|
+
function DrawerTitle2({ density, className, ...props }) {
|
|
1737
|
+
return /* @__PURE__ */ jsx17(DrawerPrimitive.Title, {
|
|
1738
|
+
"data-density": density,
|
|
1739
|
+
"data-slot": "drawer-title",
|
|
1740
|
+
className: (state) => cn2(" text-base font-medium text-foreground", typeof className === "function" ? className(state) : className),
|
|
1741
|
+
...props
|
|
1742
|
+
});
|
|
1743
|
+
}
|
|
1744
|
+
function DrawerDescription2({ density, className, ...props }) {
|
|
1745
|
+
return /* @__PURE__ */ jsx17(DrawerPrimitive.Description, {
|
|
1746
|
+
"data-density": density,
|
|
1747
|
+
"data-slot": "drawer-description",
|
|
1748
|
+
className: (state) => cn2("text-sm text-balance text-muted-foreground", typeof className === "function" ? className(state) : className),
|
|
1749
|
+
...props
|
|
1750
|
+
});
|
|
1751
|
+
}
|
|
1752
|
+
// src/components/ContextMenu.tsx
|
|
1753
|
+
import { ChevronRightIcon as ChevronRightIcon3, CheckIcon as CheckIcon3 } from "lucide-react";
|
|
1754
|
+
import { useDirection as useDirection5 } from "@base-ui/react/direction-provider";
|
|
1755
|
+
import { ContextMenu as ContextMenuPrimitive } from "@base-ui/react/context-menu";
|
|
1756
|
+
import { jsx as jsx18, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
1757
|
+
function ContextMenu2({ ...props }) {
|
|
1758
|
+
return /* @__PURE__ */ jsx18(ContextMenuPrimitive.Root, {
|
|
1759
|
+
"data-slot": "context-menu",
|
|
1760
|
+
...props
|
|
1761
|
+
});
|
|
1762
|
+
}
|
|
1763
|
+
function ContextMenuPortal2({ container, ref, children, ...props }) {
|
|
1764
|
+
const resolvedContainer = usePortalContainer2(container);
|
|
1765
|
+
const portal = usePortalNode(ref);
|
|
1766
|
+
return /* @__PURE__ */ jsx18(ContextMenuPrimitive.Portal, {
|
|
1767
|
+
"data-slot": "context-menu-portal",
|
|
1768
|
+
container: resolvedContainer,
|
|
1769
|
+
ref: portal.ref,
|
|
1770
|
+
...props,
|
|
1771
|
+
children: /* @__PURE__ */ jsx18(PortalProvider2, {
|
|
1772
|
+
container: portal.node,
|
|
1773
|
+
children
|
|
1774
|
+
})
|
|
1775
|
+
});
|
|
1776
|
+
}
|
|
1777
|
+
function ContextMenuTrigger2({ density, className, ...props }) {
|
|
1778
|
+
return /* @__PURE__ */ jsx18(ContextMenuPrimitive.Trigger, {
|
|
1779
|
+
"data-density": density,
|
|
1780
|
+
"data-slot": "context-menu-trigger",
|
|
1781
|
+
className: (state) => cn2("select-none", typeof className === "function" ? className(state) : className),
|
|
1782
|
+
...props
|
|
1783
|
+
});
|
|
1784
|
+
}
|
|
1785
|
+
function ContextMenuContent2({
|
|
1786
|
+
density,
|
|
1787
|
+
className,
|
|
1788
|
+
align = "start",
|
|
1789
|
+
alignOffset = 4,
|
|
1790
|
+
side = "right",
|
|
1791
|
+
sideOffset = 0,
|
|
1792
|
+
...props
|
|
1793
|
+
}) {
|
|
1794
|
+
const resolvedDensity = useDensity(density);
|
|
1795
|
+
const direction = useDirection5();
|
|
1796
|
+
return /* @__PURE__ */ jsx18(ContextMenuPortal2, {
|
|
1797
|
+
children: /* @__PURE__ */ jsx18(ContextMenuPrimitive.Positioner, {
|
|
1798
|
+
dir: direction,
|
|
1799
|
+
className: "isolate outline-none",
|
|
1800
|
+
align,
|
|
1801
|
+
alignOffset,
|
|
1802
|
+
side,
|
|
1803
|
+
sideOffset,
|
|
1804
|
+
children: /* @__PURE__ */ jsx18(ContextMenuPrimitive.Popup, {
|
|
1805
|
+
dir: direction,
|
|
1806
|
+
"data-density": resolvedDensity,
|
|
1807
|
+
"data-slot": "context-menu-content",
|
|
1808
|
+
className: (state) => cn2(" max-h-(--available-height) min-w-36 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-sm bg-popover p-1 text-popover-foreground border border-frame-edge shadow-frame duration-100 outline-none data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0 motion-reduce:data-open:animate-none motion-reduce:data-closed:animate-none ", typeof className === "function" ? className(state) : className),
|
|
1809
|
+
...props
|
|
1810
|
+
})
|
|
1811
|
+
})
|
|
1812
|
+
});
|
|
1813
|
+
}
|
|
1814
|
+
function ContextMenuGroup2({ ...props }) {
|
|
1815
|
+
return /* @__PURE__ */ jsx18(ContextMenuPrimitive.Group, {
|
|
1816
|
+
"data-slot": "context-menu-group",
|
|
1817
|
+
...props
|
|
1818
|
+
});
|
|
1819
|
+
}
|
|
1820
|
+
function ContextMenuLabel2({ density, className, inset, ...props }) {
|
|
1821
|
+
return /* @__PURE__ */ jsx18(ContextMenuPrimitive.GroupLabel, {
|
|
1822
|
+
"data-density": density,
|
|
1823
|
+
"data-slot": "context-menu-label",
|
|
1824
|
+
"data-inset": inset,
|
|
1825
|
+
className: (state) => cn2("px-1.5 py-1 text-xs font-medium text-muted-foreground data-inset:ps-7", typeof className === "function" ? className(state) : className),
|
|
1826
|
+
...props
|
|
1827
|
+
});
|
|
1828
|
+
}
|
|
1829
|
+
function ContextMenuItem2({ density, className, inset, variant = "default", ...props }) {
|
|
1830
|
+
return /* @__PURE__ */ jsx18(ContextMenuPrimitive.Item, {
|
|
1831
|
+
"data-density": density,
|
|
1832
|
+
"data-slot": "context-menu-item",
|
|
1833
|
+
"data-inset": inset,
|
|
1834
|
+
"data-variant": variant,
|
|
1835
|
+
className: (state) => cn2("group/context-menu-item relative flex cursor-default items-center gap-control-gap rounded-md px-1.5 py-1 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-inset:ps-7 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 focus:*:[svg]:text-accent-foreground data-[variant=destructive]:*:[svg]:text-destructive", typeof className === "function" ? className(state) : className),
|
|
1836
|
+
...props
|
|
1837
|
+
});
|
|
1838
|
+
}
|
|
1839
|
+
function ContextMenuSub2({ ...props }) {
|
|
1840
|
+
return /* @__PURE__ */ jsx18(ContextMenuPrimitive.SubmenuRoot, {
|
|
1841
|
+
"data-slot": "context-menu-sub",
|
|
1842
|
+
...props
|
|
1843
|
+
});
|
|
1844
|
+
}
|
|
1845
|
+
function ContextMenuSubTrigger2({ density, className, inset, children, ...props }) {
|
|
1846
|
+
return /* @__PURE__ */ jsxs12(ContextMenuPrimitive.SubmenuTrigger, {
|
|
1847
|
+
"data-density": density,
|
|
1848
|
+
"data-slot": "context-menu-sub-trigger",
|
|
1849
|
+
"data-inset": inset,
|
|
1850
|
+
className: (state) => cn2("flex cursor-default items-center gap-control-gap rounded-md px-1.5 py-1 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-inset:ps-7 data-open:bg-accent data-open:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
|
|
1851
|
+
...props,
|
|
1852
|
+
children: [
|
|
1853
|
+
children,
|
|
1854
|
+
/* @__PURE__ */ jsx18(ChevronRightIcon3, {
|
|
1855
|
+
className: "rtl:rotate-180 ms-auto"
|
|
1856
|
+
})
|
|
1857
|
+
]
|
|
1858
|
+
});
|
|
1859
|
+
}
|
|
1860
|
+
function ContextMenuSubContent2({ ...props }) {
|
|
1861
|
+
return /* @__PURE__ */ jsx18(ContextMenuContent2, {
|
|
1862
|
+
"data-slot": "context-menu-sub-content",
|
|
1863
|
+
className: " shadow-frame border border-frame-edge",
|
|
1864
|
+
side: "inline-end",
|
|
1865
|
+
...props
|
|
1866
|
+
});
|
|
1867
|
+
}
|
|
1868
|
+
function ContextMenuCheckboxItem2({
|
|
1869
|
+
density,
|
|
1870
|
+
className,
|
|
1871
|
+
children,
|
|
1872
|
+
checked,
|
|
1873
|
+
inset,
|
|
1874
|
+
...props
|
|
1875
|
+
}) {
|
|
1876
|
+
return /* @__PURE__ */ jsxs12(ContextMenuPrimitive.CheckboxItem, {
|
|
1877
|
+
"data-density": density,
|
|
1878
|
+
"data-slot": "context-menu-checkbox-item",
|
|
1879
|
+
"data-inset": inset,
|
|
1880
|
+
className: (state) => cn2("relative flex cursor-default items-center gap-control-gap rounded-md py-1 pe-8 ps-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-inset:ps-7 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
|
|
1881
|
+
checked,
|
|
1882
|
+
...props,
|
|
1883
|
+
children: [
|
|
1884
|
+
/* @__PURE__ */ jsx18("span", {
|
|
1885
|
+
className: "pointer-events-none absolute end-2",
|
|
1886
|
+
children: /* @__PURE__ */ jsx18(ContextMenuPrimitive.CheckboxItemIndicator, {
|
|
1887
|
+
children: /* @__PURE__ */ jsx18(CheckIcon3, {})
|
|
1888
|
+
})
|
|
1889
|
+
}),
|
|
1890
|
+
children
|
|
1891
|
+
]
|
|
1892
|
+
});
|
|
1893
|
+
}
|
|
1894
|
+
function ContextMenuRadioGroup2({ ...props }) {
|
|
1895
|
+
return /* @__PURE__ */ jsx18(ContextMenuPrimitive.RadioGroup, {
|
|
1896
|
+
"data-slot": "context-menu-radio-group",
|
|
1897
|
+
...props
|
|
1898
|
+
});
|
|
1899
|
+
}
|
|
1900
|
+
function ContextMenuRadioItem2({ density, className, children, inset, ...props }) {
|
|
1901
|
+
return /* @__PURE__ */ jsxs12(ContextMenuPrimitive.RadioItem, {
|
|
1902
|
+
"data-density": density,
|
|
1903
|
+
"data-slot": "context-menu-radio-item",
|
|
1904
|
+
"data-inset": inset,
|
|
1905
|
+
className: (state) => cn2("relative flex cursor-default items-center gap-control-gap rounded-md py-1 pe-8 ps-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-inset:ps-7 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
|
|
1906
|
+
...props,
|
|
1907
|
+
children: [
|
|
1908
|
+
/* @__PURE__ */ jsx18("span", {
|
|
1909
|
+
className: "pointer-events-none absolute end-2",
|
|
1910
|
+
children: /* @__PURE__ */ jsx18(ContextMenuPrimitive.RadioItemIndicator, {
|
|
1911
|
+
children: /* @__PURE__ */ jsx18(CheckIcon3, {})
|
|
1912
|
+
})
|
|
1913
|
+
}),
|
|
1914
|
+
children
|
|
1915
|
+
]
|
|
1916
|
+
});
|
|
1917
|
+
}
|
|
1918
|
+
function ContextMenuSeparator2({ density, className, ...props }) {
|
|
1919
|
+
return /* @__PURE__ */ jsx18(ContextMenuPrimitive.Separator, {
|
|
1920
|
+
"data-density": density,
|
|
1921
|
+
"data-slot": "context-menu-separator",
|
|
1922
|
+
className: (state) => cn2("-mx-1 my-1 h-px bg-border", typeof className === "function" ? className(state) : className),
|
|
1923
|
+
...props
|
|
1924
|
+
});
|
|
1925
|
+
}
|
|
1926
|
+
function ContextMenuShortcut2({ density, className, ...props }) {
|
|
1927
|
+
return /* @__PURE__ */ jsx18("span", {
|
|
1928
|
+
"data-density": density,
|
|
1929
|
+
"data-slot": "context-menu-shortcut",
|
|
1930
|
+
className: cn2("ms-auto text-xs tracking-widest text-muted-foreground group-focus/context-menu-item:text-accent-foreground", className),
|
|
1931
|
+
...props
|
|
1932
|
+
});
|
|
1933
|
+
}
|
|
1934
|
+
// src/components/Menubar.tsx
|
|
1935
|
+
import { CheckIcon as CheckIcon4 } from "lucide-react";
|
|
1936
|
+
import { Menu as MenuPrimitive } from "@base-ui/react/menu";
|
|
1937
|
+
import { Menubar as MenubarPrimitive } from "@base-ui/react/menubar";
|
|
1938
|
+
import { jsx as jsx19, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
1939
|
+
function Menubar2({ density, className, ...props }) {
|
|
1940
|
+
return /* @__PURE__ */ jsx19(MenubarPrimitive, {
|
|
1941
|
+
"data-density": density,
|
|
1942
|
+
"data-slot": "menubar",
|
|
1943
|
+
className: (state) => cn2("flex h-control items-center gap-0.5 rounded-sm border p-px", typeof className === "function" ? className(state) : className),
|
|
1944
|
+
...props
|
|
1945
|
+
});
|
|
1946
|
+
}
|
|
1947
|
+
function MenubarMenu2({ ...props }) {
|
|
1948
|
+
return /* @__PURE__ */ jsx19(DropdownMenu2, {
|
|
1949
|
+
"data-slot": "menubar-menu",
|
|
1950
|
+
...props
|
|
1951
|
+
});
|
|
1952
|
+
}
|
|
1953
|
+
function MenubarGroup2({ ...props }) {
|
|
1954
|
+
return /* @__PURE__ */ jsx19(DropdownMenuGroup2, {
|
|
1955
|
+
"data-slot": "menubar-group",
|
|
1956
|
+
...props
|
|
1957
|
+
});
|
|
1958
|
+
}
|
|
1959
|
+
function MenubarPortal2({ ...props }) {
|
|
1960
|
+
return /* @__PURE__ */ jsx19(DropdownMenuPortal2, {
|
|
1961
|
+
"data-slot": "menubar-portal",
|
|
1962
|
+
...props
|
|
1963
|
+
});
|
|
1964
|
+
}
|
|
1965
|
+
function MenubarTrigger2({ density, className, ...props }) {
|
|
1966
|
+
return /* @__PURE__ */ jsx19(DropdownMenuTrigger2, {
|
|
1967
|
+
"data-density": density,
|
|
1968
|
+
"data-slot": "menubar-trigger",
|
|
1969
|
+
className: (state) => cn2("flex h-full items-center rounded-sm px-control-x text-sm leading-none font-medium outline-hidden select-none hover:bg-muted aria-expanded:bg-muted", typeof className === "function" ? className(state) : className),
|
|
1970
|
+
...props
|
|
1971
|
+
});
|
|
1972
|
+
}
|
|
1973
|
+
function MenubarContent2({
|
|
1974
|
+
density,
|
|
1975
|
+
className,
|
|
1976
|
+
align = "start",
|
|
1977
|
+
alignOffset = -4,
|
|
1978
|
+
sideOffset = 8,
|
|
1979
|
+
...props
|
|
1980
|
+
}) {
|
|
1981
|
+
return /* @__PURE__ */ jsx19(DropdownMenuContent2, {
|
|
1982
|
+
density,
|
|
1983
|
+
"data-slot": "menubar-content",
|
|
1984
|
+
align,
|
|
1985
|
+
alignOffset,
|
|
1986
|
+
sideOffset,
|
|
1987
|
+
className: (state) => cn2(" min-w-36 rounded-sm bg-popover p-1 text-popover-foreground border border-frame-edge shadow-frame duration-100 data-open:animate-in data-open:fade-in-0 ", typeof className === "function" ? className(state) : className),
|
|
1988
|
+
...props
|
|
1989
|
+
});
|
|
1990
|
+
}
|
|
1991
|
+
function MenubarItem2({ density, className, inset, variant = "default", ...props }) {
|
|
1992
|
+
return /* @__PURE__ */ jsx19(DropdownMenuItem2, {
|
|
1993
|
+
density,
|
|
1994
|
+
"data-slot": "menubar-item",
|
|
1995
|
+
inset,
|
|
1996
|
+
variant,
|
|
1997
|
+
className: (state) => cn2("group/menubar-item gap-control-gap rounded-md px-1.5 py-1 text-sm focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-inset:ps-7 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive data-disabled:opacity-50 [&_svg:not([class*='size-'])]:size-4 data-[variant=destructive]:*:[svg]:text-destructive!", typeof className === "function" ? className(state) : className),
|
|
1998
|
+
...props
|
|
1999
|
+
});
|
|
2000
|
+
}
|
|
2001
|
+
function MenubarCheckboxItem2({
|
|
2002
|
+
density,
|
|
2003
|
+
className,
|
|
2004
|
+
children,
|
|
2005
|
+
checked,
|
|
2006
|
+
inset,
|
|
2007
|
+
...props
|
|
2008
|
+
}) {
|
|
2009
|
+
return /* @__PURE__ */ jsxs13(MenuPrimitive.CheckboxItem, {
|
|
2010
|
+
"data-density": density,
|
|
2011
|
+
"data-slot": "menubar-checkbox-item",
|
|
2012
|
+
"data-inset": inset,
|
|
2013
|
+
className: (state) => cn2("relative flex cursor-default items-center gap-control-gap rounded-md py-1 pe-1.5 ps-7 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground focus:**:text-accent-foreground data-inset:ps-7 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0", typeof className === "function" ? className(state) : className),
|
|
2014
|
+
checked,
|
|
2015
|
+
...props,
|
|
2016
|
+
children: [
|
|
2017
|
+
/* @__PURE__ */ jsx19("span", {
|
|
2018
|
+
className: "pointer-events-none absolute start-1.5 flex size-4 items-center justify-center [&_svg:not([class*='size-'])]:size-4",
|
|
2019
|
+
children: /* @__PURE__ */ jsx19(MenuPrimitive.CheckboxItemIndicator, {
|
|
2020
|
+
children: /* @__PURE__ */ jsx19(CheckIcon4, {})
|
|
2021
|
+
})
|
|
2022
|
+
}),
|
|
2023
|
+
children
|
|
2024
|
+
]
|
|
2025
|
+
});
|
|
2026
|
+
}
|
|
2027
|
+
function MenubarRadioGroup2({ ...props }) {
|
|
2028
|
+
return /* @__PURE__ */ jsx19(DropdownMenuRadioGroup2, {
|
|
2029
|
+
"data-slot": "menubar-radio-group",
|
|
2030
|
+
...props
|
|
2031
|
+
});
|
|
2032
|
+
}
|
|
2033
|
+
function MenubarRadioItem2({ density, className, children, inset, ...props }) {
|
|
2034
|
+
return /* @__PURE__ */ jsxs13(MenuPrimitive.RadioItem, {
|
|
2035
|
+
"data-density": density,
|
|
2036
|
+
"data-slot": "menubar-radio-item",
|
|
2037
|
+
"data-inset": inset,
|
|
2038
|
+
className: (state) => cn2("relative flex cursor-default items-center gap-control-gap rounded-md py-1 pe-1.5 ps-7 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground focus:**:text-accent-foreground data-inset:ps-7 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
|
|
2039
|
+
...props,
|
|
2040
|
+
children: [
|
|
2041
|
+
/* @__PURE__ */ jsx19("span", {
|
|
2042
|
+
className: "pointer-events-none absolute start-1.5 flex size-4 items-center justify-center [&_svg:not([class*='size-'])]:size-4",
|
|
2043
|
+
children: /* @__PURE__ */ jsx19(MenuPrimitive.RadioItemIndicator, {
|
|
2044
|
+
children: /* @__PURE__ */ jsx19(CheckIcon4, {})
|
|
2045
|
+
})
|
|
2046
|
+
}),
|
|
2047
|
+
children
|
|
2048
|
+
]
|
|
2049
|
+
});
|
|
2050
|
+
}
|
|
2051
|
+
function MenubarLabel2({ density, className, inset, ...props }) {
|
|
2052
|
+
return /* @__PURE__ */ jsx19(DropdownMenuLabel2, {
|
|
2053
|
+
density,
|
|
2054
|
+
"data-slot": "menubar-label",
|
|
2055
|
+
inset,
|
|
2056
|
+
className: (state) => cn2("px-1.5 py-1 text-sm font-medium data-inset:ps-7", typeof className === "function" ? className(state) : className),
|
|
2057
|
+
...props
|
|
2058
|
+
});
|
|
2059
|
+
}
|
|
2060
|
+
function MenubarSeparator2({ density, className, ...props }) {
|
|
2061
|
+
return /* @__PURE__ */ jsx19(DropdownMenuSeparator2, {
|
|
2062
|
+
density,
|
|
2063
|
+
"data-slot": "menubar-separator",
|
|
2064
|
+
className: (state) => cn2("-mx-1 my-1 h-px bg-border", typeof className === "function" ? className(state) : className),
|
|
2065
|
+
...props
|
|
2066
|
+
});
|
|
2067
|
+
}
|
|
2068
|
+
function MenubarShortcut2({ density, className, ...props }) {
|
|
2069
|
+
return /* @__PURE__ */ jsx19(DropdownMenuShortcut2, {
|
|
2070
|
+
"data-density": density,
|
|
2071
|
+
"data-slot": "menubar-shortcut",
|
|
2072
|
+
className: cn2("ms-auto text-xs tracking-widest text-muted-foreground group-focus/menubar-item:text-accent-foreground", className),
|
|
2073
|
+
...props
|
|
2074
|
+
});
|
|
2075
|
+
}
|
|
2076
|
+
function MenubarSub2({ ...props }) {
|
|
2077
|
+
return /* @__PURE__ */ jsx19(DropdownMenuSub2, {
|
|
2078
|
+
"data-slot": "menubar-sub",
|
|
2079
|
+
...props
|
|
2080
|
+
});
|
|
2081
|
+
}
|
|
2082
|
+
function MenubarSubTrigger2({ density, className, inset, ...props }) {
|
|
2083
|
+
return /* @__PURE__ */ jsx19(DropdownMenuSubTrigger2, {
|
|
2084
|
+
density,
|
|
2085
|
+
"data-slot": "menubar-sub-trigger",
|
|
2086
|
+
inset,
|
|
2087
|
+
className: (state) => cn2("gap-control-gap rounded-md px-1.5 py-1 text-sm focus:bg-accent focus:text-accent-foreground data-inset:ps-7 data-open:bg-accent data-open:text-accent-foreground [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
|
|
2088
|
+
...props
|
|
2089
|
+
});
|
|
2090
|
+
}
|
|
2091
|
+
function MenubarSubContent2({ density, className, ...props }) {
|
|
2092
|
+
return /* @__PURE__ */ jsx19(DropdownMenuSubContent2, {
|
|
2093
|
+
density,
|
|
2094
|
+
"data-slot": "menubar-sub-content",
|
|
2095
|
+
className: (state) => cn2(" min-w-32 rounded-sm bg-popover p-1 text-popover-foreground shadow-frame border border-frame-edge border border-frame-edge shadow-frame duration-100 data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0 ", typeof className === "function" ? className(state) : className),
|
|
2096
|
+
...props
|
|
2097
|
+
});
|
|
2098
|
+
}
|
|
2099
|
+
// src/components/NavigationMenu.tsx
|
|
2100
|
+
import { ChevronDownIcon as ChevronDownIcon4 } from "lucide-react";
|
|
2101
|
+
import { NavigationMenu as NavigationMenuPrimitive } from "@base-ui/react/navigation-menu";
|
|
2102
|
+
import { cva as cva3 } from "class-variance-authority";
|
|
2103
|
+
import { jsx as jsx20, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
2104
|
+
function NavigationMenu2({
|
|
2105
|
+
density,
|
|
2106
|
+
align = "start",
|
|
2107
|
+
className,
|
|
2108
|
+
children,
|
|
2109
|
+
...props
|
|
2110
|
+
}) {
|
|
2111
|
+
const resolvedDensity = useDensity(density);
|
|
2112
|
+
return /* @__PURE__ */ jsxs14(NavigationMenuPrimitive.Root, {
|
|
2113
|
+
"data-density": resolvedDensity,
|
|
2114
|
+
"data-slot": "navigation-menu",
|
|
2115
|
+
className: (state) => cn2("group/navigation-menu relative flex max-w-max flex-1 items-center justify-center", typeof className === "function" ? className(state) : className),
|
|
2116
|
+
...props,
|
|
2117
|
+
children: [
|
|
2118
|
+
children,
|
|
2119
|
+
/* @__PURE__ */ jsx20(NavigationMenuPositioner2, {
|
|
2120
|
+
density: resolvedDensity,
|
|
2121
|
+
align
|
|
2122
|
+
})
|
|
2123
|
+
]
|
|
2124
|
+
});
|
|
2125
|
+
}
|
|
2126
|
+
function NavigationMenuList2({ density, className, ...props }) {
|
|
2127
|
+
return /* @__PURE__ */ jsx20(NavigationMenuPrimitive.List, {
|
|
2128
|
+
"data-density": density,
|
|
2129
|
+
"data-slot": "navigation-menu-list",
|
|
2130
|
+
className: (state) => cn2("group flex flex-1 list-none items-center justify-center gap-0", typeof className === "function" ? className(state) : className),
|
|
2131
|
+
...props
|
|
2132
|
+
});
|
|
2133
|
+
}
|
|
2134
|
+
function NavigationMenuItem2({ density, className, ...props }) {
|
|
2135
|
+
return /* @__PURE__ */ jsx20(NavigationMenuPrimitive.Item, {
|
|
2136
|
+
"data-density": density,
|
|
2137
|
+
"data-slot": "navigation-menu-item",
|
|
2138
|
+
className: (state) => cn2("relative", typeof className === "function" ? className(state) : className),
|
|
2139
|
+
...props
|
|
2140
|
+
});
|
|
2141
|
+
}
|
|
2142
|
+
var navigationMenuTriggerStyle2 = cva3("group/navigation-menu-trigger inline-flex h-control-lg w-max items-center justify-center rounded-sm px-control-x py-1.5 text-sm font-medium transition-colors outline-none hover:bg-muted focus:bg-muted focus-visible:ring-1 focus-visible:ring-ring focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-popup-open:bg-muted/50 data-popup-open:hover:bg-muted data-open:bg-muted/50 data-open:hover:bg-muted data-open:focus:bg-muted");
|
|
2143
|
+
function NavigationMenuTrigger2({ density, className, children, ...props }) {
|
|
2144
|
+
return /* @__PURE__ */ jsxs14(NavigationMenuPrimitive.Trigger, {
|
|
2145
|
+
"data-density": density,
|
|
2146
|
+
"data-slot": "navigation-menu-trigger",
|
|
2147
|
+
className: (state) => cn2(navigationMenuTriggerStyle2(), "group", typeof className === "function" ? className(state) : className),
|
|
2148
|
+
...props,
|
|
2149
|
+
children: [
|
|
2150
|
+
children,
|
|
2151
|
+
" ",
|
|
2152
|
+
/* @__PURE__ */ jsx20(NavigationMenuIndicator2, {})
|
|
2153
|
+
]
|
|
2154
|
+
});
|
|
2155
|
+
}
|
|
2156
|
+
function NavigationMenuContent2({ density, className, ...props }) {
|
|
2157
|
+
return /* @__PURE__ */ jsx20(NavigationMenuPrimitive.Content, {
|
|
2158
|
+
"data-density": density,
|
|
2159
|
+
"data-slot": "navigation-menu-content",
|
|
2160
|
+
className: (state) => cn2("data-ending-style:data-activation-direction=left:translate-x-[50%] data-ending-style:data-activation-direction=right:translate-x-[-50%] data-starting-style:data-activation-direction=left:translate-x-[-50%] data-starting-style:data-activation-direction=right:translate-x-[50%] h-full w-auto p-1 transition-[opacity,transform,translate] duration-[0.35s] ease-[cubic-bezier(0.22,1,0.36,1)] data-ending-style:opacity-0 data-starting-style:opacity-0 ", typeof className === "function" ? className(state) : className),
|
|
2161
|
+
...props
|
|
2162
|
+
});
|
|
2163
|
+
}
|
|
2164
|
+
function NavigationMenuPositioner2({
|
|
2165
|
+
density,
|
|
2166
|
+
className,
|
|
2167
|
+
side = "bottom",
|
|
2168
|
+
sideOffset = 8,
|
|
2169
|
+
align = "start",
|
|
2170
|
+
alignOffset = 0,
|
|
2171
|
+
...props
|
|
2172
|
+
}) {
|
|
2173
|
+
const resolvedDensity = useDensity(density);
|
|
2174
|
+
const direction = useDirection2();
|
|
2175
|
+
const container = usePortalContainer2();
|
|
2176
|
+
const portal = usePortalNode();
|
|
2177
|
+
return /* @__PURE__ */ jsx20(NavigationMenuPrimitive.Portal, {
|
|
2178
|
+
container,
|
|
2179
|
+
ref: portal.ref,
|
|
2180
|
+
children: /* @__PURE__ */ jsx20(PortalProvider2, {
|
|
2181
|
+
container: portal.node,
|
|
2182
|
+
children: /* @__PURE__ */ jsx20(NavigationMenuPrimitive.Positioner, {
|
|
2183
|
+
dir: direction,
|
|
2184
|
+
side,
|
|
2185
|
+
sideOffset,
|
|
2186
|
+
align,
|
|
2187
|
+
alignOffset,
|
|
2188
|
+
className: (state) => cn2("isolate h-(--positioner-height) w-(--positioner-width) max-w-(--available-width) transition-[top,left,right,bottom] duration-[0.35s] ease-[cubic-bezier(0.22,1,0.36,1)] data-instant:transition-none data-[side=bottom]:before:top-[-10px] data-[side=bottom]:before:right-0 data-[side=bottom]:before:left-0", typeof className === "function" ? className(state) : className),
|
|
2189
|
+
...props,
|
|
2190
|
+
children: /* @__PURE__ */ jsx20(NavigationMenuPrimitive.Popup, {
|
|
2191
|
+
"data-density": resolvedDensity,
|
|
2192
|
+
"data-slot": "navigation-menu-popup",
|
|
2193
|
+
className: "data-[ending-style]:easing-[ease] xs:w-(--popup-width) relative h-(--popup-height) w-(--popup-width) origin-(--transform-origin) rounded-sm bg-popover text-popover-foreground border border-frame-edge shadow-frame transition-[opacity,transform,width,height,translate] duration-[0.35s] ease-[cubic-bezier(0.22,1,0.36,1)] outline-none data-ending-style:opacity-0 data-ending-style:duration-150 data-starting-style:opacity-0",
|
|
2194
|
+
children: /* @__PURE__ */ jsx20(NavigationMenuPrimitive.Viewport, {
|
|
2195
|
+
className: "relative size-full overflow-hidden"
|
|
2196
|
+
})
|
|
2197
|
+
})
|
|
2198
|
+
})
|
|
2199
|
+
})
|
|
2200
|
+
});
|
|
2201
|
+
}
|
|
2202
|
+
function NavigationMenuLink2({ density, className, ...props }) {
|
|
2203
|
+
return /* @__PURE__ */ jsx20(NavigationMenuPrimitive.Link, {
|
|
2204
|
+
"data-density": density,
|
|
2205
|
+
"data-slot": "navigation-menu-link",
|
|
2206
|
+
className: (state) => cn2("flex items-center gap-2 rounded-sm p-2 text-sm transition-colors outline-none hover:bg-muted focus:bg-muted focus-visible:ring-1 focus-visible:ring-ring focus-visible:outline-1 in-data-[slot=navigation-menu-content]:rounded-md data-active:bg-muted/50 data-active:hover:bg-muted data-active:focus:bg-muted [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
|
|
2207
|
+
...props
|
|
2208
|
+
});
|
|
2209
|
+
}
|
|
2210
|
+
function NavigationMenuIndicator2({
|
|
2211
|
+
density,
|
|
2212
|
+
className,
|
|
2213
|
+
children,
|
|
2214
|
+
...props
|
|
2215
|
+
}) {
|
|
2216
|
+
return /* @__PURE__ */ jsx20(NavigationMenuPrimitive.Icon, {
|
|
2217
|
+
"data-density": density,
|
|
2218
|
+
"data-slot": "navigation-menu-indicator",
|
|
2219
|
+
className: (state) => cn2("ms-1 inline-flex size-3 shrink-0 items-center justify-center transition-transform duration-120 data-popup-open:rotate-180 [&_svg]:size-full", typeof className === "function" ? className(state) : className),
|
|
2220
|
+
...props,
|
|
2221
|
+
children: children ?? /* @__PURE__ */ jsx20(ChevronDownIcon4, {})
|
|
2222
|
+
});
|
|
2223
|
+
}
|
|
2224
|
+
// src/components/Toast.tsx
|
|
2225
|
+
import { Toast as ToastPrimitive } from "@base-ui/react/toast";
|
|
2226
|
+
import { CircleCheckIcon, InfoIcon, TriangleAlertIcon, OctagonXIcon, LoaderCircleIcon, XIcon as XIcon2 } from "lucide-react";
|
|
2227
|
+
import { jsx as jsx21, jsxs as jsxs15, Fragment } from "react/jsx-runtime";
|
|
2228
|
+
function ToastProvider2(props) {
|
|
2229
|
+
return /* @__PURE__ */ jsx21(ToastPrimitive.Provider, {
|
|
2230
|
+
...props
|
|
2231
|
+
});
|
|
2232
|
+
}
|
|
2233
|
+
function ToastPortal2({ container, ref, children, ...props }) {
|
|
2234
|
+
const resolvedContainer = usePortalContainer2(container);
|
|
2235
|
+
const portal = usePortalNode(ref);
|
|
2236
|
+
return /* @__PURE__ */ jsx21(ToastPrimitive.Portal, {
|
|
2237
|
+
"data-slot": "toast-portal",
|
|
2238
|
+
container: resolvedContainer,
|
|
2239
|
+
ref: portal.ref,
|
|
2240
|
+
...props,
|
|
2241
|
+
children: /* @__PURE__ */ jsx21(PortalProvider2, {
|
|
2242
|
+
container: portal.node,
|
|
2243
|
+
children
|
|
2244
|
+
})
|
|
2245
|
+
});
|
|
2246
|
+
}
|
|
2247
|
+
function ToastViewport2({ density, dir, className, ...props }) {
|
|
2248
|
+
const resolvedDensity = useDensity(density);
|
|
2249
|
+
const inheritedDirection = useDirection2();
|
|
2250
|
+
return /* @__PURE__ */ jsx21(ToastPrimitive.Viewport, {
|
|
2251
|
+
dir: dir ?? inheritedDirection,
|
|
2252
|
+
"data-density": resolvedDensity,
|
|
2253
|
+
"data-slot": "toast-viewport",
|
|
2254
|
+
className: (state) => cn2("pointer-events-none fixed inset-x-4 bottom-4 isolate mx-auto max-w-sm outline-none sm:right-4 sm:left-auto sm:mx-0 sm:w-full", typeof className === "function" ? className(state) : className),
|
|
2255
|
+
...props
|
|
2256
|
+
});
|
|
2257
|
+
}
|
|
2258
|
+
function Toast2({ density, className, ...props }) {
|
|
2259
|
+
return /* @__PURE__ */ jsx21(ToastPrimitive.Root, {
|
|
2260
|
+
"data-density": density,
|
|
2261
|
+
"data-slot": "toast",
|
|
2262
|
+
className: (state) => cn2("group/toast pointer-events-auto absolute right-0 bottom-0 w-full rounded-md border border-frame-edge bg-popover text-popover-foreground shadow-frame outline-none select-none focus-visible:ring-1 focus-visible:ring-ring [--offset-y:calc(var(--toast-offset-y)*-1-var(--toast-index)*var(--spacing-panel))] [transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--offset-y)+var(--toast-swipe-movement-y)))] transition-[transform,opacity] duration-120 ease-out data-limited:opacity-0 data-starting-style:opacity-0 data-ending-style:opacity-0 motion-reduce:transition-none", typeof className === "function" ? className(state) : className),
|
|
2263
|
+
...props
|
|
2264
|
+
});
|
|
2265
|
+
}
|
|
2266
|
+
function ToastContent2({ className, ...props }) {
|
|
2267
|
+
return /* @__PURE__ */ jsx21(ToastPrimitive.Content, {
|
|
2268
|
+
"data-slot": "toast-content",
|
|
2269
|
+
className: (state) => cn2("flex items-center gap-control-gap p-panel", typeof className === "function" ? className(state) : className),
|
|
2270
|
+
...props
|
|
2271
|
+
});
|
|
2272
|
+
}
|
|
2273
|
+
function ToastTitle2({ className, ...props }) {
|
|
2274
|
+
return /* @__PURE__ */ jsx21(ToastPrimitive.Title, {
|
|
2275
|
+
"data-slot": "toast-title",
|
|
2276
|
+
className: (state) => cn2("text-sm font-medium", typeof className === "function" ? className(state) : className),
|
|
2277
|
+
...props
|
|
2278
|
+
});
|
|
2279
|
+
}
|
|
2280
|
+
function ToastDescription2({ className, ...props }) {
|
|
2281
|
+
return /* @__PURE__ */ jsx21(ToastPrimitive.Description, {
|
|
2282
|
+
"data-slot": "toast-description",
|
|
2283
|
+
className: (state) => cn2("text-sm text-muted-foreground", typeof className === "function" ? className(state) : className),
|
|
2284
|
+
...props
|
|
2285
|
+
});
|
|
2286
|
+
}
|
|
2287
|
+
function ToastAction2({
|
|
2288
|
+
className,
|
|
2289
|
+
render = /* @__PURE__ */ jsx21(Button2, {
|
|
2290
|
+
variant: "outline",
|
|
2291
|
+
size: "sm"
|
|
2292
|
+
}),
|
|
2293
|
+
...props
|
|
2294
|
+
}) {
|
|
2295
|
+
return /* @__PURE__ */ jsx21(ToastPrimitive.Action, {
|
|
2296
|
+
"data-slot": "toast-action",
|
|
2297
|
+
render,
|
|
2298
|
+
className: (state) => cn2("shrink-0", typeof className === "function" ? className(state) : className),
|
|
2299
|
+
...props
|
|
2300
|
+
});
|
|
2301
|
+
}
|
|
2302
|
+
function ToastClose2({
|
|
2303
|
+
className,
|
|
2304
|
+
children,
|
|
2305
|
+
render = /* @__PURE__ */ jsx21(Button2, {
|
|
2306
|
+
variant: "ghost",
|
|
2307
|
+
size: "icon-sm"
|
|
2308
|
+
}),
|
|
2309
|
+
...props
|
|
2310
|
+
}) {
|
|
2311
|
+
return /* @__PURE__ */ jsx21(ToastPrimitive.Close, {
|
|
2312
|
+
"data-slot": "toast-close",
|
|
2313
|
+
"aria-label": "Close toast",
|
|
2314
|
+
render,
|
|
2315
|
+
className: (state) => cn2("relative shrink-0 text-muted-foreground hover:text-foreground", typeof className === "function" ? className(state) : className),
|
|
2316
|
+
...props,
|
|
2317
|
+
children: children ?? /* @__PURE__ */ jsx21(XIcon2, {
|
|
2318
|
+
"aria-hidden": "true"
|
|
2319
|
+
})
|
|
2320
|
+
});
|
|
2321
|
+
}
|
|
2322
|
+
function ToastIcon({ type }) {
|
|
2323
|
+
switch (type) {
|
|
2324
|
+
case "success":
|
|
2325
|
+
return /* @__PURE__ */ jsx21(CircleCheckIcon, {
|
|
2326
|
+
"aria-hidden": "true"
|
|
2327
|
+
});
|
|
2328
|
+
case "info":
|
|
2329
|
+
return /* @__PURE__ */ jsx21(InfoIcon, {
|
|
2330
|
+
"aria-hidden": "true"
|
|
2331
|
+
});
|
|
2332
|
+
case "warning":
|
|
2333
|
+
return /* @__PURE__ */ jsx21(TriangleAlertIcon, {
|
|
2334
|
+
"aria-hidden": "true"
|
|
2335
|
+
});
|
|
2336
|
+
case "error":
|
|
2337
|
+
return /* @__PURE__ */ jsx21(OctagonXIcon, {
|
|
2338
|
+
"aria-hidden": "true",
|
|
2339
|
+
className: "text-destructive"
|
|
2340
|
+
});
|
|
2341
|
+
case "loading":
|
|
2342
|
+
return /* @__PURE__ */ jsx21(LoaderCircleIcon, {
|
|
2343
|
+
"aria-hidden": "true",
|
|
2344
|
+
className: "animate-spin motion-reduce:animate-none"
|
|
2345
|
+
});
|
|
2346
|
+
default:
|
|
2347
|
+
return null;
|
|
2348
|
+
}
|
|
2349
|
+
}
|
|
2350
|
+
function ToastList() {
|
|
2351
|
+
const { toasts } = ToastPrimitive.useToastManager();
|
|
2352
|
+
return /* @__PURE__ */ jsx21(Fragment, {
|
|
2353
|
+
children: toasts.map((toastItem) => /* @__PURE__ */ jsx21(Toast2, {
|
|
2354
|
+
toast: toastItem,
|
|
2355
|
+
children: /* @__PURE__ */ jsxs15(ToastContent2, {
|
|
2356
|
+
children: [
|
|
2357
|
+
/* @__PURE__ */ jsx21("span", {
|
|
2358
|
+
"data-slot": "toast-icon",
|
|
2359
|
+
className: "shrink-0 empty:hidden [&_svg]:size-4",
|
|
2360
|
+
children: /* @__PURE__ */ jsx21(ToastIcon, {
|
|
2361
|
+
type: toastItem.type
|
|
2362
|
+
})
|
|
2363
|
+
}),
|
|
2364
|
+
/* @__PURE__ */ jsxs15("div", {
|
|
2365
|
+
className: "flex min-w-0 flex-1 flex-col gap-1",
|
|
2366
|
+
children: [
|
|
2367
|
+
/* @__PURE__ */ jsx21(ToastTitle2, {}),
|
|
2368
|
+
/* @__PURE__ */ jsx21(ToastDescription2, {})
|
|
2369
|
+
]
|
|
2370
|
+
}),
|
|
2371
|
+
/* @__PURE__ */ jsx21(ToastAction2, {}),
|
|
2372
|
+
/* @__PURE__ */ jsx21(ToastClose2, {})
|
|
2373
|
+
]
|
|
2374
|
+
})
|
|
2375
|
+
}, toastItem.id))
|
|
2376
|
+
});
|
|
2377
|
+
}
|
|
2378
|
+
function ToastToaster2({ children, density, ...props }) {
|
|
2379
|
+
return /* @__PURE__ */ jsxs15(ToastProvider2, {
|
|
2380
|
+
...props,
|
|
2381
|
+
children: [
|
|
2382
|
+
children,
|
|
2383
|
+
/* @__PURE__ */ jsx21(ToastPortal2, {
|
|
2384
|
+
children: /* @__PURE__ */ jsx21(ToastViewport2, {
|
|
2385
|
+
density,
|
|
2386
|
+
children: /* @__PURE__ */ jsx21(ToastList, {})
|
|
2387
|
+
})
|
|
2388
|
+
})
|
|
2389
|
+
]
|
|
2390
|
+
});
|
|
2391
|
+
}
|
|
2392
|
+
var createToastManager2 = ToastPrimitive.createToastManager;
|
|
2393
|
+
// src/hooks/useToastManager.ts
|
|
2394
|
+
import { Toast } from "@base-ui/react/toast";
|
|
2395
|
+
function useToastManager2() {
|
|
2396
|
+
return Toast.useToastManager();
|
|
2397
|
+
}
|
|
2398
|
+
// src/components/Marker.tsx
|
|
2399
|
+
import { mergeProps as mergeProps6 } from "@base-ui/react/merge-props";
|
|
2400
|
+
import { useRender as useRender6 } from "@base-ui/react/use-render";
|
|
2401
|
+
import { cva as cva4 } from "class-variance-authority";
|
|
2402
|
+
import { jsx as jsx22 } from "react/jsx-runtime";
|
|
2403
|
+
var markerVariants2 = cva4("group/marker relative flex min-h-4 w-full items-center gap-control-gap text-start text-sm text-muted-foreground [&_svg:not([class*='size-'])]:size-4 [a]:underline [a]:underline-offset-3 [a]:hover:text-foreground [&:is(a,button)]:outline-none [&:is(a,button)]:focus-visible:outline-1 [&:is(a,button)]:focus-visible:outline-ring", {
|
|
2404
|
+
variants: {
|
|
2405
|
+
variant: {
|
|
2406
|
+
default: "",
|
|
2407
|
+
separator: "before:me-1 before:h-px before:min-w-0 before:flex-1 before:bg-border after:ms-1 after:h-px after:min-w-0 after:flex-1 after:bg-border",
|
|
2408
|
+
border: "border-b border-border pb-control-gap"
|
|
2409
|
+
}
|
|
2410
|
+
}
|
|
2411
|
+
});
|
|
2412
|
+
function Marker2({ density, className, variant = "default", render, ...props }) {
|
|
2413
|
+
return useRender6({
|
|
2414
|
+
defaultTagName: "div",
|
|
2415
|
+
props: mergeProps6({ className: cn2(markerVariants2({ variant, className })) }, props),
|
|
2416
|
+
render,
|
|
2417
|
+
state: { slot: "marker", variant, density }
|
|
2418
|
+
});
|
|
2419
|
+
}
|
|
2420
|
+
function MarkerIcon2({ density, className, ...props }) {
|
|
2421
|
+
return /* @__PURE__ */ jsx22("span", {
|
|
2422
|
+
"data-density": density,
|
|
2423
|
+
"data-slot": "marker-icon",
|
|
2424
|
+
"aria-hidden": "true",
|
|
2425
|
+
className: cn2("size-4 shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
|
|
2426
|
+
...props
|
|
2427
|
+
});
|
|
2428
|
+
}
|
|
2429
|
+
function MarkerContent2({ density, className, ...props }) {
|
|
2430
|
+
return /* @__PURE__ */ jsx22("span", {
|
|
2431
|
+
"data-density": density,
|
|
2432
|
+
"data-slot": "marker-content",
|
|
2433
|
+
className: cn2("min-w-0 wrap-break-word group-data-[variant=separator]/marker:text-center [&>a]:underline [&>a]:underline-offset-3 [&>a:hover]:text-foreground", className),
|
|
2434
|
+
...props
|
|
2435
|
+
});
|
|
2436
|
+
}
|
|
2437
|
+
// src/components/Bubble.tsx
|
|
2438
|
+
import { mergeProps as mergeProps7 } from "@base-ui/react/merge-props";
|
|
2439
|
+
import { useRender as useRender7 } from "@base-ui/react/use-render";
|
|
2440
|
+
import { cva as cva5 } from "class-variance-authority";
|
|
2441
|
+
import { jsx as jsx23 } from "react/jsx-runtime";
|
|
2442
|
+
function BubbleGroup2({ density, className, ...props }) {
|
|
2443
|
+
return /* @__PURE__ */ jsx23("div", {
|
|
2444
|
+
"data-density": density,
|
|
2445
|
+
"data-slot": "bubble-group",
|
|
2446
|
+
className: cn2("flex min-w-0 flex-col gap-control-gap", className),
|
|
2447
|
+
...props
|
|
2448
|
+
});
|
|
2449
|
+
}
|
|
2450
|
+
var bubbleVariants = cva5("group/bubble relative flex w-fit max-w-[80%] min-w-0 flex-col gap-1 group-data-[align=end]/message:self-end data-[align=end]:self-end data-[variant=ghost]:max-w-full", {
|
|
2451
|
+
variants: {
|
|
2452
|
+
variant: {
|
|
2453
|
+
default: "*:data-[slot=bubble-content]:bg-primary *:data-[slot=bubble-content]:text-primary-foreground [&>[data-slot=bubble-content]:is(button,a):hover]:bg-primary/80",
|
|
2454
|
+
secondary: "*:data-[slot=bubble-content]:bg-secondary *:data-[slot=bubble-content]:text-secondary-foreground [&>[data-slot=bubble-content]:is(button,a):hover]:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)]",
|
|
2455
|
+
muted: "*:data-[slot=bubble-content]:bg-muted [&>[data-slot=bubble-content]:is(button,a):hover]:bg-[color-mix(in_oklch,var(--muted),var(--foreground)_5%)]",
|
|
2456
|
+
tinted: "*:data-[slot=bubble-content]:bg-primary/10 *:data-[slot=bubble-content]:text-foreground [&>[data-slot=bubble-content]:is(button,a):hover]:bg-primary/20",
|
|
2457
|
+
outline: "*:data-[slot=bubble-content]:border-border *:data-[slot=bubble-content]:bg-background [&>[data-slot=bubble-content]:is(button,a):hover]:bg-muted [&>[data-slot=bubble-content]:is(button,a):hover]:text-foreground",
|
|
2458
|
+
ghost: "border-none *:data-[slot=bubble-content]:rounded-none *:data-[slot=bubble-content]:bg-transparent *:data-[slot=bubble-content]:p-0 [&>[data-slot=bubble-content]:is(button,a):hover]:bg-muted [&>[data-slot=bubble-content]:is(button,a):hover]:text-foreground",
|
|
2459
|
+
destructive: "*:data-[slot=bubble-content]:bg-destructive/10 *:data-[slot=bubble-content]:text-destructive [&>[data-slot=bubble-content]:is(button,a):hover]:bg-destructive/20"
|
|
2460
|
+
}
|
|
2461
|
+
},
|
|
2462
|
+
defaultVariants: { variant: "default" }
|
|
2463
|
+
});
|
|
2464
|
+
function Bubble2({ density, variant = "default", align = "start", className, ...props }) {
|
|
2465
|
+
return /* @__PURE__ */ jsx23("div", {
|
|
2466
|
+
"data-density": density,
|
|
2467
|
+
"data-slot": "bubble",
|
|
2468
|
+
"data-variant": variant,
|
|
2469
|
+
"data-align": align,
|
|
2470
|
+
className: cn2(bubbleVariants({ variant }), className),
|
|
2471
|
+
...props
|
|
2472
|
+
});
|
|
2473
|
+
}
|
|
2474
|
+
function BubbleContent2({ density, className, render, ...props }) {
|
|
2475
|
+
return useRender7({
|
|
2476
|
+
defaultTagName: "div",
|
|
2477
|
+
props: mergeProps7({
|
|
2478
|
+
className: cn2("w-fit max-w-full min-w-0 overflow-hidden rounded-sm border border-transparent px-control-x py-control-gap text-sm leading-relaxed wrap-break-word group-data-[align=end]/bubble:self-end [&:is(button)]:text-start [&:is(button,a)]:transition-colors motion-reduce:transition-none [&:is(button,a)]:outline-none [&:is(button,a)]:focus-visible:border-ring [&:is(button,a)]:focus-visible:ring-1 [&:is(button,a)]:focus-visible:ring-ring", className)
|
|
2479
|
+
}, props),
|
|
2480
|
+
render,
|
|
2481
|
+
state: { slot: "bubble-content", density }
|
|
2482
|
+
});
|
|
2483
|
+
}
|
|
2484
|
+
var bubbleReactionsVariants = cva5("absolute z-10 flex w-fit shrink-0 items-center justify-center gap-1 rounded-sm border border-border bg-muted px-1.5 py-0.5 text-sm ring-2 ring-card has-[button]:p-0", {
|
|
2485
|
+
variants: {
|
|
2486
|
+
side: { top: "top-0 -translate-y-3/4", bottom: "bottom-0 translate-y-3/4" },
|
|
2487
|
+
align: { start: "start-3", end: "end-3" }
|
|
2488
|
+
},
|
|
2489
|
+
defaultVariants: { side: "bottom", align: "end" }
|
|
2490
|
+
});
|
|
2491
|
+
function BubbleReactions2({
|
|
2492
|
+
density,
|
|
2493
|
+
side = "bottom",
|
|
2494
|
+
align = "end",
|
|
2495
|
+
className,
|
|
2496
|
+
...props
|
|
2497
|
+
}) {
|
|
2498
|
+
return /* @__PURE__ */ jsx23("div", {
|
|
2499
|
+
"data-density": density,
|
|
2500
|
+
"data-slot": "bubble-reactions",
|
|
2501
|
+
"data-align": align,
|
|
2502
|
+
"data-side": side,
|
|
2503
|
+
className: cn2(bubbleReactionsVariants({ side, align }), className),
|
|
2504
|
+
...props
|
|
2505
|
+
});
|
|
2506
|
+
}
|
|
2507
|
+
// src/components/Message.tsx
|
|
2508
|
+
import { useContext as useContext2, useLayoutEffect, useMemo as useMemo3, useRef as useRef2, useState } from "react";
|
|
2509
|
+
import { useRender as useRender8 } from "@base-ui/react/use-render";
|
|
2510
|
+
|
|
2511
|
+
// src/message/MessageContext.ts
|
|
2512
|
+
import { createContext as createContext2 } from "react";
|
|
2513
|
+
var MessageContext = createContext2(null);
|
|
2514
|
+
|
|
2515
|
+
// src/components/Message.tsx
|
|
2516
|
+
import { jsx as jsx24 } from "react/jsx-runtime";
|
|
2517
|
+
function MessageGroup2({ density, className, ...props }) {
|
|
2518
|
+
return /* @__PURE__ */ jsx24("div", {
|
|
2519
|
+
"data-density": density,
|
|
2520
|
+
"data-slot": "message-group",
|
|
2521
|
+
className: cn2("flex min-w-0 flex-col gap-control-gap", className),
|
|
2522
|
+
...props
|
|
2523
|
+
});
|
|
2524
|
+
}
|
|
2525
|
+
function Message2({ density, className, align = "start", style, ...props }) {
|
|
2526
|
+
const [footerOffset, setFooterOffset] = useState(0);
|
|
2527
|
+
const context = useMemo3(() => ({ setFooterOffset }), []);
|
|
2528
|
+
const messageStyle = { ...style, "--message-footer-offset": `${footerOffset}px` };
|
|
2529
|
+
return /* @__PURE__ */ jsx24(MessageContext.Provider, {
|
|
2530
|
+
value: context,
|
|
2531
|
+
children: /* @__PURE__ */ jsx24("div", {
|
|
2532
|
+
"data-density": density,
|
|
2533
|
+
"data-slot": "message",
|
|
2534
|
+
"data-align": align,
|
|
2535
|
+
style: messageStyle,
|
|
2536
|
+
className: cn2("group/message relative flex w-full min-w-0 items-end gap-control-gap text-sm data-[align=end]:flex-row-reverse", className),
|
|
2537
|
+
...props
|
|
2538
|
+
})
|
|
2539
|
+
});
|
|
2540
|
+
}
|
|
2541
|
+
function MessageAvatar2({ density, className, ...props }) {
|
|
2542
|
+
return /* @__PURE__ */ jsx24("div", {
|
|
2543
|
+
"data-density": density,
|
|
2544
|
+
"data-slot": "message-avatar",
|
|
2545
|
+
className: cn2("flex w-fit min-w-8 shrink-0 items-center justify-center self-end overflow-hidden rounded-full bg-muted group-has-data-[slot=message-footer]/message:-translate-y-(--message-footer-offset)", className),
|
|
2546
|
+
...props
|
|
2547
|
+
});
|
|
2548
|
+
}
|
|
2549
|
+
function MessageContent2({ density, className, ...props }) {
|
|
2550
|
+
return /* @__PURE__ */ jsx24("div", {
|
|
2551
|
+
"data-density": density,
|
|
2552
|
+
"data-slot": "message-content",
|
|
2553
|
+
className: cn2("flex w-full min-w-0 flex-col gap-control-gap wrap-break-word group-data-[align=end]/message:[&>[data-slot]:not([data-slot=message-header])]:self-end", className),
|
|
2554
|
+
...props
|
|
2555
|
+
});
|
|
2556
|
+
}
|
|
2557
|
+
function MessageHeader2({ density, className, ...props }) {
|
|
2558
|
+
return /* @__PURE__ */ jsx24("div", {
|
|
2559
|
+
"data-density": density,
|
|
2560
|
+
"data-slot": "message-header",
|
|
2561
|
+
className: cn2("flex max-w-full min-w-0 items-center px-control-x text-xs font-medium text-muted-foreground group-has-data-[variant=ghost]/message:px-0", className),
|
|
2562
|
+
...props
|
|
2563
|
+
});
|
|
2564
|
+
}
|
|
2565
|
+
function MessageFooter2({ density, className, ...props }) {
|
|
2566
|
+
const context = useContext2(MessageContext);
|
|
2567
|
+
const footerRef = useRef2(null);
|
|
2568
|
+
useLayoutEffect(() => {
|
|
2569
|
+
const footer = footerRef.current;
|
|
2570
|
+
const content = footer?.parentElement;
|
|
2571
|
+
if (!context || !footer || !content)
|
|
2572
|
+
return;
|
|
2573
|
+
const measure = () => {
|
|
2574
|
+
const surface = footer.previousElementSibling;
|
|
2575
|
+
context.setFooterOffset(surface ? content.getBoundingClientRect().bottom - surface.getBoundingClientRect().bottom : 0);
|
|
2576
|
+
};
|
|
2577
|
+
measure();
|
|
2578
|
+
const observer = new ResizeObserver(measure);
|
|
2579
|
+
observer.observe(footer, { box: "border-box" });
|
|
2580
|
+
observer.observe(content, { box: "border-box" });
|
|
2581
|
+
return () => {
|
|
2582
|
+
observer.disconnect();
|
|
2583
|
+
context.setFooterOffset(0);
|
|
2584
|
+
};
|
|
2585
|
+
}, [context]);
|
|
2586
|
+
return useRender8({
|
|
2587
|
+
defaultTagName: "div",
|
|
2588
|
+
ref: footerRef,
|
|
2589
|
+
state: { slot: "message-footer", density },
|
|
2590
|
+
props: {
|
|
2591
|
+
...props,
|
|
2592
|
+
className: cn2("flex max-w-full min-w-0 items-center px-control-x text-xs font-medium text-muted-foreground group-has-data-[variant=ghost]/message:px-0 group-data-[align=end]/message:justify-end", className)
|
|
2593
|
+
}
|
|
2594
|
+
});
|
|
2595
|
+
}
|
|
2596
|
+
// src/components/Attachment.tsx
|
|
2597
|
+
import { mergeProps as mergeProps8 } from "@base-ui/react/merge-props";
|
|
2598
|
+
import { useRender as useRender9 } from "@base-ui/react/use-render";
|
|
2599
|
+
import { cva as cva6 } from "class-variance-authority";
|
|
2600
|
+
import { jsx as jsx25 } from "react/jsx-runtime";
|
|
2601
|
+
var attachmentVariants = cva6("group/attachment relative flex w-fit max-w-full min-w-0 shrink-0 flex-wrap rounded-md border bg-card text-card-foreground transition-colors motion-reduce:transition-none focus-within:ring-1 focus-within:ring-ring has-[>a,>button]:hover:bg-muted/50 data-[state=error]:border-destructive data-[state=idle]:border-dashed", {
|
|
2602
|
+
variants: {
|
|
2603
|
+
size: {
|
|
2604
|
+
default: "gap-control-gap text-sm has-data-[slot=attachment-content]:px-control-x has-data-[slot=attachment-content]:py-control-gap has-data-[slot=attachment-media]:p-control-gap",
|
|
2605
|
+
sm: "gap-control-gap text-xs has-data-[slot=attachment-content]:px-2 has-data-[slot=attachment-content]:py-1.5 has-data-[slot=attachment-media]:p-1.5",
|
|
2606
|
+
xs: "gap-1.5 text-xs has-data-[slot=attachment-content]:px-1.5 has-data-[slot=attachment-content]:py-1 has-data-[slot=attachment-media]:p-1"
|
|
2607
|
+
},
|
|
2608
|
+
orientation: {
|
|
2609
|
+
horizontal: "min-w-40 items-center",
|
|
2610
|
+
vertical: "w-24 flex-col has-data-[slot=attachment-content]:w-30"
|
|
2611
|
+
}
|
|
2612
|
+
}
|
|
2613
|
+
});
|
|
2614
|
+
function Attachment2({
|
|
2615
|
+
density,
|
|
2616
|
+
className,
|
|
2617
|
+
state = "done",
|
|
2618
|
+
size = "default",
|
|
2619
|
+
orientation = "horizontal",
|
|
2620
|
+
...props
|
|
2621
|
+
}) {
|
|
2622
|
+
return /* @__PURE__ */ jsx25("div", {
|
|
2623
|
+
"data-slot": "attachment",
|
|
2624
|
+
"data-density": density,
|
|
2625
|
+
"data-state": state,
|
|
2626
|
+
"data-size": size,
|
|
2627
|
+
"data-orientation": orientation,
|
|
2628
|
+
className: cn2(attachmentVariants({ size, orientation }), className),
|
|
2629
|
+
...props
|
|
2630
|
+
});
|
|
2631
|
+
}
|
|
2632
|
+
var attachmentMediaVariants = cva6("relative flex aspect-square w-10 shrink-0 items-center justify-center overflow-hidden rounded-sm bg-muted text-foreground group-data-[orientation=vertical]/attachment:w-full group-data-[orientation=horizontal]/attachment:group-data-[size=sm]/attachment:w-8 group-data-[orientation=horizontal]/attachment:group-data-[size=xs]/attachment:w-7 group-data-[state=error]/attachment:bg-destructive/10 group-data-[state=error]/attachment:text-destructive group-data-[orientation=vertical]/attachment:*:data-[slot=spinner]:size-6! [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 group-data-[orientation=vertical]/attachment:[&_svg:not([class*='size-'])]:size-6 group-data-[size=xs]/attachment:[&_svg:not([class*='size-'])]:size-3.5", {
|
|
2633
|
+
variants: {
|
|
2634
|
+
variant: {
|
|
2635
|
+
icon: "",
|
|
2636
|
+
image: "opacity-60 group-data-[state=done]/attachment:opacity-100 group-data-[state=idle]/attachment:opacity-100 *:[img]:aspect-square *:[img]:w-full *:[img]:object-cover"
|
|
2637
|
+
}
|
|
2638
|
+
},
|
|
2639
|
+
defaultVariants: { variant: "icon" }
|
|
2640
|
+
});
|
|
2641
|
+
function AttachmentMedia2({ density, className, variant = "icon", ...props }) {
|
|
2642
|
+
return /* @__PURE__ */ jsx25("div", {
|
|
2643
|
+
"data-slot": "attachment-media",
|
|
2644
|
+
"data-density": density,
|
|
2645
|
+
"data-variant": variant,
|
|
2646
|
+
className: cn2(attachmentMediaVariants({ variant }), className),
|
|
2647
|
+
...props
|
|
2648
|
+
});
|
|
2649
|
+
}
|
|
2650
|
+
function AttachmentContent2({ density, className, ...props }) {
|
|
2651
|
+
return /* @__PURE__ */ jsx25("div", {
|
|
2652
|
+
"data-slot": "attachment-content",
|
|
2653
|
+
"data-density": density,
|
|
2654
|
+
className: cn2("max-w-full min-w-0 flex-1 leading-tight group-data-[orientation=vertical]/attachment:px-1", className),
|
|
2655
|
+
...props
|
|
2656
|
+
});
|
|
2657
|
+
}
|
|
2658
|
+
function AttachmentTitle2({ density, className, ...props }) {
|
|
2659
|
+
return /* @__PURE__ */ jsx25("span", {
|
|
2660
|
+
"data-slot": "attachment-title",
|
|
2661
|
+
"data-density": density,
|
|
2662
|
+
className: cn2("block max-w-full min-w-0 truncate font-medium group-data-[state=processing]/attachment:shimmer group-data-[state=uploading]/attachment:shimmer", className),
|
|
2663
|
+
...props
|
|
2664
|
+
});
|
|
2665
|
+
}
|
|
2666
|
+
function AttachmentDescription2({ density, className, ...props }) {
|
|
2667
|
+
return /* @__PURE__ */ jsx25("span", {
|
|
2668
|
+
"data-slot": "attachment-description",
|
|
2669
|
+
"data-density": density,
|
|
2670
|
+
className: cn2("mt-0.5 block max-w-full min-w-0 truncate text-xs text-muted-foreground group-data-[state=error]/attachment:text-destructive", className),
|
|
2671
|
+
...props
|
|
2672
|
+
});
|
|
2673
|
+
}
|
|
2674
|
+
function AttachmentActions2({ density, className, ...props }) {
|
|
2675
|
+
return /* @__PURE__ */ jsx25("div", {
|
|
2676
|
+
"data-slot": "attachment-actions",
|
|
2677
|
+
"data-density": density,
|
|
2678
|
+
className: cn2("relative z-20 flex shrink-0 items-center group-data-[orientation=vertical]/attachment:absolute group-data-[orientation=vertical]/attachment:top-3 group-data-[orientation=vertical]/attachment:end-3 group-data-[orientation=vertical]/attachment:gap-1", className),
|
|
2679
|
+
...props
|
|
2680
|
+
});
|
|
2681
|
+
}
|
|
2682
|
+
function AttachmentAction2({
|
|
2683
|
+
className,
|
|
2684
|
+
variant = "ghost",
|
|
2685
|
+
size = "icon-xs",
|
|
2686
|
+
...props
|
|
2687
|
+
}) {
|
|
2688
|
+
return /* @__PURE__ */ jsx25(Button2, {
|
|
2689
|
+
"data-slot": "attachment-action",
|
|
2690
|
+
variant,
|
|
2691
|
+
size,
|
|
2692
|
+
className,
|
|
2693
|
+
...props
|
|
2694
|
+
});
|
|
2695
|
+
}
|
|
2696
|
+
function AttachmentTrigger2({ density, className, render, type, ...props }) {
|
|
2697
|
+
return useRender9({
|
|
2698
|
+
defaultTagName: "button",
|
|
2699
|
+
props: mergeProps8({ type: render ? type : type ?? "button", className: cn2("absolute inset-0 z-10 outline-none", className) }, props),
|
|
2700
|
+
render,
|
|
2701
|
+
state: { slot: "attachment-trigger", density }
|
|
2702
|
+
});
|
|
2703
|
+
}
|
|
2704
|
+
function AttachmentGroup2({ density, className, ...props }) {
|
|
2705
|
+
return /* @__PURE__ */ jsx25("div", {
|
|
2706
|
+
"data-slot": "attachment-group",
|
|
2707
|
+
"data-density": density,
|
|
2708
|
+
className: cn2("flex min-w-0 scroll-fade-x snap-x snap-mandatory scroll-px-1 no-scrollbar gap-3 overflow-x-auto overscroll-x-contain py-1 *:data-[slot=attachment]:flex-none *:data-[slot=attachment]:snap-start", className),
|
|
2709
|
+
...props
|
|
2710
|
+
});
|
|
2711
|
+
}
|
|
2712
|
+
// src/components/InlineEdit.tsx
|
|
2713
|
+
import { useEffect as useEffect2, useRef as useRef3, useState as useState2 } from "react";
|
|
2714
|
+
import { jsx as jsx26, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
2715
|
+
function InlineEdit2({
|
|
2716
|
+
label,
|
|
2717
|
+
value,
|
|
2718
|
+
density,
|
|
2719
|
+
isDisabled = false,
|
|
2720
|
+
shouldSelectOnMount = true,
|
|
2721
|
+
onValueChange,
|
|
2722
|
+
onCommit,
|
|
2723
|
+
onCancel
|
|
2724
|
+
}) {
|
|
2725
|
+
const input = useRef3(null);
|
|
2726
|
+
const isFinished = useRef3(false);
|
|
2727
|
+
const shouldCancel = useRef3(false);
|
|
2728
|
+
const [isSaving, setSaving] = useState2(false);
|
|
2729
|
+
const [error, setError] = useState2("");
|
|
2730
|
+
useEffect2(() => {
|
|
2731
|
+
input.current?.focus();
|
|
2732
|
+
if (shouldSelectOnMount)
|
|
2733
|
+
input.current?.select();
|
|
2734
|
+
}, [shouldSelectOnMount]);
|
|
2735
|
+
const save = async () => {
|
|
2736
|
+
if (isFinished.current || isDisabled)
|
|
2737
|
+
return;
|
|
2738
|
+
isFinished.current = true;
|
|
2739
|
+
setSaving(true);
|
|
2740
|
+
setError("");
|
|
2741
|
+
try {
|
|
2742
|
+
await onCommit(value);
|
|
2743
|
+
} catch (error) {
|
|
2744
|
+
isFinished.current = false;
|
|
2745
|
+
setError(error instanceof Error ? error.message : "Could not save this edit.");
|
|
2746
|
+
} finally {
|
|
2747
|
+
setSaving(false);
|
|
2748
|
+
}
|
|
2749
|
+
};
|
|
2750
|
+
return /* @__PURE__ */ jsxs16("form", {
|
|
2751
|
+
className: "flex min-w-0 flex-col gap-1",
|
|
2752
|
+
onSubmit: (event) => {
|
|
2753
|
+
event.preventDefault();
|
|
2754
|
+
save();
|
|
2755
|
+
},
|
|
2756
|
+
children: [
|
|
2757
|
+
/* @__PURE__ */ jsx26(Input2, {
|
|
2758
|
+
ref: input,
|
|
2759
|
+
density,
|
|
2760
|
+
"aria-label": label,
|
|
2761
|
+
"aria-invalid": Boolean(error),
|
|
2762
|
+
"aria-description": "Enter saves. Escape cancels.",
|
|
2763
|
+
value,
|
|
2764
|
+
disabled: isDisabled || isSaving,
|
|
2765
|
+
onChange: (event) => onValueChange(event.target.value),
|
|
2766
|
+
onBlur: () => {
|
|
2767
|
+
if (shouldCancel.current && !isFinished.current) {
|
|
2768
|
+
isFinished.current = true;
|
|
2769
|
+
onCancel();
|
|
2770
|
+
} else
|
|
2771
|
+
save();
|
|
2772
|
+
},
|
|
2773
|
+
onKeyDown: (event) => {
|
|
2774
|
+
if (event.key === "Escape") {
|
|
2775
|
+
event.preventDefault();
|
|
2776
|
+
event.stopPropagation();
|
|
2777
|
+
shouldCancel.current = true;
|
|
2778
|
+
event.currentTarget.blur();
|
|
2779
|
+
} else if (event.key === "Enter") {
|
|
2780
|
+
event.preventDefault();
|
|
2781
|
+
event.currentTarget.blur();
|
|
2782
|
+
}
|
|
2783
|
+
}
|
|
2784
|
+
}),
|
|
2785
|
+
error && /* @__PURE__ */ jsx26("p", {
|
|
2786
|
+
role: "alert",
|
|
2787
|
+
className: "text-xs text-destructive",
|
|
2788
|
+
children: error
|
|
2789
|
+
})
|
|
2790
|
+
]
|
|
2791
|
+
});
|
|
2792
|
+
}
|
|
2793
|
+
// src/components/StarRating.tsx
|
|
2794
|
+
import { Radio } from "@base-ui/react/radio";
|
|
2795
|
+
import { RadioGroup } from "@base-ui/react/radio-group";
|
|
2796
|
+
import { StarIcon, CircleOffIcon } from "lucide-react";
|
|
2797
|
+
import { jsx as jsx27 } from "react/jsx-runtime";
|
|
2798
|
+
function StarRating2({ label, value, disabled, density, onValueChange }) {
|
|
2799
|
+
return /* @__PURE__ */ jsx27(RadioGroup, {
|
|
2800
|
+
"aria-label": label,
|
|
2801
|
+
value,
|
|
2802
|
+
disabled,
|
|
2803
|
+
"data-density": density,
|
|
2804
|
+
className: "inline-flex w-fit shrink-0 items-center gap-0.5",
|
|
2805
|
+
onValueChange,
|
|
2806
|
+
children: [1, 2, 3, 4, 5, 0].map((star) => /* @__PURE__ */ jsx27(Radio.Root, {
|
|
2807
|
+
value: star,
|
|
2808
|
+
nativeButton: true,
|
|
2809
|
+
render: /* @__PURE__ */ jsx27("button", {
|
|
2810
|
+
type: "button"
|
|
2811
|
+
}),
|
|
2812
|
+
"aria-label": star === 0 ? "Unrated" : `${star} ${star === 1 ? "star" : "stars"}`,
|
|
2813
|
+
title: star === 0 ? "Clear rating" : `${star} stars`,
|
|
2814
|
+
className: "inline-flex size-5 shrink-0 items-center justify-center rounded-sm text-muted-foreground outline-none hover:text-primary focus-visible:ring-1 focus-visible:ring-ring data-disabled:cursor-not-allowed data-disabled:opacity-50",
|
|
2815
|
+
children: star === 0 ? /* @__PURE__ */ jsx27(CircleOffIcon, {
|
|
2816
|
+
"aria-hidden": "true",
|
|
2817
|
+
className: "size-3"
|
|
2818
|
+
}) : /* @__PURE__ */ jsx27(StarIcon, {
|
|
2819
|
+
"aria-hidden": "true",
|
|
2820
|
+
className: star <= value ? "size-3.5 fill-primary text-primary" : "size-3.5"
|
|
2821
|
+
})
|
|
2822
|
+
}, star))
|
|
2823
|
+
});
|
|
2824
|
+
}
|
|
2825
|
+
// src/components/ConfirmationDialog.tsx
|
|
2826
|
+
import { useState as useState3 } from "react";
|
|
2827
|
+
import { jsx as jsx28, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
2828
|
+
function ConfirmationDialog2({
|
|
2829
|
+
open,
|
|
2830
|
+
title,
|
|
2831
|
+
description,
|
|
2832
|
+
confirmLabel,
|
|
2833
|
+
onOpenChange,
|
|
2834
|
+
onConfirm
|
|
2835
|
+
}) {
|
|
2836
|
+
const [isPending, setPending] = useState3(false);
|
|
2837
|
+
const [error, setError] = useState3("");
|
|
2838
|
+
return /* @__PURE__ */ jsx28(AlertDialog2, {
|
|
2839
|
+
open,
|
|
2840
|
+
onOpenChange: (next) => {
|
|
2841
|
+
if (!isPending) {
|
|
2842
|
+
setError("");
|
|
2843
|
+
onOpenChange(next);
|
|
2844
|
+
}
|
|
2845
|
+
},
|
|
2846
|
+
children: /* @__PURE__ */ jsxs17(AlertDialogContent2, {
|
|
2847
|
+
children: [
|
|
2848
|
+
/* @__PURE__ */ jsxs17(AlertDialogHeader2, {
|
|
2849
|
+
children: [
|
|
2850
|
+
/* @__PURE__ */ jsx28(AlertDialogTitle2, {
|
|
2851
|
+
children: title
|
|
2852
|
+
}),
|
|
2853
|
+
/* @__PURE__ */ jsx28(AlertDialogDescription2, {
|
|
2854
|
+
children: description
|
|
2855
|
+
})
|
|
2856
|
+
]
|
|
2857
|
+
}),
|
|
2858
|
+
error && /* @__PURE__ */ jsx28(Alert2, {
|
|
2859
|
+
variant: "destructive",
|
|
2860
|
+
children: /* @__PURE__ */ jsx28(AlertDescription2, {
|
|
2861
|
+
children: error
|
|
2862
|
+
})
|
|
2863
|
+
}),
|
|
2864
|
+
/* @__PURE__ */ jsxs17(AlertDialogFooter2, {
|
|
2865
|
+
children: [
|
|
2866
|
+
/* @__PURE__ */ jsx28(AlertDialogCancel2, {
|
|
2867
|
+
disabled: isPending,
|
|
2868
|
+
children: "Cancel"
|
|
2869
|
+
}),
|
|
2870
|
+
/* @__PURE__ */ jsx28(Button2, {
|
|
2871
|
+
variant: "destructive",
|
|
2872
|
+
disabled: isPending,
|
|
2873
|
+
onClick: async () => {
|
|
2874
|
+
setPending(true);
|
|
2875
|
+
setError("");
|
|
2876
|
+
try {
|
|
2877
|
+
await onConfirm();
|
|
2878
|
+
onOpenChange(false);
|
|
2879
|
+
} catch (error) {
|
|
2880
|
+
setError(error instanceof Error ? error.message : "The action could not be completed.");
|
|
2881
|
+
} finally {
|
|
2882
|
+
setPending(false);
|
|
2883
|
+
}
|
|
2884
|
+
},
|
|
2885
|
+
children: isPending ? "Working…" : confirmLabel
|
|
2886
|
+
})
|
|
2887
|
+
]
|
|
2888
|
+
})
|
|
2889
|
+
]
|
|
2890
|
+
})
|
|
2891
|
+
});
|
|
2892
|
+
}
|
|
2893
|
+
// src/components/ImagePicker.tsx
|
|
2894
|
+
import { useRef as useRef4 } from "react";
|
|
2895
|
+
import { ImageIcon, UploadIcon } from "lucide-react";
|
|
2896
|
+
|
|
2897
|
+
// src/hooks/useObjectURL.ts
|
|
2898
|
+
import { useEffect as useEffect3, useState as useState4 } from "react";
|
|
2899
|
+
function useObjectURL(file) {
|
|
2900
|
+
const [url, setURL] = useState4();
|
|
2901
|
+
useEffect3(() => {
|
|
2902
|
+
if (!file) {
|
|
2903
|
+
setURL(undefined);
|
|
2904
|
+
return;
|
|
2905
|
+
}
|
|
2906
|
+
const next = URL.createObjectURL(file);
|
|
2907
|
+
setURL(next);
|
|
2908
|
+
return () => URL.revokeObjectURL(next);
|
|
2909
|
+
}, [file]);
|
|
2910
|
+
return url;
|
|
2911
|
+
}
|
|
2912
|
+
|
|
2913
|
+
// src/components/ImagePicker.tsx
|
|
2914
|
+
import { jsx as jsx29, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
2915
|
+
function ImagePicker2({ src, file, label, disabled, onFileChange, onClear }) {
|
|
2916
|
+
const input = useRef4(null);
|
|
2917
|
+
const preview = useObjectURL(file);
|
|
2918
|
+
const image = file === null ? undefined : preview ?? src;
|
|
2919
|
+
return /* @__PURE__ */ jsxs18("figure", {
|
|
2920
|
+
className: "flex min-w-0 flex-col items-center gap-3",
|
|
2921
|
+
"aria-label": label,
|
|
2922
|
+
children: [
|
|
2923
|
+
/* @__PURE__ */ jsxs18(Avatar2, {
|
|
2924
|
+
size: "preview",
|
|
2925
|
+
shape: "square",
|
|
2926
|
+
children: [
|
|
2927
|
+
/* @__PURE__ */ jsx29(AvatarImage2, {
|
|
2928
|
+
src: image,
|
|
2929
|
+
alt: label
|
|
2930
|
+
}),
|
|
2931
|
+
/* @__PURE__ */ jsx29(AvatarFallback2, {
|
|
2932
|
+
children: /* @__PURE__ */ jsx29(ImageIcon, {
|
|
2933
|
+
className: "size-12",
|
|
2934
|
+
"aria-hidden": "true"
|
|
2935
|
+
})
|
|
2936
|
+
})
|
|
2937
|
+
]
|
|
2938
|
+
}),
|
|
2939
|
+
/* @__PURE__ */ jsx29("input", {
|
|
2940
|
+
ref: input,
|
|
2941
|
+
hidden: true,
|
|
2942
|
+
type: "file",
|
|
2943
|
+
accept: "image/png,image/jpeg,image/gif",
|
|
2944
|
+
"aria-label": "Choose image file",
|
|
2945
|
+
disabled,
|
|
2946
|
+
onChange: (event) => {
|
|
2947
|
+
const selected = event.currentTarget.files?.[0];
|
|
2948
|
+
if (selected)
|
|
2949
|
+
onFileChange(selected);
|
|
2950
|
+
event.currentTarget.value = "";
|
|
2951
|
+
}
|
|
2952
|
+
}),
|
|
2953
|
+
/* @__PURE__ */ jsxs18("div", {
|
|
2954
|
+
className: "flex flex-wrap justify-center gap-2",
|
|
2955
|
+
children: [
|
|
2956
|
+
/* @__PURE__ */ jsxs18(Button2, {
|
|
2957
|
+
type: "button",
|
|
2958
|
+
variant: "outline",
|
|
2959
|
+
disabled,
|
|
2960
|
+
onClick: () => input.current?.click(),
|
|
2961
|
+
children: [
|
|
2962
|
+
/* @__PURE__ */ jsx29(UploadIcon, {
|
|
2963
|
+
"data-icon": "inline-start"
|
|
2964
|
+
}),
|
|
2965
|
+
"Upload image"
|
|
2966
|
+
]
|
|
2967
|
+
}),
|
|
2968
|
+
/* @__PURE__ */ jsx29(Button2, {
|
|
2969
|
+
type: "button",
|
|
2970
|
+
variant: "outline",
|
|
2971
|
+
disabled: disabled || !image,
|
|
2972
|
+
onClick: onClear,
|
|
2973
|
+
children: "Unset image"
|
|
2974
|
+
})
|
|
2975
|
+
]
|
|
2976
|
+
})
|
|
2977
|
+
]
|
|
2978
|
+
});
|
|
2979
|
+
}
|
|
2980
|
+
// src/components/NumberField.tsx
|
|
2981
|
+
import { NumberField as NumberFieldPrimitive } from "@base-ui/react/number-field";
|
|
2982
|
+
import { MinusIcon, PlusIcon, MoveHorizontalIcon } from "lucide-react";
|
|
2983
|
+
import { jsx as jsx30 } from "react/jsx-runtime";
|
|
2984
|
+
function NumberField2({ density, className, ...props }) {
|
|
2985
|
+
return /* @__PURE__ */ jsx30(NumberFieldPrimitive.Root, {
|
|
2986
|
+
"data-density": density,
|
|
2987
|
+
"data-slot": "number-field",
|
|
2988
|
+
className: (state) => cn2("flex min-w-0 flex-col gap-field-gap", typeof className === "function" ? className(state) : className),
|
|
2989
|
+
...props
|
|
2990
|
+
});
|
|
2991
|
+
}
|
|
2992
|
+
function NumberFieldGroup2({
|
|
2993
|
+
density,
|
|
2994
|
+
className,
|
|
2995
|
+
...props
|
|
2996
|
+
}) {
|
|
2997
|
+
return /* @__PURE__ */ jsx30(NumberFieldPrimitive.Group, {
|
|
2998
|
+
"data-density": density,
|
|
2999
|
+
"data-slot": "number-field-group",
|
|
3000
|
+
className: (state) => cn2("flex h-control min-w-0 items-stretch rounded-sm border border-input bg-secondary text-foreground transition-colors focus-within:border-ring focus-within:ring-1 focus-within:ring-ring data-disabled:opacity-50 motion-reduce:transition-none", typeof className === "function" ? className(state) : className),
|
|
3001
|
+
...props
|
|
3002
|
+
});
|
|
3003
|
+
}
|
|
3004
|
+
function NumberFieldInput2({
|
|
3005
|
+
density,
|
|
3006
|
+
className,
|
|
3007
|
+
...props
|
|
3008
|
+
}) {
|
|
3009
|
+
return /* @__PURE__ */ jsx30(NumberFieldPrimitive.Input, {
|
|
3010
|
+
"data-density": density,
|
|
3011
|
+
"data-slot": "number-field-input",
|
|
3012
|
+
className: (state) => cn2("min-w-0 flex-1 bg-transparent px-control-x text-center text-sm tabular-nums outline-none disabled:cursor-not-allowed", typeof className === "function" ? className(state) : className),
|
|
3013
|
+
...props
|
|
3014
|
+
});
|
|
3015
|
+
}
|
|
3016
|
+
function NumberFieldDecrement2({
|
|
3017
|
+
density,
|
|
3018
|
+
className,
|
|
3019
|
+
children = /* @__PURE__ */ jsx30(MinusIcon, {}),
|
|
3020
|
+
...props
|
|
3021
|
+
}) {
|
|
3022
|
+
return /* @__PURE__ */ jsx30(NumberFieldPrimitive.Decrement, {
|
|
3023
|
+
"data-density": density,
|
|
3024
|
+
"data-slot": "number-field-decrement",
|
|
3025
|
+
className: (state) => cn2("flex w-control shrink-0 items-center justify-center rounded-s-sm outline-none hover:bg-muted focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:size-3.5", typeof className === "function" ? className(state) : className),
|
|
3026
|
+
...props,
|
|
3027
|
+
children
|
|
3028
|
+
});
|
|
3029
|
+
}
|
|
3030
|
+
function NumberFieldIncrement2({
|
|
3031
|
+
density,
|
|
3032
|
+
className,
|
|
3033
|
+
children = /* @__PURE__ */ jsx30(PlusIcon, {}),
|
|
3034
|
+
...props
|
|
3035
|
+
}) {
|
|
3036
|
+
return /* @__PURE__ */ jsx30(NumberFieldPrimitive.Increment, {
|
|
3037
|
+
"data-density": density,
|
|
3038
|
+
"data-slot": "number-field-increment",
|
|
3039
|
+
className: (state) => cn2("flex w-control shrink-0 items-center justify-center rounded-e-sm outline-none hover:bg-muted focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:size-3.5", typeof className === "function" ? className(state) : className),
|
|
3040
|
+
...props,
|
|
3041
|
+
children
|
|
3042
|
+
});
|
|
3043
|
+
}
|
|
3044
|
+
function NumberFieldScrubArea2({
|
|
3045
|
+
density,
|
|
3046
|
+
className,
|
|
3047
|
+
...props
|
|
3048
|
+
}) {
|
|
3049
|
+
return /* @__PURE__ */ jsx30(NumberFieldPrimitive.ScrubArea, {
|
|
3050
|
+
"data-density": density,
|
|
3051
|
+
"data-slot": "number-field-scrub-area",
|
|
3052
|
+
className: (state) => cn2("flex w-fit cursor-ew-resize items-center gap-control-gap text-sm font-medium", typeof className === "function" ? className(state) : className),
|
|
3053
|
+
...props
|
|
3054
|
+
});
|
|
3055
|
+
}
|
|
3056
|
+
function NumberFieldScrubAreaCursor2({
|
|
3057
|
+
density,
|
|
3058
|
+
className,
|
|
3059
|
+
children = /* @__PURE__ */ jsx30(MoveHorizontalIcon, {}),
|
|
3060
|
+
...props
|
|
3061
|
+
}) {
|
|
3062
|
+
const resolvedDensity = useDensity(density);
|
|
3063
|
+
return /* @__PURE__ */ jsx30(NumberFieldPrimitive.ScrubAreaCursor, {
|
|
3064
|
+
"data-density": resolvedDensity,
|
|
3065
|
+
"data-slot": "number-field-scrub-area-cursor",
|
|
3066
|
+
className: (state) => cn2("z-50 font-sans text-sm text-foreground [&_svg]:size-5", typeof className === "function" ? className(state) : className),
|
|
3067
|
+
...props,
|
|
3068
|
+
children
|
|
3069
|
+
});
|
|
3070
|
+
}
|
|
3071
|
+
// src/components/Meter.tsx
|
|
3072
|
+
import { Meter as MeterPrimitive } from "@base-ui/react/meter";
|
|
3073
|
+
import { jsx as jsx31 } from "react/jsx-runtime";
|
|
3074
|
+
function Meter2({ density, className, ...props }) {
|
|
3075
|
+
return /* @__PURE__ */ jsx31(MeterPrimitive.Root, {
|
|
3076
|
+
"data-density": density,
|
|
3077
|
+
"data-slot": "meter",
|
|
3078
|
+
className: (state) => cn2("flex min-w-0 flex-wrap items-center gap-field-gap", typeof className === "function" ? className(state) : className),
|
|
3079
|
+
...props
|
|
3080
|
+
});
|
|
3081
|
+
}
|
|
3082
|
+
function MeterLabel2({ density, className, ...props }) {
|
|
3083
|
+
return /* @__PURE__ */ jsx31(MeterPrimitive.Label, {
|
|
3084
|
+
"data-density": density,
|
|
3085
|
+
"data-slot": "meter-label",
|
|
3086
|
+
className: (state) => cn2("text-sm font-medium", typeof className === "function" ? className(state) : className),
|
|
3087
|
+
...props
|
|
3088
|
+
});
|
|
3089
|
+
}
|
|
3090
|
+
function MeterValue2({ density, className, ...props }) {
|
|
3091
|
+
return /* @__PURE__ */ jsx31(MeterPrimitive.Value, {
|
|
3092
|
+
"data-density": density,
|
|
3093
|
+
"data-slot": "meter-value",
|
|
3094
|
+
className: (state) => cn2("ms-auto text-sm text-muted-foreground tabular-nums", typeof className === "function" ? className(state) : className),
|
|
3095
|
+
...props
|
|
3096
|
+
});
|
|
3097
|
+
}
|
|
3098
|
+
function MeterTrack2({ density, className, ...props }) {
|
|
3099
|
+
return /* @__PURE__ */ jsx31(MeterPrimitive.Track, {
|
|
3100
|
+
"data-density": density,
|
|
3101
|
+
"data-slot": "meter-track",
|
|
3102
|
+
className: (state) => cn2("h-1 w-full overflow-hidden rounded-sm bg-muted", typeof className === "function" ? className(state) : className),
|
|
3103
|
+
...props
|
|
3104
|
+
});
|
|
3105
|
+
}
|
|
3106
|
+
function MeterIndicator2({
|
|
3107
|
+
density,
|
|
3108
|
+
className,
|
|
3109
|
+
...props
|
|
3110
|
+
}) {
|
|
3111
|
+
return /* @__PURE__ */ jsx31(MeterPrimitive.Indicator, {
|
|
3112
|
+
"data-density": density,
|
|
3113
|
+
"data-slot": "meter-indicator",
|
|
3114
|
+
className: (state) => cn2("h-full bg-primary transition-[width] motion-reduce:transition-none", typeof className === "function" ? className(state) : className),
|
|
3115
|
+
...props
|
|
3116
|
+
});
|
|
3117
|
+
}
|
|
3118
|
+
// src/components/Stepper.tsx
|
|
3119
|
+
import { Tabs as TabsPrimitive } from "@base-ui/react/tabs";
|
|
3120
|
+
import { CheckIcon as CheckIcon5 } from "lucide-react";
|
|
3121
|
+
import { jsx as jsx32 } from "react/jsx-runtime";
|
|
3122
|
+
function Stepper2({ density, className, ...props }) {
|
|
3123
|
+
return /* @__PURE__ */ jsx32(TabsPrimitive.Root, {
|
|
3124
|
+
"data-density": density,
|
|
3125
|
+
"data-slot": "stepper",
|
|
3126
|
+
className: (state) => cn2("group/stepper flex min-w-0 flex-col gap-panel data-[orientation=vertical]:flex-row", typeof className === "function" ? className(state) : className),
|
|
3127
|
+
...props
|
|
3128
|
+
});
|
|
3129
|
+
}
|
|
3130
|
+
function StepperList2({
|
|
3131
|
+
density,
|
|
3132
|
+
className,
|
|
3133
|
+
activateOnFocus = false,
|
|
3134
|
+
...props
|
|
3135
|
+
}) {
|
|
3136
|
+
return /* @__PURE__ */ jsx32(TabsPrimitive.List, {
|
|
3137
|
+
"data-density": density,
|
|
3138
|
+
"data-slot": "stepper-list",
|
|
3139
|
+
activateOnFocus,
|
|
3140
|
+
className: (state) => cn2("flex min-w-0 gap-panel group-data-[orientation=vertical]/stepper:flex-col", typeof className === "function" ? className(state) : className),
|
|
3141
|
+
...props
|
|
3142
|
+
});
|
|
3143
|
+
}
|
|
3144
|
+
function StepperTrigger2({ density, className, ...props }) {
|
|
3145
|
+
return /* @__PURE__ */ jsx32(TabsPrimitive.Tab, {
|
|
3146
|
+
"data-density": density,
|
|
3147
|
+
"data-slot": "stepper-trigger",
|
|
3148
|
+
className: (state) => cn2("group/step flex min-h-control items-center gap-control-gap rounded-sm text-sm text-muted-foreground outline-none focus-visible:ring-1 focus-visible:ring-ring data-active:text-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:opacity-50", typeof className === "function" ? className(state) : className),
|
|
3149
|
+
...props
|
|
3150
|
+
});
|
|
3151
|
+
}
|
|
3152
|
+
function StepperIndicator2({ completed = false, children, className, ...props }) {
|
|
3153
|
+
return /* @__PURE__ */ jsx32("span", {
|
|
3154
|
+
"aria-hidden": "true",
|
|
3155
|
+
"data-slot": "stepper-indicator",
|
|
3156
|
+
"data-completed": completed || undefined,
|
|
3157
|
+
className: cn2("flex size-control shrink-0 items-center justify-center rounded-sm border border-input bg-secondary text-sm tabular-nums group-data-active/step:border-primary group-data-active/step:bg-primary group-data-active/step:text-primary-foreground data-completed:border-primary data-completed:text-primary [&_svg]:size-3.5", className),
|
|
3158
|
+
...props,
|
|
3159
|
+
children: completed ? /* @__PURE__ */ jsx32(CheckIcon5, {}) : children
|
|
3160
|
+
});
|
|
3161
|
+
}
|
|
3162
|
+
function StepperContent2({ density, className, ...props }) {
|
|
3163
|
+
return /* @__PURE__ */ jsx32(TabsPrimitive.Panel, {
|
|
3164
|
+
"data-density": density,
|
|
3165
|
+
"data-slot": "stepper-content",
|
|
3166
|
+
className: (state) => cn2("min-w-0 flex-1 outline-none focus-visible:ring-1 focus-visible:ring-ring", typeof className === "function" ? className(state) : className),
|
|
3167
|
+
...props
|
|
3168
|
+
});
|
|
3169
|
+
}
|
|
3170
|
+
// src/components/AppShell.tsx
|
|
3171
|
+
import { jsx as jsx33, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
3172
|
+
function AppShell2({
|
|
3173
|
+
navigation,
|
|
3174
|
+
brand,
|
|
3175
|
+
children,
|
|
3176
|
+
header,
|
|
3177
|
+
sidebarFooter,
|
|
3178
|
+
footer,
|
|
3179
|
+
height = "100dvh",
|
|
3180
|
+
defaultSidebarOpen = true,
|
|
3181
|
+
label = "Application",
|
|
3182
|
+
density
|
|
3183
|
+
}) {
|
|
3184
|
+
return /* @__PURE__ */ jsxs19(SidebarProvider2, {
|
|
3185
|
+
density,
|
|
3186
|
+
defaultOpen: defaultSidebarOpen,
|
|
3187
|
+
className: "relative min-h-0",
|
|
3188
|
+
style: { height },
|
|
3189
|
+
"data-scroll": "none",
|
|
3190
|
+
children: [
|
|
3191
|
+
/* @__PURE__ */ jsxs19(Sidebar2, {
|
|
3192
|
+
collapsible: "icon",
|
|
3193
|
+
position: "container",
|
|
3194
|
+
children: [
|
|
3195
|
+
/* @__PURE__ */ jsx33(SidebarHeader2, {
|
|
3196
|
+
children: brand
|
|
3197
|
+
}),
|
|
3198
|
+
/* @__PURE__ */ jsx33(SidebarContent2, {
|
|
3199
|
+
children: /* @__PURE__ */ jsx33("nav", {
|
|
3200
|
+
"aria-label": "Primary navigation",
|
|
3201
|
+
children: /* @__PURE__ */ jsx33(SidebarGroup2, {
|
|
3202
|
+
children: /* @__PURE__ */ jsx33(SidebarMenu2, {
|
|
3203
|
+
children: navigation.map((item) => /* @__PURE__ */ jsx33(SidebarMenuItem2, {
|
|
3204
|
+
children: /* @__PURE__ */ jsxs19(SidebarMenuButton2, {
|
|
3205
|
+
render: /* @__PURE__ */ jsx33("a", {
|
|
3206
|
+
href: item.href,
|
|
3207
|
+
"aria-current": item.active ? "page" : undefined
|
|
3208
|
+
}),
|
|
3209
|
+
isActive: item.active,
|
|
3210
|
+
tooltip: item.label,
|
|
3211
|
+
children: [
|
|
3212
|
+
item.icon,
|
|
3213
|
+
/* @__PURE__ */ jsx33("span", {
|
|
3214
|
+
children: item.label
|
|
3215
|
+
})
|
|
3216
|
+
]
|
|
3217
|
+
})
|
|
3218
|
+
}, item.id))
|
|
3219
|
+
})
|
|
3220
|
+
})
|
|
3221
|
+
})
|
|
3222
|
+
}),
|
|
3223
|
+
sidebarFooter && /* @__PURE__ */ jsx33(SidebarFooter2, {
|
|
3224
|
+
children: sidebarFooter
|
|
3225
|
+
})
|
|
3226
|
+
]
|
|
3227
|
+
}),
|
|
3228
|
+
/* @__PURE__ */ jsxs19(SidebarInset2, {
|
|
3229
|
+
"aria-label": label,
|
|
3230
|
+
className: "min-h-0 min-w-0",
|
|
3231
|
+
"data-scroll": "none",
|
|
3232
|
+
children: [
|
|
3233
|
+
/* @__PURE__ */ jsxs19("header", {
|
|
3234
|
+
"data-scroll": "none",
|
|
3235
|
+
className: "flex shrink-0 items-center gap-control-gap border-b border-border p-panel",
|
|
3236
|
+
children: [
|
|
3237
|
+
/* @__PURE__ */ jsx33(SidebarTrigger2, {}),
|
|
3238
|
+
/* @__PURE__ */ jsx33(Separator2, {
|
|
3239
|
+
orientation: "vertical",
|
|
3240
|
+
className: "h-control"
|
|
3241
|
+
}),
|
|
3242
|
+
header
|
|
3243
|
+
]
|
|
3244
|
+
}),
|
|
3245
|
+
/* @__PURE__ */ jsx33(ScrollArea2, {
|
|
3246
|
+
className: "min-h-0 flex-1",
|
|
3247
|
+
children: /* @__PURE__ */ jsx33("div", {
|
|
3248
|
+
className: "flex min-w-0 flex-col gap-panel p-panel",
|
|
3249
|
+
children
|
|
3250
|
+
})
|
|
3251
|
+
}),
|
|
3252
|
+
footer && /* @__PURE__ */ jsx33("footer", {
|
|
3253
|
+
className: "shrink-0 border-t border-border p-panel",
|
|
3254
|
+
"data-scroll": "none",
|
|
3255
|
+
children: footer
|
|
3256
|
+
})
|
|
3257
|
+
]
|
|
3258
|
+
})
|
|
3259
|
+
]
|
|
3260
|
+
});
|
|
3261
|
+
}
|
|
3262
|
+
// src/components/PageHeader.tsx
|
|
3263
|
+
import { jsx as jsx34, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
3264
|
+
function PageHeader2({ title, description, breadcrumbs, actions, density }) {
|
|
3265
|
+
return /* @__PURE__ */ jsxs20("header", {
|
|
3266
|
+
"data-density": density,
|
|
3267
|
+
"data-slot": "page-header",
|
|
3268
|
+
"data-scroll": "none",
|
|
3269
|
+
className: "flex min-w-0 flex-col gap-field-gap",
|
|
3270
|
+
children: [
|
|
3271
|
+
breadcrumbs,
|
|
3272
|
+
/* @__PURE__ */ jsxs20("div", {
|
|
3273
|
+
className: "flex min-w-0 flex-wrap items-start justify-between gap-panel",
|
|
3274
|
+
children: [
|
|
3275
|
+
/* @__PURE__ */ jsxs20("div", {
|
|
3276
|
+
className: "min-w-0",
|
|
3277
|
+
children: [
|
|
3278
|
+
/* @__PURE__ */ jsx34("h1", {
|
|
3279
|
+
className: "text-xl font-semibold text-foreground",
|
|
3280
|
+
children: title
|
|
3281
|
+
}),
|
|
3282
|
+
description && /* @__PURE__ */ jsx34("div", {
|
|
3283
|
+
className: "mt-1 text-sm text-muted-foreground",
|
|
3284
|
+
children: description
|
|
3285
|
+
})
|
|
3286
|
+
]
|
|
3287
|
+
}),
|
|
3288
|
+
actions && /* @__PURE__ */ jsx34("div", {
|
|
3289
|
+
className: "flex shrink-0 flex-wrap items-center gap-control-gap",
|
|
3290
|
+
children: actions
|
|
3291
|
+
})
|
|
3292
|
+
]
|
|
3293
|
+
})
|
|
3294
|
+
]
|
|
3295
|
+
});
|
|
3296
|
+
}
|
|
3297
|
+
// src/components/WorkspaceSwitcher.tsx
|
|
3298
|
+
import { jsx as jsx35, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
3299
|
+
function WorkspaceSwitcher2({
|
|
3300
|
+
workspaces,
|
|
3301
|
+
value,
|
|
3302
|
+
defaultValue,
|
|
3303
|
+
onValueChange,
|
|
3304
|
+
disabled,
|
|
3305
|
+
label = "Workspace",
|
|
3306
|
+
density
|
|
3307
|
+
}) {
|
|
3308
|
+
return /* @__PURE__ */ jsxs21(Select2, {
|
|
3309
|
+
items: workspaces,
|
|
3310
|
+
value,
|
|
3311
|
+
defaultValue: defaultValue ?? workspaces[0]?.value,
|
|
3312
|
+
onValueChange: (next) => {
|
|
3313
|
+
if (next !== null)
|
|
3314
|
+
onValueChange?.(next);
|
|
3315
|
+
},
|
|
3316
|
+
disabled,
|
|
3317
|
+
children: [
|
|
3318
|
+
/* @__PURE__ */ jsx35(SelectTrigger2, {
|
|
3319
|
+
"aria-label": label,
|
|
3320
|
+
density,
|
|
3321
|
+
children: /* @__PURE__ */ jsx35(SelectValue2, {})
|
|
3322
|
+
}),
|
|
3323
|
+
/* @__PURE__ */ jsx35(SelectContent2, {
|
|
3324
|
+
density,
|
|
3325
|
+
children: /* @__PURE__ */ jsx35(SelectGroup2, {
|
|
3326
|
+
children: workspaces.map((workspace) => /* @__PURE__ */ jsx35(SelectItem2, {
|
|
3327
|
+
value: workspace.value,
|
|
3328
|
+
children: workspace.label
|
|
3329
|
+
}, workspace.value))
|
|
3330
|
+
})
|
|
3331
|
+
})
|
|
3332
|
+
]
|
|
3333
|
+
});
|
|
3334
|
+
}
|
|
3335
|
+
// src/components/AccountMenu.tsx
|
|
3336
|
+
import { jsx as jsx36, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
3337
|
+
function AccountMenu2({ name, email, image, onAction, density }) {
|
|
3338
|
+
return /* @__PURE__ */ jsxs22(DropdownMenu2, {
|
|
3339
|
+
children: [
|
|
3340
|
+
/* @__PURE__ */ jsxs22(DropdownMenuTrigger2, {
|
|
3341
|
+
render: /* @__PURE__ */ jsx36(Button2, {
|
|
3342
|
+
variant: "ghost",
|
|
3343
|
+
density
|
|
3344
|
+
}),
|
|
3345
|
+
"aria-label": `Account menu for ${name}`,
|
|
3346
|
+
children: [
|
|
3347
|
+
/* @__PURE__ */ jsxs22(Avatar2, {
|
|
3348
|
+
className: "size-control",
|
|
3349
|
+
children: [
|
|
3350
|
+
/* @__PURE__ */ jsx36(AvatarImage2, {
|
|
3351
|
+
src: image,
|
|
3352
|
+
alt: ""
|
|
3353
|
+
}),
|
|
3354
|
+
/* @__PURE__ */ jsx36(AvatarFallback2, {
|
|
3355
|
+
children: name.slice(0, 2).toUpperCase()
|
|
3356
|
+
})
|
|
3357
|
+
]
|
|
3358
|
+
}),
|
|
3359
|
+
/* @__PURE__ */ jsx36("span", {
|
|
3360
|
+
children: name
|
|
3361
|
+
})
|
|
3362
|
+
]
|
|
3363
|
+
}),
|
|
3364
|
+
/* @__PURE__ */ jsx36(DropdownMenuContent2, {
|
|
3365
|
+
density,
|
|
3366
|
+
align: "end",
|
|
3367
|
+
children: /* @__PURE__ */ jsxs22(DropdownMenuGroup2, {
|
|
3368
|
+
children: [
|
|
3369
|
+
/* @__PURE__ */ jsx36(DropdownMenuLabel2, {
|
|
3370
|
+
children: email ?? name
|
|
3371
|
+
}),
|
|
3372
|
+
/* @__PURE__ */ jsx36(DropdownMenuItem2, {
|
|
3373
|
+
onClick: () => onAction("profile"),
|
|
3374
|
+
children: "Profile"
|
|
3375
|
+
}),
|
|
3376
|
+
/* @__PURE__ */ jsx36(DropdownMenuItem2, {
|
|
3377
|
+
onClick: () => onAction("settings"),
|
|
3378
|
+
children: "Settings"
|
|
3379
|
+
}),
|
|
3380
|
+
/* @__PURE__ */ jsx36(DropdownMenuSeparator2, {}),
|
|
3381
|
+
/* @__PURE__ */ jsx36(DropdownMenuItem2, {
|
|
3382
|
+
onClick: () => onAction("sign-out"),
|
|
3383
|
+
children: "Sign out"
|
|
3384
|
+
})
|
|
3385
|
+
]
|
|
3386
|
+
})
|
|
3387
|
+
})
|
|
3388
|
+
]
|
|
3389
|
+
});
|
|
3390
|
+
}
|
|
3391
|
+
// src/components/StatCard.tsx
|
|
3392
|
+
import { jsx as jsx37, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
3393
|
+
function StatCard2({
|
|
3394
|
+
label,
|
|
3395
|
+
value,
|
|
3396
|
+
change,
|
|
3397
|
+
changeIntent = "neutral",
|
|
3398
|
+
description,
|
|
3399
|
+
children,
|
|
3400
|
+
loading = false,
|
|
3401
|
+
density
|
|
3402
|
+
}) {
|
|
3403
|
+
return /* @__PURE__ */ jsxs23(Card2, {
|
|
3404
|
+
density,
|
|
3405
|
+
"aria-label": label,
|
|
3406
|
+
"aria-busy": loading,
|
|
3407
|
+
children: [
|
|
3408
|
+
/* @__PURE__ */ jsxs23(CardHeader2, {
|
|
3409
|
+
children: [
|
|
3410
|
+
/* @__PURE__ */ jsx37(CardTitle2, {
|
|
3411
|
+
children: label
|
|
3412
|
+
}),
|
|
3413
|
+
description && /* @__PURE__ */ jsx37(CardDescription2, {
|
|
3414
|
+
children: description
|
|
3415
|
+
})
|
|
3416
|
+
]
|
|
3417
|
+
}),
|
|
3418
|
+
/* @__PURE__ */ jsx37(CardContent2, {
|
|
3419
|
+
children: /* @__PURE__ */ jsxs23("div", {
|
|
3420
|
+
className: "flex flex-wrap items-center justify-between gap-control-gap",
|
|
3421
|
+
children: [
|
|
3422
|
+
loading ? /* @__PURE__ */ jsx37(Skeleton2, {
|
|
3423
|
+
className: "h-8 w-24",
|
|
3424
|
+
"aria-label": `Loading ${label}`
|
|
3425
|
+
}) : /* @__PURE__ */ jsx37("div", {
|
|
3426
|
+
className: "text-2xl font-semibold tabular-nums",
|
|
3427
|
+
children: value
|
|
3428
|
+
}),
|
|
3429
|
+
change && /* @__PURE__ */ jsx37(Badge2, {
|
|
3430
|
+
variant: changeIntent === "positive" ? "success" : changeIntent === "negative" ? "destructive" : "secondary",
|
|
3431
|
+
children: change
|
|
3432
|
+
})
|
|
3433
|
+
]
|
|
3434
|
+
})
|
|
3435
|
+
}),
|
|
3436
|
+
children && /* @__PURE__ */ jsx37(CardFooter2, {
|
|
3437
|
+
children
|
|
3438
|
+
})
|
|
3439
|
+
]
|
|
3440
|
+
});
|
|
3441
|
+
}
|
|
3442
|
+
// src/components/AuthForm.tsx
|
|
3443
|
+
import { useId as useId2, useState as useState5 } from "react";
|
|
3444
|
+
import { jsx as jsx38, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
3445
|
+
function AuthForm2({
|
|
3446
|
+
mode = "sign-in",
|
|
3447
|
+
onSubmit,
|
|
3448
|
+
footer,
|
|
3449
|
+
alternativeActions,
|
|
3450
|
+
disabled = false,
|
|
3451
|
+
density
|
|
3452
|
+
}) {
|
|
3453
|
+
const id = useId2();
|
|
3454
|
+
const [pending, setPending] = useState5(false);
|
|
3455
|
+
const [error, setError] = useState5("");
|
|
3456
|
+
const title = mode === "sign-up" ? "Create an account" : mode === "reset-password" ? "Reset your password" : "Sign in";
|
|
3457
|
+
async function submit(event) {
|
|
3458
|
+
event.preventDefault();
|
|
3459
|
+
const data = new FormData(event.currentTarget);
|
|
3460
|
+
setError("");
|
|
3461
|
+
setPending(true);
|
|
3462
|
+
try {
|
|
3463
|
+
await onSubmit({
|
|
3464
|
+
email: String(data.get("email") ?? ""),
|
|
3465
|
+
password: String(data.get("password") ?? ""),
|
|
3466
|
+
name: String(data.get("name") ?? "")
|
|
3467
|
+
});
|
|
3468
|
+
} catch (error) {
|
|
3469
|
+
setError(error instanceof Error ? error.message : "Unable to submit. Please try again.");
|
|
3470
|
+
} finally {
|
|
3471
|
+
setPending(false);
|
|
3472
|
+
}
|
|
3473
|
+
}
|
|
3474
|
+
return /* @__PURE__ */ jsxs24(Card2, {
|
|
3475
|
+
density,
|
|
3476
|
+
children: [
|
|
3477
|
+
/* @__PURE__ */ jsxs24(CardHeader2, {
|
|
3478
|
+
children: [
|
|
3479
|
+
/* @__PURE__ */ jsx38(CardTitle2, {
|
|
3480
|
+
children: title
|
|
3481
|
+
}),
|
|
3482
|
+
/* @__PURE__ */ jsx38(CardDescription2, {
|
|
3483
|
+
children: mode === "reset-password" ? "Enter your email to request a password reset." : "Enter your details to continue."
|
|
3484
|
+
})
|
|
3485
|
+
]
|
|
3486
|
+
}),
|
|
3487
|
+
/* @__PURE__ */ jsx38(CardContent2, {
|
|
3488
|
+
children: /* @__PURE__ */ jsx38("form", {
|
|
3489
|
+
onSubmit: submit,
|
|
3490
|
+
"aria-label": title,
|
|
3491
|
+
"aria-busy": pending,
|
|
3492
|
+
children: /* @__PURE__ */ jsxs24(FieldGroup2, {
|
|
3493
|
+
children: [
|
|
3494
|
+
mode === "sign-up" && /* @__PURE__ */ jsxs24(Field2, {
|
|
3495
|
+
children: [
|
|
3496
|
+
/* @__PURE__ */ jsx38(FieldLabel2, {
|
|
3497
|
+
htmlFor: id + "-name",
|
|
3498
|
+
children: "Name"
|
|
3499
|
+
}),
|
|
3500
|
+
/* @__PURE__ */ jsx38(Input2, {
|
|
3501
|
+
id: id + "-name",
|
|
3502
|
+
name: "name",
|
|
3503
|
+
autoComplete: "name",
|
|
3504
|
+
required: true,
|
|
3505
|
+
disabled: disabled || pending
|
|
3506
|
+
})
|
|
3507
|
+
]
|
|
3508
|
+
}),
|
|
3509
|
+
/* @__PURE__ */ jsxs24(Field2, {
|
|
3510
|
+
children: [
|
|
3511
|
+
/* @__PURE__ */ jsx38(FieldLabel2, {
|
|
3512
|
+
htmlFor: id + "-email",
|
|
3513
|
+
children: "Email"
|
|
3514
|
+
}),
|
|
3515
|
+
/* @__PURE__ */ jsx38(Input2, {
|
|
3516
|
+
id: id + "-email",
|
|
3517
|
+
name: "email",
|
|
3518
|
+
type: "email",
|
|
3519
|
+
autoComplete: "email",
|
|
3520
|
+
required: true,
|
|
3521
|
+
disabled: disabled || pending
|
|
3522
|
+
})
|
|
3523
|
+
]
|
|
3524
|
+
}),
|
|
3525
|
+
mode !== "reset-password" && /* @__PURE__ */ jsxs24(Field2, {
|
|
3526
|
+
children: [
|
|
3527
|
+
/* @__PURE__ */ jsx38(FieldLabel2, {
|
|
3528
|
+
htmlFor: id + "-password",
|
|
3529
|
+
children: "Password"
|
|
3530
|
+
}),
|
|
3531
|
+
/* @__PURE__ */ jsx38(Input2, {
|
|
3532
|
+
id: id + "-password",
|
|
3533
|
+
name: "password",
|
|
3534
|
+
type: "password",
|
|
3535
|
+
autoComplete: mode === "sign-up" ? "new-password" : "current-password",
|
|
3536
|
+
minLength: mode === "sign-up" ? 8 : undefined,
|
|
3537
|
+
required: true,
|
|
3538
|
+
disabled: disabled || pending
|
|
3539
|
+
}),
|
|
3540
|
+
mode === "sign-up" && /* @__PURE__ */ jsx38(FieldDescription2, {
|
|
3541
|
+
children: "Use at least eight characters."
|
|
3542
|
+
})
|
|
3543
|
+
]
|
|
3544
|
+
}),
|
|
3545
|
+
error && /* @__PURE__ */ jsxs24(Alert2, {
|
|
3546
|
+
variant: "destructive",
|
|
3547
|
+
children: [
|
|
3548
|
+
/* @__PURE__ */ jsx38(AlertTitle2, {
|
|
3549
|
+
children: "Request failed"
|
|
3550
|
+
}),
|
|
3551
|
+
/* @__PURE__ */ jsx38(AlertDescription2, {
|
|
3552
|
+
children: error
|
|
3553
|
+
})
|
|
3554
|
+
]
|
|
3555
|
+
}),
|
|
3556
|
+
/* @__PURE__ */ jsxs24(Button2, {
|
|
3557
|
+
type: "submit",
|
|
3558
|
+
disabled: disabled || pending,
|
|
3559
|
+
children: [
|
|
3560
|
+
pending && /* @__PURE__ */ jsx38(Spinner2, {
|
|
3561
|
+
"data-icon": "inline-start"
|
|
3562
|
+
}),
|
|
3563
|
+
mode === "reset-password" ? "Send reset link" : title
|
|
3564
|
+
]
|
|
3565
|
+
}),
|
|
3566
|
+
alternativeActions
|
|
3567
|
+
]
|
|
3568
|
+
})
|
|
3569
|
+
})
|
|
3570
|
+
}),
|
|
3571
|
+
footer && /* @__PURE__ */ jsx38(CardFooter2, {
|
|
3572
|
+
children: footer
|
|
3573
|
+
})
|
|
3574
|
+
]
|
|
3575
|
+
});
|
|
3576
|
+
}
|
|
3577
|
+
// src/components/SettingsSection.tsx
|
|
3578
|
+
import { jsx as jsx39, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
3579
|
+
function SettingsSection2({
|
|
3580
|
+
title,
|
|
3581
|
+
description,
|
|
3582
|
+
children,
|
|
3583
|
+
onSubmit,
|
|
3584
|
+
saveLabel = "Save changes",
|
|
3585
|
+
pending = false,
|
|
3586
|
+
disabled = false,
|
|
3587
|
+
footer,
|
|
3588
|
+
destructive = false,
|
|
3589
|
+
density
|
|
3590
|
+
}) {
|
|
3591
|
+
return /* @__PURE__ */ jsx39("form", {
|
|
3592
|
+
"aria-label": title,
|
|
3593
|
+
onSubmit,
|
|
3594
|
+
"aria-busy": pending,
|
|
3595
|
+
children: /* @__PURE__ */ jsxs25(Card2, {
|
|
3596
|
+
density,
|
|
3597
|
+
children: [
|
|
3598
|
+
/* @__PURE__ */ jsxs25(CardHeader2, {
|
|
3599
|
+
children: [
|
|
3600
|
+
/* @__PURE__ */ jsx39(CardTitle2, {
|
|
3601
|
+
children: title
|
|
3602
|
+
}),
|
|
3603
|
+
description && /* @__PURE__ */ jsx39(CardDescription2, {
|
|
3604
|
+
children: description
|
|
3605
|
+
})
|
|
3606
|
+
]
|
|
3607
|
+
}),
|
|
3608
|
+
/* @__PURE__ */ jsx39(CardContent2, {
|
|
3609
|
+
children: /* @__PURE__ */ jsxs25("fieldset", {
|
|
3610
|
+
disabled: disabled || pending,
|
|
3611
|
+
className: "min-w-0 border-0 p-0",
|
|
3612
|
+
children: [
|
|
3613
|
+
/* @__PURE__ */ jsx39("legend", {
|
|
3614
|
+
className: "sr-only",
|
|
3615
|
+
children: title
|
|
3616
|
+
}),
|
|
3617
|
+
/* @__PURE__ */ jsx39(FieldGroup2, {
|
|
3618
|
+
children
|
|
3619
|
+
})
|
|
3620
|
+
]
|
|
3621
|
+
})
|
|
3622
|
+
}),
|
|
3623
|
+
/* @__PURE__ */ jsxs25(CardFooter2, {
|
|
3624
|
+
className: "flex flex-wrap items-center justify-between gap-control-gap",
|
|
3625
|
+
children: [
|
|
3626
|
+
footer,
|
|
3627
|
+
/* @__PURE__ */ jsxs25(Button2, {
|
|
3628
|
+
type: "submit",
|
|
3629
|
+
variant: destructive ? "destructive" : "default",
|
|
3630
|
+
disabled: disabled || pending,
|
|
3631
|
+
children: [
|
|
3632
|
+
pending && /* @__PURE__ */ jsx39(Spinner2, {
|
|
3633
|
+
"data-icon": "inline-start"
|
|
3634
|
+
}),
|
|
3635
|
+
saveLabel
|
|
3636
|
+
]
|
|
3637
|
+
})
|
|
3638
|
+
]
|
|
3639
|
+
})
|
|
3640
|
+
]
|
|
3641
|
+
})
|
|
3642
|
+
});
|
|
3643
|
+
}
|
|
3644
|
+
// src/components/TagInput.tsx
|
|
3645
|
+
import { jsx as jsx40, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
3646
|
+
function TagInput2({
|
|
3647
|
+
label,
|
|
3648
|
+
options,
|
|
3649
|
+
value,
|
|
3650
|
+
defaultValue,
|
|
3651
|
+
onValueChange,
|
|
3652
|
+
disabled,
|
|
3653
|
+
name,
|
|
3654
|
+
placeholder = "Add tags",
|
|
3655
|
+
density
|
|
3656
|
+
}) {
|
|
3657
|
+
const anchor = useComboboxAnchor2();
|
|
3658
|
+
return /* @__PURE__ */ jsxs26(Combobox2, {
|
|
3659
|
+
items: options,
|
|
3660
|
+
multiple: true,
|
|
3661
|
+
value,
|
|
3662
|
+
defaultValue,
|
|
3663
|
+
onValueChange,
|
|
3664
|
+
disabled,
|
|
3665
|
+
name,
|
|
3666
|
+
children: [
|
|
3667
|
+
/* @__PURE__ */ jsxs26(ComboboxChips2, {
|
|
3668
|
+
ref: anchor,
|
|
3669
|
+
density,
|
|
3670
|
+
children: [
|
|
3671
|
+
/* @__PURE__ */ jsx40(ComboboxValue2, {
|
|
3672
|
+
children: (values) => values.map((item) => /* @__PURE__ */ jsx40(ComboboxChip2, {
|
|
3673
|
+
removeLabel: `Remove ${item}`,
|
|
3674
|
+
children: item
|
|
3675
|
+
}, item))
|
|
3676
|
+
}),
|
|
3677
|
+
/* @__PURE__ */ jsx40(ComboboxChipsInput2, {
|
|
3678
|
+
"aria-label": label,
|
|
3679
|
+
placeholder
|
|
3680
|
+
})
|
|
3681
|
+
]
|
|
3682
|
+
}),
|
|
3683
|
+
/* @__PURE__ */ jsxs26(ComboboxContent2, {
|
|
3684
|
+
anchor,
|
|
3685
|
+
density,
|
|
3686
|
+
children: [
|
|
3687
|
+
/* @__PURE__ */ jsx40(ComboboxEmpty2, {
|
|
3688
|
+
children: "No matching tags."
|
|
3689
|
+
}),
|
|
3690
|
+
/* @__PURE__ */ jsx40(ComboboxList2, {
|
|
3691
|
+
children: /* @__PURE__ */ jsx40(ComboboxGroup2, {
|
|
3692
|
+
children: /* @__PURE__ */ jsx40(ComboboxCollection2, {
|
|
3693
|
+
children: (item) => /* @__PURE__ */ jsx40(ComboboxItem2, {
|
|
3694
|
+
value: item,
|
|
3695
|
+
children: item
|
|
3696
|
+
}, item)
|
|
3697
|
+
})
|
|
3698
|
+
})
|
|
3699
|
+
})
|
|
3700
|
+
]
|
|
3701
|
+
})
|
|
3702
|
+
]
|
|
3703
|
+
});
|
|
3704
|
+
}
|
|
3705
|
+
// src/components/FilterBar.tsx
|
|
3706
|
+
import { jsx as jsx41, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
3707
|
+
function FilterBar2({
|
|
3708
|
+
label,
|
|
3709
|
+
search,
|
|
3710
|
+
onSearchChange,
|
|
3711
|
+
filters,
|
|
3712
|
+
value,
|
|
3713
|
+
onValueChange,
|
|
3714
|
+
disabled,
|
|
3715
|
+
density
|
|
3716
|
+
}) {
|
|
3717
|
+
return /* @__PURE__ */ jsxs27("fieldset", {
|
|
3718
|
+
"aria-label": label,
|
|
3719
|
+
disabled,
|
|
3720
|
+
"data-density": density,
|
|
3721
|
+
className: "flex min-w-0 flex-wrap items-center gap-2",
|
|
3722
|
+
children: [
|
|
3723
|
+
/* @__PURE__ */ jsx41(Input2, {
|
|
3724
|
+
"aria-label": `Search ${label}`,
|
|
3725
|
+
type: "search",
|
|
3726
|
+
value: search,
|
|
3727
|
+
onChange: (event) => onSearchChange(event.target.value),
|
|
3728
|
+
className: "min-w-40 flex-1"
|
|
3729
|
+
}),
|
|
3730
|
+
filters.map((filter) => /* @__PURE__ */ jsxs27(NativeSelect2, {
|
|
3731
|
+
"aria-label": filter.label,
|
|
3732
|
+
value: value[filter.id] ?? "",
|
|
3733
|
+
onChange: (event) => onValueChange({ ...value, [filter.id]: event.target.value }),
|
|
3734
|
+
children: [
|
|
3735
|
+
/* @__PURE__ */ jsxs27(NativeSelectOption2, {
|
|
3736
|
+
value: "",
|
|
3737
|
+
children: [
|
|
3738
|
+
"All ",
|
|
3739
|
+
filter.label.toLowerCase()
|
|
3740
|
+
]
|
|
3741
|
+
}),
|
|
3742
|
+
filter.options.map((option) => /* @__PURE__ */ jsx41(NativeSelectOption2, {
|
|
3743
|
+
value: option.value,
|
|
3744
|
+
children: option.label
|
|
3745
|
+
}, option.value))
|
|
3746
|
+
]
|
|
3747
|
+
}, filter.id)),
|
|
3748
|
+
/* @__PURE__ */ jsx41(Button2, {
|
|
3749
|
+
type: "button",
|
|
3750
|
+
variant: "ghost",
|
|
3751
|
+
disabled: !search && !Object.values(value).some(Boolean),
|
|
3752
|
+
onClick: () => {
|
|
3753
|
+
onSearchChange("");
|
|
3754
|
+
onValueChange({});
|
|
3755
|
+
},
|
|
3756
|
+
children: "Clear filters"
|
|
3757
|
+
})
|
|
3758
|
+
]
|
|
3759
|
+
});
|
|
3760
|
+
}
|
|
3761
|
+
// src/components/BarList.tsx
|
|
3762
|
+
import { jsx as jsx42, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
3763
|
+
function BarList2({
|
|
3764
|
+
label,
|
|
3765
|
+
items,
|
|
3766
|
+
onItemSelect,
|
|
3767
|
+
valueFormatter = (value) => value.toLocaleString(),
|
|
3768
|
+
density
|
|
3769
|
+
}) {
|
|
3770
|
+
const max = Math.max(1, ...items.map((item) => item.value));
|
|
3771
|
+
return /* @__PURE__ */ jsxs28("section", {
|
|
3772
|
+
"aria-label": label,
|
|
3773
|
+
"data-density": density,
|
|
3774
|
+
children: [
|
|
3775
|
+
/* @__PURE__ */ jsx42("ul", {
|
|
3776
|
+
className: "grid gap-3",
|
|
3777
|
+
children: items.map((item) => /* @__PURE__ */ jsx42("li", {
|
|
3778
|
+
children: /* @__PURE__ */ jsxs28(Meter2, {
|
|
3779
|
+
min: 0,
|
|
3780
|
+
max,
|
|
3781
|
+
value: item.value,
|
|
3782
|
+
"aria-label": item.label,
|
|
3783
|
+
format: { maximumFractionDigits: 2 },
|
|
3784
|
+
children: [
|
|
3785
|
+
/* @__PURE__ */ jsxs28("div", {
|
|
3786
|
+
className: "mb-1 flex items-center justify-between gap-3 text-sm",
|
|
3787
|
+
children: [
|
|
3788
|
+
/* @__PURE__ */ jsx42(MeterLabel2, {
|
|
3789
|
+
children: onItemSelect ? /* @__PURE__ */ jsx42(Button2, {
|
|
3790
|
+
type: "button",
|
|
3791
|
+
variant: "link",
|
|
3792
|
+
className: "h-auto p-0",
|
|
3793
|
+
onClick: () => onItemSelect(item),
|
|
3794
|
+
children: item.label
|
|
3795
|
+
}) : item.label
|
|
3796
|
+
}),
|
|
3797
|
+
/* @__PURE__ */ jsx42(MeterValue2, {
|
|
3798
|
+
children: () => valueFormatter(item.value)
|
|
3799
|
+
})
|
|
3800
|
+
]
|
|
3801
|
+
}),
|
|
3802
|
+
/* @__PURE__ */ jsx42(MeterTrack2, {
|
|
3803
|
+
children: /* @__PURE__ */ jsx42(MeterIndicator2, {})
|
|
3804
|
+
})
|
|
3805
|
+
]
|
|
3806
|
+
})
|
|
3807
|
+
}, item.id))
|
|
3808
|
+
}),
|
|
3809
|
+
!items.length && /* @__PURE__ */ jsx42("p", {
|
|
3810
|
+
role: "status",
|
|
3811
|
+
className: "text-sm text-muted-foreground",
|
|
3812
|
+
children: "No data available."
|
|
3813
|
+
})
|
|
3814
|
+
]
|
|
3815
|
+
});
|
|
3816
|
+
}
|
|
3817
|
+
// src/components/StatusTracker.tsx
|
|
3818
|
+
import { jsx as jsx43, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
3819
|
+
var statusClasses = { success: "bg-success", warning: "bg-warning", error: "bg-destructive", unknown: "bg-muted" };
|
|
3820
|
+
function StatusTracker2({ label, items, onItemSelect, density }) {
|
|
3821
|
+
return /* @__PURE__ */ jsx43(TooltipProvider2, {
|
|
3822
|
+
children: /* @__PURE__ */ jsx43("div", {
|
|
3823
|
+
role: "group",
|
|
3824
|
+
"aria-label": label,
|
|
3825
|
+
"data-density": density,
|
|
3826
|
+
className: "flex min-w-0 gap-1",
|
|
3827
|
+
children: items.map((item) => /* @__PURE__ */ jsxs29(Tooltip2, {
|
|
3828
|
+
children: [
|
|
3829
|
+
/* @__PURE__ */ jsx43(TooltipTrigger2, {
|
|
3830
|
+
"aria-label": `${item.label}: ${item.status}`,
|
|
3831
|
+
onClick: () => onItemSelect?.(item),
|
|
3832
|
+
className: cn2("h-8 min-w-2 flex-1 rounded-sm outline-none focus-visible:ring-2 focus-visible:ring-ring", statusClasses[item.status])
|
|
3833
|
+
}),
|
|
3834
|
+
/* @__PURE__ */ jsxs29(TooltipContent2, {
|
|
3835
|
+
children: [
|
|
3836
|
+
item.label,
|
|
3837
|
+
": ",
|
|
3838
|
+
item.description ?? item.status
|
|
3839
|
+
]
|
|
3840
|
+
})
|
|
3841
|
+
]
|
|
3842
|
+
}, item.id))
|
|
3843
|
+
})
|
|
3844
|
+
});
|
|
3845
|
+
}
|
|
3846
|
+
// src/components/DashboardLayout.tsx
|
|
3847
|
+
import { jsx as jsx44, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
3848
|
+
function DashboardLayout2({
|
|
3849
|
+
title,
|
|
3850
|
+
description,
|
|
3851
|
+
actions,
|
|
3852
|
+
filters,
|
|
3853
|
+
stats,
|
|
3854
|
+
children,
|
|
3855
|
+
footer,
|
|
3856
|
+
density
|
|
3857
|
+
}) {
|
|
3858
|
+
return /* @__PURE__ */ jsxs30("div", {
|
|
3859
|
+
"data-density": density,
|
|
3860
|
+
"data-scroll": "none",
|
|
3861
|
+
className: "grid min-w-0 gap-6",
|
|
3862
|
+
children: [
|
|
3863
|
+
/* @__PURE__ */ jsx44(PageHeader2, {
|
|
3864
|
+
title,
|
|
3865
|
+
description,
|
|
3866
|
+
actions
|
|
3867
|
+
}),
|
|
3868
|
+
filters,
|
|
3869
|
+
stats.length > 0 && /* @__PURE__ */ jsx44("div", {
|
|
3870
|
+
className: "grid gap-4 sm:grid-cols-2 xl:grid-cols-4",
|
|
3871
|
+
children: stats.map(({ id, ...stat }) => /* @__PURE__ */ jsx44(StatCard2, {
|
|
3872
|
+
...stat
|
|
3873
|
+
}, id))
|
|
3874
|
+
}),
|
|
3875
|
+
/* @__PURE__ */ jsx44("div", {
|
|
3876
|
+
className: "grid min-w-0 gap-4",
|
|
3877
|
+
children
|
|
3878
|
+
}),
|
|
3879
|
+
footer
|
|
3880
|
+
]
|
|
3881
|
+
});
|
|
3882
|
+
}
|
|
3883
|
+
// src/components/BillingUsage.tsx
|
|
3884
|
+
import { jsx as jsx45, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
3885
|
+
function BillingUsage2({ plan, price, period, metrics, onManage, pending, density }) {
|
|
3886
|
+
return /* @__PURE__ */ jsxs31(Card2, {
|
|
3887
|
+
density,
|
|
3888
|
+
"aria-label": "Billing and usage",
|
|
3889
|
+
children: [
|
|
3890
|
+
/* @__PURE__ */ jsxs31(CardHeader2, {
|
|
3891
|
+
children: [
|
|
3892
|
+
/* @__PURE__ */ jsx45(CardTitle2, {
|
|
3893
|
+
children: plan
|
|
3894
|
+
}),
|
|
3895
|
+
/* @__PURE__ */ jsxs31(CardDescription2, {
|
|
3896
|
+
children: [
|
|
3897
|
+
price,
|
|
3898
|
+
" · ",
|
|
3899
|
+
period
|
|
3900
|
+
]
|
|
3901
|
+
})
|
|
3902
|
+
]
|
|
3903
|
+
}),
|
|
3904
|
+
/* @__PURE__ */ jsx45(CardContent2, {
|
|
3905
|
+
className: "grid gap-4",
|
|
3906
|
+
children: metrics.map((metric) => /* @__PURE__ */ jsxs31(Meter2, {
|
|
3907
|
+
value: metric.used,
|
|
3908
|
+
max: metric.limit,
|
|
3909
|
+
"aria-label": metric.label,
|
|
3910
|
+
children: [
|
|
3911
|
+
/* @__PURE__ */ jsxs31("div", {
|
|
3912
|
+
className: "mb-2 flex items-center justify-between gap-3 text-sm",
|
|
3913
|
+
children: [
|
|
3914
|
+
/* @__PURE__ */ jsx45(MeterLabel2, {
|
|
3915
|
+
children: metric.label
|
|
3916
|
+
}),
|
|
3917
|
+
/* @__PURE__ */ jsx45(MeterValue2, {
|
|
3918
|
+
children: () => `${metric.used.toLocaleString()} / ${metric.limit.toLocaleString()}${metric.unit ? ` ${metric.unit}` : ""}`
|
|
3919
|
+
})
|
|
3920
|
+
]
|
|
3921
|
+
}),
|
|
3922
|
+
/* @__PURE__ */ jsx45(MeterTrack2, {
|
|
3923
|
+
children: /* @__PURE__ */ jsx45(MeterIndicator2, {})
|
|
3924
|
+
})
|
|
3925
|
+
]
|
|
3926
|
+
}, metric.id))
|
|
3927
|
+
}),
|
|
3928
|
+
/* @__PURE__ */ jsx45(CardFooter2, {
|
|
3929
|
+
children: /* @__PURE__ */ jsx45(Button2, {
|
|
3930
|
+
type: "button",
|
|
3931
|
+
variant: "outline",
|
|
3932
|
+
onClick: onManage,
|
|
3933
|
+
disabled: pending,
|
|
3934
|
+
children: "Manage billing"
|
|
3935
|
+
})
|
|
3936
|
+
})
|
|
3937
|
+
]
|
|
3938
|
+
});
|
|
3939
|
+
}
|
|
3940
|
+
export { ButtonLink2, Accordion2, AccordionItem2, AccordionTrigger2, AccordionContent2, Combobox2, ComboboxValue2, ComboboxTrigger2, ComboboxInput2, ComboboxContent2, ComboboxList2, ComboboxItem2, ComboboxGroup2, ComboboxLabel2, ComboboxCollection2, ComboboxEmpty2, ComboboxSeparator2, ComboboxChips2, ComboboxChip2, ComboboxChipsInput2, EmptyState3, PageMessage2, JsonViewer2, AlertDialog2, AlertDialogTrigger2, AlertDialogPortal2, AlertDialogOverlay2, AlertDialogContent2, AlertDialogHeader2, AlertDialogFooter2, AlertDialogMedia2, AlertDialogTitle2, AlertDialogDescription2, AlertDialogAction2, AlertDialogCancel2, Select2, SelectGroup2, SelectValue2, SelectTrigger2, SelectContent2, SelectLabel2, SelectItem2, SelectSeparator2, SelectScrollUpButton2, SelectScrollDownButton2, DensityProvider2, collectLayoutViolations2, LayoutGuard2, ScrollGuard2, ThemeProvider2, useComboboxAnchor2, AspectRatio2, Breadcrumb2, BreadcrumbList2, BreadcrumbItem2, BreadcrumbLink2, BreadcrumbPage2, BreadcrumbSeparator2, BreadcrumbEllipsis2, buttonGroupVariants2, ButtonGroup2, ButtonGroupText2, ButtonGroupSeparator2, ItemGroup2, ItemSeparator2, Item2, ItemMedia2, ItemContent2, ItemTitle2, ItemDescription2, ItemActions2, ItemHeader2, ItemFooter2, Pagination2, PaginationContent2, PaginationItem2, PaginationLink2, PaginationPrevious2, PaginationNext2, PaginationEllipsis2, ScrollArea2, ScrollBar2, Drawer2, DrawerTrigger2, DrawerPortal2, DrawerClose2, DrawerOverlay2, DrawerSwipeHandle2, DrawerContent2, DrawerHeader2, DrawerFooter2, DrawerTitle2, DrawerDescription2, ContextMenu2, ContextMenuPortal2, ContextMenuTrigger2, ContextMenuContent2, ContextMenuGroup2, ContextMenuLabel2, ContextMenuItem2, ContextMenuSub2, ContextMenuSubTrigger2, ContextMenuSubContent2, ContextMenuCheckboxItem2, ContextMenuRadioGroup2, ContextMenuRadioItem2, ContextMenuSeparator2, ContextMenuShortcut2, Menubar2, MenubarMenu2, MenubarGroup2, MenubarPortal2, MenubarTrigger2, MenubarContent2, MenubarItem2, MenubarCheckboxItem2, MenubarRadioGroup2, MenubarRadioItem2, MenubarLabel2, MenubarSeparator2, MenubarShortcut2, MenubarSub2, MenubarSubTrigger2, MenubarSubContent2, NavigationMenu2, NavigationMenuList2, NavigationMenuItem2, navigationMenuTriggerStyle2, NavigationMenuTrigger2, NavigationMenuContent2, NavigationMenuPositioner2, NavigationMenuLink2, NavigationMenuIndicator2, ToastProvider2, ToastPortal2, ToastViewport2, Toast2, ToastContent2, ToastTitle2, ToastDescription2, ToastAction2, ToastClose2, ToastToaster2, createToastManager2, useToastManager2, markerVariants2, Marker2, MarkerIcon2, MarkerContent2, BubbleGroup2, Bubble2, BubbleContent2, BubbleReactions2, MessageGroup2, Message2, MessageAvatar2, MessageContent2, MessageHeader2, MessageFooter2, Attachment2, AttachmentMedia2, AttachmentContent2, AttachmentTitle2, AttachmentDescription2, AttachmentActions2, AttachmentAction2, AttachmentTrigger2, AttachmentGroup2, InlineEdit2, StarRating2, ConfirmationDialog2, ImagePicker2, NumberField2, NumberFieldGroup2, NumberFieldInput2, NumberFieldDecrement2, NumberFieldIncrement2, NumberFieldScrubArea2, NumberFieldScrubAreaCursor2, Meter2, MeterLabel2, MeterValue2, MeterTrack2, MeterIndicator2, Stepper2, StepperList2, StepperTrigger2, StepperIndicator2, StepperContent2, AppShell2, PageHeader2, WorkspaceSwitcher2, AccountMenu2, StatCard2, AuthForm2, SettingsSection2, TagInput2, FilterBar2, BarList2, StatusTracker2, DashboardLayout2, BillingUsage2 };
|