@builder.io/sdk-react-nextjs 0.4.5

package/dist/helpers/cookie.js

@@ -0,0 +1,54 @@
+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 }) => {
+    try {
+        if (!canTrack) {
+            return undefined;
+        }
+        /**
+         * 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];
+    }
+    catch (err) {
+        logger.warn('[COOKIE] GET error: ', err?.message || err);
+        return 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.
+ */
+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 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 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 }) => {
+    try {
+        if (!canTrack) {
+            return;
+        }
+        const cookie = createCookieString({
+            name,
+            value,
+            expires
+        });
+        document.cookie = cookie;
+    }
+    catch (err) {
+        logger.warn('[COOKIE] SET error: ', err?.message || err);
+    }
+};

package/dist/helpers/css.d.ts

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

package/dist/helpers/css.js

@@ -0,0 +1,27 @@
+import { camelToKebabCase } from '../functions/camel-to-kebab-case.js';
+import { checkIsDefined } from './nullable.js';
+export const convertStyleMapToCSSArray = (style) => {
+    const cssProps = Object.entries(style).map(([key, value]) => {
+        if (typeof value === 'string') {
+            return `${camelToKebabCase(key)}: ${value};`;
+        }
+        else {
+            return undefined;
+        }
+    });
+    return cssProps.filter(checkIsDefined);
+};
+export const convertStyleMapToCSS = (style) => convertStyleMapToCSSArray(style).join('\n');
+export const createCssClass = ({ mediaQuery, className, styles }) => {
+    const cssClass = `.${className} {
+    ${convertStyleMapToCSS(styles)}
+  }`;
+    if (mediaQuery) {
+        return `${mediaQuery} {
+      ${cssClass}
+    }`;
+    }
+    else {
+        return cssClass;
+    }
+};

package/dist/helpers/flatten.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Convert deep object to a flat object with dots
+ *
+ * { foo: { bar: 'baz' }} -> { 'foo.bar': 'baz' }
+ */
+export declare function flatten<T extends Record<string, any>>(object: T, path?: string | null, separator?: string): T;

package/dist/helpers/flatten.js

@@ -0,0 +1,17 @@
+/**
+ * Convert deep object to a flat object with dots
+ *
+ * { foo: { bar: 'baz' }} -> { 'foo.bar': 'baz' }
+ */
+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
+        };
+    }, {});
+}

package/dist/helpers/localStorage.d.ts

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

package/dist/helpers/localStorage.js

@@ -0,0 +1,24 @@
+import { isBrowser } from '../functions/is-browser.js';
+const getLocalStorage = () => isBrowser() && typeof localStorage !== 'undefined' ? localStorage : undefined;
+export const getLocalStorageItem = ({ key, canTrack }) => {
+    try {
+        if (canTrack) {
+            return getLocalStorage()?.getItem(key);
+        }
+        return undefined;
+    }
+    catch (err) {
+        console.debug('[LocalStorage] GET error: ', err);
+        return undefined;
+    }
+};
+export const setLocalStorageItem = ({ key, canTrack, value }) => {
+    try {
+        if (canTrack) {
+            getLocalStorage()?.setItem(key, value);
+        }
+    }
+    catch (err) {
+        console.debug('[LocalStorage] SET error: ', err);
+    }
+};

package/dist/helpers/logger.d.ts

@@ -0,0 +1,6 @@
+export declare const logger: {
+    log: (...message: any[]) => void;
+    error: (...message: any[]) => void;
+    warn: (...message: any[]) => void;
+    debug: (...message: any[]) => void;
+};

package/dist/helpers/logger.js

@@ -0,0 +1,7 @@
+const MSG_PREFIX = '[Builder.io]: ';
+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)
+};

package/dist/helpers/nullable.d.ts

@@ -0,0 +1,2 @@
+export type Nullable<T> = T | null | undefined;
+export declare const checkIsDefined: <T>(maybeT: T) => maybeT is T;

package/dist/helpers/nullable.js

@@ -0,0 +1 @@
+export const checkIsDefined = (maybeT) => maybeT !== null && maybeT !== undefined;

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 @@
+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 @@
+export {};

package/dist/helpers/sessionId.d.ts

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

package/dist/helpers/sessionId.js

@@ -0,0 +1,30 @@
+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 }) => {
+    if (!canTrack) {
+        return undefined;
+    }
+    const sessionId = await getCookie({
+        name: SESSION_LOCAL_STORAGE_KEY,
+        canTrack
+    });
+    if (checkIsDefined(sessionId)) {
+        return sessionId;
+    }
+    else {
+        const newSessionId = createSessionId();
+        setSessionId({
+            id: newSessionId,
+            canTrack
+        });
+        return newSessionId;
+    }
+};
+export const createSessionId = () => uuid();
+export const setSessionId = ({ id, canTrack }) => setCookie({
+    name: SESSION_LOCAL_STORAGE_KEY,
+    value: id,
+    canTrack
+});

