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

package/dist/components/block/block.js

@@ -0,0 +1,141 @@
+"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 get_block_component_options_js_1 = require("../../functions/get-block-component-options.js");
+const get_block_properties_js_1 = require("../../functions/get-block-properties.js");
+const get_processed_block_js_1 = require("../../functions/get-processed-block.js");
+const block_styles_1 = __importDefault(require("./components/block-styles"));
+const block_helpers_js_1 = require("./block.helpers.js");
+const repeated_block_1 = __importDefault(require("./components/repeated-block"));
+const extract_text_styles_js_1 = require("../../functions/extract-text-styles.js");
+const component_ref_1 = __importDefault(require("./components/component-ref/component-ref"));
+const block_wrapper_1 = __importDefault(require("./components/block-wrapper"));
+function Block(props) {
+    var _a, _b, _c, _d;
+    function blockComponent() {
+        return (0, block_helpers_js_1.getComponent)({
+            block: props.block,
+            context: props.context,
+            registeredComponents: props.registeredComponents,
+        });
+    }
+    function repeatItem() {
+        return (0, block_helpers_js_1.getRepeatItemData)({
+            block: props.block,
+            context: props.context,
+        });
+    }
+    function processedBlock() {
+        return repeatItem()
+            ? props.block
+            : (0, get_processed_block_js_1.getProcessedBlock)({
+                block: props.block,
+                localState: props.context.localState,
+                rootState: props.context.rootState,
+                rootSetState: props.context.rootSetState,
+                context: props.context.context,
+                shouldEvaluateBindings: true,
+            });
+    }
+    function Tag() {
+        return props.block.tagName || "div";
+    }
+    function canShowBlock() {
+        if ("hide" in processedBlock()) {
+            return !processedBlock().hide;
+        }
+        if ("show" in processedBlock()) {
+            return processedBlock().show;
+        }
+        return true;
+    }
+    function childrenWithoutParentComponent() {
+        var _a, _b;
+        /**
+         * When there is no `componentRef`, there might still be children that need to be rendered. In this case,
+         * we render them outside of `componentRef`.
+         * NOTE: We make sure not to render this if `repeatItemData` is non-null, because that means we are rendering an array of
+         * blocks, and the children will be repeated within those blocks.
+         */
+        const shouldRenderChildrenOutsideRef = !((_a = blockComponent === null || blockComponent === void 0 ? void 0 : blockComponent()) === null || _a === void 0 ? void 0 : _a.component) && !repeatItem();
+        return shouldRenderChildrenOutsideRef
+            ? (_b = processedBlock().children) !== null && _b !== void 0 ? _b : []
+            : [];
+    }
+    function componentRefProps() {
+        var _a, _b, _c, _d, _e, _f;
+        return {
+            blockChildren: (_a = processedBlock().children) !== null && _a !== void 0 ? _a : [],
+            componentRef: (_b = blockComponent === null || blockComponent === void 0 ? void 0 : blockComponent()) === null || _b === void 0 ? void 0 : _b.component,
+            componentOptions: {
+                ...(0, get_block_component_options_js_1.getBlockComponentOptions)(processedBlock()),
+                builderContext: props.context,
+                ...(((_c = blockComponent === null || blockComponent === void 0 ? void 0 : blockComponent()) === null || _c === void 0 ? void 0 : _c.name) === "Symbol" ||
+                    ((_d = blockComponent === null || blockComponent === void 0 ? void 0 : blockComponent()) === null || _d === void 0 ? void 0 : _d.name) === "Columns"
+                    ? {
+                        builderComponents: props.registeredComponents,
+                    }
+                    : {}),
+            },
+            context: childrenContext,
+            registeredComponents: props.registeredComponents,
+            builderBlock: processedBlock(),
+            includeBlockProps: ((_e = blockComponent === null || blockComponent === void 0 ? void 0 : blockComponent()) === null || _e === void 0 ? void 0 : _e.noWrap) === true,
+            isInteractive: !((_f = blockComponent === null || blockComponent === void 0 ? void 0 : blockComponent()) === null || _f === void 0 ? void 0 : _f.isRSC),
+        };
+    }
+    const [childrenContext, setChildrenContext] = (0, react_1.useState)(() => ({
+        apiKey: props.context.apiKey,
+        apiVersion: props.context.apiVersion,
+        localState: props.context.localState,
+        rootState: props.context.rootState,
+        rootSetState: props.context.rootSetState,
+        content: props.context.content,
+        context: props.context.context,
+        componentInfos: props.context.componentInfos,
+        inheritedStyles: (0, extract_text_styles_js_1.extractTextStyles)((0, get_block_properties_js_1.getBlockProperties)({
+            block: processedBlock(),
+            context: props.context,
+        }).style || {}),
+    }));
+    return (React.createElement(React.Fragment, null, canShowBlock() ? (React.createElement(React.Fragment, null, !((_a = blockComponent === null || blockComponent === void 0 ? void 0 : blockComponent()) === null || _a === void 0 ? void 0 : _a.noWrap) ? (React.createElement(React.Fragment, null,
+        (0, block_helpers_js_1.isEmptyHtmlElement)(Tag()) ? (React.createElement(React.Fragment, null,
+            React.createElement(block_wrapper_1.default, { Wrapper: Tag(), block: processedBlock(), context: props.context, hasChildren: false }))) : null,
+        !(0, block_helpers_js_1.isEmptyHtmlElement)(Tag()) && repeatItem() ? (React.createElement(React.Fragment, null, (_b = repeatItem()) === null || _b === void 0 ? void 0 : _b.map((data, index) => (React.createElement(repeated_block_1.default, { key: index, repeatContext: data.context, block: data.block, registeredComponents: props.registeredComponents }))))) : null,
+        !(0, block_helpers_js_1.isEmptyHtmlElement)(Tag()) && !repeatItem() ? (React.createElement(React.Fragment, null,
+            React.createElement(block_wrapper_1.default, { Wrapper: Tag(), block: processedBlock(), context: props.context, hasChildren: true },
+                React.createElement(component_ref_1.default, { ...componentRefProps() }), (_c = childrenWithoutParentComponent()) === null || _c === void 0 ? void 0 :
+                _c.map((child) => (React.createElement(Block, { key: "block-" + child.id, block: child, context: childrenContext, registeredComponents: props.registeredComponents }))), (_d = childrenWithoutParentComponent()) === null || _d === void 0 ? void 0 :
+                _d.map((child) => (React.createElement(block_styles_1.default, { key: "block-style-" + child.id, block: child, context: childrenContext })))))) : null)) : (React.createElement(React.Fragment, null,
+        React.createElement(component_ref_1.default, { ...componentRefProps() }))))) : null));
+}
+exports.default = Block;

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

