@builder.io/sdk-react-native 0.0.1-44 → 0.0.1-49

package/CHANGELOG.md

@@ -0,0 +1,13 @@
+### UPCOMING
+
+- Add `getBuilderSearchParams` helper export to easily view current drafts on your production site.
+
+### 0.0.1-44
+
+Changes:
+
+- Fixes `getAllContent` to traverse all nested data from symbols/references https://github.com/BuilderIO/builder/pull/718
+- Fixes `getContent` (broken due to missing URL polyfill) https://github.com/BuilderIO/builder/pull/880
+- Strips invalid `this.` left from Mitosis compilation https://github.com/BuilderIO/builder/pull/717/commits/b1947c86db769f74a7408965dac70f22dfcc538d
+- Fix identification of react-native environment https://github.com/BuilderIO/builder/pull/717/commits/9d2a207ceca39bf83d5bbdc4bd67351e86105d78
+- Fix Aspect Ratio handling (this adds support for Pixel Tracking) https://github.com/BuilderIO/builder/pull/749, preceeded by https://github.com/BuilderIO/builder/pull/687

package/package.json

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

package/src/blocks/columns.js

@@ -54,7 +54,6 @@ function Columns(props) {
   return /* @__PURE__ */ React.createElement(
     View,
     {
-      className: 'builder-columns',
       style: styles.view1,
     },
     (_a = props.columns) == null
@@ -63,7 +62,6 @@ function Columns(props) {
           /* @__PURE__ */ React.createElement(
             View,
             {
-              className: 'builder-column',
               style: styles.view2,
             },
             /* @__PURE__ */ React.createElement(RenderBlocks, {

package/src/blocks/columns.lite.tsx

@@ -53,9 +53,9 @@ export default function Columns(props) {
   }
 
   return (
-    <View className="builder-columns" style={styles.view1}>
+    <View style={styles.view1}>
       {props.columns?.map((column) => (
-        <View className="builder-column" style={styles.view2}>
+        <View style={styles.view2}>
           <RenderBlocks blocks={column.blocks} />
         </View>
       ))}

package/src/blocks/custom-code.js

@@ -47,8 +47,6 @@ function CustomCode(props) {
   }, []);
   return /* @__PURE__ */ React.createElement(View, {
     ref: elem,
-    className:
-      'builder-custom-code' + (props.replaceNodes ? ' replace-nodes' : ''),
     dangerouslySetInnerHTML: { __html: 'props.code' },
   });
 }

package/src/blocks/custom-code.lite.tsx

@@ -55,13 +55,5 @@ export default function CustomCode(props) {
     findAndRunScripts();
   }, []);
 
-  return (
-    <View
-      ref={elem}
-      className={
-        'builder-custom-code' + (props.replaceNodes ? ' replace-nodes' : '')
-      }
-      dangerouslySetInnerHTML={{ __html: 'props.code' }}
-    />
-  );
+  return <View ref={elem} dangerouslySetInnerHTML={{ __html: 'props.code' }} />;
 }

package/src/blocks/embed.js

@@ -46,7 +46,6 @@ function Embed(props) {
     findAndRunScripts();
   }, []);
   return /* @__PURE__ */ React.createElement(View, {
-    className: 'builder-embed',
     ref: elem,
     dangerouslySetInnerHTML: { __html: 'props.content' },
   });

package/src/blocks/embed.lite.tsx

@@ -56,10 +56,6 @@ export default function Embed(props) {
   }, []);
 
   return (
-    <View
-      className="builder-embed"
-      ref={elem}
-      dangerouslySetInnerHTML={{ __html: 'props.content' }}
-    />
+    <View ref={elem} dangerouslySetInnerHTML={{ __html: 'props.content' }} />
   );
 }

package/src/blocks/form.js

