@builder.io/sdk-react 0.4.4 → 0.5.0

package/dist/{sdk/helpers → helpers}/ab-tests.js

@@ -1,18 +1,27 @@
 import { getCookie, getCookieSync, setCookie } from './cookie.js';
 import { checkIsDefined } from '../helpers/nullable.js';
 import { logger } from './logger.js';
+import { TARGET } from '../constants/target.js';
 const BUILDER_STORE_PREFIX = 'builder.tests';
 const getContentTestKey = (id) => `${BUILDER_STORE_PREFIX}.${id}`;
-const getContentVariationCookie = ({ contentId }) => getCookie({ name: getContentTestKey(contentId), canTrack: true });
-const getContentVariationCookieSync = ({ contentId }) => getCookieSync({ name: getContentTestKey(contentId), canTrack: true });
-const setContentVariationCookie = ({ contentId, value, }) => setCookie({ name: getContentTestKey(contentId), value, canTrack: true });
-const checkIsBuilderContentWithVariations = (item) => checkIsDefined(item.id) &&
-    checkIsDefined(item.variations) &&
-    Object.keys(item.variations).length > 0;
+const getContentVariationCookie = ({ contentId }) => getCookie({
+    name: getContentTestKey(contentId),
+    canTrack: true
+});
+const getContentVariationCookieSync = ({ contentId }) => getCookieSync({
+    name: getContentTestKey(contentId),
+    canTrack: true
+});
+const setContentVariationCookie = ({ contentId, value }) => setCookie({
+    name: getContentTestKey(contentId),
+    value,
+    canTrack: true
+});
+const checkIsBuilderContentWithVariations = (item) => checkIsDefined(item.id) && checkIsDefined(item.variations) && Object.keys(item.variations).length > 0;
 /**
  * Randomly assign a variation to a user
  */
