@builder.io/sdk-react-nextjs 0.17.8 → 0.18.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (51) hide show
  1. package/lib/browser/blocks/symbol/symbol.cjs +1 -1
  2. package/lib/browser/blocks/symbol/symbol.mjs +20 -20
  3. package/lib/browser/blocks/video/video.cjs +1 -1
  4. package/lib/browser/blocks/video/video.mjs +54 -17
  5. package/lib/browser/components/content/components/enable-editor.cjs +1 -1
  6. package/lib/browser/components/content/components/enable-editor.mjs +68 -62
  7. package/lib/browser/components/content/content.cjs +1 -1
  8. package/lib/browser/components/content/content.mjs +1 -1
  9. package/lib/browser/constants/sdk-version.cjs +1 -1
  10. package/lib/browser/constants/sdk-version.mjs +1 -1
  11. package/lib/browser/helpers/subscribe-to-editor.cjs +1 -1
  12. package/lib/browser/helpers/subscribe-to-editor.mjs +35 -20
  13. package/lib/browser/scripts/init-editing.cjs +1 -1
  14. package/lib/browser/scripts/init-editing.mjs +9 -7
  15. package/lib/edge/blocks/symbol/symbol.cjs +1 -1
  16. package/lib/edge/blocks/symbol/symbol.mjs +20 -20
  17. package/lib/edge/blocks/video/video.cjs +1 -1
  18. package/lib/edge/blocks/video/video.mjs +54 -17
  19. package/lib/edge/components/content/components/enable-editor.cjs +1 -1
  20. package/lib/edge/components/content/components/enable-editor.mjs +68 -62
  21. package/lib/edge/components/content/content.cjs +1 -1
  22. package/lib/edge/components/content/content.mjs +1 -1
  23. package/lib/edge/constants/sdk-version.cjs +1 -1
  24. package/lib/edge/constants/sdk-version.mjs +1 -1
  25. package/lib/edge/helpers/subscribe-to-editor.cjs +1 -1
  26. package/lib/edge/helpers/subscribe-to-editor.mjs +35 -20
  27. package/lib/edge/scripts/init-editing.cjs +1 -1
  28. package/lib/edge/scripts/init-editing.mjs +9 -7
  29. package/lib/node/blocks/symbol/symbol.cjs +1 -1
  30. package/lib/node/blocks/symbol/symbol.mjs +20 -20
  31. package/lib/node/blocks/video/video.cjs +1 -1
  32. package/lib/node/blocks/video/video.mjs +54 -17
  33. package/lib/node/components/content/components/enable-editor.cjs +1 -1
  34. package/lib/node/components/content/components/enable-editor.mjs +68 -62
  35. package/lib/node/components/content/content.cjs +1 -1
  36. package/lib/node/components/content/content.mjs +1 -1
  37. package/lib/node/constants/sdk-version.cjs +1 -1
  38. package/lib/node/constants/sdk-version.mjs +1 -1
  39. package/lib/node/helpers/subscribe-to-editor.cjs +1 -1
  40. package/lib/node/helpers/subscribe-to-editor.mjs +35 -20
  41. package/lib/node/scripts/init-editing.cjs +1 -1
  42. package/lib/node/scripts/init-editing.mjs +9 -7
  43. package/package.json +1 -1
  44. package/types/cjs/components/content-variants/content-variants.types.d.ts +2 -2
  45. package/types/cjs/constants/sdk-version.d.ts +1 -1
  46. package/types/cjs/helpers/subscribe-to-editor.d.ts +15 -13
  47. package/types/cjs/scripts/init-editing.d.ts +3 -1
  48. package/types/esm/components/content-variants/content-variants.types.d.ts +2 -2
  49. package/types/esm/constants/sdk-version.d.ts +1 -1
  50. package/types/esm/helpers/subscribe-to-editor.d.ts +15 -13
  51. package/types/esm/scripts/init-editing.d.ts +3 -1
@@ -2,53 +2,68 @@ import { isBrowser as d } from "../functions/is-browser.mjs";
2
2
  import { isFromTrustedHost as c } from "../functions/is-from-trusted-host.mjs";
3
3
  import { setupBrowserForEditing as m } from "../scripts/init-editing.mjs";
4
4
  import { logger as u } from "./logger.mjs";
