Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/hankei6km/mdast-qrcode
convert "qrcode:" to dataURL in Image URL/alt of mdast
https://github.com/hankei6km/mdast-qrcode
markdown mdast qrcode
Last synced: about 1 month ago
JSON representation
convert "qrcode:" to dataURL in Image URL/alt of mdast
- Host: GitHub
- URL: https://github.com/hankei6km/mdast-qrcode
- Owner: hankei6km
- License: mit
- Created: 2021-05-01T10:05:32.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2021-10-24T14:59:55.000Z (about 3 years ago)
- Last Synced: 2024-11-19T13:52:20.972Z (about 2 months ago)
- Topics: markdown, mdast, qrcode
- Language: TypeScript
- Homepage:
- Size: 2.13 MB
- Stars: 0
- Watchers: 3
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# mdast-qrcode
convert a URL etc. that contained in Image / Link of [mdast](https://github.com/syntax-tree/mdast) by using [qrcode](https://www.npmjs.com/package/qrcode) package.
## Install
npm:
```
npm install mdast-qrcode
```## Usage
### `qrcode:` in URL of Image
code:
```typescript
import fromMarkdown from 'mdast-util-from-markdown';
import toMarkdown from 'mdast-util-to-markdown';
import { toImageDataURL } from './qrcode';(async () => {
const tree = fromMarkdown('# title1\n\n![alt1](qrcode:test1)\ntext1');
await toImageDataURL(tree);
console.log(toMarkdown(tree));
})();
```yield:
```markdown
# title1![alt1](data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHQAA ...snip ...=)
text1
```### `qrcode:` in alt with filename is `mdast-qrcode.*`
code:
```typescript
import fromMarkdown from 'mdast-util-from-markdown';
import toMarkdown from 'mdast-util-to-markdown';
import { toImageDataURL } from './qrcode';(async () => {
const tree = fromMarkdown(
'# title3\n\n![alt3:qrcode:test3](/path/to/mdast-qrcode.png)\ntext3'
);
await toImageDataURL(tree);
console.log(toMarkdown(tree));
})();
```yield:
```markdown
# title3![alt3](data:image/png;base64,iVBORw0KGgoAAAA ...snip ...=)
text3
```### The URL of link that surrounds image with filename is `mdast-qrcode.*`
code:
```typescript
import fromMarkdown from 'mdast-util-from-markdown';
import toMarkdown from 'mdast-util-to-markdown';
import { toImageDataURL } from './qrcode';(async () => {
const tree = fromMarkdown(
'# title5\n\n[![alt5](/path/to/mdast-qrcode.png)](url5)\ntext5'
);
await toImageDataURL(tree);
console.log(toMarkdown(tree));
})();
```yield:
```markdown
# title5[![alt5](data:image/png;base64,iVBORw0KGgoAAAAN ...snip ...=)](url5)
text5
```### Pass options from file name / alt
code:
```typescript
import fromMarkdown from 'mdast-util-from-markdown';
import toMarkdown from 'mdast-util-to-markdown';
import { toImageDataURL } from './qrcode';(async () => {
const tree = fromMarkdown(
'# title7\n\n![alt7:qrcode:test7](/path/to/mdast-qrcode-width-250.png)\n\ntext7'
);
await toImageDataURL(tree);
console.log(toMarkdown(tree));
})();
```yield:
```markdown
# title7![alt7](data:image/png;base64,iVBORw0KGgoAAAAN ...snip ...=)
text7
```qrcode options:
- margin: `-margin-`
- scale: `-scale-`
- width: `-width-`
- colorr.light: `-color_light-`
- color.dark: `-color_light-`mdqr format options:
- type: `-format_type-`
- quality: `-format_quality-` (unit: `%`)## API
### `toImageDataURL(tree[, options, mdqrOptions])`
convert "qrcode:" to dataURL in Image URL of [mdast](https://github.com/syntax-tree/mdast).
Images only support `root / paragraph / image` or `root / paragraph / link / image` hierarchy.If `image` is exist after the QRCode, that` image` will be converted as logo image.
#### options
Options are passed to [QRCode.toDataURL](https://www.npmjs.com/package/qrcode#todataurltext-options-cberror-url-1).
#### mdqrOptions
Options to mdast-qrcode.
#### `format`
Options to encode QR code to DataURL.
##### `type`
type: `png` | `jpeg`default: `png`
##### `quality`
type: `number`default: `0.92`
#### returns
`Promise`
## CLI
```console
$ cat example/qrcode-deck.md | md-qr > qrcode-embedded-deck.md
```In addition to `:qrcode` convertion, Markdown string are also affected by [toMarkdown](https://github.com/syntax-tree/mdast-util-to-markdown#tomarkdowntree-options) serialized.
### JSON config file
```json
{
"toMarkdown": { "bullet": "-", "rule": "-" }
}
````toMarkdown.bullet` / `toMarkdown.rule` field are pass to [toMarkdown](https://github.com/syntax-tree/mdast-util-to-markdown#tomarkdowntree-options).
## Live Demo
[Live Demo](https://codesandbox.io/s/github/hankei6km/mdast-qrcode-live-demo?file=/slides/slide-deck.md)
1. fork
1. edit `slides/slide-deck.md`## License
MIT License
Copyright (c) 2021 hankei6km
The word "QR Code" is registered trademark of: DENSO WAVE INCORPORATED