@lumiastream/ui 0.2.6 → 0.2.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/index.d.ts +318 -2
  2. package/dist/index.js +2576 -0
  3. package/package.json +60 -59
package/dist/index.js CHANGED
@@ -3052,7 +3052,2561 @@ var resolveChatterProfileUrlWithResolvers = async ({
3052
3052
  userId: normalizedUserId || void 0
3053
3053
  });
3054
3054
  };
3055
+
3056
+ // src/se-import/index.ts
3057
+ import { nanoid as nanoid3 } from "nanoid";
3058
+
3059
+ // src/se-import/translate.ts
3060
+ var SE_TO_LUMIA_PLACEHOLDER = {
3061
+ name: "username",
3062
+ username: "username",
3063
+ displayName: "displayname",
3064
+ sender: "gifter",
3065
+ amount: "amount",
3066
+ currency: "currency",
3067
+ message: "message",
3068
+ items: "itemsDetailed",
3069
+ item: "firstItem.name",
3070
+ count: "amount",
3071
+ total: "total",
3072
+ gifts: "giftAmount"
3073
+ };
3074
+ function listenerPlaceholderContext(listener) {
3075
+ if (listener === "follower-latest") return { name: "twitch_last_follower", username: "twitch_last_follower" };
3076
+ if (listener === "subscriber-latest" || listener === "subscriber-new-latest" || listener === "subscriber-resub-latest") {
3077
+ return { name: "twitch_last_subscriber", username: "twitch_last_subscriber" };
3078
+ }
3079
+ if (listener === "subscriber-gifted-latest") return { name: "twitch_last_gifter", username: "twitch_last_gifter", amount: "twitch_last_gifter_amount", count: "twitch_last_gifter_amount" };
3080
+ if (listener === "subscriber-alltime-gifter") return { name: "twitch_alltime_top_gifter", username: "twitch_alltime_top_gifter", amount: "twitch_alltime_top_gifter_amount", count: "twitch_alltime_top_gifter_amount" };
3081
+ if (listener === "cheer-latest") return { name: "twitch_last_bit", username: "twitch_last_bit", amount: "twitch_last_bit_amount", count: "twitch_last_bit_amount" };
3082
+ if (listener === "tip-latest" || listener === "latest_donator") {
3083
+ return { name: "latest_donator", username: "latest_donator", amount: "latest_donator_amount", count: "latest_donator_amount", currency: "latest_donator_currency_symbol" };
3084
+ }
3085
+ if (listener === "raid-latest") return { name: "twitch_last_raider", username: "twitch_last_raider", amount: "twitch_last_raid_amount", count: "twitch_last_raid_amount" };
3086
+ if (listener === "follower-session") return { amount: "twitch_session_follower_count", count: "twitch_session_follower_count" };
3087
+ if (listener === "subscriber-session") return { amount: "twitch_session_subscribers_count", count: "twitch_session_subscribers_count" };
3088
+ if (listener === "cheer-session") return { amount: "twitch_session_bits_count", count: "twitch_session_bits_count" };
3089
+ if (listener === "tip-session") return { amount: "session_donation_amount", count: "session_donation_count", currency: "session_donation_amount_currency_symbol" };
3090
+ if (listener === "follower-total") return { amount: "twitch_total_follower_count", count: "twitch_total_follower_count" };
3091
+ if (listener === "subscriber-total") return { amount: "twitch_total_subscriber_count", count: "twitch_total_subscriber_count" };
3092
+ if (listener === "cheer-total") return { amount: "twitch_total_bits_count", count: "twitch_total_bits_count" };
3093
+ if (listener === "tip-total") return { amount: "total_donation_amount", count: "total_donation_amount", currency: "total_donation_amount_currency_symbol" };
3094
+ if (listener === "tip-count") return { amount: "donation_count", count: "donation_count" };
3095
+ if (listener === "cheer-session-top-donation") return { amount: "twitch_session_top_cheer_amount", count: "twitch_session_top_cheer_amount" };
3096
+ if (listener === "cheer-session-top-donator") return { name: "twitch_session_top_cheerer", username: "twitch_session_top_cheerer", amount: "twitch_session_top_cheerer_amount", count: "twitch_session_top_cheerer_amount" };
3097
+ if (listener === "tip-session-top-donation") return { amount: "session_top_donator_amount", count: "session_top_donator_amount", currency: "session_top_donator_currency_symbol" };
3098
+ if (listener === "tip-session-top-donator") return { name: "session_top_donator", username: "session_top_donator", amount: "session_top_donator_amount", count: "session_top_donator_amount", currency: "session_top_donator_currency_symbol" };
3099
+ if (listener === "twitch_session_chat_count") return { wins: "twitch_session_chat_count", count: "twitch_session_chat_count", amount: "twitch_session_chat_count" };
3100
+ if (listener === "merch-latest" || listener === "purchase-latest") {
3101
+ return {
3102
+ name: "fourthwall_last_order.username",
3103
+ username: "fourthwall_last_order.username",
3104
+ amount: "fourthwall_last_order.amount",
3105
+ count: "fourthwall_last_order.itemsCount",
3106
+ currency: "fourthwall_last_order.currency",
3107
+ items: "fourthwall_last_order.items",
3108
+ item: "fourthwall_last_order.firstItem.name",
3109
+ message: "fourthwall_last_order.message"
3110
+ };
3111
+ }
3112
+ return {};
3113
+ }
3114
+ function translateSeText(input, listener) {
3115
+ if (!input) return "";
3116
+ const ctx = listener ? listenerPlaceholderContext(listener) : {};
3117
+ return input.replace(/\{([a-zA-Z][a-zA-Z0-9_.]*)\}/g, (_match, raw) => {
3118
+ const mapped = ctx[raw] ?? SE_TO_LUMIA_PLACEHOLDER[raw] ?? raw;
3119
+ return `{{${mapped}}}`;
3120
+ });
3121
+ }
3122
+ function listenerToLumiaVariable(listener) {
3123
+ if (typeof listener !== "string" || !listener) return "username";
3124
+ const m = {
3125
+ // Latest events
3126
+ "follower-latest": "twitch_last_follower",
3127
+ "subscriber-latest": "twitch_last_subscriber",
3128
+ "subscriber-new-latest": "twitch_last_subscriber",
3129
+ "subscriber-resub-latest": "twitch_last_subscriber",
3130
+ "subscriber-gifted-latest": "twitch_last_gifter",
3131
+ "subscriber-alltime-gifter": "twitch_alltime_top_gifter",
3132
+ "tip-latest": "latest_donator",
3133
+ "cheer-latest": "twitch_last_bit",
3134
+ "raid-latest": "twitch_last_raider",
3135
+ // Counters — session / total / week / month
3136
+ "follower-session": "twitch_session_follower_count",
3137
+ "follower-week": "twitch_week_follower_count",
3138
+ "follower-month": "twitch_month_follower_count",
3139
+ "follower-total": "twitch_total_follower_count",
3140
+ "subscriber-session": "twitch_session_subscribers_count",
3141
+ "subscriber-new-session": "twitch_session_new_subscribers_count",
3142
+ "subscriber-resub-session": "twitch_session_resub_subscribers_count",
3143
+ "subscriber-gifted-session": "twitch_session_gifted_subscribers_count",
3144
+ "subscriber-week": "twitch_week_subscriber_count",
3145
+ "subscriber-month": "twitch_month_subscriber_count",
3146
+ "subscriber-total": "twitch_total_subscriber_count",
3147
+ "cheer-session": "twitch_session_bits_count",
3148
+ "cheer-week": "twitch_week_bits_count",
3149
+ "cheer-month": "twitch_month_bits_count",
3150
+ "cheer-total": "twitch_total_bits_count",
3151
+ "tip-session": "session_donation_amount",
3152
+ "tip-week": "week_donation_amount",
3153
+ "tip-month": "month_donation_amount",
3154
+ "tip-total": "total_donation_amount",
3155
+ "tip-count": "donation_count",
3156
+ // Top donors / cheerers — session / week / month / all-time
3157
+ "tip-session-top-donation": "session_top_donator_amount",
3158
+ "tip-session-top-donator": "session_top_donator",
3159
+ "tip-weekly-top-donation": "week_top_donator_amount",
3160
+ "tip-weekly-top-donator": "week_top_donator",
3161
+ "tip-monthly-top-donation": "month_top_donator_amount",
3162
+ "tip-monthly-top-donator": "month_top_donator",
3163
+ "tip-alltime-top-donation": "top_donator_amount",
3164
+ "tip-alltime-top-donator": "top_donator",
3165
+ "cheer-session-top-donation": "twitch_session_top_cheer_amount",
3166
+ "cheer-session-top-donator": "twitch_session_top_cheerer",
3167
+ // Hype train readouts (SE captures these as listener keys on text widgets)
3168
+ "hypetrain-latest": "twitch_hypetrain_total",
3169
+ "hypetrain-level-progress": "twitch_hypetrain_progress",
3170
+ "hypetrain-level-goal": "twitch_hypetrain_level_goal",
3171
+ "hypetrain-total": "twitch_hypetrain_total",
3172
+ "hypetrain-latest-top-contributors": "twitch_hypetrain_top_contributor",
3173
+ "cheer-weekly-top-donation": "twitch_week_top_cheerer_amount",
3174
+ "cheer-weekly-top-donator": "twitch_week_top_cheerer",
3175
+ "cheer-monthly-top-donation": "twitch_month_top_cheerer_amount",
3176
+ "cheer-monthly-top-donator": "twitch_month_top_cheerer",
3177
+ "cheer-alltime-top-donation": "twitch_alltime_top_cheerer_amount",
3178
+ "cheer-alltime-top-donator": "twitch_alltime_top_cheerer"
3179
+ };
3180
+ return m[listener] ?? listener.replace(/-/g, "_");
3181
+ }
3182
+ function seCssToBounds(css, defaults = { width: 600, height: 200 }, canvas) {
3183
+ const toPx = (v, fallback, axis) => {
3184
+ if (v == null) return fallback;
3185
+ if (typeof v === "number") return v;
3186
+ const s = v.trim();
3187
+ if (s === "auto" || s === "") return fallback;
3188
+ if (s.endsWith("%")) {
3189
+ const pct = parseFloat(s);
3190
+ if (canvas && axis && Number.isFinite(pct)) {
3191
+ const base = axis === "width" ? canvas.width : canvas.height;
3192
+ return pct / 100 * base;
3193
+ }
3194
+ return fallback;
3195
+ }
3196
+ const parsed = parseFloat(s);
3197
+ return Number.isFinite(parsed) ? parsed : fallback;
3198
+ };
3199
+ const width = toPx(css.width, defaults.width, "width");
3200
+ const height = toPx(css.height, defaults.height, "height");
3201
+ let x = toPx(css.left, 0, "width");
3202
+ let y = toPx(css.top, 0, "height");
3203
+ if (typeof css.transform === "string" && css.transform.includes("translate")) {
3204
+ const m = /translate\s*\(\s*([^,)]+)\s*(?:,\s*([^)]+))?\s*\)/i.exec(css.transform);
3205
+ if (m) {
3206
+ const parseShift = (raw, basis) => {
3207
+ if (!raw) return 0;
3208
+ const s = raw.trim();
3209
+ if (s.endsWith("%")) {
3210
+ const pct = parseFloat(s);
3211
+ return Number.isFinite(pct) ? pct / 100 * basis : 0;
3212
+ }
3213
+ const px = parseFloat(s);
3214
+ return Number.isFinite(px) ? px : 0;
3215
+ };
3216
+ x += parseShift(m[1], width);
3217
+ y += parseShift(m[2], height);
3218
+ }
3219
+ }
3220
+ return {
3221
+ x,
3222
+ y,
3223
+ width,
3224
+ height,
3225
+ opacity: css.opacity ?? 1,
3226
+ zIndex: css["z-index"] ?? 0
3227
+ };
3228
+ }
3229
+ var LUMIA_DEFAULT_SIZES = {
3230
+ text: { width: 600, height: 200 },
3231
+ image: { width: 200, height: 200 },
3232
+ video: { width: 400, height: 220 },
3233
+ audio: { width: 200, height: 200 },
3234
+ slideshow: { width: 400, height: 220 },
3235
+ alert: { width: 700, height: 600 },
3236
+ goal: { width: 740, height: 80 },
3237
+ timer: { width: 740, height: 80 },
3238
+ chatbox: { width: 375, height: 470 },
3239
+ eventlist: { width: 375, height: 470 },
3240
+ credits: { width: 700, height: 700 },
3241
+ custom: { width: 700, height: 700 },
3242
+ emotealert: { width: 600, height: 600 },
3243
+ emotebox: { width: 400, height: 400 },
3244
+ nowplaying: { width: 600, height: 250 },
3245
+ spotify: { width: 600, height: 250 },
3246
+ youtubemusic: { width: 600, height: 250 }
3247
+ };
3248
+ function translateVariationCondition(seType, seCondition, requirement) {
3249
+ if (seType === "gift") return { conditionType: "IS_GIFT", condition: 1 };
3250
+ if (seType === "communityGift") return { conditionType: "GIFT_SUB_GREATER", condition: requirement ?? 0 };
3251
+ if (seCondition === "EXACT" && requirement != null) return { conditionType: "EQUAL_NUMBER", condition: requirement };
3252
+ if (seCondition === "ATLEAST" && requirement != null) {
3253
+ return { conditionType: "GREATER_NUMBER", condition: requirement };
3254
+ }
3255
+ return null;
3256
+ }
3257
+ var LUMIA_LAYOUTS = /* @__PURE__ */ new Set(["column", "row", "onlyImage", "onlyText", "imageOver", "textOver"]);
3258
+ function translateLayout(seLayout) {
3259
+ if (seLayout && LUMIA_LAYOUTS.has(seLayout)) return seLayout;
3260
+ return "column";
3261
+ }
3262
+
3263
+ // src/se-import/mappers/build.ts
3264
+ import { nanoid } from "nanoid";
3265
+ var currentImportCanvas = null;
3266
+ function setImportCanvas(canvas) {
3267
+ currentImportCanvas = canvas;
3268
+ }
3269
+ function buildUnit(widget, lumiaType, moduleExtras) {
3270
+ const id = nanoid();
3271
+ const defaults = LUMIA_DEFAULT_SIZES[lumiaType] ?? { width: 400, height: 400 };
3272
+ const bounds = seCssToBounds(widget.css, defaults, currentImportCanvas ?? void 0);
3273
+ const layer = {
3274
+ id,
3275
+ state: { visible: widget.visible ?? true, locked: widget.locked ?? false },
3276
+ bounds: {
3277
+ x: bounds.x,
3278
+ y: bounds.y,
3279
+ width: bounds.width,
3280
+ height: bounds.height,
3281
+ scale: [1, 1],
3282
+ opacity: bounds.opacity,
3283
+ zIndex: bounds.zIndex
3284
+ }
3285
+ };
3286
+ const module = {
3287
+ id,
3288
+ version: 1,
3289
+ settings: {
3290
+ type: lumiaType,
3291
+ title: widget.name ?? null,
3292
+ locked: widget.locked ?? false
3293
+ },
3294
+ lights: [],
3295
+ css: {},
3296
+ content: {},
3297
+ variables: {},
3298
+ events: {},
3299
+ ...moduleExtras
3300
+ };
3301
+ return { layer, module };
3302
+ }
3303
+
3304
+ // src/se-import/mappers/basic.ts
3305
+ function mapText(widget) {
3306
+ const value = translateSeText(widget.text?.value ?? "");
3307
+ const seCss = widget.text?.css ?? {};
3308
+ return buildUnit(widget, "text", {
3309
+ content: {
3310
+ value,
3311
+ highlightColor: "inherit"
3312
+ },
3313
+ css: {
3314
+ fontSize: seCss["font-size"] ?? 24,
3315
+ textAlign: seCss["text-align"] ?? "center",
3316
+ fontFamily: seCss["font-family"] ?? "Roboto",
3317
+ fontWeight: seCss["font-weight"] ?? "bold",
3318
+ color: seCss["color"] ?? "#ffffff",
3319
+ textShadow: seCss["text-shadow"] ?? "rgb(0, 0, 0) 1px 1px 1px",
3320
+ lineHeight: seCss["line-height"] ?? 1,
3321
+ background: "transparent"
3322
+ }
3323
+ });
3324
+ }
3325
+ function mapImage(widget) {
3326
+ return buildUnit(widget, "image", {
3327
+ content: {
3328
+ src: widget.image?.src ?? "",
3329
+ loop: true
3330
+ }
3331
+ });
3332
+ }
3333
+ function mapVideo(widget) {
3334
+ return buildUnit(widget, "video", {
3335
+ content: {
3336
+ src: widget.video?.src ?? "",
3337
+ volume: widget.video?.volume ?? 0.5,
3338
+ loop: true,
3339
+ muted: false
3340
+ }
3341
+ });
3342
+ }
3343
+ function mapReadout(widget, fallbackVar) {
3344
+ const explicitListener = widget.variables?.listener;
3345
+ const explicit = typeof explicitListener === "string" ? explicitListener : null;
3346
+ const widgetListener = typeof widget.listener === "string" ? widget.listener : null;
3347
+ const listener = explicit ?? widgetListener ?? fallbackVar;
3348
+ const variable = listenerToLumiaVariable(listener);
3349
+ const userTemplate = widget.text?.value ?? "";
3350
+ const inheritsText = userTemplate.trim().length > 0 && /\{[a-zA-Z]/.test(userTemplate);
3351
+ const value = inheritsText ? translateSeText(userTemplate, listener) : `{{${variable}}}`;
3352
+ const seCss = widget.text?.css ?? {};
3353
+ return buildUnit(widget, "text", {
3354
+ content: { value, highlightColor: "inherit" },
3355
+ css: {
3356
+ fontSize: seCss["font-size"] ?? 28,
3357
+ textAlign: seCss["text-align"] ?? "center",
3358
+ fontFamily: seCss["font-family"] ?? "Roboto",
3359
+ fontWeight: seCss["font-weight"] ?? "bold",
3360
+ color: seCss["color"] ?? "#ffffff",
3361
+ textShadow: seCss["text-shadow"] ?? "rgb(0, 0, 0) 1px 1px 1px",
3362
+ lineHeight: seCss["line-height"] ?? 1,
3363
+ background: "transparent"
3364
+ }
3365
+ });
3366
+ }
3367
+
3368
+ // src/se-import/mappers/alert.ts
3369
+ var SE_EVENT_TO_LUMIA_ALERT = {
3370
+ follower: "twitch-follower",
3371
+ subscriber: "twitch-subscriber",
3372
+ tip: "streamelements-donation",
3373
+ cheer: "twitch-bits",
3374
+ raid: "twitch-raid",
3375
+ // Merch / shop-order — Lumia's Fourthwall integration is the data path most
3376
+ // users now have wired up since SE deprecated their own merch flow in favor
3377
+ // of Fourthwall. `fourthwall-shopOrder` is the alert key from
3378
+ // LumiaAlertValues / activity.types.ts.
3379
+ merch: "fourthwall-shopOrder",
3380
+ purchase: "fourthwall-shopOrder",
3381
+ charityCampaignDonation: "twitch-charityDonation",
3382
+ host: "twitch-raid",
3383
+ redemption: "twitch-redemption"
3384
+ };
3385
+ function pickGraphics(g) {
3386
+ if (!g) return { type: "image", content: { src: "", loop: false, volume: 1 } };
3387
+ return {
3388
+ type: g.type === "video" ? "video" : "image",
3389
+ content: {
3390
+ src: g.src ?? "",
3391
+ loop: false,
3392
+ volume: g.volume ?? 0.5
3393
+ }
3394
+ };
3395
+ }
3396
+ var SE_DEFAULT_DURATION_BY_EVENT = {
3397
+ follower: 5,
3398
+ subscriber: 10,
3399
+ tip: 5,
3400
+ cheer: 5,
3401
+ raid: 8,
3402
+ host: 8,
3403
+ merch: 8,
3404
+ purchase: 8,
3405
+ charityCampaignDonation: 8,
3406
+ redemption: 5
3407
+ };
3408
+ function buildAlertEvent(seEvent, seEventType) {
3409
+ if (!seEvent) {
3410
+ return { on: false, variations: [] };
3411
+ }
3412
+ const text = seEvent.text ?? {};
3413
+ const css = text.css ?? {};
3414
+ const messageCss = css.message ?? {};
3415
+ const highlight = css.highlights ?? {};
3416
+ const variations = (seEvent.variations ?? []).map((variation) => buildAlertVariation(variation, seEventType)).filter((v) => v != null);
3417
+ const defaultDuration = (seEventType && SE_DEFAULT_DURATION_BY_EVENT[seEventType]) ?? 8;
3418
+ return {
3419
+ on: seEvent.enabled !== false,
3420
+ theme: "CUSTOM",
3421
+ themeSettings: {
3422
+ primaryColor: null,
3423
+ accentColor: null,
3424
+ highlightColor: highlight.color ?? null,
3425
+ firstMessageTemplate: translateSeText(text.message ?? "{{username}}"),
3426
+ secondMessageTemplate: "",
3427
+ thirdMessageTemplate: "",
3428
+ showAvatar: false,
3429
+ showAmount: true,
3430
+ showBrandIcon: true
3431
+ },
3432
+ settings: { duration: (seEvent.duration ?? defaultDuration) * 1e3 },
3433
+ layout: { value: translateLayout(seEvent.layout), css: {}, customCss: "" },
3434
+ text: {
3435
+ css: {
3436
+ fontFamily: css["font-family"] ?? "Roboto",
3437
+ fontSize: css["font-size"] ?? 30,
3438
+ color: css.color ?? "#ffffff",
3439
+ fontWeight: css["font-weight"] ?? "bold",
3440
+ textShadow: css["text-shadow"] ?? "rgba(0, 0, 0, 0.8) 1px 1px 1px",
3441
+ textAlign: css["text-align"] ?? "center"
3442
+ },
3443
+ messageCss,
3444
+ content: { value: translateSeText(text.message ?? "") }
3445
+ },
3446
+ media: pickGraphics(seEvent.graphics),
3447
+ audio: {
3448
+ content: {
3449
+ src: seEvent.audio?.src ?? "",
3450
+ volume: seEvent.audio?.volume ?? 0.5
3451
+ }
3452
+ },
3453
+ animations: {
3454
+ alertEnterAnimation: seEvent.animation?.in ?? "fadeIn",
3455
+ alertEnterAnimationDuration: (seEvent.animation?.inDuration ?? 1) * 1e3,
3456
+ alertExitAnimation: seEvent.animation?.out ?? "fadeOut",
3457
+ alertExitAnimationDuration: (seEvent.animation?.outDuration ?? 1) * 1e3,
3458
+ textEnterAnimation: text.animation ?? "",
3459
+ textEnterAnimationDuration: 1e3
3460
+ },
3461
+ tts: {
3462
+ enabled: !!seEvent.tts?.enabled,
3463
+ voice: seEvent.tts?.voice ?? "Brian",
3464
+ volume: seEvent.tts?.volume ?? 0.75,
3465
+ minAmount: seEvent.tts?.minAmount ?? 0
3466
+ },
3467
+ variations
3468
+ };
3469
+ }
3470
+ function buildAlertVariation(v, seEventType) {
3471
+ const translated = translateVariationCondition(v.type ?? null, v.condition ?? null, v.requirement ?? null);
3472
+ if (!translated) return null;
3473
+ const base = buildAlertEvent(v.settings, seEventType);
3474
+ return {
3475
+ name: v.name ?? "Variation",
3476
+ on: v.enabled !== false,
3477
+ randomChance: v.chance ?? 100,
3478
+ conditionType: translated.conditionType,
3479
+ condition: translated.condition,
3480
+ conditionExtra: null,
3481
+ ...base
3482
+ };
3483
+ }
3484
+ function mapAlertBox(widget, opts = {}) {
3485
+ const v = widget.variables ?? {};
3486
+ const events = {};
3487
+ const eventKeys = opts.onlyEvents ?? ["follower", "subscriber", "tip", "cheer", "raid", "merch", "purchase", "charityCampaignDonation"];
3488
+ for (const seKey of eventKeys) {
3489
+ const ev = v[seKey];
3490
+ if (!ev || typeof ev !== "object") continue;
3491
+ const lumiaAlert = SE_EVENT_TO_LUMIA_ALERT[seKey];
3492
+ if (!lumiaAlert) continue;
3493
+ events[lumiaAlert] = buildAlertEvent(ev, seKey);
3494
+ }
3495
+ return buildUnit(widget, "alert", { alert: { events } });
3496
+ }
3497
+ function mapSingleAlert(widget, lumiaAlertKey) {
3498
+ const v = widget.variables ?? {};
3499
+ const events = {
3500
+ [lumiaAlertKey]: buildAlertEvent(v)
3501
+ };
3502
+ return buildUnit(widget, "alert", { alert: { events } });
3503
+ }
3504
+
3505
+ // src/se-import/mappers/goal.ts
3506
+ function currentForListener(listener) {
3507
+ if (!listener) return "0";
3508
+ if (listener.startsWith("follower-")) return "{{twitch_total_follower_count}}";
3509
+ if (listener.startsWith("subscriber-")) return "{{twitch_total_subscriber_count}}";
3510
+ if (listener.startsWith("cheer-")) return "{{twitch_total_bits_count}}";
3511
+ if (listener.startsWith("tip-")) return "{{total_donation_amount}}";
3512
+ if (listener.startsWith("merch-")) return "{{fourthwall_total_order_count}}";
3513
+ return "0";
3514
+ }
3515
+ function mapGoal(widget) {
3516
+ const v = widget.variables ?? {};
3517
+ const listener = v.goalListener ?? (typeof widget.listener === "string" ? widget.listener : null);
3518
+ return buildUnit(widget, "goal", {
3519
+ content: {
3520
+ version: 1,
3521
+ // Matches GoalTypes enum in components/Modules/Views/Goal/types.ts.
3522
+ type: "bar",
3523
+ label: translateSeText(v.title ?? "Goal"),
3524
+ subLabel: "",
3525
+ // The Goal module renders this template literal with {{current}} + {{goal}} substituted.
3526
+ display: "{{current}} / {{goal}}",
3527
+ // `current` is a template variable reference (resolved at render time from session variables).
3528
+ // `targetGoal` is the numeric ceiling. Both required by Goal/index.tsx:28-29.
3529
+ current: currentForListener(listener),
3530
+ targetGoal: String(v.goalAmount ?? 100),
3531
+ image: "",
3532
+ audio: { decrement: "", increment: "", goal: "", goalFailed: "", volume: 1 },
3533
+ // `null` (rather than `''`) is the cleaner contract — Goal/index.tsx:11's
3534
+ // `isGoalExpired` treats any falsy as not-expired so both work at render time,
3535
+ // but `null` survives JSON round-trips without ambiguity ('' vs unset).
3536
+ endDate: v.endDate ?? null,
3537
+ goalAnimation: "",
3538
+ goalAnimationLoop: true,
3539
+ unfilledColor: v.backgroundColor ?? "#400022",
3540
+ filledColor: v.fillColor ?? "#ff0055",
3541
+ alignItemsToEdges: false,
3542
+ border: "solid 1px transparent",
3543
+ borderRadius: "40px",
3544
+ highlightColor: "inherit",
3545
+ // SE-only fields preserved as provenance — no native Lumia equivalent.
3546
+ se_source_listener: listener,
3547
+ se_simple_design: !!v.simpleDesign
3548
+ },
3549
+ css: {
3550
+ borderRadius: "0px",
3551
+ borderStyle: "solid",
3552
+ borderWidth: "0px",
3553
+ borderColor: "transparent",
3554
+ lineHeight: 1,
3555
+ fontSize: 30,
3556
+ textAlign: "center",
3557
+ fontFamily: "Roboto",
3558
+ fontWeight: "bold",
3559
+ color: "#ffffff",
3560
+ textShadow: "rgb(0, 0, 0) 1px 1px 1px",
3561
+ background: "transparent"
3562
+ }
3563
+ });
3564
+ }
3565
+
3566
+ // src/se-import/mappers/custom.ts
3567
+ var SE_FIELD_TYPE_TO_LUMIA = {
3568
+ text: "input",
3569
+ number: "number",
3570
+ checkbox: "checkbox",
3571
+ dropdown: "dropdown",
3572
+ slider: "slider",
3573
+ colorpicker: "colorpicker",
3574
+ fontpicker: "fontpicker",
3575
+ image: "input"
3576
+ };
3577
+ function translateConfigs(seFields) {
3578
+ if (!seFields) return [];
3579
+ return Object.entries(seFields).map(([key, f]) => ({
3580
+ key,
3581
+ label: f.label ?? key,
3582
+ type: SE_FIELD_TYPE_TO_LUMIA[f.type ?? "text"] ?? "input",
3583
+ value: f.value,
3584
+ options: f.options
3585
+ }));
3586
+ }
3587
+ function mapCustom(widget) {
3588
+ const v = widget.variables ?? {};
3589
+ const parse = (x) => {
3590
+ if (x == null) return void 0;
3591
+ if (typeof x !== "string") return x;
3592
+ try {
3593
+ return JSON.parse(x);
3594
+ } catch {
3595
+ return void 0;
3596
+ }
3597
+ };
3598
+ const fields = parse(v.fields) ?? v.fields;
3599
+ const fieldData = parse(v.fieldData) ?? v.fieldData;
3600
+ return buildUnit(widget, "custom", {
3601
+ content: {
3602
+ codeId: String(widget.id),
3603
+ html: v.html ?? "",
3604
+ css: v.css ?? "",
3605
+ js: v.js ?? "",
3606
+ configs: translateConfigs(fields),
3607
+ data: fieldData ?? {},
3608
+ flavor: "streamelements"
3609
+ }
3610
+ });
3611
+ }
3612
+ var SEASONAL_TEMPLATE_HTML = '<canvas id="particles"></canvas>';
3613
+ var SEASONAL_TEMPLATE_CSS = `html, body { margin: 0; padding: 0; width: 100%; height: 100%; background: transparent; overflow: hidden; }
3614
+ #particles { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; }`;
3615
+ var SEASONAL_TEMPLATE_JS = `const SEASONS = {
3616
+ snow: { emoji: '\\u2744', count: 80, sizeMin: 14, sizeMax: 28, gravity: 1.0, drift: 0.6, sway: 1.2 },
3617
+ halloween: { emoji: '\\ud83d\\udc7b', count: 25, sizeMin: 28, sizeMax: 44, gravity: 0.6, drift: 0.4, sway: 0.8 },
3618
+ xmas: { emoji: '\\u2744', count: 120, sizeMin: 16, sizeMax: 32, gravity: 1.1, drift: 0.7, sway: 1.3 },
3619
+ valentine: { emoji: '\\u2764\\ufe0f', count: 50, sizeMin: 18, sizeMax: 34, gravity: 0.8, drift: 0.5, sway: 1.0 },
3620
+ easter: { emoji: '\\ud83e\\udd5a', count: 30, sizeMin: 22, sizeMax: 38, gravity: 0.9, drift: 0.3, sway: 0.4 },
3621
+ worldcup: { emoji: '\\u26bd', count: 25, sizeMin: 24, sizeMax: 40, gravity: 1.1, drift: 0.4, sway: 0.5 },
3622
+ };
3623
+ const cfg = SEASONS[(window.DATA && window.DATA.season) || 'snow'] || SEASONS.snow;
3624
+ const canvas = document.getElementById('particles');
3625
+ const ctx = canvas.getContext('2d');
3626
+ const dpr = window.devicePixelRatio || 1;
3627
+ function resize() {
3628
+ canvas.width = window.innerWidth * dpr;
3629
+ canvas.height = window.innerHeight * dpr;
3630
+ canvas.style.width = window.innerWidth + 'px';
3631
+ canvas.style.height = window.innerHeight + 'px';
3632
+ ctx.setTransform(dpr, 0, 0, dpr, 0, 0);
3633
+ }
3634
+ resize();
3635
+ window.addEventListener('resize', resize);
3636
+ const particles = [];
3637
+ for (let i = 0; i < cfg.count; i++) {
3638
+ particles.push({
3639
+ x: Math.random() * window.innerWidth,
3640
+ y: Math.random() * window.innerHeight - window.innerHeight,
3641
+ size: cfg.sizeMin + Math.random() * (cfg.sizeMax - cfg.sizeMin),
3642
+ speed: 0.5 + Math.random() * 1.5,
3643
+ phase: Math.random() * Math.PI * 2,
3644
+ });
3645
+ }
3646
+ function tick(now) {
3647
+ ctx.clearRect(0, 0, window.innerWidth, window.innerHeight);
3648
+ const t = now / 1000;
3649
+ for (const p of particles) {
3650
+ p.y += p.speed * cfg.gravity;
3651
+ const sway = Math.sin(t + p.phase) * cfg.sway;
3652
+ if (p.y > window.innerHeight + 40) {
3653
+ p.y = -40;
3654
+ p.x = Math.random() * window.innerWidth;
3655
+ }
3656
+ ctx.font = p.size + 'px serif';
3657
+ ctx.fillText(cfg.emoji, p.x + sway * 20, p.y);
3658
+ }
3659
+ requestAnimationFrame(tick);
3660
+ }
3661
+ requestAnimationFrame(tick);`;
3662
+ function mapSeasonal(widget, season) {
3663
+ return buildUnit(widget, "custom", {
3664
+ content: {
3665
+ codeId: `seasonal-${season}-${widget.id}`,
3666
+ html: SEASONAL_TEMPLATE_HTML,
3667
+ css: SEASONAL_TEMPLATE_CSS,
3668
+ js: SEASONAL_TEMPLATE_JS,
3669
+ configs: [
3670
+ {
3671
+ key: "season",
3672
+ label: "Season",
3673
+ type: "dropdown",
3674
+ value: season,
3675
+ options: { snow: "Snow", halloween: "Halloween", xmas: "Christmas", valentine: "Valentine's", easter: "Easter", worldcup: "World Cup" }
3676
+ }
3677
+ ],
3678
+ data: { season },
3679
+ flavor: "lumia-seasonal"
3680
+ }
3681
+ });
3682
+ }
3683
+
3684
+ // src/se-import/mappers/misc.ts
3685
+ function mapChatbox(widget) {
3686
+ const v = widget.variables ?? {};
3687
+ const fadeOutSeconds = typeof v.fadeOut === "number" ? v.fadeOut : 0;
3688
+ return buildUnit(widget, "chatbox", {
3689
+ content: {
3690
+ theme: v.theme ?? "default",
3691
+ fadeOutAfterDelay: fadeOutSeconds > 0,
3692
+ fadeOutDelayTime: fadeOutSeconds,
3693
+ showAvatar: true,
3694
+ // SE `messageDelay` (between-message delay) and `delay` (initial delay) have no
3695
+ // Lumia equivalent today — kept as provenance so users can wire them later if
3696
+ // Lumia adds the feature.
3697
+ se_message_delay: v.messageDelay,
3698
+ se_initial_delay: v.delay,
3699
+ // SE `ignored` (per-user ignore) and `highlight` (per-user emphasis) likewise
3700
+ // have no Lumia equivalent — preserved as provenance only.
3701
+ se_ignored_users: v.ignored,
3702
+ se_highlight_users: v.highlight
3703
+ }
3704
+ });
3705
+ }
3706
+ var SE_LISTENER_TO_LUMIA_CATEGORY = {
3707
+ "follower-latest": "follower",
3708
+ "subscriber-latest": "subscribers",
3709
+ "subscriber-new-latest": "subscribers",
3710
+ "subscriber-resub-latest": "subscribers",
3711
+ "subscriber-gifted-latest": "gifts",
3712
+ "community-gift-latest": "gifts",
3713
+ "cheer-latest": "bits",
3714
+ "cheerPurchase-latest": "bits",
3715
+ "tip-latest": "donation",
3716
+ "raid-latest": "raids",
3717
+ "host-latest": "hosts",
3718
+ "redemption-latest": "redemption",
3719
+ "merch-latest": "purchases",
3720
+ "purchase-latest": "purchases",
3721
+ "superchat-latest": "superchats",
3722
+ "hypetrain-latest": "hypetrain"
3723
+ };
3724
+ var ALL_LUMIA_EVENTLIST_CATEGORIES = [
3725
+ "redemption",
3726
+ "follower",
3727
+ "bits",
3728
+ "kicks",
3729
+ "extension",
3730
+ "points",
3731
+ "donation",
3732
+ "subscribers",
3733
+ "gifts",
3734
+ "hosts",
3735
+ "raids",
3736
+ "hypetrain",
3737
+ "spells",
3738
+ "retweets",
3739
+ "likes",
3740
+ "purchases",
3741
+ "superstickers",
3742
+ "superchats",
3743
+ "stars",
3744
+ "fans",
3745
+ "shares",
3746
+ "raffles",
3747
+ "others"
3748
+ ];
3749
+ function computeListenerFilters(seListeners, explicitListener) {
3750
+ const enabled = [];
3751
+ if (seListeners && typeof seListeners === "object" && !Array.isArray(seListeners)) {
3752
+ for (const [k, v] of Object.entries(seListeners)) {
3753
+ if (v) enabled.push(k);
3754
+ }
3755
+ } else if (Array.isArray(seListeners)) {
3756
+ enabled.push(...seListeners);
3757
+ }
3758
+ if (typeof explicitListener === "string" && explicitListener && !enabled.includes(explicitListener)) {
3759
+ enabled.push(explicitListener);
3760
+ }
3761
+ if (enabled.length === 0) return [];
3762
+ const allowed = /* @__PURE__ */ new Set();
3763
+ for (const listener of enabled) {
3764
+ const category = SE_LISTENER_TO_LUMIA_CATEGORY[listener];
3765
+ if (category) allowed.add(category);
3766
+ }
3767
+ if (allowed.size === 0) return [];
3768
+ return ALL_LUMIA_EVENTLIST_CATEGORIES.filter((c) => !allowed.has(c));
3769
+ }
3770
+ function mapEventList(widget) {
3771
+ const v = widget.variables ?? {};
3772
+ const filters = computeListenerFilters(widget.listeners, widget.listener);
3773
+ const maxItems = v.visibleEvents ?? v.visibleItems ?? 5;
3774
+ return buildUnit(widget, "eventlist", {
3775
+ content: {
3776
+ theme: v.theme ?? "simple",
3777
+ direction: v.direction ?? "top",
3778
+ maxItemsToShow: maxItems,
3779
+ visibleEvents: maxItems,
3780
+ // legacy field name kept for back-compat
3781
+ themeBgOpacity: v.themeBgOpacity ?? 0,
3782
+ highlight: v.highlight,
3783
+ // `filters` is a blacklist: every category here is HIDDEN. Empty = show all.
3784
+ filters,
3785
+ // `sites` is a platform blacklist (same shape). Default to "no platforms hidden".
3786
+ sites: [],
3787
+ // Eventlist Manager assumes these objects exist; provide an empty stub so
3788
+ // imported overlays render without throwing.
3789
+ themeConfig: {},
3790
+ eventListType: {},
3791
+ condensedText: false,
3792
+ horizontal: false,
3793
+ showAlertIcon: true,
3794
+ showSiteIcon: true,
3795
+ showUserAvatar: true,
3796
+ showDetailedText: false,
3797
+ hideAlertMessage: false
3798
+ }
3799
+ });
3800
+ }
3801
+ var CREDITS_DEFAULT_EVENTS_TO_SHOW = {
3802
+ mods: false,
3803
+ subscribers: true,
3804
+ gifts: true,
3805
+ donations: true,
3806
+ purchases: true,
3807
+ bits: true,
3808
+ kicks: true,
3809
+ raids: true,
3810
+ hosts: true,
3811
+ superstickers: true,
3812
+ superchats: true,
3813
+ redemptions: true,
3814
+ stars: true,
3815
+ fans: true,
3816
+ shares: false,
3817
+ spells: true,
3818
+ likes: false,
3819
+ followers: true,
3820
+ others: false,
3821
+ topGifts: true,
3822
+ topBits: true,
3823
+ topKicks: true,
3824
+ topDonations: true,
3825
+ topSuperstickers: true,
3826
+ topSuperchats: true,
3827
+ topRedemptions: true
3828
+ };
3829
+ function mapCredits(widget) {
3830
+ const v = widget.variables ?? {};
3831
+ const itemGap = typeof v.padding === "number" ? v.padding : void 0;
3832
+ const reverseFlow = v.direction === "bottom";
3833
+ return buildUnit(widget, "credits", {
3834
+ content: {
3835
+ type: "basic",
3836
+ title: "Stream Credits",
3837
+ subtitle: "",
3838
+ speed: 1,
3839
+ loop: false,
3840
+ eventsToShow: { ...CREDITS_DEFAULT_EVENTS_TO_SHOW },
3841
+ itemGap,
3842
+ reverseFlow,
3843
+ // SE-specific knobs preserved as provenance; no direct Lumia equivalent for
3844
+ // these. `chosenFilter` would narrow eventsToShow if we had a clean mapping;
3845
+ // `separator` would join entries but Lumia credits uses sectioned cards instead.
3846
+ se_chosen_filter: v.chosenFilter,
3847
+ se_separator: v.separator,
3848
+ se_amount: v.amount
3849
+ }
3850
+ });
3851
+ }
3852
+ function mapSlideshow(widget) {
3853
+ const v = widget.variables ?? {};
3854
+ const sources = (v.images ?? []).map((i) => typeof i === "string" ? i : i.src ?? "").filter(Boolean);
3855
+ const seAnim = typeof v.animation === "object" && v.animation !== null ? v.animation : {};
3856
+ return buildUnit(widget, "slideshow", {
3857
+ content: {
3858
+ items: sources.map((src) => ({ src })),
3859
+ // `interval` of 0 = "rapid cycle" in SE (no delay between images); Lumia's
3860
+ // `imageDuration` is the total ms per image. Distinguish three cases:
3861
+ // - undefined → use 5000ms default
3862
+ // - 0 → minimum sane cycle of 100ms (browsers can't render faster than ~60fps anyway)
3863
+ // - >0 → SE seconds * 1000
3864
+ imageDuration: typeof v.interval === "number" ? v.interval === 0 ? 100 : v.interval * 1e3 : 5e3,
3865
+ loop: v.loop !== false,
3866
+ loopDelay: 0,
3867
+ delay: 0,
3868
+ playAudio: !!v.playAudio,
3869
+ random: !!v.random,
3870
+ animation: {
3871
+ enterAnimation: typeof v.animation === "string" ? v.animation : seAnim.in ?? "fadeIn",
3872
+ exitAnimation: typeof v.animation === "string" ? v.animation : seAnim.out ?? "fadeOut",
3873
+ enterAnimationDuration: (seAnim.inDuration ?? 1) * 1e3,
3874
+ exitAnimationDuration: (seAnim.outDuration ?? 1) * 1e3,
3875
+ enterAnimationDelay: (seAnim.inDelay ?? 0) * 1e3,
3876
+ exitAnimationDelay: (seAnim.outDelay ?? 0) * 1e3
3877
+ },
3878
+ se_interval: v.interval,
3879
+ se_raw_duration: v.duration
3880
+ }
3881
+ });
3882
+ }
3883
+ function mapTimer(widget) {
3884
+ const v = widget.variables ?? {};
3885
+ let days = 0, hours = 0, minutes = 5, seconds = 0;
3886
+ let absoluteDate = v.date ?? v.endsAt ?? v.endDate;
3887
+ let resolved = false;
3888
+ if (absoluteDate) {
3889
+ const target = Date.parse(absoluteDate);
3890
+ if (Number.isFinite(target)) {
3891
+ let remainingMs = target - Date.now();
3892
+ if (remainingMs > 0) {
3893
+ const ONE_DAY = 24 * 60 * 60 * 1e3;
3894
+ days = Math.floor(remainingMs / ONE_DAY);
3895
+ remainingMs -= days * ONE_DAY;
3896
+ hours = Math.floor(remainingMs / (60 * 60 * 1e3));
3897
+ remainingMs -= hours * 60 * 60 * 1e3;
3898
+ minutes = Math.floor(remainingMs / (60 * 1e3));
3899
+ remainingMs -= minutes * 60 * 1e3;
3900
+ seconds = Math.floor(remainingMs / 1e3);
3901
+ resolved = true;
3902
+ }
3903
+ }
3904
+ }
3905
+ if (!resolved && v.duration != null) {
3906
+ if (typeof v.duration === "number" && Number.isFinite(v.duration) && v.duration > 0) {
3907
+ const totalSeconds = Math.floor(v.duration * 60);
3908
+ days = Math.floor(totalSeconds / 86400);
3909
+ hours = Math.floor(totalSeconds % 86400 / 3600);
3910
+ minutes = Math.floor(totalSeconds % 3600 / 60);
3911
+ seconds = totalSeconds % 60;
3912
+ resolved = true;
3913
+ } else if (typeof v.duration === "object" && v.duration !== null) {
3914
+ const d = v.duration;
3915
+ days = typeof d.days === "number" ? d.days : 0;
3916
+ hours = typeof d.hours === "number" ? d.hours : 0;
3917
+ minutes = typeof d.minutes === "number" ? d.minutes : 0;
3918
+ seconds = typeof d.seconds === "number" ? d.seconds : 0;
3919
+ if (days || hours || minutes || seconds) resolved = true;
3920
+ }
3921
+ }
3922
+ if (!resolved) {
3923
+ days = 0;
3924
+ hours = 0;
3925
+ minutes = 5;
3926
+ seconds = 0;
3927
+ }
3928
+ const parts = [];
3929
+ if (v.days !== false) parts.push("{{days}} days");
3930
+ if (v.hours !== false || v.minutes !== false || v.seconds !== false) {
3931
+ const clockBits = [];
3932
+ if (v.hours !== false) clockBits.push("{{hours}}");
3933
+ if (v.minutes !== false) clockBits.push("{{minutes}}");
3934
+ if (v.seconds !== false) clockBits.push("{{seconds}}");
3935
+ if (clockBits.length) parts.push(clockBits.join(":"));
3936
+ }
3937
+ return buildUnit(widget, "timer", {
3938
+ content: {
3939
+ version: 1,
3940
+ type: "countdown",
3941
+ value: { days, hours, minutes, seconds },
3942
+ display: parts.join(" ") || "{{minutes}}:{{seconds}}",
3943
+ showMilliseconds: false,
3944
+ endAnimation: "",
3945
+ hideAfter: 0,
3946
+ messageAfterCountdown: translateSeText(v.messageAfterCountdown ?? ""),
3947
+ changeMessageAfter: !!v.changeMessageAfterCountdown,
3948
+ se_date: v.date,
3949
+ se_exact_time: v.exactTime
3950
+ }
3951
+ });
3952
+ }
3953
+ function mapNowPlaying(widget) {
3954
+ const v = widget.variables ?? {};
3955
+ const source = v.provider === "youtube" ? "youtubemusic" : "spotify";
3956
+ return buildUnit(widget, "nowplaying", {
3957
+ content: {
3958
+ version: 1,
3959
+ type: "nowplaying",
3960
+ source,
3961
+ theme: "basic",
3962
+ borderRadius: "30px",
3963
+ songTitle: `{{${source}_now_playing_song=Lumia Dream}}`,
3964
+ songArtist: `{{${source}_now_playing_artist}}`,
3965
+ songImg: `{{${source}_now_playing_image}}`,
3966
+ showImg: true,
3967
+ oneLineTitle: false,
3968
+ highlightColor: "inherit",
3969
+ se_simple_design: !!v.simpleDesign
3970
+ },
3971
+ css: {
3972
+ borderRadius: "0px",
3973
+ borderStyle: "solid",
3974
+ borderWidth: "0px",
3975
+ borderColor: "transparent",
3976
+ lineHeight: 1,
3977
+ textAlign: "left",
3978
+ fontFamily: "Be Vietnam Pro",
3979
+ color: "#ffffff",
3980
+ textShadow: "rgb(0, 0, 0) 1px 1px 1px",
3981
+ background: "transparent"
3982
+ }
3983
+ });
3984
+ }
3985
+ var SE_KAPPAGEN_EVENT_TO_LUMIA_ALERT = {
3986
+ follower: "twitch-follower",
3987
+ subscriber: "twitch-subscriber",
3988
+ cheer: "twitch-bits",
3989
+ raid: "twitch-raid",
3990
+ host: "twitch-host",
3991
+ tip: "streamelements-donation",
3992
+ purchase: "streamlabs-merch",
3993
+ embers: "youtube-superchat"
3994
+ };
3995
+ function mapKappagen(widget) {
3996
+ const v = widget.variables ?? {};
3997
+ const eventsFromNested = v.eventsConfig ? {
3998
+ subscriber: v.eventsConfig.subscriber?.enabled ?? true,
3999
+ follower: v.eventsConfig.follower?.enabled ?? true,
4000
+ cheer: v.eventsConfig.cheer?.enabled ?? true,
4001
+ raid: v.eventsConfig.raid?.enabled ?? true,
4002
+ tip: v.eventsConfig.tip?.enabled ?? true
4003
+ } : null;
4004
+ const events = v.events ?? eventsFromNested ?? { subscriber: true, follower: true, cheer: true, raid: true, tip: true };
4005
+ const alertTriggers = Object.entries(events).filter(([, enabled]) => !!enabled).map(([seKey]) => SE_KAPPAGEN_EVENT_TO_LUMIA_ALERT[seKey]).filter((x) => !!x);
4006
+ const alertEmotes = ["Kappa", "<3", "imGlitch"];
4007
+ return buildUnit(
4008
+ widget,
4009
+ "emotealert",
4010
+ {
4011
+ content: {
4012
+ version: 1,
4013
+ // Lumia's animation type ('random', 'rise', 'fall', etc.). SE only has rough
4014
+ // equivalents — `direction` maps closest. Default to 'random'.
4015
+ type: v.direction === "up" ? "rise" : v.direction === "down" ? "fall" : "random",
4016
+ excludedAnimations: [],
4017
+ src: "",
4018
+ userLevels: [1, 2, 3, 4, 5, 6, 7, 8, 9],
4019
+ ignoredList: [],
4020
+ emojis: !!v.emoji,
4021
+ background: "transparent",
4022
+ theme: "dark",
4023
+ imageSize: typeof v.size === "number" ? v.size : 30,
4024
+ animationTime: typeof v.duration === "number" ? v.duration : 5,
4025
+ duration: typeof v.duration === "number" ? v.duration : 5,
4026
+ useAnimatedEmotes: true,
4027
+ alertNumberEmotes: typeof v.limit === "number" && v.limit > 0 ? v.limit : 30,
4028
+ alertEmotes,
4029
+ alertTriggers,
4030
+ // Lumia BTTV/FFZ/7TV per-source toggles — read by Emotealert/index.tsx:48.
4031
+ emoteSources: {
4032
+ bttv: v.bttv !== false,
4033
+ ffz: v.ffz !== false,
4034
+ sevenTv: v.sevenTv !== false
4035
+ },
4036
+ // SE-only knobs preserved as provenance; no Lumia rendering for these.
4037
+ se_mode: v.mode,
4038
+ se_cheersplosions: !!v.cheersplosions,
4039
+ se_emotesplosion: v.emotesplosion,
4040
+ se_emotesplosion_dir: v.emotesplosiondir,
4041
+ se_emotesplosion_duration: v.emotesplosionduration,
4042
+ se_spawn_zone: v.spawnzone,
4043
+ se_fullscreen: !!v.fullscreen,
4044
+ se_direction: v.direction
4045
+ },
4046
+ css: { background: "transparent" }
4047
+ }
4048
+ );
4049
+ }
4050
+ function mapLeaderboardFromVariables(widget, currency) {
4051
+ const v = widget.variables ?? {};
4052
+ const count = v.limit ?? v.visibleItems ?? 10;
4053
+ const window = v.period === "weekly" ? "week" : v.period === "monthly" ? "month" : "alltime";
4054
+ const title = currency === "tips" ? "Top Tippers" : currency === "cheers" ? "Top Cheerers" : "Top Gifters";
4055
+ return buildUnit(widget, "loyaltyleaderboard", {
4056
+ content: {
4057
+ source: "variables",
4058
+ currency,
4059
+ window,
4060
+ count,
4061
+ title,
4062
+ showTitle: true,
4063
+ showHeader: false,
4064
+ showCurrentPoints: false,
4065
+ showAllTimePoints: true,
4066
+ itemGap: 8,
4067
+ // Preserve SE knobs that don't map cleanly so they survive the round-trip
4068
+ // and the user can re-introspect later if behaviour differs.
4069
+ se_period: v.period,
4070
+ se_offset: v.offset,
4071
+ se_layout: v.layout
4072
+ }
4073
+ });
4074
+ }
4075
+ function mapGiveaway(widget) {
4076
+ const v = widget.variables ?? {};
4077
+ const primary = v.colors?.primary ?? "#393853";
4078
+ const accent = v.colors?.accent ?? "#FF4076";
4079
+ return buildUnit(widget, "raffle", {
4080
+ content: {
4081
+ version: 1,
4082
+ type: "basic",
4083
+ title: "Play to win",
4084
+ subtitle: "",
4085
+ wonTitle: "{{winner}} just won",
4086
+ showTitle: true,
4087
+ showSubTitle: false,
4088
+ // SE `displayRunningTime` toggles the running-timer label. Lumia's equivalent
4089
+ // is `showTimeSince`. SE `enableTimeOut` enables auto-end which Lumia honours
4090
+ // via raffle.auto_end on the raffle state itself, not the module — best we can
4091
+ // do is leave Lumia's `showTimeSince` on so the countdown is visible.
4092
+ showTimeSince: v.displayRunningTime ?? true,
4093
+ // SE `displayEntrants: false` means "never show the entrant list" (persistent).
4094
+ // Lumia's `hideParticipantOnStart` is "hide until spin starts, then show" (transient).
4095
+ // Mapping one to the other reverses semantics: SE-hidden entrants would briefly
4096
+ // flash on screen the moment the spin starts. Since Lumia has no permanent
4097
+ // hide-entrants knob, keep Lumia at its default (show) and surface the SE
4098
+ // preference via provenance — a future renderer can read it without us
4099
+ // having lied about the toggle. Same for `displayTicketsPurchased`.
4100
+ hideParticipantOnStart: false,
4101
+ se_displayEntrants: v.displayEntrants !== false,
4102
+ se_displayTicketsPurchased: v.displayTicketsPurchased !== false,
4103
+ removeWhenRedeemed: false,
4104
+ showWinningModal: true,
4105
+ playSoundFx: true,
4106
+ spinSound: "https://storage.lumiastream.com/overlays/lumia/audio/Wheel_of_Fortune.mp3",
4107
+ winSound: "https://storage.lumiastream.com/overlays/lumia/audio/crowdClap.mp3",
4108
+ spinDuration: 4,
4109
+ transparent: false,
4110
+ backgroundColor: primary,
4111
+ borderColor: accent,
4112
+ border: "solid 1px transparent",
4113
+ borderRadius: "10px",
4114
+ flashOnNewEntry: true,
4115
+ flashColor: accent,
4116
+ raffleEndedText: "The raffle has ended, and the selection of the winner will take place shortly.",
4117
+ raffleTimerText: "Time since raffle started",
4118
+ raffleCountdownText: "Raffle will end after",
4119
+ // SE-specific knobs with no Lumia equivalent — preserved as provenance.
4120
+ se_timeout: v.timeout,
4121
+ se_enable_timeout: v.enableTimeOut,
4122
+ se_display_entrants: v.displayEntrants,
4123
+ se_display_tickets_purchased: v.displayTicketsPurchased,
4124
+ se_image_style_width: v.imageStyle?.width
4125
+ }
4126
+ });
4127
+ }
4128
+ function mapUnsupportedAsText(widget) {
4129
+ return buildUnit(widget, "text", {
4130
+ content: {
4131
+ value: `[Unsupported SE widget: ${widget.type}]`,
4132
+ highlightColor: "inherit"
4133
+ },
4134
+ css: {
4135
+ color: "#ff8c00",
4136
+ fontSize: 18,
4137
+ textAlign: "center",
4138
+ fontFamily: "Roboto",
4139
+ fontWeight: "bold",
4140
+ background: "rgba(0,0,0,0.4)"
4141
+ }
4142
+ });
4143
+ }
4144
+
4145
+ // src/se-import/feature-flags.ts
4146
+ var SE_IMPORT_FLAGS = {
4147
+ // (Removed) IMPORT_CUSTOM_EMBED: custom-event-list now routes to native eventlist
4148
+ // by default with a one-click "switch to custom HTML" option in the review step.
4149
+ // (Removed) IMPORT_MERCH_GOAL: Fourthwall integration provides session/total order
4150
+ // counters now (see fourthwall.manager.ts ORDER_PLACED handler); merch goal maps
4151
+ // to {{fourthwall_total_order_count}} via the goal mapper.
4152
+ // Merch products rotator — Lumia has no Fourthwall product-list API yet. The
4153
+ // Fourthwall integration is webhook-driven (events flow in) but doesn't fetch
4154
+ // the user's shop catalog. Adding it requires a separate Fourthwall API auth
4155
+ // flow + product-fetch endpoint + periodic refresh. Until then a static stub
4156
+ // is unhelpful, so users are routed to review for AI/skip/marketplace-when-
4157
+ // available replacements.
4158
+ IMPORT_MERCH_PRODUCTS: false,
4159
+ // Seasonal effects (snow/halloween/xmas/valentine/easter/worldcup). The
4160
+ // generic canvas-particle template is approximate, not pixel-accurate vs
4161
+ // SE's polished versions. Flagging off so users get the option to grab a
4162
+ // AI-generated replacement or a curated marketplace seasonal overlay when one
4163
+ // is configured.
4164
+ IMPORT_SEASONAL: false
4165
+ };
4166
+ function isWidgetFlaggedOff(seType) {
4167
+ if (seType === "se-widget-merch-products-rotator") return !SE_IMPORT_FLAGS.IMPORT_MERCH_PRODUCTS;
4168
+ if (seType === "se-widget-snow" || seType === "se-widget-halloween" || seType === "se-widget-halloween-2019" || seType === "se-widget-xmas" || seType === "se-widget-valentine" || seType === "se-widget-easter" || seType === "se-widget-world-cup") {
4169
+ return !SE_IMPORT_FLAGS.IMPORT_SEASONAL;
4170
+ }
4171
+ return false;
4172
+ }
4173
+ var FLAG_OFF_REASONS = {
4174
+ "se-widget-merch-products-rotator": "Merch products rotator \u2014 Lumia tracks Fourthwall orders but doesn't fetch the full product catalog yet. Generate a replacement with AI, skip it, or use Marketplace when a curated replacement is configured.",
4175
+ "se-widget-snow": "Seasonal effect \u2014 the generic auto-import template is approximate. Generate a replacement with AI, skip it, or use Marketplace when a curated version is configured.",
4176
+ "se-widget-halloween": "Seasonal effect \u2014 the generic auto-import template is approximate. Generate a replacement with AI, skip it, or use Marketplace when a curated version is configured.",
4177
+ "se-widget-halloween-2019": "Seasonal effect \u2014 the generic auto-import template is approximate. Generate a replacement with AI, skip it, or use Marketplace when a curated version is configured.",
4178
+ "se-widget-xmas": "Seasonal effect \u2014 the generic auto-import template is approximate. Generate a replacement with AI, skip it, or use Marketplace when a curated version is configured.",
4179
+ "se-widget-valentine": "Seasonal effect \u2014 the generic auto-import template is approximate. Generate a replacement with AI, skip it, or use Marketplace when a curated version is configured.",
4180
+ "se-widget-easter": "Seasonal effect \u2014 the generic auto-import template is approximate. Generate a replacement with AI, skip it, or use Marketplace when a curated version is configured.",
4181
+ "se-widget-world-cup": "Seasonal effect \u2014 the generic auto-import template is approximate. Generate a replacement with AI, skip it, or use Marketplace when a curated version is configured."
4182
+ };
4183
+
4184
+ // src/se-import/dispatcher.ts
4185
+ var READOUT_TYPES = {
4186
+ "follower-latest": "follower-latest",
4187
+ "subscriber-latest": "subscriber-latest",
4188
+ "subscriber-new-latest": "subscriber-new-latest",
4189
+ "subscriber-resub-latest": "subscriber-resub-latest",
4190
+ "subscriber-gifted-latest": "subscriber-gifted-latest",
4191
+ "subscriber-alltime-gifter": "subscriber-alltime-gifter",
4192
+ "cheer-total": "cheer-total",
4193
+ "tip-count": "tip-count",
4194
+ "se-widget-follower-count": "follower-session",
4195
+ "se-widget-follower-total": "follower-total",
4196
+ "se-widget-subscriber-count": "subscriber-session",
4197
+ "se-widget-subscriber-total": "subscriber-total",
4198
+ "se-widget-cheer-amount": "cheer-session",
4199
+ "se-widget-cheer-latest": "cheer-latest",
4200
+ "se-widget-tip-amount": "tip-session",
4201
+ "se-widget-tip-latest": "tip-latest",
4202
+ "se-widget-raid-latest": "raid-latest",
4203
+ "se-widget-top-cheer": "cheer-session-top-donation",
4204
+ "se-widget-top-cheerer": "cheer-session-top-donator",
4205
+ "se-widget-top-donation": "tip-session-top-donation",
4206
+ "se-widget-top-donator": "tip-session-top-donator",
4207
+ // SE's botcounter is just a counter of chat messages; Lumia exposes this directly via
4208
+ // twitch_session_chat_count, so we render it as a text layer with the variable inline.
4209
+ "se-widget-botcounter": "twitch_session_chat_count"
4210
+ };
4211
+ var SEASONAL_TYPES = {
4212
+ "se-widget-snow": "snow",
4213
+ "se-widget-halloween": "halloween",
4214
+ "se-widget-halloween-2019": "halloween",
4215
+ "se-widget-xmas": "xmas",
4216
+ "se-widget-valentine": "valentine",
4217
+ "se-widget-easter": "easter",
4218
+ "se-widget-world-cup": "worldcup"
4219
+ };
4220
+ var GOAL_TYPES = /* @__PURE__ */ new Set([
4221
+ "se-widget-follower-goal",
4222
+ "se-widget-subscriber-goal",
4223
+ "se-widget-cheer-goal",
4224
+ "se-widget-tip-goal",
4225
+ "se-widget-donor-drive-goal",
4226
+ "se-widget-extralife-goal",
4227
+ "se-widget-tiltify-goal",
4228
+ "se-widget-merch-goal"
4229
+ ]);
4230
+ 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"]);
4231
+ function dispatch(widget) {
4232
+ const t = widget.type;
4233
+ if (isWidgetFlaggedOff(t)) {
4234
+ return { unit: mapUnsupportedAsText(widget), status: "placeholder", lumiaType: "text", flaggedOff: true };
4235
+ }
4236
+ if (t === "text") return { unit: mapText(widget), status: "direct", lumiaType: "text" };
4237
+ if (t === "image") return { unit: mapImage(widget), status: "direct", lumiaType: "image" };
4238
+ if (t === "video") return { unit: mapVideo(widget), status: "direct", lumiaType: "video" };
4239
+ if (t in READOUT_TYPES) {
4240
+ return { unit: mapReadout(widget, READOUT_TYPES[t]), status: "direct", lumiaType: "text" };
4241
+ }
4242
+ if (GOAL_TYPES.has(t)) return { unit: mapGoal(widget), status: "direct", lumiaType: "goal" };
4243
+ if (t === "se-widget-alert-box") return { unit: mapAlertBox(widget), status: "direct", lumiaType: "alert" };
4244
+ if (t === "se-widget-alert-box-merch") return { unit: mapAlertBox(widget, { onlyEvents: ["merch"] }), status: "direct", lumiaType: "alert" };
4245
+ if (t === "se-widget-store-redemptions") return { unit: mapSingleAlert(widget, "twitch-redemption"), status: "direct", lumiaType: "alert" };
4246
+ if (t === "se-widget-donor-drive-alert") return { unit: mapSingleAlert(widget, "donordrive-donation"), status: "direct", lumiaType: "alert" };
4247
+ if (t === "se-widget-extralife-alert") return { unit: mapSingleAlert(widget, "extralife-donation"), status: "direct", lumiaType: "alert" };
4248
+ if (t === "se-widget-tiltify-alert") return { unit: mapSingleAlert(widget, "tiltify-campaignDonation"), status: "direct", lumiaType: "alert" };
4249
+ if (EVENTLIST_TYPES.has(t)) return { unit: mapEventList(widget), status: "direct", lumiaType: "eventlist" };
4250
+ if (t === "se-widget-top-tippers-list") return { unit: mapLeaderboardFromVariables(widget, "tips"), status: "direct", lumiaType: "loyaltyleaderboard" };
4251
+ if (t === "se-widget-top-cheerers-list") return { unit: mapLeaderboardFromVariables(widget, "cheers"), status: "direct", lumiaType: "loyaltyleaderboard" };
4252
+ if (t === "se-widget-top-gifters-list") return { unit: mapLeaderboardFromVariables(widget, "gifts"), status: "direct", lumiaType: "loyaltyleaderboard" };
4253
+ if (t === "se-widget-credit-roll") return { unit: mapCredits(widget), status: "partial", lumiaType: "credits" };
4254
+ if (t === "se-widget-twitch-chat") return { unit: mapChatbox(widget), status: "partial", lumiaType: "chatbox" };
4255
+ 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" };
4256
+ if (t === "se-widget-countdown") return { unit: mapTimer(widget), status: "partial", lumiaType: "timer" };
4257
+ if (t === "se-widget-current-song") return { unit: mapNowPlaying(widget), status: "partial", lumiaType: "nowplaying" };
4258
+ if (t === "se-widget-kappagen") return { unit: mapKappagen(widget), status: "partial", lumiaType: "emotealert" };
4259
+ if (t === "se-widget-giveaway") return { unit: mapGiveaway(widget), status: "direct", lumiaType: "raffle" };
4260
+ if (t === "se-widget-custom-event-list") return { unit: mapCustom(widget), status: "partial", lumiaType: "custom" };
4261
+ if (t in SEASONAL_TYPES) {
4262
+ return { unit: mapSeasonal(widget, SEASONAL_TYPES[t]), status: "direct", lumiaType: "custom" };
4263
+ }
4264
+ return { unit: mapUnsupportedAsText(widget), status: "placeholder", lumiaType: "text" };
4265
+ }
4266
+ function recordCoverage(coverage, result, seType) {
4267
+ const existing = coverage.mappings.find((m) => m.seType === seType);
4268
+ if (existing) {
4269
+ existing.count += 1;
4270
+ return;
4271
+ }
4272
+ coverage.mappings.push({ seType, lumiaType: result.lumiaType, status: result.status, count: 1 });
4273
+ }
4274
+
4275
+ // src/se-import/assets.ts
4276
+ var SE_CDN_REGEX = /https?:\/\/(?:cdn|static)\.streamelements\.com\/[^\s"'\\)]+/g;
4277
+ var SE_CDN_REGEX_ALT = /https?:\/\/streamelements-cdn\.com\/[^\s"'\\)]+/g;
4278
+ var CSS_URL_REGEX = /url\(\s*['"]?([^'")]+)['"]?\s*\)/g;
4279
+ function isSEUrl(url) {
4280
+ return /^https?:\/\/(?:cdn|static)\.streamelements\.com\//.test(url) || /^https?:\/\/streamelements-cdn\.com\//.test(url);
4281
+ }
4282
+ function findSEAssetURLs(overlay) {
4283
+ const settings = overlay.settings ?? {};
4284
+ const found = /* @__PURE__ */ new Set();
4285
+ const serialized = JSON.stringify(settings);
4286
+ for (const m of serialized.match(SE_CDN_REGEX) ?? []) found.add(m);
4287
+ for (const m of serialized.match(SE_CDN_REGEX_ALT) ?? []) found.add(m);
4288
+ const modulesRecord = settings.modules;
4289
+ if (modulesRecord && typeof modulesRecord === "object") {
4290
+ for (const mod of Object.values(modulesRecord)) {
4291
+ const content = mod?.content;
4292
+ if (!content) continue;
4293
+ for (const key of ["html", "css", "js"]) {
4294
+ const blob = content[key];
4295
+ if (typeof blob !== "string" || !blob) continue;
4296
+ CSS_URL_REGEX.lastIndex = 0;
4297
+ let match;
4298
+ while ((match = CSS_URL_REGEX.exec(blob)) !== null) {
4299
+ const inner = match[1];
4300
+ if (inner && isSEUrl(inner)) found.add(inner);
4301
+ }
4302
+ }
4303
+ }
4304
+ }
4305
+ return Array.from(found);
4306
+ }
4307
+ function escapeRegex(s) {
4308
+ return s.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
4309
+ }
4310
+ function rewriteAssetURLs(overlay, mapping) {
4311
+ const oldUrls = Object.keys(mapping).filter((oldUrl) => oldUrl && mapping[oldUrl] && oldUrl !== mapping[oldUrl]);
4312
+ if (oldUrls.length === 0) return overlay;
4313
+ oldUrls.sort((a, b) => b.length - a.length);
4314
+ const pattern = new RegExp(oldUrls.map(escapeRegex).join("|"), "g");
4315
+ const serialized = JSON.stringify(overlay.settings);
4316
+ const rewritten = serialized.replace(pattern, (match) => mapping[match] ?? match);
4317
+ return {
4318
+ ...overlay,
4319
+ settings: JSON.parse(rewritten)
4320
+ };
4321
+ }
4322
+ async function mirrorOneAsset(url, upload, signal) {
4323
+ const res = await fetch(url, { mode: "cors", signal });
4324
+ if (!res.ok) throw new Error(`Source returned HTTP ${res.status}`);
4325
+ const blob = await res.blob();
4326
+ if (signal?.aborted) throw new DOMException("Aborted", "AbortError");
4327
+ const filename = filenameFromURL(url);
4328
+ const type = blob.type || guessMime(filename);
4329
+ const file = new File([blob], filename, { type });
4330
+ const uploaded = await upload(file);
4331
+ const newUrl = uploaded?.asset?.url ?? uploaded?.url;
4332
+ if (!newUrl) throw new Error("Upload succeeded but no URL returned.");
4333
+ return newUrl;
4334
+ }
4335
+ function filenameFromURL(url) {
4336
+ try {
4337
+ const u = new URL(url);
4338
+ const last = u.pathname.split("/").filter(Boolean).pop() || "asset";
4339
+ return decodeURIComponent(last.split("?")[0]);
4340
+ } catch {
4341
+ return "asset";
4342
+ }
4343
+ }
4344
+ function guessMime(name) {
4345
+ const ext = name.split(".").pop()?.toLowerCase() ?? "";
4346
+ switch (ext) {
4347
+ case "webm":
4348
+ return "video/webm";
4349
+ case "mp4":
4350
+ return "video/mp4";
4351
+ case "gif":
4352
+ return "image/gif";
4353
+ case "png":
4354
+ return "image/png";
4355
+ case "jpg":
4356
+ case "jpeg":
4357
+ return "image/jpeg";
4358
+ case "svg":
4359
+ return "image/svg+xml";
4360
+ case "ogg":
4361
+ return "audio/ogg";
4362
+ case "mp3":
4363
+ return "audio/mpeg";
4364
+ case "wav":
4365
+ return "audio/wav";
4366
+ default:
4367
+ return "application/octet-stream";
4368
+ }
4369
+ }
4370
+
4371
+ // src/se-import/transplant.ts
4372
+ import { nanoid as nanoid2 } from "nanoid";
4373
+ function cloneModuleForTransplant(srcModule, newId) {
4374
+ const clonedContent = srcModule.content ? structuredClone(srcModule.content) : srcModule.content;
4375
+ if (srcModule.settings?.type === "custom" && clonedContent) {
4376
+ clonedContent.codeId = `marketplace-${newId}`;
4377
+ }
4378
+ return {
4379
+ ...srcModule,
4380
+ id: newId,
4381
+ content: clonedContent
4382
+ };
4383
+ }
4384
+ function transplantLayer(source, sourceLayerId) {
4385
+ const layers = source.settings?.layers ?? [];
4386
+ const modules = source.settings?.modules ?? {};
4387
+ const srcLayer = layers.find((l) => l.id === sourceLayerId);
4388
+ const srcModule = modules[sourceLayerId];
4389
+ if (!srcLayer || !srcModule) return null;
4390
+ const rootNewId = nanoid2();
4391
+ if (srcLayer.type !== "group") {
4392
+ const layer = { ...srcLayer, id: rootNewId };
4393
+ const module = cloneModuleForTransplant(srcModule, rootNewId);
4394
+ return { layer, module };
4395
+ }
4396
+ const idRemap = /* @__PURE__ */ new Map();
4397
+ idRemap.set(srcLayer.id, rootNewId);
4398
+ const descendants = [];
4399
+ const queue = [srcLayer.id];
4400
+ const seen = /* @__PURE__ */ new Set([srcLayer.id]);
4401
+ while (queue.length > 0) {
4402
+ const parentId = queue.shift();
4403
+ const children = layers.filter((l) => l.group === parentId);
4404
+ for (const child of children) {
4405
+ if (seen.has(child.id)) continue;
4406
+ seen.add(child.id);
4407
+ descendants.push(child);
4408
+ idRemap.set(child.id, nanoid2());
4409
+ if (child.type === "group") queue.push(child.id);
4410
+ }
4411
+ }
4412
+ const rootLayer = { ...srcLayer, id: rootNewId };
4413
+ const rootModule = cloneModuleForTransplant(srcModule, rootNewId);
4414
+ const extras = [];
4415
+ for (const descLayer of descendants) {
4416
+ const descModule = modules[descLayer.id];
4417
+ if (!descModule) continue;
4418
+ const newDescId = idRemap.get(descLayer.id);
4419
+ const remappedGroup = descLayer.group != null ? idRemap.get(descLayer.group) ?? null : null;
4420
+ const newLayer = {
4421
+ ...descLayer,
4422
+ id: newDescId,
4423
+ group: remappedGroup
4424
+ };
4425
+ const newModule = cloneModuleForTransplant(descModule, newDescId);
4426
+ extras.push({ layer: newLayer, module: newModule });
4427
+ }
4428
+ return { layer: rootLayer, module: rootModule, extras };
4429
+ }
4430
+ function listTransplantableLayers(source) {
4431
+ const layers = source.settings?.layers ?? [];
4432
+ const modules = source.settings?.modules ?? {};
4433
+ return layers.map((l) => {
4434
+ const m = modules[l.id];
4435
+ if (!m) return null;
4436
+ return {
4437
+ id: l.id,
4438
+ label: m.settings?.title ?? m.settings?.type ?? "Untitled",
4439
+ type: m.settings?.type ?? "unknown"
4440
+ };
4441
+ }).filter((x) => x !== null);
4442
+ }
4443
+
4444
+ // src/se-import/marketplace-candidates.ts
4445
+ var SE_WIDGET_TO_MARKETPLACE_CANDIDATES = {
4446
+ // Hard widgets — gamified animations with state machines or physics. Highest
4447
+ // value for marketplace replacements since AI generation rarely produces
4448
+ // satisfying results for these.
4449
+ "se-widget-hype-cup": [],
4450
+ "se-widget-bit-boss": [],
4451
+ "se-widget-train": [],
4452
+ // Medium-difficulty widgets — possible to AI-generate but a curated overlay
4453
+ // will usually look better.
4454
+ "se-widget-media-share": [],
4455
+ "se-widget-contest": [],
4456
+ // Bot counters, custom event lists, and one-off SE widgets users sometimes
4457
+ // have curated replacements for.
4458
+ "se-widget-custom-event-list": [],
4459
+ "se-widget-botcounter": [],
4460
+ // Flagged-off in feature-flags.ts — the auto-import is disabled because
4461
+ // Lumia has no merch data source. Marketplace overlays here would be
4462
+ // curated static merch-style goals/sliders that don't depend on a feed.
4463
+ "se-widget-merch-goal": [],
4464
+ "se-widget-merch-products-rotator": [],
4465
+ // Flagged-off seasonal effects — generic canvas-particle template is too
4466
+ // approximate. Marketplace candidates should be polished season-specific
4467
+ // overlays (e.g. a curated snow scene, a haunted-house halloween scene).
4468
+ "se-widget-snow": [],
4469
+ "se-widget-halloween": [],
4470
+ "se-widget-halloween-2019": [],
4471
+ "se-widget-xmas": [],
4472
+ "se-widget-valentine": [],
4473
+ "se-widget-easter": [],
4474
+ "se-widget-world-cup": []
4475
+ };
4476
+ function getMarketplaceCandidates(seWidgetType) {
4477
+ return SE_WIDGET_TO_MARKETPLACE_CANDIDATES[seWidgetType] ?? [];
4478
+ }
4479
+ function hasMarketplaceCandidates(seWidgetType) {
4480
+ return getMarketplaceCandidates(seWidgetType).length > 0;
4481
+ }
4482
+
4483
+ // src/se-import/ui/SEImportWizard.tsx
4484
+ import { useCallback as useCallback3, useEffect as useEffect6, useMemo as useMemo5, useRef as useRef4, useState as useState6 } from "react";
4485
+
4486
+ // src/se-import/ui/MarketplacePicker.tsx
4487
+ import { useEffect as useEffect5, useMemo as useMemo4, useState as useState5 } from "react";
4488
+ import { jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
4489
+ function MarketplacePicker({ seWidgetType, fetchMarketplaceOverlay, CustomEmbed, onPick, onCancel }) {
4490
+ const candidateIds = useMemo4(() => getMarketplaceCandidates(seWidgetType), [seWidgetType]);
4491
+ const [candidates, setCandidates] = useState5(() => candidateIds.map((id) => ({ id, loading: true })));
4492
+ const [activeId, setActiveId] = useState5(candidateIds[0] ?? null);
4493
+ const [activeLayerId, setActiveLayerId] = useState5(null);
4494
+ useEffect5(() => {
4495
+ let cancelled = false;
4496
+ candidateIds.forEach(async (id) => {
4497
+ try {
4498
+ const overlay = await fetchMarketplaceOverlay(id);
4499
+ if (cancelled) return;
4500
+ setCandidates((prev) => prev.map((c) => c.id === id ? { ...c, loading: false, overlay } : c));
4501
+ } catch (err) {
4502
+ if (cancelled) return;
4503
+ setCandidates((prev) => prev.map((c) => c.id === id ? { ...c, loading: false, error: err?.message ?? "Failed to fetch overlay." } : c));
4504
+ }
4505
+ });
4506
+ return () => {
4507
+ cancelled = true;
4508
+ };
4509
+ }, [candidateIds, fetchMarketplaceOverlay]);
4510
+ const activeCandidate = candidates.find((c) => c.id === activeId);
4511
+ const activeLayers = useMemo4(() => activeCandidate?.overlay ? listTransplantableLayers(activeCandidate.overlay) : [], [activeCandidate?.overlay]);
4512
+ useEffect5(() => {
4513
+ if (activeLayers.length > 0 && !activeLayerId) {
4514
+ setActiveLayerId(activeLayers[0].id);
4515
+ }
4516
+ }, [activeLayers, activeLayerId]);
4517
+ const handleConfirm = () => {
4518
+ if (!activeCandidate?.overlay || !activeLayerId) return;
4519
+ const transplant = transplantLayer(activeCandidate.overlay, activeLayerId);
4520
+ if (!transplant) return;
4521
+ onPick(transplant);
4522
+ };
4523
+ if (candidateIds.length === 0) {
4524
+ return /* @__PURE__ */ jsxs6("div", { className: "ui-flex-column ui-gap-2", style: { padding: 16 }, children: [
4525
+ /* @__PURE__ */ jsx12("div", { style: { fontWeight: 600 }, children: "No marketplace replacements yet" }),
4526
+ /* @__PURE__ */ jsxs6("div", { style: { fontSize: 13, opacity: 0.8 }, children: [
4527
+ "No curated marketplace overlays are listed for ",
4528
+ /* @__PURE__ */ jsx12("code", { children: seWidgetType }),
4529
+ " yet. Use AI generation or skip the widget for now."
4530
+ ] }),
4531
+ /* @__PURE__ */ jsx12("div", { className: "ui-flex-row", style: { marginTop: 8 }, children: /* @__PURE__ */ jsx12("button", { type: "button", className: "ui-button", onClick: onCancel, children: "Close" }) })
4532
+ ] });
4533
+ }
4534
+ return /* @__PURE__ */ jsxs6("div", { className: "ui-flex-column ui-gap-2", style: { padding: 16, minHeight: 420 }, children: [
4535
+ /* @__PURE__ */ jsx12("div", { style: { fontWeight: 600, fontSize: 16 }, children: "Pick a marketplace replacement" }),
4536
+ /* @__PURE__ */ jsxs6("div", { style: { fontSize: 13, opacity: 0.8 }, children: [
4537
+ "Replacing ",
4538
+ /* @__PURE__ */ jsx12("code", { children: seWidgetType }),
4539
+ " with a layer from a curated Lumia Marketplace overlay."
4540
+ ] }),
4541
+ /* @__PURE__ */ jsx12("div", { className: "ui-flex-row ui-gap-2", style: { flexWrap: "wrap", marginTop: 4 }, children: candidates.map((c) => /* @__PURE__ */ jsx12(
4542
+ "button",
4543
+ {
4544
+ type: "button",
4545
+ className: `ui-button ${c.id === activeId ? "ui-button-purple" : ""}`,
4546
+ onClick: () => {
4547
+ setActiveId(c.id);
4548
+ setActiveLayerId(null);
4549
+ },
4550
+ children: c.loading ? `Loading #${c.id}\u2026` : c.error ? `#${c.id} (error)` : c.overlay?.name ?? `Overlay #${c.id}`
4551
+ },
4552
+ c.id
4553
+ )) }),
4554
+ activeCandidate?.error && /* @__PURE__ */ jsxs6("div", { style: { padding: 12, borderRadius: 6, background: "rgba(220,38,38,0.15)", color: "#fecaca", fontSize: 13 }, children: [
4555
+ "Failed to load overlay #",
4556
+ activeCandidate.id,
4557
+ ": ",
4558
+ activeCandidate.error
4559
+ ] }),
4560
+ activeCandidate?.loading && /* @__PURE__ */ jsx12("div", { style: { padding: 12, fontSize: 13, opacity: 0.8 }, children: "Loading overlay\u2026" }),
4561
+ activeCandidate?.overlay && /* @__PURE__ */ jsxs6("div", { className: "ui-flex-row ui-gap-2", style: { alignItems: "stretch" }, children: [
4562
+ /* @__PURE__ */ jsxs6("div", { style: { flex: "0 0 200px", display: "flex", flexDirection: "column", gap: 4, maxHeight: 320, overflowY: "auto" }, children: [
4563
+ /* @__PURE__ */ jsx12("div", { style: { fontSize: 12, fontWeight: 600, opacity: 0.8 }, children: "Layers" }),
4564
+ activeLayers.map((l) => /* @__PURE__ */ jsx12(
4565
+ "button",
4566
+ {
4567
+ type: "button",
4568
+ className: `ui-button ${l.id === activeLayerId ? "ui-button-purple" : ""}`,
4569
+ style: { justifyContent: "flex-start", textAlign: "left" },
4570
+ onClick: () => setActiveLayerId(l.id),
4571
+ children: /* @__PURE__ */ jsxs6("div", { style: { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: [
4572
+ /* @__PURE__ */ jsx12("div", { style: { fontSize: 12, fontWeight: 600 }, children: l.label }),
4573
+ /* @__PURE__ */ jsx12("div", { style: { fontSize: 10, opacity: 0.7 }, children: l.type })
4574
+ ] })
4575
+ },
4576
+ l.id
4577
+ )),
4578
+ activeLayers.length === 0 && /* @__PURE__ */ jsx12("div", { style: { fontSize: 12, opacity: 0.7 }, children: "No transplantable layers." })
4579
+ ] }),
4580
+ /* @__PURE__ */ jsx12("div", { style: { flex: 1, minHeight: 240, background: "rgba(0,0,0,0.3)", borderRadius: 6, overflow: "hidden" }, children: /* @__PURE__ */ jsx12(ActiveLayerPreview, { overlay: activeCandidate.overlay, layerId: activeLayerId, CustomEmbed }) })
4581
+ ] }),
4582
+ /* @__PURE__ */ jsxs6("div", { className: "ui-flex-row ui-gap-2", style: { marginTop: 12, justifyContent: "flex-end" }, children: [
4583
+ /* @__PURE__ */ jsx12("button", { type: "button", className: "ui-button", onClick: onCancel, children: "Cancel" }),
4584
+ /* @__PURE__ */ jsx12(
4585
+ "button",
4586
+ {
4587
+ type: "button",
4588
+ className: "ui-button ui-button-purple",
4589
+ onClick: handleConfirm,
4590
+ disabled: !activeCandidate?.overlay || !activeLayerId,
4591
+ children: "Use this layer"
4592
+ }
4593
+ )
4594
+ ] })
4595
+ ] });
4596
+ }
4597
+ function ActiveLayerPreview({ overlay, layerId, CustomEmbed }) {
4598
+ if (!layerId) return /* @__PURE__ */ jsx12("div", { style: { padding: 16, fontSize: 12, opacity: 0.7 }, children: "Select a layer to preview." });
4599
+ const module = overlay.settings?.modules?.[layerId];
4600
+ if (!module) return /* @__PURE__ */ jsx12("div", { style: { padding: 16, fontSize: 12, opacity: 0.7 }, children: "Layer not found." });
4601
+ const type = module.settings?.type;
4602
+ if (type === "custom" && module.content && CustomEmbed) {
4603
+ const c = module.content;
4604
+ return /* @__PURE__ */ jsx12(
4605
+ CustomEmbed,
4606
+ {
4607
+ codeId: c.codeId ?? layerId,
4608
+ html: c.html ?? "",
4609
+ css: c.css ?? "",
4610
+ js: c.js ?? "",
4611
+ data: c.data ?? {}
4612
+ }
4613
+ );
4614
+ }
4615
+ return /* @__PURE__ */ jsxs6("div", { style: { padding: 16, fontSize: 12 }, children: [
4616
+ /* @__PURE__ */ jsx12("div", { style: { fontWeight: 600, marginBottom: 8 }, children: module.settings?.title ?? type }),
4617
+ /* @__PURE__ */ jsxs6("div", { style: { opacity: 0.8 }, children: [
4618
+ "Preview not available for module type ",
4619
+ /* @__PURE__ */ jsx12("code", { children: String(type) }),
4620
+ '. Click "Use this layer" to transplant it anyway.'
4621
+ ] })
4622
+ ] });
4623
+ }
4624
+
4625
+ // src/se-import/ui/SEImportWizard.tsx
4626
+ import { Fragment as Fragment3, jsx as jsx13, jsxs as jsxs7 } from "react/jsx-runtime";
4627
+ function StepDot({ active, done, label, num }) {
4628
+ const bg = done ? "#22c55e" : active ? "#6a6ffc" : "var(--ui-bg-elevated, #2a2c31)";
4629
+ return /* @__PURE__ */ jsxs7("div", { className: "ui-flex-row", style: { alignItems: "center", gap: 8, opacity: active || done ? 1 : 0.6 }, children: [
4630
+ /* @__PURE__ */ jsx13("div", { style: { width: 22, height: 22, borderRadius: "50%", background: bg, color: "#fff", display: "flex", alignItems: "center", justifyContent: "center", fontSize: 11, fontWeight: 700 }, children: done ? "\u2713" : num }),
4631
+ /* @__PURE__ */ jsx13("span", { style: { fontSize: 12, fontWeight: active ? 600 : 400 }, children: label })
4632
+ ] });
4633
+ }
4634
+ function ProgressBar({ value, max }) {
4635
+ const pct = max > 0 ? Math.min(100, Math.round(value / max * 100)) : 0;
4636
+ return /* @__PURE__ */ jsx13("div", { style: { height: 6, borderRadius: 3, background: "var(--ui-bg-elevated, #2a2c31)", overflow: "hidden" }, children: /* @__PURE__ */ jsx13("div", { style: { height: "100%", width: `${pct}%`, background: "#6a6ffc", transition: "width 240ms" } }) });
4637
+ }
4638
+ function ErrorPanel({ message, hint }) {
4639
+ return /* @__PURE__ */ jsxs7("div", { style: { padding: 10, borderRadius: 6, background: "rgba(220, 38, 38, 0.12)", border: "1px solid rgba(220, 38, 38, 0.4)", color: "#fca5a5", fontSize: 13 }, children: [
4640
+ /* @__PURE__ */ jsx13("div", { style: { fontWeight: 600 }, children: message }),
4641
+ hint && /* @__PURE__ */ jsx13("div", { style: { marginTop: 6, whiteSpace: "pre-wrap", opacity: 0.85 }, children: hint })
4642
+ ] });
4643
+ }
4644
+ function StatusBadge({ label, count, pct, tone }) {
4645
+ const colors = { success: "#22c55e", info: "#6a6ffc", warn: "#f59e0b", muted: "#9ca3af" };
4646
+ return /* @__PURE__ */ jsxs7("div", { style: { flex: "1 1 120px", padding: "10px 12px", borderRadius: 6, background: "var(--ui-bg-elevated, #1d1f24)", borderLeft: `3px solid ${colors[tone]}` }, children: [
4647
+ /* @__PURE__ */ jsx13("div", { style: { fontSize: 11, textTransform: "uppercase", letterSpacing: 0.5, opacity: 0.7 }, children: label }),
4648
+ /* @__PURE__ */ jsx13("div", { style: { fontSize: 22, fontWeight: 700 }, children: count }),
4649
+ /* @__PURE__ */ jsxs7("div", { style: { fontSize: 12, opacity: 0.7 }, children: [
4650
+ pct,
4651
+ "%"
4652
+ ] })
4653
+ ] });
4654
+ }
4655
+ function CoverageCards({ coverage }) {
4656
+ const byStatus = useMemo5(() => {
4657
+ const acc = { direct: 0, partial: 0, template: 0, placeholder: 0 };
4658
+ for (const m of coverage.mappings) acc[m.status] += m.count;
4659
+ return acc;
4660
+ }, [coverage]);
4661
+ const pct = (n) => coverage.totalWidgets > 0 ? Math.round(n / coverage.totalWidgets * 100) : 0;
4662
+ return /* @__PURE__ */ jsxs7("div", { className: "ui-flex-row ui-gap-2", style: { flexWrap: "wrap" }, children: [
4663
+ /* @__PURE__ */ jsx13(StatusBadge, { label: "Direct", count: byStatus.direct, pct: pct(byStatus.direct), tone: "success" }),
4664
+ /* @__PURE__ */ jsx13(StatusBadge, { label: "Partial", count: byStatus.partial, pct: pct(byStatus.partial), tone: "info" }),
4665
+ /* @__PURE__ */ jsx13(StatusBadge, { label: "Template", count: byStatus.template, pct: pct(byStatus.template), tone: "warn" }),
4666
+ /* @__PURE__ */ jsx13(StatusBadge, { label: "Placeholder", count: byStatus.placeholder, pct: pct(byStatus.placeholder), tone: "muted" })
4667
+ ] });
4668
+ }
4669
+ function CustomOverlayPreview({ html, css, js, data, width, height }) {
4670
+ const srcdoc = useMemo5(() => {
4671
+ const safeData = JSON.stringify(data ?? {});
4672
+ const safeJs = JSON.stringify(`(async () => { ${js || ""} })()`);
4673
+ const safeHtml = (html || "").replace(/<\/script>/gi, "<\\/script>");
4674
+ const safeCss = (css || "").replace(/<\/style>/gi, "<\\/style>");
4675
+ 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>
4676
+ window.DATA = ${safeData};
4677
+ 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() };
4678
+ 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>'); }
4679
+ </script></body></html>`;
4680
+ }, [html, css, js, data]);
4681
+ return /* @__PURE__ */ jsx13(
4682
+ "iframe",
4683
+ {
4684
+ title: "ai-preview",
4685
+ sandbox: "allow-scripts",
4686
+ srcDoc: srcdoc,
4687
+ style: { width: "100%", height: 260, border: "1px solid var(--ui-border, #2a2c31)", borderRadius: 6, background: "repeating-conic-gradient(#1a1c20 0% 25%, #1d1f24 0% 50%) 50% / 20px 20px" },
4688
+ "data-canvas-width": width,
4689
+ "data-canvas-height": height
4690
+ }
4691
+ );
4692
+ }
4693
+ function StepURL({ url, setUrl, error, busy }) {
4694
+ return /* @__PURE__ */ jsxs7("div", { className: "ui-flex-column ui-gap-2", children: [
4695
+ /* @__PURE__ */ jsxs7("p", { style: { margin: 0, opacity: 0.85 }, children: [
4696
+ "Paste the public ",
4697
+ /* @__PURE__ */ jsx13("strong", { children: "preview URL" }),
4698
+ " for your StreamElements overlay. The URL contains the access token, so no StreamElements login is required."
4699
+ ] }),
4700
+ /* @__PURE__ */ jsx13(LSInput, { label: "StreamElements overlay URL", value: url, onChange: (e) => setUrl(e.target.value), placeholder: "https://streamelements.com/overlay/<id>/<token>", disabled: busy }),
4701
+ /* @__PURE__ */ jsxs7("details", { children: [
4702
+ /* @__PURE__ */ jsx13("summary", { style: { cursor: "pointer", fontWeight: 600, fontSize: 13 }, children: "How to find the overlay URL" }),
4703
+ /* @__PURE__ */ jsxs7("ol", { style: { paddingLeft: 18, marginTop: 8, fontSize: 13, opacity: 0.9 }, children: [
4704
+ /* @__PURE__ */ jsxs7("li", { children: [
4705
+ "Open ",
4706
+ /* @__PURE__ */ jsx13("a", { href: "https://streamelements.com/dashboard/overlays", target: "_blank", rel: "noreferrer", children: "streamelements.com/dashboard/overlays" }),
4707
+ "."
4708
+ ] }),
4709
+ /* @__PURE__ */ jsx13("li", { children: "Click the overlay you want to bring over." }),
4710
+ /* @__PURE__ */ jsxs7("li", { children: [
4711
+ "Click ",
4712
+ /* @__PURE__ */ jsx13("strong", { children: "Copy URL" }),
4713
+ " in the top-right of the editor."
4714
+ ] }),
4715
+ /* @__PURE__ */ jsx13("li", { children: "Paste it above." })
4716
+ ] })
4717
+ ] }),
4718
+ error && /* @__PURE__ */ jsx13(ErrorPanel, { message: error.message, hint: error.hint })
4719
+ ] });
4720
+ }
4721
+ function StepDiscovery({ result, assetCount }) {
4722
+ const widgets = result.coverage.totalWidgets;
4723
+ const reviewCount = result.reviewItems.length;
4724
+ const customCount = result.coverage.mappings.find((m) => m.seType === "se-widget-custom-event-list")?.count ?? 0;
4725
+ const alertCount = result.coverage.mappings.filter((m) => m.lumiaType === "alert").reduce((a, m) => a + m.count, 0);
4726
+ return /* @__PURE__ */ jsxs7("div", { className: "ui-flex-column ui-gap-2", children: [
4727
+ /* @__PURE__ */ jsx13("div", { style: { fontWeight: 600, fontSize: 16 }, children: "Here's what we found" }),
4728
+ /* @__PURE__ */ jsxs7("div", { className: "ui-flex-row ui-gap-2", style: { flexWrap: "wrap" }, children: [
4729
+ /* @__PURE__ */ jsx13(DiscoveryStat, { label: "Total widgets", value: widgets }),
4730
+ /* @__PURE__ */ jsx13(DiscoveryStat, { label: "Alerts", value: alertCount }),
4731
+ /* @__PURE__ */ jsx13(DiscoveryStat, { label: "Custom widgets", value: customCount, sub: customCount > 0 ? "will need the SE compatibility shim" : void 0 }),
4732
+ /* @__PURE__ */ jsx13(DiscoveryStat, { label: "SE-hosted assets", value: assetCount, sub: assetCount > 0 ? "can be mirrored to Lumia storage" : "no migration needed" }),
4733
+ /* @__PURE__ */ jsx13(DiscoveryStat, { label: "Need review", value: reviewCount, sub: reviewCount > 0 ? "no native Lumia equivalent yet" : "everything maps cleanly", highlight: reviewCount > 0 })
4734
+ ] }),
4735
+ /* @__PURE__ */ jsx13("div", { style: { marginTop: 8 }, children: /* @__PURE__ */ jsx13(CoverageCards, { coverage: result.coverage }) })
4736
+ ] });
4737
+ }
4738
+ function DiscoveryStat({ label, value, sub, highlight }) {
4739
+ return /* @__PURE__ */ jsxs7("div", { style: { flex: "1 1 160px", padding: "12px 14px", borderRadius: 6, background: "var(--ui-bg-elevated, #1d1f24)", border: highlight ? "1px solid #f59e0b" : "1px solid transparent" }, children: [
4740
+ /* @__PURE__ */ jsx13("div", { style: { fontSize: 11, textTransform: "uppercase", letterSpacing: 0.5, opacity: 0.7 }, children: label }),
4741
+ /* @__PURE__ */ jsx13("div", { style: { fontSize: 26, fontWeight: 700 }, children: value }),
4742
+ sub && /* @__PURE__ */ jsx13("div", { style: { fontSize: 11, opacity: 0.65, marginTop: 4 }, children: sub })
4743
+ ] });
4744
+ }
4745
+ function StepOptions({ options, setOptions, assetCount }) {
4746
+ return /* @__PURE__ */ jsxs7("div", { className: "ui-flex-column ui-gap-2", children: [
4747
+ /* @__PURE__ */ jsx13("div", { style: { fontWeight: 600, fontSize: 16 }, children: "Import options" }),
4748
+ /* @__PURE__ */ jsxs7("label", { className: "ui-flex-row", style: { gap: 10, padding: 12, borderRadius: 6, background: "var(--ui-bg-elevated, #1d1f24)", cursor: assetCount === 0 ? "not-allowed" : "pointer", opacity: assetCount === 0 ? 0.5 : 1 }, children: [
4749
+ /* @__PURE__ */ jsx13("input", { type: "checkbox", checked: options.mirrorAssets, disabled: assetCount === 0, onChange: (e) => setOptions({ ...options, mirrorAssets: e.target.checked }), style: { marginTop: 2 } }),
4750
+ /* @__PURE__ */ jsxs7("div", { children: [
4751
+ /* @__PURE__ */ jsxs7("div", { style: { fontWeight: 600 }, children: [
4752
+ "Mirror StreamElements assets to Lumia storage ",
4753
+ assetCount > 0 && /* @__PURE__ */ jsxs7("span", { style: { opacity: 0.7, fontWeight: 400 }, children: [
4754
+ "(",
4755
+ assetCount,
4756
+ " files)"
4757
+ ] })
4758
+ ] }),
4759
+ /* @__PURE__ */ jsxs7("div", { style: { fontSize: 12, opacity: 0.8, marginTop: 4 }, children: [
4760
+ "Downloads every ",
4761
+ `cdn.streamelements.com`,
4762
+ " URL referenced in the overlay and re-uploads it to your Lumia asset library, then rewrites the URLs. Recommended \u2014 if StreamElements rotates their CDN or removes a file, your overlay keeps working."
4763
+ ] })
4764
+ ] })
4765
+ ] }),
4766
+ /* @__PURE__ */ jsx13(LSInput, { label: "Overlay name", value: options.name, onChange: (e) => setOptions({ ...options, name: e.target.value }) })
4767
+ ] });
4768
+ }
4769
+ function StepMirror({ rows, running, onRetry }) {
4770
+ const done = rows.filter((r) => r.state === "done").length;
4771
+ const reused = rows.filter((r) => r.state === "reused").length;
4772
+ const keptOnCdn = rows.filter((r) => r.state === "kept-on-cdn").length;
4773
+ const failed = rows.filter((r) => r.state === "failed").length;
4774
+ const summary = running ? `Downloading from StreamElements and uploading to Lumia\u2026 (${done + reused + keptOnCdn}/${rows.length})` : `Finished. ${done} mirrored${reused ? `, ${reused} reused from your library` : ""}${keptOnCdn ? `, ${keptOnCdn} SVG kept on SE CDN` : ""}${failed ? `, ${failed} failed (left pointing at SE).` : "."}`;
4775
+ const stateColor = (s) => s === "done" ? "#22c55e" : s === "reused" ? "#60a5fa" : s === "kept-on-cdn" ? "#a78bfa" : s === "failed" ? "#ef4444" : "#6a6ffc";
4776
+ const stateLabel = (s) => s === "pending" ? "\u2026" : s === "fetching" ? "Fetching\u2026" : s === "reused" ? "\u21BA reused" : s === "kept-on-cdn" ? "\u2297 kept on SE CDN" : s === "done" ? "\u2713" : "\u2717";
4777
+ return /* @__PURE__ */ jsxs7("div", { className: "ui-flex-column ui-gap-2", children: [
4778
+ /* @__PURE__ */ jsx13("div", { style: { fontWeight: 600, fontSize: 16 }, children: "Mirroring assets" }),
4779
+ /* @__PURE__ */ jsx13("div", { style: { fontSize: 13, opacity: 0.8 }, children: summary }),
4780
+ /* @__PURE__ */ jsx13(ProgressBar, { value: done + reused + failed + keptOnCdn, max: rows.length }),
4781
+ /* @__PURE__ */ jsx13("div", { className: "ui-flex-column", style: { maxHeight: 320, overflowY: "auto", border: "1px solid var(--ui-border, #2a2c31)", borderRadius: 6 }, children: rows.map((row, i) => /* @__PURE__ */ jsxs7("div", { style: { padding: "8px 12px", borderTop: i === 0 ? "none" : "1px solid var(--ui-border, #2a2c31)", fontSize: 12 }, children: [
4782
+ /* @__PURE__ */ jsxs7("div", { className: "ui-flex-row", style: { justifyContent: "space-between", gap: 8, alignItems: "center" }, children: [
4783
+ /* @__PURE__ */ jsx13("span", { style: { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", flex: 1, fontFamily: "ui-monospace, monospace" }, title: row.url, children: row.url }),
4784
+ /* @__PURE__ */ jsx13("span", { style: { color: stateColor(row.state), fontWeight: 600 }, children: stateLabel(row.state) }),
4785
+ row.state === "failed" && /* @__PURE__ */ jsx13(
4786
+ "button",
4787
+ {
4788
+ type: "button",
4789
+ className: "ui-button ui-button-secondary",
4790
+ style: { padding: "2px 10px", fontSize: 11, minWidth: 0 },
4791
+ onClick: () => onRetry(i),
4792
+ title: "Retry this asset",
4793
+ children: "Retry"
4794
+ }
4795
+ )
4796
+ ] }),
4797
+ row.error && /* @__PURE__ */ jsx13("div", { style: { marginTop: 4, color: "#fca5a5" }, children: row.error })
4798
+ ] }, row.url)) })
4799
+ ] });
4800
+ }
4801
+ function StepReview({ item, index, total, state, error, generated, canvas, onSkip, onKeep, onGenerate, onAccept, onRetry, onPickMarketplace, onKeepAllPlaceholders, onSkipAll, remainingCount, marketplaceAvailable }) {
4802
+ return /* @__PURE__ */ jsxs7("div", { className: "ui-flex-column ui-gap-2", children: [
4803
+ /* @__PURE__ */ jsxs7("div", { className: "ui-flex-row", style: { justifyContent: "space-between", alignItems: "center" }, children: [
4804
+ /* @__PURE__ */ jsxs7("div", { style: { fontWeight: 600, fontSize: 16 }, children: [
4805
+ "Reviewing widget ",
4806
+ index + 1,
4807
+ " of ",
4808
+ total
4809
+ ] }),
4810
+ /* @__PURE__ */ jsxs7("div", { className: "ui-flex-row ui-gap-2", style: { alignItems: "center" }, children: [
4811
+ item.flaggedOff && /* @__PURE__ */ jsx13("div", { style: { fontSize: 10, padding: "2px 8px", borderRadius: 4, background: "rgba(234, 179, 8, 0.2)", color: "#facc15", textTransform: "uppercase", letterSpacing: 0.5, fontWeight: 600 }, children: "Auto-import disabled" }),
4812
+ /* @__PURE__ */ jsx13("div", { style: { fontSize: 11, opacity: 0.7, textTransform: "uppercase", letterSpacing: 0.5 }, children: item.status })
4813
+ ] })
4814
+ ] }),
4815
+ remainingCount > 1 && /* @__PURE__ */ jsxs7("div", { className: "ui-flex-row ui-gap-2", style: { justifyContent: "flex-end", alignItems: "center", fontSize: 12 }, children: [
4816
+ /* @__PURE__ */ jsxs7("span", { style: { opacity: 0.7 }, children: [
4817
+ remainingCount,
4818
+ " remaining"
4819
+ ] }),
4820
+ /* @__PURE__ */ jsx13("button", { type: "button", className: "ui-button ui-button-secondary", style: { padding: "4px 10px", fontSize: 12 }, onClick: onKeepAllPlaceholders, title: "Keep every remaining placeholder/template widget as-is (skips flagged-off widgets that should go to marketplace/AI)", children: "Keep all placeholders" }),
4821
+ /* @__PURE__ */ jsx13("button", { type: "button", className: "ui-button ui-button-secondary", style: { padding: "4px 10px", fontSize: 12 }, onClick: onSkipAll, title: "Drop every remaining widget entirely", children: "Skip all" })
4822
+ ] }),
4823
+ /* @__PURE__ */ jsxs7("div", { style: { padding: 12, borderRadius: 6, background: "var(--ui-bg-elevated, #1d1f24)" }, children: [
4824
+ /* @__PURE__ */ jsx13("div", { style: { fontFamily: "ui-monospace, monospace", fontWeight: 600, fontSize: 13 }, children: item.seWidget.type }),
4825
+ /* @__PURE__ */ jsx13("div", { style: { fontSize: 13, opacity: 0.85, marginTop: 4 }, children: item.reason })
4826
+ ] }),
4827
+ state === "generating" && /* @__PURE__ */ jsx13("div", { style: { padding: 12, fontSize: 13, opacity: 0.85 }, children: "Generating with AI\u2026 this can take 30\u201390 seconds." }),
4828
+ state === "generated" && generated && /* @__PURE__ */ jsxs7(Fragment3, { children: [
4829
+ /* @__PURE__ */ jsx13("div", { style: { fontSize: 13, fontWeight: 600, marginTop: 4 }, children: "Preview" }),
4830
+ (() => {
4831
+ const landing = getAILandingBounds(item.seWidget, canvas);
4832
+ return /* @__PURE__ */ jsx13(CustomOverlayPreview, { html: generated.html ?? "", css: generated.css ?? "", js: generated.js ?? "", data: generated.data ?? {}, width: landing.width, height: landing.height });
4833
+ })(),
4834
+ /* @__PURE__ */ jsxs7("details", { children: [
4835
+ /* @__PURE__ */ jsx13("summary", { style: { cursor: "pointer", fontSize: 12, opacity: 0.8 }, children: "Generated code" }),
4836
+ /* @__PURE__ */ jsxs7("details", { style: { marginLeft: 12, marginTop: 8 }, children: [
4837
+ /* @__PURE__ */ jsx13("summary", { style: { cursor: "pointer", fontSize: 12 }, children: "HTML" }),
4838
+ /* @__PURE__ */ jsx13("pre", { style: { fontSize: 11, padding: 8, background: "rgba(0,0,0,0.25)", borderRadius: 4, maxHeight: 160, overflow: "auto" }, children: generated.html || "" })
4839
+ ] }),
4840
+ /* @__PURE__ */ jsxs7("details", { style: { marginLeft: 12 }, children: [
4841
+ /* @__PURE__ */ jsx13("summary", { style: { cursor: "pointer", fontSize: 12 }, children: "CSS" }),
4842
+ /* @__PURE__ */ jsx13("pre", { style: { fontSize: 11, padding: 8, background: "rgba(0,0,0,0.25)", borderRadius: 4, maxHeight: 160, overflow: "auto" }, children: generated.css || "" })
4843
+ ] }),
4844
+ /* @__PURE__ */ jsxs7("details", { style: { marginLeft: 12 }, children: [
4845
+ /* @__PURE__ */ jsx13("summary", { style: { cursor: "pointer", fontSize: 12 }, children: "JS" }),
4846
+ /* @__PURE__ */ jsx13("pre", { style: { fontSize: 11, padding: 8, background: "rgba(0,0,0,0.25)", borderRadius: 4, maxHeight: 160, overflow: "auto" }, children: generated.js || "" })
4847
+ ] })
4848
+ ] })
4849
+ ] }),
4850
+ error && /* @__PURE__ */ jsx13(ErrorPanel, { message: error }),
4851
+ /* @__PURE__ */ jsxs7("details", { children: [
4852
+ /* @__PURE__ */ jsx13("summary", { style: { cursor: "pointer", fontSize: 12, opacity: 0.8 }, children: "Original StreamElements config" }),
4853
+ /* @__PURE__ */ jsx13("pre", { style: { marginTop: 6, fontSize: 11, padding: 8, background: "rgba(0,0,0,0.25)", borderRadius: 4, maxHeight: 180, overflow: "auto" }, children: JSON.stringify(item.seWidget.variables ?? {}, null, 2) })
4854
+ ] }),
4855
+ /* @__PURE__ */ jsx13("div", { className: "ui-flex-row ui-gap-2", style: { marginTop: 8 }, children: state === "generated" ? /* @__PURE__ */ jsxs7(Fragment3, { children: [
4856
+ /* @__PURE__ */ jsx13("button", { type: "button", className: "ui-button", onClick: onRetry, children: "Try again" }),
4857
+ /* @__PURE__ */ jsx13("button", { type: "button", className: "ui-button", onClick: onSkip, children: "Skip this widget" }),
4858
+ /* @__PURE__ */ jsx13("button", { type: "button", className: "ui-button ui-button-purple", onClick: onAccept, children: "Use this and continue" })
4859
+ ] }) : /* @__PURE__ */ jsxs7(Fragment3, { children: [
4860
+ !item.flaggedOff && /* @__PURE__ */ jsx13("button", { type: "button", className: "ui-button", onClick: onKeep, disabled: state === "generating", children: "Keep placeholder" }),
4861
+ /* @__PURE__ */ jsx13("button", { type: "button", className: "ui-button", onClick: onSkip, disabled: state === "generating", children: "Skip" }),
4862
+ marketplaceAvailable && /* @__PURE__ */ jsx13("button", { type: "button", className: "ui-button", onClick: onPickMarketplace, disabled: state === "generating", children: "Pick from Marketplace" }),
4863
+ /* @__PURE__ */ jsx13("button", { type: "button", className: "ui-button ui-button-purple", onClick: onGenerate, disabled: state === "generating", children: state === "generating" ? "Generating\u2026" : "Generate with AI" })
4864
+ ] }) }),
4865
+ item.flaggedOff && !marketplaceAvailable && state !== "generated" && /* @__PURE__ */ jsx13("div", { style: { fontSize: 12, opacity: 0.75 }, children: "No curated Marketplace replacement is configured for this widget yet." })
4866
+ ] });
4867
+ }
4868
+ function StepConfirm({ result, options, mirrorRows, rowStates }) {
4869
+ const total = result.overlay.settings.layers.length;
4870
+ const mirrored = mirrorRows.filter((r) => r.state === "done" || r.state === "reused" || r.state === "kept-on-cdn").length;
4871
+ const mirrorFailed = mirrorRows.filter((r) => r.state === "failed").length;
4872
+ const reviewBuckets = Object.values(rowStates).reduce(
4873
+ (acc, s) => {
4874
+ acc[s.state] = (acc[s.state] ?? 0) + 1;
4875
+ return acc;
4876
+ },
4877
+ {}
4878
+ );
4879
+ return /* @__PURE__ */ jsxs7("div", { className: "ui-flex-column ui-gap-2", children: [
4880
+ /* @__PURE__ */ jsx13("div", { style: { fontWeight: 600, fontSize: 16 }, children: "Ready to import" }),
4881
+ /* @__PURE__ */ jsxs7("div", { className: "ui-flex-column ui-gap-2", style: { padding: 12, borderRadius: 6, background: "var(--ui-bg-elevated, #1d1f24)" }, children: [
4882
+ /* @__PURE__ */ jsx13(Row, { label: "Overlay name", value: options.name || result.overlay.name }),
4883
+ /* @__PURE__ */ jsx13(Row, { label: "Layers", value: `${total}` }),
4884
+ /* @__PURE__ */ jsx13(Row, { label: "Assets mirrored", value: options.mirrorAssets ? `${mirrored} / ${mirrorRows.length}${mirrorFailed ? ` (${mirrorFailed} kept on SE CDN)` : ""}` : "skipped" }),
4885
+ /* @__PURE__ */ jsx13(Row, { label: "Generated with AI", value: `${reviewBuckets.generated ?? 0}` }),
4886
+ /* @__PURE__ */ jsx13(Row, { label: "Skipped", value: `${reviewBuckets.skipped ?? 0}` }),
4887
+ /* @__PURE__ */ jsx13(Row, { label: "Kept as placeholder", value: `${reviewBuckets.kept ?? 0}` })
4888
+ ] })
4889
+ ] });
4890
+ }
4891
+ function Row({ label, value }) {
4892
+ return /* @__PURE__ */ jsxs7("div", { className: "ui-flex-row", style: { justifyContent: "space-between" }, children: [
4893
+ /* @__PURE__ */ jsx13("span", { style: { opacity: 0.75 }, children: label }),
4894
+ /* @__PURE__ */ jsx13("span", { style: { fontWeight: 600 }, children: value })
4895
+ ] });
4896
+ }
4897
+ function SEImportWizard({ bindings }) {
4898
+ const {
4899
+ fetchMarketplaceOverlay,
4900
+ generateAICustomCode,
4901
+ uploadAsset,
4902
+ existingAssets,
4903
+ saveOverlay,
4904
+ onComplete,
4905
+ onClose,
4906
+ notify,
4907
+ CustomEmbed,
4908
+ t
4909
+ } = bindings;
4910
+ const translate = (key, fallback) => t ? t(key) ?? fallback : fallback;
4911
+ const [step, setStep] = useState6("url");
4912
+ const [url, setUrl] = useState6("");
4913
+ const [loadError, setLoadError] = useState6(null);
4914
+ const [loading, setLoading] = useState6(false);
4915
+ const [result, setResult] = useState6(null);
4916
+ const [originalReviewItems, setOriginalReviewItems] = useState6([]);
4917
+ const [options, setOptions] = useState6({ mirrorAssets: true, name: "" });
4918
+ const assetUrls = useMemo5(() => result ? findSEAssetURLs(result.overlay) : [], [result]);
4919
+ const [mirrorRows, setMirrorRows] = useState6([]);
4920
+ const [mirrorRunning, setMirrorRunning] = useState6(false);
4921
+ const mirrorStartedRef = useRef4(false);
4922
+ const [rowStates, setRowStates] = useState6({});
4923
+ const [reviewIndex, setReviewIndex] = useState6(0);
4924
+ const [importing, setImporting] = useState6(false);
4925
+ const handleLoad = useCallback3(async () => {
4926
+ setLoadError(null);
4927
+ const parts = extractSEPreviewParts(url);
4928
+ if (!parts) {
4929
+ setLoadError({ message: "That doesn't look like a StreamElements overlay URL.", hint: "Expected: https://streamelements.com/overlay/<overlayId>/<token>" });
4930
+ return;
4931
+ }
4932
+ setLoading(true);
4933
+ try {
4934
+ const bootstrap = await fetchSEBootstrap(parts);
4935
+ const imported = importSEBootstrap(bootstrap);
4936
+ setResult(imported);
4937
+ setOptions((o) => ({ ...o, name: imported.overlay.name }));
4938
+ setOriginalReviewItems(imported.reviewItems);
4939
+ setRowStates(Object.fromEntries(imported.reviewItems.map((r) => [r.moduleId, { state: "pending" }])));
4940
+ setReviewIndex(0);
4941
+ setStep("discovery");
4942
+ } catch (e) {
4943
+ setLoadError({ message: "Could not load the overlay.", hint: e?.message });
4944
+ } finally {
4945
+ setLoading(false);
4946
+ }
4947
+ }, [url]);
4948
+ const mirrorAbortRef = useRef4(null);
4949
+ const processAssetRow = useCallback3(
4950
+ async (assetUrl, idx, existingByFilename, signal) => {
4951
+ const filename = filenameFromURL(assetUrl);
4952
+ const reuseUrl = existingByFilename.get(filename);
4953
+ if (reuseUrl) {
4954
+ setResult((curr) => curr ? { ...curr, overlay: rewriteAssetURLs(curr.overlay, { [assetUrl]: reuseUrl }) } : curr);
4955
+ return { state: "reused", newUrl: reuseUrl };
4956
+ }
4957
+ if (filename.toLowerCase().endsWith(".svg")) {
4958
+ return { state: "kept-on-cdn", newUrl: assetUrl };
4959
+ }
4960
+ setMirrorRows((prev) => prev.map((r, i) => i === idx ? { ...r, state: "fetching", error: void 0 } : r));
4961
+ try {
4962
+ const newUrl = await mirrorOneAsset(assetUrl, (file) => uploadAsset(file), signal);
4963
+ existingByFilename.set(filename, newUrl);
4964
+ setResult((curr) => curr ? { ...curr, overlay: rewriteAssetURLs(curr.overlay, { [assetUrl]: newUrl }) } : curr);
4965
+ return { state: "done", newUrl };
4966
+ } catch (err) {
4967
+ if (err?.name === "AbortError" || signal?.aborted) {
4968
+ return { state: "pending" };
4969
+ }
4970
+ return { state: "failed", error: extractErrorMessage(err) };
4971
+ }
4972
+ },
4973
+ [uploadAsset]
4974
+ );
4975
+ const filenameCacheRef = useRef4(/* @__PURE__ */ new Map());
4976
+ const runMirror = useCallback3(async () => {
4977
+ if (!result) return;
4978
+ mirrorAbortRef.current = new AbortController();
4979
+ const signal = mirrorAbortRef.current.signal;
4980
+ setMirrorRunning(true);
4981
+ const initialRows = assetUrls.map((u) => ({ url: u, state: "pending" }));
4982
+ setMirrorRows(initialRows);
4983
+ const existingByFilename = /* @__PURE__ */ new Map();
4984
+ for (const asset of existingAssets ?? []) {
4985
+ const name = asset.file_name || asset.name;
4986
+ if (name && asset.url) existingByFilename.set(name, asset.url);
4987
+ }
4988
+ filenameCacheRef.current = existingByFilename;
4989
+ for (let i = 0; i < initialRows.length; i += 1) {
4990
+ if (signal.aborted) {
4991
+ setMirrorRunning(false);
4992
+ return;
4993
+ }
4994
+ const row = initialRows[i];
4995
+ const outcome = await processAssetRow(row.url, i, existingByFilename, signal);
4996
+ if (signal.aborted) {
4997
+ setMirrorRunning(false);
4998
+ return;
4999
+ }
5000
+ setMirrorRows((prev) => prev.map((r, idx) => idx === i ? { ...r, ...outcome } : r));
5001
+ }
5002
+ setMirrorRunning(false);
5003
+ }, [assetUrls, existingAssets, processAssetRow, result]);
5004
+ const retryMirrorRow = useCallback3(
5005
+ async (idx) => {
5006
+ const rowUrl = mirrorRows[idx]?.url;
5007
+ if (!rowUrl) return;
5008
+ const outcome = await processAssetRow(rowUrl, idx, filenameCacheRef.current, mirrorAbortRef.current?.signal);
5009
+ setMirrorRows((prev) => prev.map((r, i) => i === idx ? { ...r, ...outcome } : r));
5010
+ },
5011
+ [mirrorRows, processAssetRow]
5012
+ );
5013
+ useEffect6(() => {
5014
+ if (step === "mirror" && !mirrorStartedRef.current) {
5015
+ mirrorStartedRef.current = true;
5016
+ void runMirror();
5017
+ }
5018
+ }, [step, runMirror]);
5019
+ const currentItem = originalReviewItems[reviewIndex];
5020
+ const currentRow = currentItem ? rowStates[currentItem.moduleId] ?? { state: "pending" } : void 0;
5021
+ const advanceReview = useCallback3(() => {
5022
+ if (reviewIndex + 1 < originalReviewItems.length) setReviewIndex(reviewIndex + 1);
5023
+ else setStep("confirm");
5024
+ }, [originalReviewItems.length, reviewIndex]);
5025
+ const setRow = useCallback3((moduleId, patch) => {
5026
+ setRowStates((prev) => ({ ...prev, [moduleId]: { ...prev[moduleId] ?? { state: "pending" }, ...patch } }));
5027
+ }, []);
5028
+ const handleKeep = () => {
5029
+ if (!result || !currentItem) return;
5030
+ setResult(applyReviewAction(result, currentItem.moduleId, "keep"));
5031
+ setRow(currentItem.moduleId, { state: "kept" });
5032
+ advanceReview();
5033
+ };
5034
+ const handleSkip = () => {
5035
+ if (!result || !currentItem) return;
5036
+ setResult(applyReviewAction(result, currentItem.moduleId, "skip"));
5037
+ setRow(currentItem.moduleId, { state: "skipped" });
5038
+ advanceReview();
5039
+ };
5040
+ const handleGenerate = async () => {
5041
+ if (!currentItem || !result) return;
5042
+ setRow(currentItem.moduleId, { state: "generating", error: void 0 });
5043
+ try {
5044
+ const canvas = { width: result.overlay.settings.metadata.width, height: result.overlay.settings.metadata.height };
5045
+ const generated = await generateAICustomCode(buildAIPromptForSEWidget(currentItem.seWidget, canvas));
5046
+ setRow(currentItem.moduleId, { state: "generated", generated });
5047
+ } catch (e) {
5048
+ setRow(currentItem.moduleId, { state: "failed", error: e?.message ?? "AI generation failed." });
5049
+ }
5050
+ };
5051
+ const handleAcceptGenerated = () => {
5052
+ if (!result || !currentItem || !currentRow?.generated) return;
5053
+ setResult(applyReviewAction(result, currentItem.moduleId, "ai", currentRow.generated));
5054
+ advanceReview();
5055
+ };
5056
+ const [marketplacePickerOpen, setMarketplacePickerOpen] = useState6(false);
5057
+ const handlePickMarketplace = (transplant) => {
5058
+ if (!result || !currentItem) return;
5059
+ setResult(applyReviewAction(result, currentItem.moduleId, "marketplace", transplant));
5060
+ setRow(currentItem.moduleId, { state: "kept" });
5061
+ setMarketplacePickerOpen(false);
5062
+ advanceReview();
5063
+ };
5064
+ const handleKeepAllPlaceholders = () => {
5065
+ if (!result) return;
5066
+ const patch = {};
5067
+ for (const item of originalReviewItems) {
5068
+ const rowState = rowStates[item.moduleId]?.state ?? "pending";
5069
+ if (rowState !== "pending") continue;
5070
+ if (item.flaggedOff) continue;
5071
+ if (item.status !== "placeholder" && item.status !== "template") continue;
5072
+ patch[item.moduleId] = { state: "kept" };
5073
+ }
5074
+ if (Object.keys(patch).length) setRowStates((prev) => ({ ...prev, ...patch }));
5075
+ const remainingIndex = originalReviewItems.findIndex((item) => (patch[item.moduleId]?.state ?? rowStates[item.moduleId]?.state ?? "pending") === "pending");
5076
+ if (remainingIndex >= 0) {
5077
+ setReviewIndex(remainingIndex);
5078
+ const remainingItem = originalReviewItems[remainingIndex];
5079
+ if (remainingItem?.flaggedOff) {
5080
+ const actionText = hasMarketplaceCandidates(remainingItem.seWidget.type) ? "Skip, Marketplace, or Generate with AI" : "Skip or Generate with AI";
5081
+ notify.warning(`Choose ${actionText} for the flagged-off widget.`);
5082
+ } else {
5083
+ notify.warning("Review the remaining widget before continuing.");
5084
+ }
5085
+ return;
5086
+ }
5087
+ setStep("confirm");
5088
+ };
5089
+ const handleSkipAll = () => {
5090
+ if (!result) return;
5091
+ const toSkip = /* @__PURE__ */ new Set();
5092
+ const patch = {};
5093
+ for (const item of originalReviewItems) {
5094
+ const rowState = rowStates[item.moduleId]?.state ?? "pending";
5095
+ if (rowState !== "pending") continue;
5096
+ toSkip.add(item.moduleId);
5097
+ patch[item.moduleId] = { state: "skipped" };
5098
+ }
5099
+ if (toSkip.size === 0) {
5100
+ setStep("confirm");
5101
+ return;
5102
+ }
5103
+ const nextLayers = (result.overlay.settings.layers ?? []).filter((l) => !toSkip.has(l.id));
5104
+ const modules = { ...result.overlay.settings.modules ?? {} };
5105
+ for (const id of toSkip) delete modules[id];
5106
+ const reviewItems = result.reviewItems.filter((r) => !toSkip.has(r.moduleId));
5107
+ setResult({
5108
+ ...result,
5109
+ overlay: {
5110
+ ...result.overlay,
5111
+ settings: { ...result.overlay.settings, layers: nextLayers, modules },
5112
+ layers_count: nextLayers.length
5113
+ },
5114
+ reviewItems
5115
+ });
5116
+ setRowStates((prev) => ({ ...prev, ...patch }));
5117
+ setStep("confirm");
5118
+ };
5119
+ const handleFinalImport = useCallback3(async () => {
5120
+ if (!result) return;
5121
+ setImporting(true);
5122
+ try {
5123
+ const body = {
5124
+ name: options.name.trim() || result.overlay.name,
5125
+ description: result.overlay.description,
5126
+ settings: result.overlay.settings
5127
+ };
5128
+ const { uuid } = await saveOverlay(body);
5129
+ notify.success(`Imported overlay from StreamElements.`);
5130
+ mirrorAbortRef.current?.abort();
5131
+ onClose();
5132
+ if (uuid) onComplete({ overlayId: uuid });
5133
+ } catch (err) {
5134
+ notify.error(`Import failed: ${extractErrorMessage(err)}`);
5135
+ } finally {
5136
+ setImporting(false);
5137
+ }
5138
+ }, [notify, onClose, onComplete, options.name, result, saveOverlay]);
5139
+ const stepOrder = ["url", "discovery", "options", "mirror", "review", "confirm"];
5140
+ const goBack = () => {
5141
+ if (step === "review" && reviewIndex > 0) {
5142
+ setReviewIndex(reviewIndex - 1);
5143
+ return;
5144
+ }
5145
+ const idx = stepOrder.indexOf(step);
5146
+ if (idx <= 0) return;
5147
+ let prev = stepOrder[idx - 1];
5148
+ if (prev === "mirror" && !options.mirrorAssets) prev = stepOrder[idx - 2];
5149
+ if (prev) setStep(prev);
5150
+ };
5151
+ const goNext = () => {
5152
+ if (step === "url") {
5153
+ void handleLoad();
5154
+ return;
5155
+ }
5156
+ if (step === "discovery") {
5157
+ setStep("options");
5158
+ return;
5159
+ }
5160
+ if (step === "options") {
5161
+ if (options.mirrorAssets && assetUrls.length > 0) setStep("mirror");
5162
+ else if (originalReviewItems.length > 0) setStep("review");
5163
+ else setStep("confirm");
5164
+ return;
5165
+ }
5166
+ if (step === "mirror") {
5167
+ if (originalReviewItems.length > 0) setStep("review");
5168
+ else setStep("confirm");
5169
+ return;
5170
+ }
5171
+ if (step === "review") {
5172
+ if (currentItem) {
5173
+ if (currentRow?.state === "generated") {
5174
+ handleAcceptGenerated();
5175
+ } else if (currentRow?.state === "pending") {
5176
+ if (currentItem.flaggedOff) {
5177
+ const actionText = hasMarketplaceCandidates(currentItem.seWidget.type) ? "Skip, Marketplace, or Generate with AI" : "Skip or Generate with AI";
5178
+ notify.warning(`Choose ${actionText} for the flagged-off widget.`);
5179
+ return;
5180
+ }
5181
+ handleKeep();
5182
+ } else {
5183
+ advanceReview();
5184
+ }
5185
+ }
5186
+ return;
5187
+ }
5188
+ if (step === "confirm") {
5189
+ void handleFinalImport();
5190
+ return;
5191
+ }
5192
+ };
5193
+ const nextLabel = (() => {
5194
+ if (step === "url") return loading ? "Loading\u2026" : "Load overlay";
5195
+ if (step === "discovery") return "Continue";
5196
+ if (step === "options") return "Continue";
5197
+ if (step === "mirror") return mirrorRunning ? "Working\u2026" : "Continue";
5198
+ if (step === "review") return currentRow?.state === "generated" ? "Use & continue" : "Continue";
5199
+ if (step === "confirm") return importing ? "Importing\u2026" : "Create overlay";
5200
+ return "Next";
5201
+ })();
5202
+ const nextDisabled = (() => {
5203
+ if (step === "url") return loading || !url.trim();
5204
+ if (step === "mirror") return mirrorRunning;
5205
+ if (step === "review") return currentRow?.state === "generating" || currentRow?.state === "pending" && currentItem?.flaggedOff;
5206
+ if (step === "confirm") return importing;
5207
+ return false;
5208
+ })();
5209
+ const stepperIndex = stepOrder.indexOf(step);
5210
+ const visibleSteps = [
5211
+ { key: "url", label: "Load" },
5212
+ { key: "discovery", label: "Discovery" },
5213
+ { key: "options", label: "Options" },
5214
+ ...options.mirrorAssets && assetUrls.length > 0 ? [{ key: "mirror", label: "Assets" }] : [],
5215
+ ...originalReviewItems.length > 0 ? [{ key: "review", label: `Review (${originalReviewItems.length})` }] : [],
5216
+ { key: "confirm", label: "Confirm" }
5217
+ ];
5218
+ return /* @__PURE__ */ jsxs7("div", { className: "ui-flex-column ui-gap-2", style: { minWidth: 680 }, children: [
5219
+ result && /* @__PURE__ */ jsx13("div", { className: "ui-flex-row ui-gap-2", style: { flexWrap: "wrap", paddingBottom: 8, borderBottom: "1px solid var(--ui-border, #2a2c31)" }, children: visibleSteps.map((s, i) => /* @__PURE__ */ jsx13(StepDot, { num: i + 1, label: s.label, active: s.key === step, done: visibleSteps.findIndex((v) => v.key === step) > i }, s.key)) }),
5220
+ step === "url" && /* @__PURE__ */ jsx13(StepURL, { url, setUrl, error: loadError, busy: loading }),
5221
+ step === "discovery" && result && /* @__PURE__ */ jsx13(StepDiscovery, { result, assetCount: assetUrls.length }),
5222
+ step === "options" && /* @__PURE__ */ jsx13(StepOptions, { options, setOptions, assetCount: assetUrls.length }),
5223
+ step === "mirror" && /* @__PURE__ */ jsx13(StepMirror, { rows: mirrorRows, running: mirrorRunning, onRetry: retryMirrorRow }),
5224
+ step === "review" && currentItem && result && !marketplacePickerOpen && /* @__PURE__ */ jsx13(
5225
+ StepReview,
5226
+ {
5227
+ item: currentItem,
5228
+ index: reviewIndex,
5229
+ total: originalReviewItems.length,
5230
+ state: currentRow?.state ?? "pending",
5231
+ error: currentRow?.error,
5232
+ generated: currentRow?.generated,
5233
+ canvas: { width: result.overlay.settings.metadata.width, height: result.overlay.settings.metadata.height },
5234
+ onSkip: handleSkip,
5235
+ onKeep: handleKeep,
5236
+ onGenerate: handleGenerate,
5237
+ onAccept: handleAcceptGenerated,
5238
+ onRetry: handleGenerate,
5239
+ onPickMarketplace: () => setMarketplacePickerOpen(true),
5240
+ onKeepAllPlaceholders: handleKeepAllPlaceholders,
5241
+ onSkipAll: handleSkipAll,
5242
+ remainingCount: originalReviewItems.filter((r) => (rowStates[r.moduleId]?.state ?? "pending") === "pending").length,
5243
+ marketplaceAvailable: hasMarketplaceCandidates(currentItem.seWidget.type)
5244
+ }
5245
+ ),
5246
+ step === "review" && currentItem && marketplacePickerOpen && /* @__PURE__ */ jsx13(
5247
+ MarketplacePicker,
5248
+ {
5249
+ seWidgetType: currentItem.seWidget.type,
5250
+ fetchMarketplaceOverlay,
5251
+ CustomEmbed,
5252
+ onPick: handlePickMarketplace,
5253
+ onCancel: () => setMarketplacePickerOpen(false)
5254
+ }
5255
+ ),
5256
+ step === "confirm" && result && /* @__PURE__ */ jsx13(StepConfirm, { result, options, mirrorRows, rowStates }),
5257
+ /* @__PURE__ */ jsxs7("div", { className: "ui-flex-row ui-gap-2", style: { justifyContent: "flex-end", marginTop: 12 }, children: [
5258
+ /* @__PURE__ */ jsx13(
5259
+ "button",
5260
+ {
5261
+ type: "button",
5262
+ className: "ui-button",
5263
+ onClick: () => {
5264
+ mirrorAbortRef.current?.abort();
5265
+ onClose();
5266
+ },
5267
+ disabled: loading || importing,
5268
+ children: translate("action.cancel", "Cancel")
5269
+ }
5270
+ ),
5271
+ stepperIndex > 0 && /* @__PURE__ */ jsx13("button", { type: "button", className: "ui-button", onClick: goBack, disabled: loading || importing || mirrorRunning || currentRow?.state === "generating", children: "Back" }),
5272
+ /* @__PURE__ */ jsx13("button", { type: "button", className: "ui-button ui-button-purple", onClick: goNext, disabled: nextDisabled, children: nextLabel })
5273
+ ] })
5274
+ ] });
5275
+ }
5276
+ function extractErrorMessage(err) {
5277
+ if (!err) return "Failed";
5278
+ const e = err;
5279
+ return e?.response?.data?.message || e?.response?.data?.error || e?.message || "Failed";
5280
+ }
5281
+
5282
+ // src/se-import/index.ts
5283
+ var REVIEW_REASONS = {
5284
+ "se-widget-bit-boss": "No native Lumia equivalent \u2014 bit boss fight bar with HP/damage states.",
5285
+ "se-widget-hype-cup": "No native Lumia equivalent \u2014 Box2D physics stacking animation.",
5286
+ "se-widget-train": "No native Lumia equivalent \u2014 animated subscriber/event train.",
5287
+ "se-widget-media-share": "No native Lumia equivalent \u2014 viewer-submitted media player.",
5288
+ "se-widget-contest": "No native Lumia equivalent \u2014 SE-specific contest widget.",
5289
+ "se-widget-giveaway": "No native Lumia equivalent \u2014 SE giveaway service.",
5290
+ "se-widget-botcounter": "No native Lumia equivalent \u2014 chatter/message counter.",
5291
+ "se-widget-top-cheerers-list": 'Lumia loyaltyleaderboard needs a "source" extension before it can render cheer rankings.',
5292
+ "se-widget-top-gifters-list": 'Lumia loyaltyleaderboard needs a "source" extension before it can render gifter rankings.',
5293
+ "se-widget-top-tippers-list": 'Lumia loyaltyleaderboard needs a "source" extension before it can render tipper rankings.',
5294
+ "se-widget-snow": "Seasonal effect \u2014 needs a particle template in Lumia.",
5295
+ "se-widget-halloween": "Seasonal effect \u2014 needs a Lumia template.",
5296
+ "se-widget-halloween-2019": "Seasonal effect \u2014 needs a Lumia template.",
5297
+ "se-widget-xmas": "Seasonal effect \u2014 needs a Lumia template.",
5298
+ "se-widget-valentine": "Seasonal effect \u2014 needs a Lumia template.",
5299
+ "se-widget-easter": "Seasonal effect \u2014 needs a Lumia template.",
5300
+ "se-widget-world-cup": "Seasonal effect \u2014 needs a Lumia template."
5301
+ };
5302
+ function reasonFor(seType, status, flaggedOff) {
5303
+ if (flaggedOff && FLAG_OFF_REASONS[seType]) return FLAG_OFF_REASONS[seType];
5304
+ return REVIEW_REASONS[seType] ?? (status === "template" ? "Imported as a generic template stub." : "No native mapping yet \u2014 imported as a labelled text placeholder.");
5305
+ }
5306
+ function extractSEOverlayId(input) {
5307
+ const trimmed = input.trim();
5308
+ const m = trimmed.match(/[0-9a-f]{24}/i);
5309
+ return m ? m[0] : null;
5310
+ }
5311
+ function extractSEPreviewParts(input) {
5312
+ const trimmed = input.trim();
5313
+ const m = trimmed.match(/streamelements\.com\/overlay\/([0-9a-f]{24})\/([A-Za-z0-9_-]+)/i);
5314
+ if (!m) return null;
5315
+ return { overlayId: m[1], apikey: m[2] };
5316
+ }
5317
+ function buildBootstrapUrl(overlayId) {
5318
+ return `https://api.streamelements.com/kappa/v2/overlays/${overlayId}/bootstrap?isEditor=false&isMobile=false&isObs=false&isObsLive=false&isXsplit=false`;
5319
+ }
5320
+ async function fetchSEBootstrap({ overlayId, apikey }) {
5321
+ const res = await fetch(buildBootstrapUrl(overlayId), {
5322
+ method: "GET",
5323
+ headers: { Accept: "application/json", Authorization: `apikey ${apikey}` }
5324
+ });
5325
+ if (!res.ok) {
5326
+ let detail = "";
5327
+ try {
5328
+ const body = await res.json();
5329
+ detail = body?.message ? ` \u2014 ${body.message}` : "";
5330
+ } catch {
5331
+ }
5332
+ const reason = res.status === 401 || res.status === 403 ? "StreamElements rejected the URL token. The preview link may have been revoked." : res.status === 404 ? "Overlay not found. Double-check the URL." : `HTTP ${res.status}`;
5333
+ throw new Error(`${reason}${detail}`);
5334
+ }
5335
+ const json = await res.json();
5336
+ if (!isSEBootstrap(json)) {
5337
+ throw new Error("Server returned a response that does not look like an SE bootstrap payload.");
5338
+ }
5339
+ return json;
5340
+ }
5341
+ function isSEBootstrap(value) {
5342
+ if (!value || typeof value !== "object") return false;
5343
+ const v = value;
5344
+ if (!v.overlay || typeof v.overlay !== "object") return false;
5345
+ const o = v.overlay;
5346
+ return Array.isArray(o.widgets);
5347
+ }
5348
+ function importSEBootstrap(bootstrap) {
5349
+ const seOverlay = bootstrap.overlay;
5350
+ const widgets = seOverlay?.widgets ?? [];
5351
+ const coverage = {
5352
+ totalWidgets: widgets.length,
5353
+ mappings: [],
5354
+ notes: []
5355
+ };
5356
+ const importCanvas = {
5357
+ width: seOverlay?.settings?.width ?? 1920,
5358
+ height: seOverlay?.settings?.height ?? 1080
5359
+ };
5360
+ setImportCanvas(importCanvas);
5361
+ const layers = [];
5362
+ const modules = {};
5363
+ const reviewItems = [];
5364
+ try {
5365
+ const seUidToLumiaGroupId = {};
5366
+ const groupWidgetByUid = {};
5367
+ for (const w of widgets) {
5368
+ if (w.type !== "se-widget-group") continue;
5369
+ const uid = w.variables?.uid;
5370
+ if (typeof uid !== "string") continue;
5371
+ const lumiaGroupId = nanoid3();
5372
+ seUidToLumiaGroupId[uid] = lumiaGroupId;
5373
+ groupWidgetByUid[uid] = w;
5374
+ }
5375
+ for (const uid of Object.keys(groupWidgetByUid)) {
5376
+ const w = groupWidgetByUid[uid];
5377
+ const lumiaGroupId = seUidToLumiaGroupId[uid];
5378
+ const parentUid = typeof w.group === "string" ? w.group : null;
5379
+ const parentLumiaGroupId = parentUid ? seUidToLumiaGroupId[parentUid] ?? null : null;
5380
+ const bounds = seCssToBounds(w.css, { width: 200, height: 200 }, importCanvas);
5381
+ const layer = {
5382
+ id: lumiaGroupId,
5383
+ type: "group",
5384
+ group: parentLumiaGroupId,
5385
+ bounds: {
5386
+ x: bounds.x,
5387
+ y: bounds.y,
5388
+ width: bounds.width,
5389
+ height: bounds.height,
5390
+ opacity: bounds.opacity,
5391
+ zIndex: bounds.zIndex,
5392
+ rotate: 0,
5393
+ scale: [1, 1],
5394
+ matrix: ""
5395
+ },
5396
+ state: {
5397
+ locked: w.locked ?? false,
5398
+ visible: w.visible ?? true,
5399
+ // SE's `variables.expanded` is the editor's collapsed/open state.
5400
+ expanded: w.variables?.expanded ?? true
5401
+ }
5402
+ };
5403
+ const module = {
5404
+ id: lumiaGroupId,
5405
+ loaded: true,
5406
+ settings: { title: w.name ?? "Group", type: "group" },
5407
+ lights: [],
5408
+ css: {},
5409
+ content: {
5410
+ se_provenance: { widget: w, reason: "Imported as native group", status: "group" }
5411
+ },
5412
+ events: {},
5413
+ variables: {}
5414
+ };
5415
+ layers.push(layer);
5416
+ modules[lumiaGroupId] = module;
5417
+ recordCoverage(coverage, { unit: { layer, module }, status: "direct", lumiaType: "group" }, w.type);
5418
+ }
5419
+ for (const w of widgets) {
5420
+ if (w.type === "se-widget-group") continue;
5421
+ const result = dispatch(w);
5422
+ if (typeof w.group === "string") {
5423
+ const parentLumiaGroupId = seUidToLumiaGroupId[w.group];
5424
+ if (parentLumiaGroupId) {
5425
+ result.unit.layer.group = parentLumiaGroupId;
5426
+ }
5427
+ }
5428
+ layers.push(result.unit.layer);
5429
+ const module = result.unit.module;
5430
+ if (result.status === "placeholder" || result.status === "template") {
5431
+ module.content = {
5432
+ ...module.content ?? {},
5433
+ se_provenance: {
5434
+ widget: w,
5435
+ reason: reasonFor(w.type, result.status, result.flaggedOff),
5436
+ status: result.status,
5437
+ flaggedOff: result.flaggedOff
5438
+ }
5439
+ };
5440
+ reviewItems.push({
5441
+ moduleId: module.id,
5442
+ seWidget: w,
5443
+ status: result.status,
5444
+ reason: reasonFor(w.type, result.status, result.flaggedOff),
5445
+ flaggedOff: result.flaggedOff
5446
+ });
5447
+ }
5448
+ modules[module.id] = module;
5449
+ recordCoverage(coverage, result, w.type);
5450
+ }
5451
+ if (coverage.mappings.some((m) => m.status === "placeholder")) {
5452
+ coverage.notes.push("Some widgets imported as placeholder text layers \u2014 see SE/05-widget-to-module-mapping.md for status.");
5453
+ }
5454
+ if (coverage.mappings.some((m) => m.seType === "se-widget-merch-goal")) {
5455
+ coverage.notes.push("Merch-goal widgets imported as generic goals \u2014 see SE/03-missing-variables.md \xA78 for the missing data source.");
5456
+ }
5457
+ if (coverage.mappings.some((m) => m.seType === "se-widget-custom-event-list")) {
5458
+ 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.");
5459
+ }
5460
+ const overlay = {
5461
+ uuid: "",
5462
+ listen_id: "",
5463
+ name: seOverlay?.name ? `[SE] ${seOverlay.name}` : `Imported from StreamElements (${seOverlay?._id ?? ""})`,
5464
+ description: seOverlay?._id ? `Imported from StreamElements overlay ${seOverlay._id}` : "Imported from StreamElements",
5465
+ settings: {
5466
+ metadata: {
5467
+ width: seOverlay?.settings?.width ?? 1920,
5468
+ height: seOverlay?.settings?.height ?? 1080
5469
+ },
5470
+ layers,
5471
+ modules
5472
+ },
5473
+ metadata: {
5474
+ width: seOverlay?.settings?.width ?? null,
5475
+ height: seOverlay?.settings?.height ?? null
5476
+ },
5477
+ layers_count: layers.length,
5478
+ hasFullSettings: true
5479
+ };
5480
+ return { overlay, coverage, reviewItems };
5481
+ } finally {
5482
+ setImportCanvas(null);
5483
+ }
5484
+ }
5485
+ function applyReviewAction(result, moduleId, action, payload) {
5486
+ if (action === "keep") return result;
5487
+ const layers = result.overlay.settings.layers ?? [];
5488
+ const modules = { ...result.overlay.settings.modules ?? {} };
5489
+ if (action === "skip") {
5490
+ delete modules[moduleId];
5491
+ const nextLayers = layers.filter((l) => l.id !== moduleId);
5492
+ const reviewItems2 = result.reviewItems.filter((r) => r.moduleId !== moduleId);
5493
+ return {
5494
+ ...result,
5495
+ overlay: { ...result.overlay, settings: { ...result.overlay.settings, layers: nextLayers, modules }, layers_count: nextLayers.length },
5496
+ reviewItems: reviewItems2
5497
+ };
5498
+ }
5499
+ if (action === "marketplace") {
5500
+ const transplant = payload;
5501
+ const existing2 = modules[moduleId];
5502
+ const existingLayer = layers.find((l) => l.id === moduleId);
5503
+ if (!existing2 || !existingLayer || !transplant) return result;
5504
+ const newLayer = {
5505
+ ...transplant.layer,
5506
+ id: moduleId,
5507
+ group: existingLayer.group ?? null,
5508
+ bounds: existingLayer.bounds,
5509
+ state: existingLayer.state
5510
+ };
5511
+ const provenance2 = existing2.content?.se_provenance;
5512
+ const newModule = {
5513
+ ...transplant.module,
5514
+ id: moduleId,
5515
+ content: { ...transplant.module.content ?? {}, se_provenance: provenance2 }
5516
+ };
5517
+ const rootOldNewId = transplant.layer.id;
5518
+ const remappedExtras = (transplant.extras ?? []).map((e) => ({
5519
+ layer: e.layer.group === rootOldNewId ? { ...e.layer, group: moduleId } : e.layer,
5520
+ module: e.module
5521
+ }));
5522
+ const nextLayers = layers.map((l) => l.id === moduleId ? newLayer : l);
5523
+ for (const extra of remappedExtras) {
5524
+ nextLayers.push(extra.layer);
5525
+ modules[extra.module.id] = extra.module;
5526
+ }
5527
+ modules[moduleId] = newModule;
5528
+ const reviewItems2 = result.reviewItems.filter((r) => r.moduleId !== moduleId);
5529
+ return {
5530
+ ...result,
5531
+ overlay: {
5532
+ ...result.overlay,
5533
+ settings: { ...result.overlay.settings, layers: nextLayers, modules },
5534
+ layers_count: nextLayers.length
5535
+ },
5536
+ reviewItems: reviewItems2
5537
+ };
5538
+ }
5539
+ const existing = modules[moduleId];
5540
+ const generated = payload;
5541
+ if (!existing || !generated) return result;
5542
+ const provenance = existing.content?.se_provenance;
5543
+ const replaced = {
5544
+ ...existing,
5545
+ settings: { ...existing.settings ?? {}, type: "custom" },
5546
+ css: {},
5547
+ // discard the placeholder's red-warning styling
5548
+ content: {
5549
+ codeId: generated.codeId ?? `ai-${moduleId}`,
5550
+ html: generated.html ?? "",
5551
+ css: generated.css ?? "",
5552
+ js: generated.js ?? "",
5553
+ data: parseLooseJson(generated.data) ?? {},
5554
+ configs: parseLooseJson(generated.configs) ?? [],
5555
+ flavor: "ai-generated",
5556
+ se_provenance: provenance
5557
+ }
5558
+ };
5559
+ modules[moduleId] = replaced;
5560
+ const reviewItems = result.reviewItems.filter((r) => r.moduleId !== moduleId);
5561
+ return {
5562
+ ...result,
5563
+ overlay: { ...result.overlay, settings: { ...result.overlay.settings, modules } },
5564
+ reviewItems
5565
+ };
5566
+ }
5567
+ function parseLooseJson(value) {
5568
+ if (value == null) return void 0;
5569
+ if (typeof value !== "string") return value;
5570
+ try {
5571
+ return JSON.parse(value);
5572
+ } catch {
5573
+ return value;
5574
+ }
5575
+ }
5576
+ function getAILandingBounds(widget, canvas) {
5577
+ const bounds = seCssToBounds(widget.css, LUMIA_DEFAULT_SIZES.text, canvas);
5578
+ return { width: bounds.width, height: bounds.height };
5579
+ }
5580
+ function buildAIPromptForSEWidget(widget, canvas) {
5581
+ const variables = widget.variables ?? {};
5582
+ const listener = typeof widget.listener === "string" ? widget.listener : null;
5583
+ const listeners = widget.listeners && typeof widget.listeners === "object" && !Array.isArray(widget.listeners) ? Object.keys(widget.listeners) : null;
5584
+ const landing = getAILandingBounds(widget, canvas);
5585
+ return [
5586
+ "Recreate a StreamElements overlay widget as a Lumia Stream custom overlay (HTML + CSS + JS).",
5587
+ "",
5588
+ `StreamElements widget type: ${widget.type}`,
5589
+ listener ? `Primary event listener: ${listener}` : "",
5590
+ listeners ? `Subscribes to events: ${listeners.join(", ")}` : "",
5591
+ `Canvas: ${landing.width} \xD7 ${landing.height}`,
5592
+ "",
5593
+ "Widget configuration (JSON):",
5594
+ "```json",
5595
+ JSON.stringify(variables, null, 2).slice(0, 6e3),
5596
+ "```",
5597
+ "",
5598
+ "Constraints \u2014 your output must run inside a Lumia Custom Overlay sandboxed iframe:",
5599
+ '- Use `window.Overlay.on("alert", handler)` / `window.Overlay.on("chat", handler)` to receive Lumia events.',
5600
+ "- Lumia template variables use double-brace syntax: {{username}}, {{amount}}, {{message}}, {{currency}}.",
5601
+ "- The `window.DATA` object holds user-configurable values (mirrors your `configs`).",
5602
+ "- DO NOT depend on StreamElements globals (no SE_API, no jQuery).",
5603
+ "- Keep dependencies inline or via CDN <link>/<script> tags inside the HTML.",
5604
+ "",
5605
+ "Match the SE widget's visible behavior as closely as you can. Return the result via the `upsertOverlayTabs` function call with `html`, `css`, `js`, plus a `configs` array describing any tunable fields."
5606
+ ].filter(Boolean).join("\n");
5607
+ }
3055
5608
  export {
5609
+ FLAG_OFF_REASONS,
3056
5610
  LSButton,
3057
5611
  LSCheckbox,
3058
5612
  LSCheckboxField,
@@ -3068,11 +5622,31 @@ export {
3068
5622
  LSVariableInputField,
3069
5623
  LSVariableInputProvider,
3070
5624
  MEDIA_PREVIEW_USER_LEVEL_VALUES,
5625
+ MarketplacePicker,
5626
+ SEImportWizard,
5627
+ SE_IMPORT_FLAGS,
5628
+ SE_WIDGET_TO_MARKETPLACE_CANDIDATES,
5629
+ applyReviewAction,
5630
+ buildAIPromptForSEWidget,
5631
+ buildBootstrapUrl,
3071
5632
  buildChatMessageContent,
3072
5633
  codeMirrorlinterOptions,
5634
+ extractSEOverlayId,
5635
+ extractSEPreviewParts,
5636
+ fetchSEBootstrap,
5637
+ filenameFromURL,
5638
+ findSEAssetURLs,
5639
+ getAILandingBounds,
5640
+ getMarketplaceCandidates,
3073
5641
  getMediaPreviewFromUrl,
3074
5642
  getNormalizedUserLevels,
5643
+ hasMarketplaceCandidates,
5644
+ importSEBootstrap,
3075
5645
  isMediaPreviewAllowedForUser,
5646
+ isSEBootstrap,
5647
+ isWidgetFlaggedOff,
5648
+ listTransplantableLayers,
5649
+ mirrorOneAsset,
3076
5650
  normalizeHttpUrl,
3077
5651
  normalizeMediaPreviewUserLevels,
3078
5652
  parseMessageLinks,
@@ -3080,6 +5654,8 @@ export {
3080
5654
  resolveMediaPreviewRoleSettings,
3081
5655
  resolveMediaPreviewSetting,
3082
5656
  resolvePlatformChatterProfileUrl,
5657
+ rewriteAssetURLs,
3083
5658
  tokenizeChatMessage,
5659
+ transplantLayer,
3084
5660
  variableCompletionOptions
3085
5661
  };