@builder.io/sdk-react-native 0.0.11 → 0.0.12

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@builder.io/sdk-react-native",
   "description": "Builder.io SDK for React Native",
-  "version": "0.0.11",
+  "version": "0.0.12",
   "main": "src/index.js",
   "files": [
     "src"
@@ -12,6 +12,7 @@
   },
   "dependencies": {
     "@react-native-async-storage/async-storage": "^1.17.10",
+    "node-fetch": "^2.6.1",
     "react-native-render-html": "^6.3.4",
     "react-native-storage": "^1.0.1",
     "react-native-video": "^5.1.1"

package/src/blocks/button/button.js

@@ -21,8 +21,9 @@ import BaseText from "../BaseText";
 import * as React from "react";
 import { View, StyleSheet } from "react-native";
 function Button(props) {
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, props.link ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(View, __spreadProps(__spreadValues({}, props.attributes), {
-    role: "button",
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, props.link ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(View, __spreadProps(__spreadValues({
+    role: "button"
+  }, props.attributes), {
     href: props.link,
     target: props.openLinkInNewTab ? "_blank" : void 0
   }), /* @__PURE__ */ React.createElement(BaseText, null, props.text))) : /* @__PURE__ */ React.createElement(View, __spreadProps(__spreadValues({}, props.attributes), {

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

@@ -1,4 +1,4 @@
-import { markSerializable } from "../util.js";
+import { serializeFn } from "../util.js";
 const componentInfo = {
   name: "Columns",
   builtIn: true,
@@ -187,7 +187,7 @@ const componentInfo = {
           ]
         }
       ],
-      onChange: markSerializable((options) => {
+      onChange: serializeFn((options) => {
         function clearWidths() {
           columns.forEach((col) => {
             col.delete("width");

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

@@ -1,4 +1,4 @@
-import { markSerializable } from "../util.js";
+import { serializeFn } from "../util.js";
 const componentInfo = {
   name: "Embed",
   static: true,
@@ -10,7 +10,7 @@ const componentInfo = {
       required: true,
       defaultValue: "",
       helperText: "e.g. enter a youtube url, google map, etc",
-      onChange: markSerializable((options) => {
+      onChange: serializeFn((options) => {
         const url = options.get("url");
         if (url) {
           options.set("content", "Loading...");

package/src/blocks/form/form.js

@@ -1,6 +1,4 @@
 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;
@@ -16,7 +14,6 @@ var __spreadValues = (a, b) => {
     }
   return a;
 };
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 var __async = (__this, __arguments, generator) => {
   return new Promise((resolve, reject) => {
     var fulfilled = (value) => {
@@ -194,14 +191,14 @@ function FormComponent(props) {
     }
   }
   const builderContext = useContext(BuilderContext);
-  return /* @__PURE__ */ React.createElement(View, __spreadProps(__spreadValues({}, props.attributes), {
+  return /* @__PURE__ */ React.createElement(View, __spreadValues({
     validate: props.validate,
     ref: formRef,
     action: !props.sendWithJs && props.action,
     method: props.method,
     name: props.name,
     onSubmit: (event) => onSubmit(event)
-  }), " ", props.builderBlock && props.builderBlock.children ? /* @__PURE__ */ React.createElement(React.Fragment, null, (_b = (_a = props.builderBlock) == null ? void 0 : _a.children) == null ? void 0 : _b.map((block) => /* @__PURE__ */ React.createElement(RenderBlock, {
+  }, props.attributes), " ", props.builderBlock && props.builderBlock.children ? /* @__PURE__ */ React.createElement(React.Fragment, null, (_b = (_a = props.builderBlock) == null ? void 0 : _a.children) == null ? void 0 : _b.map((block) => /* @__PURE__ */ React.createElement(RenderBlock, {
     block,
     context: builderContext
   }))) : null, " ", submissionState() === "error" ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(BuilderBlocks, {

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

@@ -1,4 +1,4 @@
-import { markSerializable } from "../util.js";
+import { serializeFn } from "../util.js";
 const componentInfo = {
   name: "Image",
   static: true,
@@ -19,7 +19,7 @@ const componentInfo = {
       allowedFileTypes: ["jpeg", "jpg", "png", "svg"],
       required: true,
       defaultValue: "https://cdn.builder.io/api/v1/image/assets%2Fpwgjf0RoYWbdnJSbpBAjXNRMe9F2%2Ffb27a7c790324294af8be1c35fe30f4d",
-      onChange: markSerializable((options) => {
+      onChange: serializeFn((options) => {
         const DEFAULT_ASPECT_RATIO = 0.7041;
         options.delete("srcset");
         options.delete("noWebp");

package/src/blocks/img/img.js

@@ -1,6 +1,4 @@
 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;
@@ -16,12 +14,11 @@ var __spreadValues = (a, b) => {
     }
   return a;
 };
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 import * as React from "react";
 import { View } from "react-native";
 import { isEditing } from "../../functions/is-editing.js";
 function ImgComponent(props) {
-  return /* @__PURE__ */ React.createElement(View, __spreadProps(__spreadValues({}, props.attributes), {
+  return /* @__PURE__ */ React.createElement(View, __spreadValues({
     style: {
       objectFit: props.backgroundSize || "cover",
       objectPosition: props.backgroundPosition || "center"
@@ -29,7 +26,7 @@ function ImgComponent(props) {
     key: isEditing() && props.imgSrc || "default-key",
     alt: props.altText,
     src: props.imgSrc || props.image
-  }));
+  }, props.attributes));
 }
 export {
   ImgComponent as default

package/src/blocks/submit-button/submit-button.js

@@ -1,6 +1,4 @@
 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;
@@ -16,14 +14,13 @@ var __spreadValues = (a, b) => {
     }
   return a;
 };
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 import BaseText from "../BaseText";
 import * as React from "react";
 import { View } from "react-native";
 function SubmitButton(props) {
-  return /* @__PURE__ */ React.createElement(View, __spreadProps(__spreadValues({}, props.attributes), {
+  return /* @__PURE__ */ React.createElement(View, __spreadValues({
     type: "submit"
-  }), /* @__PURE__ */ React.createElement(BaseText, null, props.text));
+  }, props.attributes), /* @__PURE__ */ React.createElement(BaseText, null, props.text));
 }
 export {
   SubmitButton as default

package/src/blocks/util.js

@@ -1,7 +1,8 @@
-function markSerializable(fn) {
-  fn.__qwik_serializable__ = true;
-  return fn;
-}
+const serializeFn = (fnValue) => {
+  const fnStr = fnValue.toString().trim();
+  const appendFunction = !fnStr.startsWith("function") && !fnStr.startsWith("(");
+  return `return (${appendFunction ? "function " : ""}${fnStr}).apply(this, arguments)`;
+};
 export {
-  markSerializable
+  serializeFn
 };

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

@@ -30,6 +30,7 @@ var __objRest = (source, exclude) => {
   return target;
 };
 import * as React from "react";
+import { View } from "react-native";
 import { useState } from "react";
 import { getBlockActions } from "../../functions/get-block-actions.js";
 import { getBlockComponentOptions } from "../../functions/get-block-component-options.js";
@@ -68,7 +69,7 @@ function RenderBlock(props) {
       return ref;
     }
   }
-  function tagName() {
+  function tag() {
     return getBlockTag(useBlock());
   }
   function useBlock() {
@@ -98,7 +99,7 @@ function RenderBlock(props) {
   function renderComponentProps() {
     var _a2;
     return {
-      blockChildren: children(),
+      blockChildren: useChildren(),
       componentRef: (_a2 = component == null ? void 0 : component()) == null ? void 0 : _a2.component,
       componentOptions: __spreadValues(__spreadValues({}, getBlockComponentOptions(useBlock())), shouldWrap() ? {} : {
         attributes: attributes()
@@ -106,14 +107,14 @@ function RenderBlock(props) {
       context: childrenContext()
     };
   }
-  function children() {
+  function useChildren() {
     var _a2;
     return (_a2 = useBlock().children) != null ? _a2 : [];
   }
   function childrenWithoutParentComponent() {
     var _a2;
     const shouldRenderChildrenOutsideRef = !((_a2 = component == null ? void 0 : component()) == null ? void 0 : _a2.component) && !repeatItemData();
-    return shouldRenderChildrenOutsideRef ? children() : [];
+    return shouldRenderChildrenOutsideRef ? useChildren() : [];
   }
   function repeatItemData() {
     const _a2 = props.block, { repeat } = _a2, blockWithoutRepeat = __objRest(_a2, ["repeat"]);
@@ -174,12 +175,11 @@ function RenderBlock(props) {
   }
   const [componentInfo, setComponentInfo] = useState(() => null);
   const RenderComponentTagRef = renderComponentTag();
-  const TagNameRef = tagName();
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, shouldWrap() ? /* @__PURE__ */ React.createElement(React.Fragment, null, isEmptyHtmlElement(tagName()) ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(TagNameRef, __spreadValues({}, attributes()))) : null, !isEmptyHtmlElement(tagName()) && repeatItemData() ? /* @__PURE__ */ React.createElement(React.Fragment, null, (_a = repeatItemData()) == null ? void 0 : _a.map((data, index) => /* @__PURE__ */ React.createElement(RenderRepeatedBlock, {
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, shouldWrap() ? /* @__PURE__ */ React.createElement(React.Fragment, null, isEmptyHtmlElement(tag()) ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(View, __spreadValues({}, attributes()))) : null, !isEmptyHtmlElement(tag()) && repeatItemData() ? /* @__PURE__ */ React.createElement(React.Fragment, null, (_a = repeatItemData()) == null ? void 0 : _a.map((data, index) => /* @__PURE__ */ React.createElement(RenderRepeatedBlock, {
     key: index,
     repeatContext: data.context,
     block: data.block
-  }))) : null, !isEmptyHtmlElement(tagName()) && !repeatItemData() ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(TagNameRef, __spreadValues({}, attributes()), /* @__PURE__ */ React.createElement(RenderComponentTagRef, __spreadValues({}, renderComponentProps())), (_b = childrenWithoutParentComponent()) == null ? void 0 : _b.map((child) => /* @__PURE__ */ React.createElement(RenderBlock, {
+  }))) : null, !isEmptyHtmlElement(tag()) && !repeatItemData() ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(View, __spreadValues({}, attributes()), /* @__PURE__ */ React.createElement(RenderComponentTagRef, __spreadValues({}, renderComponentProps())), (_b = childrenWithoutParentComponent()) == null ? void 0 : _b.map((child) => /* @__PURE__ */ React.createElement(RenderBlock, {
     key: "render-block-" + child.id,
     block: child,
     context: childrenContext()

package/src/components/render-content/builder-editing.js

@@ -0,0 +1,8 @@
+import * as React from "react";
+import { View } from "react-native";
+function BuilderEditing(props) {
+  return /* @__PURE__ */ React.createElement(View, null);
+}
+export {
+  BuilderEditing as default
+};

package/src/components/render-inlined-styles.js

@@ -3,15 +3,14 @@ import { View, Text } from "react-native";
 import { TARGET } from "../constants/target.js";
 function RenderInlinedStyles(props) {
   function injectedStyleScript() {
-    return `<${tagName()}>${props.styles}</${tagName()}>`;
+    return `<${tag()}>${props.styles}</${tag()}>`;
   }
-  function tagName() {
+  function tag() {
     return "style";
   }
-  const TagNameRef = tagName();
   return /* @__PURE__ */ React.createElement(React.Fragment, null, TARGET === "svelte" ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(View, {
     dangerouslySetInnerHTML: { __html: injectedStyleScript() }
-  })) : /* @__PURE__ */ React.createElement(TagNameRef, null, /* @__PURE__ */ React.createElement(Text, null, props.styles)));
+  })) : /* @__PURE__ */ React.createElement(View, null, /* @__PURE__ */ React.createElement(Text, null, props.styles)));
 }
 export {
   RenderInlinedStyles as default

package/src/functions/get-content/index.js

@@ -56,9 +56,13 @@ const generateContentUrl = (options) => {
     query,
     noTraverse = false,
     model,
-    apiKey
+    apiKey,
+    includeRefs = true
   } = options;
-  const url = new URL(`https://cdn.builder.io/api/v2/content/${model}?apiKey=${apiKey}&limit=${limit}&noTraverse=${noTraverse}`);
+  if (!apiKey) {
+    throw new Error("Missing API key");
+  }
+  const url = new URL(`https://cdn.builder.io/api/v2/content/${model}?apiKey=${apiKey}&limit=${limit}&noTraverse=${noTraverse}&includeRefs=${includeRefs}`);
   const queryOptions = __spreadValues(__spreadValues({}, getBuilderSearchParamsFromWindow()), normalizeSearchParams(options.options || {}));
   const flattened = flatten(queryOptions);
   for (const key in flattened) {

package/src/functions/register-component.js

@@ -29,6 +29,7 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
+import { serializeFn } from "../blocks/util.js";
 import { fastClone } from "./fast-clone.js";
 const components = [];
 function registerComponent(component, info) {
@@ -48,11 +49,6 @@ const createRegisterComponentMessage = (_a) => {
   };
 };
 const serializeValue = (value) => typeof value === "function" ? serializeFn(value) : fastClone(value);
-const serializeFn = (fnValue) => {
-  const fnStr = fnValue.toString().trim();
-  const appendFunction = !fnStr.startsWith("function") && !fnStr.startsWith("(");
-  return `return (${appendFunction ? "function " : ""}${fnStr}).apply(this, arguments)`;
-};
 const prepareComponentInfoToSend = (_c) => {
   var _d = _c, {
     inputs

package/src/index.js

@@ -1,4 +1,4 @@
-import "./index-helpers/top-of-file.js";
+export * from "./index-helpers/top-of-file.js";
 import "./scripts/init-editing.js";
 export * from "./index-helpers/blocks-exports.js";
 export * from "./functions/is-editing.js";

package/src/scripts/init-editing.js

@@ -19,8 +19,13 @@ const registerInsertMenu = () => {
     ]
   });
 };
+let isSetupForEditing = false;
 const setupBrowserForEditing = () => {
   var _a;
+  if (isSetupForEditing) {
+    return;
+  }
+  isSetupForEditing = true;
   if (isBrowser()) {
     (_a = window.parent) == null ? void 0 : _a.postMessage({
       type: "builder.sdkInfo",