@builder.io/sdk-react-native 0.4.4 → 0.5.0

package/dist/components/block/components/interactive-element.js

@@ -0,0 +1,46 @@
+"use strict";
+"use client";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const React = __importStar(require("react"));
+const react_native_1 = require("react-native");
+const get_block_actions_js_1 = require("../../../functions/get-block-actions.js");
+const get_block_properties_js_1 = require("../../../functions/get-block-properties.js");
+function InteractiveElement(props) {
+    return (React.createElement(props.Wrapper, { ...props.wrapperProps, attributes: {
+            ...(0, get_block_properties_js_1.getBlockProperties)({
+                block: props.block,
+                context: props.context,
+            }),
+            ...(0, get_block_actions_js_1.getBlockActions)({
+                block: props.block,
+                rootState: props.context.rootState,
+                rootSetState: props.context.rootSetState,
+                localState: props.context.localState,
+                context: props.context.context,
+            }),
+        } }, props.children));
+}
+exports.default = InteractiveElement;

package/dist/components/block/components/repeated-block.js

@@ -0,0 +1,40 @@
+"use strict";
+"use client";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const React = __importStar(require("react"));
+const react_native_1 = require("react-native");
+const react_1 = require("react");
+const builder_context_1 = __importDefault(require("../../../context/builder.context"));
+const block_1 = __importDefault(require("../block"));
+function RepeatedBlock(props) {
+    const [store, setStore] = (0, react_1.useState)(() => props.repeatContext);
+    return (React.createElement(builder_context_1.default.Provider, { value: store },
+        React.createElement(block_1.default, { block: props.block, context: store, registeredComponents: props.registeredComponents })));
+}
+exports.default = RepeatedBlock;

package/dist/components/block/types.js

@@ -0,0 +1 @@
+"use strict";

package/dist/components/blocks/blocks-wrapper.js

@@ -0,0 +1,69 @@
+"use strict";
+"use client";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const React = __importStar(require("react"));
+const react_native_1 = require("react-native");
+const is_editing_js_1 = require("../../functions/is-editing.js");
+function BlocksWrapper(props) {
+    function className() {
+        var _a;
+        return "builder-blocks" + (!((_a = props.blocks) === null || _a === void 0 ? void 0 : _a.length) ? " no-blocks" : "");
+    }
+    function onClick() {
+        var _a, _b;
+        if ((0, is_editing_js_1.isEditing)() && !((_a = props.blocks) === null || _a === void 0 ? void 0 : _a.length)) {
+            (_b = window.parent) === null || _b === void 0 ? void 0 : _b.postMessage({
+                type: "builder.clickEmptyBlocks",
+                data: {
+                    parentElementId: props.parent,
+                    dataPath: props.path,
+                },
+            }, "*");
+        }
+    }
+    function onMouseEnter() {
+        var _a, _b;
+        if ((0, is_editing_js_1.isEditing)() && !((_a = props.blocks) === null || _a === void 0 ? void 0 : _a.length)) {
+            (_b = window.parent) === null || _b === void 0 ? void 0 : _b.postMessage({
+                type: "builder.hoverEmptyBlocks",
+                data: {
+                    parentElementId: props.parent,
+                    dataPath: props.path,
+                },
+            }, "*");
+        }
+    }
+    return (React.createElement(react_native_1.View, { "builder-path": props.path, "builder-parent-id": props.parent, dataSet: {
+            class: className(),
+        }, style: {
+            ...styles.view1,
+            ...props.styleProp,
+        }, onClick: (event) => onClick(), onMouseEnter: (event) => onMouseEnter(), onKeyPress: (event) => onClick() }, props.children));
+}
+const styles = react_native_1.StyleSheet.create({
+    view1: { display: "flex", flexDirection: "column", alignItems: "stretch" },
+});
+exports.default = BlocksWrapper;

package/dist/components/blocks/blocks.js

