@alpic-ai/ui 0.0.0-dev.g0999450 → 0.0.0-dev.g0a2a154
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/dist/components/accordion-card.d.mts +5 -5
- package/dist/components/accordion.d.mts +5 -5
- package/dist/components/alert.d.mts +8 -8
- package/dist/components/area-chart.d.mts +62 -0
- package/dist/components/area-chart.mjs +269 -0
- package/dist/components/attachment-tile.d.mts +1 -1
- package/dist/components/avatar.d.mts +7 -7
- package/dist/components/badge.d.mts +1 -1
- package/dist/components/bar-chart.d.mts +48 -0
- package/dist/components/bar-chart.mjs +256 -0
- package/dist/components/bar-list.d.mts +28 -0
- package/dist/components/bar-list.mjs +98 -0
- package/dist/components/breadcrumb.d.mts +10 -10
- package/dist/components/button.d.mts +5 -5
- package/dist/components/card.d.mts +9 -9
- package/dist/components/chart-card.d.mts +25 -0
- package/dist/components/chart-card.mjs +48 -0
- package/dist/components/chart-container.d.mts +20 -0
- package/dist/components/chart-container.mjs +37 -0
- package/dist/components/chart-legend.d.mts +16 -0
- package/dist/components/chart-legend.mjs +26 -0
- package/dist/components/chart-tooltip.d.mts +33 -0
- package/dist/components/chart-tooltip.mjs +52 -0
- package/dist/components/checkbox.d.mts +2 -2
- package/dist/components/collapsible.d.mts +4 -4
- package/dist/components/combobox.d.mts +10 -10
- package/dist/components/command.d.mts +9 -9
- package/dist/components/copyable.d.mts +2 -2
- package/dist/components/description-list.d.mts +5 -5
- package/dist/components/dialog.d.mts +13 -13
- package/dist/components/donut-chart.d.mts +46 -0
- package/dist/components/donut-chart.mjs +185 -0
- package/dist/components/dropdown-menu.d.mts +17 -17
- package/dist/components/form.d.mts +18 -18
- package/dist/components/form.mjs +6 -6
- package/dist/components/github-button.d.mts +1 -1
- package/dist/components/heatmap-chart.d.mts +40 -0
- package/dist/components/heatmap-chart.mjs +198 -0
- package/dist/components/input-group.d.mts +4 -4
- package/dist/components/input.d.mts +4 -4
- package/dist/components/input.mjs +2 -2
- package/dist/components/label.d.mts +2 -2
- package/dist/components/line-chart.d.mts +55 -0
- package/dist/components/line-chart.mjs +211 -0
- package/dist/components/page-loader.d.mts +1 -1
- package/dist/components/pagination.d.mts +3 -3
- package/dist/components/popover.d.mts +5 -5
- package/dist/components/radio-group.d.mts +3 -3
- package/dist/components/scroll-area.d.mts +3 -3
- package/dist/components/select.d.mts +9 -9
- package/dist/components/separator.d.mts +2 -2
- package/dist/components/sheet.d.mts +11 -11
- package/dist/components/shimmer-text.d.mts +3 -1
- package/dist/components/sidebar.d.mts +33 -33
- package/dist/components/sidebar.mjs +10 -10
- package/dist/components/skeleton.d.mts +1 -1
- package/dist/components/sonner.d.mts +5 -5
- package/dist/components/spinner.d.mts +2 -2
- package/dist/components/stat.d.mts +30 -0
- package/dist/components/stat.mjs +107 -0
- package/dist/components/status-dot.d.mts +1 -1
- package/dist/components/switch.d.mts +2 -2
- package/dist/components/table.d.mts +10 -10
- package/dist/components/tabs.d.mts +10 -10
- package/dist/components/tag.d.mts +3 -3
- package/dist/components/task-progress.d.mts +1 -1
- package/dist/components/textarea.d.mts +3 -3
- package/dist/components/textarea.mjs +2 -2
- package/dist/components/toggle-group.d.mts +3 -3
- package/dist/components/toggle-group.mjs +3 -3
- package/dist/components/tooltip.d.mts +5 -5
- package/dist/components/typography.d.mts +4 -4
- package/dist/components/wizard.d.mts +4 -22
- package/dist/components/wizard.mjs +1 -19
- package/dist/hooks/use-chart-theme.d.mts +18 -0
- package/dist/hooks/use-chart-theme.mjs +57 -0
- package/dist/hooks/use-mobile.mjs +3 -3
- package/dist/hooks/use-reduced-motion.d.mts +4 -0
- package/dist/hooks/use-reduced-motion.mjs +16 -0
- package/dist/lib/chart-palette.d.mts +4 -0
- package/dist/lib/chart-palette.mjs +95 -0
- package/dist/lib/chart.d.mts +14 -0
- package/dist/lib/chart.mjs +27 -0
- package/package.json +30 -29
- package/src/components/area-chart.tsx +339 -0
- package/src/components/bar-chart.tsx +309 -0
- package/src/components/bar-list.tsx +150 -0
- package/src/components/chart-card.tsx +63 -0
- package/src/components/chart-container.tsx +49 -0
- package/src/components/chart-legend.tsx +41 -0
- package/src/components/chart-tooltip.tsx +93 -0
- package/src/components/donut-chart.tsx +217 -0
- package/src/components/heatmap-chart.tsx +287 -0
- package/src/components/line-chart.tsx +264 -0
- package/src/components/stat.tsx +109 -0
- package/src/components/wizard.tsx +1 -35
- package/src/hooks/use-chart-theme.ts +75 -0
- package/src/hooks/use-reduced-motion.ts +17 -0
- package/src/lib/chart-palette.ts +110 -0
- package/src/lib/chart.ts +56 -0
- package/src/stories/area-chart.stories.tsx +198 -0
- package/src/stories/bar-chart.stories.tsx +167 -0
- package/src/stories/bar-list.stories.tsx +83 -0
- package/src/stories/donut-chart.stories.tsx +110 -0
- package/src/stories/heatmap-chart.stories.tsx +105 -0
- package/src/stories/line-chart.stories.tsx +144 -0
- package/src/stories/stat.stories.tsx +64 -0
- package/src/stories/wizard.stories.tsx +22 -4
- package/src/styles/tokens.css +63 -0
|
@@ -8,7 +8,7 @@ import { useIsMobile } from "../hooks/use-mobile.mjs";
|
|
|
8
8
|
import { Skeleton } from "./skeleton.mjs";
|
|
9
9
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
10
10
|
import { cva } from "class-variance-authority";
|
|
11
|
-
import * as React from "react";
|
|
11
|
+
import * as React$1 from "react";
|
|
12
12
|
import { Slot } from "@radix-ui/react-slot";
|
|
13
13
|
//#region src/components/sidebar.tsx
|
|
14
14
|
const SIDEBAR_COOKIE_NAME = "sidebar_state";
|
|
@@ -29,27 +29,27 @@ const INTERACTIVE_SIDEBAR_ELEMENT_SELECTOR = [
|
|
|
29
29
|
"[contenteditable='true']",
|
|
30
30
|
"[tabindex]:not([tabindex='-1'])"
|
|
31
31
|
].join(", ");
|
|
32
|
-
const SidebarContext = React.createContext(null);
|
|
32
|
+
const SidebarContext = React$1.createContext(null);
|
|
33
33
|
function useSidebar() {
|
|
34
|
-
const context = React.useContext(SidebarContext);
|
|
34
|
+
const context = React$1.useContext(SidebarContext);
|
|
35
35
|
if (!context) throw new Error("useSidebar must be used within a SidebarProvider.");
|
|
36
36
|
return context;
|
|
37
37
|
}
|
|
38
38
|
function SidebarProvider({ defaultOpen = true, open: openProp, onOpenChange: setOpenProp, className, style, children, ...props }) {
|
|
39
39
|
const isMobile = useIsMobile();
|
|
40
|
-
const [openMobile, setOpenMobile] = React.useState(false);
|
|
41
|
-
const [_open, _setOpen] = React.useState(defaultOpen);
|
|
40
|
+
const [openMobile, setOpenMobile] = React$1.useState(false);
|
|
41
|
+
const [_open, _setOpen] = React$1.useState(defaultOpen);
|
|
42
42
|
const open = openProp ?? _open;
|
|
43
|
-
const setOpen = React.useCallback((value) => {
|
|
43
|
+
const setOpen = React$1.useCallback((value) => {
|
|
44
44
|
const openState = typeof value === "function" ? value(open) : value;
|
|
45
45
|
if (setOpenProp) setOpenProp(openState);
|
|
46
46
|
else _setOpen(openState);
|
|
47
47
|
document.cookie = `${SIDEBAR_COOKIE_NAME}=${openState}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;
|
|
48
48
|
}, [setOpenProp, open]);
|
|
49
|
-
const toggleSidebar = React.useCallback(() => {
|
|
49
|
+
const toggleSidebar = React$1.useCallback(() => {
|
|
50
50
|
return isMobile ? setOpenMobile((open) => !open) : setOpen((open) => !open);
|
|
51
51
|
}, [isMobile, setOpen]);
|
|
52
|
-
React.useEffect(() => {
|
|
52
|
+
React$1.useEffect(() => {
|
|
53
53
|
const handleKeyDown = (event) => {
|
|
54
54
|
if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
|
|
55
55
|
event.preventDefault();
|
|
@@ -60,7 +60,7 @@ function SidebarProvider({ defaultOpen = true, open: openProp, onOpenChange: set
|
|
|
60
60
|
return () => window.removeEventListener("keydown", handleKeyDown);
|
|
61
61
|
}, [toggleSidebar]);
|
|
62
62
|
const state = open ? "expanded" : "collapsed";
|
|
63
|
-
const contextValue = React.useMemo(() => ({
|
|
63
|
+
const contextValue = React$1.useMemo(() => ({
|
|
64
64
|
state,
|
|
65
65
|
open,
|
|
66
66
|
setOpen,
|
|
@@ -380,7 +380,7 @@ function SidebarMenuBadge({ className, ...props }) {
|
|
|
380
380
|
});
|
|
381
381
|
}
|
|
382
382
|
function SidebarMenuSkeleton({ className, ...props }) {
|
|
383
|
-
const [width] = React.useState(() => `${Math.floor(Math.random() * 40) + 50}%`);
|
|
383
|
+
const [width] = React$1.useState(() => `${Math.floor(Math.random() * 40) + 50}%`);
|
|
384
384
|
return /* @__PURE__ */ jsx("div", {
|
|
385
385
|
"data-slot": "sidebar-menu-skeleton",
|
|
386
386
|
"data-sidebar": "menu-skeleton",
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import * as React from "react";
|
|
1
|
+
import * as React$1 from "react";
|
|
2
2
|
import { Toaster as Toaster$1, toast } from "sonner";
|
|
3
3
|
|
|
4
4
|
//#region src/components/sonner.d.ts
|
|
5
|
-
type ToasterProps = React.ComponentProps<typeof Toaster$1>;
|
|
6
|
-
declare function Toaster(props: ToasterProps):
|
|
5
|
+
type ToasterProps = React$1.ComponentProps<typeof Toaster$1>;
|
|
6
|
+
declare function Toaster(props: ToasterProps): React$1.JSX.Element;
|
|
7
7
|
interface ActionToastProps {
|
|
8
8
|
toastId: string | number;
|
|
9
9
|
title: string;
|
|
@@ -11,7 +11,7 @@ interface ActionToastProps {
|
|
|
11
11
|
onDismiss?: () => void;
|
|
12
12
|
confirm: {
|
|
13
13
|
label: string;
|
|
14
|
-
icon?: React.ReactNode;
|
|
14
|
+
icon?: React$1.ReactNode;
|
|
15
15
|
onClick: () => void;
|
|
16
16
|
loading?: boolean;
|
|
17
17
|
disabled?: boolean;
|
|
@@ -23,6 +23,6 @@ declare function ActionToast({
|
|
|
23
23
|
description,
|
|
24
24
|
onDismiss,
|
|
25
25
|
confirm
|
|
26
|
-
}: ActionToastProps):
|
|
26
|
+
}: ActionToastProps): React$1.JSX.Element;
|
|
27
27
|
//#endregion
|
|
28
28
|
export { ActionToast, type ActionToastProps, Toaster, type ToasterProps, toast };
|
|
@@ -11,7 +11,7 @@ declare function Spinner({
|
|
|
11
11
|
variant,
|
|
12
12
|
size,
|
|
13
13
|
...props
|
|
14
|
-
}: SpinnerProps): import("react
|
|
14
|
+
}: SpinnerProps): import("react").JSX.Element;
|
|
15
15
|
interface SpinnerBlockProps extends VariantProps<typeof spinnerVariants> {
|
|
16
16
|
className?: string;
|
|
17
17
|
fullscreen?: boolean;
|
|
@@ -23,6 +23,6 @@ declare function SpinnerBlock({
|
|
|
23
23
|
size,
|
|
24
24
|
fullscreen,
|
|
25
25
|
withLabel
|
|
26
|
-
}: SpinnerBlockProps): import("react
|
|
26
|
+
}: SpinnerBlockProps): import("react").JSX.Element;
|
|
27
27
|
//#endregion
|
|
28
28
|
export { Spinner, SpinnerBlock, type SpinnerBlockProps, type SpinnerProps, spinnerVariants };
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import * as React$1 from "react";
|
|
2
|
+
|
|
3
|
+
//#region src/components/stat.d.ts
|
|
4
|
+
declare const statDeltaVariants: (props?: ({
|
|
5
|
+
sentiment?: "positive" | "negative" | null | undefined;
|
|
6
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
7
|
+
interface StatDelta {
|
|
8
|
+
value: number;
|
|
9
|
+
direction: "up" | "down";
|
|
10
|
+
invert?: boolean;
|
|
11
|
+
label?: React$1.ReactNode;
|
|
12
|
+
}
|
|
13
|
+
interface StatProps extends React$1.ComponentProps<"div"> {
|
|
14
|
+
value: React$1.ReactNode;
|
|
15
|
+
unit?: string;
|
|
16
|
+
delta?: StatDelta;
|
|
17
|
+
sparkline?: number[] | Array<{
|
|
18
|
+
value: number;
|
|
19
|
+
}>;
|
|
20
|
+
}
|
|
21
|
+
declare function Stat({
|
|
22
|
+
value,
|
|
23
|
+
unit,
|
|
24
|
+
delta,
|
|
25
|
+
sparkline,
|
|
26
|
+
className,
|
|
27
|
+
...props
|
|
28
|
+
}: StatProps): React$1.JSX.Element;
|
|
29
|
+
//#endregion
|
|
30
|
+
export { Stat, StatDelta, StatProps, statDeltaVariants };
|
|
@@ -0,0 +1,107 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { cn } from "../lib/cn.mjs";
|
|
3
|
+
import { useChartContext } from "./chart-container.mjs";
|
|
4
|
+
import { ArrowDown, ArrowUp } from "lucide-react";
|
|
5
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
6
|
+
import { cva } from "class-variance-authority";
|
|
7
|
+
import * as React$1 from "react";
|
|
8
|
+
import { Area, AreaChart, ResponsiveContainer } from "recharts";
|
|
9
|
+
//#region src/components/stat.tsx
|
|
10
|
+
const statDeltaVariants = cva("inline-flex items-center gap-0.5 rounded-md px-1.5 py-0.5 font-mono text-[11px] font-medium leading-none", {
|
|
11
|
+
variants: { sentiment: {
|
|
12
|
+
positive: "text-success bg-success/12",
|
|
13
|
+
negative: "text-destructive bg-destructive/12"
|
|
14
|
+
} },
|
|
15
|
+
defaultVariants: { sentiment: "positive" }
|
|
16
|
+
});
|
|
17
|
+
const toSparkData = (sparkline) => (sparkline ?? []).map((point, index) => typeof point === "number" ? {
|
|
18
|
+
index,
|
|
19
|
+
value: point
|
|
20
|
+
} : {
|
|
21
|
+
index,
|
|
22
|
+
value: point.value
|
|
23
|
+
});
|
|
24
|
+
function Stat({ value, unit, delta, sparkline, className, ...props }) {
|
|
25
|
+
const { palette } = useChartContext();
|
|
26
|
+
const gradientId = React$1.useId().replace(/:/g, "");
|
|
27
|
+
const sparkData = React$1.useMemo(() => toSparkData(sparkline), [sparkline]);
|
|
28
|
+
const sparkColor = palette[0];
|
|
29
|
+
const sentiment = delta && (delta.invert ? delta.direction === "down" : delta.direction === "up") ? "positive" : "negative";
|
|
30
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
31
|
+
"data-slot": "stat",
|
|
32
|
+
className: cn("flex flex-col gap-2.5", className),
|
|
33
|
+
...props,
|
|
34
|
+
children: [/* @__PURE__ */ jsxs("div", {
|
|
35
|
+
className: "flex items-baseline gap-3",
|
|
36
|
+
children: [
|
|
37
|
+
/* @__PURE__ */ jsx("span", {
|
|
38
|
+
className: "type-display-sm font-bold leading-none tracking-tight tabular-nums text-foreground",
|
|
39
|
+
children: value
|
|
40
|
+
}),
|
|
41
|
+
unit && /* @__PURE__ */ jsx("span", {
|
|
42
|
+
className: "font-mono text-[11px] leading-none text-quaternary-foreground mb-0.5",
|
|
43
|
+
children: unit
|
|
44
|
+
}),
|
|
45
|
+
delta && /* @__PURE__ */ jsxs(DeltaPill, {
|
|
46
|
+
sentiment,
|
|
47
|
+
className: "mb-0.5",
|
|
48
|
+
children: [delta.direction === "up" ? /* @__PURE__ */ jsx(ArrowUp, { className: "size-3" }) : /* @__PURE__ */ jsx(ArrowDown, { className: "size-3" }), delta.label ?? `${delta.value}%`]
|
|
49
|
+
})
|
|
50
|
+
]
|
|
51
|
+
}), sparkData.length > 0 && /* @__PURE__ */ jsx("div", {
|
|
52
|
+
className: "h-9 w-full",
|
|
53
|
+
children: /* @__PURE__ */ jsx(ResponsiveContainer, {
|
|
54
|
+
width: "100%",
|
|
55
|
+
height: "100%",
|
|
56
|
+
children: /* @__PURE__ */ jsxs(AreaChart, {
|
|
57
|
+
data: sparkData,
|
|
58
|
+
margin: {
|
|
59
|
+
top: 4,
|
|
60
|
+
right: 2,
|
|
61
|
+
bottom: 0,
|
|
62
|
+
left: 2
|
|
63
|
+
},
|
|
64
|
+
children: [/* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("linearGradient", {
|
|
65
|
+
id: gradientId,
|
|
66
|
+
x1: "0",
|
|
67
|
+
y1: "0",
|
|
68
|
+
x2: "0",
|
|
69
|
+
y2: "1",
|
|
70
|
+
children: [/* @__PURE__ */ jsx("stop", {
|
|
71
|
+
offset: "0%",
|
|
72
|
+
stopColor: sparkColor,
|
|
73
|
+
stopOpacity: .4
|
|
74
|
+
}), /* @__PURE__ */ jsx("stop", {
|
|
75
|
+
offset: "100%",
|
|
76
|
+
stopColor: sparkColor,
|
|
77
|
+
stopOpacity: 0
|
|
78
|
+
})]
|
|
79
|
+
}) }), /* @__PURE__ */ jsx(Area, {
|
|
80
|
+
type: "monotone",
|
|
81
|
+
dataKey: "value",
|
|
82
|
+
stroke: sparkColor,
|
|
83
|
+
strokeWidth: 1.6,
|
|
84
|
+
fill: `url(#${gradientId})`,
|
|
85
|
+
isAnimationActive: false,
|
|
86
|
+
dot: ({ cx, cy, index }) => {
|
|
87
|
+
return index === sparkData.length - 1 && cx != null && cy != null ? /* @__PURE__ */ jsx("circle", {
|
|
88
|
+
cx,
|
|
89
|
+
cy,
|
|
90
|
+
r: 2.5,
|
|
91
|
+
fill: sparkColor
|
|
92
|
+
}, index) : /* @__PURE__ */ jsx("g", {}, index);
|
|
93
|
+
}
|
|
94
|
+
})]
|
|
95
|
+
})
|
|
96
|
+
})
|
|
97
|
+
})]
|
|
98
|
+
});
|
|
99
|
+
}
|
|
100
|
+
function DeltaPill({ sentiment, className, ...props }) {
|
|
101
|
+
return /* @__PURE__ */ jsx("span", {
|
|
102
|
+
className: cn(statDeltaVariants({ sentiment }), className),
|
|
103
|
+
...props
|
|
104
|
+
});
|
|
105
|
+
}
|
|
106
|
+
//#endregion
|
|
107
|
+
export { Stat, statDeltaVariants };
|
|
@@ -11,7 +11,7 @@ declare function StatusDot({
|
|
|
11
11
|
variant,
|
|
12
12
|
pulse,
|
|
13
13
|
...props
|
|
14
|
-
}: StatusDotProps): import("react
|
|
14
|
+
}: StatusDotProps): import("react").JSX.Element;
|
|
15
15
|
type StatusDotVariantProps = Required<Pick<VariantProps<typeof statusDotVariants>, "variant" | "pulse">>;
|
|
16
16
|
//#endregion
|
|
17
17
|
export { StatusDot, type StatusDotVariantProps, statusDotVariants };
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import * as React from "react";
|
|
1
|
+
import * as React$1 from "react";
|
|
2
2
|
import * as SwitchPrimitive from "@radix-ui/react-switch";
|
|
3
3
|
|
|
4
4
|
//#region src/components/switch.d.ts
|
|
5
5
|
declare function Switch({
|
|
6
6
|
className,
|
|
7
7
|
...props
|
|
8
|
-
}: React.ComponentProps<typeof SwitchPrimitive.Root>):
|
|
8
|
+
}: React$1.ComponentProps<typeof SwitchPrimitive.Root>): React$1.JSX.Element;
|
|
9
9
|
//#endregion
|
|
10
10
|
export { Switch };
|
|
@@ -1,31 +1,31 @@
|
|
|
1
|
-
import * as React from "react";
|
|
1
|
+
import * as React$1 from "react";
|
|
2
2
|
|
|
3
3
|
//#region src/components/table.d.ts
|
|
4
4
|
declare function Table({
|
|
5
5
|
className,
|
|
6
6
|
...props
|
|
7
|
-
}: React.ComponentProps<"table">):
|
|
7
|
+
}: React$1.ComponentProps<"table">): React$1.JSX.Element;
|
|
8
8
|
declare function TableHeader({
|
|
9
9
|
className,
|
|
10
10
|
...props
|
|
11
|
-
}: React.ComponentProps<"thead">):
|
|
11
|
+
}: React$1.ComponentProps<"thead">): React$1.JSX.Element;
|
|
12
12
|
declare function TableBody({
|
|
13
13
|
className,
|
|
14
14
|
...props
|
|
15
|
-
}: React.ComponentProps<"tbody">):
|
|
15
|
+
}: React$1.ComponentProps<"tbody">): React$1.JSX.Element;
|
|
16
16
|
declare function TableFooter({
|
|
17
17
|
className,
|
|
18
18
|
...props
|
|
19
|
-
}: React.ComponentProps<"tfoot">):
|
|
19
|
+
}: React$1.ComponentProps<"tfoot">): React$1.JSX.Element;
|
|
20
20
|
declare function TableRow({
|
|
21
21
|
className,
|
|
22
22
|
...props
|
|
23
|
-
}: React.ComponentProps<"tr">):
|
|
23
|
+
}: React$1.ComponentProps<"tr">): React$1.JSX.Element;
|
|
24
24
|
declare function TableHead({
|
|
25
25
|
className,
|
|
26
26
|
...props
|
|
27
|
-
}: React.ComponentProps<"th">):
|
|
28
|
-
interface TableCellProps extends React.ComponentProps<"td"> {
|
|
27
|
+
}: React$1.ComponentProps<"th">): React$1.JSX.Element;
|
|
28
|
+
interface TableCellProps extends React$1.ComponentProps<"td"> {
|
|
29
29
|
/**
|
|
30
30
|
* When true, the cell renders edge-to-edge so the child can act as the
|
|
31
31
|
* interactive surface (e.g. a button or popover trigger filling the cell).
|
|
@@ -37,10 +37,10 @@ declare function TableCell({
|
|
|
37
37
|
className,
|
|
38
38
|
interactive,
|
|
39
39
|
...props
|
|
40
|
-
}: TableCellProps):
|
|
40
|
+
}: TableCellProps): React$1.JSX.Element;
|
|
41
41
|
declare function TableCaption({
|
|
42
42
|
className,
|
|
43
43
|
...props
|
|
44
|
-
}: React.ComponentProps<"caption">):
|
|
44
|
+
}: React$1.ComponentProps<"caption">): React$1.JSX.Element;
|
|
45
45
|
//#endregion
|
|
46
46
|
export { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { VariantProps } from "class-variance-authority";
|
|
2
|
-
import * as React from "react";
|
|
2
|
+
import * as React$1 from "react";
|
|
3
3
|
import * as TabsPrimitive from "@radix-ui/react-tabs";
|
|
4
4
|
|
|
5
5
|
//#region src/components/tabs.d.ts
|
|
@@ -10,7 +10,7 @@ declare function Tabs({
|
|
|
10
10
|
className,
|
|
11
11
|
orientation,
|
|
12
12
|
...props
|
|
13
|
-
}: React.ComponentProps<typeof TabsPrimitive.Root>):
|
|
13
|
+
}: React$1.ComponentProps<typeof TabsPrimitive.Root>): React$1.JSX.Element;
|
|
14
14
|
declare const tabsListVariants: (props?: ({
|
|
15
15
|
variant?: "default" | "line" | null | undefined;
|
|
16
16
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -18,15 +18,15 @@ declare function TabsList({
|
|
|
18
18
|
className,
|
|
19
19
|
variant,
|
|
20
20
|
...props
|
|
21
|
-
}: React.ComponentProps<typeof TabsPrimitive.List> & VariantProps<typeof tabsListVariants>):
|
|
21
|
+
}: React$1.ComponentProps<typeof TabsPrimitive.List> & VariantProps<typeof tabsListVariants>): React$1.JSX.Element;
|
|
22
22
|
declare function TabsTrigger({
|
|
23
23
|
className,
|
|
24
24
|
...props
|
|
25
|
-
}: React.ComponentProps<typeof TabsPrimitive.Trigger>):
|
|
25
|
+
}: React$1.ComponentProps<typeof TabsPrimitive.Trigger>): React$1.JSX.Element;
|
|
26
26
|
declare function TabsContent({
|
|
27
27
|
className,
|
|
28
28
|
...props
|
|
29
|
-
}: React.ComponentProps<typeof TabsPrimitive.Content>):
|
|
29
|
+
}: React$1.ComponentProps<typeof TabsPrimitive.Content>): React$1.JSX.Element;
|
|
30
30
|
type TabsNavVariant = "line" | "pill";
|
|
31
31
|
type TabsNavOrientation = "horizontal" | "vertical";
|
|
32
32
|
declare function TabsNav({
|
|
@@ -34,23 +34,23 @@ declare function TabsNav({
|
|
|
34
34
|
variant,
|
|
35
35
|
className,
|
|
36
36
|
...props
|
|
37
|
-
}: React.ComponentProps<"nav"> & {
|
|
37
|
+
}: React$1.ComponentProps<"nav"> & {
|
|
38
38
|
orientation?: TabsNavOrientation;
|
|
39
39
|
variant?: TabsNavVariant;
|
|
40
|
-
}):
|
|
40
|
+
}): React$1.JSX.Element;
|
|
41
41
|
declare function TabsNavList({
|
|
42
42
|
className,
|
|
43
43
|
...props
|
|
44
|
-
}: React.ComponentProps<"ul">):
|
|
44
|
+
}: React$1.ComponentProps<"ul">): React$1.JSX.Element;
|
|
45
45
|
declare function TabsNavTrigger({
|
|
46
46
|
className,
|
|
47
47
|
active,
|
|
48
48
|
asChild,
|
|
49
49
|
children,
|
|
50
50
|
...props
|
|
51
|
-
}: React.ComponentProps<"a"> & {
|
|
51
|
+
}: React$1.ComponentProps<"a"> & {
|
|
52
52
|
active?: boolean;
|
|
53
53
|
asChild?: boolean;
|
|
54
|
-
}):
|
|
54
|
+
}): React$1.JSX.Element;
|
|
55
55
|
//#endregion
|
|
56
56
|
export { Tabs, TabsContent, TabsList, TabsNav, TabsNavList, TabsNavTrigger, TabsTrigger, tabsListVariants, tabsTriggerVariants };
|
|
@@ -8,7 +8,7 @@ declare function Tag({
|
|
|
8
8
|
icon,
|
|
9
9
|
children,
|
|
10
10
|
...props
|
|
11
|
-
}: TagProps): import("react
|
|
11
|
+
}: TagProps): import("react").JSX.Element;
|
|
12
12
|
interface TagDismissibleProps extends React.ComponentProps<"span">, TagBaseProps {
|
|
13
13
|
onDismiss?: () => void;
|
|
14
14
|
}
|
|
@@ -18,7 +18,7 @@ declare function TagDismissible({
|
|
|
18
18
|
children,
|
|
19
19
|
onDismiss,
|
|
20
20
|
...props
|
|
21
|
-
}: TagDismissibleProps): import("react
|
|
21
|
+
}: TagDismissibleProps): import("react").JSX.Element;
|
|
22
22
|
interface TagCountProps extends React.ComponentProps<"span">, TagBaseProps {
|
|
23
23
|
count: number;
|
|
24
24
|
}
|
|
@@ -28,6 +28,6 @@ declare function TagCount({
|
|
|
28
28
|
children,
|
|
29
29
|
count,
|
|
30
30
|
...props
|
|
31
|
-
}: TagCountProps): import("react
|
|
31
|
+
}: TagCountProps): import("react").JSX.Element;
|
|
32
32
|
//#endregion
|
|
33
33
|
export { Tag, TagCount, TagDismissible };
|
|
@@ -20,6 +20,6 @@ declare function TaskProgress({
|
|
|
20
20
|
stepRevealDelayMs,
|
|
21
21
|
className,
|
|
22
22
|
...props
|
|
23
|
-
}: TaskProgressProps): import("react
|
|
23
|
+
}: TaskProgressProps): import("react").JSX.Element;
|
|
24
24
|
//#endregion
|
|
25
25
|
export { TaskProgress, type TaskProgressStatus, type TaskProgressStep };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import * as React from "react";
|
|
1
|
+
import * as React$1 from "react";
|
|
2
2
|
|
|
3
3
|
//#region src/components/textarea.d.ts
|
|
4
|
-
interface TextareaProps extends React.ComponentProps<"textarea"> {
|
|
4
|
+
interface TextareaProps extends React$1.ComponentProps<"textarea"> {
|
|
5
5
|
label?: string;
|
|
6
6
|
required?: boolean;
|
|
7
7
|
hint?: string;
|
|
@@ -17,6 +17,6 @@ declare function Textarea({
|
|
|
17
17
|
error,
|
|
18
18
|
tooltip,
|
|
19
19
|
...props
|
|
20
|
-
}: TextareaProps):
|
|
20
|
+
}: TextareaProps): React$1.JSX.Element;
|
|
21
21
|
//#endregion
|
|
22
22
|
export { Textarea, type TextareaProps };
|
|
@@ -4,10 +4,10 @@ import { Tooltip, TooltipContent, TooltipTrigger } from "./tooltip.mjs";
|
|
|
4
4
|
import { Label } from "./label.mjs";
|
|
5
5
|
import { Info } from "lucide-react";
|
|
6
6
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
7
|
-
import * as React from "react";
|
|
7
|
+
import * as React$1 from "react";
|
|
8
8
|
//#region src/components/textarea.tsx
|
|
9
9
|
function Textarea({ className, id, label, required, hint, error, tooltip, ...props }) {
|
|
10
|
-
const generatedId = React.useId();
|
|
10
|
+
const generatedId = React$1.useId();
|
|
11
11
|
const fieldId = id ?? generatedId;
|
|
12
12
|
const textarea = /* @__PURE__ */ jsx("textarea", {
|
|
13
13
|
id: fieldId,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { VariantProps } from "class-variance-authority";
|
|
2
|
-
import * as React from "react";
|
|
2
|
+
import * as React$1 from "react";
|
|
3
3
|
import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group";
|
|
4
4
|
|
|
5
5
|
//#region src/components/toggle-group.d.ts
|
|
@@ -14,13 +14,13 @@ declare function ToggleGroup({
|
|
|
14
14
|
size,
|
|
15
15
|
children,
|
|
16
16
|
...props
|
|
17
|
-
}: React.ComponentProps<typeof ToggleGroupPrimitive.Root> & ToggleGroupContextValue):
|
|
17
|
+
}: React$1.ComponentProps<typeof ToggleGroupPrimitive.Root> & ToggleGroupContextValue): React$1.JSX.Element;
|
|
18
18
|
declare function ToggleGroupItem({
|
|
19
19
|
className,
|
|
20
20
|
children,
|
|
21
21
|
variant,
|
|
22
22
|
size,
|
|
23
23
|
...props
|
|
24
|
-
}: React.ComponentProps<typeof ToggleGroupPrimitive.Item> & VariantProps<typeof toggleGroupItemVariants>):
|
|
24
|
+
}: React$1.ComponentProps<typeof ToggleGroupPrimitive.Item> & VariantProps<typeof toggleGroupItemVariants>): React$1.JSX.Element;
|
|
25
25
|
//#endregion
|
|
26
26
|
export { ToggleGroup, ToggleGroupItem, toggleGroupItemVariants };
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
import { cn } from "../lib/cn.mjs";
|
|
3
3
|
import { jsx } from "react/jsx-runtime";
|
|
4
4
|
import { cva } from "class-variance-authority";
|
|
5
|
-
import * as React from "react";
|
|
5
|
+
import * as React$1 from "react";
|
|
6
6
|
import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group";
|
|
7
7
|
//#region src/components/toggle-group.tsx
|
|
8
8
|
const toggleGroupItemVariants = cva([
|
|
@@ -36,7 +36,7 @@ const toggleGroupItemVariants = cva([
|
|
|
36
36
|
size: "default"
|
|
37
37
|
}
|
|
38
38
|
});
|
|
39
|
-
const ToggleGroupContext = React.createContext({
|
|
39
|
+
const ToggleGroupContext = React$1.createContext({
|
|
40
40
|
size: "default",
|
|
41
41
|
variant: "default"
|
|
42
42
|
});
|
|
@@ -55,7 +55,7 @@ function ToggleGroup({ className, variant, size, children, ...props }) {
|
|
|
55
55
|
});
|
|
56
56
|
}
|
|
57
57
|
function ToggleGroupItem({ className, children, variant, size, ...props }) {
|
|
58
|
-
const context = React.useContext(ToggleGroupContext);
|
|
58
|
+
const context = React$1.useContext(ToggleGroupContext);
|
|
59
59
|
const resolvedVariant = context.variant ?? variant;
|
|
60
60
|
const resolvedSize = context.size ?? size;
|
|
61
61
|
return /* @__PURE__ */ jsx(ToggleGroupPrimitive.Item, {
|
|
@@ -1,22 +1,22 @@
|
|
|
1
|
-
import * as React from "react";
|
|
1
|
+
import * as React$1 from "react";
|
|
2
2
|
import * as TooltipPrimitive from "@radix-ui/react-tooltip";
|
|
3
3
|
|
|
4
4
|
//#region src/components/tooltip.d.ts
|
|
5
5
|
declare function TooltipProvider({
|
|
6
6
|
delayDuration,
|
|
7
7
|
...props
|
|
8
|
-
}: React.ComponentProps<typeof TooltipPrimitive.Provider>):
|
|
8
|
+
}: React$1.ComponentProps<typeof TooltipPrimitive.Provider>): React$1.JSX.Element;
|
|
9
9
|
declare function Tooltip({
|
|
10
10
|
...props
|
|
11
|
-
}: React.ComponentProps<typeof TooltipPrimitive.Root>):
|
|
11
|
+
}: React$1.ComponentProps<typeof TooltipPrimitive.Root>): React$1.JSX.Element;
|
|
12
12
|
declare function TooltipTrigger({
|
|
13
13
|
...props
|
|
14
|
-
}: React.ComponentProps<typeof TooltipPrimitive.Trigger>):
|
|
14
|
+
}: React$1.ComponentProps<typeof TooltipPrimitive.Trigger>): React$1.JSX.Element;
|
|
15
15
|
declare function TooltipContent({
|
|
16
16
|
className,
|
|
17
17
|
sideOffset,
|
|
18
18
|
children,
|
|
19
19
|
...props
|
|
20
|
-
}: React.ComponentProps<typeof TooltipPrimitive.Content>):
|
|
20
|
+
}: React$1.ComponentProps<typeof TooltipPrimitive.Content>): React$1.JSX.Element;
|
|
21
21
|
//#endregion
|
|
22
22
|
export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger };
|
|
@@ -7,27 +7,27 @@ declare function H1({
|
|
|
7
7
|
}: {
|
|
8
8
|
children: ReactNode;
|
|
9
9
|
className?: string;
|
|
10
|
-
}): import("react
|
|
10
|
+
}): import("react").JSX.Element;
|
|
11
11
|
declare function H2({
|
|
12
12
|
children,
|
|
13
13
|
className
|
|
14
14
|
}: {
|
|
15
15
|
children: ReactNode;
|
|
16
16
|
className?: string;
|
|
17
|
-
}): import("react
|
|
17
|
+
}): import("react").JSX.Element;
|
|
18
18
|
declare function H3({
|
|
19
19
|
children,
|
|
20
20
|
className
|
|
21
21
|
}: {
|
|
22
22
|
children: ReactNode;
|
|
23
23
|
className?: string;
|
|
24
|
-
}): import("react
|
|
24
|
+
}): import("react").JSX.Element;
|
|
25
25
|
declare function H4({
|
|
26
26
|
children,
|
|
27
27
|
className
|
|
28
28
|
}: {
|
|
29
29
|
children: ReactNode;
|
|
30
30
|
className?: string;
|
|
31
|
-
}): import("react
|
|
31
|
+
}): import("react").JSX.Element;
|
|
32
32
|
//#endregion
|
|
33
33
|
export { H1, H2, H3, H4 };
|
|
@@ -1,25 +1,7 @@
|
|
|
1
|
-
import * as React from "react";
|
|
1
|
+
import * as React$1 from "react";
|
|
2
2
|
|
|
3
3
|
//#region src/components/wizard.d.ts
|
|
4
|
-
interface
|
|
5
|
-
id: string;
|
|
6
|
-
label: string;
|
|
7
|
-
}
|
|
8
|
-
interface WizardStepsProps {
|
|
9
|
-
steps: readonly WizardStep[];
|
|
10
|
-
activeIdx: number;
|
|
11
|
-
onSelect: (idx: number) => void;
|
|
12
|
-
ariaLabel?: string;
|
|
13
|
-
className?: string;
|
|
14
|
-
}
|
|
15
|
-
declare function WizardSteps({
|
|
16
|
-
steps,
|
|
17
|
-
activeIdx,
|
|
18
|
-
onSelect,
|
|
19
|
-
ariaLabel,
|
|
20
|
-
className
|
|
21
|
-
}: WizardStepsProps): import("react/jsx-runtime").JSX.Element;
|
|
22
|
-
interface WizardProgressProps extends React.ComponentProps<"div"> {
|
|
4
|
+
interface WizardProgressProps extends React$1.ComponentProps<"div"> {
|
|
23
5
|
current: number;
|
|
24
6
|
total: number;
|
|
25
7
|
}
|
|
@@ -28,6 +10,6 @@ declare function WizardProgress({
|
|
|
28
10
|
total,
|
|
29
11
|
className,
|
|
30
12
|
...props
|
|
31
|
-
}: WizardProgressProps):
|
|
13
|
+
}: WizardProgressProps): React$1.JSX.Element;
|
|
32
14
|
//#endregion
|
|
33
|
-
export { WizardProgress
|
|
15
|
+
export { WizardProgress };
|
|
@@ -1,25 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { cn } from "../lib/cn.mjs";
|
|
3
|
-
import { TabsNav, TabsNavList, TabsNavTrigger } from "./tabs.mjs";
|
|
4
3
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
5
4
|
//#region src/components/wizard.tsx
|
|
6
|
-
function WizardSteps({ steps, activeIdx, onSelect, ariaLabel = "Wizard steps", className }) {
|
|
7
|
-
return /* @__PURE__ */ jsx(TabsNav, {
|
|
8
|
-
orientation: "vertical",
|
|
9
|
-
"aria-label": ariaLabel,
|
|
10
|
-
className,
|
|
11
|
-
children: /* @__PURE__ */ jsx(TabsNavList, { children: steps.map((step, idx) => /* @__PURE__ */ jsx(TabsNavTrigger, {
|
|
12
|
-
active: idx === activeIdx,
|
|
13
|
-
asChild: true,
|
|
14
|
-
children: /* @__PURE__ */ jsx("button", {
|
|
15
|
-
type: "button",
|
|
16
|
-
onClick: () => onSelect(idx),
|
|
17
|
-
className: "w-full justify-start text-left",
|
|
18
|
-
children: step.label
|
|
19
|
-
})
|
|
20
|
-
}, step.id)) })
|
|
21
|
-
});
|
|
22
|
-
}
|
|
23
5
|
function WizardProgress({ current, total, className, ...props }) {
|
|
24
6
|
const percent = total > 0 ? Math.round(current / total * 100) : 0;
|
|
25
7
|
return /* @__PURE__ */ jsxs("div", {
|
|
@@ -43,4 +25,4 @@ function WizardProgress({ current, total, className, ...props }) {
|
|
|
43
25
|
});
|
|
44
26
|
}
|
|
45
27
|
//#endregion
|
|
46
|
-
export { WizardProgress
|
|
28
|
+
export { WizardProgress };
|