[email protected], [email protected], [email protected]: minor changes supporting mobile pu…

…rchasing

packages/auth/components/auth-widget.tsx

@@ -26,14 +26,20 @@ const AuthWidget: React.FC<{
 }) => {
 
   const auth = useAuth()
-  
+
     // This safegaurds against a crash in the rare case
     // that multiple inistances of auth module are in play.
     // We safegaurd agains this in the by loading peer Deps from
     // the root in host mono repos, but this is another layer.
+    // Also, this allows sites to opt-in to showing an auth widget without
+    // configuration, by just providing the context/
+  if (!auth) {
+    return null
+  }
+
     // If that is the case, the widget will always show the login 
     // button regardless of status.
-  if (!auth || !auth.loggedIn) {
+  if (!auth.loggedIn) {
     return (
       <LinkElement
         def={{href: '/login', title: 'Login', variant: 'primary'} satisfies LinkDef}
@@ -48,7 +54,7 @@ const AuthWidget: React.FC<{
         <Button 
           variant="outline" 
           size='icon' 
-          className={cn('rounded-full text-foreground uppercase w-9 h-9', className)}
+          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)}
         >{auth.user?.email[0]}</Button>
       </PopoverTrigger>
       <PopoverContent className='bg-level-0'>

packages/auth/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hanzo/auth",
-  "version": "2.0.2",
+  "version": "2.0.3",
   "description": "Library with Firebase authentication.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",

packages/commerce/components/cart-panel/index.tsx

@@ -30,7 +30,6 @@ const CartPanel: React.FC<PropsWithChildren & {
     <div className={cn('border p-4 rounded-lg', className)}>
       {children}
       <div className='mt-2 w-full'>
-        {!!children && <div className='h-[1px] w-pr-80 mb-4 mx-auto bg-muted-3'/>}
         {cmmc.cartEmpty ? (
           <p className='text-center mt-4'>No items in cart</p>
         ) : (<>

packages/commerce/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hanzo/commerce",
-  "version": "3.0.0",
+  "version": "3.0.1",
   "description": "Library with shopping cart components.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",

packages/commerce/types/commerce-service.ts

@@ -6,9 +6,9 @@ interface CommerceService extends ObsLineItemRef {
 
     /** Items in cart */
   get cartItems(): LineItem[]
-    /** Total of all quantities of all products in cart */
+    /** Total of all quantities of all items in cart */
   get cartQuantity(): number
-    /** Total of all prices * quantities of products in cart */
+    /** Total of all prices * quantities of items in cart */
   get cartTotal(): number
 
   get cartEmpty(): boolean

packages/ui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hanzo/ui",
-  "version": "3.0.2",
+  "version": "3.0.3",
   "description": "Library that contains shared UI primitives, support for a common design system, and other boilerplate support.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",

packages/ui/primitives/tailwind-indicator.tsx → packages/ui/primitives/breakpoint-indicator.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 
-const TailwindIndicator: React.FC = () => {
+const BreakpointIndicator: React.FC = () => {
 
   if (process.env.NODE_ENV === "production") return null
 
@@ -16,4 +16,4 @@ const TailwindIndicator: React.FC = () => {
   )
 }
 
-export default TailwindIndicator
+export default BreakpointIndicator

packages/ui/primitives/index.ts

@@ -65,7 +65,7 @@ export {
   TableCaption,
 } from './table'
 
-export { default as TailwindIndicator } from './tailwind-indicator'
+export { default as BreakpointIndicator } from './breakpoint-indicator'
 
 export {
   type ToastProps,

packages/ui/primitives/sheet.tsx

@@ -36,8 +36,8 @@ const sheetVariants = cva(
   {
     variants: {
       side: {
-        //top: 'inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top',
-        //bottom: 'inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom',
+        top: 'inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top',
+        bottom: 'inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom',
         left: 'inset-y-0 left-0 h-full w-5/6 sm:w-2/3 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm',
         right:
           'inset-y-0 right-0 h-full w-5/6 sm:w-2/3 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm',

packages/ui/tailwind/tailwind.config.hanzo-preset.js

@@ -34,6 +34,7 @@ export default {
       bounce: 'bounce 1s infinite',
       "accordion-down": "accordion-down 0.2s ease-out",
       "accordion-up": "accordion-up 0.2s ease-out",
+      "mobile-menu-open": "opacity-in 300ms ease-in",
     },
     aria: {
       checked: 'checked="true"',
@@ -535,6 +536,10 @@ export default {
         from: { height: "var(--radix-accordion-content-height)" },
         to: { height: 0 },
       },
+      "opacity-in": {
+        from: { opacity: '0' },
+        to: { opacity: '1' }
+      },
     },
     letterSpacing: {
       tighter: '-0.05em',