@luxfi/core 4.4.14 → 4.4.16
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/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 +103 -98
- package/components/chat-widget.tsx +77 -77
- package/components/commerce/bag-button.tsx +67 -67
- package/components/commerce/checkout-panel/close-button.tsx +26 -26
- package/components/commerce/checkout-panel/dt-bag-carousel.tsx +36 -36
- package/components/commerce/checkout-panel/dt-checkout-panel.tsx +66 -66
- package/components/commerce/checkout-panel/index.tsx +123 -123
- package/components/commerce/checkout-panel/links-row.tsx +21 -21
- package/components/commerce/checkout-panel/mb-checkout-panel.tsx +55 -55
- package/components/commerce/checkout-panel/steps-indicator.tsx +39 -39
- package/components/commerce/checkout-panel/thank-you.tsx +18 -18
- package/components/commerce/desktop-bag-popup.tsx +78 -78
- package/components/commerce/mobile-bag-drawer.tsx +51 -51
- package/components/commerce/mobile-menu-toggle-button.tsx +35 -35
- package/components/commerce/mobile-nav-menu.tsx +64 -64
- package/components/contact-dialog/contact-form.tsx +112 -112
- package/components/contact-dialog/disclaimer.tsx +13 -13
- package/components/contact-dialog/index.tsx +64 -64
- package/components/copyright.tsx +21 -21
- package/components/footer.tsx +77 -77
- package/components/header/desktop.tsx +54 -54
- package/components/header/index.tsx +26 -26
- package/components/header/mobile.tsx +161 -161
- package/components/header/theme-toggle.tsx +26 -26
- package/components/icons/bag-icon.tsx +10 -10
- package/components/icons/github.tsx +14 -14
- package/components/icons/index.tsx +35 -35
- package/components/icons/lux-logo.tsx +10 -10
- package/components/icons/secure-delivery.tsx +13 -13
- package/components/icons/social-icon.tsx +35 -35
- package/components/icons/social-svg.css +3 -3
- package/components/icons/youtube-logo.tsx +59 -59
- package/components/index.ts +27 -27
- package/components/logo.tsx +81 -81
- 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 +27 -27
- package/components/not-found/not-found-content.mdx +5 -5
- package/components/root-layout.tsx +71 -71
- package/components/scripts.tsx +23 -23
- package/conf/index.ts +50 -50
- 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/determine-device-mw.ts +16 -16
- 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/package.json +73 -73
- 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.ts +35 -35
- package/site-def/site-def.ts +36 -36
- package/style/lux-colors.css +85 -85
- package/style/lux-global.css +30 -30
- 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 +10 -10
- package/types/contact-info.ts +10 -10
package/conf/index.ts
CHANGED
@@ -1,50 +1,50 @@
|
|
1
|
-
import type { SelectionUISpecifier } from '@hanzo/commerce/types'
|
2
|
-
|
3
|
-
export const selectionUISpecifiers = {
|
4
|
-
|
5
|
-
'LXM-CN': {
|
6
|
-
singleFamily: {
|
7
|
-
type: 'carousel',
|
8
|
-
options: {
|
9
|
-
familyTitle: 'long',
|
10
|
-
showByline: false,
|
11
|
-
showPrice: true,
|
12
|
-
}
|
13
|
-
}
|
14
|
-
},
|
15
|
-
'LXM-FC': {
|
16
|
-
singleFamily: {
|
17
|
-
type: 'carousel',
|
18
|
-
options: {
|
19
|
-
//showQuantity: true
|
20
|
-
}
|
21
|
-
}
|
22
|
-
},
|
23
|
-
'LXM-CR': {
|
24
|
-
multiFamily: {
|
25
|
-
type: 'all-variants-carousel',
|
26
|
-
selectorOptions: {
|
27
|
-
showParentTitle: false,
|
28
|
-
showItemSwatches: true
|
29
|
-
},
|
30
|
-
itemOptions: {
|
31
|
-
familyTitle: 'long',
|
32
|
-
showFamilyByline: true,
|
33
|
-
showPrice: false,
|
34
|
-
}
|
35
|
-
}
|
36
|
-
},
|
37
|
-
'LXM-AG': {
|
38
|
-
multiFamily: {
|
39
|
-
type: 'all-variants-carousel',
|
40
|
-
selectorOptions: {
|
41
|
-
showParentTitle: true,
|
42
|
-
showItemSwatches: false
|
43
|
-
},
|
44
|
-
itemOptions: {
|
45
|
-
familyTitle: 'long',
|
46
|
-
}
|
47
|
-
}
|
48
|
-
},
|
49
|
-
|
50
|
-
} satisfies Record<string, SelectionUISpecifier>
|
1
|
+
import type { SelectionUISpecifier } from '@hanzo/commerce/types'
|
2
|
+
|
3
|
+
export const selectionUISpecifiers = {
|
4
|
+
|
5
|
+
'LXM-CN': {
|
6
|
+
singleFamily: {
|
7
|
+
type: 'carousel',
|
8
|
+
options: {
|
9
|
+
familyTitle: 'long',
|
10
|
+
showByline: false,
|
11
|
+
showPrice: true,
|
12
|
+
}
|
13
|
+
}
|
14
|
+
},
|
15
|
+
'LXM-FC': {
|
16
|
+
singleFamily: {
|
17
|
+
type: 'carousel',
|
18
|
+
options: {
|
19
|
+
//showQuantity: true
|
20
|
+
}
|
21
|
+
}
|
22
|
+
},
|
23
|
+
'LXM-CR': {
|
24
|
+
multiFamily: {
|
25
|
+
type: 'all-variants-carousel',
|
26
|
+
selectorOptions: {
|
27
|
+
showParentTitle: false,
|
28
|
+
showItemSwatches: true
|
29
|
+
},
|
30
|
+
itemOptions: {
|
31
|
+
familyTitle: 'long',
|
32
|
+
showFamilyByline: true,
|
33
|
+
showPrice: false,
|
34
|
+
}
|
35
|
+
}
|
36
|
+
},
|
37
|
+
'LXM-AG': {
|
38
|
+
multiFamily: {
|
39
|
+
type: 'all-variants-carousel',
|
40
|
+
selectorOptions: {
|
41
|
+
showParentTitle: true,
|
42
|
+
showItemSwatches: false
|
43
|
+
},
|
44
|
+
itemOptions: {
|
45
|
+
familyTitle: 'long',
|
46
|
+
}
|
47
|
+
}
|
48
|
+
},
|
49
|
+
|
50
|
+
} satisfies Record<string, SelectionUISpecifier>
|
package/environment.d.ts
CHANGED
@@ -1,6 +1,6 @@
|
|
1
|
-
namespace NodeJS {
|
2
|
-
interface ProcessEnv {
|
3
|
-
NEXT_PUBLIC_GA_MEASUREMENT_ID: string;
|
4
|
-
NEXT_PUBLIC_FACEBOOK_PIXEL_ID: string;
|
5
|
-
}
|
1
|
+
namespace NodeJS {
|
2
|
+
interface ProcessEnv {
|
3
|
+
NEXT_PUBLIC_GA_MEASUREMENT_ID: string;
|
4
|
+
NEXT_PUBLIC_FACEBOOK_PIXEL_ID: string;
|
5
|
+
}
|
6
6
|
}
|
package/next/analytics/fpixel.ts
CHANGED
@@ -1,16 +1,16 @@
|
|
1
|
-
declare global {
|
2
|
-
interface Window {
|
3
|
-
fbq: Function;
|
4
|
-
}
|
5
|
-
}
|
6
|
-
|
7
|
-
export const FB_PIXEL_ID = process.env.NEXT_PUBLIC_FACEBOOK_PIXEL_ID
|
8
|
-
|
9
|
-
export const pageview = () => {
|
10
|
-
window.fbq('track', 'PageView')
|
11
|
-
}
|
12
|
-
|
13
|
-
// https://developers.facebook.com/docs/meta-pixel/reference
|
14
|
-
export const sendFBEvent = (name: string, options = {}) => {
|
15
|
-
window.fbq('track', name, options)
|
1
|
+
declare global {
|
2
|
+
interface Window {
|
3
|
+
fbq: Function;
|
4
|
+
}
|
5
|
+
}
|
6
|
+
|
7
|
+
export const FB_PIXEL_ID = process.env.NEXT_PUBLIC_FACEBOOK_PIXEL_ID
|
8
|
+
|
9
|
+
export const pageview = () => {
|
10
|
+
window.fbq('track', 'PageView')
|
11
|
+
}
|
12
|
+
|
13
|
+
// https://developers.facebook.com/docs/meta-pixel/reference
|
14
|
+
export const sendFBEvent = (name: string, options = {}) => {
|
15
|
+
window.fbq('track', name, options)
|
16
16
|
}
|
@@ -1,14 +1,14 @@
|
|
1
|
-
declare global {
|
2
|
-
interface Window {
|
3
|
-
gtag: Function;
|
4
|
-
}
|
5
|
-
}
|
6
|
-
|
7
|
-
// https://developers.google.com/analytics/devguides/collection/ga4/ecommerce?client_type=gtag
|
8
|
-
const sendGAEvent = (name: string, options = {}) => {
|
9
|
-
window.gtag('event', name, options)
|
10
|
-
}
|
11
|
-
|
12
|
-
export {
|
13
|
-
sendGAEvent as default
|
1
|
+
declare global {
|
2
|
+
interface Window {
|
3
|
+
gtag: Function;
|
4
|
+
}
|
5
|
+
}
|
6
|
+
|
7
|
+
// https://developers.google.com/analytics/devguides/collection/ga4/ecommerce?client_type=gtag
|
8
|
+
const sendGAEvent = (name: string, options = {}) => {
|
9
|
+
window.gtag('event', name, options)
|
10
|
+
}
|
11
|
+
|
12
|
+
export {
|
13
|
+
sendGAEvent as default
|
14
14
|
}
|
package/next/analytics/index.ts
CHANGED
@@ -1,3 +1,3 @@
|
|
1
|
-
export { sendFBEvent } from './fpixel'
|
2
|
-
export { default as sendGAEvent } from './google-analytics'
|
3
|
-
export { FacebookPixel } from './pixel-analytics'
|
1
|
+
export { sendFBEvent } from './fpixel'
|
2
|
+
export { default as sendGAEvent } from './google-analytics'
|
3
|
+
export { FacebookPixel } from './pixel-analytics'
|
@@ -1,55 +1,55 @@
|
|
1
|
-
'use client'
|
2
|
-
|
3
|
-
import { usePathname } from 'next/navigation'
|
4
|
-
import Script from 'next/script'
|
5
|
-
import { useEffect, useState } from 'react'
|
6
|
-
import * as fbq from './fpixel'
|
7
|
-
|
8
|
-
const FacebookPixelHead = () => {
|
9
|
-
return (
|
10
|
-
<noscript>
|
11
|
-
<img
|
12
|
-
height='1'
|
13
|
-
width='1'
|
14
|
-
style={{ display: 'none' }}
|
15
|
-
src={`https://www.facebook.com/tr?id=${fbq.FB_PIXEL_ID}&ev=PageView&noscript=1`}
|
16
|
-
/>
|
17
|
-
</noscript>
|
18
|
-
)
|
19
|
-
}
|
20
|
-
|
21
|
-
const FacebookPixel = () => {
|
22
|
-
const [loaded, setLoaded] = useState(false)
|
23
|
-
const pathname = usePathname()
|
24
|
-
|
25
|
-
useEffect(() => {
|
26
|
-
if (!loaded) return
|
27
|
-
|
28
|
-
fbq.pageview()
|
29
|
-
}, [pathname, loaded])
|
30
|
-
|
31
|
-
return (
|
32
|
-
<div>
|
33
|
-
<Script
|
34
|
-
id='fb-pixel'
|
35
|
-
strategy='afterInteractive'
|
36
|
-
onLoad={() => setLoaded(true)}
|
37
|
-
dangerouslySetInnerHTML={{
|
38
|
-
__html: `
|
39
|
-
!function(f,b,e,v,n,t,s)
|
40
|
-
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
|
41
|
-
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
|
42
|
-
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
|
43
|
-
n.queue=[];t=b.createElement(e);t.async=!0;
|
44
|
-
t.src=v;s=b.getElementsByTagName(e)[0];
|
45
|
-
s.parentNode.insertBefore(t,s)}(window, document,'script',
|
46
|
-
'https://connect.facebook.net/en_US/fbevents.js');
|
47
|
-
fbq('init', ${fbq.FB_PIXEL_ID});
|
48
|
-
`,
|
49
|
-
}}
|
50
|
-
/>
|
51
|
-
</div>
|
52
|
-
)
|
53
|
-
}
|
54
|
-
|
1
|
+
'use client'
|
2
|
+
|
3
|
+
import { usePathname } from 'next/navigation'
|
4
|
+
import Script from 'next/script'
|
5
|
+
import { useEffect, useState } from 'react'
|
6
|
+
import * as fbq from './fpixel'
|
7
|
+
|
8
|
+
const FacebookPixelHead = () => {
|
9
|
+
return (
|
10
|
+
<noscript>
|
11
|
+
<img
|
12
|
+
height='1'
|
13
|
+
width='1'
|
14
|
+
style={{ display: 'none' }}
|
15
|
+
src={`https://www.facebook.com/tr?id=${fbq.FB_PIXEL_ID}&ev=PageView&noscript=1`}
|
16
|
+
/>
|
17
|
+
</noscript>
|
18
|
+
)
|
19
|
+
}
|
20
|
+
|
21
|
+
const FacebookPixel = () => {
|
22
|
+
const [loaded, setLoaded] = useState(false)
|
23
|
+
const pathname = usePathname()
|
24
|
+
|
25
|
+
useEffect(() => {
|
26
|
+
if (!loaded) return
|
27
|
+
|
28
|
+
fbq.pageview()
|
29
|
+
}, [pathname, loaded])
|
30
|
+
|
31
|
+
return (
|
32
|
+
<div>
|
33
|
+
<Script
|
34
|
+
id='fb-pixel'
|
35
|
+
strategy='afterInteractive'
|
36
|
+
onLoad={() => setLoaded(true)}
|
37
|
+
dangerouslySetInnerHTML={{
|
38
|
+
__html: `
|
39
|
+
!function(f,b,e,v,n,t,s)
|
40
|
+
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
|
41
|
+
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
|
42
|
+
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
|
43
|
+
n.queue=[];t=b.createElement(e);t.async=!0;
|
44
|
+
t.src=v;s=b.getElementsByTagName(e)[0];
|
45
|
+
s.parentNode.insertBefore(t,s)}(window, document,'script',
|
46
|
+
'https://connect.facebook.net/en_US/fbevents.js');
|
47
|
+
fbq('init', ${fbq.FB_PIXEL_ID});
|
48
|
+
`,
|
49
|
+
}}
|
50
|
+
/>
|
51
|
+
</div>
|
52
|
+
)
|
53
|
+
}
|
54
|
+
|
55
55
|
export {FacebookPixelHead, FacebookPixel}
|
@@ -1,16 +1,16 @@
|
|
1
|
-
import { NextRequest, NextResponse, userAgent } from 'next/server'
|
2
|
-
import { getSelectorsByUserAgent } from 'react-device-detect'
|
3
|
-
|
4
|
-
// writed this way so they can be chained :)
|
5
|
-
const determineDeviceMW = async (request: NextRequest) => {
|
6
|
-
|
7
|
-
const ua = userAgent(request)
|
8
|
-
const { isMobileOnly, isTablet, isDesktop } = getSelectorsByUserAgent(ua.ua)
|
9
|
-
const agent = isMobileOnly ? 'phone' : (isTablet ? 'tablet' : (isDesktop ? 'desktop' : 'unknown'))
|
10
|
-
const { nextUrl: url } = request
|
11
|
-
//console.log(`\n=== from ${url.href} on a *${agent && agent.toUpperCase()}* device. ===\n`)
|
12
|
-
url.searchParams.set('agent', agent)
|
13
|
-
return NextResponse.rewrite(url)
|
14
|
-
}
|
15
|
-
|
16
|
-
export default determineDeviceMW
|
1
|
+
import { NextRequest, NextResponse, userAgent } from 'next/server'
|
2
|
+
import { getSelectorsByUserAgent } from 'react-device-detect'
|
3
|
+
|
4
|
+
// writed this way so they can be chained :)
|
5
|
+
const determineDeviceMW = async (request: NextRequest) => {
|
6
|
+
|
7
|
+
const ua = userAgent(request)
|
8
|
+
const { isMobileOnly, isTablet, isDesktop } = getSelectorsByUserAgent(ua.ua)
|
9
|
+
const agent = isMobileOnly ? 'phone' : (isTablet ? 'tablet' : (isDesktop ? 'desktop' : 'unknown'))
|
10
|
+
const { nextUrl: url } = request
|
11
|
+
//console.log(`\n=== from ${url.href} on a *${agent && agent.toUpperCase()}* device. ===\n`)
|
12
|
+
url.searchParams.set('agent', agent)
|
13
|
+
return NextResponse.rewrite(url)
|
14
|
+
}
|
15
|
+
|
16
|
+
export default determineDeviceMW
|
@@ -1,12 +1,12 @@
|
|
1
|
-
import nextFonts from './load-and-return-lux-next-fonts-on-import'
|
2
|
-
import type NextFontDesc from './next-font-desc'
|
3
|
-
|
4
|
-
// These will be injected for <body> in app router app that uses our RootLayout
|
5
|
-
|
6
|
-
// First is assumed to be mapped to the default font and is injected into <body>
|
7
|
-
// as a normal tw font family class.
|
8
|
-
export default () => (
|
9
|
-
nextFonts.map(
|
10
|
-
(desc: NextFontDesc) => (desc.nextFont!.variable)
|
11
|
-
).join(' ') + ` font-${nextFonts[0].twName}`
|
12
|
-
)
|
1
|
+
import nextFonts from './load-and-return-lux-next-fonts-on-import'
|
2
|
+
import type NextFontDesc from './next-font-desc'
|
3
|
+
|
4
|
+
// These will be injected for <body> in app router app that uses our RootLayout
|
5
|
+
|
6
|
+
// First is assumed to be mapped to the default font and is injected into <body>
|
7
|
+
// as a normal tw font family class.
|
8
|
+
export default () => (
|
9
|
+
nextFonts.map(
|
10
|
+
(desc: NextFontDesc) => (desc.nextFont!.variable)
|
11
|
+
).join(' ') + ` font-${nextFonts[0].twName}`
|
12
|
+
)
|
@@ -1,68 +1,68 @@
|
|
1
|
-
// import { Inter } from 'next/font/google'
|
2
|
-
import localFont from 'next/font/local'
|
3
|
-
|
4
|
-
import type { TwFontDesc } from '@hanzo/ui/tailwind' // TODO
|
5
|
-
import type NextFontDesc from './next-font-desc'
|
6
|
-
|
7
|
-
import twFonts from '../../tailwind/lux-tw-fonts'
|
8
|
-
|
9
|
-
/*
|
10
|
-
Creating NextFontDesc's and TwFontDesc's has to be seperated because they are needed
|
11
|
-
at different times during the next compile / build. Otherwise a nasty
|
12
|
-
race condition happens!
|
13
|
-
|
14
|
-
Also, requires that "Font loaders must be called and assigned to a const in the module scope"
|
15
|
-
|
16
|
-
*/
|
17
|
-
|
18
|
-
const drukWide = localFont({
|
19
|
-
src: [
|
20
|
-
{
|
21
|
-
path: './local/Druk-Wide-Bold.ttf',
|
22
|
-
weight: '700',
|
23
|
-
style: 'normal'
|
24
|
-
},
|
25
|
-
{
|
26
|
-
path: './local/Druk-Wide-Medium.ttf',
|
27
|
-
weight: '500',
|
28
|
-
style: 'normal',
|
29
|
-
},
|
30
|
-
],
|
31
|
-
display: 'swap',
|
32
|
-
variable: '--font-druk-wide',
|
33
|
-
})
|
34
|
-
|
35
|
-
const inter = localFont({
|
36
|
-
src: './local/InterVariable.ttf',
|
37
|
-
display: 'swap',
|
38
|
-
variable: '--font-inter',
|
39
|
-
})
|
40
|
-
|
41
|
-
export default [
|
42
|
-
{
|
43
|
-
font: inter,
|
44
|
-
twName: 'sans'
|
45
|
-
},
|
46
|
-
{
|
47
|
-
font: inter,
|
48
|
-
twName: 'nav'
|
49
|
-
},
|
50
|
-
{
|
51
|
-
font: drukWide,
|
52
|
-
twName: 'heading'
|
53
|
-
}
|
54
|
-
].map (
|
55
|
-
(el) => {
|
56
|
-
const twFont: TwFontDesc | undefined = twFonts.find((twf: TwFontDesc) => (el.twName === twf.twName))
|
57
|
-
if (!twFont) {
|
58
|
-
throw new Error('lux-next-fonts: Next font is not paired to a TW font!')
|
59
|
-
}
|
60
|
-
|
61
|
-
return ({
|
62
|
-
...twFont,
|
63
|
-
nextFont: el.font,
|
64
|
-
})
|
65
|
-
}
|
66
|
-
) satisfies NextFontDesc[]
|
67
|
-
|
68
|
-
|
1
|
+
// import { Inter } from 'next/font/google'
|
2
|
+
import localFont from 'next/font/local'
|
3
|
+
|
4
|
+
import type { TwFontDesc } from '@hanzo/ui/tailwind' // TODO
|
5
|
+
import type NextFontDesc from './next-font-desc'
|
6
|
+
|
7
|
+
import twFonts from '../../tailwind/lux-tw-fonts'
|
8
|
+
|
9
|
+
/*
|
10
|
+
Creating NextFontDesc's and TwFontDesc's has to be seperated because they are needed
|
11
|
+
at different times during the next compile / build. Otherwise a nasty
|
12
|
+
race condition happens!
|
13
|
+
|
14
|
+
Also, requires that "Font loaders must be called and assigned to a const in the module scope"
|
15
|
+
|
16
|
+
*/
|
17
|
+
|
18
|
+
const drukWide = localFont({
|
19
|
+
src: [
|
20
|
+
{
|
21
|
+
path: './local/Druk-Wide-Bold.ttf',
|
22
|
+
weight: '700',
|
23
|
+
style: 'normal'
|
24
|
+
},
|
25
|
+
{
|
26
|
+
path: './local/Druk-Wide-Medium.ttf',
|
27
|
+
weight: '500',
|
28
|
+
style: 'normal',
|
29
|
+
},
|
30
|
+
],
|
31
|
+
display: 'swap',
|
32
|
+
variable: '--font-druk-wide',
|
33
|
+
})
|
34
|
+
|
35
|
+
const inter = localFont({
|
36
|
+
src: './local/InterVariable.ttf',
|
37
|
+
display: 'swap',
|
38
|
+
variable: '--font-inter',
|
39
|
+
})
|
40
|
+
|
41
|
+
export default [
|
42
|
+
{
|
43
|
+
font: inter,
|
44
|
+
twName: 'sans'
|
45
|
+
},
|
46
|
+
{
|
47
|
+
font: inter,
|
48
|
+
twName: 'nav'
|
49
|
+
},
|
50
|
+
{
|
51
|
+
font: drukWide,
|
52
|
+
twName: 'heading'
|
53
|
+
}
|
54
|
+
].map (
|
55
|
+
(el) => {
|
56
|
+
const twFont: TwFontDesc | undefined = twFonts.find((twf: TwFontDesc) => (el.twName === twf.twName))
|
57
|
+
if (!twFont) {
|
58
|
+
throw new Error('lux-next-fonts: Next font is not paired to a TW font!')
|
59
|
+
}
|
60
|
+
|
61
|
+
return ({
|
62
|
+
...twFont,
|
63
|
+
nextFont: el.font,
|
64
|
+
})
|
65
|
+
}
|
66
|
+
) satisfies NextFontDesc[]
|
67
|
+
|
68
|
+
|
@@ -1,28 +1,28 @@
|
|
1
|
-
import type { TwFontDesc } from '@hanzo/ui/tailwind'
|
2
|
-
|
3
|
-
// from next repo
|
4
|
-
type NextFont = {
|
5
|
-
className: string
|
6
|
-
style: { fontFamily: string; fontWeight?: number; fontStyle?: string }
|
7
|
-
}
|
8
|
-
|
9
|
-
// from next repo
|
10
|
-
type NextFontWithVariable = NextFont & {
|
11
|
-
variable: string
|
12
|
-
}
|
13
|
-
|
14
|
-
|
15
|
-
/*
|
16
|
-
NextFontDesc and TwFontDesc have to be seperate because they are needed
|
17
|
-
at different times during the next compile / build. Otherwise a nasty
|
18
|
-
race condition happens! That's why they are in different files.
|
19
|
-
*/
|
20
|
-
|
21
|
-
interface NextFontDesc extends TwFontDesc {
|
22
|
-
nextFont: NextFontWithVariable
|
23
|
-
}
|
24
|
-
|
25
|
-
export {
|
26
|
-
type NextFontDesc as default,
|
27
|
-
type NextFontWithVariable,
|
1
|
+
import type { TwFontDesc } from '@hanzo/ui/tailwind'
|
2
|
+
|
3
|
+
// from next repo
|
4
|
+
type NextFont = {
|
5
|
+
className: string
|
6
|
+
style: { fontFamily: string; fontWeight?: number; fontStyle?: string }
|
7
|
+
}
|
8
|
+
|
9
|
+
// from next repo
|
10
|
+
type NextFontWithVariable = NextFont & {
|
11
|
+
variable: string
|
12
|
+
}
|
13
|
+
|
14
|
+
|
15
|
+
/*
|
16
|
+
NextFontDesc and TwFontDesc have to be seperate because they are needed
|
17
|
+
at different times during the next compile / build. Otherwise a nasty
|
18
|
+
race condition happens! That's why they are in different files.
|
19
|
+
*/
|
20
|
+
|
21
|
+
interface NextFontDesc extends TwFontDesc {
|
22
|
+
nextFont: NextFontWithVariable
|
23
|
+
}
|
24
|
+
|
25
|
+
export {
|
26
|
+
type NextFontDesc as default,
|
27
|
+
type NextFontWithVariable,
|
28
28
|
}
|
@@ -1,18 +1,18 @@
|
|
1
|
-
|
2
|
-
import nextFonts from './load-and-return-lux-next-fonts-on-import'
|
3
|
-
import type NextFontDesc from './next-font-desc'
|
4
|
-
|
5
|
-
const PagesRouterFontVars: React.FC = () => {
|
6
|
-
|
7
|
-
const fontVars = nextFonts.map((fd: NextFontDesc) => (
|
8
|
-
`${fd.cssVar}: ${fd.nextFont.style.fontFamily};`
|
9
|
-
)).join('\n')
|
10
|
-
|
11
|
-
return <style jsx global>{`
|
12
|
-
html {
|
13
|
-
${fontVars}
|
14
|
-
}
|
15
|
-
`}</style>
|
16
|
-
}
|
17
|
-
|
18
|
-
export default PagesRouterFontVars
|
1
|
+
|
2
|
+
import nextFonts from './load-and-return-lux-next-fonts-on-import'
|
3
|
+
import type NextFontDesc from './next-font-desc'
|
4
|
+
|
5
|
+
const PagesRouterFontVars: React.FC = () => {
|
6
|
+
|
7
|
+
const fontVars = nextFonts.map((fd: NextFontDesc) => (
|
8
|
+
`${fd.cssVar}: ${fd.nextFont.style.fontFamily};`
|
9
|
+
)).join('\n')
|
10
|
+
|
11
|
+
return <style jsx global>{`
|
12
|
+
html {
|
13
|
+
${fontVars}
|
14
|
+
}
|
15
|
+
`}</style>
|
16
|
+
}
|
17
|
+
|
18
|
+
export default PagesRouterFontVars
|