pxengine 0.1.90 → 0.1.92

package/dist/index.d.cts

@@ -3202,6 +3202,8 @@ interface PresentationJobCardProps {
      */
     shareUrl?: string;
     className?: string;
+    /** Organization brand theme — when provided, the card adopts its colors. */
+    theme?: WidgetTheme;
     onAction?: (action: string, payload?: any) => void;
     sendMessage?: (message: string) => void;
     /**
@@ -3568,6 +3570,10 @@ interface MCQCardProps {
  * A molecule for Multiple Choice Questions.
  * Self-contained: when `sessionId` + `sendMessage` are provided,
  * it manages its own persistence and agent communication.
+ *
+ * Honors an optional `theme` (WidgetTheme): when provided, the card adopts the
+ * organization's brand colors via inline styles that override the default
+ * Tailwind palette. With no theme it renders exactly as before.
  */
 declare const MCQCard: React__default.NamedExoticComponent<MCQCardProps & {
     disableContinueInDiscovery?: boolean;

package/dist/index.d.ts

@@ -3202,6 +3202,8 @@ interface PresentationJobCardProps {
      */
     shareUrl?: string;
     className?: string;
+    /** Organization brand theme — when provided, the card adopts its colors. */
+    theme?: WidgetTheme;
     onAction?: (action: string, payload?: any) => void;
     sendMessage?: (message: string) => void;
     /**
@@ -3568,6 +3570,10 @@ interface MCQCardProps {
  * A molecule for Multiple Choice Questions.
  * Self-contained: when `sessionId` + `sendMessage` are provided,
  * it manages its own persistence and agent communication.
+ *
+ * Honors an optional `theme` (WidgetTheme): when provided, the card adopts the
+ * organization's brand colors via inline styles that override the default
+ * Tailwind palette. With no theme it renders exactly as before.
  */
 declare const MCQCard: React__default.NamedExoticComponent<MCQCardProps & {
     disableContinueInDiscovery?: boolean;

package/dist/index.mjs

@@ -38925,9 +38925,12 @@ var PresentationJobCard = ({
   authToken,
   shareUrl,
   className,
+  theme,
   onComplete,
   onFailed
 }) => {
+  const t = th(theme);
+  const accentGradient = theme?.gradient;
   const [status, setStatus] = useState10(initialStatus);
   const [title, setTitle] = useState10(initialTitle);
   const [slideCount, setSlideCount] = useState10(initialSlideCount ?? 0);
@@ -39091,22 +39094,30 @@ var PresentationJobCard = ({
       }
     };
     return /* @__PURE__ */ jsxs108("div", { className: cn("w-full", className), children: [
-      /* @__PURE__ */ jsxs108("div", { className: "bg-zinc-900 border border-zinc-800 rounded-2xl overflow-hidden", children: [
+      /* @__PURE__ */ jsxs108("div", { className: "bg-zinc-900 border border-zinc-800 rounded-2xl overflow-hidden", style: t.root, children: [
         /* @__PURE__ */ jsx147(
           "div",
           {
             className: "h-[3px] bg-gradient-to-r from-indigo-500 via-purple-500 to-indigo-500 bg-[length:200%_100%] animate-[gradient-shift_2s_ease-in-out_infinite]",
             style: {
               backgroundSize: "200% 100%",
-              animation: "gradient-shift 2s ease-in-out infinite"
+              animation: "gradient-shift 2s ease-in-out infinite",
+              ...accentGradient ? { backgroundImage: accentGradient } : {}
             }
           }
         ),
         /* @__PURE__ */ jsxs108("div", { className: "p-5", children: [
           /* @__PURE__ */ jsxs108("div", { className: "flex items-start gap-3", children: [
-            /* @__PURE__ */ jsx147("div", { className: "w-10 h-10 rounded-xl bg-indigo-500/10 border border-indigo-500/20 flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx147("span", { className: "text-lg", children: getPhaseIcon() }) }),
+            /* @__PURE__ */ jsx147(
+              "div",
+              {
+                className: "w-10 h-10 rounded-xl bg-indigo-500/10 border border-indigo-500/20 flex items-center justify-center flex-shrink-0",
+                style: { ...t.accentSubtle(0.1), ...t.accentBorder },
+                children: /* @__PURE__ */ jsx147("span", { className: "text-lg", children: getPhaseIcon() })
+              }
+            ),
             /* @__PURE__ */ jsxs108("div", { className: "flex-1 min-w-0", children: [
-              /* @__PURE__ */ jsx147("h3", { className: "text-sm font-semibold text-zinc-100 truncate leading-tight", children: title || "Creating Presentation" }),
+              /* @__PURE__ */ jsx147("h3", { className: "text-sm font-semibold text-zinc-100 truncate leading-tight", style: t.text, children: title || "Creating Presentation" }),
               /* @__PURE__ */ jsxs108("p", { className: "text-xs text-zinc-500 mt-0.5", children: [
                 slidesTotal > 0 ? `${slidesTotal} slides` : "Presentation",
                 " \xB7 In progress"
@@ -39119,7 +39130,10 @@ var PresentationJobCard = ({
                 "div",
                 {
                   className: "h-full bg-gradient-to-r from-indigo-500 to-purple-500 rounded-full transition-all duration-500 ease-out",
-                  style: { width: `${Math.max(pct, 2)}%` }
+                  style: {
+                    width: `${Math.max(pct, 2)}%`,
+                    ...accentGradient ? { backgroundImage: accentGradient } : t.accentBg
+                  }
                 }
               ) }),
               /* @__PURE__ */ jsxs108("span", { className: "absolute right-0 -top-5 text-xs text-zinc-500 font-medium tabular-nums", children: [
@@ -39128,7 +39142,7 @@ var PresentationJobCard = ({
               ] })
             ] }),
             /* @__PURE__ */ jsxs108("div", { className: "flex items-center gap-2", children: [
-              /* @__PURE__ */ jsx147("div", { className: "w-2 h-2 rounded-full bg-indigo-500 animate-pulse" }),
+              /* @__PURE__ */ jsx147("div", { className: "w-2 h-2 rounded-full bg-indigo-500 animate-pulse", style: t.accentBg }),
               /* @__PURE__ */ jsx147("span", { className: "text-xs text-zinc-400", children: step })
             ] }),
             phase === "ai_generation" && slidesTotal > 0 && /* @__PURE__ */ jsxs108("div", { className: "flex items-center gap-2 pt-1", children: [
@@ -39172,14 +39186,21 @@ var PresentationJobCard = ({
   const total = slideCount || 1;
   const hasHtml = Boolean(formats.html_url);
   return /* @__PURE__ */ jsxs108(Fragment5, { children: [
-    /* @__PURE__ */ jsx147("div", { className: cn("w-full", className), children: /* @__PURE__ */ jsxs108("div", { className: "bg-zinc-900 border border-zinc-800 rounded-2xl overflow-hidden", children: [
-      /* @__PURE__ */ jsx147("div", { className: "h-[3px]", style: { background: "linear-gradient(90deg, #8B7D5E, #C0AE82, #DCC99B)" } }),
+    /* @__PURE__ */ jsx147("div", { className: cn("w-full", className), children: /* @__PURE__ */ jsxs108("div", { className: "bg-zinc-900 border border-zinc-800 rounded-2xl overflow-hidden", style: t.root, children: [
+      /* @__PURE__ */ jsx147("div", { className: "h-[3px]", style: { background: accentGradient || "linear-gradient(90deg, #8B7D5E, #C0AE82, #DCC99B)" } }),
       /* @__PURE__ */ jsxs108("div", { className: "p-5", children: [
         /* @__PURE__ */ jsxs108("div", { className: "flex items-start gap-3", children: [
-          /* @__PURE__ */ jsx147("div", { className: "w-10 h-10 rounded-xl bg-indigo-500/10 border border-indigo-500/20 flex items-center justify-center flex-shrink-0 text-indigo-400", children: /* @__PURE__ */ jsx147(SlidesIcon, {}) }),
+          /* @__PURE__ */ jsx147(
+            "div",
+            {
+              className: "w-10 h-10 rounded-xl bg-indigo-500/10 border border-indigo-500/20 flex items-center justify-center flex-shrink-0 text-indigo-400",
+              style: { ...t.accentSubtle(0.1), ...t.accentBorder, ...t.accent },
+              children: /* @__PURE__ */ jsx147(SlidesIcon, {})
+            }
+          ),
           /* @__PURE__ */ jsxs108("div", { className: "flex-1 min-w-0", children: [
-            /* @__PURE__ */ jsx147("h3", { className: "text-sm font-semibold text-zinc-100 truncate leading-tight", children: title }),
-            /* @__PURE__ */ jsxs108("p", { className: "text-xs text-zinc-500 mt-0.5", children: [
+            /* @__PURE__ */ jsx147("h3", { className: "text-sm font-semibold text-zinc-100 truncate leading-tight", style: t.text, children: title }),
+            /* @__PURE__ */ jsxs108("p", { className: "text-xs text-zinc-500 mt-0.5", style: t.muted, children: [
               slideCount ? `${slideCount} slides` : "Presentation",
               " \xB7 Ready to export"
             ] })
@@ -39217,6 +39238,7 @@ var PresentationJobCard = ({
               {
                 onClick: () => setShowExport(true),
                 className: "flex items-center gap-1.5 px-2.5 h-7 bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 text-white text-xs font-medium rounded-lg transition-colors",
+                style: { ...t.accentBg, ...t.accentText },
                 children: [
                   /* @__PURE__ */ jsx147(DownloadIcon, {}),
                   /* @__PURE__ */ jsx147("span", { children: "Export" })
@@ -41097,6 +41119,7 @@ var MCQCard = React111.memo(
     onAction,
     disabled = false,
     disableContinueInDiscovery,
+    theme,
     // Self-contained props
     sessionId,
     sendMessage,
@@ -41106,8 +41129,7 @@ var MCQCard = React111.memo(
   }) => {
     const resolvedQuestion = question || allProps.Question || allProps.q || "";
     const resolvedOptions = options || allProps.Options || allProps.opts || {};
-    const resolvedRecommended = recommended || allProps.Recommended || allProps.rec;
-    console.log("[MCQCard] FULL PROPS:", { allProps, resolvedQuestion, resolvedOptions: Object.keys(resolvedOptions || {}), resolvedRecommended });
+    const t = th(theme);
     const [selectedOption, setSelectedOption] = React111.useState(propsSelectedOption);
     const [isProceeded, setIsProceeded] = React111.useState(false);
     const fetchedSessionRef = React111.useRef("");
@@ -41132,24 +41154,20 @@ var MCQCard = React111.memo(
       if (propsSelectedOption) return;
       fetchedSessionRef.current = fetchKey;
       const questionKey = buildQuestionKey(sessionId, resolvedQuestion);
-      console.log("[MCQCard] Fetching with key:", questionKey, "(question:", resolvedQuestion, ")");
       fetchSelections(sessionId).then((selections) => {
-        console.log("[MCQCard] Got selections:", selections);
         const stored = selections[questionKey] || selections[resolvedQuestion] || selections[`mcq_${sessionId}`];
         if (stored) {
-          console.log("[MCQCard] Setting selected:", stored);
           setSelectedOption(stored);
           setIsProceeded(true);
         }
-      }).catch((err) => console.error("[MCQCard] Fetch error:", err));
+      }).catch(() => {
+      });
     }, [sessionId, propsSelectedOption, resolvedQuestion, buildQuestionKey]);
     const isDiscovery = disableContinueInDiscovery !== void 0 ? disableContinueInDiscovery : typeof window !== "undefined" && window.location.pathname.includes("creator-discovery");
     const handleOptionClick = (key, e) => {
       e.preventDefault();
       e.stopPropagation();
-      console.log("[MCQCard] Option clicked:", key, "Can select:", isLatestMessage && !isLoading && !disabled && !isProceeded);
       if (isLatestMessage && !isLoading && !disabled && !isProceeded) {
-        console.log("[MCQCard] Setting selected to:", key);
         setSelectedOption(key);
         onSelect?.(key);
       }
@@ -41167,7 +41185,6 @@ var MCQCard = React111.memo(
         setIsProceeded(true);
         if (sessionId && resolvedQuestion) {
           const questionKey = buildQuestionKey(sessionId, resolvedQuestion);
-          console.log("[MCQCard] Persisting:", questionKey, result);
           await persistSelection(sessionId, questionKey, result);
         }
         if (sendMessage) {
@@ -41195,8 +41212,9 @@ A: ${label}`);
           "p-4 rounded-lg border border-gray400 bg-cardSurface w-full",
           className
         ),
+        style: t.root,
         children: [
-          /* @__PURE__ */ jsx153("div", { className: "mb-4", children: /* @__PURE__ */ jsx153("p", { className: "text-sm text-cardText", children: resolvedQuestion || "Select an option:" }) }),
+          /* @__PURE__ */ jsx153("div", { className: "mb-4", children: /* @__PURE__ */ jsx153("p", { className: "text-sm text-cardText", style: t.text, children: resolvedQuestion || "Select an option:" }) }),
           /* @__PURE__ */ jsx153("div", { className: "space-y-2.5 mb-4", children: optionsEntries.map(([key, label]) => {
             const isSelected = selectedOption === key;
             const isRecommended = key === recommended;
@@ -41211,6 +41229,7 @@ A: ${label}`);
                   !selectedOption && !isOptionsDisabled && "hover:border-gray500",
                   (isLoading || isOptionsDisabled) && "opacity-50 cursor-not-allowed"
                 ),
+                style: isSelected ? { ...t.surface, ...t.accentBorder } : t.surface,
                 children: /* @__PURE__ */ jsxs114("div", { className: "flex items-start gap-3", children: [
                   /* @__PURE__ */ jsx153("div", { className: "mt-0.5 flex-shrink-0", children: /* @__PURE__ */ jsx153(
                     "div",
@@ -41222,12 +41241,13 @@ A: ${label}`);
                           !selectedOption && !isOptionsDisabled && "hover:border-gold"
                         )
                       ),
-                      children: isSelected && /* @__PURE__ */ jsx153("div", { className: "w-2 h-2 rounded-full bg-gold" })
+                      style: isSelected ? t.accentBorder : void 0,
+                      children: isSelected && /* @__PURE__ */ jsx153("div", { className: "w-2 h-2 rounded-full bg-gold", style: t.accentBg })
                     }
                   ) }),
                   /* @__PURE__ */ jsxs114("div", { className: "flex-1 min-w-0", children: [
-                    isRecommended && /* @__PURE__ */ jsx153("p", { className: "text-xs font-semibold text-gold mb-1", children: "Recommended" }),
-                    /* @__PURE__ */ jsx153("p", { className: "text-sm text-cardText", children: label })
+                    isRecommended && /* @__PURE__ */ jsx153("p", { className: "text-xs font-semibold text-gold mb-1", style: t.accent, children: "Recommended" }),
+                    /* @__PURE__ */ jsx153("p", { className: "text-sm text-cardText", style: t.text, children: label })
                   ] })
                 ] })
               },
@@ -41244,6 +41264,7 @@ A: ${label}`);
                 "disabled:opacity-50 disabled:cursor-not-allowed",
                 "bg-cardSurface hover:bg-cardSurface/80 text-gold border-cardBorder"
               ),
+              style: { ...t.surface, ...t.accent },
               children: isLoading ? "Sending..." : "Continue"
             }
           ) })