@builder.io/sdk-solid 0.5.8 → 0.6.0

package/src/blocks/symbol/symbol.helpers.js

@@ -1,60 +0,0 @@
-var __defProp = Object.defineProperty;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, {
-  enumerable: true,
-  configurable: true,
-  writable: true,
-  value
-}) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {})) if (__hasOwnProp.call(b, prop)) __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols) for (var prop of __getOwnPropSymbols(b)) {
-    if (__propIsEnum.call(b, prop)) __defNormalProp(a, prop, b[prop]);
-  }
-  return a;
-};
-var __async = (__this, __arguments, generator) => {
-  return new Promise((resolve, reject) => {
-    var fulfilled = value => {
-      try {
-        step(generator.next(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var rejected = value => {
-      try {
-        step(generator.throw(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var step = x => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
-    step((generator = generator.apply(__this, __arguments)).next());
-  });
-};
-import { logger } from "../../helpers/logger.js";
-import { fetchOneEntry } from "../../index.js";
-const fetchSymbolContent = _0 => __async(void 0, [_0], function* ({
-  builderContextValue,
-  symbol
-}) {
-  if ((symbol == null ? void 0 : symbol.model) && (builderContextValue == null ? void 0 : builderContextValue.apiKey)) {
-    return fetchOneEntry(__spreadValues({
-      model: symbol.model,
-      apiKey: builderContextValue.apiKey,
-      apiVersion: builderContextValue.apiVersion
-    }, (symbol == null ? void 0 : symbol.entry) && {
-      query: {
-        id: symbol.entry
-      }
-    })).catch(err => {
-      logger.error("Could not fetch symbol content: ", err);
-      return void 0;
-    });
-  }
-  return void 0;
-});
-export { fetchSymbolContent }

package/src/blocks/symbol/symbol.jsx

@@ -1,64 +0,0 @@
-import { onMount, on, createEffect, createSignal } from "solid-js";
-
-import ContentVariants from "../../components/content-variants/content-variants";
-import { filterAttrs } from "../helpers.js";
-import { fetchSymbolContent } from "./symbol.helpers.js";
-
-function Symbol(props) {
-  const [contentToUse, setContentToUse] = createSignal(props.symbol?.content);
-
-  function className() {
-    return [
-      ...[props.attributes.class],
-      "builder-symbol",
-      props.symbol?.inline ? "builder-inline-symbol" : undefined,
-      props.symbol?.dynamic || props.dynamic
-        ? "builder-dynamic-symbol"
-        : undefined,
-    ]
-      .filter(Boolean)
-      .join(" ");
-  }
-
-  function setContent() {
-    if (contentToUse()) return;
-    fetchSymbolContent({
-      symbol: props.symbol,
-      builderContextValue: props.builderContext,
-    }).then((newContent) => {
-      if (newContent) {
-        setContentToUse(newContent);
-      }
-    });
-  }
-
-  onMount(() => {
-    setContent();
-  });
-
-  function onUpdateFn_0() {
-    setContent();
-  }
-  createEffect(on(() => [props.symbol], onUpdateFn_0));
-
-  return (
-    <div class={className()} {...{}} {...props.attributes} {...{}}>
-      <ContentVariants
-        __isNestedRender={true}
-        apiVersion={props.builderContext.apiVersion}
-        apiKey={props.builderContext.apiKey}
-        context={props.builderContext.context}
-        customComponents={Object.values(props.builderComponents)}
-        data={{
-          ...props.symbol?.data,
-          ...props.builderContext.localState,
-          ...contentToUse()?.data?.state,
-        }}
-        model={props.symbol?.model}
-        content={contentToUse()}
-      ></ContentVariants>
-    </div>
-  );
-}
-
-export default Symbol;

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

@@ -1,20 +0,0 @@
-const componentInfo = {
-  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"
-  }
-};
-export { componentInfo }

package/src/blocks/text/text.jsx

@@ -1,14 +0,0 @@
-function Text(props) {
-  return (
-    <span
-      class="builder-text"
-      innerHTML={props.text?.toString() || ""}
-      style={{
-        outline: "none",
-      }}
-      {...{}}
-    ></span>
-  );
-}
-
-export default Text;

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

@@ -1,38 +0,0 @@
-const componentInfo = {
-  name: "Form:TextArea",
-  image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2Ff74a2f3de58c4c3e939204e5b6b8f6c3",
-  inputs: [{
-    advanced: true,
-    name: "value",
-    type: "string"
-  }, {
-    name: "name",
-    type: "string",
-    required: true,
-    helperText: 'Every input in a form needs a unique name describing what it gets, e.g. "email"'
-  }, {
-    name: "defaultValue",
-    type: "string"
-  }, {
-    name: "placeholder",
-    type: "string",
-    defaultValue: "Hello there"
-  }, {
-    name: "required",
-    type: "boolean",
-    defaultValue: false
-  }],
-  defaultStyles: {
-    paddingTop: "10px",
-    paddingBottom: "10px",
-    paddingLeft: "10px",
-    paddingRight: "10px",
-    borderRadius: "3px",
-    borderWidth: "1px",
-    borderStyle: "solid",
-    borderColor: "#ccc"
-  },
-  static: true,
-  noWrap: true
-};
-export { componentInfo }

package/src/blocks/textarea/textarea.jsx

@@ -1,16 +0,0 @@
-import { filterAttrs } from "../helpers.js";
-
-function Textarea(props) {
-  return (
-    <textarea
-      {...{}}
-      {...props.attributes}
-      placeholder={props.placeholder}
-      name={props.name}
-      value={props.value}
-      defaultValue={props.defaultValue}
-    ></textarea>
-  );
-}
-
-export default Textarea;

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

@@ -1,83 +0,0 @@
-const componentInfo = {
-  name: "Video",
-  canHaveChildren: true,
-  defaultStyles: {
-    minHeight: "20px",
-    minWidth: "20px"
-  },
-  image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-videocam-24px%20(1).svg?alt=media&token=49a84e4a-b20e-4977-a650-047f986874bb",
-  inputs: [{
-    name: "video",
-    type: "file",
-    allowedFileTypes: ["mp4"],
-    bubble: true,
-    defaultValue: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/assets%2FKQlEmWDxA0coC3PK6UvkrjwkIGI2%2F28cb070609f546cdbe5efa20e931aa4b?alt=media&token=912e9551-7a7c-4dfb-86b6-3da1537d1a7f",
-    required: true
-  }, {
-    name: "posterImage",
-    type: "file",
-    allowedFileTypes: ["jpeg", "png"],
-    helperText: "Image to show before the video plays"
-  }, {
-    name: "autoPlay",
-    type: "boolean",
-    defaultValue: true
-  }, {
-    name: "controls",
-    type: "boolean",
-    defaultValue: false
-  }, {
-    name: "muted",
-    type: "boolean",
-    defaultValue: true
-  }, {
-    name: "loop",
-    type: "boolean",
-    defaultValue: true
-  }, {
-    name: "playsInline",
-    type: "boolean",
-    defaultValue: true
-  }, {
-    name: "fit",
-    type: "text",
-    defaultValue: "cover",
-    enum: ["contain", "cover", "fill", "auto"]
-  }, {
-    name: "preload",
-    type: "text",
-    defaultValue: "metadata",
-    enum: ["auto", "metadata", "none"]
-  }, {
-    name: "fitContent",
-    type: "boolean",
-    helperText: "When child blocks are provided, fit to them instead of using the aspect ratio",
-    defaultValue: true,
-    advanced: true
-  }, {
-    name: "position",
-    type: "text",
-    defaultValue: "center",
-    enum: ["center", "top", "left", "right", "bottom", "top left", "top right", "bottom left", "bottom right"]
-  }, {
-    name: "height",
-    type: "number",
-    advanced: true
-  }, {
-    name: "width",
-    type: "number",
-    advanced: true
-  }, {
-    name: "aspectRatio",
-    type: "number",
-    advanced: true,
-    defaultValue: 0.7004048582995948
-  }, {
-    name: "lazyLoad",
-    type: "boolean",
-    helperText: 'Load this video "lazily" - as in only when a user scrolls near the video. Recommended for optmized performance and bandwidth consumption',
-    defaultValue: true,
-    advanced: true
-  }]
-};
-export { componentInfo }

package/src/blocks/video/video.jsx

@@ -1,61 +0,0 @@
-import { createSignal } from "solid-js";
-
-function Video(props) {
-  function videoProps() {
-    return {
-      ...(props.autoPlay === true
-        ? {
-            autoPlay: true,
-          }
-        : {}),
-      ...(props.muted === true
-        ? {
-            muted: true,
-          }
-        : {}),
-      ...(props.controls === true
-        ? {
-            controls: true,
-          }
-        : {}),
-      ...(props.loop === true
-        ? {
-            loop: true,
-          }
-        : {}),
-      ...(props.playsInline === true
-        ? {
-            playsInline: true,
-          }
-        : {}),
-    };
-  }
-
-  function spreadProps() {
-    return {
-      ...props.attributes,
-      ...videoProps(),
-    };
-  }
-
-  return (
-    <video
-      {...spreadProps()}
-      preload={props.preload || "metadata"}
-      style={{
-        width: "100%",
-        height: "100%",
-        ...props.attributes?.style,
-        "object-fit": props.fit,
-        "object-position": props.position,
-        // Hack to get object fit to work as expected and
-        // not have the video overflow
-        "border-radius": 1,
-      }}
-      src={props.video || "no-src"}
-      poster={props.posterImage}
-    ></video>
-  );
-}
-
-export default Video;

package/src/components/block/block.helpers.js

@@ -1,99 +0,0 @@
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, {
-  enumerable: true,
-  configurable: true,
-  writable: true,
-  value
-}) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {})) if (__hasOwnProp.call(b, prop)) __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols) for (var prop of __getOwnPropSymbols(b)) {
-    if (__propIsEnum.call(b, prop)) __defNormalProp(a, prop, b[prop]);
-  }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source) if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0) target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols) for (var prop of __getOwnPropSymbols(source)) {
-    if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop)) target[prop] = source[prop];
-  }
-  return target;
-};
-import { evaluate } from "../../functions/evaluate/index.js";
-import { getProcessedBlock } from "../../functions/get-processed-block.js";
-const EMPTY_HTML_ELEMENTS = ["area", "base", "br", "col", "embed", "hr", "img", "input", "keygen", "link", "meta", "param", "source", "track", "wbr"];
-const isEmptyHtmlElement = tagName => {
-  return typeof tagName === "string" && EMPTY_HTML_ELEMENTS.includes(tagName.toLowerCase());
-};
-const getComponent = ({
-  block,
-  context,
-  registeredComponents
-}) => {
-  var _a;
-  const componentName = (_a = getProcessedBlock({
-    block,
-    localState: context.localState,
-    rootState: context.rootState,
-    rootSetState: context.rootSetState,
-    context: context.context,
-    shouldEvaluateBindings: false
-  }).component) == null ? void 0 : _a.name;
-  if (!componentName) {
-    return null;
-  }
-  const ref = registeredComponents[componentName];
-  if (!ref) {
-    console.warn(`
-      Could not find a registered component named "${componentName}". 
-      If you registered it, is the file that registered it imported by the file that needs to render it?`);
-    return void 0;
-  } else {
-    return ref;
-  }
-};
-const getRepeatItemData = ({
-  block,
-  context
-}) => {
-  const _a = block,
-    {
-      repeat
-    } = _a,
-    blockWithoutRepeat = __objRest(_a, ["repeat"]);
-  if (!(repeat == null ? void 0 : repeat.collection)) {
-    return void 0;
-  }
-  const itemsArray = evaluate({
-    code: repeat.collection,
-    localState: context.localState,
-    rootState: context.rootState,
-    rootSetState: context.rootSetState,
-    context: context.context
-  });
-  if (!Array.isArray(itemsArray)) {
-    return void 0;
-  }
-  const collectionName = repeat.collection.split(".").pop();
-  const itemNameToUse = repeat.itemName || (collectionName ? collectionName + "Item" : "item");
-  const repeatArray = itemsArray.map((item, index) => ({
-    context: __spreadProps(__spreadValues({}, context), {
-      localState: __spreadProps(__spreadValues({}, context.localState), {
-        $index: index,
-        $item: item,
-        [itemNameToUse]: item,
-        [`$${itemNameToUse}Index`]: index
-      })
-    }),
-    block: blockWithoutRepeat
-  }));
-  return repeatArray;
-};
-export { getComponent, getRepeatItemData, isEmptyHtmlElement }

