@oiij/markdown-it/dist/index.js

A Vue Composable for markdown-it

import DOMPurify from "dompurify";
import markdownIt from "markdown-it";
import { isReactive, isRef, ref, toValue, watch, watchEffect } from "vue";

//#region src/index.ts
function useMarkdownIt(defaultValue, options) {
	const { manual = false, domPurify = true,..._options } = options ?? {};
	const value = ref(isRef(defaultValue) ? toValue(defaultValue.value) : isReactive(defaultValue) ? toValue(defaultValue) : defaultValue);
	if (isRef(defaultValue)) watchEffect(() => {
		value.value = toValue(defaultValue.value);
	});
	const html = ref("");
	const domRef = ref();
	const md = markdownIt({ ..._options });
	function render(value$1) {
		const mdValue = md.render(value$1);
		html.value = domPurify ? DOMPurify.sanitize(mdValue) : mdValue;
		if (domRef.value) domRef.value.innerHTML = html.value;
		else {
			const unWatch = watch(domRef, (v) => {
				if (v) {
					v.innerHTML = html.value;
					unWatch();
				}
			});
		}
		return html.value;
	}
	if (!manual) {
		render(value.value ?? "");
		watch(value, (v) => {
			render(v ?? "");
		});
	}
	return {
		value,
		html,
		domRef,
		md,
		render
	};
}

//#endregion
export { useMarkdownIt };