@builder.io/sdk-solid 2.0.28 → 2.0.30

package/lib/browser/dev.js

@@ -1521,7 +1521,7 @@ function Block(props) {
   });
 }
 var block_default = Block;
-var _tmpl$2 = /* @__PURE__ */ template(`<style>.dynamic-6567ee94 {
+var _tmpl$2 = /* @__PURE__ */ template(`<style>.dynamic-5b6a86b6 {
   display: flex;
   flex-direction: column;
   align-items: stretch;
@@ -1530,13 +1530,20 @@ function BlocksWrapper(props) {
   const className = createMemo(() => {
     return ["builder-blocks", !props.blocks?.length ? "no-blocks" : "", props.classNameProp].filter(Boolean).join(" ");
   });
+  const dataPath = createMemo(() => {
+    if (!props.path) {
+      return void 0;
+    }
+    const pathPrefix = "component.options.";
+    return props.path.startsWith(pathPrefix) ? props.path : `${pathPrefix}${props.path || ""}`;
+  });
   function onClick() {
     if (isEditing() && !props.blocks?.length) {
       window.parent?.postMessage({
         type: "builder.clickEmptyBlocks",
         data: {
           parentElementId: props.parent,
-          dataPath: props.path
+          dataPath: dataPath()
         }
       }, "*");
     }
@@ -1547,7 +1554,7 @@ function BlocksWrapper(props) {
         type: "builder.hoverEmptyBlocks",
         data: {
           parentElementId: props.parent,
-          dataPath: props.path
+          dataPath: dataPath()
         }
       }, "*");
     }
@@ -1557,14 +1564,14 @@ function BlocksWrapper(props) {
   });
   return [createComponent(Dynamic, mergeProps({
     get ["class"]() {
-      return className() + " dynamic-6567ee94";
+      return className() + " dynamic-5b6a86b6";
     },
     ref(r$) {
       const _ref$ = blocksWrapperRef;
       typeof _ref$ === "function" ? _ref$(r$) : blocksWrapperRef = r$;
     },
     get ["builder-path"]() {
-      return props.path;
+      return dataPath();
     },
     get ["builder-parent-id"]() {
       return props.parent;
@@ -1656,7 +1663,7 @@ var getColumnsClass = (id) => {
 
 // src/blocks/columns/columns.tsx
 var _tmpl$3 = /* @__PURE__ */ template(`<div>`);
-var _tmpl$22 = /* @__PURE__ */ template(`<style>.div-a1dad3b8 {
+var _tmpl$22 = /* @__PURE__ */ template(`<style>.div-2ac94efa {
   display: flex;
   line-height: normal;
 }`);
@@ -1785,7 +1792,7 @@ function Columns(props) {
     const _el$ = _tmpl$3();
     spread(_el$, mergeProps({
       get ["class"]() {
-        return getColumnsClass(props.builderBlock?.id) + " div-a1dad3b8";
+        return getColumnsClass(props.builderBlock?.id) + " div-2ac94efa";
       },
       get style() {
         return columnsCssVars();
@@ -1822,7 +1829,7 @@ function Columns(props) {
           },
           get children() {
             return createComponent(blocks_default, {
-              path: `component.options.columns.${index}.blocks`,
+              path: `columns.${index}.blocks`,
               get parent() {
                 return props.builderBlock.id;
               },
@@ -2516,9 +2523,11 @@ function Accordion(props) {
           effect((_p$) => {
             const _v$ = getAccordionTitleClassName(index), _v$2 = {
               ...accordionTitleStyles(),
-              width: props.grid ? props.gridRowWidth : void 0,
-              ...{
-                order: openGridItemOrder() !== null ? convertOrderNumberToString(index) : convertOrderNumberToString(index + 1)
+              ...props.grid && {
+                width: props.gridRowWidth,
+                ...{
+                  order: openGridItemOrder() !== null ? convertOrderNumberToString(index) : convertOrderNumberToString(index + 1)
+                }
               }
             };
             _v$ !== _p$._v$ && className(_el$2, _p$._v$ = _v$);
@@ -3291,7 +3300,7 @@ function Tabs(props) {
             get parent() {
               return props.builderBlock.id;
             },
-            path: `component.options.tabs.${index}.label`,
+            path: `tabs.${index}.label`,
             get blocks() {
               return tab.label;
             },
@@ -3331,7 +3340,7 @@ function Tabs(props) {
             return props.builderBlock.id;
           },
           get path() {
-            return `component.options.tabs.${activeTab()}.content`;
+            return `tabs.${activeTab()}.content`;
           },
           get blocks() {
             return activeTabContent(activeTab());
@@ -3800,10 +3809,19 @@ var getEnv = () => {
   return validEnvList.includes(env) ? env : "production";
 };
 
+// src/functions/log-fetch.ts
+function logFetch(url) {
+  if (typeof process !== "undefined" && process.env?.DEBUG) {
+    if (String(process.env.DEBUG) == "true") {
+      logger.log(url);
+    }
+  }
+}
+
 // src/blocks/form/form/form.tsx
-var _tmpl$13 = /* @__PURE__ */ template(`<pre class="builder-form-error-text pre-2e825338">`);
+var _tmpl$13 = /* @__PURE__ */ template(`<pre class="builder-form-error-text pre-6210236e">`);
 var _tmpl$26 = /* @__PURE__ */ template(`<form>`);
-var _tmpl$34 = /* @__PURE__ */ template(`<style>.pre-2e825338 {
+var _tmpl$34 = /* @__PURE__ */ template(`<style>.pre-6210236e {
   padding: 10px;
   color: red;
   text-align: center;
@@ -3916,7 +3934,9 @@ function FormComponent(props) {
       }
       setFormState("sending");
       const formUrl = `${getEnv() === "dev" ? "http://localhost:5000" : "https://builder.io"}/api/v1/form-submit?apiKey=${props.builderContext.apiKey}&to=${btoa(props.sendSubmissionsToEmail || "")}&name=${encodeURIComponent(props.name || "")}`;
-      fetch(props.sendSubmissionsTo === "email" ? formUrl : props.action, {
+      const url = props.sendSubmissionsTo === "email" ? formUrl : props.action;
+      logFetch(url);
+      fetch(url, {
         body,
         headers,
         method: props.method || "post"
@@ -4774,7 +4794,7 @@ function getPreviewContent(_searchParams) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "2.0.28";
+var SDK_VERSION = "2.0.30";
 
 // src/helpers/sdk-headers.ts
 var getSdkHeaders = () => ({
@@ -5203,7 +5223,9 @@ async function _track({
     return;
   }
   const baseUrl = apiHost || "https://cdn.builder.io";
-  return fetch(`${baseUrl}/api/v1/track`, {
+  const url = `${baseUrl}/api/v1/track`;
+  logFetch(url);
+  return fetch(url, {
     method: "POST",
     body: JSON.stringify({
       events: [await createEvent(eventProps)]
@@ -5678,6 +5700,7 @@ function EnableEditor(props) {
         rootState: props.builderContextSignal.rootState,
         rootSetState: props.builderContextSignal.rootSetState
       })));
+      logFetch(evaluatedUrl);
       fetch(evaluatedUrl).then((response) => response.json()).then((json) => {
         mergeNewRootState({
           [key]: json

package/lib/browser/dev.jsx

@@ -1363,6 +1363,13 @@ function BlocksWrapper(props) {
       props.classNameProp
     ].filter(Boolean).join(" ");
   });
+  const dataPath = createMemo6(() => {
+    if (!props.path) {
+      return void 0;
+    }
+    const pathPrefix = "component.options.";
+    return props.path.startsWith(pathPrefix) ? props.path : `${pathPrefix}${props.path || ""}`;
+  });
   function onClick() {
     if (isEditing() && !props.blocks?.length) {
       window.parent?.postMessage(
@@ -1370,7 +1377,7 @@ function BlocksWrapper(props) {
           type: "builder.clickEmptyBlocks",
           data: {
             parentElementId: props.parent,
-            dataPath: props.path
+            dataPath: dataPath()
           }
         },
         "*"
@@ -1384,7 +1391,7 @@ function BlocksWrapper(props) {
           type: "builder.hoverEmptyBlocks",
           data: {
             parentElementId: props.parent,
-            dataPath: props.path
+            dataPath: dataPath()
           }
         },
         "*"
@@ -1396,9 +1403,9 @@ function BlocksWrapper(props) {
   });
   return <>
     <Dynamic4
-      class={className() + " dynamic-6567ee94"}
+      class={className() + " dynamic-5b6a86b6"}
       ref={blocksWrapperRef}
-      builder-path={props.path}
+      builder-path={dataPath()}
       builder-parent-id={props.parent}
       {...{}}
       style={props.styleProp}
@@ -1408,7 +1415,7 @@ function BlocksWrapper(props) {
       {...props.BlocksWrapperProps}
       component={props.BlocksWrapper}
     >{props.children}</Dynamic4>
-    <style>{`.dynamic-6567ee94 {
+    <style>{`.dynamic-5b6a86b6 {
   display: flex;
   flex-direction: column;
   align-items: stretch;
@@ -1573,7 +1580,7 @@ function Columns(props) {
   }
   return <>
     <div
-      class={getColumnsClass(props.builderBlock?.id) + " div-a1dad3b8"}
+      class={getColumnsClass(props.builderBlock?.id) + " div-2ac94efa"}
       style={columnsCssVars()}
       {...{}}
     >
@@ -1590,7 +1597,7 @@ function Columns(props) {
           actionAttributes={{}}
           attributes={getAttributes(column, index)}
         ><Blocks_default
-          path={`component.options.columns.${index}.blocks`}
+          path={`columns.${index}.blocks`}
           parent={props.builderBlock.id}
           styleProp={{
             flexGrow: "1"
@@ -1602,7 +1609,7 @@ function Columns(props) {
         /></Dynamic_renderer_default>;
       }}</For4>
     </div>
-    <style>{`.div-a1dad3b8 {
+    <style>{`.div-2ac94efa {
   display: flex;
   line-height: normal;
 }`}</style>
@@ -2233,9 +2240,11 @@ function Accordion(props) {
         class={getAccordionTitleClassName(index)}
         style={{
           ...accordionTitleStyles(),
-          width: props.grid ? props.gridRowWidth : void 0,
-          ...{
-            order: openGridItemOrder() !== null ? convertOrderNumberToString(index) : convertOrderNumberToString(index + 1)
+          ...props.grid && {
+            width: props.gridRowWidth,
+            ...{
+              order: openGridItemOrder() !== null ? convertOrderNumberToString(index) : convertOrderNumberToString(index + 1)
+            }
           }
         }}
         data-index={index}
@@ -2974,7 +2983,7 @@ function Tabs(props) {
         onClick={(event) => onClick(index)}
       ><Blocks_default
         parent={props.builderBlock.id}
-        path={`component.options.tabs.${index}.label`}
+        path={`tabs.${index}.label`}
         blocks={tab.label}
         context={props.builderContext}
         registeredComponents={props.builderComponents}
@@ -2983,7 +2992,7 @@ function Tabs(props) {
     }}</For6></div>
     <Show10 when={activeTabContent(activeTab())}><div><Blocks_default
       parent={props.builderBlock.id}
-      path={`component.options.tabs.${activeTab()}.content`}
+      path={`tabs.${activeTab()}.content`}
       blocks={activeTabContent(activeTab())}
       context={props.builderContext}
       registeredComponents={props.builderComponents}
@@ -3440,6 +3449,15 @@ var getEnv = () => {
   return validEnvList.includes(env) ? env : "production";
 };
 
+// src/functions/log-fetch.ts
+function logFetch(url) {
+  if (typeof process !== "undefined" && process.env?.DEBUG) {
+    if (String(process.env.DEBUG) == "true") {
+      logger.log(url);
+    }
+  }
+}
+
 // src/blocks/form/form/form.tsx
 function FormComponent(props) {
   const [formState, setFormState] = createSignal14("unsubmitted");
@@ -3546,14 +3564,13 @@ function FormComponent(props) {
       const formUrl = `${getEnv() === "dev" ? "http://localhost:5000" : "https://builder.io"}/api/v1/form-submit?apiKey=${props.builderContext.apiKey}&to=${btoa(
         props.sendSubmissionsToEmail || ""
       )}&name=${encodeURIComponent(props.name || "")}`;
-      fetch(
-        props.sendSubmissionsTo === "email" ? formUrl : props.action,
-        {
-          body,
-          headers,
-          method: props.method || "post"
-        }
-      ).then(
+      const url = props.sendSubmissionsTo === "email" ? formUrl : props.action;
+      logFetch(url);
+      fetch(url, {
+        body,
+        headers,
+        method: props.method || "post"
+      }).then(
         async (res) => {
           let body2;
           const contentType = res.headers.get("content-type");
@@ -3660,14 +3677,14 @@ function FormComponent(props) {
         blocks={props.sendingMessage}
         context={props.builderContext}
       /></Show11>
-      <Show11 when={submissionState() === "error" && responseData()}><pre class="builder-form-error-text pre-2e825338">{JSON.stringify(responseData(), null, 2)}</pre></Show11>
+      <Show11 when={submissionState() === "error" && responseData()}><pre class="builder-form-error-text pre-6210236e">{JSON.stringify(responseData(), null, 2)}</pre></Show11>
       <Show11 when={submissionState() === "success"}><Blocks_default
         path="successMessage"
         blocks={props.successMessage}
         context={props.builderContext}
       /></Show11>
     </form>
-    <style>{`.pre-2e825338 {
+    <style>{`.pre-6210236e {
   padding: 10px;
   color: red;
   text-align: center;
@@ -4258,7 +4275,7 @@ function getPreviewContent(_searchParams) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "2.0.28";
+var SDK_VERSION = "2.0.30";
 
 // src/helpers/sdk-headers.ts
 var getSdkHeaders = () => ({
@@ -4687,7 +4704,9 @@ async function _track({
     return;
   }
   const baseUrl = apiHost || "https://cdn.builder.io";
-  return fetch(`${baseUrl}/api/v1/track`, {
+  const url = `${baseUrl}/api/v1/track`;
+  logFetch(url);
+  return fetch(url, {
     method: "POST",
     body: JSON.stringify({
       events: [await createEvent(eventProps)]
@@ -5166,6 +5185,7 @@ function EnableEditor(props) {
           })
         )
       );
+      logFetch(evaluatedUrl);
       fetch(evaluatedUrl).then((response) => response.json()).then((json) => {
         mergeNewRootState({
           [key]: json

package/lib/browser/index.js

@@ -1515,7 +1515,7 @@ function Block(props) {
   });
 }
 var block_default = Block;
-var _tmpl$2 = /* @__PURE__ */ template(`<style>.dynamic-6567ee94 {
+var _tmpl$2 = /* @__PURE__ */ template(`<style>.dynamic-5b6a86b6 {
   display: flex;
   flex-direction: column;
   align-items: stretch;
@@ -1524,13 +1524,20 @@ function BlocksWrapper(props) {
   const className = createMemo(() => {
     return ["builder-blocks", !props.blocks?.length ? "no-blocks" : "", props.classNameProp].filter(Boolean).join(" ");
   });
+  const dataPath = createMemo(() => {
+    if (!props.path) {
+      return void 0;
+    }
+    const pathPrefix = "component.options.";
+    return props.path.startsWith(pathPrefix) ? props.path : `${pathPrefix}${props.path || ""}`;
+  });
   function onClick() {
     if (isEditing() && !props.blocks?.length) {
       window.parent?.postMessage({
         type: "builder.clickEmptyBlocks",
         data: {
           parentElementId: props.parent,
-          dataPath: props.path
+          dataPath: dataPath()
         }
       }, "*");
     }
@@ -1541,7 +1548,7 @@ function BlocksWrapper(props) {
         type: "builder.hoverEmptyBlocks",
         data: {
           parentElementId: props.parent,
-          dataPath: props.path
+          dataPath: dataPath()
         }
       }, "*");
     }
@@ -1551,14 +1558,14 @@ function BlocksWrapper(props) {
   });
   return [createComponent(Dynamic, mergeProps({
     get ["class"]() {
-      return className() + " dynamic-6567ee94";
+      return className() + " dynamic-5b6a86b6";
     },
     ref(r$) {
       const _ref$ = blocksWrapperRef;
       typeof _ref$ === "function" ? _ref$(r$) : blocksWrapperRef = r$;
     },
     get ["builder-path"]() {
-      return props.path;
+      return dataPath();
     },
     get ["builder-parent-id"]() {
       return props.parent;
@@ -1650,7 +1657,7 @@ var getColumnsClass = (id) => {
 
 // src/blocks/columns/columns.tsx
 var _tmpl$3 = /* @__PURE__ */ template(`<div>`);
-var _tmpl$22 = /* @__PURE__ */ template(`<style>.div-a1dad3b8 {
+var _tmpl$22 = /* @__PURE__ */ template(`<style>.div-2ac94efa {
   display: flex;
   line-height: normal;
 }`);
@@ -1779,7 +1786,7 @@ function Columns(props) {
     const _el$ = _tmpl$3();
     spread(_el$, mergeProps({
       get ["class"]() {
-        return getColumnsClass(props.builderBlock?.id) + " div-a1dad3b8";
+        return getColumnsClass(props.builderBlock?.id) + " div-2ac94efa";
       },
       get style() {
         return columnsCssVars();
@@ -1816,7 +1823,7 @@ function Columns(props) {
           },
           get children() {
             return createComponent(blocks_default, {
-              path: `component.options.columns.${index}.blocks`,
+              path: `columns.${index}.blocks`,
               get parent() {
                 return props.builderBlock.id;
               },
@@ -2509,9 +2516,11 @@ function Accordion(props) {
           effect((_p$) => {
             const _v$ = getAccordionTitleClassName(index), _v$2 = {
               ...accordionTitleStyles(),
-              width: props.grid ? props.gridRowWidth : void 0,
-              ...{
-                order: openGridItemOrder() !== null ? convertOrderNumberToString(index) : convertOrderNumberToString(index + 1)
+              ...props.grid && {
+                width: props.gridRowWidth,
+                ...{
+                  order: openGridItemOrder() !== null ? convertOrderNumberToString(index) : convertOrderNumberToString(index + 1)
+                }
               }
             };
             _v$ !== _p$._v$ && className(_el$2, _p$._v$ = _v$);
@@ -3283,7 +3292,7 @@ function Tabs(props) {
             get parent() {
               return props.builderBlock.id;
             },
-            path: `component.options.tabs.${index}.label`,
+            path: `tabs.${index}.label`,
             get blocks() {
               return tab.label;
             },
@@ -3323,7 +3332,7 @@ function Tabs(props) {
             return props.builderBlock.id;
           },
           get path() {
-            return `component.options.tabs.${activeTab()}.content`;
+            return `tabs.${activeTab()}.content`;
           },
           get blocks() {
             return activeTabContent(activeTab());
@@ -3790,10 +3799,19 @@ var getEnv = () => {
   return validEnvList.includes(env) ? env : "production";
 };
 
+// src/functions/log-fetch.ts
+function logFetch(url) {
+  if (typeof process !== "undefined" && process.env?.DEBUG) {
+    if (String(process.env.DEBUG) == "true") {
+      logger.log(url);
+    }
+  }
+}
+
 // src/blocks/form/form/form.tsx
-var _tmpl$13 = /* @__PURE__ */ template(`<pre class="builder-form-error-text pre-2e825338">`);
+var _tmpl$13 = /* @__PURE__ */ template(`<pre class="builder-form-error-text pre-6210236e">`);
 var _tmpl$26 = /* @__PURE__ */ template(`<form>`);
-var _tmpl$34 = /* @__PURE__ */ template(`<style>.pre-2e825338 {
+var _tmpl$34 = /* @__PURE__ */ template(`<style>.pre-6210236e {
   padding: 10px;
   color: red;
   text-align: center;
@@ -3906,7 +3924,9 @@ function FormComponent(props) {
       }
       setFormState("sending");
       const formUrl = `${getEnv() === "dev" ? "http://localhost:5000" : "https://builder.io"}/api/v1/form-submit?apiKey=${props.builderContext.apiKey}&to=${btoa(props.sendSubmissionsToEmail || "")}&name=${encodeURIComponent(props.name || "")}`;
-      fetch(props.sendSubmissionsTo === "email" ? formUrl : props.action, {
+      const url = props.sendSubmissionsTo === "email" ? formUrl : props.action;
+      logFetch(url);
+      fetch(url, {
         body,
         headers,
         method: props.method || "post"
@@ -4764,7 +4784,7 @@ function getPreviewContent(_searchParams) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "2.0.28";
+var SDK_VERSION = "2.0.30";
 
 // src/helpers/sdk-headers.ts
 var getSdkHeaders = () => ({
@@ -5189,7 +5209,9 @@ async function _track({
     return;
   }
   const baseUrl = apiHost || "https://cdn.builder.io";
-  return fetch(`${baseUrl}/api/v1/track`, {
+  const url = `${baseUrl}/api/v1/track`;
+  logFetch(url);
+  return fetch(url, {
     method: "POST",
     body: JSON.stringify({
       events: [await createEvent(eventProps)]
@@ -5662,6 +5684,7 @@ function EnableEditor(props) {
         rootState: props.builderContextSignal.rootState,
         rootSetState: props.builderContextSignal.rootSetState
       })));
+      logFetch(evaluatedUrl);
       fetch(evaluatedUrl).then((response) => response.json()).then((json) => {
         mergeNewRootState({
           [key]: json