@builder.io/sdk-react-native 0.0.1-66 → 0.0.1-69

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@builder.io/sdk-react-native",
   "description": "Builder.io SDK for React Native",
-  "version": "0.0.1-66",
+  "version": "0.0.1-69",
   "main": "src/index.js",
   "scripts": {
     "release:dev": "npm version prerelease --no-git-tag-version && npm publish --tag dev --access public"

package/src/blocks/button/button.js

@@ -18,14 +18,17 @@ var __spreadValues = (a, b) => {
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 import * as React from "react";
-import { View, Text } from "react-native";
+import { View, StyleSheet, Text } 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",
     href: props.link,
     target: props.openLinkInNewTab ? "_blank" : void 0
-  }), /* @__PURE__ */ React.createElement(Text, null, props.text))) : /* @__PURE__ */ React.createElement(View, __spreadValues({}, props.attributes), /* @__PURE__ */ React.createElement(Text, null, props.text)));
+  }), /* @__PURE__ */ React.createElement(Text, null, props.text))) : /* @__PURE__ */ React.createElement(View, __spreadProps(__spreadValues({}, props.attributes), {
+    style: styles.view1
+  }), /* @__PURE__ */ React.createElement(Text, null, props.text)));
 }
+const styles = StyleSheet.create({ view1: { all: "unset" } });
 export {
   Button as default
 };

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

