@luxfi/core 4.4.9 → 4.4.11

package/components/header/theme-toggle.tsx

@@ -1,26 +1,26 @@
-'use client'
-
-import React from 'react'
-import { Moon, Sun } from 'lucide-react'
-import { useTheme } from 'next-themes'
-
-import { Button } from '@hanzo/ui/primitives'
-
-const ThemeToggle: React.FC = () => {
-
-  const { setTheme, theme } = useTheme()
-
-  return (
-    <Button
-      variant='ghost'
-      size='icon'
-      onClick={() => {setTheme(theme === 'light' ? 'dark' : 'light')}}
-    >
-      <Sun className='h-[1.5rem] w-[1.3rem] dark:hidden' />
-      <Moon className='hidden h-5 w-5 dark:block' />
-      <span className='sr-only'>Toggle theme</span>
-    </Button>
-  )
-}
-
-export default ThemeToggle
+'use client'
+
+import React from 'react'
+import { Moon, Sun } from 'lucide-react'
+import { useTheme } from 'next-themes'
+
+import { Button } from '@hanzo/ui/primitives'
+
+const ThemeToggle: React.FC = () => {
+
+  const { setTheme, theme } = useTheme()
+
+  return (
+    <Button
+      variant='ghost'
+      size='icon'
+      onClick={() => {setTheme(theme === 'light' ? 'dark' : 'light')}}
+    >
+      <Sun className='h-[1.5rem] w-[1.3rem] dark:hidden' />
+      <Moon className='hidden h-5 w-5 dark:block' />
+      <span className='sr-only'>Toggle theme</span>
+    </Button>
+  )
+}
+
+export default ThemeToggle

package/components/icons/bag-icon.tsx

@@ -1,10 +1,10 @@
-import React from 'react'
-import { type LucideProps } from 'lucide-react'
-
-const BagIcon: React.FC<LucideProps> = (props: LucideProps) => (
-  <svg fill="none" viewBox="0 0 1019 1281" {...props}>
-    <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"/>
-  </svg>
-)
-
-export default BagIcon
+import React from 'react'
+import { type LucideProps } from 'lucide-react'
+
+const BagIcon: React.FC<LucideProps> = (props: LucideProps) => (
+  <svg fill="none" viewBox="0 0 1019 1281" {...props}>
+    <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"/>
+  </svg>
+)
+
+export default BagIcon

package/components/icons/github.tsx

