Rorix UI

rorix-ui is a comprehensive UI library designed to streamline the development of modern web applications with reusable components and flexible styling options.

Installation

You can install rorix-ui via npm or yarn:

npm install rorix-ui
# or
yarn add rorix-ui

## Usage

import React from 'react';
import { Button } from 'rorix-ui';

function App() {
  return (
    <div>
      {/* Basic usage */}
      <Button value="Click me" />

      {/* Using different variants */}
      <Button value="Primary" variant="primary" />
      <Button value="Secondary" variant="secondary" />
      <Button value="Success" variant="success" />
      <Button value="Danger" variant="danger" />
      <Button value="Warning" variant="warning" />
      <Button value="Info" variant="info" />
      <Button value="Light" variant="light" />
      <Button value="Dark" variant="dark" />

      {/* Setting size */}
      <Button value="Small" size="small" />
      <Button value="Medium" size="medium" />
      <Button value="Large" size="large" />

      {/* Handling click events */}
      <Button value="Click me" onClick={() => alert('Button clicked!')} />

      {/* Adding custom class names */}
      <Button value="Custom Class" className="custom-class" />

      {/* Adding inline styles */}
      <Button value="Custom Style" style={{ backgroundColor: 'pink' }} />
    </div>
  );
}

export default App;


## Components

**Button**:
    # Description: A versatile button component with customizable variants and sizes.
    # Props:
        value: string (required) - Text displayed on the button.
        variant: string - Color theme (primary, secondary, success, danger, warning, info, light, dark).
        size: string - Size (small, medium, large).
        onClick: function - Event handler for click events.
        className: string - Additional CSS class names.
        style: object - Inline styles for customization.