5
- const g = ({
5
+ const b = ({
6
6
  model: o,
7
- trustedHosts: s,
8
- callbacks: e
9
- }) => (t) => {
10
- if (!c(s, t))
7
+ trustedHosts: i,
8
+ callbacks: r
9
+ }) => (n) => {
10
+ if (!c(i, n))
11
11
  return;
12
12
  const {
13
- data: r
14
- } = t;
15
- if (r)
16
- switch (r.type) {
13
+ data: t
14
+ } = n;
15
+ if (t)
16
+ switch (t.type) {
17
17
  case "builder.configureSdk": {
18
- e.configureSdk(r.data);
18
+ r.configureSdk(t.data);
19
19
  break;
20
20
  }
21
21
  case "builder.triggerAnimation": {
22
- e.animation(r.data);
22
+ r.animation(t.data);
23
+ break;
24
+ }
25
+ case "builder.resetState": {
26
+ const e = t.data, s = e.model, a = e == null ? void 0 : e.state;
27
+ s === o && a && r.stateUpdate(a);
23
28
  break;
24
29
  }
25
30
  case "builder.contentUpdate": {
26
- const n = r.data, i = n.key || n.alias || n.entry || n.modelName, a = n.data;
27
- i === o && e.contentUpdate(a);
31
+ const e = t.data, s = e.key || e.alias || e.entry || e.modelName, a = e.data;
32
+ s === o && r.contentUpdate(a);
28
33
  break;
29
34
  }
30
35
  }
31
- }, l = (o, s, e) => {
36
+ }, k = ({
37
+ model: o,
38
+ apiKey: i,
39
+ callback: r,
40
+ trustedHosts: n
41
+ }) => {
32
42
  if (!d)
33
43
  return u.warn("`subscribeToEditor` only works in the browser. It currently seems to be running on the server."), () => {
34
44
  };
35
- m();
36
- const t = g({
45
+ m({
46
+ modelName: o,
47
+ apiKey: i
48
+ });
49
+ const t = b({
37
50
  callbacks: {
38
- contentUpdate: s,
51
+ contentUpdate: r,
39
52
  animation: () => {
40
53
  },
41
54
  configureSdk: () => {
55
+ },
56
+ stateUpdate: () => {
42
57
  }
43
58
  },
44
59
  model: o,
45
- trustedHosts: e == null ? void 0 : e.trustedHosts
60
+ trustedHosts: n
46
61
  });
47
62
  return window.addEventListener("message", t), () => {
48
63
  window.removeEventListener("message", t);
49
64
  };
50
65
  };
51
66
  export {
52
- g as createEditorListener,
53
- l as subscribeToEditor
67
+ b as createEditorListener,
68
+ k as subscribeToEditor
54
69
  };
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const f=require("../constants/sdk-version.cjs"),y=require("../constants/target.cjs"),b=require("../functions/is-browser.cjs"),B=require("../functions/is-from-trusted-host.cjs"),M=require("../functions/register.cjs"),E=()=>{M.register("insertMenu",{name:"_default",default:!0,items:[{name:"Box"},{name:"Text"},{name:"Image"},{name:"Columns"},{name:"Core:Section"},{name:"Core:Button"},{name:"Embed"},{name:"Custom Code"}]})};let c=!1;const S=(o={})=>{var a,i;c||(c=!0,b.isBrowser()&&((a=window.parent)==null||a.postMessage({type:"builder.sdkInfo",data:{target:y.TARGET,version:f.SDK_VERSION,supportsPatchUpdates:!1,supportsAddBlockScoping:!0,supportsCustomBreakpoints:!0,supportsXSmallBreakpoint:!0,blockLevelPersonalization:!0}},"*"),(i=window.parent)==null||i.postMessage({type:"builder.updateContent",data:{options:o}},"*"),window.addEventListener("message",u=>{var d,l;if(!B.isFromTrustedHost(o.trustedHosts,u))return;const{data:e}=u;if(e!=null&&e.type)switch(e.type){case"builder.evaluate":{const g=e.data.text,m=e.data.arguments||[],r=e.data.id,w=new Function(g);let t,s=null;try{t=w.apply(null,m)}catch(n){s=n}s?(d=window.parent)==null||d.postMessage({type:"builder.evaluateError",data:{id:r,error:s.message}},"*"):t&&typeof t.then=="function"?t.then(n=>{var p;(p=window.parent)==null||p.postMessage({type:"builder.evaluateResult",data:{id:r,result:n}},"*")}).catch(console.error):(l=window.parent)==null||l.postMessage({type:"builder.evaluateResult",data:{result:t,id:r}},"*");break}}})))};exports.registerInsertMenu=E;exports.setupBrowserForEditing=S;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const f=require("../constants/sdk-version.cjs"),y=require("../constants/target.cjs"),b=require("../functions/is-browser.cjs"),B=require("../functions/is-from-trusted-host.cjs"),M=require("../functions/register.cjs"),E=()=>{M.register("insertMenu",{name:"_default",default:!0,items:[{name:"Box"},{name:"Text"},{name:"Image"},{name:"Columns"},{name:"Core:Section"},{name:"Core:Button"},{name:"Embed"},{name:"Custom Code"}]})};let c=!1;const S=r=>{var o,i;c||(c=!0,b.isBrowser()&&((o=window.parent)==null||o.postMessage({type:"builder.sdkInfo",data:{target:y.TARGET,version:f.SDK_VERSION,supportsPatchUpdates:!1,supportsAddBlockScoping:!0,supportsCustomBreakpoints:!0,modelName:r.modelName,apiKey:r.apiKey,supportsXSmallBreakpoint:!0,blockLevelPersonalization:!0}},"*"),(i=window.parent)==null||i.postMessage({type:"builder.updateContent",data:{options:r}},"*"),window.addEventListener("message",u=>{var d,l;if(!B.isFromTrustedHost(r.trustedHosts,u))return;const{data:e}=u;if(e!=null&&e.type)switch(e.type){case"builder.evaluate":{const m=e.data.text,g=e.data.arguments||[],s=e.data.id,w=new Function(m);let t,a=null;try{t=w.apply(null,g)}catch(n){a=n}a?(d=window.parent)==null||d.postMessage({type:"builder.evaluateError",data:{id:s,error:a.message}},"*"):t&&typeof t.then=="function"?t.then(n=>{var p;(p=window.parent)==null||p.postMessage({type:"builder.evaluateResult",data:{id:s,result:n}},"*")}).catch(console.error):(l=window.parent)==null||l.postMessage({type:"builder.evaluateResult",data:{result:t,id:s}},"*");break}}})))};exports.registerInsertMenu=E;exports.setupBrowserForEditing=S;
@@ -27,7 +27,7 @@ const S = () => {
27
27
  });
28
28
  };
29
29
  let m = !1;
30
- const x = (a = {}) => {
30
+ const x = (r) => {
31
31
  var n, i;
32
32
  m || (m = !0, b() && ((n = window.parent) == null || n.postMessage({
33
33
  type: "builder.sdkInfo",
@@ -39,17 +39,19 @@ const x = (a = {}) => {
39
39
  // scope our '+ add block' button styling
40
40
  supportsAddBlockScoping: !0,
41
41
  supportsCustomBreakpoints: !0,
42
+ modelName: r.modelName,
43
+ apiKey: r.apiKey,
42
44
  supportsXSmallBreakpoint: !0,
43
45
  blockLevelPersonalization: !0
44
46
  }
45
47
  }, "*"), (i = window.parent) == null || i.postMessage({
46
48
  type: "builder.updateContent",
47
49
  data: {
48
- options: a
50
+ options: r
49
51
  }
50
52
  }, "*"), window.addEventListener("message", (u) => {
51
53
  var p, d;
52
- if (!B(a.trustedHosts, u))
54
+ if (!B(r.trustedHosts, u))
53
55
  return;
54
56
  const {
55
57
  data: e
@@ -57,7 +59,7 @@ const x = (a = {}) => {
57
59
  if (e != null && e.type)
58
60
  switch (e.type) {
59
61
  case "builder.evaluate": {
60
- const c = e.data.text, f = e.data.arguments || [], r = e.data.id, g = new Function(c);
62
+ const c = e.data.text, f = e.data.arguments || [], a = e.data.id, g = new Function(c);
61
63
  let t, s = null;
62
64
  try {
63
65
  t = g.apply(null, f);
@@ -67,7 +69,7 @@ const x = (a = {}) => {
67
69
  s ? (p = window.parent) == null || p.postMessage({
68
70
  type: "builder.evaluateError",
69
71
  data: {
70
- id: r,
72
+ id: a,
71
73
  error: s.message
72
74
  }
73
75
  }, "*") : t && typeof t.then == "function" ? t.then((o) => {
@@ -75,7 +77,7 @@ const x = (a = {}) => {
75
77
  (l = window.parent) == null || l.postMessage({
76
78
  type: "builder.evaluateResult",
77
79
  data: {
78
- id: r,
80
+ id: a,
79
81
  result: o
80
82
  }
81
83
  }, "*");
@@ -83,7 +85,7 @@ const x = (a = {}) => {
83
85
  type: "builder.evaluateResult",
84
86
  data: {
85
87
  result: t,
86
- id: r
88
+ id: a
87
89
  }
88
90
  }, "*");
89
91
  break;
@@ -1 +1 @@
1
- "use strict";const s=require("react/jsx-runtime"),y=require("../../components/content-variants/content-variants.cjs"),C=require("../../functions/get-class-prop-name.cjs"),x=require("./symbol.helpers.cjs");async function k(e){var n,i,o,l,a;const u=function(){return"div"},d=function(){return"div"},m=function(){var r,b;return[e.attributes[C.getClassPropName()],"builder-symbol",(r=e.symbol)!=null&&r.inline?"builder-inline-symbol":void 0,(b=e.symbol)!=null&&b.dynamic||e.dynamic?"builder-dynamic-symbol":void 0].filter(Boolean).join(" ")},t=((n=e.symbol)==null?void 0:n.content)||await x.fetchSymbolContent({symbol:e.symbol,builderContextValue:e.builderContext});return s.jsx("div",{...e.attributes,className:m(),children:s.jsx(y,{nonce:e.builderContext.nonce,isNestedRender:!0,apiVersion:e.builderContext.apiVersion,apiKey:e.builderContext.apiKey,context:{...e.builderContext.context,symbolId:(i=e.builderBlock)==null?void 0:i.id},customComponents:Object.values(e.builderComponents),data:{...(o=e.symbol)==null?void 0:o.data,...e.builderContext.localState,...(l=t==null?void 0:t.data)==null?void 0:l.state},canTrack:e.builderContext.canTrack,model:(a=e.symbol)==null?void 0:a.model,content:t,linkComponent:e.builderLinkComponent,blocksWrapper:u(),contentWrapper:d()})})}module.exports=k;
1
+ "use strict";const u=require("react/jsx-runtime"),C=require("../../components/content-variants/content-variants.cjs"),x=require("../../functions/get-class-prop-name.cjs"),k=require("./symbol.helpers.cjs");async function f(e){var n,i,o,l,a,c;const d=function(){return"div"},m=function(){return"div"},y=function(){var b,s;return[e.attributes[x.getClassPropName()],"builder-symbol",(b=e.symbol)!=null&&b.inline?"builder-inline-symbol":void 0,(s=e.symbol)!=null&&s.dynamic||e.dynamic?"builder-dynamic-symbol":void 0].filter(Boolean).join(" ")},t=((n=e.symbol)==null?void 0:n.content)||await k.fetchSymbolContent({symbol:e.symbol,builderContextValue:e.builderContext});return u.jsx("div",{...e.attributes,className:y(),children:u.jsx(C,{nonce:e.builderContext.nonce,isNestedRender:!0,apiVersion:e.builderContext.apiVersion,apiKey:e.builderContext.apiKey,context:{...e.builderContext.context,symbolId:(i=e.builderBlock)==null?void 0:i.id},customComponents:Object.values(e.builderComponents),data:{...(o=e.symbol)==null?void 0:o.data,...e.builderContext.localState,...(l=t==null?void 0:t.data)==null?void 0:l.state},canTrack:e.builderContext.canTrack,model:(c=(a=e.symbol)==null?void 0:a.model)!=null?c:"",content:t,linkComponent:e.builderLinkComponent,blocksWrapper:d(),contentWrapper:m()})})}module.exports=f;
@@ -1,27 +1,27 @@
1
- import { jsx as b } from "react/jsx-runtime";
2
- import y from "../../components/content-variants/content-variants.mjs";
3
- import { getClassPropName as C } from "../../functions/get-class-prop-name.mjs";
4
- import { fetchSymbolContent as x } from "./symbol.helpers.mjs";
5
- async function N(e) {
6
- var n, o, i, l, a;
7
- const d = function() {
8
- return "div";
9
- }, u = function() {
1
+ import { jsx as d } from "react/jsx-runtime";
2
+ import C from "../../components/content-variants/content-variants.mjs";
3
+ import { getClassPropName as x } from "../../functions/get-class-prop-name.mjs";
4
+ import { fetchSymbolContent as f } from "./symbol.helpers.mjs";
5
+ async function V(e) {
6
+ var n, o, i, l, a, r;
7
+ const u = function() {
10
8
  return "div";
11
9
  }, s = function() {
12
- var c, m;
10
+ return "div";
11
+ }, y = function() {
12
+ var m, b;
13
13
  return [
14
- e.attributes[C()],
14
+ e.attributes[x()],
15
15
  "builder-symbol",
16
- (c = e.symbol) != null && c.inline ? "builder-inline-symbol" : void 0,
17
- (m = e.symbol) != null && m.dynamic || e.dynamic ? "builder-dynamic-symbol" : void 0
16
+ (m = e.symbol) != null && m.inline ? "builder-inline-symbol" : void 0,
17
+ (b = e.symbol) != null && b.dynamic || e.dynamic ? "builder-dynamic-symbol" : void 0
18
18
  ].filter(Boolean).join(" ");
19
- }, t = ((n = e.symbol) == null ? void 0 : n.content) || await x({
19
+ }, t = ((n = e.symbol) == null ? void 0 : n.content) || await f({
20
20
  symbol: e.symbol,
21
21
  builderContextValue: e.builderContext
22
22
  });
23
- return /* @__PURE__ */ b("div", { ...e.attributes, className: s(), children: /* @__PURE__ */ b(
24
- y,
23
+ return /* @__PURE__ */ d("div", { ...e.attributes, className: y(), children: /* @__PURE__ */ d(
24
+ C,
25
25
  {
26
26
  nonce: e.builderContext.nonce,
27
27
  isNestedRender: !0,
@@ -38,14 +38,14 @@ async function N(e) {
38
38
  ...(l = t == null ? void 0 : t.data) == null ? void 0 : l.state
39
39
  },
40
40
  canTrack: e.builderContext.canTrack,
41
- model: (a = e.symbol) == null ? void 0 : a.model,
41
+ model: (r = (a = e.symbol) == null ? void 0 : a.model) != null ? r : "",
42
42
  content: t,
43
43
  linkComponent: e.builderLinkComponent,
44
- blocksWrapper: d(),
45
- contentWrapper: u()
44
+ blocksWrapper: u(),
45
+ contentWrapper: s()
46
46
  }
47
47
  ) });
48
48
  }
49
49
  export {
50
- N as default
50
+ V as default
51
51
  };
@@ -1 +1 @@
1
- "use client";"use strict";const t=require("react/jsx-runtime");function s(e){var i,l,n,o,d,u,c;function a(){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 r(){return{...a()}}return t.jsxs("div",{style:{position:"relative"},children:[t.jsx("video",{className:"builder-video",...r(),preload:e.preload||"metadata",style:{width:"100%",height:"100%",...(i=e.attributes)==null?void 0:i.style,objectFit:e.fit,objectPosition:e.position,borderRadius:"1px",...e.aspectRatio?{position:"absolute"}:null},src:e.video||"no-src",poster:e.posterImage,children:e.lazyLoad?null:t.jsx("source",{type:"video/mp4",src:e.video})}),e.aspectRatio&&!(e.fitContent&&((n=(l=e.builderBlock)==null?void 0:l.children)!=null&&n.length))?t.jsx("div",{style:{width:"100%",paddingTop:e.aspectRatio*100+"%",pointerEvents:"none",fontSize:"0px"}}):null,(d=(o=e.builderBlock)==null?void 0:o.children)!=null&&d.length&&e.fitContent?t.jsx("div",{style:{display:"flex",flexDirection:"column",alignItems:"stretch"},children:e.children}):null,(c=(u=e.builderBlock)==null?void 0:u.children)!=null&&c.length&&!e.fitContent?t.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]})}module.exports=s;
1
+ "use client";"use strict";const i=require("react/jsx-runtime"),n=require("react");function j(e){var a,d,s,u,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 x(){return{...m()}}const[c,g]=n.useState(()=>{});return n.useEffect(()=>{if(e.lazyLoad){const o=new IntersectionObserver(function(E){E.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),g(o)}},[]),n.useEffect(()=>()=>{c&&c.disconnect()},[]),i.jsxs("div",{style:{position:"relative"},children:[i.jsx("video",{className:"builder-video",...x(),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&&((s=(d=e.builderBlock)==null?void 0:d.children)!=null&&s.length))?i.jsx("div",{style:{width:"100%",paddingTop:e.aspectRatio*100+"%",pointerEvents:"none",fontSize:"0px"}}):null,(f=(u=e.builderBlock)==null?void 0:u.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]})}module.exports=j;
@@ -1,8 +1,10 @@
1
1
  "use client";
2
- import { jsxs as s, jsx as t } from "react/jsx-runtime";
3
- function f(e) {
4
- var i, l, n, o, d, u, a;
5
- function c() {
2
+ import { jsxs as z, jsx as i } from "react/jsx-runtime";
3
+ import { useRef as I, useState as R, useEffect as m } from "react";
4
+ function j(e) {
5
+ var a, c, d, u, s, f, h;
6
+ const n = I(null);
7
+ function b() {
6
8
  return {
7
9
  ...e.autoPlay === !0 ? {
8
10
  autoPlay: !0
@@ -21,28 +23,54 @@ function f(e) {
21
23
  } : {}
22
24
  };
23
25
  }
24
- function r() {
26
+ function g() {
25
27
  return {
26
- ...c()
28
+ ...b()
27
29
  };
28
30
  }
29
- return /* @__PURE__ */ s(
31
+ const [r, x] = R(() => {
32
+ });
33
+ return m(() => {
34
+ if (e.lazyLoad) {
35
+ const l = new IntersectionObserver(function(E) {
36
+ E.forEach(function(v) {
37
+ if (!v.isIntersecting)
38
+ return;
39
+ const o = v.target;
40
+ try {
41
+ Array.from(o.children).filter(
42
+ (t) => t instanceof HTMLElement && t.tagName === "SOURCE"
43
+ ).forEach((t) => {
44
+ const y = t.dataset.src;
45
+ y && (t.src = y);
46
+ }), o.load(), l.unobserve(o);
47
+ } catch (t) {
48
+ console.error("Error loading lazy video:", t);
49
+ }
50
+ });
51
+ });
52
+ n.current && l.observe(n.current), x(l);
53
+ }
54
+ }, []), m(() => () => {
55
+ r && r.disconnect();
56
+ }, []), /* @__PURE__ */ z(
30
57
  "div",
31
58
  {
32
59
  style: {
33
60
  position: "relative"
34
61
  },
35
62
  children: [
36
- /* @__PURE__ */ t(
63
+ /* @__PURE__ */ i(
37
64
  "video",
38
65
  {
39
66
  className: "builder-video",
40
- ...r(),
41
- preload: e.preload || "metadata",
67
+ ...g(),
68
+ ref: n,
69
+ preload: e.lazyLoad ? "none" : e.preload || "metadata",
42
70
  style: {
43
71
  width: "100%",
44
72
  height: "100%",
45
- ...(i = e.attributes) == null ? void 0 : i.style,
73
+ ...(a = e.attributes) == null ? void 0 : a.style,
46
74
  objectFit: e.fit,
47
75
  objectPosition: e.position,
48
76
  // Hack to get object fit to work as expected and
@@ -52,12 +80,21 @@ function f(e) {
52
80
  position: "absolute"
53
81
  } : null
54
82
  },
55
- src: e.video || "no-src",
56
83
  poster: e.posterImage,
57
- children: e.lazyLoad ? null : /* @__PURE__ */ t("source", { type: "video/mp4", src: e.video })
84
+ children: /* @__PURE__ */ i(
85
+ "source",
86
+ {
87
+ type: "video/mp4",
88
+ ...e.lazyLoad ? {
89
+ "data-src": e.video
90
+ } : {
91
+ src: e.video
92
+ }
93
+ }
94
+ )
58
95
  }
59
96
  ),
60
- e.aspectRatio && !(e.fitContent && ((n = (l = e.builderBlock) == null ? void 0 : l.children) != null && n.length)) ? /* @__PURE__ */ t(
97
+ e.aspectRatio && !(e.fitContent && ((d = (c = e.builderBlock) == null ? void 0 : c.children) != null && d.length)) ? /* @__PURE__ */ i(
61
98
  "div",
62
99
  {
63
100
  style: {
@@ -68,7 +105,7 @@ function f(e) {
68
105
  }
69
106
  }
70
107
  ) : null,
71
- (d = (o = e.builderBlock) == null ? void 0 : o.children) != null && d.length && e.fitContent ? /* @__PURE__ */ t(
108
+ (s = (u = e.builderBlock) == null ? void 0 : u.children) != null && s.length && e.fitContent ? /* @__PURE__ */ i(
72
109
  "div",
73
110
  {
74
111
  style: {
@@ -79,7 +116,7 @@ function f(e) {
79
116
  children: e.children
80
117
  }
81
118
  ) : null,
82
- (a = (u = e.builderBlock) == null ? void 0 : u.children) != null && a.length && !e.fitContent ? /* @__PURE__ */ t(
119
+ (h = (f = e.builderBlock) == null ? void 0 : f.children) != null && h.length && !e.fitContent ? /* @__PURE__ */ i(
83
120
  "div",
84
121
  {
85
122
  style: {
@@ -101,5 +138,5 @@ function f(e) {
101
138
  );
102
139
  }
103
140
  export {
104
- f as default
141
+ j as default
105
142
  };
@@ -1 +1 @@
1
- "use client";"use strict";const w=require("react/jsx-runtime"),o=require("react"),F=require("../../../context/builder.context.cjs"),V=require("../../../functions/evaluate/evaluate.cjs"),M=require("../../../functions/fast-clone.cjs"),N=require("../../../functions/get-content/index.cjs"),k=require("../../../functions/is-browser.cjs"),g=require("../../../functions/is-editing.cjs"),O=require("../../../functions/is-previewing.cjs"),W=require("../../../functions/log-fetch.cjs"),A=require("../../../functions/register-component.cjs"),y=require("../../../functions/track/index.cjs"),$=require("../../../functions/track/interaction.cjs"),P=require("../../../helpers/canTrack.cjs"),z=require("../../../helpers/preview-lru-cache/set.cjs"),G=require("../../../helpers/subscribe-to-editor.cjs"),L=require("../../../scripts/init-editing.cjs"),J=require("../../block/animator.cjs"),H=require("./enable-editor.helpers.cjs"),Q=require("./styles.helpers.cjs"),X=require("next/navigation");function Y(e){var q,I,R;const l=o.useRef(null);function f(n){var i,a;const t={...e.builderContextSignal.rootState,...n};e.builderContextSignal.rootSetState?(a=(i=e.builderContextSignal).rootSetState)==null||a.call(i,t):e.builderContextSignal.rootState=t}function m(n){var i,a,r,c,d;const t={...e.builderContextSignal.content,...n,data:{...(i=e.builderContextSignal.content)==null?void 0:i.data,...n==null?void 0:n.data},meta:{...(a=e.builderContextSignal.content)==null?void 0:a.meta,...n==null?void 0:n.meta,breakpoints:((r=n==null?void 0:n.meta)==null?void 0:r.breakpoints)||((d=(c=e.builderContextSignal.content)==null?void 0:c.meta)==null?void 0:d.breakpoints)}};z.postPreviewContent({value:t,key:t.id}).then(()=>{j.refresh()})}function T(){return e.showContent?{}:{hidden:!0,"aria-hidden":!0}}const[D,Z]=o.useState(()=>e.contentWrapper||"div");function S(n){return G.createEditorListener({model:e.model,trustedHosts:e.trustedHosts,callbacks:{configureSdk:t=>{var r;const{breakpoints:i,contentId:a}=t;!a||a!==((r=e.builderContextSignal.content)==null?void 0:r.id)||i&&m({meta:{breakpoints:i}})},animation:t=>{J.triggerAnimation(t)},contentUpdate:t=>{m(t)}}})(n)}const[v,p]=o.useState(()=>({})),[b,ee]=o.useState(()=>({})),[h,K]=o.useState(()=>!1);function _(n){var t,i;if(e.builderContextSignal.content){const a=(t=e.builderContextSignal.content)==null?void 0:t.testVariationId,r=(i=e.builderContextSignal.content)==null?void 0:i.id;y._track({apiHost:e.apiHost,type:"click",canTrack:P.getDefaultCanTrack(e.canTrack),contentId:r,apiKey:e.apiKey,variationId:a!==r?a:void 0,...$.getInteractionPropertiesForEvent(n),unique:!h})}h||K(!0)}function U(){var t,i,a;const n=(a=(i=(t=e.builderContextSignal.content)==null?void 0:t.data)==null?void 0:i.httpRequests)!=null?a:{};Object.entries(n).forEach(([r,c])=>{if(!c||b[r]||v[r]&&!g.isEditing())return;b[r]=!0;const d=c.replace(/{{([^}]+)}}/g,(s,B)=>String(V.evaluate({code:B,context:e.context||{},localState:void 0,rootState:e.builderContextSignal.rootState,rootSetState:e.builderContextSignal.rootSetState})));W.logFetch(d),fetch(d).then(s=>s.json()).then(s=>{f({[r]:s}),v[r]=!0}).catch(s=>{console.error("error fetching dynamic data",c,s)}).finally(()=>{b[r]=!1})})}function u(){g.isEditing()&&window.dispatchEvent(new CustomEvent("builder:component:stateChange",{detail:{state:M.fastClone(e.builderContextSignal.rootState),ref:{name:e.model}}}))}function E(n){window.addEventListener("message",S),L.registerInsertMenu(),L.setupBrowserForEditing({...e.locale?{locale:e.locale}:{},...e.enrich?{enrich:e.enrich}:{},...e.trustedHosts?{trustedHosts:e.trustedHosts}:{}}),Object.values(e.builderContextSignal.componentInfos).forEach(t=>{var i,a;if(!e.model||!((i=t.models)!=null&&i.length)||t.models.includes(e.model)){const r=A.createRegisterComponentMessage(t);(a=window.parent)==null||a.postMessage(r,"*")}}),window.addEventListener("builder:component:stateChangeListenerActivated",u)}function x(n){var c;const t=new URL(location.href).searchParams,i=t.get("builder.preview"),a=t.get(`builder.overrides.${i}`),r=t.get("apiKey")||t.get("builder.space");(i==="BUILDER_STUDIO"||i===e.model&&r===e.apiKey&&(!e.content||a===e.content.id))&&N.fetchOneEntry({model:e.model||"",apiKey:e.apiKey,apiVersion:e.builderContextSignal.apiVersion,...i==="BUILDER_STUDIO"&&((c=e.context)!=null&&c.symbolId)?{query:{id:e.context.symbolId}}:{}}).then(d=>{d&&m(d)})}const j=X.useRouter(),C=o.useRef(!1);return C.current||(U(),u(),C.current=!0),o.useEffect(()=>{var n;return(n=l.current)==null||n.addEventListener("initeditingbldr",E),()=>{var t;return(t=l.current)==null?void 0:t.removeEventListener("initeditingbldr",E)}},[]),o.useEffect(()=>{var n;return(n=l.current)==null||n.addEventListener("initpreviewingbldr",x),()=>{var t;return(t=l.current)==null?void 0:t.removeEventListener("initpreviewingbldr",x)}},[]),o.useEffect(()=>{var n,t;if(k.isBrowser()){if(g.isEditing()&&!e.isNestedRender&&l.current&&l.current.dispatchEvent(new CustomEvent("initeditingbldr")),e.builderContextSignal.content&&P.getDefaultCanTrack(e.canTrack)){const a=(n=e.builderContextSignal.content)==null?void 0:n.testVariationId,r=(t=e.builderContextSignal.content)==null?void 0:t.id,c=e.apiKey;y._track({apiHost:e.apiHost,type:"impression",canTrack:!0,contentId:r,apiKey:c,variationId:a!==r?a:void 0})}O.isPreviewing()&&g.isEditing()}},[]),o.useEffect(()=>{},[e.content]),o.useEffect(()=>{u()},[e.builderContextSignal.rootState]),o.useEffect(()=>{e.data&&f(e.data)},[e.data]),o.useEffect(()=>{e.locale&&f({locale:e.locale})},[e.locale]),o.useEffect(()=>()=>{k.isBrowser()&&(window.removeEventListener("message",S),window.removeEventListener("builder:component:stateChangeListenerActivated",u))},[]),w.jsx(F.Provider,{value:e.builderContextSignal,children:e.builderContextSignal.content||H.needsElementRefDivForEditing()?w.jsx(D,{ref:l,onClick:n=>_(n),"builder-content-id":(q=e.builderContextSignal.content)==null?void 0:q.id,"builder-model":e.model,className:Q.getWrapperClassName(((I=e.content)==null?void 0:I.testVariationId)||((R=e.content)==null?void 0:R.id)),style:{display:!e.builderContextSignal.content&&H.needsElementRefDivForEditing()?"none":void 0},...T(),...e.contentWrapperProps,children:e.children}):null})}module.exports=Y;
1
+ "use client";"use strict";const w=require("react/jsx-runtime"),o=require("react"),F=require("../../../context/builder.context.cjs"),N=require("../../../functions/evaluate/evaluate.cjs"),V=require("../../../functions/fast-clone.cjs"),M=require("../../../functions/get-content/index.cjs"),y=require("../../../functions/is-browser.cjs"),f=require("../../../functions/is-editing.cjs"),O=require("../../../functions/is-previewing.cjs"),W=require("../../../functions/log-fetch.cjs"),A=require("../../../functions/register-component.cjs"),k=require("../../../functions/track/index.cjs"),$=require("../../../functions/track/interaction.cjs"),P=require("../../../helpers/canTrack.cjs"),z=require("../../../helpers/preview-lru-cache/set.cjs"),G=require("../../../helpers/subscribe-to-editor.cjs"),L=require("../../../scripts/init-editing.cjs"),J=require("../../block/animator.cjs"),H=require("./enable-editor.helpers.cjs"),Q=require("./styles.helpers.cjs"),X=require("next/navigation");function Y(e){var q,I,R;const l=o.useRef(null);function u(n){var i,r;const t={...e.builderContextSignal.rootState,...n};e.builderContextSignal.rootSetState?(r=(i=e.builderContextSignal).rootSetState)==null||r.call(i,t):e.builderContextSignal.rootState=t}function m(n){var i,r,a,c,d;const t={...e.builderContextSignal.content,...n,data:{...(i=e.builderContextSignal.content)==null?void 0:i.data,...n==null?void 0:n.data},meta:{...(r=e.builderContextSignal.content)==null?void 0:r.meta,...n==null?void 0:n.meta,breakpoints:((a=n==null?void 0:n.meta)==null?void 0:a.breakpoints)||((d=(c=e.builderContextSignal.content)==null?void 0:c.meta)==null?void 0:d.breakpoints)}};z.postPreviewContent({value:t,key:t.id}).then(()=>{j.refresh()})}function K(){return e.showContent?{}:{hidden:!0,"aria-hidden":!0}}const[T,Z]=o.useState(()=>e.contentWrapper||"div");function S(n){return G.createEditorListener({model:e.model,trustedHosts:e.trustedHosts,callbacks:{configureSdk:t=>{var a;const{breakpoints:i,contentId:r}=t;!r||r!==((a=e.builderContextSignal.content)==null?void 0:a.id)||i&&m({meta:{breakpoints:i}})},animation:t=>{J.triggerAnimation(t)},contentUpdate:t=>{m(t)},stateUpdate:t=>{u(t)}}})(n)}const[v,p]=o.useState(()=>({})),[b,ee]=o.useState(()=>({})),[h,D]=o.useState(()=>!1);function _(n){var t,i;if(e.builderContextSignal.content){const r=(t=e.builderContextSignal.content)==null?void 0:t.testVariationId,a=(i=e.builderContextSignal.content)==null?void 0:i.id;k._track({apiHost:e.apiHost,type:"click",canTrack:P.getDefaultCanTrack(e.canTrack),contentId:a,apiKey:e.apiKey,variationId:r!==a?r:void 0,...$.getInteractionPropertiesForEvent(n),unique:!h})}h||D(!0)}function U(){var t,i,r;const n=(r=(i=(t=e.builderContextSignal.content)==null?void 0:t.data)==null?void 0:i.httpRequests)!=null?r:{};Object.entries(n).forEach(([a,c])=>{if(!c||b[a]||v[a]&&!f.isEditing())return;b[a]=!0;const d=c.replace(/{{([^}]+)}}/g,(s,B)=>String(N.evaluate({code:B,context:e.context||{},localState:void 0,rootState:e.builderContextSignal.rootState,rootSetState:e.builderContextSignal.rootSetState})));W.logFetch(d),fetch(d).then(s=>s.json()).then(s=>{u({[a]:s}),v[a]=!0}).catch(s=>{console.error("error fetching dynamic data",c,s)}).finally(()=>{b[a]=!1})})}function g(){f.isEditing()&&window.dispatchEvent(new CustomEvent("builder:component:stateChange",{detail:{state:V.fastClone(e.builderContextSignal.rootState),ref:{name:e.model}}}))}function E(n){var t;window.addEventListener("message",S),L.registerInsertMenu(),L.setupBrowserForEditing({...e.locale?{locale:e.locale}:{},...e.enrich?{enrich:e.enrich}:{},...e.trustedHosts?{trustedHosts:e.trustedHosts}:{},modelName:(t=e.model)!=null?t:"",apiKey:e.apiKey}),Object.values(e.builderContextSignal.componentInfos).forEach(i=>{var r,a;if(!((r=i.models)!=null&&r.length)||i.models.includes(e.model)){const c=A.createRegisterComponentMessage(i);(a=window.parent)==null||a.postMessage(c,"*")}}),window.addEventListener("builder:component:stateChangeListenerActivated",g)}function x(n){var c;const t=new URL(location.href).searchParams,i=t.get("builder.preview"),r=t.get(`builder.overrides.${i}`),a=t.get("apiKey")||t.get("builder.space");(i==="BUILDER_STUDIO"||i===e.model&&a===e.apiKey&&(!e.content||r===e.content.id))&&M.fetchOneEntry({model:e.model,apiKey:e.apiKey,apiVersion:e.builderContextSignal.apiVersion,...i==="BUILDER_STUDIO"&&((c=e.context)!=null&&c.symbolId)?{query:{id:e.context.symbolId}}:{}}).then(d=>{d&&m(d)})}const j=X.useRouter(),C=o.useRef(!1);return C.current||(U(),g(),C.current=!0),o.useEffect(()=>{var n;return(n=l.current)==null||n.addEventListener("initeditingbldr",E),()=>{var t;return(t=l.current)==null?void 0:t.removeEventListener("initeditingbldr",E)}},[]),o.useEffect(()=>{var n;return(n=l.current)==null||n.addEventListener("initpreviewingbldr",x),()=>{var t;return(t=l.current)==null?void 0:t.removeEventListener("initpreviewingbldr",x)}},[]),o.useEffect(()=>{var n,t;if(y.isBrowser()){if(f.isEditing()&&!e.isNestedRender&&l.current&&l.current.dispatchEvent(new CustomEvent("initeditingbldr")),e.builderContextSignal.content&&P.getDefaultCanTrack(e.canTrack)){const r=(n=e.builderContextSignal.content)==null?void 0:n.testVariationId,a=(t=e.builderContextSignal.content)==null?void 0:t.id,c=e.apiKey;k._track({apiHost:e.apiHost,type:"impression",canTrack:!0,contentId:a,apiKey:c,variationId:r!==a?r:void 0})}O.isPreviewing()&&f.isEditing()}},[]),o.useEffect(()=>{},[e.content]),o.useEffect(()=>{g()},[e.builderContextSignal.rootState]),o.useEffect(()=>{e.data&&u(e.data)},[e.data]),o.useEffect(()=>{e.locale&&u({locale:e.locale})},[e.locale]),o.useEffect(()=>()=>{y.isBrowser()&&(window.removeEventListener("message",S),window.removeEventListener("builder:component:stateChangeListenerActivated",g))},[]),w.jsx(F.Provider,{value:e.builderContextSignal,children:e.builderContextSignal.content||H.needsElementRefDivForEditing()?w.jsx(T,{ref:l,onClick:n=>_(n),"builder-content-id":(q=e.builderContextSignal.content)==null?void 0:q.id,"builder-model":e.model,className:Q.getWrapperClassName(((I=e.content)==null?void 0:I.testVariationId)||((R=e.content)==null?void 0:R.id)),style:{display:!e.builderContextSignal.content&&H.needsElementRefDivForEditing()?"none":void 0},...K(),...e.contentWrapperProps,children:e.children}):null})}module.exports=Y;