@gem-sdk/core 1.12.0-experimental-8f483e48 → 1.12.0-experimental-d7cbfa75

package/dist/components/AddOn.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+declare const AddOn: React.FC<{
+    name: string;
+}>;
+export default AddOn;
+//# sourceMappingURL=AddOn.d.ts.map

package/dist/components/AddOn.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AddOn.d.ts","sourceRoot":"","sources":["../../src/components/AddOn.tsx"],"names":[],"mappings":";AAGA,QAAA,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,CAOrC,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/dist/components/AddOn.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useAddon } from '../contexts/AddonContext';
+import { usePluginEnable } from '../hooks/shop';
+const AddOn = ({ name }) => {
+    const Comp = useAddon(name);
+    const plugins = usePluginEnable();
+    if (!(plugins === null || plugins === void 0 ? void 0 : plugins.includes(name))) {
+        return null;
+    }
+    return _jsx(Comp, {});
+};
+export default AddOn;

package/dist/components/ComponentWrapper.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import type { BuilderEntity } from '../types';
+declare const ComponentWrapper: React.FC<BuilderEntity & {
+    children: React.ReactNode;
+}>;
+export default ComponentWrapper;
+//# sourceMappingURL=ComponentWrapper.d.ts.map

package/dist/components/ComponentWrapper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ComponentWrapper.d.ts","sourceRoot":"","sources":["../../src/components/ComponentWrapper.tsx"],"names":[],"mappings":";AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAG9C,QAAA,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,GAAG;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,CAe7E,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/components/ComponentWrapper.js

@@ -0,0 +1,27 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { isValidElement } from 'react';
+import { composeAdvanceStyle } from '../helpers/compose-advance-style';
+import { disableWrap } from './constant';
+const ComponentWrapper = (_a) => {
+    var { children } = _a, props = __rest(_a, ["children"]);
+    if (props.type === 'section')
+        return null;
+    const style = composeAdvanceStyle(props.advanced, props.tag);
+    const advanced = props.advanced;
+    if (disableWrap.includes(props.tag) && isValidElement(children)) {
+        return _jsx(children.type, Object.assign({}, children.props, { style, advanced }));
+    }
+    return (_jsx("div", Object.assign({ style: style, className: `${props.uid}` }, { children: children })));
+};
+export default ComponentWrapper;

package/dist/components/ComponentWrapperPreview.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import type { BuilderEntity } from '../types';
+declare const ComponentWrapperPreview: React.FC<BuilderEntity & {
+    children: React.ReactNode;
+}>;
+export default ComponentWrapperPreview;
+//# sourceMappingURL=ComponentWrapperPreview.d.ts.map

package/dist/components/ComponentWrapperPreview.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ComponentWrapperPreview.d.ts","sourceRoot":"","sources":["../../src/components/ComponentWrapperPreview.tsx"],"names":[],"mappings":";AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAG9C,QAAA,MAAM,uBAAuB,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,GAAG;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,CA2DpF,CAAC;AAEF,eAAe,uBAAuB,CAAC"}

package/dist/components/ComponentWrapperPreview.js

