@luxfi/ui 8.0.0 → 8.2.0

package/dist/site/components/index.js

@@ -0,0 +1,1952 @@
+import * as React7 from 'react';
+import React7__default, { useRef, useEffect, createContext, useContext, useState, useLayoutEffect, useTransition } from 'react';
+import { buttonVariants, NavigationMenuLink, Drawer, DrawerContent, DrawerHandle, Button, ScrollArea, StepIndicator, Accordion, AccordionItem, AccordionTrigger, AccordionContent, Separator, ApplyTypography, Popover, PopoverTrigger, PopoverContent, InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator, Card, Dialog, DialogTrigger, DialogContent, DialogHeader, DialogTitle, DialogDescription, NavItems, Carousel, CarouselContent, CarouselItem, Input, NavigationMenu, NavigationMenuList, NavigationMenuItem, navigationMenuTriggerStyle, NavigationMenuTrigger, NavigationMenuContent, PopoverClose } from '@hanzo/ui/primitives';
+import { Box, cn, MediaStack, css, capitalize, ApplyTypography as ApplyTypography$1, Form, FormField, FormItem, FormControl, FormMessage } from '@hanzo/ui';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { Logo as Logo$1, Wordmark, LuxLogo } from '@luxfi/logo';
+import { useForm } from 'react-hook-form';
+import { z } from 'zod';
+import { zodResolver } from '@hookform/resolvers/zod';
+import validator from 'validator';
+import { ChevronRight, ChevronLeft, Loader2, X, Plus, ChevronDown, ArrowRight } from 'lucide-react';
+import Link2 from 'next/link';
+import { IamContext, useIam, useIamIdentity, Login as Login$1, IamProvider } from '@hanzo/iam/react';
+import { useRouter, usePathname } from 'next/navigation';
+import { useCommerce, CarouselBuyCard, CarouselItemSelector, CartPanel, formatCurrencyValue, PaymentStepForm, ShippingStepForm } from '@hanzo/commerce';
+import { SocialIcon as SocialIcon$1 } from 'react-social-icons';
+import { observable, reaction, runInAction } from 'mobx';
+import { observer, enableStaticRendering } from 'mobx-react-lite';
+import { BRAND_SERVER_URLS } from '@hanzo/iam/paths';
+import 'usehooks-ts';
+import { GoogleAnalytics } from '@next/third-parties/google';
+import Script from 'next/script';
+import { Tooltip as Tooltip$1 } from 'react-tooltip';
+export { default as EmblaAutoplay } from 'embla-carousel-autoplay';
+
+var __defProp = Object.defineProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var AccessCodeInput = ({
+  onSuccess,
+  onFail,
+  validCodes,
+  className
+}) => {
+  const [status, setStatus] = useState();
+  const checkAccessCode = (code) => {
+    setStatus(void 0);
+    if (code.length === 6) {
+      setStatus("checking");
+      setTimeout(() => {
+        if (validCodes?.includes(code) && onSuccess) {
+          setStatus("valid");
+          onSuccess();
+        } else {
+          setStatus("invalid");
+          onFail && onFail();
+        }
+      }, 1e3);
+    }
+  };
+  return /* @__PURE__ */ jsxs(Box, { className: cn("flex flex-col gap-2 mx-auto w-full text-center items-center", className), children: [
+    /* @__PURE__ */ jsx(
+      InputOTP,
+      {
+        className: "mx-auto",
+        maxLength: 6,
+        onInput: (event) => checkAccessCode(event.target.value),
+        render: ({ slots }) => /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsxs(InputOTPGroup, { children: [
+            slots.slice(0, 3).map((slot, index) => /* @__PURE__ */ jsx(InputOTPSlot, { ...slot }, index)),
+            " "
+          ] }),
+          /* @__PURE__ */ jsx(InputOTPSeparator, {}),
+          /* @__PURE__ */ jsx(InputOTPGroup, { children: slots.slice(3).map((slot, index) => /* @__PURE__ */ jsx(InputOTPSlot, { ...slot }, index + 3)) })
+        ] })
+      }
+    ),
+    /* @__PURE__ */ jsx("p", { className: "h-[3rem]", children: status === "checking" ? "Checking access code..." : status === "invalid" ? /* @__PURE__ */ jsx("span", { className: "text-destructive", children: "Invalid access code!" }) : status === "valid" ? /* @__PURE__ */ jsx("span", { children: "Access code is valid! Redirecting..." }) : null })
+  ] });
+};
+var access_code_input_default = AccessCodeInput;
+var ChatWidget = ({
+  title: title2,
+  chatbotUrl,
+  subtitle,
+  question,
+  suggestedQuestions,
+  buttonClx = ""
+}) => {
+  const [showChatbot, setShowChatbot] = React7__default.useState(false);
+  const onClick = () => {
+    setShowChatbot(!showChatbot);
+  };
+  const searchParams = new URLSearchParams();
+  if (question) {
+    searchParams.append("question", question);
+  }
+  if (suggestedQuestions) {
+    searchParams.append("sQuestions", suggestedQuestions.map(({ message }) => message).join(","));
+    searchParams.append("sHeadings", suggestedQuestions.map(({ heading }) => heading).join(","));
+    searchParams.append("sIcons", suggestedQuestions.map(({ icon }) => icon).join(","));
+  }
+  const iframeSrc = `${chatbotUrl}?${searchParams.toString()}`;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Box, { className: "fixed bottom-0 sm:bottom-16 right-0 w-full h-full sm:max-w-[400px] sm:max-h-[550px] sm:px-4 z-floating " + (showChatbot ? "flex" : "hidden"), children: /* @__PURE__ */ jsxs(Card, { className: "flex flex-col h-full w-full", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex px-4 py-2 h-12 bg-level-0 items-center justify-between", children: [
+        /* @__PURE__ */ jsxs("h1", { className: "font-semibold font-heading", children: [
+          title2,
+          " ",
+          /* @__PURE__ */ jsx("span", { className: "opacity-60", children: subtitle })
+        ] }),
+        /* @__PURE__ */ jsx(Button, { onClick, variant: "link", size: "icon", className: "w-fit sm:hidden", children: /* @__PURE__ */ jsx(LuxLogo, { variant: "white", size: 24 }) })
+      ] }),
+      /* @__PURE__ */ jsx("iframe", { src: iframeSrc, className: "h-full" })
+    ] }) }),
+    /* @__PURE__ */ jsx(
+      Box,
+      {
+        tag: "span",
+        onClick,
+        className: cn(
+          // z-index should be below anything in commerce-iu (buy drawer and checkout widget)
+          "fixed bottom-5 right-[24px] md:z-floating z-16 cursor-pointer",
+          "hover:drop-shadow-[0_2px_6px_rgba(255,255,255,1)]",
+          "transition-transform",
+          showChatbot ? "rotate-180" : "",
+          buttonClx
+        ),
+        children: /* @__PURE__ */ jsx(LuxLogo, { variant: "white", size: 28 })
+      }
+    )
+  ] });
+};
+var chat_widget_default = ChatWidget;
+var ContactFormSchema = z.object({
+  email: z.string().min(1, { message: "Email must be provided." }).email("Invalid email."),
+  phone: z.string().min(1, { message: "Telephone must be provided." }).refine(validator.isMobilePhone, { message: "Invalid format." })
+});
+var ContactForm = ({
+  onSubmit: _onSubmit,
+  enclosure
+}) => {
+  const form = useForm({
+    resolver: zodResolver(ContactFormSchema),
+    defaultValues: {
+      email: "",
+      phone: ""
+    }
+  });
+  const [isPending, startTransition] = useTransition();
+  const onSubmit = (data) => {
+    startTransition(async () => {
+      await _onSubmit(data, enclosure);
+    });
+  };
+  const MyFormItem = ({
+    field,
+    placeholder
+  }) => /* @__PURE__ */ jsxs(FormItem, { className: "space-y-0", children: [
+    /* @__PURE__ */ jsx(FormControl, { children: /* @__PURE__ */ jsx(Input, { placeholder, ...field, className: "mt-0 text-foreground" }) }),
+    /* @__PURE__ */ jsx(Box, { className: "flex flex-row justify-start items-stretch gap-2", children: /* @__PURE__ */ jsx(FormMessage, {}) })
+  ] });
+  return /* @__PURE__ */ jsx(Form, { ...form, children: /* @__PURE__ */ jsx(Box, { tag: "form", onSubmit: form.handleSubmit(onSubmit), className: "w-3/4", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col justify-start items-stretch mt-4", children: [
+    /* @__PURE__ */ jsx(
+      FormField,
+      {
+        control: form.control,
+        name: "email",
+        render: ({ field }) => /* @__PURE__ */ jsx(MyFormItem, { field, placeholder: "email" })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      FormField,
+      {
+        control: form.control,
+        name: "phone",
+        render: ({ field }) => /* @__PURE__ */ jsx(MyFormItem, { field, placeholder: "phone" })
+      }
+    ),
+    /* @__PURE__ */ jsx(Button, { disabled: isPending, type: "submit", className: "bg-primary text-primary-fg hover:bg-primary-hover", children: isPending ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(Loader2, { style: css("mr-2 h-4 w-4 animate-spin") }),
+      "Please wait"
+    ] }) : /* @__PURE__ */ jsx(Fragment, { children: "Submit" }) })
+  ] }) }) });
+};
+var contact_form_default = ContactForm;
+var Disclaimer = () => /* @__PURE__ */ jsxs("div", { children: [
+  "By entering your mobile number and submitting, you consent to receive text messages from Lux at the number provided. Message and data rates may apply. Message frequency varies. You can unsubscribe at any time by replying STOP. View our ",
+  /* @__PURE__ */ jsx("a", { href: "/privacy", children: "Privacy Policy" }),
+  " and ",
+  /* @__PURE__ */ jsx("a", { href: "/terms", children: "Terms & conditions" }),
+  "."
+] });
+var disclaimer_default = Disclaimer;
+var ContactDialog = ({
+  open: open2,
+  onOpenChange,
+  buttonText,
+  buttonProps,
+  title: title2,
+  byline,
+  action,
+  actionEnclosure
+}) => {
+  const [success, setSuccess] = useState(false);
+  const onSubmit = async (formData, enclosure) => {
+    const result = await action(formData, enclosure);
+    if (result.success) {
+      setSuccess(true);
+    }
+  };
+  return /* @__PURE__ */ jsxs(Dialog, { open: open2, onOpenChange, children: [
+    /* @__PURE__ */ jsx(DialogTrigger, { asChild: true, children: /* @__PURE__ */ jsx(Button, { ...buttonProps, children: buttonText }) }),
+    /* @__PURE__ */ jsxs(DialogContent, { className: "sm:max-w-[500px] p-0 gap-0 bg-background border", children: [
+      /* @__PURE__ */ jsxs(DialogHeader, { className: "py-6 text-foreground", children: [
+        /* @__PURE__ */ jsx(DialogTitle, { className: "text-4xl text-center text-inherit", children: title2 }),
+        byline && /* @__PURE__ */ jsxs(DialogDescription, { className: "text-inherit text-lg text-center", children: [
+          byline,
+          " "
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "px-8 pb-8 rounded-e-lg flex flex-col justify-start items-center", children: [
+        success ? /* @__PURE__ */ jsx("p", { children: actionEnclosure?.reply }) : /* @__PURE__ */ jsx(contact_form_default, { onSubmit, enclosure: actionEnclosure }),
+        /* @__PURE__ */ jsx("div", { className: "text-muted-1 text-xs mt-4", children: /* @__PURE__ */ jsx(disclaimer_default, {}) })
+      ] })
+    ] })
+  ] });
+};
+var contact_dialog_default = ContactDialog;
+var FIRST = 2020;
+var Copyright = ({
+  className = ""
+}) => {
+  const year = (/* @__PURE__ */ new Date()).getFullYear();
+  const yearString = year > FIRST ? `${FIRST} - ${year}` : FIRST.toString();
+  return /* @__PURE__ */ jsxs(Box, { className, children: [
+    `Copyright \xA9 ${yearString}`,
+    "\xA0",
+    /* @__PURE__ */ jsx("br", { className: "sm:hidden" }),
+    "Lux Industries Inc.\xA0",
+    /* @__PURE__ */ jsx("br", { className: "md:hidden" }),
+    "\xA0All rights reserved."
+  ] });
+};
+var copyright_default = Copyright;
+
+// src/site/site-def/footer/legal.ts
+var legal = [
+  {
+    title: "Terms and Conditions",
+    href: "https://docs.google.com/document/d/1mvkjr1w8Rv8ttirs1mu-_2fw_PXclOyS/preview",
+    newTab: true
+  },
+  {
+    title: "Privacy Policy",
+    href: "https://docs.google.com/document/d/1vZjOKaNdOoThDIaVLERWxflQLtOsuvLn/preview",
+    newTab: true
+  }
+];
+var title = {
+  title: "Legal",
+  href: "",
+  variant: "linkFG"
+};
+[title, ...legal];
+var FooterNav = ({
+  items,
+  currentAs,
+  className = ""
+}) => /* @__PURE__ */ jsx(
+  NavItems,
+  {
+    items,
+    currentAs,
+    as: "nav",
+    className,
+    itemClx: (def) => def.variant === "linkFG" ? "font-nav text-[15px]/[1.3] font-medium tracking-normal text-muted-1 sm:hover:text-foreground transition-color duration-500" : "text-[15px]/[1.1] font-normal tracking-[0.2px] text-muted-1 sm:hover:text-foreground transition-color duration-500"
+  }
+);
+var footer_nav_default = FooterNav;
+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 Footer = ({
+  siteDef,
+  className = "",
+  noHorizPadding = false
+}) => {
+  const { footer, aboveCopyright } = siteDef;
+  const smGridCols = Math.floor(footer.length / 2);
+  const smGridColsClx = `sm:grid-cols-${smGridCols} `;
+  const _aboveCopyright = typeof aboveCopyright === "undefined" ? legal : aboveCopyright;
+  return /* @__PURE__ */ jsxs(Box, { tag: "footer", className: cn("grow flex flex-col justify-between gap-6 pb-[2vh]", className), children: [
+    /* @__PURE__ */ jsxs(Box, { className: (noHorizPadding ? "" : "px-5 md:px-8 ") + "grid grid-cols-2 gap-4 gap-y-6 md:gap-x-6 lg:gap-8 " + smGridColsClx + "md:w-full sm:justify-items-center md:mx-0 lg:w-full md:flex md:flex-row md:justify-between px-[24px]", children: [
+      /* @__PURE__ */ jsx("div", { className: "hidden lg:flex flex-col", children: /* @__PURE__ */ jsx(Logo, { size: "md", variant: "wordmark" }) }, 0),
+      footer.map((defs, index) => {
+        const xsColSpanClx = index === footer.length - 1 && footer.length % 2 === 1 ? "xs:col-span-2 xs:mx-auto md:col-span-1 md:mx-0 " : "";
+        return /* @__PURE__ */ jsx(
+          footer_nav_default,
+          {
+            items: defs,
+            currentAs: siteDef.currentAs,
+            className: cn(
+              "sm:min-w-[150px] md:min-w-0 flex flex-col justify-start items-start gap-[11px] sm:gap-[12px] md:gap-[15px] ",
+              xsColSpanClx
+            )
+          },
+          index + 1
+        );
+      })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "md:mt-[2vh]", children: [
+      _aboveCopyright.length > 0 && /* @__PURE__ */ jsx(
+        NavItems,
+        {
+          items: _aboveCopyright,
+          as: "div",
+          className: "flex flex-row justify-center gap-4 mb-2",
+          itemClx: "text-sm text-center text-muted-2 underline hover:text-foreground"
+        }
+      ),
+      /* @__PURE__ */ jsx(copyright_default, { className: "text-sm text-center text-muted-3" })
+    ] })
+  ] });
+};
+var footer_default = Footer;
+
+// 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;
+
+// src/site/components/icons/index.ts
+var icons_exports = {};
+__export(icons_exports, {
+  Avatar: () => avatar_default,
+  Bag: () => bag_icon_default,
+  LeftArrow: () => left_arrow_default,
+  RightArrow: () => right_arrow_default,
+  SocialIcon: () => SocialIcon
+});
+var Avatar = (props) => /* @__PURE__ */ jsxs("svg", { width: "17", height: "21", viewBox: "0 0 17 21", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
+  /* @__PURE__ */ jsx("path", { d: "M8.66112 10.3544C6.14668 10.3544 4.32664 6.91073 4.32664 4.59206C4.32664 2.12213 6.27238 0.115723 8.66112 0.115723C11.0499 0.115723 12.9956 2.12514 12.9956 4.59206C12.9956 6.91398 11.1756 10.3544 8.66112 10.3544ZM8.66112 1.1542C6.82539 1.1542 5.33242 2.69703 5.33242 4.59185C5.33242 6.65402 6.94715 9.31553 8.66112 9.31553C10.3761 9.31553 11.9898 6.65387 11.9898 4.5925C11.9898 2.69668 10.4969 1.15398 8.66112 1.15398V1.1542Z", fill: "white" }),
+  /* @__PURE__ */ jsx("path", { d: "M6.79776 11.3345H10.5242C13.7802 11.3345 16.4302 14.0712 16.4302 17.4338C16.4302 19.0831 15.1297 20.423 13.5356 20.423H3.78923C2.19216 20.423 0.894689 19.0831 0.894689 17.4338C0.893706 14.0712 3.54156 11.3345 6.79776 11.3345ZM3.78819 19.3844H13.5337C14.5749 19.3844 15.4225 18.509 15.4225 17.4338C15.4225 14.6453 13.2253 12.3731 10.5223 12.3731H6.79862C4.0956 12.3731 1.89839 14.6423 1.89839 17.4338C1.89937 18.509 2.74701 19.3844 3.78816 19.3844H3.78819Z", fill: "white" })
+] });
+var avatar_default = Avatar;
+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 LeftArrow = (props) => /* @__PURE__ */ jsx("svg", { width: "10", height: "16", viewBox: "0 0 10 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsx("path", { d: "M1.06975 7.44328C0.679224 7.83381 0.679224 8.46697 1.06975 8.8575L7.43371 15.2215C7.82423 15.612 8.4574 15.612 8.84792 15.2215C9.23845 14.8309 9.23845 14.1978 8.84792 13.8072L3.19107 8.15039L8.84792 2.49354C9.23845 2.10301 9.23845 1.46985 8.84792 1.07932C8.4574 0.688798 7.82423 0.688798 7.43371 1.07932L1.06975 7.44328ZM1.77686 9.15039H2.49037V7.15039H1.77686V9.15039Z", fill: "white" }) });
+var left_arrow_default = LeftArrow;
+var RightArrow = (props) => /* @__PURE__ */ jsx("svg", { width: "9", height: "16", viewBox: "0 0 9 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props, children: /* @__PURE__ */ jsx("path", { d: "M8.33797 7.58293C8.72849 7.97346 8.72849 8.60662 8.33797 8.99715L1.97401 15.3611C1.58348 15.7516 0.950316 15.7516 0.559792 15.3611C0.169267 14.9706 0.169267 14.3374 0.559792 13.9469L6.21665 8.29004L0.559792 2.63318C0.169267 2.24266 0.169267 1.6095 0.559792 1.21897C0.950316 0.828447 1.58348 0.828447 1.97401 1.21897L8.33797 7.58293ZM7.63086 9.29004H6.91734V7.29004H7.63086V9.29004Z", fill: "white" }) });
+var right_arrow_default = RightArrow;
+var SocialIcon = ({
+  network,
+  size,
+  className = ""
+}) => /* @__PURE__ */ jsx(
+  SocialIcon$1,
+  {
+    network,
+    as: "div",
+    className: cn("color-inherit", className),
+    bgColor: "transparent",
+    fgColor: "currentColor",
+    style: { height: size, width: size, flex: "none" }
+  }
+);
+
+// src/site/next/analytics/google-analytics.ts
+var sendGAEvent = (name, options = {}) => {
+  window.gtag("event", name, options);
+};
+var DesktopBagPopup = ({
+  triggerClx = "",
+  popupClx = "",
+  trigger
+}) => {
+  const cmmc = useCommerce();
+  const [bagOpen, setBagOpen] = useState(false);
+  const router = useRouter();
+  useEffect(() => {
+    if (bagOpen) {
+      sendGAEvent("view_cart", {
+        items: cmmc.cartItems.map((item) => ({
+          item_id: item.sku,
+          item_name: item.title,
+          item_category: item.familyId,
+          price: item.price,
+          quantity: item.quantity
+        })),
+        value: cmmc.cartTotal,
+        currency: "USD"
+      });
+    }
+  }, [bagOpen]);
+  return /* @__PURE__ */ jsxs(Popover, { open: bagOpen, onOpenChange: setBagOpen, children: [
+    /* @__PURE__ */ jsx(PopoverTrigger, { className: triggerClx, children: trigger }),
+    /* @__PURE__ */ jsxs(PopoverContent, { sideOffset: 28, className: cn("relative  flex flex-col p-0 px-4 pb-4 pt-2", popupClx), children: [
+      /* @__PURE__ */ jsx(PopoverClose, { className: "absolute z-above-content right-2 top-2 self-end hover:bg-level-3 text-muted hover:text-accent p-1 rounded-full", children: /* @__PURE__ */ jsx(X, { className: "w-5 h-5" }) }),
+      /* @__PURE__ */ jsxs(
+        CartPanel,
+        {
+          handleCheckout: () => {
+            router.push("/checkout");
+          },
+          className: "mt-4 mb-4 border-none py-0 px-4",
+          listClx: "rounded-sm pr-3",
+          scrollAfter: 5,
+          scrollHeightClx: "h-[70vh]",
+          itemClx: "mt-3",
+          totalClx: "sticky px-1 pr-2 -bottom-[1px] bg-level-1",
+          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("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" })
+          ]
+        }
+      )
+    ] })
+  ] });
+};
+var desktop_bag_popup_default = DesktopBagPopup;
+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 DesktopNav = ({ links, isMenuOpened, setIsMenuOpen }) => {
+  React7.useEffect(() => {
+    const preventScroll = (e) => {
+      e.preventDefault();
+    };
+    if (isMenuOpened) {
+      window.addEventListener("wheel", preventScroll, { passive: false });
+      window.addEventListener("touchmove", preventScroll, { passive: false });
+      window.addEventListener("keydown", preventScrollKeys, { passive: false });
+    } else {
+      window.removeEventListener("wheel", preventScroll);
+      window.removeEventListener("touchmove", preventScroll);
+      window.removeEventListener("keydown", preventScrollKeys);
+    }
+    return () => {
+      window.removeEventListener("wheel", preventScroll);
+      window.removeEventListener("touchmove", preventScroll);
+      window.removeEventListener("keydown", preventScrollKeys);
+    };
+  }, [isMenuOpened]);
+  const preventScrollKeys = (e) => {
+    if (["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight", " "].includes(e.key)) {
+      e.preventDefault();
+    }
+  };
+  const handleMouseEnter = React7.useCallback(() => {
+    setIsMenuOpen(true);
+  }, [setIsMenuOpen]);
+  const handleMouseLeave = React7.useCallback(() => {
+    setIsMenuOpen(false);
+  }, [setIsMenuOpen]);
+  const handleContentMouseMove = () => {
+    setIsMenuOpen(false);
+  };
+  const menuHiddenClass = !isMenuOpened ? "invisible" : "";
+  return links.length > 0 ? /* @__PURE__ */ jsx(NavigationMenu, { children: /* @__PURE__ */ jsx(NavigationMenuList, { children: links.map((el, index) => /* @__PURE__ */ jsx(NavigationMenuItem, { className: "!m-0", children: el.isAIMenu ? /* @__PURE__ */ jsx(Link2, { href: el.href, style: css(cn(navigationMenuTriggerStyle(), " text-muted-1 bg-transparent")), children: el.title }) : el.title === "Cards" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      NavigationMenuTrigger,
+      {
+        className: "text-muted-1 bg-transparent",
+        onMouseEnter: handleMouseEnter,
+        onFocus: handleMouseEnter,
+        onMouseLeave: handleMouseLeave,
+        onBlur: handleMouseLeave,
+        children: /* @__PURE__ */ jsx(Link2, { href: el.href, children: el.title })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      NavigationMenuContent,
+      {
+        className: cn("fixed left-0 top-14 pt-6 w-screen h-full border-0 !backdrop-blur-3xl bg-transparent mt-0", menuHiddenClass),
+        onMouseEnter: handleMouseEnter,
+        onMouseLeave: handleMouseLeave,
+        children: /* @__PURE__ */ jsx("div", { className: "flex justify-center items-start", children: /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: "grid xl:grid-cols-3 w-full justify-center max-w-[750px]",
+            onMouseLeave: handleContentMouseMove,
+            children: GroupChildMenu({ childs: el.childMenu, isCards: true })
+          }
+        ) })
+      }
+    )
+  ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      NavigationMenuTrigger,
+      {
+        className: "text-muted-1 bg-transparent",
+        onMouseEnter: handleMouseEnter,
+        onFocus: handleMouseEnter,
+        onMouseLeave: handleMouseLeave,
+        onBlur: handleMouseLeave,
+        children: el.href && el.href !== "" ? /* @__PURE__ */ jsx(Link2, { href: el.href, children: el.title }) : /* @__PURE__ */ jsx(Fragment, { children: el.title })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      NavigationMenuContent,
+      {
+        className: cn("fixed left-0 top-14 pt-6 w-screen h-full border-0 !backdrop-blur-3xl bg-transparent mt-0", menuHiddenClass),
+        onMouseEnter: handleMouseEnter,
+        onMouseLeave: handleMouseLeave,
+        children: /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: "flex flex-row w-full justify-center",
+            onMouseLeave: handleContentMouseMove,
+            children: GroupChildMenu({ childs: el.childMenu })
+          }
+        )
+      }
+    )
+  ] }) }, index)) }) }) : null;
+};
+var desktop_nav_menu_default = DesktopNav;
+var ListItem = React7.forwardRef(({ className, title: title2, children, ...props }, ref) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(NavigationMenuLink, { asChild: true, children: /* @__PURE__ */ jsxs(
+  Box,
+  {
+    tag: "a",
+    ref,
+    className: cn(
+      "block select-none space-y-1 rounded-md p-3 leading-none no-underline outline-none transition-colors hover:text-accent-foreground focus:bg-level-1 focus:text-accent-foreground text-muted-1 hover:text-primary hover:bg-transparent duration-1000 ease-in-out",
+      className
+    ),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx("div", { className: "text-sm font-medium leading-none", children: title2 }),
+      /* @__PURE__ */ jsx("p", { className: "line-clamp-3 text-sm leading-snug text-muted-1", children })
+    ]
+  }
+) }) }, title2));
+ListItem.displayName = "ListItem";
+var GroupChildMenu = (params) => {
+  const { childs, isCards = false } = params;
+  if (!childs) {
+    return null;
+  }
+  const groupedChildMenus = childs.reduce((grouped, childLink) => {
+    if (childLink.groupName) {
+      grouped[childLink.groupName] = grouped[childLink.groupName] || [];
+      grouped[childLink.groupName].push(childLink);
+    }
+    return grouped;
+  }, {});
+  const getChildExtraClass = (index) => {
+    if (isCards && (index === 3 || index === 4)) {
+      return "xl:-mt-32";
+    }
+    return "";
+  };
+  return Object.entries(groupedChildMenus).map(([groupName, childLinks], index) => /* @__PURE__ */ jsxs(Box, { className: cn("py-4 px-4 ", getChildExtraClass(index)), children: [
+    /* @__PURE__ */ jsx("h2", { className: "text-muted-1", children: groupName }),
+    /* @__PURE__ */ jsx("ul", { className: "w-[200px] gap-3 md:w-[250px] lg:w-[250px]", children: childLinks.map((link) => /* @__PURE__ */ jsxs("div", { className: "flex justify-start items-center", children: [
+      link.icon,
+      /* @__PURE__ */ jsx(ListItem, { title: link.title, href: link.href, className: "ml-[14px]", children: link.contents }, link.title)
+    ] }, link.title)) })
+  ] }, groupName));
+};
+var DesktopHeader = ({
+  links,
+  className = "",
+  noAuth = false,
+  noCommerce = false,
+  children,
+  logoVariant = "full"
+}) => {
+  const [isMenuOpened, setIsMenuOpen] = React7__default.useState(false);
+  return /* @__PURE__ */ jsx(Box, { tag: "header", id: "DESKTOP_HEADER", className: cn(
+    "bg-[rgba(0, 0, 0, 0.5)] !backdrop-blur-3xl fixed z-header top-0 left-0 right-0",
+    className,
+    isMenuOpened ? " h-full" : ""
+  ), children: /* @__PURE__ */ jsxs(Box, { className: "flex flex-row h-[80px] items-center justify-between mx-[24px] w-full max-w-screen", children: [
+    /* @__PURE__ */ jsx(Logo, { size: logoVariant === "mark" ? "lg" : "md", href: "/", outerClx: "hidden lg:flex", variant: logoVariant }, "two"),
+    /* @__PURE__ */ jsx(Logo, { size: "sm", href: "/", outerClx: "hidden md:flex lg:hidden", variant: logoVariant }, "one"),
+    /* @__PURE__ */ jsx("div", { className: "flex w-full gap-4 items-center justify-center", children: /* @__PURE__ */ jsx(desktop_nav_menu_default, { links, isMenuOpened, setIsMenuOpen }) }),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
+      !noCommerce && /* @__PURE__ */ jsx(desktop_bag_popup_default, { popupClx: "w-[340px]", trigger: /* @__PURE__ */ jsx(bag_button_default, { className: "text-primary -mr-[3px] lg:min-w-0" }) }),
+      !noAuth && /* @__PURE__ */ jsx(widget_default, {}),
+      children
+    ] })
+  ] }) });
+};
+var desktop_default = DesktopHeader;
+var Login = ({
+  className,
+  onSuccess
+}) => {
+  const { config } = useIam();
+  const [state] = useState(() => crypto.randomUUID());
+  useEffect(remember, []);
+  return /* @__PURE__ */ jsx(
+    Login$1,
+    {
+      serverUrl: config.serverUrl,
+      clientId: config.clientId,
+      redirectUri: config.redirectUri,
+      organization: config.organization,
+      state,
+      className: cn("hanzo-iam-card", className),
+      onSuccess
+    }
+  );
+};
+var login_default = Login;
+var MobileMenuToggleButton = ({
+  open: open2,
+  setOpen,
+  className = ""
+}) => {
+  return /* @__PURE__ */ jsx(
+    Button,
+    {
+      variant: "ghost",
+      size: "default",
+      className: cn("rounded-full", cn("p-0 aspect-square hover:bg-background sm:hover:bg-level-1 active:scale-75", className)),
+      onClick: () => {
+        setOpen(!open2);
+      },
+      children: /* @__PURE__ */ jsx(Plus, { width: 28, height: 28, style: css(
+        "block h-full will-change-transform transition-transform transition-scale transition-duration-[1500] " + (open2 ? "rotate-[135deg] scale-110" : "rotate-none")
+      ) })
+    }
+  );
+};
+var mobile_menu_toggle_button_default = MobileMenuToggleButton;
+var MobileBagDrawer = ({
+  open: open2,
+  setOpen,
+  handleCheckout,
+  className = ""
+}) => {
+  return /* @__PURE__ */ jsx(Drawer, { open: open2, onOpenChange: setOpen, children: /* @__PURE__ */ jsx(DrawerContent, { className: cn("rounded-t-xl mt-6 pb-12 h-auto", className), children: /* @__PURE__ */ jsxs(
+    CartPanel,
+    {
+      handleCheckout,
+      className: "mt-4 mb-4 border-none py-0 px-4 w-full ",
+      listClx: "rounded-sm pr-3",
+      scrollAfter: 5,
+      itemClx: "mt-2",
+      totalClx: "sticky px-1 pr-2 border rounded-sm -bottom-[1px] bg-background",
+      buttonClx: "max-w-[220px] flex-none",
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-row items-center flex-none justify-center ", children: [
+          /* @__PURE__ */ jsx(
+            bag_button_default,
+            {
+              animateOnHover: false,
+              showIfEmpty: true,
+              className: "mr-2 relative w-6 h-7",
+              iconClx: "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" })
+      ]
+    }
+  ) }) });
+};
+var mobile_bag_drawer_default = MobileBagDrawer;
+var MobileNavMenuAI = ({ setMenuOpen }) => {
+  const [isOpen, setIsOpen] = useState(false);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(Box, { className: "w-full  text-2xl cursor-pointer", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex justify-between", children: [
+        /* @__PURE__ */ jsx(Logo, { variant: "wordmark", size: "md", outerClx: "p-6 h-full" }),
+        /* @__PURE__ */ jsx(Box, { tag: "span", className: cn("grid", "block h-full aspect-square hover:bg-background sm:hover:bg-level-1 active:scale-75 text-foreground will-change-transform transition-transform transition-scale transition-duration-[1500] mt-6 mr-6 " + (!open ? "rotate-none" : "rotate-[135deg] scale-110")), children: /* @__PURE__ */ jsx(Plus, { width: 28, height: 28, style: css("w-full h-full"), onClick: () => setMenuOpen(false) }) })
+      ] }),
+      /* @__PURE__ */ jsx(Box, { className: "flex items-center gap-5 border-b border-[#3A3A3A] mt-4 rounded-full bg-muted-4 mx-6", children: /* @__PURE__ */ jsxs(Box, { className: "text-muted-1 font-bold flex-1 flex justify-between min-h-12 items-center px-2", onClick: () => setIsOpen(true), children: [
+        /* @__PURE__ */ jsx("span", { className: "text-base pl-2 font-light", children: "Ask AI a question" }),
+        /* @__PURE__ */ jsx(ArrowRight, {})
+      ] }) })
+    ] }),
+    /* @__PURE__ */ jsx(Box, { className: "fixed bottom-0 sm:bottom-16 right-0 w-full h-full sm:max-w-[400px] sm:max-h-[550px] sm:px-4 z-floating " + (isOpen ? "flex" : "hidden"), children: /* @__PURE__ */ jsxs(Card, { className: "flex flex-col h-full w-full", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex px-4 py-2 h-16 bg-level-0 items-center justify-between", children: [
+        /* @__PURE__ */ jsxs("h3", { className: "font-semibold font-heading", children: [
+          "LUX",
+          /* @__PURE__ */ jsx("span", { className: "opacity-60", children: "AI" })
+        ] }),
+        /* @__PURE__ */ jsx(Button, { onClick: () => setIsOpen(false), variant: "link", size: "icon", className: "w-fit sm:hidden", children: /* @__PURE__ */ jsx(Plus, { className: "w-6 h-6 flex-none mr-1 rotate-45 transition-transform" }) })
+      ] }),
+      /* @__PURE__ */ jsx("iframe", { src: "https://lux.chat/iframe", className: "h-full" })
+    ] }) })
+  ] });
+};
+var mobile_nav_menu_ai_default = MobileNavMenuAI;
+var MobileNav = ({
+  currentAs,
+  links,
+  setMenuState,
+  className = "",
+  commonItemClx,
+  setChatbotOpen,
+  setMenuOpen
+}) => links.length > 0 ? /* @__PURE__ */ jsxs(Box, { className: cn("flex flex-col h-full", className), children: [
+  /* @__PURE__ */ jsx(mobile_nav_menu_ai_default, { setMenuOpen }),
+  /* @__PURE__ */ jsx(Box, { className: "flex flex-col flex-1 overflow-auto", children: /* @__PURE__ */ jsx(Accordion, { type: "single", collapsible: true, className: "w-full h-full", children: links.map((el, index) => {
+    const itemClx = commonItemClx ? typeof commonItemClx === "string" ? commonItemClx : commonItemClx(el) : "";
+    const variant = el.variant ?? "link";
+    let internalClx = variant === "link" ? " text-muted hover:text-foreground active:text-accent rounded-none" : " min-w-0";
+    if (currentAs && currentAs === el.href) {
+      internalClx += " pointer-events-none";
+      if (variant === "link") {
+        internalClx += " text-accent";
+      }
+    }
+    if (!el.isAIMenu) {
+      return /* @__PURE__ */ jsxs(AccordionItem, { value: el.title ? el.title : "", className: "!no-underline !border-0 px-6", children: [
+        /* @__PURE__ */ jsxs(AccordionTrigger, { className: cn(internalClx, itemClx, ""), children: [
+          /* @__PURE__ */ jsx(Box, { className: cn(internalClx, itemClx, "flex items-center justify-between w-full pl-3 text-base font-normal leading-6"), children: el.title }),
+          /* @__PURE__ */ jsx(ChevronDown, { style: css("w-4 h-4 mr-3") })
+        ] }),
+        /* @__PURE__ */ jsx(AccordionContent, { children: el.childMenu && /* @__PURE__ */ jsx(Box, { className: "px-4", children: Object.entries(el.childMenu.reduce((acc, child) => {
+          const group = acc[child.groupName ? child.groupName : ""] || [];
+          group.push(child);
+          acc[child.groupName ? child.groupName : ""] = group;
+          return acc;
+        }, {})).map(([groupName, children]) => /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx(Box, { className: "mt-4 mb-4 font-light text-muted-1", children: groupName }),
+          children.map((child, childIndex) => /* @__PURE__ */ jsx(Box, { className: "m-2", children: /* @__PURE__ */ jsxs(Box, { className: "flex items-center py-1", children: [
+            /* @__PURE__ */ jsx("span", { children: child.icon && child.icon }),
+            /* @__PURE__ */ jsx(
+              Link2,
+              {
+                href: child.href,
+                target: child.newTab ? "_blank" : "_self",
+                rel: "noopener noreferrer",
+                children: /* @__PURE__ */ jsx(Box, { tag: "span", className: "text-muted-2 hover:underline ml-5 hover:text-primary", children: child.title })
+              }
+            )
+          ] }) }, childIndex))
+        ] }, groupName)) }) })
+      ] }, index);
+    }
+  }) }) }),
+  /* @__PURE__ */ jsx(widget_default, { className: "text-2xl z-10", handleLogin: () => {
+    setMenuState("login");
+  } })
+] }) : null;
+var mobile_nav_menu_default = MobileNav;
+var bagClx = "mt-4 mb-8 border-none py-0 px-4 w-full sm:min-w-[350px] sm:max-w-[500px] sm:mx-auto min-h-[60vh] max-h-[70vh] sm:animate-in sm:zoom-in-90 ";
+var MobileHeader = ({
+  currentAs,
+  links,
+  className = "",
+  setChatbotOpen,
+  noAuth = false,
+  // :aa TODO
+  noCommerce = false
+  // :aa TODO
+}) => {
+  const cmmc = useCommerce();
+  const [menuState, setMenuState] = useState("closed");
+  const [bagDrawerOpen, setBagDrawerOpen] = useState(false);
+  const router = useRouter();
+  useEffect(() => {
+    if (menuState === "bag" || bagDrawerOpen) {
+      sendGAEvent("view_cart", {
+        items: cmmc.cartItems.map((item) => ({
+          item_id: item.sku,
+          item_name: item.title,
+          item_category: item.familyId,
+          price: item.price,
+          quantity: item.quantity
+        })),
+        value: cmmc.cartTotal,
+        currency: "USD"
+      });
+    }
+  }, [menuState, bagDrawerOpen]);
+  const menuOpen = () => menuState !== "closed";
+  const onLoginChanged = (token) => {
+    if (!!token) {
+      setMenuState("nav");
+    }
+  };
+  const setMenuOpen = (open2) => {
+    if (!open2) {
+      setMenuState("closed");
+    } else {
+      setMenuState("nav");
+    }
+  };
+  const handleCheckout = () => {
+    setMenuState("closed");
+    setBagDrawerOpen(false);
+    router.push("/checkout");
+  };
+  const openBag = () => {
+    if (menuOpen()) {
+      setMenuState("bag");
+    } else {
+      setBagDrawerOpen(true);
+    }
+  };
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Box, { tag: "header", id: "MOBILE_HEADER", className: cn(
+      `bg-background fixed z-header top-0 left-0 w-full ${menuOpen() ? "hidden" : "block"}`,
+      className
+    ), children: /* @__PURE__ */ jsxs("div", { className: "w-full h-full flex flex-row justify-between items-center font-bold pr-5", children: [
+      /* @__PURE__ */ jsx(Logo, { href: "/", size: "md", outerClx: "p-6 h-full", variant: "wordmark" }),
+      menuOpen() && /* @__PURE__ */ jsx(Box, { className: "absolute left-0 top-0 bottom-0 right-0 pl-8 flex flex-row bg-background animate-mobile-menu-open", children: /* @__PURE__ */ jsx(avatar_default, { className: "self-center " }) }),
+      /* @__PURE__ */ jsxs("div", { className: "flex gap-0 flex-row", children: [
+        /* @__PURE__ */ jsx(bag_button_default, { className: "text-primary -mr-[3px]", onClick: openBag }),
+        /* @__PURE__ */ jsx(mobile_menu_toggle_button_default, { className: "text-foreground", open: menuOpen(), setOpen: setMenuOpen })
+      ] })
+    ] }) }),
+    !noCommerce && /* @__PURE__ */ jsx(
+      mobile_bag_drawer_default,
+      {
+        className: "",
+        open: bagDrawerOpen,
+        setOpen: setBagDrawerOpen,
+        handleCheckout
+      }
+    ),
+    menuOpen() && /* @__PURE__ */ jsx(Box, { className: "fixed top-0 left-0 w-full h-full flex flex-column bg-background z-below-header animate-mobile-menu-open", children: !!!noAuth && menuState === "login" ? /* @__PURE__ */ jsx(login_default, { onSuccess: onLoginChanged, className: "sm:animate-in sm:zoom-in-90 m-auto w-full max-w-sm px-8" }) : !!!noCommerce && menuState === "bag" ? /* @__PURE__ */ jsxs(
+      CartPanel,
+      {
+        handleCheckout: () => {
+          router.push("/checkout");
+        },
+        className: bagClx,
+        listClx: "rounded-sm",
+        scrollAfter: 6,
+        scrollHeightClx: "h-[80vh]",
+        itemClx: "mt-2",
+        totalClx: "sticky px-1 pr-2 border rounded-sm -bottom-[1px] bg-level-1",
+        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-4 h-5 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" })
+        ]
+      }
+    ) : (
+      /* menuState === 'nav' */
+      /* @__PURE__ */ jsx(
+        mobile_nav_menu_default,
+        {
+          currentAs,
+          links,
+          className: "sm:animate-in sm:zoom-in-90 w-full",
+          commonItemClx: "px-0 text-xl h-16 justify-start ",
+          setMenuState,
+          setChatbotOpen,
+          setMenuOpen
+        }
+      )
+    ) })
+  ] });
+};
+var mobile_default = MobileHeader;
+var Header = ({
+  siteDef,
+  className = "",
+  children,
+  logoVariant = "full"
+}) => {
+  const [open2, setOpen] = React7__default.useState(false);
+  const { nav: { common, featured }, currentAs, noAuth, commerce } = siteDef;
+  const links = featured ? [...common, ...featured] : common;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      desktop_default,
+      {
+        className: cn(className, "hidden md:flex"),
+        links,
+        currentAs,
+        noAuth,
+        noCommerce: !!!commerce,
+        logoVariant,
+        children
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      mobile_default,
+      {
+        className: cn(className, "md:hidden"),
+        links,
+        currentAs,
+        setChatbotOpen: setOpen,
+        noAuth,
+        noCommerce: !!!commerce
+      }
+    )
+  ] });
+};
+var header_default = Header;
+var Main = ({
+  children,
+  className = "",
+  headerSpace = true,
+  standardWidth = true,
+  id
+}) => /* @__PURE__ */ jsx(Box, { tag: "main", id: id ?? "LUX_UI_MAIN", className: cn(
+  "flex flex-col justify-start items-center",
+  "px-4 md:px-6 lg:px-8",
+  standardWidth ? "max-w-screen-2xl w-full lg:mx-auto" : "",
+  headerSpace ? "pt-[44px] md:pt-[80px]" : "py-4",
+  className
+), children });
+var main_default = Main;
+var MiniChart = ({
+  widgetProps,
+  containerStyles = {}
+}) => {
+  const {
+    symbol,
+    exchange,
+    lineColor,
+    topGradientColor,
+    bottomGradientColor,
+    width,
+    height,
+    autosize,
+    locale,
+    ...rest
+  } = widgetProps;
+  const symbolString = exchange ? `${exchange}:${symbol}` : symbol;
+  const containerRef = useRef(null);
+  useEffect(() => {
+    if (!containerRef.current) {
+      return;
+    }
+    const script = document.createElement("script");
+    script.type = "text/javascript";
+    script.src = "https://s3.tradingview.com/external-embedding/embed-widget-mini-symbol-overview.js";
+    script.async = true;
+    script.onload = async () => {
+      const iframe = containerRef.current?.querySelector("iframe");
+      if (iframe && iframe instanceof Element) {
+        iframe.style.colorScheme = "normal";
+        setTimeout(() => {
+          document.querySelector("#mini-symbol-overview-ticker");
+        }, 1200);
+      }
+      const copyDiv = document.querySelector(".tradingview-widget-copyright");
+      if (copyDiv) {
+        setTimeout(() => {
+          copyDiv.classList.remove("invisible");
+        }, 1200);
+      }
+    };
+    const config = JSON.stringify({
+      symbol: symbolString,
+      width: autosize ? "100%" : width || 350,
+      height: autosize ? "100%" : height || 220,
+      locale: locale ?? "en",
+      isTransparent: "true",
+      trendLineColor: lineColor || "rgba(41, 98, 255, 1)",
+      underLineColor: topGradientColor || "rgba(41, 98, 255, 0.3)",
+      underLineBottomColor: bottomGradientColor || "rgba(41, 98, 255, 0)",
+      ...rest
+    });
+    script.innerHTML = config;
+    containerRef.current.appendChild(script);
+    return () => {
+      while (containerRef.current?.firstChild) {
+        containerRef.current.removeChild(containerRef.current.firstChild);
+      }
+    };
+  }, [JSON.stringify(widgetProps)]);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("div", { style: containerStyles, className: "tradingview-widget-container h-[150px]", ref: containerRef }),
+    /* @__PURE__ */ jsxs("div", { className: "tradingview-widget-copyright border-t w-full invisible", children: [
+      /* @__PURE__ */ jsx("a", { href: `https://www.tradingview.com/symbols/${symbol}${exchange ? `/?exchange=${exchange}` : ""}`, rel: "noopener", target: "_blank", children: /* @__PURE__ */ jsxs(Box, { tag: "span", className: "text-[--hz-ui-primary]", children: [
+        symbol,
+        " quotes"
+      ] }) }),
+      "\xA0by TradingView"
+    ] })
+  ] });
+};
+var mini_chart_default = MiniChart;
+var Wrapper = ({
+  symbol,
+  exchange
+}) => /* @__PURE__ */ jsx(mini_chart_default, { widgetProps: {
+  symbol,
+  exchange,
+  autosize: true,
+  colorTheme: "dark",
+  lineColor: "rgb(114, 27, 228)",
+  bottomGradientColor: "rgba(255, 255, 255, 0.1)",
+  dateRange: "60M"
+} });
+var wrapper_default = Wrapper;
+var NotFound = ({
+  header = false,
+  siteDef
+}) => /* @__PURE__ */ jsxs(Fragment, { children: [
+  header && /* @__PURE__ */ jsx(header_default, { siteDef }),
+  /* @__PURE__ */ jsx(main_default, { className: "h-[100svh] sm:h-[700px] px-8 sm:px-10", headerSpace: header, children: /* @__PURE__ */ jsxs(ApplyTypography$1, { className: "mt-[200px] flex flex-col md:gap-8", children: [
+    /* @__PURE__ */ jsx("h3", { children: "...Huh?" }),
+    /* @__PURE__ */ jsx("h4", { children: "Sorry, we're fresh out of those." }),
+    /* @__PURE__ */ jsxs("h4", { children: [
+      "...try something from the ",
+      /* @__PURE__ */ jsx("a", { href: "/", children: "Home Page" }),
+      "?"
+    ] })
+  ] }) }),
+  /* @__PURE__ */ jsx(footer_default, { siteDef })
+] });
+var not_found_default = NotFound;
+var ORG = "lux";
+var CALLBACK = "/auth/callback";
+var configure = (app) => ({
+  serverUrl: BRAND_SERVER_URLS[ORG],
+  organization: ORG,
+  clientId: `${ORG}-${app}`,
+  /* Read per render rather than at module load: one bundle serves the real
+    host and any preview of it, and each must redeem its code back to itself. */
+  redirectUri: (typeof window === "undefined" ? "" : window.location.origin) + CALLBACK
+});
+var Auth = ({ app, children }) => /* @__PURE__ */ jsx(IamProvider, { config: configure(app), children });
+var provider_default = Auth;
+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;
+enableStaticRendering(typeof window === "undefined");
+var CommerceUIContext = createContext(void 0);
+var useCommerceDrawer = () => {
+  return useContext(CommerceUIContext);
+};
+var useSelectAndBuy = () => {
+  return useContext(CommerceUIContext);
+};
+var CommerceDrawer = observer(({
+  children,
+  handleHandleClicked,
+  drawerClx = "",
+  ...rest
+}) => {
+  const drawer = useCommerceDrawer();
+  return /* @__PURE__ */ jsx(
+    Drawer,
+    {
+      open: drawer.open,
+      onOpenChange: () => {
+      },
+      modal: drawer.modal,
+      snapPoints: drawer.points,
+      activeSnapPoint: drawer.activePoint,
+      setActiveSnapPoint: drawer.onActivePointChanged.bind(drawer),
+      fastDragSkipsToEnd: false,
+      dragHandleOnly: true,
+      handleHandleClicked,
+      extendHandleDragRegion: false,
+      ...rest,
+      children: /* @__PURE__ */ jsxs(
+        DrawerContent,
+        {
+          defaultHandle: false,
+          className: cn(
+            "border-0",
+            drawer.isMobile ? "pt-5" : "pt-6",
+            "w-full h-full"
+          ),
+          onOpenAutoFocus: (e) => {
+            e.preventDefault();
+          },
+          children: [
+            /* @__PURE__ */ jsx(
+              DrawerHandle,
+              {
+                className: cn(
+                  "absolute top-0 left-0 right-0 mx-auto z-10",
+                  "flex justify-center items-start",
+                  "border-t rounded-t-lg border-muted-3",
+                  drawer.isMobile ? "h-5 touch-pan-y" : "h-6"
+                ),
+                children: /* @__PURE__ */ jsx(Box, { className: cn(
+                  // pseudo-handle
+                  "rounded-[3px] bg-level-3",
+                  drawer.isMobile ? "w-[155px] mt-[5px] h-1.5" : "w-[180px] mt-[3px] h-2.5 hover:bg-level-4",
+                  !drawer.isMobile ? "cursor-grab active:cursor-grabbing" : ""
+                ) })
+              }
+            ),
+            children
+          ]
+        }
+      )
+    }
+  );
+});
+var shell_default = CommerceDrawer;
+var IconAndQuantity = observer(({
+  animateOnQuantityChange = false,
+  showArrow = true,
+  showQuantity = true,
+  clx = "",
+  iconClx = "",
+  digitClx = ""
+}) => {
+  const cmmc = useCommerce();
+  const wiggleRef = useRef(observable.box("none"));
+  useEffect(() => (
+    // return IReactionDisposer
+    animateOnQuantityChange ? reaction(
+      () => cmmc.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
+  ), []);
+  return /* @__PURE__ */ jsxs(Box, { className: cn("flex items-center justify-center", clx), children: [
+    showQuantity && /* @__PURE__ */ jsxs(Box, { className: cn(
+      "relative flex items-center justify-center mr-1",
+      wiggleRef.current.get() === "more" ? "item-added-to-cart-animation" : wiggleRef.current.get() === "less" ? "item-removed-from-cart-animation" : ""
+    ), children: [
+      cmmc.cartQuantity > 0 && /* @__PURE__ */ jsx(Box, { className: cn(
+        "z-above-content flex flex-col justify-center items-center",
+        "absolute left-0 right-0 top-0 bottom-0",
+        digitClx
+      ), children: /* @__PURE__ */ jsx("div", { style: {
+        /* color: 'white'  tailwind bug? ,*/
+        fontSize: "11px",
+        position: "relative",
+        top: "1px"
+      }, children: cmmc.cartQuantity }) }),
+      /* @__PURE__ */ jsx(bag_icon_default, { width: "19", height: "24", className: cn("relative -top-[3px] opacity-70", iconClx), "aria-hidden": "true" })
+    ] }),
+    showArrow && /* @__PURE__ */ jsx("span", { style: { fontSize: "17px" }, children: "\u203A" })
+  ] });
+});
+var CheckoutButton = ({
+  handleCheckout,
+  variant = "primary",
+  rounded = "lg",
+  className,
+  showQuantity = true,
+  showArrow = true,
+  animateOnQuantityChange = true,
+  centerText = true,
+  children,
+  ...rest
+}) => {
+  return /* @__PURE__ */ jsxs(
+    Button,
+    {
+      ...rest,
+      onClick: handleCheckout,
+      variant,
+      className: cn(`rounded-${rounded}`, cn(
+        "flex justify-between items-stretch group",
+        showQuantity ? centerText ? "px-1.5" : "pl-2.5 pr-1.5" : "",
+        className
+      )),
+      children: [
+        centerText && // must scale this one too, as it effects layout
+        /* @__PURE__ */ jsx(
+          IconAndQuantity,
+          {
+            showArrow,
+            showQuantity,
+            clx: "invisible group-hover:scale-105 transition-scale transition-duration-300"
+          }
+        ),
+        children ?? /* @__PURE__ */ jsx("div", { className: "flex justify-center items-center", children: "Checkout" }),
+        /* @__PURE__ */ jsx(
+          IconAndQuantity,
+          {
+            clx: "group-hover:scale-105 transition-scale transition-duration-300",
+            animateOnQuantityChange,
+            showArrow,
+            showQuantity,
+            iconClx: "fill-background",
+            digitClx: "text-foreground group-hover:opacity-80 leading-none font-bold font-sans"
+          }
+        )
+      ]
+    }
+  );
+};
+var checkout_button_default = CheckoutButton;
+var CN = {
+  // h: mind padding!
+  mobile: { w: 36, h: 32 },
+  sm: { w: 60, h: 34 },
+  desktop: { w: 60, h: 32 }
+};
+var Info = ({
+  item,
+  clx = ""
+}) => {
+  const cmmc = useCommerce();
+  const family = cmmc.getFamilyById(item.familyId);
+  let topLine = family.title;
+  if (item.sku.startsWith("LXM-AG") || item.sku.startsWith("LXM-AU")) {
+    topLine = family.parentTitle + ", " + family.title;
+  }
+  const optionLabel = item.optionLabelShort ?? item.optionLabel;
+  const priceStr = formatCurrencyValue(item.price);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(Box, { className: cn("sm:hidden flex flex-col !text-muted items-stretch whitespace-nowrap text-ellipsis ", clx), children: [
+      /* @__PURE__ */ jsx("p", { className: "text-left text-xs", children: topLine }),
+      /* @__PURE__ */ jsxs("div", { className: "flex justify-between text-xxs", children: [
+        /* @__PURE__ */ jsx("div", { children: optionLabel }),
+        /* @__PURE__ */ jsx("div", { className: "pl-2.5", children: priceStr })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs(Box, { className: cn("hidden sm:flex !text-muted  flex-col items-stretch whitespace-nowrap text-ellipsis text-xs", clx), children: [
+      /* @__PURE__ */ jsx("p", { className: "text-left", children: topLine }),
+      /* @__PURE__ */ jsxs("div", { className: "flex justify-between", children: [
+        /* @__PURE__ */ jsx("div", { children: optionLabel }),
+        /* @__PURE__ */ jsx("div", { className: "pl-2.5", children: priceStr })
+      ] })
+    ] })
+  ] });
+};
+var PROMPT_COMMON_CLX = "block absolute top-0 left-0 bg-transparent duration-400 transition-opacity";
+var Micro = observer(({
+  clx = "",
+  handleCheckout,
+  handleItemClicked
+}) => {
+  const drawer = useCommerceDrawer();
+  const cmmc = useCommerce();
+  return /* @__PURE__ */ jsxs(Box, { className: cn(
+    drawer.showRecent ? "grid grid-cols-2" : "flex justify-center items-center ",
+    drawer.showRecent ? drawer.isMobile ? "-mt-3" : "-mt-3" : "",
+    "gap-2 md:gap-3 relative",
+    clx
+  ), children: [
+    drawer.showRecent && /* @__PURE__ */ jsxs(Box, { className: "flex flex-col items-stretch " + (drawer.isMobile ? "justify-start" : "group"), children: [
+      /* @__PURE__ */ jsxs(Box, { tag: "p", className: "relative text-muted text-xxs md:text-xs leading-none pl-1 self-start " + (drawer.isMobile ? "top-[3px]" : "top-[1px]"), children: [
+        /* @__PURE__ */ jsx("span", { className: "invisible", children: "scrictly for layout" }),
+        drawer.isMobile ? /* @__PURE__ */ jsx(Box, { tag: "span", className: PROMPT_COMMON_CLX, children: "tap for options:" }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(Box, { tag: "span", className: PROMPT_COMMON_CLX + " group-hover:opacity-0", children: "recent item:" }),
+          /* @__PURE__ */ jsx(Box, { tag: "span", className: PROMPT_COMMON_CLX + " opacity-0 group-hover:opacity-100", children: "view options:" })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs(
+        Button,
+        {
+          variant: "ghost",
+          className: cn(`rounded-${drawer.isMobile ? "md" : "lg"}`, cn(
+            "box-content",
+            "flex flex-row justify-between items-center gap-1",
+            "-ml-1.5",
+            "overflow-hidden ",
+            "px-1 md:px-2 py-[2px]",
+            "border border-transparent group-hover:border-muted-3",
+            "group-hover:!bg-transparent",
+            "!min-w-0"
+          )),
+          size: drawer.isMobile ? "sm" : "default",
+          onClick: handleItemClicked,
+          children: [
+            cmmc.recentItem?.item.img && /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(MediaStack, { media: { img: cmmc.recentItem.item.img }, constrainTo: CN.mobile, className: "sm:hidden grow-0 shrink-0" }),
+              /* @__PURE__ */ jsx(MediaStack, { media: { img: cmmc.recentItem.item.img }, constrainTo: CN.sm, className: "hidden sm:block md:hidden grow-0 shrink-0" }),
+              /* @__PURE__ */ jsx(MediaStack, { media: { img: cmmc.recentItem.item.img }, constrainTo: CN.desktop, className: "hidden md:block grow-0 shrink-0" })
+            ] }),
+            cmmc.recentItem && /* @__PURE__ */ jsx("div", { className: "grow w-full", children: /* @__PURE__ */ jsx(Info, { item: cmmc.recentItem.item, clx: "w-full" }) })
+          ]
+        }
+      )
+    ] }),
+    drawer.showCheckout && /* @__PURE__ */ jsxs(Box, { className: cn(
+      "flex flex-col w-full",
+      drawer.showRecent ? "items-stretch" : "items-center",
+      drawer.isMobile ? "justify-start" : "justify-center"
+    ), children: [
+      drawer.showRecent && /* @__PURE__ */ jsx("p", { className: "invisible text-muted text-xxs md:text-xs leading-none pl-1 self-start", children: "for layout" }),
+      /* @__PURE__ */ jsx(
+        checkout_button_default,
+        {
+          handleCheckout,
+          variant: "primary",
+          size: drawer.isMobile ? "sm" : "lg",
+          className: cn(`rounded-${drawer.isMobile ? "md" : "lg"}`, cn(
+            drawer.isMobile ? drawer.showRecent ? "pl-3.5 pr-2.5" : "min-w-[320px]" : drawer.showRecent ? "" : "w-[320px]",
+            "text-sm font-semibold"
+          )),
+          centerText: drawer.isMobile ? !drawer.showRecent : true
+        }
+      )
+    ] })
+  ] });
+});
+var micro_default = Micro;
+var CommerceUIComponent = observer(() => {
+  const buy = useSelectAndBuy();
+  const drawer = useCommerceDrawer();
+  const router = useRouter();
+  const handleCheckout = () => {
+    router.push("/checkout");
+  };
+  const handleHandleClicked = () => {
+    if (drawer.state === "full") {
+      buy.hideVariants();
+    } else if (drawer.state === "micro") {
+      buy.showRecentVariants();
+    }
+  };
+  const handleItemClicked = () => {
+    buy.showRecentVariants();
+  };
+  const handleCloseGesture = () => {
+    if (drawer.state === "full") {
+      buy.hideVariants();
+      return true;
+    }
+    return false;
+  };
+  return /* @__PURE__ */ jsxs(
+    shell_default,
+    {
+      handleHandleClicked,
+      handleCloseGesture,
+      drawerClx: "flex flex-col",
+      children: [
+        drawer.state === "full" && /* The actual drawer is larger than the visible area (due to awkward
+        vaul impl.  So we have to ask the drawer for its currect snappoint 
+        and constrain layout to that.  
+        */
+        /* @__PURE__ */ jsx("div", { style: {
+          height: drawer.snapPointPx - 24
+          /* fudge factor for handle area */
+        }, children: /* @__PURE__ */ jsx(
+          CarouselBuyCard,
+          {
+            skuPath: buy.currentSkuPath,
+            checkoutButton: /* @__PURE__ */ jsx(
+              checkout_button_default,
+              {
+                handleCheckout,
+                className: "w-full min-w-[160px] sm:max-w-[320px]"
+              }
+            ),
+            clx: "justify-between h-full pb-3 gap-8",
+            addBtnClx: "w-full min-w-[160px] sm:max-w-[320px]",
+            buttonsAreaClx: "grow-0 shrink-0 mt-0",
+            selectorClx: "max-w-[475px] justify-between grow"
+          }
+        ) }),
+        drawer.state === "micro" && /* @__PURE__ */ jsx(
+          micro_default,
+          {
+            handleCheckout,
+            handleItemClicked,
+            clx: "w-full px-2 sm:w-[460px] sm:mx-auto md:w-[550px]"
+          }
+        )
+      ]
+    }
+  );
+});
+var drawer_default = CommerceUIComponent;
+var DrawerMargin = observer(({
+  clx = ""
+}) => {
+  const drawer = useCommerceDrawer();
+  if (!drawer) {
+    throw new Error("DrawerMargin must be used with a CommerceUIContext!");
+  }
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      className: cn("transition-height", clx),
+      style: {
+        height: drawer.state === "micro" ? drawer.microHeight : 0
+      }
+    }
+  );
+});
+var drawer_margin_default = DrawerMargin;
+var BuyButton = ({
+  skuPath,
+  children,
+  className = "",
+  ...rest
+}) => {
+  const buyOptions = useSelectAndBuy();
+  const handleClick = () => {
+    buyOptions.showVariants(skuPath);
+  };
+  return /* @__PURE__ */ jsx(Button, { onClick: handleClick, ...rest, className: cn(className, ""), children });
+};
+var buy_button_default = BuyButton;
+var ThankYou = ({}) => /* @__PURE__ */ jsxs(ApplyTypography, { className: "flex flex-col gap-4 text-center mt-10", children: [
+  /* @__PURE__ */ jsx("h3", { children: "Thank you for your order!" }),
+  /* @__PURE__ */ jsx("h6", { children: "Once your payment has been confirmed, you'll recieve an email with additional information." }),
+  /* @__PURE__ */ jsxs("p", { children: [
+    "While you wait, we cordially invite you to join the ",
+    /* @__PURE__ */ jsx(Link2, { href: "https://warpcast.com/~/channel/lux", children: "Lux Channel" }),
+    " on ",
+    /* @__PURE__ */ jsx(Link2, { href: "https://warpcast.com/~/invite-page/227706?id=fbc9ca91", children: "Warpcast" }),
+    "."
+  ] })
+] });
+var thank_you_default = ThankYou;
+var DesktopBagCarousel = observer(({
+  constrainTo,
+  className = ""
+}) => {
+  const cmmc = useCommerce();
+  return /* @__PURE__ */ jsx(
+    CarouselItemSelector,
+    {
+      items: cmmc.cartItems,
+      selectedItemRef: cmmc,
+      scrollable: false,
+      selectSku: cmmc.setCurrentItem.bind(cmmc),
+      clx: className,
+      ext: {
+        options: { loop: true },
+        constrainTo,
+        imageOnly: true
+      }
+    }
+  );
+});
+var desktop_bag_carousel_default = DesktopBagCarousel;
+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 DesktopCheckoutPanel = observer(({
+  step,
+  stepNames,
+  onLeave,
+  clx = "",
+  children
+}) => {
+  const cmmc = useCommerce();
+  return /* @__PURE__ */ jsxs(Box, { className: cn("grid grid-cols-2", clx), children: [
+    /* @__PURE__ */ jsx("div", { className: "w-full h-full bg-background flex flex-row items-start justify-end", children: /* @__PURE__ */ jsxs("div", { className: "w-full h-full max-w-[750px] relative flex flex-col items-stretch justify-start px-8 pb-8", children: [
+      /* @__PURE__ */ jsxs("div", { className: "h-[80px] grow-0 flex flex-row items-center z-10", children: [
+        /* @__PURE__ */ jsx(Logo, { size: "md", href: "/", onClick: onLeave, variant: "wordmark", outerClx: "logo-outer-tooltip-class" }),
+        /* @__PURE__ */ jsx(tooltip_default, { select: ".logo-outer-tooltip-class", text: "home", position: "right", offset: 6 })
+      ] }, 1),
+      /* @__PURE__ */ jsx(
+        back_button_default,
+        {
+          size: "sm",
+          clx: "z-10 absolute top-14 left-6 !px-0 aspect-square rounded-full hover:!bg-level-3 back-button-tooltip-class ",
+          onBack: onLeave
+        }
+      ),
+      /* @__PURE__ */ jsx(tooltip_default, { select: ".back-button-tooltip-class", text: "back", position: "right", offset: 5 }),
+      /* @__PURE__ */ jsxs(Box, { className: cn(
+        "w-full grow min-h-0 max-w-[550px] mx-auto flex flex-col gap-3",
+        cmmc.cartItems.length > 4 ? "justify-between" : "justify-start gap-10 pt-10"
+      ), children: [
+        /* @__PURE__ */ jsx(desktop_bag_carousel_default, { className: "grow-0 h-[260px] w-[360px] lg:w-[420px] mx-auto -mt-8", constrainTo: { w: 250, h: 250 } }),
+        /* @__PURE__ */ jsx(
+          CartPanel,
+          {
+            className: "w-full border-none p-0",
+            itemClx: "mb-2",
+            totalClx: "sticky bottom-0 bg-background",
+            listClx: "pr-3",
+            scrollAfter: 4,
+            scrollHeightClx: "min-h-[50vh] grow",
+            showPromoCode: true,
+            showShipping: true,
+            selectItems: true
+          }
+        )
+      ] }, 2)
+    ] }) }, 1),
+    /* @__PURE__ */ jsxs("div", { className: "w-full h-full flex flex-col bg-level-1 min-h-screen justify-between", children: [
+      /* @__PURE__ */ jsx(ScrollArea, { className: "w-full flex flex-row items-start justify-start overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "h-full w-full max-w-[750px] relative flex flex-col items-center px-8 pt-0", children: [
+        /* @__PURE__ */ jsxs("div", { className: "bg-level-1 sticky h-[80px] bg-[#aaaaff] w-full top-0 flex justify-center items-end", children: [
+          /* @__PURE__ */ jsx(widget_default, { noLogin: true, className: "hidden md:flex absolute top-4 right-4 " }),
+          /* @__PURE__ */ jsx(StepIndicator, { dotSizeRem: 1.35, steps: stepNames, currentStep: step, className: "gap-2 text-base w-pr-70" })
+        ] }, 1),
+        /* @__PURE__ */ jsx("div", { className: "w-full max-w-[550px] mx-auto py-8", children }, 2)
+      ] }) }),
+      /* @__PURE__ */ jsx("div", { className: "w-full max-w-[750px] relative flex flex-col items-center px-8 pt-0", children: /* @__PURE__ */ jsx("div", { className: "w-full max-w-[550px] mx-auto flex flex-col items-center", children: /* @__PURE__ */ jsx(policy_links_default, { clx: "w-full" }) }) })
+    ] }, 2)
+  ] });
+});
+var desktop_cp_default = DesktopCheckoutPanel;
+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,
+  onLeave,
+  clx = "",
+  children
+}) => /* @__PURE__ */ jsxs(Box, { className: cn("bg-background flex flex-col justify-start px-4 pt-[101px]", clx), children: [
+  /* @__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,
+        {
+          size: "sm",
+          clx: "-ml-5 !px-0 aspect-square h-full rounded-full active:!bg-level-3 ",
+          onBack: onLeave
+        }
+      ),
+      /* @__PURE__ */ jsx(Logo, { size: "sm", variant: "wordmark", href: "/", onClick: onLeave, outerClx: "-ml-2" })
+    ] }),
+    /* @__PURE__ */ jsx(
+      StepIndicator,
+      {
+        dotSizeRem: 1,
+        steps: stepNames,
+        currentStep: step,
+        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(
+    cart_accordian_default,
+    {
+      icon: /* @__PURE__ */ jsx(
+        bag_button_default,
+        {
+          animateOnHover: false,
+          showIfEmpty: true,
+          size: "sm",
+          className: "mr-1 relative w-5 h-6 sm:w-6 sm:h-7",
+          iconClx: "fill-foreground"
+        }
+      ),
+      clx: "flex items-center justify-center w-full",
+      triggerClx: "bg-background fixed z-11 top-[45px] left-0 right-0 !m-0 px-4",
+      panelClx: "!py-0",
+      scrollAfter: 3,
+      scrollHeightClx: "h-[385px]"
+    }
+  ),
+  children,
+  /* @__PURE__ */ jsx(policy_links_default, { clx: "mt-auto mb-3 pt-2" })
+] });
+var mobile_cp_default = MobileCheckoutPanel;
+var STEPS = [
+  {
+    name: "payment",
+    Comp: PaymentStepForm
+  },
+  {
+    name: "delivery",
+    Comp: ShippingStepForm
+  },
+  {
+    name: "done",
+    label: "Done!",
+    Comp: thank_you_default
+  }
+];
+var STEP_NAMES = STEPS.map((s) => s.label ? s.label : capitalize(s.name));
+var CheckoutPanel = ({
+  clx = ""
+}) => {
+  const cmmc = useCommerce();
+  if (!cmmc) {
+    console.log("CHECKOUT PANEL: cmmc svc undefined!");
+    return /* @__PURE__ */ jsx(Fragment, {});
+  }
+  const [stepIndex, setStepIndex] = useState(0);
+  const [orderId, setOrderId] = useState(void 0);
+  const setStep = (name) => {
+    if (name === "first") {
+      setStepIndex(0);
+    } else if (name === "last") {
+      setStepIndex(STEPS.length - 1);
+    } else if (name === "next") {
+      if (stepIndex <= STEPS.length - 2) {
+        setStepIndex(stepIndex + 1);
+      } else {
+        throw new Error("CheckoutPanel.setStep(): Attempting to advance past last step!");
+      }
+    } else {
+      const indexFound = STEPS.findIndex((el) => el.name === name);
+      if (indexFound !== -1) {
+        setStepIndex(indexFound);
+      } else {
+        throw new Error("CheckoutPanel.setStep(): Step named " + name + " not found!");
+      }
+    }
+  };
+  const _close = () => {
+    setStep("first");
+  };
+  const desktopElement = useRef(null);
+  const [layout, setLayout] = useState(void 0);
+  useLayoutEffect(() => {
+    const checkLayout = () => {
+      setLayout(!!desktopElement.current?.offsetParent ? "desktop" : "mobile");
+    };
+    checkLayout();
+    window.addEventListener("resize", checkLayout);
+    return () => {
+      window.removeEventListener("resize", checkLayout);
+    };
+  }, []);
+  const StepToRender = STEPS[stepIndex].Comp;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(
+      desktop_cp_default,
+      {
+        clx: cn("h-full", clx, "hidden md:flex"),
+        onLeave: _close,
+        step: stepIndex,
+        stepNames: STEP_NAMES,
+        children: [
+          /* @__PURE__ */ jsx("div", { ref: desktopElement }),
+          layout === "desktop" && /* @__PURE__ */ jsx(StepToRender, { onDone: () => {
+            setStep("next");
+          }, orderId, setOrderId })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      mobile_cp_default,
+      {
+        clx: cn("w-full h-full overflow-y-auto", clx, "md:hidden"),
+        onLeave: _close,
+        step: stepIndex,
+        stepNames: STEP_NAMES,
+        children: layout === "mobile" && /* @__PURE__ */ jsx(StepToRender, { onDone: () => {
+          setStep("next");
+        }, orderId, setOrderId })
+      }
+    )
+  ] });
+};
+var checkout_panel_default = CheckoutPanel;
+var LoginPanel = ({
+  close,
+  className = "",
+  reviews
+}) => {
+  return /* @__PURE__ */ jsxs(Box, { className: cn("grid grid-cols-1 md:grid-cols-2", className), children: [
+    /* @__PURE__ */ jsx("div", { className: "hidden md:flex w-full h-full bg-[radial-gradient(circle_at_24.1%_68.8%_,_rgba(15,14,14,0)_,_rgba(9,9,9,99.4))] flex-row items-end justify-end overflow-y-auto min-h-screen", children: /* @__PURE__ */ jsx("div", { className: "h-full w-full max-w-[750px] px-8 pt-0", children: /* @__PURE__ */ jsxs("div", { className: "h-full w-full max-w-[550px] mx-auto flex flex-col justify-between min-h-screen py-10", children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "ghost",
+          onClick: close,
+          className: "w-fit !min-w-0 p-2",
+          children: /* @__PURE__ */ jsx(Logo, { size: "md", variant: "wordmark" })
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Carousel,
+        {
+          options: { align: "center", loop: true, autoplay: 5e3 },
+          className: "w-full",
+          children: /* @__PURE__ */ jsx(CarouselContent, { children: reviews.map(({ text, author, href }, index) => /* @__PURE__ */ jsx(CarouselItem, { children: /* @__PURE__ */ jsxs(Link2, { href, className: "flex flex-col gap-3 cursor-pointer", children: [
+            /* @__PURE__ */ jsxs("p", { children: [
+              "\u201C",
+              text,
+              "\u201C"
+            ] }),
+            /* @__PURE__ */ jsx("p", { className: "text-sm", children: author })
+          ] }) }, index)) })
+        }
+      )
+    ] }) }) }),
+    /* @__PURE__ */ jsx("div", { className: "w-full h-full bg-background flex flex-row items-center", children: /* @__PURE__ */ jsx("div", { className: "w-full max-w-[750px] relative flex flex-col items-center px-8 pt-0 text-center", children: /* @__PURE__ */ jsxs("div", { className: "relative h-full w-full max-w-[400px] mx-auto flex flex-col gap-4 items-center py-10", children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "ghost",
+          onClick: close,
+          className: "block md:hidden absolute rounded-full p-2 left-0 h-auto hover:bg-background",
+          children: /* @__PURE__ */ jsx(LuxLogo, { variant: "white", size: 20 })
+        }
+      ),
+      /* @__PURE__ */ jsx(login_default, { className: "w-full max-w-sm" }),
+      /* @__PURE__ */ jsx("p", { className: "text-sm opacity-50", children: legal.map(({ title: title2, href }, index) => /* @__PURE__ */ jsxs(React7__default.Fragment, { children: [
+        index > 0 && " \xB7 ",
+        /* @__PURE__ */ jsx(Link2, { href, className: "underline", children: title2 })
+      ] }, href)) })
+    ] }) }) })
+  ] });
+};
+var login_panel_default = LoginPanel;
+
+// src/site/next/analytics/fpixel.ts
+var FB_PIXEL_ID = process.env.NEXT_PUBLIC_FACEBOOK_PIXEL_ID || "";
+var pageview = () => {
+  window.fbq("track", "PageView");
+};
+var FacebookPixel = () => {
+  const [loaded, setLoaded] = useState(false);
+  const pathname = usePathname();
+  useEffect(() => {
+    if (!loaded) return;
+    pageview();
+  }, [pathname, loaded]);
+  return /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+    Script,
+    {
+      id: "fb-pixel",
+      strategy: "afterInteractive",
+      onLoad: () => setLoaded(true),
+      dangerouslySetInnerHTML: {
+        __html: `
+            !function(f,b,e,v,n,t,s)
+            {if(f.fbq)return;n=f.fbq=function(){n.callMethod?
+            n.callMethod.apply(n,arguments):n.queue.push(arguments)};
+            if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
+            n.queue=[];t=b.createElement(e);t.async=!0;
+            t.src=v;s=b.getElementsByTagName(e)[0];
+            s.parentNode.insertBefore(t,s)}(window, document,'script',
+            'https://connect.facebook.net/en_US/fbevents.js');
+            fbq('init', ${FB_PIXEL_ID});
+          `
+      }
+    }
+  ) });
+};
+var Analytics = () => /* @__PURE__ */ jsxs(Fragment, { children: [
+  /* @__PURE__ */ jsx(FacebookPixel, {}),
+  /* @__PURE__ */ jsx(GoogleAnalytics, { gaId: process.env.NEXT_PUBLIC_GA_MEASUREMENT_ID ?? "" })
+] });
+var Tooltip = ({
+  select,
+  text,
+  clx = "",
+  position = "bottom",
+  offset = 2
+}) => /* @__PURE__ */ jsx(
+  Tooltip$1,
+  {
+    anchorSelect: select,
+    noArrow: true,
+    opacity: 1,
+    content: text,
+    place: position,
+    offset,
+    delayShow: 100,
+    delayHide: 100,
+    className: "!opacity-100 !bg-level-2 border rounded-[3px] !px-1.5 !py-1 z-floating" + clx
+  }
+);
+var tooltip_default = Tooltip;
+
+export { access_code_input_default as AccessCodeInput, Analytics, provider_default as Auth, back_button_default as BackButton, buy_button_default as BuyButton, drawer_default as BuyDrawer, chat_widget_default as ChatWidget, checkout_button_default as CheckoutButton, checkout_panel_default as CheckoutPanel, contact_dialog_default as ContactDialog, copyright_default as Copyright, drawer_margin_default as DrawerMargin, footer_default as Footer, header_default as Header, icons_exports as Icons, login_default as Login, login_panel_default as LoginPanel, Logo, main_default as Main, wrapper_default as MiniChart, not_found_default as NotFound, tooltip_default as Tooltip };