@luxfi/core 4.4.14 → 4.4.16

package/components/commerce/checkout-panel/links-row.tsx

@@ -1,21 +1,21 @@
-import Link from 'next/link'
-
-import { Separator } from '@hanzo/ui/primitives'
-import { cn } from '@hanzo/ui/util'
-
-const LinksRow: React.FC<{
-  className?: string
-}> = ({
-  className=''
-}) => (
-  <div className={cn('flex flex-col', className)}>
-    <Separator/>
-    <div className='flex gap-4 text-sm py-2'>
-      {/* TODO: add Refund policy and Privacy policy links */}
-      <Link href=''>Refund policy</Link>
-      <Link href=''>Privacy policy</Link>
-    </div>
-  </div>   
-)
-
-export default LinksRow
+import Link from 'next/link'
+
+import { Separator } from '@hanzo/ui/primitives'
+import { cn } from '@hanzo/ui/util'
+
+const LinksRow: React.FC<{
+  className?: string
+}> = ({
+  className=''
+}) => (
+  <div className={cn('flex flex-col', className)}>
+    <Separator/>
+    <div className='flex gap-4 text-sm py-2'>
+      {/* TODO: add Refund policy and Privacy policy links */}
+      <Link href=''>Refund policy</Link>
+      <Link href=''>Privacy policy</Link>
+    </div>
+  </div>   
+)
+
+export default LinksRow

package/components/commerce/checkout-panel/mb-checkout-panel.tsx

@@ -1,56 +1,56 @@
-'use client'
-import React, { type PropsWithChildren } from 'react'
-
-import { StepIndicator } from '@hanzo/ui/primitives'
-import { cn } from '@hanzo/ui/util'
-import { AuthWidget } from '@hanzo/auth/components'
-import { CartAccordian } from '@hanzo/commerce'
-
-import CloseButton from './close-button'
-import BagButton from '../bag-button'
-import LinksRow from './links-row'
-
-const MobileCheckoutPanel: React.FC<PropsWithChildren & {
-  index: number
-  stepNames: string[]
-  close:() => void
-  className?: string
-}> = ({
-  index,
-  stepNames,
-  close,
-  className='',
-  children
-}) => (
-
-  <div /* id='MOBILE_GRID' */ className={cn('bg-background flex flex-col justify-start px-4', className)}>
-    <div className='sticky top-0 w-full flex flex-row justify-between items-center bg-background'>
-      <CloseButton close={close} size='xs' />
-      {/* Need wrapper div since 'noLogin' returns null if no logged in user */}
-      <div className='w-10 h-10 flex items-center justify-center'><AuthWidget noLogin className=''/></div>
-    </div>
-    <CartAccordian 
-      icon={
-        <BagButton 
-          noHoverEffects 
-          showIfEmpty 
-          size='sm'
-          className=
-          'mr-1 relative w-5 h-6 sm:w-6 sm:h-7 '
-          iconClx='fill-foreground '
-        />
-      } 
-      className='flex items-center justify-center w-full' 
-    />
-    <StepIndicator 
-      dotSizeRem={1} 
-      steps={stepNames} 
-      currentStep={index} 
-      className='text-xs font-semibold w-full pb-3' 
-    />
-    {children}
-    <LinksRow className='mt-auto mb-3 pt-2' />
-  </div>
-)
-
+'use client'
+import React, { type PropsWithChildren } from 'react'
+
+import { StepIndicator } from '@hanzo/ui/primitives'
+import { cn } from '@hanzo/ui/util'
+import { AuthWidget } from '@hanzo/auth/components'
+import { CartAccordian } from '@hanzo/commerce'
+
+import CloseButton from './close-button'
+import BagButton from '../bag-button'
+import LinksRow from './links-row'
+
+const MobileCheckoutPanel: React.FC<PropsWithChildren & {
+  index: number
+  stepNames: string[]
+  close:() => void
+  className?: string
+}> = ({
+  index,
+  stepNames,
+  close,
+  className='',
+  children
+}) => (
+
+  <div /* id='MOBILE_GRID' */ className={cn('bg-background flex flex-col justify-start px-4', className)}>
+    <div className='sticky top-0 w-full flex flex-row justify-between items-center bg-background'>
+      <CloseButton close={close} size='xs' />
+      {/* Need wrapper div since 'noLogin' returns null if no logged in user */}
+      <div className='w-10 h-10 flex items-center justify-center'><AuthWidget noLogin className=''/></div>
+    </div>
+    <CartAccordian 
+      icon={
+        <BagButton 
+          noHoverEffects 
+          showIfEmpty 
+          size='sm'
+          className=
+          'mr-1 relative w-5 h-6 sm:w-6 sm:h-7 '
+          iconClx='fill-foreground '
+        />
+      } 
+      className='flex items-center justify-center w-full' 
+    />
+    <StepIndicator 
+      dotSizeRem={1} 
+      steps={stepNames} 
+      currentStep={index} 
+      className='text-xs font-semibold w-full pb-3' 
+    />
+    {children}
+    <LinksRow className='mt-auto mb-3 pt-2' />
+  </div>
+)
+
 export default MobileCheckoutPanel