@@ -0,0 +1,63 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { isValidElement } from 'react';
+import { composeAdvanceStyle } from '../helpers/compose-advance-style';
+import { disableWrap } from './constant';
+const ComponentWrapperPreview = (_a) => {
+    var _b, _c, _d, _e, _f, _g, _h, _j, _k;
+    var { children } = _a, props = __rest(_a, ["children"]);
+    if (props.type === 'section') {
+        return null;
+    }
+    const customProps = {};
+    // Build editor configs
+    if (props.editorConfigs) {
+        const editorConfigs = props.editorConfigs;
+        if ((_b = editorConfigs.placeholder) === null || _b === void 0 ? void 0 : _b.notAppendBeforeAfter) {
+            customProps['data-placeholder-not-append-before-after'] = true;
+        }
+        if ((_c = editorConfigs.toolbar) === null || _c === void 0 ? void 0 : _c.parent) {
+            customProps['data-toolbar-parent'] = true;
+        }
+        if ((_d = editorConfigs.component) === null || _d === void 0 ? void 0 : _d.noDelete) {
+            customProps['data-component-no-delete'] = true;
+        }
+        if ((_e = editorConfigs.component) === null || _e === void 0 ? void 0 : _e.noDuplicate) {
+            customProps['data-component-no-duplicate'] = true;
+        }
+        if ((_f = editorConfigs.component) === null || _f === void 0 ? void 0 : _f.noDragDrop) {
+            customProps['data-component-no-drag-drop'] = true;
+        }
+        if ((_g = editorConfigs.component) === null || _g === void 0 ? void 0 : _g.noSetting) {
+            customProps['data-component-no-setting'] = true;
+        }
+        if ((_h = editorConfigs.component) === null || _h === void 0 ? void 0 : _h.isThirdParty) {
+            customProps['data-component-is-third-party'] = true;
+        }
+        if ((_j = editorConfigs.toolbar) === null || _j === void 0 ? void 0 : _j.hide) {
+            customProps['data-toolbar-hide'] = true;
+        }
+        if ((_k = editorConfigs.slots) === null || _k === void 0 ? void 0 : _k.children) {
+            customProps['data-slots-children'] = true;
+        }
+    }
+    const style = composeAdvanceStyle(props.advanced, props.tag);
+    const advanced = props.advanced;
+    const builderAttrs = Object.assign(Object.assign({}, customProps), { 'data-uid': props.uid, 'data-component-type': 'component', 'data-component-tag': props.tag, 'data-component-label': props.label });
+    if (disableWrap.includes(props.tag) && isValidElement(children)) {
+        return _jsx(children.type, Object.assign({}, children.props, { style, builderAttrs, advanced }));
+    }
+    // Render
+    return (_jsx("div", Object.assign({ style: style, className: `${props.uid}` }, builderAttrs, { children: children })));
+};
+export default ComponentWrapperPreview;

package/dist/components/Empty.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import type { BaseProps } from '../types';
+declare const Empty: React.FC<BaseProps & {
+    children?: React.ReactNode;
+}>;
+export default Empty;
+//# sourceMappingURL=Empty.d.ts.map

package/dist/components/Empty.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Empty.d.ts","sourceRoot":"","sources":["../../src/components/Empty.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAE1C,QAAA,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,GAAG;IAAE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,CAAc,CAAC;AAE/E,eAAe,KAAK,CAAC"}

package/dist/components/Empty.js

@@ -0,0 +1,2 @@
+const Empty = () => null;
+export default Empty;

package/dist/components/Render.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+type Props = {
+    uid: string;
+    [key: string]: any;
+};
+declare const RenderMemo: React.NamedExoticComponent<Props>;
+export default RenderMemo;
+//# sourceMappingURL=Render.d.ts.map

package/dist/components/Render.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Render.d.ts","sourceRoot":"","sources":["../../src/components/Render.tsx"],"names":[],"mappings":";AAQA,KAAK,KAAK,GAAG;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAAE,CAAC;AA8CjD,QAAA,MAAM,UAAU,mCAAe,CAAC;AAIhC,eAAe,UAAU,CAAC"}

package/dist/components/Render.js

