@elmethis/vue 0.2.10 → 0.2.12

package/dist/components/code/ElmCodeBlock.vue.mjs

@@ -3,7 +3,7 @@
   try {
     if (typeof document != "undefined") {
       var elementStyle = document.createElement("style");
-      elementStyle.appendChild(document.createTextNode(".v-enter-to[data-v-92929132],.v-leave-from[data-v-92929132]{opacity:1}.v-enter-active[data-v-92929132],.v-leave-active[data-v-92929132]{transition:opacity .15s}.v-enter-from[data-v-92929132],.v-leave-to[data-v-92929132]{opacity:0}"));
+      elementStyle.appendChild(document.createTextNode(".v-enter-to[data-v-514e4afd],.v-leave-from[data-v-514e4afd]{opacity:1}.v-enter-active[data-v-514e4afd],.v-leave-active[data-v-514e4afd]{transition:opacity .15s}.v-enter-from[data-v-514e4afd],.v-leave-to[data-v-514e4afd]{opacity:0}"));
       document.head.appendChild(elementStyle);
     }
   } catch (e) {
@@ -17,7 +17,7 @@ import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
 const cssModules = {
   "$style": style0
 };
-const ElmCodeBlock = /* @__PURE__ */ _export_sfc(_sfc_main, [["__cssModules", cssModules], ["__scopeId", "data-v-92929132"]]);
+const ElmCodeBlock = /* @__PURE__ */ _export_sfc(_sfc_main, [["__cssModules", cssModules], ["__scopeId", "data-v-514e4afd"]]);
 export {
   ElmCodeBlock as default
 };

package/dist/components/others/ElmCommandPalette.vue.mjs

@@ -3,7 +3,7 @@
   try {
     if (typeof document != "undefined") {
       var elementStyle = document.createElement("style");
-      elementStyle.appendChild(document.createTextNode(".fade-enter-active[data-v-cbf6ab16],.fade-leave-active[data-v-cbf6ab16]{transition:all .1s ease}.fade-enter-from[data-v-cbf6ab16],.fade-leave-to[data-v-cbf6ab16]{opacity:0;transform:translate(.5rem)}"));
+      elementStyle.appendChild(document.createTextNode(".fade-enter-active[data-v-e975d67d],.fade-leave-active[data-v-e975d67d]{transition:all .1s ease}.fade-enter-from[data-v-e975d67d],.fade-leave-to[data-v-e975d67d]{opacity:0;transform:translate(.5rem)}"));
       document.head.appendChild(elementStyle);
     }
   } catch (e) {
@@ -17,7 +17,7 @@ import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
 const cssModules = {
   "$style": style0
 };
-const ElmCommandPalette = /* @__PURE__ */ _export_sfc(_sfc_main, [["__cssModules", cssModules], ["__scopeId", "data-v-cbf6ab16"]]);
+const ElmCommandPalette = /* @__PURE__ */ _export_sfc(_sfc_main, [["__cssModules", cssModules], ["__scopeId", "data-v-e975d67d"]]);
 export {
   ElmCommandPalette as default
 };

package/dist/components/others/ElmJsonComponentRenderer.stories.d.ts

@@ -21,3 +21,4 @@ export declare const Katex: Story;
 export declare const Table: Story;
 export declare const ColumnList: Story;
 export declare const Unsupported: Story;
+export declare const Unified: Story;

package/dist/components/others/ElmJsonComponentRenderer.vue2.mjs

@@ -10,7 +10,7 @@
     console.error("vite-plugin-css-injected-by-js", e);
   }
 })();
-import { defineComponent, useCssModule, ref, computed, watch, createElementBlock, openBlock, createBlock, resolveDynamicComponent, h } from "vue";
+import { defineComponent, useCssModule, ref, computed, watch, createElementBlock, openBlock, normalizeClass, createBlock, resolveDynamicComponent, h } from "vue";
 import ElmInlineText from "../typography/ElmInlineText.vue.mjs";
 import ElmKatex from "../code/ElmKatex.vue.mjs";
 import ElmMermaid from "../code/ElmMermaid.vue.mjs";
@@ -178,9 +178,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       }
     );
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", null, [
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(_ctx.$style["jarkup-body"])
+      }, [
         (openBlock(), createBlock(resolveDynamicComponent(components.value)))
-      ]);
+      ], 2);
     };
   }
 });

package/dist/components/others/ElmJsonComponentRenderer.vue3.mjs

@@ -3,16 +3,17 @@
   try {
     if (typeof document != "undefined") {
       var elementStyle = document.createElement("style");
-      elementStyle.appendChild(document.createTextNode("._column-list_1at6s_1{box-sizing:content-box;padding-block:.25rem;width:100%;display:flex;flex-direction:row;gap:.5rem;justify-content:space-around;overflow:auto}._column_1at6s_1{flex:1}"));
+      elementStyle.appendChild(document.createTextNode("._jarkup-body_18xt2_1>*+*{margin-block-start:2em}._column-list_18xt2_5{box-sizing:content-box;padding-block:.25rem;width:100%;display:flex;flex-direction:row;gap:.5rem;justify-content:space-around;overflow:auto}._column_18xt2_5{flex:1}"));
       document.head.appendChild(elementStyle);
     }
   } catch (e) {
     console.error("vite-plugin-css-injected-by-js", e);
   }
 })();
