Astra UI

Astra UI was born from the frustration of rebuilding the same UI components across multiple projects. Rather than relying on generic third-party libraries that required heavy customization, I built a component library tailored to the patterns and design tokens I use most frequently.

The library is structured as a Turborepo monorepo, allowing independent versioning and publishing of component packages. Each component is built with accessibility in mind, supports theme customization through CSS variables, and uses Class Variance Authority (CVA) for type-safe variant management.

The goal was to create a library that feels native to any project it's dropped into — minimal footprint, zero runtime overhead for unused components, and first-class TypeScript support throughout.

The monorepo is organized into packages: a core component library, a shared configuration package for ESLint/TypeScript/Tailwind, and a Storybook documentation app. Turborepo handles task orchestration with remote caching for CI, reducing build times significantly on repeat runs.

Each component follows a consistent internal structure: a main component file using forwardRef, a variants file defining CVA configurations, an index barrel export, and a Storybook story file. This pattern makes adding new components predictable and minimizes context-switching.

Rollup is configured with a custom plugin pipeline that handles TypeScript compilation, Tailwind processing, and automatic external dependency detection. The output is dual ESM/CJS with corresponding type declarations, ensuring compatibility with any modern bundler.