@gem-sdk/core 1.14.0-next.91 → 1.14.0

package/dist/esm/components/ComponentWrapperPreview.js

@@ -1 +1,68 @@
-import{jsx as t}from"react/jsx-runtime";import{isValidElement as e}from"react";import{composeAdvanceStyle as o}from"../helpers/compose-advance-style.js";import{disableWrap as n}from"./constant.js";let ComponentWrapperPreview=({children:a,...r})=>{if("section"===r.type)return null;let p={};if(r.editorConfigs){let t=r.editorConfigs;t.placeholder?.notAppendBeforeAfter&&(p["data-placeholder-not-append-before-after"]=!0),t.toolbar?.parent&&(p["data-toolbar-parent"]=!0),t.component?.noDelete&&(p["data-component-no-delete"]=!0),t.component?.noDuplicate&&(p["data-component-no-duplicate"]=!0),t.component?.noDragDrop&&(p["data-component-no-drag-drop"]=!0),t.component?.noSetting&&(p["data-component-no-setting"]=!0),t.component?.isThirdParty&&(p["data-component-is-third-party"]=!0),t.toolbar?.hide&&(p["data-toolbar-hide"]=!0),t.slots?.children&&(p["data-slots-children"]=!0)}let d=o(r.advanced,r.tag),l=r.advanced,i={...p,"data-uid":r.uid,"data-component-type":"component","data-component-tag":r.tag,"data-component-label":r.label};return n.includes(r.tag)&&e(a)?t(a.type,{...a.props,style:d,builderAttrs:i,advanced:l}):t("div",{style:d,className:`${r.uid}`,...i,children:a})};export{ComponentWrapperPreview as default};
+import { jsx } from 'react/jsx-runtime';
+import { isValidElement } from 'react';
+import { composeAdvanceStyle } from '../helpers/compose-advance-style.js';
+import { disableWrap } from './constant.js';
+
+const ComponentWrapperPreview = ({ children, ...props })=>{
+    if (props.type === 'section') {
+        return null;
+    }
+    const customProps = {};
+    // Build editor configs
+    if (props.editorConfigs) {
+        const editorConfigs = props.editorConfigs;
+        if (editorConfigs.placeholder?.notAppendBeforeAfter) {
+            customProps['data-placeholder-not-append-before-after'] = true;
+        }
+        if (editorConfigs.toolbar?.parent) {
+            customProps['data-toolbar-parent'] = true;
+        }
+        if (editorConfigs.component?.noDelete) {
+            customProps['data-component-no-delete'] = true;
+        }
+        if (editorConfigs.component?.noDuplicate) {
+            customProps['data-component-no-duplicate'] = true;
+        }
+        if (editorConfigs.component?.noDragDrop) {
+            customProps['data-component-no-drag-drop'] = true;
+        }
+        if (editorConfigs.component?.noSetting) {
+            customProps['data-component-no-setting'] = true;
+        }
+        if (editorConfigs.component?.isThirdParty) {
+            customProps['data-component-is-third-party'] = true;
+        }
+        if (editorConfigs.toolbar?.hide) {
+            customProps['data-toolbar-hide'] = true;
+        }
+        if (editorConfigs.slots?.children) {
+            customProps['data-slots-children'] = true;
+        }
+    }
+    const style = composeAdvanceStyle(props.advanced, props.tag);
+    const advanced = props.advanced;
+    const builderAttrs = {
+        ...customProps,
+        'data-uid': props.uid,
+        'data-component-type': 'component',
+        'data-component-tag': props.tag,
+        'data-component-label': props.label
+    };
+    if (disableWrap.includes(props.tag) && /*#__PURE__*/ isValidElement(children)) {
+        return /*#__PURE__*/ jsx(children.type, {
+            ...children.props,
+            style,
+            builderAttrs,
+            advanced
+        });
+    }
+    // Render
+    return /*#__PURE__*/ jsx("div", {
+        style: style,
+        className: `${props.uid}`,
+        ...builderAttrs,
+        children: children
+    });
+};
+
+export { ComponentWrapperPreview as default };

package/dist/esm/components/Empty.js

@@ -1 +1,3 @@
-let Empty=()=>null;export{Empty as default};
+const Empty = ()=>null;
+
+export { Empty as default };

package/dist/esm/components/Render.js