-const getRandomVariationId = ({ id, variations, }) => {
+const getRandomVariationId = ({ id, variations }) => {
     let n = 0;
     const random = Math.random();
     // loop over variations test ratios, incrementing a counter,
@@ -34,31 +43,36 @@ const getAndSetVariantId = (args) => {
     // store variation in cookies/storage
     setContentVariationCookie({
         contentId: args.id,
-        value: randomVariationId,
-    }).catch((err) => {
+        value: randomVariationId
+    }).catch(err => {
         logger.error('could not store A/B test variation: ', err);
     });
     return randomVariationId;
 };
-const getTestFields = ({ item, testGroupId, }) => {
+const getTestFields = ({ item, testGroupId }) => {
     const variationValue = item.variations[testGroupId];
     if (testGroupId === item.id ||
         // handle edge-case where `testGroupId` points to non-existing variation
         !variationValue) {
         return {
             testVariationId: item.id,
-            testVariationName: 'Default',
+            testVariationName: 'Default'
         };
     }
     else {
         return {
             data: variationValue.data,
             testVariationId: variationValue.id,
-            testVariationName: variationValue.name || (variationValue.id === item.id ? 'Default' : ''),
+            testVariationName: variationValue.name || (variationValue.id === item.id ? 'Default' : '')
         };
     }
 };
-export const handleABTestingSync = ({ item, canTrack, }) => {
+export const handleABTestingSync = ({ item, canTrack }) => {
+    /**
+     * We cannot SSR in React-Native.
+     */
+    if (TARGET === 'reactNative')
+        return item;
     if (!canTrack) {
         return item;
     }
@@ -69,19 +83,21 @@ export const handleABTestingSync = ({ item, canTrack, }) => {
         return item;
     }
     const testGroupId = getContentVariationCookieSync({
-        contentId: item.id,
-    }) ||
-        getAndSetVariantId({
-            variations: item.variations,
-            id: item.id,
-        });
-    const variationValue = getTestFields({ item, testGroupId });
+        contentId: item.id
+    }) || getAndSetVariantId({
+        variations: item.variations,
+        id: item.id
+    });
+    const variationValue = getTestFields({
+        item,
+        testGroupId
+    });
     return {
         ...item,
-        ...variationValue,
+        ...variationValue
     };
 };
-export const handleABTesting = async ({ item, canTrack, }) => {
+export const handleABTesting = async ({ item, canTrack }) => {
     if (!canTrack) {
         return item;
     }
@@ -89,16 +105,18 @@ export const handleABTesting = async ({ item, canTrack, }) => {
         return item;
     }
     const cookieValue = await getContentVariationCookie({
-        contentId: item.id,
+        contentId: item.id
+    });
+    const testGroupId = cookieValue || getAndSetVariantId({
+        variations: item.variations,
+        id: item.id
+    });
+    const variationValue = getTestFields({
+        item,
+        testGroupId
     });
-    const testGroupId = cookieValue ||
-        getAndSetVariantId({
-            variations: item.variations,
-            id: item.id,
-        });
-    const variationValue = getTestFields({ item, testGroupId });
     return {
         ...item,
-        ...variationValue,
+        ...variationValue
     };
 };

package/dist/{sdk/helpers → helpers}/canTrack.js

@@ -1,2 +1,2 @@
-import { checkIsDefined } from './nullable';
+import { checkIsDefined } from './nullable.js';
 export const getDefaultCanTrack = (canTrack) => checkIsDefined(canTrack) ? canTrack : true;

package/dist/{sdk/helpers → helpers}/cookie.d.ts

@@ -2,7 +2,7 @@ import type { CanTrack } from '../types/can-track.js';
 type GetCookieArgs = {
     name: string;
 } & CanTrack;
-export declare const getCookieSync: ({ name, canTrack, }: GetCookieArgs) => string | undefined;
+export declare const getCookieSync: ({ name, canTrack }: GetCookieArgs) => string | undefined;
 /**
  * NOTE: This function is `async` because its react-native override is async. Do not remove the `async` keyword!
  * The sync version is only safe to use in code blocks that `react-native` is guaranteed not to not run.
@@ -11,7 +11,7 @@ export declare const getCookie: (args: GetCookieArgs) => Promise<string>;
 /**
  * NOTE: This function is `async` because its react-native override is async. Do not remove the `async` keyword!
  */
-export declare const setCookie: ({ name, value, expires, canTrack, }: {
+export declare const setCookie: ({ name, value, expires, canTrack }: {
     name: string;
     value: string;
     expires?: Date;

package/dist/{sdk/helpers → helpers}/cookie.js

@@ -2,7 +2,7 @@ import { isBrowser } from '../functions/is-browser.js';
 import { logger } from './logger.js';
 import { checkIsDefined } from './nullable.js';
 import { getTopLevelDomain } from './url.js';
-export const getCookieSync = ({ name, canTrack, }) => {
+export const getCookieSync = ({ name, canTrack }) => {
     try {
         if (!canTrack) {
             return undefined;
@@ -11,10 +11,7 @@ export const getCookieSync = ({ name, canTrack, }) => {
          * Extracted from MDN docs
          * https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie#example_2_get_a_sample_cookie_named_test2
          */
-        return document.cookie
-            .split('; ')
-            .find((row) => row.startsWith(`${name}=`))
-            ?.split('=')[1];
+        return document.cookie.split('; ').find(row => row.startsWith(`${name}=`))?.split('=')[1];
     }
     catch (err) {
         logger.warn('[COOKIE] GET error: ', err?.message || err);
@@ -26,40 +23,30 @@ export const getCookieSync = ({ name, canTrack, }) => {
  * The sync version is only safe to use in code blocks that `react-native` is guaranteed not to not run.
  */
 export const getCookie = async (args) => getCookieSync(args);
-const stringifyCookie = (cookie) => cookie
-    .map(([key, value]) => (value ? `${key}=${value}` : key))
-    .filter(checkIsDefined)
-    .join('; ');
-const SECURE_CONFIG = [
-    ['secure', ''],
-    ['SameSite', 'None'],
-];
-const createCookieString = ({ name, value, expires, }) => {
+const stringifyCookie = (cookie) => cookie.map(([key, value]) => value ? `${key}=${value}` : key).filter(checkIsDefined).join('; ');
+const SECURE_CONFIG = [['secure', ''], ['SameSite', 'None']];
+const createCookieString = ({ name, value, expires }) => {
     const secure = isBrowser() ? location.protocol === 'https:' : true;
     const secureObj = secure ? SECURE_CONFIG : [[]];
     // TODO: need to know if secure server side
-    const expiresObj = expires
-        ? [['expires', expires.toUTCString()]]
-        : [[]];
-    const cookieValue = [
-        [name, value],
-        ...expiresObj,
-        ['path', '/'],
-        ['domain', getTopLevelDomain(window.location.hostname)],
-        ...secureObj,
-    ];
+    const expiresObj = expires ? [['expires', expires.toUTCString()]] : [[]];
+    const cookieValue = [[name, value], ...expiresObj, ['path', '/'], ['domain', getTopLevelDomain(window.location.hostname)], ...secureObj];
     const cookie = stringifyCookie(cookieValue);
     return cookie;
 };
 /**
  * NOTE: This function is `async` because its react-native override is async. Do not remove the `async` keyword!
  */
-export const setCookie = async ({ name, value, expires, canTrack, }) => {
+export const setCookie = async ({ name, value, expires, canTrack }) => {
     try {
         if (!canTrack) {
             return;
         }
-        const cookie = createCookieString({ name, value, expires });
+        const cookie = createCookieString({
+            name,
+            value,
+            expires
+        });
         document.cookie = cookie;
     }
     catch (err) {

package/dist/{sdk/helpers → helpers}/css.d.ts

@@ -1,6 +1,6 @@
 export declare const convertStyleMapToCSSArray: (style: Partial<CSSStyleDeclaration>) => string[];
 export declare const convertStyleMapToCSS: (style: Partial<CSSStyleDeclaration>) => string;
-export declare const createCssClass: ({ mediaQuery, className, styles, }: {
+export declare const createCssClass: ({ mediaQuery, className, styles }: {
     mediaQuery?: string;
     className: string;
     styles: Partial<CSSStyleDeclaration>;

package/dist/{sdk/helpers → helpers}/css.js

@@ -12,7 +12,7 @@ export const convertStyleMapToCSSArray = (style) => {
     return cssProps.filter(checkIsDefined);
 };
 export const convertStyleMapToCSS = (style) => convertStyleMapToCSSArray(style).join('\n');
-export const createCssClass = ({ mediaQuery, className, styles, }) => {
+export const createCssClass = ({ mediaQuery, className, styles }) => {
     const cssClass = `.${className} {
     ${convertStyleMapToCSS(styles)}
   }`;

package/dist/{sdk/helpers → helpers}/flatten.js

@@ -7,13 +7,13 @@ export function flatten(object, path = null, separator = '.') {
     return Object.keys(object).reduce((acc, key) => {
         const value = object[key];
         const newPath = [path, key].filter(Boolean).join(separator);
-        const isObject = [
-            typeof value === 'object',
-            value !== null,
-            !(Array.isArray(value) && value.length === 0),
-        ].every(Boolean);
-        return isObject
-            ? { ...acc, ...flatten(value, newPath, separator) }
-            : { ...acc, [newPath]: value };
+        const isObject = [typeof value === 'object', value !== null, !(Array.isArray(value) && value.length === 0)].every(Boolean);
+        return isObject ? {
+            ...acc,
+            ...flatten(value, newPath, separator)
+        } : {
+            ...acc,
+            [newPath]: value
+        };
     }, {});
 }

package/dist/{sdk/helpers → helpers}/localStorage.d.ts

@@ -1,9 +1,9 @@
 import type { CanTrack } from '../types/can-track.js';
 import type { Nullable } from './nullable.js';
-export declare const getLocalStorageItem: ({ key, canTrack, }: {
+export declare const getLocalStorageItem: ({ key, canTrack }: {
     key: string;
 } & CanTrack) => Nullable<string>;
-export declare const setLocalStorageItem: ({ key, canTrack, value, }: {
+export declare const setLocalStorageItem: ({ key, canTrack, value }: {
     key: string;
     value: string;
 } & CanTrack) => void;

package/dist/{sdk/helpers → helpers}/localStorage.js

@@ -1,6 +1,6 @@
 import { isBrowser } from '../functions/is-browser.js';
 const getLocalStorage = () => isBrowser() && typeof localStorage !== 'undefined' ? localStorage : undefined;
-export const getLocalStorageItem = ({ key, canTrack, }) => {
+export const getLocalStorageItem = ({ key, canTrack }) => {
     try {
         if (canTrack) {
             return getLocalStorage()?.getItem(key);
@@ -12,7 +12,7 @@ export const getLocalStorageItem = ({ key, canTrack, }) => {
         return undefined;
     }
 };
-export const setLocalStorageItem = ({ key, canTrack, value, }) => {
+export const setLocalStorageItem = ({ key, canTrack, value }) => {
     try {
         if (canTrack) {
             getLocalStorage()?.setItem(key, value);

package/dist/{sdk/helpers → helpers}/logger.js

@@ -3,5 +3,5 @@ export const logger = {
     log: (...message) => console.log(MSG_PREFIX, ...message),
     error: (...message) => console.error(MSG_PREFIX, ...message),
     warn: (...message) => console.warn(MSG_PREFIX, ...message),
-    debug: (...message) => console.debug(MSG_PREFIX, ...message),
+    debug: (...message) => console.debug(MSG_PREFIX, ...message)
 };

package/dist/helpers/preview-lru-cache/get.d.ts

@@ -0,0 +1 @@
+export declare function getPreviewContent(searchParams: URLSearchParams): import("../../types/builder-content").BuilderContent;

package/dist/helpers/preview-lru-cache/get.js

@@ -0,0 +1,7 @@
+import { getIdFromSearchParams } from './helpers';
+import { init } from './init';
+export function getPreviewContent(searchParams) {
+    init();
+    const id = getIdFromSearchParams(searchParams);
+    return typeof id === 'string' ? globalThis._BUILDER_PREVIEW_LRU_CACHE.get(id) : undefined;
+}

package/dist/helpers/preview-lru-cache/helpers.d.ts

@@ -0,0 +1 @@
+export declare const getIdFromSearchParams: (searchParams: URLSearchParams) => string;

package/dist/helpers/preview-lru-cache/helpers.js

@@ -0,0 +1,9 @@
+import { logger } from '../logger';
+export const getIdFromSearchParams = (searchParams) => {
+    const previewedModel = searchParams.get('preview');
+    const previewedId = searchParams.get('overrides.' + previewedModel);
+    if (!previewedId) {
+        logger.warn('No previewed ID found in search params.');
+    }
+    return previewedId;
+};

package/dist/helpers/preview-lru-cache/init.d.ts

@@ -0,0 +1,6 @@
+/**
+ * This is an LRU cache to hold preview content on the server-side.
+ *
+ * Note: This logic is only used by the NextJS SDK.
+ */
+export declare function init(): void;

package/dist/helpers/preview-lru-cache/init.js

@@ -0,0 +1,15 @@
+/**
+ * This is an LRU cache to hold preview content on the server-side.
+ *
+ * Note: This logic is only used by the NextJS SDK.
+ */
+import { LRUCache } from 'lru-cache';
+export function init() {
+    if (!globalThis._BUILDER_PREVIEW_LRU_CACHE) {
+        globalThis._BUILDER_PREVIEW_LRU_CACHE = new LRUCache({
+            max: 500,
+            // how long to live in ms
+            ttl: 1000 * 60 * 5
+        });
+    }
+}

package/dist/helpers/preview-lru-cache/set.d.ts

@@ -0,0 +1,7 @@
+import type { BuilderContent } from '../../types/builder-content';
+export declare function postPreviewContent({ key, value }: {
+    key: string;
+    value: BuilderContent;
+}): Promise<{
+    [x: string]: BuilderContent;
+}>;

package/dist/helpers/preview-lru-cache/set.js

@@ -0,0 +1,9 @@
+'use server';
+import { init } from './init';
+export async function postPreviewContent({ key, value }) {
+    init();
+    globalThis._BUILDER_PREVIEW_LRU_CACHE.set(key, value);
+    return {
+        [key]: value
+    };
+}

package/dist/helpers/preview-lru-cache/types.d.ts

@@ -0,0 +1,12 @@
+/**
+ * This is an LRU cache to hold preview content on the server-side.
+ *
+ * Note: This logic is only used by the NextJS SDK.
+ */
+import type { LRUCache } from 'lru-cache';
+import type { BuilderContent } from '../../types/builder-content';
+type BuilderLRUCache = LRUCache<string, BuilderContent>;
+export type GlobalWCache = typeof globalThis & {
+    _BUILDER_PREVIEW_LRU_CACHE: BuilderLRUCache;
+};
+export {};

package/dist/helpers/preview-lru-cache/types.js

@@ -0,0 +1,6 @@
+/**
+ * This is an LRU cache to hold preview content on the server-side.
+ *
+ * Note: This logic is only used by the NextJS SDK.
+ */
+export {};

package/dist/{sdk/helpers → helpers}/sessionId.d.ts

@@ -1,6 +1,6 @@
 import type { CanTrack } from '../types/can-track.js';
-export declare const getSessionId: ({ canTrack, }: CanTrack) => Promise<string | undefined>;
+export declare const getSessionId: ({ canTrack }: CanTrack) => Promise<string | undefined>;
 export declare const createSessionId: () => string;
-export declare const setSessionId: ({ id, canTrack, }: {
+export declare const setSessionId: ({ id, canTrack }: {
     id: string;
 } & CanTrack) => Promise<void>;

package/dist/{sdk/helpers → helpers}/sessionId.js

@@ -2,22 +2,29 @@ import { getCookie, setCookie } from './cookie.js';
 import { checkIsDefined } from './nullable.js';
 import { uuid } from './uuid.js';
 const SESSION_LOCAL_STORAGE_KEY = 'builderSessionId';
-export const getSessionId = async ({ canTrack, }) => {
+export const getSessionId = async ({ canTrack }) => {
     if (!canTrack) {
         return undefined;
     }
     const sessionId = await getCookie({
         name: SESSION_LOCAL_STORAGE_KEY,
-        canTrack,
+        canTrack
     });
     if (checkIsDefined(sessionId)) {
         return sessionId;
     }
     else {
         const newSessionId = createSessionId();
-        setSessionId({ id: newSessionId, canTrack });
+        setSessionId({
+            id: newSessionId,
+            canTrack
+        });
         return newSessionId;
     }
 };
 export const createSessionId = () => uuid();
-export const setSessionId = ({ id, canTrack, }) => setCookie({ name: SESSION_LOCAL_STORAGE_KEY, value: id, canTrack });
+export const setSessionId = ({ id, canTrack }) => setCookie({
+    name: SESSION_LOCAL_STORAGE_KEY,
+    value: id,
+    canTrack
+});

package/dist/{sdk/helpers → helpers}/uuid.js

@@ -3,7 +3,7 @@
  */
 export function uuidv4() {
     return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
-        const r = (Math.random() * 16) | 0, v = c == 'x' ? r : (r & 0x3) | 0x8;
+        const r = Math.random() * 16 | 0, v = c == 'x' ? r : r & 0x3 | 0x8;
         return v.toString(16);
     });
 }

package/dist/{sdk/helpers → helpers}/visitorId.d.ts

@@ -1,6 +1,6 @@
 import type { CanTrack } from '../types/can-track.js';
 export declare const getVisitorId: ({ canTrack }: CanTrack) => string | undefined;
 export declare const createVisitorId: () => string;
-export declare const setVisitorId: ({ id, canTrack, }: {
+export declare const setVisitorId: ({ id, canTrack }: {
     id: string;
 } & CanTrack) => void;

package/dist/{sdk/helpers → helpers}/visitorId.js

@@ -8,20 +8,23 @@ export const getVisitorId = ({ canTrack }) => {
     }
     const visitorId = getLocalStorageItem({
         key: VISITOR_LOCAL_STORAGE_KEY,
-        canTrack,
+        canTrack
     });
     if (checkIsDefined(visitorId)) {
         return visitorId;
     }
     else {
         const newVisitorId = createVisitorId();
-        setVisitorId({ id: newVisitorId, canTrack });
+        setVisitorId({
+            id: newVisitorId,
+            canTrack
+        });
         return newVisitorId;
     }
 };
 export const createVisitorId = () => uuid();
-export const setVisitorId = ({ id, canTrack, }) => setLocalStorageItem({
+export const setVisitorId = ({ id, canTrack }) => setLocalStorageItem({
     key: VISITOR_LOCAL_STORAGE_KEY,
     value: id,
-    canTrack,
+    canTrack
 });

package/dist/{sdk/index-helpers → index-helpers}/blocks-exports.d.ts

@@ -2,9 +2,9 @@ export { default as Button } from '../blocks/button/button';
 export { default as Columns } from '../blocks/columns/columns';
 export { default as Fragment } from '../blocks/fragment/fragment';
 export { default as Image } from '../blocks/image/image';
-export { default as RenderBlocks } from '../components/render-blocks';
+export { default as RenderBlocks } from '../components/blocks/blocks';
 export { default as Section } from '../blocks/section/section';
 export { default as Symbol } from '../blocks/symbol/symbol';
 export { default as Text } from '../blocks/text/text';
 export { default as Video } from '../blocks/video/video';
-export { default as RenderContent } from '../components/render-content-variants/render-content-variants';
+export { default as RenderContent } from '../components/content-variants/content-variants';

package/dist/{sdk/index-helpers → index-helpers}/blocks-exports.js

@@ -2,9 +2,9 @@ export { default as Button } from '../blocks/button/button';
 export { default as Columns } from '../blocks/columns/columns';
 export { default as Fragment } from '../blocks/fragment/fragment';
 export { default as Image } from '../blocks/image/image';
-export { default as RenderBlocks } from '../components/render-blocks';
+export { default as RenderBlocks } from '../components/blocks/blocks';
 export { default as Section } from '../blocks/section/section';
 export { default as Symbol } from '../blocks/symbol/symbol';
 export { default as Text } from '../blocks/text/text';
 export { default as Video } from '../blocks/video/video';
-export { default as RenderContent } from '../components/render-content-variants/render-content-variants';
+export { default as RenderContent } from '../components/content-variants/content-variants';

package/dist/{sdk/index.d.ts → index.d.ts}

@@ -7,9 +7,9 @@ export { register } from './functions/register.js';
 export type { InsertMenuConfig, InsertMenuItem } from './functions/register.js';
 export { setEditorSettings } from './functions/set-editor-settings.js';
 export type { Settings } from './functions/set-editor-settings.js';
-export { getAllContent, getContent, processContentResult, } from './functions/get-content/index.js';
+export { getAllContent, getContent, processContentResult } from './functions/get-content/index.js';
 export { getBuilderSearchParams } from './functions/get-builder-search-params/index.js';
 export { track } from './functions/track/index.js';
 export type { RegisteredComponent } from './context/types';
 export type { ComponentInfo } from './types/components';
-export type { RenderContentProps } from './components/render-content/render-content.types.js';
+export type { ContentProps } from './components/content/content.types.js';

package/dist/{sdk/index.js → index.js}

@@ -5,6 +5,6 @@ export { isPreviewing } from './functions/is-previewing.js';
 export { createRegisterComponentMessage } from './functions/register-component.js';
 export { register } from './functions/register.js';
 export { setEditorSettings } from './functions/set-editor-settings.js';
-export { getAllContent, getContent, processContentResult, } from './functions/get-content/index.js';
+export { getAllContent, getContent, processContentResult } from './functions/get-content/index.js';
 export { getBuilderSearchParams } from './functions/get-builder-search-params/index.js';
 export { track } from './functions/track/index.js';