@@ -0,0 +1,36 @@
+'use client';
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo } from 'react';
+import { ErrorBoundary } from 'react-error-boundary';
+import { useBuilderComponent } from '../contexts/BuilderComponent';
+import { useBuilderStore } from '../contexts/BuilderContext';
+import ComponentWrapper from './ComponentWrapper';
+import RenderSection from './RenderSection';
+const Render = (_a) => {
+    var _b;
+    var { uid } = _a, passProps = __rest(_a, ["uid"]);
+    const item = useBuilderStore((s) => s.getItem(uid));
+    const Component = useBuilderComponent(item === null || item === void 0 ? void 0 : item.tag);
+    if (!item)
+        return null;
+    if ((item === null || item === void 0 ? void 0 : item.type) === 'section') {
+        return _jsx(RenderSection, { sectionId: item.uid });
+    }
+    else {
+        return (_jsx(ErrorBoundary, Object.assign({ fallbackRender: ({ error, resetErrorBoundary }) => (_jsxs(_Fragment, { children: [_jsx("span", Object.assign({ "aria-label": "Error message" }, { children: error.message })), _jsx("button", Object.assign({ type: "button", onClick: resetErrorBoundary }, { children: "Try again" }))] })) }, { children: _jsx(ComponentWrapper, Object.assign({}, item, { children: ((_b = item === null || item === void 0 ? void 0 : item.childrens) === null || _b === void 0 ? void 0 : _b.length) ? (_jsx(Component, Object.assign({ builderProps: { uid, builderData: item }, styles: item.styles, setting: item.settings }, passProps, { children: item.childrens.map((id) => (_jsx(RenderMemo, { uid: id }, id))) }))) : (_jsx(Component, Object.assign({ builderProps: { uid, builderData: item }, styles: item.styles, setting: item.settings }, passProps))) })) }), item.uid));
+    }
+};
+const RenderMemo = memo(Render);
+RenderMemo.displayName = 'RenderMemo';
+export default RenderMemo;

package/dist/components/Render.liquid.d.ts

@@ -0,0 +1,17 @@
+type ExtraFiles = {
+    [fileName: string]: string;
+};
+type Props = {
+    uid: string;
+    builder: Record<string, any>;
+    components: Record<string, any>;
+    extraFiles?: ExtraFiles;
+    [key: string]: any;
+};
+declare const Render: ({ uid, builder, components, parentId, extraFiles, ...passProps }: Props) => {
+    liquid: string;
+    extraFiles: ExtraFiles;
+};
+export declare const RenderChildren: (props: Props) => string;
+export default Render;
+//# sourceMappingURL=Render.liquid.d.ts.map

package/dist/components/Render.liquid.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Render.liquid.d.ts","sourceRoot":"","sources":["../../src/components/Render.liquid.ts"],"names":[],"mappings":"AAIA,KAAK,UAAU,GAAG;IAChB,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,CAAC;CAC5B,CAAC;AAEF,KAAK,KAAK,GAAG;IACX,GAAG,EAAE,MAAM,CAAC;IACZ,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC7B,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAChC,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACpB,CAAC;AAKF,QAAA,MAAM,MAAM,qEAOT,KAAK;YACE,MAAM;gBACF,UAAU;CAmGvB,CAAC;AAEF,eAAO,MAAM,cAAc,UAAW,KAAK,WAoB1C,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/dist/components/Render.liquid.js

