@hanzo/commerce 7.3.10 → 7.5.1

package/dist/components/cart/cart-panel/cart-line-item.js

@@ -0,0 +1,25 @@
+'use client';
+import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import React from 'react';
+import { observer } from 'mobx-react-lite';
+import { cn } from '@hanzo/ui/util';
+import { Image } from '@hanzo/ui/primitives';
+import { formatCurrencyValue } from '../../../util';
+import AddToCartWidget from '../../add-to-cart-widget';
+import { useCommerce } from '../../../service/context';
+const DEF_IMG_SIZE = 40;
+const renderTitle = (t) => {
+    const toks = t.split(', ');
+    if (toks.length === 2) {
+        return _jsxs(_Fragment, { children: [_jsxs("p", { children: [toks[0], ","] }), _jsx("p", { className: '', children: toks[1] })] });
+    }
+    return _jsx("p", { children: t });
+};
+const CartLineItem = observer(({ item, className = '', imgSizePx = DEF_IMG_SIZE, showPromoCode = false, itemClicked, selected = false }) => {
+    const cmmc = useCommerce();
+    const promoPrice = showPromoCode ? cmmc.itemPromoPrice(item) : undefined;
+    return (_jsxs("div", { className: cn('flex flex-col justify-start items-start text-sm font-sans', 'border border-background rounded-sm p-1', selected ? 'border-foreground' : '', (itemClicked && !selected ? 'cursor-pointer hover:!border-muted-4' : 'cursor-default '), className), onClick: () => { itemClicked && itemClicked(item); }, children: [_jsxs("div", { className: 'flex flex-row justify-between items-center gap-1', children: [item.img ? (_jsx(Image, { def: item.img, constrainTo: { w: imgSizePx, h: imgSizePx } })) : ( // placeholder so things align
+                    _jsx("div", { style: { height: imgSizePx, width: imgSizePx }, className: 'bg-level-3' })), _jsx("div", { className: 'grow leading-tight ml-1', children: renderTitle(item.title) })] }), _jsxs("div", { className: 'flex flex-row items-center justify-between w-full', children: [_jsxs("div", { className: 'flex flex-row items-center', children: [_jsx(AddToCartWidget, { variant: 'minimal', item: item }), item.quantity > 1 && (_jsx("span", { className: 'pl-2.5', children: '@' + formatCurrencyValue(item.price) }))] }), _jsxs("div", { className: 'flex flex-row gap-1 items-center justify-end', children: [_jsx("span", { className: promoPrice ? 'line-through	text-muted-2' : '', children: formatCurrencyValue(item.price * item.quantity) }), promoPrice && _jsx("span", { children: formatCurrencyValue(promoPrice * item.quantity) })] })] })] }));
+});
+export default CartLineItem;
+//# sourceMappingURL=cart-line-item.js.map

package/dist/components/cart/cart-panel/cart-line-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cart-line-item.js","sourceRoot":"","sources":["../../../../components/cart/cart-panel/cart-line-item.tsx"],"names":[],"mappings":"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"}

package/dist/components/cart/cart-panel/cart-line-item.jsx

@@ -0,0 +1,39 @@
+'use client';
+import React from 'react';
+import { observer } from 'mobx-react-lite';
+import { cn } from '@hanzo/ui/util';
+import { Image } from '@hanzo/ui/primitives';
+import { formatCurrencyValue } from '../../../util';
+import AddToCartWidget from '../../add-to-cart-widget';
+import { useCommerce } from '../../../service/context';
+const DEF_IMG_SIZE = 40;
+const renderTitle = (t) => {
+    const toks = t.split(', ');
+    if (toks.length === 2) {
+        return <><p>{toks[0]},</p><p className=''>{toks[1]}</p></>;
+    }
+    return <p>{t}</p>;
+};
+const CartLineItem = observer(({ item, className = '', imgSizePx = DEF_IMG_SIZE, showPromoCode = false, itemClicked, selected = false }) => {
+    const cmmc = useCommerce();
+    const promoPrice = showPromoCode ? cmmc.itemPromoPrice(item) : undefined;
+    return (<div className={cn('flex flex-col justify-start items-start text-sm font-sans', 'border border-background rounded-sm p-1', selected ? 'border-foreground' : '', (itemClicked && !selected ? 'cursor-pointer hover:!border-muted-4' : 'cursor-default '), className)} onClick={() => { itemClicked && itemClicked(item); }}>
+      <div className='flex flex-row justify-between items-center gap-1'>
+        {item.img ? (<Image def={item.img} constrainTo={{ w: imgSizePx, h: imgSizePx }}/>) : ( // placeholder so things align
+        <div style={{ height: imgSizePx, width: imgSizePx }} className='bg-level-3'/>)}
+        <div className='grow leading-tight ml-1'>{renderTitle(item.title)}</div>
+      </div>
+      <div className='flex flex-row items-center justify-between w-full'>
+        <div className='flex flex-row items-center'>
+          <AddToCartWidget variant='minimal' item={item}/>
+          {item.quantity > 1 && (<span className='pl-2.5'>{'@' + formatCurrencyValue(item.price)}</span>)}
+        </div>
+        <div className='flex flex-row gap-1 items-center justify-end'>
+          <span className={promoPrice ? 'line-through	text-muted-2' : ''}>{formatCurrencyValue(item.price * item.quantity)}</span>
+          {promoPrice && <span>{formatCurrencyValue(promoPrice * item.quantity)}</span>}
+        </div>
+      </div>
+    </div>);
+});
+export default CartLineItem;
+//# sourceMappingURL=cart-line-item.jsx.map

