@builder.io/sdk-react-nextjs 0.18.2 → 0.18.8

package/lib/edge/blocks/embed/embed.mjs

@@ -1,35 +1,36 @@
 "use client";
-import { jsx as m } from "react/jsx-runtime";
+import { jsx as a } from "react/jsx-runtime";
 import { useRef as d, useState as s, useEffect as f } from "react";
-import { isJsScript as g } from "./helpers.mjs";
-function y(l) {
-  const t = d(null), [c, h] = s(() => []), [i, E] = s(() => []), [u, p] = s(() => !1);
-  function a() {
+import { logger as g } from "../../helpers/logger.mjs";
+import { isJsScript as E } from "./helpers.mjs";
+function y(m) {
+  const t = d(null), [c, h] = s(() => []), [i, I] = s(() => []), [u, p] = s(() => !1);
+  function l() {
     if (!t.current || !t.current.getElementsByTagName)
       return;
     const o = t.current.getElementsByTagName("script");
-    for (let r = 0; r < o.length; r++) {
-      const e = o[r];
+    for (let n = 0; n < o.length; n++) {
+      const e = o[n];
       if (e.src && !c.includes(e.src)) {
         c.push(e.src);
-        const n = document.createElement("script");
-        n.async = !0, n.src = e.src, document.head.appendChild(n);
-      } else if (g(e) && !i.includes(e.innerText))
+        const r = document.createElement("script");
+        r.async = !0, r.src = e.src, document.head.appendChild(r);
+      } else if (E(e) && !i.includes(e.innerText))
         try {
           i.push(e.innerText), new Function(e.innerText)();
-        } catch (n) {
-          console.warn("`Embed`: Error running script:", n);
+        } catch (r) {
+          g.warn("[BUILDER.IO] `Embed`: Error running script:", r);
         }
     }
   }
   return f(() => {
-    t.current && !u && (p(!0), a());
-  }, [t.current, u]), /* @__PURE__ */ m(
+    t.current && !u && (p(!0), l());
+  }, [t.current, u]), /* @__PURE__ */ a(
     "div",
     {
       className: "builder-embed",
       ref: t,
-      dangerouslySetInnerHTML: { __html: l.content }
+      dangerouslySetInnerHTML: { __html: m.content }
     }
   );
 }

package/lib/edge/blocks/image/component-info.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("../../constants/file-types.cjs"),p={name:"Image",static:!0,image:"https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-insert_photo-24px.svg?alt=media&token=4e5d0ef4-f5e8-4e57-b3a9-38d63a9b9dc4",defaultStyles:{position:"relative",minHeight:"20px",minWidth:"20px",overflow:"hidden"},canHaveChildren:!0,inputs:[{name:"image",type:"file",bubble:!0,allowedFileTypes:m.IMAGE_FILE_TYPES,required:!0,defaultValue:"https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F72c80f114dc149019051b6852a9e3b7a",onChange:t=>{t.delete("srcset"),t.delete("noWebp");function s(e,o=6e4){return new Promise((u,n)=>{const i=document.createElement("img");let l=!1;i.onload=()=>{l=!0,u(i)},i.addEventListener("error",d=>{console.warn("Image load failed",d.error),n(d.error)}),i.src=e,setTimeout(()=>{l||n(new Error("Image load timed out"))},o)})}function h(e){return Math.round(e*1e3)/1e3}const a=t.get("image"),r=t.get("aspectRatio");if(fetch(a).then(e=>e.blob()).then(e=>{e.type.includes("svg")&&t.set("noWebp",!0)}),a&&(!r||r===.7041))return s(a).then(e=>{const o=t.get("aspectRatio");t.get("image")===a&&(!o||o===.7041)&&e.width&&e.height&&(t.set("aspectRatio",h(e.height/e.width)),t.set("height",e.height),t.set("width",e.width))})}},{name:"backgroundSize",type:"text",defaultValue:"cover",enum:[{label:"contain",value:"contain",helperText:"The image should never get cropped"},{label:"cover",value:"cover",helperText:"The image should fill it's box, cropping when needed"}]},{name:"backgroundPosition",type:"text",defaultValue:"center",enum:["center","top","left","right","bottom","top left","top right","bottom left","bottom right"]},{name:"altText",type:"string",helperText:"Text to display when the user has images off"},{name:"height",type:"number",hideFromUI:!0},{name:"width",type:"number",hideFromUI:!0},{name:"sizes",type:"string",hideFromUI:!0},{name:"srcset",type:"string",hideFromUI:!0},{name:"lazy",type:"boolean",defaultValue:!0,hideFromUI:!0},{name:"fitContent",type:"boolean",helperText:"When child blocks are provided, fit to them instead of using the image's aspect ratio",defaultValue:!0},{name:"highPriority",type:"boolean",advanced:!0,helperText:"Mark this image as high priority compared to other images on the page. This prevents lazy loading of the image and tells the browser to load this image before others on the page."},{name:"aspectRatio",type:"number",helperText:"This is the ratio of height/width, e.g. set to 1.5 for a 300px wide and 200px tall photo. Set to 0 to not force the image to maintain it's aspect ratio",advanced:!0,defaultValue:.7041}],shouldReceiveBuilderProps:{builderBlock:!0}};exports.componentInfo=p;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("../../constants/file-types.cjs"),m={name:"Image",static:!0,image:"https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-insert_photo-24px.svg?alt=media&token=4e5d0ef4-f5e8-4e57-b3a9-38d63a9b9dc4",defaultStyles:{position:"relative",minHeight:"20px",minWidth:"20px",overflow:"hidden"},canHaveChildren:!0,inputs:[{name:"image",type:"file",bubble:!0,allowedFileTypes:p.IMAGE_FILE_TYPES,required:!0,defaultValue:"https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F72c80f114dc149019051b6852a9e3b7a",onChange:t=>{t.delete("srcset"),t.delete("noWebp");function d(e,o=6e4){return new Promise((u,n)=>{const i=document.createElement("img");let l=!1;i.onload=()=>{l=!0,u(i)},i.addEventListener("error",s=>{console.warn("Image load failed",s.error),n(s.error)}),i.src=e,setTimeout(()=>{l||n(new Error("Image load timed out"))},o)})}function h(e){return Math.round(e*1e3)/1e3}const a=t.get("image"),r=t.get("aspectRatio");if(fetch(a).then(e=>e.blob()).then(e=>{e.type.includes("svg")&&t.set("noWebp",!0)}),a&&(!r||r===.7041))return d(a).then(e=>{const o=t.get("aspectRatio");t.get("image")===a&&(!o||o===.7041)&&e.width&&e.height&&(t.set("aspectRatio",h(e.height/e.width)),t.set("height",e.height),t.set("width",e.width))})}},{name:"backgroundSize",type:"text",defaultValue:"cover",enum:[{label:"contain",value:"contain",helperText:"The image should never get cropped"},{label:"cover",value:"cover",helperText:"The image should fill it's box, cropping when needed"}]},{name:"backgroundPosition",type:"text",defaultValue:"center",enum:["center","top","left","right","bottom","top left","top right","bottom left","bottom right"]},{name:"altText",type:"string",helperText:"Text to display when the user has images off"},{name:"title",type:"string",helperText:"Text to display when hovering over the asset"},{name:"height",type:"number",hideFromUI:!0},{name:"width",type:"number",hideFromUI:!0},{name:"sizes",type:"string",hideFromUI:!0},{name:"srcset",type:"string",hideFromUI:!0},{name:"lazy",type:"boolean",defaultValue:!0,hideFromUI:!0},{name:"fitContent",type:"boolean",helperText:"When child blocks are provided, fit to them instead of using the image's aspect ratio",defaultValue:!0},{name:"highPriority",type:"boolean",advanced:!0,helperText:"Mark this image as high priority compared to other images on the page. This prevents lazy loading of the image and tells the browser to load this image before others on the page."},{name:"aspectRatio",type:"number",helperText:"This is the ratio of height/width, e.g. set to 1.5 for a 300px wide and 200px tall photo. Set to 0 to not force the image to maintain it's aspect ratio",advanced:!0,defaultValue:.7041}],shouldReceiveBuilderProps:{builderBlock:!0}};exports.componentInfo=m;

package/lib/edge/blocks/image/component-info.mjs

@@ -1,5 +1,5 @@
-import { IMAGE_FILE_TYPES as m } from "../../constants/file-types.mjs";
-const g = {
+import { IMAGE_FILE_TYPES as p } from "../../constants/file-types.mjs";
+const c = {
   name: "Image",
   static: !0,
   image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-insert_photo-24px.svg?alt=media&token=4e5d0ef4-f5e8-4e57-b3a9-38d63a9b9dc4",
@@ -14,19 +14,19 @@ const g = {
     name: "image",
     type: "file",
     bubble: !0,
-    allowedFileTypes: m,
+    allowedFileTypes: p,
     required: !0,
     defaultValue: "https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F72c80f114dc149019051b6852a9e3b7a",
     onChange: (t) => {
       t.delete("srcset"), t.delete("noWebp");
-      function h(e, o = 6e4) {
+      function d(e, o = 6e4) {
         return new Promise((u, n) => {
           const i = document.createElement("img");
           let l = !1;
           i.onload = () => {
             l = !0, u(i);
-          }, i.addEventListener("error", (d) => {
-            console.warn("Image load failed", d.error), n(d.error);
+          }, i.addEventListener("error", (h) => {
+            console.warn("Image load failed", h.error), n(h.error);
           }), i.src = e, setTimeout(() => {
             l || n(new Error("Image load timed out"));
           }, o);
@@ -39,7 +39,7 @@ const g = {
       if (fetch(a).then((e) => e.blob()).then((e) => {
         e.type.includes("svg") && t.set("noWebp", !0);
       }), a && (!r || r === 0.7041))
-        return h(a).then((e) => {
+        return d(a).then((e) => {
           const o = t.get("aspectRatio");
           t.get("image") === a && (!o || o === 0.7041) && e.width && e.height && (t.set("aspectRatio", s(e.height / e.width)), t.set("height", e.height), t.set("width", e.width));
         });
@@ -66,6 +66,10 @@ const g = {
     name: "altText",
     type: "string",
     helperText: "Text to display when the user has images off"
+  }, {
+    name: "title",
+    type: "string",
+    helperText: "Text to display when hovering over the asset"
   }, {
     name: "height",
     type: "number",
@@ -109,5 +113,5 @@ const g = {
   }
 };
 export {
-  g as componentInfo
+  c as componentInfo
 };

package/lib/edge/blocks/image/image.cjs

@@ -1,11 +1,11 @@
-"use client";"use strict";const t=require("react/jsx-runtime"),a=require("./image.helpers.cjs");function b(e){var s,r,u,o,d,g;function n(){var h;const i=e.image||e.src;if(!i||!(typeof i=="string"&&(i.match(/builder\.io/)||i.match(/cdn\.shopify\.com/))))return e.srcset;if(!e.noWebp){if(e.srcset&&((h=e.image)!=null&&h.includes("builder.io/api/v1/image"))){if(!e.srcset.includes(e.image.split("?")[0]))return console.debug("Removed given srcset"),a.getSrcSet(i)}else if(e.image&&!e.srcset)return a.getSrcSet(i);return a.getSrcSet(i)}}function l(){var c;return(c=n==null?void 0:n())!=null&&c.match(/builder\.io/)&&!e.noWebp?n().replace(/\?/g,"?format=webp&"):""}function m(){const c={position:"absolute",height:"100%",width:"100%",left:"0px",top:"0px"};return e.aspectRatio?c:void 0}return t.jsxs(t.Fragment,{children:[t.jsxs(t.Fragment,{children:[t.jsxs("picture",{children:[l()?t.jsx("source",{type:"image/webp",srcSet:l()}):null,t.jsx("img",{loading:e.highPriority?"eager":"lazy",fetchPriority:e.highPriority?"high":"auto",alt:e.altText,role:e.altText?void 0:"presentation",style:{objectPosition:e.backgroundPosition||"center",objectFit:e.backgroundSize||"cover",...m()},className:"builder-image"+(e.className?" "+e.className:"")+" img-606b99a4",src:e.image,srcSet:n(),sizes:e.sizes})]}),e.aspectRatio&&!((r=(s=e.builderBlock)==null?void 0:s.children)!=null&&r.length&&e.fitContent)?t.jsx("div",{className:"builder-image-sizer div-606b99a4",style:{paddingTop:e.aspectRatio*100+"%"}}):null,(o=(u=e.builderBlock)==null?void 0:u.children)!=null&&o.length&&e.fitContent?t.jsx(t.Fragment,{children:e.children}):null,!e.fitContent&&((g=(d=e.builderBlock)==null?void 0:d.children)!=null&&g.length)?t.jsx("div",{className:"div-606b99a4-2",children:e.children}):null]}),t.jsx("style",{children:`.img-606b99a4 {
+"use client";"use strict";const t=require("react/jsx-runtime"),l=require("./image.helpers.cjs");function f(e){var s,r,u,d,o,g;function n(){var h;const i=e.image||e.src;if(!i||!(typeof i=="string"&&(i.match(/builder\.io/)||i.match(/cdn\.shopify\.com/))))return e.srcset;if(!e.noWebp){if(e.srcset&&((h=e.image)!=null&&h.includes("builder.io/api/v1/image"))){if(!e.srcset.includes(e.image.split("?")[0]))return console.debug("Removed given srcset"),l.getSrcSet(i)}else if(e.image&&!e.srcset)return l.getSrcSet(i);return l.getSrcSet(i)}}function a(){var c;return(c=n==null?void 0:n())!=null&&c.match(/builder\.io/)&&!e.noWebp?n().replace(/\?/g,"?format=webp&"):""}function m(){const c={position:"absolute",height:"100%",width:"100%",left:"0px",top:"0px"};return e.aspectRatio?c:void 0}return t.jsxs(t.Fragment,{children:[t.jsxs(t.Fragment,{children:[t.jsxs("picture",{children:[a()?t.jsx("source",{type:"image/webp",srcSet:a()}):null,t.jsx("img",{loading:e.highPriority?"eager":"lazy",fetchPriority:e.highPriority?"high":"auto",alt:e.altText,title:e.title,role:e.altText?void 0:"presentation",style:{objectPosition:e.backgroundPosition||"center",objectFit:e.backgroundSize||"cover",...m()},className:"builder-image"+(e.className?" "+e.className:"")+" img-0525a549",src:e.image,srcSet:n(),sizes:e.sizes})]}),e.aspectRatio&&!((r=(s=e.builderBlock)==null?void 0:s.children)!=null&&r.length&&e.fitContent)?t.jsx("div",{className:"builder-image-sizer div-0525a549",style:{paddingTop:e.aspectRatio*100+"%"}}):null,(d=(u=e.builderBlock)==null?void 0:u.children)!=null&&d.length&&e.fitContent?t.jsx(t.Fragment,{children:e.children}):null,!e.fitContent&&((g=(o=e.builderBlock)==null?void 0:o.children)!=null&&g.length)?t.jsx("div",{className:"div-0525a549-2",children:e.children}):null]}),t.jsx("style",{children:`.img-0525a549 {
   opacity: 1;
   transition: opacity 0.2s ease-in-out;
-}.div-606b99a4 {
+}.div-0525a549 {
   width: 100%;
   pointer-events: none;
   font-size: 0;
-}.div-606b99a4-2 {
+}.div-0525a549-2 {
   display: flex;
   flex-direction: column;
   align-items: stretch;
@@ -14,4 +14,4 @@
   left: 0;
   width: 100%;
   height: 100%;
-}`})]})}module.exports=b;
+}`})]})}module.exports=f;

package/lib/edge/blocks/image/image.mjs

@@ -2,16 +2,16 @@
 import { jsxs as a, Fragment as c, jsx as t } from "react/jsx-runtime";
 import { getSrcSet as o } from "./image.helpers.mjs";
 function x(e) {
-  var d, s, u, g, h, m;
+  var d, u, s, g, h, m;
   function n() {
-    var b;
+    var f;
     const i = e.image || e.src;
     if (!i || // We can auto add srcset for cdn.builder.io and shopify
     // images, otherwise you can supply this prop manually
     !(typeof i == "string" && (i.match(/builder\.io/) || i.match(/cdn\.shopify\.com/))))
       return e.srcset;
     if (!e.noWebp) {
-      if (e.srcset && ((b = e.image) != null && b.includes("builder.io/api/v1/image"))) {
+      if (e.srcset && ((f = e.image) != null && f.includes("builder.io/api/v1/image"))) {
         if (!e.srcset.includes(e.image.split("?")[0]))
           return console.debug("Removed given srcset"), o(i);
       } else if (e.image && !e.srcset)
@@ -23,7 +23,7 @@ function x(e) {
     var l;
     return (l = n == null ? void 0 : n()) != null && l.match(/builder\.io/) && !e.noWebp ? n().replace(/\?/g, "?format=webp&") : "";
   }
-  function f() {
+  function b() {
     const l = {
       position: "absolute",
       height: "100%",
@@ -43,39 +43,40 @@ function x(e) {
             loading: e.highPriority ? "eager" : "lazy",
             fetchPriority: e.highPriority ? "high" : "auto",
             alt: e.altText,
+            title: e.title,
             role: e.altText ? void 0 : "presentation",
             style: {
               objectPosition: e.backgroundPosition || "center",
               objectFit: e.backgroundSize || "cover",
-              ...f()
+              ...b()
             },
-            className: "builder-image" + (e.className ? " " + e.className : "") + " img-606b99a4",
+            className: "builder-image" + (e.className ? " " + e.className : "") + " img-0525a549",
             src: e.image,
             srcSet: n(),
             sizes: e.sizes
           }
         )
       ] }),
-      e.aspectRatio && !((s = (d = e.builderBlock) == null ? void 0 : d.children) != null && s.length && e.fitContent) ? /* @__PURE__ */ t(
+      e.aspectRatio && !((u = (d = e.builderBlock) == null ? void 0 : d.children) != null && u.length && e.fitContent) ? /* @__PURE__ */ t(
         "div",
         {
-          className: "builder-image-sizer div-606b99a4",
+          className: "builder-image-sizer div-0525a549",
           style: {
             paddingTop: e.aspectRatio * 100 + "%"
           }
         }
       ) : null,
-      (g = (u = e.builderBlock) == null ? void 0 : u.children) != null && g.length && e.fitContent ? /* @__PURE__ */ t(c, { children: e.children }) : null,
-      !e.fitContent && ((m = (h = e.builderBlock) == null ? void 0 : h.children) != null && m.length) ? /* @__PURE__ */ t("div", { className: "div-606b99a4-2", children: e.children }) : null
+      (g = (s = e.builderBlock) == null ? void 0 : s.children) != null && g.length && e.fitContent ? /* @__PURE__ */ t(c, { children: e.children }) : null,
+      !e.fitContent && ((m = (h = e.builderBlock) == null ? void 0 : h.children) != null && m.length) ? /* @__PURE__ */ t("div", { className: "div-0525a549-2", children: e.children }) : null
     ] }),
-    /* @__PURE__ */ t("style", { children: `.img-606b99a4 {
+    /* @__PURE__ */ t("style", { children: `.img-0525a549 {
   opacity: 1;
   transition: opacity 0.2s ease-in-out;
-}.div-606b99a4 {
+}.div-0525a549 {
   width: 100%;
   pointer-events: none;
   font-size: 0;
-}.div-606b99a4-2 {
+}.div-0525a549-2 {
   display: flex;
   flex-direction: column;
   align-items: stretch;

package/lib/edge/components/blocks/blocks-wrapper.cjs

@@ -1,5 +1,5 @@
-"use client";"use strict";const i=require("react/jsx-runtime"),r=require("react"),l=require("../../functions/is-editing.cjs");function u(e){const c=r.useRef(null);function o(){var t;return["builder-blocks",(t=e.blocks)!=null&&t.length?"":"no-blocks",e.classNameProp].filter(Boolean).join(" ")}function a(){if(!e.path)return;const t="this.",n="component.options.";return e.path.startsWith(t)?e.path.replace(t,""):e.path.startsWith(n)?e.path:`${n}${e.path||""}`}function s(){var t,n;l.isEditing()&&!((t=e.blocks)!=null&&t.length)&&((n=window.parent)==null||n.postMessage({type:"builder.clickEmptyBlocks",data:{parentElementId:e.parent,dataPath:a()}},"*"))}function d(){var t,n;l.isEditing()&&!((t=e.blocks)!=null&&t.length)&&((n=window.parent)==null||n.postMessage({type:"builder.hoverEmptyBlocks",data:{parentElementId:e.parent,dataPath:a()}},"*"))}return r.useEffect(()=>{},[]),i.jsxs(i.Fragment,{children:[i.jsx(e.BlocksWrapper,{ref:c,className:o()+" props-blocks-wrapper-78b0d3be","builder-path":a(),"builder-parent-id":e.parent,style:e.styleProp,onClick:t=>s(),onMouseEnter:t=>d(),onKeyPress:t=>s(),...e.BlocksWrapperProps,children:e.children}),i.jsx("style",{children:`.props-blocks-wrapper-78b0d3be {
+"use client";"use strict";const a=require("react/jsx-runtime"),i=require("react"),r=require("../../functions/is-editing.cjs");function d(e){const c=i.useRef(null);i.useState(()=>!1);function o(){var t;return["builder-blocks",(t=e.blocks)!=null&&t.length?"":"no-blocks",e.classNameProp].filter(Boolean).join(" ")}function s(){if(!e.path)return;const t="this.",n="component.options.";return e.path.startsWith(t)?e.path.replace(t,""):e.path.startsWith(n)?e.path:`${n}${e.path||""}`}function l(){var t,n;r.isEditing()&&!((t=e.blocks)!=null&&t.length)&&((n=window.parent)==null||n.postMessage({type:"builder.clickEmptyBlocks",data:{parentElementId:e.parent,dataPath:s()}},"*"))}function u(){var t,n;r.isEditing()&&!((t=e.blocks)!=null&&t.length)&&((n=window.parent)==null||n.postMessage({type:"builder.hoverEmptyBlocks",data:{parentElementId:e.parent,dataPath:s()}},"*"))}return i.useEffect(()=>{},[]),i.useEffect(()=>{},[e.blocks]),a.jsxs(a.Fragment,{children:[a.jsx(e.BlocksWrapper,{ref:c,className:o()+" props-blocks-wrapper-2b05e766","builder-path":s(),"builder-parent-id":e.parent,style:e.styleProp,onClick:t=>l(),onMouseEnter:t=>u(),onKeyPress:t=>l(),...e.BlocksWrapperProps,children:e.children}),a.jsx("style",{children:`.props-blocks-wrapper-2b05e766 {
   display: flex;
   flex-direction: column;
   align-items: stretch;
-}`})]})}module.exports=u;
+}`})]})}module.exports=d;

package/lib/edge/components/blocks/blocks-wrapper.mjs

@@ -1,10 +1,11 @@
 "use client";
-import { jsxs as d, Fragment as h, jsx as r } from "react/jsx-runtime";
-import { useRef as f, useEffect as u } from "react";
-import { isEditing as i } from "../../functions/is-editing.mjs";
-function k(e) {
-  const o = f(null);
-  function s() {
+import { jsxs as h, Fragment as f, jsx as r } from "react/jsx-runtime";
+import { useRef as u, useState as k, useEffect as i } from "react";
+import { isEditing as s } from "../../functions/is-editing.mjs";
+function y(e) {
+  const c = u(null);
+  k(() => !1);
+  function o() {
     var t;
     return [
       "builder-blocks",
@@ -20,7 +21,7 @@ function k(e) {
   }
   function l() {
     var t, n;
-    i() && !((t = e.blocks) != null && t.length) && ((n = window.parent) == null || n.postMessage(
+    s() && !((t = e.blocks) != null && t.length) && ((n = window.parent) == null || n.postMessage(
       {
         type: "builder.clickEmptyBlocks",
         data: {
@@ -31,9 +32,9 @@ function k(e) {
       "*"
     ));
   }
-  function c() {
+  function d() {
     var t, n;
-    i() && !((t = e.blocks) != null && t.length) && ((n = window.parent) == null || n.postMessage(
+    s() && !((t = e.blocks) != null && t.length) && ((n = window.parent) == null || n.postMessage(
       {
         type: "builder.hoverEmptyBlocks",
         data: {
@@ -44,24 +45,25 @@ function k(e) {
       "*"
     ));
   }
-  return u(() => {
-  }, []), /* @__PURE__ */ d(h, { children: [
+  return i(() => {
+  }, []), i(() => {
+  }, [e.blocks]), /* @__PURE__ */ h(f, { children: [
     /* @__PURE__ */ r(
       e.BlocksWrapper,
       {
-        ref: o,
-        className: s() + " props-blocks-wrapper-78b0d3be",
+        ref: c,
+        className: o() + " props-blocks-wrapper-2b05e766",
         "builder-path": a(),
         "builder-parent-id": e.parent,
         style: e.styleProp,
         onClick: (t) => l(),
-        onMouseEnter: (t) => c(),
+        onMouseEnter: (t) => d(),
         onKeyPress: (t) => l(),
         ...e.BlocksWrapperProps,
         children: e.children
       }
     ),
-    /* @__PURE__ */ r("style", { children: `.props-blocks-wrapper-78b0d3be {
+    /* @__PURE__ */ r("style", { children: `.props-blocks-wrapper-2b05e766 {
   display: flex;
   flex-direction: column;
   align-items: stretch;
@@ -69,5 +71,5 @@ function k(e) {
   ] });
 }
 export {
-  k as default
+  y as default
 };

package/lib/edge/components/content-variants/helpers.cjs

@@ -1,9 +1,9 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("../../constants/target.cjs"),S=require("../../functions/is-browser.cjs"),r=require("./inlined-fns.cjs"),e="builderIoAbTest",s="builderIoRenderContent",a=i=>Object.values((i==null?void 0:i.variations)||{}).map(t=>({...t,testVariationId:t.id,id:i==null?void 0:i.id})),d=({canTrack:i,content:t})=>!(!(a(t).length>0)||!i||S.isBrowser()),I=i=>i==="react"||i==="reactNative",n=I(o.TARGET),T=()=>`
-  window.${e} = ${r.UPDATE_COOKIES_AND_STYLES_SCRIPT}
-  window.${s} = ${r.UPDATE_VARIANT_VISIBILITY_SCRIPT}
-  `,c=(i,t)=>`
-  window.${e}(
-    "${t}",${JSON.stringify(i)}, ${n}
-  )`,g=({contentId:i,variationId:t})=>`window.${s}(
-    "${t}", "${i}", ${n}
-  )`;exports.checkShouldRenderVariants=d;exports.getInitVariantsFnsScriptString=T;exports.getUpdateCookieAndStylesScript=c;exports.getUpdateVariantVisibilityScript=g;exports.getVariants=a;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../constants/target.cjs"),S=require("../../functions/is-browser.cjs"),r=require("./inlined-fns.cjs"),s="builderIoAbTest",a="builderIoRenderContent",n=i=>Object.values((i==null?void 0:i.variations)||{}).map(t=>({...t,testVariationId:t.id,id:i==null?void 0:i.id})),d=({canTrack:i,content:t})=>!(!(n(t).length>0)||!i||S.isBrowser()),I=i=>i==="react"||i==="reactNative",T=e.TARGET==="angular",o=I(e.TARGET),c=()=>`
+  window.${s} = ${r.UPDATE_COOKIES_AND_STYLES_SCRIPT}
+  window.${a} = ${r.UPDATE_VARIANT_VISIBILITY_SCRIPT}
+  `,g=(i,t)=>`
+  window.${s}(
+    "${t}",${JSON.stringify(i)}, ${o}, ${T}
+  )`,l=({contentId:i,variationId:t})=>`window.${a}(
+    "${t}", "${i}", ${o}
+  )`;exports.checkShouldRenderVariants=d;exports.getInitVariantsFnsScriptString=c;exports.getUpdateCookieAndStylesScript=g;exports.getUpdateVariantVisibilityScript=l;exports.getVariants=n;

package/lib/edge/components/content-variants/helpers.mjs

@@ -1,29 +1,29 @@
-import { TARGET as e } from "../../constants/target.mjs";
+import { TARGET as t } from "../../constants/target.mjs";
 import { isBrowser as o } from "../../functions/is-browser.mjs";
-import { UPDATE_COOKIES_AND_STYLES_SCRIPT as I, UPDATE_VARIANT_VISIBILITY_SCRIPT as n } from "./inlined-fns.mjs";
-const t = "builderIoAbTest", s = "builderIoRenderContent", S = (i) => Object.values((i == null ? void 0 : i.variations) || {}).map((r) => ({
+import { UPDATE_COOKIES_AND_STYLES_SCRIPT as n, UPDATE_VARIANT_VISIBILITY_SCRIPT as I } from "./inlined-fns.mjs";
+const s = "builderIoAbTest", a = "builderIoRenderContent", S = (i) => Object.values((i == null ? void 0 : i.variations) || {}).map((r) => ({
   ...r,
   testVariationId: r.id,
   id: i == null ? void 0 : i.id
-})), $ = ({
+})), V = ({
   canTrack: i,
   content: r
-}) => !(!(S(r).length > 0) || !i || o()), T = (i) => i === "react" || i === "reactNative", a = T(e), E = () => `
-  window.${t} = ${I}
+}) => !(!(S(r).length > 0) || !i || o()), T = (i) => i === "react" || i === "reactNative", d = t === "angular", e = T(t), g = () => `
   window.${s} = ${n}
-  `, f = (i, r) => `
-  window.${t}(
-    "${r}",${JSON.stringify(i)}, ${a}
-  )`, l = ({
+  window.${a} = ${I}
+  `, u = (i, r) => `
+  window.${s}(
+    "${r}",${JSON.stringify(i)}, ${e}, ${d}
+  )`, E = ({
   contentId: i,
   variationId: r
-}) => `window.${s}(
-    "${r}", "${i}", ${a}
+}) => `window.${a}(
+    "${r}", "${i}", ${e}
   )`;
 export {
-  $ as checkShouldRenderVariants,
-  E as getInitVariantsFnsScriptString,
-  f as getUpdateCookieAndStylesScript,
-  l as getUpdateVariantVisibilityScript,
+  V as checkShouldRenderVariants,
+  g as getInitVariantsFnsScriptString,
+  u as getUpdateCookieAndStylesScript,
+  E as getUpdateVariantVisibilityScript,
   S as getVariants
 };

package/lib/edge/components/content-variants/inlined-fns.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=`function updateCookiesAndStyles(contentId, variants, isHydrationTarget) {
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=`function updateCookiesAndStyles(contentId, variants, isHydrationTarget, isAngularSDK) {
   function getAndSetVariantId() {
     function setCookie(name, value, days) {
       let expires = '';
@@ -40,7 +40,10 @@
     return contentId;
   }
   const winningVariantId = getAndSetVariantId();
-  const styleEl = document.currentScript?.previousElementSibling;
+  let styleEl = document.currentScript?.previousElementSibling;
+  if (isAngularSDK) {
+    styleEl = document.currentScript?.parentElement?.previousElementSibling?.querySelector('style');
+  }
   if (isHydrationTarget) {
     styleEl.remove();
     const thisScriptEl = document.currentScript;

package/lib/edge/components/content-variants/inlined-fns.mjs

@@ -1,4 +1,4 @@
-const n = `function updateCookiesAndStyles(contentId, variants, isHydrationTarget) {
+const n = `function updateCookiesAndStyles(contentId, variants, isHydrationTarget, isAngularSDK) {
   function getAndSetVariantId() {
     function setCookie(name, value, days) {
       let expires = '';
@@ -40,7 +40,10 @@ const n = `function updateCookiesAndStyles(contentId, variants, isHydrationTarge
     return contentId;
   }
   const winningVariantId = getAndSetVariantId();
-  const styleEl = document.currentScript?.previousElementSibling;
+  let styleEl = document.currentScript?.previousElementSibling;
+  if (isAngularSDK) {
+    styleEl = document.currentScript?.parentElement?.previousElementSibling?.querySelector('style');
+  }
   if (isHydrationTarget) {
     styleEl.remove();
     const thisScriptEl = document.currentScript;

package/lib/edge/constants/sdk-version.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e="0.18.2";exports.SDK_VERSION=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e="0.18.8";exports.SDK_VERSION=e;

package/lib/edge/constants/sdk-version.mjs

@@ -1,4 +1,4 @@
-const o = "0.18.2";
+const o = "0.18.8";
 export {
   o as SDK_VERSION
 };

package/lib/node/blocks/custom-code/custom-code.cjs

@@ -1 +1 @@
-"use client";"use strict";const p=require("react/jsx-runtime"),n=require("react");function l(r){const s=n.useRef(null),[i,d]=n.useState(()=>[]),[u,m]=n.useState(()=>[]);return n.useEffect(()=>{var a;if(!((a=s.current)!=null&&a.getElementsByTagName)||typeof window=="undefined")return;const o=s.current.getElementsByTagName("script");for(let c=0;c<o.length;c++){const e=o[c];if(e.src){if(i.includes(e.src))continue;i.push(e.src);const t=document.createElement("script");t.async=!0,t.src=e.src,document.head.appendChild(t)}else if(!e.type||["text/javascript","application/javascript","application/ecmascript"].includes(e.type)){if(u.includes(e.innerText))continue;try{u.push(e.innerText),new Function(e.innerText)()}catch(t){console.warn("`CustomCode`: Error running script:",t)}}}},[]),p.jsx("div",{ref:s,className:"builder-custom-code"+(r.replaceNodes?" replace-nodes":""),dangerouslySetInnerHTML:{__html:r.code}})}module.exports=l;
+"use client";"use strict";const l=require("react/jsx-runtime"),n=require("react"),p=require("../../functions/is-editing.cjs"),f=require("../../helpers/logger.cjs");function m(s){const r=n.useRef(null),[i,g]=n.useState(()=>[]),[u,E]=n.useState(()=>[]);function o(){var d;if(!r.current||!((d=r.current)!=null&&d.getElementsByTagName)||typeof window=="undefined")return;const a=r.current.getElementsByTagName("script");for(let c=0;c<a.length;c++){const e=a[c];if(e.src){if(i.includes(e.src))continue;i.push(e.src);const t=document.createElement("script");t.async=!0,t.src=e.src,document.head.appendChild(t)}else if(!e.type||["text/javascript","application/javascript","application/ecmascript"].includes(e.type)){if(u.includes(e.innerText))continue;try{u.push(e.innerText),new Function(e.innerText)()}catch(t){f.logger.warn("[BUILDER.IO] `CustomCode`: Error running script:",t)}}}}return n.useEffect(()=>{o()},[]),n.useEffect(()=>{p.isEditing()&&o()},[s.code]),l.jsx("div",{ref:r,className:"builder-custom-code"+(s.replaceNodes?" replace-nodes":""),dangerouslySetInnerHTML:{__html:s.code}})}module.exports=m;

package/lib/node/blocks/custom-code/custom-code.mjs

@@ -1,19 +1,21 @@
 "use client";
-import { jsx as p } from "react/jsx-runtime";
-import { useRef as l, useState as a, useEffect as d } from "react";
-function h(s) {
-  const n = l(null), [c, m] = a(() => []), [i, f] = a(() => []);
-  return d(() => {
-    var u;
-    if (!((u = n.current) != null && u.getElementsByTagName) || typeof window == "undefined")
+import { jsx as l } from "react/jsx-runtime";
+import { useRef as m, useState as a, useEffect as d } from "react";
+import { isEditing as f } from "../../functions/is-editing.mjs";
+import { logger as g } from "../../helpers/logger.mjs";
+function w(r) {
+  const n = m(null), [s, y] = a(() => []), [i, h] = a(() => []);
+  function o() {
+    var p;
+    if (!n.current || !((p = n.current) != null && p.getElementsByTagName) || typeof window == "undefined")
       return;
-    const o = n.current.getElementsByTagName("script");
-    for (let r = 0; r < o.length; r++) {
-      const e = o[r];
+    const u = n.current.getElementsByTagName("script");
+    for (let c = 0; c < u.length; c++) {
+      const e = u[c];
       if (e.src) {
-        if (c.includes(e.src))
+        if (s.includes(e.src))
           continue;
-        c.push(e.src);
+        s.push(e.src);
         const t = document.createElement("script");
         t.async = !0, t.src = e.src, document.head.appendChild(t);
       } else if (!e.type || [
@@ -26,19 +28,27 @@ function h(s) {
         try {
           i.push(e.innerText), new Function(e.innerText)();
         } catch (t) {
-          console.warn("`CustomCode`: Error running script:", t);
+          g.warn(
+            "[BUILDER.IO] `CustomCode`: Error running script:",
+            t
+          );
         }
       }
     }
-  }, []), /* @__PURE__ */ p(
+  }
+  return d(() => {
+    o();
+  }, []), d(() => {
+    f() && o();
+  }, [r.code]), /* @__PURE__ */ l(
     "div",
     {
       ref: n,
-      className: "builder-custom-code" + (s.replaceNodes ? " replace-nodes" : ""),
-      dangerouslySetInnerHTML: { __html: s.code }
+      className: "builder-custom-code" + (r.replaceNodes ? " replace-nodes" : ""),
+      dangerouslySetInnerHTML: { __html: r.code }
     }
   );
 }
 export {
-  h as default
+  w as default
 };

package/lib/node/blocks/embed/embed.cjs

@@ -1 +1 @@
-"use client";"use strict";const d=require("react/jsx-runtime"),r=require("react"),m=require("./helpers.cjs");function f(a){const t=r.useRef(null),[c,S]=r.useState(()=>[]),[i,h]=r.useState(()=>[]),[u,l]=r.useState(()=>!1);function p(){if(!t.current||!t.current.getElementsByTagName)return;const o=t.current.getElementsByTagName("script");for(let s=0;s<o.length;s++){const e=o[s];if(e.src&&!c.includes(e.src)){c.push(e.src);const n=document.createElement("script");n.async=!0,n.src=e.src,document.head.appendChild(n)}else if(m.isJsScript(e)&&!i.includes(e.innerText))try{i.push(e.innerText),new Function(e.innerText)()}catch(n){console.warn("`Embed`: Error running script:",n)}}}return r.useEffect(()=>{t.current&&!u&&(l(!0),p())},[t.current,u]),d.jsx("div",{className:"builder-embed",ref:t,dangerouslySetInnerHTML:{__html:a.content}})}module.exports=f;
+"use client";"use strict";const d=require("react/jsx-runtime"),r=require("react"),m=require("../../helpers/logger.cjs"),f=require("./helpers.cjs");function g(l){const t=r.useRef(null),[c,S]=r.useState(()=>[]),[i,h]=r.useState(()=>[]),[u,a]=r.useState(()=>!1);function p(){if(!t.current||!t.current.getElementsByTagName)return;const o=t.current.getElementsByTagName("script");for(let s=0;s<o.length;s++){const e=o[s];if(e.src&&!c.includes(e.src)){c.push(e.src);const n=document.createElement("script");n.async=!0,n.src=e.src,document.head.appendChild(n)}else if(f.isJsScript(e)&&!i.includes(e.innerText))try{i.push(e.innerText),new Function(e.innerText)()}catch(n){m.logger.warn("[BUILDER.IO] `Embed`: Error running script:",n)}}}return r.useEffect(()=>{t.current&&!u&&(a(!0),p())},[t.current,u]),d.jsx("div",{className:"builder-embed",ref:t,dangerouslySetInnerHTML:{__html:l.content}})}module.exports=g;

package/lib/node/blocks/embed/embed.mjs

@@ -1,35 +1,36 @@
 "use client";
-import { jsx as m } from "react/jsx-runtime";
+import { jsx as a } from "react/jsx-runtime";
 import { useRef as d, useState as s, useEffect as f } from "react";
-import { isJsScript as g } from "./helpers.mjs";
-function y(l) {
-  const t = d(null), [c, h] = s(() => []), [i, E] = s(() => []), [u, p] = s(() => !1);
-  function a() {
+import { logger as g } from "../../helpers/logger.mjs";
+import { isJsScript as E } from "./helpers.mjs";
+function y(m) {
+  const t = d(null), [c, h] = s(() => []), [i, I] = s(() => []), [u, p] = s(() => !1);
+  function l() {
     if (!t.current || !t.current.getElementsByTagName)
       return;
     const o = t.current.getElementsByTagName("script");
-    for (let r = 0; r < o.length; r++) {
-      const e = o[r];
+    for (let n = 0; n < o.length; n++) {
+      const e = o[n];
       if (e.src && !c.includes(e.src)) {
         c.push(e.src);
-        const n = document.createElement("script");
-        n.async = !0, n.src = e.src, document.head.appendChild(n);
-      } else if (g(e) && !i.includes(e.innerText))
+        const r = document.createElement("script");
+        r.async = !0, r.src = e.src, document.head.appendChild(r);
+      } else if (E(e) && !i.includes(e.innerText))
         try {
           i.push(e.innerText), new Function(e.innerText)();
-        } catch (n) {
-          console.warn("`Embed`: Error running script:", n);
+        } catch (r) {
+          g.warn("[BUILDER.IO] `Embed`: Error running script:", r);
         }
     }
   }
   return f(() => {
-    t.current && !u && (p(!0), a());
-  }, [t.current, u]), /* @__PURE__ */ m(
+    t.current && !u && (p(!0), l());
+  }, [t.current, u]), /* @__PURE__ */ a(
     "div",
     {
       className: "builder-embed",
       ref: t,
-      dangerouslySetInnerHTML: { __html: l.content }
+      dangerouslySetInnerHTML: { __html: m.content }
     }
   );
 }

package/lib/node/blocks/image/component-info.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("../../constants/file-types.cjs"),p={name:"Image",static:!0,image:"https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-insert_photo-24px.svg?alt=media&token=4e5d0ef4-f5e8-4e57-b3a9-38d63a9b9dc4",defaultStyles:{position:"relative",minHeight:"20px",minWidth:"20px",overflow:"hidden"},canHaveChildren:!0,inputs:[{name:"image",type:"file",bubble:!0,allowedFileTypes:m.IMAGE_FILE_TYPES,required:!0,defaultValue:"https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F72c80f114dc149019051b6852a9e3b7a",onChange:t=>{t.delete("srcset"),t.delete("noWebp");function s(e,o=6e4){return new Promise((u,n)=>{const i=document.createElement("img");let l=!1;i.onload=()=>{l=!0,u(i)},i.addEventListener("error",d=>{console.warn("Image load failed",d.error),n(d.error)}),i.src=e,setTimeout(()=>{l||n(new Error("Image load timed out"))},o)})}function h(e){return Math.round(e*1e3)/1e3}const a=t.get("image"),r=t.get("aspectRatio");if(fetch(a).then(e=>e.blob()).then(e=>{e.type.includes("svg")&&t.set("noWebp",!0)}),a&&(!r||r===.7041))return s(a).then(e=>{const o=t.get("aspectRatio");t.get("image")===a&&(!o||o===.7041)&&e.width&&e.height&&(t.set("aspectRatio",h(e.height/e.width)),t.set("height",e.height),t.set("width",e.width))})}},{name:"backgroundSize",type:"text",defaultValue:"cover",enum:[{label:"contain",value:"contain",helperText:"The image should never get cropped"},{label:"cover",value:"cover",helperText:"The image should fill it's box, cropping when needed"}]},{name:"backgroundPosition",type:"text",defaultValue:"center",enum:["center","top","left","right","bottom","top left","top right","bottom left","bottom right"]},{name:"altText",type:"string",helperText:"Text to display when the user has images off"},{name:"height",type:"number",hideFromUI:!0},{name:"width",type:"number",hideFromUI:!0},{name:"sizes",type:"string",hideFromUI:!0},{name:"srcset",type:"string",hideFromUI:!0},{name:"lazy",type:"boolean",defaultValue:!0,hideFromUI:!0},{name:"fitContent",type:"boolean",helperText:"When child blocks are provided, fit to them instead of using the image's aspect ratio",defaultValue:!0},{name:"highPriority",type:"boolean",advanced:!0,helperText:"Mark this image as high priority compared to other images on the page. This prevents lazy loading of the image and tells the browser to load this image before others on the page."},{name:"aspectRatio",type:"number",helperText:"This is the ratio of height/width, e.g. set to 1.5 for a 300px wide and 200px tall photo. Set to 0 to not force the image to maintain it's aspect ratio",advanced:!0,defaultValue:.7041}],shouldReceiveBuilderProps:{builderBlock:!0}};exports.componentInfo=p;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("../../constants/file-types.cjs"),m={name:"Image",static:!0,image:"https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-insert_photo-24px.svg?alt=media&token=4e5d0ef4-f5e8-4e57-b3a9-38d63a9b9dc4",defaultStyles:{position:"relative",minHeight:"20px",minWidth:"20px",overflow:"hidden"},canHaveChildren:!0,inputs:[{name:"image",type:"file",bubble:!0,allowedFileTypes:p.IMAGE_FILE_TYPES,required:!0,defaultValue:"https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F72c80f114dc149019051b6852a9e3b7a",onChange:t=>{t.delete("srcset"),t.delete("noWebp");function d(e,o=6e4){return new Promise((u,n)=>{const i=document.createElement("img");let l=!1;i.onload=()=>{l=!0,u(i)},i.addEventListener("error",s=>{console.warn("Image load failed",s.error),n(s.error)}),i.src=e,setTimeout(()=>{l||n(new Error("Image load timed out"))},o)})}function h(e){return Math.round(e*1e3)/1e3}const a=t.get("image"),r=t.get("aspectRatio");if(fetch(a).then(e=>e.blob()).then(e=>{e.type.includes("svg")&&t.set("noWebp",!0)}),a&&(!r||r===.7041))return d(a).then(e=>{const o=t.get("aspectRatio");t.get("image")===a&&(!o||o===.7041)&&e.width&&e.height&&(t.set("aspectRatio",h(e.height/e.width)),t.set("height",e.height),t.set("width",e.width))})}},{name:"backgroundSize",type:"text",defaultValue:"cover",enum:[{label:"contain",value:"contain",helperText:"The image should never get cropped"},{label:"cover",value:"cover",helperText:"The image should fill it's box, cropping when needed"}]},{name:"backgroundPosition",type:"text",defaultValue:"center",enum:["center","top","left","right","bottom","top left","top right","bottom left","bottom right"]},{name:"altText",type:"string",helperText:"Text to display when the user has images off"},{name:"title",type:"string",helperText:"Text to display when hovering over the asset"},{name:"height",type:"number",hideFromUI:!0},{name:"width",type:"number",hideFromUI:!0},{name:"sizes",type:"string",hideFromUI:!0},{name:"srcset",type:"string",hideFromUI:!0},{name:"lazy",type:"boolean",defaultValue:!0,hideFromUI:!0},{name:"fitContent",type:"boolean",helperText:"When child blocks are provided, fit to them instead of using the image's aspect ratio",defaultValue:!0},{name:"highPriority",type:"boolean",advanced:!0,helperText:"Mark this image as high priority compared to other images on the page. This prevents lazy loading of the image and tells the browser to load this image before others on the page."},{name:"aspectRatio",type:"number",helperText:"This is the ratio of height/width, e.g. set to 1.5 for a 300px wide and 200px tall photo. Set to 0 to not force the image to maintain it's aspect ratio",advanced:!0,defaultValue:.7041}],shouldReceiveBuilderProps:{builderBlock:!0}};exports.componentInfo=m;