package/components/commerce/checkout-panel/steps-indicator.tsx

@@ -1,39 +1,39 @@
-import {
-  Breadcrumb,
-  BreadcrumbItem,
-  BreadcrumbLink,
-  BreadcrumbList,
-  BreadcrumbSeparator
-} from '@hanzo/ui/primitives'
-import { cn } from '@hanzo/ui/util'
-
-const StepsIndicator: React.FC<{
-  currentStep: number
-  stepNames: string[]
-  className?: string
-}> = ({
-  currentStep,
-  stepNames,
-  className=''
-}) => (
-  <Breadcrumb className={className}>
-    <BreadcrumbList>
-      {stepNames.map((name, i) => (
-        <>
-          <BreadcrumbItem key={`item-${i}`}>
-            <BreadcrumbLink className={cn(
-                currentStep >= i ? '!text-foreground hover:text-foreground' : 'hover:text-muted-2',
-                'text-xxs sm:text-sm'  
-              )}
-            >
-              {name}
-            </BreadcrumbLink>
-          </BreadcrumbItem>
-          {i !== stepNames.length - 1 && <BreadcrumbSeparator  key={`sep-${i}`}/>}
-        </>
-      ))}
-    </BreadcrumbList>
-  </Breadcrumb>
-)
-
-export default StepsIndicator
+import {
+  Breadcrumb,
+  BreadcrumbItem,
+  BreadcrumbLink,
+  BreadcrumbList,
+  BreadcrumbSeparator
+} from '@hanzo/ui/primitives'
+import { cn } from '@hanzo/ui/util'
+
+const StepsIndicator: React.FC<{
+  currentStep: number
+  stepNames: string[]
+  className?: string
+}> = ({
+  currentStep,
+  stepNames,
+  className=''
+}) => (
+  <Breadcrumb className={className}>
+    <BreadcrumbList>
+      {stepNames.map((name, i) => (
+        <>
+          <BreadcrumbItem key={`item-${i}`}>
+            <BreadcrumbLink className={cn(
+                currentStep >= i ? '!text-foreground hover:text-foreground' : 'hover:text-muted-2',
+                'text-xxs sm:text-sm'  
+              )}
+            >
+              {name}
+            </BreadcrumbLink>
+          </BreadcrumbItem>
+          {i !== stepNames.length - 1 && <BreadcrumbSeparator  key={`sep-${i}`}/>}
+        </>
+      ))}
+    </BreadcrumbList>
+  </Breadcrumb>
+)
+
+export default StepsIndicator

package/components/commerce/checkout-panel/thank-you.tsx

@@ -1,18 +1,18 @@
-import React from 'react'
-import Link from 'next/link'
-
-import { ApplyTypography } from '@hanzo/ui/primitives'
-
-import type { CheckoutStepComponentProps } from '@hanzo/commerce/types'
-
-const ThankYou: React.FC<CheckoutStepComponentProps> = ({}) =>  (
-  <ApplyTypography className='flex flex-col gap-4 text-center mt-10'>
-    <h3>Thank you for your order!</h3>
-    <h6>Once your payment has been confirmed, you'll recieve an email with additional information.</h6>
-    <p>
-      While you wait, we cordially invite you to join the <Link href='https://warpcast.com/~/channel/lux'>Lux Channel</Link> on <Link href='https://warpcast.com/~/invite-page/227706?id=fbc9ca91'>Warpcast</Link>.
-    </p>
-  </ApplyTypography>
-)
-
-export default ThankYou
+import React from 'react'
+import Link from 'next/link'
+
+import { ApplyTypography } from '@hanzo/ui/primitives'
+
+import type { CheckoutStepComponentProps } from '@hanzo/commerce/types'
+
+const ThankYou: React.FC<CheckoutStepComponentProps> = ({}) =>  (
+  <ApplyTypography className='flex flex-col gap-4 text-center mt-10'>
+    <h3>Thank you for your order!</h3>
+    <h6>Once your payment has been confirmed, you'll recieve an email with additional information.</h6>
+    <p>
+      While you wait, we cordially invite you to join the <Link href='https://warpcast.com/~/channel/lux'>Lux Channel</Link> on <Link href='https://warpcast.com/~/invite-page/227706?id=fbc9ca91'>Warpcast</Link>.
+    </p>
+  </ApplyTypography>
+)
+
+export default ThankYou

