IDC Frontend UI Library

A comprehensive React component library built with TypeScript, Vite, Tailwind CSS, and Storybook. This library provides a collection of reusable components and templates for building consistent user interfaces.

Features

• 🎨 Modern component library with Tailwind CSS
• 📚 Comprehensive Storybook documentation
• 🚀 Built with Vite for fast development
• 📦 TypeScript support
• 🎯 Accessibility-first components
• 📱 Responsive design patterns
• 🧪 Component testing setup
• 📝 Conventional commits and automated versioning

Getting Started

Prerequisites

• Node.js (v18 or higher)
• npm (v7 or higher)

Installation

# Clone the repository
git clone https://github.com/troychaplin/idc-frontend-ui.git

# Navigate to the project directory
cd idc-frontend-ui

# Install dependencies
npm install

Development

# Start Storybook
npm run storybook

# Build the library
npm run build

# Run linting
npm run lint

# Format code
npm run prettier

Project Structure

lib/
├── components/     # Reusable UI components
├── templates/      # Page templates and layouts
├── utils/         # Utility functions
└── style.css      # Global styles

Available Scripts

• npm run storybook - Start Storybook development server
• npm run build - Build the library
• npm run lint - Run ESLint
• npm run prettier - Format code with Prettier
• npm run size - Check bundle size
• npm run analyze - Analyze bundle size and dependencies

Version Management

The project uses conventional commits and standard-version for version management:

# Prepare a new release (dry run)
npm run release:prepare

# Create a new patch version
npm run release:patch

# Create a new minor version
npm run release:minor

# Create a new major version
npm run release:major

Acknowledgments

• Vite
• React
• TypeScript
• Tailwind CSS
• Storybook