@@ -1,14 +1,14 @@
-import React from 'react'
-import { type LucideProps } from 'lucide-react'
-
-
-const GitHub: React.FC<LucideProps> = (props: LucideProps) => (
-  <svg viewBox="0 0 438.549 438.549" {...props}>
-    <path
-      fill="currentColor"
-      d="M409.132 114.573c-19.608-33.596-46.205-60.194-79.798-79.8-33.598-19.607-70.277-29.408-110.063-29.408-39.781 0-76.472 9.804-110.063 29.408-33.596 19.605-60.192 46.204-79.8 79.8C9.803 148.168 0 184.854 0 224.63c0 47.78 13.94 90.745 41.827 128.906 27.884 38.164 63.906 64.572 108.063 79.227 5.14.954 8.945.283 11.419-1.996 2.475-2.282 3.711-5.14 3.711-8.562 0-.571-.049-5.708-.144-15.417a2549.81 2549.81 0 01-.144-25.406l-6.567 1.136c-4.187.767-9.469 1.092-15.846 1-6.374-.089-12.991-.757-19.842-1.999-6.854-1.231-13.229-4.086-19.13-8.559-5.898-4.473-10.085-10.328-12.56-17.556l-2.855-6.57c-1.903-4.374-4.899-9.233-8.992-14.559-4.093-5.331-8.232-8.945-12.419-10.848l-1.999-1.431c-1.332-.951-2.568-2.098-3.711-3.429-1.142-1.331-1.997-2.663-2.568-3.997-.572-1.335-.098-2.43 1.427-3.289 1.525-.859 4.281-1.276 8.28-1.276l5.708.853c3.807.763 8.516 3.042 14.133 6.851 5.614 3.806 10.229 8.754 13.846 14.842 4.38 7.806 9.657 13.754 15.846 17.847 6.184 4.093 12.419 6.136 18.699 6.136 6.28 0 11.704-.476 16.274-1.423 4.565-.952 8.848-2.383 12.847-4.285 1.713-12.758 6.377-22.559 13.988-29.41-10.848-1.14-20.601-2.857-29.264-5.14-8.658-2.286-17.605-5.996-26.835-11.14-9.235-5.137-16.896-11.516-22.985-19.126-6.09-7.614-11.088-17.61-14.987-29.979-3.901-12.374-5.852-26.648-5.852-42.826 0-23.035 7.52-42.637 22.557-58.817-7.044-17.318-6.379-36.732 1.997-58.24 5.52-1.715 13.706-.428 24.554 3.853 10.85 4.283 18.794 7.952 23.84 10.994 5.046 3.041 9.089 5.618 12.135 7.708 17.705-4.947 35.976-7.421 54.818-7.421s37.117 2.474 54.823 7.421l10.849-6.849c7.419-4.57 16.18-8.758 26.262-12.565 10.088-3.805 17.802-4.853 23.134-3.138 8.562 21.509 9.325 40.922 2.279 58.24 15.036 16.18 22.559 35.787 22.559 58.817 0 16.178-1.958 30.497-5.853 42.966-3.9 12.471-8.941 22.457-15.125 29.979-6.191 7.521-13.901 13.85-23.131 18.986-9.232 5.14-18.182 8.85-26.84 11.136-8.662 2.286-18.415 4.004-29.263 5.146 9.894 8.562 14.842 22.077 14.842 40.539v60.237c0 3.422 1.19 6.279 3.572 8.562 2.379 2.279 6.136 2.95 11.276 1.995 44.163-14.653 80.185-41.062 108.068-79.226 27.88-38.161 41.825-81.126 41.825-128.906-.01-39.771-9.818-76.454-29.414-110.049z"
-    ></path>
-  </svg>
-)
-
-export default GitHub
+import React from 'react'
+import { type LucideProps } from 'lucide-react'
+
+
+const GitHub: React.FC<LucideProps> = (props: LucideProps) => (
+  <svg viewBox="0 0 438.549 438.549" {...props}>
+    <path
+      fill="currentColor"
+      d="M409.132 114.573c-19.608-33.596-46.205-60.194-79.798-79.8-33.598-19.607-70.277-29.408-110.063-29.408-39.781 0-76.472 9.804-110.063 29.408-33.596 19.605-60.192 46.204-79.8 79.8C9.803 148.168 0 184.854 0 224.63c0 47.78 13.94 90.745 41.827 128.906 27.884 38.164 63.906 64.572 108.063 79.227 5.14.954 8.945.283 11.419-1.996 2.475-2.282 3.711-5.14 3.711-8.562 0-.571-.049-5.708-.144-15.417a2549.81 2549.81 0 01-.144-25.406l-6.567 1.136c-4.187.767-9.469 1.092-15.846 1-6.374-.089-12.991-.757-19.842-1.999-6.854-1.231-13.229-4.086-19.13-8.559-5.898-4.473-10.085-10.328-12.56-17.556l-2.855-6.57c-1.903-4.374-4.899-9.233-8.992-14.559-4.093-5.331-8.232-8.945-12.419-10.848l-1.999-1.431c-1.332-.951-2.568-2.098-3.711-3.429-1.142-1.331-1.997-2.663-2.568-3.997-.572-1.335-.098-2.43 1.427-3.289 1.525-.859 4.281-1.276 8.28-1.276l5.708.853c3.807.763 8.516 3.042 14.133 6.851 5.614 3.806 10.229 8.754 13.846 14.842 4.38 7.806 9.657 13.754 15.846 17.847 6.184 4.093 12.419 6.136 18.699 6.136 6.28 0 11.704-.476 16.274-1.423 4.565-.952 8.848-2.383 12.847-4.285 1.713-12.758 6.377-22.559 13.988-29.41-10.848-1.14-20.601-2.857-29.264-5.14-8.658-2.286-17.605-5.996-26.835-11.14-9.235-5.137-16.896-11.516-22.985-19.126-6.09-7.614-11.088-17.61-14.987-29.979-3.901-12.374-5.852-26.648-5.852-42.826 0-23.035 7.52-42.637 22.557-58.817-7.044-17.318-6.379-36.732 1.997-58.24 5.52-1.715 13.706-.428 24.554 3.853 10.85 4.283 18.794 7.952 23.84 10.994 5.046 3.041 9.089 5.618 12.135 7.708 17.705-4.947 35.976-7.421 54.818-7.421s37.117 2.474 54.823 7.421l10.849-6.849c7.419-4.57 16.18-8.758 26.262-12.565 10.088-3.805 17.802-4.853 23.134-3.138 8.562 21.509 9.325 40.922 2.279 58.24 15.036 16.18 22.559 35.787 22.559 58.817 0 16.178-1.958 30.497-5.853 42.966-3.9 12.471-8.941 22.457-15.125 29.979-6.191 7.521-13.901 13.85-23.131 18.986-9.232 5.14-18.182 8.85-26.84 11.136-8.662 2.286-18.415 4.004-29.263 5.146 9.894 8.562 14.842 22.077 14.842 40.539v60.237c0 3.422 1.19 6.279 3.572 8.562 2.379 2.279 6.136 2.95 11.276 1.995 44.163-14.653 80.185-41.062 108.068-79.226 27.88-38.161 41.825-81.126 41.825-128.906-.01-39.771-9.818-76.454-29.414-110.049z"
+    ></path>
+  </svg>
+)
+
+export default GitHub

