/docz-knobs

🎛 Knobs component to demo your React creations with Docz

Primary LanguageTypeScript

NPM build

🎛 docz-knobs

Knobs component set to use with your docz based documents!

Docz is a great MDX based framework for documenting your libraries and projects. With this simple Knobs component it enables even more features as in renders helper knobs/switches for your component to make the demo even more rebust and accessible! is a

🛠 Install

yarn add docz-knobs

npm install --save docz-knobs

📟 Usage

Simply wrap your component in MDX file with the Knobs component.

import * as React from "react";
import Knobs from "docz-knobs";

import { Button } from "./Button";

<Knobs
  options={{
    scale: ["small", "normal", "big"],
    kind: ["primary", "secondary", "cancel", "dark", "gray"]
  }}
>
  <Button>Click me</Button>
</Knobs>;

Example Image

For complex types you need to specify available values with options prop.

License

MIT © matmalkowski