@@ -0,0 +1,95 @@
+"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 device_sizes_js_1 = require("../../../constants/device-sizes.js");
+const target_js_1 = require("../../../constants/target.js");
+const get_processed_block_js_1 = require("../../../functions/get-processed-block.js");
+const css_js_1 = require("../../../helpers/css.js");
+const nullable_js_1 = require("../../../helpers/nullable.js");
+const inlined_styles_1 = __importDefault(require("../../inlined-styles"));
+function BlockStyles(props) {
+    const [processedBlock, setProcessedBlock] = (0, react_1.useState)(() => (0, get_processed_block_js_1.getProcessedBlock)({
+        block: props.block,
+        localState: props.context.localState,
+        rootState: props.context.rootState,
+        rootSetState: props.context.rootSetState,
+        context: props.context.context,
+        shouldEvaluateBindings: true,
+    }));
+    function canShowBlock() {
+        // only render styles for blocks that are visible
+        if ((0, nullable_js_1.checkIsDefined)(processedBlock.hide)) {
+            return !processedBlock.hide;
+        }
+        if ((0, nullable_js_1.checkIsDefined)(processedBlock.show)) {
+            return processedBlock.show;
+        }
+        return true;
+    }
+    function css() {
+        var _a;
+        const styles = processedBlock.responsiveStyles;
+        const content = props.context.content;
+        const sizesWithUpdatedBreakpoints = (0, device_sizes_js_1.getSizesForBreakpoints)(((_a = content === null || content === void 0 ? void 0 : content.meta) === null || _a === void 0 ? void 0 : _a.breakpoints) || {});
+        const largeStyles = styles === null || styles === void 0 ? void 0 : styles.large;
+        const mediumStyles = styles === null || styles === void 0 ? void 0 : styles.medium;
+        const smallStyles = styles === null || styles === void 0 ? void 0 : styles.small;
+        const className = processedBlock.id;
+        if (!className) {
+            return "";
+        }
+        const largeStylesClass = largeStyles
+            ? (0, css_js_1.createCssClass)({
+                className,
+                styles: largeStyles,
+            })
+            : "";
+        const mediumStylesClass = mediumStyles
+            ? (0, css_js_1.createCssClass)({
+                className,
+                styles: mediumStyles,
+                mediaQuery: (0, device_sizes_js_1.getMaxWidthQueryForSize)("medium", sizesWithUpdatedBreakpoints),
+            })
+            : "";
+        const smallStylesClass = smallStyles
+            ? (0, css_js_1.createCssClass)({
+                className,
+                styles: smallStyles,
+                mediaQuery: (0, device_sizes_js_1.getMaxWidthQueryForSize)("small", sizesWithUpdatedBreakpoints),
+            })
+            : "";
+        return [largeStylesClass, mediumStylesClass, smallStylesClass].join(" ");
+    }
+    return (React.createElement(React.Fragment, null, target_js_1.TARGET !== "reactNative" && css() && canShowBlock() ? (React.createElement(React.Fragment, null,
+        React.createElement(inlined_styles_1.default, { styles: css() }))) : null));
+}
+exports.default = BlockStyles;

