@tangle-network/sandbox-ui 0.2.0 → 0.2.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/auth.d.ts +1 -2
- package/dist/{button-BidTtuRS.d.ts → button-CMQuQEW_.d.ts} +4 -2
- package/dist/{chunk-HMND7JPA.js → chunk-J4OADEUK.js} +163 -217
- package/dist/chunk-OKCIKTXQ.js +63 -0
- package/dist/{chunk-ZOL2TR5M.js → chunk-SOT2V7TX.js} +162 -1
- package/dist/dashboard.js +2 -1
- package/dist/index.d.ts +3 -40
- package/dist/index.js +10 -161
- package/dist/primitives.d.ts +49 -5
- package/dist/primitives.js +15 -1
- package/package.json +1 -1
|
@@ -1,3 +1,6 @@
|
|
|
1
|
+
import {
|
|
2
|
+
Logo
|
|
3
|
+
} from "./chunk-OKCIKTXQ.js";
|
|
1
4
|
import {
|
|
2
5
|
DropdownMenu,
|
|
3
6
|
DropdownMenuContent,
|
|
@@ -17,64 +20,9 @@ import {
|
|
|
17
20
|
cn
|
|
18
21
|
} from "./chunk-RQHJBTEU.js";
|
|
19
22
|
|
|
20
|
-
// src/primitives/logo.tsx
|
|
21
|
-
import * as React from "react";
|
|
22
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
23
|
-
var sizeConfig = {
|
|
24
|
-
sm: { icon: 24, text: "text-base", suffix: "text-xs", gap: "gap-1.5" },
|
|
25
|
-
md: { icon: 28, text: "text-lg", suffix: "text-sm", gap: "gap-2" },
|
|
26
|
-
lg: { icon: 36, text: "text-2xl", suffix: "text-base", gap: "gap-2.5" },
|
|
27
|
-
xl: { icon: 48, text: "text-3xl", suffix: "text-lg", gap: "gap-3" }
|
|
28
|
-
};
|
|
29
|
-
function TangleKnot({ size, className }) {
|
|
30
|
-
const uid = React.useId();
|
|
31
|
-
const g1 = `tk-a-${uid}`;
|
|
32
|
-
const g2 = `tk-b-${uid}`;
|
|
33
|
-
return /* @__PURE__ */ jsxs(
|
|
34
|
-
"svg",
|
|
35
|
-
{
|
|
36
|
-
width: size,
|
|
37
|
-
height: size,
|
|
38
|
-
viewBox: "20 45 156 140",
|
|
39
|
-
fill: "none",
|
|
40
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
41
|
-
className,
|
|
42
|
-
children: [
|
|
43
|
-
/* @__PURE__ */ jsx("title", { children: "Tangle" }),
|
|
44
|
-
/* @__PURE__ */ jsxs("defs", { children: [
|
|
45
|
-
/* @__PURE__ */ jsxs("linearGradient", { id: g1, x1: "36.79", y1: "58.78", x2: "145.99", y2: "183.59", gradientUnits: "userSpaceOnUse", children: [
|
|
46
|
-
/* @__PURE__ */ jsx("stop", { stopColor: "#8E59FF" }),
|
|
47
|
-
/* @__PURE__ */ jsx("stop", { offset: "1", stopColor: "#6888F9" })
|
|
48
|
-
] }),
|
|
49
|
-
/* @__PURE__ */ jsxs("linearGradient", { id: g2, x1: "36.78", y1: "169.38", x2: "145.99", y2: "44.57", gradientUnits: "userSpaceOnUse", children: [
|
|
50
|
-
/* @__PURE__ */ jsx("stop", { stopColor: "#8E59FF" }),
|
|
51
|
-
/* @__PURE__ */ jsx("stop", { offset: "1", stopColor: "#6888F9" })
|
|
52
|
-
] })
|
|
53
|
-
] }),
|
|
54
|
-
/* @__PURE__ */ jsx("path", { d: "M170.74 150.082C170.747 142.848 167.464 135.908 161.612 130.784C155.76 125.66 147.818 122.772 139.528 122.754L104.921 122.754C104.704 119.939 104.567 117.062 104.567 114.078C104.567 111.095 104.429 108.231 104.236 105.403L139.528 105.403C147.746 105.288 155.582 102.359 161.347 97.2467C167.112 92.135 170.343 85.2506 170.343 78.0787C170.343 70.9069 167.112 64.0225 161.347 58.9107C155.582 53.799 147.746 50.8696 139.528 50.7545L56.817 50.7545C48.5993 50.8696 40.7628 53.799 34.9981 58.9107C29.2334 64.0225 26.0025 70.9069 26.0025 78.0787C26.0025 85.2506 29.2334 92.135 34.9981 97.2467C40.7628 102.359 48.5993 105.288 56.817 105.403L89.3238 106.163C91.5854 106.163 91.7785 111.095 91.7785 114.078C91.7785 117.062 91.9156 119.925 92.1091 122.754L56.817 122.754C48.5993 122.869 40.7628 125.798 34.9981 130.91C29.2334 136.022 26.0025 142.906 26.0025 150.078C26.0025 157.25 29.2334 164.134 34.9981 169.246C40.7628 174.358 48.5993 177.287 56.817 177.402L139.528 177.402C147.816 177.384 155.757 174.497 161.609 169.374C167.461 164.252 170.745 157.314 170.74 150.082ZM157.952 78.0752C157.954 82.3443 156.016 86.4397 152.562 89.463C149.108 92.4863 144.42 94.1905 139.528 94.2017L102.881 94.2017C101.554 86.2073 99.0244 78.4005 95.3585 70.9829C93.7421 67.7691 91.6728 64.7438 89.1983 61.9769L139.528 61.9769C144.415 61.988 149.097 63.6884 152.55 66.7056C156.003 69.7228 157.946 73.811 157.952 78.0752ZM56.817 94.2017C51.9157 94.2017 47.2151 92.5027 43.7493 89.4784C40.2835 86.4541 38.3364 82.3522 38.3364 78.0752C38.3364 73.7982 40.2835 69.6964 43.7493 66.6721C47.2151 63.6478 51.9157 61.9487 56.817 61.9487L65.1139 61.9487C72.4433 61.9487 79.3856 67.0146 83.7074 75.5071C86.6658 81.491 88.77 87.7697 89.9724 94.2017L56.817 94.2017ZM38.3929 150.082C38.3907 145.812 40.3293 141.717 43.7834 138.694C47.2374 135.67 51.9248 133.966 56.817 133.955L93.4637 133.955C94.7912 141.949 97.3206 149.756 100.987 157.174C102.603 160.388 104.672 163.413 107.147 166.18L56.817 166.18C51.9304 166.169 47.2479 164.468 43.7948 161.451C40.3416 158.434 38.3993 154.346 38.3929 150.082ZM112.686 152.65C109.728 146.666 107.623 140.387 106.421 133.955L139.528 133.955C144.429 133.955 149.13 135.654 152.596 138.678C156.062 141.703 158.009 145.804 158.009 150.082C158.009 154.359 156.062 158.46 152.596 161.485C149.13 164.509 144.429 166.208 139.528 166.208L131.231 166.208C123.934 166.208 116.992 161.142 112.686 152.65Z", fill: `url(#${g1})` }),
|
|
55
|
-
/* @__PURE__ */ jsx("path", { opacity: "0.8", d: "M170.74 78.0752C170.747 85.3089 167.463 92.2492 161.612 97.3728C155.76 102.496 147.817 105.384 139.527 105.403L104.92 105.403C104.702 108.217 104.565 111.095 104.565 114.078C104.565 117.062 104.428 119.925 104.235 122.754L139.527 122.754C147.745 122.869 155.582 125.798 161.347 130.91C167.112 136.022 170.342 142.906 170.342 150.078C170.342 157.25 167.112 164.134 161.347 169.246C155.582 174.358 147.745 177.287 139.527 177.402L56.8149 177.402C48.597 177.287 40.7604 174.358 34.9956 169.246C29.2307 164.134 25.9998 157.25 25.9998 150.078C25.9998 142.906 29.2307 136.022 34.9956 130.91C40.7604 125.798 48.597 122.869 56.8149 122.754L89.3223 121.994C91.5839 121.994 91.777 117.062 91.777 114.078C91.777 111.095 91.9141 108.231 92.1076 105.403L56.8149 105.403C48.597 105.288 40.7604 102.359 34.9956 97.2468C29.2307 92.135 25.9998 85.2506 25.9998 78.0788C25.9998 70.9069 29.2307 64.0225 34.9956 58.9108C40.7604 53.799 48.597 50.8696 56.8149 50.7545L139.527 50.7545C147.816 50.7731 155.757 53.6602 161.609 58.7823C167.46 63.9043 170.744 70.8428 170.74 78.0752ZM157.952 150.082C157.954 145.812 156.015 141.717 152.561 138.694C149.107 135.67 144.42 133.966 139.527 133.955L102.88 133.955C101.552 141.949 99.023 149.756 95.3571 157.174C93.7406 160.388 91.6712 163.413 89.1968 166.18L139.527 166.18C144.414 166.169 149.097 164.468 152.55 161.451C156.003 158.434 157.945 154.346 157.952 150.082ZM56.8149 133.955C51.9134 133.955 47.2127 135.654 43.7469 138.678C40.2811 141.703 38.334 145.805 38.334 150.082C38.334 154.359 40.2811 158.46 43.7469 161.485C47.2127 164.509 51.9134 166.208 56.8149 166.208L65.1119 166.208C72.4414 166.208 79.3838 161.142 83.7057 152.65C86.6642 146.666 88.7684 140.387 89.9708 133.955L56.8149 133.955ZM38.3904 78.0752C38.3883 82.3443 40.3269 86.4398 43.781 89.4631C47.2351 92.4863 51.9226 94.1905 56.8149 94.2017L93.4622 94.2017C94.7898 86.2073 97.3192 78.4005 100.985 70.983C102.602 67.7692 104.671 64.7438 107.145 61.9769L56.8149 61.9769C51.9282 61.9881 47.2456 63.6884 43.7924 66.7056C40.3392 69.7228 38.3968 73.8111 38.3904 78.0752ZM112.685 75.5071C109.726 81.491 107.622 87.7697 106.42 94.2017L139.527 94.2017C144.429 94.2017 149.13 92.5027 152.595 89.4784C156.061 86.4541 158.008 82.3522 158.008 78.0752C158.008 73.7982 156.061 69.6964 152.595 66.6721C149.13 63.6478 144.429 61.9488 139.527 61.9488L131.23 61.9488C123.933 61.9488 116.991 67.0147 112.685 75.5071Z", fill: `url(#${g2})` })
|
|
56
|
-
]
|
|
57
|
-
}
|
|
58
|
-
);
|
|
59
|
-
}
|
|
60
|
-
function Logo({ variant = "sandbox", size = "md", className, iconOnly = false }) {
|
|
61
|
-
const cfg = sizeConfig[size];
|
|
62
|
-
if (iconOnly) {
|
|
63
|
-
return /* @__PURE__ */ jsx(TangleKnot, { size: cfg.icon, className });
|
|
64
|
-
}
|
|
65
|
-
return /* @__PURE__ */ jsxs("div", { className: cn("flex items-center", cfg.gap, className), children: [
|
|
66
|
-
/* @__PURE__ */ jsx(TangleKnot, { size: cfg.icon, className: "shrink-0" }),
|
|
67
|
-
/* @__PURE__ */ jsxs("div", { className: "flex items-baseline gap-1", children: [
|
|
68
|
-
/* @__PURE__ */ jsx("span", { className: cn("font-bold tracking-tight", cfg.text), children: "Tangle" }),
|
|
69
|
-
variant === "sandbox" && /* @__PURE__ */ jsx("span", { className: cn("font-medium text-gradient-sandbox", cfg.suffix), children: "Sandbox" })
|
|
70
|
-
] })
|
|
71
|
-
] });
|
|
72
|
-
}
|
|
73
|
-
Logo.displayName = "Logo";
|
|
74
|
-
|
|
75
23
|
// src/primitives/theme-toggle.tsx
|
|
76
24
|
import { useCallback, useEffect, useState } from "react";
|
|
77
|
-
import { jsx
|
|
25
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
78
26
|
function getSystemTheme() {
|
|
79
27
|
return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
|
|
80
28
|
}
|
|
@@ -108,7 +56,7 @@ function useTheme() {
|
|
|
108
56
|
}
|
|
109
57
|
var iconClass = "h-4 w-4";
|
|
110
58
|
function SunIcon() {
|
|
111
|
-
return /* @__PURE__ */
|
|
59
|
+
return /* @__PURE__ */ jsxs(
|
|
112
60
|
"svg",
|
|
113
61
|
{
|
|
114
62
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -120,14 +68,14 @@ function SunIcon() {
|
|
|
120
68
|
strokeLinejoin: "round",
|
|
121
69
|
className: iconClass,
|
|
122
70
|
children: [
|
|
123
|
-
/* @__PURE__ */
|
|
124
|
-
/* @__PURE__ */
|
|
71
|
+
/* @__PURE__ */ jsx("circle", { cx: 12, cy: 12, r: 5 }),
|
|
72
|
+
/* @__PURE__ */ jsx("path", { d: "M12 1v2M12 21v2M4.22 4.22l1.42 1.42M18.36 18.36l1.42 1.42M1 12h2M21 12h2M4.22 19.78l1.42-1.42M18.36 5.64l1.42-1.42" })
|
|
125
73
|
]
|
|
126
74
|
}
|
|
127
75
|
);
|
|
128
76
|
}
|
|
129
77
|
function MoonIcon() {
|
|
130
|
-
return /* @__PURE__ */
|
|
78
|
+
return /* @__PURE__ */ jsx(
|
|
131
79
|
"svg",
|
|
132
80
|
{
|
|
133
81
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -138,28 +86,28 @@ function MoonIcon() {
|
|
|
138
86
|
strokeLinecap: "round",
|
|
139
87
|
strokeLinejoin: "round",
|
|
140
88
|
className: iconClass,
|
|
141
|
-
children: /* @__PURE__ */
|
|
89
|
+
children: /* @__PURE__ */ jsx("path", { d: "M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z" })
|
|
142
90
|
}
|
|
143
91
|
);
|
|
144
92
|
}
|
|
145
93
|
function ThemeToggle() {
|
|
146
94
|
const { theme, setTheme } = useTheme();
|
|
147
95
|
const resolved = theme === "system" ? getSystemTheme() : theme;
|
|
148
|
-
return /* @__PURE__ */
|
|
96
|
+
return /* @__PURE__ */ jsx(
|
|
149
97
|
"button",
|
|
150
98
|
{
|
|
151
99
|
type: "button",
|
|
152
100
|
onClick: () => setTheme(resolved === "dark" ? "light" : "dark"),
|
|
153
101
|
className: "inline-flex items-center justify-center rounded-md p-2 text-muted-foreground hover:bg-accent hover:text-accent-foreground transition-colors",
|
|
154
102
|
"aria-label": `Switch to ${resolved === "dark" ? "light" : "dark"} mode`,
|
|
155
|
-
children: resolved === "dark" ? /* @__PURE__ */
|
|
103
|
+
children: resolved === "dark" ? /* @__PURE__ */ jsx(SunIcon, {}) : /* @__PURE__ */ jsx(MoonIcon, {})
|
|
156
104
|
}
|
|
157
105
|
);
|
|
158
106
|
}
|
|
159
107
|
|
|
160
108
|
// src/dashboard/dashboard-layout.tsx
|
|
161
|
-
import * as
|
|
162
|
-
import { Fragment, jsx as
|
|
109
|
+
import * as React from "react";
|
|
110
|
+
import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
163
111
|
var variantStyles = {
|
|
164
112
|
sandbox: {
|
|
165
113
|
activeNav: "bg-purple-500/10 text-purple-400",
|
|
@@ -173,10 +121,10 @@ function DefaultLink({
|
|
|
173
121
|
children,
|
|
174
122
|
...rest
|
|
175
123
|
}) {
|
|
176
|
-
return /* @__PURE__ */
|
|
124
|
+
return /* @__PURE__ */ jsx2("a", { href: href ?? to, className, ...rest, children });
|
|
177
125
|
}
|
|
178
126
|
function UserIcon({ className }) {
|
|
179
|
-
return /* @__PURE__ */
|
|
127
|
+
return /* @__PURE__ */ jsxs2(
|
|
180
128
|
"svg",
|
|
181
129
|
{
|
|
182
130
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -188,15 +136,15 @@ function UserIcon({ className }) {
|
|
|
188
136
|
strokeLinejoin: "round",
|
|
189
137
|
className,
|
|
190
138
|
children: [
|
|
191
|
-
/* @__PURE__ */
|
|
192
|
-
/* @__PURE__ */
|
|
193
|
-
/* @__PURE__ */
|
|
139
|
+
/* @__PURE__ */ jsx2("title", { children: "User icon" }),
|
|
140
|
+
/* @__PURE__ */ jsx2("path", { d: "M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2" }),
|
|
141
|
+
/* @__PURE__ */ jsx2("circle", { cx: "12", cy: "7", r: "4" })
|
|
194
142
|
]
|
|
195
143
|
}
|
|
196
144
|
);
|
|
197
145
|
}
|
|
198
146
|
function SettingsIcon({ className }) {
|
|
199
|
-
return /* @__PURE__ */
|
|
147
|
+
return /* @__PURE__ */ jsxs2(
|
|
200
148
|
"svg",
|
|
201
149
|
{
|
|
202
150
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -208,15 +156,15 @@ function SettingsIcon({ className }) {
|
|
|
208
156
|
strokeLinejoin: "round",
|
|
209
157
|
className,
|
|
210
158
|
children: [
|
|
211
|
-
/* @__PURE__ */
|
|
212
|
-
/* @__PURE__ */
|
|
213
|
-
/* @__PURE__ */
|
|
159
|
+
/* @__PURE__ */ jsx2("title", { children: "Settings icon" }),
|
|
160
|
+
/* @__PURE__ */ jsx2("path", { d: "M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z" }),
|
|
161
|
+
/* @__PURE__ */ jsx2("circle", { cx: "12", cy: "12", r: "3" })
|
|
214
162
|
]
|
|
215
163
|
}
|
|
216
164
|
);
|
|
217
165
|
}
|
|
218
166
|
function LogOutIcon({ className }) {
|
|
219
|
-
return /* @__PURE__ */
|
|
167
|
+
return /* @__PURE__ */ jsxs2(
|
|
220
168
|
"svg",
|
|
221
169
|
{
|
|
222
170
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -228,16 +176,16 @@ function LogOutIcon({ className }) {
|
|
|
228
176
|
strokeLinejoin: "round",
|
|
229
177
|
className,
|
|
230
178
|
children: [
|
|
231
|
-
/* @__PURE__ */
|
|
232
|
-
/* @__PURE__ */
|
|
233
|
-
/* @__PURE__ */
|
|
234
|
-
/* @__PURE__ */
|
|
179
|
+
/* @__PURE__ */ jsx2("title", { children: "Log out icon" }),
|
|
180
|
+
/* @__PURE__ */ jsx2("path", { d: "M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4" }),
|
|
181
|
+
/* @__PURE__ */ jsx2("polyline", { points: "16,17 21,12 16,7" }),
|
|
182
|
+
/* @__PURE__ */ jsx2("line", { x1: "21", x2: "9", y1: "12", y2: "12" })
|
|
235
183
|
]
|
|
236
184
|
}
|
|
237
185
|
);
|
|
238
186
|
}
|
|
239
187
|
function ChevronRightIcon({ className }) {
|
|
240
|
-
return /* @__PURE__ */
|
|
188
|
+
return /* @__PURE__ */ jsxs2(
|
|
241
189
|
"svg",
|
|
242
190
|
{
|
|
243
191
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -249,14 +197,14 @@ function ChevronRightIcon({ className }) {
|
|
|
249
197
|
strokeLinejoin: "round",
|
|
250
198
|
className,
|
|
251
199
|
children: [
|
|
252
|
-
/* @__PURE__ */
|
|
253
|
-
/* @__PURE__ */
|
|
200
|
+
/* @__PURE__ */ jsx2("title", { children: "Chevron right icon" }),
|
|
201
|
+
/* @__PURE__ */ jsx2("path", { d: "m9 18 6-6-6-6" })
|
|
254
202
|
]
|
|
255
203
|
}
|
|
256
204
|
);
|
|
257
205
|
}
|
|
258
206
|
function MenuIcon({ className }) {
|
|
259
|
-
return /* @__PURE__ */
|
|
207
|
+
return /* @__PURE__ */ jsxs2(
|
|
260
208
|
"svg",
|
|
261
209
|
{
|
|
262
210
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -268,16 +216,16 @@ function MenuIcon({ className }) {
|
|
|
268
216
|
strokeLinejoin: "round",
|
|
269
217
|
className,
|
|
270
218
|
children: [
|
|
271
|
-
/* @__PURE__ */
|
|
272
|
-
/* @__PURE__ */
|
|
273
|
-
/* @__PURE__ */
|
|
274
|
-
/* @__PURE__ */
|
|
219
|
+
/* @__PURE__ */ jsx2("title", { children: "Menu icon" }),
|
|
220
|
+
/* @__PURE__ */ jsx2("line", { x1: "4", x2: "20", y1: "12", y2: "12" }),
|
|
221
|
+
/* @__PURE__ */ jsx2("line", { x1: "4", x2: "20", y1: "6", y2: "6" }),
|
|
222
|
+
/* @__PURE__ */ jsx2("line", { x1: "4", x2: "20", y1: "18", y2: "18" })
|
|
275
223
|
]
|
|
276
224
|
}
|
|
277
225
|
);
|
|
278
226
|
}
|
|
279
227
|
function XIcon({ className }) {
|
|
280
|
-
return /* @__PURE__ */
|
|
228
|
+
return /* @__PURE__ */ jsxs2(
|
|
281
229
|
"svg",
|
|
282
230
|
{
|
|
283
231
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -289,9 +237,9 @@ function XIcon({ className }) {
|
|
|
289
237
|
strokeLinejoin: "round",
|
|
290
238
|
className,
|
|
291
239
|
children: [
|
|
292
|
-
/* @__PURE__ */
|
|
293
|
-
/* @__PURE__ */
|
|
294
|
-
/* @__PURE__ */
|
|
240
|
+
/* @__PURE__ */ jsx2("title", { children: "Close icon" }),
|
|
241
|
+
/* @__PURE__ */ jsx2("path", { d: "M18 6 6 18" }),
|
|
242
|
+
/* @__PURE__ */ jsx2("path", { d: "m6 6 12 12" })
|
|
295
243
|
]
|
|
296
244
|
}
|
|
297
245
|
);
|
|
@@ -310,16 +258,16 @@ function DashboardLayout({
|
|
|
310
258
|
}) {
|
|
311
259
|
const styles = variantStyles[variant];
|
|
312
260
|
const Link = LinkComponent;
|
|
313
|
-
const [mobileMenuOpen, setMobileMenuOpen] =
|
|
261
|
+
const [mobileMenuOpen, setMobileMenuOpen] = React.useState(false);
|
|
314
262
|
const handleNavClick = () => {
|
|
315
263
|
setMobileMenuOpen(false);
|
|
316
264
|
};
|
|
317
|
-
const SidebarContent = () => /* @__PURE__ */
|
|
318
|
-
/* @__PURE__ */
|
|
319
|
-
/* @__PURE__ */
|
|
265
|
+
const SidebarContent = () => /* @__PURE__ */ jsxs2(Fragment, { children: [
|
|
266
|
+
/* @__PURE__ */ jsx2("div", { className: "border-border border-b p-6", children: /* @__PURE__ */ jsx2(Logo, { variant, size: "md" }) }),
|
|
267
|
+
/* @__PURE__ */ jsx2("nav", { className: "flex-1 space-y-1 p-4", "aria-label": "Main navigation", children: navItems.map((item) => {
|
|
320
268
|
const Icon = item.icon;
|
|
321
269
|
const isActive = activeNavId === item.id;
|
|
322
|
-
return /* @__PURE__ */
|
|
270
|
+
return /* @__PURE__ */ jsxs2(
|
|
323
271
|
Link,
|
|
324
272
|
{
|
|
325
273
|
href: item.href,
|
|
@@ -331,44 +279,44 @@ function DashboardLayout({
|
|
|
331
279
|
isActive ? styles.activeNav : "text-muted-foreground hover:bg-accent hover:text-foreground"
|
|
332
280
|
),
|
|
333
281
|
children: [
|
|
334
|
-
/* @__PURE__ */
|
|
335
|
-
/* @__PURE__ */
|
|
282
|
+
/* @__PURE__ */ jsx2(Icon, { className: "h-5 w-5", "aria-hidden": "true" }),
|
|
283
|
+
/* @__PURE__ */ jsx2("span", { className: "font-medium", children: item.label })
|
|
336
284
|
]
|
|
337
285
|
},
|
|
338
286
|
item.id
|
|
339
287
|
);
|
|
340
288
|
}) }),
|
|
341
|
-
/* @__PURE__ */
|
|
342
|
-
/* @__PURE__ */
|
|
343
|
-
/* @__PURE__ */
|
|
344
|
-
/* @__PURE__ */
|
|
289
|
+
/* @__PURE__ */ jsxs2("div", { className: "border-border border-t p-4", children: [
|
|
290
|
+
/* @__PURE__ */ jsx2("div", { className: "mb-2 flex justify-end", children: /* @__PURE__ */ jsx2(ThemeToggle, {}) }),
|
|
291
|
+
/* @__PURE__ */ jsxs2(DropdownMenu, { children: [
|
|
292
|
+
/* @__PURE__ */ jsx2(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs2(
|
|
345
293
|
"button",
|
|
346
294
|
{
|
|
347
295
|
type: "button",
|
|
348
296
|
className: "flex w-full items-center gap-3 rounded-lg p-3 transition-colors hover:bg-accent focus:outline-none focus:ring-2 focus:ring-offset-2",
|
|
349
297
|
"aria-label": "User menu",
|
|
350
298
|
children: [
|
|
351
|
-
/* @__PURE__ */
|
|
299
|
+
/* @__PURE__ */ jsx2(
|
|
352
300
|
"div",
|
|
353
301
|
{
|
|
354
302
|
className: cn(
|
|
355
303
|
"flex h-8 w-8 items-center justify-center rounded-full bg-gradient-to-r",
|
|
356
304
|
styles.userGradient
|
|
357
305
|
),
|
|
358
|
-
children: /* @__PURE__ */
|
|
306
|
+
children: /* @__PURE__ */ jsx2(UserIcon, { className: "h-4 w-4 text-white", "aria-hidden": "true" })
|
|
359
307
|
}
|
|
360
308
|
),
|
|
361
|
-
/* @__PURE__ */
|
|
362
|
-
/* @__PURE__ */
|
|
363
|
-
/* @__PURE__ */
|
|
364
|
-
] }) : /* @__PURE__ */
|
|
365
|
-
/* @__PURE__ */
|
|
366
|
-
/* @__PURE__ */
|
|
309
|
+
/* @__PURE__ */ jsx2("div", { className: "flex-1 text-left", children: isLoading ? /* @__PURE__ */ jsxs2(Fragment, { children: [
|
|
310
|
+
/* @__PURE__ */ jsx2(Skeleton, { className: "mb-1 h-4 w-24" }),
|
|
311
|
+
/* @__PURE__ */ jsx2(Skeleton, { className: "h-3 w-16" })
|
|
312
|
+
] }) : /* @__PURE__ */ jsxs2(Fragment, { children: [
|
|
313
|
+
/* @__PURE__ */ jsx2("p", { className: "truncate font-medium text-sm", children: user?.email ?? "Not logged in" }),
|
|
314
|
+
/* @__PURE__ */ jsxs2("p", { className: "text-muted-foreground text-xs capitalize", children: [
|
|
367
315
|
user?.tier ?? "Free",
|
|
368
316
|
" Plan"
|
|
369
317
|
] })
|
|
370
318
|
] }) }),
|
|
371
|
-
/* @__PURE__ */
|
|
319
|
+
/* @__PURE__ */ jsx2(
|
|
372
320
|
ChevronRightIcon,
|
|
373
321
|
{
|
|
374
322
|
className: "h-4 w-4 text-muted-foreground",
|
|
@@ -378,28 +326,28 @@ function DashboardLayout({
|
|
|
378
326
|
]
|
|
379
327
|
}
|
|
380
328
|
) }),
|
|
381
|
-
/* @__PURE__ */
|
|
382
|
-
/* @__PURE__ */
|
|
383
|
-
/* @__PURE__ */
|
|
384
|
-
onSettingsClick ? /* @__PURE__ */
|
|
385
|
-
/* @__PURE__ */
|
|
329
|
+
/* @__PURE__ */ jsxs2(DropdownMenuContent, { align: "end", className: "w-56", children: [
|
|
330
|
+
/* @__PURE__ */ jsx2(DropdownMenuLabel, { children: "My Account" }),
|
|
331
|
+
/* @__PURE__ */ jsx2(DropdownMenuSeparator, {}),
|
|
332
|
+
onSettingsClick ? /* @__PURE__ */ jsxs2(DropdownMenuItem, { onClick: onSettingsClick, children: [
|
|
333
|
+
/* @__PURE__ */ jsx2(SettingsIcon, { className: "mr-2 h-4 w-4", "aria-hidden": "true" }),
|
|
386
334
|
"Settings"
|
|
387
|
-
] }) : /* @__PURE__ */
|
|
388
|
-
/* @__PURE__ */
|
|
335
|
+
] }) : /* @__PURE__ */ jsx2(DropdownMenuItem, { asChild: true, children: /* @__PURE__ */ jsxs2(Link, { href: settingsHref, to: settingsHref, className: "flex items-center", children: [
|
|
336
|
+
/* @__PURE__ */ jsx2(SettingsIcon, { className: "mr-2 h-4 w-4", "aria-hidden": "true" }),
|
|
389
337
|
"Settings"
|
|
390
338
|
] }) }),
|
|
391
|
-
onLogout && /* @__PURE__ */
|
|
392
|
-
/* @__PURE__ */
|
|
339
|
+
onLogout && /* @__PURE__ */ jsxs2(DropdownMenuItem, { className: "text-red-400", onClick: onLogout, children: [
|
|
340
|
+
/* @__PURE__ */ jsx2(LogOutIcon, { className: "mr-2 h-4 w-4", "aria-hidden": "true" }),
|
|
393
341
|
"Sign Out"
|
|
394
342
|
] })
|
|
395
343
|
] })
|
|
396
344
|
] })
|
|
397
345
|
] })
|
|
398
346
|
] });
|
|
399
|
-
return /* @__PURE__ */
|
|
400
|
-
/* @__PURE__ */
|
|
401
|
-
/* @__PURE__ */
|
|
402
|
-
/* @__PURE__ */
|
|
347
|
+
return /* @__PURE__ */ jsxs2("div", { className: "flex min-h-screen bg-background", children: [
|
|
348
|
+
/* @__PURE__ */ jsxs2("header", { className: "fixed top-0 right-0 left-0 z-40 flex h-16 items-center justify-between border-border border-b bg-card/95 px-4 backdrop-blur-xl md:hidden", children: [
|
|
349
|
+
/* @__PURE__ */ jsx2(Logo, { variant, size: "sm" }),
|
|
350
|
+
/* @__PURE__ */ jsx2(
|
|
403
351
|
"button",
|
|
404
352
|
{
|
|
405
353
|
type: "button",
|
|
@@ -407,11 +355,11 @@ function DashboardLayout({
|
|
|
407
355
|
className: "rounded-md p-2 hover:bg-accent focus:outline-none focus:ring-2 focus:ring-offset-2",
|
|
408
356
|
"aria-label": mobileMenuOpen ? "Close menu" : "Open menu",
|
|
409
357
|
"aria-expanded": mobileMenuOpen,
|
|
410
|
-
children: mobileMenuOpen ? /* @__PURE__ */
|
|
358
|
+
children: mobileMenuOpen ? /* @__PURE__ */ jsx2(XIcon, { className: "h-6 w-6" }) : /* @__PURE__ */ jsx2(MenuIcon, { className: "h-6 w-6" })
|
|
411
359
|
}
|
|
412
360
|
)
|
|
413
361
|
] }),
|
|
414
|
-
mobileMenuOpen && /* @__PURE__ */
|
|
362
|
+
mobileMenuOpen && /* @__PURE__ */ jsx2(
|
|
415
363
|
"div",
|
|
416
364
|
{
|
|
417
365
|
className: "fixed inset-0 z-30 bg-black/50 md:hidden",
|
|
@@ -419,23 +367,23 @@ function DashboardLayout({
|
|
|
419
367
|
"aria-hidden": "true"
|
|
420
368
|
}
|
|
421
369
|
),
|
|
422
|
-
/* @__PURE__ */
|
|
370
|
+
/* @__PURE__ */ jsx2(
|
|
423
371
|
"aside",
|
|
424
372
|
{
|
|
425
373
|
className: cn(
|
|
426
374
|
"fixed top-16 bottom-0 left-0 z-30 flex w-64 flex-col border-border border-r bg-card/95 backdrop-blur-xl transition-transform duration-200 md:hidden",
|
|
427
375
|
mobileMenuOpen ? "translate-x-0" : "-translate-x-full"
|
|
428
376
|
),
|
|
429
|
-
children: /* @__PURE__ */
|
|
377
|
+
children: /* @__PURE__ */ jsx2(SidebarContent, {})
|
|
430
378
|
}
|
|
431
379
|
),
|
|
432
|
-
/* @__PURE__ */
|
|
433
|
-
/* @__PURE__ */
|
|
380
|
+
/* @__PURE__ */ jsx2("aside", { className: "fixed top-0 bottom-0 left-0 hidden w-64 flex-col border-border border-r bg-card/50 backdrop-blur-xl md:flex", children: /* @__PURE__ */ jsx2(SidebarContent, {}) }),
|
|
381
|
+
/* @__PURE__ */ jsx2("main", { className: "flex-1 pt-16 md:ml-64 md:pt-0", children: /* @__PURE__ */ jsx2("div", { className: "p-4 md:p-8", children: /* @__PURE__ */ jsx2("div", { className: "mx-auto max-w-6xl", children }) }) })
|
|
434
382
|
] });
|
|
435
383
|
}
|
|
436
384
|
|
|
437
385
|
// src/dashboard/backend-selector.tsx
|
|
438
|
-
import { jsx as
|
|
386
|
+
import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
439
387
|
function BackendSelector({
|
|
440
388
|
backends,
|
|
441
389
|
selected,
|
|
@@ -454,14 +402,14 @@ function BackendSelector({
|
|
|
454
402
|
onChange([type]);
|
|
455
403
|
}
|
|
456
404
|
};
|
|
457
|
-
return /* @__PURE__ */
|
|
458
|
-
/* @__PURE__ */
|
|
405
|
+
return /* @__PURE__ */ jsxs3("div", { className, children: [
|
|
406
|
+
/* @__PURE__ */ jsxs3("label", { className: "mb-2 block font-medium text-sm", children: [
|
|
459
407
|
label,
|
|
460
|
-
multiSelect && /* @__PURE__ */
|
|
408
|
+
multiSelect && /* @__PURE__ */ jsx3("span", { className: "ml-2 font-normal text-muted-foreground", children: "(select multiple to compare)" })
|
|
461
409
|
] }),
|
|
462
|
-
/* @__PURE__ */
|
|
410
|
+
/* @__PURE__ */ jsx3("div", { className: "flex flex-wrap gap-2", children: backends.map((backend) => {
|
|
463
411
|
const isSelected = selected.includes(backend.type);
|
|
464
|
-
return /* @__PURE__ */
|
|
412
|
+
return /* @__PURE__ */ jsx3(
|
|
465
413
|
"button",
|
|
466
414
|
{
|
|
467
415
|
type: "button",
|
|
@@ -473,13 +421,13 @@ function BackendSelector({
|
|
|
473
421
|
backend.type
|
|
474
422
|
);
|
|
475
423
|
}) }),
|
|
476
|
-
multiSelect && selected.length > 1 && /* @__PURE__ */
|
|
424
|
+
multiSelect && selected.length > 1 && /* @__PURE__ */ jsx3("p", { className: "mt-2 text-muted-foreground text-xs", children: hint || `Will run on ${selected.length} variants in parallel for comparison` })
|
|
477
425
|
] });
|
|
478
426
|
}
|
|
479
427
|
|
|
480
428
|
// src/dashboard/profile-selector.tsx
|
|
481
429
|
import { Check, ChevronDown, Plus, Settings } from "lucide-react";
|
|
482
|
-
import { Fragment as Fragment2, jsx as
|
|
430
|
+
import { Fragment as Fragment2, jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
483
431
|
function ProfileSelector({
|
|
484
432
|
profiles,
|
|
485
433
|
selectedId,
|
|
@@ -494,77 +442,77 @@ function ProfileSelector({
|
|
|
494
442
|
const selected = profiles.find((p) => p.id === selectedId);
|
|
495
443
|
const builtinProfiles = profiles.filter((p) => p.is_builtin);
|
|
496
444
|
const customProfiles = profiles.filter((p) => !p.is_builtin);
|
|
497
|
-
return /* @__PURE__ */
|
|
498
|
-
label && /* @__PURE__ */
|
|
499
|
-
/* @__PURE__ */
|
|
500
|
-
/* @__PURE__ */
|
|
501
|
-
/* @__PURE__ */
|
|
502
|
-
/* @__PURE__ */
|
|
445
|
+
return /* @__PURE__ */ jsxs4("div", { className, children: [
|
|
446
|
+
label && /* @__PURE__ */ jsx4("label", { className: "mb-2 block font-medium text-sm", children: label }),
|
|
447
|
+
/* @__PURE__ */ jsxs4(DropdownMenu, { children: [
|
|
448
|
+
/* @__PURE__ */ jsx4(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs4(Button, { variant: "outline", className: "w-full justify-between", children: [
|
|
449
|
+
/* @__PURE__ */ jsx4("span", { className: "truncate", children: selected ? selected.name : placeholder }),
|
|
450
|
+
/* @__PURE__ */ jsx4(ChevronDown, { className: "ml-2 h-4 w-4 shrink-0 opacity-50" })
|
|
503
451
|
] }) }),
|
|
504
|
-
/* @__PURE__ */
|
|
505
|
-
/* @__PURE__ */
|
|
452
|
+
/* @__PURE__ */ jsxs4(DropdownMenuContent, { className: "w-[300px]", align: "start", children: [
|
|
453
|
+
/* @__PURE__ */ jsxs4(
|
|
506
454
|
DropdownMenuItem,
|
|
507
455
|
{
|
|
508
456
|
onClick: () => onSelect(null),
|
|
509
457
|
className: "flex items-center justify-between",
|
|
510
458
|
children: [
|
|
511
|
-
/* @__PURE__ */
|
|
512
|
-
!selectedId && /* @__PURE__ */
|
|
459
|
+
/* @__PURE__ */ jsx4("span", { children: placeholder }),
|
|
460
|
+
!selectedId && /* @__PURE__ */ jsx4(Check, { className: "h-4 w-4 text-green-400" })
|
|
513
461
|
]
|
|
514
462
|
}
|
|
515
463
|
),
|
|
516
|
-
builtinProfiles.length > 0 && /* @__PURE__ */
|
|
517
|
-
/* @__PURE__ */
|
|
518
|
-
/* @__PURE__ */
|
|
519
|
-
builtinProfiles.map((profile) => /* @__PURE__ */
|
|
464
|
+
builtinProfiles.length > 0 && /* @__PURE__ */ jsxs4(Fragment2, { children: [
|
|
465
|
+
/* @__PURE__ */ jsx4(DropdownMenuSeparator, {}),
|
|
466
|
+
/* @__PURE__ */ jsx4(DropdownMenuLabel, { children: "Built-in Profiles" }),
|
|
467
|
+
builtinProfiles.map((profile) => /* @__PURE__ */ jsxs4(
|
|
520
468
|
DropdownMenuItem,
|
|
521
469
|
{
|
|
522
470
|
onClick: () => onSelect(profile),
|
|
523
471
|
className: "flex flex-col items-start gap-1",
|
|
524
472
|
children: [
|
|
525
|
-
/* @__PURE__ */
|
|
526
|
-
/* @__PURE__ */
|
|
527
|
-
/* @__PURE__ */
|
|
528
|
-
profile.extends && /* @__PURE__ */
|
|
473
|
+
/* @__PURE__ */ jsxs4("div", { className: "flex w-full items-center justify-between", children: [
|
|
474
|
+
/* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-2", children: [
|
|
475
|
+
/* @__PURE__ */ jsx4("span", { className: "font-medium", children: profile.name }),
|
|
476
|
+
profile.extends && /* @__PURE__ */ jsxs4(Badge, { variant: "secondary", className: "border-0 text-xs", children: [
|
|
529
477
|
"extends ",
|
|
530
478
|
profile.extends
|
|
531
479
|
] })
|
|
532
480
|
] }),
|
|
533
|
-
selectedId === profile.id && /* @__PURE__ */
|
|
481
|
+
selectedId === profile.id && /* @__PURE__ */ jsx4(Check, { className: "h-4 w-4 text-green-400" })
|
|
534
482
|
] }),
|
|
535
|
-
profile.description && /* @__PURE__ */
|
|
483
|
+
profile.description && /* @__PURE__ */ jsx4("span", { className: "line-clamp-1 text-muted-foreground text-xs", children: profile.description })
|
|
536
484
|
]
|
|
537
485
|
},
|
|
538
486
|
profile.id
|
|
539
487
|
))
|
|
540
488
|
] }),
|
|
541
|
-
customProfiles.length > 0 && /* @__PURE__ */
|
|
542
|
-
/* @__PURE__ */
|
|
543
|
-
/* @__PURE__ */
|
|
544
|
-
customProfiles.map((profile) => /* @__PURE__ */
|
|
489
|
+
customProfiles.length > 0 && /* @__PURE__ */ jsxs4(Fragment2, { children: [
|
|
490
|
+
/* @__PURE__ */ jsx4(DropdownMenuSeparator, {}),
|
|
491
|
+
/* @__PURE__ */ jsx4(DropdownMenuLabel, { children: "Custom Profiles" }),
|
|
492
|
+
customProfiles.map((profile) => /* @__PURE__ */ jsxs4(
|
|
545
493
|
DropdownMenuItem,
|
|
546
494
|
{
|
|
547
495
|
onClick: () => onSelect(profile),
|
|
548
496
|
className: "flex flex-col items-start gap-1",
|
|
549
497
|
children: [
|
|
550
|
-
/* @__PURE__ */
|
|
551
|
-
/* @__PURE__ */
|
|
552
|
-
/* @__PURE__ */
|
|
553
|
-
profile.model && /* @__PURE__ */
|
|
498
|
+
/* @__PURE__ */ jsxs4("div", { className: "flex w-full items-center justify-between", children: [
|
|
499
|
+
/* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-2", children: [
|
|
500
|
+
/* @__PURE__ */ jsx4("span", { className: "font-medium", children: profile.name }),
|
|
501
|
+
profile.model && /* @__PURE__ */ jsx4(Badge, { variant: "secondary", className: "border-0 text-xs", children: profile.model.split("/").pop() })
|
|
554
502
|
] }),
|
|
555
|
-
selectedId === profile.id && /* @__PURE__ */
|
|
503
|
+
selectedId === profile.id && /* @__PURE__ */ jsx4(Check, { className: "h-4 w-4 text-green-400" })
|
|
556
504
|
] }),
|
|
557
|
-
profile.description && /* @__PURE__ */
|
|
558
|
-
showMetrics && profile.metrics && profile.metrics.total_runs > 0 && /* @__PURE__ */
|
|
559
|
-
/* @__PURE__ */
|
|
505
|
+
profile.description && /* @__PURE__ */ jsx4("span", { className: "line-clamp-1 text-muted-foreground text-xs", children: profile.description }),
|
|
506
|
+
showMetrics && profile.metrics && profile.metrics.total_runs > 0 && /* @__PURE__ */ jsxs4("div", { className: "flex gap-3 text-muted-foreground text-xs", children: [
|
|
507
|
+
/* @__PURE__ */ jsxs4("span", { children: [
|
|
560
508
|
profile.metrics.total_runs,
|
|
561
509
|
" runs"
|
|
562
510
|
] }),
|
|
563
|
-
/* @__PURE__ */
|
|
511
|
+
/* @__PURE__ */ jsxs4("span", { children: [
|
|
564
512
|
profile.metrics.success_rate.toFixed(0),
|
|
565
513
|
"% success"
|
|
566
514
|
] }),
|
|
567
|
-
/* @__PURE__ */
|
|
515
|
+
/* @__PURE__ */ jsxs4("span", { children: [
|
|
568
516
|
"~",
|
|
569
517
|
(profile.metrics.avg_duration_ms / 1e3).toFixed(1),
|
|
570
518
|
"s avg"
|
|
@@ -575,26 +523,26 @@ function ProfileSelector({
|
|
|
575
523
|
profile.id
|
|
576
524
|
))
|
|
577
525
|
] }),
|
|
578
|
-
(onCreateClick || onManageClick) && /* @__PURE__ */
|
|
579
|
-
/* @__PURE__ */
|
|
580
|
-
onCreateClick && /* @__PURE__ */
|
|
526
|
+
(onCreateClick || onManageClick) && /* @__PURE__ */ jsxs4(Fragment2, { children: [
|
|
527
|
+
/* @__PURE__ */ jsx4(DropdownMenuSeparator, {}),
|
|
528
|
+
onCreateClick && /* @__PURE__ */ jsxs4(
|
|
581
529
|
DropdownMenuItem,
|
|
582
530
|
{
|
|
583
531
|
onClick: onCreateClick,
|
|
584
532
|
className: "text-blue-400",
|
|
585
533
|
children: [
|
|
586
|
-
/* @__PURE__ */
|
|
534
|
+
/* @__PURE__ */ jsx4(Plus, { className: "mr-2 h-4 w-4" }),
|
|
587
535
|
"Create New Profile"
|
|
588
536
|
]
|
|
589
537
|
}
|
|
590
538
|
),
|
|
591
|
-
onManageClick && /* @__PURE__ */
|
|
539
|
+
onManageClick && /* @__PURE__ */ jsxs4(
|
|
592
540
|
DropdownMenuItem,
|
|
593
541
|
{
|
|
594
542
|
onClick: onManageClick,
|
|
595
543
|
className: "text-muted-foreground",
|
|
596
544
|
children: [
|
|
597
|
-
/* @__PURE__ */
|
|
545
|
+
/* @__PURE__ */ jsx4(Settings, { className: "mr-2 h-4 w-4" }),
|
|
598
546
|
"Manage Profiles"
|
|
599
547
|
]
|
|
600
548
|
}
|
|
@@ -620,26 +568,26 @@ function ProfileComparison({
|
|
|
620
568
|
const fastestProfile = profilesWithMetrics.reduce(
|
|
621
569
|
(best, p) => (p.metrics?.avg_duration_ms ?? Number.POSITIVE_INFINITY) < (best.metrics?.avg_duration_ms ?? Number.POSITIVE_INFINITY) ? p : best
|
|
622
570
|
);
|
|
623
|
-
return /* @__PURE__ */
|
|
624
|
-
/* @__PURE__ */
|
|
625
|
-
/* @__PURE__ */
|
|
571
|
+
return /* @__PURE__ */ jsxs4("div", { className: `rounded-lg border border-border p-4 ${className ?? ""}`, children: [
|
|
572
|
+
/* @__PURE__ */ jsx4("h4", { className: "mb-3 font-medium text-sm", children: "Profile Performance" }),
|
|
573
|
+
/* @__PURE__ */ jsx4("div", { className: "space-y-3", children: profilesWithMetrics.map((profile) => {
|
|
626
574
|
const isBestSuccess = profile.id === bestSuccess.id;
|
|
627
575
|
const isFastest = profile.id === fastestProfile.id;
|
|
628
|
-
return /* @__PURE__ */
|
|
576
|
+
return /* @__PURE__ */ jsxs4(
|
|
629
577
|
"div",
|
|
630
578
|
{
|
|
631
579
|
className: "flex items-center justify-between gap-4",
|
|
632
580
|
children: [
|
|
633
|
-
/* @__PURE__ */
|
|
634
|
-
/* @__PURE__ */
|
|
635
|
-
isBestSuccess && /* @__PURE__ */
|
|
636
|
-
isFastest && !isBestSuccess && /* @__PURE__ */
|
|
581
|
+
/* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-2", children: [
|
|
582
|
+
/* @__PURE__ */ jsx4("span", { className: "font-medium", children: profile.name }),
|
|
583
|
+
isBestSuccess && /* @__PURE__ */ jsx4(Badge, { className: "border-0 bg-green-500/10 text-green-400 text-xs", children: "Best Success" }),
|
|
584
|
+
isFastest && !isBestSuccess && /* @__PURE__ */ jsx4(Badge, { className: "border-0 bg-blue-500/10 text-blue-400 text-xs", children: "Fastest" })
|
|
637
585
|
] }),
|
|
638
|
-
/* @__PURE__ */
|
|
639
|
-
/* @__PURE__ */
|
|
640
|
-
/* @__PURE__ */
|
|
586
|
+
/* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-4 text-sm", children: [
|
|
587
|
+
/* @__PURE__ */ jsxs4("span", { children: [
|
|
588
|
+
/* @__PURE__ */ jsx4("span", { className: "text-muted-foreground", children: "Success:" }),
|
|
641
589
|
" ",
|
|
642
|
-
/* @__PURE__ */
|
|
590
|
+
/* @__PURE__ */ jsxs4(
|
|
643
591
|
"span",
|
|
644
592
|
{
|
|
645
593
|
className: (profile.metrics?.success_rate ?? 0) >= 80 ? "text-green-400" : (profile.metrics?.success_rate ?? 0) >= 50 ? "text-yellow-400" : "text-red-400",
|
|
@@ -650,13 +598,13 @@ function ProfileComparison({
|
|
|
650
598
|
}
|
|
651
599
|
)
|
|
652
600
|
] }),
|
|
653
|
-
/* @__PURE__ */
|
|
654
|
-
/* @__PURE__ */
|
|
601
|
+
/* @__PURE__ */ jsxs4("span", { children: [
|
|
602
|
+
/* @__PURE__ */ jsx4("span", { className: "text-muted-foreground", children: "Avg:" }),
|
|
655
603
|
" ",
|
|
656
604
|
((profile.metrics?.avg_duration_ms ?? 0) / 1e3).toFixed(1),
|
|
657
605
|
"s"
|
|
658
606
|
] }),
|
|
659
|
-
/* @__PURE__ */
|
|
607
|
+
/* @__PURE__ */ jsxs4("span", { className: "text-muted-foreground", children: [
|
|
660
608
|
profile.metrics?.total_runs,
|
|
661
609
|
" runs"
|
|
662
610
|
] })
|
|
@@ -680,7 +628,7 @@ import {
|
|
|
680
628
|
X,
|
|
681
629
|
XCircle
|
|
682
630
|
} from "lucide-react";
|
|
683
|
-
import { jsx as
|
|
631
|
+
import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
684
632
|
var statusConfig = {
|
|
685
633
|
pending: {
|
|
686
634
|
icon: Clock,
|
|
@@ -754,20 +702,20 @@ function VariantList({
|
|
|
754
702
|
isActioning,
|
|
755
703
|
className
|
|
756
704
|
}) {
|
|
757
|
-
return /* @__PURE__ */
|
|
705
|
+
return /* @__PURE__ */ jsx5("div", { className: `space-y-3 ${className || ""}`, children: variants.map((variant) => {
|
|
758
706
|
const status = statusConfig[variant.status];
|
|
759
707
|
const StatusIcon = status.icon;
|
|
760
708
|
const isSelected = variant.id === selectedId;
|
|
761
|
-
return /* @__PURE__ */
|
|
709
|
+
return /* @__PURE__ */ jsxs5(
|
|
762
710
|
"div",
|
|
763
711
|
{
|
|
764
712
|
className: `cursor-pointer rounded-lg border p-4 transition-colors ${isSelected ? "border-blue-500 bg-blue-500/5" : "border-border hover:border-muted-foreground/50"}`,
|
|
765
713
|
onClick: () => onSelect?.(variant.id),
|
|
766
714
|
children: [
|
|
767
|
-
/* @__PURE__ */
|
|
768
|
-
/* @__PURE__ */
|
|
769
|
-
/* @__PURE__ */
|
|
770
|
-
/* @__PURE__ */
|
|
715
|
+
/* @__PURE__ */ jsxs5("div", { className: "flex items-center justify-between", children: [
|
|
716
|
+
/* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-3", children: [
|
|
717
|
+
/* @__PURE__ */ jsxs5(Badge, { className: `${status.bg} ${status.color} border-0`, children: [
|
|
718
|
+
/* @__PURE__ */ jsx5(
|
|
771
719
|
StatusIcon,
|
|
772
720
|
{
|
|
773
721
|
className: `mr-1 h-3 w-3 ${status.animate ? "animate-spin" : ""}`
|
|
@@ -775,28 +723,28 @@ function VariantList({
|
|
|
775
723
|
),
|
|
776
724
|
status.label
|
|
777
725
|
] }),
|
|
778
|
-
/* @__PURE__ */
|
|
779
|
-
variant.sublabel && /* @__PURE__ */
|
|
726
|
+
/* @__PURE__ */ jsx5("span", { className: "font-medium", children: variant.label }),
|
|
727
|
+
variant.sublabel && /* @__PURE__ */ jsxs5("span", { className: "text-muted-foreground text-sm", children: [
|
|
780
728
|
"(",
|
|
781
729
|
variant.sublabel,
|
|
782
730
|
")"
|
|
783
731
|
] }),
|
|
784
|
-
variant.durationMs && /* @__PURE__ */
|
|
785
|
-
/* @__PURE__ */
|
|
732
|
+
variant.durationMs && /* @__PURE__ */ jsxs5("span", { className: "flex items-center gap-1 text-muted-foreground text-sm", children: [
|
|
733
|
+
/* @__PURE__ */ jsx5(Timer, { className: "h-3 w-3" }),
|
|
786
734
|
(variant.durationMs / 1e3).toFixed(2),
|
|
787
735
|
"s"
|
|
788
736
|
] })
|
|
789
737
|
] }),
|
|
790
|
-
/* @__PURE__ */
|
|
791
|
-
variant.outcome && /* @__PURE__ */
|
|
738
|
+
/* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-2", children: [
|
|
739
|
+
variant.outcome && /* @__PURE__ */ jsx5(
|
|
792
740
|
Badge,
|
|
793
741
|
{
|
|
794
742
|
className: `${outcomeConfig[variant.outcome].bg} ${outcomeConfig[variant.outcome].color} border-0`,
|
|
795
743
|
children: outcomeConfig[variant.outcome].label
|
|
796
744
|
}
|
|
797
745
|
),
|
|
798
|
-
variant.status === "completed" && variant.outcome === "pending_review" && onAccept && onReject && /* @__PURE__ */
|
|
799
|
-
/* @__PURE__ */
|
|
746
|
+
variant.status === "completed" && variant.outcome === "pending_review" && onAccept && onReject && /* @__PURE__ */ jsxs5("div", { className: "flex items-center gap-2", children: [
|
|
747
|
+
/* @__PURE__ */ jsxs5(
|
|
800
748
|
Button,
|
|
801
749
|
{
|
|
802
750
|
variant: "outline",
|
|
@@ -808,12 +756,12 @@ function VariantList({
|
|
|
808
756
|
},
|
|
809
757
|
disabled: isActioning === variant.id,
|
|
810
758
|
children: [
|
|
811
|
-
/* @__PURE__ */
|
|
759
|
+
/* @__PURE__ */ jsx5(Check2, { className: "mr-1 h-4 w-4" }),
|
|
812
760
|
"Accept"
|
|
813
761
|
]
|
|
814
762
|
}
|
|
815
763
|
),
|
|
816
|
-
/* @__PURE__ */
|
|
764
|
+
/* @__PURE__ */ jsxs5(
|
|
817
765
|
Button,
|
|
818
766
|
{
|
|
819
767
|
variant: "outline",
|
|
@@ -825,13 +773,13 @@ function VariantList({
|
|
|
825
773
|
},
|
|
826
774
|
disabled: isActioning === variant.id,
|
|
827
775
|
children: [
|
|
828
|
-
/* @__PURE__ */
|
|
776
|
+
/* @__PURE__ */ jsx5(X, { className: "mr-1 h-4 w-4" }),
|
|
829
777
|
"Reject"
|
|
830
778
|
]
|
|
831
779
|
}
|
|
832
780
|
)
|
|
833
781
|
] }),
|
|
834
|
-
variant.detailsUrl && /* @__PURE__ */
|
|
782
|
+
variant.detailsUrl && /* @__PURE__ */ jsx5(
|
|
835
783
|
Button,
|
|
836
784
|
{
|
|
837
785
|
variant: "ghost",
|
|
@@ -841,13 +789,13 @@ function VariantList({
|
|
|
841
789
|
e.stopPropagation();
|
|
842
790
|
window.open(variant.detailsUrl, "_blank");
|
|
843
791
|
},
|
|
844
|
-
children: /* @__PURE__ */
|
|
792
|
+
children: /* @__PURE__ */ jsx5(ExternalLink, { className: "h-4 w-4" })
|
|
845
793
|
}
|
|
846
794
|
)
|
|
847
795
|
] })
|
|
848
796
|
] }),
|
|
849
|
-
variant.error && /* @__PURE__ */
|
|
850
|
-
variant.summary && /* @__PURE__ */
|
|
797
|
+
variant.error && /* @__PURE__ */ jsx5("p", { className: "mt-2 text-red-400 text-sm", children: variant.error }),
|
|
798
|
+
variant.summary && /* @__PURE__ */ jsx5("p", { className: "mt-2 line-clamp-2 text-muted-foreground text-sm", children: variant.summary })
|
|
851
799
|
]
|
|
852
800
|
},
|
|
853
801
|
variant.id
|
|
@@ -856,8 +804,6 @@ function VariantList({
|
|
|
856
804
|
}
|
|
857
805
|
|
|
858
806
|
export {
|
|
859
|
-
TangleKnot,
|
|
860
|
-
Logo,
|
|
861
807
|
useTheme,
|
|
862
808
|
ThemeToggle,
|
|
863
809
|
DashboardLayout,
|