Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/github/markdown-toolbar-element
Markdown formatting buttons for text inputs.
https://github.com/github/markdown-toolbar-element
custom-elements markdown web-components
Last synced: about 18 hours ago
JSON representation
Markdown formatting buttons for text inputs.
- Host: GitHub
- URL: https://github.com/github/markdown-toolbar-element
- Owner: github
- License: mit
- Created: 2018-06-11T18:33:24.000Z (over 6 years ago)
- Default Branch: main
- Last Pushed: 2024-10-11T05:48:34.000Z (3 months ago)
- Last Synced: 2025-01-02T14:07:30.833Z (8 days ago)
- Topics: custom-elements, markdown, web-components
- Language: JavaScript
- Homepage: https://github.github.com/markdown-toolbar-element/examples/
- Size: 1.11 MB
- Stars: 362
- Watchers: 281
- Forks: 57
- Open Issues: 5
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Codeowners: CODEOWNERS
Awesome Lists containing this project
README
# <markdown-toolbar> element
Markdown formatting buttons for text inputs.
## Installation
```
$ npm install --save @github/markdown-toolbar-element
```## Usage
```js
import '@github/markdown-toolbar-element'
``````html
bold
header
italic
quote
code
link
image
unordered-list
ordered-list
task-list
mention
ref
Custom button```
`` comes with focus management as advised in [WAI-ARIA Authoring Practices 1.1: Toolbar Design Pattern](https://www.w3.org/TR/wai-aria-practices-1.1/examples/toolbar/toolbar.html). The `md-*` buttons that ship with this package are automatically managed. Add a `data-md-button` attribute to any custom toolbar items to enroll them into focus management.
## Browser support
Browsers without native [custom element support][support] require a [polyfill][].
- Chrome
- Firefox
- Safari
- Microsoft Edge[support]: https://caniuse.com/#feat=custom-elementsv1
[polyfill]: https://github.com/webcomponents/custom-elements## Development
```
npm install
npm test
```## License
Distributed under the MIT license. See LICENSE for details.