Onu

Onu (އޮނު) means bamboo in Dhivehi.

Javaabu's React UI component library, built on shadcn/ui and Tailwind CSS v4.

• RTL and Dhivehi first: every component works in dir="rtl", with Dhivehi strings, dates and fonts built in.
• Thaana keyboard input on every free-text field, phonetic (JTK-compatible) or typewriter layout.
• One variable re-themes everything: --onu-primary. Granular tokens for everything else.
• Dark mode, density modes (compact → touch) and responsive, touch-friendly components.
• Accessible: WCAG 2.2 AA, tested with axe.
• Lucide icons by default, with FontAwesome Pro and Iconify adapters.

See REQUIREMENTS.md for the full specification and docs/ for the developer documentation.

Install

npm install @javaabu/onu react-hook-form @tanstack/react-query
# optional font pack (Inter, JetBrains Mono, Noto Sans Thaana; Faruma and MV Faseyha come with tailwind.css and styles.css)
npm install @fontsource-variable/inter @fontsource-variable/jetbrains-mono @fontsource-variable/noto-sans-thaana

/* app.css */
@import "tailwindcss";
@import "@javaabu/onu/tailwind.css";
@import "@javaabu/onu/fonts.css"; /* optional font pack: needs the packages above */

import { Button, OnuProvider, ThemeProvider } from "@javaabu/onu"
import { dv } from "@javaabu/onu/locales/dv"

export function App() {
  return (
    <ThemeProvider>
      <OnuProvider locale={dv}>
        <Button>ސޭވްކުރޭ</Button>
      </OnuProvider>
    </ThemeProvider>
  )
}

Re-theme with one variable:

:root {
  --onu-primary: oklch(0.55 0.15 240);
}

AI assistants

The package ships its docs for AI coding assistants: node_modules/@javaabu/onu/llms.txt (the rules for writing Onu code and an index of every component) and a Markdown page per component in node_modules/@javaabu/onu/docs/. There is also an MCP server, @javaabu/onu-mcp, and a Claude Code plugin (/plugin marketplace add Javaabu/onu). See AI assistants.

Repository

Path	What
packages/onu	The @javaabu/onu package
packages/onu-mcp	@javaabu/onu-mcp: MCP server with Onu's docs for AI assistants
plugins/onu	Claude Code plugin (skill + MCP server)
web	Docs site: every component and the sample pages (pnpm dev)
docs	Developer documentation (Docusaurus format)
figma	Figma token sync and Code Connect mappings
tokens.json	Design tokens (DTCG), the source for CSS variables and Figma Variables

pnpm install
pnpm dev            # web app
pnpm test           # unit tests
pnpm test:coverage  # with coverage thresholds
pnpm lint && pnpm typecheck
pnpm build          # build the package

Contributing

See CONTRIBUTING.md.

Licence

MIT. See LICENSE.md.