konfhub-design-system v1.1.50

KonfHub Design System

This contains the design system and components needed for KonfHub platform

Installation

npm install konfhub-design-system

If you are facing any issues during the installation please use --legacy-peer-deps option.

Usage

Essentially there are two modules that you can import from the package:

• konfhub-design-system/themes
• konfhub-design-system/components

Themes

Core themes are available under the core key. You can import them like this:

import { core } from "konfhub-design-system/themes";

Website themes are available under the website key. You can import them like this:

import { website } from "konfhub-design-system/themes";

Dashboard themes are available under the dashboard key. You can import them like this:

import { dashboard } from "konfhub-design-system/themes";

Components

An example of a component can be imported like this:

import { Sample } from "konfhub-design-system/components";

Available components can be found here

Addition of new components

Adding a new component is a three step process:

1. Add the component to the src/components folder
2. Add the component to the src/components/index.ts file
3. Modify package.json to include the new component in exports and similarly in vite.config.ts

If you are facing any issues please reach out to us on GitHub