@thestatic-tv/dcl-sdk 2.5.13 → 2.5.15

package/dist/index.d.mts

@@ -846,11 +846,16 @@ declare class AdminPanelUIModule {
     private TabBtn;
     private VideoTab;
     private ModTab;
+    /**
+     * Render a scaled notification banner
+     * Uses same layout as NotificationBanner but with scaled font size
+     */
+    private renderScaledNotification;
     /**
      * Get the React-ECS component for the admin panel
-     * Always renders NotificationBanner (for broadcasts), admin panel only for admins
+     * Always renders notification (scaled), admin panel only for admins
      */
-    getComponent: () => ReactEcs.JSX.Element;
+    getComponent: () => ReactEcs.JSX.Element | null;
 }
 
 /**

package/dist/index.d.ts

@@ -846,11 +846,16 @@ declare class AdminPanelUIModule {
     private TabBtn;
     private VideoTab;
     private ModTab;
+    /**
+     * Render a scaled notification banner
+     * Uses same layout as NotificationBanner but with scaled font size
+     */
+    private renderScaledNotification;
     /**
      * Get the React-ECS component for the admin panel
-     * Always renders NotificationBanner (for broadcasts), admin panel only for admins
+     * Always renders notification (scaled), admin panel only for admins
      */
-    getComponent: () => ReactEcs.JSX.Element;
+    getComponent: () => ReactEcs.JSX.Element | null;
 }
 
 /**

package/dist/index.js

@@ -673,8 +673,8 @@ var UI_DIMENSIONS = {
   // Notification banner - centered, aligned with toggle buttons
   notification: {
     width: 340,
-    height: 36,
-    // Same as toggle buttons
+    height: 45,
+    // Same as toggle buttons (45)
     bottom: 10,
     // Same as toggle buttons
     borderWidth: 2,
@@ -2330,6 +2330,9 @@ function showNotification(message, durationMs = 5e3) {
 function hideNotification() {
   notificationVisible = false;
 }
+function getNotificationState() {
+  return { text: notificationText, visible: notificationVisible };
+}
 function initNotificationSystem() {
   if (notificationInitialized) return;
   notificationInitialized = true;
@@ -2880,11 +2883,11 @@ var AdminPanelUIModule = class {
     };
     /**
      * Get the React-ECS component for the admin panel
-     * Always renders NotificationBanner (for broadcasts), admin panel only for admins
+     * Always renders notification (scaled), admin panel only for admins
      */
     this.getComponent = () => {
       if (!this.isAdmin) {
-        return /* @__PURE__ */ import_react_ecs5.default.createElement(NotificationBanner, null);
+        return this.renderScaledNotification();
       }
       const t = this.theme;
       const tabs = [];
@@ -2909,7 +2912,7 @@ var AdminPanelUIModule = class {
             positionType: "absolute"
           }
         },
-        /* @__PURE__ */ import_react_ecs5.default.createElement(NotificationBanner, null),
+        this.renderScaledNotification(),
         /* @__PURE__ */ import_react_ecs5.default.createElement(
           import_react_ecs5.UiEntity,
           {
@@ -3644,6 +3647,76 @@ var AdminPanelUIModule = class {
       this.stopStreamPolling();
     }
   }
+  /**
+   * Render a scaled notification banner
+   * Uses same layout as NotificationBanner but with scaled font size
+   */
+  renderScaledNotification() {
+    initNotificationSystem();
+    const state = getNotificationState();
+    if (!state.visible) return null;
+    const N2 = UI_DIMENSIONS.notification;
+    const colors = THEME.colors;
+    return /* @__PURE__ */ import_react_ecs5.default.createElement(
+      import_react_ecs5.UiEntity,
+      {
+        uiTransform: {
+          positionType: "absolute",
+          position: { bottom: N2.bottom, left: 0, right: 0 },
+          height: this.s(N2.height),
+          justifyContent: "center",
+          alignItems: "center"
+        }
+      },
+      /* @__PURE__ */ import_react_ecs5.default.createElement(
+        import_react_ecs5.UiEntity,
+        {
+          uiTransform: {
+            width: this.s(N2.width),
+            height: this.s(N2.height),
+            flexDirection: "row",
+            alignItems: "center"
+          },
+          uiBackground: { color: colors.panel }
+        },
+        /* @__PURE__ */ import_react_ecs5.default.createElement(
+          import_react_ecs5.UiEntity,
+          {
+            uiTransform: { width: N2.borderWidth, height: "100%" },
+            uiBackground: { color: colors.cyan }
+          }
+        ),
+        /* @__PURE__ */ import_react_ecs5.default.createElement(
+          import_react_ecs5.UiEntity,
+          {
+            uiTransform: {
+              flexGrow: 1,
+              height: "100%",
+              padding: { left: 10, right: 10 },
+              justifyContent: "center",
+              alignItems: "flex-start"
+            }
+          },
+          /* @__PURE__ */ import_react_ecs5.default.createElement(
+            import_react_ecs5.Label,
+            {
+              value: state.text,
+              fontSize: this.s(N2.fontSize),
+              color: colors.white,
+              textAlign: "middle-left"
+            }
+          )
+        ),
+        /* @__PURE__ */ import_react_ecs5.default.createElement(
+          import_react_ecs5.UiEntity,
+          {
+            uiTransform: { width: 5, height: 5, margin: { right: 10 } },
+            uiBackground: { color: colors.cyan }
+          }
+        )
+      )
+    );
+  }
 };
 
 // src/StaticTVClient.ts

