Unstyled UI component are included via Radix.

Minimal component primitives are included in the /components/ui folder.

Learn more at ui.shadcn.com.

The components use TailwindCSS but can be extended by any major React styling system.

Examples

If you want to quickly build a complex UI we recommend copying and pasting the component primitives as needed.

UI Component Stack

Primitive

import {
  Popover,
  PopoverContent,
  PopoverTrigger,
} from "@/components/ui/popover"

Demo

<Popover>
  <PopoverTrigger>Open</PopoverTrigger>
  <PopoverContent>Place content for the popover here.</PopoverContent>
</Popover>

Web3 Component

import { WalletAddress, WalletBalance } from '@turbo-eth/core-wagmi'
import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover'

export default function UserDropdown() {
  return (
    <Popover>
        <PopoverTrigger>
            <WalletAddress />
        </PopoverTrigger>
        <PopoverContent>
            <WalletBalance />
        </PopoverContent>
    </Popover>
  )
}