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.mjs CHANGED
@@ -5,7 +5,7 @@ var __export = (target, all) => {
5
5
  };
6
6
 
7
7
  // src/render/PXEngineRenderer.tsx
8
- import React106 from "react";
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: remainingStyle
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
- return /* @__PURE__ */ jsxs7(Avatar, { className: cn("h-10 w-10", className), style, children: [
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(AvatarFallback, { className: "bg-purple50 text-purple600 font-bold uppercase", children: fallback })
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
- return /* @__PURE__ */ jsx27("div", { className: cn("w-full py-2", className), style, "data-px-styled": hasPxVars ? "" : void 0, children: /* @__PURE__ */ jsx27(Progress, { value, className: "h-2 bg-gray-100" }) });
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, { style: { backgroundColor: headerBgColor }, children: /* @__PURE__ */ jsx35(TableRow, { children: safeHeaders.map((header, i) => /* @__PURE__ */ jsx35(
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 bg-background/80 backdrop-blur-xl rounded-[28px] border border-border/50 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",
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
- return /* @__PURE__ */ jsx87("div", { className: cn("flex items-center gap-1", className), style, children: Array.from({ length: max2 }, (_, i) => {
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: "bg-[var(--card-background,theme(colors.white))] dark:bg-[var(--card-background,theme(colors.zinc.900))] border-[var(--border-color,theme(colors.gray.200))] backdrop-blur-sm shadow-sm hover:shadow-md transition-all duration-300 rounded-[24px] overflow-hidden",
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(Icon3, { className: "w-4 h-4 text-[var(--primary-color,theme(colors.purple.500))]" })
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 text-[var(--foreground)] tracking-tight leading-tight",
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("div", { className: "w-12 h-12 bg-purple-100 rounded-2xl flex items-center justify-center mb-4 text-purple-600", children: /* @__PURE__ */ jsx101(Upload, { className: "w-6 h-6" }) }),
34541
- /* @__PURE__ */ jsx101("h4", { className: "font-bold text-gray-900 mb-1", children: title }),
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 jsx160 } from "react/jsx-runtime";
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__ */ jsx160(
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__ */ jsx160(
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__ */ jsx160(
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 jsx161 } from "react/jsx-runtime";
41135
+ import { jsx as jsx151 } from "react/jsx-runtime";
42293
41136
  function Empty({ className, ...props }) {
42294
- return /* @__PURE__ */ jsx161(
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__ */ jsx161(
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__ */ jsx161(
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__ */ jsx161(
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__ */ jsx161(
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__ */ jsx161(
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 jsx162, jsxs as jsxs118 } from "react/jsx-runtime";
41231
+ import { jsx as jsx152, jsxs as jsxs108 } from "react/jsx-runtime";
42389
41232
  function FieldSet({ className, ...props }) {
42390
- return /* @__PURE__ */ jsx162(
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__ */ jsx162(
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__ */ jsx162(
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__ */ jsx162(
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__ */ jsx162(
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__ */ jsx162(
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__ */ jsx162(
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__ */ jsx162(
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__ */ jsxs118(
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__ */ jsx162(Separator2, { className: "absolute inset-0 top-1/2" }),
42551
- children && /* @__PURE__ */ jsx162(
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__ */ jsx162("ul", { className: "ml-4 flex list-disc flex-col gap-1", children: errors.map(
42580
- (error, index) => error?.message && /* @__PURE__ */ jsx162("li", { children: error.message }, index)
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__ */ jsx162(
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 jsx163 } from "react/jsx-runtime";
41443
+ import { jsx as jsx153 } from "react/jsx-runtime";
42601
41444
  function InputGroup({ className, ...props }) {
42602
- return /* @__PURE__ */ jsx163(
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__ */ jsx163(
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__ */ jsx163(
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__ */ jsx163(
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__ */ jsx163(
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__ */ jsx163(
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 jsx164 } from "react/jsx-runtime";
41588
+ import { jsx as jsx154 } from "react/jsx-runtime";
42746
41589
  function ItemGroup({ className, ...props }) {
42747
- return /* @__PURE__ */ jsx164(
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__ */ jsx164(
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__ */ jsx164(
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__ */ jsx164(
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__ */ jsx164(
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__ */ jsx164(
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__ */ jsx164(
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__ */ jsx164(
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__ */ jsx164(
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__ */ jsx164(
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 jsx165 } from "react/jsx-runtime";
41761
+ import { jsx as jsx155 } from "react/jsx-runtime";
42919
41762
  function Kbd({ className, ...props }) {
42920
- return /* @__PURE__ */ jsx165(
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__ */ jsx165(
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 React104 from "react";
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 React103 from "react";
41794
+ import * as React99 from "react";
42952
41795
  var MOBILE_BREAKPOINT = 768;
42953
41796
  function useIsMobile() {
42954
- const [isMobile, setIsMobile] = React103.useState(void 0);
42955
- React103.useEffect(() => {
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 jsx166, jsxs as jsxs119 } from "react/jsx-runtime";
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 = React104.createContext(null);
41818
+ var SidebarContext = React100.createContext(null);
42976
41819
  function useSidebar() {
42977
- const context = React104.useContext(SidebarContext);
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 = React104.forwardRef(
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] = React104.useState(false);
42995
- const [_open, _setOpen] = React104.useState(defaultOpen);
41837
+ const [openMobile, setOpenMobile] = React100.useState(false);
41838
+ const [_open, _setOpen] = React100.useState(defaultOpen);
42996
41839
  const open = openProp ?? _open;
42997
- const setOpen = React104.useCallback(
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 = React104.useCallback(() => {
41852
+ const toggleSidebar = React100.useCallback(() => {
43010
41853
  return isMobile ? setOpenMobile((open2) => !open2) : setOpen((open2) => !open2);
43011
41854
  }, [isMobile, setOpen, setOpenMobile]);
43012
- React104.useEffect(() => {
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 = React104.useMemo(
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__ */ jsx166(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx166(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ jsx166(
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 = React104.forwardRef(
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__ */ jsx166(
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__ */ jsx166(Sheet2, { open: openMobile, onOpenChange: setOpenMobile, ...props, children: /* @__PURE__ */ jsxs119(
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__ */ jsxs119(SheetHeader, { className: "sr-only", children: [
43092
- /* @__PURE__ */ jsx166(SheetTitle, { children: "Sidebar" }),
43093
- /* @__PURE__ */ jsx166(SheetDescription, { children: "Displays the mobile sidebar." })
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__ */ jsx166("div", { className: "flex h-full w-full flex-col", children })
41938
+ /* @__PURE__ */ jsx156("div", { className: "flex h-full w-full flex-col", children })
43096
41939
  ]
43097
41940
  }
43098
41941
  ) });
43099
41942
  }
43100
- return /* @__PURE__ */ jsxs119(
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__ */ jsx166(
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__ */ jsx166(
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__ */ jsx166(
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 = React104.forwardRef(({ className, onClick, ...props }, ref) => {
41991
+ var SidebarTrigger = React100.forwardRef(({ className, onClick, ...props }, ref) => {
43149
41992
  const { toggleSidebar } = useSidebar();
43150
- return /* @__PURE__ */ jsxs119(
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__ */ jsx166(PanelLeft, {}),
43165
- /* @__PURE__ */ jsx166("span", { className: "sr-only", children: "Toggle Sidebar" })
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 = React104.forwardRef(({ className, ...props }, ref) => {
42014
+ var SidebarRail = React100.forwardRef(({ className, ...props }, ref) => {
43172
42015
  const { toggleSidebar } = useSidebar();
43173
- return /* @__PURE__ */ jsx166(
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 = React104.forwardRef(({ className, ...props }, ref) => {
43197
- return /* @__PURE__ */ jsx166(
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 = React104.forwardRef(({ className, ...props }, ref) => {
43212
- return /* @__PURE__ */ jsx166(
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 = React104.forwardRef(({ className, ...props }, ref) => {
43227
- return /* @__PURE__ */ jsx166(
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 = React104.forwardRef(({ className, ...props }, ref) => {
43239
- return /* @__PURE__ */ jsx166(
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 = React104.forwardRef(({ className, ...props }, ref) => {
43251
- return /* @__PURE__ */ jsx166(
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 = React104.forwardRef(({ className, ...props }, ref) => {
43263
- return /* @__PURE__ */ jsx166(
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 = React104.forwardRef(({ className, ...props }, ref) => {
43278
- return /* @__PURE__ */ jsx166(
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 = React104.forwardRef(({ className, asChild = false, ...props }, ref) => {
42132
+ var SidebarGroupLabel = React100.forwardRef(({ className, asChild = false, ...props }, ref) => {
43290
42133
  const Comp = asChild ? Slot6 : "div";
43291
- return /* @__PURE__ */ jsx166(
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 = React104.forwardRef(({ className, asChild = false, ...props }, ref) => {
42149
+ var SidebarGroupAction = React100.forwardRef(({ className, asChild = false, ...props }, ref) => {
43307
42150
  const Comp = asChild ? Slot6 : "button";
43308
- return /* @__PURE__ */ jsx166(
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 = React104.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx166(
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 = React104.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx166(
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 = React104.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx166(
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 = React104.forwardRef(
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__ */ jsx166(
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__ */ jsxs119(Tooltip, { children: [
43407
- /* @__PURE__ */ jsx166(TooltipTrigger, { asChild: true, children: button }),
43408
- /* @__PURE__ */ jsx166(
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 = React104.forwardRef(({ className, asChild = false, showOnHover = false, ...props }, ref) => {
42264
+ var SidebarMenuAction = React100.forwardRef(({ className, asChild = false, showOnHover = false, ...props }, ref) => {
43422
42265
  const Comp = asChild ? Slot6 : "button";
43423
- return /* @__PURE__ */ jsx166(
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 = React104.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx166(
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 = React104.forwardRef(({ className, showIcon = false, ...props }, ref) => {
43463
- const width = React104.useMemo(() => {
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__ */ jsxs119(
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__ */ jsx166(
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__ */ jsx166(
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 = React104.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx166(
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 = React104.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx166("li", { ref, ...props }));
42353
+ var SidebarMenuSubItem = React100.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx156("li", { ref, ...props }));
43511
42354
  SidebarMenuSubItem.displayName = "SidebarMenuSubItem";
43512
- var SidebarMenuSubButton = React104.forwardRef(({ asChild = false, size = "md", isActive, className, ...props }, ref) => {
42355
+ var SidebarMenuSubButton = React100.forwardRef(({ asChild = false, size = "md", isActive, className, ...props }, ref) => {
43513
42356
  const Comp = asChild ? Slot6 : "a";
43514
- return /* @__PURE__ */ jsx166(
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 jsx167 } from "react/jsx-runtime";
42381
+ import { jsx as jsx157 } from "react/jsx-runtime";
43539
42382
  var Toaster = ({ ...props }) => {
43540
42383
  const { theme = "system" } = useTheme();
43541
- return /* @__PURE__ */ jsx167(
42384
+ return /* @__PURE__ */ jsx157(
43542
42385
  Sonner,
43543
42386
  {
43544
42387
  theme,
43545
42388
  className: "toaster group",
43546
42389
  icons: {
43547
- success: /* @__PURE__ */ jsx167(CircleCheck, { className: "h-4 w-4" }),
43548
- info: /* @__PURE__ */ jsx167(Info, { className: "h-4 w-4" }),
43549
- warning: /* @__PURE__ */ jsx167(TriangleAlert, { className: "h-4 w-4" }),
43550
- error: /* @__PURE__ */ jsx167(OctagonX, { className: "h-4 w-4" }),
43551
- loading: /* @__PURE__ */ jsx167(LoaderCircle, { className: "h-4 w-4 animate-spin" })
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 React105 from "react";
42410
+ import * as React101 from "react";
43568
42411
  import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group";
43569
- import { jsx as jsx168 } from "react/jsx-runtime";
43570
- var ToggleGroupContext = React105.createContext({
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 = React105.forwardRef(({ className, variant, size, children, ...props }, ref) => /* @__PURE__ */ jsx168(
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__ */ jsx168(ToggleGroupContext.Provider, { value: { variant, size }, children })
42423
+ children: /* @__PURE__ */ jsx158(ToggleGroupContext.Provider, { value: { variant, size }, children })
43581
42424
  }
43582
42425
  ));
43583
42426
  ToggleGroup.displayName = ToggleGroupPrimitive.Root.displayName;
43584
- var ToggleGroupItem = React105.forwardRef(({ className, children, variant, size, ...props }, ref) => {
43585
- const context = React105.useContext(ToggleGroupContext);
43586
- return /* @__PURE__ */ jsx168(
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 jsx169, jsxs as jsxs120 } from "react/jsx-runtime";
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__ */ jsxs120(
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__ */ jsxs120("div", { className: "flex items-start gap-2", children: [
43716
- /* @__PURE__ */ jsx169("span", { className: "text-amber-600 font-bold text-lg", children: "\u26A0\uFE0F" }),
43717
- /* @__PURE__ */ jsxs120("div", { className: "flex-1", children: [
43718
- /* @__PURE__ */ jsxs120("p", { className: "text-sm font-semibold text-amber-900", children: [
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__ */ jsx169("p", { className: "text-xs text-amber-700 mt-1", children: "This component requires React Context and cannot be rendered directly in schemas." })
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__ */ jsxs120("div", { className: "bg-white/60 p-3 rounded border border-amber-200", children: [
43726
- /* @__PURE__ */ jsx169("p", { className: "text-xs font-semibold text-gray-700 mb-1.5", children: "\u2713 Use instead:" }),
43727
- /* @__PURE__ */ jsx169("code", { className: "text-xs text-blue-700 bg-blue-50 px-2 py-1 rounded", children: suggestion })
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__ */ jsx169(React106.Fragment, { children: component.map((child, idx) => renderRecursive(child, idx)) }, index !== void 0 ? `array-${index}` : "array-root");
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 (React106.isValidElement(component)) {
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__ */ jsx169(
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__ */ jsx169(
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__ */ jsx169("div", { className: "px-engine-root relative w-full h-full", children: renderRecursive(root) });
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,