reactjs-tiptap-editor/lib/Katex.cjs

A modern WYSIWYG rich text editor based on tiptap and shadcn ui for React

"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("./index-CSvnpArE.cjs"),f=require("./dom-dataset-DmsCLv1q.cjs"),n=require("react/jsx-runtime"),c=require("react"),b=require("katex"),j=require("lucide-react"),u=require("./RichTextEditor-DaQRHXru.cjs"),w=require("./textarea-DNGemIPu.cjs"),k=require("./index-Dz3YxLE7.cjs");function $({editor:e,...t}){const{t:s}=k.useLocale(),o=u.useAttributes(e,x.name,{text:"",defaultShowPicker:!1}),{text:i,defaultShowPicker:r}=o,[a,d]=c.useState(""),g=c.useCallback(()=>{e.chain().focus().setKatex({text:a}).run(),d("")},[e,a]);c.useEffect(()=>{r&&e.chain().updateAttributes(x.name,{defaultShowPicker:!1}).focus().run()},[e,r]);const h=c.useMemo(()=>{try{return b.renderToString(`${a}`)}catch{return a}},[a]),m=c.useMemo(()=>`${a}`.trim()?n.jsx("span",{contentEditable:!1,dangerouslySetInnerHTML:{__html:h||""}}):null,[a,h]);return n.jsxs(u.Popover,{modal:!0,children:[n.jsx(u.PopoverTrigger,{asChild:!0,children:n.jsx(u.ActionButton,{icon:t==null?void 0:t.icon,tooltip:t==null?void 0:t.tooltip})}),n.jsxs(u.PopoverContent,{align:"start",className:"richtext-size-full richtext-p-2",hideWhenDetached:!0,side:"bottom",children:[n.jsx(u.Label,{className:"richtext-mb-[6px]",children:s("editor.formula.dialog.text")}),n.jsx("div",{className:"richtext-mb-[16px] richtext-flex richtext-w-full richtext-max-w-sm richtext-items-center richtext-gap-1.5",children:n.jsx("div",{className:"richtext-relative richtext-w-full richtext-max-w-sm",children:n.jsx(w.Textarea,{autoFocus:!0,className:"richtext-w-full",defaultValue:i,onChange:p=>d(p.target.value),placeholder:"Text",required:!0,rows:3,value:a})})}),m&&n.jsx("div",{className:"richtext-my-[10px] richtext-max-w-[286px] richtext-overflow-auto richtext-whitespace-nowrap richtext-rounded-[6px] !richtext-border richtext-p-[10px]",children:m}),n.jsxs("div",{className:"richtext-flex richtext-items-center richtext-justify-between richtext-gap-[6px]",children:[n.jsx(u.Button,{className:"richtext-flex-1",onClick:g,children:"Submit"}),n.jsx("a",{href:"https://katex.org/docs/supported",rel:"noreferrer noopener",target:"_blank",children:n.jsx(j.HelpCircle,{size:16})})]})]})]})}function T(e,t=1){let s=0,o=0,i=0;if(e.startsWith("rgb")){const r=e.replace(/\s/g,"").match(/rgb\((.*)\)$/)[1].split(",");s=+r[0],o=+r[1],i=+r[2]}else if(e.startsWith("#")){let r=e.replace("#","");r.length===3&&(r=`${r[0]}${r[0]}${r[1]}${r[1]}${r[2]}${r[2]}`),s=Number.parseInt(r.substring(0,2),16),o=Number.parseInt(r.substring(2,4),16),i=Number.parseInt(r.substring(4,6),16)}else return e;return t>1&&t<=100&&(t=t/100),`rgba(${s},${o},${i},${t})`}function v({node:e}){const t=u.useTheme(),{text:s}=e.attrs,o=c.useMemo(()=>{const a="rgb(254, 242, 237)";return t==="dark"?T(a,.75):a},[t]),i=c.useMemo(()=>{try{return b.renderToString(`${s}`)}catch{return s}},[s]),r=c.useMemo(()=>s.trim()?n.jsx("span",{contentEditable:!1,dangerouslySetInnerHTML:{__html:i}}):n.jsx("span",{contentEditable:!1,children:"Not enter a formula"}),[s,i]);return n.jsx(f.NodeViewWrapper,{style:{display:"inline-block",backgroundColor:o},as:"span",children:r})}function N(e){return t=>t.getAttribute(e)}const x=l.Node.create({name:"katex",group:"inline",inline:!0,defining:!0,draggable:!0,selectable:!0,addOptions(){return{HTMLAttributes:{class:"katex"},button:({editor:e,t})=>({component:$,componentProps:{editor:e,action:()=>!0,isActive:()=>!1,disabled:!1,icon:"KatexIcon",tooltip:t("editor.katex.tooltip")}})}},addAttributes(){return{text:{default:"",parseHTML:N("text")},defaultShowPicker:{default:!1}}},parseHTML(){return[{tag:"span.katex"}]},renderHTML({HTMLAttributes:e}){return["span",l.mergeAttributes(this.options&&this.options.HTMLAttributes||{},e)]},addCommands(){return{setKatex:e=>({commands:t})=>t.insertContent({type:this.name,attrs:e})}},addInputRules(){return[l.nodeInputRule({find:/^\$katex\$$/,type:this.type,getAttributes:()=>({defaultShowPicker:!0})})]},addNodeView(){return f.ReactNodeViewRenderer(v)}});exports.Katex=x;