pxengine 0.1.19 → 0.1.22

package/dist/index.cjs

@@ -73,6 +73,7 @@ __export(index_exports, {
   ButtonAtom: () => ButtonAtom,
   Calendar: () => Calendar2,
   CalendarAtom: () => CalendarAtom,
+  CampaignConceptCard: () => CampaignConceptCard,
   CampaignSeedCard: () => CampaignSeedCard,
   Card: () => Card,
   CardAtom: () => CardAtom,
@@ -120,6 +121,7 @@ __export(index_exports, {
   CreatorActionHeader: () => CreatorActionHeader,
   CreatorGridCard: () => CreatorGridCard,
   CreatorProfileSummary: () => CreatorProfileSummary,
+  CreatorSearch: () => CreatorSearch,
   DataGrid: () => DataGrid,
   Dialog: () => Dialog,
   DialogAtom: () => DialogAtom,
@@ -292,7 +294,7 @@ __export(index_exports, {
 module.exports = __toCommonJS(index_exports);
 
 // src/render/PXEngineRenderer.tsx
-var import_react64 = __toESM(require("react"), 1);
+var import_react66 = __toESM(require("react"), 1);
 
 // src/atoms/index.ts
 var atoms_exports = {};
@@ -405,7 +407,8 @@ var buttonVariants = (0, import_class_variance_authority.cva)(
         outline: "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
         secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
         ghost: "hover:bg-accent hover:text-accent-foreground",
-        link: "text-primary underline-offset-4 hover:underline"
+        link: "text-primary underline-offset-4 hover:underline",
+        purple: "bg-purpleLight dark:bg-purple200 hover:bg-purpleText1 dark:hover:bg-purple100 text-purpleText2 dark:text-purpleText border border-purpleText1 dark:border-purpleText shadow-none font-medium"
       },
       size: {
         default: "h-10 px-4 py-2",
@@ -25549,7 +25552,8 @@ var badgeVariants = (0, import_class_variance_authority3.cva)(
         default: "border-transparent bg-primary text-primary-foreground hover:bg-primary/80",
         secondary: "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
         destructive: "border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80",
-        outline: "text-foreground"
+        outline: "text-foreground",
+        purple: "bg-purpleLight dark:bg-purple200 hover:bg-purpleText1 dark:hover:bg-purple100 text-purpleText2 dark:text-purpleText border border-purpleText1 dark:border-purpleText"
       }
     },
     defaultVariants: {
@@ -33549,6 +33553,7 @@ __export(molecules_exports, {
   AudienceDemographicsCard: () => AudienceDemographicsCard,
   AudienceMetricCard: () => AudienceMetricCard,
   BrandAffinityGroup: () => BrandAffinityGroup,
+  CampaignConceptCard: () => CampaignConceptCard,
   CampaignSeedCard: () => CampaignSeedCard,
   ContentPreviewGallery: () => ContentPreviewGallery,
   CountrySelectDisplay: () => CountrySelectDisplay,
@@ -33556,6 +33561,7 @@ __export(molecules_exports, {
   CreatorActionHeader: () => CreatorActionHeader,
   CreatorGridCard: () => CreatorGridCard,
   CreatorProfileSummary: () => CreatorProfileSummary,
+  CreatorSearch: () => CreatorSearch,
   DataGrid: () => DataGrid,
   EditableField: () => EditableField,
   EmptyState: () => EmptyState,
@@ -33906,12 +33912,13 @@ var EditableField = import_react54.default.memo(
     onSave,
     onCancel,
     isSaving = false,
-    isChanged = false,
     config = {},
     className,
     renderDisplay,
-    renderEdit
+    renderEdit,
+    ...rest
   }) => {
+    void rest;
     const [localValue, setLocalValue] = (0, import_react54.useState)(value);
     const inputRef = (0, import_react54.useRef)(null);
     (0, import_react54.useEffect)(() => {
@@ -33948,7 +33955,7 @@ var EditableField = import_react54.default.memo(
               onKeyDown: handleKeyDown,
               placeholder: config.placeholder,
               rows: config.rows || 3,
-              className: "min-h-[80px] resize-none"
+              className: "min-h-[80px] resize-none bg-background dark:bg-gray100 border-gray300"
             }
           );
         case "select":
@@ -33977,9 +33984,12 @@ var EditableField = import_react54.default.memo(
             /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
               Slider,
               {
-                defaultValue: [localValue?.min || 0, localValue?.max || 100],
-                max: config.sliderConfig?.max || 100,
+                defaultValue: [
+                  localValue?.min || 0,
+                  localValue?.max || 100
+                ],
                 min: config.sliderConfig?.min || 0,
+                max: config.sliderConfig?.max || 100,
                 step: config.sliderConfig?.step || 1,
                 onValueChange: ([min2, max2]) => setLocalValue({ min: min2, max: max2 })
               }
@@ -33997,7 +34007,8 @@ var EditableField = import_react54.default.memo(
               onKeyDown: handleKeyDown,
               min: config.numberConfig?.min,
               max: config.numberConfig?.max,
-              step: config.numberConfig?.step
+              step: config.numberConfig?.step,
+              className: "bg-background dark:bg-gray100 border-gray300"
             }
           );
         default:
@@ -34009,7 +34020,8 @@ var EditableField = import_react54.default.memo(
               value: localValue || "",
               onChange: (e) => setLocalValue(e.target.value),
               onKeyDown: handleKeyDown,
-              placeholder: config.placeholder
+              placeholder: config.placeholder,
+              className: "bg-background dark:bg-gray100 border-gray300"
             }
           );
       }
@@ -34019,60 +34031,77 @@ var EditableField = import_react54.default.memo(
       if (type === "slider") {
         return config.sliderConfig?.formatValue ? config.sliderConfig.formatValue(value) : `${value?.min} - ${value?.max}`;
       }
-      if (!value) return /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("span", { className: "opacity-0", children: "-" });
+      if (!value) {
+        return /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("span", { className: "opacity-0", children: "-" });
+      }
       return value.toString();
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("div", { className: cn("group flex flex-col gap-1 py-1.5", className), children: [
-      /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("div", { className: "flex items-center justify-between", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(Label, { className: "text-[13px] font-bold text-foreground opacity-80 uppercase tracking-wider", children: label }),
-        isChanged && !isEditingProp && /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
-          "div",
-          {
-            className: "w-2 h-2 rounded-full bg-amber-500 shadow-[0_0_8px_rgba(245,158,11,0.6)]",
-            title: "Unsaved changes"
-          }
-        )
-      ] }),
-      isEditingProp ? /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("div", { className: "flex flex-col gap-3", children: [
-        renderInput(),
-        /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("div", { className: "flex items-center justify-end gap-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
-            Button,
-            {
-              size: "icon",
-              variant: "outline",
-              className: "h-9 w-9 text-destructive border-destructive/20 hover:bg-destructive/10 rounded-xl",
-              onClick: onCancel,
-              disabled: isSaving,
-              children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(X, { className: "h-5 w-5" })
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
-            Button,
+    return /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(
+      "div",
+      {
+        className: cn(
+          "relative z-10 group flex flex-col gap-2 p-3 bg-[#0A0A0A] rounded-md mb-8",
+          className
+        ),
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("div", { className: "flex justify-between items-start mb-2", children: /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("div", { className: "w-full flex justify-between items-center flex-wrap gap-2", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
+              "h4",
+              {
+                className: "px-2 py-1 tracking-widest bg-purple200/50 dark:bg-purple-500/20 text-purpleText dark:text-purple-400 text-[10px] font-bold rounded uppercase",
+                style: { fontFamily: "Noto Sans, sans-serif" },
+                children: label
+              }
+            ),
+            !isEditingProp && /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("span", { className: "inline-flex items-center gap-1 text-[10px] font-medium text-green-600 dark:text-green-500", children: [
+              "Suggested by an Agent",
+              /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
+                Pencil,
+                {
+                  className: "h-3 w-3 hover:text-green-700 cursor-pointer",
+                  onClick: onEdit
+                }
+              )
+            ] })
+          ] }) }),
+          isEditingProp ? /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("div", { className: "flex flex-col gap-3", children: [
+            renderInput(),
+            /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)("div", { className: "flex items-center justify-end gap-2", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
+                Button,
+                {
+                  size: "icon",
+                  variant: "outline",
+                  className: "h-8 w-8 text-destructive border-destructive/20 hover:bg-destructive/10 rounded-lg",
+                  onClick: onCancel,
+                  disabled: isSaving,
+                  children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(X, { className: "h-4 w-4" })
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
+                Button,
+                {
+                  size: "icon",
+                  className: "h-8 w-8 bg-purpleLight text-purpleText2 hover:bg-purpleText1 rounded-lg border border-purpleText1 shadow-none",
+                  onClick: handleSave,
+                  disabled: isSaving,
+                  children: isSaving ? /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(LoaderCircle, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(Check, { className: "h-4 w-4" })
+                }
+              )
+            ] })
+          ] }) : /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
+            "div",
             {
-              size: "icon",
-              className: "h-9 w-9 bg-primary hover:opacity-90 text-primary-foreground rounded-xl shadow-lg shadow-primary/20",
-              onClick: handleSave,
-              disabled: isSaving,
-              children: isSaving ? /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(LoaderCircle, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(Check, { className: "h-5 w-5" })
+              className: cn(
+                "relative flex items-center justify-between rounded-lg px-3 py-2",
+                "text-[14px] text-foreground font-normal leading-relaxed"
+              ),
+              children: /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("div", { className: "flex-1", children: formattedValue() })
             }
           )
-        ] })
-      ] }) : /* @__PURE__ */ (0, import_jsx_runtime94.jsxs)(
-        "div",
-        {
-          className: cn(
-            "relative flex items-center justify-between rounded-xl px-2 py-1.5 transition-all duration-200",
-            "hover:bg-muted cursor-pointer border border-transparent hover:border-border group-hover:shadow-sm"
-          ),
-          onClick: onEdit,
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime94.jsx)("div", { className: "text-[14px] text-foreground font-semibold truncate flex-1 leading-relaxed", children: formattedValue() }),
-            /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(Pencil, { className: "h-4 w-4 text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity" })
-          ]
-        }
-      )
-    ] });
+        ]
+      }
+    );
   }
 );
 EditableField.displayName = "EditableField";
