@lumiastream/ui 0.2.8-alpha.15 → 0.2.8-alpha.17

package/dist/se-import.js

@@ -90,10 +90,11 @@ function defaultLabelForSEWidget(widget) {
   const tail = words.slice(1).join(" ");
   return tail ? `${head} ${tail}` : head;
 }
-function translateSeText(input, listener) {
+function translateSeText(input, listener, passthrough) {
   if (!input) return "";
   const ctx = listener ? listenerPlaceholderContext(listener) : {};
   return input.replace(/\{([a-zA-Z][a-zA-Z0-9_.]*)\}/g, (_match, raw) => {
+    if (passthrough?.has(raw)) return `{{${raw}}}`;
     const mapped = ctx[raw] ?? SE_TO_LUMIA_PLACEHOLDER[raw] ?? raw;
     return `{{${mapped}}}`;
   });
@@ -287,14 +288,10 @@ function seLayoutUsesPushText(seLayout) {
 
 // src/se-import/mappers/build.ts
 import { nanoid } from "nanoid";
-var currentImportCanvas = null;
-function setImportCanvas(canvas) {
-  currentImportCanvas = canvas;
-}
-function buildUnit(widget, lumiaType, moduleExtras) {
+function buildUnit(widget, lumiaType, moduleExtras, ctx) {
   const id = nanoid();
   const defaults = LUMIA_DEFAULT_SIZES[lumiaType] ?? { width: 400, height: 400 };
-  const bounds = seCssToBounds(widget.css, defaults, currentImportCanvas ?? void 0);
+  const bounds = seCssToBounds(widget.css, defaults, ctx?.canvas);
   const layer = {
     id,
     state: { visible: widget.visible ?? true, locked: widget.locked ?? false },
@@ -346,7 +343,7 @@ function seExtraTextCss(seCss, scrolling) {
   }
   return extra;
 }
-function mapText(widget) {
+function mapText(widget, ctx) {
   const value = translateSeText(widget.text?.value ?? "");
   const seCss = widget.text?.css ?? {};
   return buildUnit(widget, "text", {
@@ -365,17 +362,17 @@ function mapText(widget) {
       background: "transparent",
       ...seExtraTextCss(seCss, widget.text?.scrolling)
     }
-  });
+  }, ctx);
 }
-function mapImage(widget) {
+function mapImage(widget, ctx) {
   return buildUnit(widget, "image", {
     content: {
       src: widget.image?.src ?? "",
       loop: true
     }
-  });
+  }, ctx);
 }
-function mapVideo(widget) {
+function mapVideo(widget, ctx) {
   return buildUnit(widget, "video", {
     content: {
       src: widget.video?.src ?? "",
@@ -383,10 +380,10 @@ function mapVideo(widget) {
       loop: true,
       muted: false
     }
-  });
+  }, ctx);
 }
 var LUMIA_SNOW_WEBM = "https://storage.lumiastream.com/overlays/global/seasonal/snow.webm";
-function mapSnow(widget) {
+function mapSnow(widget, ctx) {
   return buildUnit(widget, "video", {
     content: {
       src: LUMIA_SNOW_WEBM,
@@ -394,9 +391,9 @@ function mapSnow(widget) {
       loop: true,
       muted: true
     }
-  });
+  }, ctx);
 }
-function mapReadout(widget, fallbackVar) {
+function mapReadout(widget, fallbackVar, ctx) {
   const explicitListener = widget.variables?.listener;
   const explicit = typeof explicitListener === "string" ? explicitListener : null;
   const widgetListener = typeof widget.listener === "string" ? widget.listener : null;
@@ -419,7 +416,7 @@ function mapReadout(widget, fallbackVar) {
       background: "transparent",
       ...seExtraTextCss(seCss, widget.text?.scrolling)
     }
-  });
+  }, ctx);
 }
 
 // src/se-import/mappers/alert.ts
@@ -451,13 +448,14 @@ var SE_EVENT_TO_LUMIA_ALERT = {
   //     mapping prevents misleading "channel-point redemption" alerts.
 };
 function pickGraphics(g) {
-  if (!g) return { type: "image", content: { src: "", loop: false, volume: 1 } };
+  const DEFAULT_GRAPHIC_VOLUME = 0.5;
+  if (!g) return { type: "image", content: { src: "", loop: false, volume: DEFAULT_GRAPHIC_VOLUME } };
   return {
     type: g.type === "video" ? "video" : "image",
     content: {
       src: g.src ?? "",
       loop: false,
-      volume: g.volume ?? 0.5
+      volume: g.volume ?? DEFAULT_GRAPHIC_VOLUME
     }
   };
 }
@@ -628,7 +626,7 @@ function pickBaseAlertFields(event) {
   const { on: _on, variations: _variations, matchEmptyCondition: _mec, ...base } = event;
   return base;
 }
-function mapAlertBox(widget, opts = {}) {
+function mapAlertBox(widget, opts = {}, ctx) {
   const v = widget.variables ?? {};
   const events = {};
   const eventKeys = opts.onlyEvents ?? ["follower", "subscriber", "tip", "cheer", "raid", "merch", "purchase", "charityCampaignDonation"];
@@ -643,9 +641,9 @@ function mapAlertBox(widget, opts = {}) {
     if (firstEvent == null) firstEvent = built;
   }
   const baseAlert = firstEvent ? pickBaseAlertFields(firstEvent) : {};
-  return buildUnit(widget, "alert", { alert: { ...baseAlert, events } });
+  return buildUnit(widget, "alert", { alert: { ...baseAlert, events } }, ctx);
 }
-function mapSingleAlert(widget, lumiaAlertKey) {
+function mapSingleAlert(widget, lumiaAlertKey, ctx) {
   const v = widget.variables ?? {};
   const topText = widget.text;
   const merged = { ...v };
@@ -669,7 +667,7 @@ function mapSingleAlert(widget, lumiaAlertKey) {
     [lumiaAlertKey]: built
   };
   const baseAlert = pickBaseAlertFields(built);
-  return buildUnit(widget, "alert", { alert: { ...baseAlert, events } });
+  return buildUnit(widget, "alert", { alert: { ...baseAlert, events } }, ctx);
 }
 
 // src/se-import/mappers/goal.ts
@@ -707,7 +705,7 @@ function sourceFromListener(listener) {
   if (listener.startsWith("merch-")) return "merch_orders";
   return "custom";
 }
-function mapGoal(widget) {
+function mapGoal(widget, ctx) {
   const v = widget.variables ?? {};
   const listener = v.goalListener ?? (typeof widget.listener === "string" ? widget.listener : null);
   const charity = charityGoalVariables(widget.type);
@@ -768,7 +766,7 @@ function mapGoal(widget) {
       textShadow: seTextCss["text-shadow"] ?? "rgb(0, 0, 0) 1px 1px 1px",
       background: "transparent"
     }
-  });
+  }, ctx);
 }
 
 // src/se-import/mappers/custom.ts
