@arcware-cloud/pixelstreaming-websdk 1.3.11 → 1.3.13

package/index.esm.js

@@ -23356,11 +23356,13 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   "ArcwareConfig": () => (/* binding */ ArcwareConfig),
 /* harmony export */   "DefaultUrl": () => (/* binding */ DefaultUrl)
 /* harmony export */ });
-/* harmony import */ var zod__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(1604);
-/* harmony import */ var _epicgames_ps_lib_pixelstreamingfrontend_ue5_5__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(7800);
-/* harmony import */ var _epicgames_ps_lib_pixelstreamingfrontend_ue5_5__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(7463);
+/* harmony import */ var zod__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(1604);
+/* harmony import */ var _epicgames_ps_lib_pixelstreamingfrontend_ue5_5__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(7800);
+/* harmony import */ var _epicgames_ps_lib_pixelstreamingfrontend_ue5_5__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(7463);
 /* harmony import */ var _domain_Session__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2469);
 /* harmony import */ var _domain_ArcwareSettingsSchema__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(5602);
+/* harmony import */ var _features_whiteLabelling__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(3545);
+
 
 
 
@@ -23379,8 +23381,8 @@ Logger.Error = (message: string) => {
   if (message?.startsWith("unhandled Stat Type")) return;
   console.error(message);
 };*/
-_epicgames_ps_lib_pixelstreamingfrontend_ue5_5__WEBPACK_IMPORTED_MODULE_2__.Logger.InitLogging(2, false);
-class ArcwareConfig extends _epicgames_ps_lib_pixelstreamingfrontend_ue5_5__WEBPACK_IMPORTED_MODULE_3__.Config {
+_epicgames_ps_lib_pixelstreamingfrontend_ue5_5__WEBPACK_IMPORTED_MODULE_3__.Logger.InitLogging(2, false);
+class ArcwareConfig extends _epicgames_ps_lib_pixelstreamingfrontend_ue5_5__WEBPACK_IMPORTED_MODULE_4__.Config {
     /**
      * Can be used to fetch projectId and shareId from the current url.
      * Example:
@@ -23399,15 +23401,15 @@ class ArcwareConfig extends _epicgames_ps_lib_pixelstreamingfrontend_ue5_5__WEBP
     static PickIdsOfUrl() {
         const { pathname } = new URL(window.location.href);
         const sections = pathname.split("/");
-        const projectId = sections.find((section) => zod__WEBPACK_IMPORTED_MODULE_4__.z.string().uuid().safeParse(section).success);
-        const shareId = sections.find((section) => zod__WEBPACK_IMPORTED_MODULE_4__.z.string().startsWith("share-").safeParse(section).success);
+        const projectId = sections.find((section) => zod__WEBPACK_IMPORTED_MODULE_5__.z.string().uuid().safeParse(section).success);
+        const shareId = sections.find((section) => zod__WEBPACK_IMPORTED_MODULE_5__.z.string().startsWith("share-").safeParse(section).success);
         return {
             projectId,
             shareId
         };
     }
     constructor(config) {
-        var _a, _b;
+        var _a, _b, _c;
         const dfToken = new URL(window.location.href).search
             .slice(1)
             .split("&")
@@ -23428,15 +23430,25 @@ class ArcwareConfig extends _epicgames_ps_lib_pixelstreamingfrontend_ue5_5__WEBP
         if (!config.initialSettings.ss)
             config.initialSettings.ss = DefaultUrl;
         super(config);
-        this.VERSION = "1.3.11";
+        this.VERSION = "1.3.13";
         this.settings = settings;
         this.session = new _domain_Session__WEBPACK_IMPORTED_MODULE_0__.Session();
         this._initialSettings = config.initialSettings;
         // Setup arcware default settings.
-        this.setFlagEnabled(_epicgames_ps_lib_pixelstreamingfrontend_ue5_5__WEBPACK_IMPORTED_MODULE_3__.Flags.AFKDetection, true);
+        this.setFlagEnabled(_epicgames_ps_lib_pixelstreamingfrontend_ue5_5__WEBPACK_IMPORTED_MODULE_4__.Flags.AFKDetection, true);
         // IMPORTANT NOTE: The feature BrowserSendOffer is no longer supported in PSInfra 5.5.
         // The offer is now expected to come from UE. Ensure that your signalling server supports this behaviour.
         //this.setFlagEnabled(Flags.BrowserSendOffer, true);
+        if (this.useUrlParams) {
+            // Get the query string from URL
+            const qs = new URLSearchParams(window.location.search);
+            // Retrieve image loading from there
+            const wlParsed = this.useUrlParams ? (0,_features_whiteLabelling__WEBPACK_IMPORTED_MODULE_2__.readWhiteLabelFromQuery)(qs) : undefined; // respect useUrlParams
+            if (wlParsed) {
+                this.settings.whiteLabelling = Object.assign(Object.assign({}, ((_c = this.settings.whiteLabelling) !== null && _c !== void 0 ? _c : {})), wlParsed);
+            }
+            this.settings.infoButton = qs.has("i") || qs.has("info");
+        }
     }
     /** Setup connection string. */
     get urlFlags() {
@@ -23489,7 +23501,7 @@ class ArcwareConfig extends _epicgames_ps_lib_pixelstreamingfrontend_ue5_5__WEBP
         return this._initialSettings;
     }
     modifyInitialSettings(mouseLock) {
-        this.setFlagEnabled(_epicgames_ps_lib_pixelstreamingfrontend_ue5_5__WEBPACK_IMPORTED_MODULE_3__.Flags.HoveringMouseMode, mouseLock);
+        this.setFlagEnabled(_epicgames_ps_lib_pixelstreamingfrontend_ue5_5__WEBPACK_IMPORTED_MODULE_4__.Flags.HoveringMouseMode, mouseLock);
     }
 }
 
@@ -23547,7 +23559,14 @@ function ArcwareInit({ shareId, projectId }, configuration, forceRefresh = false
         useUrlParams: (configuration === null || configuration === void 0 ? void 0 : configuration.useUrlParams) === true,
         initialSettings: Object.assign({ ss: _ArcwareConfig__WEBPACK_IMPORTED_MODULE_0__.DefaultUrl, AutoConnect: false, StartVideoMuted: true, AutoPlayVideo: true, KeyboardInput: true, MouseInput: true, GamepadInput: true, TouchInput: true, XRControllerInput: true, UseMic: true, SuppressBrowserKeys: true, FakeMouseWithTouches: false, ForceMonoAudio: false, HoveringMouse: true }, configuration === null || configuration === void 0 ? void 0 : configuration.initialSettings),
         settings: Object.assign({ shareId,
-            projectId, fullscreenButton: true, audioButton: true, stopButton: false, infoButton: false, micButton: false, settingsButton: false, connectionStrengthIcon: false, connectionIdentifierLoggingDisabled: undefined, errorHandler: undefined, loveLetterHandler: undefined, loveLetterLogging: undefined, queueHandler: undefined, sessionIdHandler: undefined, startHeight: undefined, startWidth: undefined, orientationZoom: undefined }, configuration === null || configuration === void 0 ? void 0 : configuration.settings)
+            projectId, fullscreenButton: true, audioButton: true, stopButton: false, infoButton: false, micButton: false, settingsButton: false, connectionStrengthIcon: false, connectionIdentifierLoggingDisabled: undefined, errorHandler: undefined, loveLetterHandler: undefined, loveLetterLogging: undefined, queueHandler: undefined, sessionIdHandler: undefined, startHeight: undefined, startWidth: undefined, orientationZoom: undefined, whiteLabelling: {
+                splashScreenUrl: undefined,
+                loadingIconFadeMs: undefined,
+                loadingIconUrl: undefined,
+                splashScreenMode: undefined,
+                splashScreenPosition: undefined,
+                splashScreenBgColor: undefined
+            } }, configuration === null || configuration === void 0 ? void 0 : configuration.settings)
     });
     const PixelStreaming = new _ArcwarePixelStreaming__WEBPACK_IMPORTED_MODULE_1__.ArcwarePixelStreaming(Config);
     const Application = new _ArcwareApplication__WEBPACK_IMPORTED_MODULE_2__.ArcwareApplication({ stream: PixelStreaming });
