0.2.6 • Published 4 months ago

rehype-wrap-cjk v0.2.6

Weekly downloads
-
License
MIT
Repository
github
Last release
4 months ago

rehype-wrap-cjk

This package is a unified/rehype plugin to wrap CJK character sequences in an element (defaulting to span) with a lang attribute, useful for applying different CSS styling rules in multilingual contexts.

Note: this plugin is distributed in ESM and CJS.

Install

npm install rehype-wrap-cjk

Use

A typical pipeline transforming Markdown into HTML with remark and rehype:

import rehypeSanitize from 'rehype-sanitize';
import rehypeStringify from 'rehype-stringify';
import rehypeCjkWrap from 'rehype-wrap-cjk';
import remarkParse from 'remark-parse';
import remarkRehype from 'remark-rehype';
import { unified } from 'unified';

export function processMarkdown(markdownContent: string): string {
	const htmlOutput = unified()
		.use(remarkParse)
		.use(remarkRehype)
		.use(rehypeCjkWrap)
		.use(rehypeSanitize)
		.use(rehypeStringify)
		.processSync(markdownContent);

	return String(htmlOutput);
}

Example plain text input:

Sample text with CJK characters (中日韓字符) interspersed. 中文 can appear anywhere in the text and will be appropriately wrapped.

Example HTML output:

Sample text with CJK characters (<span lang="zh">中日韓字符</span>) interspersed. <span lang="zh">中文</span> can appear anywhere in the text and will be appropriately wrapped.

Example CSS rules (for you to implement in your own projects):

html:not([lang^='zh']) span[lang^='zh'] {
	font-style: normal !important;
	text-decoration: none !important;
	word-break: keep-all !important;
}

Reference

License

MIT

0.2.1

7 months ago

0.2.0

7 months ago

0.2.6

4 months ago

0.2.3

6 months ago

0.2.2

6 months ago

0.2.5

4 months ago

0.2.4

5 months ago

0.1.0

9 months ago

0.1.1

9 months ago

0.0.4

1 year ago

0.0.3

1 year ago

0.0.2

1 year ago

0.0.1

1 year ago