kinetic-ui

react opionionated component library for developers

Documentation

kinetic-ui was created to speed up development time while maintaining flexibility. This library is opionionated and wasn't built to do everything for you. Most of the components can be interchangable and are not limited to the combination that has been put together inside the library.

The documentation is sparse but will be growing constantly. A lot of the core components are available and there will be more to come.

check out the documentation here

Install

yarn add kinetic-ui

// requires fontawesome icons
yarn add @fortawesome/fontawesome-svg-core
yarn add @fortawesome/free-solid-svg-icons
yarn add @fortawesome/free-regular-svg-icons
yarn add @fortawesome/free-brands-svg-icons

Usage

import React from "react";
import ReactDOM from "react-dom";
import { ThemeProvider, Button } from "kinetic-ui";
import "kinetic-ui/dist/index.css";

// fontawesome for icons
import { library } from "@fortawesome/fontawesome-svg-core";
import { fas } from "@fortawesome/free-solid-svg-icons";
import { far } from "@fortawesome/free-regular-svg-icons";
import { fab } from "@fortawesome/free-brands-svg-icons";

library.add(far, fas, fab);

const App = () => {
  return <Button>Button!</Button>;
};

const render = (Component) =>
  ReactDOM.render(
    <ThemeProvider default_theme="cyprus">
      <Component />
    </ThemeProvider>,
    document.getElementById("root")
  );

render(App);

Basic Table

Table Scroll

Dropdowns

Basic Calendar

Calendar Presets

Calendar Range

Buttons

Inputs

License

MIT ©