@builder.io/sdk-react-nextjs 0.17.0 → 0.17.2

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const 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:["jpeg","jpg","png","svg","webp"],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 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;

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

@@ -1,4 +1,5 @@
-const m = {
+import { IMAGE_FILE_TYPES as m } from "../../constants/file-types.mjs";
+const g = {
   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",
@@ -13,7 +14,7 @@ const m = {
     name: "image",
     type: "file",
     bubble: !0,
-    allowedFileTypes: ["jpeg", "jpg", "png", "svg", "webp"],
+    allowedFileTypes: m,
     required: !0,
     defaultValue: "https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F72c80f114dc149019051b6852a9e3b7a",
     onChange: (t) => {
@@ -108,5 +109,5 @@ const m = {
   }
 };
 export {
-  m as componentInfo
+  g as componentInfo
 };

package/lib/browser/blocks/image/image.cjs

@@ -1,11 +1,11 @@
-"use client";"use strict";const t=require("react/jsx-runtime"),b=require("react"),c=require("./image.helpers.cjs");function f(e){var s,r,u,o,d,g;function n(){var h;const i=e.image||e.src;if(!i||!(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"),c.getSrcSet(i)}else if(e.image&&!e.srcset)return c.getSrcSet(i);return c.getSrcSet(i)}}function l(){var a;return(a=n==null?void 0:n())!=null&&a.match(/builder\.io/)&&!e.noWebp?n().replace(/\?/g,"?format=webp&"):""}function m(){const a={position:"absolute",height:"100%",width:"100%",left:"0px",top:"0px"};return e.aspectRatio?a:void 0}return b.useEffect(()=>{},[]),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-7a292ab8",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-7a292ab8",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-7a292ab8-2",children:e.children}):null]}),t.jsx("style",{children:`.img-7a292ab8 {
+"use client";"use strict";const t=require("react/jsx-runtime"),m=require("react"),l=require("./image.helpers.cjs");function b(e){var s,r,u,o,d,g;function n(){var f;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&&((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"),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 h(){const c={position:"absolute",height:"100%",width:"100%",left:"0px",top:"0px"};return e.aspectRatio?c:void 0}return m.useEffect(()=>{},[]),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,role:e.altText?void 0:"presentation",style:{objectPosition:e.backgroundPosition||"center",objectFit:e.backgroundSize||"cover",...h()},className:"builder-image"+(e.className?" "+e.className:"")+" img-c071ff08",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-c071ff08",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-c071ff08-2",children:e.children}):null]}),t.jsx("style",{children:`.img-c071ff08 {
   opacity: 1;
   transition: opacity 0.2s ease-in-out;
-}.div-7a292ab8 {
+}.div-c071ff08 {
   width: 100%;
   pointer-events: none;
   font-size: 0;
-}.div-7a292ab8-2 {
+}.div-c071ff08-2 {
   display: flex;
   flex-direction: column;
   align-items: stretch;
@@ -14,4 +14,4 @@
   left: 0;
   width: 100%;
   height: 100%;
-}`})]})}module.exports=f;
+}`})]})}module.exports=b;

package/lib/browser/blocks/image/image.mjs

@@ -1,18 +1,18 @@
 "use client";
