@alpic-ai/ui 1.153.0 → 1.154.1
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 +4 -25
- package/dist/components/accordion.d.mts +4 -18
- package/dist/components/alert.d.mts +5 -24
- package/dist/components/area-chart.d.mts +1 -22
- package/dist/components/area-chart.mjs +20 -109
- package/dist/components/attachment-tile.d.mts +1 -8
- package/dist/components/avatar.d.mts +4 -27
- package/dist/components/badge.d.mts +1 -8
- package/dist/components/bar-chart.d.mts +1 -21
- package/dist/components/bar-chart.mjs +10 -68
- package/dist/components/bar-list.d.mts +1 -13
- package/dist/components/breadcrumb.d.mts +8 -35
- package/dist/components/button.d.mts +1 -14
- package/dist/components/card.d.mts +7 -30
- package/dist/components/chart-card.d.mts +1 -12
- package/dist/components/chart-container.d.mts +1 -6
- package/dist/components/chart-legend.d.mts +1 -8
- package/dist/components/chart-primitives.d.mts +69 -0
- package/dist/components/chart-primitives.mjs +134 -0
- package/dist/components/chart-tooltip.d.mts +1 -11
- package/dist/components/checkbox.d.mts +1 -5
- package/dist/components/collapsible.d.mts +3 -10
- package/dist/components/combobox.d.mts +9 -45
- package/dist/components/command.d.mts +8 -32
- package/dist/components/copyable.d.mts +2 -9
- package/dist/components/description-list.d.mts +4 -17
- package/dist/components/dialog.d.mts +10 -42
- package/dist/components/donut-chart.d.mts +1 -16
- package/dist/components/dropdown-menu.d.mts +13 -55
- package/dist/components/field.d.mts +14 -0
- package/dist/components/field.mjs +41 -0
- package/dist/components/form.d.mts +15 -115
- package/dist/components/github-button.d.mts +1 -6
- package/dist/components/heatmap-chart.d.mts +1 -23
- package/dist/components/input-group.d.mts +3 -15
- package/dist/components/input.d.mts +1 -14
- package/dist/components/input.mjs +25 -49
- package/dist/components/label.d.mts +1 -5
- package/dist/components/line-chart.d.mts +1 -21
- package/dist/components/line-chart.mjs +20 -102
- package/dist/components/page-loader.d.mts +1 -3
- package/dist/components/pagination.d.mts +1 -8
- package/dist/components/popover.d.mts +4 -16
- package/dist/components/radio-group.d.mts +2 -9
- package/dist/components/scroll-area.d.mts +2 -11
- package/dist/components/select.d.mts +8 -35
- package/dist/components/separator.d.mts +1 -7
- package/dist/components/sheet.d.mts +9 -35
- package/dist/components/shimmer-text.d.mts +1 -5
- package/dist/components/sidebar.d.mts +22 -113
- package/dist/components/skeleton.d.mts +1 -6
- package/dist/components/sonner.d.mts +1 -8
- package/dist/components/spinner.d.mts +2 -14
- package/dist/components/stat.d.mts +1 -10
- package/dist/components/status-dot.d.mts +1 -7
- package/dist/components/switch.d.mts +1 -5
- package/dist/components/table.d.mts +8 -35
- package/dist/components/tabs.d.mts +7 -36
- package/dist/components/tag.d.mts +3 -20
- package/dist/components/task-progress.d.mts +1 -7
- package/dist/components/textarea.d.mts +1 -11
- package/dist/components/textarea.mjs +17 -41
- package/dist/components/toggle-group.d.mts +2 -15
- package/dist/components/tooltip-icon-button.d.mts +0 -1
- package/dist/components/tooltip.d.mts +4 -17
- package/dist/components/typography.d.mts +4 -17
- package/dist/components/wizard.d.mts +1 -7
- package/dist/hooks/use-copy-to-clipboard.d.mts +1 -3
- package/dist/lib/chart-palette.mjs +39 -21
- package/dist/lib/chart.d.mts +6 -1
- package/dist/lib/cn.d.mts +0 -1
- package/package.json +19 -19
- package/src/components/area-chart.tsx +21 -142
- package/src/components/bar-chart.tsx +12 -81
- package/src/components/chart-primitives.tsx +188 -0
- package/src/components/field.tsx +57 -0
- package/src/components/input.tsx +3 -33
- package/src/components/line-chart.tsx +21 -133
- package/src/components/textarea.tsx +3 -33
- package/src/stories/area-chart.stories.tsx +8 -6
- package/src/stories/bar-chart.stories.tsx +8 -6
- package/src/stories/donut-chart.stories.tsx +8 -6
- package/src/stories/line-chart.stories.tsx +8 -6
- package/src/stories/stat.stories.tsx +8 -6
|
@@ -1,40 +1,19 @@
|
|
|
1
1
|
import * as AccordionPrimitive from "@radix-ui/react-accordion";
|
|
2
2
|
import * as React$1 from "react";
|
|
3
|
-
|
|
4
3
|
//#region src/components/accordion-card.d.ts
|
|
5
|
-
declare function AccordionCard({
|
|
6
|
-
defaultOpen,
|
|
7
|
-
open,
|
|
8
|
-
onOpenChange,
|
|
9
|
-
disabled,
|
|
10
|
-
className,
|
|
11
|
-
children,
|
|
12
|
-
...props
|
|
13
|
-
}: {
|
|
4
|
+
declare function AccordionCard({ defaultOpen, open, onOpenChange, disabled, className, children, ...props }: {
|
|
14
5
|
defaultOpen?: boolean;
|
|
15
6
|
open?: boolean;
|
|
16
7
|
onOpenChange?: (nextOpen: boolean) => void;
|
|
17
8
|
disabled?: boolean;
|
|
18
9
|
} & Omit<React$1.ComponentProps<typeof AccordionPrimitive.Root>, "type" | "collapsible" | "defaultValue" | "value" | "onValueChange" | "disabled">): React$1.JSX.Element;
|
|
19
|
-
declare function AccordionCardHeader({
|
|
20
|
-
|
|
21
|
-
children,
|
|
22
|
-
...props
|
|
23
|
-
}: React$1.ComponentProps<typeof AccordionPrimitive.Trigger>): React$1.JSX.Element;
|
|
24
|
-
declare function AccordionCardTitle({
|
|
25
|
-
className,
|
|
26
|
-
children,
|
|
27
|
-
...props
|
|
28
|
-
}: React$1.HTMLAttributes<HTMLHeadingElement>): React$1.JSX.Element;
|
|
10
|
+
declare function AccordionCardHeader({ className, children, ...props }: React$1.ComponentProps<typeof AccordionPrimitive.Trigger>): React$1.JSX.Element;
|
|
11
|
+
declare function AccordionCardTitle({ className, children, ...props }: React$1.HTMLAttributes<HTMLHeadingElement>): React$1.JSX.Element;
|
|
29
12
|
/**
|
|
30
13
|
* `className` is forwarded to the inner padding wrapper, not the Radix Content root.
|
|
31
14
|
* The root always applies overflow-hidden and the accordion animations.
|
|
32
15
|
* To override overflow or animation behavior, wrap this component in an additional element.
|
|
33
16
|
*/
|
|
34
|
-
declare function AccordionCardContent({
|
|
35
|
-
className,
|
|
36
|
-
children,
|
|
37
|
-
...props
|
|
38
|
-
}: React$1.ComponentProps<typeof AccordionPrimitive.Content>): React$1.JSX.Element;
|
|
17
|
+
declare function AccordionCardContent({ className, children, ...props }: React$1.ComponentProps<typeof AccordionPrimitive.Content>): React$1.JSX.Element;
|
|
39
18
|
//#endregion
|
|
40
19
|
export { AccordionCard, AccordionCardContent, AccordionCardHeader, AccordionCardTitle };
|
|
@@ -1,28 +1,14 @@
|
|
|
1
1
|
import * as AccordionPrimitive from "@radix-ui/react-accordion";
|
|
2
2
|
import * as React$1 from "react";
|
|
3
|
-
|
|
4
3
|
//#region src/components/accordion.d.ts
|
|
5
|
-
declare function Accordion({
|
|
6
|
-
|
|
7
|
-
}: React$1.ComponentProps<typeof AccordionPrimitive.
|
|
8
|
-
declare function AccordionItem({
|
|
9
|
-
className,
|
|
10
|
-
...props
|
|
11
|
-
}: React$1.ComponentProps<typeof AccordionPrimitive.Item>): React$1.JSX.Element;
|
|
12
|
-
declare function AccordionTrigger({
|
|
13
|
-
className,
|
|
14
|
-
children,
|
|
15
|
-
...props
|
|
16
|
-
}: React$1.ComponentProps<typeof AccordionPrimitive.Trigger>): React$1.JSX.Element;
|
|
4
|
+
declare function Accordion({ ...props }: React$1.ComponentProps<typeof AccordionPrimitive.Root>): React$1.JSX.Element;
|
|
5
|
+
declare function AccordionItem({ className, ...props }: React$1.ComponentProps<typeof AccordionPrimitive.Item>): React$1.JSX.Element;
|
|
6
|
+
declare function AccordionTrigger({ className, children, ...props }: React$1.ComponentProps<typeof AccordionPrimitive.Trigger>): React$1.JSX.Element;
|
|
17
7
|
/**
|
|
18
8
|
* `className` is forwarded to the inner padding wrapper, not the Radix Content root.
|
|
19
9
|
* The root always applies overflow-hidden and the accordion animations.
|
|
20
10
|
* To override overflow or animation behavior, wrap this component in an additional element.
|
|
21
11
|
*/
|
|
22
|
-
declare function AccordionContent({
|
|
23
|
-
className,
|
|
24
|
-
children,
|
|
25
|
-
...props
|
|
26
|
-
}: React$1.ComponentProps<typeof AccordionPrimitive.Content>): React$1.JSX.Element;
|
|
12
|
+
declare function AccordionContent({ className, children, ...props }: React$1.ComponentProps<typeof AccordionPrimitive.Content>): React$1.JSX.Element;
|
|
27
13
|
//#endregion
|
|
28
14
|
export { Accordion, AccordionContent, AccordionItem, AccordionTrigger };
|
|
@@ -1,38 +1,19 @@
|
|
|
1
1
|
import { VariantProps } from "class-variance-authority";
|
|
2
2
|
import * as React$1 from "react";
|
|
3
|
-
|
|
4
3
|
//#region src/components/alert.d.ts
|
|
5
4
|
declare const alertVariants: (props?: ({
|
|
6
5
|
variant?: "default" | "destructive" | "warning" | "success" | null | undefined;
|
|
7
6
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
8
7
|
interface AlertProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof alertVariants> {}
|
|
9
|
-
declare function Alert({
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
...props
|
|
13
|
-
}: AlertProps): React$1.JSX.Element;
|
|
14
|
-
declare function AlertTitle({
|
|
15
|
-
className,
|
|
16
|
-
...props
|
|
17
|
-
}: React$1.HTMLAttributes<HTMLParagraphElement>): React$1.JSX.Element;
|
|
18
|
-
declare function AlertDescription({
|
|
19
|
-
className,
|
|
20
|
-
...props
|
|
21
|
-
}: React$1.HTMLAttributes<HTMLDivElement>): React$1.JSX.Element;
|
|
8
|
+
declare function Alert({ className, variant, ...props }: AlertProps): React$1.JSX.Element;
|
|
9
|
+
declare function AlertTitle({ className, ...props }: React$1.HTMLAttributes<HTMLParagraphElement>): React$1.JSX.Element;
|
|
10
|
+
declare function AlertDescription({ className, ...props }: React$1.HTMLAttributes<HTMLDivElement>): React$1.JSX.Element;
|
|
22
11
|
interface ConvenienceAlertProps {
|
|
23
12
|
title?: string;
|
|
24
13
|
description?: React$1.ReactNode;
|
|
25
14
|
className?: string;
|
|
26
15
|
}
|
|
27
|
-
declare function ErrorAlert({
|
|
28
|
-
|
|
29
|
-
description,
|
|
30
|
-
className
|
|
31
|
-
}: ConvenienceAlertProps): React$1.JSX.Element;
|
|
32
|
-
declare function WarningAlert({
|
|
33
|
-
title,
|
|
34
|
-
description,
|
|
35
|
-
className
|
|
36
|
-
}: ConvenienceAlertProps): React$1.JSX.Element;
|
|
16
|
+
declare function ErrorAlert({ title, description, className }: ConvenienceAlertProps): React$1.JSX.Element;
|
|
17
|
+
declare function WarningAlert({ title, description, className }: ConvenienceAlertProps): React$1.JSX.Element;
|
|
37
18
|
//#endregion
|
|
38
19
|
export { Alert, AlertDescription, AlertTitle, ErrorAlert, WarningAlert };
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { ChartSeries } from "../lib/chart.mjs";
|
|
2
2
|
import { ChartPaletteName } from "../lib/chart-palette.mjs";
|
|
3
3
|
import * as React$1 from "react";
|
|
4
|
-
|
|
5
4
|
//#region src/components/area-chart.d.ts
|
|
6
5
|
declare const CURVE_TYPE: {
|
|
7
6
|
readonly monotone: "monotone";
|
|
@@ -39,26 +38,6 @@ interface AreaChartProps {
|
|
|
39
38
|
labelFormatter?: (label: string | number) => string;
|
|
40
39
|
className?: string;
|
|
41
40
|
}
|
|
42
|
-
declare function AreaChart({
|
|
43
|
-
data,
|
|
44
|
-
index,
|
|
45
|
-
series,
|
|
46
|
-
variant,
|
|
47
|
-
curve,
|
|
48
|
-
legend,
|
|
49
|
-
legendAlign,
|
|
50
|
-
valueFlags,
|
|
51
|
-
height,
|
|
52
|
-
yAxisWidth,
|
|
53
|
-
palette,
|
|
54
|
-
referenceLine,
|
|
55
|
-
markers,
|
|
56
|
-
lastValueLabel,
|
|
57
|
-
texture,
|
|
58
|
-
loading,
|
|
59
|
-
valueFormatter,
|
|
60
|
-
labelFormatter,
|
|
61
|
-
className
|
|
62
|
-
}: AreaChartProps): React$1.JSX.Element;
|
|
41
|
+
declare function AreaChart({ data, index, series, variant, curve, legend, legendAlign, valueFlags, height, yAxisWidth, palette, referenceLine, markers, lastValueLabel, texture, loading, valueFormatter, labelFormatter, className }: AreaChartProps): React$1.JSX.Element;
|
|
63
42
|
//#endregion
|
|
64
43
|
export { AreaChart, AreaChartProps, ChartMarker };
|
|
@@ -3,11 +3,12 @@ import { cn } from "../lib/cn.mjs";
|
|
|
3
3
|
import { makeXAxisTick, orderByLuminance, resolveSeries } from "../lib/chart.mjs";
|
|
4
4
|
import { useChartContext } from "./chart-container.mjs";
|
|
5
5
|
import { ChartLegend } from "./chart-legend.mjs";
|
|
6
|
+
import { computeNumericMax, makeActiveDot, makeChartAxis, makeLastValueLabel, makeLegendItems, renderMarkers, renderReferenceLine } from "./chart-primitives.mjs";
|
|
6
7
|
import { ChartTooltipContent } from "./chart-tooltip.mjs";
|
|
7
8
|
import { Skeleton } from "./skeleton.mjs";
|
|
8
9
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
9
10
|
import * as React$1 from "react";
|
|
10
|
-
import { Area, AreaChart as AreaChart$1, CartesianGrid, LabelList,
|
|
11
|
+
import { Area, AreaChart as AreaChart$1, CartesianGrid, LabelList, ResponsiveContainer, Tooltip, XAxis, YAxis } from "recharts";
|
|
11
12
|
//#region src/components/area-chart.tsx
|
|
12
13
|
const CURVE_TYPE = {
|
|
13
14
|
monotone: "monotone",
|
|
@@ -23,21 +24,7 @@ function AreaChart({ data, index, series, variant = "stacked", curve = "monotone
|
|
|
23
24
|
const filled = !(variant === "grouped" && rendered.length > 1);
|
|
24
25
|
const lead = resolved[0];
|
|
25
26
|
const withTotal = stacked && rendered.length > 1;
|
|
26
|
-
const numericMax = React$1.useMemo(() =>
|
|
27
|
-
let max = 0;
|
|
28
|
-
for (const row of data) {
|
|
29
|
-
let rowTotal = 0;
|
|
30
|
-
for (const entry of series) {
|
|
31
|
-
const value = Number(row[entry.key]);
|
|
32
|
-
if (Number.isFinite(value)) {
|
|
33
|
-
rowTotal += value;
|
|
34
|
-
if (!stacked && value > max) max = value;
|
|
35
|
-
}
|
|
36
|
-
}
|
|
37
|
-
if (stacked && rowTotal > max) max = rowTotal;
|
|
38
|
-
}
|
|
39
|
-
return max;
|
|
40
|
-
}, [
|
|
27
|
+
const numericMax = React$1.useMemo(() => computeNumericMax(data, series, stacked), [
|
|
41
28
|
data,
|
|
42
29
|
series,
|
|
43
30
|
stacked
|
|
@@ -49,68 +36,13 @@ function AreaChart({ data, index, series, variant = "stacked", curve = "monotone
|
|
|
49
36
|
bottom: 2,
|
|
50
37
|
left: 0
|
|
51
38
|
};
|
|
52
|
-
const axis =
|
|
53
|
-
|
|
54
|
-
tick: {
|
|
55
|
-
fill: theme.axisForeground,
|
|
56
|
-
fontSize: 10,
|
|
57
|
-
fontFamily: theme.fontMono
|
|
58
|
-
},
|
|
59
|
-
tickLine: false,
|
|
60
|
-
axisLine: {
|
|
61
|
-
stroke: theme.border,
|
|
62
|
-
strokeOpacity: .6
|
|
63
|
-
}
|
|
64
|
-
};
|
|
65
|
-
const legendItems = resolved.map((entry) => ({
|
|
66
|
-
name: entry.name,
|
|
67
|
-
color: entry.color,
|
|
68
|
-
dashed: entry.dashed
|
|
69
|
-
}));
|
|
70
|
-
const activeDotFor = (entry) => valueFlags ? (dotProps) => {
|
|
71
|
-
if (dotProps.cx == null || dotProps.cy == null) return /* @__PURE__ */ jsx("g", {});
|
|
72
|
-
return /* @__PURE__ */ jsxs("g", { children: [/* @__PURE__ */ jsx("circle", {
|
|
73
|
-
cx: dotProps.cx,
|
|
74
|
-
cy: dotProps.cy,
|
|
75
|
-
r: 3.5,
|
|
76
|
-
fill: entry.color,
|
|
77
|
-
stroke: theme.card,
|
|
78
|
-
strokeWidth: 2
|
|
79
|
-
}), /* @__PURE__ */ jsx("text", {
|
|
80
|
-
x: dotProps.cx,
|
|
81
|
-
y: dotProps.cy - 8,
|
|
82
|
-
textAnchor: "middle",
|
|
83
|
-
fill: entry.color,
|
|
84
|
-
fontFamily: theme.fontMono,
|
|
85
|
-
fontSize: 10,
|
|
86
|
-
style: { fontVariantNumeric: "tabular-nums" },
|
|
87
|
-
children: valueFormatter(Number(dotProps.value ?? 0))
|
|
88
|
-
})] });
|
|
89
|
-
} : {
|
|
90
|
-
r: 3.5,
|
|
91
|
-
fill: entry.color,
|
|
92
|
-
stroke: theme.card,
|
|
93
|
-
strokeWidth: 2
|
|
94
|
-
};
|
|
39
|
+
const axis = makeChartAxis(theme);
|
|
40
|
+
const legendItems = makeLegendItems(resolved);
|
|
95
41
|
const fillFor = (entry, slot) => {
|
|
96
42
|
if (!filled) return "none";
|
|
97
43
|
if (texture && lead && entry.key === lead.key) return `url(#hatch-${reactId})`;
|
|
98
44
|
return `url(#area-${reactId}-${slot})`;
|
|
99
45
|
};
|
|
100
|
-
const renderLastLabel = (color) => (props) => {
|
|
101
|
-
if (props.index !== data.length - 1 || props.x == null || props.y == null) return null;
|
|
102
|
-
return /* @__PURE__ */ jsx("text", {
|
|
103
|
-
x: Number(props.x) + 6,
|
|
104
|
-
y: Number(props.y),
|
|
105
|
-
dy: 3,
|
|
106
|
-
fill: color,
|
|
107
|
-
fontFamily: theme.fontMono,
|
|
108
|
-
fontSize: 10,
|
|
109
|
-
textAnchor: "start",
|
|
110
|
-
style: { fontVariantNumeric: "tabular-nums" },
|
|
111
|
-
children: valueFormatter(Number(props.value ?? 0))
|
|
112
|
-
});
|
|
113
|
-
};
|
|
114
46
|
const isEmpty = data.length === 0 || rendered.length === 0;
|
|
115
47
|
return /* @__PURE__ */ jsxs("div", {
|
|
116
48
|
"data-slot": "area-chart",
|
|
@@ -203,25 +135,10 @@ function AreaChart({ data, index, series, variant = "stacked", curve = "monotone
|
|
|
203
135
|
showTotal: withTotal
|
|
204
136
|
})
|
|
205
137
|
}),
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
fillOpacity: .06,
|
|
211
|
-
ifOverflow: "extendDomain"
|
|
212
|
-
}),
|
|
213
|
-
referenceLine && /* @__PURE__ */ jsx(ReferenceLine, {
|
|
214
|
-
y: referenceLine.y,
|
|
215
|
-
stroke: theme.warning,
|
|
216
|
-
strokeDasharray: "4 4",
|
|
217
|
-
strokeOpacity: .6,
|
|
218
|
-
label: referenceLine.label ? {
|
|
219
|
-
value: referenceLine.label,
|
|
220
|
-
fill: theme.warning,
|
|
221
|
-
fontSize: 9,
|
|
222
|
-
fontFamily: theme.fontMono,
|
|
223
|
-
position: "insideBottomRight"
|
|
224
|
-
} : void 0
|
|
138
|
+
renderReferenceLine({
|
|
139
|
+
referenceLine,
|
|
140
|
+
numericMax,
|
|
141
|
+
theme
|
|
225
142
|
}),
|
|
226
143
|
rendered.map((entry, slot) => /* @__PURE__ */ jsx(Area, {
|
|
227
144
|
type: curveType,
|
|
@@ -233,30 +150,24 @@ function AreaChart({ data, index, series, variant = "stacked", curve = "monotone
|
|
|
233
150
|
strokeDasharray: entry.dashed ? "5 3" : void 0,
|
|
234
151
|
fill: fillFor(entry, slot),
|
|
235
152
|
dot: false,
|
|
236
|
-
activeDot:
|
|
153
|
+
activeDot: makeActiveDot(entry, {
|
|
154
|
+
valueFlags,
|
|
155
|
+
theme,
|
|
156
|
+
valueFormatter
|
|
157
|
+
}),
|
|
237
158
|
isAnimationActive: false,
|
|
238
159
|
animationDuration: 650,
|
|
239
160
|
animationEasing: "ease-out",
|
|
240
161
|
children: lastValueLabel && /* @__PURE__ */ jsx(LabelList, {
|
|
241
162
|
dataKey: entry.key,
|
|
242
|
-
content:
|
|
163
|
+
content: makeLastValueLabel(entry.color, {
|
|
164
|
+
dataLength: data.length,
|
|
165
|
+
theme,
|
|
166
|
+
valueFormatter
|
|
167
|
+
})
|
|
243
168
|
})
|
|
244
169
|
}, entry.key)),
|
|
245
|
-
markers
|
|
246
|
-
x: marker.x,
|
|
247
|
-
y: marker.y,
|
|
248
|
-
r: 3.5,
|
|
249
|
-
fill: marker.color ?? theme.foreground,
|
|
250
|
-
stroke: theme.card,
|
|
251
|
-
strokeWidth: 2,
|
|
252
|
-
label: marker.label ? {
|
|
253
|
-
value: marker.label,
|
|
254
|
-
fill: marker.color ?? theme.foreground,
|
|
255
|
-
fontSize: 9,
|
|
256
|
-
fontFamily: theme.fontMono,
|
|
257
|
-
position: "top"
|
|
258
|
-
} : void 0
|
|
259
|
-
}, `${marker.x}-${marker.y}`))
|
|
170
|
+
renderMarkers(markers, theme)
|
|
260
171
|
]
|
|
261
172
|
})
|
|
262
173
|
})
|
|
@@ -12,13 +12,6 @@ interface AttachmentTileProps {
|
|
|
12
12
|
onClick?: () => void;
|
|
13
13
|
className?: string;
|
|
14
14
|
}
|
|
15
|
-
declare function AttachmentTile({
|
|
16
|
-
src,
|
|
17
|
-
isImage,
|
|
18
|
-
label,
|
|
19
|
-
onRemove,
|
|
20
|
-
onClick,
|
|
21
|
-
className
|
|
22
|
-
}: AttachmentTileProps): import("react").JSX.Element;
|
|
15
|
+
declare function AttachmentTile({ src, isImage, label, onRemove, onClick, className }: AttachmentTileProps): import("react").JSX.Element;
|
|
23
16
|
//#endregion
|
|
24
17
|
export { AttachmentTile, type AttachmentTileProps };
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { VariantProps } from "class-variance-authority";
|
|
2
2
|
import * as React$1 from "react";
|
|
3
3
|
import * as AvatarPrimitive from "@radix-ui/react-avatar";
|
|
4
|
-
|
|
5
4
|
//#region src/components/avatar.d.ts
|
|
6
5
|
declare const avatarVariants: (props?: ({
|
|
7
6
|
size?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
|
|
@@ -11,21 +10,9 @@ type AvatarStatus = "online";
|
|
|
11
10
|
interface AvatarProps extends React$1.ComponentProps<typeof AvatarPrimitive.Root>, VariantProps<typeof avatarVariants> {
|
|
12
11
|
status?: AvatarStatus;
|
|
13
12
|
}
|
|
14
|
-
declare function Avatar({
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
className,
|
|
18
|
-
children,
|
|
19
|
-
...props
|
|
20
|
-
}: AvatarProps): React$1.JSX.Element;
|
|
21
|
-
declare function AvatarImage({
|
|
22
|
-
className,
|
|
23
|
-
...props
|
|
24
|
-
}: React$1.ComponentProps<typeof AvatarPrimitive.Image>): React$1.JSX.Element;
|
|
25
|
-
declare function AvatarFallback({
|
|
26
|
-
className,
|
|
27
|
-
...props
|
|
28
|
-
}: React$1.ComponentProps<typeof AvatarPrimitive.Fallback>): React$1.JSX.Element;
|
|
13
|
+
declare function Avatar({ size, status, className, children, ...props }: AvatarProps): React$1.JSX.Element;
|
|
14
|
+
declare function AvatarImage({ className, ...props }: React$1.ComponentProps<typeof AvatarPrimitive.Image>): React$1.JSX.Element;
|
|
15
|
+
declare function AvatarFallback({ className, ...props }: React$1.ComponentProps<typeof AvatarPrimitive.Fallback>): React$1.JSX.Element;
|
|
29
16
|
interface AvatarLabelGroupProps extends React$1.ComponentProps<"div"> {
|
|
30
17
|
size?: "sm" | "md";
|
|
31
18
|
src?: string;
|
|
@@ -35,16 +22,6 @@ interface AvatarLabelGroupProps extends React$1.ComponentProps<"div"> {
|
|
|
35
22
|
label?: string;
|
|
36
23
|
status?: AvatarStatus;
|
|
37
24
|
}
|
|
38
|
-
declare function AvatarLabelGroup({
|
|
39
|
-
size,
|
|
40
|
-
src,
|
|
41
|
-
alt,
|
|
42
|
-
fallback,
|
|
43
|
-
name,
|
|
44
|
-
label,
|
|
45
|
-
status,
|
|
46
|
-
className,
|
|
47
|
-
...props
|
|
48
|
-
}: AvatarLabelGroupProps): React$1.JSX.Element;
|
|
25
|
+
declare function AvatarLabelGroup({ size, src, alt, fallback, name, label, status, className, ...props }: AvatarLabelGroupProps): React$1.JSX.Element;
|
|
49
26
|
//#endregion
|
|
50
27
|
export { Avatar, AvatarFallback, AvatarImage, AvatarLabelGroup, type AvatarSize, type AvatarStatus };
|
|
@@ -1,18 +1,11 @@
|
|
|
1
1
|
import { VariantProps } from "class-variance-authority";
|
|
2
|
-
|
|
3
2
|
//#region src/components/badge.d.ts
|
|
4
3
|
declare const badgeVariants: (props?: ({
|
|
5
4
|
variant?: "warning" | "success" | "secondary" | "primary" | "error" | null | undefined;
|
|
6
5
|
size?: "sm" | "md" | null | undefined;
|
|
7
6
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
8
7
|
interface BadgeProps extends React.ComponentProps<"span">, VariantProps<typeof badgeVariants> {}
|
|
9
|
-
declare function Badge({
|
|
10
|
-
className,
|
|
11
|
-
variant,
|
|
12
|
-
size,
|
|
13
|
-
children,
|
|
14
|
-
...props
|
|
15
|
-
}: BadgeProps): import("react").JSX.Element;
|
|
8
|
+
declare function Badge({ className, variant, size, children, ...props }: BadgeProps): import("react").JSX.Element;
|
|
16
9
|
type BadgeVariant = NonNullable<VariantProps<typeof badgeVariants>["variant"]>;
|
|
17
10
|
//#endregion
|
|
18
11
|
export { Badge, type BadgeVariant, badgeVariants };
|
|
@@ -2,7 +2,6 @@ import { ChartSeries } from "../lib/chart.mjs";
|
|
|
2
2
|
import { ChartPaletteName } from "../lib/chart-palette.mjs";
|
|
3
3
|
import { ChartMarker } from "./area-chart.mjs";
|
|
4
4
|
import * as React$1 from "react";
|
|
5
|
-
|
|
6
5
|
//#region src/components/bar-chart.d.ts
|
|
7
6
|
interface BarChartProps {
|
|
8
7
|
data: ReadonlyArray<Record<string, string | number | null | undefined>>;
|
|
@@ -28,25 +27,6 @@ interface BarChartProps {
|
|
|
28
27
|
labelFormatter?: (label: string | number) => string;
|
|
29
28
|
className?: string;
|
|
30
29
|
}
|
|
31
|
-
declare function BarChart({
|
|
32
|
-
data,
|
|
33
|
-
index,
|
|
34
|
-
series,
|
|
35
|
-
variant,
|
|
36
|
-
legend,
|
|
37
|
-
legendAlign,
|
|
38
|
-
valueLabels,
|
|
39
|
-
height,
|
|
40
|
-
yAxisWidth,
|
|
41
|
-
palette,
|
|
42
|
-
referenceLine,
|
|
43
|
-
markers,
|
|
44
|
-
texture,
|
|
45
|
-
partialLastBar,
|
|
46
|
-
loading,
|
|
47
|
-
valueFormatter,
|
|
48
|
-
labelFormatter,
|
|
49
|
-
className
|
|
50
|
-
}: BarChartProps): React$1.JSX.Element;
|
|
30
|
+
declare function BarChart({ data, index, series, variant, legend, legendAlign, valueLabels, height, yAxisWidth, palette, referenceLine, markers, texture, partialLastBar, loading, valueFormatter, labelFormatter, className }: BarChartProps): React$1.JSX.Element;
|
|
51
31
|
//#endregion
|
|
52
32
|
export { BarChart, BarChartProps };
|
|
@@ -3,11 +3,12 @@ import { cn } from "../lib/cn.mjs";
|
|
|
3
3
|
import { makeXAxisTick, orderByLuminance, resolveSeries } from "../lib/chart.mjs";
|
|
4
4
|
import { useChartContext } from "./chart-container.mjs";
|
|
5
5
|
import { ChartLegend } from "./chart-legend.mjs";
|
|
6
|
+
import { computeNumericMax, makeChartAxis, makeLegendItems, renderMarkers, renderReferenceLine } from "./chart-primitives.mjs";
|
|
6
7
|
import { ChartTooltipContent } from "./chart-tooltip.mjs";
|
|
7
8
|
import { Skeleton } from "./skeleton.mjs";
|
|
8
9
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
9
10
|
import * as React$1 from "react";
|
|
10
|
-
import { Bar, BarChart as BarChart$1, CartesianGrid, Cell, LabelList,
|
|
11
|
+
import { Bar, BarChart as BarChart$1, CartesianGrid, Cell, LabelList, ResponsiveContainer, Tooltip, XAxis, YAxis } from "recharts";
|
|
11
12
|
//#region src/components/bar-chart.tsx
|
|
12
13
|
const BAR_RADIUS = 4;
|
|
13
14
|
const MAX_BAR_SIZE = 48;
|
|
@@ -19,21 +20,7 @@ function BarChart({ data, index, series, variant = "stacked", legend = false, le
|
|
|
19
20
|
const rendered = stacked ? orderByLuminance(resolved) : resolved;
|
|
20
21
|
const lead = resolved[0];
|
|
21
22
|
const withTotal = stacked && rendered.length > 1;
|
|
22
|
-
const numericMax = React$1.useMemo(() =>
|
|
23
|
-
let max = 0;
|
|
24
|
-
for (const row of data) {
|
|
25
|
-
let rowTotal = 0;
|
|
26
|
-
for (const entry of series) {
|
|
27
|
-
const value = Number(row[entry.key]);
|
|
28
|
-
if (Number.isFinite(value)) {
|
|
29
|
-
rowTotal += value;
|
|
30
|
-
if (!stacked && value > max) max = value;
|
|
31
|
-
}
|
|
32
|
-
}
|
|
33
|
-
if (stacked && rowTotal > max) max = rowTotal;
|
|
34
|
-
}
|
|
35
|
-
return max;
|
|
36
|
-
}, [
|
|
23
|
+
const numericMax = React$1.useMemo(() => computeNumericMax(data, series, stacked), [
|
|
37
24
|
data,
|
|
38
25
|
series,
|
|
39
26
|
stacked
|
|
@@ -58,24 +45,8 @@ function BarChart({ data, index, series, variant = "stacked", legend = false, le
|
|
|
58
45
|
bottom: 2,
|
|
59
46
|
left: 0
|
|
60
47
|
};
|
|
61
|
-
const axis =
|
|
62
|
-
|
|
63
|
-
tick: {
|
|
64
|
-
fill: theme.axisForeground,
|
|
65
|
-
fontSize: 10,
|
|
66
|
-
fontFamily: theme.fontMono
|
|
67
|
-
},
|
|
68
|
-
tickLine: false,
|
|
69
|
-
axisLine: {
|
|
70
|
-
stroke: theme.border,
|
|
71
|
-
strokeOpacity: .6
|
|
72
|
-
}
|
|
73
|
-
};
|
|
74
|
-
const legendItems = resolved.map((entry) => ({
|
|
75
|
-
name: entry.name,
|
|
76
|
-
color: entry.color,
|
|
77
|
-
dashed: entry.dashed
|
|
78
|
-
}));
|
|
48
|
+
const axis = makeChartAxis(theme);
|
|
49
|
+
const legendItems = makeLegendItems(resolved);
|
|
79
50
|
const radiusFor = (slot) => {
|
|
80
51
|
if (!stacked || slot === rendered.length - 1) return [
|
|
81
52
|
BAR_RADIUS,
|
|
@@ -201,25 +172,10 @@ function BarChart({ data, index, series, variant = "stacked", legend = false, le
|
|
|
201
172
|
showTotal: withTotal
|
|
202
173
|
})
|
|
203
174
|
}),
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
fillOpacity: .06,
|
|
209
|
-
ifOverflow: "extendDomain"
|
|
210
|
-
}),
|
|
211
|
-
referenceLine && /* @__PURE__ */ jsx(ReferenceLine, {
|
|
212
|
-
y: referenceLine.y,
|
|
213
|
-
stroke: theme.warning,
|
|
214
|
-
strokeDasharray: "4 4",
|
|
215
|
-
strokeOpacity: .6,
|
|
216
|
-
label: referenceLine.label ? {
|
|
217
|
-
value: referenceLine.label,
|
|
218
|
-
fill: theme.warning,
|
|
219
|
-
fontSize: 9,
|
|
220
|
-
fontFamily: theme.fontMono,
|
|
221
|
-
position: "insideBottomRight"
|
|
222
|
-
} : void 0
|
|
175
|
+
renderReferenceLine({
|
|
176
|
+
referenceLine,
|
|
177
|
+
numericMax,
|
|
178
|
+
theme
|
|
223
179
|
}),
|
|
224
180
|
rendered.map((entry, slot) => /* @__PURE__ */ jsxs(Bar, {
|
|
225
181
|
dataKey: entry.key,
|
|
@@ -259,21 +215,7 @@ function BarChart({ data, index, series, variant = "stacked", legend = false, le
|
|
|
259
215
|
content: renderValueLabel(entry.color)
|
|
260
216
|
})]
|
|
261
217
|
}, entry.key)),
|
|
262
|
-
markers
|
|
263
|
-
x: marker.x,
|
|
264
|
-
y: marker.y,
|
|
265
|
-
r: 3.5,
|
|
266
|
-
fill: marker.color ?? theme.foreground,
|
|
267
|
-
stroke: theme.card,
|
|
268
|
-
strokeWidth: 2,
|
|
269
|
-
label: marker.label ? {
|
|
270
|
-
value: marker.label,
|
|
271
|
-
fill: marker.color ?? theme.foreground,
|
|
272
|
-
fontSize: 9,
|
|
273
|
-
fontFamily: theme.fontMono,
|
|
274
|
-
position: "top"
|
|
275
|
-
} : void 0
|
|
276
|
-
}, `${marker.x}-${marker.y}`))
|
|
218
|
+
renderMarkers(markers, theme)
|
|
277
219
|
]
|
|
278
220
|
})
|
|
279
221
|
})
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { ChartPaletteName } from "../lib/chart-palette.mjs";
|
|
2
2
|
import * as React$1 from "react";
|
|
3
|
-
|
|
4
3
|
//#region src/components/bar-list.d.ts
|
|
5
4
|
interface BarListProps {
|
|
6
5
|
data: ReadonlyArray<Record<string, string | number | null | undefined>>;
|
|
@@ -15,17 +14,6 @@ interface BarListProps {
|
|
|
15
14
|
labelFormatter?: (label: string | number) => string;
|
|
16
15
|
className?: string;
|
|
17
16
|
}
|
|
18
|
-
declare function BarList({
|
|
19
|
-
data,
|
|
20
|
-
index,
|
|
21
|
-
dataKey,
|
|
22
|
-
maxItems,
|
|
23
|
-
palette,
|
|
24
|
-
semantic,
|
|
25
|
-
loading,
|
|
26
|
-
valueFormatter,
|
|
27
|
-
labelFormatter,
|
|
28
|
-
className
|
|
29
|
-
}: BarListProps): React$1.JSX.Element;
|
|
17
|
+
declare function BarList({ data, index, dataKey, maxItems, palette, semantic, loading, valueFormatter, labelFormatter, className }: BarListProps): React$1.JSX.Element;
|
|
30
18
|
//#endregion
|
|
31
19
|
export { BarList, BarListProps };
|
|
@@ -1,41 +1,14 @@
|
|
|
1
1
|
import * as React$1 from "react";
|
|
2
|
-
|
|
3
2
|
//#region src/components/breadcrumb.d.ts
|
|
4
|
-
declare function Breadcrumb({
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
}: React$1.ComponentProps<"
|
|
8
|
-
declare function BreadcrumbList({
|
|
9
|
-
className,
|
|
10
|
-
...props
|
|
11
|
-
}: React$1.ComponentProps<"ol">): React$1.JSX.Element;
|
|
12
|
-
declare function BreadcrumbItem({
|
|
13
|
-
className,
|
|
14
|
-
...props
|
|
15
|
-
}: React$1.ComponentProps<"li">): React$1.JSX.Element;
|
|
16
|
-
declare function BreadcrumbLink({
|
|
17
|
-
asChild,
|
|
18
|
-
className,
|
|
19
|
-
...props
|
|
20
|
-
}: React$1.ComponentProps<"a"> & {
|
|
3
|
+
declare function Breadcrumb({ className, ...props }: React$1.ComponentProps<"nav">): React$1.JSX.Element;
|
|
4
|
+
declare function BreadcrumbList({ className, ...props }: React$1.ComponentProps<"ol">): React$1.JSX.Element;
|
|
5
|
+
declare function BreadcrumbItem({ className, ...props }: React$1.ComponentProps<"li">): React$1.JSX.Element;
|
|
6
|
+
declare function BreadcrumbLink({ asChild, className, ...props }: React$1.ComponentProps<"a"> & {
|
|
21
7
|
asChild?: boolean;
|
|
22
8
|
}): React$1.JSX.Element;
|
|
23
|
-
declare function BreadcrumbPage({
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
}: React$1.ComponentProps<"span">): React$1.JSX.Element;
|
|
27
|
-
declare function BreadcrumbSeparator({
|
|
28
|
-
children,
|
|
29
|
-
className,
|
|
30
|
-
...props
|
|
31
|
-
}: React$1.ComponentProps<"li">): React$1.JSX.Element;
|
|
32
|
-
declare function BreadcrumbChevron({
|
|
33
|
-
className,
|
|
34
|
-
...props
|
|
35
|
-
}: React$1.ComponentProps<"span">): React$1.JSX.Element;
|
|
36
|
-
declare function BreadcrumbEllipsis({
|
|
37
|
-
className,
|
|
38
|
-
...props
|
|
39
|
-
}: React$1.ComponentProps<"span">): React$1.JSX.Element;
|
|
9
|
+
declare function BreadcrumbPage({ className, ...props }: React$1.ComponentProps<"span">): React$1.JSX.Element;
|
|
10
|
+
declare function BreadcrumbSeparator({ children, className, ...props }: React$1.ComponentProps<"li">): React$1.JSX.Element;
|
|
11
|
+
declare function BreadcrumbChevron({ className, ...props }: React$1.ComponentProps<"span">): React$1.JSX.Element;
|
|
12
|
+
declare function BreadcrumbEllipsis({ className, ...props }: React$1.ComponentProps<"span">): React$1.JSX.Element;
|
|
40
13
|
//#endregion
|
|
41
14
|
export { Breadcrumb, BreadcrumbChevron, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator };
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { VariantProps } from "class-variance-authority";
|
|
2
2
|
import * as React$1 from "react";
|
|
3
|
-
|
|
4
3
|
//#region src/components/button.d.ts
|
|
5
4
|
declare const buttonVariants: (props?: ({
|
|
6
5
|
variant?: "destructive" | "secondary" | "primary" | "tertiary" | "link" | "link-muted" | "cta" | null | undefined;
|
|
@@ -12,18 +11,6 @@ interface ButtonProps extends React$1.ComponentProps<"button">, VariantProps<typ
|
|
|
12
11
|
icon?: React$1.ReactNode;
|
|
13
12
|
iconTrailing?: React$1.ReactNode;
|
|
14
13
|
}
|
|
15
|
-
declare function Button({
|
|
16
|
-
className,
|
|
17
|
-
variant,
|
|
18
|
-
size,
|
|
19
|
-
type,
|
|
20
|
-
asChild,
|
|
21
|
-
loading,
|
|
22
|
-
icon,
|
|
23
|
-
iconTrailing,
|
|
24
|
-
disabled,
|
|
25
|
-
children,
|
|
26
|
-
...props
|
|
27
|
-
}: ButtonProps): React$1.JSX.Element;
|
|
14
|
+
declare function Button({ className, variant, size, type, asChild, loading, icon, iconTrailing, disabled, children, ...props }: ButtonProps): React$1.JSX.Element;
|
|
28
15
|
//#endregion
|
|
29
16
|
export { Button, type ButtonProps, buttonVariants };
|