@luxfi/ui 8.2.7 → 8.2.9

package/dist/site/components/commerce/checkout-panel/mobile-cp.cjs

@@ -3,241 +3,20 @@
 
 var primitives = require('@hanzo/ui/primitives');
 var ui = require('@hanzo/ui');
-var react = require('react');
-var react$1 = require('@hanzo/iam/react');
+var AuthWidget = require('../../auth/widget.cjs');
+var index_cjs = require('../../index.cjs');
+var BagButton = require('../bag-button.cjs');
+var PolicyLinks = require('./policy-links.cjs');
+var CartAccordian = require('./cart-accordian.cjs');
 var jsxRuntime = require('react/jsx-runtime');
-var Link2 = require('next/link');
-var logo = require('@luxfi/logo');
-var mobx = require('mobx');
-var mobxReactLite = require('mobx-react-lite');
-var commerce = require('@hanzo/commerce');
-var navigation = require('next/navigation');
-var lucideReact = require('lucide-react');
-require('embla-carousel-autoplay');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
-var Link2__default = /*#__PURE__*/_interopDefault(Link2);
+var AuthWidget__default = /*#__PURE__*/_interopDefault(AuthWidget);
+var BagButton__default = /*#__PURE__*/_interopDefault(BagButton);
+var PolicyLinks__default = /*#__PURE__*/_interopDefault(PolicyLinks);
+var CartAccordian__default = /*#__PURE__*/_interopDefault(CartAccordian);
 
