@builder.io/sdk-solid 0.0.8-11 → 0.0.8-12

package/README.md

@@ -1,3 +1,7 @@
 # Builder.io SDK for Solid
 
-More info comign soon
+More info coming soon.
+
+## Mitosis
+
+This SDK is generated by [Mitosis](https://github.com/BuilderIO/mitosis). To see the Mitosis source-code, go [here](../../).

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@builder.io/sdk-solid",
-  "version": "0.0.8-11",
+  "version": "0.0.8-12",
   "description": "",
   "type": "module",
   "main": "./src/solid-index.jsx",

package/src/blocks/columns/columns.jsx

@@ -1,7 +1,7 @@
 import { For } from "solid-js";
 import { createMutable } from "solid-js/store";
 import { css } from "solid-styled-components";
-import RenderBlocks from "../../components/render-blocks";
+import RenderBlocks from "../../components/render-blocks.jsx";
 
 function Columns(props) {
   const state = createMutable({

package/src/blocks/columns/columns.lite.tsx

@@ -3,7 +3,7 @@ import { For } from "solid-js";
 import { createMutable } from "solid-js/store";
 import { css } from "solid-styled-components";
 
-import RenderBlocks from "../../components/render-blocks.lite";
+import RenderBlocks from "../../components/render-blocks.jsx";
 
 function Columns(props) {
   const state = createMutable({
@@ -24,7 +24,7 @@ function Columns(props) {
         (gutterSize * (columns.length - 1)) / columns.length;
       return `calc(${this.getWidth(index)}% - ${subtractWidth}px)`;
     },
-    maybeApplyForTablet(prop: CSSProperties["flexDirection"]) {
+    maybeApplyForTablet(prop: JSX.CSSProperties["flexDirection"]) {
       const _stackColumnsAt = props.stackColumnsAt || "tablet";
 
       return _stackColumnsAt === "tablet" ? prop : "inherit";

package/src/blocks/custom-code/custom-code.jsx

@@ -1,4 +1,4 @@
-import { onMount } from "solid-js";
+import { onMount, useRef } from "solid-js";
 import { createMutable } from "solid-js/store";
 
 function CustomCode(props) {
@@ -9,7 +9,6 @@ function CustomCode(props) {
     findAndRunScripts() {
       // TODO: Move this function to standalone one in '@builder.io/utils'
       if (elem && typeof window !== "undefined") {
-        /** @type {HTMLScriptElement[]} */
         const scripts = elem.getElementsByTagName("script");
 
         for (let i = 0; i < scripts.length; i++) {

package/src/blocks/custom-code/custom-code.lite.tsx

@@ -1,4 +1,4 @@
-import { onMount } from "solid-js";
+import { onMount, useRef } from "solid-js";
 
 import { createMutable } from "solid-js/store";
 
@@ -9,7 +9,6 @@ function CustomCode(props) {
     findAndRunScripts() {
       // TODO: Move this function to standalone one in '@builder.io/utils'
       if (elem && typeof window !== "undefined") {
-        /** @type {HTMLScriptElement[]} */
         const scripts = elem.getElementsByTagName("script");
 
         for (let i = 0; i < scripts.length; i++) {

package/src/blocks/embed/embed.jsx

@@ -1,4 +1,4 @@
-import { onMount } from "solid-js";
+import { onMount, useRef } from "solid-js";
 import { createMutable } from "solid-js/store";
 
 function Embed(props) {
@@ -9,7 +9,6 @@ function Embed(props) {
     findAndRunScripts() {
       // TODO: Move this function to standalone one in '@builder.io/utils'
       if (elem && typeof window !== "undefined") {
-        /** @type {HTMLScriptElement[]} */
         const scripts = elem.getElementsByTagName("script");
 
         for (let i = 0; i < scripts.length; i++) {

package/src/blocks/embed/embed.lite.tsx

@@ -1,4 +1,4 @@
-import { onMount } from "solid-js";
+import { onMount, useRef } from "solid-js";
 
 import { createMutable } from "solid-js/store";
 
@@ -9,7 +9,6 @@ function Embed(props) {
     findAndRunScripts() {
       // TODO: Move this function to standalone one in '@builder.io/utils'
       if (elem && typeof window !== "undefined") {
-        /** @type {HTMLScriptElement[]} */
         const scripts = elem.getElementsByTagName("script");
 
         for (let i = 0; i < scripts.length; i++) {

package/src/blocks/form/form.jsx

@@ -1,7 +1,7 @@
-import { Show, For } from "solid-js";
+import { Show, For, useRef } from "solid-js";
 import { createMutable } from "solid-js/store";
 import { css } from "solid-styled-components";
-import RenderBlock from "../../components/render-block/render-block";
+import RenderBlock from "../../components/render-block/render-block.jsx";
 import { isEditing } from "../../functions/is-editing.js";
 
 function FormComponent(props) {

package/src/blocks/form/form.lite.tsx

@@ -1,9 +1,9 @@
-import { Show, For } from "solid-js";
+import { Show, For, useRef } from "solid-js";
 
 import { createMutable } from "solid-js/store";
 import { css } from "solid-styled-components";
 
-import RenderBlock from "../../components/render-block/render-block.lite";
+import RenderBlock from "../../components/render-block/render-block.jsx";
 import { isEditing } from "../../functions/is-editing.js";
 
 function FormComponent(props) {

package/src/blocks/image/image.jsx

@@ -17,8 +17,8 @@ function Image(props) {
       })} loading="lazy" alt={props.altText} role={props.altText ? "presentation" : undefined} style={{
         "object-position": props.backgroundSize || "center",
         "object-fit": props.backgroundSize || "cover"
-      }} src={props.image} srcSet={props.srcset} sizes={props.sizes} />
-        <source srcSet={props.srcset} />
+      }} src={props.image} srcset={props.srcset} sizes={props.sizes} />
+        <source srcset={props.srcset} />
       </picture>
       <Show when={props.aspectRatio && !(props.fitContent && props.builderBlock?.children?.length)}>
         <div class={"builder-image-sizer " + css({

package/src/blocks/image/image.lite.tsx

@@ -33,10 +33,10 @@ function Image(props) {
             "object-fit": props.backgroundSize || "cover",
           }}
           src={props.image}
-          srcSet={props.srcset}
+          srcset={props.srcset}
           sizes={props.sizes}
         />
-        <source srcSet={props.srcset} />
+        <source srcset={props.srcset} />
       </picture>
       <Show
         when={

package/src/blocks/symbol/symbol.jsx

@@ -1,6 +1,6 @@
 import { useContext, onMount } from "solid-js";
 import { createMutable } from "solid-js/store";
-import RenderContent from "../../components/render-content/render-content";
+import RenderContent from "../../components/render-content/render-content.jsx";
 import BuilderContext from "../../context/builder.context";
 
 function Symbol(props) {

package/src/blocks/symbol/symbol.lite.tsx

@@ -2,7 +2,7 @@ import { useContext, onMount } from "solid-js";
 
 import { createMutable } from "solid-js/store";
 
-import RenderContent from "../../components/render-content/render-content.lite";
+import RenderContent from "../../components/render-content/render-content.jsx";
 import BuilderContext from "../../context/builder.context";
 import { getContent } from "../../functions/get-content/index.js";
 

package/src/components/render-block/block-styles.jsx

@@ -3,7 +3,7 @@ import { createMutable } from "solid-js/store";
 import { TARGET } from "../../constants/target.js";
 import BuilderContext from "../../context/builder.context";
 import { getProcessedBlock } from "../../functions/get-processed-block.js";
-import RenderInlinedStyles from "../render-inlined-styles";
+import RenderInlinedStyles from "../render-inlined-styles.jsx";
 
 function BlockStyles(props) {
   const state = createMutable({

package/src/components/render-block/block-styles.lite.tsx

@@ -5,7 +5,7 @@ import { createMutable } from "solid-js/store";
 import { TARGET } from "../../constants/target.js";
 import BuilderContext from "../../context/builder.context";
 import { getProcessedBlock } from "../../functions/get-processed-block.js";
-import RenderInlinedStyles from "../render-inlined-styles.lite";
+import RenderInlinedStyles from "../render-inlined-styles.jsx";
 
 function BlockStyles(props) {
   const state = createMutable({

package/src/components/render-block/render-block.jsx

@@ -8,9 +8,9 @@ import { getBlockProperties } from "../../functions/get-block-properties.js";
 import { getBlockStyles } from "../../functions/get-block-styles.js";
 import { getBlockTag } from "../../functions/get-block-tag.js";
 import { getProcessedBlock } from "../../functions/get-processed-block.js";
-import BlockStyles from "./block-styles";
+import BlockStyles from "./block-styles.jsx";
 import { isEmptyHtmlElement } from "./render-block.helpers.js";
-import RenderComponent from "./render-component";
+import RenderComponent from "./render-component.jsx";
 
 function RenderBlock(props) {
   const state = createMutable({

package/src/components/render-block/render-block.lite.tsx

@@ -9,9 +9,9 @@ import { getBlockProperties } from "../../functions/get-block-properties.js";
 import { getBlockStyles } from "../../functions/get-block-styles.js";
 import { getBlockTag } from "../../functions/get-block-tag.js";
 import { getProcessedBlock } from "../../functions/get-processed-block.js";
-import BlockStyles from "./block-styles.lite";
+import BlockStyles from "./block-styles.jsx";
 import { isEmptyHtmlElement } from "./render-block.helpers.js";
-import RenderComponent from "./render-component.lite";
+import RenderComponent from "./render-component.jsx";
 
 function RenderBlock(props) {
   const state = createMutable({

package/src/components/render-block/render-component.jsx

@@ -1,7 +1,7 @@
 import { Show, For } from "solid-js";
 import { Dynamic } from "solid-js/web";
-import BlockStyles from "./block-styles";
-import RenderBlock from "./render-block";
+import BlockStyles from "./block-styles.jsx";
+import RenderBlock from "./render-block.jsx";
 
 function RenderComponent(props) {
   return <Show when={props.componentRef}>

package/src/components/render-block/render-component.lite.tsx

@@ -1,8 +1,8 @@
 import { Show, For } from "solid-js";
 import { Dynamic } from "solid-js/web";
 
-import BlockStyles from "./block-styles.lite";
-import RenderBlock from "./render-block.lite";
+import BlockStyles from "./block-styles.jsx";
+import RenderBlock from "./render-block.jsx";
 
 function RenderComponent(props) {
   return (

package/src/components/render-blocks.jsx

@@ -2,8 +2,8 @@ import { Show, For } from "solid-js";
 import { createMutable } from "solid-js/store";
 import { css } from "solid-styled-components";
 import { isEditing } from "../functions/is-editing.js";
-import BlockStyles from "./render-block/block-styles";
-import RenderBlock from "./render-block/render-block";
+import BlockStyles from "./render-block/block-styles.jsx";
+import RenderBlock from "./render-block/render-block.jsx";
 
 function RenderBlocks(props) {
   const state = createMutable({

package/src/components/render-blocks.lite.tsx

@@ -4,8 +4,8 @@ import { createMutable } from "solid-js/store";
 import { css } from "solid-styled-components";
 
 import { isEditing } from "../functions/is-editing.js";
-import BlockStyles from "./render-block/block-styles.lite";
-import RenderBlock from "./render-block/render-block.lite";
+import BlockStyles from "./render-block/block-styles.jsx";
+import RenderBlock from "./render-block/render-block.jsx";
 
 function RenderBlocks(props) {
   const state = createMutable({

package/src/components/render-content/components/render-styles.jsx

@@ -1,5 +1,5 @@
 import { createMutable } from "solid-js/store";
-import RenderInlinedStyles from "../../render-inlined-styles";
+import RenderInlinedStyles from "../../render-inlined-styles.jsx";
 
 function RenderContentStyles(props) {
   const state = createMutable({

package/src/components/render-content/components/render-styles.lite.tsx

@@ -1,6 +1,6 @@
 import { createMutable } from "solid-js/store";
 
-import RenderInlinedStyles from "../../render-inlined-styles.lite";
+import RenderInlinedStyles from "../../render-inlined-styles.jsx";
 
 function RenderContentStyles(props) {
   const state = createMutable({

package/src/components/render-content/render-content.jsx

@@ -14,8 +14,8 @@ import { isPreviewing } from "../../functions/is-previewing.js";
 import { previewingModelName } from "../../functions/previewing-model-name.js";
 import { components, createRegisterComponentMessage } from "../../functions/register-component.js";
 import { track } from "../../functions/track.js";
-import RenderBlocks from "../render-blocks";
-import RenderContentStyles from "./components/render-styles";
+import RenderBlocks from "../render-blocks.jsx";
+import RenderContentStyles from "./components/render-styles.jsx";
 
 function RenderContent(props) {
   const state = createMutable({

package/src/components/render-content/render-content.lite.tsx

@@ -21,8 +21,8 @@ import {
   createRegisterComponentMessage,
 } from "../../functions/register-component.js";
 import { track } from "../../functions/track.js";
-import RenderBlocks from "../render-blocks.lite";
-import RenderContentStyles from "./components/render-styles.lite";
+import RenderBlocks from "../render-blocks.jsx";
+import RenderContentStyles from "./components/render-styles.jsx";
 
 function RenderContent(props) {
   const state = createMutable({

package/src/index-helpers/blocks-exports.js

@@ -7,11 +7,13 @@ import { default as default7 } from "../blocks/button/button.jsx";
 import { default as default8 } from "../blocks/section/section.jsx";
 import { default as default9 } from "../blocks/fragment/fragment.jsx";
 import { default as default10 } from "../components/render-content/render-content.jsx";
+import { default as default11 } from "../components/render-blocks.jsx";
 export {
   default7 as Button,
   default2 as Columns,
   default9 as Fragment,
   default3 as Image,
+  default11 as RenderBlocks,
   default10 as RenderContent,
   default8 as Section,
   default6 as Symbol,