@@ -284,7 +284,6 @@ function FormComponent(props) {
           /* @__PURE__ */ React.createElement(
             View,
             {
-              className: 'builder-form-error-text',
               style: styles.view1,
             },
             ' ',

package/src/blocks/form.lite.tsx

@@ -231,7 +231,7 @@ export default function FormComponent(props) {
       ) : null}{' '}
       {submissionState() === 'error' && responseData ? (
         <>
-          <View className="builder-form-error-text" style={styles.view1}>
+          <View style={styles.view1}>
             {' '}
             <Text>{JSON.stringify(responseData, null, 2)}</Text>{' '}
           </View>

package/src/blocks/image.lite.tsx

@@ -10,7 +10,6 @@ export default function Image(props) {
           alt={props.altText}
           aria-role={props.altText ? 'presentation' : undefined}
           style={styles.view2}
-          className={'builder-image' + (props.class ? ' ' + props.class : '')}
           src={props.image}
           srcset={props.srcset}
           sizes={props.sizes}
@@ -21,7 +20,7 @@ export default function Image(props) {
 
       {props.aspectRatio &&
       !(props.fitContent && props.builderBlock?.children?.length) ? (
-        <View className="builder-image-sizer" style={styles.view3}>
+        <View style={styles.view3}>
           <Text> </Text>
         </View>
       ) : null}

package/src/blocks/raw-text.js

@@ -3,11 +3,7 @@ import { registerComponent } from '../functions/register-component';
 import * as React from 'react';
 import { View } from 'react-native';
 function RawText(props) {
-  var _a, _b;
   return /* @__PURE__ */ React.createElement(View, {
-    className:
-      ((_a = props.attributes) == null ? void 0 : _a.class) ||
-      ((_b = props.attributes) == null ? void 0 : _b.className),
     dangerouslySetInnerHTML: { __html: "props.text || ''" },
   });
 }

package/src/blocks/raw-text.lite.tsx

@@ -2,10 +2,5 @@ import * as React from 'react';
 import { View, StyleSheet, Image, Text } from 'react-native';
 
 export default function RawText(props) {
-  return (
-    <View
-      className={props.attributes?.class || props.attributes?.className}
-      dangerouslySetInnerHTML={{ __html: "props.text || ''" }}
-    />
-  );
+  return <View dangerouslySetInnerHTML={{ __html: "props.text || ''" }} />;
 }

package/src/blocks/symbol.js

@@ -8,9 +8,7 @@ function Symbol(props) {
   const builderContext = useContext(BuilderContext);
   return /* @__PURE__ */ React.createElement(
     View,
-    {
-      className: 'builder-symbol',
-    },
+    null,
     /* @__PURE__ */ React.createElement(RenderContent, {
       context: builderContext.context,
       data: (_a = props.symbol) == null ? void 0 : _a.data,

package/src/blocks/symbol.lite.tsx

@@ -8,7 +8,7 @@ export default function Symbol(props) {
   const builderContext = useContext(BuilderContext);
 
   return (
-    <View className="builder-symbol">
+    <View>
       <RenderContent
         context={builderContext.context}
         data={props.symbol?.data}

package/src/blocks/text.lite.tsx

@@ -2,10 +2,5 @@ import * as React from 'react';
 import { View, StyleSheet, Image, Text } from 'react-native';
 
 export default function Text(props) {
-  return (
-    <View
-      className="builder-text"
-      dangerouslySetInnerHTML={{ __html: 'props.text' }}
-    />
-  );
+  return <View dangerouslySetInnerHTML={{ __html: 'props.text' }} />;
 }

package/src/components/render-blocks.js

@@ -3,13 +3,22 @@ import { View, StyleSheet } from 'react-native';
 import { isEditing } from '../functions/is-editing';
 import RenderBlock from './render-block';
 function RenderBlocks(props) {
-  var _a, _b;
+  var _a;
+  function className() {
+    var _a2;
+    return (
+      'builder-blocks' +
+      (!((_a2 = props.blocks) == null ? void 0 : _a2.length)
+        ? ' no-blocks'
+        : '')
+    );
+  }
   function onClick() {
-    var _a2, _b2;
+    var _a2, _b;
     if (isEditing() && !((_a2 = props.blocks) == null ? void 0 : _a2.length)) {
-      (_b2 = window.parent) == null
+      (_b = window.parent) == null
         ? void 0
-        : _b2.postMessage(
+        : _b.postMessage(
             {
               type: 'builder.clickEmptyBlocks',
               data: {
@@ -22,11 +31,11 @@ function RenderBlocks(props) {
     }
   }
   function onMouseEnter() {
-    var _a2, _b2;
+    var _a2, _b;
     if (isEditing() && !((_a2 = props.blocks) == null ? void 0 : _a2.length)) {
-      (_b2 = window.parent) == null
+      (_b = window.parent) == null
         ? void 0
-        : _b2.postMessage(
+        : _b.postMessage(
             {
               type: 'builder.hoverEmptyBlocks',
               data: {
@@ -43,22 +52,20 @@ function RenderBlocks(props) {
     {
       'builder-path': props.path,
       'builder-parent-id': props.parent,
-      onClick: (event) => onClick,
-      onMouseEnter: (event) => onMouseEnter,
-      className:
-        'builder-blocks' +
-        (!((_a = props.blocks) == null ? void 0 : _a.length)
-          ? ' no-blocks'
-          : ''),
+      dataSet: {
+        class: className(),
+      },
+      onClick: (event) => onClick(),
+      onMouseEnter: (event) => onMouseEnter(),
       style: styles.view1,
     },
     props.blocks
       ? /* @__PURE__ */ React.createElement(
           React.Fragment,
           null,
-          (_b = props.blocks) == null
+          (_a = props.blocks) == null
             ? void 0
-            : _b.map((block) =>
+            : _a.map((block) =>
                 /* @__PURE__ */ React.createElement(RenderBlock, {
                   block,
                 })

package/src/components/render-blocks.lite.tsx

@@ -4,6 +4,10 @@ import { isEditing } from '../functions/is-editing';
 import RenderBlock from './render-block.lite';
 
 export default function RenderBlocks(props) {
+  function className() {
+    return 'builder-blocks' + (!props.blocks?.length ? ' no-blocks' : '');
+  }
+
   function onClick() {
     if (isEditing() && !props.blocks?.length) {
       window.parent?.postMessage(
@@ -38,9 +42,11 @@ export default function RenderBlocks(props) {
     <View
       builder-path={props.path}
       builder-parent-id={props.parent}
-      onClick={(event) => onClick}
-      onMouseEnter={(event) => onMouseEnter}
-      className={'builder-blocks' + (!props.blocks?.length ? ' no-blocks' : '')}
+      dataSet={{
+        class: className(),
+      }}
+      onClick={(event) => onClick()}
+      onMouseEnter={(event) => onMouseEnter()}
       style={styles.view1}
     >
       {props.blocks ? (

package/src/components/render-content.js

@@ -2,7 +2,6 @@ import * as React from 'react';
 import { View, Text } from 'react-native';
 import { useState, useEffect } from 'react';
 import { isBrowser } from '../functions/is-browser';
-import RenderBlock from './render-block';
 import BuilderContext from '../context/builder.context';
 import { track } from '../functions/track';
 import { isReactNative } from '../functions/is-react-native';
@@ -10,8 +9,13 @@ import { isEditing } from '../functions/is-editing';
 import { isPreviewing } from '../functions/is-previewing';
 import { previewingModelName } from '../functions/previewing-model-name';
 import { getContent } from '../functions/get-content';
+import {
+  convertSearchParamsToQueryObject,
+  getBuilderSearchParams,
+} from '../functions/get-builder-search-params';
+import RenderBlocks from './render-blocks';
 function RenderContent(props) {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _i;
+  var _a, _b, _c, _d, _e, _f, _g, _h;
   function useContent() {
     return overrideContent || props.content;
   }
@@ -108,20 +112,15 @@ function RenderContent(props) {
       }
       if (isPreviewing()) {
         if (props.model && previewingModelName() === props.model) {
-          const options = {};
           const currentUrl = new URL(location.href);
           const apiKey = currentUrl.searchParams.get('apiKey');
           if (apiKey) {
-            const builderPrefix = 'builder.';
-            currentUrl.searchParams.forEach((value, key) => {
-              if (key.startsWith(builderPrefix)) {
-                options[key.replace(builderPrefix, '')] = value;
-              }
-            });
             getContent({
               model: props.model,
               apiKey,
-              options,
+              options: getBuilderSearchParams(
+                convertSearchParamsToQueryObject(currentUrl.searchParams)
+              ),
             }).then((content) => {
               if (content) {
                 setOverrideContent(content);
@@ -132,6 +131,13 @@ function RenderContent(props) {
       }
     }
   }, []);
+  useEffect(() => {
+    return () => {
+      if (isBrowser()) {
+        window.removeEventListener('message', processMessage);
+      }
+    };
+  }, []);
   return /* @__PURE__ */ React.createElement(
     BuilderContext.Provider,
     {
@@ -197,20 +203,15 @@ function RenderContent(props) {
                   )
                 )
               : null,
-            (_i =
-              (_h =
-                (_g = useContent == null ? void 0 : useContent()) == null
+            /* @__PURE__ */ React.createElement(RenderBlocks, {
+              blocks:
+                (_h =
+                  (_g = useContent == null ? void 0 : useContent()) == null
+                    ? void 0
+                    : _g.data) == null
                   ? void 0
-                  : _g.data) == null
-                ? void 0
-                : _h.blocks) == null
-              ? void 0
-              : _i.map((block) =>
-                  /* @__PURE__ */ React.createElement(RenderBlock, {
-                    key: block.id,
-                    block,
-                  })
-                )
+                  : _h.blocks,
+            })
           )
         )
       : null

package/src/components/render-content.lite.tsx

@@ -2,7 +2,6 @@ import * as React from 'react';
 import { View, StyleSheet, Image, Text } from 'react-native';
 import { useState, useContext, useEffect } from 'react';
 import { isBrowser } from '../functions/is-browser';
-import RenderBlock from './render-block.lite';
 import BuilderContext from '../context/builder.context.lite';
 import { track } from '../functions/track';
 import { ifTarget } from '../functions/if-target';
@@ -12,6 +11,11 @@ import { isEditing } from '../functions/is-editing';
 import { isPreviewing } from '../functions/is-previewing';
 import { previewingModelName } from '../functions/previewing-model-name';
 import { getContent } from '../functions/get-content';
+import {
+  convertSearchParamsToQueryObject,
+  getBuilderSearchParams,
+} from '../functions/get-builder-search-params';
+import RenderBlocks from './render-blocks.lite';
 
 export default function RenderContent(props) {
   function useContent() {
@@ -126,33 +130,35 @@ export default function RenderContent(props) {
 
       if (isPreviewing()) {
         if (props.model && previewingModelName() === props.model) {
-          const options = {};
           const currentUrl = new URL(location.href);
           const apiKey = currentUrl.searchParams.get('apiKey');
 
           if (apiKey) {
-            const builderPrefix = 'builder.';
-            currentUrl.searchParams.forEach((value, key) => {
-              if (key.startsWith(builderPrefix)) {
-                options[key.replace(builderPrefix, '')] = value;
-              }
-            }); // TODO: need access to API key
-
             getContent({
               model: props.model,
               apiKey,
-              options,
+              options: getBuilderSearchParams(
+                convertSearchParamsToQueryObject(currentUrl.searchParams)
+              ),
             }).then((content) => {
               if (content) {
                 setOverrideContent(content);
               }
             });
-          } // TODO: fetch content and override. Forward all builder.* params
+          }
         }
       }
     }
   }, []);
 
+  useEffect(() => {
+    return () => {
+      if (isBrowser()) {
+        window.removeEventListener('message', processMessage);
+      }
+    };
+  }, []);
+
   return (
     <BuilderContext.Provider
       value={{
@@ -191,9 +197,7 @@ export default function RenderContent(props) {
               </View>
             ) : null}
 
-            {useContent?.()?.data?.blocks?.map((block) => (
-              <RenderBlock key={block.id} block={block} />
-            ))}
+            <RenderBlocks blocks={useContent?.()?.data?.blocks} />
           </View>
         </>
       ) : null}

package/src/functions/get-builder-search-params/fn.test.js

@@ -0,0 +1,18 @@
+import * as React from 'react';
+import { describe, test, expect } from '@jest/globals';
+import { getBuilderSearchParams, convertSearchParamsToQueryObject } from '.';
+const querystring =
+  'someotherValue=jklsjfdal&abc=klfdjklgfds&builder.cachebust=true&builder.preview=page&builder.noCache=true&__builder_editing__=true&builder.overrides.page=037948e52eaf4743afed464f02c70da4&builder.overrides.037948e52eaf4743afed464f02c70da4=037948e52eaf4743afed464f02c70da4&builder.overrides.page%3A%2F=037948e52eaf4743afed464f02c70da4&preview_theme_id=128854393017';
+const url = new URL(`localhost:3000/about-us?${querystring}`);
+describe('Get Builder SearchParams', () => {
+  test('correctly converts URLSearchParams to object', () => {
+    const output = convertSearchParamsToQueryObject(url.searchParams);
+    expect(output).toMatchSnapshot();
+  });
+  test('correctly extracts all builder params from a query object', () => {
+    const output = getBuilderSearchParams(
+      convertSearchParamsToQueryObject(url.searchParams)
+    );
+    expect(output).toMatchSnapshot();
+  });
+});

package/src/functions/get-builder-search-params/index.js

@@ -0,0 +1,20 @@
+import * as React from 'react';
+const BUILDER_SEARCHPARAMS_PREFIX = 'builder.';
+const convertSearchParamsToQueryObject = (searchParams) => {
+  const options = {};
+  searchParams.forEach((value, key) => {
+    options[key] = value;
+  });
+  return options;
+};
+const getBuilderSearchParams = (options) => {
+  const newOptions = {};
+  Object.keys(options).forEach((key) => {
+    if (key.startsWith(BUILDER_SEARCHPARAMS_PREFIX)) {
+      const trimmedKey = key.replace(BUILDER_SEARCHPARAMS_PREFIX, '');
+      newOptions[trimmedKey] = options[key];
+    }
+  });
+  return newOptions;
+};
+export { convertSearchParamsToQueryObject, getBuilderSearchParams };

package/src/functions/get-content/fn.test.js

@@ -0,0 +1,34 @@
+import * as React from 'react';
+import { describe, test, expect } from '@jest/globals';
+import { generateContentUrl } from '.';
+const testKey = 'YJIGb4i01jvw0SRdL5Bt';
+const testModel = 'page';
+const testId = 'c1b81bab59704599b997574eb0736def';
+const options = {
+  cachebust: 'true',
+  noCache: 'true',
+  'overrides.037948e52eaf4743afed464f02c70da4':
+    '037948e52eaf4743afed464f02c70da4',
+  'overrides.page': '037948e52eaf4743afed464f02c70da4',
+  'overrides.page:/': '037948e52eaf4743afed464f02c70da4',
+  preview: 'page',
+};
+describe('Generate Content URL', () => {
+  test('generates the proper value for a simple query', () => {
+    const output = generateContentUrl({
+      apiKey: testKey,
+      model: testModel,
+      query: { id: testId },
+    });
+    expect(output).toMatchSnapshot();
+  });
+  test('Handles overrides correctly', () => {
+    const output = generateContentUrl({
+      apiKey: testKey,
+      model: testModel,
+      query: { id: testId },
+      options,
+    });
+    expect(output).toMatchSnapshot();
+  });
+});

package/src/functions/{get-content.js → get-content/index.js}

@@ -47,7 +47,7 @@ var __async = (__this, __arguments, generator) => {
     step((generator = generator.apply(__this, __arguments)).next());
   });
 };
-import { getFetch } from './get-fetch';
+import { getFetch } from '../get-fetch';
 const fetch = getFetch();
 function flatten(object, path = null, separator = '.') {
   return Object.keys(object).reduce((acc, key) => {
@@ -75,78 +75,82 @@ function getContent(options) {
     );
   });
 }
-function getAllContent(options) {
-  return __async(this, null, function* () {
-    const { model, apiKey } = options;
-    const { limit, testGroups, userAttributes, query, noTraverse } =
-      __spreadValues(
-        {
-          limit: 1,
-          userAttributes: null,
-          testGroups: null,
-          noTraverse: false,
-        },
-        options
-      );
-    const url = new URL(
-      `https://cdn.builder.io/api/v2/content/${model}?apiKey=${apiKey}&limit=${limit}&noTraverse=${noTraverse}`
-    );
-    if (options.options) {
-      const flattened = flatten(options.options);
-      for (const key in flattened) {
-        url.searchParams.set(key, String(flattened[key]));
-      }
+const generateContentUrl = (options) => {
+  const {
+    limit = 1,
+    userAttributes,
+    query,
+    noTraverse = false,
+    model,
+    apiKey,
+  } = options;
+  const url = new URL(
+    `https://cdn.builder.io/api/v2/content/${model}?apiKey=${apiKey}&limit=${limit}&noTraverse=${noTraverse}`
+  );
+  if (options.options) {
+    const flattened = flatten(options.options);
+    for (const key in flattened) {
+      url.searchParams.set(key, String(flattened[key]));
     }
-    if (userAttributes) {
-      url.searchParams.set('userAttributes', JSON.stringify(userAttributes));
+  }
+  if (userAttributes) {
+    url.searchParams.set('userAttributes', JSON.stringify(userAttributes));
+  }
+  if (query) {
+    const flattened = flatten({ query });
+    for (const key in flattened) {
+      url.searchParams.set(key, JSON.stringify(flattened[key]));
     }
-    if (query) {
-      const flattened = flatten({ query });
-      for (const key in flattened) {
-        url.searchParams.set(key, JSON.stringify(flattened[key]));
-      }
-    }
-    const content = yield fetch(url.href).then((res) => res.json());
-    if (testGroups) {
-      for (const item of content.results) {
-        if (item.variations && Object.keys(item.variations).length) {
-          const testGroup = testGroups[item.id];
-          const variationValue = item.variations[testGroup];
-          if (testGroup && variationValue) {
-            item.data = variationValue.data;
-            item.testVariationId = variationValue.id;
-            item.testVariationName = variationValue.name;
-          } else {
-            let n = 0;
-            const random = Math.random();
-            let set = false;
-            for (const id in item.variations) {
-              const variation = item.variations[id];
-              const testRatio = variation.testRatio;
-              n += testRatio;
-              if (random < n) {
-                const variationName =
-                  variation.name ||
-                  (variation.id === item.id ? 'Default variation' : '');
-                set = true;
-                Object.assign(item, {
-                  data: variation.data,
-                  testVariationId: variation.id,
-                  testVariationName: variationName,
-                });
-              }
-            }
-            if (!set) {
-              Object.assign(item, {
-                testVariationId: item.id,
-                testVariationName: 'Default',
-              });
-            }
+  }
+  return url;
+};
+const handleABTesting = (content, testGroups) => {
+  for (const item of content.results) {
+    if (item.variations && Object.keys(item.variations).length) {
+      const testGroup = testGroups[item.id];
+      const variationValue = item.variations[testGroup];
+      if (testGroup && variationValue) {
+        item.data = variationValue.data;
+        item.testVariationId = variationValue.id;
+        item.testVariationName = variationValue.name;
+      } else {
+        let n = 0;
+        const random = Math.random();
+        let set = false;
+        for (const id in item.variations) {
+          const variation = item.variations[id];
+          const testRatio = variation.testRatio;
+          n += testRatio;
+          if (random < n) {
+            const variationName =
+              variation.name ||
+              (variation.id === item.id ? 'Default variation' : '');
+            set = true;
+            Object.assign(item, {
+              data: variation.data,
+              testVariationId: variation.id,
+              testVariationName: variationName,
+            });
           }
         }
+        if (!set) {
+          Object.assign(item, {
+            testVariationId: item.id,
+            testVariationName: 'Default',
+          });
+        }
       }
     }
+  }
+};
+function getAllContent(options) {
+  return __async(this, null, function* () {
+    const url = generateContentUrl(options);
+    const content = yield fetch(url.href).then((res) => res.json());
+    if (options.testGroups) {
+      handleABTesting(content, options.testGroups);
+    }
     return content;
   });
 }
-export { getAllContent, getContent };
+export { generateContentUrl, getAllContent, getContent };

package/src/functions/get-processed-block.test.js

@@ -2,7 +2,9 @@ import * as React from 'react';
 import { expect, test } from '@jest/globals';
 import { getProcessedBlock } from './get-processed-block';
 test('Can process bindings', () => {
+  var _a, _b, _c, _d, _e, _f;
   const block = {
+    '@type': '@builder.io/sdk:Element',
     properties: {
       foo: 'bar',
     },
@@ -23,9 +25,19 @@ test('Can process bindings', () => {
     state: { test: 'hello' },
   });
   expect(processed).not.toEqual(block);
-  expect(processed.properties.foo).toEqual('baz');
-  expect(processed.properties.test).toEqual('hello');
-  expect(processed.properties.block).toEqual('bar');
-  expect(processed.properties.isEditing).toEqual(false);
-  expect(processed.responsiveStyles.large.zIndex).toEqual(2);
+  expect((_a = processed.properties) == null ? void 0 : _a.foo).toEqual('baz');
+  expect((_b = processed.properties) == null ? void 0 : _b.test).toEqual(
+    'hello'
+  );
+  expect((_c = processed.properties) == null ? void 0 : _c.block).toEqual(
+    'bar'
+  );
+  expect((_d = processed.properties) == null ? void 0 : _d.isEditing).toEqual(
+    false
+  );
+  expect(
+    (_f = (_e = processed.responsiveStyles) == null ? void 0 : _e.large) == null
+      ? void 0
+      : _f.zIndex
+  ).toEqual(2);
 });

package/src/index-helpers/blocks-exports.js

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import { default as default2 } from '../blocks/columns';
+import { default as default3 } from '../blocks/image';
+import { default as default4 } from '../blocks/text';
+import { default as default5 } from '../blocks/symbol';
+import { default as default6 } from '../blocks/button';
+import { default as default7 } from '../blocks/section';
+import { default as default8 } from '../blocks/fragment';
+import { default as default9 } from '../components/render-content';
+export {
+  default6 as Button,
+  default2 as Columns,
+  default8 as Fragment,
+  default3 as Image,
+  default9 as RenderContent,
+  default7 as Section,
+  default5 as Symbol,
+  default4 as Text,
+};

package/src/index-helpers/top-of-file.js

@@ -0,0 +1,2 @@
+import * as React from 'react';
+import 'react-native-url-polyfill/auto';

package/src/index.js

@@ -1,29 +1,13 @@
 import * as React from 'react';
-import 'react-native-url-polyfill/auto';
+import('./index-helpers/top-of-file');
 import { isEditing } from './functions/is-editing';
 if (isEditing()) {
   import('./scripts/init-editing');
 }
-import { default as default2 } from './blocks/columns';
-import { default as default3 } from './blocks/image';
-import { default as default4 } from './blocks/text';
-import { default as default5 } from './blocks/symbol';
-import { default as default6 } from './blocks/section';
-import { default as default7 } from './blocks/fragment';
-import { default as default8 } from './components/render-content';
-import { default as default9 } from './blocks/button';
+export * from './index-helpers/blocks-exports';
 export * from './functions/is-editing';
 export * from './functions/register-component';
 export * from './functions/register';
 export * from './functions/set-editor-settings';
 export * from './functions/get-content';
-export {
-  default9 as Button,
-  default2 as Columns,
-  default7 as Fragment,
-  default3 as Image,
-  default8 as RenderContent,
-  default6 as Section,
-  default5 as Symbol,
-  default4 as Text,
-};
+export * from './functions/get-builder-search-params';

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

@@ -1,58 +0,0 @@
-import * as React from 'react';
-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 fetchMock from 'jest-fetch-mock';
-fetchMock.enableMocks();
-import { test, beforeEach, expect } from '@jest/globals';
-import { getContent } from './get-content';
-const testKey = 'YJIGb4i01jvw0SRdL5Bt';
-const testModel = 'page';
-const testId = 'c1b81bab59704599b997574eb0736def';
-beforeEach(() => {});
-test.skip('Get content', () =>
-  __async(void 0, null, function* () {
-    var _a, _b;
-    expect(
-      (_a = yield getContent({
-        apiKey: testKey,
-        model: testModel,
-        query: {
-          id: testId,
-        },
-      })) == null
-        ? void 0
-        : _a.id
-    ).toEqual(testId);
-    expect(
-      (_b = yield getContent({
-        apiKey: testKey,
-        model: testModel,
-        userAttributes: {
-          urlPath: '/test-page',
-        },
-      })) == null
-        ? void 0
-        : _b.id
-    ).toEqual(testId);
-  }));