package/dist/components/block/components/block-wrapper/block-wrapper.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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const React = __importStar(require("react"));
+const react_native_1 = require("react-native");
+const interactive_element_helpers_js_1 = require("../interactive-element/interactive-element.helpers.js");
+function BlockWrapper(props) {
+    return (React.createElement(React.Fragment, null, props.hasChildren ? (React.createElement(React.Fragment, null,
+        React.createElement(props.Wrapper, { ...(0, interactive_element_helpers_js_1.getBlockProps)({
+                block: props.block,
+                contextValue: props.context,
+            }) }, props.children))) : (React.createElement(React.Fragment, null,
+        React.createElement(props.Wrapper, { ...(0, interactive_element_helpers_js_1.getBlockProps)({
+                block: props.block,
+                contextValue: props.context,
+            }) })))));
+}
+exports.default = BlockWrapper;

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

@@ -0,0 +1,56 @@
+"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 BlockWrapper(props) {
+    return (React.createElement(React.Fragment, null, props.hasChildren ? (React.createElement(React.Fragment, null,
+        React.createElement(props.Wrapper, { ...(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,
+                stripPrefix: true,
+            }) }, props.children))) : (React.createElement(React.Fragment, null,
+        React.createElement(props.Wrapper, { ...(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,
+                stripPrefix: true,
+            }) })))));
+}
+exports.default = BlockWrapper;

package/dist/components/block/components/component-ref/component-ref.helpers.js

@@ -0,0 +1,40 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getWrapperProps = 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 get_block_properties_js_1 = require("../../../../functions/get-block-properties.js");
+const getWrapperProps = ({ componentOptions, builderBlock, context, componentRef, includeBlockProps, isInteractive, contextValue }) => {
+    const interactiveElementProps = {
+        Wrapper: componentRef,
+        block: builderBlock,
+        context,
+        wrapperProps: componentOptions
+    };
+    return isInteractive ? interactiveElementProps : __spreadValues(__spreadValues({}, componentOptions), includeBlockProps ? {
+        attributes: (0, get_block_properties_js_1.getBlockProperties)({
+            block: builderBlock,
+            context: contextValue
+        })
+    } : {});
+};
+exports.getWrapperProps = getWrapperProps;

package/dist/components/block/components/component-ref/component-ref.js

@@ -0,0 +1,63 @@
+"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 block_styles_1 = __importDefault(require("../block-styles"));
+const block_1 = __importDefault(require("../../block"));
+const interactive_element_1 = __importDefault(require("../interactive-element"));
+const component_ref_helpers_js_1 = require("./component-ref.helpers.js");
+const builder_context_1 = __importDefault(require("../../../../context/builder.context"));
+function ComponentRef(props) {
+    var _a, _b;
+    const [Wrapper, setWrapper] = (0, react_1.useState)(() => props.isInteractive ? interactive_element_1.default : props.componentRef);
+    return (React.createElement(builder_context_1.default.Provider, { value: {
+            content: props.context.content,
+            rootState: props.context.rootState,
+            localState: props.context.localState,
+            context: props.context.context,
+            apiKey: props.context.apiKey,
+            componentInfos: props.context.componentInfos,
+            inheritedStyles: props.context.inheritedStyles,
+            apiVersion: props.context.apiVersion,
+        } }, props.componentRef ? (React.createElement(React.Fragment, null,
+        React.createElement(Wrapper, { ...(0, component_ref_helpers_js_1.getWrapperProps)({
+                componentOptions: props.componentOptions,
+                builderBlock: props.builderBlock,
+                context: props.context,
+                componentRef: props.componentRef,
+                includeBlockProps: props.includeBlockProps,
+                isInteractive: props.isInteractive,
+                contextValue: props.context,
+            }) }, (_a = props.blockChildren) === null || _a === void 0 ? void 0 :
+            _a.map((child) => (React.createElement(block_1.default, { key: "block-" + child.id, block: child, context: props.context, registeredComponents: props.registeredComponents }))), (_b = props.blockChildren) === null || _b === void 0 ? void 0 :
+            _b.map((child) => (React.createElement(block_styles_1.default, { key: "block-style-" + child.id, block: child, context: props.context })))))) : null));
+}
+exports.default = ComponentRef;

