IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Storybook: Add docs to Cascader (#27336)

Browse Source 
* Storybook: Add docs to Cascader

Added description for cascader component

* Update packages/grafana-ui/src/components/Cascader/Cascader.mdx

Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com>

Co-authored-by: Alex Khomenko <Clarity-89@users.noreply.github.com>
This commit is contained in:
Jess 2020-09-03 09:08:09 +02:00 committed by GitHub
parent d633cc3c09
commit 0b6ea4c0ef
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 7 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
packages/grafana-ui/src/components/Cascader/Cascader.mdx
View File

@ -1,8 +1,12 @@
import { Meta, Story, Preview, Props } from '@storybook/addon-docs/blocks';
import { Cascader } from './Cascader';
# Cascader with search
<Meta title="MDX|Cascader" component={Cascader} />
<Props of={Cascader}/>
# Cascader
The cascader component is a `Select` with a cascading flyout menu. When you have lots of options in your select, they can be hard to navigate from a regular dropdown list. In that case you can use the cascader to organize your options into groups hierarchically. Just like in the `Select` component, the cascader input doubles as a search field to quickly jump to a selection without navigating the list.
You can either use the `Simple` cascader component for an empty input as default state or use the `initialValue` or `allowCustomValue` fields to pre-fill your cascader. Initial value means that one of the options from your cascaded list is pre-selected. Custom value means that apart from existing options from the list, your users can add custom values to the list by typing them in the `Select` input.
<Props of={Cascader}/>