@@ -0,0 +1,41 @@
+"use strict";
+"use client";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const React = __importStar(require("react"));
+const react_native_1 = require("react-native");
+const block_styles_1 = __importDefault(require("../block/components/block-styles"));
+const block_1 = __importDefault(require("../block/block"));
+const blocks_wrapper_1 = __importDefault(require("./blocks-wrapper"));
+function Blocks(props) {
+    var _a, _b;
+    return (React.createElement(blocks_wrapper_1.default, { blocks: props.blocks, parent: props.parent, path: props.path, styleProp: props.styleProp },
+        props.blocks ? (React.createElement(React.Fragment, null, (_a = props.blocks) === null || _a === void 0 ? void 0 : _a.map((block) => (React.createElement(block_1.default, { key: "render-block-" + block.id, block: block, context: props.context, registeredComponents: props.registeredComponents }))))) : null,
+        props.blocks ? (React.createElement(React.Fragment, null, (_b = props.blocks) === null || _b === void 0 ? void 0 : _b.map((block) => (React.createElement(block_styles_1.default, { key: "block-style-" + block.id, block: block, context: props.context }))))) : null));
+}
+exports.default = Blocks;

package/dist/components/content/builder-editing.js

@@ -0,0 +1,32 @@
+"use strict";
+'use client';
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const React = __importStar(require("react"));
+const react_native_1 = require("react-native");
+function BuilderEditing(props) {
+    return React.createElement(react_native_1.View, null);
+}
+exports.default = BuilderEditing;

package/dist/components/content/components/content-styles.helpers.js

@@ -0,0 +1,55 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getFontCss = exports.getCss = void 0;
+const getCssFromFont = (font) => {
+    var _a, _b;
+    const family = font.family + (font.kind && !font.kind.includes("#") ? ", " + font.kind : "");
+    const name = family.split(",")[0];
+    const url = (_b = font.fileUrl) != null ? _b : (_a = font == null ? void 0 : font.files) == null ? void 0 : _a.regular;
+    let str = "";
+    if (url && family && name) {
+        str += `
+@font-face {
+font-family: "${family}";
+src: local("${name}"), url('${url}') format('woff2');
+font-display: fallback;
+font-weight: 400;
+}
+      `.trim();
+    }
+    if (font.files) {
+        for (const weight in font.files) {
+            const isNumber = String(Number(weight)) === weight;
+            if (!isNumber) {
+                continue;
+            }
+            const weightUrl = font.files[weight];
+            if (weightUrl && weightUrl !== url) {
+                str += `
+@font-face {
+font-family: "${family}";
+src: url('${weightUrl}') format('woff2');
+font-display: fallback;
+font-weight: ${weight};
+}
+        `.trim();
+            }
+        }
+    }
+    return str;
+};
+const getFontCss = ({ customFonts }) => {
+    var _a;
+    return ((_a = customFonts == null ? void 0 : customFonts.map((font) => getCssFromFont(font))) == null ? void 0 : _a.join(" ")) || "";
+};
+exports.getFontCss = getFontCss;
+const getCss = ({ cssCode, contentId }) => {
+    if (!cssCode) {
+        return "";
+    }
+    if (!contentId) {
+        return cssCode;
+    }
+    return (cssCode == null ? void 0 : cssCode.replace(/&/g, `div[builder-content-id="${contentId}"]`)) || "";
+};
+exports.getCss = getCss;

package/dist/components/content/components/content-styles.js

@@ -0,0 +1,61 @@
+"use strict";
+'use client';
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const React = __importStar(require("react"));
+const react_native_1 = require("react-native");
+const react_1 = require("react");
+const inlined_styles_1 = __importDefault(require("../../inlined-styles"));
+const content_styles_helpers_1 = require("./content-styles.helpers");
+const content_styles_helpers_2 = require("./content-styles.helpers");
+function ContentStyles(props) {
+    const [injectedStyles, setInjectedStyles] = (0, react_1.useState)(() => `
+${(0, content_styles_helpers_1.getCss)({
+        cssCode: props.cssCode,
+        contentId: props.contentId,
+    })}
+${(0, content_styles_helpers_2.getFontCss)({
+        customFonts: props.customFonts,
+    })}
+
+.builder-text > p:first-of-type, .builder-text > .builder-paragraph:first-of-type {
+  margin: 0;
+}
+.builder-text > p, .builder-text > .builder-paragraph {
+  color: inherit;
+  line-height: inherit;
+  letter-spacing: inherit;
+  font-weight: inherit;
+  font-size: inherit;
+  text-align: inherit;
+  font-family: inherit;
+}
+`.trim());
+    return React.createElement(inlined_styles_1.default, { styles: injectedStyles });
+}
+exports.default = ContentStyles;