@@ -1,4 +1,3 @@
-import * as React from 'react';
 const componentInfo = {
   name: "Core:Button",
   builtIn: true,

package/src/blocks/columns/columns.js

@@ -47,7 +47,9 @@ function Columns(props) {
     style: styles.view2,
     key: index
   }, /* @__PURE__ */ React.createElement(RenderBlocks, {
-    blocks: column.blocks
+    blocks: column.blocks,
+    path: `component.options.columns.${index}.blocks`,
+    parent: props.builderBlock.id
   }))));
 }
 const styles = StyleSheet.create({

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

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

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

@@ -1,4 +1,3 @@
-import * as React from 'react';
 const componentInfo = {
   name: "Custom Code",
   static: true,

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

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { markSerializable } from "../util";
 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(options) {
+      onChange: markSerializable((options) => {
         const url = options.get("url");
         if (url) {
           options.set("content", "Loading...");
@@ -29,7 +29,7 @@ const componentInfo = {
         } else {
           options.delete("content");
         }
-      }
+      })
     },
     {
       name: "content",

package/src/blocks/embed/embed.js

@@ -32,7 +32,7 @@ function Embed(props) {
       setRanInitFn(true);
       findAndRunScripts();
     }
-  }, [elem, ranInitFn]);
+  }, [elem.current, ranInitFn]);
   return /* @__PURE__ */ React.createElement(View, {
     ref: elem,
     dangerouslySetInnerHTML: { __html: props.content }

package/src/blocks/embed/helpers.js

@@ -1,4 +1,3 @@
-import * as React from 'react';
 const SCRIPT_MIME_TYPES = [
   "text/javascript",
   "application/javascript",

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

@@ -1,4 +1,3 @@
-import * as React from 'react';
 const componentInfo = {
   name: "Form:Form",
   builtIn: true,

package/src/blocks/form/form.js

@@ -39,8 +39,9 @@ var __async = (__this, __arguments, generator) => {
 };
 import * as React from "react";
 import { View, StyleSheet, Text } from "react-native";
-import { useState, useRef } from "react";
+import { useState, useContext, useRef } from "react";
 import RenderBlock from "../../components/render-block/render-block.js";
+import BuilderBlocks from "../../components/render-blocks.js";
 import { isEditing } from "../../functions/is-editing.js";
 function FormComponent(props) {
   var _a, _b;
@@ -191,6 +192,7 @@ function FormComponent(props) {
       });
     }
   }
+  const builderContext = useContext(BuilderContext);
   return /* @__PURE__ */ React.createElement(View, __spreadProps(__spreadValues({}, props.attributes), {
     validate: props.validate,
     ref: formRef,
@@ -199,7 +201,8 @@ function FormComponent(props) {
     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, {
-    block
+    block,
+    context: builderContext
   }))) : null, " ", submissionState() === "error" ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(BuilderBlocks, {
     dataPath: "errorMessage",
     blocks: props.errorMessage

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

@@ -1,4 +1,3 @@
-import * as React from 'react';
 const componentInfo = {
   name: "Fragment",
   static: true,

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

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { markSerializable } from "../util";
 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(options) {
+      onChange: markSerializable((options) => {
         const DEFAULT_ASPECT_RATIO = 0.7041;
         options.delete("srcset");
         options.delete("noWebp");
@@ -65,7 +65,7 @@ const componentInfo = {
             }
           });
         }
-      }
+      })
     },
     {
       name: "backgroundSize",

package/src/blocks/image/image.helpers.js

@@ -1,4 +1,3 @@
-import * as React from 'react';
 function removeProtocol(path) {
   return path.replace(/http(s)?:/, "");
 }

package/src/blocks/image/image.js

@@ -1,4 +1,3 @@
-import * as React from 'react';
 var __defProp = Object.defineProperty;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;

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

@@ -1,4 +1,3 @@
-import * as React from 'react';
 const componentInfo = {
   name: "Raw:Img",
   hideFromInsertMenu: true,

package/src/blocks/img/img.js

@@ -28,7 +28,7 @@ function ImgComponent(props) {
     },
     key: isEditing() && props.imgSrc || "default-key",
     alt: props.altText,
-    src: props.imgSrc
+    src: props.imgSrc || props.image
   }));
 }
 export {

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

@@ -1,4 +1,3 @@
-import * as React from 'react';
 const componentInfo = {
   name: "Form:Input",
   builtIn: true,

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

@@ -1,4 +1,3 @@
-import * as React from 'react';
 const componentInfo = {
   name: "Builder:RawText",
   hideFromInsertMenu: true,

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

@@ -1,4 +1,3 @@
-import * as React from 'react';
 const componentInfo = {
   name: "Core:Section",
   static: true,

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

@@ -1,4 +1,3 @@
-import * as React from 'react';
 const componentInfo = {
   name: "Form:Select",
   builtIn: true,

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

@@ -1,4 +1,3 @@
-import * as React from 'react';
 const componentInfo = {
   name: "Form:SubmitButton",
   builtIn: true,

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

@@ -1,4 +1,3 @@
-import * as React from 'react';
 const componentInfo = {
   name: "Symbol",
   noWrap: true,

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

@@ -1,4 +1,3 @@
-import * as React from 'react';
 const componentInfo = {
   name: "Text",
   static: true,

package/src/blocks/text/text.js

@@ -1,4 +1,3 @@
-import * as React from 'react';
 var __defProp = Object.defineProperty;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;

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

@@ -1,4 +1,3 @@
-import * as React from 'react';
 const componentInfo = {
   name: "Form:TextArea",
   builtIn: true,

package/src/blocks/util.js

@@ -0,0 +1,7 @@
+function markSerializable(fn) {
+  fn.__qwik_serializable__ = true;
+  return fn;
+}
+export {
+  markSerializable
+};

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

@@ -1,4 +1,3 @@
-import * as React from 'react';
 const componentInfo = {
   name: "Video",
   canHaveChildren: true,

package/src/blocks/video/video.js

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { View } from "react-native";
 import ReactVideo from "react-native-video";
 function Video(props) {

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

@@ -1,18 +1,16 @@
 import * as React from "react";
-import { useContext } from "react";
+import { getMaxWidthQueryForSize } from "../../constants/device-sizes.js";
 import { TARGET } from "../../constants/target.js";
-import BuilderContext from "../../context/builder.context";
 import { getProcessedBlock } from "../../functions/get-processed-block.js";
-import RenderInlinedStyles from "../render-inlined-styles.js";
 import { convertStyleMaptoCSS } from "../../helpers/css.js";
-import { getMaxWidthQueryForSize } from "../../constants/device-sizes.js";
+import RenderInlinedStyles from "../render-inlined-styles.js";
 function BlockStyles(props) {
   function useBlock() {
     return getProcessedBlock({
       block: props.block,
-      state: builderContext.state,
-      context: builderContext.context,
-      evaluateBindings: true
+      state: props.context.state,
+      context: props.context.context,
+      shouldEvaluateBindings: true
     });
   }
   function css() {
@@ -30,7 +28,6 @@ function BlockStyles(props) {
           }` : ""}
     }`;
   }
-  const builderContext = useContext(BuilderContext);
   return /* @__PURE__ */ React.createElement(React.Fragment, null, TARGET === "vue2" || TARGET === "vue3" || TARGET === "svelte" ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(RenderInlinedStyles, {
     styles: css()
   })) : null);

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

@@ -1,4 +1,3 @@
-import * as React from 'react';
 const EMPTY_HTML_ELEMENTS = [
   "area",
   "base",

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

@@ -30,8 +30,6 @@ var __objRest = (source, exclude) => {
   return target;
 };
 import * as React from "react";
-import { useContext } from "react";
-import BuilderContext from "../../context/builder.context";
 import { getBlockActions } from "../../functions/get-block-actions.js";
 import { getBlockComponentOptions } from "../../functions/get-block-component-options.js";
 import { getBlockProperties } from "../../functions/get-block-properties.js";
@@ -49,14 +47,14 @@ function RenderBlock(props) {
     var _a2;
     const componentName = (_a2 = getProcessedBlock({
       block: props.block,
-      state: builderContext.state,
-      context: builderContext.context,
-      evaluateBindings: false
+      state: props.context.state,
+      context: props.context.context,
+      shouldEvaluateBindings: false
     }).component) == null ? void 0 : _a2.name;
     if (!componentName) {
       return null;
     }
-    const ref = builderContext.registeredComponents[componentName];
+    const ref = props.context.registeredComponents[componentName];
     if (!ref) {
       console.warn(`
         Could not find a registered component named "${componentName}". 
@@ -84,16 +82,16 @@ function RenderBlock(props) {
   function useBlock() {
     return repeatItemData() ? props.block : getProcessedBlock({
       block: props.block,
-      state: builderContext.state,
-      context: builderContext.context,
-      evaluateBindings: true
+      state: props.context.state,
+      context: props.context.context,
+      shouldEvaluateBindings: true
     });
   }
   function attributes() {
     return __spreadProps(__spreadValues(__spreadValues({}, getBlockProperties(useBlock())), getBlockActions({
       block: useBlock(),
-      state: builderContext.state,
-      context: builderContext.context
+      state: props.context.state,
+      context: props.context.context
     })), {
       style: getBlockStyles(useBlock())
     });
@@ -111,7 +109,8 @@ function RenderBlock(props) {
     return {
       blockChildren: children(),
       componentRef: componentRef(),
-      componentOptions: componentOptions()
+      componentOptions: componentOptions(),
+      context: props.context
     };
   }
   function children() {
@@ -129,8 +128,8 @@ function RenderBlock(props) {
     }
     const itemsArray = evaluate({
       code: repeat.collection,
-      state: builderContext.state,
-      context: builderContext.context
+      state: props.context.state,
+      context: props.context.context
     });
     if (!Array.isArray(itemsArray)) {
       return void 0;
@@ -138,8 +137,8 @@ function RenderBlock(props) {
     const collectionName = repeat.collection.split(".").pop();
     const itemNameToUse = repeat.itemName || (collectionName ? collectionName + "Item" : "item");
     const repeatArray = itemsArray.map((item, index) => ({
-      context: __spreadProps(__spreadValues({}, builderContext), {
-        state: __spreadProps(__spreadValues({}, builderContext.state), {
+      context: __spreadProps(__spreadValues({}, props.context), {
+        state: __spreadProps(__spreadValues({}, props.context.state), {
           $index: index,
           $item: item,
           [itemNameToUse]: item,
@@ -150,7 +149,6 @@ function RenderBlock(props) {
     }));
     return repeatArray;
   }
-  const builderContext = useContext(BuilderContext);
   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()), repeatItemData() ? /* @__PURE__ */ React.createElement(React.Fragment, null, (_a = repeatItemData()) == null ? void 0 : _a.map((data, index) => /* @__PURE__ */ React.createElement(RenderRepeatedBlock, {
     key: index,
@@ -158,11 +156,15 @@ function RenderBlock(props) {
     block: data.block
   }))) : null, !repeatItemData() ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(RenderComponent, __spreadValues({}, renderComponentProps()))) : null, (_b = childrenWithoutParentComponent()) == null ? void 0 : _b.map((child) => /* @__PURE__ */ React.createElement(RenderBlock, {
     key: "render-block-" + child.id,
-    block: child
+    block: child,
+    context: props.context
   })), (_c = childrenWithoutParentComponent()) == null ? void 0 : _c.map((child) => /* @__PURE__ */ React.createElement(BlockStyles, {
     key: "block-style-" + child.id,
-    block: child
-  })))) : /* @__PURE__ */ React.createElement(TagNameRef, __spreadValues({}, attributes()))) : /* @__PURE__ */ React.createElement(RenderComponent, __spreadValues({}, renderComponentProps())));
+    block: child,
+    context: props.context
+  })))) : /* @__PURE__ */ React.createElement(TagNameRef, __spreadValues({}, attributes()))) : /* @__PURE__ */ React.createElement(RenderComponent, __spreadProps(__spreadValues({}, renderComponentProps()), {
+    context: props.context
+  })));
 }
 export {
   RenderBlock as default

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

@@ -22,10 +22,12 @@ function RenderComponent(props) {
   const ComponentRefRef = props.componentRef;
   return /* @__PURE__ */ React.createElement(React.Fragment, null, props.componentRef ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(ComponentRefRef, __spreadValues({}, props.componentOptions), (_a = props.blockChildren) == null ? void 0 : _a.map((child) => /* @__PURE__ */ React.createElement(RenderBlock, {
     key: "render-block-" + child.id,
-    block: child
+    block: child,
+    context: props.context
   })), (_b = props.blockChildren) == null ? void 0 : _b.map((child) => /* @__PURE__ */ React.createElement(BlockStyles, {
     key: "block-style-" + child.id,
-    block: child
+    block: child,
+    context: props.context
   })))) : null);
 }
 export {

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

@@ -21,7 +21,8 @@ function RenderRepeatedBlock(props) {
       }
     }
   }, /* @__PURE__ */ React.createElement(RenderBlock, {
-    block: props.block
+    block: props.block,
+    context: props.repeatContext
   }));
 }
 export {

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

@@ -1 +0,0 @@
-import * as React from 'react';

package/src/components/render-blocks.js

@@ -1,5 +1,7 @@
 import * as React from "react";
 import { View, StyleSheet } from "react-native";
+import { useContext } from "react";
+import BuilderContext from "../context/builder.context";
 import { isEditing } from "../functions/is-editing.js";
 import BlockStyles from "./render-block/block-styles.js";
 import RenderBlock from "./render-block/render-block.js";
@@ -33,6 +35,7 @@ function RenderBlocks(props) {
       }, "*");
     }
   }
+  const builderContext = useContext(BuilderContext);
   return /* @__PURE__ */ React.createElement(View, {
     "builder-path": props.path,
     "builder-parent-id": props.parent,
@@ -44,10 +47,12 @@ function RenderBlocks(props) {
     style: styles.view1
   }, props.blocks ? /* @__PURE__ */ React.createElement(React.Fragment, null, (_a = props.blocks) == null ? void 0 : _a.map((block) => /* @__PURE__ */ React.createElement(RenderBlock, {
     key: "render-block-" + block.id,
-    block
+    block,
+    context: builderContext
   }))) : null, props.blocks ? /* @__PURE__ */ React.createElement(React.Fragment, null, (_b = props.blocks) == null ? void 0 : _b.map((block) => /* @__PURE__ */ React.createElement(BlockStyles, {
     key: "block-style-" + block.id,
-    block
+    block,
+    context: builderContext
   }))) : null);
 }
 const styles = StyleSheet.create({

package/src/components/render-content/index.js

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { default as default2 } from "./render-content.js";
 export {
   default2 as default

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

@@ -39,7 +39,7 @@ var __async = (__this, __arguments, generator) => {
 };
 import * as React from "react";
 import { View } from "react-native";
-import { useState, useEffect } from "react";
+import { useState, useRef, useEffect } from "react";
 import { getDefaultRegisteredComponents } from "../../constants/builder-registered-components.js";
 import { TARGET } from "../../constants/target.js";
 import BuilderContext from "../../context/builder.context";
@@ -56,8 +56,14 @@ import {
 import { track } from "../../functions/track.js";
 import RenderBlocks from "../render-blocks.js";
 import RenderContentStyles from "./components/render-styles.js";
+import {
+  registerInsertMenu,
+  setupBrowserForEditing
+} from "../../scripts/init-editing.js";
 function RenderContent(props) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
+  const elementRef = useRef(null);
+  const [forceReRenderCount, setForceReRenderCount] = useState(() => 0);
   function useContent() {
     var _a2;
     const mergedContent = __spreadProps(__spreadValues(__spreadValues({}, props.content), overrideContent), {
@@ -67,6 +73,9 @@ function RenderContent(props) {
   }
   const [overrideContent, setOverrideContent] = useState(() => null);
   const [update, setUpdate] = useState(() => 0);
+  function canTrackToUse() {
+    return props.canTrack || true;
+  }
   const [overrideState, setOverrideState] = useState(() => ({}));
   function contentState() {
     var _a2, _b2;
@@ -118,9 +127,12 @@ function RenderContent(props) {
     return {};
   }
   function onClick(_event) {
-    if (useContent() && props.canTrack !== false) {
-      track("click", {
-        contentId: useContent().id
+    if (useContent()) {
+      track({
+        type: "click",
+        canTrack: canTrackToUse(),
+        contentId: useContent().id,
+        orgId: props.apiKey
       });
     }
   }
@@ -173,6 +185,9 @@ function RenderContent(props) {
   useEffect(() => {
     if (isBrowser()) {
       if (isEditing()) {
+        setForceReRenderCount(forceReRenderCount + 1);
+        registerInsertMenu();
+        setupBrowserForEditing();
         Object.values(allRegisteredComponents()).forEach((registeredComponent) => {
           var _a2;
           const message = createRegisterComponentMessage(registeredComponent);
@@ -181,9 +196,12 @@ function RenderContent(props) {
         window.addEventListener("message", processMessage);
         window.addEventListener("builder:component:stateChangeListenerActivated", emitStateUpdate);
       }
-      if (useContent() && props.canTrack !== false) {
-        track("impression", {
-          contentId: useContent().id
+      if (useContent()) {
+        track({
+          type: "impression",
+          canTrack: canTrackToUse(),
+          contentId: useContent().id,
+          orgId: props.apiKey
         });
       }
       if (isPreviewing()) {
@@ -243,13 +261,15 @@ function RenderContent(props) {
       }
     }
   }, useContent() ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(View, {
+    ref: elementRef,
     onClick: (event) => onClick(event),
     "builder-content-id": (_e = useContent == null ? void 0 : useContent()) == null ? void 0 : _e.id
   }, shouldRenderContentStyles() ? /* @__PURE__ */ React.createElement(RenderContentStyles, {
     cssCode: (_g = (_f = useContent == null ? void 0 : useContent()) == null ? void 0 : _f.data) == null ? void 0 : _g.cssCode,
     customFonts: (_i = (_h = useContent == null ? void 0 : useContent()) == null ? void 0 : _h.data) == null ? void 0 : _i.customFonts
   }) : null, /* @__PURE__ */ React.createElement(RenderBlocks, {
-    blocks: (_k = (_j = useContent == null ? void 0 : useContent()) == null ? void 0 : _j.data) == null ? void 0 : _k.blocks
+    blocks: (_k = (_j = useContent == null ? void 0 : useContent()) == null ? void 0 : _j.data) == null ? void 0 : _k.blocks,
+    key: forceReRenderCount
   }))) : null);
 }
 export {

package/src/constants/builder-registered-components.js

@@ -1,4 +1,3 @@
-import * as React from 'react';
 var __defProp = Object.defineProperty;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;

package/src/constants/device-sizes.js

@@ -1,4 +1,3 @@
-import * as React from 'react';
 const SIZES = {
   small: {
     min: 320,

package/src/constants/target.js

@@ -1,4 +1,3 @@
-import * as React from 'react';
 const TARGET = "reactNative";
 export {
   TARGET

package/src/functions/camel-to-kebab-case.js

@@ -1,4 +1,3 @@
-import * as React from 'react';
 const camelToKebabCase = (string) => string.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, "$1-$2").toLowerCase();
 export {
   camelToKebabCase

package/src/functions/convert-style-object.js

@@ -1,4 +1,3 @@
-import * as React from 'react';
 const convertStyleObject = (obj) => {
   return obj;
 };

package/src/functions/evaluate.js

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { isBrowser } from "./is-browser.js";
 import { isEditing } from "./is-editing.js";
 function evaluate({

package/src/functions/event-handler-name.js

@@ -1,4 +1,3 @@
-import * as React from 'react';
 function capitalizeFirstLetter(string) {
   return string.charAt(0).toUpperCase() + string.slice(1);
 }

package/src/functions/get-block-actions.js

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { evaluate } from "./evaluate.js";
 import { getEventHandlerName } from "./event-handler-name.js";
 function getBlockActions(options) {