package/dist/components/cart/cart-panel/cart-line-item.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"cart-line-item.jsx","sourceRoot":"","sources":["../../../../components/cart/cart-panel/cart-line-item.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;AAEZ,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAA;AAE1C,OAAO,EAAE,EAAE,EAAE,MAAM,gBAAgB,CAAA;AACnC,OAAO,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAA;AAG5C,OAAO,EAAE,mBAAmB,EAAE,MAAM,eAAe,CAAA;AACnD,OAAO,eAAe,MAAM,0BAA0B,CAAA;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AAEtD,MAAM,YAAY,GAAC,EAAE,CAAA;AAErB,MAAM,WAAW,GAAG,CAAC,CAAS,EAAmB,EAAE;IACjD,MAAM,IAAI,GAAG,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAA;IAC1B,IAAI,IAAI,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;QACtB,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,CAAA;IAC5D,CAAC;IACD,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAA;AACnB,CAAC,CAAA;AAED,MAAM,YAAY,GAOb,QAAQ,CAAC,CAAC,EACb,IAAI,EACJ,SAAS,GAAC,EAAE,EACZ,SAAS,GAAC,YAAY,EACtB,aAAa,GAAC,KAAK,EACnB,WAAW,EACX,QAAQ,GAAC,KAAK,EACf,EAAE,EAAE;IAEH,MAAM,IAAI,GAAG,WAAW,EAAE,CAAA;IAC1B,MAAM,UAAU,GAAG,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,SAAS,CAAA;IAExE,OAAO,CACL,CAAC,GAAG,CACF,SAAS,CAAC,CAAC,EAAE,CACX,2DAA2D,EAC3D,yCAAyC,EACzC,QAAQ,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,EAAE,EACnC,CAAC,WAAW,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,sCAAsC,CAAC,CAAC,CAAC,iBAAiB,CAAC,EACvF,SAAS,CACV,CAAC,CACF,OAAO,CAAC,CAAC,GAAG,EAAE,GAAE,WAAW,IAAI,WAAW,CAAC,IAAI,CAAC,CAAA,CAAA,CAAC,CAAC,CAElD;MAAA,CAAC,GAAG,CAAC,SAAS,CAAC,kDAAkD,CAC/D;QAAA,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CACV,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,WAAW,CAAC,CAAC,EAAC,CAAC,EAAE,SAAS,EAAE,CAAC,EAAE,SAAS,EAAC,CAAC,EAAG,CACpE,CAAC,CAAC,CAAC,EAAE,8BAA8B;QAClC,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,EAAC,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAC,CAAC,CAAC,SAAS,CAAC,YAAY,EAAE,CAC5E,CACD;QAAA,CAAC,GAAG,CAAC,SAAS,CAAC,yBAAyB,CAAC,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,GAAG,CACzE;MAAA,EAAE,GAAG,CACL;MAAA,CAAC,GAAG,CAAC,SAAS,CAAC,mDAAmD,CAChE;QAAA,CAAC,GAAG,CAAC,SAAS,CAAC,4BAA4B,CACzC;UAAA,CAAC,eAAe,CAAC,OAAO,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,EAC9C;UAAA,CAAC,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,GAAG,GAAG,mBAAmB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC,CACjG;QAAA,EAAE,GAAG,CACL;QAAA,CAAC,GAAG,CAAC,SAAS,CAAC,8CAA8C,CAC3D;UAAA,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,2BAA2B,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,mBAAmB,CAAC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,EAAE,IAAI,CACvH;UAAA,CAAC,UAAU,IAAI,CAAC,IAAI,CAAC,CAAC,mBAAmB,CAAC,UAAU,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,EAAE,IAAI,CAAC,CAC/E;QAAA,EAAE,GAAG,CACP;MAAA,EAAE,GAAG,CACP;IAAA,EAAE,GAAG,CAAC,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,YAAY,CAAA"}

package/dist/components/cart/cart-panel/index.d.ts

@@ -0,0 +1,19 @@
+import React, { type PropsWithChildren } from 'react';
+declare const CartPanel: React.FC<PropsWithChildren & {
+    /** fix size and scroll after 'scrollAfter items in teh cart. */
+    scrollAfter?: number;
+    scrollHeightClx?: string;
+    imgSizePx?: number;
+    className?: string;
+    itemClx?: string;
+    listClx?: string;
+    noItemsClx?: string;
+    totalClx?: string;
+    buttonClx?: string;
+    showPromoCode?: boolean;
+    showShipping?: boolean;
+    selectItems?: boolean;
+    /** if not provided, 'checkout' button will be rendered */
+    handleCheckout?: () => void;
+}>;
+export default CartPanel;

package/dist/components/cart/cart-panel/index.js

@@ -0,0 +1,65 @@
+'use client';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { useLayoutEffect } from 'react';
+import { reaction } from 'mobx';
+import { observer } from 'mobx-react-lite';
+import { Button, ScrollArea } from '@hanzo/ui/primitives';
+import { cn } from '@hanzo/ui/util';
+import { useCommerce } from '../../../service/context';
+import { sendFBEvent, sendGAEvent } from '../../../util/analytics';
+import CartLineItem from './cart-line-item';
+import TotalArea from './total-area';
+const CartPanel = observer(({ 
+/** If provided, 'children' is rendered above the items. eg, a heading. */
+children, scrollAfter = 5, scrollHeightClx = 'h-[70vh]', imgSizePx = 40, className = '', itemClx = '', listClx = '', noItemsClx = '', totalClx = '', buttonClx = '', showPromoCode = false, showShipping = false, selectItems = false, handleCheckout, }) => {
+    const cmmc = useCommerce();
+    useLayoutEffect(() => {
+        if (!cmmc) {
+            return;
+        }
+        if (!cmmc.cartEmpty && !cmmc.currentItem) {
+            cmmc.setCurrentItem(cmmc.cartItems[0].sku);
+        }
+        // return mobx disposer
+        return reaction(() => (cmmc.cartItems.length), (itemCount) => {
+            if (itemCount > 0) {
+                cmmc.setCurrentItem(cmmc.cartItems[0].sku);
+            }
+        });
+    }, []);
+    if (!cmmc) {
+        return _jsx("div", {});
+    }
+    const _handleCheckout = () => {
+        sendGAEvent('begin_checkout', {
+            currency: 'USD',
+            value: cmmc.cartTotal,
+            items: cmmc.cartItems.map((item) => ({
+                item_id: item.sku,
+                item_name: item.title,
+                item_category: item.familyId,
+                price: item.price,
+                quantity: item.quantity
+            })),
+        });
+        sendFBEvent('InitiateCheckout', {
+            content_ids: cmmc.cartItems.map((item) => item.sku),
+            contents: cmmc.cartItems.map(item => ({
+                id: item.sku,
+                quantity: item.quantity
+            })),
+            num_items: cmmc.cartItems.length,
+            value: cmmc.cartTotal,
+            currency: 'USD',
+        });
+        handleCheckout && handleCheckout();
+    };
+    const itemClicked = (item) => {
+        cmmc.setCurrentItem(item.sku);
+    };
+    const MainStuff = observer(() => (_jsxs(_Fragment, { children: [cmmc.cartEmpty ? (_jsx("p", { className: cn('text-center my-3', noItemsClx), children: "No items" })) : (_jsx(_Fragment, { children: cmmc.cartItems.map((item) => (_jsx(CartLineItem, { imgSizePx: imgSizePx, item: item, className: cn('mb-2', itemClx), showPromoCode: showPromoCode, itemClicked: selectItems ? itemClicked : undefined, selected: selectItems ? cmmc.currentItem?.sku === item.sku : false }, `mobile-${item.sku}`))) })), _jsx(TotalArea, { clx: totalClx, showPromoCode: showPromoCode, showShipping: showShipping })] })));
+    const scrolling = (cmmc.cartItems.length > scrollAfter);
+    return (_jsxs("div", { className: cn('border p-4 rounded-lg flex flex-col', className, scrolling ? scrollHeightClx : 'h-auto'), children: [children, scrolling ? (_jsx(ScrollArea, { className: cn('mt-2 w-full shrink py-0', listClx), children: _jsx(MainStuff, {}) })) : (_jsx("div", { className: cn('mt-2 w-full', listClx), children: _jsx(MainStuff, {}) })), handleCheckout && !cmmc.cartEmpty && (_jsx(Button, { onClick: _handleCheckout, variant: 'primary', rounded: 'lg', className: cn('mt-12 mx-auto w-full sm:max-w-[220px]', buttonClx), children: "Checkout" }))] }));
+});
+export default CartPanel;
+//# sourceMappingURL=index.js.map