package/components/icons/index.tsx

@@ -1,35 +1,35 @@
-import {
-  Moon as moon,
-  SunMedium as sun,
-  Menu as burger,
-  ArrowUpRight as linkOut,
-  type XIcon as LucideIcon,
-} from 'lucide-react'
-
-import gitHub from './github'
-import bag from './bag-icon'
-import logo from './lux-logo'
-import youtube from './youtube-logo'
-import secureDelivery from './secure-delivery'
-
-import  {
-  type SocialIconProps,
-  default as SocialIcon 
-} from './social-icon'
-
-export { type LucideIcon as Icon, type SocialIconProps } 
-
-export {
-  bag,
-  sun,
-  moon,
-  logo,
-  burger,
-  gitHub,
-  linkOut,
-  youtube,
-  secureDelivery,
-  SocialIcon,
-}
-
-
+import {
+  Moon as moon,
+  SunMedium as sun,
+  Menu as burger,
+  ArrowUpRight as linkOut,
+  type XIcon as LucideIcon,
+} from 'lucide-react'
+
+import gitHub from './github'
+import bag from './bag-icon'
+import logo from './lux-logo'
+import youtube from './youtube-logo'
+import secureDelivery from './secure-delivery'
+
+import  {
+  type SocialIconProps,
+  default as SocialIcon 
+} from './social-icon'
+
+export { type LucideIcon as Icon, type SocialIconProps } 
+
+export {
+  bag,
+  sun,
+  moon,
+  logo,
+  burger,
+  gitHub,
+  linkOut,
+  youtube,
+  secureDelivery,
+  SocialIcon,
+}
+
+

package/components/icons/lux-logo.tsx

@@ -1,10 +1,10 @@
-import React from 'react'
-import { type LucideProps } from 'lucide-react'
-
-const LuxLogo: React.FC<LucideProps> = (props: LucideProps) => (
-  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50"  {...props}>
-    <polygon points="25,46.65 50,3.35 0,3.35" fill="white" stroke='black' strokeWidth={props.strokeWidth}/>
-  </svg>
-)
-
-export default LuxLogo
+import React from 'react'
+import { type LucideProps } from 'lucide-react'
+
+const LuxLogo: React.FC<LucideProps> = (props: LucideProps) => (
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50"  {...props}>
+    <polygon points="25,46.65 50,3.35 0,3.35" fill="white" stroke='black' strokeWidth={props.strokeWidth}/>
+  </svg>
+)
+
+export default LuxLogo

