@gem-sdk/plugin-cart-drawer 1.11.1 → 1.14.0-dev.284

package/dist/esm/components/CartDrawer.js

@@ -1,138 +1 @@
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { useCartData, useCartUI, cls, CartLineProvider } from '@gem-sdk/core';
-import { useRef } from 'react';
-import { Transition } from 'react-transition-group';
-import CartDiscountCode from './CartDiscountCode.js';
-import CartFooter from './CartFooter.js';
-import CartLineItem from './CartLineItem.js';
-import CartOrderNote from './CartOrderNote.js';
-
-const duration = 300;
-const defaultStyle = {
-    transition: `opacity ${duration}ms ease-in-out`,
-    opacity: 0
-};
-const transitionStyles = {
-    entering: {
-        opacity: 1
-    },
-    entered: {
-        opacity: 1
-    },
-    exiting: {
-        opacity: 0
-    },
-    exited: {
-        opacity: 0
-    },
-    unmounted: {
-        opacity: 0
-    }
-};
-const CartDrawer = ({ className , style , setting  })=>{
-    const { data , isLoading: loading , error  } = useCartData();
-    const { closeCart , isCartOpen  } = useCartUI();
-    const nodeRef = useRef(null);
-    return /*#__PURE__*/ jsx(Transition, {
-        in: isCartOpen,
-        timeout: duration,
-        nodeRef: nodeRef,
-        children: (state)=>/*#__PURE__*/ jsxs("div", {
-                ref: nodeRef,
-                className: cls('fixed inset-0 z-90', className, {
-                    invisible: !isCartOpen,
-                    visible: isCartOpen
-                }),
-                style: {
-                    ...style,
-                    ...defaultStyle,
-                    ...transitionStyles[state]
-                },
-                children: [
-                    /*#__PURE__*/ jsx("div", {
-                        "aria-hidden": true,
-                        onClick: ()=>closeCart(),
-                        className: "fixed inset-0 z-80 bg-slate-600/40"
-                    }),
-                    /*#__PURE__*/ jsx("div", {
-                        className: "fixed inset-y-0 right-0 z-90 flex w-full max-w-[400px] flex-col bg-white text-g-text-1 shadow-2xl mobile:w-full",
-                        children: loading ? /*#__PURE__*/ jsx("div", {
-                            className: "w-full pt-10 text-center",
-                            children: "Loading..."
-                        }) : error ? /*#__PURE__*/ jsxs("div", {
-                            className: "w-full pt-10 text-center text-g-error",
-                            children: [
-                                "Error: ",
-                                error?.[0]?.message
-                            ]
-                        }) : /*#__PURE__*/ jsxs(Fragment, {
-                            children: [
-                                /*#__PURE__*/ jsxs("div", {
-                                    className: "flex items-center justify-between border-b border-b-g-line-3 px-6 py-3",
-                                    children: [
-                                        /*#__PURE__*/ jsx("span", {
-                                            className: "font-g-heading text-xl font-semibold",
-                                            children: setting?.title
-                                        }),
-                                        /*#__PURE__*/ jsx("button", {
-                                            onClick: closeCart,
-                                            title: "Close cart drawer",
-                                            children: /*#__PURE__*/ jsx("svg", {
-                                                className: "w-5",
-                                                fill: "currentColor",
-                                                viewBox: "0 0 24 24",
-                                                xmlns: "http://www.w3.org/2000/svg",
-                                                children: /*#__PURE__*/ jsx("path", {
-                                                    d: "m4.397 4.554.073-.084a.75.75 0 0 1 .976-.073l.084.073L12 10.939l6.47-6.47a.75.75 0 1 1 1.06 1.061L13.061 12l6.47 6.47a.75.75 0 0 1 .072.976l-.073.084a.75.75 0 0 1-.976.073l-.084-.073L12 13.061l-6.47 6.47a.75.75 0 0 1-1.06-1.061L10.939 12l-6.47-6.47a.75.75 0 0 1-.072-.976l.073-.084-.073.084Z"
-                                                })
-                                            })
-                                        })
-                                    ]
-                                }),
-                                /*#__PURE__*/ jsx("div", {
-                                    className: "group h-full overflow-y-auto px-6 pb-4 scrollbar:!h-1.5 scrollbar:!w-1.5 scrollbar:bg-transparent scrollbar-track:!rounded scrollbar-track:!bg-slate-100 scrollbar-thumb:!rounded scrollbar-thumb:!bg-slate-300",
-                                    children: !data || !data.lineItems.length ? /*#__PURE__*/ jsx("div", {
-                                        className: "w-full pt-10 text-center",
-                                        children: setting?.emptyLabel
-                                    }) : /*#__PURE__*/ jsxs(Fragment, {
-                                        children: [
-                                            /*#__PURE__*/ jsx("div", {
-                                                className: "flex flex-col",
-                                                children: data.lineItems.map((line)=>{
-                                                    if (!line) return null;
-                                                    return /*#__PURE__*/ jsx(CartLineProvider, {
-                                                        line: line,
-                                                        children: /*#__PURE__*/ jsx(CartLineItem, {})
-                                                    }, line.id);
-                                                })
-                                            }),
-                                            /*#__PURE__*/ jsx(CartOrderNote, {
-                                                placeholder: "Leave your order note here...",
-                                                triggerUpdate: "blur"
-                                            })
-                                        ]
-                                    })
-                                }),
-                                /*#__PURE__*/ jsx(CartDiscountCode, {}),
-                                !!data && !!data.lineItems.length && /*#__PURE__*/ jsx(CartFooter, {
-                                    openMode: setting?.openMode,
-                                    checkoutUrl: data.checkoutUrl,
-                                    price: data?.totalPrice,
-                                    currencyCode: data?.currency.code
-                                })
-                            ]
-                        })
-                    })
-                ]
-            })
-    });
-};
-CartDrawer.defaultProps = {
-    setting: {
-        title: 'Your Cart',
-        emptyLabel: 'Your cart is empty',
-        openMode: 'page'
-    }
-};
-
-export { CartDrawer as default };
+import{jsx as e,jsxs as t,Fragment as r}from"react/jsx-runtime";import{useCartData as l,useCartUI as i,cls as a,CartLineProvider as o}from"@gem-sdk/core";import{useRef as n}from"react";import{Transition as s}from"react-transition-group";import c from"./CartDiscountCode.js";import d from"./CartFooter.js";import m from"./CartLineItem.js";import p from"./CartOrderNote.js";let duration=300,defaultStyle={transition:"opacity 300ms ease-in-out",opacity:0},transitionStyles={entering:{opacity:1},entered:{opacity:1},exiting:{opacity:0},exited:{opacity:0},unmounted:{opacity:0}},CartDrawer=({className:u,style:f,setting:h})=>{let{data:b,isLoading:g,error:x}=l(),{closeCart:y,isCartOpen:w}=i(),v=n(null);return e(s,{in:w,timeout:300,nodeRef:v,children:l=>t("div",{ref:v,className:a("fixed inset-0 z-90",u,{invisible:!w,visible:w}),style:{...f,...defaultStyle,...transitionStyles[l]},children:[e("div",{"aria-hidden":!0,onClick:()=>y(),className:"fixed inset-0 z-80 bg-slate-600/40"}),e("div",{className:"fixed inset-y-0 right-0 z-90 flex w-full max-w-[400px] flex-col bg-white text-g-text-1 shadow-2xl mobile:w-full",children:g?e("div",{className:"w-full pt-10 text-center",children:"Loading..."}):x?t("div",{className:"w-full pt-10 text-center text-g-error",children:["Error: ",x?.[0]?.message]}):t(r,{children:[t("div",{className:"flex items-center justify-between border-b border-b-g-line-3 px-6 py-3",children:[e("span",{className:"font-g-heading text-xl font-semibold",children:h?.title}),e("button",{onClick:y,title:"Close cart drawer",children:e("svg",{className:"w-5",fill:"currentColor",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg",children:e("path",{d:"m4.397 4.554.073-.084a.75.75 0 0 1 .976-.073l.084.073L12 10.939l6.47-6.47a.75.75 0 1 1 1.06 1.061L13.061 12l6.47 6.47a.75.75 0 0 1 .072.976l-.073.084a.75.75 0 0 1-.976.073l-.084-.073L12 13.061l-6.47 6.47a.75.75 0 0 1-1.06-1.061L10.939 12l-6.47-6.47a.75.75 0 0 1-.072-.976l.073-.084-.073.084Z"})})})]}),e("div",{className:"group h-full overflow-y-auto px-6 pb-4 scrollbar:!h-1.5 scrollbar:!w-1.5 scrollbar:bg-transparent scrollbar-track:!rounded scrollbar-track:!bg-slate-100 scrollbar-thumb:!rounded scrollbar-thumb:!bg-slate-300",children:b&&b.lineItems.length?t(r,{children:[e("div",{className:"flex flex-col",children:b.lineItems.map(t=>t?e(o,{line:t,children:e(m,{})},t.id):null)}),e(p,{placeholder:"Leave your order note here...",triggerUpdate:"blur"})]}):e("div",{className:"w-full pt-10 text-center",children:h?.emptyLabel})}),e(c,{}),!!b&&!!b.lineItems.length&&e(d,{openMode:h?.openMode,checkoutUrl:b.checkoutUrl,price:b?.totalPrice,currencyCode:b?.currency.code})]})})]})})};CartDrawer.defaultProps={setting:{title:"Your Cart",emptyLabel:"Your cart is empty",openMode:"page"}};export{CartDrawer as default};

package/dist/esm/components/CartFooter.js

@@ -1,65 +1 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { useCheckoutUrl, useMoney, composeRadius } from '@gem-sdk/core';
-import { useRef } from 'react';
-
-const CartFooter = ({ checkoutUrl , price , openMode  })=>{
-    const urlCheckout = useCheckoutUrl(checkoutUrl);
-    const checkoutPopup = useRef(null);
-    const money = useMoney(price ?? 0);
-    const openCheckout = (w, h)=>{
-        if (openMode === 'popup') {
-            const dualScreenLeft = window.screenLeft !== undefined ? window.screenLeft : window.screenX;
-            const dualScreenTop = window.screenTop !== undefined ? window.screenTop : window.screenY;
-            const width = window.innerWidth ? window.innerWidth : document.documentElement.clientWidth ? document.documentElement.clientWidth : screen.width;
-            const height = window.innerHeight ? window.innerHeight : document.documentElement.clientHeight ? document.documentElement.clientHeight : screen.height;
-            const systemZoom = width / window.screen.availWidth;
-            const left = (width - w) / 2 / systemZoom + dualScreenLeft;
-            const top = (height - h) / 2 / systemZoom + dualScreenTop;
-            checkoutPopup.current = window.open(urlCheckout, 'checkout', `scrollbars=yes, width=${w / systemZoom}, height=${h / systemZoom}, top=${top}, left=${left}`);
-            checkoutPopup.current?.focus();
-        } else {
-            window.open(urlCheckout);
-        }
-    };
-    return /*#__PURE__*/ jsxs("div", {
-        className: "flex flex-col gap-4 border-t border-t-g-line-3 bg-g-bg-2 px-6 pb-8 pt-4",
-        children: [
-            /*#__PURE__*/ jsxs("div", {
-                className: "g-paragraph-1 flex justify-between font-semibold",
-                children: [
-                    /*#__PURE__*/ jsx("span", {
-                        children: "Subtotal:"
-                    }),
-                    /*#__PURE__*/ jsx("span", {
-                        "aria-label": "Total price",
-                        children: money.localizedString
-                    })
-                ]
-            }),
-            /*#__PURE__*/ jsxs("div", {
-                "aria-label": "Checkout",
-                role: "button",
-                "aria-hidden": "true",
-                className: "g-paragraph-1 flex justify-between bg-g-brand px-4 py-3 font-semibold text-g-text-3",
-                onClick: ()=>openCheckout(600, 600),
-                style: {
-                    ...composeRadius({
-                        normal: {
-                            radiusType: 'small'
-                        }
-                    })
-                },
-                children: [
-                    /*#__PURE__*/ jsx("span", {
-                        children: money.localizedString
-                    }),
-                    /*#__PURE__*/ jsx("span", {
-                        children: "Checkout"
-                    })
-                ]
-            })
-        ]
-    });
-};
-
-export { CartFooter as default };
+import{jsxs as e,jsx as n}from"react/jsx-runtime";import{useCheckoutUrl as t,useMoney as i,composeRadius as r}from"@gem-sdk/core";import{useRef as o}from"react";let CartFooter=({checkoutUrl:l,price:d,openMode:c})=>{let a=t(l),s=o(null),w=i(d??0),h=(e,n)=>{if("popup"===c){let t=void 0!==window.screenLeft?window.screenLeft:window.screenX,i=void 0!==window.screenTop?window.screenTop:window.screenY,r=window.innerWidth?window.innerWidth:document.documentElement.clientWidth?document.documentElement.clientWidth:screen.width,o=window.innerHeight?window.innerHeight:document.documentElement.clientHeight?document.documentElement.clientHeight:screen.height,l=r/window.screen.availWidth,d=(r-e)/2/l+t,c=(o-n)/2/l+i;s.current=window.open(a,"checkout",`scrollbars=yes, width=${e/l}, height=${n/l}, top=${c}, left=${d}`),s.current?.focus()}else window.open(a)};return e("div",{className:"flex flex-col gap-4 border-t border-t-g-line-3 bg-g-bg-2 px-6 pb-8 pt-4",children:[e("div",{className:"g-paragraph-1 flex justify-between font-semibold",children:[n("span",{children:"Subtotal:"}),n("span",{"aria-label":"Total price",children:w.localizedString})]}),e("div",{"aria-label":"Checkout",role:"button","aria-hidden":"true",className:"g-paragraph-1 flex justify-between bg-g-brand px-4 py-3 font-semibold text-g-text-3",onClick:()=>h(600,600),style:{...r({normal:{radiusType:"small"}})},children:[n("span",{children:w.localizedString}),n("span",{children:"Checkout"})]})]})};export{CartFooter as default};

package/dist/esm/components/CartLineItem.js

@@ -1,168 +1 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { useCartLine, useCartId, useRemoveCartItem, useMoney } from '@gem-sdk/core';
-import { openConfirm } from '@gem-sdk/components';
-import CartLineItemQuantity from './CartLineItemQuantity.js';
-import Trash from './icons/Trash.js';
-import LoadingIcon from './LoadingIcon.js';
-
-const CartLineItem = ()=>{
-    const line = useCartLine();
-    const { cartId  } = useCartId();
-    const { isMutating: loading , trigger: removeCartLine  } = useRemoveCartItem();
-    const money = useMoney(line.variant?.price ? line.variant?.price : 0);
-    const compareAtPrice = useMoney(line.variant?.listPrice ? line.variant?.listPrice : 0);
-    return /*#__PURE__*/ jsxs("div", {
-        className: "flex items-center gap-4 border-b border-b-g-line-2 py-4 last:border-b-transparent",
-        children: [
-            /*#__PURE__*/ jsx("div", {
-                className: "aspect-square w-16",
-                children: line.variant?.image?.url && /*#__PURE__*/ jsx("img", {
-                    className: "h-full w-full object-cover",
-                    src: line.variant.image.url,
-                    alt: line.variant?.image?.altText ?? ''
-                })
-            }),
-            /*#__PURE__*/ jsxs("div", {
-                className: "flex-1",
-                children: [
-                    /*#__PURE__*/ jsxs("p", {
-                        className: "line-clamp-2",
-                        children: [
-                            line.productTitle,
-                            " ",
-                            line.variant.name !== 'Default Title' && ` - ${line.variant.name}`
-                        ]
-                    }),
-                    /*#__PURE__*/ jsxs("div", {
-                        className: "flex flex-col gap-1 text-sm",
-                        children: [
-                            /*#__PURE__*/ jsxs("div", {
-                                className: "flex gap-2",
-                                children: [
-                                    /*#__PURE__*/ jsx("span", {
-                                        className: "font-semibold",
-                                        children: money.localizedString
-                                    }),
-                                    line.variant?.listPrice > 0 && /*#__PURE__*/ jsx("span", {
-                                        className: "text-[#B4B4B4] line-through",
-                                        children: compareAtPrice.localizedString
-                                    })
-                                ]
-                            }),
-                            line.attributes?.map((attribute)=>/*#__PURE__*/ jsxs("div", {
-                                    children: [
-                                        attribute.key,
-                                        ": ",
-                                        attribute.value
-                                    ]
-                                }, attribute.key))
-                        ]
-                    }),
-                    /*#__PURE__*/ jsxs("div", {
-                        className: "flex items-center justify-between",
-                        children: [
-                            /*#__PURE__*/ jsx(CartLineItemQuantity, {
-                                size: "medium"
-                            }),
-                            /*#__PURE__*/ jsx("button", {
-                                onClick: ()=>{
-                                    openConfirm({
-                                        title: /*#__PURE__*/ jsxs("div", {
-                                            className: "flex w-full flex-col items-center gap-4",
-                                            children: [
-                                                /*#__PURE__*/ jsx(Trash, {}),
-                                                /*#__PURE__*/ jsx("p", {
-                                                    className: "font-g-body text-xl font-semibold",
-                                                    children: "Are you sure ?"
-                                                })
-                                            ]
-                                        }),
-                                        content: /*#__PURE__*/ jsxs("div", {
-                                            className: "text-center",
-                                            children: [
-                                                /*#__PURE__*/ jsx("p", {
-                                                    children: "Do you really want to delete these items?"
-                                                }),
-                                                /*#__PURE__*/ jsx("p", {
-                                                    children: "This process cannot be undone."
-                                                })
-                                            ]
-                                        }),
-                                        className: 'w-full max-w-[572px] gap-4 rounded',
-                                        buttons: [
-                                            {
-                                                label: 'Cancel',
-                                                className: 'w-[130px]',
-                                                styles: {
-                                                    backgroundColor: {
-                                                        normal: 'bg-1'
-                                                    },
-                                                    roundedBtn: {
-                                                        normal: {
-                                                            radiusType: 'small'
-                                                        }
-                                                    },
-                                                    btnSpacing: {
-                                                        type: 'small'
-                                                    }
-                                                }
-                                            },
-                                            {
-                                                label: 'Delete',
-                                                className: 'w-[130px]',
-                                                styles: {
-                                                    textColor: {
-                                                        normal: 'text-3'
-                                                    },
-                                                    backgroundColor: {
-                                                        normal: 'error'
-                                                    },
-                                                    roundedBtn: {
-                                                        normal: {
-                                                            radiusType: 'small'
-                                                        }
-                                                    },
-                                                    btnSpacing: {
-                                                        type: 'small'
-                                                    }
-                                                },
-                                                onClick: ()=>{
-                                                    if (cartId && line.id) {
-                                                        removeCartLine({
-                                                            cartId,
-                                                            lineId: line.id
-                                                        });
-                                                    }
-                                                }
-                                            }
-                                        ]
-                                    });
-                                },
-                                "aria-label": "Remove item from cart",
-                                title: "Remove item from cart",
-                                type: "button",
-                                children: loading ? /*#__PURE__*/ jsx(LoadingIcon, {
-                                    className: "text-g-brand"
-                                }) : /*#__PURE__*/ jsx("svg", {
-                                    xmlns: "http://www.w3.org/2000/svg",
-                                    className: "w-4 text-gray-400",
-                                    fill: "none",
-                                    viewBox: "0 0 24 24",
-                                    stroke: "currentColor",
-                                    strokeWidth: 2,
-                                    children: /*#__PURE__*/ jsx("path", {
-                                        strokeLinecap: "round",
-                                        strokeLinejoin: "round",
-                                        d: "M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"
-                                    })
-                                })
-                            })
-                        ]
-                    })
-                ]
-            })
-        ]
-    });
-};
-
-export { CartLineItem as default };
+import{jsxs as e,jsx as a}from"react/jsx-runtime";import{useCartLine as t,useCartId as l,useRemoveCartItem as r,useMoney as i}from"@gem-sdk/core";import{openConfirm as n}from"@gem-sdk/components";import s from"./CartLineItemQuantity.js";import o from"./icons/Trash.js";import m from"./LoadingIcon.js";let CartLineItem=()=>{let c=t(),{cartId:d}=l(),{isMutating:p,trigger:u}=r(),g=i(c.variant?.price?c.variant?.price:0),v=i(c.variant?.listPrice?c.variant?.listPrice:0);return e("div",{className:"flex items-center gap-4 border-b border-b-g-line-2 py-4 last:border-b-transparent",children:[a("div",{className:"aspect-square w-16",children:c.variant?.image?.url&&a("img",{className:"h-full w-full object-cover",src:c.variant.image.url,alt:c.variant?.image?.altText??""})}),e("div",{className:"flex-1",children:[e("p",{className:"line-clamp-2",children:[c.productTitle," ","Default Title"!==c.variant.name&&` - ${c.variant.name}`]}),e("div",{className:"flex flex-col gap-1 text-sm",children:[e("div",{className:"flex gap-2",children:[a("span",{className:"font-semibold",children:g.localizedString}),c.variant?.listPrice>0&&a("span",{className:"text-[#B4B4B4] line-through",children:v.localizedString})]}),c.attributes?.map(a=>e("div",{children:[a.key,": ",a.value]},a.key))]}),e("div",{className:"flex items-center justify-between",children:[a(s,{size:"medium"}),a("button",{onClick:()=>{n({title:e("div",{className:"flex w-full flex-col items-center gap-4",children:[a(o,{}),a("p",{className:"font-g-body text-xl font-semibold",children:"Are you sure ?"})]}),content:e("div",{className:"text-center",children:[a("p",{children:"Do you really want to delete these items?"}),a("p",{children:"This process cannot be undone."})]}),className:"w-full max-w-[572px] gap-4 rounded",buttons:[{label:"Cancel",className:"w-[130px]",styles:{backgroundColor:{normal:"bg-1"},roundedBtn:{normal:{radiusType:"small"}},btnSpacing:{type:"small"}}},{label:"Delete",className:"w-[130px]",styles:{textColor:{normal:"text-3"},backgroundColor:{normal:"error"},roundedBtn:{normal:{radiusType:"small"}},btnSpacing:{type:"small"}},onClick:()=>{d&&c.id&&u({cartId:d,lineId:c.id})}}]})},"aria-label":"Remove item from cart",title:"Remove item from cart",type:"button",children:p?a(m,{className:"text-g-brand"}):a("svg",{xmlns:"http://www.w3.org/2000/svg",className:"w-4 text-gray-400",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",strokeWidth:2,children:a("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"})})})]})]})]})};export{CartLineItem as default};

package/dist/esm/components/CartLineItemQuantity.js

@@ -1,53 +1 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { useCartLine, cls } from '@gem-sdk/core';
-import CartLineQuantityAdjustButton from './CartLineQuantityAdjustButton.js';
-
-const CartLineItemQuantity = ({ size  })=>{
-    const line = useCartLine();
-    return /*#__PURE__*/ jsxs("div", {
-        className: cls('mt-2 inline-flex items-center overflow-auto rounded border border-g-line-3 text-g-text-1', {
-            'h-12': size === 'large',
-            'h-10': size === 'medium',
-            'h-8': size === 'small'
-        }),
-        children: [
-            /*#__PURE__*/ jsx(CartLineQuantityAdjustButton, {
-                adjust: "decrease",
-                "aria-label": "Decrease quantity",
-                className: "flex aspect-square h-full items-center justify-center",
-                children: /*#__PURE__*/ jsx("svg", {
-                    className: "h-4",
-                    fill: "currentColor",
-                    viewBox: "0 0 24 24",
-                    xmlns: "http://www.w3.org/2000/svg",
-                    children: /*#__PURE__*/ jsx("path", {
-                        d: "M3.755 12.5h16.492a.75.75 0 0 0 0-1.5H3.755a.75.75 0 0 0 0 1.5Z"
-                    })
-                })
-            }),
-            /*#__PURE__*/ jsx("div", {
-                className: "flex h-full min-w-[50px] select-none items-center justify-center border-x border-g-line-3 px-2 text-center text-base font-semibold",
-                children: line.quantity
-            }),
-            /*#__PURE__*/ jsx(CartLineQuantityAdjustButton, {
-                adjust: "increase",
-                "aria-label": "Increase quantity",
-                className: "flex aspect-square h-full items-center justify-center",
-                children: /*#__PURE__*/ jsx("svg", {
-                    className: "h-4",
-                    fill: "currentColor",
-                    viewBox: "0 0 24 24",
-                    xmlns: "http://www.w3.org/2000/svg",
-                    children: /*#__PURE__*/ jsx("path", {
-                        d: "M11.75 3a.75.75 0 0 1 .743.648l.007.102.001 7.25h7.253a.75.75 0 0 1 .102 1.493l-.102.007h-7.253l.002 7.25a.75.75 0 0 1-1.493.101l-.007-.102-.002-7.249H3.752a.75.75 0 0 1-.102-1.493L3.752 11h7.25L11 3.75a.75.75 0 0 1 .75-.75Z"
-                    })
-                })
-            })
-        ]
-    });
-};
-CartLineItemQuantity.defaultProps = {
-    size: 'medium'
-};
-
-export { CartLineItemQuantity as default };
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useCartLine as r,cls as a}from"@gem-sdk/core";import l from"./CartLineQuantityAdjustButton.js";let CartLineItemQuantity=({size:i})=>{let s=r();return e("div",{className:a("mt-2 inline-flex items-center overflow-auto rounded border border-g-line-3 text-g-text-1",{"h-12":"large"===i,"h-10":"medium"===i,"h-8":"small"===i}),children:[t(l,{adjust:"decrease","aria-label":"Decrease quantity",className:"flex aspect-square h-full items-center justify-center",children:t("svg",{className:"h-4",fill:"currentColor",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg",children:t("path",{d:"M3.755 12.5h16.492a.75.75 0 0 0 0-1.5H3.755a.75.75 0 0 0 0 1.5Z"})})}),t("div",{className:"flex h-full min-w-[50px] select-none items-center justify-center border-x border-g-line-3 px-2 text-center text-base font-semibold",children:s.quantity}),t(l,{adjust:"increase","aria-label":"Increase quantity",className:"flex aspect-square h-full items-center justify-center",children:t("svg",{className:"h-4",fill:"currentColor",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg",children:t("path",{d:"M11.75 3a.75.75 0 0 1 .743.648l.007.102.001 7.25h7.253a.75.75 0 0 1 .102 1.493l-.102.007h-7.253l.002 7.25a.75.75 0 0 1-1.493.101l-.007-.102-.002-7.249H3.752a.75.75 0 0 1-.102-1.493L3.752 11h7.25L11 3.75a.75.75 0 0 1 .75-.75Z"})})})]})};CartLineItemQuantity.defaultProps={size:"medium"};export{CartLineItemQuantity as default};

package/dist/esm/components/CartLineQuantityAdjustButton.js

@@ -1,203 +1 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { useUpdateCartItem, useRemoveCartItem, useCartId, useCartLine } from '@gem-sdk/core';
-import { openConfirm } from '@gem-sdk/components';
-import Trash from './icons/Trash.js';
-
-/**
- * The `CartLineQuantityAdjustButton` component renders a button that adjusts the cart line's quantity when pressed.
- * It must be a descendent of a `CartLineProvider` component.
- */ const CartLineQuantityAdjustButton = ({ children , adjust , className , style  })=>{
-    const { isMutating: updateLoading , trigger: updateLines  } = useUpdateCartItem();
-    const { isMutating: removeLoading , trigger: removeLines  } = useRemoveCartItem();
-    const { cartId  } = useCartId();
-    const cartLine = useCartLine();
-    const isLoading = updateLoading || removeLoading;
-    return /*#__PURE__*/ jsx("button", {
-        "aria-label": "Adjust quantity",
-        className,
-        style,
-        disabled: isLoading,
-        onClick: ()=>{
-            if (cartId && cartLine.id) {
-                if (adjust === 'remove') {
-                    openConfirm({
-                        title: /*#__PURE__*/ jsxs("div", {
-                            className: "flex w-full flex-col items-center gap-4",
-                            children: [
-                                /*#__PURE__*/ jsx(Trash, {}),
-                                /*#__PURE__*/ jsx("p", {
-                                    className: "font-g-body text-xl font-semibold",
-                                    children: "Are you sure ?"
-                                })
-                            ]
-                        }),
-                        content: /*#__PURE__*/ jsxs("div", {
-                            className: "text-center",
-                            children: [
-                                /*#__PURE__*/ jsx("p", {
-                                    children: "Do you really want to delete this item?"
-                                }),
-                                /*#__PURE__*/ jsx("p", {
-                                    children: "This process cannot be undone."
-                                })
-                            ]
-                        }),
-                        className: 'w-full max-w-[572px] gap-4 rounded',
-                        buttons: [
-                            {
-                                label: 'Cancel',
-                                className: 'w-[130px]',
-                                styles: {
-                                    backgroundColor: {
-                                        normal: 'bg-1'
-                                    },
-                                    roundedBtn: {
-                                        normal: {
-                                            radiusType: 'small'
-                                        }
-                                    },
-                                    btnSpacing: {
-                                        type: 'small'
-                                    }
-                                }
-                            },
-                            {
-                                label: 'Delete',
-                                className: 'w-[130px]',
-                                styles: {
-                                    textColor: {
-                                        normal: 'text-3'
-                                    },
-                                    backgroundColor: {
-                                        normal: 'error'
-                                    },
-                                    roundedBtn: {
-                                        normal: {
-                                            radiusType: 'small'
-                                        }
-                                    },
-                                    btnSpacing: {
-                                        type: 'small'
-                                    }
-                                },
-                                onClick: ()=>{
-                                    if (cartLine.id) {
-                                        removeLines({
-                                            cartId,
-                                            lineId: cartLine.id
-                                        });
-                                    }
-                                }
-                            }
-                        ]
-                    });
-                    return;
-                }
-                const quantity = adjust === 'decrease' ? cartLine.quantity - 1 : cartLine.quantity + 1;
-                if (quantity <= 0) {
-                    openConfirm({
-                        title: /*#__PURE__*/ jsxs("div", {
-                            className: "flex w-full flex-col items-center gap-4",
-                            children: [
-                                /*#__PURE__*/ jsx(Trash, {}),
-                                /*#__PURE__*/ jsx("p", {
-                                    className: "font-g-body text-xl font-semibold",
-                                    children: "Are you sure ?"
-                                })
-                            ]
-                        }),
-                        content: /*#__PURE__*/ jsxs("div", {
-                            className: "text-center",
-                            children: [
-                                /*#__PURE__*/ jsx("p", {
-                                    children: "Do you really want to delete this item?"
-                                }),
-                                /*#__PURE__*/ jsx("p", {
-                                    children: "This process cannot be undone."
-                                })
-                            ]
-                        }),
-                        className: 'w-full max-w-[572px] gap-4 rounded',
-                        buttons: [
-                            {
-                                label: 'Cancel',
-                                className: 'w-[130px]',
-                                styles: {
-                                    backgroundColor: {
-                                        normal: 'bg-1'
-                                    },
-                                    roundedBtn: {
-                                        normal: {
-                                            radiusType: 'small'
-                                        }
-                                    },
-                                    btnSpacing: {
-                                        type: 'small'
-                                    }
-                                }
-                            },
-                            {
-                                label: 'Delete',
-                                className: 'w-[130px]',
-                                styles: {
-                                    textColor: {
-                                        normal: 'text-3'
-                                    },
-                                    backgroundColor: {
-                                        normal: 'error'
-                                    },
-                                    roundedBtn: {
-                                        normal: {
-                                            radiusType: 'small'
-                                        }
-                                    },
-                                    btnSpacing: {
-                                        type: 'small'
-                                    }
-                                },
-                                onClick: ()=>{
-                                    if (cartLine.id) {
-                                        removeLines({
-                                            cartId,
-                                            lineId: cartLine.id
-                                        });
-                                    }
-                                }
-                            }
-                        ]
-                    });
-                    return;
-                } else {
-                    updateLines({
-                        cartId,
-                        line: {
-                            id: cartLine.id,
-                            variantId: cartLine.variant.id,
-                            quantity,
-                            productId: cartLine.productId
-                        }
-                    });
-                }
-            }
-        },
-        children: isLoading ? /*#__PURE__*/ jsxs("div", {
-            className: "flex gap-1",
-            children: [
-                /*#__PURE__*/ jsx("span", {
-                    className: "aspect-square h-1 animate-[flashing_500ms_infinite_alternate] rounded-full bg-g-brand"
-                }),
-                /*#__PURE__*/ jsx("span", {
-                    className: "aspect-square h-1 animate-[flashing_500ms_infinite_200ms_linear_alternate] rounded-full bg-g-brand"
-                }),
-                /*#__PURE__*/ jsx("span", {
-                    className: "aspect-square h-1 animate-[flashing_500ms_infinite_500ms_alternate] rounded-full bg-g-brand"
-                })
-            ]
-        }) : children
-    });
-};
-CartLineQuantityAdjustButton.defaultProps = {
-    adjust: 'increase'
-};
-
-export { CartLineQuantityAdjustButton as default };
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useUpdateCartItem as a,useRemoveCartItem as l,useCartId as n,useCartLine as r}from"@gem-sdk/core";import{openConfirm as s}from"@gem-sdk/components";import i from"./icons/Trash.js";let CartLineQuantityAdjustButton=({children:o,adjust:d,className:c,style:m})=>{let{isMutating:u,trigger:p}=a(),{isMutating:g,trigger:b}=l(),{cartId:f}=n(),y=r(),x=u||g;return e("button",{"aria-label":"Adjust quantity",className:c,style:m,disabled:x,onClick:()=>{if(f&&y.id){if("remove"===d){s({title:t("div",{className:"flex w-full flex-col items-center gap-4",children:[e(i,{}),e("p",{className:"font-g-body text-xl font-semibold",children:"Are you sure ?"})]}),content:t("div",{className:"text-center",children:[e("p",{children:"Do you really want to delete this item?"}),e("p",{children:"This process cannot be undone."})]}),className:"w-full max-w-[572px] gap-4 rounded",buttons:[{label:"Cancel",className:"w-[130px]",styles:{backgroundColor:{normal:"bg-1"},roundedBtn:{normal:{radiusType:"small"}},btnSpacing:{type:"small"}}},{label:"Delete",className:"w-[130px]",styles:{textColor:{normal:"text-3"},backgroundColor:{normal:"error"},roundedBtn:{normal:{radiusType:"small"}},btnSpacing:{type:"small"}},onClick:()=>{y.id&&b({cartId:f,lineId:y.id})}}]});return}let a="decrease"===d?y.quantity-1:y.quantity+1;if(a<=0){s({title:t("div",{className:"flex w-full flex-col items-center gap-4",children:[e(i,{}),e("p",{className:"font-g-body text-xl font-semibold",children:"Are you sure ?"})]}),content:t("div",{className:"text-center",children:[e("p",{children:"Do you really want to delete this item?"}),e("p",{children:"This process cannot be undone."})]}),className:"w-full max-w-[572px] gap-4 rounded",buttons:[{label:"Cancel",className:"w-[130px]",styles:{backgroundColor:{normal:"bg-1"},roundedBtn:{normal:{radiusType:"small"}},btnSpacing:{type:"small"}}},{label:"Delete",className:"w-[130px]",styles:{textColor:{normal:"text-3"},backgroundColor:{normal:"error"},roundedBtn:{normal:{radiusType:"small"}},btnSpacing:{type:"small"}},onClick:()=>{y.id&&b({cartId:f,lineId:y.id})}}]});return}p({cartId:f,line:{id:y.id,variantId:y.variant.id,quantity:a,productId:y.productId}})}},children:x?t("div",{className:"flex gap-1",children:[e("span",{className:"aspect-square h-1 animate-[flashing_500ms_infinite_alternate] rounded-full bg-g-brand"}),e("span",{className:"aspect-square h-1 animate-[flashing_500ms_infinite_200ms_linear_alternate] rounded-full bg-g-brand"}),e("span",{className:"aspect-square h-1 animate-[flashing_500ms_infinite_500ms_alternate] rounded-full bg-g-brand"})]}):o})};CartLineQuantityAdjustButton.defaultProps={adjust:"increase"};export{CartLineQuantityAdjustButton as default};