-const column = "_column_1at6s_1";
+const column = "_column_18xt2_5";
 const style0 = {
-  "column-list": "_column-list_1at6s_1",
+  "jarkup-body": "_jarkup-body_18xt2_1",
+  "column-list": "_column-list_18xt2_5",
   column
 };
 export {

package/dist/components/others/ElmMarkdown.stories.d.ts

@@ -4,3 +4,4 @@ declare const meta: Meta<typeof ElmMarkdown>;
 export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const Primary: Story;
+export declare const CodeBlock: Story;

package/dist/components/others/ElmMarkdown.vue.mjs

@@ -1,255 +1,10 @@
-(function() {
-  "use strict";
-  try {
-    if (typeof document != "undefined") {
-      var elementStyle = document.createElement("style");
-      elementStyle.appendChild(document.createTextNode(".elmethis-list-common{margin-block:1rem;opacity:var(--opacity);transition:opacity .8s;box-sizing:border-box;padding-left:1.25rem}.elmethis-bulleted-list li{box-sizing:border-box;padding-left:.5rem;margin-block:.75rem}.elmethis-bulleted-list li::marker{content:url(data:image/svg+xml;base64,ICA8c3ZnCiAgICB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnCiAgICB2aWV3Qm94PScwIDAgMTYgMTYnCiAgICB3aWR0aD0nMTJweCcKICAgIGhlaWdodD0nMTJweCcKICA+CiAgICA8cGF0aAogICAgICBmaWxsPScjNDQ5NzYzJwogICAgICBvcGFjaXR5PScwLjgnCiAgICAgIGQ9J00zIDMuNzMyYTEuNSAxLjUgMCAwIDEgMi4zMDUtMS4yNjVsNi43MDYgNC4yNjdhMS41IDEuNSAwIDAgMSAwIDIuNTMxbC02LjcwNiA0LjI2OEExLjUgMS41IDAgMCAxIDMgMTIuMjY3VjMuNzMyWicKICAgIC8+CiAgPC9zdmc+)}.elmethis-bulleted-list li ul li::marker{content:url(data:image/svg+xml;base64,ICA8c3ZnCiAgICB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnCiAgICB2aWV3Qm94PScwIDAgMjQgMjQnCiAgICB3aWR0aD0nMTJweCcKICAgIGhlaWdodD0nMTJweCcKICAgIHN0cm9rZT0nIzQ0OTc2MycKICAgIGZpbGw9J3RyYW5zcGFyZW50JwogID4KICAgIDxwYXRoCiAgICAgIHN0cm9rZUxpbmVjYXA9J3JvdW5kJwogICAgICBzdHJva2VMaW5lam9pbj0ncm91bmQnCiAgICAgIGQ9J001LjI1IDUuNjUzYzAtLjg1Ni45MTctMS4zOTggMS42NjctLjk4NmwxMS41NCA2LjM0N2ExLjEyNSAxLjEyNSAwIDAgMSAwIDEuOTcybC0xMS41NCA2LjM0N2ExLjEyNSAxLjEyNSAwIDAgMS0xLjY2Ny0uOTg2VjUuNjUzWicKICAgIC8+CiAgPC9zdmc+)}.elmethis-bulleted-list li ul li ul li::marker{content:url(data:image/svg+xml;base64,ICA8c3ZnCiAgICB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnCiAgICB2aWV3Qm94PScwIDAgMjAgMjAnCiAgICB3aWR0aD0nMTJweCcKICAgIGhlaWdodD0nMTJweCcKICAgIHN0cm9rZT0nIzQ0OTc2MycKICAgIGZpbGw9JyM0NDk3NjMnCiAgPgogICAgPHBhdGgKICAgICAgZmlsbFJ1bGU9J2V2ZW5vZGQnCiAgICAgIGQ9J004LjIyIDUuMjJhLjc1Ljc1IDAgMCAxIDEuMDYgMGw0LjI1IDQuMjVhLjc1Ljc1IDAgMCAxIDAgMS4wNmwtNC4yNSA0LjI1YS43NS43NSAwIDAgMS0xLjA2LTEuMDZMMTEuOTQgMTAgOC4yMiA2LjI4YS43NS43NSAwIDAgMSAwLTEuMDZaJwogICAgICBjbGlwUnVsZT0nZXZlbm9kZCcKICAgIC8+CiAgPC9zdmc+)}.elmethis-numbered-list li{box-sizing:border-box;padding-left:.25rem;margin-block:.75rem;margin-left:.25rem;list-style-type:decimal}.elmethis-numbered-list li::marker{font-weight:700;color:#9771bd}.elmethis-numbered-list li ol li{list-style-type:lower-alpha}.elmethis-numbered-list li ol li ol li{list-style-type:lower-roman}.elmethis-numbered-list li ol li ol li ol li{list-style-type:lower-greek}"));
-      document.head.appendChild(elementStyle);
-    }
-  } catch (e) {
-    console.error("vite-plugin-css-injected-by-js", e);
-  }
-})();
-import { defineComponent, ref, computed, watch, createElementBlock, openBlock, Fragment, renderList, createBlock, resolveDynamicComponent, h } from "vue";
-import { marked } from "marked";
-import ElmInlineText from "../typography/ElmInlineText.vue.mjs";
-import ElmHeading from "../typography/ElmHeading.vue.mjs";
-import ElmParagraph from "../typography/ElmParagraph.vue.mjs";
-import _sfc_main$2 from "../typography/ElmList.vue.mjs";
-
-import ElmBlockQuote from "../typography/ElmBlockQuote.vue.mjs";
-import ElmDivider from "../typography/ElmDivider.vue.mjs";
-import ElmImage from "../media/ElmImage.vue.mjs";
-import ElmCodeBlock from "../code/ElmCodeBlock.vue.mjs";
-import ElmTable from "../table/ElmTable.vue.mjs";
-import ElmTableHeader from "../table/ElmTableHeader.vue.mjs";
-import _sfc_main$1 from "../table/ElmTableBody.vue.mjs";
-import ElmTableRow from "../table/ElmTableRow.vue.mjs";
-import ElmTableCell from "../table/ElmTableCell.vue.mjs";
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "ElmMarkdown",
-  props: {
-    markdown: {}
-  },
-  setup(__props) {
-    const props = __props;
-    const renderByToken = ({ tokens }) => {
-      const results = [];
-      for (const token of tokens) {
-        switch (token.type) {
-          case "blockquote":
-            if (token.tokens != null && token.tokens.length !== 0) {
-              results.push(
-                h(
-                  ElmBlockQuote,
-                  {},
-                  {
-                    default: () => renderByToken({ tokens: token.tokens })
-                  }
-                )
-              );
-            }
-            break;
-          case "br":
-            results.push(h("br"));
-            break;
-          case "code":
-            results.push(
-              h(ElmCodeBlock, {
-                code: token.text.trim(),
-                language: token.lang
-              })
-            );
-            break;
-          case "codespan":
-            results.push(h(ElmInlineText, { text: token.text, code: true }));
-            break;
-          case "def":
-            h("span", "aaa");
-            break;
-          case "del":
-            results.push(
-              token.tokens != null && token.tokens.length !== 0 ? h(
-                ElmInlineText,
-                { strikethrough: true },
-                {
-                  default: () => renderByToken({ tokens: token.tokens })
-                }
-              ) : h(ElmInlineText, { text: token.text, strikethrough: true })
-            );
-            break;
-          case "em":
-            results.push(
-              token.tokens != null && token.tokens.length !== 0 ? h(
-                ElmInlineText,
-                { italic: true },
-                {
-                  default: () => renderByToken({ tokens: token.tokens })
-                }
-              ) : h(ElmInlineText, { text: token.text, italic: true })
-            );
-            break;
-          case "escape":
-            break;
-          case "heading":
-            if (token.tokens && token.tokens.length !== 0) {
-              results.push(
-                h(
-                  ElmHeading,
-                  { level: token.depth },
-                  {
-                    default: () => renderByToken({ tokens: token.tokens })
-                  }
-                )
-              );
-            } else {
-              results.push(h(ElmHeading, { level: token.depth, text: token.text }));
-            }
-            break;
-          case "hr":
-            results.push(h(ElmDivider));
-            break;
-          case "html":
-            break;
-          case "image":
-            results.push(
-              h(ElmImage, {
-                block: true,
-                enableModal: true,
-                src: token.href,
-                alt: token.text
-              })
-            );
-            break;
-          case "link":
-            results.push(
-              token.tokens != null && token.tokens.length !== 0 ? h(ElmInlineText, {
-                text: token.text,
-                href: token.href
-              }) : h(ElmInlineText, { text: token.text, href: token.href })
-            );
-            break;
-          case "list":
-            const listItems = token.items.map(
-              (item) => h("li", {}, renderByToken({ tokens: item.tokens }))
-            );
-            results.push(
-              h(
-                _sfc_main$2,
-                {
-                  listStyle: token.ordered ? "ordered" : "unordered"
-                },
-                { default: () => listItems }
-              )
-            );
-            break;
-          case "list_item":
-            results.push(
-              token.tokens != null && token.tokens.length !== 0 ? h(
-                "li",
-                {},
-                {
-                  default: () => renderByToken({ tokens: token.tokens })
-                }
-              ) : h("li", { text: token.text })
-            );
-            break;
-          case "paragraph":
-            if (token.tokens && token.tokens.length !== 0) {
-              results.push(
-                h(
-                  ElmParagraph,
-                  {},
-                  {
-                    default: () => renderByToken({ tokens: token.tokens })
-                  }
-                )
-              );
-            }
-            break;
-          case "space":
-            break;
-          case "strong":
-            results.push(
-              token.tokens != null && token.tokens.length !== 0 ? h(
-                ElmInlineText,
-                { bold: true },
-                {
-                  default: () => renderByToken({ tokens: token.tokens })
-                }
-              ) : h(ElmInlineText, { text: token.text, bold: true })
-            );
-            break;
-          case "table":
-            const renderTableCells = ({
-              cells
-            }) => cells.map(
-              (cell) => h(
-                ElmTableCell,
-                {},
-                { default: () => renderByToken({ tokens: cell.tokens }) }
-              )
-            );
-            const headerRow = h(
-              ElmTableRow,
-              {},
-              { default: () => renderTableCells({ cells: token.header }) }
-            );
-            const bodyRows = token.rows.map(
-              (row) => h(
-                ElmTableRow,
-                {},
-                { default: () => renderTableCells({ cells: row }) }
-              )
-            );
-            const table = h(
-              ElmTable,
-              {},
-              {
-                header: () => h(ElmTableHeader, {}, { default: () => headerRow }),
-                body: () => h(_sfc_main$1, {}, { default: () => bodyRows })
-              }
-            );
-            results.push(table);
-            break;
-          case "text":
-            results.push(
-              token.tokens != null && token.tokens.length !== 0 ? h(
-                ElmInlineText,
-                {},
-                {
-                  default: () => renderByToken({ tokens: token.tokens })
-                }
-              ) : h(ElmInlineText, { text: token.text })
-            );
-            break;
-        }
-      }
-      return results;
-    };
-    const renderMarkdown = ({ markdown }) => {
-      const tokens = marked.setOptions({ gfm: true }).lexer(markdown);
-      return renderByToken({ tokens });
-    };
-    const renderResult = ref(renderMarkdown({ markdown: props.markdown }));
-    const components = computed(() => ({
-      render: () => renderResult.value
-    }));
-    watch(
-      () => props.markdown,
-      (md) => {
-        if (md != null) renderResult.value = renderMarkdown({ markdown: md });
-      }
-    );
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", null, [
-        (openBlock(true), createElementBlock(Fragment, null, renderList(components.value, (component) => {
-          return openBlock(), createBlock(resolveDynamicComponent(component));
-        }), 256))
-      ]);
-    };
-  }
-});
+import _sfc_main from "./ElmMarkdown.vue2.mjs";
+import style0 from "./ElmMarkdown.vue3.mjs";
+import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
+const cssModules = {
+  "$style": style0
+};
+const ElmMarkdown = /* @__PURE__ */ _export_sfc(_sfc_main, [["__cssModules", cssModules]]);
 export {
-  _sfc_main as default
+  ElmMarkdown as default
 };

