Skip to content

The remark plugin for supporting custom heading id

License

Notifications You must be signed in to change notification settings

effector/remark-heading-id

This branch is 4 commits ahead of imcuttle/remark-heading-id:master.

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Mar 10, 2024
da8e67e · Mar 10, 2024

History

17 Commits
Mar 10, 2024
Feb 27, 2019
Feb 27, 2019
Feb 27, 2019
Feb 27, 2019
Feb 27, 2019
Mar 10, 2024
Feb 27, 2019
Mar 10, 2024
Mar 10, 2024
Mar 10, 2024
Mar 10, 2024
Mar 10, 2024
Mar 10, 2024

Repository files navigation

@effector/remark-heading-id

This is fork of the original imcuttle/remark-heading-id.

The remark plugin cannot support custom heading id because in mdx syntax like {#hello} is parsed like JSX substitutions. Default Id

npm add @effector/remark-heading-id

Custom Heading Input

### My Great Heading (#custom-id)

Custom Heading Output

<h3 id="custom-id">My Great Heading</h3>

API

import { remarkHeadingId } from '@effector/remark-heading-id';

unified().use(remarkHeadingId[, options])

options

Configuration (optional).

options.defaults

Whether to add default ids based on the title text (boolean, default: false).

options.uniqueDefaults

Whether to ensure that the default ids created by options.defaults are unique (boolean, default: true). Only relevant when options.defaults == true. Example:

## heading

### introduction

### argument

## heading

### introduction

### argument

Will generate this output when options.defaults == true and options.uniqueDefaults == true:

<h2 id="heading">heading</h2>
<h3 id="indroduction">indroduction</h3>
<h3 id="argument">argument</h3>
<h2 id="heading-1">heading</h2>
<h3 id="introduction-1">introduction</h3>
<h3 id="argument-1">argument</h3>

Instead of this output, which is generated when options.defaults == true and options.uniqueDefaults == false:

<h2 id="heading">heading</h2>
<h3 id="indroduction">indroduction</h3>
<h3 id="argument">argument</h3>
<h2 id="heading">heading</h2>
<h3 id="introduction">introduction</h3>
<h3 id="argument">argument</h3>

The difference being that the last output contains duplicate ids in the generated html, which are avoided using options.uniqueDefaults = true.

Default Heading Input
### My Great Heading
Default Heading Output
<h3 id="my-great-heading">My Great Heading</h3>

Contributing

  • Fork it!
  • Create your new branch: git checkout -b feature-new or git checkout -b fix-which-bug
  • Start your magic work now
  • Make sure npm test passes
  • Commit your changes: git commit -am 'feat: some description (close #123)' or git commit -am 'fix: some description (fix #123)'
  • Push to the branch: git push
  • Submit a pull request :)

Authors

This library is written and maintained by imcuttle, [email protected].

This library is forked and maintained by Effector Core Team and Sergey Sova.

License

MIT - imcuttle 🐟 MIT - 2024 effector

About

The remark plugin for supporting custom heading id

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 100.0%