@synclineapi/mdx-editor 0.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +310 -0
- package/dist/core/editor.d.ts +61 -0
- package/dist/core/events.d.ts +8 -0
- package/dist/core/history.d.ts +12 -0
- package/dist/core/icons.d.ts +2 -0
- package/dist/core/plugin-manager.d.ts +24 -0
- package/dist/core/renderer.d.ts +28 -0
- package/dist/core/sanitize.d.ts +10 -0
- package/dist/core/toolbar.d.ts +29 -0
- package/dist/core/types.d.ts +218 -0
- package/dist/examples/badge-plugin.ts +114 -0
- package/dist/examples/setup.ts +47 -0
- package/dist/index.d.ts +28 -0
- package/dist/plugins/accordion-columns.d.ts +4 -0
- package/dist/plugins/basic-formatting.d.ts +9 -0
- package/dist/plugins/break-hr.d.ts +3 -0
- package/dist/plugins/card.d.ts +3 -0
- package/dist/plugins/copy-tooltip.d.ts +3 -0
- package/dist/plugins/embed.d.ts +3 -0
- package/dist/plugins/emoji-formula.d.ts +3 -0
- package/dist/plugins/highlight-admonition.d.ts +3 -0
- package/dist/plugins/index.d.ts +29 -0
- package/dist/plugins/insert.d.ts +6 -0
- package/dist/plugins/lists-table.d.ts +5 -0
- package/dist/plugins/mermaid.d.ts +2 -0
- package/dist/plugins/step-tip-container.d.ts +4 -0
- package/dist/plugins/tab-media.d.ts +4 -0
- package/dist/plugins/toc.d.ts +2 -0
- package/dist/shared/introduction.md +27 -0
- package/dist/style.css +1 -0
- package/dist/syncline-mdx-editor.js +2845 -0
- package/dist/syncline-mdx-editor.umd.cjs +428 -0
- package/package.json +111 -0
|
@@ -0,0 +1,428 @@
|
|
|
1
|
+
(function(m,v){typeof exports=="object"&&typeof module<"u"?v(exports,require("highlight.js")):typeof define=="function"&&define.amd?define(["exports","highlight.js"],v):(m=typeof globalThis<"u"?globalThis:m||self,v(m.SynclineMDXEditor={},m.hljs))})(this,function(m,v){"use strict";class S{constructor(){this.listeners=new Map}on(e,t){this.listeners.has(e)||this.listeners.set(e,new Set),this.listeners.get(e).add(t)}off(e,t){var o;(o=this.listeners.get(e))==null||o.delete(t)}emit(e,t){var o;(o=this.listeners.get(e))==null||o.forEach(i=>{try{i(t)}catch(s){console.error(`[SynclineMDX] Error in event handler for "${e}":`,s)}})}removeAllListeners(e){e?this.listeners.delete(e):this.listeners.clear()}}class T{constructor(e,t){this.editorApi=e,this.plugins=new Map,this.toolbarItems=new Map,this.shortcuts=[],this.renderers=[],this.parsers=[],this.styleElements=[],this.events=t}async register(e){if(this.plugins.has(e.name)){console.warn(`[SynclineMDX] Plugin "${e.name}" is already registered.`);return}if(e.dependencies){for(const t of e.dependencies)if(!this.plugins.has(t))throw new Error(`[SynclineMDX] Plugin "${e.name}" requires "${t}" which is not registered.`)}if(this.plugins.set(e.name,e),e.toolbarItems)for(const t of e.toolbarItems)this.toolbarItems.set(t.id,t);e.shortcuts&&this.shortcuts.push(...e.shortcuts),e.renderers&&(this.renderers.push(...e.renderers),this.renderers.sort((t,o)=>(o.priority??0)-(t.priority??0))),e.parsers&&(this.parsers.push(...e.parsers),this.parsers.sort((t,o)=>(o.priority??0)-(t.priority??0))),e.styles&&this.injectStyles(e.styles),e.init&&await e.init(this.createContext()),this.events.emit("plugin-registered",e.name)}unregister(e){const t=this.plugins.get(e);if(t){if(t.destroy&&t.destroy(this.createContext()),t.toolbarItems)for(const o of t.toolbarItems)this.toolbarItems.delete(o.id);if(t.shortcuts&&(this.shortcuts=this.shortcuts.filter(o=>!t.shortcuts.some(i=>i.key===o.key))),t.renderers){const o=new Set(t.renderers.map(i=>i.name));this.renderers=this.renderers.filter(i=>!o.has(i.name))}if(t.parsers){const o=new Set(t.parsers.map(i=>i.name));this.parsers=this.parsers.filter(i=>!o.has(i.name))}this.plugins.delete(e),this.events.emit("plugin-removed",e)}}getToolbarItem(e){return this.toolbarItems.get(e)}getAllToolbarItems(){return this.toolbarItems}getShortcuts(){return this.shortcuts}getRenderers(){return this.renderers}getParsers(){return this.parsers}hasPlugin(e){return this.plugins.has(e)}createContext(){return{editor:this.editorApi,registerToolbarItem:e=>this.toolbarItems.set(e.id,e),registerShortcut:e=>this.shortcuts.push(e),registerRenderer:e=>{this.renderers.push(e),this.renderers.sort((t,o)=>(o.priority??0)-(t.priority??0))},registerParser:e=>{this.parsers.push(e),this.parsers.sort((t,o)=>(o.priority??0)-(t.priority??0))},injectStyles:e=>this.injectStyles(e),emit:(e,t)=>this.events.emit(e,t),on:(e,t)=>this.events.on(e,t),off:(e,t)=>this.events.off(e,t)}}injectStyles(e){const t=document.createElement("style");t.setAttribute("data-syncline-mdx","plugin"),t.textContent=e,document.head.appendChild(t),this.styleElements.push(t)}destroy(){for(const[e]of this.plugins)this.unregister(e);for(const e of this.styleElements)e.remove();this.styleElements=[]}}class E{constructor(e,t,o,i){this.config=e,this.pluginManager=t,this.editorApi=o,this.events=i,this.activeDropdown=null,this.documentClickHandler=s=>{this.activeDropdown&&!this.activeDropdown.contains(s.target)&&this.closeDropdowns()}}render(e){this.el=document.createElement("div"),this.el.className="smdx-toolbar";for(const t of this.config){const o=document.createElement("div");o.className="smdx-toolbar-row",this.renderRow(t,o),this.el.appendChild(o)}return e.appendChild(this.el),document.addEventListener("click",this.documentClickHandler),this.el}renderRow(e,t){for(const o of e)typeof o=="string"?o==="|"?this.renderDivider(t):this.renderItem(o,t):"type"in o&&o.type==="divider"?this.renderDivider(t):"type"in o&&o.type==="group"&&this.renderGroup(o,t)}renderDivider(e){const t=document.createElement("span");t.className="smdx-toolbar-divider",e.appendChild(t)}renderItem(e,t){const o=this.pluginManager.getToolbarItem(e);if(o)if(o.children&&o.children.length>0)this.renderDropdownItem(o,t);else{const i=this.createButton(o);t.appendChild(i)}}renderGroup(e,t){if(e.display==="dropdown")this.renderDropdownGroup(e,t);else{const o=document.createElement("div");o.className="smdx-toolbar-group";for(const i of e.items)typeof i=="string"?this.renderItem(i,o):this.renderGroup(i,o);t.appendChild(o)}}renderDropdownGroup(e,t){const o=document.createElement("div");o.className="smdx-toolbar-dropdown";const i=document.createElement("button");i.className="smdx-toolbar-btn smdx-toolbar-dropdown-trigger",i.type="button",i.innerHTML=`${e.icon||""}<span class="smdx-toolbar-btn-label">${e.label||""}</span><svg class="smdx-dropdown-arrow" width="10" height="6" viewBox="0 0 10 6"><path d="M1 1l4 4 4-4" stroke="currentColor" fill="none" stroke-width="1.5"/></svg>`,i.title=e.label||"",i.setAttribute("aria-label",e.label||"Dropdown"),i.setAttribute("aria-haspopup","true"),i.setAttribute("aria-expanded","false");const s=document.createElement("div");s.className="smdx-toolbar-dropdown-menu",s.setAttribute("role","menu"),s.style.display="none";for(const n of e.items)if(typeof n=="string"){const a=this.pluginManager.getToolbarItem(n);if(!a)continue;if(a.children&&a.children.length>0)this.renderSubmenu(a,s);else{const d=this.createMenuButton(a);s.appendChild(d)}}else{const a=document.createElement("div");if(a.className="smdx-toolbar-dropdown-section",n.label){const d=document.createElement("div");d.className="smdx-toolbar-dropdown-section-label",d.textContent=n.label,a.appendChild(d)}for(const d of n.items)if(typeof d=="string"){const l=this.pluginManager.getToolbarItem(d);if(l)if(l.children&&l.children.length>0)this.renderSubmenu(l,a);else{const c=this.createMenuButton(l);a.appendChild(c)}}s.appendChild(a)}i.addEventListener("click",n=>{n.stopPropagation(),this.toggleDropdown(s,o)}),o.appendChild(i),o.appendChild(s),t.appendChild(o)}renderDropdownItem(e,t){const o=document.createElement("div");o.className="smdx-toolbar-dropdown";const i=document.createElement("button");i.className="smdx-toolbar-btn smdx-toolbar-dropdown-trigger",i.type="button",i.innerHTML=`${e.icon||""}<span class="smdx-toolbar-btn-label">${e.label}</span><svg class="smdx-dropdown-arrow" width="10" height="6" viewBox="0 0 10 6"><path d="M1 1l4 4 4-4" stroke="currentColor" fill="none" stroke-width="1.5"/></svg>`,i.title=e.tooltip||e.label,i.setAttribute("aria-label",e.tooltip||e.label),i.setAttribute("aria-haspopup","true"),i.setAttribute("aria-expanded","false");const s=document.createElement("div");s.className="smdx-toolbar-dropdown-menu",s.setAttribute("role","menu"),s.style.display="none";for(const n of e.children)if(n.children&&n.children.length>0)this.renderSubmenu(n,s);else{const a=this.createMenuButton(n);s.appendChild(a)}i.addEventListener("click",n=>{n.stopPropagation(),this.toggleDropdown(s,o)}),o.appendChild(i),o.appendChild(s),t.appendChild(o)}renderSubmenu(e,t){const o=document.createElement("div");o.className="smdx-toolbar-submenu";const i=document.createElement("button");i.className="smdx-toolbar-menu-btn smdx-toolbar-submenu-trigger",i.type="button",i.innerHTML=`${e.icon||""}<span>${e.label}</span><svg class="smdx-submenu-arrow" width="6" height="10" viewBox="0 0 6 10"><path d="M1 1l4 4-4 4" stroke="currentColor" fill="none" stroke-width="1.5"/></svg>`;const s=document.createElement("div");s.className="smdx-toolbar-dropdown-menu smdx-toolbar-submenu-menu",s.style.display="none";for(const c of e.children)if(c.children&&c.children.length>0)this.renderSubmenu(c,s);else{const h=this.createMenuButton(c);s.appendChild(h)}const n=()=>{const c=o.getBoundingClientRect();s.style.left=`${c.right}px`,s.style.top=`${c.top}px`,requestAnimationFrame(()=>{const h=s.getBoundingClientRect();h.right>window.innerWidth&&(s.style.left=`${c.left-h.width}px`),h.bottom>window.innerHeight&&(s.style.top=`${window.innerHeight-h.height-8}px`)})};let a=null;const d=()=>{a&&(clearTimeout(a),a=null),s.style.display="",n()},l=()=>{a&&clearTimeout(a),a=setTimeout(()=>{s.style.display="none",a=null},120)};i.addEventListener("mouseenter",d),s.addEventListener("mouseenter",d),o.addEventListener("mouseleave",l),s.addEventListener("mouseleave",l),o.appendChild(i),o.appendChild(s),t.appendChild(o)}createButton(e){const t=document.createElement("button");return t.className=`smdx-toolbar-btn${e.className?" "+e.className:""}`,t.type="button",t.tabIndex=0,t.title=e.tooltip||e.label,t.setAttribute("aria-label",e.tooltip||e.label),t.dataset.toolbarId=e.id,e.icon?t.innerHTML=e.icon:t.textContent=e.label,e.shortcutLabel&&(t.title+=` (${e.shortcutLabel})`),t.addEventListener("click",o=>{o.preventDefault(),this.executeAction(e)}),e.render&&e.render(t,this.getActionContext()),t}createMenuButton(e){const t=document.createElement("button");return t.className=`smdx-toolbar-menu-btn${e.className?" "+e.className:""}`,t.type="button",t.setAttribute("role","menuitem"),t.dataset.toolbarId=e.id,t.innerHTML=`${e.icon||""}<span>${e.label}</span>${e.shortcutLabel?`<span class="smdx-shortcut-label">${e.shortcutLabel}</span>`:""}`,t.addEventListener("click",o=>{o.preventDefault(),this.closeDropdowns(),this.executeAction(e)}),t}executeAction(e){var o;const t=this.getActionContext();(o=e.isDisabled)!=null&&o.call(e,t)||(e.action(t),this.events.emit("toolbar-action",e.id))}getActionContext(){return{editor:this.editorApi,selection:this.editorApi.getSelection()}}toggleDropdown(e,t){if(e.style.display==="none"){this.closeDropdowns(),e.style.display="",this.activeDropdown=t;const o=t.querySelector(".smdx-toolbar-dropdown-trigger");o==null||o.setAttribute("aria-expanded","true")}else{e.style.display="none";const o=t.querySelector(".smdx-toolbar-dropdown-trigger");o==null||o.setAttribute("aria-expanded","false"),this.activeDropdown=null}}closeDropdowns(){var e,t;(e=this.el)==null||e.querySelectorAll(".smdx-toolbar-dropdown-menu").forEach(o=>{o.style.display="none"}),(t=this.el)==null||t.querySelectorAll('[aria-expanded="true"]').forEach(o=>{o.setAttribute("aria-expanded","false")}),this.activeDropdown=null}updateActiveStates(){var t;const e=this.getActionContext();(t=this.el)==null||t.querySelectorAll("[data-toolbar-id]").forEach(o=>{const i=o.dataset.toolbarId,s=this.pluginManager.getToolbarItem(i);s!=null&&s.isActive&&o.classList.toggle("smdx-active",s.isActive(e)),s!=null&&s.isDisabled&&(o.disabled=s.isDisabled(e))})}destroy(){var e;document.removeEventListener("click",this.documentClickHandler),(e=this.el)==null||e.remove()}}const Ce=new Set(["script","style","object","embed","base","form","input","link","meta","noscript","applet","frame","frameset"]),$e=["https://www.youtube.com/embed/","https://youtube.com/embed/","https://codepen.io/","https://codesandbox.io/embed/"];function Se(r){return $e.some(e=>r.startsWith(e))}const L=/^on/i,Te=/^\s*javascript\s*:/i;function Ee(r){if(typeof document>"u")return r;const t=new DOMParser().parseFromString(`<!DOCTYPE html><body>${r}</body>`,"text/html"),o=document.createTreeWalker(t.body,NodeFilter.SHOW_ELEMENT),i=[];let s=o.currentNode;for(;s;){if(s.nodeType===Node.ELEMENT_NODE){const n=s,a=n.tagName.toLowerCase();if(Ce.has(a))i.push(n);else if(a==="iframe"){const d=n.getAttribute("src")||"";if(!Se(d))i.push(n);else{const l=[];for(const c of Array.from(n.attributes))L.test(c.name)&&l.push(c.name);for(const c of l)n.removeAttribute(c)}}else{const d=[];for(const l of Array.from(n.attributes))(L.test(l.name)||(l.name==="href"||l.name==="src"||l.name==="action")&&Te.test(l.value))&&d.push(l.name);for(const l of d)n.removeAttribute(l)}}s=o.nextNode()}for(const n of i)n.remove();return t.body.innerHTML}class M{constructor(){this.renderers=[],this.parsers=[]}setRenderers(e){this.renderers=e}setParsers(e){this.parsers=e}async render(e){let t=e;const o=this.validateMdxTags(e),i=[];t=t.replace(/`([^`\n]+)`/g,(s,n)=>{const a=i.length;return i.push(n),`%%INLINECODE_${a}%%`}),t=this.applyParsers(t),t=this.applyRenderers(t);for(let s=0;s<i.length;s++)t=t.replace(`%%INLINECODE_${s}%%`,`\`${i[s]}\``);return t=this.renderMarkdown(t),o.length>0&&(t=o.map(n=>`<div class="smdx-parse-error"><span class="smdx-parse-error-icon">⚠</span> ${this.escapeHtml(n)}</div>`).join("")+t),Ee(t)}applyParsers(e){let t=e;for(const o of this.parsers)t=t.replace(o.pattern,(...i)=>{const s=i;return o.transform(s)});return t}applyRenderers(e){let t=e;for(const o of this.renderers)t=t.replace(o.pattern,(i,...s)=>{const n={};return s.length>0&&(n.content=s[0]||""),o.render(i,n)});return t}renderMarkdown(e){let t=e;const o=[];t=t.replace(/```(\w*)(?:[\t ]+([\w.\/ \-]+?))?\n([\s\S]*?)```/g,(s,n,a,d)=>{const l=o.length,c={js:"JavaScript",javascript:"JavaScript",ts:"TypeScript",typescript:"TypeScript",py:"Python",python:"Python",java:"Java",rb:"Ruby",ruby:"Ruby",go:"Go",rust:"Rust",rs:"Rust",cpp:"C++",c:"C",cs:"C#",csharp:"C#",php:"PHP",swift:"Swift",kt:"Kotlin",kotlin:"Kotlin",scala:"Scala",sh:"Shell",bash:"Bash",zsh:"Zsh",sql:"SQL",html:"HTML",css:"CSS",scss:"SCSS",less:"LESS",json:"JSON",yaml:"YAML",yml:"YAML",xml:"XML",md:"Markdown",markdown:"Markdown",graphql:"GraphQL",dart:"Dart",r:"R",lua:"Lua",perl:"Perl",text:"Text",txt:"Text"};let h;const u=d.trimEnd();try{n&&v.getLanguage(n)?h=v.highlight(u,{language:n}).value:h=v.highlightAuto(u).value}catch{h=this.escapeHtml(u)}const x=n?c[n.toLowerCase()]||n.charAt(0).toUpperCase()+n.slice(1):"",g=x?`<span class="smdx-code-lang">${x}</span>`:"",b=a?`<span class="smdx-code-filename"><svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><polyline points="14 2 14 8 20 8"/></svg>${this.escapeHtml(a)}</span>`:"",y='<button class="smdx-copy-btn" data-copy-btn="true" title="Copy code" aria-label="Copy code"><svg class="smdx-copy-icon" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="9" y="9" width="13" height="13" rx="2"/><path d="M5 15H4a2 2 0 01-2-2V4a2 2 0 012-2h9a2 2 0 012 2v1"/></svg><svg class="smdx-check-icon" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="20 6 9 17 4 12"/></svg></button>',k=x||a,w=k?`<div class="smdx-code-header">${g}${b}${y}</div>`:"";return o.push(`<div class="smdx-code-block${k?" smdx-has-header":""}">${w}<pre><code class="hljs language-${n||"text"}">${h}</code></pre>${k?"":y}</div>`),`%%CODEBLOCK_${l}%%`}),t=t.replace(/`([^`]+)`/g,(s,n)=>`<code class="smdx-inline-code">${this.escapeHtml(n)}</code>`);const i=s=>s.toLowerCase().replace(/[^\w]+/g,"-").replace(/^-|-$/g,"");t=t.replace(/^######\s+(.+)$/gm,(s,n)=>`<h6 id="${i(n)}">${n}</h6>`),t=t.replace(/^#####\s+(.+)$/gm,(s,n)=>`<h5 id="${i(n)}">${n}</h5>`),t=t.replace(/^####\s+(.+)$/gm,(s,n)=>`<h4 id="${i(n)}">${n}</h4>`),t=t.replace(/^###\s+(.+)$/gm,(s,n)=>`<h3 id="${i(n)}">${n}</h3>`),t=t.replace(/^##\s+(.+)$/gm,(s,n)=>`<h2 id="${i(n)}">${n}</h2>`),t=t.replace(/^#\s+(.+)$/gm,(s,n)=>`<h1 id="${i(n)}">${n}</h1>`),t=t.replace(/^---$/gm,"<hr/>"),t=t.replace(/\*\*\*(.+?)\*\*\*/g,"<strong><em>$1</em></strong>"),t=t.replace(/\*\*(.+?)\*\*/g,"<strong>$1</strong>"),t=t.replace(/\*(.+?)\*/g,"<em>$1</em>"),t=t.replace(/~~(.+?)~~/g,"<del>$1</del>"),t=t.replace(/^>\s+(.+)$/gm,"<blockquote>$1</blockquote>"),t=t.replace(/^- \[x\]\s+(.+)$/gm,'<div class="smdx-task"><input type="checkbox" checked disabled /><span>$1</span></div>'),t=t.replace(/^- \[ \]\s+(.+)$/gm,'<div class="smdx-task"><input type="checkbox" disabled /><span>$1</span></div>'),t=t.replace(/^[-*]\s+(.+)$/gm,'<li class="smdx-ul-item">$1</li>'),t=t.replace(/((?:<li class="smdx-ul-item">.*<\/li>\n?)+)/g,"<ul>$1</ul>"),t=t.replace(/^\d+\.\s+(.+)$/gm,'<li class="smdx-ol-item">$1</li>'),t=t.replace(/((?:<li class="smdx-ol-item">.*<\/li>\n?)+)/g,"<ol>$1</ol>"),t=t.replace(/!\[([^\]]*)\]\(([^)]+)\)/g,'<img src="$2" alt="$1" class="smdx-image"/>'),t=t.replace(/\[([^\]]+)\]\(([^)]+)\)/g,'<a href="$2" target="_blank" rel="noopener noreferrer">$1</a>'),t=this.renderTables(t),t=t.replace(/ {2,}$/gm,"<br/>"),t=t.replace(/^(?!\s*<[a-zA-Z/!]|\s*%%)(.*\S.*)$/gm,"<p>$1</p>"),t=t.replace(/<p>\s*<\/p>/g,"");for(let s=0;s<o.length;s++)t=t.replace(`%%CODEBLOCK_${s}%%`,o[s]);return t}renderTables(e){const t=/(?:^(\|.+\|)\n(\|[-| :]+\|)\n((?:\|.+\|\n?)*))/gm;return e.replace(t,(o,i,s,n)=>{const a=this.parseTableRow(i),d=n.trim().split(`
|
|
2
|
+
`).filter(Boolean).map(c=>this.parseTableRow(c));let l='<div class="smdx-table-wrapper"><table class="smdx-table"><thead><tr>';for(const c of a)l+=`<th>${c}</th>`;l+="</tr></thead><tbody>";for(const c of d){l+="<tr>";for(const h of c)l+=`<td>${h}</td>`;l+="</tr>"}return l+="</tbody></table></div>",l})}parseTableRow(e){return e.split("|").slice(1,-1).map(t=>t.trim())}escapeHtml(e){return e.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/"/g,""")}validateMdxTags(e){const t=[];let o=e.replace(/```[\s\S]*?```/g,"");o=o.replace(/`[^`]+`/g,"");const i=[],s=o.split(`
|
|
3
|
+
`);for(let n=0;n<s.length;n++){const a=s[n];let d;const l=/<\/?([A-Z][A-Za-z0-9]*)(?:\s[^>]*)?\/?>|<([A-Z][A-Za-z0-9]*)(?:\s[^>]*)?>/g;for(;(d=l.exec(a))!==null;){const c=d[0];if(c.endsWith("/>"))continue;const h=d[1]||d[2];if(!h)continue;const u=d.index+1;if(c.startsWith("</")){let g=!1;for(let b=i.length-1;b>=0;b--)if(i[b].tag===h){i.splice(b,1),g=!0;break}g||t.push(`Unexpected closing tag '</${h}>' at line ${n+1}:${u} — no matching opening tag found.`)}else i.push({tag:h,line:n+1,col:u})}}for(const n of i)t.push(`Expected a closing tag for '<${n.tag}>' (${n.line}:${n.col}) before the end of the document.`);return t}}class I{constructor(e=100){this.stack=[],this.pointer=-1,this.maxSize=e}push(e){this.pointer<this.stack.length-1&&(this.stack=this.stack.slice(0,this.pointer+1)),this.stack[this.stack.length-1]!==e&&(this.stack.push(e),this.stack.length>this.maxSize&&this.stack.shift(),this.pointer=this.stack.length-1)}undo(){if(this.pointer>0)return this.pointer--,this.stack[this.pointer]}redo(){if(this.pointer<this.stack.length-1)return this.pointer++,this.stack[this.pointer]}current(){return this.stack[this.pointer]}clear(){this.stack=[],this.pointer=-1}}class B{constructor(e){this.events=new S,this.renderer=new M,this.history=new I,this.renderTimer=null,this.historyTimer=null,this._destroyed=!1,this.config=e,this.mode=e.mode||"split",this.init()}init(){const e=typeof this.config.container=="string"?document.querySelector(this.config.container):this.config.container;if(!e)throw new Error("[SynclineMDX] Container element not found");this.buildDOM(e),this.config.theme&&this.applyTheme(this.config.theme),this.pluginManager=new T(this,this.events);const t=this.config.toolbar||[this.getDefaultToolbar()];this.toolbar=new E(t,this.pluginManager,this,this.events),this.config.value&&(this.textarea.value=this.config.value),this.config.plugins?this.registerPlugins(this.config.plugins).then(()=>{this.toolbar.render(this.toolbarEl),this.history.push(this.textarea.value),this.renderPreview()}):(this.toolbar.render(this.toolbarEl),this.history.push(this.textarea.value),this.renderPreview()),this.textarea.addEventListener("input",this.onInput.bind(this)),this.textarea.addEventListener("keydown",this.onKeyDown.bind(this)),this.textarea.addEventListener("click",this.onSelectionChange.bind(this)),this.textarea.addEventListener("select",this.onSelectionChange.bind(this)),this.textarea.addEventListener("focus",()=>this.events.emit("focus")),this.textarea.addEventListener("blur",()=>this.events.emit("blur")),this.config.scrollSync!==!1&&this.textarea.addEventListener("scroll",()=>{requestAnimationFrame(()=>{const o=this.textarea.scrollHeight-this.textarea.clientHeight,i=o>0?this.textarea.scrollTop/o:0,s=this.previewContent.scrollHeight-this.previewContent.clientHeight;this.previewContent.scrollTop=i*s})}),this.config.readOnly&&(this.textarea.readOnly=!0),this.config.placeholder&&(this.textarea.placeholder=this.config.placeholder),this.setMode(this.mode),this.config.onChange&&this.on("change",o=>{typeof o=="string"&&this.config.onChange(o)})}buildDOM(e){this.root=document.createElement("div"),this.root.className="smdx-editor",this.root.setAttribute("role","application"),this.root.setAttribute("aria-label","Markdown Editor");const t=document.createElement("a");t.className="smdx-skip-link",t.href="#smdx-editor-content",t.textContent="Skip to editor",this.root.appendChild(t),this.toolbarEl=document.createElement("div"),this.toolbarEl.className="smdx-toolbar-container",this.toolbarEl.setAttribute("role","toolbar"),this.toolbarEl.setAttribute("aria-label","Formatting toolbar");const o=document.createElement("div");o.className="smdx-main",this.editorPane=document.createElement("div"),this.editorPane.className="smdx-editor-pane",this.editorPane.id="smdx-editor-content",this.textarea=document.createElement("textarea"),this.textarea.className="smdx-textarea",this.textarea.spellcheck=!0,this.textarea.setAttribute("autocomplete","off"),this.textarea.setAttribute("autocorrect","off"),this.textarea.setAttribute("autocapitalize","off"),this.textarea.setAttribute("role","textbox"),this.textarea.setAttribute("aria-label","Markdown editor"),this.textarea.setAttribute("aria-multiline","true"),this.editorPane.appendChild(this.textarea),this.previewPane=document.createElement("div"),this.previewPane.className="smdx-preview-pane",this.previewContent=document.createElement("div"),this.previewContent.className="smdx-preview-content",this.previewContent.setAttribute("role","region"),this.previewContent.setAttribute("aria-label","Preview"),this.previewContent.setAttribute("aria-live","polite"),this.previewContent.addEventListener("click",i=>{const s=i.target,n=s.closest("[data-smdx-tab-btn]");if(n){const c=n.closest(".smdx-tabs");if(c){const h=parseInt(n.dataset.tabIndex??"0",10);c.querySelectorAll(".smdx-tab-btn").forEach(u=>u.classList.remove("smdx-active")),n.classList.add("smdx-active"),c.querySelectorAll(".smdx-tab-panel").forEach((u,x)=>{u.style.display=x===h?"block":"none"})}return}const a=s.closest("[data-copy-btn]");if(!a)return;const d=a.closest(".smdx-code-block"),l=d==null?void 0:d.querySelector("code");l&&navigator.clipboard.writeText(l.textContent||"").then(()=>{a.classList.add("smdx-copied"),setTimeout(()=>a.classList.remove("smdx-copied"),2e3)}).catch(()=>{})}),this.previewPane.appendChild(this.previewContent),o.appendChild(this.editorPane),o.appendChild(this.previewPane),this.statusBar=document.createElement("div"),this.statusBar.className="smdx-status-bar",this.statusBar.setAttribute("role","status"),this.statusBar.setAttribute("aria-label","Editor status"),this.updateStatusBar(),this.root.appendChild(this.toolbarEl),this.root.appendChild(o),this.root.appendChild(this.statusBar),e.appendChild(this.root)}async registerPlugins(e){for(const t of e)await this.pluginManager.register(t)}getDefaultToolbar(){return["heading","|","bold","italic","strikethrough","|","quote","link","image","|","code","codeBlock","|","unorderedList","orderedList","taskList","|","table","|","highlight","admonition","|","accordion","steps","tab","|","card","multiColumn","|","tip","container","|","emoji","formula","|","embedVideo","embedOthers","|","mermaid","|","copyText","tooltip"]}onInput(){this.historyTimer&&clearTimeout(this.historyTimer),this.historyTimer=setTimeout(()=>{this.history.push(this.textarea.value)},300),this.scheduleRender(),this.updateStatusBar(),this.events.emit("change",this.textarea.value)}onKeyDown(e){if(e.key==="Tab"){e.preventDefault();const i=this.textarea.selectionStart,s=this.textarea.selectionEnd,n=this.textarea.value;if(e.shiftKey){const a=n.lastIndexOf(`
|
|
4
|
+
`,i-1)+1;n.substring(a,a+2)===" "&&(this.textarea.value=n.substring(0,a)+n.substring(a+2),this.textarea.selectionStart=Math.max(i-2,a),this.textarea.selectionEnd=Math.max(s-2,a))}else this.textarea.value=n.substring(0,i)+" "+n.substring(s),this.textarea.selectionStart=this.textarea.selectionEnd=i+2;this.onInput();return}if(e.metaKey||e.ctrlKey){if(e.key==="z"&&!e.shiftKey){e.preventDefault(),this.undo();return}if(e.key==="z"&&e.shiftKey||e.key==="y"){e.preventDefault(),this.redo();return}}const o=this.pluginManager.getShortcuts();for(const i of o)if(this.matchShortcut(e,i.key)){e.preventDefault(),i.action({editor:this,selection:this.getSelection()});return}}matchShortcut(e,t){const o=t.toLowerCase().split("+"),i=o.includes("cmd")||o.includes("meta"),s=o.includes("ctrl"),n=o.includes("shift"),a=o.includes("alt"),d=i||s,l=o.filter(h=>!["cmd","meta","ctrl","shift","alt"].includes(h))[0];return(i?e.metaKey:!e.metaKey||d)&&(s?e.ctrlKey:!e.ctrlKey||d)&&(n?e.shiftKey:!e.shiftKey)&&(a?e.altKey:!e.altKey)&&(d?e.metaKey||e.ctrlKey:!e.metaKey&&!e.ctrlKey)&&e.key.toLowerCase()===l}onSelectionChange(){this.toolbar.updateActiveStates(),this.events.emit("selection-change",this.getSelection())}scheduleRender(){this.renderTimer&&clearTimeout(this.renderTimer),this.renderTimer=setTimeout(()=>this.renderPreview(),150)}updateStatusBar(){const e=this.getWordCount(),t=this.getLineCount();this.statusBar.innerHTML=`<span>Words: ${e}</span><span>Lines: ${t}</span>`;const o=document.createElement("div");o.className="smdx-mode-switch",["editor","split","preview"].forEach(i=>{const s=document.createElement("button");s.type="button",s.className=`smdx-mode-btn${i===this.mode?" smdx-active":""}`,s.textContent=i.charAt(0).toUpperCase()+i.slice(1),s.setAttribute("aria-label",`${i.charAt(0).toUpperCase()+i.slice(1)} mode`),s.setAttribute("aria-pressed",String(i===this.mode)),s.addEventListener("click",()=>this.setMode(i)),o.appendChild(s)}),this.statusBar.appendChild(o)}getValue(){return this.textarea.value}setValue(e){this.textarea.value=e,this.history.push(e),this.scheduleRender(),this.events.emit("change",e)}insertText(e){const t=this.textarea.selectionStart,o=this.textarea.selectionEnd,i=this.textarea.value;this.textarea.value=i.substring(0,t)+e+i.substring(o),this.textarea.selectionStart=this.textarea.selectionEnd=t+e.length,this.textarea.focus(),this.onInput()}wrapSelection(e,t){const{start:o,end:i,text:s}=this.getSelection(),n=this.textarea.value,a=e+(s||"text")+t;this.textarea.value=n.substring(0,o)+a+n.substring(i),this.textarea.selectionStart=o+e.length,this.textarea.selectionEnd=o+e.length+(s||"text").length,this.textarea.focus(),this.onInput()}replaceSelection(e){const{start:t,end:o}=this.getSelection(),i=this.textarea.value;this.textarea.value=i.substring(0,t)+e+i.substring(o),this.textarea.selectionStart=this.textarea.selectionEnd=t+e.length,this.textarea.focus(),this.onInput()}getSelection(){const e=this.textarea.selectionStart,t=this.textarea.selectionEnd,o=this.textarea.value;return{start:e,end:t,text:o.substring(e,t),beforeText:o.substring(0,e),afterText:o.substring(t)}}setSelection(e,t){this.textarea.selectionStart=e,this.textarea.selectionEnd=t,this.textarea.focus()}insertBlock(e){const{start:t,end:o}=this.getSelection(),i=this.textarea.value,s=i.substring(0,t),n=i.substring(o),a=s.length>0&&!s.endsWith(`
|
|
5
|
+
`),d=n.length>0&&!n.startsWith(`
|
|
6
|
+
`),l=(a?`
|
|
7
|
+
|
|
8
|
+
`:"")+e+(d?`
|
|
9
|
+
|
|
10
|
+
`:"");this.textarea.value=s+l+n,this.textarea.selectionStart=this.textarea.selectionEnd=s.length+l.length,this.textarea.focus(),this.onInput()}getTextarea(){return this.textarea}getPreview(){return this.previewContent}getRoot(){return this.root}focus(){this.textarea.focus()}async renderPreview(){this.renderer.setRenderers(this.pluginManager.getRenderers()),this.renderer.setParsers(this.pluginManager.getParsers());const e=await this.renderer.render(this.textarea.value);this.previewContent.innerHTML=e,this.events.emit("render",e)}getMode(){return this.mode}setMode(e){this.mode=e,this.root.classList.remove("smdx-mode-split","smdx-mode-editor","smdx-mode-preview"),this.root.classList.add(`smdx-mode-${e}`),this.updateStatusBar(),this.events.emit("mode-change",e)}registerPlugin(e){this.pluginManager.register(e).then(()=>{this.toolbarEl.innerHTML="",this.toolbar.render(this.toolbarEl),this.renderPreview()})}unregisterPlugin(e){this.pluginManager.unregister(e),this.toolbarEl.innerHTML="",this.toolbar.render(this.toolbarEl),this.renderPreview()}on(e,t){this.events.on(e,t)}off(e,t){this.events.off(e,t)}emit(e,t){this.events.emit(e,t)}destroy(){this._destroyed||(this._destroyed=!0,this.pluginManager.destroy(),this.toolbar.destroy(),this.events.removeAllListeners(),this.renderTimer&&clearTimeout(this.renderTimer),this.historyTimer&&clearTimeout(this.historyTimer),this.root.remove())}undo(){const e=this.history.undo();e!==void 0&&(this.textarea.value=e,this.scheduleRender(),this.events.emit("change",e))}redo(){const e=this.history.redo();e!==void 0&&(this.textarea.value=e,this.scheduleRender(),this.events.emit("change",e))}getCurrentLine(){const e=this.textarea.value,t=this.textarea.selectionStart,o=e.lastIndexOf(`
|
|
11
|
+
`,t-1)+1,i=e.indexOf(`
|
|
12
|
+
`,t);return e.substring(o,i===-1?e.length:i)}getCurrentLineNumber(){const e=this.textarea.value,t=this.textarea.selectionStart;return e.substring(0,t).split(`
|
|
13
|
+
`).length}replaceCurrentLine(e){const t=this.textarea.value,o=this.textarea.selectionStart,i=t.lastIndexOf(`
|
|
14
|
+
`,o-1)+1;let s=t.indexOf(`
|
|
15
|
+
`,o);s===-1&&(s=t.length),this.textarea.value=t.substring(0,i)+e+t.substring(s),this.textarea.selectionStart=this.textarea.selectionEnd=i+e.length,this.onInput()}insertAt(e,t){const o=this.textarea.value;this.textarea.value=o.substring(0,e)+t+o.substring(e),this.textarea.selectionStart=this.textarea.selectionEnd=e+t.length,this.onInput()}getWordCount(){const e=this.textarea.value.trim();return e?e.split(/\s+/).length:0}getLineCount(){return this.textarea.value.split(`
|
|
16
|
+
`).length}applyTheme(e){for(const[t,o]of Object.entries(e))this.root.style.setProperty(t.startsWith("--")?t:`--smdx-${t}`,o)}}const p={heading:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M4 12h16M4 6v12M20 6v12"/></svg>',h1:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><text x="2" y="17" font-size="14" fill="currentColor" stroke="none" font-weight="bold">H1</text></svg>',h2:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><text x="2" y="17" font-size="14" fill="currentColor" stroke="none" font-weight="bold">H2</text></svg>',h3:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><text x="2" y="17" font-size="14" fill="currentColor" stroke="none" font-weight="bold">H3</text></svg>',h4:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><text x="2" y="17" font-size="14" fill="currentColor" stroke="none" font-weight="bold">H4</text></svg>',h5:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><text x="2" y="17" font-size="14" fill="currentColor" stroke="none" font-weight="bold">H5</text></svg>',h6:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><text x="2" y="17" font-size="14" fill="currentColor" stroke="none" font-weight="bold">H6</text></svg>',bold:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M6 4h8a4 4 0 014 4 4 4 0 01-4 4H6zM6 12h9a4 4 0 014 4 4 4 0 01-4 4H6z"/></svg>',italic:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="19" y1="4" x2="10" y2="4"/><line x1="14" y1="20" x2="5" y2="20"/><line x1="15" y1="4" x2="9" y2="20"/></svg>',strikethrough:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M16 4H9a3 3 0 00-3 3v0a3 3 0 003 3h6a3 3 0 013 3v0a3 3 0 01-3 3H8"/><line x1="4" y1="12" x2="20" y2="12"/></svg>',quote:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 21c3 0 7-1 7-8V5c0-1.25-.756-2.017-2-2H4c-1.25 0-2 .75-2 1.972V11c0 1.25.75 2 2 2 1 0 1 0 1 1v1c0 1-1 2-2 2s-1 .008-1 1.031V21z"/><path d="M15 21c3 0 7-1 7-8V5c0-1.25-.757-2.017-2-2h-4c-1.25 0-2 .75-2 1.972V11c0 1.25.75 2 2 2h.75c0 2.25.25 4-2.75 4v3z"/></svg>',link:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M10 13a5 5 0 007.54.54l3-3a5 5 0 00-7.07-7.07l-1.72 1.71"/><path d="M14 11a5 5 0 00-7.54-.54l-3 3a5 5 0 007.07 7.07l1.71-1.71"/></svg>',image:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="18" height="18" rx="2"/><circle cx="8.5" cy="8.5" r="1.5"/><polyline points="21 15 16 10 5 21"/></svg>',code:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="16 18 22 12 16 6"/><polyline points="8 6 2 12 8 18"/></svg>',codeBlock:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="2" y="3" width="20" height="18" rx="2"/><polyline points="10 8 6 12 10 16"/><polyline points="14 8 18 12 14 16"/></svg>',unorderedList:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="8" y1="6" x2="21" y2="6"/><line x1="8" y1="12" x2="21" y2="12"/><line x1="8" y1="18" x2="21" y2="18"/><circle cx="4" cy="6" r="1" fill="currentColor"/><circle cx="4" cy="12" r="1" fill="currentColor"/><circle cx="4" cy="18" r="1" fill="currentColor"/></svg>',orderedList:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="10" y1="6" x2="21" y2="6"/><line x1="10" y1="12" x2="21" y2="12"/><line x1="10" y1="18" x2="21" y2="18"/><text x="2" y="9" font-size="8" fill="currentColor" stroke="none">1</text><text x="2" y="15" font-size="8" fill="currentColor" stroke="none">2</text><text x="2" y="21" font-size="8" fill="currentColor" stroke="none">3</text></svg>',taskList:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="5" width="6" height="6" rx="1"/><path d="M5 8l1 1 2-2"/><line x1="13" y1="8" x2="21" y2="8"/><rect x="3" y="13" width="6" height="6" rx="1"/><line x1="13" y1="16" x2="21" y2="16"/></svg>',table:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="18" height="18" rx="2"/><line x1="3" y1="9" x2="21" y2="9"/><line x1="3" y1="15" x2="21" y2="15"/><line x1="9" y1="3" x2="9" y2="21"/><line x1="15" y1="3" x2="15" y2="21"/></svg>',highlight:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 20h9"/><path d="M16.5 3.5a2.121 2.121 0 013 3L7 19l-4 1 1-4L16.5 3.5z"/></svg>',admonition:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="12"/><line x1="12" y1="16" x2="12.01" y2="16"/></svg>',tab:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="2" y="6" width="20" height="14" rx="2"/><path d="M2 10h20"/><path d="M5 6V4a2 2 0 012-2h4a2 2 0 012 2v2"/></svg>',imageBackground:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="2" y="2" width="20" height="20" rx="2"/><rect x="5" y="5" width="14" height="14" rx="1" stroke-dasharray="4,2"/><circle cx="12" cy="12" r="3"/></svg>',imageFrame:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="2" y="2" width="20" height="20" rx="2"/><rect x="5" y="5" width="14" height="14" rx="1"/></svg>',accordion:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="18" height="6" rx="1"/><path d="M15 6l-3 3-3-3"/><rect x="3" y="13" width="18" height="6" rx="1"/></svg>',accordionGroup:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="2" width="18" height="5" rx="1"/><rect x="3" y="9" width="18" height="5" rx="1"/><rect x="3" y="16" width="18" height="5" rx="1"/></svg>',multiColumn:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="7" height="18" rx="1"/><rect x="14" y="3" width="7" height="18" rx="1"/></svg>',card:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="18" height="18" rx="3"/><line x1="7" y1="10" x2="17" y2="10"/><line x1="7" y1="14" x2="13" y2="14"/></svg>',cardGroup:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="2" y="3" width="8" height="8" rx="2"/><rect x="14" y="3" width="8" height="8" rx="2"/><rect x="2" y="13" width="8" height="8" rx="2"/><rect x="14" y="13" width="8" height="8" rx="2"/></svg>',step:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="5" r="3"/><circle cx="12" cy="12" r="3"/><circle cx="12" cy="19" r="3"/><line x1="12" y1="8" x2="12" y2="9"/><line x1="12" y1="15" x2="12" y2="16"/></svg>',tip:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 18h6M10 22h4M12 2a7 7 0 017 7c0 2.38-1.19 4.47-3 5.74V17H8v-2.26C6.19 13.47 5 11.38 5 9a7 7 0 017-7z"/></svg>',container:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="18" height="18" rx="2" stroke-dasharray="4,2"/></svg>',copyText:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="9" y="9" width="13" height="13" rx="2"/><path d="M5 15H4a2 2 0 01-2-2V4a2 2 0 012-2h9a2 2 0 012 2v1"/></svg>',tooltip:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="18" height="12" rx="2"/><path d="M9 15l3 4 3-4"/></svg>',embedVideo:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="2" y="4" width="20" height="16" rx="2"/><polygon points="10,8 16,12 10,16"/></svg>',embedOthers:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><path d="M2 12h20"/><ellipse cx="12" cy="12" rx="4" ry="10"/></svg>',mermaid:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="2" y="2" width="8" height="6" rx="1"/><rect x="14" y="16" width="8" height="6" rx="1"/><rect x="14" y="2" width="8" height="6" rx="1"/><path d="M10 5h4M6 8v8l12-4"/></svg>',emoji:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><path d="M8 14s1.5 2 4 2 4-2 4-2"/><line x1="9" y1="9" x2="9.01" y2="9"/><line x1="15" y1="9" x2="15.01" y2="9"/></svg>',formula:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><text x="3" y="17" font-size="14" fill="currentColor" stroke="none" font-style="italic">∑x</text></svg>',insert:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="16"/><line x1="8" y1="12" x2="16" y2="12"/></svg>',scrollSync:'<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M4 12h16M12 4v16"/></svg>'};function P(){return{name:"heading",toolbarItems:[{id:"heading",label:"Heading",icon:p.heading,tooltip:"Heading",children:[1,2,3,4,5,6].map(r=>({id:`h${r}`,label:`Heading ${r}`,icon:p[`h${r}`],tooltip:`Heading ${r}`,action:({editor:e})=>{const t="#".repeat(r)+" ",i=e.getCurrentLine().replace(/^#{1,6}\s*/,"");e.replaceCurrentLine(t+i)}})),action:({editor:r})=>{const e=r.getCurrentLine(),t=e.match(/^(#{1,6})\s/);if(t){const o=Math.min(t[1].length+1,6),i=e.replace(/^#{1,6}\s*/,"");r.replaceCurrentLine("#".repeat(o)+" "+i)}else r.replaceCurrentLine("# "+e)}}],shortcuts:[{key:"Ctrl+1",action:({editor:r})=>r.replaceCurrentLine("# "+r.getCurrentLine().replace(/^#{1,6}\s*/,"")),description:"Heading 1"},{key:"Ctrl+2",action:({editor:r})=>r.replaceCurrentLine("## "+r.getCurrentLine().replace(/^#{1,6}\s*/,"")),description:"Heading 2"},{key:"Ctrl+3",action:({editor:r})=>r.replaceCurrentLine("### "+r.getCurrentLine().replace(/^#{1,6}\s*/,"")),description:"Heading 3"}]}}function A(){return{name:"bold",toolbarItems:[{id:"bold",label:"Bold",icon:p.bold,tooltip:"Bold",shortcutLabel:"⌘B",action:({editor:r})=>r.wrapSelection("**","**"),isActive:({selection:r})=>{const{beforeText:e,afterText:t,text:o}=r;return e.endsWith("**")&&t.startsWith("**")||/^\*\*.+\*\*$/.test(o)}}],shortcuts:[{key:"Ctrl+b",action:({editor:r})=>r.wrapSelection("**","**"),description:"Bold"}]}}function D(){return{name:"italic",toolbarItems:[{id:"italic",label:"Italic",icon:p.italic,tooltip:"Italic",shortcutLabel:"⌘I",action:({editor:r})=>r.wrapSelection("*","*"),isActive:({selection:r})=>{const{beforeText:e,afterText:t,text:o}=r;return e.endsWith("*")&&!e.endsWith("**")&&t.startsWith("*")&&!t.startsWith("**")||/^\*[^*]+\*$/.test(o)}}],shortcuts:[{key:"Ctrl+i",action:({editor:r})=>r.wrapSelection("*","*"),description:"Italic"}]}}function H(){return{name:"strikethrough",toolbarItems:[{id:"strikethrough",label:"Strikethrough",icon:p.strikethrough,tooltip:"Strikethrough",shortcutLabel:"⌘⇧X",action:({editor:r})=>r.wrapSelection("~~","~~")}],shortcuts:[{key:"Ctrl+Shift+x",action:({editor:r})=>r.wrapSelection("~~","~~"),description:"Strikethrough"}]}}function z(){return{name:"quote",toolbarItems:[{id:"quote",label:"Quote",icon:p.quote,tooltip:"Blockquote",shortcutLabel:"⌘⇧.",action:({editor:r})=>{const e=r.getCurrentLine();e.startsWith("> ")?r.replaceCurrentLine(e.substring(2)):r.replaceCurrentLine("> "+e)}}],shortcuts:[{key:"Ctrl+Shift+.",action:({editor:r})=>{const e=r.getCurrentLine();r.replaceCurrentLine(e.startsWith("> ")?e.substring(2):"> "+e)},description:"Blockquote"}]}}function R(){return{name:"link",toolbarItems:[{id:"link",label:"Link",icon:p.link,tooltip:"Insert Link",shortcutLabel:"⌘K",action:({editor:r,selection:e})=>{e.text?r.replaceSelection(`[${e.text}](url)`):r.insertText("[link text](url)")}}],shortcuts:[{key:"Ctrl+k",action:({editor:r,selection:e})=>{e.text?r.replaceSelection(`[${e.text}](url)`):r.insertText("[link text](url)")},description:"Insert Link"}]}}function N(){return{name:"image",toolbarItems:[{id:"image",label:"Image",icon:p.image,tooltip:"Insert Image",action:({editor:r,selection:e})=>{const t=e.text||"alt text";r.replaceSelection(``)}}]}}function O(){return{name:"code",toolbarItems:[{id:"code",label:"Inline Code",icon:p.code,tooltip:"Inline Code",shortcutLabel:"⌘E",action:({editor:r})=>r.wrapSelection("`","`")},{id:"codeBlock",label:"Code Block",icon:p.codeBlock,tooltip:"Code Block",shortcutLabel:"⌘⇧C",action:({editor:r,selection:e})=>{r.insertBlock("```language\n"+(e.text||"code here")+"\n```")}}],shortcuts:[{key:"Ctrl+e",action:({editor:r})=>r.wrapSelection("`","`"),description:"Inline Code"},{key:"Ctrl+Shift+c",action:({editor:r,selection:e})=>{r.insertBlock("```language\n"+(e.text||"code here")+"\n```")},description:"Code Block"}]}}function j(){return{name:"unorderedList",toolbarItems:[{id:"unorderedList",label:"Unordered List",icon:p.unorderedList,tooltip:"Bullet List",action:({editor:r})=>{const e=r.getCurrentLine();e.match(/^[-*]\s/)?r.replaceCurrentLine(e.replace(/^[-*]\s/,"")):r.replaceCurrentLine("- "+e)}}]}}function G(){return{name:"orderedList",toolbarItems:[{id:"orderedList",label:"Ordered List",icon:p.orderedList,tooltip:"Numbered List",action:({editor:r})=>{const e=r.getCurrentLine();e.match(/^\d+\.\s/)?r.replaceCurrentLine(e.replace(/^\d+\.\s/,"")):r.replaceCurrentLine("1. "+e)}}]}}function _(){return{name:"taskList",toolbarItems:[{id:"taskList",label:"Task List",icon:p.taskList,tooltip:"Task List",action:({editor:r})=>{const e=r.getCurrentLine();e.match(/^- \[[ x]\]\s/)?r.replaceCurrentLine(e.replace(/^- \[[ x]\]\s/,"")):r.replaceCurrentLine("- [ ] "+e)}}]}}function q(){return{name:"table",toolbarItems:[{id:"table",label:"Table",icon:p.table,tooltip:"Insert Table",action:({editor:r})=>{r.insertBlock(`| Header 1 | Header 2 | Header 3 |
|
|
17
|
+
| -------- | -------- | -------- |
|
|
18
|
+
| Cell 1 | Cell 2 | Cell 3 |
|
|
19
|
+
| Cell 4 | Cell 5 | Cell 6 |`)}}]}}const Le=[{name:"Yellow",color:"#fef08a",darkColor:"#854d0e",class:"yellow"},{name:"Green",color:"#bbf7d0",darkColor:"#166534",class:"green"},{name:"Blue",color:"#bfdbfe",darkColor:"#1e3a5f",class:"blue"},{name:"Purple",color:"#ddd6fe",darkColor:"#4c1d95",class:"purple"},{name:"Pink",color:"#fbcfe8",darkColor:"#831843",class:"pink"},{name:"Red",color:"#fecaca",darkColor:"#991b1b",class:"red"},{name:"Orange",color:"#fed7aa",darkColor:"#9a3412",class:"orange"},{name:"Cyan",color:"#a5f3fc",darkColor:"#155e75",class:"cyan"}];function F(){return{name:"highlight",toolbarItems:[{id:"highlight",label:"Highlight",icon:p.highlight,tooltip:"Highlight Text",children:Le.map(r=>({id:`highlight-${r.class}`,label:r.name,icon:`<span class="smdx-color-dot" style="background:${r.color}"></span>`,tooltip:`${r.name} Highlight`,action:({editor:e})=>{e.wrapSelection(`<Highlight color="${r.class}">`,"</Highlight>")}})),action:({editor:r})=>{r.wrapSelection('<Highlight color="yellow">',"</Highlight>")}}],renderers:[{name:"highlight",pattern:/<Highlight\s+color="([^"]+)">([\s\S]*?)<\/Highlight>/g,render:r=>{const e=r.match(/<Highlight\s+color="([^"]+)">([\s\S]*?)<\/Highlight>/);return e?`<mark class="smdx-highlight smdx-highlight-${e[1]}">${e[2]}</mark>`:r}}],styles:`
|
|
20
|
+
.smdx-highlight { padding: 2px 4px; border-radius: 3px; }
|
|
21
|
+
.smdx-highlight-yellow { background-color: #fef08a; }
|
|
22
|
+
.smdx-highlight-green { background-color: #bbf7d0; }
|
|
23
|
+
.smdx-highlight-blue { background-color: #bfdbfe; }
|
|
24
|
+
.smdx-highlight-purple { background-color: #ddd6fe; }
|
|
25
|
+
.smdx-highlight-pink { background-color: #fbcfe8; }
|
|
26
|
+
.smdx-highlight-red { background-color: #fecaca; }
|
|
27
|
+
.smdx-highlight-orange { background-color: #fed7aa; }
|
|
28
|
+
.smdx-highlight-cyan { background-color: #a5f3fc; }
|
|
29
|
+
.smdx-dark .smdx-highlight-yellow { background-color: #854d0e; color: #fef08a; }
|
|
30
|
+
.smdx-dark .smdx-highlight-green { background-color: #166534; color: #bbf7d0; }
|
|
31
|
+
.smdx-dark .smdx-highlight-blue { background-color: #1e3a5f; color: #bfdbfe; }
|
|
32
|
+
.smdx-dark .smdx-highlight-purple { background-color: #4c1d95; color: #ddd6fe; }
|
|
33
|
+
.smdx-dark .smdx-highlight-pink { background-color: #831843; color: #fbcfe8; }
|
|
34
|
+
.smdx-dark .smdx-highlight-red { background-color: #991b1b; color: #fecaca; }
|
|
35
|
+
.smdx-dark .smdx-highlight-orange { background-color: #9a3412; color: #fed7aa; }
|
|
36
|
+
.smdx-dark .smdx-highlight-cyan { background-color: #155e75; color: #a5f3fc; }
|
|
37
|
+
.smdx-color-dot { display: inline-block; width: 14px; height: 14px; border-radius: 50%; border: 1px solid rgba(0,0,0,0.15); vertical-align: middle; margin-right: 6px; }
|
|
38
|
+
`}}const V=[{type:"tip",label:"TIP",color:"#10b981",bg:"#ecfdf5",icon:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none"><circle cx="12" cy="12" r="10" fill="#10b981"/><path d="M9 12l2 2 4-4" stroke="#fff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>'},{type:"warning",label:"WARNING",color:"#f59e0b",bg:"#fffbeb",icon:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none"><path d="M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0z" fill="#f59e0b"/><path d="M12 9v4M12 17h.01" stroke="#fff" stroke-width="2" stroke-linecap="round"/></svg>'},{type:"caution",label:"CAUTION",color:"#f97316",bg:"#fff7ed",icon:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none"><circle cx="12" cy="12" r="10" fill="#f97316"/><path d="M12 8v4M12 16h.01" stroke="#fff" stroke-width="2" stroke-linecap="round"/></svg>'},{type:"danger",label:"DANGER",color:"#ef4444",bg:"#fef2f2",icon:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none"><circle cx="12" cy="12" r="10" fill="#ef4444"/><path d="M15 9l-6 6M9 9l6 6" stroke="#fff" stroke-width="2" stroke-linecap="round"/></svg>'},{type:"check",label:"CHECK",color:"#22c55e",bg:"#f0fdf4",icon:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none"><circle cx="12" cy="12" r="10" fill="#22c55e"/><path d="M8 12l3 3 5-5" stroke="#fff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>'},{type:"info",label:"INFO",color:"#3b82f6",bg:"#eff6ff",icon:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none"><circle cx="12" cy="12" r="10" fill="#3b82f6"/><path d="M12 16v-4M12 8h.01" stroke="#fff" stroke-width="2" stroke-linecap="round"/></svg>'},{type:"note",label:"NOTE",color:"#8b5cf6",bg:"#f5f3ff",icon:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none"><rect x="3" y="3" width="18" height="18" rx="3" fill="#8b5cf6"/><path d="M8 10h8M8 14h5" stroke="#fff" stroke-width="2" stroke-linecap="round"/></svg>'}];function W(){return{name:"admonition",toolbarItems:[{id:"admonition",label:"Admonition",icon:p.admonition,tooltip:"Admonition / Callout",children:V.map(r=>({id:`admonition-${r.type}`,label:r.label,icon:r.icon,tooltip:`${r.label} callout`,action:({editor:e})=>{e.insertBlock(`:::${r.type}
|
|
39
|
+
${r.label}: Your message here
|
|
40
|
+
:::`)}})),action:({editor:r})=>{r.insertBlock(`:::info
|
|
41
|
+
INFO: Your message here
|
|
42
|
+
:::`)}}],renderers:[{name:"admonition",pattern:/:::(tip|warning|caution|danger|check|info|note)(?:\[([^\]]*)\])?\n([\s\S]*?):::/g,render:r=>{const e=r.match(/:::(tip|warning|caution|danger|check|info|note)(?:\[([^\]]*)\])?\n([\s\S]*?):::/);if(!e)return r;const t=V.find(i=>i.type===e[1]),o=e[2]||t.label;return`<div class="smdx-admonition smdx-admonition-${e[1]}"><div class="smdx-admonition-title"><span class="smdx-admonition-icon">${t.icon}</span>${o}</div><div class="smdx-admonition-content">${e[3]}</div></div>`},priority:10}],styles:`
|
|
43
|
+
.smdx-admonition { padding: 14px 16px; border-radius: 6px; margin: 12px 0; border-left: 4px solid; }
|
|
44
|
+
.smdx-admonition-title { display: flex; align-items: center; gap: 8px; font-weight: 700; margin-bottom: 6px; font-size: 0.85em; text-transform: uppercase; letter-spacing: 0.02em; }
|
|
45
|
+
.smdx-admonition-icon { display: flex; align-items: center; flex-shrink: 0; }
|
|
46
|
+
.smdx-admonition-icon svg { display: block; }
|
|
47
|
+
.smdx-admonition-content { font-size: 0.95em; line-height: 1.6; color: var(--smdx-text, #1e293b); }
|
|
48
|
+
.smdx-admonition-content p { margin: 4px 0; }
|
|
49
|
+
.smdx-admonition-tip { border-left-color: #10b981; background: #ecfdf5; }
|
|
50
|
+
.smdx-admonition-tip .smdx-admonition-title { color: #10b981; }
|
|
51
|
+
.smdx-admonition-warning { border-left-color: #f59e0b; background: #fffbeb; }
|
|
52
|
+
.smdx-admonition-warning .smdx-admonition-title { color: #f59e0b; }
|
|
53
|
+
.smdx-admonition-caution { border-left-color: #f97316; background: #fff7ed; }
|
|
54
|
+
.smdx-admonition-caution .smdx-admonition-title { color: #f97316; }
|
|
55
|
+
.smdx-admonition-danger { border-left-color: #ef4444; background: #fef2f2; }
|
|
56
|
+
.smdx-admonition-danger .smdx-admonition-title { color: #ef4444; }
|
|
57
|
+
.smdx-admonition-check { border-left-color: #22c55e; background: #f0fdf4; }
|
|
58
|
+
.smdx-admonition-check .smdx-admonition-title { color: #22c55e; }
|
|
59
|
+
.smdx-admonition-info { border-left-color: #3b82f6; background: #eff6ff; }
|
|
60
|
+
.smdx-admonition-info .smdx-admonition-title { color: #3b82f6; }
|
|
61
|
+
.smdx-admonition-note { border-left-color: #8b5cf6; background: #f5f3ff; }
|
|
62
|
+
.smdx-admonition-note .smdx-admonition-title { color: #8b5cf6; }
|
|
63
|
+
.smdx-dark .smdx-admonition-tip { background: #052e16; }
|
|
64
|
+
.smdx-dark .smdx-admonition-warning { background: #451a03; }
|
|
65
|
+
.smdx-dark .smdx-admonition-caution { background: #431407; }
|
|
66
|
+
.smdx-dark .smdx-admonition-danger { background: #450a0a; }
|
|
67
|
+
.smdx-dark .smdx-admonition-check { background: #052e16; }
|
|
68
|
+
.smdx-dark .smdx-admonition-info { background: #172554; }
|
|
69
|
+
.smdx-dark .smdx-admonition-note { background: #2e1065; }
|
|
70
|
+
.smdx-dark .smdx-admonition-content { color: var(--smdx-text, #e2e8f0); }
|
|
71
|
+
`}}function Me(r){const e=r.split(`
|
|
72
|
+
`),t=e.filter(i=>i.trim().length>0),o=t.length>0?Math.min(...t.map(i=>i.match(/^\s*/)[0].length)):0;return o>0?e.map(i=>i.slice(o)).join(`
|
|
73
|
+
`).trim():r.trim()}function K(){return{name:"tab",toolbarItems:[{id:"tab",label:"Tab",icon:p.tab,tooltip:"Insert Tabs",action:({editor:r})=>{r.insertBlock(`<Tabs>
|
|
74
|
+
<Tab title="Tab 1">
|
|
75
|
+
Content for tab 1
|
|
76
|
+
</Tab>
|
|
77
|
+
<Tab title="Tab 2">
|
|
78
|
+
Content for tab 2
|
|
79
|
+
</Tab>
|
|
80
|
+
</Tabs>`)}}],renderers:[{name:"tabs",pattern:/<Tabs>([\s\S]*?)<\/Tabs>/g,render:r=>{const e=/<Tab\s+title="([^"]*)">([\s\S]*?)<\/Tab>/g;let t=[],o;for(;(o=e.exec(r))!==null;)t.push({title:o[1],content:Me(o[2])});if(t.length===0)return r;let s=`<div class="smdx-tabs" data-tab-id="${"tab-"+Math.random().toString(36).substring(2,8)}"><div class="smdx-tabs-header">`;return t.forEach((n,a)=>{s+=`<button class="smdx-tab-btn${a===0?" smdx-active":""}" data-smdx-tab-btn="true" data-tab-index="${a}">${n.title}</button>`}),s+="</div>",t.forEach((n,a)=>{s+=`<div class="smdx-tab-panel" style="display:${a===0?"block":"none"}">${n.content}</div>`}),s+="</div>",s},priority:15}],styles:`
|
|
81
|
+
.smdx-tabs { border: 1px solid var(--smdx-border, #e2e8f0); border-radius: 8px; overflow: hidden; margin: 12px 0; }
|
|
82
|
+
.smdx-tabs-header { display: flex; background: var(--smdx-bg-muted, #f8fafc); border-bottom: 1px solid var(--smdx-border, #e2e8f0); }
|
|
83
|
+
.smdx-tab-btn { padding: 8px 16px; border: none; background: none; cursor: pointer; font-size: 0.9em; color: var(--smdx-text-muted, #64748b); border-bottom: 2px solid transparent; transition: all 0.15s; }
|
|
84
|
+
.smdx-tab-btn:hover { color: var(--smdx-text, #1e293b); }
|
|
85
|
+
.smdx-tab-btn.smdx-active { color: var(--smdx-primary, #6366f1); border-bottom-color: var(--smdx-primary, #6366f1); background: var(--smdx-bg, #fff); }
|
|
86
|
+
.smdx-tab-panel { padding: 16px; }
|
|
87
|
+
`}}function U(){return{name:"imageBackground",toolbarItems:[{id:"imageBackground",label:"Image Background",icon:p.imageBackground,tooltip:"Image with Background",action:({editor:r})=>{r.insertBlock(`<ImageBackground src="image-url" alt="description" background="#f0f0f0">
|
|
88
|
+
Content overlaying the image
|
|
89
|
+
</ImageBackground>`)}}],renderers:[{name:"imageBackground",pattern:/<ImageBackground\s+src="([^"]*)"(?:\s+alt="([^"]*)")?(?:\s+background="([^"]*)")?\s*>([\s\S]*?)<\/ImageBackground>/g,render:r=>{const e=r.match(/<ImageBackground\s+src="([^"]*)"(?:\s+alt="([^"]*)")?(?:\s+background="([^"]*)")?\s*>([\s\S]*?)<\/ImageBackground>/);return e?`<div class="smdx-image-bg" style="${e[3]?`background-image:url(${e[1]});background-color:${e[3]}`:`background-image:url(${e[1]})`}">
|
|
90
|
+
<div class="smdx-image-bg-overlay">${e[4].trim()}</div>
|
|
91
|
+
</div>`:r}}],styles:`
|
|
92
|
+
.smdx-image-bg { background-size: cover; background-position: center; border-radius: 8px; overflow: hidden; min-height: 200px; display: flex; align-items: center; justify-content: center; margin: 12px 0; background-color: var(--smdx-bg-muted, #f0f0f0); border: 1px solid var(--smdx-border, #e2e8f0); }
|
|
93
|
+
.smdx-image-bg-overlay { background: rgba(0,0,0,0.5); color: white; padding: 24px; width: 100%; text-align: center; }
|
|
94
|
+
.smdx-dark .smdx-image-bg-overlay { background: rgba(0,0,0,0.6); }
|
|
95
|
+
`}}function Y(){return{name:"imageFrame",toolbarItems:[{id:"imageFrame",label:"Image Frame",icon:p.imageFrame,tooltip:"Image in Frame",action:({editor:r})=>{r.insertBlock('<ImageFrame src="image-url" alt="description" caption="Image caption" />')}}],renderers:[{name:"imageFrame",pattern:/<ImageFrame\s+src="([^"]*)"(?:\s+alt="([^"]*)")?(?:\s+caption="([^"]*)")?\s*\/>/g,render:r=>{const e=r.match(/<ImageFrame\s+src="([^"]*)"(?:\s+alt="([^"]*)")?(?:\s+caption="([^"]*)")?\s*\/>/);return e?`<figure class="smdx-image-frame">
|
|
96
|
+
<img src="${e[1]}" alt="${e[2]||""}" />
|
|
97
|
+
${e[3]?`<figcaption>${e[3]}</figcaption>`:""}
|
|
98
|
+
</figure>`:r}}],styles:`
|
|
99
|
+
.smdx-image-frame { border: 1px solid var(--smdx-border, #e2e8f0); border-radius: 8px; overflow: hidden; margin: 12px 0; padding: 8px; background: var(--smdx-bg-muted, #f8fafc); }
|
|
100
|
+
.smdx-image-frame img { width: 100%; border-radius: 4px; display: block; }
|
|
101
|
+
.smdx-image-frame figcaption { text-align: center; padding: 8px 0 4px; font-size: 0.85em; color: var(--smdx-text-muted, #64748b); }
|
|
102
|
+
`}}function X(r){const e=r.split(`
|
|
103
|
+
`),t=e.filter(i=>i.trim().length>0),o=t.length>0?Math.min(...t.map(i=>i.match(/^\s*/)[0].length)):0;return o>0?e.map(i=>i.slice(o)).join(`
|
|
104
|
+
`).trim():r.trim()}function J(){return{name:"accordion",toolbarItems:[{id:"accordion",label:"Accordion",icon:p.accordion,tooltip:"Insert Accordion",action:({editor:r})=>{r.insertBlock(`<Accordion title="Accordion Title" defaultOpen>
|
|
105
|
+
Your content here. You can include any markdown or components.
|
|
106
|
+
</Accordion>`)}}],renderers:[{name:"accordion",pattern:/<Accordion\s+title="([^"]*)"(\s+defaultOpen)?\s*>([\s\S]*?)<\/Accordion>/g,render:r=>{const e=r.match(/<Accordion\s+title="([^"]*)"(\s+defaultOpen)?\s*>([\s\S]*?)<\/Accordion>/);return e?`<details class="smdx-accordion"${e[2]?" open":""}><summary class="smdx-accordion-header"><span class="smdx-accordion-arrow"></span><span class="smdx-accordion-title">${e[1]}</span></summary><div class="smdx-accordion-content">${X(e[3])}</div></details>`:r},priority:12}],styles:`
|
|
107
|
+
.smdx-accordion { border: 1px solid var(--smdx-border, #e2e8f0); border-radius: 8px; margin: 8px 0; overflow: hidden; background: var(--smdx-bg, #fff); }
|
|
108
|
+
.smdx-accordion-header { padding: 14px 18px; cursor: pointer; display: flex; align-items: center; gap: 10px; font-weight: 600; font-size: 0.95em; user-select: none; list-style: none; color: var(--smdx-text, #1e293b); }
|
|
109
|
+
.smdx-accordion-header::-webkit-details-marker { display: none; }
|
|
110
|
+
.smdx-accordion-arrow { display: inline-block; width: 0; height: 0; border-left: 5px solid var(--smdx-text-muted, #64748b); border-top: 4px solid transparent; border-bottom: 4px solid transparent; transition: transform 0.2s; flex-shrink: 0; }
|
|
111
|
+
details[open] > .smdx-accordion-header .smdx-accordion-arrow { transform: rotate(90deg); }
|
|
112
|
+
.smdx-accordion-title { flex: 1; }
|
|
113
|
+
.smdx-accordion-content { padding: 14px 18px 18px 18px; border-top: 1px solid var(--smdx-border, #e2e8f0); }
|
|
114
|
+
.smdx-accordion-content p { margin: 6px 0; }
|
|
115
|
+
.smdx-accordion-content > :last-child { margin-bottom: 0; }
|
|
116
|
+
`}}function Z(){return{name:"accordionGroup",dependencies:["accordion"],toolbarItems:[{id:"accordionGroup",label:"Accordion Group",icon:p.accordionGroup,tooltip:"Insert Accordion Group",action:({editor:r})=>{r.insertBlock(`<AccordionGroup>
|
|
117
|
+
<Accordion title="Section 1" defaultOpen>
|
|
118
|
+
Content for section 1
|
|
119
|
+
</Accordion>
|
|
120
|
+
<Accordion title="Section 2">
|
|
121
|
+
Content for section 2
|
|
122
|
+
</Accordion>
|
|
123
|
+
<Accordion title="Section 3">
|
|
124
|
+
Content for section 3
|
|
125
|
+
</Accordion>
|
|
126
|
+
</AccordionGroup>`)}}],renderers:[{name:"accordionGroup",pattern:/<AccordionGroup>([\s\S]*?)<\/AccordionGroup>/g,render:r=>{const e=r.match(/<AccordionGroup>([\s\S]*?)<\/AccordionGroup>/);return e?`<div class="smdx-accordion-group">${e[1]}</div>`:r},priority:14}],styles:`
|
|
127
|
+
.smdx-accordion-group { display: flex; flex-direction: column; gap: 0; margin: 12px 0; }
|
|
128
|
+
.smdx-accordion-group > :not(.smdx-accordion) { display: none; }
|
|
129
|
+
.smdx-accordion-group .smdx-accordion { margin: 0; border-radius: 0; border-bottom: none; }
|
|
130
|
+
.smdx-accordion-group .smdx-accordion:first-of-type { border-radius: 8px 8px 0 0; }
|
|
131
|
+
.smdx-accordion-group .smdx-accordion:last-of-type { border-radius: 0 0 8px 8px; border-bottom: 1px solid var(--smdx-border, #e2e8f0); }
|
|
132
|
+
`}}function Q(){return{name:"multiColumn",toolbarItems:[{id:"multiColumn",label:"Columns",icon:p.multiColumn,tooltip:"Multiple Columns",children:[2,3,4,5].map(r=>({id:`columns-${r}`,label:`${r} Columns`,tooltip:`${r} column layout`,action:({editor:e})=>{const t=Array.from({length:r},(o,i)=>` <Column>
|
|
133
|
+
Column ${i+1} content
|
|
134
|
+
</Column>`).join(`
|
|
135
|
+
`);e.insertBlock(`<Columns count="${r}">
|
|
136
|
+
${t}
|
|
137
|
+
</Columns>`)}})),action:({editor:r})=>{r.insertBlock(`<Columns count="2">
|
|
138
|
+
<Column>
|
|
139
|
+
Column 1 content
|
|
140
|
+
</Column>
|
|
141
|
+
<Column>
|
|
142
|
+
Column 2 content
|
|
143
|
+
</Column>
|
|
144
|
+
</Columns>`)}}],renderers:[{name:"columns",pattern:/<Columns\s+count="(\d+)">([\s\S]*?)<\/Columns>/g,render:r=>{const e=r.match(/<Columns\s+count="(\d+)">([\s\S]*?)<\/Columns>/);if(!e)return r;const t=parseInt(e[1]),o=/<Column>([\s\S]*?)<\/Column>/g;let i=[],s;for(;(s=o.exec(e[2]))!==null;)i.push(X(s[1]));let n=`<div class="smdx-columns" style="grid-template-columns:repeat(${t},1fr)">`;for(const a of i)n+=`<div class="smdx-column">${a}</div>`;return n+="</div>",n},priority:13}],styles:`
|
|
145
|
+
.smdx-columns { display: grid; gap: 16px; margin: 12px 0; }
|
|
146
|
+
.smdx-column { padding: 12px; border: 1px solid var(--smdx-border, #e2e8f0); border-radius: 6px; }
|
|
147
|
+
`}}function Ie(r){const e=r.split(`
|
|
148
|
+
`),t=e.filter(i=>i.trim().length>0),o=t.length>0?Math.min(...t.map(i=>i.match(/^\s*/)[0].length)):0;return o>0?e.map(i=>i.slice(o)).join(`
|
|
149
|
+
`).trim():r.trim()}function ee(){return{name:"card",toolbarItems:[{id:"card",label:"Card",icon:p.card,tooltip:"Insert Card",action:({editor:r})=>{r.insertBlock(`<Card title="Card Title" icon="📄" href="/link">
|
|
150
|
+
Card description or content goes here.
|
|
151
|
+
</Card>`)}}],renderers:[{name:"card",pattern:/<Card\s+title="([^"]*)"(?:\s+icon="([^"]*)")?(?:\s+href="([^"]*)")?\s*>([\s\S]*?)<\/Card>/g,render:r=>{const e=r.match(/<Card\s+title="([^"]*)"(?:\s+icon="([^"]*)")?(?:\s+href="([^"]*)")?\s*>([\s\S]*?)<\/Card>/);if(!e)return r;const t=e[3]?"a":"div",o=e[3]?` href="${e[3]}" target="_blank" rel="noopener noreferrer"`:"",i=e[2]?`<span class="smdx-card-icon">${e[2]}</span>`:"",s=e[3]?'<svg class="smdx-card-arrow" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 18l6-6-6-6"/></svg>':"";return`<${t} class="smdx-card"${o}><div class="smdx-card-header">${i}<span class="smdx-card-title">${e[1]}</span>${s}</div><div class="smdx-card-content">${Ie(e[4])}</div></${t}>`},priority:11}],styles:`
|
|
152
|
+
.smdx-card { display: block; border: 1px solid var(--smdx-border, #e2e8f0); border-radius: 10px; padding: 16px 20px; margin: 8px 0; text-decoration: none; color: inherit; transition: border-color 0.2s, box-shadow 0.2s, background 0.2s; background: var(--smdx-bg, #fff); }
|
|
153
|
+
a.smdx-card { cursor: pointer; }
|
|
154
|
+
a.smdx-card:hover { border-color: var(--smdx-primary, #6366f1); box-shadow: 0 2px 12px rgba(99,102,241,0.1); background: var(--smdx-bg-muted, #f8fafc); }
|
|
155
|
+
.smdx-card-header { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; }
|
|
156
|
+
.smdx-card-icon { font-size: 1.25em; flex-shrink: 0; }
|
|
157
|
+
.smdx-card-title { font-weight: 700; font-size: 1em; color: var(--smdx-text, #1e293b); }
|
|
158
|
+
.smdx-card-arrow { margin-left: auto; flex-shrink: 0; color: var(--smdx-text-muted, #94a3b8); transition: transform 0.2s, color 0.2s; }
|
|
159
|
+
a.smdx-card:hover .smdx-card-arrow { transform: translateX(2px); color: var(--smdx-primary, #6366f1); }
|
|
160
|
+
.smdx-card-content { font-size: 0.9em; color: var(--smdx-text-muted, #64748b); line-height: 1.5; }
|
|
161
|
+
`}}function te(){return{name:"cardGroup",dependencies:["card"],toolbarItems:[{id:"cardGroup",label:"Card Group",icon:p.cardGroup,tooltip:"Insert Card Group",action:({editor:r})=>{r.insertBlock(`<CardGroup cols="2">
|
|
162
|
+
<Card title="Card 1" icon="📄">
|
|
163
|
+
Description for card 1
|
|
164
|
+
</Card>
|
|
165
|
+
<Card title="Card 2" icon="🔧">
|
|
166
|
+
Description for card 2
|
|
167
|
+
</Card>
|
|
168
|
+
<Card title="Card 3" icon="🚀">
|
|
169
|
+
Description for card 3
|
|
170
|
+
</Card>
|
|
171
|
+
<Card title="Card 4" icon="💡">
|
|
172
|
+
Description for card 4
|
|
173
|
+
</Card>
|
|
174
|
+
</CardGroup>`)}}],renderers:[{name:"cardGroup",pattern:/<CardGroup(?:\s+cols="(\d+)")?\s*>([\s\S]*?)<\/CardGroup>/g,render:r=>{const e=r.match(/<CardGroup(?:\s+cols="(\d+)")?\s*>([\s\S]*?)<\/CardGroup>/);return e?`<div class="smdx-card-group" style="grid-template-columns:repeat(${e[1]||"2"},1fr)">${e[2]}</div>`:r},priority:13}],styles:`
|
|
175
|
+
.smdx-card-group { display: grid; gap: 12px; margin: 12px 0; }
|
|
176
|
+
.smdx-card-group .smdx-card { margin: 0; }
|
|
177
|
+
`}}function re(r){const e=r.split(`
|
|
178
|
+
`),t=e.filter(i=>i.trim().length>0),o=t.length>0?Math.min(...t.map(i=>i.match(/^\s*/)[0].length)):0;return o>0?e.map(i=>i.slice(o)).join(`
|
|
179
|
+
`).trim():r.trim()}function oe(){return{name:"step",toolbarItems:[{id:"steps",label:"Steps",icon:p.step,tooltip:"Insert Steps",action:({editor:r})=>{r.insertBlock(`<Steps>
|
|
180
|
+
<Step title="First Step">
|
|
181
|
+
These are instructions or content that only pertain to the first step.
|
|
182
|
+
</Step>
|
|
183
|
+
<Step title="Second Step">
|
|
184
|
+
These are instructions or content that only pertain to the second step.
|
|
185
|
+
</Step>
|
|
186
|
+
<Step title="Third Step">
|
|
187
|
+
These are instructions or content that only pertain to the third step.
|
|
188
|
+
</Step>
|
|
189
|
+
</Steps>`)}}],renderers:[{name:"steps",pattern:/<Steps>([\s\S]*?)<\/Steps>/g,render:r=>{const e=r.match(/<Steps>([\s\S]*?)<\/Steps>/);if(!e)return r;const t=/<Step\s+title="([^"]*)">([\s\S]*?)<\/Step>/g;let o=[],i;for(;(i=t.exec(e[1]))!==null;)o.push({title:i[1],content:re(i[2])});let s='<div class="smdx-steps">';return o.forEach((n,a)=>{const d=a===o.length-1;s+=`<div class="smdx-step"><div class="smdx-step-indicator"><div class="smdx-step-number">${a+1}</div>${d?"":'<div class="smdx-step-line"></div>'}</div><div class="smdx-step-content"><div class="smdx-step-title">${n.title}</div><div class="smdx-step-body">${n.content}</div></div></div>`}),s+="</div>",s},priority:15}],styles:`
|
|
190
|
+
.smdx-steps { margin: 20px 0; }
|
|
191
|
+
.smdx-step { display: flex; gap: 20px; position: relative; }
|
|
192
|
+
.smdx-step-indicator { display: flex; flex-direction: column; align-items: center; flex-shrink: 0; min-width: 34px; position: relative; }
|
|
193
|
+
.smdx-step-number { width: 34px; height: 34px; min-width: 34px; min-height: 34px; border-radius: 50%; background: var(--smdx-bg-muted, #f1f5f9); color: var(--smdx-text-muted, #475569); display: flex; align-items: center; justify-content: center; font-weight: 600; font-size: 0.85em; border: 1px solid var(--smdx-border, #e2e8f0); position: relative; z-index: 1; box-sizing: border-box; }
|
|
194
|
+
.smdx-step-line { width: 2px; flex: 1; background: var(--smdx-border, #e2e8f0); min-height: 100%; }
|
|
195
|
+
.smdx-step-content { flex: 1; padding-bottom: 32px; min-width: 0; }
|
|
196
|
+
.smdx-step:last-child .smdx-step-content { padding-bottom: 0; }
|
|
197
|
+
.smdx-step-title { font-weight: 700; font-size: 1.05em; color: var(--smdx-text, #1e293b); margin-bottom: 8px; }
|
|
198
|
+
.smdx-step-body { color: var(--smdx-text-muted, #64748b); font-size: 0.95em; line-height: 1.7; }
|
|
199
|
+
`}}const ie=[{type:"good",label:"Good",color:"#22c55e",bg:"#f0fdf4",icon:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none"><circle cx="12" cy="12" r="10" fill="#22c55e"/><path d="M8 12l3 3 5-5" stroke="#fff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>'},{type:"bad",label:"Bad",color:"#ef4444",bg:"#fef2f2",icon:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none"><circle cx="12" cy="12" r="10" fill="#ef4444"/><path d="M15 9l-6 6M9 9l6 6" stroke="#fff" stroke-width="2" stroke-linecap="round"/></svg>'},{type:"info",label:"Info",color:"#3b82f6",bg:"#eff6ff",icon:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none"><circle cx="12" cy="12" r="10" fill="#3b82f6"/><path d="M12 16v-4M12 8h.01" stroke="#fff" stroke-width="2" stroke-linecap="round"/></svg>'}];function se(){return{name:"tip",toolbarItems:[{id:"tip",label:"Tip",icon:p.tip,tooltip:"Insert Tip",children:ie.map(r=>({id:`tip-${r.type}`,label:r.label,icon:r.icon,tooltip:`${r.label} tip`,action:({editor:e})=>{e.insertBlock(`<Tip${r.type.charAt(0).toUpperCase()+r.type.slice(1)}>Your tip message here</Tip${r.type.charAt(0).toUpperCase()+r.type.slice(1)}>`)}})),action:({editor:r})=>{r.insertBlock("<TipGood>Your tip message here</TipGood>")}}],renderers:ie.map(r=>({name:`tip-${r.type}`,pattern:new RegExp(`<Tip${r.type.charAt(0).toUpperCase()+r.type.slice(1)}>([\\s\\S]*?)<\\/Tip${r.type.charAt(0).toUpperCase()+r.type.slice(1)}>`,"g"),render:e=>{const t=`Tip${r.type.charAt(0).toUpperCase()+r.type.slice(1)}`,o=new RegExp(`<${t}>([\\s\\S]*?)<\\/${t}>`),i=e.match(o);return i?`<div class="smdx-tip smdx-tip-${r.type}"><span class="smdx-tip-icon">${r.icon}</span><span class="smdx-tip-text">${i[1].trim()}</span></div>`:e},priority:10})),styles:`
|
|
200
|
+
.smdx-tip { display: flex; align-items: flex-start; gap: 10px; padding: 12px 16px; border-radius: 6px; margin: 8px 0; font-size: 0.95em; border-left: 4px solid; }
|
|
201
|
+
.smdx-tip-icon { flex-shrink: 0; display: flex; align-items: center; margin-top: 1px; }
|
|
202
|
+
.smdx-tip-icon svg { display: block; }
|
|
203
|
+
.smdx-tip-text { flex: 1; line-height: 1.5; }
|
|
204
|
+
.smdx-tip-good { border-left-color: #22c55e; background: #f0fdf4; }
|
|
205
|
+
.smdx-tip-bad { border-left-color: #ef4444; background: #fef2f2; }
|
|
206
|
+
.smdx-tip-info { border-left-color: #3b82f6; background: #eff6ff; }
|
|
207
|
+
.smdx-dark .smdx-tip-good { background: #052e16; }
|
|
208
|
+
.smdx-dark .smdx-tip-bad { background: #450a0a; }
|
|
209
|
+
.smdx-dark .smdx-tip-info { background: #172554; }
|
|
210
|
+
`}}function ne(){return{name:"container",toolbarItems:[{id:"container",label:"Container",icon:p.container,tooltip:"Insert Container",action:({editor:r})=>{r.insertBlock(`<Container>
|
|
211
|
+
Content inside a styled container.
|
|
212
|
+
</Container>`)}}],renderers:[{name:"container",pattern:/<Container(?:\s+title="([^"]*)")?>([\s\S]*?)<\/Container>/g,render:r=>{const e=r.match(/<Container(?:\s+title="([^"]*)")?>([\s\S]*?)<\/Container>/);return e?`<div class="smdx-container">${e[1]?`<div class="smdx-container-title">${e[1]}</div>`:""}<div class="smdx-container-content">${re(e[2])}</div></div>`:r}}],styles:`
|
|
213
|
+
.smdx-container { border: 1px solid var(--smdx-border, #e2e8f0); border-radius: 8px; padding: 16px; margin: 12px 0; background: var(--smdx-bg-muted, #f8fafc); }
|
|
214
|
+
.smdx-container-title { font-weight: 600; margin-bottom: 8px; padding-bottom: 8px; border-bottom: 1px solid var(--smdx-border, #e2e8f0); }
|
|
215
|
+
`}}function ae(){return{name:"copyText",toolbarItems:[{id:"copyText",label:"Copy Text",icon:p.copyText,tooltip:"Copyable Text Block",action:({editor:r})=>{r.insertBlock("<CopyText>Text that users can click to copy</CopyText>")}}],renderers:[{name:"copyText",pattern:/<CopyText>([\s\S]*?)<\/CopyText>/g,render:r=>{const e=r.match(/<CopyText>([\s\S]*?)<\/CopyText>/);if(!e)return r;const t=e[1].trim();return`<div class="smdx-copy-text" onclick="navigator.clipboard.writeText(this.dataset.text);this.classList.add('smdx-copied');setTimeout(()=>this.classList.remove('smdx-copied'),2000)" data-text="${t.replace(/"/g,""")}"><code class="smdx-copy-text-content">${t}</code><button class="smdx-copy-text-btn" type="button"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="9" y="9" width="13" height="13" rx="2"/><path d="M5 15H4a2 2 0 01-2-2V4a2 2 0 012-2h9a2 2 0 012 2v1"/></svg></button></div>`}}],styles:`
|
|
216
|
+
.smdx-copy-text { display: inline-flex; align-items: center; gap: 10px; padding: 8px 14px; background: var(--smdx-bg-muted, #f1f5f9); border: 1px solid var(--smdx-border, #e2e8f0); border-radius: 8px; cursor: pointer; transition: all 0.15s; font-size: 0.9em; margin: 6px 0; }
|
|
217
|
+
.smdx-copy-text:hover { border-color: var(--smdx-primary, #6366f1); }
|
|
218
|
+
.smdx-copy-text.smdx-copied { border-color: #22c55e; background: #f0fdf4; }
|
|
219
|
+
.smdx-copy-text-content { font-family: var(--smdx-font-mono, monospace); color: var(--smdx-text, #1e293b); flex: 1; }
|
|
220
|
+
.smdx-copy-text-btn { display: flex; align-items: center; justify-content: center; border: none; background: none; padding: 2px; cursor: pointer; color: var(--smdx-text-muted, #94a3b8); flex-shrink: 0; transition: color 0.15s; }
|
|
221
|
+
.smdx-copy-text:hover .smdx-copy-text-btn { color: var(--smdx-text, #1e293b); }
|
|
222
|
+
.smdx-copy-text.smdx-copied .smdx-copy-text-btn { color: #22c55e; }
|
|
223
|
+
.smdx-dark .smdx-copy-text.smdx-copied { background: #052e16; border-color: #166534; }
|
|
224
|
+
`}}function de(){return{name:"tooltip",toolbarItems:[{id:"tooltip",label:"Tooltip",icon:p.tooltip,tooltip:"Insert Tooltip",action:({editor:r})=>{const t=r.getSelection().text||"hover text";r.replaceSelection(`<Tooltip tip="Tooltip content">${t}</Tooltip>`)}}],renderers:[{name:"tooltip",pattern:/<Tooltip\s+tip="([^"]*)">([\s\S]*?)<\/Tooltip>/g,render:r=>{const e=r.match(/<Tooltip\s+tip="([^"]*)">([\s\S]*?)<\/Tooltip>/);return e?`<span class="smdx-tooltip-wrapper"><span class="smdx-tooltip-trigger">${e[2]}<span class="smdx-tooltip-popup">${e[1]}</span></span></span>`:r}}],styles:`
|
|
225
|
+
.smdx-tooltip-wrapper { position: relative; display: inline; }
|
|
226
|
+
.smdx-tooltip-trigger { position: relative; border-bottom: 1px dashed var(--smdx-primary, #6366f1); cursor: help; text-decoration: none; }
|
|
227
|
+
.smdx-tooltip-popup { visibility: hidden; opacity: 0; position: absolute; bottom: calc(100% + 8px); left: 50%; transform: translateX(-50%); padding: 6px 12px; background: #1e293b; color: #fff; border-radius: 6px; font-size: 0.8em; white-space: nowrap; transition: opacity 0.15s, visibility 0.15s; z-index: 1000; pointer-events: none; }
|
|
228
|
+
.smdx-tooltip-popup::after { content: ''; position: absolute; top: 100%; left: 50%; margin-left: -5px; border: 5px solid transparent; border-top-color: #1e293b; }
|
|
229
|
+
.smdx-tooltip-trigger:hover .smdx-tooltip-popup { visibility: visible; opacity: 1; }
|
|
230
|
+
.smdx-dark .smdx-tooltip-popup { background: #e2e8f0; color: #1e293b; }
|
|
231
|
+
.smdx-dark .smdx-tooltip-popup::after { border-top-color: #e2e8f0; }
|
|
232
|
+
`}}function le(){return{name:"embedVideo",toolbarItems:[{id:"embedVideo",label:"Embed Video",icon:p.embedVideo,tooltip:"Embed Video",children:[{id:"embed-youtube",label:"YouTube",tooltip:"Embed YouTube video",action:({editor:r})=>{r.insertBlock('<EmbedVideo type="youtube" src="https://www.youtube.com/watch?v=VIDEO_ID" />')}},{id:"embed-video-file",label:"Video File",tooltip:"Embed video file",action:({editor:r})=>{r.insertBlock('<EmbedVideo type="file" src="video.mp4" />')}}],action:({editor:r})=>{r.insertBlock('<EmbedVideo type="youtube" src="https://www.youtube.com/watch?v=VIDEO_ID" />')}}],renderers:[{name:"embedVideo",pattern:/<EmbedVideo\s+type="([^"]*)"(?:\s+src="([^"]*)")?\s*\/>/g,render:r=>{const e=r.match(/<EmbedVideo\s+type="([^"]*)"(?:\s+src="([^"]*)")?\s*\/>/);if(!e)return r;const t=e[1],o=e[2]||"";if(t==="youtube"){const i=o.match(/(?:v=|\/embed\/|youtu\.be\/)([\w-]+)/),s=i?i[1]:o;return`<div class="smdx-embed-video">
|
|
233
|
+
<iframe src="https://www.youtube.com/embed/${encodeURIComponent(s)}" frameborder="0" allowfullscreen allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"></iframe>
|
|
234
|
+
</div>`}return`<div class="smdx-embed-video">
|
|
235
|
+
<video controls src="${o}" class="smdx-video-player">
|
|
236
|
+
Your browser does not support the video tag.
|
|
237
|
+
</video>
|
|
238
|
+
</div>`}}],styles:`
|
|
239
|
+
.smdx-embed-video { position: relative; width: 100%; padding-top: 56.25%; margin: 12px 0; border-radius: 8px; overflow: hidden; background: #000; }
|
|
240
|
+
.smdx-embed-video iframe, .smdx-embed-video video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
|
|
241
|
+
`}}function ce(){return{name:"embedOthers",toolbarItems:[{id:"embedOthers",label:"Embed",icon:p.embedOthers,tooltip:"Embed External Content",children:[{id:"embed-github",label:"GitHub Gist",tooltip:"Embed GitHub Gist",action:({editor:r})=>{r.insertBlock('<Embed type="github" src="https://gist.github.com/USER/GIST_ID" />')}},{id:"embed-twitter",label:"Twitter/X Post",tooltip:"Embed Tweet",action:({editor:r})=>{r.insertBlock('<Embed type="twitter" src="https://twitter.com/user/status/TWEET_ID" />')}},{id:"embed-codepen",label:"CodePen",tooltip:"Embed CodePen",action:({editor:r})=>{r.insertBlock('<Embed type="codepen" src="https://codepen.io/user/pen/PEN_ID" />')}},{id:"embed-codesandbox",label:"CodeSandbox",tooltip:"Embed CodeSandbox",action:({editor:r})=>{r.insertBlock('<Embed type="codesandbox" src="https://codesandbox.io/s/SANDBOX_ID" />')}}],action:({editor:r})=>{r.insertBlock('<Embed type="github" src="https://gist.github.com/USER/GIST_ID" />')}}],renderers:[{name:"embedOthers",pattern:/<Embed\s+[^>]*?\/>/g,render:r=>{const e=r.match(/type="([^"]*)"/),t=r.match(/src="([^"]*)"/),o=r.match(/label="([^"]*)"/);if(!e)return r;const i=e[1],s=t?t[1]:"",n=o?o[1]:"";switch(i){case"github":return`<div class="smdx-embed smdx-embed-card"><div class="smdx-embed-card-icon"><svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor"><path d="M12 0C5.37 0 0 5.37 0 12c0 5.31 3.435 9.795 8.205 11.385.6.105.825-.255.825-.57 0-.285-.015-1.23-.015-2.235-3.015.555-3.795-.735-4.035-1.41-.135-.345-.72-1.41-1.23-1.695-.42-.225-1.02-.78-.015-.795.945-.015 1.62.87 1.845 1.23 1.08 1.815 2.805 1.305 3.495.99.105-.78.42-1.305.765-1.605-2.67-.3-5.46-1.335-5.46-5.925 0-1.305.465-2.385 1.23-3.225-.12-.3-.54-1.53.12-3.18 0 0 1.005-.315 3.3 1.23.96-.27 1.98-.405 3-.405s2.04.135 3 .405c2.295-1.56 3.3-1.23 3.3-1.23.66 1.65.24 2.88.12 3.18.765.84 1.23 1.905 1.23 3.225 0 4.605-2.805 5.625-5.475 5.925.435.375.81 1.095.81 2.22 0 1.605-.015 2.895-.015 3.3 0 .315.225.69.825.57A12.02 12.02 0 0024 12c0-6.63-5.37-12-12-12z"/></svg></div><div class="smdx-embed-card-body"><div class="smdx-embed-card-title">${n||"GitHub Gist"}</div><div class="smdx-embed-card-url">${s}</div></div><a href="${s}" target="_blank" rel="noopener noreferrer" class="smdx-embed-card-link">Open <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M18 13v6a2 2 0 01-2 2H5a2 2 0 01-2-2V8a2 2 0 012-2h6"/><polyline points="15 3 21 3 21 9"/><line x1="10" y1="14" x2="21" y2="3"/></svg></a></div>`;case"twitter":return`<div class="smdx-embed smdx-embed-card"><div class="smdx-embed-card-icon smdx-embed-twitter-icon"><svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"/></svg></div><div class="smdx-embed-card-body"><div class="smdx-embed-card-title">${n||"Post on X (Twitter)"}</div><div class="smdx-embed-card-url">${s}</div></div><a href="${s}" target="_blank" rel="noopener noreferrer" class="smdx-embed-card-link">Open <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M18 13v6a2 2 0 01-2 2H5a2 2 0 01-2-2V8a2 2 0 012-2h6"/><polyline points="15 3 21 3 21 9"/><line x1="10" y1="14" x2="21" y2="3"/></svg></a></div>`;case"codepen":{const a=s.match(/codepen\.io\/([^/]+)\/pen\/([^/?]+)/);return a?`<div class="smdx-embed smdx-embed-codepen"><iframe height="400" style="width:100%" scrolling="no" src="https://codepen.io/${encodeURIComponent(a[1])}/embed/${encodeURIComponent(a[2])}?default-tab=result" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true"></iframe></div>`:`<div class="smdx-embed smdx-embed-card"><div class="smdx-embed-card-icon"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polygon points="12 2 22 8.5 22 15.5 12 22 2 15.5 2 8.5 12 2"/><line x1="12" y1="22" x2="12" y2="15.5"/><polyline points="22 8.5 12 15.5 2 8.5"/></svg></div><div class="smdx-embed-card-body"><div class="smdx-embed-card-title">${n||"CodePen"}</div><div class="smdx-embed-card-url">${s}</div></div><a href="${s}" target="_blank" rel="noopener noreferrer" class="smdx-embed-card-link">Open <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M18 13v6a2 2 0 01-2 2H5a2 2 0 01-2-2V8a2 2 0 012-2h6"/><polyline points="15 3 21 3 21 9"/><line x1="10" y1="14" x2="21" y2="3"/></svg></a></div>`}case"codesandbox":{const a=s.split("/").pop()||"";return`<div class="smdx-embed smdx-embed-codesandbox"><iframe src="https://codesandbox.io/embed/${encodeURIComponent(a)}" style="width:100%;height:500px;border:0;border-radius:4px;overflow:hidden" allow="accelerometer; ambient-light-sensor; camera; encrypted-media; geolocation; gyroscope; hid; microphone; midi; payment; usb; vr; xr-spatial-tracking" sandbox="allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts"></iframe></div>`}default:return`<div class="smdx-embed smdx-embed-card"><div class="smdx-embed-card-icon"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M10 13a5 5 0 007.54.54l3-3a5 5 0 00-7.07-7.07l-1.72 1.71"/><path d="M14 11a5 5 0 00-7.54-.54l-3 3a5 5 0 007.07 7.07l1.71-1.71"/></svg></div><div class="smdx-embed-card-body"><div class="smdx-embed-card-title">${n||"Embedded Content"}</div><div class="smdx-embed-card-url">${s}</div></div><a href="${s}" target="_blank" rel="noopener noreferrer" class="smdx-embed-card-link">Open <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M18 13v6a2 2 0 01-2 2H5a2 2 0 01-2-2V8a2 2 0 012-2h6"/><polyline points="15 3 21 3 21 9"/><line x1="10" y1="14" x2="21" y2="3"/></svg></a></div>`}}}],styles:`
|
|
242
|
+
.smdx-embed { margin: 12px 0; border-radius: 8px; overflow: hidden; }
|
|
243
|
+
.smdx-embed iframe { border: 1px solid var(--smdx-border, #e2e8f0); border-radius: 8px; }
|
|
244
|
+
.smdx-embed-card { display: flex; align-items: center; gap: 14px; padding: 14px 18px; border: 1px solid var(--smdx-border, #e2e8f0); border-radius: 8px; background: var(--smdx-bg-muted, #f8fafc); transition: border-color 0.15s; }
|
|
245
|
+
.smdx-embed-card:hover { border-color: var(--smdx-primary, #6366f1); }
|
|
246
|
+
.smdx-embed-card-icon { width: 40px; height: 40px; border-radius: 8px; background: var(--smdx-bg, #fff); border: 1px solid var(--smdx-border, #e2e8f0); display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--smdx-text-muted, #64748b); }
|
|
247
|
+
.smdx-embed-twitter-icon { color: #000; }
|
|
248
|
+
.smdx-dark .smdx-embed-twitter-icon { color: #fff; }
|
|
249
|
+
.smdx-embed-card-body { flex: 1; min-width: 0; }
|
|
250
|
+
.smdx-embed-card-title { font-weight: 600; font-size: 0.9em; color: var(--smdx-text, #1e293b); }
|
|
251
|
+
.smdx-embed-card-url { font-size: 0.8em; color: var(--smdx-text-muted, #64748b); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: 2px; }
|
|
252
|
+
.smdx-embed-card-link { display: flex; align-items: center; gap: 4px; font-size: 0.8em; font-weight: 500; color: var(--smdx-primary, #6366f1); text-decoration: none; white-space: nowrap; flex-shrink: 0; padding: 6px 12px; border-radius: 6px; border: 1px solid var(--smdx-border, #e2e8f0); background: var(--smdx-bg, #fff); transition: background 0.15s; }
|
|
253
|
+
.smdx-embed-card-link:hover { background: var(--smdx-bg-muted, #f8fafc); text-decoration: none; }
|
|
254
|
+
`}}const me=[{id:"flowchart",label:"Flowchart",template:`graph TD
|
|
255
|
+
Start --> Stop`},{id:"sequence",label:"Sequence Diagram",template:`sequenceDiagram
|
|
256
|
+
Alice->>John: Hello John, how are you?
|
|
257
|
+
John-->>Alice: Great!
|
|
258
|
+
Alice-)John: See you later!`},{id:"class",label:"Class Diagram",template:`classDiagram
|
|
259
|
+
Animal <|-- Duck
|
|
260
|
+
Animal <|-- Fish
|
|
261
|
+
Animal <|-- Zebra
|
|
262
|
+
Animal : +int age
|
|
263
|
+
Animal : +String gender
|
|
264
|
+
Animal: +isMammal()
|
|
265
|
+
Animal: +mate()
|
|
266
|
+
class Duck{
|
|
267
|
+
+String beakColor
|
|
268
|
+
+swim()
|
|
269
|
+
+quack()
|
|
270
|
+
}
|
|
271
|
+
class Fish{
|
|
272
|
+
-int sizeInFeet
|
|
273
|
+
-canEat()
|
|
274
|
+
}
|
|
275
|
+
class Zebra{
|
|
276
|
+
+bool is_wild
|
|
277
|
+
+run()
|
|
278
|
+
}`},{id:"state",label:"State Diagram",template:`stateDiagram-v2
|
|
279
|
+
[*] --> Still
|
|
280
|
+
Still --> [*]
|
|
281
|
+
|
|
282
|
+
Still --> Moving
|
|
283
|
+
Moving --> Still
|
|
284
|
+
Moving --> Crash
|
|
285
|
+
Crash --> [*]`},{id:"er",label:"ER Diagram",template:`erDiagram
|
|
286
|
+
CUSTOMER ||--o{ ORDER : places
|
|
287
|
+
ORDER ||--|{ LINE-ITEM : contains
|
|
288
|
+
CUSTOMER }|..|{ DELIVERY-ADDRESS : uses`},{id:"journey",label:"User Journey",template:`journey
|
|
289
|
+
title My working day
|
|
290
|
+
section Go to work
|
|
291
|
+
Make tea: 5: Me
|
|
292
|
+
Go upstairs: 3: Me
|
|
293
|
+
Do work: 1: Me, Cat
|
|
294
|
+
section Go home
|
|
295
|
+
Go downstairs: 5: Me
|
|
296
|
+
Sit down: 5: Me`},{id:"gantt",label:"Gantt Diagram",template:`gantt
|
|
297
|
+
title A Gantt Diagram
|
|
298
|
+
dateFormat YYYY-MM-DD
|
|
299
|
+
section Section
|
|
300
|
+
A task :a1, 2014-01-01, 30d
|
|
301
|
+
Another task :after a1 , 20d
|
|
302
|
+
section Another
|
|
303
|
+
Task in sec :2014-01-12 , 12d
|
|
304
|
+
another task : 24d`}];function pe(){return{name:"mermaid",toolbarItems:[{id:"mermaid",label:"Mermaid",icon:p.mermaid,tooltip:"Insert Mermaid Diagram",children:me.map(r=>({id:`mermaid-${r.id}`,label:r.label,tooltip:`Insert ${r.label}`,action:({editor:e})=>{e.insertBlock("```mermaid\n"+r.template+"\n```")}})),action:({editor:r})=>{r.insertBlock("```mermaid\n"+me[0].template+"\n```")}}],renderers:[{name:"mermaid",pattern:/```mermaid\n([\s\S]*?)```/g,render:r=>{const e=r.match(/```mermaid\n([\s\S]*?)```/);if(!e)return r;const t="mermaid-"+Math.random().toString(36).substring(2,10),o=encodeURIComponent(e[1].trim());return`<div class="smdx-mermaid" data-mermaid-id="${t}" data-mermaid-code="${o}"><div class="smdx-mermaid-placeholder">Loading diagram…</div></div>`},priority:20}],async init(r){const e=async()=>{try{const t=window.mermaid;if(!t)return;const o=r.editor.getRoot().classList.contains("smdx-dark");t.initialize({startOnLoad:!1,theme:o?"dark":"default"});const i=r.editor.getPreview();if(!i)return;const s=i.querySelectorAll(".smdx-mermaid[data-mermaid-code]");for(const n of Array.from(s)){const a=decodeURIComponent(n.getAttribute("data-mermaid-code")),d=n.getAttribute("data-mermaid-id");try{const{svg:l}=await t.render(d,a);n.innerHTML=l,n.removeAttribute("data-mermaid-code")}catch{n.innerHTML=`<pre class="smdx-mermaid-error">${a.replace(/</g,"<").replace(/>/g,">")}</pre>`,n.removeAttribute("data-mermaid-code")}}}catch{}};r.on("render",e)},styles:`
|
|
305
|
+
.smdx-mermaid { margin: 12px 0; text-align: center; }
|
|
306
|
+
.smdx-mermaid svg { max-width: 100%; height: auto; }
|
|
307
|
+
.smdx-mermaid-placeholder { padding: 24px; color: var(--smdx-text-muted, #94a3b8); font-size: 0.9em; }
|
|
308
|
+
.smdx-mermaid-error { background: var(--smdx-bg-muted, #f8fafc); padding: 16px; border-radius: 8px; border: 1px solid var(--smdx-border, #e2e8f0); text-align: left; font-size: 0.85em; overflow-x: auto; }
|
|
309
|
+
.smdx-dark .smdx-mermaid text { fill: #e2e8f0 !important; }
|
|
310
|
+
.smdx-dark .smdx-mermaid .edgeLabel { background-color: #2a2a3c !important; color: #e2e8f0 !important; }
|
|
311
|
+
.smdx-dark .smdx-mermaid .edgeLabel p { color: #e2e8f0 !important; }
|
|
312
|
+
.smdx-dark .smdx-mermaid .label { color: #e2e8f0 !important; }
|
|
313
|
+
.smdx-dark .smdx-mermaid .nodeLabel { color: #e2e8f0 !important; }
|
|
314
|
+
.smdx-dark .smdx-mermaid .node rect,
|
|
315
|
+
.smdx-dark .smdx-mermaid .node circle,
|
|
316
|
+
.smdx-dark .smdx-mermaid .node ellipse,
|
|
317
|
+
.smdx-dark .smdx-mermaid .node polygon,
|
|
318
|
+
.smdx-dark .smdx-mermaid .node .label-container { fill: #2a2a3c !important; stroke: #818cf8 !important; }
|
|
319
|
+
.smdx-dark .smdx-mermaid .edgePath .path { stroke: #94a3b8 !important; }
|
|
320
|
+
.smdx-dark .smdx-mermaid .arrowheadPath { fill: #94a3b8 !important; }
|
|
321
|
+
.smdx-dark .smdx-mermaid marker path { fill: #94a3b8 !important; stroke: #94a3b8 !important; }
|
|
322
|
+
.smdx-dark .smdx-mermaid .flowchart-link { stroke: #94a3b8 !important; }
|
|
323
|
+
.smdx-dark .smdx-mermaid line { stroke: #94a3b8 !important; }
|
|
324
|
+
.smdx-dark .smdx-mermaid .messageLine0,
|
|
325
|
+
.smdx-dark .smdx-mermaid .messageLine1 { stroke: #94a3b8 !important; }
|
|
326
|
+
.smdx-dark .smdx-mermaid .messageText { fill: #e2e8f0 !important; }
|
|
327
|
+
.smdx-dark .smdx-mermaid .actor { fill: #2a2a3c !important; stroke: #818cf8 !important; }
|
|
328
|
+
.smdx-dark .smdx-mermaid .actor-line { stroke: #4b5563 !important; }
|
|
329
|
+
.smdx-dark .smdx-mermaid text.actor > tspan { fill: #e2e8f0 !important; }
|
|
330
|
+
.smdx-dark .smdx-mermaid .loopText > tspan { fill: #e2e8f0 !important; }
|
|
331
|
+
.smdx-dark .smdx-mermaid .labelBox { fill: #2a2a3c !important; stroke: #818cf8 !important; }
|
|
332
|
+
.smdx-dark .smdx-mermaid .loopLine { stroke: #4b5563 !important; }
|
|
333
|
+
.smdx-dark .smdx-mermaid .note { fill: #374151 !important; stroke: #4b5563 !important; }
|
|
334
|
+
.smdx-dark .smdx-mermaid .noteText > tspan { fill: #e2e8f0 !important; }
|
|
335
|
+
.smdx-dark .smdx-mermaid .activation0,
|
|
336
|
+
.smdx-dark .smdx-mermaid .activation1,
|
|
337
|
+
.smdx-dark .smdx-mermaid .activation2 { fill: #374151 !important; stroke: #818cf8 !important; }
|
|
338
|
+
.smdx-dark .smdx-mermaid .statediagram-state rect.divider { fill: #374151 !important; stroke: #4b5563 !important; }
|
|
339
|
+
.smdx-dark .smdx-mermaid .relationshipLine { stroke: #94a3b8 !important; }
|
|
340
|
+
.smdx-dark .smdx-mermaid .entityBox { fill: #2a2a3c !important; stroke: #818cf8 !important; }
|
|
341
|
+
.smdx-dark .smdx-mermaid .attributeBoxEven { fill: #2a2a3c !important; }
|
|
342
|
+
.smdx-dark .smdx-mermaid .attributeBoxOdd { fill: #374151 !important; }
|
|
343
|
+
.smdx-dark .smdx-mermaid .er.relationshipLabel { fill: #e2e8f0 !important; }
|
|
344
|
+
.smdx-dark .smdx-mermaid .journey-section-column { fill: #374151 !important; }
|
|
345
|
+
.smdx-dark .smdx-mermaid .task { fill: #2a2a3c !important; stroke: #818cf8 !important; }
|
|
346
|
+
.smdx-dark .smdx-mermaid .taskText { fill: #e2e8f0 !important; }
|
|
347
|
+
.smdx-dark .smdx-mermaid .sectionTitle { fill: #e2e8f0 !important; }
|
|
348
|
+
.smdx-dark .smdx-mermaid .grid .tick line { stroke: #374151 !important; }
|
|
349
|
+
.smdx-dark .smdx-mermaid .grid .tick text { fill: #94a3b8 !important; }
|
|
350
|
+
.smdx-dark .smdx-mermaid .titleText { fill: #e2e8f0 !important; }
|
|
351
|
+
.smdx-dark .smdx-mermaid .pieCircle { stroke: #1e1e2e !important; }
|
|
352
|
+
.smdx-dark .smdx-mermaid .section0,
|
|
353
|
+
.smdx-dark .smdx-mermaid .section1 { fill: #374151 !important; }
|
|
354
|
+
.smdx-dark .smdx-mermaid .today { stroke: #818cf8 !important; }
|
|
355
|
+
`}}const $=[["😀","grinning smile happy"],["😂","joy laugh cry tears"],["🥰","love hearts smiling"],["😎","cool sunglasses"],["🤔","thinking hmm"],["😢","cry sad tear"],["😡","angry mad rage"],["🥳","party celebrate"],["👍","thumbs up good yes ok"],["👎","thumbs down bad no"],["👋","wave hello hi bye"],["🙏","pray please thanks"],["💪","strong muscle flex"],["🎉","party tada celebrate confetti"],["🔥","fire hot lit"],["⭐","star favorite"],["❤️","heart love red"],["💔","broken heart"],["💯","hundred perfect score"],["✅","check done yes complete"],["❌","cross no wrong cancel"],["⚠️","warning alert caution"],["💡","idea bulb light tip"],["🚀","rocket launch ship fast"],["📝","memo note write edit"],["📌","pin pushpin"],["📎","paperclip clip attach"],["🔗","link chain url"],["📁","folder file directory"],["🗂️","dividers tabs index"],["🔍","search magnifying find look"],["🔧","wrench tool fix settings"],["🎯","target goal dart bullseye"],["🏆","trophy winner cup award"],["🎨","art palette paint color"],["🎵","music note song"],["📊","chart bar graph stats"],["📈","chart up increase growth"],["📉","chart down decrease decline"],["💰","money bag dollar rich"],["🕐","clock time one"],["📅","calendar date schedule"],["🌟","glowing star sparkle shine"],["🌍","earth globe world"],["☀️","sun sunny bright"],["🌙","moon crescent night"],["⚡","lightning bolt zap electric"],["💧","water drop droplet"],["🟢","green circle dot"],["🔴","red circle dot"],["🟡","yellow circle dot"],["🔵","blue circle dot"],["⚪","white circle dot"],["⚫","black circle dot"],["🟣","purple circle dot"],["🟠","orange circle dot"]];function he(){return{name:"emoji",toolbarItems:[{id:"emoji",label:"Emoji",icon:p.emoji,tooltip:"Insert Emoji",action:r=>{},render:(r,e)=>{r.addEventListener("click",t=>{t.preventDefault(),t.stopPropagation(),Be(r,e.editor)})}}]}}function Be(r,e){var l;(l=document.querySelector(".smdx-emoji-picker"))==null||l.remove();const t=document.createElement("div");t.className="smdx-emoji-picker";const o=r.closest(".smdx-editor");o!=null&&o.classList.contains("smdx-dark")&&t.classList.add("smdx-dark");const i=document.createElement("input");i.type="text",i.placeholder="Search emoji...",i.className="smdx-emoji-search",t.appendChild(i);const s=document.createElement("div");s.className="smdx-emoji-grid";const n=c=>{s.innerHTML="";for(const[h]of c){const u=document.createElement("button");u.type="button",u.className="smdx-emoji-btn",u.textContent=h,u.addEventListener("click",()=>{e.insertText(h),t.remove()}),s.appendChild(u)}};n($),i.addEventListener("input",()=>{const c=i.value.toLowerCase().trim();if(!c){n($);return}n($.filter(([,h])=>h.includes(c)))}),t.appendChild(s);const a=r.getBoundingClientRect();t.style.position="fixed",t.style.top=`${a.bottom+4}px`,t.style.left=`${a.left}px`,document.body.appendChild(t);const d=c=>{!t.contains(c.target)&&c.target!==r&&(t.remove(),document.removeEventListener("click",d))};setTimeout(()=>document.addEventListener("click",d),0),i.focus()}function ue(){return{name:"formula",toolbarItems:[{id:"formula",label:"Formula",icon:p.formula,tooltip:"Insert Formula",children:[{id:"formula-inline",label:"Inline Formula",tooltip:"Inline math: $formula$",action:({editor:r})=>{r.wrapSelection("$","$")}},{id:"formula-block",label:"Block Formula",tooltip:"Block math: $$formula$$",action:({editor:r,selection:e})=>{r.insertBlock(`$$
|
|
356
|
+
`+(e.text||"E = mc^2")+`
|
|
357
|
+
$$`)}}],action:({editor:r})=>{r.wrapSelection("$","$")}}],renderers:[{name:"formula-block",pattern:/\$\$([\s\S]*?)\$\$/g,render:r=>{const e=r.match(/\$\$([\s\S]*?)\$\$/);if(!e)return r;const t=e[1].trim();try{const o=window.katex;if(o)return`<div class="smdx-formula-block">${o.renderToString(t,{displayMode:!0,throwOnError:!1})}</div>`}catch{}return`<div class="smdx-formula-block smdx-formula-fallback"><code>${t}</code></div>`},priority:18},{name:"formula-inline",pattern:new RegExp("(?<!\\$)\\$(?!\\$)((?:[^$\\\\]|\\\\.)+)\\$","g"),render:r=>{const e=r.match(new RegExp("(?<!\\$)\\$(?!\\$)((?:[^$\\\\]|\\\\.)+)\\$"));if(!e)return r;const t=e[1].trim();try{const o=window.katex;if(o)return o.renderToString(t,{displayMode:!1,throwOnError:!1})}catch{}return`<code class="smdx-formula-inline">${t}</code>`},priority:17}],styles:`
|
|
358
|
+
.smdx-formula-block { text-align: center; margin: 16px 0; font-size: 1.2em; overflow-x: auto; }
|
|
359
|
+
.smdx-formula-fallback { background: var(--smdx-bg-muted, #f8fafc); padding: 12px; border-radius: 6px; border: 1px solid var(--smdx-border, #e2e8f0); }
|
|
360
|
+
.smdx-formula-inline { font-size: 0.95em; }
|
|
361
|
+
|
|
362
|
+
.smdx-emoji-picker { background: #fff; border: 1px solid #e2e8f0; border-radius: 8px; box-shadow: 0 4px 16px rgba(0,0,0,0.12); z-index: 1000; width: 300px; padding: 8px; }
|
|
363
|
+
.smdx-emoji-search { width: 100%; padding: 6px 10px; border: 1px solid #e2e8f0; border-radius: 4px; margin-bottom: 8px; font-size: 0.9em; outline: none; box-sizing: border-box; background: #fff; color: #1e293b; }
|
|
364
|
+
.smdx-emoji-search:focus { border-color: #6366f1; }
|
|
365
|
+
.smdx-emoji-grid { display: grid; grid-template-columns: repeat(8, 1fr); gap: 2px; max-height: 200px; overflow-y: auto; }
|
|
366
|
+
.smdx-emoji-btn { border: none; background: none; font-size: 1.3em; padding: 4px; border-radius: 4px; cursor: pointer; line-height: 1; }
|
|
367
|
+
.smdx-emoji-btn:hover { background: #f1f5f9; }
|
|
368
|
+
.smdx-dark .smdx-emoji-picker, .smdx-emoji-picker.smdx-dark { background: #1e1e2e; border-color: #374151; box-shadow: 0 4px 16px rgba(0,0,0,0.4); }
|
|
369
|
+
.smdx-dark .smdx-emoji-search, .smdx-emoji-picker.smdx-dark .smdx-emoji-search { background: #2a2a3c; color: #e2e8f0; border-color: #374151; }
|
|
370
|
+
.smdx-dark .smdx-emoji-search:focus, .smdx-emoji-picker.smdx-dark .smdx-emoji-search:focus { border-color: #818cf8; }
|
|
371
|
+
.smdx-dark .smdx-emoji-btn:hover, .smdx-emoji-picker.smdx-dark .smdx-emoji-btn:hover { background: #2a2a3c; }
|
|
372
|
+
`}}function f(r){return r.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">")}function xe(){const r=new Map;async function e(i){if(r.has(i))return r.get(i);try{let s=await fetch(i+"?raw");if(s.ok||(s=await fetch(i)),!s.ok){const c={content:null,error:`File not found: ${i} (${s.status})`};return r.set(i,c),c}let n=await s.text();const a=n.trimStart();if(a.startsWith("<!DOCTYPE")||a.startsWith("<!doctype")||a.startsWith("<html")){const c={content:null,error:`File not found: ${i}`};return r.set(i,c),c}const d=n.match(/^export default (?:\/\*(?:[^*]|\*(?!\/))*\*\/\s*)?["']([\s\S]*)["']\s*;?\s*$/);d&&(n=d[1].replace(/\\n/g,`
|
|
373
|
+
`).replace(/\\r/g,"\r").replace(/\\t/g," ").replace(/\\"/g,'"').replace(/\\'/g,"'").replace(/\\\\/g,"\\").replace(/\\u([\da-fA-F]{4})/g,(c,h)=>String.fromCharCode(parseInt(h,16))));const l={content:n};return r.set(i,l),l}catch{const s={content:null,error:`Failed to load: ${i}`};return r.set(i,s),s}}function t(i,s){const n=s.match(/^(\d+)-(\d+)$/);if(!n)return i;const a=Math.max(1,parseInt(n[1],10)),d=parseInt(n[2],10);return i.split(`
|
|
374
|
+
`).slice(a-1,d).join(`
|
|
375
|
+
`)}async function o(i){const s=i.querySelectorAll(".smdx-import[data-src]");for(const a of s){if(a.dataset.loaded==="true")continue;a.dataset.loaded="true";const d=a.dataset.src,{content:l,error:c}=await e(d);c?(a.innerHTML=`<span class="smdx-import-icon">⚠️</span> <span class="smdx-import-error">${f(c)}</span>`,a.classList.add("smdx-import-failed")):(a.innerHTML=`<div class="smdx-import-header"><span class="smdx-import-icon">📄</span> <code>${f(d)}</code></div><div class="smdx-import-content">${f(l)}</div>`,a.classList.add("smdx-import-loaded"))}const n=i.querySelectorAll(".smdx-snippet[data-src]");for(const a of n){if(a.dataset.loaded==="true")continue;a.dataset.loaded="true";const d=a.dataset.src,l=a.dataset.lines||"",{content:c,error:h}=await e(d);if(h)a.innerHTML=`<span class="smdx-snippet-icon">⚠️</span> <span class="smdx-snippet-error">${f(h)}</span>`,a.classList.add("smdx-snippet-failed");else{const u=l?t(c,l):c,x=d.split(".").pop()||"text",g=l?` <span class="smdx-snippet-lines">(lines ${f(l)})</span>`:"";a.innerHTML=`<div class="smdx-snippet-header"><span class="smdx-snippet-icon">📋</span> <code>${f(d)}</code>${g}</div><pre class="smdx-snippet-code"><code class="language-${f(x)}">${f(u)}</code></pre>`,a.classList.add("smdx-snippet-loaded")}}}return{name:"insert",init(i){i.on("render",()=>{const s=i.editor.getPreview();s&&o(s)})},toolbarItems:[{id:"insert",label:"Insert",icon:p.insert,tooltip:"Insert Component",children:[{id:"insert-endpoint",label:"API Endpoint",tooltip:"Insert API endpoint block",action:({editor:i})=>{i.insertBlock(`<Endpoint method="GET" path="/api/v1/resource">
|
|
376
|
+
Description of the endpoint.
|
|
377
|
+
|
|
378
|
+
**Parameters:**
|
|
379
|
+
| Name | Type | Description |
|
|
380
|
+
|------|------|-------------|
|
|
381
|
+
| id | string | Resource ID |
|
|
382
|
+
|
|
383
|
+
**Response:**
|
|
384
|
+
\`\`\`json
|
|
385
|
+
{
|
|
386
|
+
"status": "success",
|
|
387
|
+
"data": {}
|
|
388
|
+
}
|
|
389
|
+
\`\`\`
|
|
390
|
+
</Endpoint>`)}},{id:"insert-markdown",label:"Markdown Import",tooltip:"Import external markdown",action:({editor:i})=>{i.insertBlock('<Import src="./path/to/file.md" />')}},{id:"insert-snippet",label:"Code Snippet",tooltip:"Insert code snippet reference",action:({editor:i})=>{i.insertBlock('<Snippet src="./snippets/example.ts" lines="1-20" />')}}],action:()=>{}}],renderers:[{name:"endpoint",pattern:/<Endpoint\s+method="([^"]*)"(?:\s+path="([^"]*)")?\s*>([\s\S]*?)<\/Endpoint>/g,render:i=>{const s=i.match(/<Endpoint\s+method="([^"]*)"(?:\s+path="([^"]*)")?\s*>([\s\S]*?)<\/Endpoint>/);if(!s)return i;const n=s[1].toUpperCase(),a=s[2]||"";return`<div class="smdx-endpoint">
|
|
391
|
+
<div class="smdx-endpoint-header">
|
|
392
|
+
<span class="smdx-endpoint-method" style="background:${{GET:"#22c55e",POST:"#3b82f6",PUT:"#f59e0b",PATCH:"#a855f7",DELETE:"#ef4444"}[n]||"#64748b"}">${n}</span>
|
|
393
|
+
<code class="smdx-endpoint-path">${a}</code>
|
|
394
|
+
</div>
|
|
395
|
+
<div class="smdx-endpoint-body">${s[3].trim()}</div>
|
|
396
|
+
</div>`},priority:10},{name:"import",pattern:/<Import\s+src="([^"]*)"(?:\s*\/)?>/g,render:i=>{const s=i.match(/<Import\s+src="([^"]*)"(?:\s*\/)?>/);if(!s)return i;const n=s[1];return`<div class="smdx-import" data-src="${f(n)}"><span class="smdx-import-icon">📄</span> Loading <code>${f(n)}</code>…</div>`}},{name:"snippet",pattern:/<Snippet\s+src="([^"]*)"(?:\s+lines="([^"]*)")?\s*\/>/g,render:i=>{const s=i.match(/<Snippet\s+src="([^"]*)"(?:\s+lines="([^"]*)")?\s*\/>/);if(!s)return i;const n=s[1],a=s[2]||"";return`<div class="smdx-snippet" data-src="${f(n)}"${a?` data-lines="${f(a)}"`:""}><span class="smdx-snippet-icon">📋</span> Loading <code>${f(n)}</code>…</div>`}}],styles:`
|
|
397
|
+
.smdx-endpoint { border: 1px solid var(--smdx-border, #e2e8f0); border-radius: 8px; overflow: hidden; margin: 12px 0; }
|
|
398
|
+
.smdx-endpoint-header { display: flex; align-items: center; gap: 12px; padding: 10px 16px; background: var(--smdx-bg-muted, #f8fafc); border-bottom: 1px solid var(--smdx-border, #e2e8f0); }
|
|
399
|
+
.smdx-endpoint-method { color: white; padding: 2px 8px; border-radius: 4px; font-weight: 700; font-size: 0.8em; letter-spacing: 0.05em; }
|
|
400
|
+
.smdx-endpoint-path { font-family: monospace; font-size: 0.9em; }
|
|
401
|
+
.smdx-endpoint-body { padding: 16px; }
|
|
402
|
+
.smdx-import, .smdx-snippet { border: 1px solid var(--smdx-border, #e2e8f0); border-radius: 8px; margin: 8px 0; overflow: hidden; font-size: 0.9em; }
|
|
403
|
+
.smdx-import:not(.smdx-import-loaded):not(.smdx-import-failed),
|
|
404
|
+
.smdx-snippet:not(.smdx-snippet-loaded):not(.smdx-snippet-failed) { display: flex; align-items: center; gap: 8px; padding: 10px 16px; background: var(--smdx-bg-muted, #f8fafc); }
|
|
405
|
+
.smdx-import-header, .smdx-snippet-header { display: flex; align-items: center; gap: 8px; padding: 8px 16px; background: var(--smdx-bg-muted, #f8fafc); border-bottom: 1px solid var(--smdx-border, #e2e8f0); font-size: 0.85em; }
|
|
406
|
+
.smdx-import-content { padding: 16px; white-space: pre-wrap; font-size: 0.9em; line-height: 1.6; }
|
|
407
|
+
.smdx-snippet-code { margin: 0; padding: 16px; background: var(--smdx-bg-code, #1e293b); color: var(--smdx-text-code, #e2e8f0); overflow-x: auto; font-size: 0.85em; line-height: 1.5; }
|
|
408
|
+
.smdx-snippet-code code { font-family: var(--smdx-font-mono, 'SF Mono', 'Fira Code', monospace); }
|
|
409
|
+
.smdx-snippet-lines { color: var(--smdx-text-muted, #94a3b8); font-size: 0.9em; }
|
|
410
|
+
.smdx-import-failed, .smdx-snippet-failed { display: flex; align-items: center; gap: 8px; padding: 10px 16px; background: #fef2f2; border-color: #fecaca; }
|
|
411
|
+
.smdx-import-error, .smdx-snippet-error { color: #b91c1c; }
|
|
412
|
+
.smdx-dark .smdx-import-failed, .smdx-dark .smdx-snippet-failed { background: #450a0a; border-color: #991b1b; }
|
|
413
|
+
.smdx-dark .smdx-import-error, .smdx-dark .smdx-snippet-error { color: #fca5a5; }
|
|
414
|
+
`}}function ge(){return{name:"toc",toolbarItems:[{id:"toc",label:"ToC",icon:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="3" y1="6" x2="21" y2="6"/><line x1="6" y1="12" x2="21" y2="12"/><line x1="6" y1="18" x2="21" y2="18"/><circle cx="3" cy="12" r="1" fill="currentColor"/><circle cx="3" cy="18" r="1" fill="currentColor"/></svg>',tooltip:"Toggle Table of Contents",action:({editor:r})=>{const e=r.getRoot(),t=e.querySelector(".smdx-toc-sidebar");t?(t.remove(),e.classList.remove("smdx-toc-open")):(e.classList.add("smdx-toc-open"),fe(r))}}],init(r){r.on("render",()=>{r.editor.getRoot().classList.contains("smdx-toc-open")&&fe(r.editor)})},styles:`
|
|
415
|
+
.smdx-toc-sidebar { position: absolute; top: 0; right: 0; width: 220px; height: 100%; overflow-y: auto; background: var(--smdx-bg, #fff); border-left: 1px solid var(--smdx-border, #e2e8f0); padding: 16px 12px; z-index: 50; font-size: 0.85em; }
|
|
416
|
+
.smdx-toc-open .smdx-preview-pane { position: relative; }
|
|
417
|
+
.smdx-toc-title { font-weight: 700; font-size: 0.8em; text-transform: uppercase; letter-spacing: 0.05em; color: var(--smdx-text-muted, #64748b); margin-bottom: 12px; }
|
|
418
|
+
.smdx-toc-list { list-style: none; padding: 0; margin: 0; }
|
|
419
|
+
.smdx-toc-item { margin: 0; }
|
|
420
|
+
.smdx-toc-link { display: block; padding: 4px 8px; color: var(--smdx-text-muted, #64748b); text-decoration: none; border-radius: 4px; transition: background 0.15s, color 0.15s; cursor: pointer; line-height: 1.4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
|
421
|
+
.smdx-toc-link:hover { background: var(--smdx-bg-muted, #f1f5f9); color: var(--smdx-text, #1e293b); }
|
|
422
|
+
.smdx-toc-link.smdx-toc-h2 { padding-left: 16px; }
|
|
423
|
+
.smdx-toc-link.smdx-toc-h3 { padding-left: 28px; font-size: 0.95em; }
|
|
424
|
+
.smdx-toc-link.smdx-toc-h4 { padding-left: 40px; font-size: 0.9em; }
|
|
425
|
+
`}}function fe(r){var h;const e=r.getRoot(),t=e.querySelector(".smdx-preview-pane");if(!t)return;(h=e.querySelector(".smdx-toc-sidebar"))==null||h.remove();const o=r.getValue(),i=[],s=o.split(`
|
|
426
|
+
`);for(const u of s){const x=u.match(/^(#{1,4})\s+(.+)$/);if(x){const g=x[2].replace(/[*_`~]/g,""),b=g.toLowerCase().replace(/[^\w]+/g,"-").replace(/^-|-$/g,"");i.push({level:x[1].length,text:g,slug:b})}}if(i.length===0)return;const n=document.createElement("div");n.className="smdx-toc-sidebar";const a=document.createElement("div");a.className="smdx-toc-title",a.textContent="On this page",n.appendChild(a);const d=document.createElement("ul");d.className="smdx-toc-list";const l=r.getPreview(),c=e.querySelector(".smdx-textarea");i.forEach(u=>{const x=document.createElement("li");x.className="smdx-toc-item";const g=document.createElement("a");g.className=`smdx-toc-link smdx-toc-h${u.level}`,g.textContent=u.text,g.title=u.text,g.addEventListener("click",b=>{b.preventDefault();const y=l.querySelector(`#${CSS.escape(u.slug)}`);if(y&&y.scrollIntoView({behavior:"smooth",block:"start"}),c){const k=c.value.split(`
|
|
427
|
+
`);let w=0;for(let C=0;C<k.length;C++){const we=k[C].match(/^#{1,4}\s+(.+)$/);if(we&&we[1].replace(/[*_`~]/g,"")===u.text){c.focus(),c.setSelectionRange(w,w);const Ae=parseFloat(getComputedStyle(c).lineHeight)||22,De=C*Ae-c.clientHeight/3;c.scrollTop=Math.max(0,De);break}w+=k[C].length+1}}}),x.appendChild(g),d.appendChild(x)}),n.appendChild(d),t.appendChild(n)}function be(){return{name:"breakLine",toolbarItems:[{id:"breakLine",label:"Line Break",icon:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 7H3"/><path d="M21 17H9"/><path d="M18 13l3 4-3 4"/></svg>',tooltip:"Insert Line Break",action:({editor:r})=>{r.insertText(`<br/>
|
|
428
|
+
`)}}]}}function ve(){return{name:"horizontalRule",toolbarItems:[{id:"horizontalRule",label:"Horizontal Rule",icon:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="3" y1="12" x2="21" y2="12"/></svg>',tooltip:"Insert Horizontal Rule",action:({editor:r})=>{r.insertBlock("---")}}]}}function ke(){return[P(),A(),D(),H(),z(),R(),N(),O(),j(),G(),_(),q(),F(),W(),K(),U(),Y(),J(),Z(),Q(),ee(),te(),oe(),se(),ne(),ae(),de(),le(),ce(),pe(),he(),ue(),xe(),ge(),be(),ve()]}function ye(){return[["heading","|","bold","italic","strikethrough","|","quote","link","image","|","code","codeBlock","|","unorderedList","orderedList","taskList","|","table","|","emoji","formula","|","toc","|",{type:"group",label:"Insert",icon:'<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="16"/><line x1="8" y1="12" x2="16" y2="12"/></svg>',display:"dropdown",items:[{type:"group",label:"Layout",items:["highlight","admonition","tab","imageBackground","imageFrame","accordion","accordionGroup","multiColumn","card","cardGroup","steps","tip","container"]},{type:"group",label:"Others",items:["copyText","tooltip","embedVideo","embedOthers","breakLine","horizontalRule"]},{type:"group",label:"Diagrams",items:["mermaid"]},{type:"group",label:"Apidog Widget",items:["insert"]}]}]]}function Pe(r){return new B({plugins:ke(),toolbar:ye(),placeholder:"Start writing markdown...",scrollSync:!0,mode:"split",...r})}m.EventEmitter=S,m.History=I,m.PluginManager=T,m.Renderer=M,m.SynclineMDXEditor=B,m.Toolbar=E,m.accordionGroupPlugin=Z,m.accordionPlugin=J,m.admonitionPlugin=W,m.allPlugins=ke,m.boldPlugin=A,m.breakLinePlugin=be,m.cardGroupPlugin=te,m.cardPlugin=ee,m.codePlugin=O,m.containerPlugin=ne,m.copyTextPlugin=ae,m.createEditor=Pe,m.defaultToolbar=ye,m.embedOthersPlugin=ce,m.embedVideoPlugin=le,m.emojiPlugin=he,m.formulaPlugin=ue,m.headingPlugin=P,m.highlightPlugin=F,m.horizontalRulePlugin=ve,m.icons=p,m.imageBackgroundPlugin=U,m.imageFramePlugin=Y,m.imagePlugin=N,m.insertPlugin=xe,m.italicPlugin=D,m.linkPlugin=R,m.mermaidPlugin=pe,m.multiColumnPlugin=Q,m.orderedListPlugin=G,m.quotePlugin=z,m.stepPlugin=oe,m.strikethroughPlugin=H,m.tabPlugin=K,m.tablePlugin=q,m.taskListPlugin=_,m.tipPlugin=se,m.tocPlugin=ge,m.tooltipPlugin=de,m.unorderedListPlugin=j,Object.defineProperty(m,Symbol.toStringTag,{value:"Module"})});
|