@praetorian-chariot/ui

📚 View Component Library: Storybook Documentation

Getting Started

Installation

Install the package and its dependencies:

npm install @praetorian-chariot/ui

Setup

1. Import the CSS file in your main application file:

import '@praetorian-chariot/ui/index.css';

2. Configure your tailwind.config.js:

import { chariotColors } from '@praetorian-chariot/ui/theme';

/** @type {import('tailwindcss').Config} */
module.exports = {
  // Include the UI library in your content paths
  content: [
    './src/**/*.{ts,tsx}',
    './node_modules/@praetorian-chariot/ui/**/*.{js,ts,jsx,tsx}',
  ],
  // Include the UI library's Tailwind preset
  presets: [
    require('./node_modules/@praetorian-chariot/ui/tailwind.config.js'),
  ],
  theme: {
    extend: {
      colors: chariotColors,
      // ... other theme extensions
    }
  }
};

Usage

Import and use components in your React application:

import { LeftNav, Button } from '@praetorian-chariot/ui';

function App() {
  return (
    <div>
      <LeftNav 
        mainNavItems={[/* your nav items */]} 
        footerNavItems={[/* your footer items */]}
      />
      <Button variant="primary">Click Me</Button>
    </div>
  );
}