This project is not maintained anymore :(

Overview

React Design System. I'm certainly crazy but I want to create my own UI Framework to develop React applications faster. I will regularly update this readme to show the new components. I'll see what it gives. I'm not in a hurry. A better documentation will come soon. If you like it, feel free to star this repo ! :3

Demo

Check this out and have fun : https://codesandbox.io/s/n15n00o8z4

Screenshots

Installation and usage

Install package :

npm install a119

Import one component :

import { Avatar } from "a119";

Or multiple components :

import { Avatar, AvatarGroup } from "a119";

Props

Avatar

Prop	Default	Required	Type	Example
src	X	Yes	string	X
alt	X	Yes	string	X
size	medium	No	string	tiny small medium large big
variant	circle	No	string	square circle
presence	X	No	string	online busy away focus offline
onClick	X	No	function	() => alert("Hello world !");
className	X	No	string	X

AvatarGroup

Soon !

Badge

Prop	Default	Required	Type	Example
value	X	Yes	number	X
type	secondary	No	string	primary secondary success warning danger help

Button

Prop	Default	Required	Type	Example
text	X	Yes	string	X
type	secondary	No	string	primary secondary success warning danger help
variant	X	No	string	outlined dashed link
className	X	No	string	X
isDisabled	false	No	boolean	true false
isLoading	false	No	boolean	true false
onClick	X	No	function	() => alert("Hello world !");
fullwidth	false	No	boolean	true false

ButtonGroup

Soon !

Switch

Soon !

TextField

Prop	Default	Required	Type	Example
name	X	No	string	X
value	X	No	string	X
placeholder	X	No	string	X
className	X	No	string	X
isDisabled	false	No	boolean	true false
helperText	X	No	string	X
error	false	No	boolean	true false
success	false	No	boolean	true false
fullwidth	false	No	boolean	true false
onBlur	X	No	function	() => alert("Hello world !");
onChange	X	No	function	() => alert("Hello world !");

Star, Fork, Clone & Contribute

Feel free to contribute on this repository. If my work helps you, please give me back with a star. This means a lot to me and keeps me going!