package/dist/components/cart/cart-panel/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../components/cart/cart-panel/index.tsx"],"names":[],"mappings":"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"}

package/dist/components/cart/cart-panel/index.jsx

@@ -0,0 +1,79 @@
+'use client';
+import React, { useLayoutEffect } from 'react';
+import { reaction } from 'mobx';
+import { observer } from 'mobx-react-lite';
+import { Button, ScrollArea } from '@hanzo/ui/primitives';
+import { cn } from '@hanzo/ui/util';
+import { useCommerce } from '../../../service/context';
+import { sendFBEvent, sendGAEvent } from '../../../util/analytics';
+import CartLineItem from './cart-line-item';
+import TotalArea from './total-area';
+const CartPanel = observer(({ 
+/** If provided, 'children' is rendered above the items. eg, a heading. */
+children, scrollAfter = 5, scrollHeightClx = 'h-[70vh]', imgSizePx = 40, className = '', itemClx = '', listClx = '', noItemsClx = '', totalClx = '', buttonClx = '', showPromoCode = false, showShipping = false, selectItems = false, handleCheckout, }) => {
+    const cmmc = useCommerce();
+    useLayoutEffect(() => {
+        if (!cmmc) {
+            return;
+        }
+        if (!cmmc.cartEmpty && !cmmc.currentItem) {
+            cmmc.setCurrentItem(cmmc.cartItems[0].sku);
+        }
+        // return mobx disposer
+        return reaction(() => (cmmc.cartItems.length), (itemCount) => {
+            if (itemCount > 0) {
+                cmmc.setCurrentItem(cmmc.cartItems[0].sku);
+            }
+        });
+    }, []);
+    if (!cmmc) {
+        return <div />;
+    }
+    const _handleCheckout = () => {
+        sendGAEvent('begin_checkout', {
+            currency: 'USD',
+            value: cmmc.cartTotal,
+            items: cmmc.cartItems.map((item) => ({
+                item_id: item.sku,
+                item_name: item.title,
+                item_category: item.familyId,
+                price: item.price,
+                quantity: item.quantity
+            })),
+        });
+        sendFBEvent('InitiateCheckout', {
+            content_ids: cmmc.cartItems.map((item) => item.sku),
+            contents: cmmc.cartItems.map(item => ({
+                id: item.sku,
+                quantity: item.quantity
+            })),
+            num_items: cmmc.cartItems.length,
+            value: cmmc.cartTotal,
+            currency: 'USD',
+        });
+        handleCheckout && handleCheckout();
+    };
+    const itemClicked = (item) => {
+        cmmc.setCurrentItem(item.sku);
+    };
+    const MainStuff = observer(() => (<>
+    {cmmc.cartEmpty ? (<p className={cn('text-center my-3', noItemsClx)}>No items</p>) : (<>
+    {cmmc.cartItems.map((item) => (<CartLineItem key={`mobile-${item.sku}`} imgSizePx={imgSizePx} item={item} className={cn('mb-2', itemClx)} showPromoCode={showPromoCode} itemClicked={selectItems ? itemClicked : undefined} selected={selectItems ? cmmc.currentItem?.sku === item.sku : false}/>))}
+    </>)}
+    <TotalArea clx={totalClx} showPromoCode={showPromoCode} showShipping={showShipping}/>
+  </>));
+    const scrolling = (cmmc.cartItems.length > scrollAfter);
+    return (<div className={cn('border p-4 rounded-lg flex flex-col', className, scrolling ? scrollHeightClx : 'h-auto')}>
+      {children}
+      {scrolling ? (<ScrollArea className={cn('mt-2 w-full shrink py-0', listClx)}>
+          <MainStuff />
+        </ScrollArea>) : (<div className={cn('mt-2 w-full', listClx)}>
+          <MainStuff />
+        </div>)}
+      {handleCheckout && !cmmc.cartEmpty && (<Button onClick={_handleCheckout} variant='primary' rounded='lg' className={cn('mt-12 mx-auto w-full sm:max-w-[220px]', buttonClx)}>
+          Checkout
+        </Button>)}
+    </div>);
+});
+export default CartPanel;
+//# sourceMappingURL=index.jsx.map

package/dist/components/cart/cart-panel/index.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.jsx","sourceRoot":"","sources":["../../../../components/cart/cart-panel/index.tsx"],"names":[],"mappings":"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"}

package/dist/components/cart/cart-panel/promo-code.d.ts

@@ -0,0 +1,4 @@
+declare const PromoCode: (() => import("react/jsx-runtime").JSX.Element) & {
+    displayName: string;
+};
+export default PromoCode;

package/dist/components/cart/cart-panel/promo-code.js

@@ -0,0 +1,62 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import { useSearchParams } from 'next/navigation';
+import { observer } from 'mobx-react-lite';
+import { useForm } from 'react-hook-form';
+import * as z from 'zod';
+import { zodResolver } from '@hookform/resolvers/zod';
+import { Check } from 'lucide-react';
+import { Button, Input } from '@hanzo/ui/primitives';
+import { Form, FormControl, FormField, FormItem, } from '@hanzo/ui/form';
+import { useCommerce } from '../../../service/context';
+import getPromoFromApi from '../../../util/promo-codes';
+const formSchema = z.object({
+    code: z.string().min(1, 'Invalid code'),
+});
+const PromoCode = observer(() => {
+    const cmmc = useCommerce();
+    const searchParams = useSearchParams();
+    const [codeAccepted, setCodeAccepted] = useState(false);
+    useEffect(() => {
+        const code = searchParams.get('code');
+        if (code) {
+            getPromoFromApi(code).then((promo) => {
+                if (promo) {
+                    form.setValue('code', code);
+                    setCodeAccepted(true);
+                    cmmc.setAppliedPromo(promo);
+                }
+            });
+        }
+    }, [searchParams]);
+    useEffect(() => {
+        if (cmmc.appliedPromo) {
+            form.setValue('code', cmmc.appliedPromo.code);
+            setCodeAccepted(true);
+        }
+    }, [cmmc.appliedPromo]);
+    const form = useForm({
+        resolver: zodResolver(formSchema),
+        defaultValues: {
+            code: '',
+        },
+    });
+    const applyPromoCode = async (values) => {
+        const { code } = values;
+        const promo = await getPromoFromApi(code);
+        if (!promo) {
+            form.setError('code', { message: 'Invalid code' });
+            return;
+        }
+        setCodeAccepted(true);
+        cmmc.setAppliedPromo(promo);
+    };
+    const removePromoCode = () => {
+        cmmc.setAppliedPromo(null);
+        setCodeAccepted(false);
+    };
+    return (_jsx("div", { className: 'flex flex-col gap-2 border-t py-1', children: _jsx(Form, { ...form, children: _jsx("form", { onSubmit: form.handleSubmit(applyPromoCode), children: _jsxs("div", { className: 'flex gap-2 items-center', children: [_jsx(FormField, { control: form.control, name: 'code', render: ({ field }) => (_jsx(FormItem, { className: 'w-full', children: _jsx(FormControl, { children: _jsx(Input, { ...field, className: 'h-9', placeholder: 'Discount or invite code', onInput: removePromoCode }) }) })) }), codeAccepted ? (_jsx(Check, {})) : (_jsx(Button, { variant: 'outline', className: '!w-fit !min-w-0 font-inter text-muted text-sm', children: "Apply" }))] }) }) }) }));
+});
+export default PromoCode;
+//# sourceMappingURL=promo-code.js.map