@@ -23581,12 +23600,12 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _domain_EventHandler__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(3379);
 /* harmony import */ var _domain_Stats__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(9764);
 /* harmony import */ var _domain_debounce__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(9580);
-/* harmony import */ var _ui_LoveLetters__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(4572);
-/* harmony import */ var _ui_ArcwareLogoLoader__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(6469);
+/* harmony import */ var _ui_LoveLetters__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(4572);
+/* harmony import */ var _ui_ArcwareLogoLoader__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(6469);
 /* harmony import */ var _ui_MicrophoneOverlay__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(3613);
 /* harmony import */ var _domain_ConnectionIdentifier__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(5999);
 /* harmony import */ var _features_DiagnosticsCollector__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(8429);
-/* harmony import */ var _features_common__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(2483);
+/* harmony import */ var _features_common__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(2483);
 
 
 
@@ -23911,6 +23930,7 @@ class ArcwarePixelStreaming extends _epicgames_ps_lib_pixelstreamingfrontend_ue5
                 });
             }
         }
+        this.applyBrandingFromSettings();
         this.handleMouseLock();
         this.injectCustomUI();
     }
@@ -24155,23 +24175,15 @@ class ArcwarePixelStreaming extends _epicgames_ps_lib_pixelstreamingfrontend_ue5
                     limitedHeight = maxHeight;
                     limitedWidth = maxHeight * aspectRatio;
                 }
