pxengine 0.1.58 → 0.1.60
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/index.cjs +337 -1514
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +7 -208
- package/dist/index.d.ts +7 -208
- package/dist/index.mjs +335 -1502
- package/dist/index.mjs.map +1 -1
- package/dist/registry.json +1 -394
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -5,7 +5,7 @@ var __export = (target, all) => {
|
|
|
5
5
|
};
|
|
6
6
|
|
|
7
7
|
// src/render/PXEngineRenderer.tsx
|
|
8
|
-
import
|
|
8
|
+
import React102 from "react";
|
|
9
9
|
|
|
10
10
|
// src/atoms/index.ts
|
|
11
11
|
var atoms_exports = {};
|
|
@@ -105,9 +105,11 @@ var TextAtom = ({
|
|
|
105
105
|
label: "var(--gray400)"
|
|
106
106
|
};
|
|
107
107
|
const Component2 = variant === "small" || variant === "muted" || variant === "label" ? "p" : variant;
|
|
108
|
+
const hasPxBg = style && "--px-bg-color" in style;
|
|
108
109
|
const wrapperStyles = {
|
|
109
110
|
color: `var(--px-text-color, ${defaultColors[variant] ?? "inherit"})`,
|
|
110
111
|
...backgroundColor && { backgroundColor },
|
|
112
|
+
...hasPxBg && { backgroundColor: "var(--px-bg-color, transparent)" },
|
|
111
113
|
...style
|
|
112
114
|
};
|
|
113
115
|
if (markdown) {
|
|
@@ -24570,14 +24572,20 @@ var IconAtom = ({
|
|
|
24570
24572
|
console.warn(`[IconAtom] Icon "${icon}" not found in lucide-react.`);
|
|
24571
24573
|
return null;
|
|
24572
24574
|
}
|
|
24575
|
+
const hasPxVars = style && Object.keys(style).some((k) => k.startsWith("--px-"));
|
|
24576
|
+
const resolvedColor = hasPxVars ? void 0 : color;
|
|
24577
|
+
const resolvedStyle = {
|
|
24578
|
+
...hasPxVars && { color: "var(--px-text-color, currentColor)" },
|
|
24579
|
+
...style
|
|
24580
|
+
};
|
|
24573
24581
|
return /* @__PURE__ */ jsx3(
|
|
24574
24582
|
IconComponent,
|
|
24575
24583
|
{
|
|
24576
24584
|
size,
|
|
24577
|
-
color,
|
|
24585
|
+
color: resolvedColor,
|
|
24578
24586
|
strokeWidth,
|
|
24579
|
-
className: cn("shrink-0", textColor, className),
|
|
24580
|
-
style
|
|
24587
|
+
className: cn("shrink-0", !hasPxVars && textColor, className),
|
|
24588
|
+
style: resolvedStyle
|
|
24581
24589
|
}
|
|
24582
24590
|
);
|
|
24583
24591
|
};
|
|
@@ -24612,6 +24620,14 @@ var ButtonAtom = ({
|
|
|
24612
24620
|
};
|
|
24613
24621
|
const customClass = variantMap[variant] || "";
|
|
24614
24622
|
const shadcnVariant = ["purple", "gradient"].includes(variant) ? "default" : variant;
|
|
24623
|
+
const hasPxVars = style && Object.keys(style).some((k) => k.startsWith("--px-"));
|
|
24624
|
+
const mergedStyle = {
|
|
24625
|
+
...style,
|
|
24626
|
+
...hasPxVars ? {
|
|
24627
|
+
backgroundColor: "var(--px-accent-color)",
|
|
24628
|
+
color: "var(--px-accent-fg)"
|
|
24629
|
+
} : {}
|
|
24630
|
+
};
|
|
24615
24631
|
return /* @__PURE__ */ jsx4(
|
|
24616
24632
|
Button,
|
|
24617
24633
|
{
|
|
@@ -24620,7 +24636,8 @@ var ButtonAtom = ({
|
|
|
24620
24636
|
disabled: disabled || isLoading,
|
|
24621
24637
|
onClick: handleClick,
|
|
24622
24638
|
className: cn("rounded-full font-semibold", customClass, className),
|
|
24623
|
-
style,
|
|
24639
|
+
style: mergedStyle,
|
|
24640
|
+
"data-px-styled": hasPxVars ? "" : void 0,
|
|
24624
24641
|
children: isLoading ? /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
24625
24642
|
/* @__PURE__ */ jsx4(LoaderCircle, { className: "mr-2 h-4 w-4 animate-spin" }),
|
|
24626
24643
|
label
|
|
@@ -24749,6 +24766,15 @@ var CardAtom = ({
|
|
|
24749
24766
|
style,
|
|
24750
24767
|
renderComponent
|
|
24751
24768
|
}) => {
|
|
24769
|
+
const hasPxVars = style && Object.keys(style).some((k) => k.startsWith("--px-"));
|
|
24770
|
+
const mergedStyle = {
|
|
24771
|
+
...style,
|
|
24772
|
+
...hasPxVars ? {
|
|
24773
|
+
backgroundColor: "var(--px-bg-color)",
|
|
24774
|
+
borderColor: "var(--px-border-color)",
|
|
24775
|
+
color: "var(--px-text-color)"
|
|
24776
|
+
} : {}
|
|
24777
|
+
};
|
|
24752
24778
|
return /* @__PURE__ */ jsxs2(
|
|
24753
24779
|
Card,
|
|
24754
24780
|
{
|
|
@@ -24756,13 +24782,14 @@ var CardAtom = ({
|
|
|
24756
24782
|
"rounded-[32px] border border-border/50 bg-card/80 text-card-foreground shadow-[0_8px_30px_rgb(0,0,0,0.04)] overflow-hidden backdrop-blur-xl ring-1 ring-border/5",
|
|
24757
24783
|
className
|
|
24758
24784
|
),
|
|
24759
|
-
style,
|
|
24785
|
+
style: mergedStyle,
|
|
24786
|
+
"data-px-styled": hasPxVars ? "" : void 0,
|
|
24760
24787
|
children: [
|
|
24761
24788
|
(title || description) && /* @__PURE__ */ jsxs2(CardHeader, { children: [
|
|
24762
24789
|
title && /* @__PURE__ */ jsx7(CardTitle, { className: "text-xl font-bold text-gray900", children: title }),
|
|
24763
24790
|
description && /* @__PURE__ */ jsx7(CardDescription, { children: description })
|
|
24764
24791
|
] }),
|
|
24765
|
-
/* @__PURE__ */ jsx7(CardContent, { className: "space-y-4", children: children.map((child, index) => /* @__PURE__ */ jsx7(React4.Fragment, { children: renderComponent(child, index) }, child.id || `card-content-${index}`)) }),
|
|
24792
|
+
/* @__PURE__ */ jsx7(CardContent, { className: "space-y-4", children: (children || []).map((child, index) => /* @__PURE__ */ jsx7(React4.Fragment, { children: renderComponent(child, index) }, child.id || `card-content-${index}`)) }),
|
|
24766
24793
|
footer && footer.length > 0 && /* @__PURE__ */ jsx7(CardFooter, { className: "bg-gray50/50 border-t border-gray200 flex flex-wrap gap-2 pt-6", children: footer.map((footerChild, index) => /* @__PURE__ */ jsx7(React4.Fragment, { children: renderComponent(footerChild, index) }, footerChild.id || `card-footer-${index}`)) })
|
|
24767
24794
|
]
|
|
24768
24795
|
}
|
|
@@ -25111,8 +25138,9 @@ var InputAtom = ({
|
|
|
25111
25138
|
const alignmentClass = getAlignmentClass(style?.textAlign);
|
|
25112
25139
|
const alignedContainerClass = cn(containerClass, alignmentClass);
|
|
25113
25140
|
const { textAlign, ...remainingStyle } = style || {};
|
|
25141
|
+
const hasPxVars = style && Object.keys(style).some((key) => key.startsWith("--px-"));
|
|
25114
25142
|
const labelBaseStyle = {
|
|
25115
|
-
color: labelColor,
|
|
25143
|
+
color: hasPxVars ? "var(--px-label-color, inherit)" : labelColor,
|
|
25116
25144
|
backgroundColor: "transparent",
|
|
25117
25145
|
background: "none"
|
|
25118
25146
|
};
|
|
@@ -25132,6 +25160,14 @@ var InputAtom = ({
|
|
|
25132
25160
|
);
|
|
25133
25161
|
};
|
|
25134
25162
|
const renderInput = () => {
|
|
25163
|
+
const inputStyle = {
|
|
25164
|
+
...hasPxVars && {
|
|
25165
|
+
color: "var(--px-text-color, inherit)",
|
|
25166
|
+
backgroundColor: "var(--px-bg-color, transparent)",
|
|
25167
|
+
borderColor: "var(--px-border-color, hsl(var(--border)))"
|
|
25168
|
+
},
|
|
25169
|
+
...remainingStyle
|
|
25170
|
+
};
|
|
25135
25171
|
const commonProps = {
|
|
25136
25172
|
placeholder,
|
|
25137
25173
|
value: defaultValue,
|
|
@@ -25142,7 +25178,7 @@ var InputAtom = ({
|
|
|
25142
25178
|
"rounded-xl border-border bg-transparent focus:ring-primary shadow-none",
|
|
25143
25179
|
className
|
|
25144
25180
|
),
|
|
25145
|
-
style:
|
|
25181
|
+
style: inputStyle
|
|
25146
25182
|
};
|
|
25147
25183
|
switch (inputType) {
|
|
25148
25184
|
case "textarea":
|
|
@@ -25262,7 +25298,6 @@ var InputAtom = ({
|
|
|
25262
25298
|
);
|
|
25263
25299
|
}
|
|
25264
25300
|
};
|
|
25265
|
-
const hasPxVars = style && Object.keys(style).some((key) => key.startsWith("--px-"));
|
|
25266
25301
|
return /* @__PURE__ */ jsxs6("div", { className: alignedContainerClass, style: remainingStyle, "data-px-styled": hasPxVars ? "" : void 0, children: [
|
|
25267
25302
|
inputType !== "checkbox" && inputType !== "switch" && renderLabel(),
|
|
25268
25303
|
renderInput()
|
|
@@ -25378,9 +25413,22 @@ var AvatarAtom = ({
|
|
|
25378
25413
|
className,
|
|
25379
25414
|
style
|
|
25380
25415
|
}) => {
|
|
25381
|
-
|
|
25416
|
+
const hasPxVars = style && Object.keys(style).some((k) => k.startsWith("--px-"));
|
|
25417
|
+
const fallbackStyle = hasPxVars ? {
|
|
25418
|
+
backgroundColor: "var(--px-bg-color, var(--purple50))",
|
|
25419
|
+
color: "var(--px-text-color, var(--purple100))",
|
|
25420
|
+
borderColor: "var(--px-border-color, transparent)"
|
|
25421
|
+
} : void 0;
|
|
25422
|
+
return /* @__PURE__ */ jsxs7(Avatar, { className: cn("h-10 w-10", className), style, "data-px-styled": hasPxVars ? "" : void 0, children: [
|
|
25382
25423
|
src && /* @__PURE__ */ jsx21(AvatarImage, { src, alt }),
|
|
25383
|
-
/* @__PURE__ */ jsx21(
|
|
25424
|
+
/* @__PURE__ */ jsx21(
|
|
25425
|
+
AvatarFallback,
|
|
25426
|
+
{
|
|
25427
|
+
className: cn("font-bold uppercase", !hasPxVars && "bg-purple50 text-purple600"),
|
|
25428
|
+
style: fallbackStyle,
|
|
25429
|
+
children: fallback
|
|
25430
|
+
}
|
|
25431
|
+
)
|
|
25384
25432
|
] });
|
|
25385
25433
|
};
|
|
25386
25434
|
|
|
@@ -25548,7 +25596,20 @@ var ProgressAtom = ({
|
|
|
25548
25596
|
style
|
|
25549
25597
|
}) => {
|
|
25550
25598
|
const hasPxVars = style && Object.keys(style).some((key) => key.startsWith("--px-"));
|
|
25551
|
-
|
|
25599
|
+
const progressStyle = hasPxVars ? {
|
|
25600
|
+
backgroundColor: "var(--px-track-color)"
|
|
25601
|
+
} : {};
|
|
25602
|
+
const wrapperStyle = {
|
|
25603
|
+
...style
|
|
25604
|
+
};
|
|
25605
|
+
return /* @__PURE__ */ jsx27("div", { className: cn("w-full py-2", className), style: wrapperStyle, "data-px-styled": hasPxVars ? "" : void 0, children: /* @__PURE__ */ jsx27(
|
|
25606
|
+
Progress,
|
|
25607
|
+
{
|
|
25608
|
+
value,
|
|
25609
|
+
className: "h-2 bg-gray-100",
|
|
25610
|
+
style: progressStyle
|
|
25611
|
+
}
|
|
25612
|
+
) });
|
|
25552
25613
|
};
|
|
25553
25614
|
|
|
25554
25615
|
// src/components/ui/skeleton.tsx
|
|
@@ -25658,12 +25719,22 @@ var AlertAtom = ({
|
|
|
25658
25719
|
};
|
|
25659
25720
|
const customClass = variantMap[variant] || "";
|
|
25660
25721
|
const shadcnVariant = ["warning", "info", "success"].includes(variant) ? "default" : variant;
|
|
25722
|
+
const hasPxVars = style && Object.keys(style).some((k) => k.startsWith("--px-"));
|
|
25723
|
+
const mergedStyle = {
|
|
25724
|
+
...style,
|
|
25725
|
+
...hasPxVars ? {
|
|
25726
|
+
color: "var(--px-text-color)",
|
|
25727
|
+
backgroundColor: "var(--px-bg-color)",
|
|
25728
|
+
borderColor: "var(--px-border-color)"
|
|
25729
|
+
} : {}
|
|
25730
|
+
};
|
|
25661
25731
|
return /* @__PURE__ */ jsxs11(
|
|
25662
25732
|
Alert,
|
|
25663
25733
|
{
|
|
25664
25734
|
variant: shadcnVariant,
|
|
25665
25735
|
className: cn("rounded-2xl", customClass, className),
|
|
25666
|
-
style,
|
|
25736
|
+
style: mergedStyle,
|
|
25737
|
+
"data-px-styled": hasPxVars ? "" : void 0,
|
|
25667
25738
|
children: [
|
|
25668
25739
|
/* @__PURE__ */ jsx31(Icon3, { className: "h-4 w-4" }),
|
|
25669
25740
|
/* @__PURE__ */ jsx31(AlertTitle, { className: "font-bold", children: title }),
|
|
@@ -25699,13 +25770,20 @@ Separator2.displayName = SeparatorPrimitive.Root.displayName;
|
|
|
25699
25770
|
import { jsx as jsx33 } from "react/jsx-runtime";
|
|
25700
25771
|
var SeparatorAtom = ({
|
|
25701
25772
|
orientation = "horizontal",
|
|
25702
|
-
className
|
|
25773
|
+
className,
|
|
25774
|
+
style
|
|
25703
25775
|
}) => {
|
|
25776
|
+
const hasPxVars = style && Object.keys(style).some((k) => k.startsWith("--px-"));
|
|
25777
|
+
const resolvedStyle = {
|
|
25778
|
+
...hasPxVars && { backgroundColor: "var(--px-bg-color)" },
|
|
25779
|
+
...style
|
|
25780
|
+
};
|
|
25704
25781
|
return /* @__PURE__ */ jsx33(
|
|
25705
25782
|
Separator2,
|
|
25706
25783
|
{
|
|
25707
25784
|
orientation,
|
|
25708
|
-
className: cn("bg-gray-100", className)
|
|
25785
|
+
className: cn("bg-gray-100", className),
|
|
25786
|
+
style: resolvedStyle
|
|
25709
25787
|
}
|
|
25710
25788
|
);
|
|
25711
25789
|
};
|
|
@@ -25826,11 +25904,11 @@ var TableAtom = ({
|
|
|
25826
25904
|
borderColor
|
|
25827
25905
|
},
|
|
25828
25906
|
children: /* @__PURE__ */ jsxs12(Table3, { children: [
|
|
25829
|
-
/* @__PURE__ */ jsx35(TableHeader, {
|
|
25907
|
+
/* @__PURE__ */ jsx35(TableHeader, { children: /* @__PURE__ */ jsx35(TableRow, { style: { backgroundColor: headerBgColor }, children: safeHeaders.map((header, i) => /* @__PURE__ */ jsx35(
|
|
25830
25908
|
TableHead,
|
|
25831
25909
|
{
|
|
25832
25910
|
className: "text-xs font-bold uppercase tracking-widest px-6 py-4",
|
|
25833
|
-
style: { color: headerTextColor },
|
|
25911
|
+
style: { color: headerTextColor, backgroundColor: headerBgColor },
|
|
25834
25912
|
children: header
|
|
25835
25913
|
},
|
|
25836
25914
|
i
|
|
@@ -31451,16 +31529,28 @@ import { jsx as jsx56 } from "react/jsx-runtime";
|
|
|
31451
31529
|
var CalendarAtom = ({
|
|
31452
31530
|
mode = "single",
|
|
31453
31531
|
selectedDate,
|
|
31454
|
-
className
|
|
31532
|
+
className,
|
|
31533
|
+
style
|
|
31455
31534
|
}) => {
|
|
31456
31535
|
const date = selectedDate ? new Date(selectedDate) : void 0;
|
|
31536
|
+
const hasPxVars = style && Object.keys(style).some((k) => k.startsWith("--px-"));
|
|
31537
|
+
const wrapperStyle = {
|
|
31538
|
+
...hasPxVars && {
|
|
31539
|
+
backgroundColor: "var(--px-bg-color, transparent)",
|
|
31540
|
+
borderColor: "var(--px-border-color, hsl(var(--border) / 0.5))",
|
|
31541
|
+
color: "var(--px-text-color, inherit)"
|
|
31542
|
+
},
|
|
31543
|
+
...style
|
|
31544
|
+
};
|
|
31457
31545
|
return /* @__PURE__ */ jsx56(
|
|
31458
31546
|
"div",
|
|
31459
31547
|
{
|
|
31460
31548
|
className: cn(
|
|
31461
|
-
"p-4
|
|
31549
|
+
"p-4 backdrop-blur-xl rounded-[28px] border shadow-[0_20px_50px_rgba(0,0,0,0.1)] inline-block transition-all hover:shadow-[0_20px_60px_rgba(0,0,0,0.15)] ring-1 ring-border/5",
|
|
31550
|
+
!hasPxVars && "bg-background/80 border-border/50",
|
|
31462
31551
|
className
|
|
31463
31552
|
),
|
|
31553
|
+
style: wrapperStyle,
|
|
31464
31554
|
children: /* @__PURE__ */ jsx56(Calendar2, { mode, selected: date, className: "rounded-xl" })
|
|
31465
31555
|
}
|
|
31466
31556
|
);
|
|
@@ -33257,12 +33347,25 @@ var ChartAtom = ({
|
|
|
33257
33347
|
return null;
|
|
33258
33348
|
}
|
|
33259
33349
|
};
|
|
33350
|
+
const hasPxVars = style && Object.keys(style).some((k) => k.startsWith("--px-"));
|
|
33351
|
+
const wrapperStyle = {
|
|
33352
|
+
...hasPxVars && {
|
|
33353
|
+
color: "var(--px-text-color, inherit)",
|
|
33354
|
+
backgroundColor: "var(--px-bg-color, transparent)",
|
|
33355
|
+
borderColor: "var(--px-border-color, transparent)",
|
|
33356
|
+
borderWidth: hasPxVars ? "1px" : void 0,
|
|
33357
|
+
borderStyle: hasPxVars ? "solid" : void 0,
|
|
33358
|
+
borderRadius: "1rem",
|
|
33359
|
+
padding: "0.75rem"
|
|
33360
|
+
},
|
|
33361
|
+
...style
|
|
33362
|
+
};
|
|
33260
33363
|
return /* @__PURE__ */ jsx85(
|
|
33261
33364
|
ChartContainer,
|
|
33262
33365
|
{
|
|
33263
33366
|
config: safeConfig,
|
|
33264
33367
|
className: cn("min-h-[200px] w-full", className),
|
|
33265
|
-
style,
|
|
33368
|
+
style: wrapperStyle,
|
|
33266
33369
|
children: renderChart()
|
|
33267
33370
|
}
|
|
33268
33371
|
);
|
|
@@ -33305,7 +33408,8 @@ import React80 from "react";
|
|
|
33305
33408
|
import { jsx as jsx87 } from "react/jsx-runtime";
|
|
33306
33409
|
var RatingAtom = ({ value, max: max2 = 5, readonly = false, className, style, onChange }) => {
|
|
33307
33410
|
const [hoverValue, setHoverValue] = React80.useState(null);
|
|
33308
|
-
|
|
33411
|
+
const hasPxVars = style && Object.keys(style).some((k) => k.startsWith("--px-"));
|
|
33412
|
+
return /* @__PURE__ */ jsx87("div", { className: cn("flex items-center gap-1", className), style, "data-px-styled": hasPxVars ? "" : void 0, children: Array.from({ length: max2 }, (_, i) => {
|
|
33309
33413
|
const starValue = i + 1;
|
|
33310
33414
|
const isActive = (hoverValue ?? value) >= starValue;
|
|
33311
33415
|
return /* @__PURE__ */ jsx87(
|
|
@@ -33313,9 +33417,13 @@ var RatingAtom = ({ value, max: max2 = 5, readonly = false, className, style, on
|
|
|
33313
33417
|
{
|
|
33314
33418
|
className: cn(
|
|
33315
33419
|
"h-5 w-5 transition-colors",
|
|
33316
|
-
isActive ? "fill-yellow-400 text-yellow-400" : "text-gray-300",
|
|
33420
|
+
!hasPxVars && (isActive ? "fill-yellow-400 text-yellow-400" : "text-gray-300"),
|
|
33317
33421
|
!readonly && "cursor-pointer hover:scale-110"
|
|
33318
33422
|
),
|
|
33423
|
+
style: hasPxVars ? {
|
|
33424
|
+
color: isActive ? "var(--px-accent-color, #facc15)" : "var(--px-track-color, #d1d5db)",
|
|
33425
|
+
fill: isActive ? "var(--px-accent-color, #facc15)" : "transparent"
|
|
33426
|
+
} : void 0,
|
|
33319
33427
|
onClick: () => !readonly && onChange?.(starValue),
|
|
33320
33428
|
onMouseEnter: () => !readonly && setHoverValue(starValue),
|
|
33321
33429
|
onMouseLeave: () => !readonly && setHoverValue(null)
|
|
@@ -33418,8 +33526,6 @@ ArrowToggleAtom.displayName = "ArrowToggleAtom";
|
|
|
33418
33526
|
var molecules_exports = {};
|
|
33419
33527
|
__export(molecules_exports, {
|
|
33420
33528
|
ActionButton: () => ActionButton,
|
|
33421
|
-
AgentCard: () => AgentCard,
|
|
33422
|
-
AgentDataTable: () => AgentDataTable,
|
|
33423
33529
|
AudienceDemographicsCard: () => AudienceDemographicsCard,
|
|
33424
33530
|
AudienceMetricCard: () => AudienceMetricCard,
|
|
33425
33531
|
BrandAffinityGroup: () => BrandAffinityGroup,
|
|
@@ -33453,14 +33559,10 @@ __export(molecules_exports, {
|
|
|
33453
33559
|
GoogleSheetsConnectCard: () => GoogleSheetsConnectCard,
|
|
33454
33560
|
GoogleSheetsListCard: () => GoogleSheetsListCard,
|
|
33455
33561
|
GrowthChartCard: () => GrowthChartCard,
|
|
33456
|
-
InstructionPreview: () => InstructionPreview,
|
|
33457
33562
|
KeywordBundlesDisplay: () => KeywordBundlesDisplay,
|
|
33458
33563
|
KeywordBundlesEdit: () => KeywordBundlesEdit,
|
|
33459
33564
|
LoadingOverlay: () => LoadingOverlay,
|
|
33460
33565
|
MCQCard: () => MCQCard,
|
|
33461
|
-
MultiAgentCard: () => MultiAgentCard,
|
|
33462
|
-
MultiAgentPlan: () => MultiAgentPlan,
|
|
33463
|
-
MultiAgentUISelector: () => MultiAgentUISelector,
|
|
33464
33566
|
NotificationList: () => NotificationList,
|
|
33465
33567
|
PlatformIconGroup: () => PlatformIconGroup,
|
|
33466
33568
|
PlatformSelectDisplay: () => PlatformSelectDisplay,
|
|
@@ -33468,14 +33570,10 @@ __export(molecules_exports, {
|
|
|
33468
33570
|
RecommendationCard: () => RecommendationCard,
|
|
33469
33571
|
SearchSpecCard: () => SearchSpecCard,
|
|
33470
33572
|
SocialPostCard: () => SocialPostCard,
|
|
33471
|
-
StageIndicator: () => StageIndicator,
|
|
33472
33573
|
StatsGrid: () => StatsGrid,
|
|
33473
33574
|
StepWizard: () => StepWizard,
|
|
33474
33575
|
TagCloud: () => TagCloud,
|
|
33475
|
-
ToolListCard: () => ToolListCard,
|
|
33476
33576
|
TopPostsGrid: () => TopPostsGrid,
|
|
33477
|
-
UIComponentSelector: () => UIComponentSelector,
|
|
33478
|
-
WorkflowVisualizer: () => WorkflowVisualizer,
|
|
33479
33577
|
defaultFetchSelections: () => defaultFetchSelections,
|
|
33480
33578
|
defaultPersistSelection: () => defaultPersistSelection,
|
|
33481
33579
|
useCreatorWidgetPolling: () => useCreatorWidgetPolling
|
|
@@ -34306,9 +34404,16 @@ import { jsx as jsx97, jsxs as jsxs57 } from "react/jsx-runtime";
|
|
|
34306
34404
|
var StatsGrid = ({
|
|
34307
34405
|
items,
|
|
34308
34406
|
stats,
|
|
34309
|
-
className
|
|
34407
|
+
className,
|
|
34408
|
+
style
|
|
34310
34409
|
}) => {
|
|
34311
34410
|
const displayItems = items || stats || [];
|
|
34411
|
+
const hasPxVars = style && Object.keys(style).some((k) => k.startsWith("--px-"));
|
|
34412
|
+
const cardStyle = hasPxVars ? {
|
|
34413
|
+
backgroundColor: "var(--px-bg-color, var(--card-background, white))",
|
|
34414
|
+
borderColor: "var(--px-border-color, var(--border-color, #e5e7eb))"
|
|
34415
|
+
} : void 0;
|
|
34416
|
+
const textColor = hasPxVars ? "var(--px-text-color, inherit)" : void 0;
|
|
34312
34417
|
return /* @__PURE__ */ jsx97(
|
|
34313
34418
|
"div",
|
|
34314
34419
|
{
|
|
@@ -34316,6 +34421,7 @@ var StatsGrid = ({
|
|
|
34316
34421
|
"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4",
|
|
34317
34422
|
className
|
|
34318
34423
|
),
|
|
34424
|
+
style,
|
|
34319
34425
|
children: displayItems?.map((item, index) => {
|
|
34320
34426
|
const Icon3 = item.icon ? lucide_react_exports[item.icon] : null;
|
|
34321
34427
|
const trendColor = item.trendDirection === "up" ? "text-emerald-600 dark:text-emerald-400" : item.trendDirection === "down" ? "text-rose-600 dark:text-rose-400" : "text-muted-foreground";
|
|
@@ -34323,7 +34429,11 @@ var StatsGrid = ({
|
|
|
34323
34429
|
return /* @__PURE__ */ jsx97(
|
|
34324
34430
|
Card,
|
|
34325
34431
|
{
|
|
34326
|
-
className:
|
|
34432
|
+
className: cn(
|
|
34433
|
+
"backdrop-blur-sm shadow-sm hover:shadow-md transition-all duration-300 rounded-[24px] overflow-hidden",
|
|
34434
|
+
!hasPxVars && "bg-[var(--card-background,theme(colors.white))] dark:bg-[var(--card-background,theme(colors.zinc.900))] border-[var(--border-color,theme(colors.gray.200))]"
|
|
34435
|
+
),
|
|
34436
|
+
style: cardStyle,
|
|
34327
34437
|
children: /* @__PURE__ */ jsxs57(CardContent, { className: "p-5 flex flex-col gap-1.5", children: [
|
|
34328
34438
|
/* @__PURE__ */ jsxs57("div", { className: "flex items-center justify-between", children: [
|
|
34329
34439
|
/* @__PURE__ */ jsx97(
|
|
@@ -34333,10 +34443,17 @@ var StatsGrid = ({
|
|
|
34333
34443
|
type: "text",
|
|
34334
34444
|
content: item.label,
|
|
34335
34445
|
variant: "small",
|
|
34336
|
-
className: "text-muted-foreground font-medium tracking-wide uppercase text-[10px]"
|
|
34446
|
+
className: cn(!hasPxVars && "text-muted-foreground", "font-medium tracking-wide uppercase text-[10px]"),
|
|
34447
|
+
style: textColor ? { color: textColor } : void 0
|
|
34337
34448
|
}
|
|
34338
34449
|
),
|
|
34339
|
-
Icon3 && /* @__PURE__ */ jsx97(
|
|
34450
|
+
Icon3 && /* @__PURE__ */ jsx97(
|
|
34451
|
+
Icon3,
|
|
34452
|
+
{
|
|
34453
|
+
className: cn("w-4 h-4", !hasPxVars && "text-[var(--primary-color,theme(colors.purple.500))]"),
|
|
34454
|
+
style: textColor ? { color: textColor } : void 0
|
|
34455
|
+
}
|
|
34456
|
+
)
|
|
34340
34457
|
] }),
|
|
34341
34458
|
/* @__PURE__ */ jsxs57("div", { className: "flex items-baseline gap-3", children: [
|
|
34342
34459
|
/* @__PURE__ */ jsx97(
|
|
@@ -34347,9 +34464,11 @@ var StatsGrid = ({
|
|
|
34347
34464
|
content: String(item.value),
|
|
34348
34465
|
variant: "h3",
|
|
34349
34466
|
className: cn(
|
|
34350
|
-
"font-bold
|
|
34467
|
+
"font-bold tracking-tight leading-tight",
|
|
34468
|
+
!hasPxVars && "text-[var(--foreground)]",
|
|
34351
34469
|
String(item.value).length > 20 ? "text-base" : String(item.value).length > 12 ? "text-lg" : "text-xl"
|
|
34352
|
-
)
|
|
34470
|
+
),
|
|
34471
|
+
style: textColor ? { color: textColor } : void 0
|
|
34353
34472
|
}
|
|
34354
34473
|
),
|
|
34355
34474
|
item.trend && /* @__PURE__ */ jsxs57(
|
|
@@ -34514,16 +34633,26 @@ var FilterBar = ({ filters, showSearch = true, className, onFilterToggle, onSear
|
|
|
34514
34633
|
// src/molecules/generic/FileUpload/FileUpload.tsx
|
|
34515
34634
|
import React88 from "react";
|
|
34516
34635
|
import { jsx as jsx101, jsxs as jsxs61 } from "react/jsx-runtime";
|
|
34517
|
-
var FileUpload = ({ title, accept, multiple, className, onFilesSelected }) => {
|
|
34636
|
+
var FileUpload = ({ title, accept, multiple, className, style, onFilesSelected }) => {
|
|
34518
34637
|
const [isDragging, setIsDragging] = React88.useState(false);
|
|
34638
|
+
const hasPxVars = style && Object.keys(style).some((k) => k.startsWith("--px-"));
|
|
34639
|
+
const wrapperStyle = {
|
|
34640
|
+
...hasPxVars && {
|
|
34641
|
+
borderColor: isDragging ? "var(--px-accent-color)" : "var(--px-border-color)",
|
|
34642
|
+
backgroundColor: isDragging ? void 0 : "var(--px-bg-color, transparent)"
|
|
34643
|
+
},
|
|
34644
|
+
...style
|
|
34645
|
+
};
|
|
34519
34646
|
return /* @__PURE__ */ jsxs61(
|
|
34520
34647
|
"div",
|
|
34521
34648
|
{
|
|
34522
34649
|
className: cn(
|
|
34523
34650
|
"relative flex flex-col items-center justify-center p-8 border-2 border-dashed rounded-3xl transition-all",
|
|
34524
|
-
isDragging ? "border-purple-500 bg-purple-50" : "border-purple-100 bg-white",
|
|
34651
|
+
!hasPxVars && (isDragging ? "border-purple-500 bg-purple-50" : "border-purple-100 bg-white"),
|
|
34525
34652
|
className
|
|
34526
34653
|
),
|
|
34654
|
+
style: wrapperStyle,
|
|
34655
|
+
"data-px-styled": hasPxVars ? "" : void 0,
|
|
34527
34656
|
onDragOver: (e) => {
|
|
34528
34657
|
e.preventDefault();
|
|
34529
34658
|
setIsDragging(true);
|
|
@@ -34537,8 +34666,22 @@ var FileUpload = ({ title, accept, multiple, className, onFilesSelected }) => {
|
|
|
34537
34666
|
}
|
|
34538
34667
|
},
|
|
34539
34668
|
children: [
|
|
34540
|
-
/* @__PURE__ */ jsx101(
|
|
34541
|
-
|
|
34669
|
+
/* @__PURE__ */ jsx101(
|
|
34670
|
+
"div",
|
|
34671
|
+
{
|
|
34672
|
+
className: cn("w-12 h-12 rounded-2xl flex items-center justify-center mb-4", !hasPxVars && "bg-purple-100 text-purple-600"),
|
|
34673
|
+
style: hasPxVars ? { backgroundColor: "var(--px-accent-color)", color: "var(--px-accent-fg, white)", opacity: 0.15 } : void 0,
|
|
34674
|
+
children: /* @__PURE__ */ jsx101(Upload, { className: "w-6 h-6", style: hasPxVars ? { color: "var(--px-accent-color)", opacity: 1 } : void 0 })
|
|
34675
|
+
}
|
|
34676
|
+
),
|
|
34677
|
+
/* @__PURE__ */ jsx101(
|
|
34678
|
+
"h4",
|
|
34679
|
+
{
|
|
34680
|
+
className: cn("font-bold mb-1", !hasPxVars && "text-gray-900"),
|
|
34681
|
+
style: hasPxVars ? { color: "var(--px-text-color, inherit)" } : void 0,
|
|
34682
|
+
children: title
|
|
34683
|
+
}
|
|
34684
|
+
),
|
|
34542
34685
|
/* @__PURE__ */ jsx101("p", { className: "text-sm text-muted-foreground mb-6", children: "Drag and drop or click to browse" }),
|
|
34543
34686
|
/* @__PURE__ */ jsx101(
|
|
34544
34687
|
"input",
|
|
@@ -34554,7 +34697,8 @@ var FileUpload = ({ title, accept, multiple, className, onFilesSelected }) => {
|
|
|
34554
34697
|
Button,
|
|
34555
34698
|
{
|
|
34556
34699
|
variant: "outline",
|
|
34557
|
-
className: "rounded-full border-purple-200 text-purple-700 hover:bg-purple-50",
|
|
34700
|
+
className: cn("rounded-full", !hasPxVars && "border-purple-200 text-purple-700 hover:bg-purple-50"),
|
|
34701
|
+
style: hasPxVars ? { borderColor: "var(--px-accent-color)", color: "var(--px-accent-color)" } : void 0,
|
|
34558
34702
|
children: "Select Files"
|
|
34559
34703
|
}
|
|
34560
34704
|
)
|
|
@@ -40627,1307 +40771,6 @@ function CreatorWidgetInner({
|
|
|
40627
40771
|
}
|
|
40628
40772
|
var CreatorWidget = memo(CreatorWidgetInner);
|
|
40629
40773
|
|
|
40630
|
-
// src/molecules/workstream-builder/ToolListCard/ToolListCard.tsx
|
|
40631
|
-
import { jsx as jsx150, jsxs as jsxs108 } from "react/jsx-runtime";
|
|
40632
|
-
var FONT_STYLE = {
|
|
40633
|
-
fontFamily: "Inter, system-ui, sans-serif"
|
|
40634
|
-
};
|
|
40635
|
-
var ICON_MAP = {
|
|
40636
|
-
Search,
|
|
40637
|
-
Database,
|
|
40638
|
-
Globe,
|
|
40639
|
-
FileText,
|
|
40640
|
-
Zap,
|
|
40641
|
-
Layout: PanelsTopLeft,
|
|
40642
|
-
Wrench,
|
|
40643
|
-
BookOpen,
|
|
40644
|
-
BarChart3: ChartColumn,
|
|
40645
|
-
Link,
|
|
40646
|
-
MessageSquare,
|
|
40647
|
-
Sparkles,
|
|
40648
|
-
FolderOpen,
|
|
40649
|
-
Code,
|
|
40650
|
-
Shield,
|
|
40651
|
-
Image,
|
|
40652
|
-
Mail,
|
|
40653
|
-
Calendar
|
|
40654
|
-
};
|
|
40655
|
-
var CATEGORY_FALLBACK = {
|
|
40656
|
-
search: Search,
|
|
40657
|
-
data: Database,
|
|
40658
|
-
knowledge: BookOpen,
|
|
40659
|
-
web: Globe,
|
|
40660
|
-
content: FileText,
|
|
40661
|
-
ui: PanelsTopLeft,
|
|
40662
|
-
analytics: ChartColumn,
|
|
40663
|
-
integration: Link,
|
|
40664
|
-
communication: MessageSquare,
|
|
40665
|
-
generation: Sparkles,
|
|
40666
|
-
file: FolderOpen,
|
|
40667
|
-
code: Code,
|
|
40668
|
-
security: Shield,
|
|
40669
|
-
general: Zap
|
|
40670
|
-
};
|
|
40671
|
-
var CATEGORY_HEADER_BG = {
|
|
40672
|
-
search: "bg-blue-500/[0.04]",
|
|
40673
|
-
data: "bg-emerald-500/[0.04]",
|
|
40674
|
-
knowledge: "bg-purple-500/[0.04]",
|
|
40675
|
-
web: "bg-cyan-500/[0.04]",
|
|
40676
|
-
content: "bg-pink-500/[0.04]",
|
|
40677
|
-
ui: "bg-violet-500/[0.04]",
|
|
40678
|
-
analytics: "bg-orange-500/[0.04]",
|
|
40679
|
-
integration: "bg-amber-500/[0.04]",
|
|
40680
|
-
general: "bg-[var(--foreground)]/[0.02]"
|
|
40681
|
-
};
|
|
40682
|
-
function resolveIcon(tool) {
|
|
40683
|
-
if (tool.icon && ICON_MAP[tool.icon]) return ICON_MAP[tool.icon];
|
|
40684
|
-
if (tool.category && CATEGORY_FALLBACK[tool.category.toLowerCase()])
|
|
40685
|
-
return CATEGORY_FALLBACK[tool.category.toLowerCase()];
|
|
40686
|
-
return Wrench;
|
|
40687
|
-
}
|
|
40688
|
-
function resolveCategoryIcon(category) {
|
|
40689
|
-
return CATEGORY_FALLBACK[category.toLowerCase()] || Wrench;
|
|
40690
|
-
}
|
|
40691
|
-
var ToolListCard = ({
|
|
40692
|
-
tools,
|
|
40693
|
-
className
|
|
40694
|
-
}) => {
|
|
40695
|
-
const grouped = {};
|
|
40696
|
-
for (const tool of tools) {
|
|
40697
|
-
const cat = tool.category || "General";
|
|
40698
|
-
if (!grouped[cat]) grouped[cat] = [];
|
|
40699
|
-
grouped[cat].push(tool);
|
|
40700
|
-
}
|
|
40701
|
-
const categories = Object.keys(grouped);
|
|
40702
|
-
return /* @__PURE__ */ jsxs108(
|
|
40703
|
-
"div",
|
|
40704
|
-
{
|
|
40705
|
-
className: cn(
|
|
40706
|
-
"text-foreground hover:bg-muted/50 hover:text-foreground my-3 rounded-xl border border-[var(--border-color)] bg-[var(--card-background)] overflow-hidden shadow-sm",
|
|
40707
|
-
className
|
|
40708
|
-
),
|
|
40709
|
-
style: FONT_STYLE,
|
|
40710
|
-
children: [
|
|
40711
|
-
/* @__PURE__ */ jsxs108("div", { className: "px-4 py-3 border-b border-[var(--border-color)] bg-[var(--foreground)]/[0.03] flex items-center gap-2.5", children: [
|
|
40712
|
-
/* @__PURE__ */ jsx150("div", { className: "w-6 h-6 rounded-md bg-interactive/10 flex items-center justify-center", children: /* @__PURE__ */ jsx150(Wrench, { className: "w-3.5 h-3.5 text-interactive" }) }),
|
|
40713
|
-
/* @__PURE__ */ jsx150("h4", { className: "text-sm font-semibold text-[var(--foreground)]", children: "Available Tools" }),
|
|
40714
|
-
/* @__PURE__ */ jsx150("span", { className: "ml-auto text-[11px] font-medium text-[var(--foreground)]/40 bg-[var(--foreground)]/[0.06] px-2 py-0.5 rounded-full", children: tools.length })
|
|
40715
|
-
] }),
|
|
40716
|
-
/* @__PURE__ */ jsx150("div", { className: "divide-y divide-[var(--border-color)]", children: categories.map((cat) => {
|
|
40717
|
-
const CatIcon = resolveCategoryIcon(cat);
|
|
40718
|
-
const headerBg = CATEGORY_HEADER_BG[cat.toLowerCase()] || CATEGORY_HEADER_BG.general;
|
|
40719
|
-
return /* @__PURE__ */ jsxs108("div", { className: "px-4 py-3", children: [
|
|
40720
|
-
/* @__PURE__ */ jsxs108("div", { className: cn("flex items-center gap-2 mb-2.5 -mx-4 px-4 py-1.5", headerBg), children: [
|
|
40721
|
-
/* @__PURE__ */ jsx150(CatIcon, { className: "w-3.5 h-3.5 text-interactive/70" }),
|
|
40722
|
-
/* @__PURE__ */ jsx150("span", { className: "text-[11px] font-semibold text-[var(--foreground)]/50 uppercase tracking-wider", children: cat }),
|
|
40723
|
-
/* @__PURE__ */ jsx150("span", { className: "text-[10px] text-[var(--foreground)]/30", children: grouped[cat].length })
|
|
40724
|
-
] }),
|
|
40725
|
-
/* @__PURE__ */ jsx150("div", { className: "space-y-1.5", children: grouped[cat].map((tool) => {
|
|
40726
|
-
const ToolIcon = resolveIcon(tool);
|
|
40727
|
-
return /* @__PURE__ */ jsxs108(
|
|
40728
|
-
"div",
|
|
40729
|
-
{
|
|
40730
|
-
className: "group flex items-start gap-3 px-3 py-2 rounded-lg hover:bg-[var(--foreground)]/[0.03] transition-colors",
|
|
40731
|
-
children: [
|
|
40732
|
-
/* @__PURE__ */ jsx150("div", { className: "shrink-0 mt-0.5 w-5 h-5 rounded flex items-center justify-center bg-interactive/[0.08]", children: /* @__PURE__ */ jsx150(ToolIcon, { className: "w-3 h-3 text-interactive/60" }) }),
|
|
40733
|
-
/* @__PURE__ */ jsxs108("div", { className: "flex-1 min-w-0", children: [
|
|
40734
|
-
/* @__PURE__ */ jsxs108("div", { className: "flex items-center gap-2 flex-wrap", children: [
|
|
40735
|
-
tool.display_name && tool.display_name !== tool.name && /* @__PURE__ */ jsx150("span", { className: "text-[13px] font-medium text-[var(--foreground)] truncate max-w-full", children: tool.display_name }),
|
|
40736
|
-
/* @__PURE__ */ jsx150("span", { className: "text-[11px] font-mono px-1.5 py-0.5 rounded bg-[var(--foreground)]/[0.06] text-[var(--foreground)]/50 border border-[var(--foreground)]/[0.06] truncate", children: tool.name })
|
|
40737
|
-
] }),
|
|
40738
|
-
tool.description && /* @__PURE__ */ jsx150("p", { className: "text-xs text-[var(--foreground)]/50 leading-relaxed mt-0.5 break-words whitespace-normal", children: tool.description })
|
|
40739
|
-
] })
|
|
40740
|
-
]
|
|
40741
|
-
},
|
|
40742
|
-
tool.name
|
|
40743
|
-
);
|
|
40744
|
-
}) })
|
|
40745
|
-
] }, cat);
|
|
40746
|
-
}) })
|
|
40747
|
-
]
|
|
40748
|
-
}
|
|
40749
|
-
);
|
|
40750
|
-
};
|
|
40751
|
-
|
|
40752
|
-
// src/molecules/workstream-builder/AgentCard/AgentCard.tsx
|
|
40753
|
-
import { useState as useState20, useCallback as useCallback8 } from "react";
|
|
40754
|
-
import { Fragment as Fragment10, jsx as jsx151, jsxs as jsxs109 } from "react/jsx-runtime";
|
|
40755
|
-
var FONT_STYLE2 = {
|
|
40756
|
-
fontFamily: "Inter, system-ui, sans-serif"
|
|
40757
|
-
};
|
|
40758
|
-
var AgentCard = ({
|
|
40759
|
-
agent,
|
|
40760
|
-
editable = true,
|
|
40761
|
-
compact = false,
|
|
40762
|
-
onSave,
|
|
40763
|
-
className
|
|
40764
|
-
}) => {
|
|
40765
|
-
const [isEditing, setIsEditing] = useState20(false);
|
|
40766
|
-
const [isSaving, setIsSaving] = useState20(false);
|
|
40767
|
-
const [editState, setEditState] = useState20({
|
|
40768
|
-
display_name: agent.display_name,
|
|
40769
|
-
description: agent.description,
|
|
40770
|
-
image: agent.image || ""
|
|
40771
|
-
});
|
|
40772
|
-
const avatarUrl = agent.image || `https://api.dicebear.com/7.x/avataaars/svg?seed=${agent.name}`;
|
|
40773
|
-
const handleEdit = useCallback8(() => {
|
|
40774
|
-
setEditState({
|
|
40775
|
-
display_name: agent.display_name,
|
|
40776
|
-
description: agent.description,
|
|
40777
|
-
image: agent.image || ""
|
|
40778
|
-
});
|
|
40779
|
-
setIsEditing(true);
|
|
40780
|
-
}, [agent]);
|
|
40781
|
-
const handleCancel = useCallback8(() => {
|
|
40782
|
-
setIsEditing(false);
|
|
40783
|
-
}, []);
|
|
40784
|
-
const handleSave = useCallback8(async () => {
|
|
40785
|
-
if (!onSave) return;
|
|
40786
|
-
const updates = {};
|
|
40787
|
-
if (editState.display_name !== agent.display_name)
|
|
40788
|
-
updates.display_name = editState.display_name;
|
|
40789
|
-
if (editState.description !== agent.description)
|
|
40790
|
-
updates.description = editState.description;
|
|
40791
|
-
if (editState.image !== (agent.image || ""))
|
|
40792
|
-
updates.image = editState.image;
|
|
40793
|
-
if (Object.keys(updates).length === 0) {
|
|
40794
|
-
setIsEditing(false);
|
|
40795
|
-
return;
|
|
40796
|
-
}
|
|
40797
|
-
setIsSaving(true);
|
|
40798
|
-
try {
|
|
40799
|
-
await onSave(agent, updates);
|
|
40800
|
-
setIsEditing(false);
|
|
40801
|
-
} catch (err) {
|
|
40802
|
-
console.error("AgentCard save failed:", err);
|
|
40803
|
-
} finally {
|
|
40804
|
-
setIsSaving(false);
|
|
40805
|
-
}
|
|
40806
|
-
}, [onSave, agent, editState]);
|
|
40807
|
-
if (compact) {
|
|
40808
|
-
return /* @__PURE__ */ jsxs109(
|
|
40809
|
-
"div",
|
|
40810
|
-
{
|
|
40811
|
-
className: cn(
|
|
40812
|
-
"flex items-center gap-3 py-1",
|
|
40813
|
-
className
|
|
40814
|
-
),
|
|
40815
|
-
style: FONT_STYLE2,
|
|
40816
|
-
children: [
|
|
40817
|
-
/* @__PURE__ */ jsxs109(Avatar, { className: "h-8 w-8 shrink-0", children: [
|
|
40818
|
-
/* @__PURE__ */ jsx151(AvatarImage, { src: avatarUrl, alt: agent.display_name }),
|
|
40819
|
-
/* @__PURE__ */ jsx151(AvatarFallback, { className: "bg-interactive/10 text-interactive text-xs font-bold", children: agent.display_name.charAt(0) })
|
|
40820
|
-
] }),
|
|
40821
|
-
/* @__PURE__ */ jsxs109("div", { className: "flex-1 min-w-0", children: [
|
|
40822
|
-
/* @__PURE__ */ jsxs109("div", { className: "flex items-center gap-2", children: [
|
|
40823
|
-
/* @__PURE__ */ jsx151("span", { className: "text-[var(--foreground)] text-sm font-semibold truncate", children: agent.display_name }),
|
|
40824
|
-
/* @__PURE__ */ jsxs109(
|
|
40825
|
-
"span",
|
|
40826
|
-
{
|
|
40827
|
-
className: cn(
|
|
40828
|
-
"inline-flex items-center gap-1 text-[10px] px-1.5 py-0.5 rounded-full font-medium",
|
|
40829
|
-
agent.enabled ? "bg-emerald-500/10 text-emerald-600" : "bg-red-500/10 text-red-500"
|
|
40830
|
-
),
|
|
40831
|
-
children: [
|
|
40832
|
-
/* @__PURE__ */ jsx151("span", { className: cn(
|
|
40833
|
-
"w-1.5 h-1.5 rounded-full",
|
|
40834
|
-
agent.enabled ? "bg-emerald-500" : "bg-red-500"
|
|
40835
|
-
) }),
|
|
40836
|
-
agent.enabled ? "Active" : "Disabled"
|
|
40837
|
-
]
|
|
40838
|
-
}
|
|
40839
|
-
)
|
|
40840
|
-
] }),
|
|
40841
|
-
/* @__PURE__ */ jsx151("p", { className: "text-[var(--foreground)]/50 text-xs truncate", children: agent.description })
|
|
40842
|
-
] })
|
|
40843
|
-
]
|
|
40844
|
-
}
|
|
40845
|
-
);
|
|
40846
|
-
}
|
|
40847
|
-
return /* @__PURE__ */ jsxs109(
|
|
40848
|
-
"div",
|
|
40849
|
-
{
|
|
40850
|
-
className: cn(
|
|
40851
|
-
"text-foreground hover:bg-muted/50 hover:text-foreground my-3 rounded-xl border border-[var(--border-color)] bg-[var(--card-background)] overflow-hidden",
|
|
40852
|
-
className
|
|
40853
|
-
),
|
|
40854
|
-
style: FONT_STYLE2,
|
|
40855
|
-
children: [
|
|
40856
|
-
/* @__PURE__ */ jsxs109("div", { className: "flex items-start gap-4 px-5 py-4 bg-gradient-to-r from-[var(--foreground)]/[0.02] to-transparent", children: [
|
|
40857
|
-
/* @__PURE__ */ jsxs109(Avatar, { className: "h-12 w-12 shrink-0 border-2 border-interactive/20", children: [
|
|
40858
|
-
/* @__PURE__ */ jsx151(AvatarImage, { src: isEditing && editState.image ? editState.image : avatarUrl, alt: agent.display_name }),
|
|
40859
|
-
/* @__PURE__ */ jsx151(AvatarFallback, { className: "bg-interactive/10 text-interactive text-lg font-bold", children: agent.display_name.charAt(0) })
|
|
40860
|
-
] }),
|
|
40861
|
-
/* @__PURE__ */ jsxs109("div", { className: "flex-1 min-w-0", children: [
|
|
40862
|
-
/* @__PURE__ */ jsxs109("div", { className: "flex items-center gap-2", children: [
|
|
40863
|
-
isEditing ? /* @__PURE__ */ jsx151(
|
|
40864
|
-
"input",
|
|
40865
|
-
{
|
|
40866
|
-
type: "text",
|
|
40867
|
-
value: editState.display_name,
|
|
40868
|
-
onChange: (e) => setEditState((s) => ({ ...s, display_name: e.target.value })),
|
|
40869
|
-
disabled: isSaving,
|
|
40870
|
-
className: "flex-1 bg-transparent border-b border-interactive/30 text-sm font-semibold text-foreground outline-none focus:border-interactive transition-all",
|
|
40871
|
-
placeholder: "Agent name"
|
|
40872
|
-
}
|
|
40873
|
-
) : /* @__PURE__ */ jsx151("h4", { className: "text-sm font-semibold text-[var(--foreground)] truncate", children: agent.display_name }),
|
|
40874
|
-
/* @__PURE__ */ jsx151("span", { className: "text-[11px] font-mono text-[var(--foreground)]/40 bg-[var(--foreground)]/[0.05] px-1.5 py-0.5 rounded", children: agent.name }),
|
|
40875
|
-
/* @__PURE__ */ jsxs109(
|
|
40876
|
-
"span",
|
|
40877
|
-
{
|
|
40878
|
-
className: cn(
|
|
40879
|
-
"inline-flex items-center gap-1 text-[10px] px-2 py-0.5 rounded-full font-medium",
|
|
40880
|
-
agent.enabled ? "bg-emerald-500/10 text-emerald-600" : "bg-red-500/10 text-red-500"
|
|
40881
|
-
),
|
|
40882
|
-
children: [
|
|
40883
|
-
/* @__PURE__ */ jsx151("span", { className: cn(
|
|
40884
|
-
"w-1.5 h-1.5 rounded-full",
|
|
40885
|
-
agent.enabled ? "bg-emerald-500" : "bg-red-500"
|
|
40886
|
-
) }),
|
|
40887
|
-
agent.enabled ? "Active" : "Disabled"
|
|
40888
|
-
]
|
|
40889
|
-
}
|
|
40890
|
-
)
|
|
40891
|
-
] }),
|
|
40892
|
-
/* @__PURE__ */ jsx151("div", { className: "mt-1", children: isEditing ? /* @__PURE__ */ jsx151(
|
|
40893
|
-
"textarea",
|
|
40894
|
-
{
|
|
40895
|
-
value: editState.description,
|
|
40896
|
-
onChange: (e) => setEditState((s) => ({ ...s, description: e.target.value })),
|
|
40897
|
-
disabled: isSaving,
|
|
40898
|
-
className: "w-full bg-transparent border-b border-interactive/30 text-xs text-foreground/70 outline-none focus:border-interactive transition-all resize-none leading-relaxed min-h-[40px]",
|
|
40899
|
-
rows: 2,
|
|
40900
|
-
placeholder: "Describe this agent..."
|
|
40901
|
-
}
|
|
40902
|
-
) : /* @__PURE__ */ jsx151("p", { className: "text-xs text-[var(--foreground)]/60 leading-relaxed whitespace-normal", children: agent.description }) }),
|
|
40903
|
-
isEditing && /* @__PURE__ */ jsxs109("div", { className: "mt-2 flex items-center gap-2", children: [
|
|
40904
|
-
/* @__PURE__ */ jsx151("span", { className: "text-[10px] text-[var(--foreground)]/30 uppercase font-semibold", children: "Avatar:" }),
|
|
40905
|
-
/* @__PURE__ */ jsx151(
|
|
40906
|
-
"input",
|
|
40907
|
-
{
|
|
40908
|
-
type: "text",
|
|
40909
|
-
value: editState.image,
|
|
40910
|
-
onChange: (e) => setEditState((s) => ({ ...s, image: e.target.value })),
|
|
40911
|
-
disabled: isSaving,
|
|
40912
|
-
className: "flex-1 bg-foreground/[0.03] border border-[var(--border-color)] rounded px-2 py-0.5 text-[10px] text-foreground/50 font-mono outline-none focus:border-interactive/50 transition-colors",
|
|
40913
|
-
placeholder: "URL"
|
|
40914
|
-
}
|
|
40915
|
-
)
|
|
40916
|
-
] })
|
|
40917
|
-
] }),
|
|
40918
|
-
editable && onSave && /* @__PURE__ */ jsx151("div", { className: "flex items-center gap-1.5 shrink-0", children: isEditing ? /* @__PURE__ */ jsxs109(Fragment10, { children: [
|
|
40919
|
-
/* @__PURE__ */ jsx151(
|
|
40920
|
-
"button",
|
|
40921
|
-
{
|
|
40922
|
-
onClick: handleCancel,
|
|
40923
|
-
disabled: isSaving,
|
|
40924
|
-
className: "text-[11px] px-2.5 py-1 rounded-md border border-[var(--border-color)] text-[var(--foreground)]/60 hover:text-[var(--foreground)] transition-colors disabled:opacity-50",
|
|
40925
|
-
children: "Cancel"
|
|
40926
|
-
}
|
|
40927
|
-
),
|
|
40928
|
-
/* @__PURE__ */ jsx151(
|
|
40929
|
-
"button",
|
|
40930
|
-
{
|
|
40931
|
-
onClick: handleSave,
|
|
40932
|
-
disabled: isSaving,
|
|
40933
|
-
className: "text-[11px] px-2.5 py-1 rounded-md bg-[var(--border-color)] text-foreground border border-[var(--border-color)] hover:opacity-90 transition-opacity disabled:opacity-50",
|
|
40934
|
-
children: isSaving ? "Saving..." : "Save"
|
|
40935
|
-
}
|
|
40936
|
-
)
|
|
40937
|
-
] }) : /* @__PURE__ */ jsx151(
|
|
40938
|
-
"button",
|
|
40939
|
-
{
|
|
40940
|
-
onClick: handleEdit,
|
|
40941
|
-
className: "text-[11px] px-2.5 py-1 rounded-md border border-[var(--border-color)] text-foreground/50 hover:text-foreground hover:border-interactive/50 transition-colors",
|
|
40942
|
-
children: "Edit"
|
|
40943
|
-
}
|
|
40944
|
-
) })
|
|
40945
|
-
] }),
|
|
40946
|
-
/* @__PURE__ */ jsx151("div", { className: "flex flex-wrap items-center gap-3 px-5 pb-3 text-xs", children: /* @__PURE__ */ jsxs109("span", { className: "text-[var(--foreground)]/40", children: [
|
|
40947
|
-
"Model:",
|
|
40948
|
-
" ",
|
|
40949
|
-
/* @__PURE__ */ jsx151("span", { className: "font-mono text-[var(--foreground)]/70", children: agent.model })
|
|
40950
|
-
] }) }),
|
|
40951
|
-
agent.tools && agent.tools.length > 0 && /* @__PURE__ */ jsxs109("div", { className: "border-t border-[var(--border-color)] px-5 py-3", children: [
|
|
40952
|
-
/* @__PURE__ */ jsxs109("p", { className: "text-[11px] font-semibold text-[var(--foreground)]/40 uppercase tracking-wide mb-2", children: [
|
|
40953
|
-
"Tools (",
|
|
40954
|
-
agent.tools.length,
|
|
40955
|
-
")"
|
|
40956
|
-
] }),
|
|
40957
|
-
/* @__PURE__ */ jsx151("div", { className: "flex flex-wrap gap-1.5", children: agent.tools.map((tool) => /* @__PURE__ */ jsx151(
|
|
40958
|
-
"span",
|
|
40959
|
-
{
|
|
40960
|
-
className: "text-[11px] px-2 py-0.5 rounded-md bg-interactive/10 text-interactive font-mono border border-interactive/20",
|
|
40961
|
-
children: tool
|
|
40962
|
-
},
|
|
40963
|
-
tool
|
|
40964
|
-
)) })
|
|
40965
|
-
] })
|
|
40966
|
-
]
|
|
40967
|
-
}
|
|
40968
|
-
);
|
|
40969
|
-
};
|
|
40970
|
-
|
|
40971
|
-
// src/molecules/workstream-builder/AgentDataTable/AgentDataTable.tsx
|
|
40972
|
-
import { jsx as jsx152, jsxs as jsxs110 } from "react/jsx-runtime";
|
|
40973
|
-
var FONT_STYLE3 = {
|
|
40974
|
-
fontFamily: "Inter, system-ui, sans-serif"
|
|
40975
|
-
};
|
|
40976
|
-
var AgentDataTable = ({
|
|
40977
|
-
headers,
|
|
40978
|
-
rows,
|
|
40979
|
-
className
|
|
40980
|
-
}) => {
|
|
40981
|
-
const renderCell = (value) => {
|
|
40982
|
-
if (typeof value === "boolean") {
|
|
40983
|
-
return /* @__PURE__ */ jsxs110(
|
|
40984
|
-
"span",
|
|
40985
|
-
{
|
|
40986
|
-
className: cn(
|
|
40987
|
-
"inline-flex items-center gap-1.5 text-[11px] font-medium px-2 py-0.5 rounded-full",
|
|
40988
|
-
value ? "bg-emerald-500/10 text-emerald-600" : "bg-red-500/10 text-red-500"
|
|
40989
|
-
),
|
|
40990
|
-
children: [
|
|
40991
|
-
value ? /* @__PURE__ */ jsx152("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx152("polyline", { points: "20 6 9 17 4 12" }) }) : /* @__PURE__ */ jsxs110("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
40992
|
-
/* @__PURE__ */ jsx152("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
|
|
40993
|
-
/* @__PURE__ */ jsx152("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
|
|
40994
|
-
] }),
|
|
40995
|
-
value ? "Yes" : "No"
|
|
40996
|
-
]
|
|
40997
|
-
}
|
|
40998
|
-
);
|
|
40999
|
-
}
|
|
41000
|
-
return /* @__PURE__ */ jsx152("span", { className: "text-[var(--foreground)]", children: String(value) });
|
|
41001
|
-
};
|
|
41002
|
-
return /* @__PURE__ */ jsx152(
|
|
41003
|
-
"div",
|
|
41004
|
-
{
|
|
41005
|
-
className: cn(
|
|
41006
|
-
"text-foreground hover:bg-muted/50 hover:text-foreground my-3 rounded-xl border border-[var(--border-color)] bg-[var(--card-background)] overflow-hidden",
|
|
41007
|
-
className
|
|
41008
|
-
),
|
|
41009
|
-
style: FONT_STYLE3,
|
|
41010
|
-
children: /* @__PURE__ */ jsx152("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxs110("table", { className: "w-full text-xs", children: [
|
|
41011
|
-
/* @__PURE__ */ jsx152("thead", { children: /* @__PURE__ */ jsx152("tr", { className: "border-b border-[var(--border-color)] bg-[var(--foreground)]/[0.03]", children: headers.map((header) => /* @__PURE__ */ jsx152(
|
|
41012
|
-
"th",
|
|
41013
|
-
{
|
|
41014
|
-
className: "text-left px-4 py-2.5 text-[11px] font-semibold text-[var(--foreground)]/60 uppercase tracking-wide whitespace-nowrap",
|
|
41015
|
-
children: header
|
|
41016
|
-
},
|
|
41017
|
-
header
|
|
41018
|
-
)) }) }),
|
|
41019
|
-
/* @__PURE__ */ jsx152("tbody", { children: rows.map((row, rowIdx) => /* @__PURE__ */ jsx152(
|
|
41020
|
-
"tr",
|
|
41021
|
-
{
|
|
41022
|
-
className: cn(
|
|
41023
|
-
"border-b border-[var(--border-color)] last:border-b-0 hover:bg-[var(--foreground)]/[0.03] transition-colors",
|
|
41024
|
-
rowIdx % 2 === 1 && "bg-[var(--foreground)]/[0.015]"
|
|
41025
|
-
),
|
|
41026
|
-
children: row.map((cell, cellIdx) => /* @__PURE__ */ jsx152(
|
|
41027
|
-
"td",
|
|
41028
|
-
{
|
|
41029
|
-
className: "px-4 py-2.5 text-xs whitespace-nowrap",
|
|
41030
|
-
children: renderCell(cell)
|
|
41031
|
-
},
|
|
41032
|
-
cellIdx
|
|
41033
|
-
))
|
|
41034
|
-
},
|
|
41035
|
-
rowIdx
|
|
41036
|
-
)) })
|
|
41037
|
-
] }) })
|
|
41038
|
-
}
|
|
41039
|
-
);
|
|
41040
|
-
};
|
|
41041
|
-
|
|
41042
|
-
// src/molecules/workstream-builder/WorkflowVisualizer/WorkflowVisualizer.tsx
|
|
41043
|
-
import { useState as useState21 } from "react";
|
|
41044
|
-
import { jsx as jsx153, jsxs as jsxs111 } from "react/jsx-runtime";
|
|
41045
|
-
var FONT_STYLE4 = {
|
|
41046
|
-
fontFamily: "Inter, system-ui, sans-serif"
|
|
41047
|
-
};
|
|
41048
|
-
var WorkflowVisualizer = ({
|
|
41049
|
-
steps,
|
|
41050
|
-
className
|
|
41051
|
-
}) => {
|
|
41052
|
-
const [expandedStep, setExpandedStep] = useState21(
|
|
41053
|
-
steps[0]?.id || null
|
|
41054
|
-
);
|
|
41055
|
-
return /* @__PURE__ */ jsxs111(
|
|
41056
|
-
"div",
|
|
41057
|
-
{
|
|
41058
|
-
className: cn(
|
|
41059
|
-
"text-foreground hover:bg-muted/50 hover:text-foreground my-3 rounded-xl border border-[var(--border-color)] bg-[var(--card-background)] overflow-hidden shadow-sm",
|
|
41060
|
-
className
|
|
41061
|
-
),
|
|
41062
|
-
style: FONT_STYLE4,
|
|
41063
|
-
children: [
|
|
41064
|
-
/* @__PURE__ */ jsxs111("div", { className: "px-4 py-3 border-b border-[var(--border-color)] bg-[var(--foreground)]/[0.03] flex items-center gap-2.5", children: [
|
|
41065
|
-
/* @__PURE__ */ jsx153("div", { className: "w-6 h-6 rounded-md bg-interactive/10 flex items-center justify-center", children: /* @__PURE__ */ jsx153(
|
|
41066
|
-
"svg",
|
|
41067
|
-
{
|
|
41068
|
-
width: "14",
|
|
41069
|
-
height: "14",
|
|
41070
|
-
viewBox: "0 0 24 24",
|
|
41071
|
-
fill: "none",
|
|
41072
|
-
stroke: "currentColor",
|
|
41073
|
-
strokeWidth: "2",
|
|
41074
|
-
className: "text-interactive",
|
|
41075
|
-
strokeLinecap: "round",
|
|
41076
|
-
strokeLinejoin: "round",
|
|
41077
|
-
children: /* @__PURE__ */ jsx153("polyline", { points: "22 12 18 12 15 21 9 3 6 12 2 12" })
|
|
41078
|
-
}
|
|
41079
|
-
) }),
|
|
41080
|
-
/* @__PURE__ */ jsx153("h4", { className: "text-sm font-semibold text-[var(--foreground)]", children: "Workflow" }),
|
|
41081
|
-
/* @__PURE__ */ jsxs111("span", { className: "ml-auto text-[11px] font-medium text-[var(--foreground)]/40 bg-[var(--foreground)]/[0.06] px-2 py-0.5 rounded-full", children: [
|
|
41082
|
-
steps.length,
|
|
41083
|
-
" steps"
|
|
41084
|
-
] })
|
|
41085
|
-
] }),
|
|
41086
|
-
/* @__PURE__ */ jsx153("div", { className: "px-4 py-3", children: steps.map((step, idx) => {
|
|
41087
|
-
const isLast = idx === steps.length - 1;
|
|
41088
|
-
const isExpanded = expandedStep === step.id;
|
|
41089
|
-
return /* @__PURE__ */ jsxs111("div", { className: "flex gap-3", children: [
|
|
41090
|
-
/* @__PURE__ */ jsxs111("div", { className: "flex flex-col items-center shrink-0", children: [
|
|
41091
|
-
/* @__PURE__ */ jsx153("div", { className: "w-7 h-7 rounded-full bg-interactive/10 border-2 border-interactive/30 flex items-center justify-center", children: /* @__PURE__ */ jsx153("span", { className: "text-[10px] font-bold text-interactive", children: idx + 1 }) }),
|
|
41092
|
-
!isLast && /* @__PURE__ */ jsx153("div", { className: "w-0.5 flex-1 min-h-[16px] bg-interactive/15" })
|
|
41093
|
-
] }),
|
|
41094
|
-
/* @__PURE__ */ jsxs111(
|
|
41095
|
-
"div",
|
|
41096
|
-
{
|
|
41097
|
-
className: cn(
|
|
41098
|
-
"flex-1 mb-3 rounded-lg border border-[var(--border-color)] transition-all",
|
|
41099
|
-
isExpanded ? "bg-[var(--foreground)]/[0.02] shadow-sm" : "hover:bg-[var(--foreground)]/[0.02] hover:shadow-sm hover:-translate-y-0.5"
|
|
41100
|
-
),
|
|
41101
|
-
children: [
|
|
41102
|
-
/* @__PURE__ */ jsxs111(
|
|
41103
|
-
"button",
|
|
41104
|
-
{
|
|
41105
|
-
onClick: () => setExpandedStep(isExpanded ? null : step.id),
|
|
41106
|
-
className: "w-full text-left px-3 py-2.5 flex items-center gap-2 whitespace-normal",
|
|
41107
|
-
children: [
|
|
41108
|
-
/* @__PURE__ */ jsx153("div", { className: "flex-1 min-w-0", children: /* @__PURE__ */ jsx153("span", { className: "text-[13px] font-medium text-[var(--foreground)]", children: step.name }) }),
|
|
41109
|
-
/* @__PURE__ */ jsx153(
|
|
41110
|
-
"svg",
|
|
41111
|
-
{
|
|
41112
|
-
width: "12",
|
|
41113
|
-
height: "12",
|
|
41114
|
-
viewBox: "0 0 24 24",
|
|
41115
|
-
fill: "none",
|
|
41116
|
-
stroke: "currentColor",
|
|
41117
|
-
strokeWidth: "2",
|
|
41118
|
-
className: cn(
|
|
41119
|
-
"shrink-0 text-[var(--foreground)]/30 transition-transform",
|
|
41120
|
-
isExpanded && "rotate-180"
|
|
41121
|
-
),
|
|
41122
|
-
children: /* @__PURE__ */ jsx153("polyline", { points: "6 9 12 15 18 9" })
|
|
41123
|
-
}
|
|
41124
|
-
)
|
|
41125
|
-
]
|
|
41126
|
-
}
|
|
41127
|
-
),
|
|
41128
|
-
isExpanded && /* @__PURE__ */ jsxs111("div", { className: "px-3 pb-3 space-y-2.5", children: [
|
|
41129
|
-
step.description && /* @__PURE__ */ jsx153("p", { className: "text-xs text-[var(--foreground)]/50 leading-relaxed whitespace-normal", children: step.description }),
|
|
41130
|
-
step.sub_steps && step.sub_steps.length > 0 && /* @__PURE__ */ jsx153("div", { className: "space-y-1", children: step.sub_steps.map((sub) => /* @__PURE__ */ jsxs111(
|
|
41131
|
-
"div",
|
|
41132
|
-
{
|
|
41133
|
-
className: "flex items-start gap-2 text-xs",
|
|
41134
|
-
children: [
|
|
41135
|
-
/* @__PURE__ */ jsx153("span", { className: "shrink-0 mt-0.5 w-1.5 h-1.5 rounded-full bg-interactive/40" }),
|
|
41136
|
-
/* @__PURE__ */ jsx153("span", { className: "text-[var(--foreground)]/60", children: sub.action })
|
|
41137
|
-
]
|
|
41138
|
-
},
|
|
41139
|
-
sub.id
|
|
41140
|
-
)) }),
|
|
41141
|
-
step.tools && step.tools.length > 0 && /* @__PURE__ */ jsxs111("div", { className: "flex items-center gap-1.5 flex-wrap", children: [
|
|
41142
|
-
/* @__PURE__ */ jsx153("span", { className: "text-[10px] text-[var(--foreground)]/30 uppercase font-semibold tracking-wider", children: "Tools:" }),
|
|
41143
|
-
step.tools.map((tool) => /* @__PURE__ */ jsx153(
|
|
41144
|
-
"span",
|
|
41145
|
-
{
|
|
41146
|
-
className: "text-[10px] font-mono px-1.5 py-0.5 rounded bg-interactive/[0.08] text-interactive/70 border border-interactive/10",
|
|
41147
|
-
children: tool
|
|
41148
|
-
},
|
|
41149
|
-
tool
|
|
41150
|
-
))
|
|
41151
|
-
] }),
|
|
41152
|
-
step.on_failure && /* @__PURE__ */ jsxs111("div", { className: "flex items-start gap-2 text-xs bg-[var(--redBackground,_#ef4444)]/[0.06] border border-[var(--redText,_#ef4444)]/10 rounded-md px-2.5 py-2 whitespace-normal", children: [
|
|
41153
|
-
/* @__PURE__ */ jsx153("span", { className: "shrink-0 text-[10px] font-semibold text-[var(--redText,_#ef4444)]/70 uppercase tracking-wider mt-px", children: "On failure:" }),
|
|
41154
|
-
/* @__PURE__ */ jsx153("span", { className: "text-[var(--foreground)]/50", children: step.on_failure })
|
|
41155
|
-
] })
|
|
41156
|
-
] })
|
|
41157
|
-
]
|
|
41158
|
-
}
|
|
41159
|
-
)
|
|
41160
|
-
] }, step.id);
|
|
41161
|
-
}) })
|
|
41162
|
-
]
|
|
41163
|
-
}
|
|
41164
|
-
);
|
|
41165
|
-
};
|
|
41166
|
-
|
|
41167
|
-
// src/molecules/workstream-builder/InstructionPreview/InstructionPreview.tsx
|
|
41168
|
-
import { useState as useState22, useCallback as useCallback9 } from "react";
|
|
41169
|
-
import { jsx as jsx154, jsxs as jsxs112 } from "react/jsx-runtime";
|
|
41170
|
-
var FONT_STYLE5 = {
|
|
41171
|
-
fontFamily: "Inter, system-ui, sans-serif"
|
|
41172
|
-
};
|
|
41173
|
-
var InstructionPreview = ({
|
|
41174
|
-
agent_name,
|
|
41175
|
-
description,
|
|
41176
|
-
instruction,
|
|
41177
|
-
workflow_summary,
|
|
41178
|
-
tools,
|
|
41179
|
-
className
|
|
41180
|
-
}) => {
|
|
41181
|
-
const [isExpanded, setIsExpanded] = useState22(false);
|
|
41182
|
-
const [copied, setCopied] = useState22(false);
|
|
41183
|
-
const previewLength = 300;
|
|
41184
|
-
const isLong = instruction.length > previewLength;
|
|
41185
|
-
const displayText = isExpanded || !isLong ? instruction : instruction.slice(0, previewLength) + "...";
|
|
41186
|
-
const handleCopy = useCallback9(async () => {
|
|
41187
|
-
try {
|
|
41188
|
-
await navigator.clipboard.writeText(instruction);
|
|
41189
|
-
setCopied(true);
|
|
41190
|
-
setTimeout(() => setCopied(false), 2e3);
|
|
41191
|
-
} catch {
|
|
41192
|
-
const textarea = document.createElement("textarea");
|
|
41193
|
-
textarea.value = instruction;
|
|
41194
|
-
textarea.style.position = "fixed";
|
|
41195
|
-
textarea.style.opacity = "0";
|
|
41196
|
-
document.body.appendChild(textarea);
|
|
41197
|
-
textarea.select();
|
|
41198
|
-
document.execCommand("copy");
|
|
41199
|
-
document.body.removeChild(textarea);
|
|
41200
|
-
setCopied(true);
|
|
41201
|
-
setTimeout(() => setCopied(false), 2e3);
|
|
41202
|
-
}
|
|
41203
|
-
}, [instruction]);
|
|
41204
|
-
return /* @__PURE__ */ jsxs112(
|
|
41205
|
-
"div",
|
|
41206
|
-
{
|
|
41207
|
-
className: cn(
|
|
41208
|
-
"text-foreground hover:bg-muted/50 hover:text-foreground my-3 rounded-xl border border-[var(--border-color)] bg-[var(--card-background)] overflow-hidden shadow-sm",
|
|
41209
|
-
className
|
|
41210
|
-
),
|
|
41211
|
-
style: FONT_STYLE5,
|
|
41212
|
-
children: [
|
|
41213
|
-
/* @__PURE__ */ jsx154("div", { className: "px-4 py-3 border-b border-[var(--border-color)] bg-[var(--foreground)]/[0.03]", children: /* @__PURE__ */ jsxs112("div", { className: "flex items-center gap-2.5", children: [
|
|
41214
|
-
/* @__PURE__ */ jsx154("div", { className: "w-6 h-6 rounded-md bg-interactive/10 flex items-center justify-center", children: /* @__PURE__ */ jsxs112(
|
|
41215
|
-
"svg",
|
|
41216
|
-
{
|
|
41217
|
-
width: "14",
|
|
41218
|
-
height: "14",
|
|
41219
|
-
viewBox: "0 0 24 24",
|
|
41220
|
-
fill: "none",
|
|
41221
|
-
stroke: "currentColor",
|
|
41222
|
-
strokeWidth: "2",
|
|
41223
|
-
className: "text-interactive",
|
|
41224
|
-
strokeLinecap: "round",
|
|
41225
|
-
strokeLinejoin: "round",
|
|
41226
|
-
children: [
|
|
41227
|
-
/* @__PURE__ */ jsx154("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
|
|
41228
|
-
/* @__PURE__ */ jsx154("polyline", { points: "14 2 14 8 20 8" }),
|
|
41229
|
-
/* @__PURE__ */ jsx154("line", { x1: "16", y1: "13", x2: "8", y2: "13" }),
|
|
41230
|
-
/* @__PURE__ */ jsx154("line", { x1: "16", y1: "17", x2: "8", y2: "17" }),
|
|
41231
|
-
/* @__PURE__ */ jsx154("polyline", { points: "10 9 9 9 8 9" })
|
|
41232
|
-
]
|
|
41233
|
-
}
|
|
41234
|
-
) }),
|
|
41235
|
-
/* @__PURE__ */ jsxs112("div", { className: "flex-1 min-w-0", children: [
|
|
41236
|
-
/* @__PURE__ */ jsx154("h4", { className: "text-sm font-semibold text-[var(--foreground)]", children: agent_name }),
|
|
41237
|
-
description && /* @__PURE__ */ jsx154("p", { className: "text-[11px] text-[var(--foreground)]/40 mt-0.5 whitespace-normal", children: description })
|
|
41238
|
-
] })
|
|
41239
|
-
] }) }),
|
|
41240
|
-
/* @__PURE__ */ jsxs112("div", { className: "px-4 py-3 space-y-3", children: [
|
|
41241
|
-
/* @__PURE__ */ jsxs112("div", { children: [
|
|
41242
|
-
/* @__PURE__ */ jsxs112("div", { className: "flex items-center justify-between mb-1.5", children: [
|
|
41243
|
-
/* @__PURE__ */ jsx154("p", { className: "text-[10px] font-semibold text-[var(--foreground)]/30 uppercase tracking-wider", children: "Instruction" }),
|
|
41244
|
-
/* @__PURE__ */ jsx154(
|
|
41245
|
-
"button",
|
|
41246
|
-
{
|
|
41247
|
-
onClick: handleCopy,
|
|
41248
|
-
className: "text-[10px] px-2 py-0.5 rounded-md text-interactive hover:bg-interactive/10 transition-colors font-medium",
|
|
41249
|
-
children: copied ? "Copied!" : "Copy"
|
|
41250
|
-
}
|
|
41251
|
-
)
|
|
41252
|
-
] }),
|
|
41253
|
-
/* @__PURE__ */ jsx154("div", { className: "text-xs text-[var(--foreground)]/60 leading-relaxed whitespace-pre-wrap font-mono bg-[var(--foreground)]/[0.02] border border-[var(--border-color)] rounded-lg p-3", children: displayText }),
|
|
41254
|
-
isLong && /* @__PURE__ */ jsxs112(
|
|
41255
|
-
"button",
|
|
41256
|
-
{
|
|
41257
|
-
onClick: () => setIsExpanded(!isExpanded),
|
|
41258
|
-
className: "inline-flex items-center gap-1 text-[11px] text-interactive hover:underline mt-1",
|
|
41259
|
-
children: [
|
|
41260
|
-
/* @__PURE__ */ jsx154(
|
|
41261
|
-
"svg",
|
|
41262
|
-
{
|
|
41263
|
-
width: "12",
|
|
41264
|
-
height: "12",
|
|
41265
|
-
viewBox: "0 0 24 24",
|
|
41266
|
-
fill: "none",
|
|
41267
|
-
stroke: "currentColor",
|
|
41268
|
-
strokeWidth: "2",
|
|
41269
|
-
className: cn("transition-transform", isExpanded && "rotate-180"),
|
|
41270
|
-
children: /* @__PURE__ */ jsx154("polyline", { points: "6 9 12 15 18 9" })
|
|
41271
|
-
}
|
|
41272
|
-
),
|
|
41273
|
-
isExpanded ? "Show less" : "Show full instruction"
|
|
41274
|
-
]
|
|
41275
|
-
}
|
|
41276
|
-
)
|
|
41277
|
-
] }),
|
|
41278
|
-
workflow_summary && workflow_summary.length > 0 && /* @__PURE__ */ jsxs112("div", { children: [
|
|
41279
|
-
/* @__PURE__ */ jsx154("p", { className: "text-[10px] font-semibold text-[var(--foreground)]/30 uppercase tracking-wider mb-1.5", children: "Workflow" }),
|
|
41280
|
-
/* @__PURE__ */ jsx154("div", { className: "space-y-1", children: workflow_summary.map((step, idx) => /* @__PURE__ */ jsxs112("div", { className: "flex items-start gap-2 text-xs", children: [
|
|
41281
|
-
/* @__PURE__ */ jsx154("span", { className: "shrink-0 w-5 h-5 rounded-full bg-interactive/10 flex items-center justify-center text-[10px] font-bold text-interactive", children: idx + 1 }),
|
|
41282
|
-
/* @__PURE__ */ jsx154("span", { className: "text-[var(--foreground)]/50 mt-0.5", children: step })
|
|
41283
|
-
] }, idx)) })
|
|
41284
|
-
] }),
|
|
41285
|
-
tools && tools.length > 0 && /* @__PURE__ */ jsxs112("div", { children: [
|
|
41286
|
-
/* @__PURE__ */ jsx154("p", { className: "text-[10px] font-semibold text-[var(--foreground)]/30 uppercase tracking-wider mb-1.5", children: "Tools" }),
|
|
41287
|
-
/* @__PURE__ */ jsx154("div", { className: "flex flex-wrap gap-1.5", children: tools.map((tool) => /* @__PURE__ */ jsx154(
|
|
41288
|
-
"span",
|
|
41289
|
-
{
|
|
41290
|
-
className: "text-[10px] font-mono px-2 py-0.5 rounded bg-interactive/[0.08] text-interactive/70 border border-interactive/10",
|
|
41291
|
-
children: tool
|
|
41292
|
-
},
|
|
41293
|
-
tool
|
|
41294
|
-
)) })
|
|
41295
|
-
] })
|
|
41296
|
-
] })
|
|
41297
|
-
]
|
|
41298
|
-
}
|
|
41299
|
-
);
|
|
41300
|
-
};
|
|
41301
|
-
|
|
41302
|
-
// src/molecules/workstream-builder/UIComponentSelector/UIComponentSelector.tsx
|
|
41303
|
-
import { useState as useState23 } from "react";
|
|
41304
|
-
import { jsx as jsx155, jsxs as jsxs113 } from "react/jsx-runtime";
|
|
41305
|
-
var FONT_STYLE6 = {
|
|
41306
|
-
fontFamily: "Inter, system-ui, sans-serif"
|
|
41307
|
-
};
|
|
41308
|
-
function UIComponentSelector({
|
|
41309
|
-
components,
|
|
41310
|
-
onSelect,
|
|
41311
|
-
onPreview,
|
|
41312
|
-
className,
|
|
41313
|
-
isLatestMessage = true
|
|
41314
|
-
}) {
|
|
41315
|
-
const [selected, setSelected] = useState23(() => {
|
|
41316
|
-
const recommended = components.filter((c) => c.recommended).map((c) => c.name);
|
|
41317
|
-
return new Set(recommended);
|
|
41318
|
-
});
|
|
41319
|
-
const [submitted, setSubmitted] = useState23(false);
|
|
41320
|
-
const grouped = components.reduce(
|
|
41321
|
-
(acc, comp) => {
|
|
41322
|
-
const cat = comp.category || "Other";
|
|
41323
|
-
if (!acc[cat]) acc[cat] = [];
|
|
41324
|
-
acc[cat].push(comp);
|
|
41325
|
-
return acc;
|
|
41326
|
-
},
|
|
41327
|
-
{}
|
|
41328
|
-
);
|
|
41329
|
-
const toggle = (name) => {
|
|
41330
|
-
if (submitted || !isLatestMessage) return;
|
|
41331
|
-
setSelected((prev) => {
|
|
41332
|
-
const next = new Set(prev);
|
|
41333
|
-
if (next.has(name)) next.delete(name);
|
|
41334
|
-
else next.add(name);
|
|
41335
|
-
return next;
|
|
41336
|
-
});
|
|
41337
|
-
};
|
|
41338
|
-
const handleContinue = () => {
|
|
41339
|
-
setSubmitted(true);
|
|
41340
|
-
onSelect?.(Array.from(selected));
|
|
41341
|
-
};
|
|
41342
|
-
const categoryOrder = Object.keys(grouped).sort();
|
|
41343
|
-
return /* @__PURE__ */ jsxs113(
|
|
41344
|
-
"div",
|
|
41345
|
-
{
|
|
41346
|
-
className: cn(
|
|
41347
|
-
"my-3 rounded-xl border border-border bg-card overflow-hidden shadow-sm",
|
|
41348
|
-
className
|
|
41349
|
-
),
|
|
41350
|
-
style: FONT_STYLE6,
|
|
41351
|
-
children: [
|
|
41352
|
-
/* @__PURE__ */ jsx155("div", { className: "px-4 py-3 border-b border-border/60 bg-muted/40", children: /* @__PURE__ */ jsxs113("div", { className: "flex items-center gap-2", children: [
|
|
41353
|
-
/* @__PURE__ */ jsx155("div", { className: "w-5 h-5 rounded-md bg-interactive/15 flex items-center justify-center", children: /* @__PURE__ */ jsxs113(
|
|
41354
|
-
"svg",
|
|
41355
|
-
{
|
|
41356
|
-
width: "12",
|
|
41357
|
-
height: "12",
|
|
41358
|
-
viewBox: "0 0 24 24",
|
|
41359
|
-
fill: "none",
|
|
41360
|
-
stroke: "currentColor",
|
|
41361
|
-
strokeWidth: "2",
|
|
41362
|
-
className: "text-interactive",
|
|
41363
|
-
children: [
|
|
41364
|
-
/* @__PURE__ */ jsx155("rect", { x: "3", y: "3", width: "7", height: "7" }),
|
|
41365
|
-
/* @__PURE__ */ jsx155("rect", { x: "14", y: "3", width: "7", height: "7" }),
|
|
41366
|
-
/* @__PURE__ */ jsx155("rect", { x: "3", y: "14", width: "7", height: "7" }),
|
|
41367
|
-
/* @__PURE__ */ jsx155("rect", { x: "14", y: "14", width: "7", height: "7" })
|
|
41368
|
-
]
|
|
41369
|
-
}
|
|
41370
|
-
) }),
|
|
41371
|
-
/* @__PURE__ */ jsxs113("div", { children: [
|
|
41372
|
-
/* @__PURE__ */ jsx155("h3", { className: "text-xs font-semibold text-foreground", children: "Select UI Components" }),
|
|
41373
|
-
/* @__PURE__ */ jsx155("p", { className: "text-[10px] text-muted-foreground mt-0.5", children: "Choose which visual components this agent can use in its responses." })
|
|
41374
|
-
] })
|
|
41375
|
-
] }) }),
|
|
41376
|
-
/* @__PURE__ */ jsx155("div", { className: "px-4 py-3 space-y-4", children: categoryOrder.map((category) => /* @__PURE__ */ jsxs113("div", { children: [
|
|
41377
|
-
/* @__PURE__ */ jsx155("h4", { className: "text-[10px] font-semibold text-muted-foreground uppercase tracking-wider mb-2", children: category }),
|
|
41378
|
-
/* @__PURE__ */ jsx155("div", { className: "space-y-1.5", children: grouped[category].map((comp) => /* @__PURE__ */ jsxs113(
|
|
41379
|
-
"label",
|
|
41380
|
-
{
|
|
41381
|
-
className: cn(
|
|
41382
|
-
"flex items-start gap-3 px-3 py-2 rounded-lg cursor-pointer transition-all",
|
|
41383
|
-
submitted || !isLatestMessage ? "cursor-default opacity-60" : "hover:bg-muted/80",
|
|
41384
|
-
selected.has(comp.name) && !submitted && "bg-interactive/5 border border-interactive/20",
|
|
41385
|
-
selected.has(comp.name) && submitted && "bg-interactive/5"
|
|
41386
|
-
),
|
|
41387
|
-
children: [
|
|
41388
|
-
/* @__PURE__ */ jsx155(
|
|
41389
|
-
"div",
|
|
41390
|
-
{
|
|
41391
|
-
className: cn(
|
|
41392
|
-
"mt-0.5 w-4 h-4 rounded border flex items-center justify-center shrink-0 transition-colors",
|
|
41393
|
-
selected.has(comp.name) ? "bg-interactive border-interactive" : "border-muted-foreground/30"
|
|
41394
|
-
),
|
|
41395
|
-
onClick: (e) => {
|
|
41396
|
-
e.preventDefault();
|
|
41397
|
-
toggle(comp.name);
|
|
41398
|
-
},
|
|
41399
|
-
children: selected.has(comp.name) && /* @__PURE__ */ jsx155(
|
|
41400
|
-
"svg",
|
|
41401
|
-
{
|
|
41402
|
-
width: "10",
|
|
41403
|
-
height: "10",
|
|
41404
|
-
viewBox: "0 0 24 24",
|
|
41405
|
-
fill: "none",
|
|
41406
|
-
stroke: "white",
|
|
41407
|
-
strokeWidth: "3",
|
|
41408
|
-
children: /* @__PURE__ */ jsx155("polyline", { points: "20 6 9 17 4 12" })
|
|
41409
|
-
}
|
|
41410
|
-
)
|
|
41411
|
-
}
|
|
41412
|
-
),
|
|
41413
|
-
/* @__PURE__ */ jsx155(
|
|
41414
|
-
"input",
|
|
41415
|
-
{
|
|
41416
|
-
type: "checkbox",
|
|
41417
|
-
checked: selected.has(comp.name),
|
|
41418
|
-
onChange: () => toggle(comp.name),
|
|
41419
|
-
disabled: submitted || !isLatestMessage,
|
|
41420
|
-
className: "sr-only"
|
|
41421
|
-
}
|
|
41422
|
-
),
|
|
41423
|
-
/* @__PURE__ */ jsxs113("div", { className: "flex-1 min-w-0", children: [
|
|
41424
|
-
/* @__PURE__ */ jsxs113("div", { className: "flex items-center gap-1", children: [
|
|
41425
|
-
/* @__PURE__ */ jsx155("span", { className: "text-sm font-medium text-foreground", children: comp.display_name }),
|
|
41426
|
-
comp.recommended && /* @__PURE__ */ jsx155("span", { className: "px-1.5 py-0.5 text-[9px] font-semibold uppercase tracking-wider rounded-full bg-emerald-500/10 text-emerald-600 border border-emerald-500/20", children: "Recommended" }),
|
|
41427
|
-
onPreview && /* @__PURE__ */ jsx155(
|
|
41428
|
-
"button",
|
|
41429
|
-
{
|
|
41430
|
-
type: "button",
|
|
41431
|
-
onClick: (e) => {
|
|
41432
|
-
e.preventDefault();
|
|
41433
|
-
e.stopPropagation();
|
|
41434
|
-
onPreview(comp.name);
|
|
41435
|
-
},
|
|
41436
|
-
className: "shrink-0 p-0.5 rounded hover:bg-muted transition-colors",
|
|
41437
|
-
title: `Preview ${comp.display_name}`,
|
|
41438
|
-
children: /* @__PURE__ */ jsxs113(
|
|
41439
|
-
"svg",
|
|
41440
|
-
{
|
|
41441
|
-
width: "14",
|
|
41442
|
-
height: "14",
|
|
41443
|
-
viewBox: "0 0 24 24",
|
|
41444
|
-
fill: "none",
|
|
41445
|
-
stroke: "currentColor",
|
|
41446
|
-
strokeWidth: "2",
|
|
41447
|
-
strokeLinecap: "round",
|
|
41448
|
-
strokeLinejoin: "round",
|
|
41449
|
-
className: "text-muted-foreground hover:text-interactive",
|
|
41450
|
-
children: [
|
|
41451
|
-
/* @__PURE__ */ jsx155("circle", { cx: "12", cy: "12", r: "10" }),
|
|
41452
|
-
/* @__PURE__ */ jsx155("line", { x1: "12", y1: "16", x2: "12", y2: "12" }),
|
|
41453
|
-
/* @__PURE__ */ jsx155("line", { x1: "12", y1: "8", x2: "12.01", y2: "8" })
|
|
41454
|
-
]
|
|
41455
|
-
}
|
|
41456
|
-
)
|
|
41457
|
-
}
|
|
41458
|
-
)
|
|
41459
|
-
] }),
|
|
41460
|
-
/* @__PURE__ */ jsx155("span", { className: "ml-0 text-xs text-muted-foreground", children: comp.description })
|
|
41461
|
-
] })
|
|
41462
|
-
]
|
|
41463
|
-
},
|
|
41464
|
-
comp.name
|
|
41465
|
-
)) })
|
|
41466
|
-
] }, category)) }),
|
|
41467
|
-
!submitted && isLatestMessage && /* @__PURE__ */ jsxs113("div", { className: "px-4 py-3 border-t border-border/60 flex items-center justify-between bg-muted/30", children: [
|
|
41468
|
-
/* @__PURE__ */ jsxs113("span", { className: "text-xs text-muted-foreground", children: [
|
|
41469
|
-
selected.size,
|
|
41470
|
-
" selected"
|
|
41471
|
-
] }),
|
|
41472
|
-
/* @__PURE__ */ jsx155(
|
|
41473
|
-
"button",
|
|
41474
|
-
{
|
|
41475
|
-
onClick: handleContinue,
|
|
41476
|
-
className: "px-4 py-1.5 text-sm font-medium rounded-lg bg-interactive text-white hover:bg-interactive/90 transition-colors",
|
|
41477
|
-
children: "Continue"
|
|
41478
|
-
}
|
|
41479
|
-
)
|
|
41480
|
-
] }),
|
|
41481
|
-
submitted && /* @__PURE__ */ jsx155("div", { className: "px-4 pb-3", children: /* @__PURE__ */ jsx155("div", { className: "text-[10px] text-emerald-600 font-medium text-center py-1.5", children: "Selections confirmed" }) })
|
|
41482
|
-
]
|
|
41483
|
-
}
|
|
41484
|
-
);
|
|
41485
|
-
}
|
|
41486
|
-
|
|
41487
|
-
// src/molecules/workstream-builder/MultiAgentCard/MultiAgentCard.tsx
|
|
41488
|
-
import { jsx as jsx156, jsxs as jsxs114 } from "react/jsx-runtime";
|
|
41489
|
-
var FONT_STYLE7 = {
|
|
41490
|
-
fontFamily: "Inter, system-ui, sans-serif"
|
|
41491
|
-
};
|
|
41492
|
-
var MultiAgentCard = ({
|
|
41493
|
-
name,
|
|
41494
|
-
display_name,
|
|
41495
|
-
description,
|
|
41496
|
-
stages = [],
|
|
41497
|
-
enabled = true,
|
|
41498
|
-
className
|
|
41499
|
-
}) => {
|
|
41500
|
-
const avatarUrl = `https://api.dicebear.com/7.x/avataaars/svg?seed=${name}`;
|
|
41501
|
-
return /* @__PURE__ */ jsxs114(
|
|
41502
|
-
"div",
|
|
41503
|
-
{
|
|
41504
|
-
className: cn(
|
|
41505
|
-
"text-foreground hover:bg-muted/50 hover:text-foreground my-3 rounded-xl border border-[var(--border-color)] bg-[var(--card-background)] overflow-hidden shadow-sm",
|
|
41506
|
-
className
|
|
41507
|
-
),
|
|
41508
|
-
style: FONT_STYLE7,
|
|
41509
|
-
children: [
|
|
41510
|
-
/* @__PURE__ */ jsxs114("div", { className: "flex items-start gap-4 px-5 py-4 bg-gradient-to-r from-[var(--foreground)]/[0.02] to-transparent", children: [
|
|
41511
|
-
/* @__PURE__ */ jsx156("div", { className: "h-12 w-12 shrink-0 rounded-full border-2 border-interactive/20 overflow-hidden bg-interactive/10 flex items-center justify-center", children: /* @__PURE__ */ jsx156("img", { src: avatarUrl, alt: display_name, className: "h-full w-full" }) }),
|
|
41512
|
-
/* @__PURE__ */ jsxs114("div", { className: "flex-1 min-w-0", children: [
|
|
41513
|
-
/* @__PURE__ */ jsxs114("div", { className: "flex items-center gap-2", children: [
|
|
41514
|
-
/* @__PURE__ */ jsx156("h4", { className: "text-sm font-semibold text-[var(--foreground)] truncate", children: display_name }),
|
|
41515
|
-
/* @__PURE__ */ jsx156("span", { className: "text-[11px] font-mono text-[var(--foreground)]/40 bg-[var(--foreground)]/[0.05] px-1.5 py-0.5 rounded", children: name }),
|
|
41516
|
-
/* @__PURE__ */ jsx156("span", { className: "text-[10px] px-2 py-0.5 rounded-full font-medium bg-interactive/10 text-interactive", children: "Multi-Agent" }),
|
|
41517
|
-
/* @__PURE__ */ jsxs114(
|
|
41518
|
-
"span",
|
|
41519
|
-
{
|
|
41520
|
-
className: cn(
|
|
41521
|
-
"inline-flex items-center gap-1 text-[10px] px-2 py-0.5 rounded-full font-medium",
|
|
41522
|
-
enabled ? "bg-emerald-500/10 text-emerald-600" : "bg-red-500/10 text-red-500"
|
|
41523
|
-
),
|
|
41524
|
-
children: [
|
|
41525
|
-
/* @__PURE__ */ jsx156("span", { className: cn(
|
|
41526
|
-
"w-1.5 h-1.5 rounded-full",
|
|
41527
|
-
enabled ? "bg-emerald-500" : "bg-red-500"
|
|
41528
|
-
) }),
|
|
41529
|
-
enabled ? "Active" : "Disabled"
|
|
41530
|
-
]
|
|
41531
|
-
}
|
|
41532
|
-
)
|
|
41533
|
-
] }),
|
|
41534
|
-
/* @__PURE__ */ jsx156("p", { className: "text-xs text-[var(--foreground)]/60 leading-relaxed mt-1 whitespace-normal", style: { textWrap: "auto" }, children: description })
|
|
41535
|
-
] })
|
|
41536
|
-
] }),
|
|
41537
|
-
stages.length > 0 && /* @__PURE__ */ jsxs114("div", { className: "border-t border-[var(--border-color)] px-5 py-4", children: [
|
|
41538
|
-
/* @__PURE__ */ jsxs114("p", { className: "text-[11px] font-semibold text-[var(--foreground)]/40 uppercase tracking-wide mb-3", children: [
|
|
41539
|
-
"Stages (",
|
|
41540
|
-
stages.length,
|
|
41541
|
-
")"
|
|
41542
|
-
] }),
|
|
41543
|
-
/* @__PURE__ */ jsx156("div", { className: "flex flex-col gap-0", children: stages.map((stage, idx) => /* @__PURE__ */ jsxs114("div", { className: "flex items-stretch", children: [
|
|
41544
|
-
/* @__PURE__ */ jsxs114("div", { className: "flex flex-col items-center mr-3 w-5", children: [
|
|
41545
|
-
/* @__PURE__ */ jsx156(
|
|
41546
|
-
"div",
|
|
41547
|
-
{
|
|
41548
|
-
className: cn(
|
|
41549
|
-
"w-5 h-5 rounded-full flex items-center justify-center text-[10px] font-bold shrink-0",
|
|
41550
|
-
"bg-interactive/10 text-interactive border border-interactive/30"
|
|
41551
|
-
),
|
|
41552
|
-
children: idx + 1
|
|
41553
|
-
}
|
|
41554
|
-
),
|
|
41555
|
-
idx < stages.length - 1 && /* @__PURE__ */ jsx156("div", { className: "w-px flex-1 min-h-[16px] border-l border-dashed border-interactive/30" })
|
|
41556
|
-
] }),
|
|
41557
|
-
/* @__PURE__ */ jsxs114("div", { className: "flex-1 mb-2 p-3 rounded-lg border border-[var(--border-color)] bg-[var(--foreground)]/[0.02]", children: [
|
|
41558
|
-
/* @__PURE__ */ jsxs114("div", { className: "flex items-center gap-2", children: [
|
|
41559
|
-
/* @__PURE__ */ jsx156("span", { className: "text-xs font-semibold text-[var(--foreground)]", children: stage.name }),
|
|
41560
|
-
/* @__PURE__ */ jsx156("span", { className: "text-[10px] font-mono text-[var(--foreground)]/30 bg-[var(--foreground)]/[0.04] px-1.5 py-0.5 rounded", children: stage.agent_name })
|
|
41561
|
-
] }),
|
|
41562
|
-
/* @__PURE__ */ jsxs114("div", { className: "flex items-center gap-3 mt-1.5 text-[10px] text-[var(--foreground)]/50", children: [
|
|
41563
|
-
stage.tools && stage.tools.length > 0 && /* @__PURE__ */ jsxs114("span", { children: [
|
|
41564
|
-
stage.tools.length,
|
|
41565
|
-
" tool",
|
|
41566
|
-
stage.tools.length !== 1 ? "s" : ""
|
|
41567
|
-
] }),
|
|
41568
|
-
stage.ui_components && stage.ui_components.length > 0 && /* @__PURE__ */ jsxs114("span", { children: [
|
|
41569
|
-
stage.ui_components.length,
|
|
41570
|
-
" component",
|
|
41571
|
-
stage.ui_components.length !== 1 ? "s" : ""
|
|
41572
|
-
] })
|
|
41573
|
-
] })
|
|
41574
|
-
] })
|
|
41575
|
-
] }, stage.agent_name || idx)) })
|
|
41576
|
-
] })
|
|
41577
|
-
]
|
|
41578
|
-
}
|
|
41579
|
-
);
|
|
41580
|
-
};
|
|
41581
|
-
|
|
41582
|
-
// src/molecules/workstream-builder/MultiAgentPlan/MultiAgentPlan.tsx
|
|
41583
|
-
import { jsx as jsx157, jsxs as jsxs115 } from "react/jsx-runtime";
|
|
41584
|
-
var FONT_STYLE8 = {
|
|
41585
|
-
fontFamily: "Inter, system-ui, sans-serif"
|
|
41586
|
-
};
|
|
41587
|
-
var MultiAgentPlan = ({
|
|
41588
|
-
stages = [],
|
|
41589
|
-
className
|
|
41590
|
-
}) => {
|
|
41591
|
-
return /* @__PURE__ */ jsxs115(
|
|
41592
|
-
"div",
|
|
41593
|
-
{
|
|
41594
|
-
className: cn(
|
|
41595
|
-
"text-foreground hover:bg-muted/50 hover:text-foreground my-3 rounded-xl border border-[var(--border-color)] bg-[var(--card-background)] overflow-hidden shadow-sm",
|
|
41596
|
-
className
|
|
41597
|
-
),
|
|
41598
|
-
style: FONT_STYLE8,
|
|
41599
|
-
children: [
|
|
41600
|
-
/* @__PURE__ */ jsx157("div", { className: "px-4 py-3 border-b border-[var(--border-color)] bg-gradient-to-r from-[var(--foreground)]/[0.02] to-transparent", children: /* @__PURE__ */ jsxs115("div", { className: "flex items-center gap-2", children: [
|
|
41601
|
-
/* @__PURE__ */ jsx157("div", { className: "w-4 h-4 rounded bg-violet-500/20 flex items-center justify-center", children: /* @__PURE__ */ jsx157(
|
|
41602
|
-
"svg",
|
|
41603
|
-
{
|
|
41604
|
-
width: "10",
|
|
41605
|
-
height: "10",
|
|
41606
|
-
viewBox: "0 0 24 24",
|
|
41607
|
-
fill: "none",
|
|
41608
|
-
stroke: "currentColor",
|
|
41609
|
-
strokeWidth: "2",
|
|
41610
|
-
className: "text-violet-600",
|
|
41611
|
-
children: /* @__PURE__ */ jsx157("path", { d: "M16 3h5v5M4 20L21 3M21 16v5h-5M15 15l6 6M4 4l5 5" })
|
|
41612
|
-
}
|
|
41613
|
-
) }),
|
|
41614
|
-
/* @__PURE__ */ jsx157("span", { className: "text-xs font-semibold text-[var(--foreground)]", children: "Proposed Multi-Agent Workflow" }),
|
|
41615
|
-
/* @__PURE__ */ jsx157("span", { className: "text-[10px] px-1.5 py-0.5 rounded-full bg-amber-500/10 text-amber-600 font-medium", children: "Draft" })
|
|
41616
|
-
] }) }),
|
|
41617
|
-
/* @__PURE__ */ jsx157("div", { className: "px-4 py-3", children: /* @__PURE__ */ jsx157("div", { className: "flex flex-col gap-0", children: stages.map((stage, idx) => /* @__PURE__ */ jsxs115("div", { className: "flex items-stretch min-w-0", children: [
|
|
41618
|
-
/* @__PURE__ */ jsxs115("div", { className: "flex flex-col items-center mr-3 w-6", children: [
|
|
41619
|
-
/* @__PURE__ */ jsx157("div", { className: "w-6 h-6 rounded-full flex items-center justify-center text-[10px] font-bold shrink-0 bg-interactive/10 text-interactive border border-interactive/30", children: idx + 1 }),
|
|
41620
|
-
idx < stages.length - 1 && /* @__PURE__ */ jsx157("div", { className: "w-px flex-1 min-h-[12px] border-l border-dashed border-interactive/30" })
|
|
41621
|
-
] }),
|
|
41622
|
-
/* @__PURE__ */ jsxs115("div", { className: "flex-1 mb-2 pb-2 min-w-0", children: [
|
|
41623
|
-
/* @__PURE__ */ jsx157("p", { className: "text-xs font-semibold text-foreground", children: stage.name }),
|
|
41624
|
-
stage.description && /* @__PURE__ */ jsx157(
|
|
41625
|
-
"p",
|
|
41626
|
-
{
|
|
41627
|
-
className: "text-[11px] text-foreground/50 mt-0.5 whitespace-normal",
|
|
41628
|
-
style: { textWrap: "auto" },
|
|
41629
|
-
children: stage.description
|
|
41630
|
-
}
|
|
41631
|
-
),
|
|
41632
|
-
stage.proposed_tools && stage.proposed_tools.length > 0 && /* @__PURE__ */ jsx157("div", { className: "flex flex-wrap gap-1 mt-1.5", children: stage.proposed_tools.map((tool) => /* @__PURE__ */ jsx157(
|
|
41633
|
-
"span",
|
|
41634
|
-
{
|
|
41635
|
-
className: "text-[10px] px-1.5 py-0.5 rounded bg-interactive/10 text-interactive font-mono",
|
|
41636
|
-
children: tool
|
|
41637
|
-
},
|
|
41638
|
-
tool
|
|
41639
|
-
)) })
|
|
41640
|
-
] })
|
|
41641
|
-
] }, stage.name || idx)) }) })
|
|
41642
|
-
]
|
|
41643
|
-
}
|
|
41644
|
-
);
|
|
41645
|
-
};
|
|
41646
|
-
|
|
41647
|
-
// src/molecules/workstream-builder/MultiAgentUISelector/MultiAgentUISelector.tsx
|
|
41648
|
-
import { useState as useState24, useCallback as useCallback10 } from "react";
|
|
41649
|
-
import { jsx as jsx158, jsxs as jsxs116 } from "react/jsx-runtime";
|
|
41650
|
-
var FONT_STYLE9 = {
|
|
41651
|
-
fontFamily: "Inter, system-ui, sans-serif"
|
|
41652
|
-
};
|
|
41653
|
-
var MultiAgentUISelector = ({
|
|
41654
|
-
stages = [],
|
|
41655
|
-
components = [],
|
|
41656
|
-
onSelect,
|
|
41657
|
-
onPreview,
|
|
41658
|
-
className,
|
|
41659
|
-
isLatestMessage = true
|
|
41660
|
-
}) => {
|
|
41661
|
-
const [activeStageId, setActiveStageId] = useState24(stages[0]?.id || "");
|
|
41662
|
-
const [selections, setSelections] = useState24(
|
|
41663
|
-
() => {
|
|
41664
|
-
const init = {};
|
|
41665
|
-
const recommendedNames = components.filter((c) => c.recommended).map((c) => c.name);
|
|
41666
|
-
for (const stage of stages) {
|
|
41667
|
-
const stageRecs = stage.recommended_components?.length ? stage.recommended_components : recommendedNames;
|
|
41668
|
-
init[stage.id] = new Set(stageRecs);
|
|
41669
|
-
}
|
|
41670
|
-
return init;
|
|
41671
|
-
}
|
|
41672
|
-
);
|
|
41673
|
-
const [submitted, setSubmitted] = useState24(false);
|
|
41674
|
-
const grouped = components.reduce((acc, comp) => {
|
|
41675
|
-
const cat = comp.category || "Other";
|
|
41676
|
-
if (!acc[cat]) acc[cat] = [];
|
|
41677
|
-
acc[cat].push(comp);
|
|
41678
|
-
return acc;
|
|
41679
|
-
}, {});
|
|
41680
|
-
const toggleComponent = useCallback10(
|
|
41681
|
-
(stageId, compName) => {
|
|
41682
|
-
if (submitted || !isLatestMessage) return;
|
|
41683
|
-
setSelections((prev) => {
|
|
41684
|
-
const updated = { ...prev };
|
|
41685
|
-
const set = new Set(updated[stageId] || []);
|
|
41686
|
-
if (set.has(compName)) {
|
|
41687
|
-
set.delete(compName);
|
|
41688
|
-
} else {
|
|
41689
|
-
set.add(compName);
|
|
41690
|
-
}
|
|
41691
|
-
updated[stageId] = set;
|
|
41692
|
-
return updated;
|
|
41693
|
-
});
|
|
41694
|
-
},
|
|
41695
|
-
[submitted]
|
|
41696
|
-
);
|
|
41697
|
-
const selectAll = useCallback10(
|
|
41698
|
-
(stageId) => {
|
|
41699
|
-
if (submitted || !isLatestMessage) return;
|
|
41700
|
-
setSelections((prev) => {
|
|
41701
|
-
const updated = { ...prev };
|
|
41702
|
-
updated[stageId] = new Set(components.map((c) => c.name));
|
|
41703
|
-
return updated;
|
|
41704
|
-
});
|
|
41705
|
-
},
|
|
41706
|
-
[submitted, isLatestMessage, components]
|
|
41707
|
-
);
|
|
41708
|
-
const clearAll = useCallback10(
|
|
41709
|
-
(stageId) => {
|
|
41710
|
-
if (submitted || !isLatestMessage) return;
|
|
41711
|
-
setSelections((prev) => {
|
|
41712
|
-
const updated = { ...prev };
|
|
41713
|
-
updated[stageId] = /* @__PURE__ */ new Set();
|
|
41714
|
-
return updated;
|
|
41715
|
-
});
|
|
41716
|
-
},
|
|
41717
|
-
[submitted, isLatestMessage]
|
|
41718
|
-
);
|
|
41719
|
-
const handleContinue = useCallback10(() => {
|
|
41720
|
-
setSubmitted(true);
|
|
41721
|
-
if (onSelect) {
|
|
41722
|
-
const result = {};
|
|
41723
|
-
for (const [stageId, set] of Object.entries(selections)) {
|
|
41724
|
-
result[stageId] = Array.from(set);
|
|
41725
|
-
}
|
|
41726
|
-
onSelect(result);
|
|
41727
|
-
}
|
|
41728
|
-
}, [onSelect, selections]);
|
|
41729
|
-
const activeStage = stages.find((s) => s.id === activeStageId);
|
|
41730
|
-
return /* @__PURE__ */ jsxs116(
|
|
41731
|
-
"div",
|
|
41732
|
-
{
|
|
41733
|
-
className: cn(
|
|
41734
|
-
"my-3 rounded-xl border border-border bg-card overflow-hidden shadow-sm",
|
|
41735
|
-
className
|
|
41736
|
-
),
|
|
41737
|
-
style: FONT_STYLE9,
|
|
41738
|
-
children: [
|
|
41739
|
-
/* @__PURE__ */ jsx158("div", { className: "px-4 py-3 border-b border-border/60 bg-muted/40", children: /* @__PURE__ */ jsxs116("div", { className: "flex items-center gap-2", children: [
|
|
41740
|
-
/* @__PURE__ */ jsx158("div", { className: "w-5 h-5 rounded-md bg-interactive/15 flex items-center justify-center", children: /* @__PURE__ */ jsxs116(
|
|
41741
|
-
"svg",
|
|
41742
|
-
{
|
|
41743
|
-
width: "12",
|
|
41744
|
-
height: "12",
|
|
41745
|
-
viewBox: "0 0 24 24",
|
|
41746
|
-
fill: "none",
|
|
41747
|
-
stroke: "currentColor",
|
|
41748
|
-
strokeWidth: "2",
|
|
41749
|
-
className: "text-interactive",
|
|
41750
|
-
children: [
|
|
41751
|
-
/* @__PURE__ */ jsx158("rect", { x: "3", y: "3", width: "7", height: "7" }),
|
|
41752
|
-
/* @__PURE__ */ jsx158("rect", { x: "14", y: "3", width: "7", height: "7" }),
|
|
41753
|
-
/* @__PURE__ */ jsx158("rect", { x: "3", y: "14", width: "7", height: "7" }),
|
|
41754
|
-
/* @__PURE__ */ jsx158("rect", { x: "14", y: "14", width: "7", height: "7" })
|
|
41755
|
-
]
|
|
41756
|
-
}
|
|
41757
|
-
) }),
|
|
41758
|
-
/* @__PURE__ */ jsx158("span", { className: "text-xs font-semibold text-foreground", children: "UI Components per Stage" })
|
|
41759
|
-
] }) }),
|
|
41760
|
-
/* @__PURE__ */ jsx158("div", { className: "flex gap-1 border-b border-border/60 px-4 py-2 bg-muted/20", children: stages.map((stage) => /* @__PURE__ */ jsx158(
|
|
41761
|
-
"button",
|
|
41762
|
-
{
|
|
41763
|
-
onClick: () => setActiveStageId(stage.id),
|
|
41764
|
-
className: cn(
|
|
41765
|
-
"px-3 py-1.5 text-[11px] font-medium rounded-full transition-colors",
|
|
41766
|
-
activeStageId === stage.id ? "bg-interactive text-white" : "text-muted-foreground hover:text-foreground hover:bg-muted"
|
|
41767
|
-
),
|
|
41768
|
-
children: stage.name
|
|
41769
|
-
},
|
|
41770
|
-
stage.id
|
|
41771
|
-
)) }),
|
|
41772
|
-
/* @__PURE__ */ jsxs116("div", { className: "px-4 py-3", children: [
|
|
41773
|
-
activeStage && /* @__PURE__ */ jsxs116("div", { className: "flex items-center justify-between mb-3", children: [
|
|
41774
|
-
/* @__PURE__ */ jsxs116("p", { className: "text-[10px] text-muted-foreground", children: [
|
|
41775
|
-
"Select components for ",
|
|
41776
|
-
/* @__PURE__ */ jsx158("strong", { className: "text-foreground", children: activeStage.name }),
|
|
41777
|
-
" (",
|
|
41778
|
-
activeStage.agent_name,
|
|
41779
|
-
")"
|
|
41780
|
-
] }),
|
|
41781
|
-
!submitted && isLatestMessage && /* @__PURE__ */ jsxs116("div", { className: "flex items-center gap-2", children: [
|
|
41782
|
-
/* @__PURE__ */ jsx158(
|
|
41783
|
-
"button",
|
|
41784
|
-
{
|
|
41785
|
-
onClick: () => selectAll(activeStageId),
|
|
41786
|
-
className: "text-[10px] text-interactive hover:underline font-medium",
|
|
41787
|
-
children: "Select All"
|
|
41788
|
-
}
|
|
41789
|
-
),
|
|
41790
|
-
/* @__PURE__ */ jsx158("span", { className: "text-muted-foreground/40", children: "|" }),
|
|
41791
|
-
/* @__PURE__ */ jsx158(
|
|
41792
|
-
"button",
|
|
41793
|
-
{
|
|
41794
|
-
onClick: () => clearAll(activeStageId),
|
|
41795
|
-
className: "text-[10px] text-muted-foreground hover:text-foreground font-medium",
|
|
41796
|
-
children: "Clear"
|
|
41797
|
-
}
|
|
41798
|
-
)
|
|
41799
|
-
] })
|
|
41800
|
-
] }),
|
|
41801
|
-
Object.entries(grouped).map(([category, comps]) => /* @__PURE__ */ jsxs116("div", { className: "mb-3", children: [
|
|
41802
|
-
/* @__PURE__ */ jsx158("p", { className: "text-[10px] font-semibold text-muted-foreground uppercase tracking-wide mb-1.5", children: category }),
|
|
41803
|
-
/* @__PURE__ */ jsx158("div", { className: "grid grid-cols-2 gap-1.5", children: comps.map((comp) => {
|
|
41804
|
-
const isSelected = selections[activeStageId]?.has(comp.name) || false;
|
|
41805
|
-
return /* @__PURE__ */ jsxs116(
|
|
41806
|
-
"div",
|
|
41807
|
-
{
|
|
41808
|
-
role: "button",
|
|
41809
|
-
tabIndex: 0,
|
|
41810
|
-
onClick: () => toggleComponent(activeStageId, comp.name),
|
|
41811
|
-
onKeyDown: (e) => {
|
|
41812
|
-
if (e.key === "Enter" || e.key === " ") {
|
|
41813
|
-
e.preventDefault();
|
|
41814
|
-
toggleComponent(activeStageId, comp.name);
|
|
41815
|
-
}
|
|
41816
|
-
},
|
|
41817
|
-
className: cn(
|
|
41818
|
-
"text-left p-2.5 rounded-lg border text-[11px] transition-all overflow-hidden cursor-pointer",
|
|
41819
|
-
isSelected ? "border-interactive bg-interactive/5" : "border-border hover:border-interactive/50",
|
|
41820
|
-
(submitted || !isLatestMessage) && "opacity-60 cursor-default"
|
|
41821
|
-
),
|
|
41822
|
-
children: [
|
|
41823
|
-
/* @__PURE__ */ jsxs116("div", { className: "flex items-center gap-1.5", children: [
|
|
41824
|
-
/* @__PURE__ */ jsx158(
|
|
41825
|
-
"div",
|
|
41826
|
-
{
|
|
41827
|
-
className: cn(
|
|
41828
|
-
"w-3.5 h-3.5 rounded border flex items-center justify-center shrink-0",
|
|
41829
|
-
isSelected ? "bg-interactive border-interactive" : "border-muted-foreground/30"
|
|
41830
|
-
),
|
|
41831
|
-
children: isSelected && /* @__PURE__ */ jsx158(
|
|
41832
|
-
"svg",
|
|
41833
|
-
{
|
|
41834
|
-
width: "8",
|
|
41835
|
-
height: "8",
|
|
41836
|
-
viewBox: "0 0 24 24",
|
|
41837
|
-
fill: "none",
|
|
41838
|
-
stroke: "white",
|
|
41839
|
-
strokeWidth: "3",
|
|
41840
|
-
children: /* @__PURE__ */ jsx158("polyline", { points: "20 6 9 17 4 12" })
|
|
41841
|
-
}
|
|
41842
|
-
)
|
|
41843
|
-
}
|
|
41844
|
-
),
|
|
41845
|
-
/* @__PURE__ */ jsx158("span", { className: "font-medium text-foreground", children: comp.display_name }),
|
|
41846
|
-
comp.recommended && /* @__PURE__ */ jsx158("span", { className: "px-1 py-px text-[8px] font-semibold uppercase tracking-wider rounded-full bg-emerald-500/10 text-emerald-600 border border-emerald-500/20 leading-tight", children: "Rec" }),
|
|
41847
|
-
onPreview && /* @__PURE__ */ jsx158(
|
|
41848
|
-
"button",
|
|
41849
|
-
{
|
|
41850
|
-
type: "button",
|
|
41851
|
-
onClick: (e) => {
|
|
41852
|
-
e.stopPropagation();
|
|
41853
|
-
onPreview(comp.name);
|
|
41854
|
-
},
|
|
41855
|
-
className: "ml-auto shrink-0 p-0.5 rounded hover:bg-muted transition-colors",
|
|
41856
|
-
title: `Preview ${comp.display_name}`,
|
|
41857
|
-
children: /* @__PURE__ */ jsxs116(
|
|
41858
|
-
"svg",
|
|
41859
|
-
{
|
|
41860
|
-
width: "14",
|
|
41861
|
-
height: "14",
|
|
41862
|
-
viewBox: "0 0 24 24",
|
|
41863
|
-
fill: "none",
|
|
41864
|
-
stroke: "currentColor",
|
|
41865
|
-
strokeWidth: "2",
|
|
41866
|
-
strokeLinecap: "round",
|
|
41867
|
-
strokeLinejoin: "round",
|
|
41868
|
-
className: "text-muted-foreground hover:text-primary",
|
|
41869
|
-
children: [
|
|
41870
|
-
/* @__PURE__ */ jsx158("circle", { cx: "12", cy: "12", r: "10" }),
|
|
41871
|
-
/* @__PURE__ */ jsx158("line", { x1: "12", y1: "16", x2: "12", y2: "12" }),
|
|
41872
|
-
/* @__PURE__ */ jsx158("line", { x1: "12", y1: "8", x2: "12.01", y2: "8" })
|
|
41873
|
-
]
|
|
41874
|
-
}
|
|
41875
|
-
)
|
|
41876
|
-
}
|
|
41877
|
-
)
|
|
41878
|
-
] }),
|
|
41879
|
-
/* @__PURE__ */ jsx158("p", { className: "text-[10px] text-muted-foreground mt-0.5 ml-5 whitespace-normal", children: comp.description })
|
|
41880
|
-
]
|
|
41881
|
-
},
|
|
41882
|
-
comp.name
|
|
41883
|
-
);
|
|
41884
|
-
}) })
|
|
41885
|
-
] }, category))
|
|
41886
|
-
] }),
|
|
41887
|
-
!submitted && isLatestMessage && /* @__PURE__ */ jsx158("div", { className: "px-4 py-3 border-t border-border/60 bg-muted/30", children: /* @__PURE__ */ jsx158(
|
|
41888
|
-
"button",
|
|
41889
|
-
{
|
|
41890
|
-
onClick: handleContinue,
|
|
41891
|
-
className: "w-full py-2 rounded-lg bg-interactive text-white text-xs font-medium hover:opacity-90 transition-opacity",
|
|
41892
|
-
children: "Continue"
|
|
41893
|
-
}
|
|
41894
|
-
) }),
|
|
41895
|
-
submitted && /* @__PURE__ */ jsx158("div", { className: "px-4 pb-3", children: /* @__PURE__ */ jsx158("div", { className: "text-[10px] text-emerald-600 font-medium text-center py-1.5", children: "Selections confirmed" }) })
|
|
41896
|
-
]
|
|
41897
|
-
}
|
|
41898
|
-
);
|
|
41899
|
-
};
|
|
41900
|
-
|
|
41901
|
-
// src/molecules/workstream-builder/StageIndicator/StageIndicator.tsx
|
|
41902
|
-
import { jsx as jsx159, jsxs as jsxs117 } from "react/jsx-runtime";
|
|
41903
|
-
var FONT_STYLE10 = {
|
|
41904
|
-
fontFamily: "Inter, system-ui, sans-serif"
|
|
41905
|
-
};
|
|
41906
|
-
var StageIndicator = ({
|
|
41907
|
-
stage_name,
|
|
41908
|
-
agent_name,
|
|
41909
|
-
className
|
|
41910
|
-
}) => {
|
|
41911
|
-
return /* @__PURE__ */ jsxs117(
|
|
41912
|
-
"div",
|
|
41913
|
-
{
|
|
41914
|
-
className: cn(
|
|
41915
|
-
"flex items-center gap-3 my-4",
|
|
41916
|
-
className
|
|
41917
|
-
),
|
|
41918
|
-
style: { ...FONT_STYLE10, animation: "fadeIn 0.3s ease-out" },
|
|
41919
|
-
children: [
|
|
41920
|
-
/* @__PURE__ */ jsx159("div", { className: "flex-1 h-px bg-[var(--border-color)]" }),
|
|
41921
|
-
/* @__PURE__ */ jsxs117("div", { className: "flex items-center gap-1.5 px-3 py-1 rounded-full bg-violet-500/10 border border-violet-500/20", children: [
|
|
41922
|
-
/* @__PURE__ */ jsx159("div", { className: "w-1.5 h-1.5 rounded-full bg-violet-500 animate-pulse" }),
|
|
41923
|
-
/* @__PURE__ */ jsx159("span", { className: "text-[10px] font-medium text-violet-600", children: stage_name || agent_name })
|
|
41924
|
-
] }),
|
|
41925
|
-
/* @__PURE__ */ jsx159("div", { className: "flex-1 h-px bg-[var(--border-color)]" })
|
|
41926
|
-
]
|
|
41927
|
-
}
|
|
41928
|
-
);
|
|
41929
|
-
};
|
|
41930
|
-
|
|
41931
40774
|
// src/components/ui/index.ts
|
|
41932
40775
|
var ui_exports = {};
|
|
41933
40776
|
__export(ui_exports, {
|
|
@@ -42220,7 +41063,7 @@ __export(ui_exports, {
|
|
|
42220
41063
|
// src/components/ui/button-group.tsx
|
|
42221
41064
|
import { Slot as Slot4 } from "@radix-ui/react-slot";
|
|
42222
41065
|
import { cva as cva8 } from "class-variance-authority";
|
|
42223
|
-
import { jsx as
|
|
41066
|
+
import { jsx as jsx150 } from "react/jsx-runtime";
|
|
42224
41067
|
var buttonGroupVariants = cva8(
|
|
42225
41068
|
"flex w-fit items-stretch has-[>[data-slot=button-group]]:gap-2 [&>*]:focus-visible:relative [&>*]:focus-visible:z-10 has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-md [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1",
|
|
42226
41069
|
{
|
|
@@ -42240,7 +41083,7 @@ function ButtonGroup({
|
|
|
42240
41083
|
orientation,
|
|
42241
41084
|
...props
|
|
42242
41085
|
}) {
|
|
42243
|
-
return /* @__PURE__ */
|
|
41086
|
+
return /* @__PURE__ */ jsx150(
|
|
42244
41087
|
"div",
|
|
42245
41088
|
{
|
|
42246
41089
|
role: "group",
|
|
@@ -42257,7 +41100,7 @@ function ButtonGroupText({
|
|
|
42257
41100
|
...props
|
|
42258
41101
|
}) {
|
|
42259
41102
|
const Comp = asChild ? Slot4 : "div";
|
|
42260
|
-
return /* @__PURE__ */
|
|
41103
|
+
return /* @__PURE__ */ jsx150(
|
|
42261
41104
|
Comp,
|
|
42262
41105
|
{
|
|
42263
41106
|
className: cn(
|
|
@@ -42273,7 +41116,7 @@ function ButtonGroupSeparator({
|
|
|
42273
41116
|
orientation = "vertical",
|
|
42274
41117
|
...props
|
|
42275
41118
|
}) {
|
|
42276
|
-
return /* @__PURE__ */
|
|
41119
|
+
return /* @__PURE__ */ jsx150(
|
|
42277
41120
|
Separator2,
|
|
42278
41121
|
{
|
|
42279
41122
|
"data-slot": "button-group-separator",
|
|
@@ -42289,9 +41132,9 @@ function ButtonGroupSeparator({
|
|
|
42289
41132
|
|
|
42290
41133
|
// src/components/ui/empty.tsx
|
|
42291
41134
|
import { cva as cva9 } from "class-variance-authority";
|
|
42292
|
-
import { jsx as
|
|
41135
|
+
import { jsx as jsx151 } from "react/jsx-runtime";
|
|
42293
41136
|
function Empty({ className, ...props }) {
|
|
42294
|
-
return /* @__PURE__ */
|
|
41137
|
+
return /* @__PURE__ */ jsx151(
|
|
42295
41138
|
"div",
|
|
42296
41139
|
{
|
|
42297
41140
|
"data-slot": "empty",
|
|
@@ -42304,7 +41147,7 @@ function Empty({ className, ...props }) {
|
|
|
42304
41147
|
);
|
|
42305
41148
|
}
|
|
42306
41149
|
function EmptyHeader({ className, ...props }) {
|
|
42307
|
-
return /* @__PURE__ */
|
|
41150
|
+
return /* @__PURE__ */ jsx151(
|
|
42308
41151
|
"div",
|
|
42309
41152
|
{
|
|
42310
41153
|
"data-slot": "empty-header",
|
|
@@ -42335,7 +41178,7 @@ function EmptyMedia({
|
|
|
42335
41178
|
variant = "default",
|
|
42336
41179
|
...props
|
|
42337
41180
|
}) {
|
|
42338
|
-
return /* @__PURE__ */
|
|
41181
|
+
return /* @__PURE__ */ jsx151(
|
|
42339
41182
|
"div",
|
|
42340
41183
|
{
|
|
42341
41184
|
"data-slot": "empty-icon",
|
|
@@ -42346,7 +41189,7 @@ function EmptyMedia({
|
|
|
42346
41189
|
);
|
|
42347
41190
|
}
|
|
42348
41191
|
function EmptyTitle({ className, ...props }) {
|
|
42349
|
-
return /* @__PURE__ */
|
|
41192
|
+
return /* @__PURE__ */ jsx151(
|
|
42350
41193
|
"div",
|
|
42351
41194
|
{
|
|
42352
41195
|
"data-slot": "empty-title",
|
|
@@ -42356,7 +41199,7 @@ function EmptyTitle({ className, ...props }) {
|
|
|
42356
41199
|
);
|
|
42357
41200
|
}
|
|
42358
41201
|
function EmptyDescription({ className, ...props }) {
|
|
42359
|
-
return /* @__PURE__ */
|
|
41202
|
+
return /* @__PURE__ */ jsx151(
|
|
42360
41203
|
"div",
|
|
42361
41204
|
{
|
|
42362
41205
|
"data-slot": "empty-description",
|
|
@@ -42369,7 +41212,7 @@ function EmptyDescription({ className, ...props }) {
|
|
|
42369
41212
|
);
|
|
42370
41213
|
}
|
|
42371
41214
|
function EmptyContent({ className, ...props }) {
|
|
42372
|
-
return /* @__PURE__ */
|
|
41215
|
+
return /* @__PURE__ */ jsx151(
|
|
42373
41216
|
"div",
|
|
42374
41217
|
{
|
|
42375
41218
|
"data-slot": "empty-content",
|
|
@@ -42385,9 +41228,9 @@ function EmptyContent({ className, ...props }) {
|
|
|
42385
41228
|
// src/components/ui/field.tsx
|
|
42386
41229
|
import { useMemo as useMemo11 } from "react";
|
|
42387
41230
|
import { cva as cva10 } from "class-variance-authority";
|
|
42388
|
-
import { jsx as
|
|
41231
|
+
import { jsx as jsx152, jsxs as jsxs108 } from "react/jsx-runtime";
|
|
42389
41232
|
function FieldSet({ className, ...props }) {
|
|
42390
|
-
return /* @__PURE__ */
|
|
41233
|
+
return /* @__PURE__ */ jsx152(
|
|
42391
41234
|
"fieldset",
|
|
42392
41235
|
{
|
|
42393
41236
|
"data-slot": "field-set",
|
|
@@ -42405,7 +41248,7 @@ function FieldLegend({
|
|
|
42405
41248
|
variant = "legend",
|
|
42406
41249
|
...props
|
|
42407
41250
|
}) {
|
|
42408
|
-
return /* @__PURE__ */
|
|
41251
|
+
return /* @__PURE__ */ jsx152(
|
|
42409
41252
|
"legend",
|
|
42410
41253
|
{
|
|
42411
41254
|
"data-slot": "field-legend",
|
|
@@ -42421,7 +41264,7 @@ function FieldLegend({
|
|
|
42421
41264
|
);
|
|
42422
41265
|
}
|
|
42423
41266
|
function FieldGroup({ className, ...props }) {
|
|
42424
|
-
return /* @__PURE__ */
|
|
41267
|
+
return /* @__PURE__ */ jsx152(
|
|
42425
41268
|
"div",
|
|
42426
41269
|
{
|
|
42427
41270
|
"data-slot": "field-group",
|
|
@@ -42461,7 +41304,7 @@ function Field({
|
|
|
42461
41304
|
orientation = "vertical",
|
|
42462
41305
|
...props
|
|
42463
41306
|
}) {
|
|
42464
|
-
return /* @__PURE__ */
|
|
41307
|
+
return /* @__PURE__ */ jsx152(
|
|
42465
41308
|
"div",
|
|
42466
41309
|
{
|
|
42467
41310
|
role: "group",
|
|
@@ -42473,7 +41316,7 @@ function Field({
|
|
|
42473
41316
|
);
|
|
42474
41317
|
}
|
|
42475
41318
|
function FieldContent({ className, ...props }) {
|
|
42476
|
-
return /* @__PURE__ */
|
|
41319
|
+
return /* @__PURE__ */ jsx152(
|
|
42477
41320
|
"div",
|
|
42478
41321
|
{
|
|
42479
41322
|
"data-slot": "field-content",
|
|
@@ -42489,7 +41332,7 @@ function FieldLabel({
|
|
|
42489
41332
|
className,
|
|
42490
41333
|
...props
|
|
42491
41334
|
}) {
|
|
42492
|
-
return /* @__PURE__ */
|
|
41335
|
+
return /* @__PURE__ */ jsx152(
|
|
42493
41336
|
Label,
|
|
42494
41337
|
{
|
|
42495
41338
|
"data-slot": "field-label",
|
|
@@ -42504,7 +41347,7 @@ function FieldLabel({
|
|
|
42504
41347
|
);
|
|
42505
41348
|
}
|
|
42506
41349
|
function FieldTitle({ className, ...props }) {
|
|
42507
|
-
return /* @__PURE__ */
|
|
41350
|
+
return /* @__PURE__ */ jsx152(
|
|
42508
41351
|
"div",
|
|
42509
41352
|
{
|
|
42510
41353
|
"data-slot": "field-label",
|
|
@@ -42517,7 +41360,7 @@ function FieldTitle({ className, ...props }) {
|
|
|
42517
41360
|
);
|
|
42518
41361
|
}
|
|
42519
41362
|
function FieldDescription({ className, ...props }) {
|
|
42520
|
-
return /* @__PURE__ */
|
|
41363
|
+
return /* @__PURE__ */ jsx152(
|
|
42521
41364
|
"p",
|
|
42522
41365
|
{
|
|
42523
41366
|
"data-slot": "field-description",
|
|
@@ -42536,7 +41379,7 @@ function FieldSeparator({
|
|
|
42536
41379
|
className,
|
|
42537
41380
|
...props
|
|
42538
41381
|
}) {
|
|
42539
|
-
return /* @__PURE__ */
|
|
41382
|
+
return /* @__PURE__ */ jsxs108(
|
|
42540
41383
|
"div",
|
|
42541
41384
|
{
|
|
42542
41385
|
"data-slot": "field-separator",
|
|
@@ -42547,8 +41390,8 @@ function FieldSeparator({
|
|
|
42547
41390
|
),
|
|
42548
41391
|
...props,
|
|
42549
41392
|
children: [
|
|
42550
|
-
/* @__PURE__ */
|
|
42551
|
-
children && /* @__PURE__ */
|
|
41393
|
+
/* @__PURE__ */ jsx152(Separator2, { className: "absolute inset-0 top-1/2" }),
|
|
41394
|
+
children && /* @__PURE__ */ jsx152(
|
|
42552
41395
|
"span",
|
|
42553
41396
|
{
|
|
42554
41397
|
className: "bg-background text-muted-foreground relative mx-auto block w-fit px-2",
|
|
@@ -42576,14 +41419,14 @@ function FieldError({
|
|
|
42576
41419
|
if (errors?.length === 1 && errors[0]?.message) {
|
|
42577
41420
|
return errors[0].message;
|
|
42578
41421
|
}
|
|
42579
|
-
return /* @__PURE__ */
|
|
42580
|
-
(error, index) => error?.message && /* @__PURE__ */
|
|
41422
|
+
return /* @__PURE__ */ jsx152("ul", { className: "ml-4 flex list-disc flex-col gap-1", children: errors.map(
|
|
41423
|
+
(error, index) => error?.message && /* @__PURE__ */ jsx152("li", { children: error.message }, index)
|
|
42581
41424
|
) });
|
|
42582
41425
|
}, [children, errors]);
|
|
42583
41426
|
if (!content) {
|
|
42584
41427
|
return null;
|
|
42585
41428
|
}
|
|
42586
|
-
return /* @__PURE__ */
|
|
41429
|
+
return /* @__PURE__ */ jsx152(
|
|
42587
41430
|
"div",
|
|
42588
41431
|
{
|
|
42589
41432
|
role: "alert",
|
|
@@ -42597,9 +41440,9 @@ function FieldError({
|
|
|
42597
41440
|
|
|
42598
41441
|
// src/components/ui/input-group.tsx
|
|
42599
41442
|
import { cva as cva11 } from "class-variance-authority";
|
|
42600
|
-
import { jsx as
|
|
41443
|
+
import { jsx as jsx153 } from "react/jsx-runtime";
|
|
42601
41444
|
function InputGroup({ className, ...props }) {
|
|
42602
|
-
return /* @__PURE__ */
|
|
41445
|
+
return /* @__PURE__ */ jsx153(
|
|
42603
41446
|
"div",
|
|
42604
41447
|
{
|
|
42605
41448
|
"data-slot": "input-group",
|
|
@@ -42643,7 +41486,7 @@ function InputGroupAddon({
|
|
|
42643
41486
|
align = "inline-start",
|
|
42644
41487
|
...props
|
|
42645
41488
|
}) {
|
|
42646
|
-
return /* @__PURE__ */
|
|
41489
|
+
return /* @__PURE__ */ jsx153(
|
|
42647
41490
|
"div",
|
|
42648
41491
|
{
|
|
42649
41492
|
role: "group",
|
|
@@ -42683,7 +41526,7 @@ function InputGroupButton({
|
|
|
42683
41526
|
size = "xs",
|
|
42684
41527
|
...props
|
|
42685
41528
|
}) {
|
|
42686
|
-
return /* @__PURE__ */
|
|
41529
|
+
return /* @__PURE__ */ jsx153(
|
|
42687
41530
|
Button,
|
|
42688
41531
|
{
|
|
42689
41532
|
type,
|
|
@@ -42695,7 +41538,7 @@ function InputGroupButton({
|
|
|
42695
41538
|
);
|
|
42696
41539
|
}
|
|
42697
41540
|
function InputGroupText({ className, ...props }) {
|
|
42698
|
-
return /* @__PURE__ */
|
|
41541
|
+
return /* @__PURE__ */ jsx153(
|
|
42699
41542
|
"span",
|
|
42700
41543
|
{
|
|
42701
41544
|
className: cn(
|
|
@@ -42710,7 +41553,7 @@ function InputGroupInput({
|
|
|
42710
41553
|
className,
|
|
42711
41554
|
...props
|
|
42712
41555
|
}) {
|
|
42713
|
-
return /* @__PURE__ */
|
|
41556
|
+
return /* @__PURE__ */ jsx153(
|
|
42714
41557
|
Input,
|
|
42715
41558
|
{
|
|
42716
41559
|
"data-slot": "input-group-control",
|
|
@@ -42726,7 +41569,7 @@ function InputGroupTextarea({
|
|
|
42726
41569
|
className,
|
|
42727
41570
|
...props
|
|
42728
41571
|
}) {
|
|
42729
|
-
return /* @__PURE__ */
|
|
41572
|
+
return /* @__PURE__ */ jsx153(
|
|
42730
41573
|
Textarea,
|
|
42731
41574
|
{
|
|
42732
41575
|
"data-slot": "input-group-control",
|
|
@@ -42742,9 +41585,9 @@ function InputGroupTextarea({
|
|
|
42742
41585
|
// src/components/ui/item.tsx
|
|
42743
41586
|
import { Slot as Slot5 } from "@radix-ui/react-slot";
|
|
42744
41587
|
import { cva as cva12 } from "class-variance-authority";
|
|
42745
|
-
import { jsx as
|
|
41588
|
+
import { jsx as jsx154 } from "react/jsx-runtime";
|
|
42746
41589
|
function ItemGroup({ className, ...props }) {
|
|
42747
|
-
return /* @__PURE__ */
|
|
41590
|
+
return /* @__PURE__ */ jsx154(
|
|
42748
41591
|
"div",
|
|
42749
41592
|
{
|
|
42750
41593
|
role: "list",
|
|
@@ -42758,7 +41601,7 @@ function ItemSeparator({
|
|
|
42758
41601
|
className,
|
|
42759
41602
|
...props
|
|
42760
41603
|
}) {
|
|
42761
|
-
return /* @__PURE__ */
|
|
41604
|
+
return /* @__PURE__ */ jsx154(
|
|
42762
41605
|
Separator2,
|
|
42763
41606
|
{
|
|
42764
41607
|
"data-slot": "item-separator",
|
|
@@ -42796,7 +41639,7 @@ function Item8({
|
|
|
42796
41639
|
...props
|
|
42797
41640
|
}) {
|
|
42798
41641
|
const Comp = asChild ? Slot5 : "div";
|
|
42799
|
-
return /* @__PURE__ */
|
|
41642
|
+
return /* @__PURE__ */ jsx154(
|
|
42800
41643
|
Comp,
|
|
42801
41644
|
{
|
|
42802
41645
|
"data-slot": "item",
|
|
@@ -42827,7 +41670,7 @@ function ItemMedia({
|
|
|
42827
41670
|
variant = "default",
|
|
42828
41671
|
...props
|
|
42829
41672
|
}) {
|
|
42830
|
-
return /* @__PURE__ */
|
|
41673
|
+
return /* @__PURE__ */ jsx154(
|
|
42831
41674
|
"div",
|
|
42832
41675
|
{
|
|
42833
41676
|
"data-slot": "item-media",
|
|
@@ -42838,7 +41681,7 @@ function ItemMedia({
|
|
|
42838
41681
|
);
|
|
42839
41682
|
}
|
|
42840
41683
|
function ItemContent({ className, ...props }) {
|
|
42841
|
-
return /* @__PURE__ */
|
|
41684
|
+
return /* @__PURE__ */ jsx154(
|
|
42842
41685
|
"div",
|
|
42843
41686
|
{
|
|
42844
41687
|
"data-slot": "item-content",
|
|
@@ -42851,7 +41694,7 @@ function ItemContent({ className, ...props }) {
|
|
|
42851
41694
|
);
|
|
42852
41695
|
}
|
|
42853
41696
|
function ItemTitle({ className, ...props }) {
|
|
42854
|
-
return /* @__PURE__ */
|
|
41697
|
+
return /* @__PURE__ */ jsx154(
|
|
42855
41698
|
"div",
|
|
42856
41699
|
{
|
|
42857
41700
|
"data-slot": "item-title",
|
|
@@ -42864,7 +41707,7 @@ function ItemTitle({ className, ...props }) {
|
|
|
42864
41707
|
);
|
|
42865
41708
|
}
|
|
42866
41709
|
function ItemDescription({ className, ...props }) {
|
|
42867
|
-
return /* @__PURE__ */
|
|
41710
|
+
return /* @__PURE__ */ jsx154(
|
|
42868
41711
|
"p",
|
|
42869
41712
|
{
|
|
42870
41713
|
"data-slot": "item-description",
|
|
@@ -42878,7 +41721,7 @@ function ItemDescription({ className, ...props }) {
|
|
|
42878
41721
|
);
|
|
42879
41722
|
}
|
|
42880
41723
|
function ItemActions({ className, ...props }) {
|
|
42881
|
-
return /* @__PURE__ */
|
|
41724
|
+
return /* @__PURE__ */ jsx154(
|
|
42882
41725
|
"div",
|
|
42883
41726
|
{
|
|
42884
41727
|
"data-slot": "item-actions",
|
|
@@ -42888,7 +41731,7 @@ function ItemActions({ className, ...props }) {
|
|
|
42888
41731
|
);
|
|
42889
41732
|
}
|
|
42890
41733
|
function ItemHeader({ className, ...props }) {
|
|
42891
|
-
return /* @__PURE__ */
|
|
41734
|
+
return /* @__PURE__ */ jsx154(
|
|
42892
41735
|
"div",
|
|
42893
41736
|
{
|
|
42894
41737
|
"data-slot": "item-header",
|
|
@@ -42901,7 +41744,7 @@ function ItemHeader({ className, ...props }) {
|
|
|
42901
41744
|
);
|
|
42902
41745
|
}
|
|
42903
41746
|
function ItemFooter({ className, ...props }) {
|
|
42904
|
-
return /* @__PURE__ */
|
|
41747
|
+
return /* @__PURE__ */ jsx154(
|
|
42905
41748
|
"div",
|
|
42906
41749
|
{
|
|
42907
41750
|
"data-slot": "item-footer",
|
|
@@ -42915,9 +41758,9 @@ function ItemFooter({ className, ...props }) {
|
|
|
42915
41758
|
}
|
|
42916
41759
|
|
|
42917
41760
|
// src/components/ui/kbd.tsx
|
|
42918
|
-
import { jsx as
|
|
41761
|
+
import { jsx as jsx155 } from "react/jsx-runtime";
|
|
42919
41762
|
function Kbd({ className, ...props }) {
|
|
42920
|
-
return /* @__PURE__ */
|
|
41763
|
+
return /* @__PURE__ */ jsx155(
|
|
42921
41764
|
"kbd",
|
|
42922
41765
|
{
|
|
42923
41766
|
"data-slot": "kbd",
|
|
@@ -42932,7 +41775,7 @@ function Kbd({ className, ...props }) {
|
|
|
42932
41775
|
);
|
|
42933
41776
|
}
|
|
42934
41777
|
function KbdGroup({ className, ...props }) {
|
|
42935
|
-
return /* @__PURE__ */
|
|
41778
|
+
return /* @__PURE__ */ jsx155(
|
|
42936
41779
|
"kbd",
|
|
42937
41780
|
{
|
|
42938
41781
|
"data-slot": "kbd-group",
|
|
@@ -42943,16 +41786,16 @@ function KbdGroup({ className, ...props }) {
|
|
|
42943
41786
|
}
|
|
42944
41787
|
|
|
42945
41788
|
// src/components/ui/sidebar.tsx
|
|
42946
|
-
import * as
|
|
41789
|
+
import * as React100 from "react";
|
|
42947
41790
|
import { Slot as Slot6 } from "@radix-ui/react-slot";
|
|
42948
41791
|
import { cva as cva13 } from "class-variance-authority";
|
|
42949
41792
|
|
|
42950
41793
|
// src/hooks/use-mobile.tsx
|
|
42951
|
-
import * as
|
|
41794
|
+
import * as React99 from "react";
|
|
42952
41795
|
var MOBILE_BREAKPOINT = 768;
|
|
42953
41796
|
function useIsMobile() {
|
|
42954
|
-
const [isMobile, setIsMobile] =
|
|
42955
|
-
|
|
41797
|
+
const [isMobile, setIsMobile] = React99.useState(void 0);
|
|
41798
|
+
React99.useEffect(() => {
|
|
42956
41799
|
const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
|
|
42957
41800
|
const onChange = () => {
|
|
42958
41801
|
setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
|
|
@@ -42965,22 +41808,22 @@ function useIsMobile() {
|
|
|
42965
41808
|
}
|
|
42966
41809
|
|
|
42967
41810
|
// src/components/ui/sidebar.tsx
|
|
42968
|
-
import { jsx as
|
|
41811
|
+
import { jsx as jsx156, jsxs as jsxs109 } from "react/jsx-runtime";
|
|
42969
41812
|
var SIDEBAR_COOKIE_NAME = "sidebar_state";
|
|
42970
41813
|
var SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
|
|
42971
41814
|
var SIDEBAR_WIDTH = "16rem";
|
|
42972
41815
|
var SIDEBAR_WIDTH_MOBILE = "18rem";
|
|
42973
41816
|
var SIDEBAR_WIDTH_ICON = "3rem";
|
|
42974
41817
|
var SIDEBAR_KEYBOARD_SHORTCUT = "b";
|
|
42975
|
-
var SidebarContext =
|
|
41818
|
+
var SidebarContext = React100.createContext(null);
|
|
42976
41819
|
function useSidebar() {
|
|
42977
|
-
const context =
|
|
41820
|
+
const context = React100.useContext(SidebarContext);
|
|
42978
41821
|
if (!context) {
|
|
42979
41822
|
throw new Error("useSidebar must be used within a SidebarProvider.");
|
|
42980
41823
|
}
|
|
42981
41824
|
return context;
|
|
42982
41825
|
}
|
|
42983
|
-
var SidebarProvider =
|
|
41826
|
+
var SidebarProvider = React100.forwardRef(
|
|
42984
41827
|
({
|
|
42985
41828
|
defaultOpen = true,
|
|
42986
41829
|
open: openProp,
|
|
@@ -42991,10 +41834,10 @@ var SidebarProvider = React104.forwardRef(
|
|
|
42991
41834
|
...props
|
|
42992
41835
|
}, ref) => {
|
|
42993
41836
|
const isMobile = useIsMobile();
|
|
42994
|
-
const [openMobile, setOpenMobile] =
|
|
42995
|
-
const [_open, _setOpen] =
|
|
41837
|
+
const [openMobile, setOpenMobile] = React100.useState(false);
|
|
41838
|
+
const [_open, _setOpen] = React100.useState(defaultOpen);
|
|
42996
41839
|
const open = openProp ?? _open;
|
|
42997
|
-
const setOpen =
|
|
41840
|
+
const setOpen = React100.useCallback(
|
|
42998
41841
|
(value) => {
|
|
42999
41842
|
const openState = typeof value === "function" ? value(open) : value;
|
|
43000
41843
|
if (setOpenProp) {
|
|
@@ -43006,10 +41849,10 @@ var SidebarProvider = React104.forwardRef(
|
|
|
43006
41849
|
},
|
|
43007
41850
|
[setOpenProp, open]
|
|
43008
41851
|
);
|
|
43009
|
-
const toggleSidebar =
|
|
41852
|
+
const toggleSidebar = React100.useCallback(() => {
|
|
43010
41853
|
return isMobile ? setOpenMobile((open2) => !open2) : setOpen((open2) => !open2);
|
|
43011
41854
|
}, [isMobile, setOpen, setOpenMobile]);
|
|
43012
|
-
|
|
41855
|
+
React100.useEffect(() => {
|
|
43013
41856
|
const handleKeyDown = (event) => {
|
|
43014
41857
|
if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
|
|
43015
41858
|
event.preventDefault();
|
|
@@ -43020,7 +41863,7 @@ var SidebarProvider = React104.forwardRef(
|
|
|
43020
41863
|
return () => window.removeEventListener("keydown", handleKeyDown);
|
|
43021
41864
|
}, [toggleSidebar]);
|
|
43022
41865
|
const state = open ? "expanded" : "collapsed";
|
|
43023
|
-
const contextValue =
|
|
41866
|
+
const contextValue = React100.useMemo(
|
|
43024
41867
|
() => ({
|
|
43025
41868
|
state,
|
|
43026
41869
|
open,
|
|
@@ -43032,7 +41875,7 @@ var SidebarProvider = React104.forwardRef(
|
|
|
43032
41875
|
}),
|
|
43033
41876
|
[state, open, setOpen, isMobile, openMobile, setOpenMobile, toggleSidebar]
|
|
43034
41877
|
);
|
|
43035
|
-
return /* @__PURE__ */
|
|
41878
|
+
return /* @__PURE__ */ jsx156(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx156(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ jsx156(
|
|
43036
41879
|
"div",
|
|
43037
41880
|
{
|
|
43038
41881
|
style: {
|
|
@@ -43052,7 +41895,7 @@ var SidebarProvider = React104.forwardRef(
|
|
|
43052
41895
|
}
|
|
43053
41896
|
);
|
|
43054
41897
|
SidebarProvider.displayName = "SidebarProvider";
|
|
43055
|
-
var Sidebar =
|
|
41898
|
+
var Sidebar = React100.forwardRef(
|
|
43056
41899
|
({
|
|
43057
41900
|
side = "left",
|
|
43058
41901
|
variant = "sidebar",
|
|
@@ -43063,7 +41906,7 @@ var Sidebar = React104.forwardRef(
|
|
|
43063
41906
|
}, ref) => {
|
|
43064
41907
|
const { isMobile, state, openMobile, setOpenMobile } = useSidebar();
|
|
43065
41908
|
if (collapsible === "none") {
|
|
43066
|
-
return /* @__PURE__ */
|
|
41909
|
+
return /* @__PURE__ */ jsx156(
|
|
43067
41910
|
"div",
|
|
43068
41911
|
{
|
|
43069
41912
|
className: cn(
|
|
@@ -43077,7 +41920,7 @@ var Sidebar = React104.forwardRef(
|
|
|
43077
41920
|
);
|
|
43078
41921
|
}
|
|
43079
41922
|
if (isMobile) {
|
|
43080
|
-
return /* @__PURE__ */
|
|
41923
|
+
return /* @__PURE__ */ jsx156(Sheet2, { open: openMobile, onOpenChange: setOpenMobile, ...props, children: /* @__PURE__ */ jsxs109(
|
|
43081
41924
|
SheetContent,
|
|
43082
41925
|
{
|
|
43083
41926
|
"data-sidebar": "sidebar",
|
|
@@ -43088,16 +41931,16 @@ var Sidebar = React104.forwardRef(
|
|
|
43088
41931
|
},
|
|
43089
41932
|
side,
|
|
43090
41933
|
children: [
|
|
43091
|
-
/* @__PURE__ */
|
|
43092
|
-
/* @__PURE__ */
|
|
43093
|
-
/* @__PURE__ */
|
|
41934
|
+
/* @__PURE__ */ jsxs109(SheetHeader, { className: "sr-only", children: [
|
|
41935
|
+
/* @__PURE__ */ jsx156(SheetTitle, { children: "Sidebar" }),
|
|
41936
|
+
/* @__PURE__ */ jsx156(SheetDescription, { children: "Displays the mobile sidebar." })
|
|
43094
41937
|
] }),
|
|
43095
|
-
/* @__PURE__ */
|
|
41938
|
+
/* @__PURE__ */ jsx156("div", { className: "flex h-full w-full flex-col", children })
|
|
43096
41939
|
]
|
|
43097
41940
|
}
|
|
43098
41941
|
) });
|
|
43099
41942
|
}
|
|
43100
|
-
return /* @__PURE__ */
|
|
41943
|
+
return /* @__PURE__ */ jsxs109(
|
|
43101
41944
|
"div",
|
|
43102
41945
|
{
|
|
43103
41946
|
ref,
|
|
@@ -43107,7 +41950,7 @@ var Sidebar = React104.forwardRef(
|
|
|
43107
41950
|
"data-variant": variant,
|
|
43108
41951
|
"data-side": side,
|
|
43109
41952
|
children: [
|
|
43110
|
-
/* @__PURE__ */
|
|
41953
|
+
/* @__PURE__ */ jsx156(
|
|
43111
41954
|
"div",
|
|
43112
41955
|
{
|
|
43113
41956
|
className: cn(
|
|
@@ -43118,7 +41961,7 @@ var Sidebar = React104.forwardRef(
|
|
|
43118
41961
|
)
|
|
43119
41962
|
}
|
|
43120
41963
|
),
|
|
43121
|
-
/* @__PURE__ */
|
|
41964
|
+
/* @__PURE__ */ jsx156(
|
|
43122
41965
|
"div",
|
|
43123
41966
|
{
|
|
43124
41967
|
className: cn(
|
|
@@ -43129,7 +41972,7 @@ var Sidebar = React104.forwardRef(
|
|
|
43129
41972
|
className
|
|
43130
41973
|
),
|
|
43131
41974
|
...props,
|
|
43132
|
-
children: /* @__PURE__ */
|
|
41975
|
+
children: /* @__PURE__ */ jsx156(
|
|
43133
41976
|
"div",
|
|
43134
41977
|
{
|
|
43135
41978
|
"data-sidebar": "sidebar",
|
|
@@ -43145,9 +41988,9 @@ var Sidebar = React104.forwardRef(
|
|
|
43145
41988
|
}
|
|
43146
41989
|
);
|
|
43147
41990
|
Sidebar.displayName = "Sidebar";
|
|
43148
|
-
var SidebarTrigger =
|
|
41991
|
+
var SidebarTrigger = React100.forwardRef(({ className, onClick, ...props }, ref) => {
|
|
43149
41992
|
const { toggleSidebar } = useSidebar();
|
|
43150
|
-
return /* @__PURE__ */
|
|
41993
|
+
return /* @__PURE__ */ jsxs109(
|
|
43151
41994
|
Button,
|
|
43152
41995
|
{
|
|
43153
41996
|
ref,
|
|
@@ -43161,16 +42004,16 @@ var SidebarTrigger = React104.forwardRef(({ className, onClick, ...props }, ref)
|
|
|
43161
42004
|
},
|
|
43162
42005
|
...props,
|
|
43163
42006
|
children: [
|
|
43164
|
-
/* @__PURE__ */
|
|
43165
|
-
/* @__PURE__ */
|
|
42007
|
+
/* @__PURE__ */ jsx156(PanelLeft, {}),
|
|
42008
|
+
/* @__PURE__ */ jsx156("span", { className: "sr-only", children: "Toggle Sidebar" })
|
|
43166
42009
|
]
|
|
43167
42010
|
}
|
|
43168
42011
|
);
|
|
43169
42012
|
});
|
|
43170
42013
|
SidebarTrigger.displayName = "SidebarTrigger";
|
|
43171
|
-
var SidebarRail =
|
|
42014
|
+
var SidebarRail = React100.forwardRef(({ className, ...props }, ref) => {
|
|
43172
42015
|
const { toggleSidebar } = useSidebar();
|
|
43173
|
-
return /* @__PURE__ */
|
|
42016
|
+
return /* @__PURE__ */ jsx156(
|
|
43174
42017
|
"button",
|
|
43175
42018
|
{
|
|
43176
42019
|
ref,
|
|
@@ -43193,8 +42036,8 @@ var SidebarRail = React104.forwardRef(({ className, ...props }, ref) => {
|
|
|
43193
42036
|
);
|
|
43194
42037
|
});
|
|
43195
42038
|
SidebarRail.displayName = "SidebarRail";
|
|
43196
|
-
var SidebarInset =
|
|
43197
|
-
return /* @__PURE__ */
|
|
42039
|
+
var SidebarInset = React100.forwardRef(({ className, ...props }, ref) => {
|
|
42040
|
+
return /* @__PURE__ */ jsx156(
|
|
43198
42041
|
"main",
|
|
43199
42042
|
{
|
|
43200
42043
|
ref,
|
|
@@ -43208,8 +42051,8 @@ var SidebarInset = React104.forwardRef(({ className, ...props }, ref) => {
|
|
|
43208
42051
|
);
|
|
43209
42052
|
});
|
|
43210
42053
|
SidebarInset.displayName = "SidebarInset";
|
|
43211
|
-
var SidebarInput =
|
|
43212
|
-
return /* @__PURE__ */
|
|
42054
|
+
var SidebarInput = React100.forwardRef(({ className, ...props }, ref) => {
|
|
42055
|
+
return /* @__PURE__ */ jsx156(
|
|
43213
42056
|
Input,
|
|
43214
42057
|
{
|
|
43215
42058
|
ref,
|
|
@@ -43223,8 +42066,8 @@ var SidebarInput = React104.forwardRef(({ className, ...props }, ref) => {
|
|
|
43223
42066
|
);
|
|
43224
42067
|
});
|
|
43225
42068
|
SidebarInput.displayName = "SidebarInput";
|
|
43226
|
-
var SidebarHeader =
|
|
43227
|
-
return /* @__PURE__ */
|
|
42069
|
+
var SidebarHeader = React100.forwardRef(({ className, ...props }, ref) => {
|
|
42070
|
+
return /* @__PURE__ */ jsx156(
|
|
43228
42071
|
"div",
|
|
43229
42072
|
{
|
|
43230
42073
|
ref,
|
|
@@ -43235,8 +42078,8 @@ var SidebarHeader = React104.forwardRef(({ className, ...props }, ref) => {
|
|
|
43235
42078
|
);
|
|
43236
42079
|
});
|
|
43237
42080
|
SidebarHeader.displayName = "SidebarHeader";
|
|
43238
|
-
var SidebarFooter =
|
|
43239
|
-
return /* @__PURE__ */
|
|
42081
|
+
var SidebarFooter = React100.forwardRef(({ className, ...props }, ref) => {
|
|
42082
|
+
return /* @__PURE__ */ jsx156(
|
|
43240
42083
|
"div",
|
|
43241
42084
|
{
|
|
43242
42085
|
ref,
|
|
@@ -43247,8 +42090,8 @@ var SidebarFooter = React104.forwardRef(({ className, ...props }, ref) => {
|
|
|
43247
42090
|
);
|
|
43248
42091
|
});
|
|
43249
42092
|
SidebarFooter.displayName = "SidebarFooter";
|
|
43250
|
-
var SidebarSeparator =
|
|
43251
|
-
return /* @__PURE__ */
|
|
42093
|
+
var SidebarSeparator = React100.forwardRef(({ className, ...props }, ref) => {
|
|
42094
|
+
return /* @__PURE__ */ jsx156(
|
|
43252
42095
|
Separator2,
|
|
43253
42096
|
{
|
|
43254
42097
|
ref,
|
|
@@ -43259,8 +42102,8 @@ var SidebarSeparator = React104.forwardRef(({ className, ...props }, ref) => {
|
|
|
43259
42102
|
);
|
|
43260
42103
|
});
|
|
43261
42104
|
SidebarSeparator.displayName = "SidebarSeparator";
|
|
43262
|
-
var SidebarContent =
|
|
43263
|
-
return /* @__PURE__ */
|
|
42105
|
+
var SidebarContent = React100.forwardRef(({ className, ...props }, ref) => {
|
|
42106
|
+
return /* @__PURE__ */ jsx156(
|
|
43264
42107
|
"div",
|
|
43265
42108
|
{
|
|
43266
42109
|
ref,
|
|
@@ -43274,8 +42117,8 @@ var SidebarContent = React104.forwardRef(({ className, ...props }, ref) => {
|
|
|
43274
42117
|
);
|
|
43275
42118
|
});
|
|
43276
42119
|
SidebarContent.displayName = "SidebarContent";
|
|
43277
|
-
var SidebarGroup =
|
|
43278
|
-
return /* @__PURE__ */
|
|
42120
|
+
var SidebarGroup = React100.forwardRef(({ className, ...props }, ref) => {
|
|
42121
|
+
return /* @__PURE__ */ jsx156(
|
|
43279
42122
|
"div",
|
|
43280
42123
|
{
|
|
43281
42124
|
ref,
|
|
@@ -43286,9 +42129,9 @@ var SidebarGroup = React104.forwardRef(({ className, ...props }, ref) => {
|
|
|
43286
42129
|
);
|
|
43287
42130
|
});
|
|
43288
42131
|
SidebarGroup.displayName = "SidebarGroup";
|
|
43289
|
-
var SidebarGroupLabel =
|
|
42132
|
+
var SidebarGroupLabel = React100.forwardRef(({ className, asChild = false, ...props }, ref) => {
|
|
43290
42133
|
const Comp = asChild ? Slot6 : "div";
|
|
43291
|
-
return /* @__PURE__ */
|
|
42134
|
+
return /* @__PURE__ */ jsx156(
|
|
43292
42135
|
Comp,
|
|
43293
42136
|
{
|
|
43294
42137
|
ref,
|
|
@@ -43303,9 +42146,9 @@ var SidebarGroupLabel = React104.forwardRef(({ className, asChild = false, ...pr
|
|
|
43303
42146
|
);
|
|
43304
42147
|
});
|
|
43305
42148
|
SidebarGroupLabel.displayName = "SidebarGroupLabel";
|
|
43306
|
-
var SidebarGroupAction =
|
|
42149
|
+
var SidebarGroupAction = React100.forwardRef(({ className, asChild = false, ...props }, ref) => {
|
|
43307
42150
|
const Comp = asChild ? Slot6 : "button";
|
|
43308
|
-
return /* @__PURE__ */
|
|
42151
|
+
return /* @__PURE__ */ jsx156(
|
|
43309
42152
|
Comp,
|
|
43310
42153
|
{
|
|
43311
42154
|
ref,
|
|
@@ -43322,7 +42165,7 @@ var SidebarGroupAction = React104.forwardRef(({ className, asChild = false, ...p
|
|
|
43322
42165
|
);
|
|
43323
42166
|
});
|
|
43324
42167
|
SidebarGroupAction.displayName = "SidebarGroupAction";
|
|
43325
|
-
var SidebarGroupContent =
|
|
42168
|
+
var SidebarGroupContent = React100.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx156(
|
|
43326
42169
|
"div",
|
|
43327
42170
|
{
|
|
43328
42171
|
ref,
|
|
@@ -43332,7 +42175,7 @@ var SidebarGroupContent = React104.forwardRef(({ className, ...props }, ref) =>
|
|
|
43332
42175
|
}
|
|
43333
42176
|
));
|
|
43334
42177
|
SidebarGroupContent.displayName = "SidebarGroupContent";
|
|
43335
|
-
var SidebarMenu =
|
|
42178
|
+
var SidebarMenu = React100.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx156(
|
|
43336
42179
|
"ul",
|
|
43337
42180
|
{
|
|
43338
42181
|
ref,
|
|
@@ -43342,7 +42185,7 @@ var SidebarMenu = React104.forwardRef(({ className, ...props }, ref) => /* @__PU
|
|
|
43342
42185
|
}
|
|
43343
42186
|
));
|
|
43344
42187
|
SidebarMenu.displayName = "SidebarMenu";
|
|
43345
|
-
var SidebarMenuItem =
|
|
42188
|
+
var SidebarMenuItem = React100.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx156(
|
|
43346
42189
|
"li",
|
|
43347
42190
|
{
|
|
43348
42191
|
ref,
|
|
@@ -43372,7 +42215,7 @@ var sidebarMenuButtonVariants = cva13(
|
|
|
43372
42215
|
}
|
|
43373
42216
|
}
|
|
43374
42217
|
);
|
|
43375
|
-
var SidebarMenuButton =
|
|
42218
|
+
var SidebarMenuButton = React100.forwardRef(
|
|
43376
42219
|
({
|
|
43377
42220
|
asChild = false,
|
|
43378
42221
|
isActive = false,
|
|
@@ -43384,7 +42227,7 @@ var SidebarMenuButton = React104.forwardRef(
|
|
|
43384
42227
|
}, ref) => {
|
|
43385
42228
|
const Comp = asChild ? Slot6 : "button";
|
|
43386
42229
|
const { isMobile, state } = useSidebar();
|
|
43387
|
-
const button = /* @__PURE__ */
|
|
42230
|
+
const button = /* @__PURE__ */ jsx156(
|
|
43388
42231
|
Comp,
|
|
43389
42232
|
{
|
|
43390
42233
|
ref,
|
|
@@ -43403,9 +42246,9 @@ var SidebarMenuButton = React104.forwardRef(
|
|
|
43403
42246
|
children: tooltip
|
|
43404
42247
|
};
|
|
43405
42248
|
}
|
|
43406
|
-
return /* @__PURE__ */
|
|
43407
|
-
/* @__PURE__ */
|
|
43408
|
-
/* @__PURE__ */
|
|
42249
|
+
return /* @__PURE__ */ jsxs109(Tooltip, { children: [
|
|
42250
|
+
/* @__PURE__ */ jsx156(TooltipTrigger, { asChild: true, children: button }),
|
|
42251
|
+
/* @__PURE__ */ jsx156(
|
|
43409
42252
|
TooltipContent,
|
|
43410
42253
|
{
|
|
43411
42254
|
side: "right",
|
|
@@ -43418,9 +42261,9 @@ var SidebarMenuButton = React104.forwardRef(
|
|
|
43418
42261
|
}
|
|
43419
42262
|
);
|
|
43420
42263
|
SidebarMenuButton.displayName = "SidebarMenuButton";
|
|
43421
|
-
var SidebarMenuAction =
|
|
42264
|
+
var SidebarMenuAction = React100.forwardRef(({ className, asChild = false, showOnHover = false, ...props }, ref) => {
|
|
43422
42265
|
const Comp = asChild ? Slot6 : "button";
|
|
43423
|
-
return /* @__PURE__ */
|
|
42266
|
+
return /* @__PURE__ */ jsx156(
|
|
43424
42267
|
Comp,
|
|
43425
42268
|
{
|
|
43426
42269
|
ref,
|
|
@@ -43441,7 +42284,7 @@ var SidebarMenuAction = React104.forwardRef(({ className, asChild = false, showO
|
|
|
43441
42284
|
);
|
|
43442
42285
|
});
|
|
43443
42286
|
SidebarMenuAction.displayName = "SidebarMenuAction";
|
|
43444
|
-
var SidebarMenuBadge =
|
|
42287
|
+
var SidebarMenuBadge = React100.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx156(
|
|
43445
42288
|
"div",
|
|
43446
42289
|
{
|
|
43447
42290
|
ref,
|
|
@@ -43459,11 +42302,11 @@ var SidebarMenuBadge = React104.forwardRef(({ className, ...props }, ref) => /*
|
|
|
43459
42302
|
}
|
|
43460
42303
|
));
|
|
43461
42304
|
SidebarMenuBadge.displayName = "SidebarMenuBadge";
|
|
43462
|
-
var SidebarMenuSkeleton =
|
|
43463
|
-
const width =
|
|
42305
|
+
var SidebarMenuSkeleton = React100.forwardRef(({ className, showIcon = false, ...props }, ref) => {
|
|
42306
|
+
const width = React100.useMemo(() => {
|
|
43464
42307
|
return `${Math.floor(Math.random() * 40) + 50}%`;
|
|
43465
42308
|
}, []);
|
|
43466
|
-
return /* @__PURE__ */
|
|
42309
|
+
return /* @__PURE__ */ jsxs109(
|
|
43467
42310
|
"div",
|
|
43468
42311
|
{
|
|
43469
42312
|
ref,
|
|
@@ -43471,14 +42314,14 @@ var SidebarMenuSkeleton = React104.forwardRef(({ className, showIcon = false, ..
|
|
|
43471
42314
|
className: cn("flex h-8 items-center gap-2 rounded-md px-2", className),
|
|
43472
42315
|
...props,
|
|
43473
42316
|
children: [
|
|
43474
|
-
showIcon && /* @__PURE__ */
|
|
42317
|
+
showIcon && /* @__PURE__ */ jsx156(
|
|
43475
42318
|
Skeleton,
|
|
43476
42319
|
{
|
|
43477
42320
|
className: "size-4 rounded-md",
|
|
43478
42321
|
"data-sidebar": "menu-skeleton-icon"
|
|
43479
42322
|
}
|
|
43480
42323
|
),
|
|
43481
|
-
/* @__PURE__ */
|
|
42324
|
+
/* @__PURE__ */ jsx156(
|
|
43482
42325
|
Skeleton,
|
|
43483
42326
|
{
|
|
43484
42327
|
className: "h-4 max-w-[--skeleton-width] flex-1",
|
|
@@ -43493,7 +42336,7 @@ var SidebarMenuSkeleton = React104.forwardRef(({ className, showIcon = false, ..
|
|
|
43493
42336
|
);
|
|
43494
42337
|
});
|
|
43495
42338
|
SidebarMenuSkeleton.displayName = "SidebarMenuSkeleton";
|
|
43496
|
-
var SidebarMenuSub =
|
|
42339
|
+
var SidebarMenuSub = React100.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx156(
|
|
43497
42340
|
"ul",
|
|
43498
42341
|
{
|
|
43499
42342
|
ref,
|
|
@@ -43507,11 +42350,11 @@ var SidebarMenuSub = React104.forwardRef(({ className, ...props }, ref) => /* @_
|
|
|
43507
42350
|
}
|
|
43508
42351
|
));
|
|
43509
42352
|
SidebarMenuSub.displayName = "SidebarMenuSub";
|
|
43510
|
-
var SidebarMenuSubItem =
|
|
42353
|
+
var SidebarMenuSubItem = React100.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx156("li", { ref, ...props }));
|
|
43511
42354
|
SidebarMenuSubItem.displayName = "SidebarMenuSubItem";
|
|
43512
|
-
var SidebarMenuSubButton =
|
|
42355
|
+
var SidebarMenuSubButton = React100.forwardRef(({ asChild = false, size = "md", isActive, className, ...props }, ref) => {
|
|
43513
42356
|
const Comp = asChild ? Slot6 : "a";
|
|
43514
|
-
return /* @__PURE__ */
|
|
42357
|
+
return /* @__PURE__ */ jsx156(
|
|
43515
42358
|
Comp,
|
|
43516
42359
|
{
|
|
43517
42360
|
ref,
|
|
@@ -43535,20 +42378,20 @@ SidebarMenuSubButton.displayName = "SidebarMenuSubButton";
|
|
|
43535
42378
|
// src/components/ui/sonner.tsx
|
|
43536
42379
|
import { useTheme } from "next-themes";
|
|
43537
42380
|
import { Toaster as Sonner } from "sonner";
|
|
43538
|
-
import { jsx as
|
|
42381
|
+
import { jsx as jsx157 } from "react/jsx-runtime";
|
|
43539
42382
|
var Toaster = ({ ...props }) => {
|
|
43540
42383
|
const { theme = "system" } = useTheme();
|
|
43541
|
-
return /* @__PURE__ */
|
|
42384
|
+
return /* @__PURE__ */ jsx157(
|
|
43542
42385
|
Sonner,
|
|
43543
42386
|
{
|
|
43544
42387
|
theme,
|
|
43545
42388
|
className: "toaster group",
|
|
43546
42389
|
icons: {
|
|
43547
|
-
success: /* @__PURE__ */
|
|
43548
|
-
info: /* @__PURE__ */
|
|
43549
|
-
warning: /* @__PURE__ */
|
|
43550
|
-
error: /* @__PURE__ */
|
|
43551
|
-
loading: /* @__PURE__ */
|
|
42390
|
+
success: /* @__PURE__ */ jsx157(CircleCheck, { className: "h-4 w-4" }),
|
|
42391
|
+
info: /* @__PURE__ */ jsx157(Info, { className: "h-4 w-4" }),
|
|
42392
|
+
warning: /* @__PURE__ */ jsx157(TriangleAlert, { className: "h-4 w-4" }),
|
|
42393
|
+
error: /* @__PURE__ */ jsx157(OctagonX, { className: "h-4 w-4" }),
|
|
42394
|
+
loading: /* @__PURE__ */ jsx157(LoaderCircle, { className: "h-4 w-4 animate-spin" })
|
|
43552
42395
|
},
|
|
43553
42396
|
toastOptions: {
|
|
43554
42397
|
classNames: {
|
|
@@ -43564,26 +42407,26 @@ var Toaster = ({ ...props }) => {
|
|
|
43564
42407
|
};
|
|
43565
42408
|
|
|
43566
42409
|
// src/components/ui/toggle-group.tsx
|
|
43567
|
-
import * as
|
|
42410
|
+
import * as React101 from "react";
|
|
43568
42411
|
import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group";
|
|
43569
|
-
import { jsx as
|
|
43570
|
-
var ToggleGroupContext =
|
|
42412
|
+
import { jsx as jsx158 } from "react/jsx-runtime";
|
|
42413
|
+
var ToggleGroupContext = React101.createContext({
|
|
43571
42414
|
size: "default",
|
|
43572
42415
|
variant: "default"
|
|
43573
42416
|
});
|
|
43574
|
-
var ToggleGroup =
|
|
42417
|
+
var ToggleGroup = React101.forwardRef(({ className, variant, size, children, ...props }, ref) => /* @__PURE__ */ jsx158(
|
|
43575
42418
|
ToggleGroupPrimitive.Root,
|
|
43576
42419
|
{
|
|
43577
42420
|
ref,
|
|
43578
42421
|
className: cn("flex items-center justify-center gap-1", className),
|
|
43579
42422
|
...props,
|
|
43580
|
-
children: /* @__PURE__ */
|
|
42423
|
+
children: /* @__PURE__ */ jsx158(ToggleGroupContext.Provider, { value: { variant, size }, children })
|
|
43581
42424
|
}
|
|
43582
42425
|
));
|
|
43583
42426
|
ToggleGroup.displayName = ToggleGroupPrimitive.Root.displayName;
|
|
43584
|
-
var ToggleGroupItem =
|
|
43585
|
-
const context =
|
|
43586
|
-
return /* @__PURE__ */
|
|
42427
|
+
var ToggleGroupItem = React101.forwardRef(({ className, children, variant, size, ...props }, ref) => {
|
|
42428
|
+
const context = React101.useContext(ToggleGroupContext);
|
|
42429
|
+
return /* @__PURE__ */ jsx158(
|
|
43587
42430
|
ToggleGroupPrimitive.Item,
|
|
43588
42431
|
{
|
|
43589
42432
|
ref,
|
|
@@ -43602,7 +42445,7 @@ var ToggleGroupItem = React105.forwardRef(({ className, children, variant, size,
|
|
|
43602
42445
|
ToggleGroupItem.displayName = ToggleGroupPrimitive.Item.displayName;
|
|
43603
42446
|
|
|
43604
42447
|
// src/render/PXEngineRenderer.tsx
|
|
43605
|
-
import { jsx as
|
|
42448
|
+
import { jsx as jsx159, jsxs as jsxs110 } from "react/jsx-runtime";
|
|
43606
42449
|
var CONTEXT_DEPENDENT_COMPONENTS = /* @__PURE__ */ new Set([
|
|
43607
42450
|
// Form components - require FormField + FormItem context
|
|
43608
42451
|
"FormLabel",
|
|
@@ -43707,24 +42550,24 @@ var REGISTERED_COMPONENTS = /* @__PURE__ */ new Set([
|
|
|
43707
42550
|
]);
|
|
43708
42551
|
var renderContextDependentError = (componentName, normalizedName, key) => {
|
|
43709
42552
|
const suggestion = COMPONENT_SUGGESTIONS[normalizedName] || `${componentName}Atom (if available)`;
|
|
43710
|
-
return /* @__PURE__ */
|
|
42553
|
+
return /* @__PURE__ */ jsxs110(
|
|
43711
42554
|
"div",
|
|
43712
42555
|
{
|
|
43713
42556
|
className: "p-4 border-2 border-amber-500/50 rounded-lg bg-amber-50/80 space-y-2 my-2",
|
|
43714
42557
|
children: [
|
|
43715
|
-
/* @__PURE__ */
|
|
43716
|
-
/* @__PURE__ */
|
|
43717
|
-
/* @__PURE__ */
|
|
43718
|
-
/* @__PURE__ */
|
|
42558
|
+
/* @__PURE__ */ jsxs110("div", { className: "flex items-start gap-2", children: [
|
|
42559
|
+
/* @__PURE__ */ jsx159("span", { className: "text-amber-600 font-bold text-lg", children: "\u26A0\uFE0F" }),
|
|
42560
|
+
/* @__PURE__ */ jsxs110("div", { className: "flex-1", children: [
|
|
42561
|
+
/* @__PURE__ */ jsxs110("p", { className: "text-sm font-semibold text-amber-900", children: [
|
|
43719
42562
|
"Invalid Component: ",
|
|
43720
42563
|
componentName
|
|
43721
42564
|
] }),
|
|
43722
|
-
/* @__PURE__ */
|
|
42565
|
+
/* @__PURE__ */ jsx159("p", { className: "text-xs text-amber-700 mt-1", children: "This component requires React Context and cannot be rendered directly in schemas." })
|
|
43723
42566
|
] })
|
|
43724
42567
|
] }),
|
|
43725
|
-
/* @__PURE__ */
|
|
43726
|
-
/* @__PURE__ */
|
|
43727
|
-
/* @__PURE__ */
|
|
42568
|
+
/* @__PURE__ */ jsxs110("div", { className: "bg-white/60 p-3 rounded border border-amber-200", children: [
|
|
42569
|
+
/* @__PURE__ */ jsx159("p", { className: "text-xs font-semibold text-gray-700 mb-1.5", children: "\u2713 Use instead:" }),
|
|
42570
|
+
/* @__PURE__ */ jsx159("code", { className: "text-xs text-blue-700 bg-blue-50 px-2 py-1 rounded", children: suggestion })
|
|
43728
42571
|
] })
|
|
43729
42572
|
]
|
|
43730
42573
|
},
|
|
@@ -43802,12 +42645,12 @@ var PXEngineRenderer = ({
|
|
|
43802
42645
|
const root = schema.root || schema;
|
|
43803
42646
|
const renderRecursive = (component, index) => {
|
|
43804
42647
|
if (Array.isArray(component)) {
|
|
43805
|
-
return /* @__PURE__ */
|
|
42648
|
+
return /* @__PURE__ */ jsx159(React102.Fragment, { children: component.map((child, idx) => renderRecursive(child, idx)) }, index !== void 0 ? `array-${index}` : "array-root");
|
|
43806
42649
|
}
|
|
43807
42650
|
if (typeof component === "string" || typeof component === "number") {
|
|
43808
42651
|
return component;
|
|
43809
42652
|
}
|
|
43810
|
-
if (
|
|
42653
|
+
if (React102.isValidElement(component)) {
|
|
43811
42654
|
return component;
|
|
43812
42655
|
}
|
|
43813
42656
|
if (!component || typeof component !== "object") return null;
|
|
@@ -43886,7 +42729,7 @@ var PXEngineRenderer = ({
|
|
|
43886
42729
|
const isAtomWithRenderProp = ATOMS_WITH_RENDER.has(atomName);
|
|
43887
42730
|
const finalStyle = { ...dynamicStyle, ...finalProps.style || {} };
|
|
43888
42731
|
if (isAtomWithRenderProp) {
|
|
43889
|
-
return /* @__PURE__ */
|
|
42732
|
+
return /* @__PURE__ */ jsx159(
|
|
43890
42733
|
TargetComponent,
|
|
43891
42734
|
{
|
|
43892
42735
|
...finalProps,
|
|
@@ -43898,7 +42741,7 @@ var PXEngineRenderer = ({
|
|
|
43898
42741
|
uniqueKey
|
|
43899
42742
|
);
|
|
43900
42743
|
} else {
|
|
43901
|
-
return /* @__PURE__ */
|
|
42744
|
+
return /* @__PURE__ */ jsx159(
|
|
43902
42745
|
TargetComponent,
|
|
43903
42746
|
{
|
|
43904
42747
|
...finalProps,
|
|
@@ -43910,7 +42753,7 @@ var PXEngineRenderer = ({
|
|
|
43910
42753
|
);
|
|
43911
42754
|
}
|
|
43912
42755
|
};
|
|
43913
|
-
return /* @__PURE__ */
|
|
42756
|
+
return /* @__PURE__ */ jsx159("div", { className: "px-engine-root relative w-full h-full", children: renderRecursive(root) });
|
|
43914
42757
|
};
|
|
43915
42758
|
export {
|
|
43916
42759
|
Accordion,
|
|
@@ -43919,8 +42762,6 @@ export {
|
|
|
43919
42762
|
AccordionItem,
|
|
43920
42763
|
AccordionTrigger,
|
|
43921
42764
|
ActionButton,
|
|
43922
|
-
AgentCard,
|
|
43923
|
-
AgentDataTable,
|
|
43924
42765
|
Alert,
|
|
43925
42766
|
AlertAtom,
|
|
43926
42767
|
AlertDescription,
|
|
@@ -44079,7 +42920,6 @@ export {
|
|
|
44079
42920
|
InputOTPGroup,
|
|
44080
42921
|
InputOTPSeparator,
|
|
44081
42922
|
InputOTPSlot,
|
|
44082
|
-
InstructionPreview,
|
|
44083
42923
|
KbdAtom,
|
|
44084
42924
|
KeywordBundlesDisplay,
|
|
44085
42925
|
KeywordBundlesEdit,
|
|
@@ -44097,9 +42937,6 @@ export {
|
|
|
44097
42937
|
MenubarSeparator,
|
|
44098
42938
|
MenubarShortcut,
|
|
44099
42939
|
MenubarTrigger,
|
|
44100
|
-
MultiAgentCard,
|
|
44101
|
-
MultiAgentPlan,
|
|
44102
|
-
MultiAgentUISelector,
|
|
44103
42940
|
NavigationMenu,
|
|
44104
42941
|
NavigationMenuContent,
|
|
44105
42942
|
NavigationMenuItem,
|
|
@@ -44167,7 +43004,6 @@ export {
|
|
|
44167
43004
|
SocialPostCard,
|
|
44168
43005
|
Spinner,
|
|
44169
43006
|
SpinnerAtom,
|
|
44170
|
-
StageIndicator,
|
|
44171
43007
|
StatsGrid,
|
|
44172
43008
|
StepWizard,
|
|
44173
43009
|
Switch,
|
|
@@ -44191,16 +43027,13 @@ export {
|
|
|
44191
43027
|
TextareaAtom,
|
|
44192
43028
|
TimelineAtom,
|
|
44193
43029
|
ToggleAtom,
|
|
44194
|
-
ToolListCard,
|
|
44195
43030
|
Tooltip,
|
|
44196
43031
|
TooltipAtom,
|
|
44197
43032
|
TooltipContent,
|
|
44198
43033
|
TooltipProvider,
|
|
44199
43034
|
TooltipTrigger,
|
|
44200
43035
|
TopPostsGrid,
|
|
44201
|
-
UIComponentSelector,
|
|
44202
43036
|
VideoAtom,
|
|
44203
|
-
WorkflowVisualizer,
|
|
44204
43037
|
cn,
|
|
44205
43038
|
defaultFetchSelections,
|
|
44206
43039
|
defaultPersistSelection,
|