stream-engine-widgets 0.3.33 → 0.3.34

package/dist/{gallery-D6dayS__.js → gallery-B8UKIAh-.js}

@@ -1,5 +1,5 @@
-import { i as importShared, j as jsxRuntimeExports, P as Player } from './index-BZYcjDkf.js';
-import { u as useMediaQuery, G as GalleryItem } from './useMediaQuery-DSkV9wEO.js';
+import { i as importShared, j as jsxRuntimeExports, P as Player } from './index-dH4vuIYq.js';
+import { u as useMediaQuery, G as GalleryItem } from './useMediaQuery-BQBMrtrJ.js';
 
 const {useState,useEffect,useRef} = await importShared('react');
 const Gallery = ({ data, apiUrl }) => {
@@ -49,4 +49,4 @@ const Gallery = ({ data, apiUrl }) => {
 };
 
 export { Gallery as default };
-//# sourceMappingURL=gallery-D6dayS__.js.map
+//# sourceMappingURL=gallery-B8UKIAh-.js.map

package/dist/{gallery-D6dayS__.js.map → gallery-B8UKIAh-.js.map}

@@ -1 +1 @@
-{"version":3,"file":"gallery-D6dayS__.js","sources":["../src/widgets/gallery/gallery.jsx"],"sourcesContent":["import { useState, useEffect, useRef } from \"react\";\nimport GalleryItem from \"../../components/galleryItem\";\nimport Player from \"../../player/player-static\";\nimport { useMediaQuery } from \"../../utils/useMediaQuery\";\n\n\nconst Gallery = ({ data, apiUrl }) => {\n  const [error, setError] = useState(\"\");\n  const [playerOpen, setPlayerOpen] = useState(false);\n  const [itemData, setItemData] = useState({});\n\n  const gridSize = useMediaQuery({\n    default:data.settings.itemsPerRow.s,\n    md:data.settings.itemsPerRow.md,\n    lg:data.settings.itemsPerRow.lg,\n    xl:data.settings.itemsPerRow.xl,\n    xxl:data.settings.itemsPerRow.xxl,\n  });\n\n  const openPlayer = (item) => {\n    setItemData(item);\n    setPlayerOpen(true);\n  };\n\n  const closePlayer = () => {\n    setPlayerOpen(false);\n  };\n\n if (error) {\n    return (\n      <div className=\"w-full h-full flex justify-center items-center\">\n        <div className=\"bg-black/90 p-5 rounded-md\">\n          <span className=\"text-white\">{error}</span>\n        </div>\n      </div>\n    );\n  } else {\n    return (\n      <div id={`widget-${data.id}`} className=\"w-full relative select-none\">\n        <div className=\"vf-grid grid h-full w-full grid-cols-1\" style={{\n          gridTemplateColumns : `repeat(${gridSize}, minmax(0, 1fr))`,\n          gridGap : `${data.settings.gap}px`\n        }}\n        >\n          {data.content.map((item) => (\n            <GalleryItem\n              key={item.id}\n              item={item}\n              settings = {data.settings}\n              onClick={openPlayer}\n            ></GalleryItem>\n          ))}\n        </div>\n        {playerOpen && <Player onClose={closePlayer} item={itemData} widgetToken={data.id} settings={data.settings} apiUrl={apiUrl}/>}\n      </div>\n    );\n  }\n};\n\nexport default Gallery;\n"],"names":["jsx","jsxs"],"mappings":";;;AAAA,MAAA,CAAA,QAAA,CAAA,SAAA,CAAA,MAAA,CAAA,GAAA,MAAA,YAAA,CAAA,OAAA,CAAA;AAMA,MAAM,OAAA,GAAU,CAAC,EAAE,IAAA,EAAM,QAAO,KAAM;AACpC,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAI,SAAS,EAAE,CAAA;AACrC,EAAA,MAAM,CAAC,UAAA,EAAY,aAAa,CAAA,GAAI,SAAS,KAAK,CAAA;AAClD,EAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAI,QAAA,CAAS,EAAE,CAAA;AAE3C,EAAA,MAAM,WAAW,aAAA,CAAc;AAAA,IAC7B,OAAA,EAAQ,IAAA,CAAK,QAAA,CAAS,WAAA,CAAY,CAAA;AAAA,IAClC,EAAA,EAAG,IAAA,CAAK,QAAA,CAAS,WAAA,CAAY,EAAA;AAAA,IAC7B,EAAA,EAAG,IAAA,CAAK,QAAA,CAAS,WAAA,CAAY,EAAA;AAAA,IAC7B,EAAA,EAAG,IAAA,CAAK,QAAA,CAAS,WAAA,CAAY,EAAA;AAAA,IAC7B,GAAA,EAAI,IAAA,CAAK,QAAA,CAAS,WAAA,CAAY;AAAA,GAC/B,CAAA;AAED,EAAA,MAAM,UAAA,GAAa,CAAC,IAAA,KAAS;AAC3B,IAAA,WAAA,CAAY,IAAI,CAAA;AAChB,IAAA,aAAA,CAAc,IAAI,CAAA;AAAA,EACpB,CAAA;AAEA,EAAA,MAAM,cAAc,MAAM;AACxB,IAAA,aAAA,CAAc,KAAK,CAAA;AAAA,EACrB,CAAA;AAED,EAAA,IAAI,KAAA,EAAO;AACR,IAAA,uBACEA,qBAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,gDAAA,EACb,gDAAC,KAAA,EAAA,EAAI,SAAA,EAAU,4BAAA,EACb,QAAA,kBAAAA,qBAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,YAAA,EAAc,QAAA,EAAA,KAAA,EAAM,GACtC,CAAA,EACF,CAAA;AAAA,EAEJ,CAAA,MAAO;AACL,IAAA,uBACEC,sBAAA,CAAC,SAAI,EAAA,EAAI,CAAA,OAAA,EAAU,KAAK,EAAE,CAAA,CAAA,EAAI,WAAU,6BAAA,EACtC,QAAA,EAAA;AAAA,sBAAAD,qBAAA;AAAA,QAAC,KAAA;AAAA,QAAA;AAAA,UAAI,SAAA,EAAU,wCAAA;AAAA,UAAyC,KAAA,EAAO;AAAA,YAC7D,mBAAA,EAAsB,UAAU,QAAQ,CAAA,iBAAA,CAAA;AAAA,YACxC,OAAA,EAAU,CAAA,EAAG,IAAA,CAAK,QAAA,CAAS,GAAG,CAAA,EAAA;AAAA,WAChC;AAAA,UAEG,QAAA,EAAA,IAAA,CAAK,OAAA,CAAQ,GAAA,CAAI,CAAC,IAAA,qBACjBA,qBAAA;AAAA,YAAC,WAAA;AAAA,YAAA;AAAA,cAEC,IAAA;AAAA,cACA,UAAY,IAAA,CAAK,QAAA;AAAA,cACjB,OAAA,EAAS;AAAA,aAAA;AAAA,YAHJ,IAAA,CAAK;AAAA,WAKb;AAAA;AAAA,OACH;AAAA,MACC,UAAA,oBAAcA,qBAAA,CAAC,MAAA,EAAA,EAAO,OAAA,EAAS,WAAA,EAAa,IAAA,EAAM,QAAA,EAAU,WAAA,EAAa,IAAA,CAAK,EAAA,EAAI,QAAA,EAAU,IAAA,CAAK,UAAU,MAAA,EAAe;AAAA,KAAA,EAC7H,CAAA;AAAA,EAEJ;AACF;;;;"}
+{"version":3,"file":"gallery-B8UKIAh-.js","sources":["../src/widgets/gallery/gallery.jsx"],"sourcesContent":["import { useState, useEffect, useRef } from \"react\";\nimport GalleryItem from \"../../components/galleryItem\";\nimport Player from \"../../player/player-static\";\nimport { useMediaQuery } from \"../../utils/useMediaQuery\";\n\n\nconst Gallery = ({ data, apiUrl }) => {\n  const [error, setError] = useState(\"\");\n  const [playerOpen, setPlayerOpen] = useState(false);\n  const [itemData, setItemData] = useState({});\n\n  const gridSize = useMediaQuery({\n    default:data.settings.itemsPerRow.s,\n    md:data.settings.itemsPerRow.md,\n    lg:data.settings.itemsPerRow.lg,\n    xl:data.settings.itemsPerRow.xl,\n    xxl:data.settings.itemsPerRow.xxl,\n  });\n\n  const openPlayer = (item) => {\n    setItemData(item);\n    setPlayerOpen(true);\n  };\n\n  const closePlayer = () => {\n    setPlayerOpen(false);\n  };\n\n if (error) {\n    return (\n      <div className=\"w-full h-full flex justify-center items-center\">\n        <div className=\"bg-black/90 p-5 rounded-md\">\n          <span className=\"text-white\">{error}</span>\n        </div>\n      </div>\n    );\n  } else {\n    return (\n      <div id={`widget-${data.id}`} className=\"w-full relative select-none\">\n        <div className=\"vf-grid grid h-full w-full grid-cols-1\" style={{\n          gridTemplateColumns : `repeat(${gridSize}, minmax(0, 1fr))`,\n          gridGap : `${data.settings.gap}px`\n        }}\n        >\n          {data.content.map((item) => (\n            <GalleryItem\n              key={item.id}\n              item={item}\n              settings = {data.settings}\n              onClick={openPlayer}\n            ></GalleryItem>\n          ))}\n        </div>\n        {playerOpen && <Player onClose={closePlayer} item={itemData} widgetToken={data.id} settings={data.settings} apiUrl={apiUrl}/>}\n      </div>\n    );\n  }\n};\n\nexport default Gallery;\n"],"names":["jsx","jsxs"],"mappings":";;;AAAA,MAAA,CAAA,QAAA,CAAA,SAAA,CAAA,MAAA,CAAA,GAAA,MAAA,YAAA,CAAA,OAAA,CAAA;AAMA,MAAM,OAAA,GAAU,CAAC,EAAE,IAAA,EAAM,QAAO,KAAM;AACpC,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAI,SAAS,EAAE,CAAA;AACrC,EAAA,MAAM,CAAC,UAAA,EAAY,aAAa,CAAA,GAAI,SAAS,KAAK,CAAA;AAClD,EAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAI,QAAA,CAAS,EAAE,CAAA;AAE3C,EAAA,MAAM,WAAW,aAAA,CAAc;AAAA,IAC7B,OAAA,EAAQ,IAAA,CAAK,QAAA,CAAS,WAAA,CAAY,CAAA;AAAA,IAClC,EAAA,EAAG,IAAA,CAAK,QAAA,CAAS,WAAA,CAAY,EAAA;AAAA,IAC7B,EAAA,EAAG,IAAA,CAAK,QAAA,CAAS,WAAA,CAAY,EAAA;AAAA,IAC7B,EAAA,EAAG,IAAA,CAAK,QAAA,CAAS,WAAA,CAAY,EAAA;AAAA,IAC7B,GAAA,EAAI,IAAA,CAAK,QAAA,CAAS,WAAA,CAAY;AAAA,GAC/B,CAAA;AAED,EAAA,MAAM,UAAA,GAAa,CAAC,IAAA,KAAS;AAC3B,IAAA,WAAA,CAAY,IAAI,CAAA;AAChB,IAAA,aAAA,CAAc,IAAI,CAAA;AAAA,EACpB,CAAA;AAEA,EAAA,MAAM,cAAc,MAAM;AACxB,IAAA,aAAA,CAAc,KAAK,CAAA;AAAA,EACrB,CAAA;AAED,EAAA,IAAI,KAAA,EAAO;AACR,IAAA,uBACEA,qBAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,gDAAA,EACb,gDAAC,KAAA,EAAA,EAAI,SAAA,EAAU,4BAAA,EACb,QAAA,kBAAAA,qBAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,YAAA,EAAc,QAAA,EAAA,KAAA,EAAM,GACtC,CAAA,EACF,CAAA;AAAA,EAEJ,CAAA,MAAO;AACL,IAAA,uBACEC,sBAAA,CAAC,SAAI,EAAA,EAAI,CAAA,OAAA,EAAU,KAAK,EAAE,CAAA,CAAA,EAAI,WAAU,6BAAA,EACtC,QAAA,EAAA;AAAA,sBAAAD,qBAAA;AAAA,QAAC,KAAA;AAAA,QAAA;AAAA,UAAI,SAAA,EAAU,wCAAA;AAAA,UAAyC,KAAA,EAAO;AAAA,YAC7D,mBAAA,EAAsB,UAAU,QAAQ,CAAA,iBAAA,CAAA;AAAA,YACxC,OAAA,EAAU,CAAA,EAAG,IAAA,CAAK,QAAA,CAAS,GAAG,CAAA,EAAA;AAAA,WAChC;AAAA,UAEG,QAAA,EAAA,IAAA,CAAK,OAAA,CAAQ,GAAA,CAAI,CAAC,IAAA,qBACjBA,qBAAA;AAAA,YAAC,WAAA;AAAA,YAAA;AAAA,cAEC,IAAA;AAAA,cACA,UAAY,IAAA,CAAK,QAAA;AAAA,cACjB,OAAA,EAAS;AAAA,aAAA;AAAA,YAHJ,IAAA,CAAK;AAAA,WAKb;AAAA;AAAA,OACH;AAAA,MACC,UAAA,oBAAcA,qBAAA,CAAC,MAAA,EAAA,EAAO,OAAA,EAAS,WAAA,EAAa,IAAA,EAAM,QAAA,EAAU,WAAA,EAAa,IAAA,CAAK,EAAA,EAAI,QAAA,EAAU,IAAA,CAAK,UAAU,MAAA,EAAe;AAAA,KAAA,EAC7H,CAAA;AAAA,EAEJ;AACF;;;;"}

package/dist/{index-BZYcjDkf.js → index-dH4vuIYq.js}

@@ -72790,8 +72790,9 @@ const SECTION_COMPONENTS = {
   scroll: SectionScroll,
   default: SectionGrid
 };
-const Widget = ({ token, apiurl, viewercountry, requireauth, labels, searchtext, orderby }) => {
+const Widget = ({ token, apiurl, viewercountry, requireauth, labels, searchtext, orderby, refreshkey }) => {
   const widgetRef = useRef(null);
+  const styleElementRef = useRef(null);
   const [widgetState, setWidgetState] = useState$1({
     data: {},
     untransformedData: {},
@@ -72881,22 +72882,14 @@ const Widget = ({ token, apiurl, viewercountry, requireauth, labels, searchtext,
       eventHandlers
     };
   }, [apiUrl, eventHandlers]);
-  const applyStyle = (css) => {
-    if (!css) return;
-    const style = document.createElement("style");
-    style.type = "text/css";
-    style.appendChild(document.createTextNode(css));
-    document.head.appendChild(style);
-    return () => style.remove();
-  };
   const getComponent = (type2, layout) => {
     if (type2 === VIDEO_SECTION_TYPE) {
       return SECTION_COMPONENTS[layout] || SECTION_COMPONENTS.default;
     }
     if (type2 === BLAZE_WIDGET_TYPE) {
-      return lazy$1(() => import('./blaze-DmKexmmO.js'));
+      return lazy$1(() => import('./blaze-U-0WyijO.js'));
     }
-    return lazy$1(() => __variableDynamicImportRuntimeHelper((/* #__PURE__ */ Object.assign({"./widgets/gallery/gallery.jsx": () => import('./gallery-D6dayS__.js'),"./widgets/matches/matches.jsx": () => import('./matches-DbC7jwEC.js'),"./widgets/matchesStandalone/matchesStandalone.jsx": () => import('./matchesStandalone-BwWxYhoA.js'),"./widgets/player/player.jsx": () => import('./player-B8OuREgJ.js'),"./widgets/poster/poster.jsx": () => import('./poster-Cl39MgVf.js'),"./widgets/poster/posterItem.jsx": () => import('./posterItem-6pxKS7Oa.js'),"./widgets/scroll/scroll.jsx": () => import('./scroll-BzUJV-3k.js'),"./widgets/story/story.jsx": () => import('./story-BSzjqvBz.js')})), `./widgets/${type2}/${type2}.jsx`, 4));
+    return lazy$1(() => __variableDynamicImportRuntimeHelper((/* #__PURE__ */ Object.assign({"./widgets/gallery/gallery.jsx": () => import('./gallery-B8UKIAh-.js'),"./widgets/matches/matches.jsx": () => import('./matches-BvR4UouE.js'),"./widgets/matchesStandalone/matchesStandalone.jsx": () => import('./matchesStandalone-DWB0A4tW.js'),"./widgets/player/player.jsx": () => import('./player-CB5PGe6F.js'),"./widgets/poster/poster.jsx": () => import('./poster-CBkHfxaF.js'),"./widgets/poster/posterItem.jsx": () => import('./posterItem-BdwxBTeJ.js'),"./widgets/scroll/scroll.jsx": () => import('./scroll-DAy_hwO7.js'),"./widgets/story/story.jsx": () => import('./story-1UZw7p_f.js')})), `./widgets/${type2}/${type2}.jsx`, 4));
   };
   useEffect$1(() => {
     const fetchWidgetConfig = async () => {
@@ -72910,7 +72903,14 @@ const Widget = ({ token, apiurl, viewercountry, requireauth, labels, searchtext,
         const transformedData = widgetDataToSectionData(resData);
         const component = getComponent(resData.type, resData.settings?.layout);
         if (resData.style && resData.type !== VIDEO_SECTION_TYPE) {
-          applyStyle(resData.style);
+          if (styleElementRef.current) {
+            styleElementRef.current.remove();
+          }
+          const styleEl = document.createElement("style");
+          styleEl.type = "text/css";
+          styleEl.appendChild(document.createTextNode(resData.style));
+          document.head.appendChild(styleEl);
+          styleElementRef.current = styleEl;
         }
         setWidgetState({
           data: transformedData,
@@ -72930,7 +72930,13 @@ const Widget = ({ token, apiurl, viewercountry, requireauth, labels, searchtext,
       }
     };
     fetchWidgetConfig();
-  }, [token, apiUrl, eventHandlers, widgetDataToSectionData]);
+    return () => {
+      if (styleElementRef.current) {
+        styleElementRef.current.remove();
+        styleElementRef.current = null;
+      }
+    };
+  }, [token, apiUrl, eventHandlers, widgetDataToSectionData, refreshkey]);
   const { data, loading, error, Component, type } = widgetState;
   if (error) return null;
   return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { ref: widgetRef, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Suspense$1, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx(Loader, {}), children: Component && (type === VIDEO_SECTION_TYPE ? /* @__PURE__ */ jsxRuntimeExports.jsxs(WidgetI18nProvider, { children: [
@@ -73008,6 +73014,8 @@ const React = await importShared('react');
  *                                Example: 'football highlights'
  * @property {string} orderby - Sort order parameter from search page (e.g., '-start_time', 'start_time')
  *                             Maps to Blaze SDK OrderType in the widget implementation
+ * @property {string} refreshkey - Internal counter incremented by VfWidgetElement.refresh() to trigger
+ *                                  a live data re-fetch without remounting the element or losing event listeners
  */
 Widget.propTypes = {
   token          : PropTypes.string,
@@ -73017,6 +73025,7 @@ Widget.propTypes = {
   labels         : PropTypes.string,
   searchtext     : PropTypes.string,
   orderby        : PropTypes.string,
+  refreshkey     : PropTypes.string,
 };
 
 ChannelWidget.propTypes = {
@@ -73031,7 +73040,7 @@ ChannelWidget.propTypes = {
  */
 class VfWidgetElement extends HTMLElement {
   static get observedAttributes() {
-    return ['token', 'apiurl', 'viewercountry', 'requireauth', 'labels', 'searchtext', 'orderby'];
+    return ['token', 'apiurl', 'viewercountry', 'requireauth', 'labels', 'searchtext', 'orderby', 'refreshkey'];
   }
 
   constructor() {
@@ -73039,6 +73048,18 @@ class VfWidgetElement extends HTMLElement {
     this._root = null;
     this._isMounted = false;
     this._isUpdating = false;
+    this._refreshCounter = 0;
+  }
+
+  /**
+   * Imperatively trigger a data refresh inside the widget.
+   * Increments an internal counter and sets it as the `refreshkey` attribute,
+   * which causes attributeChangedCallback → _render() → Widget re-fetches its data.
+   * The DOM element and all attached event listeners are preserved.
+   */
+  refresh() {
+    this._refreshCounter += 1;
+    this.setAttribute('refreshkey', String(this._refreshCounter));
   }
 
   /**
@@ -73113,6 +73134,7 @@ class VfWidgetElement extends HTMLElement {
         labels: this.getAttribute('labels'),
         searchtext: this.getAttribute('searchtext'),
         orderby: this.getAttribute('orderby'),
+        refreshkey: this.getAttribute('refreshkey'),
       };
 
       // Render the React component with current props
@@ -73137,4 +73159,4 @@ customElements.define("vf-widget", VfWidgetElement);
 customElements.define("vfc-widget", S(ChannelWidget, React, ReactDOM));
 
 export { API_URL as A, CloseRounded as C, Loader as L, Player as P, SpinLoader as S, Thumbnail as T, _setPrototypeOf as _, axios$1 as a, _assertThisInitialized as b, createSvgIcon as c, _extends as d, _getPrototypeOf as e, _inherits as f, importShared as i, jsxRuntimeExports as j, require$$1$1 as r };
-//# sourceMappingURL=index-BZYcjDkf.js.map
+//# sourceMappingURL=index-dH4vuIYq.js.map