Socket
Socket
Sign inDemoInstall

@kaizen/component-library

Package Overview
Dependencies
18
Maintainers
10
Versions
410
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

@kaizen/component-library

Component Library for Culture Amp's Kaizen Design System


Version published
Maintainers
10
Weekly downloads
38,255
increased by50.17%

Weekly downloads

Readme

Source

Kaizen Component Library

Kaizen components live in two places:

  1. The core Kaizen component library (@kaizen/component-library)
  2. Individual draft component packages

To live in the core component library, a component must satisfy a number of quality checks including tests and accessibility standards.

All components that do not yet meet these standards live in their own individual draft component packages.

To find component usage docs in Storybook, click on the blue Show Info button at the bottom of a story for a component, revealing the name of the npm package for that component.

Add to a new project

Kaizen Component Library is already included in our main product repositories. If it's needed in a new repo, add @kaizen/component-library to your package.json file:

yarn add @kaizen/component-library

If you'd like to use a draft component, you include that package individually:

yarn add @kaizen/draft-well

Usage

You can import a Kaizen Component Library package inside your application using React.

React import example:

import { Button } from "@kaizen/component-library"

// draft component
import { Well } from "@kaizen/draft-well"

React usage example:

ReactDOM.render(
  <Card>
    <Button label="Example button" onClick={() => alert('Button clicked!')} />
  </Card>
  , document.querySelector('#app'),
);

You can also import Kaizen styles into SCSS files:

@import '~@kaizen/component-library/styles/type';

Contributing

To contribute to the component library, see the Contributing guidelines.

FAQs

Last updated on 14 Mar 2024

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc