@gem-sdk/core 1.11.1-staging-ff93eab1 → 1.12.0-experimental-8f483e48

package/dist/cjs/components/AddOn.js

@@ -6,13 +6,13 @@ var jsxRuntime = require('react/jsx-runtime');
 var AddonContext = require('../contexts/AddonContext.js');
 var shop = require('../hooks/shop.js');
 
-const AddOn = ({ name  })=>{
+const AddOn = ({ name }) => {
     const Comp = AddonContext.useAddon(name);
     const plugins = shop.usePluginEnable();
     if (!plugins?.includes(name)) {
         return null;
     }
-    return /*#__PURE__*/ jsxRuntime.jsx(Comp, {});
+    return jsxRuntime.jsx(Comp, {});
 };
 
 exports.default = AddOn;

package/dist/cjs/components/ComponentWrapper.js

@@ -7,22 +7,15 @@ var react = require('react');
 var composeAdvanceStyle = require('../helpers/compose-advance-style.js');
 var constant = require('./constant.js');
 
-const ComponentWrapper = ({ children , ...props })=>{
-    if (props.type === 'section') return null;
+const ComponentWrapper = ({ children, ...props }) => {
+    if (props.type === 'section')
+        return null;
     const style = composeAdvanceStyle.composeAdvanceStyle(props.advanced, props.tag);
     const advanced = props.advanced;
-    if (constant.disableWrap.includes(props.tag) && /*#__PURE__*/ react.isValidElement(children)) {
-        return /*#__PURE__*/ jsxRuntime.jsx(children.type, {
-            ...children.props,
-            style,
-            advanced
-        });
+    if (constant.disableWrap.includes(props.tag) && react.isValidElement(children)) {
+        return jsxRuntime.jsx(children.type, { ...children.props, ...{ style, advanced } });
     }
-    return /*#__PURE__*/ jsxRuntime.jsx("div", {
-        style: style,
-        className: `${props.uid}`,
-        children: children
-    });
+    return (jsxRuntime.jsx("div", { style: style, className: `${props.uid}`, children: children }));
 };
 
 exports.default = ComponentWrapper;

package/dist/cjs/components/ComponentWrapperPreview.js

@@ -7,7 +7,7 @@ var react = require('react');
 var composeAdvanceStyle = require('../helpers/compose-advance-style.js');
 var constant = require('./constant.js');
 
-const ComponentWrapperPreview = ({ children , ...props })=>{
+const ComponentWrapperPreview = ({ children, ...props }) => {
     if (props.type === 'section') {
         return null;
     }
@@ -50,23 +50,13 @@ const ComponentWrapperPreview = ({ children , ...props })=>{
         'data-uid': props.uid,
         'data-component-type': 'component',
         'data-component-tag': props.tag,
-        'data-component-label': props.label
+        'data-component-label': props.label,
     };
-    if (constant.disableWrap.includes(props.tag) && /*#__PURE__*/ react.isValidElement(children)) {
-        return /*#__PURE__*/ jsxRuntime.jsx(children.type, {
-            ...children.props,
-            style,
-            builderAttrs,
-            advanced
-        });
+    if (constant.disableWrap.includes(props.tag) && react.isValidElement(children)) {
+        return jsxRuntime.jsx(children.type, { ...children.props, ...{ style, builderAttrs, advanced } });
     }
     // Render
-    return /*#__PURE__*/ jsxRuntime.jsx("div", {
-        style: style,
-        className: `${props.uid}`,
-        ...builderAttrs,
-        children: children
-    });
+    return (jsxRuntime.jsx("div", { style: style, className: `${props.uid}`, ...builderAttrs, children: children }));
 };
 
 exports.default = ComponentWrapperPreview;

package/dist/cjs/components/Empty.js

@@ -2,6 +2,6 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const Empty = ()=>null;
+const Empty = () => null;
 
 exports.default = Empty;

package/dist/cjs/components/Render.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
@@ -10,56 +11,19 @@ var BuilderContext = require('../contexts/BuilderContext.js');
 var ComponentWrapper = require('./ComponentWrapper.js');
 var RenderSection = require('./RenderSection.js');
 
-const Render = ({ uid , ...passProps })=>{
-    const item = BuilderContext.useBuilderStore((s)=>s.getItem(uid));
+const Render = ({ uid, ...passProps }) => {
+    const item = BuilderContext.useBuilderStore((s) => s.getItem(uid));
     const Component = BuilderComponent.useBuilderComponent(item?.tag);
-    if (!item) return null;
+    if (!item)
+        return null;
     if (item?.type === 'section') {
-        return /*#__PURE__*/ jsxRuntime.jsx(RenderSection.default, {
-            sectionId: item.uid
-        });
-    } else {
-        return /*#__PURE__*/ jsxRuntime.jsx(reactErrorBoundary.ErrorBoundary, {
-            fallbackRender: ({ error , resetErrorBoundary  })=>/*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
-                    children: [
-                        /*#__PURE__*/ jsxRuntime.jsx("span", {
-                            "aria-label": "Error message",
-                            children: error.message
-                        }),
-                        /*#__PURE__*/ jsxRuntime.jsx("button", {
-                            type: "button",
-                            onClick: resetErrorBoundary,
-                            children: "Try again"
-                        })
-                    ]
-                }),
-            children: /*#__PURE__*/ jsxRuntime.jsx(ComponentWrapper.default, {
-                ...item,
-                children: item?.childrens?.length ? /*#__PURE__*/ jsxRuntime.jsx(Component, {
-                    builderProps: {
-                        uid,
-                        builderData: item
-                    },
-                    styles: item.styles,
-                    setting: item.settings,
-                    ...passProps,
-                    children: item.childrens.map((id)=>/*#__PURE__*/ jsxRuntime.jsx(RenderMemo, {
-                            uid: id
-                        }, id))
-                }) : /*#__PURE__*/ jsxRuntime.jsx(Component, {
-                    builderProps: {
-                        uid,
-                        builderData: item
-                    },
-                    styles: item.styles,
-                    setting: item.settings,
-                    ...passProps
-                })
-            })
-        }, item.uid);
+        return jsxRuntime.jsx(RenderSection.default, { sectionId: item.uid });
+    }
+    else {
+        return (jsxRuntime.jsx(reactErrorBoundary.ErrorBoundary, { fallbackRender: ({ error, resetErrorBoundary }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("span", { "aria-label": "Error message", children: error.message }), jsxRuntime.jsx("button", { type: "button", onClick: resetErrorBoundary, children: "Try again" })] })), children: jsxRuntime.jsx(ComponentWrapper.default, { ...item, children: item?.childrens?.length ? (jsxRuntime.jsx(Component, { builderProps: { uid, builderData: item }, styles: item.styles, setting: item.settings, ...passProps, children: item.childrens.map((id) => (jsxRuntime.jsx(RenderMemo, { uid: id }, id))) })) : (jsxRuntime.jsx(Component, { builderProps: { uid, builderData: item }, styles: item.styles, setting: item.settings, ...passProps })) }) }, item.uid));
     }
 };
