@konopskidev/ui 0.1.2 → 0.2.0
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 +102 -13
- package/dist/chunks/rolldown-runtime-CmQyd0Gu.cjs +27 -0
- package/dist/components/ui/accordion.cjs +62 -0
- package/dist/components/ui/accordion.cjs.map +1 -0
- package/dist/components/ui/accordion.d.cts +7 -0
- package/dist/components/ui/accordion.d.ts.map +1 -1
- package/dist/components/ui/accordion.js +9 -8
- package/dist/components/ui/accordion.js.map +1 -1
- package/dist/components/ui/alert-dialog.cjs +116 -0
- package/dist/components/ui/alert-dialog.cjs.map +1 -0
- package/dist/components/ui/alert-dialog.d.cts +18 -0
- package/dist/components/ui/alert-dialog.d.ts.map +1 -1
- package/dist/components/ui/alert-dialog.js +13 -12
- package/dist/components/ui/alert-dialog.js.map +1 -1
- package/dist/components/ui/alert.cjs +49 -0
- package/dist/components/ui/alert.cjs.map +1 -0
- package/dist/components/ui/alert.d.cts +10 -0
- package/dist/components/ui/aspect-ratio.cjs +14 -0
- package/dist/components/ui/aspect-ratio.cjs.map +1 -0
- package/dist/components/ui/aspect-ratio.d.cts +3 -0
- package/dist/components/ui/aspect-ratio.js +4 -5
- package/dist/components/ui/aspect-ratio.js.map +1 -1
- package/dist/components/ui/attachment.cjs +113 -0
- package/dist/components/ui/attachment.cjs.map +1 -0
- package/dist/components/ui/attachment.d.cts +24 -0
- package/dist/components/ui/avatar.cjs +60 -0
- package/dist/components/ui/avatar.cjs.map +1 -0
- package/dist/components/ui/avatar.d.cts +11 -0
- package/dist/components/ui/avatar.d.ts.map +1 -1
- package/dist/components/ui/avatar.js +7 -6
- package/dist/components/ui/avatar.js.map +1 -1
- package/dist/components/ui/badge.cjs +33 -0
- package/dist/components/ui/badge.cjs.map +1 -0
- package/dist/components/ui/badge.d.cts +9 -0
- package/dist/components/ui/breadcrumb.cjs +81 -0
- package/dist/components/ui/breadcrumb.cjs.map +1 -0
- package/dist/components/ui/breadcrumb.d.cts +11 -0
- package/dist/components/ui/bubble.cjs +79 -0
- package/dist/components/ui/bubble.cjs.map +1 -0
- package/dist/components/ui/bubble.d.cts +17 -0
- package/dist/components/ui/button-group.cjs +43 -0
- package/dist/components/ui/button-group.cjs.map +1 -0
- package/dist/components/ui/button-group.d.cts +11 -0
- package/dist/components/ui/button.cjs +64 -0
- package/dist/components/ui/button.cjs.map +1 -0
- package/dist/components/ui/button.d.cts +21 -0
- package/dist/components/ui/calendar.cjs +114 -0
- package/dist/components/ui/calendar.cjs.map +1 -0
- package/dist/components/ui/calendar.d.cts +10 -0
- package/dist/components/ui/calendar.js +0 -1
- package/dist/components/ui/calendar.js.map +1 -1
- package/dist/components/ui/card.cjs +80 -0
- package/dist/components/ui/card.cjs.map +1 -0
- package/dist/components/ui/card.d.cts +33 -0
- package/dist/components/ui/card.d.ts +7 -2
- package/dist/components/ui/card.d.ts.map +1 -1
- package/dist/components/ui/card.js.map +1 -1
- package/dist/components/ui/carousel.cjs +142 -0
- package/dist/components/ui/carousel.cjs.map +1 -0
- package/dist/components/ui/carousel.d.cts +28 -0
- package/dist/components/ui/carousel.d.ts +1 -1
- package/dist/components/ui/carousel.d.ts.map +1 -1
- package/dist/components/ui/carousel.js +1 -0
- package/dist/components/ui/carousel.js.map +1 -1
- package/dist/components/ui/chart.cjs +159 -0
- package/dist/components/ui/chart.cjs.map +1 -0
- package/dist/components/ui/chart.d.cts +44 -0
- package/dist/components/ui/chart.js +0 -1
- package/dist/components/ui/chart.js.map +1 -1
- package/dist/components/ui/checkbox.cjs +25 -0
- package/dist/components/ui/checkbox.cjs.map +1 -0
- package/dist/components/ui/checkbox.d.cts +4 -0
- package/dist/components/ui/checkbox.d.ts.map +1 -1
- package/dist/components/ui/checkbox.js +6 -5
- package/dist/components/ui/checkbox.js.map +1 -1
- package/dist/components/ui/code-block.cjs +134 -0
- package/dist/components/ui/code-block.cjs.map +1 -0
- package/dist/components/ui/code-block.d.cts +26 -0
- package/dist/components/ui/code-block.d.ts.map +1 -1
- package/dist/components/ui/code-block.js +1 -0
- package/dist/components/ui/code-block.js.map +1 -1
- package/dist/components/ui/collapsible.cjs +28 -0
- package/dist/components/ui/collapsible.cjs.map +1 -0
- package/dist/components/ui/collapsible.d.cts +5 -0
- package/dist/components/ui/collapsible.js +6 -7
- package/dist/components/ui/collapsible.js.map +1 -1
- package/dist/components/ui/combobox.cjs +193 -0
- package/dist/components/ui/combobox.cjs.map +1 -0
- package/dist/components/ui/combobox.d.cts +24 -0
- package/dist/components/ui/combobox.d.ts.map +1 -1
- package/dist/components/ui/combobox.js +22 -21
- package/dist/components/ui/combobox.js.map +1 -1
- package/dist/components/ui/command.cjs +99 -0
- package/dist/components/ui/command.cjs.map +1 -0
- package/dist/components/ui/command.d.cts +18 -0
- package/dist/components/ui/command.d.ts.map +1 -1
- package/dist/components/ui/command.js +10 -12
- package/dist/components/ui/command.js.map +1 -1
- package/dist/components/ui/context-menu.cjs +143 -0
- package/dist/components/ui/context-menu.cjs.map +1 -0
- package/dist/components/ui/context-menu.d.cts +31 -0
- package/dist/components/ui/context-menu.d.ts.map +1 -1
- package/dist/components/ui/context-menu.js +20 -19
- package/dist/components/ui/context-menu.js.map +1 -1
- package/dist/components/ui/dialog.cjs +148 -0
- package/dist/components/ui/dialog.cjs.map +1 -0
- package/dist/components/ui/dialog.d.cts +55 -0
- package/dist/components/ui/dialog.d.ts +41 -3
- package/dist/components/ui/dialog.d.ts.map +1 -1
- package/dist/components/ui/dialog.js +65 -26
- package/dist/components/ui/dialog.js.map +1 -1
- package/dist/components/ui/direction.cjs +19 -0
- package/dist/components/ui/direction.cjs.map +1 -0
- package/dist/components/ui/direction.d.cts +11 -0
- package/dist/components/ui/direction.d.ts +1 -1
- package/dist/components/ui/direction.d.ts.map +1 -1
- package/dist/components/ui/direction.js +0 -1
- package/dist/components/ui/direction.js.map +1 -1
- package/dist/components/ui/drawer.cjs +90 -0
- package/dist/components/ui/drawer.cjs.map +1 -0
- package/dist/components/ui/drawer.d.cts +13 -0
- package/dist/components/ui/drawer.js +11 -11
- package/dist/components/ui/drawer.js.map +1 -1
- package/dist/components/ui/dropdown-menu.cjs +146 -0
- package/dist/components/ui/dropdown-menu.cjs.map +1 -0
- package/dist/components/ui/dropdown-menu.d.cts +29 -0
- package/dist/components/ui/dropdown-menu.js +19 -20
- package/dist/components/ui/dropdown-menu.js.map +1 -1
- package/dist/components/ui/empty.cjs +66 -0
- package/dist/components/ui/empty.cjs.map +1 -0
- package/dist/components/ui/empty.d.cts +11 -0
- package/dist/components/ui/field.cjs +121 -0
- package/dist/components/ui/field.cjs.map +1 -0
- package/dist/components/ui/field.d.cts +24 -0
- package/dist/components/ui/field.js +0 -1
- package/dist/components/ui/field.js.map +1 -1
- package/dist/components/ui/hover-card.cjs +38 -0
- package/dist/components/ui/hover-card.cjs.map +1 -0
- package/dist/components/ui/hover-card.d.cts +6 -0
- package/dist/components/ui/hover-card.d.ts.map +1 -1
- package/dist/components/ui/hover-card.js +8 -7
- package/dist/components/ui/hover-card.js.map +1 -1
- package/dist/components/ui/input-group.cjs +87 -0
- package/dist/components/ui/input-group.cjs.map +1 -0
- package/dist/components/ui/input-group.d.cts +16 -0
- package/dist/components/ui/input-otp.cjs +54 -0
- package/dist/components/ui/input-otp.cjs.map +1 -0
- package/dist/components/ui/input-otp.d.cts +11 -0
- package/dist/components/ui/input-otp.js +0 -1
- package/dist/components/ui/input-otp.js.map +1 -1
- package/dist/components/ui/input.cjs +28 -0
- package/dist/components/ui/input.cjs.map +1 -0
- package/dist/components/ui/input.d.cts +10 -0
- package/dist/components/ui/item.cjs +133 -0
- package/dist/components/ui/item.cjs.map +1 -0
- package/dist/components/ui/item.d.cts +23 -0
- package/dist/components/ui/kbd.cjs +22 -0
- package/dist/components/ui/kbd.cjs.map +1 -0
- package/dist/components/ui/kbd.d.cts +3 -0
- package/dist/components/ui/label.cjs +19 -0
- package/dist/components/ui/label.cjs.map +1 -0
- package/dist/components/ui/label.d.cts +4 -0
- package/dist/components/ui/label.d.ts.map +1 -1
- package/dist/components/ui/label.js +5 -4
- package/dist/components/ui/label.js.map +1 -1
- package/dist/components/ui/marker.cjs +46 -0
- package/dist/components/ui/marker.cjs.map +1 -0
- package/dist/components/ui/marker.d.cts +11 -0
- package/dist/components/ui/menubar.cjs +154 -0
- package/dist/components/ui/menubar.cjs.map +1 -0
- package/dist/components/ui/menubar.d.cts +30 -0
- package/dist/components/ui/menubar.js +20 -21
- package/dist/components/ui/menubar.js.map +1 -1
- package/dist/components/ui/message-scroller.cjs +87 -0
- package/dist/components/ui/message-scroller.cjs.map +1 -0
- package/dist/components/ui/message-scroller.d.cts +10 -0
- package/dist/components/ui/message-scroller.js +9 -9
- package/dist/components/ui/message-scroller.js.map +1 -1
- package/dist/components/ui/message.cjs +58 -0
- package/dist/components/ui/message.cjs.map +1 -0
- package/dist/components/ui/message.d.cts +10 -0
- package/dist/components/ui/native-select.cjs +44 -0
- package/dist/components/ui/native-select.cjs.map +1 -0
- package/dist/components/ui/native-select.d.cts +8 -0
- package/dist/components/ui/native-select.d.ts +1 -1
- package/dist/components/ui/native-select.d.ts.map +1 -1
- package/dist/components/ui/native-select.js.map +1 -1
- package/dist/components/ui/navigation-menu.cjs +93 -0
- package/dist/components/ui/navigation-menu.cjs.map +1 -0
- package/dist/components/ui/navigation-menu.d.cts +14 -0
- package/dist/components/ui/navigation-menu.d.ts.map +1 -1
- package/dist/components/ui/navigation-menu.js +12 -11
- package/dist/components/ui/navigation-menu.js.map +1 -1
- package/dist/components/ui/pagination.cjs +90 -0
- package/dist/components/ui/pagination.cjs.map +1 -0
- package/dist/components/ui/pagination.d.cts +17 -0
- package/dist/components/ui/pagination.d.ts +1 -1
- package/dist/components/ui/pagination.d.ts.map +1 -1
- package/dist/components/ui/pagination.js.map +1 -1
- package/dist/components/ui/popover.cjs +66 -0
- package/dist/components/ui/popover.cjs.map +1 -0
- package/dist/components/ui/popover.d.cts +10 -0
- package/dist/components/ui/popover.d.ts.map +1 -1
- package/dist/components/ui/popover.js +8 -7
- package/dist/components/ui/popover.js.map +1 -1
- package/dist/components/ui/progress.cjs +25 -0
- package/dist/components/ui/progress.cjs.map +1 -0
- package/dist/components/ui/progress.d.cts +4 -0
- package/dist/components/ui/progress.js +5 -6
- package/dist/components/ui/progress.js.map +1 -1
- package/dist/components/ui/questionnaire.cjs +187 -0
- package/dist/components/ui/questionnaire.cjs.map +1 -0
- package/dist/components/ui/questionnaire.d.cts +19 -0
- package/dist/components/ui/questionnaire.d.ts.map +1 -1
- package/dist/components/ui/questionnaire.js +19 -21
- package/dist/components/ui/questionnaire.js.map +1 -1
- package/dist/components/ui/radio-group.cjs +32 -0
- package/dist/components/ui/radio-group.cjs.map +1 -0
- package/dist/components/ui/radio-group.d.cts +5 -0
- package/dist/components/ui/radio-group.d.ts.map +1 -1
- package/dist/components/ui/radio-group.js +7 -6
- package/dist/components/ui/radio-group.js.map +1 -1
- package/dist/components/ui/resizable.cjs +33 -0
- package/dist/components/ui/resizable.cjs.map +1 -0
- package/dist/components/ui/resizable.d.cts +7 -0
- package/dist/components/ui/resizable.d.ts.map +1 -1
- package/dist/components/ui/resizable.js +0 -2
- package/dist/components/ui/resizable.js.map +1 -1
- package/dist/components/ui/scroll-area.cjs +43 -0
- package/dist/components/ui/scroll-area.cjs.map +1 -0
- package/dist/components/ui/scroll-area.d.cts +5 -0
- package/dist/components/ui/scroll-area.d.ts.map +1 -1
- package/dist/components/ui/scroll-area.js +9 -8
- package/dist/components/ui/scroll-area.js.map +1 -1
- package/dist/components/ui/select.cjs +113 -0
- package/dist/components/ui/select.cjs.map +1 -0
- package/dist/components/ui/select.d.cts +15 -0
- package/dist/components/ui/select.js +17 -18
- package/dist/components/ui/select.js.map +1 -1
- package/dist/components/ui/separator.cjs +21 -0
- package/dist/components/ui/separator.cjs.map +1 -0
- package/dist/components/ui/separator.d.cts +4 -0
- package/dist/components/ui/separator.d.ts.map +1 -1
- package/dist/components/ui/separator.js +5 -4
- package/dist/components/ui/separator.js.map +1 -1
- package/dist/components/ui/sheet.cjs +101 -0
- package/dist/components/ui/sheet.cjs.map +1 -0
- package/dist/components/ui/sheet.d.cts +14 -0
- package/dist/components/ui/sheet.d.ts.map +1 -1
- package/dist/components/ui/sheet.js +1 -0
- package/dist/components/ui/sheet.js.map +1 -1
- package/dist/components/ui/sidebar.cjs +405 -0
- package/dist/components/ui/sidebar.cjs.map +1 -0
- package/dist/components/ui/sidebar.d.cts +69 -0
- package/dist/components/ui/sidebar.js +0 -1
- package/dist/components/ui/sidebar.js.map +1 -1
- package/dist/components/ui/skeleton.cjs +14 -0
- package/dist/components/ui/skeleton.cjs.map +1 -0
- package/dist/components/ui/skeleton.d.cts +2 -0
- package/dist/components/ui/slider.cjs +42 -0
- package/dist/components/ui/slider.cjs.map +1 -0
- package/dist/components/ui/slider.d.cts +7 -0
- package/dist/components/ui/slider.js +7 -8
- package/dist/components/ui/slider.js.map +1 -1
- package/dist/components/ui/sonner.cjs +36 -0
- package/dist/components/ui/sonner.cjs.map +1 -0
- package/dist/components/ui/sonner.d.cts +13 -0
- package/dist/components/ui/sonner.d.ts.map +1 -1
- package/dist/components/ui/sonner.js +4 -6
- package/dist/components/ui/sonner.js.map +1 -1
- package/dist/components/ui/spinner.cjs +17 -0
- package/dist/components/ui/spinner.cjs.map +1 -0
- package/dist/components/ui/spinner.d.cts +2 -0
- package/dist/components/ui/switch.cjs +24 -0
- package/dist/components/ui/switch.cjs.map +1 -0
- package/dist/components/ui/switch.d.cts +6 -0
- package/dist/components/ui/switch.js +5 -6
- package/dist/components/ui/switch.js.map +1 -1
- package/dist/components/ui/table.cjs +77 -0
- package/dist/components/ui/table.cjs.map +1 -0
- package/dist/components/ui/table.d.cts +10 -0
- package/dist/components/ui/tabs.cjs +54 -0
- package/dist/components/ui/tabs.cjs.map +1 -0
- package/dist/components/ui/tabs.d.cts +11 -0
- package/dist/components/ui/tabs.js +7 -8
- package/dist/components/ui/tabs.js.map +1 -1
- package/dist/components/ui/textarea.cjs +39 -0
- package/dist/components/ui/textarea.cjs.map +1 -0
- package/dist/components/ui/textarea.d.cts +9 -0
- package/dist/components/ui/textarea.js +0 -1
- package/dist/components/ui/textarea.js.map +1 -1
- package/dist/components/ui/toggle-group.cjs +56 -0
- package/dist/components/ui/toggle-group.cjs.map +1 -0
- package/dist/components/ui/toggle-group.d.cts +10 -0
- package/dist/components/ui/toggle-group.js +5 -6
- package/dist/components/ui/toggle-group.js.map +1 -1
- package/dist/components/ui/toggle.cjs +41 -0
- package/dist/components/ui/toggle.cjs.map +1 -0
- package/dist/components/ui/toggle.d.cts +9 -0
- package/dist/components/ui/toggle.d.ts.map +1 -1
- package/dist/components/ui/toggle.js +5 -4
- package/dist/components/ui/toggle.js.map +1 -1
- package/dist/components/ui/tooltip.cjs +43 -0
- package/dist/components/ui/tooltip.cjs.map +1 -0
- package/dist/components/ui/tooltip.d.cts +7 -0
- package/dist/components/ui/tooltip.js +8 -9
- package/dist/components/ui/tooltip.js.map +1 -1
- package/dist/components/ui/trace.cjs +86 -0
- package/dist/components/ui/trace.cjs.map +1 -0
- package/dist/components/ui/trace.d.cts +18 -0
- package/dist/hooks/use-highlighted-code.d.ts.map +1 -1
- package/dist/hooks/use-highlighted-code.js +56 -0
- package/dist/hooks/use-highlighted-code.js.map +1 -0
- package/dist/hooks/use-mobile.cjs +26 -0
- package/dist/hooks/use-mobile.cjs.map +1 -0
- package/dist/hooks/use-mobile.d.cts +1 -0
- package/dist/hooks/use-mobile.d.ts.map +1 -1
- package/dist/hooks/use-mobile.js +1 -0
- package/dist/hooks/use-mobile.js.map +1 -1
- package/dist/index.cjs +356 -0
- package/dist/index.d.cts +67 -0
- package/dist/index.d.ts +5 -11
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +3 -14
- package/dist/lib/get-placeholder.cjs +13 -0
- package/dist/lib/get-placeholder.cjs.map +1 -0
- package/dist/lib/get-placeholder.d.cts +5 -0
- package/dist/lib/highlighter.js +79 -0
- package/dist/lib/highlighter.js.map +1 -0
- package/dist/lib/utils.cjs +8 -0
- package/dist/lib/utils.d.cts +8 -0
- package/{src → dist}/styles/globals.css +11 -0
- package/package.json +111 -32
- /package/{src → dist}/styles/base.css +0 -0
- /package/{src → dist}/styles/prose.css +0 -0
- /package/{src → dist}/styles/theme.css +0 -0
- /package/{src → dist}/styles/tokens.css +0 -0
- /package/{src → dist}/styles/utilities.css +0 -0
- /package/{src → dist}/styles/variants.css +0 -0
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
2
|
+
const require_rolldown_runtime = require("../../chunks/rolldown-runtime-CmQyd0Gu.cjs");
|
|
3
|
+
let cn = require("cn");
|
|
4
|
+
let radix_ui = require("radix-ui");
|
|
5
|
+
let react = require("react");
|
|
6
|
+
react = require_rolldown_runtime.__toESM(react, 1);
|
|
7
|
+
let react_jsx_runtime = require("react/jsx-runtime");
|
|
8
|
+
// src/components/ui/card.tsx
|
|
9
|
+
function Card({ className, interactive = false, ...props }) {
|
|
10
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
11
|
+
"data-slot": "card",
|
|
12
|
+
className: (0, cn.cn)("flex flex-col card", interactive && "transition-colors hover:border-foreground/25", className),
|
|
13
|
+
...props
|
|
14
|
+
});
|
|
15
|
+
}
|
|
16
|
+
function CardHeader({ className, ...props }) {
|
|
17
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
18
|
+
"data-slot": "card-header",
|
|
19
|
+
className: (0, cn.cn)("flex flex-col gap-2 p-5", className),
|
|
20
|
+
...props
|
|
21
|
+
});
|
|
22
|
+
}
|
|
23
|
+
function CardTitle({ className, asChild = false, ...props }) {
|
|
24
|
+
const Comp = asChild ? radix_ui.Slot.Root : "div";
|
|
25
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Comp, {
|
|
26
|
+
"data-slot": "card-title",
|
|
27
|
+
className: (0, cn.cn)("font-display text-h3 font-semibold tracking-tight", className),
|
|
28
|
+
...props
|
|
29
|
+
});
|
|
30
|
+
}
|
|
31
|
+
function CardDescription({ className, ...props }) {
|
|
32
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
33
|
+
"data-slot": "card-description",
|
|
34
|
+
className: (0, cn.cn)("text-base leading-relaxed text-muted-foreground", className),
|
|
35
|
+
...props
|
|
36
|
+
});
|
|
37
|
+
}
|
|
38
|
+
function CardAction({ className, ...props }) {
|
|
39
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
40
|
+
"data-slot": "card-action",
|
|
41
|
+
className: (0, cn.cn)("col-start-2 row-span-2 row-start-1 self-start justify-self-end", className),
|
|
42
|
+
...props
|
|
43
|
+
});
|
|
44
|
+
}
|
|
45
|
+
function CardContent({ className, ...props }) {
|
|
46
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
47
|
+
"data-slot": "card-content",
|
|
48
|
+
className: (0, cn.cn)("flex flex-col gap-2 p-5 pt-0", className),
|
|
49
|
+
...props
|
|
50
|
+
});
|
|
51
|
+
}
|
|
52
|
+
function CardFooter({ className, ...props }) {
|
|
53
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
54
|
+
"data-slot": "card-footer",
|
|
55
|
+
className: (0, cn.cn)("flex items-center p-5 pt-0", className),
|
|
56
|
+
...props
|
|
57
|
+
});
|
|
58
|
+
}
|
|
59
|
+
/**
|
|
60
|
+
* A bleeding card image, sized by aspect ratio. Framework-agnostic on purpose:
|
|
61
|
+
* this package never imports a framework-specific image component, so the same
|
|
62
|
+
* card works in Vite, Astro, Next or a plain HTML page.
|
|
63
|
+
*/
|
|
64
|
+
function CardImage({ className, aspect = "aspect-video", children }) {
|
|
65
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
66
|
+
"data-slot": "card-image",
|
|
67
|
+
className: (0, cn.cn)("relative overflow-hidden rounded-t-sm", aspect, className),
|
|
68
|
+
children
|
|
69
|
+
});
|
|
70
|
+
}
|
|
71
|
+
exports.Card = Card;
|
|
72
|
+
exports.CardAction = CardAction;
|
|
73
|
+
exports.CardContent = CardContent;
|
|
74
|
+
exports.CardDescription = CardDescription;
|
|
75
|
+
exports.CardFooter = CardFooter;
|
|
76
|
+
exports.CardHeader = CardHeader;
|
|
77
|
+
exports.CardImage = CardImage;
|
|
78
|
+
exports.CardTitle = CardTitle;
|
|
79
|
+
|
|
80
|
+
//# sourceMappingURL=card.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"card.cjs","names":["Slot"],"sources":["../../../src/components/ui/card.tsx"],"sourcesContent":["import { cn } from 'cn';\nimport { Slot } from 'radix-ui';\nimport * as React from 'react';\n\ntype CardProps = React.ComponentProps<'div'> & {\n /** Adds a subtle hover affordance for cards that behave as links. */\n interactive?: boolean;\n};\n\nfunction Card({ className, interactive = false, ...props }: CardProps) {\n return (\n <div\n data-slot=\"card\"\n className={cn(\n 'flex flex-col card',\n interactive && 'transition-colors hover:border-foreground/25',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction CardHeader({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div data-slot=\"card-header\" className={cn('flex flex-col gap-2 p-5', className)} {...props} />\n );\n}\n\ninterface CardTitleProps extends React.ComponentProps<'div'> {\n /** Render as a different element (e.g. h2, h3) while preserving styling. */\n asChild?: boolean;\n}\n\nfunction CardTitle({ className, asChild = false, ...props }: CardTitleProps) {\n const Comp = asChild ? Slot.Root : 'div';\n\n return (\n <Comp\n data-slot=\"card-title\"\n className={cn('font-display text-h3 font-semibold tracking-tight', className)}\n {...props}\n />\n );\n}\n\nfunction CardDescription({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"card-description\"\n className={cn('text-base leading-relaxed text-muted-foreground', className)}\n {...props}\n />\n );\n}\n\nfunction CardAction({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"card-action\"\n className={cn('col-start-2 row-span-2 row-start-1 self-start justify-self-end', className)}\n {...props}\n />\n );\n}\n\nfunction CardContent({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"card-content\"\n className={cn('flex flex-col gap-2 p-5 pt-0', className)}\n {...props}\n />\n );\n}\n\nfunction CardFooter({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"card-footer\"\n className={cn('flex items-center p-5 pt-0', className)}\n {...props}\n />\n );\n}\n\ninterface CardImageProps {\n aspect?: string;\n className?: string;\n /**\n * The media itself. Required on purpose: an aspect box with nothing in it is\n * never the intended result, and making it optional pushed every call site\n * into guarding the frame with its own conditional.\n */\n children: React.ReactNode;\n}\n\n/**\n * A bleeding card image, sized by aspect ratio. Framework-agnostic on purpose:\n * this package never imports a framework-specific image component, so the same\n * card works in Vite, Astro, Next or a plain HTML page.\n */\nfunction CardImage({ className, aspect = 'aspect-video', children }: CardImageProps) {\n return (\n <div\n data-slot=\"card-image\"\n className={cn('relative overflow-hidden rounded-t-sm', aspect, className)}\n >\n {children}\n </div>\n );\n}\nexport {\n Card,\n CardHeader,\n CardFooter,\n CardTitle,\n CardDescription,\n CardAction,\n CardContent,\n CardImage,\n type CardProps,\n type CardTitleProps,\n type CardImageProps,\n};\n"],"mappings":";;;;;;;;AASA,SAAS,KAAK,EAAE,WAAW,cAAc,OAAO,GAAG,SAAoB;CACrE,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAW,GAAA,GAAA,CACT,sBACA,eAAe,gDACf,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAAE,WAAW,GAAG,SAAsC;CACxE,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EAAK,aAAU;EAAc,YAAA,GAAW,GAAA,GAAA,CAAG,2BAA2B,SAAS;EAAG,GAAI;CAAQ,CAAA;AAElG;AAOA,SAAS,UAAU,EAAE,WAAW,UAAU,OAAO,GAAG,SAAyB;CAC3E,MAAM,OAAO,UAAUA,SAAAA,KAAK,OAAO;CAEnC,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,MAAD;EACE,aAAU;EACV,YAAA,GAAW,GAAA,GAAA,CAAG,qDAAqD,SAAS;EAC5E,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,gBAAgB,EAAE,WAAW,GAAG,SAAsC;CAC7E,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAW,GAAA,GAAA,CAAG,mDAAmD,SAAS;EAC1E,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAAE,WAAW,GAAG,SAAsC;CACxE,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAW,GAAA,GAAA,CAAG,kEAAkE,SAAS;EACzF,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAW,GAAA,GAAA,CAAG,gCAAgC,SAAS;EACvD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAAE,WAAW,GAAG,SAAsC;CACxE,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAW,GAAA,GAAA,CAAG,8BAA8B,SAAS;EACrD,GAAI;CACL,CAAA;AAEL;;;;;;AAkBA,SAAS,UAAU,EAAE,WAAW,SAAS,gBAAgB,YAA4B;CACnF,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,aAAU;EACV,YAAA,GAAW,GAAA,GAAA,CAAG,yCAAyC,QAAQ,SAAS;EAEvE;CACE,CAAA;AAET"}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
type CardProps = React.ComponentProps<'div'> & {
|
|
3
|
+
/** Adds a subtle hover affordance for cards that behave as links. */
|
|
4
|
+
interactive?: boolean;
|
|
5
|
+
};
|
|
6
|
+
declare function Card({ className, interactive, ...props }: CardProps): React.JSX.Element;
|
|
7
|
+
declare function CardHeader({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
8
|
+
interface CardTitleProps extends React.ComponentProps<'div'> {
|
|
9
|
+
/** Render as a different element (e.g. h2, h3) while preserving styling. */
|
|
10
|
+
asChild?: boolean;
|
|
11
|
+
}
|
|
12
|
+
declare function CardTitle({ className, asChild, ...props }: CardTitleProps): React.JSX.Element;
|
|
13
|
+
declare function CardDescription({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
14
|
+
declare function CardAction({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
15
|
+
declare function CardContent({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
16
|
+
declare function CardFooter({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
17
|
+
interface CardImageProps {
|
|
18
|
+
aspect?: string;
|
|
19
|
+
className?: string;
|
|
20
|
+
/**
|
|
21
|
+
* The media itself. Required on purpose: an aspect box with nothing in it is
|
|
22
|
+
* never the intended result, and making it optional pushed every call site
|
|
23
|
+
* into guarding the frame with its own conditional.
|
|
24
|
+
*/
|
|
25
|
+
children: React.ReactNode;
|
|
26
|
+
}
|
|
27
|
+
/**
|
|
28
|
+
* A bleeding card image, sized by aspect ratio. Framework-agnostic on purpose:
|
|
29
|
+
* this package never imports a framework-specific image component, so the same
|
|
30
|
+
* card works in Vite, Astro, Next or a plain HTML page.
|
|
31
|
+
*/
|
|
32
|
+
declare function CardImage({ className, aspect, children }: CardImageProps): React.JSX.Element;
|
|
33
|
+
export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardAction, CardContent, CardImage, type CardProps, type CardTitleProps, type CardImageProps, };
|
|
@@ -17,7 +17,12 @@ declare function CardFooter({ className, ...props }: React.ComponentProps<'div'>
|
|
|
17
17
|
interface CardImageProps {
|
|
18
18
|
aspect?: string;
|
|
19
19
|
className?: string;
|
|
20
|
-
|
|
20
|
+
/**
|
|
21
|
+
* The media itself. Required on purpose: an aspect box with nothing in it is
|
|
22
|
+
* never the intended result, and making it optional pushed every call site
|
|
23
|
+
* into guarding the frame with its own conditional.
|
|
24
|
+
*/
|
|
25
|
+
children: React.ReactNode;
|
|
21
26
|
}
|
|
22
27
|
/**
|
|
23
28
|
* A bleeding card image, sized by aspect ratio. Framework-agnostic on purpose:
|
|
@@ -25,5 +30,5 @@ interface CardImageProps {
|
|
|
25
30
|
* card works in Vite, Astro, Next or a plain HTML page.
|
|
26
31
|
*/
|
|
27
32
|
declare function CardImage({ className, aspect, children }: CardImageProps): React.JSX.Element;
|
|
28
|
-
export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardAction, CardContent, CardImage, type CardProps, type CardImageProps, };
|
|
33
|
+
export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardAction, CardContent, CardImage, type CardProps, type CardTitleProps, type CardImageProps, };
|
|
29
34
|
//# sourceMappingURL=card.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../../src/components/ui/card.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,KAAK,SAAS,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC7C,qEAAqE;IACrE,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF,iBAAS,IAAI,CAAC,EAAE,SAAS,EAAE,WAAmB,EAAE,GAAG,KAAK,EAAE,EAAE,SAAS,qBAYpE;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAIvE;AAED,UAAU,cAAe,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IAC1D,4EAA4E;IAC5E,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,iBAAS,SAAS,CAAC,EAAE,SAAS,EAAE,OAAe,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,qBAU1E;AAED,iBAAS,eAAe,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQ5E;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQvE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQxE;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQvE;AAED,UAAU,cAAc;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,
|
|
1
|
+
{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../../src/components/ui/card.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,KAAK,SAAS,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC7C,qEAAqE;IACrE,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF,iBAAS,IAAI,CAAC,EAAE,SAAS,EAAE,WAAmB,EAAE,GAAG,KAAK,EAAE,EAAE,SAAS,qBAYpE;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAIvE;AAED,UAAU,cAAe,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IAC1D,4EAA4E;IAC5E,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,iBAAS,SAAS,CAAC,EAAE,SAAS,EAAE,OAAe,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,qBAU1E;AAED,iBAAS,eAAe,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQ5E;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQvE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQxE;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAQvE;AAED,UAAU,cAAc;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;GAIG;AACH,iBAAS,SAAS,CAAC,EAAE,SAAS,EAAE,MAAuB,EAAE,QAAQ,EAAE,EAAE,cAAc,qBASlF;AACD,OAAO,EACL,IAAI,EACJ,UAAU,EACV,UAAU,EACV,SAAS,EACT,eAAe,EACf,UAAU,EACV,WAAW,EACX,SAAS,EACT,KAAK,SAAS,EACd,KAAK,cAAc,EACnB,KAAK,cAAc,GACpB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"card.js","names":[],"sources":["../../../src/components/ui/card.tsx"],"sourcesContent":["import { cn } from 'cn';\nimport { Slot } from 'radix-ui';\nimport * as React from 'react';\n\ntype CardProps = React.ComponentProps<'div'> & {\n /** Adds a subtle hover affordance for cards that behave as links. */\n interactive?: boolean;\n};\n\nfunction Card({ className, interactive = false, ...props }: CardProps) {\n return (\n <div\n data-slot=\"card\"\n className={cn(\n 'flex flex-col card',\n interactive && 'transition-colors hover:border-foreground/25',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction CardHeader({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div data-slot=\"card-header\" className={cn('flex flex-col gap-2 p-5', className)} {...props} />\n );\n}\n\ninterface CardTitleProps extends React.ComponentProps<'div'> {\n /** Render as a different element (e.g. h2, h3) while preserving styling. */\n asChild?: boolean;\n}\n\nfunction CardTitle({ className, asChild = false, ...props }: CardTitleProps) {\n const Comp = asChild ? Slot.Root : 'div';\n\n return (\n <Comp\n data-slot=\"card-title\"\n className={cn('font-display text-h3 font-semibold tracking-tight', className)}\n {...props}\n />\n );\n}\n\nfunction CardDescription({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"card-description\"\n className={cn('text-base leading-relaxed text-muted-foreground', className)}\n {...props}\n />\n );\n}\n\nfunction CardAction({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"card-action\"\n className={cn('col-start-2 row-span-2 row-start-1 self-start justify-self-end', className)}\n {...props}\n />\n );\n}\n\nfunction CardContent({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"card-content\"\n className={cn('flex flex-col gap-2 p-5 pt-0', className)}\n {...props}\n />\n );\n}\n\nfunction CardFooter({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"card-footer\"\n className={cn('flex items-center p-5 pt-0', className)}\n {...props}\n />\n );\n}\n\ninterface CardImageProps {\n aspect?: string;\n className?: string;\n children
|
|
1
|
+
{"version":3,"file":"card.js","names":[],"sources":["../../../src/components/ui/card.tsx"],"sourcesContent":["import { cn } from 'cn';\nimport { Slot } from 'radix-ui';\nimport * as React from 'react';\n\ntype CardProps = React.ComponentProps<'div'> & {\n /** Adds a subtle hover affordance for cards that behave as links. */\n interactive?: boolean;\n};\n\nfunction Card({ className, interactive = false, ...props }: CardProps) {\n return (\n <div\n data-slot=\"card\"\n className={cn(\n 'flex flex-col card',\n interactive && 'transition-colors hover:border-foreground/25',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction CardHeader({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div data-slot=\"card-header\" className={cn('flex flex-col gap-2 p-5', className)} {...props} />\n );\n}\n\ninterface CardTitleProps extends React.ComponentProps<'div'> {\n /** Render as a different element (e.g. h2, h3) while preserving styling. */\n asChild?: boolean;\n}\n\nfunction CardTitle({ className, asChild = false, ...props }: CardTitleProps) {\n const Comp = asChild ? Slot.Root : 'div';\n\n return (\n <Comp\n data-slot=\"card-title\"\n className={cn('font-display text-h3 font-semibold tracking-tight', className)}\n {...props}\n />\n );\n}\n\nfunction CardDescription({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"card-description\"\n className={cn('text-base leading-relaxed text-muted-foreground', className)}\n {...props}\n />\n );\n}\n\nfunction CardAction({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"card-action\"\n className={cn('col-start-2 row-span-2 row-start-1 self-start justify-self-end', className)}\n {...props}\n />\n );\n}\n\nfunction CardContent({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"card-content\"\n className={cn('flex flex-col gap-2 p-5 pt-0', className)}\n {...props}\n />\n );\n}\n\nfunction CardFooter({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"card-footer\"\n className={cn('flex items-center p-5 pt-0', className)}\n {...props}\n />\n );\n}\n\ninterface CardImageProps {\n aspect?: string;\n className?: string;\n /**\n * The media itself. Required on purpose: an aspect box with nothing in it is\n * never the intended result, and making it optional pushed every call site\n * into guarding the frame with its own conditional.\n */\n children: React.ReactNode;\n}\n\n/**\n * A bleeding card image, sized by aspect ratio. Framework-agnostic on purpose:\n * this package never imports a framework-specific image component, so the same\n * card works in Vite, Astro, Next or a plain HTML page.\n */\nfunction CardImage({ className, aspect = 'aspect-video', children }: CardImageProps) {\n return (\n <div\n data-slot=\"card-image\"\n className={cn('relative overflow-hidden rounded-t-sm', aspect, className)}\n >\n {children}\n </div>\n );\n}\nexport {\n Card,\n CardHeader,\n CardFooter,\n CardTitle,\n CardDescription,\n CardAction,\n CardContent,\n CardImage,\n type CardProps,\n type CardTitleProps,\n type CardImageProps,\n};\n"],"mappings":";;;;;AASA,SAAS,KAAK,EAAE,WAAW,cAAc,OAAO,GAAG,SAAoB;CACrE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,sBACA,eAAe,gDACf,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAAE,WAAW,GAAG,SAAsC;CACxE,OACE,oBAAC,OAAD;EAAK,aAAU;EAAc,WAAW,GAAG,2BAA2B,SAAS;EAAG,GAAI;CAAQ,CAAA;AAElG;AAOA,SAAS,UAAU,EAAE,WAAW,UAAU,OAAO,GAAG,SAAyB;CAC3E,MAAM,OAAO,UAAU,KAAK,OAAO;CAEnC,OACE,oBAAC,MAAD;EACE,aAAU;EACV,WAAW,GAAG,qDAAqD,SAAS;EAC5E,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,gBAAgB,EAAE,WAAW,GAAG,SAAsC;CAC7E,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,mDAAmD,SAAS;EAC1E,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAAE,WAAW,GAAG,SAAsC;CACxE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,kEAAkE,SAAS;EACzF,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,gCAAgC,SAAS;EACvD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAAE,WAAW,GAAG,SAAsC;CACxE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,8BAA8B,SAAS;EACrD,GAAI;CACL,CAAA;AAEL;;;;;;AAkBA,SAAS,UAAU,EAAE,WAAW,SAAS,gBAAgB,YAA4B;CACnF,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,yCAAyC,QAAQ,SAAS;EAEvE;CACE,CAAA;AAET"}
|
|
@@ -0,0 +1,142 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const require_rolldown_runtime = require("../../chunks/rolldown-runtime-CmQyd0Gu.cjs");
|
|
4
|
+
const require_components_ui_button = require("./button.cjs");
|
|
5
|
+
let cn = require("cn");
|
|
6
|
+
let lucide_react = require("lucide-react");
|
|
7
|
+
let react = require("react");
|
|
8
|
+
react = require_rolldown_runtime.__toESM(react, 1);
|
|
9
|
+
let react_jsx_runtime = require("react/jsx-runtime");
|
|
10
|
+
let embla_carousel_react = require("embla-carousel-react");
|
|
11
|
+
embla_carousel_react = require_rolldown_runtime.__toESM(embla_carousel_react, 1);
|
|
12
|
+
// src/components/ui/carousel.tsx
|
|
13
|
+
var CarouselContext = react.createContext(null);
|
|
14
|
+
function useCarousel() {
|
|
15
|
+
const context = react.useContext(CarouselContext);
|
|
16
|
+
if (!context) throw new Error("useCarousel must be used within a <Carousel />");
|
|
17
|
+
return context;
|
|
18
|
+
}
|
|
19
|
+
function Carousel({ orientation = "horizontal", opts, setApi, plugins, className, children, ...props }) {
|
|
20
|
+
const [carouselRef, api] = (0, embla_carousel_react.default)({
|
|
21
|
+
...opts,
|
|
22
|
+
axis: orientation === "horizontal" ? "x" : "y"
|
|
23
|
+
}, plugins);
|
|
24
|
+
const [canScrollPrev, setCanScrollPrev] = react.useState(false);
|
|
25
|
+
const [canScrollNext, setCanScrollNext] = react.useState(false);
|
|
26
|
+
const onSelect = react.useCallback((api) => {
|
|
27
|
+
if (!api) return;
|
|
28
|
+
setCanScrollPrev(api.canScrollPrev());
|
|
29
|
+
setCanScrollNext(api.canScrollNext());
|
|
30
|
+
}, []);
|
|
31
|
+
const scrollPrev = react.useCallback(() => {
|
|
32
|
+
api?.scrollPrev();
|
|
33
|
+
}, [api]);
|
|
34
|
+
const scrollNext = react.useCallback(() => {
|
|
35
|
+
api?.scrollNext();
|
|
36
|
+
}, [api]);
|
|
37
|
+
const handleKeyDown = react.useCallback((event) => {
|
|
38
|
+
if (event.key === "ArrowLeft") {
|
|
39
|
+
event.preventDefault();
|
|
40
|
+
scrollPrev();
|
|
41
|
+
} else if (event.key === "ArrowRight") {
|
|
42
|
+
event.preventDefault();
|
|
43
|
+
scrollNext();
|
|
44
|
+
}
|
|
45
|
+
}, [scrollPrev, scrollNext]);
|
|
46
|
+
react.useEffect(() => {
|
|
47
|
+
if (!api || !setApi) return;
|
|
48
|
+
setApi(api);
|
|
49
|
+
}, [api, setApi]);
|
|
50
|
+
react.useEffect(() => {
|
|
51
|
+
if (!api) return;
|
|
52
|
+
onSelect(api);
|
|
53
|
+
api.on("reInit", onSelect);
|
|
54
|
+
api.on("select", onSelect);
|
|
55
|
+
return () => {
|
|
56
|
+
api?.off("select", onSelect);
|
|
57
|
+
};
|
|
58
|
+
}, [api, onSelect]);
|
|
59
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CarouselContext.Provider, {
|
|
60
|
+
value: {
|
|
61
|
+
carouselRef,
|
|
62
|
+
api,
|
|
63
|
+
opts,
|
|
64
|
+
orientation: orientation || (opts?.axis === "y" ? "vertical" : "horizontal"),
|
|
65
|
+
scrollPrev,
|
|
66
|
+
scrollNext,
|
|
67
|
+
canScrollPrev,
|
|
68
|
+
canScrollNext
|
|
69
|
+
},
|
|
70
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
71
|
+
onKeyDownCapture: handleKeyDown,
|
|
72
|
+
className: (0, cn.cn)("relative", className),
|
|
73
|
+
role: "region",
|
|
74
|
+
"aria-roledescription": "carousel",
|
|
75
|
+
"data-slot": "carousel",
|
|
76
|
+
...props,
|
|
77
|
+
children
|
|
78
|
+
})
|
|
79
|
+
});
|
|
80
|
+
}
|
|
81
|
+
function CarouselContent({ className, ...props }) {
|
|
82
|
+
const { carouselRef, orientation } = useCarousel();
|
|
83
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
84
|
+
ref: carouselRef,
|
|
85
|
+
className: "overflow-hidden",
|
|
86
|
+
"data-slot": "carousel-content",
|
|
87
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
88
|
+
className: (0, cn.cn)("flex", orientation === "horizontal" ? "-ml-4" : "-mt-4 flex-col", className),
|
|
89
|
+
...props
|
|
90
|
+
})
|
|
91
|
+
});
|
|
92
|
+
}
|
|
93
|
+
function CarouselItem({ className, ...props }) {
|
|
94
|
+
const { orientation } = useCarousel();
|
|
95
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
96
|
+
role: "group",
|
|
97
|
+
"aria-roledescription": "slide",
|
|
98
|
+
"data-slot": "carousel-item",
|
|
99
|
+
className: (0, cn.cn)("min-w-0 shrink-0 grow-0 basis-full", orientation === "horizontal" ? "pl-4" : "pt-4", className),
|
|
100
|
+
...props
|
|
101
|
+
});
|
|
102
|
+
}
|
|
103
|
+
function CarouselPrevious({ className, variant = "outline", size = "icon-sm", ...props }) {
|
|
104
|
+
const { orientation, scrollPrev, canScrollPrev } = useCarousel();
|
|
105
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_components_ui_button.Button, {
|
|
106
|
+
"data-slot": "carousel-previous",
|
|
107
|
+
variant,
|
|
108
|
+
size,
|
|
109
|
+
className: (0, cn.cn)("absolute touch-manipulation rounded-full", orientation === "horizontal" ? "inset-y-0 -left-12 my-auto" : "-top-12 left-1/2 -translate-x-1/2 rotate-90", className),
|
|
110
|
+
disabled: !canScrollPrev,
|
|
111
|
+
onClick: scrollPrev,
|
|
112
|
+
...props,
|
|
113
|
+
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronLeftIcon, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
|
|
114
|
+
className: "sr-only",
|
|
115
|
+
children: "Previous slide"
|
|
116
|
+
})]
|
|
117
|
+
});
|
|
118
|
+
}
|
|
119
|
+
function CarouselNext({ className, variant = "outline", size = "icon-sm", ...props }) {
|
|
120
|
+
const { orientation, scrollNext, canScrollNext } = useCarousel();
|
|
121
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_components_ui_button.Button, {
|
|
122
|
+
"data-slot": "carousel-next",
|
|
123
|
+
variant,
|
|
124
|
+
size,
|
|
125
|
+
className: (0, cn.cn)("absolute touch-manipulation rounded-full", orientation === "horizontal" ? "inset-y-0 -right-12 my-auto" : "-bottom-12 left-1/2 -translate-x-1/2 rotate-90", className),
|
|
126
|
+
disabled: !canScrollNext,
|
|
127
|
+
onClick: scrollNext,
|
|
128
|
+
...props,
|
|
129
|
+
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronRightIcon, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
|
|
130
|
+
className: "sr-only",
|
|
131
|
+
children: "Next slide"
|
|
132
|
+
})]
|
|
133
|
+
});
|
|
134
|
+
}
|
|
135
|
+
exports.Carousel = Carousel;
|
|
136
|
+
exports.CarouselContent = CarouselContent;
|
|
137
|
+
exports.CarouselItem = CarouselItem;
|
|
138
|
+
exports.CarouselNext = CarouselNext;
|
|
139
|
+
exports.CarouselPrevious = CarouselPrevious;
|
|
140
|
+
exports.useCarousel = useCarousel;
|
|
141
|
+
|
|
142
|
+
//# sourceMappingURL=carousel.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"carousel.cjs","names":["React","useEmblaCarousel","Button","ChevronLeftIcon","ChevronRightIcon"],"sources":["../../../src/components/ui/carousel.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from 'cn';\nimport useEmblaCarousel, { type UseEmblaCarouselType } from 'embla-carousel-react';\nimport { ChevronLeftIcon, ChevronRightIcon } from 'lucide-react';\nimport * as React from 'react';\n\nimport { Button } from './button';\n\ntype CarouselApi = UseEmblaCarouselType[1];\ntype UseCarouselParameters = Parameters<typeof useEmblaCarousel>;\ntype CarouselOptions = UseCarouselParameters[0];\ntype CarouselPlugin = UseCarouselParameters[1];\n\ntype CarouselProps = {\n opts?: CarouselOptions;\n plugins?: CarouselPlugin;\n orientation?: 'horizontal' | 'vertical';\n setApi?: (api: CarouselApi) => void;\n};\n\ntype CarouselContextProps = {\n carouselRef: ReturnType<typeof useEmblaCarousel>[0];\n api: ReturnType<typeof useEmblaCarousel>[1];\n scrollPrev: () => void;\n scrollNext: () => void;\n canScrollPrev: boolean;\n canScrollNext: boolean;\n} & CarouselProps;\n\nconst CarouselContext = React.createContext<CarouselContextProps | null>(null);\n\nfunction useCarousel() {\n const context = React.useContext(CarouselContext);\n\n if (!context) {\n throw new Error('useCarousel must be used within a <Carousel />');\n }\n\n return context;\n}\n\nfunction Carousel({\n orientation = 'horizontal',\n opts,\n setApi,\n plugins,\n className,\n children,\n ...props\n}: React.ComponentProps<'div'> & CarouselProps) {\n const [carouselRef, api] = useEmblaCarousel(\n {\n ...opts,\n axis: orientation === 'horizontal' ? 'x' : 'y',\n },\n plugins,\n );\n const [canScrollPrev, setCanScrollPrev] = React.useState(false);\n const [canScrollNext, setCanScrollNext] = React.useState(false);\n\n const onSelect = React.useCallback((api: CarouselApi) => {\n if (!api) return;\n setCanScrollPrev(api.canScrollPrev());\n setCanScrollNext(api.canScrollNext());\n }, []);\n\n const scrollPrev = React.useCallback(() => {\n api?.scrollPrev();\n }, [api]);\n\n const scrollNext = React.useCallback(() => {\n api?.scrollNext();\n }, [api]);\n\n const handleKeyDown = React.useCallback(\n (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (event.key === 'ArrowLeft') {\n event.preventDefault();\n scrollPrev();\n } else if (event.key === 'ArrowRight') {\n event.preventDefault();\n scrollNext();\n }\n },\n [scrollPrev, scrollNext],\n );\n\n React.useEffect(() => {\n if (!api || !setApi) return;\n // Publishes embla's instance to the optional controlled `setApi` prop.\n setApi(api);\n }, [api, setApi]);\n\n React.useEffect(() => {\n if (!api) return;\n // Hands embla's initial selection to the caller's `setApi`/`onSelect` state.\n // eslint-disable-next-line react-hooks/set-state-in-effect\n onSelect(api);\n api.on('reInit', onSelect);\n api.on('select', onSelect);\n\n return () => {\n api?.off('select', onSelect);\n };\n }, [api, onSelect]);\n\n return (\n <CarouselContext.Provider\n value={{\n carouselRef,\n api: api,\n opts,\n orientation: orientation || (opts?.axis === 'y' ? 'vertical' : 'horizontal'),\n scrollPrev,\n scrollNext,\n canScrollPrev,\n canScrollNext,\n }}\n >\n <div\n onKeyDownCapture={handleKeyDown}\n className={cn('relative', className)}\n role=\"region\"\n aria-roledescription=\"carousel\"\n data-slot=\"carousel\"\n {...props}\n >\n {children}\n </div>\n </CarouselContext.Provider>\n );\n}\n\nfunction CarouselContent({ className, ...props }: React.ComponentProps<'div'>) {\n const { carouselRef, orientation } = useCarousel();\n\n return (\n <div ref={carouselRef} className=\"overflow-hidden\" data-slot=\"carousel-content\">\n <div\n className={cn('flex', orientation === 'horizontal' ? '-ml-4' : '-mt-4 flex-col', className)}\n {...props}\n />\n </div>\n );\n}\n\nfunction CarouselItem({ className, ...props }: React.ComponentProps<'div'>) {\n const { orientation } = useCarousel();\n\n return (\n <div\n role=\"group\"\n aria-roledescription=\"slide\"\n data-slot=\"carousel-item\"\n className={cn(\n 'min-w-0 shrink-0 grow-0 basis-full',\n orientation === 'horizontal' ? 'pl-4' : 'pt-4',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction CarouselPrevious({\n className,\n variant = 'outline',\n size = 'icon-sm',\n ...props\n}: React.ComponentProps<typeof Button>) {\n const { orientation, scrollPrev, canScrollPrev } = useCarousel();\n\n return (\n <Button\n data-slot=\"carousel-previous\"\n variant={variant}\n size={size}\n className={cn(\n 'absolute touch-manipulation rounded-full',\n orientation === 'horizontal'\n ? 'inset-y-0 -left-12 my-auto'\n : '-top-12 left-1/2 -translate-x-1/2 rotate-90',\n className,\n )}\n disabled={!canScrollPrev}\n onClick={scrollPrev}\n {...props}\n >\n <ChevronLeftIcon />\n <span className=\"sr-only\">Previous slide</span>\n </Button>\n );\n}\n\nfunction CarouselNext({\n className,\n variant = 'outline',\n size = 'icon-sm',\n ...props\n}: React.ComponentProps<typeof Button>) {\n const { orientation, scrollNext, canScrollNext } = useCarousel();\n\n return (\n <Button\n data-slot=\"carousel-next\"\n variant={variant}\n size={size}\n className={cn(\n 'absolute touch-manipulation rounded-full',\n orientation === 'horizontal'\n ? 'inset-y-0 -right-12 my-auto'\n : '-bottom-12 left-1/2 -translate-x-1/2 rotate-90',\n className,\n )}\n disabled={!canScrollNext}\n onClick={scrollNext}\n {...props}\n >\n <ChevronRightIcon />\n <span className=\"sr-only\">Next slide</span>\n </Button>\n );\n}\n\nexport {\n type CarouselApi,\n type CarouselProps,\n Carousel,\n CarouselContent,\n CarouselItem,\n CarouselPrevious,\n CarouselNext,\n useCarousel,\n};\n"],"mappings":"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"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import useEmblaCarousel, { type UseEmblaCarouselType } from 'embla-carousel-react';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import { Button } from './button.cjs';
|
|
4
|
+
type CarouselApi = UseEmblaCarouselType[1];
|
|
5
|
+
type UseCarouselParameters = Parameters<typeof useEmblaCarousel>;
|
|
6
|
+
type CarouselOptions = UseCarouselParameters[0];
|
|
7
|
+
type CarouselPlugin = UseCarouselParameters[1];
|
|
8
|
+
type CarouselProps = {
|
|
9
|
+
opts?: CarouselOptions;
|
|
10
|
+
plugins?: CarouselPlugin;
|
|
11
|
+
orientation?: 'horizontal' | 'vertical';
|
|
12
|
+
setApi?: (api: CarouselApi) => void;
|
|
13
|
+
};
|
|
14
|
+
type CarouselContextProps = {
|
|
15
|
+
carouselRef: ReturnType<typeof useEmblaCarousel>[0];
|
|
16
|
+
api: ReturnType<typeof useEmblaCarousel>[1];
|
|
17
|
+
scrollPrev: () => void;
|
|
18
|
+
scrollNext: () => void;
|
|
19
|
+
canScrollPrev: boolean;
|
|
20
|
+
canScrollNext: boolean;
|
|
21
|
+
} & CarouselProps;
|
|
22
|
+
declare function useCarousel(): CarouselContextProps;
|
|
23
|
+
declare function Carousel({ orientation, opts, setApi, plugins, className, children, ...props }: React.ComponentProps<'div'> & CarouselProps): React.JSX.Element;
|
|
24
|
+
declare function CarouselContent({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
25
|
+
declare function CarouselItem({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
26
|
+
declare function CarouselPrevious({ className, variant, size, ...props }: React.ComponentProps<typeof Button>): React.JSX.Element;
|
|
27
|
+
declare function CarouselNext({ className, variant, size, ...props }: React.ComponentProps<typeof Button>): React.JSX.Element;
|
|
28
|
+
export { type CarouselApi, type CarouselProps, Carousel, CarouselContent, CarouselItem, CarouselPrevious, CarouselNext, useCarousel, };
|
|
@@ -25,5 +25,5 @@ declare function CarouselContent({ className, ...props }: React.ComponentProps<'
|
|
|
25
25
|
declare function CarouselItem({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
26
26
|
declare function CarouselPrevious({ className, variant, size, ...props }: React.ComponentProps<typeof Button>): React.JSX.Element;
|
|
27
27
|
declare function CarouselNext({ className, variant, size, ...props }: React.ComponentProps<typeof Button>): React.JSX.Element;
|
|
28
|
-
export { type CarouselApi, Carousel, CarouselContent, CarouselItem, CarouselPrevious, CarouselNext, useCarousel, };
|
|
28
|
+
export { type CarouselApi, type CarouselProps, Carousel, CarouselContent, CarouselItem, CarouselPrevious, CarouselNext, useCarousel, };
|
|
29
29
|
//# sourceMappingURL=carousel.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"carousel.d.ts","sourceRoot":"","sources":["../../../src/components/ui/carousel.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"carousel.d.ts","sourceRoot":"","sources":["../../../src/components/ui/carousel.tsx"],"names":[],"mappings":"AAGA,OAAO,gBAAgB,EAAE,EAAE,KAAK,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAEnF,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC,KAAK,WAAW,GAAG,oBAAoB,CAAC,CAAC,CAAC,CAAC;AAC3C,KAAK,qBAAqB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;AACjE,KAAK,eAAe,GAAG,qBAAqB,CAAC,CAAC,CAAC,CAAC;AAChD,KAAK,cAAc,GAAG,qBAAqB,CAAC,CAAC,CAAC,CAAC;AAE/C,KAAK,aAAa,GAAG;IACnB,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,MAAM,CAAC,EAAE,CAAC,GAAG,EAAE,WAAW,KAAK,IAAI,CAAC;CACrC,CAAC;AAEF,KAAK,oBAAoB,GAAG;IAC1B,WAAW,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC,CAAC,CAAC,CAAC;IACpD,GAAG,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC,CAAC,CAAC,CAAC;IAC5C,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,aAAa,EAAE,OAAO,CAAC;IACvB,aAAa,EAAE,OAAO,CAAC;CACxB,GAAG,aAAa,CAAC;AAIlB,iBAAS,WAAW,yBAQnB;AAED,iBAAS,QAAQ,CAAC,EAChB,WAA0B,EAC1B,IAAI,EACJ,MAAM,EACN,OAAO,EACP,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,aAAa,qBAkF7C;AAED,iBAAS,eAAe,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAW5E;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,qBAgBzE;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,OAAmB,EACnB,IAAgB,EAChB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,qBAuBrC;AAED,iBAAS,YAAY,CAAC,EACpB,SAAS,EACT,OAAmB,EACnB,IAAgB,EAChB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,qBAuBrC;AAED,OAAO,EACL,KAAK,WAAW,EAChB,KAAK,aAAa,EAClB,QAAQ,EACR,eAAe,EACf,YAAY,EACZ,gBAAgB,EAChB,YAAY,EACZ,WAAW,GACZ,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"carousel.js","names":[],"sources":["../../../src/components/ui/carousel.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"file":"carousel.js","names":[],"sources":["../../../src/components/ui/carousel.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from 'cn';\nimport useEmblaCarousel, { type UseEmblaCarouselType } from 'embla-carousel-react';\nimport { ChevronLeftIcon, ChevronRightIcon } from 'lucide-react';\nimport * as React from 'react';\n\nimport { Button } from './button';\n\ntype CarouselApi = UseEmblaCarouselType[1];\ntype UseCarouselParameters = Parameters<typeof useEmblaCarousel>;\ntype CarouselOptions = UseCarouselParameters[0];\ntype CarouselPlugin = UseCarouselParameters[1];\n\ntype CarouselProps = {\n opts?: CarouselOptions;\n plugins?: CarouselPlugin;\n orientation?: 'horizontal' | 'vertical';\n setApi?: (api: CarouselApi) => void;\n};\n\ntype CarouselContextProps = {\n carouselRef: ReturnType<typeof useEmblaCarousel>[0];\n api: ReturnType<typeof useEmblaCarousel>[1];\n scrollPrev: () => void;\n scrollNext: () => void;\n canScrollPrev: boolean;\n canScrollNext: boolean;\n} & CarouselProps;\n\nconst CarouselContext = React.createContext<CarouselContextProps | null>(null);\n\nfunction useCarousel() {\n const context = React.useContext(CarouselContext);\n\n if (!context) {\n throw new Error('useCarousel must be used within a <Carousel />');\n }\n\n return context;\n}\n\nfunction Carousel({\n orientation = 'horizontal',\n opts,\n setApi,\n plugins,\n className,\n children,\n ...props\n}: React.ComponentProps<'div'> & CarouselProps) {\n const [carouselRef, api] = useEmblaCarousel(\n {\n ...opts,\n axis: orientation === 'horizontal' ? 'x' : 'y',\n },\n plugins,\n );\n const [canScrollPrev, setCanScrollPrev] = React.useState(false);\n const [canScrollNext, setCanScrollNext] = React.useState(false);\n\n const onSelect = React.useCallback((api: CarouselApi) => {\n if (!api) return;\n setCanScrollPrev(api.canScrollPrev());\n setCanScrollNext(api.canScrollNext());\n }, []);\n\n const scrollPrev = React.useCallback(() => {\n api?.scrollPrev();\n }, [api]);\n\n const scrollNext = React.useCallback(() => {\n api?.scrollNext();\n }, [api]);\n\n const handleKeyDown = React.useCallback(\n (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (event.key === 'ArrowLeft') {\n event.preventDefault();\n scrollPrev();\n } else if (event.key === 'ArrowRight') {\n event.preventDefault();\n scrollNext();\n }\n },\n [scrollPrev, scrollNext],\n );\n\n React.useEffect(() => {\n if (!api || !setApi) return;\n // Publishes embla's instance to the optional controlled `setApi` prop.\n setApi(api);\n }, [api, setApi]);\n\n React.useEffect(() => {\n if (!api) return;\n // Hands embla's initial selection to the caller's `setApi`/`onSelect` state.\n // eslint-disable-next-line react-hooks/set-state-in-effect\n onSelect(api);\n api.on('reInit', onSelect);\n api.on('select', onSelect);\n\n return () => {\n api?.off('select', onSelect);\n };\n }, [api, onSelect]);\n\n return (\n <CarouselContext.Provider\n value={{\n carouselRef,\n api: api,\n opts,\n orientation: orientation || (opts?.axis === 'y' ? 'vertical' : 'horizontal'),\n scrollPrev,\n scrollNext,\n canScrollPrev,\n canScrollNext,\n }}\n >\n <div\n onKeyDownCapture={handleKeyDown}\n className={cn('relative', className)}\n role=\"region\"\n aria-roledescription=\"carousel\"\n data-slot=\"carousel\"\n {...props}\n >\n {children}\n </div>\n </CarouselContext.Provider>\n );\n}\n\nfunction CarouselContent({ className, ...props }: React.ComponentProps<'div'>) {\n const { carouselRef, orientation } = useCarousel();\n\n return (\n <div ref={carouselRef} className=\"overflow-hidden\" data-slot=\"carousel-content\">\n <div\n className={cn('flex', orientation === 'horizontal' ? '-ml-4' : '-mt-4 flex-col', className)}\n {...props}\n />\n </div>\n );\n}\n\nfunction CarouselItem({ className, ...props }: React.ComponentProps<'div'>) {\n const { orientation } = useCarousel();\n\n return (\n <div\n role=\"group\"\n aria-roledescription=\"slide\"\n data-slot=\"carousel-item\"\n className={cn(\n 'min-w-0 shrink-0 grow-0 basis-full',\n orientation === 'horizontal' ? 'pl-4' : 'pt-4',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction CarouselPrevious({\n className,\n variant = 'outline',\n size = 'icon-sm',\n ...props\n}: React.ComponentProps<typeof Button>) {\n const { orientation, scrollPrev, canScrollPrev } = useCarousel();\n\n return (\n <Button\n data-slot=\"carousel-previous\"\n variant={variant}\n size={size}\n className={cn(\n 'absolute touch-manipulation rounded-full',\n orientation === 'horizontal'\n ? 'inset-y-0 -left-12 my-auto'\n : '-top-12 left-1/2 -translate-x-1/2 rotate-90',\n className,\n )}\n disabled={!canScrollPrev}\n onClick={scrollPrev}\n {...props}\n >\n <ChevronLeftIcon />\n <span className=\"sr-only\">Previous slide</span>\n </Button>\n );\n}\n\nfunction CarouselNext({\n className,\n variant = 'outline',\n size = 'icon-sm',\n ...props\n}: React.ComponentProps<typeof Button>) {\n const { orientation, scrollNext, canScrollNext } = useCarousel();\n\n return (\n <Button\n data-slot=\"carousel-next\"\n variant={variant}\n size={size}\n className={cn(\n 'absolute touch-manipulation rounded-full',\n orientation === 'horizontal'\n ? 'inset-y-0 -right-12 my-auto'\n : '-bottom-12 left-1/2 -translate-x-1/2 rotate-90',\n className,\n )}\n disabled={!canScrollNext}\n onClick={scrollNext}\n {...props}\n >\n <ChevronRightIcon />\n <span className=\"sr-only\">Next slide</span>\n </Button>\n );\n}\n\nexport {\n type CarouselApi,\n type CarouselProps,\n Carousel,\n CarouselContent,\n CarouselItem,\n CarouselPrevious,\n CarouselNext,\n useCarousel,\n};\n"],"mappings":"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"}
|
|
@@ -0,0 +1,159 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const require_rolldown_runtime = require("../../chunks/rolldown-runtime-CmQyd0Gu.cjs");
|
|
4
|
+
let cn = require("cn");
|
|
5
|
+
let react = require("react");
|
|
6
|
+
react = require_rolldown_runtime.__toESM(react, 1);
|
|
7
|
+
let react_jsx_runtime = require("react/jsx-runtime");
|
|
8
|
+
let recharts = require("recharts");
|
|
9
|
+
recharts = require_rolldown_runtime.__toESM(recharts, 1);
|
|
10
|
+
// src/components/ui/chart.tsx
|
|
11
|
+
var THEMES = {
|
|
12
|
+
light: "",
|
|
13
|
+
dark: ".dark"
|
|
14
|
+
};
|
|
15
|
+
var INITIAL_DIMENSION = {
|
|
16
|
+
width: 320,
|
|
17
|
+
height: 200
|
|
18
|
+
};
|
|
19
|
+
var ChartContext = react.createContext(null);
|
|
20
|
+
function useChart() {
|
|
21
|
+
const context = react.useContext(ChartContext);
|
|
22
|
+
if (!context) throw new Error("useChart must be used within a <ChartContainer />");
|
|
23
|
+
return context;
|
|
24
|
+
}
|
|
25
|
+
function ChartContainer({ id, className, children, config, initialDimension = INITIAL_DIMENSION, ...props }) {
|
|
26
|
+
const uniqueId = react.useId();
|
|
27
|
+
const chartId = `chart-${id ?? uniqueId.replace(/:/g, "")}`;
|
|
28
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ChartContext.Provider, {
|
|
29
|
+
value: { config },
|
|
30
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
31
|
+
"data-slot": "chart",
|
|
32
|
+
"data-chart": chartId,
|
|
33
|
+
className: (0, cn.cn)("flex aspect-video justify-center text-xs [&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-hidden [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border [&_.recharts-sector]:outline-hidden [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-surface]:outline-hidden", className),
|
|
34
|
+
...props,
|
|
35
|
+
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ChartStyle, {
|
|
36
|
+
id: chartId,
|
|
37
|
+
config
|
|
38
|
+
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(recharts.ResponsiveContainer, {
|
|
39
|
+
initialDimension,
|
|
40
|
+
children
|
|
41
|
+
})]
|
|
42
|
+
})
|
|
43
|
+
});
|
|
44
|
+
}
|
|
45
|
+
var ChartStyle = ({ id, config }) => {
|
|
46
|
+
const colorConfig = Object.entries(config).filter(([, config]) => config.theme ?? config.color);
|
|
47
|
+
if (!colorConfig.length) return null;
|
|
48
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("style", { dangerouslySetInnerHTML: { __html: Object.entries(THEMES).map(([theme, prefix]) => `
|
|
49
|
+
${prefix} [data-chart=${id}] {
|
|
50
|
+
${colorConfig.map(([key, itemConfig]) => {
|
|
51
|
+
const color = itemConfig.theme?.[theme] ?? itemConfig.color;
|
|
52
|
+
return color ? ` --color-${key}: ${color};` : null;
|
|
53
|
+
}).join("\n")}
|
|
54
|
+
}
|
|
55
|
+
`).join("\n") } });
|
|
56
|
+
};
|
|
57
|
+
var ChartTooltip = recharts.Tooltip;
|
|
58
|
+
function ChartTooltipContent({ active, payload, className, indicator = "dot", hideLabel = false, hideIndicator = false, label, labelFormatter, labelClassName, formatter, color, nameKey, labelKey }) {
|
|
59
|
+
const { config } = useChart();
|
|
60
|
+
const tooltipLabel = react.useMemo(() => {
|
|
61
|
+
if (hideLabel || !payload?.length) return null;
|
|
62
|
+
const [item] = payload;
|
|
63
|
+
const key = `${labelKey ?? item?.dataKey ?? item?.name ?? "value"}`;
|
|
64
|
+
const itemConfig = getPayloadConfigFromPayload(config, item, key);
|
|
65
|
+
const value = !labelKey && typeof label === "string" ? config[label]?.label ?? label : itemConfig?.label;
|
|
66
|
+
if (labelFormatter) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
67
|
+
className: (0, cn.cn)("font-medium", labelClassName),
|
|
68
|
+
children: labelFormatter(value, payload)
|
|
69
|
+
});
|
|
70
|
+
if (!value) return null;
|
|
71
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
72
|
+
className: (0, cn.cn)("font-medium", labelClassName),
|
|
73
|
+
children: value
|
|
74
|
+
});
|
|
75
|
+
}, [
|
|
76
|
+
label,
|
|
77
|
+
labelFormatter,
|
|
78
|
+
payload,
|
|
79
|
+
hideLabel,
|
|
80
|
+
labelClassName,
|
|
81
|
+
config,
|
|
82
|
+
labelKey
|
|
83
|
+
]);
|
|
84
|
+
if (!active || !payload?.length) return null;
|
|
85
|
+
const nestLabel = payload.length === 1 && indicator !== "dot";
|
|
86
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
87
|
+
className: (0, cn.cn)("grid min-w-32 items-start gap-1.5 rounded-sm border border-border/50 bg-background px-2.5 py-1.5 text-xs shadow-lg", className),
|
|
88
|
+
children: [!nestLabel ? tooltipLabel : null, /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
89
|
+
className: "grid gap-1.5",
|
|
90
|
+
children: payload.filter((item) => item.type !== "none").map((item, index) => {
|
|
91
|
+
const key = `${nameKey ?? item.name ?? item.dataKey ?? "value"}`;
|
|
92
|
+
const itemConfig = getPayloadConfigFromPayload(config, item, key);
|
|
93
|
+
const indicatorColor = color ?? item.payload?.fill ?? item.color;
|
|
94
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
95
|
+
className: (0, cn.cn)("flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5 [&>svg]:text-muted-foreground", indicator === "dot" && "items-center"),
|
|
96
|
+
children: formatter && item?.value !== void 0 && item.name ? formatter(item.value, item.name, item, index, item.payload) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [itemConfig?.icon ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(itemConfig.icon, {}) : !hideIndicator && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
97
|
+
className: (0, cn.cn)("shrink-0 rounded-sm border-(--color-border) bg-(--color-bg)", {
|
|
98
|
+
"h-2.5 w-2.5": indicator === "dot",
|
|
99
|
+
"w-1": indicator === "line",
|
|
100
|
+
"w-0 border-[1.5px] border-dashed bg-transparent": indicator === "dashed",
|
|
101
|
+
"my-0.5": nestLabel && indicator === "dashed"
|
|
102
|
+
}),
|
|
103
|
+
style: {
|
|
104
|
+
"--color-bg": indicatorColor,
|
|
105
|
+
"--color-border": indicatorColor
|
|
106
|
+
}
|
|
107
|
+
}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
108
|
+
className: (0, cn.cn)("flex flex-1 justify-between leading-none", nestLabel ? "items-end" : "items-center"),
|
|
109
|
+
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
110
|
+
className: "grid gap-1.5",
|
|
111
|
+
children: [nestLabel ? tooltipLabel : null, /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
|
|
112
|
+
className: "text-muted-foreground",
|
|
113
|
+
children: itemConfig?.label ?? item.name
|
|
114
|
+
})]
|
|
115
|
+
}), item.value != null && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
|
|
116
|
+
className: "font-mono font-medium text-foreground tabular-nums",
|
|
117
|
+
children: typeof item.value === "number" ? item.value.toLocaleString() : String(item.value)
|
|
118
|
+
})]
|
|
119
|
+
})] })
|
|
120
|
+
}, index);
|
|
121
|
+
})
|
|
122
|
+
})]
|
|
123
|
+
});
|
|
124
|
+
}
|
|
125
|
+
var ChartLegend = recharts.Legend;
|
|
126
|
+
function ChartLegendContent({ className, hideIcon = false, payload, verticalAlign = "bottom", nameKey }) {
|
|
127
|
+
const { config } = useChart();
|
|
128
|
+
if (!payload?.length) return null;
|
|
129
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
130
|
+
className: (0, cn.cn)("flex items-center justify-center gap-4", verticalAlign === "top" ? "pb-3" : "pt-3", className),
|
|
131
|
+
children: payload.filter((item) => item.type !== "none").map((item, index) => {
|
|
132
|
+
const key = `${nameKey ?? item.dataKey ?? "value"}`;
|
|
133
|
+
const itemConfig = getPayloadConfigFromPayload(config, item, key);
|
|
134
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
135
|
+
className: (0, cn.cn)("flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3 [&>svg]:text-muted-foreground"),
|
|
136
|
+
children: [itemConfig?.icon && !hideIcon ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(itemConfig.icon, {}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
137
|
+
className: "h-2 w-2 shrink-0 rounded-sm",
|
|
138
|
+
style: { backgroundColor: item.color }
|
|
139
|
+
}), itemConfig?.label]
|
|
140
|
+
}, index);
|
|
141
|
+
})
|
|
142
|
+
});
|
|
143
|
+
}
|
|
144
|
+
function getPayloadConfigFromPayload(config, payload, key) {
|
|
145
|
+
if (typeof payload !== "object" || payload === null) return;
|
|
146
|
+
const payloadPayload = "payload" in payload && typeof payload.payload === "object" && payload.payload !== null ? payload.payload : void 0;
|
|
147
|
+
let configLabelKey = key;
|
|
148
|
+
if (key in payload && typeof payload[key] === "string") configLabelKey = payload[key];
|
|
149
|
+
else if (payloadPayload && key in payloadPayload && typeof payloadPayload[key] === "string") configLabelKey = payloadPayload[key];
|
|
150
|
+
return configLabelKey in config ? config[configLabelKey] : config[key];
|
|
151
|
+
}
|
|
152
|
+
exports.ChartContainer = ChartContainer;
|
|
153
|
+
exports.ChartLegend = ChartLegend;
|
|
154
|
+
exports.ChartLegendContent = ChartLegendContent;
|
|
155
|
+
exports.ChartStyle = ChartStyle;
|
|
156
|
+
exports.ChartTooltip = ChartTooltip;
|
|
157
|
+
exports.ChartTooltipContent = ChartTooltipContent;
|
|
158
|
+
|
|
159
|
+
//# sourceMappingURL=chart.cjs.map
|