package/dist/components/others/ElmMarkdown.vue2.mjs

@@ -1,4 +1,257 @@
-import _sfc_main from "./ElmMarkdown.vue.mjs";
+(function() {
+  "use strict";
+  try {
+    if (typeof document != "undefined") {
+      var elementStyle = document.createElement("style");
+      elementStyle.appendChild(document.createTextNode(".elmethis-list-common{margin-block:1rem;opacity:var(--opacity);transition:opacity .8s;box-sizing:border-box;padding-left:1.25rem}.elmethis-bulleted-list li{box-sizing:border-box;padding-left:.5rem;margin-block:.75rem}.elmethis-bulleted-list li::marker{content:url(data:image/svg+xml;base64,ICA8c3ZnCiAgICB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnCiAgICB2aWV3Qm94PScwIDAgMTYgMTYnCiAgICB3aWR0aD0nMTJweCcKICAgIGhlaWdodD0nMTJweCcKICA+CiAgICA8cGF0aAogICAgICBmaWxsPScjNDQ5NzYzJwogICAgICBvcGFjaXR5PScwLjgnCiAgICAgIGQ9J00zIDMuNzMyYTEuNSAxLjUgMCAwIDEgMi4zMDUtMS4yNjVsNi43MDYgNC4yNjdhMS41IDEuNSAwIDAgMSAwIDIuNTMxbC02LjcwNiA0LjI2OEExLjUgMS41IDAgMCAxIDMgMTIuMjY3VjMuNzMyWicKICAgIC8+CiAgPC9zdmc+)}.elmethis-bulleted-list li ul li::marker{content:url(data:image/svg+xml;base64,ICA8c3ZnCiAgICB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnCiAgICB2aWV3Qm94PScwIDAgMjQgMjQnCiAgICB3aWR0aD0nMTJweCcKICAgIGhlaWdodD0nMTJweCcKICAgIHN0cm9rZT0nIzQ0OTc2MycKICAgIGZpbGw9J3RyYW5zcGFyZW50JwogID4KICAgIDxwYXRoCiAgICAgIHN0cm9rZUxpbmVjYXA9J3JvdW5kJwogICAgICBzdHJva2VMaW5lam9pbj0ncm91bmQnCiAgICAgIGQ9J001LjI1IDUuNjUzYzAtLjg1Ni45MTctMS4zOTggMS42NjctLjk4NmwxMS41NCA2LjM0N2ExLjEyNSAxLjEyNSAwIDAgMSAwIDEuOTcybC0xMS41NCA2LjM0N2ExLjEyNSAxLjEyNSAwIDAgMS0xLjY2Ny0uOTg2VjUuNjUzWicKICAgIC8+CiAgPC9zdmc+)}.elmethis-bulleted-list li ul li ul li::marker{content:url(data:image/svg+xml;base64,ICA8c3ZnCiAgICB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnCiAgICB2aWV3Qm94PScwIDAgMjAgMjAnCiAgICB3aWR0aD0nMTJweCcKICAgIGhlaWdodD0nMTJweCcKICAgIHN0cm9rZT0nIzQ0OTc2MycKICAgIGZpbGw9JyM0NDk3NjMnCiAgPgogICAgPHBhdGgKICAgICAgZmlsbFJ1bGU9J2V2ZW5vZGQnCiAgICAgIGQ9J004LjIyIDUuMjJhLjc1Ljc1IDAgMCAxIDEuMDYgMGw0LjI1IDQuMjVhLjc1Ljc1IDAgMCAxIDAgMS4wNmwtNC4yNSA0LjI1YS43NS43NSAwIDAgMS0xLjA2LTEuMDZMMTEuOTQgMTAgOC4yMiA2LjI4YS43NS43NSAwIDAgMSAwLTEuMDZaJwogICAgICBjbGlwUnVsZT0nZXZlbm9kZCcKICAgIC8+CiAgPC9zdmc+)}.elmethis-numbered-list li{box-sizing:border-box;padding-left:.25rem;margin-block:.75rem;margin-left:.25rem;list-style-type:decimal}.elmethis-numbered-list li::marker{font-weight:700;color:#9771bd}.elmethis-numbered-list li ol li{list-style-type:lower-alpha}.elmethis-numbered-list li ol li ol li{list-style-type:lower-roman}.elmethis-numbered-list li ol li ol li ol li{list-style-type:lower-greek}"));
+      document.head.appendChild(elementStyle);
+    }
+  } catch (e) {
+    console.error("vite-plugin-css-injected-by-js", e);
+  }
+})();
+import { defineComponent, ref, computed, watch, createElementBlock, openBlock, normalizeClass, Fragment, renderList, createBlock, resolveDynamicComponent, h } from "vue";
+import { marked } from "marked";
+import ElmInlineText from "../typography/ElmInlineText.vue.mjs";
+import ElmHeading from "../typography/ElmHeading.vue.mjs";
+import ElmParagraph from "../typography/ElmParagraph.vue.mjs";
+import _sfc_main$2 from "../typography/ElmList.vue.mjs";
+
+import ElmBlockQuote from "../typography/ElmBlockQuote.vue.mjs";
+import ElmDivider from "../typography/ElmDivider.vue.mjs";
+import ElmImage from "../media/ElmImage.vue.mjs";
+import ElmCodeBlock from "../code/ElmCodeBlock.vue.mjs";
+import ElmTable from "../table/ElmTable.vue.mjs";
+import ElmTableHeader from "../table/ElmTableHeader.vue.mjs";
+import _sfc_main$1 from "../table/ElmTableBody.vue.mjs";
+import ElmTableRow from "../table/ElmTableRow.vue.mjs";
+import ElmTableCell from "../table/ElmTableCell.vue.mjs";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "ElmMarkdown",
+  props: {
+    markdown: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const renderByToken = ({ tokens }) => {
+      const results = [];
+      for (const token of tokens) {
+        switch (token.type) {
+          case "blockquote":
+            if (token.tokens != null && token.tokens.length !== 0) {
+              results.push(
+                h(
+                  ElmBlockQuote,
+                  {},
+                  {
+                    default: () => renderByToken({ tokens: token.tokens })
+                  }
+                )
+              );
+            }
+            break;
+          case "br":
+            results.push(h("br"));
+            break;
+          case "code":
+            results.push(
+              h(ElmCodeBlock, {
+                code: token.text.trim(),
+                language: token.lang
+              })
+            );
+            break;
+          case "codespan":
+            results.push(h(ElmInlineText, { text: token.text, code: true }));
+            break;
+          case "def":
+            h("span", "aaa");
+            break;
+          case "del":
+            results.push(
+              token.tokens != null && token.tokens.length !== 0 ? h(
+                ElmInlineText,
+                { strikethrough: true },
+                {
+                  default: () => renderByToken({ tokens: token.tokens })
+                }
+              ) : h(ElmInlineText, { text: token.text, strikethrough: true })
+            );
+            break;
+          case "em":
+            results.push(
+              token.tokens != null && token.tokens.length !== 0 ? h(
+                ElmInlineText,
+                { italic: true },
+                {
+                  default: () => renderByToken({ tokens: token.tokens })
+                }
+              ) : h(ElmInlineText, { text: token.text, italic: true })
+            );
+            break;
+          case "escape":
+            break;
+          case "heading":
+            if (token.tokens && token.tokens.length !== 0) {
+              results.push(
+                h(
+                  ElmHeading,
+                  { level: token.depth },
+                  {
+                    default: () => renderByToken({ tokens: token.tokens })
+                  }
+                )
+              );
+            } else {
+              results.push(h(ElmHeading, { level: token.depth, text: token.text }));
+            }
+            break;
+          case "hr":
+            results.push(h(ElmDivider));
+            break;
+          case "html":
+            break;
+          case "image":
+            results.push(
+              h(ElmImage, {
+                block: true,
+                enableModal: true,
+                src: token.href,
+                alt: token.text
+              })
+            );
+            break;
+          case "link":
+            results.push(
+              token.tokens != null && token.tokens.length !== 0 ? h(ElmInlineText, {
+                text: token.text,
+                href: token.href
+              }) : h(ElmInlineText, { text: token.text, href: token.href })
+            );
+            break;
+          case "list":
+            const listItems = token.items.map(
+              (item) => h("li", {}, renderByToken({ tokens: item.tokens }))
+            );
+            results.push(
+              h(
+                _sfc_main$2,
+                {
+                  listStyle: token.ordered ? "ordered" : "unordered"
+                },
+                { default: () => listItems }
+              )
+            );
+            break;
+          case "list_item":
+            results.push(
+              token.tokens != null && token.tokens.length !== 0 ? h(
+                "li",
+                {},
+                {
+                  default: () => renderByToken({ tokens: token.tokens })
+                }
+              ) : h("li", { text: token.text })
+            );
+            break;
+          case "paragraph":
+            if (token.tokens && token.tokens.length !== 0) {
+              results.push(
+                h(
+                  ElmParagraph,
+                  {},
+                  {
+                    default: () => renderByToken({ tokens: token.tokens })
+                  }
+                )
+              );
+            }
+            break;
+          case "space":
+            break;
+          case "strong":
+            results.push(
+              token.tokens != null && token.tokens.length !== 0 ? h(
+                ElmInlineText,
+                { bold: true },
+                {
+                  default: () => renderByToken({ tokens: token.tokens })
+                }
+              ) : h(ElmInlineText, { text: token.text, bold: true })
+            );
+            break;
+          case "table":
+            const renderTableCells = ({
+              cells
+            }) => cells.map(
+              (cell) => h(
+                ElmTableCell,
+                {},
+                { default: () => renderByToken({ tokens: cell.tokens }) }
+              )
+            );
+            const headerRow = h(
+              ElmTableRow,
+              {},
+              { default: () => renderTableCells({ cells: token.header }) }
+            );
+            const bodyRows = token.rows.map(
+              (row) => h(
+                ElmTableRow,
+                {},
+                { default: () => renderTableCells({ cells: row }) }
+              )
+            );
+            const table = h(
+              ElmTable,
+              {},
+              {
+                header: () => h(ElmTableHeader, {}, { default: () => headerRow }),
+                body: () => h(_sfc_main$1, {}, { default: () => bodyRows })
+              }
+            );
+            results.push(table);
+            break;
+          case "text":
+            results.push(
+              token.tokens != null && token.tokens.length !== 0 ? h(
+                ElmInlineText,
+                {},
+                {
+                  default: () => renderByToken({ tokens: token.tokens })
+                }
+              ) : h(ElmInlineText, { text: token.text })
+            );
+            break;
+        }
+      }
+      return results;
+    };
+    const renderMarkdown = ({ markdown }) => {
+      const tokens = marked.setOptions({ gfm: true }).lexer(markdown);
+      return renderByToken({ tokens });
+    };
+    const renderResult = ref(renderMarkdown({ markdown: props.markdown }));
+    const components = computed(() => ({
+      render: () => renderResult.value
+    }));
+    watch(
+      () => props.markdown,
+      (md) => {
+        if (md != null) renderResult.value = renderMarkdown({ markdown: md });
+      }
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(_ctx.$style["markdown-body"])
+      }, [
+        (openBlock(true), createElementBlock(Fragment, null, renderList(components.value, (component) => {
+          return openBlock(), createBlock(resolveDynamicComponent(component));
+        }), 256))
+      ], 2);
+    };
+  }
+});
 export {
   _sfc_main as default
 };