@@ -1 +1,61 @@
-import{jsx as e,jsxs as r,Fragment as t}from"react/jsx-runtime";import{memo as n}from"react";import{ErrorBoundary as o}from"react-error-boundary";import{useBuilderComponent as i}from"../contexts/BuilderComponent.js";import{useBuilderStore as s}from"../contexts/BuilderContext.js";import d from"./ComponentWrapper.js";import l from"./RenderSection.js";let Render=({uid:n,...m})=>{let a=s(e=>e.getItem(n)),p=i(a?.tag);return a?a?.type==="section"?e(l,{sectionId:a.uid}):e(o,{fallbackRender:({error:n,resetErrorBoundary:o})=>r(t,{children:[e("span",{"aria-label":"Error message",children:n.message}),e("button",{type:"button",onClick:o,children:"Try again"})]}),children:e(d,{...a,children:a?.childrens?.length?e(p,{builderProps:{uid:n,builderData:a},styles:a.styles,setting:a.settings,...m,children:a.childrens.map(r=>e(RenderMemo,{uid:r},r))}):e(p,{builderProps:{uid:n,builderData:a},styles:a.styles,setting:a.settings,...m})})},a.uid):null},RenderMemo=n(Render);RenderMemo.displayName="RenderMemo";export{RenderMemo as default};
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { memo } from 'react';
+import { ErrorBoundary } from 'react-error-boundary';
+import { useBuilderComponent } from '../contexts/BuilderComponent.js';
+import { useBuilderStore } from '../contexts/BuilderContext.js';
+import ComponentWrapper from './ComponentWrapper.js';
+import RenderSectionMemo from './RenderSection.js';
+
+const Render = ({ uid, ...passProps })=>{
+    const item = useBuilderStore((s)=>s.getItem(uid));
+    const Component = useBuilderComponent(item?.tag);
+    if (!item) return null;
+    if (item?.type === 'section') {
+        return /*#__PURE__*/ jsx(RenderSectionMemo, {
+            sectionId: item.uid
+        });
+    } else {
+        return /*#__PURE__*/ jsx(ErrorBoundary, {
+            fallbackRender: ({ error, resetErrorBoundary })=>/*#__PURE__*/ jsxs(Fragment, {
+                    children: [
+                        /*#__PURE__*/ jsx("span", {
+                            "aria-label": "Error message",
+                            children: error.message
+                        }),
+                        /*#__PURE__*/ jsx("button", {
+                            type: "button",
+                            onClick: resetErrorBoundary,
+                            children: "Try again"
+                        })
+                    ]
+                }),
+            children: /*#__PURE__*/ jsx(ComponentWrapper, {
+                ...item,
+                children: item?.childrens?.length ? /*#__PURE__*/ jsx(Component, {
+                    builderProps: {
+                        uid,
+                        builderData: item
+                    },
+                    styles: item.styles,
+                    setting: item.settings,
+                    ...passProps,
+                    children: item.childrens.map((id)=>/*#__PURE__*/ jsx(RenderMemo, {
+                            uid: id
+                        }, id))
+                }) : /*#__PURE__*/ jsx(Component, {
+                    builderProps: {
+                        uid,
+                        builderData: item
+                    },
+                    styles: item.styles,
+                    setting: item.settings,
+                    ...passProps
+                })
+            })
+        }, item.uid);
+    }
+};
+const RenderMemo = /*#__PURE__*/ memo(Render);
+RenderMemo.displayName = 'RenderMemo';
+
+export { RenderMemo as default };

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

