feat: add presets

[Mister-Hope]

No description provided.

[Mister-Hope]

@lizheming Looking forward for your feedback about this.

To decouple function based feature, I am a planning to create a new concept called presets and split the whole renderer and capatcha features out of client package.

Shiki highlighter needs an async loading stage, so it's a bit hacky and I am not adding it now.

My current plan is to mark client-presets as private, and release each presets as a single package with it's name, e.g.:

• @waline/recapcha-v3
• @waline/marked-slim
• @waline/markdown-it-emoji-katex-prism
• ...

As each bundle may be around MBs (with tex support), so it would be better to release them as separate packages.

But with amounts of preset package, I think maybe it could be better to create a walinejs/presets repo for it?

Looking forward for your opinion.

[Mister-Hope]

Besides, another plan is to release some sperate function helpers and let users combine them. This would be complicated than presets, but easier to maintain,

For example, we release @waline/katex and @waline/mathjax to provide a unify api texRenderer, and we provide @waline/markdown-it-renderer and @waline/marked-render with export path /emoji /tex and /highlight available, and users should do the following themselves:

import { texRenderer } from '@waline/katex';
import { highlighter } from '@waline/highlightjs'
import { markdownIt } from '@waline/markdown-it-renderer';
import { emoji } from '@waline/markdown-it-renderer/emoji';
import { tex } from '@waline/markdown-it-renderer/tex';

const initRenderer = ({ emojiMap }) => {
  markdownIt.use(tex, texRenderer);
  markdownIt.use(emoji, emojiMap);
  markdownIt.options.highlight = highlighter;

 return (content) => markdownIt.render(content);
}

Another case:

import { texRenderer } from '@waline/mathjax';
import { highlighter, prepareHighlighter } from '@waline/shiki'
import { marked } from '@waline/marked-renderer';
import { markedEmoji } from '@waline/marked-renderer/emoji';
import { markedHighlight } from '@waline/marked-renderer/highlighter';
import { markedTex } from '@waline/marked-renderer/tex';

const initRenderer = async ({ emojiMap }) => {
  await prepareHighlighter();
  marked.use(markedTex(texRenderer));
  marked.use(markedEmoji (emojiMap));
  marked.use(markedHighlight({ highlight: highlighter }));


 return (content) => marked.parse(content);
}