@builder.io/sdk-react 0.2.2 → 0.2.3-1

package/dist/react/cjs/functions/get-processed-block.d.ts

@@ -0,0 +1,6 @@
+export function getProcessedBlock({ block, context, shouldEvaluateBindings, state }: {
+    block: any;
+    context: any;
+    shouldEvaluateBindings: any;
+    state: any;
+}): any;

package/dist/react/cjs/functions/get-processed-block.js

@@ -0,0 +1,52 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getProcessedBlock = void 0;
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+    for (var prop in b || (b = {}))
+        if (__hasOwnProp.call(b, prop))
+            __defNormalProp(a, prop, b[prop]);
+    if (__getOwnPropSymbols)
+        for (var prop of __getOwnPropSymbols(b)) {
+            if (__propIsEnum.call(b, prop))
+                __defNormalProp(a, prop, b[prop]);
+        }
+    return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+const evaluate_js_1 = require("./evaluate.js");
+const fast_clone_js_1 = require("./fast-clone.js");
+const set_js_1 = require("./set.js");
+const transform_block_js_1 = require("./transform-block.js");
+const evaluateBindings = ({ block, context, state }) => {
+    if (!block.bindings) {
+        return block;
+    }
+    const copy = (0, fast_clone_js_1.fastClone)(block);
+    const copied = __spreadProps(__spreadValues({}, copy), {
+        properties: __spreadValues({}, copy.properties),
+        actions: __spreadValues({}, copy.actions)
+    });
+    for (const binding in block.bindings) {
+        const expression = block.bindings[binding];
+        const value = (0, evaluate_js_1.evaluate)({ code: expression, state, context });
+        (0, set_js_1.set)(copied, binding, value);
+    }
+    return copied;
+};
+function getProcessedBlock({ block, context, shouldEvaluateBindings, state }) {
+    const transformedBlock = (0, transform_block_js_1.transformBlock)(block);
+    if (shouldEvaluateBindings) {
+        return evaluateBindings({ block: transformedBlock, state, context });
+    }
+    else {
+        return transformedBlock;
+    }
+}
+exports.getProcessedBlock = getProcessedBlock;

package/dist/react/cjs/functions/get-processed-block.test.d.ts

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

package/dist/react/cjs/functions/get-processed-block.test.js

@@ -0,0 +1,34 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const get_processed_block_js_1 = require("./get-processed-block.js");
+test("Can process bindings", () => {
+    var _a, _b, _c, _d, _e, _f;
+    const block = {
+        "@type": "@builder.io/sdk:Element",
+        properties: {
+            foo: "bar"
+        },
+        bindings: {
+            "properties.foo": '"baz"',
+            "responsiveStyles.large.zIndex": "1 + 1",
+            "properties.test": "state.test",
+            "properties.block": `
+        const foo = 'bar';
+        return foo;
+      `,
+            "properties.isEditing": "builder.isEditing"
+        }
+    };
+    const processed = (0, get_processed_block_js_1.getProcessedBlock)({
+        block,
+        context: {},
+        state: { test: "hello" },
+        shouldEvaluateBindings: true
+    });
+    expect(processed).not.toEqual(block);
+    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/dist/react/cjs/functions/get-react-native-block-styles.d.ts

@@ -0,0 +1,5 @@
+export function getReactNativeBlockStyles({ block, context, blockStyles }: {
+    block: any;
+    context: any;
+    blockStyles: any;
+}): {};

package/dist/react/cjs/functions/get-react-native-block-styles.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getReactNativeBlockStyles = void 0;
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+    for (var prop in b || (b = {}))
+        if (__hasOwnProp.call(b, prop))
+            __defNormalProp(a, prop, b[prop]);
+    if (__getOwnPropSymbols)
+        for (var prop of __getOwnPropSymbols(b)) {
+            if (__propIsEnum.call(b, prop))
+                __defNormalProp(a, prop, b[prop]);
+        }
+    return a;
+};
+const sanitize_react_native_block_styles_js_1 = require("./sanitize-react-native-block-styles.js");
+function getReactNativeBlockStyles({ block, context, blockStyles }) {
+    const responsiveStyles = block.responsiveStyles;
+    if (!responsiveStyles) {
+        return {};
+    }
+    const styles = __spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, context.inheritedStyles), responsiveStyles.large || {}), responsiveStyles.medium || {}), responsiveStyles.small || {}), blockStyles);
+    const newStyles = (0, sanitize_react_native_block_styles_js_1.sanitizeReactNativeBlockStyles)(styles);
+    return newStyles;
+}
+exports.getReactNativeBlockStyles = getReactNativeBlockStyles;