@@ -780,19 +778,46 @@ var SE_FIELD_TYPE_TO_LUMIA = {
   slider: "slider",
   colorpicker: "colorpicker",
   fontpicker: "fontpicker",
-  image: "input"
+  // SE's font picker variant — same control surface as `fontpicker` for our
+  // purposes; the SE renderer pulls Google Fonts at runtime which Lumia's
+  // fontpicker also does.
+  googleFont: "fontpicker",
+  // SE asset uploads — the asset URL lands in the `value` as a CDN string,
+  // which our `input` renders fine as-is. Once Lumia ships dedicated asset/
+  // audio pickers wired through the asset library, flip these mappings.
+  image: "input",
+  "image-input": "input",
+  "sound-input": "input",
+  "video-input": "input",
+  // Multi-line text — `input` accepts strings of any length; the editor
+  // surfaces a textarea by inspecting `value.length` heuristically.
+  textarea: "input",
+  hidden: "input",
+  // SE's button is a "fire a JS action" trigger with no persisted value.
+  // Lumia has no equivalent; surface as a non-editable label.
+  button: "input"
 };
+var SE_RESERVED_FIELD_KEYS = /* @__PURE__ */ new Set(["widgetName", "widgetAuthor", "widgetDuration"]);
 function translateConfigs(seFields) {
   if (!seFields) return [];
-  return Object.entries(seFields).map(([key, f]) => ({
-    key,
-    label: f.label ?? key,
-    type: SE_FIELD_TYPE_TO_LUMIA[f.type ?? "text"] ?? "input",
-    value: f.value,
-    options: f.options
-  }));
+  return Object.entries(seFields).filter(([key]) => !SE_RESERVED_FIELD_KEYS.has(key)).map(([key, f]) => {
+    const seType = f.type ?? "text";
+    return {
+      key,
+      label: f.label ?? key,
+      type: SE_FIELD_TYPE_TO_LUMIA[seType] ?? "input",
+      value: f.value,
+      options: f.options,
+      // Preserve the original SE type + group so a future editor UX
+      // upgrade can render the right control (e.g. an actual asset
+      // picker for `image-input`) without re-importing. Mentioned in
+      // docs/SE_IMPORT_GAPS.md under "Other widgets > custom-event-list".
+      seType,
+      ...f.group ? { seGroup: f.group } : {}
+    };
+  });
 }
-function mapCustom(widget) {
+function mapCustom(widget, ctx) {
   const v = widget.variables ?? {};
   const parse = (x) => {
     if (x == null) return void 0;
@@ -815,7 +840,7 @@ function mapCustom(widget) {
       data: fieldData ?? {},
       flavor: "streamelements"
     }
-  });
+  }, ctx);
 }
 
 // src/se-import/mappers/misc.ts
@@ -843,7 +868,7 @@ function paddingShorthand(message) {
   const px = (n) => `${n ?? 0}px`;
   return `${px(t)} ${px(r)} ${px(b)} ${px(l)}`;
 }
-function mapChatbox(widget) {
+function mapChatbox(widget, ctx) {
   const v = widget.variables ?? {};
   const textCss = widget.text?.css ?? {};
   const messageCss = textCss.message ?? {};
@@ -927,7 +952,7 @@ function mapChatbox(widget) {
       se_highlight_users: v.highlight,
       se_text_css: textCss
     }
-  });
+  }, ctx);
 }
 var SE_LISTENER_TO_LUMIA_CATEGORY = {
   "follower-latest": "follower",
@@ -993,7 +1018,7 @@ function computeListenerFilters(seListeners, explicitListener) {
   if (allowed.size === 0) return [];
   return ALL_LUMIA_EVENTLIST_CATEGORIES.filter((c) => !allowed.has(c));
 }
-function mapEventList(widget) {
+function mapEventList(widget, ctx) {
   const v = widget.variables ?? {};
   const filters = computeListenerFilters(widget.listeners, widget.listener);
   const maxItems = v.visibleEvents ?? v.visibleItems ?? 5;
@@ -1022,7 +1047,7 @@ function mapEventList(widget) {
       showDetailedText: false,
       hideAlertMessage: false
     }
-  });
+  }, ctx);
 }
 var SE_CREDITS_EVENTS_TO_SHOW = {
   mods: false,
@@ -1162,7 +1187,7 @@ var CREDITS_DEFAULT_TEMPLATES = {
   topSuperchats: "{{username}} x{{amount}}",
   topRedemptions: "{{username}} x{{amount}}"
 };
-function mapCredits(widget) {
+function mapCredits(widget, ctx) {
   const v = widget.variables ?? {};
   const itemGap = typeof v.padding === "number" ? v.padding : 8;
   const reverseFlow = v.direction === "bottom";
@@ -1216,7 +1241,7 @@ function mapCredits(widget) {
       textAlign: "center",
       background: "transparent"
     }
-  });
+  }, ctx);
 }
 function inferSlideshowMediaType(mime, url) {
   if (typeof mime === "string") {
@@ -1235,7 +1260,7 @@ function nameFromUrl(url) {
     return url;
   }
 }
-function mapSlideshow(widget) {
+function mapSlideshow(widget, ctx) {
   const v = widget.variables ?? {};
   const items = (v.images ?? []).map((raw) => {
     const url = typeof raw === "string" ? raw : raw.url ?? raw.src ?? "";
@@ -1275,21 +1300,13 @@ function mapSlideshow(widget) {
       se_interval: v.interval,
       se_raw_duration: v.duration
     }
-  });
+  }, ctx);
 }
-function mapTimer(widget) {
+function mapTimer(widget, ctx) {
   const v = widget.variables ?? {};
   const textValue = typeof widget.text?.value === "string" ? widget.text.value : void 0;
-  const mapTemplate = (template) => {
-    const protectedTemplate = template.replace(
-      /\{(days|hours|minutes|seconds)\}/g,
-      "__SE_COUNTDOWN_$1__"
-    );
-    return translateSeText(protectedTemplate).replace(
-      /__SE_COUNTDOWN_(days|hours|minutes|seconds)__/g,
-      "{{$1}}"
-    );
-  };
+  const TIMER_PASSTHROUGH = /* @__PURE__ */ new Set(["days", "hours", "minutes", "seconds"]);
+  const mapTemplate = (template) => translateSeText(template, null, TIMER_PASSTHROUGH);
   const absoluteDate = v.date ?? v.endsAt ?? v.endDate;
   const target = absoluteDate ? Date.parse(absoluteDate) : NaN;
   const hasValidAbsoluteDate = Number.isFinite(target);
@@ -1365,9 +1382,9 @@ function mapTimer(widget) {
       se_date_picker: v.datePicker,
       se_exact_time: v.exactTime
     }
-  });
+  }, ctx);
 }
-function mapNowPlaying(widget) {
+function mapNowPlaying(widget, ctx) {
   const v = widget.variables ?? {};
   const source = v.provider === "youtube" ? "youtubemusic" : "spotify";
   return buildUnit(widget, "nowplaying", {
@@ -1397,9 +1414,9 @@ function mapNowPlaying(widget) {
       textShadow: "rgb(0, 0, 0) 1px 1px 1px",
       background: "transparent"
     }
-  });
+  }, ctx);
 }