package/dist/components/block/components/component-ref.js

@@ -0,0 +1,81 @@
+"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 block_styles_1 = __importDefault(require("./block-styles"));
+const block_1 = __importDefault(require("../block"));
+const get_block_properties_js_1 = require("../../../functions/get-block-properties.js");
+const block_wrapper_1 = __importDefault(require("./block-wrapper"));
+const builder_context_js_1 = __importDefault(require("../../../context/builder.context.js"));
+function ComponentRef(props) {
+    var _a, _b;
+    const [Wrapper, setWrapper] = (0, react_1.useState)(() => props.isRSC ? props.componentRef : block_wrapper_1.default);
+    function wrapperProps() {
+        const blockWrapperProps = {
+            Wrapper: props.componentRef,
+            block: props.builderBlock,
+            context: props.context,
+            wrapperProps: props.componentOptions,
+            shouldNestAttributes: true,
+        };
+        return props.isRSC
+            ? {
+                ...props.componentOptions,
+                /**
+                 * If `noWrap` is set to `true`, then the block's props/attributes are provided to the  * component itself directly. Otherwise, they are provided to the wrapper element.  */ ...(props.includeBlockProps
+                    ? {
+                        attributes: (0, get_block_properties_js_1.getBlockProperties)({
+                            block: props.builderBlock,
+                            context: props.context,
+                        }),
+                    }
+                    : {}),
+            }
+            : blockWrapperProps;
+    }
+    return (React.createElement(builder_context_js_1.default.Provider, { value: {
+            content: props.context.content,
+            rootState: props.context.rootState,
+            localState: props.context.localState,
+            context: props.context.context,
+            apiKey: props.context.apiKey,
+            componentInfos: props.context.componentInfos,
+            inheritedStyles: props.context.inheritedStyles,
+            apiVersion: props.context.apiVersion,
+        } },
+        React.createElement(Wrapper, { ...wrapperProps() },
+            " ", (_a = props.blockChildren) === null || _a === void 0 ? void 0 :
+            _a.map((child) => (React.createElement(block_1.default, { key: "block-" + child.id, block: child, context: props.context, registeredComponents: props.registeredComponents }))),
+            " ", (_b = props.blockChildren) === null || _b === void 0 ? void 0 :
+            _b.map((child) => (React.createElement(block_styles_1.default, { key: "block-style-" + child.id, block: child, context: props.context }))),
+            " ")));
+}
+exports.default = ComponentRef;

package/dist/components/block/components/component.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-styles"));
+const block_1 = __importDefault(require("../block"));
+function Component(props) {
+    var _a, _b;
+    return (React.createElement(React.Fragment, null, props.componentRef ? (React.createElement(React.Fragment, null,
+        React.createElement(props.componentRef, { ...props.componentOptions }, (_a = props.blockChildren) === null || _a === void 0 ? void 0 :
+            _a.map((child) => (React.createElement(block_1.default, { key: "render-block-" + child.id, block: child, context: props.context, components: props.components }))), (_b = props.blockChildren) === null || _b === void 0 ? void 0 :
+            _b.map((child) => (React.createElement(block_styles_1.default, { key: "block-style-" + child.id, block: child, context: props.context })))))) : null));
+}
+exports.default = Component;

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

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getBlockProps = 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 get_block_actions_1 = require("../../../../functions/get-block-actions");
+const get_block_properties_1 = require("../../../../functions/get-block-properties");
+const getBlockProps = ({ block, contextValue }) => {
+    const blockProps = __spreadValues(__spreadValues({}, (0, get_block_properties_1.getBlockProperties)({
+        block,
+        context: contextValue
+    })), (0, get_block_actions_1.getBlockActions)({
+        block,
+        rootState: contextValue.rootState,
+        rootSetState: contextValue.rootSetState,
+        localState: contextValue.localState,
+        context: contextValue.context
+    }));
+    return blockProps;
+};
+exports.getBlockProps = getBlockProps;

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

@@ -0,0 +1,36 @@
+"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 interactive_element_helpers_js_1 = require("./interactive-element.helpers.js");
+function InteractiveElement(props) {
+    return (React.createElement(props.Wrapper, { ...props.wrapperProps, attributes: (0, interactive_element_helpers_js_1.getBlockProps)({
+            block: props.block,
+            contextValue: props.context,
+        }) }, props.children));
+}
+exports.default = InteractiveElement;