@@ -0,0 +1,96 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { RenderIf, template } from '../helpers';
+import { composeAdvanceStyle } from '../helpers/compose-advance-style';
+import { disableWrap } from './constant';
+const componentsRenderWithParentId = ['CarouselItem'];
+const componentTexts = ['Text', 'Heading'];
+const Render = (_a) => {
+    var _b, _c;
+    var { uid, builder, components, parentId, extraFiles = {} } = _a, passProps = __rest(_a, ["uid", "builder", "components", "parentId", "extraFiles"]);
+    const item = builder[uid];
+    const Component = components[item === null || item === void 0 ? void 0 : item.tag];
+    if (!Component) {
+        console.log('Miss component: ', item);
+        return {
+            liquid: '',
+            extraFiles,
+        };
+    }
+    if (!item) {
+        return {
+            liquid: '',
+            extraFiles,
+        };
+    }
+    if ((item === null || item === void 0 ? void 0 : item.type) === 'section') {
+        return {
+            liquid: '',
+            extraFiles,
+        };
+    }
+    else {
+        const customProps = {
+            extraFiles: {},
+        };
+        const style = composeAdvanceStyle(item.advanced, item.tag);
+        let liquid = '';
+        if (disableWrap.includes(item.tag)) {
+            liquid = RenderIf((_b = item === null || item === void 0 ? void 0 : item.childrens) === null || _b === void 0 ? void 0 : _b.length, () => {
+                return Component(Object.assign(Object.assign({ builderProps: { uid, builderData: item }, styles: item.styles, setting: item.settings, style, advanced: item.advanced, parentId: componentsRenderWithParentId.includes(item.tag) ? parentId : null }, passProps), { rawChildren: item.childrens.map((id) => {
+                        return Object.assign(Object.assign({}, builder[id]), { uid: id, builder, components, customProps });
+                    }), children: item.childrens
+                        .map((id) => RenderChildren({ uid: id, builder, components, customProps }))
+                        .join('') }));
+            }, () => {
+                return Component(Object.assign({ builderProps: { uid, builderData: item }, styles: item.styles, setting: item.settings, advanced: item.advanced, style, isText: componentTexts.includes(item.tag) ? true : null, parentId: componentsRenderWithParentId.includes(item.tag) ? parentId : null }, passProps));
+            });
+        }
+        else {
+            liquid = template `<div style="${style}" class="${item.uid}">
+      ${RenderIf((_c = item === null || item === void 0 ? void 0 : item.childrens) === null || _c === void 0 ? void 0 : _c.length, () => {
+                return Component(Object.assign(Object.assign({ builderProps: { uid, builderData: item }, styles: item.styles, setting: item.settings }, passProps), { rawChildren: item.childrens.map((id) => {
+                        return Object.assign(Object.assign({}, builder[id]), { uid: id, builder, components, customProps });
+                    }), children: item.childrens
+                        .map((id) => RenderChildren({ uid: id, builder, components, customProps }))
+                        .join('') }));
+            }, () => {
+                return Component(Object.assign({ builderProps: { uid, builderData: item }, styles: item.styles, setting: item.settings, isText: componentTexts.includes(item.tag) ? true : null }, passProps));
+            })}
+      </div>`;
+        }
+        return {
+            liquid,
+            extraFiles: customProps.extraFiles,
+        };
+    }
+};
+export const RenderChildren = (props) => {
+    const data = Render(props);
+    // Append to prop parent
+    for (const key in data.extraFiles) {
+        if (Object.prototype.hasOwnProperty.call(data.extraFiles, key)) {
+            const value = data.extraFiles[key];
+            props.customProps.extraFiles[key] = value;
+        }
+    }
+    // Fix limit 256kb
+    const textEncoder = new TextEncoder();
+    const size = (data === null || data === void 0 ? void 0 : data.liquid) ? textEncoder.encode(data.liquid).length : 0;
+    if (Math.ceil(size / 1024) >= 180) {
+        const fileName = `gp-section-snippet-${props.uid}`;
+        props.customProps.extraFiles[fileName] = data.liquid;
+        return `{% render '${fileName}', product: product, variant: variant, product_form_id: product_form_id  %}`;
+    }
+    return data.liquid;
+};
+export default Render;

package/dist/components/RenderBlock.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+type Props = {
+    uid: string;
+};
+declare const RenderBlockMemo: React.NamedExoticComponent<Props>;
+export default RenderBlockMemo;
+//# sourceMappingURL=RenderBlock.d.ts.map

package/dist/components/RenderBlock.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RenderBlock.d.ts","sourceRoot":"","sources":["../../src/components/RenderBlock.tsx"],"names":[],"mappings":";AAMA,KAAK,KAAK,GAAG;IAAE,GAAG,EAAE,MAAM,CAAA;CAAE,CAAC;AAyC7B,QAAA,MAAM,eAAe,mCAAoB,CAAC;AAE1C,eAAe,eAAe,CAAC"}

