Installation

RequirementsCopy Anchor Link

• React and React DOM 19.2.3 or later.
• TypeScript and a bundler with CSS Modules support.
• Node 22.13+ (22.x) or 24+ for this repository's development tooling.

Run this documentationCopy Anchor Link

npm ci
npm run dev

Open localhost:5173. The documentation app uses Next.js, Fumadocs, and MDX.

Install the source packageCopy Anchor Link

The package is currently private and is not published to the npm registry. Create a local archive from the repository:

npm pack

Then install it in your application:

npm install /path/to/uthereal-ui-0.1.0.tgz

The archive contains src/ and the package documentation. It does not include this documentation website or test fixtures. Next.js and Fumadocs are development dependencies of this repository, not runtime dependencies of your app.

Next.jsCopy Anchor Link

Enable transpilation for the source package in your application's Next.js configuration:

// next.config.ts
import type { NextConfig } from 'next'

const config: NextConfig = {
  transpilePackages: ['@uthereal/ui'],
}
export default config

Use the dropdown from a Client Component when passing event handlers:

'use client'
import { DropdownMenu } from '@uthereal/ui/dropdown-menu'

export function Actions() {
  return (
    <DropdownMenu
      items={[{ kind: 'action', id: 'save', label: 'Save', action: 'save' }]}
      onAction={(action) => console.log(action)}
    />
  )
}

ViteCopy Anchor Link

Vite handles the package's TypeScript and CSS Modules directly. Import the component using the same public path. React Compiler is optional.

Optional agent integrationCopy Anchor Link

Use @uthereal/ui/agent for validated single-component edits. Use @uthereal/ui/composition and @uthereal/ui/composition/react to compose registered components with json-render. See Building with agents.