package/components/icons/secure-delivery.tsx

@@ -1,13 +1,13 @@
-import React from 'react'
-import { type LucideProps } from 'lucide-react'
-
-//  width="52" height="36" 
-const SecureDelivery: React.FC<LucideProps> = (props: LucideProps) => (
-<svg fill="currentColor" viewBox="0 0 52 36" xmlns="http://www.w3.org/2000/svg" {...props}>
-  <path d="M47.7611 24.5439H42.822L39.5293 14.9971H12.0732L8.7805 24.5439H2.96342L0 36.0001H51.7127L47.7611 24.5439ZM38.4147 16.9064L41.0488 24.5439H28.0049L25.3708 16.9064H38.4147ZM13.1879 16.9064H23.5976L26.2317 24.5439H10.5528L13.1879 16.9064ZM2.21225 34.0907L4.18786 26.4532H14.4865L16.4621 34.0907H2.21225ZM17.6804 32.1537L16.2061 26.4531H19.646L17.6804 32.1537ZM28.2706 34.0907H18.7854L21.4196 26.4532H31.8293L34.4634 34.0907H28.2706ZM36.2367 34.0907L33.6025 26.4532H46.6473L49.2814 34.0907H36.2367Z" />
-  <path d="M10.0843 0.108973C10.1056 -0.0363242 10.2915 -0.0363242 10.3128 0.108973L10.5061 1.43021C10.9095 4.18489 12.8287 6.34425 15.2772 6.79764L16.4515 7.01512C16.5808 7.03912 16.5808 7.24823 16.4515 7.27223L15.2772 7.4897C12.8286 7.94345 10.9091 10.1026 10.5061 12.8571L10.3128 14.1782C10.2915 14.3237 10.1056 14.3237 10.0843 14.1782L9.89096 12.8571C9.48763 10.1025 7.56837 7.9431 5.11989 7.4897L3.94562 7.27223C3.8163 7.24823 3.8163 7.03912 3.94562 7.01512L5.11989 6.79764C7.5685 6.3439 9.48794 4.18475 9.89096 1.43021L10.0843 0.108973Z" />
-  <path d="M22.034 0.0726485C22.0473 -0.0242162 22.1635 -0.0242162 22.1768 0.0726485L22.2977 0.953473C22.5497 2.78993 23.7493 4.2295 25.2796 4.53176L26.0135 4.67675C26.0943 4.69275 26.0943 4.83215 26.0135 4.84815L25.2796 4.99314C23.7492 5.29563 22.5495 6.73507 22.2977 8.57142L22.1768 9.45212C22.1635 9.54911 22.0473 9.54911 22.034 9.45212L21.9132 8.57142C21.6611 6.73497 20.4616 5.2954 18.9313 4.99314L18.1973 4.84815C18.1165 4.83215 18.1165 4.69275 18.1973 4.67675L18.9313 4.53176C20.4616 4.22926 21.6613 2.78983 21.9132 0.953473L22.034 0.0726485Z" />
-</svg>
-)
-
-export default SecureDelivery
+import React from 'react'
+import { type LucideProps } from 'lucide-react'
+
+//  width="52" height="36" 
+const SecureDelivery: React.FC<LucideProps> = (props: LucideProps) => (
+<svg fill="currentColor" viewBox="0 0 52 36" xmlns="http://www.w3.org/2000/svg" {...props}>
+  <path d="M47.7611 24.5439H42.822L39.5293 14.9971H12.0732L8.7805 24.5439H2.96342L0 36.0001H51.7127L47.7611 24.5439ZM38.4147 16.9064L41.0488 24.5439H28.0049L25.3708 16.9064H38.4147ZM13.1879 16.9064H23.5976L26.2317 24.5439H10.5528L13.1879 16.9064ZM2.21225 34.0907L4.18786 26.4532H14.4865L16.4621 34.0907H2.21225ZM17.6804 32.1537L16.2061 26.4531H19.646L17.6804 32.1537ZM28.2706 34.0907H18.7854L21.4196 26.4532H31.8293L34.4634 34.0907H28.2706ZM36.2367 34.0907L33.6025 26.4532H46.6473L49.2814 34.0907H36.2367Z" />
+  <path d="M10.0843 0.108973C10.1056 -0.0363242 10.2915 -0.0363242 10.3128 0.108973L10.5061 1.43021C10.9095 4.18489 12.8287 6.34425 15.2772 6.79764L16.4515 7.01512C16.5808 7.03912 16.5808 7.24823 16.4515 7.27223L15.2772 7.4897C12.8286 7.94345 10.9091 10.1026 10.5061 12.8571L10.3128 14.1782C10.2915 14.3237 10.1056 14.3237 10.0843 14.1782L9.89096 12.8571C9.48763 10.1025 7.56837 7.9431 5.11989 7.4897L3.94562 7.27223C3.8163 7.24823 3.8163 7.03912 3.94562 7.01512L5.11989 6.79764C7.5685 6.3439 9.48794 4.18475 9.89096 1.43021L10.0843 0.108973Z" />
+  <path d="M22.034 0.0726485C22.0473 -0.0242162 22.1635 -0.0242162 22.1768 0.0726485L22.2977 0.953473C22.5497 2.78993 23.7493 4.2295 25.2796 4.53176L26.0135 4.67675C26.0943 4.69275 26.0943 4.83215 26.0135 4.84815L25.2796 4.99314C23.7492 5.29563 22.5495 6.73507 22.2977 8.57142L22.1768 9.45212C22.1635 9.54911 22.0473 9.54911 22.034 9.45212L21.9132 8.57142C21.6611 6.73497 20.4616 5.2954 18.9313 4.99314L18.1973 4.84815C18.1165 4.83215 18.1165 4.69275 18.1973 4.67675L18.9313 4.53176C20.4616 4.22926 21.6613 2.78983 21.9132 0.953473L22.034 0.0726485Z" />
+</svg>
+)
+
+export default SecureDelivery

