@databricks/appkit-ui 0.0.2
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/CLAUDE.md +3 -0
- package/DCO +25 -0
- package/LICENSE +203 -0
- package/NOTICE.md +73 -0
- package/README.md +35 -0
- package/bin/setup-claude.js +190 -0
- package/dist/js/arrow/arrow-client.d.ts +64 -0
- package/dist/js/arrow/arrow-client.d.ts.map +1 -0
- package/dist/js/arrow/arrow-client.js +181 -0
- package/dist/js/arrow/arrow-client.js.map +1 -0
- package/dist/js/arrow/index.js +3 -0
- package/dist/js/arrow/lazy-arrow.d.ts +23 -0
- package/dist/js/arrow/lazy-arrow.d.ts.map +1 -0
- package/dist/js/arrow/lazy-arrow.js +86 -0
- package/dist/js/arrow/lazy-arrow.js.map +1 -0
- package/dist/js/constants.d.ts +10 -0
- package/dist/js/constants.d.ts.map +1 -0
- package/dist/js/constants.js +30 -0
- package/dist/js/constants.js.map +1 -0
- package/dist/js/index.d.ts +8 -0
- package/dist/js/index.js +8 -0
- package/dist/js/sse/connect-sse.d.ts +14 -0
- package/dist/js/sse/connect-sse.d.ts.map +1 -0
- package/dist/js/sse/connect-sse.js +128 -0
- package/dist/js/sse/connect-sse.js.map +1 -0
- package/dist/js/sse/types.d.ts +34 -0
- package/dist/js/sse/types.d.ts.map +1 -0
- package/dist/react/charts/area/index.d.ts +33 -0
- package/dist/react/charts/area/index.d.ts.map +1 -0
- package/dist/react/charts/area/index.js +29 -0
- package/dist/react/charts/area/index.js.map +1 -0
- package/dist/react/charts/bar/index.d.ts +43 -0
- package/dist/react/charts/bar/index.d.ts.map +1 -0
- package/dist/react/charts/bar/index.js +39 -0
- package/dist/react/charts/bar/index.js.map +1 -0
- package/dist/react/charts/base.d.ts +89 -0
- package/dist/react/charts/base.d.ts.map +1 -0
- package/dist/react/charts/base.js +123 -0
- package/dist/react/charts/base.js.map +1 -0
- package/dist/react/charts/chart-error-boundary.js +37 -0
- package/dist/react/charts/chart-error-boundary.js.map +1 -0
- package/dist/react/charts/constants.d.ts +22 -0
- package/dist/react/charts/constants.d.ts.map +1 -0
- package/dist/react/charts/constants.js +86 -0
- package/dist/react/charts/constants.js.map +1 -0
- package/dist/react/charts/create-chart.d.ts +26 -0
- package/dist/react/charts/create-chart.d.ts.map +1 -0
- package/dist/react/charts/create-chart.js +55 -0
- package/dist/react/charts/create-chart.js.map +1 -0
- package/dist/react/charts/empty.js +16 -0
- package/dist/react/charts/empty.js.map +1 -0
- package/dist/react/charts/error.js +16 -0
- package/dist/react/charts/error.js.map +1 -0
- package/dist/react/charts/heatmap/index.d.ts +42 -0
- package/dist/react/charts/heatmap/index.d.ts.map +1 -0
- package/dist/react/charts/heatmap/index.js +38 -0
- package/dist/react/charts/heatmap/index.js.map +1 -0
- package/dist/react/charts/index.js +18 -0
- package/dist/react/charts/line/index.d.ts +34 -0
- package/dist/react/charts/line/index.d.ts.map +1 -0
- package/dist/react/charts/line/index.js +30 -0
- package/dist/react/charts/line/index.js.map +1 -0
- package/dist/react/charts/loading.js +13 -0
- package/dist/react/charts/loading.js.map +1 -0
- package/dist/react/charts/normalize.d.ts +37 -0
- package/dist/react/charts/normalize.d.ts.map +1 -0
- package/dist/react/charts/normalize.js +256 -0
- package/dist/react/charts/normalize.js.map +1 -0
- package/dist/react/charts/options.d.ts +39 -0
- package/dist/react/charts/options.d.ts.map +1 -0
- package/dist/react/charts/options.js +212 -0
- package/dist/react/charts/options.js.map +1 -0
- package/dist/react/charts/pie/index.d.ts +57 -0
- package/dist/react/charts/pie/index.d.ts.map +1 -0
- package/dist/react/charts/pie/index.js +50 -0
- package/dist/react/charts/pie/index.js.map +1 -0
- package/dist/react/charts/radar/index.d.ts +32 -0
- package/dist/react/charts/radar/index.d.ts.map +1 -0
- package/dist/react/charts/radar/index.js +28 -0
- package/dist/react/charts/radar/index.js.map +1 -0
- package/dist/react/charts/scatter/index.d.ts +32 -0
- package/dist/react/charts/scatter/index.d.ts.map +1 -0
- package/dist/react/charts/scatter/index.js +28 -0
- package/dist/react/charts/scatter/index.js.map +1 -0
- package/dist/react/charts/theme.d.ts +23 -0
- package/dist/react/charts/theme.d.ts.map +1 -0
- package/dist/react/charts/theme.js +96 -0
- package/dist/react/charts/theme.js.map +1 -0
- package/dist/react/charts/types.d.ts +160 -0
- package/dist/react/charts/types.d.ts.map +1 -0
- package/dist/react/charts/types.js +17 -0
- package/dist/react/charts/types.js.map +1 -0
- package/dist/react/charts/utils.d.ts +36 -0
- package/dist/react/charts/utils.d.ts.map +1 -0
- package/dist/react/charts/utils.js +77 -0
- package/dist/react/charts/utils.js.map +1 -0
- package/dist/react/charts/wrapper.d.ts +65 -0
- package/dist/react/charts/wrapper.d.ts.map +1 -0
- package/dist/react/charts/wrapper.js +94 -0
- package/dist/react/charts/wrapper.js.map +1 -0
- package/dist/react/hooks/index.js +2 -0
- package/dist/react/hooks/types.d.ts +101 -0
- package/dist/react/hooks/types.d.ts.map +1 -0
- package/dist/react/hooks/use-analytics-query.d.ts +33 -0
- package/dist/react/hooks/use-analytics-query.d.ts.map +1 -0
- package/dist/react/hooks/use-analytics-query.js +146 -0
- package/dist/react/hooks/use-analytics-query.js.map +1 -0
- package/dist/react/hooks/use-chart-data.d.ts +54 -0
- package/dist/react/hooks/use-chart-data.d.ts.map +1 -0
- package/dist/react/hooks/use-chart-data.js +80 -0
- package/dist/react/hooks/use-chart-data.js.map +1 -0
- package/dist/react/hooks/use-mobile.js +21 -0
- package/dist/react/hooks/use-mobile.js.map +1 -0
- package/dist/react/hooks/use-query-hmr.js +19 -0
- package/dist/react/hooks/use-query-hmr.js.map +1 -0
- package/dist/react/index.d.ts +75 -0
- package/dist/react/index.js +79 -0
- package/dist/react/lib/format.js +42 -0
- package/dist/react/lib/format.js.map +1 -0
- package/dist/react/lib/utils.js +11 -0
- package/dist/react/lib/utils.js.map +1 -0
- package/dist/react/table/data-table.d.ts +47 -0
- package/dist/react/table/data-table.d.ts.map +1 -0
- package/dist/react/table/data-table.js +205 -0
- package/dist/react/table/data-table.js.map +1 -0
- package/dist/react/table/empty.js +16 -0
- package/dist/react/table/empty.js.map +1 -0
- package/dist/react/table/error.js +16 -0
- package/dist/react/table/error.js.map +1 -0
- package/dist/react/table/index.js +1 -0
- package/dist/react/table/loading.js +50 -0
- package/dist/react/table/loading.js.map +1 -0
- package/dist/react/table/table-wrapper.js +143 -0
- package/dist/react/table/table-wrapper.js.map +1 -0
- package/dist/react/table/types.d.ts +55 -0
- package/dist/react/table/types.d.ts.map +1 -0
- package/dist/react/ui/accordion.d.ts +25 -0
- package/dist/react/ui/accordion.d.ts.map +1 -0
- package/dist/react/ui/accordion.js +45 -0
- package/dist/react/ui/accordion.js.map +1 -0
- package/dist/react/ui/alert-dialog.d.ts +49 -0
- package/dist/react/ui/alert-dialog.d.ts.map +1 -0
- package/dist/react/ui/alert-dialog.js +82 -0
- package/dist/react/ui/alert-dialog.js.map +1 -0
- package/dist/react/ui/alert.d.ts +25 -0
- package/dist/react/ui/alert.d.ts.map +1 -0
- package/dist/react/ui/alert.js +38 -0
- package/dist/react/ui/alert.js.map +1 -0
- package/dist/react/ui/aspect-ratio.d.ts +10 -0
- package/dist/react/ui/aspect-ratio.d.ts.map +1 -0
- package/dist/react/ui/aspect-ratio.js +16 -0
- package/dist/react/ui/aspect-ratio.js.map +1 -0
- package/dist/react/ui/avatar.d.ts +20 -0
- package/dist/react/ui/avatar.d.ts.map +1 -0
- package/dist/react/ui/avatar.js +30 -0
- package/dist/react/ui/avatar.js.map +1 -0
- package/dist/react/ui/badge.d.ts +20 -0
- package/dist/react/ui/badge.d.ts.map +1 -0
- package/dist/react/ui/badge.js +26 -0
- package/dist/react/ui/badge.js.map +1 -0
- package/dist/react/ui/breadcrumb.d.ts +38 -0
- package/dist/react/ui/breadcrumb.d.ts.map +1 -0
- package/dist/react/ui/breadcrumb.js +71 -0
- package/dist/react/ui/breadcrumb.js.map +1 -0
- package/dist/react/ui/button-group.d.ts +29 -0
- package/dist/react/ui/button-group.d.ts.map +1 -0
- package/dist/react/ui/button-group.js +41 -0
- package/dist/react/ui/button-group.js.map +1 -0
- package/dist/react/ui/button.d.ts +22 -0
- package/dist/react/ui/button.d.ts.map +1 -0
- package/dist/react/ui/button.js +45 -0
- package/dist/react/ui/button.js.map +1 -0
- package/dist/react/ui/calendar.d.ts +27 -0
- package/dist/react/ui/calendar.d.ts.map +1 -0
- package/dist/react/ui/calendar.js +109 -0
- package/dist/react/ui/calendar.js.map +1 -0
- package/dist/react/ui/card.d.ts +35 -0
- package/dist/react/ui/card.d.ts.map +1 -0
- package/dist/react/ui/card.js +57 -0
- package/dist/react/ui/card.js.map +1 -0
- package/dist/react/ui/carousel.d.ts +48 -0
- package/dist/react/ui/carousel.d.ts.map +1 -0
- package/dist/react/ui/carousel.js +134 -0
- package/dist/react/ui/carousel.js.map +1 -0
- package/dist/react/ui/chart.d.ts +80 -0
- package/dist/react/ui/chart.d.ts.map +1 -0
- package/dist/react/ui/chart.js +143 -0
- package/dist/react/ui/chart.js.map +1 -0
- package/dist/react/ui/checkbox.d.ts +12 -0
- package/dist/react/ui/checkbox.d.ts.map +1 -0
- package/dist/react/ui/checkbox.js +24 -0
- package/dist/react/ui/checkbox.js.map +1 -0
- package/dist/react/ui/collapsible.d.ts +16 -0
- package/dist/react/ui/collapsible.d.ts.map +1 -0
- package/dist/react/ui/collapsible.js +26 -0
- package/dist/react/ui/collapsible.js.map +1 -0
- package/dist/react/ui/command.d.ts +53 -0
- package/dist/react/ui/command.d.ts.map +1 -0
- package/dist/react/ui/command.js +87 -0
- package/dist/react/ui/command.js.map +1 -0
- package/dist/react/ui/context-menu.d.ts +77 -0
- package/dist/react/ui/context-menu.d.ts.map +1 -0
- package/dist/react/ui/context-menu.js +125 -0
- package/dist/react/ui/context-menu.js.map +1 -0
- package/dist/react/ui/dialog.d.ts +48 -0
- package/dist/react/ui/dialog.d.ts.map +1 -0
- package/dist/react/ui/dialog.js +87 -0
- package/dist/react/ui/dialog.js.map +1 -0
- package/dist/react/ui/drawer.d.ts +45 -0
- package/dist/react/ui/drawer.d.ts.map +1 -0
- package/dist/react/ui/drawer.js +81 -0
- package/dist/react/ui/drawer.js.map +1 -0
- package/dist/react/ui/dropdown-menu.d.ts +78 -0
- package/dist/react/ui/dropdown-menu.d.ts.map +1 -0
- package/dist/react/ui/dropdown-menu.js +124 -0
- package/dist/react/ui/dropdown-menu.js.map +1 -0
- package/dist/react/ui/empty.d.ts +36 -0
- package/dist/react/ui/empty.d.ts.map +1 -0
- package/dist/react/ui/empty.js +62 -0
- package/dist/react/ui/empty.js.map +1 -0
- package/dist/react/ui/field.d.ts +65 -0
- package/dist/react/ui/field.d.ts.map +1 -0
- package/dist/react/ui/field.js +120 -0
- package/dist/react/ui/field.js.map +1 -0
- package/dist/react/ui/form.d.ts +46 -0
- package/dist/react/ui/form.d.ts.map +1 -0
- package/dist/react/ui/form.js +92 -0
- package/dist/react/ui/form.js.map +1 -0
- package/dist/react/ui/hover-card.d.ts +20 -0
- package/dist/react/ui/hover-card.d.ts.map +1 -0
- package/dist/react/ui/hover-card.js +35 -0
- package/dist/react/ui/hover-card.js.map +1 -0
- package/dist/react/ui/index.js +53 -0
- package/dist/react/ui/input-group.d.ts +44 -0
- package/dist/react/ui/input-group.d.ts.map +1 -0
- package/dist/react/ui/input-group.js +82 -0
- package/dist/react/ui/input-group.js.map +1 -0
- package/dist/react/ui/input-otp.d.ts +29 -0
- package/dist/react/ui/input-otp.d.ts.map +1 -0
- package/dist/react/ui/input-otp.js +47 -0
- package/dist/react/ui/input-otp.js.map +1 -0
- package/dist/react/ui/input.d.ts +12 -0
- package/dist/react/ui/input.d.ts.map +1 -0
- package/dist/react/ui/input.js +16 -0
- package/dist/react/ui/input.js.map +1 -0
- package/dist/react/ui/item.d.ts +63 -0
- package/dist/react/ui/item.d.ts.map +1 -0
- package/dist/react/ui/item.js +118 -0
- package/dist/react/ui/item.js.map +1 -0
- package/dist/react/ui/kbd.d.ts +14 -0
- package/dist/react/ui/kbd.d.ts.map +1 -0
- package/dist/react/ui/kbd.js +22 -0
- package/dist/react/ui/kbd.js.map +1 -0
- package/dist/react/ui/label.d.ts +12 -0
- package/dist/react/ui/label.d.ts.map +1 -0
- package/dist/react/ui/label.js +18 -0
- package/dist/react/ui/label.js.map +1 -0
- package/dist/react/ui/menubar.d.ts +85 -0
- package/dist/react/ui/menubar.d.ts.map +1 -0
- package/dist/react/ui/menubar.js +134 -0
- package/dist/react/ui/menubar.js.map +1 -0
- package/dist/react/ui/navigation-menu.d.ts +47 -0
- package/dist/react/ui/navigation-menu.d.ts.map +1 -0
- package/dist/react/ui/navigation-menu.js +82 -0
- package/dist/react/ui/navigation-menu.js.map +1 -0
- package/dist/react/ui/pagination.d.ts +40 -0
- package/dist/react/ui/pagination.d.ts.map +1 -0
- package/dist/react/ui/pagination.js +80 -0
- package/dist/react/ui/pagination.js.map +1 -0
- package/dist/react/ui/popover.d.ts +23 -0
- package/dist/react/ui/popover.d.ts.map +1 -0
- package/dist/react/ui/popover.js +38 -0
- package/dist/react/ui/popover.js.map +1 -0
- package/dist/react/ui/progress.d.ts +13 -0
- package/dist/react/ui/progress.d.ts.map +1 -0
- package/dist/react/ui/progress.js +21 -0
- package/dist/react/ui/progress.js.map +1 -0
- package/dist/react/ui/radio-group.d.ts +16 -0
- package/dist/react/ui/radio-group.d.ts.map +1 -0
- package/dist/react/ui/radio-group.js +31 -0
- package/dist/react/ui/radio-group.js.map +1 -0
- package/dist/react/ui/resizable.d.ts +22 -0
- package/dist/react/ui/resizable.d.ts.map +1 -0
- package/dist/react/ui/resizable.js +34 -0
- package/dist/react/ui/resizable.js.map +1 -0
- package/dist/react/ui/scroll-area.d.ts +18 -0
- package/dist/react/ui/scroll-area.d.ts.map +1 -0
- package/dist/react/ui/scroll-area.js +39 -0
- package/dist/react/ui/scroll-area.js.map +1 -0
- package/dist/react/ui/select.d.ts +53 -0
- package/dist/react/ui/select.d.ts.map +1 -0
- package/dist/react/ui/select.js +98 -0
- package/dist/react/ui/select.js.map +1 -0
- package/dist/react/ui/separator.d.ts +14 -0
- package/dist/react/ui/separator.d.ts.map +1 -0
- package/dist/react/ui/separator.js +20 -0
- package/dist/react/ui/separator.js.map +1 -0
- package/dist/react/ui/sheet.d.ts +41 -0
- package/dist/react/ui/sheet.d.ts.map +1 -0
- package/dist/react/ui/sheet.js +83 -0
- package/dist/react/ui/sheet.js.map +1 -0
- package/dist/react/ui/sidebar.d.ts +167 -0
- package/dist/react/ui/sidebar.d.ts.map +1 -0
- package/dist/react/ui/sidebar.js +379 -0
- package/dist/react/ui/sidebar.js.map +1 -0
- package/dist/react/ui/skeleton.d.ts +10 -0
- package/dist/react/ui/skeleton.d.ts.map +1 -0
- package/dist/react/ui/skeleton.js +15 -0
- package/dist/react/ui/skeleton.js.map +1 -0
- package/dist/react/ui/slider.d.ts +16 -0
- package/dist/react/ui/slider.d.ts.map +1 -0
- package/dist/react/ui/slider.js +40 -0
- package/dist/react/ui/slider.js.map +1 -0
- package/dist/react/ui/sonner.d.ts +10 -0
- package/dist/react/ui/sonner.d.ts.map +1 -0
- package/dist/react/ui/sonner.js +31 -0
- package/dist/react/ui/sonner.js.map +1 -0
- package/dist/react/ui/spinner.d.ts +10 -0
- package/dist/react/ui/spinner.d.ts.map +1 -0
- package/dist/react/ui/spinner.js +17 -0
- package/dist/react/ui/spinner.js.map +1 -0
- package/dist/react/ui/switch.d.ts +12 -0
- package/dist/react/ui/switch.d.ts.map +1 -0
- package/dist/react/ui/switch.js +22 -0
- package/dist/react/ui/switch.js.map +1 -0
- package/dist/react/ui/table.d.ts +39 -0
- package/dist/react/ui/table.d.ts.map +1 -0
- package/dist/react/ui/table.js +68 -0
- package/dist/react/ui/table.js.map +1 -0
- package/dist/react/ui/tabs.d.ts +24 -0
- package/dist/react/ui/tabs.d.ts.map +1 -0
- package/dist/react/ui/tabs.js +39 -0
- package/dist/react/ui/tabs.js.map +1 -0
- package/dist/react/ui/textarea.d.ts +11 -0
- package/dist/react/ui/textarea.d.ts.map +1 -0
- package/dist/react/ui/textarea.js +15 -0
- package/dist/react/ui/textarea.js.map +1 -0
- package/dist/react/ui/toggle-group.d.ts +27 -0
- package/dist/react/ui/toggle-group.d.ts.map +1 -0
- package/dist/react/ui/toggle-group.js +50 -0
- package/dist/react/ui/toggle-group.js.map +1 -0
- package/dist/react/ui/toggle.d.ts +20 -0
- package/dist/react/ui/toggle.d.ts.map +1 -0
- package/dist/react/ui/toggle.js +38 -0
- package/dist/react/ui/toggle.js.map +1 -0
- package/dist/react/ui/tooltip.d.ts +24 -0
- package/dist/react/ui/tooltip.d.ts.map +1 -0
- package/dist/react/ui/tooltip.js +39 -0
- package/dist/react/ui/tooltip.js.map +1 -0
- package/dist/shared/src/sql/helpers.d.ts +160 -0
- package/dist/shared/src/sql/helpers.d.ts.map +1 -0
- package/dist/shared/src/sql/helpers.js +103 -0
- package/dist/shared/src/sql/helpers.js.map +1 -0
- package/dist/shared/src/sql/types.d.ts +34 -0
- package/dist/shared/src/sql/types.d.ts.map +1 -0
- package/dist/styles.css +425 -0
- package/llms.txt +193 -0
- package/package.json +98 -0
- package/scripts/postinstall.js +6 -0
|
@@ -0,0 +1,134 @@
|
|
|
1
|
+
import { cn } from "../lib/utils.js";
|
|
2
|
+
import { Button } from "./button.js";
|
|
3
|
+
import * as React from "react";
|
|
4
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
5
|
+
import { ArrowLeft, ArrowRight } from "lucide-react";
|
|
6
|
+
import useEmblaCarousel from "embla-carousel-react";
|
|
7
|
+
|
|
8
|
+
//#region src/react/ui/carousel.tsx
|
|
9
|
+
const CarouselContext = React.createContext(null);
|
|
10
|
+
function useCarousel() {
|
|
11
|
+
const context = React.useContext(CarouselContext);
|
|
12
|
+
if (!context) throw new Error("useCarousel must be used within a <Carousel />");
|
|
13
|
+
return context;
|
|
14
|
+
}
|
|
15
|
+
function Carousel({ orientation = "horizontal", opts, setApi, plugins, className, children, ...props }) {
|
|
16
|
+
const [carouselRef, api] = useEmblaCarousel({
|
|
17
|
+
...opts,
|
|
18
|
+
axis: orientation === "horizontal" ? "x" : "y"
|
|
19
|
+
}, plugins);
|
|
20
|
+
const [canScrollPrev, setCanScrollPrev] = React.useState(false);
|
|
21
|
+
const [canScrollNext, setCanScrollNext] = React.useState(false);
|
|
22
|
+
const onSelect = React.useCallback((api$1) => {
|
|
23
|
+
if (!api$1) return;
|
|
24
|
+
setCanScrollPrev(api$1.canScrollPrev());
|
|
25
|
+
setCanScrollNext(api$1.canScrollNext());
|
|
26
|
+
}, []);
|
|
27
|
+
const scrollPrev = React.useCallback(() => {
|
|
28
|
+
api?.scrollPrev();
|
|
29
|
+
}, [api]);
|
|
30
|
+
const scrollNext = React.useCallback(() => {
|
|
31
|
+
api?.scrollNext();
|
|
32
|
+
}, [api]);
|
|
33
|
+
const handleKeyDown = React.useCallback((event) => {
|
|
34
|
+
if (event.key === "ArrowLeft") {
|
|
35
|
+
event.preventDefault();
|
|
36
|
+
scrollPrev();
|
|
37
|
+
} else if (event.key === "ArrowRight") {
|
|
38
|
+
event.preventDefault();
|
|
39
|
+
scrollNext();
|
|
40
|
+
}
|
|
41
|
+
}, [scrollPrev, scrollNext]);
|
|
42
|
+
React.useEffect(() => {
|
|
43
|
+
if (!api || !setApi) return;
|
|
44
|
+
setApi(api);
|
|
45
|
+
}, [api, setApi]);
|
|
46
|
+
React.useEffect(() => {
|
|
47
|
+
if (!api) return;
|
|
48
|
+
onSelect(api);
|
|
49
|
+
api.on("reInit", onSelect);
|
|
50
|
+
api.on("select", onSelect);
|
|
51
|
+
return () => {
|
|
52
|
+
api?.off("select", onSelect);
|
|
53
|
+
};
|
|
54
|
+
}, [api, onSelect]);
|
|
55
|
+
return /* @__PURE__ */ jsx(CarouselContext.Provider, {
|
|
56
|
+
value: {
|
|
57
|
+
carouselRef,
|
|
58
|
+
api,
|
|
59
|
+
opts,
|
|
60
|
+
orientation: orientation || (opts?.axis === "y" ? "vertical" : "horizontal"),
|
|
61
|
+
scrollPrev,
|
|
62
|
+
scrollNext,
|
|
63
|
+
canScrollPrev,
|
|
64
|
+
canScrollNext
|
|
65
|
+
},
|
|
66
|
+
children: /* @__PURE__ */ jsx("div", {
|
|
67
|
+
onKeyDownCapture: handleKeyDown,
|
|
68
|
+
className: cn("relative", className),
|
|
69
|
+
role: "region",
|
|
70
|
+
"aria-roledescription": "carousel",
|
|
71
|
+
"data-slot": "carousel",
|
|
72
|
+
...props,
|
|
73
|
+
children
|
|
74
|
+
})
|
|
75
|
+
});
|
|
76
|
+
}
|
|
77
|
+
function CarouselContent({ className, ...props }) {
|
|
78
|
+
const { carouselRef, orientation } = useCarousel();
|
|
79
|
+
return /* @__PURE__ */ jsx("div", {
|
|
80
|
+
ref: carouselRef,
|
|
81
|
+
className: "overflow-hidden",
|
|
82
|
+
"data-slot": "carousel-content",
|
|
83
|
+
children: /* @__PURE__ */ jsx("div", {
|
|
84
|
+
className: cn("flex", orientation === "horizontal" ? "-ml-4" : "-mt-4 flex-col", className),
|
|
85
|
+
...props
|
|
86
|
+
})
|
|
87
|
+
});
|
|
88
|
+
}
|
|
89
|
+
function CarouselItem({ className, ...props }) {
|
|
90
|
+
const { orientation } = useCarousel();
|
|
91
|
+
return /* @__PURE__ */ jsx("div", {
|
|
92
|
+
role: "group",
|
|
93
|
+
"aria-roledescription": "slide",
|
|
94
|
+
"data-slot": "carousel-item",
|
|
95
|
+
className: cn("min-w-0 shrink-0 grow-0 basis-full", orientation === "horizontal" ? "pl-4" : "pt-4", className),
|
|
96
|
+
...props
|
|
97
|
+
});
|
|
98
|
+
}
|
|
99
|
+
function CarouselPrevious({ className, variant = "outline", size = "icon", ...props }) {
|
|
100
|
+
const { orientation, scrollPrev, canScrollPrev } = useCarousel();
|
|
101
|
+
return /* @__PURE__ */ jsxs(Button, {
|
|
102
|
+
"data-slot": "carousel-previous",
|
|
103
|
+
variant,
|
|
104
|
+
size,
|
|
105
|
+
className: cn("absolute size-8 rounded-full", orientation === "horizontal" ? "top-1/2 -left-12 -translate-y-1/2" : "-top-12 left-1/2 -translate-x-1/2 rotate-90", className),
|
|
106
|
+
disabled: !canScrollPrev,
|
|
107
|
+
onClick: scrollPrev,
|
|
108
|
+
...props,
|
|
109
|
+
children: [/* @__PURE__ */ jsx(ArrowLeft, {}), /* @__PURE__ */ jsx("span", {
|
|
110
|
+
className: "sr-only",
|
|
111
|
+
children: "Previous slide"
|
|
112
|
+
})]
|
|
113
|
+
});
|
|
114
|
+
}
|
|
115
|
+
function CarouselNext({ className, variant = "outline", size = "icon", ...props }) {
|
|
116
|
+
const { orientation, scrollNext, canScrollNext } = useCarousel();
|
|
117
|
+
return /* @__PURE__ */ jsxs(Button, {
|
|
118
|
+
"data-slot": "carousel-next",
|
|
119
|
+
variant,
|
|
120
|
+
size,
|
|
121
|
+
className: cn("absolute size-8 rounded-full", orientation === "horizontal" ? "top-1/2 -right-12 -translate-y-1/2" : "-bottom-12 left-1/2 -translate-x-1/2 rotate-90", className),
|
|
122
|
+
disabled: !canScrollNext,
|
|
123
|
+
onClick: scrollNext,
|
|
124
|
+
...props,
|
|
125
|
+
children: [/* @__PURE__ */ jsx(ArrowRight, {}), /* @__PURE__ */ jsx("span", {
|
|
126
|
+
className: "sr-only",
|
|
127
|
+
children: "Next slide"
|
|
128
|
+
})]
|
|
129
|
+
});
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
//#endregion
|
|
133
|
+
export { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious };
|
|
134
|
+
//# sourceMappingURL=carousel.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"carousel.js","names":["api"],"sources":["../../../src/react/ui/carousel.tsx"],"sourcesContent":["import * as React from \"react\";\nimport useEmblaCarousel, {\n type UseEmblaCarouselType,\n} from \"embla-carousel-react\";\nimport { ArrowLeft, ArrowRight } from \"lucide-react\";\n\nimport { cn } from \"../lib/utils\";\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 setApi(api);\n }, [api, setApi]);\n\n React.useEffect(() => {\n if (!api) return;\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:\n 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\n ref={carouselRef}\n className=\"overflow-hidden\"\n data-slot=\"carousel-content\"\n >\n <div\n className={cn(\n \"flex\",\n orientation === \"horizontal\" ? \"-ml-4\" : \"-mt-4 flex-col\",\n className\n )}\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\",\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 size-8 rounded-full\",\n orientation === \"horizontal\"\n ? \"top-1/2 -left-12 -translate-y-1/2\"\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 <ArrowLeft />\n <span className=\"sr-only\">Previous slide</span>\n </Button>\n );\n}\n\nfunction CarouselNext({\n className,\n variant = \"outline\",\n size = \"icon\",\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 size-8 rounded-full\",\n orientation === \"horizontal\"\n ? \"top-1/2 -right-12 -translate-y-1/2\"\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 <ArrowRight />\n <span className=\"sr-only\">Next slide</span>\n </Button>\n );\n}\n\nexport {\n type CarouselApi,\n Carousel,\n CarouselContent,\n CarouselItem,\n CarouselPrevious,\n CarouselNext,\n};\n"],"mappings":";;;;;;;;AA8BA,MAAM,kBAAkB,MAAM,cAA2C,KAAK;AAE9E,SAAS,cAAc;CACrB,MAAM,UAAU,MAAM,WAAW,gBAAgB;AAEjD,KAAI,CAAC,QACH,OAAM,IAAI,MAAM,iDAAiD;AAGnE,QAAO;;AAGT,SAAS,SAAS,EAChB,cAAc,cACd,MACA,QACA,SACA,WACA,UACA,GAAG,SAC2C;CAC9C,MAAM,CAAC,aAAa,OAAO,iBACzB;EACE,GAAG;EACH,MAAM,gBAAgB,eAAe,MAAM;EAC5C,EACD,QACD;CACD,MAAM,CAAC,eAAe,oBAAoB,MAAM,SAAS,MAAM;CAC/D,MAAM,CAAC,eAAe,oBAAoB,MAAM,SAAS,MAAM;CAE/D,MAAM,WAAW,MAAM,aAAa,UAAqB;AACvD,MAAI,CAACA,MAAK;AACV,mBAAiBA,MAAI,eAAe,CAAC;AACrC,mBAAiBA,MAAI,eAAe,CAAC;IACpC,EAAE,CAAC;CAEN,MAAM,aAAa,MAAM,kBAAkB;AACzC,OAAK,YAAY;IAChB,CAAC,IAAI,CAAC;CAET,MAAM,aAAa,MAAM,kBAAkB;AACzC,OAAK,YAAY;IAChB,CAAC,IAAI,CAAC;CAET,MAAM,gBAAgB,MAAM,aACzB,UAA+C;AAC9C,MAAI,MAAM,QAAQ,aAAa;AAC7B,SAAM,gBAAgB;AACtB,eAAY;aACH,MAAM,QAAQ,cAAc;AACrC,SAAM,gBAAgB;AACtB,eAAY;;IAGhB,CAAC,YAAY,WAAW,CACzB;AAED,OAAM,gBAAgB;AACpB,MAAI,CAAC,OAAO,CAAC,OAAQ;AACrB,SAAO,IAAI;IACV,CAAC,KAAK,OAAO,CAAC;AAEjB,OAAM,gBAAgB;AACpB,MAAI,CAAC,IAAK;AACV,WAAS,IAAI;AACb,MAAI,GAAG,UAAU,SAAS;AAC1B,MAAI,GAAG,UAAU,SAAS;AAE1B,eAAa;AACX,QAAK,IAAI,UAAU,SAAS;;IAE7B,CAAC,KAAK,SAAS,CAAC;AAEnB,QACE,oBAAC,gBAAgB;EACf,OAAO;GACL;GACK;GACL;GACA,aACE,gBAAgB,MAAM,SAAS,MAAM,aAAa;GACpD;GACA;GACA;GACA;GACD;YAED,oBAAC;GACC,kBAAkB;GAClB,WAAW,GAAG,YAAY,UAAU;GACpC,MAAK;GACL,wBAAqB;GACrB,aAAU;GACV,GAAI;GAEH;IACG;GACmB;;AAI/B,SAAS,gBAAgB,EAAE,WAAW,GAAG,SAAsC;CAC7E,MAAM,EAAE,aAAa,gBAAgB,aAAa;AAElD,QACE,oBAAC;EACC,KAAK;EACL,WAAU;EACV,aAAU;YAEV,oBAAC;GACC,WAAW,GACT,QACA,gBAAgB,eAAe,UAAU,kBACzC,UACD;GACD,GAAI;IACJ;GACE;;AAIV,SAAS,aAAa,EAAE,WAAW,GAAG,SAAsC;CAC1E,MAAM,EAAE,gBAAgB,aAAa;AAErC,QACE,oBAAC;EACC,MAAK;EACL,wBAAqB;EACrB,aAAU;EACV,WAAW,GACT,sCACA,gBAAgB,eAAe,SAAS,QACxC,UACD;EACD,GAAI;GACJ;;AAIN,SAAS,iBAAiB,EACxB,WACA,UAAU,WACV,OAAO,QACP,GAAG,SACmC;CACtC,MAAM,EAAE,aAAa,YAAY,kBAAkB,aAAa;AAEhE,QACE,qBAAC;EACC,aAAU;EACD;EACH;EACN,WAAW,GACT,gCACA,gBAAgB,eACZ,sCACA,+CACJ,UACD;EACD,UAAU,CAAC;EACX,SAAS;EACT,GAAI;aAEJ,oBAAC,cAAY,EACb,oBAAC;GAAK,WAAU;aAAU;IAAqB;GACxC;;AAIb,SAAS,aAAa,EACpB,WACA,UAAU,WACV,OAAO,QACP,GAAG,SACmC;CACtC,MAAM,EAAE,aAAa,YAAY,kBAAkB,aAAa;AAEhE,QACE,qBAAC;EACC,aAAU;EACD;EACH;EACN,WAAW,GACT,gCACA,gBAAgB,eACZ,uCACA,kDACJ,UACD;EACD,UAAU,CAAC;EACX,SAAS;EACT,GAAI;aAEJ,oBAAC,eAAa,EACd,oBAAC;GAAK,WAAU;aAAU;IAAiB;GACpC"}
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import * as react_jsx_runtime48 from "react/jsx-runtime";
|
|
3
|
+
import * as RechartsPrimitive from "recharts";
|
|
4
|
+
|
|
5
|
+
//#region src/react/ui/chart.d.ts
|
|
6
|
+
declare const THEMES: {
|
|
7
|
+
readonly light: "";
|
|
8
|
+
readonly dark: ".dark";
|
|
9
|
+
};
|
|
10
|
+
type ChartConfig = { [k in string]: {
|
|
11
|
+
label?: React.ReactNode;
|
|
12
|
+
icon?: React.ComponentType;
|
|
13
|
+
} & ({
|
|
14
|
+
color?: string;
|
|
15
|
+
theme?: never;
|
|
16
|
+
} | {
|
|
17
|
+
color?: never;
|
|
18
|
+
theme: Record<keyof typeof THEMES, string>;
|
|
19
|
+
}) };
|
|
20
|
+
declare function ChartContainer({
|
|
21
|
+
id,
|
|
22
|
+
className,
|
|
23
|
+
children,
|
|
24
|
+
config,
|
|
25
|
+
...props
|
|
26
|
+
}: React.ComponentProps<"div"> & {
|
|
27
|
+
config: ChartConfig;
|
|
28
|
+
children: React.ComponentProps<typeof RechartsPrimitive.ResponsiveContainer>["children"];
|
|
29
|
+
}): react_jsx_runtime48.JSX.Element;
|
|
30
|
+
declare const ChartStyle: ({
|
|
31
|
+
id,
|
|
32
|
+
config
|
|
33
|
+
}: {
|
|
34
|
+
id: string;
|
|
35
|
+
config: ChartConfig;
|
|
36
|
+
}) => react_jsx_runtime48.JSX.Element | null;
|
|
37
|
+
declare const ChartTooltip: typeof RechartsPrimitive.Tooltip;
|
|
38
|
+
declare function ChartTooltipContent({
|
|
39
|
+
active,
|
|
40
|
+
payload,
|
|
41
|
+
className,
|
|
42
|
+
indicator,
|
|
43
|
+
hideLabel,
|
|
44
|
+
hideIndicator,
|
|
45
|
+
label,
|
|
46
|
+
labelFormatter,
|
|
47
|
+
labelClassName,
|
|
48
|
+
formatter,
|
|
49
|
+
color,
|
|
50
|
+
nameKey,
|
|
51
|
+
labelKey
|
|
52
|
+
}: React.ComponentProps<"div"> & {
|
|
53
|
+
active?: boolean;
|
|
54
|
+
payload?: any[];
|
|
55
|
+
label?: string;
|
|
56
|
+
labelFormatter?: (value: any, payload: any[]) => React.ReactNode;
|
|
57
|
+
formatter?: (value: any, name: any, item: any, index: number, payload: any) => React.ReactNode;
|
|
58
|
+
color?: string;
|
|
59
|
+
hideLabel?: boolean;
|
|
60
|
+
hideIndicator?: boolean;
|
|
61
|
+
indicator?: "line" | "dot" | "dashed";
|
|
62
|
+
labelClassName?: string;
|
|
63
|
+
nameKey?: string;
|
|
64
|
+
labelKey?: string;
|
|
65
|
+
}): react_jsx_runtime48.JSX.Element | null;
|
|
66
|
+
declare const ChartLegend: typeof RechartsPrimitive.Legend;
|
|
67
|
+
declare function ChartLegendContent({
|
|
68
|
+
className,
|
|
69
|
+
hideIcon,
|
|
70
|
+
payload,
|
|
71
|
+
verticalAlign,
|
|
72
|
+
nameKey
|
|
73
|
+
}: React.ComponentProps<"div"> & Pick<RechartsPrimitive.LegendProps, "verticalAlign"> & {
|
|
74
|
+
payload?: any[];
|
|
75
|
+
hideIcon?: boolean;
|
|
76
|
+
nameKey?: string;
|
|
77
|
+
}): react_jsx_runtime48.JSX.Element | null;
|
|
78
|
+
//#endregion
|
|
79
|
+
export { ChartConfig, ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent };
|
|
80
|
+
//# sourceMappingURL=chart.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"chart.d.ts","names":[],"sources":["../../../src/react/ui/chart.tsx"],"sourcesContent":[],"mappings":";;;;;cAQM;;;AALwC,CAAA;AAOlC,KAAA,WAAA,GAAW,QAAA,MAAA,GAAA;EAEX,KAAM,CAAA,EAAN,KAAA,CAAM,SAAA;EACP,IAAA,CAAM,EAAN,KAAA,CAAM,aAAA;IAGiC,CAAA;EAApB,KAAA,CAAA,EAAA,MAAA;EAAM,KAAA,CAAA,EAAA,KAAA;AAoB3B,CAAA,GAAA;EAAc,KAAA,CAAA,EAAA,KAAA;EACrB,KAAA,EArB4B,MAqB5B,CAAA,MAAA,OArBgD,MAqBhD,EAAA,MAAA,CAAA;;iBADO,cAAA,CAIP;EAAA,EAAA;EAAA,SAAA;EAAA,QAAA;EAAA,MAAA;EAAA,GAAA;CAAA,EAEC,KAAA,CAAM,cAFP,CAAA,KAAA,CAAA,GAAA;QAEC,EACO,WADD;UACC,EACE,KAAA,CAAM,cADR,CAAA,OAEC,iBAAA,CAAkB,mBAFnB,CAAA,CAAA,UAAA,CAAA;IAIT,mBAAA,CAAA,GAAA,CAAA,OAF4B;cA0BvB,UA3BY,EAAA,CAAA;EAAA,EAAA;EAAA;AAGjB,CAHiB,EAAA;MAGjB,MAAA;EAAA,MAAA,EAwByD,WAxBzD;AAAA,CAAA,EAAA,GAwBsE,mBAAA,CAAA,GAAA,CAAA,OAAA,GA+BtE,IAAA;cAEK,YAFL,EAAA,OAEiB,iBAAA,CAAA,OAFjB;iBAIQ,mBAAA,CAnCW;EAAA,MAAA;EAAA,OAAA;EAAA,SAAA;EAAA,SAAA;EAAA,SAAA;EAAA,aAAA;EAAA,KAAA;EAAA,cAAA;EAAA,cAAA;EAAA,SAAA;EAAA,KAAA;EAAA,OAAA;EAAA;CAAA,EAiDjB,KAAA,CAAM,cAjDW,CAAA,KAAA,CAAA,GAAA;QAAA,CAAA,EAAA,OAAA;SAAsC,CAAA,EAAA,GAAA,EAAA;OAAa,CAAA,EAAA,MAAA;EAAA,cAAA,CAAA,EAAA,CAAA,KAAA,EAAA,GAAA,EAAA,OAAA,EAAA,GAAA,EAAA,EAAA,GAqDpB,KAAA,CAAM,SArDc;EAiCjE,SAAA,CAAA,EAAA,CAAA,KAAwC,EAAA,GAAA,EAAA,IAA5B,EAAA,GAAA,EAAA,IAAA,EAAA,GAAA,EAAA,KAA4B,EAAA,MAAA,EAAA,OAAA,EAAA,GAAA,EAAA,GA2BvC,KAAA,CAAM,SA3BiC;EAErC,KAAA,CAAA,EAAA,MAAA;EAAmB,SAAA,CAAA,EAAA,OAAA;eAC1B,CAAA,EAAA,OAAA;WACA,CAAA,EAAA,MAAA,GAAA,KAAA,GAAA,QAAA;gBACA,CAAA,EAAA,MAAA;SACA,CAAA,EAAA,MAAA;UACA,CAAA,EAAA,MAAA;IA4BD,mBAAA,CAAA,GAAA,CAAA,OAAA,GA3BC,IAAA;cAwJI,WAvJJ,EAAA,OAuJe,iBAAA,CAAA,MAvJf;iBAyJO,kBAAA,CAxJP;EAAA,SAAA;EAAA,QAAA;EAAA,OAAA;EAAA,aAAA;EAAA;CAAA,EA8JC,KAAA,CAAM,cA9JP,CAAA,KAAA,CAAA,GA+JA,IA/JA,CA+JK,iBAAA,CAAkB,WA/JvB,EAAA,eAAA,CAAA,GAAA;SACA,CAAA,EAAA,GAAA,EAAA;UACA,CAAA,EAAA,OAAA;SACA,CAAA,EAAA,MAAA;IAgKC,mBAAA,CAAA,GAAA,CAAA,OAAA,GA/JD,IAAA"}
|
|
@@ -0,0 +1,143 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
import { cn } from "../lib/utils.js";
|
|
4
|
+
import * as React from "react";
|
|
5
|
+
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
6
|
+
import * as RechartsPrimitive from "recharts";
|
|
7
|
+
|
|
8
|
+
//#region src/react/ui/chart.tsx
|
|
9
|
+
const THEMES = {
|
|
10
|
+
light: "",
|
|
11
|
+
dark: ".dark"
|
|
12
|
+
};
|
|
13
|
+
const ChartContext = React.createContext(null);
|
|
14
|
+
function useChart() {
|
|
15
|
+
const context = React.useContext(ChartContext);
|
|
16
|
+
if (!context) throw new Error("useChart must be used within a <ChartContainer />");
|
|
17
|
+
return context;
|
|
18
|
+
}
|
|
19
|
+
function ChartContainer({ id, className, children, config, ...props }) {
|
|
20
|
+
const uniqueId = React.useId();
|
|
21
|
+
const chartId = `chart-${id || uniqueId.replace(/:/g, "")}`;
|
|
22
|
+
return /* @__PURE__ */ jsx(ChartContext.Provider, {
|
|
23
|
+
value: { config },
|
|
24
|
+
children: /* @__PURE__ */ jsxs("div", {
|
|
25
|
+
"data-slot": "chart",
|
|
26
|
+
"data-chart": chartId,
|
|
27
|
+
className: cn("[&_.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-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 flex aspect-video justify-center text-xs [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-hidden [&_.recharts-sector]:outline-hidden [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-surface]:outline-hidden", className),
|
|
28
|
+
...props,
|
|
29
|
+
children: [/* @__PURE__ */ jsx(ChartStyle, {
|
|
30
|
+
id: chartId,
|
|
31
|
+
config
|
|
32
|
+
}), /* @__PURE__ */ jsx(RechartsPrimitive.ResponsiveContainer, { children })]
|
|
33
|
+
})
|
|
34
|
+
});
|
|
35
|
+
}
|
|
36
|
+
const ChartStyle = ({ id, config }) => {
|
|
37
|
+
const colorConfig = Object.entries(config).filter(([, config$1]) => config$1.theme || config$1.color);
|
|
38
|
+
if (!colorConfig.length) return null;
|
|
39
|
+
return /* @__PURE__ */ jsx("style", { dangerouslySetInnerHTML: { __html: Object.entries(THEMES).map(([theme, prefix]) => `
|
|
40
|
+
${prefix} [data-chart=${id}] {
|
|
41
|
+
${colorConfig.map(([key, itemConfig]) => {
|
|
42
|
+
const color = itemConfig.theme?.[theme] || itemConfig.color;
|
|
43
|
+
return color ? ` --color-${key}: ${color};` : null;
|
|
44
|
+
}).join("\n")}
|
|
45
|
+
}
|
|
46
|
+
`).join("\n") } });
|
|
47
|
+
};
|
|
48
|
+
const ChartTooltip = RechartsPrimitive.Tooltip;
|
|
49
|
+
function ChartTooltipContent({ active, payload, className, indicator = "dot", hideLabel = false, hideIndicator = false, label = "", labelFormatter, labelClassName, formatter, color, nameKey, labelKey }) {
|
|
50
|
+
const { config } = useChart();
|
|
51
|
+
const tooltipLabel = React.useMemo(() => {
|
|
52
|
+
if (hideLabel || !payload?.length) return null;
|
|
53
|
+
const [item] = payload;
|
|
54
|
+
const itemConfig = getPayloadConfigFromPayload(config, item, `${labelKey || item?.dataKey || item?.name || "value"}`);
|
|
55
|
+
const value = !labelKey && typeof label === "string" ? config[label]?.label || label : itemConfig?.label;
|
|
56
|
+
if (labelFormatter) return /* @__PURE__ */ jsx("div", {
|
|
57
|
+
className: cn("font-medium", labelClassName),
|
|
58
|
+
children: labelFormatter(value, payload)
|
|
59
|
+
});
|
|
60
|
+
if (!value) return null;
|
|
61
|
+
return /* @__PURE__ */ jsx("div", {
|
|
62
|
+
className: cn("font-medium", labelClassName),
|
|
63
|
+
children: value
|
|
64
|
+
});
|
|
65
|
+
}, [
|
|
66
|
+
label,
|
|
67
|
+
labelFormatter,
|
|
68
|
+
payload,
|
|
69
|
+
hideLabel,
|
|
70
|
+
labelClassName,
|
|
71
|
+
config,
|
|
72
|
+
labelKey
|
|
73
|
+
]);
|
|
74
|
+
if (!active || !payload?.length) return null;
|
|
75
|
+
const nestLabel = payload.length === 1 && indicator !== "dot";
|
|
76
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
77
|
+
className: cn("border-border/50 bg-background grid min-w-[8rem] items-start gap-1.5 rounded-lg border px-2.5 py-1.5 text-xs shadow-xl", className),
|
|
78
|
+
children: [!nestLabel ? tooltipLabel : null, /* @__PURE__ */ jsx("div", {
|
|
79
|
+
className: "grid gap-1.5",
|
|
80
|
+
children: payload.filter((item) => item.type !== "none").map((item, index) => {
|
|
81
|
+
const itemConfig = getPayloadConfigFromPayload(config, item, `${nameKey || item.name || item.dataKey || "value"}`);
|
|
82
|
+
const indicatorColor = color || item.payload.fill || item.color;
|
|
83
|
+
return /* @__PURE__ */ jsx("div", {
|
|
84
|
+
className: cn("[&>svg]:text-muted-foreground flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5", indicator === "dot" && "items-center"),
|
|
85
|
+
children: formatter && item?.value !== void 0 && item.name ? formatter(item.value, item.name, item, index, item.payload) : /* @__PURE__ */ jsxs(Fragment, { children: [itemConfig?.icon ? /* @__PURE__ */ jsx(itemConfig.icon, {}) : !hideIndicator && /* @__PURE__ */ jsx("div", {
|
|
86
|
+
className: cn("shrink-0 rounded-[2px] border-(--color-border) bg-(--color-bg)", {
|
|
87
|
+
"h-2.5 w-2.5": indicator === "dot",
|
|
88
|
+
"w-1": indicator === "line",
|
|
89
|
+
"w-0 border-[1.5px] border-dashed bg-transparent": indicator === "dashed",
|
|
90
|
+
"my-0.5": nestLabel && indicator === "dashed"
|
|
91
|
+
}),
|
|
92
|
+
style: {
|
|
93
|
+
"--color-bg": indicatorColor,
|
|
94
|
+
"--color-border": indicatorColor
|
|
95
|
+
}
|
|
96
|
+
}), /* @__PURE__ */ jsxs("div", {
|
|
97
|
+
className: cn("flex flex-1 justify-between leading-none", nestLabel ? "items-end" : "items-center"),
|
|
98
|
+
children: [/* @__PURE__ */ jsxs("div", {
|
|
99
|
+
className: "grid gap-1.5",
|
|
100
|
+
children: [nestLabel ? tooltipLabel : null, /* @__PURE__ */ jsx("span", {
|
|
101
|
+
className: "text-muted-foreground",
|
|
102
|
+
children: itemConfig?.label || item.name
|
|
103
|
+
})]
|
|
104
|
+
}), item.value && /* @__PURE__ */ jsx("span", {
|
|
105
|
+
className: "text-foreground font-mono font-medium tabular-nums",
|
|
106
|
+
children: item.value.toLocaleString()
|
|
107
|
+
})]
|
|
108
|
+
})] })
|
|
109
|
+
}, item.dataKey);
|
|
110
|
+
})
|
|
111
|
+
})]
|
|
112
|
+
});
|
|
113
|
+
}
|
|
114
|
+
const ChartLegend = RechartsPrimitive.Legend;
|
|
115
|
+
function ChartLegendContent({ className, hideIcon = false, payload = [], verticalAlign = "bottom", nameKey }) {
|
|
116
|
+
const { config } = useChart();
|
|
117
|
+
if (!payload?.length) return null;
|
|
118
|
+
return /* @__PURE__ */ jsx("div", {
|
|
119
|
+
className: cn("flex items-center justify-center gap-4", verticalAlign === "top" ? "pb-3" : "pt-3", className),
|
|
120
|
+
children: payload.filter((item) => item.type !== "none").map((item) => {
|
|
121
|
+
const itemConfig = getPayloadConfigFromPayload(config, item, `${nameKey || item.dataKey || "value"}`);
|
|
122
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
123
|
+
className: cn("[&>svg]:text-muted-foreground flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3"),
|
|
124
|
+
children: [itemConfig?.icon && !hideIcon ? /* @__PURE__ */ jsx(itemConfig.icon, {}) : /* @__PURE__ */ jsx("div", {
|
|
125
|
+
className: "h-2 w-2 shrink-0 rounded-[2px]",
|
|
126
|
+
style: { backgroundColor: item.color }
|
|
127
|
+
}), itemConfig?.label]
|
|
128
|
+
}, item.value);
|
|
129
|
+
})
|
|
130
|
+
});
|
|
131
|
+
}
|
|
132
|
+
function getPayloadConfigFromPayload(config, payload, key) {
|
|
133
|
+
if (typeof payload !== "object" || payload === null) return;
|
|
134
|
+
const payloadPayload = "payload" in payload && typeof payload.payload === "object" && payload.payload !== null ? payload.payload : void 0;
|
|
135
|
+
let configLabelKey = key;
|
|
136
|
+
if (key in payload && typeof payload[key] === "string") configLabelKey = payload[key];
|
|
137
|
+
else if (payloadPayload && key in payloadPayload && typeof payloadPayload[key] === "string") configLabelKey = payloadPayload[key];
|
|
138
|
+
return configLabelKey in config ? config[configLabelKey] : config[key];
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
//#endregion
|
|
142
|
+
export { ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent };
|
|
143
|
+
//# sourceMappingURL=chart.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"chart.js","names":["config","configLabelKey: string"],"sources":["../../../src/react/ui/chart.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport * as RechartsPrimitive from \"recharts\";\n\nimport { cn } from \"../lib/utils\";\n\n// Format: { THEME_NAME: CSS_SELECTOR }\nconst THEMES = { light: \"\", dark: \".dark\" } as const;\n\nexport type ChartConfig = {\n [k in string]: {\n label?: React.ReactNode;\n icon?: React.ComponentType;\n } & (\n | { color?: string; theme?: never }\n | { color?: never; theme: Record<keyof typeof THEMES, string> }\n );\n};\n\ntype ChartContextProps = {\n config: ChartConfig;\n};\n\nconst ChartContext = React.createContext<ChartContextProps | null>(null);\n\nfunction useChart() {\n const context = React.useContext(ChartContext);\n\n if (!context) {\n throw new Error(\"useChart must be used within a <ChartContainer />\");\n }\n\n return context;\n}\n\nfunction ChartContainer({\n id,\n className,\n children,\n config,\n ...props\n}: React.ComponentProps<\"div\"> & {\n config: ChartConfig;\n children: React.ComponentProps<\n typeof RechartsPrimitive.ResponsiveContainer\n >[\"children\"];\n}) {\n const uniqueId = React.useId();\n const chartId = `chart-${id || uniqueId.replace(/:/g, \"\")}`;\n\n return (\n <ChartContext.Provider value={{ config }}>\n <div\n data-slot=\"chart\"\n data-chart={chartId}\n className={cn(\n \"[&_.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-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 flex aspect-video justify-center text-xs [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-hidden [&_.recharts-sector]:outline-hidden [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-surface]:outline-hidden\",\n className,\n )}\n {...props}\n >\n <ChartStyle id={chartId} config={config} />\n <RechartsPrimitive.ResponsiveContainer>\n {children}\n </RechartsPrimitive.ResponsiveContainer>\n </div>\n </ChartContext.Provider>\n );\n}\n\nconst ChartStyle = ({ id, config }: { id: string; config: ChartConfig }) => {\n const colorConfig = Object.entries(config).filter(\n ([, config]) => config.theme || config.color,\n );\n\n if (!colorConfig.length) {\n return null;\n }\n\n return (\n <style\n dangerouslySetInnerHTML={{\n __html: Object.entries(THEMES)\n .map(\n ([theme, prefix]) => `\n${prefix} [data-chart=${id}] {\n${colorConfig\n .map(([key, itemConfig]) => {\n const color =\n itemConfig.theme?.[theme as keyof typeof itemConfig.theme] ||\n itemConfig.color;\n return color ? ` --color-${key}: ${color};` : null;\n })\n .join(\"\\n\")}\n}\n`,\n )\n .join(\"\\n\"),\n }}\n />\n );\n};\n\nconst ChartTooltip = RechartsPrimitive.Tooltip;\n\nfunction ChartTooltipContent({\n active,\n payload,\n className,\n indicator = \"dot\",\n hideLabel = false,\n hideIndicator = false,\n label = \"\" as string,\n labelFormatter,\n labelClassName,\n formatter,\n color,\n nameKey,\n labelKey,\n}: React.ComponentProps<\"div\"> & {\n active?: boolean;\n payload?: any[];\n label?: string;\n labelFormatter?: (value: any, payload: any[]) => React.ReactNode;\n formatter?: (\n value: any,\n name: any,\n item: any,\n index: number,\n payload: any,\n ) => React.ReactNode;\n color?: string;\n hideLabel?: boolean;\n hideIndicator?: boolean;\n indicator?: \"line\" | \"dot\" | \"dashed\";\n labelClassName?: string;\n nameKey?: string;\n labelKey?: string;\n}) {\n const { config } = useChart();\n\n const tooltipLabel = React.useMemo(() => {\n if (hideLabel || !payload?.length) {\n return null;\n }\n\n const [item] = payload;\n const key = `${labelKey || item?.dataKey || item?.name || \"value\"}`;\n const itemConfig = getPayloadConfigFromPayload(config, item, key);\n const value =\n !labelKey && typeof label === \"string\"\n ? config[label as keyof typeof config]?.label || label\n : itemConfig?.label;\n\n if (labelFormatter) {\n return (\n <div className={cn(\"font-medium\", labelClassName)}>\n {labelFormatter(value, payload)}\n </div>\n );\n }\n\n if (!value) {\n return null;\n }\n\n return <div className={cn(\"font-medium\", labelClassName)}>{value}</div>;\n }, [\n label,\n labelFormatter,\n payload,\n hideLabel,\n labelClassName,\n config,\n labelKey,\n ]);\n\n if (!active || !payload?.length) {\n return null;\n }\n\n const nestLabel = payload.length === 1 && indicator !== \"dot\";\n\n return (\n <div\n className={cn(\n \"border-border/50 bg-background grid min-w-[8rem] items-start gap-1.5 rounded-lg border px-2.5 py-1.5 text-xs shadow-xl\",\n className,\n )}\n >\n {!nestLabel ? tooltipLabel : null}\n <div className=\"grid gap-1.5\">\n {payload\n .filter((item: any) => item.type !== \"none\")\n .map((item: any, index: number) => {\n const key = `${nameKey || item.name || item.dataKey || \"value\"}`;\n const itemConfig = getPayloadConfigFromPayload(config, item, key);\n const indicatorColor = color || item.payload.fill || item.color;\n\n return (\n <div\n key={item.dataKey}\n className={cn(\n \"[&>svg]:text-muted-foreground flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5\",\n indicator === \"dot\" && \"items-center\",\n )}\n >\n {formatter && item?.value !== undefined && item.name ? (\n formatter(item.value, item.name, item, index, item.payload)\n ) : (\n <>\n {itemConfig?.icon ? (\n <itemConfig.icon />\n ) : (\n !hideIndicator && (\n <div\n className={cn(\n \"shrink-0 rounded-[2px] border-(--color-border) bg-(--color-bg)\",\n {\n \"h-2.5 w-2.5\": indicator === \"dot\",\n \"w-1\": indicator === \"line\",\n \"w-0 border-[1.5px] border-dashed bg-transparent\":\n indicator === \"dashed\",\n \"my-0.5\": nestLabel && indicator === \"dashed\",\n },\n )}\n style={\n {\n \"--color-bg\": indicatorColor,\n \"--color-border\": indicatorColor,\n } as React.CSSProperties\n }\n />\n )\n )}\n <div\n className={cn(\n \"flex flex-1 justify-between leading-none\",\n nestLabel ? \"items-end\" : \"items-center\",\n )}\n >\n <div className=\"grid gap-1.5\">\n {nestLabel ? tooltipLabel : null}\n <span className=\"text-muted-foreground\">\n {itemConfig?.label || item.name}\n </span>\n </div>\n {item.value && (\n <span className=\"text-foreground font-mono font-medium tabular-nums\">\n {item.value.toLocaleString()}\n </span>\n )}\n </div>\n </>\n )}\n </div>\n );\n })}\n </div>\n </div>\n );\n}\n\nconst ChartLegend = RechartsPrimitive.Legend;\n\nfunction ChartLegendContent({\n className,\n hideIcon = false,\n payload = [] as any[],\n verticalAlign = \"bottom\",\n nameKey,\n}: React.ComponentProps<\"div\"> &\n Pick<RechartsPrimitive.LegendProps, \"verticalAlign\"> & {\n payload?: any[];\n hideIcon?: boolean;\n nameKey?: string;\n }) {\n const { config } = useChart();\n\n if (!payload?.length) {\n return null;\n }\n\n return (\n <div\n className={cn(\n \"flex items-center justify-center gap-4\",\n verticalAlign === \"top\" ? \"pb-3\" : \"pt-3\",\n className,\n )}\n >\n {payload\n .filter((item: any) => item.type !== \"none\")\n .map((item: any) => {\n const key = `${nameKey || item.dataKey || \"value\"}`;\n const itemConfig = getPayloadConfigFromPayload(config, item, key);\n\n return (\n <div\n key={item.value}\n className={cn(\n \"[&>svg]:text-muted-foreground flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3\",\n )}\n >\n {itemConfig?.icon && !hideIcon ? (\n <itemConfig.icon />\n ) : (\n <div\n className=\"h-2 w-2 shrink-0 rounded-[2px]\"\n style={{\n backgroundColor: item.color,\n }}\n />\n )}\n {itemConfig?.label}\n </div>\n );\n })}\n </div>\n );\n}\n\n// Helper to extract item config from a payload.\nfunction getPayloadConfigFromPayload(\n config: ChartConfig,\n payload: unknown,\n key: string,\n) {\n if (typeof payload !== \"object\" || payload === null) {\n return undefined;\n }\n\n const payloadPayload =\n \"payload\" in payload &&\n typeof payload.payload === \"object\" &&\n payload.payload !== null\n ? payload.payload\n : undefined;\n\n let configLabelKey: string = key;\n\n if (\n key in payload &&\n typeof payload[key as keyof typeof payload] === \"string\"\n ) {\n configLabelKey = payload[key as keyof typeof payload] as string;\n } else if (\n payloadPayload &&\n key in payloadPayload &&\n typeof payloadPayload[key as keyof typeof payloadPayload] === \"string\"\n ) {\n configLabelKey = payloadPayload[\n key as keyof typeof payloadPayload\n ] as string;\n }\n\n return configLabelKey in config\n ? config[configLabelKey]\n : config[key as keyof typeof config];\n}\n\nexport {\n ChartContainer,\n ChartTooltip,\n ChartTooltipContent,\n ChartLegend,\n ChartLegendContent,\n ChartStyle,\n};\n"],"mappings":"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"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import * as react_jsx_runtime64 from "react/jsx-runtime";
|
|
3
|
+
import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
|
|
4
|
+
|
|
5
|
+
//#region src/react/ui/checkbox.d.ts
|
|
6
|
+
declare function Checkbox({
|
|
7
|
+
className,
|
|
8
|
+
...props
|
|
9
|
+
}: React.ComponentProps<typeof CheckboxPrimitive.Root>): react_jsx_runtime64.JSX.Element;
|
|
10
|
+
//#endregion
|
|
11
|
+
export { Checkbox };
|
|
12
|
+
//# sourceMappingURL=checkbox.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"checkbox.d.ts","names":[],"sources":["../../../src/react/ui/checkbox.tsx"],"sourcesContent":[],"mappings":";;;;;iBAQS,QAAA;;;GAGN,KAAA,CAAM,sBAAsB,iBAAA,CAAkB,QAAK,mBAAA,CAAA,GAAA,CAAA"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
import { cn } from "../lib/utils.js";
|
|
4
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
|
+
import { CheckIcon } from "lucide-react";
|
|
6
|
+
import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
|
|
7
|
+
|
|
8
|
+
//#region src/react/ui/checkbox.tsx
|
|
9
|
+
function Checkbox({ className, ...props }) {
|
|
10
|
+
return /* @__PURE__ */ jsx(CheckboxPrimitive.Root, {
|
|
11
|
+
"data-slot": "checkbox",
|
|
12
|
+
className: cn("h-4 w-4 p-0 m-0 shrink-0 flex-shrink-0", "peer border-input dark:bg-input/30 rounded-[4px] border shadow-xs", "data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground dark:data-[state=checked]:bg-primary data-[state=checked]:border-primary", "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] outline-none", "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", "disabled:cursor-not-allowed disabled:opacity-50", "transition-shadow", className),
|
|
13
|
+
...props,
|
|
14
|
+
children: /* @__PURE__ */ jsx(CheckboxPrimitive.Indicator, {
|
|
15
|
+
"data-slot": "checkbox-indicator",
|
|
16
|
+
className: "grid place-content-center text-current transition-none",
|
|
17
|
+
children: /* @__PURE__ */ jsx(CheckIcon, { className: "size-3.5" })
|
|
18
|
+
})
|
|
19
|
+
});
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
//#endregion
|
|
23
|
+
export { Checkbox };
|
|
24
|
+
//# sourceMappingURL=checkbox.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"checkbox.js","names":[],"sources":["../../../src/react/ui/checkbox.tsx"],"sourcesContent":["\"use client\";\n\nimport type * as React from \"react\";\nimport * as CheckboxPrimitive from \"@radix-ui/react-checkbox\";\nimport { CheckIcon } from \"lucide-react\";\n\nimport { cn } from \"../lib/utils\";\n\nfunction Checkbox({\n className,\n ...props\n}: React.ComponentProps<typeof CheckboxPrimitive.Root>) {\n return (\n <CheckboxPrimitive.Root\n data-slot=\"checkbox\"\n className={cn(\n // Fixed size and square shape - IMPORTANT: overrides global CSS\n \"h-4 w-4 p-0 m-0 shrink-0 flex-shrink-0\",\n // Base appearance\n \"peer border-input dark:bg-input/30 rounded-[4px] border shadow-xs\",\n // Checked states\n \"data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground dark:data-[state=checked]:bg-primary data-[state=checked]:border-primary\",\n // Focus states\n \"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] outline-none\",\n // Error states\n \"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive\",\n // Disabled states\n \"disabled:cursor-not-allowed disabled:opacity-50\",\n // Transitions\n \"transition-shadow\",\n className,\n )}\n {...props}\n >\n <CheckboxPrimitive.Indicator\n data-slot=\"checkbox-indicator\"\n className=\"grid place-content-center text-current transition-none\"\n >\n <CheckIcon className=\"size-3.5\" />\n </CheckboxPrimitive.Indicator>\n </CheckboxPrimitive.Root>\n );\n}\n\nexport { Checkbox };\n"],"mappings":";;;;;;;;AAQA,SAAS,SAAS,EAChB,WACA,GAAG,SACmD;AACtD,QACE,oBAAC,kBAAkB;EACjB,aAAU;EACV,WAAW,GAET,0CAEA,qEAEA,yJAEA,8FAEA,0GAEA,mDAEA,qBACA,UACD;EACD,GAAI;YAEJ,oBAAC,kBAAkB;GACjB,aAAU;GACV,WAAU;aAEV,oBAAC,aAAU,WAAU,aAAa;IACN;GACP"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import * as react_jsx_runtime52 from "react/jsx-runtime";
|
|
2
|
+
import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
|
|
3
|
+
|
|
4
|
+
//#region src/react/ui/collapsible.d.ts
|
|
5
|
+
declare function Collapsible({
|
|
6
|
+
...props
|
|
7
|
+
}: React.ComponentProps<typeof CollapsiblePrimitive.Root>): react_jsx_runtime52.JSX.Element;
|
|
8
|
+
declare function CollapsibleTrigger({
|
|
9
|
+
...props
|
|
10
|
+
}: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleTrigger>): react_jsx_runtime52.JSX.Element;
|
|
11
|
+
declare function CollapsibleContent({
|
|
12
|
+
...props
|
|
13
|
+
}: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleContent>): react_jsx_runtime52.JSX.Element;
|
|
14
|
+
//#endregion
|
|
15
|
+
export { Collapsible, CollapsibleContent, CollapsibleTrigger };
|
|
16
|
+
//# sourceMappingURL=collapsible.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"collapsible.d.ts","names":[],"sources":["../../../src/react/ui/collapsible.tsx"],"sourcesContent":[],"mappings":";;;;iBAES,WAAA;;GAEN,KAAA,CAAM,sBAAsB,oBAAA,CAAqB,QAAK,mBAAA,CAAA,GAAA,CAAA;iBAIhD,kBAAA;;GAEN,KAAA,CAAM,sBAAsB,oBAAA,CAAqB,sBAAmB,mBAAA,CAAA,GAAA,CAAA;iBAS9D,kBAAA;;GAEN,KAAA,CAAM,sBAAsB,oBAAA,CAAqB,sBAAmB,mBAAA,CAAA,GAAA,CAAA"}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
|
|
3
|
+
|
|
4
|
+
//#region src/react/ui/collapsible.tsx
|
|
5
|
+
function Collapsible({ ...props }) {
|
|
6
|
+
return /* @__PURE__ */ jsx(CollapsiblePrimitive.Root, {
|
|
7
|
+
"data-slot": "collapsible",
|
|
8
|
+
...props
|
|
9
|
+
});
|
|
10
|
+
}
|
|
11
|
+
function CollapsibleTrigger({ ...props }) {
|
|
12
|
+
return /* @__PURE__ */ jsx(CollapsiblePrimitive.CollapsibleTrigger, {
|
|
13
|
+
"data-slot": "collapsible-trigger",
|
|
14
|
+
...props
|
|
15
|
+
});
|
|
16
|
+
}
|
|
17
|
+
function CollapsibleContent({ ...props }) {
|
|
18
|
+
return /* @__PURE__ */ jsx(CollapsiblePrimitive.CollapsibleContent, {
|
|
19
|
+
"data-slot": "collapsible-content",
|
|
20
|
+
...props
|
|
21
|
+
});
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
//#endregion
|
|
25
|
+
export { Collapsible, CollapsibleContent, CollapsibleTrigger };
|
|
26
|
+
//# sourceMappingURL=collapsible.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"collapsible.js","names":[],"sources":["../../../src/react/ui/collapsible.tsx"],"sourcesContent":["import * as CollapsiblePrimitive from \"@radix-ui/react-collapsible\";\n\nfunction Collapsible({\n ...props\n}: React.ComponentProps<typeof CollapsiblePrimitive.Root>) {\n return <CollapsiblePrimitive.Root data-slot=\"collapsible\" {...props} />;\n}\n\nfunction CollapsibleTrigger({\n ...props\n}: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleTrigger>) {\n return (\n <CollapsiblePrimitive.CollapsibleTrigger\n data-slot=\"collapsible-trigger\"\n {...props}\n />\n );\n}\n\nfunction CollapsibleContent({\n ...props\n}: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleContent>) {\n return (\n <CollapsiblePrimitive.CollapsibleContent\n data-slot=\"collapsible-content\"\n {...props}\n />\n );\n}\n\nexport { Collapsible, CollapsibleTrigger, CollapsibleContent };\n"],"mappings":";;;;AAEA,SAAS,YAAY,EACnB,GAAG,SACsD;AACzD,QAAO,oBAAC,qBAAqB;EAAK,aAAU;EAAc,GAAI;GAAS;;AAGzE,SAAS,mBAAmB,EAC1B,GAAG,SACoE;AACvE,QACE,oBAAC,qBAAqB;EACpB,aAAU;EACV,GAAI;GACJ;;AAIN,SAAS,mBAAmB,EAC1B,GAAG,SACoE;AACvE,QACE,oBAAC,qBAAqB;EACpB,aAAU;EACV,GAAI;GACJ"}
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
import { Dialog } from "./dialog.js";
|
|
2
|
+
import * as React from "react";
|
|
3
|
+
import * as react_jsx_runtime55 from "react/jsx-runtime";
|
|
4
|
+
import { Command } from "cmdk";
|
|
5
|
+
|
|
6
|
+
//#region src/react/ui/command.d.ts
|
|
7
|
+
declare function Command$1({
|
|
8
|
+
className,
|
|
9
|
+
...props
|
|
10
|
+
}: React.ComponentProps<typeof Command>): react_jsx_runtime55.JSX.Element;
|
|
11
|
+
declare function CommandDialog({
|
|
12
|
+
title,
|
|
13
|
+
description,
|
|
14
|
+
children,
|
|
15
|
+
className,
|
|
16
|
+
showCloseButton,
|
|
17
|
+
...props
|
|
18
|
+
}: React.ComponentProps<typeof Dialog> & {
|
|
19
|
+
title?: string;
|
|
20
|
+
description?: string;
|
|
21
|
+
className?: string;
|
|
22
|
+
showCloseButton?: boolean;
|
|
23
|
+
}): react_jsx_runtime55.JSX.Element;
|
|
24
|
+
declare function CommandInput({
|
|
25
|
+
className,
|
|
26
|
+
...props
|
|
27
|
+
}: React.ComponentProps<typeof Command.Input>): react_jsx_runtime55.JSX.Element;
|
|
28
|
+
declare function CommandList({
|
|
29
|
+
className,
|
|
30
|
+
...props
|
|
31
|
+
}: React.ComponentProps<typeof Command.List>): react_jsx_runtime55.JSX.Element;
|
|
32
|
+
declare function CommandEmpty({
|
|
33
|
+
...props
|
|
34
|
+
}: React.ComponentProps<typeof Command.Empty>): react_jsx_runtime55.JSX.Element;
|
|
35
|
+
declare function CommandGroup({
|
|
36
|
+
className,
|
|
37
|
+
...props
|
|
38
|
+
}: React.ComponentProps<typeof Command.Group>): react_jsx_runtime55.JSX.Element;
|
|
39
|
+
declare function CommandSeparator({
|
|
40
|
+
className,
|
|
41
|
+
...props
|
|
42
|
+
}: React.ComponentProps<typeof Command.Separator>): react_jsx_runtime55.JSX.Element;
|
|
43
|
+
declare function CommandItem({
|
|
44
|
+
className,
|
|
45
|
+
...props
|
|
46
|
+
}: React.ComponentProps<typeof Command.Item>): react_jsx_runtime55.JSX.Element;
|
|
47
|
+
declare function CommandShortcut({
|
|
48
|
+
className,
|
|
49
|
+
...props
|
|
50
|
+
}: React.ComponentProps<"span">): react_jsx_runtime55.JSX.Element;
|
|
51
|
+
//#endregion
|
|
52
|
+
export { Command$1 as Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut };
|
|
53
|
+
//# sourceMappingURL=command.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"command.d.ts","names":[],"sources":["../../../src/react/ui/command.tsx"],"sourcesContent":[],"mappings":";;;;;;iBAaS,SAAA;;;GAGN,KAAA,CAAM,sBAAsB,WAAiB,mBAAA,CAAA,GAAA,CAAA;iBAavC,aAAA;;;;;;;GAON,KAAA,CAAM,sBAAsB;;EAvBtB,WAAA,CAAO,EAAA,MAAA;EAAA,SAAA,CAAA,EAAA,MAAA;iBACd,CAAA,EAAA,OAAA;IA2BD,mBAAA,CAAA,GAAA,CAAA,OAzB8B;iBA4CtB,YAAA,CA5CA;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EA+CN,KAAA,CAAM,cA/CA,CAAA,OA+CsB,OAAA,CAAiB,KA/CvC,CAAA,CAAA,EA+C6C,mBAAA,CAAA,GAAA,CAAA,OA/C7C;iBAkEA,WAAA,CAlEuC;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAqE7C,KAAA,CAAM,cArEuC,CAAA,OAqEjB,OAAA,CAAiB,IArEA,CAAA,CAAA,EAqEK,mBAAA,CAAA,GAAA,CAAA,OArEL;iBAkFvC,YAAA,CAlFuC;EAAA,GAAA;AAAA,CAAA,EAoF7C,KAAA,CAAM,cApFuC,CAAA,OAoFjB,OAAA,CAAiB,KApFA,CAAA,CAAA,EAoFM,mBAAA,CAAA,GAAA,CAAA,OApFN;AAAA,iBA8FvC,YAAA,CAjFa;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAoFnB,KAAA,CAAM,cApFa,CAAA,OAoFS,OAAA,CAAiB,KApF1B,CAAA,CAAA,EAoFgC,mBAAA,CAAA,GAAA,CAAA,OApFhC;iBAiGb,gBAAA,CAjGa;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAoGnB,KAAA,CAAM,cApGa,CAAA,OAoGS,OAAA,CAAiB,SApG1B,CAAA,CAAA,EAoGoC,mBAAA,CAAA,GAAA,CAAA,OApGpC;iBA8Gb,WAAA,CA7GP;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EAgHC,KAAA,CAAM,cAhHP,CAAA,OAgH6B,OAAA,CAAiB,IAhH9C,CAAA,CAAA,EAgHmD,mBAAA,CAAA,GAAA,CAAA,OAhHnD;iBA6HO,eAAA,CA5HP;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EA+HC,KAAA,CAAM,cA/HP,CAAA,MAAA,CAAA,CAAA,EA+H6B,mBAAA,CAAA,GAAA,CAAA,OA/H7B"}
|