package/dist/react/cjs/functions/if-target.d.ts

@@ -0,0 +1,5 @@
+export function ifTarget({ targets, doThing, elseThing }: {
+    targets: any;
+    doThing: any;
+    elseThing: any;
+}): any;

package/dist/react/cjs/functions/if-target.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ifTarget = void 0;
+const target_js_1 = require("../constants/target.js");
+function ifTarget({ targets, doThing, elseThing }) {
+    if (target_js_1.TARGET && targets.includes(target_js_1.TARGET)) {
+        return doThing();
+    }
+    else {
+        return elseThing == null ? void 0 : elseThing();
+    }
+}
+exports.ifTarget = ifTarget;

package/dist/react/cjs/functions/is-browser.d.ts

@@ -0,0 +1 @@
+export function isBrowser(): boolean;

package/dist/react/cjs/functions/is-browser.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isBrowser = void 0;
+function isBrowser() {
+    return typeof window !== "undefined" && typeof document !== "undefined";
+}
+exports.isBrowser = isBrowser;

package/dist/react/cjs/functions/is-editing.d.ts

@@ -0,0 +1 @@
+export function isEditing(): boolean;

package/dist/react/cjs/functions/is-editing.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isEditing = void 0;
+const target_js_1 = require("../constants/target.js");
+const is_iframe_js_1 = require("./is-iframe.js");
+function isEditing() {
+    return (0, is_iframe_js_1.isIframe)() && (target_js_1.TARGET === "reactNative" || window.location.search.indexOf("builder.frameEditing=") !== -1);
+}
+exports.isEditing = isEditing;

package/dist/react/cjs/functions/is-iframe.d.ts

@@ -0,0 +1 @@
+export function isIframe(): boolean;

package/dist/react/cjs/functions/is-iframe.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isIframe = void 0;
+const is_browser_js_1 = require("./is-browser.js");
+function isIframe() {
+    return (0, is_browser_js_1.isBrowser)() && window.self !== window.top;
+}
+exports.isIframe = isIframe;

package/dist/react/cjs/functions/is-previewing.d.ts

@@ -0,0 +1 @@
+export function isPreviewing(): boolean;

package/dist/react/cjs/functions/is-previewing.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isPreviewing = void 0;
+const is_browser_js_1 = require("./is-browser.js");
+const is_editing_js_1 = require("./is-editing.js");
+function isPreviewing() {
+    if (!(0, is_browser_js_1.isBrowser)()) {
+        return false;
+    }
+    if ((0, is_editing_js_1.isEditing)()) {
+        return false;
+    }
+    return Boolean(location.search.indexOf("builder.preview=") !== -1);
+}
+exports.isPreviewing = isPreviewing;

package/dist/react/cjs/functions/on-change.d.ts

@@ -0,0 +1,2 @@
+export function onChange(obj: any, cb: any): any;
+export const onChangeProxySymbol: unique symbol;

package/dist/react/cjs/functions/on-change.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.onChangeProxySymbol = exports.onChange = void 0;
+const onChangeProxySymbol = Symbol("onChangeProxySymbol");
+exports.onChangeProxySymbol = onChangeProxySymbol;
+function onChange(obj, cb) {
+    return new Proxy(obj, {
+        get(target, key) {
+            if (key === onChangeProxySymbol) {
+                return true;
+            }
+            const value = Reflect.get(target, key);
+            if (value && typeof value === "object") {
+                if (value[onChangeProxySymbol]) {
+                    return value;
+                }
+                return onChange(value, cb);
+            }
+            return value;
+        },
+        set(target, key, value) {
+            const returnValue = Reflect.set(target, key, value);
+            cb();
+            return returnValue;
+        }
+    });
+}
+exports.onChange = onChange;