-function mapMediaShare(widget) {
+function mapMediaShare(widget, ctx) {
   const v = widget.variables ?? {};
   return buildUnit(widget, "songrequest", {
     content: {
@@ -1440,7 +1457,7 @@ function mapMediaShare(widget) {
       background: "transparent",
       fontSize: 18
     }
-  });
+  }, ctx);
 }
 var SE_KAPPAGEN_EVENT_TO_LUMIA_ALERT = {
   follower: "twitch-follower",
@@ -1463,7 +1480,7 @@ var SE_KAPPAGEN_EVENT_TO_LUMIA_ALERT = {
   // All three drop silently; the rest of the widget (size, spawn zone,
   // per-event flags for the remaining events) still imports.
 };
-function mapKappagen(widget) {
+function mapKappagen(widget, ctx) {
   const v = widget.variables ?? {};
   const eventsFromNested = v.eventsConfig ? {
     subscriber: v.eventsConfig.subscriber?.enabled ?? true,
@@ -1515,10 +1532,11 @@ function mapKappagen(widget) {
         se_direction: v.direction
       },
       css: { background: "transparent" }
-    }
+    },
+    ctx
   );
 }
-function mapLeaderboardFromVariables(widget, currency) {
+function mapLeaderboardFromVariables(widget, currency, ctx) {
   const v = widget.variables ?? {};
   const count = v.limit ?? v.visibleItems ?? 10;
   const window = v.period === "weekly" ? "week" : v.period === "monthly" ? "month" : "alltime";
@@ -1541,9 +1559,9 @@ function mapLeaderboardFromVariables(widget, currency) {
       se_offset: v.offset,
       se_layout: v.layout
     }
-  });
+  }, ctx);
 }
