verbatimModuleSyntax (so market could build)

packages/ui/blocks/components/banner-block.tsx

@@ -1,7 +1,7 @@
 
 import React  from 'react'
 
-import { Dimensions, type TShirtSize } from '../../types'
+import type { Dimensions, TShirtSize } from '../../types'
 import type { Block, BannerBlock } from '../def'
 
 import VideoBlockComponent from './video-block'

packages/ui/blocks/components/group-block.tsx

@@ -21,7 +21,7 @@ const getLayoutInfo = (s: string): {
     switch (layout) {
       case 'grid': {
         const columns = parseInt(subtokens[2], 10)
-        const starting = subtokens[4] as Breakpoint
+        const starting = subtokens[4]
         if (Number.isNaN(columns) || columns < 2 || columns > 6 || !Breakpoints.includes(starting)) {
           return undefined
         }

packages/ui/blocks/components/image-block.tsx

@@ -4,7 +4,6 @@ import Image from 'next/image'
 
 import { constrain } from '../../util'
 import type { Dimensions } from '../../types'
-
 import type { Block, ImageBlock } from '../def'
 
 const ImageBlockComponent: React.FC<{

packages/ui/blocks/def/card-block.ts

@@ -1,11 +1,11 @@
 import React from 'react'
 
-import { Icon } from '../../types'
+import { type Icon } from '../../types'
 
 import type CTABlock from './cta-block'
 import type Block from './block'
 import type ImageBlock from './image-block'
-import VideoBlock from './video-block'
+import type VideoBlock from './video-block'
 
 interface CardBlock extends Block {
   blockType: 'card'

packages/ui/common/action-button.tsx

@@ -4,7 +4,7 @@ import dynamic from 'next/dynamic'
 import { cn } from '../util'
 
 import type { ButtonDef, ButtonModalDef } from '../types'
-import { ButtonSizes } from '../primitives/button'
+import type { ButtonSizes } from '../primitives/button'
 
   // The DVC must be rendered client-side since it accesses the DOM directly.
   // There is no need for a loading UI since the dialog only opens

packages/ui/common/contact-dialog/contact-form.tsx

@@ -3,7 +3,7 @@
 import React, { useTransition } from 'react'
 
 import { zodResolver } from '@hookform/resolvers/zod'
-import { useForm, SubmitHandler, type ControllerRenderProps } from 'react-hook-form'
+import { useForm, type SubmitHandler, type ControllerRenderProps } from 'react-hook-form'
 import * as z from 'zod'
   // @ts-ignore
 import validator from 'validator'

packages/ui/common/footer.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 
-import { ButtonVariants } from '../primitives'
+import type { ButtonVariants } from '../primitives'
 import type { LinkDef, SiteConf } from '../types'
 import { Copyright, NavItems } from '../common'
 

packages/ui/common/header/index.tsx

@@ -3,7 +3,7 @@ import React from 'react'
 import type SiteConf from '../../types/site-conf'
 
 import Logo from '../logo'
-import { ButtonVariants } from '../../primitives'
+import type { ButtonVariants } from '../../primitives'
 import { NavItems, LinkElement, DrawerMenu } from '../../common'
 import MobileNav from './mobile-nav'
 

packages/ui/common/header/mobile-nav.tsx

@@ -2,8 +2,8 @@
 import React from 'react'
 
 import { LinkElement }  from '../../common'
-import { ButtonVariants }  from '../../primitives'
-import { SiteConf } from '../../types'
+import type { ButtonVariants }  from '../../primitives'
+import type { SiteConf } from '../../types'
 
 const MobileNav: React.FC<{
   conf: SiteConf

packages/ui/common/mini-chart/mini-chart-props.ts

@@ -1,4 +1,4 @@
-import { CSSProperties } from 'react'
+import type { CSSProperties } from 'react'
 
   // https://www.typescriptlang.org/docs/handbook/enums.html#enums-at-runtime
 const enum MiniChartDateRangesValues {

packages/ui/common/nav-items.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 
 import type { LinkDef }  from '../types'
-import { ButtonVariants } from '../primitives/button'
+import type { ButtonVariants } from '../primitives/button'
 import { cn } from '../util'
 
 import LinkElement from './link-element'

packages/ui/conf/footer.tsx

@@ -1,5 +1,5 @@
 import { Icons } from '../common'
-import { LinkDef } from '../types'
+import type { LinkDef } from '../types'
 
 const SOC_ICON_SIZE = 18
 

packages/ui/next/not-found.tsx

@@ -5,7 +5,7 @@ import Footer from '../common/footer'
 import { ApplyTypography } from '../primitives'
 
 import NotFoundMDX from './not-found-content.mdx'
-import { SiteConf } from '../types'
+import type { SiteConf } from '../types'
 
 const NotFound: React.FC<{
   conf: SiteConf

packages/ui/next/root-layout.tsx

@@ -1,57 +1,8 @@
 import React, { type PropsWithChildren } from 'react'
-import { Metadata } from 'next'
 
 import { inter, drukTextWide } from '../next-fonts'
 import Header from '../common/header'
-import SiteConf from '../types/site-conf'
-
-const getMetadata = (conf: SiteConf): Metadata => ({
-
-  title: {
-    default: conf.title,
-    template: conf.template,
-  },
-  description: conf.desc,
-
-    // Generated from a 512 original create in GIMP
-    // at https://favicon.io/favicon-converter/
-
-    // Next API is poorly documented.
-    // cf: Next.js repo: packages/next/src/lib/metadata/types/metadata-interface.ts
-    // and metadata-types.ts 
-  icons: [
-    {
-      rel: 'icon',
-      type: 'image/png',
-      sizes: '16x16',
-      url: '/assets/icon/favicon-16x16.png'   
-    },
-    {
-      rel: 'icon',
-      type: 'image/png',
-      sizes: '32x32',
-      url: '/assets/icon/favicon-32x32.png'   
-    },
-    {
-      rel: 'icon',
-      type: 'image/png',
-      sizes: '192x192',
-      url: '/assets/icon/android-chrome-192x192.png'   
-    },
-    {
-      rel: 'icon',
-      type: 'image/png',
-      sizes: '512x512',
-      url: '/assets/icon/android-chrome-512x512.png'   
-    },
-    {
-      rel: 'apple-touch-icon',
-      type: 'image/png',
-      sizes: '180x180',
-      url: '/assets/icon/apple-touch-icon.png'   
-    },
-  ]
-})
+import type SiteConf from '../types/site-conf'
 
 // Next 14: https://nextjs.org/docs/app/building-your-application/upgrading/codemods#use-viewport-export
 const viewport = {
@@ -95,6 +46,5 @@ const RootLayout: React.FC<
 
 export {
   RootLayout as default,
-  getMetadata,
   viewport
 }

packages/ui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@luxdefi/ui",
-  "version": "0.1.42",
+  "version": "0.1.50",
   "description": "Library that contains shared UI primitives, styles, and core types",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",

packages/ui/primitives/apply-typography.tsx

@@ -1,4 +1,4 @@
-import React, { PropsWithChildren } from 'react'
+import React, { type PropsWithChildren } from 'react'
 
 import { cn } from '../util'
 

packages/ui/primitives/dialog-video-controller.tsx

@@ -1,6 +1,6 @@
 'use client'
 
-import React, { PropsWithChildren, useState } from 'react'
+import React, { type PropsWithChildren, useState } from 'react'
 
 const DialogVideoController: React.FC<PropsWithChildren> = ({
   children,

packages/ui/primitives/video-player.tsx

@@ -1,7 +1,7 @@
 'use client'
 import React from 'react'
 
-import { Dimensions } from '../types'
+import type { Dimensions } from '../types'
 
 interface VideoProps extends React.ComponentPropsWithoutRef<"video"> {
   sources: string[]

packages/ui/tsconfig.json

@@ -19,6 +19,7 @@
     "target": "es2020",
     "declaration": true,
     "declarationMap": true,
+    "verbatimModuleSyntax": true,
     "esModuleInterop": true,
     "skipLibCheck": true,
     "outDir": "./dist",

packages/ui/util/index.ts

@@ -2,7 +2,7 @@ import { compiler as mdCompiler } from 'markdown-to-jsx'
 
 import { clsx, type ClassValue } from 'clsx'
 import { twMerge } from 'tailwind-merge'
-import { Dimensions } from '../types'
+import type { Dimensions } from '../types'
 
 export const cn = (...inputs: ClassValue[]) => (
   twMerge(clsx(inputs))