@builder.io/sdk-react 3.0.6 → 4.0.0

package/lib/edge/{server-entry-61fca4f7.js → server-entry-c1673af2.js}

@@ -47,7 +47,7 @@ const I = "[Builder.io]: ", f = {
   } catch (s) {
     f.warn("[COOKIE] SET error: ", (s == null ? void 0 : s.message) || s);
   }
-}, B = "builder.userAttributes";
+}, R = "builder.userAttributes";
 function ut() {
   let t = !0;
   const e = /* @__PURE__ */ new Set();
@@ -60,14 +60,14 @@ function ut() {
         ...n
       };
       P({
-        name: B,
+        name: R,
         value: JSON.stringify(r),
         canTrack: t
       }), e.forEach((s) => s(r));
     },
     getUserAttributes() {
       return c() ? JSON.parse(O({
-        name: B,
+        name: R,
         canTrack: t
       }) || "{}") : {};
     },
@@ -129,24 +129,24 @@ function gt(t, e) {
     }
   }
 }
-const V = {};
+const N = {};
 function se(t) {
   if (c()) {
-    Object.assign(V, t);
+    Object.assign(N, t);
     const e = {
       type: "builder.settingsChange",
-      data: V
+      data: N
     };
     parent.postMessage(e, "*");
   }
 }
