@oiij/markdown-it 0.0.8 → 0.0.9

package/dist/{index.d.cts → index.d.mts}

@@ -1,15 +1,16 @@
 import markdownIt, { Options } from "markdown-it";
-import { Ref } from "vue";
+import * as vue0 from "vue";
+import { Ref, TemplateRef } from "vue";
 
 //#region src/index.d.ts
 type MarkDownItOptions = Options & {
   manual?: boolean;
   domPurify?: boolean;
 };
-declare function useMarkdownIt(defaultValue?: Ref<string> | string, options?: MarkDownItOptions): {
+declare function useMarkdownIt(templateRef?: TemplateRef<HTMLElement>, defaultValue?: Ref<string> | string, options?: MarkDownItOptions): {
   value: Ref<string | undefined, string | undefined>;
   html: Ref<string, string>;
-  domRef: Ref<HTMLElement | undefined, HTMLElement | undefined>;
+  templateRef: Readonly<vue0.ShallowRef<HTMLElement | null>> | undefined;
   md: markdownIt;
   render: (value: string) => string;
 };

package/dist/{index.js → index.mjs}

@@ -3,27 +3,18 @@ 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 ?? {};
+function useMarkdownIt(templateRef, 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();
-				}
-			});
-		}
+		if (templateRef && templateRef.value) templateRef.value.innerHTML = html.value;
 		return html.value;
 	}
 	if (!manual) {
@@ -35,7 +26,7 @@ function useMarkdownIt(defaultValue, options) {
 	return {
 		value,
 		html,
-		domRef,
+		templateRef,
 		md,
 		render
 	};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@oiij/markdown-it",
   "type": "module",
-  "version": "0.0.8",
+  "version": "0.0.9",
   "description": "A Vue Composable for markdown-it",
   "author": "oiij",
   "license": "MIT",
@@ -16,16 +16,9 @@
     "markdown-it"
   ],
   "sideEffects": false,
-  "exports": {
-    ".": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.js",
-      "require": "./dist/index.cjs"
-    }
-  },
-  "main": "./dist/index.js",
-  "module": "./dist/index.js",
-  "types": "./dist/index.d.ts",
+  "main": "./dist/index.mjs",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.mts",
   "files": [
     "LICENSE",
     "README.md",
@@ -33,17 +26,17 @@
     "package.json"
   ],
   "peerDependencies": {
-    "@vueuse/core": "^14.0.0",
-    "dompurify": "^3.3.0",
+    "@vueuse/core": "^14.1.0",
+    "dompurify": "^3.3.1",
     "markdown-it": "^14.1.0",
-    "vue": "^3.5.22"
+    "vue": "^3.5.25"
   },
   "devDependencies": {
     "@types/markdown-it": "^14.1.2",
-    "@vueuse/core": "^14.0.0",
-    "dompurify": "^3.3.0",
+    "@vueuse/core": "^14.1.0",
+    "dompurify": "^3.3.1",
     "markdown-it": "^14.1.0",
-    "vue": "^3.5.22"
+    "vue": "^3.5.25"
   },
   "publishConfig": {
     "access": "public"

package/dist/index.cjs

@@ -1,71 +0,0 @@
-//#region rolldown:runtime
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __copyProps = (to, from, except, desc) => {
-	if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
-		key = keys[i];
-		if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
-			get: ((k) => from[k]).bind(null, key),
-			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
-		});
-	}
-	return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
-	value: mod,
-	enumerable: true
-}) : target, mod));
-
-//#endregion
-let dompurify = require("dompurify");
-dompurify = __toESM(dompurify);
-let markdown_it = require("markdown-it");
-markdown_it = __toESM(markdown_it);
-let vue = require("vue");
-vue = __toESM(vue);
-
-//#region src/index.ts
-function useMarkdownIt(defaultValue, options) {
-	const { manual = false, domPurify = true,..._options } = options ?? {};
-	const value = (0, vue.ref)((0, vue.isRef)(defaultValue) ? (0, vue.toValue)(defaultValue.value) : (0, vue.isReactive)(defaultValue) ? (0, vue.toValue)(defaultValue) : defaultValue);
-	if ((0, vue.isRef)(defaultValue)) (0, vue.watchEffect)(() => {
-		value.value = (0, vue.toValue)(defaultValue.value);
-	});
-	const html = (0, vue.ref)("");
-	const domRef = (0, vue.ref)();
-	const md = (0, markdown_it.default)({ ..._options });
-	function render(value$1) {
-		const mdValue = md.render(value$1);
-		html.value = domPurify ? dompurify.default.sanitize(mdValue) : mdValue;
-		if (domRef.value) domRef.value.innerHTML = html.value;
-		else {
-			const unWatch = (0, vue.watch)(domRef, (v) => {
-				if (v) {
-					v.innerHTML = html.value;
-					unWatch();
-				}
-			});
-		}
-		return html.value;
-	}
-	if (!manual) {
-		render(value.value ?? "");
-		(0, vue.watch)(value, (v) => {
-			render(v ?? "");
-		});
-	}
-	return {
-		value,
-		html,
-		domRef,
-		md,
-		render
-	};
-}
-
-//#endregion
-exports.useMarkdownIt = useMarkdownIt;

package/dist/index.d.ts

@@ -1,18 +0,0 @@
-import markdownIt, { Options } from "markdown-it";
-import { Ref } from "vue";
-
-//#region src/index.d.ts
-type MarkDownItOptions = Options & {
-  manual?: boolean;
-  domPurify?: boolean;
-};
-declare function useMarkdownIt(defaultValue?: Ref<string> | string, options?: MarkDownItOptions): {
-  value: Ref<string | undefined, string | undefined>;
-  html: Ref<string, string>;
-  domRef: Ref<HTMLElement | undefined, HTMLElement | undefined>;
-  md: markdownIt;
-  render: (value: string) => string;
-};
-type MarkdownItReturns = ReturnType<typeof useMarkdownIt>;
-//#endregion
-export { MarkDownItOptions, MarkdownItReturns, useMarkdownIt };