init project.

.github/workflows/ci.yml

@@ -0,0 +1,36 @@
+name: CI
+on:
+  push:
+    branches:
+      - main
+
+jobs:
+  build-deploy:
+    runs-on: ubuntu-20.04
+    steps:
+      - uses: actions/checkout@v2
+      - uses: actions/setup-node@v2
+        with:
+          node-version: 14
+
+      - run: npm install
+      - run: npm run build
+      - run: npm run type-check
+      - run: npm run coverage
+
+      - name: Converts Markdown to HTML
+        uses: jaywcjlove/markdown-to-html-cli@main
+        with:
+          source: README.md
+          output: coverage/index.html
+          github-corners: https://github.com/jaywcjlove/rehype-ignore
+
+      - name: Create Coverage Badges
+        uses: jaywcjlove/coverage-badges-cli@main
+
+      - name: Generate Contributors Images
+        uses: jaywcjlove/github-action-contributors@main
+        with:
+          filter-author: (renovate\[bot\]|renovate-bot|dependabot\[bot\])
+          output: coverage/CONTRIBUTORS.svg
+          avatarSize: 42

.gitignore

@@ -0,0 +1,18 @@
+coverage
+build
+node_modules
+lib
+npm-debug.log*
+package-lock.json
+
+.eslintcache
+.DS_Store
+.cache
+.vscode
+
+*.bak
+*.tem
+*.temp
+#.swp
+*.*~
+~*.*

README.md

