@galactusdev/ui

Shared React UI component library built on Base UI + Tailwind CSS.

Installation

bun add @galactusdev/ui

Setup

Configure styles

• Tailwind v4 projects: Add @source "../../node_modules/@galactusdev/ui/dist"; to the project's main CSS file (e.g. globals.css). Do NOT import the pre-compiled styles — it will conflict with the project's Tailwind output.
• Non-Tailwind projects: Add import "@galactusdev/ui/styles"; to the root layout file.

Import components

import { Button, Card, Dialog } from "@galactusdev/ui";

Theming

Components use CSS custom properties. The consumer app controls the theme by defining variables in :root and .dark:

:root {
  --primary: oklch(0.55 0.22 25);
  --primary-foreground: oklch(0.98 0 0);
  --background: oklch(1 0 0);
  --foreground: oklch(0.15 0 0);
}

Do not hardcode colors in the package — always use CSS variables.

Development

Storybook

bun install
bun run storybook

Opens at http://localhost:6006.

Build

bun run build

Produces dist/index.js, dist/index.d.ts, and dist/styles.css.

Release

npm publish --access public

Requires NPM_TOKEN set in the environment.

Adding new components

Primitives (src/client/components/ui/) — exported in the package:

1. Add the component source to src/client/components/ui/
2. Export it from src/index.ts
3. Run bun run build to verify it compiles
4. Add a story in the same directory (component-name.stories.tsx)

Composites (src/client/components/composite/) — internal only, not published:

1. Add the component source to src/client/components/composite/
2. Do not export it from src/index.ts
3. Add a story with title: "Composite/ComponentName" in the same directory