Markdown formatting buttons for text inputs.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
Go to file
Siddharth Kshetrapal 2ac7c7bf93
Merge pull request #81 from github/dependabot/npm_and_yarn/follow-redirects-1.15.6
2 weeks ago
.devcontainer Add a .devcontainer 2 years ago
.github/workflows Create .github/workflows/publish.yml 2 years ago
examples Implement strikethrough 3 years ago
src fix clicking on inner elements in button 4 weeks ago
test remove before each 6 months ago
.eslintrc.json Ignore ESLint rules in test file 2 years ago
.gitignore Initial commit with the basics 6 years ago
CODEOWNERS move AOR to primer 2 years ago
LICENSE Initial commit with the basics 6 years ago
README.md docs: clarify focus management in readme 4 years ago
package-lock.json Bump follow-redirects from 1.15.4 to 1.15.6 2 weeks ago
package.json Update to the latest version of mocha 2 years ago
tsconfig.json Apply suggestions from code review 4 years ago

README.md

<markdown-toolbar> element

Markdown formatting buttons for text inputs.

Installation

$ npm install --save @github/markdown-toolbar-element

Usage

import '@github/markdown-toolbar-element'
<markdown-toolbar for="textarea_id">
  <md-bold>bold</md-bold>
  <md-header>header</md-header>
  <md-italic>italic</md-italic>
  <md-quote>quote</md-quote>
  <md-code>code</md-code>
  <md-link>link</md-link>
  <md-image>image</md-image>
  <md-unordered-list>unordered-list</md-unordered-list>
  <md-ordered-list>ordered-list</md-ordered-list>
  <md-task-list>task-list</md-task-list>
  <md-mention>mention</md-mention>
  <md-ref>ref</md-ref>
  <button data-md-button>Custom button</button>
</markdown-toolbar>
<textarea id="textarea_id"></textarea>

<markdown-toolbar> comes with focus management as advised in WAI-ARIA Authoring Practices 1.1: Toolbar Design Pattern. 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 require a polyfill.

  • Chrome
  • Firefox
  • Safari
  • Microsoft Edge

Development

npm install
npm test

License

Distributed under the MIT license. See LICENSE for details.