package/dist/react/cjs/functions/on-change.test.d.ts

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

package/dist/react/cjs/functions/on-change.test.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const on_change_js_1 = require("./on-change.js");
+test("onChange can observe a shallow change", () => {
+    let changeHappend = false;
+    const obj = (0, on_change_js_1.onChange)({ foo: "hi" }, () => changeHappend = true);
+    obj.foo = "yo";
+    expect(changeHappend).toBe(true);
+});
+test("onChange can observe a deep change", () => {
+    let changeHappend = false;
+    const obj = (0, on_change_js_1.onChange)({ foo: { bar: "hi" } }, () => changeHappend = true);
+    obj.foo.bar = "yo";
+    expect(changeHappend).toBe(true);
+});
+test("Smoke test: callback is not fired if no properties updated", () => {
+    let changeHappend = false;
+    const obj = (0, on_change_js_1.onChange)({ foo: { bar: "hi" } }, () => changeHappend = true);
+    obj.foo.bar;
+    expect(changeHappend).toBe(false);
+});

package/dist/react/cjs/functions/register-component.d.ts

@@ -0,0 +1,6 @@
+export const components: any[];
+export function createRegisterComponentMessage(_a: any): {
+    type: string;
+    data: any;
+};
+export function registerComponent(component: any, info: any): any;

package/dist/react/cjs/functions/register-component.js

@@ -0,0 +1,65 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.registerComponent = exports.createRegisterComponentMessage = exports.components = void 0;
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+    for (var prop in b || (b = {}))
+        if (__hasOwnProp.call(b, prop))
+            __defNormalProp(a, prop, b[prop]);
+    if (__getOwnPropSymbols)
+        for (var prop of __getOwnPropSymbols(b)) {
+            if (__propIsEnum.call(b, prop))
+                __defNormalProp(a, prop, b[prop]);
+        }
+    return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+    var target = {};
+    for (var prop in source)
+        if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+            target[prop] = source[prop];
+    if (source != null && __getOwnPropSymbols)
+        for (var prop of __getOwnPropSymbols(source)) {
+            if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+                target[prop] = source[prop];
+        }
+    return target;
+};
+const util_js_1 = require("../blocks/util.js");
+const fast_clone_js_1 = require("./fast-clone.js");
+const components = [];
+exports.components = components;
+function registerComponent(component, info) {
+    components.push(__spreadValues({ component }, info));
+    console.warn("registerComponent is deprecated. Use the `customComponents` prop in RenderContent instead to provide your custom components to the builder SDK.");
+    return component;
+}
+exports.registerComponent = registerComponent;
+const createRegisterComponentMessage = (_a) => {
+    var _b = _a, { component: _ } = _b, info = __objRest(_b, [
+        "component"
+    ]);
+    return {
+        type: "builder.registerComponent",
+        data: prepareComponentInfoToSend(info)
+    };
+};
+exports.createRegisterComponentMessage = createRegisterComponentMessage;
+const serializeValue = (value) => typeof value === "function" ? (0, util_js_1.serializeFn)(value) : (0, fast_clone_js_1.fastClone)(value);
+const prepareComponentInfoToSend = (_c) => {
+    var _d = _c, { inputs } = _d, info = __objRest(_d, [
+        "inputs"
+    ]);
+    return __spreadProps(__spreadValues({}, (0, fast_clone_js_1.fastClone)(info)), {
+        inputs: inputs == null ? void 0 : inputs.map((input) => Object.entries(input).reduce((acc, [key, value]) => __spreadProps(__spreadValues({}, acc), {
+            [key]: serializeValue(value)
+        }), {}))
+    });
+};

