npm - @luxfi/core - Versions diffs - 4.3.11 - Mend

@luxfi/core 4.3.11

Files changed (84) hide show

package/components/access-code-input.tsx +71 -0
package/components/auth/login-panel.tsx +80 -0
package/components/chat-widget.tsx +77 -0
package/components/commerce/bag-button.tsx +67 -0
package/components/commerce/checkout-panel/close-button.tsx +23 -0
package/components/commerce/checkout-panel/dt-bag-carousel.tsx +36 -0
package/components/commerce/checkout-panel/dt-checkout-panel.tsx +68 -0
package/components/commerce/checkout-panel/index.tsx +124 -0
package/components/commerce/checkout-panel/links-row.tsx +21 -0
package/components/commerce/checkout-panel/mb-checkout-panel.tsx +51 -0
package/components/commerce/checkout-panel/steps-indicator.tsx +39 -0
package/components/commerce/checkout-panel/thank-you.tsx +18 -0
package/components/commerce/desktop-bag-popup.tsx +78 -0
package/components/commerce/mobile-bag-drawer.tsx +51 -0
package/components/commerce/mobile-menu-toggle-button.tsx +35 -0
package/components/commerce/mobile-nav-menu.tsx +64 -0
package/components/contact-dialog/contact-form.tsx +112 -0
package/components/contact-dialog/disclaimer.tsx +13 -0
package/components/contact-dialog/index.tsx +64 -0
package/components/copyright.tsx +21 -0
package/components/footer.tsx +78 -0
package/components/header/desktop.tsx +54 -0
package/components/header/index.tsx +26 -0
package/components/header/mobile.tsx +161 -0
package/components/header/theme-toggle.tsx +26 -0
package/components/icons/bag-icon.tsx +10 -0
package/components/icons/github.tsx +14 -0
package/components/icons/index.tsx +35 -0
package/components/icons/lux-logo.tsx +10 -0
package/components/icons/secure-delivery.tsx +13 -0
package/components/icons/social-icon.tsx +35 -0
package/components/icons/social-svg.css +3 -0
package/components/icons/youtube-logo.tsx +59 -0
package/components/index.ts +26 -0
package/components/logo.tsx +81 -0
package/components/mini-chart/index.tsx +8 -0
package/components/mini-chart/mini-chart-props.ts +44 -0
package/components/mini-chart/mini-chart.tsx +85 -0
package/components/mini-chart/wrapper.tsx +23 -0
package/components/not-found/index.tsx +27 -0
package/components/not-found/not-found-content.mdx +5 -0
package/components/root-layout.tsx +71 -0
package/components/scripts.tsx +23 -0
package/conf/index.ts +50 -0
package/environment.d.ts +6 -0
package/next/analytics/fpixel.ts +16 -0
package/next/analytics/google-analytics.ts +14 -0
package/next/analytics/index.ts +3 -0
package/next/analytics/pixel-analytics.tsx +55 -0
package/next/determine-device-mw.ts +16 -0
package/next/font/get-app-router-font-classes.ts +12 -0
package/next/font/load-and-return-lux-next-fonts-on-import.ts +67 -0
package/next/font/local/Druk-Wide-Bold.ttf +0 -0
package/next/font/local/Druk-Wide-Medium.ttf +0 -0
package/next/font/next-font-desc.ts +28 -0
package/next/font/pages-router-font-vars.tsx +18 -0
package/next/head-metadata/from-next/metadata-types.ts +158 -0
package/next/head-metadata/from-next/opengraph-types.ts +267 -0
package/next/head-metadata/from-next/twitter-types.ts +92 -0
package/next/head-metadata/index.tsx +208 -0
package/next/index.ts +1 -0
package/package.json +72 -0
package/server-actions/firebase-app.ts +14 -0
package/server-actions/index.ts +5 -0
package/server-actions/store-contact.ts +51 -0
package/site-def/footer/community.tsx +67 -0
package/site-def/footer/company.ts +37 -0
package/site-def/footer/ecosystem.ts +37 -0
package/site-def/footer/index.tsx +26 -0
package/site-def/footer/legal.ts +28 -0
package/site-def/footer/network.ts +45 -0
package/site-def/footer/svg/warpcast-logo.svg +12 -0
package/site-def/index.ts +3 -0
package/site-def/main-nav.ts +35 -0
package/site-def/site-def.ts +37 -0
package/style/lux-colors.css +85 -0
package/style/lux-global.css +19 -0
package/tailwind/fontFamily.tailwind.lux.ts +18 -0
package/tailwind/index.ts +2 -0
package/tailwind/lux-tw-fonts.ts +40 -0
package/tailwind/tailwind.config.lux-preset.ts +10 -0
package/tsconfig.json +10 -0
package/types/contact-info.ts +11 -0
package/types/index.ts +1 -0

