@luxfi/core 4.4.10 → 4.4.12

Sign up to get free protection for your applications and to get access to all the features.
Files changed (84) hide show
  1. package/components/access-code-input.tsx +71 -71
  2. package/components/auth/auth-listener.tsx +23 -41
  3. package/components/auth/auth-token/clear-auth-token.tsx +12 -0
  4. package/components/auth/auth-token/set-auth-token.tsx +16 -0
  5. package/components/auth/common-auth-domains.ts +16 -15
  6. package/components/auth/login-panel.tsx +119 -117
  7. package/components/chat-widget.tsx +77 -77
  8. package/components/commerce/bag-button.tsx +67 -67
  9. package/components/commerce/checkout-panel/close-button.tsx +26 -26
  10. package/components/commerce/checkout-panel/dt-bag-carousel.tsx +36 -36
  11. package/components/commerce/checkout-panel/dt-checkout-panel.tsx +66 -66
  12. package/components/commerce/checkout-panel/index.tsx +123 -123
  13. package/components/commerce/checkout-panel/links-row.tsx +21 -21
  14. package/components/commerce/checkout-panel/mb-checkout-panel.tsx +55 -55
  15. package/components/commerce/checkout-panel/steps-indicator.tsx +39 -39
  16. package/components/commerce/checkout-panel/thank-you.tsx +18 -18
  17. package/components/commerce/desktop-bag-popup.tsx +78 -78
  18. package/components/commerce/mobile-bag-drawer.tsx +51 -51
  19. package/components/commerce/mobile-menu-toggle-button.tsx +35 -35
  20. package/components/commerce/mobile-nav-menu.tsx +64 -64
  21. package/components/contact-dialog/contact-form.tsx +112 -112
  22. package/components/contact-dialog/disclaimer.tsx +13 -13
  23. package/components/contact-dialog/index.tsx +64 -64
  24. package/components/copyright.tsx +21 -21
  25. package/components/footer.tsx +77 -77
  26. package/components/header/desktop.tsx +54 -54
  27. package/components/header/index.tsx +26 -26
  28. package/components/header/mobile.tsx +161 -161
  29. package/components/header/theme-toggle.tsx +26 -26
  30. package/components/icons/bag-icon.tsx +10 -10
  31. package/components/icons/github.tsx +14 -14
  32. package/components/icons/index.tsx +35 -35
  33. package/components/icons/lux-logo.tsx +10 -10
  34. package/components/icons/secure-delivery.tsx +13 -13
  35. package/components/icons/social-icon.tsx +35 -35
  36. package/components/icons/social-svg.css +3 -3
  37. package/components/icons/youtube-logo.tsx +59 -59
  38. package/components/index.ts +27 -27
  39. package/components/logo.tsx +81 -81
  40. package/components/mini-chart/index.tsx +7 -7
  41. package/components/mini-chart/mini-chart-props.ts +43 -43
  42. package/components/mini-chart/mini-chart.tsx +85 -85
  43. package/components/mini-chart/wrapper.tsx +23 -23
  44. package/components/not-found/index.tsx +27 -27
  45. package/components/not-found/not-found-content.mdx +5 -5
  46. package/components/root-layout.tsx +71 -71
  47. package/components/scripts.tsx +23 -23
  48. package/conf/index.ts +50 -50
  49. package/environment.d.ts +5 -5
  50. package/next/analytics/fpixel.ts +15 -15
  51. package/next/analytics/google-analytics.ts +13 -13
  52. package/next/analytics/index.ts +3 -3
  53. package/next/analytics/pixel-analytics.tsx +54 -54
  54. package/next/determine-device-mw.ts +16 -16
  55. package/next/font/get-app-router-font-classes.ts +12 -12
  56. package/next/font/load-and-return-lux-next-fonts-on-import.ts +68 -68
  57. package/next/font/next-font-desc.ts +27 -27
  58. package/next/font/pages-router-font-vars.tsx +18 -18
  59. package/next/head-metadata/from-next/metadata-types.ts +158 -158
  60. package/next/head-metadata/from-next/opengraph-types.ts +267 -267
  61. package/next/head-metadata/from-next/twitter-types.ts +92 -92
  62. package/next/head-metadata/index.tsx +208 -208
  63. package/package.json +73 -73
  64. package/server-actions/firebase-app.ts +14 -14
  65. package/server-actions/index.ts +5 -5
  66. package/server-actions/store-contact.ts +51 -51
  67. package/site-def/footer/community.tsx +67 -67
  68. package/site-def/footer/company.ts +37 -37
  69. package/site-def/footer/ecosystem.ts +37 -37
  70. package/site-def/footer/index.tsx +26 -26
  71. package/site-def/footer/legal.ts +28 -28
  72. package/site-def/footer/network.ts +45 -45
  73. package/site-def/footer/svg/warpcast-logo.svg +11 -11
  74. package/site-def/index.ts +2 -2
  75. package/site-def/main-nav.ts +35 -35
  76. package/site-def/site-def.ts +36 -36
  77. package/style/lux-colors.css +85 -85
  78. package/style/lux-global.css +30 -30
  79. package/tailwind/fontFamily.tailwind.lux.ts +18 -18
  80. package/tailwind/index.ts +2 -2
  81. package/tailwind/lux-tw-fonts.ts +39 -39
  82. package/tailwind/tailwind.config.lux-preset.ts +10 -10
  83. package/tsconfig.json +10 -10
  84. package/types/contact-info.ts +10 -10
