@mark-sorcery/vue 0.2.0 → 0.3.0

package/README.md

@@ -1,15 +1,149 @@
-# @mark-3/vue
+# @mark-sorcery/vue
 
-To install dependencies:
+Renderizador de Markdown para Vue 3 basado en componentes anidados.
+
+El paquete parsea Markdown a HAST con [@mark-sorcery/markdown-parser](../markdown-parser/README.md) y renderiza cada nodo `element` mediante un registro de componentes Vue. El arbol se resuelve recursivamente con `NodeList`, no con una conversion previa a VNodes anidados.
+
+## Instalacion
 
 ```bash
-bun install
+bun add @mark-sorcery/vue vue
 ```
 
-To run:
+## Uso basico
 
-```bash
-bun run index.ts
+```vue
+<script setup lang="ts">
+import { Markdown, createCorePlugin } from "@mark-sorcery/vue";
+
+const markdown = `# Hola
+
+Texto con **negrita** y una [liga](https://example.com).`;
+</script>
+
+<template>
+  <Markdown :markdown="markdown" :plugins="[createCorePlugin()]" />
+</template>
 ```
 
-This project was created using `bun init` in bun v1.3.10. [Bun](https://bun.com) is a fast all-in-one JavaScript runtime.
+## Como funciona
+
+- `Markdown` crea un processor de `@mark-sorcery/markdown-parser` a partir de `options` y `plugins`.
+- El resultado HAST se entrega a `NodeList`.
+- `NodeList` busca un componente Vue para cada `tagName` dentro de `DEFAULT_COMPONENTS` combinado con tu prop `components`.
+- Cada componente de elemento decide como renderizar su propio nodo y, si tiene hijos, vuelve a usar `NodeList` para continuar la recursion.
+
+Esto significa que un componente personalizado no recibe `slots` con el contenido ya renderizado. Recibe el nodo HAST bruto y debe renderizar sus hijos explicitamente si quiere conservar el contenido anidado.
+
+## Props de Markdown
+
+### `markdown`
+
+Cadena Markdown a renderizar.
+
+### `options`
+
+Opciones reenviadas a `createProcessor(...)`, excepto `plugins`.
+
+### `plugins`
+
+Lista de `ParserPlugin` para el parser subyacente. El paquete reexporta `createCorePlugin()` para habilitar `remend`, `remark-gfm` y `rehype-sanitize`.
+
+### `stream`
+
+Si es `true`, reutiliza memoria de parseo para streams crecientes de Markdown.
+
+### `components`
+
+Mapa `Record<string, Component>` indexado por `tagName`. Se fusiona con `DEFAULT_COMPONENTS`; cualquier clave que proporciones reemplaza al componente por defecto para ese tag.
+
+### `transition`
+
+`false`, `true` o una configuracion para `<Transition>`. Cuando se activa, cada nodo renderizado por `NodeList` se envuelve en un `Transition` de Vue.
+
+## Componentes por defecto
+
+El registro exportado como `DEFAULT_COMPONENTS` incluye:
+
+- `p`
+- `h1` a `h6`
+- `strong`
+- `em`
+- `del`
+- `blockquote`
+- `ul`
+- `ol`
+- `li`
+- `code`
+- `a`
+- `input`
+- `pre`
+- `table`
+- `thead`
+- `tbody`
+- `tr`
+- `th`
+- `td`
+
+Si el parser produce un tag sin componente registrado, ese nodo no se renderiza hasta que añadas una entrada correspondiente en `components`.
+
+## Componentes personalizados
+
+Cada componente personalizado recibe props estructurales del nodo actual:
+
+- `element`: el nodo HAST `Element`.
+- `nodeIdx`: indice del nodo dentro de su lista de hermanos.
+- `deep`: profundidad actual en el arbol.
+- `nodeKey`: clave estable generada para ese nodo.
+- `parentNode`: nodo padre inmediato.
+
+Si quieres conservar hijos anidados, renderiza `NodeList` dentro de tu componente:
+
+```ts
+import { defineComponent, h, markRaw } from "vue";
+import { Markdown, NodeList, createCorePlugin } from "@mark-sorcery/vue";
+
+const CustomParagraph = markRaw(
+  defineComponent({
+    name: "CustomParagraph",
+    props: ["element", "nodeIdx", "deep", "nodeKey", "parentNode"],
+    render() {
+      return h("p", { class: "custom-paragraph", "data-depth": this.deep }, [
+        h(NodeList, {
+          nodes: this.element.children,
+          nodeIdx: this.nodeIdx,
+          deep: this.deep,
+          nodeKey: this.nodeKey,
+          parentNode: this.element,
+          components: {},
+          transition: false,
+        }),
+      ]);
+    },
+  }),
+);
+
+const components = {
+  p: CustomParagraph,
+};
+
+// <Markdown markdown="Hola **mundo**" :plugins="[createCorePlugin()]" :components="components" />
+```
+
+Si ademas reemplazas nodos hijos, por ejemplo `strong`, `a` o `code`, la recursion seguira usando tu mapa `components` en cada nivel.
+
+## Exportaciones publicas
+
+- `Markdown`
+- `NodeList`
+- `DEFAULT_COMPONENTS`
+- `useMarkdown`
+- `createCorePlugin`
+- Tipos: `MarkdownProps`, `ElementProps`, `NodeListProps`, `MarkdownOptions`, `ParserPlugin` y otros reexportados desde el parser.
+
+## Scripts
+
+```bash
+bun run test
+bun run build
+```

package/dist/Blockquote-BeOfUsk-.js

@@ -0,0 +1,41 @@
+import { n as useMarkdown, t as _sfc_main$1 } from "./NodeList-DliNdSdR.js";
+import { createElementBlock, createVNode, defineComponent, mergeProps, openBlock, unref } from "vue";
+
+//#region src/components/elements/Blockquote.vue
+const _sfc_main = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Blockquote",
+	props: {
+		nodeIdx: {},
+		deep: {},
+		nodeKey: {},
+		parentNode: {},
+		element: {}
+	},
+	setup(__props) {
+		const { components, transition } = useMarkdown();
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("blockquote", mergeProps({ "data-mark-sorcery": "blockquote" }, __props.element.properties), [createVNode(_sfc_main$1, {
+				nodes: __props.element.children,
+				nodeIdx: __props.nodeIdx,
+				deep: __props.deep,
+				nodeKey: __props.nodeKey,
+				parentNode: __props.element,
+				components: unref(components),
+				transition: unref(transition)
+			}, null, 8, [
+				"nodes",
+				"nodeIdx",
+				"deep",
+				"nodeKey",
+				"parentNode",
+				"components",
+				"transition"
+			])], 16);
+		};
+	}
+});
+
+//#endregion
+export { _sfc_main as default };
+//# sourceMappingURL=Blockquote-BeOfUsk-.js.map

package/dist/Blockquote-BeOfUsk-.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Blockquote-BeOfUsk-.js","names":[],"sources":["../src/components/elements/Blockquote.vue","../src/components/elements/Blockquote.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport type { ElementProps } from \"../../types\";\r\n\r\nimport { useMarkdown } from \"../../composables/markdown\";\r\nimport NodeList from \"../NodeList.vue\";\r\n\r\ndefineOptions({\r\n  inheritAttrs: false,\r\n});\r\n\r\nconst { element, nodeIdx, deep, nodeKey } = defineProps<ElementProps>();\r\nconst { components, transition } = useMarkdown();\r\n</script>\r\n\r\n<template>\r\n  <blockquote data-mark-sorcery=\"blockquote\" v-bind=\"element.properties\">\r\n    <NodeList\r\n      :nodes=\"element.children\"\r\n      :nodeIdx=\"nodeIdx\"\r\n      :deep=\"deep\"\r\n      :nodeKey=\"nodeKey\"\r\n      :parentNode=\"element\"\r\n      :components=\"components\"\r\n      :transition=\"transition\"\r\n    />\r\n  </blockquote>\r\n</template>\r\n","<script setup lang=\"ts\">\r\nimport type { ElementProps } from \"../../types\";\r\n\r\nimport { useMarkdown } from \"../../composables/markdown\";\r\nimport NodeList from \"../NodeList.vue\";\r\n\r\ndefineOptions({\r\n  inheritAttrs: false,\r\n});\r\n\r\nconst { element, nodeIdx, deep, nodeKey } = defineProps<ElementProps>();\r\nconst { components, transition } = useMarkdown();\r\n</script>\r\n\r\n<template>\r\n  <blockquote data-mark-sorcery=\"blockquote\" v-bind=\"element.properties\">\r\n    <NodeList\r\n      :nodes=\"element.children\"\r\n      :nodeIdx=\"nodeIdx\"\r\n      :deep=\"deep\"\r\n      :nodeKey=\"nodeKey\"\r\n      :parentNode=\"element\"\r\n      :components=\"components\"\r\n      :transition=\"transition\"\r\n    />\r\n  </blockquote>\r\n</template>\r\n"],"mappings":";;;;;;;;;;;;;;;EAWA,MAAM,EAAE,YAAY,eAAe,aAAa;;uBCI9C,mBAUa,cAVb,WAUa,EAVD,qBAAkB,cAAY,EAAS,QAAA,QAAQ,WAAU,EAAA,CACnE,YAQE,aAAA;IAPC,OAAO,QAAA,QAAQ;IACf,SAAS,QAAA;IACT,MAAM,QAAA;IACN,SAAS,QAAA;IACT,YAAY,QAAA;IACZ,YAAY,MAAA,WAAU;IACtB,YAAY,MAAA,WAAU"}

package/dist/Blockquote-RI8XvPhG.cjs

@@ -0,0 +1,41 @@
+const require_NodeList = require('./NodeList-CXCRf4Sf.cjs');
+let vue = require("vue");
+
+//#region src/components/elements/Blockquote.vue
+const _sfc_main = /* @__PURE__ */ (0, vue.defineComponent)({
+	inheritAttrs: false,
+	__name: "Blockquote",
+	props: {
+		nodeIdx: {},
+		deep: {},
+		nodeKey: {},
+		parentNode: {},
+		element: {}
+	},
+	setup(__props) {
+		const { components, transition } = require_NodeList.useMarkdown();
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createElementBlock)("blockquote", (0, vue.mergeProps)({ "data-mark-sorcery": "blockquote" }, __props.element.properties), [(0, vue.createVNode)(require_NodeList._sfc_main, {
+				nodes: __props.element.children,
+				nodeIdx: __props.nodeIdx,
+				deep: __props.deep,
+				nodeKey: __props.nodeKey,
+				parentNode: __props.element,
+				components: (0, vue.unref)(components),
+				transition: (0, vue.unref)(transition)
+			}, null, 8, [
+				"nodes",
+				"nodeIdx",
+				"deep",
+				"nodeKey",
+				"parentNode",
+				"components",
+				"transition"
+			])], 16);
+		};
+	}
+});
+
+//#endregion
+exports.default = _sfc_main;
+//# sourceMappingURL=Blockquote-RI8XvPhG.cjs.map

package/dist/Blockquote-RI8XvPhG.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Blockquote-RI8XvPhG.cjs","names":[],"sources":["../src/components/elements/Blockquote.vue","../src/components/elements/Blockquote.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport type { ElementProps } from \"../../types\";\r\n\r\nimport { useMarkdown } from \"../../composables/markdown\";\r\nimport NodeList from \"../NodeList.vue\";\r\n\r\ndefineOptions({\r\n  inheritAttrs: false,\r\n});\r\n\r\nconst { element, nodeIdx, deep, nodeKey } = defineProps<ElementProps>();\r\nconst { components, transition } = useMarkdown();\r\n</script>\r\n\r\n<template>\r\n  <blockquote data-mark-sorcery=\"blockquote\" v-bind=\"element.properties\">\r\n    <NodeList\r\n      :nodes=\"element.children\"\r\n      :nodeIdx=\"nodeIdx\"\r\n      :deep=\"deep\"\r\n      :nodeKey=\"nodeKey\"\r\n      :parentNode=\"element\"\r\n      :components=\"components\"\r\n      :transition=\"transition\"\r\n    />\r\n  </blockquote>\r\n</template>\r\n","<script setup lang=\"ts\">\r\nimport type { ElementProps } from \"../../types\";\r\n\r\nimport { useMarkdown } from \"../../composables/markdown\";\r\nimport NodeList from \"../NodeList.vue\";\r\n\r\ndefineOptions({\r\n  inheritAttrs: false,\r\n});\r\n\r\nconst { element, nodeIdx, deep, nodeKey } = defineProps<ElementProps>();\r\nconst { components, transition } = useMarkdown();\r\n</script>\r\n\r\n<template>\r\n  <blockquote data-mark-sorcery=\"blockquote\" v-bind=\"element.properties\">\r\n    <NodeList\r\n      :nodes=\"element.children\"\r\n      :nodeIdx=\"nodeIdx\"\r\n      :deep=\"deep\"\r\n      :nodeKey=\"nodeKey\"\r\n      :parentNode=\"element\"\r\n      :components=\"components\"\r\n      :transition=\"transition\"\r\n    />\r\n  </blockquote>\r\n</template>\r\n"],"mappings":";;;;;;;;;;;;;;;EAWA,MAAM,EAAE,YAAY,eAAe,8BAAa;;4DCcjC,kCAAA,EAVD,qBAAkB,cAAY,EAAS,QAAA,QAAQ,WAAU,EAAA,sBASjE,4BAAA;IAPC,OAAO,QAAA,QAAQ;IACf,SAAS,QAAA;IACT,MAAM,QAAA;IACN,SAAS,QAAA;IACT,YAAY,QAAA;IACZ,2BAAY,WAAU;IACtB,2BAAY,WAAU"}

package/dist/Bold-Bi1du8CJ.js

@@ -0,0 +1,41 @@
+import { n as useMarkdown, t as _sfc_main$1 } from "./NodeList-DliNdSdR.js";
+import { createElementBlock, createVNode, defineComponent, mergeProps, openBlock, unref } from "vue";
+
+//#region src/components/elements/Bold.vue
+const _sfc_main = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Bold",
+	props: {
+		nodeIdx: {},
+		deep: {},
+		nodeKey: {},
+		parentNode: {},
+		element: {}
+	},
+	setup(__props) {
+		const { components, transition } = useMarkdown();
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("strong", mergeProps({ "data-mark-sorcery": "bold" }, __props.element.properties), [createVNode(_sfc_main$1, {
+				nodes: __props.element.children,
+				nodeIdx: __props.nodeIdx,
+				deep: __props.deep,
+				nodeKey: __props.nodeKey,
+				parentNode: __props.element,
+				components: unref(components),
+				transition: unref(transition)
+			}, null, 8, [
+				"nodes",
+				"nodeIdx",
+				"deep",
+				"nodeKey",
+				"parentNode",
+				"components",
+				"transition"
+			])], 16);
+		};
+	}
+});
+
+//#endregion
+export { _sfc_main as default };
+//# sourceMappingURL=Bold-Bi1du8CJ.js.map

package/dist/Bold-Bi1du8CJ.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Bold-Bi1du8CJ.js","names":[],"sources":["../src/components/elements/Bold.vue","../src/components/elements/Bold.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport type { ElementProps } from \"../../types\";\r\n\r\nimport { useMarkdown } from \"../../composables/markdown\";\r\nimport NodeList from \"../NodeList.vue\";\r\n\r\ndefineOptions({\r\n  inheritAttrs: false,\r\n});\r\n\r\nconst { element, nodeIdx, deep, nodeKey } = defineProps<ElementProps>();\r\nconst { components, transition } = useMarkdown();\r\n</script>\r\n\r\n<template>\r\n  <strong data-mark-sorcery=\"bold\" v-bind=\"element.properties\">\r\n    <NodeList\r\n      :nodes=\"element.children\"\r\n      :nodeIdx=\"nodeIdx\"\r\n      :deep=\"deep\"\r\n      :nodeKey=\"nodeKey\"\r\n      :parentNode=\"element\"\r\n      :components=\"components\"\r\n      :transition=\"transition\"\r\n    />\r\n  </strong>\r\n</template>\r\n","<script setup lang=\"ts\">\r\nimport type { ElementProps } from \"../../types\";\r\n\r\nimport { useMarkdown } from \"../../composables/markdown\";\r\nimport NodeList from \"../NodeList.vue\";\r\n\r\ndefineOptions({\r\n  inheritAttrs: false,\r\n});\r\n\r\nconst { element, nodeIdx, deep, nodeKey } = defineProps<ElementProps>();\r\nconst { components, transition } = useMarkdown();\r\n</script>\r\n\r\n<template>\r\n  <strong data-mark-sorcery=\"bold\" v-bind=\"element.properties\">\r\n    <NodeList\r\n      :nodes=\"element.children\"\r\n      :nodeIdx=\"nodeIdx\"\r\n      :deep=\"deep\"\r\n      :nodeKey=\"nodeKey\"\r\n      :parentNode=\"element\"\r\n      :components=\"components\"\r\n      :transition=\"transition\"\r\n    />\r\n  </strong>\r\n</template>\r\n"],"mappings":";;;;;;;;;;;;;;;EAWA,MAAM,EAAE,YAAY,eAAe,aAAa;;uBCI9C,mBAUS,UAVT,WAUS,EAVD,qBAAkB,QAAM,EAAS,QAAA,QAAQ,WAAU,EAAA,CACzD,YAQE,aAAA;IAPC,OAAO,QAAA,QAAQ;IACf,SAAS,QAAA;IACT,MAAM,QAAA;IACN,SAAS,QAAA;IACT,YAAY,QAAA;IACZ,YAAY,MAAA,WAAU;IACtB,YAAY,MAAA,WAAU"}

package/dist/Bold-DWA5fzKp.cjs

@@ -0,0 +1,41 @@
+const require_NodeList = require('./NodeList-CXCRf4Sf.cjs');
+let vue = require("vue");
+
+//#region src/components/elements/Bold.vue
+const _sfc_main = /* @__PURE__ */ (0, vue.defineComponent)({
+	inheritAttrs: false,
+	__name: "Bold",
+	props: {
+		nodeIdx: {},
+		deep: {},
+		nodeKey: {},
+		parentNode: {},
+		element: {}
+	},
+	setup(__props) {
+		const { components, transition } = require_NodeList.useMarkdown();
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createElementBlock)("strong", (0, vue.mergeProps)({ "data-mark-sorcery": "bold" }, __props.element.properties), [(0, vue.createVNode)(require_NodeList._sfc_main, {
+				nodes: __props.element.children,
+				nodeIdx: __props.nodeIdx,
+				deep: __props.deep,
+				nodeKey: __props.nodeKey,
+				parentNode: __props.element,
+				components: (0, vue.unref)(components),
+				transition: (0, vue.unref)(transition)
+			}, null, 8, [
+				"nodes",
+				"nodeIdx",
+				"deep",
+				"nodeKey",
+				"parentNode",
+				"components",
+				"transition"
+			])], 16);
+		};
+	}
+});
+
+//#endregion
+exports.default = _sfc_main;
+//# sourceMappingURL=Bold-DWA5fzKp.cjs.map

package/dist/Bold-DWA5fzKp.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Bold-DWA5fzKp.cjs","names":[],"sources":["../src/components/elements/Bold.vue","../src/components/elements/Bold.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport type { ElementProps } from \"../../types\";\r\n\r\nimport { useMarkdown } from \"../../composables/markdown\";\r\nimport NodeList from \"../NodeList.vue\";\r\n\r\ndefineOptions({\r\n  inheritAttrs: false,\r\n});\r\n\r\nconst { element, nodeIdx, deep, nodeKey } = defineProps<ElementProps>();\r\nconst { components, transition } = useMarkdown();\r\n</script>\r\n\r\n<template>\r\n  <strong data-mark-sorcery=\"bold\" v-bind=\"element.properties\">\r\n    <NodeList\r\n      :nodes=\"element.children\"\r\n      :nodeIdx=\"nodeIdx\"\r\n      :deep=\"deep\"\r\n      :nodeKey=\"nodeKey\"\r\n      :parentNode=\"element\"\r\n      :components=\"components\"\r\n      :transition=\"transition\"\r\n    />\r\n  </strong>\r\n</template>\r\n","<script setup lang=\"ts\">\r\nimport type { ElementProps } from \"../../types\";\r\n\r\nimport { useMarkdown } from \"../../composables/markdown\";\r\nimport NodeList from \"../NodeList.vue\";\r\n\r\ndefineOptions({\r\n  inheritAttrs: false,\r\n});\r\n\r\nconst { element, nodeIdx, deep, nodeKey } = defineProps<ElementProps>();\r\nconst { components, transition } = useMarkdown();\r\n</script>\r\n\r\n<template>\r\n  <strong data-mark-sorcery=\"bold\" v-bind=\"element.properties\">\r\n    <NodeList\r\n      :nodes=\"element.children\"\r\n      :nodeIdx=\"nodeIdx\"\r\n      :deep=\"deep\"\r\n      :nodeKey=\"nodeKey\"\r\n      :parentNode=\"element\"\r\n      :components=\"components\"\r\n      :transition=\"transition\"\r\n    />\r\n  </strong>\r\n</template>\r\n"],"mappings":";;;;;;;;;;;;;;;EAWA,MAAM,EAAE,YAAY,eAAe,8BAAa;;4DCcrC,8BAAA,EAVD,qBAAkB,QAAM,EAAS,QAAA,QAAQ,WAAU,EAAA,sBASvD,4BAAA;IAPC,OAAO,QAAA,QAAQ;IACf,SAAS,QAAA;IACT,MAAM,QAAA;IACN,SAAS,QAAA;IACT,YAAY,QAAA;IACZ,2BAAY,WAAU;IACtB,2BAAY,WAAU"}

package/dist/Code-DPKXUmPC.js

@@ -0,0 +1,41 @@
+import { n as useMarkdown, t as _sfc_main$1 } from "./NodeList-DliNdSdR.js";
+import { createElementBlock, createVNode, defineComponent, mergeProps, openBlock, unref } from "vue";
+
+//#region src/components/elements/Code.vue
+const _sfc_main = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Code",
+	props: {
+		nodeIdx: {},
+		deep: {},
+		nodeKey: {},
+		parentNode: {},
+		element: {}
+	},
+	setup(__props) {
+		const { components, transition } = useMarkdown();
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("code", mergeProps({ "data-mark-sorcery": "code" }, __props.element.properties), [createVNode(_sfc_main$1, {
+				nodes: __props.element.children,
+				nodeIdx: __props.nodeIdx,
+				deep: __props.deep,
+				nodeKey: __props.nodeKey,
+				parentNode: __props.element,
+				components: unref(components),
+				transition: unref(transition)
+			}, null, 8, [
+				"nodes",
+				"nodeIdx",
+				"deep",
+				"nodeKey",
+				"parentNode",
+				"components",
+				"transition"
+			])], 16);
+		};
+	}
+});
+
+//#endregion
+export { _sfc_main as default };
+//# sourceMappingURL=Code-DPKXUmPC.js.map

package/dist/Code-DPKXUmPC.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Code-DPKXUmPC.js","names":[],"sources":["../src/components/elements/Code.vue","../src/components/elements/Code.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport type { ElementProps } from \"../../types\";\r\n\r\nimport { useMarkdown } from \"../../composables/markdown\";\r\nimport NodeList from \"../NodeList.vue\";\r\n\r\ndefineOptions({\r\n  inheritAttrs: false,\r\n});\r\n\r\nconst { element, nodeIdx, deep, nodeKey } = defineProps<ElementProps>();\r\nconst { components, transition } = useMarkdown();\r\n</script>\r\n\r\n<template>\r\n  <code data-mark-sorcery=\"code\" v-bind=\"element.properties\">\r\n    <NodeList\r\n      :nodes=\"element.children\"\r\n      :nodeIdx=\"nodeIdx\"\r\n      :deep=\"deep\"\r\n      :nodeKey=\"nodeKey\"\r\n      :parentNode=\"element\"\r\n      :components=\"components\"\r\n      :transition=\"transition\"\r\n    />\r\n  </code>\r\n</template>\r\n","<script setup lang=\"ts\">\r\nimport type { ElementProps } from \"../../types\";\r\n\r\nimport { useMarkdown } from \"../../composables/markdown\";\r\nimport NodeList from \"../NodeList.vue\";\r\n\r\ndefineOptions({\r\n  inheritAttrs: false,\r\n});\r\n\r\nconst { element, nodeIdx, deep, nodeKey } = defineProps<ElementProps>();\r\nconst { components, transition } = useMarkdown();\r\n</script>\r\n\r\n<template>\r\n  <code data-mark-sorcery=\"code\" v-bind=\"element.properties\">\r\n    <NodeList\r\n      :nodes=\"element.children\"\r\n      :nodeIdx=\"nodeIdx\"\r\n      :deep=\"deep\"\r\n      :nodeKey=\"nodeKey\"\r\n      :parentNode=\"element\"\r\n      :components=\"components\"\r\n      :transition=\"transition\"\r\n    />\r\n  </code>\r\n</template>\r\n"],"mappings":";;;;;;;;;;;;;;;EAWA,MAAM,EAAE,YAAY,eAAe,aAAa;;uBCI9C,mBAUO,QAVP,WAUO,EAVD,qBAAkB,QAAM,EAAS,QAAA,QAAQ,WAAU,EAAA,CACvD,YAQE,aAAA;IAPC,OAAO,QAAA,QAAQ;IACf,SAAS,QAAA;IACT,MAAM,QAAA;IACN,SAAS,QAAA;IACT,YAAY,QAAA;IACZ,YAAY,MAAA,WAAU;IACtB,YAAY,MAAA,WAAU"}

package/dist/Code-DmkITyUd.cjs

@@ -0,0 +1,41 @@
+const require_NodeList = require('./NodeList-CXCRf4Sf.cjs');
+let vue = require("vue");
+
+//#region src/components/elements/Code.vue
+const _sfc_main = /* @__PURE__ */ (0, vue.defineComponent)({
+	inheritAttrs: false,
+	__name: "Code",
+	props: {
+		nodeIdx: {},
+		deep: {},
+		nodeKey: {},
+		parentNode: {},
+		element: {}
+	},
+	setup(__props) {
+		const { components, transition } = require_NodeList.useMarkdown();
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createElementBlock)("code", (0, vue.mergeProps)({ "data-mark-sorcery": "code" }, __props.element.properties), [(0, vue.createVNode)(require_NodeList._sfc_main, {
+				nodes: __props.element.children,
+				nodeIdx: __props.nodeIdx,
+				deep: __props.deep,
+				nodeKey: __props.nodeKey,
+				parentNode: __props.element,
+				components: (0, vue.unref)(components),
+				transition: (0, vue.unref)(transition)
+			}, null, 8, [
+				"nodes",
+				"nodeIdx",
+				"deep",
+				"nodeKey",
+				"parentNode",
+				"components",
+				"transition"
+			])], 16);
+		};
+	}
+});
+
+//#endregion
+exports.default = _sfc_main;
+//# sourceMappingURL=Code-DmkITyUd.cjs.map

package/dist/Code-DmkITyUd.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Code-DmkITyUd.cjs","names":[],"sources":["../src/components/elements/Code.vue","../src/components/elements/Code.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport type { ElementProps } from \"../../types\";\r\n\r\nimport { useMarkdown } from \"../../composables/markdown\";\r\nimport NodeList from \"../NodeList.vue\";\r\n\r\ndefineOptions({\r\n  inheritAttrs: false,\r\n});\r\n\r\nconst { element, nodeIdx, deep, nodeKey } = defineProps<ElementProps>();\r\nconst { components, transition } = useMarkdown();\r\n</script>\r\n\r\n<template>\r\n  <code data-mark-sorcery=\"code\" v-bind=\"element.properties\">\r\n    <NodeList\r\n      :nodes=\"element.children\"\r\n      :nodeIdx=\"nodeIdx\"\r\n      :deep=\"deep\"\r\n      :nodeKey=\"nodeKey\"\r\n      :parentNode=\"element\"\r\n      :components=\"components\"\r\n      :transition=\"transition\"\r\n    />\r\n  </code>\r\n</template>\r\n","<script setup lang=\"ts\">\r\nimport type { ElementProps } from \"../../types\";\r\n\r\nimport { useMarkdown } from \"../../composables/markdown\";\r\nimport NodeList from \"../NodeList.vue\";\r\n\r\ndefineOptions({\r\n  inheritAttrs: false,\r\n});\r\n\r\nconst { element, nodeIdx, deep, nodeKey } = defineProps<ElementProps>();\r\nconst { components, transition } = useMarkdown();\r\n</script>\r\n\r\n<template>\r\n  <code data-mark-sorcery=\"code\" v-bind=\"element.properties\">\r\n    <NodeList\r\n      :nodes=\"element.children\"\r\n      :nodeIdx=\"nodeIdx\"\r\n      :deep=\"deep\"\r\n      :nodeKey=\"nodeKey\"\r\n      :parentNode=\"element\"\r\n      :components=\"components\"\r\n      :transition=\"transition\"\r\n    />\r\n  </code>\r\n</template>\r\n"],"mappings":";;;;;;;;;;;;;;;EAWA,MAAM,EAAE,YAAY,eAAe,8BAAa;;4DCcvC,4BAAA,EAVD,qBAAkB,QAAM,EAAS,QAAA,QAAQ,WAAU,EAAA,sBASrD,4BAAA;IAPC,OAAO,QAAA,QAAQ;IACf,SAAS,QAAA;IACT,MAAM,QAAA;IACN,SAAS,QAAA;IACT,YAAY,QAAA;IACZ,2BAAY,WAAU;IACtB,2BAAY,WAAU"}

package/dist/CodeBlock-CawFy9YT.cjs

@@ -0,0 +1,45 @@
+const require_NodeList = require('./NodeList-CXCRf4Sf.cjs');
+let vue = require("vue");
+
+//#region src/components/elements/CodeBlock.vue
+const _sfc_main = /* @__PURE__ */ (0, vue.defineComponent)({
+	inheritAttrs: false,
+	__name: "CodeBlock",
+	props: {
+		nodeIdx: {},
+		deep: {},
+		nodeKey: {},
+		parentNode: {},
+		element: {}
+	},
+	setup(__props) {
+		const { components, transition } = require_NodeList.useMarkdown();
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createElementBlock)("pre", (0, vue.mergeProps)({ "data-mark-sorcery": "code-block" }, __props.element.properties), [
+				_cache[0] || (_cache[0] = (0, vue.createTextVNode)("    ", -1)),
+				(0, vue.createVNode)(require_NodeList._sfc_main, {
+					nodes: __props.element.children,
+					nodeIdx: __props.nodeIdx,
+					deep: __props.deep,
+					nodeKey: __props.nodeKey,
+					parentNode: __props.element,
+					components: (0, vue.unref)(components),
+					transition: (0, vue.unref)(transition)
+				}, null, 8, [
+					"nodes",
+					"nodeIdx",
+					"deep",
+					"nodeKey",
+					"parentNode",
+					"components",
+					"transition"
+				]),
+				_cache[1] || (_cache[1] = (0, vue.createTextVNode)("\n  ", -1))
+			], 16);
+		};
+	}
+});
+
+//#endregion
+exports.default = _sfc_main;
+//# sourceMappingURL=CodeBlock-CawFy9YT.cjs.map

package/dist/CodeBlock-CawFy9YT.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CodeBlock-CawFy9YT.cjs","names":[],"sources":["../src/components/elements/CodeBlock.vue","../src/components/elements/CodeBlock.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport type { ElementProps } from \"../../types\";\r\n\r\nimport { useMarkdown } from \"../../composables/markdown\";\r\nimport NodeList from \"../NodeList.vue\";\r\n\r\ndefineOptions({\r\n  inheritAttrs: false,\r\n});\r\n\r\nconst { element, nodeIdx, deep, nodeKey } = defineProps<ElementProps>();\r\nconst { components, transition } = useMarkdown();\r\n</script>\r\n\r\n<template>\r\n  <pre data-mark-sorcery=\"code-block\" v-bind=\"element.properties\">\r\n    <NodeList\r\n      :nodes=\"element.children\"\r\n      :nodeIdx=\"nodeIdx\"\r\n      :deep=\"deep\"\r\n      :nodeKey=\"nodeKey\"\r\n      :parentNode=\"element\"\r\n      :components=\"components\"\r\n      :transition=\"transition\"\r\n    />\r\n  </pre>\r\n</template>\r\n","<script setup lang=\"ts\">\r\nimport type { ElementProps } from \"../../types\";\r\n\r\nimport { useMarkdown } from \"../../composables/markdown\";\r\nimport NodeList from \"../NodeList.vue\";\r\n\r\ndefineOptions({\r\n  inheritAttrs: false,\r\n});\r\n\r\nconst { element, nodeIdx, deep, nodeKey } = defineProps<ElementProps>();\r\nconst { components, transition } = useMarkdown();\r\n</script>\r\n\r\n<template>\r\n  <pre data-mark-sorcery=\"code-block\" v-bind=\"element.properties\">\r\n    <NodeList\r\n      :nodes=\"element.children\"\r\n      :nodeIdx=\"nodeIdx\"\r\n      :deep=\"deep\"\r\n      :nodeKey=\"nodeKey\"\r\n      :parentNode=\"element\"\r\n      :components=\"components\"\r\n      :transition=\"transition\"\r\n    />\r\n  </pre>\r\n</template>\r\n"],"mappings":";;;;;;;;;;;;;;;EAWA,MAAM,EAAE,YAAY,eAAe,8BAAa;;4DCcxC,2BAAA,EAVD,qBAAkB,cAAY,EAAS,QAAA,QAAQ,WAAU,EAAA;uDAAE,QAC9D,GAAA;yBAQE,4BAAA;KAPC,OAAO,QAAA,QAAQ;KACf,SAAS,QAAA;KACT,MAAM,QAAA;KACN,SAAS,QAAA;KACT,YAAY,QAAA;KACZ,2BAAY,WAAU;KACtB,2BAAY,WAAU;;;;;;;;;;uDACvB,QACJ,GAAA"}

package/dist/CodeBlock-Duwcxp3X.js

@@ -0,0 +1,45 @@
+import { n as useMarkdown, t as _sfc_main$1 } from "./NodeList-DliNdSdR.js";
+import { createElementBlock, createTextVNode, createVNode, defineComponent, mergeProps, openBlock, unref } from "vue";
+
+//#region src/components/elements/CodeBlock.vue
+const _sfc_main = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "CodeBlock",
+	props: {
+		nodeIdx: {},
+		deep: {},
+		nodeKey: {},
+		parentNode: {},
+		element: {}
+	},
+	setup(__props) {
+		const { components, transition } = useMarkdown();
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("pre", mergeProps({ "data-mark-sorcery": "code-block" }, __props.element.properties), [
+				_cache[0] || (_cache[0] = createTextVNode("    ", -1)),
+				createVNode(_sfc_main$1, {
+					nodes: __props.element.children,
+					nodeIdx: __props.nodeIdx,
+					deep: __props.deep,
+					nodeKey: __props.nodeKey,
+					parentNode: __props.element,
+					components: unref(components),
+					transition: unref(transition)
+				}, null, 8, [
+					"nodes",
+					"nodeIdx",
+					"deep",
+					"nodeKey",
+					"parentNode",
+					"components",
+					"transition"
+				]),
+				_cache[1] || (_cache[1] = createTextVNode("\n  ", -1))
+			], 16);
+		};
+	}
+});
+
+//#endregion
+export { _sfc_main as default };
+//# sourceMappingURL=CodeBlock-Duwcxp3X.js.map

package/dist/CodeBlock-Duwcxp3X.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CodeBlock-Duwcxp3X.js","names":[],"sources":["../src/components/elements/CodeBlock.vue","../src/components/elements/CodeBlock.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport type { ElementProps } from \"../../types\";\r\n\r\nimport { useMarkdown } from \"../../composables/markdown\";\r\nimport NodeList from \"../NodeList.vue\";\r\n\r\ndefineOptions({\r\n  inheritAttrs: false,\r\n});\r\n\r\nconst { element, nodeIdx, deep, nodeKey } = defineProps<ElementProps>();\r\nconst { components, transition } = useMarkdown();\r\n</script>\r\n\r\n<template>\r\n  <pre data-mark-sorcery=\"code-block\" v-bind=\"element.properties\">\r\n    <NodeList\r\n      :nodes=\"element.children\"\r\n      :nodeIdx=\"nodeIdx\"\r\n      :deep=\"deep\"\r\n      :nodeKey=\"nodeKey\"\r\n      :parentNode=\"element\"\r\n      :components=\"components\"\r\n      :transition=\"transition\"\r\n    />\r\n  </pre>\r\n</template>\r\n","<script setup lang=\"ts\">\r\nimport type { ElementProps } from \"../../types\";\r\n\r\nimport { useMarkdown } from \"../../composables/markdown\";\r\nimport NodeList from \"../NodeList.vue\";\r\n\r\ndefineOptions({\r\n  inheritAttrs: false,\r\n});\r\n\r\nconst { element, nodeIdx, deep, nodeKey } = defineProps<ElementProps>();\r\nconst { components, transition } = useMarkdown();\r\n</script>\r\n\r\n<template>\r\n  <pre data-mark-sorcery=\"code-block\" v-bind=\"element.properties\">\r\n    <NodeList\r\n      :nodes=\"element.children\"\r\n      :nodeIdx=\"nodeIdx\"\r\n      :deep=\"deep\"\r\n      :nodeKey=\"nodeKey\"\r\n      :parentNode=\"element\"\r\n      :components=\"components\"\r\n      :transition=\"transition\"\r\n    />\r\n  </pre>\r\n</template>\r\n"],"mappings":";;;;;;;;;;;;;;;EAWA,MAAM,EAAE,YAAY,eAAe,aAAa;;uBCI9C,mBAUM,OAVN,WAUM,EAVD,qBAAkB,cAAY,EAAS,QAAA,QAAQ,WAAU,EAAA;8CAAE,QAC9D,GAAA;IAAA,YAQE,aAAA;KAPC,OAAO,QAAA,QAAQ;KACf,SAAS,QAAA;KACT,MAAM,QAAA;KACN,SAAS,QAAA;KACT,YAAY,QAAA;KACZ,YAAY,MAAA,WAAU;KACtB,YAAY,MAAA,WAAU;;;;;;;;;;8CACvB,QACJ,GAAA"}

package/dist/Heading-CPB6VryI.js

@@ -0,0 +1,51 @@
+import { n as useMarkdown, t as _sfc_main$1 } from "./NodeList-DliNdSdR.js";
+import { computed, createBlock, createVNode, defineComponent, mergeProps, openBlock, resolveDynamicComponent, unref, withCtx } from "vue";
+
+//#region src/components/elements/Heading.vue
+const _sfc_main = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "Heading",
+	props: {
+		nodeIdx: {},
+		deep: {},
+		nodeKey: {},
+		parentNode: {},
+		element: {}
+	},
+	setup(__props) {
+		const { components, transition } = useMarkdown();
+		const headingLevel = computed(() => {
+			const level = parseInt(__props.element.tagName.slice(1));
+			return isNaN(level) ? 1 : level;
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(resolveDynamicComponent(__props.element.tagName), mergeProps({
+				"data-mark-sorcery": "heading",
+				"data-heading-level": headingLevel.value
+			}, __props.element.properties), {
+				default: withCtx(() => [createVNode(_sfc_main$1, {
+					nodes: __props.element.children,
+					nodeIdx: __props.nodeIdx,
+					deep: __props.deep,
+					nodeKey: __props.nodeKey,
+					parentNode: __props.element,
+					components: unref(components),
+					transition: unref(transition)
+				}, null, 8, [
+					"nodes",
+					"nodeIdx",
+					"deep",
+					"nodeKey",
+					"parentNode",
+					"components",
+					"transition"
+				])]),
+				_: 1
+			}, 16, ["data-heading-level"]);
+		};
+	}
+});
+
+//#endregion
+export { _sfc_main as default };
+//# sourceMappingURL=Heading-CPB6VryI.js.map

package/dist/Heading-CPB6VryI.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Heading-CPB6VryI.js","names":[],"sources":["../src/components/elements/Heading.vue","../src/components/elements/Heading.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { computed } from \"vue\";\r\n\r\nimport type { ElementProps } from \"../../types\";\r\n\r\nimport { useMarkdown } from \"../../composables/markdown\";\r\nimport NodeList from \"../NodeList.vue\";\r\n\r\ndefineOptions({\r\n  inheritAttrs: false,\r\n});\r\n\r\nconst { element, nodeIdx, deep, nodeKey } = defineProps<ElementProps>();\r\nconst { components, transition } = useMarkdown();\r\n\r\nconst headingLevel = computed(() => {\r\n  const level = parseInt(element.tagName.slice(1));\r\n  return isNaN(level) ? 1 : level;\r\n});\r\n</script>\r\n\r\n<template>\r\n  <component\r\n    :is=\"element.tagName\"\r\n    data-mark-sorcery=\"heading\"\r\n    :data-heading-level=\"headingLevel\"\r\n    v-bind=\"element.properties\"\r\n  >\r\n    <NodeList\r\n      :nodes=\"element.children\"\r\n      :nodeIdx=\"nodeIdx\"\r\n      :deep=\"deep\"\r\n      :nodeKey=\"nodeKey\"\r\n      :parentNode=\"element\"\r\n      :components=\"components\"\r\n      :transition=\"transition\"\r\n    />\r\n  </component>\r\n</template>\r\n","<script setup lang=\"ts\">\r\nimport { computed } from \"vue\";\r\n\r\nimport type { ElementProps } from \"../../types\";\r\n\r\nimport { useMarkdown } from \"../../composables/markdown\";\r\nimport NodeList from \"../NodeList.vue\";\r\n\r\ndefineOptions({\r\n  inheritAttrs: false,\r\n});\r\n\r\nconst { element, nodeIdx, deep, nodeKey } = defineProps<ElementProps>();\r\nconst { components, transition } = useMarkdown();\r\n\r\nconst headingLevel = computed(() => {\r\n  const level = parseInt(element.tagName.slice(1));\r\n  return isNaN(level) ? 1 : level;\r\n});\r\n</script>\r\n\r\n<template>\r\n  <component\r\n    :is=\"element.tagName\"\r\n    data-mark-sorcery=\"heading\"\r\n    :data-heading-level=\"headingLevel\"\r\n    v-bind=\"element.properties\"\r\n  >\r\n    <NodeList\r\n      :nodes=\"element.children\"\r\n      :nodeIdx=\"nodeIdx\"\r\n      :deep=\"deep\"\r\n      :nodeKey=\"nodeKey\"\r\n      :parentNode=\"element\"\r\n      :components=\"components\"\r\n      :transition=\"transition\"\r\n    />\r\n  </component>\r\n</template>\r\n"],"mappings":";;;;;;;;;;;;;;;EAaA,MAAM,EAAE,YAAY,eAAe,aAAa;EAEhD,MAAM,eAAe,eAAe;GAClC,MAAM,QAAQ,SAAS,QAAA,QAAQ,QAAQ,MAAM,EAAE,CAAC;AAChD,UAAO,MAAM,MAAM,GAAG,IAAI;IAC1B;;uBCIA,YAeY,wBAdL,QAAA,QAAQ,QAAO,EADtB,WAeY;IAbV,qBAAkB;IACjB,sBAAoB,aAAA;MACb,QAAA,QAAQ,WAAU,EAAA;2BAUxB,CARF,YAQE,aAAA;KAPC,OAAO,QAAA,QAAQ;KACf,SAAS,QAAA;KACT,MAAM,QAAA;KACN,SAAS,QAAA;KACT,YAAY,QAAA;KACZ,YAAY,MAAA,WAAU;KACtB,YAAY,MAAA,WAAU"}