@builder.io/sdk-vue 1.0.15 → 1.0.17

package/lib/node/{index-tdTNLVlt.js → index-wXqz2rFK.js}

@@ -696,22 +696,22 @@ const getComponent = ({
     },
     block: o
   }));
-}, BlockStyles = () => import("./block-styles-rh7tEoHf.js").then((e) => e.default).catch((e) => {
+}, BlockStyles = () => import("./block-styles-osmIZ6Mt.js").then((e) => e.default).catch((e) => {
   throw console.error(
     "Error while attempting to dynamically import component BlockStyles at ./components/block-styles.vue",
     e
   ), e;
-}), BlockWrapper = () => import("./block-wrapper-MpN3sYhf.js").then((e) => e.default).catch((e) => {
+}), BlockWrapper = () => import("./block-wrapper-5xqcFiwU.js").then((e) => e.default).catch((e) => {
   throw console.error(
     "Error while attempting to dynamically import component BlockWrapper at ./components/block-wrapper.vue",
     e
   ), e;
-}), ComponentRef = () => import("./component-ref-GxIWocaf.js").then((e) => e.default).catch((e) => {
+}), ComponentRef = () => import("./component-ref-mGwwqC-f.js").then((e) => e.default).catch((e) => {
   throw console.error(
     "Error while attempting to dynamically import component ComponentRef at ./components/component-ref/component-ref.vue",
     e
   ), e;
-}), RepeatedBlock = () => import("./repeated-block-XpohtcNq.js").then((e) => e.default).catch((e) => {
+}), RepeatedBlock = () => import("./repeated-block-_XkAOrun.js").then((e) => e.default).catch((e) => {
   throw console.error(
     "Error while attempting to dynamically import component RepeatedBlock at ./components/repeated-block.vue",
     e
@@ -963,7 +963,10 @@ function _sfc_render$j(e, t, n, o, r, s) {
 }
 const Blocks = /* @__PURE__ */ _export_sfc(_sfc_main$l, [["render", _sfc_render$j]]), _sfc_main$k = defineComponent({
   render() {
-    return h("style", { id: this.id, innerHTML: this.styles });
+    return h("style", {
+      innerHTML: this.styles,
+      "data-id": this.id
+    });
   },
   name: "inlined-styles",
   props: ["styles", "id"]
@@ -1140,6 +1143,7 @@ function _sfc_render$i(e, t, n, o, r, s) {
   }, {}), [
     e.TARGET !== "reactNative" ? (openBlock(), createBlock(i, {
       key: 0,
+      id: "builderio-columns",
       styles: e.columnsStyles
     }, null, 8, ["styles"])) : createCommentVNode("", !0),
     (openBlock(!0), createElementBlock(Fragment$1, null, renderList(e.columns, (c, u) => (openBlock(), createBlock(l, {
@@ -1171,7 +1175,7 @@ function _sfc_render$i(e, t, n, o, r, s) {
     }, 1032, ["TagName", "attributes"]))), 128))
   ], 16);
 }
-const Columns = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["render", _sfc_render$i], ["__scopeId", "data-v-d0d8b675"]]), _sfc_main$i = defineComponent({
+const Columns = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["render", _sfc_render$i], ["__scopeId", "data-v-4eaba73b"]]), _sfc_main$i = defineComponent({
   name: "builder-fragment-component",
   props: []
 });
@@ -3090,7 +3094,7 @@ const Video = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["render", _sfc_render$5
 })), checkShouldRenderVariants = ({
   canTrack: e,
   content: t
-}) => !(!(getVariants(t).length > 0) || !e), getIsHydrationTarget = (e) => e === "react" || e === "reactNative", isHydrationTarget = getIsHydrationTarget(TARGET), getScriptString = () => `
+}) => !(!(getVariants(t).length > 0) || !e), getIsHydrationTarget = (e) => e === "react" || e === "reactNative", isHydrationTarget = getIsHydrationTarget(TARGET), getInitVariantsFnsScriptString = () => `
   window.${UPDATE_COOKIES_AND_STYLES_SCRIPT_NAME} = ${UPDATE_COOKIES_AND_STYLES_SCRIPT}
   window.${UPDATE_VARIANT_VISIBILITY_SCRIPT_FN_NAME} = ${UPDATE_VARIANT_VISIBILITY_SCRIPT}
   `, getUpdateCookieAndStylesScript = (e, t) => `