package/components/not-found/not-found-content.mdx ADDED Viewed

@@ -0,0 +1,5 @@
+### ...Huh?
+#### Sorry, we're fresh out of those.
+<br/>
+#### ...try something from the [Home Page](/)?

package/components/root-layout.tsx ADDED Viewed

@@ -0,0 +1,71 @@
+import React, { type PropsWithChildren } from 'react'
+import type { Viewport } from 'next'
+import { Toaster } from '@hanzo/ui/primitives'
+import Header from './header'
+import type SiteDef from '../site-def/site-def'
+import getAppRouterBodyFontClasses from '../next/font/get-app-router-font-classes'
+import { FacebookPixelHead } from '../next/analytics/pixel-analytics'
+import Scripts from './scripts'
+// Next 14: https://nextjs.org/docs/app/building-your-application/upgrading/codemods#use-viewport-export
+const viewport = {
+  themeColor: [
+    { media: '(prefers-color-scheme: light)', color: 'white' },
+    { media: '(prefers-color-scheme: dark)', color: 'black' },
+  ],
+} satisfies Viewport
+/*
+  These '.variable' fields are actually autogenerate css classnames that *define* the actual
+  css variables ('--<ugly-name>') that one asks for in the tailwind classes.
+  They are what make them available in the global scope. So this MUST
+  be done like this for the tailwind font classes to work.
+  (...not to be confused with the css var itself.  This field should be named something else!)
+*/
+/*
+  re body: overflow-y-hidden overflow-x-hidden, h-full
+  We cannot have these on body tag for scroll-snap to work on iOS!
+*/
+const bodyClasses =
+  'bg-background text-foreground flex flex-col min-h-full' +
+  getAppRouterBodyFontClasses()
+const RootLayout: React.FC<PropsWithChildren & {
+  siteDef: SiteDef
+  header?: boolean
+}> = ({
+  header = true,
+  siteDef,
+  children,
+}) =>  (
+  <html lang='en' suppressHydrationWarning className='hanzo-ui-dark-theme' style={{backgroundColor: '#000'}}>
+    <head >
+      {/* https://stackoverflow.com/a/75716588/11645689 */ }
+      <base target='_blank' />
+      <FacebookPixelHead/>
+    </head>
+    <body className={bodyClasses} style={{
+      // Not sure why these got added (by my check in)
+      // overflow: hidden here breaks scroll snap, see comment above
+      //paddingRight: '0 !important',
+      //maxWidth: '100vw',
+      display: 'none', // see scripts.tsx
+    }}>
+      <Scripts/>
+      {header && <Header siteDef={siteDef}/>}
+      {children}
+      <Toaster position='top-center' duration={3000}/>
+    </body>
+  </html>
+)
+export {
+  RootLayout as default,
+  viewport
+}

package/components/scripts.tsx ADDED Viewed

@@ -0,0 +1,23 @@
+'use client'
+import { useEffect } from 'react'
+import { GoogleAnalytics } from '@next/third-parties/google'
+import { FacebookPixel } from '../next/analytics'
+const Scripts = () => {
+  useEffect(() => {
+    document.body.style.display = 'block'
+  }, [])
+  return (
+    <>
+      <FacebookPixel />
+      <GoogleAnalytics gaId={process.env.NEXT_PUBLIC_GA_MEASUREMENT_ID ?? ''} />
+    </>
+  )
+}
+export {
+  Scripts as default
+}

package/conf/index.ts ADDED Viewed

@@ -0,0 +1,50 @@
+import type { SelectionUISpecifier } from '@hanzo/commerce/types'
+export const selectionUISpecifiers = {
+  'LXM-CN': {
+    singleFamily: {
+      type: 'carousel',
+      options: {
+        familyTitle: 'long',
+        showByline: false,
+        showPrice: true,
+      }
+    }
+  },
+  'LXM-FC': {
+    singleFamily: {
+      type: 'carousel',
+      options: {
+        //showQuantity: true
+      }
+    }
+  },
+  'LXM-CR': {
+    multiFamily: {
+      type: 'all-variants-carousel',
+      selectorOptions: {
+        showParentTitle: false,
+        showItemSwatches: true
+      },
+      itemOptions: {
+        familyTitle: 'long',
+        showFamilyByline: true,
+        showPrice: false,
+      }
+    }
+  },
+  'LXM-AG': {
+    multiFamily: {
+      type: 'all-variants-carousel',
+      selectorOptions: {
+        showParentTitle: true,
+        showItemSwatches: false
+      },
+      itemOptions: {
+        familyTitle: 'long',
+      }
+    }
+  },
+} satisfies Record<string, SelectionUISpecifier>

