@luxfi/core 5.1.3 → 5.1.5
Sign up to get free protection for your applications and to get access to all the features.
- package/commerce/AUTO-GEN-bullion-by-family.json +33 -33
- package/commerce/EDIT-ME-bullion-market-prices.ts +11 -11
- package/commerce/assign-prices.ts +49 -49
- package/commerce/assign-videos-by-family-group.ts +14 -14
- package/commerce/bullion-price-1oz.ts +5 -5
- package/commerce/index.ts +18 -18
- package/commerce/lux-service-options.ts +6 -6
- 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 +104 -104
- package/components/chat-widget.tsx +80 -80
- package/components/commerce/bag-button.tsx +98 -98
- package/components/commerce/buy-drawer/drawer.tsx +44 -44
- package/components/commerce/buy-drawer/index.tsx +46 -46
- package/components/commerce/checkout-button.tsx +116 -116
- 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 +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 +86 -86
- package/components/commerce/checkout-widget/obs-string-set.ts +48 -48
- package/components/commerce/checkout-widget/use-anim-clx-set.ts +56 -56
- package/components/commerce/checkout-widget/use-lagging-item-ref.ts +29 -29
- package/components/commerce/desktop-bag-popup.tsx +78 -78
- package/components/commerce/mobile-bag-drawer.tsx +51 -51
- package/components/commerce/mobile-login-button.tsx +101 -0
- package/components/commerce/mobile-menu-toggle-button.tsx +35 -35
- package/components/commerce/mobile-nav-menu-ai.tsx +98 -0
- package/components/commerce/mobile-nav-menu-item.tsx +46 -0
- package/components/commerce/mobile-nav-menu.tsx +79 -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/guts.tsx +27 -0
- package/components/header/index.tsx +47 -26
- package/components/header/mobile.tsx +165 -161
- package/components/header/theme-toggle.tsx +26 -26
- package/components/icons/avatar.tsx +11 -0
- package/components/icons/bag-icon.tsx +10 -10
- package/components/icons/github.tsx +14 -14
- package/components/icons/index.tsx +43 -35
- package/components/icons/left-arrow.tsx +11 -0
- package/components/icons/lux-logo.tsx +10 -10
- package/components/icons/right-arrow.tsx +10 -0
- package/components/icons/search.tsx +12 -0
- 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/scripts.tsx +24 -24
- 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/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 +73 -72
- package/root-layout/WHY_THIS_IS_SEPARATE.txt +1 -1
- package/root-layout/index.tsx +121 -120
- 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 +292 -0
- package/style/cart-animation.css +29 -29
- package/style/checkout-animation.css +23 -23
- 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 -28
- package/types/chatbot-config.ts +6 -6
- package/types/chatbot-suggested-question.ts +7 -7
- package/types/commerce-config.ts +10 -10
- package/types/contact-info.ts +10 -10
- package/types/index.ts +5 -5
- package/types/site-def.ts +45 -45
- package/site-def/main-nav.ts +0 -35
@@ -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
|
}
|
@@ -1,85 +1,85 @@
|
|
1
|
-
'use client'
|
2
|
-
|
3
|
-
import React, { useEffect, useRef } from 'react'
|
4
|
-
import { type MiniChartProps } from './mini-chart-props'
|
5
|
-
|
6
|
-
const MiniChart: React.FC<MiniChartProps> = ({
|
7
|
-
widgetProps,
|
8
|
-
containerStyles = {}
|
9
|
-
}) => {
|
10
|
-
|
11
|
-
const {
|
12
|
-
symbol,
|
13
|
-
exchange,
|
14
|
-
lineColor,
|
15
|
-
topGradientColor,
|
16
|
-
bottomGradientColor,
|
17
|
-
width,
|
18
|
-
height,
|
19
|
-
autosize,
|
20
|
-
locale,
|
21
|
-
...rest
|
22
|
-
} = widgetProps
|
23
|
-
|
24
|
-
const symbolString = (exchange) ? `${exchange}:${symbol}` : symbol
|
25
|
-
|
26
|
-
const containerRef = useRef<HTMLDivElement | null>(null)
|
27
|
-
|
28
|
-
useEffect(() => {
|
29
|
-
if (!containerRef.current) {
|
30
|
-
return
|
31
|
-
}
|
32
|
-
const script = document.createElement('script')
|
33
|
-
script.type = 'text/javascript'
|
34
|
-
script.src = 'https://s3.tradingview.com/external-embedding/embed-widget-mini-symbol-overview.js'
|
35
|
-
script.async = true
|
36
|
-
script.onload = async () => {
|
37
|
-
const iframe = containerRef.current?.querySelector('iframe')
|
38
|
-
if (iframe && iframe instanceof Element) {
|
39
|
-
iframe.style.colorScheme = 'normal'
|
40
|
-
setTimeout(() => {
|
41
|
-
const value = document.querySelector('#mini-symbol-overview-ticker')
|
42
|
-
console.log("TICKER: " + value)
|
43
|
-
}, 1200) // from experimentation
|
44
|
-
|
45
|
-
|
46
|
-
}
|
47
|
-
|
48
|
-
const copyDiv = document.querySelector('.tradingview-widget-copyright')
|
49
|
-
if (copyDiv) {
|
50
|
-
console.log("COPY: " + copyDiv)
|
51
|
-
setTimeout(() => {
|
52
|
-
copyDiv.classList.remove('invisible')
|
53
|
-
}, 1200) // from experimentation
|
54
|
-
}
|
55
|
-
}
|
56
|
-
const config = JSON.stringify({
|
57
|
-
symbol: symbolString,
|
58
|
-
width: autosize ? '100%' : (width || 350),
|
59
|
-
height: autosize ? '100%' : (height || 220),
|
60
|
-
locale: locale ?? 'en',
|
61
|
-
isTransparent: 'true',
|
62
|
-
trendLineColor: lineColor || 'rgba(41, 98, 255, 1)',
|
63
|
-
underLineColor: topGradientColor || 'rgba(41, 98, 255, 0.3)',
|
64
|
-
underLineBottomColor: bottomGradientColor || 'rgba(41, 98, 255, 0)',
|
65
|
-
...rest,
|
66
|
-
})
|
67
|
-
script.innerHTML = config
|
68
|
-
containerRef.current.appendChild(script)
|
69
|
-
return () => {
|
70
|
-
while (containerRef.current?.firstChild) {
|
71
|
-
containerRef.current.removeChild(containerRef.current.firstChild)
|
72
|
-
}
|
73
|
-
}
|
74
|
-
}, [ JSON.stringify(widgetProps) ])
|
75
|
-
|
76
|
-
return (<>
|
77
|
-
<div style={containerStyles} className='tradingview-widget-container h-[150px]' ref={containerRef} />
|
78
|
-
<div className='tradingview-widget-copyright border-t w-full invisible'>
|
79
|
-
<a href={`https://www.tradingview.com/symbols/${symbol}${exchange ? `/?exchange=${exchange}` : '' }`} rel="noopener" target="_blank">
|
80
|
-
<span className="text-[--hz-ui-primary]">{symbol} quotes</span></a> by TradingView
|
81
|
-
</div>
|
82
|
-
</>)
|
83
|
-
}
|
84
|
-
|
85
|
-
export default MiniChart
|
1
|
+
'use client'
|
2
|
+
|
3
|
+
import React, { useEffect, useRef } from 'react'
|
4
|
+
import { type MiniChartProps } from './mini-chart-props'
|
5
|
+
|
6
|
+
const MiniChart: React.FC<MiniChartProps> = ({
|
7
|
+
widgetProps,
|
8
|
+
containerStyles = {}
|
9
|
+
}) => {
|
10
|
+
|
11
|
+
const {
|
12
|
+
symbol,
|
13
|
+
exchange,
|
14
|
+
lineColor,
|
15
|
+
topGradientColor,
|
16
|
+
bottomGradientColor,
|
17
|
+
width,
|
18
|
+
height,
|
19
|
+
autosize,
|
20
|
+
locale,
|
21
|
+
...rest
|
22
|
+
} = widgetProps
|
23
|
+
|
24
|
+
const symbolString = (exchange) ? `${exchange}:${symbol}` : symbol
|
25
|
+
|
26
|
+
const containerRef = useRef<HTMLDivElement | null>(null)
|
27
|
+
|
28
|
+
useEffect(() => {
|
29
|
+
if (!containerRef.current) {
|
30
|
+
return
|
31
|
+
}
|
32
|
+
const script = document.createElement('script')
|
33
|
+
script.type = 'text/javascript'
|
34
|
+
script.src = 'https://s3.tradingview.com/external-embedding/embed-widget-mini-symbol-overview.js'
|
35
|
+
script.async = true
|
36
|
+
script.onload = async () => {
|
37
|
+
const iframe = containerRef.current?.querySelector('iframe')
|
38
|
+
if (iframe && iframe instanceof Element) {
|
39
|
+
iframe.style.colorScheme = 'normal'
|
40
|
+
setTimeout(() => {
|
41
|
+
const value = document.querySelector('#mini-symbol-overview-ticker')
|
42
|
+
console.log("TICKER: " + value)
|
43
|
+
}, 1200) // from experimentation
|
44
|
+
|
45
|
+
|
46
|
+
}
|
47
|
+
|
48
|
+
const copyDiv = document.querySelector('.tradingview-widget-copyright')
|
49
|
+
if (copyDiv) {
|
50
|
+
console.log("COPY: " + copyDiv)
|
51
|
+
setTimeout(() => {
|
52
|
+
copyDiv.classList.remove('invisible')
|
53
|
+
}, 1200) // from experimentation
|
54
|
+
}
|
55
|
+
}
|
56
|
+
const config = JSON.stringify({
|
57
|
+
symbol: symbolString,
|
58
|
+
width: autosize ? '100%' : (width || 350),
|
59
|
+
height: autosize ? '100%' : (height || 220),
|
60
|
+
locale: locale ?? 'en',
|
61
|
+
isTransparent: 'true',
|
62
|
+
trendLineColor: lineColor || 'rgba(41, 98, 255, 1)',
|
63
|
+
underLineColor: topGradientColor || 'rgba(41, 98, 255, 0.3)',
|
64
|
+
underLineBottomColor: bottomGradientColor || 'rgba(41, 98, 255, 0)',
|
65
|
+
...rest,
|
66
|
+
})
|
67
|
+
script.innerHTML = config
|
68
|
+
containerRef.current.appendChild(script)
|
69
|
+
return () => {
|
70
|
+
while (containerRef.current?.firstChild) {
|
71
|
+
containerRef.current.removeChild(containerRef.current.firstChild)
|
72
|
+
}
|
73
|
+
}
|
74
|
+
}, [ JSON.stringify(widgetProps) ])
|
75
|
+
|
76
|
+
return (<>
|
77
|
+
<div style={containerStyles} className='tradingview-widget-container h-[150px]' ref={containerRef} />
|
78
|
+
<div className='tradingview-widget-copyright border-t w-full invisible'>
|
79
|
+
<a href={`https://www.tradingview.com/symbols/${symbol}${exchange ? `/?exchange=${exchange}` : '' }`} rel="noopener" target="_blank">
|
80
|
+
<span className="text-[--hz-ui-primary]">{symbol} quotes</span></a> by TradingView
|
81
|
+
</div>
|
82
|
+
</>)
|
83
|
+
}
|
84
|
+
|
85
|
+
export default MiniChart
|
@@ -1,23 +1,23 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
|
3
|
-
import BaseChart from './mini-chart'
|
4
|
-
|
5
|
-
const Wrapper: React.FC<{
|
6
|
-
symbol: string,
|
7
|
-
exchange?: string
|
8
|
-
}> = ({
|
9
|
-
symbol,
|
10
|
-
exchange
|
11
|
-
}) => (
|
12
|
-
<BaseChart widgetProps ={{
|
13
|
-
symbol,
|
14
|
-
exchange,
|
15
|
-
autosize: true,
|
16
|
-
colorTheme: 'dark',
|
17
|
-
lineColor: "rgb(114, 27, 228)",
|
18
|
-
bottomGradientColor: "rgba(255, 255, 255, 0.1)",
|
19
|
-
dateRange: '60M',
|
20
|
-
}}/>
|
21
|
-
)
|
22
|
-
|
23
|
-
export default Wrapper
|
1
|
+
import React from 'react'
|
2
|
+
|
3
|
+
import BaseChart from './mini-chart'
|
4
|
+
|
5
|
+
const Wrapper: React.FC<{
|
6
|
+
symbol: string,
|
7
|
+
exchange?: string
|
8
|
+
}> = ({
|
9
|
+
symbol,
|
10
|
+
exchange
|
11
|
+
}) => (
|
12
|
+
<BaseChart widgetProps ={{
|
13
|
+
symbol,
|
14
|
+
exchange,
|
15
|
+
autosize: true,
|
16
|
+
colorTheme: 'dark',
|
17
|
+
lineColor: "rgb(114, 27, 228)",
|
18
|
+
bottomGradientColor: "rgba(255, 255, 255, 0.1)",
|
19
|
+
dateRange: '60M',
|
20
|
+
}}/>
|
21
|
+
)
|
22
|
+
|
23
|
+
export default Wrapper
|
@@ -1,27 +1,27 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
|
3
|
-
import { ApplyTypography, Main } from '@hanzo/ui/primitives'
|
4
|
-
|
5
|
-
import type { SiteDef } from '../../site-def'
|
6
|
-
import Footer from '../footer'
|
7
|
-
import Header from '../header'
|
8
|
-
|
9
|
-
import NotFoundMDX from './not-found-content.mdx'
|
10
|
-
|
11
|
-
const NotFound: React.FC<{
|
12
|
-
header?: boolean
|
13
|
-
siteDef: SiteDef
|
14
|
-
}> = ({
|
15
|
-
header=false,
|
16
|
-
siteDef
|
17
|
-
}) => (<>
|
18
|
-
{header && <Header siteDef={siteDef}/>}
|
19
|
-
<Main className='xs:h-[100svh] xs:px-8 sm:px-10 sm:h-[700px]'>
|
20
|
-
<ApplyTypography className='mt-[200px] flex flex-col md:gap-8 '>
|
21
|
-
<NotFoundMDX />
|
22
|
-
</ApplyTypography>
|
23
|
-
</Main>
|
24
|
-
<Footer siteDef={siteDef}/>
|
25
|
-
</>)
|
26
|
-
|
27
|
-
export default NotFound
|
1
|
+
import React from 'react'
|
2
|
+
|
3
|
+
import { ApplyTypography, Main } from '@hanzo/ui/primitives'
|
4
|
+
|
5
|
+
import type { SiteDef } from '../../site-def'
|
6
|
+
import Footer from '../footer'
|
7
|
+
import Header from '../header'
|
8
|
+
|
9
|
+
import NotFoundMDX from './not-found-content.mdx'
|
10
|
+
|
11
|
+
const NotFound: React.FC<{
|
12
|
+
header?: boolean
|
13
|
+
siteDef: SiteDef
|
14
|
+
}> = ({
|
15
|
+
header=false,
|
16
|
+
siteDef
|
17
|
+
}) => (<>
|
18
|
+
{header && <Header siteDef={siteDef}/>}
|
19
|
+
<Main className='xs:h-[100svh] xs:px-8 sm:px-10 sm:h-[700px]'>
|
20
|
+
<ApplyTypography className='mt-[200px] flex flex-col md:gap-8 '>
|
21
|
+
<NotFoundMDX />
|
22
|
+
</ApplyTypography>
|
23
|
+
</Main>
|
24
|
+
<Footer siteDef={siteDef}/>
|
25
|
+
</>)
|
26
|
+
|
27
|
+
export default NotFound
|
@@ -1,5 +1,5 @@
|
|
1
|
-
### ...Huh?
|
2
|
-
#### Sorry, we're fresh out of those.
|
3
|
-
<br/>
|
4
|
-
#### ...try something from the [Home Page](/)?
|
5
|
-
|
1
|
+
### ...Huh?
|
2
|
+
#### Sorry, we're fresh out of those.
|
3
|
+
<br/>
|
4
|
+
#### ...try something from the [Home Page](/)?
|
5
|
+
|
package/components/scripts.tsx
CHANGED
@@ -1,24 +1,24 @@
|
|
1
|
-
'use client'
|
2
|
-
|
3
|
-
import { useEffect } from 'react'
|
4
|
-
import { GoogleAnalytics } from '@next/third-parties/google'
|
5
|
-
import { FacebookPixel } from '../next/analytics'
|
6
|
-
|
7
|
-
// TODO: Rename this component, since Next has one called Script
|
8
|
-
const Scripts = () => {
|
9
|
-
|
10
|
-
useEffect(() => {
|
11
|
-
document.body.style.display = 'block'
|
12
|
-
}, [])
|
13
|
-
|
14
|
-
return (
|
15
|
-
<>
|
16
|
-
<FacebookPixel />
|
17
|
-
<GoogleAnalytics gaId={process.env.NEXT_PUBLIC_GA_MEASUREMENT_ID ?? ''} />
|
18
|
-
</>
|
19
|
-
)
|
20
|
-
}
|
21
|
-
|
22
|
-
export {
|
23
|
-
Scripts as default
|
24
|
-
}
|
1
|
+
'use client'
|
2
|
+
|
3
|
+
import { useEffect } from 'react'
|
4
|
+
import { GoogleAnalytics } from '@next/third-parties/google'
|
5
|
+
import { FacebookPixel } from '../next/analytics'
|
6
|
+
|
7
|
+
// TODO: Rename this component, since Next has one called Script
|
8
|
+
const Scripts = () => {
|
9
|
+
|
10
|
+
useEffect(() => {
|
11
|
+
document.body.style.display = 'block'
|
12
|
+
}, [])
|
13
|
+
|
14
|
+
return (
|
15
|
+
<>
|
16
|
+
<FacebookPixel />
|
17
|
+
<GoogleAnalytics gaId={process.env.NEXT_PUBLIC_GA_MEASUREMENT_ID ?? ''} />
|
18
|
+
</>
|
19
|
+
)
|
20
|
+
}
|
21
|
+
|
22
|
+
export {
|
23
|
+
Scripts as default
|
24
|
+
}
|
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'
|