@selvklart/klart-ui

Table of Contents

• Installation
• Stylesheet
• Usage
• Documentation
• Customization
• Contributing
• Changelog
• Roadmap

---

Installation

# npm
npm install @selvklart/klart-ui

# yarn
yarn add @selvklart/klart-ui

Stylesheet

To begin with, you will need to import the bundle.css CSS file provided by the package. This import should be placed at the root of your project, specifically in the index.js or App.tsx file of your React application. The import statement will resemble the following code snippet:

import '@selvklart/klart-ui/dist/bundle.css';

Usage

To use the components from @selvklart/klart-ui, you can import them into your React components and start using them in your JSX code.

Here's an example of using the PreviewBar component:

import React from 'react';
import { PreviewBar } from '@selvklart/klart-ui';

const MyComponent = () => {
	const handleClick = () => {
		// Handle click event
	};

	const loading = false;

	return (
		<PreviewBar
			onClick={handleClick}
			loading={loading}
			title='Forhåndsvisningsmodus aktivert.'
			description='Du ser på utkast til innhold.'
			buttonText='Avslutt forhåndsvisningsmodus'
			buttonLoadingText='Avslutter forhåndsvisningsmodus'
			variant='default'
		/>
	);
};

export default MyComponent;

Make sure to replace MyComponent with the actual name of your component.

Documentation

For more detailed documentation, including a list of available components, their props, and usage examples, please refer to the official documentation (under construction).

Customization

@selvklart/klart-ui components are designed to be easily customizable to match your project's style and branding. You can override the default styles by targeting the specific CSS classes or by using CSS-in-JS techniques.

Contributing

Contributions to @selvklart/klart-ui are welcome! If you'd like to contribute, please follow the guidelines in CONTRIBUTING.md (under construction).

Changelog

You can find the list of changes, bug fixes, and new features in the changelog (under construction).

Roadmap

We don't have any specific features or enhancements planned at the moment.