Repository: markedjs/marked
Branch: master
Commit: d4c0fe58716e
Files: 411
Total size: 881.5 KB
Directory structure:
gitextract_6red701u/
├── .devcontainer/
│ └── devcontainer.json
├── .editorconfig
├── .gitattributes
├── .github/
│ ├── ISSUE_TEMPLATE/
│ │ ├── Bug_report.md
│ │ ├── Feature_request.md
│ │ └── Proposal.md
│ ├── ISSUE_TEMPLATE.md
│ ├── PULL_REQUEST_TEMPLATE/
│ │ └── badges.md
│ ├── PULL_REQUEST_TEMPLATE.md
│ ├── dependabot.yml
│ └── workflows/
│ └── tests.yml
├── .gitignore
├── .releaserc.json
├── CHANGELOG.md
├── LICENSE.md
├── README.md
├── SECURITY.md
├── api/
│ └── dingus.js
├── bin/
│ ├── main.js
│ └── marked.js
├── docs/
│ ├── .eslintrc.json
│ ├── AUTHORS.md
│ ├── CODE_OF_CONDUCT.md
│ ├── CONTRIBUTING.md
│ ├── INDEX.md
│ ├── PUBLISHING.md
│ ├── USING_ADVANCED.md
│ ├── USING_PRO.md
│ ├── _document.html
│ ├── broken.md
│ ├── build.js
│ ├── css/
│ │ ├── hljs-github-dark.css
│ │ ├── hljs-github.css
│ │ ├── shared.css
│ │ └── style.css
│ ├── demo/
│ │ ├── demo.css
│ │ ├── demo.js
│ │ ├── index.html
│ │ ├── initial.md
│ │ ├── preview.html
│ │ ├── quickref.md
│ │ └── worker.js
│ └── js/
│ └── index.js
├── esbuild.config.js
├── eslint.config.js
├── man/
│ └── marked.1.md
├── package.json
├── src/
│ ├── Hooks.ts
│ ├── Instance.ts
│ ├── Lexer.ts
│ ├── MarkedOptions.ts
│ ├── Parser.ts
│ ├── Renderer.ts
│ ├── TextRenderer.ts
│ ├── Tokenizer.ts
│ ├── Tokens.ts
│ ├── defaults.ts
│ ├── helpers.ts
│ ├── marked.ts
│ └── rules.ts
├── test/
│ ├── .eslintrc.json
│ ├── bench.js
│ ├── cjs-test.cjs
│ ├── recheck.ts
│ ├── rules.js
│ ├── run-spec-tests.js
│ ├── specs/
│ │ ├── commonmark/
│ │ │ └── commonmark.0.31.2.json
│ │ ├── gfm/
│ │ │ ├── commonmark.0.31.2.json
│ │ │ └── gfm.0.29.json
│ │ ├── new/
│ │ │ ├── adjacent_lists.html
│ │ │ ├── adjacent_lists.md
│ │ │ ├── angle_brackets.html
│ │ │ ├── angle_brackets.md
│ │ │ ├── autolink_after_link.html
│ │ │ ├── autolink_after_link.md
│ │ │ ├── autolink_lines.html
│ │ │ ├── autolink_lines.md
│ │ │ ├── autolinks.html
│ │ │ ├── autolinks.md
│ │ │ ├── autolinks_quotes.html
│ │ │ ├── autolinks_quotes.md
│ │ │ ├── backtick_precedence.html
│ │ │ ├── backtick_precedence.md
│ │ │ ├── backticks_in_links.html
│ │ │ ├── backticks_in_links.md
│ │ │ ├── blockquote_following_nptable.html
│ │ │ ├── blockquote_following_nptable.md
│ │ │ ├── blockquote_following_table.html
│ │ │ ├── blockquote_following_table.md
│ │ │ ├── blockquote_list_item.html
│ │ │ ├── blockquote_list_item.md
│ │ │ ├── blockquote_setext.html
│ │ │ ├── blockquote_setext.md
│ │ │ ├── breakline.html
│ │ │ ├── breakline.md
│ │ │ ├── breaks.html
│ │ │ ├── breaks.md
│ │ │ ├── case_insensitive_refs.html
│ │ │ ├── case_insensitive_refs.md
│ │ │ ├── code_block_no_ending_newline.html
│ │ │ ├── code_block_no_ending_newline.md
│ │ │ ├── code_compensation_indent.html
│ │ │ ├── code_compensation_indent.md
│ │ │ ├── code_consistent_newline.html
│ │ │ ├── code_consistent_newline.md
│ │ │ ├── code_following_nptable.html
│ │ │ ├── code_following_nptable.md
│ │ │ ├── code_following_table.html
│ │ │ ├── code_following_table.md
│ │ │ ├── code_spans.html
│ │ │ ├── code_spans.md
│ │ │ ├── codespan_newline.html
│ │ │ ├── codespan_newline.md
│ │ │ ├── def_blocks.html
│ │ │ ├── def_blocks.md
│ │ │ ├── del_flanking.html
│ │ │ ├── del_flanking.md
│ │ │ ├── del_strikethrough.html
│ │ │ ├── del_strikethrough.md
│ │ │ ├── double_link.html
│ │ │ ├── double_link.md
│ │ │ ├── em_2char.html
│ │ │ ├── em_2char.md
│ │ │ ├── em_after_inline.html
│ │ │ ├── em_after_inline.md
│ │ │ ├── em_and_reflinks.html
│ │ │ ├── em_and_reflinks.md
│ │ │ ├── em_link_brackets.html
│ │ │ ├── em_link_brackets.md
│ │ │ ├── em_list_links.html
│ │ │ ├── em_list_links.md
│ │ │ ├── em_strong_adjacent.html
│ │ │ ├── em_strong_adjacent.md
│ │ │ ├── em_strong_adjacent_mixed.html
│ │ │ ├── em_strong_adjacent_mixed.md
│ │ │ ├── em_strong_complex_nesting.html
│ │ │ ├── em_strong_complex_nesting.md
│ │ │ ├── em_strong_multiline.html
│ │ │ ├── em_strong_multiline.md
│ │ │ ├── em_strong_orphaned_nesting.html
│ │ │ ├── em_strong_orphaned_nesting.md
│ │ │ ├── email_after_space.html
│ │ │ ├── email_after_space.md
│ │ │ ├── emoji_inline.html
│ │ │ ├── emoji_inline.md
│ │ │ ├── emoji_strikethrough.html
│ │ │ ├── emoji_strikethrough.md
│ │ │ ├── emphasis_extra tests.html
│ │ │ ├── emphasis_extra tests.md
│ │ │ ├── empty_heading_following_paragraph.html
│ │ │ ├── empty_heading_following_paragraph.md
│ │ │ ├── empty_heading_following_paragraph_nogfm.html
│ │ │ ├── empty_heading_following_paragraph_nogfm.md
│ │ │ ├── empty_heading_following_table.html
│ │ │ ├── empty_heading_following_table.md
│ │ │ ├── escape_newline.html
│ │ │ ├── escape_newline.md
│ │ │ ├── escape_tick.html
│ │ │ ├── escape_tick.md
│ │ │ ├── escape_within_del.html
│ │ │ ├── escape_within_del.md
│ │ │ ├── escape_within_emphasis.html
│ │ │ ├── escape_within_emphasis.md
│ │ │ ├── escaped_angles.html
│ │ │ ├── escaped_angles.md
│ │ │ ├── fences_breaking_paragraphs.html
│ │ │ ├── fences_breaking_paragraphs.md
│ │ │ ├── fences_following_list.html
│ │ │ ├── fences_following_list.md
│ │ │ ├── fences_following_nptable.html
│ │ │ ├── fences_following_nptable.md
│ │ │ ├── fences_following_table.html
│ │ │ ├── fences_following_table.md
│ │ │ ├── fences_with_blankline_following_list_0.html
│ │ │ ├── fences_with_blankline_following_list_0.md
│ │ │ ├── fences_with_blankline_following_list_1.html
│ │ │ ├── fences_with_blankline_following_list_1.md
│ │ │ ├── heading_following_list.html
│ │ │ ├── heading_following_list.md
│ │ │ ├── heading_following_nptable.html
│ │ │ ├── heading_following_nptable.md
│ │ │ ├── heading_following_table.html
│ │ │ ├── heading_following_table.md
│ │ │ ├── hr_following_nptables.html
│ │ │ ├── hr_following_nptables.md
│ │ │ ├── hr_following_tables.html
│ │ │ ├── hr_following_tables.md
│ │ │ ├── hr_list_break.html
│ │ │ ├── hr_list_break.md
│ │ │ ├── html_comments.html
│ │ │ ├── html_comments.md
│ │ │ ├── html_following_list.html
│ │ │ ├── html_following_list.md
│ │ │ ├── html_following_nptable.html
│ │ │ ├── html_following_nptable.md
│ │ │ ├── html_following_table.html
│ │ │ ├── html_following_table.md
│ │ │ ├── html_no_new_line.html
│ │ │ ├── html_no_new_line.md
│ │ │ ├── image_alt.html
│ │ │ ├── image_alt.md
│ │ │ ├── image_links.html
│ │ │ ├── image_links.md
│ │ │ ├── image_paren.html
│ │ │ ├── image_paren.md
│ │ │ ├── incorrectly_formatted_list_and_hr.html
│ │ │ ├── incorrectly_formatted_list_and_hr.md
│ │ │ ├── indented_details.html
│ │ │ ├── indented_details.md
│ │ │ ├── indented_tables.html
│ │ │ ├── indented_tables.md
│ │ │ ├── inlinecode_following_nptables.html
│ │ │ ├── inlinecode_following_nptables.md
│ │ │ ├── inlinecode_following_tables.html
│ │ │ ├── inlinecode_following_tables.md
│ │ │ ├── lazy_blockquotes.html
│ │ │ ├── lazy_blockquotes.md
│ │ │ ├── lheading_following_nptable.html
│ │ │ ├── lheading_following_nptable.md
│ │ │ ├── lheading_following_table.html
│ │ │ ├── lheading_following_table.md
│ │ │ ├── link_lt.html
│ │ │ ├── link_lt.md
│ │ │ ├── link_tick_redos.html
│ │ │ ├── link_tick_redos.md
│ │ │ ├── link_unbalanced.html
│ │ │ ├── link_unbalanced.md
│ │ │ ├── links.html
│ │ │ ├── links.md
│ │ │ ├── links_paren.html
│ │ │ ├── links_paren.md
│ │ │ ├── list_align_number.html
│ │ │ ├── list_align_number.md
│ │ │ ├── list_align_pedantic.html
│ │ │ ├── list_align_pedantic.md
│ │ │ ├── list_code_header.html
│ │ │ ├── list_code_header.md
│ │ │ ├── list_following_nptable.html
│ │ │ ├── list_following_nptable.md
│ │ │ ├── list_following_table.html
│ │ │ ├── list_following_table.md
│ │ │ ├── list_item_empty.html
│ │ │ ├── list_item_empty.md
│ │ │ ├── list_item_tabs.html
│ │ │ ├── list_item_tabs.md
│ │ │ ├── list_item_text.html
│ │ │ ├── list_item_text.md
│ │ │ ├── list_item_unindented_asterisk.html
│ │ │ ├── list_item_unindented_asterisk.md
│ │ │ ├── list_loose.html
│ │ │ ├── list_loose.md
│ │ │ ├── list_loose_tasks.html
│ │ │ ├── list_loose_tasks.md
│ │ │ ├── list_paren_delimiter.html
│ │ │ ├── list_paren_delimiter.md
│ │ │ ├── list_table.html
│ │ │ ├── list_table.md
│ │ │ ├── list_tasks_non_gfm.html
│ │ │ ├── list_tasks_non_gfm.md
│ │ │ ├── list_with_line_break.html
│ │ │ ├── list_with_line_break.md
│ │ │ ├── list_wrong_indent.html
│ │ │ ├── list_wrong_indent.md
│ │ │ ├── multiple_sub_lists.html
│ │ │ ├── multiple_sub_lists.md
│ │ │ ├── nbsp_following_tables.html
│ │ │ ├── nbsp_following_tables.md
│ │ │ ├── nested_blockquote_in_list.html
│ │ │ ├── nested_blockquote_in_list.md
│ │ │ ├── nested_code.html
│ │ │ ├── nested_code.md
│ │ │ ├── nested_em.html
│ │ │ ├── nested_em.md
│ │ │ ├── nested_square_link.html
│ │ │ ├── nested_square_link.md
│ │ │ ├── nogfm_hashtag.html
│ │ │ ├── nogfm_hashtag.md
│ │ │ ├── not_a_link.html
│ │ │ ├── not_a_link.md
│ │ │ ├── paragraph-after-list-item.html
│ │ │ ├── paragraph-after-list-item.md
│ │ │ ├── pedantic_heading.html
│ │ │ ├── pedantic_heading.md
│ │ │ ├── pedantic_heading_interrupts_paragraph.html
│ │ │ ├── pedantic_heading_interrupts_paragraph.md
│ │ │ ├── ref_paren.html
│ │ │ ├── ref_paren.md
│ │ │ ├── same_bullet.html
│ │ │ ├── same_bullet.md
│ │ │ ├── setext_blankline.html
│ │ │ ├── setext_blankline.md
│ │ │ ├── setext_no_blankline.html
│ │ │ ├── setext_no_blankline.md
│ │ │ ├── space_after_table.html
│ │ │ ├── space_after_table.md
│ │ │ ├── strikethrough_in_em_strong.html
│ │ │ ├── strikethrough_in_em_strong.md
│ │ │ ├── strong_following_nptables.html
│ │ │ ├── strong_following_nptables.md
│ │ │ ├── strong_following_tables.html
│ │ │ ├── strong_following_tables.md
│ │ │ ├── substitutions.html
│ │ │ ├── substitutions.md
│ │ │ ├── tab_after_blockquote.html
│ │ │ ├── tab_after_blockquote.md
│ │ │ ├── tab_newline.html
│ │ │ ├── tab_newline.md
│ │ │ ├── table_cells.html
│ │ │ ├── table_cells.md
│ │ │ ├── table_following_text.html
│ │ │ ├── table_following_text.md
│ │ │ ├── table_reference_link.html
│ │ │ ├── table_reference_link.md
│ │ │ ├── table_vs_setext.html
│ │ │ ├── table_vs_setext.md
│ │ │ ├── tabs_code.html
│ │ │ ├── tabs_code.md
│ │ │ ├── tasklist_blocks.html
│ │ │ ├── tasklist_blocks.md
│ │ │ ├── text_following_nptables.html
│ │ │ ├── text_following_nptables.md
│ │ │ ├── text_following_tables.html
│ │ │ ├── text_following_tables.md
│ │ │ ├── toplevel_paragraphs.html
│ │ │ ├── toplevel_paragraphs.md
│ │ │ ├── tricky_list.html
│ │ │ ├── tricky_list.md
│ │ │ ├── underscore_link.html
│ │ │ ├── underscore_link.md
│ │ │ ├── unicode_punctuation.html
│ │ │ ├── unicode_punctuation.md
│ │ │ ├── whiltespace_lines.html
│ │ │ └── whiltespace_lines.md
│ │ ├── original/
│ │ │ ├── amps_and_angles_encoding.html
│ │ │ ├── amps_and_angles_encoding.md
│ │ │ ├── auto_links.html
│ │ │ ├── auto_links.md
│ │ │ ├── backslash_escapes.html
│ │ │ ├── backslash_escapes.md
│ │ │ ├── blockquotes_with_code_blocks.html
│ │ │ ├── blockquotes_with_code_blocks.md
│ │ │ ├── code_blocks.html
│ │ │ ├── code_blocks.md
│ │ │ ├── code_spans.html
│ │ │ ├── code_spans.md
│ │ │ ├── hard_wrapped_paragraphs_with_list_like_lines.html
│ │ │ ├── hard_wrapped_paragraphs_with_list_like_lines.md
│ │ │ ├── horizontal_rules.html
│ │ │ ├── horizontal_rules.md
│ │ │ ├── inline_html_advanced.html
│ │ │ ├── inline_html_advanced.md
│ │ │ ├── inline_html_comments.html
│ │ │ ├── inline_html_comments.md
│ │ │ ├── inline_html_simple.html
│ │ │ ├── inline_html_simple.md
│ │ │ ├── links_inline_style.html
│ │ │ ├── links_inline_style.md
│ │ │ ├── links_reference_style.html
│ │ │ ├── links_reference_style.md
│ │ │ ├── links_shortcut_references.html
│ │ │ ├── links_shortcut_references.md
│ │ │ ├── literal_quotes_in_titles.html
│ │ │ ├── literal_quotes_in_titles.md
│ │ │ ├── markdown_documentation_basics.html
│ │ │ ├── markdown_documentation_basics.md
│ │ │ ├── markdown_documentation_syntax.html
│ │ │ ├── markdown_documentation_syntax.md
│ │ │ ├── nested_blockquotes.html
│ │ │ ├── nested_blockquotes.md
│ │ │ ├── ordered_and_unordered_lists.html
│ │ │ ├── ordered_and_unordered_lists.md
│ │ │ ├── tabs.html
│ │ │ ├── tabs.md
│ │ │ ├── tidyness.html
│ │ │ └── tidyness.md
│ │ └── redos/
│ │ ├── backticks_alternating_in_link.html
│ │ ├── backticks_alternating_in_link.md
│ │ ├── backticks_in_link_label.html
│ │ ├── backticks_in_link_label.md
│ │ ├── cubic_def.cjs
│ │ ├── cubic_link_title.cjs
│ │ ├── link_code.html
│ │ ├── link_code.md
│ │ ├── link_redos.html
│ │ ├── link_redos.md
│ │ ├── quadratic_br.cjs
│ │ ├── quadratic_em_mask.cjs
│ │ ├── quadratic_email.cjs
│ │ ├── quadratic_heading.cjs
│ │ ├── quadratic_lists.cjs
│ │ ├── quadratic_underscores.cjs
│ │ ├── redos_html_closing.html
│ │ ├── redos_html_closing.md
│ │ ├── redos_nolink.html
│ │ ├── redos_nolink.md
│ │ ├── reflink_redos.html
│ │ └── reflink_redos.md
│ ├── types/
│ │ └── marked.ts
│ ├── umd-test.js
│ ├── unit/
│ │ ├── Hooks.test.js
│ │ ├── Lexer.test.js
│ │ ├── Parser.test.js
│ │ ├── bin.test.js
│ │ ├── fixtures/
│ │ │ └── bin-config.js
│ │ ├── instance.test.js
│ │ ├── marked.test.js
│ │ └── utils.js
│ └── update-specs.js
├── tsconfig-type-test.json
├── tsconfig.json
└── vercel.json
================================================
FILE CONTENTS
================================================
================================================
FILE: .devcontainer/devcontainer.json
================================================
// For format details, see https://aka.ms/devcontainer.json. For config options, see the
// README at: https://github.com/devcontainers/templates/tree/main/src/javascript-node
{
"name": "marked",
// We're using node 14 for development, to keep close to the engine compatibility that marked.js uses.
"image": "mcr.microsoft.com/devcontainers/javascript-node:0-14",
"postCreateCommand": "npm install",
// Configure tool-specific properties.
"customizations": {
// Configure properties specific to VS Code.
"vscode": {
"extensions": [
"dbaeumeur.vscode-eslint"
]
}
}
}
================================================
FILE: .editorconfig
================================================
root = true
[*.{json,js}]
charset = utf-8
end_of_line = lf
insert_final_newline = true
indent_style = space
indent_size = 2
[*.md, !test/*.md]
charset = utf-8
end_of_line = lf
insert_final_newline = true
trim_trailing_whitespace = true
indent_style = tab
indent_size = 4
================================================
FILE: .gitattributes
================================================
* eol=lf
test/* linguist-vendored
lib/* linguist-generated
================================================
FILE: .github/ISSUE_TEMPLATE/Bug_report.md
================================================
---
name: Bug report
about: Marked says it does this thing but does not
---
**Marked version:**
**Describe the bug**
A clear and concise description of what the bug is.
**To Reproduce**
Steps to reproduce the behavior:
**Expected behavior**
A clear and concise description of what you expected to happen.
================================================
FILE: .github/ISSUE_TEMPLATE/Feature_request.md
================================================
---
name: Feature request
about: Marked doesn't do this thing and I think it should
---
**Describe the feature**
A clear and concise description of what you would like.
**Why is this feature necessary?**
A clear and concise description of why.
**Describe alternatives you've considered**
A clear and concise description of any alternative solutions or features you've considered.
================================================
FILE: .github/ISSUE_TEMPLATE/Proposal.md
================================================
---
name: Proposal
about: Marked doesn't do this thing and I think it should
---
**What pain point are you perceiving?.**
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]
**Describe the solution you'd like**
A clear and concise description of what you want to happen.
================================================
FILE: .github/ISSUE_TEMPLATE.md
================================================
**Marked version:**
**Markdown flavor:** Markdown.pl|CommonMark|GitHub Flavored Markdown|n/a
## Expectation
**CommonMark Demo:** [demo](https://spec.commonmark.org/dingus/)
## Result
**Marked Demo:** [demo](https://marked.js.org/demo/)
## What was attempted
================================================
FILE: .github/PULL_REQUEST_TEMPLATE/badges.md
================================================
**@mention the contributor:**
## Recommendation to:
- [ ] Change user group
- [ ] Add a badge
- [ ] Remove a badge
## As the one mentioned, I would like to:
- [ ] accept the recommendation; or,
- [ ] graciously decline; or,
- [ ] dispute the recommendation
within 30 days, if you have not indicated which option you are taking one of the following will happen:
1. If adding a badge, we will assume you are graciously declining.
2. If removing a badge, we will assume you do not want to dispute the recommendation; therefore, the badge will be removed.
Note: All committers must approve via review before merging, the disapproving committer can simply close the PR.
================================================
FILE: .github/PULL_REQUEST_TEMPLATE.md
================================================
**Marked version:**
**Markdown flavor:** Markdown.pl|CommonMark|GitHub Flavored Markdown|n/a
## Description
- Fixes #### (if fixing a known issue; otherwise, describe issue using the following format)
## Contributor
- [ ] Test(s) exist to ensure functionality and minimize regression (if no tests added, list tests covering this PR); or,
- [ ] no tests required for this PR.
- [ ] If submitting new feature, it has been documented in the appropriate places.
## Committer
In most cases, this should be a different person than the contributor.
- [ ] CI is green (no forced merge required).
- [ ] Squash and Merge PR following [conventional commit guidelines](https://www.conventionalcommits.org/).
================================================
FILE: .github/dependabot.yml
================================================
version: 2
updates:
- package-ecosystem: "github-actions"
directory: "/"
schedule:
interval: "weekly"
- package-ecosystem: "npm"
versioning-strategy: "increase"
directory: "/"
schedule:
interval: "weekly"
================================================
FILE: .github/workflows/tests.yml
================================================
name: "Tests"
on:
pull_request:
push:
branches:
- master
permissions:
contents: read
jobs:
UnitTests:
strategy:
matrix:
# lowest version here should also be in `engines` field
node_version: [20, "lts/*", "latest"]
runs-on: ubuntu-latest
steps:
- name: Checkout Code
uses: actions/checkout@v6
- name: Install Node
uses: actions/setup-node@v6
with:
node-version: ${{ matrix.node_version }}
check-latest: true
- name: Install Dependencies
run: npm ci
- name: Build 🗜️
run: npm run build
- name: Run Unit Tests 👩🏽💻
run: npm run test:unit
- name: Run Spec Tests 👩🏽💻
run: npm run test:specs
- name: Run CJS Tests 👩🏽💻
run: npm run test:cjs
OtherTests:
runs-on: ubuntu-latest
steps:
- name: Checkout Code
uses: actions/checkout@v6
- name: Install Node
uses: actions/setup-node@v6
with:
node-version: "lts/*"
- name: Install Dependencies
run: npm ci
- name: Build 🗜️
run: npm run build
- name: Run UMD Tests 👩🏽💻
run: npm run test:umd
- name: Run Types Tests 👩🏽💻
run: npm run test:types
- name: Lint ✨
run: npm run test:lint
Release:
permissions:
contents: write # to be able to publish a GitHub release
# issues: write # to be able to comment on released issues
# pull-requests: write # to be able to comment on released pull requests
id-token: write # to enable use of OIDC for trusted publishing and npm provenance
needs: [UnitTests, OtherTests]
if: |
github.ref == 'refs/heads/master' &&
github.event.repository.fork == false
runs-on: ubuntu-latest
steps:
- name: Checkout Code
uses: actions/checkout@v6
- name: Install Node
uses: actions/setup-node@v6
with:
node-version: "lts/*"
- name: Install Dependencies
run: npm ci
- name: Build 🗜️
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
run: |
export SEMANTIC_RELEASE_NEXT_VERSION=$(npx semantic-release --no-ci --dry-run | grep -oP 'The next release version is \K[0-9]+\.[0-9]+\.[0-9]+')
echo "Next Version: $SEMANTIC_RELEASE_NEXT_VERSION"
npm run build
if ! git diff --quiet; then
git config --global user.email "<>"
git config --global user.name "MarkedJS bot"
git commit -am "🗜️ build v$SEMANTIC_RELEASE_NEXT_VERSION [skip ci]"
fi
- name: Release 🎉
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
run: npx semantic-release
================================================
FILE: .gitignore
================================================
.DS_Store
.vercel
.vscode
node_modules/
test/compiled_tests
public
lib
docs/LICENSE.md
vuln.js
man/marked.1
test.js
================================================
FILE: .releaserc.json
================================================
{
"plugins": [
"@semantic-release/commit-analyzer",
"@semantic-release/release-notes-generator",
"@semantic-release/npm",
"@semantic-release/github",
"@semantic-release/git"
]
}
================================================
FILE: CHANGELOG.md
================================================
see https://github.com/markedjs/marked/releases
================================================
FILE: LICENSE.md
================================================
# License information
## Contribution License Agreement
If you contribute code to this project, you are implicitly allowing your code
to be distributed under the MIT license. You are also implicitly verifying that
all code is your original work. ``
## Marked
Copyright (c) 2018+, MarkedJS (https://github.com/markedjs/)
Copyright (c) 2011-2018, Christopher Jeffrey (https://github.com/chjj/)
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
## Markdown
Copyright © 2004, John Gruber
http://daringfireball.net/
All rights reserved.
Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:
* Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.
* Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.
* Neither the name “Markdown” nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission.
This software is provided by the copyright holders and contributors “as is” and any express or implied warranties, including, but not limited to, the implied warranties of merchantability and fitness for a particular purpose are disclaimed. In no event shall the copyright owner or contributors be liable for any direct, indirect, incidental, special, exemplary, or consequential damages (including, but not limited to, procurement of substitute goods or services; loss of use, data, or profits; or business interruption) however caused and on any theory of liability, whether in contract, strict liability, or tort (including negligence or otherwise) arising in any way out of the use of this software, even if advised of the possibility of such damage.
================================================
FILE: README.md
================================================
# Marked
[](https://www.npmjs.com/package/marked)
[](https://packagephobia.now.sh/result?p=marked)
[](https://www.npmjs.com/package/marked)
[](https://github.com/markedjs/marked/actions)
[](https://snyk.io/test/npm/marked)
- ⚡ built for speed
- ⬇️ low-level compiler for parsing markdown without caching or blocking for long periods of time
- ⚖️ light-weight while implementing all markdown features from the supported flavors & specifications
- 🌐 works in a browser, on a server, or from a command line interface (CLI)
## Demo
Check out the [demo page](https://marked.js.org/demo/) to see Marked in action ⛹️
## Docs
Our [documentation pages](https://marked.js.org) are also rendered using marked 💯
Also read about:
* [Options](https://marked.js.org/using_advanced)
* [Extensibility](https://marked.js.org/using_pro)
## Compatibility
**Node.js:** Only [current and LTS](https://nodejs.org/en/about/releases/) Node.js versions are supported. End of life Node.js versions may become incompatible with Marked at any point in time.
**Browser:** [Baseline Widely Available](https://developer.mozilla.org/en-US/docs/Glossary/Baseline/Compatibility)
## Installation
**CLI:**
```sh
npm install -g marked
```
**In-browser:**
```sh
npm install marked
```
## Usage
### Warning: 🚨 Marked does not [sanitize](https://marked.js.org/using_advanced#options) the output HTML. Please use a sanitize library, like [DOMPurify](https://github.com/cure53/DOMPurify) (recommended), [sanitize-html](https://github.com/apostrophecms/sanitize-html) or [insane](https://github.com/bevacqua/insane) on the *output* HTML! 🚨
```
DOMPurify.sanitize(marked.parse(`
`));
```
**CLI**
``` bash
# Example with stdin input
$ marked -o hello.html
hello world
^D
$ cat hello.html
hello world
``` ```bash # Print all options $ marked --help ``` **Browser** ```html
Christopher Jeffrey Original Author
Started the fire
|
Josh Bruce Publisher
Release Wrangler; Humaning Helper; Heckler of Hypertext
|
Steven Publisher
Release Wrangler; Dr. Docs; Open source, of course; GitHub Guru; Humaning Helper
|
Jamie Davis Committer
Seeker of Security
|
Tony Brix Publisher
Release Wrangler; Titan of the test harness; Dr. DevOps
|
Trevor Buckner Committer
Master of Marked
|
Brandon der Blätter Contributor
Curious Contributor
|
Carlos Valle Contributor
Maker of the Marked mark from 2018 to present
|
Federico Soave Contributor
Regent of the Regex; Master of Marked
|
Karen Yavine Contributor
Snyk's Security Saint
|
Костя Третяк Contributor
|
Tom Theisen Contributor
Defibrillator
|
Mateus Craveiro Contributor
Defibrillator
|
Someone who understands and contributes to improving the developer experience and flow of Marked into the world.
"The main characteristic of the DevOps movement is to strongly advocate automation and monitoring at all steps of software construction, from integration, testing, releasing to deployment and infrastructure management. DevOps aims at shorter development cycles, increased deployment frequency, more dependable releases, in close alignment with business objectives." ~ Wikipedia
Can you demonstrate you understand the following without Google and Stackoverflow?
/^( *)(bull) [\s\S]+?(?:hr|def|\n{2,}(?! )(?!\1bull )\n*|\s*$)/
Because this author can't yet. That's who gets these.
* Still working on metrics for comparative analysis and definition.
** As few dependencies as possible.
*** Strict compliance could result in slower processing when running comparative benchmarking.
hello world
``` ``` bash # Example with string input $ marked -s "*hello world*"hello world
``` ```bash # Example with file input echo "**bold text example**" > readme.md $ marked -i readme.md -o readme.html $ cat readme.htmlbold text example
``` ```bash # Print all options $ marked --help ``` *CLI Config* A config file can be used to configure the marked cli. If it is a `.json` file it should be a JSON object that will be passed to marked as options. If `.js` is used it should have a default export of a marked options object or a function that takes `marked` as a parameter. It can use the `marked` parameter to install extensions using `marked.use`. By default the marked cli will look for a config file in your home directory in the following order. - `~/.marked.json` - `~/.marked.js` - `~/.marked/index.js` ```bash # Example with custom config echo '{ "breaks": true }' > config.json $ marked -s 'line1\nline2' -c config.jsonline1
line2
` block. Useful for syntax highlighting.|
|mangle (**removed**)|`boolean` |`true` |v0.3.4 |Removed in v8.0.0 use [`marked-mangle`](https://www.npmjs.com/package/marked-mangle) to mangle email addresses.|
|sanitize (**removed**)|`boolean` |`false` |v0.2.1 |Removed in v8.0.0 use a sanitize library, like [DOMPurify](https://github.com/cure53/DOMPurify) (recommended), [sanitize-html](https://github.com/apostrophecms/sanitize-html) or [insane](https://github.com/bevacqua/insane) on the output HTML! |
|sanitizer (**removed**)|`function`|`null` |v0.3.4 |Removed in v8.0.0 use a sanitize library, like [DOMPurify](https://github.com/cure53/DOMPurify) (recommended), [sanitize-html](https://github.com/apostrophecms/sanitize-html) or [insane](https://github.com/bevacqua/insane) on the output HTML!|
|smartypants (**removed**)|`boolean` |`false` |v0.2.9 |Removed in v8.0.0 use [`marked-smartypants`](https://www.npmjs.com/package/marked-smartypants) to use "smart" typographic punctuation for things like quotes and dashes.|
|xhtml (**removed**)|`boolean` |`false` |v0.3.2 |Removed in v8.0.0 use [`marked-xhtml`](https://www.npmjs.com/package/marked-xhtml) to emit self-closing HTML tags for void elements (<br/>, <img/>, etc.) with a "/" as required by XHTML.|
Known Extensions
Marked can be extended using [custom extensions](/using_pro#extensions). This is a list of extensions that can be used with `marked.use(extension)`.
|Name|Package Name|Description|
|:---|:-----------|:----------|
|[ABCjs](https://www.npmjs.com/package/marked-abc)|[`abcjs`](https://www.npmjs.com/package/marked-abc)|[ABCjs](https://www.abcjs.net/) sheet music rendering|
|[Admonition](https://www.npmjs.com/package/marked-admonition-extension)|[`marked-admonition-extension`](https://www.npmjs.com/package/marked-admonition-extension)| Admonition extension |
|[Alert](https://github.com/bent10/marked-extensions/tree/main/packages/alert)|[`marked-alert`](https://www.npmjs.com/package/marked-alert)|Enables [GFM alerts](https://github.com/orgs/community/discussions/16925)|
|[Base URL](https://github.com/markedjs/marked-base-url)|[`marked-base-url`](https://www.npmjs.com/package/marked-base-url)|Prefix relative urls with a base URL|
|[Bidi](https://github.com/markedjs/marked-bidi)|[`marked-bidi`](https://www.npmjs.com/package/marked-bidi)|Add Bidirectional text support to the HTML|
|[CJK Breaks](https://github.com/chirsz-ever/marked-cjk-breaks)|[`marked-cjk-breaks`](https://www.npmjs.com/package/marked-cjk-breaks)|Suppress soft linebreaks between east asian characters|
|[Code Format](https://github.com/bent10/marked-extensions/tree/main/packages/code-format)|[`marked-code-format`](https://www.npmjs.com/package/marked-code-format)|Formatting code blocks using Prettier|
|[Code JSX Renderer](https://github.com/bent10/marked-extensions/tree/main/packages/code-jsx-renderer)|[`marked-code-jsx-renderer`](https://www.npmjs.com/package/marked-code-jsx-renderer)|Render JSX code blocks using a custom renderer and components|
|[Code Preview](https://github.com/bent10/marked-extensions/tree/main/packages/code-preview)|[`marked-code-preview`](https://www.npmjs.com/package/marked-code-preview)|Transform code blocks into code previews|
|[Custom Heading ID](https://github.com/markedjs/marked-custom-heading-id)|[`marked-custom-heading-id`](https://www.npmjs.com/package/marked-custom-heading-id)|Specify a custom heading id in headings with the [Markdown Extended Syntax](https://www.markdownguide.org/extended-syntax/#heading-ids) `# heading {#custom-id}`|
|[Directive](https://github.com/bent10/marked-extensions/tree/main/packages/directive)|[`marked-directive`](https://www.npmjs.com/package/marked-directive)|Supports [directives syntax](https://talk.commonmark.org/t/generic-directives-plugins-syntax/444)|
|[Emoji](https://github.com/UziTech/marked-emoji)|[`marked-emoji`](https://www.npmjs.com/package/marked-emoji)|Add emoji support like on GitHub|
|[Extended Tables](https://github.com/calculuschild/marked-extended-tables)|[`marked-extended-tables`](https://www.npmjs.com/package/marked-extended-tables)|Extends the standard Github-Flavored tables to support advanced features: Column Spanning, Row Spanning, Multi-row headers|
|[Footnote](https://github.com/bent10/marked-extensions/tree/main/packages/footnote)|[`marked-footnote`](https://www.npmjs.com/package/marked-footnote)|Enables [GFM footnotes](https://docs.github.com/en/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax#footnotes)|
|[GFM Heading ID](https://github.com/markedjs/marked-gfm-heading-id)|[`marked-gfm-heading-id`](https://www.npmjs.com/package/marked-gfm-heading-id)|Use [`github-slugger`](https://github.com/Flet/github-slugger) to create the heading IDs and allow a custom prefix|
|[Highlight](https://github.com/markedjs/marked-highlight)|[`marked-highlight`](https://www.npmjs.com/package/marked-highlight)|Highlight code blocks|
|[HTML Renderer](https://github.com/UziTech/marked-html-renderer)|[`marked-html-renderer`](https://www.npmjs.com/package/marked-html-renderer)|Output HTML Elements instead of a string|
|[Jira Renderer](https://github.com/mrmarble/marked-jira)|[`marked-jira`](https://www.npmjs.com/package/marked-jira)|Output Jira compatible format|
|[Katex Code](https://github.com/UziTech/marked-katex-extension)|[`marked-katex-extension`](https://www.npmjs.com/package/marked-katex-extension)|Render [katex](https://katex.org/) code|
|[LinkifyIt](https://github.com/UziTech/marked-linkify-it)|[`marked-linkify-it`](https://www.npmjs.com/package/marked-linkify-it)|Use [linkify-it](https://github.com/markdown-it/linkify-it) for urls|
|[Mangle](https://github.com/markedjs/marked-mangle)|[`marked-mangle`](https://www.npmjs.com/package/marked-mangle)|Mangle mailto links with HTML character references|
|[Marked Responsive Images](https://github.com/ELowry/MarkedResponsiveImages)|[`marked-responsive-images`](https://www.npmjs.com/package/marked-responsive-images)|Generate responsive (`srcset`) images based on structured filenames|
|[Misskey-flavored Markdown](https://akkoma.dev/sfr/marked-mfm)|[`marked-mfm`](https://www.npmjs.com/package/marked-mfm)|Custom extension for [Misskey-flavored Markdown](https://github.com/misskey-dev/mfm.js/blob/develop/docs/syntax.md)|
|[More Lists](https://github.com/jasny/marked-more-lists)|[`marked-more-lists`](https://www.npmjs.com/package/marked-more-lists)|Support for alphabetical and roman numeral ordered lists|
|[Plaintify](https://github.com/bent10/marked-extensions/tree/main/packages/plaintify)|[`marked-plaintify`](https://www.npmjs.com/package/marked-plaintify)|Converts Markdown to Plaintext|
|[Shiki](https://github.com/bent10/marked-extensions/tree/main/packages/shiki)|[`marked-shiki`](https://www.npmjs.com/package/marked-shiki)|Integrating [Shiki](https://shiki.style/) syntax highlighting|
|[Sequential Hooks](https://github.com/bent10/marked-extensions/tree/main/packages/sequential-hooks)|[`marked-sequential-hooks`](https://www.npmjs.com/package/marked-sequential-hooks)|Enables the sequential preprocessing and post-processing within [sequential hooks](https://github.com/bent10/marked-extensions#sequential-hooks)|
|[Smartypants](https://github.com/markedjs/marked-smartypants)|[`marked-smartypants`](https://www.npmjs.com/package/marked-smartypants)|Use [smartypants](https://www.npmjs.com/package/smartypants) to use "smart" typographic punctuation for things like quotes and dashes|
|[Smartypants lite](https://github.com/calculuschild/marked-smartypants-lite)|[`marked-smartypants-lite`](https://www.npmjs.com/package/marked-smartypants-lite)|A faster lighter version of marked-smartypants that doesn't use any external dependencies to create "smart" typographic punctuation for things like quotes and dashes|
|[Token Position](https://github.com/UziTech/marked-token-position)|[`marked-token-position`](https://www.npmjs.com/package/marked-token-position)|Adds a `position` field to each token with `start` and `end` properties containing `line`, `column`, and `offset`|
|[Typograf](https://github.com/laidrivm/marked-typograf)|[`marked-typograf`](https://www.npmjs.com/package/marked-typograf)|Use [typograf](https://www.npmjs.com/package/typograf) as a more powerful and extendable alternative to Smartypants for creating “smart” typographic punctuation, such as quotes and dashes|
|[XHTML](https://github.com/markedjs/marked-xhtml)|[`marked-xhtml`](https://www.npmjs.com/package/marked-xhtml)|Emit self-closing HTML tags for void elements (<br/>, <img/>, etc.) with a "/" as required by XHTML|
User Examples
Marked can render on-page content as markdown in the browser.
```html
Marked for the full page
```
Inline Markdown
You can parse inline markdown by running markdown through `marked.parseInline`.
```js
const blockHtml = marked.parse('**strong** _em_');
console.log(blockHtml); // 'strong em
'
const inlineHtml = marked.parseInline('**strong** _em_');
console.log(inlineHtml); // 'strong em'
```
Highlighting
Use [`marked-highlight`](https://www.npmjs.com/package/marked-highlight) to highlight code blocks.
Workers
To prevent ReDoS attacks you can run marked on a worker and terminate it when parsing takes longer than usual.
Marked can be run in a [worker thread](https://nodejs.org/api/worker_threads.html) on a node server, or a [web worker](https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API) in a browser.
### Node Worker Thread
```js
// markedWorker.js
import { marked } from 'marked';
import { parentPort } from 'worker_threads';
parentPort.on('message', (markdownString) => {
parentPort.postMessage(marked.parse(markdownString));
});
```
```js
// index.js
import { Worker } from 'worker_threads';
const markedWorker = new Worker('./markedWorker.js');
const markedTimeout = setTimeout(() => {
markedWorker.terminate();
throw new Error('Marked took too long!');
}, timeoutLimit);
markedWorker.on('message', (html) => {
clearTimeout(markedTimeout);
console.log(html);
markedWorker.terminate();
});
markedWorker.postMessage(markdownString);
```
### Web Worker
> **NOTE**: Web Workers send the payload from `postMessage` in an object with the payload in a `.data` property
```js
// markedWorker.js
importScripts('path/to/marked.umd.js');
onmessage = (e) => {
const markdownString = e.data
postMessage(marked.parse(markdownString));
};
```
```js
// script.js
const markedWorker = new Worker('./markedWorker.js');
const markedTimeout = setTimeout(() => {
markedWorker.terminate();
throw new Error('Marked took too long!');
}, timeoutLimit);
markedWorker.onmessage = (e) => {
clearTimeout(markedTimeout);
const html = e.data;
console.log(html);
markedWorker.terminate();
};
markedWorker.postMessage(markdownString);
```
CLI Extensions
You can use extensions in the CLI by creating a new CLI that imports marked and the marked binary.
```js
// file: myMarked
#!/usr/bin/node
import { marked } from 'marked';
import customHeadingId from 'marked-custom-heading-id';
marked.use(customHeadingId());
import 'marked/bin/marked';
```
```sh
$ ./myMarked -s "# heading {#custom-id}"
heading
```
================================================
FILE: docs/USING_PRO.md
================================================
## Extending Marked
To champion the single-responsibility and open/closed principles, we have tried to make it relatively painless to extend Marked. If you are looking to add custom functionality, this is the place to start.
Terminology Note
Before diving in, it's important to understand the terminology used in this documentation:
| Term | TypeScript Type | Description |
|------|----------------|-------------|
| **Marked Extension** | `MarkedExtension` | The configuration object passed to `marked.use()`. Can contain options, hooks, renderer overrides, tokenizer overrides, and custom extensions. |
| **Custom Extension** | `TokenizerAndRendererExtension` | Objects within the `extensions` array that define custom tokenizers and renderers for new syntax. |
In other words, a **Marked Extension** is the top-level plugin configuration, while **Custom Extensions** are the individual tokenizer/renderer definitions for custom syntax within that configuration.
```js
// Marked Extension (MarkedExtension)
marked.use({
gfm: true,
breaks: false,
renderer: { /* renderer overrides */ },
tokenizer: { /* tokenizer overrides */ },
// Custom Extensions (TokenizerAndRendererExtension[])
extensions: [
{ name: 'myCustomSyntax', level: 'block', tokenizer: fn, renderer: fn }
]
});
```
marked.use()
`marked.use(extension)` is the recommended way to extend Marked. The `extension` object can contain any [option](/using_advanced#options) available in Marked:
```js
import { marked } from 'marked';
marked.use({
pedantic: false,
gfm: true,
breaks: false
});
```
You can also supply multiple `extension` objects at once.
```js
marked.use(myExtension, extension2, extension3);
\\ EQUIVALENT TO:
marked.use(myExtension);
marked.use(extension2);
marked.use(extension3);
```
All options will overwrite those previously set, except for the following options which will be merged with the existing framework and can be used to change or extend the functionality of Marked: `renderer`, `tokenizer`, `hooks`, `walkTokens`, and `extensions`.
* The `renderer`, `tokenizer`, and `hooks` options are objects with functions that will be merged into the built-in `renderer` and `tokenizer` respectively.
* The `walkTokens` option is a function that will be called to post-process every token before rendering.
* The `extensions` option is an array of objects that can contain additional custom `renderer` and `tokenizer` steps that will execute before any of the default parsing logic occurs.
Importantly, ensure that the extensions are only added to `marked` once (ie in the global scope of a regular JavaScript or TypeScript module). If they are added in a function that is called repeatedly, or in the JS for an HTML component in a library such as Svelte, your extensions will be added repeatedly, eventually causing a recursion error. If you cannot prevent the code from being run repeatedly, you should create a [Marked instance](/using_advanced#instance) so that your extensions are stored independently from the global instance Marked provides.
***
The Marked Pipeline
Before building your custom extensions, it is important to understand the components that Marked uses to translate from Markdown to HTML:
1) The user supplies Marked with an input string to be translated.
2) The `lexer` feeds segments of the input text string into each `tokenizer`, and from their output, generates a series of tokens in a nested tree structure.
3) Each `tokenizer` receives a segment of Markdown text and, if it matches a particular pattern, generates a token object containing any relevant information.
4) The `walkTokens` function will traverse every token in the tree and perform any final adjustments to the token contents.
4) The `parser` traverses the token tree and feeds each token into the appropriate `renderer`, and concatenates their outputs into the final HTML result.
5) Each `renderer` receives a token and manipulates its contents to generate a segment of HTML.
Marked provides methods for directly overriding the `renderer` and `tokenizer` for any existing token type, as well as inserting additional custom `renderer` and `tokenizer` functions to handle entirely custom syntax. For example, using `marked.use({renderer})` would modify a renderer, whereas `marked.use({extensions: [{renderer}]})` would add a new renderer. See the [custom extensions example](#custom-extensions-example) for insight on how to execute this.
***
The Renderer : renderer
The renderer defines the HTML output of a given token. If you supply a `renderer` in the options object passed to `marked.use()`, any functions in the object will override the default handling of that token type.
Calling `marked.use()` to override the same function multiple times will give priority to the version that was assigned *last*. Overriding functions can return `false` to fall back to the previous override in the sequence, or resume default behavior if all overrides return `false`. Returning any other value (including nothing) will prevent fallback behavior.
**Example:** Overriding output of the default `heading` token by adding an embedded anchor tag like on GitHub.
```js
// Create reference instance
import { marked } from 'marked';
// Override function
const renderer = {
heading({ tokens, depth }) {
const text = this.parser.parseInline(tokens);
const escapedText = text.toLowerCase().replace(/[^\w]+/g, '-');
return `
${text}
`;
}
};
marked.use({ renderer });
// Run marked
console.log(marked.parse('# heading+'));
```
**Output:**
```html
heading+
```
**Note:** Calling `marked.use()` in the following way will avoid overriding the `heading` token output but create a new `heading` renderer in the process.
```js
marked.use({
extensions: [{
name: 'heading',
renderer(token) {
return /* ... */
}
}]
})
```
### Block-level renderer methods
- **space**(token: *Tokens.Space*): *string*
- **code**(token: *Tokens.Code*): *string*
- **blockquote**(token: *Tokens.Blockquote*): *string*
- **html**(token: *Tokens.HTML | Tokens.Tag*): *string*
- **heading**(token: *Tokens.Heading*): *string*
- **hr**(token: *Tokens.Hr*): *string*
- **list**(token: *Tokens.List*): *string*
- **listitem**(token: *Tokens.ListItem*): *string*
- **checkbox**(token: *Tokens.Checkbox*): *string*
- **paragraph**(token: *Tokens.Paragraph*): *string*
- **table**(token: *Tokens.Table*): *string*
- **tablerow**(token: *Tokens.TableRow*): *string*
- **tablecell**(token: *Tokens.TableCell*): *string*
### Inline-level renderer methods
- **strong**(token: *Tokens.Strong*): *string*
- **em**(token: *Tokens.Em*): *string*
- **codespan**(token: *Tokens.Codespan*): *string*
- **br**(token: *Tokens.Br*): *string*
- **del**(token: *Tokens.Del*): *string*
- **link**(token: *Tokens.Link*): *string*
- **image**(token: *Tokens.Image*): *string*
- **text**(token: *Tokens.Text | Tokens.Escape | Tokens.Tag*): *string*
The Tokens.* properties can be found [here](https://github.com/markedjs/marked/blob/master/src/Tokens.ts).
***
The Tokenizer : tokenizer
The tokenizer defines how to turn markdown text into tokens. If you supply a `tokenizer` object to the Marked options, it will be merged with the built-in tokenizer and any functions inside will override the default handling of that token type.
Calling `marked.use()` to override the same function multiple times will give priority to the version that was assigned *last*. Overriding functions can return `false` to fall back to the previous override in the sequence, or resume default behavior if all overrides return `false`. Returning any other value (including nothing) will prevent fallback behavior.
**Example:** Overriding default `codespan` tokenizer to include LaTeX.
```js
// Create reference instance
import { marked } from 'marked';
// Override function
const tokenizer = {
codespan(src) {
const match = src.match(/^\$+([^\$\n]+?)\$+/);
if (match) {
return {
type: 'codespan',
raw: match[0],
text: match[1].trim()
};
}
// return false to use original codespan tokenizer
return false;
}
};
marked.use({ tokenizer });
// Run marked
console.log(marked.parse('$ latex code $\n\n` other code `'));
```
**Output:**
```html
latex code
other code
```
**NOTE**: This does not fully support latex, see issue [#1948](https://github.com/markedjs/marked/issues/1948).
### Block level tokenizer methods
- **space**(src: *string*): *Tokens.Space*
- **code**(src: *string*): *Tokens.Code*
- **fences**(src: *string*): *Tokens.Code*
- **heading**(src: *string*): *Tokens.Heading*
- **hr**(src: *string*): *Tokens.Hr*
- **blockquote**(src: *string*): *Tokens.Blockquote*
- **list**(src: *string*): *Tokens.List*
- **html**(src: *string*): *Tokens.HTML*
- **def**(src: *string*): *Tokens.Def*
- **table**(src: *string*): *Tokens.Table*
- **lheading**(src: *string*): *Tokens.Heading*
- **paragraph**(src: *string*): *Tokens.Paragraph*
- **text**(src: *string*): *Tokens.Text*
### Inline level tokenizer methods
- **escape**(src: *string*): *Tokens.Escape*
- **tag**(src: *string*): *Tokens.Tag*
- **link**(src: *string*): *Tokens.Link | Tokens.Image*
- **reflink**(src: *string*, links: *object*): *Tokens.Link | Tokens.Image | Tokens.Text*
- **emStrong**(src: *string*, maskedSrc: *string*, prevChar: *string*): *Tokens.Em | Tokens.Strong*
- **codespan**(src: *string*): *Tokens.Codespan*
- **br**(src: *string*): *Tokens.Br*
- **del**(src: *string*): *Tokens.Del*
- **autolink**(src: *string*): *Tokens.Link*
- **url**(src: *string*): *Tokens.Link*
- **inlineText**(src: *string*): *Tokens.Text*
The Tokens.* properties can be found [here](https://github.com/markedjs/marked/blob/master/src/Tokens.ts).
***
Walk Tokens : walkTokens
The walkTokens function gets called with every token. Child tokens are called before moving on to sibling tokens. Each token is passed by reference so updates are persisted when passed to the parser. When [`async`](#async) mode is enabled, the return value is awaited. Otherwise the return value is ignored.
`marked.use()` can be called multiple times with different `walkTokens` functions. Each function will be called in order, starting with the function that was assigned *last*.
**Example:** Overriding heading tokens to start at h2.
```js
import { marked } from 'marked';
// Override function
const walkTokens = (token) => {
if (token.type === 'heading') {
token.depth += 1;
}
};
marked.use({ walkTokens });
// Run marked
console.log(marked.parse('# heading 2\n\n## heading 3'));
```
**Output:**
```html
heading 2
heading 3
```
***
Hooks : hooks
Hooks are methods that hook into some part of marked. The following hooks are available:
| signature | description |
|-----------|-------------|
| `preprocess(markdown: string): string` | Process markdown before sending it to marked. |
| `postprocess(html: string): string` | Process html after marked has finished parsing. |
| `processAllTokens(tokens: Token[]): Token[]` | Process all tokens before walk tokens. |
| `emStrongMask(src: string): string` | Mask part of the content that should not be interpreted as Markdown em/strong delimiters. |
| `provideLexer(): (src: string, options?: MarkedOptions) => Token[]` | Provide function to tokenize markdown. |
| `provideParser(): (tokens: Token[], options?: MarkedOptions) => string` | Provide function to parse tokens. |
`marked.use()` can be called multiple times with different `hooks` functions. Each function will be called in order, starting with the function that was assigned *last*.
**Example:** Set options based on [front-matter](https://www.npmjs.com/package/front-matter)
```js
import { marked } from 'marked';
import fm from 'front-matter';
// Override function
function preprocess(markdown) {
const { attributes, body } = fm(markdown);
for (const prop in attributes) {
if (prop in this.options) {
this.options[prop] = attributes[prop];
}
}
return body;
}
marked.use({ hooks: { preprocess } });
// Run marked
console.log(marked.parse(`
---
breaks: true
---
line1
line2
`.trim()));
```
**Output:**
```html
line1
line2
```
**Example:** Sanitize HTML with [isomorphic-dompurify](https://www.npmjs.com/package/isomorphic-dompurify)
```js
import { marked } from 'marked';
import DOMPurify from 'isomorphic-dompurify';
// Override function
function postprocess(html) {
return DOMPurify.sanitize(html);
}
marked.use({ hooks: { postprocess } });
// Run marked
console.log(marked.parse(`
`));
```
**Output:**
```html
```
**Example:** Save reflinks for chunked rendering
```js
import { marked, Lexer } from 'marked';
let refLinks = {};
// Override function
function processAllTokens(tokens) {
refLinks = tokens.links;
return tokens;
}
function provideLexer(src, options) {
return (src, options) => {
const lexer = new Lexer(options);
lexer.tokens.links = refLinks;
return this.block ? lexer.lex(src) : lexer.inlineTokens(src);
};
}
marked.use({ hooks: { processAllTokens, provideLexer } });
// Parse reflinks separately from markdown that uses them
marked.parse(`
[test]: http://example.com
`);
console.log(marked.parse(`
[test link][test]
`));
```
**Output:**
```html
```
**Example:** Mask underline characters inside Mathjax content delimited by `$`
```js
import { marked } from 'marked';
// Override function
function emStrongMask(src) {
return src.replace(/\$([^$]+)\$/g, (match) => `[${'a'.repeat(match.length - 2)}]`);
}
marked.use({ hooks: { emStrongMask } });
console.log(marked.parse(`_The formula is $a_ b=c_ d$._`));
```
**Output:**
```html
The formula is $a_ b=c_ d$.
```
***
Custom Extensions : extensions
You may supply an `extensions` array to the `options` object. This array can contain any number of `extension` objects, using the following properties:
name
- A string used to identify the token that will be handled by this extension.
If the name matches an existing extension name, or an existing method in the tokenizer/renderer methods listed above, they will override the previously assigned behavior, with priority on the extension that was assigned **last**. An extension can return `false` to fall back to the previous behavior.
level
- A string to determine when to run the extension tokenizer. Must be equal to 'block' or 'inline'.
A **block-level** extension will be handled before any of the block-level tokenizer methods listed above, and generally consists of 'container-type' text (paragraphs, tables, blockquotes, etc.).
An **inline-level** extension will be handled inside each block-level token, before any of the inline-level tokenizer methods listed above. These generally consist of 'style-type' text (italics, bold, etc.).
start(string src)
- A function that returns the index of the next potential start of the custom token.
The index can be the result of a
src.match().index, or even a simple src.indexOf(). Marked will use this function to ensure that it does not skip over any text that should be part of the custom token.
tokenizer(string src, array tokens)
- A function that reads string of Markdown text and returns a generated token. The token pattern should be found at the beginning of the
src string. Accordingly, if using a Regular Expression to detect a token, it should be anchored to the string start (`^`). The tokens parameter contains the array of tokens that have been generated by the lexer up to that point, and can be used to access the previous token, for instance.
The return value should be an object with the following parameters:
type
- A string that matches the
name parameter of the extension.
raw
- A string containing all of the text that this token consumes from the source.
tokens [optional]
- An array of child tokens that will be traversed by the
walkTokens function by default.
The returned token can also contain any other custom parameters of your choice that your custom `renderer` might need to access.
The tokenizer function has access to the lexer in the `this` object, which can be used if any internal section of the string needs to be parsed further, such as in handling any inline syntax on the text within a block token. The key functions that may be useful include:
this.lexer.blockTokens(string text, array tokens)
- This runs the block tokenizer functions (including any block-level extensions) on the provided text, and appends any resulting tokens onto the
tokens array. The tokens array is also returned by the function. You might use this, for example, if your extension creates a "container"-type token (such as a blockquote) that can potentially include other block-level tokens inside.
this.lexer.inline(string text, array tokens)
- Parsing of inline-level tokens only occurs after all block-level tokens have been generated. This function adds
text and tokens to a queue to be processed using inline-level tokenizers (including any inline-level extensions) at that later step. Tokens will be generated using the provided text, and any resulting tokens will be appended to the tokens array. Note that this function does **NOT** return anything since the inline processing cannot happen until the block-level processing is complete.
this.lexer.inlineTokens(string text, array tokens)
- Sometimes an inline-level token contains further nested inline tokens (such as a
**strong**
token inside of a ### Heading
). This runs the inline tokenizer functions (including any inline-level extensions) on the provided text, and appends any resulting tokens onto the tokens array. The tokens array is also returned by the function.
renderer(object token)
- A function that reads a token and returns the generated HTML output string.
The renderer function has access to the parser in the `this` object, which can be used if any part of the token needs needs to be parsed further, such as any child tokens. The key functions that may be useful include:
this.parser.parse(array tokens)
- Runs the block renderer functions (including any extensions) on the provided array of tokens, and returns the resulting HTML string output. This is used to generate the HTML from any child block-level tokens, for example if your extension is a "container"-type token (such as a blockquote) that can potentially include other block-level tokens inside.
this.parser.parseInline(array tokens)
- Runs the inline renderer functions (including any extensions) on the provided array of tokens, and returns the resulting HTML string output. This is used to generate the HTML from any child inline-level tokens.
childTokens [optional]
- An array of strings that match the names of any token parameters that should be traversed by the
walkTokens functions. For instance, if you want to use a second custom parameter to contain child tokens in addition to tokens, it could be listed here. If childTokens is provided, the tokens array will not be walked by default unless it is also included in the childTokens array.
> Note: If you would like to release an extension as an npm package you may use the [Marked Extension Template](https://github.com/markedjs/marked-extension-template) which includes all of the things you need to get started. Feel free to create an issue in that [repo](https://github.com/markedjs/marked-extension-template) if you need help.
**Example:** Add a custom syntax to generate `` description lists.
``` js
const descriptionList = {
name: 'descriptionList',
level: 'block', // Is this a block-level or inline-level tokenizer?
start(src) { return src.match(/:[^:\n]/)?.index; }, // Hint to Marked.js to stop and check for a match
tokenizer(src, tokens) {
const rule = /^(?::[^:\n]+:[^:\n]*(?:\n|$))+/; // Regex for the complete token, anchor to string start
const match = rule.exec(src);
if (match) {
const token = { // Token to generate
type: 'descriptionList', // Should match "name" above
raw: match[0], // Text to consume from the source
text: match[0].trim(), // Additional custom properties
tokens: [] // Array where child inline tokens will be generated
};
this.lexer.inline(token.text, token.tokens); // Queue this data to be processed for inline tokens
return token;
}
},
renderer(token) {
return `${this.parser.parseInline(token.tokens)}\n
`; // parseInline to turn child tokens into HTML
}
};
const description = {
name: 'description',
level: 'inline', // Is this a block-level or inline-level tokenizer?
start(src) { return src.match(/:/)?.index; }, // Hint to Marked.js to stop and check for a match
tokenizer(src, tokens) {
const rule = /^:([^:\n]+):([^:\n]*)(?:\n|$)/; // Regex for the complete token, anchor to string start
const match = rule.exec(src);
if (match) {
return { // Token to generate
type: 'description', // Should match "name" above
raw: match[0], // Text to consume from the source
dt: this.lexer.inlineTokens(match[1].trim()), // Additional custom properties, including
dd: this.lexer.inlineTokens(match[2].trim()) // any further-nested inline tokens
};
}
},
renderer(token) {
return `\n- ${this.parser.parseInline(token.dt)}
- ${this.parser.parseInline(token.dd)}
`;
},
childTokens: ['dt', 'dd'], // Any child tokens to be visited by walkTokens
};
function walkTokens(token) { // Post-processing on the completed token tree
if (token.type === 'strong') {
token.text += ' walked';
token.tokens = this.Lexer.lexInline(token.text)
}
}
marked.use({ extensions: [descriptionList, description], walkTokens });
// EQUIVALENT TO:
marked.use({ extensions: [descriptionList] });
marked.use({ extensions: [description] });
marked.use({ walkTokens })
console.log(marked.parse('A Description List:\n'
+ ': Topic 1 : Description 1\n'
+ ': **Topic 2** : *Description 2*'));
```
**Output**
``` bash
A Description List:
- Topic 1
- Description 1
- Topic 2 walked
- Description 2
```
***
Async Marked : async
Marked will return a promise if the `async` option is true. The `async` option will tell marked to await any `walkTokens` functions before parsing the tokens and returning an HTML string.
Simple Example:
```js
const walkTokens = async (token) => {
if (token.type === 'link') {
try {
await fetch(token.href);
} catch (ex) {
token.title = 'invalid';
}
}
};
marked.use({ walkTokens, async: true });
const markdown = `
[valid link](https://example.com)
[invalid link](https://invalidurl.com)
`;
const html = await marked.parse(markdown);
```
Custom Extension Example:
```js
const importUrl = {
extensions: [{
name: 'importUrl',
level: 'block',
start(src) { return src.indexOf('\n:'); },
tokenizer(src) {
const rule = /^:(https?:\/\/.+?):/;
const match = rule.exec(src);
if (match) {
return {
type: 'importUrl',
raw: match[0],
url: match[1],
html: '' // will be replaced in walkTokens
};
}
},
renderer(token) {
return token.html;
}
}],
async: true, // needed to tell marked to return a promise
async walkTokens(token) {
if (token.type === 'importUrl') {
const res = await fetch(token.url);
token.html = await res.text();
}
}
};
marked.use(importUrl);
const markdown = `
# example.com
:https://example.com:
`;
const html = await marked.parse(markdown);
```
The Lexer
The lexer takes a markdown string and calls the tokenizer functions.
The Parser
The parser takes tokens as input and calls the renderer functions.
Access to Lexer and Parser
You also have direct access to the lexer and parser if you so desire. The lexer and parser options are the same as passed to `marked.setOptions()` except they have to be full options objects, they don't get merged with the current or default options.
``` js
const tokens = marked.lexer(markdown, options);
console.log(marked.parser(tokens, options));
```
``` js
const lexer = new marked.Lexer(options);
const tokens = lexer.lex(markdown);
console.log(tokens);
console.log(lexer.tokenizer.rules.block); // block level rules used
console.log(lexer.tokenizer.rules.inline); // inline level rules used
console.log(marked.Lexer.rules.block); // all block level rules
console.log(marked.Lexer.rules.inline); // all inline level rules
```
Note that the lexer can be used in two different ways:
- `marked.lexer()`: this method tokenizes a string and returns its tokens. Subsequent calls to `lexer()` ignore any previous calls.
- `new marked.Lexer().lex()`: this instance tokenizes a string and returns its tokens along with any previous tokens. Subsequent calls to `lex()` accumulate tokens.
``` bash
$ node
> require('marked').lexer('> I am using marked.')
[
{
type: "blockquote",
raw: "> I am using marked.",
tokens: [
{
type: "paragraph",
raw: "I am using marked.",
text: "I am using marked.",
tokens: [
{
type: "text",
raw: "I am using marked.",
text: "I am using marked."
}
]
}
]
},
links: {}
]
```
The Lexer builds an array of tokens, which will be passed to the Parser.
The Parser processes each token in the token array:
``` js
import { marked } from 'marked';
const md = `
# heading
[link][1]
[1]: #heading "heading"
`;
const tokens = marked.lexer(md);
console.log(tokens);
const html = marked.parser(tokens);
console.log(html);
```
``` bash
[
{
type: "heading",
raw: " # heading\n\n",
depth: 1,
text: "heading",
tokens: [
{
type: "text",
raw: "heading",
text: "heading"
}
]
},
{
type: "paragraph",
raw: " [link][1]",
text: " [link][1]",
tokens: [
{
type: "text",
raw: " ",
text: " "
},
{
type: "link",
raw: "[link][1]",
text: "link",
href: "#heading",
title: "heading",
tokens: [
{
type: "text",
raw: "link",
text: "link"
}
]
}
]
},
{
type: "space",
raw: "\n\n"
},
links: {
"1": {
href: "#heading",
title: "heading"
}
}
]
heading
```
================================================
FILE: docs/_document.html
================================================
Marked Documentation
Marked Documentation
================================================
FILE: docs/broken.md
================================================
# Markdown is broken
I have a lot of scraps of markdown engine oddities that I've collected over the
years. What you see below is slightly messy, but it's what I've managed to
cobble together to illustrate the differences between markdown engines, and
why, if there ever is a markdown specification, it has to be absolutely
thorough. There are a lot more of these little differences I have documented
elsewhere. I know I will find them lingering on my disk one day, but until
then, I'll continue to add whatever strange nonsensical things I find.
Some of these examples may only mention a particular engine compared to marked.
However, the examples with markdown.pl could easily be swapped out for
discount, upskirt, or markdown.js, and you would very easily see even more
inconsistencies.
A lot of this was written when I was very unsatisfied with the inconsistencies
between markdown engines. Please excuse the frustration noticeable in my
writing.
## Examples of markdown's "stupid" list parsing
```
$ markdown.pl
* item1
* item2
text
^D
item1
- item2
text
```
```
$ marked
* item1
* item2
text
^D
item1
- item2
text
```
Which looks correct to you?
- - -
```
$ markdown.pl
* hello
> world
^D
- hello
world
```
```
$ marked
* hello
> world
^D
- hello
world
```
Again, which looks correct to you?
- - -
EXAMPLE:
```
$ markdown.pl
* hello
* world
* hi
code
^D
- hello
- world
- hi
code
```
The code isn't a code block even though it's after the bullet margin. I know,
lets give it two more spaces, effectively making it 8 spaces past the bullet.
```
$ markdown.pl
* hello
* world
* hi
code
^D
- hello
- world
- hi
code
```
And, it's still not a code block. Did you also notice that the 3rd item isn't
even its own list? Markdown screws that up too because of its indentation
unaware parsing.
- - -
Let's look at some more examples of markdown's list parsing:
```
$ markdown.pl
* item1
* item2
text
^D
item1
- item2
text
```
Misnested tags.
```
$ marked
* item1
* item2
text
^D
item1
- item2
text
```
Which looks correct to you?
- - -
```
$ markdown.pl
* hello
> world
^D
- hello
world
```
More misnested tags.
```
$ marked
* hello
> world
^D
- hello
world
```
Again, which looks correct to you?
- - -
# Why quality matters - Part 2
``` bash
$ markdown.pl
* hello
> world
^D
- hello
world
```
``` bash
$ sundown # upskirt
* hello
> world
^D
- hello
> world
```
``` bash
$ marked
* hello
> world
^D
- hello
world
```
Which looks correct to you?
- - -
See: https://github.com/evilstreak/markdown-js/issues/23
``` bash
$ markdown.pl # upskirt/markdown.js/discount
* hello
var a = 1;
* world
^D
- hello
var a = 1;
- world
```
``` bash
$ marked
* hello
var a = 1;
* world
^D
- hello
code>var a = 1;
<div>hello</div>
<span>hello</span>
``` ``` bash $ markedhello
``` - - - See: https://github.com/evilstreak/markdown-js/issues/27 ``` bash $ markdown.js [](/link) ^D ``` ``` bash $ marked [](/link) ^D ``` - - - See: https://github.com/evilstreak/markdown-js/issues/24 ``` bash $ markdown.js > a > b > c ^D``` ``` bash $ marked > a > b > c ^Da
bundefined> c
a
b
``` - - - ``` bash $ markdown.pl * hello * world how are you * today * hi ^Dc
hello
are you
hello
world how
are you
today
tag
itself has a background, hiding the background.
*/
.prose pre code.hljs {
background-color: transparent !important;
}
/* ============================================
MOBILE RESPONSIVE STYLES
============================================ */
/* Mobile Menu Toggle Button */
.mobile-menu-toggle {
display: none; /* Hidden on desktop by default */
position: fixed;
top: 16px;
left: 16px;
z-index: 9998;
width: 48px;
height: 48px;
border: none;
border-radius: 8px;
background-color: var(--background-color);
color: var(--text-color);
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
cursor: pointer;
transition: background-color 0.3s ease, transform 0.2s ease;
align-items: center;
justify-content: center;
}
.mobile-menu-toggle:hover {
background-color: var(--code-bg-color);
transform: scale(1.05);
}
.mobile-menu-toggle:active {
transform: scale(0.95);
}
.dark .mobile-menu-toggle {
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}
/* Mobile Overlay */
.mobile-overlay {
display: none;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0.5);
z-index: 39;
opacity: 0;
transition: opacity 0.3s ease;
}
.mobile-overlay.active {
opacity: 1;
}
/* Mobile Styles - Changed breakpoint from 768px to 1024px */
@media (max-width: 1024px) {
/* Show mobile menu button */
.mobile-menu-toggle {
display: flex;
}
/* Hide sidebar by default on mobile */
.sidebar {
transform: translateX(-100%);
transition: transform 0.3s ease;
}
/* Show sidebar when menu is open */
.sidebar.mobile-open {
transform: translateX(0);
}
/* Show overlay when menu is open */
.mobile-overlay.active {
display: block;
}
/* Adjust main content for mobile */
.main-content {
margin-left: 0 !important;
padding: 80px 20px 20px 20px !important;
width: 100%;
}
/* Adjust theme toggle button position on mobile */
#theme-toggle {
position: fixed;
top: 16px;
right: 16px;
z-index: 9998;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
background-color: var(--background-color);
}
.dark #theme-toggle {
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}
/* Adjust GitHub corner for mobile */
.github-corner {
display: none;
}
/* Make sidebar full height on mobile */
.sidebar {
width: 280px;
max-width: 85vw;
}
/* Adjust heading sizes for mobile */
.main-content h1 {
font-size: 2rem !important;
}
/* Adjust prose max-width for mobile */
.prose {
max-width: 100% !important;
}
/* Make tables scrollable on mobile */
.prose table {
display: block;
overflow-x: auto;
white-space: nowrap;
}
/* Adjust code blocks for mobile */
.prose pre {
font-size: 0.875rem;
padding: 1rem;
}
}
/* Prevent body scroll when mobile menu is open */
body.mobile-menu-open {
overflow: hidden;
}
@media (max-width: 1024px) {
body.mobile-menu-open {
overflow: hidden;
}
}
================================================
FILE: docs/demo/demo.css
================================================
html, body {
margin: 0;
padding: 0;
font-family: "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif;
color: var(--text-color);
background-color: var(--background-color);
height: 100%;
overflow: auto;
transition: background-color 0.3s ease, color 0.3s ease;
}
textarea {
font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
font-size: 12px;
resize: none;
}
header {
padding: 16px 24px;
display: flex;
align-items: center;
height: 68px;
box-sizing: border-box;
border-bottom: 1px solid var(--border-color);
gap: 16px;
}
header .logo-link {
display: flex;
align-items: center;
}
header h1 {
margin: 0;
font-size: 24px;
font-weight: 700;
color: inherit;
}
.other-demos {
margin-left: auto;
display: flex;
align-items: center;
gap: 8px;
font-size: 14px;
}
.other-demos a {
color: var(--subtle-text-color);
text-decoration: none;
transition: color 0.2s ease;
}
.other-demos a:hover {
color: #3B82F6;
}
.other-demos .separator {
color: var(--subtle-text-color);
}
.theme-toggle {
margin-left: 16px;
display: flex;
align-items: center;
gap: 8px;
padding: 8px 16px;
border: none;
border-radius: 8px;
background-color: transparent;
color: var(--subtle-text-color);
cursor: pointer;
font-family: inherit;
font-size: 14px;
font-weight: 500;
transition: background-color 0.2s ease, color 0.2s ease;
}
.theme-toggle:hover {
background-color: var(--code-bg-color);
color: var(--text-color);
}
.theme-toggle .material-icons {
font-size: 20px;
}
.containers {
display: flex;
height: calc(100vh - 68px);
gap: 12px;
padding: 12px;
box-sizing: border-box;
}
.container {
flex-basis: 50%;
display: flex;
flex-direction: column;
height: 100%;
box-sizing: border-box;
}
.label {
padding: 8px 12px;
background-color: var(--code-bg-color);
border: 1px solid var(--border-color);
border-radius: 8px 8px 0 0;
font-size: 14px;
font-weight: 500;
display: flex;
align-items: center;
gap: 8px;
color: var(--text-color);
}
.label select,
.label button {
padding: 4px 8px;
border-radius: 4px;
border: 1px solid var(--border-color);
background-color: var(--background-color);
color: var(--text-color);
font-size: 13px;
cursor: pointer;
transition: border-color 0.2s ease;
}
.label select:hover,
.label button:hover {
border-color: #3B82F6;
}
.label a {
color: #3B82F6;
text-decoration: none;
}
.label a:hover {
text-decoration: underline;
}
.pane, .inputPane {
padding: 12px;
border: 1px solid var(--border-color);
border-top: none;
border-radius: 0 0 8px 8px;
overflow: auto;
flex-grow: 1;
flex-shrink: 1;
background-color: var(--background-color);
color: var(--text-color);
transition: background-color 0.3s ease, border-color 0.3s ease;
}
#preview {
display: flex;
}
#preview iframe {
flex-grow: 1;
border-radius: 0 0 8px 8px;
}
#main {
display: none;
}
#loading {
display: flex;
align-items: center;
justify-content: center;
height: 100vh;
font-size: 18px;
color: var(--subtle-text-color);
}
.error {
border-color: #EF4444 !important;
background-color: #FEF2F2 !important;
}
.loadingError {
background-color: #FEF2F2;
font-weight: 600;
color: #DC2626;
text-align: center;
padding: 16px;
border-radius: 8px;
margin: 20px;
}
#responseTime {
display: inline-block;
font-weight: 600;
color: #3B82F6;
}
/* Dark mode specific overrides */
html.dark .error {
background-color: #2c1d1d !important;
border-color: #F87171 !important;
color: #FCA5A5;
}
html.dark .loadingError {
background-color: #2c1d1d;
color: #FCA5A5;
}
html.dark #loading {
color: #9CA3AF;
}
================================================
FILE: docs/demo/demo.js
================================================
onunhandledrejection = (e) => {
throw e.reason;
};
const $loadingElem = document.querySelector('#loading');
const $mainElem = document.querySelector('#main');
const $markdownElem = document.querySelector('#markdown');
const $markedVerElem = document.querySelector('#markedVersion');
const $optionsElem = document.querySelector('#options');
const $outputTypeElem = document.querySelector('#outputType');
const $inputTypeElem = document.querySelector('#inputType');
const $responseTimeElem = document.querySelector('#responseTime');
const $previewElem = document.querySelector('#preview');
const $previewIframe = document.querySelector('#preview iframe');
const $permalinkElem = document.querySelector('#permalink');
const $clearElem = document.querySelector('#clear');
const $htmlElem = document.querySelector('#html');
const $lexerElem = document.querySelector('#lexer');
const $panes = document.querySelectorAll('.pane');
const $inputPanes = document.querySelectorAll('.inputPane');
let lastInput = '';
let inputDirty = true;
let $activeOutputElem = null;
let latestVersion = 'master';
const search = searchToObject();
const markedVersions = {
master: '../',
};
let delayTime = 1;
let checkChangeTimeout = null;
let markedWorker;
$previewIframe.addEventListener('load', handleIframeLoad);
$outputTypeElem.addEventListener('change', handleOutputChange, false);
$inputTypeElem.addEventListener('change', handleInputChange, false);
$markedVerElem.addEventListener('change', handleVersionChange, false);
$markdownElem.addEventListener('change', handleInput, false);
$markdownElem.addEventListener('keyup', handleInput, false);
$markdownElem.addEventListener('keypress', handleInput, false);
$markdownElem.addEventListener('keydown', handleInput, false);
$optionsElem.addEventListener('change', handleInput, false);
$optionsElem.addEventListener('keyup', handleInput, false);
$optionsElem.addEventListener('keypress', handleInput, false);
$optionsElem.addEventListener('keydown', handleInput, false);
$clearElem.addEventListener('click', handleClearClick, false);
// --- Theme Toggle Setup ---
const $themeToggle = document.getElementById('theme-toggle');
const $themeToggleIcon = $themeToggle ? $themeToggle.querySelector('[data-theme-icon]') : null;
const $themeToggleText = $themeToggle ? $themeToggle.querySelector('[data-theme-text]') : null;
const THEME_STORAGE_KEY = 'theme-preference';
const LEGACY_STORAGE_KEY = 'theme';
const THEME_ORDER = ['system', 'light', 'dark'];
const TOGGLE_UI = {
system: { icon: 'brightness_auto', text: 'System' },
light: { icon: 'light_mode', text: 'Light' },
dark: { icon: 'dark_mode', text: 'Dark' },
};
function applyTheme(theme) {
if (theme === 'dark') {
document.documentElement.classList.add('dark');
} else {
document.documentElement.classList.remove('dark');
}
document.documentElement.setAttribute('data-theme', theme);
try {
if ($previewIframe && $previewIframe.contentDocument) {
if (theme === 'dark') {
$previewIframe.contentDocument.documentElement.classList.add('dark');
} else {
$previewIframe.contentDocument.documentElement.classList.remove('dark');
}
}
} catch {
// Ignore cross-origin errors
}
}
function getSystemTheme() {
if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
return 'dark';
}
return 'light';
}
function sanitisePreference(value) {
return THEME_ORDER.includes(value) ? value : null;
}
function readStoredPreference() {
try {
const stored = sanitisePreference(localStorage.getItem(THEME_STORAGE_KEY));
if (stored) {
return stored;
}
return sanitisePreference(localStorage.getItem(LEGACY_STORAGE_KEY));
} catch {
return null;
}
}
function writeStoredPreference(preference) {
try {
localStorage.setItem(THEME_STORAGE_KEY, preference);
if (preference === 'light' || preference === 'dark') {
localStorage.setItem(LEGACY_STORAGE_KEY, preference);
} else {
localStorage.removeItem(LEGACY_STORAGE_KEY);
}
} catch {
// Storage might be unavailable; ignore
}
}
function getEffectiveTheme(preference) {
return preference === 'system' ? getSystemTheme() : preference;
}
function updateToggle(preference) {
if (!$themeToggle) {
return;
}
const details = TOGGLE_UI[preference] || TOGGLE_UI.system;
if ($themeToggleIcon) {
$themeToggleIcon.textContent = details.icon;
}
if ($themeToggleText) {
$themeToggleText.textContent = details.text;
}
$themeToggle.setAttribute('data-theme-mode', preference);
const label = `Switch theme (current: ${details.text})`;
$themeToggle.setAttribute('aria-label', label);
$themeToggle.title = label;
}
let currentPreference = readStoredPreference() || 'system';
function applyPreference(preference, persist) {
currentPreference = preference;
const effectiveTheme = getEffectiveTheme(preference);
applyTheme(effectiveTheme);
document.documentElement.setAttribute('data-theme-preference', preference);
updateToggle(preference);
if (persist) {
writeStoredPreference(preference);
}
}
applyPreference(currentPreference, true);
if ($themeToggle) {
$themeToggle.addEventListener('click', function() {
const index = THEME_ORDER.indexOf(currentPreference);
const nextIndex = (index + 1) % THEME_ORDER.length;
const nextPreference = THEME_ORDER[nextIndex];
applyPreference(nextPreference, true);
});
}
const systemMatcher = window.matchMedia ? window.matchMedia('(prefers-color-scheme: dark)') : null;
if (systemMatcher) {
const handleSystemChange = function() {
if (currentPreference === 'system') {
applyPreference('system', false);
}
};
if (typeof systemMatcher.addEventListener === 'function') {
systemMatcher.addEventListener('change', handleSystemChange);
} else if (typeof systemMatcher.addListener === 'function') {
systemMatcher.addListener(handleSystemChange);
}
}
Promise.all([
setInitialQuickref(),
setInitialOutputType(),
setInitialText(),
setInitialVersion().then(setInitialOptions),
])
.then(() => {
handleInputChange();
handleOutputChange();
checkForChanges();
setScrollPercent(0);
$loadingElem.style.display = 'none';
$mainElem.style.display = 'block';
})
.catch(() => {
$loadingElem.classList.add('loadingError');
$loadingElem.textContent =
'Failed to load marked. Refresh the page to try again.';
});
function setInitialText() {
if ('text' in search) {
$markdownElem.value = search.text;
} else {
return fetch('./initial.md')
.then((res) => res.text())
.then((text) => {
if ($markdownElem.value === '') {
$markdownElem.value = text;
}
});
}
}
function setInitialQuickref() {
return fetch('./quickref.md')
.then((res) => res.text())
.then((text) => {
document.querySelector('#quickref').value = text;
});
}
function setInitialVersion() {
return fetch('https://data.jsdelivr.com/v1/package/npm/marked')
.then((res) => res.json())
.then((json) => {
for (const ver of json.versions) {
markedVersions[ver] = 'https://cdn.jsdelivr.net/npm/marked@' + ver;
const opt = document.createElement('option');
opt.textContent = ver;
opt.value = ver;
$markedVerElem.appendChild(opt);
}
if (location.host === 'marked.js.org') {
latestVersion = json.tags.latest;
} else {
$markedVerElem.querySelector('option[value="master"]').textContent =
'This Build';
}
if (search.version && markedVersions[search.version]) {
$markedVerElem.value = search.version;
return;
}
$markedVerElem.value = latestVersion;
})
.then(updateVersion);
}
function setInitialOptions() {
if ('options' in search) {
$optionsElem.value = search.options;
} else {
return setDefaultOptions();
}
}
function setInitialOutputType() {
if (search.outputType) {
$outputTypeElem.value = search.outputType;
}
}
function handleIframeLoad() {
lastInput = '';
inputDirty = true;
// Apply current theme to the iframe
try {
const currentTheme = document.documentElement.classList.contains('dark')
? 'dark'
: 'light';
if ($previewIframe && $previewIframe.contentDocument) {
if (currentTheme === 'dark') {
$previewIframe.contentDocument.documentElement.classList.add('dark');
} else {
$previewIframe.contentDocument.documentElement.classList.remove('dark');
}
}
} catch {
// Ignore cross-origin errors
}
}
function handleInput() {
inputDirty = true;
}
function handleVersionChange() {
updateVersion();
}
function handleClearClick() {
$markdownElem.value = '';
$markedVerElem.value = latestVersion;
updateVersion();
setDefaultOptions();
}
function handleInputChange() {
handleChange($inputPanes, $inputTypeElem.value);
}
function handleOutputChange() {
$activeOutputElem = handleChange($panes, $outputTypeElem.value);
updateLink();
}
function handleChange(panes, visiblePane) {
let active = null;
for (let i = 0; i < panes.length; i++) {
if (panes[i].id === visiblePane) {
panes[i].style.display = '';
active = panes[i];
} else {
panes[i].style.display = 'none';
}
}
return active;
}
function setDefaultOptions() {
return messageWorker({
task: 'defaults',
version: markedVersions[$markedVerElem.value],
});
}
function setOptions(opts) {
$optionsElem.value = JSON.stringify(
opts,
(key, value) => {
if (value !== null
&& typeof value === 'object'
&& Object.getPrototypeOf(value) !== Object.prototype
) {
return undefined;
}
return value;
},
' ',
);
}
function searchToObject() {
// modified from https://stackoverflow.com/a/7090123/806777
const pairs = location.search.slice(1).split('&');
const obj = {};
for (let i = 0; i < pairs.length; i++) {
if (pairs[i] === '') {
continue;
}
const pair = pairs[i].split('=');
obj[decodeURIComponent(pair.shift())] = decodeURIComponent(pair.join('='));
}
return obj;
}
function getScrollSize() {
if (!$activeOutputElem) {
return 0;
}
const e = $activeOutputElem;
return e.scrollHeight - e.clientHeight;
}
function getScrollPercent() {
if (!$activeOutputElem) {
return 1;
}
const size = getScrollSize();
if (size <= 0) {
return 1;
}
return $activeOutputElem.scrollTop / size;
}
function setScrollPercent(percent) {
if ($activeOutputElem) {
$activeOutputElem.scrollTop = percent * getScrollSize();
}
}
function updateLink() {
let outputType = '';
if ($outputTypeElem.value !== 'preview') {
outputType = 'outputType='
+ $outputTypeElem.value
+ '&';
}
$permalinkElem.href = '?'
+ outputType
+ 'text='
+ encodeURIComponent($markdownElem.value)
+ '&options='
+ encodeURIComponent($optionsElem.value)
+ '&version='
+ encodeURIComponent($markedVerElem.value);
history.replaceState('', document.title, $permalinkElem.href);
}
function updateVersion() {
handleInput();
}
function checkForChanges() {
if (inputDirty && $markedVerElem.value !== 'pr') {
inputDirty = false;
updateLink();
let options = {};
const optionsString = $optionsElem.value || '{}';
try {
const newOptions = JSON.parse(optionsString);
options = newOptions;
$optionsElem.classList.remove('error');
} catch {
$optionsElem.classList.add('error');
}
const version = markedVersions[$markedVerElem.value];
const markdown = $markdownElem.value;
const hash = version + markdown + optionsString;
if (lastInput !== hash) {
lastInput = hash;
delayTime = 100;
messageWorker({
task: 'parse',
version,
markdown,
options,
});
}
}
checkChangeTimeout = window.setTimeout(checkForChanges, delayTime);
}
function setResponseTime(ms) {
let amount = ms;
let suffix = 'ms';
if (ms > 1000 * 60 * 60) {
amount = 'Too Long';
suffix = '';
} else if (ms > 1000 * 60) {
amount = '>'
+ Math.floor(ms / (1000 * 60));
suffix = 'm';
} else if (ms > 1000) {
amount = '>'
+ Math.floor(ms / 1000);
suffix = 's';
}
$responseTimeElem.textContent = amount + suffix;
$responseTimeElem.animate(
[{ transform: 'scale(1.2)' }, { transform: 'scale(1)' }],
200,
);
}
function setParsed(parsed, lexed) {
try {
$previewIframe.contentDocument.body.innerHTML = parsed;
} catch {}
$htmlElem.value = parsed;
$lexerElem.value = lexed;
}
const workerPromises = {};
function messageWorker(message) {
if (!markedWorker || markedWorker.working) {
if (markedWorker) {
clearTimeout(markedWorker.timeout);
markedWorker.terminate();
}
markedWorker = new Worker('worker.js');
markedWorker.onmessage = (e) => {
clearTimeout(markedWorker.timeout);
markedWorker.working = false;
switch (e.data.task) {
case 'defaults': {
setOptions(e.data.defaults);
break;
}
case 'parse': {
$previewElem.classList.remove('error');
$htmlElem.classList.remove('error');
$lexerElem.classList.remove('error');
const scrollPercent = getScrollPercent();
setParsed(e.data.parsed, e.data.lexed);
setScrollPercent(scrollPercent);
setResponseTime(e.data.time);
break;
}
}
clearTimeout(checkChangeTimeout);
delayTime = 10;
checkForChanges();
workerPromises[e.data.id]();
delete workerPromises[e.data.id];
};
markedWorker.onerror = markedWorker.onmessageerror = (err) => {
clearTimeout(markedWorker.timeout);
let error = 'There was an error in the Worker';
if (err) {
if (err.message) {
error = err.message;
} else {
error = err;
}
}
error = error.replace(/^Uncaught Error: /, '');
$previewElem.classList.add('error');
$htmlElem.classList.add('error');
$lexerElem.classList.add('error');
setParsed(error, error);
setScrollPercent(0);
};
}
if (message.task !== 'defaults') {
markedWorker.working = true;
workerTimeout(0);
}
return new Promise((resolve) => {
message.id = uniqueWorkerMessageId();
workerPromises[message.id] = resolve;
markedWorker.postMessage(message);
});
}
function uniqueWorkerMessageId() {
let id;
do {
id = Math.random().toString(36);
} while (id in workerPromises);
return id;
}
function workerTimeout(seconds) {
markedWorker.timeout = setTimeout(() => {
seconds++;
markedWorker.onerror(
'Marked has taken longer than '
+ seconds
+ ' second'
+ (seconds > 1 ? 's' : '')
+ ' to respond...',
);
workerTimeout(seconds);
}, 1000);
}
================================================
FILE: docs/demo/index.html
================================================
Marked Demo
Marked Demo
Loading...
·
Response Time:
================================================
FILE: docs/demo/initial.md
================================================
Marked - Markdown Parser
========================
[Marked] lets you convert [Markdown] into HTML. Markdown is a simple text format whose goal is to be very easy to read and write, even when not converted to HTML. This demo page will let you type anything you like and see how it gets converted. Live. No more waiting around.
How To Use The Demo
-------------------
1. Type in stuff on the left.
2. See the live updates on the right.
That's it. Pretty simple. There's also a drop-down option above to switch between various views:
- **Preview:** A live display of the generated HTML as it would render in a browser.
- **HTML Source:** The generated HTML before your browser makes it pretty.
- **Lexer Data:** What [marked] uses internally, in case you like gory stuff like this.
- **Quick Reference:** A brief run-down of how to format things using markdown.
Why Markdown?
-------------
It's easy. It's not overly bloated, unlike HTML. Also, as the creator of [markdown] says,
> The overriding design goal for Markdown's
> formatting syntax is to make it as readable
> as possible. The idea is that a
> Markdown-formatted document should be
> publishable as-is, as plain text, without
> looking like it's been marked up with tags
> or formatting instructions.
Ready to start writing? Either start changing stuff on the left or
[clear everything](/demo/?text=) with a simple click.
[Marked]: https://github.com/markedjs/marked/
[Markdown]: http://daringfireball.net/projects/markdown/
================================================
FILE: docs/demo/preview.html
================================================
marked.js preview
================================================
FILE: docs/demo/quickref.md
================================================
Markdown Quick Reference
========================
This guide is a very brief overview, with examples, of the syntax that [Markdown] supports. It is itself written in Markdown and you can copy the samples over to the left-hand pane for experimentation. It's shown as *text* and not *rendered HTML*.
[Markdown]: http://daringfireball.net/projects/markdown/
Simple Text Formatting
======================
First thing is first. You can use *stars* or _underscores_ for italics. **Double stars** and __double underscores__ for bold. ***Three together*** for ___both___.
Paragraphs are pretty easy too. Just have a blank line between chunks of text.
> This chunk of text is in a block quote. Its multiple lines will all be
> indented a bit from the rest of the text.
>
> > Multiple levels of block quotes also work.
Sometimes you want to include code, such as when you are explaining how `` HTML tags work, or maybe you are a programmer and you are discussing `someMethod()`.
If you want to include code and have new
lines preserved, indent the line with a tab
or at least four spaces:
Extra spaces work here too.
This is also called preformatted text and it is useful for showing examples.
The text will stay as text, so any *markdown* or HTML you add will
not show up formatted. This way you can show markdown examples in a
markdown document.
> You can also use preformatted text with your blockquotes
> as long as you add at least five spaces.
Headings
========
There are a couple of ways to make headings. Using three or more equals signs on a line under a heading makes it into an "h1" style. Three or more hyphens under a line makes it "h2" (slightly smaller). You can also use multiple pound symbols (`#`) before and after a heading. Pounds after the title are ignored. Here are some examples:
This is H1
==========
This is H2
----------
# This is H1
## This is H2
### This is H3 with some extra pounds ###
#### You get the idea ####
##### I don't need extra pounds at the end
###### H6 is the max
Links
=====
Let's link to a few sites. First, let's use the bare URL, like . Great for text, but ugly for HTML.
Next is an inline link to [Google](https://www.google.com). A little nicer.
This is a reference-style link to [Wikipedia] [1].
Lastly, here's a pretty link to [Yahoo]. The reference-style and pretty links both automatically use the links defined below, but they could be defined *anywhere* in the markdown and are removed from the HTML. The names are also case insensitive, so you can use [YaHoO] and have it link properly.
[1]: https://www.wikipedia.org
[Yahoo]: https://www.yahoo.com
Title attributes may be added to links by adding text after a link.
This is the [inline link](https://www.bing.com "Bing") with a "Bing" title.
You can also go to [W3C] [2] and maybe visit a [friend].
[2]: https://w3c.org (The W3C puts out specs for web-based things)
[Friend]: https://facebook.com "Facebook!"
Email addresses in plain text are not linked: test@example.com.
Email addresses wrapped in angle brackets are linked: .
They are also obfuscated so that email harvesting spam robots hopefully won't get them.
Lists
=====
* This is a bulleted list
* Great for shopping lists
- You can also use hyphens
+ Or plus symbols
The above is an "unordered" list. Now, on for a bit of order.
1. Numbered lists are also easy
2. Just start with a number
3738762. However, the actual number doesn't matter when converted to HTML.
1. This will still show up as 4.
You might want a few advanced lists:
- This top-level list is wrapped in paragraph tags
- This generates an extra space between each top-level item.
- You do it by adding a blank line
- This nested list also has blank lines between the list items.
- How to create nested lists
1. Start your regular list
2. Indent nested lists with two spaces
3. Further nesting means you should indent with two more spaces
* This line is indented with four spaces.
- List items can be quite lengthy. You can keep typing and either continue
them on the next line with no indentation.
- Alternately, if that looks ugly, you can also
indent the next line a bit for a prettier look.
- You can put large blocks of text in your list by just indenting with two spaces.
This is formatted the same as code, but you can inspect the HTML
and find that it's just wrapped in a `` tag and *won't* be shown
as preformatted text.
You can keep adding more and more paragraphs to a single
list item by adding the traditional blank line and then keep
on indenting the paragraphs with two spaces.
You really only need to indent the first line,
but that looks ugly.
- Lists support blockquotes
> Just like this example here. By the way, you can
> nest lists inside blockquotes!
> - Fantastic!
- Lists support preformatted text
You just need to indent an additional four spaces.
Even More
=========
Horizontal Rule
---------------
If you need a horizontal rule you just need to put at least three hyphens, asterisks, or underscores on a line by themselves. You can also even put spaces between the characters.
---
****************************
_ _ _ _ _ _ _
Those three all produced horizontal lines. Keep in mind that three hyphens under any text turns that text into a heading, so add a blank like if you use hyphens.
Images
------
Images work exactly like links, but they have exclamation points in front. They work with references and titles too.
 and ![Happy].
[Happy]: https://wpclipart.com/smiley/happy/simple_colors/smiley_face_simple_green_small.png ("Smiley face")
Inline HTML
-----------
If markdown is too limiting, you can just insert your own crazy HTML. Span-level HTML can *still* use markdown. Block level elements must be separated from text by a blank line and must not have any spaces before the opening and closing HTML.
It is a pity, but markdown does **not** work in here for most markdown parsers.
[Marked] handles it pretty well.
================================================
FILE: docs/demo/worker.js
================================================
const versionCache = {};
let currentVersion;
onunhandledrejection = (e) => {
throw e.reason;
};
onmessage = function(e) {
if (e.data.version === currentVersion) {
parse(e);
} else {
loadVersion(e.data.version).then(() => {
parse(e);
});
}
};
function getDefaults() {
const marked = versionCache[currentVersion];
let defaults = {};
if (typeof marked.getDefaults === 'function') {
defaults = marked.getDefaults();
delete defaults.renderer;
} else if ('defaults' in marked) {
for (const prop in marked.defaults) {
if (prop !== 'renderer') {
defaults[prop] = marked.defaults[prop];
}
}
}
return defaults;
}
function mergeOptions(options) {
const defaults = getDefaults();
const opts = {};
const invalidOptions = [
'renderer',
'tokenizer',
'walkTokens',
'extensions',
'highlight',
'sanitizer',
];
for (const prop in defaults) {
opts[prop] = invalidOptions.includes(prop) || !(prop in options)
? defaults[prop]
: options[prop];
}
return opts;
}
function parse(e) {
switch (e.data.task) {
case 'defaults': {
postMessage({
id: e.data.id,
task: e.data.task,
defaults: getDefaults(),
});
break;
}
case 'parse': {
const marked = versionCache[currentVersion];
// marked 0.0.1 had tokens array as the second parameter of lexer and no options
const options = currentVersion.endsWith('@0.0.1') ? [] : mergeOptions(e.data.options);
const startTime = new Date();
const lexed = marked.lexer(e.data.markdown, options);
const lexedList = jsonString(lexed);
const parsed = marked.parser(lexed, options);
const endTime = new Date();
postMessage({
id: e.data.id,
task: e.data.task,
lexed: lexedList,
parsed,
time: endTime - startTime,
});
break;
}
}
}
function jsonString(input, level) {
level = level || 0;
if (Array.isArray(input)) {
if (input.length === 0) {
return '[]';
}
const items = [];
let i;
if (!Array.isArray(input[0]) && typeof input[0] === 'object' && input[0] !== null) {
for (i = 0; i < input.length; i++) {
items.push(' '.repeat(2 * level) + jsonString(input[i], level + 1));
}
return '[\n' + items.join('\n') + '\n]';
}
for (i = 0; i < input.length; i++) {
items.push(jsonString(input[i], level));
}
return '[' + items.join(', ') + ']';
} else if (typeof input === 'object' && input !== null) {
const props = [];
for (const prop in input) {
props.push(prop + ':' + jsonString(input[prop], level));
}
return '{' + props.join(', ') + '}';
} else {
return JSON.stringify(input);
}
}
function fetchMarked(file) {
return () =>
fetch(file)
.then((res) => res.text())
.then((text) => {
const g = globalThis || global;
g.module = { };
try {
// eslint-disable-next-line no-new-func
Function(text)();
} catch {
throw new Error(`Cannot find ${file}`);
}
const marked = g.marked || g.module.exports;
return marked;
});
}
function loadVersion(ver) {
let promise;
if (versionCache[ver]) {
promise = Promise.resolve();
} else {
promise = import(ver + '/lib/marked.esm.js')
.catch(fetchMarked(ver + '/marked.min.js'))
.catch(fetchMarked(ver + '/lib/marked.umd.js'))
.catch(fetchMarked(ver + '/lib/marked.js'))
.then((marked) => {
if (!marked) {
throw Error('No marked');
} else if (marked.marked) {
versionCache[ver] = marked.marked;
} else if (marked.default) {
versionCache[ver] = marked.default;
} else if (marked.lexer && marked.parser) {
versionCache[ver] = marked;
} else {
throw new Error('Cannot find marked');
}
});
}
return promise.then(() => {
currentVersion = ver;
}).catch((err) => {
console.error(err);
throw new Error('Cannot load that version of marked');
});
}
================================================
FILE: docs/js/index.js
================================================
document.addEventListener('DOMContentLoaded', function() {
// --- Theme Toggling ---
const themeToggle = document.getElementById('theme-toggle');
const themeToggleIcon = themeToggle ? themeToggle.querySelector('[data-theme-icon]') : null;
const themeToggleText = themeToggle ? themeToggle.querySelector('[data-theme-text]') : null;
const THEME_STORAGE_KEY = 'theme-preference';
const LEGACY_STORAGE_KEY = 'theme';
const THEME_ORDER = ['system', 'light', 'dark'];
const TOGGLE_UI = {
system: { icon: 'brightness_auto', text: 'System' },
light: { icon: 'light_mode', text: 'Light' },
dark: { icon: 'dark_mode', text: 'Dark' },
};
function applyTheme(theme) {
if (theme === 'dark') {
document.documentElement.classList.add('dark');
} else {
document.documentElement.classList.remove('dark');
}
document.documentElement.setAttribute('data-theme', theme);
}
function getSystemTheme() {
if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
return 'dark';
}
return 'light';
}
function sanitisePreference(value) {
return THEME_ORDER.includes(value) ? value : null;
}
function readStoredPreference() {
try {
const stored = sanitisePreference(localStorage.getItem(THEME_STORAGE_KEY));
if (stored) {
return stored;
}
return sanitisePreference(localStorage.getItem(LEGACY_STORAGE_KEY));
} catch {
return null;
}
}
function writeStoredPreference(preference) {
try {
localStorage.setItem(THEME_STORAGE_KEY, preference);
if (preference === 'light' || preference === 'dark') {
localStorage.setItem(LEGACY_STORAGE_KEY, preference);
} else {
localStorage.removeItem(LEGACY_STORAGE_KEY);
}
} catch {
// Storage might be unavailable; ignore
}
}
function getEffectiveTheme(preference) {
return preference === 'system' ? getSystemTheme() : preference;
}
function updateToggle(preference) {
if (!themeToggle) {
return;
}
const details = TOGGLE_UI[preference] || TOGGLE_UI.system;
if (themeToggleIcon) {
themeToggleIcon.textContent = details.icon;
}
if (themeToggleText) {
themeToggleText.textContent = details.text;
}
themeToggle.setAttribute('data-theme-mode', preference);
const label = `Switch theme (current: ${details.text})`;
themeToggle.setAttribute('aria-label', label);
themeToggle.title = label;
}
let currentPreference = readStoredPreference() || 'system';
function applyPreference(preference, persist) {
currentPreference = preference;
const effectiveTheme = getEffectiveTheme(preference);
applyTheme(effectiveTheme);
document.documentElement.setAttribute('data-theme-preference', preference);
updateToggle(preference);
if (persist) {
writeStoredPreference(preference);
}
}
applyPreference(currentPreference, true);
if (themeToggle) {
themeToggle.addEventListener('click', function() {
const index = THEME_ORDER.indexOf(currentPreference);
const nextIndex = index === -1 ? 0 : (index + 1) % THEME_ORDER.length;
const nextPreference = THEME_ORDER[nextIndex];
applyPreference(nextPreference, true);
});
}
const systemMatcher = window.matchMedia ? window.matchMedia('(prefers-color-scheme: dark)') : null;
if (systemMatcher) {
const handleSystemChange = function() {
if (currentPreference === 'system') {
applyPreference('system', false);
}
};
if (typeof systemMatcher.addEventListener === 'function') {
systemMatcher.addEventListener('change', handleSystemChange);
} else if (typeof systemMatcher.addListener === 'function') {
systemMatcher.addListener(handleSystemChange);
}
}
// --- Copy-to-Clipboard Button ---
const allPres = document.querySelectorAll('pre');
allPres.forEach(function(pre) {
let timeout = null;
const copyButton = document.createElement('button');
copyButton.className =
'absolute top-2 right-2 p-2 rounded-md bg-gray-200 dark:bg-gray-700 text-gray-600 dark:text-gray-300 opacity-0 group-hover:opacity-100 transition-opacity';
copyButton.innerHTML =
'';
copyButton.setAttribute('aria-label', 'Copy to clipboard');
pre.classList.add('group', 'relative'); // Add group for hover effect
pre.appendChild(copyButton);
copyButton.onclick = function() {
// Exclude the button's own text from being copied
const code = pre.querySelector('code').innerText;
navigator.clipboard.writeText(code);
copyButton.innerHTML = '';
clearTimeout(timeout);
timeout = setTimeout(function() {
copyButton.innerHTML =
'';
}, 2000);
};
});
// --- LEGACY URL Redirect ---
const match = /#\/(.+)\\.md(.*)/g.exec(window.location.hash);
if (match && match[1]) {
const pageName = match[1].toLowerCase();
const sectionName = match[2];
window.location.href = '/' + pageName + sectionName;
}
// --- Mobile Menu Toggle ---
const mobileMenuToggle = document.getElementById('mobile-menu-toggle');
const sidebar = document.getElementById('sidebar');
const mobileOverlay = document.getElementById('mobile-overlay');
const body = document.body;
function openMobileMenu() {
sidebar.classList.add('mobile-open');
mobileOverlay.classList.add('active');
body.classList.add('mobile-menu-open');
mobileMenuToggle.setAttribute('aria-expanded', 'true');
}
function closeMobileMenu() {
sidebar.classList.remove('mobile-open');
mobileOverlay.classList.remove('active');
body.classList.remove('mobile-menu-open');
mobileMenuToggle.setAttribute('aria-expanded', 'false');
}
if (mobileMenuToggle) {
mobileMenuToggle.addEventListener('click', function() {
const isOpen = sidebar.classList.contains('mobile-open');
if (isOpen) {
closeMobileMenu();
} else {
openMobileMenu();
}
});
}
if (mobileOverlay) {
mobileOverlay.addEventListener('click', closeMobileMenu);
}
// Close mobile menu when clicking a navigation link
if (sidebar) {
const sidebarLinks = sidebar.querySelectorAll('a');
sidebarLinks.forEach(function(link) {
link.addEventListener('click', function() {
// Only close on mobile/tablet (up to 1024px)
if (window.innerWidth <= 1024) {
closeMobileMenu();
}
});
});
}
// Close mobile menu on window resize to desktop size
window.addEventListener('resize', function() {
if (window.innerWidth > 1024) {
closeMobileMenu();
}
});
});
================================================
FILE: esbuild.config.js
================================================
import * as esbuild from 'esbuild';
import { umdWrapper } from 'esbuild-plugin-umd-wrapper';
import fs from 'fs';
const version = process.env.SEMANTIC_RELEASE_NEXT_VERSION || JSON.parse(fs.readFileSync('./package.json')).version;
console.log('building version:', version);
const banner = `/**
* marked v${version} - a markdown parser
* Copyright (c) 2018-${new Date().getFullYear()}, MarkedJS. (MIT License)
* Copyright (c) 2011-2018, Christopher Jeffrey. (MIT License)
* https://github.com/markedjs/marked
*/
/**
* DO NOT EDIT THIS FILE
* The code in this file is generated from files in ./src/
*/
`;
function config(options) {
return {
entryPoints: ['src/marked.ts'],
banner: {
js: banner,
},
sourcemap: true,
bundle: true,
minify: true,
...(options.format === 'umd'
? {
plugins: [umdWrapper({
libraryName: 'marked',
})],
}
: {}),
...options,
};
}
await esbuild.build(config({
format: 'esm',
outfile: 'lib/marked.esm.js',
}));
await esbuild.build(config({
format: 'umd',
outfile: 'lib/marked.umd.js',
}));
================================================
FILE: eslint.config.js
================================================
import markedEslintConfig from '@markedjs/eslint-config';
export default [
{
ignores: ['**/lib', '**/public', 'test.js', 'vuln.js'],
},
...markedEslintConfig,
];
================================================
FILE: man/marked.1.md
================================================
# marked(1) -- a javascript markdown parser
## SYNOPSIS
`marked` [`-o`