@@ -1,3 +1,153 @@
-import"react";import"swr";import{RenderIf as e,template as t}from"../helpers/render.js";import"../helpers/convert.js";import{composeAdvanceStyle as r}from"../helpers/compose-advance-style.js";import{disableWrap as i}from"./constant.js";let componentsRenderWithParentId=["CarouselItem"],componentTexts=["Text","Heading"],Render=({uid:n,builder:s,components:l,parentId:d,extraFiles:a={},...o})=>{let c=s[n],u=l[c?.tag];if(!u)return console.log("Miss component: ",c),{liquid:"",extraFiles:a};if(!c||c?.type==="section")return{liquid:"",extraFiles:a};{let a={extraFiles:{}},p=r(c.advanced,c.tag),m="";return{liquid:m=i.includes(c.tag)?e(c?.childrens?.length,()=>u({builderProps:{uid:n,builderData:c},styles:c.styles,setting:c.settings,style:p,advanced:c.advanced,parentId:componentsRenderWithParentId.includes(c.tag)?d:null,...o,rawChildren:c.childrens.map(e=>({...s[e],uid:e,builder:s,components:l,customProps:a})),children:c.childrens.map(e=>RenderChildren({uid:e,builder:s,components:l,customProps:a})).join("")}),()=>u({builderProps:{uid:n,builderData:c},styles:c.styles,setting:c.settings,advanced:c.advanced,style:p,isText:!!componentTexts.includes(c.tag)||null,parentId:componentsRenderWithParentId.includes(c.tag)?d:null,...o})):t`<div style="${p}" class="${c.uid}">
-      ${e(c?.childrens?.length,()=>u({builderProps:{uid:n,builderData:c},styles:c.styles,setting:c.settings,...o,rawChildren:c.childrens.map(e=>({...s[e],uid:e,builder:s,components:l,customProps:a})),children:c.childrens.map(e=>RenderChildren({uid:e,builder:s,components:l,customProps:a})).join("")}),()=>u({builderProps:{uid:n,builderData:c},styles:c.styles,setting:c.settings,isText:!!componentTexts.includes(c.tag)||null,...o}))}
-      </div>`,extraFiles:a.extraFiles}}},RenderChildren=e=>{let t=Render(e);for(let r in t.extraFiles)if(Object.prototype.hasOwnProperty.call(t.extraFiles,r)){let i=t.extraFiles[r];e.customProps.extraFiles[r]=i}let r=new TextEncoder,i=t?.liquid?r.encode(t.liquid).length:0;if(Math.ceil(i/1024)>=180){let r=`gp-section-snippet-${e.uid}`;return e.customProps.extraFiles[r]=t.liquid,`{% render '${r}', product: product, variant: variant, product_form_id: product_form_id  %}`}return t.liquid};export{RenderChildren,Render as default};
+import 'react';
+import 'swr';
+import { RenderIf, template } from '../helpers/render.js';
+import '../helpers/convert.js';
+import { composeAdvanceStyle } from '../helpers/compose-advance-style.js';
+import { disableWrap } from './constant.js';
+
+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 {
+            liquid: '',
+            extraFiles
+        };
+    }
+    if (!item) {
+        return {
+            liquid: '',
+            extraFiles
+        };
+    }
+    if (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(item?.childrens?.length, ()=>{
+                return Component({
+                    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,
+                            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,
+                    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(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 {
+            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;
+};
+
+export { RenderChildren, Render as default };

package/dist/esm/components/RenderBlock.js

@@ -1 +1,50 @@
-import{jsx as e,jsxs as r}from"react/jsx-runtime";import{memo as t}from"react";import{ErrorBoundary as o}from"react-error-boundary";import{useBuilderComponent as n}from"../contexts/BuilderComponent.js";import{useBuilderStore as l}from"../contexts/BuilderContext.js";import s from"./ComponentWrapper.js";let RenderBlock=({uid:t})=>{let i=l(e=>e.getItem(t)),d=n(i?.tag);return i&&"section"!==i.type?e(o,{fallbackRender:({error:t,resetErrorBoundary:o})=>r(s,{...i,children:[e("span",{"aria-label":"Error message",children:t.message}),e("button",{type:"button",onClick:o,children:"Try again"})]}),children:e(s,{...i,children:i?.childrens?.length?e(d,{builderProps:{uid:t},styles:i.styles??{},setting:i.settings??{},children:i?.childrens?.map(r=>e(RenderBlockMemo,{uid:r},r))}):e(d,{builderProps:{uid:t},styles:i.styles??{},setting:i.settings??{}})})},i.uid):null},RenderBlockMemo=t(RenderBlock);export{RenderBlockMemo as default};
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { memo } from 'react';
+import { ErrorBoundary } from 'react-error-boundary';
+import { useBuilderComponent } from '../contexts/BuilderComponent.js';
+import { useBuilderStore } from '../contexts/BuilderContext.js';
+import ComponentWrapper from './ComponentWrapper.js';
+
+const RenderBlock = ({ uid })=>{
+    const item = useBuilderStore((s)=>s.getItem(uid));
+    const Component = useBuilderComponent(item?.tag);
+    if (!item || item.type === 'section') return null;
+    return /*#__PURE__*/ jsx(ErrorBoundary, {
+        fallbackRender: ({ error, resetErrorBoundary })=>/*#__PURE__*/ jsxs(ComponentWrapper, {
+                ...item,
+                children: [
+                    /*#__PURE__*/ jsx("span", {
+                        "aria-label": "Error message",
+                        children: error.message
+                    }),
+                    /*#__PURE__*/ jsx("button", {
+                        type: "button",
+                        onClick: resetErrorBoundary,
+                        children: "Try again"
+                    })
+                ]
+            }),
+        children: /*#__PURE__*/ jsx(ComponentWrapper, {
+            ...item,
+            children: item?.childrens?.length ? /*#__PURE__*/ jsx(Component, {
+                builderProps: {
+                    uid
+                },
+                styles: item.styles ?? {},
+                setting: item.settings ?? {},
+                children: item?.childrens?.map((id)=>/*#__PURE__*/ jsx(RenderBlockMemo, {
+                        uid: id
+                    }, id))
+            }) : /*#__PURE__*/ jsx(Component, {
+                builderProps: {
+                    uid
+                },
+                styles: item.styles ?? {},
+                setting: item.settings ?? {}
+            })
+        })
+    }, item.uid);
+};
+const RenderBlockMemo = /*#__PURE__*/ memo(RenderBlock);
+
+export { RenderBlockMemo as default };

package/dist/esm/components/RenderPreview.js

@@ -1 +1,62 @@
-import{jsx as e,jsxs as r}from"react/jsx-runtime";import{memo as t}from"react";import{ErrorBoundary as i}from"react-error-boundary";import{useBuilderComponent as n}from"../contexts/BuilderComponent.js";import{useBuilderPreviewStore as o}from"../contexts/BuilderPreviewContext.js";import s from"./ComponentWrapperPreview.js";import d from"./RenderSection.js";let RenderPreview=({uid:t,...l})=>{let m=o(e=>e.getItem(t)),a=n(m?.tag);return m?m?.type==="section"?e(d,{sectionId:m.uid}):e(i,{fallbackRender:({error:t,resetErrorBoundary:i})=>r(s,{...m,children:[e("span",{"aria-label":"Error message",children:t.message}),e("button",{type:"button",onClick:i,children:"Try again"})]}),children:e(s,{...m,children:m?.childrens?.length?e(a,{builderProps:{uid:t,builderData:m},styles:m.styles,setting:m.settings,...l,children:m.childrens.map(r=>e(RenderPreviewMemo,{uid:r},r))}):e(a,{builderProps:{uid:t,builderData:m},styles:m.styles,setting:m.settings,...l})})},m.uid):null},RenderPreviewMemo=t(RenderPreview);RenderPreviewMemo.displayName="RenderPreviewMemo";export{RenderPreviewMemo as default};
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { memo } from 'react';
+import { ErrorBoundary } from 'react-error-boundary';
+import { useBuilderComponent } from '../contexts/BuilderComponent.js';
+import { useBuilderPreviewStore } from '../contexts/BuilderPreviewContext.js';
+import ComponentWrapperPreview from './ComponentWrapperPreview.js';
+import RenderSectionMemo from './RenderSection.js';
+
+const RenderPreview = ({ uid, ...passProps })=>{
+    const item = useBuilderPreviewStore((s)=>s.getItem(uid));
+    const Component = useBuilderComponent(item?.tag);
+    if (!item) return null;
+    if (item?.type === 'section') {
+        return /*#__PURE__*/ jsx(RenderSectionMemo, {
+            sectionId: item.uid
+        });
+    } else {
+        return /*#__PURE__*/ jsx(ErrorBoundary, {
+            fallbackRender: ({ error, resetErrorBoundary })=>/*#__PURE__*/ jsxs(ComponentWrapperPreview, {
+                    ...item,
+                    children: [
+                        /*#__PURE__*/ jsx("span", {
+                            "aria-label": "Error message",
+                            children: error.message
+                        }),
+                        /*#__PURE__*/ jsx("button", {
+                            type: "button",
+                            onClick: resetErrorBoundary,
+                            children: "Try again"
+                        })
+                    ]
+                }),
+            children: /*#__PURE__*/ jsx(ComponentWrapperPreview, {
+                ...item,
+                children: item?.childrens?.length ? /*#__PURE__*/ jsx(Component, {
+                    builderProps: {
+                        uid,
+                        builderData: item
+                    },
+                    styles: item.styles,
+                    setting: item.settings,
+                    ...passProps,
+                    children: item.childrens.map((id)=>/*#__PURE__*/ jsx(RenderPreviewMemo, {
+                            uid: id
+                        }, id))
+                }) : /*#__PURE__*/ jsx(Component, {
+                    builderProps: {
+                        uid,
+                        builderData: item
+                    },
+                    styles: item.styles,
+                    setting: item.settings,
+                    ...passProps
+                })
+            })
+        }, item.uid);
+    }
+};
+const RenderPreviewMemo = /*#__PURE__*/ memo(RenderPreview);
+RenderPreviewMemo.displayName = 'RenderPreviewMemo';
+
+export { RenderPreviewMemo as default };

package/dist/esm/components/RenderSection.js

@@ -1 +1,19 @@
-import{jsx as e}from"react/jsx-runtime";import{memo as t}from"react";import{BuilderProvider as o}from"../contexts/BuilderContext.js";import{useSection as r}from"../contexts/SectionContext.js";import n from"./RenderBlock.js";let RenderSection=({sectionId:t})=>{let i=r(t);return i?e(o,{state:i,children:e(n,{uid:t})},t):null},RenderSectionMemo=t(RenderSection);export{RenderSectionMemo as default};
+import { jsx } from 'react/jsx-runtime';
+import { memo } from 'react';
+import { BuilderProvider } from '../contexts/BuilderContext.js';
+import { useSection } from '../contexts/SectionContext.js';
+import RenderBlockMemo from './RenderBlock.js';
+
+const RenderSection = ({ sectionId })=>{
+    const state = useSection(sectionId);
+    if (!state) return null;
+    return /*#__PURE__*/ jsx(BuilderProvider, {
+        state: state,
+        children: /*#__PURE__*/ jsx(RenderBlockMemo, {
+            uid: sectionId
+        })
+    }, sectionId);
+};
+const RenderSectionMemo = /*#__PURE__*/ memo(RenderSection);
+
+export { RenderSectionMemo as default };

package/dist/esm/components/constant.js

@@ -1 +1,37 @@
-let disableWrap=["Col","CollectionBanner","Row","Section","Image","Text","Button","ProductButton","Cart","Tabs","TabItem","Carousel","CarouselItem","ShopPayButton","AccordionItem","Video","Header","HeroBanner","Icon","IconList","HTMLCode","IconListHoz","IconListItem","CSSCode","FormEmail","FormDropdown","SubmitButton","Dialog","TextField","FormTextarea","ProductPrice","Product","ProductImages"];export{disableWrap};
+const disableWrap = [
+    'Col',
+    'CollectionBanner',
+    'Row',
+    'Section',
+    'Image',
+    'Text',
+    'Button',
+    'ProductButton',
+    'Cart',
+    'Tabs',
+    'TabItem',
+    'Carousel',
+    'CarouselItem',
+    'ShopPayButton',
+    'AccordionItem',
+    'Video',
+    'Header',
+    'HeroBanner',
+    'Icon',
+    'IconList',
+    'HTMLCode',
+    'IconListHoz',
+    'IconListItem',
+    'CSSCode',
+    'FormEmail',
+    'FormDropdown',
+    'SubmitButton',
+    'Dialog',
+    'TextField',
+    'FormTextarea',
+    'ProductPrice',
+    'Product',
+    'ProductImages'
+];
+
+export { disableWrap };

package/dist/esm/contexts/AddonContext.js

@@ -1 +1,32 @@
-import{jsx as o}from"react/jsx-runtime";import{useContext as d,useMemo as e,createContext as n}from"react";import r from"../components/Empty.js";let AddonContext=n(null),AddonProvider=({children:d,components:e,...n})=>o(AddonContext.Provider,{...n,value:{components:e},children:d}),useAddons=()=>{let o=d(AddonContext);if(!o)throw Error("useAddons must be used within an AddonProvider");return e(()=>o.components,[o.components])},useAddon=o=>{let d=useAddons();return e(()=>o?d[o]??r:r,[o,d])};export{AddonProvider,useAddon,useAddons};
+import { jsx } from 'react/jsx-runtime';
+import { useContext, useMemo, createContext } from 'react';
+import Empty from '../components/Empty.js';
+
+const AddonContext = /*#__PURE__*/ createContext(null);
+const AddonProvider = ({ children, components, ...passProps })=>{
+    return /*#__PURE__*/ jsx(AddonContext.Provider, {
+        ...passProps,
+        value: {
+            components
+        },
+        children: children
+    });
+};
+const useAddons = ()=>{
+    const context = useContext(AddonContext);
+    if (!context) {
+        throw new Error('useAddons must be used within an AddonProvider');
+    }
+    return useMemo(()=>context.components, [
+        context.components
+    ]);
+};
+const useAddon = (id)=>{
+    const addons = useAddons();
+    return useMemo(()=>id ? addons[id] ?? Empty : Empty, [
+        id,
+        addons
+    ]);
+};
+
+export { AddonProvider, useAddon, useAddons };

package/dist/esm/contexts/BuilderComponent.js

@@ -1 +1,31 @@
-import{jsx as e}from"react/jsx-runtime";import{useStore as o,createStore as t}from"zustand";import{useContext as r,createContext as n}from"react";import m from"../components/Empty.js";let BuilderComponentContext=n(null),createBuilderComponentStore=e=>t((o,t)=>({components:e,getItem:e=>t().components[e]})),BuilderComponentProvider=({children:o,components:t,...r})=>e(BuilderComponentContext.Provider,{...r,value:createBuilderComponentStore(t),children:o}),useBuilderComponent=e=>{let t=r(BuilderComponentContext);if(!t)throw Error("useBuilderComponent must be used within a BuilderComponentProvider");return o(t,o=>e?o.getItem(e)??m:m)};export{BuilderComponentProvider,useBuilderComponent};
+import { jsx } from 'react/jsx-runtime';
+import { useStore, createStore } from 'zustand';
+import { useContext, createContext } from 'react';
+import Empty from '../components/Empty.js';
+
+const BuilderComponentContext = /*#__PURE__*/ createContext(null);
+const createBuilderComponentStore = (components)=>createStore((_, get)=>({
+            components,
+            getItem: (id)=>{
+                return get().components[id];
+            }
+        }));
+const BuilderComponentProvider = ({ children, components, ...passProps })=>{
+    return /*#__PURE__*/ 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 store = useContext(BuilderComponentContext);
+    if (!store) {
+        throw new Error('useBuilderComponent must be used within a BuilderComponentProvider');
+    }
+    return useStore(store, (s)=>id ? s.getItem(id) ?? Empty : Empty);
+};
+
+export { BuilderComponentProvider, useBuilderComponent };

package/dist/esm/contexts/BuilderContext.js

@@ -1 +1,32 @@
-import{jsx as e}from"react/jsx-runtime";import{useContext as r,createContext as t,Suspense as i,Fragment as u}from"react";import{useStore as d,createStore as o}from"zustand";let BuilderContext=t(null),createBuilderProvider=e=>o((r,t)=>({state:e,getItem:e=>t().state[e]})),BuilderProvider=({children:r,state:t,lazy:d,priority:o,...l})=>{let n=d?i:u,B=createBuilderProvider(t);return e(n,{children:e(BuilderContext.Provider,{...l,value:B,children:r})})},useBuilderStore=(e,t)=>{let i=r(BuilderContext);if(!i)throw Error("useBuilderStore must be used within a BuilderProvider");return d(i,e,t)};export{BuilderProvider,useBuilderStore};
+import { jsx } from 'react/jsx-runtime';
+import { useContext, createContext, Suspense, Fragment } from 'react';
+import { useStore, createStore } from 'zustand';
+
+const BuilderContext = /*#__PURE__*/ createContext(null);
+const createBuilderProvider = (data)=>createStore((_, get)=>({
+            state: data,
+            getItem: (id)=>{
+                return get().state[id];
+            }
+        }));
+const BuilderProvider = ({ children, state, lazy, priority, ...passProps })=>{
+    const Component = lazy ? Suspense : Fragment;
+    const store = createBuilderProvider(state);
+    return /*#__PURE__*/ jsx(Component, {
+        children: /*#__PURE__*/ jsx(BuilderContext.Provider, {
+            ...passProps,
+            value: store,
+            children: children
+        })
+    });
+};
+// export const useBuilderStore = useStore;
+const useBuilderStore = (selector, equalityFn)=>{
+    const store = useContext(BuilderContext);
+    if (!store) {
+        throw new Error('useBuilderStore must be used within a BuilderProvider');
+    }
+    return useStore(store, selector, equalityFn);
+};
+
+export { BuilderProvider, useBuilderStore };