@@ -1 +1,101 @@
-# rehype-ignore
+rehype-ignore
+===
+<!--rehype:style=display: flex; height: 230px; align-items: center; justify-content: center; font-size: 38px;-->
+
+[![Downloads](https://img.shields.io/npm/dm/rehype-rewrite.svg?style=flat)](https://www.npmjs.com/package/rehype-rewrite)
+[![NPM version](https://img.shields.io/npm/v/rehype-rewrite.svg?style=flat)](https://npmjs.org/package/rehype-rewrite)
+[![Build](https://github.com/jaywcjlove/rehype-rewrite/actions/workflows/ci.yml/badge.svg)](https://github.com/jaywcjlove/rehype-rewrite/actions/workflows/ci.yml)
+[![Coverage Status](https://jaywcjlove.github.io/rehype-rewrite/badges.svg)](https://jaywcjlove.github.io/rehype-rewrite/lcov-report/)
+
+Ignore content display via HTML comments, Shown in GitHub readme, excluded in HTML.
+
+## Installation
+
+This package is [ESM only](https://gist.github.com/sindresorhus/a39789f98801d908bbc7ff3ecc99d99c): Node 12+ is needed to use it and it must be `import` instead of `require`.
+
+```bash
+npm install rehype-ignore
+```
+
+## Options
+
+```ts
+export declare type RehypeIgnoreOptions = {
+  /**
+   *  Character to use for opening delimiter, by default `rehype:ignore:start`
+   */
+  openDelimiter?: string;
+  /**
+   * Character to use for closing delimiter, by default `rehype:ignore:end`
+   */
+  closeDelimiter?: string;
+};
+```
+
+## Usage
+
+```js
+import { rehype } from 'rehype';
+import rehypeIgnore from 'rehype-ignore';
+
+rehype()
+  .data('settings', { fragment: true })
+  .use(rehypeIgnore, { })
+```
+
+### HTML Example
+
+```html
+<h1>header</h1>
+<p>
+  Hello <!--rehype:ignore:start--> <code>World</code> <!--rehype:ignore:end-->
+</p>
+```
+
+Output:
+
+```html
+<h1>header</h1>
+<p>
+  Hello </p>
+```
+
+```js
+import { rehype } from 'rehype';
+import rehypeIgnore from 'rehype-ignore';
+
+const html = `<h1>header</h1>
+<p>
+  Hello <!--rehype:ignore:start--> <code>World</code> <!--rehype:ignore:end-->
+</p>`
+
+const htmlStr = rehype()
+  .data('settings', { fragment: true })
+  .use(rehypeAttrs, { properties: 'attr' })
+  .processSync(html)
+  .toString()
+```
+
+## Related
+
+- [`rehype-video`](https://github.com/jaywcjlove/rehype-video) Add improved video syntax: links to `.mp4` and `.mov` turn into videos.
+- [`rehype-attr`](https://github.com/jaywcjlove/rehype-attr) New syntax to add attributes to Markdown.
+- [`rehypejs`](https://github.com/rehypejs/rehype) HTML processor powered by plugins part of the @unifiedjs collective
+- [`remark-parse`](https://www.npmjs.com/package/remark-parse) remark plugin to parse Markdown
+- [`remark-rehype`](https://www.npmjs.com/package/remark-rehype) remark plugin to transform to rehype
+- [`rehype-raw`](https://www.npmjs.com/package/rehype-raw) rehype plugin to reparse the tree (and raw nodes)
+- [`rehype-stringify`](https://www.npmjs.com/package/rehype-stringify) rehype plugin to serialize HTML
+
+## Contributors
+
+As always, thanks to our amazing contributors!
+
+<a href="https://github.com/jaywcjlove/rehype-ignore/graphs/contributors">
+  <img src="https://jaywcjlove.github.io/rehype-ignore/CONTRIBUTORS.svg" />
+</a>
+
+Made with [action-contributors](https://github.com/jaywcjlove/github-action-contributors).
+
+## License
+
+MIT © [Kenny Wong](https://github.com/jaywcjlove)

package.json

@@ -0,0 +1,60 @@
+{
+  "name": "rehype-ignore",
+  "version": "1.0.0",
+  "description": "Ignore content display via HTML comments, Shown in GitHub readme, excluded in HTML.",
+  "homepage": "https://jaywcjlove.github.io/rehype-ignore",
+  "author": "Kenny Wong <[email protected]>",
+  "license": "MIT",
+  "sideEffects": false,
+  "type": "module",
+  "main": "lib/index.js",
+  "scripts": {
+    "prepack": "npm run build",
+    "start": "node lib/index.js",
+    "watch": "tsbb watch --disable-babel",
+    "build": "tsbb build --disable-babel",
+    "type-check": "tsc --noEmit",
+    "test": "tsbb test",
+    "coverage": "tsbb test --coverage"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/jaywcjlove/rehype-ignore"
+  },
+  "files": [
+    "src",
+    "lib"
+  ],
+  "keywords": [
+    "rehype",
+    "rehype-ignore",
+    "ignore",
+    "element",
+    "markdown",
+    "javascript",
+    "html",
+    "ast",
+    "unified"
+  ],
+  "jest": {
+    "transformIgnorePatterns": [
+      "<rootDir>/node_modules/?!(.*)"
+    ]
+  },
+  "engines": {
+    "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
+  },
+  "dependencies": {
+    "unified": "~10.1.2",
+    "unist-util-visit": "~4.1.0",
+    "hast-util-select": "~5.0.1"
+  },
+  "devDependencies": {
+    "rehype": "~12.0.1",
+    "rehype-stringify": "~9.0.3",
+    "rehype-raw": "~6.1.1",
+    "remark-parse": "~10.0.1",
+    "remark-rehype": "~10.1.0",
+    "tsbb": "~3.7.2"
+  }
+}

renovate.json

@@ -0,0 +1,11 @@
+{
+  "extends": [
+    "config:base"
+  ],
+  "packageRules": [
+    {
+      "matchPackagePatterns": ["*"],
+      "rangeStrategy": "replace"
+    }
+  ]
+}

src/__test__/index.test.ts

@@ -0,0 +1,72 @@
+import { unified } from 'unified';
+import remarkParse from 'remark-parse';
+import remark2rehype from 'remark-rehype';
+import { rehype } from 'rehype';
+import rehypeRaw from 'rehype-raw';
+import stringify from 'rehype-stringify';
+import rehypeIgnore from '..';
+
+it('rehypeIgnore test case', async () => {
+  const html = `<!--rehype:ignore:start--><h1>header</h1><!--rehype:ignore:end-->`;
+  const htmlStr = rehype()
+    .data('settings', { fragment: true })
+    .use(rehypeIgnore, { })
+    .use(stringify)
+    .processSync(html)
+    .toString()
+    expect(htmlStr).toEqual('');
+});
+
+it('rehypeIgnore test case', async () => {
+  const html = `<!--rehype:ignore:start--><h1>header</h1>`;
+  const htmlStr = rehype()
+    .data('settings', { fragment: true })
+    .use(rehypeIgnore, { })
+    .use(stringify)
+    .processSync(html)
+    .toString()
+    expect(htmlStr).toEqual(html);
+});
+
+it('rehypeIgnore test case', async () => {
+  const html = `<h1>header</h1><!--rehype:ignore:end-->`;
+  const htmlStr = rehype()
+    .data('settings', { fragment: true })
+    .use(rehypeIgnore, { })
+    .use(stringify)
+    .processSync(html)
+    .toString()
+    expect(htmlStr).toEqual(html);
+});
+
+it('rehypeIgnore test case', async () => {
+  const html = `<!--rehype:ignore:start--><h1>header</h1><!--rehype:ignore:end--><!--rehype:ignore:end-->`;
+  const htmlStr = rehype()
+    .data('settings', { fragment: true })
+    .use(rehypeIgnore, { })
+    .use(stringify)
+    .processSync(html)
+    .toString()
+    expect(htmlStr).toEqual(`<!--rehype:ignore:end-->`);
+});
+
+it('rehypeIgnore test case', async () => {
+  const html = `<!--rehype:ignore:start-->
+<h1>header</h1>
+<!--rehype:ignore:end-->
+<p>
+  Hello <!--rehype:ignore:start--> <code>World</code> <!--rehype:ignore:end-->
+</p>
+`;
+  const expected = `
+<p>
+  Hello </p>
+`
+  const htmlStr = rehype()
+    .data('settings', { fragment: true })
+    .use(rehypeIgnore, { })
+    .use(stringify)
+    .processSync(html)
+    .toString()
+    expect(htmlStr).toEqual(expected);
+});

src/index.ts

@@ -0,0 +1,31 @@
+import { Plugin } from 'unified';
+import { Root, RootContent } from 'hast';
+import { visit } from 'unist-util-visit';
+
+export type RehypeIgnoreOptions = {
+  /**
+   *  Character to use for opening delimiter, by default `rehype:ignore:start`
+   */
+  openDelimiter?: string;
+  /**
+   * Character to use for closing delimiter, by default `rehype:ignore:end`
+   */
+  closeDelimiter?: string;
+}
+
+const rehypeIgnore: Plugin<[RehypeIgnoreOptions?], Root> = (options = {}) => {
+  const { openDelimiter = 'rehype:ignore:start', closeDelimiter = 'rehype:ignore:end' } = options;
+  return (tree) => {
+    visit(tree, (node: Root | RootContent, index, parent) => {
+      if (node.type === 'element' || node.type === 'root') {
+        const start = node.children.findIndex((item) => item.type === 'comment' && item.value === openDelimiter);
+        const end = node.children.findIndex((item) => item.type === 'comment' && item.value === closeDelimiter);
+        if (start > -1 && end > -1) {
+          node.children.splice(start, end + 1);
+        }
+      }
+    });
+  }
+}
+
+export default rehypeIgnore;

tsconfig.json

@@ -0,0 +1,22 @@
+{
+  "compilerOptions": {
+    "target": "ESNext",
+    "module": "ESNext",
+    "moduleResolution": "node",
+    "sourceMap": true,
+    "declaration": true,
+    "noFallthroughCasesInSwitch": true,
+    "noImplicitThis": true,
+    "strictBindCallApply": true,
+    "strictNullChecks": true,
+    "strictPropertyInitialization": true,
+    "stripInternal": true,
+    "esModuleInterop": false,
+    "noImplicitAny": true,
+    "outDir": "lib",
+    "baseUrl": "."
+  },
+  "include": [
+    "src/**/*"
+  ]
+}