@builder.io/sdk-vue 0.3.1 → 0.4.0

package/packages/_vue3/dist/render-content.03e6b41b.js

@@ -0,0 +1,1355 @@
+import { defineComponent as g, openBlock as m, createElementBlock as b, mergeProps as U, toHandlers as P, normalizeClass as j, markRaw as L, defineAsyncComponent as R, resolveComponent as w, createBlock as v, resolveDynamicComponent as M, createCommentVNode as C } from "vue";
+import { s as x, _ as y, i as f, B as W, C as _, F as B, I as q, S as N, d as O, e as D, V as K, r as z, b as k, T as $, c as J, h as Y, j as G, k as X, l as Q, m as Z, n as I, o as ee, p as te, q as ne } from "./index.32c5f4e2.js";
+import { e as E } from "./evaluate.38cae9b6.js";
+const ae = {
+  name: "Core:Button",
+  image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F81a15681c3e74df09677dfc57a615b13",
+  defaultStyles: {
+    appearance: "none",
+    paddingTop: "15px",
+    paddingBottom: "15px",
+    paddingLeft: "25px",
+    paddingRight: "25px",
+    backgroundColor: "#000000",
+    color: "white",
+    borderRadius: "4px",
+    textAlign: "center",
+    cursor: "pointer"
+  },
+  inputs: [
+    {
+      name: "text",
+      type: "text",
+      defaultValue: "Click me!",
+      bubble: !0
+    },
+    {
+      name: "link",
+      type: "url",
+      bubble: !0
+    },
+    {
+      name: "openLinkInNewTab",
+      type: "boolean",
+      defaultValue: !1,
+      friendlyName: "Open link in new tab"
+    }
+  ],
+  static: !0,
+  noWrap: !0
+}, oe = {
+  name: "Columns",
+  inputs: [
+    {
+      name: "columns",
+      type: "array",
+      broadcast: !0,
+      subFields: [
+        {
+          name: "blocks",
+          type: "array",
+          hideFromUI: !0,
+          defaultValue: [
+            {
+              "@type": "@builder.io/sdk:Element",
+              responsiveStyles: {
+                large: {
+                  display: "flex",
+                  flexDirection: "column",
+                  alignItems: "stretch",
+                  flexShrink: "0",
+                  position: "relative",
+                  marginTop: "30px",
+                  textAlign: "center",
+                  lineHeight: "normal",
+                  height: "auto",
+                  minHeight: "20px",
+                  minWidth: "20px",
+                  overflow: "hidden"
+                }
+              },
+              component: {
+                name: "Image",
+                options: {
+                  image: "https://builder.io/api/v1/image/assets%2Fpwgjf0RoYWbdnJSbpBAjXNRMe9F2%2Ffb27a7c790324294af8be1c35fe30f4d",
+                  backgroundPosition: "center",
+                  backgroundSize: "cover",
+                  aspectRatio: 0.7004048582995948
+                }
+              }
+            },
+            {
+              "@type": "@builder.io/sdk:Element",
+              responsiveStyles: {
+                large: {
+                  display: "flex",
+                  flexDirection: "column",
+                  alignItems: "stretch",
+                  flexShrink: "0",
+                  position: "relative",
+                  marginTop: "30px",
+                  textAlign: "center",
+                  lineHeight: "normal",
+                  height: "auto"
+                }
+              },
+              component: {
+                name: "Text",
+                options: {
+                  text: "<p>Enter some text...</p>"
+                }
+              }
+            }
+          ]
+        },
+        {
+          name: "width",
+          type: "number",
+          hideFromUI: !0,
+          helperText: "Width %, e.g. set to 50 to fill half of the space"
+        },
+        {
+          name: "link",
+          type: "url",
+          helperText: "Optionally set a url that clicking this column will link to"
+        }
+      ],
+      defaultValue: [
+        {
+          blocks: [
+            {
+              "@type": "@builder.io/sdk:Element",
+              responsiveStyles: {
+                large: {
+                  display: "flex",
+                  flexDirection: "column",
+                  alignItems: "stretch",
+                  flexShrink: "0",
+                  position: "relative",
+                  marginTop: "30px",
+                  textAlign: "center",
+                  lineHeight: "normal",
+                  height: "auto",
+                  minHeight: "20px",
+                  minWidth: "20px",
+                  overflow: "hidden"
+                }
+              },
+              component: {
+                name: "Image",
+                options: {
+                  image: "https://builder.io/api/v1/image/assets%2Fpwgjf0RoYWbdnJSbpBAjXNRMe9F2%2Ffb27a7c790324294af8be1c35fe30f4d",
+                  backgroundPosition: "center",
+                  backgroundSize: "cover",
+                  aspectRatio: 0.7004048582995948
+                }
+              }
+            },
+            {
+              "@type": "@builder.io/sdk:Element",
+              responsiveStyles: {
+                large: {
+                  display: "flex",
+                  flexDirection: "column",
+                  alignItems: "stretch",
+                  flexShrink: "0",
+                  position: "relative",
+                  marginTop: "30px",
+                  textAlign: "center",
+                  lineHeight: "normal",
+                  height: "auto"
+                }
+              },
+              component: {
+                name: "Text",
+                options: {
+                  text: "<p>Enter some text...</p>"
+                }
+              }
+            }
+          ]
+        },
+        {
+          blocks: [
+            {
+              "@type": "@builder.io/sdk:Element",
+              responsiveStyles: {
+                large: {
+                  display: "flex",
+                  flexDirection: "column",
+                  alignItems: "stretch",
+                  flexShrink: "0",
+                  position: "relative",
+                  marginTop: "30px",
+                  textAlign: "center",
+                  lineHeight: "normal",
+                  height: "auto",
+                  minHeight: "20px",
+                  minWidth: "20px",
+                  overflow: "hidden"
+                }
+              },
+              component: {
+                name: "Image",
+                options: {
+                  image: "https://builder.io/api/v1/image/assets%2Fpwgjf0RoYWbdnJSbpBAjXNRMe9F2%2Ffb27a7c790324294af8be1c35fe30f4d",
+                  backgroundPosition: "center",
+                  backgroundSize: "cover",
+                  aspectRatio: 0.7004048582995948
+                }
+              }
+            },
+            {
+              "@type": "@builder.io/sdk:Element",
+              responsiveStyles: {
+                large: {
+                  display: "flex",
+                  flexDirection: "column",
+                  alignItems: "stretch",
+                  flexShrink: "0",
+                  position: "relative",
+                  marginTop: "30px",
+                  textAlign: "center",
+                  lineHeight: "normal",
+                  height: "auto"
+                }
+              },
+              component: {
+                name: "Text",
+                options: {
+                  text: "<p>Enter some text...</p>"
+                }
+              }
+            }
+          ]
+        }
+      ],
+      onChange: x((e) => {
+        function n() {
+          t.forEach((a) => {
+            a.delete("width");
+          });
+        }
+        const t = e.get("columns");
+        Array.isArray(t) && !!t.find(
+          (o) => o.get("width")
+        ) && (!!t.find(
+          (i) => !i.get("width")
+        ) || t.reduce((l, r) => l + r.get("width"), 0) !== 100) && n();
+      })
+    },
+    {
+      name: "space",
+      type: "number",
+      defaultValue: 20,
+      helperText: "Size of gap between columns",
+      advanced: !0
+    },
+    {
+      name: "stackColumnsAt",
+      type: "string",
+      defaultValue: "tablet",
+      helperText: "Convert horizontal columns to vertical at what device size",
+      enum: ["tablet", "mobile", "never"],
+      advanced: !0
+    },
+    {
+      name: "reverseColumnsWhenStacked",
+      type: "boolean",
+      defaultValue: !1,
+      helperText: "When stacking columns for mobile devices, reverse the ordering",
+      advanced: !0
+    }
+  ]
+}, ie = {
+  name: "Fragment",
+  static: !0,
+  hidden: !0,
+  canHaveChildren: !0,
+  noWrap: !0
+}, se = {
+  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"],
+      required: !0,
+      defaultValue: "https://cdn.builder.io/api/v1/image/assets%2FYJIGb4i01jvw0SRdL5Bt%2F72c80f114dc149019051b6852a9e3b7a",
+      onChange: x(
+        (e) => {
+          e.delete("srcset"), e.delete("noWebp");
+          function t(s, l = 6e4) {
+            return new Promise((r, c) => {
+              const d = document.createElement("img");
+              let u = !1;
+              d.onload = () => {
+                u = !0, r(d);
+              }, d.addEventListener("error", (p) => {
+                console.warn("Image load failed", p.error), c(p.error);
+              }), d.src = s, setTimeout(() => {
+                u || c(new Error("Image load timed out"));
+              }, l);
+            });
+          }
+          function a(s) {
+            return Math.round(s * 1e3) / 1e3;
+          }
+          const o = e.get("image"), i = e.get("aspectRatio");
+          if (fetch(o).then((s) => s.blob()).then((s) => {
+            s.type.includes("svg") && e.set("noWebp", !0);
+          }), o && (!i || i === 0.7041))
+            return t(o).then((s) => {
+              const l = e.get("aspectRatio");
+              e.get("image") === o && (!l || l === 0.7041) && s.width && s.height && (e.set("aspectRatio", a(s.height / s.width)), e.set("height", s.height), e.set("width", s.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: "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: 0.7041
+    }
+  ]
+}, re = {
+  name: "Core:Section",
+  static: !0,
+  image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F682efef23ace49afac61748dd305c70a",
+  inputs: [
+    {
+      name: "maxWidth",
+      type: "number",
+      defaultValue: 1200
+    },
+    {
+      name: "lazyLoad",
+      type: "boolean",
+      defaultValue: !1,
+      advanced: !0,
+      description: "Only render this section when in view"
+    }
+  ],
+  defaultStyles: {
+    paddingLeft: "20px",
+    paddingRight: "20px",
+    paddingTop: "50px",
+    paddingBottom: "50px",
+    marginTop: "0px",
+    width: "100vw",
+    marginLeft: "calc(50% - 50vw)"
+  },
+  canHaveChildren: !0,
+  defaultChildren: [
+    {
+      "@type": "@builder.io/sdk:Element",
+      responsiveStyles: {
+        large: {
+          textAlign: "center"
+        }
+      },
+      component: {
+        name: "Text",
+        options: {
+          text: "<p><b>I am a section! My content keeps from getting too wide, so that it's easy to read even on big screens.</b></p><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</p>"
+        }
+      }
+    }
+  ]
+}, le = {
+  name: "Symbol",
+  noWrap: !0,
+  static: !0,
+  inputs: [
+    {
+      name: "symbol",
+      type: "uiSymbol"
+    },
+    {
+      name: "dataOnly",
+      helperText: "Make this a data symbol that doesn't display any UI",
+      type: "boolean",
+      defaultValue: !1,
+      advanced: !0,
+      hideFromUI: !0
+    },
+    {
+      name: "inheritState",
+      helperText: "Inherit the parent component state and data",
+      type: "boolean",
+      defaultValue: !1,
+      advanced: !0
+    },
+    {
+      name: "renderToLiquid",
+      helperText: "Render this symbols contents to liquid. Turn off to fetch with javascript and use custom targeting",
+      type: "boolean",
+      defaultValue: !1,
+      advanced: !0,
+      hideFromUI: !0
+    },
+    {
+      name: "useChildren",
+      hideFromUI: !0,
+      type: "boolean"
+    }
+  ]
+}, de = {
+  name: "Text",
+  static: !0,
+  image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-text_fields-24px%20(1).svg?alt=media&token=12177b73-0ee3-42ca-98c6-0dd003de1929",
+  inputs: [
+    {
+      name: "text",
+      type: "html",
+      required: !0,
+      autoFocus: !0,
+      bubble: !0,
+      defaultValue: "Enter some text..."
+    }
+  ],
+  defaultStyles: {
+    lineHeight: "normal",
+    height: "auto",
+    textAlign: "center"
+  }
+}, ce = {
+  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://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/assets%2FKQlEmWDxA0coC3PK6UvkrjwkIGI2%2F28cb070609f546cdbe5efa20e931aa4b?alt=media&token=912e9551-7a7c-4dfb-86b6-3da1537d1a7f",
+      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: "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: 0.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
+    }
+  ]
+}, ue = {
+  name: "Embed",
+  static: !0,
+  inputs: [
+    {
+      name: "url",
+      type: "url",
+      required: !0,
+      defaultValue: "",
+      helperText: "e.g. enter a youtube url, google map, etc",
+      onChange: x(
+        (e) => {
+          const n = e.get("url");
+          if (n)
+            return e.set("content", "Loading..."), fetch(
+              `https://iframe.ly/api/iframely?url=${n}&api_key=ae0e60e78201a3f2b0de4b`
+            ).then((a) => a.json()).then((a) => {
+              e.get("url") === n && (a.html ? e.set("content", a.html) : e.set("content", "Invalid url, please try another"));
+            }).catch((a) => {
+              e.set(
+                "content",
+                "There was an error embedding this URL, please try again or another URL"
+              );
+            });
+          e.delete("content");
+        }
+      )
+    },
+    {
+      name: "content",
+      type: "html",
+      defaultValue: '<div style="padding: 20px; text-align: center">(Choose an embed URL)<div>',
+      hideFromUI: !0
+    }
+  ]
+}, pe = [
+  "text/javascript",
+  "application/javascript",
+  "application/ecmascript"
+], me = (e) => pe.includes(e.type), he = g({
+  name: "builder-embed",
+  props: ["content"],
+  data() {
+    return { scriptsInserted: [], scriptsRun: [], ranInitFn: !1 };
+  },
+  watch: {
+    onUpdateHook0: {
+      handler() {
+        this.$refs.elem && !this.ranInitFn && (this.ranInitFn = !0, this.findAndRunScripts());
+      },
+      immediate: !0
+    }
+  },
+  computed: {
+    onUpdateHook0() {
+      return {
+        0: this.$refs.elem,
+        1: this.ranInitFn
+      };
+    }
+  },
+  methods: {
+    findAndRunScripts() {
+      if (!this.$refs.elem || !this.$refs.elem.getElementsByTagName)
+        return;
+      const e = this.$refs.elem.getElementsByTagName("script");
+      for (let n = 0; n < e.length; n++) {
+        const t = e[n];
+        if (t.src && !this.scriptsInserted.includes(t.src)) {
+          this.scriptsInserted.push(t.src);
+          const a = document.createElement("script");
+          a.async = !0, a.src = t.src, document.head.appendChild(a);
+        } else if (me(t) && !this.scriptsRun.includes(t.innerText))
+          try {
+            this.scriptsRun.push(t.innerText), new Function(t.innerText)();
+          } catch (a) {
+            console.warn("`Embed`: Error running script:", a);
+          }
+      }
+    }
+  }
+}), fe = ["innerHTML"];
+function ge(e, n, t, a, o, i) {
+  return m(), b("div", {
+    class: "builder-embed",
+    ref: "elem",
+    innerHTML: e.content
+  }, null, 8, fe);
+}
+const be = /* @__PURE__ */ y(he, [["render", ge]]), ye = g({
+  name: "builder-img-component",
+  props: [
+    "backgroundSize",
+    "backgroundPosition",
+    "imgSrc",
+    "altText",
+    "image",
+    "attributes"
+  ],
+  data() {
+    return { isEditing: f };
+  },
+  methods: {
+    filterAttrs: function(n = {}, t) {
+      const a = "v-on:";
+      return Object.keys(n).filter((o) => {
+        if (!n[o])
+          return !1;
+        const i = o.startsWith(a);
+        return t ? i : !i;
+      }).reduce(
+        (o, i) => ({
+          ...o,
+          [i.replace(a, "")]: n[i]
+        }),
+        {}
+      );
+    }
+  }
+}), ve = ["alt", "src"];
+function Ce(e, n, t, a, o, i) {
+  return m(), b("img", U({
+    style: {
+      objectFit: e.backgroundSize || "cover",
+      objectPosition: e.backgroundPosition || "center"
+    },
+    key: e.isEditing() && e.imgSrc || "default-key",
+    alt: e.altText,
+    src: e.imgSrc || e.image
+  }, e.filterAttrs(e.attributes, !1), P(e.filterAttrs(e.attributes, !0), !0)), null, 16, ve);
+}
+const ke = /* @__PURE__ */ y(ye, [["render", Ce]]), xe = {
+  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"],
+      required: !0
+    }
+  ],
+  noWrap: !0,
+  static: !0
+}, Se = g({
+  name: "builder-custom-code",
+  props: ["replaceNodes", "code"],
+  data() {
+    return { scriptsInserted: [], scriptsRun: [] };
+  },
+  mounted() {
+    this.findAndRunScripts();
+  },
+  methods: {
+    findAndRunScripts() {
+      if (this.$refs.elem && this.$refs.elem.getElementsByTagName && typeof window < "u") {
+        const e = this.$refs.elem.getElementsByTagName("script");
+        for (let n = 0; n < e.length; n++) {
+          const t = e[n];
+          if (t.src) {
+            if (this.scriptsInserted.includes(t.src))
+              continue;
+            this.scriptsInserted.push(t.src);
+            const a = document.createElement("script");
+            a.async = !0, a.src = t.src, document.head.appendChild(a);
+          } else if (!t.type || [
+            "text/javascript",
+            "application/javascript",
+            "application/ecmascript"
+          ].includes(t.type)) {
+            if (this.scriptsRun.includes(t.innerText))
+              continue;
+            try {
+              this.scriptsRun.push(t.innerText), new Function(t.innerText)();
+            } catch (a) {
+              console.warn("`CustomCode`: Error running script:", a);
+            }
+          }
+        }
+      }
+    },
+    _classStringToObject(e) {
+      const n = {};
+      if (typeof e != "string")
+        return n;
+      const t = e.trim().split(/\s+/);
+      for (const a of t)
+        n[a] = !0;
+      return n;
+    }
+  }
+}), Te = ["innerHTML"];
+function Re(e, n, t, a, o, i) {
+  return m(), b("div", {
+    ref: "elem",
+    class: j(
+      e._classStringToObject(
+        "builder-custom-code" + (e.replaceNodes ? " replace-nodes" : "")
+      )
+    ),
+    innerHTML: e.code
+  }, null, 10, Te);
+}
+const we = /* @__PURE__ */ y(Se, [["render", Re]]), Ie = {
+  name: "Custom Code",
+  static: !0,
+  requiredPermissions: ["editCode"],
+  inputs: [
+    {
+      name: "code",
+      type: "html",
+      required: !0,
+      defaultValue: "<p>Hello there, I am custom HTML code!</p>",
+      code: !0
+    },
+    {
+      name: "replaceNodes",
+      type: "boolean",
+      helperText: "Preserve server rendered dom nodes",
+      advanced: !0
+    },
+    {
+      name: "scriptsClientOnly",
+      type: "boolean",
+      defaultValue: !1,
+      helperText: "Only print and run scripts on the client. Important when scripts influence DOM that could be replaced when client loads",
+      advanced: !0
+    }
+  ]
+}, Ee = () => [
+  { component: W, ...ae },
+  { component: _, ...oe },
+  { component: we, ...Ie },
+  { component: be, ...ue },
+  { component: B, ...ie },
+  { component: q, ...se },
+  { component: ke, ...xe },
+  { component: N, ...re },
+  { component: O, ...le },
+  { component: D, ...de },
+  { component: K, ...ce }
+], Fe = "0.4.0", Ve = () => {
+  z("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 F = !1;
+const Ae = (e = {}) => {
+  var n, t;
+  F || (F = !0, k() && ((n = window.parent) == null || n.postMessage(
+    {
+      type: "builder.sdkInfo",
+      data: {
+        target: $,
+        version: Fe,
+        supportsPatchUpdates: !1,
+        supportsAddBlockScoping: !0,
+        supportsCustomBreakpoints: !0
+      }
+    },
+    "*"
+  ), (t = window.parent) == null || t.postMessage(
+    {
+      type: "builder.updateContent",
+      data: {
+        options: e
+      }
+    },
+    "*"
+  ), window.addEventListener("message", ({ data: a }) => {
+    var o, i;
+    if (!!(a != null && a.type))
+      switch (a.type) {
+        case "builder.evaluate": {
+          const s = a.data.text, l = a.data.arguments || [], r = a.data.id, c = new Function(s);
+          let d, u = null;
+          try {
+            d = c.apply(null, l);
+          } catch (p) {
+            u = p;
+          }
+          u ? (o = window.parent) == null || o.postMessage(
+            {
+              type: "builder.evaluateError",
+              data: { id: r, error: u.message }
+            },
+            "*"
+          ) : d && typeof d.then == "function" ? d.then((p) => {
+            var h;
+            (h = window.parent) == null || h.postMessage(
+              {
+                type: "builder.evaluateResult",
+                data: { id: r, result: p }
+              },
+              "*"
+            );
+          }).catch(console.error) : (i = window.parent) == null || i.postMessage(
+            {
+              type: "builder.evaluateResult",
+              data: { result: d, id: r }
+            },
+            "*"
+          );
+          break;
+        }
+      }
+  })));
+};
+function V(e) {
+  return Math.round(e * 1e3) / 1e3;
+}
+const Ue = (e, n, t = !0) => {
+  if (!(e instanceof HTMLElement))
+    return null;
+  let a = t ? e : e.parentElement;
+  do {
+    if (!a)
+      return null;
+    if (n(a))
+      return a;
+  } while (a = a.parentElement);
+  return null;
+}, $e = (e) => Ue(e, (n) => {
+  const t = n.getAttribute("builder-id") || n.id;
+  return Boolean((t == null ? void 0 : t.indexOf("builder-")) === 0);
+}), A = ({
+  event: e,
+  target: n
+}) => {
+  const t = n.getBoundingClientRect(), a = e.clientX - t.left, o = e.clientY - t.top, i = V(a / t.width), s = V(o / t.height);
+  return {
+    x: i,
+    y: s
+  };
+}, He = (e) => {
+  const n = e.target, t = n && $e(n), a = (t == null ? void 0 : t.getAttribute("builder-id")) || (t == null ? void 0 : t.id);
+  return {
+    targetBuilderElement: a || void 0,
+    metadata: {
+      targetOffset: n ? A({ event: e, target: n }) : void 0,
+      builderTargetOffset: t ? A({ event: e, target: t }) : void 0,
+      builderElementIndex: t && a ? [].slice.call(document.getElementsByClassName(a)).indexOf(t) : void 0
+    }
+  };
+}, Pe = ({
+  content: e,
+  data: n,
+  locale: t
+}) => {
+  var i, s, l;
+  const a = {};
+  (s = (i = e == null ? void 0 : e.data) == null ? void 0 : i.inputs) == null || s.forEach((r) => {
+    var c;
+    r.name && r.defaultValue !== void 0 && ((c = e == null ? void 0 : e.data) == null ? void 0 : c.state) && e.data.state[r.name] === void 0 && (a[r.name] = r.defaultValue);
+  });
+  const o = {
+    ...(l = e == null ? void 0 : e.data) == null ? void 0 : l.state,
+    ...n,
+    ...t ? { locale: t } : {}
+  };
+  return { ...a, ...o };
+}, je = ({
+  content: e,
+  data: n
+}) => e ? {
+  ...e,
+  data: {
+    ...e == null ? void 0 : e.data,
+    ...n
+  },
+  meta: e == null ? void 0 : e.meta
+} : void 0, Le = L, Me = () => import("./index.32c5f4e2.js").then((e) => e.z).then((e) => e.default).catch((e) => {
+  throw console.error(
+    "Error while attempting to dynamically import component RenderBlocks at ../render-blocks.vue",
+    e
+  ), e;
+}), We = () => import("./render-styles.665ea958.js").then((e) => e.default).catch((e) => {
+  throw console.error(
+    "Error while attempting to dynamically import component RenderContentStyles at ./components/render-styles.vue",
+    e
+  ), e;
+}), _e = g({
+  name: "render-content",
+  components: {
+    RenderContentStyles: R(We),
+    RenderBlocks: R(Me)
+  },
+  props: [
+    "content",
+    "data",
+    "canTrack",
+    "locale",
+    "customComponents",
+    "model",
+    "context",
+    "apiKey",
+    "parentContentId",
+    "hideContent",
+    "classNameProp",
+    "isSsrAbTest",
+    "includeRefs",
+    "enrich",
+    "apiVersion"
+  ],
+  data() {
+    var e;
+    return {
+      forceReRenderCount: 0,
+      overrideContent: null,
+      useContent: je({
+        content: this.content,
+        data: this.data
+      }),
+      update: 0,
+      canTrackToUse: J(this.canTrack) ? this.canTrack : !0,
+      contentState: Pe({
+        content: this.content,
+        data: this.data,
+        locale: this.locale
+      }),
+      allRegisteredComponents: [
+        ...Ee(),
+        ...Y,
+        ...this.customComponents || []
+      ].reduce(
+        (n, { component: t, ...a }) => ({
+          ...n,
+          [a.name]: {
+            component: Le(t),
+            ...a
+          }
+        }),
+        {}
+      ),
+      httpReqsData: {},
+      clicked: !1,
+      scriptStr: G({
+        contentId: (e = this.content) == null ? void 0 : e.id,
+        parentContentId: this.parentContentId
+      }),
+      TARGET: $
+    };
+  },
+  provide() {
+    const e = this;
+    return {
+      [X.key]: {
+        content: e.useContent,
+        localState: void 0,
+        rootState: e.contentState,
+        rootSetState: e.contentSetState,
+        context: e.context || {},
+        apiKey: e.apiKey,
+        apiVersion: e.apiVersion,
+        registeredComponents: e.allRegisteredComponents,
+        inheritedStyles: {}
+      }
+    };
+  },
+  mounted() {
+    var e, n;
+    if (this.apiKey || Q.error(
+      "No API key provided to `RenderContent` component. This can cause issues. Please provide an API key using the `apiKey` prop."
+    ), k()) {
+      if (f() && (this.forceReRenderCount = this.forceReRenderCount + 1, Ve(), Ae({
+        ...this.locale ? {
+          locale: this.locale
+        } : {},
+        ...this.includeRefs ? {
+          includeRefs: this.includeRefs
+        } : {},
+        ...this.enrich ? {
+          enrich: this.enrich
+        } : {}
+      }), Object.values(
+        this.allRegisteredComponents
+      ).forEach((t) => {
+        var o;
+        const a = Z(t);
+        (o = window.parent) == null || o.postMessage(a, "*");
+      }), window.addEventListener("message", this.processMessage), window.addEventListener(
+        "builder:component:stateChangeListenerActivated",
+        this.emitStateUpdate
+      )), this.useContent) {
+        const t = (e = this.useContent) == null ? void 0 : e.testVariationId, a = (n = this.useContent) == null ? void 0 : n.id;
+        I({
+          type: "impression",
+          canTrack: this.canTrackToUse,
+          contentId: a,
+          apiKey: this.apiKey,
+          variationId: t !== a ? t : void 0
+        });
+      }
+      if (ee()) {
+        const t = new URL(location.href).searchParams, a = t.get("builder.preview"), o = t.get(
+          `builder.preview.${a}`
+        ), i = t.get("apiKey") || t.get("builder.space");
+        a === this.model && i === this.apiKey && (!this.content || o === this.content.id) && te({
+          model: this.model,
+          apiKey: this.apiKey,
+          apiVersion: this.apiVersion
+        }).then((s) => {
+          s && this.mergeNewContent(s);
+        });
+      }
+      this.evaluateJsCode(), this.runHttpRequests(), this.emitStateUpdate();
+    }
+  },
+  watch: {
+    onUpdateHook0: {
+      handler() {
+        this.content && this.mergeNewContent(this.content);
+      },
+      immediate: !0
+    },
+    onUpdateHook1: {
+      handler() {
+        this.evaluateJsCode();
+      },
+      immediate: !0
+    },
+    onUpdateHook2: {
+      handler() {
+        this.runHttpRequests();
+      },
+      immediate: !0
+    },
+    onUpdateHook3: {
+      handler() {
+        this.emitStateUpdate();
+      },
+      immediate: !0
+    }
+  },
+  unmounted() {
+    k() && (window.removeEventListener("message", this.processMessage), window.removeEventListener(
+      "builder:component:stateChangeListenerActivated",
+      this.emitStateUpdate
+    ));
+  },
+  computed: {
+    onUpdateHook0() {
+      return {
+        0: this.content
+      };
+    },
+    onUpdateHook1() {
+      var e, n;
+      return {
+        0: (n = (e = this.useContent) == null ? void 0 : e.data) == null ? void 0 : n.jsCode,
+        1: this.contentState
+      };
+    },
+    onUpdateHook2() {
+      var e, n;
+      return {
+        0: (n = (e = this.useContent) == null ? void 0 : e.data) == null ? void 0 : n.httpRequests
+      };
+    },
+    onUpdateHook3() {
+      return {
+        0: this.contentState
+      };
+    }
+  },
+  methods: {
+    mergeNewContent(e) {
+      var n, t, a, o, i;
+      this.useContent = {
+        ...this.useContent,
+        ...e,
+        data: {
+          ...(n = this.useContent) == null ? void 0 : n.data,
+          ...e == null ? void 0 : e.data
+        },
+        meta: {
+          ...(t = this.useContent) == null ? void 0 : t.meta,
+          ...e == null ? void 0 : e.meta,
+          breakpoints: ((a = e == null ? void 0 : e.meta) == null ? void 0 : a.breakpoints) || ((i = (o = this.useContent) == null ? void 0 : o.meta) == null ? void 0 : i.breakpoints)
+        }
+      };
+    },
+    setBreakpoints(e) {
+      var n;
+      this.useContent = {
+        ...this.useContent,
+        meta: {
+          ...(n = this.useContent) == null ? void 0 : n.meta,
+          breakpoints: e
+        }
+      };
+    },
+    contentSetState(e) {
+      this.contentState = e;
+    },
+    processMessage(e) {
+      var t;
+      const { data: n } = e;
+      if (n)
+        switch (n.type) {
+          case "builder.configureSdk": {
+            const a = n.data, { breakpoints: o, contentId: i } = a;
+            if (!i || i !== ((t = this.useContent) == null ? void 0 : t.id))
+              return;
+            o && this.setBreakpoints(o), this.forceReRenderCount = this.forceReRenderCount + 1;
+            break;
+          }
+          case "builder.contentUpdate": {
+            const a = n.data, o = a.key || a.alias || a.entry || a.modelName, i = a.data;
+            o === this.model && (this.mergeNewContent(i), this.forceReRenderCount = this.forceReRenderCount + 1);
+            break;
+          }
+        }
+    },
+    evaluateJsCode() {
+      var n, t;
+      const e = (t = (n = this.useContent) == null ? void 0 : n.data) == null ? void 0 : t.jsCode;
+      e && E({
+        code: e,
+        context: this.context || {},
+        localState: void 0,
+        rootState: this.contentState,
+        rootSetState: this.contentSetState
+      });
+    },
+    onClick(e) {
+      var n, t;
+      if (this.useContent) {
+        const a = (n = this.useContent) == null ? void 0 : n.testVariationId, o = (t = this.useContent) == null ? void 0 : t.id;
+        I({
+          type: "click",
+          canTrack: this.canTrackToUse,
+          contentId: o,
+          apiKey: this.apiKey,
+          variationId: a !== o ? a : void 0,
+          ...He(e),
+          unique: !this.clicked
+        });
+      }
+      this.clicked || (this.clicked = !0);
+    },
+    evalExpression(e) {
+      return e.replace(
+        /{{([^}]+)}}/g,
+        (n, t) => E({
+          code: t,
+          context: this.context || {},
+          localState: void 0,
+          rootState: this.contentState,
+          rootSetState: this.contentSetState
+        })
+      );
+    },
+    handleRequest({ url: e, key: n }) {
+      ne(e).then((t) => t.json()).then((t) => {
+        const a = {
+          ...this.contentState,
+          [n]: t
+        };
+        this.contentSetState(a);
+      }).catch((t) => {
+        console.error("error fetching dynamic data", e, t);
+      });
+    },
+    runHttpRequests() {
+      var n, t, a;
+      const e = (a = (t = (n = this.useContent) == null ? void 0 : n.data) == null ? void 0 : t.httpRequests) != null ? a : {};
+      Object.entries(e).forEach(([o, i]) => {
+        if (i && (!this.httpReqsData[o] || f())) {
+          const s = this.evalExpression(i);
+          this.handleRequest({
+            url: s,
+            key: o
+          });
+        }
+      });
+    },
+    emitStateUpdate() {
+      f() && window.dispatchEvent(
+        new CustomEvent(
+          "builder:component:stateChange",
+          {
+            detail: {
+              state: this.contentState,
+              ref: {
+                name: this.model
+              }
+            }
+          }
+        )
+      );
+    },
+    _classStringToObject(e) {
+      const n = {};
+      if (typeof e != "string")
+        return n;
+      const t = e.trim().split(/\s+/);
+      for (const a of t)
+        n[a] = !0;
+      return n;
+    }
+  }
+}), Be = ["builder-content-id", "builder-model"];
+function qe(e, n, t, a, o, i) {
+  var r, c, d, u, p, h, S, T;
+  const s = w("render-content-styles"), l = w("render-blocks");
+  return e.useContent ? (m(), b("div", U({
+    key: 0,
+    ref: "elementRef",
+    onClick: n[0] || (n[0] = (H) => e.onClick(H)),
+    "builder-content-id": (r = e.useContent) == null ? void 0 : r.id,
+    "builder-model": e.model,
+    class: e._classStringToObject(e.classNameProp)
+  }, {
+    ...e.TARGET === "reactNative" ? {
+      dataSet: {
+        "builder-content-id": ""
+      }
+    } : {},
+    ...e.hideContent ? {
+      hidden: !0,
+      "aria-hidden": !0
+    } : {}
+  }), [
+    e.isSsrAbTest ? (m(), v(M("script"), {
+      key: 0,
+      innerHTML: e.scriptStr
+    }, null, 8, ["innerHTML"])) : C("", !0),
+    e.TARGET !== "reactNative" ? (m(), v(s, {
+      key: 1,
+      contentId: (c = e.useContent) == null ? void 0 : c.id,
+      cssCode: (u = (d = e.useContent) == null ? void 0 : d.data) == null ? void 0 : u.cssCode,
+      customFonts: (h = (p = e.useContent) == null ? void 0 : p.data) == null ? void 0 : h.customFonts
+    }, null, 8, ["contentId", "cssCode", "customFonts"])) : C("", !0),
+    (m(), v(l, {
+      blocks: (T = (S = e.useContent) == null ? void 0 : S.data) == null ? void 0 : T.blocks,
+      key: e.forceReRenderCount
+    }, null, 8, ["blocks"]))
+  ], 16, Be)) : C("", !0);
+}
+const Ke = /* @__PURE__ */ y(_e, [["render", qe]]);
+export {
+  Ke as default
+};