@builder.io/sdk-react-native 0.5.8 → 0.6.0

package/package.json

@@ -1,20 +1,102 @@
 {
   "name": "@builder.io/sdk-react-native",
   "description": "Builder.io SDK for React Native",
-  "version": "0.5.8",
+  "version": "0.6.0",
   "type": "module",
-  "main": "./dist/index.js",
-  "module": "./dist/index.js",
+  "main": "lib/browser/commonjs/index.js",
+  "module": "lib/browser/module/index.js",
+  "react-native": "src/index.js",
+  "types": "lib/browser/typescript/index.d.ts",
   "exports": {
-    ".": "./dist/index.js"
+    ".": {
+      "react-native": {
+        "types": "./lib/browser/typescript/index.d.ts",
+        "import": "./lib/browser/module/index.js",
+        "require": "./lib/browser/commonjs/index.js"
+      },
+      "node": {
+        "types": "./lib/node/typescript/index.d.ts",
+        "import": "./lib/node/module/index.js",
+        "require": "./lib/node/commonjs/index.js"
+      },
+      "browser": {
+        "types": "./lib/browser/typescript/index.d.ts",
+        "import": "./lib/browser/module/index.js",
+        "require": "./lib/browser/commonjs/index.js"
+      },
+      "edge-routine": {
+        "types": "./lib/edge/typescript/index.d.ts",
+        "import": "./lib/edge/module/index.js",
+        "require": "./lib/edge/commonjs/index.js"
+      },
+      "workerd": {
+        "types": "./lib/edge/typescript/index.d.ts",
+        "import": "./lib/edge/module/index.js",
+        "require": "./lib/edge/commonjs/index.js"
+      },
+      "deno": {
+        "types": "./lib/edge/typescript/index.d.ts",
+        "import": "./lib/edge/module/index.js",
+        "require": "./lib/edge/commonjs/index.js"
+      },
+      "lagon": {
+        "types": "./lib/edge/typescript/index.d.ts",
+        "import": "./lib/edge/module/index.js",
+        "require": "./lib/edge/commonjs/index.js"
+      },
+      "netlify": {
+        "types": "./lib/edge/typescript/index.d.ts",
+        "import": "./lib/edge/module/index.js",
+        "require": "./lib/edge/commonjs/index.js"
+      },
+      "edge-light": {
+        "types": "./lib/edge/typescript/index.d.ts",
+        "import": "./lib/edge/module/index.js",
+        "require": "./lib/edge/commonjs/index.js"
+      },
+      "bun": {
+        "types": "./lib/edge/typescript/index.d.ts",
+        "import": "./lib/edge/module/index.js",
+        "require": "./lib/edge/commonjs/index.js"
+      },
+      "electron": {
+        "types": "./lib/node/typescript/index.d.ts",
+        "import": "./lib/node/module/index.js",
+        "require": "./lib/node/commonjs/index.js"
+      },
+      "default": {
+        "types": "./lib/browser/typescript/index.d.ts",
+        "import": "./lib/browser/module/index.js",
+        "require": "./lib/browser/commonjs/index.js"
+      }
+    },
+    "./edge": {
+      "types": "./lib/edge/typescript/index.d.ts",
+      "import": "./lib/edge/module/index.js",
+      "require": "./lib/edge/commonjs/index.js"
+    },
+    "./node": {
+      "types": "./lib/node/typescript/index.d.ts",
+      "import": "./lib/node/module/index.js",
+      "require": "./lib/node/commonjs/index.js"
+    },
+    "./browser": {
+      "types": "./lib/browser/typescript/index.d.ts",
+      "import": "./lib/browser/module/index.js",
+      "require": "./lib/browser/commonjs/index.js"
+    }
   },
   "files": [
-    "src",
-    "dist"
+    "lib/",
+    "src/"
   ],
   "scripts": {
-    "clean": "rimraf dist",
-    "build": "yarn clean && tsc"
+    "build:one": "bob build",
+    "/**/": "the command below cannot be run in parallel because build:browser MUST run first.",
+    "build": "nx run-many -p @builder.io/sdk-react-native -t build:browser build:node build:edge --parallel=false",
+    "build:node": "SDK_ENV=node yarn build:one",
+    "build:edge": "SDK_ENV=edge yarn build:one",
+    "build:browser": "SDK_ENV=browser yarn build:one"
   },
   "dependencies": {
     "@react-native-async-storage/async-storage": "^1.17.10",
@@ -29,18 +111,23 @@
     "react-native-url-polyfill": "^1.3.0"
   },
   "devDependencies": {
+    "@babel/preset-env": "^7.22.10",
+    "@babel/preset-flow": "^7.22.5",
+    "@babel/preset-react": "^7.22.5",
+    "@babel/preset-typescript": "^7.22.5",
+    "@builder.io/sdks": "workspace:*",
     "@tsconfig/react-native": "^2.0.3",
     "@types/react-native-video": "^5.0.9",
+    "babel-plugin-module-resolver": "^5.0.0",
     "nx": "^16.6.0",
     "nx-cloud": "^16.2.0",
+    "react-native-builder-bob": "^0.21.3",
     "react-native-url-polyfill": "^1.3.0",
     "rimraf": "^3.0.2",
+    "tsup": "^7.2.0",
     "typescript": "^4.9.4"
   },
   "nx": {
-    "implicitDependencies": [
-      "@builder.io/sdks"
-    ],
     "targets": {
       "build": {
         "dependsOn": [

package/src/blocks/button/button.jsx

@@ -1,5 +1,5 @@
+"use client";
 import BaseText from "../BaseText";
-("use client");
 import * as React from "react";
 import {
   FlatList,

package/src/blocks/columns/columns.jsx

@@ -13,6 +13,7 @@ import Blocks from "../../components/blocks/blocks";
 import { getSizesForBreakpoints } from "../../constants/device-sizes.js";
 import InlinedStyles from "../../components/inlined-styles";
 import { TARGET } from "../../constants/target.js";
+import { deoptSignal } from "../../functions/deopt.js";
 
 function Columns(props) {
   const [gutterSize, setGutterSize] = useState(() =>
@@ -58,35 +59,13 @@ function Columns(props) {
 
   function columnCssVars(index) {
     const gutter = index === 0 ? 0 : gutterSize;
-    if (TARGET === "reactNative") {
-      return {
-        marginLeft: props.stackColumnsAt === "never" ? gutter : 0,
-      };
-    }
     const width = getColumnCssWidth(index);
     const gutterPixels = `${gutter}px`;
     const mobileWidth = "100%";
     const mobileMarginLeft = 0;
     const marginLeftKey = "margin-left";
     return {
-      width,
-      [marginLeftKey]: gutterPixels,
-      "--column-width-mobile": getMobileStyle({
-        stackedStyle: mobileWidth,
-        desktopStyle: width,
-      }),
-      "--column-margin-left-mobile": getMobileStyle({
-        stackedStyle: mobileMarginLeft,
-        desktopStyle: gutterPixels,
-      }),
-      "--column-width-tablet": getTabletStyle({
-        stackedStyle: mobileWidth,
-        desktopStyle: width,
-      }),
-      "--column-margin-left-tablet": getTabletStyle({
-        stackedStyle: mobileMarginLeft,
-        desktopStyle: gutterPixels,
-      }),
+      marginLeft: props.stackColumnsAt === "never" ? gutter : 0,
     };
   }
 
@@ -157,7 +136,6 @@ function Columns(props) {
           key={index}
         >
           <Blocks
-            blocks={column.blocks}
             path={`component.options.columns.${index}.blocks`}
             parent={props.builderBlock.id}
             styleProp={{
@@ -165,6 +143,7 @@ function Columns(props) {
             }}
             context={props.builderContext}
             registeredComponents={props.builderComponents}
+            blocks={column.blocks}
           />
         </View>
       ))}

package/src/blocks/select/select.jsx

@@ -1,5 +1,5 @@
+"use client";
 import BaseText from "../BaseText";
-("use client");
 import * as React from "react";
 import {
   FlatList,

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

@@ -1,5 +1,5 @@
+"use client";
 import BaseText from "../BaseText";
-("use client");
 import * as React from "react";
 import {
   FlatList,

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

@@ -13,6 +13,7 @@ import BlockStyles from "../block-styles";
 import Block from "../../block";
 import InteractiveElement from "../interactive-element";
 import { getWrapperProps } from "./component-ref.helpers.js";
+import { wrapComponentRef } from "../../../content/wrap-component-ref.js";
 import BuilderContext from "../../../../context/builder.context.js";
 
 function ComponentRef(props) {

package/src/constants/sdk-version.js

@@ -1 +1 @@
-export const SDK_VERSION = "0.5.8"
+export const SDK_VERSION = "0.6.0"

package/src/functions/deopt.js

@@ -0,0 +1,4 @@
+function deoptSignal(value) {
+  return value;
+}
+export { deoptSignal }

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

@@ -0,0 +1,40 @@
+import { getFunctionArguments } from "../helpers.js";
+const runInBrowser = ({
+  code,
+  builder,
+  context,
+  event,
+  localState,
+  rootSetState,
+  rootState
+}) => {
+  const functionArgs = getFunctionArguments({
+    builder,
+    context,
+    event,
+    state: flattenState(rootState, localState, rootSetState)
+  });
+  return new Function(...functionArgs.map(([name]) => name), code)(...functionArgs.map(([, value]) => value));
+};
+function flattenState(rootState, localState, rootSetState) {
+  if (rootState === localState) {
+    throw new Error("rootState === localState");
+  }
+  return new Proxy(rootState, {
+    get: (_, prop) => {
+      if (localState && prop in localState) {
+        return localState[prop];
+      }
+      return rootState[prop];
+    },
+    set: (_, prop, value) => {
+      if (localState && prop in localState) {
+        throw new Error("Writing to local state is not allowed as it is read-only.");
+      }
+      rootState[prop] = value;
+      rootSetState == null ? void 0 : rootSetState(rootState);
+      return true;
+    }
+  });
+}
+export { flattenState, runInBrowser }

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

@@ -0,0 +1,2 @@
+import { runInBrowser } from "./browser.js";
+export { runInBrowser as evaluator }