package/dist/components/RenderBlock.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo } from 'react';
+import { ErrorBoundary } from 'react-error-boundary';
+import { useBuilderComponent } from '../contexts/BuilderComponent';
+import { useBuilderStore } from '../contexts/BuilderContext';
+import ComponentWrapper from './ComponentWrapper';
+const RenderBlock = ({ uid }) => {
+    var _a, _b, _c, _d, _e, _f;
+    const item = useBuilderStore((s) => s.getItem(uid));
+    const Component = useBuilderComponent(item === null || item === void 0 ? void 0 : item.tag);
+    if (!item || item.type === 'section')
+        return null;
+    return (_jsx(ErrorBoundary, Object.assign({ fallbackRender: ({ error, resetErrorBoundary }) => (_jsxs(ComponentWrapper, Object.assign({}, item, { children: [_jsx("span", Object.assign({ "aria-label": "Error message" }, { children: error.message })), _jsx("button", Object.assign({ type: "button", onClick: resetErrorBoundary }, { children: "Try again" }))] }))) }, { children: _jsx(ComponentWrapper, Object.assign({}, item, { children: ((_a = item === null || item === void 0 ? void 0 : item.childrens) === null || _a === void 0 ? void 0 : _a.length) ? (_jsx(Component, Object.assign({ builderProps: { uid }, styles: (_b = item.styles) !== null && _b !== void 0 ? _b : {}, setting: (_c = item.settings) !== null && _c !== void 0 ? _c : {} }, { children: (_d = item === null || item === void 0 ? void 0 : item.childrens) === null || _d === void 0 ? void 0 : _d.map((id) => (_jsx(RenderBlockMemo, { uid: id }, id))) }))) : (_jsx(Component, { builderProps: { uid }, styles: (_e = item.styles) !== null && _e !== void 0 ? _e : {}, setting: (_f = item.settings) !== null && _f !== void 0 ? _f : {} })) })) }), item.uid));
+};
+const RenderBlockMemo = memo(RenderBlock);
+export default RenderBlockMemo;

package/dist/components/RenderBlockPreview.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+type Props = {
+    uid: string;
+};
+declare const RenderBlockPreviewMemo: React.NamedExoticComponent<Props>;
+export default RenderBlockPreviewMemo;
+//# sourceMappingURL=RenderBlockPreview.d.ts.map

package/dist/components/RenderBlockPreview.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RenderBlockPreview.d.ts","sourceRoot":"","sources":["../../src/components/RenderBlockPreview.tsx"],"names":[],"mappings":";AAMA,KAAK,KAAK,GAAG;IAAE,GAAG,EAAE,MAAM,CAAA;CAAE,CAAC;AA2C7B,QAAA,MAAM,sBAAsB,mCAA2B,CAAC;AAExD,eAAe,sBAAsB,CAAC"}

package/dist/components/RenderBlockPreview.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo } from 'react';
+import { ErrorBoundary } from 'react-error-boundary';
+import { useBuilderComponent } from '../contexts/BuilderComponent';
+import { useBuilderPreviewStore } from '../contexts/BuilderPreviewContext';
+import ComponentWrapperPreview from './ComponentWrapperPreview';
+const RenderBlockPreview = ({ uid }) => {
+    var _a, _b, _c, _d, _e, _f;
+    const item = useBuilderPreviewStore((s) => s.getItem(uid));
+    const Component = useBuilderComponent(item === null || item === void 0 ? void 0 : item.tag);
+    if (!item)
+        return null;
+    if (item.type === 'section') {
+        return null;
+    }
+    return (_jsx(ErrorBoundary, Object.assign({ fallbackRender: ({ error, resetErrorBoundary }) => (_jsxs(ComponentWrapperPreview, Object.assign({}, item, { children: [_jsx("span", Object.assign({ "aria-label": "Error message" }, { children: error.message })), _jsx("button", Object.assign({ type: "button", onClick: resetErrorBoundary }, { children: "Try again" }))] }))) }, { children: _jsx(ComponentWrapperPreview, Object.assign({}, item, { children: ((_a = item === null || item === void 0 ? void 0 : item.childrens) === null || _a === void 0 ? void 0 : _a.length) ? (_jsx(Component, Object.assign({ builderProps: { uid }, styles: (_b = item.styles) !== null && _b !== void 0 ? _b : {}, setting: (_c = item.settings) !== null && _c !== void 0 ? _c : {} }, { children: (_d = item === null || item === void 0 ? void 0 : item.childrens) === null || _d === void 0 ? void 0 : _d.map((id) => (_jsx(RenderBlockPreviewMemo, { uid: id }, id))) }))) : (_jsx(Component, { builderProps: { uid }, styles: (_e = item.styles) !== null && _e !== void 0 ? _e : {}, setting: (_f = item.settings) !== null && _f !== void 0 ? _f : {} })) })) }), item.uid));
+};
+const RenderBlockPreviewMemo = memo(RenderBlockPreview);
+export default RenderBlockPreviewMemo;

