@exsto/ds 0.0.0-stage → 0.0.1-rc.1

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.
Files changed (214) hide show
  1. package/LICENSE +202 -0
  2. package/README.md +84 -2
  3. package/dist/chunks/toggle-group-ByNq8g7H.js +4263 -0
  4. package/dist/chunks/toggle-group-ByNq8g7H.js.map +1 -0
  5. package/dist/dom/src/context.d.ts +34 -0
  6. package/dist/dom/src/define-element.d.ts +11 -0
  7. package/dist/dom/src/define-element.test.d.ts +1 -0
  8. package/dist/dom/src/field-control.d.ts +5 -0
  9. package/dist/dom/src/index.d.ts +6 -0
  10. package/dist/dom/src/mode.d.ts +8 -0
  11. package/dist/dom/src/native-slot.test.d.ts +1 -0
  12. package/dist/dom/src/styles.d.ts +6 -0
  13. package/dist/dom/src/theme-state.d.ts +1 -0
  14. package/dist/dom/src/types.d.ts +65 -0
  15. package/dist/ds/src/elements.d.ts +12 -0
  16. package/dist/ds/src/index.d.ts +8 -0
  17. package/dist/elements/src/edx-accordion.d.ts +14 -0
  18. package/dist/elements/src/edx-accordion.test.d.ts +1 -0
  19. package/dist/elements/src/edx-alert.d.ts +14 -0
  20. package/dist/elements/src/edx-audio-player.d.ts +11 -0
  21. package/dist/elements/src/edx-avatar.d.ts +10 -0
  22. package/dist/elements/src/edx-badge.d.ts +12 -0
  23. package/dist/elements/src/edx-breadcrumb.d.ts +11 -0
  24. package/dist/elements/src/edx-button-group.d.ts +7 -0
  25. package/dist/elements/src/edx-button.d.ts +20 -0
  26. package/dist/elements/src/edx-calendar.d.ts +21 -0
  27. package/dist/elements/src/edx-card.d.ts +8 -0
  28. package/dist/elements/src/edx-checkbox.d.ts +18 -0
  29. package/dist/elements/src/edx-combobox.d.ts +28 -0
  30. package/dist/elements/src/edx-content-components.d.ts +2 -0
  31. package/dist/elements/src/edx-dialog.d.ts +20 -0
  32. package/dist/elements/src/edx-drawer.d.ts +21 -0
  33. package/dist/elements/src/edx-dropdown-menu.d.ts +29 -0
  34. package/dist/elements/src/edx-field.d.ts +9 -0
  35. package/dist/elements/src/edx-field.test.d.ts +1 -0
  36. package/dist/elements/src/edx-indicator.d.ts +14 -0
  37. package/dist/elements/src/edx-input-group.d.ts +32 -0
  38. package/dist/elements/src/edx-input-otp.d.ts +19 -0
  39. package/dist/elements/src/edx-input.d.ts +31 -0
  40. package/dist/elements/src/edx-interactive-components.d.ts +2 -0
  41. package/dist/elements/src/edx-label.d.ts +6 -0
  42. package/dist/elements/src/edx-pagination.d.ts +8 -0
  43. package/dist/elements/src/edx-popover.d.ts +24 -0
  44. package/dist/elements/src/edx-progress.d.ts +10 -0
  45. package/dist/elements/src/edx-radio-group.d.ts +22 -0
  46. package/dist/elements/src/edx-radio-group.test.d.ts +1 -0
  47. package/dist/elements/src/edx-scroll-area.d.ts +15 -0
  48. package/dist/elements/src/edx-scroll-area.test.d.ts +1 -0
  49. package/dist/elements/src/edx-select.d.ts +34 -0
  50. package/dist/elements/src/edx-separator.d.ts +10 -0
  51. package/dist/elements/src/edx-skeleton.d.ts +8 -0
  52. package/dist/elements/src/edx-slider.d.ts +17 -0
  53. package/dist/elements/src/edx-slider.test.d.ts +1 -0
  54. package/dist/elements/src/edx-switch.d.ts +18 -0
  55. package/dist/elements/src/edx-table.d.ts +13 -0
  56. package/dist/elements/src/edx-table.test.d.ts +1 -0
  57. package/dist/elements/src/edx-tabs.d.ts +15 -0
  58. package/dist/elements/src/edx-tabs.test.d.ts +1 -0
  59. package/dist/elements/src/edx-textarea.d.ts +25 -0
  60. package/dist/elements/src/edx-toggle-group.d.ts +27 -0
  61. package/dist/elements/src/edx-toggle-group.test.d.ts +1 -0
  62. package/dist/elements/src/edx-toggle.d.ts +18 -0
  63. package/dist/elements/src/edx-tooltip.d.ts +28 -0
  64. package/dist/elements/src/edx-video-player.d.ts +16 -0
  65. package/dist/elements/src/field-control-bridge.d.ts +7 -0
  66. package/dist/elements/src/index.d.ts +14 -0
  67. package/dist/elements/src/projected-content.test.d.ts +1 -0
  68. package/dist/elements/src/registry.d.ts +39 -0
  69. package/dist/elements/src/registry.test.d.ts +1 -0
  70. package/dist/elements.js +4020 -0
  71. package/dist/elements.js.map +1 -0
  72. package/dist/index.js +2 -0
  73. package/dist/styles.css +7486 -0
  74. package/dist/styles.css.d.ts +2 -0
  75. package/dist/theme/src/index.d.ts +4 -0
  76. package/dist/ui/src/components/edyn/audio-player/audio-player.d.ts +29 -0
  77. package/dist/ui/src/components/edyn/audio-player/index.d.ts +1 -0
  78. package/dist/ui/src/components/edyn/video-player/index.d.ts +1 -0
  79. package/dist/ui/src/components/edyn/video-player/video-player.d.ts +55 -0
  80. package/dist/ui/src/components/ui/accordion/accordion.behavior.test.d.ts +13 -0
  81. package/dist/ui/src/components/ui/accordion/accordion.d.ts +27 -0
  82. package/dist/ui/src/components/ui/accordion/index.d.ts +1 -0
  83. package/dist/ui/src/components/ui/alert/alert.d.ts +10 -0
  84. package/dist/ui/src/components/ui/alert/index.d.ts +1 -0
  85. package/dist/ui/src/components/ui/alert-dialog/alert-dialog.d.ts +17 -0
  86. package/dist/ui/src/components/ui/alert-dialog/index.d.ts +1 -0
  87. package/dist/ui/src/components/ui/aspect-ratio/aspect-ratio.d.ts +3 -0
  88. package/dist/ui/src/components/ui/aspect-ratio/index.d.ts +1 -0
  89. package/dist/ui/src/components/ui/attachment/attachment.d.ts +23 -0
  90. package/dist/ui/src/components/ui/attachment/index.d.ts +1 -0
  91. package/dist/ui/src/components/ui/avatar/avatar.d.ts +10 -0
  92. package/dist/ui/src/components/ui/avatar/index.d.ts +1 -0
  93. package/dist/ui/src/components/ui/badge/badge.d.ts +7 -0
  94. package/dist/ui/src/components/ui/badge/index.d.ts +1 -0
  95. package/dist/ui/src/components/ui/breadcrumb/breadcrumb.d.ts +9 -0
  96. package/dist/ui/src/components/ui/breadcrumb/index.d.ts +1 -0
  97. package/dist/ui/src/components/ui/bubble/bubble.d.ts +16 -0
  98. package/dist/ui/src/components/ui/bubble/index.d.ts +1 -0
  99. package/dist/ui/src/components/ui/button/button.d.ts +7 -0
  100. package/dist/ui/src/components/ui/button/index.d.ts +1 -0
  101. package/dist/ui/src/components/ui/button-group/button-group.d.ts +12 -0
  102. package/dist/ui/src/components/ui/button-group/index.d.ts +1 -0
  103. package/dist/ui/src/components/ui/calendar/calendar.d.ts +9 -0
  104. package/dist/ui/src/components/ui/calendar/index.d.ts +1 -0
  105. package/dist/ui/src/components/ui/card/card.d.ts +10 -0
  106. package/dist/ui/src/components/ui/card/index.d.ts +1 -0
  107. package/dist/ui/src/components/ui/carousel/carousel.d.ts +28 -0
  108. package/dist/ui/src/components/ui/carousel/index.d.ts +3 -0
  109. package/dist/ui/src/components/ui/chart/chart.d.ts +44 -0
  110. package/dist/ui/src/components/ui/chart/index.d.ts +3 -0
  111. package/dist/ui/src/components/ui/checkbox/checkbox.d.ts +2 -0
  112. package/dist/ui/src/components/ui/checkbox/index.d.ts +1 -0
  113. package/dist/ui/src/components/ui/collapsible/collapsible.d.ts +4 -0
  114. package/dist/ui/src/components/ui/collapsible/index.d.ts +1 -0
  115. package/dist/ui/src/components/ui/combobox/combobox.d.ts +15 -0
  116. package/dist/ui/src/components/ui/combobox/index.d.ts +1 -0
  117. package/dist/ui/src/components/ui/command/command.d.ts +18 -0
  118. package/dist/ui/src/components/ui/command/index.d.ts +1 -0
  119. package/dist/ui/src/components/ui/context-menu/context-menu.d.ts +28 -0
  120. package/dist/ui/src/components/ui/context-menu/index.d.ts +1 -0
  121. package/dist/ui/src/components/ui/dialog/dialog.d.ts +16 -0
  122. package/dist/ui/src/components/ui/dialog/index.d.ts +1 -0
  123. package/dist/ui/src/components/ui/direction/direction.d.ts +1 -0
  124. package/dist/ui/src/components/ui/direction/index.d.ts +1 -0
  125. package/dist/ui/src/components/ui/drawer/drawer.d.ts +15 -0
  126. package/dist/ui/src/components/ui/drawer/index.d.ts +1 -0
  127. package/dist/ui/src/components/ui/dropdown-menu/dropdown-menu.d.ts +28 -0
  128. package/dist/ui/src/components/ui/dropdown-menu/index.d.ts +1 -0
  129. package/dist/ui/src/components/ui/empty/empty.d.ts +11 -0
  130. package/dist/ui/src/components/ui/empty/index.d.ts +1 -0
  131. package/dist/ui/src/components/ui/field/field.d.ts +5 -0
  132. package/dist/ui/src/components/ui/field/index.d.ts +1 -0
  133. package/dist/ui/src/components/ui/hover-card/hover-card.d.ts +4 -0
  134. package/dist/ui/src/components/ui/hover-card/index.d.ts +1 -0
  135. package/dist/ui/src/components/ui/indicator/index.d.ts +1 -0
  136. package/dist/ui/src/components/ui/indicator/indicator.d.ts +10 -0
  137. package/dist/ui/src/components/ui/input/index.d.ts +1 -0
  138. package/dist/ui/src/components/ui/input/input.d.ts +2 -0
  139. package/dist/ui/src/components/ui/input-group/index.d.ts +1 -0
  140. package/dist/ui/src/components/ui/input-group/input-group.d.ts +26 -0
  141. package/dist/ui/src/components/ui/input-otp/index.d.ts +1 -0
  142. package/dist/ui/src/components/ui/input-otp/input-otp.d.ts +10 -0
  143. package/dist/ui/src/components/ui/item/index.d.ts +1 -0
  144. package/dist/ui/src/components/ui/item/item.d.ts +22 -0
  145. package/dist/ui/src/components/ui/kbd/index.d.ts +1 -0
  146. package/dist/ui/src/components/ui/kbd/kbd.d.ts +2 -0
  147. package/dist/ui/src/components/ui/label/index.d.ts +1 -0
  148. package/dist/ui/src/components/ui/label/label.d.ts +2 -0
  149. package/dist/ui/src/components/ui/marker/index.d.ts +1 -0
  150. package/dist/ui/src/components/ui/marker/marker.d.ts +9 -0
  151. package/dist/ui/src/components/ui/menubar/index.d.ts +1 -0
  152. package/dist/ui/src/components/ui/menubar/menubar.d.ts +28 -0
  153. package/dist/ui/src/components/ui/message/index.d.ts +1 -0
  154. package/dist/ui/src/components/ui/message/message.d.ts +9 -0
  155. package/dist/ui/src/components/ui/message-scroller/index.d.ts +1 -0
  156. package/dist/ui/src/components/ui/message-scroller/message-scroller.d.ts +10 -0
  157. package/dist/ui/src/components/ui/native-select/index.d.ts +1 -0
  158. package/dist/ui/src/components/ui/native-select/native-select.d.ts +8 -0
  159. package/dist/ui/src/components/ui/navigation-menu/index.d.ts +1 -0
  160. package/dist/ui/src/components/ui/navigation-menu/navigation-menu.d.ts +10 -0
  161. package/dist/ui/src/components/ui/pagination/index.d.ts +1 -0
  162. package/dist/ui/src/components/ui/pagination/pagination.behavior.test.d.ts +1 -0
  163. package/dist/ui/src/components/ui/pagination/pagination.d.ts +17 -0
  164. package/dist/ui/src/components/ui/pagination/pagination.test.d.ts +1 -0
  165. package/dist/ui/src/components/ui/popover/index.d.ts +1 -0
  166. package/dist/ui/src/components/ui/popover/popover.d.ts +8 -0
  167. package/dist/ui/src/components/ui/progress/index.d.ts +1 -0
  168. package/dist/ui/src/components/ui/progress/progress.d.ts +5 -0
  169. package/dist/ui/src/components/ui/questionnaire/index.d.ts +1 -0
  170. package/dist/ui/src/components/ui/questionnaire/questionnaire.d.ts +18 -0
  171. package/dist/ui/src/components/ui/radio-group/index.d.ts +1 -0
  172. package/dist/ui/src/components/ui/radio-group/radio-group.d.ts +10 -0
  173. package/dist/ui/src/components/ui/resizable/index.d.ts +1 -0
  174. package/dist/ui/src/components/ui/resizable/resizable.d.ts +6 -0
  175. package/dist/ui/src/components/ui/scroll-area/index.d.ts +1 -0
  176. package/dist/ui/src/components/ui/scroll-area/scroll-area.d.ts +32 -0
  177. package/dist/ui/src/components/ui/select/index.d.ts +1 -0
  178. package/dist/ui/src/components/ui/select/select.d.ts +17 -0
  179. package/dist/ui/src/components/ui/separator/index.d.ts +1 -0
  180. package/dist/ui/src/components/ui/separator/separator.d.ts +2 -0
  181. package/dist/ui/src/components/ui/sheet/index.d.ts +1 -0
  182. package/dist/ui/src/components/ui/sheet/sheet.d.ts +13 -0
  183. package/dist/ui/src/components/ui/sidebar/index.d.ts +1 -0
  184. package/dist/ui/src/components/ui/sidebar/sidebar.d.ts +63 -0
  185. package/dist/ui/src/components/ui/skeleton/index.d.ts +1 -0
  186. package/dist/ui/src/components/ui/skeleton/skeleton.d.ts +1 -0
  187. package/dist/ui/src/components/ui/slider/index.d.ts +1 -0
  188. package/dist/ui/src/components/ui/slider/slider.d.ts +17 -0
  189. package/dist/ui/src/components/ui/spinner/index.d.ts +1 -0
  190. package/dist/ui/src/components/ui/spinner/spinner.d.ts +5 -0
  191. package/dist/ui/src/components/ui/switch/index.d.ts +1 -0
  192. package/dist/ui/src/components/ui/switch/switch.d.ts +4 -0
  193. package/dist/ui/src/components/ui/table/index.d.ts +1 -0
  194. package/dist/ui/src/components/ui/table/table.behavior.test.d.ts +10 -0
  195. package/dist/ui/src/components/ui/table/table.d.ts +9 -0
  196. package/dist/ui/src/components/ui/tabs/index.d.ts +1 -0
  197. package/dist/ui/src/components/ui/tabs/tabs.behavior.test.d.ts +21 -0
  198. package/dist/ui/src/components/ui/tabs/tabs.d.ts +35 -0
  199. package/dist/ui/src/components/ui/textarea/index.d.ts +1 -0
  200. package/dist/ui/src/components/ui/textarea/textarea.d.ts +2 -0
  201. package/dist/ui/src/components/ui/toast/index.d.ts +1 -0
  202. package/dist/ui/src/components/ui/toast/toast.d.ts +15 -0
  203. package/dist/ui/src/components/ui/toggle/index.d.ts +1 -0
  204. package/dist/ui/src/components/ui/toggle/toggle.d.ts +8 -0
  205. package/dist/ui/src/components/ui/toggle-group/index.d.ts +1 -0
  206. package/dist/ui/src/components/ui/toggle-group/toggle-group.d.ts +7 -0
  207. package/dist/ui/src/components/ui/tooltip/index.d.ts +1 -0
  208. package/dist/ui/src/components/ui/tooltip/tooltip.d.ts +5 -0
  209. package/dist/ui/src/hooks/use-media-player.d.ts +29 -0
  210. package/dist/ui/src/hooks/use-merged-refs.d.ts +4 -0
  211. package/dist/ui/src/hooks/use-mobile.d.ts +1 -0
  212. package/dist/ui/src/index.d.ts +68 -0
  213. package/dist/ui/src/lib/utils.d.ts +13 -0
  214. package/package.json +72 -4
@@ -0,0 +1,4020 @@
1
+ import { $ as SidebarProvider, $a as AlertDialogAction, $i as ChartContainer, $n as Kbd, $r as DrawerTrigger, $t as PopoverHeader, A as TableRow, Aa as BreadcrumbLink, Ar as EmptyTitle, At as ResizablePanel, B as SidebarGroupLabel, C as Table, Ca as Bubble, Ci as CommandList, Co as Button, Cr as FieldError, Ct as SelectSeparator, Da as Breadcrumb, Di as InputGroupAddon, Dr as EmptyDescription, E as TableCell, Ei as InputGroup, En as Message, Et as ScrollArea, F as SidebarContent, Fr as DropdownMenuItem, Ft as QuestionnaireActions, Ga as AttachmentContent, Gi as ComboboxContent, Gr as DropdownMenuTrigger, Gt as QuestionnaireProgress, Ha as Attachment, Hi as DialogTitle, Ht as QuestionnaireItem, Ia as Avatar, Ii as DialogContent, In as MenubarItem, Ir as DropdownMenuLabel, It as QuestionnaireChoice, J as SidebarMenuItem, Ja as AttachmentMedia, Ji as ComboboxItem, Jn as Marker, Jr as DrawerContent, Jt as QuestionnaireTitle, Ka as AttachmentDescription, Kr as Drawer, L as SidebarGroup, La as AvatarBadge, Li as DialogDescription, Lt as QuestionnaireChoiceDescription, M as Spinner, Ma as BreadcrumbPage, Mi as Textarea, Mn as Menubar, Mt as RadioGroup, Na as BreadcrumbSeparator, Ni as Input, Nr as DropdownMenuContent, Nt as RadioGroupItem, O as TableHead, Oi as InputGroupButton, On as MessageContent, Or as EmptyHeader, P as Sidebar, Pa as Badge, Pi as Dialog, Pn as MenubarContent, Pr as DropdownMenuGroup, Pt as Questionnaire, Qa as AlertDialog, Qi as Checkbox, Qn as Label, Qr as DrawerTitle, Qt as PopoverDescription, Ra as AvatarFallback, Ri as DialogFooter, Rn as MenubarMenu, Rt as QuestionnaireChoices, Si as CommandItem, Sn as MessageScrollerViewport, So as Slider, Sr as FieldDescription, St as SelectLabel, T as TableCaption, To as cn, Tr as Empty, Tt as SelectValue, Ui as DialogTrigger, V as SidebarHeader, Va as AvatarImage, W as SidebarMenu, Wi as Combobox, Xi as CollapsibleContent, Xt as Popover, Ya as AttachmentTitle, Yi as Collapsible, Yn as MarkerContent, Yr as DrawerDescription, Yt as Progress, Za as AspectRatio, Zi as CollapsibleTrigger, Zr as DrawerHeader, Zt as PopoverContent, _a as CardTitle, _i as Command, _n as MessageScroller, _o as AccordionTrigger, _t as SheetTrigger, aa as Carousel, an as NavigationMenu, at as TooltipContent, b as TabsList, ba as ButtonGroup, bn as MessageScrollerItem, br as HoverCardTrigger, bt as SelectGroup, ca as CarouselNext, cn as NavigationMenuItem, co as AlertDialogTitle, cr as ItemMedia, ct as Skeleton, da as Card, do as AlertAction, dr as Separator, ei as DirectionProvider, en as PopoverTitle, eo as AlertDialogCancel, fo as AlertDescription, fr as InputOTP, ft as SheetContent, g as toast, ga as CardHeader, gi as ContextMenuTrigger, gn as NativeSelectOption, go as AccordionItem, gr as Indicator, gt as SheetTitle, ho as AccordionContent, hr as InputOTPSlot, ht as SheetHeader, ii as ContextMenuContent, io as AlertDialogHeader, ir as ItemDescription, it as Tooltip, j as Switch, ja as BreadcrumbList, jn as MessageHeader, jr as DropdownMenu, jt as ResizablePanelGroup, k as TableHeader, ka as BreadcrumbItem, ki as InputGroupInput, kn as MessageFooter, kr as EmptyMedia, kt as ResizableHandle, la as CarouselPrevious, ln as NavigationMenuLink, lo as AlertDialogTrigger, m as Toaster, ma as CardDescription, mn as NativeSelect, mo as Accordion, mr as InputOTPSeparator, n as ToggleGroupItem, ni as ContextMenu, nn as Pagination, no as AlertDialogDescription, nt as SidebarTrigger, oa as CarouselContent, oi as ContextMenuItem, ot as TooltipProvider, pa as CardContent, po as AlertTitle, pr as InputOTPGroup, pt as SheetDescription, q as SidebarMenuButton, qi as ComboboxInput, qn as MenubarTrigger, qt as QuestionnaireSubmit, r as Toggle, ro as AlertDialogFooter, rr as ItemContent, sa as CarouselItem, st as TooltipTrigger, t as ToggleGroup, tn as PopoverTrigger, to as AlertDialogContent, tr as Item, un as NavigationMenuList, uo as Alert, ur as ItemTitle, ut as Sheet, v as Tabs, va as Calendar, vn as MessageScrollerButton, vo as VideoPlayer, vr as HoverCard, vt as Select, w as TableBody, wa as BubbleContent, wr as FieldLabel, wt as SelectTrigger, x as TabsTrigger, xi as CommandInput, xn as MessageScrollerProvider, xr as Field, xt as SelectItem, y as TabsContent, yi as CommandEmpty, yn as MessageScrollerContent, yo as AudioPlayer, yr as HoverCardContent, yt as SelectContent, z as SidebarGroupContent, zi as DialogHeader, zt as QuestionnaireDescription } from "./chunks/toggle-group-ByNq8g7H.js";
2
+ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
3
+ import { createContext, useCallback, useContext, useEffect, useLayoutEffect, useRef, useState } from "react";
4
+ import { IconFile, IconInbox } from "@tabler/icons-react";
5
+ import { Bar, BarChart, CartesianGrid, XAxis } from "recharts";
6
+ import { flushSync } from "react-dom";
7
+ import { createRoot } from "react-dom/client";
8
+ //#region ../dom/src/context.tsx
9
+ var EdxHostContext = createContext(null);
10
+ var EdxHostProvider = (props) => {
11
+ return /* @__PURE__ */ jsx(EdxHostContext.Provider, {
12
+ value: props.value,
13
+ children: props.children
14
+ });
15
+ };
16
+ var useEdxHost = () => {
17
+ const ctx = useContext(EdxHostContext);
18
+ if (!ctx) throw new Error("useEdxHost must be used inside an Edynamix custom element");
19
+ return ctx;
20
+ };
21
+ var useEmit = () => useEdxHost().emit;
22
+ /** The node Radix/shadcn overlays should portal into (shadow root in shadow mode, `null` -> body in light mode). */
23
+ var usePortalContainer = () => useEdxHost().portalContainer;
24
+ var useDomMode = () => useEdxHost().mode;
25
+ /**
26
+ * Projects host light-DOM children. Renders a native `<slot>` in shadow mode and
27
+ * re-inflates the captured markup in light mode (where no native slotting exists).
28
+ *
29
+ * Pass an optional `name` prop to render a named `<slot name="...">` in shadow mode,
30
+ * enabling multi-part containers (Tabs, Accordion, Table) to host their trigger/panel
31
+ * content as live, host-owned light-DOM nodes assigned to distinct projection points.
32
+ */
33
+ var Slot = ({ name } = {}) => {
34
+ const { mode, slotHtml } = useEdxHost();
35
+ if (mode === "shadow") return /* @__PURE__ */ jsx("slot", { name });
36
+ if (!slotHtml) return null;
37
+ return /* @__PURE__ */ jsx("span", {
38
+ style: { display: "contents" },
39
+ dangerouslySetInnerHTML: { __html: slotHtml }
40
+ });
41
+ };
42
+ //#endregion
43
+ //#region ../dom/src/field-control.ts
44
+ var EDX_FIELD_CONTROL_CONNECT_EVENT = "edx-field-control-connect";
45
+ //#endregion
46
+ //#region ../dom/src/mode.ts
47
+ var defaultMode = "light";
48
+ /**
49
+ * Switch the default rendering mode for every element that does not pin its own
50
+ * `mode`. This is the one knob for flipping the whole library between light and
51
+ * shadow DOM.
52
+ */
53
+ var setDefaultMode = (mode) => {
54
+ defaultMode = mode;
55
+ };
56
+ var getDefaultMode = () => defaultMode;
57
+ //#endregion
58
+ //#region ../dom/src/styles.ts
59
+ var sheetCache = /* @__PURE__ */ new Map();
60
+ /**
61
+ * Build (or reuse) a constructable stylesheet for the given CSS. Sheets are
62
+ * cached by content so every shadow root adopts the *same* sheet by reference:
63
+ * no per-instance `<style>` duplication.
64
+ */
65
+ var getStyleSheet = (css) => {
66
+ if (typeof CSSStyleSheet === "undefined") return null;
67
+ const cached = sheetCache.get(css);
68
+ if (cached) return cached;
69
+ const sheet = new CSSStyleSheet();
70
+ sheet.replaceSync(css);
71
+ sheetCache.set(css, sheet);
72
+ return sheet;
73
+ };
74
+ //#endregion
75
+ //#region ../dom/src/theme-state.ts
76
+ var DARK_CLASS = "dark";
77
+ var targets = /* @__PURE__ */ new Set();
78
+ var observer = null;
79
+ var syncTargets = () => {
80
+ const isDark = document.documentElement.classList.contains(DARK_CLASS);
81
+ for (const target of targets) target.classList.toggle(DARK_CLASS, isDark);
82
+ };
83
+ var registerShadowThemeTargets = (...nextTargets) => {
84
+ for (const target of nextTargets) targets.add(target);
85
+ syncTargets();
86
+ if (!observer) {
87
+ observer = new MutationObserver(syncTargets);
88
+ observer.observe(document.documentElement, {
89
+ attributes: true,
90
+ attributeFilter: ["class"]
91
+ });
92
+ }
93
+ return () => {
94
+ for (const target of nextTargets) targets.delete(target);
95
+ if (targets.size === 0) {
96
+ observer?.disconnect();
97
+ observer = null;
98
+ }
99
+ };
100
+ };
101
+ //#endregion
102
+ //#region ../dom/src/define-element.tsx
103
+ var PORTAL_ATTR = "data-edx-portal";
104
+ var FORM_RESET_PROPERTIES = ["value", "checked"];
105
+ var VALUE_MISSING_MESSAGE = "Please fill out this field.";
106
+ var cloneFormState = (value) => Array.isArray(value) ? [...value] : value;
107
+ var isEmptyFormValue = (value) => {
108
+ if (value == null || value === "") return true;
109
+ if (Array.isArray(value)) return value.length === 0;
110
+ if (value instanceof FormData) return value.entries().next().done === true;
111
+ return false;
112
+ };
113
+ var isRequiredValueMissing = (props, formValue) => {
114
+ const values = props;
115
+ if (values.required !== true) return false;
116
+ if ("checked" in values || "defaultChecked" in values) return (values.checked ?? values.defaultChecked) !== true;
117
+ const value = values.value ?? values.defaultValue;
118
+ return isEmptyFormValue(value === void 0 ? formValue : value);
119
+ };
120
+ /**
121
+ * Register a React component as an `<edx-*>` custom element.
122
+ *
123
+ * Works in light or shadow DOM from the same component code. Attribute changes
124
+ * re-render (React reconciles, state and focus are preserved, no remount). The
125
+ * component reads host context via the `@edyn/dom` hooks (`useEmit`,
126
+ * `usePortalContainer`, `Slot`).
127
+ */
128
+ var defineElement = (tag, Component, options = {}) => {
129
+ if (typeof customElements === "undefined") return;
130
+ if (customElements.get(tag)) return;
131
+ const observed = options.observedAttributes ?? [];
132
+ class EdxElement extends HTMLElement {
133
+ static formAssociated = options.formAssociated ?? false;
134
+ static get observedAttributes() {
135
+ return observed;
136
+ }
137
+ #root = null;
138
+ #mode = options.mode ?? getDefaultMode();
139
+ #portalContainer = null;
140
+ #shadow = null;
141
+ #shadowMountPoint = null;
142
+ #shadowPortalContainer = null;
143
+ #slotHtml = "";
144
+ #propOverrides = {};
145
+ #mountQueued = false;
146
+ #unmountPromise = null;
147
+ #delegateAbort = null;
148
+ #fieldControlCleanup = null;
149
+ #themeCleanup = null;
150
+ #internals = null;
151
+ #formValueOverride;
152
+ #formDisabled = false;
153
+ #formResetState = null;
154
+ constructor() {
155
+ super();
156
+ if (options.formAssociated && typeof this.attachInternals === "function") this.#internals = this.attachInternals();
157
+ }
158
+ connectedCallback() {
159
+ if (options.formAssociated) queueMicrotask(() => {
160
+ if (!this.isConnected) return;
161
+ this.#fieldControlCleanup?.();
162
+ let cleanup = null;
163
+ const detail = {
164
+ control: this,
165
+ setCleanup: (nextCleanup) => {
166
+ cleanup = nextCleanup;
167
+ }
168
+ };
169
+ this.dispatchEvent(new CustomEvent(EDX_FIELD_CONTROL_CONNECT_EVENT, {
170
+ detail,
171
+ bubbles: true,
172
+ composed: true
173
+ }));
174
+ this.#fieldControlCleanup = cleanup;
175
+ });
176
+ this.#ensureThemeRegistration();
177
+ if (this.#root || this.#mountQueued) return;
178
+ this.#mountQueued = true;
179
+ queueMicrotask(() => {
180
+ this.#mountAfterPendingUnmount();
181
+ });
182
+ }
183
+ async #mountAfterPendingUnmount() {
184
+ const pendingUnmount = this.#unmountPromise;
185
+ if (pendingUnmount) {
186
+ await pendingUnmount;
187
+ if (this.#unmountPromise === pendingUnmount) this.#unmountPromise = null;
188
+ }
189
+ this.#mountQueued = false;
190
+ if (this.#root || !this.isConnected) return;
191
+ this.#mount();
192
+ }
193
+ #mount() {
194
+ let mountPoint;
195
+ this.#captureFormResetState();
196
+ if (this.#mode === "shadow") {
197
+ if (!this.#shadow) {
198
+ this.#shadow = this.attachShadow({
199
+ mode: options.shadowMode ?? "open",
200
+ delegatesFocus: (options.delegateClick ?? false) || (options.formAssociated ?? false)
201
+ });
202
+ const sheet = options.styles ? getStyleSheet(options.styles) : null;
203
+ if (sheet) this.#shadow.adoptedStyleSheets = [...this.#shadow.adoptedStyleSheets, sheet];
204
+ this.#shadowMountPoint = document.createElement("div");
205
+ this.#shadowMountPoint.className = "edx-root";
206
+ this.#shadow.appendChild(this.#shadowMountPoint);
207
+ this.#shadowPortalContainer = document.createElement("div");
208
+ this.#shadowPortalContainer.setAttribute(PORTAL_ATTR, "");
209
+ this.#shadowPortalContainer.className = "edx-root";
210
+ this.#shadow.appendChild(this.#shadowPortalContainer);
211
+ }
212
+ if (!this.#shadowMountPoint || !this.#shadowPortalContainer) throw new Error(`Shadow mount points are unavailable for <${tag}>`);
213
+ this.style.display = options.display ?? "block";
214
+ mountPoint = this.#shadowMountPoint;
215
+ this.#portalContainer = this.#shadowPortalContainer;
216
+ this.#ensureThemeRegistration();
217
+ } else {
218
+ if (!this.#slotHtml) this.#slotHtml = this.innerHTML;
219
+ this.innerHTML = "";
220
+ this.classList.add("edx-root");
221
+ this.style.display = options.display ?? "block";
222
+ mountPoint = this;
223
+ this.#portalContainer = null;
224
+ }
225
+ if (options.delegateClick || this.#mode === "light" && options.formAssociated) {
226
+ this.#delegateAbort = new AbortController();
227
+ const { signal } = this.#delegateAbort;
228
+ const findInteractive = () => {
229
+ return (this.#shadow ?? this).querySelector("button, input, select, textarea, [role=\"switch\"], [role=\"checkbox\"]");
230
+ };
231
+ if (options.delegateClick) this.addEventListener("click", (event) => {
232
+ if (event.composedPath()[0] !== this) return;
233
+ const inner = findInteractive();
234
+ if (!inner) return;
235
+ inner.focus();
236
+ if (inner.tagName !== "INPUT" && inner.tagName !== "SELECT" && inner.tagName !== "TEXTAREA") inner.click();
237
+ }, { signal });
238
+ if (this.#mode === "light") this.addEventListener("focus", () => {
239
+ findInteractive()?.focus();
240
+ }, { signal });
241
+ }
242
+ this.#root = createRoot(mountPoint);
243
+ flushSync(() => {
244
+ this.#render();
245
+ });
246
+ }
247
+ #ensureThemeRegistration() {
248
+ if (!this.#shadowMountPoint || !this.#shadowPortalContainer || this.#themeCleanup) return;
249
+ this.#themeCleanup = registerShadowThemeTargets(this.#shadowMountPoint, this.#shadowPortalContainer);
250
+ }
251
+ disconnectedCallback() {
252
+ this.#fieldControlCleanup?.();
253
+ this.#fieldControlCleanup = null;
254
+ this.#themeCleanup?.();
255
+ this.#themeCleanup = null;
256
+ const root = this.#root;
257
+ if (root) this.#unmountPromise = new Promise((resolve) => {
258
+ queueMicrotask(() => {
259
+ if (this.isConnected || this.#root !== root) {
260
+ resolve();
261
+ return;
262
+ }
263
+ try {
264
+ this.#delegateAbort?.abort();
265
+ this.#delegateAbort = null;
266
+ root.unmount();
267
+ } finally {
268
+ if (this.#root === root) {
269
+ this.#root = null;
270
+ this.#portalContainer = null;
271
+ }
272
+ resolve();
273
+ }
274
+ });
275
+ });
276
+ }
277
+ attributeChangedCallback() {
278
+ if (this.#root) this.#render();
279
+ }
280
+ formDisabledCallback(disabled) {
281
+ this.#formDisabled = disabled;
282
+ if (this.#root) this.#render();
283
+ }
284
+ formResetCallback() {
285
+ this.#formValueOverride = void 0;
286
+ for (const [property, value] of this.#formResetState ?? []) options.domProperties?.[property]?.set(this, cloneFormState(value));
287
+ if (this.#root) this.#render();
288
+ }
289
+ /** Push complex object/array props that cannot travel as attributes. */
290
+ setProps(props) {
291
+ this.#propOverrides = {
292
+ ...this.#propOverrides,
293
+ ...props
294
+ };
295
+ if (this.#root) this.#render();
296
+ }
297
+ #emit = (type, detail) => {
298
+ this.dispatchEvent(new CustomEvent(type, {
299
+ detail,
300
+ bubbles: true,
301
+ composed: true
302
+ }));
303
+ };
304
+ #setFormValue = (value, state) => {
305
+ if (this.#mode !== "shadow") return;
306
+ this.#formValueOverride = value;
307
+ this.#internals?.setFormValue(value, state);
308
+ this.#syncFormValidity(this.#getProps(), value);
309
+ };
310
+ #captureFormResetState() {
311
+ if (!options.formAssociated || this.#formResetState) return;
312
+ this.#formResetState = /* @__PURE__ */ new Map();
313
+ for (const property of FORM_RESET_PROPERTIES) {
314
+ const descriptor = options.domProperties?.[property];
315
+ if (descriptor) this.#formResetState.set(property, cloneFormState(descriptor.get(this)));
316
+ }
317
+ }
318
+ #syncFormValidity(props, formValue) {
319
+ if (this.#mode !== "shadow" || !this.#internals?.setValidity) return;
320
+ if (!(this.#formDisabled || props.disabled === true) && isRequiredValueMissing(props, formValue)) {
321
+ this.#internals.setValidity({ valueMissing: true }, VALUE_MISSING_MESSAGE);
322
+ return;
323
+ }
324
+ this.#internals.setValidity({});
325
+ }
326
+ #getProps() {
327
+ const raw = {};
328
+ for (const name of observed) raw[name] = this.getAttribute(name);
329
+ const props = {
330
+ ...options.transformProps ? options.transformProps(raw, this) : raw,
331
+ ...this.#propOverrides
332
+ };
333
+ if (options.formAssociated && this.#formDisabled) return {
334
+ ...props,
335
+ disabled: true
336
+ };
337
+ return props;
338
+ }
339
+ #render() {
340
+ if (!this.#root) return;
341
+ const props = this.#getProps();
342
+ if (this.#mode === "shadow" && this.#internals && options.formValue) {
343
+ const formValue = this.#formValueOverride === void 0 ? options.formValue(props, this) : this.#formValueOverride;
344
+ this.#internals.setFormValue(formValue);
345
+ this.#syncFormValidity(props, formValue);
346
+ }
347
+ this.#root.render(/* @__PURE__ */ jsx(EdxHostProvider, {
348
+ value: {
349
+ host: this,
350
+ mode: this.#mode,
351
+ emit: this.#emit,
352
+ portalContainer: this.#portalContainer,
353
+ setFormValue: this.#setFormValue,
354
+ slotHtml: this.#slotHtml
355
+ },
356
+ children: /* @__PURE__ */ jsx(Component, { ...props })
357
+ }));
358
+ }
359
+ }
360
+ if (options.domProperties) for (const [propName, descriptor] of Object.entries(options.domProperties)) Object.defineProperty(EdxElement.prototype, propName, {
361
+ get() {
362
+ return descriptor.get(this);
363
+ },
364
+ set(value) {
365
+ descriptor.set(this, value);
366
+ },
367
+ configurable: true,
368
+ enumerable: false
369
+ });
370
+ customElements.define(tag, EdxElement);
371
+ };
372
+ //#endregion
373
+ //#region ../elements/src/registry.ts
374
+ /**
375
+ * Register a class-4 overlay element. Overlays are pinned to **light mode**: their
376
+ * Base UI portal lands in `document.body` and cannot reach a shadow root, so shadow
377
+ * mode would let the portaled content escape the shadow root, lose the adopted
378
+ * stylesheet, and render unstyled with no error. This helper forces `mode: 'light'`
379
+ * once, so no overlay can inherit that footgun by forgetting to pin it. Mirror
380
+ * `edx-dialog` / `edx-drawer`. See docs/delivery-classes.md.
381
+ */
382
+ var registerOverlayElement = (tag, component, ctx, options = {}) => {
383
+ defineElement(tag, component, {
384
+ ...options,
385
+ mode: "light",
386
+ styles: ctx.styles
387
+ });
388
+ };
389
+ /**
390
+ * Coerce a boolean-ish attribute string to a real boolean. Follows HTML boolean
391
+ * attribute semantics: any present value is `true` EXCEPT the literal `"false"`
392
+ * (and `null`/`undefined`). Note the gotcha: `"0"` coerces to `true` (presence
393
+ * wins); to express false, set the attribute to `"false"` or omit it. This
394
+ * contract is pinned by registry.test.ts.
395
+ */
396
+ var coerceBool = (value) => value != null && value !== "false";
397
+ /** Reflect a boolean DOM state using native boolean-attribute semantics. */
398
+ var reflectBool = (host, attribute, value) => {
399
+ if (value) host.setAttribute(attribute, "true");
400
+ else host.removeAttribute(attribute);
401
+ };
402
+ /**
403
+ * Create a real boolean property backed by a reflected boolean attribute.
404
+ * When an uncontrolled `default-*` attribute exists, read it until the first
405
+ * explicit property write or user change promotes the state to the live
406
+ * attribute.
407
+ */
408
+ var booleanDomProperty = (attribute, defaultAttribute) => ({
409
+ get: (host) => {
410
+ const current = host.getAttribute(attribute);
411
+ if (current != null) return coerceBool(current);
412
+ return defaultAttribute ? coerceBool(host.getAttribute(defaultAttribute)) : false;
413
+ },
414
+ set: (host, value) => {
415
+ if (defaultAttribute) host.removeAttribute(defaultAttribute);
416
+ reflectBool(host, attribute, Boolean(value));
417
+ }
418
+ });
419
+ /** Coerce a numeric attribute string to a number, or `undefined` when absent/invalid. */
420
+ var coerceNumber = (value) => {
421
+ if (value == null || value === "") return;
422
+ const parsed = Number(value);
423
+ return Number.isNaN(parsed) ? void 0 : parsed;
424
+ };
425
+ /** Parse a JSON attribute string into a value of type T, or `undefined` on absence/parse error. */
426
+ var coerceJson = (value) => {
427
+ if (value == null || value === "") return;
428
+ try {
429
+ return JSON.parse(value);
430
+ } catch {
431
+ return;
432
+ }
433
+ };
434
+ /** Build the repeated-name payload required by multi-value custom controls. */
435
+ var multipleFormValue = (host, values) => {
436
+ const name = host.getAttribute("name");
437
+ if (!name) return null;
438
+ const data = new FormData();
439
+ for (const value of values) data.append(name, value);
440
+ return data;
441
+ };
442
+ //#endregion
443
+ //#region ../elements/src/edx-accordion.tsx
444
+ /** Normalize the value prop (scalar, array, or absent) to the string[] Base UI expects. */
445
+ var toValueArray = (value) => {
446
+ if (value == null) return [];
447
+ if (Array.isArray(value)) return value;
448
+ return value === "" ? [] : [value];
449
+ };
450
+ var EdxAccordion = (props) => {
451
+ const { emit, host } = useEdxHost();
452
+ const items = props.items ?? [];
453
+ const openMultiple = props.openMultiple ?? false;
454
+ const currentValue = props.value != null ? toValueArray(props.value) : toValueArray(props.defaultValue);
455
+ const handleValueChange = (next) => {
456
+ const emitValue = openMultiple ? next : next[0] ?? "";
457
+ const serialized = openMultiple ? JSON.stringify(next) : next[0] ?? "";
458
+ host.removeAttribute("default-value");
459
+ host.setAttribute("value", serialized);
460
+ emit("edx-change", { value: emitValue });
461
+ };
462
+ return /* @__PURE__ */ jsx(Accordion, {
463
+ value: currentValue,
464
+ multiple: openMultiple,
465
+ onValueChange: handleValueChange,
466
+ children: items.map((item) => /* @__PURE__ */ jsxs(AccordionItem, {
467
+ value: item.value,
468
+ disabled: item.disabled,
469
+ children: [/* @__PURE__ */ jsx(AccordionTrigger, { children: item.label }), /* @__PURE__ */ jsx(AccordionContent, { children: /* @__PURE__ */ jsx(Slot, { name: `panel-${item.value}` }) })]
470
+ }, item.value))
471
+ });
472
+ };
473
+ var registerEdxAccordion = (ctx) => {
474
+ defineElement("edx-accordion", EdxAccordion, {
475
+ mode: "shadow",
476
+ styles: ctx.styles,
477
+ observedAttributes: [
478
+ "items",
479
+ "value",
480
+ "default-value",
481
+ "open-multiple"
482
+ ],
483
+ transformProps: (raw) => {
484
+ const openMultiple = coerceBool(raw["open-multiple"]);
485
+ const parse = (v) => {
486
+ if (v == null) return;
487
+ if (v === "") return openMultiple ? [] : "";
488
+ return openMultiple ? coerceJson(v) ?? [v] : v;
489
+ };
490
+ return {
491
+ items: coerceJson(raw.items),
492
+ value: parse(raw.value),
493
+ defaultValue: parse(raw["default-value"]),
494
+ openMultiple
495
+ };
496
+ },
497
+ domProperties: { value: {
498
+ get: (host) => {
499
+ const raw = host.getAttribute("value") ?? host.getAttribute("default-value") ?? "";
500
+ if (coerceBool(host.getAttribute("open-multiple"))) return coerceJson(raw) ?? (raw === "" ? [] : [raw]);
501
+ return raw;
502
+ },
503
+ set: (host, value) => {
504
+ if (Array.isArray(value)) {
505
+ host.setAttribute("value", JSON.stringify(value));
506
+ return;
507
+ }
508
+ host.setAttribute("value", String(value ?? ""));
509
+ }
510
+ } }
511
+ });
512
+ };
513
+ //#endregion
514
+ //#region ../elements/src/edx-alert.tsx
515
+ var EdxAlert = (props) => {
516
+ const emit = useEmit();
517
+ return /* @__PURE__ */ jsxs(Alert, {
518
+ variant: props.variant ?? "default",
519
+ children: [
520
+ props.title && /* @__PURE__ */ jsx(AlertTitle, { children: props.title }),
521
+ props.description && /* @__PURE__ */ jsx(AlertDescription, { children: props.description }),
522
+ /* @__PURE__ */ jsx(Slot, {}),
523
+ props.actionLabel && /* @__PURE__ */ jsx(AlertAction, { children: /* @__PURE__ */ jsx(Button, {
524
+ variant: "ghost",
525
+ size: "icon-xs",
526
+ "aria-label": props.actionAriaLabel ?? props.actionLabel,
527
+ onClick: () => emit("edx-action"),
528
+ children: props.actionLabel
529
+ }) })
530
+ ]
531
+ });
532
+ };
533
+ var registerEdxAlert = (ctx) => {
534
+ defineElement("edx-alert", EdxAlert, {
535
+ mode: ctx.mode,
536
+ styles: ctx.styles,
537
+ observedAttributes: [
538
+ "variant",
539
+ "title",
540
+ "description",
541
+ "action-label",
542
+ "action-aria-label"
543
+ ],
544
+ transformProps: (raw) => ({
545
+ variant: raw.variant ?? void 0,
546
+ title: raw.title ?? void 0,
547
+ description: raw.description ?? void 0,
548
+ actionLabel: raw["action-label"] ?? void 0,
549
+ actionAriaLabel: raw["action-aria-label"] ?? void 0
550
+ })
551
+ });
552
+ };
553
+ //#endregion
554
+ //#region ../elements/src/edx-audio-player.tsx
555
+ var EdxAudioPlayer = (props) => {
556
+ const { emit } = useEdxHost();
557
+ return /* @__PURE__ */ jsx(AudioPlayer, {
558
+ src: props.src,
559
+ muted: props.muted ?? false,
560
+ loop: props.loop ?? false,
561
+ disabled: props.disabled ?? false,
562
+ width: props.width,
563
+ "aria-label": props.ariaLabel ?? "Audio player",
564
+ onPlay: () => emit("edx-play", {}),
565
+ onPause: () => emit("edx-pause", {}),
566
+ onEnded: () => emit("edx-ended", {}),
567
+ onTimeUpdate: (currentTime, duration) => emit("edx-timeupdate", {
568
+ currentTime,
569
+ duration
570
+ })
571
+ });
572
+ };
573
+ var registerEdxAudioPlayer = (ctx) => {
574
+ defineElement("edx-audio-player", EdxAudioPlayer, {
575
+ mode: ctx.mode,
576
+ styles: ctx.styles,
577
+ display: "block",
578
+ observedAttributes: [
579
+ "src",
580
+ "muted",
581
+ "loop",
582
+ "disabled",
583
+ "width",
584
+ "aria-label"
585
+ ],
586
+ transformProps: (raw) => ({
587
+ src: raw.src ?? void 0,
588
+ muted: coerceBool(raw.muted),
589
+ loop: coerceBool(raw.loop),
590
+ disabled: coerceBool(raw.disabled),
591
+ width: raw.width ?? void 0,
592
+ ariaLabel: raw["aria-label"] ?? void 0
593
+ })
594
+ });
595
+ };
596
+ //#endregion
597
+ //#region ../elements/src/edx-avatar.tsx
598
+ var STATUS_CLASS = {
599
+ online: "bg-success",
600
+ away: "bg-warning",
601
+ busy: "bg-destructive",
602
+ offline: "bg-muted-foreground"
603
+ };
604
+ var EdxAvatar = (props) => {
605
+ return /* @__PURE__ */ jsxs(Avatar, {
606
+ size: props.size ?? "default",
607
+ children: [
608
+ /* @__PURE__ */ jsx(AvatarImage, {
609
+ src: props.src,
610
+ alt: props.alt
611
+ }),
612
+ /* @__PURE__ */ jsx(AvatarFallback, { children: props.fallback ?? "" }),
613
+ props.status && /* @__PURE__ */ jsx(AvatarBadge, {
614
+ className: STATUS_CLASS[props.status],
615
+ role: "img",
616
+ "aria-label": `${props.status} status`
617
+ })
618
+ ]
619
+ });
620
+ };
621
+ var registerEdxAvatar = (ctx) => {
622
+ defineElement("edx-avatar", EdxAvatar, {
623
+ mode: ctx.mode,
624
+ styles: ctx.styles,
625
+ display: "inline-flex",
626
+ observedAttributes: [
627
+ "src",
628
+ "alt",
629
+ "fallback",
630
+ "size",
631
+ "status"
632
+ ],
633
+ transformProps: (raw) => ({
634
+ src: raw.src ?? void 0,
635
+ alt: raw.alt ?? void 0,
636
+ fallback: raw.fallback ?? void 0,
637
+ size: raw.size ?? void 0,
638
+ status: raw.status ?? void 0
639
+ })
640
+ });
641
+ };
642
+ //#endregion
643
+ //#region ../elements/src/edx-badge.tsx
644
+ var EdxBadge = (props) => {
645
+ return /* @__PURE__ */ jsx(Badge, {
646
+ variant: props.variant ?? "default",
647
+ size: props.size ?? "default",
648
+ children: /* @__PURE__ */ jsx(Slot, {})
649
+ });
650
+ };
651
+ var registerEdxBadge = (ctx) => {
652
+ defineElement("edx-badge", EdxBadge, {
653
+ mode: ctx.mode,
654
+ styles: ctx.styles,
655
+ display: "inline-flex",
656
+ observedAttributes: ["variant", "size"],
657
+ transformProps: (raw) => ({
658
+ variant: raw.variant ?? void 0,
659
+ size: raw.size ?? void 0
660
+ })
661
+ });
662
+ };
663
+ //#endregion
664
+ //#region ../elements/src/edx-breadcrumb.tsx
665
+ var EdxBreadcrumb = (props) => {
666
+ const items = props.items ?? [];
667
+ const nodes = [];
668
+ items.forEach((item, index) => {
669
+ nodes.push(/* @__PURE__ */ jsx(BreadcrumbItem, { children: item.current ? /* @__PURE__ */ jsx(BreadcrumbPage, { children: item.label }) : /* @__PURE__ */ jsx(BreadcrumbLink, {
670
+ href: item.href,
671
+ children: item.label
672
+ }) }, `item-${index}`));
673
+ if (index < items.length - 1) nodes.push(/* @__PURE__ */ jsx(BreadcrumbSeparator, {}, `sep-${index}`));
674
+ });
675
+ return /* @__PURE__ */ jsx(Breadcrumb, { children: /* @__PURE__ */ jsx(BreadcrumbList, { children: nodes }) });
676
+ };
677
+ var registerEdxBreadcrumb = (ctx) => {
678
+ defineElement("edx-breadcrumb", EdxBreadcrumb, {
679
+ mode: ctx.mode,
680
+ styles: ctx.styles,
681
+ observedAttributes: ["items"],
682
+ transformProps: (raw) => ({ items: coerceJson(raw.items) ?? [] })
683
+ });
684
+ };
685
+ //#endregion
686
+ //#region ../elements/src/edx-button.tsx
687
+ var EdxButton = (props) => {
688
+ const emit = useEmit();
689
+ return /* @__PURE__ */ jsx(Button, {
690
+ type: props.type ?? "button",
691
+ variant: props.variant ?? "default",
692
+ size: props.size ?? "default",
693
+ disabled: props.disabled ?? false,
694
+ "aria-label": props.ariaLabel,
695
+ "aria-description": props.ariaDescription,
696
+ name: props.name,
697
+ form: props.form,
698
+ value: props.value,
699
+ autoFocus: props.autofocus,
700
+ onClick: () => emit("edx-click"),
701
+ children: /* @__PURE__ */ jsx(Slot, {})
702
+ });
703
+ };
704
+ var registerEdxButton = (ctx) => {
705
+ defineElement("edx-button", EdxButton, {
706
+ mode: ctx.mode,
707
+ styles: ctx.styles,
708
+ display: "inline-flex",
709
+ observedAttributes: [
710
+ "variant",
711
+ "size",
712
+ "disabled",
713
+ "aria-label",
714
+ "aria-description",
715
+ "type",
716
+ "name",
717
+ "form",
718
+ "value",
719
+ "autofocus"
720
+ ],
721
+ transformProps: (raw) => ({
722
+ variant: raw.variant ?? void 0,
723
+ size: raw.size ?? void 0,
724
+ disabled: coerceBool(raw.disabled),
725
+ ariaLabel: raw["aria-label"] ?? void 0,
726
+ ariaDescription: raw["aria-description"] ?? void 0,
727
+ type: raw.type ?? void 0,
728
+ name: raw.name ?? void 0,
729
+ form: raw.form ?? void 0,
730
+ value: raw.value ?? void 0,
731
+ autofocus: coerceBool(raw.autofocus)
732
+ })
733
+ });
734
+ };
735
+ //#endregion
736
+ //#region ../elements/src/edx-button-group.tsx
737
+ var EdxButtonGroup = (props) => {
738
+ const { host } = useEdxHost();
739
+ const orientation = props.orientation ?? "horizontal";
740
+ useLayoutEffect(() => {
741
+ const managedButtons = /* @__PURE__ */ new Set();
742
+ const releaseButton = (button) => {
743
+ delete button.dataset.edxButtonGroupPosition;
744
+ button.style.removeProperty("margin-inline-start");
745
+ button.style.removeProperty("margin-block-start");
746
+ managedButtons.delete(button);
747
+ };
748
+ const updatePositions = () => {
749
+ const buttons = Array.from(host.children).filter((child) => child.matches("edx-button"));
750
+ const nextButtons = new Set(buttons);
751
+ for (const button of managedButtons) if (!nextButtons.has(button)) releaseButton(button);
752
+ for (const [index, button] of buttons.entries()) {
753
+ const position = index === 0 ? "first" : index === buttons.length - 1 ? "last" : "middle";
754
+ button.dataset.edxButtonGroupPosition = buttons.length === 1 ? "single" : `${orientation}-${position}`;
755
+ button.style.marginInlineStart = orientation === "horizontal" && index > 0 ? "-1px" : "";
756
+ button.style.marginBlockStart = orientation === "vertical" && index > 0 ? "-1px" : "";
757
+ managedButtons.add(button);
758
+ }
759
+ };
760
+ updatePositions();
761
+ const observer = new MutationObserver(updatePositions);
762
+ observer.observe(host, { childList: true });
763
+ return () => {
764
+ observer.disconnect();
765
+ for (const button of managedButtons) releaseButton(button);
766
+ };
767
+ }, [host, orientation]);
768
+ return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("style", { children: `
769
+ [data-slot='button-group'] > slot::slotted(edx-button) {
770
+ position: relative;
771
+ z-index: 0;
772
+ }
773
+ [data-slot='button-group'] > slot::slotted(edx-button:hover),
774
+ [data-slot='button-group'] > slot::slotted(edx-button:focus-within) {
775
+ z-index: 10;
776
+ }
777
+ ` }), /* @__PURE__ */ jsx(ButtonGroup, {
778
+ orientation,
779
+ children: /* @__PURE__ */ jsx(Slot, {})
780
+ })] });
781
+ };
782
+ var registerEdxButtonGroup = (ctx) => {
783
+ defineElement("edx-button-group", EdxButtonGroup, {
784
+ mode: "shadow",
785
+ styles: ctx.styles,
786
+ display: "inline-flex",
787
+ observedAttributes: ["orientation"],
788
+ transformProps: (raw) => ({ orientation: raw.orientation ?? void 0 })
789
+ });
790
+ };
791
+ //#endregion
792
+ //#region ../elements/src/edx-calendar.tsx
793
+ /**
794
+ * Parse a `YYYY-MM-DD` attribute into a local calendar date. Deliberately not
795
+ * `new Date(value)`: that parses date-only strings as UTC midnight, which shifts
796
+ * to the previous day once rendered in a negative-UTC-offset timezone.
797
+ */
798
+ var parseIsoDate = (value) => {
799
+ const match = value ? /^(\d{4})-(\d{2})-(\d{2})$/.exec(value) : null;
800
+ if (!match) return;
801
+ const [, year, month, day] = match;
802
+ return new Date(Number(year), Number(month) - 1, Number(day));
803
+ };
804
+ /** Format a local calendar date back to `YYYY-MM-DD`, no time/timezone component. */
805
+ var formatIsoDate = (date) => {
806
+ return `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, "0")}-${String(date.getDate()).padStart(2, "0")}`;
807
+ };
808
+ var EdxCalendar = (props) => {
809
+ const { emit, host } = useEdxHost();
810
+ const value = props.value ?? props.defaultValue;
811
+ const min = parseIsoDate(props.min);
812
+ const max = parseIsoDate(props.max);
813
+ const disabled = props.disabled ? true : [min ? { before: min } : null, max ? { after: max } : null].filter(Boolean);
814
+ return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Calendar, {
815
+ mode: "single",
816
+ required: props.required,
817
+ selected: parseIsoDate(value),
818
+ defaultMonth: parseIsoDate(value),
819
+ disabled,
820
+ startMonth: min,
821
+ endMonth: max,
822
+ numberOfMonths: props.numberOfMonths,
823
+ showOutsideDays: props.showOutsideDays,
824
+ fixedWeeks: props.fixedWeeks,
825
+ hideNavigation: props.hideNavigation,
826
+ weekStartsOn: props.weekStartsOn,
827
+ "aria-label": props.ariaLabel,
828
+ "aria-description": props.ariaDescription,
829
+ "aria-invalid": props.invalid || void 0,
830
+ onSelect: (date) => {
831
+ if (!date) return;
832
+ const iso = formatIsoDate(date);
833
+ host.removeAttribute("default-value");
834
+ host.setAttribute("value", iso);
835
+ emit("edx-change", { value: iso });
836
+ }
837
+ }), props.name ? /* @__PURE__ */ jsx("input", {
838
+ type: "hidden",
839
+ name: props.name,
840
+ form: props.form,
841
+ value: value ?? "",
842
+ disabled: props.disabled
843
+ }) : null] });
844
+ };
845
+ var registerEdxCalendar = (ctx) => {
846
+ defineElement("edx-calendar", EdxCalendar, {
847
+ mode: ctx.mode,
848
+ styles: ctx.styles,
849
+ display: "inline-flex",
850
+ delegateClick: true,
851
+ formAssociated: true,
852
+ formValue: (props) => props.value ?? props.defaultValue ?? "",
853
+ observedAttributes: [
854
+ "value",
855
+ "default-value",
856
+ "disabled",
857
+ "required",
858
+ "name",
859
+ "form",
860
+ "min",
861
+ "max",
862
+ "number-of-months",
863
+ "show-outside-days",
864
+ "fixed-weeks",
865
+ "hide-navigation",
866
+ "week-starts-on",
867
+ "aria-label",
868
+ "aria-description",
869
+ "invalid"
870
+ ],
871
+ transformProps: (raw) => ({
872
+ value: raw.value ?? void 0,
873
+ defaultValue: raw["default-value"] ?? void 0,
874
+ disabled: coerceBool(raw.disabled),
875
+ required: coerceBool(raw.required),
876
+ name: raw.name ?? void 0,
877
+ form: raw.form ?? void 0,
878
+ min: raw.min ?? void 0,
879
+ max: raw.max ?? void 0,
880
+ numberOfMonths: coerceNumber(raw["number-of-months"]),
881
+ showOutsideDays: raw["show-outside-days"] == null ? void 0 : coerceBool(raw["show-outside-days"]),
882
+ fixedWeeks: raw["fixed-weeks"] == null ? void 0 : coerceBool(raw["fixed-weeks"]),
883
+ hideNavigation: raw["hide-navigation"] == null ? void 0 : coerceBool(raw["hide-navigation"]),
884
+ weekStartsOn: coerceNumber(raw["week-starts-on"]),
885
+ ariaLabel: raw["aria-label"] ?? void 0,
886
+ ariaDescription: raw["aria-description"] ?? void 0,
887
+ invalid: coerceBool(raw.invalid)
888
+ }),
889
+ domProperties: { value: {
890
+ get: (host) => host.getAttribute("value") ?? host.getAttribute("default-value") ?? "",
891
+ set: (host, value) => {
892
+ host.setAttribute("value", String(value ?? ""));
893
+ }
894
+ } }
895
+ });
896
+ };
897
+ //#endregion
898
+ //#region ../elements/src/edx-card.tsx
899
+ var EdxCard = (props) => {
900
+ return /* @__PURE__ */ jsxs(Card, {
901
+ size: props.size,
902
+ children: [(props.heading || props.description) && /* @__PURE__ */ jsxs(CardHeader, { children: [props.heading && /* @__PURE__ */ jsx(CardTitle, { children: props.heading }), props.description && /* @__PURE__ */ jsx(CardDescription, { children: props.description })] }), /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(Slot, {}) })]
903
+ });
904
+ };
905
+ var registerEdxCard = (ctx) => {
906
+ defineElement("edx-card", EdxCard, {
907
+ mode: "shadow",
908
+ styles: ctx.styles,
909
+ observedAttributes: [
910
+ "heading",
911
+ "description",
912
+ "size"
913
+ ],
914
+ transformProps: (raw) => ({
915
+ heading: raw.heading ?? void 0,
916
+ description: raw.description ?? void 0,
917
+ size: raw.size ?? void 0
918
+ })
919
+ });
920
+ };
921
+ //#endregion
922
+ //#region ../elements/src/edx-checkbox.tsx
923
+ var EdxCheckbox = (props) => {
924
+ const { emit, host } = useEdxHost();
925
+ return /* @__PURE__ */ jsx(Checkbox, {
926
+ checked: props.checked ?? props.defaultChecked ?? false,
927
+ indeterminate: props.indeterminate ?? false,
928
+ disabled: props.disabled ?? false,
929
+ readOnly: props.readonly ?? false,
930
+ required: props.required ?? false,
931
+ name: props.name,
932
+ form: props.form,
933
+ value: props.value,
934
+ uncheckedValue: props.uncheckedValue,
935
+ "aria-invalid": props.invalid || void 0,
936
+ "aria-label": props.ariaLabel,
937
+ "aria-description": props.ariaDescription,
938
+ onCheckedChange: (next) => {
939
+ const checked = next === true;
940
+ host.removeAttribute("default-checked");
941
+ host.removeAttribute("indeterminate");
942
+ if (checked) host.setAttribute("checked", "true");
943
+ else host.removeAttribute("checked");
944
+ emit("edx-change", {
945
+ checked,
946
+ indeterminate: false
947
+ });
948
+ }
949
+ });
950
+ };
951
+ var registerEdxCheckbox = (ctx) => {
952
+ defineElement("edx-checkbox", EdxCheckbox, {
953
+ mode: ctx.mode,
954
+ styles: ctx.styles,
955
+ display: "inline-flex",
956
+ delegateClick: true,
957
+ formAssociated: true,
958
+ formValue: (props) => {
959
+ return props.checked ?? props.defaultChecked ?? false ? props.value ?? "on" : props.uncheckedValue ?? null;
960
+ },
961
+ observedAttributes: [
962
+ "checked",
963
+ "default-checked",
964
+ "indeterminate",
965
+ "disabled",
966
+ "readonly",
967
+ "required",
968
+ "name",
969
+ "form",
970
+ "value",
971
+ "unchecked-value",
972
+ "invalid",
973
+ "aria-label",
974
+ "aria-description"
975
+ ],
976
+ transformProps: (raw) => ({
977
+ checked: raw.checked == null ? void 0 : coerceBool(raw.checked),
978
+ defaultChecked: raw["default-checked"] == null ? void 0 : coerceBool(raw["default-checked"]),
979
+ indeterminate: coerceBool(raw.indeterminate),
980
+ disabled: coerceBool(raw.disabled),
981
+ readonly: coerceBool(raw.readonly),
982
+ required: coerceBool(raw.required),
983
+ name: raw.name ?? void 0,
984
+ form: raw.form ?? void 0,
985
+ value: raw.value ?? void 0,
986
+ uncheckedValue: raw["unchecked-value"] ?? void 0,
987
+ invalid: coerceBool(raw.invalid),
988
+ ariaLabel: raw["aria-label"] ?? void 0,
989
+ ariaDescription: raw["aria-description"] ?? void 0
990
+ }),
991
+ domProperties: {
992
+ checked: booleanDomProperty("checked", "default-checked"),
993
+ indeterminate: booleanDomProperty("indeterminate")
994
+ }
995
+ });
996
+ };
997
+ //#endregion
998
+ //#region ../elements/src/edx-combobox.tsx
999
+ var EdxCombobox = (props) => {
1000
+ const { emit, host } = useEdxHost();
1001
+ const portalContainer = usePortalContainer();
1002
+ const options = props.options ?? [];
1003
+ const selected = options.find((opt) => opt.value === props.value) ?? null;
1004
+ return /* @__PURE__ */ jsxs(Combobox, {
1005
+ items: options,
1006
+ itemToStringLabel: (item) => item.label,
1007
+ value: selected,
1008
+ inputValue: props.inputValue ?? "",
1009
+ disabled: props.disabled ?? false,
1010
+ readOnly: props.readonly ?? false,
1011
+ required: props.required ?? false,
1012
+ name: props.name,
1013
+ form: props.form,
1014
+ open: props.open ?? props.defaultOpen ?? false,
1015
+ modal: props.modal,
1016
+ openOnInputClick: props.openOnInputClick ?? true,
1017
+ autoHighlight: props.autoHighlight,
1018
+ highlightItemOnHover: props.highlightItemOnHover ?? true,
1019
+ onOpenChange: (open) => {
1020
+ host.removeAttribute("default-open");
1021
+ if (open) host.setAttribute("open", "true");
1022
+ else host.removeAttribute("open");
1023
+ emit("edx-open-change", { open });
1024
+ },
1025
+ onInputValueChange: (inputValue) => {
1026
+ host.setAttribute("input-value", inputValue);
1027
+ emit("edx-input-change", { value: inputValue });
1028
+ },
1029
+ onValueChange: (next) => {
1030
+ const val = next === null ? null : next.value;
1031
+ if (val != null) host.setAttribute("value", val);
1032
+ else host.removeAttribute("value");
1033
+ emit("edx-change", { value: val });
1034
+ },
1035
+ children: [/* @__PURE__ */ jsx(ComboboxInput, {
1036
+ placeholder: props.placeholder,
1037
+ "aria-label": props.ariaLabel,
1038
+ "aria-description": props.ariaDescription,
1039
+ "aria-invalid": props.invalid || void 0
1040
+ }), /* @__PURE__ */ jsx(ComboboxContent, {
1041
+ portalContainer: portalContainer ?? void 0,
1042
+ children: (item) => /* @__PURE__ */ jsx(ComboboxItem, {
1043
+ value: item,
1044
+ children: item.label
1045
+ }, item.value)
1046
+ })]
1047
+ });
1048
+ };
1049
+ var registerEdxCombobox = (ctx) => {
1050
+ defineElement("edx-combobox", EdxCombobox, {
1051
+ mode: ctx.mode,
1052
+ styles: ctx.styles,
1053
+ display: "block",
1054
+ delegateClick: true,
1055
+ formAssociated: true,
1056
+ formValue: (props) => props.value ?? "",
1057
+ observedAttributes: [
1058
+ "options",
1059
+ "value",
1060
+ "input-value",
1061
+ "placeholder",
1062
+ "disabled",
1063
+ "readonly",
1064
+ "required",
1065
+ "name",
1066
+ "form",
1067
+ "open",
1068
+ "default-open",
1069
+ "modal",
1070
+ "open-on-input-click",
1071
+ "auto-highlight",
1072
+ "highlight-item-on-hover",
1073
+ "aria-label",
1074
+ "aria-description",
1075
+ "invalid"
1076
+ ],
1077
+ transformProps: (raw) => ({
1078
+ options: coerceJson(raw.options),
1079
+ value: raw.value ?? null,
1080
+ inputValue: raw["input-value"] ?? void 0,
1081
+ placeholder: raw.placeholder ?? void 0,
1082
+ disabled: coerceBool(raw.disabled),
1083
+ readonly: coerceBool(raw.readonly),
1084
+ required: coerceBool(raw.required),
1085
+ name: raw.name ?? void 0,
1086
+ form: raw.form ?? void 0,
1087
+ open: raw.open == null ? void 0 : coerceBool(raw.open),
1088
+ defaultOpen: raw["default-open"] == null ? void 0 : coerceBool(raw["default-open"]),
1089
+ modal: raw.modal == null ? void 0 : coerceBool(raw.modal),
1090
+ openOnInputClick: raw["open-on-input-click"] == null ? void 0 : coerceBool(raw["open-on-input-click"]),
1091
+ autoHighlight: raw["auto-highlight"] == null ? void 0 : coerceBool(raw["auto-highlight"]),
1092
+ highlightItemOnHover: raw["highlight-item-on-hover"] == null ? void 0 : coerceBool(raw["highlight-item-on-hover"]),
1093
+ ariaLabel: raw["aria-label"] ?? void 0,
1094
+ ariaDescription: raw["aria-description"] ?? void 0,
1095
+ invalid: coerceBool(raw.invalid)
1096
+ }),
1097
+ domProperties: {
1098
+ value: {
1099
+ get: (host) => host.getAttribute("value") ?? "",
1100
+ set: (host, value) => {
1101
+ host.setAttribute("value", String(value ?? ""));
1102
+ }
1103
+ },
1104
+ inputValue: {
1105
+ get: (host) => host.getAttribute("input-value") ?? "",
1106
+ set: (host, value) => host.setAttribute("input-value", String(value ?? ""))
1107
+ },
1108
+ open: booleanDomProperty("open", "default-open")
1109
+ }
1110
+ });
1111
+ };
1112
+ //#endregion
1113
+ //#region ../elements/src/edx-content-components.tsx
1114
+ var EdxAspectRatio = ({ ratio = 16 / 9 }) => {
1115
+ return /* @__PURE__ */ jsx(AspectRatio, {
1116
+ ratio,
1117
+ className: "w-full overflow-hidden rounded-lg bg-muted",
1118
+ children: /* @__PURE__ */ jsx("div", {
1119
+ className: "flex size-full items-center justify-center text-sm text-foreground/70",
1120
+ children: /* @__PURE__ */ jsx(Slot, {})
1121
+ })
1122
+ });
1123
+ };
1124
+ var EdxAttachment = ({ title = "report.pdf", description = "2.4 MB", state = "done", size = "default", orientation = "horizontal" }) => {
1125
+ return /* @__PURE__ */ jsxs(Attachment, {
1126
+ state,
1127
+ size,
1128
+ orientation,
1129
+ children: [
1130
+ /* @__PURE__ */ jsx(AttachmentMedia, { children: state === "uploading" || state === "processing" ? /* @__PURE__ */ jsx(Spinner, {}) : /* @__PURE__ */ jsx(IconFile, {}) }),
1131
+ /* @__PURE__ */ jsxs(AttachmentContent, { children: [/* @__PURE__ */ jsx(AttachmentTitle, { children: title }), /* @__PURE__ */ jsx(AttachmentDescription, { children: description })] }),
1132
+ /* @__PURE__ */ jsx(Slot, {})
1133
+ ]
1134
+ });
1135
+ };
1136
+ var EdxBubble = ({ variant = "default", align = "start", content }) => {
1137
+ return /* @__PURE__ */ jsx(Bubble, {
1138
+ variant,
1139
+ align,
1140
+ children: /* @__PURE__ */ jsx(BubbleContent, { children: content ?? /* @__PURE__ */ jsx(Slot, {}) })
1141
+ });
1142
+ };
1143
+ var EdxEmpty = ({ title = "Nothing here yet", description = "Content will appear here when it is available." }) => {
1144
+ return /* @__PURE__ */ jsxs(Empty, { children: [/* @__PURE__ */ jsxs(EmptyHeader, { children: [
1145
+ /* @__PURE__ */ jsx(EmptyMedia, {
1146
+ variant: "icon",
1147
+ children: /* @__PURE__ */ jsx(IconInbox, {})
1148
+ }),
1149
+ /* @__PURE__ */ jsx(EmptyTitle, { children: title }),
1150
+ /* @__PURE__ */ jsx(EmptyDescription, { children: description })
1151
+ ] }), /* @__PURE__ */ jsx(Slot, {})] });
1152
+ };
1153
+ var EdxItem = ({ title = "Account settings", description = "Manage your profile and preferences.", variant = "outline", size = "default" }) => {
1154
+ return /* @__PURE__ */ jsxs(Item, {
1155
+ variant,
1156
+ size,
1157
+ children: [
1158
+ /* @__PURE__ */ jsx(ItemMedia, {
1159
+ variant: "icon",
1160
+ children: /* @__PURE__ */ jsx(IconFile, {})
1161
+ }),
1162
+ /* @__PURE__ */ jsxs(ItemContent, { children: [/* @__PURE__ */ jsx(ItemTitle, { children: title }), /* @__PURE__ */ jsx(ItemDescription, { children: description })] }),
1163
+ /* @__PURE__ */ jsx(Slot, {})
1164
+ ]
1165
+ });
1166
+ };
1167
+ var EdxKbd = ({ text }) => {
1168
+ return /* @__PURE__ */ jsx(Kbd, { children: text ?? /* @__PURE__ */ jsx(Slot, {}) });
1169
+ };
1170
+ var EdxMarker = ({ variant = "default", text }) => {
1171
+ return /* @__PURE__ */ jsx(Marker, {
1172
+ variant,
1173
+ children: /* @__PURE__ */ jsx(MarkerContent, { children: text ?? /* @__PURE__ */ jsx(Slot, {}) })
1174
+ });
1175
+ };
1176
+ var EdxMessage = ({ author = "Support", timestamp = "Now", align = "start", variant = "muted" }) => {
1177
+ return /* @__PURE__ */ jsx(Message, {
1178
+ align,
1179
+ children: /* @__PURE__ */ jsxs(MessageContent, { children: [
1180
+ /* @__PURE__ */ jsx(MessageHeader, { children: author }),
1181
+ /* @__PURE__ */ jsx(Bubble, {
1182
+ variant,
1183
+ align,
1184
+ children: /* @__PURE__ */ jsx(BubbleContent, { children: /* @__PURE__ */ jsx(Slot, {}) })
1185
+ }),
1186
+ /* @__PURE__ */ jsx(MessageFooter, { children: timestamp })
1187
+ ] })
1188
+ });
1189
+ };
1190
+ var EdxNativeSelect = ({ options = [], value, defaultValue, size = "default", disabled = false, name, form, required, autoComplete, ariaLabel = "Select an option", ariaDescription, invalid }) => {
1191
+ const emit = useEmit();
1192
+ const { host } = useEdxHost();
1193
+ const handleChange = (event) => {
1194
+ const nextValue = event.target.value;
1195
+ host.removeAttribute("default-value");
1196
+ host.setAttribute("value", nextValue);
1197
+ emit("edx-change", { value: nextValue });
1198
+ emit("edx-input", { value: nextValue });
1199
+ };
1200
+ return /* @__PURE__ */ jsx(NativeSelect, {
1201
+ value: value ?? defaultValue,
1202
+ size,
1203
+ disabled,
1204
+ name,
1205
+ form,
1206
+ required,
1207
+ autoComplete,
1208
+ "aria-label": ariaLabel,
1209
+ "aria-description": ariaDescription,
1210
+ "aria-invalid": invalid || void 0,
1211
+ onChange: handleChange,
1212
+ children: options.map((option) => /* @__PURE__ */ jsx(NativeSelectOption, {
1213
+ value: option.value,
1214
+ disabled: option.disabled,
1215
+ children: option.label
1216
+ }, option.value))
1217
+ });
1218
+ };
1219
+ var EdxSpinner = ({ size = "default", label = "Loading" }) => /* @__PURE__ */ jsx(Spinner, {
1220
+ size,
1221
+ "aria-label": label
1222
+ });
1223
+ var registerEdxContentComponents = (ctx) => {
1224
+ defineElement("edx-aspect-ratio", EdxAspectRatio, {
1225
+ mode: "shadow",
1226
+ styles: ctx.styles,
1227
+ observedAttributes: ["ratio"],
1228
+ transformProps: (raw) => ({ ratio: coerceNumber(raw.ratio) })
1229
+ });
1230
+ defineElement("edx-attachment", EdxAttachment, {
1231
+ mode: "shadow",
1232
+ styles: ctx.styles,
1233
+ display: "inline-flex",
1234
+ observedAttributes: [
1235
+ "title",
1236
+ "description",
1237
+ "state",
1238
+ "size",
1239
+ "orientation"
1240
+ ],
1241
+ transformProps: (raw) => ({
1242
+ title: raw.title ?? void 0,
1243
+ description: raw.description ?? void 0,
1244
+ state: raw.state ?? void 0,
1245
+ size: raw.size ?? void 0,
1246
+ orientation: raw.orientation ?? void 0
1247
+ })
1248
+ });
1249
+ defineElement("edx-bubble", EdxBubble, {
1250
+ mode: ctx.mode,
1251
+ styles: ctx.styles,
1252
+ display: "contents",
1253
+ observedAttributes: [
1254
+ "variant",
1255
+ "align",
1256
+ "content"
1257
+ ],
1258
+ transformProps: (raw) => ({
1259
+ variant: raw.variant ?? void 0,
1260
+ align: raw.align ?? void 0,
1261
+ content: raw.content ?? void 0
1262
+ })
1263
+ });
1264
+ defineElement("edx-empty", EdxEmpty, {
1265
+ mode: "shadow",
1266
+ styles: ctx.styles,
1267
+ observedAttributes: ["title", "description"],
1268
+ transformProps: (raw) => ({
1269
+ title: raw.title ?? void 0,
1270
+ description: raw.description ?? void 0
1271
+ })
1272
+ });
1273
+ defineElement("edx-item", EdxItem, {
1274
+ mode: "shadow",
1275
+ styles: ctx.styles,
1276
+ observedAttributes: [
1277
+ "title",
1278
+ "description",
1279
+ "variant",
1280
+ "size"
1281
+ ],
1282
+ transformProps: (raw) => ({
1283
+ title: raw.title ?? void 0,
1284
+ description: raw.description ?? void 0,
1285
+ variant: raw.variant ?? void 0,
1286
+ size: raw.size ?? void 0
1287
+ })
1288
+ });
1289
+ defineElement("edx-kbd", EdxKbd, {
1290
+ mode: ctx.mode,
1291
+ styles: ctx.styles,
1292
+ display: "inline-flex",
1293
+ observedAttributes: ["text"],
1294
+ transformProps: (raw) => ({ text: raw.text ?? void 0 })
1295
+ });
1296
+ defineElement("edx-marker", EdxMarker, {
1297
+ mode: ctx.mode,
1298
+ styles: ctx.styles,
1299
+ display: "flex",
1300
+ observedAttributes: ["variant", "text"],
1301
+ transformProps: (raw) => ({
1302
+ variant: raw.variant ?? void 0,
1303
+ text: raw.text ?? void 0
1304
+ })
1305
+ });
1306
+ defineElement("edx-message", EdxMessage, {
1307
+ mode: "shadow",
1308
+ styles: ctx.styles,
1309
+ observedAttributes: [
1310
+ "author",
1311
+ "timestamp",
1312
+ "align",
1313
+ "variant"
1314
+ ],
1315
+ transformProps: (raw) => ({
1316
+ author: raw.author ?? void 0,
1317
+ timestamp: raw.timestamp ?? void 0,
1318
+ align: raw.align ?? void 0,
1319
+ variant: raw.variant ?? void 0
1320
+ })
1321
+ });
1322
+ defineElement("edx-native-select", EdxNativeSelect, {
1323
+ mode: ctx.mode,
1324
+ styles: ctx.styles,
1325
+ display: "inline-flex",
1326
+ observedAttributes: [
1327
+ "options",
1328
+ "value",
1329
+ "default-value",
1330
+ "size",
1331
+ "disabled",
1332
+ "name",
1333
+ "form",
1334
+ "required",
1335
+ "autocomplete",
1336
+ "aria-label",
1337
+ "aria-description",
1338
+ "invalid"
1339
+ ],
1340
+ formAssociated: true,
1341
+ formValue: (props) => props.value ?? props.defaultValue ?? "",
1342
+ delegateClick: true,
1343
+ transformProps: (raw) => ({
1344
+ options: coerceJson(raw.options),
1345
+ value: raw.value ?? void 0,
1346
+ defaultValue: raw["default-value"] ?? void 0,
1347
+ size: raw.size ?? void 0,
1348
+ disabled: coerceBool(raw.disabled),
1349
+ name: raw.name ?? void 0,
1350
+ form: raw.form ?? void 0,
1351
+ required: coerceBool(raw.required),
1352
+ autoComplete: raw.autocomplete ?? void 0,
1353
+ ariaLabel: raw["aria-label"] ?? void 0,
1354
+ ariaDescription: raw["aria-description"] ?? void 0,
1355
+ invalid: coerceBool(raw.invalid)
1356
+ }),
1357
+ domProperties: { value: {
1358
+ get: (host) => host.getAttribute("value") ?? host.getAttribute("default-value") ?? "",
1359
+ set: (host, value) => host.setAttribute("value", String(value ?? ""))
1360
+ } }
1361
+ });
1362
+ defineElement("edx-spinner", EdxSpinner, {
1363
+ mode: ctx.mode,
1364
+ styles: ctx.styles,
1365
+ display: "inline-flex",
1366
+ observedAttributes: ["size", "label"],
1367
+ transformProps: (raw) => ({
1368
+ size: raw.size ?? void 0,
1369
+ label: raw.label ?? void 0
1370
+ })
1371
+ });
1372
+ };
1373
+ //#endregion
1374
+ //#region ../elements/src/edx-dialog.tsx
1375
+ /**
1376
+ * Overlay/portal proof, and the template every class-4 overlay copies. Overlays
1377
+ * are pinned to **light mode**: Base UI's DialogContent/Portal always lands in
1378
+ * document.body and does not forward a portal `container`, so under shadow mode
1379
+ * the portaled content escapes the shadow root, loses the adopted stylesheet, and
1380
+ * renders unstyled with no error. Pinning `mode: 'light'` (not `ctx.mode`) makes
1381
+ * that footgun impossible to inherit by mistake. See docs/delivery-classes.md.
1382
+ */
1383
+ var EdxDialog = (props) => {
1384
+ const { emit, host } = useEdxHost();
1385
+ return /* @__PURE__ */ jsxs(Dialog, {
1386
+ open: props.open ?? props.defaultOpen ?? false,
1387
+ modal: props.modal ?? true,
1388
+ disablePointerDismissal: props.disablePointerDismissal,
1389
+ onOpenChange: (open) => {
1390
+ host.removeAttribute("default-open");
1391
+ reflectBool(host, "open", open);
1392
+ emit("edx-change", { open });
1393
+ },
1394
+ children: [/* @__PURE__ */ jsx(DialogTrigger, {
1395
+ render: /* @__PURE__ */ jsx(Button, { variant: "outline" }),
1396
+ children: props.triggerLabel ?? "Open"
1397
+ }), /* @__PURE__ */ jsxs(DialogContent, { children: [
1398
+ (props.heading || props.description) && /* @__PURE__ */ jsxs(DialogHeader, { children: [props.heading && /* @__PURE__ */ jsx(DialogTitle, { children: props.heading }), props.description && /* @__PURE__ */ jsx(DialogDescription, { children: props.description })] }),
1399
+ /* @__PURE__ */ jsx(Slot, {}),
1400
+ /* @__PURE__ */ jsx(DialogFooter, { showCloseButton: true })
1401
+ ] })]
1402
+ });
1403
+ };
1404
+ var registerEdxDialog = (ctx) => {
1405
+ registerOverlayElement("edx-dialog", EdxDialog, ctx, {
1406
+ display: "inline-flex",
1407
+ observedAttributes: [
1408
+ "trigger-label",
1409
+ "heading",
1410
+ "description",
1411
+ "open",
1412
+ "default-open",
1413
+ "modal",
1414
+ "disable-pointer-dismissal"
1415
+ ],
1416
+ transformProps: (raw) => ({
1417
+ triggerLabel: raw["trigger-label"] ?? void 0,
1418
+ heading: raw.heading ?? void 0,
1419
+ description: raw.description ?? void 0,
1420
+ open: raw.open == null ? void 0 : coerceBool(raw.open),
1421
+ defaultOpen: raw["default-open"] == null ? void 0 : coerceBool(raw["default-open"]),
1422
+ modal: raw.modal == null ? void 0 : coerceBool(raw.modal),
1423
+ disablePointerDismissal: raw["disable-pointer-dismissal"] == null ? void 0 : coerceBool(raw["disable-pointer-dismissal"])
1424
+ }),
1425
+ domProperties: { open: booleanDomProperty("open", "default-open") }
1426
+ });
1427
+ };
1428
+ //#endregion
1429
+ //#region ../elements/src/edx-drawer.tsx
1430
+ /**
1431
+ * Side-anchored overlay, the same light-mode pattern as edx-dialog (registered via
1432
+ * registerOverlayElement, which pins mode:'light' so the Base UI portal can land
1433
+ * in document.body). Content is attribute-driven (trigger-label/heading/description
1434
+ * + an optional static slot); `side` chooses the edge.
1435
+ */
1436
+ var EdxDrawer = (props) => {
1437
+ const { emit, host } = useEdxHost();
1438
+ return /* @__PURE__ */ jsxs(Drawer, {
1439
+ open: props.open ?? props.defaultOpen ?? false,
1440
+ modal: props.modal ?? true,
1441
+ disablePointerDismissal: props.disablePointerDismissal,
1442
+ onOpenChange: (open) => {
1443
+ host.removeAttribute("default-open");
1444
+ reflectBool(host, "open", open);
1445
+ emit("edx-change", { open });
1446
+ },
1447
+ children: [/* @__PURE__ */ jsx(DrawerTrigger, {
1448
+ render: /* @__PURE__ */ jsx(Button, { variant: "outline" }),
1449
+ children: props.triggerLabel ?? "Open"
1450
+ }), /* @__PURE__ */ jsxs(DrawerContent, {
1451
+ side: props.side ?? "right",
1452
+ children: [(props.heading || props.description) && /* @__PURE__ */ jsxs(DrawerHeader, { children: [props.heading && /* @__PURE__ */ jsx(DrawerTitle, { children: props.heading }), props.description && /* @__PURE__ */ jsx(DrawerDescription, { children: props.description })] }), /* @__PURE__ */ jsx(Slot, {})]
1453
+ })]
1454
+ });
1455
+ };
1456
+ var registerEdxDrawer = (ctx) => {
1457
+ registerOverlayElement("edx-drawer", EdxDrawer, ctx, {
1458
+ display: "inline-flex",
1459
+ observedAttributes: [
1460
+ "trigger-label",
1461
+ "heading",
1462
+ "description",
1463
+ "side",
1464
+ "open",
1465
+ "default-open",
1466
+ "modal",
1467
+ "disable-pointer-dismissal"
1468
+ ],
1469
+ transformProps: (raw) => ({
1470
+ triggerLabel: raw["trigger-label"] ?? void 0,
1471
+ heading: raw.heading ?? void 0,
1472
+ description: raw.description ?? void 0,
1473
+ side: raw.side ?? void 0,
1474
+ open: raw.open == null ? void 0 : coerceBool(raw.open),
1475
+ defaultOpen: raw["default-open"] == null ? void 0 : coerceBool(raw["default-open"]),
1476
+ modal: raw.modal == null ? void 0 : coerceBool(raw.modal),
1477
+ disablePointerDismissal: raw["disable-pointer-dismissal"] == null ? void 0 : coerceBool(raw["disable-pointer-dismissal"])
1478
+ }),
1479
+ domProperties: { open: booleanDomProperty("open", "default-open") }
1480
+ });
1481
+ };
1482
+ //#endregion
1483
+ //#region ../elements/src/edx-dropdown-menu.tsx
1484
+ /**
1485
+ * Action-menu overlay, the same light-mode pattern as edx-dialog (registered via
1486
+ * registerOverlayElement, which pins mode:'light' so the Base UI portal can land
1487
+ * in document.body). Content is attribute-driven (no `<Slot />`): the menu items
1488
+ * come in as a JSON `items` attribute, the same JSON-attribute shape as edx-table.
1489
+ */
1490
+ var EdxDropdownMenu = (props) => {
1491
+ const { emit, host } = useEdxHost();
1492
+ const items = props.items ?? [];
1493
+ return /* @__PURE__ */ jsxs(DropdownMenu, {
1494
+ open: props.open ?? props.defaultOpen ?? false,
1495
+ modal: props.modal ?? true,
1496
+ disabled: props.disabled,
1497
+ loopFocus: props.loopFocus ?? true,
1498
+ highlightItemOnHover: props.highlightItemOnHover ?? true,
1499
+ onOpenChange: (open) => {
1500
+ host.removeAttribute("default-open");
1501
+ reflectBool(host, "open", open);
1502
+ emit("edx-change", { open });
1503
+ },
1504
+ children: [/* @__PURE__ */ jsx(DropdownMenuTrigger, {
1505
+ render: /* @__PURE__ */ jsx(Button, { variant: "outline" }),
1506
+ disabled: props.disabled,
1507
+ children: props.triggerLabel ?? "Open"
1508
+ }), /* @__PURE__ */ jsx(DropdownMenuContent, {
1509
+ side: props.side,
1510
+ align: props.align,
1511
+ sideOffset: props.sideOffset,
1512
+ alignOffset: props.alignOffset,
1513
+ children: /* @__PURE__ */ jsxs(DropdownMenuGroup, { children: [props.label && /* @__PURE__ */ jsx(DropdownMenuLabel, { children: props.label }), items.map((item) => /* @__PURE__ */ jsx(DropdownMenuItem, {
1514
+ disabled: item.disabled,
1515
+ onClick: () => emit("edx-select", { value: item.value ?? item.label }),
1516
+ children: item.label
1517
+ }, `${item.value ?? item.label}-${item.label}`))] })
1518
+ })]
1519
+ });
1520
+ };
1521
+ var registerEdxDropdownMenu = (ctx) => {
1522
+ registerOverlayElement("edx-dropdown-menu", EdxDropdownMenu, ctx, {
1523
+ display: "inline-flex",
1524
+ observedAttributes: [
1525
+ "trigger-label",
1526
+ "label",
1527
+ "items",
1528
+ "open",
1529
+ "default-open",
1530
+ "modal",
1531
+ "disabled",
1532
+ "loop-focus",
1533
+ "highlight-item-on-hover",
1534
+ "side",
1535
+ "align",
1536
+ "side-offset",
1537
+ "align-offset"
1538
+ ],
1539
+ transformProps: (raw) => ({
1540
+ triggerLabel: raw["trigger-label"] ?? void 0,
1541
+ label: raw.label ?? void 0,
1542
+ items: coerceJson(raw.items) ?? [],
1543
+ open: raw.open == null ? void 0 : coerceBool(raw.open),
1544
+ defaultOpen: raw["default-open"] == null ? void 0 : coerceBool(raw["default-open"]),
1545
+ modal: raw.modal == null ? void 0 : coerceBool(raw.modal),
1546
+ disabled: raw.disabled == null ? void 0 : coerceBool(raw.disabled),
1547
+ loopFocus: raw["loop-focus"] == null ? void 0 : coerceBool(raw["loop-focus"]),
1548
+ highlightItemOnHover: raw["highlight-item-on-hover"] == null ? void 0 : coerceBool(raw["highlight-item-on-hover"]),
1549
+ side: raw.side ?? void 0,
1550
+ align: raw.align ?? void 0,
1551
+ sideOffset: coerceNumber(raw["side-offset"]),
1552
+ alignOffset: coerceNumber(raw["align-offset"])
1553
+ }),
1554
+ domProperties: { open: booleanDomProperty("open", "default-open") }
1555
+ });
1556
+ };
1557
+ //#endregion
1558
+ //#region ../elements/src/field-control-bridge.ts
1559
+ var FIELD_CONTROL_SELECTOR = "edx-calendar, edx-checkbox, edx-combobox, edx-input, edx-input-group, edx-input-otp, edx-native-select, edx-radio-group, edx-select, edx-slider, edx-switch, edx-textarea, edx-toggle-group";
1560
+ var OWNED_ATTRIBUTES = [
1561
+ ["aria-label", "edxFieldLabel"],
1562
+ ["aria-description", "edxFieldDescription"],
1563
+ ["invalid", "edxFieldInvalid"]
1564
+ ];
1565
+ var findControls = (root) => Array.from(root.querySelectorAll(FIELD_CONTROL_SELECTOR));
1566
+ var releaseFieldAttributes = (control) => {
1567
+ for (const [attribute, ownershipKey] of OWNED_ATTRIBUTES) if (control.dataset[ownershipKey] === "true") {
1568
+ control.removeAttribute(attribute);
1569
+ delete control.dataset[ownershipKey];
1570
+ }
1571
+ };
1572
+ var setFieldAttribute = (control, attribute, ownershipKey, value) => {
1573
+ const isFieldOwned = control.dataset[ownershipKey] === "true";
1574
+ if (value !== void 0) {
1575
+ if (!control.hasAttribute(attribute) || isFieldOwned) {
1576
+ control.setAttribute(attribute, value);
1577
+ control.dataset[ownershipKey] = "true";
1578
+ }
1579
+ return;
1580
+ }
1581
+ if (isFieldOwned) {
1582
+ control.removeAttribute(attribute);
1583
+ delete control.dataset[ownershipKey];
1584
+ }
1585
+ };
1586
+ var syncFieldAttributes = (control, context) => {
1587
+ setFieldAttribute(control, "aria-label", "edxFieldLabel", context.label);
1588
+ setFieldAttribute(control, "aria-description", "edxFieldDescription", context.description || void 0);
1589
+ setFieldAttribute(control, "invalid", "edxFieldInvalid", context.invalid ? "true" : void 0);
1590
+ };
1591
+ var useFieldControlBridge = (host, context) => {
1592
+ const { description, invalid, label } = context;
1593
+ const refContext = useRef(context);
1594
+ const refControls = useRef(/* @__PURE__ */ new Set());
1595
+ refContext.current = {
1596
+ description,
1597
+ invalid,
1598
+ label
1599
+ };
1600
+ const registerControl = useCallback((control) => {
1601
+ refControls.current.add(control);
1602
+ syncFieldAttributes(control, refContext.current);
1603
+ }, []);
1604
+ const syncControls = useCallback(() => {
1605
+ const controls = new Set(findControls(host));
1606
+ for (const control of refControls.current) if (!controls.has(control)) releaseFieldAttributes(control);
1607
+ for (const control of controls) registerControl(control);
1608
+ refControls.current = controls;
1609
+ }, [host, registerControl]);
1610
+ useEffect(() => {
1611
+ for (const control of refControls.current) syncFieldAttributes(control, {
1612
+ description,
1613
+ invalid,
1614
+ label
1615
+ });
1616
+ }, [
1617
+ description,
1618
+ invalid,
1619
+ label
1620
+ ]);
1621
+ useLayoutEffect(() => {
1622
+ const handleControlConnect = (event) => {
1623
+ const registrationEvent = event;
1624
+ const { control, setCleanup } = registrationEvent.detail;
1625
+ if (!host.contains(control)) return;
1626
+ registrationEvent.stopPropagation();
1627
+ registerControl(control);
1628
+ setCleanup(() => {
1629
+ if (refControls.current.delete(control)) releaseFieldAttributes(control);
1630
+ });
1631
+ };
1632
+ host.addEventListener(EDX_FIELD_CONTROL_CONNECT_EVENT, handleControlConnect);
1633
+ const slot = host.shadowRoot?.querySelector("slot");
1634
+ slot?.addEventListener("slotchange", syncControls);
1635
+ syncControls();
1636
+ return () => {
1637
+ host.removeEventListener(EDX_FIELD_CONTROL_CONNECT_EVENT, handleControlConnect);
1638
+ slot?.removeEventListener("slotchange", syncControls);
1639
+ for (const control of refControls.current) releaseFieldAttributes(control);
1640
+ refControls.current.clear();
1641
+ };
1642
+ }, [
1643
+ host,
1644
+ registerControl,
1645
+ syncControls
1646
+ ]);
1647
+ return useCallback(() => {
1648
+ const control = host.querySelector(FIELD_CONTROL_SELECTOR);
1649
+ control?.focus();
1650
+ if (control?.matches("edx-checkbox, edx-switch")) control.click();
1651
+ }, [host]);
1652
+ };
1653
+ //#endregion
1654
+ //#region ../elements/src/edx-field.tsx
1655
+ var EdxField = (props) => {
1656
+ const { host } = useEdxHost();
1657
+ const accessibleDescription = [props.description, props.invalid ? props.error : void 0].filter(Boolean).join(" ");
1658
+ const focusControl = useFieldControlBridge(host, {
1659
+ label: props.label,
1660
+ description: accessibleDescription,
1661
+ invalid: props.invalid ?? false
1662
+ });
1663
+ return /* @__PURE__ */ jsxs(Field, {
1664
+ invalid: props.invalid ?? false,
1665
+ children: [
1666
+ props.label && /* @__PURE__ */ jsx(FieldLabel, {
1667
+ onClick: focusControl,
1668
+ children: props.label
1669
+ }),
1670
+ /* @__PURE__ */ jsx(Slot, {}),
1671
+ props.description && /* @__PURE__ */ jsx(FieldDescription, { children: props.description }),
1672
+ props.invalid && props.error && /* @__PURE__ */ jsx(FieldError, { children: props.error })
1673
+ ]
1674
+ });
1675
+ };
1676
+ var registerEdxField = (ctx) => {
1677
+ defineElement("edx-field", EdxField, {
1678
+ mode: "shadow",
1679
+ styles: ctx.styles,
1680
+ observedAttributes: [
1681
+ "label",
1682
+ "description",
1683
+ "error",
1684
+ "invalid"
1685
+ ],
1686
+ transformProps: (raw) => ({
1687
+ label: raw.label ?? void 0,
1688
+ description: raw.description ?? void 0,
1689
+ error: raw.error ?? void 0,
1690
+ invalid: coerceBool(raw.invalid)
1691
+ })
1692
+ });
1693
+ };
1694
+ //#endregion
1695
+ //#region ../elements/src/edx-indicator.tsx
1696
+ var EdxIndicator = (props) => {
1697
+ return /* @__PURE__ */ jsx(Indicator, {
1698
+ variant: props.variant ?? "default",
1699
+ side: props.side ?? "top",
1700
+ align: props.align ?? "end",
1701
+ children: /* @__PURE__ */ jsx(Slot, {})
1702
+ });
1703
+ };
1704
+ var registerEdxIndicator = (ctx) => {
1705
+ defineElement("edx-indicator", EdxIndicator, {
1706
+ mode: ctx.mode,
1707
+ styles: ctx.styles,
1708
+ display: "inline-flex",
1709
+ observedAttributes: [
1710
+ "variant",
1711
+ "side",
1712
+ "align"
1713
+ ],
1714
+ transformProps: (raw) => ({
1715
+ variant: raw.variant ?? void 0,
1716
+ side: raw.side ?? void 0,
1717
+ align: raw.align ?? void 0
1718
+ })
1719
+ });
1720
+ };
1721
+ //#endregion
1722
+ //#region ../elements/src/edx-input.tsx
1723
+ var EdxInput = (props) => {
1724
+ const { emit, host, setFormValue } = useEdxHost();
1725
+ const isFileInput = props.type === "file";
1726
+ return /* @__PURE__ */ jsx(Input, {
1727
+ type: props.type ?? "text",
1728
+ value: isFileInput ? void 0 : props.value ?? "",
1729
+ placeholder: props.placeholder,
1730
+ disabled: props.disabled ?? false,
1731
+ readOnly: props.readonly ?? false,
1732
+ "aria-invalid": props.invalid || void 0,
1733
+ name: props.name,
1734
+ form: props.form,
1735
+ required: props.required ?? false,
1736
+ autoComplete: props.autoComplete,
1737
+ inputMode: props.inputMode,
1738
+ min: props.min,
1739
+ max: props.max,
1740
+ step: props.step,
1741
+ minLength: props.minLength,
1742
+ maxLength: props.maxLength,
1743
+ pattern: props.pattern,
1744
+ accept: props.accept,
1745
+ multiple: props.multiple ?? false,
1746
+ spellCheck: props.spellCheck,
1747
+ autoFocus: props.autoFocus,
1748
+ "aria-label": props.ariaLabel,
1749
+ "aria-description": props.ariaDescription,
1750
+ onChange: (event) => {
1751
+ const { value } = event.target;
1752
+ host.setAttribute("value", value);
1753
+ if (isFileInput) {
1754
+ const files = Array.from(event.target.files ?? []);
1755
+ setFormValue(props.multiple ? multipleFormValue(host, files) : files[0] ?? null);
1756
+ }
1757
+ emit("edx-change", {
1758
+ value,
1759
+ files: event.target.files ? Array.from(event.target.files) : void 0
1760
+ });
1761
+ }
1762
+ });
1763
+ };
1764
+ var registerEdxInput = (ctx) => {
1765
+ defineElement("edx-input", EdxInput, {
1766
+ mode: ctx.mode,
1767
+ styles: ctx.styles,
1768
+ display: "block",
1769
+ delegateClick: true,
1770
+ formAssociated: true,
1771
+ formValue: (props) => props.type === "file" ? null : props.value ?? "",
1772
+ observedAttributes: [
1773
+ "value",
1774
+ "placeholder",
1775
+ "type",
1776
+ "disabled",
1777
+ "readonly",
1778
+ "invalid",
1779
+ "name",
1780
+ "form",
1781
+ "required",
1782
+ "autocomplete",
1783
+ "inputmode",
1784
+ "min",
1785
+ "max",
1786
+ "step",
1787
+ "minlength",
1788
+ "maxlength",
1789
+ "pattern",
1790
+ "accept",
1791
+ "multiple",
1792
+ "spellcheck",
1793
+ "autofocus",
1794
+ "aria-label",
1795
+ "aria-description"
1796
+ ],
1797
+ transformProps: (raw) => ({
1798
+ value: raw.value ?? void 0,
1799
+ placeholder: raw.placeholder ?? void 0,
1800
+ type: raw.type ?? void 0,
1801
+ disabled: coerceBool(raw.disabled),
1802
+ readonly: coerceBool(raw.readonly),
1803
+ invalid: coerceBool(raw.invalid),
1804
+ name: raw.name ?? void 0,
1805
+ form: raw.form ?? void 0,
1806
+ required: coerceBool(raw.required),
1807
+ autoComplete: raw.autocomplete ?? void 0,
1808
+ inputMode: raw.inputmode ?? void 0,
1809
+ min: raw.min ?? void 0,
1810
+ max: raw.max ?? void 0,
1811
+ step: raw.step ?? void 0,
1812
+ minLength: coerceNumber(raw.minlength),
1813
+ maxLength: coerceNumber(raw.maxlength),
1814
+ pattern: raw.pattern ?? void 0,
1815
+ accept: raw.accept ?? void 0,
1816
+ multiple: coerceBool(raw.multiple),
1817
+ spellCheck: raw.spellcheck == null ? void 0 : coerceBool(raw.spellcheck),
1818
+ autoFocus: coerceBool(raw.autofocus),
1819
+ ariaLabel: raw["aria-label"] ?? void 0,
1820
+ ariaDescription: raw["aria-description"] ?? void 0
1821
+ }),
1822
+ domProperties: { value: {
1823
+ get: (host) => host.getAttribute("value") ?? "",
1824
+ set: (host, value) => {
1825
+ host.setAttribute("value", String(value ?? ""));
1826
+ }
1827
+ } }
1828
+ });
1829
+ };
1830
+ //#endregion
1831
+ //#region ../elements/src/edx-input-group.tsx
1832
+ var EdxInputGroup = (props) => {
1833
+ const { emit, host, setFormValue } = useEdxHost();
1834
+ return /* @__PURE__ */ jsxs(InputGroup, {
1835
+ "data-disabled": props.disabled || void 0,
1836
+ "aria-disabled": props.disabled || void 0,
1837
+ children: [
1838
+ (props.prefix ?? props.addon) && /* @__PURE__ */ jsx(InputGroupAddon, { children: props.prefix ?? props.addon }),
1839
+ /* @__PURE__ */ jsx(InputGroupInput, {
1840
+ type: props.type,
1841
+ name: props.name,
1842
+ form: props.form,
1843
+ value: props.type === "file" ? void 0 : props.value ?? "",
1844
+ placeholder: props.placeholder,
1845
+ disabled: props.disabled ?? false,
1846
+ readOnly: props.readonly ?? false,
1847
+ required: props.required ?? false,
1848
+ autoComplete: props.autoComplete,
1849
+ inputMode: props.inputMode,
1850
+ min: props.min,
1851
+ max: props.max,
1852
+ step: props.step,
1853
+ minLength: props.minLength,
1854
+ maxLength: props.maxLength,
1855
+ pattern: props.pattern,
1856
+ accept: props.accept,
1857
+ multiple: props.multiple,
1858
+ spellCheck: props.spellCheck,
1859
+ autoFocus: props.autofocus,
1860
+ "aria-invalid": props.invalid || void 0,
1861
+ "aria-label": props.ariaLabel,
1862
+ "aria-description": props.ariaDescription,
1863
+ onChange: (event) => {
1864
+ const { value } = event.target;
1865
+ host.setAttribute("value", value);
1866
+ const files = event.target.files ? Array.from(event.target.files) : void 0;
1867
+ if (props.type === "file") setFormValue(props.multiple ? multipleFormValue(host, files ?? []) : files?.[0] ?? null);
1868
+ emit("edx-change", {
1869
+ value,
1870
+ files
1871
+ });
1872
+ }
1873
+ }),
1874
+ props.suffix && /* @__PURE__ */ jsx(InputGroupAddon, {
1875
+ align: "inline-end",
1876
+ children: props.suffix
1877
+ }),
1878
+ props.actionLabel && /* @__PURE__ */ jsx(InputGroupAddon, {
1879
+ align: "inline-end",
1880
+ children: /* @__PURE__ */ jsx(InputGroupButton, {
1881
+ onClick: () => emit("edx-action"),
1882
+ children: props.actionLabel
1883
+ })
1884
+ })
1885
+ ]
1886
+ });
1887
+ };
1888
+ var registerEdxInputGroup = (ctx) => {
1889
+ defineElement("edx-input-group", EdxInputGroup, {
1890
+ mode: ctx.mode,
1891
+ styles: ctx.styles,
1892
+ delegateClick: true,
1893
+ formAssociated: true,
1894
+ formValue: (props) => props.type === "file" ? null : props.value ?? "",
1895
+ observedAttributes: [
1896
+ "addon",
1897
+ "prefix",
1898
+ "suffix",
1899
+ "action-label",
1900
+ "placeholder",
1901
+ "value",
1902
+ "disabled",
1903
+ "readonly",
1904
+ "invalid",
1905
+ "type",
1906
+ "name",
1907
+ "form",
1908
+ "required",
1909
+ "autocomplete",
1910
+ "inputmode",
1911
+ "min",
1912
+ "max",
1913
+ "step",
1914
+ "minlength",
1915
+ "maxlength",
1916
+ "pattern",
1917
+ "accept",
1918
+ "multiple",
1919
+ "spellcheck",
1920
+ "autofocus",
1921
+ "aria-label",
1922
+ "aria-description"
1923
+ ],
1924
+ transformProps: (raw) => ({
1925
+ addon: raw.addon ?? void 0,
1926
+ prefix: raw.prefix ?? void 0,
1927
+ suffix: raw.suffix ?? void 0,
1928
+ actionLabel: raw["action-label"] ?? void 0,
1929
+ placeholder: raw.placeholder ?? void 0,
1930
+ value: raw.value ?? void 0,
1931
+ disabled: coerceBool(raw.disabled),
1932
+ readonly: coerceBool(raw.readonly),
1933
+ invalid: coerceBool(raw.invalid),
1934
+ type: raw.type ?? void 0,
1935
+ name: raw.name ?? void 0,
1936
+ form: raw.form ?? void 0,
1937
+ required: coerceBool(raw.required),
1938
+ autoComplete: raw.autocomplete ?? void 0,
1939
+ inputMode: raw.inputmode ?? void 0,
1940
+ min: raw.min ?? void 0,
1941
+ max: raw.max ?? void 0,
1942
+ step: raw.step ?? void 0,
1943
+ minLength: raw.minlength == null ? void 0 : Number(raw.minlength),
1944
+ maxLength: raw.maxlength == null ? void 0 : Number(raw.maxlength),
1945
+ pattern: raw.pattern ?? void 0,
1946
+ accept: raw.accept ?? void 0,
1947
+ multiple: coerceBool(raw.multiple),
1948
+ spellCheck: raw.spellcheck == null ? void 0 : coerceBool(raw.spellcheck),
1949
+ autofocus: coerceBool(raw.autofocus),
1950
+ ariaLabel: raw["aria-label"] ?? void 0,
1951
+ ariaDescription: raw["aria-description"] ?? void 0
1952
+ }),
1953
+ domProperties: { value: {
1954
+ get: (host) => host.getAttribute("value") ?? "",
1955
+ set: (host, value) => {
1956
+ host.setAttribute("value", String(value ?? ""));
1957
+ }
1958
+ } }
1959
+ });
1960
+ };
1961
+ //#endregion
1962
+ //#region ../elements/src/edx-input-otp.tsx
1963
+ var buildSlots = (props, length, value, onValueChange, onComplete) => {
1964
+ const inputProps = {
1965
+ maxLength: length,
1966
+ value,
1967
+ disabled: props.disabled ?? false,
1968
+ readOnly: props.readonly ?? false,
1969
+ required: props.required ?? false,
1970
+ name: props.name,
1971
+ form: props.form,
1972
+ autoComplete: props.autoComplete,
1973
+ inputMode: props.inputMode,
1974
+ pattern: props.pattern,
1975
+ "aria-invalid": props.invalid || void 0,
1976
+ "aria-label": props.ariaLabel,
1977
+ "aria-description": props.ariaDescription,
1978
+ onChange: onValueChange,
1979
+ onComplete
1980
+ };
1981
+ if (length === 6) return /* @__PURE__ */ jsxs(InputOTP, {
1982
+ ...inputProps,
1983
+ children: [
1984
+ /* @__PURE__ */ jsxs(InputOTPGroup, { children: [
1985
+ /* @__PURE__ */ jsx(InputOTPSlot, { index: 0 }),
1986
+ /* @__PURE__ */ jsx(InputOTPSlot, { index: 1 }),
1987
+ /* @__PURE__ */ jsx(InputOTPSlot, { index: 2 })
1988
+ ] }),
1989
+ /* @__PURE__ */ jsx(InputOTPSeparator, {}),
1990
+ /* @__PURE__ */ jsxs(InputOTPGroup, { children: [
1991
+ /* @__PURE__ */ jsx(InputOTPSlot, { index: 3 }),
1992
+ /* @__PURE__ */ jsx(InputOTPSlot, { index: 4 }),
1993
+ /* @__PURE__ */ jsx(InputOTPSlot, { index: 5 })
1994
+ ] })
1995
+ ]
1996
+ });
1997
+ return /* @__PURE__ */ jsx(InputOTP, {
1998
+ ...inputProps,
1999
+ children: /* @__PURE__ */ jsx(InputOTPGroup, { children: Array.from({ length }, (_, i) => /* @__PURE__ */ jsx(InputOTPSlot, { index: i }, `slot-${i}`)) })
2000
+ });
2001
+ };
2002
+ var EdxInputOtp = (props) => {
2003
+ const { emit, host } = useEdxHost();
2004
+ const length = props.length ?? 6;
2005
+ const value = props.value ?? props.defaultValue ?? "";
2006
+ const handleValueChange = (next) => {
2007
+ host.removeAttribute("default-value");
2008
+ host.setAttribute("value", next);
2009
+ emit("edx-change", { value: next });
2010
+ };
2011
+ return buildSlots(props, length, value, handleValueChange, (next) => emit("edx-complete", { value: next }));
2012
+ };
2013
+ var registerEdxInputOtp = (ctx) => {
2014
+ defineElement("edx-input-otp", EdxInputOtp, {
2015
+ mode: ctx.mode,
2016
+ styles: ctx.styles,
2017
+ display: "inline-flex",
2018
+ delegateClick: true,
2019
+ formAssociated: true,
2020
+ formValue: (props) => props.value ?? props.defaultValue ?? "",
2021
+ observedAttributes: [
2022
+ "length",
2023
+ "value",
2024
+ "default-value",
2025
+ "disabled",
2026
+ "readonly",
2027
+ "required",
2028
+ "name",
2029
+ "form",
2030
+ "autocomplete",
2031
+ "inputmode",
2032
+ "pattern",
2033
+ "invalid",
2034
+ "aria-label",
2035
+ "aria-description"
2036
+ ],
2037
+ transformProps: (raw) => ({
2038
+ length: coerceNumber(raw.length) ?? 6,
2039
+ value: raw.value ?? void 0,
2040
+ defaultValue: raw["default-value"] ?? void 0,
2041
+ disabled: coerceBool(raw.disabled),
2042
+ readonly: coerceBool(raw.readonly),
2043
+ required: coerceBool(raw.required),
2044
+ name: raw.name ?? void 0,
2045
+ form: raw.form ?? void 0,
2046
+ autoComplete: raw.autocomplete ?? void 0,
2047
+ inputMode: raw.inputmode ?? void 0,
2048
+ pattern: raw.pattern ?? void 0,
2049
+ invalid: coerceBool(raw.invalid),
2050
+ ariaLabel: raw["aria-label"] ?? void 0,
2051
+ ariaDescription: raw["aria-description"] ?? void 0
2052
+ }),
2053
+ domProperties: { value: {
2054
+ get: (host) => host.getAttribute("value") ?? host.getAttribute("default-value") ?? "",
2055
+ set: (host, value) => {
2056
+ host.setAttribute("value", String(value ?? ""));
2057
+ }
2058
+ } }
2059
+ });
2060
+ };
2061
+ //#endregion
2062
+ //#region ../elements/src/edx-interactive-components.tsx
2063
+ var EdxAlertDialog = ({ triggerLabel = "Delete item", heading = "Are you absolutely sure?", description = "This action cannot be undone.", confirmLabel = "Continue", cancelLabel = "Cancel", open, defaultOpen }) => {
2064
+ const { emit, host } = useEdxHost();
2065
+ return /* @__PURE__ */ jsxs(AlertDialog, {
2066
+ open: open ?? defaultOpen ?? false,
2067
+ onOpenChange: (nextOpen) => {
2068
+ host.removeAttribute("default-open");
2069
+ reflectBool(host, "open", nextOpen);
2070
+ emit("edx-change", { open: nextOpen });
2071
+ },
2072
+ children: [/* @__PURE__ */ jsx(AlertDialogTrigger, {
2073
+ render: /* @__PURE__ */ jsx(Button, { variant: "outline" }),
2074
+ children: triggerLabel
2075
+ }), /* @__PURE__ */ jsxs(AlertDialogContent, { children: [/* @__PURE__ */ jsxs(AlertDialogHeader, { children: [/* @__PURE__ */ jsx(AlertDialogTitle, { children: heading }), /* @__PURE__ */ jsx(AlertDialogDescription, { children: description })] }), /* @__PURE__ */ jsxs(AlertDialogFooter, { children: [/* @__PURE__ */ jsx(AlertDialogCancel, { children: cancelLabel }), /* @__PURE__ */ jsx(AlertDialogAction, {
2076
+ onClick: () => {
2077
+ emit("edx-action", { action: "confirm" });
2078
+ },
2079
+ children: confirmLabel
2080
+ })] })] })]
2081
+ });
2082
+ };
2083
+ var EdxCarousel = ({ items = [
2084
+ "First slide",
2085
+ "Second slide",
2086
+ "Third slide"
2087
+ ], orientation = "horizontal", current, loop, dragFree, startIndex }) => {
2088
+ const { emit, host } = useEdxHost();
2089
+ const [api, setApi] = useState();
2090
+ useEffect(() => {
2091
+ if (!api) return;
2092
+ const handleSelect = () => {
2093
+ const next = api.selectedScrollSnap();
2094
+ if (!Number.isFinite(next)) return;
2095
+ host.setAttribute("current", String(next));
2096
+ emit("edx-change", { value: next });
2097
+ };
2098
+ api.on("select", handleSelect);
2099
+ api.on("reInit", handleSelect);
2100
+ return () => {
2101
+ api.off("select", handleSelect);
2102
+ api.off("reInit", handleSelect);
2103
+ };
2104
+ }, [
2105
+ api,
2106
+ emit,
2107
+ host
2108
+ ]);
2109
+ useEffect(() => {
2110
+ if (api && current != null && api.selectedScrollSnap() !== current) api.scrollTo(current);
2111
+ }, [api, current]);
2112
+ return /* @__PURE__ */ jsxs(Carousel, {
2113
+ orientation,
2114
+ opts: {
2115
+ loop: loop ?? false,
2116
+ dragFree: dragFree ?? false,
2117
+ startIndex: startIndex ?? 0
2118
+ },
2119
+ setApi,
2120
+ className: "mx-10 w-64",
2121
+ children: [
2122
+ /* @__PURE__ */ jsx(CarouselContent, { children: items.map((item) => /* @__PURE__ */ jsx(CarouselItem, { children: /* @__PURE__ */ jsx("div", {
2123
+ className: "flex h-28 items-center justify-center rounded-lg border bg-card p-4 text-sm font-medium",
2124
+ children: item
2125
+ }) }, item)) }),
2126
+ /* @__PURE__ */ jsx(CarouselPrevious, {}),
2127
+ /* @__PURE__ */ jsx(CarouselNext, {})
2128
+ ]
2129
+ });
2130
+ };
2131
+ var EdxChart = ({ data = [
2132
+ {
2133
+ label: "Mon",
2134
+ value: 32
2135
+ },
2136
+ {
2137
+ label: "Tue",
2138
+ value: 48
2139
+ },
2140
+ {
2141
+ label: "Wed",
2142
+ value: 40
2143
+ },
2144
+ {
2145
+ label: "Thu",
2146
+ value: 64
2147
+ }
2148
+ ] }) => {
2149
+ return /* @__PURE__ */ jsx(ChartContainer, {
2150
+ config: { value: {
2151
+ label: "Value",
2152
+ color: "var(--chart-1)"
2153
+ } },
2154
+ className: "h-48 w-full aspect-auto",
2155
+ children: /* @__PURE__ */ jsxs(BarChart, {
2156
+ data,
2157
+ accessibilityLayer: true,
2158
+ children: [
2159
+ /* @__PURE__ */ jsx(CartesianGrid, { vertical: false }),
2160
+ /* @__PURE__ */ jsx(XAxis, {
2161
+ dataKey: "label",
2162
+ tickLine: false,
2163
+ axisLine: false
2164
+ }),
2165
+ /* @__PURE__ */ jsx(Bar, {
2166
+ dataKey: "value",
2167
+ fill: "var(--color-value)",
2168
+ radius: 6
2169
+ })
2170
+ ]
2171
+ })
2172
+ });
2173
+ };
2174
+ var EdxCollapsible = ({ triggerLabel = "Show details", open, defaultOpen, disabled }) => {
2175
+ const { emit, host } = useEdxHost();
2176
+ return /* @__PURE__ */ jsxs(Collapsible, {
2177
+ open: open ?? defaultOpen ?? false,
2178
+ disabled,
2179
+ onOpenChange: (nextOpen) => {
2180
+ host.removeAttribute("default-open");
2181
+ reflectBool(host, "open", nextOpen);
2182
+ emit("edx-change", { open: nextOpen });
2183
+ },
2184
+ className: "w-full space-y-2",
2185
+ children: [/* @__PURE__ */ jsx(CollapsibleTrigger, {
2186
+ render: /* @__PURE__ */ jsx(Button, { variant: "outline" }),
2187
+ disabled,
2188
+ children: triggerLabel
2189
+ }), /* @__PURE__ */ jsx(CollapsibleContent, {
2190
+ className: "rounded-lg border bg-card p-3 text-sm text-muted-foreground",
2191
+ children: /* @__PURE__ */ jsx(Slot, {})
2192
+ })]
2193
+ });
2194
+ };
2195
+ var EdxCommand = ({ placeholder = "Type a command or search…", emptyLabel = "No results found.", items = [], query, loop, disablePointerSelection, vimBindings }) => {
2196
+ const { emit, host } = useEdxHost();
2197
+ return /* @__PURE__ */ jsxs(Command, {
2198
+ loop,
2199
+ disablePointerSelection,
2200
+ vimBindings,
2201
+ className: "w-full rounded-lg border",
2202
+ children: [/* @__PURE__ */ jsx(CommandInput, {
2203
+ placeholder,
2204
+ value: query ?? "",
2205
+ onValueChange: (nextQuery) => {
2206
+ host.setAttribute("query", nextQuery);
2207
+ emit("edx-input-change", { value: nextQuery });
2208
+ }
2209
+ }), /* @__PURE__ */ jsxs(CommandList, { children: [/* @__PURE__ */ jsx(CommandEmpty, { children: emptyLabel }), items.map((item) => /* @__PURE__ */ jsx(CommandItem, {
2210
+ value: item.value ?? item.label,
2211
+ disabled: item.disabled,
2212
+ onSelect: (value) => emit("edx-select", { value }),
2213
+ children: item.label
2214
+ }, item.value ?? item.label))] })]
2215
+ });
2216
+ };
2217
+ var EdxContextMenu = ({ items = [], label = "Right-click here", open, defaultOpen, disabled, loopFocus = true, highlightItemOnHover = true, side, align, sideOffset, alignOffset }) => {
2218
+ const { emit, host } = useEdxHost();
2219
+ return /* @__PURE__ */ jsxs(ContextMenu, {
2220
+ open: open ?? defaultOpen ?? false,
2221
+ disabled,
2222
+ loopFocus,
2223
+ highlightItemOnHover,
2224
+ onOpenChange: (nextOpen) => {
2225
+ host.removeAttribute("default-open");
2226
+ reflectBool(host, "open", nextOpen);
2227
+ emit("edx-change", { open: nextOpen });
2228
+ },
2229
+ children: [/* @__PURE__ */ jsx(ContextMenuTrigger, {
2230
+ className: "flex h-28 w-full items-center justify-center rounded-lg border border-dashed text-sm text-muted-foreground",
2231
+ children: label
2232
+ }), /* @__PURE__ */ jsx(ContextMenuContent, {
2233
+ side,
2234
+ align,
2235
+ sideOffset,
2236
+ alignOffset,
2237
+ children: items.map((item) => /* @__PURE__ */ jsx(ContextMenuItem, {
2238
+ disabled: item.disabled,
2239
+ onClick: () => emit("edx-select", { value: item.value ?? item.label }),
2240
+ children: item.label
2241
+ }, item.value ?? item.label))
2242
+ })]
2243
+ });
2244
+ };
2245
+ var EdxDirection = ({ direction = "ltr" }) => {
2246
+ return /* @__PURE__ */ jsx(DirectionProvider, {
2247
+ direction,
2248
+ children: /* @__PURE__ */ jsx("div", {
2249
+ dir: direction,
2250
+ className: "contents",
2251
+ children: /* @__PURE__ */ jsx(Slot, {})
2252
+ })
2253
+ });
2254
+ };
2255
+ var EdxHoverCard = ({ triggerLabel = "Hover for details", heading = "Design system", description = "Accessible components for every application.", open, defaultOpen, delay, closeDelay, side, align, sideOffset, alignOffset }) => {
2256
+ const { emit, host } = useEdxHost();
2257
+ return /* @__PURE__ */ jsxs(HoverCard, {
2258
+ open: open ?? defaultOpen ?? false,
2259
+ onOpenChange: (open) => {
2260
+ host.removeAttribute("default-open");
2261
+ reflectBool(host, "open", open);
2262
+ emit("edx-change", { open });
2263
+ },
2264
+ children: [/* @__PURE__ */ jsx(HoverCardTrigger, {
2265
+ render: /* @__PURE__ */ jsx(Button, { variant: "link" }),
2266
+ delay,
2267
+ closeDelay,
2268
+ children: triggerLabel
2269
+ }), /* @__PURE__ */ jsxs(HoverCardContent, {
2270
+ side,
2271
+ align,
2272
+ sideOffset,
2273
+ alignOffset,
2274
+ children: [/* @__PURE__ */ jsx("p", {
2275
+ className: "font-medium",
2276
+ children: heading
2277
+ }), /* @__PURE__ */ jsx("p", {
2278
+ className: "mt-1 text-sm text-muted-foreground",
2279
+ children: description
2280
+ })]
2281
+ })]
2282
+ });
2283
+ };
2284
+ var EdxMenubar = ({ menus = [], disabled, modal = true, orientation, loopFocus = true }) => {
2285
+ const emit = useEmit();
2286
+ return /* @__PURE__ */ jsx(Menubar, {
2287
+ disabled,
2288
+ modal,
2289
+ orientation,
2290
+ loopFocus,
2291
+ children: menus.map((menu) => /* @__PURE__ */ jsxs(MenubarMenu, { children: [/* @__PURE__ */ jsx(MenubarTrigger, { children: menu.label }), /* @__PURE__ */ jsx(MenubarContent, { children: menu.items.map((item) => /* @__PURE__ */ jsx(MenubarItem, {
2292
+ disabled: item.disabled,
2293
+ onClick: () => emit("edx-select", { value: item.value ?? item.label }),
2294
+ children: item.label
2295
+ }, item.value ?? item.label)) })] }, menu.label))
2296
+ });
2297
+ };
2298
+ var EdxMessageScroller = ({ items = [], autoScroll, defaultScrollPosition = "end", scrollEdgeThreshold, scrollPreviousItemPeek, scrollMargin, preserveScrollOnPrepend, buttonDirection, buttonBehavior }) => {
2299
+ return /* @__PURE__ */ jsx(MessageScrollerProvider, {
2300
+ autoScroll,
2301
+ defaultScrollPosition,
2302
+ scrollEdgeThreshold,
2303
+ scrollPreviousItemPeek,
2304
+ scrollMargin,
2305
+ children: /* @__PURE__ */ jsxs(MessageScroller, {
2306
+ className: "h-48 rounded-lg border bg-card",
2307
+ children: [/* @__PURE__ */ jsx(MessageScrollerViewport, {
2308
+ "aria-label": "Messages",
2309
+ preserveScrollOnPrepend,
2310
+ children: /* @__PURE__ */ jsx(MessageScrollerContent, {
2311
+ className: "gap-3 p-3",
2312
+ children: items.map((item, index) => /* @__PURE__ */ jsx(MessageScrollerItem, {
2313
+ messageId: `message-${index}`,
2314
+ className: "rounded-lg bg-muted p-2 text-sm",
2315
+ children: item
2316
+ }, item))
2317
+ })
2318
+ }), /* @__PURE__ */ jsx(MessageScrollerButton, {
2319
+ direction: buttonDirection,
2320
+ behavior: buttonBehavior
2321
+ })]
2322
+ })
2323
+ });
2324
+ };
2325
+ var EdxNavigationMenu = ({ items = [], value, defaultValue, orientation, delay, closeDelay, align, ariaLabel }) => {
2326
+ const { emit, host } = useEdxHost();
2327
+ return /* @__PURE__ */ jsx(NavigationMenu, {
2328
+ value: value ?? defaultValue,
2329
+ orientation,
2330
+ delay,
2331
+ closeDelay,
2332
+ align,
2333
+ "aria-label": ariaLabel,
2334
+ onValueChange: (nextValue) => {
2335
+ host.removeAttribute("default-value");
2336
+ if (nextValue) host.setAttribute("value", nextValue);
2337
+ else host.removeAttribute("value");
2338
+ emit("edx-change", { value: nextValue });
2339
+ },
2340
+ children: /* @__PURE__ */ jsx(NavigationMenuList, { children: items.map((item) => /* @__PURE__ */ jsx(NavigationMenuItem, { children: /* @__PURE__ */ jsx(NavigationMenuLink, {
2341
+ href: item.disabled ? void 0 : item.href ?? "#",
2342
+ active: item.active,
2343
+ "aria-disabled": item.disabled || void 0,
2344
+ onClick: (event) => {
2345
+ if (item.disabled) {
2346
+ event.preventDefault();
2347
+ return;
2348
+ }
2349
+ emit("edx-select", { value: item.value ?? item.label });
2350
+ },
2351
+ children: item.label
2352
+ }) }, item.value ?? item.label)) })
2353
+ });
2354
+ };
2355
+ var EdxQuestionnaire = ({ name = "preference", title = "Choose an option", description, choices = [], required = true, multiple }) => {
2356
+ const emit = useEmit();
2357
+ const handleSubmit = (event) => {
2358
+ event.preventDefault();
2359
+ emit("edx-submit", Object.fromEntries(new FormData(event.currentTarget)));
2360
+ };
2361
+ return /* @__PURE__ */ jsxs(Questionnaire, {
2362
+ items: [{
2363
+ name,
2364
+ required,
2365
+ choices
2366
+ }],
2367
+ defaultItem: name,
2368
+ onSubmit: handleSubmit,
2369
+ children: [
2370
+ /* @__PURE__ */ jsx(QuestionnaireProgress, {}),
2371
+ /* @__PURE__ */ jsxs(QuestionnaireItem, {
2372
+ name,
2373
+ required,
2374
+ multiple,
2375
+ children: [
2376
+ /* @__PURE__ */ jsx(QuestionnaireTitle, { children: title }),
2377
+ description ? /* @__PURE__ */ jsx(QuestionnaireDescription, { children: description }) : null,
2378
+ /* @__PURE__ */ jsx(QuestionnaireChoices, { children: choices.map((choice) => /* @__PURE__ */ jsxs(QuestionnaireChoice, {
2379
+ value: choice.value,
2380
+ disabled: choice.disabled,
2381
+ children: [/* @__PURE__ */ jsx("span", { children: choice.label }), choice.description && /* @__PURE__ */ jsx(QuestionnaireChoiceDescription, { children: choice.description })]
2382
+ }, choice.value)) })
2383
+ ]
2384
+ }),
2385
+ /* @__PURE__ */ jsx(QuestionnaireActions, { children: /* @__PURE__ */ jsx(QuestionnaireSubmit, {}) })
2386
+ ]
2387
+ });
2388
+ };
2389
+ var EdxResizable = ({ firstSize = 50, orientation = "horizontal", disabled, firstMinSize, firstMaxSize, firstCollapsible, firstCollapsedSize }) => {
2390
+ const emit = useEmit();
2391
+ return /* @__PURE__ */ jsxs(ResizablePanelGroup, {
2392
+ orientation,
2393
+ disabled,
2394
+ onLayoutChanged: (layout) => emit("edx-change", { value: layout }),
2395
+ className: "h-40 rounded-lg border",
2396
+ children: [
2397
+ /* @__PURE__ */ jsx(ResizablePanel, {
2398
+ defaultSize: firstSize,
2399
+ minSize: firstMinSize,
2400
+ maxSize: firstMaxSize,
2401
+ collapsible: firstCollapsible,
2402
+ collapsedSize: firstCollapsedSize,
2403
+ className: "flex items-center justify-center p-3 text-sm",
2404
+ children: /* @__PURE__ */ jsx(Slot, { name: "first" })
2405
+ }),
2406
+ /* @__PURE__ */ jsx(ResizableHandle, {
2407
+ withHandle: true,
2408
+ disabled
2409
+ }),
2410
+ /* @__PURE__ */ jsx(ResizablePanel, {
2411
+ className: "flex items-center justify-center p-3 text-sm",
2412
+ children: /* @__PURE__ */ jsx(Slot, { name: "second" })
2413
+ })
2414
+ ]
2415
+ });
2416
+ };
2417
+ var EdxSheet = ({ triggerLabel = "Open sheet", heading = "Details", description = "Review and update this information.", side = "right", open, defaultOpen, modal = true, disablePointerDismissal }) => {
2418
+ const { emit, host } = useEdxHost();
2419
+ return /* @__PURE__ */ jsxs(Sheet, {
2420
+ open: open ?? defaultOpen ?? false,
2421
+ modal,
2422
+ disablePointerDismissal,
2423
+ onOpenChange: (open) => {
2424
+ host.removeAttribute("default-open");
2425
+ reflectBool(host, "open", open);
2426
+ emit("edx-change", { open });
2427
+ },
2428
+ children: [/* @__PURE__ */ jsx(SheetTrigger, {
2429
+ render: /* @__PURE__ */ jsx(Button, { variant: "outline" }),
2430
+ children: triggerLabel
2431
+ }), /* @__PURE__ */ jsxs(SheetContent, {
2432
+ side,
2433
+ showCloseButton: true,
2434
+ children: [/* @__PURE__ */ jsxs(SheetHeader, { children: [/* @__PURE__ */ jsx(SheetTitle, { children: heading }), /* @__PURE__ */ jsx(SheetDescription, { children: description })] }), /* @__PURE__ */ jsx("div", {
2435
+ className: "p-4",
2436
+ children: /* @__PURE__ */ jsx(Slot, {})
2437
+ })]
2438
+ })]
2439
+ });
2440
+ };
2441
+ var EdxSidebar = ({ title = "Workspace", items = [], groupLabel = "Navigation", side, variant, collapsible = "none", open, defaultOpen = true }) => {
2442
+ const { emit, host } = useEdxHost();
2443
+ return /* @__PURE__ */ jsx(SidebarProvider, {
2444
+ open: open ?? defaultOpen,
2445
+ onOpenChange: (nextOpen) => {
2446
+ host.removeAttribute("default-open");
2447
+ host.setAttribute("open", String(nextOpen));
2448
+ emit("edx-change", { open: nextOpen });
2449
+ },
2450
+ className: "min-h-64 overflow-hidden rounded-lg border",
2451
+ children: /* @__PURE__ */ jsxs(Sidebar, {
2452
+ side,
2453
+ variant,
2454
+ collapsible,
2455
+ className: "h-64",
2456
+ children: [/* @__PURE__ */ jsxs(SidebarHeader, {
2457
+ className: "flex-row items-center justify-between font-medium",
2458
+ children: [/* @__PURE__ */ jsx("span", { children: title }), collapsible !== "none" ? /* @__PURE__ */ jsx(SidebarTrigger, { "aria-label": "Toggle sidebar" }) : null]
2459
+ }), /* @__PURE__ */ jsx(SidebarContent, { children: /* @__PURE__ */ jsxs(SidebarGroup, { children: [/* @__PURE__ */ jsx(SidebarGroupLabel, { children: groupLabel }), /* @__PURE__ */ jsx(SidebarGroupContent, { children: /* @__PURE__ */ jsx(SidebarMenu, { children: items.map((item) => /* @__PURE__ */ jsx(SidebarMenuItem, { children: /* @__PURE__ */ jsx(SidebarMenuButton, {
2460
+ isActive: item.active,
2461
+ disabled: item.disabled,
2462
+ onClick: () => emit("edx-select", { value: item.value ?? item.label }),
2463
+ children: item.label
2464
+ }) }, item.value ?? item.label)) }) })] }) })]
2465
+ })
2466
+ });
2467
+ };
2468
+ var EdxToast = ({ triggerLabel = "Show toast", title = "Saved", description = "Your changes have been saved.", type = "success", timeout = 5e3 }) => {
2469
+ return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Button, {
2470
+ variant: "outline",
2471
+ onClick: () => toast.add({
2472
+ title,
2473
+ description,
2474
+ type,
2475
+ timeout
2476
+ }),
2477
+ children: triggerLabel
2478
+ }), /* @__PURE__ */ jsx(Toaster, {})] });
2479
+ };
2480
+ var registerEdxInteractiveComponents = (ctx) => {
2481
+ registerOverlayElement("edx-alert-dialog", EdxAlertDialog, ctx, {
2482
+ display: "inline-flex",
2483
+ observedAttributes: [
2484
+ "trigger-label",
2485
+ "heading",
2486
+ "description",
2487
+ "confirm-label",
2488
+ "cancel-label",
2489
+ "open",
2490
+ "default-open"
2491
+ ],
2492
+ transformProps: (raw) => ({
2493
+ triggerLabel: raw["trigger-label"] ?? void 0,
2494
+ heading: raw.heading ?? void 0,
2495
+ description: raw.description ?? void 0,
2496
+ confirmLabel: raw["confirm-label"] ?? void 0,
2497
+ cancelLabel: raw["cancel-label"] ?? void 0,
2498
+ open: raw.open == null ? void 0 : coerceBool(raw.open),
2499
+ defaultOpen: raw["default-open"] == null ? void 0 : coerceBool(raw["default-open"])
2500
+ }),
2501
+ domProperties: { open: booleanDomProperty("open", "default-open") }
2502
+ });
2503
+ defineElement("edx-carousel", EdxCarousel, {
2504
+ mode: ctx.mode,
2505
+ styles: ctx.styles,
2506
+ observedAttributes: [
2507
+ "items",
2508
+ "orientation",
2509
+ "current",
2510
+ "loop",
2511
+ "drag-free",
2512
+ "start-index"
2513
+ ],
2514
+ transformProps: (raw) => ({
2515
+ items: coerceJson(raw.items),
2516
+ orientation: raw.orientation ?? void 0,
2517
+ current: coerceNumber(raw.current),
2518
+ loop: raw.loop == null ? void 0 : coerceBool(raw.loop),
2519
+ dragFree: raw["drag-free"] == null ? void 0 : coerceBool(raw["drag-free"]),
2520
+ startIndex: coerceNumber(raw["start-index"])
2521
+ }),
2522
+ domProperties: { current: {
2523
+ get: (host) => coerceNumber(host.getAttribute("current")) ?? 0,
2524
+ set: (host, value) => host.setAttribute("current", String(value ?? 0))
2525
+ } }
2526
+ });
2527
+ defineElement("edx-chart", EdxChart, {
2528
+ mode: ctx.mode,
2529
+ styles: ctx.styles,
2530
+ observedAttributes: ["data"],
2531
+ transformProps: (raw) => ({ data: coerceJson(raw.data) })
2532
+ });
2533
+ defineElement("edx-collapsible", EdxCollapsible, {
2534
+ mode: "shadow",
2535
+ styles: ctx.styles,
2536
+ observedAttributes: [
2537
+ "trigger-label",
2538
+ "open",
2539
+ "default-open",
2540
+ "disabled"
2541
+ ],
2542
+ transformProps: (raw) => ({
2543
+ triggerLabel: raw["trigger-label"] ?? void 0,
2544
+ open: raw.open == null ? void 0 : coerceBool(raw.open),
2545
+ defaultOpen: raw["default-open"] == null ? void 0 : coerceBool(raw["default-open"]),
2546
+ disabled: raw.disabled == null ? void 0 : coerceBool(raw.disabled)
2547
+ }),
2548
+ domProperties: { open: booleanDomProperty("open", "default-open") }
2549
+ });
2550
+ defineElement("edx-command", EdxCommand, {
2551
+ mode: ctx.mode,
2552
+ styles: ctx.styles,
2553
+ observedAttributes: [
2554
+ "placeholder",
2555
+ "empty-label",
2556
+ "items",
2557
+ "query",
2558
+ "loop",
2559
+ "disable-pointer-selection",
2560
+ "vim-bindings"
2561
+ ],
2562
+ transformProps: (raw) => ({
2563
+ placeholder: raw.placeholder ?? void 0,
2564
+ emptyLabel: raw["empty-label"] ?? void 0,
2565
+ items: coerceJson(raw.items),
2566
+ query: raw.query ?? void 0,
2567
+ loop: raw.loop == null ? void 0 : coerceBool(raw.loop),
2568
+ disablePointerSelection: raw["disable-pointer-selection"] == null ? void 0 : coerceBool(raw["disable-pointer-selection"]),
2569
+ vimBindings: raw["vim-bindings"] == null ? void 0 : coerceBool(raw["vim-bindings"])
2570
+ }),
2571
+ domProperties: { query: {
2572
+ get: (host) => host.getAttribute("query") ?? "",
2573
+ set: (host, value) => host.setAttribute("query", String(value ?? ""))
2574
+ } }
2575
+ });
2576
+ registerOverlayElement("edx-context-menu", EdxContextMenu, ctx, {
2577
+ observedAttributes: [
2578
+ "items",
2579
+ "label",
2580
+ "open",
2581
+ "default-open",
2582
+ "disabled",
2583
+ "loop-focus",
2584
+ "highlight-item-on-hover",
2585
+ "side",
2586
+ "align",
2587
+ "side-offset",
2588
+ "align-offset"
2589
+ ],
2590
+ transformProps: (raw) => ({
2591
+ items: coerceJson(raw.items),
2592
+ label: raw.label ?? void 0,
2593
+ open: raw.open == null ? void 0 : coerceBool(raw.open),
2594
+ defaultOpen: raw["default-open"] == null ? void 0 : coerceBool(raw["default-open"]),
2595
+ disabled: raw.disabled == null ? void 0 : coerceBool(raw.disabled),
2596
+ loopFocus: raw["loop-focus"] == null ? void 0 : coerceBool(raw["loop-focus"]),
2597
+ highlightItemOnHover: raw["highlight-item-on-hover"] == null ? void 0 : coerceBool(raw["highlight-item-on-hover"]),
2598
+ side: raw.side ?? void 0,
2599
+ align: raw.align ?? void 0,
2600
+ sideOffset: coerceNumber(raw["side-offset"]),
2601
+ alignOffset: coerceNumber(raw["align-offset"])
2602
+ }),
2603
+ domProperties: { open: booleanDomProperty("open", "default-open") }
2604
+ });
2605
+ defineElement("edx-direction", EdxDirection, {
2606
+ mode: "shadow",
2607
+ styles: ctx.styles,
2608
+ observedAttributes: ["direction"],
2609
+ transformProps: (raw) => ({ direction: raw.direction ?? void 0 })
2610
+ });
2611
+ registerOverlayElement("edx-hover-card", EdxHoverCard, ctx, {
2612
+ display: "inline-flex",
2613
+ observedAttributes: [
2614
+ "trigger-label",
2615
+ "heading",
2616
+ "description",
2617
+ "open",
2618
+ "default-open",
2619
+ "delay",
2620
+ "close-delay",
2621
+ "side",
2622
+ "align",
2623
+ "side-offset",
2624
+ "align-offset"
2625
+ ],
2626
+ transformProps: (raw) => ({
2627
+ triggerLabel: raw["trigger-label"] ?? void 0,
2628
+ heading: raw.heading ?? void 0,
2629
+ description: raw.description ?? void 0,
2630
+ open: raw.open == null ? void 0 : coerceBool(raw.open),
2631
+ defaultOpen: raw["default-open"] == null ? void 0 : coerceBool(raw["default-open"]),
2632
+ delay: coerceNumber(raw.delay),
2633
+ closeDelay: coerceNumber(raw["close-delay"]),
2634
+ side: raw.side ?? void 0,
2635
+ align: raw.align ?? void 0,
2636
+ sideOffset: coerceNumber(raw["side-offset"]),
2637
+ alignOffset: coerceNumber(raw["align-offset"])
2638
+ }),
2639
+ domProperties: { open: booleanDomProperty("open", "default-open") }
2640
+ });
2641
+ registerOverlayElement("edx-menubar", EdxMenubar, ctx, {
2642
+ display: "block",
2643
+ observedAttributes: [
2644
+ "menus",
2645
+ "disabled",
2646
+ "modal",
2647
+ "orientation",
2648
+ "loop-focus"
2649
+ ],
2650
+ transformProps: (raw) => ({
2651
+ menus: coerceJson(raw.menus),
2652
+ disabled: raw.disabled == null ? void 0 : coerceBool(raw.disabled),
2653
+ modal: raw.modal == null ? void 0 : coerceBool(raw.modal),
2654
+ orientation: raw.orientation ?? void 0,
2655
+ loopFocus: raw["loop-focus"] == null ? void 0 : coerceBool(raw["loop-focus"])
2656
+ })
2657
+ });
2658
+ defineElement("edx-message-scroller", EdxMessageScroller, {
2659
+ mode: ctx.mode,
2660
+ styles: ctx.styles,
2661
+ observedAttributes: [
2662
+ "items",
2663
+ "auto-scroll",
2664
+ "default-scroll-position",
2665
+ "scroll-edge-threshold",
2666
+ "scroll-previous-item-peek",
2667
+ "scroll-margin",
2668
+ "preserve-scroll-on-prepend",
2669
+ "button-direction",
2670
+ "button-behavior"
2671
+ ],
2672
+ transformProps: (raw) => ({
2673
+ items: coerceJson(raw.items),
2674
+ autoScroll: raw["auto-scroll"] == null ? void 0 : coerceBool(raw["auto-scroll"]),
2675
+ defaultScrollPosition: raw["default-scroll-position"] ?? void 0,
2676
+ scrollEdgeThreshold: coerceNumber(raw["scroll-edge-threshold"]),
2677
+ scrollPreviousItemPeek: coerceNumber(raw["scroll-previous-item-peek"]),
2678
+ scrollMargin: coerceNumber(raw["scroll-margin"]),
2679
+ preserveScrollOnPrepend: raw["preserve-scroll-on-prepend"] == null ? void 0 : coerceBool(raw["preserve-scroll-on-prepend"]),
2680
+ buttonDirection: raw["button-direction"] ?? void 0,
2681
+ buttonBehavior: raw["button-behavior"] ?? void 0
2682
+ })
2683
+ });
2684
+ registerOverlayElement("edx-navigation-menu", EdxNavigationMenu, ctx, {
2685
+ display: "inline-flex",
2686
+ observedAttributes: [
2687
+ "items",
2688
+ "value",
2689
+ "default-value",
2690
+ "orientation",
2691
+ "delay",
2692
+ "close-delay",
2693
+ "align",
2694
+ "aria-label"
2695
+ ],
2696
+ transformProps: (raw) => ({
2697
+ items: coerceJson(raw.items),
2698
+ value: raw.value ?? void 0,
2699
+ defaultValue: raw["default-value"] ?? void 0,
2700
+ orientation: raw.orientation ?? void 0,
2701
+ delay: coerceNumber(raw.delay),
2702
+ closeDelay: coerceNumber(raw["close-delay"]),
2703
+ align: raw.align ?? void 0,
2704
+ ariaLabel: raw["aria-label"] ?? void 0
2705
+ }),
2706
+ domProperties: { value: {
2707
+ get: (host) => host.getAttribute("value") ?? "",
2708
+ set: (host, value) => host.setAttribute("value", String(value ?? ""))
2709
+ } }
2710
+ });
2711
+ defineElement("edx-questionnaire", EdxQuestionnaire, {
2712
+ mode: ctx.mode,
2713
+ styles: ctx.styles,
2714
+ observedAttributes: [
2715
+ "name",
2716
+ "title",
2717
+ "description",
2718
+ "choices",
2719
+ "required",
2720
+ "multiple"
2721
+ ],
2722
+ transformProps: (raw) => ({
2723
+ name: raw.name ?? void 0,
2724
+ title: raw.title ?? void 0,
2725
+ description: raw.description ?? void 0,
2726
+ choices: coerceJson(raw.choices),
2727
+ required: raw.required == null ? void 0 : coerceBool(raw.required),
2728
+ multiple: raw.multiple == null ? void 0 : coerceBool(raw.multiple)
2729
+ })
2730
+ });
2731
+ defineElement("edx-resizable", EdxResizable, {
2732
+ mode: "shadow",
2733
+ styles: ctx.styles,
2734
+ observedAttributes: [
2735
+ "first-size",
2736
+ "orientation",
2737
+ "disabled",
2738
+ "first-min-size",
2739
+ "first-max-size",
2740
+ "first-collapsible",
2741
+ "first-collapsed-size"
2742
+ ],
2743
+ transformProps: (raw) => ({
2744
+ firstSize: coerceNumber(raw["first-size"]),
2745
+ orientation: raw.orientation ?? void 0,
2746
+ disabled: raw.disabled == null ? void 0 : coerceBool(raw.disabled),
2747
+ firstMinSize: coerceNumber(raw["first-min-size"]),
2748
+ firstMaxSize: coerceNumber(raw["first-max-size"]),
2749
+ firstCollapsible: raw["first-collapsible"] == null ? void 0 : coerceBool(raw["first-collapsible"]),
2750
+ firstCollapsedSize: coerceNumber(raw["first-collapsed-size"])
2751
+ })
2752
+ });
2753
+ registerOverlayElement("edx-sheet", EdxSheet, ctx, {
2754
+ display: "inline-flex",
2755
+ observedAttributes: [
2756
+ "trigger-label",
2757
+ "heading",
2758
+ "description",
2759
+ "side",
2760
+ "open",
2761
+ "default-open",
2762
+ "modal",
2763
+ "disable-pointer-dismissal"
2764
+ ],
2765
+ transformProps: (raw) => ({
2766
+ triggerLabel: raw["trigger-label"] ?? void 0,
2767
+ heading: raw.heading ?? void 0,
2768
+ description: raw.description ?? void 0,
2769
+ side: raw.side ?? void 0,
2770
+ open: raw.open == null ? void 0 : coerceBool(raw.open),
2771
+ defaultOpen: raw["default-open"] == null ? void 0 : coerceBool(raw["default-open"]),
2772
+ modal: raw.modal == null ? void 0 : coerceBool(raw.modal),
2773
+ disablePointerDismissal: raw["disable-pointer-dismissal"] == null ? void 0 : coerceBool(raw["disable-pointer-dismissal"])
2774
+ }),
2775
+ domProperties: { open: booleanDomProperty("open", "default-open") }
2776
+ });
2777
+ registerOverlayElement("edx-sidebar", EdxSidebar, ctx, {
2778
+ observedAttributes: [
2779
+ "title",
2780
+ "items",
2781
+ "group-label",
2782
+ "side",
2783
+ "variant",
2784
+ "collapsible",
2785
+ "open",
2786
+ "default-open"
2787
+ ],
2788
+ transformProps: (raw) => ({
2789
+ title: raw.title ?? void 0,
2790
+ items: coerceJson(raw.items),
2791
+ groupLabel: raw["group-label"] ?? void 0,
2792
+ side: raw.side ?? void 0,
2793
+ variant: raw.variant ?? void 0,
2794
+ collapsible: raw.collapsible ?? void 0,
2795
+ open: raw.open == null ? void 0 : coerceBool(raw.open),
2796
+ defaultOpen: raw["default-open"] == null ? void 0 : coerceBool(raw["default-open"])
2797
+ }),
2798
+ domProperties: { open: {
2799
+ get: (host) => {
2800
+ const explicit = host.getAttribute("open");
2801
+ if (explicit != null) return coerceBool(explicit);
2802
+ const initial = host.getAttribute("default-open");
2803
+ return initial == null ? true : coerceBool(initial);
2804
+ },
2805
+ set: (host, value) => {
2806
+ host.removeAttribute("default-open");
2807
+ host.setAttribute("open", String(Boolean(value)));
2808
+ }
2809
+ } }
2810
+ });
2811
+ registerOverlayElement("edx-toast", EdxToast, ctx, {
2812
+ display: "inline-flex",
2813
+ observedAttributes: [
2814
+ "trigger-label",
2815
+ "title",
2816
+ "description",
2817
+ "type",
2818
+ "timeout"
2819
+ ],
2820
+ transformProps: (raw) => ({
2821
+ triggerLabel: raw["trigger-label"] ?? void 0,
2822
+ title: raw.title ?? void 0,
2823
+ description: raw.description ?? void 0,
2824
+ type: raw.type ?? void 0,
2825
+ timeout: coerceNumber(raw.timeout)
2826
+ })
2827
+ });
2828
+ };
2829
+ //#endregion
2830
+ //#region ../elements/src/edx-label.tsx
2831
+ var EdxLabel = (props) => {
2832
+ return /* @__PURE__ */ jsx(Label, {
2833
+ htmlFor: props.for,
2834
+ children: /* @__PURE__ */ jsx(Slot, {})
2835
+ });
2836
+ };
2837
+ var registerEdxLabel = (ctx) => {
2838
+ defineElement("edx-label", EdxLabel, {
2839
+ mode: ctx.mode,
2840
+ styles: ctx.styles,
2841
+ display: "flex",
2842
+ observedAttributes: ["for"],
2843
+ transformProps: (raw) => ({ for: raw.for ?? void 0 })
2844
+ });
2845
+ };
2846
+ //#endregion
2847
+ //#region ../elements/src/edx-pagination.tsx
2848
+ var EdxPagination = (props) => {
2849
+ const { emit, host } = useEdxHost();
2850
+ const currentPage = props.page ?? 1;
2851
+ const totalPages = props.count ?? 1;
2852
+ const siblings = props.siblingCount ?? 1;
2853
+ return /* @__PURE__ */ jsx(Pagination, {
2854
+ page: currentPage,
2855
+ count: totalPages,
2856
+ siblingCount: siblings,
2857
+ onPageChange: (newPage) => {
2858
+ host.setAttribute("page", String(newPage));
2859
+ emit("edx-change", { value: newPage });
2860
+ }
2861
+ });
2862
+ };
2863
+ var registerEdxPagination = (ctx) => {
2864
+ defineElement("edx-pagination", EdxPagination, {
2865
+ mode: ctx.mode,
2866
+ styles: ctx.styles,
2867
+ observedAttributes: [
2868
+ "page",
2869
+ "count",
2870
+ "sibling-count"
2871
+ ],
2872
+ transformProps: (raw) => ({
2873
+ page: coerceNumber(raw.page) ?? 1,
2874
+ count: coerceNumber(raw.count) ?? 1,
2875
+ siblingCount: coerceNumber(raw["sibling-count"]) ?? 1
2876
+ }),
2877
+ domProperties: { page: {
2878
+ get: (host) => {
2879
+ return coerceNumber(host.getAttribute("page")) ?? 1;
2880
+ },
2881
+ set: (host, value) => {
2882
+ host.setAttribute("page", String(value ?? 1));
2883
+ }
2884
+ } }
2885
+ });
2886
+ };
2887
+ //#endregion
2888
+ //#region ../elements/src/edx-popover.tsx
2889
+ /**
2890
+ * Click-triggered overlay, the same light-mode pattern as edx-dialog (registered
2891
+ * via registerOverlayElement, which pins mode:'light' so the Base UI portal can
2892
+ * land in document.body). Content is attribute-driven (no `<Slot />`): heading +
2893
+ * description cover the common popover body, mirroring the dialog header shape.
2894
+ */
2895
+ var EdxPopover = (props) => {
2896
+ const { emit, host } = useEdxHost();
2897
+ return /* @__PURE__ */ jsxs(Popover, {
2898
+ open: props.open ?? props.defaultOpen ?? false,
2899
+ modal: props.modal,
2900
+ onOpenChange: (open) => {
2901
+ host.removeAttribute("default-open");
2902
+ reflectBool(host, "open", open);
2903
+ emit("edx-change", { open });
2904
+ },
2905
+ children: [/* @__PURE__ */ jsx(PopoverTrigger, {
2906
+ render: /* @__PURE__ */ jsx(Button, { variant: "outline" }),
2907
+ openOnHover: props.openOnHover,
2908
+ delay: props.delay,
2909
+ closeDelay: props.closeDelay,
2910
+ children: props.triggerLabel ?? "Open"
2911
+ }), /* @__PURE__ */ jsx(PopoverContent, {
2912
+ side: props.side,
2913
+ align: props.align,
2914
+ sideOffset: props.sideOffset,
2915
+ alignOffset: props.alignOffset,
2916
+ children: (props.heading || props.description) && /* @__PURE__ */ jsxs(PopoverHeader, { children: [props.heading && /* @__PURE__ */ jsx(PopoverTitle, { children: props.heading }), props.description && /* @__PURE__ */ jsx(PopoverDescription, { children: props.description })] })
2917
+ })]
2918
+ });
2919
+ };
2920
+ var registerEdxPopover = (ctx) => {
2921
+ registerOverlayElement("edx-popover", EdxPopover, ctx, {
2922
+ display: "inline-flex",
2923
+ observedAttributes: [
2924
+ "trigger-label",
2925
+ "heading",
2926
+ "description",
2927
+ "open",
2928
+ "default-open",
2929
+ "modal",
2930
+ "open-on-hover",
2931
+ "delay",
2932
+ "close-delay",
2933
+ "side",
2934
+ "align",
2935
+ "side-offset",
2936
+ "align-offset"
2937
+ ],
2938
+ transformProps: (raw) => ({
2939
+ triggerLabel: raw["trigger-label"] ?? void 0,
2940
+ heading: raw.heading ?? void 0,
2941
+ description: raw.description ?? void 0,
2942
+ open: raw.open == null ? void 0 : coerceBool(raw.open),
2943
+ defaultOpen: raw["default-open"] == null ? void 0 : coerceBool(raw["default-open"]),
2944
+ modal: raw.modal == null ? void 0 : coerceBool(raw.modal),
2945
+ openOnHover: raw["open-on-hover"] == null ? void 0 : coerceBool(raw["open-on-hover"]),
2946
+ delay: coerceNumber(raw.delay),
2947
+ closeDelay: coerceNumber(raw["close-delay"]),
2948
+ side: raw.side ?? void 0,
2949
+ align: raw.align ?? void 0,
2950
+ sideOffset: coerceNumber(raw["side-offset"]),
2951
+ alignOffset: coerceNumber(raw["align-offset"])
2952
+ }),
2953
+ domProperties: { open: booleanDomProperty("open", "default-open") }
2954
+ });
2955
+ };
2956
+ //#endregion
2957
+ //#region ../elements/src/edx-progress.tsx
2958
+ var EdxProgress = (props) => {
2959
+ return /* @__PURE__ */ jsx(Progress, {
2960
+ value: props.value ?? null,
2961
+ min: props.min,
2962
+ max: props.max,
2963
+ "aria-label": props.label,
2964
+ "aria-valuetext": props.ariaValueText
2965
+ });
2966
+ };
2967
+ var registerEdxProgress = (ctx) => {
2968
+ defineElement("edx-progress", EdxProgress, {
2969
+ mode: ctx.mode,
2970
+ styles: ctx.styles,
2971
+ display: "block",
2972
+ observedAttributes: [
2973
+ "value",
2974
+ "label",
2975
+ "min",
2976
+ "max",
2977
+ "aria-valuetext"
2978
+ ],
2979
+ transformProps: (raw) => ({
2980
+ value: raw.value === void 0 ? null : coerceNumber(raw.value) ?? null,
2981
+ label: raw.label ?? void 0,
2982
+ min: coerceNumber(raw.min),
2983
+ max: coerceNumber(raw.max),
2984
+ ariaValueText: raw["aria-valuetext"] ?? void 0
2985
+ })
2986
+ });
2987
+ };
2988
+ //#endregion
2989
+ //#region ../elements/src/edx-radio-group.tsx
2990
+ var EdxRadioGroup = (props) => {
2991
+ const { emit, host } = useEdxHost();
2992
+ const options = props.options ?? [];
2993
+ return /* @__PURE__ */ jsx(RadioGroup, {
2994
+ value: props.value ?? props.defaultValue ?? "",
2995
+ disabled: props.disabled ?? false,
2996
+ readOnly: props.readonly ?? false,
2997
+ required: props.required ?? false,
2998
+ name: props.name,
2999
+ form: props.form,
3000
+ orientation: props.orientation ?? "vertical",
3001
+ "aria-invalid": props.invalid || void 0,
3002
+ "aria-label": props.ariaLabel,
3003
+ "aria-description": props.ariaDescription,
3004
+ onValueChange: (next) => {
3005
+ const value = String(next);
3006
+ host.removeAttribute("default-value");
3007
+ host.setAttribute("value", value);
3008
+ emit("edx-change", { value });
3009
+ },
3010
+ children: options.map((option) => /* @__PURE__ */ jsxs("div", {
3011
+ className: "flex items-center gap-2",
3012
+ children: [/* @__PURE__ */ jsx(RadioGroupItem, {
3013
+ value: option.value,
3014
+ disabled: (props.disabled ?? false) || option.disabled,
3015
+ "aria-invalid": props.invalid || void 0,
3016
+ id: `${props.name ?? "rg"}-${option.value}`
3017
+ }), /* @__PURE__ */ jsx("label", {
3018
+ htmlFor: `${props.name ?? "rg"}-${option.value}`,
3019
+ className: "text-sm font-medium leading-none",
3020
+ children: option.label
3021
+ })]
3022
+ }, option.value))
3023
+ });
3024
+ };
3025
+ var registerEdxRadioGroup = (ctx) => {
3026
+ defineElement("edx-radio-group", EdxRadioGroup, {
3027
+ mode: ctx.mode,
3028
+ styles: ctx.styles,
3029
+ display: "block",
3030
+ formAssociated: true,
3031
+ formValue: (props) => props.value ?? props.defaultValue ?? "",
3032
+ observedAttributes: [
3033
+ "options",
3034
+ "value",
3035
+ "default-value",
3036
+ "disabled",
3037
+ "readonly",
3038
+ "required",
3039
+ "name",
3040
+ "form",
3041
+ "invalid",
3042
+ "orientation",
3043
+ "aria-label",
3044
+ "aria-description"
3045
+ ],
3046
+ transformProps: (raw) => ({
3047
+ options: coerceJson(raw.options) ?? [],
3048
+ value: raw.value ?? void 0,
3049
+ defaultValue: raw["default-value"] ?? void 0,
3050
+ disabled: coerceBool(raw.disabled),
3051
+ readonly: coerceBool(raw.readonly),
3052
+ required: coerceBool(raw.required),
3053
+ name: raw.name ?? void 0,
3054
+ form: raw.form ?? void 0,
3055
+ invalid: coerceBool(raw.invalid),
3056
+ orientation: raw.orientation ?? void 0,
3057
+ ariaLabel: raw["aria-label"] ?? void 0,
3058
+ ariaDescription: raw["aria-description"] ?? void 0
3059
+ }),
3060
+ domProperties: { value: {
3061
+ get: (host) => host.getAttribute("value") ?? host.getAttribute("default-value") ?? "",
3062
+ set: (host, value) => {
3063
+ host.setAttribute("value", String(value ?? ""));
3064
+ }
3065
+ } }
3066
+ });
3067
+ };
3068
+ //#endregion
3069
+ //#region ../elements/src/edx-scroll-area.tsx
3070
+ var EdxScrollArea = (props) => {
3071
+ const { emit } = useEdxHost();
3072
+ const refViewport = useRef(null);
3073
+ const style = {};
3074
+ if (props.height) style.height = props.height;
3075
+ if (props.width) style.width = props.width;
3076
+ const className = props.bordered ? "w-full rounded-md border border-border" : void 0;
3077
+ useEffect(() => {
3078
+ const viewport = refViewport.current;
3079
+ if (!viewport) return;
3080
+ const handleScroll = () => {
3081
+ emit("edx-scroll", {
3082
+ scrollTop: viewport.scrollTop,
3083
+ scrollLeft: viewport.scrollLeft
3084
+ });
3085
+ };
3086
+ viewport.addEventListener("scroll", handleScroll, { passive: true });
3087
+ return () => viewport.removeEventListener("scroll", handleScroll);
3088
+ }, [emit]);
3089
+ return /* @__PURE__ */ jsx(ScrollArea, {
3090
+ orientation: props.orientation ?? "vertical",
3091
+ type: props.type,
3092
+ viewPortId: props.viewportId,
3093
+ viewPortRef: refViewport,
3094
+ className,
3095
+ style,
3096
+ children: /* @__PURE__ */ jsx(Slot, {})
3097
+ });
3098
+ };
3099
+ var registerEdxScrollArea = (ctx) => {
3100
+ defineElement("edx-scroll-area", EdxScrollArea, {
3101
+ mode: "shadow",
3102
+ styles: ctx.styles,
3103
+ observedAttributes: [
3104
+ "orientation",
3105
+ "height",
3106
+ "width",
3107
+ "bordered",
3108
+ "type",
3109
+ "viewport-id"
3110
+ ],
3111
+ transformProps: (raw) => ({
3112
+ orientation: raw.orientation ?? void 0,
3113
+ height: raw.height ?? void 0,
3114
+ width: raw.width ?? void 0,
3115
+ bordered: coerceBool(raw.bordered),
3116
+ type: raw.type ?? void 0,
3117
+ viewportId: raw["viewport-id"] ?? void 0
3118
+ }),
3119
+ domProperties: {
3120
+ scrollTop: {
3121
+ get: (host) => (host.shadowRoot?.querySelector("[data-slot=\"scroll-area-viewport\"]") ?? host.querySelector("[data-slot=\"scroll-area-viewport\"]"))?.scrollTop ?? 0,
3122
+ set: (host, value) => {
3123
+ const viewport = host.shadowRoot?.querySelector("[data-slot=\"scroll-area-viewport\"]") ?? host.querySelector("[data-slot=\"scroll-area-viewport\"]");
3124
+ if (viewport) viewport.scrollTop = Number(value) || 0;
3125
+ }
3126
+ },
3127
+ scrollLeft: {
3128
+ get: (host) => (host.shadowRoot?.querySelector("[data-slot=\"scroll-area-viewport\"]") ?? host.querySelector("[data-slot=\"scroll-area-viewport\"]"))?.scrollLeft ?? 0,
3129
+ set: (host, value) => {
3130
+ const viewport = host.shadowRoot?.querySelector("[data-slot=\"scroll-area-viewport\"]") ?? host.querySelector("[data-slot=\"scroll-area-viewport\"]");
3131
+ if (viewport) viewport.scrollLeft = Number(value) || 0;
3132
+ }
3133
+ }
3134
+ }
3135
+ });
3136
+ };
3137
+ //#endregion
3138
+ //#region ../elements/src/edx-select.tsx
3139
+ var isGroup = (entry) => "items" in entry && Array.isArray(entry.items);
3140
+ var renderFlatOptions = (items) => items.map((opt) => /* @__PURE__ */ jsx(SelectItem, {
3141
+ value: opt.value,
3142
+ disabled: opt.disabled,
3143
+ children: opt.label
3144
+ }, opt.value));
3145
+ var EdxSelect = (props) => {
3146
+ const { emit, host } = useEdxHost();
3147
+ const portalContainer = usePortalContainer();
3148
+ const options = props.options ?? [];
3149
+ const hasGroups = options.some(isGroup);
3150
+ const renderOptions = () => {
3151
+ if (!hasGroups) return renderFlatOptions(options);
3152
+ const nodes = [];
3153
+ options.forEach((entry, idx) => {
3154
+ if (isGroup(entry)) {
3155
+ if (idx > 0) nodes.push(/* @__PURE__ */ jsx(SelectSeparator, {}, `sep-before-${entry.label}`));
3156
+ nodes.push(/* @__PURE__ */ jsxs(SelectGroup, { children: [/* @__PURE__ */ jsx(SelectLabel, { children: entry.label }), renderFlatOptions(entry.items)] }, entry.label));
3157
+ } else nodes.push(/* @__PURE__ */ jsx(SelectItem, {
3158
+ value: entry.value,
3159
+ children: entry.label
3160
+ }, entry.value));
3161
+ });
3162
+ return nodes;
3163
+ };
3164
+ const flatten = (entries) => entries.flatMap((entry) => isGroup(entry) ? entry.items : [entry]);
3165
+ const items = [{
3166
+ value: null,
3167
+ label: props.placeholder ?? "Select..."
3168
+ }, ...flatten(options).map((opt) => ({
3169
+ value: opt.value,
3170
+ label: opt.label
3171
+ }))];
3172
+ return /* @__PURE__ */ jsxs(Select, {
3173
+ items,
3174
+ value: props.value || null,
3175
+ disabled: props.disabled ?? false,
3176
+ readOnly: props.readonly ?? false,
3177
+ required: props.required ?? false,
3178
+ name: props.name,
3179
+ form: props.form,
3180
+ autoComplete: props.autoComplete,
3181
+ open: props.open ?? props.defaultOpen ?? false,
3182
+ modal: props.modal ?? true,
3183
+ highlightItemOnHover: props.highlightItemOnHover ?? true,
3184
+ onOpenChange: (open) => {
3185
+ host.removeAttribute("default-open");
3186
+ if (open) host.setAttribute("open", "true");
3187
+ else host.removeAttribute("open");
3188
+ emit("edx-open-change", { open });
3189
+ },
3190
+ onValueChange: (next) => {
3191
+ const value = next === null ? "" : String(next);
3192
+ host.setAttribute("value", value);
3193
+ emit("edx-change", { value });
3194
+ },
3195
+ children: [/* @__PURE__ */ jsx(SelectTrigger, {
3196
+ size: props.size ?? "default",
3197
+ disabled: props.disabled ?? false,
3198
+ "aria-label": props.ariaLabel ?? props.label ?? props.placeholder ?? "Select an option",
3199
+ "aria-description": props.ariaDescription,
3200
+ "aria-invalid": props.invalid || void 0,
3201
+ children: /* @__PURE__ */ jsx(SelectValue, {})
3202
+ }), /* @__PURE__ */ jsx(SelectContent, {
3203
+ portalContainer: portalContainer ?? void 0,
3204
+ children: renderOptions()
3205
+ })]
3206
+ });
3207
+ };
3208
+ var registerEdxSelect = (ctx) => {
3209
+ defineElement("edx-select", EdxSelect, {
3210
+ mode: ctx.mode,
3211
+ styles: ctx.styles,
3212
+ display: "block",
3213
+ delegateClick: true,
3214
+ formAssociated: true,
3215
+ formValue: (props) => props.value ?? "",
3216
+ observedAttributes: [
3217
+ "options",
3218
+ "value",
3219
+ "placeholder",
3220
+ "disabled",
3221
+ "readonly",
3222
+ "required",
3223
+ "name",
3224
+ "form",
3225
+ "autocomplete",
3226
+ "open",
3227
+ "default-open",
3228
+ "modal",
3229
+ "highlight-item-on-hover",
3230
+ "size",
3231
+ "label",
3232
+ "aria-label",
3233
+ "aria-description",
3234
+ "invalid"
3235
+ ],
3236
+ transformProps: (raw) => ({
3237
+ options: coerceJson(raw.options),
3238
+ value: raw.value ?? void 0,
3239
+ placeholder: raw.placeholder ?? void 0,
3240
+ disabled: coerceBool(raw.disabled),
3241
+ readonly: coerceBool(raw.readonly),
3242
+ required: coerceBool(raw.required),
3243
+ name: raw.name ?? void 0,
3244
+ form: raw.form ?? void 0,
3245
+ autoComplete: raw.autocomplete ?? void 0,
3246
+ open: raw.open == null ? void 0 : coerceBool(raw.open),
3247
+ defaultOpen: raw["default-open"] == null ? void 0 : coerceBool(raw["default-open"]),
3248
+ modal: raw.modal == null ? void 0 : coerceBool(raw.modal),
3249
+ highlightItemOnHover: raw["highlight-item-on-hover"] == null ? void 0 : coerceBool(raw["highlight-item-on-hover"]),
3250
+ size: raw.size ?? void 0,
3251
+ label: raw.label ?? void 0,
3252
+ ariaLabel: raw["aria-label"] ?? void 0,
3253
+ ariaDescription: raw["aria-description"] ?? void 0,
3254
+ invalid: coerceBool(raw.invalid)
3255
+ }),
3256
+ domProperties: {
3257
+ value: {
3258
+ get: (host) => host.getAttribute("value") ?? "",
3259
+ set: (host, value) => {
3260
+ host.setAttribute("value", String(value ?? ""));
3261
+ }
3262
+ },
3263
+ open: booleanDomProperty("open", "default-open")
3264
+ }
3265
+ });
3266
+ };
3267
+ //#endregion
3268
+ //#region ../elements/src/edx-separator.tsx
3269
+ var EdxSeparator = (props) => {
3270
+ return /* @__PURE__ */ jsx(Separator, { orientation: props.orientation ?? "horizontal" });
3271
+ };
3272
+ var registerEdxSeparator = (ctx) => {
3273
+ defineElement("edx-separator", EdxSeparator, {
3274
+ mode: ctx.mode,
3275
+ styles: ctx.styles,
3276
+ observedAttributes: ["orientation"],
3277
+ transformProps: (raw) => ({ orientation: raw.orientation ?? void 0 })
3278
+ });
3279
+ };
3280
+ //#endregion
3281
+ //#region ../elements/src/edx-skeleton.tsx
3282
+ var EdxSkeleton = (props) => {
3283
+ const radiusClasses = props.class?.split(/\s+/).filter((className) => className === "rounded" || className.startsWith("rounded-")).join(" ");
3284
+ return /* @__PURE__ */ jsx(Skeleton, { className: cn("size-full", radiusClasses) });
3285
+ };
3286
+ var registerEdxSkeleton = (ctx) => {
3287
+ defineElement("edx-skeleton", EdxSkeleton, {
3288
+ mode: ctx.mode,
3289
+ styles: ctx.styles,
3290
+ display: "block",
3291
+ observedAttributes: ["class"],
3292
+ transformProps: (raw) => ({ class: raw.class ?? void 0 })
3293
+ });
3294
+ };
3295
+ //#endregion
3296
+ //#region ../elements/src/edx-slider.tsx
3297
+ var parseSliderValue = (raw) => {
3298
+ const range = coerceJson(raw);
3299
+ if (Array.isArray(range) && range.length > 0 && range.every((item) => typeof item === "number" && Number.isFinite(item))) return range;
3300
+ return coerceNumber(raw);
3301
+ };
3302
+ var serializeSliderValue = (value) => {
3303
+ return Array.isArray(value) ? JSON.stringify(value) : String(value);
3304
+ };
3305
+ var EdxSlider = (props) => {
3306
+ const { emit, host } = useEdxHost();
3307
+ return /* @__PURE__ */ jsx(Slider, {
3308
+ value: props.value,
3309
+ defaultValue: props.defaultValue,
3310
+ min: props.min,
3311
+ max: props.max,
3312
+ step: props.step,
3313
+ minStepsBetweenValues: props.minStepsBetweenValues,
3314
+ disabled: props.disabled ?? false,
3315
+ "aria-invalid": props.invalid || void 0,
3316
+ name: props.name,
3317
+ "aria-label": props.ariaLabel,
3318
+ "aria-description": props.ariaDescription,
3319
+ onValueChange: (next) => {
3320
+ const value = Array.isArray(next) ? [...next] : Number(next);
3321
+ host.removeAttribute("default-value");
3322
+ host.setAttribute("value", serializeSliderValue(value));
3323
+ emit("edx-input", { value });
3324
+ },
3325
+ onValueCommitted: (next) => {
3326
+ const value = Array.isArray(next) ? [...next] : Number(next);
3327
+ host.removeAttribute("default-value");
3328
+ host.setAttribute("value", serializeSliderValue(value));
3329
+ emit("edx-change", { value });
3330
+ }
3331
+ });
3332
+ };
3333
+ var registerEdxSlider = (ctx) => {
3334
+ defineElement("edx-slider", EdxSlider, {
3335
+ mode: ctx.mode,
3336
+ styles: ctx.styles,
3337
+ display: "block",
3338
+ delegateClick: true,
3339
+ formAssociated: true,
3340
+ formValue: (props, host) => {
3341
+ const value = props.value ?? props.defaultValue;
3342
+ if (Array.isArray(value)) return multipleFormValue(host, value.map((item) => String(item)));
3343
+ return value == null ? null : String(value);
3344
+ },
3345
+ observedAttributes: [
3346
+ "value",
3347
+ "default-value",
3348
+ "min",
3349
+ "max",
3350
+ "step",
3351
+ "min-steps-between-values",
3352
+ "disabled",
3353
+ "invalid",
3354
+ "name",
3355
+ "aria-label",
3356
+ "aria-description"
3357
+ ],
3358
+ transformProps: (raw) => ({
3359
+ value: parseSliderValue(raw.value),
3360
+ defaultValue: parseSliderValue(raw["default-value"]),
3361
+ min: coerceNumber(raw.min),
3362
+ max: coerceNumber(raw.max),
3363
+ step: coerceNumber(raw.step),
3364
+ minStepsBetweenValues: coerceNumber(raw["min-steps-between-values"]),
3365
+ disabled: coerceBool(raw.disabled),
3366
+ invalid: coerceBool(raw.invalid),
3367
+ name: raw.name ?? void 0,
3368
+ ariaLabel: raw["aria-label"] ?? void 0,
3369
+ ariaDescription: raw["aria-description"] ?? void 0
3370
+ }),
3371
+ domProperties: { value: {
3372
+ get: (host) => {
3373
+ return parseSliderValue(host.getAttribute("value")) ?? parseSliderValue(host.getAttribute("default-value"));
3374
+ },
3375
+ set: (host, value) => {
3376
+ if (Array.isArray(value)) host.setAttribute("value", JSON.stringify(value));
3377
+ else host.setAttribute("value", String(value ?? ""));
3378
+ }
3379
+ } }
3380
+ });
3381
+ };
3382
+ //#endregion
3383
+ //#region ../elements/src/edx-switch.tsx
3384
+ var EdxSwitch = (props) => {
3385
+ const { emit, host } = useEdxHost();
3386
+ return /* @__PURE__ */ jsx(Switch, {
3387
+ checked: props.checked ?? props.defaultChecked ?? false,
3388
+ disabled: props.disabled ?? false,
3389
+ readOnly: props.readonly ?? false,
3390
+ required: props.required ?? false,
3391
+ name: props.name,
3392
+ form: props.form,
3393
+ value: props.value,
3394
+ uncheckedValue: props.uncheckedValue,
3395
+ size: props.size ?? "default",
3396
+ "aria-invalid": props.invalid || void 0,
3397
+ "aria-label": props.ariaLabel,
3398
+ "aria-description": props.ariaDescription,
3399
+ onCheckedChange: (next) => {
3400
+ const checked = next === true;
3401
+ host.removeAttribute("default-checked");
3402
+ if (checked) host.setAttribute("checked", "true");
3403
+ else host.removeAttribute("checked");
3404
+ emit("edx-change", { checked });
3405
+ }
3406
+ });
3407
+ };
3408
+ var registerEdxSwitch = (ctx) => {
3409
+ defineElement("edx-switch", EdxSwitch, {
3410
+ mode: ctx.mode,
3411
+ styles: ctx.styles,
3412
+ display: "inline-flex",
3413
+ delegateClick: true,
3414
+ formAssociated: true,
3415
+ formValue: (props) => {
3416
+ return props.checked ?? props.defaultChecked ?? false ? props.value ?? "on" : props.uncheckedValue ?? null;
3417
+ },
3418
+ observedAttributes: [
3419
+ "checked",
3420
+ "default-checked",
3421
+ "disabled",
3422
+ "readonly",
3423
+ "required",
3424
+ "name",
3425
+ "form",
3426
+ "value",
3427
+ "unchecked-value",
3428
+ "size",
3429
+ "invalid",
3430
+ "aria-label",
3431
+ "aria-description"
3432
+ ],
3433
+ transformProps: (raw) => ({
3434
+ checked: raw.checked == null ? void 0 : coerceBool(raw.checked),
3435
+ defaultChecked: raw["default-checked"] == null ? void 0 : coerceBool(raw["default-checked"]),
3436
+ disabled: coerceBool(raw.disabled),
3437
+ readonly: coerceBool(raw.readonly),
3438
+ required: coerceBool(raw.required),
3439
+ name: raw.name ?? void 0,
3440
+ form: raw.form ?? void 0,
3441
+ value: raw.value ?? void 0,
3442
+ uncheckedValue: raw["unchecked-value"] ?? void 0,
3443
+ size: raw.size ?? void 0,
3444
+ invalid: coerceBool(raw.invalid),
3445
+ ariaLabel: raw["aria-label"] ?? void 0,
3446
+ ariaDescription: raw["aria-description"] ?? void 0
3447
+ }),
3448
+ domProperties: { checked: booleanDomProperty("checked", "default-checked") }
3449
+ });
3450
+ };
3451
+ //#endregion
3452
+ //#region ../elements/src/edx-table.tsx
3453
+ /** Map a column alignment to the Tailwind class shared by the header and its cells. */
3454
+ var alignClass = (align) => {
3455
+ if (align === "center") return "text-center";
3456
+ if (align === "right") return "text-right";
3457
+ };
3458
+ var EdxTable = (props) => {
3459
+ const columns = props.columns ?? [];
3460
+ const rows = props.rows ?? [];
3461
+ return /* @__PURE__ */ jsxs(Table, { children: [
3462
+ props.caption ? /* @__PURE__ */ jsx(TableCaption, { children: props.caption }) : null,
3463
+ /* @__PURE__ */ jsx(TableHeader, { children: /* @__PURE__ */ jsx(TableRow, { children: columns.map((col) => /* @__PURE__ */ jsx(TableHead, {
3464
+ className: alignClass(col.align),
3465
+ children: col.header
3466
+ }, col.key)) }) }),
3467
+ /* @__PURE__ */ jsx(TableBody, { children: rows.map((row, rowIndex) => /* @__PURE__ */ jsx(TableRow, { children: columns.map((col) => /* @__PURE__ */ jsx(TableCell, {
3468
+ className: alignClass(col.align),
3469
+ children: row[col.key] ?? ""
3470
+ }, col.key)) }, rowIndex)) })
3471
+ ] });
3472
+ };
3473
+ var registerEdxTable = (ctx) => {
3474
+ defineElement("edx-table", EdxTable, {
3475
+ mode: ctx.mode,
3476
+ styles: ctx.styles,
3477
+ observedAttributes: [
3478
+ "columns",
3479
+ "rows",
3480
+ "caption"
3481
+ ],
3482
+ transformProps: (raw) => ({
3483
+ columns: coerceJson(raw.columns) ?? [],
3484
+ rows: coerceJson(raw.rows) ?? [],
3485
+ caption: raw.caption ?? void 0
3486
+ })
3487
+ });
3488
+ };
3489
+ //#endregion
3490
+ //#region ../elements/src/edx-tabs.tsx
3491
+ var EdxTabs = (props) => {
3492
+ const { emit, host } = useEdxHost();
3493
+ const items = props.tabs ?? [];
3494
+ const firstValue = items[0]?.value ?? "";
3495
+ const currentValue = props.value ?? props.defaultTab ?? firstValue;
3496
+ return /* @__PURE__ */ jsxs(Tabs, {
3497
+ value: currentValue,
3498
+ orientation: props.orientation ?? "horizontal",
3499
+ onValueChange: (next) => {
3500
+ host.setAttribute("value", next);
3501
+ emit("edx-change", { value: next });
3502
+ },
3503
+ children: [/* @__PURE__ */ jsx(TabsList, {
3504
+ variant: props.variant ?? "default",
3505
+ children: items.map((item) => /* @__PURE__ */ jsx(TabsTrigger, {
3506
+ value: item.value,
3507
+ disabled: item.disabled,
3508
+ children: item.label
3509
+ }, item.value))
3510
+ }), items.map((item) => /* @__PURE__ */ jsx(TabsContent, {
3511
+ value: item.value,
3512
+ keepMounted: true,
3513
+ children: /* @__PURE__ */ jsx(Slot, { name: `panel-${item.value}` })
3514
+ }, item.value))]
3515
+ });
3516
+ };
3517
+ var registerEdxTabs = (ctx) => {
3518
+ defineElement("edx-tabs", EdxTabs, {
3519
+ mode: "shadow",
3520
+ styles: ctx.styles,
3521
+ observedAttributes: [
3522
+ "tabs",
3523
+ "value",
3524
+ "default-tab",
3525
+ "variant",
3526
+ "orientation"
3527
+ ],
3528
+ transformProps: (raw) => ({
3529
+ tabs: coerceJson(raw.tabs),
3530
+ value: raw.value ?? void 0,
3531
+ defaultTab: raw["default-tab"] ?? void 0,
3532
+ variant: raw.variant ?? void 0,
3533
+ orientation: raw.orientation ?? void 0
3534
+ }),
3535
+ domProperties: { value: {
3536
+ get: (host) => {
3537
+ const explicitValue = host.getAttribute("value");
3538
+ if (explicitValue != null) return explicitValue;
3539
+ const defaultTab = host.getAttribute("default-tab");
3540
+ if (defaultTab != null) return defaultTab;
3541
+ return coerceJson(host.getAttribute("tabs"))?.[0]?.value ?? "";
3542
+ },
3543
+ set: (host, value) => {
3544
+ host.setAttribute("value", String(value ?? ""));
3545
+ }
3546
+ } }
3547
+ });
3548
+ };
3549
+ //#endregion
3550
+ //#region ../elements/src/edx-textarea.tsx
3551
+ var EdxTextarea = (props) => {
3552
+ const { emit, host } = useEdxHost();
3553
+ return /* @__PURE__ */ jsx(Textarea, {
3554
+ value: props.value ?? "",
3555
+ placeholder: props.placeholder,
3556
+ disabled: props.disabled ?? false,
3557
+ readOnly: props.readonly ?? false,
3558
+ required: props.required ?? false,
3559
+ rows: props.rows,
3560
+ "aria-invalid": props.invalid || void 0,
3561
+ name: props.name,
3562
+ form: props.form,
3563
+ autoComplete: props.autoComplete,
3564
+ minLength: props.minLength,
3565
+ maxLength: props.maxLength,
3566
+ wrap: props.wrap,
3567
+ spellCheck: props.spellCheck,
3568
+ autoFocus: props.autoFocus,
3569
+ "aria-label": props.ariaLabel,
3570
+ "aria-description": props.ariaDescription,
3571
+ onChange: (event) => {
3572
+ const { value } = event.target;
3573
+ host.setAttribute("value", value);
3574
+ emit("edx-change", { value });
3575
+ }
3576
+ });
3577
+ };
3578
+ var registerEdxTextarea = (ctx) => {
3579
+ defineElement("edx-textarea", EdxTextarea, {
3580
+ mode: ctx.mode,
3581
+ styles: ctx.styles,
3582
+ display: "flex",
3583
+ delegateClick: true,
3584
+ formAssociated: true,
3585
+ formValue: (props) => props.value ?? "",
3586
+ observedAttributes: [
3587
+ "value",
3588
+ "placeholder",
3589
+ "disabled",
3590
+ "readonly",
3591
+ "required",
3592
+ "rows",
3593
+ "invalid",
3594
+ "name",
3595
+ "form",
3596
+ "autocomplete",
3597
+ "minlength",
3598
+ "maxlength",
3599
+ "wrap",
3600
+ "spellcheck",
3601
+ "autofocus",
3602
+ "aria-label",
3603
+ "aria-description"
3604
+ ],
3605
+ transformProps: (raw) => ({
3606
+ value: raw.value ?? void 0,
3607
+ placeholder: raw.placeholder ?? void 0,
3608
+ disabled: coerceBool(raw.disabled),
3609
+ readonly: coerceBool(raw.readonly),
3610
+ required: coerceBool(raw.required),
3611
+ rows: coerceNumber(raw.rows),
3612
+ invalid: coerceBool(raw.invalid),
3613
+ name: raw.name ?? void 0,
3614
+ form: raw.form ?? void 0,
3615
+ autoComplete: raw.autocomplete ?? void 0,
3616
+ minLength: coerceNumber(raw.minlength),
3617
+ maxLength: coerceNumber(raw.maxlength),
3618
+ wrap: raw.wrap ?? void 0,
3619
+ spellCheck: raw.spellcheck == null ? void 0 : coerceBool(raw.spellcheck),
3620
+ autoFocus: coerceBool(raw.autofocus),
3621
+ ariaLabel: raw["aria-label"] ?? void 0,
3622
+ ariaDescription: raw["aria-description"] ?? void 0
3623
+ }),
3624
+ domProperties: { value: {
3625
+ get: (host) => host.getAttribute("value") ?? "",
3626
+ set: (host, value) => {
3627
+ host.setAttribute("value", String(value ?? ""));
3628
+ }
3629
+ } }
3630
+ });
3631
+ };
3632
+ //#endregion
3633
+ //#region ../elements/src/edx-toggle.tsx
3634
+ var EdxToggle = (props) => {
3635
+ const { emit, host } = useEdxHost();
3636
+ return /* @__PURE__ */ jsx(Toggle, {
3637
+ pressed: props.pressed ?? props.defaultPressed ?? false,
3638
+ disabled: props.disabled ?? false,
3639
+ value: props.value,
3640
+ variant: props.variant ?? "default",
3641
+ size: props.size ?? "default",
3642
+ "aria-label": props.ariaLabel,
3643
+ "aria-description": props.ariaDescription,
3644
+ name: props.name,
3645
+ form: props.form,
3646
+ type: props.type ?? "button",
3647
+ autoFocus: props.autofocus,
3648
+ onPressedChange: (next) => {
3649
+ const pressed = next === true;
3650
+ host.removeAttribute("default-pressed");
3651
+ if (pressed) host.setAttribute("pressed", "true");
3652
+ else host.removeAttribute("pressed");
3653
+ emit("edx-change", { pressed });
3654
+ },
3655
+ children: /* @__PURE__ */ jsx(Slot, {})
3656
+ });
3657
+ };
3658
+ var registerEdxToggle = (ctx) => {
3659
+ defineElement("edx-toggle", EdxToggle, {
3660
+ mode: ctx.mode,
3661
+ styles: ctx.styles,
3662
+ display: "inline-flex",
3663
+ delegateClick: true,
3664
+ observedAttributes: [
3665
+ "pressed",
3666
+ "default-pressed",
3667
+ "disabled",
3668
+ "value",
3669
+ "variant",
3670
+ "size",
3671
+ "aria-label",
3672
+ "aria-description",
3673
+ "name",
3674
+ "form",
3675
+ "type",
3676
+ "autofocus"
3677
+ ],
3678
+ transformProps: (raw) => ({
3679
+ pressed: raw.pressed == null ? void 0 : coerceBool(raw.pressed),
3680
+ defaultPressed: raw["default-pressed"] == null ? void 0 : coerceBool(raw["default-pressed"]),
3681
+ disabled: coerceBool(raw.disabled),
3682
+ value: raw.value ?? void 0,
3683
+ variant: raw.variant ?? void 0,
3684
+ size: raw.size ?? void 0,
3685
+ ariaLabel: raw["aria-label"] ?? void 0,
3686
+ ariaDescription: raw["aria-description"] ?? void 0,
3687
+ name: raw.name ?? void 0,
3688
+ form: raw.form ?? void 0,
3689
+ type: raw.type ?? void 0,
3690
+ autofocus: coerceBool(raw.autofocus)
3691
+ }),
3692
+ domProperties: { pressed: booleanDomProperty("pressed", "default-pressed") }
3693
+ });
3694
+ };
3695
+ //#endregion
3696
+ //#region ../elements/src/edx-toggle-group.tsx
3697
+ var EdxToggleGroup = (props) => {
3698
+ const { emit, host } = useEdxHost();
3699
+ const options = props.options ?? [];
3700
+ const multiple = props.multiple ?? false;
3701
+ const variant = props.variant ?? "default";
3702
+ const size = props.size ?? "default";
3703
+ const disabled = props.disabled ?? false;
3704
+ const orientation = props.orientation ?? "horizontal";
3705
+ const spacing = props.spacing ?? 2;
3706
+ const rawValue = props.value ?? props.defaultValue;
3707
+ const groupValue = (() => {
3708
+ if (rawValue == null) return [];
3709
+ if (Array.isArray(rawValue)) return rawValue;
3710
+ return [rawValue];
3711
+ })();
3712
+ const handleValueChange = (next) => {
3713
+ const emitValue = multiple ? next : next[0] ?? "";
3714
+ const serialized = multiple ? JSON.stringify(next) : next[0] ?? "";
3715
+ host.removeAttribute("default-value");
3716
+ host.setAttribute("value", serialized);
3717
+ emit("edx-change", { value: emitValue });
3718
+ };
3719
+ return /* @__PURE__ */ jsx(ToggleGroup, {
3720
+ value: groupValue,
3721
+ multiple,
3722
+ variant,
3723
+ size,
3724
+ disabled,
3725
+ orientation,
3726
+ spacing,
3727
+ loopFocus: props.loopFocus ?? true,
3728
+ "aria-invalid": props.invalid || void 0,
3729
+ "aria-label": props.ariaLabel,
3730
+ "aria-description": props.ariaDescription,
3731
+ onValueChange: handleValueChange,
3732
+ children: options.map((opt) => /* @__PURE__ */ jsx(ToggleGroupItem, {
3733
+ value: opt.value,
3734
+ disabled: opt.disabled,
3735
+ children: opt.label
3736
+ }, opt.value))
3737
+ });
3738
+ };
3739
+ var registerEdxToggleGroup = (ctx) => {
3740
+ defineElement("edx-toggle-group", EdxToggleGroup, {
3741
+ mode: ctx.mode,
3742
+ styles: ctx.styles,
3743
+ display: "block",
3744
+ formAssociated: true,
3745
+ formValue: (props, host) => {
3746
+ const value = props.value ?? props.defaultValue;
3747
+ if (Array.isArray(value)) return multipleFormValue(host, value);
3748
+ return value ?? null;
3749
+ },
3750
+ observedAttributes: [
3751
+ "options",
3752
+ "value",
3753
+ "default-value",
3754
+ "multiple",
3755
+ "variant",
3756
+ "size",
3757
+ "disabled",
3758
+ "orientation",
3759
+ "spacing",
3760
+ "loop-focus",
3761
+ "name",
3762
+ "invalid",
3763
+ "aria-label",
3764
+ "aria-description"
3765
+ ],
3766
+ transformProps: (raw) => {
3767
+ const options = coerceJson(raw.options) ?? [];
3768
+ const multiple = coerceBool(raw.multiple);
3769
+ const parseValue = (input) => {
3770
+ if (input == null) return;
3771
+ if (input === "") return multiple ? [] : "";
3772
+ if (multiple) return coerceJson(input) ?? [input];
3773
+ return input;
3774
+ };
3775
+ return {
3776
+ options,
3777
+ value: parseValue(raw.value),
3778
+ defaultValue: parseValue(raw["default-value"]),
3779
+ multiple,
3780
+ variant: raw.variant ?? void 0,
3781
+ size: raw.size ?? void 0,
3782
+ disabled: coerceBool(raw.disabled),
3783
+ orientation: raw.orientation ?? void 0,
3784
+ spacing: raw.spacing == null ? void 0 : Number(raw.spacing),
3785
+ loopFocus: raw["loop-focus"] == null ? void 0 : coerceBool(raw["loop-focus"]),
3786
+ name: raw.name ?? void 0,
3787
+ invalid: coerceBool(raw.invalid),
3788
+ ariaLabel: raw["aria-label"] ?? void 0,
3789
+ ariaDescription: raw["aria-description"] ?? void 0
3790
+ };
3791
+ },
3792
+ domProperties: { value: {
3793
+ get: (host) => {
3794
+ const raw = host.getAttribute("value") ?? host.getAttribute("default-value") ?? "";
3795
+ if (host.hasAttribute("multiple")) return coerceJson(raw) ?? (raw === "" ? [] : [raw]);
3796
+ return raw;
3797
+ },
3798
+ set: (host, value) => {
3799
+ if (Array.isArray(value)) {
3800
+ host.setAttribute("multiple", "");
3801
+ host.setAttribute("value", JSON.stringify(value));
3802
+ return;
3803
+ }
3804
+ host.setAttribute("value", String(value ?? ""));
3805
+ }
3806
+ } }
3807
+ });
3808
+ };
3809
+ //#endregion
3810
+ //#region ../elements/src/edx-tooltip.tsx
3811
+ /**
3812
+ * Hover/focus overlay, the same light-mode pattern as edx-dialog and edx-drawer
3813
+ * (registered via registerOverlayElement, which pins mode:'light' so the Base UI
3814
+ * portal can land in document.body). Content is fully attribute-driven (no
3815
+ * `<Slot />`): a tooltip's popup body is short label text, not arbitrary markup.
3816
+ */
3817
+ var EdxTooltip = (props) => {
3818
+ const { emit, host } = useEdxHost();
3819
+ return /* @__PURE__ */ jsx(TooltipProvider, {
3820
+ delay: props.delay,
3821
+ closeDelay: props.closeDelay,
3822
+ children: /* @__PURE__ */ jsxs(Tooltip, {
3823
+ open: props.open ?? props.defaultOpen ?? false,
3824
+ disabled: props.disabled,
3825
+ disableHoverablePopup: props.disableHoverablePopup,
3826
+ trackCursorAxis: props.trackCursorAxis === "none" ? void 0 : props.trackCursorAxis,
3827
+ onOpenChange: (open) => {
3828
+ host.removeAttribute("default-open");
3829
+ reflectBool(host, "open", open);
3830
+ emit("edx-change", { open });
3831
+ },
3832
+ children: [/* @__PURE__ */ jsx(TooltipTrigger, {
3833
+ render: /* @__PURE__ */ jsx(Button, { variant: "outline" }),
3834
+ closeDelay: props.closeDelay,
3835
+ closeOnClick: props.closeOnClick ?? true,
3836
+ children: props.triggerLabel ?? "Hover"
3837
+ }), /* @__PURE__ */ jsx(TooltipContent, {
3838
+ side: props.side ?? "top",
3839
+ align: props.align ?? "center",
3840
+ sideOffset: props.sideOffset ?? 4,
3841
+ alignOffset: props.alignOffset,
3842
+ children: props.content ?? ""
3843
+ })]
3844
+ })
3845
+ });
3846
+ };
3847
+ var registerEdxTooltip = (ctx) => {
3848
+ registerOverlayElement("edx-tooltip", EdxTooltip, ctx, {
3849
+ display: "inline-flex",
3850
+ observedAttributes: [
3851
+ "trigger-label",
3852
+ "content",
3853
+ "side",
3854
+ "align",
3855
+ "side-offset",
3856
+ "align-offset",
3857
+ "open",
3858
+ "default-open",
3859
+ "delay",
3860
+ "close-delay",
3861
+ "disabled",
3862
+ "close-on-click",
3863
+ "disable-hoverable-popup",
3864
+ "track-cursor-axis"
3865
+ ],
3866
+ transformProps: (raw) => ({
3867
+ triggerLabel: raw["trigger-label"] ?? void 0,
3868
+ content: raw.content ?? void 0,
3869
+ side: raw.side ?? void 0,
3870
+ align: raw.align ?? void 0,
3871
+ sideOffset: coerceNumber(raw["side-offset"]),
3872
+ alignOffset: coerceNumber(raw["align-offset"]),
3873
+ open: raw.open == null ? void 0 : coerceBool(raw.open),
3874
+ defaultOpen: raw["default-open"] == null ? void 0 : coerceBool(raw["default-open"]),
3875
+ delay: coerceNumber(raw.delay),
3876
+ closeDelay: coerceNumber(raw["close-delay"]),
3877
+ disabled: raw.disabled == null ? void 0 : coerceBool(raw.disabled),
3878
+ closeOnClick: raw["close-on-click"] == null ? void 0 : coerceBool(raw["close-on-click"]),
3879
+ disableHoverablePopup: raw["disable-hoverable-popup"] == null ? void 0 : coerceBool(raw["disable-hoverable-popup"]),
3880
+ trackCursorAxis: raw["track-cursor-axis"] ?? void 0
3881
+ }),
3882
+ domProperties: { open: booleanDomProperty("open", "default-open") }
3883
+ });
3884
+ };
3885
+ //#endregion
3886
+ //#region ../elements/src/edx-video-player.tsx
3887
+ var EdxVideoPlayer = (props) => {
3888
+ const { emit } = useEdxHost();
3889
+ return /* @__PURE__ */ jsx(VideoPlayer, {
3890
+ src: props.src,
3891
+ poster: props.poster,
3892
+ title: props.title,
3893
+ description: props.description,
3894
+ muted: props.muted ?? false,
3895
+ loop: props.loop ?? false,
3896
+ disabled: props.disabled ?? false,
3897
+ width: props.width,
3898
+ height: props.height,
3899
+ ratio: props.ratio,
3900
+ "aria-label": props.ariaLabel ?? "Video player",
3901
+ onPlay: () => emit("edx-play", {}),
3902
+ onPause: () => emit("edx-pause", {}),
3903
+ onEnded: () => emit("edx-ended", {}),
3904
+ onTimeUpdate: (currentTime, duration) => emit("edx-timeupdate", {
3905
+ currentTime,
3906
+ duration
3907
+ })
3908
+ });
3909
+ };
3910
+ var registerEdxVideoPlayer = (ctx) => {
3911
+ defineElement("edx-video-player", EdxVideoPlayer, {
3912
+ mode: ctx.mode,
3913
+ styles: ctx.styles,
3914
+ display: "block",
3915
+ observedAttributes: [
3916
+ "src",
3917
+ "poster",
3918
+ "title",
3919
+ "description",
3920
+ "muted",
3921
+ "loop",
3922
+ "disabled",
3923
+ "width",
3924
+ "height",
3925
+ "ratio",
3926
+ "aria-label"
3927
+ ],
3928
+ transformProps: (raw) => ({
3929
+ src: raw.src ?? void 0,
3930
+ poster: raw.poster ?? void 0,
3931
+ title: raw.title ?? void 0,
3932
+ description: raw.description ?? void 0,
3933
+ muted: coerceBool(raw.muted),
3934
+ loop: coerceBool(raw.loop),
3935
+ disabled: coerceBool(raw.disabled),
3936
+ width: raw.width ?? void 0,
3937
+ height: raw.height ?? void 0,
3938
+ ratio: raw.ratio ?? void 0,
3939
+ ariaLabel: raw["aria-label"] ?? void 0
3940
+ })
3941
+ });
3942
+ };
3943
+ //#endregion
3944
+ //#region ../elements/src/index.ts
3945
+ var REGISTRARS = [
3946
+ registerEdxAccordion,
3947
+ registerEdxAlert,
3948
+ registerEdxAudioPlayer,
3949
+ registerEdxAvatar,
3950
+ registerEdxBadge,
3951
+ registerEdxBreadcrumb,
3952
+ registerEdxButton,
3953
+ registerEdxButtonGroup,
3954
+ registerEdxCalendar,
3955
+ registerEdxCard,
3956
+ registerEdxCheckbox,
3957
+ registerEdxCombobox,
3958
+ registerEdxContentComponents,
3959
+ registerEdxDialog,
3960
+ registerEdxDrawer,
3961
+ registerEdxDropdownMenu,
3962
+ registerEdxField,
3963
+ registerEdxIndicator,
3964
+ registerEdxInput,
3965
+ registerEdxInputGroup,
3966
+ registerEdxInputOtp,
3967
+ registerEdxInteractiveComponents,
3968
+ registerEdxLabel,
3969
+ registerEdxPagination,
3970
+ registerEdxPopover,
3971
+ registerEdxProgress,
3972
+ registerEdxRadioGroup,
3973
+ registerEdxScrollArea,
3974
+ registerEdxSelect,
3975
+ registerEdxSeparator,
3976
+ registerEdxSkeleton,
3977
+ registerEdxSlider,
3978
+ registerEdxSwitch,
3979
+ registerEdxTable,
3980
+ registerEdxTextarea,
3981
+ registerEdxTabs,
3982
+ registerEdxToggle,
3983
+ registerEdxToggleGroup,
3984
+ registerEdxTooltip,
3985
+ registerEdxVideoPlayer
3986
+ ];
3987
+ /**
3988
+ * Register every Edynamix custom element. Call once at startup. Pass `mode`
3989
+ * (or call setDefaultMode first) plus `styles` for shadow mode.
3990
+ */
3991
+ var registerElements$1 = (options = {}) => {
3992
+ const ctx = {
3993
+ mode: options.mode,
3994
+ styles: options.styles
3995
+ };
3996
+ for (const register of REGISTRARS) register(ctx);
3997
+ };
3998
+ //#endregion
3999
+ //#region src/styles.css?inline
4000
+ var styles_default = "/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */\n@layer properties {\n @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {\n :root, :host {\n --shimmer-angle: 20deg;\n }\n\n *, :before, :after, ::backdrop {\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-translate-z: 0;\n --tw-scroll-snap-strictness: proximity;\n --tw-space-y-reverse: 0;\n --tw-space-x-reverse: 0;\n --tw-border-style: solid;\n --tw-gradient-position: initial;\n --tw-gradient-from: #0000;\n --tw-gradient-via: #0000;\n --tw-gradient-to: #0000;\n --tw-gradient-stops: initial;\n --tw-gradient-via-stops: initial;\n --tw-gradient-from-position: 0%;\n --tw-gradient-via-position: 50%;\n --tw-gradient-to-position: 100%;\n --tw-leading: initial;\n --tw-font-weight: initial;\n --tw-tracking: initial;\n --tw-ordinal: initial;\n --tw-slashed-zero: initial;\n --tw-numeric-figure: initial;\n --tw-numeric-spacing: initial;\n --tw-numeric-fraction: initial;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-color: initial;\n --tw-shadow-alpha: 100%;\n --tw-inset-shadow: 0 0 #0000;\n --tw-inset-shadow-color: initial;\n --tw-inset-shadow-alpha: 100%;\n --tw-ring-color: initial;\n --tw-ring-shadow: 0 0 #0000;\n --tw-inset-ring-color: initial;\n --tw-inset-ring-shadow: 0 0 #0000;\n --tw-ring-inset: initial;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-outline-style: solid;\n --tw-duration: initial;\n --tw-ease: initial;\n --tw-content: \"\";\n --tw-scrollbar-thumb: #0000;\n --tw-scrollbar-track: #0000;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-scale-z: 1;\n --tw-backdrop-blur: initial;\n --tw-backdrop-brightness: initial;\n --tw-backdrop-contrast: initial;\n --tw-backdrop-grayscale: initial;\n --tw-backdrop-hue-rotate: initial;\n --tw-backdrop-invert: initial;\n --tw-backdrop-opacity: initial;\n --tw-backdrop-saturate: initial;\n --tw-backdrop-sepia: initial;\n --tw-animation-delay: 0s;\n --tw-animation-direction: normal;\n --tw-animation-duration: initial;\n --tw-animation-fill-mode: none;\n --tw-animation-iteration-count: 1;\n --tw-enter-blur: 0;\n --tw-enter-opacity: 1;\n --tw-enter-rotate: 0;\n --tw-enter-scale: 1;\n --tw-enter-translate-x: 0;\n --tw-enter-translate-y: 0;\n --tw-exit-blur: 0;\n --tw-exit-opacity: 1;\n --tw-exit-rotate: 0;\n --tw-exit-scale: 1;\n --tw-exit-translate-x: 0;\n --tw-exit-translate-y: 0;\n --scroll-fade-t: 0px;\n --scroll-fade-b: 0px;\n --scroll-fade-s: 0px;\n --scroll-fade-e: 0px;\n --scroll-fade-mask: initial;\n --shimmer-image: initial;\n --shimmer-text-fill: initial;\n }\n }\n}\n\n@layer theme {\n :root, :host {\n --font-sans: \"Inter\", sans-serif;\n --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\",\n \"Courier New\", monospace;\n --spacing: .25rem;\n --container-xs: 20rem;\n --container-sm: 24rem;\n --text-xs: .75rem;\n --text-xs--line-height: calc(1 / .75);\n --text-sm: .875rem;\n --text-sm--line-height: calc(1.25 / .875);\n --text-base: 1rem;\n --text-base--line-height: calc(1.5 / 1);\n --font-weight-normal: 400;\n --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --tracking-tight: -.025em;\n --tracking-widest: .1em;\n --leading-tight: 1.25;\n --leading-snug: 1.375;\n --leading-normal: 1.5;\n --leading-relaxed: 1.625;\n --radius-md: calc(var(--radius) * .8);\n --ease-out: cubic-bezier(0, 0, .2, 1);\n --ease-in-out: cubic-bezier(.4, 0, .2, 1);\n --animate-spin: spin 1s linear infinite;\n --animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;\n --blur-xs: 4px;\n --aspect-video: 16 / 9;\n --default-transition-duration: .15s;\n --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);\n --default-font-family: var(--font-sans);\n --default-mono-font-family: var(--font-mono);\n --color-border: var(--border);\n }\n}\n\n@layer base {\n *, :after, :before, ::backdrop {\n box-sizing: border-box;\n border: 0 solid;\n margin: 0;\n padding: 0;\n }\n\n ::file-selector-button {\n box-sizing: border-box;\n border: 0 solid;\n margin: 0;\n padding: 0;\n }\n\n html, :host {\n -webkit-text-size-adjust: 100%;\n tab-size: 4;\n line-height: 1.5;\n font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");\n font-feature-settings: var(--default-font-feature-settings, normal);\n font-variation-settings: var(--default-font-variation-settings, normal);\n -webkit-tap-highlight-color: transparent;\n }\n\n hr {\n height: 0;\n color: inherit;\n border-top-width: 1px;\n }\n\n abbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n }\n\n h1, h2, h3, h4, h5, h6 {\n font-size: inherit;\n font-weight: inherit;\n }\n\n a {\n color: inherit;\n -webkit-text-decoration: inherit;\n -webkit-text-decoration: inherit;\n -webkit-text-decoration: inherit;\n text-decoration: inherit;\n }\n\n b, strong {\n font-weight: bolder;\n }\n\n code, kbd, samp, pre {\n font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);\n font-feature-settings: var(--default-mono-font-feature-settings, normal);\n font-variation-settings: var(--default-mono-font-variation-settings, normal);\n font-size: 1em;\n }\n\n small {\n font-size: 80%;\n }\n\n sub, sup {\n vertical-align: baseline;\n font-size: 75%;\n line-height: 0;\n position: relative;\n }\n\n sub {\n bottom: -.25em;\n }\n\n sup {\n top: -.5em;\n }\n\n table {\n text-indent: 0;\n border-color: inherit;\n border-collapse: collapse;\n }\n\n :-moz-focusring {\n outline: auto;\n }\n\n progress {\n vertical-align: baseline;\n }\n\n summary {\n display: list-item;\n }\n\n ol, ul, menu {\n list-style: none;\n }\n\n img, svg, video, canvas, audio, iframe, embed, object {\n vertical-align: middle;\n display: block;\n }\n\n img, video {\n max-width: 100%;\n height: auto;\n }\n\n button, input, select, optgroup, textarea {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n opacity: 1;\n background-color: #0000;\n border-radius: 0;\n }\n\n ::file-selector-button {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n opacity: 1;\n background-color: #0000;\n border-radius: 0;\n }\n\n :where(select:is([multiple], [size])) optgroup {\n font-weight: bolder;\n }\n\n :where(select:is([multiple], [size])) optgroup option {\n padding-inline-start: 20px;\n }\n\n ::file-selector-button {\n margin-inline-end: 4px;\n }\n\n ::placeholder {\n opacity: 1;\n }\n\n @supports (not ((-webkit-appearance: -apple-pay-button))) or (contain-intrinsic-size: 1px) {\n ::placeholder {\n color: currentColor;\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n ::placeholder {\n color: color-mix(in oklab, currentcolor 50%, transparent);\n }\n }\n }\n\n textarea {\n resize: vertical;\n }\n\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n\n ::-webkit-date-and-time-value {\n min-height: 1lh;\n text-align: inherit;\n }\n\n ::-webkit-datetime-edit {\n display: inline-flex;\n }\n\n ::-webkit-datetime-edit-fields-wrapper {\n padding: 0;\n }\n\n ::-webkit-datetime-edit {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-year-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-month-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-day-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-hour-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-minute-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-second-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-millisecond-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-meridiem-field {\n padding-block: 0;\n }\n\n ::-webkit-calendar-picker-indicator {\n line-height: 1;\n }\n\n :-moz-ui-invalid {\n box-shadow: none;\n }\n\n button, input:where([type=\"button\"], [type=\"reset\"], [type=\"submit\"]) {\n appearance: button;\n }\n\n ::file-selector-button {\n appearance: button;\n }\n\n ::-webkit-inner-spin-button {\n height: auto;\n }\n\n ::-webkit-outer-spin-button {\n height: auto;\n }\n\n [hidden]:where(:not([hidden=\"until-found\"])) {\n display: none !important;\n }\n\n :root {\n color-scheme: light;\n }\n\n :root.dark, .dark {\n color-scheme: dark;\n }\n\n .edx-root, .edx-root *, .edx-root :before, .edx-root :after {\n box-sizing: border-box;\n border: 0 solid var(--border);\n }\n\n .edx-root {\n -webkit-font-smoothing: antialiased;\n color: var(--foreground);\n font-family: var(--font-sans, ui-sans-serif, system-ui, sans-serif);\n line-height: 1.5;\n }\n\n .edx-root .edx-root {\n color: inherit;\n font-family: inherit;\n }\n\n .edx-root :where(h1, h2, h3, h4, h5, h6, p, figure, blockquote, dl, dd) {\n margin: 0;\n }\n\n .edx-root :where(button, input, select, textarea) {\n color: inherit;\n font: inherit;\n letter-spacing: inherit;\n }\n\n .edx-root :where(button, [role=\"button\"]):not(:disabled) {\n cursor: pointer;\n }\n\n .edx-root :where(ul, ol) {\n margin: 0;\n padding: 0;\n list-style: none;\n }\n}\n\n@layer components;\n\n@layer utilities {\n .\\@container\\/card-header {\n container: card-header / inline-size;\n }\n\n .pointer-events-auto {\n pointer-events: auto;\n }\n\n .pointer-events-none {\n pointer-events: none;\n }\n\n .collapse {\n visibility: collapse;\n }\n\n .invisible {\n visibility: hidden;\n }\n\n .visible {\n visibility: visible;\n }\n\n .sr-only {\n clip-path: inset(50%);\n white-space: nowrap;\n border-width: 0;\n width: 1px;\n height: 1px;\n margin: -1px;\n padding: 0;\n position: absolute;\n overflow: hidden;\n }\n\n .absolute {\n position: absolute;\n }\n\n .fixed {\n position: fixed;\n }\n\n .relative {\n position: relative;\n }\n\n .static {\n position: static;\n }\n\n .inset-0 {\n inset: 0;\n }\n\n .inset-x-0 {\n inset-inline: 0;\n }\n\n .inset-x-4 {\n inset-inline: calc(var(--spacing) * 4);\n }\n\n .inset-y-0 {\n inset-block: 0;\n }\n\n .inset-s-1\\/2 {\n inset-inline-start: 50%;\n }\n\n .-top-12 {\n top: calc(var(--spacing) * -12);\n }\n\n .top-0 {\n top: 0;\n }\n\n .top-1\\.5 {\n top: calc(var(--spacing) * 1.5);\n }\n\n .top-1\\/2 {\n top: 50%;\n }\n\n .top-1\\/3 {\n top: 33.3333%;\n }\n\n .top-2 {\n top: calc(var(--spacing) * 2);\n }\n\n .top-2\\.5 {\n top: calc(var(--spacing) * 2.5);\n }\n\n .top-3 {\n top: calc(var(--spacing) * 3);\n }\n\n .top-3\\.5 {\n top: calc(var(--spacing) * 3.5);\n }\n\n .top-\\[60\\%\\] {\n top: 60%;\n }\n\n .top-full {\n top: 100%;\n }\n\n .top-px {\n top: 1px;\n }\n\n .-right-12 {\n right: calc(var(--spacing) * -12);\n }\n\n .right-0 {\n right: 0;\n }\n\n .right-1 {\n right: var(--spacing);\n }\n\n .right-2 {\n right: calc(var(--spacing) * 2);\n }\n\n .right-2\\.5 {\n right: calc(var(--spacing) * 2.5);\n }\n\n .right-3 {\n right: calc(var(--spacing) * 3);\n }\n\n .-bottom-12 {\n bottom: calc(var(--spacing) * -12);\n }\n\n .bottom-0 {\n bottom: 0;\n }\n\n .bottom-4 {\n bottom: calc(var(--spacing) * 4);\n }\n\n .-left-12 {\n left: calc(var(--spacing) * -12);\n }\n\n .left-0 {\n left: 0;\n }\n\n .left-1\\.5 {\n left: calc(var(--spacing) * 1.5);\n }\n\n .left-1\\/2 {\n left: 50%;\n }\n\n .left-2 {\n left: calc(var(--spacing) * 2);\n }\n\n .left-3 {\n left: calc(var(--spacing) * 3);\n }\n\n .isolate {\n isolation: isolate;\n }\n\n .z-0 {\n z-index: 0;\n }\n\n .z-1 {\n z-index: 1;\n }\n\n .z-10 {\n z-index: 10;\n }\n\n .z-20 {\n z-index: 20;\n }\n\n .z-50 {\n z-index: 50;\n }\n\n .z-100 {\n z-index: 100;\n }\n\n .z-\\[calc\\(1000-var\\(--toast-index\\)\\)\\] {\n z-index: calc(1000 - var(--toast-index));\n }\n\n .order-first {\n order: -9999;\n }\n\n .order-last {\n order: 9999;\n }\n\n .col-start-1 {\n grid-column-start: 1;\n }\n\n .col-start-2 {\n grid-column-start: 2;\n }\n\n .col-start-3 {\n grid-column-start: 3;\n }\n\n .row-span-2 {\n grid-row: span 2 / span 2;\n }\n\n .row-start-1 {\n grid-row-start: 1;\n }\n\n .container {\n width: 100%;\n }\n\n @media (min-width: 40rem) {\n .container {\n max-width: 40rem;\n }\n }\n\n @media (min-width: 48rem) {\n .container {\n max-width: 48rem;\n }\n }\n\n @media (min-width: 64rem) {\n .container {\n max-width: 64rem;\n }\n }\n\n @media (min-width: 80rem) {\n .container {\n max-width: 80rem;\n }\n }\n\n @media (min-width: 96rem) {\n .container {\n max-width: 96rem;\n }\n }\n\n .-mx-1 {\n margin-inline: calc(var(--spacing) * -1);\n }\n\n .-mx-4 {\n margin-inline: calc(var(--spacing) * -4);\n }\n\n .mx-2 {\n margin-inline: calc(var(--spacing) * 2);\n }\n\n .mx-3\\.5 {\n margin-inline: calc(var(--spacing) * 3.5);\n }\n\n .mx-10 {\n margin-inline: calc(var(--spacing) * 10);\n }\n\n .mx-auto {\n margin-inline: auto;\n }\n\n .my-0\\.5 {\n margin-block: calc(var(--spacing) * .5);\n }\n\n .my-1 {\n margin-block: var(--spacing);\n }\n\n .my-2 {\n margin-block: calc(var(--spacing) * 2);\n }\n\n .my-auto {\n margin-block: auto;\n }\n\n .ms-auto {\n margin-inline-start: auto;\n }\n\n .-mt-4 {\n margin-top: calc(var(--spacing) * -4);\n }\n\n .mt-0\\.5 {\n margin-top: calc(var(--spacing) * .5);\n }\n\n .mt-1 {\n margin-top: var(--spacing);\n }\n\n .mt-2 {\n margin-top: calc(var(--spacing) * 2);\n }\n\n .mt-4 {\n margin-top: calc(var(--spacing) * 4);\n }\n\n .mt-auto {\n margin-top: auto;\n }\n\n .-mb-4 {\n margin-bottom: calc(var(--spacing) * -4);\n }\n\n .mb-2 {\n margin-bottom: calc(var(--spacing) * 2);\n }\n\n .-ml-4 {\n margin-left: calc(var(--spacing) * -4);\n }\n\n .ml-1 {\n margin-left: var(--spacing);\n }\n\n .ml-auto {\n margin-left: auto;\n }\n\n .no-scrollbar::-webkit-scrollbar {\n display: none;\n }\n\n .no-scrollbar {\n -ms-overflow-style: none;\n scrollbar-width: none;\n }\n\n .line-clamp-1 {\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n overflow: hidden;\n }\n\n .line-clamp-2 {\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n overflow: hidden;\n }\n\n .block {\n display: block;\n }\n\n .contents {\n display: contents;\n }\n\n .flex {\n display: flex;\n }\n\n .grid {\n display: grid;\n }\n\n .hidden {\n display: none;\n }\n\n .inline {\n display: inline;\n }\n\n .inline-block {\n display: inline-block;\n }\n\n .inline-flex {\n display: inline-flex;\n }\n\n .table {\n display: table;\n }\n\n .table-caption {\n display: table-caption;\n }\n\n .table-cell {\n display: table-cell;\n }\n\n .table-row {\n display: table-row;\n }\n\n .field-sizing-content {\n field-sizing: content;\n }\n\n .aspect-\\(--ratio\\) {\n aspect-ratio: var(--ratio);\n }\n\n .aspect-auto {\n aspect-ratio: auto;\n }\n\n .aspect-square {\n aspect-ratio: 1;\n }\n\n .aspect-video {\n aspect-ratio: var(--aspect-video);\n }\n\n .size-\\(--cell-size\\) {\n width: var(--cell-size);\n height: var(--cell-size);\n }\n\n .size-2 {\n width: calc(var(--spacing) * 2);\n height: calc(var(--spacing) * 2);\n }\n\n .size-2\\.5 {\n width: calc(var(--spacing) * 2.5);\n height: calc(var(--spacing) * 2.5);\n }\n\n .size-3 {\n width: calc(var(--spacing) * 3);\n height: calc(var(--spacing) * 3);\n }\n\n .size-3\\.5 {\n width: calc(var(--spacing) * 3.5);\n height: calc(var(--spacing) * 3.5);\n }\n\n .size-4 {\n width: calc(var(--spacing) * 4);\n height: calc(var(--spacing) * 4);\n }\n\n .size-5 {\n width: calc(var(--spacing) * 5);\n height: calc(var(--spacing) * 5);\n }\n\n .size-6 {\n width: calc(var(--spacing) * 6);\n height: calc(var(--spacing) * 6);\n }\n\n .size-7 {\n width: calc(var(--spacing) * 7);\n height: calc(var(--spacing) * 7);\n }\n\n .size-8 {\n width: calc(var(--spacing) * 8);\n height: calc(var(--spacing) * 8);\n }\n\n .size-9 {\n width: calc(var(--spacing) * 9);\n height: calc(var(--spacing) * 9);\n }\n\n .size-10 {\n width: calc(var(--spacing) * 10);\n height: calc(var(--spacing) * 10);\n }\n\n .size-auto {\n width: auto;\n height: auto;\n }\n\n .size-full {\n width: 100%;\n height: 100%;\n }\n\n .h-\\(--cell-size\\) {\n height: var(--cell-size);\n }\n\n .h-\\(--height\\) {\n height: var(--height);\n }\n\n .h-\\(--popup-height\\) {\n height: var(--popup-height);\n }\n\n .h-\\(--positioner-height\\) {\n height: var(--positioner-height);\n }\n\n .h-1\\.5 {\n height: calc(var(--spacing) * 1.5);\n }\n\n .h-2 {\n height: calc(var(--spacing) * 2);\n }\n\n .h-2\\.5 {\n height: calc(var(--spacing) * 2.5);\n }\n\n .h-4 {\n height: calc(var(--spacing) * 4);\n }\n\n .h-5 {\n height: calc(var(--spacing) * 5);\n }\n\n .h-6 {\n height: calc(var(--spacing) * 6);\n }\n\n .h-7 {\n height: calc(var(--spacing) * 7);\n }\n\n .h-8 {\n height: calc(var(--spacing) * 8);\n }\n\n .h-8\\! {\n height: calc(var(--spacing) * 8) !important;\n }\n\n .h-9 {\n height: calc(var(--spacing) * 9);\n }\n\n .h-10 {\n height: calc(var(--spacing) * 10);\n }\n\n .h-12 {\n height: calc(var(--spacing) * 12);\n }\n\n .h-28 {\n height: calc(var(--spacing) * 28);\n }\n\n .h-32 {\n height: calc(var(--spacing) * 32);\n }\n\n .h-40 {\n height: calc(var(--spacing) * 40);\n }\n\n .h-48 {\n height: calc(var(--spacing) * 48);\n }\n\n .h-64 {\n height: calc(var(--spacing) * 64);\n }\n\n .h-\\[calc\\(100\\%-1px\\)\\] {\n height: calc(100% - 1px);\n }\n\n .h-\\[var\\(--accordion-panel-height\\)\\] {\n height: var(--accordion-panel-height);\n }\n\n .h-auto {\n height: auto;\n }\n\n .h-full {\n height: 100%;\n }\n\n .h-max {\n height: max-content;\n }\n\n .h-px {\n height: 1px;\n }\n\n .h-svh {\n height: 100svh;\n }\n\n .max-h-\\(--available-height\\) {\n max-height: var(--available-height);\n }\n\n .max-h-60 {\n max-height: calc(var(--spacing) * 60);\n }\n\n .max-h-72 {\n max-height: calc(var(--spacing) * 72);\n }\n\n .min-h-0 {\n min-height: 0;\n }\n\n .min-h-4 {\n min-height: calc(var(--spacing) * 4);\n }\n\n .min-h-11 {\n min-height: calc(var(--spacing) * 11);\n }\n\n .min-h-16 {\n min-height: calc(var(--spacing) * 16);\n }\n\n .min-h-64 {\n min-height: calc(var(--spacing) * 64);\n }\n\n .min-h-\\[1lh\\] {\n min-height: 1lh;\n }\n\n .min-h-full {\n min-height: 100%;\n }\n\n .min-h-svh {\n min-height: 100svh;\n }\n\n .w-\\(--anchor-width\\) {\n width: var(--anchor-width);\n }\n\n .w-\\(--cell-size\\) {\n width: var(--cell-size);\n }\n\n .w-\\(--popup-width\\) {\n width: var(--popup-width);\n }\n\n .w-\\(--positioner-width\\) {\n width: var(--positioner-width);\n }\n\n .w-\\(--sidebar-width\\) {\n width: var(--sidebar-width);\n }\n\n .w-0 {\n width: 0;\n }\n\n .w-1 {\n width: var(--spacing);\n }\n\n .w-2 {\n width: calc(var(--spacing) * 2);\n }\n\n .w-2\\.5 {\n width: calc(var(--spacing) * 2.5);\n }\n\n .w-3\\/4 {\n width: 75%;\n }\n\n .w-4 {\n width: calc(var(--spacing) * 4);\n }\n\n .w-5 {\n width: calc(var(--spacing) * 5);\n }\n\n .w-10 {\n width: calc(var(--spacing) * 10);\n }\n\n .w-24 {\n width: calc(var(--spacing) * 24);\n }\n\n .w-64 {\n width: calc(var(--spacing) * 64);\n }\n\n .w-72 {\n width: calc(var(--spacing) * 72);\n }\n\n .w-auto {\n width: auto;\n }\n\n .w-fit {\n width: fit-content;\n }\n\n .w-full {\n width: 100%;\n }\n\n .w-max {\n width: max-content;\n }\n\n .w-px {\n width: 1px;\n }\n\n .max-w-\\(--available-width\\) {\n max-width: var(--available-width);\n }\n\n .max-w-\\(--skeleton-width\\) {\n max-width: var(--skeleton-width);\n }\n\n .max-w-\\[80\\%\\] {\n max-width: 80%;\n }\n\n .max-w-\\[calc\\(100\\%-2rem\\)\\] {\n max-width: calc(100% - 2rem);\n }\n\n .max-w-full {\n max-width: 100%;\n }\n\n .max-w-max {\n max-width: max-content;\n }\n\n .max-w-sm {\n max-width: var(--container-sm);\n }\n\n .max-w-xs {\n max-width: var(--container-xs);\n }\n\n .min-w-\\(--cell-size\\) {\n min-width: var(--cell-size);\n }\n\n .min-w-0 {\n min-width: 0;\n }\n\n .min-w-4 {\n min-width: calc(var(--spacing) * 4);\n }\n\n .min-w-5 {\n min-width: calc(var(--spacing) * 5);\n }\n\n .min-w-8 {\n min-width: calc(var(--spacing) * 8);\n }\n\n .min-w-32 {\n min-width: calc(var(--spacing) * 32);\n }\n\n .min-w-36 {\n min-width: calc(var(--spacing) * 36);\n }\n\n .min-w-40 {\n min-width: calc(var(--spacing) * 40);\n }\n\n .min-w-\\[14ch\\] {\n min-width: 14ch;\n }\n\n .min-w-\\[96px\\] {\n min-width: 96px;\n }\n\n .min-w-\\[var\\(--anchor-width\\)\\] {\n min-width: var(--anchor-width);\n }\n\n .flex-1 {\n flex: 1;\n }\n\n .shrink-0 {\n flex-shrink: 0;\n }\n\n .grow {\n flex-grow: 1;\n }\n\n .grow-0 {\n flex-grow: 0;\n }\n\n .basis-full {\n flex-basis: 100%;\n }\n\n .caption-bottom {\n caption-side: bottom;\n }\n\n .border-collapse {\n border-collapse: collapse;\n }\n\n .origin-\\(--transform-origin\\), .origin-\\[var\\(--transform-origin\\)\\] {\n transform-origin: var(--transform-origin);\n }\n\n .origin-bottom {\n transform-origin: bottom;\n }\n\n .-translate-x-1\\/2 {\n --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .-translate-x-px {\n --tw-translate-x: -1px;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .translate-x-1\\/2 {\n --tw-translate-x: calc(1 / 2 * 100%);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .translate-x-px {\n --tw-translate-x: 1px;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .-translate-y-1\\/2 {\n --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .-translate-y-3\\/4 {\n --tw-translate-y: calc(calc(3 / 4 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .translate-y-0 {\n --tw-translate-y: 0;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .translate-y-1\\/2 {\n --tw-translate-y: calc(1 / 2 * 100%);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .translate-y-3\\/4 {\n --tw-translate-y: calc(3 / 4 * 100%);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .translate-y-\\[--spacing\\(0\\.45\\)\\] {\n --tw-translate-y: calc(var(--spacing) * .45);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .translate-y-\\[calc\\(-50\\%-2px\\)\\] {\n --tw-translate-y: calc(-50% - 2px);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .rotate-45 {\n rotate: 45deg;\n }\n\n .rotate-90 {\n rotate: 90deg;\n }\n\n .\\[transform\\:translateX\\(var\\(--toast-swipe-movement-x\\)\\)_translateY\\(calc\\(var\\(--toast-swipe-movement-y\\)-\\(var\\(--toast-index\\)\\*var\\(--peek\\)\\)-\\(var\\(--shrink\\)\\*var\\(--height\\)\\)\\)\\)_scale\\(var\\(--scale\\)\\)\\] {\n transform: translateX(var(--toast-swipe-movement-x)) translateY(calc(var(--toast-swipe-movement-y) - (var(--toast-index) * var(--peek)) - (var(--shrink) * var(--height)))) scale(var(--scale));\n }\n\n .scroll-fade-x {\n --_scroll-fade-size-s: var(--scroll-fade-s-size, var(--scroll-fade-size, min(12%, calc(var(--spacing) * 10))));\n --_scroll-fade-size-e: var(--scroll-fade-e-size, var(--scroll-fade-size, min(12%, calc(var(--spacing) * 10))));\n --scroll-fade-inline: linear-gradient(to right,\n transparent 0,\n #000 var(--scroll-fade-s, 0px),\n #000 calc(100% - var(--scroll-fade-e, 0px)),\n transparent 100%);\n }\n\n .scroll-fade-x:where([dir=\"rtl\"], [dir=\"rtl\"] *) {\n --scroll-fade-inline: linear-gradient(to left,\n transparent 0,\n #000 var(--scroll-fade-s, 0px),\n #000 calc(100% - var(--scroll-fade-e, 0px)),\n transparent 100%);\n }\n\n .scroll-fade-x {\n -webkit-mask-image: var(--scroll-fade-mask, var(--scroll-fade-inline));\n -webkit-mask-image: var(--scroll-fade-mask, var(--scroll-fade-inline));\n -webkit-mask-image: var(--scroll-fade-mask, var(--scroll-fade-inline));\n mask-image: var(--scroll-fade-mask, var(--scroll-fade-inline));\n -webkit-mask-composite: source-in;\n -webkit-mask-composite: source-in;\n -webkit-mask-repeat: no-repeat;\n mask-repeat: no-repeat;\n -webkit-mask-composite: source-in;\n mask-composite: intersect;\n }\n\n @supports (animation-timeline: scroll()) {\n .scroll-fade-x {\n animation: 1ms ease-in-out scroll-fade-reveal-s, 1ms ease-in-out scroll-fade-reveal-e;\n animation-timeline: scroll(self inline), scroll(self inline);\n animation-range: 0 var(--scroll-fade-reveal, calc(var(--spacing) * 24)), calc(100% - var(--scroll-fade-reveal, calc(var(--spacing) * 24))) 100%;\n animation-fill-mode: both;\n }\n }\n\n @supports not (animation-timeline: scroll()) {\n .scroll-fade-x {\n --scroll-fade-s: var(--_scroll-fade-size-s);\n --scroll-fade-e: var(--_scroll-fade-size-e);\n }\n }\n\n .scroll-fade-b {\n --_scroll-fade-size-b: var(--scroll-fade-b-size, var(--scroll-fade-size, min(12%, calc(var(--spacing) * 10))));\n --scroll-fade-mask: linear-gradient(to bottom,\n #000 0,\n #000 calc(100% - var(--scroll-fade-b, 0px)),\n transparent 100%);\n -webkit-mask-image: var(--scroll-fade-mask);\n -webkit-mask-image: var(--scroll-fade-mask);\n -webkit-mask-image: var(--scroll-fade-mask);\n mask-image: var(--scroll-fade-mask);\n -webkit-mask-composite: source-in;\n -webkit-mask-composite: source-in;\n -webkit-mask-repeat: no-repeat;\n mask-repeat: no-repeat;\n -webkit-mask-composite: source-in;\n mask-composite: intersect;\n }\n\n @supports (animation-timeline: scroll()) {\n .scroll-fade-b {\n animation: 1ms ease-in-out scroll-fade-reveal-b;\n animation-timeline: scroll(self y);\n animation-range: calc(100% - var(--scroll-fade-reveal, calc(var(--spacing) * 24))) 100%;\n animation-fill-mode: both;\n }\n }\n\n @supports not (animation-timeline: scroll()) {\n .scroll-fade-b {\n --scroll-fade-b: var(--_scroll-fade-size-b);\n }\n }\n\n .animate-caret-blink {\n animation: 1.25s ease-out infinite caret-blink;\n }\n\n .animate-pulse {\n animation: var(--animate-pulse);\n }\n\n .animate-spin {\n animation: var(--animate-spin);\n }\n\n .cursor-default {\n cursor: default;\n }\n\n .cursor-pointer {\n cursor: pointer;\n }\n\n .cursor-text {\n cursor: text;\n }\n\n .touch-manipulation {\n touch-action: manipulation;\n }\n\n .touch-none {\n touch-action: none;\n }\n\n .resize-none {\n resize: none;\n }\n\n .resize-y {\n resize: vertical;\n }\n\n .snap-x {\n scroll-snap-type: x var(--tw-scroll-snap-strictness);\n }\n\n .snap-mandatory {\n --tw-scroll-snap-strictness: mandatory;\n }\n\n .scroll-px-1 {\n scroll-padding-inline: var(--spacing);\n }\n\n .scroll-py-1 {\n scroll-padding-block: var(--spacing);\n }\n\n .scrollbar-none {\n scrollbar-width: none;\n }\n\n .scrollbar-thin {\n scrollbar-width: thin;\n }\n\n .scrollbar-gutter-stable {\n scrollbar-gutter: stable;\n }\n\n .list-none {\n list-style-type: none;\n }\n\n .appearance-none {\n appearance: none;\n }\n\n .auto-rows-min {\n grid-auto-rows: min-content;\n }\n\n .grid-cols-\\[minmax\\(0\\,1fr\\)_auto_auto\\] {\n grid-template-columns: minmax(0, 1fr) auto auto;\n }\n\n .grid-rows-\\[auto_1fr\\] {\n grid-template-rows: auto 1fr;\n }\n\n .flex-col {\n flex-direction: column;\n }\n\n .flex-col-reverse {\n flex-direction: column-reverse;\n }\n\n .flex-row {\n flex-direction: row;\n }\n\n .flex-wrap {\n flex-wrap: wrap;\n }\n\n .place-content-center {\n place-content: center;\n }\n\n .place-items-center {\n place-items: center;\n }\n\n .items-center {\n align-items: center;\n }\n\n .items-end {\n align-items: flex-end;\n }\n\n .items-start {\n align-items: flex-start;\n }\n\n .items-stretch {\n align-items: stretch;\n }\n\n .justify-between {\n justify-content: space-between;\n }\n\n .justify-center {\n justify-content: center;\n }\n\n .justify-start {\n justify-content: flex-start;\n }\n\n .gap-0 {\n gap: 0;\n }\n\n .gap-0\\.5 {\n gap: calc(var(--spacing) * .5);\n }\n\n .gap-1 {\n gap: var(--spacing);\n }\n\n .gap-1\\.5 {\n gap: calc(var(--spacing) * 1.5);\n }\n\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n\n .gap-2\\.5 {\n gap: calc(var(--spacing) * 2.5);\n }\n\n .gap-3 {\n gap: calc(var(--spacing) * 3);\n }\n\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n\n .gap-6 {\n gap: calc(var(--spacing) * 6);\n }\n\n :where(.space-y-2 > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));\n }\n\n :where(.-space-x-2 > :not(:last-child)) {\n --tw-space-x-reverse: 0;\n margin-inline-start: calc(calc(var(--spacing) * -2) * var(--tw-space-x-reverse));\n margin-inline-end: calc(calc(var(--spacing) * -2) * calc(1 - var(--tw-space-x-reverse)));\n }\n\n .self-end {\n align-self: flex-end;\n }\n\n .self-start {\n align-self: flex-start;\n }\n\n .self-stretch {\n align-self: stretch;\n }\n\n .justify-self-end {\n justify-self: flex-end;\n }\n\n .justify-self-start {\n justify-self: flex-start;\n }\n\n .truncate {\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n }\n\n .overflow-auto {\n overflow: auto;\n }\n\n .overflow-hidden {\n overflow: hidden;\n }\n\n .overflow-x-auto {\n overflow-x: auto;\n }\n\n .overflow-x-hidden {\n overflow-x: hidden;\n }\n\n .overflow-y-auto {\n overflow-y: auto;\n }\n\n .overscroll-contain {\n overscroll-behavior: contain;\n }\n\n .overscroll-x-contain {\n overscroll-behavior-x: contain;\n }\n\n .rounded {\n border-radius: .25rem;\n }\n\n .rounded-\\(--cell-radius\\) {\n border-radius: var(--cell-radius);\n }\n\n .rounded-2xl {\n border-radius: calc(var(--radius) * 1.8);\n }\n\n .rounded-4xl {\n border-radius: calc(var(--radius) * 2.6);\n }\n\n .rounded-\\[2px\\] {\n border-radius: 2px;\n }\n\n .rounded-\\[4px\\] {\n border-radius: 4px;\n }\n\n .rounded-\\[calc\\(var\\(--radius\\)-3px\\)\\] {\n border-radius: calc(var(--radius) - 3px);\n }\n\n .rounded-\\[inherit\\] {\n border-radius: inherit;\n }\n\n .rounded-\\[min\\(var\\(--radius-md\\)\\,10px\\)\\] {\n border-radius: min(var(--radius-md), 10px);\n }\n\n .rounded-\\[min\\(var\\(--radius-md\\)\\,12px\\)\\] {\n border-radius: min(var(--radius-md), 12px);\n }\n\n .rounded-full {\n border-radius: 3.40282e38px;\n }\n\n .rounded-lg {\n border-radius: var(--radius);\n }\n\n .rounded-lg\\! {\n border-radius: var(--radius) !important;\n }\n\n .rounded-md {\n border-radius: calc(var(--radius) * .8);\n }\n\n .rounded-none {\n border-radius: 0;\n }\n\n .rounded-sm {\n border-radius: calc(var(--radius) * .6);\n }\n\n .rounded-xl {\n border-radius: calc(var(--radius) * 1.4);\n }\n\n .rounded-xl\\! {\n border-radius: calc(var(--radius) * 1.4) !important;\n }\n\n .rounded-t-xl {\n border-top-left-radius: calc(var(--radius) * 1.4);\n border-top-right-radius: calc(var(--radius) * 1.4);\n }\n\n .rounded-l-\\(--cell-radius\\) {\n border-top-left-radius: var(--cell-radius);\n border-bottom-left-radius: var(--cell-radius);\n }\n\n .rounded-tl-sm {\n border-top-left-radius: calc(var(--radius) * .6);\n }\n\n .rounded-r-\\(--cell-radius\\) {\n border-top-right-radius: var(--cell-radius);\n border-bottom-right-radius: var(--cell-radius);\n }\n\n .rounded-b-xl {\n border-bottom-right-radius: calc(var(--radius) * 1.4);\n border-bottom-left-radius: calc(var(--radius) * 1.4);\n }\n\n .border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n\n .border-0 {\n border-style: var(--tw-border-style);\n border-width: 0;\n }\n\n .border-\\[1\\.5px\\] {\n border-style: var(--tw-border-style);\n border-width: 1.5px;\n }\n\n .border-y {\n border-block-style: var(--tw-border-style);\n border-block-width: 1px;\n }\n\n .border-t {\n border-top-style: var(--tw-border-style);\n border-top-width: 1px;\n }\n\n .border-r {\n border-right-style: var(--tw-border-style);\n border-right-width: 1px;\n }\n\n .border-b {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 1px;\n }\n\n .border-l {\n border-left-style: var(--tw-border-style);\n border-left-width: 1px;\n }\n\n .border-dashed {\n --tw-border-style: dashed;\n border-style: dashed;\n }\n\n .border-none {\n --tw-border-style: none;\n border-style: none;\n }\n\n .border-\\(--color-border\\) {\n border-color: var(--color-border);\n }\n\n .border-border, .border-border\\/50 {\n border-color: var(--border);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .border-border\\/50 {\n border-color: color-mix(in oklab, var(--border) 50%, transparent);\n }\n }\n\n .border-input, .border-input\\/30 {\n border-color: var(--input);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .border-input\\/30 {\n border-color: color-mix(in oklab, var(--input) 30%, transparent);\n }\n }\n\n .border-primary\\/50 {\n border-color: var(--primary);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .border-primary\\/50 {\n border-color: color-mix(in oklab, var(--primary) 50%, transparent);\n }\n }\n\n .border-sidebar-border {\n border-color: var(--sidebar-border);\n }\n\n .border-transparent {\n border-color: #0000;\n }\n\n .border-t-transparent {\n border-top-color: #0000;\n }\n\n .border-l-transparent {\n border-left-color: #0000;\n }\n\n .bg-\\(--color-bg\\) {\n background-color: var(--color-bg);\n }\n\n .bg-\\[Canvas\\] {\n background-color: canvas;\n }\n\n .bg-background {\n background-color: var(--background);\n }\n\n .bg-border {\n background-color: var(--border);\n }\n\n .bg-card {\n background-color: var(--card);\n }\n\n .bg-destructive, .bg-destructive\\/10 {\n background-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .bg-destructive\\/10 {\n background-color: color-mix(in oklab, var(--destructive) 10%, transparent);\n }\n }\n\n .bg-foreground {\n background-color: var(--foreground);\n }\n\n .bg-info-ring\\/40 {\n background-color: var(--info-ring);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .bg-info-ring\\/40 {\n background-color: color-mix(in oklab, var(--info-ring) 40%, transparent);\n }\n }\n\n .bg-input\\/30 {\n background-color: var(--input);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .bg-input\\/30 {\n background-color: color-mix(in oklab, var(--input) 30%, transparent);\n }\n }\n\n .bg-muted {\n background-color: var(--muted);\n }\n\n .bg-muted-foreground, .bg-muted-foreground\\/50 {\n background-color: var(--muted-foreground);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .bg-muted-foreground\\/50 {\n background-color: color-mix(in oklab, var(--muted-foreground) 50%, transparent);\n }\n }\n\n .bg-muted\\/50 {\n background-color: var(--muted);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .bg-muted\\/50 {\n background-color: color-mix(in oklab, var(--muted) 50%, transparent);\n }\n }\n\n .bg-overlay {\n background-color: var(--overlay);\n }\n\n .bg-popover {\n background-color: var(--popover);\n }\n\n .bg-primary {\n background-color: var(--primary);\n }\n\n .bg-primary-foreground {\n background-color: var(--primary-foreground);\n }\n\n .bg-primary\\/20 {\n background-color: var(--primary);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .bg-primary\\/20 {\n background-color: color-mix(in oklab, var(--primary) 20%, transparent);\n }\n }\n\n .bg-secondary {\n background-color: var(--secondary);\n }\n\n .bg-sidebar {\n background-color: var(--sidebar);\n }\n\n .bg-sidebar-border {\n background-color: var(--sidebar-border);\n }\n\n .bg-success {\n background-color: var(--success);\n }\n\n .bg-success-ring\\/40 {\n background-color: var(--success-ring);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .bg-success-ring\\/40 {\n background-color: color-mix(in oklab, var(--success-ring) 40%, transparent);\n }\n }\n\n .bg-transparent {\n background-color: #0000;\n }\n\n .bg-warning {\n background-color: var(--warning);\n }\n\n .bg-warning-ring\\/40 {\n background-color: var(--warning-ring);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .bg-warning-ring\\/40 {\n background-color: color-mix(in oklab, var(--warning-ring) 40%, transparent);\n }\n }\n\n .bg-gradient-to-t {\n --tw-gradient-position: to top in oklab;\n background-image: linear-gradient(var(--tw-gradient-stops));\n }\n\n .from-background {\n --tw-gradient-from: var(--background);\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n }\n\n .via-background\\/75 {\n --tw-gradient-via: var(--background);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .via-background\\/75 {\n --tw-gradient-via: color-mix(in oklab, var(--background) 75%, transparent);\n }\n }\n\n .via-background\\/75 {\n --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);\n --tw-gradient-stops: var(--tw-gradient-via-stops);\n }\n\n .to-transparent {\n --tw-gradient-to: transparent;\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n }\n\n .bg-clip-padding {\n background-clip: padding-box;\n }\n\n .fill-foreground {\n fill: var(--foreground);\n }\n\n .object-contain {\n object-fit: contain;\n }\n\n .object-cover {\n object-fit: cover;\n }\n\n .p-0 {\n padding: 0;\n }\n\n .p-1 {\n padding: var(--spacing);\n }\n\n .p-2 {\n padding: calc(var(--spacing) * 2);\n }\n\n .p-2\\.5 {\n padding: calc(var(--spacing) * 2.5);\n }\n\n .p-3 {\n padding: calc(var(--spacing) * 3);\n }\n\n .p-4 {\n padding: calc(var(--spacing) * 4);\n }\n\n .p-6 {\n padding: calc(var(--spacing) * 6);\n }\n\n .p-\\[3px\\] {\n padding: 3px;\n }\n\n .p-px {\n padding: 1px;\n }\n\n .px-\\(--cell-size\\) {\n padding-inline: var(--cell-size);\n }\n\n .px-1 {\n padding-inline: var(--spacing);\n }\n\n .px-1\\.5 {\n padding-inline: calc(var(--spacing) * 1.5);\n }\n\n .px-2 {\n padding-inline: calc(var(--spacing) * 2);\n }\n\n .px-2\\.5 {\n padding-inline: calc(var(--spacing) * 2.5);\n }\n\n .px-3 {\n padding-inline: calc(var(--spacing) * 3);\n }\n\n .px-4 {\n padding-inline: calc(var(--spacing) * 4);\n }\n\n .py-0\\.5 {\n padding-block: calc(var(--spacing) * .5);\n }\n\n .py-1 {\n padding-block: var(--spacing);\n }\n\n .py-1\\.5 {\n padding-block: calc(var(--spacing) * 1.5);\n }\n\n .py-2 {\n padding-block: calc(var(--spacing) * 2);\n }\n\n .py-2\\.5 {\n padding-block: calc(var(--spacing) * 2.5);\n }\n\n .py-3 {\n padding-block: calc(var(--spacing) * 3);\n }\n\n .py-4 {\n padding-block: calc(var(--spacing) * 4);\n }\n\n .py-6 {\n padding-block: calc(var(--spacing) * 6);\n }\n\n .py-\\[2px\\] {\n padding-block: 2px;\n }\n\n .pt-0 {\n padding-top: 0;\n }\n\n .pt-2 {\n padding-top: calc(var(--spacing) * 2);\n }\n\n .pt-3 {\n padding-top: calc(var(--spacing) * 3);\n }\n\n .pt-4 {\n padding-top: calc(var(--spacing) * 4);\n }\n\n .pt-12 {\n padding-top: calc(var(--spacing) * 12);\n }\n\n .pr-1\\.5 {\n padding-right: calc(var(--spacing) * 1.5);\n }\n\n .pr-2 {\n padding-right: calc(var(--spacing) * 2);\n }\n\n .pr-8 {\n padding-right: calc(var(--spacing) * 8);\n }\n\n .pb-0 {\n padding-bottom: 0;\n }\n\n .pb-2 {\n padding-bottom: calc(var(--spacing) * 2);\n }\n\n .pb-3 {\n padding-bottom: calc(var(--spacing) * 3);\n }\n\n .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n\n .pl-1\\.5 {\n padding-left: calc(var(--spacing) * 1.5);\n }\n\n .pl-2 {\n padding-left: calc(var(--spacing) * 2);\n }\n\n .pl-2\\.5 {\n padding-left: calc(var(--spacing) * 2.5);\n }\n\n .pl-4 {\n padding-left: calc(var(--spacing) * 4);\n }\n\n .pl-7 {\n padding-left: calc(var(--spacing) * 7);\n }\n\n .pl-8 {\n padding-left: calc(var(--spacing) * 8);\n }\n\n .text-center {\n text-align: center;\n }\n\n .text-left {\n text-align: left;\n }\n\n .text-right {\n text-align: right;\n }\n\n .text-start {\n text-align: start;\n }\n\n .align-middle {\n vertical-align: middle;\n }\n\n .font-mono {\n font-family: var(--font-mono);\n }\n\n .font-sans {\n font-family: var(--font-sans);\n }\n\n .text-base {\n font-size: var(--text-base);\n line-height: var(--tw-leading, var(--text-base--line-height));\n }\n\n .text-sm {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n\n .text-sm\\/relaxed {\n font-size: var(--text-sm);\n line-height: var(--leading-relaxed);\n }\n\n .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n }\n\n .text-\\[0\\.8rem\\] {\n font-size: .8rem;\n }\n\n .text-\\[0\\.625rem\\] {\n font-size: .625rem;\n }\n\n .leading-none {\n --tw-leading: 1;\n line-height: 1;\n }\n\n .leading-normal {\n --tw-leading: var(--leading-normal);\n line-height: var(--leading-normal);\n }\n\n .leading-relaxed {\n --tw-leading: var(--leading-relaxed);\n line-height: var(--leading-relaxed);\n }\n\n .leading-snug {\n --tw-leading: var(--leading-snug);\n line-height: var(--leading-snug);\n }\n\n .leading-tight {\n --tw-leading: var(--leading-tight);\n line-height: var(--leading-tight);\n }\n\n .font-medium {\n --tw-font-weight: var(--font-weight-medium);\n font-weight: var(--font-weight-medium);\n }\n\n .font-normal {\n --tw-font-weight: var(--font-weight-normal);\n font-weight: var(--font-weight-normal);\n }\n\n .font-semibold {\n --tw-font-weight: var(--font-weight-semibold);\n font-weight: var(--font-weight-semibold);\n }\n\n .tracking-tight {\n --tw-tracking: var(--tracking-tight);\n letter-spacing: var(--tracking-tight);\n }\n\n .tracking-widest {\n --tw-tracking: var(--tracking-widest);\n letter-spacing: var(--tracking-widest);\n }\n\n .text-balance {\n text-wrap: balance;\n }\n\n .text-pretty {\n text-wrap: pretty;\n }\n\n .wrap-break-word {\n overflow-wrap: break-word;\n }\n\n .whitespace-nowrap {\n white-space: nowrap;\n }\n\n .text-\\[CanvasText\\] {\n color: canvastext;\n }\n\n .text-background {\n color: var(--background);\n }\n\n .text-card-foreground {\n color: var(--card-foreground);\n }\n\n .text-current {\n color: currentColor;\n }\n\n .text-destructive {\n color: var(--destructive);\n }\n\n .text-destructive-foreground {\n color: var(--destructive-foreground);\n }\n\n .text-foreground, .text-foreground\\/60 {\n color: var(--foreground);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .text-foreground\\/60 {\n color: color-mix(in oklab, var(--foreground) 60%, transparent);\n }\n }\n\n .text-foreground\\/70 {\n color: var(--foreground);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .text-foreground\\/70 {\n color: color-mix(in oklab, var(--foreground) 70%, transparent);\n }\n }\n\n .text-info {\n color: var(--info);\n }\n\n .text-muted-foreground {\n color: var(--muted-foreground);\n }\n\n .text-popover-foreground {\n color: var(--popover-foreground);\n }\n\n .text-primary {\n color: var(--primary);\n }\n\n .text-primary-foreground {\n color: var(--primary-foreground);\n }\n\n .text-secondary-foreground {\n color: var(--secondary-foreground);\n }\n\n .text-sidebar-foreground, .text-sidebar-foreground\\/70 {\n color: var(--sidebar-foreground);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .text-sidebar-foreground\\/70 {\n color: color-mix(in oklab, var(--sidebar-foreground) 70%, transparent);\n }\n }\n\n .text-success {\n color: var(--success);\n }\n\n .text-warning {\n color: var(--warning);\n }\n\n .tabular-nums {\n --tw-numeric-spacing: tabular-nums;\n font-variant-numeric: var(--tw-ordinal, ) var(--tw-slashed-zero, ) var(--tw-numeric-figure, ) var(--tw-numeric-spacing, ) var(--tw-numeric-fraction, );\n }\n\n .underline-offset-4 {\n text-underline-offset: 4px;\n }\n\n .opacity-0 {\n opacity: 0;\n }\n\n .opacity-50 {\n opacity: .5;\n }\n\n .opacity-60 {\n opacity: .6;\n }\n\n .bg-blend-color {\n background-blend-mode: color;\n }\n\n .shadow {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .shadow-\\[0_0_0_1px_var\\(--sidebar-border\\)\\] {\n --tw-shadow: 0 0 0 1px var(--tw-shadow-color, var(--sidebar-border));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .shadow-lg {\n --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, #0000001a), 0 4px 6px -4px var(--tw-shadow-color, #0000001a);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .shadow-md {\n --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, #0000001a), 0 2px 4px -2px var(--tw-shadow-color, #0000001a);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .shadow-none {\n --tw-shadow: 0 0 #0000;\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .shadow-none\\! {\n --tw-shadow: 0 0 #0000 !important;\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;\n }\n\n .shadow-sm {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .shadow-xl {\n --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, #0000001a), 0 8px 10px -6px var(--tw-shadow-color, #0000001a);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .ring-0 {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .ring-1 {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .ring-2 {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .ring-3 {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .ring-background {\n --tw-ring-color: var(--background);\n }\n\n .ring-card {\n --tw-ring-color: var(--card);\n }\n\n .ring-foreground\\/10 {\n --tw-ring-color: var(--foreground);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .ring-foreground\\/10 {\n --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);\n }\n }\n\n .ring-sidebar-ring {\n --tw-ring-color: var(--sidebar-ring);\n }\n\n .ring-offset-background {\n --tw-ring-offset-color: var(--background);\n }\n\n .outline-hidden {\n --tw-outline-style: none;\n outline-style: none;\n }\n\n @media (forced-colors: active) {\n .outline-hidden {\n outline-offset: 2px;\n outline: 2px solid #0000;\n }\n }\n\n .outline {\n outline-style: var(--tw-outline-style);\n outline-width: 1px;\n }\n\n .transition {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-\\[color\\,box-shadow\\,background-color\\] {\n transition-property: color, box-shadow, background-color;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-\\[height\\] {\n transition-property: height;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-\\[left\\,right\\,width\\] {\n transition-property: left, right, width;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-\\[margin\\,opacity\\] {\n transition-property: margin, opacity;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-\\[opacity\\,transform\\,translate\\] {\n transition-property: opacity, transform, translate;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-\\[opacity\\,transform\\,width\\,height\\,scale\\,translate\\] {\n transition-property: opacity, transform, width, height, scale, translate;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-\\[top\\,left\\,right\\,bottom\\] {\n transition-property: top, left, right, bottom;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-\\[transform\\,scale\\,opacity\\] {\n transition-property: transform, scale, opacity;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-\\[translate\\,scale\\,opacity\\] {\n transition-property: translate, scale, opacity;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-\\[width\\,height\\,padding\\] {\n transition-property: width, height, padding;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-\\[width\\] {\n transition-property: width;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-all {\n transition-property: all;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-colors {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-opacity {\n transition-property: opacity;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-transform {\n transition-property: transform, translate, scale, rotate;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .transition-none {\n transition-property: none;\n }\n\n .duration-100 {\n --tw-duration: .1s;\n transition-duration: .1s;\n }\n\n .duration-150 {\n --tw-duration: .15s;\n transition-duration: .15s;\n }\n\n .duration-200 {\n --tw-duration: .2s;\n transition-duration: .2s;\n }\n\n .duration-250 {\n --tw-duration: .25s;\n transition-duration: .25s;\n }\n\n .duration-300 {\n --tw-duration: .3s;\n transition-duration: .3s;\n }\n\n .duration-1000 {\n --tw-duration: 1s;\n transition-duration: 1s;\n }\n\n .duration-\\[0\\.35s\\] {\n --tw-duration: .35s;\n transition-duration: .35s;\n }\n\n .ease-\\[cubic-bezier\\(0\\.22\\,1\\,0\\.36\\,1\\)\\] {\n --tw-ease: cubic-bezier(.22,1,.36,1);\n transition-timing-function: cubic-bezier(.22, 1, .36, 1);\n }\n\n .ease-in-out {\n --tw-ease: var(--ease-in-out);\n transition-timing-function: var(--ease-in-out);\n }\n\n .ease-linear {\n --tw-ease: linear;\n transition-timing-function: linear;\n }\n\n .ease-out {\n --tw-ease: var(--ease-out);\n transition-timing-function: var(--ease-out);\n }\n\n .will-change-transform {\n will-change: transform;\n }\n\n .contain-content {\n contain: content;\n }\n\n .outline-none {\n --tw-outline-style: none;\n outline-style: none;\n }\n\n .select-none {\n -webkit-user-select: none;\n user-select: none;\n }\n\n .\\[--cell-radius\\:var\\(--radius-md\\)\\] {\n --cell-radius: var(--radius-md);\n }\n\n .\\[--cell-size\\:--spacing\\(7\\)\\] {\n --cell-size: calc(var(--spacing) * 7);\n }\n\n .\\[--gap\\:0\\.75rem\\] {\n --gap: .75rem;\n }\n\n .\\[--height\\:var\\(--toast-frontmost-height\\,var\\(--toast-height\\)\\)\\] {\n --height: var(--toast-frontmost-height, var(--toast-height));\n }\n\n .\\[--offset-y\\:calc\\(var\\(--toast-offset-y\\)\\*-1\\+calc\\(var\\(--toast-index\\)\\*var\\(--gap\\)\\*-1\\)\\+var\\(--toast-swipe-movement-y\\)\\)\\] {\n --offset-y: calc(var(--toast-offset-y) * -1 + calc(var(--toast-index) * var(--gap) * -1) + var(--toast-swipe-movement-y));\n }\n\n .\\[--peek\\:0\\.75rem\\] {\n --peek: .75rem;\n }\n\n .\\[--scale\\:calc\\(max\\(0\\,1-\\(var\\(--toast-index\\)\\*0\\.1\\)\\)\\)\\] {\n --scale: calc(max(0, 1 - (var(--toast-index) * .1)));\n }\n\n .\\[--shrink\\:calc\\(1-var\\(--scale\\)\\)\\] {\n --shrink: calc(1 - var(--scale));\n }\n\n .\\[contain-intrinsic-size\\:auto_10rem\\] {\n contain-intrinsic-size: auto 10rem;\n }\n\n .\\[content-visibility\\:auto\\] {\n content-visibility: auto;\n }\n\n .\\[transition\\:transform_500ms_cubic-bezier\\(0\\.22\\,1\\,0\\.36\\,1\\)\\,opacity_500ms\\,height_150ms\\] {\n transition: transform .5s cubic-bezier(.22, 1, .36, 1), opacity .5s, height .15s;\n }\n\n .fade-out {\n --tw-exit-opacity: 0;\n }\n\n .group-focus-within\\/menu-item\\:opacity-100:is(:where(.group\\/menu-item):focus-within *) {\n opacity: 1;\n }\n\n @media (hover: hover) {\n .group-hover\\/menu-item\\:opacity-100:is(:where(.group\\/menu-item):hover *), .group-hover\\/scroll-area\\:opacity-100:is(:where(.group\\/scroll-area):hover *) {\n opacity: 1;\n }\n }\n\n .group-focus\\/context-menu-item\\:text-accent-foreground:is(:where(.group\\/context-menu-item):focus *), .group-focus\\/dropdown-menu-item\\:text-accent-foreground:is(:where(.group\\/dropdown-menu-item):focus *), .group-focus\\/menubar-item\\:text-accent-foreground:is(:where(.group\\/menubar-item):focus *) {\n color: var(--accent-foreground);\n }\n\n .group-has-disabled\\/field\\:pointer-events-none:is(:where(.group\\/field):has(:disabled) *) {\n pointer-events: none;\n }\n\n .group-has-disabled\\/field\\:opacity-50:is(:where(.group\\/field):has(:disabled) *) {\n opacity: .5;\n }\n\n .group-has-data-\\[sidebar\\=menu-action\\]\\/menu-item\\:pr-8:is(:where(.group\\/menu-item):has([data-sidebar=\"menu-action\"]) *) {\n padding-right: calc(var(--spacing) * 8);\n }\n\n .group-has-data-\\[size\\=lg\\]\\/avatar-group\\:size-10:is(:where(.group\\/avatar-group):has([data-size=\"lg\"]) *) {\n width: calc(var(--spacing) * 10);\n height: calc(var(--spacing) * 10);\n }\n\n .group-has-data-\\[size\\=sm\\]\\/avatar-group\\:size-6:is(:where(.group\\/avatar-group):has([data-size=\"sm\"]) *) {\n width: calc(var(--spacing) * 6);\n height: calc(var(--spacing) * 6);\n }\n\n .group-has-data-\\[slot\\=command-shortcut\\]\\/command-item\\:hidden:is(:where(.group\\/command-item):has([data-slot=\"command-shortcut\"]) *) {\n display: none;\n }\n\n .group-has-data-\\[slot\\=item-description\\]\\/item\\:translate-y-0\\.5:is(:where(.group\\/item):has([data-slot=\"item-description\"]) *) {\n --tw-translate-y: calc(var(--spacing) * .5);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .group-has-data-\\[slot\\=item-description\\]\\/item\\:self-start:is(:where(.group\\/item):has([data-slot=\"item-description\"]) *) {\n align-self: flex-start;\n }\n\n .group-has-data-\\[slot\\=message-footer\\]\\/message\\:-translate-y-8:is(:where(.group\\/message):has([data-slot=\"message-footer\"]) *) {\n --tw-translate-y: calc(var(--spacing) * -8);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .group-has-data-\\[slot\\=questionnaire-choice-description\\]\\/questionnaire-choice\\:translate-y-0\\.5:is(:where(.group\\/questionnaire-choice):has([data-slot=\"questionnaire-choice-description\"]) *) {\n --tw-translate-y: calc(var(--spacing) * .5);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .group-has-data-\\[variant\\=ghost\\]\\/message\\:px-0:is(:where(.group\\/message):has([data-variant=\"ghost\"]) *) {\n padding-inline: 0;\n }\n\n .group-has-\\[\\>input\\]\\/input-group\\:pt-2:is(:where(.group\\/input-group):has( > input) *) {\n padding-top: calc(var(--spacing) * 2);\n }\n\n .group-has-\\[\\>input\\]\\/input-group\\:pb-2:is(:where(.group\\/input-group):has( > input) *) {\n padding-bottom: calc(var(--spacing) * 2);\n }\n\n .group-has-\\[\\>svg\\]\\/alert\\:col-start-2:is(:where(.group\\/alert):has( > svg) *) {\n grid-column-start: 2;\n }\n\n .group-data-indeterminate\\/checkbox-indicator\\:block:is(:where(.group\\/checkbox-indicator)[data-indeterminate] *) {\n display: block;\n }\n\n .group-data-indeterminate\\/checkbox-indicator\\:hidden:is(:where(.group\\/checkbox-indicator)[data-indeterminate] *) {\n display: none;\n }\n\n .group-data-popup-open\\/navigation-menu-trigger\\:rotate-180:is(:where(.group\\/navigation-menu-trigger)[data-popup-open] *) {\n rotate: 180deg;\n }\n\n .group-data-\\[align\\=end\\]\\/bubble\\:self-end:is(:where(.group\\/bubble)[data-align=\"end\"] *) {\n align-self: flex-end;\n }\n\n .group-data-\\[align\\=end\\]\\/message\\:justify-end:is(:where(.group\\/message)[data-align=\"end\"] *) {\n justify-content: flex-end;\n }\n\n .group-data-\\[align\\=end\\]\\/message\\:self-end:is(:where(.group\\/message)[data-align=\"end\"] *) {\n align-self: flex-end;\n }\n\n .group-data-\\[checked\\=true\\]\\/command-item\\:opacity-100:is(:where(.group\\/command-item)[data-checked=\"true\"] *) {\n opacity: 1;\n }\n\n .group-data-\\[collapsible\\=icon\\]\\:-mt-8:is(:where(.group)[data-collapsible=\"icon\"] *) {\n margin-top: calc(var(--spacing) * -8);\n }\n\n .group-data-\\[collapsible\\=icon\\]\\:hidden:is(:where(.group)[data-collapsible=\"icon\"] *) {\n display: none;\n }\n\n .group-data-\\[collapsible\\=icon\\]\\:size-8\\!:is(:where(.group)[data-collapsible=\"icon\"] *) {\n width: calc(var(--spacing) * 8) !important;\n height: calc(var(--spacing) * 8) !important;\n }\n\n .group-data-\\[collapsible\\=icon\\]\\:w-\\(--sidebar-width-icon\\):is(:where(.group)[data-collapsible=\"icon\"] *) {\n width: var(--sidebar-width-icon);\n }\n\n .group-data-\\[collapsible\\=icon\\]\\:w-\\[calc\\(var\\(--sidebar-width-icon\\)\\+\\(--spacing\\(4\\)\\)\\)\\]:is(:where(.group)[data-collapsible=\"icon\"] *) {\n width: calc(var(--sidebar-width-icon) + (calc(var(--spacing) * 4)));\n }\n\n .group-data-\\[collapsible\\=icon\\]\\:w-\\[calc\\(var\\(--sidebar-width-icon\\)\\+\\(--spacing\\(4\\)\\)\\+2px\\)\\]:is(:where(.group)[data-collapsible=\"icon\"] *) {\n width: calc(var(--sidebar-width-icon) + (calc(var(--spacing) * 4)) + 2px);\n }\n\n .group-data-\\[collapsible\\=icon\\]\\:overflow-hidden:is(:where(.group)[data-collapsible=\"icon\"] *) {\n overflow: hidden;\n }\n\n .group-data-\\[collapsible\\=icon\\]\\:p-0\\!:is(:where(.group)[data-collapsible=\"icon\"] *) {\n padding: 0 !important;\n }\n\n .group-data-\\[collapsible\\=icon\\]\\:p-2\\!:is(:where(.group)[data-collapsible=\"icon\"] *) {\n padding: calc(var(--spacing) * 2) !important;\n }\n\n .group-data-\\[collapsible\\=icon\\]\\:opacity-0:is(:where(.group)[data-collapsible=\"icon\"] *) {\n opacity: 0;\n }\n\n .group-data-\\[collapsible\\=offcanvas\\]\\:w-0:is(:where(.group)[data-collapsible=\"offcanvas\"] *) {\n width: 0;\n }\n\n .group-data-\\[collapsible\\=offcanvas\\]\\:translate-x-0:is(:where(.group)[data-collapsible=\"offcanvas\"] *) {\n --tw-translate-x: 0;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .group-data-\\[disabled\\=true\\]\\:pointer-events-none:is(:where(.group)[data-disabled=\"true\"] *) {\n pointer-events: none;\n }\n\n .group-data-\\[disabled\\=true\\]\\:opacity-50:is(:where(.group)[data-disabled=\"true\"] *) {\n opacity: .5;\n }\n\n .group-data-\\[focused\\=true\\]\\/day\\:relative:is(:where(.group\\/day)[data-focused=\"true\"] *) {\n position: relative;\n }\n\n .group-data-\\[focused\\=true\\]\\/day\\:z-10:is(:where(.group\\/day)[data-focused=\"true\"] *) {\n z-index: 10;\n }\n\n .group-data-\\[focused\\=true\\]\\/day\\:border-ring:is(:where(.group\\/day)[data-focused=\"true\"] *) {\n border-color: var(--ring);\n }\n\n .group-data-\\[focused\\=true\\]\\/day\\:ring-\\[3px\\]:is(:where(.group\\/day)[data-focused=\"true\"] *) {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .group-data-\\[focused\\=true\\]\\/day\\:ring-ring\\/50:is(:where(.group\\/day)[data-focused=\"true\"] *) {\n --tw-ring-color: var(--ring);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .group-data-\\[focused\\=true\\]\\/day\\:ring-ring\\/50:is(:where(.group\\/day)[data-focused=\"true\"] *) {\n --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);\n }\n }\n\n .group-data-\\[orientation\\=vertical\\]\\/attachment\\:absolute:is(:where(.group\\/attachment)[data-orientation=\"vertical\"] *) {\n position: absolute;\n }\n\n .group-data-\\[orientation\\=vertical\\]\\/attachment\\:top-3:is(:where(.group\\/attachment)[data-orientation=\"vertical\"] *) {\n top: calc(var(--spacing) * 3);\n }\n\n .group-data-\\[orientation\\=vertical\\]\\/attachment\\:right-3:is(:where(.group\\/attachment)[data-orientation=\"vertical\"] *) {\n right: calc(var(--spacing) * 3);\n }\n\n .group-data-\\[orientation\\=vertical\\]\\/attachment\\:w-full:is(:where(.group\\/attachment)[data-orientation=\"vertical\"] *) {\n width: 100%;\n }\n\n .group-data-\\[orientation\\=vertical\\]\\/attachment\\:gap-1:is(:where(.group\\/attachment)[data-orientation=\"vertical\"] *) {\n gap: var(--spacing);\n }\n\n .group-data-\\[orientation\\=vertical\\]\\/attachment\\:px-1:is(:where(.group\\/attachment)[data-orientation=\"vertical\"] *) {\n padding-inline: var(--spacing);\n }\n\n .group-data-\\[shortcut\\]\\/questionnaire-choice\\:inline-flex:is(:where(.group\\/questionnaire-choice)[data-shortcut] *) {\n display: inline-flex;\n }\n\n .group-data-\\[side\\=left\\]\\:-right-4:is(:where(.group)[data-side=\"left\"] *) {\n right: calc(var(--spacing) * -4);\n }\n\n .group-data-\\[side\\=left\\]\\:border-r:is(:where(.group)[data-side=\"left\"] *) {\n border-right-style: var(--tw-border-style);\n border-right-width: 1px;\n }\n\n .group-data-\\[side\\=right\\]\\:left-0:is(:where(.group)[data-side=\"right\"] *) {\n left: 0;\n }\n\n .group-data-\\[side\\=right\\]\\:rotate-180:is(:where(.group)[data-side=\"right\"] *) {\n rotate: 180deg;\n }\n\n .group-data-\\[side\\=right\\]\\:border-l:is(:where(.group)[data-side=\"right\"] *) {\n border-left-style: var(--tw-border-style);\n border-left-width: 1px;\n }\n\n .group-data-\\[size\\=default\\]\\/avatar\\:size-2\\.5:is(:where(.group\\/avatar)[data-size=\"default\"] *) {\n width: calc(var(--spacing) * 2.5);\n height: calc(var(--spacing) * 2.5);\n }\n\n .group-data-\\[size\\=default\\]\\/switch\\:size-4:is(:where(.group\\/switch)[data-size=\"default\"] *) {\n width: calc(var(--spacing) * 4);\n height: calc(var(--spacing) * 4);\n }\n\n .group-data-\\[size\\=lg\\]\\/avatar\\:size-3:is(:where(.group\\/avatar)[data-size=\"lg\"] *) {\n width: calc(var(--spacing) * 3);\n height: calc(var(--spacing) * 3);\n }\n\n .group-data-\\[size\\=sm\\]\\/alert-dialog-content\\:grid:is(:where(.group\\/alert-dialog-content)[data-size=\"sm\"] *) {\n display: grid;\n }\n\n .group-data-\\[size\\=sm\\]\\/alert-dialog-content\\:grid-cols-2:is(:where(.group\\/alert-dialog-content)[data-size=\"sm\"] *) {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n\n .group-data-\\[size\\=sm\\]\\/attachment\\:w-8:is(:where(.group\\/attachment)[data-size=\"sm\"] *) {\n width: calc(var(--spacing) * 8);\n }\n\n .group-data-\\[size\\=sm\\]\\/avatar\\:size-2:is(:where(.group\\/avatar)[data-size=\"sm\"] *) {\n width: calc(var(--spacing) * 2);\n height: calc(var(--spacing) * 2);\n }\n\n .group-data-\\[size\\=sm\\]\\/avatar\\:text-xs:is(:where(.group\\/avatar)[data-size=\"sm\"] *) {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n }\n\n .group-data-\\[size\\=sm\\]\\/card\\:p-3:is(:where(.group\\/card)[data-size=\"sm\"] *) {\n padding: calc(var(--spacing) * 3);\n }\n\n .group-data-\\[size\\=sm\\]\\/card\\:px-3:is(:where(.group\\/card)[data-size=\"sm\"] *) {\n padding-inline: calc(var(--spacing) * 3);\n }\n\n .group-data-\\[size\\=sm\\]\\/card\\:text-sm:is(:where(.group\\/card)[data-size=\"sm\"] *) {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n\n .group-data-\\[size\\=sm\\]\\/item\\:size-8:is(:where(.group\\/item)[data-size=\"sm\"] *) {\n width: calc(var(--spacing) * 8);\n height: calc(var(--spacing) * 8);\n }\n\n .group-data-\\[size\\=sm\\]\\/switch\\:size-3:is(:where(.group\\/switch)[data-size=\"sm\"] *) {\n width: calc(var(--spacing) * 3);\n height: calc(var(--spacing) * 3);\n }\n\n .group-data-\\[size\\=xs\\]\\/attachment\\:w-7:is(:where(.group\\/attachment)[data-size=\"xs\"] *) {\n width: calc(var(--spacing) * 7);\n }\n\n .group-data-\\[size\\=xs\\]\\/attachment\\:rounded-md:is(:where(.group\\/attachment)[data-size=\"xs\"] *) {\n border-radius: calc(var(--radius) * .8);\n }\n\n .group-data-\\[size\\=xs\\]\\/item\\:size-6:is(:where(.group\\/item)[data-size=\"xs\"] *) {\n width: calc(var(--spacing) * 6);\n height: calc(var(--spacing) * 6);\n }\n\n .group-data-\\[size\\=xs\\]\\/item\\:gap-0:is(:where(.group\\/item)[data-size=\"xs\"] *) {\n gap: 0;\n }\n\n .group-data-\\[size\\=xs\\]\\/item\\:text-xs:is(:where(.group\\/item)[data-size=\"xs\"] *) {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n }\n\n .group-data-\\[spacing\\=0\\]\\/toggle-group\\:rounded-none:is(:where(.group\\/toggle-group)[data-spacing=\"0\"] *) {\n border-radius: 0;\n }\n\n .group-data-\\[spacing\\=0\\]\\/toggle-group\\:px-2:is(:where(.group\\/toggle-group)[data-spacing=\"0\"] *) {\n padding-inline: calc(var(--spacing) * 2);\n }\n\n .group-data-\\[state\\=done\\]\\/attachment\\:opacity-100:is(:where(.group\\/attachment)[data-state=\"done\"] *) {\n opacity: 1;\n }\n\n .group-data-\\[state\\=error\\]\\/attachment\\:bg-destructive\\/10:is(:where(.group\\/attachment)[data-state=\"error\"] *) {\n background-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .group-data-\\[state\\=error\\]\\/attachment\\:bg-destructive\\/10:is(:where(.group\\/attachment)[data-state=\"error\"] *) {\n background-color: color-mix(in oklab, var(--destructive) 10%, transparent);\n }\n }\n\n .group-data-\\[state\\=error\\]\\/attachment\\:text-destructive:is(:where(.group\\/attachment)[data-state=\"error\"] *) {\n color: var(--destructive);\n }\n\n .group-data-\\[state\\=idle\\]\\/attachment\\:opacity-100:is(:where(.group\\/attachment)[data-state=\"idle\"] *) {\n opacity: 1;\n }\n\n .group-data-\\[state\\=processing\\]\\/attachment\\:shimmer:is(:where(.group\\/attachment)[data-state=\"processing\"] *) {\n --_spread: var(--shimmer-spread, calc(3ch + 40px));\n --_base: currentColor;\n --_highlight: var(--shimmer-color, oklch(from currentColor l c h / calc(alpha* .2)));\n background-image: var(--shimmer-image, linear-gradient(calc(90deg + var(--shimmer-angle)), var(--_base) calc(50% - var(--_spread)), var(--_highlight) calc(50% - var(--_spread) * .5), var(--_highlight) 50%, var(--_highlight) calc(50% + var(--_spread) * .5), var(--_base) calc(50% + var(--_spread))));\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .group-data-\\[state\\=processing\\]\\/attachment\\:shimmer:is(:where(.group\\/attachment)[data-state=\"processing\"] *) {\n background-image: var(--shimmer-image, linear-gradient(calc(90deg + var(--shimmer-angle)), var(--_base) calc(50% - var(--_spread)), color-mix(in oklch, var(--_highlight), var(--_base) 50%) calc(50% - var(--_spread) * .5), var(--_highlight) 50%, color-mix(in oklch, var(--_highlight), var(--_base) 50%) calc(50% + var(--_spread) * .5), var(--_base) calc(50% + var(--_spread))));\n }\n }\n\n .group-data-\\[state\\=processing\\]\\/attachment\\:shimmer:is(:where(.group\\/attachment)[data-state=\"processing\"] *) {\n background-repeat: no-repeat;\n background-size: calc(200% + var(--_spread) * 2) 100%;\n -webkit-text-fill-color: var(--shimmer-text-fill, transparent);\n animation: tw-shimmer var(--shimmer-duration, 2s) linear infinite;\n background-position: 0 0;\n -webkit-background-clip: text;\n background-clip: text;\n }\n\n .group-data-\\[state\\=processing\\]\\/attachment\\:shimmer:is(:where(.group\\/attachment)[data-state=\"processing\"] *):is(.dark *) {\n --_highlight: var(--shimmer-color, oklch(from currentColor max(.8, calc(l + .4)) c h / calc(alpha + .4)));\n }\n\n .group-data-\\[state\\=processing\\]\\/attachment\\:shimmer:is(:where(.group\\/attachment)[data-state=\"processing\"] *):where([dir=\"rtl\"], [dir=\"rtl\"] *) {\n animation-direction: reverse;\n }\n\n .group-data-\\[state\\=uploading\\]\\/attachment\\:shimmer:is(:where(.group\\/attachment)[data-state=\"uploading\"] *) {\n --_spread: var(--shimmer-spread, calc(3ch + 40px));\n --_base: currentColor;\n --_highlight: var(--shimmer-color, oklch(from currentColor l c h / calc(alpha* .2)));\n background-image: var(--shimmer-image, linear-gradient(calc(90deg + var(--shimmer-angle)), var(--_base) calc(50% - var(--_spread)), var(--_highlight) calc(50% - var(--_spread) * .5), var(--_highlight) 50%, var(--_highlight) calc(50% + var(--_spread) * .5), var(--_base) calc(50% + var(--_spread))));\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .group-data-\\[state\\=uploading\\]\\/attachment\\:shimmer:is(:where(.group\\/attachment)[data-state=\"uploading\"] *) {\n background-image: var(--shimmer-image, linear-gradient(calc(90deg + var(--shimmer-angle)), var(--_base) calc(50% - var(--_spread)), color-mix(in oklch, var(--_highlight), var(--_base) 50%) calc(50% - var(--_spread) * .5), var(--_highlight) 50%, color-mix(in oklch, var(--_highlight), var(--_base) 50%) calc(50% + var(--_spread) * .5), var(--_base) calc(50% + var(--_spread))));\n }\n }\n\n .group-data-\\[state\\=uploading\\]\\/attachment\\:shimmer:is(:where(.group\\/attachment)[data-state=\"uploading\"] *) {\n background-repeat: no-repeat;\n background-size: calc(200% + var(--_spread) * 2) 100%;\n -webkit-text-fill-color: var(--shimmer-text-fill, transparent);\n animation: tw-shimmer var(--shimmer-duration, 2s) linear infinite;\n background-position: 0 0;\n -webkit-background-clip: text;\n background-clip: text;\n }\n\n .group-data-\\[state\\=uploading\\]\\/attachment\\:shimmer:is(:where(.group\\/attachment)[data-state=\"uploading\"] *):is(.dark *) {\n --_highlight: var(--shimmer-color, oklch(from currentColor max(.8, calc(l + .4)) c h / calc(alpha + .4)));\n }\n\n .group-data-\\[state\\=uploading\\]\\/attachment\\:shimmer:is(:where(.group\\/attachment)[data-state=\"uploading\"] *):where([dir=\"rtl\"], [dir=\"rtl\"] *) {\n animation-direction: reverse;\n }\n\n .group-data-\\[type\\=checkbox\\]\\/questionnaire-choice\\:hidden:is(:where(.group\\/questionnaire-choice)[data-type=\"checkbox\"] *), .group-data-\\[type\\=radio\\]\\/questionnaire-choice\\:hidden:is(:where(.group\\/questionnaire-choice)[data-type=\"radio\"] *) {\n display: none;\n }\n\n .group-data-\\[type\\=radio\\]\\/questionnaire-choice\\:rounded-full:is(:where(.group\\/questionnaire-choice)[data-type=\"radio\"] *) {\n border-radius: 3.40282e38px;\n }\n\n .group-data-\\[variant\\=floating\\]\\:rounded-lg:is(:where(.group)[data-variant=\"floating\"] *) {\n border-radius: var(--radius);\n }\n\n .group-data-\\[variant\\=floating\\]\\:shadow-sm:is(:where(.group)[data-variant=\"floating\"] *) {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .group-data-\\[variant\\=floating\\]\\:ring-1:is(:where(.group)[data-variant=\"floating\"] *) {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .group-data-\\[variant\\=floating\\]\\:ring-sidebar-border:is(:where(.group)[data-variant=\"floating\"] *) {\n --tw-ring-color: var(--sidebar-border);\n }\n\n .group-data-\\[variant\\=line\\]\\/tabs-list\\:bg-transparent:is(:where(.group\\/tabs-list)[data-variant=\"line\"] *) {\n background-color: #0000;\n }\n\n .group-data-\\[variant\\=separator\\]\\/marker\\:flex-none:is(:where(.group\\/marker)[data-variant=\"separator\"] *) {\n flex: none;\n }\n\n .group-data-\\[variant\\=separator\\]\\/marker\\:text-center:is(:where(.group\\/marker)[data-variant=\"separator\"] *) {\n text-align: center;\n }\n\n .group-data-\\[viewport\\=false\\]\\/navigation-menu\\:rounded-lg:is(:where(.group\\/navigation-menu)[data-viewport=\"false\"] *) {\n border-radius: var(--radius);\n }\n\n .group-data-\\[viewport\\=false\\]\\/navigation-menu\\:bg-popover:is(:where(.group\\/navigation-menu)[data-viewport=\"false\"] *) {\n background-color: var(--popover);\n }\n\n .group-data-\\[viewport\\=false\\]\\/navigation-menu\\:text-popover-foreground:is(:where(.group\\/navigation-menu)[data-viewport=\"false\"] *) {\n color: var(--popover-foreground);\n }\n\n .group-data-\\[viewport\\=false\\]\\/navigation-menu\\:shadow:is(:where(.group\\/navigation-menu)[data-viewport=\"false\"] *) {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .group-data-\\[viewport\\=false\\]\\/navigation-menu\\:ring-1:is(:where(.group\\/navigation-menu)[data-viewport=\"false\"] *) {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .group-data-\\[viewport\\=false\\]\\/navigation-menu\\:ring-foreground\\/10:is(:where(.group\\/navigation-menu)[data-viewport=\"false\"] *) {\n --tw-ring-color: var(--foreground);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .group-data-\\[viewport\\=false\\]\\/navigation-menu\\:ring-foreground\\/10:is(:where(.group\\/navigation-menu)[data-viewport=\"false\"] *) {\n --tw-ring-color: color-mix(in oklab, var(--foreground) 10%, transparent);\n }\n }\n\n .group-data-\\[viewport\\=false\\]\\/navigation-menu\\:duration-300:is(:where(.group\\/navigation-menu)[data-viewport=\"false\"] *) {\n --tw-duration: .3s;\n transition-duration: .3s;\n }\n\n .group-data-open\\/navigation-menu-trigger\\:rotate-180:is(:is(:where(.group\\/navigation-menu-trigger):where([data-state=\"open\"]), :where(.group\\/navigation-menu-trigger):where([data-open]:not([data-open=\"false\"]))) *) {\n rotate: 180deg;\n }\n\n .group-data-checked\\/questionnaire-choice\\:block:is(:is(:where(.group\\/questionnaire-choice):where([data-state=\"checked\"]), :where(.group\\/questionnaire-choice):where([data-checked]:not([data-checked=\"false\"]))) *) {\n display: block;\n }\n\n .group-data-checked\\/questionnaire-choice\\:border-primary:is(:is(:where(.group\\/questionnaire-choice):where([data-state=\"checked\"]), :where(.group\\/questionnaire-choice):where([data-checked]:not([data-checked=\"false\"]))) *) {\n border-color: var(--primary);\n }\n\n .group-data-checked\\/questionnaire-choice\\:bg-primary:is(:is(:where(.group\\/questionnaire-choice):where([data-state=\"checked\"]), :where(.group\\/questionnaire-choice):where([data-checked]:not([data-checked=\"false\"]))) *) {\n background-color: var(--primary);\n }\n\n .group-data-checked\\/questionnaire-choice\\:text-primary-foreground:is(:is(:where(.group\\/questionnaire-choice):where([data-state=\"checked\"]), :where(.group\\/questionnaire-choice):where([data-checked]:not([data-checked=\"false\"]))) *) {\n color: var(--primary-foreground);\n }\n\n .group-data-selected\\/command-item\\:text-foreground:is(:where(.group\\/command-item):where([data-selected=\"true\"]) *) {\n color: var(--foreground);\n }\n\n .group-data-horizontal\\/tabs\\:h-8:is(:where(.group\\/tabs):where([data-orientation=\"horizontal\"]) *) {\n height: calc(var(--spacing) * 8);\n }\n\n .group-data-vertical\\/tabs\\:h-fit:is(:where(.group\\/tabs):where([data-orientation=\"vertical\"]) *) {\n height: fit-content;\n }\n\n .group-data-vertical\\/tabs\\:w-full:is(:where(.group\\/tabs):where([data-orientation=\"vertical\"]) *) {\n width: 100%;\n }\n\n .group-data-vertical\\/tabs\\:flex-col:is(:where(.group\\/tabs):where([data-orientation=\"vertical\"]) *) {\n flex-direction: column;\n }\n\n .group-data-vertical\\/tabs\\:justify-start:is(:where(.group\\/tabs):where([data-orientation=\"vertical\"]) *) {\n justify-content: flex-start;\n }\n\n @media (hover: hover) {\n .peer-hover\\/menu-button\\:text-sidebar-accent-foreground:is(:where(.peer\\/menu-button):hover ~ *) {\n color: var(--sidebar-accent-foreground);\n }\n }\n\n .peer-disabled\\:cursor-not-allowed:is(:where(.peer):disabled ~ *) {\n cursor: not-allowed;\n }\n\n .peer-disabled\\:opacity-50:is(:where(.peer):disabled ~ *) {\n opacity: .5;\n }\n\n .peer-data-\\[size\\=default\\]\\/menu-button\\:top-1\\.5:is(:where(.peer\\/menu-button)[data-size=\"default\"] ~ *) {\n top: calc(var(--spacing) * 1.5);\n }\n\n .peer-data-\\[size\\=lg\\]\\/menu-button\\:top-2\\.5:is(:where(.peer\\/menu-button)[data-size=\"lg\"] ~ *) {\n top: calc(var(--spacing) * 2.5);\n }\n\n .peer-data-\\[size\\=sm\\]\\/menu-button\\:top-1:is(:where(.peer\\/menu-button)[data-size=\"sm\"] ~ *) {\n top: var(--spacing);\n }\n\n .peer-data-active\\/menu-button\\:text-sidebar-accent-foreground:is(:is(:where(.peer\\/menu-button):where([data-state=\"active\"]), :where(.peer\\/menu-button):where([data-active]:not([data-active=\"false\"]))) ~ *) {\n color: var(--sidebar-accent-foreground);\n }\n\n .selection\\:bg-primary ::selection {\n background-color: var(--primary);\n }\n\n .selection\\:bg-primary::selection {\n background-color: var(--primary);\n }\n\n .selection\\:text-primary-foreground ::selection {\n color: var(--primary-foreground);\n }\n\n .selection\\:text-primary-foreground::selection {\n color: var(--primary-foreground);\n }\n\n .file\\:inline-flex::file-selector-button {\n display: inline-flex;\n }\n\n .file\\:h-6::file-selector-button {\n height: calc(var(--spacing) * 6);\n }\n\n .file\\:border-0::file-selector-button {\n border-style: var(--tw-border-style);\n border-width: 0;\n }\n\n .file\\:bg-transparent::file-selector-button {\n background-color: #0000;\n }\n\n .file\\:text-sm::file-selector-button {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n\n .file\\:font-medium::file-selector-button {\n --tw-font-weight: var(--font-weight-medium);\n font-weight: var(--font-weight-medium);\n }\n\n .file\\:text-foreground::file-selector-button {\n color: var(--foreground);\n }\n\n .placeholder\\:text-muted-foreground::placeholder {\n color: var(--muted-foreground);\n }\n\n .before\\:mr-1:before {\n content: var(--tw-content);\n margin-right: var(--spacing);\n }\n\n .before\\:h-px:before {\n content: var(--tw-content);\n height: 1px;\n }\n\n .before\\:min-w-0:before {\n content: var(--tw-content);\n min-width: 0;\n }\n\n .before\\:flex-1:before {\n content: var(--tw-content);\n flex: 1;\n }\n\n .before\\:bg-border:before {\n content: var(--tw-content);\n background-color: var(--border);\n }\n\n .after\\:absolute:after {\n content: var(--tw-content);\n position: absolute;\n }\n\n .after\\:-inset-2:after {\n content: var(--tw-content);\n inset: calc(var(--spacing) * -2);\n }\n\n .after\\:inset-0:after {\n content: var(--tw-content);\n inset: 0;\n }\n\n .after\\:-inset-x-3:after {\n content: var(--tw-content);\n inset-inline: calc(var(--spacing) * -3);\n }\n\n .after\\:-inset-y-2:after {\n content: var(--tw-content);\n inset-block: calc(var(--spacing) * -2);\n }\n\n .after\\:inset-y-0:after {\n content: var(--tw-content);\n inset-block: 0;\n }\n\n .after\\:start-1\\/2:after {\n content: var(--tw-content);\n inset-inline-start: 50%;\n }\n\n .after\\:top-full:after {\n content: var(--tw-content);\n top: 100%;\n }\n\n .after\\:right-0:after {\n content: var(--tw-content);\n right: 0;\n }\n\n .after\\:left-0:after {\n content: var(--tw-content);\n left: 0;\n }\n\n .after\\:left-1\\/2:after {\n content: var(--tw-content);\n left: 50%;\n }\n\n .after\\:ml-1:after {\n content: var(--tw-content);\n margin-left: var(--spacing);\n }\n\n .after\\:h-\\[calc\\(var\\(--gap\\)\\+1px\\)\\]:after {\n content: var(--tw-content);\n height: calc(var(--gap) + 1px);\n }\n\n .after\\:h-px:after {\n content: var(--tw-content);\n height: 1px;\n }\n\n .after\\:w-1:after {\n content: var(--tw-content);\n width: var(--spacing);\n }\n\n .after\\:w-4:after {\n content: var(--tw-content);\n width: calc(var(--spacing) * 4);\n }\n\n .after\\:w-\\[2px\\]:after {\n content: var(--tw-content);\n width: 2px;\n }\n\n .after\\:w-full:after {\n content: var(--tw-content);\n width: 100%;\n }\n\n .after\\:min-w-0:after {\n content: var(--tw-content);\n min-width: 0;\n }\n\n .after\\:flex-1:after {\n content: var(--tw-content);\n flex: 1;\n }\n\n .after\\:-translate-x-1\\/2:after {\n content: var(--tw-content);\n --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .after\\:rounded-full:after {\n content: var(--tw-content);\n border-radius: 3.40282e38px;\n }\n\n .after\\:border:after {\n content: var(--tw-content);\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n\n .after\\:border-border:after {\n content: var(--tw-content);\n border-color: var(--border);\n }\n\n .after\\:bg-border:after {\n content: var(--tw-content);\n background-color: var(--border);\n }\n\n .after\\:bg-foreground:after {\n content: var(--tw-content);\n background-color: var(--foreground);\n }\n\n .after\\:bg-muted:after {\n content: var(--tw-content);\n background-color: var(--muted);\n }\n\n .after\\:opacity-0:after {\n content: var(--tw-content);\n opacity: 0;\n }\n\n .after\\:mix-blend-darken:after {\n content: var(--tw-content);\n mix-blend-mode: darken;\n }\n\n .after\\:transition-opacity:after {\n content: var(--tw-content);\n transition-property: opacity;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .after\\:content-\\[\\'\\'\\]:after {\n --tw-content: \"\";\n content: var(--tw-content);\n }\n\n .group-data-\\[collapsible\\=offcanvas\\]\\:after\\:left-full:is(:where(.group)[data-collapsible=\"offcanvas\"] *):after {\n content: var(--tw-content);\n left: 100%;\n }\n\n .group-data-horizontal\\/tabs\\:after\\:inset-x-0:is(:where(.group\\/tabs):where([data-orientation=\"horizontal\"]) *):after {\n content: var(--tw-content);\n inset-inline: 0;\n }\n\n .group-data-horizontal\\/tabs\\:after\\:bottom-\\[-5px\\]:is(:where(.group\\/tabs):where([data-orientation=\"horizontal\"]) *):after {\n content: var(--tw-content);\n bottom: -5px;\n }\n\n .group-data-horizontal\\/tabs\\:after\\:h-0\\.5:is(:where(.group\\/tabs):where([data-orientation=\"horizontal\"]) *):after {\n content: var(--tw-content);\n height: calc(var(--spacing) * .5);\n }\n\n .group-data-vertical\\/tabs\\:after\\:inset-y-0:is(:where(.group\\/tabs):where([data-orientation=\"vertical\"]) *):after {\n content: var(--tw-content);\n inset-block: 0;\n }\n\n .group-data-vertical\\/tabs\\:after\\:-right-1:is(:where(.group\\/tabs):where([data-orientation=\"vertical\"]) *):after {\n content: var(--tw-content);\n right: calc(var(--spacing) * -1);\n }\n\n .group-data-vertical\\/tabs\\:after\\:w-0\\.5:is(:where(.group\\/tabs):where([data-orientation=\"vertical\"]) *):after {\n content: var(--tw-content);\n width: calc(var(--spacing) * .5);\n }\n\n .first\\:rounded-l-lg:first-child {\n border-top-left-radius: var(--radius);\n border-bottom-left-radius: var(--radius);\n }\n\n .first\\:border-l:first-child {\n border-left-style: var(--tw-border-style);\n border-left-width: 1px;\n }\n\n .last\\:rounded-r-lg:last-child {\n border-top-right-radius: var(--radius);\n border-bottom-right-radius: var(--radius);\n }\n\n .empty\\:py-0:empty {\n padding-block: 0;\n }\n\n .focus-within\\:ring-1:focus-within {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .focus-within\\:ring-ring\\/50:focus-within {\n --tw-ring-color: var(--ring);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .focus-within\\:ring-ring\\/50:focus-within {\n --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);\n }\n }\n\n @media (hover: hover) {\n .hover\\:bg-\\[color-mix\\(in_oklch\\,var\\(--secondary\\)\\,var\\(--foreground\\)_5\\%\\)\\]:hover {\n background-color: var(--secondary);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .hover\\:bg-\\[color-mix\\(in_oklch\\,var\\(--secondary\\)\\,var\\(--foreground\\)_5\\%\\)\\]:hover {\n background-color: color-mix(in oklch,var(--secondary),var(--foreground) 5%);\n }\n }\n\n .hover\\:bg-destructive\\/15:hover {\n background-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .hover\\:bg-destructive\\/15:hover {\n background-color: color-mix(in oklab, var(--destructive) 15%, transparent);\n }\n }\n\n .hover\\:bg-muted:hover {\n background-color: var(--muted);\n }\n\n .hover\\:bg-muted-foreground\\/70:hover {\n background-color: var(--muted-foreground);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .hover\\:bg-muted-foreground\\/70:hover {\n background-color: color-mix(in oklab, var(--muted-foreground) 70%, transparent);\n }\n }\n\n .hover\\:bg-muted\\/50:hover {\n background-color: var(--muted);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .hover\\:bg-muted\\/50:hover {\n background-color: color-mix(in oklab, var(--muted) 50%, transparent);\n }\n }\n\n .hover\\:bg-primary\\/80:hover {\n background-color: var(--primary);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .hover\\:bg-primary\\/80:hover {\n background-color: color-mix(in oklab, var(--primary) 80%, transparent);\n }\n }\n\n .hover\\:bg-sidebar-accent:hover {\n background-color: var(--sidebar-accent);\n }\n\n .hover\\:text-foreground:hover {\n color: var(--foreground);\n }\n\n .hover\\:text-muted-foreground:hover {\n color: var(--muted-foreground);\n }\n\n .hover\\:text-sidebar-accent-foreground:hover {\n color: var(--sidebar-accent-foreground);\n }\n\n .hover\\:underline:hover {\n text-decoration-line: underline;\n }\n\n .hover\\:shadow-\\[0_0_0_1px_var\\(--sidebar-accent\\)\\]:hover {\n --tw-shadow: 0 0 0 1px var(--tw-shadow-color, var(--sidebar-accent));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .hover\\:group-data-\\[collapsible\\=offcanvas\\]\\:bg-sidebar:hover:is(:where(.group)[data-collapsible=\"offcanvas\"] *) {\n background-color: var(--sidebar);\n }\n\n .hover\\:after\\:bg-sidebar-border:hover:after {\n content: var(--tw-content);\n background-color: var(--sidebar-border);\n }\n }\n\n .focus\\:z-10:focus {\n z-index: 10;\n }\n\n .focus\\:bg-accent:focus {\n background-color: var(--accent);\n }\n\n .focus\\:bg-muted:focus {\n background-color: var(--muted);\n }\n\n .focus\\:text-accent-foreground:focus, :is(.focus\\:\\*\\*\\:text-accent-foreground:focus *), :is(.not-data-\\[variant\\=destructive\\]\\:focus\\:\\*\\*\\:text-accent-foreground:not([data-variant=\"destructive\"]):focus *) {\n color: var(--accent-foreground);\n }\n\n .focus-visible\\:z-10:focus-visible {\n z-index: 10;\n }\n\n .focus-visible\\:border-destructive\\/40:focus-visible {\n border-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .focus-visible\\:border-destructive\\/40:focus-visible {\n border-color: color-mix(in oklab, var(--destructive) 40%, transparent);\n }\n }\n\n .focus-visible\\:border-ring:focus-visible {\n border-color: var(--ring);\n }\n\n .focus-visible\\:ring-0:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .focus-visible\\:ring-1:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .focus-visible\\:ring-2:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .focus-visible\\:ring-3:focus-visible, .focus-visible\\:ring-\\[3px\\]:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .focus-visible\\:ring-destructive\\/20:focus-visible {\n --tw-ring-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .focus-visible\\:ring-destructive\\/20:focus-visible {\n --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);\n }\n }\n\n .focus-visible\\:ring-info\\/20:focus-visible {\n --tw-ring-color: var(--info);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .focus-visible\\:ring-info\\/20:focus-visible {\n --tw-ring-color: color-mix(in oklab, var(--info) 20%, transparent);\n }\n }\n\n .focus-visible\\:ring-ring:focus-visible, .focus-visible\\:ring-ring\\/50:focus-visible {\n --tw-ring-color: var(--ring);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .focus-visible\\:ring-ring\\/50:focus-visible {\n --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);\n }\n }\n\n .focus-visible\\:ring-success\\/20:focus-visible {\n --tw-ring-color: var(--success);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .focus-visible\\:ring-success\\/20:focus-visible {\n --tw-ring-color: color-mix(in oklab, var(--success) 20%, transparent);\n }\n }\n\n .focus-visible\\:ring-warning\\/20:focus-visible {\n --tw-ring-color: var(--warning);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .focus-visible\\:ring-warning\\/20:focus-visible {\n --tw-ring-color: color-mix(in oklab, var(--warning) 20%, transparent);\n }\n }\n\n .focus-visible\\:ring-offset-2:focus-visible {\n --tw-ring-offset-width: 2px;\n --tw-ring-offset-shadow: var(--tw-ring-inset, ) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n }\n\n .focus-visible\\:outline-hidden:focus-visible {\n --tw-outline-style: none;\n outline-style: none;\n }\n\n @media (forced-colors: active) {\n .focus-visible\\:outline-hidden:focus-visible {\n outline-offset: 2px;\n outline: 2px solid #0000;\n }\n }\n\n .focus-visible\\:outline-1:focus-visible {\n outline-style: var(--tw-outline-style);\n outline-width: 1px;\n }\n\n .focus-visible\\:outline-ring:focus-visible {\n outline-color: var(--ring);\n }\n\n .focus-visible\\:outline-none:focus-visible {\n --tw-outline-style: none;\n outline-style: none;\n }\n\n .active\\:bg-sidebar-accent:active {\n background-color: var(--sidebar-accent);\n }\n\n .active\\:text-sidebar-accent-foreground:active {\n color: var(--sidebar-accent-foreground);\n }\n\n .active\\:not-aria-\\[haspopup\\]\\:translate-y-px:active:not([aria-haspopup]) {\n --tw-translate-y: 1px;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .disabled\\:pointer-events-none:disabled {\n pointer-events: none;\n }\n\n .disabled\\:cursor-not-allowed:disabled {\n cursor: not-allowed;\n }\n\n .disabled\\:bg-input\\/50:disabled {\n background-color: var(--input);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .disabled\\:bg-input\\/50:disabled {\n background-color: color-mix(in oklab, var(--input) 50%, transparent);\n }\n }\n\n .disabled\\:bg-transparent:disabled {\n background-color: #0000;\n }\n\n .disabled\\:opacity-50:disabled {\n opacity: .5;\n }\n\n :where([data-edx-button-group-position=\"horizontal-first\"]) .in-data-\\[edx-button-group-position\\=horizontal-first\\]\\:rounded-r-none {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n :where([data-edx-button-group-position=\"horizontal-last\"]) .in-data-\\[edx-button-group-position\\=horizontal-last\\]\\:rounded-l-none {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n }\n\n :where([data-edx-button-group-position=\"horizontal-middle\"]) .in-data-\\[edx-button-group-position\\=horizontal-middle\\]\\:rounded-none {\n border-radius: 0;\n }\n\n :where([data-edx-button-group-position=\"vertical-first\"]) .in-data-\\[edx-button-group-position\\=vertical-first\\]\\:rounded-b-none {\n border-bottom-right-radius: 0;\n border-bottom-left-radius: 0;\n }\n\n :where([data-edx-button-group-position=\"vertical-last\"]) .in-data-\\[edx-button-group-position\\=vertical-last\\]\\:rounded-t-none {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n\n :where([data-edx-button-group-position=\"vertical-middle\"]) .in-data-\\[edx-button-group-position\\=vertical-middle\\]\\:rounded-none {\n border-radius: 0;\n }\n\n :where([data-orientation=\"horizontal\"]) .in-data-\\[orientation\\=horizontal\\]\\:w-px {\n width: 1px;\n }\n\n :where([data-orientation=\"vertical\"]) .in-data-\\[orientation\\=vertical\\]\\:h-px {\n height: 1px;\n }\n\n :where([data-orientation=\"vertical\"]) .in-data-\\[orientation\\=vertical\\]\\:w-full {\n width: 100%;\n }\n\n :where([data-orientation=\"vertical\"]) .in-data-\\[orientation\\=vertical\\]\\:self-auto {\n align-self: auto;\n }\n\n :where([data-side=\"left\"]) .in-data-\\[side\\=left\\]\\:cursor-w-resize {\n cursor: w-resize;\n }\n\n :where([data-side=\"right\"]) .in-data-\\[side\\=right\\]\\:cursor-e-resize {\n cursor: e-resize;\n }\n\n :where([data-slot=\"button-group\"]) .in-data-\\[slot\\=button-group\\]\\:rounded-lg {\n border-radius: var(--radius);\n }\n\n :where([data-slot=\"card-content\"]) .in-data-\\[slot\\=card-content\\]\\:bg-transparent {\n background-color: #0000;\n }\n\n :where([data-slot=\"dialog-content\"]) .in-data-\\[slot\\=dialog-content\\]\\:rounded-lg\\! {\n border-radius: var(--radius) !important;\n }\n\n :where([data-slot=\"dropdown-menu-content\"]) .in-data-\\[slot\\=dropdown-menu-content\\]\\:p-0 {\n padding: 0;\n }\n\n :where([data-slot=\"navigation-menu-content\"]) .in-data-\\[slot\\=navigation-menu-content\\]\\:rounded-md {\n border-radius: calc(var(--radius) * .8);\n }\n\n :where([data-slot=\"popover-content\"]) .in-data-\\[slot\\=popover-content\\]\\:bg-transparent {\n background-color: #0000;\n }\n\n :where([data-slot=\"tooltip-content\"]) .in-data-\\[slot\\=tooltip-content\\]\\:bg-background\\/20 {\n background-color: var(--background);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n :where([data-slot=\"tooltip-content\"]) .in-data-\\[slot\\=tooltip-content\\]\\:bg-background\\/20 {\n background-color: color-mix(in oklab, var(--background) 20%, transparent);\n }\n }\n\n :where([data-slot=\"tooltip-content\"]) .in-data-\\[slot\\=tooltip-content\\]\\:text-background {\n color: var(--background);\n }\n\n .has-disabled\\:bg-input\\/50:has(:disabled) {\n background-color: var(--input);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .has-disabled\\:bg-input\\/50:has(:disabled) {\n background-color: color-mix(in oklab, var(--input) 50%, transparent);\n }\n }\n\n .has-disabled\\:opacity-50:has(:disabled) {\n opacity: .5;\n }\n\n .has-aria-invalid\\:border-destructive:has([aria-invalid=\"true\"]) {\n border-color: var(--destructive);\n }\n\n .has-aria-invalid\\:ring-3:has([aria-invalid=\"true\"]) {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .has-aria-invalid\\:ring-destructive\\/20:has([aria-invalid=\"true\"]) {\n --tw-ring-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .has-aria-invalid\\:ring-destructive\\/20:has([aria-invalid=\"true\"]) {\n --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);\n }\n }\n\n .has-data-\\[icon\\=inline-end\\]\\:pr-1\\.5:has([data-icon=\"inline-end\"]) {\n padding-right: calc(var(--spacing) * 1.5);\n }\n\n .has-data-\\[icon\\=inline-end\\]\\:pr-2:has([data-icon=\"inline-end\"]) {\n padding-right: calc(var(--spacing) * 2);\n }\n\n .group-data-\\[spacing\\=0\\]\\/toggle-group\\:has-data-\\[icon\\=inline-end\\]\\:pr-1\\.5:is(:where(.group\\/toggle-group)[data-spacing=\"0\"] *):has([data-icon=\"inline-end\"]) {\n padding-right: calc(var(--spacing) * 1.5);\n }\n\n .has-data-\\[icon\\=inline-start\\]\\:pl-1\\.5:has([data-icon=\"inline-start\"]) {\n padding-left: calc(var(--spacing) * 1.5);\n }\n\n .has-data-\\[icon\\=inline-start\\]\\:pl-2:has([data-icon=\"inline-start\"]) {\n padding-left: calc(var(--spacing) * 2);\n }\n\n .group-data-\\[spacing\\=0\\]\\/toggle-group\\:has-data-\\[icon\\=inline-start\\]\\:pl-1\\.5:is(:where(.group\\/toggle-group)[data-spacing=\"0\"] *):has([data-icon=\"inline-start\"]) {\n padding-left: calc(var(--spacing) * 1.5);\n }\n\n .has-data-\\[size\\=sm\\]\\:gap-2\\.5:has([data-size=\"sm\"]) {\n gap: calc(var(--spacing) * 2.5);\n }\n\n .has-data-\\[size\\=xs\\]\\:gap-2:has([data-size=\"xs\"]) {\n gap: calc(var(--spacing) * 2);\n }\n\n .has-data-\\[slot\\=alert-action\\]\\:relative:has([data-slot=\"alert-action\"]) {\n position: relative;\n }\n\n .has-data-\\[slot\\=alert-action\\]\\:pr-18:has([data-slot=\"alert-action\"]) {\n padding-right: calc(var(--spacing) * 18);\n }\n\n .has-data-\\[slot\\=alert-dialog-media\\]\\:grid-rows-\\[auto_auto_1fr\\]:has([data-slot=\"alert-dialog-media\"]) {\n grid-template-rows: auto auto 1fr;\n }\n\n .has-data-\\[slot\\=alert-dialog-media\\]\\:gap-x-4:has([data-slot=\"alert-dialog-media\"]) {\n column-gap: calc(var(--spacing) * 4);\n }\n\n .has-data-\\[slot\\=attachment-content\\]\\:w-30:has([data-slot=\"attachment-content\"]) {\n width: calc(var(--spacing) * 30);\n }\n\n .has-data-\\[slot\\=attachment-content\\]\\:px-1\\.5:has([data-slot=\"attachment-content\"]) {\n padding-inline: calc(var(--spacing) * 1.5);\n }\n\n .has-data-\\[slot\\=attachment-content\\]\\:px-2:has([data-slot=\"attachment-content\"]) {\n padding-inline: calc(var(--spacing) * 2);\n }\n\n .has-data-\\[slot\\=attachment-content\\]\\:px-2\\.5:has([data-slot=\"attachment-content\"]) {\n padding-inline: calc(var(--spacing) * 2.5);\n }\n\n .has-data-\\[slot\\=attachment-content\\]\\:py-1:has([data-slot=\"attachment-content\"]) {\n padding-block: var(--spacing);\n }\n\n .has-data-\\[slot\\=attachment-content\\]\\:py-1\\.5:has([data-slot=\"attachment-content\"]) {\n padding-block: calc(var(--spacing) * 1.5);\n }\n\n .has-data-\\[slot\\=attachment-content\\]\\:py-2:has([data-slot=\"attachment-content\"]) {\n padding-block: calc(var(--spacing) * 2);\n }\n\n .has-data-\\[slot\\=attachment-media\\]\\:p-1:has([data-slot=\"attachment-media\"]) {\n padding: var(--spacing);\n }\n\n .has-data-\\[slot\\=attachment-media\\]\\:p-1\\.5:has([data-slot=\"attachment-media\"]) {\n padding: calc(var(--spacing) * 1.5);\n }\n\n .has-data-\\[slot\\=attachment-media\\]\\:p-2:has([data-slot=\"attachment-media\"]) {\n padding: calc(var(--spacing) * 2);\n }\n\n .has-data-\\[slot\\=card-action\\]\\:grid-cols-\\[1fr_auto\\]:has([data-slot=\"card-action\"]) {\n grid-template-columns: 1fr auto;\n }\n\n .has-data-\\[slot\\=card-description\\]\\:grid-rows-\\[auto_auto\\]:has([data-slot=\"card-description\"]) {\n grid-template-rows: auto auto;\n }\n\n .has-data-\\[slot\\=card-footer\\]\\:pb-0:has([data-slot=\"card-footer\"]) {\n padding-bottom: 0;\n }\n\n .has-data-\\[slot\\=kbd\\]\\:pr-1\\.5:has([data-slot=\"kbd\"]) {\n padding-right: calc(var(--spacing) * 1.5);\n }\n\n .has-data-\\[variant\\=inset\\]\\:bg-sidebar:has([data-variant=\"inset\"]) {\n background-color: var(--sidebar);\n }\n\n .has-\\[\\[data-slot\\=input-group-control\\]\\:focus-visible\\]\\:border-ring:has([data-slot=\"input-group-control\"]:focus-visible) {\n border-color: var(--ring);\n }\n\n .has-\\[\\[data-slot\\=input-group-control\\]\\:focus-visible\\]\\:ring-3:has([data-slot=\"input-group-control\"]:focus-visible) {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .has-\\[\\[data-slot\\=input-group-control\\]\\:focus-visible\\]\\:ring-ring\\/50:has([data-slot=\"input-group-control\"]:focus-visible) {\n --tw-ring-color: var(--ring);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .has-\\[\\[data-slot\\=input-group-control\\]\\:focus-visible\\]\\:ring-ring\\/50:has([data-slot=\"input-group-control\"]:focus-visible) {\n --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);\n }\n }\n\n .has-\\[\\[data-slot\\]\\[aria-invalid\\=true\\]\\]\\:border-destructive:has([data-slot][aria-invalid=\"true\"]) {\n border-color: var(--destructive);\n }\n\n .has-\\[\\[data-slot\\]\\[aria-invalid\\=true\\]\\]\\:ring-3:has([data-slot][aria-invalid=\"true\"]) {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .has-\\[\\[data-slot\\]\\[aria-invalid\\=true\\]\\]\\:ring-destructive\\/20:has([data-slot][aria-invalid=\"true\"]) {\n --tw-ring-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .has-\\[\\[data-slot\\]\\[aria-invalid\\=true\\]\\]\\:ring-destructive\\/20:has([data-slot][aria-invalid=\"true\"]) {\n --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);\n }\n }\n\n .has-\\[button\\]\\:p-0:has(:is(button)) {\n padding: 0;\n }\n\n .has-\\[select\\:disabled\\]\\:opacity-50:has(:is(select:disabled)) {\n opacity: .5;\n }\n\n .has-\\[\\>\\[data-align\\=block-end\\]\\]\\:h-auto:has( > [data-align=\"block-end\"]) {\n height: auto;\n }\n\n .has-\\[\\>\\[data-align\\=block-end\\]\\]\\:flex-col:has( > [data-align=\"block-end\"]) {\n flex-direction: column;\n }\n\n .has-\\[\\>\\[data-align\\=block-start\\]\\]\\:h-auto:has( > [data-align=\"block-start\"]) {\n height: auto;\n }\n\n .has-\\[\\>\\[data-align\\=block-start\\]\\]\\:flex-col:has( > [data-align=\"block-start\"]) {\n flex-direction: column;\n }\n\n @media (hover: hover) {\n .has-\\[\\>a\\,\\>button\\]\\:hover\\:bg-muted\\/50:has( > a, > button):hover {\n background-color: var(--muted);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .has-\\[\\>a\\,\\>button\\]\\:hover\\:bg-muted\\/50:has( > a, > button):hover {\n background-color: color-mix(in oklab, var(--muted) 50%, transparent);\n }\n }\n }\n\n .has-\\[\\>button\\]\\:mr-\\[-0\\.3rem\\]:has( > button) {\n margin-right: -.3rem;\n }\n\n .has-\\[\\>button\\]\\:ml-\\[-0\\.3rem\\]:has( > button) {\n margin-left: -.3rem;\n }\n\n .has-\\[\\>img\\:first-child\\]\\:pt-0:has( > img:first-child) {\n padding-top: 0;\n }\n\n .has-\\[\\>input\\:focus-visible\\]\\:border-ring:has( > input:focus-visible) {\n border-color: var(--ring);\n }\n\n .has-\\[\\>input\\:focus-visible\\]\\:ring-3:has( > input:focus-visible) {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .has-\\[\\>input\\:focus-visible\\]\\:ring-ring\\/50:has( > input:focus-visible) {\n --tw-ring-color: var(--ring);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .has-\\[\\>input\\:focus-visible\\]\\:ring-ring\\/50:has( > input:focus-visible) {\n --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);\n }\n }\n\n .has-\\[\\>kbd\\]\\:mr-\\[-0\\.15rem\\]:has( > kbd) {\n margin-right: -.15rem;\n }\n\n .has-\\[\\>kbd\\]\\:ml-\\[-0\\.15rem\\]:has( > kbd) {\n margin-left: -.15rem;\n }\n\n .has-\\[\\>svg\\]\\:grid-cols-\\[auto_1fr\\]:has( > svg) {\n grid-template-columns: auto 1fr;\n }\n\n .has-\\[\\>svg\\]\\:gap-x-2:has( > svg) {\n column-gap: calc(var(--spacing) * 2);\n }\n\n .has-\\[\\>svg\\]\\:p-0:has( > svg) {\n padding: 0;\n }\n\n .has-\\[\\>textarea\\]\\:h-auto:has( > textarea) {\n height: auto;\n }\n\n .aria-disabled\\:pointer-events-none[aria-disabled=\"true\"] {\n pointer-events: none;\n }\n\n .aria-disabled\\:opacity-50[aria-disabled=\"true\"] {\n opacity: .5;\n }\n\n .aria-expanded\\:bg-muted[aria-expanded=\"true\"] {\n background-color: var(--muted);\n }\n\n .aria-expanded\\:bg-secondary[aria-expanded=\"true\"] {\n background-color: var(--secondary);\n }\n\n .aria-expanded\\:text-foreground[aria-expanded=\"true\"] {\n color: var(--foreground);\n }\n\n .aria-expanded\\:text-secondary-foreground[aria-expanded=\"true\"] {\n color: var(--secondary-foreground);\n }\n\n .aria-expanded\\:opacity-100[aria-expanded=\"true\"] {\n opacity: 1;\n }\n\n .aria-invalid\\:border-destructive[aria-invalid=\"true\"] {\n border-color: var(--destructive);\n }\n\n .aria-invalid\\:ring-0[aria-invalid=\"true\"] {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .aria-invalid\\:ring-3[aria-invalid=\"true\"] {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .aria-invalid\\:ring-destructive\\/20[aria-invalid=\"true\"] {\n --tw-ring-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .aria-invalid\\:ring-destructive\\/20[aria-invalid=\"true\"] {\n --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);\n }\n }\n\n .aria-invalid\\:aria-checked\\:border-primary[aria-invalid=\"true\"][aria-checked=\"true\"] {\n border-color: var(--primary);\n }\n\n .aria-selected\\:text-muted-foreground[aria-selected=\"true\"] {\n color: var(--muted-foreground);\n }\n\n .aria-\\[orientation\\=horizontal\\]\\:h-px[aria-orientation=\"horizontal\"] {\n height: 1px;\n }\n\n .aria-\\[orientation\\=horizontal\\]\\:w-full[aria-orientation=\"horizontal\"] {\n width: 100%;\n }\n\n .aria-\\[orientation\\=horizontal\\]\\:after\\:left-0[aria-orientation=\"horizontal\"]:after {\n content: var(--tw-content);\n left: 0;\n }\n\n .aria-\\[orientation\\=horizontal\\]\\:after\\:h-1[aria-orientation=\"horizontal\"]:after {\n content: var(--tw-content);\n height: var(--spacing);\n }\n\n .aria-\\[orientation\\=horizontal\\]\\:after\\:w-full[aria-orientation=\"horizontal\"]:after {\n content: var(--tw-content);\n width: 100%;\n }\n\n .aria-\\[orientation\\=horizontal\\]\\:after\\:translate-x-0[aria-orientation=\"horizontal\"]:after {\n content: var(--tw-content);\n --tw-translate-x: 0;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .aria-\\[orientation\\=horizontal\\]\\:after\\:-translate-y-1\\/2[aria-orientation=\"horizontal\"]:after {\n content: var(--tw-content);\n --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .aria-\\[orientation\\=vertical\\]\\:flex-col[aria-orientation=\"vertical\"] {\n flex-direction: column;\n }\n\n .data-autoscrolling\\:scrollbar-thumb-transparent[data-autoscrolling] {\n --tw-scrollbar-thumb: transparent;\n scrollbar-color: var(--tw-scrollbar-thumb) var(--tw-scrollbar-track);\n }\n\n .data-autoscrolling\\:scrollbar-track-transparent[data-autoscrolling] {\n --tw-scrollbar-track: transparent;\n scrollbar-color: var(--tw-scrollbar-thumb) var(--tw-scrollbar-track);\n }\n\n .data-behind\\:opacity-0[data-behind] {\n opacity: 0;\n }\n\n .data-ending-style\\:h-0[data-ending-style] {\n height: 0;\n }\n\n .data-ending-style\\:scale-90[data-ending-style] {\n --tw-scale-x: 90%;\n --tw-scale-y: 90%;\n --tw-scale-z: 90%;\n scale: var(--tw-scale-x) var(--tw-scale-y);\n }\n\n .data-ending-style\\:opacity-0[data-ending-style] {\n opacity: 0;\n }\n\n .data-ending-style\\:duration-150[data-ending-style] {\n --tw-duration: .15s;\n transition-duration: .15s;\n }\n\n .data-expanded\\:h-\\(--toast-height\\)[data-expanded] {\n height: var(--toast-height);\n }\n\n .data-expanded\\:\\[transform\\:translateX\\(var\\(--toast-swipe-movement-x\\)\\)_translateY\\(var\\(--offset-y\\)\\)\\][data-expanded] {\n transform: translateX(var(--toast-swipe-movement-x)) translateY(var(--offset-y));\n }\n\n .data-expanded\\:opacity-100[data-expanded] {\n opacity: 1;\n }\n\n .data-highlighted\\:bg-accent[data-highlighted] {\n background-color: var(--accent);\n }\n\n .data-highlighted\\:text-accent-foreground[data-highlighted] {\n color: var(--accent-foreground);\n }\n\n .data-hovering\\:opacity-100[data-hovering] {\n opacity: 1;\n }\n\n .data-indeterminate\\:w-1\\/3[data-indeterminate] {\n width: 33.3333%;\n }\n\n .data-indeterminate\\:animate-\\[progress-indeterminate_1\\.5s_ease-in-out_infinite\\][data-indeterminate] {\n animation: 1.5s ease-in-out infinite progress-indeterminate;\n }\n\n .data-instant\\:transition-none[data-instant] {\n transition-property: none;\n }\n\n .data-invalid\\:border-destructive[data-invalid] {\n border-color: var(--destructive);\n }\n\n .data-limited\\:opacity-0[data-limited] {\n opacity: 0;\n }\n\n .data-pending-scroll\\:invisible[data-pending-scroll] {\n visibility: hidden;\n }\n\n .data-placeholder\\:text-muted-foreground[data-placeholder] {\n color: var(--muted-foreground);\n }\n\n .data-popup-open\\:border-ring[data-popup-open] {\n border-color: var(--ring);\n }\n\n .data-popup-open\\:bg-accent[data-popup-open] {\n background-color: var(--accent);\n }\n\n .data-popup-open\\:bg-muted\\/50[data-popup-open] {\n background-color: var(--muted);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .data-popup-open\\:bg-muted\\/50[data-popup-open] {\n background-color: color-mix(in oklab, var(--muted) 50%, transparent);\n }\n }\n\n .data-popup-open\\:text-accent-foreground[data-popup-open] {\n color: var(--accent-foreground);\n }\n\n .data-popup-open\\:ring-3[data-popup-open] {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .data-popup-open\\:ring-ring\\/50[data-popup-open] {\n --tw-ring-color: var(--ring);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .data-popup-open\\:ring-ring\\/50[data-popup-open] {\n --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);\n }\n }\n\n @media (hover: hover) {\n .data-popup-open\\:hover\\:bg-muted[data-popup-open]:hover {\n background-color: var(--muted);\n }\n }\n\n .data-pressed\\:bg-muted[data-pressed] {\n background-color: var(--muted);\n }\n\n .data-pressed\\:text-foreground[data-pressed] {\n color: var(--foreground);\n }\n\n .data-scrolling\\:bg-muted-foreground\\/70[data-scrolling] {\n background-color: var(--muted-foreground);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .data-scrolling\\:bg-muted-foreground\\/70[data-scrolling] {\n background-color: color-mix(in oklab, var(--muted-foreground) 70%, transparent);\n }\n }\n\n .data-scrolling\\:opacity-100[data-scrolling] {\n opacity: 1;\n }\n\n :is(.group-data-\\[align\\=end\\]\\/message\\:\\*\\:data-slot\\:self-end:is(:where(.group\\/message)[data-align=\"end\"] *) > *)[data-slot] {\n align-self: flex-end;\n }\n\n .data-starting-style\\:h-0[data-starting-style] {\n height: 0;\n }\n\n .data-starting-style\\:scale-90[data-starting-style] {\n --tw-scale-x: 90%;\n --tw-scale-y: 90%;\n --tw-scale-z: 90%;\n scale: var(--tw-scale-x) var(--tw-scale-y);\n }\n\n .data-starting-style\\:\\[transform\\:translateY\\(150\\%\\)\\][data-starting-style] {\n transform: translateY(150%);\n }\n\n .data-starting-style\\:opacity-0[data-starting-style] {\n opacity: 0;\n }\n\n .data-ending-style\\:data-\\[activation-direction\\=left\\]\\:translate-x-\\[50\\%\\][data-ending-style][data-activation-direction=\"left\"] {\n --tw-translate-x: 50%;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .data-starting-style\\:data-\\[activation-direction\\=left\\]\\:translate-x-\\[-50\\%\\][data-starting-style][data-activation-direction=\"left\"], .data-ending-style\\:data-\\[activation-direction\\=right\\]\\:translate-x-\\[-50\\%\\][data-ending-style][data-activation-direction=\"right\"] {\n --tw-translate-x: -50%;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .data-starting-style\\:data-\\[activation-direction\\=right\\]\\:translate-x-\\[50\\%\\][data-starting-style][data-activation-direction=\"right\"] {\n --tw-translate-x: 50%;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .data-\\[active\\=false\\]\\:pointer-events-none[data-active=\"false\"] {\n pointer-events: none;\n }\n\n .data-\\[active\\=false\\]\\:scale-95[data-active=\"false\"] {\n --tw-scale-x: 95%;\n --tw-scale-y: 95%;\n --tw-scale-z: 95%;\n scale: var(--tw-scale-x) var(--tw-scale-y);\n }\n\n .data-\\[active\\=false\\]\\:opacity-0[data-active=\"false\"] {\n opacity: 0;\n }\n\n .data-\\[active\\=false\\]\\:duration-400[data-active=\"false\"] {\n --tw-duration: .4s;\n transition-duration: .4s;\n }\n\n .data-\\[active\\=false\\]\\:ease-\\[cubic-bezier\\(0\\.7\\,0\\,0\\.84\\,0\\)\\][data-active=\"false\"] {\n --tw-ease: cubic-bezier(.7,0,.84,0);\n transition-timing-function: cubic-bezier(.7, 0, .84, 0);\n }\n\n .data-\\[active\\=true\\]\\:z-10[data-active=\"true\"] {\n z-index: 10;\n }\n\n .data-\\[active\\=true\\]\\:translate-y-0[data-active=\"true\"] {\n --tw-translate-y: 0;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .data-\\[active\\=true\\]\\:scale-100[data-active=\"true\"] {\n --tw-scale-x: 100%;\n --tw-scale-y: 100%;\n --tw-scale-z: 100%;\n scale: var(--tw-scale-x) var(--tw-scale-y);\n }\n\n .data-\\[active\\=true\\]\\:border-ring[data-active=\"true\"] {\n border-color: var(--ring);\n }\n\n .data-\\[active\\=true\\]\\:opacity-100[data-active=\"true\"] {\n opacity: 1;\n }\n\n .data-\\[active\\=true\\]\\:ring-3[data-active=\"true\"] {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .data-\\[active\\=true\\]\\:ring-ring\\/50[data-active=\"true\"] {\n --tw-ring-color: var(--ring);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .data-\\[active\\=true\\]\\:ring-ring\\/50[data-active=\"true\"] {\n --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);\n }\n }\n\n .data-\\[active\\=true\\]\\:ease-\\[cubic-bezier\\(0\\.23\\,1\\,0\\.32\\,1\\)\\][data-active=\"true\"] {\n --tw-ease: cubic-bezier(.23,1,.32,1);\n transition-timing-function: cubic-bezier(.23, 1, .32, 1);\n }\n\n .data-\\[active\\=true\\]\\:aria-invalid\\:border-destructive[data-active=\"true\"][aria-invalid=\"true\"] {\n border-color: var(--destructive);\n }\n\n .data-\\[active\\=true\\]\\:aria-invalid\\:ring-destructive\\/20[data-active=\"true\"][aria-invalid=\"true\"] {\n --tw-ring-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .data-\\[active\\=true\\]\\:aria-invalid\\:ring-destructive\\/20[data-active=\"true\"][aria-invalid=\"true\"] {\n --tw-ring-color: color-mix(in oklab, var(--destructive) 20%, transparent);\n }\n }\n\n .data-\\[align\\=end\\]\\:flex-row-reverse[data-align=\"end\"] {\n flex-direction: row-reverse;\n }\n\n .data-\\[align\\=end\\]\\:self-end[data-align=\"end\"] {\n align-self: flex-end;\n }\n\n .data-\\[direction\\=end\\]\\:bottom-4[data-direction=\"end\"] {\n bottom: calc(var(--spacing) * 4);\n }\n\n .data-\\[direction\\=end\\]\\:data-\\[active\\=false\\]\\:translate-y-full[data-direction=\"end\"][data-active=\"false\"] {\n --tw-translate-y: 100%;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .data-\\[direction\\=start\\]\\:top-4[data-direction=\"start\"] {\n top: calc(var(--spacing) * 4);\n }\n\n .data-\\[direction\\=start\\]\\:data-\\[active\\=false\\]\\:-translate-y-full[data-direction=\"start\"][data-active=\"false\"] {\n --tw-translate-y: -100%;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .data-\\[disabled\\=true\\]\\:pointer-events-none[data-disabled=\"true\"] {\n pointer-events: none;\n }\n\n .data-\\[disabled\\=true\\]\\:opacity-50[data-disabled=\"true\"] {\n opacity: .5;\n }\n\n .data-\\[inset\\=true\\]\\:pl-7[data-inset=\"true\"] {\n padding-left: calc(var(--spacing) * 7);\n }\n\n .data-\\[motion\\=from-end\\]\\:slide-in-from-right-52[data-motion=\"from-end\"] {\n --tw-enter-translate-x: calc(52*var(--spacing));\n }\n\n .data-\\[motion\\=from-start\\]\\:slide-in-from-left-52[data-motion=\"from-start\"] {\n --tw-enter-translate-x: calc(52*var(--spacing)*-1);\n }\n\n .data-\\[motion\\=to-end\\]\\:slide-out-to-right-52[data-motion=\"to-end\"] {\n --tw-exit-translate-x: calc(52*var(--spacing));\n }\n\n .data-\\[motion\\=to-start\\]\\:slide-out-to-left-52[data-motion=\"to-start\"] {\n --tw-exit-translate-x: calc(52*var(--spacing)*-1);\n }\n\n .data-\\[motion\\^\\=from-\\]\\:animate-in[data-motion^=\"from-\"] {\n animation: enter var(--tw-animation-duration, var(--tw-duration, .15s))var(--tw-ease, ease)var(--tw-animation-delay, 0s)var(--tw-animation-iteration-count, 1)var(--tw-animation-direction, normal)var(--tw-animation-fill-mode, none);\n }\n\n .data-\\[motion\\^\\=from-\\]\\:fade-in[data-motion^=\"from-\"] {\n --tw-enter-opacity: 0;\n }\n\n .data-\\[motion\\^\\=to-\\]\\:animate-out[data-motion^=\"to-\"] {\n animation: exit var(--tw-animation-duration, var(--tw-duration, .15s))var(--tw-ease, ease)var(--tw-animation-delay, 0s)var(--tw-animation-iteration-count, 1)var(--tw-animation-direction, normal)var(--tw-animation-fill-mode, none);\n }\n\n .data-\\[motion\\^\\=to-\\]\\:fade-out[data-motion^=\"to-\"] {\n --tw-exit-opacity: 0;\n }\n\n .data-\\[orientation\\=horizontal\\]\\:flex[data-orientation=\"horizontal\"] {\n display: flex;\n }\n\n .data-\\[orientation\\=horizontal\\]\\:items-center[data-orientation=\"horizontal\"] {\n align-items: center;\n }\n\n .data-\\[orientation\\=vertical\\]\\:flex-col[data-orientation=\"vertical\"] {\n flex-direction: column;\n }\n\n .data-\\[range-end\\=true\\]\\:rounded-\\(--cell-radius\\)[data-range-end=\"true\"] {\n border-radius: var(--cell-radius);\n }\n\n .data-\\[range-end\\=true\\]\\:rounded-r-\\(--cell-radius\\)[data-range-end=\"true\"] {\n border-top-right-radius: var(--cell-radius);\n border-bottom-right-radius: var(--cell-radius);\n }\n\n .data-\\[range-end\\=true\\]\\:bg-primary[data-range-end=\"true\"] {\n background-color: var(--primary);\n }\n\n .data-\\[range-end\\=true\\]\\:text-primary-foreground[data-range-end=\"true\"] {\n color: var(--primary-foreground);\n }\n\n .data-\\[range-middle\\=true\\]\\:rounded-none[data-range-middle=\"true\"] {\n border-radius: 0;\n }\n\n .data-\\[range-middle\\=true\\]\\:bg-muted[data-range-middle=\"true\"] {\n background-color: var(--muted);\n }\n\n .data-\\[range-middle\\=true\\]\\:text-foreground[data-range-middle=\"true\"] {\n color: var(--foreground);\n }\n\n .data-\\[range-start\\=true\\]\\:rounded-\\(--cell-radius\\)[data-range-start=\"true\"] {\n border-radius: var(--cell-radius);\n }\n\n .data-\\[range-start\\=true\\]\\:rounded-l-\\(--cell-radius\\)[data-range-start=\"true\"] {\n border-top-left-radius: var(--cell-radius);\n border-bottom-left-radius: var(--cell-radius);\n }\n\n .data-\\[range-start\\=true\\]\\:bg-primary[data-range-start=\"true\"] {\n background-color: var(--primary);\n }\n\n .data-\\[range-start\\=true\\]\\:text-primary-foreground[data-range-start=\"true\"] {\n color: var(--primary-foreground);\n }\n\n .data-\\[selected\\]\\:font-medium[data-selected] {\n --tw-font-weight: var(--font-weight-medium);\n font-weight: var(--font-weight-medium);\n }\n\n .data-\\[selected-single\\=true\\]\\:bg-primary[data-selected-single=\"true\"] {\n background-color: var(--primary);\n }\n\n .data-\\[selected-single\\=true\\]\\:text-primary-foreground[data-selected-single=\"true\"] {\n color: var(--primary-foreground);\n }\n\n .data-\\[selected\\=true\\]\\:rounded-none[data-selected=\"true\"] {\n border-radius: 0;\n }\n\n .data-\\[side\\=bottom\\]\\:inset-x-0[data-side=\"bottom\"] {\n inset-inline: 0;\n }\n\n .data-\\[side\\=bottom\\]\\:top-1[data-side=\"bottom\"] {\n top: var(--spacing);\n }\n\n .data-\\[side\\=bottom\\]\\:bottom-0[data-side=\"bottom\"] {\n bottom: 0;\n }\n\n .data-\\[side\\=bottom\\]\\:h-auto[data-side=\"bottom\"] {\n height: auto;\n }\n\n .data-\\[side\\=bottom\\]\\:border-t[data-side=\"bottom\"] {\n border-top-style: var(--tw-border-style);\n border-top-width: 1px;\n }\n\n .data-\\[side\\=bottom\\]\\:slide-in-from-top-2[data-side=\"bottom\"] {\n --tw-enter-translate-y: calc(2*var(--spacing)*-1);\n }\n\n .data-\\[side\\=bottom\\]\\:before\\:top-\\[-10px\\][data-side=\"bottom\"]:before {\n content: var(--tw-content);\n top: -10px;\n }\n\n .data-\\[side\\=bottom\\]\\:before\\:right-0[data-side=\"bottom\"]:before {\n content: var(--tw-content);\n right: 0;\n }\n\n .data-\\[side\\=bottom\\]\\:before\\:left-0[data-side=\"bottom\"]:before {\n content: var(--tw-content);\n left: 0;\n }\n\n .data-\\[side\\=bottom\\]\\:data-ending-style\\:translate-y-\\[2\\.5rem\\][data-side=\"bottom\"][data-ending-style], .data-\\[side\\=bottom\\]\\:data-starting-style\\:translate-y-\\[2\\.5rem\\][data-side=\"bottom\"][data-starting-style] {\n --tw-translate-y: 2.5rem;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .data-\\[side\\=inline-end\\]\\:top-1\\/2\\![data-side=\"inline-end\"] {\n top: 50% !important;\n }\n\n .data-\\[side\\=inline-end\\]\\:-left-1[data-side=\"inline-end\"] {\n left: calc(var(--spacing) * -1);\n }\n\n .data-\\[side\\=inline-end\\]\\:-translate-y-1\\/2[data-side=\"inline-end\"] {\n --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .data-\\[side\\=inline-end\\]\\:slide-in-from-left-2[data-side=\"inline-end\"] {\n --tw-enter-translate-x: calc(2*var(--spacing)*-1);\n }\n\n .data-\\[side\\=inline-start\\]\\:top-1\\/2\\![data-side=\"inline-start\"] {\n top: 50% !important;\n }\n\n .data-\\[side\\=inline-start\\]\\:-right-1[data-side=\"inline-start\"] {\n right: calc(var(--spacing) * -1);\n }\n\n .data-\\[side\\=inline-start\\]\\:-translate-y-1\\/2[data-side=\"inline-start\"] {\n --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .data-\\[side\\=inline-start\\]\\:slide-in-from-right-2[data-side=\"inline-start\"] {\n --tw-enter-translate-x: calc(2*var(--spacing));\n }\n\n .data-\\[side\\=left\\]\\:inset-y-0[data-side=\"left\"] {\n inset-block: 0;\n }\n\n .data-\\[side\\=left\\]\\:top-1\\/2\\![data-side=\"left\"] {\n top: 50% !important;\n }\n\n .data-\\[side\\=left\\]\\:-right-1[data-side=\"left\"] {\n right: calc(var(--spacing) * -1);\n }\n\n .data-\\[side\\=left\\]\\:left-0[data-side=\"left\"] {\n left: 0;\n }\n\n .data-\\[side\\=left\\]\\:h-full[data-side=\"left\"] {\n height: 100%;\n }\n\n .data-\\[side\\=left\\]\\:w-3\\/4[data-side=\"left\"] {\n width: 75%;\n }\n\n .data-\\[side\\=left\\]\\:-translate-y-1\\/2[data-side=\"left\"] {\n --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .data-\\[side\\=left\\]\\:border-r[data-side=\"left\"] {\n border-right-style: var(--tw-border-style);\n border-right-width: 1px;\n }\n\n .data-\\[side\\=left\\]\\:slide-in-from-right-2[data-side=\"left\"] {\n --tw-enter-translate-x: calc(2*var(--spacing));\n }\n\n .data-\\[side\\=left\\]\\:group-data-\\[collapsible\\=offcanvas\\]\\:left-\\[calc\\(var\\(--sidebar-width\\)\\*-1\\)\\][data-side=\"left\"]:is(:where(.group)[data-collapsible=\"offcanvas\"] *) {\n left: calc(var(--sidebar-width) * -1);\n }\n\n .data-\\[side\\=left\\]\\:data-ending-style\\:translate-x-\\[-2\\.5rem\\][data-side=\"left\"][data-ending-style], .data-\\[side\\=left\\]\\:data-starting-style\\:translate-x-\\[-2\\.5rem\\][data-side=\"left\"][data-starting-style] {\n --tw-translate-x: -2.5rem;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .data-\\[side\\=right\\]\\:inset-y-0[data-side=\"right\"] {\n inset-block: 0;\n }\n\n .data-\\[side\\=right\\]\\:top-1\\/2\\![data-side=\"right\"] {\n top: 50% !important;\n }\n\n .data-\\[side\\=right\\]\\:right-0[data-side=\"right\"] {\n right: 0;\n }\n\n .data-\\[side\\=right\\]\\:-left-1[data-side=\"right\"] {\n left: calc(var(--spacing) * -1);\n }\n\n .data-\\[side\\=right\\]\\:h-full[data-side=\"right\"] {\n height: 100%;\n }\n\n .data-\\[side\\=right\\]\\:w-3\\/4[data-side=\"right\"] {\n width: 75%;\n }\n\n .data-\\[side\\=right\\]\\:-translate-y-1\\/2[data-side=\"right\"] {\n --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .data-\\[side\\=right\\]\\:border-l[data-side=\"right\"] {\n border-left-style: var(--tw-border-style);\n border-left-width: 1px;\n }\n\n .data-\\[side\\=right\\]\\:slide-in-from-left-2[data-side=\"right\"] {\n --tw-enter-translate-x: calc(2*var(--spacing)*-1);\n }\n\n .data-\\[side\\=right\\]\\:group-data-\\[collapsible\\=offcanvas\\]\\:right-\\[calc\\(var\\(--sidebar-width\\)\\*-1\\)\\][data-side=\"right\"]:is(:where(.group)[data-collapsible=\"offcanvas\"] *) {\n right: calc(var(--sidebar-width) * -1);\n }\n\n .data-\\[side\\=right\\]\\:data-ending-style\\:translate-x-\\[2\\.5rem\\][data-side=\"right\"][data-ending-style], .data-\\[side\\=right\\]\\:data-starting-style\\:translate-x-\\[2\\.5rem\\][data-side=\"right\"][data-starting-style] {\n --tw-translate-x: 2.5rem;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .data-\\[side\\=top\\]\\:inset-x-0[data-side=\"top\"] {\n inset-inline: 0;\n }\n\n .data-\\[side\\=top\\]\\:top-0[data-side=\"top\"] {\n top: 0;\n }\n\n .data-\\[side\\=top\\]\\:-bottom-2\\.5[data-side=\"top\"] {\n bottom: calc(var(--spacing) * -2.5);\n }\n\n .data-\\[side\\=top\\]\\:h-auto[data-side=\"top\"] {\n height: auto;\n }\n\n .data-\\[side\\=top\\]\\:border-b[data-side=\"top\"] {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 1px;\n }\n\n .data-\\[side\\=top\\]\\:slide-in-from-bottom-2[data-side=\"top\"] {\n --tw-enter-translate-y: calc(2*var(--spacing));\n }\n\n .data-\\[side\\=top\\]\\:data-ending-style\\:translate-y-\\[-2\\.5rem\\][data-side=\"top\"][data-ending-style], .data-\\[side\\=top\\]\\:data-starting-style\\:translate-y-\\[-2\\.5rem\\][data-side=\"top\"][data-starting-style] {\n --tw-translate-y: -2.5rem;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .data-\\[size\\=default\\]\\:h-4\\.5[data-size=\"default\"] {\n height: calc(var(--spacing) * 4.5);\n }\n\n .data-\\[size\\=default\\]\\:w-8[data-size=\"default\"] {\n width: calc(var(--spacing) * 8);\n }\n\n .data-\\[size\\=default\\]\\:max-w-xs[data-size=\"default\"] {\n max-width: var(--container-xs);\n }\n\n .data-\\[size\\=lg\\]\\:size-10[data-size=\"lg\"] {\n width: calc(var(--spacing) * 10);\n height: calc(var(--spacing) * 10);\n }\n\n .data-\\[size\\=md\\]\\:text-sm[data-size=\"md\"] {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n\n .data-\\[size\\=sm\\]\\:size-6[data-size=\"sm\"] {\n width: calc(var(--spacing) * 6);\n height: calc(var(--spacing) * 6);\n }\n\n .data-\\[size\\=sm\\]\\:h-3\\.5[data-size=\"sm\"] {\n height: calc(var(--spacing) * 3.5);\n }\n\n .data-\\[size\\=sm\\]\\:h-7[data-size=\"sm\"] {\n height: calc(var(--spacing) * 7);\n }\n\n .data-\\[size\\=sm\\]\\:w-6[data-size=\"sm\"] {\n width: calc(var(--spacing) * 6);\n }\n\n .data-\\[size\\=sm\\]\\:max-w-xs[data-size=\"sm\"] {\n max-width: var(--container-xs);\n }\n\n .data-\\[size\\=sm\\]\\:gap-3[data-size=\"sm\"] {\n gap: calc(var(--spacing) * 3);\n }\n\n .data-\\[size\\=sm\\]\\:rounded-\\[min\\(var\\(--radius-md\\)\\,10px\\)\\][data-size=\"sm\"] {\n border-radius: min(var(--radius-md), 10px);\n }\n\n .data-\\[size\\=sm\\]\\:py-0\\.5[data-size=\"sm\"] {\n padding-block: calc(var(--spacing) * .5);\n }\n\n .data-\\[size\\=sm\\]\\:py-3[data-size=\"sm\"] {\n padding-block: calc(var(--spacing) * 3);\n }\n\n .data-\\[size\\=sm\\]\\:text-xs[data-size=\"sm\"] {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n }\n\n .data-\\[size\\=sm\\]\\:has-data-\\[slot\\=card-footer\\]\\:pb-0[data-size=\"sm\"]:has([data-slot=\"card-footer\"]) {\n padding-bottom: 0;\n }\n\n :is(.\\*\\:data-\\[slot\\=alert-description\\]\\:text-destructive > *)[data-slot=\"alert-description\"] {\n color: var(--destructive);\n }\n\n :is(.\\*\\:data-\\[slot\\=alert-description\\]\\:text-info > *)[data-slot=\"alert-description\"] {\n color: var(--info);\n }\n\n :is(.\\*\\:data-\\[slot\\=alert-description\\]\\:text-success > *)[data-slot=\"alert-description\"] {\n color: var(--success);\n }\n\n :is(.\\*\\:data-\\[slot\\=alert-description\\]\\:text-warning > *)[data-slot=\"alert-description\"] {\n color: var(--warning);\n }\n\n :is(.\\*\\:data-\\[slot\\=attachment\\]\\:flex-none > *)[data-slot=\"attachment\"] {\n flex: none;\n }\n\n :is(.\\*\\:data-\\[slot\\=attachment\\]\\:snap-start > *)[data-slot=\"attachment\"] {\n scroll-snap-align: start;\n }\n\n :is(.\\*\\:data-\\[slot\\=avatar\\]\\:ring-2 > *)[data-slot=\"avatar\"] {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n :is(.\\*\\:data-\\[slot\\=avatar\\]\\:ring-background > *)[data-slot=\"avatar\"] {\n --tw-ring-color: var(--background);\n }\n\n :is(.\\*\\:data-\\[slot\\=bubble-content\\]\\:rounded-none > *)[data-slot=\"bubble-content\"] {\n border-radius: 0;\n }\n\n :is(.\\*\\:data-\\[slot\\=bubble-content\\]\\:border-border > *)[data-slot=\"bubble-content\"] {\n border-color: var(--border);\n }\n\n :is(.\\*\\:data-\\[slot\\=bubble-content\\]\\:bg-\\[oklch\\(from_var\\(--primary\\)_0\\.93_calc\\(c\\*0\\.4\\)_h\\)\\] > *)[data-slot=\"bubble-content\"] {\n background-color: oklch(from var(--primary) .93 calc(c * .4) h);\n }\n\n :is(.\\*\\:data-\\[slot\\=bubble-content\\]\\:bg-background > *)[data-slot=\"bubble-content\"] {\n background-color: var(--background);\n }\n\n :is(.\\*\\:data-\\[slot\\=bubble-content\\]\\:bg-destructive\\/10 > *)[data-slot=\"bubble-content\"] {\n background-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n :is(.\\*\\:data-\\[slot\\=bubble-content\\]\\:bg-destructive\\/10 > *)[data-slot=\"bubble-content\"] {\n background-color: color-mix(in oklab, var(--destructive) 10%, transparent);\n }\n }\n\n :is(.\\*\\:data-\\[slot\\=bubble-content\\]\\:bg-muted > *)[data-slot=\"bubble-content\"] {\n background-color: var(--muted);\n }\n\n :is(.\\*\\:data-\\[slot\\=bubble-content\\]\\:bg-primary > *)[data-slot=\"bubble-content\"] {\n background-color: var(--primary);\n }\n\n :is(.\\*\\:data-\\[slot\\=bubble-content\\]\\:bg-secondary > *)[data-slot=\"bubble-content\"] {\n background-color: var(--secondary);\n }\n\n :is(.\\*\\:data-\\[slot\\=bubble-content\\]\\:bg-transparent > *)[data-slot=\"bubble-content\"] {\n background-color: #0000;\n }\n\n :is(.\\*\\:data-\\[slot\\=bubble-content\\]\\:p-0 > *)[data-slot=\"bubble-content\"] {\n padding: 0;\n }\n\n :is(.\\*\\:data-\\[slot\\=bubble-content\\]\\:text-destructive > *)[data-slot=\"bubble-content\"] {\n color: var(--destructive);\n }\n\n :is(.\\*\\:data-\\[slot\\=bubble-content\\]\\:text-foreground > *)[data-slot=\"bubble-content\"] {\n color: var(--foreground);\n }\n\n :is(.\\*\\:data-\\[slot\\=bubble-content\\]\\:text-primary-foreground > *)[data-slot=\"bubble-content\"] {\n color: var(--primary-foreground);\n }\n\n :is(.\\*\\:data-\\[slot\\=bubble-content\\]\\:text-secondary-foreground > *)[data-slot=\"bubble-content\"] {\n color: var(--secondary-foreground);\n }\n\n :is(.\\*\\:data-\\[slot\\=input-group-addon\\]\\:pl-2\\! > *)[data-slot=\"input-group-addon\"] {\n padding-left: calc(var(--spacing) * 2) !important;\n }\n\n :is(.\\*\\*\\:data-\\[slot\\=kbd\\]\\:relative *)[data-slot=\"kbd\"] {\n position: relative;\n }\n\n :is(.\\*\\*\\:data-\\[slot\\=kbd\\]\\:isolate *)[data-slot=\"kbd\"] {\n isolation: isolate;\n }\n\n :is(.\\*\\*\\:data-\\[slot\\=kbd\\]\\:z-50 *)[data-slot=\"kbd\"] {\n z-index: 50;\n }\n\n :is(.\\*\\*\\:data-\\[slot\\=kbd\\]\\:rounded-sm *)[data-slot=\"kbd\"] {\n border-radius: calc(var(--radius) * .6);\n }\n\n :is(.\\*\\*\\:data-\\[slot\\=navigation-menu-link\\]\\:focus\\:ring-0 *)[data-slot=\"navigation-menu-link\"]:focus {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n :is(.\\*\\*\\:data-\\[slot\\=navigation-menu-link\\]\\:focus\\:outline-none *)[data-slot=\"navigation-menu-link\"]:focus {\n --tw-outline-style: none;\n outline-style: none;\n }\n\n :is(.group-data-\\[orientation\\=vertical\\]\\/attachment\\:\\*\\:data-\\[slot\\=spinner\\]\\:size-6\\!:is(:where(.group\\/attachment)[data-orientation=\"vertical\"] *) > *)[data-slot=\"spinner\"] {\n width: calc(var(--spacing) * 6) !important;\n height: calc(var(--spacing) * 6) !important;\n }\n\n .group-data-horizontal\\/toggle-group\\:data-\\[spacing\\=0\\]\\:first\\:rounded-l-lg:is(:where(.group\\/toggle-group):where([data-orientation=\"horizontal\"]) *)[data-spacing=\"0\"]:first-child {\n border-top-left-radius: var(--radius);\n border-bottom-left-radius: var(--radius);\n }\n\n .group-data-vertical\\/toggle-group\\:data-\\[spacing\\=0\\]\\:first\\:rounded-t-lg:is(:where(.group\\/toggle-group):where([data-orientation=\"vertical\"]) *)[data-spacing=\"0\"]:first-child {\n border-top-left-radius: var(--radius);\n border-top-right-radius: var(--radius);\n }\n\n .group-data-horizontal\\/toggle-group\\:data-\\[spacing\\=0\\]\\:last\\:rounded-r-lg:is(:where(.group\\/toggle-group):where([data-orientation=\"horizontal\"]) *)[data-spacing=\"0\"]:last-child {\n border-top-right-radius: var(--radius);\n border-bottom-right-radius: var(--radius);\n }\n\n .group-data-vertical\\/toggle-group\\:data-\\[spacing\\=0\\]\\:last\\:rounded-b-lg:is(:where(.group\\/toggle-group):where([data-orientation=\"vertical\"]) *)[data-spacing=\"0\"]:last-child {\n border-bottom-right-radius: var(--radius);\n border-bottom-left-radius: var(--radius);\n }\n\n .data-\\[state\\=delayed-open\\]\\:animate-in[data-state=\"delayed-open\"] {\n animation: enter var(--tw-animation-duration, var(--tw-duration, .15s))var(--tw-ease, ease)var(--tw-animation-delay, 0s)var(--tw-animation-iteration-count, 1)var(--tw-animation-direction, normal)var(--tw-animation-fill-mode, none);\n }\n\n .data-\\[state\\=delayed-open\\]\\:fade-in-0[data-state=\"delayed-open\"] {\n --tw-enter-opacity: 0;\n }\n\n .data-\\[state\\=delayed-open\\]\\:zoom-in-95[data-state=\"delayed-open\"] {\n --tw-enter-scale: .95;\n }\n\n .data-\\[state\\=error\\]\\:border-destructive\\/30[data-state=\"error\"] {\n border-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .data-\\[state\\=error\\]\\:border-destructive\\/30[data-state=\"error\"] {\n border-color: color-mix(in oklab, var(--destructive) 30%, transparent);\n }\n }\n\n .data-\\[state\\=hidden\\]\\:animate-out[data-state=\"hidden\"] {\n animation: exit var(--tw-animation-duration, var(--tw-duration, .15s))var(--tw-ease, ease)var(--tw-animation-delay, 0s)var(--tw-animation-iteration-count, 1)var(--tw-animation-direction, normal)var(--tw-animation-fill-mode, none);\n }\n\n .data-\\[state\\=hidden\\]\\:fade-out[data-state=\"hidden\"] {\n --tw-exit-opacity: 0;\n }\n\n .data-\\[state\\=idle\\]\\:border-dashed[data-state=\"idle\"] {\n --tw-border-style: dashed;\n border-style: dashed;\n }\n\n .data-\\[state\\=selected\\]\\:bg-muted[data-state=\"selected\"] {\n background-color: var(--muted);\n }\n\n .data-\\[state\\=visible\\]\\:animate-in[data-state=\"visible\"] {\n animation: enter var(--tw-animation-duration, var(--tw-duration, .15s))var(--tw-ease, ease)var(--tw-animation-delay, 0s)var(--tw-animation-iteration-count, 1)var(--tw-animation-direction, normal)var(--tw-animation-fill-mode, none);\n }\n\n .data-\\[state\\=visible\\]\\:fade-in[data-state=\"visible\"] {\n --tw-enter-opacity: 0;\n }\n\n .data-ending-style\\:data-\\[swipe-direction\\=down\\]\\:\\[transform\\:translateY\\(calc\\(var\\(--toast-swipe-movement-y\\)\\+150\\%\\)\\)\\][data-ending-style][data-swipe-direction=\"down\"], .data-expanded\\:data-ending-style\\:data-\\[swipe-direction\\=down\\]\\:\\[transform\\:translateY\\(calc\\(var\\(--toast-swipe-movement-y\\)\\+150\\%\\)\\)\\][data-expanded][data-ending-style][data-swipe-direction=\"down\"] {\n transform: translateY(calc(var(--toast-swipe-movement-y) + 150%));\n }\n\n .data-ending-style\\:data-\\[swipe-direction\\=left\\]\\:\\[transform\\:translateX\\(calc\\(var\\(--toast-swipe-movement-x\\)-150\\%\\)\\)_translateY\\(var\\(--offset-y\\)\\)\\][data-ending-style][data-swipe-direction=\"left\"], .data-expanded\\:data-ending-style\\:data-\\[swipe-direction\\=left\\]\\:\\[transform\\:translateX\\(calc\\(var\\(--toast-swipe-movement-x\\)-150\\%\\)\\)_translateY\\(var\\(--offset-y\\)\\)\\][data-expanded][data-ending-style][data-swipe-direction=\"left\"] {\n transform: translateX(calc(var(--toast-swipe-movement-x) - 150%)) translateY(var(--offset-y));\n }\n\n .data-ending-style\\:data-\\[swipe-direction\\=right\\]\\:\\[transform\\:translateX\\(calc\\(var\\(--toast-swipe-movement-x\\)\\+150\\%\\)\\)_translateY\\(var\\(--offset-y\\)\\)\\][data-ending-style][data-swipe-direction=\"right\"], .data-expanded\\:data-ending-style\\:data-\\[swipe-direction\\=right\\]\\:\\[transform\\:translateX\\(calc\\(var\\(--toast-swipe-movement-x\\)\\+150\\%\\)\\)_translateY\\(var\\(--offset-y\\)\\)\\][data-expanded][data-ending-style][data-swipe-direction=\"right\"] {\n transform: translateX(calc(var(--toast-swipe-movement-x) + 150%)) translateY(var(--offset-y));\n }\n\n .data-ending-style\\:data-\\[swipe-direction\\=up\\]\\:\\[transform\\:translateY\\(calc\\(var\\(--toast-swipe-movement-y\\)-150\\%\\)\\)\\][data-ending-style][data-swipe-direction=\"up\"], .data-expanded\\:data-ending-style\\:data-\\[swipe-direction\\=up\\]\\:\\[transform\\:translateY\\(calc\\(var\\(--toast-swipe-movement-y\\)-150\\%\\)\\)\\][data-expanded][data-ending-style][data-swipe-direction=\"up\"] {\n transform: translateY(calc(var(--toast-swipe-movement-y) - 150%));\n }\n\n .data-\\[variant\\=destructive\\]\\:text-destructive[data-variant=\"destructive\"] {\n color: var(--destructive);\n }\n\n .data-\\[variant\\=destructive\\]\\:focus\\:bg-destructive\\/10[data-variant=\"destructive\"]:focus {\n background-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .data-\\[variant\\=destructive\\]\\:focus\\:bg-destructive\\/10[data-variant=\"destructive\"]:focus {\n background-color: color-mix(in oklab, var(--destructive) 10%, transparent);\n }\n }\n\n .data-\\[variant\\=destructive\\]\\:focus\\:text-destructive[data-variant=\"destructive\"]:focus {\n color: var(--destructive);\n }\n\n .data-\\[variant\\=ghost\\]\\:max-w-full[data-variant=\"ghost\"] {\n max-width: 100%;\n }\n\n .data-\\[variant\\=line\\]\\:rounded-none[data-variant=\"line\"] {\n border-radius: 0;\n }\n\n .group-data-horizontal\\/toggle-group\\:data-\\[spacing\\=0\\]\\:data-\\[variant\\=outline\\]\\:border-l-0:is(:where(.group\\/toggle-group):where([data-orientation=\"horizontal\"]) *)[data-spacing=\"0\"][data-variant=\"outline\"] {\n border-left-style: var(--tw-border-style);\n border-left-width: 0;\n }\n\n .group-data-vertical\\/toggle-group\\:data-\\[spacing\\=0\\]\\:data-\\[variant\\=outline\\]\\:border-t-0:is(:where(.group\\/toggle-group):where([data-orientation=\"vertical\"]) *)[data-spacing=\"0\"][data-variant=\"outline\"] {\n border-top-style: var(--tw-border-style);\n border-top-width: 0;\n }\n\n .group-data-horizontal\\/toggle-group\\:data-\\[spacing\\=0\\]\\:data-\\[variant\\=outline\\]\\:first\\:border-l:is(:where(.group\\/toggle-group):where([data-orientation=\"horizontal\"]) *)[data-spacing=\"0\"][data-variant=\"outline\"]:first-child {\n border-left-style: var(--tw-border-style);\n border-left-width: 1px;\n }\n\n .group-data-vertical\\/toggle-group\\:data-\\[spacing\\=0\\]\\:data-\\[variant\\=outline\\]\\:first\\:border-t:is(:where(.group\\/toggle-group):where([data-orientation=\"vertical\"]) *)[data-spacing=\"0\"][data-variant=\"outline\"]:first-child {\n border-top-style: var(--tw-border-style);\n border-top-width: 1px;\n }\n\n @supports ((-webkit-backdrop-filter: var(--tw)) or (backdrop-filter: var(--tw))) {\n .supports-backdrop-filter\\:backdrop-blur-xs {\n --tw-backdrop-blur: blur(var(--blur-xs));\n -webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );\n backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );\n }\n }\n\n @media (prefers-reduced-motion: no-preference) {\n .motion-safe\\:transition-opacity {\n transition-property: opacity;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .motion-safe\\:duration-150 {\n --tw-duration: .15s;\n transition-duration: .15s;\n }\n }\n\n @media (prefers-reduced-motion: reduce) {\n .motion-reduce\\:transform-none {\n transform: none;\n }\n\n .motion-reduce\\:animate-none {\n animation: none;\n }\n\n .motion-reduce\\:transition-none {\n transition-property: none;\n }\n }\n\n @media (min-width: 40rem) {\n .sm\\:right-4 {\n right: calc(var(--spacing) * 4);\n }\n\n .sm\\:left-auto {\n left: auto;\n }\n\n .sm\\:mx-0 {\n margin-inline: 0;\n }\n\n .sm\\:flex {\n display: flex;\n }\n\n .sm\\:min-h-0 {\n min-height: 0;\n }\n\n .sm\\:min-h-8 {\n min-height: calc(var(--spacing) * 8);\n }\n\n .sm\\:w-full {\n width: 100%;\n }\n\n .sm\\:max-w-sm {\n max-width: var(--container-sm);\n }\n\n .sm\\:flex-row {\n flex-direction: row;\n }\n\n .sm\\:justify-end {\n justify-content: flex-end;\n }\n\n .sm\\:group-data-\\[size\\=default\\]\\/alert-dialog-content\\:row-span-2:is(:where(.group\\/alert-dialog-content)[data-size=\"default\"] *) {\n grid-row: span 2 / span 2;\n }\n\n .sm\\:group-data-\\[size\\=default\\]\\/alert-dialog-content\\:place-items-start:is(:where(.group\\/alert-dialog-content)[data-size=\"default\"] *) {\n place-items: start;\n }\n\n .sm\\:group-data-\\[size\\=default\\]\\/alert-dialog-content\\:text-left:is(:where(.group\\/alert-dialog-content)[data-size=\"default\"] *) {\n text-align: left;\n }\n\n .sm\\:group-data-\\[size\\=default\\]\\/alert-dialog-content\\:group-has-data-\\[slot\\=alert-dialog-media\\]\\/alert-dialog-content\\:col-start-2:is(:where(.group\\/alert-dialog-content)[data-size=\"default\"] *):is(:where(.group\\/alert-dialog-content):has([data-slot=\"alert-dialog-media\"]) *) {\n grid-column-start: 2;\n }\n\n .sm\\:group-data-\\[size\\=default\\]\\/alert-dialog-content\\:has-data-\\[slot\\=alert-dialog-media\\]\\:grid-rows-\\[auto_1fr\\]:is(:where(.group\\/alert-dialog-content)[data-size=\"default\"] *):has([data-slot=\"alert-dialog-media\"]) {\n grid-template-rows: auto 1fr;\n }\n\n .data-\\[side\\=left\\]\\:sm\\:max-w-sm[data-side=\"left\"], .data-\\[side\\=right\\]\\:sm\\:max-w-sm[data-side=\"right\"], .data-\\[size\\=default\\]\\:sm\\:max-w-sm[data-size=\"default\"] {\n max-width: var(--container-sm);\n }\n }\n\n @media (min-width: 48rem) {\n .md\\:block {\n display: block;\n }\n\n .md\\:flex {\n display: flex;\n }\n\n .md\\:flex-row {\n flex-direction: row;\n }\n\n .md\\:text-sm {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n\n .md\\:text-pretty {\n text-wrap: pretty;\n }\n\n .md\\:opacity-0 {\n opacity: 0;\n }\n\n .md\\:peer-data-\\[variant\\=inset\\]\\:m-2:is(:where(.peer)[data-variant=\"inset\"] ~ *) {\n margin: calc(var(--spacing) * 2);\n }\n\n .md\\:peer-data-\\[variant\\=inset\\]\\:ml-0:is(:where(.peer)[data-variant=\"inset\"] ~ *) {\n margin-left: 0;\n }\n\n .md\\:peer-data-\\[variant\\=inset\\]\\:rounded-xl:is(:where(.peer)[data-variant=\"inset\"] ~ *) {\n border-radius: calc(var(--radius) * 1.4);\n }\n\n .md\\:peer-data-\\[variant\\=inset\\]\\:shadow-sm:is(:where(.peer)[data-variant=\"inset\"] ~ *) {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .md\\:peer-data-\\[variant\\=inset\\]\\:peer-data-\\[state\\=collapsed\\]\\:ml-2:is(:where(.peer)[data-variant=\"inset\"] ~ *):is(:where(.peer)[data-state=\"collapsed\"] ~ *) {\n margin-left: calc(var(--spacing) * 2);\n }\n\n .md\\:after\\:hidden:after {\n content: var(--tw-content);\n display: none;\n }\n }\n\n .ltr\\:-translate-x-1\\/2:where(:dir(ltr), [dir=\"ltr\"], [dir=\"ltr\"] *), .rtl\\:-translate-x-1\\/2:where(:dir(rtl), [dir=\"rtl\"], [dir=\"rtl\"] *) {\n --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .rtl\\:translate-x-1\\/2:where(:dir(rtl), [dir=\"rtl\"], [dir=\"rtl\"] *) {\n --tw-translate-x: calc(1 / 2 * 100%);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .dark\\:border-input:is(.dark *) {\n border-color: var(--input);\n }\n\n .dark\\:bg-destructive\\/15:is(.dark *) {\n background-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .dark\\:bg-destructive\\/15:is(.dark *) {\n background-color: color-mix(in oklab, var(--destructive) 15%, transparent);\n }\n }\n\n .dark\\:bg-destructive\\/20:is(.dark *) {\n background-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .dark\\:bg-destructive\\/20:is(.dark *) {\n background-color: color-mix(in oklab, var(--destructive) 20%, transparent);\n }\n }\n\n .dark\\:bg-info-ring\\/30:is(.dark *) {\n background-color: var(--info-ring);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .dark\\:bg-info-ring\\/30:is(.dark *) {\n background-color: color-mix(in oklab, var(--info-ring) 30%, transparent);\n }\n }\n\n .dark\\:bg-input\\/20:is(.dark *) {\n background-color: var(--input);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .dark\\:bg-input\\/20:is(.dark *) {\n background-color: color-mix(in oklab, var(--input) 20%, transparent);\n }\n }\n\n .dark\\:bg-input\\/30:is(.dark *) {\n background-color: var(--input);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .dark\\:bg-input\\/30:is(.dark *) {\n background-color: color-mix(in oklab, var(--input) 30%, transparent);\n }\n }\n\n .dark\\:bg-success-ring\\/30:is(.dark *) {\n background-color: var(--success-ring);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .dark\\:bg-success-ring\\/30:is(.dark *) {\n background-color: color-mix(in oklab, var(--success-ring) 30%, transparent);\n }\n }\n\n .dark\\:bg-transparent:is(.dark *) {\n background-color: #0000;\n }\n\n .dark\\:bg-warning-ring\\/30:is(.dark *) {\n background-color: var(--warning-ring);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .dark\\:bg-warning-ring\\/30:is(.dark *) {\n background-color: color-mix(in oklab, var(--warning-ring) 30%, transparent);\n }\n }\n\n .dark\\:text-background:is(.dark *) {\n color: var(--background);\n }\n\n .dark\\:text-muted-foreground:is(.dark *) {\n color: var(--muted-foreground);\n }\n\n .dark\\:group-data-checked\\/questionnaire-choice\\:bg-primary:is(.dark *):is(:is(:where(.group\\/questionnaire-choice):where([data-state=\"checked\"]), :where(.group\\/questionnaire-choice):where([data-checked]:not([data-checked=\"false\"]))) *) {\n background-color: var(--primary);\n }\n\n .dark\\:after\\:mix-blend-lighten:is(.dark *):after {\n content: var(--tw-content);\n mix-blend-mode: lighten;\n }\n\n @media (hover: hover) {\n .dark\\:hover\\:bg-destructive\\/20:is(.dark *):hover {\n background-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .dark\\:hover\\:bg-destructive\\/20:is(.dark *):hover {\n background-color: color-mix(in oklab, var(--destructive) 20%, transparent);\n }\n }\n\n .dark\\:hover\\:bg-input\\/50:is(.dark *):hover {\n background-color: var(--input);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .dark\\:hover\\:bg-input\\/50:is(.dark *):hover {\n background-color: color-mix(in oklab, var(--input) 50%, transparent);\n }\n }\n\n .dark\\:hover\\:bg-muted\\/50:is(.dark *):hover {\n background-color: var(--muted);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .dark\\:hover\\:bg-muted\\/50:is(.dark *):hover {\n background-color: color-mix(in oklab, var(--muted) 50%, transparent);\n }\n }\n\n .dark\\:hover\\:text-foreground:is(.dark *):hover {\n color: var(--foreground);\n }\n }\n\n .dark\\:focus-visible\\:ring-destructive\\/40:is(.dark *):focus-visible {\n --tw-ring-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .dark\\:focus-visible\\:ring-destructive\\/40:is(.dark *):focus-visible {\n --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);\n }\n }\n\n .dark\\:disabled\\:bg-input\\/80:is(.dark *):disabled {\n background-color: var(--input);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .dark\\:disabled\\:bg-input\\/80:is(.dark *):disabled {\n background-color: color-mix(in oklab, var(--input) 80%, transparent);\n }\n }\n\n .dark\\:disabled\\:bg-transparent:is(.dark *):disabled {\n background-color: #0000;\n }\n\n :where([data-slot=\"tooltip-content\"]) .dark\\:in-data-\\[slot\\=tooltip-content\\]\\:bg-background\\/10:is(.dark *) {\n background-color: var(--background);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n :where([data-slot=\"tooltip-content\"]) .dark\\:in-data-\\[slot\\=tooltip-content\\]\\:bg-background\\/10:is(.dark *) {\n background-color: color-mix(in oklab, var(--background) 10%, transparent);\n }\n }\n\n .dark\\:has-disabled\\:bg-input\\/80:is(.dark *):has(:disabled) {\n background-color: var(--input);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .dark\\:has-disabled\\:bg-input\\/80:is(.dark *):has(:disabled) {\n background-color: color-mix(in oklab, var(--input) 80%, transparent);\n }\n }\n\n .dark\\:has-aria-invalid\\:ring-destructive\\/40:is(.dark *):has([aria-invalid=\"true\"]) {\n --tw-ring-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .dark\\:has-aria-invalid\\:ring-destructive\\/40:is(.dark *):has([aria-invalid=\"true\"]) {\n --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);\n }\n }\n\n .dark\\:has-\\[\\[data-slot\\]\\[aria-invalid\\=true\\]\\]\\:ring-destructive\\/40:is(.dark *):has([data-slot][aria-invalid=\"true\"]) {\n --tw-ring-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .dark\\:has-\\[\\[data-slot\\]\\[aria-invalid\\=true\\]\\]\\:ring-destructive\\/40:is(.dark *):has([data-slot][aria-invalid=\"true\"]) {\n --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);\n }\n }\n\n .dark\\:aria-invalid\\:border-destructive\\/50:is(.dark *)[aria-invalid=\"true\"] {\n border-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .dark\\:aria-invalid\\:border-destructive\\/50:is(.dark *)[aria-invalid=\"true\"] {\n border-color: color-mix(in oklab, var(--destructive) 50%, transparent);\n }\n }\n\n .dark\\:aria-invalid\\:ring-destructive\\/40:is(.dark *)[aria-invalid=\"true\"] {\n --tw-ring-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .dark\\:aria-invalid\\:ring-destructive\\/40:is(.dark *)[aria-invalid=\"true\"] {\n --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);\n }\n }\n\n .dark\\:data-\\[active\\=true\\]\\:aria-invalid\\:ring-destructive\\/40:is(.dark *)[data-active=\"true\"][aria-invalid=\"true\"] {\n --tw-ring-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .dark\\:data-\\[active\\=true\\]\\:aria-invalid\\:ring-destructive\\/40:is(.dark *)[data-active=\"true\"][aria-invalid=\"true\"] {\n --tw-ring-color: color-mix(in oklab, var(--destructive) 40%, transparent);\n }\n }\n\n :is(.dark\\:\\*\\:data-\\[slot\\=bubble-content\\]\\:bg-\\[oklch\\(from_var\\(--primary\\)_0\\.3_calc\\(c\\*0\\.4\\)_h\\)\\]:is(.dark *) > *)[data-slot=\"bubble-content\"] {\n background-color: oklch(from var(--primary) .3 calc(c * .4) h);\n }\n\n :is(.dark\\:\\*\\:data-\\[slot\\=bubble-content\\]\\:bg-destructive\\/20:is(.dark *) > *)[data-slot=\"bubble-content\"] {\n background-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n :is(.dark\\:\\*\\:data-\\[slot\\=bubble-content\\]\\:bg-destructive\\/20:is(.dark *) > *)[data-slot=\"bubble-content\"] {\n background-color: color-mix(in oklab, var(--destructive) 20%, transparent);\n }\n }\n\n .dark\\:data-\\[variant\\=destructive\\]\\:focus\\:bg-destructive\\/20:is(.dark *)[data-variant=\"destructive\"]:focus {\n background-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .dark\\:data-\\[variant\\=destructive\\]\\:focus\\:bg-destructive\\/20:is(.dark *)[data-variant=\"destructive\"]:focus {\n background-color: color-mix(in oklab, var(--destructive) 20%, transparent);\n }\n }\n\n .data-open\\:scale-100:where([data-state=\"open\"]), .data-open\\:scale-100:where([data-open]:not([data-open=\"false\"])) {\n --tw-scale-x: 100%;\n --tw-scale-y: 100%;\n --tw-scale-z: 100%;\n scale: var(--tw-scale-x) var(--tw-scale-y);\n }\n\n .data-open\\:animate-in:where([data-state=\"open\"]), .data-open\\:animate-in:where([data-open]:not([data-open=\"false\"])) {\n animation: enter var(--tw-animation-duration, var(--tw-duration, .15s))var(--tw-ease, ease)var(--tw-animation-delay, 0s)var(--tw-animation-iteration-count, 1)var(--tw-animation-direction, normal)var(--tw-animation-fill-mode, none);\n }\n\n .data-open\\:bg-accent:where([data-state=\"open\"]), .data-open\\:bg-accent:where([data-open]:not([data-open=\"false\"])) {\n background-color: var(--accent);\n }\n\n .data-open\\:bg-muted\\/50:where([data-state=\"open\"]), .data-open\\:bg-muted\\/50:where([data-open]:not([data-open=\"false\"])) {\n background-color: var(--muted);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .data-open\\:bg-muted\\/50:where([data-state=\"open\"]), .data-open\\:bg-muted\\/50:where([data-open]:not([data-open=\"false\"])) {\n background-color: color-mix(in oklab, var(--muted) 50%, transparent);\n }\n }\n\n .data-open\\:text-accent-foreground:where([data-state=\"open\"]), .data-open\\:text-accent-foreground:where([data-open]:not([data-open=\"false\"])) {\n color: var(--accent-foreground);\n }\n\n .data-open\\:opacity-100:where([data-state=\"open\"]), .data-open\\:opacity-100:where([data-open]:not([data-open=\"false\"])) {\n opacity: 1;\n }\n\n .data-open\\:fade-in-0:where([data-state=\"open\"]), .data-open\\:fade-in-0:where([data-open]:not([data-open=\"false\"])) {\n --tw-enter-opacity: 0;\n }\n\n .data-open\\:zoom-in-95:where([data-state=\"open\"]), .data-open\\:zoom-in-95:where([data-open]:not([data-open=\"false\"])) {\n --tw-enter-scale: .95;\n }\n\n .data-open\\:slide-in-from-bottom:where([data-state=\"open\"]), .data-open\\:slide-in-from-bottom:where([data-open]:not([data-open=\"false\"])) {\n --tw-enter-translate-y: 100%;\n }\n\n .data-open\\:slide-in-from-left:where([data-state=\"open\"]), .data-open\\:slide-in-from-left:where([data-open]:not([data-open=\"false\"])) {\n --tw-enter-translate-x: -100%;\n }\n\n .data-open\\:slide-in-from-right:where([data-state=\"open\"]), .data-open\\:slide-in-from-right:where([data-open]:not([data-open=\"false\"])) {\n --tw-enter-translate-x: 100%;\n }\n\n .data-open\\:slide-in-from-top:where([data-state=\"open\"]), .data-open\\:slide-in-from-top:where([data-open]:not([data-open=\"false\"])) {\n --tw-enter-translate-y: -100%;\n }\n\n .group-data-\\[viewport\\=false\\]\\/navigation-menu\\:data-open\\:animate-in:is(:where(.group\\/navigation-menu)[data-viewport=\"false\"] *):where([data-state=\"open\"]), .group-data-\\[viewport\\=false\\]\\/navigation-menu\\:data-open\\:animate-in:is(:where(.group\\/navigation-menu)[data-viewport=\"false\"] *):where([data-open]:not([data-open=\"false\"])) {\n animation: enter var(--tw-animation-duration, var(--tw-duration, .15s))var(--tw-ease, ease)var(--tw-animation-delay, 0s)var(--tw-animation-iteration-count, 1)var(--tw-animation-direction, normal)var(--tw-animation-fill-mode, none);\n }\n\n .group-data-\\[viewport\\=false\\]\\/navigation-menu\\:data-open\\:fade-in-0:is(:where(.group\\/navigation-menu)[data-viewport=\"false\"] *):where([data-state=\"open\"]), .group-data-\\[viewport\\=false\\]\\/navigation-menu\\:data-open\\:fade-in-0:is(:where(.group\\/navigation-menu)[data-viewport=\"false\"] *):where([data-open]:not([data-open=\"false\"])) {\n --tw-enter-opacity: 0;\n }\n\n .group-data-\\[viewport\\=false\\]\\/navigation-menu\\:data-open\\:zoom-in-95:is(:where(.group\\/navigation-menu)[data-viewport=\"false\"] *):where([data-state=\"open\"]), .group-data-\\[viewport\\=false\\]\\/navigation-menu\\:data-open\\:zoom-in-95:is(:where(.group\\/navigation-menu)[data-viewport=\"false\"] *):where([data-open]:not([data-open=\"false\"])) {\n --tw-enter-scale: .95;\n }\n\n @media (hover: hover) {\n :is(.data-open\\:hover\\:bg-muted:where([data-state=\"open\"]), .data-open\\:hover\\:bg-muted:where([data-open]:not([data-open=\"false\"]))):hover {\n background-color: var(--muted);\n }\n\n :is(.data-open\\:hover\\:bg-sidebar-accent:where([data-state=\"open\"]), .data-open\\:hover\\:bg-sidebar-accent:where([data-open]:not([data-open=\"false\"]))):hover {\n background-color: var(--sidebar-accent);\n }\n\n :is(.data-open\\:hover\\:text-sidebar-accent-foreground:where([data-state=\"open\"]), .data-open\\:hover\\:text-sidebar-accent-foreground:where([data-open]:not([data-open=\"false\"]))):hover {\n color: var(--sidebar-accent-foreground);\n }\n }\n\n :is(.data-open\\:focus\\:bg-muted:where([data-state=\"open\"]), .data-open\\:focus\\:bg-muted:where([data-open]:not([data-open=\"false\"]))):focus {\n background-color: var(--muted);\n }\n\n .data-closed\\:scale-95:where([data-state=\"closed\"]), .data-closed\\:scale-95:where([data-closed]:not([data-closed=\"false\"])) {\n --tw-scale-x: 95%;\n --tw-scale-y: 95%;\n --tw-scale-z: 95%;\n scale: var(--tw-scale-x) var(--tw-scale-y);\n }\n\n .data-closed\\:animate-out:where([data-state=\"closed\"]), .data-closed\\:animate-out:where([data-closed]:not([data-closed=\"false\"])) {\n animation: exit var(--tw-animation-duration, var(--tw-duration, .15s))var(--tw-ease, ease)var(--tw-animation-delay, 0s)var(--tw-animation-iteration-count, 1)var(--tw-animation-direction, normal)var(--tw-animation-fill-mode, none);\n }\n\n .data-closed\\:overflow-hidden:where([data-state=\"closed\"]), .data-closed\\:overflow-hidden:where([data-closed]:not([data-closed=\"false\"])) {\n overflow: hidden;\n }\n\n .data-closed\\:opacity-0:where([data-state=\"closed\"]), .data-closed\\:opacity-0:where([data-closed]:not([data-closed=\"false\"])) {\n opacity: 0;\n }\n\n .data-closed\\:fade-out-0:where([data-state=\"closed\"]), .data-closed\\:fade-out-0:where([data-closed]:not([data-closed=\"false\"])) {\n --tw-exit-opacity: 0;\n }\n\n .data-closed\\:zoom-out-95:where([data-state=\"closed\"]), .data-closed\\:zoom-out-95:where([data-closed]:not([data-closed=\"false\"])) {\n --tw-exit-scale: .95;\n }\n\n .data-closed\\:slide-out-to-bottom:where([data-state=\"closed\"]), .data-closed\\:slide-out-to-bottom:where([data-closed]:not([data-closed=\"false\"])) {\n --tw-exit-translate-y: 100%;\n }\n\n .data-closed\\:slide-out-to-left:where([data-state=\"closed\"]), .data-closed\\:slide-out-to-left:where([data-closed]:not([data-closed=\"false\"])) {\n --tw-exit-translate-x: -100%;\n }\n\n .data-closed\\:slide-out-to-right:where([data-state=\"closed\"]), .data-closed\\:slide-out-to-right:where([data-closed]:not([data-closed=\"false\"])) {\n --tw-exit-translate-x: 100%;\n }\n\n .data-closed\\:slide-out-to-top:where([data-state=\"closed\"]), .data-closed\\:slide-out-to-top:where([data-closed]:not([data-closed=\"false\"])) {\n --tw-exit-translate-y: -100%;\n }\n\n .group-data-\\[viewport\\=false\\]\\/navigation-menu\\:data-closed\\:animate-out:is(:where(.group\\/navigation-menu)[data-viewport=\"false\"] *):where([data-state=\"closed\"]), .group-data-\\[viewport\\=false\\]\\/navigation-menu\\:data-closed\\:animate-out:is(:where(.group\\/navigation-menu)[data-viewport=\"false\"] *):where([data-closed]:not([data-closed=\"false\"])) {\n animation: exit var(--tw-animation-duration, var(--tw-duration, .15s))var(--tw-ease, ease)var(--tw-animation-delay, 0s)var(--tw-animation-iteration-count, 1)var(--tw-animation-direction, normal)var(--tw-animation-fill-mode, none);\n }\n\n .group-data-\\[viewport\\=false\\]\\/navigation-menu\\:data-closed\\:fade-out-0:is(:where(.group\\/navigation-menu)[data-viewport=\"false\"] *):where([data-state=\"closed\"]), .group-data-\\[viewport\\=false\\]\\/navigation-menu\\:data-closed\\:fade-out-0:is(:where(.group\\/navigation-menu)[data-viewport=\"false\"] *):where([data-closed]:not([data-closed=\"false\"])) {\n --tw-exit-opacity: 0;\n }\n\n .group-data-\\[viewport\\=false\\]\\/navigation-menu\\:data-closed\\:zoom-out-95:is(:where(.group\\/navigation-menu)[data-viewport=\"false\"] *):where([data-state=\"closed\"]), .group-data-\\[viewport\\=false\\]\\/navigation-menu\\:data-closed\\:zoom-out-95:is(:where(.group\\/navigation-menu)[data-viewport=\"false\"] *):where([data-closed]:not([data-closed=\"false\"])) {\n --tw-exit-scale: .95;\n }\n\n .data-checked\\:border-primary:where([data-state=\"checked\"]), .data-checked\\:border-primary:where([data-checked]:not([data-checked=\"false\"])), .data-checked\\:border-primary\\/40:where([data-state=\"checked\"]), .data-checked\\:border-primary\\/40:where([data-checked]:not([data-checked=\"false\"])) {\n border-color: var(--primary);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .data-checked\\:border-primary\\/40:where([data-state=\"checked\"]), .data-checked\\:border-primary\\/40:where([data-checked]:not([data-checked=\"false\"])) {\n border-color: color-mix(in oklab, var(--primary) 40%, transparent);\n }\n }\n\n .data-checked\\:bg-muted:where([data-state=\"checked\"]), .data-checked\\:bg-muted:where([data-checked]:not([data-checked=\"false\"])) {\n background-color: var(--muted);\n }\n\n .data-checked\\:bg-primary:where([data-state=\"checked\"]), .data-checked\\:bg-primary:where([data-checked]:not([data-checked=\"false\"])) {\n background-color: var(--primary);\n }\n\n .data-checked\\:text-primary-foreground:where([data-state=\"checked\"]), .data-checked\\:text-primary-foreground:where([data-checked]:not([data-checked=\"false\"])) {\n color: var(--primary-foreground);\n }\n\n .group-data-\\[size\\=default\\]\\/switch\\:data-checked\\:translate-x-\\[calc\\(100\\%-2px\\)\\]:is(:where(.group\\/switch)[data-size=\"default\"] *):where([data-state=\"checked\"]), .group-data-\\[size\\=default\\]\\/switch\\:data-checked\\:translate-x-\\[calc\\(100\\%-2px\\)\\]:is(:where(.group\\/switch)[data-size=\"default\"] *):where([data-checked]:not([data-checked=\"false\"])), .group-data-\\[size\\=sm\\]\\/switch\\:data-checked\\:translate-x-\\[calc\\(100\\%-2px\\)\\]:is(:where(.group\\/switch)[data-size=\"sm\"] *):where([data-state=\"checked\"]), .group-data-\\[size\\=sm\\]\\/switch\\:data-checked\\:translate-x-\\[calc\\(100\\%-2px\\)\\]:is(:where(.group\\/switch)[data-size=\"sm\"] *):where([data-checked]:not([data-checked=\"false\"])) {\n --tw-translate-x: calc(100% - 2px);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .dark\\:data-checked\\:bg-muted:is(.dark *):where([data-state=\"checked\"]), .dark\\:data-checked\\:bg-muted:is(.dark *):where([data-checked]:not([data-checked=\"false\"])) {\n background-color: var(--muted);\n }\n\n .dark\\:data-checked\\:bg-primary:is(.dark *):where([data-state=\"checked\"]), .dark\\:data-checked\\:bg-primary:is(.dark *):where([data-checked]:not([data-checked=\"false\"])) {\n background-color: var(--primary);\n }\n\n .dark\\:data-checked\\:bg-primary-foreground:is(.dark *):where([data-state=\"checked\"]), .dark\\:data-checked\\:bg-primary-foreground:is(.dark *):where([data-checked]:not([data-checked=\"false\"])) {\n background-color: var(--primary-foreground);\n }\n\n .data-unchecked\\:bg-input:where([data-state=\"unchecked\"]), .data-unchecked\\:bg-input:where([data-unchecked]:not([data-unchecked=\"false\"])) {\n background-color: var(--input);\n }\n\n .group-data-\\[size\\=default\\]\\/switch\\:data-unchecked\\:translate-x-0:is(:where(.group\\/switch)[data-size=\"default\"] *):where([data-state=\"unchecked\"]), .group-data-\\[size\\=default\\]\\/switch\\:data-unchecked\\:translate-x-0:is(:where(.group\\/switch)[data-size=\"default\"] *):where([data-unchecked]:not([data-unchecked=\"false\"])), .group-data-\\[size\\=sm\\]\\/switch\\:data-unchecked\\:translate-x-0:is(:where(.group\\/switch)[data-size=\"sm\"] *):where([data-state=\"unchecked\"]), .group-data-\\[size\\=sm\\]\\/switch\\:data-unchecked\\:translate-x-0:is(:where(.group\\/switch)[data-size=\"sm\"] *):where([data-unchecked]:not([data-unchecked=\"false\"])) {\n --tw-translate-x: 0;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .dark\\:data-unchecked\\:bg-foreground:is(.dark *):where([data-state=\"unchecked\"]), .dark\\:data-unchecked\\:bg-foreground:is(.dark *):where([data-unchecked]:not([data-unchecked=\"false\"])) {\n background-color: var(--foreground);\n }\n\n .dark\\:data-unchecked\\:bg-input\\/80:is(.dark *):where([data-state=\"unchecked\"]), .dark\\:data-unchecked\\:bg-input\\/80:is(.dark *):where([data-unchecked]:not([data-unchecked=\"false\"])) {\n background-color: var(--input);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .dark\\:data-unchecked\\:bg-input\\/80:is(.dark *):where([data-state=\"unchecked\"]), .dark\\:data-unchecked\\:bg-input\\/80:is(.dark *):where([data-unchecked]:not([data-unchecked=\"false\"])) {\n background-color: color-mix(in oklab, var(--input) 80%, transparent);\n }\n }\n\n .data-selected\\:bg-muted:where([data-selected=\"true\"]) {\n background-color: var(--muted);\n }\n\n .data-selected\\:text-foreground:where([data-selected=\"true\"]) {\n color: var(--foreground);\n }\n\n .data-disabled\\:pointer-events-none:where([data-disabled=\"true\"]), .data-disabled\\:pointer-events-none:where([data-disabled]:not([data-disabled=\"false\"])) {\n pointer-events: none;\n }\n\n .data-disabled\\:cursor-not-allowed:where([data-disabled=\"true\"]), .data-disabled\\:cursor-not-allowed:where([data-disabled]:not([data-disabled=\"false\"])) {\n cursor: not-allowed;\n }\n\n .data-disabled\\:opacity-50:where([data-disabled=\"true\"]), .data-disabled\\:opacity-50:where([data-disabled]:not([data-disabled=\"false\"])) {\n opacity: .5;\n }\n\n .data-active\\:bg-background:where([data-state=\"active\"]), .data-active\\:bg-background:where([data-active]:not([data-active=\"false\"])) {\n background-color: var(--background);\n }\n\n .data-active\\:bg-muted\\/50:where([data-state=\"active\"]), .data-active\\:bg-muted\\/50:where([data-active]:not([data-active=\"false\"])) {\n background-color: var(--muted);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .data-active\\:bg-muted\\/50:where([data-state=\"active\"]), .data-active\\:bg-muted\\/50:where([data-active]:not([data-active=\"false\"])) {\n background-color: color-mix(in oklab, var(--muted) 50%, transparent);\n }\n }\n\n .data-active\\:bg-sidebar-accent:where([data-state=\"active\"]), .data-active\\:bg-sidebar-accent:where([data-active]:not([data-active=\"false\"])) {\n background-color: var(--sidebar-accent);\n }\n\n .data-active\\:font-medium:where([data-state=\"active\"]), .data-active\\:font-medium:where([data-active]:not([data-active=\"false\"])) {\n --tw-font-weight: var(--font-weight-medium);\n font-weight: var(--font-weight-medium);\n }\n\n .data-active\\:text-foreground:where([data-state=\"active\"]), .data-active\\:text-foreground:where([data-active]:not([data-active=\"false\"])) {\n color: var(--foreground);\n }\n\n .data-active\\:text-sidebar-accent-foreground:where([data-state=\"active\"]), .data-active\\:text-sidebar-accent-foreground:where([data-active]:not([data-active=\"false\"])) {\n color: var(--sidebar-accent-foreground);\n }\n\n .group-data-\\[variant\\=default\\]\\/tabs-list\\:data-active\\:shadow-sm:is(:where(.group\\/tabs-list)[data-variant=\"default\"] *):where([data-state=\"active\"]), .group-data-\\[variant\\=default\\]\\/tabs-list\\:data-active\\:shadow-sm:is(:where(.group\\/tabs-list)[data-variant=\"default\"] *):where([data-active]:not([data-active=\"false\"])) {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .group-data-\\[variant\\=line\\]\\/tabs-list\\:data-active\\:bg-transparent:is(:where(.group\\/tabs-list)[data-variant=\"line\"] *):where([data-state=\"active\"]), .group-data-\\[variant\\=line\\]\\/tabs-list\\:data-active\\:bg-transparent:is(:where(.group\\/tabs-list)[data-variant=\"line\"] *):where([data-active]:not([data-active=\"false\"])) {\n background-color: #0000;\n }\n\n .group-data-\\[variant\\=line\\]\\/tabs-list\\:data-active\\:shadow-none:is(:where(.group\\/tabs-list)[data-variant=\"line\"] *):where([data-state=\"active\"]), .group-data-\\[variant\\=line\\]\\/tabs-list\\:data-active\\:shadow-none:is(:where(.group\\/tabs-list)[data-variant=\"line\"] *):where([data-active]:not([data-active=\"false\"])) {\n --tw-shadow: 0 0 #0000;\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n :is(.group-data-\\[variant\\=line\\]\\/tabs-list\\:data-active\\:after\\:opacity-100:is(:where(.group\\/tabs-list)[data-variant=\"line\"] *):where([data-state=\"active\"]), .group-data-\\[variant\\=line\\]\\/tabs-list\\:data-active\\:after\\:opacity-100:is(:where(.group\\/tabs-list)[data-variant=\"line\"] *):where([data-active]:not([data-active=\"false\"]))):after {\n content: var(--tw-content);\n opacity: 1;\n }\n\n @media (hover: hover) {\n :is(.data-active\\:hover\\:bg-muted:where([data-state=\"active\"]), .data-active\\:hover\\:bg-muted:where([data-active]:not([data-active=\"false\"]))):hover {\n background-color: var(--muted);\n }\n }\n\n :is(.data-active\\:focus\\:bg-muted:where([data-state=\"active\"]), .data-active\\:focus\\:bg-muted:where([data-active]:not([data-active=\"false\"]))):focus {\n background-color: var(--muted);\n }\n\n .dark\\:data-active\\:border-input:is(.dark *):where([data-state=\"active\"]), .dark\\:data-active\\:border-input:is(.dark *):where([data-active]:not([data-active=\"false\"])) {\n border-color: var(--input);\n }\n\n .dark\\:data-active\\:bg-input\\/30:is(.dark *):where([data-state=\"active\"]), .dark\\:data-active\\:bg-input\\/30:is(.dark *):where([data-active]:not([data-active=\"false\"])) {\n background-color: var(--input);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .dark\\:data-active\\:bg-input\\/30:is(.dark *):where([data-state=\"active\"]), .dark\\:data-active\\:bg-input\\/30:is(.dark *):where([data-active]:not([data-active=\"false\"])) {\n background-color: color-mix(in oklab, var(--input) 30%, transparent);\n }\n }\n\n .dark\\:data-active\\:text-foreground:is(.dark *):where([data-state=\"active\"]), .dark\\:data-active\\:text-foreground:is(.dark *):where([data-active]:not([data-active=\"false\"])) {\n color: var(--foreground);\n }\n\n .dark\\:group-data-\\[variant\\=line\\]\\/tabs-list\\:data-active\\:border-transparent:is(.dark *):is(:where(.group\\/tabs-list)[data-variant=\"line\"] *):where([data-state=\"active\"]), .dark\\:group-data-\\[variant\\=line\\]\\/tabs-list\\:data-active\\:border-transparent:is(.dark *):is(:where(.group\\/tabs-list)[data-variant=\"line\"] *):where([data-active]:not([data-active=\"false\"])) {\n border-color: #0000;\n }\n\n .dark\\:group-data-\\[variant\\=line\\]\\/tabs-list\\:data-active\\:bg-transparent:is(.dark *):is(:where(.group\\/tabs-list)[data-variant=\"line\"] *):where([data-state=\"active\"]), .dark\\:group-data-\\[variant\\=line\\]\\/tabs-list\\:data-active\\:bg-transparent:is(.dark *):is(:where(.group\\/tabs-list)[data-variant=\"line\"] *):where([data-active]:not([data-active=\"false\"])) {\n background-color: #0000;\n }\n\n .data-horizontal\\:h-px:where([data-orientation=\"horizontal\"]) {\n height: 1px;\n }\n\n .data-horizontal\\:w-full:where([data-orientation=\"horizontal\"]) {\n width: 100%;\n }\n\n .data-horizontal\\:flex-col:where([data-orientation=\"horizontal\"]) {\n flex-direction: column;\n }\n\n .data-vertical\\:w-px:where([data-orientation=\"vertical\"]) {\n width: 1px;\n }\n\n .data-vertical\\:flex-col:where([data-orientation=\"vertical\"]) {\n flex-direction: column;\n }\n\n .data-vertical\\:items-stretch:where([data-orientation=\"vertical\"]) {\n align-items: stretch;\n }\n\n .data-vertical\\:self-stretch:where([data-orientation=\"vertical\"]) {\n align-self: stretch;\n }\n\n .\\[\\&_\\.recharts-cartesian-axis-tick_text\\]\\:fill-muted-foreground .recharts-cartesian-axis-tick text {\n fill: var(--muted-foreground);\n }\n\n .\\[\\&_\\.recharts-cartesian-grid_line\\[stroke\\=\\'\\#ccc\\'\\]\\]\\:stroke-border\\/50 .recharts-cartesian-grid line[stroke=\"#ccc\"] {\n stroke: var(--border);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .\\[\\&_\\.recharts-cartesian-grid_line\\[stroke\\=\\'\\#ccc\\'\\]\\]\\:stroke-border\\/50 .recharts-cartesian-grid line[stroke=\"#ccc\"] {\n stroke: color-mix(in oklab, var(--border) 50%, transparent);\n }\n }\n\n .\\[\\&_\\.recharts-curve\\.recharts-tooltip-cursor\\]\\:stroke-border .recharts-curve.recharts-tooltip-cursor {\n stroke: var(--border);\n }\n\n .\\[\\&_\\.recharts-dot\\[stroke\\=\\'\\#fff\\'\\]\\]\\:stroke-transparent .recharts-dot[stroke=\"#fff\"] {\n stroke: #0000;\n }\n\n .\\[\\&_\\.recharts-layer\\]\\:outline-hidden .recharts-layer {\n --tw-outline-style: none;\n outline-style: none;\n }\n\n @media (forced-colors: active) {\n .\\[\\&_\\.recharts-layer\\]\\:outline-hidden .recharts-layer {\n outline-offset: 2px;\n outline: 2px solid #0000;\n }\n }\n\n .\\[\\&_\\.recharts-polar-grid_\\[stroke\\=\\'\\#ccc\\'\\]\\]\\:stroke-border .recharts-polar-grid [stroke=\"#ccc\"] {\n stroke: var(--border);\n }\n\n .\\[\\&_\\.recharts-radial-bar-background-sector\\]\\:fill-muted .recharts-radial-bar-background-sector, .\\[\\&_\\.recharts-rectangle\\.recharts-tooltip-cursor\\]\\:fill-muted .recharts-rectangle.recharts-tooltip-cursor {\n fill: var(--muted);\n }\n\n .\\[\\&_\\.recharts-reference-line_\\[stroke\\=\\'\\#ccc\\'\\]\\]\\:stroke-border .recharts-reference-line [stroke=\"#ccc\"] {\n stroke: var(--border);\n }\n\n .\\[\\&_\\.recharts-sector\\]\\:outline-hidden .recharts-sector {\n --tw-outline-style: none;\n outline-style: none;\n }\n\n @media (forced-colors: active) {\n .\\[\\&_\\.recharts-sector\\]\\:outline-hidden .recharts-sector {\n outline-offset: 2px;\n outline: 2px solid #0000;\n }\n }\n\n .\\[\\&_\\.recharts-sector\\[stroke\\=\\'\\#fff\\'\\]\\]\\:stroke-transparent .recharts-sector[stroke=\"#fff\"] {\n stroke: #0000;\n }\n\n .\\[\\&_\\.recharts-surface\\]\\:outline-hidden .recharts-surface {\n --tw-outline-style: none;\n outline-style: none;\n }\n\n @media (forced-colors: active) {\n .\\[\\&_\\.recharts-surface\\]\\:outline-hidden .recharts-surface {\n outline-offset: 2px;\n outline: 2px solid #0000;\n }\n }\n\n .\\[\\&_\\[data-slot\\=slider-control\\]\\]\\:py-1\\.5 [data-slot=\"slider-control\"] {\n padding-block: calc(var(--spacing) * 1.5);\n }\n\n .\\[\\&_\\[data-slot\\=slider-thumb\\]\\]\\:size-3 [data-slot=\"slider-thumb\"] {\n width: calc(var(--spacing) * 3);\n height: calc(var(--spacing) * 3);\n }\n\n .\\[\\&_\\[data-slot\\=slider-track\\]\\]\\:h-1 [data-slot=\"slider-track\"] {\n height: var(--spacing);\n }\n\n .\\[\\&_\\[data-slot\\=slider-track\\]\\]\\:bg-foreground\\/15 [data-slot=\"slider-track\"] {\n background-color: var(--foreground);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .\\[\\&_\\[data-slot\\=slider-track\\]\\]\\:bg-foreground\\/15 [data-slot=\"slider-track\"] {\n background-color: color-mix(in oklab, var(--foreground) 15%, transparent);\n }\n }\n\n .\\[\\&_a\\]\\:underline a {\n text-decoration-line: underline;\n }\n\n .\\[\\&_a\\]\\:underline-offset-3 a {\n text-underline-offset: 3px;\n }\n\n @media (hover: hover) {\n .\\[\\&_a\\]\\:hover\\:text-foreground a:hover {\n color: var(--foreground);\n }\n }\n\n .\\[\\&_img\\]\\:size-full img {\n width: 100%;\n height: 100%;\n }\n\n .\\[\\&_img\\]\\:object-cover img {\n object-fit: cover;\n }\n\n .\\[\\&_p\\:not\\(\\:last-child\\)\\]\\:mb-4 p:not(:last-child) {\n margin-bottom: calc(var(--spacing) * 4);\n }\n\n .\\[\\&_svg\\]\\:pointer-events-none svg {\n pointer-events: none;\n }\n\n .\\[\\&_svg\\]\\:size-4 svg {\n width: calc(var(--spacing) * 4);\n height: calc(var(--spacing) * 4);\n }\n\n .\\[\\&_svg\\]\\:shrink-0 svg {\n flex-shrink: 0;\n }\n\n .data-\\[direction\\=start\\]\\:\\[\\&_svg\\]\\:rotate-180[data-direction=\"start\"] svg {\n rotate: 180deg;\n }\n\n .\\[\\&_svg\\:not\\(\\[class\\*\\=\\\"size-\\\"\\]\\)\\]\\:size-4 svg:not([class*=\"size-\"]) {\n width: calc(var(--spacing) * 4);\n height: calc(var(--spacing) * 4);\n }\n\n .\\[\\&_svg\\:not\\(\\[class\\*\\=\\'size-\\'\\]\\)\\]\\:size-3 svg:not([class*=\"size-\"]) {\n width: calc(var(--spacing) * 3);\n height: calc(var(--spacing) * 3);\n }\n\n .\\[\\&_svg\\:not\\(\\[class\\*\\=\\'size-\\'\\]\\)\\]\\:size-3\\.5 svg:not([class*=\"size-\"]) {\n width: calc(var(--spacing) * 3.5);\n height: calc(var(--spacing) * 3.5);\n }\n\n .\\[\\&_svg\\:not\\(\\[class\\*\\=\\'size-\\'\\]\\)\\]\\:size-4 svg:not([class*=\"size-\"]) {\n width: calc(var(--spacing) * 4);\n height: calc(var(--spacing) * 4);\n }\n\n .group-data-\\[orientation\\=vertical\\]\\/attachment\\:\\[\\&_svg\\:not\\(\\[class\\*\\=\\'size-\\'\\]\\)\\]\\:size-6:is(:where(.group\\/attachment)[data-orientation=\"vertical\"] *) svg:not([class*=\"size-\"]) {\n width: calc(var(--spacing) * 6);\n height: calc(var(--spacing) * 6);\n }\n\n .group-data-\\[size\\=xs\\]\\/attachment\\:\\[\\&_svg\\:not\\(\\[class\\*\\=\\'size-\\'\\]\\)\\]\\:size-3\\.5:is(:where(.group\\/attachment)[data-size=\"xs\"] *) svg:not([class*=\"size-\"]) {\n width: calc(var(--spacing) * 3.5);\n height: calc(var(--spacing) * 3.5);\n }\n\n .\\[\\&_tr\\]\\:border-b tr {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 1px;\n }\n\n .\\[\\&_tr\\:last-child\\]\\:border-0 tr:last-child {\n border-style: var(--tw-border-style);\n border-width: 0;\n }\n\n .\\[\\&\\+\\[data-slot\\=item-content\\]\\]\\:flex-none + [data-slot=\"item-content\"] {\n flex: none;\n }\n\n .\\[\\&\\:first-child\\[data-selected\\=true\\]_button\\]\\:rounded-l-\\(--cell-radius\\):first-child[data-selected=\"true\"] button {\n border-top-left-radius: var(--cell-radius);\n border-bottom-left-radius: var(--cell-radius);\n }\n\n .\\[\\&\\:has\\(\\[role\\=checkbox\\]\\)\\]\\:pr-0:has([role=\"checkbox\"]) {\n padding-right: 0;\n }\n\n .\\[\\.border-b\\]\\:pb-2.border-b {\n padding-bottom: calc(var(--spacing) * 2);\n }\n\n .\\[\\.border-b\\]\\:pb-4.border-b {\n padding-bottom: calc(var(--spacing) * 4);\n }\n\n .group-data-\\[size\\=sm\\]\\/card\\:\\[\\.border-b\\]\\:pb-3:is(:where(.group\\/card)[data-size=\"sm\"] *).border-b {\n padding-bottom: calc(var(--spacing) * 3);\n }\n\n .\\[\\.border-t\\]\\:pt-2.border-t {\n padding-top: calc(var(--spacing) * 2);\n }\n\n :is(.rtl\\:\\*\\*\\:\\[\\.rdp-button\\\\_next\\>svg\\]\\:rotate-180:where(:dir(rtl), [dir=\"rtl\"], [dir=\"rtl\"] *) *):is(.rdp-button_next > svg), :is(.rtl\\:\\*\\*\\:\\[\\.rdp-button\\\\_previous\\>svg\\]\\:rotate-180:where(:dir(rtl), [dir=\"rtl\"], [dir=\"rtl\"] *) *):is(.rdp-button_previous > svg) {\n rotate: 180deg;\n }\n\n :is(.\\*\\*\\:\\[\\[cmdk-group-heading\\]\\]\\:px-2 *)[cmdk-group-heading] {\n padding-inline: calc(var(--spacing) * 2);\n }\n\n :is(.\\*\\*\\:\\[\\[cmdk-group-heading\\]\\]\\:py-1\\.5 *)[cmdk-group-heading] {\n padding-block: calc(var(--spacing) * 1.5);\n }\n\n :is(.\\*\\*\\:\\[\\[cmdk-group-heading\\]\\]\\:text-xs *)[cmdk-group-heading] {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n }\n\n :is(.\\*\\*\\:\\[\\[cmdk-group-heading\\]\\]\\:font-medium *)[cmdk-group-heading] {\n --tw-font-weight: var(--font-weight-medium);\n font-weight: var(--font-weight-medium);\n }\n\n :is(.\\*\\*\\:\\[\\[cmdk-group-heading\\]\\]\\:text-muted-foreground *)[cmdk-group-heading] {\n color: var(--muted-foreground);\n }\n\n .\\[a\\]\\:underline:is(a) {\n text-decoration-line: underline;\n }\n\n .\\[a\\]\\:underline-offset-3:is(a) {\n text-underline-offset: 3px;\n }\n\n .\\[a\\]\\:transition-colors:is(a) {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n :is(.\\*\\:\\[a\\]\\:underline > *):is(a) {\n text-decoration-line: underline;\n }\n\n :is(.\\*\\:\\[a\\]\\:underline-offset-3 > *):is(a) {\n text-underline-offset: 3px;\n }\n\n @media (hover: hover) {\n .\\[a\\]\\:hover\\:bg-destructive\\/20:is(a):hover {\n background-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .\\[a\\]\\:hover\\:bg-destructive\\/20:is(a):hover {\n background-color: color-mix(in oklab, var(--destructive) 20%, transparent);\n }\n }\n\n .\\[a\\]\\:hover\\:bg-info-ring\\/60:is(a):hover {\n background-color: var(--info-ring);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .\\[a\\]\\:hover\\:bg-info-ring\\/60:is(a):hover {\n background-color: color-mix(in oklab, var(--info-ring) 60%, transparent);\n }\n }\n\n .\\[a\\]\\:hover\\:bg-muted:is(a):hover {\n background-color: var(--muted);\n }\n\n .\\[a\\]\\:hover\\:bg-primary\\/80:is(a):hover {\n background-color: var(--primary);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .\\[a\\]\\:hover\\:bg-primary\\/80:is(a):hover {\n background-color: color-mix(in oklab, var(--primary) 80%, transparent);\n }\n }\n\n .\\[a\\]\\:hover\\:bg-secondary\\/80:is(a):hover {\n background-color: var(--secondary);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .\\[a\\]\\:hover\\:bg-secondary\\/80:is(a):hover {\n background-color: color-mix(in oklab, var(--secondary) 80%, transparent);\n }\n }\n\n .\\[a\\]\\:hover\\:bg-success-ring\\/60:is(a):hover {\n background-color: var(--success-ring);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .\\[a\\]\\:hover\\:bg-success-ring\\/60:is(a):hover {\n background-color: color-mix(in oklab, var(--success-ring) 60%, transparent);\n }\n }\n\n .\\[a\\]\\:hover\\:bg-warning-ring\\/60:is(a):hover {\n background-color: var(--warning-ring);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .\\[a\\]\\:hover\\:bg-warning-ring\\/60:is(a):hover {\n background-color: color-mix(in oklab, var(--warning-ring) 60%, transparent);\n }\n }\n\n .\\[a\\]\\:hover\\:text-foreground:is(a):hover {\n color: var(--foreground);\n }\n\n .\\[a\\]\\:hover\\:text-muted-foreground:is(a):hover {\n color: var(--muted-foreground);\n }\n\n :is(.\\*\\:\\[a\\]\\:hover\\:text-foreground > *):is(a):hover {\n color: var(--foreground);\n }\n }\n\n .\\[button\\]\\:text-left:is(button) {\n text-align: left;\n }\n\n .\\[button\\,a\\]\\:transition-colors:is(button, a) {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n\n .\\[button\\,a\\]\\:outline-none:is(button, a) {\n --tw-outline-style: none;\n outline-style: none;\n }\n\n .\\[button\\,a\\]\\:focus-visible\\:border-ring:is(button, a):focus-visible {\n border-color: var(--ring);\n }\n\n .\\[button\\,a\\]\\:focus-visible\\:ring-3:is(button, a):focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n\n .\\[button\\,a\\]\\:focus-visible\\:ring-ring\\/50:is(button, a):focus-visible {\n --tw-ring-color: var(--ring);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .\\[button\\,a\\]\\:focus-visible\\:ring-ring\\/50:is(button, a):focus-visible {\n --tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);\n }\n }\n\n :is(.\\*\\:\\[img\\]\\:aspect-square > *):is(img) {\n aspect-ratio: 1;\n }\n\n :is(.\\*\\:\\[img\\]\\:w-full > *):is(img) {\n width: 100%;\n }\n\n :is(.\\*\\:\\[img\\]\\:object-cover > *):is(img) {\n object-fit: cover;\n }\n\n :is(.\\*\\:\\[img\\:first-child\\]\\:rounded-t-xl > *):is(img:first-child) {\n border-top-left-radius: calc(var(--radius) * 1.4);\n border-top-right-radius: calc(var(--radius) * 1.4);\n }\n\n :is(.\\*\\:\\[img\\:last-child\\]\\:rounded-b-xl > *):is(img:last-child) {\n border-bottom-right-radius: calc(var(--radius) * 1.4);\n border-bottom-left-radius: calc(var(--radius) * 1.4);\n }\n\n :is(.\\*\\:\\[svg\\]\\:row-span-2 > *):is(svg) {\n grid-row: span 2 / span 2;\n }\n\n :is(.\\*\\:\\[svg\\]\\:translate-y-0\\.5 > *):is(svg) {\n --tw-translate-y: calc(var(--spacing) * .5);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n :is(.\\*\\:\\[svg\\]\\:text-current > *):is(svg) {\n color: currentColor;\n }\n\n :is(.focus\\:\\*\\:\\[svg\\]\\:text-accent-foreground:focus > *):is(svg) {\n color: var(--accent-foreground);\n }\n\n :is(.data-\\[variant\\=destructive\\]\\:\\*\\:\\[svg\\]\\:text-destructive[data-variant=\"destructive\"] > *):is(svg) {\n color: var(--destructive);\n }\n\n :is(.data-\\[variant\\=destructive\\]\\:\\*\\:\\[svg\\]\\:text-destructive\\![data-variant=\"destructive\"] > *):is(svg) {\n color: var(--destructive) !important;\n }\n\n :is(.data-selected\\:\\*\\:\\[svg\\]\\:text-foreground:where([data-selected=\"true\"]) > *):is(svg) {\n color: var(--foreground);\n }\n\n :is(.\\*\\:\\[svg\\:not\\(\\[class\\*\\=\\'size-\\'\\]\\)\\]\\:size-4 > *):is(svg:not([class*=\"size-\"])) {\n width: calc(var(--spacing) * 4);\n height: calc(var(--spacing) * 4);\n }\n\n :is(.\\*\\:\\[svg\\:not\\(\\[class\\*\\=\\'size-\\'\\]\\)\\]\\:size-6 > *):is(svg:not([class*=\"size-\"])) {\n width: calc(var(--spacing) * 6);\n height: calc(var(--spacing) * 6);\n }\n\n .\\[\\&\\:last-child\\[data-selected\\=true\\]_button\\]\\:rounded-r-\\(--cell-radius\\):last-child[data-selected=\"true\"] button {\n border-top-right-radius: var(--cell-radius);\n border-bottom-right-radius: var(--cell-radius);\n }\n\n .\\[\\&\\:not\\(\\:has\\(\\~\\[data-slot\\=questionnaire-description\\]\\)\\)\\]\\:mb-4:not(:has( ~ [data-slot=\"questionnaire-description\"])) {\n margin-bottom: calc(var(--spacing) * 4);\n }\n\n .\\[\\&\\:nth-child\\(2\\)\\[data-selected\\=true\\]_button\\]\\:rounded-l-\\(--cell-radius\\):nth-child(2)[data-selected=\"true\"] button {\n border-top-left-radius: var(--cell-radius);\n border-bottom-left-radius: var(--cell-radius);\n }\n\n .\\[\\&\\>\\*\\]\\:relative > * {\n position: relative;\n }\n\n .\\[\\&\\>\\*\\]\\:z-0 > * {\n z-index: 0;\n }\n\n .data-\\[orientation\\=horizontal\\]\\:\\[\\&\\>\\*\\:first-child\\]\\:rounded-r-none[data-orientation=\"horizontal\"] > :first-child {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n\n .data-\\[orientation\\=vertical\\]\\:\\[\\&\\>\\*\\:first-child\\]\\:rounded-b-none[data-orientation=\"vertical\"] > :first-child {\n border-bottom-right-radius: 0;\n border-bottom-left-radius: 0;\n }\n\n .\\[\\&\\>\\*\\:focus-visible\\]\\:z-10 > :focus-visible, .\\[\\&\\>\\*\\:hover\\]\\:z-10 > :hover {\n z-index: 10;\n }\n\n .data-\\[orientation\\=horizontal\\]\\:\\[\\&\\>\\*\\:last-child\\]\\:rounded-l-none[data-orientation=\"horizontal\"] > :last-child {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n }\n\n .data-\\[orientation\\=vertical\\]\\:\\[\\&\\>\\*\\:last-child\\]\\:rounded-t-none[data-orientation=\"vertical\"] > :last-child {\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n }\n\n .data-\\[orientation\\=horizontal\\]\\:\\[\\&\\>\\*\\:not\\(\\:first-child\\)\\]\\:-ml-px[data-orientation=\"horizontal\"] > :not(:first-child) {\n margin-left: -1px;\n }\n\n .data-\\[orientation\\=vertical\\]\\:\\[\\&\\>\\*\\:not\\(\\:first-child\\)\\]\\:-mt-px[data-orientation=\"vertical\"] > :not(:first-child) {\n margin-top: -1px;\n }\n\n .\\[\\&\\>\\*\\:not\\(\\:first-child\\)\\:not\\(\\:last-child\\)\\]\\:rounded-none > :not(:first-child):not(:last-child) {\n border-radius: 0;\n }\n\n .\\[\\&\\>\\[data-slot\\=bubble-content\\]\\:is\\(button\\,a\\)\\:hover\\]\\:bg-\\[color-mix\\(in_oklch\\,var\\(--muted\\)\\,var\\(--foreground\\)_5\\%\\)\\] > [data-slot=\"bubble-content\"]:is(button, a):hover {\n background-color: var(--muted);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .\\[\\&\\>\\[data-slot\\=bubble-content\\]\\:is\\(button\\,a\\)\\:hover\\]\\:bg-\\[color-mix\\(in_oklch\\,var\\(--muted\\)\\,var\\(--foreground\\)_5\\%\\)\\] > [data-slot=\"bubble-content\"]:is(button, a):hover {\n background-color: color-mix(in oklch,var(--muted),var(--foreground) 5%);\n }\n }\n\n .\\[\\&\\>\\[data-slot\\=bubble-content\\]\\:is\\(button\\,a\\)\\:hover\\]\\:bg-\\[color-mix\\(in_oklch\\,var\\(--secondary\\)\\,var\\(--foreground\\)_5\\%\\)\\] > [data-slot=\"bubble-content\"]:is(button, a):hover {\n background-color: var(--secondary);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .\\[\\&\\>\\[data-slot\\=bubble-content\\]\\:is\\(button\\,a\\)\\:hover\\]\\:bg-\\[color-mix\\(in_oklch\\,var\\(--secondary\\)\\,var\\(--foreground\\)_5\\%\\)\\] > [data-slot=\"bubble-content\"]:is(button, a):hover {\n background-color: color-mix(in oklch,var(--secondary),var(--foreground) 5%);\n }\n }\n\n .\\[\\&\\>\\[data-slot\\=bubble-content\\]\\:is\\(button\\,a\\)\\:hover\\]\\:bg-\\[oklch\\(from_var\\(--primary\\)_0\\.88_calc\\(c\\*0\\.5\\)_h\\)\\] > [data-slot=\"bubble-content\"]:is(button, a):hover {\n background-color: oklch(from var(--primary) .88 calc(c * .5) h);\n }\n\n .\\[\\&\\>\\[data-slot\\=bubble-content\\]\\:is\\(button\\,a\\)\\:hover\\]\\:bg-destructive\\/20 > [data-slot=\"bubble-content\"]:is(button, a):hover {\n background-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .\\[\\&\\>\\[data-slot\\=bubble-content\\]\\:is\\(button\\,a\\)\\:hover\\]\\:bg-destructive\\/20 > [data-slot=\"bubble-content\"]:is(button, a):hover {\n background-color: color-mix(in oklab, var(--destructive) 20%, transparent);\n }\n }\n\n .\\[\\&\\>\\[data-slot\\=bubble-content\\]\\:is\\(button\\,a\\)\\:hover\\]\\:bg-muted > [data-slot=\"bubble-content\"]:is(button, a):hover {\n background-color: var(--muted);\n }\n\n .\\[\\&\\>\\[data-slot\\=bubble-content\\]\\:is\\(button\\,a\\)\\:hover\\]\\:bg-primary\\/80 > [data-slot=\"bubble-content\"]:is(button, a):hover {\n background-color: var(--primary);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .\\[\\&\\>\\[data-slot\\=bubble-content\\]\\:is\\(button\\,a\\)\\:hover\\]\\:bg-primary\\/80 > [data-slot=\"bubble-content\"]:is(button, a):hover {\n background-color: color-mix(in oklab, var(--primary) 80%, transparent);\n }\n }\n\n .\\[\\&\\>\\[data-slot\\=bubble-content\\]\\:is\\(button\\,a\\)\\:hover\\]\\:text-foreground > [data-slot=\"bubble-content\"]:is(button, a):hover {\n color: var(--foreground);\n }\n\n .dark\\:\\[\\&\\>\\[data-slot\\=bubble-content\\]\\:is\\(button\\,a\\)\\:hover\\]\\:bg-\\[oklch\\(from_var\\(--primary\\)_0\\.35_calc\\(c\\*0\\.5\\)_h\\)\\]:is(.dark *) > [data-slot=\"bubble-content\"]:is(button, a):hover {\n background-color: oklch(from var(--primary) .35 calc(c * .5) h);\n }\n\n .dark\\:\\[\\&\\>\\[data-slot\\=bubble-content\\]\\:is\\(button\\,a\\)\\:hover\\]\\:bg-destructive\\/30:is(.dark *) > [data-slot=\"bubble-content\"]:is(button, a):hover {\n background-color: var(--destructive);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .dark\\:\\[\\&\\>\\[data-slot\\=bubble-content\\]\\:is\\(button\\,a\\)\\:hover\\]\\:bg-destructive\\/30:is(.dark *) > [data-slot=\"bubble-content\"]:is(button, a):hover {\n background-color: color-mix(in oklab, var(--destructive) 30%, transparent);\n }\n }\n\n .dark\\:\\[\\&\\>\\[data-slot\\=bubble-content\\]\\:is\\(button\\,a\\)\\:hover\\]\\:bg-input\\/30:is(.dark *) > [data-slot=\"bubble-content\"]:is(button, a):hover {\n background-color: var(--input);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .dark\\:\\[\\&\\>\\[data-slot\\=bubble-content\\]\\:is\\(button\\,a\\)\\:hover\\]\\:bg-input\\/30:is(.dark *) > [data-slot=\"bubble-content\"]:is(button, a):hover {\n background-color: color-mix(in oklab, var(--input) 30%, transparent);\n }\n }\n\n .dark\\:\\[\\&\\>\\[data-slot\\=bubble-content\\]\\:is\\(button\\,a\\)\\:hover\\]\\:bg-muted\\/50:is(.dark *) > [data-slot=\"bubble-content\"]:is(button, a):hover {\n background-color: var(--muted);\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n .dark\\:\\[\\&\\>\\[data-slot\\=bubble-content\\]\\:is\\(button\\,a\\)\\:hover\\]\\:bg-muted\\/50:is(.dark *) > [data-slot=\"bubble-content\"]:is(button, a):hover {\n background-color: color-mix(in oklab, var(--muted) 50%, transparent);\n }\n }\n\n .\\[\\&\\>\\[role\\=checkbox\\]\\]\\:translate-y-\\[2px\\] > [role=\"checkbox\"] {\n --tw-translate-y: 2px;\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n\n .\\[\\&\\>a\\]\\:underline > a {\n text-decoration-line: underline;\n }\n\n .\\[\\&\\>a\\]\\:underline-offset-4 > a {\n text-underline-offset: 4px;\n }\n\n .\\[\\&\\>a\\:hover\\]\\:text-primary > a:hover {\n color: var(--primary);\n }\n\n .\\[\\&\\>button\\]\\:hidden > button {\n display: none;\n }\n\n .has-\\[\\>\\[data-align\\=block-end\\]\\]\\:\\[\\&\\>input\\]\\:pt-3:has( > [data-align=\"block-end\"]) > input {\n padding-top: calc(var(--spacing) * 3);\n }\n\n .has-\\[\\>\\[data-align\\=block-start\\]\\]\\:\\[\\&\\>input\\]\\:pb-3:has( > [data-align=\"block-start\"]) > input {\n padding-bottom: calc(var(--spacing) * 3);\n }\n\n .has-\\[\\>\\[data-align\\=inline-end\\]\\]\\:\\[\\&\\>input\\]\\:pr-1\\.5:has( > [data-align=\"inline-end\"]) > input {\n padding-right: calc(var(--spacing) * 1.5);\n }\n\n .has-\\[\\>\\[data-align\\=inline-start\\]\\]\\:\\[\\&\\>input\\]\\:pl-1\\.5:has( > [data-align=\"inline-start\"]) > input {\n padding-left: calc(var(--spacing) * 1.5);\n }\n\n .\\[\\&\\>kbd\\]\\:rounded-\\[calc\\(var\\(--radius\\)-5px\\)\\] > kbd {\n border-radius: calc(var(--radius) - 5px);\n }\n\n .\\[\\&\\>span\\]\\:text-xs > span {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n }\n\n .\\[\\&\\>span\\]\\:opacity-70 > span {\n opacity: .7;\n }\n\n .\\[\\&\\>span\\:last-child\\]\\:truncate > span:last-child {\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n }\n\n .\\[\\&\\>svg\\]\\:pointer-events-none > svg {\n pointer-events: none;\n }\n\n .\\[\\&\\>svg\\]\\:size-3\\! > svg {\n width: calc(var(--spacing) * 3) !important;\n height: calc(var(--spacing) * 3) !important;\n }\n\n .\\[\\&\\>svg\\]\\:size-3\\.5 > svg {\n width: calc(var(--spacing) * 3.5);\n height: calc(var(--spacing) * 3.5);\n }\n\n .\\[\\&\\>svg\\]\\:size-4 > svg {\n width: calc(var(--spacing) * 4);\n height: calc(var(--spacing) * 4);\n }\n\n .\\[\\&\\>svg\\]\\:h-2\\.5 > svg {\n height: calc(var(--spacing) * 2.5);\n }\n\n .\\[\\&\\>svg\\]\\:h-3 > svg {\n height: calc(var(--spacing) * 3);\n }\n\n .\\[\\&\\>svg\\]\\:w-2\\.5 > svg {\n width: calc(var(--spacing) * 2.5);\n }\n\n .\\[\\&\\>svg\\]\\:w-3 > svg {\n width: calc(var(--spacing) * 3);\n }\n\n .\\[\\&\\>svg\\]\\:shrink-0 > svg {\n flex-shrink: 0;\n }\n\n .\\[\\&\\>svg\\]\\:text-muted-foreground > svg {\n color: var(--muted-foreground);\n }\n\n .\\[\\&\\>svg\\]\\:text-sidebar-accent-foreground > svg {\n color: var(--sidebar-accent-foreground);\n }\n\n .group-has-data-\\[size\\=lg\\]\\/avatar-group\\:\\[\\&\\>svg\\]\\:size-5:is(:where(.group\\/avatar-group):has([data-size=\"lg\"]) *) > svg {\n width: calc(var(--spacing) * 5);\n height: calc(var(--spacing) * 5);\n }\n\n .group-has-data-\\[size\\=sm\\]\\/avatar-group\\:\\[\\&\\>svg\\]\\:size-3:is(:where(.group\\/avatar-group):has([data-size=\"sm\"]) *) > svg {\n width: calc(var(--spacing) * 3);\n height: calc(var(--spacing) * 3);\n }\n\n .group-data-\\[size\\=default\\]\\/avatar\\:\\[\\&\\>svg\\]\\:size-2:is(:where(.group\\/avatar)[data-size=\"default\"] *) > svg, .group-data-\\[size\\=lg\\]\\/avatar\\:\\[\\&\\>svg\\]\\:size-2:is(:where(.group\\/avatar)[data-size=\"lg\"] *) > svg {\n width: calc(var(--spacing) * 2);\n height: calc(var(--spacing) * 2);\n }\n\n .group-data-\\[size\\=sm\\]\\/avatar\\:\\[\\&\\>svg\\]\\:hidden:is(:where(.group\\/avatar)[data-size=\"sm\"] *) > svg {\n display: none;\n }\n\n .\\[\\&\\>svg\\:not\\(\\[class\\*\\=\\'size-\\'\\]\\)\\]\\:size-3\\.5 > svg:not([class*=\"size-\"]) {\n width: calc(var(--spacing) * 3.5);\n height: calc(var(--spacing) * 3.5);\n }\n\n .\\[\\&\\>svg\\:not\\(\\[class\\*\\=\\'size-\\'\\]\\)\\]\\:size-4 > svg:not([class*=\"size-\"]) {\n width: calc(var(--spacing) * 4);\n height: calc(var(--spacing) * 4);\n }\n\n .\\[\\&\\>tr\\]\\:last\\:border-b-0 > tr:last-child {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 0;\n }\n\n .\\[\\&\\[aria-orientation\\=horizontal\\]\\>div\\]\\:rotate-90[aria-orientation=\"horizontal\"] > div {\n rotate: 90deg;\n }\n\n .\\[\\&\\[data-ending-style\\]\\:not\\(\\[data-limited\\]\\)\\:not\\(\\[data-swipe-direction\\]\\)\\]\\:\\[transform\\:translateY\\(150\\%\\)\\][data-ending-style]:not([data-limited]):not([data-swipe-direction]) {\n transform: translateY(150%);\n }\n\n .\\[\\&\\[data-panel-open\\]\\>svg\\]\\:rotate-180[data-panel-open] > svg {\n rotate: 180deg;\n }\n\n [data-side=\"left\"][data-collapsible=\"offcanvas\"] .\\[\\[data-side\\=left\\]\\[data-collapsible\\=offcanvas\\]_\\&\\]\\:-right-2 {\n right: calc(var(--spacing) * -2);\n }\n\n [data-side=\"left\"][data-state=\"collapsed\"] .\\[\\[data-side\\=left\\]\\[data-state\\=collapsed\\]_\\&\\]\\:cursor-e-resize {\n cursor: e-resize;\n }\n\n [data-side=\"right\"][data-collapsible=\"offcanvas\"] .\\[\\[data-side\\=right\\]\\[data-collapsible\\=offcanvas\\]_\\&\\]\\:-left-2 {\n left: calc(var(--spacing) * -2);\n }\n\n [data-side=\"right\"][data-state=\"collapsed\"] .\\[\\[data-side\\=right\\]\\[data-state\\=collapsed\\]_\\&\\]\\:cursor-w-resize {\n cursor: w-resize;\n }\n}\n\n@property --tw-animation-delay {\n syntax: \"*\";\n inherits: false;\n initial-value: 0s;\n}\n\n@property --tw-animation-direction {\n syntax: \"*\";\n inherits: false;\n initial-value: normal;\n}\n\n@property --tw-animation-duration {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-animation-fill-mode {\n syntax: \"*\";\n inherits: false;\n initial-value: none;\n}\n\n@property --tw-animation-iteration-count {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n\n@property --tw-enter-blur {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-enter-opacity {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n\n@property --tw-enter-rotate {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-enter-scale {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n\n@property --tw-enter-translate-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-enter-translate-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-exit-blur {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-exit-opacity {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n\n@property --tw-exit-rotate {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-exit-scale {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n\n@property --tw-exit-translate-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-exit-translate-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --scroll-fade-t {\n syntax: \"<length-percentage>\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --scroll-fade-b {\n syntax: \"<length-percentage>\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --scroll-fade-s {\n syntax: \"<length-percentage>\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --scroll-fade-e {\n syntax: \"<length-percentage>\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --scroll-fade-mask {\n syntax: \"*\";\n inherits: false\n}\n\n@property --shimmer-angle {\n syntax: \"<angle>\";\n inherits: true;\n initial-value: 20deg;\n}\n\n@property --shimmer-image {\n syntax: \"*\";\n inherits: false\n}\n\n@property --shimmer-text-fill {\n syntax: \"*\";\n inherits: false\n}\n\n@media (prefers-reduced-motion: reduce) {\n .shimmer {\n -webkit-text-fill-color: currentColor;\n background-image: none;\n animation: none;\n }\n}\n\n@keyframes edx-faded-under-reveal {\n from {\n opacity: 0;\n }\n\n to {\n opacity: 1;\n }\n}\n\n:root {\n --radius: .625rem;\n --background: oklch(100% 0 0);\n --foreground: oklch(14.5% 0 0);\n --card: oklch(100% 0 0);\n --card-foreground: oklch(14.5% 0 0);\n --popover: oklch(100% 0 0);\n --popover-foreground: oklch(14.5% 0 0);\n --overlay: oklch(0% 0 0 / .1);\n --primary: oklch(20.5% 0 0);\n --primary-foreground: oklch(98.5% 0 0);\n --secondary: oklch(97% 0 0);\n --secondary-foreground: oklch(20.5% 0 0);\n --muted: oklch(97% 0 0);\n --muted-foreground: oklch(55.6% 0 0);\n --accent: oklch(97% 0 0);\n --accent-foreground: oklch(20.5% 0 0);\n --destructive: oklch(50.5% .213 27.518);\n --destructive-foreground: oklch(98.5% 0 0);\n --success: oklch(44.8% .119 151.328);\n --success-foreground: oklch(97.9% .021 166.113);\n --success-ring: oklch(90.5% .093 164.15);\n --warning: oklch(47.3% .137 46.201);\n --warning-foreground: oklch(98.7% .022 95.277);\n --warning-ring: oklch(92.4% .12 95.746);\n --info: oklch(50% .134 242.749);\n --info-foreground: oklch(97.7% .013 236.62);\n --info-ring: oklch(90.1% .058 230.902);\n --border: oklch(92.2% 0 0);\n --input: oklch(92.2% 0 0);\n --ring: oklch(70.8% 0 0);\n --chart-1: oklch(64.6% .222 41.116);\n --chart-2: oklch(60% .118 184.704);\n --chart-3: oklch(39.8% .07 227.392);\n --chart-4: oklch(82.8% .189 84.429);\n --chart-5: oklch(76.9% .188 70.08);\n --sidebar: oklch(98.5% 0 0);\n --sidebar-foreground: oklch(14.5% 0 0);\n --sidebar-primary: oklch(20.5% 0 0);\n --sidebar-primary-foreground: oklch(98.5% 0 0);\n --sidebar-accent: oklch(97% 0 0);\n --sidebar-accent-foreground: oklch(20.5% 0 0);\n --sidebar-border: oklch(92.2% 0 0);\n --sidebar-ring: oklch(70.8% 0 0);\n}\n\n.dark {\n --background: oklch(14.5% 0 0);\n --foreground: oklch(98.5% 0 0);\n --card: oklch(20.5% 0 0);\n --card-foreground: oklch(98.5% 0 0);\n --popover: oklch(20.5% 0 0);\n --popover-foreground: oklch(98.5% 0 0);\n --overlay: oklch(0% 0 0 / .1);\n --primary: oklch(92.2% 0 0);\n --primary-foreground: oklch(20.5% 0 0);\n --secondary: oklch(26.9% 0 0);\n --secondary-foreground: oklch(98.5% 0 0);\n --muted: oklch(26.9% 0 0);\n --muted-foreground: oklch(70.8% 0 0);\n --accent: oklch(26.9% 0 0);\n --accent-foreground: oklch(98.5% 0 0);\n --destructive: oklch(70.4% .191 22.216);\n --destructive-foreground: oklch(98.5% 0 0);\n --success: oklch(79.2% .209 151.711);\n --success-foreground: oklch(26.2% .051 172.552);\n --success-ring: oklch(43.2% .095 166.913);\n --warning: oklch(87.9% .169 91.605);\n --warning-foreground: oklch(27.9% .077 45.635);\n --warning-ring: oklch(47.3% .137 46.201);\n --info: oklch(82.8% .111 230.318);\n --info-foreground: oklch(29.3% .066 243.157);\n --info-ring: oklch(44.3% .11 240.79);\n --border: oklch(100% 0 0 / .1);\n --input: oklch(100% 0 0 / .15);\n --ring: oklch(55.6% 0 0);\n --chart-1: oklch(48.8% .243 264.376);\n --chart-2: oklch(69.6% .17 162.48);\n --chart-3: oklch(76.9% .188 70.08);\n --chart-4: oklch(62.7% .265 303.9);\n --chart-5: oklch(64.5% .246 16.439);\n --sidebar: oklch(20.5% 0 0);\n --sidebar-foreground: oklch(98.5% 0 0);\n --sidebar-primary: oklch(48.8% .243 264.376);\n --sidebar-primary-foreground: oklch(98.5% 0 0);\n --sidebar-accent: oklch(26.9% 0 0);\n --sidebar-accent-foreground: oklch(98.5% 0 0);\n --sidebar-border: oklch(100% 0 0 / .1);\n --sidebar-ring: oklch(55.6% 0 0);\n}\n\n@keyframes progress-indeterminate {\n from {\n translate: -100%;\n }\n\n to {\n translate: 300%;\n }\n}\n\n@property --tw-translate-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-translate-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-translate-z {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-scroll-snap-strictness {\n syntax: \"*\";\n inherits: false;\n initial-value: proximity;\n}\n\n@property --tw-space-y-reverse {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-space-x-reverse {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-border-style {\n syntax: \"*\";\n inherits: false;\n initial-value: solid;\n}\n\n@property --tw-gradient-position {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-gradient-from {\n syntax: \"<color>\";\n inherits: false;\n initial-value: #0000;\n}\n\n@property --tw-gradient-via {\n syntax: \"<color>\";\n inherits: false;\n initial-value: #0000;\n}\n\n@property --tw-gradient-to {\n syntax: \"<color>\";\n inherits: false;\n initial-value: #0000;\n}\n\n@property --tw-gradient-stops {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-gradient-via-stops {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-gradient-from-position {\n syntax: \"<length-percentage>\";\n inherits: false;\n initial-value: 0%;\n}\n\n@property --tw-gradient-via-position {\n syntax: \"<length-percentage>\";\n inherits: false;\n initial-value: 50%;\n}\n\n@property --tw-gradient-to-position {\n syntax: \"<length-percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n\n@property --tw-leading {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-font-weight {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-tracking {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-ordinal {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-slashed-zero {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-numeric-figure {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-numeric-spacing {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-numeric-fraction {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-shadow-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n\n@property --tw-inset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-inset-shadow-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-inset-shadow-alpha {\n syntax: \"<percentage>\";\n inherits: false;\n initial-value: 100%;\n}\n\n@property --tw-ring-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-inset-ring-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-inset-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-ring-inset {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-ring-offset-width {\n syntax: \"<length>\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-ring-offset-color {\n syntax: \"*\";\n inherits: false;\n initial-value: #fff;\n}\n\n@property --tw-ring-offset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-outline-style {\n syntax: \"*\";\n inherits: false;\n initial-value: solid;\n}\n\n@property --tw-duration {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-ease {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-content {\n syntax: \"*\";\n inherits: false;\n initial-value: \"\";\n}\n\n@property --tw-scrollbar-thumb {\n syntax: \"<color>\";\n inherits: false;\n initial-value: #0000;\n}\n\n@property --tw-scrollbar-track {\n syntax: \"<color>\";\n inherits: false;\n initial-value: #0000;\n}\n\n@property --tw-scale-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n\n@property --tw-scale-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n\n@property --tw-scale-z {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n\n@property --tw-backdrop-blur {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-brightness {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-contrast {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-grayscale {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-hue-rotate {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-invert {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-opacity {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-saturate {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-backdrop-sepia {\n syntax: \"*\";\n inherits: false\n}\n\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n\n@keyframes pulse {\n 50% {\n opacity: .5;\n }\n}\n\n@keyframes enter {\n from {\n opacity: var(--tw-enter-opacity, 1);\n transform: translate3d(var(--tw-enter-translate-x, 0),var(--tw-enter-translate-y, 0),0)scale3d(var(--tw-enter-scale, 1),var(--tw-enter-scale, 1),var(--tw-enter-scale, 1))rotate(var(--tw-enter-rotate, 0));\n filter: blur(var(--tw-enter-blur, 0));\n }\n}\n\n@keyframes exit {\n to {\n opacity: var(--tw-exit-opacity, 1);\n transform: translate3d(var(--tw-exit-translate-x, 0),var(--tw-exit-translate-y, 0),0)scale3d(var(--tw-exit-scale, 1),var(--tw-exit-scale, 1),var(--tw-exit-scale, 1))rotate(var(--tw-exit-rotate, 0));\n filter: blur(var(--tw-exit-blur, 0));\n }\n}\n\n@keyframes caret-blink {\n 0%, 70%, 100% {\n opacity: 1;\n }\n\n 20%, 50% {\n opacity: 0;\n }\n}\n\n@keyframes scroll-fade-reveal-b {\n from {\n --scroll-fade-b: var(--_scroll-fade-size-b, var(--scroll-fade-size, min(12%, calc(var(--spacing) * 10))));\n }\n\n to {\n --scroll-fade-b: 0px;\n }\n}\n\n@keyframes scroll-fade-reveal-s {\n from {\n --scroll-fade-s: 0px;\n }\n\n to {\n --scroll-fade-s: var(--_scroll-fade-size-s, var(--scroll-fade-size, min(12%, calc(var(--spacing) * 10))));\n }\n}\n\n@keyframes scroll-fade-reveal-e {\n from {\n --scroll-fade-e: var(--_scroll-fade-size-e, var(--scroll-fade-size, min(12%, calc(var(--spacing) * 10))));\n }\n\n to {\n --scroll-fade-e: 0px;\n }\n}\n\n@keyframes tw-shimmer {\n from {\n background-position: 100% 0;\n }\n\n to {\n background-position: 0 0;\n }\n}\n";
4001
+ //#endregion
4002
+ //#region src/elements.ts
4003
+ /** The design system's compiled CSS, as a string, for shadow roots. */
4004
+ var elementStyles = styles_default;
4005
+ /**
4006
+ * Register every `<edx-*>` element. Defaults to shadow DOM with the bundled
4007
+ * stylesheet; pass `styles` to override, or `mode: 'light'` to opt out of
4008
+ * shadow DOM. Calling it more than once is harmless.
4009
+ */
4010
+ var registerElements = (options = {}) => {
4011
+ registerElements$1({
4012
+ mode: "shadow",
4013
+ styles: styles_default,
4014
+ ...options
4015
+ });
4016
+ };
4017
+ //#endregion
4018
+ export { EDX_FIELD_CONTROL_CONNECT_EVENT, EdxHostProvider, Slot, coerceBool, coerceJson, coerceNumber, defineElement, elementStyles, getDefaultMode, getStyleSheet, registerElements, setDefaultMode, useDomMode, useEdxHost, useEmit, usePortalContainer };
4019
+
4020
+ //# sourceMappingURL=elements.js.map