@alpic-ai/ui 0.0.0-staging.gcd4957c → 0.0.0-staging.gcd7c19c
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 +6 -28
- package/dist/components/accordion.d.mts +5 -20
- package/dist/components/alert.d.mts +9 -30
- package/dist/components/area-chart.d.mts +43 -0
- package/dist/components/area-chart.mjs +182 -0
- package/dist/components/attachment-tile.d.mts +1 -10
- package/dist/components/avatar.d.mts +8 -33
- package/dist/components/badge.d.mts +2 -11
- package/dist/components/bar-chart.d.mts +34 -0
- package/dist/components/bar-chart.mjs +238 -0
- package/dist/components/bar-list.d.mts +19 -0
- package/dist/components/bar-list.mjs +104 -0
- package/dist/components/breadcrumb.d.mts +10 -38
- package/dist/components/button.d.mts +6 -21
- package/dist/components/card.d.mts +9 -33
- package/dist/components/chart-card.d.mts +14 -0
- package/dist/components/chart-card.mjs +48 -0
- package/dist/components/chart-container.d.mts +15 -0
- package/dist/components/chart-container.mjs +37 -0
- package/dist/components/chart-legend.d.mts +14 -0
- package/dist/components/chart-legend.mjs +35 -0
- package/dist/components/chart-primitives.d.mts +69 -0
- package/dist/components/chart-primitives.mjs +134 -0
- package/dist/components/chart-tooltip.d.mts +23 -0
- package/dist/components/chart-tooltip.mjs +79 -0
- package/dist/components/checkbox.d.mts +2 -7
- package/dist/components/collapsible.d.mts +4 -12
- package/dist/components/combobox.d.mts +10 -47
- package/dist/components/command.d.mts +9 -34
- package/dist/components/copyable.d.mts +2 -10
- package/dist/components/description-list.d.mts +5 -19
- package/dist/components/dialog.d.mts +15 -49
- package/dist/components/donut-chart.d.mts +31 -0
- package/dist/components/donut-chart.mjs +187 -0
- package/dist/components/dropdown-menu.d.mts +18 -62
- package/dist/components/field.d.mts +14 -0
- package/dist/components/field.mjs +41 -0
- package/dist/components/form.d.mts +19 -102
- package/dist/components/form.mjs +9 -7
- package/dist/components/github-button.d.mts +1 -7
- package/dist/components/heatmap-chart.d.mts +32 -0
- package/dist/components/heatmap-chart.mjs +259 -0
- package/dist/components/input-group.d.mts +5 -19
- package/dist/components/input.d.mts +4 -18
- package/dist/components/input.mjs +27 -51
- package/dist/components/label.d.mts +2 -7
- package/dist/components/line-chart.d.mts +37 -0
- package/dist/components/line-chart.mjs +132 -0
- package/dist/components/page-loader.d.mts +1 -5
- package/dist/components/pagination.d.mts +3 -11
- package/dist/components/popover.d.mts +5 -18
- package/dist/components/radio-group.d.mts +3 -11
- package/dist/components/scroll-area.d.mts +3 -13
- package/dist/components/select-trigger-variants.d.mts +1 -3
- package/dist/components/select.d.mts +9 -37
- package/dist/components/separator.d.mts +2 -9
- package/dist/components/sheet.d.mts +11 -38
- package/dist/components/shimmer-text.d.mts +3 -7
- package/dist/components/sidebar.d.mts +34 -127
- package/dist/components/sidebar.mjs +11 -11
- package/dist/components/skeleton.d.mts +2 -9
- package/dist/components/skeleton.mjs +1 -1
- package/dist/components/sonner.d.mts +5 -13
- package/dist/components/spinner.d.mts +3 -17
- package/dist/components/stat.d.mts +28 -0
- package/dist/components/stat.mjs +124 -0
- package/dist/components/status-dot.d.mts +2 -10
- package/dist/components/switch.d.mts +2 -7
- package/dist/components/table.d.mts +13 -37
- package/dist/components/table.mjs +2 -2
- package/dist/components/tabs.d.mts +12 -43
- package/dist/components/tag.d.mts +3 -22
- package/dist/components/task-progress.d.mts +1 -9
- package/dist/components/textarea.d.mts +3 -14
- package/dist/components/textarea.mjs +19 -43
- package/dist/components/toggle-group.d.mts +4 -19
- package/dist/components/toggle-group.mjs +3 -3
- package/dist/components/tooltip-icon-button.d.mts +1 -3
- package/dist/components/tooltip.d.mts +5 -19
- package/dist/components/typography.d.mts +8 -22
- package/dist/components/wizard.d.mts +4 -29
- 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-copy-to-clipboard.d.mts +1 -3
- package/dist/hooks/use-mobile.mjs +3 -3
- package/dist/lib/chart-palette.d.mts +38 -0
- package/dist/lib/chart-palette.mjs +116 -0
- package/dist/lib/chart.d.mts +19 -0
- package/dist/lib/chart.mjs +42 -0
- package/dist/lib/cn.d.mts +0 -1
- package/package.json +35 -30
- package/src/components/area-chart.tsx +228 -0
- package/src/components/bar-chart.tsx +297 -0
- package/src/components/bar-list.tsx +158 -0
- package/src/components/chart-card.tsx +65 -0
- package/src/components/chart-container.tsx +51 -0
- package/src/components/chart-legend.tsx +49 -0
- package/src/components/chart-primitives.tsx +188 -0
- package/src/components/chart-tooltip.tsx +109 -0
- package/src/components/donut-chart.tsx +214 -0
- package/src/components/field.tsx +57 -0
- package/src/components/form.tsx +4 -2
- package/src/components/heatmap-chart.tsx +375 -0
- package/src/components/input.tsx +3 -33
- package/src/components/line-chart.tsx +167 -0
- package/src/components/skeleton.tsx +1 -1
- package/src/components/stat.tsx +141 -0
- package/src/components/table.tsx +11 -2
- package/src/components/textarea.tsx +4 -34
- package/src/components/wizard.tsx +1 -35
- package/src/hooks/use-chart-theme.ts +75 -0
- package/src/lib/chart-palette.ts +113 -0
- package/src/lib/chart.ts +90 -0
- package/src/stories/area-chart.stories.tsx +200 -0
- package/src/stories/bar-chart.stories.tsx +169 -0
- package/src/stories/bar-list.stories.tsx +83 -0
- package/src/stories/donut-chart.stories.tsx +112 -0
- package/src/stories/heatmap-chart.stories.tsx +105 -0
- package/src/stories/line-chart.stories.tsx +146 -0
- package/src/stories/stat.stories.tsx +66 -0
- package/src/stories/textarea.stories.tsx +7 -0
- package/src/stories/wizard.stories.tsx +23 -5
- package/src/styles/tokens.css +18 -0
|
@@ -0,0 +1,124 @@
|
|
|
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 { Fragment, 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-2 py-1 font-mono text-xs 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
|
+
const SEMANTIC_KEY = {
|
|
25
|
+
error: "destructive",
|
|
26
|
+
warning: "warning",
|
|
27
|
+
success: "success"
|
|
28
|
+
};
|
|
29
|
+
function Stat({ value, unit, delta, sparkline, semantic, compact = false, className, ...props }) {
|
|
30
|
+
const sentiment = delta && (delta.invert ? delta.direction === "down" : delta.direction === "up") ? "positive" : "negative";
|
|
31
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
32
|
+
"data-slot": "stat",
|
|
33
|
+
className: cn("flex min-w-0 flex-col gap-2.5", className),
|
|
34
|
+
...props,
|
|
35
|
+
children: [/* @__PURE__ */ jsxs("div", {
|
|
36
|
+
className: cn("flex min-w-0 items-baseline gap-x-2.5", compact && "gap-x-1.5"),
|
|
37
|
+
children: [
|
|
38
|
+
/* @__PURE__ */ jsx("span", {
|
|
39
|
+
className: cn("min-w-0 font-bold leading-none tracking-tight tabular-nums text-foreground", compact ? "type-display-xs whitespace-nowrap" : "type-display-sm truncate"),
|
|
40
|
+
children: value
|
|
41
|
+
}),
|
|
42
|
+
unit && /* @__PURE__ */ jsx("span", {
|
|
43
|
+
className: "font-mono text-[11px] leading-none text-quaternary-foreground mb-0.5",
|
|
44
|
+
children: unit
|
|
45
|
+
}),
|
|
46
|
+
delta && /* @__PURE__ */ jsx(DeltaPill, {
|
|
47
|
+
sentiment,
|
|
48
|
+
className: cn("mb-0.5 shrink-0", compact && "px-1.5"),
|
|
49
|
+
children: delta.indicator === "sign" ? /* @__PURE__ */ jsxs(Fragment, { children: [delta.direction === "up" ? "+" : "-", delta.label ?? `${delta.value}%`] }) : /* @__PURE__ */ jsxs(Fragment, { children: [delta.direction === "up" ? /* @__PURE__ */ jsx(ArrowUp, { className: "size-3.5" }) : /* @__PURE__ */ jsx(ArrowDown, { className: "size-3.5" }), delta.label ?? `${delta.value}%`] })
|
|
50
|
+
})
|
|
51
|
+
]
|
|
52
|
+
}), /* @__PURE__ */ jsx(StatSparkline, {
|
|
53
|
+
sparkline,
|
|
54
|
+
semantic
|
|
55
|
+
})]
|
|
56
|
+
});
|
|
57
|
+
}
|
|
58
|
+
function StatSparkline({ sparkline, semantic, className }) {
|
|
59
|
+
const { palette, theme } = useChartContext();
|
|
60
|
+
const gradientId = React$1.useId().replace(/:/g, "");
|
|
61
|
+
const sparkData = React$1.useMemo(() => toSparkData(sparkline), [sparkline]);
|
|
62
|
+
const hasSpark = sparkData.some((point) => point.value > 0);
|
|
63
|
+
const sparkColor = semantic ? theme[SEMANTIC_KEY[semantic]] : palette[0];
|
|
64
|
+
if (!hasSpark) return null;
|
|
65
|
+
return /* @__PURE__ */ jsx("div", {
|
|
66
|
+
className: cn("pointer-events-none h-9 w-full", className),
|
|
67
|
+
children: /* @__PURE__ */ jsx(ResponsiveContainer, {
|
|
68
|
+
width: "100%",
|
|
69
|
+
height: "100%",
|
|
70
|
+
initialDimension: {
|
|
71
|
+
width: 0,
|
|
72
|
+
height: 36
|
|
73
|
+
},
|
|
74
|
+
children: /* @__PURE__ */ jsxs(AreaChart, {
|
|
75
|
+
data: sparkData,
|
|
76
|
+
margin: {
|
|
77
|
+
top: 4,
|
|
78
|
+
right: 2,
|
|
79
|
+
bottom: 0,
|
|
80
|
+
left: 2
|
|
81
|
+
},
|
|
82
|
+
children: [/* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsxs("linearGradient", {
|
|
83
|
+
id: gradientId,
|
|
84
|
+
x1: "0",
|
|
85
|
+
y1: "0",
|
|
86
|
+
x2: "0",
|
|
87
|
+
y2: "1",
|
|
88
|
+
children: [/* @__PURE__ */ jsx("stop", {
|
|
89
|
+
offset: "0%",
|
|
90
|
+
stopColor: sparkColor,
|
|
91
|
+
stopOpacity: .4
|
|
92
|
+
}), /* @__PURE__ */ jsx("stop", {
|
|
93
|
+
offset: "100%",
|
|
94
|
+
stopColor: sparkColor,
|
|
95
|
+
stopOpacity: 0
|
|
96
|
+
})]
|
|
97
|
+
}) }), /* @__PURE__ */ jsx(Area, {
|
|
98
|
+
type: "monotone",
|
|
99
|
+
dataKey: "value",
|
|
100
|
+
stroke: sparkColor,
|
|
101
|
+
strokeWidth: 1.6,
|
|
102
|
+
fill: `url(#${gradientId})`,
|
|
103
|
+
isAnimationActive: false,
|
|
104
|
+
dot: ({ cx, cy, index }) => {
|
|
105
|
+
return index === sparkData.length - 1 && cx != null && cy != null ? /* @__PURE__ */ jsx("circle", {
|
|
106
|
+
cx,
|
|
107
|
+
cy,
|
|
108
|
+
r: 2.5,
|
|
109
|
+
fill: sparkColor
|
|
110
|
+
}, index) : /* @__PURE__ */ jsx("g", {}, index);
|
|
111
|
+
}
|
|
112
|
+
})]
|
|
113
|
+
})
|
|
114
|
+
})
|
|
115
|
+
});
|
|
116
|
+
}
|
|
117
|
+
function DeltaPill({ sentiment, className, ...props }) {
|
|
118
|
+
return /* @__PURE__ */ jsx("span", {
|
|
119
|
+
className: cn(statDeltaVariants({ sentiment }), className),
|
|
120
|
+
...props
|
|
121
|
+
});
|
|
122
|
+
}
|
|
123
|
+
//#endregion
|
|
124
|
+
export { Stat, StatSparkline, statDeltaVariants };
|
|
@@ -1,19 +1,11 @@
|
|
|
1
|
-
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
2
1
|
import { VariantProps } from "class-variance-authority";
|
|
3
|
-
import * as _$class_variance_authority_types0 from "class-variance-authority/types";
|
|
4
|
-
|
|
5
2
|
//#region src/components/status-dot.d.ts
|
|
6
3
|
declare const statusDotVariants: (props?: ({
|
|
7
4
|
variant?: "destructive" | "warning" | "success" | "muted" | null | undefined;
|
|
8
5
|
pulse?: boolean | null | undefined;
|
|
9
|
-
} &
|
|
6
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
10
7
|
interface StatusDotProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof statusDotVariants> {}
|
|
11
|
-
declare function StatusDot({
|
|
12
|
-
className,
|
|
13
|
-
variant,
|
|
14
|
-
pulse,
|
|
15
|
-
...props
|
|
16
|
-
}: StatusDotProps): _$react_jsx_runtime0.JSX.Element;
|
|
8
|
+
declare function StatusDot({ className, variant, pulse, ...props }: StatusDotProps): import("react").JSX.Element;
|
|
17
9
|
type StatusDotVariantProps = Required<Pick<VariantProps<typeof statusDotVariants>, "variant" | "pulse">>;
|
|
18
10
|
//#endregion
|
|
19
11
|
export { StatusDot, type StatusDotVariantProps, statusDotVariants };
|
|
@@ -1,11 +1,6 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import * as React from "react";
|
|
1
|
+
import * as React$1 from "react";
|
|
3
2
|
import * as SwitchPrimitive from "@radix-ui/react-switch";
|
|
4
|
-
|
|
5
3
|
//#region src/components/switch.d.ts
|
|
6
|
-
declare function Switch({
|
|
7
|
-
className,
|
|
8
|
-
...props
|
|
9
|
-
}: React.ComponentProps<typeof SwitchPrimitive.Root>): _$react_jsx_runtime0.JSX.Element;
|
|
4
|
+
declare function Switch({ className, ...props }: React$1.ComponentProps<typeof SwitchPrimitive.Root>): React$1.JSX.Element;
|
|
10
5
|
//#endregion
|
|
11
6
|
export { Switch };
|
|
@@ -1,32 +1,15 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import * as React from "react";
|
|
3
|
-
|
|
1
|
+
import * as React$1 from "react";
|
|
4
2
|
//#region src/components/table.d.ts
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
}:
|
|
9
|
-
declare function TableHeader({
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
}: React.ComponentProps<"
|
|
13
|
-
declare function
|
|
14
|
-
|
|
15
|
-
...props
|
|
16
|
-
}: React.ComponentProps<"tbody">): _$react_jsx_runtime0.JSX.Element;
|
|
17
|
-
declare function TableFooter({
|
|
18
|
-
className,
|
|
19
|
-
...props
|
|
20
|
-
}: React.ComponentProps<"tfoot">): _$react_jsx_runtime0.JSX.Element;
|
|
21
|
-
declare function TableRow({
|
|
22
|
-
className,
|
|
23
|
-
...props
|
|
24
|
-
}: React.ComponentProps<"tr">): _$react_jsx_runtime0.JSX.Element;
|
|
25
|
-
declare function TableHead({
|
|
26
|
-
className,
|
|
27
|
-
...props
|
|
28
|
-
}: React.ComponentProps<"th">): _$react_jsx_runtime0.JSX.Element;
|
|
29
|
-
interface TableCellProps extends React.ComponentProps<"td"> {
|
|
3
|
+
interface TableProps extends React$1.ComponentProps<"table"> {
|
|
4
|
+
containerClassName?: string;
|
|
5
|
+
}
|
|
6
|
+
declare function Table({ className, containerClassName, ...props }: TableProps): React$1.JSX.Element;
|
|
7
|
+
declare function TableHeader({ className, ...props }: React$1.ComponentProps<"thead">): React$1.JSX.Element;
|
|
8
|
+
declare function TableBody({ className, ...props }: React$1.ComponentProps<"tbody">): React$1.JSX.Element;
|
|
9
|
+
declare function TableFooter({ className, ...props }: React$1.ComponentProps<"tfoot">): React$1.JSX.Element;
|
|
10
|
+
declare function TableRow({ className, ...props }: React$1.ComponentProps<"tr">): React$1.JSX.Element;
|
|
11
|
+
declare function TableHead({ className, ...props }: React$1.ComponentProps<"th">): React$1.JSX.Element;
|
|
12
|
+
interface TableCellProps extends React$1.ComponentProps<"td"> {
|
|
30
13
|
/**
|
|
31
14
|
* When true, the cell renders edge-to-edge so the child can act as the
|
|
32
15
|
* interactive surface (e.g. a button or popover trigger filling the cell).
|
|
@@ -34,14 +17,7 @@ interface TableCellProps extends React.ComponentProps<"td"> {
|
|
|
34
17
|
*/
|
|
35
18
|
interactive?: boolean;
|
|
36
19
|
}
|
|
37
|
-
declare function TableCell({
|
|
38
|
-
|
|
39
|
-
interactive,
|
|
40
|
-
...props
|
|
41
|
-
}: TableCellProps): _$react_jsx_runtime0.JSX.Element;
|
|
42
|
-
declare function TableCaption({
|
|
43
|
-
className,
|
|
44
|
-
...props
|
|
45
|
-
}: React.ComponentProps<"caption">): _$react_jsx_runtime0.JSX.Element;
|
|
20
|
+
declare function TableCell({ className, interactive, ...props }: TableCellProps): React$1.JSX.Element;
|
|
21
|
+
declare function TableCaption({ className, ...props }: React$1.ComponentProps<"caption">): React$1.JSX.Element;
|
|
46
22
|
//#endregion
|
|
47
23
|
export { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow };
|
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
import { cn } from "../lib/cn.mjs";
|
|
3
3
|
import { jsx } from "react/jsx-runtime";
|
|
4
4
|
//#region src/components/table.tsx
|
|
5
|
-
function Table({ className, ...props }) {
|
|
5
|
+
function Table({ className, containerClassName, ...props }) {
|
|
6
6
|
return /* @__PURE__ */ jsx("div", {
|
|
7
|
-
className: "relative w-full overflow-auto rounded-xl border border-border-secondary bg-background",
|
|
7
|
+
className: cn("relative w-full overflow-auto rounded-xl border border-border-secondary bg-background", containerClassName),
|
|
8
8
|
children: /* @__PURE__ */ jsx("table", {
|
|
9
9
|
"data-slot": "table",
|
|
10
10
|
className: cn("w-full caption-bottom type-text-sm", className),
|
|
@@ -1,58 +1,27 @@
|
|
|
1
|
-
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
2
1
|
import { VariantProps } from "class-variance-authority";
|
|
3
|
-
import * as React from "react";
|
|
2
|
+
import * as React$1 from "react";
|
|
4
3
|
import * as TabsPrimitive from "@radix-ui/react-tabs";
|
|
5
|
-
import * as _$class_variance_authority_types0 from "class-variance-authority/types";
|
|
6
|
-
|
|
7
4
|
//#region src/components/tabs.d.ts
|
|
8
5
|
declare const tabsTriggerVariants: (props?: ({
|
|
9
6
|
variant?: "default" | "pill" | "line" | null | undefined;
|
|
10
|
-
} &
|
|
11
|
-
declare function Tabs({
|
|
12
|
-
className,
|
|
13
|
-
orientation,
|
|
14
|
-
...props
|
|
15
|
-
}: React.ComponentProps<typeof TabsPrimitive.Root>): _$react_jsx_runtime0.JSX.Element;
|
|
7
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
8
|
+
declare function Tabs({ className, orientation, ...props }: React$1.ComponentProps<typeof TabsPrimitive.Root>): React$1.JSX.Element;
|
|
16
9
|
declare const tabsListVariants: (props?: ({
|
|
17
10
|
variant?: "default" | "line" | null | undefined;
|
|
18
|
-
} &
|
|
19
|
-
declare function TabsList({
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
...props
|
|
23
|
-
}: React.ComponentProps<typeof TabsPrimitive.List> & VariantProps<typeof tabsListVariants>): _$react_jsx_runtime0.JSX.Element;
|
|
24
|
-
declare function TabsTrigger({
|
|
25
|
-
className,
|
|
26
|
-
...props
|
|
27
|
-
}: React.ComponentProps<typeof TabsPrimitive.Trigger>): _$react_jsx_runtime0.JSX.Element;
|
|
28
|
-
declare function TabsContent({
|
|
29
|
-
className,
|
|
30
|
-
...props
|
|
31
|
-
}: React.ComponentProps<typeof TabsPrimitive.Content>): _$react_jsx_runtime0.JSX.Element;
|
|
11
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
12
|
+
declare function TabsList({ className, variant, ...props }: React$1.ComponentProps<typeof TabsPrimitive.List> & VariantProps<typeof tabsListVariants>): React$1.JSX.Element;
|
|
13
|
+
declare function TabsTrigger({ className, ...props }: React$1.ComponentProps<typeof TabsPrimitive.Trigger>): React$1.JSX.Element;
|
|
14
|
+
declare function TabsContent({ className, ...props }: React$1.ComponentProps<typeof TabsPrimitive.Content>): React$1.JSX.Element;
|
|
32
15
|
type TabsNavVariant = "line" | "pill";
|
|
33
16
|
type TabsNavOrientation = "horizontal" | "vertical";
|
|
34
|
-
declare function TabsNav({
|
|
35
|
-
orientation,
|
|
36
|
-
variant,
|
|
37
|
-
className,
|
|
38
|
-
...props
|
|
39
|
-
}: React.ComponentProps<"nav"> & {
|
|
17
|
+
declare function TabsNav({ orientation, variant, className, ...props }: React$1.ComponentProps<"nav"> & {
|
|
40
18
|
orientation?: TabsNavOrientation;
|
|
41
19
|
variant?: TabsNavVariant;
|
|
42
|
-
}):
|
|
43
|
-
declare function TabsNavList({
|
|
44
|
-
|
|
45
|
-
...props
|
|
46
|
-
}: React.ComponentProps<"ul">): _$react_jsx_runtime0.JSX.Element;
|
|
47
|
-
declare function TabsNavTrigger({
|
|
48
|
-
className,
|
|
49
|
-
active,
|
|
50
|
-
asChild,
|
|
51
|
-
children,
|
|
52
|
-
...props
|
|
53
|
-
}: React.ComponentProps<"a"> & {
|
|
20
|
+
}): React$1.JSX.Element;
|
|
21
|
+
declare function TabsNavList({ className, ...props }: React$1.ComponentProps<"ul">): React$1.JSX.Element;
|
|
22
|
+
declare function TabsNavTrigger({ className, active, asChild, children, ...props }: React$1.ComponentProps<"a"> & {
|
|
54
23
|
active?: boolean;
|
|
55
24
|
asChild?: boolean;
|
|
56
|
-
}):
|
|
25
|
+
}): React$1.JSX.Element;
|
|
57
26
|
//#endregion
|
|
58
27
|
export { Tabs, TabsContent, TabsList, TabsNav, TabsNavList, TabsNavTrigger, TabsTrigger, tabsListVariants, tabsTriggerVariants };
|
|
@@ -1,35 +1,16 @@
|
|
|
1
|
-
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
2
|
-
|
|
3
1
|
//#region src/components/tag.d.ts
|
|
4
2
|
interface TagBaseProps {
|
|
5
3
|
icon?: React.ReactNode;
|
|
6
4
|
}
|
|
7
5
|
interface TagProps extends React.ComponentProps<"span">, TagBaseProps {}
|
|
8
|
-
declare function Tag({
|
|
9
|
-
className,
|
|
10
|
-
icon,
|
|
11
|
-
children,
|
|
12
|
-
...props
|
|
13
|
-
}: TagProps): _$react_jsx_runtime0.JSX.Element;
|
|
6
|
+
declare function Tag({ className, icon, children, ...props }: TagProps): import("react").JSX.Element;
|
|
14
7
|
interface TagDismissibleProps extends React.ComponentProps<"span">, TagBaseProps {
|
|
15
8
|
onDismiss?: () => void;
|
|
16
9
|
}
|
|
17
|
-
declare function TagDismissible({
|
|
18
|
-
className,
|
|
19
|
-
icon,
|
|
20
|
-
children,
|
|
21
|
-
onDismiss,
|
|
22
|
-
...props
|
|
23
|
-
}: TagDismissibleProps): _$react_jsx_runtime0.JSX.Element;
|
|
10
|
+
declare function TagDismissible({ className, icon, children, onDismiss, ...props }: TagDismissibleProps): import("react").JSX.Element;
|
|
24
11
|
interface TagCountProps extends React.ComponentProps<"span">, TagBaseProps {
|
|
25
12
|
count: number;
|
|
26
13
|
}
|
|
27
|
-
declare function TagCount({
|
|
28
|
-
className,
|
|
29
|
-
icon,
|
|
30
|
-
children,
|
|
31
|
-
count,
|
|
32
|
-
...props
|
|
33
|
-
}: TagCountProps): _$react_jsx_runtime0.JSX.Element;
|
|
14
|
+
declare function TagCount({ className, icon, children, count, ...props }: TagCountProps): import("react").JSX.Element;
|
|
34
15
|
//#endregion
|
|
35
16
|
export { Tag, TagCount, TagDismissible };
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
2
|
-
|
|
3
1
|
//#region src/components/task-progress.d.ts
|
|
4
2
|
type TaskProgressStatus = "pending" | "running" | "done";
|
|
5
3
|
interface TaskProgressStep {
|
|
@@ -16,12 +14,6 @@ interface TaskProgressProps extends Omit<React.ComponentProps<"div">, "children"
|
|
|
16
14
|
*/
|
|
17
15
|
stepRevealDelayMs?: number;
|
|
18
16
|
}
|
|
19
|
-
declare function TaskProgress({
|
|
20
|
-
steps,
|
|
21
|
-
trailingLabel,
|
|
22
|
-
stepRevealDelayMs,
|
|
23
|
-
className,
|
|
24
|
-
...props
|
|
25
|
-
}: TaskProgressProps): _$react_jsx_runtime0.JSX.Element;
|
|
17
|
+
declare function TaskProgress({ steps, trailingLabel, stepRevealDelayMs, className, ...props }: TaskProgressProps): import("react").JSX.Element;
|
|
26
18
|
//#endregion
|
|
27
19
|
export { TaskProgress, type TaskProgressStatus, type TaskProgressStep };
|
|
@@ -1,23 +1,12 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import * as React from "react";
|
|
3
|
-
|
|
1
|
+
import * as React$1 from "react";
|
|
4
2
|
//#region src/components/textarea.d.ts
|
|
5
|
-
interface TextareaProps extends React.ComponentProps<"textarea"> {
|
|
3
|
+
interface TextareaProps extends React$1.ComponentProps<"textarea"> {
|
|
6
4
|
label?: string;
|
|
7
5
|
required?: boolean;
|
|
8
6
|
hint?: string;
|
|
9
7
|
error?: string;
|
|
10
8
|
tooltip?: string;
|
|
11
9
|
}
|
|
12
|
-
declare function Textarea({
|
|
13
|
-
className,
|
|
14
|
-
id,
|
|
15
|
-
label,
|
|
16
|
-
required,
|
|
17
|
-
hint,
|
|
18
|
-
error,
|
|
19
|
-
tooltip,
|
|
20
|
-
...props
|
|
21
|
-
}: TextareaProps): _$react_jsx_runtime0.JSX.Element;
|
|
10
|
+
declare function Textarea({ className, id, label, required, hint, error, tooltip, ...props }: TextareaProps): React$1.JSX.Element;
|
|
22
11
|
//#endregion
|
|
23
12
|
export { Textarea, type TextareaProps };
|
|
@@ -1,52 +1,28 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { cn } from "../lib/cn.mjs";
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import
|
|
6
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
7
|
-
import * as React from "react";
|
|
3
|
+
import { Field } from "./field.mjs";
|
|
4
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
|
+
import * as React$1 from "react";
|
|
8
6
|
//#region src/components/textarea.tsx
|
|
9
7
|
function Textarea({ className, id, label, required, hint, error, tooltip, ...props }) {
|
|
10
|
-
const generatedId = React.useId();
|
|
8
|
+
const generatedId = React$1.useId();
|
|
11
9
|
const fieldId = id ?? generatedId;
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
className: cn("block w-full min-h-[120px] resize-none", "px-3.5 py-3", "type-text-md text-foreground placeholder:text-placeholder", "bg-background border border-border rounded-md", "transition-colors", "outline-none focus-visible:border-ring focus-visible:border-2", "disabled:bg-disabled disabled:text-disabled-foreground disabled:cursor-not-allowed", "aria-invalid:border-border-error [@media(hover:hover)]:aria-invalid:hover:border-border-error", error && "border-border-error [@media(hover:hover)]:hover:border-border-error", className),
|
|
10
|
+
return /* @__PURE__ */ jsx(Field, {
|
|
11
|
+
fieldId,
|
|
12
|
+
label,
|
|
16
13
|
required,
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
className: "type-text-sm font-medium text-muted-foreground",
|
|
30
|
-
children: label
|
|
31
|
-
}),
|
|
32
|
-
required && /* @__PURE__ */ jsx("span", {
|
|
33
|
-
"aria-hidden": true,
|
|
34
|
-
className: "type-text-sm font-medium text-required",
|
|
35
|
-
children: "*"
|
|
36
|
-
}),
|
|
37
|
-
tooltip && /* @__PURE__ */ jsxs(Tooltip, { children: [/* @__PURE__ */ jsx(TooltipTrigger, {
|
|
38
|
-
asChild: true,
|
|
39
|
-
children: /* @__PURE__ */ jsx(Info, { className: "size-4 text-muted-foreground" })
|
|
40
|
-
}), /* @__PURE__ */ jsx(TooltipContent, { children: tooltip })] })
|
|
41
|
-
]
|
|
42
|
-
}),
|
|
43
|
-
textarea,
|
|
44
|
-
(hint || error) && /* @__PURE__ */ jsx("p", {
|
|
45
|
-
id: fieldId ? `${fieldId}-description` : void 0,
|
|
46
|
-
className: cn("type-text-sm", error ? "text-destructive" : "text-subtle-foreground"),
|
|
47
|
-
children: error ?? hint
|
|
48
|
-
})
|
|
49
|
-
]
|
|
14
|
+
hint,
|
|
15
|
+
error,
|
|
16
|
+
tooltip,
|
|
17
|
+
children: /* @__PURE__ */ jsx("textarea", {
|
|
18
|
+
id: fieldId,
|
|
19
|
+
"data-slot": "textarea",
|
|
20
|
+
className: cn("block w-full min-h-[120px] max-h-[480px] resize-y [field-sizing:content]", "px-3.5 py-3", "type-text-md text-foreground placeholder:text-placeholder", "bg-background border border-border rounded-md", "transition-colors", "outline-none focus-visible:border-ring focus-visible:border-2", "disabled:bg-disabled disabled:text-disabled-foreground disabled:cursor-not-allowed", "aria-invalid:border-border-error [@media(hover:hover)]:aria-invalid:hover:border-border-error", error && "border-border-error [@media(hover:hover)]:hover:border-border-error", className),
|
|
21
|
+
required,
|
|
22
|
+
"aria-invalid": error ? true : void 0,
|
|
23
|
+
"aria-describedby": fieldId && (hint || error) ? `${fieldId}-description` : void 0,
|
|
24
|
+
...props
|
|
25
|
+
})
|
|
50
26
|
});
|
|
51
27
|
}
|
|
52
28
|
//#endregion
|
|
@@ -1,28 +1,13 @@
|
|
|
1
|
-
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
2
1
|
import { VariantProps } from "class-variance-authority";
|
|
3
|
-
import * as React from "react";
|
|
2
|
+
import * as React$1 from "react";
|
|
4
3
|
import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group";
|
|
5
|
-
import * as _$class_variance_authority_types0 from "class-variance-authority/types";
|
|
6
|
-
|
|
7
4
|
//#region src/components/toggle-group.d.ts
|
|
8
5
|
declare const toggleGroupItemVariants: (props?: ({
|
|
9
6
|
variant?: "default" | "outline" | null | undefined;
|
|
10
7
|
size?: "default" | "sm" | null | undefined;
|
|
11
|
-
} &
|
|
8
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
12
9
|
type ToggleGroupContextValue = VariantProps<typeof toggleGroupItemVariants>;
|
|
13
|
-
declare function ToggleGroup({
|
|
14
|
-
|
|
15
|
-
variant,
|
|
16
|
-
size,
|
|
17
|
-
children,
|
|
18
|
-
...props
|
|
19
|
-
}: React.ComponentProps<typeof ToggleGroupPrimitive.Root> & ToggleGroupContextValue): _$react_jsx_runtime0.JSX.Element;
|
|
20
|
-
declare function ToggleGroupItem({
|
|
21
|
-
className,
|
|
22
|
-
children,
|
|
23
|
-
variant,
|
|
24
|
-
size,
|
|
25
|
-
...props
|
|
26
|
-
}: React.ComponentProps<typeof ToggleGroupPrimitive.Item> & VariantProps<typeof toggleGroupItemVariants>): _$react_jsx_runtime0.JSX.Element;
|
|
10
|
+
declare function ToggleGroup({ className, variant, size, children, ...props }: React$1.ComponentProps<typeof ToggleGroupPrimitive.Root> & ToggleGroupContextValue): React$1.JSX.Element;
|
|
11
|
+
declare function ToggleGroupItem({ className, children, variant, size, ...props }: React$1.ComponentProps<typeof ToggleGroupPrimitive.Item> & VariantProps<typeof toggleGroupItemVariants>): React$1.JSX.Element;
|
|
27
12
|
//#endregion
|
|
28
13
|
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,12 +1,10 @@
|
|
|
1
1
|
import { Button } from "./button.mjs";
|
|
2
|
-
import * as _$react from "react";
|
|
3
2
|
import { ComponentPropsWithRef } from "react";
|
|
4
|
-
|
|
5
3
|
//#region src/components/tooltip-icon-button.d.ts
|
|
6
4
|
type TooltipIconButtonProps = ComponentPropsWithRef<typeof Button> & {
|
|
7
5
|
tooltip: string;
|
|
8
6
|
side?: "top" | "bottom" | "left" | "right";
|
|
9
7
|
};
|
|
10
|
-
declare const TooltipIconButton:
|
|
8
|
+
declare const TooltipIconButton: import("react").ForwardRefExoticComponent<Omit<TooltipIconButtonProps, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
|
|
11
9
|
//#endregion
|
|
12
10
|
export { TooltipIconButton, type TooltipIconButtonProps };
|
|
@@ -1,23 +1,9 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import * as React from "react";
|
|
1
|
+
import * as React$1 from "react";
|
|
3
2
|
import * as TooltipPrimitive from "@radix-ui/react-tooltip";
|
|
4
|
-
|
|
5
3
|
//#region src/components/tooltip.d.ts
|
|
6
|
-
declare function TooltipProvider({
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
}: React.ComponentProps<typeof TooltipPrimitive.
|
|
10
|
-
declare function Tooltip({
|
|
11
|
-
...props
|
|
12
|
-
}: React.ComponentProps<typeof TooltipPrimitive.Root>): _$react_jsx_runtime0.JSX.Element;
|
|
13
|
-
declare function TooltipTrigger({
|
|
14
|
-
...props
|
|
15
|
-
}: React.ComponentProps<typeof TooltipPrimitive.Trigger>): _$react_jsx_runtime0.JSX.Element;
|
|
16
|
-
declare function TooltipContent({
|
|
17
|
-
className,
|
|
18
|
-
sideOffset,
|
|
19
|
-
children,
|
|
20
|
-
...props
|
|
21
|
-
}: React.ComponentProps<typeof TooltipPrimitive.Content>): _$react_jsx_runtime0.JSX.Element;
|
|
4
|
+
declare function TooltipProvider({ delayDuration, ...props }: React$1.ComponentProps<typeof TooltipPrimitive.Provider>): React$1.JSX.Element;
|
|
5
|
+
declare function Tooltip({ ...props }: React$1.ComponentProps<typeof TooltipPrimitive.Root>): React$1.JSX.Element;
|
|
6
|
+
declare function TooltipTrigger({ ...props }: React$1.ComponentProps<typeof TooltipPrimitive.Trigger>): React$1.JSX.Element;
|
|
7
|
+
declare function TooltipContent({ className, sideOffset, children, ...props }: React$1.ComponentProps<typeof TooltipPrimitive.Content>): React$1.JSX.Element;
|
|
22
8
|
//#endregion
|
|
23
9
|
export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger };
|
|
@@ -1,34 +1,20 @@
|
|
|
1
|
-
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
2
1
|
import { ReactNode } from "react";
|
|
3
|
-
|
|
4
2
|
//#region src/components/typography.d.ts
|
|
5
|
-
declare function H1({
|
|
6
|
-
children,
|
|
7
|
-
className
|
|
8
|
-
}: {
|
|
3
|
+
declare function H1({ children, className }: {
|
|
9
4
|
children: ReactNode;
|
|
10
5
|
className?: string;
|
|
11
|
-
}):
|
|
12
|
-
declare function H2({
|
|
13
|
-
children,
|
|
14
|
-
className
|
|
15
|
-
}: {
|
|
6
|
+
}): import("react").JSX.Element;
|
|
7
|
+
declare function H2({ children, className }: {
|
|
16
8
|
children: ReactNode;
|
|
17
9
|
className?: string;
|
|
18
|
-
}):
|
|
19
|
-
declare function H3({
|
|
20
|
-
children,
|
|
21
|
-
className
|
|
22
|
-
}: {
|
|
10
|
+
}): import("react").JSX.Element;
|
|
11
|
+
declare function H3({ children, className }: {
|
|
23
12
|
children: ReactNode;
|
|
24
13
|
className?: string;
|
|
25
|
-
}):
|
|
26
|
-
declare function H4({
|
|
27
|
-
children,
|
|
28
|
-
className
|
|
29
|
-
}: {
|
|
14
|
+
}): import("react").JSX.Element;
|
|
15
|
+
declare function H4({ children, className }: {
|
|
30
16
|
children: ReactNode;
|
|
31
17
|
className?: string;
|
|
32
|
-
}):
|
|
18
|
+
}): import("react").JSX.Element;
|
|
33
19
|
//#endregion
|
|
34
20
|
export { H1, H2, H3, H4 };
|
|
@@ -1,34 +1,9 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import * as React from "react";
|
|
3
|
-
|
|
1
|
+
import * as React$1 from "react";
|
|
4
2
|
//#region src/components/wizard.d.ts
|
|
5
|
-
interface
|
|
6
|
-
id: string;
|
|
7
|
-
label: string;
|
|
8
|
-
}
|
|
9
|
-
interface WizardStepsProps {
|
|
10
|
-
steps: readonly WizardStep[];
|
|
11
|
-
activeIdx: number;
|
|
12
|
-
onSelect: (idx: number) => void;
|
|
13
|
-
ariaLabel?: string;
|
|
14
|
-
className?: string;
|
|
15
|
-
}
|
|
16
|
-
declare function WizardSteps({
|
|
17
|
-
steps,
|
|
18
|
-
activeIdx,
|
|
19
|
-
onSelect,
|
|
20
|
-
ariaLabel,
|
|
21
|
-
className
|
|
22
|
-
}: WizardStepsProps): _$react_jsx_runtime0.JSX.Element;
|
|
23
|
-
interface WizardProgressProps extends React.ComponentProps<"div"> {
|
|
3
|
+
interface WizardProgressProps extends React$1.ComponentProps<"div"> {
|
|
24
4
|
current: number;
|
|
25
5
|
total: number;
|
|
26
6
|
}
|
|
27
|
-
declare function WizardProgress({
|
|
28
|
-
current,
|
|
29
|
-
total,
|
|
30
|
-
className,
|
|
31
|
-
...props
|
|
32
|
-
}: WizardProgressProps): _$react_jsx_runtime0.JSX.Element;
|
|
7
|
+
declare function WizardProgress({ current, total, className, ...props }: WizardProgressProps): React$1.JSX.Element;
|
|
33
8
|
//#endregion
|
|
34
|
-
export { WizardProgress
|
|
9
|
+
export { WizardProgress };
|