package/dist/components/cart/cart-panel/promo-code.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"promo-code.js","sourceRoot":"","sources":["../../../../components/cart/cart-panel/promo-code.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAC3C,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AACjD,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAA;AAE1C,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAA;AACzC,OAAO,KAAK,CAAC,MAAM,KAAK,CAAA;AACxB,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAA;AACrD,OAAO,EAAE,KAAK,EAAE,MAAM,cAAc,CAAA;AAEpC,OAAO,EACL,MAAM,EACN,KAAK,EACN,MAAM,sBAAsB,CAAA;AAE7B,OAAO,EACL,IAAI,EACJ,WAAW,EACX,SAAS,EACT,QAAQ,GACT,MAAM,gBAAgB,CAAA;AAEvB,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AAEtD,OAAO,eAAe,MAAM,2BAA2B,CAAA;AAEvD,MAAM,UAAU,GAAG,CAAC,CAAC,MAAM,CAAC;IAC1B,IAAI,EAAE,CAAC,CAAC,MAAM,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,cAAc,CAAC;CACxC,CAAC,CAAA;AAEF,MAAM,SAAS,GAAG,QAAQ,CAAC,GAAG,EAAE;IAC9B,MAAM,IAAI,GAAG,WAAW,EAAE,CAAA;IAC1B,MAAM,YAAY,GAAG,eAAe,EAAE,CAAA;IAEtC,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAA;IAEhE,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,IAAI,GAAG,YAAY,CAAC,GAAG,CAAC,MAAM,CAAC,CAAA;QACrC,IAAI,IAAI,EAAE,CAAC;YACT,eAAe,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,KAAa,EAAE,EAAE;gBAC3C,IAAI,KAAK,EAAE,CAAC;oBACV,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE,IAAI,CAAC,CAAA;oBAC3B,eAAe,CAAC,IAAI,CAAC,CAAA;oBACrB,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,CAAA;gBAC7B,CAAC;YACH,CAAC,CAAC,CAAA;QACJ,CAAC;IACH,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAA;IAElB,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;YACtB,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,CAAA;YAC7C,eAAe,CAAC,IAAI,CAAC,CAAA;QACvB,CAAC;IACH,CAAC,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAA;IAEvB,MAAM,IAAI,GAAG,OAAO,CAA6B;QAC/C,QAAQ,EAAE,WAAW,CAAC,UAAiB,CAAC;QACxC,aAAa,EAAE;YACb,IAAI,EAAE,EAAE;SACT;KACF,CAAC,CAAA;IAEF,MAAM,cAAc,GAAG,KAAK,EAAE,MAAkC,EAAE,EAAE;QAClE,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,CAAA;QACvB,MAAM,KAAK,GAAG,MAAM,eAAe,CAAC,IAAI,CAAC,CAAA;QACzC,IAAI,CAAC,KAAK,EAAE,CAAC;YACX,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE,EAAE,OAAO,EAAE,cAAc,EAAE,CAAC,CAAA;YAClD,OAAM;QACR,CAAC;QACD,eAAe,CAAC,IAAI,CAAC,CAAA;QACrB,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,CAAA;IAC7B,CAAC,CAAA;IAED,MAAM,eAAe,GAAG,GAAG,EAAE;QAC3B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,CAAA;QAC1B,eAAe,CAAC,KAAK,CAAC,CAAA;IACxB,CAAC,CAAA;IAED,OAAO,CACL,cAAK,SAAS,EAAC,mCAAmC,YAChD,KAAC,IAAI,OAAK,IAAI,YACZ,eAAM,QAAQ,EAAE,IAAI,CAAC,YAAY,CAAC,cAAc,CAAC,YAC/C,eAAK,SAAS,EAAC,yBAAyB,aACtC,KAAC,SAAS,IACR,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,IAAI,EAAC,MAAM,EACX,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CACrB,KAAC,QAAQ,IAAC,SAAS,EAAC,QAAQ,YAC1B,KAAC,WAAW,cACV,KAAC,KAAK,OAAK,KAAK,EAAE,SAAS,EAAC,KAAK,EAAC,WAAW,EAAC,yBAAyB,EAAC,OAAO,EAAE,eAAe,GAAG,GACvF,GACL,CACZ,GACD,EACD,YAAY,CAAC,CAAC,CAAC,CACd,KAAC,KAAK,KAAE,CACT,CAAC,CAAC,CAAC,CACF,KAAC,MAAM,IAAC,OAAO,EAAC,SAAS,EAAC,SAAS,EAAC,+CAA+C,sBAAe,CACnG,IACG,GACD,GACF,GACH,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,SAAS,CAAA"}

package/dist/components/cart/cart-panel/promo-code.jsx

