The Markdown Editor lets users quickly edit markdown text. It provides a toolbar with common actions, such as bolding text without having to remember the exact syntax.
Anatomy
Anatomy summary lists and describes all the elements within a component (including nested components).
|
Element |
Description |
Optional? |
|---|---|---|
|
1. Toolbar |
Displays common actions as Buttons, such as bolding text without having to remember the exact syntax. |
No |
|
2. Format button |
Buttons for common actions: |
No |
|
3. Markdown text |
Text user types that appears as markdown. |
No |
|
4. Field |
Input area that contains markdown text. |
No |
|
5. MarkdownToggle |
A Button to hide Markdown Editor and transform back to a simple field, like Text Field or Textarea. |
Yes |
|
6. Link |
Link to Github docs for instructions on basic writing and formatting syntax. |
No |
Variants
Variants contain different versions of the component depending on specific properties, such as state, size, colour, optional iconography, etc.
| Property | Values | Default |
|---|---|---|
| state Variant | rest | hover | rest |
| hasMarkdownToggle Boolean | true | false | true |
| isDisabled Variant | false | true | false |
Component dependencies
This component is internally dependent on the following components:
Help and support