@agent-native/toolkit 0.8.2 → 0.9.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +30 -0
- package/agent-native.eject.json +33 -0
- package/dist/dashboard/DataTable.d.ts +20 -0
- package/dist/dashboard/DataTable.d.ts.map +1 -0
- package/dist/dashboard/DataTable.js +87 -0
- package/dist/dashboard/DataTable.js.map +1 -0
- package/dist/dashboard/DateRangePicker.d.ts +15 -0
- package/dist/dashboard/DateRangePicker.d.ts.map +1 -0
- package/dist/dashboard/DateRangePicker.js +15 -0
- package/dist/dashboard/DateRangePicker.js.map +1 -0
- package/dist/dashboard/GenericChartPanel.d.ts +57 -0
- package/dist/dashboard/GenericChartPanel.d.ts.map +1 -0
- package/dist/dashboard/GenericChartPanel.js +119 -0
- package/dist/dashboard/GenericChartPanel.js.map +1 -0
- package/dist/dashboard/GenericChartPanel.spec.d.ts +2 -0
- package/dist/dashboard/GenericChartPanel.spec.d.ts.map +1 -0
- package/dist/dashboard/GenericChartPanel.spec.js +41 -0
- package/dist/dashboard/GenericChartPanel.spec.js.map +1 -0
- package/dist/dashboard/MetricCard.d.ts +14 -0
- package/dist/dashboard/MetricCard.d.ts.map +1 -0
- package/dist/dashboard/MetricCard.js +10 -0
- package/dist/dashboard/MetricCard.js.map +1 -0
- package/dist/dashboard/StatsCard.d.ts +16 -0
- package/dist/dashboard/StatsCard.d.ts.map +1 -0
- package/dist/dashboard/StatsCard.js +8 -0
- package/dist/dashboard/StatsCard.js.map +1 -0
- package/dist/dashboard/dashboard-layout.d.ts +49 -0
- package/dist/dashboard/dashboard-layout.d.ts.map +1 -0
- package/dist/dashboard/dashboard-layout.js +231 -0
- package/dist/dashboard/dashboard-layout.js.map +1 -0
- package/dist/dashboard/dashboard-layout.spec.d.ts +2 -0
- package/dist/dashboard/dashboard-layout.spec.d.ts.map +1 -0
- package/dist/dashboard/dashboard-layout.spec.js +52 -0
- package/dist/dashboard/dashboard-layout.spec.js.map +1 -0
- package/dist/dashboard/index.d.ts +7 -0
- package/dist/dashboard/index.d.ts.map +1 -0
- package/dist/dashboard/index.js +7 -0
- package/dist/dashboard/index.js.map +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -0
- package/dist/index.js.map +1 -1
- package/dist/ui/calendar.js +8 -8
- package/dist/ui/calendar.js.map +1 -1
- package/dist/ui/date-picker.d.ts.map +1 -1
- package/dist/ui/date-picker.js +1 -1
- package/dist/ui/date-picker.js.map +1 -1
- package/package.json +15 -1
- package/src/dashboard/DataTable.tsx +273 -0
- package/src/dashboard/DateRangePicker.tsx +57 -0
- package/src/dashboard/GenericChartPanel.spec.tsx +53 -0
- package/src/dashboard/GenericChartPanel.tsx +461 -0
- package/src/dashboard/MetricCard.tsx +54 -0
- package/src/dashboard/StatsCard.tsx +49 -0
- package/src/dashboard/dashboard-layout.spec.ts +79 -0
- package/src/dashboard/dashboard-layout.ts +329 -0
- package/src/dashboard/index.ts +6 -0
- package/src/index.ts +1 -0
- package/src/ui/calendar.tsx +8 -8
- package/src/ui/date-picker.tsx +4 -1
package/README.md
CHANGED
|
@@ -28,6 +28,14 @@ import { ToolkitProvider } from "@agent-native/toolkit/provider";
|
|
|
28
28
|
import { ChatHistoryList } from "@agent-native/toolkit/chat-history";
|
|
29
29
|
import { PresenceBar } from "@agent-native/toolkit/collab-ui";
|
|
30
30
|
import { ContextMeterView } from "@agent-native/toolkit/context-ui";
|
|
31
|
+
import {
|
|
32
|
+
DataTable,
|
|
33
|
+
DateRangePicker,
|
|
34
|
+
GenericChartPanel,
|
|
35
|
+
MetricCard,
|
|
36
|
+
StatsCard,
|
|
37
|
+
buildDashboardPanelGroups,
|
|
38
|
+
} from "@agent-native/toolkit/dashboard";
|
|
31
39
|
import { VisualTweakControl } from "@agent-native/toolkit/design-tweaks";
|
|
32
40
|
import { SharedRichEditor } from "@agent-native/toolkit/editor";
|
|
33
41
|
import { VisibilityBadge } from "@agent-native/toolkit/sharing";
|
|
@@ -45,6 +53,28 @@ import `@agent-native/toolkit/chat-history.css`.
|
|
|
45
53
|
Inside template apps, prefer local adapters such as `@/components/ui/button` so
|
|
46
54
|
apps can replace their primitives without changing every callsite.
|
|
47
55
|
|
|
56
|
+
## Dashboard kit
|
|
57
|
+
|
|
58
|
+
`@agent-native/toolkit/dashboard` is an ejectable, presentation-only dashboard
|
|
59
|
+
kit. It includes metric and stats cards, tables, a date-range picker, panel
|
|
60
|
+
ordering and layout helpers, and `GenericChartPanel`. Supply rows, schema, and
|
|
61
|
+
callbacks through app-owned action-backed adapters; the kit never fetches data,
|
|
62
|
+
stores dashboard state, resolves credentials, or imports Core runtime APIs.
|
|
63
|
+
|
|
64
|
+
Inspect or take ownership of the complete unit with:
|
|
65
|
+
|
|
66
|
+
```bash
|
|
67
|
+
agent-native eject inspect toolkit/dashboard
|
|
68
|
+
agent-native eject toolkit/dashboard --app <app> --apply
|
|
69
|
+
```
|
|
70
|
+
|
|
71
|
+
For durable dashboards, use `@agent-native/core/dashboard-storage` in the app's
|
|
72
|
+
server layer. Instantiate its schema and access-scoped store per app, rather
|
|
73
|
+
than sharing dashboard rows between apps. Resolve panel data with a
|
|
74
|
+
`PanelSourceResolver`; the built-in `program` resolver runs an app-owned data
|
|
75
|
+
program and is the zero-wiring default. Provider-specific resolvers stay in the
|
|
76
|
+
app that owns their credentials and query policy.
|
|
77
|
+
|
|
48
78
|
## Customize Or Take Ownership
|
|
49
79
|
|
|
50
80
|
Use public props, slots, callbacks, stable classes, and local adapters first.
|
package/agent-native.eject.json
CHANGED
|
@@ -133,6 +133,7 @@
|
|
|
133
133
|
"@tabler/icons-react",
|
|
134
134
|
"clsx",
|
|
135
135
|
"react",
|
|
136
|
+
"recharts",
|
|
136
137
|
"tailwind-merge"
|
|
137
138
|
],
|
|
138
139
|
"verification": ["pnpm typecheck"]
|
|
@@ -206,6 +207,38 @@
|
|
|
206
207
|
],
|
|
207
208
|
"verification": ["pnpm typecheck"]
|
|
208
209
|
},
|
|
210
|
+
{
|
|
211
|
+
"id": "toolkit/dashboard",
|
|
212
|
+
"label": "Dashboard kit",
|
|
213
|
+
"catalog": "toolkit-ui",
|
|
214
|
+
"catalogItems": ["dashboard"],
|
|
215
|
+
"entrypoints": ["./dashboard", "./dashboard/*"],
|
|
216
|
+
"strategy": "source-copy",
|
|
217
|
+
"sourceEntries": ["src/dashboard"],
|
|
218
|
+
"targetRoot": "app/components/agent-native/toolkit",
|
|
219
|
+
"dependencies": [
|
|
220
|
+
"@radix-ui/react-select",
|
|
221
|
+
"@radix-ui/react-slot",
|
|
222
|
+
"@tabler/icons-react",
|
|
223
|
+
"class-variance-authority",
|
|
224
|
+
"clsx",
|
|
225
|
+
"react",
|
|
226
|
+
"recharts",
|
|
227
|
+
"tailwind-merge"
|
|
228
|
+
],
|
|
229
|
+
"protectedImports": [
|
|
230
|
+
"@agent-native/toolkit/ui/button",
|
|
231
|
+
"@agent-native/toolkit/ui/card",
|
|
232
|
+
"@agent-native/toolkit/ui/select",
|
|
233
|
+
"@agent-native/toolkit/ui/skeleton",
|
|
234
|
+
"@agent-native/toolkit/ui/table",
|
|
235
|
+
"@agent-native/toolkit/utils"
|
|
236
|
+
],
|
|
237
|
+
"verification": [
|
|
238
|
+
"pnpm --filter @agent-native/toolkit typecheck",
|
|
239
|
+
"pnpm --filter @agent-native/toolkit test"
|
|
240
|
+
]
|
|
241
|
+
},
|
|
209
242
|
{
|
|
210
243
|
"id": "toolkit/editor",
|
|
211
244
|
"label": "Rich editor",
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
export interface DataTableLabels {
|
|
2
|
+
noData: string;
|
|
3
|
+
rowsPerPage: string;
|
|
4
|
+
of: string;
|
|
5
|
+
previousPage: string;
|
|
6
|
+
nextPage: string;
|
|
7
|
+
}
|
|
8
|
+
export interface DataTableProps {
|
|
9
|
+
title?: string;
|
|
10
|
+
data: Record<string, unknown>[];
|
|
11
|
+
columns?: string[];
|
|
12
|
+
loading?: boolean;
|
|
13
|
+
error?: string;
|
|
14
|
+
maxRows?: number;
|
|
15
|
+
pageSizeOptions?: number[];
|
|
16
|
+
labels?: Partial<DataTableLabels>;
|
|
17
|
+
}
|
|
18
|
+
/** A source-agnostic, sortable and paginated dashboard table. */
|
|
19
|
+
export declare function DataTable({ title, data, columns: columnsProp, loading, error, maxRows, pageSizeOptions, labels: labelOverrides, }: DataTableProps): import("react").JSX.Element;
|
|
20
|
+
//# sourceMappingURL=DataTable.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DataTable.d.ts","sourceRoot":"","sources":["../../src/dashboard/DataTable.tsx"],"names":[],"mappings":"AA8BA,MAAM,WAAW,eAAe;IAC9B,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IACpB,EAAE,EAAE,MAAM,CAAC;IACX,YAAY,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,cAAc;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,CAAC;IAChC,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,eAAe,CAAC,EAAE,MAAM,EAAE,CAAC;IAC3B,MAAM,CAAC,EAAE,OAAO,CAAC,eAAe,CAAC,CAAC;CACnC;AAUD,iEAAiE;AACjE,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,IAAI,EACJ,OAAO,EAAE,WAAW,EACpB,OAAO,EACP,KAAK,EACL,OAAO,EACP,eAA2C,EAC3C,MAAM,EAAE,cAAc,GACvB,EAAE,cAAc,+BA6JhB"}
|
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { IconArrowsUpDown, IconChevronLeft, IconChevronRight, } from "@tabler/icons-react";
|
|
3
|
+
import { useMemo, useState } from "react";
|
|
4
|
+
import { Button } from "../ui/button.js";
|
|
5
|
+
import { Card, CardContent, CardHeader, CardTitle } from "../ui/card.js";
|
|
6
|
+
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from "../ui/select.js";
|
|
7
|
+
import { Skeleton } from "../ui/skeleton.js";
|
|
8
|
+
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow, } from "../ui/table.js";
|
|
9
|
+
import { cn } from "../utils.js";
|
|
10
|
+
const DEFAULT_PAGE_SIZE_OPTIONS = [10, 25, 50, 100];
|
|
11
|
+
const TABLE_MIN_HEIGHT_CLASS = "min-h-[386px]";
|
|
12
|
+
const DEFAULT_LABELS = {
|
|
13
|
+
noData: "No data available.",
|
|
14
|
+
rowsPerPage: "Rows per page",
|
|
15
|
+
of: "of",
|
|
16
|
+
previousPage: "Previous page",
|
|
17
|
+
nextPage: "Next page",
|
|
18
|
+
};
|
|
19
|
+
/** A source-agnostic, sortable and paginated dashboard table. */
|
|
20
|
+
export function DataTable({ title, data, columns: columnsProp, loading, error, maxRows, pageSizeOptions = DEFAULT_PAGE_SIZE_OPTIONS, labels: labelOverrides, }) {
|
|
21
|
+
const labels = { ...DEFAULT_LABELS, ...labelOverrides };
|
|
22
|
+
const [sortColumn, setSortColumn] = useState(null);
|
|
23
|
+
const [sortDirection, setSortDirection] = useState("desc");
|
|
24
|
+
const [page, setPage] = useState(0);
|
|
25
|
+
const [pageSize, setPageSize] = useState(pageSizeOptions[0] ?? 10);
|
|
26
|
+
const columns = useMemo(() => {
|
|
27
|
+
if (columnsProp)
|
|
28
|
+
return columnsProp;
|
|
29
|
+
return data.length === 0 ? [] : Object.keys(data[0]);
|
|
30
|
+
}, [columnsProp, data]);
|
|
31
|
+
const rows = useMemo(() => maxRows != null && data.length > maxRows ? data.slice(0, maxRows) : data, [data, maxRows]);
|
|
32
|
+
const sortedRows = useMemo(() => {
|
|
33
|
+
if (!sortColumn)
|
|
34
|
+
return rows;
|
|
35
|
+
return [...rows].sort((a, b) => {
|
|
36
|
+
const aValue = a[sortColumn];
|
|
37
|
+
const bValue = b[sortColumn];
|
|
38
|
+
if (aValue == null && bValue == null)
|
|
39
|
+
return 0;
|
|
40
|
+
if (aValue == null)
|
|
41
|
+
return 1;
|
|
42
|
+
if (bValue == null)
|
|
43
|
+
return -1;
|
|
44
|
+
const comparison = typeof aValue === "number" && typeof bValue === "number"
|
|
45
|
+
? aValue - bValue
|
|
46
|
+
: String(aValue).localeCompare(String(bValue));
|
|
47
|
+
return sortDirection === "asc" ? comparison : -comparison;
|
|
48
|
+
});
|
|
49
|
+
}, [rows, sortColumn, sortDirection]);
|
|
50
|
+
const pageCount = Math.ceil(sortedRows.length / pageSize);
|
|
51
|
+
const pagedRows = sortedRows.slice(page * pageSize, (page + 1) * pageSize);
|
|
52
|
+
const handleSort = (column) => {
|
|
53
|
+
if (sortColumn === column) {
|
|
54
|
+
setSortDirection((direction) => (direction === "asc" ? "desc" : "asc"));
|
|
55
|
+
}
|
|
56
|
+
else {
|
|
57
|
+
setSortColumn(column);
|
|
58
|
+
setSortDirection("desc");
|
|
59
|
+
}
|
|
60
|
+
setPage(0);
|
|
61
|
+
};
|
|
62
|
+
const content = loading ? (_jsx(DataTableLoadingSkeleton, {})) : error ? (_jsx("p", { className: "py-4 text-sm text-destructive", children: error })) : data.length === 0 ? (_jsx("p", { className: "py-4 text-center text-sm text-muted-foreground", children: labels.noData })) : (_jsxs("div", { className: cn("overflow-x-auto", TABLE_MIN_HEIGHT_CLASS), children: [_jsxs(Table, { children: [_jsx(TableHeader, { children: _jsx(TableRow, { children: columns.map((column) => (_jsx(TableHead, { className: "cursor-pointer select-none whitespace-nowrap hover:text-foreground", onClick: () => handleSort(column), children: _jsxs("span", { className: "flex items-center gap-1", children: [column, _jsx(IconArrowsUpDown, { className: cn("h-3 w-3", sortColumn === column
|
|
63
|
+
? "text-foreground"
|
|
64
|
+
: "text-muted-foreground/50") })] }) }, column))) }) }), _jsx(TableBody, { children: pagedRows.map((row, index) => (_jsx(TableRow, { children: columns.map((column) => (_jsx(TableCell, { className: "max-w-[300px] truncate whitespace-nowrap", children: formatValue(row[column]) }, column))) }, index))) })] }), sortedRows.length > (pageSizeOptions[0] ?? 10) && (_jsxs("div", { className: "flex items-center justify-between border-t border-border px-2 py-2 text-xs text-muted-foreground", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { children: labels.rowsPerPage }), _jsxs(Select, { value: String(pageSize), onValueChange: (value) => {
|
|
65
|
+
setPageSize(Number(value));
|
|
66
|
+
setPage(0);
|
|
67
|
+
}, children: [_jsx(SelectTrigger, { className: "h-6 w-16 border-border px-2 py-0 text-xs", children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: pageSizeOptions.map((size) => (_jsx(SelectItem, { value: String(size), children: size }, size))) })] })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs("span", { children: [page * pageSize + 1, "\u2013", Math.min((page + 1) * pageSize, sortedRows.length), " ", labels.of, " ", sortedRows.length] }), _jsx(Button, { "aria-label": labels.previousPage, variant: "ghost", size: "icon", className: "h-6 w-6", onClick: () => setPage((current) => current - 1), disabled: page === 0, children: _jsx(IconChevronLeft, { className: "h-3.5 w-3.5" }) }), _jsx(Button, { "aria-label": labels.nextPage, variant: "ghost", size: "icon", className: "h-6 w-6", onClick: () => setPage((current) => current + 1), disabled: page >= pageCount - 1, children: _jsx(IconChevronRight, { className: "h-3.5 w-3.5" }) })] })] }))] }));
|
|
68
|
+
if (!title)
|
|
69
|
+
return content;
|
|
70
|
+
return (_jsxs(Card, { className: "border-border/50 bg-card", children: [_jsx(CardHeader, { children: _jsx(CardTitle, { className: "text-base", children: title }) }), _jsx(CardContent, { children: content })] }));
|
|
71
|
+
}
|
|
72
|
+
function formatValue(value) {
|
|
73
|
+
if (value == null)
|
|
74
|
+
return "-";
|
|
75
|
+
if (typeof value === "number")
|
|
76
|
+
return Number.isInteger(value) ? value.toLocaleString() : value.toFixed(4);
|
|
77
|
+
return typeof value === "object" ? JSON.stringify(value) : String(value);
|
|
78
|
+
}
|
|
79
|
+
function DataTableLoadingSkeleton() {
|
|
80
|
+
const columnWidths = ["w-24", "w-32", "w-20", "w-28"];
|
|
81
|
+
return (_jsxs("div", { className: cn("space-y-1", TABLE_MIN_HEIGHT_CLASS), children: [_jsx("div", { className: "overflow-x-auto", children: _jsxs("div", { className: "min-w-[480px]", children: [_jsx("div", { className: "grid h-8 grid-cols-4 items-center border-b border-border px-2", children: columnWidths.map((width, index) => (_jsx(Skeleton, { className: cn("h-3", width) }, index))) }), Array.from({ length: 10 }).map((_, row) => (_jsx("div", { className: "grid h-8 grid-cols-4 items-center border-b border-border/50 px-2", children: columnWidths.map((width, column) => (_jsx(Skeleton, { className: cn("h-3", column === 0
|
|
82
|
+
? "w-36"
|
|
83
|
+
: column === 2
|
|
84
|
+
? "ml-auto w-16"
|
|
85
|
+
: width) }, column))) }, row)))] }) }), _jsxs("div", { className: "flex h-8 items-center justify-between border-t border-border px-2 text-xs", children: [_jsx(Skeleton, { className: "h-3 w-28" }), _jsx(Skeleton, { className: "h-3 w-24" })] })] }));
|
|
86
|
+
}
|
|
87
|
+
//# sourceMappingURL=DataTable.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DataTable.js","sourceRoot":"","sources":["../../src/dashboard/DataTable.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
export type DateRange = "7d" | "30d" | "90d";
|
|
2
|
+
export interface DateRangeOption {
|
|
3
|
+
value: DateRange;
|
|
4
|
+
label: string;
|
|
5
|
+
}
|
|
6
|
+
export interface DateRangePickerProps {
|
|
7
|
+
value: DateRange;
|
|
8
|
+
onChange: (range: DateRange) => void;
|
|
9
|
+
options?: DateRangeOption[];
|
|
10
|
+
className?: string;
|
|
11
|
+
}
|
|
12
|
+
export declare const DEFAULT_DATE_RANGE_OPTIONS: DateRangeOption[];
|
|
13
|
+
export declare function dateRangeToInterval(range: DateRange): number;
|
|
14
|
+
export declare function DateRangePicker({ value, onChange, options, className, }: DateRangePickerProps): import("react").JSX.Element;
|
|
15
|
+
//# sourceMappingURL=DateRangePicker.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DateRangePicker.d.ts","sourceRoot":"","sources":["../../src/dashboard/DateRangePicker.tsx"],"names":[],"mappings":"AAGA,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,KAAK,GAAG,KAAK,CAAC;AAE7C,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,SAAS,CAAC;IACjB,QAAQ,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IACrC,OAAO,CAAC,EAAE,eAAe,EAAE,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,0BAA0B,EAAE,eAAe,EAIvD,CAAC;AAEF,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,SAAS,GAAG,MAAM,CAE5D;AAED,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EACL,QAAQ,EACR,OAAoC,EACpC,SAAS,GACV,EAAE,oBAAoB,+BAwBtB"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { Button } from "../ui/button.js";
|
|
3
|
+
import { cn } from "../utils.js";
|
|
4
|
+
export const DEFAULT_DATE_RANGE_OPTIONS = [
|
|
5
|
+
{ value: "7d", label: "7 days" },
|
|
6
|
+
{ value: "30d", label: "30 days" },
|
|
7
|
+
{ value: "90d", label: "90 days" },
|
|
8
|
+
];
|
|
9
|
+
export function dateRangeToInterval(range) {
|
|
10
|
+
return Number.parseInt(range, 10);
|
|
11
|
+
}
|
|
12
|
+
export function DateRangePicker({ value, onChange, options = DEFAULT_DATE_RANGE_OPTIONS, className, }) {
|
|
13
|
+
return (_jsx("div", { className: cn("flex items-center gap-1 rounded-lg border border-border p-1", className), children: options.map((option) => (_jsx(Button, { variant: "ghost", size: "sm", className: cn("h-7 px-3 text-xs", value === option.value && "bg-secondary text-secondary-foreground"), onClick: () => onChange(option.value), children: option.label }, option.value))) }));
|
|
14
|
+
}
|
|
15
|
+
//# sourceMappingURL=DateRangePicker.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DateRangePicker.js","sourceRoot":"","sources":["../../src/dashboard/DateRangePicker.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACzC,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AAgBjC,MAAM,CAAC,MAAM,0BAA0B,GAAsB;IAC3D,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE;IAChC,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE;IAClC,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE;CACnC,CAAC;AAEF,MAAM,UAAU,mBAAmB,CAAC,KAAgB;IAClD,OAAO,MAAM,CAAC,QAAQ,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;AACpC,CAAC;AAED,MAAM,UAAU,eAAe,CAAC,EAC9B,KAAK,EACL,QAAQ,EACR,OAAO,GAAG,0BAA0B,EACpC,SAAS,GACY;IACrB,OAAO,CACL,cACE,SAAS,EAAE,EAAE,CACX,6DAA6D,EAC7D,SAAS,CACV,YAEA,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CACvB,KAAC,MAAM,IAEL,OAAO,EAAC,OAAO,EACf,IAAI,EAAC,IAAI,EACT,SAAS,EAAE,EAAE,CACX,kBAAkB,EAClB,KAAK,KAAK,MAAM,CAAC,KAAK,IAAI,wCAAwC,CACnE,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,YAEpC,MAAM,CAAC,KAAK,IATR,MAAM,CAAC,KAAK,CAUV,CACV,CAAC,GACE,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
import type { ReactNode } from "react";
|
|
2
|
+
export type GenericChartDatum = Record<string, unknown>;
|
|
3
|
+
export type GenericChartType = "metric" | "line" | "area" | "bar" | "stacked-bar" | "stacked-area" | "pie" | "donut" | "table";
|
|
4
|
+
export interface GenericChartConfig {
|
|
5
|
+
chartType: GenericChartType;
|
|
6
|
+
xKey?: string;
|
|
7
|
+
yKey?: string;
|
|
8
|
+
yKeys?: string[];
|
|
9
|
+
colors?: string[];
|
|
10
|
+
stacked?: boolean;
|
|
11
|
+
legend?: boolean;
|
|
12
|
+
description?: string;
|
|
13
|
+
columns?: string[];
|
|
14
|
+
limit?: number;
|
|
15
|
+
formatValue?: (value: number) => string;
|
|
16
|
+
formatXAxis?: (value: string) => string;
|
|
17
|
+
formatSeriesName?: (value: string) => string;
|
|
18
|
+
}
|
|
19
|
+
export interface GenericChartRenderContext<TData, TConfig> {
|
|
20
|
+
data: TData;
|
|
21
|
+
config: TConfig;
|
|
22
|
+
}
|
|
23
|
+
export interface GenericChartPanelProps<TData, TConfig> {
|
|
24
|
+
data: TData | null | undefined;
|
|
25
|
+
config: TConfig;
|
|
26
|
+
loading?: boolean;
|
|
27
|
+
error?: ReactNode;
|
|
28
|
+
isEmpty?: (data: TData) => boolean;
|
|
29
|
+
/** App-specific rendering takes priority over the portable Recharts renderer. */
|
|
30
|
+
render?: (context: GenericChartRenderContext<TData, TConfig>) => ReactNode;
|
|
31
|
+
/** Opt into Toolkit's source-agnostic Recharts renderer for row data. */
|
|
32
|
+
chart?: GenericChartConfig;
|
|
33
|
+
renderLoading?: (config: TConfig) => ReactNode;
|
|
34
|
+
renderError?: (error: ReactNode, config: TConfig) => ReactNode;
|
|
35
|
+
renderEmpty?: (config: TConfig) => ReactNode;
|
|
36
|
+
emptyMessage?: ReactNode;
|
|
37
|
+
className?: string;
|
|
38
|
+
}
|
|
39
|
+
/**
|
|
40
|
+
* A render-only chart state boundary. Data acquisition, query serialization,
|
|
41
|
+
* demos, pivots, and app-specific chart renderers stay with the consuming app.
|
|
42
|
+
*/
|
|
43
|
+
export declare function GenericChartPanel<TData, TConfig>({ data, config, loading, error, isEmpty, render, chart, renderLoading, renderError, renderEmpty, emptyMessage, className, }: GenericChartPanelProps<TData, TConfig>): import("react").JSX.Element | null;
|
|
44
|
+
/** Derives chart axes from provider-neutral row data when keys are not configured. */
|
|
45
|
+
export declare function resolveGenericChartKeys(rows: GenericChartDatum[], config: Pick<GenericChartConfig, "xKey" | "yKey" | "yKeys">): {
|
|
46
|
+
xKey: string;
|
|
47
|
+
yKeys: string[];
|
|
48
|
+
};
|
|
49
|
+
export declare function formatGenericChartValue(value: unknown): string;
|
|
50
|
+
export declare function GenericChartRenderer({ rows, config, }: {
|
|
51
|
+
rows: GenericChartDatum[];
|
|
52
|
+
config: GenericChartConfig;
|
|
53
|
+
}): import("react").JSX.Element;
|
|
54
|
+
export declare function ChartPanelPlaceholder({ className }: {
|
|
55
|
+
className?: string;
|
|
56
|
+
}): import("react").JSX.Element;
|
|
57
|
+
//# sourceMappingURL=GenericChartPanel.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"GenericChartPanel.d.ts","sourceRoot":"","sources":["../../src/dashboard/GenericChartPanel.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,119 @@
|
|
|
1
|
+
import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Area, AreaChart, Bar, BarChart, CartesianGrid, Cell, Legend, Line, LineChart, Pie, PieChart, ResponsiveContainer, Tooltip, XAxis, YAxis, } from "recharts";
|
|
3
|
+
import { cn } from "../utils.js";
|
|
4
|
+
import { DataTable } from "./DataTable.js";
|
|
5
|
+
const DEFAULT_COLORS = [
|
|
6
|
+
"hsl(var(--chart-1, 0 0% 20%))",
|
|
7
|
+
"hsl(var(--chart-2, 155 36% 42%))",
|
|
8
|
+
"hsl(var(--chart-3, 32 55% 50%))",
|
|
9
|
+
"hsl(var(--chart-4, 270 25% 55%))",
|
|
10
|
+
"hsl(var(--chart-5, 350 38% 55%))",
|
|
11
|
+
"hsl(var(--chart-6, 190 25% 48%))",
|
|
12
|
+
];
|
|
13
|
+
/**
|
|
14
|
+
* A render-only chart state boundary. Data acquisition, query serialization,
|
|
15
|
+
* demos, pivots, and app-specific chart renderers stay with the consuming app.
|
|
16
|
+
*/
|
|
17
|
+
export function GenericChartPanel({ data, config, loading = false, error, isEmpty, render, chart, renderLoading, renderError, renderEmpty, emptyMessage = "No data available.", className, }) {
|
|
18
|
+
if (loading) {
|
|
19
|
+
return (_jsx(_Fragment, { children: renderLoading?.(config) ?? (_jsx(ChartPanelPlaceholder, { className: className })) }));
|
|
20
|
+
}
|
|
21
|
+
if (error) {
|
|
22
|
+
return (_jsx(_Fragment, { children: renderError?.(error, config) ?? (_jsx(ChartPanelMessage, { className: className, tone: "error", children: error })) }));
|
|
23
|
+
}
|
|
24
|
+
if (data == null || isEmpty?.(data)) {
|
|
25
|
+
return (_jsx(_Fragment, { children: renderEmpty?.(config) ?? (_jsx(ChartPanelMessage, { className: className, children: emptyMessage })) }));
|
|
26
|
+
}
|
|
27
|
+
if (render)
|
|
28
|
+
return _jsx(_Fragment, { children: render({ data, config }) });
|
|
29
|
+
if (chart && Array.isArray(data)) {
|
|
30
|
+
return (_jsx(GenericChartRenderer, { rows: data, config: chart }));
|
|
31
|
+
}
|
|
32
|
+
return null;
|
|
33
|
+
}
|
|
34
|
+
/** Derives chart axes from provider-neutral row data when keys are not configured. */
|
|
35
|
+
export function resolveGenericChartKeys(rows, config) {
|
|
36
|
+
const columns = Object.keys(rows[0] ?? {});
|
|
37
|
+
const xKey = config.xKey && columns.includes(config.xKey)
|
|
38
|
+
? config.xKey
|
|
39
|
+
: (columns[0] ?? "");
|
|
40
|
+
const configured = (config.yKeys?.length ? config.yKeys : config.yKey ? [config.yKey] : []).filter((key) => columns.includes(key));
|
|
41
|
+
const yKeys = configured.length
|
|
42
|
+
? configured
|
|
43
|
+
: columns.filter((key) => key !== xKey && isNumericLike(rows[0]?.[key]));
|
|
44
|
+
return {
|
|
45
|
+
xKey,
|
|
46
|
+
yKeys: yKeys.length
|
|
47
|
+
? yKeys
|
|
48
|
+
: columns.filter((key) => key !== xKey).slice(0, 1),
|
|
49
|
+
};
|
|
50
|
+
}
|
|
51
|
+
export function formatGenericChartValue(value) {
|
|
52
|
+
if (typeof value === "number")
|
|
53
|
+
return value.toLocaleString();
|
|
54
|
+
if (typeof value === "string" &&
|
|
55
|
+
value.trim() !== "" &&
|
|
56
|
+
Number.isFinite(Number(value))) {
|
|
57
|
+
return Number(value).toLocaleString();
|
|
58
|
+
}
|
|
59
|
+
return String(value ?? "-");
|
|
60
|
+
}
|
|
61
|
+
function isNumericLike(value) {
|
|
62
|
+
return (typeof value === "number" ||
|
|
63
|
+
(typeof value === "string" &&
|
|
64
|
+
value.trim() !== "" &&
|
|
65
|
+
Number.isFinite(Number(value))));
|
|
66
|
+
}
|
|
67
|
+
export function GenericChartRenderer({ rows, config, }) {
|
|
68
|
+
const { xKey, yKeys } = resolveGenericChartKeys(rows, config);
|
|
69
|
+
const colors = config.colors?.length ? config.colors : DEFAULT_COLORS;
|
|
70
|
+
const valueFormatter = config.formatValue ?? formatGenericChartValue;
|
|
71
|
+
const xFormatter = config.formatXAxis ?? ((value) => value);
|
|
72
|
+
const seriesFormatter = config.formatSeriesName ?? ((value) => value);
|
|
73
|
+
if (config.chartType === "metric") {
|
|
74
|
+
const valueKey = config.yKey && xKey !== config.yKey ? config.yKey : (yKeys[0] ?? xKey);
|
|
75
|
+
const first = rows[0]?.[valueKey];
|
|
76
|
+
const raw = rows.length > 1 && rows.every((row) => isNumericLike(row[valueKey]))
|
|
77
|
+
? rows.reduce((sum, row) => sum + Number(row[valueKey]), 0)
|
|
78
|
+
: first;
|
|
79
|
+
const value = isNumericLike(raw)
|
|
80
|
+
? valueFormatter(Number(raw))
|
|
81
|
+
: formatGenericChartValue(raw);
|
|
82
|
+
return (_jsxs("div", { className: "flex min-h-12 flex-1 flex-col items-center justify-center py-2 text-center", children: [_jsx("div", { className: "text-3xl font-bold", children: value }), config.description && (_jsx("p", { className: "mt-1 text-xs text-muted-foreground", children: config.description }))] }));
|
|
83
|
+
}
|
|
84
|
+
if (config.chartType === "table") {
|
|
85
|
+
return (_jsx(DataTable, { data: rows, columns: config.columns, maxRows: config.limit }));
|
|
86
|
+
}
|
|
87
|
+
if (!xKey || yKeys.length === 0) {
|
|
88
|
+
return (_jsx(ChartPanelMessage, { children: "Chart data needs an x-axis and at least one value column." }));
|
|
89
|
+
}
|
|
90
|
+
if (config.chartType === "pie" || config.chartType === "donut") {
|
|
91
|
+
const valueKey = yKeys[0];
|
|
92
|
+
return (_jsx(ChartCanvas, { children: _jsxs(PieChart, { children: [_jsx(Pie, { data: rows, dataKey: valueKey, nameKey: xKey, cx: "50%", cy: "50%", innerRadius: config.chartType === "donut" ? 52 : 0, outerRadius: 80, label: ({ name, percent }) => `${seriesFormatter(String(name))} ${((percent ?? 0) * 100).toFixed(0)}%`, labelLine: false, children: rows.map((_, index) => (_jsx(Cell, { fill: colors[index % colors.length] }, index))) }), _jsx(Tooltip, { formatter: (value) => formatTooltipValue(value, valueFormatter) }), config.legend !== false && (_jsx(Legend, { formatter: (value) => seriesFormatter(String(value)) }))] }) }));
|
|
93
|
+
}
|
|
94
|
+
const stacked = config.stacked ||
|
|
95
|
+
config.chartType === "stacked-bar" ||
|
|
96
|
+
config.chartType === "stacked-area";
|
|
97
|
+
if (config.chartType === "bar" || config.chartType === "stacked-bar") {
|
|
98
|
+
return (_jsx(ChartCanvas, { children: _jsxs(BarChart, { data: rows, children: [_jsx(ChartAxes, { xKey: xKey, yFormatter: valueFormatter, xFormatter: xFormatter }), _jsx(Tooltip, { formatter: (value) => formatTooltipValue(value, valueFormatter), labelFormatter: (value) => xFormatter(String(value)) }), config.legend !== false && (_jsx(Legend, { formatter: (value) => seriesFormatter(String(value)) })), yKeys.map((key, index) => (_jsx(Bar, { dataKey: key, name: seriesFormatter(key), fill: colors[index % colors.length], stackId: stacked ? "stack" : undefined, radius: stacked && index < yKeys.length - 1 ? 0 : 4 }, key)))] }) }));
|
|
99
|
+
}
|
|
100
|
+
const showFill = config.chartType === "area" || config.chartType === "stacked-area";
|
|
101
|
+
return (_jsx(ChartCanvas, { children: showFill ? (_jsxs(AreaChart, { data: rows, children: [_jsx(ChartAxes, { xKey: xKey, yFormatter: valueFormatter, xFormatter: xFormatter }), _jsx(Tooltip, { formatter: (value) => formatTooltipValue(value, valueFormatter), labelFormatter: (value) => xFormatter(String(value)) }), config.legend !== false && (_jsx(Legend, { formatter: (value) => seriesFormatter(String(value)) })), yKeys.map((key, index) => (_jsx(Area, { type: "monotone", dataKey: key, name: seriesFormatter(key), stroke: colors[index % colors.length], fill: colors[index % colors.length], fillOpacity: stacked || yKeys.length === 1 ? 0.25 : 0, stackId: stacked ? "stack" : undefined }, key)))] })) : (_jsxs(LineChart, { data: rows, children: [_jsx(ChartAxes, { xKey: xKey, yFormatter: valueFormatter, xFormatter: xFormatter }), _jsx(Tooltip, { formatter: (value) => formatTooltipValue(value, valueFormatter), labelFormatter: (value) => xFormatter(String(value)) }), config.legend !== false && (_jsx(Legend, { formatter: (value) => seriesFormatter(String(value)) })), yKeys.map((key, index) => (_jsx(Line, { type: "monotone", dataKey: key, name: seriesFormatter(key), stroke: colors[index % colors.length], strokeWidth: 2, dot: false }, key)))] })) }));
|
|
102
|
+
}
|
|
103
|
+
function ChartCanvas({ children }) {
|
|
104
|
+
return (_jsx("div", { className: "h-[250px] w-full", children: _jsx(ResponsiveContainer, { width: "100%", height: "100%", children: children }) }));
|
|
105
|
+
}
|
|
106
|
+
function ChartAxes({ xKey, yFormatter, xFormatter, }) {
|
|
107
|
+
return (_jsxs(_Fragment, { children: [_jsx(XAxis, { dataKey: xKey, stroke: "hsl(var(--muted-foreground))", fontSize: 12, tickLine: false, axisLine: false, tickFormatter: (value) => xFormatter(String(value)) }), _jsx(YAxis, { stroke: "hsl(var(--muted-foreground))", fontSize: 12, tickLine: false, axisLine: false, tickFormatter: (value) => yFormatter(Number(value)) }), _jsx(CartesianGrid, { strokeDasharray: "3 3", stroke: "hsl(var(--border))", vertical: false })] }));
|
|
108
|
+
}
|
|
109
|
+
function formatTooltipValue(value, formatter) {
|
|
110
|
+
const numeric = Number(value);
|
|
111
|
+
return Number.isFinite(numeric) ? formatter(numeric) : String(value ?? "-");
|
|
112
|
+
}
|
|
113
|
+
export function ChartPanelPlaceholder({ className }) {
|
|
114
|
+
return (_jsx("div", { className: cn("min-h-[250px] w-full animate-pulse rounded-md bg-muted", className) }));
|
|
115
|
+
}
|
|
116
|
+
function ChartPanelMessage({ children, className, tone = "muted", }) {
|
|
117
|
+
return (_jsx("div", { className: cn("flex min-h-[250px] items-center justify-center px-4 py-8 text-center text-sm", tone === "error" ? "text-destructive" : "text-muted-foreground", className), children: children }));
|
|
118
|
+
}
|
|
119
|
+
//# sourceMappingURL=GenericChartPanel.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"GenericChartPanel.js","sourceRoot":"","sources":["../../src/dashboard/GenericChartPanel.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"GenericChartPanel.spec.d.ts","sourceRoot":"","sources":["../../src/dashboard/GenericChartPanel.spec.tsx"],"names":[],"mappings":""}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import { AreaChart, BarChart, LineChart, PieChart } from "recharts";
|
|
2
|
+
import { describe, expect, it } from "vitest";
|
|
3
|
+
import { GenericChartRenderer, formatGenericChartValue, resolveGenericChartKeys, } from "./GenericChartPanel.js";
|
|
4
|
+
const rows = [
|
|
5
|
+
{ day: "Mon", revenue: 12, costs: 4 },
|
|
6
|
+
{ day: "Tue", revenue: 18, costs: 7 },
|
|
7
|
+
];
|
|
8
|
+
function render(chartType) {
|
|
9
|
+
return GenericChartRenderer({ rows, config: { chartType } });
|
|
10
|
+
}
|
|
11
|
+
describe("GenericChartPanel renderers", () => {
|
|
12
|
+
it("derives portable x/y keys and formats provider values", () => {
|
|
13
|
+
expect(resolveGenericChartKeys(rows, {})).toEqual({
|
|
14
|
+
xKey: "day",
|
|
15
|
+
yKeys: ["revenue", "costs"],
|
|
16
|
+
});
|
|
17
|
+
expect(formatGenericChartValue("1200")).toBe("1,200");
|
|
18
|
+
});
|
|
19
|
+
it("renders KPI metrics from an inferred numeric value", () => {
|
|
20
|
+
const element = render("metric");
|
|
21
|
+
expect(element.props.children[0].props.children).toBe("30");
|
|
22
|
+
});
|
|
23
|
+
it.each([
|
|
24
|
+
["line", LineChart],
|
|
25
|
+
["area", AreaChart],
|
|
26
|
+
["stacked-area", AreaChart],
|
|
27
|
+
["bar", BarChart],
|
|
28
|
+
["stacked-bar", BarChart],
|
|
29
|
+
["pie", PieChart],
|
|
30
|
+
["donut", PieChart],
|
|
31
|
+
])("uses Recharts for %s", (chartType, Component) => {
|
|
32
|
+
const element = render(chartType);
|
|
33
|
+
expect(element.props.children.type).toBe(Component);
|
|
34
|
+
});
|
|
35
|
+
it("uses the shared table renderer for tabular data", () => {
|
|
36
|
+
const element = render("table");
|
|
37
|
+
expect(element.type.name).toBe("DataTable");
|
|
38
|
+
expect(element.props.data).toBe(rows);
|
|
39
|
+
});
|
|
40
|
+
});
|
|
41
|
+
//# sourceMappingURL=GenericChartPanel.spec.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"GenericChartPanel.spec.js","sourceRoot":"","sources":["../../src/dashboard/GenericChartPanel.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AACpE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,QAAQ,CAAC;AAE9C,OAAO,EACL,oBAAoB,EACpB,uBAAuB,EACvB,uBAAuB,GACxB,MAAM,wBAAwB,CAAC;AAEhC,MAAM,IAAI,GAAG;IACX,EAAE,GAAG,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE;IACrC,EAAE,GAAG,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE;CACtC,CAAC;AAEF,SAAS,MAAM,CACb,SAA4E;IAE5E,OAAO,oBAAoB,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,SAAS,EAAE,EAAE,CAAC,CAAC;AAC/D,CAAC;AAED,QAAQ,CAAC,6BAA6B,EAAE,GAAG,EAAE;IAC3C,EAAE,CAAC,uDAAuD,EAAE,GAAG,EAAE;QAC/D,MAAM,CAAC,uBAAuB,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC;YAChD,IAAI,EAAE,KAAK;YACX,KAAK,EAAE,CAAC,SAAS,EAAE,OAAO,CAAC;SAC5B,CAAC,CAAC;QACH,MAAM,CAAC,uBAAuB,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACxD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,oDAAoD,EAAE,GAAG,EAAE;QAC5D,MAAM,OAAO,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAC;QACjC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC9D,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,IAAI,CAAC;QACN,CAAC,MAAM,EAAE,SAAS,CAAC;QACnB,CAAC,MAAM,EAAE,SAAS,CAAC;QACnB,CAAC,cAAc,EAAE,SAAS,CAAC;QAC3B,CAAC,KAAK,EAAE,QAAQ,CAAC;QACjB,CAAC,aAAa,EAAE,QAAQ,CAAC;QACzB,CAAC,KAAK,EAAE,QAAQ,CAAC;QACjB,CAAC,OAAO,EAAE,QAAQ,CAAC;KACX,CAAC,CAAC,sBAAsB,EAAE,CAAC,SAAS,EAAE,SAAS,EAAE,EAAE;QAC3D,MAAM,OAAO,GAAG,MAAM,CAAC,SAAS,CAAC,CAAC;QAClC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IACtD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,iDAAiD,EAAE,GAAG,EAAE;QACzD,MAAM,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC;QAChC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QAC5C,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACxC,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import type { ComponentType } from "react";
|
|
2
|
+
export interface MetricCardProps {
|
|
3
|
+
title: string;
|
|
4
|
+
value: string | number | null;
|
|
5
|
+
icon?: ComponentType<{
|
|
6
|
+
className?: string;
|
|
7
|
+
}>;
|
|
8
|
+
description?: string;
|
|
9
|
+
loading?: boolean;
|
|
10
|
+
error?: string;
|
|
11
|
+
}
|
|
12
|
+
/** A compact, data-source-agnostic dashboard metric. */
|
|
13
|
+
export declare function MetricCard({ title, value, icon: Icon, description, loading, error, }: MetricCardProps): import("react").JSX.Element;
|
|
14
|
+
//# sourceMappingURL=MetricCard.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MetricCard.d.ts","sourceRoot":"","sources":["../../src/dashboard/MetricCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAK3C,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;IAC9B,IAAI,CAAC,EAAE,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC7C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,wDAAwD;AACxD,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,KAAK,EACL,IAAI,EAAE,IAAI,EACV,WAAW,EACX,OAAO,EACP,KAAK,GACN,EAAE,eAAe,+BA+BjB"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Card, CardContent, CardHeader, CardTitle } from "../ui/card.js";
|
|
3
|
+
import { Skeleton } from "../ui/skeleton.js";
|
|
4
|
+
/** A compact, data-source-agnostic dashboard metric. */
|
|
5
|
+
export function MetricCard({ title, value, icon: Icon, description, loading, error, }) {
|
|
6
|
+
return (_jsxs(Card, { className: "border-border/50 bg-card", children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between space-y-0 pb-2", children: [_jsx(CardTitle, { className: "text-sm font-medium text-muted-foreground", children: title }), Icon && _jsx(Icon, { className: "h-4 w-4 text-muted-foreground" })] }), _jsx(CardContent, { children: loading ? (_jsx(Skeleton, { className: "h-8 w-24" })) : error ? (_jsx("p", { className: "text-sm text-destructive", children: error })) : (_jsxs(_Fragment, { children: [_jsx("div", { className: "text-2xl font-bold", children: typeof value === "number"
|
|
7
|
+
? value.toLocaleString()
|
|
8
|
+
: (value ?? "-") }), description && (_jsx("p", { className: "mt-1 text-xs text-muted-foreground", children: description }))] })) })] }));
|
|
9
|
+
}
|
|
10
|
+
//# sourceMappingURL=MetricCard.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MetricCard.js","sourceRoot":"","sources":["../../src/dashboard/MetricCard.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AACzE,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAW7C,wDAAwD;AACxD,MAAM,UAAU,UAAU,CAAC,EACzB,KAAK,EACL,KAAK,EACL,IAAI,EAAE,IAAI,EACV,WAAW,EACX,OAAO,EACP,KAAK,GACW;IAChB,OAAO,CACL,MAAC,IAAI,IAAC,SAAS,EAAC,0BAA0B,aACxC,MAAC,UAAU,IAAC,SAAS,EAAC,2DAA2D,aAC/E,KAAC,SAAS,IAAC,SAAS,EAAC,2CAA2C,YAC7D,KAAK,GACI,EACX,IAAI,IAAI,KAAC,IAAI,IAAC,SAAS,EAAC,+BAA+B,GAAG,IAChD,EACb,KAAC,WAAW,cACT,OAAO,CAAC,CAAC,CAAC,CACT,KAAC,QAAQ,IAAC,SAAS,EAAC,UAAU,GAAG,CAClC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CACV,YAAG,SAAS,EAAC,0BAA0B,YAAE,KAAK,GAAK,CACpD,CAAC,CAAC,CAAC,CACF,8BACE,cAAK,SAAS,EAAC,oBAAoB,YAChC,OAAO,KAAK,KAAK,QAAQ;gCACxB,CAAC,CAAC,KAAK,CAAC,cAAc,EAAE;gCACxB,CAAC,CAAC,CAAC,KAAK,IAAI,GAAG,CAAC,GACd,EACL,WAAW,IAAI,CACd,YAAG,SAAS,EAAC,oCAAoC,YAC9C,WAAW,GACV,CACL,IACA,CACJ,GACW,IACT,CACR,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import type { ComponentType } from "react";
|
|
2
|
+
export interface StatsCardProps {
|
|
3
|
+
title: string;
|
|
4
|
+
value: string;
|
|
5
|
+
icon: ComponentType<{
|
|
6
|
+
className?: string;
|
|
7
|
+
}>;
|
|
8
|
+
description: string;
|
|
9
|
+
trend?: {
|
|
10
|
+
value: number;
|
|
11
|
+
label?: string;
|
|
12
|
+
};
|
|
13
|
+
}
|
|
14
|
+
/** A metric card with an optional positive/negative percentage trend. */
|
|
15
|
+
export declare function StatsCard({ title, value, icon: Icon, description, trend, }: StatsCardProps): import("react").JSX.Element;
|
|
16
|
+
//# sourceMappingURL=StatsCard.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"StatsCard.d.ts","sourceRoot":"","sources":["../../src/dashboard/StatsCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAK3C,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC5C,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CAC3C;AAED,yEAAyE;AACzE,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,KAAK,EACL,IAAI,EAAE,IAAI,EACV,WAAW,EACX,KAAK,GACN,EAAE,cAAc,+BA4BhB"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Card, CardContent, CardHeader, CardTitle } from "../ui/card.js";
|
|
3
|
+
import { cn } from "../utils.js";
|
|
4
|
+
/** A metric card with an optional positive/negative percentage trend. */
|
|
5
|
+
export function StatsCard({ title, value, icon: Icon, description, trend, }) {
|
|
6
|
+
return (_jsxs(Card, { className: "border-border/50 bg-card shadow-sm", children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between space-y-0 pb-2", children: [_jsx(CardTitle, { className: "text-sm font-medium text-muted-foreground", children: title }), _jsx(Icon, { className: "h-4 w-4 text-muted-foreground" })] }), _jsxs(CardContent, { children: [_jsx("div", { className: "text-2xl font-bold", children: value }), _jsxs("p", { className: "mt-1 text-xs text-muted-foreground", children: [trend && (_jsxs("span", { className: cn("mr-1 font-medium", trend.value > 0 ? "text-foreground" : "text-destructive"), children: [trend.value > 0 ? "+" : "", trend.value, "%", trend.label ? ` ${trend.label}` : ""] })), description] })] })] }));
|
|
7
|
+
}
|
|
8
|
+
//# sourceMappingURL=StatsCard.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"StatsCard.js","sourceRoot":"","sources":["../../src/dashboard/StatsCard.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AACzE,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AAUjC,yEAAyE;AACzE,MAAM,UAAU,SAAS,CAAC,EACxB,KAAK,EACL,KAAK,EACL,IAAI,EAAE,IAAI,EACV,WAAW,EACX,KAAK,GACU;IACf,OAAO,CACL,MAAC,IAAI,IAAC,SAAS,EAAC,oCAAoC,aAClD,MAAC,UAAU,IAAC,SAAS,EAAC,2DAA2D,aAC/E,KAAC,SAAS,IAAC,SAAS,EAAC,2CAA2C,YAC7D,KAAK,GACI,EACZ,KAAC,IAAI,IAAC,SAAS,EAAC,+BAA+B,GAAG,IACvC,EACb,MAAC,WAAW,eACV,cAAK,SAAS,EAAC,oBAAoB,YAAE,KAAK,GAAO,EACjD,aAAG,SAAS,EAAC,oCAAoC,aAC9C,KAAK,IAAI,CACR,gBACE,SAAS,EAAE,EAAE,CACX,kBAAkB,EAClB,KAAK,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,kBAAkB,CACzD,aAEA,KAAK,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAC1B,KAAK,CAAC,KAAK,OAAG,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,EAAE,IAC9C,CACR,EACA,WAAW,IACV,IACQ,IACT,CACR,CAAC;AACJ,CAAC"}
|