-import { jsxs as c, Fragment as l, jsx as t } from "react/jsx-runtime";
+import { jsxs as l, Fragment as a, jsx as t } from "react/jsx-runtime";
 import { useEffect as v } from "react";
 import { getSrcSet as o } from "./image.helpers.mjs";
 function w(e) {
-  var d, u, s, m, g, h;
+  var d, s, u, f, g, m;
   function n() {
-    var f;
+    var h;
     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
-    !(i.match(/builder\.io/) || i.match(/cdn\.shopify\.com/)))
+    !(typeof i == "string" && (i.match(/builder\.io/) || i.match(/cdn\.shopify\.com/))))
       return e.srcset;
     if (!e.noWebp) {
-      if (e.srcset && ((f = e.image) != null && f.includes("builder.io/api/v1/image"))) {
+      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"), o(i);
       } else if (e.image && !e.srcset)
@@ -21,23 +21,23 @@ function w(e) {
     }
   }
   function r() {
-    var a;
-    return (a = n == null ? void 0 : n()) != null && a.match(/builder\.io/) && !e.noWebp ? n().replace(/\?/g, "?format=webp&") : "";
+    var c;
+    return (c = n == null ? void 0 : n()) != null && c.match(/builder\.io/) && !e.noWebp ? n().replace(/\?/g, "?format=webp&") : "";
   }
   function b() {
-    const a = {
+    const c = {
       position: "absolute",
       height: "100%",
       width: "100%",
       left: "0px",
       top: "0px"
     };
-    return e.aspectRatio ? a : void 0;
+    return e.aspectRatio ? c : void 0;
   }
   return v(() => {
-  }, []), /* @__PURE__ */ c(l, { children: [
-    /* @__PURE__ */ c(l, { children: [
-      /* @__PURE__ */ c("picture", { children: [
+  }, []), /* @__PURE__ */ l(a, { children: [
+    /* @__PURE__ */ l(a, { children: [
+      /* @__PURE__ */ l("picture", { children: [
         r() ? /* @__PURE__ */ t("source", { type: "image/webp", srcSet: r() }) : null,
         /* @__PURE__ */ t(
           "img",
@@ -51,33 +51,33 @@ function w(e) {
               objectFit: e.backgroundSize || "cover",
               ...b()
             },
-            className: "builder-image" + (e.className ? " " + e.className : "") + " img-7a292ab8",
+            className: "builder-image" + (e.className ? " " + e.className : "") + " img-c071ff08",
             src: e.image,
             srcSet: n(),
             sizes: e.sizes
           }
         )
       ] }),
-      e.aspectRatio && !((u = (d = e.builderBlock) == null ? void 0 : d.children) != null && u.length && e.fitContent) ? /* @__PURE__ */ t(
+      e.aspectRatio && !((s = (d = e.builderBlock) == null ? void 0 : d.children) != null && s.length && e.fitContent) ? /* @__PURE__ */ t(
         "div",
         {
-          className: "builder-image-sizer div-7a292ab8",
+          className: "builder-image-sizer div-c071ff08",
           style: {
             paddingTop: e.aspectRatio * 100 + "%"
           }
         }
       ) : null,
-      (m = (s = e.builderBlock) == null ? void 0 : s.children) != null && m.length && e.fitContent ? /* @__PURE__ */ t(l, { children: e.children }) : null,
-      !e.fitContent && ((h = (g = e.builderBlock) == null ? void 0 : g.children) != null && h.length) ? /* @__PURE__ */ t("div", { className: "div-7a292ab8-2", children: e.children }) : null
+      (f = (u = e.builderBlock) == null ? void 0 : u.children) != null && f.length && e.fitContent ? /* @__PURE__ */ t(a, { children: e.children }) : null,
+      !e.fitContent && ((m = (g = e.builderBlock) == null ? void 0 : g.children) != null && m.length) ? /* @__PURE__ */ t("div", { className: "div-c071ff08-2", children: e.children }) : null
     ] }),
-    /* @__PURE__ */ t("style", { children: `.img-7a292ab8 {
+    /* @__PURE__ */ t("style", { children: `.img-c071ff08 {
   opacity: 1;
   transition: opacity 0.2s ease-in-out;
-}.div-7a292ab8 {
+}.div-c071ff08 {
   width: 100%;
   pointer-events: none;
   font-size: 0;
-}.div-7a292ab8-2 {
+}.div-c071ff08-2 {
   display: flex;
   flex-direction: column;
   align-items: stretch;

package/lib/browser/blocks/img/component-info.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={name:"Raw:Img",hideFromInsertMenu:!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",inputs:[{name:"image",bubble:!0,type:"file",allowedFileTypes:["jpeg","jpg","png","svg","gif","webp"],required:!0}],noWrap:!0,static:!0};exports.componentInfo=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../constants/file-types.cjs"),t={name:"Raw:Img",hideFromInsertMenu:!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",inputs:[{name:"image",bubble:!0,type:"file",allowedFileTypes:e.IMAGE_FILE_TYPES,required:!0}],noWrap:!0,static:!0};exports.componentInfo=t;

package/lib/browser/blocks/img/component-info.mjs

@@ -1,4 +1,5 @@
-const e = {
+import { IMAGE_FILE_TYPES as e } from "../../constants/file-types.mjs";
+const o = {
   // friendlyName?
   name: "Raw:Img",
   hideFromInsertMenu: !0,
@@ -7,12 +8,12 @@ const e = {
     name: "image",
     bubble: !0,
     type: "file",
-    allowedFileTypes: ["jpeg", "jpg", "png", "svg", "gif", "webp"],
+    allowedFileTypes: e,
     required: !0
   }],
   noWrap: !0,
   static: !0
 };
 export {
-  e as componentInfo
+  o as componentInfo
 };

package/lib/browser/blocks/text/text.cjs

@@ -1 +1 @@
-"use strict";const a=require("react/jsx-runtime"),i=require("../../functions/evaluate/evaluate.cjs");function l(t){const n=function(){var e;const o=t.builderContext,{context:r,localState:c,rootState:s,rootSetState:u}=o;return String(((e=t.text)==null?void 0:e.toString())||"").replace(/{{([^}]+)}}/g,(S,x)=>i.evaluate({code:x,context:r,localState:c,rootState:s,rootSetState:u}))};return a.jsx("div",{className:"builder-text",dangerouslySetInnerHTML:{__html:n()},style:{outline:"none"}})}module.exports=l;
+"use strict";const n=require("react/jsx-runtime");function r(e){var t;return n.jsx("div",{className:"builder-text",dangerouslySetInnerHTML:{__html:((t=e.text)==null?void 0:t.toString())||""},style:{outline:"none"}})}module.exports=r;

package/lib/browser/blocks/text/text.mjs

@@ -1,29 +1,11 @@
-import { jsx as a } from "react/jsx-runtime";
-import { evaluate as l } from "../../functions/evaluate/evaluate.mjs";
-function f(t) {
-  return /* @__PURE__ */ a(
+import { jsx as n } from "react/jsx-runtime";
+function o(e) {
+  var t;
+  return /* @__PURE__ */ n(
     "div",
     {
       className: "builder-text",
-      dangerouslySetInnerHTML: { __html: function() {
-        var e;
-        const o = t.builderContext, {
-          context: n,
-          localState: r,
-          rootState: c,
-          rootSetState: s
-        } = o;
-        return String(((e = t.text) == null ? void 0 : e.toString()) || "").replace(
-          /{{([^}]+)}}/g,
-          (d, x) => l({
-            code: x,
-            context: n,
-            localState: r,
-            rootState: c,
-            rootSetState: s
-          })
-        );
-      }() },
+      dangerouslySetInnerHTML: { __html: ((t = e.text) == null ? void 0 : t.toString()) || "" },
       style: {
         outline: "none"
       }
@@ -31,5 +13,5 @@ function f(t) {
   );
 }
 export {
-  f as default
+  o as default
 };

package/lib/browser/blocks/video/component-info.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={name:"Video",canHaveChildren:!0,defaultStyles:{minHeight:"20px",minWidth:"20px"},image:"https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-videocam-24px%20(1).svg?alt=media&token=49a84e4a-b20e-4977-a650-047f986874bb",inputs:[{name:"video",type:"file",allowedFileTypes:["mp4"],bubble:!0,defaultValue:"https://cdn.builder.io/o/assets%2FYJIGb4i01jvw0SRdL5Bt%2Fd27731a526464deba0016216f5f9e570%2Fcompressed?apiKey=YJIGb4i01jvw0SRdL5Bt&token=d27731a526464deba0016216f5f9e570&alt=media&optimized=true",required:!0},{name:"posterImage",type:"file",allowedFileTypes:["jpeg","png"],helperText:"Image to show before the video plays"},{name:"autoPlay",type:"boolean",defaultValue:!0},{name:"controls",type:"boolean",defaultValue:!1},{name:"muted",type:"boolean",defaultValue:!0},{name:"loop",type:"boolean",defaultValue:!0},{name:"playsInline",type:"boolean",defaultValue:!0},{name:"fit",type:"text",defaultValue:"cover",enum:["contain","cover","fill","auto"]},{name:"preload",type:"text",defaultValue:"metadata",enum:["auto","metadata","none"]},{name:"fitContent",type:"boolean",helperText:"When child blocks are provided, fit to them instead of using the aspect ratio",defaultValue:!0,advanced:!0},{name:"position",type:"text",defaultValue:"center",enum:["center","top","left","right","bottom","top left","top right","bottom left","bottom right"]},{name:"height",type:"number",advanced:!0},{name:"width",type:"number",advanced:!0},{name:"aspectRatio",type:"number",advanced:!0,defaultValue:.7004048582995948},{name:"lazyLoad",type:"boolean",helperText:'Load this video "lazily" - as in only when a user scrolls near the video. Recommended for optmized performance and bandwidth consumption',defaultValue:!0,advanced:!0}],shouldReceiveBuilderProps:{builderBlock:!0}};exports.componentInfo=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../constants/file-types.cjs"),t={name:"Video",canHaveChildren:!0,defaultStyles:{minHeight:"20px",minWidth:"20px"},image:"https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-videocam-24px%20(1).svg?alt=media&token=49a84e4a-b20e-4977-a650-047f986874bb",inputs:[{name:"video",type:"file",allowedFileTypes:e.VIDEO_FILE_TYPES,bubble:!0,defaultValue:"https://cdn.builder.io/o/assets%2FYJIGb4i01jvw0SRdL5Bt%2Fd27731a526464deba0016216f5f9e570%2Fcompressed?apiKey=YJIGb4i01jvw0SRdL5Bt&token=d27731a526464deba0016216f5f9e570&alt=media&optimized=true",required:!0},{name:"posterImage",type:"file",allowedFileTypes:e.IMAGE_FILE_TYPES,helperText:"Image to show before the video plays"},{name:"autoPlay",type:"boolean",defaultValue:!0},{name:"controls",type:"boolean",defaultValue:!1},{name:"muted",type:"boolean",defaultValue:!0},{name:"loop",type:"boolean",defaultValue:!0},{name:"playsInline",type:"boolean",defaultValue:!0},{name:"fit",type:"text",defaultValue:"cover",enum:["contain","cover","fill","auto"]},{name:"preload",type:"text",defaultValue:"metadata",enum:["auto","metadata","none"]},{name:"fitContent",type:"boolean",helperText:"When child blocks are provided, fit to them instead of using the aspect ratio",defaultValue:!0,advanced:!0},{name:"position",type:"text",defaultValue:"center",enum:["center","top","left","right","bottom","top left","top right","bottom left","bottom right"]},{name:"height",type:"number",advanced:!0},{name:"width",type:"number",advanced:!0},{name:"aspectRatio",type:"number",advanced:!0,defaultValue:.7004048582995948},{name:"lazyLoad",type:"boolean",helperText:'Load this video "lazily" - as in only when a user scrolls near the video. Recommended for optmized performance and bandwidth consumption',defaultValue:!0,advanced:!0}],shouldReceiveBuilderProps:{builderBlock:!0}};exports.componentInfo=t;

package/lib/browser/blocks/video/component-info.mjs

@@ -1,4 +1,5 @@
-const e = {
+import { VIDEO_FILE_TYPES as e, IMAGE_FILE_TYPES as t } from "../../constants/file-types.mjs";
+const o = {
   name: "Video",
   canHaveChildren: !0,
   defaultStyles: {
@@ -9,14 +10,14 @@ const e = {
   inputs: [{
     name: "video",
     type: "file",
-    allowedFileTypes: ["mp4"],
+    allowedFileTypes: e,
     bubble: !0,
     defaultValue: "https://cdn.builder.io/o/assets%2FYJIGb4i01jvw0SRdL5Bt%2Fd27731a526464deba0016216f5f9e570%2Fcompressed?apiKey=YJIGb4i01jvw0SRdL5Bt&token=d27731a526464deba0016216f5f9e570&alt=media&optimized=true",
     required: !0
   }, {
     name: "posterImage",
     type: "file",
-    allowedFileTypes: ["jpeg", "png"],
+    allowedFileTypes: t,
     helperText: "Image to show before the video plays"
   }, {
     name: "autoPlay",
@@ -84,5 +85,5 @@ const e = {
   }
 };
 export {
-  e as componentInfo
+  o as componentInfo
 };

package/lib/browser/components/block/block.cjs

@@ -1 +1 @@
-"use strict";const t=require("react/jsx-runtime"),R=require("../../constants/target.cjs"),S=require("../../functions/get-block-component-options.cjs"),j=require("../../functions/get-processed-block.cjs"),P=require("../../functions/is-previewing.cjs");require("../../functions/get-fetch.cjs");const u=require("./block.helpers.cjs"),q=require("./components/block-styles.cjs"),O=require("./components/block-wrapper.cjs"),h=require("./components/component-ref/component-ref.cjs"),g=require("./components/repeated-block.cjs");function b(e){var a,C,p,x;const d=function(){return u.getRepeatItemData({block:e.block,context:e.context})},k={value:null,update:!1},c=function(){var i;if(k.value&&!k.update&&!P.isPreviewing())return k.value;const r=(i=e.block.repeat)!=null&&i.collection?e.block:j.getProcessedBlock({block:e.block,localState:e.context.localState,rootState:e.context.rootState,rootSetState:e.context.rootSetState,context:e.context.context,shouldEvaluateBindings:!0});return k.value=r,k.update=!1,r},l=function(){return u.getComponent({block:c(),registeredComponents:e.registeredComponents})},f=function(){var i;return e.block.tagName==="a"||((i=c().properties)==null?void 0:i.href)||c().href?e.linkComponent||"a":e.block.tagName||"div"},B=function(){var s,m;if((s=e.block.repeat)!=null&&s.collection)return!!((m=d())!=null&&m.length);const r="hide"in c()?c().hide:!1;return("show"in c()?c().show:!0)&&!r},v=function(){var i,s;return!((i=l())!=null&&i.component)&&!d()?(s=c().children)!=null?s:[]:[]},n=function(){var r,i,s,m;return{blockChildren:(r=c().children)!=null?r:[],componentRef:(i=l())==null?void 0:i.component,componentOptions:{...S.getBlockComponentOptions(c()),...u.provideBuilderBlock(l(),c()),...u.provideBuilderContext(l(),e.context),...u.provideLinkComponent(l(),e.linkComponent),...u.provideRegisteredComponents(l(),e.registeredComponents)},context:e.context,linkComponent:e.linkComponent,registeredComponents:e.registeredComponents,builderBlock:c(),includeBlockProps:((s=l())==null?void 0:s.noWrap)===!0,isInteractive:!((m=l())!=null&&m.isRSC&&R.TARGET==="rsc")}};return t.jsx(t.Fragment,{children:B()?t.jsxs(t.Fragment,{children:[t.jsx(q,{block:c(),context:e.context}),(a=l())!=null&&a.noWrap?d()?t.jsx(t.Fragment,{children:(x=d())==null?void 0:x.map((o,r)=>t.jsx(g,{repeatContext:o.context,block:o.block,registeredComponents:e.registeredComponents,linkComponent:e.linkComponent},r))}):t.jsx(h,{componentRef:n().componentRef,componentOptions:n().componentOptions,blockChildren:n().blockChildren,context:n().context,registeredComponents:n().registeredComponents,linkComponent:n().linkComponent,builderBlock:n().builderBlock,includeBlockProps:n().includeBlockProps,isInteractive:n().isInteractive}):t.jsx(t.Fragment,{children:d()?t.jsx(t.Fragment,{children:(p=d())==null?void 0:p.map((o,r)=>t.jsx(g,{repeatContext:o.context,block:o.block,registeredComponents:e.registeredComponents,linkComponent:e.linkComponent},r))}):t.jsxs(O,{Wrapper:f(),block:c(),context:e.context,children:[t.jsx(h,{componentRef:n().componentRef,componentOptions:n().componentOptions,blockChildren:n().blockChildren,context:n().context,registeredComponents:n().registeredComponents,linkComponent:n().linkComponent,builderBlock:n().builderBlock,includeBlockProps:n().includeBlockProps,isInteractive:n().isInteractive}),(C=v())==null?void 0:C.map(o=>t.jsx(b,{block:o,registeredComponents:e.registeredComponents,linkComponent:e.linkComponent,context:e.context},o.id))]})})]}):null})}module.exports=b;
+"use strict";const t=require("react/jsx-runtime"),v=require("../../constants/target.cjs"),S=require("../../functions/get-block-component-options.cjs"),j=require("../../functions/get-processed-block.cjs"),P=require("../../functions/is-previewing.cjs");require("../../functions/get-fetch.cjs");const m=require("./block.helpers.cjs"),q=require("./components/block-styles.cjs"),O=require("./components/block-wrapper.cjs"),p=require("./components/component-ref/component-ref.cjs"),g=require("./components/repeated-block.cjs");function b(e){var a,C,x,h;const d=function(){return m.getRepeatItemData({block:e.block,context:e.context})},u={value:null,update:!1},c=function(){var i;if(u.value&&!u.update&&!P.isPreviewing())return u.value;const r=(i=e.block.repeat)!=null&&i.collection?e.block:j.getProcessedBlock({block:e.block,localState:e.context.localState,rootState:e.context.rootState,rootSetState:e.context.rootSetState,context:e.context.context});return u.value=r,u.update=!1,r},l=function(){return m.getComponent({block:c(),registeredComponents:e.registeredComponents,model:e.context.model})},f=function(){var i;return e.block.tagName==="a"||((i=c().properties)==null?void 0:i.href)||c().href?e.linkComponent||"a":e.block.tagName||"div"},B=function(){var s,k;if((s=e.block.repeat)!=null&&s.collection)return!!((k=d())!=null&&k.length);const r="hide"in c()?c().hide:!1;return("show"in c()?c().show:!0)&&!r},R=function(){var i,s;return!((i=l())!=null&&i.component)&&!d()?(s=c().children)!=null?s:[]:[]},n=function(){var r,i,s,k;return{blockChildren:(r=c().children)!=null?r:[],componentRef:(i=l())==null?void 0:i.component,componentOptions:{...S.getBlockComponentOptions(c(),e.context),...m.provideBuilderBlock(l(),c()),...m.provideBuilderContext(l(),e.context),...m.provideLinkComponent(l(),e.linkComponent),...m.provideRegisteredComponents(l(),e.registeredComponents,e.context.model)},context:e.context,linkComponent:e.linkComponent,registeredComponents:e.registeredComponents,builderBlock:c(),includeBlockProps:((s=l())==null?void 0:s.noWrap)===!0,isInteractive:!((k=l())!=null&&k.isRSC&&v.TARGET==="rsc")}};return t.jsx(t.Fragment,{children:B()?t.jsxs(t.Fragment,{children:[t.jsx(q,{block:c(),context:e.context}),(a=l())!=null&&a.noWrap?d()?t.jsx(t.Fragment,{children:(h=d())==null?void 0:h.map((o,r)=>t.jsx(g,{repeatContext:o.context,block:o.block,registeredComponents:e.registeredComponents,linkComponent:e.linkComponent},r))}):t.jsx(p,{componentRef:n().componentRef,componentOptions:n().componentOptions,blockChildren:n().blockChildren,context:n().context,registeredComponents:n().registeredComponents,linkComponent:n().linkComponent,builderBlock:n().builderBlock,includeBlockProps:n().includeBlockProps,isInteractive:n().isInteractive}):t.jsx(t.Fragment,{children:d()?t.jsx(t.Fragment,{children:(x=d())==null?void 0:x.map((o,r)=>t.jsx(g,{repeatContext:o.context,block:o.block,registeredComponents:e.registeredComponents,linkComponent:e.linkComponent},r))}):t.jsxs(O,{Wrapper:f(),block:c(),context:e.context,children:[t.jsx(p,{componentRef:n().componentRef,componentOptions:n().componentOptions,blockChildren:n().blockChildren,context:n().context,registeredComponents:n().registeredComponents,linkComponent:n().linkComponent,builderBlock:n().builderBlock,includeBlockProps:n().includeBlockProps,isInteractive:n().isInteractive}),(C=R())==null?void 0:C.map(o=>t.jsx(b,{block:o,registeredComponents:e.registeredComponents,linkComponent:e.linkComponent,context:e.context},o.id))]})})]}):null})}module.exports=b;

package/lib/browser/components/block/block.helpers.cjs

@@ -1,3 +1,3 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("../../functions/evaluate/evaluate.cjs"),l=({block:t,registeredComponents:r})=>{var o;const e=(o=t.component)==null?void 0:o.name;if(!e)return null;const n=r[e];if(n)return n;console.warn(`
-      Could not find a registered component named "${e}". 
-      If you registered it, is the file that registered it imported by the file that needs to render it?`)},p=({block:t,context:r})=>{const{repeat:e,...n}=t;if(!(e!=null&&e.collection))return;const o=s.evaluate({code:e.collection,localState:r.localState,rootState:r.rootState,rootSetState:r.rootSetState,context:r.context});if(!Array.isArray(o))return;const i=e.collection.split(".").pop(),d=e.itemName||(i?i+"Item":"item");return o.map((u,a)=>({context:{...r,localState:{...r.localState,$index:a,$item:u,[d]:u,[`$${d}Index`]:a}},block:n}))},m=(t,r)=>{var e;return(e=t==null?void 0:t.shouldReceiveBuilderProps)!=null&&e.builderLinkComponent?{builderLinkComponent:r}:{}},c=(t,r)=>{var e;return(e=t==null?void 0:t.shouldReceiveBuilderProps)!=null&&e.builderComponents?{builderComponents:r}:{}},v=(t,r)=>{var e;return(e=t==null?void 0:t.shouldReceiveBuilderProps)!=null&&e.builderBlock?{builderBlock:r}:{}},C=(t,r)=>{var e;return(e=t==null?void 0:t.shouldReceiveBuilderProps)!=null&&e.builderContext?{builderContext:r}:{}};exports.getComponent=l;exports.getRepeatItemData=p;exports.provideBuilderBlock=v;exports.provideBuilderContext=C;exports.provideLinkComponent=m;exports.provideRegisteredComponents=c;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("../../functions/evaluate/evaluate.cjs"),l=(e,t)=>e?t?e.models&&e.models.length>0&&!e.models.includes(t):!1:!0,p=({block:e,registeredComponents:t,model:r})=>{var i;const o=(i=e.component)==null?void 0:i.name;if(!o)return null;const n=t[o];if(!n||l(n,r)){console.warn(`
+      Could not find a registered component named "${o}". 
+      If you registered it, is the file that registered it imported by the file that needs to render it?`);return}else return n},m=({block:e,context:t})=>{const{repeat:r,...o}=e;if(!(r!=null&&r.collection))return;const n=a.evaluate({code:r.collection,localState:t.localState,rootState:t.rootState,rootSetState:t.rootSetState,context:t.context});if(!Array.isArray(n))return;const i=r.collection.split(".").pop(),s=r.itemName||(i?i+"Item":"item");return n.map((d,u)=>({context:{...t,localState:{...t.localState,$index:u,$item:d,[s]:d,[`$${s}Index`]:u}},block:o}))},c=(e,t)=>{var r;return(r=e==null?void 0:e.shouldReceiveBuilderProps)!=null&&r.builderLinkComponent?{builderLinkComponent:t}:{}},f=(e,t,r)=>{var o;return(o=e==null?void 0:e.shouldReceiveBuilderProps)!=null&&o.builderComponents?{builderComponents:Object.fromEntries(Object.entries(t).filter(([i,s])=>!l(s,r)))}:{}},v=(e,t)=>{var r;return(r=e==null?void 0:e.shouldReceiveBuilderProps)!=null&&r.builderBlock?{builderBlock:t}:{}},C=(e,t)=>{var r;return(r=e==null?void 0:e.shouldReceiveBuilderProps)!=null&&r.builderContext?{builderContext:t}:{}};exports.getComponent=p;exports.getRepeatItemData=m;exports.provideBuilderBlock=v;exports.provideBuilderContext=C;exports.provideLinkComponent=c;exports.provideRegisteredComponents=f;

package/lib/browser/components/block/block.helpers.mjs

@@ -1,77 +1,80 @@
 import { evaluate as a } from "../../functions/evaluate/evaluate.mjs";
-const m = ({
-  block: t,
-  registeredComponents: r
+const l = (e, t) => e ? t ? e.models && e.models.length > 0 && !e.models.includes(t) : !1 : !0, c = ({
+  block: e,
+  registeredComponents: t,
+  model: r
 }) => {
-  var o;
-  const e = (o = t.component) == null ? void 0 : o.name;
-  if (!e)
+  var i;
+  const o = (i = e.component) == null ? void 0 : i.name;
+  if (!o)
     return null;
-  const n = r[e];
-  if (n)
-    return n;
-  console.warn(`
-      Could not find a registered component named "${e}". 
+  const n = t[o];
+  if (!n || l(n, r)) {
+    console.warn(`
+      Could not find a registered component named "${o}". 
       If you registered it, is the file that registered it imported by the file that needs to render it?`);
-}, c = ({
-  block: t,
-  context: r
+    return;
+  } else
+    return n;
+}, f = ({
+  block: e,
+  context: t
 }) => {
   const {
-    repeat: e,
-    ...n
-  } = t;
-  if (!(e != null && e.collection))
+    repeat: r,
+    ...o
+  } = e;
+  if (!(r != null && r.collection))
     return;
-  const o = a({
-    code: e.collection,
-    localState: r.localState,
-    rootState: r.rootState,
-    rootSetState: r.rootSetState,
-    context: r.context
+  const n = a({
+    code: r.collection,
+    localState: t.localState,
+    rootState: t.rootState,
+    rootSetState: t.rootSetState,
+    context: t.context
   });
-  if (!Array.isArray(o))
+  if (!Array.isArray(n))
     return;
-  const i = e.collection.split(".").pop(), d = e.itemName || (i ? i + "Item" : "item");
-  return o.map((s, u) => ({
+  const i = r.collection.split(".").pop(), s = r.itemName || (i ? i + "Item" : "item");
+  return n.map((d, u) => ({
     context: {
-      ...r,
+      ...t,
       localState: {
-        ...r.localState,
+        ...t.localState,
         $index: u,
-        $item: s,
-        [d]: s,
-        [`$${d}Index`]: u
+        $item: d,
+        [s]: d,
+        [`$${s}Index`]: u
       }
     },
-    block: n
+    block: o
   }));
-}, f = (t, r) => {
-  var e;
-  return (e = t == null ? void 0 : t.shouldReceiveBuilderProps) != null && e.builderLinkComponent ? {
-    builderLinkComponent: r
+}, C = (e, t) => {
+  var r;
+  return (r = e == null ? void 0 : e.shouldReceiveBuilderProps) != null && r.builderLinkComponent ? {
+    builderLinkComponent: t
   } : {};
-}, v = (t, r) => {
-  var e;
-  return (e = t == null ? void 0 : t.shouldReceiveBuilderProps) != null && e.builderComponents ? {
-    builderComponents: r
+}, v = (e, t, r) => {
+  var o;
+  return (o = e == null ? void 0 : e.shouldReceiveBuilderProps) != null && o.builderComponents ? {
+    builderComponents: Object.fromEntries(Object.entries(t).filter(([i, s]) => !l(s, r)))
   } : {};
-}, C = (t, r) => {
-  var e;
-  return (e = t == null ? void 0 : t.shouldReceiveBuilderProps) != null && e.builderBlock ? {
-    builderBlock: r
+}, h = (e, t) => {
+  var r;
+  return (r = e == null ? void 0 : e.shouldReceiveBuilderProps) != null && r.builderBlock ? {
+    builderBlock: t
   } : {};
-}, S = (t, r) => {
-  var e;
-  return (e = t == null ? void 0 : t.shouldReceiveBuilderProps) != null && e.builderContext ? {
-    builderContext: r
+}, R = (e, t) => {
+  var r;
+  return (r = e == null ? void 0 : e.shouldReceiveBuilderProps) != null && r.builderContext ? {
+    builderContext: t
   } : {};
 };
 export {
-  m as getComponent,
-  c as getRepeatItemData,
-  C as provideBuilderBlock,
-  S as provideBuilderContext,
-  f as provideLinkComponent,
+  c as getComponent,
+  f as getRepeatItemData,
+  h as provideBuilderBlock,
+  R as provideBuilderContext,
+  C as provideLinkComponent,
   v as provideRegisteredComponents
 };