-const RenderMemo = /*#__PURE__*/ react.memo(Render);
+const RenderMemo = react.memo(Render);
 RenderMemo.displayName = 'RenderMemo';
 
 exports.default = RenderMemo;

package/dist/cjs/components/Render.liquid.js

@@ -3,107 +3,122 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 require('react');
-require('swr');
 var render = require('../helpers/render.js');
 require('../helpers/convert.js');
 var composeAdvanceStyle = require('../helpers/compose-advance-style.js');
 var constant = require('./constant.js');
 
-const componentsRenderWithParentId = [
-    'CarouselItem'
-];
-const componentTexts = [
-    'Text',
-    'Heading'
-];
-const Render = ({ uid , builder , components , parentId , ...passProps })=>{
+const componentsRenderWithParentId = ['CarouselItem'];
+const componentTexts = ['Text', 'Heading'];
+const Render = ({ uid, builder, components, parentId, extraFiles = {}, ...passProps }) => {
     const item = builder[uid];
     const Component = components[item?.tag];
     if (!Component) {
         console.log('Miss component: ', item);
-        return '';
+        return {
+            liquid: '',
+            extraFiles,
+        };
+    }
+    if (!item) {
+        return {
+            liquid: '',
+            extraFiles,
+        };
     }
-    if (!item) return null;
     if (item?.type === 'section') {
-        return '';
-    } else {
+        return {
+            liquid: '',
+            extraFiles,
+        };
+    }
+    else {
+        const customProps = {
+            extraFiles: {},
+        };
         const style = composeAdvanceStyle.composeAdvanceStyle(item.advanced, item.tag);
+        let liquid = '';
         if (constant.disableWrap.includes(item.tag)) {
-            return render.RenderIf(item?.childrens?.length, ()=>{
+            liquid = render.RenderIf(item?.childrens?.length, () => {
                 return Component({
-                    builderProps: {
-                        uid,
-                        builderData: item
-                    },
+                    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 {
-                            ...builder[id],
-                            uid: id,
-                            builder,
-                            components
-                        };
+                    rawChildren: item.childrens.map((id) => {
+                        return { ...builder[id], uid: id, builder, components, customProps };
                     }),
-                    children: item.childrens.map((id)=>Render({
-                            uid: id,
-                            builder,
-                            components,
-                            parentId: uid
-                        })).join('')
+                    children: item.childrens
+                        .map((id) => RenderChildren({ uid: id, builder, components, customProps }))
+                        .join(''),
                 });
-            }, ()=>Component({
-                    builderProps: {
-                        uid,
-                        builderData: item
-                    },
+            }, () => {
+                return Component({
+                    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
-                }));
+                    ...passProps,
+                });
+            });
+        }
+        else {
+            liquid = render.template `<div style="${style}" class="${item.uid}">
+      ${render.RenderIf(item?.childrens?.length, () => {
+                return Component({
+                    builderProps: { uid, builderData: item },
+                    styles: item.styles,
+                    setting: item.settings,
+                    ...passProps,
+                    rawChildren: item.childrens.map((id) => {
+                        return { ...builder[id], uid: id, builder, components, customProps };
+                    }),
+                    children: item.childrens
+                        .map((id) => RenderChildren({ uid: id, builder, components, customProps }))
+                        .join(''),
+                });
+            }, () => {
+                return Component({
+                    builderProps: { uid, builderData: item },
+                    styles: item.styles,
+                    setting: item.settings,
+                    isText: componentTexts.includes(item.tag) ? true : null,
+                    ...passProps,
+                });
+            })}
+      </div>`;
         }
-        return render.template`<div style="${style}" class="${item.uid}">
-    ${render.RenderIf(item?.childrens?.length, ()=>Component({
-                builderProps: {
-                    uid,
-                    builderData: item
-                },
-                styles: item.styles,
-                setting: item.settings,
-                ...passProps,
-                rawChildren: item.childrens.map((id)=>{
-                    return {
-                        ...builder[id],
-                        uid: id,
-                        builder,
-                        components
-                    };
-                }),
-                children: item.childrens.map((id)=>Render({
-                        uid: id,
-                        builder,
-                        components
-                    })).join('')
-            }), ()=>Component({
-                builderProps: {
-                    uid,
-                    builderData: item
-                },
-                styles: item.styles,
-                setting: item.settings,
-                isText: componentTexts.includes(item.tag) ? true : null,
-                ...passProps
-            }))}
-    </div>`;
+        return {
+            liquid,
+            extraFiles: customProps.extraFiles,
+        };
+    }
+};
+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?.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;
 };
 