package/dist/index.mjs

@@ -628,8 +628,8 @@ var UI_DIMENSIONS = {
   // Notification banner - centered, aligned with toggle buttons
   notification: {
     width: 340,
-    height: 36,
-    // Same as toggle buttons
+    height: 45,
+    // Same as toggle buttons (45)
     bottom: 10,
     // Same as toggle buttons
     borderWidth: 2,
@@ -2285,6 +2285,9 @@ function showNotification(message, durationMs = 5e3) {
 function hideNotification() {
   notificationVisible = false;
 }
+function getNotificationState() {
+  return { text: notificationText, visible: notificationVisible };
+}
 function initNotificationSystem() {
   if (notificationInitialized) return;
   notificationInitialized = true;
@@ -2835,11 +2838,11 @@ var AdminPanelUIModule = class {
     };
     /**
      * Get the React-ECS component for the admin panel
-     * Always renders NotificationBanner (for broadcasts), admin panel only for admins
+     * Always renders notification (scaled), admin panel only for admins
      */
     this.getComponent = () => {
       if (!this.isAdmin) {
-        return /* @__PURE__ */ ReactEcs5.createElement(NotificationBanner, null);
+        return this.renderScaledNotification();
       }
       const t = this.theme;
       const tabs = [];
@@ -2864,7 +2867,7 @@ var AdminPanelUIModule = class {
             positionType: "absolute"
           }
         },
-        /* @__PURE__ */ ReactEcs5.createElement(NotificationBanner, null),
+        this.renderScaledNotification(),
         /* @__PURE__ */ ReactEcs5.createElement(
           UiEntity5,
           {
@@ -3599,6 +3602,76 @@ var AdminPanelUIModule = class {
       this.stopStreamPolling();
     }
   }
+  /**
+   * Render a scaled notification banner
+   * Uses same layout as NotificationBanner but with scaled font size
+   */
+  renderScaledNotification() {
+    initNotificationSystem();
+    const state = getNotificationState();
+    if (!state.visible) return null;
+    const N2 = UI_DIMENSIONS.notification;
+    const colors = THEME.colors;
+    return /* @__PURE__ */ ReactEcs5.createElement(
+      UiEntity5,
+      {
+        uiTransform: {
+          positionType: "absolute",
+          position: { bottom: N2.bottom, left: 0, right: 0 },
+          height: this.s(N2.height),
+          justifyContent: "center",
+          alignItems: "center"
+        }
+      },
+      /* @__PURE__ */ ReactEcs5.createElement(
+        UiEntity5,
+        {
+          uiTransform: {
+            width: this.s(N2.width),
+            height: this.s(N2.height),
+            flexDirection: "row",
+            alignItems: "center"
+          },
+          uiBackground: { color: colors.panel }
+        },
+        /* @__PURE__ */ ReactEcs5.createElement(
+          UiEntity5,
+          {
+            uiTransform: { width: N2.borderWidth, height: "100%" },
+            uiBackground: { color: colors.cyan }
+          }
+        ),
+        /* @__PURE__ */ ReactEcs5.createElement(
+          UiEntity5,
+          {
+            uiTransform: {
+              flexGrow: 1,
+              height: "100%",
+              padding: { left: 10, right: 10 },
+              justifyContent: "center",
+              alignItems: "flex-start"
+            }
+          },
+          /* @__PURE__ */ ReactEcs5.createElement(
+            Label5,
+            {
+              value: state.text,
+              fontSize: this.s(N2.fontSize),
+              color: colors.white,
+              textAlign: "middle-left"
+            }
+          )
+        ),
+        /* @__PURE__ */ ReactEcs5.createElement(
+          UiEntity5,
+          {
+            uiTransform: { width: 5, height: 5, margin: { right: 10 } },
+            uiBackground: { color: colors.cyan }
+          }
+        )
+      )
+    );
+  }
 };
 
 // src/StaticTVClient.ts

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thestatic-tv/dcl-sdk",
-  "version": "2.5.13",
+  "version": "2.5.15",
   "description": "Connect your Decentraland scene to thestatic.tv - full channel lineup, metrics tracking, and interactions",
   "main": "dist/index.js",
   "module": "dist/index.mjs",