-                // width: clientWidth * Math.max(window.devicePixelRatio, 1)  - for retina device, 1 is min upscale factor
-                const newRes = (0,_features_common__WEBPACK_IMPORTED_MODULE_12__.capScale)({
-                    width: browserWidth * Math.max(window.devicePixelRatio, 1.25),
-                    height: browserHeight * Math.max(window.devicePixelRatio, 1.25),
-                }, {
-                    width: maxWidth,
-                    height: maxHeight,
-                });
                 // Zoom level for orientation change if provided
                 if (orientationZoom) {
-                    if (newRes.width < newRes.height) {
-                        if (orientationZoom.hasOwnProperty('portrait'))
+                    if (browserWidth < browserHeight) {
+                        if (orientationZoom.hasOwnProperty("portrait"))
                             (_a = this === null || this === void 0 ? void 0 : this.webRtcController) === null || _a === void 0 ? void 0 : _a.emitUIInteraction({
                                 zoom: orientationZoom.portrait
                             });
                     }
-                    else if (orientationZoom.hasOwnProperty('landscape')) {
+                    else if (orientationZoom.hasOwnProperty("landscape")) {
                         (_b = this === null || this === void 0 ? void 0 : this.webRtcController) === null || _b === void 0 ? void 0 : _b.emitUIInteraction({
                             zoom: orientationZoom.landscape
                         });
@@ -24240,27 +24252,28 @@ class ArcwarePixelStreaming extends _epicgames_ps_lib_pixelstreamingfrontend_ue5
     }
     initLoveLettersContainer() {
         var _a;
-        const logoLoader = new _ui_ArcwareLogoLoader__WEBPACK_IMPORTED_MODULE_13__.ArcwareLogoLoader();
+        const logoLoader = new _ui_ArcwareLogoLoader__WEBPACK_IMPORTED_MODULE_12__.ArcwareLogoLoader();
+        this.logoLoader = logoLoader;
         if (!this.loveLettersContainer) {
-            const loveLettersContainer = document === null || document === void 0 ? void 0 : document.createElement("div");
-            const { videoPlayer } = this === null || this === void 0 ? void 0 : this.webRtcController;
+            const loveLettersContainer = document.createElement("div");
+            this.loveLettersContainer = loveLettersContainer; // keep the ref
+            const { videoPlayer } = this.webRtcController;
             const videoElementParent = videoPlayer.getVideoParentElement();
-            (_a = loveLettersContainer === null || loveLettersContainer === void 0 ? void 0 : loveLettersContainer.classList) === null || _a === void 0 ? void 0 : _a.add("love-letters-box-root");
-            videoElementParent === null || videoElementParent === void 0 ? void 0 : videoElementParent.appendChild(loveLettersContainer);
-            const lettersBlock = document === null || document === void 0 ? void 0 : document.createElement("div");
+            loveLettersContainer.classList.add("love-letters-box-root");
+            videoElementParent.appendChild(loveLettersContainer);
+            const lettersBlock = document.createElement("div");
             lettersBlock.id = "letters-block";
-            const lettersWrapper = document === null || document === void 0 ? void 0 : document.createElement("div");
+            const lettersWrapper = document.createElement("div");
             lettersWrapper.id = "letters-wrapper";
-            if (loveLettersContainer) {
-                lettersBlock === null || lettersBlock === void 0 ? void 0 : lettersBlock.appendChild(logoLoader === null || logoLoader === void 0 ? void 0 : logoLoader.arcwareLogoLoader);
-                loveLettersContainer === null || loveLettersContainer === void 0 ? void 0 : loveLettersContainer.appendChild(lettersBlock);
-                lettersBlock === null || lettersBlock === void 0 ? void 0 : lettersBlock.appendChild(lettersWrapper);
-            }
-            lettersBlock.innerHTML = "";
-            if (lettersBlock) {
-                lettersBlock === null || lettersBlock === void 0 ? void 0 : lettersBlock.appendChild(logoLoader === null || logoLoader === void 0 ? void 0 : logoLoader.arcwareLogoLoader);
-                lettersBlock === null || lettersBlock === void 0 ? void 0 : lettersBlock.appendChild(lettersWrapper);
-            }
+            // append your existing loader root (with SVG) into the lettersBlock
+            const loaderRoot = logoLoader.arcwareLogoLoader; // your existing getter
+            lettersBlock.appendChild(loaderRoot);
+            // ensure the loader knows its host
+            (_a = logoLoader.setHostElement) === null || _a === void 0 ? void 0 : _a.call(logoLoader, loaderRoot);
+            loveLettersContainer.appendChild(lettersBlock);
+            lettersBlock.appendChild(lettersWrapper);
+            // apply current (local) settings immediately
+            this.applyBrandingFromSettings();
         }
     }
     pushLetter(letter) {
@@ -24277,7 +24290,7 @@ class ArcwarePixelStreaming extends _epicgames_ps_lib_pixelstreamingfrontend_ue5
         if (letter !== undefined) {
             const formattedLoveLetter = letter === null || letter === void 0 ? void 0 : letter.replace(/LL: |\.$/g, "");
             (_a = this === null || this === void 0 ? void 0 : this.loveLettersList) === null || _a === void 0 ? void 0 : _a.push(formattedLoveLetter);
-            const loveLettersBox = new _ui_LoveLetters__WEBPACK_IMPORTED_MODULE_14__.LoveLetters();
+            const loveLettersBox = new _ui_LoveLetters__WEBPACK_IMPORTED_MODULE_13__.LoveLetters();
             loveLettersBox === null || loveLettersBox === void 0 ? void 0 : loveLettersBox.addLetter(formattedLoveLetter, (_b = this === null || this === void 0 ? void 0 : this.loveLettersList) === null || _b === void 0 ? void 0 : _b.length);
             setTimeout(() => {
                 this.processLoveLetterQueue();
@@ -24366,8 +24379,7 @@ class ArcwarePixelStreaming extends _epicgames_ps_lib_pixelstreamingfrontend_ue5
         }
     }
     injectCustomUI() {
-        (0,_features_common__WEBPACK_IMPORTED_MODULE_12__.waitForElement)('#stream-ui')
-            .then(el => {
+        (0,_features_common__WEBPACK_IMPORTED_MODULE_14__.waitForElement)("#stream-ui").then((el) => {
             var _a;
             const videoElementParent = (_a = this === null || this === void 0 ? void 0 : this.videoElementParent) === null || _a === void 0 ? void 0 : _a.parentElement;
             if (videoElementParent) {
@@ -24375,6 +24387,61 @@ class ArcwarePixelStreaming extends _epicgames_ps_lib_pixelstreamingfrontend_ue5
             }
         });
     }
+    applyBrandingFromSettings() {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
+        const cfg = ((_b = (_a = this === null || this === void 0 ? void 0 : this.config) === null || _a === void 0 ? void 0 : _a.settings.whiteLabelling) !== null && _b !== void 0 ? _b : {});
+        // Loader image + fade
+        try {
+            if (this.logoLoader) {
+                (_d = (_c = this.logoLoader).setImage) === null || _d === void 0 ? void 0 : _d.call(_c, cfg.loadingIconUrl);
+                (_f = (_e = this.logoLoader).setFade) === null || _f === void 0 ? void 0 : _f.call(_e, cfg.loadingIconFadeMs);
+            }
+        }
+        catch (_p) { }
+        // Splash on loveLettersContainer (preferred), fallback to player parent
+        try {
+            const el = (_m = (_g = this.loveLettersContainer) !== null && _g !== void 0 ? _g : (_l = (_k = (_j = (_h = this.webRtcController) === null || _h === void 0 ? void 0 : _h.videoPlayer) === null || _j === void 0 ? void 0 : _j.getVideoParentElement) === null || _k === void 0 ? void 0 : _k.call(_j)) === null || _l === void 0 ? void 0 : _l.parentElement) !== null && _m !== void 0 ? _m : null;
+            if (!el)
+                return;
+            // Clear previous inline choices
+            const s = el.style;
+            s.removeProperty("background-image");
+            s.removeProperty("background-size");
+            s.removeProperty("background-repeat");
+            s.removeProperty("background-position");
+            s.removeProperty("background-color");
+            el.classList.remove("aw-splash");
+            if (cfg.splashScreenUrl) {
+                el.classList.add("aw-splash"); // keeps your global defaults
+                // Compute mode (default to 'contain' if not provided)
+                const mode = ((_o = cfg.splashScreenMode) !== null && _o !== void 0 ? _o : "contain");
+                // Apply sizing/repeat per mode
+                switch (mode) {
+                    case "contain":
+                        s.backgroundSize = "contain";
+                        s.backgroundRepeat = "no-repeat";
+                        break;
+                    case "cover":
+                        s.backgroundSize = "cover";
+                        s.backgroundRepeat = "no-repeat";
+                        break;
+                    case "stretch":
+                        s.backgroundSize = "100% 100%";
+                        s.backgroundRepeat = "no-repeat";
+                        break;
+                    case "repeat":
+                        s.backgroundSize = "auto"; // keep intrinsic px
+                        s.backgroundRepeat = "repeat";
+                        break;
+                }
+                // Position & color (optional)
+                s.backgroundPosition = cfg.splashScreenPosition || "center center";
+                s.backgroundColor = cfg.splashScreenBgColor || "var(--color0)";
+                s.backgroundImage = `url("${cfg.splashScreenUrl}")`;
+            }
+        }
+        catch (_q) { }
+    }
 }
 
 
@@ -24443,8 +24510,12 @@ const ArcwareSettingsSchema = zod__WEBPACK_IMPORTED_MODULE_1__.z.object({
     /** Zoom functionality */
     orientationZoom: zod__WEBPACK_IMPORTED_MODULE_1__.z.object({
         landscape: zod__WEBPACK_IMPORTED_MODULE_1__.z.number(),
-        portrait: zod__WEBPACK_IMPORTED_MODULE_1__.z.number(),
-    }).strict().optional()
+        portrait: zod__WEBPACK_IMPORTED_MODULE_1__.z.number()
+    })
+        .strict()
+        .optional(),
+    /** Loader customization */
+    whiteLabelling: _arcware_cloud_shared_pixelstreaming_websdk__WEBPACK_IMPORTED_MODULE_0__.ZWhiteLabel.optional()
 });
 
 
@@ -25252,7 +25323,6 @@ class DiagnosticsCollector {
 
 __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "capScale": () => (/* binding */ capScale),
 /* harmony export */   "extFromMime": () => (/* binding */ extFromMime),
 /* harmony export */   "normalizeType": () => (/* binding */ normalizeType),
 /* harmony export */   "parseUnknownToObject": () => (/* binding */ parseUnknownToObject),
@@ -25372,25 +25442,47 @@ function waitForElement(selector, { root = document, timeout = 3000 } = {}) {
         }, timeout);
     });
 }
-function capScale(size, max) {
-    const result = { width: 0, height: 0 };
-    /* result.width = size.width > max.width ? max.width : size.width;
-    result.height = size.height > max.height ? max.height : size.height; */
-    result.width = Math.floor(size.width);
-    result.height = Math.floor(size.height);
-    if (result.height > max.height) {
-        const heightScale = max.height / result.height;
-        result.height = max.height;
-        result.width *= heightScale;
-    }
-    if (result.width > max.width) {
-        const heightScale = max.width / result.width;
-        result.width = max.width;
-        result.height *= heightScale;
-    }
-    result.width = (result.width % 2) + result.width;
-    result.height = (result.height % 2) + result.height;
-    return result;
+
+
+/***/ }),
+
+/***/ 3545:
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "readWhiteLabelFromQuery": () => (/* binding */ readWhiteLabelFromQuery)
+/* harmony export */ });
+/* harmony import */ var _arcware_cloud_shared_pixelstreaming_websdk__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(7910);
+
+function decodeBase64OrBase64Url(raw) {
+    const normalized = raw.replace(/-/g, "+").replace(/_/g, "/");
+    const padded = normalized + "===".slice((normalized.length + 3) % 4);
+    if (typeof atob === "function")
+        return atob(padded);
+    // @ts-ignore (Node fallback if this runs server-side)
+    return Buffer.from(padded, "base64").toString("utf-8");
+}
+/** Parse ?wl=... (or ?whitelabel=...) → validated partial settings */
+function readWhiteLabelFromQuery(qs) {
+    var _a;
+    try {
+        const raw = (_a = qs.get("wl")) !== null && _a !== void 0 ? _a : qs.get("whitelabel");
+        if (!raw)
+            return undefined;
+        const jsonStr = decodeBase64OrBase64Url(raw);
+        const obj = JSON.parse(jsonStr);
+        const parsed = _arcware_cloud_shared_pixelstreaming_websdk__WEBPACK_IMPORTED_MODULE_0__.ZWhiteLabel.safeParse(obj);
+        if (!parsed.success) {
+            //console.warn("[ArcwareConfig] Invalid wl payload:", parsed.error?.flatten?.());
+            return undefined;
+        }
+        return parsed.data;
+    }
+    catch (e) {
+        //console.warn("[ArcwareConfig] Failed to parse wl payload:", e);
+        return undefined;
+    }
 }
 
 
