@luxfi/core 5.2.12 → 5.2.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/commerce/ui/conf.ts +13 -13
- package/commerce/ui/context.tsx +126 -126
- package/commerce/ui/store.ts +304 -304
- package/components/access-code-input.tsx +71 -71
- package/components/auth/auth-listener.tsx +29 -29
- package/components/auth/auth-token/clear-auth-token.tsx +12 -12
- package/components/auth/auth-token/set-auth-token.tsx +16 -16
- package/components/auth/common-auth-domains.ts +16 -16
- package/components/auth/login-panel.tsx +107 -107
- package/components/back-button.tsx +42 -42
- package/components/chat-widget.tsx +85 -85
- package/components/commerce/add-widget.tsx +20 -20
- package/components/commerce/bag-button.tsx +98 -98
- package/components/commerce/buy-button.tsx +34 -34
- package/components/commerce/checkout-button.tsx +129 -129
- package/components/commerce/checkout-panel/dt-bag-carousel.tsx +36 -36
- package/components/commerce/checkout-panel/dt-checkout-panel.tsx +84 -84
- package/components/commerce/checkout-panel/index.tsx +129 -129
- package/components/commerce/checkout-panel/links-row.tsx +21 -21
- package/components/commerce/checkout-panel/mb-checkout-panel.tsx +54 -54
- package/components/commerce/checkout-panel/steps-indicator.tsx +39 -39
- package/components/commerce/checkout-panel/thank-you.tsx +18 -18
- package/components/commerce/checkout-widget/const.ts +13 -13
- package/components/commerce/checkout-widget/index.tsx +192 -192
- package/components/commerce/checkout-widget/obs-string-set.ts +48 -48
- package/components/commerce/checkout-widget/use-anim-clx-set.ts +58 -58
- package/components/commerce/desktop-bag-popup.tsx +78 -78
- package/components/commerce/desktop-nav-menu.tsx +130 -130
- package/components/commerce/drawer/index.tsx +99 -99
- package/components/commerce/drawer/micro.tsx +144 -144
- package/components/commerce/drawer/shell.tsx +85 -85
- package/components/commerce/mobile-bag-drawer.tsx +51 -51
- package/components/commerce/mobile-login-button.tsx +101 -101
- package/components/commerce/mobile-menu-toggle-button.tsx +35 -35
- package/components/commerce/mobile-nav-menu-ai.tsx +48 -48
- package/components/commerce/mobile-nav-menu-item.tsx +49 -49
- package/components/commerce/mobile-nav-menu.tsx +101 -101
- package/components/contact-dialog/contact-form.tsx +113 -113
- package/components/contact-dialog/disclaimer.tsx +13 -13
- package/components/contact-dialog/index.tsx +64 -64
- package/components/copyright.tsx +21 -21
- package/components/drawer-margin.tsx +25 -25
- package/components/footer.tsx +77 -77
- package/components/header/desktop.tsx +50 -50
- package/components/header/index.tsx +52 -52
- package/components/header/mobile.tsx +163 -163
- package/components/header/theme-toggle.tsx +26 -26
- package/components/icons/24k-gold-card.tsx +43 -43
- package/components/icons/ai-chat-act.tsx +47 -47
- package/components/icons/ai-chat.tsx +29 -29
- package/components/icons/anodized-titanium.tsx +45 -45
- package/components/icons/avatar.tsx +11 -11
- package/components/icons/bag-icon.tsx +10 -10
- package/components/icons/blog-act.tsx +14 -14
- package/components/icons/blog.tsx +20 -20
- package/components/icons/bridge-act.tsx +18 -18
- package/components/icons/bridge.tsx +68 -68
- package/components/icons/changelog-act.tsx +15 -15
- package/components/icons/changelog.tsx +21 -21
- package/components/icons/chrome.tsx +45 -45
- package/components/icons/coins-act.tsx +29 -29
- package/components/icons/coins.tsx +20 -20
- package/components/icons/compare-cards-act.tsx +30 -30
- package/components/icons/compare-cards.tsx +21 -21
- package/components/icons/credit-act.tsx +29 -29
- package/components/icons/credit.tsx +20 -20
- package/components/icons/customer-support-act.tsx +27 -27
- package/components/icons/customer-support.tsx +21 -21
- package/components/icons/customers-act.tsx +65 -65
- package/components/icons/customers.tsx +33 -33
- package/components/icons/developer-docs-act.tsx +26 -26
- package/components/icons/developer-docs.tsx +20 -20
- package/components/icons/exchange-act.tsx +27 -27
- package/components/icons/exchange.tsx +21 -21
- package/components/icons/explorer-act.tsx +27 -27
- package/components/icons/explorer.tsx +22 -22
- package/components/icons/faqs-act.tsx +27 -27
- package/components/icons/faqs.tsx +21 -21
- package/components/icons/github.tsx +14 -14
- package/components/icons/guides-act.tsx +26 -26
- package/components/icons/guides.tsx +21 -21
- package/components/icons/gun-metal.tsx +44 -44
- package/components/icons/index.tsx +43 -43
- package/components/icons/integrations-act.tsx +41 -41
- package/components/icons/integrations.tsx +25 -25
- package/components/icons/irradescent.tsx +41 -41
- package/components/icons/launch-subnet.tsx +21 -21
- package/components/icons/launchsubnet-act.tsx +29 -29
- package/components/icons/left-arrow.tsx +11 -11
- package/components/icons/lux-finance-act.tsx +34 -34
- package/components/icons/lux-finance.tsx +23 -23
- package/components/icons/lux-logo.tsx +10 -10
- package/components/icons/lux-pass-act.tsx +41 -41
- package/components/icons/lux-pass.tsx +25 -25
- package/components/icons/lux-quests-act.tsx +15 -15
- package/components/icons/lux-quests.tsx +21 -21
- package/components/icons/market-act.tsx +39 -39
- package/components/icons/market.tsx +24 -24
- package/components/icons/mirrored-titanium.tsx +46 -46
- package/components/icons/more-benefits-act.tsx +29 -29
- package/components/icons/more-benefits.tsx +21 -21
- package/components/icons/open-source-act.tsx +41 -41
- package/components/icons/open-source.tsx +26 -26
- package/components/icons/right-arrow.tsx +10 -10
- package/components/icons/safe-act.tsx +77 -77
- package/components/icons/safe.tsx +37 -37
- package/components/icons/search.tsx +12 -12
- package/components/icons/secure-delivery.tsx +13 -13
- package/components/icons/shop-act.tsx +29 -29
- package/components/icons/shop.tsx +20 -20
- package/components/icons/social-icon.tsx +35 -35
- package/components/icons/social-svg.css +3 -3
- package/components/icons/sterling-silver-card.tsx +44 -44
- package/components/icons/templates-act.tsx +29 -29
- package/components/icons/templates.tsx +21 -21
- package/components/icons/validators-act.tsx +42 -42
- package/components/icons/validators.tsx +41 -41
- package/components/icons/view-all-card-act.tsx +28 -28
- package/components/icons/view-all-card.tsx +20 -20
- package/components/icons/wallet-act.tsx +29 -29
- package/components/icons/wallet.tsx +20 -20
- package/components/icons/warpcast.tsx +58 -58
- package/components/icons/youtube-logo.tsx +59 -59
- package/components/index.ts +27 -27
- package/components/logo.tsx +89 -89
- package/components/main.tsx +27 -27
- package/components/mini-chart/index.tsx +7 -7
- package/components/mini-chart/mini-chart-props.ts +43 -43
- package/components/mini-chart/mini-chart.tsx +85 -85
- package/components/mini-chart/wrapper.tsx +23 -23
- package/components/not-found/index.tsx +28 -28
- package/components/not-found/not-found-content.mdx +5 -5
- package/components/scripts.tsx +24 -24
- package/components/tooltip.tsx +31 -31
- package/environment.d.ts +5 -5
- package/next/analytics/fpixel.ts +15 -15
- package/next/analytics/google-analytics.ts +13 -13
- package/next/analytics/index.ts +3 -3
- package/next/analytics/pixel-analytics.tsx +54 -54
- package/next/font/get-app-router-font-classes.ts +12 -12
- package/next/font/load-and-return-lux-next-fonts-on-import.ts +68 -68
- package/next/font/next-font-desc.ts +27 -27
- package/next/font/pages-router-font-vars.tsx +18 -18
- package/next/head-metadata/from-next/metadata-types.ts +158 -158
- package/next/head-metadata/from-next/opengraph-types.ts +267 -267
- package/next/head-metadata/from-next/twitter-types.ts +92 -92
- package/next/head-metadata/index.tsx +208 -208
- package/next/middleware/determine-device-mw.ts +16 -16
- package/package.json +79 -79
- package/root-layout/WHY_THIS_IS_SEPARATE.txt +1 -1
- package/root-layout/index.tsx +112 -112
- package/server-actions/firebase-app.ts +14 -14
- package/server-actions/index.ts +5 -5
- package/server-actions/store-contact.ts +51 -51
- package/site-def/footer/community.tsx +67 -67
- package/site-def/footer/company.ts +37 -37
- package/site-def/footer/ecosystem.ts +37 -37
- package/site-def/footer/index.tsx +26 -26
- package/site-def/footer/legal.ts +28 -28
- package/site-def/footer/network.ts +45 -45
- package/site-def/footer/svg/warpcast-logo.svg +11 -11
- package/site-def/index.ts +2 -2
- package/site-def/main-nav.tsx +458 -458
- package/style/cart-animation.css +29 -29
- package/style/checkout-animation.css +23 -23
- package/style/drawer-handle-overrides.css +160 -160
- package/style/lux-colors.css +85 -85
- package/style/lux-global.css +47 -47
- package/tailwind/fontFamily.tailwind.lux.ts +18 -18
- package/tailwind/index.ts +2 -2
- package/tailwind/lux-tw-fonts.ts +39 -39
- package/tailwind/tailwind.config.lux-preset.ts +10 -10
- package/tsconfig.json +15 -15
- package/types/chatbot-config.ts +6 -6
- package/types/chatbot-suggested-question.ts +7 -7
- package/types/contact-info.ts +10 -10
- package/types/index.ts +4 -4
- package/types/site-def.ts +43 -43
|
@@ -1,25 +1,25 @@
|
|
|
1
|
-
'use client'
|
|
2
|
-
import React from 'react'
|
|
3
|
-
|
|
4
|
-
import { cn } from '@hanzo/ui/util'
|
|
5
|
-
import { useCommerceDrawer } from '@luxfi/core/commerce'
|
|
6
|
-
import { observer } from 'mobx-react-lite'
|
|
7
|
-
|
|
8
|
-
const DrawerMargin: React.FC<{
|
|
9
|
-
clx?: string
|
|
10
|
-
}> = observer(({
|
|
11
|
-
clx=''
|
|
12
|
-
}) => {
|
|
13
|
-
|
|
14
|
-
const drawer = useCommerceDrawer()
|
|
15
|
-
return (
|
|
16
|
-
<div
|
|
17
|
-
className={cn('transition-height', clx)}
|
|
18
|
-
style={{
|
|
19
|
-
height: drawer.state === 'micro' ? drawer.microHeight : 0
|
|
20
|
-
}}
|
|
21
|
-
/>
|
|
22
|
-
)
|
|
23
|
-
})
|
|
24
|
-
|
|
25
|
-
export default DrawerMargin
|
|
1
|
+
'use client'
|
|
2
|
+
import React from 'react'
|
|
3
|
+
|
|
4
|
+
import { cn } from '@hanzo/ui/util'
|
|
5
|
+
import { useCommerceDrawer } from '@luxfi/core/commerce'
|
|
6
|
+
import { observer } from 'mobx-react-lite'
|
|
7
|
+
|
|
8
|
+
const DrawerMargin: React.FC<{
|
|
9
|
+
clx?: string
|
|
10
|
+
}> = observer(({
|
|
11
|
+
clx=''
|
|
12
|
+
}) => {
|
|
13
|
+
|
|
14
|
+
const drawer = useCommerceDrawer()
|
|
15
|
+
return (
|
|
16
|
+
<div
|
|
17
|
+
className={cn('transition-height', clx)}
|
|
18
|
+
style={{
|
|
19
|
+
height: drawer.state === 'micro' ? drawer.microHeight : 0
|
|
20
|
+
}}
|
|
21
|
+
/>
|
|
22
|
+
)
|
|
23
|
+
})
|
|
24
|
+
|
|
25
|
+
export default DrawerMargin
|
package/components/footer.tsx
CHANGED
|
@@ -1,78 +1,78 @@
|
|
|
1
|
-
import React from 'react'
|
|
2
|
-
|
|
3
|
-
import type { LinkDef } from '@hanzo/ui/types'
|
|
4
|
-
import { NavItems } from '@hanzo/ui/primitives'
|
|
5
|
-
import { cn } from '@hanzo/ui/util'
|
|
6
|
-
|
|
7
|
-
import Copyright from './copyright'
|
|
8
|
-
import type { SiteDef } from '../site-def'
|
|
9
|
-
import { legal } from '../site-def/footer/legal'
|
|
10
|
-
import Logo from './logo'
|
|
11
|
-
|
|
12
|
-
const Footer: React.FC<{
|
|
13
|
-
siteDef: SiteDef,
|
|
14
|
-
className?: string,
|
|
15
|
-
noHorizPadding?: boolean
|
|
16
|
-
}> = ({
|
|
17
|
-
siteDef,
|
|
18
|
-
className='',
|
|
19
|
-
noHorizPadding=false
|
|
20
|
-
}) => {
|
|
21
|
-
|
|
22
|
-
const { footer, aboveCopyright } = siteDef
|
|
23
|
-
const smGridCols = Math.floor(footer.length/2)
|
|
24
|
-
const smGridColsClx = `sm:grid-cols-${smGridCols} `
|
|
25
|
-
const _aboveCopyright = (typeof aboveCopyright === 'undefined') ? legal : aboveCopyright
|
|
26
|
-
|
|
27
|
-
return (
|
|
28
|
-
<footer className={cn('grow flex flex-col justify-between gap-6 pb-[2vh]', className)}>
|
|
29
|
-
<div className={
|
|
30
|
-
(noHorizPadding ? '' : 'px-5 md:px-8 ') +
|
|
31
|
-
'grid grid-cols-2 gap-4 gap-y-6 md:gap-x-6 lg:gap-8 ' + smGridColsClx +
|
|
32
|
-
'md:w-full sm:justify-items-center md:mx-0 lg:w-full max-w-screen-2xl ' +
|
|
33
|
-
'md:flex md:flex-row md:justify-between '
|
|
34
|
-
}>
|
|
35
|
-
<div className='hidden lg:flex flex-col' key={0}>
|
|
36
|
-
<Logo size='md' variant='text-only' />
|
|
37
|
-
</div>
|
|
38
|
-
{footer.map((defs: LinkDef[], index: number) => {
|
|
39
|
-
|
|
40
|
-
const xsColSpanClx = ((index === footer.length - 1) && (footer.length % 2 === 1)) ?
|
|
41
|
-
'xs:col-span-2 xs:mx-auto md:col-span-1 md:mx-0 ' : ''
|
|
42
|
-
|
|
43
|
-
return (
|
|
44
|
-
<NavItems
|
|
45
|
-
items={defs}
|
|
46
|
-
currentAs={siteDef.currentAs}
|
|
47
|
-
as='nav'
|
|
48
|
-
className={cn('sm:min-w-[150px] md:min-w-0 flex flex-col justify-start items-start ' +
|
|
49
|
-
'gap-[11px] sm:gap-[12px] md:gap-[15px] ',
|
|
50
|
-
xsColSpanClx
|
|
51
|
-
)}
|
|
52
|
-
key={index + 1}
|
|
53
|
-
itemClx={(def: LinkDef) => ((def.variant === 'linkFG') ?
|
|
54
|
-
'font-nav text-[15px]/[1.3] font-medium text-foreground tracking-normal'
|
|
55
|
-
:
|
|
56
|
-
'text-[15px]/[1.1] font-normal tracking-[0.2px] text-muted-1'
|
|
57
|
-
)}
|
|
58
|
-
/>
|
|
59
|
-
)
|
|
60
|
-
})}
|
|
61
|
-
</div>
|
|
62
|
-
<div className='md:mt-[2vh]'>
|
|
63
|
-
{_aboveCopyright.length > 0 && (
|
|
64
|
-
<NavItems
|
|
65
|
-
items={_aboveCopyright}
|
|
66
|
-
as='div'
|
|
67
|
-
className={'flex flex-row justify-center gap-4 mb-2'}
|
|
68
|
-
itemClx={'text-sm text-center text-muted-2 underline hover:text-foreground'}
|
|
69
|
-
/>
|
|
70
|
-
)}
|
|
71
|
-
<Copyright className='text-sm text-center text-muted-3'/>
|
|
72
|
-
</div>
|
|
73
|
-
</footer>
|
|
74
|
-
)
|
|
75
|
-
}
|
|
76
|
-
|
|
77
|
-
export default Footer
|
|
1
|
+
import React from 'react'
|
|
2
|
+
|
|
3
|
+
import type { LinkDef } from '@hanzo/ui/types'
|
|
4
|
+
import { NavItems } from '@hanzo/ui/primitives'
|
|
5
|
+
import { cn } from '@hanzo/ui/util'
|
|
6
|
+
|
|
7
|
+
import Copyright from './copyright'
|
|
8
|
+
import type { SiteDef } from '../site-def'
|
|
9
|
+
import { legal } from '../site-def/footer/legal'
|
|
10
|
+
import Logo from './logo'
|
|
11
|
+
|
|
12
|
+
const Footer: React.FC<{
|
|
13
|
+
siteDef: SiteDef,
|
|
14
|
+
className?: string,
|
|
15
|
+
noHorizPadding?: boolean
|
|
16
|
+
}> = ({
|
|
17
|
+
siteDef,
|
|
18
|
+
className='',
|
|
19
|
+
noHorizPadding=false
|
|
20
|
+
}) => {
|
|
21
|
+
|
|
22
|
+
const { footer, aboveCopyright } = siteDef
|
|
23
|
+
const smGridCols = Math.floor(footer.length/2)
|
|
24
|
+
const smGridColsClx = `sm:grid-cols-${smGridCols} `
|
|
25
|
+
const _aboveCopyright = (typeof aboveCopyright === 'undefined') ? legal : aboveCopyright
|
|
26
|
+
|
|
27
|
+
return (
|
|
28
|
+
<footer className={cn('grow flex flex-col justify-between gap-6 pb-[2vh]', className)}>
|
|
29
|
+
<div className={
|
|
30
|
+
(noHorizPadding ? '' : 'px-5 md:px-8 ') +
|
|
31
|
+
'grid grid-cols-2 gap-4 gap-y-6 md:gap-x-6 lg:gap-8 ' + smGridColsClx +
|
|
32
|
+
'md:w-full sm:justify-items-center md:mx-0 lg:w-full max-w-screen-2xl ' +
|
|
33
|
+
'md:flex md:flex-row md:justify-between '
|
|
34
|
+
}>
|
|
35
|
+
<div className='hidden lg:flex flex-col' key={0}>
|
|
36
|
+
<Logo size='md' variant='text-only' />
|
|
37
|
+
</div>
|
|
38
|
+
{footer.map((defs: LinkDef[], index: number) => {
|
|
39
|
+
|
|
40
|
+
const xsColSpanClx = ((index === footer.length - 1) && (footer.length % 2 === 1)) ?
|
|
41
|
+
'xs:col-span-2 xs:mx-auto md:col-span-1 md:mx-0 ' : ''
|
|
42
|
+
|
|
43
|
+
return (
|
|
44
|
+
<NavItems
|
|
45
|
+
items={defs}
|
|
46
|
+
currentAs={siteDef.currentAs}
|
|
47
|
+
as='nav'
|
|
48
|
+
className={cn('sm:min-w-[150px] md:min-w-0 flex flex-col justify-start items-start ' +
|
|
49
|
+
'gap-[11px] sm:gap-[12px] md:gap-[15px] ',
|
|
50
|
+
xsColSpanClx
|
|
51
|
+
)}
|
|
52
|
+
key={index + 1}
|
|
53
|
+
itemClx={(def: LinkDef) => ((def.variant === 'linkFG') ?
|
|
54
|
+
'font-nav text-[15px]/[1.3] font-medium text-foreground tracking-normal'
|
|
55
|
+
:
|
|
56
|
+
'text-[15px]/[1.1] font-normal tracking-[0.2px] text-muted-1'
|
|
57
|
+
)}
|
|
58
|
+
/>
|
|
59
|
+
)
|
|
60
|
+
})}
|
|
61
|
+
</div>
|
|
62
|
+
<div className='md:mt-[2vh]'>
|
|
63
|
+
{_aboveCopyright.length > 0 && (
|
|
64
|
+
<NavItems
|
|
65
|
+
items={_aboveCopyright}
|
|
66
|
+
as='div'
|
|
67
|
+
className={'flex flex-row justify-center gap-4 mb-2'}
|
|
68
|
+
itemClx={'text-sm text-center text-muted-2 underline hover:text-foreground'}
|
|
69
|
+
/>
|
|
70
|
+
)}
|
|
71
|
+
<Copyright className='text-sm text-center text-muted-3'/>
|
|
72
|
+
</div>
|
|
73
|
+
</footer>
|
|
74
|
+
)
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
export default Footer
|
|
78
78
|
// flex flex-col justify-between gap-6
|
|
@@ -1,50 +1,50 @@
|
|
|
1
|
-
import React from 'react'
|
|
2
|
-
|
|
3
|
-
import { cn } from '@hanzo/ui/util'
|
|
4
|
-
import { AuthWidget } from '@hanzo/auth/components'
|
|
5
|
-
|
|
6
|
-
import { Logo } from '..'
|
|
7
|
-
|
|
8
|
-
import DesktopBagPopup from '../commerce/desktop-bag-popup'
|
|
9
|
-
import BagButton from '../commerce/bag-button'
|
|
10
|
-
import DesktopNav from '../commerce/desktop-nav-menu'
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
import type { LinkDef } from '@hanzo/ui/types'
|
|
14
|
-
|
|
15
|
-
const DesktopHeader: React.FC<{
|
|
16
|
-
currentAs: string | undefined
|
|
17
|
-
links: LinkDef[]
|
|
18
|
-
className?: string
|
|
19
|
-
}> = ({
|
|
20
|
-
currentAs,
|
|
21
|
-
links,
|
|
22
|
-
className = ''
|
|
23
|
-
}) => {
|
|
24
|
-
|
|
25
|
-
// TODO move 13px into a size class and configure twMerge to recognize say, 'text-size-nav'
|
|
26
|
-
// (vs be beat out by 'text-color-nav')
|
|
27
|
-
return (
|
|
28
|
-
<header className={cn('bg-background fixed z-header top-0 left-0 right-0', className)} >
|
|
29
|
-
{/* md or larger */}
|
|
30
|
-
<div className={
|
|
31
|
-
'flex flex-row h-[80px] items-center justify-between ' +
|
|
32
|
-
'px-[8px] w-full mx-auto max-w-screen'
|
|
33
|
-
}>
|
|
34
|
-
<Logo size='md' href='/' outerClx='hidden lg:flex' key='two' variant='text-only' />
|
|
35
|
-
<Logo size='sm' href='/' outerClx='hidden md:flex lg:hidden' key='one' variant='text-only' />
|
|
36
|
-
{/* md or larger */}
|
|
37
|
-
<div className='flex w-full gap-4 items-center justify-between lg:ml-22'>
|
|
38
|
-
<DesktopNav links={links} />
|
|
39
|
-
<div className='flex items-center'>
|
|
40
|
-
<DesktopBagPopup popupClx='w-[340px]' trigger={<BagButton className='text-primary -mr-[3px] lg:min-w-0' />} />
|
|
41
|
-
<AuthWidget />
|
|
42
|
-
</div>
|
|
43
|
-
</div>
|
|
44
|
-
</div>
|
|
45
|
-
</header>
|
|
46
|
-
)
|
|
47
|
-
}
|
|
48
|
-
|
|
49
|
-
export default DesktopHeader
|
|
50
|
-
|
|
1
|
+
import React from 'react'
|
|
2
|
+
|
|
3
|
+
import { cn } from '@hanzo/ui/util'
|
|
4
|
+
import { AuthWidget } from '@hanzo/auth/components'
|
|
5
|
+
|
|
6
|
+
import { Logo } from '..'
|
|
7
|
+
|
|
8
|
+
import DesktopBagPopup from '../commerce/desktop-bag-popup'
|
|
9
|
+
import BagButton from '../commerce/bag-button'
|
|
10
|
+
import DesktopNav from '../commerce/desktop-nav-menu'
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
import type { LinkDef } from '@hanzo/ui/types'
|
|
14
|
+
|
|
15
|
+
const DesktopHeader: React.FC<{
|
|
16
|
+
currentAs: string | undefined
|
|
17
|
+
links: LinkDef[]
|
|
18
|
+
className?: string
|
|
19
|
+
}> = ({
|
|
20
|
+
currentAs,
|
|
21
|
+
links,
|
|
22
|
+
className = ''
|
|
23
|
+
}) => {
|
|
24
|
+
|
|
25
|
+
// TODO move 13px into a size class and configure twMerge to recognize say, 'text-size-nav'
|
|
26
|
+
// (vs be beat out by 'text-color-nav')
|
|
27
|
+
return (
|
|
28
|
+
<header className={cn('bg-background fixed z-header top-0 left-0 right-0', className)} >
|
|
29
|
+
{/* md or larger */}
|
|
30
|
+
<div className={
|
|
31
|
+
'flex flex-row h-[80px] items-center justify-between ' +
|
|
32
|
+
'px-[8px] w-full mx-auto max-w-screen'
|
|
33
|
+
}>
|
|
34
|
+
<Logo size='md' href='/' outerClx='hidden lg:flex' key='two' variant='text-only' />
|
|
35
|
+
<Logo size='sm' href='/' outerClx='hidden md:flex lg:hidden' key='one' variant='text-only' />
|
|
36
|
+
{/* md or larger */}
|
|
37
|
+
<div className='flex w-full gap-4 items-center justify-between lg:ml-22'>
|
|
38
|
+
<DesktopNav links={links} />
|
|
39
|
+
<div className='flex items-center'>
|
|
40
|
+
<DesktopBagPopup popupClx='w-[340px]' trigger={<BagButton className='text-primary -mr-[3px] lg:min-w-0' />} />
|
|
41
|
+
<AuthWidget />
|
|
42
|
+
</div>
|
|
43
|
+
</div>
|
|
44
|
+
</div>
|
|
45
|
+
</header>
|
|
46
|
+
)
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
export default DesktopHeader
|
|
50
|
+
|
|
@@ -1,52 +1,52 @@
|
|
|
1
|
-
'use client'
|
|
2
|
-
import React from 'react'
|
|
3
|
-
|
|
4
|
-
import type { SiteDef } from '../../site-def'
|
|
5
|
-
|
|
6
|
-
import DesktopHeader from './desktop'
|
|
7
|
-
import MobileHeader from './mobile'
|
|
8
|
-
import { cn } from '@hanzo/ui/util'
|
|
9
|
-
import { ChatWidget } from '../../components'
|
|
10
|
-
|
|
11
|
-
const Header: React.FC<{
|
|
12
|
-
siteDef: SiteDef
|
|
13
|
-
className?: string
|
|
14
|
-
}> = ({
|
|
15
|
-
siteDef,
|
|
16
|
-
className = ''
|
|
17
|
-
}) => {
|
|
18
|
-
|
|
19
|
-
// TODO
|
|
20
|
-
const [open, setOpen] = React.useState<boolean>(false);
|
|
21
|
-
|
|
22
|
-
const { nav: { common, featured }, currentAs } = siteDef
|
|
23
|
-
const links = (featured) ? [...common, ...featured] : common
|
|
24
|
-
const isDesktopView = (): boolean => {
|
|
25
|
-
if (typeof window === 'undefined') return false
|
|
26
|
-
return window.innerWidth > 768
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
return (<>
|
|
30
|
-
<DesktopHeader
|
|
31
|
-
className={cn(className, 'hidden md:flex')}
|
|
32
|
-
links={links}
|
|
33
|
-
currentAs={currentAs}
|
|
34
|
-
/>
|
|
35
|
-
<MobileHeader
|
|
36
|
-
className={cn(className, 'md:hidden')}
|
|
37
|
-
links={links}
|
|
38
|
-
currentAs={currentAs}
|
|
39
|
-
setChatbotOpen={setOpen}
|
|
40
|
-
/>
|
|
41
|
-
{isDesktopView() && (
|
|
42
|
-
<ChatWidget
|
|
43
|
-
title='LUX'
|
|
44
|
-
subtitle='AI'
|
|
45
|
-
chatbotUrl='https://lux.chat/iframe'
|
|
46
|
-
suggestedQuestions={siteDef.chatbot?.suggestedQuestions ?? []}
|
|
47
|
-
/>
|
|
48
|
-
)}
|
|
49
|
-
</>)
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
export default Header
|
|
1
|
+
'use client'
|
|
2
|
+
import React from 'react'
|
|
3
|
+
|
|
4
|
+
import type { SiteDef } from '../../site-def'
|
|
5
|
+
|
|
6
|
+
import DesktopHeader from './desktop'
|
|
7
|
+
import MobileHeader from './mobile'
|
|
8
|
+
import { cn } from '@hanzo/ui/util'
|
|
9
|
+
import { ChatWidget } from '../../components'
|
|
10
|
+
|
|
11
|
+
const Header: React.FC<{
|
|
12
|
+
siteDef: SiteDef
|
|
13
|
+
className?: string
|
|
14
|
+
}> = ({
|
|
15
|
+
siteDef,
|
|
16
|
+
className = ''
|
|
17
|
+
}) => {
|
|
18
|
+
|
|
19
|
+
// TODO
|
|
20
|
+
const [open, setOpen] = React.useState<boolean>(false);
|
|
21
|
+
|
|
22
|
+
const { nav: { common, featured }, currentAs } = siteDef
|
|
23
|
+
const links = (featured) ? [...common, ...featured] : common
|
|
24
|
+
const isDesktopView = (): boolean => {
|
|
25
|
+
if (typeof window === 'undefined') return false
|
|
26
|
+
return window.innerWidth > 768
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
return (<>
|
|
30
|
+
<DesktopHeader
|
|
31
|
+
className={cn(className, 'hidden md:flex')}
|
|
32
|
+
links={links}
|
|
33
|
+
currentAs={currentAs}
|
|
34
|
+
/>
|
|
35
|
+
<MobileHeader
|
|
36
|
+
className={cn(className, 'md:hidden')}
|
|
37
|
+
links={links}
|
|
38
|
+
currentAs={currentAs}
|
|
39
|
+
setChatbotOpen={setOpen}
|
|
40
|
+
/>
|
|
41
|
+
{isDesktopView() && (
|
|
42
|
+
<ChatWidget
|
|
43
|
+
title='LUX'
|
|
44
|
+
subtitle='AI'
|
|
45
|
+
chatbotUrl='https://lux.chat/iframe'
|
|
46
|
+
suggestedQuestions={siteDef.chatbot?.suggestedQuestions ?? []}
|
|
47
|
+
/>
|
|
48
|
+
)}
|
|
49
|
+
</>)
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
export default Header
|