@@ -0,0 +1,74 @@
+'use client';
+import { useEffect, useState } from 'react';
+import { useSearchParams } from 'next/navigation';
+import { observer } from 'mobx-react-lite';
+import { useForm } from 'react-hook-form';
+import * as z from 'zod';
+import { zodResolver } from '@hookform/resolvers/zod';
+import { Check } from 'lucide-react';
+import { Button, Form, FormControl, FormField, FormItem, Input } from '@hanzo/ui/primitives';
+import { useCommerce } from '../../../service/context';
+import getPromoFromApi from '../../../util/promo-codes';
+const formSchema = z.object({
+    code: z.string().min(1, 'Invalid code'),
+});
+const PromoCode = observer(() => {
+    const cmmc = useCommerce();
+    const searchParams = useSearchParams();
+    const [codeAccepted, setCodeAccepted] = useState(false);
+    useEffect(() => {
+        const code = searchParams.get('code');
+        if (code) {
+            getPromoFromApi(code).then((promo) => {
+                if (promo) {
+                    form.setValue('code', code);
+                    setCodeAccepted(true);
+                    cmmc.setAppliedPromo(promo);
+                }
+            });
+        }
+    }, [searchParams]);
+    useEffect(() => {
+        if (cmmc.appliedPromo) {
+            form.setValue('code', cmmc.appliedPromo.code);
+            setCodeAccepted(true);
+        }
+    }, [cmmc.appliedPromo]);
+    const form = useForm({
+        // @ts-expect-error Zod version incompatibility between ZodTypeDef and $ZodTypeInternals
+        resolver: zodResolver(formSchema),
+        defaultValues: {
+            code: '',
+        },
+    });
+    const applyPromoCode = async (values) => {
+        const { code } = values;
+        const promo = await getPromoFromApi(code);
+        if (!promo) {
+            form.setError('code', { message: 'Invalid code' });
+            return;
+        }
+        setCodeAccepted(true);
+        cmmc.setAppliedPromo(promo);
+    };
+    const removePromoCode = () => {
+        cmmc.setAppliedPromo(null);
+        setCodeAccepted(false);
+    };
+    return (<div className='flex flex-col gap-2 border-t py-1'>
+      <Form {...form}>
+        <form onSubmit={form.handleSubmit(applyPromoCode)}>
+          <div className='flex gap-2 items-center'>
+            <FormField control={form.control} name='code' render={({ field }) => (<FormItem className='w-full'>
+                  <FormControl>
+                    <Input {...field} className='h-9' placeholder='Discount or invite code' onInput={removePromoCode}/>
+                  </FormControl>
+                </FormItem>)}/>
+            {codeAccepted ? (<Check />) : (<Button variant='outline' className='!w-fit !min-w-0 font-inter text-muted text-sm'>Apply</Button>)}
+          </div>
+        </form>
+      </Form>
+    </div>);
+});
+export default PromoCode;
+//# sourceMappingURL=promo-code.jsx.map

package/dist/components/cart/cart-panel/promo-code.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"promo-code.jsx","sourceRoot":"","sources":["../../../../components/cart/cart-panel/promo-code.tsx"],"names":[],"mappings":"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"}

package/dist/components/cart/cart-panel/total-area.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+declare const TotalArea: React.FC<{
+    showPromoCode?: boolean;
+    showShipping?: boolean;
+    clx?: string;
+}>;
+export default TotalArea;

package/dist/components/cart/cart-panel/total-area.js

@@ -0,0 +1,14 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { Suspense } from 'react';
+import { observer } from 'mobx-react-lite';
+import { cn } from '@hanzo/ui/util';
+import { formatCurrencyValue } from '../../../util';
+import PromoCode from './promo-code';
+import { useCommerce } from '../../../service/context';
+const TotalArea = observer(({ showPromoCode = false, showShipping = false, clx }) => {
+    const cmmc = useCommerce();
+    return (_jsxs("div", { className: clx, children: [showPromoCode && (_jsx(Suspense, { children: _jsx(PromoCode, {}) })), (showShipping || showPromoCode) && (_jsxs("div", { className: 'flex flex-col gap-0.5 pb-1.5 text-sm ' + (!showPromoCode ? 'border-t pt-1.5' : ''), children: [_jsxs("p", { className: 'flex justify-between', children: [_jsx("span", { className: 'text-muted-1', children: "Subtotal" }), _jsx("span", { className: 'font-semibold', children: cmmc.cartTotal === 0 ? '0' : formatCurrencyValue(cmmc.cartTotal) })] }), cmmc.promoAppliedCartTotal !== cmmc.cartTotal && (_jsxs("p", { className: 'flex justify-between', children: [_jsx("span", { className: 'text-muted-1', children: "Promo Discount" }), _jsxs("span", { className: 'font-semibold', children: ["-", formatCurrencyValue(cmmc.cartTotal - cmmc.promoAppliedCartTotal)] })] })), showShipping && (_jsxs("p", { className: 'flex justify-between', children: [_jsx("span", { className: 'text-muted-1', children: "Shipping" }), _jsx("span", { className: 'font-semibold', children: "Free Global Shipping" })] }))] })), _jsxs("p", { className: cn('border-t py-2 flex justify-between'), children: ["TOTAL", _jsx("span", { className: 'font-semibold', children: formatCurrencyValue(showPromoCode ? cmmc.promoAppliedCartTotal : cmmc.cartTotal) })] })] }));
+});
+export default TotalArea;
+//# sourceMappingURL=total-area.js.map

package/dist/components/cart/cart-panel/total-area.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"total-area.js","sourceRoot":"","sources":["../../../../components/cart/cart-panel/total-area.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AACZ,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAA;AAE1C,OAAO,EAAE,EAAE,EAAE,MAAM,gBAAgB,CAAA;AAEnC,OAAO,EAAE,mBAAmB,EAAE,MAAM,eAAe,CAAA;AACnD,OAAO,SAAS,MAAM,cAAc,CAAA;AACpC,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AAEtD,MAAM,SAAS,GAIV,QAAQ,CAAC,CAAC,EACb,aAAa,GAAC,KAAK,EACnB,YAAY,GAAC,KAAK,EAClB,GAAG,EACJ,EAAE,EAAE;IAEH,MAAM,IAAI,GAAG,WAAW,EAAE,CAAA;IAE1B,OAAO,CACL,eAAK,SAAS,EAAE,GAAG,aAClB,aAAa,IAAI,CAChB,KAAC,QAAQ,cACP,KAAC,SAAS,KAAE,GACH,CACZ,EACA,CAAC,YAAY,IAAI,aAAa,CAAC,IAAI,CAClC,eAAK,SAAS,EAAE,uCAAuC,GAAG,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,CAAC,aACjG,aAAG,SAAS,EAAC,sBAAsB,aACjC,eAAM,SAAS,EAAC,cAAc,yBAAgB,EAC9C,eAAM,SAAS,EAAC,eAAe,YAAE,IAAI,CAAC,SAAS,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,mBAAmB,CAAC,IAAI,CAAC,SAAS,CAAC,GAAQ,IACvG,EACH,IAAI,CAAC,qBAAqB,KAAK,IAAI,CAAC,SAAS,IAAI,CAChD,aAAG,SAAS,EAAC,sBAAsB,aACjC,eAAM,SAAS,EAAC,cAAc,+BAAsB,EACpD,gBAAM,SAAS,EAAC,eAAe,kBAAG,mBAAmB,CAAC,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,qBAAqB,CAAC,IAAQ,IACxG,CACL,EACA,YAAY,IAAI,CACf,aAAG,SAAS,EAAC,sBAAsB,aACjC,eAAM,SAAS,EAAC,cAAc,yBAAgB,EAC9C,eAAM,SAAS,EAAC,eAAe,qCAA4B,IACzD,CACL,IACG,CACP,EACC,aAAG,SAAS,EAAE,EAAE,CAAC,oCAAoC,CAAC,sBAEpD,eAAM,SAAS,EAAC,eAAe,YAC5B,mBAAmB,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,GAC5E,IACL,IACA,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,SAAS,CAAA"}

