@type32/codemirror-rich-obsidian-editor 0.1.9 → 0.1.14

package/dist/module.json

@@ -1,7 +1,7 @@
 {
-  "name": "@type32/yaml-editor-form",
-  "configKey": "yamlEditorForm",
-  "version": "0.1.9",
+  "name": "@type32/codemirror-rich-obsidian-editor",
+  "configKey": "cmOfmEditor",
+  "version": "0.1.14",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/module.mjs

@@ -2,23 +2,26 @@ import { defineNuxtModule, createResolver, addComponentsDir, addImportsDir } fro
 
 const module$1 = defineNuxtModule({
   meta: {
-    name: "@type32/yaml-editor-form",
-    configKey: "yamlEditorForm"
+    name: "@type32/codemirror-rich-obsidian-editor",
+    configKey: "cmOfmEditor"
   },
   // Default configuration options of the Nuxt module
   defaults: {},
   setup(_options, _nuxt) {
     const resolver = createResolver(import.meta.url);
-    addComponentsDir({ path: resolver.resolve("runtime/components") });
+    addComponentsDir({
+      path: resolver.resolve("runtime/components")
+    });
     addImportsDir(resolver.resolve("runtime/composables"));
-    _nuxt.options.build.transpile.push("js-yaml");
-    _nuxt.options.alias["@type32/yaml-editor-form"] = resolver.resolve(
-      "./runtime/types/types"
+    addImportsDir(resolver.resolve("runtime/utils"));
+    _nuxt.options.build.transpile.push("alfaaz", "js-yaml");
+    _nuxt.options.alias["#codemirror-rich-obsidian-editor"] = resolver.resolve(
+      "./runtime/editor/types"
     );
-    _nuxt.options.alias["@type32/yaml-editor-form"] = resolver.resolve(
+    _nuxt.options.alias["#codemirror-rich-obsidian-editor#css"] = resolver.resolve(
       "./runtime/assets/css"
     );
-    _nuxt.options.css.unshift(resolver.resolve("./runtime/assets/css/main.css"));
+    _nuxt.options.css.unshift(resolver.resolve("./runtime/assets/css/editor.css"));
   }
 });
 

package/dist/runtime/assets/css/editor.css

@@ -0,0 +1 @@
+@import url("https://fonts.cdnfonts.com/css/segoe-ui-variable-static-display");@import url("https://fonts.cdnfonts.com/css/sf-pro-display");@import "katex/dist/katex.min.css";@import "tailwindcss";@import "@nuxt/ui";@theme{--font-sans:"Public Sans","Inter","SF Pro Display","Segoe UI Variable Static Display",sans-serif;--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--font-editor:"Inter","SF Pro Display","Segoe UI Variable Static Display",var(--font-sans,sans-serif);--font-editor-code:"Google Sans Code","JetBrains Mono","Consolas",var(--font-mono,ui-monospace);--list-indent:1.5rem;--indent-level:0}.cm-code-editor{@apply font-editor-code}.cm-code-editor .cm-content,.cm-code-editor .cm-placeholder{@apply font-editor-code text-sm}.cm-code-editor .cm-editor{@apply bg-default}.cm-code-editor .cm-placeholder{@apply text-dimmed}.cm-code-editor .cm-gutters,.cm-code-editor .cm-gutters-before{@apply bg-default text-muted text-sm border-r border-r-accented font-editor-code}.cm-code-editor .cm-activeLineGutter{@apply bg-elevated}.cm-code-editor .cm-activeLine{@apply bg-muted}.cm-code-editor .cm-foldPlaceholder{@apply bg-elevated border border-default font-editor-code text-muted}.cm-rich-editor{@apply font-editor}.cm-rich-editor .cm-activeLine{@apply after:absolute after:left-0 after:border-primary after:border after:rounded-lg after:h-full after:top-0 -z-10 bg-inherit}.cm-rich-editor .cm-content{@apply font-editor}.cm-rich-editor .katex-display{@apply m-0 pointer-events-none}.cm-rich-editor .katex-display .katex,.cm-rich-editor .katex-display .katex-html{@apply pointer-events-none}.cm-rich-editor .cm-escape,.cm-rich-editor .cm-meta{@apply text-dimmed! no-underline!}.cm-rich-editor .cm-heading{text-decoration:none!important}.cm-rich-editor .cm-mono{@apply font-editor-code bg-muted px-1 rounded-lg border border-default text-toned!}.cm-rich-editor .cm-hashtag{@apply bg-gradient-to-t from-primary/20! to-primary/10! ring ring-primary/50! px-1.5 text-sm rounded-4xl text-primary! inline-flex}.cm-rich-editor .cm-hashtag .cm-heading{@apply text-primary!}.cm-rich-editor .cm-highlighted{@apply bg-primary/20 text-primary px-0.5 rounded-sm}.cm-rich-editor .cm-internal-link-display,.cm-rich-editor .cm-internal-link-path,.cm-rich-editor .cm-internal-link-subpath,.cm-rich-editor .cm-link{@apply text-primary! underline}.cm-rich-editor .cm-internal-link-display[data-type=internal-link],.cm-rich-editor .cm-internal-link-path[data-type=internal-link],.cm-rich-editor .cm-internal-link-subpath[data-type=internal-link],.cm-rich-editor .cm-link[data-type=internal-link]{@apply cursor-pointer}.cm-rich-editor .cm-clickable-link{@apply cursor-pointer}.cm-rich-editor .cm-unresolved-link .cm-internal-link-display,.cm-rich-editor .cm-unresolved-link .cm-internal-link-path,.cm-rich-editor .cm-unresolved-link .cm-internal-link-subpath,.cm-rich-editor .cm-unresolved-link .cm-link{@apply text-error/75! cursor-not-allowed}.cm-rich-editor .cm-codeblock,.cm-rich-editor .cm-line-codeblock-begin,.cm-rich-editor .cm-line-codeblock-end{@apply font-editor-code py-0 my-0 text-sm! font-semibold border-x border-x-default mx-2 px-3 bg-muted relative}.cm-rich-editor .cm-codeblock .cm-codeblock-flair-container,.cm-rich-editor .cm-line-codeblock-begin .cm-codeblock-flair-container,.cm-rich-editor .cm-line-codeblock-end .cm-codeblock-flair-container{@apply absolute top-2 right-2 overflow-visible z-10}.cm-rich-editor .cm-codeblock .cm-codeblock-flair-container .cm-codeblock-copy-button,.cm-rich-editor .cm-line-codeblock-begin .cm-codeblock-flair-container .cm-codeblock-copy-button,.cm-rich-editor .cm-line-codeblock-end .cm-codeblock-flair-container .cm-codeblock-copy-button{@apply rounded hover:bg-accented transition duration-200 cursor-pointer py-1.5 px-2 font-sans text-dimmed z-10}.cm-rich-editor .cm-codeblock .cm-mono,.cm-rich-editor .cm-line-codeblock-begin .cm-mono,.cm-rich-editor .cm-line-codeblock-end .cm-mono{@apply border-none bg-none text-default}.cm-rich-editor .cm-line-codeblock-content{@apply border-x border-x-accented}.cm-rich-editor .cm-line-codeblock-begin{@apply rounded-t-lg border-t border-x border-t-accented border-x-accented pt-1 px-1}.cm-rich-editor .cm-line-codeblock-end{@apply rounded-b-lg border-b border-x border-b-accented border-x-accented pb-1 px-1}.cm-rich-editor .cm-task-checkbox-wrapper{@apply size-4 mb-0.5 rounded-xl border border-default bg-default inline-flex items-center justify-center align-middle cursor-pointer}.cm-rich-editor .cm-task-checkbox-wrapper[data-checked=true]{@apply bg-primary border border-primary}.cm-rich-editor .cm-task-checkbox-wrapper[data-checked=true]:before{content:"✔";@apply text-xs text-inverted}.cm-rich-editor .cm-task-checkbox-wrapper[data-special]{@apply font-editor-code text-xs text-highlighted}.cm-rich-editor .cm-task-checked{@apply line-through text-dimmed}.cm-rich-editor .cm-tooltip{@apply rounded-lg bg-default/70 shadow-lg backdrop-blur-sm border border-default font-sans p-2}.cm-rich-editor .cm-tooltip ul{@apply grid grid-cols-1 font-sans}.cm-rich-editor .cm-tooltip ul li{@apply grid grid-cols-1 rounded font-sans gap-1}.cm-rich-editor .cm-tooltip ul li .cm-completionLabel{@apply mx-1 mt-1 text-toned}.cm-rich-editor .cm-tooltip ul li .cm-completionDetail{@apply text-xs font-editor-code bg-elevated w-fit rounded text-muted px-1 mb-1}.cm-rich-editor .cm-tooltip ul li[aria-selected=true]{@apply bg-accented/70 backdrop-blur-sm border border-accented}.cm-rich-editor .cm-fold-widget{@apply absolute -left-0.5 pt-1}.cm-rich-editor .cm-gutter,.cm-rich-editor .cm-gutters{@apply bg-transparent! border-none}.cm-rich-editor .cm-foldPlaceholder{@apply bg-accented! text-dimmed! border border-none ml-0.5 h-fit inline-flex items-center justify-center align-middle}.cm-rich-editor .cm-gutterElement{@apply inline-flex justify-center items-center}.cm-rich-editor .cm-heading-1{@apply text-4xl! text-highlighted scroll-mt-[calc(45px+var(--ui-header-height))]}.cm-rich-editor .cm-heading-2{@apply text-2xl! text-highlighted scroll-mt-[calc(45px+var(--ui-header-height))]}.cm-rich-editor .cm-heading-3{@apply text-xl! text-highlighted scroll-mt-[calc(45px+var(--ui-header-height))]}.cm-rich-editor .cm-heading-4{@apply text-lg! text-highlighted scroll-mt-[calc(45px+var(--ui-header-height))]}.cm-rich-editor .cm-quoteblock,.cm-rich-editor blockquote{@apply bg-muted border-accented ps-2 mx-2 before:ml-0.5 before:rounded-lg before:px-0.5 before:bg-accented before:py-1}.cm-rich-editor .cm-quoteblock.cm-quoteblock-single,.cm-rich-editor blockquote.cm-quoteblock-single{@apply rounded-lg py-2 before:py-0.5}.cm-rich-editor .cm-quoteblock.cm-quoteblock-start,.cm-rich-editor blockquote.cm-quoteblock-start{@apply rounded-t-lg pt-2 before:pt-0}.cm-rich-editor .cm-quoteblock.cm-quoteblock-end,.cm-rich-editor blockquote.cm-quoteblock-end{@apply rounded-b-lg pb-2 before:pb-0}.cm-rich-editor .cm-quoteblock .cm-formatting-quote.cm-meta,.cm-rich-editor blockquote .cm-formatting-quote.cm-meta{@apply invisible}.cm-rich-editor .cm-quoteblock .cm-formatting-quote-active.cm-meta,.cm-rich-editor blockquote .cm-formatting-quote-active.cm-meta{@apply visible!}.cm-rich-editor .cm-obsidian-bullet{@apply text-transparent}.cm-rich-editor .cm-obsidian-bullet .cm-meta{@apply invisible}.cm-rich-editor .cm-obsidian-bullet:before{content:"•";@apply text-dimmed absolute}.cm-rich-editor .callout,.cm-rich-editor .cm-callout-widget{@apply p-3 relative flex flex-col h-fit rounded-xl border border-primary/20 from-primary/10 to-primary/20 bg-gradient-to-b}.cm-rich-editor .callout summary,.cm-rich-editor .cm-callout-widget summary{@apply inline-flex}.cm-rich-editor .callout .callout-title,.cm-rich-editor .cm-callout-widget .callout-title{@apply flex gap-1.5 items-center}.cm-rich-editor .callout .callout-title .callout-title-icon,.cm-rich-editor .cm-callout-widget .callout-title .callout-title-icon{@apply flex size-4 items-center justify-center fill-primary text-primary}.cm-rich-editor .callout .callout-title .callout-title-inner,.cm-rich-editor .cm-callout-widget .callout-title .callout-title-inner{@apply text-primary text-lg font-bold flex-grow}.cm-rich-editor .callout .callout-title .edit-block-button,.cm-rich-editor .cm-callout-widget .callout-title .edit-block-button{@apply rounded hover:bg-elevated transition duration-200 cursor-pointer p-1 font-sans right-0 top-0 text-dimmed}.cm-rich-editor .callout .callout-content,.cm-rich-editor .cm-callout-widget .callout-content{@apply flex flex-col gap-1}.cm-rich-editor .callout[data-callout=info],.cm-rich-editor .cm-callout-widget[data-callout=info]{@apply from-info/10 to-info/20 bg-gradient-to-b border-info/20}.cm-rich-editor .callout[data-callout=info] .callout-fold,.cm-rich-editor .cm-callout-widget[data-callout=info] .callout-fold{@apply text-info-400}.cm-rich-editor .callout[data-callout=info] .callout-title .callout-title-icon,.cm-rich-editor .callout[data-callout=info] .callout-title .callout-title-inner,.cm-rich-editor .cm-callout-widget[data-callout=info] .callout-title .callout-title-icon,.cm-rich-editor .cm-callout-widget[data-callout=info] .callout-title .callout-title-inner{@apply text-info}.cm-rich-editor .callout[data-callout=check],.cm-rich-editor .callout[data-callout=done],.cm-rich-editor .callout[data-callout=success],.cm-rich-editor .cm-callout-widget[data-callout=check],.cm-rich-editor .cm-callout-widget[data-callout=done],.cm-rich-editor .cm-callout-widget[data-callout=success]{@apply from-success/10 to-success/20 bg-gradient-to-b border-success/20}.cm-rich-editor .callout[data-callout=check] .callout-fold,.cm-rich-editor .callout[data-callout=done] .callout-fold,.cm-rich-editor .callout[data-callout=success] .callout-fold,.cm-rich-editor .cm-callout-widget[data-callout=check] .callout-fold,.cm-rich-editor .cm-callout-widget[data-callout=done] .callout-fold,.cm-rich-editor .cm-callout-widget[data-callout=success] .callout-fold{@apply text-success-400}.cm-rich-editor .callout[data-callout=check] .callout-title .callout-title-icon,.cm-rich-editor .callout[data-callout=check] .callout-title .callout-title-inner,.cm-rich-editor .callout[data-callout=done] .callout-title .callout-title-icon,.cm-rich-editor .callout[data-callout=done] .callout-title .callout-title-inner,.cm-rich-editor .callout[data-callout=success] .callout-title .callout-title-icon,.cm-rich-editor .callout[data-callout=success] .callout-title .callout-title-inner,.cm-rich-editor .cm-callout-widget[data-callout=check] .callout-title .callout-title-icon,.cm-rich-editor .cm-callout-widget[data-callout=check] .callout-title .callout-title-inner,.cm-rich-editor .cm-callout-widget[data-callout=done] .callout-title .callout-title-icon,.cm-rich-editor .cm-callout-widget[data-callout=done] .callout-title .callout-title-inner,.cm-rich-editor .cm-callout-widget[data-callout=success] .callout-title .callout-title-icon,.cm-rich-editor .cm-callout-widget[data-callout=success] .callout-title .callout-title-inner{@apply text-success}.cm-rich-editor .callout[data-callout=faq],.cm-rich-editor .callout[data-callout=help],.cm-rich-editor .callout[data-callout=question],.cm-rich-editor .callout[data-callout=warning],.cm-rich-editor .cm-callout-widget[data-callout=faq],.cm-rich-editor .cm-callout-widget[data-callout=help],.cm-rich-editor .cm-callout-widget[data-callout=question],.cm-rich-editor .cm-callout-widget[data-callout=warning]{@apply from-warning/10 to-warning/20 bg-gradient-to-b border-warning/20}.cm-rich-editor .callout[data-callout=faq] .callout-fold,.cm-rich-editor .callout[data-callout=help] .callout-fold,.cm-rich-editor .callout[data-callout=question] .callout-fold,.cm-rich-editor .callout[data-callout=warning] .callout-fold,.cm-rich-editor .cm-callout-widget[data-callout=faq] .callout-fold,.cm-rich-editor .cm-callout-widget[data-callout=help] .callout-fold,.cm-rich-editor .cm-callout-widget[data-callout=question] .callout-fold,.cm-rich-editor .cm-callout-widget[data-callout=warning] .callout-fold{@apply text-warning-400}.cm-rich-editor .callout[data-callout=faq] .callout-title .callout-title-icon,.cm-rich-editor .callout[data-callout=faq] .callout-title .callout-title-inner,.cm-rich-editor .callout[data-callout=help] .callout-title .callout-title-icon,.cm-rich-editor .callout[data-callout=help] .callout-title .callout-title-inner,.cm-rich-editor .callout[data-callout=question] .callout-title .callout-title-icon,.cm-rich-editor .callout[data-callout=question] .callout-title .callout-title-inner,.cm-rich-editor .callout[data-callout=warning] .callout-title .callout-title-icon,.cm-rich-editor .callout[data-callout=warning] .callout-title .callout-title-inner,.cm-rich-editor .cm-callout-widget[data-callout=faq] .callout-title .callout-title-icon,.cm-rich-editor .cm-callout-widget[data-callout=faq] .callout-title .callout-title-inner,.cm-rich-editor .cm-callout-widget[data-callout=help] .callout-title .callout-title-icon,.cm-rich-editor .cm-callout-widget[data-callout=help] .callout-title .callout-title-inner,.cm-rich-editor .cm-callout-widget[data-callout=question] .callout-title .callout-title-icon,.cm-rich-editor .cm-callout-widget[data-callout=question] .callout-title .callout-title-inner,.cm-rich-editor .cm-callout-widget[data-callout=warning] .callout-title .callout-title-icon,.cm-rich-editor .cm-callout-widget[data-callout=warning] .callout-title .callout-title-inner{@apply text-warning}.cm-rich-editor .callout[data-callout=bug],.cm-rich-editor .callout[data-callout=error],.cm-rich-editor .callout[data-callout=failure],.cm-rich-editor .cm-callout-widget[data-callout=bug],.cm-rich-editor .cm-callout-widget[data-callout=error],.cm-rich-editor .cm-callout-widget[data-callout=failure]{@apply from-error/10 to-error/20 bg-gradient-to-b border-error/20}.cm-rich-editor .callout[data-callout=bug] .callout-fold,.cm-rich-editor .callout[data-callout=error] .callout-fold,.cm-rich-editor .callout[data-callout=failure] .callout-fold,.cm-rich-editor .cm-callout-widget[data-callout=bug] .callout-fold,.cm-rich-editor .cm-callout-widget[data-callout=error] .callout-fold,.cm-rich-editor .cm-callout-widget[data-callout=failure] .callout-fold{@apply text-error-400}.cm-rich-editor .callout[data-callout=bug] .callout-title .callout-title-icon,.cm-rich-editor .callout[data-callout=bug] .callout-title .callout-title-inner,.cm-rich-editor .callout[data-callout=error] .callout-title .callout-title-icon,.cm-rich-editor .callout[data-callout=error] .callout-title .callout-title-inner,.cm-rich-editor .callout[data-callout=failure] .callout-title .callout-title-icon,.cm-rich-editor .callout[data-callout=failure] .callout-title .callout-title-inner,.cm-rich-editor .cm-callout-widget[data-callout=bug] .callout-title .callout-title-icon,.cm-rich-editor .cm-callout-widget[data-callout=bug] .callout-title .callout-title-inner,.cm-rich-editor .cm-callout-widget[data-callout=error] .callout-title .callout-title-icon,.cm-rich-editor .cm-callout-widget[data-callout=error] .callout-title .callout-title-inner,.cm-rich-editor .cm-callout-widget[data-callout=failure] .callout-title .callout-title-icon,.cm-rich-editor .cm-callout-widget[data-callout=failure] .callout-title .callout-title-inner{@apply text-error}.cm-rich-editor .callout[data-callout=example],.cm-rich-editor .callout[data-callout=highlight],.cm-rich-editor .callout[data-callout=tip],.cm-rich-editor .cm-callout-widget[data-callout=example],.cm-rich-editor .cm-callout-widget[data-callout=highlight],.cm-rich-editor .cm-callout-widget[data-callout=tip]{@apply from-secondary/10 to-secondary/20 bg-gradient-to-b border-secondary/20}.cm-rich-editor .callout[data-callout=example] .callout-fold,.cm-rich-editor .callout[data-callout=highlight] .callout-fold,.cm-rich-editor .callout[data-callout=tip] .callout-fold,.cm-rich-editor .cm-callout-widget[data-callout=example] .callout-fold,.cm-rich-editor .cm-callout-widget[data-callout=highlight] .callout-fold,.cm-rich-editor .cm-callout-widget[data-callout=tip] .callout-fold{@apply text-secondary}.cm-rich-editor .callout[data-callout=example] .callout-title .callout-title-icon,.cm-rich-editor .callout[data-callout=example] .callout-title .callout-title-inner,.cm-rich-editor .callout[data-callout=highlight] .callout-title .callout-title-icon,.cm-rich-editor .callout[data-callout=highlight] .callout-title .callout-title-inner,.cm-rich-editor .callout[data-callout=tip] .callout-title .callout-title-icon,.cm-rich-editor .callout[data-callout=tip] .callout-title .callout-title-inner,.cm-rich-editor .cm-callout-widget[data-callout=example] .callout-title .callout-title-icon,.cm-rich-editor .cm-callout-widget[data-callout=example] .callout-title .callout-title-inner,.cm-rich-editor .cm-callout-widget[data-callout=highlight] .callout-title .callout-title-icon,.cm-rich-editor .cm-callout-widget[data-callout=highlight] .callout-title .callout-title-inner,.cm-rich-editor .cm-callout-widget[data-callout=tip] .callout-title .callout-title-icon,.cm-rich-editor .cm-callout-widget[data-callout=tip] .callout-title .callout-title-inner{@apply text-secondary}.cm-rich-editor .callout[data-callout=neutral],.cm-rich-editor .callout[data-callout=quote],.cm-rich-editor .cm-callout-widget[data-callout=neutral],.cm-rich-editor .cm-callout-widget[data-callout=quote]{@apply from-accented/20 to-accented/30 bg-gradient-to-b border-accented/30}.cm-rich-editor .callout[data-callout=neutral] .callout-fold,.cm-rich-editor .callout[data-callout=quote] .callout-fold,.cm-rich-editor .cm-callout-widget[data-callout=neutral] .callout-fold,.cm-rich-editor .cm-callout-widget[data-callout=quote] .callout-fold{@apply text-highlighted}.cm-rich-editor .callout[data-callout=neutral] .callout-title .callout-title-icon,.cm-rich-editor .callout[data-callout=neutral] .callout-title .callout-title-inner,.cm-rich-editor .callout[data-callout=quote] .callout-title .callout-title-icon,.cm-rich-editor .callout[data-callout=quote] .callout-title .callout-title-inner,.cm-rich-editor .cm-callout-widget[data-callout=neutral] .callout-title .callout-title-icon,.cm-rich-editor .cm-callout-widget[data-callout=neutral] .callout-title .callout-title-inner,.cm-rich-editor .cm-callout-widget[data-callout=quote] .callout-title .callout-title-icon,.cm-rich-editor .cm-callout-widget[data-callout=quote] .callout-title .callout-title-inner{@apply text-highlighted}.cm-rich-editor .callout .callout-fold,.cm-rich-editor .cm-callout-widget .callout-fold{@apply rounded hover:bg-elevated transition duration-200 cursor-pointer text-primary font-sans text-center align-middle p-1 size-6}.cm-rich-editor .callout .callout-fold svg,.cm-rich-editor .cm-callout-widget .callout-fold svg{@apply transition-transform duration-300 ease-in-out w-full h-full}.cm-rich-editor .callout[open] .callout-fold svg,.cm-rich-editor .cm-callout-widget[open] .callout-fold svg{@apply transition-transform duration-300 ease-in-out rotate-90 w-full h-full}.cm-rich-editor .callout[data-fold-state=closed] .callout-content,.cm-rich-editor .cm-callout-widget[data-fold-state=closed] .callout-content{@apply max-h-0 opacity-0 p-0}.cm-rich-editor .callout[data-fold-state=open] .callout-content,.cm-rich-editor .cm-callout-widget[data-fold-state=open] .callout-content{@apply max-h-none opacity-100 py-1 mt-1}.cm-rich-editor .callout .edit-block-button,.cm-rich-editor .cm-callout-widget .edit-block-button{@apply rounded hover:bg-elevated transition duration-200 cursor-pointer p-1 font-sans text-dimmed}.cm-rich-editor .callout .editing-utils-container,.cm-rich-editor .cm-callout-widget .editing-utils-container{@apply top-2 right-2 font-sans text-dimmed absolute flex items-center justify-center gap-1 p-1}.cm-rich-editor details .callout-content{@apply -mt-11}.cm-rich-editor .cm-indent{min-width:var(--list-indent,1.5rem);@apply relative inline-block}.cm-rich-editor .cm-indent:before{@apply content-["\200B"] absolute top-0 bottom-0 w-1;@apply border-r border-r-muted;@apply left-[var(--indentation-guide-source-indent)]}.cm-rich-editor .cm-indent-group .cm-active-indent:before{@apply border-primary}.cm-rich-editor .cm-list-line .cm-indent:before{@apply top-0}.cm-rich-editor .cm-list-internal[style*="--indent-level"]{@apply border-primary;padding-inline-start:calc(var(--indent-level)*var(--list-indent));text-indent:calc(var(--indent-level)*var(--list-indent))}.cm-rich-editor .cm-indent-list-bullet:before{content:"•";@apply text-dimmed border-none absolute;left:1rem}.cm-rich-editor .cm-indent-list-bullet+.cm-obsidian-bullet{@apply hidden}.cm-rich-editor .cm-obsidian-hidden{@apply hidden}.cm-rich-editor .cm-hidden-latex{@apply hidden}.cm-rich-editor .cm-yaml-content,.cm-rich-editor .cm-yaml-marker{@apply font-editor-code text-muted px-1}.cm-rich-editor .cm-line.hr{@apply h-8 flex items-center}.cm-rich-editor .cm-line.hr:after{content:"";@apply block w-full h-px bg-accented}

package/dist/runtime/components/CodeEditor.client.d.vue.ts

@@ -0,0 +1,38 @@
+import { EditorView } from '@codemirror/view';
+import type { Extension } from '@codemirror/state';
+import type { SearchOptions } from '#codemirror-rich-obsidian-editor/editor-types';
+type __VLS_Props = {
+    class?: string;
+    language?: string;
+    bracketClosing?: boolean;
+    foldGutter?: boolean;
+    disabled?: boolean;
+    debug?: boolean;
+    searchOptions?: SearchOptions;
+    /**
+     * Custom theme for light mode. Defaults to Catppuccin Latte.
+     * Pass a CodeMirror Extension (e.g., from @codemirror/theme-one-dark)
+     */
+    lightTheme?: Extension;
+    /**
+     * Custom theme for dark mode. Defaults to Catppuccin Mocha.
+     * Pass a CodeMirror Extension (e.g., from @codemirror/theme-one-dark)
+     */
+    darkTheme?: Extension;
+    colorMode?: string;
+};
+type __VLS_ModelProps = {
+    modelValue?: string;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {
+    view: import("vue").ShallowRef<EditorView | undefined, EditorView | undefined>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: string | undefined) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string | undefined) => any) | undefined;
+}>, {
+    colorMode: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/CodeEditor.client.vue

@@ -0,0 +1,207 @@
+<script setup>
+import CodeMirror from "vue-codemirror6";
+import {
+  EditorView,
+  drawSelection,
+  rectangularSelection,
+  highlightActiveLine,
+  highlightActiveLineGutter,
+  lineNumbers,
+  highlightSpecialChars,
+  dropCursor,
+  crosshairCursor,
+  keymap
+} from "@codemirror/view";
+import { history, historyKeymap, defaultKeymap } from "@codemirror/commands";
+import {
+  defaultHighlightStyle,
+  syntaxHighlighting,
+  indentOnInput,
+  foldGutter,
+  syntaxTree,
+  bracketMatching,
+  foldKeymap
+} from "@codemirror/language";
+import { Compartment, EditorState } from "@codemirror/state";
+import {} from "@codemirror/language";
+import { languages } from "@codemirror/language-data";
+import { ref, shallowRef, onMounted, watch, computed } from "vue";
+import { autocompletion, closeBrackets, closeBracketsKeymap, completionKeymap } from "@codemirror/autocomplete";
+import { highlightSelectionMatches, searchKeymap } from "@codemirror/search";
+import { lintKeymap } from "@codemirror/lint";
+import { catppuccinLatte, catppuccinMocha } from "@catppuccin/codemirror";
+const doc = defineModel({ type: String });
+const props = defineProps({
+  class: { type: String, required: false },
+  language: { type: String, required: false },
+  bracketClosing: { type: Boolean, required: false },
+  foldGutter: { type: Boolean, required: false },
+  disabled: { type: Boolean, required: false },
+  debug: { type: Boolean, required: false },
+  searchOptions: { type: Object, required: false },
+  lightTheme: { type: [Object, Array], required: false },
+  darkTheme: { type: [Object, Array], required: false },
+  colorMode: { type: String, required: false, default: "dark" }
+});
+const emit = defineEmits([]);
+const extensions = shallowRef([]);
+const view = shallowRef();
+const ast = ref([]);
+const languageCompartment = new Compartment();
+const themeCompartment = new Compartment();
+const isDark = computed(() => props.colorMode === "dark");
+const currentTheme = computed(() => {
+  if (isDark.value) {
+    return props.darkTheme || catppuccinMocha;
+  }
+  return props.lightTheme || catppuccinLatte;
+});
+async function loadLanguage(languageName) {
+  if (!languageName) return null;
+  const lang = languages.find(
+    (l) => l.name.toLowerCase() === languageName.toLowerCase() || l.alias.map((a) => a.toLowerCase()).includes(languageName.toLowerCase())
+  );
+  if (lang) {
+    try {
+      return await lang.load();
+    } catch (e) {
+      console.warn(`Failed to load language: ${languageName}`, e);
+      return null;
+    }
+  }
+  console.warn(`Language not found: ${languageName}`);
+  return null;
+}
+onMounted(async () => {
+  const initialLanguage = await loadLanguage(props.language);
+  extensions.value = [
+    lineNumbers(),
+    // A gutter with code folding markers
+    foldGutter(),
+    // Replace non-printable characters with placeholders
+    highlightSpecialChars(),
+    // The undo history
+    history(),
+    // Replace native cursor/selection with our own
+    drawSelection(),
+    // Show a drop cursor when dragging over the editor
+    dropCursor(),
+    // Allow multiple cursors/selections
+    EditorState.allowMultipleSelections.of(true),
+    // Re-indent lines when typing specific input
+    indentOnInput(),
+    // Theme compartment - switches between light and dark
+    themeCompartment.of(currentTheme.value),
+    // Highlight matching brackets near cursor
+    bracketMatching(),
+    // Automatically close brackets
+    closeBrackets(),
+    // Load the autocompletion system
+    autocompletion(),
+    // Allow alt-drag to select rectangular regions
+    rectangularSelection(),
+    // Change the cursor to a crosshair when holding alt
+    crosshairCursor(),
+    // Style the current line specially
+    highlightActiveLine(),
+    // Style the gutter for current line specially
+    highlightActiveLineGutter(),
+    // Highlight text that matches the selected text
+    highlightSelectionMatches(),
+    // Language support compartment (can be reconfigured)
+    languageCompartment.of(initialLanguage || []),
+    keymap.of([
+      // Closed-brackets aware backspace
+      ...closeBracketsKeymap,
+      // A large set of basic bindings
+      ...defaultKeymap,
+      // Search-related keys
+      ...searchKeymap,
+      // Redo/undo keys
+      ...historyKeymap,
+      // Code folding bindings
+      ...foldKeymap,
+      // Autocompletion keys
+      ...completionKeymap,
+      // Keys related to the linter system
+      ...lintKeymap
+    ]),
+    EditorView.editable.of(!props.disabled)
+  ];
+});
+watch(
+  () => props.language,
+  async (newLanguage) => {
+    if (view.value) {
+      const languageSupport = await loadLanguage(newLanguage);
+      view.value.dispatch({
+        effects: languageCompartment.reconfigure(languageSupport || [])
+      });
+    }
+  }
+);
+watch(
+  currentTheme,
+  (newTheme) => {
+    if (view.value) {
+      view.value.dispatch({
+        effects: themeCompartment.reconfigure(newTheme)
+      });
+    }
+  }
+);
+function handleReady(payload) {
+  view.value = payload.view;
+}
+function iterate() {
+  ast.value = [];
+  try {
+    view.value?.state?.tree.iterate({
+      from: 0,
+      to: view.value.state.doc.length,
+      //@ts-ignore
+      enter(node) {
+        ast.value.push(`Node: ${node.name}, From: ${node.from}, To: ${node.to}, Text: "${view.value?.state.doc.sliceString(node.from, node.to)}"`);
+      }
+    });
+  } catch (e) {
+    console.log(e);
+  }
+}
+defineExpose({
+  view
+});
+</script>
+
+<template>
+	<div :class="props.class ? props.class : 'w-full h-full overflow-visible'">
+		<ClientOnly class="overflow-visible">
+			<div class="w-full cm-code-editor overflow-visible">
+				<CodeMirror
+					v-model="doc"
+					placeholder="Your code here..."
+					:autofocus="true"
+					:indent-with-tab="true"
+					:tab-size="4"
+					:tab="true"
+					:indent-unit="'	'"
+					:extensions="extensions"
+					@ready="handleReady"
+					class="w-full h-full cm-code-editor overflow-visible"
+					:disabled="props.disabled"
+					:readonly="props.disabled"
+				/>
+			</div>
+			<template v-if="props.debug">
+				<UButton label="Iterate AST" @click="iterate" />
+				<div class="grid grid-cols-1 gap-2 py-2 w-full">
+					<div v-for="(content, index) in ast" :key="index">{{ content }}</div>
+				</div>
+			</template>
+		</ClientOnly>
+	</div>
+</template>
+
+<style>
+@reference "../assets/css/editor.css";.cm-cursor{@apply border-l-primary! border-l-[1.8px]! rounded-lg!}.cm-selectionBackground{@apply bg-primary/30! z-[150]}.cm-selectionLayer{@apply z-[150]!;pointer-events:none}div[contenteditable=true]:focus{@apply outline-none border-none h-full shadow-none}.cm-focused{@apply outline-none!}.cm-placeholder{@apply font-editor text-muted}.cm-activeLine{@apply bg-none! border-l-primary border-l-4 relative -left-1 content-[""] mask-no-clip overflow-visible}
+</style>

package/dist/runtime/components/CodeEditor.client.vue.d.ts

@@ -0,0 +1,38 @@
+import { EditorView } from '@codemirror/view';
+import type { Extension } from '@codemirror/state';
+import type { SearchOptions } from '#codemirror-rich-obsidian-editor/editor-types';
+type __VLS_Props = {
+    class?: string;
+    language?: string;
+    bracketClosing?: boolean;
+    foldGutter?: boolean;
+    disabled?: boolean;
+    debug?: boolean;
+    searchOptions?: SearchOptions;
+    /**
+     * Custom theme for light mode. Defaults to Catppuccin Latte.
+     * Pass a CodeMirror Extension (e.g., from @codemirror/theme-one-dark)
+     */
+    lightTheme?: Extension;
+    /**
+     * Custom theme for dark mode. Defaults to Catppuccin Mocha.
+     * Pass a CodeMirror Extension (e.g., from @codemirror/theme-one-dark)
+     */
+    darkTheme?: Extension;
+    colorMode?: string;
+};
+type __VLS_ModelProps = {
+    modelValue?: string;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {
+    view: import("vue").ShallowRef<EditorView | undefined, EditorView | undefined>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: string | undefined) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string | undefined) => any) | undefined;
+}>, {
+    colorMode: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Editor/ImageEmbedComponent.d.vue.ts

@@ -0,0 +1,7 @@
+type __VLS_Props = {
+    filePath: string;
+    display?: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Editor/ImageEmbedComponent.vue

@@ -0,0 +1,14 @@
+<script setup>
+defineProps({
+  filePath: { type: String, required: true },
+  display: { type: String, required: false }
+});
+console.log("upda");
+</script>
+
+<template>
+    <div class="p-3 grid grid-cols-1">
+        <img :src="filePath" class="h-auto min-h-12 max-h-96 object-contain rounded-lg" :alt="display"/>
+		<div class="text-muted text-left text-xs select-none mt-1.5 text-pretty">{{ display }}</div>
+    </div>
+</template>

package/dist/runtime/components/Editor/ImageEmbedComponent.vue.d.ts

@@ -0,0 +1,7 @@
+type __VLS_Props = {
+    filePath: string;
+    display?: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Editor/TestCustomCodeBlock.d.vue.ts

@@ -0,0 +1,6 @@
+type __VLS_Props = {
+    codeContent?: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Editor/TestCustomCodeBlock.vue

@@ -0,0 +1,17 @@
+<script setup>
+const props = defineProps({
+  codeContent: { type: String, required: false }
+});
+const clicks = useState(() => 0);
+console.log("update");
+</script>
+
+<template>
+    <div class="m-3 p-3 border border-default rounded">
+        <div>This is a test codeblock.</div>
+        <div>{{props?.codeContent}}</div>
+        <UButton :label="`You could also add buttons in here: ${clicks}`" @click="() => {
+  clicks += 1;
+}"/>
+    </div>
+</template>

package/dist/runtime/components/Editor/TestCustomCodeBlock.vue.d.ts

@@ -0,0 +1,6 @@
+type __VLS_Props = {
+    codeContent?: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Editor.client.d.vue.ts

@@ -0,0 +1,29 @@
+import { EditorView } from '@codemirror/view';
+import type { InternalLink, SpecialCodeBlockMapping, InternalLinkClickDetail, ExternalLinkClickDetail, SearchOptions } from '#codemirror-rich-obsidian-editor/editor-types';
+type __VLS_Props = {
+    class?: string;
+    internalLinkMap?: InternalLink[];
+    specialCodeBlockMap?: SpecialCodeBlockMapping[];
+    bracketClosing?: boolean;
+    foldGutter?: boolean;
+    disabled?: boolean;
+    debug?: boolean;
+    searchOptions?: SearchOptions;
+};
+type __VLS_ModelProps = {
+    modelValue?: string;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {
+    view: import("vue").ShallowRef<EditorView | undefined, EditorView | undefined>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: string | undefined) => any;
+    "internal-link-click": (detail: InternalLinkClickDetail) => any;
+    "external-link-click": (detail: ExternalLinkClickDetail) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string | undefined) => any) | undefined;
+    "onInternal-link-click"?: ((detail: InternalLinkClickDetail) => any) | undefined;
+    "onExternal-link-click"?: ((detail: ExternalLinkClickDetail) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;