Bridge Training
UI

@workspace/ui

Shared UI components built with Radix UI and Tailwind CSS.

Overview

@workspace/ui provides the foundational UI layer for all apps in the monorepo. It includes:

  • Components — Radix UI primitives with Tailwind styling (Button, Dialog, Input, etc.)
  • Global styles — CSS variables for colors, shadows, radii, and dark mode
  • Theme tokens — OKLCH-based color system with automatic dark mode support

Key files

PathPurpose
src/styles/globals.cssCSS variables, Tailwind config, base styles
src/components/Radix-based UI components
src/lib/utils.tscn() helper for class merging

Package exports

// Component imports
import { Button } from "@workspace/ui/components/button";
import { Input } from "@workspace/ui/components/input";
import { Dialog } from "@workspace/ui/components/dialog";

// Utilities
import { cn } from "@workspace/ui/lib/utils";

// Styles (CSS import)
import "@workspace/ui/globals.css";

On this page