package/dist/helpers/url.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Only gets one level up from hostname
+ * wwww.example.com -> example.com
+ * www.example.co.uk -> example.co.uk
+ */
+export declare const getTopLevelDomain: (host: string) => string;

package/dist/helpers/url.js

@@ -0,0 +1,15 @@
+/**
+ * Only gets one level up from hostname
+ * wwww.example.com -> example.com
+ * www.example.co.uk -> example.co.uk
+ */
+export const getTopLevelDomain = (host) => {
+    if (host === 'localhost' || host === '127.0.0.1') {
+        return host;
+    }
+    const parts = host.split('.');
+    if (parts.length > 2) {
+        return parts.slice(1).join('.');
+    }
+    return host;
+};

package/dist/helpers/uuid.d.ts

@@ -0,0 +1,8 @@
+/**
+ * @credit https://stackoverflow.com/a/2117523
+ */
+export declare function uuidv4(): string;
+/**
+ * Slightly cleaner and smaller UUIDs
+ */
+export declare function uuid(): string;

package/dist/helpers/uuid.js

@@ -0,0 +1,15 @@
+/**
+ * @credit https://stackoverflow.com/a/2117523
+ */
+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;
+        return v.toString(16);
+    });
+}
+/**
+ * Slightly cleaner and smaller UUIDs
+ */
+export function uuid() {
+    return uuidv4().replace(/-/g, '');
+}

package/dist/helpers/visitorId.d.ts

@@ -0,0 +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 }: {
+    id: string;
+} & CanTrack) => void;

package/dist/helpers/visitorId.js

@@ -0,0 +1,30 @@
+import { getLocalStorageItem, setLocalStorageItem } from './localStorage.js';
+import { checkIsDefined } from './nullable.js';
+import { uuid } from './uuid.js';
+const VISITOR_LOCAL_STORAGE_KEY = 'builderVisitorId';
+export const getVisitorId = ({ canTrack }) => {
+    if (!canTrack) {
+        return undefined;
+    }
+    const visitorId = getLocalStorageItem({
+        key: VISITOR_LOCAL_STORAGE_KEY,
+        canTrack
+    });
+    if (checkIsDefined(visitorId)) {
+        return visitorId;
+    }
+    else {
+        const newVisitorId = createVisitorId();
+        setVisitorId({
+            id: newVisitorId,
+            canTrack
+        });
+        return newVisitorId;
+    }
+};
+export const createVisitorId = () => uuid();
+export const setVisitorId = ({ id, canTrack }) => setLocalStorageItem({
+    key: VISITOR_LOCAL_STORAGE_KEY,
+    value: id,
+    canTrack
+});

package/dist/index-helpers/blocks-exports.d.ts

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

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

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

package/dist/index-helpers/top-of-file.d.ts

@@ -0,0 +1 @@
+export default undefined;

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

@@ -0,0 +1,4 @@
+// no-op
+// this file exists in case a target needs to add logic to the top of the index file in an
+// override.
+export default undefined;

package/dist/index.d.ts

