docs(snippet): add docs for custom symbol and toast

This commit is contained in:
Augusto
2020-06-23 20:34:30 -03:00
committed by unix
parent c9f80e21b0
commit cbe289bb83

View File

@@ -65,6 +65,22 @@ Display a snippet of copyable code for the command line.
`}
/>
<Playground
title="custom symbol"
scope={{ Snippet }}
code={`
<Snippet symbol=">" text="yarn add @zeit-ui/react" width="300px" />
`}
/>
<Playground
title="custom toast"
scope={{ Snippet }}
code={`
<Snippet toastText="Code copied!" toastType="secondary" text="yarn add @zeit-ui/react" width="300px" />
`}
/>
<Playground
title="filled"
scope={{ Snippet, Spacer }}
@@ -84,14 +100,17 @@ Display a snippet of copyable code for the command line.
<Attributes edit="/pages/en-us/components/snippet.mdx">
<Attributes.Title>Snippet.Props</Attributes.Title>
| Attribute | Description | Type | Accepted values | Default |
| ---------- | ----------------------- | ----------------------------- | -------------------------------- | --------- |
| **text** | code snippet | `string` `Array<string>` | - | - |
| **type** | snippet types | [SnippetTypes](#snippettypes) | [SnippetTypes](#snippettypes) | `default` |
| **filled** | filled style | `boolean` | - | `false` |
| **width** | set CSS string | `string` | - | `initial` |
| **copy** | function of copy button | `CopyTypes` | `'default', 'slient', 'prevent'` | `default` |
| ... | native props | `HTMLAttributes` | `'id', 'name', 'className', ...` | - |
| Attribute | Description | Type | Accepted values | Default |
| ------------- | ----------------------- | ----------------------------- | ------------------------------------------------------- | ---------------------- |
| **text** | code snippet | `string` `Array<string>` | - | - |
| **type** | snippet types | [SnippetTypes](#snippettypes) | [SnippetTypes](#snippettypes) | `default` |
| **filled** | filled style | `boolean` | - | `false` |
| **width** | set CSS string | `string` | - | `initial` |
| **copy** | function of copy button | `CopyTypes` | `'default', 'slient', 'prevent'` | `default` |
| **symbol** | symbol snippet | `string` | - | `$` |
| **toastText** | toast text | `string` | - | `Copied to clipboard!` |
| **toastType** | toast type | `NormalTypes` | `'default', 'secondary', 'success', 'warning', 'error'` | `success` |
| ... | native props | `HTMLAttributes` | `'id', 'name', 'className', ...` | - |
<Attributes.Title>SnippetTypes</Attributes.Title>