package/components/icons/social-icon.tsx

@@ -1,35 +1,35 @@
-import React from 'react'
-
-import { SocialIcon as BaseSocialIcon } from 'react-social-icons'
-
-import { cn } from '@hanzo/ui/util'
-import './social-svg.css'
-
-interface SocialIconProps {
-    // one of these: https://github.com/couetilc/react-social-icons/tree/main/db
-  network: string
-  size: number
-  className?: string
-}
-
-const SocialIcon: React.FC<SocialIconProps> = ({
-  network,
-  size,
-  className = ''
-}) => (
-  <BaseSocialIcon 
-    network={network}
-    as='div' 
-      // This is set up so the enclosing element sets the color.
-      // For example, something like 'color-foreground hover:color-muted-1' 
-    className={cn('color-inherit', className)}
-    bgColor='transparent' 
-    fgColor='currentColor'
-    style={{height: size, width: size}} 
-  />
-)
-
-export {
-  type SocialIconProps,
-  SocialIcon as default
-}
+import React from 'react'
+
+import { SocialIcon as BaseSocialIcon } from 'react-social-icons'
+
+import { cn } from '@hanzo/ui/util'
+import './social-svg.css'
+
+interface SocialIconProps {
+    // one of these: https://github.com/couetilc/react-social-icons/tree/main/db
+  network: string
+  size: number
+  className?: string
+}
+
+const SocialIcon: React.FC<SocialIconProps> = ({
+  network,
+  size,
+  className = ''
+}) => (
+  <BaseSocialIcon 
+    network={network}
+    as='div' 
+      // This is set up so the enclosing element sets the color.
+      // For example, something like 'color-foreground hover:color-muted-1' 
+    className={cn('color-inherit', className)}
+    bgColor='transparent' 
+    fgColor='currentColor'
+    style={{height: size, width: size}} 
+  />
+)
+
+export {
+  type SocialIconProps,
+  SocialIcon as default
+}

