@builder.io/sdk-solid 1.0.28 → 1.0.30

package/lib/browser/index.js

@@ -2122,8 +2122,320 @@ var handleABTesting = async ({
 // src/helpers/canTrack.ts
 var getDefaultCanTrack = (canTrack) => checkIsDefined(canTrack) ? canTrack : true;
 
+// src/blocks/accordion/component-info.ts
+var defaultTitle = {
+  "@type": "@builder.io/sdk:Element",
+  layerName: "Accordion item title",
+  responsiveStyles: {
+    large: {
+      marginTop: "10px",
+      position: "relative",
+      display: "flex",
+      alignItems: "stretch",
+      flexDirection: "column",
+      paddingBottom: "10px"
+    }
+  },
+  children: [{
+    "@type": "@builder.io/sdk:Element",
+    responsiveStyles: {
+      large: {
+        textAlign: "left",
+        display: "flex",
+        flexDirection: "column"
+      }
+    },
+    component: {
+      name: "Text",
+      options: {
+        text: "I am an accordion title. Click me!"
+      }
+    }
+  }]
+};
+var defaultDetail = {
+  "@type": "@builder.io/sdk:Element",
+  layerName: "Accordion item detail",
+  responsiveStyles: {
+    large: {
+      position: "relative",
+      display: "flex",
+      alignItems: "stretch",
+      flexDirection: "column",
+      marginTop: "10px",
+      paddingBottom: "10px"
+    }
+  },
+  children: [{
+    "@type": "@builder.io/sdk:Element",
+    responsiveStyles: {
+      large: {
+        paddingTop: "50px",
+        textAlign: "left",
+        display: "flex",
+        flexDirection: "column",
+        paddingBottom: "50px"
+      }
+    },
+    component: {
+      name: "Text",
+      options: {
+        text: "I am an accordion detail, hello!"
+      }
+    }
+  }]
+};
+var componentInfo = {
+  name: "Builder:Accordion",
+  canHaveChildren: true,
+  image: "https://cdn.builder.io/api/v1/image/assets%2FagZ9n5CUKRfbL9t6CaJOyVSK4Es2%2Ffab6c1fd3fe542408cbdec078bca7f35",
+  defaultStyles: {
+    display: "flex",
+    flexDirection: "column",
+    alignItems: "stretch"
+  },
+  inputs: [{
+    name: "items",
+    type: "list",
+    broadcast: true,
+    subFields: [{
+      name: "title",
+      type: "uiBlocks",
+      hideFromUI: true,
+      defaultValue: [defaultTitle]
+    }, {
+      name: "detail",
+      type: "uiBlocks",
+      hideFromUI: true,
+      defaultValue: [defaultDetail]
+    }],
+    defaultValue: [{
+      title: [defaultTitle],
+      detail: [defaultDetail]
+    }, {
+      title: [defaultTitle],
+      detail: [defaultDetail]
+    }],
+    showIf: (options) => !options.get("useChildrenForItems")
+  }, {
+    name: "oneAtATime",
+    helperText: "Only allow opening one at a time (collapse all others when new item openned)",
+    type: "boolean",
+    defaultValue: false
+  }, {
+    name: "grid",
+    helperText: "Display as a grid",
+    type: "boolean",
+    defaultValue: false
+  }, {
+    name: "gridRowWidth",
+    helperText: "Display as a grid",
+    type: "string",
+    showIf: (options) => options.get("grid"),
+    defaultValue: "25%"
+  }, {
+    name: "useChildrenForItems",
+    type: "boolean",
+    helperText: "Use child elements for each slide, instead of the array. Useful for dynamically repeating items",
+    advanced: true,
+    defaultValue: false,
+    onChange: (options) => {
+      if (options.get("useChildrenForItems") === true) {
+        options.set("items", []);
+      }
+    }
+  }]
+};
+
+// src/blocks/accordion/helpers.ts
+var convertOrderNumberToString = (order) => {
+  return order.toString();
+};
+
+// src/blocks/accordion/accordion.tsx
+var _tmpl$6 = /* @__PURE__ */ template(`<div class=builder-accordion>`);
+var _tmpl$23 = /* @__PURE__ */ template(`<div>`);
+function Accordion(props) {
+  const [open, setOpen] = createSignal([]);
+  const onlyOneAtATime = createMemo(() => {
+    return Boolean(props.grid || props.oneAtATime);
+  });
+  const accordionStyles = createMemo(() => {
+    const styles = {
+      display: "flex",
+      alignItems: "stretch",
+      flexDirection: "column",
+      ...props.grid && {
+        flexDirection: "row",
+        alignItems: "flex-start",
+        flexWrap: "wrap"
+      }
+    };
+    return Object.fromEntries(Object.entries(styles).map(([key, value]) => [camelToKebabCase(key), value]));
+  });
+  const accordionTitleStyles = createMemo(() => {
+    const shared = {
+      display: "flex",
+      flexDirection: "column"
+    };
+    const styles = Object.fromEntries(Object.entries({
+      ...shared,
+      alignItems: "stretch",
+      cursor: "pointer"
+    }).map(([key, value]) => [camelToKebabCase(key), value]));
+    return Object.fromEntries(Object.entries(styles).filter(([_, value]) => value !== void 0));
+  });
+  function getAccordionTitleClassName(index) {
+    return `builder-accordion-title builder-accordion-title-${open().includes(index) ? "open" : "closed"}`;
+  }
+  function getAccordionDetailClassName(index) {
+    return `builder-accordion-detail builder-accordion-detail-${open().includes(index) ? "open" : "closed"}`;
+  }
+  const openGridItemOrder = createMemo(() => {
+    let itemOrder = null;
+    const getOpenGridItemPosition = props.grid && open().length;
+    if (getOpenGridItemPosition && document) {
+      const openItemIndex = open()[0];
+      const openItem = document.querySelector(`.builder-accordion-title[data-index="${openItemIndex}"]`);
+      let subjectItem = openItem;
+      itemOrder = openItemIndex;
+      if (subjectItem) {
+        let prevItemRect = subjectItem.getBoundingClientRect();
+        while (subjectItem = subjectItem && subjectItem.nextElementSibling) {
+          if (subjectItem) {
+            if (subjectItem.classList.contains("builder-accordion-detail")) {
+              continue;
+            }
+            const subjectItemRect = subjectItem.getBoundingClientRect();
+            if (subjectItemRect.left > prevItemRect.left) {
+              const index = parseInt(subjectItem.getAttribute("data-index") || "", 10);
+              if (!isNaN(index)) {
+                prevItemRect = subjectItemRect;
+                itemOrder = index;
+              }
+            } else {
+              break;
+            }
+          }
+        }
+      }
+    }
+    if (typeof itemOrder === "number") {
+      itemOrder = itemOrder + 1;
+    }
+    return itemOrder;
+  });
+  const accordionDetailStyles = createMemo(() => {
+    const styles = {
+      ...{
+        order: typeof openGridItemOrder() === "number" ? openGridItemOrder() : void 0
+      },
+      ...props.grid && {
+        width: "100%"
+      }
+    };
+    return Object.fromEntries(Object.entries(styles).filter(([_, value]) => value !== void 0));
+  });
+  function onClick(index) {
+    if (open().includes(index)) {
+      setOpen(onlyOneAtATime() ? [] : open().filter((item) => item !== index));
+    } else {
+      setOpen(onlyOneAtATime() ? [index] : open().concat(index));
+    }
+  }
+  return (() => {
+    const _el$ = _tmpl$6();
+    insert(_el$, createComponent(For, {
+      get each() {
+        return props.items;
+      },
+      children: (item, _index) => {
+        const index = _index();
+        return [(() => {
+          const _el$2 = _tmpl$23();
+          _el$2.$$click = (event) => onClick(index);
+          setAttribute(_el$2, "data-index", index);
+          insert(_el$2, createComponent(blocks_default, {
+            get blocks() {
+              return item.title;
+            },
+            path: `items.${index}.title`,
+            get parent() {
+              return props.builderBlock.id;
+            },
+            get context() {
+              return props.builderContext;
+            },
+            get registeredComponents() {
+              return props.builderComponents;
+            },
+            get linkComponent() {
+              return props.builderLinkComponent;
+            }
+          }));
+          effect((_p$) => {
+            const _v$ = getAccordionTitleClassName(index), _v$2 = {
+              ...accordionTitleStyles(),
+              width: props.grid ? props.gridRowWidth : void 0,
+              ...{
+                order: openGridItemOrder() !== null ? convertOrderNumberToString(index) : convertOrderNumberToString(index + 1)
+              }
+            };
+            _v$ !== _p$._v$ && className(_el$2, _p$._v$ = _v$);
+            _p$._v$2 = style(_el$2, _v$2, _p$._v$2);
+            return _p$;
+          }, {
+            _v$: void 0,
+            _v$2: void 0
+          });
+          return _el$2;
+        })(), createComponent(Show, {
+          get when() {
+            return open().includes(index);
+          },
+          get children() {
+            const _el$3 = _tmpl$23();
+            insert(_el$3, createComponent(blocks_default, {
+              get blocks() {
+                return item.detail;
+              },
+              path: `items.${index}.detail`,
+              get parent() {
+                return props.builderBlock.id;
+              },
+              get context() {
+                return props.builderContext;
+              },
+              get registeredComponents() {
+                return props.builderComponents;
+              },
+              get linkComponent() {
+                return props.builderLinkComponent;
+              }
+            }));
+            effect((_p$) => {
+              const _v$3 = getAccordionDetailClassName(index), _v$4 = accordionDetailStyles();
+              _v$3 !== _p$._v$3 && className(_el$3, _p$._v$3 = _v$3);
+              _p$._v$4 = style(_el$3, _v$4, _p$._v$4);
+              return _p$;
+            }, {
+              _v$3: void 0,
+              _v$4: void 0
+            });
+            return _el$3;
+          }
+        })];
+      }
+    }));
+    effect((_$p) => style(_el$, accordionStyles(), _$p));
+    return _el$;
+  })();
+}
+var accordion_default = Accordion;
+delegateEvents(["click"]);
+
 // src/blocks/button/component-info.ts
-var componentInfo = {
+var componentInfo2 = {
   name: "Core:Button",
   image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F81a15681c3e74df09677dfc57a615b13",
   defaultStyles: {
@@ -2159,7 +2471,7 @@ var componentInfo = {
 };
 
 // src/blocks/columns/component-info.ts
-var componentInfo2 = {
+var componentInfo3 = {
   // TODO: ways to statically preprocess JSON for references, functions, etc
   name: "Columns",
   isRSC: true,
@@ -2379,7 +2691,7 @@ var componentInfo2 = {
 };
 
 // src/blocks/fragment/component-info.ts
-var componentInfo3 = {
+var componentInfo4 = {
   name: "Fragment",
   static: true,
   hidden: true,
@@ -2388,7 +2700,7 @@ var componentInfo3 = {
 };
 
 // src/blocks/image/component-info.ts
-var componentInfo4 = {
+var componentInfo5 = {
   name: "Image",
   static: true,
   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",
@@ -2510,7 +2822,7 @@ var componentInfo4 = {
 };
 
 // src/blocks/section/component-info.ts
-var componentInfo5 = {
+var componentInfo6 = {
   name: "Core:Section",
   static: true,
   image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F682efef23ace49afac61748dd305c70a",
@@ -2552,7 +2864,7 @@ var componentInfo5 = {
 };
 
 // src/blocks/slot/component-info.ts
-var componentInfo6 = {
+var componentInfo7 = {
   name: "Slot",
   isRSC: true,
   description: "Allow child blocks to be inserted into this content when used as a Symbol",
@@ -2566,10 +2878,10 @@ var componentInfo6 = {
     defaultValue: "children"
   }]
 };
-var _tmpl$6 = /* @__PURE__ */ template(`<div>`);
+var _tmpl$7 = /* @__PURE__ */ template(`<div>`);
 function Slot(props) {
   return (() => {
-    const _el$ = _tmpl$6();
+    const _el$ = _tmpl$7();
     _el$.style.setProperty("pointer-events", "auto");
     spread(_el$, mergeProps(() => !props.builderContext.context?.symbolId && {
       "builder-slot": props.name
@@ -2594,7 +2906,7 @@ function Slot(props) {
 var slot_default = Slot;
 
 // src/blocks/symbol/component-info.ts
-var componentInfo7 = {
+var componentInfo8 = {
   name: "Symbol",
   noWrap: true,
   static: true,
@@ -2670,7 +2982,7 @@ var defaultElement = {
     }
   }
 };
-var componentInfo8 = {
+var componentInfo9 = {
   name: "Builder: Tabs",
   inputs: [{
     name: "tabs",
@@ -2768,8 +3080,8 @@ var componentInfo8 = {
     }]
   }]
 };
-var _tmpl$7 = /* @__PURE__ */ template(`<div>`);
-var _tmpl$23 = /* @__PURE__ */ template(`<div><div class=builder-tabs-wrap>`);
+var _tmpl$8 = /* @__PURE__ */ template(`<div>`);
+var _tmpl$24 = /* @__PURE__ */ template(`<div><div class=builder-tabs-wrap>`);
 var _tmpl$33 = /* @__PURE__ */ template(`<span>`);
 function Tabs(props) {
   const [activeTab, setActiveTab] = createSignal(props.defaultActiveTab ? props.defaultActiveTab - 1 : 0);
@@ -2784,7 +3096,7 @@ function Tabs(props) {
     }
   }
   return (() => {
-    const _el$ = _tmpl$23(), _el$2 = _el$.firstChild;
+    const _el$ = _tmpl$24(), _el$2 = _el$.firstChild;
     _el$2.style.setProperty("display", "flex");
     _el$2.style.setProperty("flex-direction", "row");
     _el$2.style.setProperty("overflow", "auto");
@@ -2794,226 +3106,18 @@ function Tabs(props) {
       },
       children: (tab, _index) => {
         const index = _index();
-        return (() => {
-          const _el$4 = _tmpl$33();
-          _el$4.$$click = (event) => onClick(index);
-          setAttribute(_el$4, "key", index);
-          insert(_el$4, createComponent(blocks_default, {
-            get parent() {
-              return props.builderBlock.id;
-            },
-            path: `component.options.tabs.${index}.label`,
-            get blocks() {
-              return tab.label;
-            },
-            get context() {
-              return props.builderContext;
-            },
-            get registeredComponents() {
-              return props.builderComponents;
-            },
-            get linkComponent() {
-              return props.builderLinkComponent;
-            }
-          }));
-          effect((_p$) => {
-            const _v$ = `builder-tab-wrap ${activeTab() === index ? "builder-tab-active" : ""}`, _v$2 = {
-              ...activeTab() === index ? props.activeTabStyle : {}
-            };
-            _v$ !== _p$._v$ && className(_el$4, _p$._v$ = _v$);
-            _p$._v$2 = style(_el$4, _v$2, _p$._v$2);
-            return _p$;
-          }, {
-            _v$: void 0,
-            _v$2: void 0
-          });
-          return _el$4;
-        })();
-      }
-    }));
-    insert(_el$, createComponent(Show, {
-      get when() {
-        return activeTabContent(activeTab());
-      },
-      get children() {
-        const _el$3 = _tmpl$7();
-        insert(_el$3, createComponent(blocks_default, {
-          get parent() {
-            return props.builderBlock.id;
-          },
-          get path() {
-            return `component.options.tabs.${activeTab()}.content`;
-          },
-          get blocks() {
-            return activeTabContent(activeTab());
-          },
-          get context() {
-            return props.builderContext;
-          },
-          get registeredComponents() {
-            return props.builderComponents;
-          },
-          get linkComponent() {
-            return props.builderLinkComponent;
-          }
-        }));
-        return _el$3;
-      }
-    }), null);
-    effect(() => (props.tabHeaderLayout || "flex-start") != null ? _el$2.style.setProperty("justify-content", props.tabHeaderLayout || "flex-start") : _el$2.style.removeProperty("justify-content"));
-    return _el$;
-  })();
-}
-var tabs_default = Tabs;
-delegateEvents(["click"]);
-
-// src/blocks/text/component-info.ts
-var componentInfo9 = {
-  name: "Text",
-  static: true,
-  isRSC: true,
-  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: true,
-    autoFocus: true,
-    bubble: true,
-    defaultValue: "Enter some text..."
-  }],
-  defaultStyles: {
-    lineHeight: "normal",
-    height: "auto",
-    textAlign: "center"
-  }
-};
-var _tmpl$8 = /* @__PURE__ */ template(`<div class=builder-text>`);
-function Text(props) {
-  return (() => {
-    const _el$ = _tmpl$8();
-    _el$.style.setProperty("outline", "none");
-    effect(() => _el$.innerHTML = props.text?.toString() || "");
-    return _el$;
-  })();
-}
-var text_default = Text;
-
-// src/blocks/accordion/helpers.ts
-var convertOrderNumberToString = (order) => {
-  return order.toString();
-};
-
-// src/blocks/accordion/accordion.tsx
-var _tmpl$9 = /* @__PURE__ */ template(`<div class=builder-accordion>`);
-var _tmpl$24 = /* @__PURE__ */ template(`<div>`);
-function Accordion(props) {
-  const [open, setOpen] = createSignal([]);
-  const onlyOneAtATime = createMemo(() => {
-    return Boolean(props.grid || props.oneAtATime);
-  });
-  const accordionStyles = createMemo(() => {
-    const styles = {
-      display: "flex",
-      alignItems: "stretch",
-      flexDirection: "column",
-      ...props.grid && {
-        flexDirection: "row",
-        alignItems: "flex-start",
-        flexWrap: "wrap"
-      }
-    };
-    return Object.fromEntries(Object.entries(styles).map(([key, value]) => [camelToKebabCase(key), value]));
-  });
-  const accordionTitleStyles = createMemo(() => {
-    const shared = {
-      display: "flex",
-      flexDirection: "column"
-    };
-    const styles = Object.fromEntries(Object.entries({
-      ...shared,
-      alignItems: "stretch",
-      cursor: "pointer"
-    }).map(([key, value]) => [camelToKebabCase(key), value]));
-    return Object.fromEntries(Object.entries(styles).filter(([_, value]) => value !== void 0));
-  });
-  function getAccordionTitleClassName(index) {
-    return `builder-accordion-title builder-accordion-title-${open().includes(index) ? "open" : "closed"}`;
-  }
-  function getAccordionDetailClassName(index) {
-    return `builder-accordion-detail builder-accordion-detail-${open().includes(index) ? "open" : "closed"}`;
-  }
-  const openGridItemOrder = createMemo(() => {
-    let itemOrder = null;
-    const getOpenGridItemPosition = props.grid && open().length;
-    if (getOpenGridItemPosition && document) {
-      const openItemIndex = open()[0];
-      const openItem = document.querySelector(`.builder-accordion-title[data-index="${openItemIndex}"]`);
-      let subjectItem = openItem;
-      itemOrder = openItemIndex;
-      if (subjectItem) {
-        let prevItemRect = subjectItem.getBoundingClientRect();
-        while (subjectItem = subjectItem && subjectItem.nextElementSibling) {
-          if (subjectItem) {
-            if (subjectItem.classList.contains("builder-accordion-detail")) {
-              continue;
-            }
-            const subjectItemRect = subjectItem.getBoundingClientRect();
-            if (subjectItemRect.left > prevItemRect.left) {
-              const index = parseInt(subjectItem.getAttribute("data-index") || "", 10);
-              if (!isNaN(index)) {
-                prevItemRect = subjectItemRect;
-                itemOrder = index;
-              }
-            } else {
-              break;
-            }
-          }
-        }
-      }
-    }
-    if (typeof itemOrder === "number") {
-      itemOrder = itemOrder + 1;
-    }
-    return itemOrder;
-  });
-  const accordionDetailStyles = createMemo(() => {
-    const styles = {
-      ...{
-        order: typeof openGridItemOrder() === "number" ? openGridItemOrder() : void 0
-      },
-      ...props.grid && {
-        width: "100%"
-      }
-    };
-    return Object.fromEntries(Object.entries(styles).filter(([_, value]) => value !== void 0));
-  });
-  function onClick(index) {
-    if (open().includes(index)) {
-      setOpen(onlyOneAtATime() ? [] : open().filter((item) => item !== index));
-    } else {
-      setOpen(onlyOneAtATime() ? [index] : open().concat(index));
-    }
-  }
-  return (() => {
-    const _el$ = _tmpl$9();
-    insert(_el$, createComponent(For, {
-      get each() {
-        return props.items;
-      },
-      children: (item, _index) => {
-        const index = _index();
-        return [(() => {
-          const _el$2 = _tmpl$24();
-          _el$2.$$click = (event) => onClick(index);
-          setAttribute(_el$2, "data-index", index);
-          insert(_el$2, createComponent(blocks_default, {
-            get blocks() {
-              return item.title;
-            },
-            path: `items.${index}.title`,
+        return (() => {
+          const _el$4 = _tmpl$33();
+          _el$4.$$click = (event) => onClick(index);
+          setAttribute(_el$4, "key", index);
+          insert(_el$4, createComponent(blocks_default, {
             get parent() {
               return props.builderBlock.id;
             },
+            path: `component.options.tabs.${index}.label`,
+            get blocks() {
+              return tab.label;
+            },
             get context() {
               return props.builderContext;
             },
@@ -3025,190 +3129,86 @@ 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)
-              }
+            const _v$ = `builder-tab-wrap ${activeTab() === index ? "builder-tab-active" : ""}`, _v$2 = {
+              ...activeTab() === index ? props.activeTabStyle : {}
             };
-            _v$ !== _p$._v$ && className(_el$2, _p$._v$ = _v$);
-            _p$._v$2 = style(_el$2, _v$2, _p$._v$2);
+            _v$ !== _p$._v$ && className(_el$4, _p$._v$ = _v$);
+            _p$._v$2 = style(_el$4, _v$2, _p$._v$2);
             return _p$;
           }, {
             _v$: void 0,
             _v$2: void 0
           });
-          return _el$2;
-        })(), createComponent(Show, {
-          get when() {
-            return open().includes(index);
+          return _el$4;
+        })();
+      }
+    }));
+    insert(_el$, createComponent(Show, {
+      get when() {
+        return activeTabContent(activeTab());
+      },
+      get children() {
+        const _el$3 = _tmpl$8();
+        insert(_el$3, createComponent(blocks_default, {
+          get parent() {
+            return props.builderBlock.id;
           },
-          get children() {
-            const _el$3 = _tmpl$24();
-            insert(_el$3, createComponent(blocks_default, {
-              get blocks() {
-                return item.detail;
-              },
-              path: `items.${index}.detail`,
-              get parent() {
-                return props.builderBlock.id;
-              },
-              get context() {
-                return props.builderContext;
-              },
-              get registeredComponents() {
-                return props.builderComponents;
-              },
-              get linkComponent() {
-                return props.builderLinkComponent;
-              }
-            }));
-            effect((_p$) => {
-              const _v$3 = getAccordionDetailClassName(index), _v$4 = accordionDetailStyles();
-              _v$3 !== _p$._v$3 && className(_el$3, _p$._v$3 = _v$3);
-              _p$._v$4 = style(_el$3, _v$4, _p$._v$4);
-              return _p$;
-            }, {
-              _v$3: void 0,
-              _v$4: void 0
-            });
-            return _el$3;
+          get path() {
+            return `component.options.tabs.${activeTab()}.content`;
+          },
+          get blocks() {
+            return activeTabContent(activeTab());
+          },
+          get context() {
+            return props.builderContext;
+          },
+          get registeredComponents() {
+            return props.builderComponents;
+          },
+          get linkComponent() {
+            return props.builderLinkComponent;
           }
-        })];
+        }));
+        return _el$3;
       }
-    }));
-    effect((_$p) => style(_el$, accordionStyles(), _$p));
+    }), null);
+    effect(() => (props.tabHeaderLayout || "flex-start") != null ? _el$2.style.setProperty("justify-content", props.tabHeaderLayout || "flex-start") : _el$2.style.removeProperty("justify-content"));
     return _el$;
   })();
 }
-var accordion_default = Accordion;
+var tabs_default = Tabs;
 delegateEvents(["click"]);
 
-// src/blocks/accordion/component-info.ts
-var defaultTitle = {
-  "@type": "@builder.io/sdk:Element",
-  layerName: "Accordion item title",
-  responsiveStyles: {
-    large: {
-      marginTop: "10px",
-      position: "relative",
-      display: "flex",
-      alignItems: "stretch",
-      flexDirection: "column",
-      paddingBottom: "10px"
-    }
-  },
-  children: [{
-    "@type": "@builder.io/sdk:Element",
-    responsiveStyles: {
-      large: {
-        textAlign: "left",
-        display: "flex",
-        flexDirection: "column"
-      }
-    },
-    component: {
-      name: "Text",
-      options: {
-        text: "I am an accordion title. Click me!"
-      }
-    }
-  }]
-};
-var defaultDetail = {
-  "@type": "@builder.io/sdk:Element",
-  layerName: "Accordion item detail",
-  responsiveStyles: {
-    large: {
-      position: "relative",
-      display: "flex",
-      alignItems: "stretch",
-      flexDirection: "column",
-      marginTop: "10px",
-      paddingBottom: "10px"
-    }
-  },
-  children: [{
-    "@type": "@builder.io/sdk:Element",
-    responsiveStyles: {
-      large: {
-        paddingTop: "50px",
-        textAlign: "left",
-        display: "flex",
-        flexDirection: "column",
-        paddingBottom: "50px"
-      }
-    },
-    component: {
-      name: "Text",
-      options: {
-        text: "I am an accordion detail, hello!"
-      }
-    }
-  }]
-};
+// src/blocks/text/component-info.ts
 var componentInfo10 = {
-  name: "Builder:Accordion",
-  canHaveChildren: true,
-  image: "https://cdn.builder.io/api/v1/image/assets%2FagZ9n5CUKRfbL9t6CaJOyVSK4Es2%2Ffab6c1fd3fe542408cbdec078bca7f35",
-  defaultStyles: {
-    display: "flex",
-    flexDirection: "column",
-    alignItems: "stretch"
-  },
+  name: "Text",
+  static: true,
+  isRSC: true,
+  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: "items",
-    type: "list",
-    broadcast: true,
-    subFields: [{
-      name: "title",
-      type: "uiBlocks",
-      hideFromUI: true,
-      defaultValue: [defaultTitle]
-    }, {
-      name: "detail",
-      type: "uiBlocks",
-      hideFromUI: true,
-      defaultValue: [defaultDetail]
-    }],
-    defaultValue: [{
-      title: [defaultTitle],
-      detail: [defaultDetail]
-    }, {
-      title: [defaultTitle],
-      detail: [defaultDetail]
-    }],
-    showIf: (options) => !options.get("useChildrenForItems")
-  }, {
-    name: "oneAtATime",
-    helperText: "Only allow opening one at a time (collapse all others when new item openned)",
-    type: "boolean",
-    defaultValue: false
-  }, {
-    name: "grid",
-    helperText: "Display as a grid",
-    type: "boolean",
-    defaultValue: false
-  }, {
-    name: "gridRowWidth",
-    helperText: "Display as a grid",
-    type: "string",
-    showIf: (options) => options.get("grid"),
-    defaultValue: "25%"
-  }, {
-    name: "useChildrenForItems",
-    type: "boolean",
-    helperText: "Use child elements for each slide, instead of the array. Useful for dynamically repeating items",
-    advanced: true,
-    defaultValue: false,
-    onChange: (options) => {
-      if (options.get("useChildrenForItems") === true) {
-        options.set("items", []);
-      }
-    }
-  }]
+    name: "text",
+    type: "html",
+    required: true,
+    autoFocus: true,
+    bubble: true,
+    defaultValue: "Enter some text..."
+  }],
+  defaultStyles: {
+    lineHeight: "normal",
+    height: "auto",
+    textAlign: "center"
+  }
 };
+var _tmpl$9 = /* @__PURE__ */ template(`<div class=builder-text>`);
+function Text(props) {
+  return (() => {
+    const _el$ = _tmpl$9();
+    _el$.style.setProperty("outline", "none");
+    effect(() => _el$.innerHTML = props.text?.toString() || "");
+    return _el$;
+  })();
+}
+var text_default = Text;
 
 // src/blocks/custom-code/component-info.ts
 var componentInfo11 = {
@@ -3652,11 +3652,11 @@ function FormComponent(props) {
         return;
       }
       event.preventDefault();
-      const el = event.currentTarget;
+      const el = event.currentTarget || event.target;
       const headers = props.customHeaders || {};
       let body;
       const formData = new FormData(el);
-      const formPairs = Array.from(event.currentTarget.querySelectorAll("input,select,textarea")).filter((el2) => !!el2.name).map((el2) => {
+      const formPairs = Array.from(el.querySelectorAll("input,select,textarea")).filter((el2) => !!el2.name).map((el2) => {
         let value;
         const key = el2.name;
         if (el2 instanceof HTMLInputElement) {
@@ -3826,7 +3826,7 @@ function FormComponent(props) {
       get name() {
         return props.name;
       }
-    }, {}, () => props.attributes), false, true);
+    }, {}, {}, () => props.attributes), false, true);
     insert(_el$, createComponent(Show, {
       get when() {
         return props.builderBlock && props.builderBlock.children;
@@ -4402,34 +4402,34 @@ var getExtraComponents = () => [{
 // src/constants/builder-registered-components.ts
 var getDefaultRegisteredComponents = () => [{
   component: button_default,
-  ...componentInfo
+  ...componentInfo2
 }, {
   component: columns_default,
-  ...componentInfo2
+  ...componentInfo3
 }, {
   component: fragment_default,
-  ...componentInfo3
+  ...componentInfo4
 }, {
   component: image_default,
-  ...componentInfo4
+  ...componentInfo5
 }, {
   component: section_default,
-  ...componentInfo5
+  ...componentInfo6
 }, {
   component: slot_default,
-  ...componentInfo6
+  ...componentInfo7
 }, {
   component: symbol_default,
-  ...componentInfo7
+  ...componentInfo8
 }, {
   component: text_default,
-  ...componentInfo9
+  ...componentInfo10
 }, ...TARGET === "rsc" ? [] : [{
   component: tabs_default,
-  ...componentInfo8
+  ...componentInfo9
 }, {
   component: accordion_default,
-  ...componentInfo10
+  ...componentInfo
 }], ...getExtraComponents()];
 
 // src/functions/register-component.ts
@@ -5008,7 +5008,7 @@ function isFromTrustedHost(trustedHosts, e) {
 }
 
 // src/constants/sdk-version.ts
-var SDK_VERSION = "1.0.28";
+var SDK_VERSION = "1.0.30";
 
 // src/functions/register.ts
 var registry = {};
@@ -5472,7 +5472,7 @@ function EnableEditor(props) {
       if (isPreviewing() && !isEditing()) {
         const searchParams = new URL(location.href).searchParams;
         const searchParamPreviewModel = searchParams.get("builder.preview");
-        const searchParamPreviewId = searchParams.get(`builder.preview.${searchParamPreviewModel}`);
+        const searchParamPreviewId = searchParams.get(`builder.overrides.${searchParamPreviewModel}`);
         const previewApiKey = searchParams.get("apiKey") || searchParams.get("builder.space");
         if (searchParamPreviewModel === props.model && previewApiKey === props.apiKey && (!props.content || searchParamPreviewId === props.content.id)) {
           fetchOneEntry({