package/dist/components/cart/cart-panel/total-area.jsx

@@ -0,0 +1,37 @@
+'use client';
+import React, { Suspense } from 'react';
+import { observer } from 'mobx-react-lite';
+import { cn } from '@hanzo/ui/util';
+import { formatCurrencyValue } from '../../../util';
+import PromoCode from './promo-code';
+import { useCommerce } from '../../../service/context';
+const TotalArea = observer(({ showPromoCode = false, showShipping = false, clx }) => {
+    const cmmc = useCommerce();
+    return (<div className={clx}> 
+    {showPromoCode && (<Suspense>
+        <PromoCode />
+      </Suspense>)}
+    {(showShipping || showPromoCode) && (<div className={'flex flex-col gap-0.5 pb-1.5 text-sm ' + (!showPromoCode ? 'border-t pt-1.5' : '')}>
+        <p className='flex justify-between'>
+          <span className='text-muted-1'>Subtotal</span>
+          <span className='font-semibold'>{cmmc.cartTotal === 0 ? '0' : formatCurrencyValue(cmmc.cartTotal)}</span>
+        </p>
+        {cmmc.promoAppliedCartTotal !== cmmc.cartTotal && (<p className='flex justify-between'>
+            <span className='text-muted-1'>Promo Discount</span>
+            <span className='font-semibold'>-{formatCurrencyValue(cmmc.cartTotal - cmmc.promoAppliedCartTotal)}</span>
+          </p>)}
+        {showShipping && (<p className='flex justify-between'>
+            <span className='text-muted-1'>Shipping</span>
+            <span className='font-semibold'>Free Global Shipping</span>
+          </p>)}
+      </div>)}
+      <p className={cn('border-t py-2 flex justify-between')}>
+        TOTAL
+        <span className='font-semibold'>
+          {formatCurrencyValue(showPromoCode ? cmmc.promoAppliedCartTotal : cmmc.cartTotal)}
+        </span>
+      </p>
+    </div>);
+});
+export default TotalArea;
+//# sourceMappingURL=total-area.jsx.map

package/dist/components/cart/cart-panel/total-area.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"total-area.jsx","sourceRoot":"","sources":["../../../../components/cart/cart-panel/total-area.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;AACZ,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAA;AAE1C,OAAO,EAAE,EAAE,EAAE,MAAM,gBAAgB,CAAA;AAEnC,OAAO,EAAE,mBAAmB,EAAE,MAAM,eAAe,CAAA;AACnD,OAAO,SAAS,MAAM,cAAc,CAAA;AACpC,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AAEtD,MAAM,SAAS,GAIV,QAAQ,CAAC,CAAC,EACb,aAAa,GAAC,KAAK,EACnB,YAAY,GAAC,KAAK,EAClB,GAAG,EACJ,EAAE,EAAE;IAEH,MAAM,IAAI,GAAG,WAAW,EAAE,CAAA;IAE1B,OAAO,CACL,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,GAAG,CAAC,CACpB;IAAA,CAAC,aAAa,IAAI,CAChB,CAAC,QAAQ,CACP;QAAA,CAAC,SAAS,CAAA,EACZ;MAAA,EAAE,QAAQ,CAAC,CACZ,CACD;IAAA,CAAC,CAAC,YAAY,IAAI,aAAa,CAAC,IAAI,CAClC,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,uCAAuC,GAAG,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAClG;QAAA,CAAC,CAAC,CAAC,SAAS,CAAC,sBAAsB,CACjC;UAAA,CAAC,IAAI,CAAC,SAAS,CAAC,cAAc,CAAC,QAAQ,EAAE,IAAI,CAC7C;UAAA,CAAC,IAAI,CAAC,SAAS,CAAC,eAAe,CAAC,CAAC,IAAI,CAAC,SAAS,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,mBAAmB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,IAAI,CAC1G;QAAA,EAAE,CAAC,CACH;QAAA,CAAC,IAAI,CAAC,qBAAqB,KAAK,IAAI,CAAC,SAAS,IAAI,CAChD,CAAC,CAAC,CAAC,SAAS,CAAC,sBAAsB,CACjC;YAAA,CAAC,IAAI,CAAC,SAAS,CAAC,cAAc,CAAC,cAAc,EAAE,IAAI,CACnD;YAAA,CAAC,IAAI,CAAC,SAAS,CAAC,eAAe,CAAC,CAAC,CAAC,mBAAmB,CAAC,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,qBAAqB,CAAC,CAAC,EAAE,IAAI,CAC3G;UAAA,EAAE,CAAC,CAAC,CACL,CACD;QAAA,CAAC,YAAY,IAAI,CACf,CAAC,CAAC,CAAC,SAAS,CAAC,sBAAsB,CACjC;YAAA,CAAC,IAAI,CAAC,SAAS,CAAC,cAAc,CAAC,QAAQ,EAAE,IAAI,CAC7C;YAAA,CAAC,IAAI,CAAC,SAAS,CAAC,eAAe,CAAC,oBAAoB,EAAE,IAAI,CAC5D;UAAA,EAAE,CAAC,CAAC,CACL,CACH;MAAA,EAAE,GAAG,CAAC,CACP,CACC;MAAA,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,oCAAoC,CAAC,CAAC,CACrD;;QACA,CAAC,IAAI,CAAC,SAAS,CAAC,eAAe,CAC7B;UAAA,CAAC,mBAAmB,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CACnF;QAAA,EAAE,IAAI,CACR;MAAA,EAAE,CAAC,CACL;IAAA,EAAE,GAAG,CAAC,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,SAAS,CAAA"}

package/dist/components/checkout/payment-step-form/card-icon-row.d.ts

@@ -0,0 +1,2 @@
+declare const PaymentMethods: React.FC;
+export default PaymentMethods;

package/dist/components/checkout/payment-step-form/card-icon-row.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { LockKeyhole } from 'lucide-react';
+import Amex from './card-icons/amex';
+import Discover from './card-icons/discover';
+import Mastercard from './card-icons/mastercard';
+import Visa from './card-icons/visa';
+import DinersClub from './card-icons/diners-club';
+import Jcb from './card-icons/jcb';
+//       <span className='hidden sm:flex text-sm'>Secure payments with</span>
+const PaymentMethods = () => {
+    return (_jsxs("div", { className: 'flex gap-1 items-center text-muted-1 pb-3', children: [_jsx(LockKeyhole, { className: 'w-4 h-4' }), _jsx("span", { className: 'hidden sm:flex text-sm', children: "Secure payments with" }), _jsx(Amex, { className: 'w-9 h-5' }), _jsx(Discover, { className: 'w-9 h-5' }), _jsx(Mastercard, { className: 'w-9 h-5' }), _jsx(Visa, { className: 'w-9 h-5' }), _jsx(DinersClub, { className: 'w-9 h-5' }), _jsx(Jcb, { className: 'w-9 h-5' })] }));
+};
+export default PaymentMethods;
+//# sourceMappingURL=card-icon-row.js.map