@@ -34130,6 +34159,7 @@ var ActionButton = import_react55.default.memo(
             "relative min-w-[140px] overflow-hidden group transition-all duration-300",
             "bg-[var(--primary-color)] hover:opacity-90 text-white font-bold rounded-full px-5 py-2.5 shadow-[0_4px_14px_0_hsl(var(--primary)/30%)] hover:shadow-[0_6px_20px_0_hsl(var(--primary)/40%)]",
             variant === "outline" && "bg-transparent border-[var(--primary-color)] text-[var(--primary-color)] hover:bg-[var(--primary-color)]/5",
+            variant === "purple" && "bg-gray100 hover:bg-gray200 text-foreground border border-purple100 shadow-none font-semibold px-8 py-3 h-auto",
             isLoading && "opacity-80"
           ),
           children: [
@@ -34182,94 +34212,103 @@ var FormCard = import_react56.default.memo(
     onFieldEdit,
     onFieldSave,
     onFieldCancel,
-    showTimeline = false,
-    // Default to false to remove "bullets"
+    showTimeline = true,
     proceedLabel,
-    countdown,
-    isPaused = false,
-    onPause,
     onProceed,
+    isLatestMessage = true,
     className,
     footer
   }) => {
+    const [showCopyButton, setShowCopyButton] = (0, import_react56.useState)(false);
     const handleCopyAll = () => {
-      const text = fields.map(
-        (f) => `${f.label}: ${typeof data[f.key] === "object" ? JSON.stringify(data[f.key]) : data[f.key]}`
-      ).join("\n");
+      const text = fields.map((field) => {
+        const value = data[field.key];
+        return `${field.label}: ${typeof value === "object" ? JSON.stringify(value) : value}`;
+      }).join("\n");
       navigator.clipboard.writeText(text);
     };
     return /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)(
-      Card,
+      "div",
       {
         className: cn(
-          "w-full rounded-[24px] border border-border bg-card shadow-lg overflow-hidden transition-all duration-300 hover:shadow-xl",
+          "relative w-full rounded-[20px] bg-background dark:bg-gray50 border border-gray400 shadow-lg overflow-hidden mb-6",
           className
         ),
+        onMouseEnter: () => setShowCopyButton(true),
+        onMouseLeave: () => setShowCopyButton(false),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)(CardHeader, { className: "flex flex-row items-center justify-between pb-3 pt-4 px-6 space-y-0", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(CardTitle, { className: "text-lg font-bold text-foreground tracking-tight", children: title }),
+          showCopyButton && /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
+            "button",
+            {
+              onClick: handleCopyAll,
+              title: "Copy all details",
+              className: "absolute top-4 right-4 p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-gray200 text-gray-400 hover:text-gray-600 dark:hover:text-gray300 transition-all active:scale-95 z-10",
+              children: /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(Copy, { className: "h-4 w-4" })
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)("div", { className: "p-6 relative", children: [
             /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
-              "button",
+              "h3",
               {
-                onClick: handleCopyAll,
-                className: "p-1.5 rounded-xl hover:bg-foreground/5 text-foreground/40 hover:text-foreground/60 transition-all active:scale-95",
-                title: "Copy all details",
-                children: /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(Copy, { className: "h-4 w-4" })
+                className: "text-gray900 mb-12",
+                style: { fontFamily: "Noto Sans, sans-serif" },
+                children: title
               }
-            )
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(CardContent, { className: "px-6 pt-1 pb-4", children: /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)("div", { className: "relative", children: [
-            showTimeline && /* @__PURE__ */ (0, import_jsx_runtime96.jsx)("div", { className: "absolute left-[7px] top-2 bottom-6 w-0.5 border-l-2 border-dotted border-border pointer-events-none" }),
-            /* @__PURE__ */ (0, import_jsx_runtime96.jsx)("div", { className: "space-y-2.5", children: fields.map((field) => /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)(
+            ),
+            showTimeline && /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
               "div",
               {
-                className: cn(
-                  "relative transition-all duration-300",
-                  showTimeline && "pl-8"
-                ),
-                children: [
-                  showTimeline && /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
-                    "div",
-                    {
-                      className: cn(
-                        "absolute left-0 top-[18px] w-[14px] h-[14px] -translate-x-1/2 rounded-full border-2 bg-background z-10 transition-all duration-300",
-                        changedFields[field.key] ? "border-amber-500 shadow-[0_0_8px_rgba(245,158,11,0.4)]" : "border-border shadow-sm"
-                      )
-                    }
-                  ),
-                  /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
-                    EditableField,
-                    {
-                      label: field.label,
-                      value: data[field.key],
-                      type: field.type,
-                      config: field,
-                      isEditing: editingFields[field.key],
-                      isChanged: changedFields[field.key],
-                      isSaving: savingFields[field.key],
-                      onEdit: () => onFieldEdit?.(field.key),
-                      onSave: (val) => onFieldSave?.(field.key, val),
-                      onCancel: () => onFieldCancel?.(field.key)
-                    }
-                  )
-                ]
+                className: "absolute z-0 left-[60px] top-[100px] bottom-[60px] w-[3px]",
+                style: {
+                  background: `
+                  radial-gradient(circle closest-side, #3C3D3E 98%, transparent) 50%/2px 5px repeat-y,
+                  linear-gradient(#3C3D3E 50%, transparent 0) 50%/2px 10px repeat-y
+                `
+                }
+              }
+            ),
+            fields.map((field, index) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
+              EditableField,
+              {
+                label: field.label,
+                value: data[field.key],
+                type: field.type,
+                config: field,
+                isEditing: editingFields[field.key],
+                isChanged: changedFields[field.key],
+                isSaving: savingFields[field.key],
+                isLatestMessage,
+                onEdit: () => onFieldEdit?.(field.key),
+                onSave: (val) => onFieldSave?.(field.key, val),
+                onCancel: () => onFieldCancel?.(field.key),
+                renderDisplay: field.renderDisplay,
+                renderEdit: field.renderEdit,
+                showIndex: showTimeline,
+                index,
+                totalFields: fields.length
               },
               field.key
-            )) })
-          ] }) }),
-          (onProceed || footer) && /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)(CardFooter, { className: "flex flex-col gap-3 border-t border-border bg-foreground/[0.03] p-6", children: [
-            onProceed && proceedLabel && /* @__PURE__ */ (0, import_jsx_runtime96.jsx)("div", { className: "w-full flex justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
-              ActionButton,
-              {
-                label: proceedLabel,
-                countdown,
-                isPaused,
-                onPause,
-                onProceed
-              }
-            ) }),
-            footer
-          ] })
+            ))
+          ] }),
+          isLatestMessage && onProceed && proceedLabel ? /* @__PURE__ */ (0, import_jsx_runtime96.jsx)("div", { className: "my-6 flex justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)(
+            "button",
+            {
+              onClick: () => {
+                if (isLatestMessage) {
+                  onProceed();
+                }
+              },
+              className: cn(
+                "px-6 py-2.5 border rounded-full transition-colors text-sm font-medium flex items-center gap-2",
+                "bg-purpleLight dark:bg-purple200 text-purpleText2 dark:text-purpleText border-purpleText1 dark:border-purple100",
+                "hover:bg-purpleText1 dark:hover:bg-purple100 dark:hover:text-white"
+              ),
+              children: [
+                proceedLabel,
+                /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(ChevronRight, { className: "w-4 h-4" })
+              ]
+            }
+          ) }) : !isLatestMessage && footer ? /* @__PURE__ */ (0, import_jsx_runtime96.jsx)("div", { className: "flex justify-end items-center pb-4 pr-4 gap-1 text-green-600 text-sm font-medium", children: footer }) : null
         ]
       }
     );
@@ -34791,59 +34830,41 @@ var CampaignSeedCard = import_react59.default.memo(
     const fields = (0, import_react59.useMemo)(() => {
       return providedFields || generateFieldsFromData(data);
     }, [providedFields, data]);
-    return /* @__PURE__ */ (0, import_jsx_runtime106.jsx)("div", { className: "flex flex-col gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
-      FormCard,
-      {
-        ...formCardProps,
-        data,
-        title: formCardProps.title || "Campaign Brief",
-        fields,
-        className,
-        footer: !isLatestMessage && selectionStatus ? /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)("div", { className: "flex justify-end items-center gap-1.5 text-green-600 text-xs font-semibold py-1", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(CircleCheck, { className: "h-4 w-4" }),
-          /* @__PURE__ */ (0, import_jsx_runtime106.jsx)("span", { children: selectionStatus === "agent" ? "Selected by Agent" : "Selected by User" })
-        ] }) : formCardProps.footer
-      }
-    ) });
+    return /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)("div", { className: "flex flex-col gap-2 mb-10", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
+        FormCard,
+        {
+          ...formCardProps,
+          data,
+          title: formCardProps.title || "Campaign Brief",
+          fields,
+          className,
+          footer: !isLatestMessage && selectionStatus ? /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)("div", { className: "flex justify-end items-center gap-1.5 text-green-600 text-xs font-semibold py-1 mb-6", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(CircleCheck, { className: "h-4 w-4" }),
+            /* @__PURE__ */ (0, import_jsx_runtime106.jsx)("span", { children: selectionStatus === "agent" ? "Selected by Agent" : "Selected by User" })
+          ] }) : formCardProps.footer
+        }
+      ),
+      !isLatestMessage && selectionStatus && /* @__PURE__ */ (0, import_jsx_runtime106.jsx)("div", { className: "flex justify-center mt-4", children: /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
+        "button",
+        {
+          className: cn(
+            "flex items-center gap-2 px-6 py-2.5 border rounded-full text-sm transition-all active:scale-95",
+            "bg-purpleLight dark:bg-purple200 hover:bg-purpleText1 dark:hover:bg-purple100 text-purpleText2 dark:text-purpleText border-purpleText1 dark:border-purpleText dark:hover:text-white"
+          ),
+          children: "Continue"
+        }
+      ) })
+    ] });
   }
 );
 CampaignSeedCard.displayName = "CampaignSeedCard";
 
 // src/molecules/creator-discovery/SearchSpecCard/SearchSpecCard.tsx
-var import_react60 = __toESM(require("react"), 1);
-var import_jsx_runtime107 = require("react/jsx-runtime");
-var SearchSpecCard = import_react60.default.memo(
-  ({
-    selectionStatus,
-    isLatestMessage = true,
-    className,
-    fields: providedFields,
-    data,
-    ...formCardProps
-  }) => {
-    const fields = (0, import_react60.useMemo)(() => {
-      return providedFields || generateFieldsFromData(data);
-    }, [providedFields, data]);
-    return /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(
-      FormCard,
-      {
-        ...formCardProps,
-        data,
-        title: formCardProps.title || "Search Specification",
-        fields,
-        className,
-        footer: !isLatestMessage && selectionStatus ? /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)("div", { className: "flex justify-end items-center gap-1.5 text-green-600 text-xs font-semibold py-1", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(CircleCheck, { className: "h-4 w-4" }),
-          /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("span", { children: selectionStatus === "agent" ? "Selected by Agent" : "Selected by User" })
-        ] }) : formCardProps.footer
-      }
-    );
-  }
-);
-SearchSpecCard.displayName = "SearchSpecCard";
+var import_react61 = __toESM(require("react"), 1);
 
 // src/molecules/creator-discovery/SearchSpecCard/CustomFieldRenderers.tsx
