react-latex-editor
Version:
A professional React rich text editor with mathematical equation support, built on TipTap with MathLive integration. Production-ready with TypeScript support, accessibility features, and industrial-grade error handling.
1 lines • 63.5 kB
JavaScript
"use strict";var Q=Object.create;var N=Object.defineProperty;var ee=Object.getOwnPropertyDescriptor;var te=Object.getOwnPropertyNames;var ie=Object.getPrototypeOf,se=Object.prototype.hasOwnProperty;var le=(e,i,s,l)=>{if(i&&typeof i=="object"||typeof i=="function")for(let n of te(i))!se.call(e,n)&&n!==s&&N(e,n,{get:()=>i[n],enumerable:!(l=ee(i,n))||l.enumerable});return e};var R=(e,i,s)=>(s=e!=null?Q(ie(e)):{},le(i||!e||!e.__esModule?N(s,"default",{value:e,enumerable:!0}):s,e));Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),C=require("@tiptap/react"),r=require("react"),ne=require("@tiptap/starter-kit"),re=require("@tiptap/extension-table"),oe=require("@tiptap/extension-table-row"),ae=require("@tiptap/extension-table-cell"),ce=require("@tiptap/extension-table-header"),ue=require("@tiptap/extension-link"),de=require("@tiptap/extension-text-align"),he=require("@tiptap/extension-highlight"),pe=require("@tiptap/extension-underline"),me=require("@tiptap/extension-subscript"),ge=require("@tiptap/extension-superscript"),xe=require("@tiptap/extension-code-block-lowlight"),B=require("lowlight"),be=require("@tiptap/extension-strike"),ye=require("@tiptap/extension-color"),fe=require("@tiptap/extension-blockquote"),ve=require("@tiptap/extension-horizontal-rule"),je=require("@tiptap/extension-hard-break"),ke=require("@tiptap/extension-task-list"),we=require("@tiptap/extension-task-item"),Ce=require("@tiptap/extension-placeholder"),Ae=require("@tiptap/extension-character-count"),Me=require("@tiptap/extension-floating-menu"),A=require("@tiptap/core"),Le=require("@tiptap/extension-image"),Ee=require("@tiptap/extension-youtube"),Te=require("@tiptap/extension-text-style");require("mathlive");class Se extends r.Component{mathFieldRef;cleanup;constructor(i){super(i),this.mathFieldRef=r.createRef()}async componentDidMount(){if(typeof window<"u")try{const i=await import("mathlive");customElements.get("math-field")||customElements.define("math-field",i.MathfieldElement),i.MathfieldElement&&(i.MathfieldElement.fontsDirectory=null),this.setupMathField()}catch(i){console.error("Failed to load MathLive:",i)}}componentDidUpdate(i){i.node.attrs.latex!==this.props.node.attrs.latex&&this.updateMathField()}componentWillUnmount(){this.cleanupMathField()}setupMathField(){const i=this.mathFieldRef.current;if(!i)return;const s=()=>{try{const l=i.value;l!==this.props.node.attrs.latex&&this.props.updateAttributes({latex:l})}catch(l){console.error("Error updating math field:",l)}};setTimeout(()=>{if(i&&i.isConnected)try{i.addEventListener("input",s),i.value=this.props.node.attrs.latex||""}catch(l){console.error("Error setting up math field:",l)}},0),this.cleanup=()=>{if(i&&i.isConnected)try{i.removeEventListener("input",s),i.menuItems=[]}catch(l){console.error("Error cleaning up math field:",l)}}}updateMathField(){this.mathFieldRef.current&&(this.mathFieldRef.current.value=this.props.node.attrs.latex||"")}cleanupMathField(){this.cleanup&&this.cleanup()}render(){const{node:i}=this.props,{displayMode:s}=i.attrs;return t.jsx(C.NodeViewWrapper,{className:s?"math-node-wrapper-block":"math-node-wrapper-inline",children:r.createElement("math-field",{ref:this.mathFieldRef,className:"test-math-background",readonly:!0})})}}const H=A.Node.create({name:"math",group:"inline",inline:!0,atom:!0,addAttributes(){return{latex:{default:"",parseHTML:e=>e.getAttribute("data-latex"),renderHTML:e=>({"data-latex":e.latex})},displayMode:{default:!1,parseHTML:e=>e.hasAttribute("data-display-mode"),renderHTML:e=>e.displayMode?{"data-display-mode":""}:{}}}},parseHTML(){return[{tag:'span[data-type="math"]'}]},renderHTML({HTMLAttributes:e,node:i}){return["span",{...e,"data-type":"math","data-latex":i?.attrs?.latex||""},i?.attrs?.latex||""]},addNodeView(){return C.ReactNodeViewRenderer(Se)}}),D=A.Extension.create({name:"inlineMath",addOptions(){return{inlineDelimiter:"$",blockDelimiter:"$$"}},addProseMirrorPlugins(){return[]},addCommands(){return{insertInlineMath:e=>({commands:i})=>i.insertContent({type:"math",attrs:{latex:e}})}},addInputRules(){const e=this.options.inlineDelimiter.replace(/[-\/\\^$*+?.()|\[\]{}]/g,"\\$&"),i=this.options.blockDelimiter.replace(/[-\/\\^$*+?.()|\[\]{}]/g,"\\$&");return[new C.InputRule({find:new RegExp(`${e}(.*?)${e}$`),handler:({state:s,range:l,match:n})=>{const[,c]=n,{from:d,to:a}=l;s.tr.replaceWith(d,a,s.schema.nodes.math.create({latex:c}))}}),new C.InputRule({find:new RegExp(`${i}(.*?)${i}$`),handler:({state:s,range:l,match:n})=>{const[,c]=n,{from:d,to:a}=l;s.tr.replaceWith(d,a,s.schema.nodes.math.create({latex:c,displayMode:!0}))}})]}}),Ne=({node:e,updateAttributes:i})=>{const s=r.useRef(null),{width:l,align:n}=e.attrs,c=r.useCallback(d=>{d.preventDefault();const a=d.pageX,f=s.current.clientWidth,g=m=>{const k=f+(m.pageX-a);i({width:`${Math.max(50,k)}px`})},h=()=>{document.removeEventListener("mousemove",g),document.removeEventListener("mouseup",h)};document.addEventListener("mousemove",g),document.addEventListener("mouseup",h)},[i]);return t.jsxs(C.NodeViewWrapper,{className:`resizable-image-container align-${n}`,style:{width:l},ref:s,children:[t.jsx("img",{src:e.attrs.src,alt:e.attrs.alt,title:e.attrs.title,className:"editor-image",draggable:"true"}),t.jsx("div",{className:"resize-handle-left",onMouseDown:c}),t.jsx("div",{className:"resize-handle-right",onMouseDown:c})]})},q=Le.extend({addAttributes(){return{...this.parent?.(),width:{default:"500px",renderHTML:e=>({width:e.width})},height:{default:"auto",renderHTML:e=>({height:e.height})},align:{default:"left",renderHTML:e=>({"data-align":e.align}),parseHTML:e=>e.getAttribute("data-align")||"left"}}},renderHTML({node:e,HTMLAttributes:i}){const s=e.attrs.align||"left",n={left:"left",center:"center",right:"right"}[s]||"left";return["div",{class:"resizable-image-wrapper resizable-image-wrapper-align-"+s,style:`text-align: ${n}; width: 100%; display: block;`,"data-align":s},["div",{class:"resizable-image-container align-"+s,style:`display: inline-block; width: ${e.attrs.width||"500px"}; height: ${e.attrs.height||"auto"};`},["img",A.mergeAttributes(i,{src:e.attrs.src,alt:e.attrs.alt||"",title:e.attrs.title||"",width:e.attrs.width,height:e.attrs.height,"data-align":s})]]]},parseHTML(){return[{tag:"img[src]",getAttrs:e=>{if(typeof e=="string")return!1;const i=e,s=i.closest(".resizable-image-wrapper")||i.parentElement;let l="left";if(s){const n=s.getAttribute("data-align")||i.getAttribute("data-align");if(n)l=n;else{const d=window.getComputedStyle(s).textAlign;d==="center"?l="center":d==="right"&&(l="right")}}else{const n=i.getAttribute("data-align");n&&(l=n)}return{src:i.getAttribute("src"),alt:i.getAttribute("alt"),title:i.getAttribute("title"),width:i.getAttribute("width")||"500px",height:i.getAttribute("height")||"auto",align:l}}},{tag:"div.resizable-image-wrapper img",getAttrs:e=>{if(typeof e=="string")return!1;const i=e,s=i.closest(".resizable-image-wrapper");let l="left";if(s){const n=s.getAttribute("data-align");n&&(l=n)}return{src:i.getAttribute("src"),alt:i.getAttribute("alt"),title:i.getAttribute("title"),width:i.getAttribute("width")||"500px",height:i.getAttribute("height")||"auto",align:l}}}]},addNodeView(){return C.ReactNodeViewRenderer(Ne)}}),z=A.Node.create({name:"imageGroup",group:"block",content:"image+",addAttributes(){return{align:{default:"left"}}},renderHTML({node:e,HTMLAttributes:i}){const s=e.attrs.align||"left",n={left:"flex-start",center:"center",right:"flex-end"}[s]||"flex-start";return["div",A.mergeAttributes(i,{"data-type":"image-group",style:`justify-content: ${n}`}),0]},parseHTML(){return[{tag:'div[data-type="image-group"]',getAttrs:e=>{const i=e.style.justifyContent;return i==="center"||i==="flex-end"?{align:i==="center"?"center":"right"}:{align:"left"}}}]}}),F=A.Mark.create({name:"customTextStyle",addAttributes(){return{fontSize:{default:null,parseHTML:e=>e.style.fontSize?.replace(" !important","")||null,renderHTML:e=>e.fontSize?{style:`font-size: ${e.fontSize} !important;`}:{}},color:{default:null,parseHTML:e=>e.style.color||null,renderHTML:e=>e.color?{style:`color: ${e.color}`}:{}},fontFamily:{default:null,parseHTML:e=>e.style.fontFamily||null,renderHTML:e=>e.fontFamily?{style:`font-family: ${e.fontFamily} !important;`}:{}}}},parseHTML(){return[{tag:"span",getAttrs:e=>{const i=e.style.fontSize,s=e.style.color,l=e.style.fontFamily;return i||s||l?{fontSize:i?i.replace(" !important",""):null,color:s||null,fontFamily:l?l.replace(" !important",""):null}:!1}}]},renderHTML({HTMLAttributes:e}){return["span",A.mergeAttributes(e),0]}}),$=A.Mark.create({name:"backgroundColor",addOptions(){return{HTMLAttributes:{}}},addAttributes(){return{backgroundColor:{default:null,parseHTML:e=>e.style.backgroundColor||null,renderHTML:e=>e.backgroundColor?{style:`background-color: ${e.backgroundColor}`}:{}}}},parseHTML(){return[{style:"background-color"}]},renderHTML({HTMLAttributes:e}){return["span",A.mergeAttributes(this.options.HTMLAttributes,e),0]},addCommands(){return{setBackgroundColor:e=>({commands:i})=>i.setMark(this.name,{backgroundColor:e}),unsetBackgroundColor:()=>({commands:e})=>e.unsetMark(this.name)}}}),Re=({node:e,updateAttributes:i,selected:s})=>{const[l,n]=r.useState(!1),[c,d]=r.useState(0),[a,f]=r.useState(0),[g,h]=r.useState(0),[m,k]=r.useState(0),j=r.useCallback((p,y)=>{p.preventDefault(),n(!0),d(p.clientX),f(p.clientY),h(parseInt(e.attrs.width)),k(parseInt(e.attrs.height));const x=w=>{if(!l)return;const b=w.clientX-c,M=w.clientY-a;let E=g,T=m;y.includes("right")&&(E=Math.max(200,g+b)),y.includes("left")&&(E=Math.max(200,g-b)),y.includes("bottom")&&(T=Math.max(150,m+M)),y.includes("top")&&(T=Math.max(150,m-M)),i({width:`${E}px`,height:`${T}px`})},v=()=>{n(!1),document.removeEventListener("mousemove",x),document.removeEventListener("mouseup",v)};document.addEventListener("mousemove",x),document.addEventListener("mouseup",v)},[l,c,a,g,m,e.attrs.width,e.attrs.height,i]),o=p=>{i({align:p})};return t.jsx(C.NodeViewWrapper,{className:`resizable-youtube-wrapper ${s?"ProseMirror-selectednode":""}`,style:{textAlign:e.attrs.align,position:"relative",display:"inline-block"},children:t.jsxs("div",{className:"resizable-youtube-container",style:{position:"relative",display:"inline-block",width:e.attrs.width,height:e.attrs.height},children:[t.jsx("iframe",{src:e.attrs.src,width:e.attrs.width,height:e.attrs.height,frameBorder:"0",allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",allowFullScreen:!0,style:{display:"block",width:"100%",height:"100%"}}),s&&t.jsxs(t.Fragment,{children:[t.jsx("div",{className:"resize-handle resize-handle-bottom-right",onMouseDown:p=>j(p,"bottom-right"),style:{position:"absolute",bottom:"-5px",right:"-5px",width:"10px",height:"10px",backgroundColor:"#007acc",cursor:"nw-resize",borderRadius:"2px"}}),t.jsx("div",{className:"resize-handle resize-handle-bottom-left",onMouseDown:p=>j(p,"bottom-left"),style:{position:"absolute",bottom:"-5px",left:"-5px",width:"10px",height:"10px",backgroundColor:"#007acc",cursor:"ne-resize",borderRadius:"2px"}}),t.jsx("div",{className:"resize-handle resize-handle-top-right",onMouseDown:p=>j(p,"top-right"),style:{position:"absolute",top:"-5px",right:"-5px",width:"10px",height:"10px",backgroundColor:"#007acc",cursor:"ne-resize",borderRadius:"2px"}}),t.jsx("div",{className:"resize-handle resize-handle-top-left",onMouseDown:p=>j(p,"top-left"),style:{position:"absolute",top:"-5px",left:"-5px",width:"10px",height:"10px",backgroundColor:"#007acc",cursor:"nw-resize",borderRadius:"2px"}}),t.jsxs("div",{className:"alignment-controls",style:{position:"absolute",top:"-30px",left:"0",display:"flex",gap:"5px",backgroundColor:"white",border:"1px solid #ccc",borderRadius:"4px",padding:"2px"},children:[t.jsx("button",{onClick:()=>o("left"),style:{padding:"2px 6px",border:"none",backgroundColor:e.attrs.align==="left"?"#007acc":"transparent",color:e.attrs.align==="left"?"white":"black",cursor:"pointer",borderRadius:"2px"},type:"button",children:"←"}),t.jsx("button",{onClick:()=>o("center"),style:{padding:"2px 6px",border:"none",backgroundColor:e.attrs.align==="center"?"#007acc":"transparent",color:e.attrs.align==="center"?"white":"black",cursor:"pointer",borderRadius:"2px"},type:"button",children:"⟷"}),t.jsx("button",{onClick:()=>o("right"),style:{padding:"2px 6px",border:"none",backgroundColor:e.attrs.align==="right"?"#007acc":"transparent",color:e.attrs.align==="right"?"white":"black",cursor:"pointer",borderRadius:"2px"},type:"button",children:"→"})]})]})]})})},P=Ee.extend({addAttributes(){return{...this.parent?.(),width:{default:"640px",renderHTML:e=>({width:e.width})},height:{default:"360px",renderHTML:e=>({height:e.height})},align:{default:"center",renderHTML:e=>({"data-align":e.align}),parseHTML:e=>e.getAttribute("data-align")||"center"}}},addNodeView(){return C.ReactNodeViewRenderer(Re)}}),Be=B.createLowlight(B.common);function W(){return[ne.configure({heading:{levels:[1,2,3,4,5,6]},codeBlock:!1,blockquote:!1,horizontalRule:!1,hardBreak:!1,strike:!1}),H,D,q.configure({allowBase64:!0}),z,Te,ye,$,ke,we,re.configure({resizable:!0,HTMLAttributes:{class:"editor-table"}}),oe,ae,ce,ue.configure({openOnClick:!1,HTMLAttributes:{class:"editor-link",rel:"noopener noreferrer"}}),de.configure({types:["heading","paragraph"]}),he,pe,me,ge,xe.CodeBlockLowlight.configure({lowlight:Be,HTMLAttributes:{class:"editor-code-block"}}),P.configure({controls:!0,nocookie:!1}),Ce.configure({placeholder:"Start typing..."}),Ae,Me,fe.configure({HTMLAttributes:{class:"editor-blockquote"}}),ve,je,be,F.configure({HTMLAttributes:{class:"editor-text-style"}})]}function _({className:e="",placeholder:i="Start typing..."}){return{attributes:{class:`prose focus:outline-none ${e} ${i?"has-placeholder":""}`,"aria-label":"Rich text editor","aria-placeholder":i}}}function G(e){if(!e||e.trim()==="")return{isValid:!1,error:"LaTeX expression cannot be empty"};let i=0;for(const s of e)if(s==="{"&&i++,s==="}"&&i--,i<0)return{isValid:!1,error:"Unbalanced braces"};return i!==0?{isValid:!1,error:"Unbalanced braces"}:{isValid:!0}}function Ie(e){const i=document.createElement("div");return i.textContent=e,i.innerHTML}function V(e){const i=document.createElement("div");return i.innerHTML=e,i.textContent||i.innerText||""}function He(e){return e.trim().split(/\s+/).filter(Boolean).length}function De(e){if(e===0)return"0 Bytes";const i=1024,s=["Bytes","KB","MB","GB"],l=Math.floor(Math.log(e)/Math.log(i));return Math.round(e/Math.pow(i,l)*100)/100+" "+s[l]}function qe(e,i){let s=null;return function(...n){const c=()=>{s=null,e(...n)};s&&clearTimeout(s),s=setTimeout(c,i)}}function ze(e,i){let s;return function(...n){s||(e(...n),s=!0,setTimeout(()=>s=!1,i))}}function Fe(){const e=[];return typeof window>"u"?{supported:!1,missingFeatures:["window object"]}:(window.customElements||e.push("Custom Elements"),window.localStorage||e.push("Local Storage"),{supported:e.length===0,missingFeatures:e})}function $e(e){return JSON.parse(JSON.stringify(e))}function Pe(e){return V(e).trim().length===0}function We(){return`${Date.now()}-${Math.random().toString(36).substr(2,9)}`}function _e(e,i){e.chain().focus().setBackgroundColor(i).run()}function Ge(e){e&&e.chain().focus().insertTable({rows:3,cols:3,withHeaderRow:!0}).run()}function S(e,i){if(Array.isArray(i))if(i.length>1){const l=[{type:"imageGroup",content:i.map(n=>({type:"image",attrs:{src:n,width:"250px"}}))}];e.chain().focus().insertContent(l).run()}else i.length===1&&e.chain().focus().setImage({src:i[0],width:"500px"}).run();else typeof i=="string"&&e.chain().focus().setImage({src:i,width:"500px"}).run()}function U(e,i){try{if(!e)throw new Error("Editor instance is not available");const s=i.trim(),l=G(s);if(!l.isValid)throw new Error(l.error||"Invalid LaTeX expression");e.chain().focus().insertContent({type:"math",attrs:{latex:s}}).run()}catch(s){throw console.error("Math insertion error:",s),s instanceof Error?s:new Error("Error inserting math equation")}}const u=r.memo(r.forwardRef(({onClick:e,isActive:i,title:s,children:l,shortcut:n,disabled:c},d)=>{const a=r.useRef(null),f=r.useRef(null),g=r.useCallback(()=>{if(!a.current||!f.current)return;const h=f.current.getBoundingClientRect(),m=a.current;m.style.left=`${h.left+h.width/2}px`,m.style.top=`${h.top-8}px`;const k=m.getBoundingClientRect();k.left<0&&(m.style.left="0px",m.style.transform="none"),k.right>window.innerWidth&&(m.style.left=`${window.innerWidth}px`,m.style.transform="translateX(-100%)")},[]);return r.useEffect(()=>{const h=()=>{g()},m=()=>{g()};return window.addEventListener("scroll",h,!0),window.addEventListener("resize",m),()=>{window.removeEventListener("scroll",h,!0),window.removeEventListener("resize",m)}},[g]),t.jsxs("div",{className:"tooltip-container",onMouseEnter:g,children:[t.jsx("button",{ref:h=>{f.current=h,typeof d=="function"?d(h):d&&(d.current=h)},onClick:e,className:`toolbar-button ${i?"is-active":""} ${c?"is-disabled":""}`,"aria-label":s,"aria-pressed":i,disabled:c,type:"button",children:l}),t.jsxs("div",{ref:a,className:"tooltip",children:[s,n&&t.jsx("span",{className:"tooltip-shortcut",children:n})]})]})}));u.displayName="ToolbarButton";const Ve=({editor:e,readOnly:i})=>t.jsxs("div",{className:"toolbar-group",role:"group","aria-label":"Text alignment",children:[t.jsx(u,{onClick:()=>e?.chain().focus().setTextAlign("left").run(),isActive:e?.isActive({textAlign:"left"}),title:"Align Left",disabled:!e||i,children:t.jsxs("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[t.jsx("line",{x1:"4",y1:"6",x2:"20",y2:"6"}),t.jsx("line",{x1:"4",y1:"12",x2:"14",y2:"12"}),t.jsx("line",{x1:"4",y1:"18",x2:"18",y2:"18"})]})}),t.jsx(u,{onClick:()=>e?.chain().focus().setTextAlign("center").run(),isActive:e?.isActive({textAlign:"center"}),title:"Align Center",disabled:!e||i,children:t.jsxs("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[t.jsx("line",{x1:"6",y1:"6",x2:"18",y2:"6"}),t.jsx("line",{x1:"4",y1:"12",x2:"20",y2:"12"}),t.jsx("line",{x1:"8",y1:"18",x2:"16",y2:"18"})]})}),t.jsx(u,{onClick:()=>e?.chain().focus().setTextAlign("right").run(),isActive:e?.isActive({textAlign:"right"}),title:"Align Right",disabled:!e||i,children:t.jsxs("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[t.jsx("line",{x1:"4",y1:"6",x2:"20",y2:"6"}),t.jsx("line",{x1:"10",y1:"12",x2:"20",y2:"12"}),t.jsx("line",{x1:"6",y1:"18",x2:"20",y2:"18"})]})})]}),Ue=({editor:e,readOnly:i})=>t.jsxs("div",{className:"toolbar-group",role:"group","aria-label":"Blocks",children:[t.jsx(u,{onClick:()=>e?.chain().focus().toggleBlockquote().run(),isActive:e?.isActive("blockquote"),title:"Blockquote",disabled:!e||i,children:t.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[t.jsx("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.031V20c0 1 0 1 1 1z"}),t.jsx("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 4v3c0 1 0 1 1 1z"})]})}),t.jsx(u,{onClick:()=>e?.chain().focus().setHorizontalRule().run(),title:"Horizontal Rule",disabled:!e||i,children:t.jsx("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:t.jsx("line",{x1:"5",y1:"12",x2:"19",y2:"12"})})}),t.jsx(u,{onClick:()=>e?.chain().focus().setHardBreak().run(),title:"Line Break",disabled:!e||i,children:t.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[t.jsx("path",{d:"M21 8H3M21 8L17 4M21 8L17 12"}),t.jsx("path",{d:"M3 16H15M3 16L7 12M3 16L7 20"})]})})]}),Ke=[1,2,3,4,5,6],I=768,Ye=({editor:e,readOnly:i})=>t.jsx("div",{className:"toolbar-group",role:"group","aria-label":"Headings",children:Ke.map(s=>t.jsxs(u,{onClick:()=>e?.chain().focus().toggleHeading({level:s}).run(),isActive:e?.isActive("heading",{level:s}),title:`Heading ${s}`,disabled:!e||i,children:[t.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:24,height:24,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",className:"icon icon-tabler icons-tabler-outline icon-tabler-heading",children:[t.jsx("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"}),t.jsx("path",{d:"M7 12h10"}),t.jsx("path",{d:"M7 5v14"}),t.jsx("path",{d:"M17 5v14"}),t.jsx("path",{d:"M15 19h4"}),t.jsx("path",{d:"M15 5h4"}),t.jsx("path",{d:"M5 19h4"}),t.jsx("path",{d:"M5 5h4"})]}),s]},s))}),Oe=({editor:e,readOnly:i})=>!e?.isActive("image")||e?.isActive("imageGroup")?null:t.jsxs("div",{className:"toolbar-group",role:"group","aria-label":"Image alignment",children:[t.jsx(u,{onClick:()=>e?.chain().focus().updateAttributes("image",{align:"left"}).run(),isActive:e?.isActive("image",{align:"left"}),title:"Align Image Left",disabled:!e?.isActive("image")||i,children:t.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[t.jsx("line",{x1:"3",y1:"6",x2:"21",y2:"6"}),t.jsx("line",{x1:"3",y1:"12",x2:"15",y2:"12"}),t.jsx("line",{x1:"3",y1:"18",x2:"18",y2:"18"})]})}),t.jsx(u,{onClick:()=>e?.chain().focus().updateAttributes("image",{align:"center"}).run(),isActive:e?.isActive("image",{align:"center"}),title:"Align Image Center",disabled:!e?.isActive("image")||i,children:t.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[t.jsx("line",{x1:"3",y1:"6",x2:"21",y2:"6"}),t.jsx("line",{x1:"6",y1:"12",x2:"18",y2:"12"}),t.jsx("line",{x1:"4",y1:"18",x2:"20",y2:"18"})]})}),t.jsx(u,{onClick:()=>e?.chain().focus().updateAttributes("image",{align:"right"}).run(),isActive:e?.isActive("image",{align:"right"}),title:"Align Image Right",disabled:!e?.isActive("image")||i,children:t.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[t.jsx("line",{x1:"3",y1:"6",x2:"21",y2:"6"}),t.jsx("line",{x1:"9",y1:"12",x2:"21",y2:"12"}),t.jsx("line",{x1:"6",y1:"18",x2:"21",y2:"18"})]})})]}),Je=({editor:e,readOnly:i})=>e?.isActive("imageGroup")?t.jsxs("div",{className:"toolbar-group",role:"group","aria-label":"Image group alignment",children:[t.jsx(u,{onClick:()=>e?.chain().focus().updateAttributes("imageGroup",{align:"left"}).run(),isActive:e?.isActive("imageGroup",{align:"left"}),title:"Align Group Left",disabled:!e?.isActive("imageGroup")||i,children:t.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[t.jsx("line",{x1:"3",y1:"6",x2:"21",y2:"6"}),t.jsx("line",{x1:"3",y1:"12",x2:"15",y2:"12"}),t.jsx("line",{x1:"3",y1:"18",x2:"18",y2:"18"})]})}),t.jsx(u,{onClick:()=>e?.chain().focus().updateAttributes("imageGroup",{align:"center"}).run(),isActive:e?.isActive("imageGroup",{align:"center"}),title:"Align Group Center",disabled:!e?.isActive("imageGroup")||i,children:t.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[t.jsx("line",{x1:"3",y1:"6",x2:"21",y2:"6"}),t.jsx("line",{x1:"6",y1:"12",x2:"18",y2:"12"}),t.jsx("line",{x1:"4",y1:"18",x2:"20",y2:"18"})]})}),t.jsx(u,{onClick:()=>e?.chain().focus().updateAttributes("imageGroup",{align:"right"}).run(),isActive:e?.isActive("imageGroup",{align:"right"}),title:"Align Group Right",disabled:!e?.isActive("imageGroup")||i,children:t.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[t.jsx("line",{x1:"3",y1:"6",x2:"21",y2:"6"}),t.jsx("line",{x1:"9",y1:"12",x2:"21",y2:"12"}),t.jsx("line",{x1:"6",y1:"18",x2:"21",y2:"18"})]})})]}):null,Xe=({editor:e,readOnly:i})=>t.jsxs("div",{className:"toolbar-group",role:"group","aria-label":"Lists",children:[t.jsx(u,{onClick:()=>e?.chain().focus().toggleBulletList().run(),isActive:e?.isActive("bulletList"),title:"Bullet List",disabled:!e||i,children:t.jsxs("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[t.jsx("line",{x1:"9",y1:"6",x2:"20",y2:"6"}),t.jsx("line",{x1:"9",y1:"12",x2:"20",y2:"12"}),t.jsx("line",{x1:"9",y1:"18",x2:"20",y2:"18"}),t.jsx("circle",{cx:"5",cy:"6",r:"1"}),t.jsx("circle",{cx:"5",cy:"12",r:"1"}),t.jsx("circle",{cx:"5",cy:"18",r:"1"})]})}),t.jsx(u,{onClick:()=>e?.chain().focus().toggleOrderedList().run(),isActive:e?.isActive("orderedList"),title:"Numbered List",disabled:!e||i,children:t.jsxs("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[t.jsx("line",{x1:"11",y1:"6",x2:"20",y2:"6"}),t.jsx("line",{x1:"11",y1:"12",x2:"20",y2:"12"}),t.jsx("line",{x1:"11",y1:"18",x2:"20",y2:"18"}),t.jsx("text",{x:"5",y:"8",fontSize:"4",children:"1"}),t.jsx("text",{x:"5",y:"14",fontSize:"4",children:"2"}),t.jsx("text",{x:"5",y:"20",fontSize:"4",children:"3"})]})}),t.jsx(u,{onClick:()=>e?.chain().focus().toggleTaskList().run(),isActive:e?.isActive("taskList"),title:"Task List",disabled:!e||i,children:t.jsxs("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[t.jsx("rect",{x:"4",y:"4",width:"16",height:"16",rx:"2"}),t.jsx("path",{d:"M9 12l2 2l4 -4"})]})})]}),Ze=({editor:e,readOnly:i,onMathDialogOpen:s,onImagePicker:l})=>t.jsxs("div",{className:"toolbar-group",role:"group","aria-label":"Special features",children:[t.jsx(u,{onClick:s,title:"Insert Math Equation (Ctrl/Cmd + M)",disabled:!e||i,children:t.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:"icon icon-tabler icons-tabler-outline icon-tabler-math",children:[t.jsx("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"}),t.jsx("path",{d:"M19 5h-7l-4 14l-3 -6h-2"}),t.jsx("path",{d:"M14 13l6 6"}),t.jsx("path",{d:"M14 19l6 -6"})]})}),t.jsx(u,{onClick:l,title:"Insert Image",disabled:!e||i,children:t.jsxs("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[t.jsx("rect",{x:"3",y:"3",width:"18",height:"18",rx:"2",ry:"2"}),t.jsx("circle",{cx:"8.5",cy:"8.5",r:"1.5"}),t.jsx("polyline",{points:"21 15 16 10 5 21"})]})}),t.jsx(u,{onClick:()=>Ge(e),title:"Insert Table",disabled:!e||i,children:t.jsx("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:t.jsx("path",{d:"M3 3h18v18H3zM12 3v18M3 12h18M3 8h18M3 16h18"})})}),t.jsx(u,{onClick:()=>{const n=window.prompt("Enter YouTube video URL:");n&&e.chain().focus().setYoutubeVideo({src:n}).run()},title:"Insert YouTube Video",disabled:!e||i,children:t.jsxs("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[t.jsx("rect",{x:"2",y:"4",width:"20",height:"16",rx:"3"}),t.jsx("polygon",{points:"10,9 16,12 10,15",fill:"currentColor"})]})})]}),Qe=({editor:e,readOnly:i})=>t.jsxs("div",{className:"toolbar-group",role:"group","aria-label":"Text formatting",children:[t.jsx(u,{onClick:()=>{if(!e)return;const s=e.getAttributes("link").href||"",l=window.prompt("Enter URL:",s);if(l!==null){if(l===""){e.chain().focus().unsetLink().run();return}e.chain().focus().setLink({href:l}).run()}},isActive:e?.isActive("link"),title:"Insert/Edit Link",shortcut:"Ctrl+K",disabled:!e||i,children:t.jsxs("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[t.jsx("path",{d:"M15 7h3a5 5 0 0 1 5 5 5 5 0 0 1-5 5h-3m-6 0H6a5 5 0 0 1-5-5 5 5 0 0 1 5-5h3"}),t.jsx("line",{x1:"8",y1:"12",x2:"16",y2:"12"})]})}),t.jsx(u,{onClick:()=>e?.chain().focus().unsetLink().run(),isActive:!1,title:"Remove Link",disabled:!e||i||!e?.isActive("link"),children:t.jsxs("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[t.jsx("path",{d:"M15 7h3a5 5 0 0 1 5 5 5 5 0 0 1-5 5h-3m-6 0H6a5 5 0 0 1-5-5 5 5 0 0 1 5-5h3"}),t.jsx("line",{x1:"8",y1:"12",x2:"16",y2:"12"}),t.jsx("line",{x1:"17",y1:"7",x2:"7",y2:"17"})]})}),t.jsx(u,{onClick:()=>e?.chain().focus().toggleBold().run(),isActive:e?.isActive("bold"),title:"Bold",shortcut:"Ctrl+B",disabled:!e||i,children:t.jsxs("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[t.jsx("path",{d:"M7 5h6a3 3 0 0 1 0 6H7z"}),t.jsx("path",{d:"M7 11h8a3 3 0 0 1 0 6H7z"})]})}),t.jsx(u,{onClick:()=>e?.chain().focus().toggleItalic().run(),isActive:e?.isActive("italic"),title:"Italic",shortcut:"Ctrl+I",disabled:!e||i,children:t.jsxs("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[t.jsx("line",{x1:"19",y1:"4",x2:"10",y2:"4"}),t.jsx("line",{x1:"14",y1:"20",x2:"5",y2:"20"}),t.jsx("line",{x1:"15",y1:"4",x2:"9",y2:"20"})]})}),t.jsx(u,{onClick:()=>e?.chain().focus().toggleUnderline().run(),isActive:e?.isActive("underline"),title:"Underline",shortcut:"Ctrl+U",disabled:!e||i,children:t.jsxs("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[t.jsx("path",{d:"M6 4v6a6 6 0 0 0 12 0V4"}),t.jsx("line",{x1:"4",y1:"20",x2:"20",y2:"20"})]})}),t.jsx(u,{onClick:()=>e?.chain().focus().toggleStrike().run(),isActive:e?.isActive("strike"),title:"Strike-through",shortcut:"Ctrl+Shift+S",disabled:!e||i,children:t.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:"icon icon-tabler icons-tabler-outline icon-tabler-strikethrough",children:[t.jsx("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"}),t.jsx("path",{d:"M5 12l14 0"}),t.jsx("path",{d:"M16 6.5a4 2 0 0 0 -4 -1.5h-1a3.5 3.5 0 0 0 0 7h2a3.5 3.5 0 0 1 0 7h-1.5a4 2 0 0 1 -4 -1.5"})]})}),t.jsx(u,{onClick:()=>e?.chain().focus().toggleHighlight().run(),isActive:e?.isActive("highlight"),title:"Highlight",disabled:!e||i,children:t.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:"icon icon-tabler icons-tabler-outline icon-tabler-highlight",children:[t.jsx("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"}),t.jsx("path",{d:"M3 19h4l10.5 -10.5a2.828 2.828 0 1 0 -4 -4l-10.5 10.5v4"}),t.jsx("path",{d:"M12.5 5.5l4 4"}),t.jsx("path",{d:"M4.5 13.5l4 4"}),t.jsx("path",{d:"M21 15v4h-8l4 -4z"})]})}),t.jsx(u,{onClick:()=>e?.chain().focus().toggleSubscript().run(),isActive:e?.isActive("subscript"),title:"Subscript",disabled:!e||i,children:t.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:"icon icon-tabler icons-tabler-outline icon-tabler-subscript",children:[t.jsx("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"}),t.jsx("path",{d:"M5 7l8 10m-8 0l8 -10"}),t.jsx("path",{d:"M21 20h-4l3.5 -4a1.73 1.73 0 0 0 -3.5 -2"})]})}),t.jsx(u,{onClick:()=>e?.chain().focus().toggleSuperscript().run(),isActive:e?.isActive("superscript"),title:"Superscript",disabled:!e||i,children:t.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:"icon icon-tabler icons-tabler-outline icon-tabler-superscript",children:[t.jsx("path",{stroke:"none",d:"M0 0h24v24H0z",fill:"none"}),t.jsx("path",{d:"M5 7l8 10m-8 0l8 -10"}),t.jsx("path",{d:"M21 11h-4l3.5 -4a1.73 1.73 0 0 0 -3.5 -2"})]})}),t.jsx(u,{onClick:()=>e?.chain().focus().unsetAllMarks().run(),title:"Clear Formatting",disabled:!e||i,children:t.jsxs("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[t.jsx("path",{d:"M17 17L7 7"}),t.jsx("path",{d:"M7 17l10-10"})]})}),t.jsxs("div",{className:"tooltip-container",style:{position:"relative"},children:[t.jsx("input",{type:"color","aria-label":"Text Color",disabled:!e||i,onChange:s=>e?.chain().focus().setColor(s.target.value).run(),style:{width:36,height:36,border:"2px solid rgba(226, 232, 240, 0.8)",borderRadius:"0.375rem",background:"none",cursor:"pointer",marginRight:4}}),t.jsx("div",{className:"tooltip",children:"Text Color"})]}),t.jsxs("div",{className:"tooltip-container",style:{position:"relative"},children:[t.jsx("input",{type:"color","aria-label":"Background Color",disabled:!e||i,onChange:s=>_e(e,s.target.value),style:{width:36,height:36,border:"2px solid rgba(226, 232, 240, 0.8)",borderRadius:"0.375rem",background:"none",cursor:"pointer",marginRight:4}}),t.jsx("div",{className:"tooltip",children:"Background Color"})]})]}),et=({editor:e,readOnly:i})=>e?.isActive("youtube")?t.jsxs("div",{className:"toolbar-group",role:"group","aria-label":"YouTube controls",style:{display:"flex",alignItems:"center",gap:8},children:[t.jsx(u,{onClick:()=>e?.chain().focus().updateAttributes("youtube",{align:"left"}).run(),isActive:e?.isActive("youtube",{align:"left"}),title:"Align YouTube Left",disabled:!e?.isActive("youtube")||i,children:t.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[t.jsx("line",{x1:"3",y1:"6",x2:"21",y2:"6"}),t.jsx("line",{x1:"3",y1:"12",x2:"15",y2:"12"}),t.jsx("line",{x1:"3",y1:"18",x2:"18",y2:"18"})]})}),t.jsx(u,{onClick:()=>e?.chain().focus().updateAttributes("youtube",{align:"center"}).run(),isActive:e?.isActive("youtube",{align:"center"}),title:"Align YouTube Center",disabled:!e?.isActive("youtube")||i,children:t.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[t.jsx("line",{x1:"3",y1:"6",x2:"21",y2:"6"}),t.jsx("line",{x1:"6",y1:"12",x2:"18",y2:"12"}),t.jsx("line",{x1:"4",y1:"18",x2:"20",y2:"18"})]})}),t.jsx(u,{onClick:()=>e?.chain().focus().updateAttributes("youtube",{align:"right"}).run(),isActive:e?.isActive("youtube",{align:"right"}),title:"Align YouTube Right",disabled:!e?.isActive("youtube")||i,children:t.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[t.jsx("line",{x1:"3",y1:"6",x2:"21",y2:"6"}),t.jsx("line",{x1:"9",y1:"12",x2:"21",y2:"12"}),t.jsx("line",{x1:"6",y1:"18",x2:"21",y2:"18"})]})}),t.jsx("input",{type:"number",min:100,max:1920,step:10,value:parseInt(e.getAttributes("youtube").width||640,10),onChange:s=>e.chain().focus().updateAttributes("youtube",{width:`${s.target.value}px`}).run(),style:{width:60,marginLeft:8,marginRight:2,fontSize:14,padding:"2px 4px"},"aria-label":"YouTube width",disabled:!e?.isActive("youtube")||i,title:"YouTube Width"}),t.jsx("span",{style:{fontSize:14},children:"×"}),t.jsx("input",{type:"number",min:56,max:1080,step:10,value:parseInt(e.getAttributes("youtube").height||360,10),onChange:s=>e.chain().focus().updateAttributes("youtube",{height:`${s.target.value}px`}).run(),style:{width:60,marginLeft:2,fontSize:14,padding:"2px 4px"},"aria-label":"YouTube height",disabled:!e?.isActive("youtube")||i,title:"YouTube Height"})]}):null,tt=e=>{const{editor:i,readOnly:s,onMathDialogOpen:l,onImagePicker:n}=e;return t.jsx("div",{className:"toolbar",role:"toolbar","aria-label":"Editor toolbar",children:t.jsxs("div",{className:"toolbar-content",children:[t.jsx(Qe,{editor:i,readOnly:s}),t.jsx("div",{className:"toolbar-divider"}),t.jsx(Ye,{editor:i,readOnly:s}),t.jsx("div",{className:"toolbar-divider"}),t.jsx(Xe,{editor:i,readOnly:s}),t.jsx("div",{className:"toolbar-divider"}),t.jsx(Ve,{editor:i,readOnly:s}),t.jsx("div",{className:"toolbar-divider"}),t.jsx(Ue,{editor:i,readOnly:s}),t.jsx("div",{className:"toolbar-divider"}),t.jsxs("div",{className:"toolbar-media-group",style:{alignItems:"center",display:"flex"},children:[t.jsx(Oe,{editor:i,readOnly:s}),t.jsx(Je,{editor:i,readOnly:s}),t.jsx(et,{editor:i,readOnly:s})]}),t.jsx(Ze,{editor:i,readOnly:s,onMathDialogOpen:l||(()=>{}),onImagePicker:n||(()=>{})})]})})},it=({isLoading:e})=>t.jsx("div",{children:e&&t.jsx("div",{className:"loading-overlay",children:t.jsx("div",{className:"spinner"})})}),K=()=>typeof window>"u"?Promise.resolve():import("mathlive").then(()=>{});K();const Y=r.forwardRef(({onClose:e,onInsert:i,initialValue:s=""},l)=>{const[n,c]=r.useState(s),[d,a]=r.useState("basic"),[f,g]=r.useState(!1),h=r.useRef(null),m=r.useRef(null),k=r.useCallback(x=>{c(x.target.value)},[]),j=r.useCallback(()=>{g(!0);try{i(n),e()}finally{g(!1)}},[n,i,e]),o=r.useCallback(x=>{h.current&&(h.current.insert(x),h.current.focus())},[]);r.useEffect(()=>{h.current&&(h.current.value=n,h.current.focus());const x=v=>{v.key==="Escape"?e():v.key==="Enter"&&!v.shiftKey&&!v.ctrlKey&&!v.metaKey&&(v.preventDefault(),j())};return document.addEventListener("keydown",x),()=>{document.removeEventListener("keydown",x)}},[n,e,j]);const p=r.useMemo(()=>({basic:[{symbol:"+",title:"Plus",display:"+"},{symbol:"-",title:"Minus",display:"−"},{symbol:"\\times",title:"Multiply",display:"×"},{symbol:"\\div",title:"Divide",display:"÷"},{symbol:"\\pm",title:"Plus Minus",display:"±"},{symbol:"\\mp",title:"Minus Plus",display:"∓"},{symbol:"=",title:"Equals",display:"="},{symbol:"\\neq",title:"Not Equal",display:"≠"},{symbol:"\\approx",title:"Approximately",display:"≈"},{symbol:"\\equiv",title:"Equivalent",display:"≡"},{symbol:"<",title:"Less Than",display:"<"},{symbol:">",title:"Greater Than",display:">"},{symbol:"\\leq",title:"Less or Equal",display:"≤"},{symbol:"\\geq",title:"Greater or Equal",display:"≥"},{symbol:"\\ll",title:"Much Less",display:"≪"},{symbol:"\\gg",title:"Much Greater",display:"≫"}],fractions:[{symbol:"\\frac{}{}",title:"Fraction",display:"a/b"},{symbol:"\\frac{1}{2}",title:"One Half",display:"½"},{symbol:"\\frac{1}{3}",title:"One Third",display:"⅓"},{symbol:"\\frac{1}{4}",title:"One Quarter",display:"¼"},{symbol:"\\frac{3}{4}",title:"Three Quarters",display:"¾"},{symbol:"\\frac{2}{3}",title:"Two Thirds",display:"⅔"},{symbol:"\\frac{d}{dx}",title:"Derivative",display:"d/dx"},{symbol:"\\frac{\\partial}{\\partial x}",title:"Partial Derivative",display:"∂/∂x"}],powers:[{symbol:"#@^2",title:"Square",display:"x²"},{symbol:"#@^3",title:"Cube",display:"x³"},{symbol:"#@^{}",title:"Power",display:"xⁿ"},{symbol:"#@_{}",title:"Subscript",display:"x₁"},{symbol:"#@_{}^{}",title:"Sub-Superscript",display:"xₙᵐ"},{symbol:"\\sqrt{}",title:"Square Root",display:"√"},{symbol:"\\sqrt[3]{}",title:"Cube Root",display:"∛"},{symbol:"\\sqrt[n]{}",title:"Nth Root",display:"ⁿ√"},{symbol:"e^{}",title:"Exponential",display:"eˣ"},{symbol:"10^{}",title:"Power of 10",display:"10ˣ"},{symbol:"#@^{-1}",title:"Reciprocal",display:"x⁻¹"}],trig:[{symbol:"\\sin",title:"Sine",display:"sin"},{symbol:"\\cos",title:"Cosine",display:"cos"},{symbol:"\\tan",title:"Tangent",display:"tan"},{symbol:"\\cot",title:"Cotangent",display:"cot"},{symbol:"\\sec",title:"Secant",display:"sec"},{symbol:"\\csc",title:"Cosecant",display:"csc"},{symbol:"\\arcsin",title:"Arcsine",display:"sin⁻¹"},{symbol:"\\arccos",title:"Arccosine",display:"cos⁻¹"},{symbol:"\\arctan",title:"Arctangent",display:"tan⁻¹"},{symbol:"\\sinh",title:"Hyperbolic Sine",display:"sinh"},{symbol:"\\cosh",title:"Hyperbolic Cosine",display:"cosh"},{symbol:"\\tanh",title:"Hyperbolic Tangent",display:"tanh"}],logs:[{symbol:"\\log",title:"Logarithm",display:"log"},{symbol:"\\log_{}",title:"Log Base",display:"log₍ₓ₎"},{symbol:"\\log_{10}",title:"Log Base 10",display:"log₁₀"},{symbol:"\\log_2",title:"Log Base 2",display:"log₂"},{symbol:"\\ln",title:"Natural Log",display:"ln"},{symbol:"\\lg",title:"Common Log",display:"lg"},{symbol:"e",title:"Euler's Number",display:"e"},{symbol:"\\exp",title:"Exponential Function",display:"exp"}],greek:[{symbol:"\\alpha",title:"Alpha",display:"α"},{symbol:"\\beta",title:"Beta",display:"β"},{symbol:"\\gamma",title:"Gamma",display:"γ"},{symbol:"\\delta",title:"Delta",display:"δ"},{symbol:"\\epsilon",title:"Epsilon",display:"ε"},{symbol:"\\zeta",title:"Zeta",display:"ζ"},{symbol:"\\eta",title:"Eta",display:"η"},{symbol:"\\theta",title:"Theta",display:"θ"},{symbol:"\\lambda",title:"Lambda",display:"λ"},{symbol:"\\mu",title:"Mu",display:"μ"},{symbol:"\\nu",title:"Nu",display:"ν"},{symbol:"\\pi",title:"Pi",display:"π"},{symbol:"\\rho",title:"Rho",display:"ρ"},{symbol:"\\sigma",title:"Sigma",display:"σ"},{symbol:"\\tau",title:"Tau",display:"τ"},{symbol:"\\phi",title:"Phi",display:"φ"},{symbol:"\\chi",title:"Chi",display:"χ"},{symbol:"\\psi",title:"Psi",display:"ψ"},{symbol:"\\omega",title:"Omega",display:"ω"},{symbol:"\\Gamma",title:"Capital Gamma",display:"Γ"},{symbol:"\\Delta",title:"Capital Delta",display:"Δ"},{symbol:"\\Theta",title:"Capital Theta",display:"Θ"},{symbol:"\\Lambda",title:"Capital Lambda",display:"Λ"},{symbol:"\\Pi",title:"Capital Pi",display:"Π"},{symbol:"\\Sigma",title:"Capital Sigma",display:"Σ"},{symbol:"\\Phi",title:"Capital Phi",display:"Φ"},{symbol:"\\Psi",title:"Capital Psi",display:"Ψ"},{symbol:"\\Omega",title:"Capital Omega",display:"Ω"}],calculus:[{symbol:"\\sum",title:"Sum",display:"∑"},{symbol:"\\sum_{i=1}^{n}",title:"Sum with Limits",display:"∑ᵢ₌₁ⁿ"},{symbol:"\\prod",title:"Product",display:"∏"},{symbol:"\\prod_{i=1}^{n}",title:"Product with Limits",display:"∏ᵢ₌₁ⁿ"},{symbol:"\\int",title:"Integral",display:"∫"},{symbol:"\\int_{a}^{b}",title:"Definite Integral",display:"∫ₐᵇ"},{symbol:"\\iint",title:"Double Integral",display:"∬"},{symbol:"\\iiint",title:"Triple Integral",display:"∭"},{symbol:"\\oint",title:"Contour Integral",display:"∮"},{symbol:"\\lim",title:"Limit",display:"lim"},{symbol:"\\lim_{x \\to \\infty}",title:"Limit to Infinity",display:"lim_{x→∞}"},{symbol:"\\lim_{x \\to 0}",title:"Limit to Zero",display:"lim_{x→0}"},{symbol:"\\nabla",title:"Nabla/Gradient",display:"∇"},{symbol:"\\partial",title:"Partial",display:"∂"}],symbols:[{symbol:"\\infty",title:"Infinity",display:"∞"},{symbol:"\\emptyset",title:"Empty Set",display:"∅"},{symbol:"\\in",title:"Element Of",display:"∈"},{symbol:"\\notin",title:"Not Element Of",display:"∉"},{symbol:"\\subset",title:"Subset",display:"⊂"},{symbol:"\\supset",title:"Superset",display:"⊃"},{symbol:"\\subseteq",title:"Subset or Equal",display:"⊆"},{symbol:"\\supseteq",title:"Superset or Equal",display:"⊇"},{symbol:"\\cup",title:"Union",display:"∪"},{symbol:"\\cap",title:"Intersection",display:"∩"},{symbol:"\\forall",title:"For All",display:"∀"},{symbol:"\\exists",title:"Exists",display:"∃"},{symbol:"\\nexists",title:"Does Not Exist",display:"∄"},{symbol:"\\therefore",title:"Therefore",display:"∴"},{symbol:"\\because",title:"Because",display:"∵"},{symbol:"\\propto",title:"Proportional",display:"∝"},{symbol:"\\cdot",title:"Center Dot",display:"·"},{symbol:"\\bullet",title:"Bullet",display:"•"}],geometry:[{symbol:"#@^\\circ",title:"Degree Symbol",display:"°"},{symbol:"100^\\circ",title:"100 Degrees",display:"100°"},{symbol:"90^\\circ",title:"90 Degrees",display:"90°"},{symbol:"180^\\circ",title:"180 Degrees",display:"180°"},{symbol:"360^\\circ",title:"360 Degrees",display:"360°"},{symbol:"\\angle",title:"Angle",display:"∠"},{symbol:"\\angle ABC",title:"Angle ABC",display:"∠ABC"},{symbol:"\\measuredangle",title:"Measured Angle",display:"∡"},{symbol:"\\sphericalangle",title:"Spherical Angle",display:"∢"},{symbol:"\\triangle",title:"Triangle",display:"△"},{symbol:"\\triangle ABC",title:"Triangle ABC",display:"△ABC"},{symbol:"\\square",title:"Square",display:"□"},{symbol:"\\blacksquare",title:"Black Square",display:"■"},{symbol:"\\diamond",title:"Diamond",display:"◊"},{symbol:"\\blacklozenge",title:"Black Diamond",display:"⧫"},{symbol:"\\bigcirc",title:"Circle",display:"○"},{symbol:"\\circ",title:"Small Circle",display:"∘"},{symbol:"\\odot",title:"Circle Dot",display:"⊙"},{symbol:"\\parallel",title:"Parallel",display:"∥"},{symbol:"\\nparallel",title:"Not Parallel",display:"∦"},{symbol:"\\perp",title:"Perpendicular",display:"⊥"},{symbol:"\\cong",title:"Congruent",display:"≅"},{symbol:"\\ncong",title:"Not Congruent",display:"≇"},{symbol:"\\sim",title:"Similar",display:"∼"},{symbol:"\\nsim",title:"Not Similar",display:"≁"},{symbol:"\\simeq",title:"Similar or Equal",display:"≃"},{symbol:"\\overline{AB}",title:"Line Segment",display:"AB̄"},{symbol:"\\overrightarrow{AB}",title:"Ray",display:"AB⃗"},{symbol:"\\overleftrightarrow{AB}",title:"Line",display:"AB↔"}],brackets:[{symbol:"()",title:"Parentheses",display:"( )"},{symbol:"[]",title:"Square Brackets",display:"[ ]"},{symbol:"\\{\\}",title:"Curly Braces",display:"{ }"},{symbol:"\\langle\\rangle",title:"Angle Brackets",display:"⟨ ⟩"},{symbol:"\\left(\\right)",title:"Auto-sized Parentheses",display:"( )"},{symbol:"\\left[\\right]",title:"Auto-sized Brackets",display:"[ ]"},{symbol:"\\left\\{\\right\\}",title:"Auto-sized Braces",display:"{ }"},{symbol:"\\left|\\right|",title:"Absolute Value",display:"| |"},{symbol:"\\left\\|\\right\\|",title:"Norm",display:"‖ ‖"},{symbol:"\\left\\langle\\right\\rangle",title:"Auto-sized Angle",display:"⟨ ⟩"},{symbol:"\\left\\lceil\\right\\rceil",title:"Ceiling",display:"⌈ ⌉"},{symbol:"\\left\\lfloor\\right\\rfloor",title:"Floor",display:"⌊ ⌋"}]}),[]),y=r.useCallback(x=>t.jsx("div",{className:"math-toolbar-grid",children:x.map((v,w)=>t.jsx("button",{onClick:()=>o(v.symbol),title:v.title,className:"math-symbol-button",type:"button",children:v.display},w))}),[o]);return t.jsx("div",{className:"math-dialog-overlay",onClick:x=>{x.stopPropagation()},role:"dialog","aria-modal":"true","aria-labelledby":"math-dialog-title",children:t.jsxs("div",{className:"math-dialog",ref:m,onClick:x=>x.stopPropagation(),children:[t.jsxs("div",{className:"math-dialog-header",children:[t.jsx("h3",{id:"math-dialog-title",children:"Insert Math Equation"}),t.jsx("button",{className:"close-button",onClick:e,type:"button","aria-label":"Close dialog",children:"×"})]}),t.jsx("div",{className:"math-toolbar-tabs",children:Object.keys(p).map(x=>t.jsx("button",{className:`tab-button ${d===x?"active":""}`,onClick:()=>a(x),type:"button",children:x.charAt(0).toUpperCase()+x.slice(1)},x))}),t.jsx("div",{className:"math-toolbar-container",children:y(p[d])}),t.jsxs("div",{className:"math-examples",children:[t.jsx("h4",{children:"General Math"}),t.jsxs("div",{className:"equation-buttons",children:[t.jsx("button",{onClick:()=>o("x = \\frac{-b \\pm \\sqrt{b^2 - 4ac}}{2a}"),type:"button",children:"Quadratic Formula"}),t.jsx("button",{onClick:()=>o("a^2 + b^2 = c^2"),type:"button",children:"Pythagorean Theorem"}),t.jsx("button",{onClick:()=>o("A = \\pi r^2"),type:"button",children:"Area of Circle"}),t.jsx("button",{onClick:()=>o("C = 2 \\pi r"),type:"button",children:"Circumference"})]})]}),t.jsxs("div",{className:"math-examples",children:[t.jsx("h4",{children:"Higher Math"}),t.jsxs("div",{className:"equation-buttons",children:[t.jsx("button",{onClick:()=>o("\\frac{dy}{dx}"),type:"button",children:"Derivative"}),t.jsx("button",{onClick:()=>o("e^{i\\pi} + 1 = 0"),type:"button",children:"Euler's Identity"}),t.jsx("button",{onClick:()=>o("f'(x) = \\lim_{h \\to 0} \\frac{f(x+h) - f(x)}{h}"),type:"button",children:"Limit Definition of Derivative"}),t.jsx("button",{onClick:()=>o("\\int_{-\\infty}^{\\infty} e^{-x^2} dx = \\sqrt{\\pi}"),type:"button",children:"Gaussian Integral"})]})]}),t.jsxs("div",{className:"math-examples",children:[t.jsx("h4",{children:"Physics"}),t.jsxs("div",{className:"equation-buttons",children:[t.jsx("button",{onClick:()=>o("F = ma"),type:"button",children:"Newton's 2nd Law"}),t.jsx("button",{onClick:()=>o("E = mc^2"),type:"button",children:"E=mc²"}),t.jsx("button",{onClick:()=>o("KE = \\frac{1}{2} mv^2"),type:"button",children:"Kinetic Energy"}),t.jsx("button",{onClick:()=>o("V = IR"),type:"button",children:"Ohm's Law"}),t.jsx("button",{onClick:()=>o("\\Delta x \\Delta p \\geq \\frac{\\hbar}{2}"),type:"button",children:"Uncertainty Principle"}),t.jsx("button",{onClick:()=>o("\\nabla \\cdot \\vec{E} = \\frac{\\rho}{\\epsilon_0}"),type:"button",children:"Gauss's Law"})]})]}),t.jsxs("div",{className:"math-examples",children:[t.jsx("h4",{children:"Chemistry"}),t.jsxs("div",{className:"equation-buttons",children:[t.jsx("button",{onClick:()=>o("H_2O"),type:"button",children:"Water Formula"}),t.jsx("button",{onClick:()=>o("n = \\frac{m}{M}"),type:"button",children:"Molar Mass"}),t.jsx("button",{onClick:()=>o("PV = nRT"),type:"button",children:"Ideal Gas Law"}),t.jsx("button",{onClick:()=>o("2H_2 + O_2 \\to 2H_2O"),type:"button",children:"Chemical Reaction"}),t.jsx("button",{onClick:()=>o("K_a = \\frac{[H^+][A^-]}{[HA]}"),type:"button",children:"Acid Constant"})]})]}),t.jsxs("div",{className:"math-examples",children:[t.jsx("h4",{children:"Geometry"}),t.jsxs("div",{className:"equation-buttons",children:[t.jsx("button",{onClick:()=>o("\\angle ABC = 90^\\circ"),type:"button",children:"Right Angle"}),t.jsx("button",{onClick:()=>o("\\angle ABC = 180^\\circ"),type:"button",children:"Straight Angle"}),t.jsx("button",{onClick:()=>o("A = \\frac{1}{2}bh"),type:"button",children:"Triangle Area"}),t.jsx("button",{onClick:()=>o("A = s^2"),type:"button"