package/dist/components/others/ElmMarkdown.vue3.mjs

@@ -0,0 +1,18 @@
+(function() {
+  "use strict";
+  try {
+    if (typeof document != "undefined") {
+      var elementStyle = document.createElement("style");
+      elementStyle.appendChild(document.createTextNode("._markdown-body_grhpg_1>*+*{margin-block-start:2em}"));
+      document.head.appendChild(elementStyle);
+    }
+  } catch (e) {
+    console.error("vite-plugin-css-injected-by-js", e);
+  }
+})();
+const style0 = {
+  "markdown-body": "_markdown-body_grhpg_1"
+};
+export {
+  style0 as default
+};

package/dist/components/typography/ElmInlineText.vue2.mjs

@@ -63,23 +63,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       let vnode = slots.default ? h(
         "span",
         {
-          class: [style.text, textStyle.text],
-          style: {
-            "--color": props.color ?? backgroundColor,
-            "--font-size": props.size,
-            "--background-color": props.backgroundColor
-          }
+          class: [style.text, textStyle.text]
         },
         { default: slots.default }
       ) : h(
         "span",
         {
-          class: [style.text, textStyle.text],
-          style: {
-            "--color": props.color ?? backgroundColor,
-            "--font-size": props.size,
-            "--background-color": props.backgroundColor
-          }
+          class: [style.text, textStyle.text]
         },
         props.text
       );
