@alexgorbatchev/shadcn 0.0.20 → 0.0.22
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +24 -14
- package/THIRD_PARTY_NOTICES.md +60 -0
- package/dist/{chunk-s46hvhjw.js → chunk-0w6rxpr5.js} +1 -1
- package/dist/{chunk-gabqzfq0.js → chunk-1p7pend8.js} +3 -3
- package/dist/chunk-21wbz345.js +65 -0
- package/dist/{chunk-84ca0dpc.js → chunk-67dkgsm3.js} +1 -1
- package/dist/{chunk-p8qtk151.js → chunk-72qr0gqe.js} +1 -1
- package/dist/{chunk-4drqqqz1.js → chunk-83cckb23.js} +1 -1
- package/dist/{chunk-ztcbee24.js → chunk-9dqspkha.js} +1 -1
- package/dist/{chunk-eq88qk1d.js → chunk-d3ad53et.js} +8 -8
- package/dist/{chunk-h979cxnh.js → chunk-dq7kr5y0.js} +2 -1
- package/dist/{chunk-mrrbycgx.js → chunk-e0gcczqk.js} +1 -1
- package/dist/{chunk-553bzh59.js → chunk-f4c0tg2x.js} +1 -1
- package/dist/{chunk-14qj6w54.js → chunk-f9ha76ap.js} +4 -4
- package/dist/{chunk-ykt5sv7n.js → chunk-gkkbg7rq.js} +1 -1
- package/dist/{chunk-qv19jhdk.js → chunk-k8v9y2dw.js} +1 -1
- package/dist/chunk-kbg2e95b.js +434 -0
- package/dist/chunk-r9qrb6b6.js +54 -0
- package/dist/{chunk-ecmk3vgd.js → chunk-seeed8a2.js} +1 -1
- package/dist/{chunk-d9jbqd99.js → chunk-tynbgc30.js} +1 -1
- package/dist/{chunk-1qhf8gh8.js → chunk-wwyzwptb.js} +1 -1
- package/dist/components/AccountMenu.d.ts +12 -0
- package/dist/components/AppShell.d.ts +23 -0
- package/dist/components/AuthForm.d.ts +18 -0
- package/dist/components/BarList.d.ts +16 -0
- package/dist/components/BillingUsage.d.ts +20 -0
- package/dist/components/Combobox.d.ts +2 -1
- package/dist/components/DashboardLayout.d.ts +18 -0
- package/dist/components/FilterBar.d.ts +20 -0
- package/dist/components/Kanban.d.ts +23 -0
- package/dist/components/Meter.d.ts +9 -0
- package/dist/components/NumberField.d.ts +11 -0
- package/dist/components/PageHeader.d.ts +11 -0
- package/dist/components/SettingsSection.d.ts +16 -0
- package/dist/components/Sidebar.d.ts +2 -1
- package/dist/components/StatCard.d.ts +14 -0
- package/dist/components/StatusTracker.d.ts +16 -0
- package/dist/components/Stepper.d.ts +12 -0
- package/dist/components/TagInput.d.ts +16 -0
- package/dist/components/Toolbar.d.ts +10 -0
- package/dist/components/WorkspaceSwitcher.d.ts +14 -0
- package/dist/components/assistant-ui/elements/ApprovalCard.d.ts +1 -1
- package/dist/components/assistant-ui/elements/CommandPalette.js +3 -3
- package/dist/components/assistant-ui/elements/MessageTiming.d.ts +1 -1
- package/dist/components/assistant-ui/elements/ModelSelector.js +9 -9
- package/dist/components/assistant-ui/elements/ModelSelectorContent.js +8 -8
- package/dist/components/assistant-ui/elements/ModelSelectorEmpty.js +3 -3
- package/dist/components/assistant-ui/elements/ModelSelectorFocusAnchor.js +3 -3
- package/dist/components/assistant-ui/elements/ModelSelectorGroup.js +3 -3
- package/dist/components/assistant-ui/elements/ModelSelectorItem.js +3 -3
- package/dist/components/assistant-ui/elements/ModelSelectorList.js +5 -5
- package/dist/components/assistant-ui/elements/ModelSelectorSearch.js +3 -3
- package/dist/components/assistant-ui/elements/ModelSelectorSeparator.js +3 -3
- package/dist/components/assistant-ui/elements/types.d.ts +0 -4
- package/dist/components/assistant-ui/index.js +11 -11
- package/dist/components/assistant-ui/native/AssistantModal.js +3 -3
- package/dist/components/assistant-ui/native/AssistantSidebar.js +3 -3
- package/dist/components/assistant-ui/native/ModelSelector.js +11 -11
- package/dist/components/assistant-ui/native/TaskCard.js +2 -2
- package/dist/components/assistant-ui/native/TaskGroup.js +3 -3
- package/dist/components/assistant-ui/native/Thread.js +2 -2
- package/dist/components/assistant-ui/native/ThreadListSidebar.js +2 -2
- package/dist/components/assistant-ui/native/index.js +17 -17
- package/dist/components/calendar/DatePicker.d.ts +27 -0
- package/dist/components/calendar/index.d.ts +2 -0
- package/dist/components/calendar/index.js +175 -2
- package/dist/components/chart/AnalyticsChart.d.ts +24 -0
- package/dist/components/chart/index.d.ts +2 -0
- package/dist/components/chart/index.js +88 -0
- package/dist/components/color-picker/ColorPicker.d.ts +14 -0
- package/dist/components/color-picker/index.d.ts +2 -0
- package/dist/components/color-picker/index.js +52 -0
- package/dist/components/command/index.js +1 -1
- package/dist/components/data-grid/DataGrid.d.ts +44 -0
- package/dist/components/data-grid/index.d.ts +2 -0
- package/dist/components/data-grid/index.js +228 -0
- package/dist/components/editor/RichTextEditor.d.ts +14 -0
- package/dist/components/editor/index.d.ts +2 -0
- package/dist/components/editor/index.js +108 -0
- package/dist/components/event-calendar/EventCalendar.d.ts +16 -0
- package/dist/components/event-calendar/EventForm.d.ts +18 -0
- package/dist/components/event-calendar/index.d.ts +4 -0
- package/dist/components/event-calendar/index.js +266 -0
- package/dist/components/file-upload/FileUpload.d.ts +14 -0
- package/dist/components/file-upload/index.d.ts +2 -0
- package/dist/components/file-upload/index.js +80 -0
- package/dist/components/gantt/Gantt.d.ts +22 -0
- package/dist/components/gantt/Roadmap.d.ts +18 -0
- package/dist/components/gantt/index.d.ts +4 -0
- package/dist/components/gantt/index.js +357 -0
- package/dist/components/image-crop/ImageCrop.d.ts +10 -0
- package/dist/components/image-crop/index.d.ts +2 -0
- package/dist/components/image-crop/index.js +35 -0
- package/dist/components/tree/Tree.d.ts +15 -0
- package/dist/components/tree/TreeItem.d.ts +22 -0
- package/dist/components/tree/index.d.ts +7 -0
- package/dist/components/tree/index.js +190 -0
- package/dist/event-calendar.css +83 -0
- package/dist/index.d.ts +33 -0
- package/dist/index.js +1422 -711
- package/dist/options/types.d.ts +5 -0
- package/llms/components/actions/Toolbar.md +89 -0
- package/llms/components/data-display/AnalyticsChart.md +48 -0
- package/llms/components/data-display/BarList.md +50 -0
- package/llms/components/data-display/DataGrid.md +51 -0
- package/llms/components/data-display/Meter.md +74 -0
- package/llms/components/data-display/Sparkline.md +50 -0
- package/llms/components/data-display/StatCard.md +65 -0
- package/llms/components/data-display/StatusTracker.md +51 -0
- package/llms/components/dates/DatePicker.md +97 -0
- package/llms/components/forms/AuthForm.md +70 -0
- package/llms/components/forms/ColorPicker.md +70 -0
- package/llms/components/forms/EventForm.md +66 -0
- package/llms/components/forms/FileUpload.md +55 -0
- package/llms/components/forms/FilterBar.md +34 -0
- package/llms/components/forms/ImageCrop.md +88 -0
- package/llms/components/forms/NumberField.md +94 -0
- package/llms/components/forms/Questionnaire.md +12 -0
- package/llms/components/forms/RichTextEditor.md +62 -0
- package/llms/components/forms/SettingsSection.md +65 -0
- package/llms/components/forms/Stepper.md +85 -0
- package/llms/components/forms/TagInput.md +47 -0
- package/llms/components/layout/AppShell.md +63 -0
- package/llms/components/layout/BillingUsage.md +51 -0
- package/llms/components/layout/DashboardLayout.md +78 -0
- package/llms/components/layout/PageHeader.md +49 -0
- package/llms/components/navigation/AccountMenu.md +42 -0
- package/llms/components/navigation/Tree.md +51 -0
- package/llms/components/navigation/WorkspaceSwitcher.md +48 -0
- package/llms/components/planning/EventCalendar.md +67 -0
- package/llms/components/planning/Gantt.md +66 -0
- package/llms/components/planning/Kanban.md +50 -0
- package/llms/components/planning/Roadmap.md +34 -0
- package/llms/setup.md +24 -14
- package/llms.txt +34 -0
- package/package.json +105 -3
- /package/dist/{chunk-8fcjx3he.js → chunk-az81pc04.js} +0 -0
- /package/dist/{chunk-7pyt4e5t.js → chunk-ghmkxqn5.js} +0 -0
- /package/dist/{chunk-5pvyxayg.js → chunk-m9zsppp2.js} +0 -0
package/dist/index.js
CHANGED
|
@@ -117,6 +117,21 @@ import {
|
|
|
117
117
|
InputGroupInput2,
|
|
118
118
|
InputGroupTextarea2
|
|
119
119
|
} from "./chunk-1jeg5z55.js";
|
|
120
|
+
import {
|
|
121
|
+
Tabs2,
|
|
122
|
+
tabsListVariants2,
|
|
123
|
+
TabsList2,
|
|
124
|
+
TabsTrigger2,
|
|
125
|
+
TabsContent2,
|
|
126
|
+
DragDropPreview2,
|
|
127
|
+
DragDropProvider2,
|
|
128
|
+
useDragDrop2,
|
|
129
|
+
useDragSource2,
|
|
130
|
+
DragSource2,
|
|
131
|
+
useDropTarget2,
|
|
132
|
+
DropTarget2,
|
|
133
|
+
Kanban2
|
|
134
|
+
} from "./chunk-kbg2e95b.js";
|
|
120
135
|
import {
|
|
121
136
|
badgeVariants2,
|
|
122
137
|
Badge2
|
|
@@ -182,6 +197,11 @@ import {
|
|
|
182
197
|
TableCell2,
|
|
183
198
|
TableCaption2
|
|
184
199
|
} from "./chunk-0y0kqaqj.js";
|
|
200
|
+
import {
|
|
201
|
+
NativeSelect2,
|
|
202
|
+
NativeSelectOption2,
|
|
203
|
+
NativeSelectOptGroup2
|
|
204
|
+
} from "./chunk-r9qrb6b6.js";
|
|
185
205
|
import {
|
|
186
206
|
Kbd2,
|
|
187
207
|
KbdGroup2
|
|
@@ -224,7 +244,15 @@ import {
|
|
|
224
244
|
SidebarMenuSub2,
|
|
225
245
|
SidebarMenuSubItem2,
|
|
226
246
|
SidebarMenuSubButton2
|
|
227
|
-
} from "./chunk-
|
|
247
|
+
} from "./chunk-dq7kr5y0.js";
|
|
248
|
+
import {
|
|
249
|
+
Toolbar2,
|
|
250
|
+
ToolbarButton2,
|
|
251
|
+
ToolbarLink2,
|
|
252
|
+
ToolbarInput2,
|
|
253
|
+
ToolbarGroup2,
|
|
254
|
+
ToolbarSeparator2
|
|
255
|
+
} from "./chunk-21wbz345.js";
|
|
228
256
|
// src/components/ButtonLink.tsx
|
|
229
257
|
import { mergeProps } from "@base-ui/react/merge-props";
|
|
230
258
|
import { useRender } from "@base-ui/react/use-render";
|
|
@@ -506,7 +534,14 @@ function ComboboxChips({ density, className, ...props }) {
|
|
|
506
534
|
...props
|
|
507
535
|
});
|
|
508
536
|
}
|
|
509
|
-
function ComboboxChip({
|
|
537
|
+
function ComboboxChip({
|
|
538
|
+
density,
|
|
539
|
+
className,
|
|
540
|
+
children,
|
|
541
|
+
showRemove = true,
|
|
542
|
+
removeLabel = "Remove item",
|
|
543
|
+
...props
|
|
544
|
+
}) {
|
|
510
545
|
return /* @__PURE__ */ jsxs2(ComboboxPrimitive.Chip, {
|
|
511
546
|
"data-density": density,
|
|
512
547
|
"data-slot": "combobox-chip",
|
|
@@ -521,7 +556,7 @@ function ComboboxChip({ density, className, children, showRemove = true, ...prop
|
|
|
521
556
|
}),
|
|
522
557
|
className: "size-tag -ms-1 opacity-50 hover:opacity-100",
|
|
523
558
|
"data-slot": "combobox-chip-remove",
|
|
524
|
-
"aria-label":
|
|
559
|
+
"aria-label": removeLabel,
|
|
525
560
|
children: /* @__PURE__ */ jsx3(XIcon, {
|
|
526
561
|
className: "pointer-events-none"
|
|
527
562
|
})
|
|
@@ -537,335 +572,54 @@ function ComboboxChipsInput({ density, className, ...props }) {
|
|
|
537
572
|
...props
|
|
538
573
|
});
|
|
539
574
|
}
|
|
540
|
-
// src/components/Tabs.tsx
|
|
541
|
-
import { Tabs as TabsPrimitive } from "@base-ui/react/tabs";
|
|
542
|
-
import { cva } from "class-variance-authority";
|
|
543
|
-
import { jsx as jsx4 } from "react/jsx-runtime";
|
|
544
|
-
function Tabs({ density, className, orientation = "horizontal", ...props }) {
|
|
545
|
-
return /* @__PURE__ */ jsx4(TabsPrimitive.Root, {
|
|
546
|
-
"data-density": density,
|
|
547
|
-
"data-slot": "tabs",
|
|
548
|
-
orientation,
|
|
549
|
-
className: (state) => cn2("group/tabs flex gap-2 data-[orientation=horizontal]:flex-col", typeof className === "function" ? className(state) : className),
|
|
550
|
-
...props
|
|
551
|
-
});
|
|
552
|
-
}
|
|
553
|
-
var tabsListVariants = cva("group/tabs-list inline-flex w-fit items-center justify-center rounded-sm p-px text-muted-foreground group-data-[orientation=horizontal]/tabs:h-control group-data-[orientation=vertical]/tabs:h-fit group-data-[orientation=vertical]/tabs:flex-col data-[variant=line]:rounded-none", {
|
|
554
|
-
variants: {
|
|
555
|
-
variant: {
|
|
556
|
-
default: "bg-muted",
|
|
557
|
-
line: "gap-1 bg-transparent"
|
|
558
|
-
}
|
|
559
|
-
},
|
|
560
|
-
defaultVariants: {
|
|
561
|
-
variant: "default"
|
|
562
|
-
}
|
|
563
|
-
});
|
|
564
|
-
function TabsList({ density, className, variant = "default", ...props }) {
|
|
565
|
-
return /* @__PURE__ */ jsx4(TabsPrimitive.List, {
|
|
566
|
-
"data-density": density,
|
|
567
|
-
"data-slot": "tabs-list",
|
|
568
|
-
"data-variant": variant,
|
|
569
|
-
className: (state) => cn2(tabsListVariants({ variant }), typeof className === "function" ? className(state) : className),
|
|
570
|
-
...props
|
|
571
|
-
});
|
|
572
|
-
}
|
|
573
|
-
function TabsTrigger({ density, className, ...props }) {
|
|
574
|
-
return /* @__PURE__ */ jsx4(TabsPrimitive.Tab, {
|
|
575
|
-
"data-density": density,
|
|
576
|
-
"data-slot": "tabs-trigger",
|
|
577
|
-
className: (state) => cn2("relative inline-flex h-full flex-1 items-center justify-center gap-control-gap rounded-md border border-transparent px-1.5 py-0.5 text-sm font-medium whitespace-nowrap text-foreground/60 transition-colors group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start hover:text-foreground focus-visible:border-ring focus-visible:ring-1 focus-visible:ring-ring focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 has-data-[icon=inline-end]:pe-1 has-data-[icon=inline-start]:ps-1 aria-disabled:pointer-events-none aria-disabled:opacity-50 group-data-[variant=default]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", "group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-active:bg-transparent", "data-active:bg-background data-active:text-foreground", "after:absolute after:bg-foreground after:opacity-0 after:transition-opacity group-data-[orientation=horizontal]/tabs:after:inset-x-0 group-data-[orientation=horizontal]/tabs:after:bottom-[-5px] group-data-[orientation=horizontal]/tabs:after:h-0.5 group-data-[orientation=vertical]/tabs:after:inset-y-0 group-data-[orientation=vertical]/tabs:after:-end-1 group-data-[orientation=vertical]/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-active:after:opacity-100", typeof className === "function" ? className(state) : className),
|
|
578
|
-
...props
|
|
579
|
-
});
|
|
580
|
-
}
|
|
581
|
-
function TabsContent({ density, className, ...props }) {
|
|
582
|
-
return /* @__PURE__ */ jsx4(TabsPrimitive.Panel, {
|
|
583
|
-
"data-density": density,
|
|
584
|
-
"data-slot": "tabs-content",
|
|
585
|
-
"data-scroll": "none",
|
|
586
|
-
className: (state) => cn2("flex-1 text-sm outline-none", typeof className === "function" ? className(state) : className),
|
|
587
|
-
...props
|
|
588
|
-
});
|
|
589
|
-
}
|
|
590
|
-
// src/components/DragDropProvider.tsx
|
|
591
|
-
import { useCallback, useEffect, useRef, useState } from "react";
|
|
592
|
-
import { flushSync } from "react-dom";
|
|
593
|
-
|
|
594
|
-
// src/drag-drop/DragDropContext.ts
|
|
595
|
-
import { createContext } from "react";
|
|
596
|
-
var DragDropContext = createContext(null);
|
|
597
|
-
|
|
598
|
-
// src/components/DragDropPreview.tsx
|
|
599
|
-
import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
600
|
-
function DragDropPreview({ labels, maxItems = 5 }) {
|
|
601
|
-
const limit = Math.max(1, Math.floor(maxItems));
|
|
602
|
-
return /* @__PURE__ */ jsxs3("div", {
|
|
603
|
-
"data-slot": "drag-drop-preview",
|
|
604
|
-
className: "flex w-max max-w-64 flex-col items-start gap-1",
|
|
605
|
-
children: [
|
|
606
|
-
labels.slice(0, limit).map((label, index) => /* @__PURE__ */ jsx5(Badge2, {
|
|
607
|
-
variant: "secondary",
|
|
608
|
-
density: "compact",
|
|
609
|
-
children: /* @__PURE__ */ jsx5("span", {
|
|
610
|
-
className: "max-w-60 truncate",
|
|
611
|
-
children: label
|
|
612
|
-
})
|
|
613
|
-
}, `${index}:${label}`)),
|
|
614
|
-
labels.length > limit && /* @__PURE__ */ jsxs3(Badge2, {
|
|
615
|
-
variant: "secondary",
|
|
616
|
-
density: "compact",
|
|
617
|
-
children: [
|
|
618
|
-
"+",
|
|
619
|
-
labels.length - limit,
|
|
620
|
-
" more…"
|
|
621
|
-
]
|
|
622
|
-
})
|
|
623
|
-
]
|
|
624
|
-
});
|
|
625
|
-
}
|
|
626
|
-
|
|
627
|
-
// src/components/DragDropProvider.tsx
|
|
628
|
-
import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
629
|
-
function DragDropProvider({ children, maxPreviewItems = 5 }) {
|
|
630
|
-
const [active, setActive] = useState(null);
|
|
631
|
-
const [over, setOver] = useState(null);
|
|
632
|
-
const preview = useRef(null);
|
|
633
|
-
const end = useCallback(() => {
|
|
634
|
-
setActive(null);
|
|
635
|
-
setOver(null);
|
|
636
|
-
}, []);
|
|
637
|
-
useEffect(() => {
|
|
638
|
-
window.addEventListener("dragend", end);
|
|
639
|
-
window.addEventListener("drop", end);
|
|
640
|
-
return () => {
|
|
641
|
-
window.removeEventListener("dragend", end);
|
|
642
|
-
window.removeEventListener("drop", end);
|
|
643
|
-
};
|
|
644
|
-
}, [end]);
|
|
645
|
-
const start = (event, item, effect) => {
|
|
646
|
-
event.dataTransfer.effectAllowed = effect;
|
|
647
|
-
event.dataTransfer.setData(item.type, JSON.stringify(item.data) ?? "null");
|
|
648
|
-
event.dataTransfer.setData("text/plain", item.labels.join(`
|
|
649
|
-
`));
|
|
650
|
-
flushSync(() => {
|
|
651
|
-
setActive(item);
|
|
652
|
-
setOver(null);
|
|
653
|
-
});
|
|
654
|
-
if (preview.current)
|
|
655
|
-
event.dataTransfer.setDragImage(preview.current, 12, 12);
|
|
656
|
-
};
|
|
657
|
-
const enter = (next) => setOver((current) => current?.id === next.id && current.type === next.type && current.isAlt === next.isAlt && current.effect === next.effect ? current : next);
|
|
658
|
-
const leave = (id) => setOver((current) => current?.id === id ? null : current);
|
|
659
|
-
return /* @__PURE__ */ jsxs4(DragDropContext, {
|
|
660
|
-
value: { active, over, start, end, enter, leave },
|
|
661
|
-
children: [
|
|
662
|
-
children,
|
|
663
|
-
/* @__PURE__ */ jsx6("div", {
|
|
664
|
-
ref: preview,
|
|
665
|
-
"aria-hidden": "true",
|
|
666
|
-
className: "pointer-events-none fixed -left-[10000px] top-0 w-max",
|
|
667
|
-
children: /* @__PURE__ */ jsx6(DragDropPreview, {
|
|
668
|
-
labels: active?.labels ?? [],
|
|
669
|
-
maxItems: maxPreviewItems
|
|
670
|
-
})
|
|
671
|
-
}),
|
|
672
|
-
/* @__PURE__ */ jsx6("span", {
|
|
673
|
-
role: "status",
|
|
674
|
-
"aria-label": "Drag status",
|
|
675
|
-
className: "sr-only",
|
|
676
|
-
children: active && `${active.labels.length} ${active.labels.length === 1 ? "item" : "items"} being dragged`
|
|
677
|
-
})
|
|
678
|
-
]
|
|
679
|
-
});
|
|
680
|
-
}
|
|
681
|
-
// src/components/DragSource.tsx
|
|
682
|
-
import { useRender as useRender2 } from "@base-ui/react/use-render";
|
|
683
|
-
import { mergeProps as mergeProps2 } from "@base-ui/react/merge-props";
|
|
684
|
-
|
|
685
|
-
// src/hooks/useDragSource.ts
|
|
686
|
-
import { useId } from "react";
|
|
687
|
-
|
|
688
|
-
// src/hooks/useDragDrop.ts
|
|
689
|
-
import { useContext } from "react";
|
|
690
|
-
function useDragDrop() {
|
|
691
|
-
const context = useContext(DragDropContext);
|
|
692
|
-
if (!context)
|
|
693
|
-
throw new Error("Drag and drop requires DragDropProvider.");
|
|
694
|
-
return context;
|
|
695
|
-
}
|
|
696
|
-
|
|
697
|
-
// src/hooks/useDragSource.ts
|
|
698
|
-
function useDragSource({
|
|
699
|
-
type,
|
|
700
|
-
data,
|
|
701
|
-
labels,
|
|
702
|
-
effectAllowed = "copyMove",
|
|
703
|
-
disabled = false
|
|
704
|
-
}) {
|
|
705
|
-
const { active, start, end } = useDragDrop();
|
|
706
|
-
const sourceId = useId();
|
|
707
|
-
return {
|
|
708
|
-
isDragging: active?.sourceId === sourceId,
|
|
709
|
-
props: {
|
|
710
|
-
draggable: !disabled,
|
|
711
|
-
onDragStart: (event) => {
|
|
712
|
-
if (event.defaultPrevented)
|
|
713
|
-
return;
|
|
714
|
-
event.stopPropagation();
|
|
715
|
-
if (disabled || labels.length === 0) {
|
|
716
|
-
event.preventDefault();
|
|
717
|
-
return;
|
|
718
|
-
}
|
|
719
|
-
start(event, { sourceId, type, data, labels }, effectAllowed);
|
|
720
|
-
},
|
|
721
|
-
onDragEnd: end
|
|
722
|
-
}
|
|
723
|
-
};
|
|
724
|
-
}
|
|
725
|
-
|
|
726
|
-
// src/components/DragSource.tsx
|
|
727
|
-
function DragSource({
|
|
728
|
-
type,
|
|
729
|
-
data,
|
|
730
|
-
labels,
|
|
731
|
-
effectAllowed,
|
|
732
|
-
disabled,
|
|
733
|
-
render,
|
|
734
|
-
...props
|
|
735
|
-
}) {
|
|
736
|
-
const source = useDragSource({ type, data, labels, effectAllowed, disabled });
|
|
737
|
-
return useRender2({
|
|
738
|
-
defaultTagName: "div",
|
|
739
|
-
render,
|
|
740
|
-
props: mergeProps2(props, source.props),
|
|
741
|
-
state: { slot: "drag-source", dragging: source.isDragging }
|
|
742
|
-
});
|
|
743
|
-
}
|
|
744
|
-
// src/components/DropTarget.tsx
|
|
745
|
-
import { useRender as useRender3 } from "@base-ui/react/use-render";
|
|
746
|
-
import { mergeProps as mergeProps3 } from "@base-ui/react/merge-props";
|
|
747
|
-
|
|
748
|
-
// src/hooks/useDropTarget.ts
|
|
749
|
-
import { useId as useId2, useState as useState2 } from "react";
|
|
750
|
-
function useDropTarget({ accept, canDrop, getDropEffect, onDrop }) {
|
|
751
|
-
const { active, over, enter, leave, end } = useDragDrop();
|
|
752
|
-
const id = useId2();
|
|
753
|
-
const [feedback, setFeedback] = useState2(null);
|
|
754
|
-
return {
|
|
755
|
-
feedback,
|
|
756
|
-
type: over?.id === id ? over.type : null,
|
|
757
|
-
isOver: over?.id === id,
|
|
758
|
-
isAlt: over?.id === id && over.isAlt,
|
|
759
|
-
effect: over?.id === id ? over.effect : "none",
|
|
760
|
-
props: {
|
|
761
|
-
onDragOver: (event) => {
|
|
762
|
-
const type = accept.find((type) => event.dataTransfer.types.includes(type));
|
|
763
|
-
if (!type)
|
|
764
|
-
return;
|
|
765
|
-
event.stopPropagation();
|
|
766
|
-
const item = active?.type === type ? active : null;
|
|
767
|
-
const effect = item && canDrop && !canDrop(item) ? "none" : getDropEffect?.(item, event) ?? "move";
|
|
768
|
-
event.dataTransfer.dropEffect = effect;
|
|
769
|
-
if (effect === "none") {
|
|
770
|
-
leave(id);
|
|
771
|
-
return;
|
|
772
|
-
}
|
|
773
|
-
event.preventDefault();
|
|
774
|
-
setFeedback((current) => current?.type === type && current.isAlt === event.altKey && current.effect === effect ? current : { type, isAlt: event.altKey, effect });
|
|
775
|
-
enter({ id, type, isAlt: event.altKey, effect });
|
|
776
|
-
},
|
|
777
|
-
onDragLeave: (event) => {
|
|
778
|
-
if (!(event.relatedTarget instanceof Node) || !event.currentTarget.contains(event.relatedTarget))
|
|
779
|
-
leave(id);
|
|
780
|
-
},
|
|
781
|
-
onDrop: (event) => {
|
|
782
|
-
const type = accept.find((type) => event.dataTransfer.types.includes(type));
|
|
783
|
-
if (!type)
|
|
784
|
-
return;
|
|
785
|
-
event.stopPropagation();
|
|
786
|
-
event.preventDefault();
|
|
787
|
-
const raw = event.dataTransfer.getData(type);
|
|
788
|
-
let data;
|
|
789
|
-
try {
|
|
790
|
-
data = JSON.parse(raw);
|
|
791
|
-
} catch {
|
|
792
|
-
data = raw;
|
|
793
|
-
}
|
|
794
|
-
const item = { type, data, labels: active?.labels ?? [] };
|
|
795
|
-
leave(id);
|
|
796
|
-
end();
|
|
797
|
-
if (!canDrop || canDrop(item))
|
|
798
|
-
onDrop(item, event);
|
|
799
|
-
}
|
|
800
|
-
}
|
|
801
|
-
};
|
|
802
|
-
}
|
|
803
|
-
|
|
804
|
-
// src/components/DropTarget.tsx
|
|
805
|
-
function DropTarget({
|
|
806
|
-
accept,
|
|
807
|
-
canDrop,
|
|
808
|
-
getDropEffect,
|
|
809
|
-
onDrop,
|
|
810
|
-
render,
|
|
811
|
-
...props
|
|
812
|
-
}) {
|
|
813
|
-
const target = useDropTarget({ accept, canDrop, getDropEffect, onDrop });
|
|
814
|
-
return useRender3({
|
|
815
|
-
defaultTagName: "div",
|
|
816
|
-
render,
|
|
817
|
-
props: mergeProps3(props, target.props),
|
|
818
|
-
state: { slot: "drop-target", over: target.isOver, effect: target.effect }
|
|
819
|
-
});
|
|
820
|
-
}
|
|
821
575
|
// src/components/EmptyState.tsx
|
|
822
|
-
import { jsx as
|
|
576
|
+
import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
823
577
|
function EmptyState({ title, description, children }) {
|
|
824
|
-
return /* @__PURE__ */
|
|
578
|
+
return /* @__PURE__ */ jsxs3(Empty2, {
|
|
825
579
|
children: [
|
|
826
|
-
/* @__PURE__ */
|
|
580
|
+
/* @__PURE__ */ jsxs3(EmptyHeader2, {
|
|
827
581
|
children: [
|
|
828
|
-
/* @__PURE__ */
|
|
582
|
+
/* @__PURE__ */ jsx4(EmptyTitle2, {
|
|
829
583
|
children: title
|
|
830
584
|
}),
|
|
831
|
-
/* @__PURE__ */
|
|
585
|
+
/* @__PURE__ */ jsx4(EmptyDescription2, {
|
|
832
586
|
children: description
|
|
833
587
|
})
|
|
834
588
|
]
|
|
835
589
|
}),
|
|
836
|
-
children && /* @__PURE__ */
|
|
590
|
+
children && /* @__PURE__ */ jsx4(EmptyContent2, {
|
|
837
591
|
children
|
|
838
592
|
})
|
|
839
593
|
]
|
|
840
594
|
});
|
|
841
595
|
}
|
|
842
596
|
// src/components/PageMessage.tsx
|
|
843
|
-
import { useId
|
|
844
|
-
import { jsx as
|
|
597
|
+
import { useId } from "react";
|
|
598
|
+
import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
845
599
|
function PageMessage({ title, description, children }) {
|
|
846
|
-
const titleId =
|
|
847
|
-
const descriptionId =
|
|
848
|
-
return /* @__PURE__ */
|
|
600
|
+
const titleId = useId();
|
|
601
|
+
const descriptionId = useId();
|
|
602
|
+
return /* @__PURE__ */ jsx5("main", {
|
|
849
603
|
"aria-labelledby": titleId,
|
|
850
604
|
"aria-describedby": description == null ? undefined : descriptionId,
|
|
851
605
|
className: "grid min-h-dvh w-full place-items-center bg-background text-foreground",
|
|
852
|
-
children: /* @__PURE__ */
|
|
606
|
+
children: /* @__PURE__ */ jsxs4(Empty2, {
|
|
853
607
|
children: [
|
|
854
|
-
/* @__PURE__ */
|
|
608
|
+
/* @__PURE__ */ jsxs4(EmptyHeader2, {
|
|
855
609
|
children: [
|
|
856
|
-
/* @__PURE__ */
|
|
857
|
-
children: /* @__PURE__ */
|
|
610
|
+
/* @__PURE__ */ jsx5(EmptyTitle2, {
|
|
611
|
+
children: /* @__PURE__ */ jsx5("h1", {
|
|
858
612
|
id: titleId,
|
|
859
613
|
children: title
|
|
860
614
|
})
|
|
861
615
|
}),
|
|
862
|
-
description != null && /* @__PURE__ */
|
|
616
|
+
description != null && /* @__PURE__ */ jsx5(EmptyDescription2, {
|
|
863
617
|
id: descriptionId,
|
|
864
618
|
children: description
|
|
865
619
|
})
|
|
866
620
|
]
|
|
867
621
|
}),
|
|
868
|
-
children != null && /* @__PURE__ */
|
|
622
|
+
children != null && /* @__PURE__ */ jsx5(EmptyContent2, {
|
|
869
623
|
children
|
|
870
624
|
})
|
|
871
625
|
]
|
|
@@ -873,9 +627,9 @@ function PageMessage({ title, description, children }) {
|
|
|
873
627
|
});
|
|
874
628
|
}
|
|
875
629
|
// src/components/JsonViewer.tsx
|
|
876
|
-
import { jsx as
|
|
630
|
+
import { jsx as jsx6 } from "react/jsx-runtime";
|
|
877
631
|
function JsonViewer({ value, label = "JSON", rows = 12 }) {
|
|
878
|
-
return /* @__PURE__ */
|
|
632
|
+
return /* @__PURE__ */ jsx6(Textarea2, {
|
|
879
633
|
readOnly: true,
|
|
880
634
|
rows,
|
|
881
635
|
"aria-label": label,
|
|
@@ -885,16 +639,16 @@ function JsonViewer({ value, label = "JSON", rows = 12 }) {
|
|
|
885
639
|
// src/components/AlertDialog.tsx
|
|
886
640
|
import { AlertDialog as AlertDialogPrimitive } from "@base-ui/react/alert-dialog";
|
|
887
641
|
import { useDirection as useDirection3 } from "@base-ui/react/direction-provider";
|
|
888
|
-
import { jsx as
|
|
642
|
+
import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
889
643
|
"use client";
|
|
890
644
|
function AlertDialog({ ...props }) {
|
|
891
|
-
return /* @__PURE__ */
|
|
645
|
+
return /* @__PURE__ */ jsx7(AlertDialogPrimitive.Root, {
|
|
892
646
|
"data-slot": "alert-dialog",
|
|
893
647
|
...props
|
|
894
648
|
});
|
|
895
649
|
}
|
|
896
650
|
function AlertDialogTrigger({ ...props }) {
|
|
897
|
-
return /* @__PURE__ */
|
|
651
|
+
return /* @__PURE__ */ jsx7(AlertDialogPrimitive.Trigger, {
|
|
898
652
|
"data-slot": "alert-dialog-trigger",
|
|
899
653
|
...props
|
|
900
654
|
});
|
|
@@ -902,12 +656,12 @@ function AlertDialogTrigger({ ...props }) {
|
|
|
902
656
|
function AlertDialogPortal({ container, ref, children, ...props }) {
|
|
903
657
|
const resolvedContainer = usePortalContainer2(container);
|
|
904
658
|
const portal = usePortalNode(ref);
|
|
905
|
-
return /* @__PURE__ */
|
|
659
|
+
return /* @__PURE__ */ jsx7(AlertDialogPrimitive.Portal, {
|
|
906
660
|
"data-slot": "alert-dialog-portal",
|
|
907
661
|
container: resolvedContainer,
|
|
908
662
|
ref: portal.ref,
|
|
909
663
|
...props,
|
|
910
|
-
children: /* @__PURE__ */
|
|
664
|
+
children: /* @__PURE__ */ jsx7(PortalProvider2, {
|
|
911
665
|
container: portal.node,
|
|
912
666
|
children
|
|
913
667
|
})
|
|
@@ -915,7 +669,7 @@ function AlertDialogPortal({ container, ref, children, ...props }) {
|
|
|
915
669
|
}
|
|
916
670
|
function AlertDialogOverlay({ density, className, ...props }) {
|
|
917
671
|
const resolvedDensity = useDensity(density);
|
|
918
|
-
return /* @__PURE__ */
|
|
672
|
+
return /* @__PURE__ */ jsx7(AlertDialogPrimitive.Backdrop, {
|
|
919
673
|
"data-density": resolvedDensity,
|
|
920
674
|
"data-slot": "alert-dialog-overlay",
|
|
921
675
|
className: (state) => cn2("fixed inset-0 isolate bg-backdrop duration-120 data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0 motion-reduce:data-open:animate-none motion-reduce:data-closed:animate-none", typeof className === "function" ? className(state) : className),
|
|
@@ -925,10 +679,10 @@ function AlertDialogOverlay({ density, className, ...props }) {
|
|
|
925
679
|
function AlertDialogContent({ density, className, size = "default", ...props }) {
|
|
926
680
|
const resolvedDensity = useDensity(density);
|
|
927
681
|
const direction = useDirection3();
|
|
928
|
-
return /* @__PURE__ */
|
|
682
|
+
return /* @__PURE__ */ jsxs5(AlertDialogPortal, {
|
|
929
683
|
children: [
|
|
930
|
-
/* @__PURE__ */
|
|
931
|
-
/* @__PURE__ */
|
|
684
|
+
/* @__PURE__ */ jsx7(AlertDialogOverlay, {}),
|
|
685
|
+
/* @__PURE__ */ jsx7(AlertDialogPrimitive.Popup, {
|
|
932
686
|
dir: direction,
|
|
933
687
|
"data-density": resolvedDensity,
|
|
934
688
|
"data-slot": "alert-dialog-content",
|
|
@@ -941,7 +695,7 @@ function AlertDialogContent({ density, className, size = "default", ...props })
|
|
|
941
695
|
});
|
|
942
696
|
}
|
|
943
697
|
function AlertDialogHeader({ density, className, ...props }) {
|
|
944
|
-
return /* @__PURE__ */
|
|
698
|
+
return /* @__PURE__ */ jsx7("div", {
|
|
945
699
|
"data-density": density,
|
|
946
700
|
"data-slot": "alert-dialog-header",
|
|
947
701
|
className: cn2("grid grid-rows-[auto_1fr] place-items-center gap-control-gap text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-4 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-start sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]", className),
|
|
@@ -949,7 +703,7 @@ function AlertDialogHeader({ density, className, ...props }) {
|
|
|
949
703
|
});
|
|
950
704
|
}
|
|
951
705
|
function AlertDialogFooter({ density, className, ...props }) {
|
|
952
|
-
return /* @__PURE__ */
|
|
706
|
+
return /* @__PURE__ */ jsx7("div", {
|
|
953
707
|
"data-density": density,
|
|
954
708
|
"data-slot": "alert-dialog-footer",
|
|
955
709
|
className: cn2("-mx-panel -mb-panel flex flex-col-reverse gap-2 rounded-b-md border-t bg-muted/50 p-panel group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end", className),
|
|
@@ -957,7 +711,7 @@ function AlertDialogFooter({ density, className, ...props }) {
|
|
|
957
711
|
});
|
|
958
712
|
}
|
|
959
713
|
function AlertDialogMedia({ density, className, ...props }) {
|
|
960
|
-
return /* @__PURE__ */
|
|
714
|
+
return /* @__PURE__ */ jsx7("div", {
|
|
961
715
|
"data-density": density,
|
|
962
716
|
"data-slot": "alert-dialog-media",
|
|
963
717
|
className: cn2("mb-2 inline-flex size-10 items-center justify-center rounded-md bg-muted sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-control-xs", className),
|
|
@@ -965,7 +719,7 @@ function AlertDialogMedia({ density, className, ...props }) {
|
|
|
965
719
|
});
|
|
966
720
|
}
|
|
967
721
|
function AlertDialogTitle({ density, className, ...props }) {
|
|
968
|
-
return /* @__PURE__ */
|
|
722
|
+
return /* @__PURE__ */ jsx7(AlertDialogPrimitive.Title, {
|
|
969
723
|
"data-density": density,
|
|
970
724
|
"data-slot": "alert-dialog-title",
|
|
971
725
|
className: (state) => cn2("text-base font-medium sm:group-data-[size=default]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2", typeof className === "function" ? className(state) : className),
|
|
@@ -973,7 +727,7 @@ function AlertDialogTitle({ density, className, ...props }) {
|
|
|
973
727
|
});
|
|
974
728
|
}
|
|
975
729
|
function AlertDialogDescription({ density, className, ...props }) {
|
|
976
|
-
return /* @__PURE__ */
|
|
730
|
+
return /* @__PURE__ */ jsx7(AlertDialogPrimitive.Description, {
|
|
977
731
|
"data-density": density,
|
|
978
732
|
"data-slot": "alert-dialog-description",
|
|
979
733
|
className: (state) => cn2("text-sm text-balance text-muted-foreground md:text-pretty *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground", typeof className === "function" ? className(state) : className),
|
|
@@ -981,7 +735,7 @@ function AlertDialogDescription({ density, className, ...props }) {
|
|
|
981
735
|
});
|
|
982
736
|
}
|
|
983
737
|
function AlertDialogAction({ density, className, ...props }) {
|
|
984
|
-
return /* @__PURE__ */
|
|
738
|
+
return /* @__PURE__ */ jsx7(Button2, {
|
|
985
739
|
"data-density": density,
|
|
986
740
|
"data-slot": "alert-dialog-action",
|
|
987
741
|
className,
|
|
@@ -995,11 +749,11 @@ function AlertDialogCancel({
|
|
|
995
749
|
size = "default",
|
|
996
750
|
...props
|
|
997
751
|
}) {
|
|
998
|
-
return /* @__PURE__ */
|
|
752
|
+
return /* @__PURE__ */ jsx7(AlertDialogPrimitive.Close, {
|
|
999
753
|
"data-density": density,
|
|
1000
754
|
"data-slot": "alert-dialog-cancel",
|
|
1001
755
|
className,
|
|
1002
|
-
render: /* @__PURE__ */
|
|
756
|
+
render: /* @__PURE__ */ jsx7(Button2, {
|
|
1003
757
|
variant,
|
|
1004
758
|
size
|
|
1005
759
|
}),
|
|
@@ -1010,11 +764,11 @@ function AlertDialogCancel({
|
|
|
1010
764
|
import { Select as SelectPrimitive } from "@base-ui/react/select";
|
|
1011
765
|
import { useDirection as useDirection4 } from "@base-ui/react/direction-provider";
|
|
1012
766
|
import { ChevronDownIcon as ChevronDownIcon3, CheckIcon as CheckIcon2, ChevronUpIcon as ChevronUpIcon2 } from "lucide-react";
|
|
1013
|
-
import { jsx as
|
|
767
|
+
import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
1014
768
|
"use client";
|
|
1015
769
|
var Select = SelectPrimitive.Root;
|
|
1016
770
|
function SelectGroup({ density, className, ...props }) {
|
|
1017
|
-
return /* @__PURE__ */
|
|
771
|
+
return /* @__PURE__ */ jsx8(SelectPrimitive.Group, {
|
|
1018
772
|
"data-density": density,
|
|
1019
773
|
"data-slot": "select-group",
|
|
1020
774
|
className: (state) => cn2("scroll-my-1 p-1", typeof className === "function" ? className(state) : className),
|
|
@@ -1022,7 +776,7 @@ function SelectGroup({ density, className, ...props }) {
|
|
|
1022
776
|
});
|
|
1023
777
|
}
|
|
1024
778
|
function SelectValue({ density, className, ...props }) {
|
|
1025
|
-
return /* @__PURE__ */
|
|
779
|
+
return /* @__PURE__ */ jsx8(SelectPrimitive.Value, {
|
|
1026
780
|
"data-density": density,
|
|
1027
781
|
"data-slot": "select-value",
|
|
1028
782
|
className: (state) => cn2("flex flex-1 text-start", typeof className === "function" ? className(state) : className),
|
|
@@ -1030,7 +784,7 @@ function SelectValue({ density, className, ...props }) {
|
|
|
1030
784
|
});
|
|
1031
785
|
}
|
|
1032
786
|
function SelectTrigger({ density, className, size = "default", children, ...props }) {
|
|
1033
|
-
return /* @__PURE__ */
|
|
787
|
+
return /* @__PURE__ */ jsxs6(SelectPrimitive.Trigger, {
|
|
1034
788
|
"data-density": density,
|
|
1035
789
|
"data-slot": "select-trigger",
|
|
1036
790
|
"data-size": size,
|
|
@@ -1038,8 +792,8 @@ function SelectTrigger({ density, className, size = "default", children, ...prop
|
|
|
1038
792
|
...props,
|
|
1039
793
|
children: [
|
|
1040
794
|
children,
|
|
1041
|
-
/* @__PURE__ */
|
|
1042
|
-
render: /* @__PURE__ */
|
|
795
|
+
/* @__PURE__ */ jsx8(SelectPrimitive.Icon, {
|
|
796
|
+
render: /* @__PURE__ */ jsx8(ChevronDownIcon3, {
|
|
1043
797
|
className: "pointer-events-none size-4 text-muted-foreground"
|
|
1044
798
|
})
|
|
1045
799
|
})
|
|
@@ -1061,19 +815,19 @@ function SelectContent({
|
|
|
1061
815
|
const direction = useDirection4();
|
|
1062
816
|
const container = usePortalContainer2();
|
|
1063
817
|
const portal = usePortalNode();
|
|
1064
|
-
return /* @__PURE__ */
|
|
818
|
+
return /* @__PURE__ */ jsx8(SelectPrimitive.Portal, {
|
|
1065
819
|
container,
|
|
1066
820
|
ref: portal.ref,
|
|
1067
|
-
children: /* @__PURE__ */
|
|
821
|
+
children: /* @__PURE__ */ jsx8(PortalProvider2, {
|
|
1068
822
|
container: portal.node,
|
|
1069
|
-
children: /* @__PURE__ */
|
|
823
|
+
children: /* @__PURE__ */ jsx8(SelectPrimitive.Positioner, {
|
|
1070
824
|
side,
|
|
1071
825
|
sideOffset,
|
|
1072
826
|
align,
|
|
1073
827
|
alignOffset,
|
|
1074
828
|
alignItemWithTrigger,
|
|
1075
829
|
className: "isolate ",
|
|
1076
|
-
children: /* @__PURE__ */
|
|
830
|
+
children: /* @__PURE__ */ jsxs6(SelectPrimitive.Popup, {
|
|
1077
831
|
dir: direction,
|
|
1078
832
|
"data-density": resolvedDensity,
|
|
1079
833
|
"data-slot": "select-content",
|
|
@@ -1081,11 +835,11 @@ function SelectContent({
|
|
|
1081
835
|
className: (state) => cn2("relative isolate max-h-(--available-height) w-(--anchor-width) min-w-36 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-md bg-popover text-popover-foreground border border-frame-edge shadow-frame duration-120 data-[align-trigger=true]:animate-none data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0 motion-reduce:animate-none", typeof className === "function" ? className(state) : className),
|
|
1082
836
|
...props,
|
|
1083
837
|
children: [
|
|
1084
|
-
/* @__PURE__ */
|
|
1085
|
-
/* @__PURE__ */
|
|
838
|
+
/* @__PURE__ */ jsx8(SelectScrollUpButton, {}),
|
|
839
|
+
/* @__PURE__ */ jsx8(SelectPrimitive.List, {
|
|
1086
840
|
children
|
|
1087
841
|
}),
|
|
1088
|
-
/* @__PURE__ */
|
|
842
|
+
/* @__PURE__ */ jsx8(SelectScrollDownButton, {})
|
|
1089
843
|
]
|
|
1090
844
|
})
|
|
1091
845
|
})
|
|
@@ -1093,7 +847,7 @@ function SelectContent({
|
|
|
1093
847
|
});
|
|
1094
848
|
}
|
|
1095
849
|
function SelectLabel({ density, className, ...props }) {
|
|
1096
|
-
return /* @__PURE__ */
|
|
850
|
+
return /* @__PURE__ */ jsx8(SelectPrimitive.GroupLabel, {
|
|
1097
851
|
"data-density": density,
|
|
1098
852
|
"data-slot": "select-label",
|
|
1099
853
|
className: (state) => cn2("px-1.5 py-1 text-xs text-muted-foreground", typeof className === "function" ? className(state) : className),
|
|
@@ -1101,21 +855,21 @@ function SelectLabel({ density, className, ...props }) {
|
|
|
1101
855
|
});
|
|
1102
856
|
}
|
|
1103
857
|
function SelectItem({ density, className, children, ...props }) {
|
|
1104
|
-
return /* @__PURE__ */
|
|
858
|
+
return /* @__PURE__ */ jsxs6(SelectPrimitive.Item, {
|
|
1105
859
|
"data-density": density,
|
|
1106
860
|
"data-slot": "select-item",
|
|
1107
861
|
className: (state) => cn2("relative flex w-full cursor-default items-center gap-control-gap rounded-md py-1 pe-8 ps-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2", typeof className === "function" ? className(state) : className),
|
|
1108
862
|
...props,
|
|
1109
863
|
children: [
|
|
1110
|
-
/* @__PURE__ */
|
|
864
|
+
/* @__PURE__ */ jsx8(SelectPrimitive.ItemText, {
|
|
1111
865
|
className: "flex flex-1 shrink-0 gap-2 whitespace-nowrap",
|
|
1112
866
|
children
|
|
1113
867
|
}),
|
|
1114
|
-
/* @__PURE__ */
|
|
1115
|
-
render: /* @__PURE__ */
|
|
868
|
+
/* @__PURE__ */ jsx8(SelectPrimitive.ItemIndicator, {
|
|
869
|
+
render: /* @__PURE__ */ jsx8("span", {
|
|
1116
870
|
className: "pointer-events-none absolute end-2 flex size-4 items-center justify-center"
|
|
1117
871
|
}),
|
|
1118
|
-
children: /* @__PURE__ */
|
|
872
|
+
children: /* @__PURE__ */ jsx8(CheckIcon2, {
|
|
1119
873
|
className: "pointer-events-none"
|
|
1120
874
|
})
|
|
1121
875
|
})
|
|
@@ -1123,7 +877,7 @@ function SelectItem({ density, className, children, ...props }) {
|
|
|
1123
877
|
});
|
|
1124
878
|
}
|
|
1125
879
|
function SelectSeparator({ density, className, ...props }) {
|
|
1126
|
-
return /* @__PURE__ */
|
|
880
|
+
return /* @__PURE__ */ jsx8(SelectPrimitive.Separator, {
|
|
1127
881
|
"data-density": density,
|
|
1128
882
|
"data-slot": "select-separator",
|
|
1129
883
|
className: (state) => cn2("pointer-events-none -mx-1 my-1 h-px bg-border", typeof className === "function" ? className(state) : className),
|
|
@@ -1131,40 +885,40 @@ function SelectSeparator({ density, className, ...props }) {
|
|
|
1131
885
|
});
|
|
1132
886
|
}
|
|
1133
887
|
function SelectScrollUpButton({ density, className, ...props }) {
|
|
1134
|
-
return /* @__PURE__ */
|
|
888
|
+
return /* @__PURE__ */ jsx8(SelectPrimitive.ScrollUpArrow, {
|
|
1135
889
|
"data-density": density,
|
|
1136
890
|
"data-slot": "select-scroll-up-button",
|
|
1137
891
|
className: (state) => cn2("top-0 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
|
|
1138
892
|
...props,
|
|
1139
|
-
children: /* @__PURE__ */
|
|
893
|
+
children: /* @__PURE__ */ jsx8(ChevronUpIcon2, {})
|
|
1140
894
|
});
|
|
1141
895
|
}
|
|
1142
896
|
function SelectScrollDownButton({ density, className, ...props }) {
|
|
1143
|
-
return /* @__PURE__ */
|
|
897
|
+
return /* @__PURE__ */ jsx8(SelectPrimitive.ScrollDownArrow, {
|
|
1144
898
|
"data-density": density,
|
|
1145
899
|
"data-slot": "select-scroll-down-button",
|
|
1146
900
|
className: (state) => cn2("bottom-0 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
|
|
1147
901
|
...props,
|
|
1148
|
-
children: /* @__PURE__ */
|
|
902
|
+
children: /* @__PURE__ */ jsx8(ChevronDownIcon3, {})
|
|
1149
903
|
});
|
|
1150
904
|
}
|
|
1151
905
|
// src/components/DensityProvider.tsx
|
|
1152
|
-
import { mergeProps as
|
|
1153
|
-
import { useRender as
|
|
1154
|
-
import { jsx as
|
|
906
|
+
import { mergeProps as mergeProps2 } from "@base-ui/react/merge-props";
|
|
907
|
+
import { useRender as useRender2 } from "@base-ui/react/use-render";
|
|
908
|
+
import { jsx as jsx9 } from "react/jsx-runtime";
|
|
1155
909
|
function DensityProvider({
|
|
1156
910
|
density = "comfortable",
|
|
1157
911
|
className,
|
|
1158
912
|
render,
|
|
1159
913
|
...props
|
|
1160
914
|
}) {
|
|
1161
|
-
const element =
|
|
915
|
+
const element = useRender2({
|
|
1162
916
|
defaultTagName: "div",
|
|
1163
|
-
props:
|
|
917
|
+
props: mergeProps2({ className: cn2("font-sans text-base leading-(--ag-leading)", className) }, props),
|
|
1164
918
|
render,
|
|
1165
919
|
state: { slot: "density-provider", density }
|
|
1166
920
|
});
|
|
1167
|
-
return /* @__PURE__ */
|
|
921
|
+
return /* @__PURE__ */ jsx9(DensityContext.Provider, {
|
|
1168
922
|
value: density,
|
|
1169
923
|
children: element
|
|
1170
924
|
});
|
|
@@ -1174,7 +928,7 @@ import { useMemo } from "react";
|
|
|
1174
928
|
import { useIsomorphicLayoutEffect, useTernaryDarkMode } from "usehooks-ts";
|
|
1175
929
|
|
|
1176
930
|
// src/components/ScrollGuard.tsx
|
|
1177
|
-
import { useEffect
|
|
931
|
+
import { useEffect } from "react";
|
|
1178
932
|
|
|
1179
933
|
// src/utils/observeScrollGuards.ts
|
|
1180
934
|
function throwViolation(error) {
|
|
@@ -1280,7 +1034,7 @@ function observeScrollGuards(ownerDocument, reportViolation = throwViolation) {
|
|
|
1280
1034
|
"use client";
|
|
1281
1035
|
var registrations = new WeakMap;
|
|
1282
1036
|
function ScrollGuard({ ownerDocument }) {
|
|
1283
|
-
|
|
1037
|
+
useEffect(() => {
|
|
1284
1038
|
if (process.env.NODE_ENV === "production")
|
|
1285
1039
|
return;
|
|
1286
1040
|
const target = ownerDocument ?? document;
|
|
@@ -1302,7 +1056,7 @@ function ScrollGuard({ ownerDocument }) {
|
|
|
1302
1056
|
}
|
|
1303
1057
|
|
|
1304
1058
|
// src/components/ThemeProvider.tsx
|
|
1305
|
-
import { jsx as
|
|
1059
|
+
import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
1306
1060
|
function StoredThemeProvider({
|
|
1307
1061
|
children,
|
|
1308
1062
|
defaultTheme = "system",
|
|
@@ -1313,7 +1067,7 @@ function StoredThemeProvider({
|
|
|
1313
1067
|
defaultValue: defaultTheme,
|
|
1314
1068
|
localStorageKey: storageKey
|
|
1315
1069
|
});
|
|
1316
|
-
return /* @__PURE__ */
|
|
1070
|
+
return /* @__PURE__ */ jsx10(ThemePalette, {
|
|
1317
1071
|
theme: forcedTheme ?? ternaryDarkMode,
|
|
1318
1072
|
resolvedTheme: forcedTheme ?? (isDarkMode ? "dark" : "light"),
|
|
1319
1073
|
setTheme: setTernaryDarkMode,
|
|
@@ -1331,10 +1085,10 @@ function ThemePalette({
|
|
|
1331
1085
|
document.documentElement.style.colorScheme = resolvedTheme;
|
|
1332
1086
|
}, [resolvedTheme]);
|
|
1333
1087
|
const value = useMemo(() => ({ theme, resolvedTheme, setTheme }), [theme, resolvedTheme, setTheme]);
|
|
1334
|
-
return /* @__PURE__ */
|
|
1088
|
+
return /* @__PURE__ */ jsxs7(ThemeContext.Provider, {
|
|
1335
1089
|
value,
|
|
1336
1090
|
children: [
|
|
1337
|
-
/* @__PURE__ */
|
|
1091
|
+
/* @__PURE__ */ jsx10(ScrollGuard, {}),
|
|
1338
1092
|
children
|
|
1339
1093
|
]
|
|
1340
1094
|
});
|
|
@@ -1347,7 +1101,7 @@ function ControlledThemeProvider({
|
|
|
1347
1101
|
const isDark = useMediaQuery("(prefers-color-scheme: dark)");
|
|
1348
1102
|
const { theme, setTheme } = controlledTheme;
|
|
1349
1103
|
const resolvedTheme = forcedTheme ?? (theme === "system" ? isDark ? "dark" : "light" : theme);
|
|
1350
|
-
return /* @__PURE__ */
|
|
1104
|
+
return /* @__PURE__ */ jsx10(ThemePalette, {
|
|
1351
1105
|
theme: forcedTheme ?? theme,
|
|
1352
1106
|
resolvedTheme,
|
|
1353
1107
|
setTheme,
|
|
@@ -1356,23 +1110,23 @@ function ControlledThemeProvider({
|
|
|
1356
1110
|
}
|
|
1357
1111
|
function ThemeProvider(props) {
|
|
1358
1112
|
if (props.controlledTheme)
|
|
1359
|
-
return /* @__PURE__ */
|
|
1113
|
+
return /* @__PURE__ */ jsx10(ControlledThemeProvider, {
|
|
1360
1114
|
...props,
|
|
1361
1115
|
controlledTheme: props.controlledTheme
|
|
1362
1116
|
});
|
|
1363
|
-
return /* @__PURE__ */
|
|
1117
|
+
return /* @__PURE__ */ jsx10(StoredThemeProvider, {
|
|
1364
1118
|
...props
|
|
1365
1119
|
});
|
|
1366
1120
|
}
|
|
1367
1121
|
// src/hooks/useComboboxAnchor.ts
|
|
1368
|
-
import { useRef
|
|
1122
|
+
import { useRef } from "react";
|
|
1369
1123
|
function useComboboxAnchor() {
|
|
1370
|
-
return
|
|
1124
|
+
return useRef(null);
|
|
1371
1125
|
}
|
|
1372
1126
|
// src/components/AspectRatio.tsx
|
|
1373
|
-
import { jsx as
|
|
1127
|
+
import { jsx as jsx11 } from "react/jsx-runtime";
|
|
1374
1128
|
function AspectRatio({ ratio, className, style, ...props }) {
|
|
1375
|
-
return /* @__PURE__ */
|
|
1129
|
+
return /* @__PURE__ */ jsx11("div", {
|
|
1376
1130
|
"data-slot": "aspect-ratio",
|
|
1377
1131
|
className: cn2("relative", className),
|
|
1378
1132
|
style: { aspectRatio: ratio, ...style },
|
|
@@ -1381,11 +1135,11 @@ function AspectRatio({ ratio, className, style, ...props }) {
|
|
|
1381
1135
|
}
|
|
1382
1136
|
// src/components/Breadcrumb.tsx
|
|
1383
1137
|
import { ChevronRightIcon, MoreHorizontalIcon } from "lucide-react";
|
|
1384
|
-
import { mergeProps as
|
|
1385
|
-
import { useRender as
|
|
1386
|
-
import { jsx as
|
|
1138
|
+
import { mergeProps as mergeProps3 } from "@base-ui/react/merge-props";
|
|
1139
|
+
import { useRender as useRender3 } from "@base-ui/react/use-render";
|
|
1140
|
+
import { jsx as jsx12, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
1387
1141
|
function Breadcrumb({ density, className, ...props }) {
|
|
1388
|
-
return /* @__PURE__ */
|
|
1142
|
+
return /* @__PURE__ */ jsx12("nav", {
|
|
1389
1143
|
"aria-label": "breadcrumb",
|
|
1390
1144
|
"data-density": density,
|
|
1391
1145
|
"data-slot": "breadcrumb",
|
|
@@ -1394,7 +1148,7 @@ function Breadcrumb({ density, className, ...props }) {
|
|
|
1394
1148
|
});
|
|
1395
1149
|
}
|
|
1396
1150
|
function BreadcrumbList({ density, className, ...props }) {
|
|
1397
|
-
return /* @__PURE__ */
|
|
1151
|
+
return /* @__PURE__ */ jsx12("ol", {
|
|
1398
1152
|
"data-density": density,
|
|
1399
1153
|
"data-slot": "breadcrumb-list",
|
|
1400
1154
|
className: cn2("flex flex-wrap items-center gap-control-gap text-sm wrap-break-word text-muted-foreground", className),
|
|
@@ -1402,7 +1156,7 @@ function BreadcrumbList({ density, className, ...props }) {
|
|
|
1402
1156
|
});
|
|
1403
1157
|
}
|
|
1404
1158
|
function BreadcrumbItem({ density, className, ...props }) {
|
|
1405
|
-
return /* @__PURE__ */
|
|
1159
|
+
return /* @__PURE__ */ jsx12("li", {
|
|
1406
1160
|
"data-density": density,
|
|
1407
1161
|
"data-slot": "breadcrumb-item",
|
|
1408
1162
|
className: cn2("inline-flex items-center gap-1", className),
|
|
@@ -1410,9 +1164,9 @@ function BreadcrumbItem({ density, className, ...props }) {
|
|
|
1410
1164
|
});
|
|
1411
1165
|
}
|
|
1412
1166
|
function BreadcrumbLink({ density, className, render, ...props }) {
|
|
1413
|
-
return
|
|
1167
|
+
return useRender3({
|
|
1414
1168
|
defaultTagName: "a",
|
|
1415
|
-
props:
|
|
1169
|
+
props: mergeProps3({
|
|
1416
1170
|
className: cn2("transition-colors hover:text-foreground", className)
|
|
1417
1171
|
}, props),
|
|
1418
1172
|
render,
|
|
@@ -1423,7 +1177,7 @@ function BreadcrumbLink({ density, className, render, ...props }) {
|
|
|
1423
1177
|
});
|
|
1424
1178
|
}
|
|
1425
1179
|
function BreadcrumbPage({ density, className, ...props }) {
|
|
1426
|
-
return /* @__PURE__ */
|
|
1180
|
+
return /* @__PURE__ */ jsx12("span", {
|
|
1427
1181
|
"data-density": density,
|
|
1428
1182
|
"data-slot": "breadcrumb-page",
|
|
1429
1183
|
role: "link",
|
|
@@ -1434,20 +1188,20 @@ function BreadcrumbPage({ density, className, ...props }) {
|
|
|
1434
1188
|
});
|
|
1435
1189
|
}
|
|
1436
1190
|
function BreadcrumbSeparator({ density, children, className, ...props }) {
|
|
1437
|
-
return /* @__PURE__ */
|
|
1191
|
+
return /* @__PURE__ */ jsx12("li", {
|
|
1438
1192
|
"data-density": density,
|
|
1439
1193
|
"data-slot": "breadcrumb-separator",
|
|
1440
1194
|
role: "presentation",
|
|
1441
1195
|
"aria-hidden": "true",
|
|
1442
1196
|
className: cn2("[&>svg]:size-3.5", className),
|
|
1443
1197
|
...props,
|
|
1444
|
-
children: children ?? /* @__PURE__ */
|
|
1198
|
+
children: children ?? /* @__PURE__ */ jsx12(ChevronRightIcon, {
|
|
1445
1199
|
className: "rtl:rotate-180"
|
|
1446
1200
|
})
|
|
1447
1201
|
});
|
|
1448
1202
|
}
|
|
1449
1203
|
function BreadcrumbEllipsis({ density, className, ...props }) {
|
|
1450
|
-
return /* @__PURE__ */
|
|
1204
|
+
return /* @__PURE__ */ jsxs8("span", {
|
|
1451
1205
|
"data-density": density,
|
|
1452
1206
|
"data-slot": "breadcrumb-ellipsis",
|
|
1453
1207
|
role: "presentation",
|
|
@@ -1455,8 +1209,8 @@ function BreadcrumbEllipsis({ density, className, ...props }) {
|
|
|
1455
1209
|
className: cn2("flex size-5 items-center justify-center [&>svg]:size-4", className),
|
|
1456
1210
|
...props,
|
|
1457
1211
|
children: [
|
|
1458
|
-
/* @__PURE__ */
|
|
1459
|
-
/* @__PURE__ */
|
|
1212
|
+
/* @__PURE__ */ jsx12(MoreHorizontalIcon, {}),
|
|
1213
|
+
/* @__PURE__ */ jsx12("span", {
|
|
1460
1214
|
className: "sr-only",
|
|
1461
1215
|
children: "More"
|
|
1462
1216
|
})
|
|
@@ -1464,11 +1218,11 @@ function BreadcrumbEllipsis({ density, className, ...props }) {
|
|
|
1464
1218
|
});
|
|
1465
1219
|
}
|
|
1466
1220
|
// src/components/ButtonGroup.tsx
|
|
1467
|
-
import { mergeProps as
|
|
1468
|
-
import { useRender as
|
|
1469
|
-
import { cva
|
|
1470
|
-
import { jsx as
|
|
1471
|
-
var buttonGroupVariants =
|
|
1221
|
+
import { mergeProps as mergeProps4 } from "@base-ui/react/merge-props";
|
|
1222
|
+
import { useRender as useRender4 } from "@base-ui/react/use-render";
|
|
1223
|
+
import { cva } from "class-variance-authority";
|
|
1224
|
+
import { jsx as jsx13 } from "react/jsx-runtime";
|
|
1225
|
+
var buttonGroupVariants = cva("flex w-fit items-stretch *:focus-visible:relative *:focus-visible:z-10 has-[>[data-slot=button-group]]:gap-2 has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-e-sm [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1", {
|
|
1472
1226
|
variants: {
|
|
1473
1227
|
orientation: {
|
|
1474
1228
|
horizontal: "*:data-slot:rounded-e-none [&>[data-slot]:not(:has(~[data-slot]))]:rounded-e-sm! [&>[data-slot]~[data-slot]]:rounded-s-none [&>[data-slot]~[data-slot]]:border-s-0",
|
|
@@ -1480,7 +1234,7 @@ var buttonGroupVariants = cva2("flex w-fit items-stretch *:focus-visible:relativ
|
|
|
1480
1234
|
}
|
|
1481
1235
|
});
|
|
1482
1236
|
function ButtonGroup({ density, className, orientation, ...props }) {
|
|
1483
|
-
return /* @__PURE__ */
|
|
1237
|
+
return /* @__PURE__ */ jsx13("div", {
|
|
1484
1238
|
role: "group",
|
|
1485
1239
|
"data-density": density,
|
|
1486
1240
|
"data-slot": "button-group",
|
|
@@ -1490,9 +1244,9 @@ function ButtonGroup({ density, className, orientation, ...props }) {
|
|
|
1490
1244
|
});
|
|
1491
1245
|
}
|
|
1492
1246
|
function ButtonGroupText({ density, className, render, ...props }) {
|
|
1493
|
-
return
|
|
1247
|
+
return useRender4({
|
|
1494
1248
|
defaultTagName: "div",
|
|
1495
|
-
props:
|
|
1249
|
+
props: mergeProps4({
|
|
1496
1250
|
className: cn2("flex items-center gap-2 rounded-sm border bg-muted px-control-x text-sm font-medium [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", className)
|
|
1497
1251
|
}, props),
|
|
1498
1252
|
render,
|
|
@@ -1508,7 +1262,7 @@ function ButtonGroupSeparator({
|
|
|
1508
1262
|
orientation = "vertical",
|
|
1509
1263
|
...props
|
|
1510
1264
|
}) {
|
|
1511
|
-
return /* @__PURE__ */
|
|
1265
|
+
return /* @__PURE__ */ jsx13(Separator2, {
|
|
1512
1266
|
"data-density": density,
|
|
1513
1267
|
"data-slot": "button-group-separator",
|
|
1514
1268
|
orientation,
|
|
@@ -1516,61 +1270,13 @@ function ButtonGroupSeparator({
|
|
|
1516
1270
|
...props
|
|
1517
1271
|
});
|
|
1518
1272
|
}
|
|
1519
|
-
// src/components/NativeSelect.tsx
|
|
1520
|
-
import { ChevronDownIcon as ChevronDownIcon4 } from "lucide-react";
|
|
1521
|
-
import { jsx as jsx17, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
1522
|
-
function NativeSelect({
|
|
1523
|
-
density,
|
|
1524
|
-
className,
|
|
1525
|
-
dir,
|
|
1526
|
-
size = "default",
|
|
1527
|
-
...props
|
|
1528
|
-
}) {
|
|
1529
|
-
return /* @__PURE__ */ jsxs11("div", {
|
|
1530
|
-
dir,
|
|
1531
|
-
className: cn2("group/native-select relative w-fit has-[select:disabled]:opacity-50", className),
|
|
1532
|
-
"data-density": density,
|
|
1533
|
-
"data-slot": "native-select-wrapper",
|
|
1534
|
-
"data-size": size,
|
|
1535
|
-
children: [
|
|
1536
|
-
/* @__PURE__ */ jsx17("select", {
|
|
1537
|
-
dir,
|
|
1538
|
-
"data-slot": "native-select",
|
|
1539
|
-
"data-size": size,
|
|
1540
|
-
className: "h-control w-full min-w-0 appearance-none rounded-sm border border-input bg-secondary py-1 pe-8 ps-2.5 text-sm transition-colors outline-none select-none selection:bg-primary selection:text-primary-foreground placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:cursor-not-allowed aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive data-[size=sm]:h-control-sm data-[size=sm]:rounded-sm data-[size=sm]:py-0.5",
|
|
1541
|
-
...props
|
|
1542
|
-
}),
|
|
1543
|
-
/* @__PURE__ */ jsx17(ChevronDownIcon4, {
|
|
1544
|
-
className: "pointer-events-none absolute top-1/2 end-2.5 size-4 -translate-y-1/2 text-muted-foreground select-none",
|
|
1545
|
-
"aria-hidden": "true",
|
|
1546
|
-
"data-slot": "native-select-icon"
|
|
1547
|
-
})
|
|
1548
|
-
]
|
|
1549
|
-
});
|
|
1550
|
-
}
|
|
1551
|
-
function NativeSelectOption({ density, className, ...props }) {
|
|
1552
|
-
return /* @__PURE__ */ jsx17("option", {
|
|
1553
|
-
"data-density": density,
|
|
1554
|
-
"data-slot": "native-select-option",
|
|
1555
|
-
className: cn2("bg-[Canvas] text-[CanvasText]", className),
|
|
1556
|
-
...props
|
|
1557
|
-
});
|
|
1558
|
-
}
|
|
1559
|
-
function NativeSelectOptGroup({ density, className, ...props }) {
|
|
1560
|
-
return /* @__PURE__ */ jsx17("optgroup", {
|
|
1561
|
-
"data-density": density,
|
|
1562
|
-
"data-slot": "native-select-optgroup",
|
|
1563
|
-
className: cn2("bg-[Canvas] text-[CanvasText]", className),
|
|
1564
|
-
...props
|
|
1565
|
-
});
|
|
1566
|
-
}
|
|
1567
1273
|
// src/components/Item.tsx
|
|
1568
|
-
import { mergeProps as
|
|
1569
|
-
import { useRender as
|
|
1570
|
-
import { cva as
|
|
1571
|
-
import { jsx as
|
|
1274
|
+
import { mergeProps as mergeProps5 } from "@base-ui/react/merge-props";
|
|
1275
|
+
import { useRender as useRender5 } from "@base-ui/react/use-render";
|
|
1276
|
+
import { cva as cva2 } from "class-variance-authority";
|
|
1277
|
+
import { jsx as jsx14 } from "react/jsx-runtime";
|
|
1572
1278
|
function ItemGroup({ density, className, ...props }) {
|
|
1573
|
-
return /* @__PURE__ */
|
|
1279
|
+
return /* @__PURE__ */ jsx14("div", {
|
|
1574
1280
|
role: "list",
|
|
1575
1281
|
"data-density": density,
|
|
1576
1282
|
"data-slot": "item-group",
|
|
@@ -1579,7 +1285,7 @@ function ItemGroup({ density, className, ...props }) {
|
|
|
1579
1285
|
});
|
|
1580
1286
|
}
|
|
1581
1287
|
function ItemSeparator({ density, className, ...props }) {
|
|
1582
|
-
return /* @__PURE__ */
|
|
1288
|
+
return /* @__PURE__ */ jsx14(Separator2, {
|
|
1583
1289
|
"data-density": density,
|
|
1584
1290
|
"data-slot": "item-separator",
|
|
1585
1291
|
orientation: "horizontal",
|
|
@@ -1587,7 +1293,7 @@ function ItemSeparator({ density, className, ...props }) {
|
|
|
1587
1293
|
...props
|
|
1588
1294
|
});
|
|
1589
1295
|
}
|
|
1590
|
-
var itemVariants =
|
|
1296
|
+
var itemVariants = cva2("group/item flex w-full flex-wrap items-center rounded-sm border text-sm transition-colors duration-100 outline-none focus-visible:border-ring focus-visible:ring-1 focus-visible:ring-ring [a]:transition-colors [a]:hover:bg-muted", {
|
|
1591
1297
|
variants: {
|
|
1592
1298
|
variant: {
|
|
1593
1299
|
default: "border-transparent",
|
|
@@ -1613,9 +1319,9 @@ function Item({
|
|
|
1613
1319
|
render,
|
|
1614
1320
|
...props
|
|
1615
1321
|
}) {
|
|
1616
|
-
return
|
|
1322
|
+
return useRender5({
|
|
1617
1323
|
defaultTagName: "div",
|
|
1618
|
-
props:
|
|
1324
|
+
props: mergeProps5({
|
|
1619
1325
|
className: cn2(itemVariants({ variant, size, className }))
|
|
1620
1326
|
}, props),
|
|
1621
1327
|
render,
|
|
@@ -1627,7 +1333,7 @@ function Item({
|
|
|
1627
1333
|
}
|
|
1628
1334
|
});
|
|
1629
1335
|
}
|
|
1630
|
-
var itemMediaVariants =
|
|
1336
|
+
var itemMediaVariants = cva2("flex shrink-0 items-center justify-center gap-2 group-has-data-[slot=item-description]/item:translate-y-0.5 group-has-data-[slot=item-description]/item:self-start [&_svg]:pointer-events-none", {
|
|
1631
1337
|
variants: {
|
|
1632
1338
|
variant: {
|
|
1633
1339
|
default: "bg-transparent",
|
|
@@ -1640,7 +1346,7 @@ var itemMediaVariants = cva3("flex shrink-0 items-center justify-center gap-2 gr
|
|
|
1640
1346
|
}
|
|
1641
1347
|
});
|
|
1642
1348
|
function ItemMedia({ density, className, variant = "default", ...props }) {
|
|
1643
|
-
return /* @__PURE__ */
|
|
1349
|
+
return /* @__PURE__ */ jsx14("div", {
|
|
1644
1350
|
"data-density": density,
|
|
1645
1351
|
"data-slot": "item-media",
|
|
1646
1352
|
"data-variant": variant,
|
|
@@ -1649,7 +1355,7 @@ function ItemMedia({ density, className, variant = "default", ...props }) {
|
|
|
1649
1355
|
});
|
|
1650
1356
|
}
|
|
1651
1357
|
function ItemContent({ density, className, ...props }) {
|
|
1652
|
-
return /* @__PURE__ */
|
|
1358
|
+
return /* @__PURE__ */ jsx14("div", {
|
|
1653
1359
|
"data-density": density,
|
|
1654
1360
|
"data-slot": "item-content",
|
|
1655
1361
|
className: cn2("flex flex-1 flex-col gap-1 group-data-[size=xs]/item:gap-0 [&+[data-slot=item-content]]:flex-none", className),
|
|
@@ -1657,7 +1363,7 @@ function ItemContent({ density, className, ...props }) {
|
|
|
1657
1363
|
});
|
|
1658
1364
|
}
|
|
1659
1365
|
function ItemTitle({ density, className, ...props }) {
|
|
1660
|
-
return /* @__PURE__ */
|
|
1366
|
+
return /* @__PURE__ */ jsx14("div", {
|
|
1661
1367
|
"data-density": density,
|
|
1662
1368
|
"data-slot": "item-title",
|
|
1663
1369
|
className: cn2("line-clamp-1 flex w-fit items-center gap-2 text-sm leading-snug font-medium underline-offset-4", className),
|
|
@@ -1665,7 +1371,7 @@ function ItemTitle({ density, className, ...props }) {
|
|
|
1665
1371
|
});
|
|
1666
1372
|
}
|
|
1667
1373
|
function ItemDescription({ density, className, ...props }) {
|
|
1668
|
-
return /* @__PURE__ */
|
|
1374
|
+
return /* @__PURE__ */ jsx14("p", {
|
|
1669
1375
|
"data-density": density,
|
|
1670
1376
|
"data-slot": "item-description",
|
|
1671
1377
|
className: cn2("line-clamp-2 text-start text-sm leading-normal font-normal text-muted-foreground group-data-[size=xs]/item:text-xs [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary", className),
|
|
@@ -1673,7 +1379,7 @@ function ItemDescription({ density, className, ...props }) {
|
|
|
1673
1379
|
});
|
|
1674
1380
|
}
|
|
1675
1381
|
function ItemActions({ density, className, ...props }) {
|
|
1676
|
-
return /* @__PURE__ */
|
|
1382
|
+
return /* @__PURE__ */ jsx14("div", {
|
|
1677
1383
|
"data-density": density,
|
|
1678
1384
|
"data-slot": "item-actions",
|
|
1679
1385
|
className: cn2("flex items-center gap-2", className),
|
|
@@ -1681,7 +1387,7 @@ function ItemActions({ density, className, ...props }) {
|
|
|
1681
1387
|
});
|
|
1682
1388
|
}
|
|
1683
1389
|
function ItemHeader({ density, className, ...props }) {
|
|
1684
|
-
return /* @__PURE__ */
|
|
1390
|
+
return /* @__PURE__ */ jsx14("div", {
|
|
1685
1391
|
"data-density": density,
|
|
1686
1392
|
"data-slot": "item-header",
|
|
1687
1393
|
className: cn2("flex basis-full items-center justify-between gap-2", className),
|
|
@@ -1689,7 +1395,7 @@ function ItemHeader({ density, className, ...props }) {
|
|
|
1689
1395
|
});
|
|
1690
1396
|
}
|
|
1691
1397
|
function ItemFooter({ density, className, ...props }) {
|
|
1692
|
-
return /* @__PURE__ */
|
|
1398
|
+
return /* @__PURE__ */ jsx14("div", {
|
|
1693
1399
|
"data-density": density,
|
|
1694
1400
|
"data-slot": "item-footer",
|
|
1695
1401
|
className: cn2("flex basis-full items-center justify-between gap-2", className),
|
|
@@ -1698,9 +1404,9 @@ function ItemFooter({ density, className, ...props }) {
|
|
|
1698
1404
|
}
|
|
1699
1405
|
// src/components/Pagination.tsx
|
|
1700
1406
|
import { ChevronLeftIcon, ChevronRightIcon as ChevronRightIcon2, MoreHorizontalIcon as MoreHorizontalIcon2 } from "lucide-react";
|
|
1701
|
-
import { jsx as
|
|
1407
|
+
import { jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
1702
1408
|
function Pagination({ density, className, ...props }) {
|
|
1703
|
-
return /* @__PURE__ */
|
|
1409
|
+
return /* @__PURE__ */ jsx15("nav", {
|
|
1704
1410
|
role: "navigation",
|
|
1705
1411
|
"aria-label": "pagination",
|
|
1706
1412
|
"data-density": density,
|
|
@@ -1710,7 +1416,7 @@ function Pagination({ density, className, ...props }) {
|
|
|
1710
1416
|
});
|
|
1711
1417
|
}
|
|
1712
1418
|
function PaginationContent({ density, className, ...props }) {
|
|
1713
|
-
return /* @__PURE__ */
|
|
1419
|
+
return /* @__PURE__ */ jsx15("ul", {
|
|
1714
1420
|
"data-density": density,
|
|
1715
1421
|
"data-slot": "pagination-content",
|
|
1716
1422
|
className: cn2("flex items-center gap-0.5", className),
|
|
@@ -1718,7 +1424,7 @@ function PaginationContent({ density, className, ...props }) {
|
|
|
1718
1424
|
});
|
|
1719
1425
|
}
|
|
1720
1426
|
function PaginationItem({ ...props }) {
|
|
1721
|
-
return /* @__PURE__ */
|
|
1427
|
+
return /* @__PURE__ */ jsx15("li", {
|
|
1722
1428
|
"data-slot": "pagination-item",
|
|
1723
1429
|
...props
|
|
1724
1430
|
});
|
|
@@ -1730,7 +1436,7 @@ function PaginationLink({
|
|
|
1730
1436
|
size = "icon",
|
|
1731
1437
|
...props
|
|
1732
1438
|
}) {
|
|
1733
|
-
return /* @__PURE__ */
|
|
1439
|
+
return /* @__PURE__ */ jsx15("a", {
|
|
1734
1440
|
"data-density": density,
|
|
1735
1441
|
className: cn2(buttonVariants2({ variant: isActive ? "outline" : "ghost", size }), className),
|
|
1736
1442
|
"aria-current": isActive ? "page" : undefined,
|
|
@@ -1745,18 +1451,18 @@ function PaginationPrevious({
|
|
|
1745
1451
|
text = "Previous",
|
|
1746
1452
|
...props
|
|
1747
1453
|
}) {
|
|
1748
|
-
return /* @__PURE__ */
|
|
1454
|
+
return /* @__PURE__ */ jsxs9(PaginationLink, {
|
|
1749
1455
|
density,
|
|
1750
1456
|
"aria-label": "Go to previous page",
|
|
1751
1457
|
size: "default",
|
|
1752
1458
|
className: cn2("ps-1.5!", className),
|
|
1753
1459
|
...props,
|
|
1754
1460
|
children: [
|
|
1755
|
-
/* @__PURE__ */
|
|
1461
|
+
/* @__PURE__ */ jsx15(ChevronLeftIcon, {
|
|
1756
1462
|
"data-icon": "inline-start",
|
|
1757
1463
|
className: "rtl:rotate-180"
|
|
1758
1464
|
}),
|
|
1759
|
-
/* @__PURE__ */
|
|
1465
|
+
/* @__PURE__ */ jsx15("span", {
|
|
1760
1466
|
className: "hidden sm:block",
|
|
1761
1467
|
children: text
|
|
1762
1468
|
})
|
|
@@ -1764,18 +1470,18 @@ function PaginationPrevious({
|
|
|
1764
1470
|
});
|
|
1765
1471
|
}
|
|
1766
1472
|
function PaginationNext({ density, className, text = "Next", ...props }) {
|
|
1767
|
-
return /* @__PURE__ */
|
|
1473
|
+
return /* @__PURE__ */ jsxs9(PaginationLink, {
|
|
1768
1474
|
density,
|
|
1769
1475
|
"aria-label": "Go to next page",
|
|
1770
1476
|
size: "default",
|
|
1771
1477
|
className: cn2("pe-1.5!", className),
|
|
1772
1478
|
...props,
|
|
1773
1479
|
children: [
|
|
1774
|
-
/* @__PURE__ */
|
|
1480
|
+
/* @__PURE__ */ jsx15("span", {
|
|
1775
1481
|
className: "hidden sm:block",
|
|
1776
1482
|
children: text
|
|
1777
1483
|
}),
|
|
1778
|
-
/* @__PURE__ */
|
|
1484
|
+
/* @__PURE__ */ jsx15(ChevronRightIcon2, {
|
|
1779
1485
|
"data-icon": "inline-end",
|
|
1780
1486
|
className: "rtl:rotate-180"
|
|
1781
1487
|
})
|
|
@@ -1783,15 +1489,15 @@ function PaginationNext({ density, className, text = "Next", ...props }) {
|
|
|
1783
1489
|
});
|
|
1784
1490
|
}
|
|
1785
1491
|
function PaginationEllipsis({ density, className, ...props }) {
|
|
1786
|
-
return /* @__PURE__ */
|
|
1492
|
+
return /* @__PURE__ */ jsxs9("span", {
|
|
1787
1493
|
"aria-hidden": true,
|
|
1788
1494
|
"data-density": density,
|
|
1789
1495
|
"data-slot": "pagination-ellipsis",
|
|
1790
1496
|
className: cn2("flex size-control items-center justify-center [&_svg:not([class*='size-'])]:size-4", className),
|
|
1791
1497
|
...props,
|
|
1792
1498
|
children: [
|
|
1793
|
-
/* @__PURE__ */
|
|
1794
|
-
/* @__PURE__ */
|
|
1499
|
+
/* @__PURE__ */ jsx15(MoreHorizontalIcon2, {}),
|
|
1500
|
+
/* @__PURE__ */ jsx15("span", {
|
|
1795
1501
|
className: "sr-only",
|
|
1796
1502
|
children: "More pages"
|
|
1797
1503
|
})
|
|
@@ -1800,39 +1506,39 @@ function PaginationEllipsis({ density, className, ...props }) {
|
|
|
1800
1506
|
}
|
|
1801
1507
|
// src/components/ScrollArea.tsx
|
|
1802
1508
|
import { ScrollArea as ScrollAreaPrimitive } from "@base-ui/react/scroll-area";
|
|
1803
|
-
import { jsx as
|
|
1509
|
+
import { jsx as jsx16, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
1804
1510
|
function ScrollArea({
|
|
1805
1511
|
density,
|
|
1806
1512
|
className,
|
|
1807
1513
|
children,
|
|
1808
|
-
scrollbars = /* @__PURE__ */
|
|
1514
|
+
scrollbars = /* @__PURE__ */ jsx16(ScrollBar, {}),
|
|
1809
1515
|
...props
|
|
1810
1516
|
}) {
|
|
1811
|
-
return /* @__PURE__ */
|
|
1517
|
+
return /* @__PURE__ */ jsxs10(ScrollAreaPrimitive.Root, {
|
|
1812
1518
|
"data-density": density,
|
|
1813
1519
|
"data-slot": "scroll-area",
|
|
1814
1520
|
className: (state) => cn2("relative flex min-h-0 flex-col", typeof className === "function" ? className(state) : className),
|
|
1815
1521
|
...props,
|
|
1816
1522
|
children: [
|
|
1817
|
-
/* @__PURE__ */
|
|
1523
|
+
/* @__PURE__ */ jsx16(ScrollAreaPrimitive.Viewport, {
|
|
1818
1524
|
"data-slot": "scroll-area-viewport",
|
|
1819
1525
|
className: "size-full min-h-0 flex-1 rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:outline-1",
|
|
1820
1526
|
children
|
|
1821
1527
|
}),
|
|
1822
1528
|
scrollbars,
|
|
1823
|
-
/* @__PURE__ */
|
|
1529
|
+
/* @__PURE__ */ jsx16(ScrollAreaPrimitive.Corner, {})
|
|
1824
1530
|
]
|
|
1825
1531
|
});
|
|
1826
1532
|
}
|
|
1827
1533
|
function ScrollBar({ density, className, orientation = "vertical", ...props }) {
|
|
1828
|
-
return /* @__PURE__ */
|
|
1534
|
+
return /* @__PURE__ */ jsx16(ScrollAreaPrimitive.Scrollbar, {
|
|
1829
1535
|
"data-density": density,
|
|
1830
1536
|
"data-slot": "scroll-area-scrollbar",
|
|
1831
1537
|
"data-orientation": orientation,
|
|
1832
1538
|
orientation,
|
|
1833
1539
|
className: (state) => cn2("flex touch-none p-px transition-colors select-none data-[orientation=horizontal]:h-2.5 data-[orientation=horizontal]:flex-col data-[orientation=horizontal]:border-t data-[orientation=horizontal]:border-t-transparent data-[orientation=vertical]:w-2.5 data-[orientation=vertical]:border-s data-[orientation=vertical]:border-s-transparent", typeof className === "function" ? className(state) : className),
|
|
1834
1540
|
...props,
|
|
1835
|
-
children: /* @__PURE__ */
|
|
1541
|
+
children: /* @__PURE__ */ jsx16(ScrollAreaPrimitive.Thumb, {
|
|
1836
1542
|
"data-slot": "scroll-area-thumb",
|
|
1837
1543
|
className: "relative flex-1 rounded-full bg-border"
|
|
1838
1544
|
})
|
|
@@ -1842,13 +1548,13 @@ function ScrollBar({ density, className, orientation = "vertical", ...props }) {
|
|
|
1842
1548
|
import { useMemo as useMemo2 } from "react";
|
|
1843
1549
|
|
|
1844
1550
|
// src/drawer/DrawerContext.ts
|
|
1845
|
-
import { createContext
|
|
1846
|
-
var DrawerContext =
|
|
1551
|
+
import { createContext } from "react";
|
|
1552
|
+
var DrawerContext = createContext(null);
|
|
1847
1553
|
|
|
1848
1554
|
// src/hooks/useDrawer.ts
|
|
1849
|
-
import { useContext
|
|
1555
|
+
import { useContext } from "react";
|
|
1850
1556
|
function useDrawer() {
|
|
1851
|
-
const context =
|
|
1557
|
+
const context = useContext(DrawerContext);
|
|
1852
1558
|
if (!context) {
|
|
1853
1559
|
throw new Error("useDrawer must be used within a Drawer.");
|
|
1854
1560
|
}
|
|
@@ -1857,7 +1563,7 @@ function useDrawer() {
|
|
|
1857
1563
|
|
|
1858
1564
|
// src/components/Drawer.tsx
|
|
1859
1565
|
import { Drawer as DrawerPrimitive } from "@base-ui/react/drawer";
|
|
1860
|
-
import { jsx as
|
|
1566
|
+
import { jsx as jsx17, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
1861
1567
|
function Drawer({
|
|
1862
1568
|
modal = true,
|
|
1863
1569
|
showSwipeHandle = false,
|
|
@@ -1867,9 +1573,9 @@ function Drawer({
|
|
|
1867
1573
|
}) {
|
|
1868
1574
|
const hasSnapPoints = snapPoints != null && snapPoints.length > 0;
|
|
1869
1575
|
const contextValue = useMemo2(() => ({ hasSnapPoints, modal, showSwipeHandle, swipeDirection }), [hasSnapPoints, modal, showSwipeHandle, swipeDirection]);
|
|
1870
|
-
return /* @__PURE__ */
|
|
1576
|
+
return /* @__PURE__ */ jsx17(DrawerContext.Provider, {
|
|
1871
1577
|
value: contextValue,
|
|
1872
|
-
children: /* @__PURE__ */
|
|
1578
|
+
children: /* @__PURE__ */ jsx17(DrawerPrimitive.Root, {
|
|
1873
1579
|
"data-slot": "drawer",
|
|
1874
1580
|
modal,
|
|
1875
1581
|
snapPoints,
|
|
@@ -1879,7 +1585,7 @@ function Drawer({
|
|
|
1879
1585
|
});
|
|
1880
1586
|
}
|
|
1881
1587
|
function DrawerTrigger({ ...props }) {
|
|
1882
|
-
return /* @__PURE__ */
|
|
1588
|
+
return /* @__PURE__ */ jsx17(DrawerPrimitive.Trigger, {
|
|
1883
1589
|
"data-slot": "drawer-trigger",
|
|
1884
1590
|
...props
|
|
1885
1591
|
});
|
|
@@ -1887,26 +1593,26 @@ function DrawerTrigger({ ...props }) {
|
|
|
1887
1593
|
function DrawerPortal({ container, ref, children, ...props }) {
|
|
1888
1594
|
const resolvedContainer = usePortalContainer2(container);
|
|
1889
1595
|
const portal = usePortalNode(ref);
|
|
1890
|
-
return /* @__PURE__ */
|
|
1596
|
+
return /* @__PURE__ */ jsx17(DrawerPrimitive.Portal, {
|
|
1891
1597
|
"data-slot": "drawer-portal",
|
|
1892
1598
|
container: resolvedContainer,
|
|
1893
1599
|
ref: portal.ref,
|
|
1894
1600
|
...props,
|
|
1895
|
-
children: /* @__PURE__ */
|
|
1601
|
+
children: /* @__PURE__ */ jsx17(PortalProvider2, {
|
|
1896
1602
|
container: portal.node,
|
|
1897
1603
|
children
|
|
1898
1604
|
})
|
|
1899
1605
|
});
|
|
1900
1606
|
}
|
|
1901
1607
|
function DrawerClose({ ...props }) {
|
|
1902
|
-
return /* @__PURE__ */
|
|
1608
|
+
return /* @__PURE__ */ jsx17(DrawerPrimitive.Close, {
|
|
1903
1609
|
"data-slot": "drawer-close",
|
|
1904
1610
|
...props
|
|
1905
1611
|
});
|
|
1906
1612
|
}
|
|
1907
1613
|
function DrawerOverlay({ density, className, ...props }) {
|
|
1908
1614
|
const resolvedDensity = useDensity(density);
|
|
1909
|
-
return /* @__PURE__ */
|
|
1615
|
+
return /* @__PURE__ */ jsx17(DrawerPrimitive.Backdrop, {
|
|
1910
1616
|
"data-density": resolvedDensity,
|
|
1911
1617
|
"data-slot": "drawer-overlay",
|
|
1912
1618
|
className: (state) => cn2("fixed inset-0 min-h-dvh bg-backdrop opacity-[max(var(--drawer-overlay-min-opacity,0),calc(1-var(--drawer-swipe-progress)))] transition-opacity duration-450 ease-[cubic-bezier(0.32,0.72,0,1)] select-none data-ending-style:pointer-events-none data-ending-style:opacity-0 data-ending-style:duration-[calc(var(--drawer-swipe-strength)*400ms)] data-snap-points:[--drawer-overlay-min-opacity:0.5] data-starting-style:opacity-0 data-swiping:duration-0 supports-[-webkit-touch-callout:none]:absolute", typeof className === "function" ? className(state) : className),
|
|
@@ -1914,7 +1620,7 @@ function DrawerOverlay({ density, className, ...props }) {
|
|
|
1914
1620
|
});
|
|
1915
1621
|
}
|
|
1916
1622
|
function DrawerSwipeHandle({ density, className, ...props }) {
|
|
1917
|
-
return /* @__PURE__ */
|
|
1623
|
+
return /* @__PURE__ */ jsx17("div", {
|
|
1918
1624
|
"data-density": density,
|
|
1919
1625
|
"data-slot": "drawer-swipe-handle",
|
|
1920
1626
|
"aria-hidden": "true",
|
|
@@ -1927,18 +1633,18 @@ function DrawerContent({ density, className, children, ...props }) {
|
|
|
1927
1633
|
const direction = useDirection2();
|
|
1928
1634
|
const { hasSnapPoints, modal, showSwipeHandle, swipeDirection } = useDrawer();
|
|
1929
1635
|
const swipeAxis = swipeDirection === "down" || swipeDirection === "up" ? "y" : "x";
|
|
1930
|
-
return /* @__PURE__ */
|
|
1636
|
+
return /* @__PURE__ */ jsxs11(DrawerPortal, {
|
|
1931
1637
|
"data-slot": "drawer-portal",
|
|
1932
1638
|
children: [
|
|
1933
|
-
modal === true && /* @__PURE__ */
|
|
1639
|
+
modal === true && /* @__PURE__ */ jsx17(DrawerOverlay, {
|
|
1934
1640
|
"data-snap-points": hasSnapPoints ? "" : undefined
|
|
1935
1641
|
}),
|
|
1936
|
-
/* @__PURE__ */
|
|
1642
|
+
/* @__PURE__ */ jsx17(DrawerPrimitive.Viewport, {
|
|
1937
1643
|
dir: direction,
|
|
1938
1644
|
"data-slot": "drawer-viewport",
|
|
1939
1645
|
"data-modal": modal,
|
|
1940
1646
|
className: "pointer-events-none fixed inset-0 select-none data-[modal=true]:pointer-events-auto",
|
|
1941
|
-
children: /* @__PURE__ */
|
|
1647
|
+
children: /* @__PURE__ */ jsxs11(DrawerPrimitive.Popup, {
|
|
1942
1648
|
"data-density": resolvedDensity,
|
|
1943
1649
|
"data-slot": "drawer-popup",
|
|
1944
1650
|
"data-scroll": "none",
|
|
@@ -1947,8 +1653,8 @@ function DrawerContent({ density, className, children, ...props }) {
|
|
|
1947
1653
|
className: (state) => cn2("group/drawer-popup pointer-events-auto fixed m-(--drawer-inset,0px) flex h-(--drawer-content-height) max-h-(--drawer-content-max-height,none) min-h-0 w-(--drawer-content-width,auto) transform-[translate3d(var(--translate-x,0px),var(--translate-y,0px),0)] flex-col border border-frame-edge shadow-frame bg-popover text-sm text-popover-foreground transition-[transform,height,opacity,filter] duration-450 ease-[cubic-bezier(0.22,1,0.36,1)] will-change-transform outline-none select-none [interpolate-size:allow-keywords] data-[swipe-direction=down]:rounded-t-md data-[swipe-direction=down]:border-t data-[swipe-direction=left]:rounded-r-md data-[swipe-direction=left]:border-r data-[swipe-direction=right]:rounded-l-md data-[swipe-direction=right]:border-l data-[swipe-direction=up]:rounded-b-md data-[swipe-direction=up]:border-b", "data-nested-drawer-open:overflow-hidden data-nested-drawer-open:brightness-95", "after:pointer-events-none after:absolute after:bg-(--drawer-bleed-background,var(--color-popover)) data-[swipe-axis=x]:after:inset-y-0 data-[swipe-axis=x]:after:w-(--bleed) data-[swipe-axis=y]:after:inset-x-0 data-[swipe-axis=y]:after:h-(--bleed) data-[swipe-direction=down]:after:top-full data-[swipe-direction=left]:after:right-full data-[swipe-direction=right]:after:left-full data-[swipe-direction=up]:after:bottom-full", "[--drawer-content-height:var(--drawer-height,auto)] data-[swipe-axis=x]:[--drawer-content-width:75%] data-[swipe-axis=y]:[--drawer-content-max-height:calc(100dvh-6rem)] data-[swipe-axis=y]:data-snap-points:[--drawer-content-height:100dvh] data-[swipe-axis=x]:sm:[--drawer-content-width:24rem]", "[--bleed:3rem] [--peek:1rem] [--stack-height:var(--drawer-frontmost-height,var(--drawer-height,0px))] [--stack-peek-offset:max(0px,calc((var(--nested-drawers)-var(--stack-progress))*var(--peek)))] [--stack-progress:clamp(0,var(--drawer-swipe-progress),1)] [--stack-shrink:0]", "data-ending-style:transform-(--closed-transform) data-ending-style:opacity-[0.9999] data-ending-style:duration-[calc(var(--drawer-swipe-strength)*400ms)] data-nested-drawer-swiping:duration-0 data-ending-style:data-nested-drawer-swiping:duration-[calc(var(--drawer-swipe-strength)*400ms)] data-starting-style:transform-(--closed-transform) data-swiping:duration-0 data-ending-style:data-swiping:duration-[calc(var(--drawer-swipe-strength)*400ms)]", "data-[swipe-axis=y]:inset-x-0 data-[swipe-axis=y]:data-nested-drawer-open:h-(--stack-height)", "data-[swipe-axis=x]:inset-y-0 data-[swipe-axis=x]:flex-row", "data-[swipe-direction=down]:bottom-0 data-[swipe-direction=down]:origin-bottom data-[swipe-direction=down]:[--closed-transform:translate3d(0,calc(100%+var(--drawer-inset,0px)+2px),0)] data-[swipe-direction=down]:[--translate-y:calc(var(--drawer-snap-point-offset,0px)+var(--drawer-swipe-movement-y)-var(--stack-peek-offset)-(var(--stack-shrink)*var(--stack-height)))]", "data-[swipe-direction=up]:top-0 data-[swipe-direction=up]:origin-top data-[swipe-direction=up]:[--closed-transform:translate3d(0,calc(-100%-var(--drawer-inset,0px)-2px),0)] data-[swipe-direction=up]:[--translate-y:calc(var(--drawer-snap-point-offset,0px)+var(--drawer-swipe-movement-y)+var(--stack-peek-offset)+(var(--stack-shrink)*var(--stack-height)))]", "data-[swipe-direction=left]:left-0 data-[swipe-direction=left]:origin-left data-[swipe-direction=left]:[--closed-transform:translate3d(calc(-100%-var(--drawer-inset,0px)-2px),0,0)] data-[swipe-direction=left]:[--translate-x:calc(var(--drawer-swipe-movement-x)+var(--stack-peek-offset)+(var(--stack-shrink)*100%))]", "data-[swipe-direction=right]:right-0 data-[swipe-direction=right]:origin-right data-[swipe-direction=right]:[--closed-transform:translate3d(calc(100%+var(--drawer-inset,0px)+2px),0,0)] data-[swipe-direction=right]:[--translate-x:calc(var(--drawer-swipe-movement-x)-var(--stack-peek-offset)-(var(--stack-shrink)*100%))]", typeof className === "function" ? className(state) : className),
|
|
1948
1654
|
...props,
|
|
1949
1655
|
children: [
|
|
1950
|
-
showSwipeHandle && /* @__PURE__ */
|
|
1951
|
-
/* @__PURE__ */
|
|
1656
|
+
showSwipeHandle && /* @__PURE__ */ jsx17(DrawerSwipeHandle, {}),
|
|
1657
|
+
/* @__PURE__ */ jsx17(DrawerPrimitive.Content, {
|
|
1952
1658
|
"data-slot": "drawer-content",
|
|
1953
1659
|
"data-scroll": "none",
|
|
1954
1660
|
className: "flex min-h-0 flex-1 flex-col overflow-hidden overscroll-contain rounded-[inherit] transition-opacity duration-300 ease-out select-text group-data-nested-drawer-open/drawer-popup:opacity-0 group-data-nested-drawer-swiping/drawer-popup:opacity-100 group-data-swiping/drawer-popup:select-none",
|
|
@@ -1961,7 +1667,7 @@ function DrawerContent({ density, className, children, ...props }) {
|
|
|
1961
1667
|
});
|
|
1962
1668
|
}
|
|
1963
1669
|
function DrawerHeader({ density, className, ...props }) {
|
|
1964
|
-
return /* @__PURE__ */
|
|
1670
|
+
return /* @__PURE__ */ jsx17("div", {
|
|
1965
1671
|
"data-density": density,
|
|
1966
1672
|
"data-slot": "drawer-header",
|
|
1967
1673
|
className: cn2("flex shrink-0 flex-col gap-0.5 p-panel pb-0 group-data-[swipe-axis=y]/drawer-popup:text-center md:gap-0.5 md:text-start md:group-data-[swipe-axis=y]/drawer-popup:text-start", className),
|
|
@@ -1969,7 +1675,7 @@ function DrawerHeader({ density, className, ...props }) {
|
|
|
1969
1675
|
});
|
|
1970
1676
|
}
|
|
1971
1677
|
function DrawerFooter({ density, className, ...props }) {
|
|
1972
|
-
return /* @__PURE__ */
|
|
1678
|
+
return /* @__PURE__ */ jsx17("div", {
|
|
1973
1679
|
"data-density": density,
|
|
1974
1680
|
"data-slot": "drawer-footer",
|
|
1975
1681
|
className: cn2("mt-auto flex shrink-0 flex-col gap-2 p-panel pt-0", className),
|
|
@@ -1977,7 +1683,7 @@ function DrawerFooter({ density, className, ...props }) {
|
|
|
1977
1683
|
});
|
|
1978
1684
|
}
|
|
1979
1685
|
function DrawerTitle({ density, className, ...props }) {
|
|
1980
|
-
return /* @__PURE__ */
|
|
1686
|
+
return /* @__PURE__ */ jsx17(DrawerPrimitive.Title, {
|
|
1981
1687
|
"data-density": density,
|
|
1982
1688
|
"data-slot": "drawer-title",
|
|
1983
1689
|
className: (state) => cn2(" text-base font-medium text-foreground", typeof className === "function" ? className(state) : className),
|
|
@@ -1985,7 +1691,7 @@ function DrawerTitle({ density, className, ...props }) {
|
|
|
1985
1691
|
});
|
|
1986
1692
|
}
|
|
1987
1693
|
function DrawerDescription({ density, className, ...props }) {
|
|
1988
|
-
return /* @__PURE__ */
|
|
1694
|
+
return /* @__PURE__ */ jsx17(DrawerPrimitive.Description, {
|
|
1989
1695
|
"data-density": density,
|
|
1990
1696
|
"data-slot": "drawer-description",
|
|
1991
1697
|
className: (state) => cn2("text-sm text-balance text-muted-foreground", typeof className === "function" ? className(state) : className),
|
|
@@ -1996,9 +1702,9 @@ function DrawerDescription({ density, className, ...props }) {
|
|
|
1996
1702
|
import { ChevronRightIcon as ChevronRightIcon3, CheckIcon as CheckIcon3 } from "lucide-react";
|
|
1997
1703
|
import { useDirection as useDirection5 } from "@base-ui/react/direction-provider";
|
|
1998
1704
|
import { ContextMenu as ContextMenuPrimitive } from "@base-ui/react/context-menu";
|
|
1999
|
-
import { jsx as
|
|
1705
|
+
import { jsx as jsx18, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
2000
1706
|
function ContextMenu({ ...props }) {
|
|
2001
|
-
return /* @__PURE__ */
|
|
1707
|
+
return /* @__PURE__ */ jsx18(ContextMenuPrimitive.Root, {
|
|
2002
1708
|
"data-slot": "context-menu",
|
|
2003
1709
|
...props
|
|
2004
1710
|
});
|
|
@@ -2006,19 +1712,19 @@ function ContextMenu({ ...props }) {
|
|
|
2006
1712
|
function ContextMenuPortal({ container, ref, children, ...props }) {
|
|
2007
1713
|
const resolvedContainer = usePortalContainer2(container);
|
|
2008
1714
|
const portal = usePortalNode(ref);
|
|
2009
|
-
return /* @__PURE__ */
|
|
1715
|
+
return /* @__PURE__ */ jsx18(ContextMenuPrimitive.Portal, {
|
|
2010
1716
|
"data-slot": "context-menu-portal",
|
|
2011
1717
|
container: resolvedContainer,
|
|
2012
1718
|
ref: portal.ref,
|
|
2013
1719
|
...props,
|
|
2014
|
-
children: /* @__PURE__ */
|
|
1720
|
+
children: /* @__PURE__ */ jsx18(PortalProvider2, {
|
|
2015
1721
|
container: portal.node,
|
|
2016
1722
|
children
|
|
2017
1723
|
})
|
|
2018
1724
|
});
|
|
2019
1725
|
}
|
|
2020
1726
|
function ContextMenuTrigger({ density, className, ...props }) {
|
|
2021
|
-
return /* @__PURE__ */
|
|
1727
|
+
return /* @__PURE__ */ jsx18(ContextMenuPrimitive.Trigger, {
|
|
2022
1728
|
"data-density": density,
|
|
2023
1729
|
"data-slot": "context-menu-trigger",
|
|
2024
1730
|
className: (state) => cn2("select-none", typeof className === "function" ? className(state) : className),
|
|
@@ -2036,15 +1742,15 @@ function ContextMenuContent({
|
|
|
2036
1742
|
}) {
|
|
2037
1743
|
const resolvedDensity = useDensity(density);
|
|
2038
1744
|
const direction = useDirection5();
|
|
2039
|
-
return /* @__PURE__ */
|
|
2040
|
-
children: /* @__PURE__ */
|
|
1745
|
+
return /* @__PURE__ */ jsx18(ContextMenuPortal, {
|
|
1746
|
+
children: /* @__PURE__ */ jsx18(ContextMenuPrimitive.Positioner, {
|
|
2041
1747
|
dir: direction,
|
|
2042
1748
|
className: "isolate outline-none",
|
|
2043
1749
|
align,
|
|
2044
1750
|
alignOffset,
|
|
2045
1751
|
side,
|
|
2046
1752
|
sideOffset,
|
|
2047
|
-
children: /* @__PURE__ */
|
|
1753
|
+
children: /* @__PURE__ */ jsx18(ContextMenuPrimitive.Popup, {
|
|
2048
1754
|
dir: direction,
|
|
2049
1755
|
"data-density": resolvedDensity,
|
|
2050
1756
|
"data-slot": "context-menu-content",
|
|
@@ -2055,13 +1761,13 @@ function ContextMenuContent({
|
|
|
2055
1761
|
});
|
|
2056
1762
|
}
|
|
2057
1763
|
function ContextMenuGroup({ ...props }) {
|
|
2058
|
-
return /* @__PURE__ */
|
|
1764
|
+
return /* @__PURE__ */ jsx18(ContextMenuPrimitive.Group, {
|
|
2059
1765
|
"data-slot": "context-menu-group",
|
|
2060
1766
|
...props
|
|
2061
1767
|
});
|
|
2062
1768
|
}
|
|
2063
1769
|
function ContextMenuLabel({ density, className, inset, ...props }) {
|
|
2064
|
-
return /* @__PURE__ */
|
|
1770
|
+
return /* @__PURE__ */ jsx18(ContextMenuPrimitive.GroupLabel, {
|
|
2065
1771
|
"data-density": density,
|
|
2066
1772
|
"data-slot": "context-menu-label",
|
|
2067
1773
|
"data-inset": inset,
|
|
@@ -2070,7 +1776,7 @@ function ContextMenuLabel({ density, className, inset, ...props }) {
|
|
|
2070
1776
|
});
|
|
2071
1777
|
}
|
|
2072
1778
|
function ContextMenuItem({ density, className, inset, variant = "default", ...props }) {
|
|
2073
|
-
return /* @__PURE__ */
|
|
1779
|
+
return /* @__PURE__ */ jsx18(ContextMenuPrimitive.Item, {
|
|
2074
1780
|
"data-density": density,
|
|
2075
1781
|
"data-slot": "context-menu-item",
|
|
2076
1782
|
"data-inset": inset,
|
|
@@ -2080,13 +1786,13 @@ function ContextMenuItem({ density, className, inset, variant = "default", ...pr
|
|
|
2080
1786
|
});
|
|
2081
1787
|
}
|
|
2082
1788
|
function ContextMenuSub({ ...props }) {
|
|
2083
|
-
return /* @__PURE__ */
|
|
1789
|
+
return /* @__PURE__ */ jsx18(ContextMenuPrimitive.SubmenuRoot, {
|
|
2084
1790
|
"data-slot": "context-menu-sub",
|
|
2085
1791
|
...props
|
|
2086
1792
|
});
|
|
2087
1793
|
}
|
|
2088
1794
|
function ContextMenuSubTrigger({ density, className, inset, children, ...props }) {
|
|
2089
|
-
return /* @__PURE__ */
|
|
1795
|
+
return /* @__PURE__ */ jsxs12(ContextMenuPrimitive.SubmenuTrigger, {
|
|
2090
1796
|
"data-density": density,
|
|
2091
1797
|
"data-slot": "context-menu-sub-trigger",
|
|
2092
1798
|
"data-inset": inset,
|
|
@@ -2094,14 +1800,14 @@ function ContextMenuSubTrigger({ density, className, inset, children, ...props }
|
|
|
2094
1800
|
...props,
|
|
2095
1801
|
children: [
|
|
2096
1802
|
children,
|
|
2097
|
-
/* @__PURE__ */
|
|
1803
|
+
/* @__PURE__ */ jsx18(ChevronRightIcon3, {
|
|
2098
1804
|
className: "rtl:rotate-180 ms-auto"
|
|
2099
1805
|
})
|
|
2100
1806
|
]
|
|
2101
1807
|
});
|
|
2102
1808
|
}
|
|
2103
1809
|
function ContextMenuSubContent({ ...props }) {
|
|
2104
|
-
return /* @__PURE__ */
|
|
1810
|
+
return /* @__PURE__ */ jsx18(ContextMenuContent, {
|
|
2105
1811
|
"data-slot": "context-menu-sub-content",
|
|
2106
1812
|
className: " shadow-frame border border-frame-edge",
|
|
2107
1813
|
side: "inline-end",
|
|
@@ -2116,7 +1822,7 @@ function ContextMenuCheckboxItem({
|
|
|
2116
1822
|
inset,
|
|
2117
1823
|
...props
|
|
2118
1824
|
}) {
|
|
2119
|
-
return /* @__PURE__ */
|
|
1825
|
+
return /* @__PURE__ */ jsxs12(ContextMenuPrimitive.CheckboxItem, {
|
|
2120
1826
|
"data-density": density,
|
|
2121
1827
|
"data-slot": "context-menu-checkbox-item",
|
|
2122
1828
|
"data-inset": inset,
|
|
@@ -2124,10 +1830,10 @@ function ContextMenuCheckboxItem({
|
|
|
2124
1830
|
checked,
|
|
2125
1831
|
...props,
|
|
2126
1832
|
children: [
|
|
2127
|
-
/* @__PURE__ */
|
|
1833
|
+
/* @__PURE__ */ jsx18("span", {
|
|
2128
1834
|
className: "pointer-events-none absolute end-2",
|
|
2129
|
-
children: /* @__PURE__ */
|
|
2130
|
-
children: /* @__PURE__ */
|
|
1835
|
+
children: /* @__PURE__ */ jsx18(ContextMenuPrimitive.CheckboxItemIndicator, {
|
|
1836
|
+
children: /* @__PURE__ */ jsx18(CheckIcon3, {})
|
|
2131
1837
|
})
|
|
2132
1838
|
}),
|
|
2133
1839
|
children
|
|
@@ -2135,23 +1841,23 @@ function ContextMenuCheckboxItem({
|
|
|
2135
1841
|
});
|
|
2136
1842
|
}
|
|
2137
1843
|
function ContextMenuRadioGroup({ ...props }) {
|
|
2138
|
-
return /* @__PURE__ */
|
|
1844
|
+
return /* @__PURE__ */ jsx18(ContextMenuPrimitive.RadioGroup, {
|
|
2139
1845
|
"data-slot": "context-menu-radio-group",
|
|
2140
1846
|
...props
|
|
2141
1847
|
});
|
|
2142
1848
|
}
|
|
2143
1849
|
function ContextMenuRadioItem({ density, className, children, inset, ...props }) {
|
|
2144
|
-
return /* @__PURE__ */
|
|
1850
|
+
return /* @__PURE__ */ jsxs12(ContextMenuPrimitive.RadioItem, {
|
|
2145
1851
|
"data-density": density,
|
|
2146
1852
|
"data-slot": "context-menu-radio-item",
|
|
2147
1853
|
"data-inset": inset,
|
|
2148
1854
|
className: (state) => cn2("relative flex cursor-default items-center gap-control-gap rounded-md py-1 pe-8 ps-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-inset:ps-7 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
|
|
2149
1855
|
...props,
|
|
2150
1856
|
children: [
|
|
2151
|
-
/* @__PURE__ */
|
|
1857
|
+
/* @__PURE__ */ jsx18("span", {
|
|
2152
1858
|
className: "pointer-events-none absolute end-2",
|
|
2153
|
-
children: /* @__PURE__ */
|
|
2154
|
-
children: /* @__PURE__ */
|
|
1859
|
+
children: /* @__PURE__ */ jsx18(ContextMenuPrimitive.RadioItemIndicator, {
|
|
1860
|
+
children: /* @__PURE__ */ jsx18(CheckIcon3, {})
|
|
2155
1861
|
})
|
|
2156
1862
|
}),
|
|
2157
1863
|
children
|
|
@@ -2159,7 +1865,7 @@ function ContextMenuRadioItem({ density, className, children, inset, ...props })
|
|
|
2159
1865
|
});
|
|
2160
1866
|
}
|
|
2161
1867
|
function ContextMenuSeparator({ density, className, ...props }) {
|
|
2162
|
-
return /* @__PURE__ */
|
|
1868
|
+
return /* @__PURE__ */ jsx18(ContextMenuPrimitive.Separator, {
|
|
2163
1869
|
"data-density": density,
|
|
2164
1870
|
"data-slot": "context-menu-separator",
|
|
2165
1871
|
className: (state) => cn2("-mx-1 my-1 h-px bg-border", typeof className === "function" ? className(state) : className),
|
|
@@ -2167,7 +1873,7 @@ function ContextMenuSeparator({ density, className, ...props }) {
|
|
|
2167
1873
|
});
|
|
2168
1874
|
}
|
|
2169
1875
|
function ContextMenuShortcut({ density, className, ...props }) {
|
|
2170
|
-
return /* @__PURE__ */
|
|
1876
|
+
return /* @__PURE__ */ jsx18("span", {
|
|
2171
1877
|
"data-density": density,
|
|
2172
1878
|
"data-slot": "context-menu-shortcut",
|
|
2173
1879
|
className: cn2("ms-auto text-xs tracking-widest text-muted-foreground group-focus/context-menu-item:text-accent-foreground", className),
|
|
@@ -2178,9 +1884,9 @@ function ContextMenuShortcut({ density, className, ...props }) {
|
|
|
2178
1884
|
import { CheckIcon as CheckIcon4 } from "lucide-react";
|
|
2179
1885
|
import { Menu as MenuPrimitive } from "@base-ui/react/menu";
|
|
2180
1886
|
import { Menubar as MenubarPrimitive } from "@base-ui/react/menubar";
|
|
2181
|
-
import { jsx as
|
|
1887
|
+
import { jsx as jsx19, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
2182
1888
|
function Menubar({ density, className, ...props }) {
|
|
2183
|
-
return /* @__PURE__ */
|
|
1889
|
+
return /* @__PURE__ */ jsx19(MenubarPrimitive, {
|
|
2184
1890
|
"data-density": density,
|
|
2185
1891
|
"data-slot": "menubar",
|
|
2186
1892
|
className: (state) => cn2("flex h-control items-center gap-0.5 rounded-sm border p-px", typeof className === "function" ? className(state) : className),
|
|
@@ -2188,25 +1894,25 @@ function Menubar({ density, className, ...props }) {
|
|
|
2188
1894
|
});
|
|
2189
1895
|
}
|
|
2190
1896
|
function MenubarMenu({ ...props }) {
|
|
2191
|
-
return /* @__PURE__ */
|
|
1897
|
+
return /* @__PURE__ */ jsx19(DropdownMenu2, {
|
|
2192
1898
|
"data-slot": "menubar-menu",
|
|
2193
1899
|
...props
|
|
2194
1900
|
});
|
|
2195
1901
|
}
|
|
2196
1902
|
function MenubarGroup({ ...props }) {
|
|
2197
|
-
return /* @__PURE__ */
|
|
1903
|
+
return /* @__PURE__ */ jsx19(DropdownMenuGroup2, {
|
|
2198
1904
|
"data-slot": "menubar-group",
|
|
2199
1905
|
...props
|
|
2200
1906
|
});
|
|
2201
1907
|
}
|
|
2202
1908
|
function MenubarPortal({ ...props }) {
|
|
2203
|
-
return /* @__PURE__ */
|
|
1909
|
+
return /* @__PURE__ */ jsx19(DropdownMenuPortal2, {
|
|
2204
1910
|
"data-slot": "menubar-portal",
|
|
2205
1911
|
...props
|
|
2206
1912
|
});
|
|
2207
1913
|
}
|
|
2208
1914
|
function MenubarTrigger({ density, className, ...props }) {
|
|
2209
|
-
return /* @__PURE__ */
|
|
1915
|
+
return /* @__PURE__ */ jsx19(DropdownMenuTrigger2, {
|
|
2210
1916
|
"data-density": density,
|
|
2211
1917
|
"data-slot": "menubar-trigger",
|
|
2212
1918
|
className: (state) => cn2("flex h-full items-center rounded-sm px-control-x text-sm leading-none font-medium outline-hidden select-none hover:bg-muted aria-expanded:bg-muted", typeof className === "function" ? className(state) : className),
|
|
@@ -2221,7 +1927,7 @@ function MenubarContent({
|
|
|
2221
1927
|
sideOffset = 8,
|
|
2222
1928
|
...props
|
|
2223
1929
|
}) {
|
|
2224
|
-
return /* @__PURE__ */
|
|
1930
|
+
return /* @__PURE__ */ jsx19(DropdownMenuContent2, {
|
|
2225
1931
|
density,
|
|
2226
1932
|
"data-slot": "menubar-content",
|
|
2227
1933
|
align,
|
|
@@ -2232,7 +1938,7 @@ function MenubarContent({
|
|
|
2232
1938
|
});
|
|
2233
1939
|
}
|
|
2234
1940
|
function MenubarItem({ density, className, inset, variant = "default", ...props }) {
|
|
2235
|
-
return /* @__PURE__ */
|
|
1941
|
+
return /* @__PURE__ */ jsx19(DropdownMenuItem2, {
|
|
2236
1942
|
density,
|
|
2237
1943
|
"data-slot": "menubar-item",
|
|
2238
1944
|
inset,
|
|
@@ -2249,7 +1955,7 @@ function MenubarCheckboxItem({
|
|
|
2249
1955
|
inset,
|
|
2250
1956
|
...props
|
|
2251
1957
|
}) {
|
|
2252
|
-
return /* @__PURE__ */
|
|
1958
|
+
return /* @__PURE__ */ jsxs13(MenuPrimitive.CheckboxItem, {
|
|
2253
1959
|
"data-density": density,
|
|
2254
1960
|
"data-slot": "menubar-checkbox-item",
|
|
2255
1961
|
"data-inset": inset,
|
|
@@ -2257,10 +1963,10 @@ function MenubarCheckboxItem({
|
|
|
2257
1963
|
checked,
|
|
2258
1964
|
...props,
|
|
2259
1965
|
children: [
|
|
2260
|
-
/* @__PURE__ */
|
|
1966
|
+
/* @__PURE__ */ jsx19("span", {
|
|
2261
1967
|
className: "pointer-events-none absolute start-1.5 flex size-4 items-center justify-center [&_svg:not([class*='size-'])]:size-4",
|
|
2262
|
-
children: /* @__PURE__ */
|
|
2263
|
-
children: /* @__PURE__ */
|
|
1968
|
+
children: /* @__PURE__ */ jsx19(MenuPrimitive.CheckboxItemIndicator, {
|
|
1969
|
+
children: /* @__PURE__ */ jsx19(CheckIcon4, {})
|
|
2264
1970
|
})
|
|
2265
1971
|
}),
|
|
2266
1972
|
children
|
|
@@ -2268,23 +1974,23 @@ function MenubarCheckboxItem({
|
|
|
2268
1974
|
});
|
|
2269
1975
|
}
|
|
2270
1976
|
function MenubarRadioGroup({ ...props }) {
|
|
2271
|
-
return /* @__PURE__ */
|
|
1977
|
+
return /* @__PURE__ */ jsx19(DropdownMenuRadioGroup2, {
|
|
2272
1978
|
"data-slot": "menubar-radio-group",
|
|
2273
1979
|
...props
|
|
2274
1980
|
});
|
|
2275
1981
|
}
|
|
2276
1982
|
function MenubarRadioItem({ density, className, children, inset, ...props }) {
|
|
2277
|
-
return /* @__PURE__ */
|
|
1983
|
+
return /* @__PURE__ */ jsxs13(MenuPrimitive.RadioItem, {
|
|
2278
1984
|
"data-density": density,
|
|
2279
1985
|
"data-slot": "menubar-radio-item",
|
|
2280
1986
|
"data-inset": inset,
|
|
2281
1987
|
className: (state) => cn2("relative flex cursor-default items-center gap-control-gap rounded-md py-1 pe-1.5 ps-7 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground focus:**:text-accent-foreground data-inset:ps-7 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
|
|
2282
1988
|
...props,
|
|
2283
1989
|
children: [
|
|
2284
|
-
/* @__PURE__ */
|
|
1990
|
+
/* @__PURE__ */ jsx19("span", {
|
|
2285
1991
|
className: "pointer-events-none absolute start-1.5 flex size-4 items-center justify-center [&_svg:not([class*='size-'])]:size-4",
|
|
2286
|
-
children: /* @__PURE__ */
|
|
2287
|
-
children: /* @__PURE__ */
|
|
1992
|
+
children: /* @__PURE__ */ jsx19(MenuPrimitive.RadioItemIndicator, {
|
|
1993
|
+
children: /* @__PURE__ */ jsx19(CheckIcon4, {})
|
|
2288
1994
|
})
|
|
2289
1995
|
}),
|
|
2290
1996
|
children
|
|
@@ -2292,7 +1998,7 @@ function MenubarRadioItem({ density, className, children, inset, ...props }) {
|
|
|
2292
1998
|
});
|
|
2293
1999
|
}
|
|
2294
2000
|
function MenubarLabel({ density, className, inset, ...props }) {
|
|
2295
|
-
return /* @__PURE__ */
|
|
2001
|
+
return /* @__PURE__ */ jsx19(DropdownMenuLabel2, {
|
|
2296
2002
|
density,
|
|
2297
2003
|
"data-slot": "menubar-label",
|
|
2298
2004
|
inset,
|
|
@@ -2301,7 +2007,7 @@ function MenubarLabel({ density, className, inset, ...props }) {
|
|
|
2301
2007
|
});
|
|
2302
2008
|
}
|
|
2303
2009
|
function MenubarSeparator({ density, className, ...props }) {
|
|
2304
|
-
return /* @__PURE__ */
|
|
2010
|
+
return /* @__PURE__ */ jsx19(DropdownMenuSeparator2, {
|
|
2305
2011
|
density,
|
|
2306
2012
|
"data-slot": "menubar-separator",
|
|
2307
2013
|
className: (state) => cn2("-mx-1 my-1 h-px bg-border", typeof className === "function" ? className(state) : className),
|
|
@@ -2309,7 +2015,7 @@ function MenubarSeparator({ density, className, ...props }) {
|
|
|
2309
2015
|
});
|
|
2310
2016
|
}
|
|
2311
2017
|
function MenubarShortcut({ density, className, ...props }) {
|
|
2312
|
-
return /* @__PURE__ */
|
|
2018
|
+
return /* @__PURE__ */ jsx19(DropdownMenuShortcut2, {
|
|
2313
2019
|
"data-density": density,
|
|
2314
2020
|
"data-slot": "menubar-shortcut",
|
|
2315
2021
|
className: cn2("ms-auto text-xs tracking-widest text-muted-foreground group-focus/menubar-item:text-accent-foreground", className),
|
|
@@ -2317,13 +2023,13 @@ function MenubarShortcut({ density, className, ...props }) {
|
|
|
2317
2023
|
});
|
|
2318
2024
|
}
|
|
2319
2025
|
function MenubarSub({ ...props }) {
|
|
2320
|
-
return /* @__PURE__ */
|
|
2026
|
+
return /* @__PURE__ */ jsx19(DropdownMenuSub2, {
|
|
2321
2027
|
"data-slot": "menubar-sub",
|
|
2322
2028
|
...props
|
|
2323
2029
|
});
|
|
2324
2030
|
}
|
|
2325
2031
|
function MenubarSubTrigger({ density, className, inset, ...props }) {
|
|
2326
|
-
return /* @__PURE__ */
|
|
2032
|
+
return /* @__PURE__ */ jsx19(DropdownMenuSubTrigger2, {
|
|
2327
2033
|
density,
|
|
2328
2034
|
"data-slot": "menubar-sub-trigger",
|
|
2329
2035
|
inset,
|
|
@@ -2332,7 +2038,7 @@ function MenubarSubTrigger({ density, className, inset, ...props }) {
|
|
|
2332
2038
|
});
|
|
2333
2039
|
}
|
|
2334
2040
|
function MenubarSubContent({ density, className, ...props }) {
|
|
2335
|
-
return /* @__PURE__ */
|
|
2041
|
+
return /* @__PURE__ */ jsx19(DropdownMenuSubContent2, {
|
|
2336
2042
|
density,
|
|
2337
2043
|
"data-slot": "menubar-sub-content",
|
|
2338
2044
|
className: (state) => cn2(" min-w-32 rounded-sm bg-popover p-1 text-popover-foreground shadow-frame border border-frame-edge border border-frame-edge shadow-frame duration-100 data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0 ", typeof className === "function" ? className(state) : className),
|
|
@@ -2340,10 +2046,10 @@ function MenubarSubContent({ density, className, ...props }) {
|
|
|
2340
2046
|
});
|
|
2341
2047
|
}
|
|
2342
2048
|
// src/components/NavigationMenu.tsx
|
|
2343
|
-
import { ChevronDownIcon as
|
|
2049
|
+
import { ChevronDownIcon as ChevronDownIcon4 } from "lucide-react";
|
|
2344
2050
|
import { NavigationMenu as NavigationMenuPrimitive } from "@base-ui/react/navigation-menu";
|
|
2345
|
-
import { cva as
|
|
2346
|
-
import { jsx as
|
|
2051
|
+
import { cva as cva3 } from "class-variance-authority";
|
|
2052
|
+
import { jsx as jsx20, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
2347
2053
|
function NavigationMenu({
|
|
2348
2054
|
density,
|
|
2349
2055
|
align = "start",
|
|
@@ -2352,14 +2058,14 @@ function NavigationMenu({
|
|
|
2352
2058
|
...props
|
|
2353
2059
|
}) {
|
|
2354
2060
|
const resolvedDensity = useDensity(density);
|
|
2355
|
-
return /* @__PURE__ */
|
|
2061
|
+
return /* @__PURE__ */ jsxs14(NavigationMenuPrimitive.Root, {
|
|
2356
2062
|
"data-density": resolvedDensity,
|
|
2357
2063
|
"data-slot": "navigation-menu",
|
|
2358
2064
|
className: (state) => cn2("group/navigation-menu relative flex max-w-max flex-1 items-center justify-center", typeof className === "function" ? className(state) : className),
|
|
2359
2065
|
...props,
|
|
2360
2066
|
children: [
|
|
2361
2067
|
children,
|
|
2362
|
-
/* @__PURE__ */
|
|
2068
|
+
/* @__PURE__ */ jsx20(NavigationMenuPositioner, {
|
|
2363
2069
|
density: resolvedDensity,
|
|
2364
2070
|
align
|
|
2365
2071
|
})
|
|
@@ -2367,7 +2073,7 @@ function NavigationMenu({
|
|
|
2367
2073
|
});
|
|
2368
2074
|
}
|
|
2369
2075
|
function NavigationMenuList({ density, className, ...props }) {
|
|
2370
|
-
return /* @__PURE__ */
|
|
2076
|
+
return /* @__PURE__ */ jsx20(NavigationMenuPrimitive.List, {
|
|
2371
2077
|
"data-density": density,
|
|
2372
2078
|
"data-slot": "navigation-menu-list",
|
|
2373
2079
|
className: (state) => cn2("group flex flex-1 list-none items-center justify-center gap-0", typeof className === "function" ? className(state) : className),
|
|
@@ -2375,16 +2081,16 @@ function NavigationMenuList({ density, className, ...props }) {
|
|
|
2375
2081
|
});
|
|
2376
2082
|
}
|
|
2377
2083
|
function NavigationMenuItem({ density, className, ...props }) {
|
|
2378
|
-
return /* @__PURE__ */
|
|
2084
|
+
return /* @__PURE__ */ jsx20(NavigationMenuPrimitive.Item, {
|
|
2379
2085
|
"data-density": density,
|
|
2380
2086
|
"data-slot": "navigation-menu-item",
|
|
2381
2087
|
className: (state) => cn2("relative", typeof className === "function" ? className(state) : className),
|
|
2382
2088
|
...props
|
|
2383
2089
|
});
|
|
2384
2090
|
}
|
|
2385
|
-
var navigationMenuTriggerStyle =
|
|
2091
|
+
var navigationMenuTriggerStyle = cva3("group/navigation-menu-trigger inline-flex h-control-lg w-max items-center justify-center rounded-sm px-control-x py-1.5 text-sm font-medium transition-colors outline-none hover:bg-muted focus:bg-muted focus-visible:ring-1 focus-visible:ring-ring focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-popup-open:bg-muted/50 data-popup-open:hover:bg-muted data-open:bg-muted/50 data-open:hover:bg-muted data-open:focus:bg-muted");
|
|
2386
2092
|
function NavigationMenuTrigger({ density, className, children, ...props }) {
|
|
2387
|
-
return /* @__PURE__ */
|
|
2093
|
+
return /* @__PURE__ */ jsxs14(NavigationMenuPrimitive.Trigger, {
|
|
2388
2094
|
"data-density": density,
|
|
2389
2095
|
"data-slot": "navigation-menu-trigger",
|
|
2390
2096
|
className: (state) => cn2(navigationMenuTriggerStyle(), "group", typeof className === "function" ? className(state) : className),
|
|
@@ -2392,12 +2098,12 @@ function NavigationMenuTrigger({ density, className, children, ...props }) {
|
|
|
2392
2098
|
children: [
|
|
2393
2099
|
children,
|
|
2394
2100
|
" ",
|
|
2395
|
-
/* @__PURE__ */
|
|
2101
|
+
/* @__PURE__ */ jsx20(NavigationMenuIndicator, {})
|
|
2396
2102
|
]
|
|
2397
2103
|
});
|
|
2398
2104
|
}
|
|
2399
2105
|
function NavigationMenuContent({ density, className, ...props }) {
|
|
2400
|
-
return /* @__PURE__ */
|
|
2106
|
+
return /* @__PURE__ */ jsx20(NavigationMenuPrimitive.Content, {
|
|
2401
2107
|
"data-density": density,
|
|
2402
2108
|
"data-slot": "navigation-menu-content",
|
|
2403
2109
|
className: (state) => cn2("data-ending-style:data-activation-direction=left:translate-x-[50%] data-ending-style:data-activation-direction=right:translate-x-[-50%] data-starting-style:data-activation-direction=left:translate-x-[-50%] data-starting-style:data-activation-direction=right:translate-x-[50%] h-full w-auto p-1 transition-[opacity,transform,translate] duration-[0.35s] ease-[cubic-bezier(0.22,1,0.36,1)] data-ending-style:opacity-0 data-starting-style:opacity-0 ", typeof className === "function" ? className(state) : className),
|
|
@@ -2417,12 +2123,12 @@ function NavigationMenuPositioner({
|
|
|
2417
2123
|
const direction = useDirection2();
|
|
2418
2124
|
const container = usePortalContainer2();
|
|
2419
2125
|
const portal = usePortalNode();
|
|
2420
|
-
return /* @__PURE__ */
|
|
2126
|
+
return /* @__PURE__ */ jsx20(NavigationMenuPrimitive.Portal, {
|
|
2421
2127
|
container,
|
|
2422
2128
|
ref: portal.ref,
|
|
2423
|
-
children: /* @__PURE__ */
|
|
2129
|
+
children: /* @__PURE__ */ jsx20(PortalProvider2, {
|
|
2424
2130
|
container: portal.node,
|
|
2425
|
-
children: /* @__PURE__ */
|
|
2131
|
+
children: /* @__PURE__ */ jsx20(NavigationMenuPrimitive.Positioner, {
|
|
2426
2132
|
dir: direction,
|
|
2427
2133
|
side,
|
|
2428
2134
|
sideOffset,
|
|
@@ -2430,11 +2136,11 @@ function NavigationMenuPositioner({
|
|
|
2430
2136
|
alignOffset,
|
|
2431
2137
|
className: (state) => cn2("isolate h-(--positioner-height) w-(--positioner-width) max-w-(--available-width) transition-[top,left,right,bottom] duration-[0.35s] ease-[cubic-bezier(0.22,1,0.36,1)] data-instant:transition-none data-[side=bottom]:before:top-[-10px] data-[side=bottom]:before:right-0 data-[side=bottom]:before:left-0", typeof className === "function" ? className(state) : className),
|
|
2432
2138
|
...props,
|
|
2433
|
-
children: /* @__PURE__ */
|
|
2139
|
+
children: /* @__PURE__ */ jsx20(NavigationMenuPrimitive.Popup, {
|
|
2434
2140
|
"data-density": resolvedDensity,
|
|
2435
2141
|
"data-slot": "navigation-menu-popup",
|
|
2436
2142
|
className: "data-[ending-style]:easing-[ease] xs:w-(--popup-width) relative h-(--popup-height) w-(--popup-width) origin-(--transform-origin) rounded-sm bg-popover text-popover-foreground border border-frame-edge shadow-frame transition-[opacity,transform,width,height,translate] duration-[0.35s] ease-[cubic-bezier(0.22,1,0.36,1)] outline-none data-ending-style:opacity-0 data-ending-style:duration-150 data-starting-style:opacity-0",
|
|
2437
|
-
children: /* @__PURE__ */
|
|
2143
|
+
children: /* @__PURE__ */ jsx20(NavigationMenuPrimitive.Viewport, {
|
|
2438
2144
|
className: "relative size-full overflow-hidden"
|
|
2439
2145
|
})
|
|
2440
2146
|
})
|
|
@@ -2443,7 +2149,7 @@ function NavigationMenuPositioner({
|
|
|
2443
2149
|
});
|
|
2444
2150
|
}
|
|
2445
2151
|
function NavigationMenuLink({ density, className, ...props }) {
|
|
2446
|
-
return /* @__PURE__ */
|
|
2152
|
+
return /* @__PURE__ */ jsx20(NavigationMenuPrimitive.Link, {
|
|
2447
2153
|
"data-density": density,
|
|
2448
2154
|
"data-slot": "navigation-menu-link",
|
|
2449
2155
|
className: (state) => cn2("flex items-center gap-2 rounded-sm p-2 text-sm transition-colors outline-none hover:bg-muted focus:bg-muted focus-visible:ring-1 focus-visible:ring-ring focus-visible:outline-1 in-data-[slot=navigation-menu-content]:rounded-md data-active:bg-muted/50 data-active:hover:bg-muted data-active:focus:bg-muted [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
|
|
@@ -2456,32 +2162,32 @@ function NavigationMenuIndicator({
|
|
|
2456
2162
|
children,
|
|
2457
2163
|
...props
|
|
2458
2164
|
}) {
|
|
2459
|
-
return /* @__PURE__ */
|
|
2165
|
+
return /* @__PURE__ */ jsx20(NavigationMenuPrimitive.Icon, {
|
|
2460
2166
|
"data-density": density,
|
|
2461
2167
|
"data-slot": "navigation-menu-indicator",
|
|
2462
2168
|
className: (state) => cn2("ms-1 inline-flex size-3 shrink-0 items-center justify-center transition-transform duration-120 data-popup-open:rotate-180 [&_svg]:size-full", typeof className === "function" ? className(state) : className),
|
|
2463
2169
|
...props,
|
|
2464
|
-
children: children ?? /* @__PURE__ */
|
|
2170
|
+
children: children ?? /* @__PURE__ */ jsx20(ChevronDownIcon4, {})
|
|
2465
2171
|
});
|
|
2466
2172
|
}
|
|
2467
2173
|
// src/components/Toast.tsx
|
|
2468
2174
|
import { Toast as ToastPrimitive } from "@base-ui/react/toast";
|
|
2469
2175
|
import { CircleCheckIcon, InfoIcon, TriangleAlertIcon, OctagonXIcon, LoaderCircleIcon, XIcon as XIcon2 } from "lucide-react";
|
|
2470
|
-
import { jsx as
|
|
2176
|
+
import { jsx as jsx21, jsxs as jsxs15, Fragment } from "react/jsx-runtime";
|
|
2471
2177
|
function ToastProvider(props) {
|
|
2472
|
-
return /* @__PURE__ */
|
|
2178
|
+
return /* @__PURE__ */ jsx21(ToastPrimitive.Provider, {
|
|
2473
2179
|
...props
|
|
2474
2180
|
});
|
|
2475
2181
|
}
|
|
2476
2182
|
function ToastPortal({ container, ref, children, ...props }) {
|
|
2477
2183
|
const resolvedContainer = usePortalContainer2(container);
|
|
2478
2184
|
const portal = usePortalNode(ref);
|
|
2479
|
-
return /* @__PURE__ */
|
|
2185
|
+
return /* @__PURE__ */ jsx21(ToastPrimitive.Portal, {
|
|
2480
2186
|
"data-slot": "toast-portal",
|
|
2481
2187
|
container: resolvedContainer,
|
|
2482
2188
|
ref: portal.ref,
|
|
2483
2189
|
...props,
|
|
2484
|
-
children: /* @__PURE__ */
|
|
2190
|
+
children: /* @__PURE__ */ jsx21(PortalProvider2, {
|
|
2485
2191
|
container: portal.node,
|
|
2486
2192
|
children
|
|
2487
2193
|
})
|
|
@@ -2490,7 +2196,7 @@ function ToastPortal({ container, ref, children, ...props }) {
|
|
|
2490
2196
|
function ToastViewport({ density, dir, className, ...props }) {
|
|
2491
2197
|
const resolvedDensity = useDensity(density);
|
|
2492
2198
|
const inheritedDirection = useDirection2();
|
|
2493
|
-
return /* @__PURE__ */
|
|
2199
|
+
return /* @__PURE__ */ jsx21(ToastPrimitive.Viewport, {
|
|
2494
2200
|
dir: dir ?? inheritedDirection,
|
|
2495
2201
|
"data-density": resolvedDensity,
|
|
2496
2202
|
"data-slot": "toast-viewport",
|
|
@@ -2499,7 +2205,7 @@ function ToastViewport({ density, dir, className, ...props }) {
|
|
|
2499
2205
|
});
|
|
2500
2206
|
}
|
|
2501
2207
|
function Toast({ density, className, ...props }) {
|
|
2502
|
-
return /* @__PURE__ */
|
|
2208
|
+
return /* @__PURE__ */ jsx21(ToastPrimitive.Root, {
|
|
2503
2209
|
"data-density": density,
|
|
2504
2210
|
"data-slot": "toast",
|
|
2505
2211
|
className: (state) => cn2("group/toast pointer-events-auto absolute right-0 bottom-0 w-full rounded-md border border-frame-edge bg-popover text-popover-foreground shadow-frame outline-none select-none focus-visible:ring-1 focus-visible:ring-ring [--offset-y:calc(var(--toast-offset-y)*-1-var(--toast-index)*var(--spacing-panel))] [transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--offset-y)+var(--toast-swipe-movement-y)))] transition-[transform,opacity] duration-120 ease-out data-limited:opacity-0 data-starting-style:opacity-0 data-ending-style:opacity-0 motion-reduce:transition-none", typeof className === "function" ? className(state) : className),
|
|
@@ -2507,21 +2213,21 @@ function Toast({ density, className, ...props }) {
|
|
|
2507
2213
|
});
|
|
2508
2214
|
}
|
|
2509
2215
|
function ToastContent({ className, ...props }) {
|
|
2510
|
-
return /* @__PURE__ */
|
|
2216
|
+
return /* @__PURE__ */ jsx21(ToastPrimitive.Content, {
|
|
2511
2217
|
"data-slot": "toast-content",
|
|
2512
2218
|
className: (state) => cn2("flex items-center gap-control-gap p-panel", typeof className === "function" ? className(state) : className),
|
|
2513
2219
|
...props
|
|
2514
2220
|
});
|
|
2515
2221
|
}
|
|
2516
2222
|
function ToastTitle({ className, ...props }) {
|
|
2517
|
-
return /* @__PURE__ */
|
|
2223
|
+
return /* @__PURE__ */ jsx21(ToastPrimitive.Title, {
|
|
2518
2224
|
"data-slot": "toast-title",
|
|
2519
2225
|
className: (state) => cn2("text-sm font-medium", typeof className === "function" ? className(state) : className),
|
|
2520
2226
|
...props
|
|
2521
2227
|
});
|
|
2522
2228
|
}
|
|
2523
2229
|
function ToastDescription({ className, ...props }) {
|
|
2524
|
-
return /* @__PURE__ */
|
|
2230
|
+
return /* @__PURE__ */ jsx21(ToastPrimitive.Description, {
|
|
2525
2231
|
"data-slot": "toast-description",
|
|
2526
2232
|
className: (state) => cn2("text-sm text-muted-foreground", typeof className === "function" ? className(state) : className),
|
|
2527
2233
|
...props
|
|
@@ -2529,13 +2235,13 @@ function ToastDescription({ className, ...props }) {
|
|
|
2529
2235
|
}
|
|
2530
2236
|
function ToastAction({
|
|
2531
2237
|
className,
|
|
2532
|
-
render = /* @__PURE__ */
|
|
2238
|
+
render = /* @__PURE__ */ jsx21(Button2, {
|
|
2533
2239
|
variant: "outline",
|
|
2534
2240
|
size: "sm"
|
|
2535
2241
|
}),
|
|
2536
2242
|
...props
|
|
2537
2243
|
}) {
|
|
2538
|
-
return /* @__PURE__ */
|
|
2244
|
+
return /* @__PURE__ */ jsx21(ToastPrimitive.Action, {
|
|
2539
2245
|
"data-slot": "toast-action",
|
|
2540
2246
|
render,
|
|
2541
2247
|
className: (state) => cn2("shrink-0", typeof className === "function" ? className(state) : className),
|
|
@@ -2545,19 +2251,19 @@ function ToastAction({
|
|
|
2545
2251
|
function ToastClose({
|
|
2546
2252
|
className,
|
|
2547
2253
|
children,
|
|
2548
|
-
render = /* @__PURE__ */
|
|
2254
|
+
render = /* @__PURE__ */ jsx21(Button2, {
|
|
2549
2255
|
variant: "ghost",
|
|
2550
2256
|
size: "icon-sm"
|
|
2551
2257
|
}),
|
|
2552
2258
|
...props
|
|
2553
2259
|
}) {
|
|
2554
|
-
return /* @__PURE__ */
|
|
2260
|
+
return /* @__PURE__ */ jsx21(ToastPrimitive.Close, {
|
|
2555
2261
|
"data-slot": "toast-close",
|
|
2556
2262
|
"aria-label": "Close toast",
|
|
2557
2263
|
render,
|
|
2558
2264
|
className: (state) => cn2("relative shrink-0 text-muted-foreground hover:text-foreground", typeof className === "function" ? className(state) : className),
|
|
2559
2265
|
...props,
|
|
2560
|
-
children: children ?? /* @__PURE__ */
|
|
2266
|
+
children: children ?? /* @__PURE__ */ jsx21(XIcon2, {
|
|
2561
2267
|
"aria-hidden": "true"
|
|
2562
2268
|
})
|
|
2563
2269
|
});
|
|
@@ -2565,24 +2271,24 @@ function ToastClose({
|
|
|
2565
2271
|
function ToastIcon({ type }) {
|
|
2566
2272
|
switch (type) {
|
|
2567
2273
|
case "success":
|
|
2568
|
-
return /* @__PURE__ */
|
|
2274
|
+
return /* @__PURE__ */ jsx21(CircleCheckIcon, {
|
|
2569
2275
|
"aria-hidden": "true"
|
|
2570
2276
|
});
|
|
2571
2277
|
case "info":
|
|
2572
|
-
return /* @__PURE__ */
|
|
2278
|
+
return /* @__PURE__ */ jsx21(InfoIcon, {
|
|
2573
2279
|
"aria-hidden": "true"
|
|
2574
2280
|
});
|
|
2575
2281
|
case "warning":
|
|
2576
|
-
return /* @__PURE__ */
|
|
2282
|
+
return /* @__PURE__ */ jsx21(TriangleAlertIcon, {
|
|
2577
2283
|
"aria-hidden": "true"
|
|
2578
2284
|
});
|
|
2579
2285
|
case "error":
|
|
2580
|
-
return /* @__PURE__ */
|
|
2286
|
+
return /* @__PURE__ */ jsx21(OctagonXIcon, {
|
|
2581
2287
|
"aria-hidden": "true",
|
|
2582
2288
|
className: "text-destructive"
|
|
2583
2289
|
});
|
|
2584
2290
|
case "loading":
|
|
2585
|
-
return /* @__PURE__ */
|
|
2291
|
+
return /* @__PURE__ */ jsx21(LoaderCircleIcon, {
|
|
2586
2292
|
"aria-hidden": "true",
|
|
2587
2293
|
className: "animate-spin motion-reduce:animate-none"
|
|
2588
2294
|
});
|
|
@@ -2592,41 +2298,41 @@ function ToastIcon({ type }) {
|
|
|
2592
2298
|
}
|
|
2593
2299
|
function ToastList() {
|
|
2594
2300
|
const { toasts } = ToastPrimitive.useToastManager();
|
|
2595
|
-
return /* @__PURE__ */
|
|
2596
|
-
children: toasts.map((toastItem) => /* @__PURE__ */
|
|
2301
|
+
return /* @__PURE__ */ jsx21(Fragment, {
|
|
2302
|
+
children: toasts.map((toastItem) => /* @__PURE__ */ jsx21(Toast, {
|
|
2597
2303
|
toast: toastItem,
|
|
2598
|
-
children: /* @__PURE__ */
|
|
2304
|
+
children: /* @__PURE__ */ jsxs15(ToastContent, {
|
|
2599
2305
|
children: [
|
|
2600
|
-
/* @__PURE__ */
|
|
2306
|
+
/* @__PURE__ */ jsx21("span", {
|
|
2601
2307
|
"data-slot": "toast-icon",
|
|
2602
2308
|
className: "shrink-0 empty:hidden [&_svg]:size-4",
|
|
2603
|
-
children: /* @__PURE__ */
|
|
2309
|
+
children: /* @__PURE__ */ jsx21(ToastIcon, {
|
|
2604
2310
|
type: toastItem.type
|
|
2605
2311
|
})
|
|
2606
2312
|
}),
|
|
2607
|
-
/* @__PURE__ */
|
|
2313
|
+
/* @__PURE__ */ jsxs15("div", {
|
|
2608
2314
|
className: "flex min-w-0 flex-1 flex-col gap-1",
|
|
2609
2315
|
children: [
|
|
2610
|
-
/* @__PURE__ */
|
|
2611
|
-
/* @__PURE__ */
|
|
2316
|
+
/* @__PURE__ */ jsx21(ToastTitle, {}),
|
|
2317
|
+
/* @__PURE__ */ jsx21(ToastDescription, {})
|
|
2612
2318
|
]
|
|
2613
2319
|
}),
|
|
2614
|
-
/* @__PURE__ */
|
|
2615
|
-
/* @__PURE__ */
|
|
2320
|
+
/* @__PURE__ */ jsx21(ToastAction, {}),
|
|
2321
|
+
/* @__PURE__ */ jsx21(ToastClose, {})
|
|
2616
2322
|
]
|
|
2617
2323
|
})
|
|
2618
2324
|
}, toastItem.id))
|
|
2619
2325
|
});
|
|
2620
2326
|
}
|
|
2621
2327
|
function ToastToaster({ children, density, ...props }) {
|
|
2622
|
-
return /* @__PURE__ */
|
|
2328
|
+
return /* @__PURE__ */ jsxs15(ToastProvider, {
|
|
2623
2329
|
...props,
|
|
2624
2330
|
children: [
|
|
2625
2331
|
children,
|
|
2626
|
-
/* @__PURE__ */
|
|
2627
|
-
children: /* @__PURE__ */
|
|
2332
|
+
/* @__PURE__ */ jsx21(ToastPortal, {
|
|
2333
|
+
children: /* @__PURE__ */ jsx21(ToastViewport, {
|
|
2628
2334
|
density,
|
|
2629
|
-
children: /* @__PURE__ */
|
|
2335
|
+
children: /* @__PURE__ */ jsx21(ToastList, {})
|
|
2630
2336
|
})
|
|
2631
2337
|
})
|
|
2632
2338
|
]
|
|
@@ -2639,11 +2345,11 @@ function useToastManager() {
|
|
|
2639
2345
|
return Toast2.useToastManager();
|
|
2640
2346
|
}
|
|
2641
2347
|
// src/components/Marker.tsx
|
|
2642
|
-
import { mergeProps as
|
|
2643
|
-
import { useRender as
|
|
2644
|
-
import { cva as
|
|
2645
|
-
import { jsx as
|
|
2646
|
-
var markerVariants =
|
|
2348
|
+
import { mergeProps as mergeProps6 } from "@base-ui/react/merge-props";
|
|
2349
|
+
import { useRender as useRender6 } from "@base-ui/react/use-render";
|
|
2350
|
+
import { cva as cva4 } from "class-variance-authority";
|
|
2351
|
+
import { jsx as jsx22 } from "react/jsx-runtime";
|
|
2352
|
+
var markerVariants = cva4("group/marker relative flex min-h-4 w-full items-center gap-control-gap text-start text-sm text-muted-foreground [&_svg:not([class*='size-'])]:size-4 [a]:underline [a]:underline-offset-3 [a]:hover:text-foreground [&:is(a,button)]:outline-none [&:is(a,button)]:focus-visible:outline-1 [&:is(a,button)]:focus-visible:outline-ring", {
|
|
2647
2353
|
variants: {
|
|
2648
2354
|
variant: {
|
|
2649
2355
|
default: "",
|
|
@@ -2653,15 +2359,15 @@ var markerVariants = cva5("group/marker relative flex min-h-4 w-full items-cente
|
|
|
2653
2359
|
}
|
|
2654
2360
|
});
|
|
2655
2361
|
function Marker({ density, className, variant = "default", render, ...props }) {
|
|
2656
|
-
return
|
|
2362
|
+
return useRender6({
|
|
2657
2363
|
defaultTagName: "div",
|
|
2658
|
-
props:
|
|
2364
|
+
props: mergeProps6({ className: cn2(markerVariants({ variant, className })) }, props),
|
|
2659
2365
|
render,
|
|
2660
2366
|
state: { slot: "marker", variant, density }
|
|
2661
2367
|
});
|
|
2662
2368
|
}
|
|
2663
2369
|
function MarkerIcon({ density, className, ...props }) {
|
|
2664
|
-
return /* @__PURE__ */
|
|
2370
|
+
return /* @__PURE__ */ jsx22("span", {
|
|
2665
2371
|
"data-density": density,
|
|
2666
2372
|
"data-slot": "marker-icon",
|
|
2667
2373
|
"aria-hidden": "true",
|
|
@@ -2670,7 +2376,7 @@ function MarkerIcon({ density, className, ...props }) {
|
|
|
2670
2376
|
});
|
|
2671
2377
|
}
|
|
2672
2378
|
function MarkerContent({ density, className, ...props }) {
|
|
2673
|
-
return /* @__PURE__ */
|
|
2379
|
+
return /* @__PURE__ */ jsx22("span", {
|
|
2674
2380
|
"data-density": density,
|
|
2675
2381
|
"data-slot": "marker-content",
|
|
2676
2382
|
className: cn2("min-w-0 wrap-break-word group-data-[variant=separator]/marker:text-center [&>a]:underline [&>a]:underline-offset-3 [&>a:hover]:text-foreground", className),
|
|
@@ -2678,19 +2384,19 @@ function MarkerContent({ density, className, ...props }) {
|
|
|
2678
2384
|
});
|
|
2679
2385
|
}
|
|
2680
2386
|
// src/components/Bubble.tsx
|
|
2681
|
-
import { mergeProps as
|
|
2682
|
-
import { useRender as
|
|
2683
|
-
import { cva as
|
|
2684
|
-
import { jsx as
|
|
2387
|
+
import { mergeProps as mergeProps7 } from "@base-ui/react/merge-props";
|
|
2388
|
+
import { useRender as useRender7 } from "@base-ui/react/use-render";
|
|
2389
|
+
import { cva as cva5 } from "class-variance-authority";
|
|
2390
|
+
import { jsx as jsx23 } from "react/jsx-runtime";
|
|
2685
2391
|
function BubbleGroup({ density, className, ...props }) {
|
|
2686
|
-
return /* @__PURE__ */
|
|
2392
|
+
return /* @__PURE__ */ jsx23("div", {
|
|
2687
2393
|
"data-density": density,
|
|
2688
2394
|
"data-slot": "bubble-group",
|
|
2689
2395
|
className: cn2("flex min-w-0 flex-col gap-control-gap", className),
|
|
2690
2396
|
...props
|
|
2691
2397
|
});
|
|
2692
2398
|
}
|
|
2693
|
-
var bubbleVariants =
|
|
2399
|
+
var bubbleVariants = cva5("group/bubble relative flex w-fit max-w-[80%] min-w-0 flex-col gap-1 group-data-[align=end]/message:self-end data-[align=end]:self-end data-[variant=ghost]:max-w-full", {
|
|
2694
2400
|
variants: {
|
|
2695
2401
|
variant: {
|
|
2696
2402
|
default: "*:data-[slot=bubble-content]:bg-primary *:data-[slot=bubble-content]:text-primary-foreground [&>[data-slot=bubble-content]:is(button,a):hover]:bg-primary/80",
|
|
@@ -2705,7 +2411,7 @@ var bubbleVariants = cva6("group/bubble relative flex w-fit max-w-[80%] min-w-0
|
|
|
2705
2411
|
defaultVariants: { variant: "default" }
|
|
2706
2412
|
});
|
|
2707
2413
|
function Bubble({ density, variant = "default", align = "start", className, ...props }) {
|
|
2708
|
-
return /* @__PURE__ */
|
|
2414
|
+
return /* @__PURE__ */ jsx23("div", {
|
|
2709
2415
|
"data-density": density,
|
|
2710
2416
|
"data-slot": "bubble",
|
|
2711
2417
|
"data-variant": variant,
|
|
@@ -2715,16 +2421,16 @@ function Bubble({ density, variant = "default", align = "start", className, ...p
|
|
|
2715
2421
|
});
|
|
2716
2422
|
}
|
|
2717
2423
|
function BubbleContent({ density, className, render, ...props }) {
|
|
2718
|
-
return
|
|
2424
|
+
return useRender7({
|
|
2719
2425
|
defaultTagName: "div",
|
|
2720
|
-
props:
|
|
2426
|
+
props: mergeProps7({
|
|
2721
2427
|
className: cn2("w-fit max-w-full min-w-0 overflow-hidden rounded-sm border border-transparent px-control-x py-control-gap text-sm leading-relaxed wrap-break-word group-data-[align=end]/bubble:self-end [&:is(button)]:text-start [&:is(button,a)]:transition-colors motion-reduce:transition-none [&:is(button,a)]:outline-none [&:is(button,a)]:focus-visible:border-ring [&:is(button,a)]:focus-visible:ring-1 [&:is(button,a)]:focus-visible:ring-ring", className)
|
|
2722
2428
|
}, props),
|
|
2723
2429
|
render,
|
|
2724
2430
|
state: { slot: "bubble-content", density }
|
|
2725
2431
|
});
|
|
2726
2432
|
}
|
|
2727
|
-
var bubbleReactionsVariants =
|
|
2433
|
+
var bubbleReactionsVariants = cva5("absolute z-10 flex w-fit shrink-0 items-center justify-center gap-1 rounded-sm border border-border bg-muted px-1.5 py-0.5 text-sm ring-2 ring-card has-[button]:p-0", {
|
|
2728
2434
|
variants: {
|
|
2729
2435
|
side: { top: "top-0 -translate-y-3/4", bottom: "bottom-0 translate-y-3/4" },
|
|
2730
2436
|
align: { start: "start-3", end: "end-3" }
|
|
@@ -2738,7 +2444,7 @@ function BubbleReactions({
|
|
|
2738
2444
|
className,
|
|
2739
2445
|
...props
|
|
2740
2446
|
}) {
|
|
2741
|
-
return /* @__PURE__ */
|
|
2447
|
+
return /* @__PURE__ */ jsx23("div", {
|
|
2742
2448
|
"data-density": density,
|
|
2743
2449
|
"data-slot": "bubble-reactions",
|
|
2744
2450
|
"data-align": align,
|
|
@@ -2748,17 +2454,17 @@ function BubbleReactions({
|
|
|
2748
2454
|
});
|
|
2749
2455
|
}
|
|
2750
2456
|
// src/components/Message.tsx
|
|
2751
|
-
import { useContext as
|
|
2752
|
-
import { useRender as
|
|
2457
|
+
import { useContext as useContext2, useLayoutEffect, useMemo as useMemo3, useRef as useRef2, useState } from "react";
|
|
2458
|
+
import { useRender as useRender8 } from "@base-ui/react/use-render";
|
|
2753
2459
|
|
|
2754
2460
|
// src/message/MessageContext.ts
|
|
2755
|
-
import { createContext as
|
|
2756
|
-
var MessageContext =
|
|
2461
|
+
import { createContext as createContext2 } from "react";
|
|
2462
|
+
var MessageContext = createContext2(null);
|
|
2757
2463
|
|
|
2758
2464
|
// src/components/Message.tsx
|
|
2759
|
-
import { jsx as
|
|
2465
|
+
import { jsx as jsx24 } from "react/jsx-runtime";
|
|
2760
2466
|
function MessageGroup({ density, className, ...props }) {
|
|
2761
|
-
return /* @__PURE__ */
|
|
2467
|
+
return /* @__PURE__ */ jsx24("div", {
|
|
2762
2468
|
"data-density": density,
|
|
2763
2469
|
"data-slot": "message-group",
|
|
2764
2470
|
className: cn2("flex min-w-0 flex-col gap-control-gap", className),
|
|
@@ -2766,12 +2472,12 @@ function MessageGroup({ density, className, ...props }) {
|
|
|
2766
2472
|
});
|
|
2767
2473
|
}
|
|
2768
2474
|
function Message({ density, className, align = "start", style, ...props }) {
|
|
2769
|
-
const [footerOffset, setFooterOffset] =
|
|
2475
|
+
const [footerOffset, setFooterOffset] = useState(0);
|
|
2770
2476
|
const context = useMemo3(() => ({ setFooterOffset }), []);
|
|
2771
2477
|
const messageStyle = { ...style, "--message-footer-offset": `${footerOffset}px` };
|
|
2772
|
-
return /* @__PURE__ */
|
|
2478
|
+
return /* @__PURE__ */ jsx24(MessageContext.Provider, {
|
|
2773
2479
|
value: context,
|
|
2774
|
-
children: /* @__PURE__ */
|
|
2480
|
+
children: /* @__PURE__ */ jsx24("div", {
|
|
2775
2481
|
"data-density": density,
|
|
2776
2482
|
"data-slot": "message",
|
|
2777
2483
|
"data-align": align,
|
|
@@ -2782,7 +2488,7 @@ function Message({ density, className, align = "start", style, ...props }) {
|
|
|
2782
2488
|
});
|
|
2783
2489
|
}
|
|
2784
2490
|
function MessageAvatar({ density, className, ...props }) {
|
|
2785
|
-
return /* @__PURE__ */
|
|
2491
|
+
return /* @__PURE__ */ jsx24("div", {
|
|
2786
2492
|
"data-density": density,
|
|
2787
2493
|
"data-slot": "message-avatar",
|
|
2788
2494
|
className: cn2("flex w-fit min-w-8 shrink-0 items-center justify-center self-end overflow-hidden rounded-full bg-muted group-has-data-[slot=message-footer]/message:-translate-y-(--message-footer-offset)", className),
|
|
@@ -2790,7 +2496,7 @@ function MessageAvatar({ density, className, ...props }) {
|
|
|
2790
2496
|
});
|
|
2791
2497
|
}
|
|
2792
2498
|
function MessageContent({ density, className, ...props }) {
|
|
2793
|
-
return /* @__PURE__ */
|
|
2499
|
+
return /* @__PURE__ */ jsx24("div", {
|
|
2794
2500
|
"data-density": density,
|
|
2795
2501
|
"data-slot": "message-content",
|
|
2796
2502
|
className: cn2("flex w-full min-w-0 flex-col gap-control-gap wrap-break-word group-data-[align=end]/message:[&>[data-slot]:not([data-slot=message-header])]:self-end", className),
|
|
@@ -2798,7 +2504,7 @@ function MessageContent({ density, className, ...props }) {
|
|
|
2798
2504
|
});
|
|
2799
2505
|
}
|
|
2800
2506
|
function MessageHeader({ density, className, ...props }) {
|
|
2801
|
-
return /* @__PURE__ */
|
|
2507
|
+
return /* @__PURE__ */ jsx24("div", {
|
|
2802
2508
|
"data-density": density,
|
|
2803
2509
|
"data-slot": "message-header",
|
|
2804
2510
|
className: cn2("flex max-w-full min-w-0 items-center px-control-x text-xs font-medium text-muted-foreground group-has-data-[variant=ghost]/message:px-0", className),
|
|
@@ -2806,8 +2512,8 @@ function MessageHeader({ density, className, ...props }) {
|
|
|
2806
2512
|
});
|
|
2807
2513
|
}
|
|
2808
2514
|
function MessageFooter({ density, className, ...props }) {
|
|
2809
|
-
const context =
|
|
2810
|
-
const footerRef =
|
|
2515
|
+
const context = useContext2(MessageContext);
|
|
2516
|
+
const footerRef = useRef2(null);
|
|
2811
2517
|
useLayoutEffect(() => {
|
|
2812
2518
|
const footer = footerRef.current;
|
|
2813
2519
|
const content = footer?.parentElement;
|
|
@@ -2826,7 +2532,7 @@ function MessageFooter({ density, className, ...props }) {
|
|
|
2826
2532
|
context.setFooterOffset(0);
|
|
2827
2533
|
};
|
|
2828
2534
|
}, [context]);
|
|
2829
|
-
return
|
|
2535
|
+
return useRender8({
|
|
2830
2536
|
defaultTagName: "div",
|
|
2831
2537
|
ref: footerRef,
|
|
2832
2538
|
state: { slot: "message-footer", density },
|
|
@@ -2837,11 +2543,11 @@ function MessageFooter({ density, className, ...props }) {
|
|
|
2837
2543
|
});
|
|
2838
2544
|
}
|
|
2839
2545
|
// src/components/Attachment.tsx
|
|
2840
|
-
import { mergeProps as
|
|
2841
|
-
import { useRender as
|
|
2842
|
-
import { cva as
|
|
2843
|
-
import { jsx as
|
|
2844
|
-
var attachmentVariants =
|
|
2546
|
+
import { mergeProps as mergeProps8 } from "@base-ui/react/merge-props";
|
|
2547
|
+
import { useRender as useRender9 } from "@base-ui/react/use-render";
|
|
2548
|
+
import { cva as cva6 } from "class-variance-authority";
|
|
2549
|
+
import { jsx as jsx25 } from "react/jsx-runtime";
|
|
2550
|
+
var attachmentVariants = cva6("group/attachment relative flex w-fit max-w-full min-w-0 shrink-0 flex-wrap rounded-md border bg-card text-card-foreground transition-colors motion-reduce:transition-none focus-within:ring-1 focus-within:ring-ring has-[>a,>button]:hover:bg-muted/50 data-[state=error]:border-destructive data-[state=idle]:border-dashed", {
|
|
2845
2551
|
variants: {
|
|
2846
2552
|
size: {
|
|
2847
2553
|
default: "gap-control-gap text-sm has-data-[slot=attachment-content]:px-control-x has-data-[slot=attachment-content]:py-control-gap has-data-[slot=attachment-media]:p-control-gap",
|
|
@@ -2862,7 +2568,7 @@ function Attachment({
|
|
|
2862
2568
|
orientation = "horizontal",
|
|
2863
2569
|
...props
|
|
2864
2570
|
}) {
|
|
2865
|
-
return /* @__PURE__ */
|
|
2571
|
+
return /* @__PURE__ */ jsx25("div", {
|
|
2866
2572
|
"data-slot": "attachment",
|
|
2867
2573
|
"data-density": density,
|
|
2868
2574
|
"data-state": state,
|
|
@@ -2872,7 +2578,7 @@ function Attachment({
|
|
|
2872
2578
|
...props
|
|
2873
2579
|
});
|
|
2874
2580
|
}
|
|
2875
|
-
var attachmentMediaVariants =
|
|
2581
|
+
var attachmentMediaVariants = cva6("relative flex aspect-square w-10 shrink-0 items-center justify-center overflow-hidden rounded-sm bg-muted text-foreground group-data-[orientation=vertical]/attachment:w-full group-data-[orientation=horizontal]/attachment:group-data-[size=sm]/attachment:w-8 group-data-[orientation=horizontal]/attachment:group-data-[size=xs]/attachment:w-7 group-data-[state=error]/attachment:bg-destructive/10 group-data-[state=error]/attachment:text-destructive group-data-[orientation=vertical]/attachment:*:data-[slot=spinner]:size-6! [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 group-data-[orientation=vertical]/attachment:[&_svg:not([class*='size-'])]:size-6 group-data-[size=xs]/attachment:[&_svg:not([class*='size-'])]:size-3.5", {
|
|
2876
2582
|
variants: {
|
|
2877
2583
|
variant: {
|
|
2878
2584
|
icon: "",
|
|
@@ -2882,7 +2588,7 @@ var attachmentMediaVariants = cva7("relative flex aspect-square w-10 shrink-0 it
|
|
|
2882
2588
|
defaultVariants: { variant: "icon" }
|
|
2883
2589
|
});
|
|
2884
2590
|
function AttachmentMedia({ density, className, variant = "icon", ...props }) {
|
|
2885
|
-
return /* @__PURE__ */
|
|
2591
|
+
return /* @__PURE__ */ jsx25("div", {
|
|
2886
2592
|
"data-slot": "attachment-media",
|
|
2887
2593
|
"data-density": density,
|
|
2888
2594
|
"data-variant": variant,
|
|
@@ -2891,7 +2597,7 @@ function AttachmentMedia({ density, className, variant = "icon", ...props }) {
|
|
|
2891
2597
|
});
|
|
2892
2598
|
}
|
|
2893
2599
|
function AttachmentContent({ density, className, ...props }) {
|
|
2894
|
-
return /* @__PURE__ */
|
|
2600
|
+
return /* @__PURE__ */ jsx25("div", {
|
|
2895
2601
|
"data-slot": "attachment-content",
|
|
2896
2602
|
"data-density": density,
|
|
2897
2603
|
className: cn2("max-w-full min-w-0 flex-1 leading-tight group-data-[orientation=vertical]/attachment:px-1", className),
|
|
@@ -2899,7 +2605,7 @@ function AttachmentContent({ density, className, ...props }) {
|
|
|
2899
2605
|
});
|
|
2900
2606
|
}
|
|
2901
2607
|
function AttachmentTitle({ density, className, ...props }) {
|
|
2902
|
-
return /* @__PURE__ */
|
|
2608
|
+
return /* @__PURE__ */ jsx25("span", {
|
|
2903
2609
|
"data-slot": "attachment-title",
|
|
2904
2610
|
"data-density": density,
|
|
2905
2611
|
className: cn2("block max-w-full min-w-0 truncate font-medium group-data-[state=processing]/attachment:shimmer group-data-[state=uploading]/attachment:shimmer", className),
|
|
@@ -2907,7 +2613,7 @@ function AttachmentTitle({ density, className, ...props }) {
|
|
|
2907
2613
|
});
|
|
2908
2614
|
}
|
|
2909
2615
|
function AttachmentDescription({ density, className, ...props }) {
|
|
2910
|
-
return /* @__PURE__ */
|
|
2616
|
+
return /* @__PURE__ */ jsx25("span", {
|
|
2911
2617
|
"data-slot": "attachment-description",
|
|
2912
2618
|
"data-density": density,
|
|
2913
2619
|
className: cn2("mt-0.5 block max-w-full min-w-0 truncate text-xs text-muted-foreground group-data-[state=error]/attachment:text-destructive", className),
|
|
@@ -2915,7 +2621,7 @@ function AttachmentDescription({ density, className, ...props }) {
|
|
|
2915
2621
|
});
|
|
2916
2622
|
}
|
|
2917
2623
|
function AttachmentActions({ density, className, ...props }) {
|
|
2918
|
-
return /* @__PURE__ */
|
|
2624
|
+
return /* @__PURE__ */ jsx25("div", {
|
|
2919
2625
|
"data-slot": "attachment-actions",
|
|
2920
2626
|
"data-density": density,
|
|
2921
2627
|
className: cn2("relative z-20 flex shrink-0 items-center group-data-[orientation=vertical]/attachment:absolute group-data-[orientation=vertical]/attachment:top-3 group-data-[orientation=vertical]/attachment:end-3 group-data-[orientation=vertical]/attachment:gap-1", className),
|
|
@@ -2928,7 +2634,7 @@ function AttachmentAction({
|
|
|
2928
2634
|
size = "icon-xs",
|
|
2929
2635
|
...props
|
|
2930
2636
|
}) {
|
|
2931
|
-
return /* @__PURE__ */
|
|
2637
|
+
return /* @__PURE__ */ jsx25(Button2, {
|
|
2932
2638
|
"data-slot": "attachment-action",
|
|
2933
2639
|
variant,
|
|
2934
2640
|
size,
|
|
@@ -2937,15 +2643,15 @@ function AttachmentAction({
|
|
|
2937
2643
|
});
|
|
2938
2644
|
}
|
|
2939
2645
|
function AttachmentTrigger({ density, className, render, type, ...props }) {
|
|
2940
|
-
return
|
|
2646
|
+
return useRender9({
|
|
2941
2647
|
defaultTagName: "button",
|
|
2942
|
-
props:
|
|
2648
|
+
props: mergeProps8({ type: render ? type : type ?? "button", className: cn2("absolute inset-0 z-10 outline-none", className) }, props),
|
|
2943
2649
|
render,
|
|
2944
2650
|
state: { slot: "attachment-trigger", density }
|
|
2945
2651
|
});
|
|
2946
2652
|
}
|
|
2947
2653
|
function AttachmentGroup({ density, className, ...props }) {
|
|
2948
|
-
return /* @__PURE__ */
|
|
2654
|
+
return /* @__PURE__ */ jsx25("div", {
|
|
2949
2655
|
"data-slot": "attachment-group",
|
|
2950
2656
|
"data-density": density,
|
|
2951
2657
|
className: cn2("flex min-w-0 scroll-fade-x snap-x snap-mandatory scroll-px-1 no-scrollbar gap-3 overflow-x-auto overscroll-x-contain py-1 *:data-[slot=attachment]:flex-none *:data-[slot=attachment]:snap-start", className),
|
|
@@ -2953,8 +2659,8 @@ function AttachmentGroup({ density, className, ...props }) {
|
|
|
2953
2659
|
});
|
|
2954
2660
|
}
|
|
2955
2661
|
// src/components/InlineEdit.tsx
|
|
2956
|
-
import { useEffect as
|
|
2957
|
-
import { jsx as
|
|
2662
|
+
import { useEffect as useEffect2, useRef as useRef3, useState as useState2 } from "react";
|
|
2663
|
+
import { jsx as jsx26, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
2958
2664
|
function InlineEdit({
|
|
2959
2665
|
label,
|
|
2960
2666
|
value,
|
|
@@ -2965,11 +2671,12 @@ function InlineEdit({
|
|
|
2965
2671
|
onCommit,
|
|
2966
2672
|
onCancel
|
|
2967
2673
|
}) {
|
|
2968
|
-
const input =
|
|
2969
|
-
const isFinished =
|
|
2970
|
-
const
|
|
2971
|
-
const [
|
|
2972
|
-
|
|
2674
|
+
const input = useRef3(null);
|
|
2675
|
+
const isFinished = useRef3(false);
|
|
2676
|
+
const shouldCancel = useRef3(false);
|
|
2677
|
+
const [isSaving, setSaving] = useState2(false);
|
|
2678
|
+
const [error, setError] = useState2("");
|
|
2679
|
+
useEffect2(() => {
|
|
2973
2680
|
input.current?.focus();
|
|
2974
2681
|
if (shouldSelectOnMount)
|
|
2975
2682
|
input.current?.select();
|
|
@@ -2989,14 +2696,14 @@ function InlineEdit({
|
|
|
2989
2696
|
setSaving(false);
|
|
2990
2697
|
}
|
|
2991
2698
|
};
|
|
2992
|
-
return /* @__PURE__ */
|
|
2699
|
+
return /* @__PURE__ */ jsxs16("form", {
|
|
2993
2700
|
className: "flex min-w-0 flex-col gap-1",
|
|
2994
2701
|
onSubmit: (event) => {
|
|
2995
2702
|
event.preventDefault();
|
|
2996
2703
|
save();
|
|
2997
2704
|
},
|
|
2998
2705
|
children: [
|
|
2999
|
-
/* @__PURE__ */
|
|
2706
|
+
/* @__PURE__ */ jsx26(Input2, {
|
|
3000
2707
|
ref: input,
|
|
3001
2708
|
density,
|
|
3002
2709
|
"aria-label": label,
|
|
@@ -3006,18 +2713,25 @@ function InlineEdit({
|
|
|
3006
2713
|
disabled: isDisabled || isSaving,
|
|
3007
2714
|
onChange: (event) => onValueChange(event.target.value),
|
|
3008
2715
|
onBlur: () => {
|
|
3009
|
-
|
|
2716
|
+
if (shouldCancel.current && !isFinished.current) {
|
|
2717
|
+
isFinished.current = true;
|
|
2718
|
+
onCancel();
|
|
2719
|
+
} else
|
|
2720
|
+
save();
|
|
3010
2721
|
},
|
|
3011
2722
|
onKeyDown: (event) => {
|
|
3012
2723
|
if (event.key === "Escape") {
|
|
3013
2724
|
event.preventDefault();
|
|
3014
2725
|
event.stopPropagation();
|
|
3015
|
-
|
|
3016
|
-
|
|
2726
|
+
shouldCancel.current = true;
|
|
2727
|
+
event.currentTarget.blur();
|
|
2728
|
+
} else if (event.key === "Enter") {
|
|
2729
|
+
event.preventDefault();
|
|
2730
|
+
event.currentTarget.blur();
|
|
3017
2731
|
}
|
|
3018
2732
|
}
|
|
3019
2733
|
}),
|
|
3020
|
-
error && /* @__PURE__ */
|
|
2734
|
+
error && /* @__PURE__ */ jsx26("p", {
|
|
3021
2735
|
role: "alert",
|
|
3022
2736
|
className: "text-xs text-destructive",
|
|
3023
2737
|
children: error
|
|
@@ -3029,28 +2743,28 @@ function InlineEdit({
|
|
|
3029
2743
|
import { Radio } from "@base-ui/react/radio";
|
|
3030
2744
|
import { RadioGroup } from "@base-ui/react/radio-group";
|
|
3031
2745
|
import { StarIcon, CircleOffIcon } from "lucide-react";
|
|
3032
|
-
import { jsx as
|
|
2746
|
+
import { jsx as jsx27 } from "react/jsx-runtime";
|
|
3033
2747
|
function StarRating({ label, value, disabled, density, onValueChange }) {
|
|
3034
|
-
return /* @__PURE__ */
|
|
2748
|
+
return /* @__PURE__ */ jsx27(RadioGroup, {
|
|
3035
2749
|
"aria-label": label,
|
|
3036
2750
|
value,
|
|
3037
2751
|
disabled,
|
|
3038
2752
|
"data-density": density,
|
|
3039
2753
|
className: "inline-flex w-fit shrink-0 items-center gap-0.5",
|
|
3040
2754
|
onValueChange,
|
|
3041
|
-
children: [1, 2, 3, 4, 5, 0].map((star) => /* @__PURE__ */
|
|
2755
|
+
children: [1, 2, 3, 4, 5, 0].map((star) => /* @__PURE__ */ jsx27(Radio.Root, {
|
|
3042
2756
|
value: star,
|
|
3043
2757
|
nativeButton: true,
|
|
3044
|
-
render: /* @__PURE__ */
|
|
2758
|
+
render: /* @__PURE__ */ jsx27("button", {
|
|
3045
2759
|
type: "button"
|
|
3046
2760
|
}),
|
|
3047
2761
|
"aria-label": star === 0 ? "Unrated" : `${star} ${star === 1 ? "star" : "stars"}`,
|
|
3048
2762
|
title: star === 0 ? "Clear rating" : `${star} stars`,
|
|
3049
2763
|
className: "inline-flex size-5 shrink-0 items-center justify-center rounded-sm text-muted-foreground outline-none hover:text-primary focus-visible:ring-1 focus-visible:ring-ring data-disabled:cursor-not-allowed data-disabled:opacity-50",
|
|
3050
|
-
children: star === 0 ? /* @__PURE__ */
|
|
2764
|
+
children: star === 0 ? /* @__PURE__ */ jsx27(CircleOffIcon, {
|
|
3051
2765
|
"aria-hidden": "true",
|
|
3052
2766
|
className: "size-3"
|
|
3053
|
-
}) : /* @__PURE__ */
|
|
2767
|
+
}) : /* @__PURE__ */ jsx27(StarIcon, {
|
|
3054
2768
|
"aria-hidden": "true",
|
|
3055
2769
|
className: star <= value ? "size-3.5 fill-primary text-primary" : "size-3.5"
|
|
3056
2770
|
})
|
|
@@ -3058,8 +2772,8 @@ function StarRating({ label, value, disabled, density, onValueChange }) {
|
|
|
3058
2772
|
});
|
|
3059
2773
|
}
|
|
3060
2774
|
// src/components/ConfirmationDialog.tsx
|
|
3061
|
-
import { useState as
|
|
3062
|
-
import { jsx as
|
|
2775
|
+
import { useState as useState3 } from "react";
|
|
2776
|
+
import { jsx as jsx28, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
3063
2777
|
function ConfirmationDialog({
|
|
3064
2778
|
open,
|
|
3065
2779
|
title,
|
|
@@ -3068,9 +2782,9 @@ function ConfirmationDialog({
|
|
|
3068
2782
|
onOpenChange,
|
|
3069
2783
|
onConfirm
|
|
3070
2784
|
}) {
|
|
3071
|
-
const [isPending, setPending] =
|
|
3072
|
-
const [error, setError] =
|
|
3073
|
-
return /* @__PURE__ */
|
|
2785
|
+
const [isPending, setPending] = useState3(false);
|
|
2786
|
+
const [error, setError] = useState3("");
|
|
2787
|
+
return /* @__PURE__ */ jsx28(AlertDialog, {
|
|
3074
2788
|
open,
|
|
3075
2789
|
onOpenChange: (next) => {
|
|
3076
2790
|
if (!isPending) {
|
|
@@ -3078,31 +2792,31 @@ function ConfirmationDialog({
|
|
|
3078
2792
|
onOpenChange(next);
|
|
3079
2793
|
}
|
|
3080
2794
|
},
|
|
3081
|
-
children: /* @__PURE__ */
|
|
2795
|
+
children: /* @__PURE__ */ jsxs17(AlertDialogContent, {
|
|
3082
2796
|
children: [
|
|
3083
|
-
/* @__PURE__ */
|
|
2797
|
+
/* @__PURE__ */ jsxs17(AlertDialogHeader, {
|
|
3084
2798
|
children: [
|
|
3085
|
-
/* @__PURE__ */
|
|
2799
|
+
/* @__PURE__ */ jsx28(AlertDialogTitle, {
|
|
3086
2800
|
children: title
|
|
3087
2801
|
}),
|
|
3088
|
-
/* @__PURE__ */
|
|
2802
|
+
/* @__PURE__ */ jsx28(AlertDialogDescription, {
|
|
3089
2803
|
children: description
|
|
3090
2804
|
})
|
|
3091
2805
|
]
|
|
3092
2806
|
}),
|
|
3093
|
-
error && /* @__PURE__ */
|
|
2807
|
+
error && /* @__PURE__ */ jsx28(Alert2, {
|
|
3094
2808
|
variant: "destructive",
|
|
3095
|
-
children: /* @__PURE__ */
|
|
2809
|
+
children: /* @__PURE__ */ jsx28(AlertDescription2, {
|
|
3096
2810
|
children: error
|
|
3097
2811
|
})
|
|
3098
2812
|
}),
|
|
3099
|
-
/* @__PURE__ */
|
|
2813
|
+
/* @__PURE__ */ jsxs17(AlertDialogFooter, {
|
|
3100
2814
|
children: [
|
|
3101
|
-
/* @__PURE__ */
|
|
2815
|
+
/* @__PURE__ */ jsx28(AlertDialogCancel, {
|
|
3102
2816
|
disabled: isPending,
|
|
3103
2817
|
children: "Cancel"
|
|
3104
2818
|
}),
|
|
3105
|
-
/* @__PURE__ */
|
|
2819
|
+
/* @__PURE__ */ jsx28(Button2, {
|
|
3106
2820
|
variant: "destructive",
|
|
3107
2821
|
disabled: isPending,
|
|
3108
2822
|
onClick: async () => {
|
|
@@ -3126,14 +2840,14 @@ function ConfirmationDialog({
|
|
|
3126
2840
|
});
|
|
3127
2841
|
}
|
|
3128
2842
|
// src/components/ImagePicker.tsx
|
|
3129
|
-
import { useRef as
|
|
2843
|
+
import { useRef as useRef4 } from "react";
|
|
3130
2844
|
import { ImageIcon, UploadIcon } from "lucide-react";
|
|
3131
2845
|
|
|
3132
2846
|
// src/hooks/useObjectURL.ts
|
|
3133
|
-
import { useEffect as
|
|
2847
|
+
import { useEffect as useEffect3, useState as useState4 } from "react";
|
|
3134
2848
|
function useObjectURL(file) {
|
|
3135
|
-
const [url, setURL] =
|
|
3136
|
-
|
|
2849
|
+
const [url, setURL] = useState4();
|
|
2850
|
+
useEffect3(() => {
|
|
3137
2851
|
if (!file) {
|
|
3138
2852
|
setURL(undefined);
|
|
3139
2853
|
return;
|
|
@@ -3146,32 +2860,32 @@ function useObjectURL(file) {
|
|
|
3146
2860
|
}
|
|
3147
2861
|
|
|
3148
2862
|
// src/components/ImagePicker.tsx
|
|
3149
|
-
import { jsx as
|
|
2863
|
+
import { jsx as jsx29, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
3150
2864
|
function ImagePicker({ src, file, label, disabled, onFileChange, onClear }) {
|
|
3151
|
-
const input =
|
|
2865
|
+
const input = useRef4(null);
|
|
3152
2866
|
const preview = useObjectURL(file);
|
|
3153
2867
|
const image = file === null ? undefined : preview ?? src;
|
|
3154
|
-
return /* @__PURE__ */
|
|
2868
|
+
return /* @__PURE__ */ jsxs18("figure", {
|
|
3155
2869
|
className: "flex min-w-0 flex-col items-center gap-3",
|
|
3156
2870
|
"aria-label": label,
|
|
3157
2871
|
children: [
|
|
3158
|
-
/* @__PURE__ */
|
|
2872
|
+
/* @__PURE__ */ jsxs18(Avatar2, {
|
|
3159
2873
|
size: "preview",
|
|
3160
2874
|
shape: "square",
|
|
3161
2875
|
children: [
|
|
3162
|
-
/* @__PURE__ */
|
|
2876
|
+
/* @__PURE__ */ jsx29(AvatarImage2, {
|
|
3163
2877
|
src: image,
|
|
3164
2878
|
alt: label
|
|
3165
2879
|
}),
|
|
3166
|
-
/* @__PURE__ */
|
|
3167
|
-
children: /* @__PURE__ */
|
|
2880
|
+
/* @__PURE__ */ jsx29(AvatarFallback2, {
|
|
2881
|
+
children: /* @__PURE__ */ jsx29(ImageIcon, {
|
|
3168
2882
|
className: "size-12",
|
|
3169
2883
|
"aria-hidden": "true"
|
|
3170
2884
|
})
|
|
3171
2885
|
})
|
|
3172
2886
|
]
|
|
3173
2887
|
}),
|
|
3174
|
-
/* @__PURE__ */
|
|
2888
|
+
/* @__PURE__ */ jsx29("input", {
|
|
3175
2889
|
ref: input,
|
|
3176
2890
|
hidden: true,
|
|
3177
2891
|
type: "file",
|
|
@@ -3185,22 +2899,22 @@ function ImagePicker({ src, file, label, disabled, onFileChange, onClear }) {
|
|
|
3185
2899
|
event.currentTarget.value = "";
|
|
3186
2900
|
}
|
|
3187
2901
|
}),
|
|
3188
|
-
/* @__PURE__ */
|
|
2902
|
+
/* @__PURE__ */ jsxs18("div", {
|
|
3189
2903
|
className: "flex flex-wrap justify-center gap-2",
|
|
3190
2904
|
children: [
|
|
3191
|
-
/* @__PURE__ */
|
|
2905
|
+
/* @__PURE__ */ jsxs18(Button2, {
|
|
3192
2906
|
type: "button",
|
|
3193
2907
|
variant: "outline",
|
|
3194
2908
|
disabled,
|
|
3195
2909
|
onClick: () => input.current?.click(),
|
|
3196
2910
|
children: [
|
|
3197
|
-
/* @__PURE__ */
|
|
2911
|
+
/* @__PURE__ */ jsx29(UploadIcon, {
|
|
3198
2912
|
"data-icon": "inline-start"
|
|
3199
2913
|
}),
|
|
3200
2914
|
"Upload image"
|
|
3201
2915
|
]
|
|
3202
2916
|
}),
|
|
3203
|
-
/* @__PURE__ */
|
|
2917
|
+
/* @__PURE__ */ jsx29(Button2, {
|
|
3204
2918
|
type: "button",
|
|
3205
2919
|
variant: "outline",
|
|
3206
2920
|
disabled: disabled || !image,
|
|
@@ -3212,11 +2926,972 @@ function ImagePicker({ src, file, label, disabled, onFileChange, onClear }) {
|
|
|
3212
2926
|
]
|
|
3213
2927
|
});
|
|
3214
2928
|
}
|
|
2929
|
+
// src/components/NumberField.tsx
|
|
2930
|
+
import { NumberField as NumberFieldPrimitive } from "@base-ui/react/number-field";
|
|
2931
|
+
import { MinusIcon, PlusIcon, MoveHorizontalIcon } from "lucide-react";
|
|
2932
|
+
import { jsx as jsx30 } from "react/jsx-runtime";
|
|
2933
|
+
function NumberField({ density, className, ...props }) {
|
|
2934
|
+
return /* @__PURE__ */ jsx30(NumberFieldPrimitive.Root, {
|
|
2935
|
+
"data-density": density,
|
|
2936
|
+
"data-slot": "number-field",
|
|
2937
|
+
className: (state) => cn2("flex min-w-0 flex-col gap-field-gap", typeof className === "function" ? className(state) : className),
|
|
2938
|
+
...props
|
|
2939
|
+
});
|
|
2940
|
+
}
|
|
2941
|
+
function NumberFieldGroup({
|
|
2942
|
+
density,
|
|
2943
|
+
className,
|
|
2944
|
+
...props
|
|
2945
|
+
}) {
|
|
2946
|
+
return /* @__PURE__ */ jsx30(NumberFieldPrimitive.Group, {
|
|
2947
|
+
"data-density": density,
|
|
2948
|
+
"data-slot": "number-field-group",
|
|
2949
|
+
className: (state) => cn2("flex h-control min-w-0 items-stretch rounded-sm border border-input bg-secondary text-foreground transition-colors focus-within:border-ring focus-within:ring-1 focus-within:ring-ring data-disabled:opacity-50 motion-reduce:transition-none", typeof className === "function" ? className(state) : className),
|
|
2950
|
+
...props
|
|
2951
|
+
});
|
|
2952
|
+
}
|
|
2953
|
+
function NumberFieldInput({
|
|
2954
|
+
density,
|
|
2955
|
+
className,
|
|
2956
|
+
...props
|
|
2957
|
+
}) {
|
|
2958
|
+
return /* @__PURE__ */ jsx30(NumberFieldPrimitive.Input, {
|
|
2959
|
+
"data-density": density,
|
|
2960
|
+
"data-slot": "number-field-input",
|
|
2961
|
+
className: (state) => cn2("min-w-0 flex-1 bg-transparent px-control-x text-center text-sm tabular-nums outline-none disabled:cursor-not-allowed", typeof className === "function" ? className(state) : className),
|
|
2962
|
+
...props
|
|
2963
|
+
});
|
|
2964
|
+
}
|
|
2965
|
+
function NumberFieldDecrement({
|
|
2966
|
+
density,
|
|
2967
|
+
className,
|
|
2968
|
+
children = /* @__PURE__ */ jsx30(MinusIcon, {}),
|
|
2969
|
+
...props
|
|
2970
|
+
}) {
|
|
2971
|
+
return /* @__PURE__ */ jsx30(NumberFieldPrimitive.Decrement, {
|
|
2972
|
+
"data-density": density,
|
|
2973
|
+
"data-slot": "number-field-decrement",
|
|
2974
|
+
className: (state) => cn2("flex w-control shrink-0 items-center justify-center rounded-s-sm outline-none hover:bg-muted focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:size-3.5", typeof className === "function" ? className(state) : className),
|
|
2975
|
+
...props,
|
|
2976
|
+
children
|
|
2977
|
+
});
|
|
2978
|
+
}
|
|
2979
|
+
function NumberFieldIncrement({
|
|
2980
|
+
density,
|
|
2981
|
+
className,
|
|
2982
|
+
children = /* @__PURE__ */ jsx30(PlusIcon, {}),
|
|
2983
|
+
...props
|
|
2984
|
+
}) {
|
|
2985
|
+
return /* @__PURE__ */ jsx30(NumberFieldPrimitive.Increment, {
|
|
2986
|
+
"data-density": density,
|
|
2987
|
+
"data-slot": "number-field-increment",
|
|
2988
|
+
className: (state) => cn2("flex w-control shrink-0 items-center justify-center rounded-e-sm outline-none hover:bg-muted focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:size-3.5", typeof className === "function" ? className(state) : className),
|
|
2989
|
+
...props,
|
|
2990
|
+
children
|
|
2991
|
+
});
|
|
2992
|
+
}
|
|
2993
|
+
function NumberFieldScrubArea({
|
|
2994
|
+
density,
|
|
2995
|
+
className,
|
|
2996
|
+
...props
|
|
2997
|
+
}) {
|
|
2998
|
+
return /* @__PURE__ */ jsx30(NumberFieldPrimitive.ScrubArea, {
|
|
2999
|
+
"data-density": density,
|
|
3000
|
+
"data-slot": "number-field-scrub-area",
|
|
3001
|
+
className: (state) => cn2("flex w-fit cursor-ew-resize items-center gap-control-gap text-sm font-medium", typeof className === "function" ? className(state) : className),
|
|
3002
|
+
...props
|
|
3003
|
+
});
|
|
3004
|
+
}
|
|
3005
|
+
function NumberFieldScrubAreaCursor({
|
|
3006
|
+
density,
|
|
3007
|
+
className,
|
|
3008
|
+
children = /* @__PURE__ */ jsx30(MoveHorizontalIcon, {}),
|
|
3009
|
+
...props
|
|
3010
|
+
}) {
|
|
3011
|
+
const resolvedDensity = useDensity(density);
|
|
3012
|
+
return /* @__PURE__ */ jsx30(NumberFieldPrimitive.ScrubAreaCursor, {
|
|
3013
|
+
"data-density": resolvedDensity,
|
|
3014
|
+
"data-slot": "number-field-scrub-area-cursor",
|
|
3015
|
+
className: (state) => cn2("z-50 font-sans text-sm text-foreground [&_svg]:size-5", typeof className === "function" ? className(state) : className),
|
|
3016
|
+
...props,
|
|
3017
|
+
children
|
|
3018
|
+
});
|
|
3019
|
+
}
|
|
3020
|
+
// src/components/Meter.tsx
|
|
3021
|
+
import { Meter as MeterPrimitive } from "@base-ui/react/meter";
|
|
3022
|
+
import { jsx as jsx31 } from "react/jsx-runtime";
|
|
3023
|
+
function Meter({ density, className, ...props }) {
|
|
3024
|
+
return /* @__PURE__ */ jsx31(MeterPrimitive.Root, {
|
|
3025
|
+
"data-density": density,
|
|
3026
|
+
"data-slot": "meter",
|
|
3027
|
+
className: (state) => cn2("flex min-w-0 flex-wrap items-center gap-field-gap", typeof className === "function" ? className(state) : className),
|
|
3028
|
+
...props
|
|
3029
|
+
});
|
|
3030
|
+
}
|
|
3031
|
+
function MeterLabel({ density, className, ...props }) {
|
|
3032
|
+
return /* @__PURE__ */ jsx31(MeterPrimitive.Label, {
|
|
3033
|
+
"data-density": density,
|
|
3034
|
+
"data-slot": "meter-label",
|
|
3035
|
+
className: (state) => cn2("text-sm font-medium", typeof className === "function" ? className(state) : className),
|
|
3036
|
+
...props
|
|
3037
|
+
});
|
|
3038
|
+
}
|
|
3039
|
+
function MeterValue({ density, className, ...props }) {
|
|
3040
|
+
return /* @__PURE__ */ jsx31(MeterPrimitive.Value, {
|
|
3041
|
+
"data-density": density,
|
|
3042
|
+
"data-slot": "meter-value",
|
|
3043
|
+
className: (state) => cn2("ms-auto text-sm text-muted-foreground tabular-nums", typeof className === "function" ? className(state) : className),
|
|
3044
|
+
...props
|
|
3045
|
+
});
|
|
3046
|
+
}
|
|
3047
|
+
function MeterTrack({ density, className, ...props }) {
|
|
3048
|
+
return /* @__PURE__ */ jsx31(MeterPrimitive.Track, {
|
|
3049
|
+
"data-density": density,
|
|
3050
|
+
"data-slot": "meter-track",
|
|
3051
|
+
className: (state) => cn2("h-1 w-full overflow-hidden rounded-sm bg-muted", typeof className === "function" ? className(state) : className),
|
|
3052
|
+
...props
|
|
3053
|
+
});
|
|
3054
|
+
}
|
|
3055
|
+
function MeterIndicator({
|
|
3056
|
+
density,
|
|
3057
|
+
className,
|
|
3058
|
+
...props
|
|
3059
|
+
}) {
|
|
3060
|
+
return /* @__PURE__ */ jsx31(MeterPrimitive.Indicator, {
|
|
3061
|
+
"data-density": density,
|
|
3062
|
+
"data-slot": "meter-indicator",
|
|
3063
|
+
className: (state) => cn2("h-full bg-primary transition-[width] motion-reduce:transition-none", typeof className === "function" ? className(state) : className),
|
|
3064
|
+
...props
|
|
3065
|
+
});
|
|
3066
|
+
}
|
|
3067
|
+
// src/components/Stepper.tsx
|
|
3068
|
+
import { Tabs as TabsPrimitive } from "@base-ui/react/tabs";
|
|
3069
|
+
import { CheckIcon as CheckIcon5 } from "lucide-react";
|
|
3070
|
+
import { jsx as jsx32 } from "react/jsx-runtime";
|
|
3071
|
+
function Stepper({ density, className, ...props }) {
|
|
3072
|
+
return /* @__PURE__ */ jsx32(TabsPrimitive.Root, {
|
|
3073
|
+
"data-density": density,
|
|
3074
|
+
"data-slot": "stepper",
|
|
3075
|
+
className: (state) => cn2("group/stepper flex min-w-0 flex-col gap-panel data-[orientation=vertical]:flex-row", typeof className === "function" ? className(state) : className),
|
|
3076
|
+
...props
|
|
3077
|
+
});
|
|
3078
|
+
}
|
|
3079
|
+
function StepperList({
|
|
3080
|
+
density,
|
|
3081
|
+
className,
|
|
3082
|
+
activateOnFocus = false,
|
|
3083
|
+
...props
|
|
3084
|
+
}) {
|
|
3085
|
+
return /* @__PURE__ */ jsx32(TabsPrimitive.List, {
|
|
3086
|
+
"data-density": density,
|
|
3087
|
+
"data-slot": "stepper-list",
|
|
3088
|
+
activateOnFocus,
|
|
3089
|
+
className: (state) => cn2("flex min-w-0 gap-panel group-data-[orientation=vertical]/stepper:flex-col", typeof className === "function" ? className(state) : className),
|
|
3090
|
+
...props
|
|
3091
|
+
});
|
|
3092
|
+
}
|
|
3093
|
+
function StepperTrigger({ density, className, ...props }) {
|
|
3094
|
+
return /* @__PURE__ */ jsx32(TabsPrimitive.Tab, {
|
|
3095
|
+
"data-density": density,
|
|
3096
|
+
"data-slot": "stepper-trigger",
|
|
3097
|
+
className: (state) => cn2("group/step flex min-h-control items-center gap-control-gap rounded-sm text-sm text-muted-foreground outline-none focus-visible:ring-1 focus-visible:ring-ring data-active:text-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:opacity-50", typeof className === "function" ? className(state) : className),
|
|
3098
|
+
...props
|
|
3099
|
+
});
|
|
3100
|
+
}
|
|
3101
|
+
function StepperIndicator({ completed = false, children, className, ...props }) {
|
|
3102
|
+
return /* @__PURE__ */ jsx32("span", {
|
|
3103
|
+
"aria-hidden": "true",
|
|
3104
|
+
"data-slot": "stepper-indicator",
|
|
3105
|
+
"data-completed": completed || undefined,
|
|
3106
|
+
className: cn2("flex size-control shrink-0 items-center justify-center rounded-sm border border-input bg-secondary text-sm tabular-nums group-data-active/step:border-primary group-data-active/step:bg-primary group-data-active/step:text-primary-foreground data-completed:border-primary data-completed:text-primary [&_svg]:size-3.5", className),
|
|
3107
|
+
...props,
|
|
3108
|
+
children: completed ? /* @__PURE__ */ jsx32(CheckIcon5, {}) : children
|
|
3109
|
+
});
|
|
3110
|
+
}
|
|
3111
|
+
function StepperContent({ density, className, ...props }) {
|
|
3112
|
+
return /* @__PURE__ */ jsx32(TabsPrimitive.Panel, {
|
|
3113
|
+
"data-density": density,
|
|
3114
|
+
"data-slot": "stepper-content",
|
|
3115
|
+
className: (state) => cn2("min-w-0 flex-1 outline-none focus-visible:ring-1 focus-visible:ring-ring", typeof className === "function" ? className(state) : className),
|
|
3116
|
+
...props
|
|
3117
|
+
});
|
|
3118
|
+
}
|
|
3119
|
+
// src/components/AppShell.tsx
|
|
3120
|
+
import { jsx as jsx33, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
3121
|
+
function AppShell({
|
|
3122
|
+
navigation,
|
|
3123
|
+
brand,
|
|
3124
|
+
children,
|
|
3125
|
+
header,
|
|
3126
|
+
sidebarFooter,
|
|
3127
|
+
footer,
|
|
3128
|
+
height = "100dvh",
|
|
3129
|
+
defaultSidebarOpen = true,
|
|
3130
|
+
label = "Application",
|
|
3131
|
+
density
|
|
3132
|
+
}) {
|
|
3133
|
+
return /* @__PURE__ */ jsxs19(SidebarProvider2, {
|
|
3134
|
+
density,
|
|
3135
|
+
defaultOpen: defaultSidebarOpen,
|
|
3136
|
+
className: "relative min-h-0",
|
|
3137
|
+
style: { height },
|
|
3138
|
+
"data-scroll": "none",
|
|
3139
|
+
children: [
|
|
3140
|
+
/* @__PURE__ */ jsxs19(Sidebar2, {
|
|
3141
|
+
collapsible: "icon",
|
|
3142
|
+
position: "container",
|
|
3143
|
+
children: [
|
|
3144
|
+
/* @__PURE__ */ jsx33(SidebarHeader2, {
|
|
3145
|
+
children: brand
|
|
3146
|
+
}),
|
|
3147
|
+
/* @__PURE__ */ jsx33(SidebarContent2, {
|
|
3148
|
+
children: /* @__PURE__ */ jsx33("nav", {
|
|
3149
|
+
"aria-label": "Primary navigation",
|
|
3150
|
+
children: /* @__PURE__ */ jsx33(SidebarGroup2, {
|
|
3151
|
+
children: /* @__PURE__ */ jsx33(SidebarMenu2, {
|
|
3152
|
+
children: navigation.map((item) => /* @__PURE__ */ jsx33(SidebarMenuItem2, {
|
|
3153
|
+
children: /* @__PURE__ */ jsxs19(SidebarMenuButton2, {
|
|
3154
|
+
render: /* @__PURE__ */ jsx33("a", {
|
|
3155
|
+
href: item.href,
|
|
3156
|
+
"aria-current": item.active ? "page" : undefined
|
|
3157
|
+
}),
|
|
3158
|
+
isActive: item.active,
|
|
3159
|
+
tooltip: item.label,
|
|
3160
|
+
children: [
|
|
3161
|
+
item.icon,
|
|
3162
|
+
/* @__PURE__ */ jsx33("span", {
|
|
3163
|
+
children: item.label
|
|
3164
|
+
})
|
|
3165
|
+
]
|
|
3166
|
+
})
|
|
3167
|
+
}, item.id))
|
|
3168
|
+
})
|
|
3169
|
+
})
|
|
3170
|
+
})
|
|
3171
|
+
}),
|
|
3172
|
+
sidebarFooter && /* @__PURE__ */ jsx33(SidebarFooter2, {
|
|
3173
|
+
children: sidebarFooter
|
|
3174
|
+
})
|
|
3175
|
+
]
|
|
3176
|
+
}),
|
|
3177
|
+
/* @__PURE__ */ jsxs19(SidebarInset2, {
|
|
3178
|
+
"aria-label": label,
|
|
3179
|
+
className: "min-h-0 min-w-0",
|
|
3180
|
+
"data-scroll": "none",
|
|
3181
|
+
children: [
|
|
3182
|
+
/* @__PURE__ */ jsxs19("header", {
|
|
3183
|
+
"data-scroll": "none",
|
|
3184
|
+
className: "flex shrink-0 items-center gap-control-gap border-b border-border p-panel",
|
|
3185
|
+
children: [
|
|
3186
|
+
/* @__PURE__ */ jsx33(SidebarTrigger2, {}),
|
|
3187
|
+
/* @__PURE__ */ jsx33(Separator2, {
|
|
3188
|
+
orientation: "vertical",
|
|
3189
|
+
className: "h-control"
|
|
3190
|
+
}),
|
|
3191
|
+
header
|
|
3192
|
+
]
|
|
3193
|
+
}),
|
|
3194
|
+
/* @__PURE__ */ jsx33(ScrollArea, {
|
|
3195
|
+
className: "min-h-0 flex-1",
|
|
3196
|
+
children: /* @__PURE__ */ jsx33("div", {
|
|
3197
|
+
className: "flex min-w-0 flex-col gap-panel p-panel",
|
|
3198
|
+
children
|
|
3199
|
+
})
|
|
3200
|
+
}),
|
|
3201
|
+
footer && /* @__PURE__ */ jsx33("footer", {
|
|
3202
|
+
className: "shrink-0 border-t border-border p-panel",
|
|
3203
|
+
"data-scroll": "none",
|
|
3204
|
+
children: footer
|
|
3205
|
+
})
|
|
3206
|
+
]
|
|
3207
|
+
})
|
|
3208
|
+
]
|
|
3209
|
+
});
|
|
3210
|
+
}
|
|
3211
|
+
// src/components/PageHeader.tsx
|
|
3212
|
+
import { jsx as jsx34, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
3213
|
+
function PageHeader({ title, description, breadcrumbs, actions, density }) {
|
|
3214
|
+
return /* @__PURE__ */ jsxs20("header", {
|
|
3215
|
+
"data-density": density,
|
|
3216
|
+
"data-slot": "page-header",
|
|
3217
|
+
"data-scroll": "none",
|
|
3218
|
+
className: "flex min-w-0 flex-col gap-field-gap",
|
|
3219
|
+
children: [
|
|
3220
|
+
breadcrumbs,
|
|
3221
|
+
/* @__PURE__ */ jsxs20("div", {
|
|
3222
|
+
className: "flex min-w-0 flex-wrap items-start justify-between gap-panel",
|
|
3223
|
+
children: [
|
|
3224
|
+
/* @__PURE__ */ jsxs20("div", {
|
|
3225
|
+
className: "min-w-0",
|
|
3226
|
+
children: [
|
|
3227
|
+
/* @__PURE__ */ jsx34("h1", {
|
|
3228
|
+
className: "text-xl font-semibold text-foreground",
|
|
3229
|
+
children: title
|
|
3230
|
+
}),
|
|
3231
|
+
description && /* @__PURE__ */ jsx34("div", {
|
|
3232
|
+
className: "mt-1 text-sm text-muted-foreground",
|
|
3233
|
+
children: description
|
|
3234
|
+
})
|
|
3235
|
+
]
|
|
3236
|
+
}),
|
|
3237
|
+
actions && /* @__PURE__ */ jsx34("div", {
|
|
3238
|
+
className: "flex shrink-0 flex-wrap items-center gap-control-gap",
|
|
3239
|
+
children: actions
|
|
3240
|
+
})
|
|
3241
|
+
]
|
|
3242
|
+
})
|
|
3243
|
+
]
|
|
3244
|
+
});
|
|
3245
|
+
}
|
|
3246
|
+
// src/components/WorkspaceSwitcher.tsx
|
|
3247
|
+
import { jsx as jsx35, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
3248
|
+
function WorkspaceSwitcher({
|
|
3249
|
+
workspaces,
|
|
3250
|
+
value,
|
|
3251
|
+
defaultValue,
|
|
3252
|
+
onValueChange,
|
|
3253
|
+
disabled,
|
|
3254
|
+
label = "Workspace",
|
|
3255
|
+
density
|
|
3256
|
+
}) {
|
|
3257
|
+
return /* @__PURE__ */ jsxs21(Select, {
|
|
3258
|
+
items: workspaces,
|
|
3259
|
+
value,
|
|
3260
|
+
defaultValue: defaultValue ?? workspaces[0]?.value,
|
|
3261
|
+
onValueChange: (next) => {
|
|
3262
|
+
if (next !== null)
|
|
3263
|
+
onValueChange?.(next);
|
|
3264
|
+
},
|
|
3265
|
+
disabled,
|
|
3266
|
+
children: [
|
|
3267
|
+
/* @__PURE__ */ jsx35(SelectTrigger, {
|
|
3268
|
+
"aria-label": label,
|
|
3269
|
+
density,
|
|
3270
|
+
children: /* @__PURE__ */ jsx35(SelectValue, {})
|
|
3271
|
+
}),
|
|
3272
|
+
/* @__PURE__ */ jsx35(SelectContent, {
|
|
3273
|
+
density,
|
|
3274
|
+
children: /* @__PURE__ */ jsx35(SelectGroup, {
|
|
3275
|
+
children: workspaces.map((workspace) => /* @__PURE__ */ jsx35(SelectItem, {
|
|
3276
|
+
value: workspace.value,
|
|
3277
|
+
children: workspace.label
|
|
3278
|
+
}, workspace.value))
|
|
3279
|
+
})
|
|
3280
|
+
})
|
|
3281
|
+
]
|
|
3282
|
+
});
|
|
3283
|
+
}
|
|
3284
|
+
// src/components/AccountMenu.tsx
|
|
3285
|
+
import { jsx as jsx36, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
3286
|
+
function AccountMenu({ name, email, image, onAction, density }) {
|
|
3287
|
+
return /* @__PURE__ */ jsxs22(DropdownMenu2, {
|
|
3288
|
+
children: [
|
|
3289
|
+
/* @__PURE__ */ jsxs22(DropdownMenuTrigger2, {
|
|
3290
|
+
render: /* @__PURE__ */ jsx36(Button2, {
|
|
3291
|
+
variant: "ghost",
|
|
3292
|
+
density
|
|
3293
|
+
}),
|
|
3294
|
+
"aria-label": `Account menu for ${name}`,
|
|
3295
|
+
children: [
|
|
3296
|
+
/* @__PURE__ */ jsxs22(Avatar2, {
|
|
3297
|
+
className: "size-control",
|
|
3298
|
+
children: [
|
|
3299
|
+
/* @__PURE__ */ jsx36(AvatarImage2, {
|
|
3300
|
+
src: image,
|
|
3301
|
+
alt: ""
|
|
3302
|
+
}),
|
|
3303
|
+
/* @__PURE__ */ jsx36(AvatarFallback2, {
|
|
3304
|
+
children: name.slice(0, 2).toUpperCase()
|
|
3305
|
+
})
|
|
3306
|
+
]
|
|
3307
|
+
}),
|
|
3308
|
+
/* @__PURE__ */ jsx36("span", {
|
|
3309
|
+
children: name
|
|
3310
|
+
})
|
|
3311
|
+
]
|
|
3312
|
+
}),
|
|
3313
|
+
/* @__PURE__ */ jsx36(DropdownMenuContent2, {
|
|
3314
|
+
density,
|
|
3315
|
+
align: "end",
|
|
3316
|
+
children: /* @__PURE__ */ jsxs22(DropdownMenuGroup2, {
|
|
3317
|
+
children: [
|
|
3318
|
+
/* @__PURE__ */ jsx36(DropdownMenuLabel2, {
|
|
3319
|
+
children: email ?? name
|
|
3320
|
+
}),
|
|
3321
|
+
/* @__PURE__ */ jsx36(DropdownMenuItem2, {
|
|
3322
|
+
onClick: () => onAction("profile"),
|
|
3323
|
+
children: "Profile"
|
|
3324
|
+
}),
|
|
3325
|
+
/* @__PURE__ */ jsx36(DropdownMenuItem2, {
|
|
3326
|
+
onClick: () => onAction("settings"),
|
|
3327
|
+
children: "Settings"
|
|
3328
|
+
}),
|
|
3329
|
+
/* @__PURE__ */ jsx36(DropdownMenuSeparator2, {}),
|
|
3330
|
+
/* @__PURE__ */ jsx36(DropdownMenuItem2, {
|
|
3331
|
+
onClick: () => onAction("sign-out"),
|
|
3332
|
+
children: "Sign out"
|
|
3333
|
+
})
|
|
3334
|
+
]
|
|
3335
|
+
})
|
|
3336
|
+
})
|
|
3337
|
+
]
|
|
3338
|
+
});
|
|
3339
|
+
}
|
|
3340
|
+
// src/components/StatCard.tsx
|
|
3341
|
+
import { jsx as jsx37, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
3342
|
+
function StatCard({
|
|
3343
|
+
label,
|
|
3344
|
+
value,
|
|
3345
|
+
change,
|
|
3346
|
+
changeIntent = "neutral",
|
|
3347
|
+
description,
|
|
3348
|
+
children,
|
|
3349
|
+
loading = false,
|
|
3350
|
+
density
|
|
3351
|
+
}) {
|
|
3352
|
+
return /* @__PURE__ */ jsxs23(Card2, {
|
|
3353
|
+
density,
|
|
3354
|
+
"aria-label": label,
|
|
3355
|
+
"aria-busy": loading,
|
|
3356
|
+
children: [
|
|
3357
|
+
/* @__PURE__ */ jsxs23(CardHeader2, {
|
|
3358
|
+
children: [
|
|
3359
|
+
/* @__PURE__ */ jsx37(CardTitle2, {
|
|
3360
|
+
children: label
|
|
3361
|
+
}),
|
|
3362
|
+
description && /* @__PURE__ */ jsx37(CardDescription2, {
|
|
3363
|
+
children: description
|
|
3364
|
+
})
|
|
3365
|
+
]
|
|
3366
|
+
}),
|
|
3367
|
+
/* @__PURE__ */ jsx37(CardContent2, {
|
|
3368
|
+
children: /* @__PURE__ */ jsxs23("div", {
|
|
3369
|
+
className: "flex flex-wrap items-center justify-between gap-control-gap",
|
|
3370
|
+
children: [
|
|
3371
|
+
loading ? /* @__PURE__ */ jsx37(Skeleton2, {
|
|
3372
|
+
className: "h-8 w-24",
|
|
3373
|
+
"aria-label": `Loading ${label}`
|
|
3374
|
+
}) : /* @__PURE__ */ jsx37("div", {
|
|
3375
|
+
className: "text-2xl font-semibold tabular-nums",
|
|
3376
|
+
children: value
|
|
3377
|
+
}),
|
|
3378
|
+
change && /* @__PURE__ */ jsx37(Badge2, {
|
|
3379
|
+
variant: changeIntent === "positive" ? "success" : changeIntent === "negative" ? "destructive" : "secondary",
|
|
3380
|
+
children: change
|
|
3381
|
+
})
|
|
3382
|
+
]
|
|
3383
|
+
})
|
|
3384
|
+
}),
|
|
3385
|
+
children && /* @__PURE__ */ jsx37(CardFooter2, {
|
|
3386
|
+
children
|
|
3387
|
+
})
|
|
3388
|
+
]
|
|
3389
|
+
});
|
|
3390
|
+
}
|
|
3391
|
+
// src/components/AuthForm.tsx
|
|
3392
|
+
import { useId as useId2, useState as useState5 } from "react";
|
|
3393
|
+
import { jsx as jsx38, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
3394
|
+
function AuthForm({
|
|
3395
|
+
mode = "sign-in",
|
|
3396
|
+
onSubmit,
|
|
3397
|
+
footer,
|
|
3398
|
+
alternativeActions,
|
|
3399
|
+
disabled = false,
|
|
3400
|
+
density
|
|
3401
|
+
}) {
|
|
3402
|
+
const id = useId2();
|
|
3403
|
+
const [pending, setPending] = useState5(false);
|
|
3404
|
+
const [error, setError] = useState5("");
|
|
3405
|
+
const title = mode === "sign-up" ? "Create an account" : mode === "reset-password" ? "Reset your password" : "Sign in";
|
|
3406
|
+
async function submit(event) {
|
|
3407
|
+
event.preventDefault();
|
|
3408
|
+
const data = new FormData(event.currentTarget);
|
|
3409
|
+
setError("");
|
|
3410
|
+
setPending(true);
|
|
3411
|
+
try {
|
|
3412
|
+
await onSubmit({
|
|
3413
|
+
email: String(data.get("email") ?? ""),
|
|
3414
|
+
password: String(data.get("password") ?? ""),
|
|
3415
|
+
name: String(data.get("name") ?? "")
|
|
3416
|
+
});
|
|
3417
|
+
} catch (error) {
|
|
3418
|
+
setError(error instanceof Error ? error.message : "Unable to submit. Please try again.");
|
|
3419
|
+
} finally {
|
|
3420
|
+
setPending(false);
|
|
3421
|
+
}
|
|
3422
|
+
}
|
|
3423
|
+
return /* @__PURE__ */ jsxs24(Card2, {
|
|
3424
|
+
density,
|
|
3425
|
+
children: [
|
|
3426
|
+
/* @__PURE__ */ jsxs24(CardHeader2, {
|
|
3427
|
+
children: [
|
|
3428
|
+
/* @__PURE__ */ jsx38(CardTitle2, {
|
|
3429
|
+
children: title
|
|
3430
|
+
}),
|
|
3431
|
+
/* @__PURE__ */ jsx38(CardDescription2, {
|
|
3432
|
+
children: mode === "reset-password" ? "Enter your email to request a password reset." : "Enter your details to continue."
|
|
3433
|
+
})
|
|
3434
|
+
]
|
|
3435
|
+
}),
|
|
3436
|
+
/* @__PURE__ */ jsx38(CardContent2, {
|
|
3437
|
+
children: /* @__PURE__ */ jsx38("form", {
|
|
3438
|
+
onSubmit: submit,
|
|
3439
|
+
"aria-label": title,
|
|
3440
|
+
"aria-busy": pending,
|
|
3441
|
+
children: /* @__PURE__ */ jsxs24(FieldGroup2, {
|
|
3442
|
+
children: [
|
|
3443
|
+
mode === "sign-up" && /* @__PURE__ */ jsxs24(Field2, {
|
|
3444
|
+
children: [
|
|
3445
|
+
/* @__PURE__ */ jsx38(FieldLabel2, {
|
|
3446
|
+
htmlFor: id + "-name",
|
|
3447
|
+
children: "Name"
|
|
3448
|
+
}),
|
|
3449
|
+
/* @__PURE__ */ jsx38(Input2, {
|
|
3450
|
+
id: id + "-name",
|
|
3451
|
+
name: "name",
|
|
3452
|
+
autoComplete: "name",
|
|
3453
|
+
required: true,
|
|
3454
|
+
disabled: disabled || pending
|
|
3455
|
+
})
|
|
3456
|
+
]
|
|
3457
|
+
}),
|
|
3458
|
+
/* @__PURE__ */ jsxs24(Field2, {
|
|
3459
|
+
children: [
|
|
3460
|
+
/* @__PURE__ */ jsx38(FieldLabel2, {
|
|
3461
|
+
htmlFor: id + "-email",
|
|
3462
|
+
children: "Email"
|
|
3463
|
+
}),
|
|
3464
|
+
/* @__PURE__ */ jsx38(Input2, {
|
|
3465
|
+
id: id + "-email",
|
|
3466
|
+
name: "email",
|
|
3467
|
+
type: "email",
|
|
3468
|
+
autoComplete: "email",
|
|
3469
|
+
required: true,
|
|
3470
|
+
disabled: disabled || pending
|
|
3471
|
+
})
|
|
3472
|
+
]
|
|
3473
|
+
}),
|
|
3474
|
+
mode !== "reset-password" && /* @__PURE__ */ jsxs24(Field2, {
|
|
3475
|
+
children: [
|
|
3476
|
+
/* @__PURE__ */ jsx38(FieldLabel2, {
|
|
3477
|
+
htmlFor: id + "-password",
|
|
3478
|
+
children: "Password"
|
|
3479
|
+
}),
|
|
3480
|
+
/* @__PURE__ */ jsx38(Input2, {
|
|
3481
|
+
id: id + "-password",
|
|
3482
|
+
name: "password",
|
|
3483
|
+
type: "password",
|
|
3484
|
+
autoComplete: mode === "sign-up" ? "new-password" : "current-password",
|
|
3485
|
+
minLength: mode === "sign-up" ? 8 : undefined,
|
|
3486
|
+
required: true,
|
|
3487
|
+
disabled: disabled || pending
|
|
3488
|
+
}),
|
|
3489
|
+
mode === "sign-up" && /* @__PURE__ */ jsx38(FieldDescription2, {
|
|
3490
|
+
children: "Use at least eight characters."
|
|
3491
|
+
})
|
|
3492
|
+
]
|
|
3493
|
+
}),
|
|
3494
|
+
error && /* @__PURE__ */ jsxs24(Alert2, {
|
|
3495
|
+
variant: "destructive",
|
|
3496
|
+
children: [
|
|
3497
|
+
/* @__PURE__ */ jsx38(AlertTitle2, {
|
|
3498
|
+
children: "Request failed"
|
|
3499
|
+
}),
|
|
3500
|
+
/* @__PURE__ */ jsx38(AlertDescription2, {
|
|
3501
|
+
children: error
|
|
3502
|
+
})
|
|
3503
|
+
]
|
|
3504
|
+
}),
|
|
3505
|
+
/* @__PURE__ */ jsxs24(Button2, {
|
|
3506
|
+
type: "submit",
|
|
3507
|
+
disabled: disabled || pending,
|
|
3508
|
+
children: [
|
|
3509
|
+
pending && /* @__PURE__ */ jsx38(Spinner2, {
|
|
3510
|
+
"data-icon": "inline-start"
|
|
3511
|
+
}),
|
|
3512
|
+
mode === "reset-password" ? "Send reset link" : title
|
|
3513
|
+
]
|
|
3514
|
+
}),
|
|
3515
|
+
alternativeActions
|
|
3516
|
+
]
|
|
3517
|
+
})
|
|
3518
|
+
})
|
|
3519
|
+
}),
|
|
3520
|
+
footer && /* @__PURE__ */ jsx38(CardFooter2, {
|
|
3521
|
+
children: footer
|
|
3522
|
+
})
|
|
3523
|
+
]
|
|
3524
|
+
});
|
|
3525
|
+
}
|
|
3526
|
+
// src/components/SettingsSection.tsx
|
|
3527
|
+
import { jsx as jsx39, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
3528
|
+
function SettingsSection({
|
|
3529
|
+
title,
|
|
3530
|
+
description,
|
|
3531
|
+
children,
|
|
3532
|
+
onSubmit,
|
|
3533
|
+
saveLabel = "Save changes",
|
|
3534
|
+
pending = false,
|
|
3535
|
+
disabled = false,
|
|
3536
|
+
footer,
|
|
3537
|
+
destructive = false,
|
|
3538
|
+
density
|
|
3539
|
+
}) {
|
|
3540
|
+
return /* @__PURE__ */ jsx39("form", {
|
|
3541
|
+
"aria-label": title,
|
|
3542
|
+
onSubmit,
|
|
3543
|
+
"aria-busy": pending,
|
|
3544
|
+
children: /* @__PURE__ */ jsxs25(Card2, {
|
|
3545
|
+
density,
|
|
3546
|
+
children: [
|
|
3547
|
+
/* @__PURE__ */ jsxs25(CardHeader2, {
|
|
3548
|
+
children: [
|
|
3549
|
+
/* @__PURE__ */ jsx39(CardTitle2, {
|
|
3550
|
+
children: title
|
|
3551
|
+
}),
|
|
3552
|
+
description && /* @__PURE__ */ jsx39(CardDescription2, {
|
|
3553
|
+
children: description
|
|
3554
|
+
})
|
|
3555
|
+
]
|
|
3556
|
+
}),
|
|
3557
|
+
/* @__PURE__ */ jsx39(CardContent2, {
|
|
3558
|
+
children: /* @__PURE__ */ jsxs25("fieldset", {
|
|
3559
|
+
disabled: disabled || pending,
|
|
3560
|
+
className: "min-w-0 border-0 p-0",
|
|
3561
|
+
children: [
|
|
3562
|
+
/* @__PURE__ */ jsx39("legend", {
|
|
3563
|
+
className: "sr-only",
|
|
3564
|
+
children: title
|
|
3565
|
+
}),
|
|
3566
|
+
/* @__PURE__ */ jsx39(FieldGroup2, {
|
|
3567
|
+
children
|
|
3568
|
+
})
|
|
3569
|
+
]
|
|
3570
|
+
})
|
|
3571
|
+
}),
|
|
3572
|
+
/* @__PURE__ */ jsxs25(CardFooter2, {
|
|
3573
|
+
className: "flex flex-wrap items-center justify-between gap-control-gap",
|
|
3574
|
+
children: [
|
|
3575
|
+
footer,
|
|
3576
|
+
/* @__PURE__ */ jsxs25(Button2, {
|
|
3577
|
+
type: "submit",
|
|
3578
|
+
variant: destructive ? "destructive" : "default",
|
|
3579
|
+
disabled: disabled || pending,
|
|
3580
|
+
children: [
|
|
3581
|
+
pending && /* @__PURE__ */ jsx39(Spinner2, {
|
|
3582
|
+
"data-icon": "inline-start"
|
|
3583
|
+
}),
|
|
3584
|
+
saveLabel
|
|
3585
|
+
]
|
|
3586
|
+
})
|
|
3587
|
+
]
|
|
3588
|
+
})
|
|
3589
|
+
]
|
|
3590
|
+
})
|
|
3591
|
+
});
|
|
3592
|
+
}
|
|
3593
|
+
// src/components/TagInput.tsx
|
|
3594
|
+
import { jsx as jsx40, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
3595
|
+
function TagInput({
|
|
3596
|
+
label,
|
|
3597
|
+
options,
|
|
3598
|
+
value,
|
|
3599
|
+
defaultValue,
|
|
3600
|
+
onValueChange,
|
|
3601
|
+
disabled,
|
|
3602
|
+
name,
|
|
3603
|
+
placeholder = "Add tags",
|
|
3604
|
+
density
|
|
3605
|
+
}) {
|
|
3606
|
+
const anchor = useComboboxAnchor();
|
|
3607
|
+
return /* @__PURE__ */ jsxs26(Combobox, {
|
|
3608
|
+
items: options,
|
|
3609
|
+
multiple: true,
|
|
3610
|
+
value,
|
|
3611
|
+
defaultValue,
|
|
3612
|
+
onValueChange,
|
|
3613
|
+
disabled,
|
|
3614
|
+
name,
|
|
3615
|
+
children: [
|
|
3616
|
+
/* @__PURE__ */ jsxs26(ComboboxChips, {
|
|
3617
|
+
ref: anchor,
|
|
3618
|
+
density,
|
|
3619
|
+
children: [
|
|
3620
|
+
/* @__PURE__ */ jsx40(ComboboxValue, {
|
|
3621
|
+
children: (values) => values.map((item) => /* @__PURE__ */ jsx40(ComboboxChip, {
|
|
3622
|
+
removeLabel: `Remove ${item}`,
|
|
3623
|
+
children: item
|
|
3624
|
+
}, item))
|
|
3625
|
+
}),
|
|
3626
|
+
/* @__PURE__ */ jsx40(ComboboxChipsInput, {
|
|
3627
|
+
"aria-label": label,
|
|
3628
|
+
placeholder
|
|
3629
|
+
})
|
|
3630
|
+
]
|
|
3631
|
+
}),
|
|
3632
|
+
/* @__PURE__ */ jsxs26(ComboboxContent, {
|
|
3633
|
+
anchor,
|
|
3634
|
+
density,
|
|
3635
|
+
children: [
|
|
3636
|
+
/* @__PURE__ */ jsx40(ComboboxEmpty, {
|
|
3637
|
+
children: "No matching tags."
|
|
3638
|
+
}),
|
|
3639
|
+
/* @__PURE__ */ jsx40(ComboboxList, {
|
|
3640
|
+
children: /* @__PURE__ */ jsx40(ComboboxGroup, {
|
|
3641
|
+
children: /* @__PURE__ */ jsx40(ComboboxCollection, {
|
|
3642
|
+
children: (item) => /* @__PURE__ */ jsx40(ComboboxItem, {
|
|
3643
|
+
value: item,
|
|
3644
|
+
children: item
|
|
3645
|
+
}, item)
|
|
3646
|
+
})
|
|
3647
|
+
})
|
|
3648
|
+
})
|
|
3649
|
+
]
|
|
3650
|
+
})
|
|
3651
|
+
]
|
|
3652
|
+
});
|
|
3653
|
+
}
|
|
3654
|
+
// src/components/FilterBar.tsx
|
|
3655
|
+
import { jsx as jsx41, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
3656
|
+
function FilterBar({
|
|
3657
|
+
label,
|
|
3658
|
+
search,
|
|
3659
|
+
onSearchChange,
|
|
3660
|
+
filters,
|
|
3661
|
+
value,
|
|
3662
|
+
onValueChange,
|
|
3663
|
+
disabled,
|
|
3664
|
+
density
|
|
3665
|
+
}) {
|
|
3666
|
+
return /* @__PURE__ */ jsxs27("fieldset", {
|
|
3667
|
+
"aria-label": label,
|
|
3668
|
+
disabled,
|
|
3669
|
+
"data-density": density,
|
|
3670
|
+
className: "flex min-w-0 flex-wrap items-center gap-2",
|
|
3671
|
+
children: [
|
|
3672
|
+
/* @__PURE__ */ jsx41(Input2, {
|
|
3673
|
+
"aria-label": `Search ${label}`,
|
|
3674
|
+
type: "search",
|
|
3675
|
+
value: search,
|
|
3676
|
+
onChange: (event) => onSearchChange(event.target.value),
|
|
3677
|
+
className: "min-w-40 flex-1"
|
|
3678
|
+
}),
|
|
3679
|
+
filters.map((filter) => /* @__PURE__ */ jsxs27(NativeSelect2, {
|
|
3680
|
+
"aria-label": filter.label,
|
|
3681
|
+
value: value[filter.id] ?? "",
|
|
3682
|
+
onChange: (event) => onValueChange({ ...value, [filter.id]: event.target.value }),
|
|
3683
|
+
children: [
|
|
3684
|
+
/* @__PURE__ */ jsxs27(NativeSelectOption2, {
|
|
3685
|
+
value: "",
|
|
3686
|
+
children: [
|
|
3687
|
+
"All ",
|
|
3688
|
+
filter.label.toLowerCase()
|
|
3689
|
+
]
|
|
3690
|
+
}),
|
|
3691
|
+
filter.options.map((option) => /* @__PURE__ */ jsx41(NativeSelectOption2, {
|
|
3692
|
+
value: option.value,
|
|
3693
|
+
children: option.label
|
|
3694
|
+
}, option.value))
|
|
3695
|
+
]
|
|
3696
|
+
}, filter.id)),
|
|
3697
|
+
/* @__PURE__ */ jsx41(Button2, {
|
|
3698
|
+
type: "button",
|
|
3699
|
+
variant: "ghost",
|
|
3700
|
+
disabled: !search && !Object.values(value).some(Boolean),
|
|
3701
|
+
onClick: () => {
|
|
3702
|
+
onSearchChange("");
|
|
3703
|
+
onValueChange({});
|
|
3704
|
+
},
|
|
3705
|
+
children: "Clear filters"
|
|
3706
|
+
})
|
|
3707
|
+
]
|
|
3708
|
+
});
|
|
3709
|
+
}
|
|
3710
|
+
// src/components/BarList.tsx
|
|
3711
|
+
import { jsx as jsx42, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
3712
|
+
function BarList({
|
|
3713
|
+
label,
|
|
3714
|
+
items,
|
|
3715
|
+
onItemSelect,
|
|
3716
|
+
valueFormatter = (value) => value.toLocaleString(),
|
|
3717
|
+
density
|
|
3718
|
+
}) {
|
|
3719
|
+
const max = Math.max(1, ...items.map((item) => item.value));
|
|
3720
|
+
return /* @__PURE__ */ jsxs28("section", {
|
|
3721
|
+
"aria-label": label,
|
|
3722
|
+
"data-density": density,
|
|
3723
|
+
children: [
|
|
3724
|
+
/* @__PURE__ */ jsx42("ul", {
|
|
3725
|
+
className: "grid gap-3",
|
|
3726
|
+
children: items.map((item) => /* @__PURE__ */ jsx42("li", {
|
|
3727
|
+
children: /* @__PURE__ */ jsxs28(Meter, {
|
|
3728
|
+
min: 0,
|
|
3729
|
+
max,
|
|
3730
|
+
value: item.value,
|
|
3731
|
+
"aria-label": item.label,
|
|
3732
|
+
format: { maximumFractionDigits: 2 },
|
|
3733
|
+
children: [
|
|
3734
|
+
/* @__PURE__ */ jsxs28("div", {
|
|
3735
|
+
className: "mb-1 flex items-center justify-between gap-3 text-sm",
|
|
3736
|
+
children: [
|
|
3737
|
+
/* @__PURE__ */ jsx42(MeterLabel, {
|
|
3738
|
+
children: onItemSelect ? /* @__PURE__ */ jsx42(Button2, {
|
|
3739
|
+
type: "button",
|
|
3740
|
+
variant: "link",
|
|
3741
|
+
className: "h-auto p-0",
|
|
3742
|
+
onClick: () => onItemSelect(item),
|
|
3743
|
+
children: item.label
|
|
3744
|
+
}) : item.label
|
|
3745
|
+
}),
|
|
3746
|
+
/* @__PURE__ */ jsx42(MeterValue, {
|
|
3747
|
+
children: () => valueFormatter(item.value)
|
|
3748
|
+
})
|
|
3749
|
+
]
|
|
3750
|
+
}),
|
|
3751
|
+
/* @__PURE__ */ jsx42(MeterTrack, {
|
|
3752
|
+
children: /* @__PURE__ */ jsx42(MeterIndicator, {})
|
|
3753
|
+
})
|
|
3754
|
+
]
|
|
3755
|
+
})
|
|
3756
|
+
}, item.id))
|
|
3757
|
+
}),
|
|
3758
|
+
!items.length && /* @__PURE__ */ jsx42("p", {
|
|
3759
|
+
role: "status",
|
|
3760
|
+
className: "text-sm text-muted-foreground",
|
|
3761
|
+
children: "No data available."
|
|
3762
|
+
})
|
|
3763
|
+
]
|
|
3764
|
+
});
|
|
3765
|
+
}
|
|
3766
|
+
// src/components/StatusTracker.tsx
|
|
3767
|
+
import { jsx as jsx43, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
3768
|
+
var statusClasses = { success: "bg-success", warning: "bg-warning", error: "bg-destructive", unknown: "bg-muted" };
|
|
3769
|
+
function StatusTracker({ label, items, onItemSelect, density }) {
|
|
3770
|
+
return /* @__PURE__ */ jsx43(TooltipProvider2, {
|
|
3771
|
+
children: /* @__PURE__ */ jsx43("div", {
|
|
3772
|
+
role: "group",
|
|
3773
|
+
"aria-label": label,
|
|
3774
|
+
"data-density": density,
|
|
3775
|
+
className: "flex min-w-0 gap-1",
|
|
3776
|
+
children: items.map((item) => /* @__PURE__ */ jsxs29(Tooltip2, {
|
|
3777
|
+
children: [
|
|
3778
|
+
/* @__PURE__ */ jsx43(TooltipTrigger2, {
|
|
3779
|
+
"aria-label": `${item.label}: ${item.status}`,
|
|
3780
|
+
onClick: () => onItemSelect?.(item),
|
|
3781
|
+
className: cn2("h-8 min-w-2 flex-1 rounded-sm outline-none focus-visible:ring-2 focus-visible:ring-ring", statusClasses[item.status])
|
|
3782
|
+
}),
|
|
3783
|
+
/* @__PURE__ */ jsxs29(TooltipContent2, {
|
|
3784
|
+
children: [
|
|
3785
|
+
item.label,
|
|
3786
|
+
": ",
|
|
3787
|
+
item.description ?? item.status
|
|
3788
|
+
]
|
|
3789
|
+
})
|
|
3790
|
+
]
|
|
3791
|
+
}, item.id))
|
|
3792
|
+
})
|
|
3793
|
+
});
|
|
3794
|
+
}
|
|
3795
|
+
// src/components/DashboardLayout.tsx
|
|
3796
|
+
import { jsx as jsx44, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
3797
|
+
function DashboardLayout({
|
|
3798
|
+
title,
|
|
3799
|
+
description,
|
|
3800
|
+
actions,
|
|
3801
|
+
filters,
|
|
3802
|
+
stats,
|
|
3803
|
+
children,
|
|
3804
|
+
footer,
|
|
3805
|
+
density
|
|
3806
|
+
}) {
|
|
3807
|
+
return /* @__PURE__ */ jsxs30("div", {
|
|
3808
|
+
"data-density": density,
|
|
3809
|
+
"data-scroll": "none",
|
|
3810
|
+
className: "grid min-w-0 gap-6",
|
|
3811
|
+
children: [
|
|
3812
|
+
/* @__PURE__ */ jsx44(PageHeader, {
|
|
3813
|
+
title,
|
|
3814
|
+
description,
|
|
3815
|
+
actions
|
|
3816
|
+
}),
|
|
3817
|
+
filters,
|
|
3818
|
+
stats.length > 0 && /* @__PURE__ */ jsx44("div", {
|
|
3819
|
+
className: "grid gap-4 sm:grid-cols-2 xl:grid-cols-4",
|
|
3820
|
+
children: stats.map(({ id, ...stat }) => /* @__PURE__ */ jsx44(StatCard, {
|
|
3821
|
+
...stat
|
|
3822
|
+
}, id))
|
|
3823
|
+
}),
|
|
3824
|
+
/* @__PURE__ */ jsx44("div", {
|
|
3825
|
+
className: "grid min-w-0 gap-4",
|
|
3826
|
+
children
|
|
3827
|
+
}),
|
|
3828
|
+
footer
|
|
3829
|
+
]
|
|
3830
|
+
});
|
|
3831
|
+
}
|
|
3832
|
+
// src/components/BillingUsage.tsx
|
|
3833
|
+
import { jsx as jsx45, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
3834
|
+
function BillingUsage({ plan, price, period, metrics, onManage, pending, density }) {
|
|
3835
|
+
return /* @__PURE__ */ jsxs31(Card2, {
|
|
3836
|
+
density,
|
|
3837
|
+
"aria-label": "Billing and usage",
|
|
3838
|
+
children: [
|
|
3839
|
+
/* @__PURE__ */ jsxs31(CardHeader2, {
|
|
3840
|
+
children: [
|
|
3841
|
+
/* @__PURE__ */ jsx45(CardTitle2, {
|
|
3842
|
+
children: plan
|
|
3843
|
+
}),
|
|
3844
|
+
/* @__PURE__ */ jsxs31(CardDescription2, {
|
|
3845
|
+
children: [
|
|
3846
|
+
price,
|
|
3847
|
+
" · ",
|
|
3848
|
+
period
|
|
3849
|
+
]
|
|
3850
|
+
})
|
|
3851
|
+
]
|
|
3852
|
+
}),
|
|
3853
|
+
/* @__PURE__ */ jsx45(CardContent2, {
|
|
3854
|
+
className: "grid gap-4",
|
|
3855
|
+
children: metrics.map((metric) => /* @__PURE__ */ jsxs31(Meter, {
|
|
3856
|
+
value: metric.used,
|
|
3857
|
+
max: metric.limit,
|
|
3858
|
+
"aria-label": metric.label,
|
|
3859
|
+
children: [
|
|
3860
|
+
/* @__PURE__ */ jsxs31("div", {
|
|
3861
|
+
className: "mb-2 flex items-center justify-between gap-3 text-sm",
|
|
3862
|
+
children: [
|
|
3863
|
+
/* @__PURE__ */ jsx45(MeterLabel, {
|
|
3864
|
+
children: metric.label
|
|
3865
|
+
}),
|
|
3866
|
+
/* @__PURE__ */ jsx45(MeterValue, {
|
|
3867
|
+
children: () => `${metric.used.toLocaleString()} / ${metric.limit.toLocaleString()}${metric.unit ? ` ${metric.unit}` : ""}`
|
|
3868
|
+
})
|
|
3869
|
+
]
|
|
3870
|
+
}),
|
|
3871
|
+
/* @__PURE__ */ jsx45(MeterTrack, {
|
|
3872
|
+
children: /* @__PURE__ */ jsx45(MeterIndicator, {})
|
|
3873
|
+
})
|
|
3874
|
+
]
|
|
3875
|
+
}, metric.id))
|
|
3876
|
+
}),
|
|
3877
|
+
/* @__PURE__ */ jsx45(CardFooter2, {
|
|
3878
|
+
children: /* @__PURE__ */ jsx45(Button2, {
|
|
3879
|
+
type: "button",
|
|
3880
|
+
variant: "outline",
|
|
3881
|
+
onClick: onManage,
|
|
3882
|
+
disabled: pending,
|
|
3883
|
+
children: "Manage billing"
|
|
3884
|
+
})
|
|
3885
|
+
})
|
|
3886
|
+
]
|
|
3887
|
+
});
|
|
3888
|
+
}
|
|
3215
3889
|
export {
|
|
3216
3890
|
Accordion,
|
|
3217
3891
|
AccordionContent,
|
|
3218
3892
|
AccordionItem,
|
|
3219
3893
|
AccordionTrigger,
|
|
3894
|
+
AccountMenu,
|
|
3220
3895
|
Alert2 as Alert,
|
|
3221
3896
|
AlertAction2 as AlertAction,
|
|
3222
3897
|
AlertDescription2 as AlertDescription,
|
|
@@ -3233,6 +3908,7 @@ export {
|
|
|
3233
3908
|
AlertDialogTitle,
|
|
3234
3909
|
AlertDialogTrigger,
|
|
3235
3910
|
AlertTitle2 as AlertTitle,
|
|
3911
|
+
AppShell,
|
|
3236
3912
|
AspectRatio,
|
|
3237
3913
|
Attachment,
|
|
3238
3914
|
AttachmentAction,
|
|
@@ -3243,6 +3919,7 @@ export {
|
|
|
3243
3919
|
AttachmentMedia,
|
|
3244
3920
|
AttachmentTitle,
|
|
3245
3921
|
AttachmentTrigger,
|
|
3922
|
+
AuthForm,
|
|
3246
3923
|
Avatar2 as Avatar,
|
|
3247
3924
|
AvatarBadge2 as AvatarBadge,
|
|
3248
3925
|
AvatarFallback2 as AvatarFallback,
|
|
@@ -3250,6 +3927,8 @@ export {
|
|
|
3250
3927
|
AvatarGroupCount2 as AvatarGroupCount,
|
|
3251
3928
|
AvatarImage2 as AvatarImage,
|
|
3252
3929
|
Badge2 as Badge,
|
|
3930
|
+
BarList,
|
|
3931
|
+
BillingUsage,
|
|
3253
3932
|
Breadcrumb,
|
|
3254
3933
|
BreadcrumbEllipsis,
|
|
3255
3934
|
BreadcrumbItem,
|
|
@@ -3308,6 +3987,7 @@ export {
|
|
|
3308
3987
|
ContextMenuSubContent,
|
|
3309
3988
|
ContextMenuSubTrigger,
|
|
3310
3989
|
ContextMenuTrigger,
|
|
3990
|
+
DashboardLayout,
|
|
3311
3991
|
DensityProvider,
|
|
3312
3992
|
Dialog2 as Dialog,
|
|
3313
3993
|
DialogClose2 as DialogClose,
|
|
@@ -3320,9 +4000,9 @@ export {
|
|
|
3320
4000
|
DialogTitle2 as DialogTitle,
|
|
3321
4001
|
DialogTrigger2 as DialogTrigger,
|
|
3322
4002
|
DirectionProvider2 as DirectionProvider,
|
|
3323
|
-
DragDropPreview,
|
|
3324
|
-
DragDropProvider,
|
|
3325
|
-
DragSource,
|
|
4003
|
+
DragDropPreview2 as DragDropPreview,
|
|
4004
|
+
DragDropProvider2 as DragDropProvider,
|
|
4005
|
+
DragSource2 as DragSource,
|
|
3326
4006
|
Drawer,
|
|
3327
4007
|
DrawerClose,
|
|
3328
4008
|
DrawerContent,
|
|
@@ -3334,7 +4014,7 @@ export {
|
|
|
3334
4014
|
DrawerSwipeHandle,
|
|
3335
4015
|
DrawerTitle,
|
|
3336
4016
|
DrawerTrigger,
|
|
3337
|
-
DropTarget,
|
|
4017
|
+
DropTarget2 as DropTarget,
|
|
3338
4018
|
DropdownMenu2 as DropdownMenu,
|
|
3339
4019
|
DropdownMenuCheckboxItem2 as DropdownMenuCheckboxItem,
|
|
3340
4020
|
DropdownMenuContent2 as DropdownMenuContent,
|
|
@@ -3367,6 +4047,7 @@ export {
|
|
|
3367
4047
|
FieldSeparator2 as FieldSeparator,
|
|
3368
4048
|
FieldSet2 as FieldSet,
|
|
3369
4049
|
FieldTitle2 as FieldTitle,
|
|
4050
|
+
FilterBar,
|
|
3370
4051
|
HoverCard2 as HoverCard,
|
|
3371
4052
|
HoverCardContent2 as HoverCardContent,
|
|
3372
4053
|
HoverCardTrigger2 as HoverCardTrigger,
|
|
@@ -3390,6 +4071,7 @@ export {
|
|
|
3390
4071
|
ItemSeparator,
|
|
3391
4072
|
ItemTitle,
|
|
3392
4073
|
JsonViewer,
|
|
4074
|
+
Kanban2 as Kanban,
|
|
3393
4075
|
Kbd2 as Kbd,
|
|
3394
4076
|
KbdGroup2 as KbdGroup,
|
|
3395
4077
|
Label2 as Label,
|
|
@@ -3418,9 +4100,14 @@ export {
|
|
|
3418
4100
|
MessageFooter,
|
|
3419
4101
|
MessageGroup,
|
|
3420
4102
|
MessageHeader,
|
|
3421
|
-
|
|
3422
|
-
|
|
3423
|
-
|
|
4103
|
+
Meter,
|
|
4104
|
+
MeterIndicator,
|
|
4105
|
+
MeterLabel,
|
|
4106
|
+
MeterTrack,
|
|
4107
|
+
MeterValue,
|
|
4108
|
+
NativeSelect2 as NativeSelect,
|
|
4109
|
+
NativeSelectOptGroup2 as NativeSelectOptGroup,
|
|
4110
|
+
NativeSelectOption2 as NativeSelectOption,
|
|
3424
4111
|
NavigationMenu,
|
|
3425
4112
|
NavigationMenuContent,
|
|
3426
4113
|
NavigationMenuIndicator,
|
|
@@ -3429,6 +4116,14 @@ export {
|
|
|
3429
4116
|
NavigationMenuList,
|
|
3430
4117
|
NavigationMenuPositioner,
|
|
3431
4118
|
NavigationMenuTrigger,
|
|
4119
|
+
NumberField,
|
|
4120
|
+
NumberFieldDecrement,
|
|
4121
|
+
NumberFieldGroup,
|
|
4122
|
+
NumberFieldIncrement,
|
|
4123
|
+
NumberFieldInput,
|
|
4124
|
+
NumberFieldScrubArea,
|
|
4125
|
+
NumberFieldScrubAreaCursor,
|
|
4126
|
+
PageHeader,
|
|
3432
4127
|
PageMessage,
|
|
3433
4128
|
Pagination,
|
|
3434
4129
|
PaginationContent,
|
|
@@ -3465,6 +4160,7 @@ export {
|
|
|
3465
4160
|
SelectTrigger,
|
|
3466
4161
|
SelectValue,
|
|
3467
4162
|
Separator2 as Separator,
|
|
4163
|
+
SettingsSection,
|
|
3468
4164
|
Sheet2 as Sheet,
|
|
3469
4165
|
SheetClose2 as SheetClose,
|
|
3470
4166
|
SheetContent2 as SheetContent,
|
|
@@ -3500,6 +4196,13 @@ export {
|
|
|
3500
4196
|
Slider2 as Slider,
|
|
3501
4197
|
Spinner2 as Spinner,
|
|
3502
4198
|
StarRating,
|
|
4199
|
+
StatCard,
|
|
4200
|
+
StatusTracker,
|
|
4201
|
+
Stepper,
|
|
4202
|
+
StepperContent,
|
|
4203
|
+
StepperIndicator,
|
|
4204
|
+
StepperList,
|
|
4205
|
+
StepperTrigger,
|
|
3503
4206
|
Switch2 as Switch,
|
|
3504
4207
|
Table2 as Table,
|
|
3505
4208
|
TableBody2 as TableBody,
|
|
@@ -3509,10 +4212,11 @@ export {
|
|
|
3509
4212
|
TableHead2 as TableHead,
|
|
3510
4213
|
TableHeader2 as TableHeader,
|
|
3511
4214
|
TableRow2 as TableRow,
|
|
3512
|
-
Tabs,
|
|
3513
|
-
TabsContent,
|
|
3514
|
-
TabsList,
|
|
3515
|
-
TabsTrigger,
|
|
4215
|
+
Tabs2 as Tabs,
|
|
4216
|
+
TabsContent2 as TabsContent,
|
|
4217
|
+
TabsList2 as TabsList,
|
|
4218
|
+
TabsTrigger2 as TabsTrigger,
|
|
4219
|
+
TagInput,
|
|
3516
4220
|
Textarea2 as Textarea,
|
|
3517
4221
|
ThemeProvider,
|
|
3518
4222
|
Toast,
|
|
@@ -3528,10 +4232,17 @@ export {
|
|
|
3528
4232
|
Toggle2 as Toggle,
|
|
3529
4233
|
ToggleGroup2 as ToggleGroup,
|
|
3530
4234
|
ToggleGroupItem2 as ToggleGroupItem,
|
|
4235
|
+
Toolbar2 as Toolbar,
|
|
4236
|
+
ToolbarButton2 as ToolbarButton,
|
|
4237
|
+
ToolbarGroup2 as ToolbarGroup,
|
|
4238
|
+
ToolbarInput2 as ToolbarInput,
|
|
4239
|
+
ToolbarLink2 as ToolbarLink,
|
|
4240
|
+
ToolbarSeparator2 as ToolbarSeparator,
|
|
3531
4241
|
Tooltip2 as Tooltip,
|
|
3532
4242
|
TooltipContent2 as TooltipContent,
|
|
3533
4243
|
TooltipProvider2 as TooltipProvider,
|
|
3534
4244
|
TooltipTrigger2 as TooltipTrigger,
|
|
4245
|
+
WorkspaceSwitcher,
|
|
3535
4246
|
badgeVariants2 as badgeVariants,
|
|
3536
4247
|
buttonGroupVariants,
|
|
3537
4248
|
buttonVariants2 as buttonVariants,
|
|
@@ -3539,13 +4250,13 @@ export {
|
|
|
3539
4250
|
createToastManager,
|
|
3540
4251
|
markerVariants,
|
|
3541
4252
|
navigationMenuTriggerStyle,
|
|
3542
|
-
tabsListVariants,
|
|
4253
|
+
tabsListVariants2 as tabsListVariants,
|
|
3543
4254
|
toggleVariants2 as toggleVariants,
|
|
3544
4255
|
useComboboxAnchor,
|
|
3545
4256
|
useDirection2 as useDirection,
|
|
3546
|
-
useDragDrop,
|
|
3547
|
-
useDragSource,
|
|
3548
|
-
useDropTarget,
|
|
4257
|
+
useDragDrop2 as useDragDrop,
|
|
4258
|
+
useDragSource2 as useDragSource,
|
|
4259
|
+
useDropTarget2 as useDropTarget,
|
|
3549
4260
|
usePortalContainer2 as usePortalContainer,
|
|
3550
4261
|
useSidebar2 as useSidebar,
|
|
3551
4262
|
useTheme2 as useTheme,
|