package/components/icons/social-svg.css

@@ -1,3 +1,3 @@
-.social-icon svg {
-    transform: scale(1.25);
-}
+.social-icon svg {
+    transform: scale(1.25);
+}

package/components/icons/youtube-logo.tsx

@@ -1,59 +1,59 @@
-import React from 'react'
-import { type LucideProps } from 'lucide-react'
-
-const YouTubeLogo: React.FC<LucideProps> = (props: LucideProps) => (
-  <svg 
-    viewBox="0 0 256 256" 
-    xmlns="http://www.w3.org/2000/svg" 
-    {...props}
-  >
-    <g 
-      style={{
-        stroke: 'none',
-        strokeWidth: 0,
-        strokeDasharray: 'none',
-        strokeLinecap: 'butt',
-        strokeLinejoin: 'miter',
-        strokeMiterlimit: 10,
-        fill: 'none',
-        fillRule: 'nonzero',
-        opacity: 1
-      }}
-      transform="translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)" 
-    >
-      <path 
-        d="M 88.119 23.338 c -1.035 -3.872 -4.085 -6.922 -7.957 -7.957 C 73.144 13.5 45 13.5 45 13.5 s -28.144 0 -35.162 1.881 c -3.872 1.035 -6.922 4.085 -7.957 7.957 C 0 30.356 0 45 0 45 s 0 14.644 1.881 21.662 c 1.035 3.872 4.085 6.922 7.957 7.957 C 16.856 76.5 45 76.5 45 76.5 s 28.144 0 35.162 -1.881 c 3.872 -1.035 6.922 -4.085 7.957 -7.957 C 90 59.644 90 45 90 45 S 90 30.356 88.119 23.338 z" 
-        style={{
-          stroke: 'none',
-          strokeWidth: 1,
-          strokeDasharray: 'none',
-          strokeLinecap: 'butt',
-          strokeLinejoin: 'miter',
-          strokeMiterlimit: 10,
-          fill: 'red',
-          fillRule: 'nonzero',
-          opacity: 1
-        }}
-        transform=" matrix(1 0 0 1 0 0) " 
-        strokeLinecap="round" 
-      />
-      <polygon 
-        points="36,58.5 59.38,45 36,31.5 " 
-        style={{
-          stroke: 'none',
-          strokeWidth: 1,
-          strokeDasharray: 'none',
-          strokeLinecap: 'butt',
-          strokeLinejoin: 'miter',
-          strokeMiterlimit: 10,
-          fill: 'white',
-          fillRule: 'nonzero',
-          opacity: 1
-        }}
-        transform="matrix(1 0 0 1 0 0)"
-      />
-    </g>
-  </svg>
-)
-
-export default YouTubeLogo
+import React from 'react'
+import { type LucideProps } from 'lucide-react'
+
+const YouTubeLogo: React.FC<LucideProps> = (props: LucideProps) => (
+  <svg 
+    viewBox="0 0 256 256" 
+    xmlns="http://www.w3.org/2000/svg" 
+    {...props}
+  >
+    <g 
+      style={{
+        stroke: 'none',
+        strokeWidth: 0,
+        strokeDasharray: 'none',
+        strokeLinecap: 'butt',
+        strokeLinejoin: 'miter',
+        strokeMiterlimit: 10,
+        fill: 'none',
+        fillRule: 'nonzero',
+        opacity: 1
+      }}
+      transform="translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)" 
+    >
+      <path 
+        d="M 88.119 23.338 c -1.035 -3.872 -4.085 -6.922 -7.957 -7.957 C 73.144 13.5 45 13.5 45 13.5 s -28.144 0 -35.162 1.881 c -3.872 1.035 -6.922 4.085 -7.957 7.957 C 0 30.356 0 45 0 45 s 0 14.644 1.881 21.662 c 1.035 3.872 4.085 6.922 7.957 7.957 C 16.856 76.5 45 76.5 45 76.5 s 28.144 0 35.162 -1.881 c 3.872 -1.035 6.922 -4.085 7.957 -7.957 C 90 59.644 90 45 90 45 S 90 30.356 88.119 23.338 z" 
+        style={{
+          stroke: 'none',
+          strokeWidth: 1,
+          strokeDasharray: 'none',
+          strokeLinecap: 'butt',
+          strokeLinejoin: 'miter',
+          strokeMiterlimit: 10,
+          fill: 'red',
+          fillRule: 'nonzero',
+          opacity: 1
+        }}
+        transform=" matrix(1 0 0 1 0 0) " 
+        strokeLinecap="round" 
+      />
+      <polygon 
+        points="36,58.5 59.38,45 36,31.5 " 
+        style={{
+          stroke: 'none',
+          strokeWidth: 1,
+          strokeDasharray: 'none',
+          strokeLinecap: 'butt',
+          strokeLinejoin: 'miter',
+          strokeMiterlimit: 10,
+          fill: 'white',
+          fillRule: 'nonzero',
+          opacity: 1
+        }}
+        transform="matrix(1 0 0 1 0 0)"
+      />
+    </g>
+  </svg>
+)
+
+export default YouTubeLogo