@@ -87,28 +77,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         vnode = h("kbd", { class: style.kbd }, vnode);
       }
       if (props.strikethrough) {
-        vnode = h(
-          "del",
-          {
-            class: style.del,
-            style: {
-              "--color": props.color ?? backgroundColor
-            }
-          },
-          vnode
-        );
+        vnode = h("del", {}, vnode);
       }
       if (props.italic) {
-        vnode = h(
-          "em",
-          {
-            class: style.em,
-            style: {
-              "--color": props.color ?? backgroundColor
-            }
-          },
-          vnode
-        );
+        vnode = h("em", {}, vnode);
       }
       if (props.underline) {
         vnode = h("ins", {}, vnode);
@@ -123,17 +95,24 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         vnode = h(
           "ruby",
           {
-            class: style.text,
-            style: {
-              "--color": props.color ?? backgroundColor,
-              "--font-size": props.size,
-              "--background-color": props.backgroundColor
-            }
+            class: style.text
           },
           [h("span", {}, vnode), h("rt", {}, props.ruby)]
         );
       }
-      return vnode;
+      const wrappedVnode = h(
+        "span",
+        {
+          class: [style.text, textStyle.text],
+          style: {
+            "--color": props.color ?? backgroundColor,
+            "--font-size": props.size,
+            "--background-color": props.backgroundColor
+          }
+        },
+        [vnode]
+      );
+      return wrappedVnode;
     };
     return (_ctx, _cache) => {
       const _component_ElmInlineText = resolveComponent("ElmInlineText", true);

package/dist/components/typography/ElmInlineText.vue3.mjs

@@ -3,37 +3,31 @@
   try {
     if (typeof document != "undefined") {
       var elementStyle = document.createElement("style");
-      elementStyle.appendChild(document.createTextNode('._text_vgrys_1{padding:0;margin:0;white-space:pre-line;font-size:1em;font-size:var(--font-size, 1em);line-height:1em;line-height:var(--font-size, 1em);background-color:var(--background-color);transition:color .2s}._del_vgrys_11,._em_vgrys_15{text-decoration-color:var(--color)}._code_vgrys_19{margin-inline:.25rem;padding:2px .5em;font-size:calc(1em - 2px);border-radius:.125rem;background-color:#00000013;font-family:"Source Code Pro" monospace}._kbd_vgrys_28{padding:.125rem .25rem;position:relative;border-radius:.125rem;background-color:#e6e6e6}[data-theme=dark] ._kbd_vgrys_28{background-color:#404040}._kbd_vgrys_28:before{z-index:-1;position:absolute;content:"";bottom:-.25em;left:0;height:100%;width:100%;background-color:#ccc;border-radius:0 0 .125rem .125rem;box-shadow:0 0 .125em #00000080}[data-theme=dark] ._kbd_vgrys_28:before{background-color:#595959;box-shadow:0 0 .125em #ffffff80}._link_vgrys_54{all:unset;box-sizing:border-box;padding:0 .25rem;font-size:var(--font-size);display:inline-flex;align-items:center;gap:.25rem;cursor:pointer;color:#6987b8;border-radius:.125rem;transition:background-color .2s,color .2s,opacity .2s}._link_vgrys_54:hover{background-color:#6987b833}._link_vgrys_54:active{opacity:.5}._link_vgrys_54:visited{color:#9771bd;border-bottom:dashed 1px #9771bd}._link_vgrys_54:visited:hover{background-color:#9771bd33}._ogp_vgrys_81{display:flex;flex-direction:column;gap:.25rem;overflow:hidden;border-radius:.25rem;box-shadow:0 0 .125rem #0000004d;background-color:#fffc}[data-theme=dark] ._ogp_vgrys_81{background-color:#ffffff1a}._ogp-text_vgrys_94{box-sizing:border-box;padding:.5rem}._ogp-title_vgrys_99{box-sizing:border-box;font-weight:700;padding-block-end:.25rem}._ogp-description_vgrys_105{opacity:.7;padding:.25rem}'));
+      elementStyle.appendChild(document.createTextNode('._text_1gswr_1{padding:0;margin:0;white-space:pre-line;font-size:1em;font-size:var(--font-size, 1em);line-height:1em;line-height:var(--font-size, 1em);background-color:var(--background-color);transition:color .2s;text-decoration-color:var(--color)}._code_1gswr_12{margin-inline:.25rem;padding:2px .5em;font-size:calc(1em - 2px);border-radius:.125rem;background-color:#00000013;font-family:"Source Code Pro" monospace}._kbd_1gswr_21{padding:.125rem .25rem;position:relative;border-radius:.125rem;background-color:#e6e6e6}[data-theme=dark] ._kbd_1gswr_21{background-color:#404040}._kbd_1gswr_21:before{z-index:-1;position:absolute;content:"";bottom:-.25em;left:0;height:100%;width:100%;background-color:#ccc;border-radius:0 0 .125rem .125rem;box-shadow:0 0 .125em #00000080}[data-theme=dark] ._kbd_1gswr_21:before{background-color:#595959;box-shadow:0 0 .125em #ffffff80}._link_1gswr_47{all:unset;box-sizing:border-box;padding:0 .25rem;font-size:var(--font-size);display:inline-flex;align-items:center;gap:.25rem;cursor:pointer;color:#6987b8;border-radius:.125rem;transition:background-color .2s,color .2s,opacity .2s}._link_1gswr_47:hover{background-color:#6987b833}._link_1gswr_47:active{opacity:.5}._link_1gswr_47:visited{color:#9771bd;border-bottom:dashed 1px #9771bd}._link_1gswr_47:visited:hover{background-color:#9771bd33}._ogp_1gswr_74{display:flex;flex-direction:column;gap:.25rem;overflow:hidden;border-radius:.25rem;box-shadow:0 0 .125rem #0000004d;background-color:#fffc}[data-theme=dark] ._ogp_1gswr_74{background-color:#ffffff1a}._ogp-text_1gswr_87{box-sizing:border-box;padding:.5rem}._ogp-title_1gswr_92{box-sizing:border-box;font-weight:700;padding-block-end:.25rem}._ogp-description_1gswr_98{opacity:.7;padding:.25rem}'));
       document.head.appendChild(elementStyle);
     }
   } catch (e) {
     console.error("vite-plugin-css-injected-by-js", e);
   }
 })();