package/dist/components/checkout/payment-step-form/card-icon-row.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"card-icon-row.js","sourceRoot":"","sources":["../../../../components/checkout/payment-step-form/card-icon-row.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAA;AAC1C,OAAO,IAAI,MAAM,mBAAmB,CAAA;AACpC,OAAO,QAAQ,MAAM,uBAAuB,CAAA;AAC5C,OAAO,UAAU,MAAM,yBAAyB,CAAA;AAChD,OAAO,IAAI,MAAM,mBAAmB,CAAA;AACpC,OAAO,UAAU,MAAM,0BAA0B,CAAA;AACjD,OAAO,GAAG,MAAM,kBAAkB,CAAA;AAElC,6EAA6E;AAE7E,MAAM,cAAc,GAAa,GAAG,EAAE;IACpC,OAAO,CACL,eAAK,SAAS,EAAC,2CAA2C,aACxD,KAAC,WAAW,IAAC,SAAS,EAAC,SAAS,GAAE,EAClC,eAAM,SAAS,EAAC,wBAAwB,qCAA4B,EACpE,KAAC,IAAI,IAAC,SAAS,EAAC,SAAS,GAAE,EAC3B,KAAC,QAAQ,IAAC,SAAS,EAAC,SAAS,GAAE,EAC/B,KAAC,UAAU,IAAC,SAAS,EAAC,SAAS,GAAE,EACjC,KAAC,IAAI,IAAC,SAAS,EAAC,SAAS,GAAE,EAC3B,KAAC,UAAU,IAAC,SAAS,EAAC,SAAS,GAAE,EACjC,KAAC,GAAG,IAAC,SAAS,EAAC,SAAS,GAAE,IACtB,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,cAAc,CAAA"}

package/dist/components/checkout/payment-step-form/card-icon-row.jsx

@@ -0,0 +1,22 @@
+import { LockKeyhole } from 'lucide-react';
+import Amex from './card-icons/amex';
+import Discover from './card-icons/discover';
+import Mastercard from './card-icons/mastercard';
+import Visa from './card-icons/visa';
+import DinersClub from './card-icons/diners-club';
+import Jcb from './card-icons/jcb';
+//       <span className='hidden sm:flex text-sm'>Secure payments with</span>
+const PaymentMethods = () => {
+    return (<div className='flex gap-1 items-center text-muted-1 pb-3'>
+      <LockKeyhole className='w-4 h-4'/>
+      <span className='hidden sm:flex text-sm'>Secure payments with</span>
+      <Amex className='w-9 h-5'/>
+      <Discover className='w-9 h-5'/>
+      <Mastercard className='w-9 h-5'/>
+      <Visa className='w-9 h-5'/>
+      <DinersClub className='w-9 h-5'/>
+      <Jcb className='w-9 h-5'/>
+    </div>);
+};
+export default PaymentMethods;
+//# sourceMappingURL=card-icon-row.jsx.map

package/dist/components/checkout/payment-step-form/card-icon-row.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"card-icon-row.jsx","sourceRoot":"","sources":["../../../../components/checkout/payment-step-form/card-icon-row.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAA;AAC1C,OAAO,IAAI,MAAM,mBAAmB,CAAA;AACpC,OAAO,QAAQ,MAAM,uBAAuB,CAAA;AAC5C,OAAO,UAAU,MAAM,yBAAyB,CAAA;AAChD,OAAO,IAAI,MAAM,mBAAmB,CAAA;AACpC,OAAO,UAAU,MAAM,0BAA0B,CAAA;AACjD,OAAO,GAAG,MAAM,kBAAkB,CAAA;AAElC,6EAA6E;AAE7E,MAAM,cAAc,GAAa,GAAG,EAAE;IACpC,OAAO,CACL,CAAC,GAAG,CAAC,SAAS,CAAC,2CAA2C,CACxD;MAAA,CAAC,WAAW,CAAC,SAAS,CAAC,SAAS,EAChC;MAAA,CAAC,IAAI,CAAC,SAAS,CAAC,wBAAwB,CAAC,oBAAoB,EAAE,IAAI,CACnE;MAAA,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,EACzB;MAAA,CAAC,QAAQ,CAAC,SAAS,CAAC,SAAS,EAC7B;MAAA,CAAC,UAAU,CAAC,SAAS,CAAC,SAAS,EAC/B;MAAA,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,EACzB;MAAA,CAAC,UAAU,CAAC,SAAS,CAAC,SAAS,EAC/B;MAAA,CAAC,GAAG,CAAC,SAAS,CAAC,SAAS,EAC1B;IAAA,EAAE,GAAG,CAAC,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,cAAc,CAAA"}

package/dist/components/checkout/payment-step-form/card-icons/amex.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { type LucideProps } from 'lucide-react';
+declare const Amex: React.FC<LucideProps>;
+export default Amex;