package/dist/components/RenderPreview.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+type Props = {
+    uid: string;
+    [key: string]: any;
+};
+declare const RenderPreviewMemo: React.NamedExoticComponent<Props>;
+export default RenderPreviewMemo;
+//# sourceMappingURL=RenderPreview.d.ts.map

package/dist/components/RenderPreview.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RenderPreview.d.ts","sourceRoot":"","sources":["../../src/components/RenderPreview.tsx"],"names":[],"mappings":";AAQA,KAAK,KAAK,GAAG;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAAE,CAAC;AA+CjD,QAAA,MAAM,iBAAiB,mCAAsB,CAAC;AAI9C,eAAe,iBAAiB,CAAC"}

package/dist/components/RenderPreview.js

@@ -0,0 +1,36 @@
+'use client';
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo } from 'react';
+import { ErrorBoundary } from 'react-error-boundary';
+import { useBuilderComponent } from '../contexts/BuilderComponent';
+import { useBuilderPreviewStore } from '../contexts/BuilderPreviewContext';
+import ComponentWrapperPreview from './ComponentWrapperPreview';
+import RenderSectionMemo from './RenderSection';
+const RenderPreview = (_a) => {
+    var _b;
+    var { uid } = _a, passProps = __rest(_a, ["uid"]);
+    const item = useBuilderPreviewStore((s) => s.getItem(uid));
+    const Component = useBuilderComponent(item === null || item === void 0 ? void 0 : item.tag);
+    if (!item)
+        return null;
+    if ((item === null || item === void 0 ? void 0 : item.type) === 'section') {
+        return _jsx(RenderSectionMemo, { sectionId: item.uid });
+    }
+    else {
+        return (_jsx(ErrorBoundary, Object.assign({ fallbackRender: ({ error, resetErrorBoundary }) => (_jsxs(ComponentWrapperPreview, Object.assign({}, item, { children: [_jsx("span", Object.assign({ "aria-label": "Error message" }, { children: error.message })), _jsx("button", Object.assign({ type: "button", onClick: resetErrorBoundary }, { children: "Try again" }))] }))) }, { children: _jsx(ComponentWrapperPreview, Object.assign({}, item, { children: ((_b = item === null || item === void 0 ? void 0 : item.childrens) === null || _b === void 0 ? void 0 : _b.length) ? (_jsx(Component, Object.assign({ builderProps: { uid, builderData: item }, styles: item.styles, setting: item.settings }, passProps, { children: item.childrens.map((id) => (_jsx(RenderPreviewMemo, { uid: id }, id))) }))) : (_jsx(Component, Object.assign({ builderProps: { uid, builderData: item }, styles: item.styles, setting: item.settings }, passProps))) })) }), item.uid));
+    }
+};
+const RenderPreviewMemo = memo(RenderPreview);
+RenderPreviewMemo.displayName = 'RenderPreviewMemo';
+export default RenderPreviewMemo;

package/dist/components/RenderSection.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+type Props = {
+    sectionId: string;
+};
+declare const RenderSectionMemo: React.NamedExoticComponent<Props>;
+export default RenderSectionMemo;
+//# sourceMappingURL=RenderSection.d.ts.map

package/dist/components/RenderSection.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RenderSection.d.ts","sourceRoot":"","sources":["../../src/components/RenderSection.tsx"],"names":[],"mappings":";AAKA,KAAK,KAAK,GAAG;IAAE,SAAS,EAAE,MAAM,CAAA;CAAE,CAAC;AAanC,QAAA,MAAM,iBAAiB,mCAAsB,CAAC;AAE9C,eAAe,iBAAiB,CAAC"}