package/src/components/block/block.jsx

@@ -1,167 +0,0 @@
-import { Show, For, createSignal } from "solid-js";
-
-import { getBlockComponentOptions } from "../../functions/get-block-component-options.js";
-import { getBlockProperties } from "../../functions/get-block-properties.js";
-import { getProcessedBlock } from "../../functions/get-processed-block.js";
-import BlockStyles from "./components/block-styles";
-import {
-  getComponent,
-  getRepeatItemData,
-  isEmptyHtmlElement,
-} from "./block.helpers.js";
-import RepeatedBlock from "./components/repeated-block";
-import { extractTextStyles } from "../../functions/extract-text-styles.js";
-import ComponentRef from "./components/component-ref/component-ref";
-import BlockWrapper from "./components/block-wrapper";
-
-function Block(props) {
-  const [childrenContext, setChildrenContext] = createSignal(props.context);
-
-  function blockComponent() {
-    return getComponent({
-      block: props.block,
-      context: props.context,
-      registeredComponents: props.registeredComponents,
-    });
-  }
-
-  function repeatItem() {
-    return getRepeatItemData({
-      block: props.block,
-      context: props.context,
-    });
-  }
-
-  function processedBlock() {
-    return repeatItem()
-      ? props.block
-      : getProcessedBlock({
-          block: props.block,
-          localState: props.context.localState,
-          rootState: props.context.rootState,
-          rootSetState: props.context.rootSetState,
-          context: props.context.context,
-          shouldEvaluateBindings: true,
-        });
-  }
-
-  function Tag() {
-    return props.block.tagName || "div";
-  }
-
-  function canShowBlock() {
-    if ("hide" in processedBlock()) {
-      return !processedBlock().hide;
-    }
-    if ("show" in processedBlock()) {
-      return processedBlock().show;
-    }
-    return true;
-  }
-
-  function childrenWithoutParentComponent() {
-    /**
-     * When there is no `componentRef`, there might still be children that need to be rendered. In this case,
-     * we render them outside of `componentRef`.
-     * NOTE: We make sure not to render this if `repeatItemData` is non-null, because that means we are rendering an array of
-     * blocks, and the children will be repeated within those blocks.
-     */
-    const shouldRenderChildrenOutsideRef =
-      !blockComponent()?.component && !repeatItem();
-    return shouldRenderChildrenOutsideRef
-      ? processedBlock().children ?? []
-      : [];
-  }
-
-  function componentRefProps() {
-    return {
-      blockChildren: processedBlock().children ?? [],
-      componentRef: blockComponent()?.component,
-      componentOptions: {
-        ...getBlockComponentOptions(processedBlock()),
-        builderContext: props.context,
-        ...(blockComponent()?.name === "Symbol" ||
-        blockComponent()?.name === "Columns"
-          ? {
-              builderComponents: props.registeredComponents,
-            }
-          : {}),
-      },
-      context: childrenContext(),
-      registeredComponents: props.registeredComponents,
-      builderBlock: processedBlock(),
-      includeBlockProps: blockComponent()?.noWrap === true,
-      isInteractive: !blockComponent()?.isRSC,
-    };
-  }
-
-  return (
-    <Show when={canShowBlock()}>
-      <Show
-        fallback={<ComponentRef {...componentRefProps()}></ComponentRef>}
-        when={!blockComponent()?.noWrap}
-      >
-        <Show when={isEmptyHtmlElement(Tag())}>
-          <BlockWrapper
-            Wrapper={Tag()}
-            block={processedBlock()}
-            context={props.context}
-            hasChildren={false}
-          ></BlockWrapper>
-        </Show>
-        <Show when={!isEmptyHtmlElement(Tag()) && repeatItem()}>
-          <For each={repeatItem()}>
-            {(data, _index) => {
-              const index = _index();
-              return (
-                <RepeatedBlock
-                  key={index}
-                  repeatContext={data.context}
-                  block={data.block}
-                  registeredComponents={props.registeredComponents}
-                ></RepeatedBlock>
-              );
-            }}
-          </For>
-        </Show>
-        <Show when={!isEmptyHtmlElement(Tag()) && !repeatItem()}>
-          <BlockWrapper
-            Wrapper={Tag()}
-            block={processedBlock()}
-            context={props.context}
-            hasChildren={true}
-          >
-            <ComponentRef {...componentRefProps()}></ComponentRef>
-            <For each={childrenWithoutParentComponent()}>
-              {(child, _index) => {
-                const index = _index();
-                return (
-                  <Block
-                    key={"block-" + child.id}
-                    block={child}
-                    context={childrenContext()}
-                    registeredComponents={props.registeredComponents}
-                  ></Block>
-                );
-              }}
-            </For>
-            <For each={childrenWithoutParentComponent()}>
-              {(child, _index) => {
-                const index = _index();
-                return (
-                  <BlockStyles
-                    key={"block-style-" + child.id}
-                    block={child}
-                    context={childrenContext()}
-                  ></BlockStyles>
-                );
-              }}
-            </For>
-          </BlockWrapper>
-        </Show>
-      </Show>
-    </Show>
-  );
-}
-
-export default Block;