pxengine 0.1.21 → 0.1.23

package/dist/index.mjs

@@ -33772,7 +33772,7 @@ var EditableField = React85.memo(
       "div",
       {
         className: cn(
-          "relative z-10 group flex flex-col gap-2 p-3 bg-[#0A0A0A] rounded-md mb-8",
+          "relative z-10 group flex flex-col gap-2 p-3 bg-background dark:bg-gray700 rounded-md mb-8",
           className
         ),
         children: [
@@ -33780,7 +33780,7 @@ var EditableField = React85.memo(
             /* @__PURE__ */ jsx94(
               "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",
+                className: "px-2 py-1 tracking-widest bg-background bg-purple200 text-purpleText dark:text-purple-400 text-[10px] font-bold rounded uppercase",
                 style: { fontFamily: "Noto Sans, sans-serif" },
                 children: label
               }
@@ -33963,7 +33963,7 @@ var FormCard = React87.memo(
       "div",
       {
         className: cn(
-          "relative w-full rounded-[20px] bg-background dark:bg-gray50 border border-gray400 shadow-lg overflow-hidden mb-6",
+          "relative w-full rounded-[20px] bg-background dark:bg-gray100 border border-gray400 shadow-lg overflow-hidden mb-6",
           className
         ),
         onMouseEnter: () => setShowCopyButton(true),
@@ -34548,83 +34548,6 @@ function generateFieldsFromData(data) {
   });
 }
 
-// src/molecules/creator-discovery/CampaignSeedCard/CampaignSeedCard.tsx
-import { jsx as jsx106, jsxs as jsxs66 } from "react/jsx-runtime";
-var CampaignSeedCard = React90.memo(
-  ({
-    selectionStatus,
-    isLatestMessage = true,
-    className,
-    fields: providedFields,
-    data,
-    ...formCardProps
-  }) => {
-    const fields = useMemo4(() => {
-      return providedFields || generateFieldsFromData(data);
-    }, [providedFields, data]);
-    return /* @__PURE__ */ jsxs66("div", { className: "flex flex-col gap-2 mb-10", children: [
-      /* @__PURE__ */ jsx106(
-        FormCard,
-        {
-          ...formCardProps,
-          data,
-          title: formCardProps.title || "Campaign Brief",
-          fields,
-          className,
-          footer: !isLatestMessage && selectionStatus ? /* @__PURE__ */ jsxs66("div", { className: "flex justify-end items-center gap-1.5 text-green-600 text-xs font-semibold py-1 mb-6", children: [
-            /* @__PURE__ */ jsx106(CircleCheck, { className: "h-4 w-4" }),
-            /* @__PURE__ */ jsx106("span", { children: selectionStatus === "agent" ? "Selected by Agent" : "Selected by User" })
-          ] }) : formCardProps.footer
-        }
-      ),
-      !isLatestMessage && selectionStatus && /* @__PURE__ */ jsx106("div", { className: "flex justify-center mt-4", children: /* @__PURE__ */ jsx106(
-        "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
-import React91, { useMemo as useMemo5 } from "react";
-import { jsx as jsx107, jsxs as jsxs67 } from "react/jsx-runtime";
-var SearchSpecCard = React91.memo(
-  ({
-    selectionStatus,
-    isLatestMessage = true,
-    className,
-    fields: providedFields,
-    data,
-    ...formCardProps
-  }) => {
-    const fields = useMemo5(() => {
-      return providedFields || generateFieldsFromData(data);
-    }, [providedFields, data]);
-    return /* @__PURE__ */ jsx107(
-      FormCard,
-      {
-        ...formCardProps,
-        data,
-        title: formCardProps.title || "Search Specification",
-        fields,
-        className,
-        footer: !isLatestMessage && selectionStatus ? /* @__PURE__ */ jsxs67("div", { className: "flex justify-end items-center gap-1.5 text-green-600 text-xs font-semibold py-1", children: [
-          /* @__PURE__ */ jsx107(CircleCheck, { className: "h-4 w-4" }),
-          /* @__PURE__ */ jsx107("span", { children: selectionStatus === "agent" ? "Selected by Agent" : "Selected by User" })
-        ] }) : formCardProps.footer
-      }
-    );
-  }
-);
-SearchSpecCard.displayName = "SearchSpecCard";
-
 // src/molecules/creator-discovery/SearchSpecCard/CustomFieldRenderers.tsx
 import { useState as useState8, useRef as useRef5, useEffect as useEffect6 } from "react";
 
@@ -34833,7 +34756,7 @@ var countriesWithFlags = Object.fromEntries(
 );
 
 // src/molecules/creator-discovery/SearchSpecCard/CustomFieldRenderers.tsx
-import { jsx as jsx108, jsxs as jsxs68 } from "react/jsx-runtime";
+import { jsx as jsx106, jsxs as jsxs66 } from "react/jsx-runtime";
 var CountrySelectEdit = ({
   value,
   onChange
@@ -34851,16 +34774,16 @@ var CountrySelectEdit = ({
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, []);
   const inputValue = Array.isArray(value) ? value : [];
-  return /* @__PURE__ */ jsxs68("div", { className: "space-y-3", children: [
-    /* @__PURE__ */ jsxs68("div", { className: "relative", ref: dropdownRef, children: [
-      /* @__PURE__ */ jsxs68(
+  return /* @__PURE__ */ jsxs66("div", { className: "space-y-3", children: [
+    /* @__PURE__ */ jsxs66("div", { className: "relative", ref: dropdownRef, children: [
+      /* @__PURE__ */ jsxs66(
         "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__ */ jsx108("span", { className: "text-gray-700", children: inputValue.length > 0 ? `${inputValue.length} ${inputValue.length === 1 ? "country" : "countries"} selected` : "Select countries..." }),
-            /* @__PURE__ */ jsx108(
+            /* @__PURE__ */ jsx106("span", { className: "text-gray-700", children: inputValue.length > 0 ? `${inputValue.length} ${inputValue.length === 1 ? "country" : "countries"} selected` : "Select countries..." }),
+            /* @__PURE__ */ jsx106(
               ChevronDown,
               {
                 className: cn(
@@ -34872,8 +34795,8 @@ var CountrySelectEdit = ({
           ]
         }
       ),
-      isDropdownOpen && /* @__PURE__ */ jsxs68("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__ */ jsx108("div", { className: "p-2 border-b border-gray-100", children: /* @__PURE__ */ jsx108(
+      isDropdownOpen && /* @__PURE__ */ jsxs66("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__ */ jsx106("div", { className: "p-2 border-b border-gray-100", children: /* @__PURE__ */ jsx106(
           "input",
           {
             type: "text",
@@ -34884,9 +34807,9 @@ var CountrySelectEdit = ({
             onClick: (e) => e.stopPropagation()
           }
         ) }),
-        /* @__PURE__ */ jsx108("div", { className: "max-h-40 overflow-y-auto p-1", children: countries.filter(
+        /* @__PURE__ */ jsx106("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__ */ jsxs68(
+        ).map((country) => /* @__PURE__ */ jsxs66(
           "div",
           {
             className: cn(
@@ -34907,31 +34830,31 @@ var CountrySelectEdit = ({
               }
             },
             children: [
-              /* @__PURE__ */ jsxs68("div", { className: "flex items-center gap-2", children: [
-                /* @__PURE__ */ jsx108("span", { className: "text-sm text-gray-700", children: country.name }),
-                /* @__PURE__ */ jsx108("span", { className: "text-xs text-gray-400 font-mono", children: country.code })
+              /* @__PURE__ */ jsxs66("div", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ jsx106("span", { className: "text-sm text-gray-700", children: country.name }),
+                /* @__PURE__ */ jsx106("span", { className: "text-xs text-gray-400 font-mono", children: country.code })
               ] }),
-              inputValue.includes(country.code) && /* @__PURE__ */ jsx108(Check, { className: "h-4 w-4 text-purple500" })
+              inputValue.includes(country.code) && /* @__PURE__ */ jsx106(Check, { className: "h-4 w-4 text-purple500" })
             ]
           },
           country.code
         )) })
       ] })
     ] }),
-    inputValue.length > 0 && /* @__PURE__ */ jsx108("div", { className: "flex flex-wrap gap-1.5", children: inputValue.map((countryCode) => /* @__PURE__ */ jsxs68(
+    inputValue.length > 0 && /* @__PURE__ */ jsx106("div", { className: "flex flex-wrap gap-1.5", children: inputValue.map((countryCode) => /* @__PURE__ */ jsxs66(
       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__ */ jsxs68(
+          /* @__PURE__ */ jsxs66(
             "button",
             {
               onClick: () => onChange(inputValue.filter((c) => c !== countryCode)),
               className: "hover:bg-purple200 rounded-full p-0.5 transition-colors",
               children: [
-                /* @__PURE__ */ jsx108(ChevronDown, { className: "h-3 w-3 rotate-45" }),
+                /* @__PURE__ */ jsx106(ChevronDown, { className: "h-3 w-3 rotate-45" }),
                 " "
               ]
             }
@@ -34944,9 +34867,9 @@ var CountrySelectEdit = ({
 };
 var CountrySelectDisplay = ({ value }) => {
   if (!value || !Array.isArray(value) || value.length === 0) {
-    return /* @__PURE__ */ jsx108("span", { className: "text-muted-foreground italic", children: "Not specified" });
+    return /* @__PURE__ */ jsx106("span", { className: "text-muted-foreground italic", children: "Not specified" });
   }
-  return /* @__PURE__ */ jsx108("div", { className: "flex flex-wrap gap-1.5", children: value.map((countryCode) => /* @__PURE__ */ jsx108(
+  return /* @__PURE__ */ jsx106("div", { className: "flex flex-wrap gap-1.5", children: value.map((countryCode) => /* @__PURE__ */ jsx106(
     Badge2,
     {
       variant: "outline",
@@ -34968,22 +34891,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__ */ jsx108("div", { className: "space-y-6 pt-2", children: sortedPriorities.map((priority) => /* @__PURE__ */ jsxs68("div", { className: "space-y-3", children: [
-    /* @__PURE__ */ jsxs68("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ jsxs68(Badge2, { className: "bg-purple500 hover:bg-purple500", children: [
+  return /* @__PURE__ */ jsx106("div", { className: "space-y-6 pt-2", children: sortedPriorities.map((priority) => /* @__PURE__ */ jsxs66("div", { className: "space-y-3", children: [
+    /* @__PURE__ */ jsxs66("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsxs66(Badge2, { className: "bg-purple500 hover:bg-purple500", children: [
         "Priority ",
         priority
       ] }),
-      /* @__PURE__ */ jsx108("div", { className: "h-px flex-1 bg-gray-100" })
+      /* @__PURE__ */ jsx106("div", { className: "h-px flex-1 bg-gray-100" })
     ] }),
-    groups[priority].map(({ bundle, index: bundleIndex }) => /* @__PURE__ */ jsx108(
+    groups[priority].map(({ bundle, index: bundleIndex }) => /* @__PURE__ */ jsx106(
       "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__ */ jsxs68("div", { className: "flex flex-col gap-3", children: [
-          /* @__PURE__ */ jsx108("label", { className: "text-[10px] font-bold text-gray-400 uppercase tracking-widest pl-1", children: "Keywords" }),
-          /* @__PURE__ */ jsxs68("div", { className: "space-y-3", children: [
-            /* @__PURE__ */ jsx108("div", { className: "flex flex-wrap gap-1.5", children: Array.isArray(bundle.keywords) && bundle.keywords.map((keyword, kIndex) => /* @__PURE__ */ jsxs68(
+        children: /* @__PURE__ */ jsxs66("div", { className: "flex flex-col gap-3", children: [
+          /* @__PURE__ */ jsx106("label", { className: "text-[10px] font-bold text-gray-400 uppercase tracking-widest pl-1", children: "Keywords" }),
+          /* @__PURE__ */ jsxs66("div", { className: "space-y-3", children: [
+            /* @__PURE__ */ jsx106("div", { className: "flex flex-wrap gap-1.5", children: Array.isArray(bundle.keywords) && bundle.keywords.map((keyword, kIndex) => /* @__PURE__ */ jsxs66(
               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",
@@ -34999,12 +34922,12 @@ var KeywordBundlesEdit = ({
                 },
                 children: [
                   keyword,
-                  /* @__PURE__ */ jsx108("span", { className: "ml-1 opacity-0 group-hover:opacity-100 transition-opacity", children: "\xD7" })
+                  /* @__PURE__ */ jsx106("span", { className: "ml-1 opacity-0 group-hover:opacity-100 transition-opacity", children: "\xD7" })
                 ]
               },
               kIndex
             )) }),
-            /* @__PURE__ */ jsx108("div", { className: "flex gap-2", children: /* @__PURE__ */ jsx108(
+            /* @__PURE__ */ jsx106("div", { className: "flex gap-2", children: /* @__PURE__ */ jsx106(
               "input",
               {
                 type: "text",
@@ -35028,9 +34951,9 @@ var KeywordBundlesEdit = ({
               }
             ) })
           ] }),
-          /* @__PURE__ */ jsxs68("div", { className: "flex flex-col gap-1.5 mt-1", children: [
-            /* @__PURE__ */ jsx108("label", { className: "text-[10px] font-bold text-gray-400 uppercase tracking-widest pl-1", children: "Priority Level (1-5)" }),
-            /* @__PURE__ */ jsx108(
+          /* @__PURE__ */ jsxs66("div", { className: "flex flex-col gap-1.5 mt-1", children: [
+            /* @__PURE__ */ jsx106("label", { className: "text-[10px] font-bold text-gray-400 uppercase tracking-widest pl-1", children: "Priority Level (1-5)" }),
+            /* @__PURE__ */ jsx106(
               "input",
               {
                 type: "number",
@@ -35058,7 +34981,7 @@ var KeywordBundlesEdit = ({
 var KeywordBundlesDisplay = ({ value }) => {
   const bundles = Array.isArray(value) ? value : [];
   if (bundles.length === 0)
-    return /* @__PURE__ */ jsx108("span", { className: "text-gray-500 italic text-sm", children: "Not specified" });
+    return /* @__PURE__ */ jsx106("span", { className: "text-gray-500 italic text-sm", children: "Not specified" });
   const groups = {};
   bundles.forEach((b) => {
     const p = Number(b?.priority) || 1;
@@ -35067,20 +34990,20 @@ var KeywordBundlesDisplay = ({ value }) => {
     groups[p].push(...keywords);
   });
   const sortedPriorities = Object.keys(groups).map((n) => parseInt(n)).sort((a, b) => a - b);
-  return /* @__PURE__ */ jsx108("div", { className: "space-y-4 pt-2", children: sortedPriorities.map((priority) => {
+  return /* @__PURE__ */ jsx106("div", { className: "space-y-4 pt-2", children: sortedPriorities.map((priority) => {
     const deduped = Array.from(new Set(groups[priority]));
-    return /* @__PURE__ */ jsxs68("div", { className: "space-y-2", children: [
-      /* @__PURE__ */ jsxs68("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsxs68("span", { className: "text-[10px] uppercase tracking-widest text-purple-400 font-bold", children: [
+    return /* @__PURE__ */ jsxs66("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ jsxs66("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsxs66("span", { className: "text-[10px] uppercase tracking-widest text-purple-400 font-bold", children: [
           "Priority ",
           priority
         ] }),
-        /* @__PURE__ */ jsx108("div", { className: "h-[1px] flex-1 bg-white/10" })
+        /* @__PURE__ */ jsx106("div", { className: "h-[1px] flex-1 bg-white/10" })
       ] }),
-      /* @__PURE__ */ jsx108("div", { className: "flex flex-wrap gap-2", children: deduped.map((keyword) => /* @__PURE__ */ jsx108(
+      /* @__PURE__ */ jsx106("div", { className: "flex flex-wrap gap-2", children: deduped.map((keyword) => /* @__PURE__ */ jsx106(
         "div",
         {
-          className: "px-2 py-1 rounded bg-[#1A1A1A] border border-white/10 text-gray-300 text-xs font-medium",
+          className: "px-2 py-1 rounded bg-background bg-gray400 border border-white/10 text-gray-300 text-xs font-medium",
           children: keyword
         },
         keyword
@@ -35089,6 +35012,224 @@ var KeywordBundlesDisplay = ({ value }) => {
   }) });
 };
 
+// src/molecules/creator-discovery/CampaignSeedCard/CampaignSeedCard.tsx
+import { jsx as jsx107, jsxs as jsxs67 } from "react/jsx-runtime";
+var ObjectDisplay = ({ value }) => {
+  if (!value || typeof value !== "object") return null;
+  return /* @__PURE__ */ jsx107("div", { className: "space-y-1 pt-1", children: Object.entries(value).map(([k, v]) => /* @__PURE__ */ jsxs67("div", { className: "flex gap-2 text-sm", children: [
+    /* @__PURE__ */ jsxs67("span", { className: "text-muted-foreground capitalize min-w-[120px]", children: [
+      k.replace(/_/g, " "),
+      ":"
+    ] }),
+    /* @__PURE__ */ jsx107("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__ */ jsx107("span", { className: "text-muted-foreground italic text-sm", children: "Not specified" });
+  return /* @__PURE__ */ jsx107("div", { className: "flex flex-wrap gap-1.5 pt-1", children: value.map((item) => /* @__PURE__ */ jsx107(Badge2, { variant: "outline", className: "text-xs", children: item }, item)) });
+};
+function buildCampaignSeedFields(data) {
+  if (!data || typeof data !== "object") return [];
+  return Object.keys(data).map((key) => {
+    const value = data[key];
+    if (key === "keyword_bundles" || key === "keywordBundles") {
+      return {
+        key,
+        label: "Keyword Bundles",
+        type: "custom",
+        renderDisplay: (v) => /* @__PURE__ */ jsx107(KeywordBundlesDisplay, { value: v })
+      };
+    }
+    if (key === "geography") {
+      return {
+        key,
+        label: "Geography",
+        type: "custom",
+        renderDisplay: (v) => /* @__PURE__ */ jsx107(CountrySelectDisplay, { value: v })
+      };
+    }
+    if (key === "platforms" && Array.isArray(value)) {
+      return {
+        key,
+        label: "Platforms",
+        type: "custom",
+        renderDisplay: (v) => {
+          const platforms = Array.isArray(v) ? v : [v];
+          return /* @__PURE__ */ jsx107("div", { className: "flex flex-wrap gap-2", children: platforms.map((p) => /* @__PURE__ */ jsx107(
+            BadgeAtom,
+            {
+              id: `platform-${p}`,
+              type: "badge",
+              label: p,
+              variant: "outline",
+              className: "bg-background bg-purple200 border-gray400 text-white font-medium"
+            },
+            p
+          )) });
+        }
+      };
+    }
+    if (Array.isArray(value) && value.every((v) => typeof v === "string")) {
+      const label = key.split(/_|(?=[A-Z])/).map((w) => w.charAt(0).toUpperCase() + w.slice(1).toLowerCase()).join(" ");
+      return {
+        key,
+        label,
+        type: "custom",
+        renderDisplay: (v) => /* @__PURE__ */ jsx107(StringArrayDisplay, { value: v })
+      };
+    }
+    if (typeof value === "object" && value !== null && !Array.isArray(value) && "min" in value && "max" in value) {
+      const label = key.split(/_|(?=[A-Z])/).map((w) => w.charAt(0).toUpperCase() + w.slice(1).toLowerCase()).join(" ");
+      return {
+        key,
+        label,
+        type: "custom",
+        renderDisplay: (v) => {
+          if (typeof v === "object" && v !== null) {
+            return /* @__PURE__ */ jsx107("span", { className: "text-white font-medium", children: `${v.min?.toLocaleString()} - ${v.max?.toLocaleString()}` });
+          }
+          return /* @__PURE__ */ jsx107("span", { className: "text-white font-medium", children: v });
+        }
+      };
+    }
+    if (typeof value === "object" && value !== null && !Array.isArray(value)) {
+      const label = key.split(/_|(?=[A-Z])/).map((w) => w.charAt(0).toUpperCase() + w.slice(1).toLowerCase()).join(" ");
+      return {
+        key,
+        label,
+        type: "custom",
+        renderDisplay: (v) => /* @__PURE__ */ jsx107(ObjectDisplay, { value: v })
+      };
+    }
+    const [generated] = generateFieldsFromData({ [key]: value });
+    return generated;
+  });
+}
+var CampaignSeedCard = React90.memo(
+  ({
+    selectionStatus,
+    isLatestMessage = true,
+    className,
+    fields: providedFields,
+    data,
+    ...formCardProps
+  }) => {
+    const fields = useMemo4(() => {
+      return providedFields || buildCampaignSeedFields(data);
+    }, [providedFields, data]);
+    return /* @__PURE__ */ jsx107("div", { className: "flex flex-col gap-2", children: /* @__PURE__ */ jsx107(
+      FormCard,
+      {
+        ...formCardProps,
+        data,
+        title: formCardProps.title || "Campaign Brief",
+        fields,
+        showTimeline: true,
+        className: cn("font-noto", className),
+        footer: !isLatestMessage && selectionStatus ? /* @__PURE__ */ jsxs67("div", { className: "flex justify-end items-center gap-1.5 text-green-600 text-[10px] font-semibold py-4 pr-6", children: [
+          /* @__PURE__ */ jsx107(CircleCheck, { className: "h-3.5 w-3.5" }),
+          /* @__PURE__ */ jsx107("span", { children: selectionStatus === "agent" ? "Suggested by Agent" : "Selected by you" })
+        ] }) : formCardProps.footer
+      }
+    ) });
+  }
+);
+CampaignSeedCard.displayName = "CampaignSeedCard";
+
+// src/molecules/creator-discovery/SearchSpecCard/SearchSpecCard.tsx
+import React91, { useMemo as useMemo5 } from "react";
+import { jsx as jsx108, jsxs as jsxs68 } from "react/jsx-runtime";
+var ObjectDisplay2 = ({ value }) => {
+  if (!value || typeof value !== "object") return null;
+  return /* @__PURE__ */ jsx108("div", { className: "space-y-1 pt-1", children: Object.entries(value).map(([k, v]) => /* @__PURE__ */ jsxs68("div", { className: "flex gap-2 text-sm", children: [
+    /* @__PURE__ */ jsxs68("span", { className: "text-muted-foreground capitalize min-w-[120px]", children: [
+      k.replace(/_/g, " "),
+      ":"
+    ] }),
+    /* @__PURE__ */ jsx108("span", { className: "text-foreground font-medium", children: Array.isArray(v) ? v.join(", ") : String(v) })
+  ] }, k)) });
+};
+var StringArrayDisplay2 = ({ value }) => {
+  if (!Array.isArray(value) || value.length === 0)
+    return /* @__PURE__ */ jsx108("span", { className: "text-muted-foreground italic text-sm", children: "Not specified" });
+  return /* @__PURE__ */ jsx108("div", { className: "flex flex-wrap gap-1.5 pt-1", children: value.map((item) => /* @__PURE__ */ jsx108(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__ */ jsx108(KeywordBundlesDisplay, { value: v }),
+        renderEdit: (v, onChange) => /* @__PURE__ */ jsx108(KeywordBundlesEdit, { value: v, onChange })
+      };
+    }
+    if (key === "geography") {
+      return {
+        key,
+        label: "Geography",
+        type: "custom",
+        renderDisplay: (v) => /* @__PURE__ */ jsx108(CountrySelectDisplay, { value: v }),
+        renderEdit: (v, onChange) => /* @__PURE__ */ jsx108(CountrySelectEdit, { value: v, onChange })
+      };
+    }
+    if (key === "platforms" && Array.isArray(value)) {
+      return {
+        key,
+        label: "Platforms",
+        type: "custom",
+        renderDisplay: (v) => /* @__PURE__ */ jsx108(StringArrayDisplay2, { 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__ */ jsx108(ObjectDisplay2, { value: v })
+      };
+    }
+    const [generated] = generateFieldsFromData({ [key]: value });
+    return generated;
+  });
+}
+var SearchSpecCard = React91.memo(
+  ({
+    selectionStatus,
+    isLatestMessage = true,
+    className,
+    fields: providedFields,
+    data,
+    specData,
+    ...formCardProps
+  }) => {
+    const resolvedData = data || specData;
+    const fields = useMemo5(() => {
+      return providedFields || buildSearchSpecFields(resolvedData ?? {});
+    }, [providedFields, resolvedData]);
+    return /* @__PURE__ */ jsx108(
+      FormCard,
+      {
+        ...formCardProps,
+        data: resolvedData ?? {},
+        title: formCardProps.title || "Search Specification",
+        fields,
+        className,
+        footer: !isLatestMessage && selectionStatus ? /* @__PURE__ */ jsxs68("div", { className: "flex justify-end items-center gap-1.5 text-green-600 text-xs font-semibold py-1", children: [
+          /* @__PURE__ */ jsx108(CircleCheck, { className: "h-4 w-4" }),
+          /* @__PURE__ */ jsx108("span", { children: selectionStatus === "agent" ? "Selected by Agent" : "Selected by User" })
+        ] }) : formCardProps.footer
+      }
+    );
+  }
+);
+SearchSpecCard.displayName = "SearchSpecCard";
+
 // src/molecules/creator-discovery/MCQCard/MCQCard.tsx
 import React92 from "react";
 import { jsx as jsx109, jsxs as jsxs69 } from "react/jsx-runtime";
@@ -35108,15 +35249,17 @@ var MCQCard = React92.memo(
     disabled = false
   }) => {
     const [selectedOption, setSelectedOption] = React92.useState(propsSelectedOption);
+    const [isProceeded, setIsProceeded] = React92.useState(false);
     React92.useEffect(() => {
       if (propsSelectedOption) {
         setSelectedOption(propsSelectedOption);
+        setIsProceeded(true);
       }
     }, [propsSelectedOption]);
     const handleOptionClick = (key, e) => {
       e.preventDefault();
       e.stopPropagation();
-      if (isLatestMessage && !isLoading && !disabled) {
+      if (isLatestMessage && !isLoading && !disabled && !isProceeded) {
         setSelectedOption(key);
         onSelect?.(key);
       }
@@ -35124,8 +35267,9 @@ var MCQCard = React92.memo(
     const handleProceed = (e) => {
       e.preventDefault();
       e.stopPropagation();
-      if ((selectedOption || recommended) && !disabled) {
+      if ((selectedOption || recommended) && !disabled && !isProceeded) {
         const result = selectedOption || recommended || "";
+        setIsProceeded(true);
         onProceed?.(result);
         onAction?.({
           type: "mcq_selection",
@@ -35134,7 +35278,7 @@ var MCQCard = React92.memo(
         });
       }
     };
-    const isInteractionDisabled = disabled || !isLatestMessage;
+    const isInteractionDisabled = disabled || !isLatestMessage || isProceeded;
     return /* @__PURE__ */ jsxs69(
       "div",
       {
@@ -35717,7 +35861,7 @@ var CreatorSearch = React93.memo(
                   type: "badge",
                   label: p,
                   variant: "outline",
-                  className: "bg-[#1A1A1A] border-gray400 text-white font-medium"
+                  className: "bg-background bg-gray200 border-gray400 text-white font-medium"
                 },
                 p
               )) });
@@ -35820,9 +35964,9 @@ var CampaignConceptCard = React94.memo(
                   idx + 1,
                   "."
                 ] }),
-                /* @__PURE__ */ jsx121("div", { className: "bg-[#1A1A1A] border border-white/10 px-2 py-0.5 rounded text-gray-300", children: item.label }),
+                /* @__PURE__ */ jsx121("div", { className: "bg-background bg-gray400 border border-white/10 px-2 py-0.5 rounded text-gray-300", children: item.label }),
                 /* @__PURE__ */ jsx121("span", { className: "text-gray-400", children: "=" }),
-                /* @__PURE__ */ jsx121("div", { className: "bg-[#1A1A1A] border border-white/10 px-2 py-0.5 rounded text-gray-300", children: item.value })
+                /* @__PURE__ */ jsx121("div", { className: "bg-background bg-gray400 border border-white/10 px-2 py-0.5 rounded text-gray-300", children: item.value })
               ] }, idx)) });
             }
           };
@@ -35832,7 +35976,7 @@ var CampaignConceptCard = React94.memo(
             ...field,
             renderDisplay: (val) => {
               if (!Array.isArray(val)) return /* @__PURE__ */ jsx121("span", { className: "text-white font-medium", children: val });
-              return /* @__PURE__ */ jsx121("div", { className: "flex gap-2", children: val.map((v, idx) => /* @__PURE__ */ jsx121("div", { className: "bg-[#1A1A1A] border border-white/10 px-2 py-0.5 rounded text-white text-xs font-medium", children: v }, idx)) });
+              return /* @__PURE__ */ jsx121("div", { className: "flex gap-2", children: val.map((v, idx) => /* @__PURE__ */ jsx121("div", { className: "bg-background bg-gray400 border border-white/10 px-2 py-0.5 rounded text-white text-xs font-medium", children: v }, idx)) });
             }
           };
         }