@builder.io/sdk-react-native 0.7.0 → 0.7.1-0

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

@@ -1,4 +1,3 @@
-"use client";
 import * as React from "react";
 import {
   FlatList,

package/src/components/blocks/blocks-wrapper.jsx

@@ -1,4 +1,3 @@
-"use client";
 import * as React from "react";
 import {
   FlatList,

package/src/components/blocks/blocks.jsx

@@ -1,4 +1,3 @@
-"use client";
 import * as React from "react";
 import {
   FlatList,

package/src/components/content/components/enable-editor.jsx

@@ -1,4 +1,3 @@
-"use client";
 import * as React from "react";
 import {
   FlatList,
@@ -193,94 +192,133 @@ function EnableEditor(props) {
     }
   }
 
+  function elementRef_onIniteditingbldr(event) {
+    setForceReRenderCount(forceReRenderCount + 1);
+    window.addEventListener("message", processMessage);
+    registerInsertMenu();
+    setupBrowserForEditing({
+      ...(props.locale
+        ? {
+            locale: props.locale,
+          }
+        : {}),
+      ...(props.includeRefs
+        ? {
+            includeRefs: props.includeRefs,
+          }
+        : {}),
+      ...(props.enrich
+        ? {
+            enrich: props.enrich,
+          }
+        : {}),
+    });
+    Object.values(props.builderContextSignal.componentInfos).forEach(
+      (registeredComponent) => {
+        const message = createRegisterComponentMessage(registeredComponent);
+        window.parent?.postMessage(message, "*");
+      }
+    );
+    window.addEventListener(
+      "builder:component:stateChangeListenerActivated",
+      emitStateUpdate
+    );
+  }
+
+  function elementRef_onInitpreviewingbldr(event) {
+    const searchParams = new URL(location.href).searchParams;
+    const searchParamPreviewModel = searchParams.get("builder.preview");
+    const searchParamPreviewId = searchParams.get(
+      `builder.preview.${searchParamPreviewModel}`
+    );
+    const previewApiKey =
+      searchParams.get("apiKey") || searchParams.get("builder.space");
+
+    /**
+     * Make sure that:
+     * - the preview model name is the same as the one we're rendering, since there can be multiple models rendered *  at the same time, e.g. header/page/footer. * - the API key is the same, since we don't want to preview content from other organizations.
+     * - if there is content, that the preview ID is the same as that of the one we receive.
+     *
+     * TO-DO: should we only update the state when there is a change?
+     **/
+    if (
+      searchParamPreviewModel === props.model &&
+      previewApiKey === props.apiKey &&
+      (!props.content || searchParamPreviewId === props.content.id)
+    ) {
+      fetchOneEntry({
+        model: props.model,
+        apiKey: props.apiKey,
+        apiVersion: props.builderContextSignal.apiVersion,
+      }).then((content) => {
+        if (content) {
+          mergeNewContent(content);
+        }
+      });
+    }
+  }
+
   useEffect(() => {
-    if (!props.apiKey) {
-      logger.error(
-        "No API key provided to `RenderContent` component. This can cause issues. Please provide an API key using the `apiKey` prop."
+    elementRef.current?.addEventListener(
+      "initeditingbldr",
+      elementRef_onIniteditingbldr
+    );
+    return () =>
+      elementRef.current?.removeEventListener(
+        "initeditingbldr",
+        elementRef_onIniteditingbldr
       );
-    }
+  }, []);
+
+  useEffect(() => {
+    elementRef.current?.addEventListener(
+      "initpreviewingbldr",
+      elementRef_onInitpreviewingbldr
+    );
+    return () =>
+      elementRef.current?.removeEventListener(
+        "initpreviewingbldr",
+        elementRef_onInitpreviewingbldr
+      );
+  }, []);
+
+  useEffect(() => {
     if (isBrowser()) {
-      if (isEditing()) {
-        setForceReRenderCount(forceReRenderCount + 1);
-        window.addEventListener("message", processMessage);
-        registerInsertMenu();
-        setupBrowserForEditing({
-          ...(props.locale
-            ? {
-                locale: props.locale,
-              }
-            : {}),
-          ...(props.includeRefs
-            ? {
-                includeRefs: props.includeRefs,
-              }
-            : {}),
-          ...(props.enrich
-            ? {
-                enrich: props.enrich,
-              }
-            : {}),
-        });
-        Object.values(props.builderContextSignal.componentInfos).forEach(
-          (registeredComponent) => {
-            const message = createRegisterComponentMessage(registeredComponent);
-            window.parent?.postMessage(message, "*");
-          }
-        );
-        window.addEventListener(
-          "builder:component:stateChangeListenerActivated",
-          emitStateUpdate
-        );
+      if (isEditing() && elementRef.current) {
+        elementRef.current.dispatchEvent(new CustomEvent("initeditingbldr"));
       }
-      if (props.builderContextSignal.content) {
+      const shouldTrackImpression =
+        props.builderContextSignal.content &&
+        getDefaultCanTrack(props.canTrack);
+      if (shouldTrackImpression) {
         const variationId = props.builderContextSignal.content?.testVariationId;
         const contentId = props.builderContextSignal.content?.id;
+        const apiKeyProp = props.apiKey;
         _track({
           type: "impression",
-          canTrack: getDefaultCanTrack(props.canTrack),
+          canTrack: true,
           contentId,
-          apiKey: props.apiKey,
+          apiKey: apiKeyProp,
           variationId: variationId !== contentId ? variationId : undefined,
         });
       }
-      // override normal content in preview mode
-      if (isPreviewing()) {
-        const searchParams = new URL(location.href).searchParams;
-        const searchParamPreviewModel = searchParams.get("builder.preview");
-        const searchParamPreviewId = searchParams.get(
-          `builder.preview.${searchParamPreviewModel}`
-        );
-        const previewApiKey =
-          searchParams.get("apiKey") || searchParams.get("builder.space");
 
-        /**
-         * Make sure that:
-         * - the preview model name is the same as the one we're rendering, since there can be multiple models rendered  *  at the same time, e.g. header/page/footer.  * - the API key is the same, since we don't want to preview content from other organizations.
-         * - if there is content, that the preview ID is the same as that of the one we receive.
-         *
-         * TO-DO: should we only update the state when there is a change?
-         **/
-        if (
-          searchParamPreviewModel === props.model &&
-          previewApiKey === props.apiKey &&
-          (!props.content || searchParamPreviewId === props.content.id)
-        ) {
-          fetchOneEntry({
-            model: props.model,
-            apiKey: props.apiKey,
-            apiVersion: props.builderContextSignal.apiVersion,
-          }).then((content) => {
-            if (content) {
-              mergeNewContent(content);
-            }
-          });
-        }
+      // override normal content in preview mode
+      if (isPreviewing() && elementRef.current) {
+        elementRef.current.dispatchEvent(new CustomEvent("initpreviewingbldr"));
       }
-      evaluateJsCode();
-      runHttpRequests();
-      emitStateUpdate();
     }
   }, []);
+  useEffect(() => {
+    if (!props.apiKey) {
+      logger.error(
+        "No API key provided to `RenderContent` component. This can cause issues. Please provide an API key using the `apiKey` prop."
+      );
+    }
+    evaluateJsCode();
+    runHttpRequests();
+    emitStateUpdate();
+  }, []);
 
   useEffect(() => {
     if (props.content) {
@@ -318,6 +356,7 @@ function EnableEditor(props) {
       {props.builderContextSignal.content ? (
         <>
           <ScrollView
+            {...{}}
             key={forceReRenderCount}
             ref={elementRef}
             onClick={(event) => onClick(event)}

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

@@ -1,4 +1,3 @@
-"use client";
 import * as React from "react";
 import {
   FlatList,

package/src/components/content/content.jsx

@@ -1,4 +1,3 @@
-"use client";
 import * as React from "react";
 import {
   FlatList,

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

@@ -1,4 +1,3 @@
-"use client";
 import * as React from "react";
 import {
   FlatList,

package/src/components/inlined-script.jsx

@@ -1,4 +1,3 @@
-"use client";
 import * as React from "react";
 import {
   FlatList,

package/src/components/inlined-styles.jsx

@@ -1,4 +1,3 @@
-"use client";
 import * as React from "react";
 import {
   FlatList,

package/src/constants/sdk-version.js

@@ -1 +1 @@
-export const SDK_VERSION = "0.7.0"
+export const SDK_VERSION = "0.7.1-0"

package/src/functions/evaluate/choose-eval.js

@@ -0,0 +1,5 @@
+import { runInBrowser } from "./browser-runtime/browser.js";
+import { isBrowser } from "../is-browser.js";
+import { evaluator } from "placeholder-runtime";
+const chooseBrowserOrServerEval = args => isBrowser() ? runInBrowser(args) : evaluator(args);
+export { chooseBrowserOrServerEval }

package/src/functions/evaluate/evaluate.js

@@ -1,8 +1,6 @@
 import { logger } from "../../helpers/logger.js";
-import { isBrowser } from "../is-browser.js";
-import { isEditing } from "../is-editing.js";
-import { getUserAttributes } from "../track/helpers.js";
-import { evaluator } from "placeholder-runtime";
+import { getBuilderGlobals, parseCode } from "./helpers.js";
+import { chooseBrowserOrServerEval } from "./choose-eval.js";
 function evaluate({
   code,
   context,
@@ -16,17 +14,11 @@ function evaluate({
     logger.warn("Skipping evaluation of empty code block.");
     return;
   }
-  const builder = {
-    isEditing: isEditing(),
-    isBrowser: isBrowser(),
-    isServer: !isBrowser(),
-    getUserAttributes: () => getUserAttributes()
-  };
-  const useReturn = isExpression && !(code.includes(";") || code.includes(" return ") || code.trim().startsWith("return "));
-  const useCode = useReturn ? `return (${code});` : code;
   const args = {
-    code: useCode,
-    builder,
+    code: parseCode(code, {
+      isExpression
+    }),
+    builder: getBuilderGlobals(),
     context,
     event,
     rootSetState,
@@ -34,7 +26,7 @@ function evaluate({
     localState
   };
   try {
-    return evaluator(args);
+    return chooseBrowserOrServerEval(args);
   } catch (e) {
     logger.error("Failed code evaluation: " + e.message, {
       code

package/src/functions/evaluate/helpers.js

@@ -1,3 +1,6 @@
+import { isBrowser } from "../is-browser.js";
+import { isEditing } from "../is-editing.js";
+import { getUserAttributes } from "../track/helpers.js";
 const getFunctionArguments = ({
   builder,
   context,
@@ -12,4 +15,17 @@ const getFunctionArguments = ({
     event
   });
 };
-export { getFunctionArguments }
+const getBuilderGlobals = () => ({
+  isEditing: isEditing(),
+  isBrowser: isBrowser(),
+  isServer: !isBrowser(),
+  getUserAttributes: () => getUserAttributes()
+});
+const parseCode = (code, {
+  isExpression = true
+}) => {
+  const useReturn = isExpression && !(code.includes(";") || code.includes(" return ") || code.trim().startsWith("return "));
+  const useCode = useReturn ? `return (${code});` : code;
+  return useCode;
+};
+export { getBuilderGlobals, getFunctionArguments, parseCode }

package/src/functions/evaluate/node-runtime/index.js

@@ -1,2 +1,2 @@
-import { evaluator } from "../browser-runtime/index.js";
-export { evaluator }
+import { runInNode } from "./node-runtime.js";
+export { runInNode as evaluator }

package/src/functions/evaluate/node-runtime/node-runtime.js

@@ -0,0 +1,128 @@
+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));
+import { getFunctionArguments } from "../helpers.js";
+import { safeDynamicRequire } from "./safeDynamicRequire.js";
+import { fastClone } from "../../fast-clone.js";
+import { set } from "../../set.js";
+const ivm = safeDynamicRequire("isolated-vm");
+const getSyncValName = key => `bldr_${key}_sync`;
+const BUILDER_SET_STATE_NAME = "BUILDER_SET_STATE";
+const INJECTED_IVM_GLOBAL = "BUILDER_IVM";
+const REF_TO_PROXY_FN = `
+var refToProxy = (obj) => {
+  if (typeof obj !== 'object' || obj === null) {
+    return obj;
+  }
+  return new Proxy({}, {
+    get(target, key) {
+        if (key === 'copySync') {
+          return () => obj.copySync();
+        }
+        const val = obj.getSync(key);
+        if (typeof val?.getSync === 'function') {
+            return refToProxy(val);
+        }
+        return val;
+    },
+    set(target, key, value) {
+        const v = typeof value === 'object' ? new ${INJECTED_IVM_GLOBAL}.Reference(value) : value;
+        obj.setSync(key, v);
+        ${BUILDER_SET_STATE_NAME}(key, value)
+    },
+    deleteProperty(target, key) {
+        obj.deleteSync(key);
+    }
+  })
+}
+`;
+const processCode = ({
+  code,
+  args
+}) => {
+  const fnArgs = args.map(([name]) => `var ${name} = refToProxy(${getSyncValName(name)}); `).join("");
+  return `
+${REF_TO_PROXY_FN}
+${fnArgs}
+function theFunction() {
+  ${code}
+}
+
+let output = theFunction()
+
+if (typeof output === 'object' && output !== null) {
+  output = JSON.stringify(output.copySync ? output.copySync() : output);
+}
+
+output;
+`;
+};
+const getIsolateContext = () => {
+  const isolate = new ivm.Isolate({
+    memoryLimit: 128
+  });
+  return isolate.createContextSync();
+};
+const runInNode = ({
+  code,
+  builder,
+  context,
+  event,
+  localState,
+  rootSetState,
+  rootState
+}) => {
+  const state = fastClone(__spreadValues(__spreadValues({}, rootState), localState));
+  const args = getFunctionArguments({
+    builder,
+    context,
+    event,
+    state
+  });
+  const isolateContext = getIsolateContext();
+  const jail = isolateContext.global;
+  jail.setSync("global", jail.derefInto());
+  jail.setSync("log", function (...logArgs) {
+    console.log(...logArgs);
+  });
+  jail.setSync(BUILDER_SET_STATE_NAME, function (key, value) {
+    set(rootState, key, value);
+    rootSetState == null ? void 0 : rootSetState(rootState);
+  });
+  args.forEach(([key, arg]) => {
+    const val = typeof arg === "object" ? new ivm.Reference(key === "builder" ? __spreadProps(__spreadValues({}, arg), {
+      getUserAttributes: () => arg.getUserAttributes()
+    }) : arg) : null;
+    jail.setSync(getSyncValName(key), val);
+  });
+  jail.setSync(INJECTED_IVM_GLOBAL, ivm);
+  const evalStr = processCode({
+    code,
+    args
+  });
+  const resultStr = isolateContext.evalSync(evalStr);
+  try {
+    const res = JSON.parse(resultStr);
+    return res;
+  } catch (_error) {
+    return resultStr;
+  }
+};
+export { runInNode }

package/src/functions/evaluate/node-runtime/safeDynamicRequire.js

@@ -0,0 +1,6 @@
+const noop = () => null;
+let safeDynamicRequire = noop;
+try {
+  safeDynamicRequire = eval("require");
+} catch (error) {}
+export { safeDynamicRequire }

package/src/functions/get-content/generate-content-url.js

@@ -18,6 +18,7 @@ var __spreadValues = (a, b) => {
 import { flatten } from "../../helpers/flatten.js";
 import { getBuilderSearchParamsFromWindow, normalizeSearchParams } from "../get-builder-search-params/index.js";
 import { DEFAULT_API_VERSION } from "../../types/api-version.js";
+const isPositiveNumber = thing => typeof thing === "number" && !isNaN(thing) && thing >= 0;
 const generateContentUrl = options => {
   let {
     noTraverse = false
@@ -31,7 +32,14 @@ const generateContentUrl = options => {
     includeRefs = true,
     enrich,
     locale,
-    apiVersion = DEFAULT_API_VERSION
+    apiVersion = DEFAULT_API_VERSION,
+    fields,
+    omit,
+    offset,
+    cacheSeconds,
+    staleCacheSeconds,
+    sort,
+    includeUnpublished
   } = options;
   if (!apiKey) {
     throw new Error("Missing API key");
@@ -43,6 +51,30 @@ const generateContentUrl = options => {
     noTraverse = true;
   }
   const url = new URL(`https://cdn.builder.io/api/${apiVersion}/content/${model}?apiKey=${apiKey}&limit=${limit}&noTraverse=${noTraverse}&includeRefs=${includeRefs}${locale ? `&locale=${locale}` : ""}${enrich ? `&enrich=${enrich}` : ""}`);
+  url.searchParams.set("omit", omit || "meta.componentsUsed");
+  if (fields) {
+    url.searchParams.set("fields", fields);
+  }
+  if (Number.isFinite(offset) && offset > -1) {
+    url.searchParams.set("offset", String(Math.floor(offset)));
+  }
+  if (typeof includeUnpublished === "boolean") {
+    url.searchParams.set("includeUnpublished", String(includeUnpublished));
+  }
+  if (cacheSeconds && isPositiveNumber(cacheSeconds)) {
+    url.searchParams.set("cacheSeconds", String(cacheSeconds));
+  }
+  if (staleCacheSeconds && isPositiveNumber(staleCacheSeconds)) {
+    url.searchParams.set("staleCacheSeconds", String(staleCacheSeconds));
+  }
+  if (sort) {
+    const flattened2 = flatten({
+      sort
+    });
+    for (const key in flattened2) {
+      url.searchParams.set(key, JSON.stringify(flattened2[key]));
+    }
+  }
   const queryOptions = __spreadValues(__spreadValues({}, getBuilderSearchParamsFromWindow()), normalizeSearchParams(options.options || {}));
   const flattened = flatten(queryOptions);
   for (const key in flattened) {

package/src/functions/is-edge-runtime.js

@@ -1,9 +1,6 @@
 import { isBrowser } from "./is-browser.js";
+import { isNodeRuntime } from "./is-node-runtime.js";
 function isEdgeRuntime() {
-  const hasNode = () => {
-    var _a;
-    return typeof process !== "undefined" && ((_a = process == null ? void 0 : process.versions) == null ? void 0 : _a.node);
-  };
-  return !isBrowser() && !hasNode();
+  return !isBrowser() && !isNodeRuntime();
 }
 export { isEdgeRuntime }

package/src/functions/is-node-runtime.js

@@ -0,0 +1,6 @@
+import { checkIsDefined } from "../helpers/nullable";
+function isNodeRuntime() {
+  var _a;
+  return typeof process !== "undefined" && checkIsDefined((_a = process == null ? void 0 : process.versions) == null ? void 0 : _a.node);
+}
+export { isNodeRuntime }