package/dist/react/cjs/functions/register.d.ts

@@ -0,0 +1 @@
+export function register(type: any, info: any): void;

package/dist/react/cjs/functions/register.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.register = void 0;
+const is_browser_js_1 = require("./is-browser.js");
+const registry = {};
+function register(type, info) {
+    let typeList = registry[type];
+    if (!typeList) {
+        typeList = registry[type] = [];
+    }
+    typeList.push(info);
+    if ((0, is_browser_js_1.isBrowser)()) {
+        const message = {
+            type: "builder.register",
+            data: {
+                type,
+                info
+            }
+        };
+        try {
+            parent.postMessage(message, "*");
+            if (parent !== window) {
+                window.postMessage(message, "*");
+            }
+        }
+        catch (err) {
+            console.debug("Could not postmessage", err);
+        }
+    }
+}
+exports.register = register;

package/dist/react/cjs/functions/sanitize-react-native-block-styles.d.ts

@@ -0,0 +1 @@
+export function sanitizeReactNativeBlockStyles(styles: any): {};

package/dist/react/cjs/functions/sanitize-react-native-block-styles.js

@@ -0,0 +1,71 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.sanitizeReactNativeBlockStyles = void 0;
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+    for (var prop in b || (b = {}))
+        if (__hasOwnProp.call(b, prop))
+            __defNormalProp(a, prop, b[prop]);
+    if (__getOwnPropSymbols)
+        for (var prop of __getOwnPropSymbols(b)) {
+            if (__propIsEnum.call(b, prop))
+                __defNormalProp(a, prop, b[prop]);
+        }
+    return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+const propertiesThatMustBeNumber = new Set(["lineHeight"]);
+const displayValues = new Set(["flex", "none"]);
+const SHOW_WARNINGS = false;
+const normalizeNumber = (value) => {
+    if (Number.isNaN(value)) {
+        return void 0;
+    }
+    else if (value < 0) {
+        return 0;
+    }
+    else {
+        return value;
+    }
+};
+const sanitizeReactNativeBlockStyles = (styles) => {
+    return Object.keys(styles).reduce((acc, key) => {
+        const propertyValue = styles[key];
+        if (key === "display" && !displayValues.has(propertyValue)) {
+            if (SHOW_WARNINGS) {
+                console.warn(`Style value for key "display" must be "flex" or "none" but had ${propertyValue}`);
+            }
+            return acc;
+        }
+        if (propertiesThatMustBeNumber.has(key) && typeof propertyValue !== "number") {
+            if (SHOW_WARNINGS) {
+                console.warn(`Style key ${key} must be a number, but had value \`${styles[key]}\``);
+            }
+            return acc;
+        }
+        if (typeof propertyValue === "string") {
+            const isPixelUnit = propertyValue.match(/^-?(\d*)(\.?)(\d*)*px$/);
+            if (isPixelUnit) {
+                const newValue = parseFloat(propertyValue);
+                const normalizedValue = normalizeNumber(newValue);
+                if (normalizedValue) {
+                    return __spreadProps(__spreadValues({}, acc), { [key]: normalizedValue });
+                }
+                else {
+                    return acc;
+                }
+            }
+            else if (propertyValue === "0") {
+                return __spreadProps(__spreadValues({}, acc), { [key]: 0 });
+            }
+        }
+        return __spreadProps(__spreadValues({}, acc), { [key]: propertyValue });
+    }, {});
+};
+exports.sanitizeReactNativeBlockStyles = sanitizeReactNativeBlockStyles;

package/dist/react/cjs/functions/set-editor-settings.d.ts

@@ -0,0 +1 @@
+export function setEditorSettings(newSettings: any): void;

package/dist/react/cjs/functions/set-editor-settings.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.setEditorSettings = void 0;
+const is_browser_js_1 = require("./is-browser.js");
+const settings = {};
+function setEditorSettings(newSettings) {
+    if ((0, is_browser_js_1.isBrowser)()) {
+        Object.assign(settings, newSettings);
+        const message = {
+            type: "builder.settingsChange",
+            data: settings
+        };
+        parent.postMessage(message, "*");
+    }
+}
+exports.setEditorSettings = setEditorSettings;