package/dist/components/content/components/enable-editor.js

@@ -0,0 +1,310 @@
+"use strict";
+"use client";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const React = __importStar(require("react"));
+const react_native_1 = require("react-native");
+const react_1 = require("react");
+const evaluate_1 = require("../../../functions/evaluate");
+const get_fetch_js_1 = require("../../../functions/get-fetch.js");
+const is_browser_js_1 = require("../../../functions/is-browser.js");
+const is_editing_js_1 = require("../../../functions/is-editing.js");
+const register_component_js_1 = require("../../../functions/register-component.js");
+const index_js_1 = require("../../../functions/track/index.js");
+const builder_context_1 = __importDefault(require("../../../context/builder.context"));
+const init_editing_js_1 = require("../../../scripts/init-editing.js");
+const nullable_js_1 = require("../../../helpers/nullable.js");
+const interaction_js_1 = require("../../../functions/track/interaction.js");
+const logger_js_1 = require("../../../helpers/logger.js");
+const index_js_2 = require("../../../functions/get-content/index.js");
+const is_previewing_js_1 = require("../../../functions/is-previewing.js");
+const set_js_1 = require("../../../helpers/preview-lru-cache/set.js");
+function EnableEditor(props) {
+    var _a, _b, _c, _d, _e;
+    const elementRef = (0, react_1.useRef)(null);
+    const [canTrackToUse, setCanTrackToUse] = (0, react_1.useState)(() => (0, nullable_js_1.checkIsDefined)(props.canTrack) ? props.canTrack : true);
+    const [forceReRenderCount, setForceReRenderCount] = (0, react_1.useState)(() => 0);
+    function mergeNewContent(newContent) {
+        var _a, _b, _c, _d, _e;
+        const newContentValue = {
+            ...props.builderContextSignal.content,
+            ...newContent,
+            data: {
+                ...(_a = props.builderContextSignal.content) === null || _a === void 0 ? void 0 : _a.data,
+                ...newContent === null || newContent === void 0 ? void 0 : newContent.data,
+            },
+            meta: {
+                ...(_b = props.builderContextSignal.content) === null || _b === void 0 ? void 0 : _b.meta,
+                ...newContent === null || newContent === void 0 ? void 0 : newContent.meta,
+                breakpoints: ((_c = newContent === null || newContent === void 0 ? void 0 : newContent.meta) === null || _c === void 0 ? void 0 : _c.breakpoints) ||
+                    ((_e = (_d = props.builderContextSignal.content) === null || _d === void 0 ? void 0 : _d.meta) === null || _e === void 0 ? void 0 : _e.breakpoints),
+            },
+        };
+        props.builderContextSignal.content = newContentValue;
+    }
+    const [lastUpdated, setLastUpdated] = (0, react_1.useState)(() => 0);
+    const [shouldSendResetCookie, setShouldSendResetCookie] = (0, react_1.useState)(() => false);
+    function processMessage(event) {
+        var _a;
+        const { data } = event;
+        if (data) {
+            switch (data.type) {
+                case "builder.configureSdk": {
+                    const messageContent = data.data;
+                    const { breakpoints, contentId } = messageContent;
+                    if (!contentId ||
+                        contentId !== ((_a = props.builderContextSignal.content) === null || _a === void 0 ? void 0 : _a.id)) {
+                        return;
+                    }
+                    if (breakpoints) {
+                        mergeNewContent({
+                            meta: {
+                                breakpoints,
+                            },
+                        });
+                    }
+                    setForceReRenderCount(forceReRenderCount + 1); // This is a hack to force Qwik to re-render.
+                    break;
+                }
+                case "builder.contentUpdate": {
+                    const messageContent = data.data;
+                    const key = messageContent.key ||
+                        messageContent.alias ||
+                        messageContent.entry ||
+                        messageContent.modelName;
+                    const contentData = messageContent.data;
+                    if (key === props.model) {
+                        mergeNewContent(contentData);
+                        setForceReRenderCount(forceReRenderCount + 1); // This is a hack to force Qwik to re-render.
+                    }
+                    break;
+                }
+            }
+        }
+    }
+    function evaluateJsCode() {
+        var _a, _b;
+        // run any dynamic JS code attached to content
+        const jsCode = (_b = (_a = props.builderContextSignal.content) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.jsCode;
+        if (jsCode) {
+            (0, evaluate_1.evaluate)({
+                code: jsCode,
+                context: props.context || {},
+                localState: undefined,
+                rootState: props.builderContextSignal.rootState,
+                rootSetState: props.builderContextSignal.rootSetState,
+            });
+        }
+    }
+    const [httpReqsData, setHttpReqsData] = (0, react_1.useState)(() => ({}));
+    const [clicked, setClicked] = (0, react_1.useState)(() => false);
+    function onClick(event) {
+        var _a, _b;
+        if (props.builderContextSignal.content) {
+            const variationId = (_a = props.builderContextSignal.content) === null || _a === void 0 ? void 0 : _a.testVariationId;
+            const contentId = (_b = props.builderContextSignal.content) === null || _b === void 0 ? void 0 : _b.id;
+            (0, index_js_1._track)({
+                type: "click",
+                canTrack: canTrackToUse,
+                contentId,
+                apiKey: props.apiKey,
+                variationId: variationId !== contentId ? variationId : undefined,
+                ...(0, interaction_js_1.getInteractionPropertiesForEvent)(event),
+                unique: !clicked,
+            });
+        }
+        if (!clicked) {
+            setClicked(true);
+        }
+    }
+    function evalExpression(expression) {
+        return expression.replace(/{{([^}]+)}}/g, (_match, group) => (0, evaluate_1.evaluate)({
+            code: group,
+            context: props.context || {},
+            localState: undefined,
+            rootState: props.builderContextSignal.rootState,
+            rootSetState: props.builderContextSignal.rootSetState,
+        }));
+    }
+    function handleRequest({ url, key }) {
+        (0, get_fetch_js_1.fetch)(url)
+            .then((response) => response.json())
+            .then((json) => {
+            var _a, _b;
+            const newState = {
+                ...props.builderContextSignal.rootState,
+                [key]: json,
+            };
+            (_b = (_a = props.builderContextSignal).rootSetState) === null || _b === void 0 ? void 0 : _b.call(_a, newState);
+            httpReqsData[key] = true;
+        })
+            .catch((err) => {
+            console.error("error fetching dynamic data", url, err);
+        });
+    }
+    function runHttpRequests() {
+        var _a, _b, _c;
+        const requests = (_c = (_b = (_a = props.builderContextSignal.content) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.httpRequests) !== null && _c !== void 0 ? _c : {};
+        Object.entries(requests).forEach(([key, url]) => {
+            if (url && (!httpReqsData[key] || (0, is_editing_js_1.isEditing)())) {
+                const evaluatedUrl = evalExpression(url);
+                handleRequest({
+                    url: evaluatedUrl,
+                    key,
+                });
+            }
+        });
+    }
+    function emitStateUpdate() {
+        if ((0, is_editing_js_1.isEditing)()) {
+            window.dispatchEvent(new CustomEvent("builder:component:stateChange", {
+                detail: {
+                    state: props.builderContextSignal.rootState,
+                    ref: {
+                        name: props.model,
+                    },
+                },
+            }));
+        }
+    }
+    (0, react_1.useEffect)(() => {
+        var _a, _b;
+        if (!props.apiKey) {
+            logger_js_1.logger.error("No API key provided to `RenderContent` component. This can cause issues. Please provide an API key using the `apiKey` prop.");
+        }
+        if ((0, is_browser_js_1.isBrowser)()) {
+            if ((0, is_editing_js_1.isEditing)()) {
+                setForceReRenderCount(forceReRenderCount + 1);
+                window.addEventListener("message", processMessage);
+                (0, init_editing_js_1.registerInsertMenu)();
+                (0, init_editing_js_1.setupBrowserForEditing)({
+                    ...(props.locale
+                        ? {
+                            locale: props.locale,
+                        }
+                        : {}),
+                    ...(props.includeRefs
+                        ? {
+                            includeRefs: props.includeRefs,
+                        }
+                        : {}),
+                    ...(props.enrich
+                        ? {
+                            enrich: props.enrich,
+                        }
+                        : {}),
+                });
+                Object.values(props.builderContextSignal.componentInfos).forEach((registeredComponent) => {
+                    var _a;
+                    const message = (0, register_component_js_1.createRegisterComponentMessage)(registeredComponent);
+                    (_a = window.parent) === null || _a === void 0 ? void 0 : _a.postMessage(message, "*");
+                });
+                window.addEventListener("builder:component:stateChangeListenerActivated", emitStateUpdate);
+            }
+            if (props.builderContextSignal.content) {
+                const variationId = (_a = props.builderContextSignal.content) === null || _a === void 0 ? void 0 : _a.testVariationId;
+                const contentId = (_b = props.builderContextSignal.content) === null || _b === void 0 ? void 0 : _b.id;
+                (0, index_js_1._track)({
+                    type: "impression",
+                    canTrack: canTrackToUse,
+                    contentId,
+                    apiKey: props.apiKey,
+                    variationId: variationId !== contentId ? variationId : undefined,
+                });
+            }
+            // override normal content in preview mode
+            if ((0, is_previewing_js_1.isPreviewing)()) {
+                const searchParams = new URL(location.href).searchParams;
+                const searchParamPreviewModel = searchParams.get("builder.preview");
+                const searchParamPreviewId = searchParams.get(`builder.preview.${searchParamPreviewModel}`);
+                const previewApiKey = searchParams.get("apiKey") || searchParams.get("builder.space");
+                /**
+                 * Make sure that:
+                 * - the preview model name is the same as the one we're rendering, since there can be multiple models rendered  *  at the same time, e.g. header/page/footer.  * - the API key is the same, since we don't want to preview content from other organizations.
+                 * - if there is content, that the preview ID is the same as that of the one we receive.
+                 *
+                 * TO-DO: should we only update the state when there is a change?
+                 **/
+                if (searchParamPreviewModel === props.model &&
+                    previewApiKey === props.apiKey &&
+                    (!props.content || searchParamPreviewId === props.content.id)) {
+                    (0, index_js_2.getContent)({
+                        model: props.model,
+                        apiKey: props.apiKey,
+                        apiVersion: props.builderContextSignal.apiVersion,
+                    }).then((content) => {
+                        if (content) {
+                            mergeNewContent(content);
+                        }
+                    });
+                }
+            }
+            evaluateJsCode();
+            runHttpRequests();
+            emitStateUpdate();
+        }
+    }, []);
+    (0, react_1.useEffect)(() => {
+        if (props.content) {
+            mergeNewContent(props.content);
+        }
+    }, [props.content]);
+    (0, react_1.useEffect)(() => { }, [shouldSendResetCookie]);
+    (0, react_1.useEffect)(() => {
+        evaluateJsCode();
+    }, [
+        (_b = (_a = props.builderContextSignal.content) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.jsCode,
+        props.builderContextSignal.rootState,
+    ]);
+    (0, react_1.useEffect)(() => {
+        runHttpRequests();
+    }, [(_d = (_c = props.builderContextSignal.content) === null || _c === void 0 ? void 0 : _c.data) === null || _d === void 0 ? void 0 : _d.httpRequests]);
+    (0, react_1.useEffect)(() => {
+        emitStateUpdate();
+    }, [props.builderContextSignal.rootState]);
+    (0, react_1.useEffect)(() => {
+        return () => {
+            if ((0, is_browser_js_1.isBrowser)()) {
+                window.removeEventListener("message", processMessage);
+                window.removeEventListener("builder:component:stateChangeListenerActivated", emitStateUpdate);
+            }
+        };
+    }, []);
+    return (React.createElement(builder_context_1.default.Provider, { value: props.builderContextSignal }, props.builderContextSignal.content ? (React.createElement(React.Fragment, null,
+        React.createElement(react_native_1.View, { key: forceReRenderCount, ref: elementRef, onClick: (event) => onClick(event), "builder-content-id": (_e = props.builderContextSignal.content) === null || _e === void 0 ? void 0 : _e.id, "builder-model": props.model, 
+            // currently, we can't set the actual ID here. // we don't need it right now, we just need to identify content divs for testing.
+            dataSet: {
+                "builder-content-id": "",
+            }, ...(props.showContent
+                ? {}
+                : {
+                    hidden: true,
+                    "aria-hidden": true,
+                }) }, props.children))) : null));
+}
+exports.default = EnableEditor;