import { Markdown, Meta, Title, Subtitle, Description, Primary, Controls, Stories, Source } from "@storybook/blocks";
import { getSource } from "../../utils/storybook.ts";

import * as stories from "./stories.ts";
import defaultConfig from "../config.ts?raw"

<Meta of={stories} />
<Title of={stories} />
<Subtitle of={stories} />
<Description of={stories} />
<Primary of={stories}  />
<Controls of={stories.Default} />
<Stories of={stories} />

## Option meta keys
Keys you may/have to provide to the component in an option object.

<Markdown>
{`
|  Key name         | Description                        | Type           |
| ------------------| ---------------------------------- | ---------------|
| id                | A unique identifier for option     | String, Number |
| label             | Option label                       | String         |
| isHidden          | Indicates if option is hidden      | Boolean        |
| isSubGroup        | Indicates if option is subGroup    | Boolean        |
| groupLabel        | Option group label                 | String         |
| level             | Indicates option nesting level     | Number         |
| divider           | Adds divider instead of option     | Boolean        |
| onClick           | Option event handler               | Function       |        
`}
</Markdown>

## Default config
<Source code={getSource(defaultConfig)} language="jsx" dark />