@@ -3103,7 +3107,10 @@ const Video = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["render", _sfc_render$5
     "${t}", "${e}", ${isHydrationTarget}
   )`, _sfc_main$5 = defineComponent({
   render() {
-    return h("script", { id: this.id, innerHTML: this.scriptStr });
+    return h("script", {
+      innerHTML: this.scriptStr,
+      "data-id": this.id
+    });
   },
   name: "inlined-script",
   props: ["scriptStr", "id"]
@@ -3425,7 +3432,7 @@ function isFromTrustedHost(e, t) {
   const n = new URL(t.origin), o = n.hostname;
   return (e || DEFAULT_TRUSTED_HOSTS).findIndex((r) => r.startsWith("*.") ? o.endsWith(r.slice(1)) : r === o) > -1;
 }
-const SDK_VERSION = "1.0.15", registry = {};
+const SDK_VERSION = "1.0.17", registry = {};
 function register(e, t) {
   let n = registry[e];
   if (n || (n = registry[e] = []), n.push(t), isBrowser()) {
@@ -3594,6 +3601,7 @@ const setupBrowserForEditing = (e = {}) => {
     return {
       ContentWrapper: this.contentWrapper || "div",
       httpReqsData: {},
+      httpReqsPending: {},
       clicked: !1,
       builderContext: BuilderContext
     };
@@ -3790,44 +3798,35 @@ const setupBrowserForEditing = (e = {}) => {
       }
       this.clicked || (this.clicked = !0);
     },
-    evalExpression(e) {
-      return e.replace(
-        /{{([^}]+)}}/g,
-        (t, n) => String(
-          evaluate({
-            code: n,
-            context: this.context || {},
-            localState: void 0,
-            rootState: this.builderContextSignal.rootState,
-            rootSetState: this.builderContextSignal.rootSetState,
-            enableCache: !0
-          })
-        )
-      );
-    },
-    handleRequest({ url: e, key: t }) {
-      fetch$1(e).then((n) => n.json()).then((n) => {
-        var r, s;
-        const o = {
-          ...this.builderContextSignal.rootState,
-          [t]: n
-        };
-        (s = (r = this.builderContextSignal).rootSetState) == null || s.call(r, o), this.httpReqsData[t] = !0;
-      }).catch((n) => {
-        console.error("error fetching dynamic data", e, n);
-      });
-    },
     runHttpRequests() {
       var t, n;
       const e = ((n = (t = this.builderContextSignal.content) == null ? void 0 : t.data) == null ? void 0 : n.httpRequests) ?? {};
       Object.entries(e).forEach(([o, r]) => {
-        if (r && (!this.httpReqsData[o] || isEditing())) {
-          const s = this.evalExpression(r);
-          this.handleRequest({
-            url: s,
-            key: o
-          });
-        }
+        if (!r || this.httpReqsPending[o] || this.httpReqsData[o] && !isEditing())
+          return;
+        this.httpReqsPending[o] = !0;
+        const s = r.replace(
+          /{{([^}]+)}}/g,
+          (i, a) => String(
+            evaluate({
+              code: a,
+              context: this.context || {},
+              localState: void 0,
+              rootState: this.builderContextSignal.rootState,
+              rootSetState: this.builderContextSignal.rootSetState,
+              enableCache: !0
+            })
+          )
+        );
+        fetch$1(s).then((i) => i.json()).then((i) => {
+          this.mergeNewRootState({
+            [o]: i
+          }), this.httpReqsData[o] = !0;
+        }).catch((i) => {
+          console.error("error fetching dynamic data", r, i);
+        }).finally(() => {
+          this.httpReqsPending[o] = !1;
+        });
       });
     },
     emitStateUpdate() {
@@ -3977,7 +3976,10 @@ ${getDefaultStyles(this.isNestedRender)}
 });
 function _sfc_render$3(e, t, n, o, r, s) {
   const i = resolveComponent("inlined-styles");
-  return openBlock(), createBlock(i, { styles: e.injectedStyles }, null, 8, ["styles"]);
+  return openBlock(), createBlock(i, {
+    id: "builderio-content",
+    styles: e.injectedStyles
+  }, null, 8, ["styles"]);
 }
 const ContentStyles = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["render", _sfc_render$3]]), getRootStateInitialValue = ({
   content: e,
@@ -4126,6 +4128,7 @@ function _sfc_render$2(e, t, n, o, r, s) {
       return [
         e.isSsrAbTest ? (openBlock(), createBlock(i, {
           key: 0,
+          id: "builderio-variant-visibility",
           scriptStr: e.scriptStr
         }, null, 8, ["scriptStr"])) : createCommentVNode("", !0),
         e.TARGET !== "reactNative" ? (openBlock(), createBlock(a, {
@@ -4179,7 +4182,7 @@ const ContentComponent = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["render", _s
         content: this.content
       }),
       TARGET,
-      getScriptString,
+      getInitVariantsFnsScriptString,
       getVariants
     };
   },
@@ -4213,23 +4216,26 @@ const ContentComponent = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["render", _s
   }
 });
 function _sfc_render$1(e, t, n, o, r, s) {
-  var c;
   const i = resolveComponent("inlined-script"), a = resolveComponent("inlined-styles"), l = resolveComponent("content-component");
   return openBlock(), createElementBlock(Fragment$1, null, [
     !e.isNestedRender && e.TARGET !== "reactNative" ? (openBlock(), createBlock(i, {
       key: 0,
-      scriptStr: e.getScriptString()
+      id: "builderio-init-variants-fns",
+      scriptStr: e.getInitVariantsFnsScriptString()
     }, null, 8, ["scriptStr"])) : createCommentVNode("", !0),
     e.shouldRenderVariants ? (openBlock(), createElementBlock(Fragment$1, { key: 1 }, [
       createVNode(a, {
-        id: `variants-styles-${(c = e.content) == null ? void 0 : c.id}`,
+        id: "builderio-variants",
         styles: e.hideVariantsStyleString
-      }, null, 8, ["id", "styles"]),
-      createVNode(i, { scriptStr: e.updateCookieAndStylesScriptStr }, null, 8, ["scriptStr"]),
-      (openBlock(!0), createElementBlock(Fragment$1, null, renderList(e.getVariants(e.content), (u, d) => (openBlock(), createBlock(l, {
-        key: u.testVariationId,
+      }, null, 8, ["styles"]),
+      createVNode(i, {
+        id: "builderio-variants-visibility",
+        scriptStr: e.updateCookieAndStylesScriptStr
+      }, null, 8, ["scriptStr"]),
+      (openBlock(!0), createElementBlock(Fragment$1, null, renderList(e.getVariants(e.content), (c, u) => (openBlock(), createBlock(l, {
+        key: c.testVariationId,
         isNestedRender: e.isNestedRender,
-        content: u,
+        content: c,
         showContent: !1,
         model: e.model,
         data: e.data,

package/lib/node/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-Oh0XoTAq.cjs");exports.Blocks=e.Blocks;exports.Button=e.Button;exports.Columns=e.Columns;exports.Content=e.ContentVariants;exports.Fragment=e.Fragment;exports.Image=e.Image;exports.Section=e.Section;exports.Symbol=e.Symbol;exports.Text=e.Text;exports.Video=e.Video;exports._processContentResult=e._processContentResult;exports.createRegisterComponentMessage=e.createRegisterComponentMessage;exports.fetchBuilderProps=e.fetchBuilderProps;exports.fetchEntries=e.fetchEntries;exports.fetchOneEntry=e.fetchOneEntry;exports.getBuilderSearchParams=e.getBuilderSearchParams;exports.isEditing=e.isEditing;exports.isPreviewing=e.isPreviewing;exports.register=e.register;exports.setEditorSettings=e.setEditorSettings;exports.subscribeToEditor=e.subscribeToEditor;exports.track=e.track;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-8hg8pWTn.cjs");exports.Blocks=e.Blocks;exports.Button=e.Button;exports.Columns=e.Columns;exports.Content=e.ContentVariants;exports.Fragment=e.Fragment;exports.Image=e.Image;exports.Section=e.Section;exports.Symbol=e.Symbol;exports.Text=e.Text;exports.Video=e.Video;exports._processContentResult=e._processContentResult;exports.createRegisterComponentMessage=e.createRegisterComponentMessage;exports.fetchBuilderProps=e.fetchBuilderProps;exports.fetchEntries=e.fetchEntries;exports.fetchOneEntry=e.fetchOneEntry;exports.getBuilderSearchParams=e.getBuilderSearchParams;exports.isEditing=e.isEditing;exports.isPreviewing=e.isPreviewing;exports.register=e.register;exports.setEditorSettings=e.setEditorSettings;exports.subscribeToEditor=e.subscribeToEditor;exports.track=e.track;

package/lib/node/index.js

@@ -1,4 +1,4 @@
-import { n as a, k as t, C as r, o, F as i, I as n, S as c, l as g, m, V as l, z as u, r as d, y as p, A as C, D as E, u as S, p as f, q as h, s as B, t as b, x as k, v as x } from "./index-tdTNLVlt.js";
+import { n as a, k as t, C as r, o, F as i, I as n, S as c, l as g, m, V as l, z as u, r as d, y as p, A as C, D as E, u as S, p as f, q as h, s as B, t as b, x as k, v as x } from "./index-wXqz2rFK.js";
 export {
   a as Blocks,
   t as Button,

package/lib/node/{repeated-block-XpohtcNq.js → repeated-block-_XkAOrun.js}

@@ -1,6 +1,6 @@
 import { defineComponent as t, defineAsyncComponent as n, resolveComponent as r, openBlock as c, createBlock as p } from "vue";
-import { j as s, e as l } from "./index-tdTNLVlt.js";
-const i = () => import("./index-tdTNLVlt.js").then((e) => e.G).then((e) => e.default).catch((e) => {
+import { j as s, e as l } from "./index-wXqz2rFK.js";
+const i = () => import("./index-wXqz2rFK.js").then((e) => e.G).then((e) => e.default).catch((e) => {
   throw console.error(
     "Error while attempting to dynamically import component Block at ../block.vue",
     e

package/lib/node/{repeated-block-8a9KznE-.cjs → repeated-block-aXwTR0DC.cjs}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("vue"),t=require("./index-Oh0XoTAq.cjs"),r=()=>Promise.resolve().then(()=>require("./index-Oh0XoTAq.cjs")).then(e=>e.block).then(e=>e.default).catch(e=>{throw console.error("Error while attempting to dynamically import component Block at ../block.vue",e),e}),c=o.defineComponent({name:"repeated-block",components:{Block:o.defineAsyncComponent(r)},props:["repeatContext","block","registeredComponents","linkComponent"],data(){return{store:this.repeatContext}},provide(){const e=this;return{[t.BuilderContext.key]:e.store}}});function s(e,i,p,a,m,d){const n=o.resolveComponent("block");return o.openBlock(),o.createBlock(n,{block:e.block,context:e.store,registeredComponents:e.registeredComponents,linkComponent:e.linkComponent},null,8,["block","context","registeredComponents","linkComponent"])}const l=t._export_sfc(c,[["render",s]]);exports.default=l;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("vue"),t=require("./index-8hg8pWTn.cjs"),r=()=>Promise.resolve().then(()=>require("./index-8hg8pWTn.cjs")).then(e=>e.block).then(e=>e.default).catch(e=>{throw console.error("Error while attempting to dynamically import component Block at ../block.vue",e),e}),c=o.defineComponent({name:"repeated-block",components:{Block:o.defineAsyncComponent(r)},props:["repeatContext","block","registeredComponents","linkComponent"],data(){return{store:this.repeatContext}},provide(){const e=this;return{[t.BuilderContext.key]:e.store}}});function s(e,i,p,a,m,d){const n=o.resolveComponent("block");return o.openBlock(),o.createBlock(n,{block:e.block,context:e.store,registeredComponents:e.registeredComponents,linkComponent:e.linkComponent},null,8,["block","context","registeredComponents","linkComponent"])}const l=t._export_sfc(c,[["render",s]]);exports.default=l;

package/lib/node/style.css

@@ -1 +1 @@
-.component-1o2kztlxdt6[data-v-b8add99a]{display:flex;flex-direction:column;align-items:stretch}.div-2fnk003dqad[data-v-d0d8b675]{display:flex;line-height:normal}.img-1be3j8m9ewb[data-v-c23615d2]{opacity:1;transition:opacity .2s ease-in-out}.div-1be3j8m9ewb[data-v-c23615d2]{width:100%;pointer-events:none;font-size:0}.div-1be3j8m9ewb-2[data-v-c23615d2]{display:flex;flex-direction:column;align-items:stretch;position:absolute;top:0;left:0;width:100%;height:100%}.pre-5vz8uirn7sc[data-v-541b06ed]{padding:10px;color:red;text-align:center}
+.component-1o2kztlxdt6[data-v-b8add99a]{display:flex;flex-direction:column;align-items:stretch}.div-2fnk003dqad[data-v-4eaba73b]{display:flex;line-height:normal}.img-1be3j8m9ewb[data-v-c23615d2]{opacity:1;transition:opacity .2s ease-in-out}.div-1be3j8m9ewb[data-v-c23615d2]{width:100%;pointer-events:none;font-size:0}.div-1be3j8m9ewb-2[data-v-c23615d2]{display:flex;flex-direction:column;align-items:stretch;position:absolute;top:0;left:0;width:100%;height:100%}.pre-5vz8uirn7sc[data-v-541b06ed]{padding:10px;color:red;text-align:center}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@builder.io/sdk-vue",
   "description": "Builder.io SDK for Vue",
-  "version": "1.0.15",
+  "version": "1.0.17",
   "main": "./lib/node/index.cjs",
   "module": "./lib/node/index.js",
   "type": "module",

package/lib/browser/block-styles-JdWTcagf.cjs

@@ -1 +0,0 @@
-var y=require("./style.css");Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("vue"),t=require("./index-Knuxd6qK.cjs"),h=o.defineComponent({name:"block-styles",components:{InlinedStyles:t._sfc_main},props:["block","context"],data(){return{TARGET:t.TARGET}},computed:{canShowBlock(){const e=t.getProcessedBlock({block:this.block,localState:this.context.localState,rootState:this.context.rootState,rootSetState:this.context.rootSetState,context:this.context.context,shouldEvaluateBindings:!0});return t.checkIsDefined(e.hide)?!e.hide:t.checkIsDefined(e.show)?e.show:!0},css(){var d;const e=t.getProcessedBlock({block:this.block,localState:this.context.localState,rootState:this.context.rootState,rootSetState:this.context.rootSetState,context:this.context.context,shouldEvaluateBindings:!0}),s=e.responsiveStyles,n=this.context.content,r=t.getSizesForBreakpoints(((d=n==null?void 0:n.meta)==null?void 0:d.breakpoints)||{}),a=s==null?void 0:s.large,i=s==null?void 0:s.medium,c=s==null?void 0:s.small,l=e.id;if(!l)return"";const u=a?t.createCssClass({className:l,styles:a}):"",S=i?t.createCssClass({className:l,styles:i,mediaQuery:t.getMaxWidthQueryForSize("medium",r)}):"",m=c?t.createCssClass({className:l,styles:c,mediaQuery:t.getMaxWidthQueryForSize("small",r)}):"";return[u,S,m].join(" ")}}});function p(e,s,n,r,a,i){const c=o.resolveComponent("inlined-styles");return e.TARGET!=="reactNative"&&e.css&&e.canShowBlock?(o.openBlock(),o.createBlock(c,{key:0,styles:e.css},null,8,["styles"])):o.createCommentVNode("",!0)}const k=t._export_sfc(h,[["render",p]]);exports.default=k;