package/dist/components/RenderSection.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { memo } from 'react';
+import { BuilderProvider } from '../contexts/BuilderContext';
+import { useSection } from '../contexts/SectionContext';
+import RenderBlock from './RenderBlock';
+const RenderSection = ({ sectionId }) => {
+    const state = useSection(sectionId);
+    if (!state)
+        return null;
+    return (_jsx(BuilderProvider, Object.assign({ state: state }, { children: _jsx(RenderBlock, { uid: sectionId }) }), sectionId));
+};
+const RenderSectionMemo = memo(RenderSection);
+export default RenderSectionMemo;

package/dist/components/constant.d.ts

@@ -0,0 +1,2 @@
+export declare const disableWrap: string[];
+//# sourceMappingURL=constant.d.ts.map

package/dist/components/constant.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"constant.d.ts","sourceRoot":"","sources":["../../src/components/constant.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,WAAW,UAgCvB,CAAC"}

package/dist/{esm/components → components}/constant.js

@@ -1,4 +1,4 @@
-const disableWrap = [
+export const disableWrap = [
     'Col',
     'CollectionBanner',
     'Row',
@@ -31,5 +31,3 @@ const disableWrap = [
     'FormTextarea',
     'ProductPrice',
 ];
-
-export { disableWrap };

package/dist/components/index.d.ts

@@ -0,0 +1,8 @@
+import AddOn from './AddOn';
+import Render from './Render';
+import RenderPreview from './RenderPreview';
+import RenderLiquid from './Render.liquid';
+import { RenderChildren } from './Render.liquid';
+import { disableWrap } from './constant';
+export { Render, RenderPreview, AddOn, RenderLiquid, RenderChildren, disableWrap };
+//# sourceMappingURL=index.d.ts.map

package/dist/components/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,SAAS,CAAC;AAC5B,OAAO,MAAM,MAAM,UAAU,CAAC;AAC9B,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAC5C,OAAO,YAAY,MAAM,iBAAiB,CAAC;AAC3C,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAEzC,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,KAAK,EAAE,YAAY,EAAE,cAAc,EAAE,WAAW,EAAE,CAAC"}

package/dist/components/index.js

@@ -0,0 +1,7 @@
+import AddOn from './AddOn';
+import Render from './Render';
+import RenderPreview from './RenderPreview';
+import RenderLiquid from './Render.liquid';
+import { RenderChildren } from './Render.liquid';
+import { disableWrap } from './constant';
+export { Render, RenderPreview, AddOn, RenderLiquid, RenderChildren, disableWrap };

package/dist/contexts/AddonContext.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+export type AddonContextProps = {
+    components: Record<string, React.ComponentType<any>>;
+};
+export type AddonProviderProps = Pick<AddonContextProps, 'components'> & {
+    children: React.ReactNode;
+    key?: React.Key;
+};
+export declare const AddonProvider: React.FC<AddonProviderProps>;
+export declare const useAddons: () => Record<string, React.ComponentType<any>>;
+export declare const useAddon: (id?: string) => React.ComponentType<any> | React.FC<import("..").BaseProps & {
+    children?: React.ReactNode;
+}>;
+//# sourceMappingURL=AddonContext.d.ts.map

package/dist/contexts/AddonContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AddonContext.d.ts","sourceRoot":"","sources":["../../src/contexts/AddonContext.tsx"],"names":[],"mappings":";AAIA,MAAM,MAAM,iBAAiB,GAAG;IAC9B,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC;CACtD,CAAC;AAIF,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,iBAAiB,EAAE,YAAY,CAAC,GAAG;IACvE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC;CACjB,CAAC;AACF,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAUtD,CAAC;AAEF,eAAO,MAAM,SAAS,gDAMrB,CAAC;AAEF,eAAO,MAAM,QAAQ,QAAS,MAAM;;EAGnC,CAAC"}

package/dist/contexts/AddonContext.js

@@ -0,0 +1,31 @@
+'use client';
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext, useMemo } from 'react';
+import Empty from '../components/Empty';
+const AddonContext = createContext(null);
+export const AddonProvider = (_a) => {
+    var { children, components } = _a, passProps = __rest(_a, ["children", "components"]);
+    return (_jsx(AddonContext.Provider, Object.assign({}, passProps, { value: { components } }, { children: children })));
+};
+export const useAddons = () => {
+    const context = useContext(AddonContext);
+    if (!context) {
+        throw new Error('useAddons must be used within an AddonProvider');
+    }
+    return useMemo(() => context.components, [context.components]);
+};
+export const useAddon = (id) => {
+    const addons = useAddons();
+    return useMemo(() => { var _a; return (id ? (_a = addons[id]) !== null && _a !== void 0 ? _a : Empty : Empty); }, [id, addons]);
+};

package/dist/contexts/BuilderComponent.d.ts

@@ -0,0 +1,16 @@
+/// <reference types="react" />
+import type { BaseProps } from '../types';
+type BuilderComponentProps = {
+    components: Record<string, React.ComponentType<any>>;
+    getItem: (id: string) => React.ComponentType<BaseProps> | undefined;
+};
+export type BuilderComponentProviderProps = Pick<BuilderComponentProps, 'components'> & {
+    children: React.ReactNode;
+    key?: React.Key;
+};
+export declare const BuilderComponentProvider: React.FC<BuilderComponentProviderProps>;
+export declare const useBuilderComponent: (id?: string) => React.FC<BaseProps & {
+    children?: React.ReactNode;
+}> | React.ComponentType<BaseProps>;
+export {};
+//# sourceMappingURL=BuilderComponent.d.ts.map

package/dist/contexts/BuilderComponent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BuilderComponent.d.ts","sourceRoot":"","sources":["../../src/contexts/BuilderComponent.tsx"],"names":[],"mappings":";AAKA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAE1C,KAAK,qBAAqB,GAAG;IAC3B,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC;IACrD,OAAO,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,KAAK,CAAC,aAAa,CAAC,SAAS,CAAC,GAAG,SAAS,CAAC;CACrE,CAAC;AAYF,MAAM,MAAM,6BAA6B,GAAG,IAAI,CAAC,qBAAqB,EAAE,YAAY,CAAC,GAAG;IACtF,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC;CACjB,CAAC;AACF,eAAO,MAAM,wBAAwB,EAAE,KAAK,CAAC,EAAE,CAAC,6BAA6B,CAa5E,CAAC;AAMF,eAAO,MAAM,mBAAmB,QAAS,MAAM;;mCAM9C,CAAC"}

package/dist/contexts/BuilderComponent.js

@@ -0,0 +1,37 @@
+'use client';
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useStore, createStore } from 'zustand';
+import { createContext, useContext } from 'react';
+import Empty from '../components/Empty';
+const BuilderComponentContext = createContext(null);
+const createBuilderComponentStore = (components) => createStore((_, get) => ({
+    components,
+    getItem: (id) => {
+        return get().components[id];
+    },
+}));
+export const BuilderComponentProvider = (_a) => {
+    var { children, components } = _a, passProps = __rest(_a, ["children", "components"]);
+    return (_jsx(BuilderComponentContext.Provider, Object.assign({}, passProps, { value: createBuilderComponentStore(components) }, { children: children })));
+};
+// export const useBuilderComponent = (id?: string) => {
+//   return useStore((s) => (id ? s.getItem(id) ?? Empty : Empty));
+// };
+export const useBuilderComponent = (id) => {
+    const store = useContext(BuilderComponentContext);
+    if (!store) {
+        throw new Error('useBuilderComponent must be used within a BuilderComponentProvider');
+    }
+    return useStore(store, (s) => { var _a; return (id ? (_a = s.getItem(id)) !== null && _a !== void 0 ? _a : Empty : Empty); });
+};