package/components/commerce/desktop-bag-popup.tsx

@@ -1,78 +1,78 @@
-'use client'
-import React, { useState, useEffect } from 'react'
-import { useRouter } from 'next/navigation'
-
-import { X } from 'lucide-react'
-
-import {
-  Popover,
-  PopoverContent,
-  PopoverTrigger,
-  PopoverClose,
-} from "@hanzo/ui/primitives"
-
-import { cn } from '@hanzo/ui/util'
-import { CartPanel, useCommerce } from '@hanzo/commerce'
-
-import * as Icons from '../icons'
-import sendGAEvent from '../../next/analytics/google-analytics'
-
-const DesktopBagPopup: React.FC<{
-  triggerClx?: string  
-  popupClx?: string
-  trigger: React.ReactNode
-}> = ({
-  triggerClx='',
-  popupClx='',
-  trigger
-}) => {
-  const cmmc = useCommerce()
-
-  const [bagOpen, setBagOpen] = useState<boolean>(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 (
-    <Popover open={bagOpen} onOpenChange={setBagOpen}>
-      <PopoverTrigger className={triggerClx}>
-        {trigger}
-      </PopoverTrigger>
-      <PopoverContent sideOffset={28} className={cn('relative  flex flex-col p-0 px-4 pb-4 pt-2', popupClx)}>
-        <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'><X className='w-5 h-5'/></PopoverClose>
-        <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'
-        >
-          <div className='flex flex-row items-center flex-none justify-center '>
-            <Icons.bag  className='mr-2 relative w-6 h-7 fill-foreground ' />
-            <p className='font-heading text-foreground text-default'>Your Bag</p>
-          </div>
-          <div className='h-[1px] w-pr-80 bg-muted-3 mx-auto mt-1.5 flex-none'/>
-        </CartPanel>
-      </PopoverContent>
-    </Popover>
-  )
-}
-
-export default DesktopBagPopup
+'use client'
+import React, { useState, useEffect } from 'react'
+import { useRouter } from 'next/navigation'
+
+import { X } from 'lucide-react'
+
+import {
+  Popover,
+  PopoverContent,
+  PopoverTrigger,
+  PopoverClose,
+} from "@hanzo/ui/primitives"
+
+import { cn } from '@hanzo/ui/util'
+import { CartPanel, useCommerce } from '@hanzo/commerce'
+
+import * as Icons from '../icons'
+import sendGAEvent from '../../next/analytics/google-analytics'
+
+const DesktopBagPopup: React.FC<{
+  triggerClx?: string  
+  popupClx?: string
+  trigger: React.ReactNode
+}> = ({
+  triggerClx='',
+  popupClx='',
+  trigger
+}) => {
+  const cmmc = useCommerce()
+
+  const [bagOpen, setBagOpen] = useState<boolean>(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 (
+    <Popover open={bagOpen} onOpenChange={setBagOpen}>
+      <PopoverTrigger className={triggerClx}>
+        {trigger}
+      </PopoverTrigger>
+      <PopoverContent sideOffset={28} className={cn('relative  flex flex-col p-0 px-4 pb-4 pt-2', popupClx)}>
+        <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'><X className='w-5 h-5'/></PopoverClose>
+        <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'
+        >
+          <div className='flex flex-row items-center flex-none justify-center '>
+            <Icons.bag  className='mr-2 relative w-6 h-7 fill-foreground ' />
+            <p className='font-heading text-foreground text-default'>Your Bag</p>
+          </div>
+          <div className='h-[1px] w-pr-80 bg-muted-3 mx-auto mt-1.5 flex-none'/>
+        </CartPanel>
+      </PopoverContent>
+    </Popover>
+  )
+}
+
+export default DesktopBagPopup

package/components/commerce/mobile-bag-drawer.tsx

@@ -1,51 +1,51 @@
-'use client'
-import React from 'react'
-
-import { Drawer, DrawerContent} from '@hanzo/ui/primitives'
-import { cn } from '@hanzo/ui/util'
-import { CartPanel } from '@hanzo/commerce'
-
-import BagButton from './bag-button'
-
-const MobileBagDrawer: React.FC<{
-  open: boolean,
-  setOpen: (b: boolean) => void
-  handleCheckout: () => void
-  className?: string
-}> = ({
-  open,
-  setOpen,
-  handleCheckout,
-  className='',
-}) => {
-  
-  return (
-    <Drawer open={open} onOpenChange={setOpen}>
-      <DrawerContent className={cn('rounded-t-xl mt-6 pb-12 h-auto', className)} >
-        <CartPanel 
-          handleCheckout={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'
-        >
-          <div className='flex flex-row items-center flex-none justify-center '>
-            <BagButton 
-              noHoverEffects 
-              showIfEmpty 
-              className=
-              'mr-2 relative w-6 h-7'
-              iconClx='fill-foreground '
-            />
-            <p className='font-heading text-foreground text-default'>Your Bag</p>
-          </div>
-          <div className='h-[1px] w-pr-80 bg-muted-3 mx-auto mt-1.5 flex-none'/>
-        </CartPanel>
-      </DrawerContent>
-    </Drawer>
-  )
-}
-
-export default MobileBagDrawer
+'use client'
+import React from 'react'
+
+import { Drawer, DrawerContent} from '@hanzo/ui/primitives'
+import { cn } from '@hanzo/ui/util'
+import { CartPanel } from '@hanzo/commerce'
+
+import BagButton from './bag-button'
+
+const MobileBagDrawer: React.FC<{
+  open: boolean,
+  setOpen: (b: boolean) => void
+  handleCheckout: () => void
+  className?: string
+}> = ({
+  open,
+  setOpen,
+  handleCheckout,
+  className='',
+}) => {
+  
+  return (
+    <Drawer open={open} onOpenChange={setOpen}>
+      <DrawerContent className={cn('rounded-t-xl mt-6 pb-12 h-auto', className)} >
+        <CartPanel 
+          handleCheckout={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'
+        >
+          <div className='flex flex-row items-center flex-none justify-center '>
+            <BagButton 
+              noHoverEffects 
+              showIfEmpty 
+              className=
+              'mr-2 relative w-6 h-7'
+              iconClx='fill-foreground '
+            />
+            <p className='font-heading text-foreground text-default'>Your Bag</p>
+          </div>
+          <div className='h-[1px] w-pr-80 bg-muted-3 mx-auto mt-1.5 flex-none'/>
+        </CartPanel>
+      </DrawerContent>
+    </Drawer>
+  )
+}
+
+export default MobileBagDrawer

package/components/commerce/mobile-menu-toggle-button.tsx

@@ -1,35 +1,35 @@
-'use client'
-import React, { useState } from 'react'
-
-import { Plus } from 'lucide-react'
-
-import { Button } from '@hanzo/ui/primitives'
-import { cn } from '@hanzo/ui/util'
-
-const MobileMenuToggleButton: React.FC<{
-  open: boolean
-  setOpen: (b: boolean) => void
-  className?: string
-}> = ({
-  open,
-  setOpen,
-  className=''
-}) => {
-
-  return (
-    <Button 
-      variant='ghost' 
-      size='default' 
-      rounded='full' 
-      onClick={() => {setOpen(!open)}} 
-      className={cn('p-0 aspect-square hover:bg-background sm:hover:bg-level-1 active:scale-75', className)}
-    >
-      <Plus width={28} height={28} className={
-        'block h-full will-change-transform transition-transform transition-scale transition-duration-[1500] ' + 
-        (open ? 'rotate-[135deg] scale-110' : 'rotate-none')
-      } />
-    </Button>
-  )
-}
-
-export default MobileMenuToggleButton
+'use client'
+import React, { useState } from 'react'
+
+import { Plus } from 'lucide-react'
+
+import { Button } from '@hanzo/ui/primitives'
+import { cn } from '@hanzo/ui/util'
+
+const MobileMenuToggleButton: React.FC<{
+  open: boolean
+  setOpen: (b: boolean) => void
+  className?: string
+}> = ({
+  open,
+  setOpen,
+  className=''
+}) => {
+
+  return (
+    <Button 
+      variant='ghost' 
+      size='default' 
+      rounded='full' 
+      onClick={() => {setOpen(!open)}} 
+      className={cn('p-0 aspect-square hover:bg-background sm:hover:bg-level-1 active:scale-75', className)}
+    >
+      <Plus width={28} height={28} className={
+        'block h-full will-change-transform transition-transform transition-scale transition-duration-[1500] ' + 
+        (open ? 'rotate-[135deg] scale-110' : 'rotate-none')
+      } />
+    </Button>
+  )
+}
+
+export default MobileMenuToggleButton