Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update README #5

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
48 changes: 8 additions & 40 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,55 +1,23 @@
# Dashboard UI Components
# Kabisa UI Components

Component set to easily build settings screens.
UI Component library containing basic components in Kabisa brand styling. This is by no means a fully matured component library,
so feel free to contribute!

# Running storybook

```sh
yarn storybook
yarn start
```

# Using components from this package

In your project:
Adding it to your project:

```sh
yarn add @dashboard-platform/ui-components
yarn add @kabisa/ui-components
```

In your Widget Settings Renderer:
Importing components:

```ts
import { SlideToggle } from "@dashboard-platform/ui-components";
import { SlideToggle } from "@kabisa/ui-components";
```

# Components / Elements list:

## Done

_Nothing yet_

## Usable, no styling

- Slide Toggle

## Missing

- Label
- Orderable list
- List card
- Select

# How to build components

Most of the components could be simple wrappers around standard HTML components, mainly adding a consistent styling or more easy to use technical interface.

For more complex components please check out if there is a suitable 'headless' component available, that we can style to our needs.

Sites to check out for nice components:

- https://reactjsexample.com/

Some components I really liked and would recommend when needed:

- Tree component: https://github.com/brimdata/react-arborist
- Menu system: https://szhsin.github.io/react-menu/