Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/github/quote-selection
Install a shortcut to append selected text to a <textarea> as a Markdown quote.
https://github.com/github/quote-selection
decorator keep markdown
Last synced: about 1 month ago
JSON representation
Install a shortcut to append selected text to a <textarea> as a Markdown quote.
- Host: GitHub
- URL: https://github.com/github/quote-selection
- Owner: github
- License: mit
- Created: 2018-07-05T22:20:17.000Z (over 6 years ago)
- Default Branch: main
- Last Pushed: 2024-07-23T02:32:39.000Z (4 months ago)
- Last Synced: 2024-09-30T00:06:05.650Z (about 2 months ago)
- Topics: decorator, keep, markdown
- Language: TypeScript
- Homepage:
- Size: 1.06 MB
- Stars: 31
- Watchers: 180
- Forks: 7
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Codeowners: CODEOWNERS
Awesome Lists containing this project
README
# Quote selection
Helpers for quoting selected text, appending the text into a `` as a Markdown quote.
## Installation
```
$ npm install @github/quote-selection
```## Usage
```html
Text to quote
``````js
import {Quote} from '@github/quote-selection'document.addEventListener('keydown', event => {
if (event.key == 'r') {
const quote = new Quote()
if (quote.closest('.my-quote-region')) {
quote.insert(document.querySelector('textarea'))
}
}
})
````Quote` will take the currently selected HTML from the specified quote region, convert it to markdown, and create a quoted representation of the selection.
`insert` will insert the string representation of a selected text into the specified text area field.
### Preserving Markdown syntax
```js
const quote = new MarkdownQuote('.comment-body')
quote.select(document.querySelector('.comment-body'))
if (quote.closest('.my-quote-region')) {
quote.insert(quote, document.querySelector('textarea'))
}
```Using `MarkdownQuote` instead of `Quote` will ensure markdown syntax is preserved.
The optional `scopeSelector` parameter of `MarkdownQuote` ensures that even if the user selection bleeds outside of the scoped element, the quoted portion will always be contained inside the scope. This is useful to avoid accidentally quoting parts of the UI that might be interspersed between quotable content.
## Development
```
npm install
npm test
```## License
Distributed under the MIT license. See LICENSE for details.