-var import_react61 = require("react");
+var import_react60 = require("react");
 
 // src/lib/countries.ts
 var countries = [
@@ -35050,15 +35071,15 @@ var countriesWithFlags = Object.fromEntries(
 );
 
 // src/molecules/creator-discovery/SearchSpecCard/CustomFieldRenderers.tsx
-var import_jsx_runtime108 = require("react/jsx-runtime");
+var import_jsx_runtime107 = require("react/jsx-runtime");
 var CountrySelectEdit = ({
   value,
   onChange
 }) => {
-  const [isDropdownOpen, setIsDropdownOpen] = (0, import_react61.useState)(false);
-  const [searchTerm, setSearchTerm] = (0, import_react61.useState)("");
-  const dropdownRef = (0, import_react61.useRef)(null);
-  (0, import_react61.useEffect)(() => {
+  const [isDropdownOpen, setIsDropdownOpen] = (0, import_react60.useState)(false);
+  const [searchTerm, setSearchTerm] = (0, import_react60.useState)("");
+  const dropdownRef = (0, import_react60.useRef)(null);
+  (0, import_react60.useEffect)(() => {
     const handleClickOutside = (event) => {
       if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
         setIsDropdownOpen(false);
@@ -35068,16 +35089,16 @@ var CountrySelectEdit = ({
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, []);
   const inputValue = Array.isArray(value) ? value : [];
-  return /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "space-y-3", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "relative", ref: dropdownRef, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)("div", { className: "space-y-3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)("div", { className: "relative", ref: dropdownRef, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)(
         "div",
         {
           className: "flex-1 bg-white border border-gray200 rounded-md px-3 py-2 text-sm cursor-pointer flex items-center justify-between font-medium hover:border-purple500 transition-colors",
           onClick: () => setIsDropdownOpen(!isDropdownOpen),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { className: "text-gray-700", children: inputValue.length > 0 ? `${inputValue.length} ${inputValue.length === 1 ? "country" : "countries"} selected` : "Select countries..." }),
-            /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("span", { className: "text-gray-700", children: inputValue.length > 0 ? `${inputValue.length} ${inputValue.length === 1 ? "country" : "countries"} selected` : "Select countries..." }),
+            /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(
               ChevronDown,
               {
                 className: cn(
@@ -35089,8 +35110,8 @@ var CountrySelectEdit = ({
           ]
         }
       ),
-      isDropdownOpen && /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "absolute top-full left-0 right-0 mt-1 bg-white border border-gray200 rounded-lg shadow-xl z-50 max-h-60 overflow-hidden animate-in fade-in slide-in-from-top-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "p-2 border-b border-gray-100", children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+      isDropdownOpen && /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)("div", { className: "absolute top-full left-0 right-0 mt-1 bg-white border border-gray200 rounded-lg shadow-xl z-50 max-h-60 overflow-hidden animate-in fade-in slide-in-from-top-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("div", { className: "p-2 border-b border-gray-100", children: /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(
           "input",
           {
             type: "text",
@@ -35101,9 +35122,9 @@ var CountrySelectEdit = ({
             onClick: (e) => e.stopPropagation()
           }
         ) }),
-        /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "max-h-40 overflow-y-auto p-1", children: countries.filter(
+        /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("div", { className: "max-h-40 overflow-y-auto p-1", children: countries.filter(
           (country) => country.name.toLowerCase().includes(searchTerm.toLowerCase()) || country.code.toLowerCase().includes(searchTerm.toLowerCase())
-        ).map((country) => /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(
+        ).map((country) => /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)(
           "div",
           {
             className: cn(
@@ -35124,31 +35145,31 @@ var CountrySelectEdit = ({
               }
             },
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex items-center gap-2", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { className: "text-sm text-gray-700", children: country.name }),
-                /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { className: "text-xs text-gray-400 font-mono", children: country.code })
+              /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)("div", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("span", { className: "text-sm text-gray-700", children: country.name }),
+                /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("span", { className: "text-xs text-gray-400 font-mono", children: country.code })
               ] }),
-              inputValue.includes(country.code) && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(Check, { className: "h-4 w-4 text-purple500" })
+              inputValue.includes(country.code) && /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(Check, { className: "h-4 w-4 text-purple500" })
             ]
           },
           country.code
         )) })
       ] })
     ] }),
-    inputValue.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "flex flex-wrap gap-1.5", children: inputValue.map((countryCode) => /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(
+    inputValue.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("div", { className: "flex flex-wrap gap-1.5", children: inputValue.map((countryCode) => /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)(
       Badge2,
       {
         variant: "secondary",
         className: "bg-purple50 text-purple700 border-purple100 hover:bg-purple100 cursor-default flex items-center gap-1 pr-1",
         children: [
           countryCode,
-          /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(
+          /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)(
             "button",
             {
               onClick: () => onChange(inputValue.filter((c) => c !== countryCode)),
               className: "hover:bg-purple200 rounded-full p-0.5 transition-colors",
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(ChevronDown, { className: "h-3 w-3 rotate-45" }),
+                /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(ChevronDown, { className: "h-3 w-3 rotate-45" }),
                 " "
               ]
             }
@@ -35161,9 +35182,9 @@ var CountrySelectEdit = ({
 };
 var CountrySelectDisplay = ({ value }) => {
   if (!value || !Array.isArray(value) || value.length === 0) {
-    return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { className: "text-muted-foreground italic", children: "Not specified" });
+    return /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("span", { className: "text-muted-foreground italic", children: "Not specified" });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "flex flex-wrap gap-1.5", children: value.map((countryCode) => /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("div", { className: "flex flex-wrap gap-1.5", children: value.map((countryCode) => /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(
     Badge2,
     {
       variant: "outline",
@@ -35185,22 +35206,22 @@ var KeywordBundlesEdit = ({
     groups[p].push({ bundle: b, index: idx });
   });
   const sortedPriorities = Object.keys(groups).map((n) => parseInt(n)).sort((a, b) => a - b);
-  return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "space-y-6 pt-2", children: sortedPriorities.map((priority) => /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "space-y-3", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(Badge2, { className: "bg-purple500 hover:bg-purple500", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("div", { className: "space-y-6 pt-2", children: sortedPriorities.map((priority) => /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)("div", { className: "space-y-3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)(Badge2, { className: "bg-purple500 hover:bg-purple500", children: [
         "Priority ",
         priority
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "h-px flex-1 bg-gray-100" })
+      /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("div", { className: "h-px flex-1 bg-gray-100" })
     ] }),
-    groups[priority].map(({ bundle, index: bundleIndex }) => /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+    groups[priority].map(({ bundle, index: bundleIndex }) => /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(
       "div",
       {
         className: "bg-gray-50/50 border border-gray-100 rounded-xl p-4 transition-all hover:bg-gray-50 hover:border-gray-200 shadow-sm",
-        children: /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex flex-col gap-3", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("label", { className: "text-[10px] font-bold text-gray-400 uppercase tracking-widest pl-1", children: "Keywords" }),
-          /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "space-y-3", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "flex flex-wrap gap-1.5", children: Array.isArray(bundle.keywords) && bundle.keywords.map((keyword, kIndex) => /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)("div", { className: "flex flex-col gap-3", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("label", { className: "text-[10px] font-bold text-gray-400 uppercase tracking-widest pl-1", children: "Keywords" }),
+          /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)("div", { className: "space-y-3", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("div", { className: "flex flex-wrap gap-1.5", children: Array.isArray(bundle.keywords) && bundle.keywords.map((keyword, kIndex) => /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)(
               Badge2,
               {
                 className: "bg-white border-gray-200 text-gray-700 hover:bg-red-50 hover:text-red-600 hover:border-red-100 transition-all cursor-pointer group",
@@ -35216,12 +35237,12 @@ var KeywordBundlesEdit = ({
                 },
                 children: [
                   keyword,
-                  /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { className: "ml-1 opacity-0 group-hover:opacity-100 transition-opacity", children: "\xD7" })
+                  /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("span", { className: "ml-1 opacity-0 group-hover:opacity-100 transition-opacity", children: "\xD7" })
                 ]
               },
               kIndex
             )) }),
-            /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "flex gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("div", { className: "flex gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(
               "input",
               {
                 type: "text",
@@ -35245,9 +35266,9 @@ var KeywordBundlesEdit = ({
               }
             ) })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex flex-col gap-1.5 mt-1", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("label", { className: "text-[10px] font-bold text-gray-400 uppercase tracking-widest pl-1", children: "Priority Level (1-5)" }),
-            /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)("div", { className: "flex flex-col gap-1.5 mt-1", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("label", { className: "text-[10px] font-bold text-gray-400 uppercase tracking-widest pl-1", children: "Priority Level (1-5)" }),
+            /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(
               "input",
               {
                 type: "number",
@@ -35275,7 +35296,7 @@ var KeywordBundlesEdit = ({
 var KeywordBundlesDisplay = ({ value }) => {
   const bundles = Array.isArray(value) ? value : [];
   if (bundles.length === 0)
-    return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { className: "text-muted-foreground italic", children: "Not specified" });
+    return /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("span", { className: "text-gray-500 italic text-sm", children: "Not specified" });
   const groups = {};
   bundles.forEach((b) => {
     const p = Number(b?.priority) || 1;
@@ -35284,28 +35305,20 @@ var KeywordBundlesDisplay = ({ value }) => {
     groups[p].push(...keywords);
   });
   const sortedPriorities = Object.keys(groups).map((n) => parseInt(n)).sort((a, b) => a - b);
-  return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "space-y-4 pt-1", children: sortedPriorities.map((priority) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("div", { className: "space-y-4 pt-2", children: sortedPriorities.map((priority) => {
     const deduped = Array.from(new Set(groups[priority]));
-    return /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "space-y-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(
-          Badge2,
-          {
-            variant: "outline",
-            className: "text-[10px] uppercase tracking-wider text-purple600 border-purple100 bg-purple50/30",
-            children: [
-              "Priority ",
-              priority
-            ]
-          }
-        ),
-        /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "h-px flex-1 bg-gray-100/50" })
+    return /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)("span", { className: "text-[10px] uppercase tracking-widest text-purple-400 font-bold", children: [
+          "Priority ",
+          priority
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("div", { className: "h-[1px] flex-1 bg-white/10" })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "flex flex-wrap gap-1.5", children: deduped.map((keyword) => /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
-        Badge2,
+      /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("div", { className: "flex flex-wrap gap-2", children: deduped.map((keyword) => /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(
+        "div",
         {
-          variant: "secondary",
-          className: "bg-white border-gray-200 text-gray-700 font-medium",
+          className: "px-2 py-1 rounded bg-[#1A1A1A] border border-white/10 text-gray-300 text-xs font-medium",
           children: keyword
         },
         keyword
@@ -35314,6 +35327,98 @@ var KeywordBundlesDisplay = ({ value }) => {
   }) });
 };
 
+// src/molecules/creator-discovery/SearchSpecCard/SearchSpecCard.tsx
+var import_jsx_runtime108 = require("react/jsx-runtime");
+var ObjectDisplay = ({ value }) => {
+  if (!value || typeof value !== "object") return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "space-y-1 pt-1", children: Object.entries(value).map(([k, v]) => /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex gap-2 text-sm", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("span", { className: "text-muted-foreground capitalize min-w-[120px]", children: [
+      k.replace(/_/g, " "),
+      ":"
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { className: "text-foreground font-medium", children: Array.isArray(v) ? v.join(", ") : String(v) })
+  ] }, k)) });
+};
+var StringArrayDisplay = ({ value }) => {
+  if (!Array.isArray(value) || value.length === 0)
+    return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { className: "text-muted-foreground italic text-sm", children: "Not specified" });
+  return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "flex flex-wrap gap-1.5 pt-1", children: value.map((item) => /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(Badge2, { variant: "outline", className: "text-xs", children: item }, item)) });
+};
+function buildSearchSpecFields(data) {
+  if (!data || typeof data !== "object") return [];
+  return Object.keys(data).map((key) => {
+    const value = data[key];
+    if (key === "keyword_bundles") {
+      return {
+        key,
+        label: "Keyword Bundles",
+        type: "custom",
+        renderDisplay: (v) => /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(KeywordBundlesDisplay, { value: v }),
+        renderEdit: (v, onChange) => /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(KeywordBundlesEdit, { value: v, onChange })
+      };
+    }
+    if (key === "geography") {
+      return {
+        key,
+        label: "Geography",
+        type: "custom",
+        renderDisplay: (v) => /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(CountrySelectDisplay, { value: v }),
+        renderEdit: (v, onChange) => /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(CountrySelectEdit, { value: v, onChange })
+      };
+    }
+    if (key === "platforms" && Array.isArray(value)) {
+      return {
+        key,
+        label: "Platforms",
+        type: "custom",
+        renderDisplay: (v) => /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(StringArrayDisplay, { value: v })
+      };
+    }
+    if (typeof value === "object" && value !== null && !Array.isArray(value) && !("min" in value && "max" in value)) {
+      const label = key.split("_").map((w) => w.charAt(0).toUpperCase() + w.slice(1)).join(" ");
+      return {
+        key,
+        label,
+        type: "custom",
+        renderDisplay: (v) => /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(ObjectDisplay, { value: v })
+      };
+    }
+    const [generated] = generateFieldsFromData({ [key]: value });
+    return generated;
+  });
+}
+var SearchSpecCard = import_react61.default.memo(
+  ({
+    selectionStatus,
+    isLatestMessage = true,
+    className,
+    fields: providedFields,
+    data,
+    specData,
+    ...formCardProps
+  }) => {
+    const resolvedData = data || specData;
+    const fields = (0, import_react61.useMemo)(() => {
+      return providedFields || buildSearchSpecFields(resolvedData ?? {});
+    }, [providedFields, resolvedData]);
+    return /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(
+      FormCard,
+      {
+        ...formCardProps,
+        data: resolvedData ?? {},
+        title: formCardProps.title || "Search Specification",
+        fields,
+        className,
+        footer: !isLatestMessage && selectionStatus ? /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex justify-end items-center gap-1.5 text-green-600 text-xs font-semibold py-1", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(CircleCheck, { className: "h-4 w-4" }),
+          /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { children: selectionStatus === "agent" ? "Selected by Agent" : "Selected by User" })
+        ] }) : formCardProps.footer
+      }
+    );
+  }
+);
+SearchSpecCard.displayName = "SearchSpecCard";
+
 // src/molecules/creator-discovery/MCQCard/MCQCard.tsx
 var import_react62 = __toESM(require("react"), 1);
 var import_jsx_runtime109 = require("react/jsx-runtime");
@@ -35322,116 +35427,123 @@ var MCQCard = import_react62.default.memo(
     question,
     options,
     recommended,
-    selectedOption,
+    selectedOption: propsSelectedOption,
     onSelect,
-    onAction,
+    onProceed,
     isLatestMessage = true,
-    countdown,
-    isPaused = false,
-    onPause,
     isLoading = false,
     className,
-    selectionStatus
+    selectionStatus,
+    onAction,
+    disabled = false
   }) => {
-    const [localSelected, setLocalSelected] = (0, import_react62.useState)(null);
-    const effectiveSelected = selectedOption ?? localSelected;
-    const handleOptionClick = (key) => {
-      if (!isLoading) {
-        setLocalSelected(key);
+    const [selectedOption, setSelectedOption] = import_react62.default.useState(propsSelectedOption);
+    const [isProceeded, setIsProceeded] = import_react62.default.useState(false);
+    import_react62.default.useEffect(() => {
+      if (propsSelectedOption) {
+        setSelectedOption(propsSelectedOption);
+        setIsProceeded(true);
+      }
+    }, [propsSelectedOption]);
+    const handleOptionClick = (key, e) => {
+      e.preventDefault();
+      e.stopPropagation();
+      if (isLatestMessage && !isLoading && !disabled && !isProceeded) {
+        setSelectedOption(key);
         onSelect?.(key);
       }
     };
-    const handleProceed = () => {
-      const value = effectiveSelected || recommended || "";
-      if (value) {
-        if (onAction) {
-          onAction(value);
-        }
+    const handleProceed = (e) => {
+      e.preventDefault();
+      e.stopPropagation();
+      if ((selectedOption || recommended) && !disabled && !isProceeded) {
+        const result = selectedOption || recommended || "";
+        setIsProceeded(true);
+        onProceed?.(result);
+        onAction?.({
+          type: "mcq_selection",
+          value: result,
+          label: options[result] || result
+        });
       }
     };
+    const isInteractionDisabled = disabled || !isLatestMessage || isProceeded;
     return /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)(
-      Card,
+      "div",
       {
         className: cn(
-          "w-full rounded-[24px] border border-border bg-card shadow-sm overflow-hidden",
+          "p-6 rounded-[20px] border border-gray400 bg-background dark:bg-gray200 font-noto w-full",
           className
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(CardHeader, { className: "pb-2", children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(CardTitle, { className: "text-lg font-bold text-foreground tracking-tight leading-snug", children: question }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(CardContent, { className: "space-y-3 pb-6", children: Object.entries(options).map(([key, label]) => {
-            const isSelected = effectiveSelected === key;
+          /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("h4", { className: "font-medium text-foreground px-3 py-1 rounded-md inline-block mb-2", children: question }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "mb-6", children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "space-y-4", children: Object.entries(options).map(([key, label]) => {
+            const isSelected = selectedOption === key;
             const isRecommended = key === recommended;
             return /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)(
               "div",
               {
-                onClick: () => handleOptionClick(key),
+                onClick: (e) => handleOptionClick(key, e),
                 className: cn(
-                  "group relative flex items-start gap-4 p-4 rounded-2xl border transition-all duration-200 cursor-pointer",
-                  isSelected ? "border-primary bg-primary/5 shadow-[0_0_0_1px_theme(colors.primary.DEFAULT)]" : "border-border bg-background/30 hover:border-gray-300 hover:bg-background/50",
-                  isLoading && "opacity-50 cursor-not-allowed"
+                  "cursor-pointer rounded-xl p-3 transition-colors relative",
+                  "border border-transparent bg-paperBackground",
+                  !selectedOption && !isInteractionDisabled && "hover:border-gray500",
+                  (isLoading || isInteractionDisabled) && "opacity-50 cursor-not-allowed"
                 ),
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "absolute top-1/2 left-4 transform -translate-y-1/2", children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
                     "div",
                     {
                       className: cn(
-                        "mt-1 w-5 h-5 rounded-full border-2 flex items-center justify-center transition-colors",
-                        isSelected ? "border-primary bg-primary" : "border-border bg-background group-hover:border-gray-400"
+                        "w-5 h-5 rounded-full border flex items-center justify-center transition-colors",
+                        isSelected ? "border-purple100 bg-gray300" : cn(
+                          "border-gray300 bg-background",
+                          !selectedOption && !isInteractionDisabled && "hover:border-purple100"
+                        )
                       ),
-                      children: isSelected && /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "w-1.5 h-1.5 rounded-full bg-white" })
+                      children: isSelected && /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "w-2.5 h-2.5 rounded-full bg-purple100" })
                     }
-                  ),
-                  /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "flex-1 space-y-1.5", children: /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex items-center gap-2 flex-wrap", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
-                      "span",
-                      {
-                        className: cn(
-                          "text-sm font-semibold transition-colors",
-                          isSelected ? "text-foreground" : "text-foreground/80"
-                        ),
-                        children: label
-                      }
-                    ),
-                    isRecommended && /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)(
-                      Badge2,
-                      {
-                        variant: "outline",
-                        className: "bg-green-500/10 text-green-500 border-green-500/20 flex items-center gap-1 text-[10px] py-0 h-5",
-                        children: [
-                          /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(Sparkles, { className: "h-3 w-3" }),
-                          "Recommended"
-                        ]
-                      }
-                    ),
-                    isSelected && /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
-                      Badge2,
-                      {
-                        variant: "outline",
-                        className: "bg-[var(--primary-color)]/10 text-[var(--primary-color)] border-[var(--primary-color)]/20 text-[10px] py-0 h-5",
-                        children: "Selected"
-                      }
-                    )
-                  ] }) })
+                  ) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "pl-12", children: [
+                    (isRecommended || isSelected) && /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex gap-2 mb-2 flex-wrap", children: [
+                      isRecommended && /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "flex text-xs font-semibold", children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("p", { className: "bg-greenBackground text-greenText px-2 py-1 rounded-[20px]", children: "Recommended" }) }),
+                      isSelected && /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "flex text-xs font-semibold", children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+                        "p",
+                        {
+                          className: cn(
+                            "px-2 py-1 rounded-[20px]",
+                            selectedOption === recommended ? "bg-purpleLight text-purpleText2 dark:bg-primary/20 dark:text-primary" : "bg-paperBackground text-primaryDark2 dark:bg-primary/20 dark:text-primary"
+                          ),
+                          children: "Selected by you"
+                        }
+                      ) })
+                    ] }),
+                    /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "text-base font-medium text-txtColor", children: label })
+                  ] })
                 ]
               },
               key
             );
-          }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(CardFooter, { className: "flex flex-col gap-4 pt-0 border-t border-[var(--border-color)] bg-black/5 p-6", children: isLatestMessage ? /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "w-full flex justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
-            ActionButton,
-            {
-              label: effectiveSelected ? "Continue" : "Proceed with Recommendation",
-              countdown,
-              isPaused,
-              onPause,
-              onProceed: handleProceed,
-              isLoading,
-              disabled: !effectiveSelected && !recommended
-            }
-          ) }) : /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "w-full flex justify-end items-center gap-1.5 text-green-500 text-xs font-semibold", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(CircleCheck, { className: "h-4 w-4" }),
-            /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("span", { children: selectionStatus === "agent" ? "Suggested by Agent, Approved by You" : "Selected by You" })
-          ] }) })
+          }) }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex justify-between items-center", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "flex-1" }),
+            /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
+              "button",
+              {
+                onClick: (e) => handleProceed(e),
+                disabled: isInteractionDisabled || isLoading || !selectedOption && !recommended,
+                className: cn(
+                  "flex-3 px-4 py-2 border rounded-full text-sm disabled:opacity-50 disabled:cursor-not-allowed transition-colors",
+                  "bg-purpleLight dark:bg-purple200 hover:bg-purpleText1 dark:hover:bg-purple100 text-purpleText2 dark:text-purpleText border-purpleText1 dark:border-purple-border dark:hover:text-white"
+                ),
+                children: isLoading ? "Sending..." : "Continue"
+              }
+            ),
+            isLatestMessage ? /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "flex-1" }) : /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "flex-1 text-right text-xs bg-green100 text-green-600 dark:text-green500", children: selectionStatus === "agent" ? /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex flex-col gap-1 sm:flex-row sm:justify-end", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("span", { className: "whitespace-nowrap", children: "Suggested by an Agent," }),
+              /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("span", { className: "whitespace-nowrap", children: "Approved by You" })
+            ] }) : /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("span", { children: "Selected by you" }) })
+          ] })
         ]
       }
     );
