├── .eslintignore
├── .github
├── dependabot.yml
└── workflows
│ ├── on-dependabot.yml
│ ├── on-push.yml
│ └── on-release.yml
├── .gitignore
├── .npmignore
├── .prettierignore
├── .yarn
├── plugins
│ └── @yarnpkg
│ │ └── plugin-interactive-tools.cjs
└── releases
│ └── yarn-2.3.3.cjs
├── .yarnrc.yml
├── CHANGELOG.md
├── README.md
├── media
└── cover.png
├── package.json
├── src
├── highlight.js
└── index.js
├── test
├── fixtures
│ ├── all.md
│ ├── autolinker.md
│ ├── command-line.md
│ ├── data-uri-highlight.md
│ ├── diff-highlight.md
│ ├── inline-color.md
│ ├── keep-markup.md
│ ├── languages.md
│ ├── legend.md
│ ├── line-highlight.md
│ ├── line-numbers.md
│ ├── no-lang.md
│ ├── show-invisibles.md
│ └── treeview.md
├── index.js
├── outputs
│ ├── all.hast.html
│ ├── all.hast.png
│ ├── all.jsx.html
│ ├── all.jsx.png
│ ├── all.mdast.html
│ ├── all.mdast.png
│ ├── autolinker.hast.html
│ ├── autolinker.hast.png
│ ├── autolinker.jsx.html
│ ├── autolinker.jsx.png
│ ├── autolinker.mdast.html
│ ├── autolinker.mdast.png
│ ├── command-line.hast.html
│ ├── command-line.hast.png
│ ├── command-line.jsx.html
│ ├── command-line.jsx.png
│ ├── command-line.mdast.html
│ ├── command-line.mdast.png
│ ├── data-uri-highlight.hast.html
│ ├── data-uri-highlight.hast.png
│ ├── data-uri-highlight.jsx.html
│ ├── data-uri-highlight.jsx.png
│ ├── data-uri-highlight.mdast.html
│ ├── data-uri-highlight.mdast.png
│ ├── diff-highlight.hast.html
│ ├── diff-highlight.hast.png
│ ├── diff-highlight.jsx.html
│ ├── diff-highlight.jsx.png
│ ├── diff-highlight.mdast.html
│ ├── diff-highlight.mdast.png
│ ├── inline-color.hast.html
│ ├── inline-color.hast.png
│ ├── inline-color.jsx.html
│ ├── inline-color.jsx.png
│ ├── inline-color.mdast.html
│ ├── inline-color.mdast.png
│ ├── keep-markup.hast.html
│ ├── keep-markup.hast.png
│ ├── keep-markup.jsx.html
│ ├── keep-markup.jsx.png
│ ├── keep-markup.mdast.html
│ ├── keep-markup.mdast.png
│ ├── languages.hast.html
│ ├── languages.hast.png
│ ├── languages.jsx.html
│ ├── languages.jsx.png
│ ├── languages.mdast.html
│ ├── languages.mdast.png
│ ├── legend.hast.html
│ ├── legend.hast.png
│ ├── legend.jsx.html
│ ├── legend.jsx.png
│ ├── legend.mdast.html
│ ├── legend.mdast.png
│ ├── line-highlight.hast.html
│ ├── line-highlight.hast.png
│ ├── line-highlight.jsx.html
│ ├── line-highlight.jsx.png
│ ├── line-highlight.mdast.html
│ ├── line-highlight.mdast.png
│ ├── line-numbers.hast.html
│ ├── line-numbers.hast.png
│ ├── line-numbers.jsx.html
│ ├── line-numbers.jsx.png
│ ├── line-numbers.mdast.html
│ ├── line-numbers.mdast.png
│ ├── no-lang.hast.html
│ ├── no-lang.hast.png
│ ├── no-lang.jsx.html
│ ├── no-lang.jsx.png
│ ├── no-lang.mdast.html
│ ├── no-lang.mdast.png
│ ├── show-invisibles.hast.html
│ ├── show-invisibles.hast.png
│ ├── show-invisibles.jsx.html
│ ├── show-invisibles.jsx.png
│ ├── show-invisibles.mdast.html
│ ├── show-invisibles.mdast.png
│ ├── theme.css
│ ├── treeview.hast.html
│ ├── treeview.hast.png
│ ├── treeview.jsx.html
│ ├── treeview.jsx.png
│ ├── treeview.mdast.html
│ └── treeview.mdast.png
└── snapshots
│ ├── index.js.md
│ └── index.js.snap
└── yarn.lock
/.eslintignore:
--------------------------------------------------------------------------------
1 | dist
2 | build
3 | .build
4 | logfile
5 | .nyc_output
6 | coverage
7 | node_modules
8 |
9 | .git/*
10 | .DS_Store
11 | .npmrc
12 | .yarnclean
13 | .eslintignore
14 | .prettierignore
15 | .upignore
16 | .npmignore
17 | .gitignore
18 | .dockerignore
19 | .yarnrc
20 | .haxt
21 | .flowconfig
22 | .firebaserc
23 | .graphqlconfig
24 | .editorconfig
25 | .next
26 | _next
27 |
28 | license
29 | yarn.lock
30 | Dockerfile.*
31 | Dockerfile
32 |
33 | _env*ac
34 | .env.*
35 | *.env
36 | *.ico
37 | *.html
38 | *.xml
39 | *.log
40 | *.svg
41 | *.map
42 | *.png
43 | *.snap
44 | *.txt
45 | *.sketch
46 | *.ttf
47 | *.eot
48 | *.ttf
49 | *.woff
50 | *.woff2
51 | *.out
52 | *.dms
53 | *.sh
54 | *.tar.gz
55 | *.pem
56 | *.jpg
57 | *.gif
58 | *.graphcool
59 | *.re
60 | *.wasm
61 | *.yml
62 | *.toml
63 | *.jar
64 | *.zip
--------------------------------------------------------------------------------
/.github/dependabot.yml:
--------------------------------------------------------------------------------
1 | # https://help.github.com/github/administering-a-repository/configuration-options-for-dependency-updates
2 | version: 2
3 | updates:
4 | - package-ecosystem: "github-actions"
5 | directory: "/"
6 | schedule:
7 | interval: "daily"
8 |
9 | - package-ecosystem: 'npm'
10 | directory: '/'
11 | schedule:
12 | interval: 'daily'
13 | commit-message:
14 | prefix: 'chore'
15 | include: 'scope'
16 | versioning-strategy: increase-if-necessary
17 |
--------------------------------------------------------------------------------
/.github/workflows/on-dependabot.yml:
--------------------------------------------------------------------------------
1 | name: Continuous Updates
2 |
3 | on:
4 | push:
5 | branches: [ dependabot/npm_and_yarn/** ]
6 | pull_request:
7 | types: [opened, synchronize, reopened]
8 | branches: [ dependabot/npm_and_yarn/** ]
9 |
10 | jobs:
11 | update-manifests:
12 | runs-on: ubuntu-latest
13 | steps:
14 | - uses: technote-space/auto-cancel-redundant-job@v1
15 | - uses: actions/checkout@v2
16 | with:
17 | fetch-depth: 20
18 | persist-credentials: false
19 | - name: Setup Node.js
20 | uses: actions/setup-node@v2.1.5
21 | with:
22 | node-version: '14.x'
23 | - name: Config Git
24 | run: |
25 | git config --global user.name '${{ github.event.commits[0].author.name }}'
26 | git config --global user.email '${{ github.event.commits[0].author.email }}'
27 | - name: Fix yarn.lock
28 | run: |
29 | # get current branch
30 | echo ::set-env name=GITHUB_REF_SLUG::"$(git branch --show-current)"
31 | # revert changes to yarn.lock
32 | git checkout ${{ github.sha }}^ -- yarn.lock
33 | # IF only yarn.lock changed, update package.json too
34 | git diff --name-only HEAD^ HEAD | grep -q 'package.json' || yarn up `git log -1 --pretty=%s | awk '{ print $3 }'`
35 | # regardless, run yarn to update yarn.lock
36 | yarn
37 | # stage package.json and yarn.lock
38 | git add yarn.lock package.json
39 | # commit changes
40 | git commit --amend --no-edit --allow-empty -n
41 | env:
42 | YARN_CHECKSUM_BEHAVIOR: update
43 | YARN_ENABLE_SCRIPTS: 0
44 | - name: Test
45 | run: yarn run test
46 | - name: Push changes
47 | uses: ad-m/github-push-action@v0.6.0
48 | with:
49 | github_token: ${{ secrets.GITHUB_TOKEN }}
50 | branch: ${{ env.GITHUB_REF_SLUG }}
51 | force: true
52 |
--------------------------------------------------------------------------------
/.github/workflows/on-push.yml:
--------------------------------------------------------------------------------
1 | name: Continuous Integration
2 |
3 | on: push
4 |
5 | jobs:
6 | setup:
7 | runs-on: ubuntu-latest
8 | steps:
9 | - uses: technote-space/auto-cancel-redundant-job@v1
10 | - name: Checkout
11 | uses: actions/checkout@v2
12 | - name: Setup Node.js
13 | uses: actions/setup-node@v2.1.5
14 | with:
15 | node-version: '13.x'
16 | - name: Setup Cache
17 | uses: actions/cache@v2.1.5
18 | with:
19 | path: .yarn
20 | key: ${{ runner.os }}-node-modules-${{ hashFiles('yarn.lock') }}
21 | - name: Install dependencies
22 | run: yarn install --immutable
23 | env:
24 | YARN_CHECKSUM_BEHAVIOR: update
25 |
26 | ###############################################################################
27 | # COMMITLINT #
28 | ###############################################################################
29 | commitlint:
30 | needs: setup
31 | runs-on: ubuntu-latest
32 | steps:
33 | - name: Checkout
34 | uses: actions/checkout@v2
35 | with:
36 | fetch-depth: 0
37 | - name: Commit Lint
38 | uses: wagoid/commitlint-github-action@v3.1.0
39 | env:
40 | GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
41 |
42 | ###############################################################################
43 | # ESLINT #
44 | ###############################################################################
45 | eslint:
46 | needs: setup
47 | runs-on: ubuntu-latest
48 | steps:
49 | - name: Checkout
50 | uses: actions/checkout@v2
51 | - name: Setup Node.js
52 | uses: actions/setup-node@v2.1.5
53 | with:
54 | node-version: '13.x'
55 | - name: Setup Cache
56 | uses: actions/cache@v2.1.5
57 | with:
58 | path: .yarn
59 | key: ${{ runner.os }}-node-modules-${{ hashFiles('yarn.lock') }}
60 | - name: Install dependencies
61 | run: yarn install --immutable --immutable-cache
62 | - name: ESLint
63 | run: yarn run eslint
64 |
65 | ###############################################################################
66 | # TEST #
67 | ###############################################################################
68 | test:
69 | needs: setup
70 | runs-on: ubuntu-latest
71 | steps:
72 | - name: Checkout
73 | uses: actions/checkout@v2
74 | - name: Setup Node.js
75 | uses: actions/setup-node@v2.1.5
76 | with:
77 | node-version: '13.x'
78 | - name: Setup Cache
79 | uses: actions/cache@v2.1.5
80 | with:
81 | path: .yarn
82 | key: ${{ runner.os }}-node-modules-${{ hashFiles('yarn.lock') }}
83 | - name: Install dependencies
84 | run: yarn install --immutable --immutable-cache
85 | - name: Test
86 | run: yarn run test
87 |
88 | ###############################################################################
89 | # RELEASE #
90 | ###############################################################################
91 | release:
92 | needs: [test, eslint, commitlint]
93 | runs-on: ubuntu-latest
94 | steps:
95 | - name: Checkout
96 | uses: actions/checkout@v2
97 | - name: Get branch
98 | uses: rlespinasse/github-slug-action@3.5.1
99 | - name: Release
100 | uses: ridedott/release-me-action@v3.5.20
101 | if: ${{ env.GITHUB_REF_SLUG == 'master' }}
102 | with:
103 | node-module: true
104 | release-rules: |
105 | [{"scope":"deps-dev","release":false},{"scope":"no-release","release":false},{"release":"patch","type":"build"},{"release":"patch","type":"chore"},{"release":"patch","type":"ci"},{"release":"patch","type":"docs"},{"release":"patch","type":"improvement"},{"release":"patch","type":"refactor"},{"release":"minor","type":"feat"}]
106 | env:
107 | GITHUB_TOKEN: ${{ secrets.RELEASE_GITHUB_TOKEN }}
108 |
--------------------------------------------------------------------------------
/.github/workflows/on-release.yml:
--------------------------------------------------------------------------------
1 | name: Continuous Delivery
2 |
3 | on:
4 | release:
5 | types: [published]
6 |
7 | jobs:
8 | publish:
9 | runs-on: ubuntu-latest
10 | steps:
11 | - name: Checkout
12 | uses: actions/checkout@v2
13 | - name: Setup Node.js
14 | uses: actions/setup-node@v2.1.5
15 | with:
16 | node-version: '13.x'
17 | registry-url: https://registry.npmjs.com/
18 | scope: '@sergioramos'
19 | - name: Install dependencies
20 | run: yarn install --immutable
21 | env:
22 | YARN_CHECKSUM_BEHAVIOR: update
23 | - name: Publish
24 | run: npm publish
25 | env:
26 | NODE_AUTH_TOKEN: ${{ secrets.NODE_AUTH_TOKEN }}
27 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | ### Testing ###
2 | /coverage
3 |
4 | ### Production ###
5 | /build
6 | /dist
7 | /.next
8 |
9 | ### Misc ###
10 | .env
11 |
12 | ### Yarn ###
13 | yarn-debug.log*
14 | yarn-error.log*
15 |
16 | ### Bower ###
17 | bower_components
18 | .bower-cache
19 | .bower-registry
20 | .bower-tmp
21 |
22 | ### Git ###
23 | *.orig
24 |
25 | ### macOS ###
26 | *.DS_Store
27 | .AppleDouble
28 | .LSOverride
29 |
30 | # Thumbnails
31 | ._*
32 | # Files that might appear in the root of a volume
33 | .DocumentRevisions-V100
34 | .fseventsd
35 | .Spotlight-V100
36 | .TemporaryItems
37 | .Trashes
38 | .VolumeIcon.icns
39 | .com.apple.timemachine.donotpresent
40 | # Directories potentially created on remote AFP share
41 | .AppleDB
42 | .AppleDesktop
43 | Network Trash Folder
44 | Temporary Items
45 | .apdisk
46 |
47 |
48 | ### Node ###
49 | # Logs
50 | logs
51 | *.log
52 | npm-debug.log*
53 | *.out
54 |
55 | # Runtime data
56 | pids
57 | *.pid
58 | *.seed
59 | *.pid.lock
60 |
61 | # Directory for instrumented libs generated by jscoverage/JSCover
62 | lib-cov
63 |
64 | # Coverage directory used by tools like istanbul
65 | coverage
66 | coverage.html
67 |
68 | # nyc test coverage
69 | .nyc_output
70 |
71 | # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
72 | .grunt
73 |
74 | # node-waf configuration
75 | .lock-wscript
76 |
77 | # Compiled binary addons (http://nodejs.org/api/addons.html)
78 | build/Release
79 |
80 | # Dependency directories
81 | node_modules
82 | jspm_packages
83 | package-lock.json
84 |
85 | # Optional npm cache directory
86 | .npm
87 |
88 | # Optional eslint cache
89 | .eslintcache
90 |
91 | # Optional REPL history
92 | .node_repl_history
93 |
94 | # Output of 'npm pack'
95 | *.tgz
96 |
97 |
98 | ### SublimeText ###
99 | # cache files for sublime text
100 | *.tmlanguage.cache
101 | *.tmPreferences.cache
102 | *.stTheme.cache
103 |
104 | # workspace files are user-specific
105 | *.sublime-workspace
106 |
107 | # project files should be checked into the repository, unless a significant
108 | # proportion of contributors will probably not be using SublimeText
109 | # *.sublime-project
110 |
111 | # sftp configuration file
112 | sftp-config.json
113 |
114 | # Package control specific files
115 | Package Control.last-run
116 | Package Control.ca-list
117 | Package Control.ca-bundle
118 | Package Control.system-ca-bundle
119 | Package Control.cache/
120 | Package Control.ca-certs/
121 | bh_unicode_properties.cache
122 |
123 | # Sublime-github package stores a github token in this file
124 | # https://packagecontrol.io/packages/sublime-github
125 | GitHub.sublime-settings
126 |
127 |
128 | ### Vim ###
129 | # swap
130 | [._]*.s[a-w][a-z]
131 | [._]s[a-w][a-z]
132 | # session
133 | Session.vim
134 | # temporary
135 | .netrwhist
136 | *~
137 | # auto-generated tag files
138 | tags
139 |
140 |
141 | ### Windows ###
142 | # Windows image file caches
143 | Thumbs.db
144 | ehthumbs.db
145 |
146 | # Folder config file
147 | Desktop.ini
148 |
149 | # Recycle Bin used on file shares
150 | $RECYCLE.BIN/
151 |
152 | # Windows Installer files
153 | *.cab
154 | *.msi
155 | *.msm
156 | *.msp
157 |
158 | # Windows shortcuts
159 | *.lnk
160 |
161 | ### Application Specific ###
162 | .lighthouseci
163 | .yarn/cache
164 | .yarn/install-state.gz
165 | .yarn/build-state.yml
166 | .yarn/unplugged
167 | .npmrc
168 | .husky
169 |
--------------------------------------------------------------------------------
/.npmignore:
--------------------------------------------------------------------------------
1 | .eslintignore
2 | .github
3 | .prettierignore
4 | .yarn
5 | .yarnrc.yml
6 | media
7 | test
8 |
--------------------------------------------------------------------------------
/.prettierignore:
--------------------------------------------------------------------------------
1 | dist
2 | build
3 | .build
4 | logfile
5 | .nyc_output
6 | coverage
7 | .yarn/*
8 | src/prism/load-languages.js
9 |
10 | .git/*
11 | .DS_Store
12 | .npmrc
13 | .nvmrc
14 | .yarnclean
15 | .eslintignore
16 | .prettierignore
17 | .upignore
18 | .npmignore
19 | .gitignore
20 | .dockerignore
21 | .yarnrc
22 | .haxt
23 | .flowconfig
24 | .firebaserc
25 | .graphqlconfig
26 | .editorconfig
27 | .next
28 | _next
29 | .serverless
30 | .lighthouserc
31 | .gitkeep
32 |
33 | license
34 | yarn.lock
35 | Dockerfile.*
36 | Dockerfile
37 |
38 | _env*ac
39 | .env.*
40 | *.env
41 | *.ico
42 | *.html
43 | *.xml
44 | *.log
45 | *.svg
46 | *.map
47 | *.png
48 | *.snap
49 | *.txt
50 | *.sketch
51 | *.ttf
52 | *.eot
53 | *.ttf
54 | *.woff
55 | *.woff2
56 | *.out
57 | *.dms
58 | *.sh
59 | *.tar.gz
60 | *.pem
61 | *.jpg
62 | *.gif
63 | *.graphcool
64 | *.re
65 | *.wasm
66 | *.yml
67 | *.toml
68 | *.jar
69 | *.zip
70 | *.prisma
71 | *.lock
72 | *.diff
73 | *.hbs
74 | *.pro
--------------------------------------------------------------------------------
/.yarnrc.yml:
--------------------------------------------------------------------------------
1 | nodeLinker: node-modules
2 |
3 | plugins:
4 | - path: .yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs
5 | spec: "@yarnpkg/plugin-interactive-tools"
6 |
7 | yarnPath: .yarn/releases/yarn-2.3.3.cjs
8 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # remark-prism
2 |
3 | Syntax highlighter for markdown code blocks using [Prism](https://prismjs.com/) - with support for certain [plugins](https://prismjs.com/plugins/). This allows syntax highlighting without running any client-side code - other than CSS.
4 |
5 |
6 |
7 |
...
133 | ```
134 |
135 | ## license
136 |
137 | BSD-3-Clause
138 |
--------------------------------------------------------------------------------
/media/cover.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/sergioramos/remark-prism/49f1f86d50f376c647214c02cf972ce05b0fc756/media/cover.png
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "remark-prism",
3 | "version": "1.3.6",
4 | "description": "Syntax highlighter for markdown code blocks - with support for plugins",
5 | "license": "BSD-3-Clause",
6 | "repository": "sergioramos/remark-prism",
7 | "main": "src/index.js",
8 | "keywords": [
9 | "prismjs",
10 | "markdown",
11 | "remark",
12 | "remarkjs",
13 | "remark-plugin"
14 | ],
15 | "publishConfig": {
16 | "registry": "https://registry.npmjs.com",
17 | "access": "public"
18 | },
19 | "scripts": {
20 | "eslint": "eslint . --ext .js",
21 | "fmt": "prettier --config package.json --write '**/*'",
22 | "test": "NODE_ENV=test ava --serial"
23 | },
24 | "dependencies": {
25 | "classnames": "^2.3.1",
26 | "css-selector-parser": "^1.4.1",
27 | "escape-html": "^1.0.3",
28 | "jsdom": "^16.5.3",
29 | "parse-numeric-range": "^1.2.0",
30 | "parse5": "^6.0.1",
31 | "parse5-htmlparser2-tree-adapter": "^6.0.1",
32 | "prismjs": "^1.23.0",
33 | "unist-util-map": "^2.0.1"
34 | },
35 | "devDependencies": {
36 | "@babel/core": "^7.13.15",
37 | "@babel/preset-react": "^7.13.13",
38 | "@commitlint/cli": "^12.1.1",
39 | "@commitlint/config-conventional": "^12.1.1",
40 | "@mdx-js/mdx": "^2.0.0-next.9",
41 | "@mdx-js/react": "^2.0.0-next.9",
42 | "@rollup/plugin-virtual": "^2.0.3",
43 | "apr-for-each": "^3.0.3",
44 | "apr-parallel": "^3.0.3",
45 | "ava": "^3.15.0",
46 | "eslint": "^7.24.0",
47 | "eslint-config-prettier": "^8.1.0",
48 | "eslint-config-xo-space": "^0.27.0",
49 | "husky": "^6.0.0",
50 | "lint-staged": "^10.5.4",
51 | "mz": "^2.7.0",
52 | "npm-run-all": "^4.1.5",
53 | "prettier": "^2.2.1",
54 | "puppeteer": "^8.0.0",
55 | "react": "^17.0.2",
56 | "react-dom": "^17.0.2",
57 | "rehype-format": "^3.1.0",
58 | "rehype-stringify": "^8.0.0",
59 | "remark-html": "^13.0.1",
60 | "remark-parse": "^9.0.0",
61 | "remark-rehype": "^8.1.0",
62 | "remark-stringify": "^9.0.1",
63 | "rollup": "^2.45.2",
64 | "rollup-plugin-babel": "^4.4.0",
65 | "serve": "^11.3.2",
66 | "to-vfile": "^6.1.0",
67 | "unified": "^9.2.1"
68 | },
69 | "resolutions": {
70 | "fsevents": "1.2.13"
71 | },
72 | "husky": {
73 | "hooks": {
74 | "pre-commit": "lint-staged",
75 | "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
76 | }
77 | },
78 | "lint-staged": {
79 | "*.js": [
80 | "eslint --fix",
81 | "prettier --config package.json --write",
82 | "git add"
83 | ],
84 | "*.*": [
85 | "prettier --config package.json --write",
86 | "git add"
87 | ]
88 | },
89 | "prettier": {
90 | "bracketSpacing": true,
91 | "jsxBracketSameLine": false,
92 | "printWidth": 80,
93 | "semi": true,
94 | "singleQuote": true,
95 | "tabWidth": 2,
96 | "trailingComma": "all",
97 | "useTabs": false
98 | },
99 | "eslintConfig": {
100 | "extends": [
101 | "eslint:recommended",
102 | "xo-space/esnext",
103 | "prettier"
104 | ],
105 | "rules": {
106 | "new-cap": 0,
107 | "camelcase": 0,
108 | "capitalized-comments": 0,
109 | "no-promise-executor-return": 0
110 | }
111 | },
112 | "commitlint": {
113 | "extends": [
114 | "@commitlint/config-conventional"
115 | ],
116 | "rules": {
117 | "body-max-line-length": [
118 | 0
119 | ]
120 | }
121 | }
122 | }
123 |
--------------------------------------------------------------------------------
/src/highlight.js:
--------------------------------------------------------------------------------
1 | const escapeHtml = require('escape-html');
2 | const { readFileSync } = require('fs');
3 | const { JSDOM } = require('jsdom');
4 | const parse5 = require('parse5');
5 | const htmlparser2Adapter = require('parse5-htmlparser2-tree-adapter');
6 | const { createContext, runInContext } = require('vm');
7 |
8 | const components = require('prismjs/components.json');
9 | const getLoader = require('prismjs/dependencies');
10 |
11 | const PLUGINS = [
12 | 'autolinker',
13 | 'command-line',
14 | 'data-uri-highlight',
15 | 'diff-highlight',
16 | 'inline-color',
17 | 'keep-markup',
18 | 'line-numbers',
19 | 'show-invisibles',
20 | 'treeview',
21 | ];
22 |
23 | const domHighlight = (value, attrs = {}, range = []) => {
24 | const MULTILINE_TOKEN_SPAN = /[^<]*\n[^<]*<\/span>/g;
25 |
26 | // eslint-disable-next-line no-undef
27 | const pre = window.document.createElement('pre');
28 | // eslint-disable-next-line no-undef
29 | const code = window.document.createElement('code');
30 |
31 | for (const [key, value] of Object.entries(attrs)) {
32 | pre.setAttribute(key, value);
33 | code.setAttribute(key, value);
34 | }
35 |
36 | code.textContent = value;
37 | pre.appendChild(code);
38 |
39 | // eslint-disable-next-line no-undef
40 | window.Prism.highlightElement(code);
41 |
42 | return code.innerHTML
43 | .replace(MULTILINE_TOKEN_SPAN, (match, token) => {
44 | return match.replace(/\n/g, ` \n`);
45 | })
46 | .split(/\n/)
47 | .reduce((memo, line, idx) => {
48 | return memo.concat(
49 | range.includes(idx + 1)
50 | ? ``
51 | : `${line}\n`,
52 | );
53 | }, '');
54 | };
55 |
56 | const loadLanguages = (parsingContext) => {
57 | const loadedLanguages = new Set();
58 |
59 | const languages = Object.keys(components.languages).filter(
60 | (l) => l !== 'meta',
61 | );
62 |
63 | const loaded = [
64 | ...loadedLanguages,
65 | ...Object.keys(parsingContext.Prism.languages),
66 | ];
67 |
68 | getLoader(components, languages, loaded).load((lang) => {
69 | if (!(lang in components.languages)) {
70 | console.warn('Language does not exist: ' + lang);
71 | return;
72 | }
73 |
74 | const filename = require.resolve(`prismjs/components/prism-${lang}`);
75 | runInContext(RUN(readFileSync(filename, 'utf-8')), parsingContext, {
76 | filename,
77 | });
78 |
79 | loadedLanguages.add(lang);
80 | });
81 |
82 | return Object.entries(components.languages).reduce(
83 | (memo, [name, { alias }]) => {
84 | return memo.concat(name).concat(alias).filter(Boolean);
85 | },
86 | [],
87 | );
88 | };
89 |
90 | const RUN = (src) => {
91 | return `
92 | window.Prism = Prism;
93 |
94 | try {
95 | const self = window;
96 | ${src};
97 | } catch(err) {
98 | console.error(err);
99 | };
100 | `;
101 | };
102 |
103 | const deserialize = (html) => {
104 | const document = parse5.parse(html, {
105 | treeAdapter: htmlparser2Adapter,
106 | });
107 |
108 | const toHast = ({ type, name, attribs = {}, data: value, children = [] }) => {
109 | const { class: className = '', ...attrs } = attribs;
110 |
111 | const _children = children.map(toHast);
112 | const properties = {
113 | ...attrs,
114 | className: className.split(/\s/).filter(Boolean),
115 | };
116 |
117 | return {
118 | type: type === 'tag' ? 'element' : 'text',
119 | value,
120 | tagName: name,
121 | data: {
122 | hName: name,
123 | hProperties: properties,
124 | hChildren: _children,
125 | },
126 | properties,
127 | children: _children,
128 | };
129 | };
130 |
131 | return document.children
132 | .pop()
133 | .children.find(({ name }) => name === 'body')
134 | .children.map(toHast);
135 | };
136 |
137 | module.exports = ({ plugins = [] }) => {
138 | const { window } = new JSDOM('');
139 | const parsingContext = createContext(window);
140 |
141 | const prismjs = require.resolve('prismjs');
142 | runInContext(RUN(readFileSync(prismjs, 'utf-8')), parsingContext, {
143 | filename: prismjs,
144 | });
145 |
146 | // load languages into the Prism object
147 | const languages = loadLanguages(parsingContext);
148 | const highlightElement = runInContext(
149 | domHighlight.toString(),
150 | parsingContext,
151 | );
152 |
153 | // load plugins into the Prism object
154 | plugins.forEach((pl) => {
155 | const plugin = PLUGINS.includes(pl)
156 | ? `prismjs/plugins/${pl}/prism-${pl}`
157 | : pl;
158 |
159 | const filename = require.resolve(plugin);
160 | return runInContext(RUN(readFileSync(filename, 'utf-8')), parsingContext, {
161 | filename,
162 | });
163 | });
164 |
165 | return ({ lang, value, attrs, range = [] }) => {
166 | const fallback = () => {
167 | return [
168 | {
169 | type: 'text',
170 | value: escapeHtml(value),
171 | },
172 | ];
173 | };
174 |
175 | if (!lang) {
176 | fallback();
177 | }
178 |
179 | if (
180 | !languages.includes(lang.replace(/^diff-/, '')) &&
181 | lang !== 'treeview'
182 | ) {
183 | return fallback();
184 | }
185 |
186 | return deserialize(highlightElement(value, attrs, range));
187 | };
188 | };
189 |
190 | module.exports.PLUGINS = PLUGINS;
191 |
--------------------------------------------------------------------------------
/src/index.js:
--------------------------------------------------------------------------------
1 | const classNames = require('classnames');
2 | const { CssSelectorParser } = require('css-selector-parser');
3 | const map = require('unist-util-map');
4 | const rangeParser = require('parse-numeric-range');
5 | const createHighlighter = require('./highlight');
6 |
7 | const h = (type, attrs = {}, children = []) => {
8 | return {
9 | type: 'element',
10 | tagName: type,
11 | data: {
12 | hName: type,
13 | hProperties: attrs,
14 | hChildren: children,
15 | },
16 | properties: attrs,
17 | children,
18 | };
19 | };
20 |
21 | const selectorToAttrs = (selector) => {
22 | const parser = new CssSelectorParser();
23 | const { rule } = parser.parse(selector);
24 | const { attrs = [] } = rule;
25 |
26 | return attrs.reduce((memo, { name, operator, value }) => {
27 | if (operator !== '=') {
28 | return memo;
29 | }
30 |
31 | const isClass = name === 'class';
32 | const newValue = isClass
33 | ? [memo[name] || ''].concat(value).join(' ')
34 | : value;
35 |
36 | return Object.assign(memo, {
37 | [name]: newValue,
38 | });
39 | }, {});
40 | };
41 |
42 | const parseLang = (str) => {
43 | const match = (regexp) => {
44 | const m = (str || '').match(regexp);
45 | return Array.isArray(m) ? m.filter(Boolean) : [];
46 | };
47 |
48 | const [lang = 'unknown'] = match(/^[a-zA-Z\d-]*/g);
49 | const selectors = match(/\[(.*?)\]/g).join('');
50 |
51 | const attrs = selectors.length ? selectorToAttrs(selectors) : {};
52 | const className = classNames(`language-${lang}`, attrs.class);
53 | const { legend = '', ...restAttrs } = attrs;
54 |
55 | const range = rangeParser(
56 | match(/\{(.*?)\}$/g)
57 | .join(',')
58 | .replace(/^\{/, '')
59 | .replace(/\}$/, ''),
60 | );
61 |
62 | return {
63 | lang,
64 | legend,
65 | range,
66 | attrs: {
67 | ...restAttrs,
68 | class: className,
69 | },
70 | };
71 | };
72 |
73 | module.exports = (options = {}) => (tree) => {
74 | const highlight = createHighlighter(options);
75 | const { transformInlineCode = false } = options;
76 |
77 | return map(tree, (node) => {
78 | const { type, tagName } = node;
79 |
80 | if (
81 | !['code', 'inlineCode'].includes(type) &&
82 | !['code', 'inlineCode'].includes(tagName)
83 | ) {
84 | return node;
85 | }
86 |
87 | if (
88 | (type === 'inlineCode' && !transformInlineCode) ||
89 | (type === 'tagName' && !transformInlineCode)
90 | ) {
91 | return node;
92 | }
93 |
94 | const { value, properties = {}, children = [] } = node;
95 | const { className: classNameArr = [] } = properties;
96 | const langClassName = classNameArr
97 | .map((lang) => lang.replace(/language-/, ''))
98 | .join(' ');
99 |
100 | const langToken = node.lang || langClassName;
101 | const { lang = 'unknown', attrs, legend, range } = parseLang(langToken);
102 | const { class: className = '', ...restAttrs } = attrs;
103 |
104 | const code = h(
105 | 'code',
106 | { className: `language-${lang}` },
107 | highlight({
108 | lang,
109 | value:
110 | value ||
111 | children
112 | .filter(({ type }) => type === 'text')
113 | .map(({ value }) => value)
114 | .pop(),
115 | attrs,
116 | range,
117 | }),
118 | );
119 |
120 | const pre = h(
121 | 'div',
122 | { className: `remark-highlight` },
123 | [
124 | h(
125 | 'pre',
126 | {
127 | ...restAttrs,
128 | className: className.split(/\s/),
129 | },
130 | [code],
131 | ),
132 | legend ? h('legend', {}, [{ type: 'text', value: legend }]) : null,
133 | ].filter(Boolean),
134 | );
135 |
136 | return /^inline/.test(type) ? code : pre;
137 | });
138 | };
139 |
--------------------------------------------------------------------------------
/test/fixtures/all.md:
--------------------------------------------------------------------------------
1 | # hello from `remark-prism`
2 |
3 | welcome all.
4 |
5 | ```markdown
6 | [Text you want to see](http://url-goes-here.com)
7 | ```
8 |
9 | ```bash[data-user="chris"][data-host="remotehost"][data-output="2,4-8"]
10 | pwd
11 | /usr/home/chris/bin
12 | ls -la
13 | total 2
14 | drwxr-xr-x 2 chris chris 11 Jan 10 16:48 .
15 | drwxr--r-x 45 chris chris 92 Feb 14 11:10 ..
16 | -rwxr-xr-x 1 chris chris 444 Aug 25 2013 backup
17 | -rwxr-xr-x 1 chris chris 642 Jan 17 14:42 deploy
18 | ```
19 |
20 | ```css
21 | div {
22 | border: 40px solid transparent;
23 | border-image: 33.334%
24 | padding: 1em;
25 | max-width: 20em;
26 | font: 130%/1.6 Baskerville, Palatino, serif;
27 | border-image: 33.334% url('data:image/svg+xml;utf8,Hello World!
59 |
60 |
61 | Hello World!
62 |
63 |
64 | ```
65 |
66 | ```tsx{13-19}
67 | export default () => {
68 | // register current used theme
69 | const [theme, setTheme] = React.useState(themes.light);
70 |
71 | // handle the radio changes
72 | const handleChange = ({ target }) => {
73 | // based on the radio value, toggle to the correct theme
74 | return setTheme(themes[target.value]);
75 | };
76 |
77 | return (
78 |
79 | I am styled by theme context!
80 |
87 |
88 | );
89 | };
90 | ```
91 |
92 | ```html[class="line-numbers"]{1,3-4,8}
93 |
94 |
95 |
96 | Hello World!
99 |
100 |
101 | Hello World!
102 |
103 |
104 | ```
105 |
106 | ```
107 | hello
108 | world
109 | ```
110 |
111 | ```treeview
112 | .
113 | ├── .eslintignore
114 | ├── .eslintrc
115 | ├── .gitignore
116 | ├── .prettierignore
117 | ├── .prettierrc
118 | ├── .yarnrc.yml
119 | ├── README.md
120 | ├── index.js
121 | ├── package.json
122 | ├── test/
123 | │ ├── fixtures/
124 | │ └── index.js
125 | └── yarn.lock
126 |
127 | 7 directories, 41 files
128 | ```
129 |
--------------------------------------------------------------------------------
/test/fixtures/autolinker.md:
--------------------------------------------------------------------------------
1 | ```js
2 | /**
3 | * Prism: Lightweight, robust, elegant syntax highlighting
4 | * MIT license http://www.opensource.org/licenses/mit-license.php/
5 | * @author Lea Verou http://lea.verou.me
6 | * Reach Lea at fake@email.com (no, not really)
7 | * And this is a Markdown link. Sweet, huh?
8 | */
9 | var foo = 5;
10 | // And a single line comment http://google.com
11 | ```
12 |
13 | ```css
14 | @font-face {
15 | src: url(http://lea.verou.me/logo.otf);
16 | font-family: 'LeaVerou';
17 | }
18 | ```
19 |
20 | ```html
21 |
23 | Autolinking in raw text: http://prismjs.com
25 | ```
26 |
27 | ```markdown
28 | [Text you want to see](http://url-goes-here.com)
29 | ```
30 |
--------------------------------------------------------------------------------
/test/fixtures/command-line.md:
--------------------------------------------------------------------------------
1 | ```bash[data-user="chris"][data-host="remotehost"][data-output="2,4-8"]
2 | pwd
3 | /usr/home/chris/bin
4 | ls -la
5 | total 2
6 | drwxr-xr-x 2 chris chris 11 Jan 10 16:48 .
7 | drwxr--r-x 45 chris chris 92 Feb 14 11:10 ..
8 | -rwxr-xr-x 1 chris chris 444 Aug 25 2013 backup
9 | -rwxr-xr-x 1 chris chris 642 Jan 17 14:42 deploy
10 | ```
11 |
--------------------------------------------------------------------------------
/test/fixtures/data-uri-highlight.md:
--------------------------------------------------------------------------------
1 | ```css
2 | div {
3 | border: 40px solid transparent;
4 | border-image: 33.334%
5 | padding: 1em;
6 | max-width: 20em;
7 | font: 130%/1.6 Baskerville, Palatino, serif;
8 | border-image: 33.334% url('data:image/svg+xml;utf8,Example
20 |
25 |
26 |
27 |
28 | ```
29 |
--------------------------------------------------------------------------------
/test/fixtures/keep-markup.md:
--------------------------------------------------------------------------------
1 | ```js
2 | xa y
3 | ```
4 |
--------------------------------------------------------------------------------
/test/fixtures/languages.md:
--------------------------------------------------------------------------------
1 | ```html
2 |
3 |
4 |
5 | Hello World!
8 |
9 |
10 | Hello World!
11 |
12 |
13 | ```
14 |
15 | ```xml
16 |
17 |
22 | Hello World
23 |
24 | Hello World
25 |
27 |
28 | ```
29 |
30 | ```css
31 | body::before {
32 | content: 'Hello World';
33 | }
34 | ```
35 |
36 | ```javascript
37 | console.log('Hello World');
38 | ```
39 |
40 | ```jsx
41 | class HelloMessage extends React.Component {
42 | render() {
43 | return Hello {this.props.name}
;
44 | }
45 | }
46 |
47 | ReactDOM.render(
48 |
140 |
141 | int main() {
142 | printf("Hello World\n");
143 | return 0;
144 | }
145 | ```
146 |
147 | ```csharp
148 | class HelloWorld {
149 | static void Main() {
150 | System.Console.WriteLine("Hello World");
151 | }
152 | }
153 | ```
154 |
155 | ```cpp
156 | #include
157 |
158 | using namespace std;
159 |
160 | int main()
161 | {
162 | cout << "Hello World\n";
163 | }
164 | ```
165 |
166 | ```cil
167 | // ilasm cil.il
168 | .assembly HelloWorld {}
169 | .method public static void Main() cil managed
170 | {
171 | .entrypoint
172 | .maxstack 1
173 | ldstr "Hello World"
174 | call void [mscorlib]System.Console::WriteLine(string)
175 | ret
176 | }
177 | ```
178 |
179 | ```coffeescript
180 | alert "Hello World"
181 | ```
182 |
183 | ```clojure
184 | (println "Hello World")
185 | ```
186 |
187 | ```crystal
188 | puts "Hello World"
189 | ```
190 |
191 | ```d
192 | // Hello World in D
193 | import std.stdio;
194 |
195 | void main()
196 | {
197 | writeln("Hello World");
198 | }
199 | ```
200 |
201 | ```dart
202 | main() {
203 | print('Hello World');
204 | }
205 | ```
206 |
207 | ```eiffel
208 | indexing "Hello World in Eiffel , from http://roesler-ac.de/wolfram/hello.htm#Eiffel"
209 |
210 | class HELLO
211 |
212 | creation
213 | run
214 |
215 | feature
216 |
217 | run is
218 | local
219 | io : BASIC_IO;
220 | do
221 | !!io;
222 | io.put_string("Hello World");
223 | io.put_newline
224 | end; -- run
225 | end; -- class HELLO
226 | ```
227 |
228 | ```elixir
229 | IO.puts "Defining the function world"
230 | ```
231 |
232 | ```elm
233 | import Html exposing (text)
234 |
235 | main =
236 | text "Hello World"
237 | ```
238 |
239 | ```erlang
240 | -module(erlang_hw).
241 | -export([start/0]).
242 |
243 | start() ->
244 | io:format("Hello World~n").
245 | ```
246 |
247 | ```fsharp
248 | printfn "Hello World"
249 | ```
250 |
251 | ```factor
252 | USING: io ;
253 | "Hello World" print
254 | ```
255 |
256 | ```fortran
257 | program helloworld
258 | print *,'Hello World'
259 | end program helloworld
260 | ```
261 |
262 | ```gdscript
263 | extends Label
264 |
265 | func _ready():
266 | self.text = "Hello World"
267 | ```
268 |
269 | ```gml
270 | draw_text(1, 1, "Hello World");
271 | ```
272 |
273 | ```go
274 | package main
275 |
276 | import "fmt"
277 |
278 | func main() {
279 | fmt.Println("Hello World")
280 | }
281 | ```
282 |
283 | ```graphql
284 | {
285 | "Hello World"
286 | }
287 | ```
288 |
289 | ```groovy
290 | println "Hello World"
291 | ```
292 |
293 | ```haml
294 | %html
295 | %title Hello World
296 | %body
297 | %h1 Hello World
298 | ```
299 |
300 | ```hs
301 | module Main where
302 |
303 | main = putStrLn "Hello World"
304 | ```
305 |
306 | ```haxe
307 | class HelloWorld {
308 | static function main() {
309 | trace("Hello World");
310 | }
311 | }
312 | ```
313 |
314 | ```icon
315 | procedure main()
316 | write("Hello World");
317 | end
318 | ```
319 |
320 | ```io
321 | "Hello World\n" print
322 | ```
323 |
324 | ```j
325 | #!/opt/local/bin/jc
326 | echo 'Hello World'
327 | exit ''
328 | ```
329 |
330 | ```java
331 | public class Java {
332 | public static void main(String[] args) {
333 | System.out.println("Hello World");
334 | }
335 | }
336 | ```
337 |
338 | ```json
339 | { "hello": "world" }
340 | ```
341 |
342 | ```julia
343 | println("Hello World")
344 | ```
345 |
346 | ```kotlin
347 | package hello
348 |
349 | fun main() {
350 | println("Hello World")
351 | }
352 | ```
353 |
354 | ```latex
355 | \documentclass{article}
356 | \begin{document}
357 | Hello World
358 | \end{document}
359 | ```
360 |
361 | ```less
362 | body::before {
363 | content: 'Hello World!';
364 | }
365 | ```
366 |
367 | ```lisp
368 | ; LISP
369 | (DEFUN hello ()
370 | (PRINT (LIST 'HELLO 'WORLD))
371 | )
372 |
373 | (hello)
374 | ```
375 |
376 | ```emacs-lisp
377 | ;;for emacs elisp
378 |
379 | (message "hello,world")
380 | ```
381 |
382 | ```livescript
383 | console.log "Hello World"
384 | ```
385 |
386 | ```llvm
387 | ; llvm-as llvm.ll
388 | ; x86 assembly: llc llvm.bc -o llvm.s -march x86
389 | ; interpreter: lli llvm.bc
390 |
391 | target datalayout = "e-p:32:32:32-i1:8:8-i8:8:8-i16:16:16-i32:32:32-i64:32:64-f32:32:32-f64:32:64-v64:64:64-v128:128:128-a0:0:64-f80:128:128"
392 | @.str = internal constant [12 x i8] c"Hello World\00"
393 |
394 | ; puts from libc
395 | declare i32 @puts(i8*)
396 |
397 | define i32 @main(...) {
398 | call i32 @puts(i8* getelementptr([12 x i8]* @.str, i32 0, i32 0))
399 | ret i32 0
400 | }
401 | ```
402 |
403 | ```lolcode
404 | HAI
405 | CAN HAS STDIO?
406 | VISIBLE "Hello World"
407 | KTHXBYE
408 | ```
409 |
410 | ```lua
411 | print("Hello World")
412 | ```
413 |
414 | ```markdown
415 | # Hello World
416 | ```
417 |
418 | ```matlab
419 | disp('Hello World')
420 | ```
421 |
422 | ```mel
423 | proc helloWorld () {
424 | print "Hello World\n";
425 | }
426 | helloWorld;
427 | ```
428 |
429 | ```moonscript
430 | print 'Hello World'
431 | ```
432 |
433 | ```nasm
434 | section .text
435 | global _start ;must be declared for linker (ld)
436 |
437 | _start: ;tell linker entry point
438 |
439 | xor ebx,ebx ;ebx=0
440 | mov ecx,msg ;address of message to write
441 | lea edx,[ebx+len] ;message length
442 | lea eax,[ebx+4] ;system call number (sys_write)
443 | inc ebx ;file descriptor (stdout)
444 | int 0x80 ;call kernel
445 |
446 | xor eax, eax ;set eax=0
447 | inc eax ;system call number (sys_exit)
448 | int 0x80 ;call kernel
449 |
450 | section .rodata
451 |
452 | msg db 'Hello, world!',0xa ;our string
453 | len equ $ - msg ;length of our string
454 | ```
455 |
456 | ```nim
457 | echo("Hello World")
458 | ```
459 |
460 | ```objectivec
461 | /*
462 | Build on OS X:
463 | clang -framework Foundation -fobjc-arc objc.m -o objc
464 |
465 | Build on Linux with GNUstep:
466 | clang `gnustep-config --objc-flags` `gnustep-config --base-libs` -fobjc-nonfragile-abi -fobjc-arc objc.m -o objc
467 | */
468 |
469 | #import
470 |
471 | int main(void)
472 | {
473 | NSLog(@"Hello World");
474 | }
475 | ```
476 |
477 | ```ocaml
478 | print_string "Hello World\n"
479 | ```
480 |
481 | ```oz
482 | {Show 'Hello World'}
483 | ```
484 |
485 | ```parser
486 | @main[]
487 | ^rem{Will print "Hello World" when run as CGI script}
488 | $hello[Hello World]
489 | $result[$hello]
490 | ```
491 |
492 | ```pascal
493 | program HelloWorld(output);
494 | begin
495 | writeln('Hello World');
496 | end.
497 | ```
498 |
499 | ```objectpascal
500 | program ObjectPascalExample;
501 |
502 | type
503 | THelloWorld = class
504 | procedure Put;
505 | end;
506 |
507 | procedure THelloWorld.Put;
508 | begin
509 | Writeln('Hello World');
510 | end;
511 |
512 | var
513 | HelloWorld: THelloWorld;
514 |
515 | begin
516 | HelloWorld := THelloWorld.Create;
517 | HelloWorld.Put;
518 | HelloWorld.Free;
519 | end.
520 | ```
521 |
522 | ```perl
523 | #!/usr/local/bin/perl -w
524 | use CGI; # load CGI routines
525 | $q = CGI->new; # create new CGI object
526 | print $q->header, # create the HTTP header
527 | $q->start_html('Hello World'), # start the HTML
528 | $q->h1('Hello World'), # level 1 header
529 | $q->end_html; # end the HTML
530 |
531 | # http://perldoc.perl.org/CGI.html
532 | ```
533 |
534 | ```php
535 |
3 |
4 |
5 | Hello World!
8 |
9 |
10 | Hello World!
11 |
12 |
13 | ```
14 |
--------------------------------------------------------------------------------
/test/fixtures/line-highlight.md:
--------------------------------------------------------------------------------
1 | ```html{2}
2 |
3 |
4 |
5 | Hello World!
8 |
9 |
10 | Hello World!
11 |
12 |
13 | ```
14 |
15 | ```html{1,3-4,8}
16 |
17 |
18 |
19 | Hello World!
22 |
23 |
24 | Hello World!
25 |
26 |
27 | ```
28 |
29 | ```tsx{13-19}
30 | export default () => {
31 | // register current used theme
32 | const [theme, setTheme] = React.useState(themes.light);
33 |
34 | // handle the radio changes
35 | const handleChange = ({ target }) => {
36 | // based on the radio value, toggle to the correct theme
37 | return setTheme(themes[target.value]);
38 | };
39 |
40 | return (
41 |
42 | I am styled by theme context!
43 |
50 |
51 | );
52 | };
53 | ```
54 |
--------------------------------------------------------------------------------
/test/fixtures/line-numbers.md:
--------------------------------------------------------------------------------
1 | ```html[class="line-numbers"]
2 |
3 |
4 |
5 | Hello World!
8 |
9 |
10 | Hello World!
11 |
12 |
13 | ```
14 |
15 | ```html[class="line-numbers"]{2}
16 |
17 |
18 |
19 | Hello World!
22 |
23 |
24 | Hello World!
25 |
26 |
27 | ```
28 |
29 | ```html[class="line-numbers"]{1,3-4,8}
30 |
31 |
32 |
33 | Hello World!
36 |
37 |
38 | Hello World!
39 |
40 |
41 | ```
42 |
--------------------------------------------------------------------------------
/test/fixtures/no-lang.md:
--------------------------------------------------------------------------------
1 | ```
2 | hello
3 | world
4 | ```
5 |
--------------------------------------------------------------------------------
/test/fixtures/show-invisibles.md:
--------------------------------------------------------------------------------
1 | ```html
2 |
3 |
4 |
5 | Hello World!
8 |
9 |
10 | Hello World!
11 |
12 |
13 | ```
14 |
--------------------------------------------------------------------------------
/test/fixtures/treeview.md:
--------------------------------------------------------------------------------
1 | ```treeview
2 | .
3 | ├── .eslintignore
4 | ├── .eslintrc
5 | ├── .gitignore
6 | ├── .prettierignore
7 | ├── .prettierrc
8 | ├── .yarnrc.yml
9 | ├── README.md
10 | ├── index.js
11 | ├── package.json
12 | ├── test/
13 | │ ├── fixtures/
14 | │ └── index.js
15 | └── yarn.lock
16 |
17 | 7 directories, 41 files
18 | ```
19 |
--------------------------------------------------------------------------------
/test/index.js:
--------------------------------------------------------------------------------
1 | const test = require('ava');
2 | const { transform } = require('@babel/core');
3 | const { readFile, writeFile, readdirSync } = require('mz/fs');
4 | const mdx = require('@mdx-js/mdx');
5 | const { join } = require('path');
6 | const puppeteer = require('puppeteer');
7 | const prettier = require('prettier');
8 | const { default: ForEach } = require('apr-for-each');
9 | const Parallel = require('apr-parallel');
10 | const rollup = require('rollup');
11 | const React = require('react');
12 | const ReactDOM = require('react-dom/server');
13 | const virtual = require('@rollup/plugin-virtual');
14 | const vfile = require('to-vfile');
15 | const unified = require('unified');
16 |
17 | const prism = require('..');
18 | const { PLUGINS } = require('../src/highlight');
19 |
20 | const { CI = 'false' } = process.env;
21 | const FIXTURES = join(__dirname, 'fixtures');
22 | const OUTPUTS = join(__dirname, 'outputs');
23 |
24 | const takeScreenshot = async (file, path) => {
25 | if (JSON.parse(CI)) {
26 | return;
27 | }
28 |
29 | const browser = await puppeteer.launch();
30 | const page = await browser.newPage();
31 | await page.goto(`file://${file}`, { waitUntil: 'networkidle0' });
32 | await page.evaluateHandle('document.fonts.ready');
33 | await page.screenshot({ path, fullPage: true });
34 | await browser.close();
35 | };
36 |
37 | const compileJsx = async (src, options) => {
38 | const config = await prettier.resolveConfig(__filename);
39 |
40 | const prettify = (str) => {
41 | return prettier.format(str, { ...config, parser: 'html' });
42 | };
43 |
44 | const jsx = await mdx(src, {
45 | commonmark: true,
46 | gfm: true,
47 | remarkPlugins: [[prism, options]],
48 | });
49 |
50 | const { code } = transform(jsx.replace(/^\/\*\s*?@jsx\s*?mdx\s\*\//, ''), {
51 | sourceType: 'module',
52 | presets: [require.resolve('@babel/preset-react')],
53 | });
54 |
55 | const bundle = await rollup.rollup({
56 | input: 'main.js',
57 | treeshake: true,
58 | plugins: [
59 | virtual({
60 | 'main.js': "import React from 'react';\n"
61 | .concat(`const mdx = React.createElement;\n`)
62 | .concat(code),
63 | }),
64 | require('rollup-plugin-babel')({
65 | sourceType: 'module',
66 | presets: [require.resolve('@babel/preset-react')],
67 | }),
68 | ],
69 | });
70 |
71 | const result = await bundle.generate({
72 | format: 'iife',
73 | name: 'Main',
74 | exports: 'named',
75 | globals: {
76 | react: 'React',
77 | },
78 | });
79 |
80 | // eslint-disable-next-line no-new-func
81 | const fn = new Function('React', `${result.output[0].code};\nreturn Main;`);
82 | const element = React.createElement(fn(React).default);
83 |
84 | return prettify(
85 | '
17 |
27 |
37 |
45 |
--------------------------------------------------------------------------------
/test/outputs/autolinker.jsx.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/sergioramos/remark-prism/49f1f86d50f376c647214c02cf972ce05b0fc756/test/outputs/autolinker.jsx.png
--------------------------------------------------------------------------------
/test/outputs/autolinker.mdast.html:
--------------------------------------------------------------------------------
1 |
13 |
24 |
36 |
--------------------------------------------------------------------------------
/test/outputs/diff-highlight.jsx.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/sergioramos/remark-prism/49f1f86d50f376c647214c02cf972ce05b0fc756/test/outputs/diff-highlight.jsx.png
--------------------------------------------------------------------------------
/test/outputs/diff-highlight.mdast.html:
--------------------------------------------------------------------------------
1 |
18 |
38 |
--------------------------------------------------------------------------------
/test/outputs/inline-color.jsx.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/sergioramos/remark-prism/49f1f86d50f376c647214c02cf972ce05b0fc756/test/outputs/inline-color.jsx.png
--------------------------------------------------------------------------------
/test/outputs/inline-color.mdast.html:
--------------------------------------------------------------------------------
1 | 
7 | 
24 |