@@ -0,0 +1,15 @@
+export * from './index-helpers/top-of-file.js';
+export * from './index-helpers/blocks-exports.js';
+export { isEditing } from './functions/is-editing.js';
+export { isPreviewing } from './functions/is-previewing.js';
+export { createRegisterComponentMessage } from './functions/register-component.js';
+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 { 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 { ContentProps } from './components/content/content.types.js';

package/dist/index.js

@@ -0,0 +1,10 @@
+export * from './index-helpers/top-of-file.js';
+export * from './index-helpers/blocks-exports.js';
+export { isEditing } from './functions/is-editing.js';
+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 { getBuilderSearchParams } from './functions/get-builder-search-params/index.js';
+export { track } from './functions/track/index.js';

package/dist/scripts/init-editing.d.ts

@@ -0,0 +1,6 @@
+export declare const registerInsertMenu: () => void;
+export declare const setupBrowserForEditing: (options?: {
+    enrich?: boolean;
+    includeRefs?: boolean;
+    locale?: string;
+}) => void;

package/dist/scripts/init-editing.js

@@ -0,0 +1,109 @@
+import { SDK_VERSION } from '../constants/sdk-version.js';
+import { TARGET } from '../constants/target.js';
+import { isBrowser } from '../functions/is-browser.js';
+import { register } from '../functions/register.js';
+export const registerInsertMenu = () => {
+    register('insertMenu', {
+        name: '_default',
+        default: true,
+        items: [{
+                name: 'Box'
+            }, {
+                name: 'Text'
+            }, {
+                name: 'Image'
+            }, {
+                name: 'Columns'
+            }, ...(TARGET === 'reactNative' ? [] : [{
+                    name: 'Core:Section'
+                }, {
+                    name: 'Core:Button'
+                }, {
+                    name: 'Embed'
+                }, {
+                    name: 'Custom Code'
+                }])]
+    });
+};
+let isSetupForEditing = false;
+export const setupBrowserForEditing = (options = {}) => {
+    if (isSetupForEditing) {
+        return;
+    }
+    isSetupForEditing = true;
+    if (isBrowser()) {
+        window.parent?.postMessage({
+            type: 'builder.sdkInfo',
+            data: {
+                target: TARGET,
+                version: SDK_VERSION,
+                supportsPatchUpdates: false,
+                // Supports builder-model="..." attribute which is needed to
+                // scope our '+ add block' button styling
+                supportsAddBlockScoping: true,
+                supportsCustomBreakpoints: true
+            }
+        }, '*');
+        window.parent?.postMessage({
+            type: 'builder.updateContent',
+            data: {
+                options
+            }
+        }, '*');
+        window.addEventListener('message', ({ data }) => {
+            if (!data?.type) {
+                return;
+            }
+            switch (data.type) {
+                case 'builder.evaluate':
+                    {
+                        const text = data.data.text;
+                        const args = data.data.arguments || [];
+                        const id = data.data.id; // tslint:disable-next-line:no-function-constructor-with-string-args
+                        const fn = new Function(text);
+                        let result;
+                        let error = null;
+                        try {
+                            // eslint-disable-next-line prefer-spread
+                            result = fn.apply(null, args);
+                        }
+                        catch (err) {
+                            error = err;
+                        }
+                        if (error) {
+                            window.parent?.postMessage({
+                                type: 'builder.evaluateError',
+                                data: {
+                                    id,
+                                    error: error.message
+                                }
+                            }, '*');
+                        }
+                        else {
+                            if (result && typeof result.then === 'function') {
+                                result.then(finalResult => {
+                                    window.parent?.postMessage({
+                                        type: 'builder.evaluateResult',
+                                        data: {
+                                            id,
+                                            result: finalResult
+                                        }
+                                    }, '*');
+                                }).catch(console.error);
+                            }
+                            else {
+                                window.parent?.postMessage({
+                                    type: 'builder.evaluateResult',
+                                    data: {
+                                        result,
+                                        id
+                                    }
+                                }, '*');
+                            }
+                        }
+                        break;
+                    }
+            }
+        });
+    }
+};

package/dist/types/api-version.d.ts

@@ -0,0 +1,2 @@
+export type ApiVersion = 'v2' | 'v3';
+export declare const DEFAULT_API_VERSION: ApiVersion;

package/dist/types/api-version.js

@@ -0,0 +1 @@
+export const DEFAULT_API_VERSION = 'v3';

package/dist/types/builder-block.d.ts

@@ -0,0 +1,66 @@
+type JSONValue = string | number | boolean | JSONObject | JSONArray;
+interface JSONObject {
+    [x: string]: JSONValue;
+}
+interface JSONArray extends Array<JSONValue> {
+}
+/** @todo typedoc this */
+export interface BuilderBlock {
+    '@type': '@builder.io/sdk:Element';
+    '@version'?: number;
+    id?: string;
+    tagName?: string;
+    layerName?: string;
+    groupLocked?: boolean;
+    layerLocked?: boolean;
+    /** @todo make alias for properties.class */
+    class?: string;
+    children?: BuilderBlock[];
+    responsiveStyles?: {
+        large?: Partial<CSSStyleDeclaration>;
+        medium?: Partial<CSSStyleDeclaration>;
+        small?: Partial<CSSStyleDeclaration>;
+        /** @deprecated */
+        xsmall?: Partial<CSSStyleDeclaration>;
+    };
+    component?: {
+        name: string;
+        options?: any;
+        tag?: string;
+    };
+    bindings?: {
+        [key: string]: string;
+    };
+    meta?: {
+        [key: string]: JSONValue;
+    };
+    actions?: {
+        [key: string]: string;
+    };
+    properties?: {
+        [key: string]: string;
+    };
+    code?: {
+        bindings?: {
+            [key: string]: string;
+        };
+        actions?: {
+            [key: string]: string;
+        };
+    };
+    repeat?: {
+        collection: string;
+        itemName?: string;
+    } | null;
+    animations?: any[];
+    style?: Partial<CSSStyleDeclaration>;
+    /**
+     * generated by the "Hide If" binding
+     */
+    hide?: boolean;
+    /**
+     * generated by the "Show If" binding
+     */
+    show?: boolean;
+}
+export {};

package/dist/types/builder-block.js

@@ -0,0 +1 @@
+export {};