search

valeriangalliat / markdown-it-anchor

A markdown-it plugin that adds an `id` attribute to headings and optionally permalinks.
The Unlicense
291 stars 72 forks source link

Allow custom anchor attributes #62

Closed oliverjam closed 4 years ago

oliverjam commented 4 years ago

It would be nice to be able to control what attributes are set on the anchor.

For example I'd like to set an aria-label so screenreader users get a useful name instead of whatever unicode symbol/icon is inside the anchor. This is kind of related to #58.

Rather than continually adding new options for each possible attribute could we support passing a permalinkAttrs object as an option? E.g.

const md = require('markdown-it')()
  .use(require('markdown-it-anchor'), {
    permalinkAttrs: { 'aria-label': 'heading permalink' }
  })

I think this would be relatively simple to implement:

  const linkTokens = [
    Object.assign(new state.Token('link_open', 'a', 1), {
      attrs: [
        ['class', opts.permalinkClass],
        ['href', opts.permalinkHref(slug, state)],
+       ...Object.entries(opts.permalinkAttrs)
      ]
    }),
    Object.assign(new state.Token('html_block', '', 0), { content: opts.permalinkSymbol }),
    new state.Token('link_close', 'a', -1)
  ]
nagaozen commented 4 years ago

Hi @oliverjam,

Thanks for your suggestion. Do you have a version with this feature working?! Could please make a PR?

Thank you, nagaozen

nagaozen commented 4 years ago

Closing because it's not an issue. We can continue exchanging ideas though.