+exports.RenderChildren = RenderChildren;
 exports.default = Render;

package/dist/cjs/components/RenderBlock.js

@@ -9,46 +9,13 @@ var BuilderComponent = require('../contexts/BuilderComponent.js');
 var BuilderContext = require('../contexts/BuilderContext.js');
 var ComponentWrapper = require('./ComponentWrapper.js');
 
-const RenderBlock = ({ uid  })=>{
-    const item = BuilderContext.useBuilderStore((s)=>s.getItem(uid));
+const RenderBlock = ({ uid }) => {
+    const item = BuilderContext.useBuilderStore((s) => s.getItem(uid));
     const Component = BuilderComponent.useBuilderComponent(item?.tag);
-    if (!item || item.type === 'section') return null;
-    return /*#__PURE__*/ jsxRuntime.jsx(reactErrorBoundary.ErrorBoundary, {
-        fallbackRender: ({ error , resetErrorBoundary  })=>/*#__PURE__*/ jsxRuntime.jsxs(ComponentWrapper.default, {
-                ...item,
-                children: [
-                    /*#__PURE__*/ jsxRuntime.jsx("span", {
-                        "aria-label": "Error message",
-                        children: error.message
-                    }),
-                    /*#__PURE__*/ jsxRuntime.jsx("button", {
-                        type: "button",
-                        onClick: resetErrorBoundary,
-                        children: "Try again"
-                    })
-                ]
-            }),
-        children: /*#__PURE__*/ jsxRuntime.jsx(ComponentWrapper.default, {
-            ...item,
-            children: item?.childrens?.length ? /*#__PURE__*/ jsxRuntime.jsx(Component, {
-                builderProps: {
-                    uid
-                },
-                styles: item.styles ?? {},
-                setting: item.settings ?? {},
-                children: item?.childrens?.map((id)=>/*#__PURE__*/ jsxRuntime.jsx(RenderBlockMemo, {
-                        uid: id
-                    }, id))
-            }) : /*#__PURE__*/ jsxRuntime.jsx(Component, {
-                builderProps: {
-                    uid
-                },
-                styles: item.styles ?? {},
-                setting: item.settings ?? {}
-            })
-        })
-    }, item.uid);
+    if (!item || item.type === 'section')
+        return null;
+    return (jsxRuntime.jsx(reactErrorBoundary.ErrorBoundary, { fallbackRender: ({ error, resetErrorBoundary }) => (jsxRuntime.jsxs(ComponentWrapper.default, { ...item, children: [jsxRuntime.jsx("span", { "aria-label": "Error message", children: error.message }), jsxRuntime.jsx("button", { type: "button", onClick: resetErrorBoundary, children: "Try again" })] })), children: jsxRuntime.jsx(ComponentWrapper.default, { ...item, children: item?.childrens?.length ? (jsxRuntime.jsx(Component, { builderProps: { uid }, styles: item.styles ?? {}, setting: item.settings ?? {}, children: item?.childrens?.map((id) => (jsxRuntime.jsx(RenderBlockMemo, { uid: id }, id))) })) : (jsxRuntime.jsx(Component, { builderProps: { uid }, styles: item.styles ?? {}, setting: item.settings ?? {} })) }) }, item.uid));
 };
-const RenderBlockMemo = /*#__PURE__*/ react.memo(RenderBlock);
+const RenderBlockMemo = react.memo(RenderBlock);
 
 exports.default = RenderBlockMemo;

package/dist/cjs/components/RenderPreview.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
@@ -10,57 +11,19 @@ var BuilderPreviewContext = require('../contexts/BuilderPreviewContext.js');
 var ComponentWrapperPreview = require('./ComponentWrapperPreview.js');
 var RenderSection = require('./RenderSection.js');
 
-const RenderPreview = ({ uid , ...passProps })=>{
-    const item = BuilderPreviewContext.useBuilderPreviewStore((s)=>s.getItem(uid));
+const RenderPreview = ({ uid, ...passProps }) => {
+    const item = BuilderPreviewContext.useBuilderPreviewStore((s) => s.getItem(uid));
     const Component = BuilderComponent.useBuilderComponent(item?.tag);
-    if (!item) return null;
+    if (!item)
+        return null;
     if (item?.type === 'section') {
-        return /*#__PURE__*/ jsxRuntime.jsx(RenderSection.default, {
-            sectionId: item.uid
-        });
-    } else {
-        return /*#__PURE__*/ jsxRuntime.jsx(reactErrorBoundary.ErrorBoundary, {
-            fallbackRender: ({ error , resetErrorBoundary  })=>/*#__PURE__*/ jsxRuntime.jsxs(ComponentWrapperPreview.default, {
-                    ...item,
-                    children: [
-                        /*#__PURE__*/ jsxRuntime.jsx("span", {
-                            "aria-label": "Error message",
-                            children: error.message
-                        }),
-                        /*#__PURE__*/ jsxRuntime.jsx("button", {
-                            type: "button",
-                            onClick: resetErrorBoundary,
-                            children: "Try again"
-                        })
-                    ]
-                }),
-            children: /*#__PURE__*/ jsxRuntime.jsx(ComponentWrapperPreview.default, {
-                ...item,
-                children: item?.childrens?.length ? /*#__PURE__*/ jsxRuntime.jsx(Component, {
-                    builderProps: {
-                        uid,
-                        builderData: item
-                    },
-                    styles: item.styles,
-                    setting: item.settings,
-                    ...passProps,
-                    children: item.childrens.map((id)=>/*#__PURE__*/ jsxRuntime.jsx(RenderPreviewMemo, {
-                            uid: id
-                        }, id))
-                }) : /*#__PURE__*/ jsxRuntime.jsx(Component, {
-                    builderProps: {
-                        uid,
-                        builderData: item
-                    },
-                    styles: item.styles,
-                    setting: item.settings,
-                    ...passProps
-                })
-            })
-        }, item.uid);
+        return jsxRuntime.jsx(RenderSection.default, { sectionId: item.uid });
+    }
+    else {
+        return (jsxRuntime.jsx(reactErrorBoundary.ErrorBoundary, { fallbackRender: ({ error, resetErrorBoundary }) => (jsxRuntime.jsxs(ComponentWrapperPreview.default, { ...item, children: [jsxRuntime.jsx("span", { "aria-label": "Error message", children: error.message }), jsxRuntime.jsx("button", { type: "button", onClick: resetErrorBoundary, children: "Try again" })] })), children: jsxRuntime.jsx(ComponentWrapperPreview.default, { ...item, children: item?.childrens?.length ? (jsxRuntime.jsx(Component, { builderProps: { uid, builderData: item }, styles: item.styles, setting: item.settings, ...passProps, children: item.childrens.map((id) => (jsxRuntime.jsx(RenderPreviewMemo, { uid: id }, id))) })) : (jsxRuntime.jsx(Component, { builderProps: { uid, builderData: item }, styles: item.styles, setting: item.settings, ...passProps })) }) }, item.uid));
     }
 };
-const RenderPreviewMemo = /*#__PURE__*/ react.memo(RenderPreview);
+const RenderPreviewMemo = react.memo(RenderPreview);
 RenderPreviewMemo.displayName = 'RenderPreviewMemo';
 
 exports.default = RenderPreviewMemo;

package/dist/cjs/components/RenderSection.js

@@ -8,16 +8,12 @@ var BuilderContext = require('../contexts/BuilderContext.js');
 var SectionContext = require('../contexts/SectionContext.js');
 var RenderBlock = require('./RenderBlock.js');
 
-const RenderSection = ({ sectionId  })=>{
+const RenderSection = ({ sectionId }) => {
     const state = SectionContext.useSection(sectionId);
-    if (!state) return null;
-    return /*#__PURE__*/ jsxRuntime.jsx(BuilderContext.BuilderProvider, {
-        state: state,
-        children: /*#__PURE__*/ jsxRuntime.jsx(RenderBlock.default, {
-            uid: sectionId
-        })
-    }, sectionId);
+    if (!state)
+        return null;
+    return (jsxRuntime.jsx(BuilderContext.BuilderProvider, { state: state, children: jsxRuntime.jsx(RenderBlock.default, { uid: sectionId }) }, sectionId));
 };
-const RenderSectionMemo = /*#__PURE__*/ react.memo(RenderSection);
+const RenderSectionMemo = react.memo(RenderSection);
 
 exports.default = RenderSectionMemo;

package/dist/cjs/components/constant.js

@@ -31,7 +31,7 @@ const disableWrap = [
     'Dialog',
     'TextField',
     'FormTextarea',
-    'ProductPrice'
+    'ProductPrice',
 ];
 
 exports.disableWrap = disableWrap;

package/dist/cjs/contexts/AddonContext.js

@@ -1,34 +1,24 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
 var react = require('react');
 var Empty = require('../components/Empty.js');
 
-const AddonContext = /*#__PURE__*/ react.createContext(null);
-const AddonProvider = ({ children , components , ...passProps })=>{
-    return /*#__PURE__*/ jsxRuntime.jsx(AddonContext.Provider, {
-        ...passProps,
-        value: {
-            components
-        },
-        children: children
-    });
+const AddonContext = react.createContext(null);
+const AddonProvider = ({ children, components, ...passProps }) => {
+    return (jsxRuntime.jsx(AddonContext.Provider, { ...passProps, value: { components }, children: children }));
 };
-const useAddons = ()=>{
+const useAddons = () => {
     const context = react.useContext(AddonContext);
     if (!context) {
         throw new Error('useAddons must be used within an AddonProvider');
     }
-    return react.useMemo(()=>context.components, [
-        context.components
-    ]);
+    return react.useMemo(() => context.components, [context.components]);
 };
-const useAddon = (id)=>{
+const useAddon = (id) => {
     const addons = useAddons();
-    return react.useMemo(()=>id ? addons[id] ?? Empty.default : Empty.default, [
-        id,
-        addons
-    ]);
+    return react.useMemo(() => (id ? addons[id] ?? Empty.default : Empty.default), [id, addons]);
 };
 
 exports.AddonProvider = AddonProvider;

package/dist/cjs/contexts/BuilderComponent.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
@@ -5,29 +6,25 @@ var zustand = require('zustand');
 var react = require('react');
 var Empty = require('../components/Empty.js');
 
-const BuilderComponentContext = /*#__PURE__*/ react.createContext(null);
-const createBuilderComponentStore = (components)=>zustand.createStore((_, get)=>({
-            components,
-            getItem: (id)=>{
-                return get().components[id];
-            }
-        }));
-const BuilderComponentProvider = ({ children , components , ...passProps })=>{
-    return /*#__PURE__*/ jsxRuntime.jsx(BuilderComponentContext.Provider, {
-        ...passProps,
-        value: createBuilderComponentStore(components),
-        children: children
-    });
+const BuilderComponentContext = react.createContext(null);
+const createBuilderComponentStore = (components) => zustand.createStore((_, get) => ({
+    components,
+    getItem: (id) => {
+        return get().components[id];
+    },
+}));
+const BuilderComponentProvider = ({ children, components, ...passProps }) => {
+    return (jsxRuntime.jsx(BuilderComponentContext.Provider, { ...passProps, value: createBuilderComponentStore(components), children: children }));
 };
 // export const useBuilderComponent = (id?: string) => {
 //   return useStore((s) => (id ? s.getItem(id) ?? Empty : Empty));
 // };
-const useBuilderComponent = (id)=>{
+const useBuilderComponent = (id) => {
     const store = react.useContext(BuilderComponentContext);
     if (!store) {
         throw new Error('useBuilderComponent must be used within a BuilderComponentProvider');
     }
-    return zustand.useStore(store, (s)=>id ? s.getItem(id) ?? Empty.default : Empty.default);
+    return zustand.useStore(store, (s) => (id ? s.getItem(id) ?? Empty.default : Empty.default));
 };
 
 exports.BuilderComponentProvider = BuilderComponentProvider;

package/dist/cjs/contexts/BuilderContext.js

@@ -1,29 +1,24 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
 var react = require('react');
 var zustand = require('zustand');
 
-const BuilderContext = /*#__PURE__*/ react.createContext(null);
-const createBuilderProvider = (data)=>zustand.createStore((_, get)=>({
-            state: data,
-            getItem: (id)=>{
-                return get().state[id];
-            }
-        }));
-const BuilderProvider = ({ children , state , lazy , priority , ...passProps })=>{
+const BuilderContext = react.createContext(null);
+const createBuilderProvider = (data) => zustand.createStore((_, get) => ({
+    state: data,
+    getItem: (id) => {
+        return get().state[id];
+    },
+}));
+const BuilderProvider = ({ children, state, lazy, priority, ...passProps }) => {
     const Component = lazy ? react.Suspense : react.Fragment;
     const store = createBuilderProvider(state);
-    return /*#__PURE__*/ jsxRuntime.jsx(Component, {
-        children: /*#__PURE__*/ jsxRuntime.jsx(BuilderContext.Provider, {
-            ...passProps,
-            value: store,
-            children: children
-        })
-    });
+    return (jsxRuntime.jsx(Component, { children: jsxRuntime.jsx(BuilderContext.Provider, { ...passProps, value: store, children: children }) }));
 };
 // export const useBuilderStore = useStore;
-const useBuilderStore = (selector, equalityFn)=>{
+const useBuilderStore = (selector, equalityFn) => {
     const store = react.useContext(BuilderContext);
     if (!store) {
         throw new Error('useBuilderStore must be used within a BuilderProvider');