package/dist/react/cjs/functions/set.d.ts

@@ -0,0 +1 @@
+export function set(obj: any, _path: any, value: any): any;

package/dist/react/cjs/functions/set.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.set = void 0;
+const set = (obj, _path, value) => {
+    if (Object(obj) !== obj) {
+        return obj;
+    }
+    const path = Array.isArray(_path) ? _path : _path.toString().match(/[^.[\]]+/g);
+    path.slice(0, -1).reduce((a, c, i) => Object(a[c]) === a[c] ? a[c] : a[c] = Math.abs(Number(path[i + 1])) >> 0 === +path[i + 1] ? [] : {}, obj)[path[path.length - 1]] = value;
+    return obj;
+};
+exports.set = set;

package/dist/react/cjs/functions/set.test.d.ts

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

package/dist/react/cjs/functions/set.test.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const set_js_1 = require("./set.js");
+test("can shallow set a property", () => {
+    const obj = { foo: "bar" };
+    (0, set_js_1.set)(obj, "foo", "baz");
+    expect(obj.foo).toBe("baz");
+});
+test("can deeply set a property", () => {
+    const obj = { foo: "bar" };
+    (0, set_js_1.set)(obj, "foo.bar", "baz");
+    expect(obj.foo.bar).toBe("baz");
+});
+test("can deeply create arrays", () => {
+    const obj = { foo: "bar" };
+    (0, set_js_1.set)(obj, "foo.bar.0", "hi");
+    expect(obj.foo.bar).toEqual(["hi"]);
+});

package/dist/react/cjs/functions/track/helpers.d.ts

@@ -0,0 +1,5 @@
+export function getUserAttributes(): {
+    urlPath: string | undefined;
+    host: string | undefined;
+    device: string;
+};

package/dist/react/cjs/functions/track/helpers.js

@@ -0,0 +1,53 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getUserAttributes = void 0;
+const target_1 = require("../../constants/target");
+const is_browser_1 = require("../is-browser");
+const getLocation = () => {
+    if (target_1.TARGET === "reactNative") {
+        return null;
+    }
+    else if ((0, is_browser_1.isBrowser)()) {
+        const parsedLocation = new URL(location.href);
+        if (parsedLocation.pathname === "") {
+            parsedLocation.pathname = "/";
+        }
+        return parsedLocation;
+    }
+    else {
+        console.warn("Cannot get location for tracking in non-browser environment");
+        return null;
+    }
+};
+const getUserAgent = () => typeof navigator === "object" && navigator.userAgent || "";
+const getUserAttributes = () => {
+    const userAgent = getUserAgent();
+    const isMobile = {
+        Android() {
+            return userAgent.match(/Android/i);
+        },
+        BlackBerry() {
+            return userAgent.match(/BlackBerry/i);
+        },
+        iOS() {
+            return userAgent.match(/iPhone|iPod/i);
+        },
+        Opera() {
+            return userAgent.match(/Opera Mini/i);
+        },
+        Windows() {
+            return userAgent.match(/IEMobile/i) || userAgent.match(/WPDesktop/i);
+        },
+        any() {
+            return isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows() || target_1.TARGET === "reactNative";
+        }
+    };
+    const isTablet = userAgent.match(/Tablet|iPad/i);
+    const url = getLocation();
+    return {
+        urlPath: url == null ? void 0 : url.pathname,
+        host: (url == null ? void 0 : url.host) || (url == null ? void 0 : url.hostname),
+        device: isTablet ? "tablet" : isMobile.any() ? "mobile" : "desktop"
+    };
+};
+exports.getUserAttributes = getUserAttributes;

package/dist/react/cjs/functions/track/index.d.ts

@@ -0,0 +1,2 @@
+export function _track(eventProps: any): Promise<any>;
+export function track(args: any): Promise<any>;