luxolus
/
open-consul
2
0
Fork 0
Code Issues 1 Pull Requests Packages Releases Wiki Activity
open-consul/ui/packages/consul-ui/app/components/copy-button/README.mdx

46 lines
1.2 KiB
Plaintext
Raw Normal View History

ui: Remove storybook, add docfy (#9831) This PR removes storybook and adds docfy and uses docfy to render our existing README files. This now means we can keep adding README documentation without committing any specific format or framework. If we eventually move to storybook then fine, or if we just want to remove docfy for whatever reason then fine - we will still have a full set of README files viewable via GitHub.
2021-03-08 12:22:01 +00:00
# CopyButton
ui: Renames CopyButtonFeedback to CopyButton and use it everywhere (#7834) * ui: Renames CopyButtonFeedback to CopyButton and use it everywhere * Uncapitalize output * Remove the ability to set the contents via an attr, and.. ..change the attribute for the string that gets copied to be called 'value' so it feels like HTML
2020-05-12 12:36:03 +00:00
ui: CopyButton amends (#10511) * ui: Add with-copyable modifier * Use with-copyable modifier for our own CopyButton * Move copy-button styling and remove most of `copy-btn`
2021-07-06 15:56:36 +00:00
Button component used for copy-to-clipboard functionality so the user can easily copy specified text to their clipboard, along with tooltip-like notifications so the user has some sort of feedback to know the value has been copied.
This component is essentially a composition of our `{{with-copyable}}` modifier, our `{{tooltip}}` modifier plus specific Consul-flavored visual treatment. This is all glued together with our `<StateChart />` component to manage states.
Can be used inline to render only a small icon for the button with no other text.
ui: Remove storybook, add docfy (#9831) This PR removes storybook and adds docfy and uses docfy to render our existing README files. This now means we can keep adding README documentation without committing any specific format or framework. If we eventually move to storybook then fine, or if we just want to remove docfy for whatever reason then fine - we will still have a full set of README files viewable via GitHub.
2021-03-08 12:22:01 +00:00
```hbs preview-template
ui: CopyButton amends (#10511) * ui: Add with-copyable modifier * Use with-copyable modifier for our own CopyButton * Move copy-button styling and remove most of `copy-btn`
2021-07-06 15:56:36 +00:00
<figure>
<figcaption>Icon only</figcaption>
<CopyButton
@value={{'stringToCopy'}}
@name="Thing"
/>
</figure>
<figure>
<figcaption>Icon and text</figcaption>
<CopyButton
@value={{'stringToCopy'}}
@name="Thing"
>
Copy me!
</CopyButton>
</figure>
ui: Renames CopyButtonFeedback to CopyButton and use it everywhere (#7834) * ui: Renames CopyButtonFeedback to CopyButton and use it everywhere * Uncapitalize output * Remove the ability to set the contents via an attr, and.. ..change the attribute for the string that gets copied to be called 'value' so it feels like HTML
2020-05-12 12:36:03 +00:00
```
ui: CopyButton amends (#10511) * ui: Add with-copyable modifier * Use with-copyable modifier for our own CopyButton * Move copy-button styling and remove most of `copy-btn`
2021-07-06 15:56:36 +00:00
## Arguments
ui: Renames CopyButtonFeedback to CopyButton and use it everywhere (#7834) * ui: Renames CopyButtonFeedback to CopyButton and use it everywhere * Uncapitalize output * Remove the ability to set the contents via an attr, and.. ..change the attribute for the string that gets copied to be called 'value' so it feels like HTML
2020-05-12 12:36:03 +00:00
| Argument | Type | Default | Description |
| --- | --- | --- | --- |
| `value` | `String` | | The string to be copied to the clipboard on click |
ui: CopyButton amends (#10511) * ui: Add with-copyable modifier * Use with-copyable modifier for our own CopyButton * Move copy-button styling and remove most of `copy-btn`
2021-07-06 15:56:36 +00:00
| `name` | `String` | | The 'Name' of the string to be copied. Mainly used for accessibility reasons and giving feedback to the user |
ui: Renames CopyButtonFeedback to CopyButton and use it everywhere (#7834) * ui: Renames CopyButtonFeedback to CopyButton and use it everywhere * Uncapitalize output * Remove the ability to set the contents via an attr, and.. ..change the attribute for the string that gets copied to be called 'value' so it feels like HTML
2020-05-12 12:36:03 +00:00
ui: CopyButton amends (#10511) * ui: Add with-copyable modifier * Use with-copyable modifier for our own CopyButton * Move copy-button styling and remove most of `copy-btn`
2021-07-06 15:56:36 +00:00
## See
ui: Renames CopyButtonFeedback to CopyButton and use it everywhere (#7834) * ui: Renames CopyButtonFeedback to CopyButton and use it everywhere * Uncapitalize output * Remove the ability to set the contents via an attr, and.. ..change the attribute for the string that gets copied to be called 'value' so it feels like HTML
2020-05-12 12:36:03 +00:00
- [Component Source Code](./index.js)
- [Template Source Code](./index.hbs)
---