@luxfi/core 5.2.10 → 5.2.11
Sign up to get free protection for your applications and to get access to all the features.
- package/commerce/ui/conf.ts +13 -13
- package/commerce/ui/context.tsx +126 -126
- package/commerce/ui/store.ts +306 -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 +49 -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/cart-accordian.tsx +66 -0
- package/components/commerce/checkout-panel/checkout-panel-props.ts +10 -0
- package/components/commerce/checkout-panel/{dt-bag-carousel.tsx → desktop-bag-carousel.tsx} +36 -36
- package/components/commerce/checkout-panel/desktop-cp.tsx +83 -0
- package/components/commerce/checkout-panel/index.tsx +126 -129
- package/components/commerce/checkout-panel/mobile-cp.tsx +67 -0
- package/components/commerce/checkout-panel/policy-links.tsx +29 -0
- 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 +47 -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.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.tsx +20 -20
- package/components/icons/bridge.tsx +68 -68
- package/components/icons/changelog.tsx +21 -21
- package/components/icons/chrome.tsx +45 -45
- package/components/icons/coins.tsx +20 -20
- package/components/icons/compare-cards.tsx +21 -21
- package/components/icons/credit.tsx +20 -20
- package/components/icons/customer-support.tsx +21 -21
- package/components/icons/customers.tsx +33 -33
- package/components/icons/developer-docs.tsx +20 -20
- package/components/icons/exchange.tsx +21 -21
- package/components/icons/explorer.tsx +22 -22
- package/components/icons/faqs.tsx +21 -21
- package/components/icons/github.tsx +14 -14
- 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.tsx +25 -25
- package/components/icons/irradescent.tsx +41 -41
- package/components/icons/launch-subnet.tsx +21 -21
- package/components/icons/left-arrow.tsx +11 -11
- package/components/icons/lux-finance.tsx +23 -23
- package/components/icons/lux-logo.tsx +10 -10
- package/components/icons/lux-pass.tsx +25 -25
- package/components/icons/lux-quests.tsx +21 -21
- package/components/icons/market.tsx +24 -24
- package/components/icons/mirrored-titanium.tsx +46 -46
- package/components/icons/more-benefits.tsx +21 -21
- package/components/icons/open-source.tsx +26 -26
- package/components/icons/right-arrow.tsx +10 -10
- 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.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.tsx +21 -21
- package/components/icons/validators.tsx +41 -41
- package/components/icons/view-all-card.tsx +20 -20
- 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 +392 -392
- 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 +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 +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
- package/components/commerce/checkout-panel/dt-checkout-panel.tsx +0 -85
- package/components/commerce/checkout-panel/links-row.tsx +0 -21
- package/components/commerce/checkout-panel/mb-checkout-panel.tsx +0 -55
@@ -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,28 +1,28 @@
|
|
1
|
-
import React from 'react'
|
2
|
-
|
3
|
-
import { ApplyTypography } from '@hanzo/ui/primitives'
|
4
|
-
|
5
|
-
import type { SiteDef } from '../../site-def'
|
6
|
-
import Footer from '../footer'
|
7
|
-
import Header from '../header'
|
8
|
-
import Main from '../main'
|
9
|
-
|
10
|
-
import NotFoundMDX from './not-found-content.mdx'
|
11
|
-
|
12
|
-
const NotFound: React.FC<{
|
13
|
-
header?: boolean
|
14
|
-
siteDef: SiteDef
|
15
|
-
}> = ({
|
16
|
-
header=false,
|
17
|
-
siteDef
|
18
|
-
}) => (<>
|
19
|
-
{header && <Header siteDef={siteDef}/>}
|
20
|
-
<Main className='h-[100svh] sm:h-[700px] px-8 sm:px-10 ' headerSpace={header}>
|
21
|
-
<ApplyTypography className='mt-[200px] flex flex-col md:gap-8 '>
|
22
|
-
<NotFoundMDX />
|
23
|
-
</ApplyTypography>
|
24
|
-
</Main>
|
25
|
-
<Footer siteDef={siteDef}/>
|
26
|
-
</>)
|
27
|
-
|
28
|
-
export default NotFound
|
1
|
+
import React from 'react'
|
2
|
+
|
3
|
+
import { ApplyTypography } from '@hanzo/ui/primitives'
|
4
|
+
|
5
|
+
import type { SiteDef } from '../../site-def'
|
6
|
+
import Footer from '../footer'
|
7
|
+
import Header from '../header'
|
8
|
+
import Main from '../main'
|
9
|
+
|
10
|
+
import NotFoundMDX from './not-found-content.mdx'
|
11
|
+
|
12
|
+
const NotFound: React.FC<{
|
13
|
+
header?: boolean
|
14
|
+
siteDef: SiteDef
|
15
|
+
}> = ({
|
16
|
+
header=false,
|
17
|
+
siteDef
|
18
|
+
}) => (<>
|
19
|
+
{header && <Header siteDef={siteDef}/>}
|
20
|
+
<Main className='h-[100svh] sm:h-[700px] px-8 sm:px-10 ' headerSpace={header}>
|
21
|
+
<ApplyTypography className='mt-[200px] flex flex-col md:gap-8 '>
|
22
|
+
<NotFoundMDX />
|
23
|
+
</ApplyTypography>
|
24
|
+
</Main>
|
25
|
+
<Footer siteDef={siteDef}/>
|
26
|
+
</>)
|
27
|
+
|
28
|
+
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 = 'flex'
|
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 = 'flex'
|
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/components/tooltip.tsx
CHANGED
@@ -1,31 +1,31 @@
|
|
1
|
-
'use client'
|
2
|
-
import React from 'react'
|
3
|
-
import { Tooltip as RTTooltip, type PlacesType } from 'react-tooltip'
|
4
|
-
|
5
|
-
const Tooltip: React.FC<{
|
6
|
-
select: string
|
7
|
-
text: string
|
8
|
-
position?: PlacesType // https://react-tooltip.com/docs/options
|
9
|
-
clx?: string
|
10
|
-
offset?: number
|
11
|
-
}> = ({
|
12
|
-
select,
|
13
|
-
text,
|
14
|
-
clx='',
|
15
|
-
position='bottom',
|
16
|
-
offset=2
|
17
|
-
}) => (
|
18
|
-
<RTTooltip
|
19
|
-
anchorSelect={select}
|
20
|
-
noArrow
|
21
|
-
opacity={1}
|
22
|
-
content={text}
|
23
|
-
place={position}
|
24
|
-
offset={offset}
|
25
|
-
delayShow={100}
|
26
|
-
delayHide={100}
|
27
|
-
className={'!opacity-100 !bg-level-2 border rounded-[3px] !px-1.5 !py-1 z-floating' + clx}
|
28
|
-
/>
|
29
|
-
)
|
30
|
-
|
31
|
-
export default Tooltip
|
1
|
+
'use client'
|
2
|
+
import React from 'react'
|
3
|
+
import { Tooltip as RTTooltip, type PlacesType } from 'react-tooltip'
|
4
|
+
|
5
|
+
const Tooltip: React.FC<{
|
6
|
+
select: string
|
7
|
+
text: string
|
8
|
+
position?: PlacesType // https://react-tooltip.com/docs/options
|
9
|
+
clx?: string
|
10
|
+
offset?: number
|
11
|
+
}> = ({
|
12
|
+
select,
|
13
|
+
text,
|
14
|
+
clx='',
|
15
|
+
position='bottom',
|
16
|
+
offset=2
|
17
|
+
}) => (
|
18
|
+
<RTTooltip
|
19
|
+
anchorSelect={select}
|
20
|
+
noArrow
|
21
|
+
opacity={1}
|
22
|
+
content={text}
|
23
|
+
place={position}
|
24
|
+
offset={offset}
|
25
|
+
delayShow={100}
|
26
|
+
delayHide={100}
|
27
|
+
className={'!opacity-100 !bg-level-2 border rounded-[3px] !px-1.5 !py-1 z-floating' + clx}
|
28
|
+
/>
|
29
|
+
)
|
30
|
+
|
31
|
+
export default Tooltip
|
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,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
|
+
)
|