-const N = "builder.", pt = "options.", $ = (t) => {
+const V = "builder.", pt = "options.", $ = (t) => {
   if (!t)
     return {};
   const e = j(t), n = {};
   return Object.keys(e).forEach((r) => {
-    if (r.startsWith(N)) {
-      const s = r.replace(N, "").replace(pt, "");
+    if (r.startsWith(V)) {
+      const s = r.replace(V, "").replace(pt, "");
       n[s] = e[r];
     }
   }), n;
@@ -155,7 +155,7 @@ const N = "builder.", pt = "options.", $ = (t) => {
     return {};
   const t = new URLSearchParams(window.location.search);
   return $(t);
-}, G = "3.0.6", J = () => ({
+}, G = "4.0.0", J = () => ({
   "X-Builder-SDK": v,
   "X-Builder-SDK-GEN": "2",
   "X-Builder-SDK-Version": G
@@ -166,16 +166,16 @@ function yt() {
     return (t == "x" ? e : e & 3 | 8).toString(16);
   });
 }
-function z() {
+function X() {
   return yt().replace(/-/g, "");
 }
-const H = "builderSessionId", bt = async ({
+const z = "builderSessionId", bt = async ({
   canTrack: t
 }) => {
   if (!t)
     return;
   const e = await M({
-    name: H,
+    name: z,
     canTrack: t
   });
   if (y(e))
@@ -187,20 +187,20 @@ const H = "builderSessionId", bt = async ({
       canTrack: t
     }), n;
   }
-}, St = () => z(), wt = ({
+}, St = () => X(), wt = ({
   id: t,
   canTrack: e
 }) => P({
-  name: H,
+  name: z,
   value: t,
   canTrack: e
-}), X = () => c() && typeof localStorage != "undefined" ? localStorage : void 0, vt = ({
+}), H = () => c() && typeof localStorage != "undefined" ? localStorage : void 0, vt = ({
   key: t,
   canTrack: e
 }) => {
   var n;
   try {
-    return e ? (n = X()) == null ? void 0 : n.getItem(t) : void 0;
+    return e ? (n = H()) == null ? void 0 : n.getItem(t) : void 0;
   } catch (r) {
     console.debug("[LocalStorage] GET error: ", r);
     return;
@@ -212,7 +212,7 @@ const H = "builderSessionId", bt = async ({
 }) => {
   var r;
   try {
-    e && ((r = X()) == null || r.setItem(t, n));
+    e && ((r = H()) == null || r.setItem(t, n));
   } catch (s) {
     console.debug("[LocalStorage] SET error: ", s);
   }
@@ -234,7 +234,7 @@ const H = "builderSessionId", bt = async ({
       canTrack: t
     }), n;
   }
-}, At = () => z(), Et = ({
+}, At = () => X(), Et = ({
   id: t,
   canTrack: e
 }) => It({
@@ -316,7 +316,7 @@ const Pt = () => {
     ownerId: n
   }
 });
-async function Rt({
+async function Bt({
   apiHost: t,
   ...e
 }) {
@@ -341,15 +341,15 @@ async function Rt({
     console.error("Failed to track: ", s);
   });
 }
-const oe = (t) => Rt({
+const oe = (t) => Bt({
   ...t,
   canTrack: !0
-}), Bt = ["*.beta.builder.io", "beta.builder.io", "builder.io", "localhost", "qa.builder.io"];
+}), Rt = ["*.beta.builder.io", "beta.builder.io", "builder.io", "localhost", "qa.builder.io"];
 function Y(t, e) {
   if (!e.origin.startsWith("http") && !e.origin.startsWith("https"))
     return !1;
   const n = new URL(e.origin), r = n.hostname;
-  return (t || Bt).findIndex((s) => s.startsWith("*.") ? r.endsWith(s.slice(1)) : s === r) > -1;
+  return (t || Rt).findIndex((s) => s.startsWith("*.") ? r.endsWith(s.slice(1)) : s === r) > -1;
 }
 const ie = () => {
   gt("insertMenu", {
@@ -375,7 +375,7 @@ const ie = () => {
   });
 };
 let F = !1;
-const Lt = (t = {}) => {
+const Lt = (t) => {
   var e, n;
   F || (F = !0, c() && ((e = window.parent) == null || e.postMessage({
     type: "builder.sdkInfo",
@@ -387,6 +387,9 @@ const Lt = (t = {}) => {
       // scope our '+ add block' button styling
       supportsAddBlockScoping: !0,
       supportsCustomBreakpoints: !0,
+      modelName: t.modelName,
+      apiKey: t.apiKey,
+      supportsXSmallBreakpoint: !0,
       blockLevelPersonalization: !0
     }
   }, "*"), (n = window.parent) == null || n.postMessage({
@@ -437,7 +440,7 @@ const Lt = (t = {}) => {
         }
       }
   })));
-}, Vt = ({
+}, Nt = ({
   model: t,
   trustedHosts: e,
   callbacks: n
@@ -463,26 +466,34 @@ const Lt = (t = {}) => {
         break;
       }
     }
-}, ae = (t, e, n) => {
+}, ae = ({
+  model: t,
+  apiKey: e,
+  callback: n,
+  trustedHosts: r
+}) => {
   if (!c)
     return f.warn("`subscribeToEditor` only works in the browser. It currently seems to be running on the server."), () => {
     };
-  Lt();
-  const r = Vt({
+  Lt({
+    modelName: t,
+    apiKey: e
+  });
+  const s = Nt({
     callbacks: {
-      contentUpdate: e,
+      contentUpdate: n,
       animation: () => {
       },
       configureSdk: () => {
       }
     },
     model: t,
-    trustedHosts: n == null ? void 0 : n.trustedHosts
+    trustedHosts: r
   });
-  return window.addEventListener("message", r), () => {
-    window.removeEventListener("message", r);
+  return window.addEventListener("message", s), () => {
+    window.removeEventListener("message", s);
   };
-}, Nt = "builder.tests", C = (t) => `${Nt}.${t}`, Ft = ({
+}, Vt = "builder.tests", C = (t) => `${Vt}.${t}`, Ft = ({
   contentId: t
 }) => M({
   name: C(t),
@@ -622,7 +633,7 @@ function Jt(t) {
   }
   return e;
 }
-const zt = "v3", D = (t) => typeof t == "number" && !isNaN(t) && t >= 0, U = (t) => {
+const Xt = "v3", D = (t) => typeof t == "number" && !isNaN(t) && t >= 0, U = (t) => {
   const {
     limit: e = 30,
     userAttributes: n,
@@ -631,7 +642,7 @@ const zt = "v3", D = (t) => typeof t == "number" && !isNaN(t) && t >= 0, U = (t)
     apiKey: o,
     enrich: i,
     locale: u,
-    apiVersion: b = zt,
+    apiVersion: b = Xt,
     fields: p,
     omit: k,
     offset: l,
@@ -665,11 +676,11 @@ const zt = "v3", D = (t) => typeof t == "number" && !isNaN(t) && t >= 0, U = (t)
   };
   m = {
     ...m,
-    ...Xt(x)
+    ...Ht(x)
   };
-  const R = E(x);
-  for (const d in R)
-    a.searchParams.set(d, String(R[d]));
+  const B = E(x);
+  for (const d in B)
+    a.searchParams.set(d, String(B[d]));
   if (Object.keys(m).length > 0 && a.searchParams.set("userAttributes", JSON.stringify(m)), r) {
     const d = et({
       query: r
@@ -678,15 +689,15 @@ const zt = "v3", D = (t) => typeof t == "number" && !isNaN(t) && t >= 0, U = (t)
       a.searchParams.set(w, JSON.stringify(d[w]));
   }
   return a;
-}, Ht = (t) => {
+}, zt = (t) => {
   const e = {};
   for (const n in t)
     n.startsWith("userAttributes.") && (e[n] = t[n], delete t[n]);
   return e;
-}, Xt = (t) => {
+}, Ht = (t) => {
   if (c() && t.preview === "BUILDER_STUDIO") {
     t["userAttributes.urlPath"] = window.location.pathname, t["userAttributes.host"] = window.location.host;
-    const e = Ht(t), {
+    const e = zt(t), {
       userAttributes: n
     } = Jt(e);
     return n;
@@ -760,9 +771,9 @@ const ue = async (t) => {
 export {
   v as TARGET,
   qt as _processContentResult,
-  Rt as _track,
+  Bt as _track,
   y as checkIsDefined,
-  Vt as createEditorListener,
+  Nt as createEditorListener,
   re as createRegisterComponentMessage,
   ue as fetchBuilderProps,
   te as fetchEntries,

package/lib/edge/server-entry.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./server-entry-2ef4e66a.cjs");exports._processContentResult=e._processContentResult;exports.createRegisterComponentMessage=e.createRegisterComponentMessage;exports.fetchBuilderProps=e.fetchBuilderProps;exports.fetchEntries=e.fetchEntries;exports.fetchOneEntry=e.fetchOneEntry;exports.getBuilderSearchParams=e.getBuilderSearchParams;exports.isEditing=e.isEditing;exports.isPreviewing=e.isPreviewing;exports.register=e.register;exports.setEditorSettings=e.setEditorSettings;exports.subscribeToEditor=e.subscribeToEditor;exports.track=e.track;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./server-entry-77166102.cjs");exports._processContentResult=e._processContentResult;exports.createRegisterComponentMessage=e.createRegisterComponentMessage;exports.fetchBuilderProps=e.fetchBuilderProps;exports.fetchEntries=e.fetchEntries;exports.fetchOneEntry=e.fetchOneEntry;exports.getBuilderSearchParams=e.getBuilderSearchParams;exports.isEditing=e.isEditing;exports.isPreviewing=e.isPreviewing;exports.register=e.register;exports.setEditorSettings=e.setEditorSettings;exports.subscribeToEditor=e.subscribeToEditor;exports.track=e.track;

package/lib/edge/server-entry.mjs

@@ -1,4 +1,4 @@
-import { _processContentResult as r, createRegisterComponentMessage as s, fetchBuilderProps as i, fetchEntries as n, fetchOneEntry as o, getBuilderSearchParams as c, isEditing as g, isPreviewing as a, register as d, setEditorSettings as E, subscribeToEditor as f, track as h } from "./server-entry-61fca4f7.js";
+import { _processContentResult as r, createRegisterComponentMessage as s, fetchBuilderProps as i, fetchEntries as n, fetchOneEntry as o, getBuilderSearchParams as c, isEditing as g, isPreviewing as a, register as d, setEditorSettings as E, subscribeToEditor as f, track as h } from "./server-entry-c1673af2.js";
 export {
   r as _processContentResult,
   s as createRegisterComponentMessage,

package/lib/edge/{slot-d6c46a42.js → slot-05ef18a0.js}

@@ -1,9 +1,9 @@
 import { jsx as i } from "react/jsx-runtime";
-import { Blocks as m } from "./blocks-582a7fd7.js";
+import { Blocks as m } from "./blocks-0885e182.js";
 import "react";
 import "./blocks-exports.mjs";
-import "./server-entry-61fca4f7.js";
-import "./get-class-prop-name-38c2baca.js";
+import "./server-entry-c1673af2.js";
+import "./get-class-prop-name-dac81472.js";
 import "./dynamic-renderer-8b343325.js";
 function c(t) {
   var e, o, n;

package/lib/edge/{slot-995f63c2.cjs → slot-123c0993.cjs}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),i=require("./blocks-459a090b.cjs");require("react");require("./blocks-exports.cjs");require("./server-entry-2ef4e66a.cjs");require("./get-class-prop-name-fbe244e3.cjs");require("./dynamic-renderer-b29b45ca.cjs");function u(e){var t,n,r;return o.jsx("div",{style:{pointerEvents:"auto"},...!((t=e.builderContext.context)!=null&&t.symbolId)&&{"builder-slot":e.name},children:o.jsx(i.Blocks,{parent:(n=e.builderContext.context)==null?void 0:n.symbolId,path:`symbol.data.${e.name}`,context:e.builderContext,registeredComponents:e.builderComponents,blocks:(r=e.builderContext.rootState)==null?void 0:r[e.name]})})}exports.default=u;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),i=require("./blocks-5165c164.cjs");require("react");require("./blocks-exports.cjs");require("./server-entry-77166102.cjs");require("./get-class-prop-name-0b992cfb.cjs");require("./dynamic-renderer-b29b45ca.cjs");function u(e){var t,n,r;return o.jsx("div",{style:{pointerEvents:"auto"},...!((t=e.builderContext.context)!=null&&t.symbolId)&&{"builder-slot":e.name},children:o.jsx(i.Blocks,{parent:(n=e.builderContext.context)==null?void 0:n.symbolId,path:`symbol.data.${e.name}`,context:e.builderContext,registeredComponents:e.builderComponents,blocks:(r=e.builderContext.rootState)==null?void 0:r[e.name]})})}exports.default=u;

package/lib/edge/symbol-ee314d5a.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("react/jsx-runtime"),o=require("react"),v=require("./blocks-exports.cjs"),k=require("./get-class-prop-name-0b992cfb.cjs"),b=require("./server-entry-77166102.cjs"),x=async({builderContextValue:e,symbol:t})=>{if(t!=null&&t.model&&(e!=null&&e.apiKey))return b.fetchOneEntry({model:t.model,apiKey:e.apiKey,apiVersion:e.apiVersion,...(t==null?void 0:t.entry)&&{query:{id:t.entry}}}).catch(r=>{b.logger.error("Could not fetch symbol content: ",r)})};function g(e){var c,a,d,u,l;function t(){return"div"}function r(){return"div"}function y(){var n,s;return[e.attributes[k.getClassPropName()],"builder-symbol",(n=e.symbol)!=null&&n.inline?"builder-inline-symbol":void 0,(s=e.symbol)!=null&&s.dynamic||e.dynamic?"builder-dynamic-symbol":void 0].filter(Boolean).join(" ")}const[i,f]=o.useState(()=>{var n;return(n=e.symbol)==null?void 0:n.content});function C(){i||x({symbol:e.symbol,builderContextValue:e.builderContext}).then(n=>{n&&f(n)})}return o.useEffect(()=>{},[]),o.useEffect(()=>{C()},[e.symbol]),m.jsx("div",{...e.attributes,className:y(),children:m.jsx(v.Content,{nonce:e.builderContext.nonce,isNestedRender:!0,apiVersion:e.builderContext.apiVersion,apiKey:e.builderContext.apiKey,context:{...e.builderContext.context,symbolId:(c=e.builderBlock)==null?void 0:c.id},customComponents:Object.values(e.builderComponents),data:{...(a=e.symbol)==null?void 0:a.data,...e.builderContext.localState,...(d=i==null?void 0:i.data)==null?void 0:d.state},canTrack:e.builderContext.canTrack,model:(l=(u=e.symbol)==null?void 0:u.model)!=null?l:"",content:i,linkComponent:e.builderLinkComponent,blocksWrapper:t(),contentWrapper:r()})})}exports.default=g;

package/lib/edge/{symbol-623dc717.js → symbol-f488bea0.js}

@@ -1,15 +1,15 @@
-import { jsx as m } from "react/jsx-runtime";
-import { useState as s, useEffect as u } from "react";
-import { Content as C } from "./blocks-exports.mjs";
-import { getClassPropName as v } from "./get-class-prop-name-38c2baca.js";
-import { fetchOneEntry as k, logger as h } from "./server-entry-61fca4f7.js";
-const x = async ({
+import { jsx as u } from "react/jsx-runtime";
+import { useState as C, useEffect as f } from "react";
+import { Content as v } from "./blocks-exports.mjs";
+import { getClassPropName as k } from "./get-class-prop-name-dac81472.js";
+import { fetchOneEntry as h, logger as x } from "./server-entry-c1673af2.js";
+const K = async ({
   builderContextValue: e,
   symbol: t
 }) => {
   if (t != null && t.model && // This is a hack, we should not need to check for this, but it is needed for Svelte.
   (e != null && e.apiKey))
-    return k({
+    return h({
       model: t.model,
       apiKey: e.apiKey,
       apiVersion: e.apiVersion,
@@ -19,43 +19,43 @@ const x = async ({
         }
       }
     }).catch((o) => {
-      h.error("Could not fetch symbol content: ", o);
+      x.error("Could not fetch symbol content: ", o);
     });
 };
-function j(e) {
-  var r, a, c, d;
+function B(e) {
+  var r, a, c, d, l;
   function t() {
     return "div";
   }
   function o() {
     return "div";
   }
-  function f() {
-    var n, l;
+  function b() {
+    var n, m;
     return [
-      e.attributes[v()],
+      e.attributes[k()],
       "builder-symbol",
       (n = e.symbol) != null && n.inline ? "builder-inline-symbol" : void 0,
-      (l = e.symbol) != null && l.dynamic || e.dynamic ? "builder-dynamic-symbol" : void 0
+      (m = e.symbol) != null && m.dynamic || e.dynamic ? "builder-dynamic-symbol" : void 0
     ].filter(Boolean).join(" ");
   }
-  const [i, b] = s(() => {
+  const [i, y] = C(() => {
     var n;
     return (n = e.symbol) == null ? void 0 : n.content;
   });
-  function y() {
-    i || x({
+  function s() {
+    i || K({
       symbol: e.symbol,
       builderContextValue: e.builderContext
     }).then((n) => {
-      n && b(n);
+      n && y(n);
     });
   }
-  return u(() => {
-  }, []), u(() => {
-    y();
-  }, [e.symbol]), /* @__PURE__ */ m("div", { ...e.attributes, className: f(), children: /* @__PURE__ */ m(
-    C,
+  return f(() => {
+  }, []), f(() => {
+    s();
+  }, [e.symbol]), /* @__PURE__ */ u("div", { ...e.attributes, className: b(), children: /* @__PURE__ */ u(
+    v,
     {
       nonce: e.builderContext.nonce,
       isNestedRender: !0,
@@ -72,7 +72,7 @@ function j(e) {
         ...(c = i == null ? void 0 : i.data) == null ? void 0 : c.state
       },
       canTrack: e.builderContext.canTrack,
-      model: (d = e.symbol) == null ? void 0 : d.model,
+      model: (l = (d = e.symbol) == null ? void 0 : d.model) != null ? l : "",
       content: i,
       linkComponent: e.builderLinkComponent,
       blocksWrapper: t(),
@@ -81,5 +81,5 @@ function j(e) {
   ) });
 }
 export {
-  j as default
+  B as default
 };

package/lib/edge/{tabs-12ba41b1.js → tabs-244d53fa.js}

@@ -1,9 +1,9 @@
 import { jsxs as u, jsx as i } from "react/jsx-runtime";
 import { useState as d } from "react";
-import { Blocks as c } from "./blocks-582a7fd7.js";
+import { Blocks as c } from "./blocks-0885e182.js";
 import "./blocks-exports.mjs";
-import "./server-entry-61fca4f7.js";
-import "./get-class-prop-name-38c2baca.js";
+import "./server-entry-c1673af2.js";
+import "./get-class-prop-name-dac81472.js";
 import "./dynamic-renderer-8b343325.js";
 function y(t) {
   var b;

package/lib/edge/{tabs-d39499cd.cjs → tabs-edb82022.cjs}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),u=require("react"),b=require("./blocks-459a090b.cjs");require("./blocks-exports.cjs");require("./server-entry-2ef4e66a.cjs");require("./get-class-prop-name-fbe244e3.cjs");require("./dynamic-renderer-b29b45ca.cjs");function s(e){var o;const[t,a]=u.useState(()=>e.defaultActiveTab?e.defaultActiveTab-1:0);function c(n){return e.tabs&&e.tabs[n].content}function r(n){n===t&&e.collapsible?a(-1):a(n)}return l.jsxs("div",{children:[l.jsx("div",{className:"builder-tabs-wrap",style:{display:"flex",flexDirection:"row",justifyContent:e.tabHeaderLayout||"flex-start",overflow:"auto"},children:(o=e.tabs)==null?void 0:o.map((n,i)=>l.jsx("span",{className:`builder-tab-wrap ${t===i?"builder-tab-active":""}`,style:{...t===i?e.activeTabStyle:{}},onClick:d=>r(i),children:l.jsx(b.Blocks,{parent:e.builderBlock.id,path:`tabs.${i}.label`,blocks:n.label,context:e.builderContext,registeredComponents:e.builderComponents,linkComponent:e.builderLinkComponent})},i))}),c(t)?l.jsx("div",{children:l.jsx(b.Blocks,{parent:e.builderBlock.id,path:`tabs.${t}.content`,blocks:c(t),context:e.builderContext,registeredComponents:e.builderComponents,linkComponent:e.builderLinkComponent})}):null]})}exports.default=s;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),u=require("react"),b=require("./blocks-5165c164.cjs");require("./blocks-exports.cjs");require("./server-entry-77166102.cjs");require("./get-class-prop-name-0b992cfb.cjs");require("./dynamic-renderer-b29b45ca.cjs");function s(e){var o;const[t,a]=u.useState(()=>e.defaultActiveTab?e.defaultActiveTab-1:0);function c(n){return e.tabs&&e.tabs[n].content}function r(n){n===t&&e.collapsible?a(-1):a(n)}return l.jsxs("div",{children:[l.jsx("div",{className:"builder-tabs-wrap",style:{display:"flex",flexDirection:"row",justifyContent:e.tabHeaderLayout||"flex-start",overflow:"auto"},children:(o=e.tabs)==null?void 0:o.map((n,i)=>l.jsx("span",{className:`builder-tab-wrap ${t===i?"builder-tab-active":""}`,style:{...t===i?e.activeTabStyle:{}},onClick:d=>r(i),children:l.jsx(b.Blocks,{parent:e.builderBlock.id,path:`tabs.${i}.label`,blocks:n.label,context:e.builderContext,registeredComponents:e.builderComponents,linkComponent:e.builderLinkComponent})},i))}),c(t)?l.jsx("div",{children:l.jsx(b.Blocks,{parent:e.builderBlock.id,path:`tabs.${t}.content`,blocks:c(t),context:e.builderContext,registeredComponents:e.builderComponents,linkComponent:e.builderLinkComponent})}):null]})}exports.default=s;

package/lib/edge/{video-a3f10439.js → video-52df64e2.js}

@@ -1,7 +1,9 @@
-import { jsxs as s, jsx as t } from "react/jsx-runtime";
-function f(e) {
-  var i, l, n, o, d, u, a;
-  function c() {
+import { jsxs as z, jsx as i } from "react/jsx-runtime";
+import { useRef as I, useState as R, useEffect as m } from "react";
+function j(e) {
+  var a, c, d, u, s, f, h;
+  const n = I(null);
+  function b() {
     return {
       ...e.autoPlay === !0 ? {
         autoPlay: !0
@@ -20,28 +22,54 @@ function f(e) {
       } : {}
     };
   }
-  function r() {
+  function g() {
     return {
-      ...c()
+      ...b()
     };
   }
-  return /* @__PURE__ */ s(
+  const [r, x] = R(() => {
+  });
+  return m(() => {
+    if (e.lazyLoad) {
+      const l = new IntersectionObserver(function(E) {
+        E.forEach(function(v) {
+          if (!v.isIntersecting)
+            return;
+          const o = v.target;
+          try {
+            Array.from(o.children).filter(
+              (t) => t instanceof HTMLElement && t.tagName === "SOURCE"
+            ).forEach((t) => {
+              const y = t.dataset.src;
+              y && (t.src = y);
+            }), o.load(), l.unobserve(o);
+          } catch (t) {
+            console.error("Error loading lazy video:", t);
+          }
+        });
+      });
+      n.current && l.observe(n.current), x(l);
+    }
+  }, []), m(() => () => {
+    r && r.disconnect();
+  }, []), /* @__PURE__ */ z(
     "div",
     {
       style: {
         position: "relative"
       },
       children: [
-        /* @__PURE__ */ t(
+        /* @__PURE__ */ i(
           "video",
           {
             className: "builder-video",
-            ...r(),
-            preload: e.preload || "metadata",
+            ...g(),
+            ref: n,
+            preload: e.lazyLoad ? "none" : e.preload || "metadata",
             style: {
               width: "100%",
               height: "100%",
-              ...(i = e.attributes) == null ? void 0 : i.style,
+              ...(a = e.attributes) == null ? void 0 : a.style,
               objectFit: e.fit,
               objectPosition: e.position,
               // Hack to get object fit to work as expected and
@@ -51,12 +79,21 @@ function f(e) {
                 position: "absolute"
               } : null
             },
-            src: e.video || "no-src",
             poster: e.posterImage,
-            children: e.lazyLoad ? null : /* @__PURE__ */ t("source", { type: "video/mp4", src: e.video })
+            children: /* @__PURE__ */ i(
+              "source",
+              {
+                type: "video/mp4",
+                ...e.lazyLoad ? {
+                  "data-src": e.video
+                } : {
+                  src: e.video
+                }
+              }
+            )
           }
         ),
-        e.aspectRatio && !(e.fitContent && ((n = (l = e.builderBlock) == null ? void 0 : l.children) != null && n.length)) ? /* @__PURE__ */ t(
+        e.aspectRatio && !(e.fitContent && ((d = (c = e.builderBlock) == null ? void 0 : c.children) != null && d.length)) ? /* @__PURE__ */ i(
           "div",
           {
             style: {
@@ -67,7 +104,7 @@ function f(e) {
             }
           }
         ) : null,
-        (d = (o = e.builderBlock) == null ? void 0 : o.children) != null && d.length && e.fitContent ? /* @__PURE__ */ t(
+        (s = (u = e.builderBlock) == null ? void 0 : u.children) != null && s.length && e.fitContent ? /* @__PURE__ */ i(
           "div",
           {
             style: {
@@ -78,7 +115,7 @@ function f(e) {
             children: e.children
           }
         ) : null,
-        (a = (u = e.builderBlock) == null ? void 0 : u.children) != null && a.length && !e.fitContent ? /* @__PURE__ */ t(
+        (h = (f = e.builderBlock) == null ? void 0 : f.children) != null && h.length && !e.fitContent ? /* @__PURE__ */ i(
           "div",
           {
             style: {
@@ -100,5 +137,5 @@ function f(e) {
   );
 }
 export {
-  f as default
+  j as default
 };

package/lib/edge/video-cc58dd83.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),n=require("react");function E(e){var a,d,u,s,f,h,v;const l=n.useRef(null);function m(){return{...e.autoPlay===!0?{autoPlay:!0}:{},...e.muted===!0?{muted:!0}:{},...e.controls===!0?{controls:!0}:{},...e.loop===!0?{loop:!0}:{},...e.playsInline===!0?{playsInline:!0}:{}}}function g(){return{...m()}}const[c,x]=n.useState(()=>{});return n.useEffect(()=>{if(e.lazyLoad){const o=new IntersectionObserver(function(j){j.forEach(function(y){if(!y.isIntersecting)return;const r=y.target;try{Array.from(r.children).filter(t=>t instanceof HTMLElement&&t.tagName==="SOURCE").forEach(t=>{const b=t.dataset.src;b&&(t.src=b)}),r.load(),o.unobserve(r)}catch(t){console.error("Error loading lazy video:",t)}})});l.current&&o.observe(l.current),x(o)}},[]),n.useEffect(()=>()=>{c&&c.disconnect()},[]),i.jsxs("div",{style:{position:"relative"},children:[i.jsx("video",{className:"builder-video",...g(),ref:l,preload:e.lazyLoad?"none":e.preload||"metadata",style:{width:"100%",height:"100%",...(a=e.attributes)==null?void 0:a.style,objectFit:e.fit,objectPosition:e.position,borderRadius:"1px",...e.aspectRatio?{position:"absolute"}:null},poster:e.posterImage,children:i.jsx("source",{type:"video/mp4",...e.lazyLoad?{"data-src":e.video}:{src:e.video}})}),e.aspectRatio&&!(e.fitContent&&((u=(d=e.builderBlock)==null?void 0:d.children)!=null&&u.length))?i.jsx("div",{style:{width:"100%",paddingTop:e.aspectRatio*100+"%",pointerEvents:"none",fontSize:"0px"}}):null,(f=(s=e.builderBlock)==null?void 0:s.children)!=null&&f.length&&e.fitContent?i.jsx("div",{style:{display:"flex",flexDirection:"column",alignItems:"stretch"},children:e.children}):null,(v=(h=e.builderBlock)==null?void 0:h.children)!=null&&v.length&&!e.fitContent?i.jsx("div",{style:{pointerEvents:"none",display:"flex",flexDirection:"column",alignItems:"stretch",position:"absolute",top:"0",left:"0",width:"100%",height:"100%"},children:e.children}):null]})}exports.default=E;