@manovaspace/ui

Radix-based primitives styled with Tailwind 4, plus motion helpers, loading states, and icon packs. Pair with @manovaspace/tokens.

Install

pnpm add @manovaspace/ui @manovaspace/tokens

Peers: react and react-dom ^19.2. Also works with npm or yarn.

Usage

@import "@manovaspace/tokens/fonts.css";
@import "@manovaspace/tokens/tokens.css";

import "@manovaspace/ui/styles.css";
import { Button, Card, CardContent, CardHeader, CardTitle } from "@manovaspace/ui";

export function Example() {
  return (
    <Card>
      <CardHeader>
        <CardTitle>Welcome</CardTitle>
      </CardHeader>
      <CardContent>
        <Button>Continue</Button>
      </CardContent>
    </Card>
  );
}

Components (root export)

Common primitives from @manovaspace/ui:

Group	Exports
Actions	`Button`, `Toggle`, `ToggleGroup`
Inputs	`Input`, `Textarea`, `Checkbox`, `Switch`, `Slider`, `Select`, `Label`
Layout	`Card`, `PageShell`, `Tabs`, `Collapsible`, `ScrollArea`, `Separator`-style surfaces
Feedback	`Badge`, `Progress`, `Skeleton`, `Spinner`, `Dialog`
Media	`Avatar`, `ColorSwatch`
Theme	`ThemeProvider`, `ThemeSwitcher`, `ThemeColorSync`, `TokenProvider`, `DirectionProvider`

Also: cn utility, icon helpers (ICON_SIZES, iconProps), and WhatsNew.

Subpath exports

Import	Purpose
`@manovaspace/ui`	Components and providers
`@manovaspace/ui/styles.css`	Built stylesheet (required)
`@manovaspace/ui/motion`	Motion wrappers (`FadeIn`, `SlideUp`, …)
`@manovaspace/ui/loading`	Loading overlay / screen helpers
`@manovaspace/ui/icons`	Lucide-style UI icons
`@manovaspace/ui/icons/solid`	Solid icon set
`@manovaspace/ui/icons/brand`	Brand icons
`@manovaspace/ui/server`	Head helpers for fonts/tokens in Next.js

Browse interactive examples in Storybook.