package/components/index.ts

@@ -1,27 +1,27 @@
-export { default as AccessCodeInput } from './access-code-input'
-export { default as ChatWidget } from './chat-widget'
-export { default as ContactDialog } from './contact-dialog'
-export { default as Copyright} from './copyright'
-export { default as Footer } from './footer'
-export { default as Header } from './header'
-export * as Icons from './icons'
-export { default as Logo } from './logo'
-export { default as MiniChart } from './mini-chart'
-export { default as NotFound } from './not-found'
-export {
-  default as RootLayout,
-  viewport as rootLayoutViewport
-} from './root-layout'
-
-export { default as CheckoutPanel } from './commerce/checkout-panel'
-export { default as LoginPanel } from './auth/login-panel'
-export { default as AuthListener } from './auth/auth-listener'
-
-
-/* PLEASE KEEP
-export { 
-  default as HeadMetadata, 
-  getTitleFromTemplateString, 
-  TwitterComponent
-} from './head-metadata'
-*/
+export { default as AccessCodeInput } from './access-code-input'
+export { default as ChatWidget } from './chat-widget'
+export { default as ContactDialog } from './contact-dialog'
+export { default as Copyright} from './copyright'
+export { default as Footer } from './footer'
+export { default as Header } from './header'
+export * as Icons from './icons'
+export { default as Logo } from './logo'
+export { default as MiniChart } from './mini-chart'
+export { default as NotFound } from './not-found'
+export {
+  default as RootLayout,
+  viewport as rootLayoutViewport
+} from './root-layout'
+
+export { default as CheckoutPanel } from './commerce/checkout-panel'
+export { default as LoginPanel } from './auth/login-panel'
+export { default as AuthListener } from './auth/auth-listener'
+
+
+/* PLEASE KEEP
+export { 
+  default as HeadMetadata, 
+  getTitleFromTemplateString, 
+  TwitterComponent
+} from './head-metadata'
+*/

package/components/logo.tsx