@@ -35911,6 +36023,216 @@ var CreatorActionHeader = ({
   );
 };
 
+// src/molecules/creator-discovery/CreatorSearchBox/CreatorSearch.tsx
+var import_react63 = __toESM(require("react"), 1);
+var import_jsx_runtime120 = require("react/jsx-runtime");
+var CreatorSearch = import_react63.default.memo(
+  ({
+    selectionStatus,
+    isLatestMessage = true,
+    className,
+    fields: providedFields,
+    data,
+    ...formCardProps
+  }) => {
+    const fields = (0, import_react63.useMemo)(() => {
+      const baseFields = providedFields || generateFieldsFromData(data);
+      return baseFields.map((field) => {
+        if (field.key === "platforms") {
+          return {
+            ...field,
+            renderDisplay: (val) => {
+              const platforms = Array.isArray(val) ? val : [val];
+              return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("div", { className: "flex flex-wrap gap-2", children: platforms.map((p) => /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
+                BadgeAtom,
+                {
+                  id: `platform-${p}`,
+                  type: "badge",
+                  label: p,
+                  variant: "outline",
+                  className: "bg-[#1A1A1A] border-gray400 text-white font-medium"
+                },
+                p
+              )) });
+            }
+          };
+        }
+        if (field.key === "geography") {
+          return {
+            ...field,
+            renderDisplay: (val) => /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(CountrySelectDisplay, { value: val })
+          };
+        }
+        if (field.key === "keywordBundles") {
+          return {
+            ...field,
+            renderDisplay: (val) => /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(KeywordBundlesDisplay, { value: val })
+          };
+        }
+        if (field.key === "followerRange") {
+          return {
+            ...field,
+            renderDisplay: (val) => {
+              if (typeof val === "object" && val !== null) {
+                return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("span", { className: "text-white font-medium", children: `${val.min?.toLocaleString()} - ${val.max?.toLocaleString()} followers` });
+              }
+              return /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)("span", { className: "text-white font-medium", children: [
+                val,
+                " followers"
+              ] });
+            }
+          };
+        }
+        if (field.key === "initialCreators") {
+          return {
+            ...field,
+            renderDisplay: (val) => /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)("span", { className: "text-white font-medium", children: [
+              val,
+              " creators"
+            ] })
+          };
+        }
+        return field;
+      });
+    }, [providedFields, data]);
+    return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("div", { className: "flex flex-col gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
+      FormCard,
+      {
+        ...formCardProps,
+        data,
+        title: formCardProps.title || "Creator Search Settings",
+        fields,
+        showTimeline: true,
+        className: cn("font-noto", className),
+        footer: !isLatestMessage && selectionStatus ? /* @__PURE__ */ (0, import_jsx_runtime120.jsxs)("div", { className: "flex justify-end items-center gap-1.5 text-green-600 text-[10px] font-semibold py-4 pr-6", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(CircleCheck, { className: "h-3.5 w-3.5" }),
+          /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("span", { children: selectionStatus === "agent" ? "Suggested by Agent" : "Selected by you" })
+        ] }) : formCardProps.footer
+      }
+    ) });
+  }
+);
+CreatorSearch.displayName = "CreatorSearch";
+
+// src/molecules/creator-discovery/CampaignConceptCard/CampaignConceptCard.tsx
+var import_react64 = __toESM(require("react"), 1);
+var import_framer_motion = require("framer-motion");
+var import_jsx_runtime121 = require("react/jsx-runtime");
+var CampaignConceptCard = import_react64.default.memo(
+  ({
+    isRecommended,
+    isOpen: controlledIsOpen,
+    onToggle,
+    data,
+    fields: providedFields,
+    title,
+    selectionStatus,
+    isLatestMessage = true,
+    className,
+    ...formCardProps
+  }) => {
+    const [internalIsOpen, setInternalIsOpen] = (0, import_react64.useState)(false);
+    const isOpen = controlledIsOpen !== void 0 ? controlledIsOpen : internalIsOpen;
+    const handleToggle = () => {
+      if (onToggle) {
+        onToggle();
+      } else {
+        setInternalIsOpen(!internalIsOpen);
+      }
+    };
+    const fields = (0, import_react64.useMemo)(() => {
+      const baseFields = providedFields || generateFieldsFromData(data);
+      return baseFields.map((field) => {
+        if (field.key === "budgetAllocation") {
+          return {
+            ...field,
+            renderDisplay: (val) => {
+              if (!Array.isArray(val)) return /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("span", { children: val });
+              return /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("div", { className: "space-y-2", children: val.map((item, idx) => /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)("div", { className: "flex items-center gap-2 text-xs font-medium", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)("span", { children: [
+                  idx + 1,
+                  "."
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("div", { className: "bg-[#1A1A1A] border border-white/10 px-2 py-0.5 rounded text-gray-300", children: item.label }),
+                /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("span", { className: "text-gray-400", children: "=" }),
+                /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("div", { className: "bg-[#1A1A1A] border border-white/10 px-2 py-0.5 rounded text-gray-300", children: item.value })
+              ] }, idx)) });
+            }
+          };
+        }
+        if (field.key === "estimatedCreators") {
+          return {
+            ...field,
+            renderDisplay: (val) => {
+              if (!Array.isArray(val)) return /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("span", { className: "text-white font-medium", children: val });
+              return /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("div", { className: "flex gap-2", children: val.map((v, idx) => /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("div", { className: "bg-[#1A1A1A] border border-white/10 px-2 py-0.5 rounded text-white text-xs font-medium", children: v }, idx)) });
+            }
+          };
+        }
+        return {
+          ...field,
+          renderDisplay: (val) => /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("span", { className: "text-gray-300 text-sm", children: val })
+        };
+      });
+    }, [providedFields, data]);
+    return /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(
+      "div",
+      {
+        className: cn(
+          "w-full rounded-[20px] transition-all duration-300 bg-background dark:bg-gray50",
+          isOpen ? "border border-green-500/50 shadow-[0_0_15px_rgba(34,197,94,0.1)]" : "border border-gray400",
+          className
+        ),
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(
+            "div",
+            {
+              className: "flex items-center justify-between p-6 cursor-pointer select-none",
+              onClick: handleToggle,
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)("div", { className: "flex flex-col gap-2", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("h3", { className: "text-lg font-semibold text-white tracking-wide", children: title || data.title }),
+                  isRecommended && /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("div", { className: "inline-flex text-[10px] font-bold uppercase tracking-widest text-[#22C55E]", children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("span", { className: "bg-[#22C55E]/10 px-2 py-0.5 rounded border border-[#22C55E]/20", children: "Recommended" }) })
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("div", { className: cn(
+                  "p-2 rounded-lg bg-white/5 border border-white/10 text-gray-400 transition-transform duration-300",
+                  isOpen && "rotate-180"
+                ), children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(ChevronDown, { className: "h-4 w-4" }) })
+              ]
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(import_framer_motion.AnimatePresence, { initial: false, children: isOpen && /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+            import_framer_motion.motion.div,
+            {
+              initial: { height: 0, opacity: 0 },
+              animate: { height: "auto", opacity: 1 },
+              exit: { height: 0, opacity: 0 },
+              transition: { duration: 0.3, ease: "easeInOut" },
+              className: "overflow-hidden",
+              children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("div", { className: "px-6 pb-6 pt-0 border-t border-white/5", children: /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+                FormCard,
+                {
+                  ...formCardProps,
+                  title: title || data.title || "Campaign Concept",
+                  data,
+                  fields,
+                  showTimeline: true,
+                  className: "bg-transparent border-none shadow-none mb-0 p-0",
+                  footer: !isLatestMessage && selectionStatus ? /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)("div", { className: "flex justify-end items-center gap-1.5 text-green-600 text-[10px] font-semibold py-4 pr-6", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(CircleCheck, { className: "h-3.5 w-3.5" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("span", { children: selectionStatus === "agent" ? "Selected by Agent" : "Selected by You" })
+                  ] }) : formCardProps.footer
+                }
+              ) })
+            }
+          ) })
+        ]
+      }
+    );
+  }
+);
+CampaignConceptCard.displayName = "CampaignConceptCard";
+
 // src/components/ui/index.ts
 var ui_exports = {};
 __export(ui_exports, {
@@ -36203,7 +36525,7 @@ __export(ui_exports, {
 // src/components/ui/button-group.tsx
 var import_react_slot4 = require("@radix-ui/react-slot");
 var import_class_variance_authority8 = require("class-variance-authority");
-var import_jsx_runtime120 = require("react/jsx-runtime");
+var import_jsx_runtime122 = require("react/jsx-runtime");
 var buttonGroupVariants = (0, import_class_variance_authority8.cva)(
   "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",
   {
@@ -36223,7 +36545,7 @@ function ButtonGroup({
   orientation,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
     "div",
     {
       role: "group",
@@ -36240,7 +36562,7 @@ function ButtonGroupText({
   ...props
 }) {
   const Comp = asChild ? import_react_slot4.Slot : "div";
-  return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
     Comp,
     {
       className: cn(
@@ -36256,7 +36578,7 @@ function ButtonGroupSeparator({
   orientation = "vertical",
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
     Separator2,
     {
       "data-slot": "button-group-separator",
@@ -36272,9 +36594,9 @@ function ButtonGroupSeparator({
 
 // src/components/ui/empty.tsx
 var import_class_variance_authority9 = require("class-variance-authority");
-var import_jsx_runtime121 = require("react/jsx-runtime");
+var import_jsx_runtime123 = require("react/jsx-runtime");
 function Empty({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
     "div",
     {
       "data-slot": "empty",
@@ -36287,7 +36609,7 @@ function Empty({ className, ...props }) {
   );
 }
 function EmptyHeader({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
     "div",
     {
       "data-slot": "empty-header",
@@ -36318,7 +36640,7 @@ function EmptyMedia({
   variant = "default",
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
     "div",
     {
       "data-slot": "empty-icon",
@@ -36329,7 +36651,7 @@ function EmptyMedia({
   );
 }
 function EmptyTitle({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
     "div",
     {
       "data-slot": "empty-title",
@@ -36339,7 +36661,7 @@ function EmptyTitle({ className, ...props }) {
   );
 }
 function EmptyDescription({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
     "div",
     {
       "data-slot": "empty-description",
@@ -36352,7 +36674,7 @@ function EmptyDescription({ className, ...props }) {
   );
 }
 function EmptyContent({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
     "div",
     {
       "data-slot": "empty-content",
@@ -36366,11 +36688,11 @@ function EmptyContent({ className, ...props }) {
 }
 
 // src/components/ui/field.tsx
-var import_react63 = require("react");
+var import_react65 = require("react");
 var import_class_variance_authority10 = require("class-variance-authority");
-var import_jsx_runtime122 = require("react/jsx-runtime");
+var import_jsx_runtime124 = require("react/jsx-runtime");
 function FieldSet({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
     "fieldset",
     {
       "data-slot": "field-set",
@@ -36388,7 +36710,7 @@ function FieldLegend({
   variant = "legend",
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
     "legend",
     {
       "data-slot": "field-legend",
@@ -36404,7 +36726,7 @@ function FieldLegend({
   );
 }
 function FieldGroup({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
     "div",
     {
       "data-slot": "field-group",
@@ -36444,7 +36766,7 @@ function Field({
   orientation = "vertical",
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
     "div",
     {
       role: "group",
@@ -36456,7 +36778,7 @@ function Field({
   );
 }
 function FieldContent({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
     "div",
     {
       "data-slot": "field-content",
@@ -36472,7 +36794,7 @@ function FieldLabel({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
     Label,
     {
       "data-slot": "field-label",
@@ -36487,7 +36809,7 @@ function FieldLabel({
   );
 }
 function FieldTitle({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
     "div",
     {
       "data-slot": "field-label",
@@ -36500,7 +36822,7 @@ function FieldTitle({ className, ...props }) {
   );
 }
 function FieldDescription({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
     "p",
     {
       "data-slot": "field-description",
@@ -36519,7 +36841,7 @@ function FieldSeparator({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime124.jsxs)(
     "div",
     {
       "data-slot": "field-separator",
@@ -36530,8 +36852,8 @@ function FieldSeparator({
       ),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(Separator2, { className: "absolute inset-0 top-1/2" }),
-        children && /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(Separator2, { className: "absolute inset-0 top-1/2" }),
+        children && /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
           "span",
           {
             className: "bg-background text-muted-foreground relative mx-auto block w-fit px-2",
@@ -36549,7 +36871,7 @@ function FieldError({
   errors,
   ...props
 }) {
-  const content = (0, import_react63.useMemo)(() => {
+  const content = (0, import_react65.useMemo)(() => {
     if (children) {
       return children;
     }
@@ -36559,14 +36881,14 @@ function FieldError({
     if (errors?.length === 1 && errors[0]?.message) {
       return errors[0].message;
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)("ul", { className: "ml-4 flex list-disc flex-col gap-1", children: errors.map(
-      (error, index) => error?.message && /* @__PURE__ */ (0, import_jsx_runtime122.jsx)("li", { children: error.message }, index)
+    return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)("ul", { className: "ml-4 flex list-disc flex-col gap-1", children: errors.map(
+      (error, index) => error?.message && /* @__PURE__ */ (0, import_jsx_runtime124.jsx)("li", { children: error.message }, index)
     ) });
   }, [children, errors]);
   if (!content) {
     return null;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
     "div",
     {
       role: "alert",
@@ -36580,9 +36902,9 @@ function FieldError({
 
 // src/components/ui/input-group.tsx
 var import_class_variance_authority11 = require("class-variance-authority");
-var import_jsx_runtime123 = require("react/jsx-runtime");
+var import_jsx_runtime125 = require("react/jsx-runtime");
 function InputGroup({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
     "div",
     {
       "data-slot": "input-group",
@@ -36626,7 +36948,7 @@ function InputGroupAddon({
   align = "inline-start",
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
     "div",
     {
       role: "group",
@@ -36666,7 +36988,7 @@ function InputGroupButton({
   size = "xs",
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
     Button,
     {
       type,
@@ -36678,7 +37000,7 @@ function InputGroupButton({
   );
 }
 function InputGroupText({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
     "span",
     {
       className: cn(
@@ -36693,7 +37015,7 @@ function InputGroupInput({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
     Input,
     {
       "data-slot": "input-group-control",
@@ -36709,7 +37031,7 @@ function InputGroupTextarea({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
     Textarea,
     {
       "data-slot": "input-group-control",
@@ -36725,9 +37047,9 @@ function InputGroupTextarea({
 // src/components/ui/item.tsx
 var import_react_slot5 = require("@radix-ui/react-slot");
 var import_class_variance_authority12 = require("class-variance-authority");
-var import_jsx_runtime124 = require("react/jsx-runtime");
+var import_jsx_runtime126 = require("react/jsx-runtime");
 function ItemGroup({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
     "div",
     {
       role: "list",
@@ -36741,7 +37063,7 @@ function ItemSeparator({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
     Separator2,
     {
       "data-slot": "item-separator",
@@ -36779,7 +37101,7 @@ function Item8({
   ...props
 }) {
   const Comp = asChild ? import_react_slot5.Slot : "div";
-  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
     Comp,
     {
       "data-slot": "item",
@@ -36810,7 +37132,7 @@ function ItemMedia({
   variant = "default",
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
     "div",
     {
       "data-slot": "item-media",
@@ -36821,7 +37143,7 @@ function ItemMedia({
   );
 }
 function ItemContent({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
     "div",
     {
       "data-slot": "item-content",
@@ -36834,7 +37156,7 @@ function ItemContent({ className, ...props }) {
   );
 }
 function ItemTitle({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
     "div",
     {
       "data-slot": "item-title",
@@ -36847,7 +37169,7 @@ function ItemTitle({ className, ...props }) {
   );
 }
 function ItemDescription({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
     "p",
     {
       "data-slot": "item-description",
@@ -36861,7 +37183,7 @@ function ItemDescription({ className, ...props }) {
   );
 }
 function ItemActions({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
     "div",
     {
       "data-slot": "item-actions",
@@ -36871,7 +37193,7 @@ function ItemActions({ className, ...props }) {
   );
 }
 function ItemHeader({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
     "div",
     {
       "data-slot": "item-header",
@@ -36884,7 +37206,7 @@ function ItemHeader({ className, ...props }) {
   );
 }
 function ItemFooter({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
     "div",
     {
       "data-slot": "item-footer",
@@ -36898,9 +37220,9 @@ function ItemFooter({ className, ...props }) {
 }
 
 // src/components/ui/kbd.tsx
-var import_jsx_runtime125 = require("react/jsx-runtime");
+var import_jsx_runtime127 = require("react/jsx-runtime");
 function Kbd({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
     "kbd",
     {
       "data-slot": "kbd",
@@ -36915,7 +37237,7 @@ function Kbd({ className, ...props }) {
   );
 }
 function KbdGroup({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
     "kbd",
     {
       "data-slot": "kbd-group",
@@ -36926,16 +37248,16 @@ function KbdGroup({ className, ...props }) {
 }
 
 // src/components/ui/sidebar.tsx
-var React94 = __toESM(require("react"), 1);
+var React96 = __toESM(require("react"), 1);
 var import_react_slot6 = require("@radix-ui/react-slot");
 var import_class_variance_authority13 = require("class-variance-authority");
 
 // src/hooks/use-mobile.tsx
-var React93 = __toESM(require("react"), 1);
+var React95 = __toESM(require("react"), 1);
 var MOBILE_BREAKPOINT = 768;
 function useIsMobile() {
-  const [isMobile, setIsMobile] = React93.useState(void 0);
-  React93.useEffect(() => {
+  const [isMobile, setIsMobile] = React95.useState(void 0);
+  React95.useEffect(() => {
     const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
     const onChange = () => {
       setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
@@ -36948,22 +37270,22 @@ function useIsMobile() {
 }
 
 // src/components/ui/sidebar.tsx
-var import_jsx_runtime126 = require("react/jsx-runtime");
+var import_jsx_runtime128 = require("react/jsx-runtime");
 var SIDEBAR_COOKIE_NAME = "sidebar_state";
 var SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
 var SIDEBAR_WIDTH = "16rem";
 var SIDEBAR_WIDTH_MOBILE = "18rem";
 var SIDEBAR_WIDTH_ICON = "3rem";
 var SIDEBAR_KEYBOARD_SHORTCUT = "b";
-var SidebarContext = React94.createContext(null);
+var SidebarContext = React96.createContext(null);
 function useSidebar() {
-  const context = React94.useContext(SidebarContext);
+  const context = React96.useContext(SidebarContext);
   if (!context) {
     throw new Error("useSidebar must be used within a SidebarProvider.");
   }
   return context;
 }
-var SidebarProvider = React94.forwardRef(
+var SidebarProvider = React96.forwardRef(
   ({
     defaultOpen = true,
     open: openProp,
@@ -36974,10 +37296,10 @@ var SidebarProvider = React94.forwardRef(
     ...props
   }, ref) => {
     const isMobile = useIsMobile();
-    const [openMobile, setOpenMobile] = React94.useState(false);
-    const [_open, _setOpen] = React94.useState(defaultOpen);
+    const [openMobile, setOpenMobile] = React96.useState(false);
+    const [_open, _setOpen] = React96.useState(defaultOpen);
     const open = openProp ?? _open;
-    const setOpen = React94.useCallback(
+    const setOpen = React96.useCallback(
       (value) => {
         const openState = typeof value === "function" ? value(open) : value;
         if (setOpenProp) {
@@ -36989,10 +37311,10 @@ var SidebarProvider = React94.forwardRef(
       },
       [setOpenProp, open]
     );
-    const toggleSidebar = React94.useCallback(() => {
+    const toggleSidebar = React96.useCallback(() => {
       return isMobile ? setOpenMobile((open2) => !open2) : setOpen((open2) => !open2);
     }, [isMobile, setOpen, setOpenMobile]);
-    React94.useEffect(() => {
+    React96.useEffect(() => {
       const handleKeyDown = (event) => {
         if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
           event.preventDefault();
@@ -37003,7 +37325,7 @@ var SidebarProvider = React94.forwardRef(
       return () => window.removeEventListener("keydown", handleKeyDown);
     }, [toggleSidebar]);
     const state = open ? "expanded" : "collapsed";
-    const contextValue = React94.useMemo(
+    const contextValue = React96.useMemo(
       () => ({
         state,
         open,
@@ -37015,7 +37337,7 @@ var SidebarProvider = React94.forwardRef(
       }),
       [state, open, setOpen, isMobile, openMobile, setOpenMobile, toggleSidebar]
     );
-    return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
       "div",
       {
         style: {
@@ -37035,7 +37357,7 @@ var SidebarProvider = React94.forwardRef(
   }
 );
 SidebarProvider.displayName = "SidebarProvider";
-var Sidebar = React94.forwardRef(
+var Sidebar = React96.forwardRef(
   ({
     side = "left",
     variant = "sidebar",
@@ -37046,7 +37368,7 @@ var Sidebar = React94.forwardRef(
   }, ref) => {
     const { isMobile, state, openMobile, setOpenMobile } = useSidebar();
     if (collapsible === "none") {
-      return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
         "div",
         {
           className: cn(
@@ -37060,7 +37382,7 @@ var Sidebar = React94.forwardRef(
       );
     }
     if (isMobile) {
-      return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(Sheet2, { open: openMobile, onOpenChange: setOpenMobile, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime126.jsxs)(
+      return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(Sheet2, { open: openMobile, onOpenChange: setOpenMobile, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime128.jsxs)(
         SheetContent,
         {
           "data-sidebar": "sidebar",
@@ -37071,16 +37393,16 @@ var Sidebar = React94.forwardRef(
           },
           side,
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime126.jsxs)(SheetHeader, { className: "sr-only", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(SheetTitle, { children: "Sidebar" }),
-              /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(SheetDescription, { children: "Displays the mobile sidebar." })
+            /* @__PURE__ */ (0, import_jsx_runtime128.jsxs)(SheetHeader, { className: "sr-only", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(SheetTitle, { children: "Sidebar" }),
+              /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(SheetDescription, { children: "Displays the mobile sidebar." })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime126.jsx)("div", { className: "flex h-full w-full flex-col", children })
+            /* @__PURE__ */ (0, import_jsx_runtime128.jsx)("div", { className: "flex h-full w-full flex-col", children })
           ]
         }
       ) });
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime126.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime128.jsxs)(
       "div",
       {
         ref,
@@ -37090,7 +37412,7 @@ var Sidebar = React94.forwardRef(
         "data-variant": variant,
         "data-side": side,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
             "div",
             {
               className: cn(
@@ -37101,7 +37423,7 @@ var Sidebar = React94.forwardRef(
               )
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
             "div",
             {
               className: cn(
@@ -37112,7 +37434,7 @@ var Sidebar = React94.forwardRef(
                 className
               ),
               ...props,
-              children: /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+              children: /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
                 "div",
                 {
                   "data-sidebar": "sidebar",
@@ -37128,9 +37450,9 @@ var Sidebar = React94.forwardRef(
   }
 );
 Sidebar.displayName = "Sidebar";
-var SidebarTrigger = React94.forwardRef(({ className, onClick, ...props }, ref) => {
+var SidebarTrigger = React96.forwardRef(({ className, onClick, ...props }, ref) => {
   const { toggleSidebar } = useSidebar();
-  return /* @__PURE__ */ (0, import_jsx_runtime126.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime128.jsxs)(
     Button,
     {
       ref,
@@ -37144,16 +37466,16 @@ var SidebarTrigger = React94.forwardRef(({ className, onClick, ...props }, ref)
       },
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(PanelLeft, {}),
-        /* @__PURE__ */ (0, import_jsx_runtime126.jsx)("span", { className: "sr-only", children: "Toggle Sidebar" })
+        /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(PanelLeft, {}),
+        /* @__PURE__ */ (0, import_jsx_runtime128.jsx)("span", { className: "sr-only", children: "Toggle Sidebar" })
       ]
     }
   );
 });
 SidebarTrigger.displayName = "SidebarTrigger";
-var SidebarRail = React94.forwardRef(({ className, ...props }, ref) => {
+var SidebarRail = React96.forwardRef(({ className, ...props }, ref) => {
   const { toggleSidebar } = useSidebar();
-  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
     "button",
     {
       ref,
@@ -37176,8 +37498,8 @@ var SidebarRail = React94.forwardRef(({ className, ...props }, ref) => {
   );
 });
 SidebarRail.displayName = "SidebarRail";
-var SidebarInset = React94.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+var SidebarInset = React96.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
     "main",
     {
       ref,
@@ -37191,8 +37513,8 @@ var SidebarInset = React94.forwardRef(({ className, ...props }, ref) => {
   );
 });
 SidebarInset.displayName = "SidebarInset";
-var SidebarInput = React94.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+var SidebarInput = React96.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
     Input,
     {
       ref,
@@ -37206,8 +37528,8 @@ var SidebarInput = React94.forwardRef(({ className, ...props }, ref) => {
   );
 });
 SidebarInput.displayName = "SidebarInput";
-var SidebarHeader = React94.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+var SidebarHeader = React96.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
     "div",
     {
       ref,
@@ -37218,8 +37540,8 @@ var SidebarHeader = React94.forwardRef(({ className, ...props }, ref) => {
   );
 });
 SidebarHeader.displayName = "SidebarHeader";
-var SidebarFooter = React94.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+var SidebarFooter = React96.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
     "div",
     {
       ref,
@@ -37230,8 +37552,8 @@ var SidebarFooter = React94.forwardRef(({ className, ...props }, ref) => {
   );
 });
 SidebarFooter.displayName = "SidebarFooter";
-var SidebarSeparator = React94.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+var SidebarSeparator = React96.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
     Separator2,
     {
       ref,
@@ -37242,8 +37564,8 @@ var SidebarSeparator = React94.forwardRef(({ className, ...props }, ref) => {
   );
 });
 SidebarSeparator.displayName = "SidebarSeparator";
-var SidebarContent = React94.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+var SidebarContent = React96.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
     "div",
     {
       ref,
@@ -37257,8 +37579,8 @@ var SidebarContent = React94.forwardRef(({ className, ...props }, ref) => {
   );
 });
 SidebarContent.displayName = "SidebarContent";
-var SidebarGroup = React94.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+var SidebarGroup = React96.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
     "div",
     {
       ref,
@@ -37269,9 +37591,9 @@ var SidebarGroup = React94.forwardRef(({ className, ...props }, ref) => {
   );
 });
 SidebarGroup.displayName = "SidebarGroup";
-var SidebarGroupLabel = React94.forwardRef(({ className, asChild = false, ...props }, ref) => {
+var SidebarGroupLabel = React96.forwardRef(({ className, asChild = false, ...props }, ref) => {
   const Comp = asChild ? import_react_slot6.Slot : "div";
-  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
     Comp,
     {
       ref,
@@ -37286,9 +37608,9 @@ var SidebarGroupLabel = React94.forwardRef(({ className, asChild = false, ...pro
   );
 });
 SidebarGroupLabel.displayName = "SidebarGroupLabel";
-var SidebarGroupAction = React94.forwardRef(({ className, asChild = false, ...props }, ref) => {
+var SidebarGroupAction = React96.forwardRef(({ className, asChild = false, ...props }, ref) => {
   const Comp = asChild ? import_react_slot6.Slot : "button";
-  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
     Comp,
     {
       ref,
@@ -37305,7 +37627,7 @@ var SidebarGroupAction = React94.forwardRef(({ className, asChild = false, ...pr
   );
 });
 SidebarGroupAction.displayName = "SidebarGroupAction";
-var SidebarGroupContent = React94.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+var SidebarGroupContent = React96.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
   "div",
   {
     ref,
@@ -37315,7 +37637,7 @@ var SidebarGroupContent = React94.forwardRef(({ className, ...props }, ref) => /
   }
 ));
 SidebarGroupContent.displayName = "SidebarGroupContent";
-var SidebarMenu = React94.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+var SidebarMenu = React96.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
   "ul",
   {
     ref,
@@ -37325,7 +37647,7 @@ var SidebarMenu = React94.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 SidebarMenu.displayName = "SidebarMenu";
-var SidebarMenuItem = React94.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+var SidebarMenuItem = React96.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
   "li",
   {
     ref,
@@ -37355,7 +37677,7 @@ var sidebarMenuButtonVariants = (0, import_class_variance_authority13.cva)(
     }
   }
 );
-var SidebarMenuButton = React94.forwardRef(
+var SidebarMenuButton = React96.forwardRef(
   ({
     asChild = false,
     isActive = false,
@@ -37367,7 +37689,7 @@ var SidebarMenuButton = React94.forwardRef(
   }, ref) => {
     const Comp = asChild ? import_react_slot6.Slot : "button";
     const { isMobile, state } = useSidebar();
-    const button = /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+    const button = /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
       Comp,
       {
         ref,
@@ -37386,9 +37708,9 @@ var SidebarMenuButton = React94.forwardRef(
         children: tooltip
       };
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime126.jsxs)(Tooltip, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(TooltipTrigger, { asChild: true, children: button }),
-      /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime128.jsxs)(Tooltip, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(TooltipTrigger, { asChild: true, children: button }),
+      /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
         TooltipContent,
         {
           side: "right",
@@ -37401,9 +37723,9 @@ var SidebarMenuButton = React94.forwardRef(
   }
 );
 SidebarMenuButton.displayName = "SidebarMenuButton";
-var SidebarMenuAction = React94.forwardRef(({ className, asChild = false, showOnHover = false, ...props }, ref) => {
+var SidebarMenuAction = React96.forwardRef(({ className, asChild = false, showOnHover = false, ...props }, ref) => {
   const Comp = asChild ? import_react_slot6.Slot : "button";
-  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
     Comp,
     {
       ref,
@@ -37424,7 +37746,7 @@ var SidebarMenuAction = React94.forwardRef(({ className, asChild = false, showOn
   );
 });
 SidebarMenuAction.displayName = "SidebarMenuAction";
-var SidebarMenuBadge = React94.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+var SidebarMenuBadge = React96.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
   "div",
   {
     ref,
@@ -37442,11 +37764,11 @@ var SidebarMenuBadge = React94.forwardRef(({ className, ...props }, ref) => /* @
   }
 ));
 SidebarMenuBadge.displayName = "SidebarMenuBadge";
-var SidebarMenuSkeleton = React94.forwardRef(({ className, showIcon = false, ...props }, ref) => {
-  const width = React94.useMemo(() => {
+var SidebarMenuSkeleton = React96.forwardRef(({ className, showIcon = false, ...props }, ref) => {
+  const width = React96.useMemo(() => {
     return `${Math.floor(Math.random() * 40) + 50}%`;
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime126.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime128.jsxs)(
     "div",
     {
       ref,
@@ -37454,14 +37776,14 @@ var SidebarMenuSkeleton = React94.forwardRef(({ className, showIcon = false, ...
       className: cn("flex h-8 items-center gap-2 rounded-md px-2", className),
       ...props,
       children: [
-        showIcon && /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+        showIcon && /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
           Skeleton,
           {
             className: "size-4 rounded-md",
             "data-sidebar": "menu-skeleton-icon"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
           Skeleton,
           {
             className: "h-4 max-w-[--skeleton-width] flex-1",
@@ -37476,7 +37798,7 @@ var SidebarMenuSkeleton = React94.forwardRef(({ className, showIcon = false, ...
   );
 });
 SidebarMenuSkeleton.displayName = "SidebarMenuSkeleton";
-var SidebarMenuSub = React94.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+var SidebarMenuSub = React96.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
   "ul",
   {
     ref,
@@ -37490,11 +37812,11 @@ var SidebarMenuSub = React94.forwardRef(({ className, ...props }, ref) => /* @__
   }
 ));
 SidebarMenuSub.displayName = "SidebarMenuSub";
-var SidebarMenuSubItem = React94.forwardRef(({ ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime126.jsx)("li", { ref, ...props }));
+var SidebarMenuSubItem = React96.forwardRef(({ ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime128.jsx)("li", { ref, ...props }));
 SidebarMenuSubItem.displayName = "SidebarMenuSubItem";
-var SidebarMenuSubButton = React94.forwardRef(({ asChild = false, size = "md", isActive, className, ...props }, ref) => {
+var SidebarMenuSubButton = React96.forwardRef(({ asChild = false, size = "md", isActive, className, ...props }, ref) => {
   const Comp = asChild ? import_react_slot6.Slot : "a";
-  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
     Comp,
     {
       ref,
@@ -37518,20 +37840,20 @@ SidebarMenuSubButton.displayName = "SidebarMenuSubButton";
 // src/components/ui/sonner.tsx
 var import_next_themes = require("next-themes");
 var import_sonner = require("sonner");
-var import_jsx_runtime127 = require("react/jsx-runtime");
+var import_jsx_runtime129 = require("react/jsx-runtime");
 var Toaster = ({ ...props }) => {
   const { theme = "system" } = (0, import_next_themes.useTheme)();
-  return /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
     import_sonner.Toaster,
     {
       theme,
       className: "toaster group",
       icons: {
-        success: /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(CircleCheck, { className: "h-4 w-4" }),
-        info: /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(Info, { className: "h-4 w-4" }),
-        warning: /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(TriangleAlert, { className: "h-4 w-4" }),
-        error: /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(OctagonX, { className: "h-4 w-4" }),
-        loading: /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(LoaderCircle, { className: "h-4 w-4 animate-spin" })
+        success: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(CircleCheck, { className: "h-4 w-4" }),
+        info: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(Info, { className: "h-4 w-4" }),
+        warning: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(TriangleAlert, { className: "h-4 w-4" }),
+        error: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(OctagonX, { className: "h-4 w-4" }),
+        loading: /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(LoaderCircle, { className: "h-4 w-4 animate-spin" })
       },
       toastOptions: {
         classNames: {
@@ -37547,26 +37869,26 @@ var Toaster = ({ ...props }) => {
 };
 
 // src/components/ui/toggle-group.tsx
-var React95 = __toESM(require("react"), 1);
+var React97 = __toESM(require("react"), 1);
 var ToggleGroupPrimitive = __toESM(require("@radix-ui/react-toggle-group"), 1);
-var import_jsx_runtime128 = require("react/jsx-runtime");
-var ToggleGroupContext = React95.createContext({
+var import_jsx_runtime130 = require("react/jsx-runtime");
+var ToggleGroupContext = React97.createContext({
   size: "default",
   variant: "default"
 });
-var ToggleGroup = React95.forwardRef(({ className, variant, size, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
+var ToggleGroup = React97.forwardRef(({ className, variant, size, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
   ToggleGroupPrimitive.Root,
   {
     ref,
     className: cn("flex items-center justify-center gap-1", className),
     ...props,
-    children: /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(ToggleGroupContext.Provider, { value: { variant, size }, children })
+    children: /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(ToggleGroupContext.Provider, { value: { variant, size }, children })
   }
 ));
 ToggleGroup.displayName = ToggleGroupPrimitive.Root.displayName;
-var ToggleGroupItem = React95.forwardRef(({ className, children, variant, size, ...props }, ref) => {
-  const context = React95.useContext(ToggleGroupContext);
-  return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
+var ToggleGroupItem = React97.forwardRef(({ className, children, variant, size, ...props }, ref) => {
+  const context = React97.useContext(ToggleGroupContext);
+  return /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
     ToggleGroupPrimitive.Item,
     {
       ref,
@@ -37585,7 +37907,7 @@ var ToggleGroupItem = React95.forwardRef(({ className, children, variant, size,
 ToggleGroupItem.displayName = ToggleGroupPrimitive.Item.displayName;
 
 // src/render/PXEngineRenderer.tsx
-var import_jsx_runtime129 = require("react/jsx-runtime");
+var import_jsx_runtime131 = require("react/jsx-runtime");
 var CONTEXT_DEPENDENT_COMPONENTS = /* @__PURE__ */ new Set([
   // Form components - require FormField + FormItem context
   "FormLabel",
@@ -37677,24 +37999,24 @@ var COMPONENT_SUGGESTIONS = {
 };
 var renderContextDependentError = (componentName, normalizedName, key) => {
   const suggestion = COMPONENT_SUGGESTIONS[normalizedName] || `${componentName}Atom (if available)`;
-  return /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime131.jsxs)(
     "div",
     {
       className: "p-4 border-2 border-amber-500/50 rounded-lg bg-amber-50/80 space-y-2 my-2",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)("div", { className: "flex items-start gap-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime129.jsx)("span", { className: "text-amber-600 font-bold text-lg", children: "\u26A0\uFE0F" }),
-          /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)("div", { className: "flex-1", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)("p", { className: "text-sm font-semibold text-amber-900", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime131.jsxs)("div", { className: "flex items-start gap-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime131.jsx)("span", { className: "text-amber-600 font-bold text-lg", children: "\u26A0\uFE0F" }),
+          /* @__PURE__ */ (0, import_jsx_runtime131.jsxs)("div", { className: "flex-1", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime131.jsxs)("p", { className: "text-sm font-semibold text-amber-900", children: [
               "Invalid Component: ",
               componentName
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime129.jsx)("p", { className: "text-xs text-amber-700 mt-1", children: "This component requires React Context and cannot be rendered directly in schemas." })
+            /* @__PURE__ */ (0, import_jsx_runtime131.jsx)("p", { className: "text-xs text-amber-700 mt-1", children: "This component requires React Context and cannot be rendered directly in schemas." })
           ] })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)("div", { className: "bg-white/60 p-3 rounded border border-amber-200", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime129.jsx)("p", { className: "text-xs font-semibold text-gray-700 mb-1.5", children: "\u2713 Use instead:" }),
-          /* @__PURE__ */ (0, import_jsx_runtime129.jsx)("code", { className: "text-xs text-blue-700 bg-blue-50 px-2 py-1 rounded", children: suggestion })
+        /* @__PURE__ */ (0, import_jsx_runtime131.jsxs)("div", { className: "bg-white/60 p-3 rounded border border-amber-200", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime131.jsx)("p", { className: "text-xs font-semibold text-gray-700 mb-1.5", children: "\u2713 Use instead:" }),
+          /* @__PURE__ */ (0, import_jsx_runtime131.jsx)("code", { className: "text-xs text-blue-700 bg-blue-50 px-2 py-1 rounded", children: suggestion })
         ] })
       ]
     },
@@ -37765,7 +38087,8 @@ var normalizeProps = (props) => {
 };
 var PXEngineRenderer = ({
   schema,
-  onAction
+  onAction,
+  disabled
 }) => {
   if (!schema) return null;
   const root = schema.root || schema;
@@ -37773,7 +38096,7 @@ var PXEngineRenderer = ({
     if (typeof component === "string" || typeof component === "number") {
       return component;
     }
-    if (import_react64.default.isValidElement(component)) {
+    if (import_react66.default.isValidElement(component)) {
       return component;
     }
     if (!component || typeof component !== "object") return null;
@@ -37789,6 +38112,9 @@ var PXEngineRenderer = ({
     const componentName = name || type || componentType;
     if (!componentName || typeof componentName !== "string") return null;
     const rawProps = { ...remainingProps, ...props };
+    if (disabled !== void 0 && rawProps.disabled === void 0) {
+      rawProps.disabled = disabled;
+    }
     const { normalized: finalProps, dynamicStyle } = normalizeProps(rawProps);
     if (id && !finalProps.id) {
       finalProps.id = id;
@@ -37848,7 +38174,7 @@ var PXEngineRenderer = ({
     const isAtomWithRenderProp = ATOMS_WITH_RENDER.has(atomName);
     const finalStyle = { ...dynamicStyle, ...finalProps.style || {} };
     if (isAtomWithRenderProp) {
-      return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
         TargetComponent,
         {
           ...finalProps,
@@ -37860,7 +38186,7 @@ var PXEngineRenderer = ({
         uniqueKey
       );
     } else {
-      return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
         TargetComponent,
         {
           ...finalProps,
@@ -37872,7 +38198,7 @@ var PXEngineRenderer = ({
       );
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)("div", { className: "px-engine-root relative w-full h-full", children: renderRecursive(root) });
+  return /* @__PURE__ */ (0, import_jsx_runtime131.jsx)("div", { className: "px-engine-root relative w-full h-full", children: renderRecursive(root) });
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
@@ -37919,6 +38245,7 @@ var PXEngineRenderer = ({
   ButtonAtom,
   Calendar,
   CalendarAtom,
+  CampaignConceptCard,
   CampaignSeedCard,
   Card,
   CardAtom,
@@ -37966,6 +38293,7 @@ var PXEngineRenderer = ({
   CreatorActionHeader,
   CreatorGridCard,
   CreatorProfileSummary,
+  CreatorSearch,
   DataGrid,
   Dialog,
   DialogAtom,