package/dist/components/checkout/payment-step-form/card-icons/amex.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import {} from 'lucide-react';
+const Amex = (props) => (_jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", role: "img", viewBox: "0 0 38 24", "aria-labelledby": "pi-american_express", ...props, children: [_jsx("title", { id: "pi-american_express", children: "American Express" }), _jsxs("g", { fill: "none", children: [_jsx("path", { fill: "#000", d: "M35,0 L3,0 C1.3,0 0,1.3 0,3 L0,21 C0,22.7 1.4,24 3,24 L35,24 C36.7,24 38,22.7 38,21 L38,3 C38,1.3 36.6,0 35,0 Z", opacity: ".07" }), _jsx("path", { fill: "#006FCF", d: "M35,1 C36.1,1 37,1.9 37,3 L37,21 C37,22.1 36.1,23 35,23 L3,23 C1.9,23 1,22.1 1,21 L1,3 C1,1.9 1.9,1 3,1 L35,1" }), _jsx("path", { fill: "#FFF", d: "M8.971,10.268 L9.745,12.144 L8.203,12.144 L8.971,10.268 Z M25.046,10.346 L22.069,10.346 L22.069,11.173 L24.998,11.173 L24.998,12.412 L22.075,12.412 L22.075,13.334 L25.052,13.334 L25.052,14.073 L27.129,11.828 L25.052,9.488 L25.046,10.346 L25.046,10.346 Z M10.983,8.006 L14.978,8.006 L15.865,9.941 L16.687,8 L27.057,8 L28.135,9.19 L29.25,8 L34.013,8 L30.494,11.852 L33.977,15.68 L29.143,15.68 L28.065,14.49 L26.94,15.68 L10.03,15.68 L9.536,14.49 L8.406,14.49 L7.911,15.68 L4,15.68 L7.286,8 L10.716,8 L10.983,8.006 Z M19.646,9.084 L17.407,9.084 L15.907,12.62 L14.282,9.084 L12.06,9.084 L12.06,13.894 L10,9.084 L8.007,9.084 L5.625,14.596 L7.18,14.596 L7.674,13.406 L10.27,13.406 L10.764,14.596 L13.484,14.596 L13.484,10.661 L15.235,14.602 L16.425,14.602 L18.165,10.673 L18.165,14.603 L19.623,14.603 L19.647,9.083 L19.646,9.084 Z M28.986,11.852 L31.517,9.084 L29.695,9.084 L28.094,10.81 L26.546,9.084 L20.652,9.084 L20.652,14.602 L26.462,14.602 L28.076,12.864 L29.624,14.602 L31.499,14.602 L28.987,11.852 L28.986,11.852 Z" })] })] }));
+export default Amex;
+//# sourceMappingURL=amex.js.map

package/dist/components/checkout/payment-step-form/card-icons/amex.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"amex.js","sourceRoot":"","sources":["../../../../../components/checkout/payment-step-form/card-icons/amex.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAoB,MAAM,cAAc,CAAA;AAE/C,MAAM,IAAI,GAA0B,CAAC,KAAkB,EAAE,EAAE,CAAC,CAC3D,eACG,KAAK,EAAC,4BAA4B,EAClC,IAAI,EAAC,KAAK,EACV,OAAO,EAAC,WAAW,qBACH,qBAAqB,KACjC,KAAK,aAET,gBAAO,EAAE,EAAC,qBAAqB,iCAAyB,EACxD,aAAG,IAAI,EAAC,MAAM,aACZ,eACE,IAAI,EAAC,MAAM,EACX,CAAC,EAAC,iHAAiH,EACnH,OAAO,EAAC,KAAK,GACb,EACF,eACE,IAAI,EAAC,SAAS,EACd,CAAC,EAAC,+GAA+G,GACjH,EACF,eACE,IAAI,EAAC,MAAM,EACX,CAAC,EAAC,0/BAA0/B,GAC5/B,IACA,IACA,CAEP,CAAA;AAED,eAAe,IAAI,CAAA"}

package/dist/components/checkout/payment-step-form/card-icons/amex.jsx

@@ -0,0 +1,12 @@
+import React from 'react';
+import {} from 'lucide-react';
+const Amex = (props) => (<svg xmlns="http://www.w3.org/2000/svg" role="img" viewBox="0 0 38 24" aria-labelledby="pi-american_express" {...props}>
+    <title id="pi-american_express">American Express</title>
+    <g fill="none">
+      <path fill="#000" d="M35,0 L3,0 C1.3,0 0,1.3 0,3 L0,21 C0,22.7 1.4,24 3,24 L35,24 C36.7,24 38,22.7 38,21 L38,3 C38,1.3 36.6,0 35,0 Z" opacity=".07"/>
+      <path fill="#006FCF" d="M35,1 C36.1,1 37,1.9 37,3 L37,21 C37,22.1 36.1,23 35,23 L3,23 C1.9,23 1,22.1 1,21 L1,3 C1,1.9 1.9,1 3,1 L35,1"/>
+      <path fill="#FFF" d="M8.971,10.268 L9.745,12.144 L8.203,12.144 L8.971,10.268 Z M25.046,10.346 L22.069,10.346 L22.069,11.173 L24.998,11.173 L24.998,12.412 L22.075,12.412 L22.075,13.334 L25.052,13.334 L25.052,14.073 L27.129,11.828 L25.052,9.488 L25.046,10.346 L25.046,10.346 Z M10.983,8.006 L14.978,8.006 L15.865,9.941 L16.687,8 L27.057,8 L28.135,9.19 L29.25,8 L34.013,8 L30.494,11.852 L33.977,15.68 L29.143,15.68 L28.065,14.49 L26.94,15.68 L10.03,15.68 L9.536,14.49 L8.406,14.49 L7.911,15.68 L4,15.68 L7.286,8 L10.716,8 L10.983,8.006 Z M19.646,9.084 L17.407,9.084 L15.907,12.62 L14.282,9.084 L12.06,9.084 L12.06,13.894 L10,9.084 L8.007,9.084 L5.625,14.596 L7.18,14.596 L7.674,13.406 L10.27,13.406 L10.764,14.596 L13.484,14.596 L13.484,10.661 L15.235,14.602 L16.425,14.602 L18.165,10.673 L18.165,14.603 L19.623,14.603 L19.647,9.083 L19.646,9.084 Z M28.986,11.852 L31.517,9.084 L29.695,9.084 L28.094,10.81 L26.546,9.084 L20.652,9.084 L20.652,14.602 L26.462,14.602 L28.076,12.864 L29.624,14.602 L31.499,14.602 L28.987,11.852 L28.986,11.852 Z"/>
+    </g>
+  </svg>);
+export default Amex;
+//# sourceMappingURL=amex.jsx.map

package/dist/components/checkout/payment-step-form/card-icons/amex.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"amex.jsx","sourceRoot":"","sources":["../../../../../components/checkout/payment-step-form/card-icons/amex.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAoB,MAAM,cAAc,CAAA;AAE/C,MAAM,IAAI,GAA0B,CAAC,KAAkB,EAAE,EAAE,CAAC,CAC3D,CAAC,GAAG,CACD,KAAK,CAAC,4BAA4B,CAClC,IAAI,CAAC,KAAK,CACV,OAAO,CAAC,WAAW,CACnB,eAAe,CAAC,qBAAqB,CACrC,IAAI,KAAK,CAAC,CAEV;IAAA,CAAC,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAAC,gBAAgB,EAAE,KAAK,CACvD;IAAA,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CACZ;MAAA,CAAC,IAAI,CACH,IAAI,CAAC,MAAM,CACX,CAAC,CAAC,iHAAiH,CACnH,OAAO,CAAC,KAAK,EAEf;MAAA,CAAC,IAAI,CACH,IAAI,CAAC,SAAS,CACd,CAAC,CAAC,+GAA+G,EAEnH;MAAA,CAAC,IAAI,CACH,IAAI,CAAC,MAAM,CACX,CAAC,CAAC,0/BAA0/B,EAEhgC;IAAA,EAAE,CAAC,CACL;EAAA,EAAE,GAAG,CAAC,CAEP,CAAA;AAED,eAAe,IAAI,CAAA"}

package/dist/components/checkout/payment-step-form/card-icons/diners-club.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { type LucideProps } from 'lucide-react';
+declare const DinersClub: React.FC<LucideProps>;
+export default DinersClub;