@@ -1,81 +1,81 @@
-import React from 'react'
-import Link from 'next/link'
-
-import { type TShirtSize  } from '@hanzo/ui/types'
-import { cn } from '@hanzo/ui/util'
-
-import * as Icons from './icons'
-
-const Logo: React.FC<{
-  size?: TShirtSize
-  layout?: 'text-only' | 'logo-only' | 'full'
-  href?: string
-  className?: string
-  spanClassName?: string
-}> = ({
-  size,
-  href, // no default please!
-  className='',
-  spanClassName,
-  layout='full'
-}) => {
-  let classes: any = {}
-  const toAdd = (layout === 'logo-only') ? {
-    span: ' hidden',
-    icon: ''
-  } :
-  (layout === 'text-only') ? {
-    span: '',
-    icon: ' hidden'
-  } : 
-  {
-    span: '',
-    icon: ''
-  }
-
-  if (size === 'lg' || size === 'xl' ) { // for safety
-    classes.icon = 'h-10 w-10 mr-4 color-inherit' + toAdd.icon
-    classes.span = 'text-3xl' + toAdd.span
-  }
-    // match lux.network
-  else if (size === 'md') {
-    classes.icon = 'h-[32px] w-[32px] mr-[12px] color-inherit' + toAdd.icon
-    classes.span = 'text-[1.8rem]/[1.8rem] tracking-tighter' + toAdd.span
-  }
-  else if (size === 'sm' ) {
-    classes.icon = 'h-6 w-6 mr-2 color-inherit' + toAdd.icon
-    classes.span = 'text-lg' + toAdd.span
-  }
-    // xs
-  else {
-    classes.icon = 'h-4 w-4 mr-1 color-inherit' + toAdd.icon
-    classes.span = 'text-base' + toAdd.span
-  }
-
-  const outerClasses = 'flex flex-row items-center ' + className
-  const spanClasses = 'inline-block font-bold font-heading ' 
-    + spanClassName
-    + (href ? ' hover:text-accent ' : ' cursor-default ') 
-    + classes.span 
-
-  const Inner: React.FC = () => (<>
-      <Icons.logo className={classes.icon} />
-      <span className={cn(spanClasses, ' text-inherit')}>LUX</span>
-  </>)
-
-
-  return (
-    href ? (
-      <Link href={href} className={outerClasses} >
-        <Inner />
-      </Link>
-  
-    ) : (
-      <span className={outerClasses} >
-        <Inner />
-      </span>
-    )
-  )
-}
-
-export default Logo
+import React from 'react'
+import Link from 'next/link'
+
+import { type TShirtSize  } from '@hanzo/ui/types'
+import { cn } from '@hanzo/ui/util'
+
+import * as Icons from './icons'
+
+const Logo: React.FC<{
+  size?: TShirtSize
+  layout?: 'text-only' | 'logo-only' | 'full'
+  href?: string
+  className?: string
+  spanClassName?: string
+}> = ({
+  size,
+  href, // no default please!
+  className='',
+  spanClassName,
+  layout='full'
+}) => {
+  let classes: any = {}
+  const toAdd = (layout === 'logo-only') ? {
+    span: ' hidden',
+    icon: ''
+  } :
+  (layout === 'text-only') ? {
+    span: '',
+    icon: ' hidden'
+  } : 
+  {
+    span: '',
+    icon: ''
+  }
+
+  if (size === 'lg' || size === 'xl' ) { // for safety
+    classes.icon = 'h-10 w-10 mr-4 color-inherit' + toAdd.icon
+    classes.span = 'text-3xl' + toAdd.span
+  }
+    // match lux.network
+  else if (size === 'md') {
+    classes.icon = 'h-[32px] w-[32px] mr-[12px] color-inherit' + toAdd.icon
+    classes.span = 'text-[1.8rem]/[1.8rem] tracking-tighter' + toAdd.span
+  }
+  else if (size === 'sm' ) {
+    classes.icon = 'h-6 w-6 mr-2 color-inherit' + toAdd.icon
+    classes.span = 'text-lg' + toAdd.span
+  }
+    // xs
+  else {
+    classes.icon = 'h-4 w-4 mr-1 color-inherit' + toAdd.icon
+    classes.span = 'text-base' + toAdd.span
+  }
+
+  const outerClasses = 'flex flex-row items-center ' + className
+  const spanClasses = 'inline-block font-bold font-heading ' 
+    + spanClassName
+    + (href ? ' hover:text-accent ' : ' cursor-default ') 
+    + classes.span 
+
+  const Inner: React.FC = () => (<>
+      <Icons.logo className={classes.icon} />
+      <span className={cn(spanClasses, ' text-inherit')}>LUX</span>
+  </>)
+
+
+  return (
+    href ? (
+      <Link href={href} className={outerClasses} >
+        <Inner />
+      </Link>
+  
+    ) : (
+      <span className={outerClasses} >
+        <Inner />
+      </span>
+    )
+  )
+}
+
+export default Logo