@builder.io/sdk-solid 0.5.9 → 0.6.0

package/src/blocks/columns/component-info.js

@@ -1,218 +0,0 @@
-const componentInfo = {
-  name: "Columns",
-  isRSC: true,
-  inputs: [{
-    name: "columns",
-    type: "array",
-    broadcast: true,
-    subFields: [{
-      name: "blocks",
-      type: "array",
-      hideFromUI: true,
-      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: true,
-      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: options => {
-      function clearWidths() {
-        columns.forEach(col => {
-          col.delete("width");
-        });
-      }
-      const columns = options.get("columns");
-      if (Array.isArray(columns)) {
-        const containsColumnWithWidth = !!columns.find(col => col.get("width"));
-        if (containsColumnWithWidth) {
-          const containsColumnWithoutWidth = !!columns.find(col => !col.get("width"));
-          if (containsColumnWithoutWidth) {
-            clearWidths();
-          } else {
-            const sumWidths = columns.reduce((memo, col) => {
-              return memo + col.get("width");
-            }, 0);
-            const widthsDontAddUp = sumWidths !== 100;
-            if (widthsDontAddUp) {
-              clearWidths();
-            }
-          }
-        }
-      }
-    }
-  }, {
-    name: "space",
-    type: "number",
-    defaultValue: 20,
-    helperText: "Size of gap between columns",
-    advanced: true
-  }, {
-    name: "stackColumnsAt",
-    type: "string",
-    defaultValue: "tablet",
-    helperText: "Convert horizontal columns to vertical at what device size",
-    enum: ["tablet", "mobile", "never"],
-    advanced: true
-  }, {
-    name: "reverseColumnsWhenStacked",
-    type: "boolean",
-    defaultValue: false,
-    helperText: "When stacking columns for mobile devices, reverse the ordering",
-    advanced: true
-  }]
-};
-export { componentInfo }

package/src/blocks/custom-code/component-info.js

@@ -1,24 +0,0 @@
-const componentInfo = {
-  name: "Custom Code",
-  static: true,
-  requiredPermissions: ["editCode"],
-  inputs: [{
-    name: "code",
-    type: "html",
-    required: true,
-    defaultValue: "<p>Hello there, I am custom HTML code!</p>",
-    code: true
-  }, {
-    name: "replaceNodes",
-    type: "boolean",
-    helperText: "Preserve server rendered dom nodes",
-    advanced: true
-  }, {
-    name: "scriptsClientOnly",
-    type: "boolean",
-    defaultValue: false,
-    helperText: "Only print and run scripts on the client. Important when scripts influence DOM that could be replaced when client loads",
-    advanced: true
-  }]
-};
-export { componentInfo }

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

@@ -1,62 +0,0 @@
-import { onMount, createSignal } from "solid-js";
-
-function CustomCode(props) {
-  const [scriptsInserted, setScriptsInserted] = createSignal([]);
-
-  const [scriptsRun, setScriptsRun] = createSignal([]);
-
-  function findAndRunScripts() {
-    // TODO: Move this function to standalone one in '@builder.io/utils'
-    if (elem && elem.getElementsByTagName && typeof window !== "undefined") {
-      const scripts = elem.getElementsByTagName("script");
-      for (let i = 0; i < scripts.length; i++) {
-        const script = scripts[i];
-        if (script.src) {
-          if (scriptsInserted().includes(script.src)) {
-            continue;
-          }
-          scriptsInserted().push(script.src);
-          const newScript = document.createElement("script");
-          newScript.async = true;
-          newScript.src = script.src;
-          document.head.appendChild(newScript);
-        } else if (
-          !script.type ||
-          [
-            "text/javascript",
-            "application/javascript",
-            "application/ecmascript",
-          ].includes(script.type)
-        ) {
-          if (scriptsRun().includes(script.innerText)) {
-            continue;
-          }
-          try {
-            scriptsRun().push(script.innerText);
-            new Function(script.innerText)();
-          } catch (error) {
-            console.warn("`CustomCode`: Error running script:", error);
-          }
-        }
-      }
-    }
-  }
-
-  let elem;
-
-  onMount(() => {
-    findAndRunScripts();
-  });
-
-  return (
-    <div
-      class={
-        "builder-custom-code" + (props.replaceNodes ? " replace-nodes" : "")
-      }
-      ref={elem}
-      innerHTML={props.code}
-    ></div>
-  );
-}
-
-export default CustomCode;

package/src/blocks/embed/component-info.js

@@ -1,37 +0,0 @@
-const componentInfo = {
-  name: "Embed",
-  static: true,
-  inputs: [{
-    name: "url",
-    type: "url",
-    required: true,
-    defaultValue: "",
-    helperText: "e.g. enter a youtube url, google map, etc",
-    onChange: options => {
-      const url = options.get("url");
-      if (url) {
-        options.set("content", "Loading...");
-        const apiKey = "ae0e60e78201a3f2b0de4b";
-        return fetch(`https://iframe.ly/api/iframely?url=${url}&api_key=${apiKey}`).then(res => res.json()).then(data => {
-          if (options.get("url") === url) {
-            if (data.html) {
-              options.set("content", data.html);
-            } else {
-              options.set("content", "Invalid url, please try another");
-            }
-          }
-        }).catch(_err => {
-          options.set("content", "There was an error embedding this URL, please try again or another URL");
-        });
-      } else {
-        options.delete("content");
-      }
-    }
-  }, {
-    name: "content",
-    type: "html",
-    defaultValue: '<div style="padding: 20px; text-align: center">(Choose an embed URL)<div>',
-    hideFromUI: true
-  }]
-};
-export { componentInfo }

package/src/blocks/embed/embed.jsx

@@ -1,50 +0,0 @@
-import { on, createEffect, createSignal } from "solid-js";
-
-import { isJsScript } from "./helpers.js";
-
-function Embed(props) {
-  const [scriptsInserted, setScriptsInserted] = createSignal([]);
-
-  const [scriptsRun, setScriptsRun] = createSignal([]);
-
-  const [ranInitFn, setRanInitFn] = createSignal(false);
-
-  function findAndRunScripts() {
-    if (!elem || !elem.getElementsByTagName) return;
-    const scripts = elem.getElementsByTagName("script");
-    for (let i = 0; i < scripts.length; i++) {
-      const script = scripts[i];
-      if (script.src && !scriptsInserted().includes(script.src)) {
-        scriptsInserted().push(script.src);
-        const newScript = document.createElement("script");
-        newScript.async = true;
-        newScript.src = script.src;
-        document.head.appendChild(newScript);
-      } else if (
-        isJsScript(script) &&
-        !scriptsRun().includes(script.innerText)
-      ) {
-        try {
-          scriptsRun().push(script.innerText);
-          new Function(script.innerText)();
-        } catch (error) {
-          console.warn("`Embed`: Error running script:", error);
-        }
-      }
-    }
-  }
-
-  let elem;
-
-  function onUpdateFn_0() {
-    if (elem && !ranInitFn()) {
-      setRanInitFn(true);
-      findAndRunScripts();
-    }
-  }
-  createEffect(on(() => [elem, ranInitFn()], onUpdateFn_0));
-
-  return <div class="builder-embed" ref={elem} innerHTML={props.content}></div>;
-}
-
-export default Embed;

package/src/blocks/embed/helpers.js

@@ -1,3 +0,0 @@
-const SCRIPT_MIME_TYPES = ["text/javascript", "application/javascript", "application/ecmascript"];
-const isJsScript = script => SCRIPT_MIME_TYPES.includes(script.type);
-export { isJsScript }

package/src/blocks/form/component-info.js

@@ -1,223 +0,0 @@
-const componentInfo = {
-  name: "Form:Form",
-  defaults: {
-    responsiveStyles: {
-      large: {
-        marginTop: "15px",
-        paddingBottom: "15px"
-      }
-    }
-  },
-  image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2Fef36d2a846134910b64b88e6d18c5ca5",
-  inputs: [{
-    name: "sendSubmissionsTo",
-    type: "string",
-    enum: [{
-      label: "Send to email",
-      value: "email",
-      helperText: "Send form submissions to the email address of your choosing"
-    }, {
-      label: "Custom",
-      value: "custom",
-      helperText: "Handle where the form requests go manually with a little code, e.g. to your own custom backend"
-    }],
-    defaultValue: "email"
-  }, {
-    name: "sendSubmissionsToEmail",
-    type: "string",
-    required: true,
-    defaultValue: "your@email.com",
-    showIf: 'options.get("sendSubmissionsTo") === "email"'
-  }, {
-    name: "sendWithJs",
-    type: "boolean",
-    helperText: "Set to false to use basic html form action",
-    defaultValue: true,
-    showIf: 'options.get("sendSubmissionsTo") === "custom"'
-  }, {
-    name: "name",
-    type: "string",
-    defaultValue: "My form"
-  }, {
-    name: "action",
-    type: "string",
-    helperText: "URL to send the form data to",
-    showIf: 'options.get("sendSubmissionsTo") === "custom"'
-  }, {
-    name: "contentType",
-    type: "string",
-    defaultValue: "application/json",
-    advanced: true,
-    enum: ["application/json", "multipart/form-data", "application/x-www-form-urlencoded"],
-    showIf: 'options.get("sendSubmissionsTo") === "custom" && options.get("sendWithJs") === true'
-  }, {
-    name: "method",
-    type: "string",
-    showIf: 'options.get("sendSubmissionsTo") === "custom"',
-    defaultValue: "POST",
-    advanced: true
-  }, {
-    name: "previewState",
-    type: "string",
-    enum: ["unsubmitted", "sending", "success", "error"],
-    defaultValue: "unsubmitted",
-    helperText: 'Choose a state to edit, e.g. choose "success" to show what users see on success and edit the message',
-    showIf: 'options.get("sendSubmissionsTo") !== "zapier" && options.get("sendWithJs") === true'
-  }, {
-    name: "successUrl",
-    type: "url",
-    helperText: "Optional URL to redirect the user to on form submission success",
-    showIf: 'options.get("sendSubmissionsTo") !== "zapier" && options.get("sendWithJs") === true'
-  }, {
-    name: "resetFormOnSubmit",
-    type: "boolean",
-    showIf: "options.get('sendSubmissionsTo') === 'custom' && options.get('sendWithJs') === true",
-    advanced: true
-  }, {
-    name: "successMessage",
-    type: "uiBlocks",
-    hideFromUI: true,
-    defaultValue: [{
-      "@type": "@builder.io/sdk:Element",
-      responsiveStyles: {
-        large: {
-          marginTop: "10px"
-        }
-      },
-      component: {
-        name: "Text",
-        options: {
-          text: "<span>Thanks!</span>"
-        }
-      }
-    }]
-  }, {
-    name: "validate",
-    type: "boolean",
-    defaultValue: true,
-    advanced: true
-  }, {
-    name: "errorMessagePath",
-    type: "text",
-    advanced: true,
-    helperText: 'Path to where to get the error message from in a JSON response to display to the user, e.g. "error.message" for a response like { "error": { "message": "this username is taken" }}'
-  }, {
-    name: "errorMessage",
-    type: "uiBlocks",
-    hideFromUI: true,
-    defaultValue: [{
-      "@type": "@builder.io/sdk:Element",
-      responsiveStyles: {
-        large: {
-          marginTop: "10px"
-        }
-      },
-      bindings: {
-        "component.options.text": "state.formErrorMessage || block.component.options.text"
-      },
-      component: {
-        name: "Text",
-        options: {
-          text: "<span>Form submission error :( Please check your answers and try again</span>"
-        }
-      }
-    }]
-  }, {
-    name: "sendingMessage",
-    type: "uiBlocks",
-    hideFromUI: true,
-    defaultValue: [{
-      "@type": "@builder.io/sdk:Element",
-      responsiveStyles: {
-        large: {
-          marginTop: "10px"
-        }
-      },
-      component: {
-        name: "Text",
-        options: {
-          text: "<span>Sending...</span>"
-        }
-      }
-    }]
-  }, {
-    name: "customHeaders",
-    type: "map",
-    valueType: {
-      type: "string"
-    },
-    advanced: true,
-    showIf: 'options.get("sendSubmissionsTo") === "custom" && options.get("sendWithJs") === true'
-  }],
-  noWrap: true,
-  canHaveChildren: true,
-  defaultChildren: [{
-    "@type": "@builder.io/sdk:Element",
-    responsiveStyles: {
-      large: {
-        marginTop: "10px"
-      }
-    },
-    component: {
-      name: "Text",
-      options: {
-        text: "<span>Enter your name</span>"
-      }
-    }
-  }, {
-    "@type": "@builder.io/sdk:Element",
-    responsiveStyles: {
-      large: {
-        marginTop: "10px"
-      }
-    },
-    component: {
-      name: "Form:Input",
-      options: {
-        name: "name",
-        placeholder: "Jane Doe"
-      }
-    }
-  }, {
-    "@type": "@builder.io/sdk:Element",
-    responsiveStyles: {
-      large: {
-        marginTop: "10px"
-      }
-    },
-    component: {
-      name: "Text",
-      options: {
-        text: "<span>Enter your email</span>"
-      }
-    }
-  }, {
-    "@type": "@builder.io/sdk:Element",
-    responsiveStyles: {
-      large: {
-        marginTop: "10px"
-      }
-    },
-    component: {
-      name: "Form:Input",
-      options: {
-        name: "email",
-        placeholder: "jane@doe.com"
-      }
-    }
-  }, {
-    "@type": "@builder.io/sdk:Element",
-    responsiveStyles: {
-      large: {
-        marginTop: "10px"
-      }
-    },
-    component: {
-      name: "Form:SubmitButton",
-      options: {
-        text: "Submit"
-      }
-    }
-  }]
-};
-export { componentInfo }

package/src/blocks/form/form.jsx

@@ -1,5 +0,0 @@
-function FormComponent(props) {
-  return <></>;
-}
-
-export default FormComponent;

package/src/blocks/fragment/component-info.js

@@ -1,8 +0,0 @@
-const componentInfo = {
-  name: "Fragment",
-  static: true,
-  hidden: true,
-  canHaveChildren: true,
-  noWrap: true
-};
-export { componentInfo }

package/src/blocks/fragment/fragment.jsx

@@ -1,5 +0,0 @@
-function FragmentComponent(props) {
-  return <span>{props.children}</span>;
-}
-
-export default FragmentComponent;

package/src/blocks/helpers.js

@@ -1,27 +0,0 @@
-function filterAttrs(attrs = {}, prefix, isEvent) {
-  const result = {};
-  for (const attr in attrs) {
-    if (!attrs[attr]) continue;
-    if (isEvent && !attr.startsWith(prefix)) continue;
-    const eventName = isEvent ? attr.replace(prefix, "") : attr;
-    result[eventName] = attrs[attr];
-  }
-  return result;
-}
-function setAttrs(node, attrs = {}) {
-  const attrKeys = Object.keys(attrs);
-  const setup = attr => node.addEventListener(attr, attrs[attr]);
-  const teardown = attr => node.removeEventListener(attr, attrs[attr]);
-  attrKeys.forEach(setup);
-  return {
-    update(attrs2 = {}) {
-      const attrKeys2 = Object.keys(attrs2);
-      attrKeys2.forEach(teardown);
-      attrKeys2.forEach(setup);
-    },
-    destroy() {
-      attrKeys.forEach(teardown);
-    }
-  };
-}
-export { filterAttrs, setAttrs }