package/environment.d.ts ADDED Viewed

@@ -0,0 +1,6 @@
+namespace NodeJS {
+  interface ProcessEnv {
+    NEXT_PUBLIC_GA_MEASUREMENT_ID: string;
+    NEXT_PUBLIC_FACEBOOK_PIXEL_ID: string;
+  }
+}

package/next/analytics/fpixel.ts ADDED Viewed

@@ -0,0 +1,16 @@
+declare global {
+  interface Window {
+    fbq: Function;
+  }
+}
+export const FB_PIXEL_ID = process.env.NEXT_PUBLIC_FACEBOOK_PIXEL_ID
+export const pageview = () => {
+  window.fbq('track', 'PageView')
+}
+// https://developers.facebook.com/docs/meta-pixel/reference
+export const sendFBEvent = (name: string, options = {}) => {
+  window.fbq('track', name, options)
+}

package/next/analytics/google-analytics.ts ADDED Viewed

@@ -0,0 +1,14 @@
+declare global {
+  interface Window {
+    gtag: Function;
+  }
+}
+// https://developers.google.com/analytics/devguides/collection/ga4/ecommerce?client_type=gtag
+const sendGAEvent = (name: string, options = {}) => {
+  window.gtag('event', name, options)
+}
+export {
+  sendGAEvent as default
+}

package/next/analytics/index.ts ADDED Viewed

@@ -0,0 +1,3 @@
+export { sendFBEvent } from './fpixel'
+export { default as sendGAEvent } from './google-analytics'
+export { FacebookPixel } from './pixel-analytics'

package/next/analytics/pixel-analytics.tsx ADDED Viewed

@@ -0,0 +1,55 @@
+'use client'
+import { usePathname } from 'next/navigation'
+import Script from 'next/script'
+import { useEffect, useState } from 'react'
+import * as fbq from './fpixel'
+const FacebookPixelHead = () => {
+  return (
+    <noscript>
+      <img
+        height='1'
+        width='1'
+        style={{ display: 'none' }}
+        src={`https://www.facebook.com/tr?id=${fbq.FB_PIXEL_ID}&ev=PageView&noscript=1`}
+      />
+    </noscript>
+  )
+}
+const FacebookPixel = () => {
+  const [loaded, setLoaded] = useState(false)
+  const pathname = usePathname()
+  useEffect(() => {
+    if (!loaded) return
+    fbq.pageview()
+  }, [pathname, loaded])
+  return (
+    <div>
+       <Script
+        id='fb-pixel'
+        strategy='afterInteractive'
+        onLoad={() => setLoaded(true)}
+        dangerouslySetInnerHTML={{
+          __html: `
+            !function(f,b,e,v,n,t,s)
+            {if(f.fbq)return;n=f.fbq=function(){n.callMethod?
+            n.callMethod.apply(n,arguments):n.queue.push(arguments)};
+            if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
+            n.queue=[];t=b.createElement(e);t.async=!0;
+            t.src=v;s=b.getElementsByTagName(e)[0];
+            s.parentNode.insertBefore(t,s)}(window, document,'script',
+            'https://connect.facebook.net/en_US/fbevents.js');
+            fbq('init', ${fbq.FB_PIXEL_ID});
+          `,
+        }}
+      />
+    </div>
+  )
+}
+export {FacebookPixelHead, FacebookPixel}

package/next/determine-device-mw.ts ADDED Viewed

@@ -0,0 +1,16 @@
+import { NextRequest, NextResponse, userAgent } from 'next/server'
+import { getSelectorsByUserAgent } from 'react-device-detect'
+  // writed this way so they can be chained :)
+const determineDeviceMW = async (request: NextRequest) => {
+  const ua = userAgent(request)
+  const { isMobileOnly, isTablet, isDesktop } = getSelectorsByUserAgent(ua.ua)
+  const agent = isMobileOnly ? 'phone' : (isTablet ? 'tablet' : (isDesktop ?  'desktop' : 'unknown'))
+  const { nextUrl: url } = request
+  //console.log(`\n=== from ${url.href} on a *${agent && agent.toUpperCase()}* device. ===\n`)
+  url.searchParams.set('agent', agent)
+  return NextResponse.rewrite(url)
+}
+export default determineDeviceMW

