1- # remark-attr
1+ # ` remark-attr `
22
33This plugin adds support for custom attributes to Markdown syntax.
44
55For ** security reasons** , this plugin uses [ html-element-attributes] ( https://github.com/wooorm/html-element-attributes ) .
66The use of JavaScript attributes (` onload ` for example) is not allowed by default.
77
8-
98## Default Syntax
109
11- Images :
10+ ### Images
1211
1312~~~ markdown
1413![ alt] ( img ) {attrs} / ![ alt] ( img ) { height=50 }
1514~~~
1615
16+ ### Links
1717
18- Links :
1918~~~ markdown
2019[ rms with a computer] ( https://rms.sexy ) {rel="external"}
2120~~~
2221
23-
24- Autolink :
22+ ### Autolink
2523
2624~~~ markdown
2725Email me at : < mailto:falseEmail@example.org >
2826~~~
2927
30-
31- Header (Atx) :
28+ ### Header (Atx)
3229
3330~~~ markdown
3431### This is a title
4138If option enableAtxHeaderInline is set to ` true ` (default value).
4239~~~
4340
41+ ### Header
4442
45- Header :
4643~~~ markdown
4744This is a title
4845---------------
4946{style="color: pink;"}
5047~~~
5148
52- Emphasis :
49+ ### Emphasis
5350
5451~~~ markdown
5552Npm stand for * node* {style="color: red "} packet manager.
5653~~~
5754
58-
59- Strong :
55+ ### Strong
6056
6157~~~ markdown
6258This is a ** Unicorn** {awesome} !
6359~~~
6460
65- Delete :
61+ ### Delete
6662
6763~~~ markdown
6864Your problem is ~~ at line 18~~ {style="color: grey"}. My mistake, it's at line 14.
65+ ~~~
6966
70-
71- Code :
67+ ### Code
7268
7369~~~ markdown
7470You can use the ` fprintf ` {language=c} function to format the output to a file.
7571~~~
7672
77-
78- Footnote (using [ remark-footnotes] ( https://github.com/remarkjs/remark-footnotes ) ) :
73+ ### Footnote (using [ remark-footnotes] ( https://github.com/remarkjs/remark-footnotes ) )
7974
8075~~~ markdown
8176This is a footnote[ ^ ref ] {style="opacity: 0.8;"}
@@ -84,43 +79,21 @@ This is a footnote[^ref]{style="opacity: 0.8;"}
8479[ ^ ref ] : And the reference.
8580~~~
8681
87-
8882## rehype
8983
90- At the moment it aims is to be used with [ rehype] [ rehype ] only, using remark-rehype.
84+ At the moment it aims is to be used with ` rehype ` only, using remark-rehype.
9185
9286~~~ md
9387[ rms with a computer] ( https://rms.sexy ) {rel=external}
9488~~~
9589
96- produces :
90+ Produces :
9791
9892~~~ html
9993<a href =" https://rms.sexy" rel =" external" >rms with a computer</a >
10094~~~
10195
102-
103- ## Installation
104-
105- [ npm] [ npm ] :
106-
107- ~~~ bash
108- npm install remark-attr
109- ~~~
110-
111-
112- ## Dependencies:
113-
114- ~~~ javascript
115- const unified = require (' unified' )
116- const remarkParse = require (' remark-parse' )
117- const stringify = require (' rehype-stringify' )
118- const remark2rehype = require (' remark-rehype' )
119- const remarkAttr = require (' remark-attr' )
120- ~~~
121-
122-
123- ## Usage:
96+ ## Usage
12497
12598~~~ javascript
12699const testFile = `
@@ -141,84 +114,53 @@ unified()
141114 } )
142115~~~
143116
144-
145- Output :
117+ Output:
146118
147119~~~ shell
148120$ node index.js
149121< p> Here a test :< /p>
150122< p><img src=" https://ache.one/res/ache.svg" alt=" ache avatar" height=" 100" ></p>
151123~~~
152124
125+ ## Options
153126
154- ## API
155-
156- ### ` remarkAttr([options]) `
157-
158- Parse attributes of markdown elements.
159-
160- #### ` remarkAttr.SUPPORTED_ELEMENTS `
161-
162- The list of currently supported elements.
163-
164- ` ['link', 'atxHeading', 'strong', 'emphasis', 'deletion', 'code', 'setextHeading'] `
165-
166- ` ['link', 'atxHeading', 'strong', 'emphasis', 'deletion', 'code', 'setextHeading', 'fencedCode', 'reference', 'footnoteCall', 'autoLink'] `
167-
168- ##### Options
169-
170- ###### ` options.allowDangerousDOMEventHandlers `
127+ ### ` options.allowDangerousDOMEventHandlers `
171128
172129Whether to allow the use of ` on-* ` attributes. They are depreciated and disabled by default for security reasons. Its a boolean (default: ` false ` ).
173130If allowed, DOM event handlers will be added to the ** global scope** .
174131
175- ###### ` options.elements `
132+ ### ` options.elements `
176133
177134The list of elements which the attributes should be parsed.
178135It's a list of string, a sub-list of ` SUPPORTED_ELEMENTS ` .
179- If you are confident enough you can add the name of a tokenizer that isn't officialy supported but remember that it will not have been tested.
136+ If you are confident enough you can add the name of a tokenizer that isn't officially supported but remember that it will not have been tested.
180137
181- ###### ` options.extend `
138+ ### ` options.extend `
182139
183140An object that extends the list of attributes supported for some elements.
184141
185142Example : ` extend: {heading: ['original', 'quality', 'format', 'toc']} `
186143
187144With this configuration, if the scope permits it, 4 mores attributes will be supported for atxHeading elements.
188145
189- ###### ` options.scope `
146+ ### ` options.scope `
190147
191- A string with the value ` global ` or ` specific ` or ` extented ` or ` none ` or ` every ` .
148+ A string with the value ` global ` or ` specific ` or ` extended ` or ` none ` or ` every ` .
192149
193- - ` none ` will disable the plugin.
194- - ` global ` will activate only the global attributes.
195- - ` specific ` will activate global and specific attributes.
196- - ` extended ` will add personalized tags for some elements.
197- - ` permissive ` or ` every ` will allow every attributes (except dangerous one) on every elements supported.
150+ - ` none ` will disable the plugin.
151+ - ` global ` will activate only the global attributes.
152+ - ` specific ` will activate global and specific attributes.
153+ - ` extended ` will add personalized tags for some elements.
154+ - ` permissive ` or ` every ` will allow every attributes (except dangerous one) on every elements supported.
198155
199- ###### ` options.enableAtxHeaderInline `
156+ ### ` options.enableAtxHeaderInline `
200157
201158Whether to allow atx headers with attributes on the same line.
202159
203160~~~ md
204161### This is a title {style="color: yellow ;"}
205162~~~
206163
207- ## How does it works ?
208-
209- This plugin extend the syntax of [ remark-parse] [ remark-parse ] by replacing old tokenizers by new one.
210- The new tokenizers functions re-use the old tokenizers and [ md-attr-parser] [ md-attr-parser ] to parse the extended syntax.
211-
212- So ` option.SUPPORTED_ELEMENTS ` are the names of the tokenizers and neither arbitrary names nor HTML tag names.
213- Here is the [ related documentation] [ doc ] .
214-
215-
216- ## License
217-
218- Distributed under a MIT license.
164+ ### ` option.SUPPORTED_ELEMENTS `
219165
220- [ npm ] : https://www.npmjs.com/package/remark-attr
221- [ rehype ] : https://github.com/wooorm/rehype
222- [ remar-parse ] : https://github.com/remarkjs/remark/tree/master/packages/remark-parse
223- [ md-attr-parser ] : https://github.com/arobase-che/md-attr-parser
224- [ doc ] : https://github.com/remarkjs/remark/tree/master/packages/remark-parse#extending-the-parser
166+ The names of the tokenizers and neither arbitrary names nor HTML tag names.
0 commit comments