@stianlarsen/react-ui-kit

React UI Kit

A versatile React UI kit focused on delivering ready-to-use, customizable buttons for every use case. Designed to save developers time and streamline UI development, this kit offers a range of button styles and loaders, ensuring immediate integration and thematic coherence across projects.

Features

• Customizable Button Components: Easily adaptable button components for various use cases including primary, secondary, destructive, and loading states.
• Loader Component: A sleek loader component for indicating processing or loading states, perfectly matching the button aesthetics.
• Ease of Use: Designed for developers who need quick, reliable UI components without the hassle of creating them from scratch.
• Thematic Consistency: All components are designed with a cohesive look and feel, making it easy to maintain visual consistency throughout your application.

Installation

Install the package using npm:

npm install @stianlarsen/react-ui-kit

Or using yarn:

yarn add @stianlarsen/react-ui-kit

Usage

Button

Import and use the Button component in your React project:

import { Button } from "@stianlarsen/react-ui-kit";

function App() {
  return <Button variant="primary">Click Me</Button>;
}

Loader

Import and use the Loader component to indicate loading state:

import { Loader } from "@stianlarsen/react-ui-kit";

function App() {
  return <Loader />;
}

Customization

Override the CSS variables in your project's stylesheet to customize the appearance of the components:

:root {
  --button-primary: #007bff;
  --button-primary-hover: #0056b3;
  --button-foreground: #ffffff;
  /* Add more customizations here */
}

Contributing

Contributions are always welcome! Please read the contributing guide before making a pull request.

License

This project is licensed under the MIT License.

Contact

For any questions or suggestions, feel free to reach out.

• GitHub: @stianlars1
• Website: https://stianlarsen.com
• [e-mail]