package/next/font/get-app-router-font-classes.ts ADDED Viewed

@@ -0,0 +1,12 @@
+import nextFonts from './load-and-return-lux-next-fonts-on-import'
+import type NextFontDesc from './next-font-desc'
+  // These will be injected for <body> in app router app that uses our RootLayout
+  // First is assumed to be mapped to the default font and is injected into <body>
+  // as a normal tw font family class.
+export default () => (
+  nextFonts.map(
+      (desc: NextFontDesc) => (desc.nextFont!.variable)
+    ).join(' ') + ` font-${nextFonts[0].twName}`
+)

package/next/font/load-and-return-lux-next-fonts-on-import.ts ADDED Viewed

@@ -0,0 +1,67 @@
+import { Inter } from 'next/font/google'
+import localFont from 'next/font/local'
+import type { TwFontDesc } from '@hanzo/ui/tailwind' // TODO
+import type NextFontDesc from './next-font-desc'
+import twFonts from '../../tailwind/lux-tw-fonts'
+/*
+  Creating NextFontDesc's and TwFontDesc's has to be seperated because they are needed
+  at different times during the next compile / build.  Otherwise a nasty
+  race condition happens!
+  Also, requires that "Font loaders must be called and assigned to a const in the module scope"
+*/
+const drukWide = localFont({
+  src: [
+    {
+      path: './local/Druk-Wide-Bold.ttf',
+      weight: '700',
+      style: 'normal'
+    },
+    {
+      path: './local/Druk-Wide-Medium.ttf',
+      weight: '500',
+      style: 'normal',
+    },
+  ],
+  display: 'swap',
+  variable: '--font-druk-wide' ,
+})
+const inter = Inter({
+  subsets: ["latin"],
+  variable: "--font-inter",
+})
+export default [
+  {
+    font: inter,
+    twName: 'sans'
+  },
+  {
+    font: inter,
+    twName: 'nav'
+  },
+  {
+    font: drukWide,
+    twName: 'heading'
+  }
+].map (
+  (el) => {
+    const twFont: TwFontDesc | undefined = twFonts.find((twf: TwFontDesc) => (el.twName === twf.twName))
+    if (!twFont) {
+      throw new Error('lux-next-fonts: Next font is not paired to a TW font!')
+    }
+    return ({
+      ...twFont,
+      nextFont: el.font,
+    })
+  }
+) satisfies NextFontDesc[]

package/next/font/local/Druk-Wide-Bold.ttf ADDED Viewed

Binary file

package/next/font/local/Druk-Wide-Medium.ttf ADDED Viewed

Binary file

package/next/font/next-font-desc.ts ADDED Viewed

@@ -0,0 +1,28 @@
+import type { TwFontDesc } from '@hanzo/ui/tailwind'
+// from next repo
+type NextFont = {
+  className: string
+  style: { fontFamily: string; fontWeight?: number; fontStyle?: string }
+}
+// from next repo
+type NextFontWithVariable = NextFont & {
+  variable: string
+}
+/*
+  NextFontDesc and TwFontDesc have to be seperate because they are needed
+  at different times during the next compile / build.  Otherwise a nasty
+  race condition happens! That's why they are in different files.
+*/
+interface NextFontDesc extends TwFontDesc {
+  nextFont: NextFontWithVariable
+}
+export {
+  type NextFontDesc as default,
+  type NextFontWithVariable,
+}

package/next/font/pages-router-font-vars.tsx ADDED Viewed

@@ -0,0 +1,18 @@
+import nextFonts from './load-and-return-lux-next-fonts-on-import'
+import type NextFontDesc from './next-font-desc'
+const PagesRouterFontVars: React.FC = () => {
+  const fontVars = nextFonts.map((fd: NextFontDesc) => (
+    `${fd.cssVar}: ${fd.nextFont.style.fontFamily};`
+  )).join('\n')
+  return <style jsx global>{`
+    html {
+      ${fontVars}
+    }
+  `}</style>
+}
+export default PagesRouterFontVars

package/next/head-metadata/from-next/metadata-types.ts ADDED Viewed