@@ -1,35 +1,35 @@
1
- import {
2
- Moon as moon,
3
- SunMedium as sun,
4
- Menu as burger,
5
- ArrowUpRight as linkOut,
6
- type XIcon as LucideIcon,
7
- } from 'lucide-react'
8
-
9
- import gitHub from './github'
10
- import bag from './bag-icon'
11
- import logo from './lux-logo'
12
- import youtube from './youtube-logo'
13
- import secureDelivery from './secure-delivery'
14
-
15
- import {
16
- type SocialIconProps,
17
- default as SocialIcon
18
- } from './social-icon'
19
-
20
- export { type LucideIcon as Icon, type SocialIconProps }
21
-
22
- export {
23
- bag,
24
- sun,
25
- moon,
26
- logo,
27
- burger,
28
- gitHub,
29
- linkOut,
30
- youtube,
31
- secureDelivery,
32
- SocialIcon,
33
- }
34
-
35
-
1
+ import {
2
+ Moon as moon,
3
+ SunMedium as sun,
4
+ Menu as burger,
5
+ ArrowUpRight as linkOut,
6
+ type XIcon as LucideIcon,
7
+ } from 'lucide-react'
8
+
9
+ import gitHub from './github'
10
+ import bag from './bag-icon'
11
+ import logo from './lux-logo'
12
+ import youtube from './youtube-logo'
13
+ import secureDelivery from './secure-delivery'
14
+
15
+ import {
16
+ type SocialIconProps,
17
+ default as SocialIcon
18
+ } from './social-icon'
19
+
20
+ export { type LucideIcon as Icon, type SocialIconProps }
21
+
22
+ export {
23
+ bag,
24
+ sun,
25
+ moon,
26
+ logo,
27
+ burger,
28
+ gitHub,
29
+ linkOut,
30
+ youtube,
31
+ secureDelivery,
32
+ SocialIcon,
33
+ }
34
+
35
+
@@ -1,10 +1,10 @@
1
- import React from 'react'
2
- import { type LucideProps } from 'lucide-react'
3
-
4
- const LuxLogo: React.FC<LucideProps> = (props: LucideProps) => (
5
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50" {...props}>
6
- <polygon points="25,46.65 50,3.35 0,3.35" fill="white" stroke='black' strokeWidth={props.strokeWidth}/>
7
- </svg>
8
- )
9
-
10
- export default LuxLogo
1
+ import React from 'react'
2
+ import { type LucideProps } from 'lucide-react'
3
+
4
+ const LuxLogo: React.FC<LucideProps> = (props: LucideProps) => (
5
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50" {...props}>
6
+ <polygon points="25,46.65 50,3.35 0,3.35" fill="white" stroke='black' strokeWidth={props.strokeWidth}/>
7
+ </svg>
8
+ )
9
+
10
+ export default LuxLogo
@@ -1,13 +1,13 @@
1
- import React from 'react'
2
- import { type LucideProps } from 'lucide-react'
3
-
4
- // width="52" height="36"
5
- const SecureDelivery: React.FC<LucideProps> = (props: LucideProps) => (
6
- <svg fill="currentColor" viewBox="0 0 52 36" xmlns="http://www.w3.org/2000/svg" {...props}>
7
- <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" />
8
- <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" />
9
- <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" />
10
- </svg>
11
- )
12
-
13
- export default SecureDelivery
1
+ import React from 'react'
2
+ import { type LucideProps } from 'lucide-react'
3
+
4
+ // width="52" height="36"
5
+ const SecureDelivery: React.FC<LucideProps> = (props: LucideProps) => (
6
+ <svg fill="currentColor" viewBox="0 0 52 36" xmlns="http://www.w3.org/2000/svg" {...props}>
7
+ <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" />
8
+ <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" />
9
+ <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" />
10
+ </svg>
11
+ )
12
+
13
+ export default SecureDelivery
@@ -1,35 +1,35 @@
1
- import React from 'react'
2
-
3
- import { SocialIcon as BaseSocialIcon } from 'react-social-icons'
4
-
5
- import { cn } from '@hanzo/ui/util'
6
- import './social-svg.css'
7
-
8
- interface SocialIconProps {
9
- // one of these: https://github.com/couetilc/react-social-icons/tree/main/db
10
- network: string
11
- size: number
12
- className?: string
13
- }
14
-
15
- const SocialIcon: React.FC<SocialIconProps> = ({
16
- network,
17
- size,
18
- className = ''
19
- }) => (
20
- <BaseSocialIcon
21
- network={network}
22
- as='div'
23
- // This is set up so the enclosing element sets the color.
24
- // For example, something like 'color-foreground hover:color-muted-1'
25
- className={cn('color-inherit', className)}
26
- bgColor='transparent'
27
- fgColor='currentColor'
28
- style={{height: size, width: size}}
29
- />
30
- )
31
-
32
- export {
33
- type SocialIconProps,
34
- SocialIcon as default
35
- }
1
+ import React from 'react'
2
+
3
+ import { SocialIcon as BaseSocialIcon } from 'react-social-icons'
4
+
5
+ import { cn } from '@hanzo/ui/util'
6
+ import './social-svg.css'
7
+
8
+ interface SocialIconProps {
9
+ // one of these: https://github.com/couetilc/react-social-icons/tree/main/db
10
+ network: string
11
+ size: number
12
+ className?: string
13
+ }
14
+
15
+ const SocialIcon: React.FC<SocialIconProps> = ({
16
+ network,
17
+ size,
18
+ className = ''
19
+ }) => (
20
+ <BaseSocialIcon
21
+ network={network}
22
+ as='div'
23
+ // This is set up so the enclosing element sets the color.
24
+ // For example, something like 'color-foreground hover:color-muted-1'
25
+ className={cn('color-inherit', className)}
26
+ bgColor='transparent'
27
+ fgColor='currentColor'
28
+ style={{height: size, width: size}}
29
+ />
30
+ )
31
+
32
+ export {
33
+ type SocialIconProps,
34
+ SocialIcon as default
35
+ }
@@ -1,3 +1,3 @@
1
- .social-icon svg {
2
- transform: scale(1.25);
3
- }
1
+ .social-icon svg {
2
+ transform: scale(1.25);
3
+ }
@@ -1,59 +1,59 @@
1
- import React from 'react'
2
- import { type LucideProps } from 'lucide-react'
3
-
4
- const YouTubeLogo: React.FC<LucideProps> = (props: LucideProps) => (
5
- <svg
6
- viewBox="0 0 256 256"
7
- xmlns="http://www.w3.org/2000/svg"
8
- {...props}
9
- >
10
- <g
11
- style={{
12
- stroke: 'none',
13
- strokeWidth: 0,
14
- strokeDasharray: 'none',
15
- strokeLinecap: 'butt',
16
- strokeLinejoin: 'miter',
17
- strokeMiterlimit: 10,
18
- fill: 'none',
19
- fillRule: 'nonzero',
20
- opacity: 1
21
- }}
22
- transform="translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)"
23
- >
24
- <path
25
- 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"
26
- style={{
27
- stroke: 'none',
28
- strokeWidth: 1,
29
- strokeDasharray: 'none',
30
- strokeLinecap: 'butt',
31
- strokeLinejoin: 'miter',
32
- strokeMiterlimit: 10,
33
- fill: 'red',
34
- fillRule: 'nonzero',
35
- opacity: 1
36
- }}
37
- transform=" matrix(1 0 0 1 0 0) "
38
- strokeLinecap="round"
39
- />
40
- <polygon
41
- points="36,58.5 59.38,45 36,31.5 "
42
- style={{
43
- stroke: 'none',
44
- strokeWidth: 1,
45
- strokeDasharray: 'none',
46
- strokeLinecap: 'butt',
47
- strokeLinejoin: 'miter',
48
- strokeMiterlimit: 10,
49
- fill: 'white',
50
- fillRule: 'nonzero',
51
- opacity: 1
52
- }}
53
- transform="matrix(1 0 0 1 0 0)"
54
- />
55
- </g>
56
- </svg>
57
- )
58
-
59
- export default YouTubeLogo
1
+ import React from 'react'
2
+ import { type LucideProps } from 'lucide-react'
3
+
4
+ const YouTubeLogo: React.FC<LucideProps> = (props: LucideProps) => (
5
+ <svg
6
+ viewBox="0 0 256 256"
7
+ xmlns="http://www.w3.org/2000/svg"
8
+ {...props}
9
+ >
10
+ <g
11
+ style={{
12
+ stroke: 'none',
13
+ strokeWidth: 0,
14
+ strokeDasharray: 'none',
15
+ strokeLinecap: 'butt',
16
+ strokeLinejoin: 'miter',
17
+ strokeMiterlimit: 10,
18
+ fill: 'none',
19
+ fillRule: 'nonzero',
20
+ opacity: 1
21
+ }}
22
+ transform="translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)"
23
+ >
24
+ <path
25
+ 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"
26
+ style={{
27
+ stroke: 'none',
28
+ strokeWidth: 1,
29
+ strokeDasharray: 'none',
30
+ strokeLinecap: 'butt',
31
+ strokeLinejoin: 'miter',
32
+ strokeMiterlimit: 10,
33
+ fill: 'red',
34
+ fillRule: 'nonzero',
35
+ opacity: 1
36
+ }}
37
+ transform=" matrix(1 0 0 1 0 0) "
38
+ strokeLinecap="round"
39
+ />
40
+ <polygon
41
+ points="36,58.5 59.38,45 36,31.5 "
42
+ style={{
43
+ stroke: 'none',
44
+ strokeWidth: 1,
45
+ strokeDasharray: 'none',
46
+ strokeLinecap: 'butt',
47
+ strokeLinejoin: 'miter',
48
+ strokeMiterlimit: 10,
49
+ fill: 'white',
50
+ fillRule: 'nonzero',
51
+ opacity: 1
52
+ }}
53
+ transform="matrix(1 0 0 1 0 0)"
54
+ />
55
+ </g>
56
+ </svg>
57
+ )
58
+
59
+ export default YouTubeLogo
@@ -1,27 +1,27 @@
1
- export { default as AccessCodeInput } from './access-code-input'
2
- export { default as ChatWidget } from './chat-widget'
3
- export { default as ContactDialog } from './contact-dialog'
4
- export { default as Copyright} from './copyright'
5
- export { default as Footer } from './footer'
6
- export { default as Header } from './header'
7
- export * as Icons from './icons'
8
- export { default as Logo } from './logo'
9
- export { default as MiniChart } from './mini-chart'
10
- export { default as NotFound } from './not-found'
11
- export {
12
- default as RootLayout,
13
- viewport as rootLayoutViewport
14
- } from './root-layout'
15
-
16
- export { default as CheckoutPanel } from './commerce/checkout-panel'
17
- export { default as LoginPanel } from './auth/login-panel'
18
- export { default as AuthListener } from './auth/auth-listener'
19
-
20
-
21
- /* PLEASE KEEP
22
- export {
23
- default as HeadMetadata,
24
- getTitleFromTemplateString,
25
- TwitterComponent
26
- } from './head-metadata'
27
- */
1
+ export { default as AccessCodeInput } from './access-code-input'
2
+ export { default as ChatWidget } from './chat-widget'
3
+ export { default as ContactDialog } from './contact-dialog'
4
+ export { default as Copyright} from './copyright'
5
+ export { default as Footer } from './footer'
6
+ export { default as Header } from './header'
7
+ export * as Icons from './icons'
8
+ export { default as Logo } from './logo'
9
+ export { default as MiniChart } from './mini-chart'
10
+ export { default as NotFound } from './not-found'
11
+ export {
12
+ default as RootLayout,
13
+ viewport as rootLayoutViewport
14
+ } from './root-layout'
15
+
16
+ export { default as CheckoutPanel } from './commerce/checkout-panel'
17
+ export { default as LoginPanel } from './auth/login-panel'
18
+ export { default as AuthListener } from './auth/auth-listener'
19
+
20
+
21
+ /* PLEASE KEEP
22
+ export {
23
+ default as HeadMetadata,
24
+ getTitleFromTemplateString,
25
+ TwitterComponent
26
+ } from './head-metadata'
27
+ */
@@ -1,81 +1,81 @@
1
- import React from 'react'
2
- import Link from 'next/link'
3
-
4
- import { type TShirtSize } from '@hanzo/ui/types'
5
- import { cn } from '@hanzo/ui/util'
6
-
7
- import * as Icons from './icons'
8
-
9
- const Logo: React.FC<{
10
- size?: TShirtSize
11
- layout?: 'text-only' | 'logo-only' | 'full'
12
- href?: string
13
- className?: string
14
- spanClassName?: string
15
- }> = ({
16
- size,
17
- href, // no default please!
18
- className='',
19
- spanClassName,
20
- layout='full'
21
- }) => {
22
- let classes: any = {}
23
- const toAdd = (layout === 'logo-only') ? {
24
- span: ' hidden',
25
- icon: ''
26
- } :
27
- (layout === 'text-only') ? {
28
- span: '',
29
- icon: ' hidden'
30
- } :
31
- {
32
- span: '',
33
- icon: ''
34
- }
35
-
36
- if (size === 'lg' || size === 'xl' ) { // for safety
37
- classes.icon = 'h-10 w-10 mr-4 color-inherit' + toAdd.icon
38
- classes.span = 'text-3xl' + toAdd.span
39
- }
40
- // match lux.network
41
- else if (size === 'md') {
42
- classes.icon = 'h-[32px] w-[32px] mr-[12px] color-inherit' + toAdd.icon
43
- classes.span = 'text-[1.8rem]/[1.8rem] tracking-tighter' + toAdd.span
44
- }
45
- else if (size === 'sm' ) {
46
- classes.icon = 'h-6 w-6 mr-2 color-inherit' + toAdd.icon
47
- classes.span = 'text-lg' + toAdd.span
48
- }
49
- // xs
50
- else {
51
- classes.icon = 'h-4 w-4 mr-1 color-inherit' + toAdd.icon
52
- classes.span = 'text-base' + toAdd.span
53
- }
54
-
55
- const outerClasses = 'flex flex-row items-center ' + className
56
- const spanClasses = 'inline-block font-bold font-heading '
57
- + spanClassName
58
- + (href ? ' hover:text-accent ' : ' cursor-default ')
59
- + classes.span
60
-
61
- const Inner: React.FC = () => (<>
62
- <Icons.logo className={classes.icon} />
63
- <span className={cn(spanClasses, ' text-inherit')}>LUX</span>
64
- </>)
65
-
66
-
67
- return (
68
- href ? (
69
- <Link href={href} className={outerClasses} >
70
- <Inner />
71
- </Link>
72
-
73
- ) : (
74
- <span className={outerClasses} >
75
- <Inner />
76
- </span>
77
- )
78
- )
79
- }
80
-
81
- export default Logo
1
+ import React from 'react'
2
+ import Link from 'next/link'
3
+
4
+ import { type TShirtSize } from '@hanzo/ui/types'
5
+ import { cn } from '@hanzo/ui/util'
6
+
7
+ import * as Icons from './icons'
8
+
9
+ const Logo: React.FC<{
10
+ size?: TShirtSize
11
+ layout?: 'text-only' | 'logo-only' | 'full'
12
+ href?: string
13
+ className?: string
14
+ spanClassName?: string
15
+ }> = ({
16
+ size,
17
+ href, // no default please!
18
+ className='',
19
+ spanClassName,
20
+ layout='full'
21
+ }) => {
22
+ let classes: any = {}
23
+ const toAdd = (layout === 'logo-only') ? {
24
+ span: ' hidden',
25
+ icon: ''
26
+ } :
27
+ (layout === 'text-only') ? {
28
+ span: '',
29
+ icon: ' hidden'
30
+ } :
31
+ {
32
+ span: '',
33
+ icon: ''
34
+ }
35
+
36
+ if (size === 'lg' || size === 'xl' ) { // for safety
37
+ classes.icon = 'h-10 w-10 mr-4 color-inherit' + toAdd.icon
38
+ classes.span = 'text-3xl' + toAdd.span
39
+ }
40
+ // match lux.network
41
+ else if (size === 'md') {
42
+ classes.icon = 'h-[32px] w-[32px] mr-[12px] color-inherit' + toAdd.icon
43
+ classes.span = 'text-[1.8rem]/[1.8rem] tracking-tighter' + toAdd.span
44
+ }
45
+ else if (size === 'sm' ) {
46
+ classes.icon = 'h-6 w-6 mr-2 color-inherit' + toAdd.icon
47
+ classes.span = 'text-lg' + toAdd.span
48
+ }
49
+ // xs
50
+ else {
51
+ classes.icon = 'h-4 w-4 mr-1 color-inherit' + toAdd.icon
52
+ classes.span = 'text-base' + toAdd.span
53
+ }
54
+
55
+ const outerClasses = 'flex flex-row items-center ' + className
56
+ const spanClasses = 'inline-block font-bold font-heading '
57
+ + spanClassName
58
+ + (href ? ' hover:text-accent ' : ' cursor-default ')
59
+ + classes.span
60
+
61
+ const Inner: React.FC = () => (<>
62
+ <Icons.logo className={classes.icon} />
63
+ <span className={cn(spanClasses, ' text-inherit')}>LUX</span>
64
+ </>)
65
+
66
+
67
+ return (
68
+ href ? (
69
+ <Link href={href} className={outerClasses} >
70
+ <Inner />
71
+ </Link>
72
+
73
+ ) : (
74
+ <span className={outerClasses} >
75
+ <Inner />
76
+ </span>
77
+ )
78
+ )
79
+ }
80
+
81
+ export default Logo
@@ -1,8 +1,8 @@
1
- import MiniChart from './wrapper'
2
- // import { type MiniChartProps, type MiniChartDateRanges } from './mini-chart-props'
3
-
4
- export {
5
- MiniChart as default,
6
- // type MiniChartProps,
7
- // type MiniChartDateRanges
1
+ import MiniChart from './wrapper'
2
+ // import { type MiniChartProps, type MiniChartDateRanges } from './mini-chart-props'
3
+
4
+ export {
5
+ MiniChart as default,
6
+ // type MiniChartProps,
7
+ // type MiniChartDateRanges
8
8
  }
@@ -1,44 +1,44 @@
1
- import type { CSSProperties } from 'react'
2
-
3
- // https://www.typescriptlang.org/docs/handbook/enums.html#enums-at-runtime
4
- const enum MiniChartDateRangesValues {
5
- '1D',
6
- '1M',
7
- '3M',
8
- '12M',
9
- '60M',
10
- 'ALL',
11
- }
12
-
13
- type MiniChartDateRanges = keyof typeof MiniChartDateRangesValues
14
-
15
- interface MiniChartBaseProps {
16
- symbol: string
17
- exchange?: string
18
- dateRange: MiniChartDateRanges
19
- noTimeScale?: boolean
20
- width?: number | string
21
- height?: number | string
22
- locale?: string
23
- colorTheme?: "light" | "dark"
24
- // @ts-ignore // TODO
25
- lineColor?: CSSProperties["color"]
26
- // @ts-ignore // TODO
27
- topGradientColor?: CSSProperties["color"]
28
- // @ts-ignore // TODO
29
- bottomGradientColor?: CSSProperties["color"]
30
- isTransparent?: boolean
31
- autosize?: boolean
32
- chartOnly?: boolean
33
- largeChartUrl?: string
34
- }
35
-
36
- type MiniChartProps = {
37
- widgetProps: MiniChartBaseProps
38
- containerStyles?: CSSProperties
39
- }
40
-
41
- export {
42
- type MiniChartProps,
43
- type MiniChartDateRanges
1
+ import type { CSSProperties } from 'react'
2
+
3
+ // https://www.typescriptlang.org/docs/handbook/enums.html#enums-at-runtime
4
+ const enum MiniChartDateRangesValues {
5
+ '1D',
6
+ '1M',
7
+ '3M',
8
+ '12M',
9
+ '60M',
10
+ 'ALL',
11
+ }
12
+
13
+ type MiniChartDateRanges = keyof typeof MiniChartDateRangesValues
14
+
15
+ interface MiniChartBaseProps {
16
+ symbol: string
17
+ exchange?: string
18
+ dateRange: MiniChartDateRanges
19
+ noTimeScale?: boolean
20
+ width?: number | string
21
+ height?: number | string
22
+ locale?: string
23
+ colorTheme?: "light" | "dark"
24
+ // @ts-ignore // TODO
25
+ lineColor?: CSSProperties["color"]
26
+ // @ts-ignore // TODO
27
+ topGradientColor?: CSSProperties["color"]
28
+ // @ts-ignore // TODO
29
+ bottomGradientColor?: CSSProperties["color"]
30
+ isTransparent?: boolean
31
+ autosize?: boolean
32
+ chartOnly?: boolean
33
+ largeChartUrl?: string
34
+ }
35
+
36
+ type MiniChartProps = {
37
+ widgetProps: MiniChartBaseProps
38
+ containerStyles?: CSSProperties
39
+ }
40
+
41
+ export {
42
+ type MiniChartProps,
43
+ type MiniChartDateRanges
44
44
  }