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

Add docs for TagsInput (#27881)

Browse Source 
* Add docs for TagsInput

* Add import to TagsInput.story.tsx

* Update packages/grafana-ui/src/components/TagsInput/TagsInput.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-29 13:30:57 +02:00 committed by GitHub
parent b995381816
commit 339ef7a1a8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 14 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
packages/grafana-ui/src/components/TagsInput/TagsInput.mdx Normal file
View File

@ -0,0 +1,8 @@
import { Meta, Story, Preview, Props } from '@storybook/addon-docs/blocks';
import { TagsInput } from './TagsInput';
<Meta title="MDX|TagsInput" component={TagsInput} />
# TagsInput
A set of an input field and a button next to it that allows the user to add new tags. The added tags are previewed under the input and can be removed there by clicking the "X" icon. You can customize the width of the input.

6
packages/grafana-ui/src/components/TagsInput/TagsInput.story.tsx
View File

@ -3,6 +3,7 @@ import { action } from '@storybook/addon-actions';
import { withCenteredStory } from '../../utils/storybook/withCenteredStory';
import { UseState } from '../../utils/storybook/UseState';
import { TagsInput } from '@grafana/ui';
import mdx from './TagsInput.mdx';
const mockTags = ['Some', 'Tags', 'With', 'This', 'New', 'Component'];
@ -10,6 +11,11 @@ export default {
title: 'Forms/TagsInput',
component: TagsInput,
decorators: [withCenteredStory],
parameters: {
docs: {
page: mdx,
},
},
};
export const basic = () => {