@@ -0,0 +1,158 @@
+/**
+ *
+ * Metadata types
+ *
+ */
+export interface DeprecatedMetadataFields {
+  /**
+   * Deprecated options that have a preferred method
+   * @deprecated Use appWebApp to configure apple-mobile-web-app-capable which provides
+   * @see https://www.appsloveworld.com/coding/iphone/11/difference-between-apple-mobile-web-app-capable-and-apple-touch-fullscreen-ipho
+   */
+  'apple-touch-fullscreen'?: never
+  /**
+   * Obsolete since iOS 7.
+   * @see https://web.dev/apple-touch-icon/
+   * @deprecated use icons.apple or instead
+   */
+  'apple-touch-icon-precomposed'?: never
+}
+export type TemplateString =
+  | DefaultTemplateString
+  | AbsoluteTemplateString
+  | AbsoluteString
+export type DefaultTemplateString = {
+  default: string
+  template: string
+}
+export type AbsoluteTemplateString = {
+  absolute: string
+  template: string | null
+}
+export type AbsoluteString = {
+  absolute: string
+}
+export type Author = {
+  // renders as <link rel="author"...
+  url?: string | URL
+  // renders as <meta name="author"...
+  name?: string
+}
+// does not include "unsafe-URL". to use this users should
+// use '"unsafe-URL" as ReferrerEnum'
+export type ReferrerEnum =
+  | 'no-referrer'
+  | 'origin'
+  | 'no-referrer-when-downgrade'
+  | 'origin-when-cross-origin'
+  | 'same-origin'
+  | 'strict-origin'
+  | 'strict-origin-when-cross-origin'
+export type ColorSchemeEnum =
+  | 'normal'
+  | 'light'
+  | 'dark'
+  | 'light dark'
+  | 'dark light'
+  | 'only light'
+type RobotsInfo = {
+  // all and none will be inferred from index/follow boolean options
+  index?: boolean
+  follow?: boolean
+  /** @deprecated set index to false instead */
+  noindex?: never
+  /** @deprecated set follow to false instead */
+  nofollow?: never
+  noarchive?: boolean
+  nosnippet?: boolean
+  noimageindex?: boolean
+  nocache?: boolean
+  notranslate?: boolean
+  indexifembedded?: boolean
+  nositelinkssearchbox?: boolean
+  unavailable_after?: string
+  'max-video-preview'?: number | string
+  'max-image-preview'?: 'none' | 'standard' | 'large'
+  'max-snippet'?: number
+}
+export type Robots = RobotsInfo & {
+  // if you want to specify an alternate robots just for google
+  googleBot?: string | RobotsInfo
+}
+export type ResolvedRobots = {
+  basic: string | null
+  googleBot: string | null
+}
+export type IconURL = string | URL
+export type Icon = IconURL | IconDescriptor
+export type IconDescriptor = {
+  url: string | URL
+  type?: string
+  sizes?: string
+  color?: string
+  /** defaults to rel="icon" unless superseded by Icons map */
+  rel?: string
+  media?: string
+  /**
+   * @see https://developer.mozilla.org/docs/Web/API/HTMLImageElement/fetchPriority
+   */
+  fetchPriority?: 'high' | 'low' | 'auto'
+}
+export type Icons = {
+  /** rel="icon" */
+  icon?: Icon | Icon[]
+  /** rel="shortcut icon" */
+  shortcut?: Icon | Icon[]
+  /**
+   * @see https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html
+   * rel="apple-touch-icon"
+   */
+  apple?: Icon | Icon[]
+  /** rel inferred from descriptor, defaults to "icon" */
+  other?: IconDescriptor | IconDescriptor[]
+}
+export type Verification = {
+  google?: null | string | number | (string | number)[]
+  yahoo?: null | string | number | (string | number)[]
+  yandex?: null | string | number | (string | number)[]
+  me?: null | string | number | (string | number)[]
+  // if you ad-hoc additional verification
+  other?: {
+    [name: string]: string | number | (string | number)[]
+  }
+}
+export type ResolvedVerification = {
+  google?: null | (string | number)[]
+  yahoo?: null | (string | number)[]
+  yandex?: null | (string | number)[]
+  me?: null | (string | number)[]
+  other?: {
+    [name: string]: (string | number)[]
+  }
+}
+export type ResolvedIcons = {
+  icon: IconDescriptor[]
+  apple: IconDescriptor[]
+  shortcut?: IconDescriptor[]
+  other?: IconDescriptor[]
+}
+export type ThemeColorDescriptor = {
+  color: string
+  media?: string
+}