@@ -25446,16 +25538,27 @@ const ArcwareStyles = {
             "--color11": "rgba(65,0,139,1) !important",
             "--color12": "#222224 !important",
             "--color13": "#f0f0f2 !important",
-            "--colorBoxShadow": "rgba(0, 0, 0, 0.20) !important",
+            "--colorBoxShadow": "rgba(0, 0, 0, 0.20) !important"
+        },
+        ".aw-splash": {
+            backgroundRepeat: "no-repeat",
+            backgroundPosition: "center center",
+            backgroundSize: "contain",
+            backgroundColor: "var(--color0)"
+        },
+        "@keyframes aw-loader-fade": {
+            from: { opacity: 0.25 },
+            to: { opacity: 1 }
         },
+        /* ---------- /NEW ---------- */
         "#playerUI *": {
-            fontFamily: "system-ui",
+            fontFamily: "system-ui"
         },
         "#shared-stream-container": {
-            boxSizing: "border-box",
+            boxSizing: "border-box"
         },
         "#shared-stream-container::-webkit-scrollbar": {
-            width: "10px",
+            width: "10px"
         },
         "#shared-stream-container::-webkit-scrollbar-track": {
             background: "var(--color13)",
@@ -25464,10 +25567,10 @@ const ArcwareStyles = {
             borderTop: "20px solid var(--color0)",
             borderRight: "5px solid var(--color0)",
             borderBottom: "20px solid var(--color0)",
-            borderLeft: "5px solid var(--color0)",
+            borderLeft: "5px solid var(--color0)"
         },
         "#shared-stream-container::-webkit-scrollbar-track-piece": {
-            background: "transparent",
+            background: "transparent"
         },
         "#shared-stream-container::-webkit-scrollbar-thumb": {
             background: "var(--color13)",
@@ -25475,11 +25578,11 @@ const ArcwareStyles = {
             borderRight: "2px solid var(--color0)",
             borderLeft: "2px solid var(--color0)",
             transition: "all ease-in-out 0.3s",
-            borderRadius: "7px",
+            borderRadius: "7px"
         },
         "#shared-stream-container::-webkit-scrollbar-thumb:hover": {
             transition: "all ease-in-out 0.3s",
-            background: "var(--color3)",
+            background: "var(--color3)"
         },
         "#playerUI, #videoElementParent": {
             position: "absolute",
@@ -25493,13 +25596,13 @@ const ArcwareStyles = {
             left: 0,
             margin: "auto",
             boxSizing: "border-box",
-            pointerEvents: "all",
+            pointerEvents: "all"
         },
         "#streamingVideo": {
             maxWidth: "100%",
             maxHeight: "100%",
             boxSizing: "border-box",
-            background: "#18181A",
+            background: "#18181A"
         },
         "#uiFeatures #controls": {
             top: "auto",
@@ -25507,13 +25610,13 @@ const ArcwareStyles = {
             bottom: "10px",
             right: "20px",
             display: "flex",
-            flexDirection: "column-reverse",
+            flexDirection: "column-reverse"
         },
         "#uiFeatures #connection": {
             bottom: "5px",
             left: "10px",
             width: "2.5rem",
-            heihgt: "2.5rem",
+            heihgt: "2.5rem"
         },
         "#uiFeatures button": {
             backgroundColor: "var(--color12)",
@@ -25530,23 +25633,23 @@ const ArcwareStyles = {
             alignItems: "center",
             boxShadow: "0px 0px 24px 0px var(--colorBoxShadow)",
             borderRadius: "3px",
-            outline: "none",
+            outline: "none"
         },
         "#uiFeatures button:hover, #uiFeatures button:active": {
             padding: "0 !important",
-            border: "none",
+            border: "none"
         },
         "#uiFeatures button #audioIconMuted, #uiFeatures button #audioIconUnmuted, #uiFeatures button #micIconMuted, #uiFeatures button #micIconUnmuted": {
             width: "31px",
-            height: "28px",
+            height: "28px"
         },
         "#uiFeatures button #maximizeIcon, #uiFeatures button #minimizeIcon": {
             width: "25px",
-            height: "25px",
+            height: "25px"
         },
         "#stopIcon, #playIcon": {
             width: "30px",
-            height: "30px",
+            height: "30px"
         },
         "#uiFeatures button .tooltiptext": {
             right: "125%",
@@ -25555,35 +25658,35 @@ const ArcwareStyles = {
             borderRadius: "3px",
             backgroundColor: "var(--color12)",
             width: "95px",
-            visibility: "hidden!important",
+            visibility: "hidden!important"
         },
         "@media (hover: hover) and (pointer: fine)": {
             "#uiFeatures button:hover .tooltiptext": {
-                visibility: "visible!important",
-            },
+                visibility: "visible!important"
+            }
         },
         "#controls>*": {
             marginBottom: "0.5rem",
             display: "block",
             lineHeight: "1.75rem",
             padding: "0.5rem",
-            backgroundColor: "var(--color12)",
+            backgroundColor: "var(--color12)"
         },
         "#uiFeatures #settingsIcon, #uiFeatures #statsIcon": {
             width: "27px",
-            height: "27px",
+            height: "27px"
         },
         ".svgIcon": {
-            fill: "var(--color13)",
+            fill: "var(--color13)"
         },
         "#uiFeatures button:hover .svgIcon, #uiFeatures button:active .svgIcon": {
-            fill: "var(--color12)",
+            fill: "var(--color12)"
         },
         ".tgl-switch .tgl-slider, .tgl-flat:checked+.tgl-slider": {
-            border: "3px solid transparent",
+            border: "3px solid transparent"
         },
         ".tgl-switch .tgl-slider": {
-            background: "none",
+            background: "none"
         },
         ".tgl-switch .tgl-slider::before": {
             content: "''",
@@ -25597,18 +25700,18 @@ const ArcwareStyles = {
             top: "0",
             bottom: "0",
             left: "0",
-            right: "0",
+            right: "0"
         },
         ".tgl-switch .tgl-slider::after": {
             height: "13px",
             width: "13px",
             borderRadius: "50%",
             top: "-2px",
-            left: "-1%",
+            left: "-1%"
         },
         ".tgl-flat:checked+.tgl-slider:after": {
             left: "62%",
-            background: "var(--color3)",
+            background: "var(--color3)"
         },
         ".form-control": {
             backgroundColor: "transparent",
@@ -25617,7 +25720,7 @@ const ArcwareStyles = {
             color: "var(--color13)",
             textAlign: "left",
             fontFamily: "inherit",
-            padding: "5px 15px ",
+            padding: "5px 15px "
         },
         ".btn-flat": {
             background: "var(--color3)",
@@ -25627,31 +25730,62 @@ const ArcwareStyles = {
             cursor: "pointer",
             borderRadius: "4px",
             textTransform: "uppercase",
-            minWidth: "175px",
+            minWidth: "175px"
         },
         ".btn-flat:disabled": {
             background: "var(--color7)",
             borderColor: "var(--color3)",
             color: "var(--color3)",
-            cursor: "default",
+            cursor: "default"
         },
         ".btn-flat:focus": {
-            outline: "none",
+            outline: "none"
         },
         ".arcware-logo-loader": {
             position: "relative",
-            display: "block",
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
             width: "12.5%",
             height: "12.5%",
+            margin: "0 auto",
+            boxSizing: "border-box"
+        },
+        // image rendering + centering inside the box
+        ".arcware-logo-loader img": {
+            maxWidth: "40%",
+            maxHeight: "40%",
+            objectFit: "contain",
+            objectPosition: "center center",
+            display: "block",
+            margin: 0,
+            verticalAlign: "middle"
+        },
+        // fade stays the same
+        ".arcware-logo-loader.pulse img": {
+            animation: "aw-loader-fade var(--aw-fade,1200ms) ease-in-out infinite alternate"
+        },
+        ".arcware-logo-loader.aw-custom-loader": {
+            width: "auto !important",
+            height: "auto !important"
+        },
+        ".arcware-logo-loader.aw-custom-loader img": {
+            display: "block",
+            width: "auto",
+            height: "auto",
+            maxWidth: "80%",
+            maxHeight: "80%",
+            objectFit: "contain",
+            margin: "0 auto" // ensure horizontal centering inside the loader
         },
         "#playOverlay img#playButton": {
-            width: "5%",
+            width: "5%"
         },
         "#disconnectOverlay, #errorOverlay": {
             textTransform: "initial",
             textAlign: "center",
             fontSize: "20px",
-            lineHeight: 2.5,
+            lineHeight: 2.5
         },
         "#disconnectOverlay .clickableState": {
             textTransform: "initial",
@@ -25661,13 +25795,13 @@ const ArcwareStyles = {
             fontSize: "18px",
             border: "1px solid #DAF693",
             margin: "25px auto 0",
-            width: "180px",
+            width: "180px"
         },
         "#afkOverlay": {
             background: "none",
             transition: "all ease-in-out 0.5s",
             opacity: 1,
-            pointerEvents: "initial",
+            pointerEvents: "initial"
         },
         "#afkOverlayInner": {
             textTransform: "initial",
@@ -25676,18 +25810,18 @@ const ArcwareStyles = {
             fontSize: "18px",
             width: "360px",
             textAlign: "center",
-            lineHeight: 2.5,
+            lineHeight: 2.5
         },
         "#afkOverlayInner center::first-line": {
             textTransform: "uppercase",
             color: "#FF8461",
             fontWeight: "bold",
-            fontSize: "24px",
+            fontSize: "24px"
         },
         "#afkOverlayInner #afkCountDownNumber": {
             color: "#DAF693",
             fontSize: "26px",
-            lineHeight: "22px",
+            lineHeight: "22px"
         },
         "#afkOverlayInner center .retry-button": {
             textTransform: "initial",
@@ -25697,7 +25831,7 @@ const ArcwareStyles = {
             fontSize: "18px",
             border: "1px solid #DAF693",
             margin: "25px auto 0",
-            width: "180px",
+            width: "180px"
         },
         "#connectOverlay #connectButton": {
             textTransform: "initial",
@@ -25707,33 +25841,33 @@ const ArcwareStyles = {
             fontSize: "18px",
             border: "1px solid #DAF693",
             margin: "25px auto 0",
-            width: "180px",
+            width: "180px"
         },
         "#connectOverlay .connection-text": {
             textTransform: "initial",
             textAlign: "center",
-            margin: "25px auto 0",
+            margin: "25px auto 0"
         },
         "#connectOverlay .connection-text .title": {
             color: "#ffffff",
             fontSize: "18px",
-            margin: "5px 0",
+            margin: "5px 0"
         },
         "#connectOverlay .connection-text .subtitle": {
             color: "#ffffff",
             opacity: 0.5,
             fontSize: "12px",
-            margin: "10px 0",
+            margin: "10px 0"
         },
         "#infoOverlay.hiddenState": {
-            display: "none",
+            display: "none"
         },
         "#disconnectOverlay, #playOverlay, #errorOverlay, #microphoneOverlay, #connectOverlay": {
             background: "#18181A",
             display: "flex",
             transition: "all ease-in-out 0.5s",
             opacity: 1,
-            pointerEvents: "initial",
+            pointerEvents: "initial"
         },
         "#microphoneOverlay": {
             textTransform: "initial",
@@ -25752,51 +25886,51 @@ const ArcwareStyles = {
             justifyContent: "center",
             alignItems: "center",
             flexDirection: "column",
-            zIndex: 99999,
+            zIndex: 99999
         },
         "#microphoneOverlay .title": {
             fontSize: "24px",
             position: "relative",
             marginBottom: "20px",
-            color: "#F0F0F2",
+            color: "#F0F0F2"
         },
         "#microphoneOverlay .title:after": {
             content: "''",
             display: "inline-block",
             animation: "dotty steps(1,end) 1s infinite",
-            position: "absolute",
+            position: "absolute"
         },
         "#microphoneOverlay p": {
             margin: 0,
-            color: "#858588",
+            color: "#858588"
         },
         "#microphoneOverlay svg": {
             height: "65px",
             marginBottom: "15px",
-            marginTop: "-5px",
+            marginTop: "-5px"
         },
         "#microphoneOverlay .svgIcon": {
-            fill: "#DAF693",
+            fill: "#DAF693"
         },
         "#disconnectOverlay.hiddenState, #playOverlay.hiddenState, #errorOverlay.hiddenState, #afkOverlay.hiddenState, #microphoneOverlay.hiddenState": {
             opacity: 0,
-            pointerEvents: "none",
+            pointerEvents: "none"
         },
         "#disconnectOverlay.mic-overlay-is-visible, #errorOverlay.mic-overlay-is-visible, #infoOverlay.mic-overlay-is-visible": {
             opacity: 0,
-            pointerEvents: "none",
+            pointerEvents: "none"
         },
         "#infoOverlay.hiddenState, #connectOverlay.hiddenState": {
-            display: "none",
+            display: "none"
         },
         "#connectOverlay": {
             display: "flex",
             flexDirection: "column-reverse",
             alignItems: "center",
-            justifyContent: "center",
+            justifyContent: "center"
         },
         "#infoOverlay": {
-            display: "none",
+            display: "none"
         },
         ".love-letters-box-root": {
             display: "flex",
@@ -25808,11 +25942,11 @@ const ArcwareStyles = {
             alignItems: "center",
             flexDirection: "column",
             background: "#18181A",
-            zIndex: 1,
+            zIndex: 1
         },
         ".love-letters-box-root.fade-out": {
             opacity: 0,
-            transition: "opacity 0.5s",
+            transition: "opacity 0.5s"
         },
         "#letters-block": {
             position: "absolute",
@@ -25829,7 +25963,7 @@ const ArcwareStyles = {
             alignItems: "center",
             fontSize: "16px",
             textTransform: "initial",
-            textAlign: "center",
+            textAlign: "center"
         },
         "#letters-wrapper": {
             height: "77px",
@@ -25840,62 +25974,88 @@ const ArcwareStyles = {
             alignItems: "center",
             justifyContent: "flex-end",
             marginTop: "10px",
-            paddingBottom: "2px",
+            paddingBottom: "2px"
         },
         "#letters-wrapper p": {
             textAlign: "center",
             lineHeight: 1.25,
-            fontSize: "16px",
+            fontSize: "16px"
         },
         ".letter-animation:nth-last-of-type(1)::after": {
             display: "inline-block",
             animation: "dotty steps(1,end) 1s infinite",
             content: "''",
-            position: "absolute",
+            position: "absolute"
         },
         ".letter-animation": {
             transition: "all 0.5s ease-in-out",
             transformOrigin: "bottom",
-            margin: "0 auto",
+            margin: "0 auto"
         },
         ".letter-animation-enter": {
-            animation: "fadeInUp 0.75s ease-out",
+            animation: "fadeInUp 0.75s ease-out"
         },
         ".letter-animation-exit": {
             opacity: 0,
             scale: 0.9,
             transition: "all ease-in-out 1s",
-            margin: 0,
+            margin: 0
         },
         "@keyframes dotty": {
             "0%": { content: "''" },
             "25%": { content: "'.'" },
             "50%": { content: "'..'" },
             "75%": { content: "'...'" },
-            "100%": { content: "''" },
+            "100%": { content: "''" }
         },
         "@keyframes fadeInUp": {
             from: {
                 opacity: 0,
                 transform: " translateY(5px)",
-                scale: 0.9,
+                scale: 0.9
             },
             to: {
                 opacity: 1,
                 transform: "translateY(0)",
-                scale: 1,
-            },
+                scale: 1
+            }
         },
         ".hidden": {
             display: "none",
-            opacity: 0,
+            opacity: 0
         },
         ".visible": {
             display: "block",
             opacity: 1,
-            transition: "opacity 1s ease-out",
+            transition: "opacity 1s ease-out"
         },
-    },
+        // Make the host a flex centering box
+        ".love-letters-box-root .arcware-logo-loader": {
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center"
+        },
+        // When a custom image is active, ignore the legacy 12.5% box
+        ".love-letters-box-root .arcware-logo-loader.aw-custom-loader": {
+            width: "auto !important",
+            height: "auto !important"
+        },
+        // Size & center the <img> itself (independent of host size)
+        ".love-letters-box-root .arcware-logo-loader.aw-custom-loader img": {
+            display: "block",
+            margin: "0 auto",
+            width: "min(40vmin, 40vw)",
+            height: "auto",
+            objectFit: "contain",
+            objectPosition: "center center"
+        },
+        // (optional) If you prefer the old “percentage of container” behavior:
+        ".love-letters-box-root .arcware-logo-loader.aw-custom-loader img.alt-40pct": {
+            width: "40%",
+            maxWidth: "100%",
+            height: "auto"
+        }
+    }
 };
 
 
@@ -25918,6 +26078,56 @@ class ArcwareLogoLoader {
         arcwareLogoLoader.innerHTML = this.getSvg();
         return arcwareLogoLoader;
     }
+    /** Call this once after you create the wrapper/root that contains the SVG */
+    setHostElement(el) {
+        this._hostEl = el;
+    }
+    /** Swap the loader image at runtime; pass undefined to go back to SVG */
+    setImage(url) {
+        var _a, _b;
+        if (!this._hostEl)
+            return;
+        // lazily create <img> once
+        if (!this._imgEl) {
+            const img = document.createElement("img");
+            img.alt = "Loading";
+            img.style.display = "none"; // hidden until we set a URL
+            this._hostEl.appendChild(img);
+            this._imgEl = img;
+        }
+        if (url && url.trim()) {
+            (_a = this._hostEl) === null || _a === void 0 ? void 0 : _a.classList.add("aw-custom-loader");
+            if (this._imgEl.src !== url)
+                this._imgEl.src = url;
+            // show <img>, hide SVG
+            this._imgEl.style.display = "";
+            const svg = this._hostEl.querySelector("svg");
+            if (svg)
+                svg.style.display = "none";
+        }
+        else {
+            // no url → fall back to SVG
+            (_b = this._hostEl) === null || _b === void 0 ? void 0 : _b.classList.remove("aw-custom-loader");
+            this._imgEl.style.display = "none";
+            const svg = this._hostEl.querySelector("svg");
+            if (svg)
+                svg.style.display = "";
+        }
+    }
+    /** Enable/disable pulsing fade in ms; 0 disables */
+    setFade(ms) {
+        if (!this._hostEl)
+            return;
+        const n = Number(ms) || 0;
+        if (n > 0) {
+            this._hostEl.style.setProperty("--aw-fade", `${n}ms`);
+            this._hostEl.classList.add("pulse"); // uses #aw-loader.pulse styles you added
+        }
+        else {
+            this._hostEl.classList.remove("pulse");
+            this._hostEl.style.removeProperty("--aw-fade");
+        }
+    }
     getSvg() {
         return `
       <svg width="42" height="80" viewBox="0 0 42 80" xmlns="http://www.w3.org/2000/svg">
@@ -26527,7 +26737,8 @@ class StopIcon {
 
 __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "Messages": () => (/* reexport safe */ _lib__WEBPACK_IMPORTED_MODULE_0__.Messages)
+/* harmony export */   "Messages": () => (/* reexport safe */ _lib__WEBPACK_IMPORTED_MODULE_0__.Messages),
+/* harmony export */   "ZWhiteLabel": () => (/* reexport safe */ _lib__WEBPACK_IMPORTED_MODULE_0__.ZWhiteLabel)
 /* harmony export */ });
 /* harmony import */ var _lib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(318);
 
@@ -27010,6 +27221,39 @@ const Send = {
 };
 
 
+/***/ }),
+
+/***/ 6750:
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "ZWhiteLabel": () => (/* binding */ ZWhiteLabel)
+/* harmony export */ });
+/* harmony import */ var zod__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(1604);
+
+/** Absolute HTTPS URL (no http) */
+const AbsoluteHttpsUrl = zod__WEBPACK_IMPORTED_MODULE_0__.z.string()
+    .url()
+    .refine((u) => u.startsWith("https://"), { message: "URL must use https://" });
+/** Relative path (no scheme like http:, data:, javascript:, etc.) */
+const RelativePath = zod__WEBPACK_IMPORTED_MODULE_0__.z.string()
+    .min(1)
+    .refine((s) => !/^[a-zA-Z][a-zA-Z0-9+.-]*:/.test(s), { message: "Expected a relative path without a URL scheme" });
+/** Image URL can be absolute (https) or relative (e.g. /assets/logo.png, ./img.png) */
+const ImageUrl = zod__WEBPACK_IMPORTED_MODULE_0__.z.union([AbsoluteHttpsUrl, RelativePath]);
+/** Strict allowlist for white-label brand fields coming from the URL */
+const ZWhiteLabel = zod__WEBPACK_IMPORTED_MODULE_0__.z.object({
+    loadingIconUrl: ImageUrl.optional(),
+    loadingIconFadeMs: zod__WEBPACK_IMPORTED_MODULE_0__.z.number().int().positive().optional(),
+    splashScreenUrl: ImageUrl.optional(),
+    splashScreenMode: zod__WEBPACK_IMPORTED_MODULE_0__.z["enum"](["contain", "cover", "stretch", "repeat"]).optional(),
+    splashScreenPosition: zod__WEBPACK_IMPORTED_MODULE_0__.z.string().optional(),
+    splashScreenBgColor: zod__WEBPACK_IMPORTED_MODULE_0__.z.string().optional()
+})
+    .strict();
+
+
 /***/ }),
 
 /***/ 318:
@@ -27017,9 +27261,12 @@ const Send = {
 
 __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "Messages": () => (/* reexport module object */ _Messages__WEBPACK_IMPORTED_MODULE_0__)
+/* harmony export */   "Messages": () => (/* reexport module object */ _Messages__WEBPACK_IMPORTED_MODULE_0__),
+/* harmony export */   "ZWhiteLabel": () => (/* reexport safe */ _Types_ZWhiteLabel__WEBPACK_IMPORTED_MODULE_1__.ZWhiteLabel)
 /* harmony export */ });
 /* harmony import */ var _Messages__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(5387);
+/* harmony import */ var _Types_ZWhiteLabel__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(6750);
+