-function mapGiveaway(widget) {
+function mapGiveaway(widget, ctx) {
   const v = widget.variables ?? {};
   const primary = v.colors?.primary ?? "#393853";
   const accent = v.colors?.accent ?? "#FF4076";
@@ -1594,7 +1612,7 @@ function mapGiveaway(widget) {
       se_display_tickets_purchased: v.displayTicketsPurchased,
       se_image_style_width: v.imageStyle?.width
     }
-  });
+  }, ctx);
 }
 var HYPETRAIN_LISTENER_KEYS = /* @__PURE__ */ new Set([
   "hypetrain-latest",
@@ -1625,7 +1643,7 @@ function isHypetrainCustomWidget(widget) {
   if (enabled.length === 0) return false;
   return enabled.every((listener) => HYPETRAIN_LISTENER_KEYS.has(listener));
 }
-function mapHypetrain(widget) {
+function mapHypetrain(widget, ctx) {
   const v = widget.variables ?? {};
   return buildUnit(widget, "hypetrain", {
     content: {
@@ -1668,9 +1686,9 @@ function mapHypetrain(widget) {
       // these via the overlay JSON if they want to recreate a specific look.
       se_variables: v
     }
-  });
+  }, ctx);
 }
-function mapUnsupportedAsText(widget) {
+function mapUnsupportedAsText(widget, ctx) {
   return buildUnit(widget, "text", {
     content: {
       value: `[Unsupported SE widget: ${widget.type}]`,
@@ -1684,7 +1702,7 @@ function mapUnsupportedAsText(widget) {
       fontWeight: "bold",
       background: "rgba(0,0,0,0.4)"
     }
-  });
+  }, ctx);
 }
 
 // src/se-import/mappers/hypecup.ts
@@ -1754,7 +1772,7 @@ function categoriesFromListeners(listeners) {
   if (events.subs) events.resubs = true;
   return events;
 }
-function mapHypeCup(widget) {
+function mapHypeCup(widget, ctx) {
   const v = widget.variables ?? {};
   const widgetWidth = typeof v.width === "number" && v.width > 0 ? v.width : parsePx(widget.css?.width);
   const widgetHeight = typeof v.height === "number" && v.height > 0 ? v.height : parsePx(widget.css?.height);
@@ -1812,7 +1830,7 @@ function mapHypeCup(widget) {
     css: {
       background: "transparent"
     }
-  });
+  }, ctx);
 }
 function clamp01(n) {
   if (!Number.isFinite(n)) return 0.5;
@@ -1859,7 +1877,7 @@ function listenerIsOn(listeners, key) {
   if (Array.isArray(listeners)) return listeners.includes(key);
   return listeners[key] === true;
 }
-function mapStreamBoss(widget) {
+function mapStreamBoss(widget, ctx) {
   const v = widget.variables ?? {};
   const baseHp = typeof v.baseHP === "number" && v.baseHP > 0 ? Math.round(v.baseHP) : 1e3;
   const seDamage = v.damage ?? {};
@@ -1941,7 +1959,7 @@ function mapStreamBoss(widget) {
     css: {
       background: "transparent"
     }
-  });
+  }, ctx);
   if (theme === "card") {
     const MIN_CARD_WIDTH = 480;
     const MIN_CARD_HEIGHT = 110;
@@ -1952,25 +1970,6 @@ function mapStreamBoss(widget) {
 }
 
 // src/se-import/feature-flags.ts
-var SE_IMPORT_FLAGS = {
-  // (Removed) IMPORT_CUSTOM_EMBED: custom-event-list now routes to native eventlist
-  // by default with a one-click "switch to custom HTML" option in the review step.
-  // (Removed) IMPORT_MERCH_GOAL: Fourthwall integration provides session/total order
-  // counters now (see fourthwall.manager.ts ORDER_PLACED handler); merch goal maps
-  // to {{fourthwall_total_*}} via the goal mapper (per-listener: orders → order_count,
-  // items → items_count, total → order_amount).
-  // (Removed) IMPORT_SEASONAL: seasonal widgets now route per-widget into existing
-  // modules (image / slideshow / video) rather than a single approximate canvas-
-  // particle template. See dispatcher.ts SEASONAL_IMAGE_TYPES comment for the
-  // rationale and /SE/05-widget-to-module-mapping.md §D for the current mapping.
-  // (Removed) IMPORT_MERCH_PRODUCTS: the merch-products-rotator now imports as an
-  // empty slideshow with a friendly layer title prompting the user to add product
-  // images manually. This is a degraded but honest UX — better than a placeholder
-  // text layer for the (rare) streamer who uses SE's merch rotator. A Fourthwall
-  // catalog fetcher would unlock fully-automatic import, but that's a multi-day
-  // project gated on a new Fourthwall API auth scope, an endpoint, and a refresh
-  // cadence.
-};
 function isWidgetFlaggedOff(_seType) {
   return false;
 }
@@ -2025,7 +2024,7 @@ var GOAL_TYPES = /* @__PURE__ */ new Set([
   "se-widget-merch-goal"
 ]);
 var EVENTLIST_TYPES = /* @__PURE__ */ new Set(["se-widget-event-list", "se-widget-follower-recent", "se-widget-subscriber-recent", "se-widget-cheer-recent", "se-widget-tip-recent"]);
-function dispatch(widget) {
+function dispatch(widget, ctx) {
   const t = widget.type;
   console.log("[SE-IMPORT] dispatch widget", {
     seType: t,
@@ -2036,46 +2035,46 @@ function dispatch(widget) {
     hasCss: !!widget.css
   });
   if (isWidgetFlaggedOff(t)) {
-    return { unit: mapUnsupportedAsText(widget), status: "placeholder", lumiaType: "text", flaggedOff: true };
+    return { unit: mapUnsupportedAsText(widget, ctx), status: "placeholder", lumiaType: "text", flaggedOff: true };
   }
-  if (t === "text") return { unit: mapText(widget), status: "direct", lumiaType: "text" };
-  if (t === "image") return { unit: mapImage(widget), status: "direct", lumiaType: "image" };
-  if (t === "video") return { unit: mapVideo(widget), status: "direct", lumiaType: "video" };
+  if (t === "text") return { unit: mapText(widget, ctx), status: "direct", lumiaType: "text" };
+  if (t === "image") return { unit: mapImage(widget, ctx), status: "direct", lumiaType: "image" };
+  if (t === "video") return { unit: mapVideo(widget, ctx), status: "direct", lumiaType: "video" };
   if (t in READOUT_TYPES) {
-    return { unit: mapReadout(widget, READOUT_TYPES[t]), status: "direct", lumiaType: "text" };
+    return { unit: mapReadout(widget, READOUT_TYPES[t], ctx), status: "direct", lumiaType: "text" };
   }
-  if (GOAL_TYPES.has(t)) return { unit: mapGoal(widget), status: "direct", lumiaType: "goal" };
+  if (GOAL_TYPES.has(t)) return { unit: mapGoal(widget, ctx), status: "direct", lumiaType: "goal" };
   if ((t === "se-widget-alert-box" || t === "se-widget-alert-box-merch") && hasSECustomCode(widget)) {
-    return { unit: mapUnsupportedAsText(widget), status: "placeholder", lumiaType: "text", flaggedOff: true };
+    return { unit: mapUnsupportedAsText(widget, ctx), status: "placeholder", lumiaType: "text", flaggedOff: true };
   }
-  if (t === "se-widget-alert-box") return { unit: mapAlertBox(widget), status: "direct", lumiaType: "alert" };
-  if (t === "se-widget-alert-box-merch") return { unit: mapAlertBox(widget, { onlyEvents: ["merch"] }), status: "direct", lumiaType: "alert" };
-  if (t === "se-widget-donor-drive-alert") return { unit: mapSingleAlert(widget, "donordrive-donation"), status: "direct", lumiaType: "alert" };
-  if (t === "se-widget-extralife-alert") return { unit: mapSingleAlert(widget, "extralife-donation"), status: "direct", lumiaType: "alert" };
-  if (t === "se-widget-tiltify-alert") return { unit: mapSingleAlert(widget, "tiltify-campaignDonation"), status: "direct", lumiaType: "alert" };
-  if (EVENTLIST_TYPES.has(t)) return { unit: mapEventList(widget), status: "direct", lumiaType: "eventlist" };
-  if (t === "se-widget-top-tippers-list") return { unit: mapLeaderboardFromVariables(widget, "tips"), status: "direct", lumiaType: "loyaltyleaderboard" };
-  if (t === "se-widget-top-cheerers-list") return { unit: mapLeaderboardFromVariables(widget, "cheers"), status: "direct", lumiaType: "loyaltyleaderboard" };
-  if (t === "se-widget-top-gifters-list") return { unit: mapLeaderboardFromVariables(widget, "gifts"), status: "direct", lumiaType: "loyaltyleaderboard" };
-  if (t === "se-widget-credit-roll") return { unit: mapCredits(widget), status: "partial", lumiaType: "credits" };
-  if (t === "se-widget-twitch-chat") return { unit: mapChatbox(widget), status: "partial", lumiaType: "chatbox" };
-  if (t === "se-widget-image-rotator" || t === "se-widget-merch-products-rotator") return { unit: mapSlideshow(widget), status: t === "se-widget-merch-products-rotator" ? "partial" : "direct", lumiaType: "slideshow" };
-  if (t === "se-widget-countdown") return { unit: mapTimer(widget), status: "partial", lumiaType: "timer" };
-  if (t === "se-widget-current-song") return { unit: mapNowPlaying(widget), status: "partial", lumiaType: "nowplaying" };
-  if (t === "se-widget-kappagen") return { unit: mapKappagen(widget), status: "partial", lumiaType: "emotealert" };
-  if (t === "se-widget-giveaway") return { unit: mapGiveaway(widget), status: "direct", lumiaType: "raffle" };
-  if (t === "se-widget-media-share") return { unit: mapMediaShare(widget), status: "partial", lumiaType: "songrequest" };
-  if (t === "se-widget-hype-cup") return { unit: mapHypeCup(widget), status: "partial", lumiaType: "tipjar" };
-  if (t === "se-widget-bit-boss") return { unit: mapStreamBoss(widget), status: "partial", lumiaType: "streamboss" };
-  if (t === "se-widget-hype-train") return { unit: mapHypetrain(widget), status: "partial", lumiaType: "hypetrain" };
+  if (t === "se-widget-alert-box") return { unit: mapAlertBox(widget, {}, ctx), status: "direct", lumiaType: "alert" };
+  if (t === "se-widget-alert-box-merch") return { unit: mapAlertBox(widget, { onlyEvents: ["merch"] }, ctx), status: "direct", lumiaType: "alert" };
+  if (t === "se-widget-donor-drive-alert") return { unit: mapSingleAlert(widget, "donordrive-donation", ctx), status: "direct", lumiaType: "alert" };
+  if (t === "se-widget-extralife-alert") return { unit: mapSingleAlert(widget, "extralife-donation", ctx), status: "direct", lumiaType: "alert" };
+  if (t === "se-widget-tiltify-alert") return { unit: mapSingleAlert(widget, "tiltify-campaignDonation", ctx), status: "direct", lumiaType: "alert" };
+  if (EVENTLIST_TYPES.has(t)) return { unit: mapEventList(widget, ctx), status: "direct", lumiaType: "eventlist" };
+  if (t === "se-widget-top-tippers-list") return { unit: mapLeaderboardFromVariables(widget, "tips", ctx), status: "direct", lumiaType: "loyaltyleaderboard" };
+  if (t === "se-widget-top-cheerers-list") return { unit: mapLeaderboardFromVariables(widget, "cheers", ctx), status: "direct", lumiaType: "loyaltyleaderboard" };
+  if (t === "se-widget-top-gifters-list") return { unit: mapLeaderboardFromVariables(widget, "gifts", ctx), status: "direct", lumiaType: "loyaltyleaderboard" };
+  if (t === "se-widget-credit-roll") return { unit: mapCredits(widget, ctx), status: "partial", lumiaType: "credits" };
+  if (t === "se-widget-twitch-chat") return { unit: mapChatbox(widget, ctx), status: "partial", lumiaType: "chatbox" };
+  if (t === "se-widget-image-rotator" || t === "se-widget-merch-products-rotator") return { unit: mapSlideshow(widget, ctx), status: t === "se-widget-merch-products-rotator" ? "partial" : "direct", lumiaType: "slideshow" };
+  if (t === "se-widget-countdown") return { unit: mapTimer(widget, ctx), status: "partial", lumiaType: "timer" };
+  if (t === "se-widget-current-song") return { unit: mapNowPlaying(widget, ctx), status: "partial", lumiaType: "nowplaying" };
+  if (t === "se-widget-kappagen") return { unit: mapKappagen(widget, ctx), status: "partial", lumiaType: "emotealert" };
+  if (t === "se-widget-giveaway") return { unit: mapGiveaway(widget, ctx), status: "direct", lumiaType: "raffle" };
+  if (t === "se-widget-media-share") return { unit: mapMediaShare(widget, ctx), status: "partial", lumiaType: "songrequest" };
+  if (t === "se-widget-hype-cup") return { unit: mapHypeCup(widget, ctx), status: "partial", lumiaType: "tipjar" };
+  if (t === "se-widget-bit-boss") return { unit: mapStreamBoss(widget, ctx), status: "partial", lumiaType: "streamboss" };
+  if (t === "se-widget-hype-train") return { unit: mapHypetrain(widget, ctx), status: "partial", lumiaType: "hypetrain" };
   if (t === "se-widget-custom-event-list" && isHypetrainCustomWidget(widget)) {
-    return { unit: mapHypetrain(widget), status: "partial", lumiaType: "hypetrain" };
+    return { unit: mapHypetrain(widget, ctx), status: "partial", lumiaType: "hypetrain" };
   }
-  if (t === "se-widget-custom-event-list") return { unit: mapCustom(widget), status: "partial", lumiaType: "custom" };
-  if (t === "se-widget-snow") return { unit: mapSnow(widget), status: "direct", lumiaType: "video" };
-  if (t === "se-widget-halloween-2019") return { unit: mapSlideshow(widget), status: "direct", lumiaType: "slideshow" };
-  if (SEASONAL_IMAGE_TYPES.has(t)) return { unit: mapImage(widget), status: "direct", lumiaType: "image" };
-  return { unit: mapUnsupportedAsText(widget), status: "placeholder", lumiaType: "text" };
+  if (t === "se-widget-custom-event-list") return { unit: mapCustom(widget, ctx), status: "partial", lumiaType: "custom" };
+  if (t === "se-widget-snow") return { unit: mapSnow(widget, ctx), status: "direct", lumiaType: "video" };
+  if (t === "se-widget-halloween-2019") return { unit: mapSlideshow(widget, ctx), status: "direct", lumiaType: "slideshow" };
+  if (SEASONAL_IMAGE_TYPES.has(t)) return { unit: mapImage(widget, ctx), status: "direct", lumiaType: "image" };
+  return { unit: mapUnsupportedAsText(widget, ctx), status: "placeholder", lumiaType: "text" };
 }
 function recordCoverage(coverage, result, seType) {
   const existing = coverage.mappings.find((m) => m.seType === seType);
@@ -2133,11 +2132,19 @@ function rewriteAssetURLs(overlay, mapping) {
     settings: JSON.parse(rewritten)
   };
 }
+var MAX_MIRROR_ASSET_BYTES = 100 * 1024 * 1024;
 async function mirrorOneAsset(url, upload, signal) {
   const res = await fetch(url, { mode: "cors", signal });
   if (!res.ok) throw new Error(`Source returned HTTP ${res.status}`);
+  const declared = Number(res.headers.get("content-length"));
+  if (Number.isFinite(declared) && declared > MAX_MIRROR_ASSET_BYTES) {
+    throw new Error(`Asset is ${(declared / (1024 * 1024)).toFixed(1)} MB \u2014 over the ${MAX_MIRROR_ASSET_BYTES / (1024 * 1024)} MB import cap.`);
+  }
   const blob = await res.blob();
   if (signal?.aborted) throw new DOMException("Aborted", "AbortError");
+  if (blob.size > MAX_MIRROR_ASSET_BYTES) {
+    throw new Error(`Asset is ${(blob.size / (1024 * 1024)).toFixed(1)} MB \u2014 over the ${MAX_MIRROR_ASSET_BYTES / (1024 * 1024)} MB import cap.`);
+  }
   const filename = filenameFromURL(url);
   const type = blob.type || guessMime(filename);
   const file = new File([blob], filename, { type });
@@ -4835,13 +4842,19 @@ function CustomOverlayPreview({
 }) {
   const srcdoc = useMemo5(() => {
     const safeData = JSON.stringify(data ?? {});
-    const safeJs = JSON.stringify(`(async () => { ${js || ""} })()`);
+    const safeJs = (js || "").replace(/<\/script>/gi, "<\\/script>");
     const safeHtml = (html || "").replace(/<\/script>/gi, "<\\/script>");
     const safeCss = (css || "").replace(/<\/style>/gi, "<\\/style>");
     return `<!DOCTYPE html><html><head><meta charset="utf-8"/><style>html,body{margin:0;padding:0;width:100%;height:100%;overflow:hidden;background:transparent;}${safeCss}</style></head><body>${safeHtml}<script>
 window.DATA = ${safeData};
 window.Overlay = window.Overlay || { on:()=>{}, callCommand:()=>Promise.resolve(), chatbot:()=>Promise.resolve(), setVariable:()=>Promise.resolve(), getVariable:()=>Promise.resolve(), saveStorage:()=>Promise.resolve(), getStorage:()=>Promise.resolve(), deleteStorage:()=>Promise.resolve(), addLoyaltyPoints:()=>Promise.resolve(), getLoyaltyPoints:()=>Promise.resolve() };
-try { eval(${safeJs}); } catch(e) { document.body.insertAdjacentHTML('beforeend','<pre style=\\"color:#fca5a5;font:11px monospace;padding:8px;\\">' + (e && e.message ? e.message : e) + '</pre>'); }
+function __seImportShowError(e){document.body.insertAdjacentHTML('beforeend','<pre style="color:#fca5a5;font:11px monospace;padding:8px;">' + (e && e.message ? e.message : e) + '</pre>');}
+window.addEventListener('error', function(ev){__seImportShowError(ev.error || ev.message);});
+window.addEventListener('unhandledrejection', function(ev){__seImportShowError(ev.reason);});
+</script><script>
+(async function __seImportUserScript(){
+${safeJs}
+})().catch(__seImportShowError);
 </script></body></html>`;
   }, [html, css, js, data]);
   return /* @__PURE__ */ jsx14(
@@ -5399,7 +5412,8 @@ function StepURL({
   url,
   setUrl,
   error,
-  busy
+  busy,
+  onSwitchToJwt
 }) {
   return /* @__PURE__ */ jsxs7("div", { className: panelClass("se-import-panel--narrow"), children: [
     /* @__PURE__ */ jsx14(
@@ -5445,7 +5459,16 @@ function StepURL({
         ] })
       ] })
     ] }),
-    error && /* @__PURE__ */ jsx14(ErrorPanel, { message: error.message, hint: error.hint })
+    error && /* @__PURE__ */ jsx14(ErrorPanel, { message: error.message, hint: error.hint }),
+    error?.editorUrl && onSwitchToJwt && /* @__PURE__ */ jsx14("div", { style: { marginTop: 12 }, children: /* @__PURE__ */ jsx14(
+      LSButton,
+      {
+        type: "button",
+        color: "primary",
+        onClick: onSwitchToJwt,
+        label: "Connect with JWT instead"
+      }
+    ) })
   ] });
 }
 function StepDiscovery({
@@ -5952,10 +5975,7 @@ function SEImportWizard({
   const mirrorStartedRef = useRef4(false);
   const mirrorAbortRef = useRef4(null);
   const filenameCacheRef = useRef4(/* @__PURE__ */ new Map());
-  const assetUrls = useMemo5(
-    () => result ? findSEAssetURLs(result.overlay) : [],
-    [result]
-  );
+  const [assetUrls, setAssetUrls] = useState6([]);
   const currentItem = originalReviewItems[reviewIndex];
   const currentRow = currentItem ? rowStates[currentItem.moduleId] ?? { state: "pending" } : void 0;
   const handleConnect = useCallback3(async () => {
@@ -6053,6 +6073,7 @@ function SEImportWizard({
         }
         const imported = importSEBootstrap(bootstrap);
         setResult(imported);
+        setAssetUrls(findSEAssetURLs(imported.overlay));
         setOptions((o) => ({ ...o, name: imported.overlay.name }));
         setOriginalReviewItems(imported.reviewItems);
         setRowStates(
@@ -6068,9 +6089,10 @@ function SEImportWizard({
         mirrorStartedRef.current = false;
         setStep("discovery");
       } catch (e) {
+        const detail = e?.message ?? String(e);
         setLoadError({
-          message: "Could not load the overlay.",
-          hint: e?.message ?? String(e)
+          message: detail || "Could not load the overlay.",
+          hint: detail ? "If this looks transient, retry in a moment. Otherwise check the URL / token and try again." : void 0
         });
       } finally {
         setLoading(false);
@@ -6098,11 +6120,20 @@ function SEImportWizard({
       });
       return;
     }
+    if (!parts.apikey) {
+      setLoadError({
+        message: "That looks like an editor URL, which doesn't include an access token.",
+        hint: `Use the public preview URL (Overlay menu \u2192 Get URL \u2192 Public link), or connect your account with a JWT to skip the URL step entirely. Overlay id: ${parts.overlayId}`,
+        editorUrl: true
+      });
+      return;
+    }
     setLoading(true);
     try {
       const bootstrap = await fetchSEBootstrap(parts);
       const imported = importSEBootstrap(bootstrap);
       setResult(imported);
+      setAssetUrls(findSEAssetURLs(imported.overlay));
       setOptions((previous) => ({ ...previous, name: imported.overlay.name }));
       setOriginalReviewItems(imported.reviewItems);
       setRowStates(
@@ -6116,27 +6147,21 @@ function SEImportWizard({
       setReviewIndex(0);
       setStep("discovery");
     } catch (error) {
+      const detail = error?.message ?? String(error);
       setLoadError({
-        message: "Could not load the overlay.",
-        hint: error?.message
+        message: detail || "Could not load the overlay.",
+        hint: detail ? "If this looks transient, retry in a moment. Otherwise check the URL / token and try again." : void 0
       });
     } finally {
       setLoading(false);
     }
   }, [url]);
+  const MIRROR_CONCURRENCY = 5;
   const processAssetRow = useCallback3(
     async (assetUrl, idx, existingByFilename, signal) => {
       const filename = filenameFromURL(assetUrl);
       const reuseUrl = existingByFilename.get(filename);
       if (reuseUrl) {
-        setResult(
-          (current) => current ? {
-            ...current,
-            overlay: rewriteAssetURLs(current.overlay, {
-              [assetUrl]: reuseUrl
-            })
-          } : current
-        );
         return { state: "reused", newUrl: reuseUrl };
       }
       if (filename.toLowerCase().endsWith(".svg"))
@@ -6153,14 +6178,6 @@ function SEImportWizard({
           signal
         );
         existingByFilename.set(filename, newUrl);
-        setResult(
-          (current) => current ? {
-            ...current,
-            overlay: rewriteAssetURLs(current.overlay, {
-              [assetUrl]: newUrl
-            })
-          } : current
-        );
         return { state: "done", newUrl };
       } catch (error) {
         if (error?.name === "AbortError" || signal?.aborted)
@@ -6170,8 +6187,15 @@ function SEImportWizard({
     },
     [uploadAsset]
   );
+  const applyRewrite = useCallback3((mapping) => {
+    if (Object.keys(mapping).length === 0) return;
+    setResult(
+      (current) => current ? { ...current, overlay: rewriteAssetURLs(current.overlay, mapping) } : current
+    );
+  }, []);
   const runMirror = useCallback3(async () => {
     if (!result) return;
+    mirrorAbortRef.current?.abort();
     mirrorAbortRef.current = new AbortController();
     const signal = mirrorAbortRef.current.signal;
     setMirrorRunning(true);
@@ -6186,21 +6210,33 @@ function SEImportWizard({
       if (name && asset.url) existingByFilename.set(name, asset.url);
     }
     filenameCacheRef.current = existingByFilename;
-    for (let i = 0; i < initialRows.length; i += 1) {
-      if (signal.aborted) break;
-      const outcome = await processAssetRow(
-        initialRows[i].url,
-        i,
-        existingByFilename,
-        signal
-      );
-      if (signal.aborted) break;
-      setMirrorRows(
-        (previous) => previous.map((row, idx) => idx === i ? { ...row, ...outcome } : row)
-      );
-    }
+    const rewriteMap = {};
+    let cursor = 0;
+    const worker = async () => {
+      while (true) {
+        if (signal.aborted) return;
+        const i = cursor++;
+        if (i >= initialRows.length) return;
+        const outcome = await processAssetRow(
+          initialRows[i].url,
+          i,
+          existingByFilename,
+          signal
+        );
+        if (signal.aborted) return;
+        if (outcome.newUrl && (outcome.state === "done" || outcome.state === "reused")) {
+          rewriteMap[initialRows[i].url] = outcome.newUrl;
+        }
+        setMirrorRows(
+          (previous) => previous.map((row, idx) => idx === i ? { ...row, ...outcome } : row)
+        );
+      }
+    };
+    const poolSize = Math.min(MIRROR_CONCURRENCY, initialRows.length);
+    await Promise.all(Array.from({ length: poolSize }, worker));
+    if (!signal.aborted) applyRewrite(rewriteMap);
     setMirrorRunning(false);
-  }, [assetUrls, existingAssets, processAssetRow, result]);
+  }, [applyRewrite, assetUrls, existingAssets, processAssetRow, result]);
   const retryMirrorRow = useCallback3(
     async (idx) => {
       const rowUrl = mirrorRows[idx]?.url;
@@ -6214,8 +6250,11 @@ function SEImportWizard({
       setMirrorRows(
         (previous) => previous.map((row, i) => i === idx ? { ...row, ...outcome } : row)
       );
+      if (outcome.newUrl && (outcome.state === "done" || outcome.state === "reused")) {
+        applyRewrite({ [rowUrl]: outcome.newUrl });
+      }
     },
-    [mirrorRows, processAssetRow]
+    [applyRewrite, mirrorRows, processAssetRow]
   );
   useEffect6(() => {
     if (step === "mirror" && !mirrorStartedRef.current) {
@@ -6223,6 +6262,13 @@ function SEImportWizard({
       void runMirror();
     }
   }, [step, runMirror]);
+  useEffect6(() => {
+    return () => {
+      setJwt("");
+      setSeClient(null);
+      mirrorAbortRef.current?.abort();
+    };
+  }, []);
   useEffect6(() => {
     if (step === "pick" && seClient && overlayList === null && !overlaysLoading) {
       void loadOverlayList(seClient);
@@ -6617,7 +6663,12 @@ function SEImportWizard({
           url,
           setUrl,
           error: loadError,
-          busy: loading
+          busy: loading,
+          onSwitchToJwt: () => {
+            setLoadError(null);
+            setEntryMode("jwt");
+            setStep("connect");
+          }
         }
       ),
       step === "discovery" && result && /* @__PURE__ */ jsx14(StepDiscovery, { result, assetCount: assetUrls.length }),
@@ -6767,14 +6818,20 @@ function extractSEOverlayId(input) {
 }
 function extractSEPreviewParts(input) {
   const trimmed = input.trim();
-  const m = trimmed.match(/streamelements\.com\/overlay\/([0-9a-f]{24})\/([A-Za-z0-9_-]+)/i);
+  const m = trimmed.match(/streamelements\.com\/overlay\/([0-9a-f]{24})(?:\/([A-Za-z0-9_-]+))?/i);
   if (!m) return null;
-  return { overlayId: m[1], apikey: m[2] };
+  const overlayId = m[1];
+  const second = m[2];
+  const apikey = second && second.toLowerCase() !== "editor" ? second : null;
+  return { overlayId, apikey };
 }
 function buildBootstrapUrl(overlayId) {
   return `https://api.streamelements.com/kappa/v2/overlays/${overlayId}/bootstrap?isEditor=false&isMobile=false&isObs=false&isObsLive=false&isXsplit=false`;
 }
 async function fetchSEBootstrap({ overlayId, apikey }) {
+  if (!apikey) {
+    throw new Error("Missing access token. Use the public preview URL (Overlay menu \u2192 Get URL \u2192 Public link) \u2014 editor URLs do not include a token.");
+  }
   const res = await fetch(buildBootstrapUrl(overlayId), {
     method: "GET",
     headers: { Accept: "application/json", Authorization: `apikey ${apikey}` }
@@ -6815,145 +6872,138 @@ function importSEBootstrap(bootstrap) {
     name: seOverlay?.name,
     canvas: { width: seOverlay?.settings?.width, height: seOverlay?.settings?.height },
     widgetCount: widgets.length,
-    widgetTypes: widgets.map((w) => w.type),
-    fullBootstrap: bootstrap
+    widgetTypes: widgets.map((w) => w.type)
   });
   const importCanvas = {
     width: seOverlay?.settings?.width ?? 1920,
     height: seOverlay?.settings?.height ?? 1080
   };
-  setImportCanvas(importCanvas);
+  const ctx = { canvas: importCanvas };
   const layers = [];
   const modules = {};
   const reviewItems = [];
-  try {
-    const seUidToLumiaGroupId = {};
-    const groupWidgetByUid = {};
-    for (const w of widgets) {
-      if (w.type !== "se-widget-group") continue;
-      const uid = w.variables?.uid;
-      if (typeof uid !== "string") continue;
-      const lumiaGroupId = nanoid3();
-      seUidToLumiaGroupId[uid] = lumiaGroupId;
-      groupWidgetByUid[uid] = w;
-    }
-    for (const uid of Object.keys(groupWidgetByUid)) {
-      const w = groupWidgetByUid[uid];
-      const lumiaGroupId = seUidToLumiaGroupId[uid];
-      const parentUid = typeof w.group === "string" ? w.group : null;
-      const parentLumiaGroupId = parentUid ? seUidToLumiaGroupId[parentUid] ?? null : null;
-      const bounds = seCssToBounds(w.css, { width: 200, height: 200 }, importCanvas);
-      const layer = {
-        id: lumiaGroupId,
-        type: "group",
-        group: parentLumiaGroupId,
-        bounds: {
-          x: bounds.x,
-          y: bounds.y,
-          width: bounds.width,
-          height: bounds.height,
-          opacity: bounds.opacity,
-          zIndex: bounds.zIndex,
-          rotate: 0,
-          scale: [1, 1],
-          matrix: ""
-        },
-        state: {
-          locked: w.locked ?? false,
-          visible: w.visible ?? true,
-          // SE's `variables.expanded` is the editor's collapsed/open state.
-          expanded: w.variables?.expanded ?? true
-        }
-      };
-      const module = {
-        id: lumiaGroupId,
-        loaded: true,
-        settings: { title: defaultLabelForSEWidget(w), type: "group" },
-        lights: [],
-        css: {},
-        content: {
-          se_provenance: { widget: w, reason: "Imported as native group", status: "group" }
-        },
-        events: {},
-        variables: {}
-      };
-      layers.push(layer);
-      modules[lumiaGroupId] = module;
-      recordCoverage(coverage, { unit: { layer, module }, status: "direct", lumiaType: "group" }, w.type);
-    }
-    for (const w of widgets) {
-      if (w.type === "se-widget-group") continue;
-      const result = dispatch(w);
-      if (typeof w.group === "string") {
-        const parentLumiaGroupId = seUidToLumiaGroupId[w.group];
-        if (parentLumiaGroupId) {
-          result.unit.layer.group = parentLumiaGroupId;
-        }
+  const seUidToLumiaGroupId = {};
+  const groupWidgetByUid = {};
+  for (const w of widgets) {
+    if (w.type !== "se-widget-group") continue;
+    const uid = w.variables?.uid;
+    if (typeof uid !== "string") continue;
+    const lumiaGroupId = nanoid3();
+    seUidToLumiaGroupId[uid] = lumiaGroupId;
+    groupWidgetByUid[uid] = w;
+  }
+  for (const uid of Object.keys(groupWidgetByUid)) {
+    const w = groupWidgetByUid[uid];
+    const lumiaGroupId = seUidToLumiaGroupId[uid];
+    const parentUid = typeof w.group === "string" ? w.group : null;
+    const parentLumiaGroupId = parentUid ? seUidToLumiaGroupId[parentUid] ?? null : null;
+    const bounds = seCssToBounds(w.css, { width: 200, height: 200 }, importCanvas);
+    const layer = {
+      id: lumiaGroupId,
+      type: "group",
+      group: parentLumiaGroupId,
+      bounds: {
+        x: bounds.x,
+        y: bounds.y,
+        width: bounds.width,
+        height: bounds.height,
+        opacity: bounds.opacity,
+        zIndex: bounds.zIndex,
+        rotate: 0,
+        scale: [1, 1],
+        matrix: ""
+      },
+      state: {
+        locked: w.locked ?? false,
+        visible: w.visible ?? true,
+        // SE's `variables.expanded` is the editor's collapsed/open state.
+        expanded: w.variables?.expanded ?? true
       }
-      layers.push(result.unit.layer);
-      const module = result.unit.module;
-      if (result.status === "placeholder" || result.status === "template") {
-        module.content = {
-          ...module.content ?? {},
-          se_provenance: {
-            widget: w,
-            reason: reasonFor(w.type, result.status, result.flaggedOff),
-            status: result.status,
-            flaggedOff: result.flaggedOff
-          }
-        };
-        reviewItems.push({
-          moduleId: module.id,
-          seWidget: w,
-          status: result.status,
-          reason: reasonFor(w.type, result.status, result.flaggedOff),
-          flaggedOff: result.flaggedOff
-        });
+    };
+    const module = {
+      id: lumiaGroupId,
+      loaded: true,
+      settings: { title: defaultLabelForSEWidget(w), type: "group" },
+      lights: [],
+      css: {},
+      content: {
+        se_provenance: { widget: w, reason: "Imported as native group", status: "group" }
+      },
+      events: {},
+      variables: {}
+    };
+    layers.push(layer);
+    modules[lumiaGroupId] = module;
+    recordCoverage(coverage, { unit: { layer, module }, status: "direct", lumiaType: "group" }, w.type);
+  }
+  for (const w of widgets) {
+    if (w.type === "se-widget-group") continue;
+    const result = dispatch(w, ctx);
+    if (typeof w.group === "string") {
+      const parentLumiaGroupId = seUidToLumiaGroupId[w.group];
+      if (parentLumiaGroupId) {
+        result.unit.layer.group = parentLumiaGroupId;
       }
-      modules[module.id] = module;
-      recordCoverage(coverage, result, w.type);
-    }
-    if (coverage.mappings.some((m) => m.status === "placeholder")) {
-      coverage.notes.push("Some widgets imported as placeholder text layers \u2014 see SE/05-widget-to-module-mapping.md for status.");
     }
-    if (coverage.mappings.some((m) => m.seType === "se-widget-merch-goal")) {
-      coverage.notes.push("Merch-goal widgets imported as generic goals \u2014 see SE/03-missing-variables.md \xA78 for the missing data source.");
-    }
-    if (coverage.mappings.some((m) => m.seType === "se-widget-custom-event-list")) {
-      coverage.notes.push("\u26A0 Custom widgets are experimental \u2014 they run under the SE compatibility shim (Embed.tsx) which handles most SE APIs but may not cover every edge case. Verify each custom layer renders correctly in the editor.");
+    layers.push(result.unit.layer);
+    const module = result.unit.module;
+    if (result.status === "placeholder" || result.status === "template") {
+      module.content = {
+        ...module.content ?? {},
+        se_provenance: {
+          widget: w,
+          reason: reasonFor(w.type, result.status, result.flaggedOff),
+          status: result.status,
+          flaggedOff: result.flaggedOff
+        }
+      };
+      reviewItems.push({
+        moduleId: module.id,
+        seWidget: w,
+        status: result.status,
+        reason: reasonFor(w.type, result.status, result.flaggedOff),
+        flaggedOff: result.flaggedOff
+      });
     }
-    const overlay = {
-      uuid: "",
-      listen_id: "",
-      name: seOverlay?.name ? `[SE] ${seOverlay.name}` : `Imported from StreamElements (${seOverlay?._id ?? ""})`,
-      description: seOverlay?._id ? `Imported from StreamElements overlay ${seOverlay._id}` : "Imported from StreamElements",
-      settings: {
-        metadata: {
-          width: seOverlay?.settings?.width ?? 1920,
-          height: seOverlay?.settings?.height ?? 1080
-        },
-        layers,
-        modules
-      },
+    modules[module.id] = module;
+    recordCoverage(coverage, result, w.type);
+  }
+  if (coverage.mappings.some((m) => m.status === "placeholder")) {
+    coverage.notes.push("Some widgets imported as placeholder text layers \u2014 see SE/05-widget-to-module-mapping.md for status.");
+  }
+  if (coverage.mappings.some((m) => m.seType === "se-widget-merch-goal")) {
+    coverage.notes.push("Merch-goal widgets imported as generic goals \u2014 see SE/03-missing-variables.md \xA78 for the missing data source.");
+  }
+  if (coverage.mappings.some((m) => m.seType === "se-widget-custom-event-list")) {
+    coverage.notes.push("\u26A0 Custom widgets are experimental \u2014 they run under the SE compatibility shim (Embed.tsx) which handles most SE APIs but may not cover every edge case. Verify each custom layer renders correctly in the editor.");
+  }
+  const overlay = {
+    uuid: "",
+    listen_id: "",
+    name: seOverlay?.name ? `[SE] ${seOverlay.name}` : `Imported from StreamElements (${seOverlay?._id ?? ""})`,
+    description: seOverlay?._id ? `Imported from StreamElements overlay ${seOverlay._id}` : "Imported from StreamElements",
+    settings: {
       metadata: {
-        width: seOverlay?.settings?.width ?? null,
-        height: seOverlay?.settings?.height ?? null
+        width: seOverlay?.settings?.width ?? 1920,
+        height: seOverlay?.settings?.height ?? 1080
       },
-      layers_count: layers.length,
-      hasFullSettings: true
-    };
-    console.log("[SE-IMPORT] import complete", {
-      overlayName: overlay.name,
-      layerCount: overlay.layers_count,
-      coverage,
-      reviewItemCount: reviewItems.length,
-      reviewItems,
-      modules: overlay.settings.modules
-    });
-    return { overlay, coverage, reviewItems };
-  } finally {
-    setImportCanvas(null);
-  }
+      layers,
+      modules
+    },
+    metadata: {
+      width: seOverlay?.settings?.width ?? null,
+      height: seOverlay?.settings?.height ?? null
+    },
+    layers_count: layers.length,
+    hasFullSettings: true
+  };
+  console.log("[SE-IMPORT] import complete", {
+    overlayName: overlay.name,
+    layerCount: overlay.layers_count,
+    coverage,
+    reviewItemCount: reviewItems.length
+  });
+  return { overlay, coverage, reviewItems };
 }
 function applyReviewAction(result, moduleId, action, payload) {
   if (action === "keep") return result;
@@ -6982,9 +7032,15 @@ function applyReviewAction(result, moduleId, action, payload) {
       state: existingLayer.state
     };
     const provenance2 = existing2.content?.se_provenance;
+    const mergedLights = (existing2.lights?.length ?? 0) > 0 ? existing2.lights : transplant.module.lights;
+    const mergedEvents = existing2.events && Object.keys(existing2.events).length > 0 ? { ...transplant.module.events, ...existing2.events } : transplant.module.events;
+    const mergedVariables = existing2.variables && Object.keys(existing2.variables).length > 0 ? { ...transplant.module.variables, ...existing2.variables } : transplant.module.variables;
     const newModule = {
       ...transplant.module,
       id: moduleId,
+      lights: mergedLights,
+      events: mergedEvents,
+      variables: mergedVariables,
       content: { ...transplant.module.content ?? {}, se_provenance: provenance2 }
     };
     const rootOldNewId = transplant.layer.id;
@@ -7055,6 +7111,11 @@ function buildAIPromptForSEWidget(widget, canvas) {
   const listener = typeof widget.listener === "string" ? widget.listener : null;
   const listeners = widget.listeners && typeof widget.listeners === "object" && !Array.isArray(widget.listeners) ? Object.keys(widget.listeners) : null;
   const landing = getAILandingBounds(widget, canvas);
+  const VARIABLES_BUDGET = 6e3;
+  const fullVariables = JSON.stringify(variables, null, 2);
+  const truncated = fullVariables.length > VARIABLES_BUDGET;
+  const variablesJson = truncated ? `${fullVariables.slice(0, VARIABLES_BUDGET)}
+\u2026[truncated \u2014 ${fullVariables.length - VARIABLES_BUDGET} more bytes elided]` : fullVariables;
   return [
     "Recreate a StreamElements overlay widget as a Lumia Stream custom overlay (HTML + CSS + JS).",
     "",
@@ -7062,10 +7123,11 @@ function buildAIPromptForSEWidget(widget, canvas) {
     listener ? `Primary event listener: ${listener}` : "",
     listeners ? `Subscribes to events: ${listeners.join(", ")}` : "",
     `Canvas: ${landing.width} \xD7 ${landing.height}`,
+    truncated ? "Note: the widget config below is truncated \u2014 focus on visible/structural fields and ignore tail content you cannot see." : "",
     "",
     "Widget configuration (JSON):",
     "```json",
-    JSON.stringify(variables, null, 2).slice(0, 6e3),
+    variablesJson,
     "```",
     "",
     "Constraints \u2014 your output must run inside a Lumia Custom Overlay sandboxed iframe:",
@@ -7085,7 +7147,6 @@ export {
   SEAuthError,
   SEClient,
   SEImportWizard,
-  SE_IMPORT_FLAGS,
   SE_WIDGET_TO_MARKETPLACE_CANDIDATES,
   applyReviewAction,
   buildAIPromptForSEWidget,