-const text = "_text_vgrys_1";
-const del = "_del_vgrys_11";
-const em = "_em_vgrys_15";
-const code = "_code_vgrys_19";
-const kbd = "_kbd_vgrys_28";
-const link = "_link_vgrys_54";
-const ogp = "_ogp_vgrys_81";
+const text = "_text_1gswr_1";
+const code = "_code_1gswr_12";
+const kbd = "_kbd_1gswr_21";
+const link = "_link_1gswr_47";
+const ogp = "_ogp_1gswr_74";
 const style0 = {
   text,
-  del,
-  em,
   code,
   kbd,
   link,
   ogp,
-  "ogp-text": "_ogp-text_vgrys_94",
-  "ogp-title": "_ogp-title_vgrys_99",
-  "ogp-description": "_ogp-description_vgrys_105"
+  "ogp-text": "_ogp-text_1gswr_87",
+  "ogp-title": "_ogp-title_1gswr_92",
+  "ogp-description": "_ogp-description_1gswr_98"
 };
 export {
   code,
   style0 as default,
-  del,
-  em,
   kbd,
   link,
   ogp,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elmethis/vue",
-  "version": "0.2.10",
+  "version": "0.2.12",
   "publishConfig": {
     "access": "public"
   },
@@ -24,32 +24,32 @@
   },
   "dependencies": {
     "@mdi/js": "^7.4.47",
-    "@vueuse/core": "^14.1.0",
+    "@vueuse/core": "^14.2.1",
     "fuse.js": "^7.1.0",
     "katex": "^0.16.28",
     "lodash-es": "^4.17.23",
-    "marked": "^17.0.1",
-    "mermaid": "^11.12.2",
+    "marked": "^17.0.3",
+    "mermaid": "^11.12.3",
     "nanoid": "^5.1.6",
     "polished": "^4.3.1",
-    "shiki": "^3.21.0"
+    "shiki": "^3.22.0"
   },
   "devDependencies": {
-    "@ag-ui/core": "^0.0.43",
+    "@ag-ui/core": "^0.0.45",
     "@notionhq/client": "^5.9.0",
-    "storybook": "^10.2.2",
-    "@storybook/addon-docs": "^10.2.2",
-    "@storybook/vue3-vite": "10.2.2",
+    "storybook": "^10.2.10",
+    "@storybook/addon-docs": "^10.2.10",
+    "@storybook/vue3-vite": "10.2.10",
     "@types/json-schema": "^7.0.15",
     "@types/katex": "^0.16.8",
     "@types/lodash-es": "^4.17.12",
-    "@types/prismjs": "^1.26.5",
-    "@vitejs/plugin-vue": "^6.0.3",
+    "@types/prismjs": "^1.26.6",
+    "@vitejs/plugin-vue": "^6.0.4",
     "csstype": "^3.2.3",
     "jarkup-ts": "^0.6.0",
     "openapi-types": "^12.1.3",
     "postcss": "^8.5.6",
-    "postcss-preset-env": "^11.1.2",
+    "postcss-preset-env": "^11.1.3",
     "sass": "^1.97.3",
     "vite": "^7.3.1",
     "vite-plugin-css-injected-by-js": "^3.5.2",