-// src/site/components/auth/resume.ts
-var KEY = "lux-auth-resume";
-var remember = () => {
-  sessionStorage.setItem(KEY, window.location.pathname + window.location.search);
-};
-var Widget = ({
-  noLogin = false,
-  handleLogin,
-  className
-}) => {
-  const { isAuthenticated, isLoading, login, logout } = react$1.useIam();
-  const identity = react$1.useIamIdentity();
-  if (isLoading) {
-    return null;
-  }
-  if (!isAuthenticated) {
-    return noLogin ? null : /* @__PURE__ */ jsxRuntime.jsx(
-      primitives.Button,
-      {
-        variant: "primary",
-        className: ui.cn("h-8 w-fit !min-w-0", className),
-        onClick: handleLogin ?? (() => {
-          remember();
-          void login();
-        }),
-        children: "Login"
-      }
-    );
-  }
-  return /* @__PURE__ */ jsxRuntime.jsxs(primitives.Popover, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(primitives.PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
-      primitives.Button,
-      {
-        variant: "outline",
-        size: "icon",
-        className: ui.cn("rounded-full text-muted border-2 border-muted bg-level-1 hover:bg-level-2 hover:border-foreground hover:text-foreground uppercase w-8 h-8", className),
-        children: identity?.initials
-      }
-    ) }),
-    /* @__PURE__ */ jsxRuntime.jsx(primitives.PopoverContent, { className: "bg-level-0", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-4", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2 truncate", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "font-medium leading-none truncate", children: identity?.name }),
-        identity?.email && identity.email !== identity.name && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm opacity-50 truncate", children: identity.email })
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx(primitives.Separator, {}),
-      /* @__PURE__ */ jsxRuntime.jsx(primitives.Button, { variant: "outline", onClick: () => {
-        logout();
-      }, children: "Logout" })
-    ] }) })
-  ] });
-};
-var AuthWidget = (props) => react.useContext(react$1.IamContext) ? /* @__PURE__ */ jsxRuntime.jsx(Widget, { ...props }) : null;
-var widget_default = AuthWidget;
-var SIZE = {
-  xl: { mark: 40, word: 22, gap: "gap-4" },
-  lg: { mark: 40, word: 22, gap: "gap-4" },
-  md: { mark: 32, word: 18, gap: "gap-3" },
-  sm: { mark: 24, word: 13, gap: "gap-2" },
-  xs: { mark: 16, word: 9, gap: "gap-1.5" }
-};
-var Logo = ({
-  size = "md",
-  href,
-  // no default please!
-  outerClx = "",
-  variant = "full",
-  onClick
-}) => {
-  const s = SIZE[size] ?? SIZE.md;
-  const clx = "flex flex-row items-center " + s.gap + " " + (href ? "hover:opacity-80 cursor-pointer " : "cursor-default ") + outerClx;
-  const art = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    variant !== "wordmark" && /* @__PURE__ */ jsxRuntime.jsx(logo.Logo, { variant: "white", size: s.mark }),
-    variant !== "mark" && /* @__PURE__ */ jsxRuntime.jsx(logo.Wordmark, { height: s.word })
-  ] });
-  return href ? /* @__PURE__ */ jsxRuntime.jsx(Link2__default.default, { href, style: ui.css(clx), onClick, children: art }) : /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { tag: "span", className: clx, onClick, children: art });
-};
-var BagIcon = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { fill: "none", viewBox: "0 0 1019 1281", ...props, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m977.243 365.553h-175.407v-90.629c0-151.923-131.968-274.924-292.334-274.924-160.367 0-292.337 123.002-292.337 274.924v90.629h-175.4023c-23.3886 0-41.7627 17.051-41.7627 38.756v775.121c0 55.8 48.4456 100.76 108.582 100.76h801.84c60.138 0 108.578-44.96 108.578-100.76v-775.121c0-21.705-18.37-38.756-41.757-38.756zm-676.553-90.629c0-108.517 93.546-196.9408 208.812-196.9408 115.265 0 208.813 88.4218 208.813 196.9408v89.08h-417.625z", fill: "currentColor" }) });
-var bag_icon_default = BagIcon;
-var BagButton = mobxReactLite.observer(({
-  showIfEmpty = false,
-  animateOnHover = true,
-  animateOnQuantityChange = true,
-  size = "default",
-  className = "",
-  iconClx = "",
-  onClick
-}) => {
-  const c = commerce.useCommerce();
-  const wiggleRef = react.useRef(mobx.observable.box("none"));
-  react.useEffect(() => (
-    // return IReactionDisposer
-    animateOnQuantityChange && c ? mobx.reaction(
-      () => c.cartQuantity,
-      (curr, prev) => {
-        if (curr > prev) {
-          mobx.runInAction(() => {
-            wiggleRef.current.set("more");
-          });
-        } else {
-          mobx.runInAction(() => {
-            wiggleRef.current.set("less");
-          });
-        }
-        setTimeout(() => {
-          mobx.runInAction(() => {
-            wiggleRef.current.set("none");
-          });
-        }, 800);
-      }
-    ) : void 0
-  ), []);
-  if (!c || !showIfEmpty && c.cartEmpty) {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", {});
-  }
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    ui.Box,
-    {
-      "aria-label": "Bag",
-      role: "button",
-      onClick,
-      className: ui.cn(
-        primitives.buttonVariants({ variant: "ghost", size }),
-        "rounded-md",
-        // Overides the bg change on hover --not a "hover effect" 
-        "relative group p-0 aspect-square hover:bg-background",
-        wiggleRef.current.get() === "more" ? "item-added-to-cart-animation" : wiggleRef.current.get() === "less" ? "item-removed-from-cart-animation" : "",
-        className
-      ),
-      children: [
-        !c.cartEmpty && /* @__PURE__ */ jsxRuntime.jsxs(ui.Box, { className: "z-above-content flex flex-col justify-center items-center  absolute left-0 right-0 top-0 bottom-0 leading-none font-sans font-bold text-primary-fg text-xs ", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-[3px] w-full" }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { children: c.cartQuantity })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx(bag_icon_default, { width: "24", height: "28", className: ui.cn(
-          "relative -top-[3px] fill-primary",
-          iconClx,
-          animateOnHover ? "group-hover:fill-primary-hover group-hover:scale-105 transition-scale transition-duration-300" : ""
-        ), "aria-hidden": "true" })
-      ]
-    }
-  );
-});
-var bag_button_default = BagButton;
-var BackButton = ({
-  variant = "ghost",
-  size = "default",
-  clx = "",
-  iconClx = "",
-  onBack
-}) => {
-  const router = navigation.useRouter();
-  const back = () => {
-    if (onBack) {
-      onBack();
-    }
-    router.back();
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    primitives.Button,
-    {
-      variant,
-      size,
-      onClick: back,
-      className: clx,
-      children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronLeft, { style: ui.css(iconClx) })
-    }
-  );
-};
-var back_button_default = BackButton;
-var linkClx = ui.cn(primitives.buttonVariants({ variant: "linkMuted" }), "rounded-none");
-var PolicyLinks = ({
-  clx = ""
-}) => /* @__PURE__ */ jsxRuntime.jsxs(ui.Box, { className: ui.cn("flex flex-col items-center", clx), children: [
-  /* @__PURE__ */ jsxRuntime.jsx(primitives.Separator, {}),
-  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-4 py-2 text-sm", children: [
-    /* @__PURE__ */ jsxRuntime.jsx(Link2__default.default, { style: ui.css(linkClx), href: "", children: "refund policy" }),
-    /* @__PURE__ */ jsxRuntime.jsx(Link2__default.default, { style: ui.css(linkClx), href: "", children: "privacy policy" })
-  ] })
-] });
-var policy_links_default = PolicyLinks;
-var CartAccordian = mobxReactLite.observer(({
-  icon,
-  clx = "",
-  panelClx = "",
-  triggerClx = "",
-  scrollAfter,
-  scrollHeightClx
-}) => {
-  const cmmc = commerce.useCommerce();
-  return /* @__PURE__ */ jsxRuntime.jsx(primitives.Accordion, { type: "single", collapsible: true, className: clx, children: /* @__PURE__ */ jsxRuntime.jsxs(primitives.AccordionItem, { value: "cart", className: "w-full border-b-0", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(primitives.AccordionTrigger, { className: "!no-underline group flex justify-between ", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-0 items-center", children: [
-        icon,
-        /* @__PURE__ */ jsxRuntime.jsxs("h5", { className: "text-sm sm:text-xl grow", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "group-data-[state=open]:hidden", children: "Order Total:" }),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "group-data-[state=closed]:hidden", children: "Your Order" })
-        ] })
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-1 items-center", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("h5", { className: "text-sm sm:text-xl grow truncate", children: commerce.formatCurrencyValue(cmmc.promoAppliedCartTotal) }),
-        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { style: ui.css("h-5 w-5 -mr-2 shrink-0 transition-transform duration-200 group-data-[state=open]:rotate-90") })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(primitives.AccordionContent, { className: "data-[state=open]:mb-4", children: /* @__PURE__ */ jsxRuntime.jsx(
-      commerce.CartPanel,
-      {
-        className: ui.cn("w-full", panelClx),
-        scrollAfter,
-        scrollHeightClx,
-        listClx: "mt-0",
-        itemClx: "mt-0.5 mb-0",
-        totalClx: "sticky px-1 pr-2 border-t -bottom-[1px] bg-background",
-        showShipping: true,
-        showPromoCode: true
-      }
-    ) })
-  ] }) });
-});
-var cart_accordian_default = CartAccordian;
 var MobileCheckoutPanel = ({
   step,
   stepNames,
@@ -248,14 +27,14 @@ var MobileCheckoutPanel = ({
   /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "fixed z-11 top-0 h-[45px] w-full flex justify-between items-stretch bg-background", children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-stretch gap-1 grow-0", children: [
       /* @__PURE__ */ jsxRuntime.jsx(
-        back_button_default,
+        index_cjs.BackButton,
         {
           size: "sm",
           clx: "-ml-5 !px-0 aspect-square h-full rounded-full active:!bg-level-3 ",
           onBack: onLeave
         }
       ),
-      /* @__PURE__ */ jsxRuntime.jsx(Logo, { size: "sm", variant: "wordmark", href: "/", onClick: onLeave, outerClx: "-ml-2" })
+      /* @__PURE__ */ jsxRuntime.jsx(index_cjs.Logo, { size: "sm", variant: "wordmark", href: "/", onClick: onLeave, outerClx: "-ml-2" })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsx(
       primitives.StepIndicator,
@@ -266,13 +45,13 @@ var MobileCheckoutPanel = ({
         className: "relative grow mx-2 top-[14px] text-xs font-semibold w-full"
       }
     ),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-[72px] grow-0 shrink-0 flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(widget_default, { noLogin: true, className: "" }) })
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-[72px] grow-0 shrink-0 flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(AuthWidget__default.default, { noLogin: true, className: "" }) })
   ] }),
   /* @__PURE__ */ jsxRuntime.jsx(
-    cart_accordian_default,
+    CartAccordian__default.default,
     {
       icon: /* @__PURE__ */ jsxRuntime.jsx(
-        bag_button_default,
+        BagButton__default.default,
         {
           animateOnHover: false,
           showIfEmpty: true,
@@ -289,7 +68,7 @@ var MobileCheckoutPanel = ({
     }
   ),
   children,
-  /* @__PURE__ */ jsxRuntime.jsx(policy_links_default, { clx: "mt-auto mb-3 pt-2" })
+  /* @__PURE__ */ jsxRuntime.jsx(PolicyLinks__default.default, { clx: "mt-auto mb-3 pt-2" })
 ] });
 var mobile_cp_default = MobileCheckoutPanel;
 

package/dist/site/components/commerce/checkout-panel/mobile-cp.js

@@ -1,237 +1,13 @@
 'use client';
-import { buttonVariants, Accordion, AccordionItem, AccordionTrigger, AccordionContent, StepIndicator, Button, Separator, Popover, PopoverTrigger, PopoverContent } from '@hanzo/ui/primitives';
-import { Box, cn, css } from '@hanzo/ui';
-import { useRef, useEffect, useContext } from 'react';
-import { IamContext, useIam, useIamIdentity } from '@hanzo/iam/react';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import Link2 from 'next/link';
-import { Logo as Logo$1, Wordmark } from '@luxfi/logo';
-import { observable, reaction, runInAction } from 'mobx';
-import { observer } from 'mobx-react-lite';
-import { useCommerce, formatCurrencyValue, CartPanel } from '@hanzo/commerce';
-import { useRouter } from 'next/navigation';
-import { ChevronRight, ChevronLeft } from 'lucide-react';
-import 'embla-carousel-autoplay';
+import { StepIndicator } from '@hanzo/ui/primitives';
+import { Box, cn } from '@hanzo/ui';
+import AuthWidget from '../../auth/widget.js';
+import { BackButton, Logo } from '../../index.js';
+import BagButton from '../bag-button.js';
+import PolicyLinks from './policy-links.js';
+import CartAccordian from './cart-accordian.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
 
-// src/site/components/auth/resume.ts
-var KEY = "lux-auth-resume";
-var remember = () => {
-  sessionStorage.setItem(KEY, window.location.pathname + window.location.search);
-};
-var Widget = ({
-  noLogin = false,
-  handleLogin,
-  className
-}) => {
-  const { isAuthenticated, isLoading, login, logout } = useIam();
-  const identity = useIamIdentity();
-  if (isLoading) {
-    return null;
-  }
-  if (!isAuthenticated) {
-    return noLogin ? null : /* @__PURE__ */ jsx(
-      Button,
-      {
-        variant: "primary",
-        className: cn("h-8 w-fit !min-w-0", className),
-        onClick: handleLogin ?? (() => {
-          remember();
-          void login();
-        }),
-        children: "Login"
-      }
-    );
-  }
-  return /* @__PURE__ */ jsxs(Popover, { children: [
-    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
-      Button,
-      {
-        variant: "outline",
-        size: "icon",
-        className: cn("rounded-full text-muted border-2 border-muted bg-level-1 hover:bg-level-2 hover:border-foreground hover:text-foreground uppercase w-8 h-8", className),
-        children: identity?.initials
-      }
-    ) }),
-    /* @__PURE__ */ jsx(PopoverContent, { className: "bg-level-0", children: /* @__PURE__ */ jsxs("div", { className: "grid gap-4", children: [
-      /* @__PURE__ */ jsxs("div", { className: "space-y-2 truncate", children: [
-        /* @__PURE__ */ jsx("h4", { className: "font-medium leading-none truncate", children: identity?.name }),
-        identity?.email && identity.email !== identity.name && /* @__PURE__ */ jsx("p", { className: "text-sm opacity-50 truncate", children: identity.email })
-      ] }),
-      /* @__PURE__ */ jsx(Separator, {}),
-      /* @__PURE__ */ jsx(Button, { variant: "outline", onClick: () => {
-        logout();
-      }, children: "Logout" })
-    ] }) })
-  ] });
-};
-var AuthWidget = (props) => useContext(IamContext) ? /* @__PURE__ */ jsx(Widget, { ...props }) : null;
-var widget_default = AuthWidget;
-var SIZE = {
-  xl: { mark: 40, word: 22, gap: "gap-4" },
-  lg: { mark: 40, word: 22, gap: "gap-4" },
-  md: { mark: 32, word: 18, gap: "gap-3" },
-  sm: { mark: 24, word: 13, gap: "gap-2" },
-  xs: { mark: 16, word: 9, gap: "gap-1.5" }
-};
-var Logo = ({
-  size = "md",
-  href,
-  // no default please!
-  outerClx = "",
-  variant = "full",
-  onClick
-}) => {
-  const s = SIZE[size] ?? SIZE.md;
-  const clx = "flex flex-row items-center " + s.gap + " " + (href ? "hover:opacity-80 cursor-pointer " : "cursor-default ") + outerClx;
-  const art = /* @__PURE__ */ jsxs(Fragment, { children: [
-    variant !== "wordmark" && /* @__PURE__ */ jsx(Logo$1, { variant: "white", size: s.mark }),
-    variant !== "mark" && /* @__PURE__ */ jsx(Wordmark, { height: s.word })
-  ] });
-  return href ? /* @__PURE__ */ jsx(Link2, { href, style: css(clx), onClick, children: art }) : /* @__PURE__ */ jsx(Box, { tag: "span", className: clx, onClick, children: art });
-};
-var BagIcon = (props) => /* @__PURE__ */ jsx("svg", { fill: "none", viewBox: "0 0 1019 1281", ...props, children: /* @__PURE__ */ jsx("path", { d: "m977.243 365.553h-175.407v-90.629c0-151.923-131.968-274.924-292.334-274.924-160.367 0-292.337 123.002-292.337 274.924v90.629h-175.4023c-23.3886 0-41.7627 17.051-41.7627 38.756v775.121c0 55.8 48.4456 100.76 108.582 100.76h801.84c60.138 0 108.578-44.96 108.578-100.76v-775.121c0-21.705-18.37-38.756-41.757-38.756zm-676.553-90.629c0-108.517 93.546-196.9408 208.812-196.9408 115.265 0 208.813 88.4218 208.813 196.9408v89.08h-417.625z", fill: "currentColor" }) });
-var bag_icon_default = BagIcon;
-var BagButton = observer(({
-  showIfEmpty = false,
-  animateOnHover = true,
-  animateOnQuantityChange = true,
-  size = "default",
-  className = "",
-  iconClx = "",
-  onClick
-}) => {
-  const c = useCommerce();
-  const wiggleRef = useRef(observable.box("none"));
-  useEffect(() => (
-    // return IReactionDisposer
-    animateOnQuantityChange && c ? reaction(
-      () => c.cartQuantity,
-      (curr, prev) => {
-        if (curr > prev) {
-          runInAction(() => {
-            wiggleRef.current.set("more");
-          });
-        } else {
-          runInAction(() => {
-            wiggleRef.current.set("less");
-          });
-        }
-        setTimeout(() => {
-          runInAction(() => {
-            wiggleRef.current.set("none");
-          });
-        }, 800);
-      }
-    ) : void 0
-  ), []);
-  if (!c || !showIfEmpty && c.cartEmpty) {
-    return /* @__PURE__ */ jsx("div", {});
-  }
-  return /* @__PURE__ */ jsxs(
-    Box,
-    {
-      "aria-label": "Bag",
-      role: "button",
-      onClick,
-      className: cn(
-        buttonVariants({ variant: "ghost", size }),
-        "rounded-md",
-        // Overides the bg change on hover --not a "hover effect" 
-        "relative group p-0 aspect-square hover:bg-background",
-        wiggleRef.current.get() === "more" ? "item-added-to-cart-animation" : wiggleRef.current.get() === "less" ? "item-removed-from-cart-animation" : "",
-        className
-      ),
-      children: [
-        !c.cartEmpty && /* @__PURE__ */ jsxs(Box, { className: "z-above-content flex flex-col justify-center items-center  absolute left-0 right-0 top-0 bottom-0 leading-none font-sans font-bold text-primary-fg text-xs ", children: [
-          /* @__PURE__ */ jsx("div", { className: "h-[3px] w-full" }),
-          /* @__PURE__ */ jsx("div", { children: c.cartQuantity })
-        ] }),
-        /* @__PURE__ */ jsx(bag_icon_default, { width: "24", height: "28", className: cn(
-          "relative -top-[3px] fill-primary",
-          iconClx,
-          animateOnHover ? "group-hover:fill-primary-hover group-hover:scale-105 transition-scale transition-duration-300" : ""
-        ), "aria-hidden": "true" })
-      ]
-    }
-  );
-});
-var bag_button_default = BagButton;
-var BackButton = ({
-  variant = "ghost",
-  size = "default",
-  clx = "",
-  iconClx = "",
-  onBack
-}) => {
-  const router = useRouter();
-  const back = () => {
-    if (onBack) {
-      onBack();
-    }
-    router.back();
-  };
-  return /* @__PURE__ */ jsx(
-    Button,
-    {
-      variant,
-      size,
-      onClick: back,
-      className: clx,
-      children: /* @__PURE__ */ jsx(ChevronLeft, { style: css(iconClx) })
-    }
-  );
-};
-var back_button_default = BackButton;
-var linkClx = cn(buttonVariants({ variant: "linkMuted" }), "rounded-none");
-var PolicyLinks = ({
-  clx = ""
-}) => /* @__PURE__ */ jsxs(Box, { className: cn("flex flex-col items-center", clx), children: [
-  /* @__PURE__ */ jsx(Separator, {}),
-  /* @__PURE__ */ jsxs("div", { className: "flex gap-4 py-2 text-sm", children: [
-    /* @__PURE__ */ jsx(Link2, { style: css(linkClx), href: "", children: "refund policy" }),
-    /* @__PURE__ */ jsx(Link2, { style: css(linkClx), href: "", children: "privacy policy" })
-  ] })
-] });
-var policy_links_default = PolicyLinks;
-var CartAccordian = observer(({
-  icon,
-  clx = "",
-  panelClx = "",
-  triggerClx = "",
-  scrollAfter,
-  scrollHeightClx
-}) => {
-  const cmmc = useCommerce();
-  return /* @__PURE__ */ jsx(Accordion, { type: "single", collapsible: true, className: clx, children: /* @__PURE__ */ jsxs(AccordionItem, { value: "cart", className: "w-full border-b-0", children: [
-    /* @__PURE__ */ jsxs(AccordionTrigger, { className: "!no-underline group flex justify-between ", children: [
-      /* @__PURE__ */ jsxs("div", { className: "flex gap-0 items-center", children: [
-        icon,
-        /* @__PURE__ */ jsxs("h5", { className: "text-sm sm:text-xl grow", children: [
-          /* @__PURE__ */ jsx("span", { className: "group-data-[state=open]:hidden", children: "Order Total:" }),
-          /* @__PURE__ */ jsx("span", { className: "group-data-[state=closed]:hidden", children: "Your Order" })
-        ] })
-      ] }),
-      /* @__PURE__ */ jsxs("div", { className: "flex gap-1 items-center", children: [
-        /* @__PURE__ */ jsx("h5", { className: "text-sm sm:text-xl grow truncate", children: formatCurrencyValue(cmmc.promoAppliedCartTotal) }),
-        /* @__PURE__ */ jsx(ChevronRight, { style: css("h-5 w-5 -mr-2 shrink-0 transition-transform duration-200 group-data-[state=open]:rotate-90") })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsx(AccordionContent, { className: "data-[state=open]:mb-4", children: /* @__PURE__ */ jsx(
-      CartPanel,
-      {
-        className: cn("w-full", panelClx),
-        scrollAfter,
-        scrollHeightClx,
-        listClx: "mt-0",
-        itemClx: "mt-0.5 mb-0",
-        totalClx: "sticky px-1 pr-2 border-t -bottom-[1px] bg-background",
-        showShipping: true,
-        showPromoCode: true
-      }
-    ) })
-  ] }) });
-});
-var cart_accordian_default = CartAccordian;
 var MobileCheckoutPanel = ({
   step,
   stepNames,
@@ -242,7 +18,7 @@ var MobileCheckoutPanel = ({
   /* @__PURE__ */ jsxs("div", { className: "fixed z-11 top-0 h-[45px] w-full flex justify-between items-stretch bg-background", children: [
     /* @__PURE__ */ jsxs("div", { className: "flex items-stretch gap-1 grow-0", children: [
       /* @__PURE__ */ jsx(
-        back_button_default,
+        BackButton,
         {
           size: "sm",
           clx: "-ml-5 !px-0 aspect-square h-full rounded-full active:!bg-level-3 ",
@@ -260,13 +36,13 @@ var MobileCheckoutPanel = ({
         className: "relative grow mx-2 top-[14px] text-xs font-semibold w-full"
       }
     ),
-    /* @__PURE__ */ jsx("div", { className: "w-[72px] grow-0 shrink-0 flex items-center justify-center", children: /* @__PURE__ */ jsx(widget_default, { noLogin: true, className: "" }) })
+    /* @__PURE__ */ jsx("div", { className: "w-[72px] grow-0 shrink-0 flex items-center justify-center", children: /* @__PURE__ */ jsx(AuthWidget, { noLogin: true, className: "" }) })
   ] }),
   /* @__PURE__ */ jsx(
-    cart_accordian_default,
+    CartAccordian,
     {
       icon: /* @__PURE__ */ jsx(
-        bag_button_default,
+        BagButton,
         {
           animateOnHover: false,
           showIfEmpty: true,
@@ -283,7 +59,7 @@ var MobileCheckoutPanel = ({
     }
   ),
   children,
-  /* @__PURE__ */ jsx(policy_links_default, { clx: "mt-auto mb-3 pt-2" })
+  /* @__PURE__ */ jsx(PolicyLinks, { clx: "mt-auto mb-3 pt-2" })
 ] });
 var mobile_cp_default = MobileCheckoutPanel;
 

package/dist/site/components/commerce/desktop-bag-popup.cjs

@@ -7,15 +7,14 @@ var lucideReact = require('lucide-react');
 var primitives = require('@hanzo/ui/primitives');
 var ui = require('@hanzo/ui');
 var commerce = require('@hanzo/commerce');
+var index_cjs = require('../icons/index.cjs');
+var sendGAEvent = require('../../next/analytics/google-analytics.cjs');
 var jsxRuntime = require('react/jsx-runtime');
 
-var BagIcon = (props) => /* @__PURE__ */ jsxRuntime.jsx("svg", { fill: "none", viewBox: "0 0 1019 1281", ...props, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m977.243 365.553h-175.407v-90.629c0-151.923-131.968-274.924-292.334-274.924-160.367 0-292.337 123.002-292.337 274.924v90.629h-175.4023c-23.3886 0-41.7627 17.051-41.7627 38.756v775.121c0 55.8 48.4456 100.76 108.582 100.76h801.84c60.138 0 108.578-44.96 108.578-100.76v-775.121c0-21.705-18.37-38.756-41.757-38.756zm-676.553-90.629c0-108.517 93.546-196.9408 208.812-196.9408 115.265 0 208.813 88.4218 208.813 196.9408v89.08h-417.625z", fill: "currentColor" }) });
-var bag_icon_default = BagIcon;
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var sendGAEvent__default = /*#__PURE__*/_interopDefault(sendGAEvent);
 
-// src/site/next/analytics/google-analytics.ts
-var sendGAEvent = (name, options = {}) => {
-  window.gtag("event", name, options);
-};
 var DesktopBagPopup = ({
   triggerClx = "",
   popupClx = "",
@@ -26,7 +25,7 @@ var DesktopBagPopup = ({
   const router = navigation.useRouter();
   react.useEffect(() => {
     if (bagOpen) {
-      sendGAEvent("view_cart", {
+      sendGAEvent__default.default("view_cart", {
         items: cmmc.cartItems.map((item) => ({
           item_id: item.sku,
           item_name: item.title,
@@ -58,7 +57,7 @@ var DesktopBagPopup = ({
           buttonClx: "max-w-[220px] flex-none",
           children: [
             /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-row items-center flex-none justify-center ", children: [
-              /* @__PURE__ */ jsxRuntime.jsx(bag_icon_default, { className: "mr-2 relative w-6 h-7 fill-foreground " }),
+              /* @__PURE__ */ jsxRuntime.jsx(index_cjs.Bag, { className: "mr-2 relative w-6 h-7 fill-foreground " }),
               /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-heading text-foreground text-default", children: "Your Bag" })
             ] }),
             /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-[1px] w-pr-80 bg-muted-3 mx-auto mt-1.5 flex-none" })

package/dist/site/components/commerce/desktop-bag-popup.js

@@ -5,15 +5,10 @@ import { X } from 'lucide-react';
 import { Popover, PopoverTrigger, PopoverContent, PopoverClose } from '@hanzo/ui/primitives';
 import { cn } from '@hanzo/ui';
 import { useCommerce, CartPanel } from '@hanzo/commerce';
+import { Bag } from '../icons/index.js';
+import sendGAEvent from '../../next/analytics/google-analytics.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
-var BagIcon = (props) => /* @__PURE__ */ jsx("svg", { fill: "none", viewBox: "0 0 1019 1281", ...props, children: /* @__PURE__ */ jsx("path", { d: "m977.243 365.553h-175.407v-90.629c0-151.923-131.968-274.924-292.334-274.924-160.367 0-292.337 123.002-292.337 274.924v90.629h-175.4023c-23.3886 0-41.7627 17.051-41.7627 38.756v775.121c0 55.8 48.4456 100.76 108.582 100.76h801.84c60.138 0 108.578-44.96 108.578-100.76v-775.121c0-21.705-18.37-38.756-41.757-38.756zm-676.553-90.629c0-108.517 93.546-196.9408 208.812-196.9408 115.265 0 208.813 88.4218 208.813 196.9408v89.08h-417.625z", fill: "currentColor" }) });
-var bag_icon_default = BagIcon;
-
-// src/site/next/analytics/google-analytics.ts
-var sendGAEvent = (name, options = {}) => {
-  window.gtag("event", name, options);
-};
 var DesktopBagPopup = ({
   triggerClx = "",
   popupClx = "",
@@ -56,7 +51,7 @@ var DesktopBagPopup = ({
           buttonClx: "max-w-[220px] flex-none",
           children: [
             /* @__PURE__ */ jsxs("div", { className: "flex flex-row items-center flex-none justify-center ", children: [
-              /* @__PURE__ */ jsx(bag_icon_default, { className: "mr-2 relative w-6 h-7 fill-foreground " }),
+              /* @__PURE__ */ jsx(Bag, { className: "mr-2 relative w-6 h-7 fill-foreground " }),
               /* @__PURE__ */ jsx("p", { className: "font-heading text-foreground text-default", children: "Your Bag" })
             ] }),
             /* @__PURE__ */ jsx("div", { className: "h-[1px] w-pr-80 bg-muted-3 mx-auto mt-1.5 flex-none" })