reactjs-tiptap-editor/lib/Attachment.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 b=require("./index-CSvnpArE.cjs"),i=require("./dom-dataset-DmsCLv1q.cjs"),a=require("./RichTextEditor-DaQRHXru.cjs"),e=require("react/jsx-runtime"),p=require("lucide-react"),g=require("react"),V=require("./index-Dz3YxLE7.cjs"),S={audio:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-audio-lines"><path d="M2 10v3"/><path d="M6 6v11"/><path d="M10 3v18"/><path d="M14 8v7"/><path d="M18 5v13"/><path d="M22 10v3"/></svg>',video:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-video"><path d="m16 13 5.223 3.482a.5.5 0 0 0 .777-.416V7.87a.5.5 0 0 0-.752-.432L16 10.5"/><rect x="2" y="6" width="14" height="12" rx="2"/></svg>',file:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-file"><path d="M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z"/><path d="M14 2v4a2 2 0 0 0 2 2h4"/></svg>',image:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-image"><rect width="18" height="18" x="3" y="3" rx="2" ry="2"/><circle cx="9" cy="9" r="2"/><path d="m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21"/></svg>',pdf:`<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32">
      <path fill="currentColor" d="M30 18v-2h-6v10h2v-4h3v-2h-3v-2zm-11 8h-4V16h4a3.003 3.003 0 0 1 3 3v4a3.003 3.003 0 0 1-3 3m-2-2h2a1 1 0 0 0 1-1v-4a1 1 0 0 0-1-1h-2zm-6-8H6v10h2v-3h3a2.003 2.003 0 0 0 2-2v-3a2 2 0 0 0-2-2m-3 5v-3h3l.001 3z"></path>
      <path fill="currentColor" d="M22 14v-4a.91.91 0 0 0-.3-.7l-7-7A.9.9 0 0 0 14 2H4a2.006 2.006 0 0 0-2 2v24a2 2 0 0 0 2 2h16v-2H4V4h8v6a2.006 2.006 0 0 0 2 2h6v2Zm-8-4V4.4l5.6 5.6Z"></path>
    </svg>`,word:`<svg
      xmlns="http://www.w3.org/2000/svg"
      width="1em"
      height="1em"
      className="icon"
      viewBox="0 0 1024 1024"
    >
      <path
        fill="currentColor"
        d="M679.253 402.364 618.77 561.015l-60.348-158.651a30.04 30.04 0 0 0-30.447-18.637 29.76 29.76 0 0 0-30.447 18.637l-60.416 158.651-60.416-158.651a30.515 30.515 0 0 0-38.843-17.272 28.945 28.945 0 0 0-17.954 37.547l88.815 233.267c4.369 11.469 15.7 19.115 28.398 19.115a30.31 30.31 0 0 0 28.468-19.115l62.395-163.908 62.396 163.84c4.437 11.605 15.701 19.183 28.4 19.183a30.31 30.31 0 0 0 28.466-19.115l88.747-233.267a28.945 28.945 0 0 0-17.886-37.547 30.447 30.447 0 0 0-38.912 17.272zm219.478 395.605-51.883-29.218c-28.672-16.18-52.224-3.072-52.224 29.082v.273H643.209a29.833 29.833 0 0 0-30.31 29.354c0 16.18 13.584 29.218 30.31 29.218h151.825c1.092 30.516 24.03 43.077 52.224 27.648l51.063-27.989c29.013-15.906 29.15-42.189.41-58.368"
      />
      <path
        fill="currentColor"
        d="m810.667 913.135-.478.068H201.796c-19.865 0-36.727-11.673-36.727-25.6v-618.36h154.965c51.268 0 92.911-39.39 92.911-87.858v-87.86H810.19c19.797 0 36.522 11.742 36.522 25.669V739.26h61.987V119.262c0-46.421-44.169-84.241-98.51-84.241H328.364l-225.28 194.56v658.09c0 46.285 44.236 84.105 98.713 84.105H810.19c43.759 0 80.554-24.713 93.32-58.573h-92.842zM350.89 94.89v86.562c0 16.11-13.858 29.286-30.925 29.286H216.815L350.959 94.891z"
      />
    </svg>`,excel:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sheet"><rect width="18" height="18" x="3" y="3" rx="2" ry="2"/><line x1="3" x2="21" y1="9" y2="9"/><line x1="3" x2="21" y1="15" y2="15"/><line x1="9" x2="9" y1="9" y2="21"/><line x1="15" x2="15" y1="9" y2="21"/></svg>',ppt:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-table-properties"><path d="M15 3v18"/><rect width="18" height="18" x="3" y="3" rx="2"/><path d="M21 9H3"/><path d="M21 15H3"/></svg>'};function D(t){const n=S[t],l=new DOMParser().parseFromString(n,"image/svg+xml").documentElement,o=["svg",{...Array.from(l.attributes).reduce((r,c)=>(r[c.name]=c.value,r),{})}];return Array.from(l.childNodes).forEach(r=>{if(r.nodeType===1){const c=[r.tagName.toLowerCase(),Array.from(r.attributes).reduce((v,x)=>(v[x.name]=x.value,v),{})];r.textContent&&c.push(r.textContent),o.push(c)}}),o}const B={audio:e.jsx(p.LucideAudioLines,{}),video:e.jsx(p.LucideVideo,{}),file:e.jsx(p.LucideFile,{}),image:e.jsx(p.LucideImage,{}),pdf:e.jsx(a.ExportPdf,{}),word:e.jsx(a.ExportWord,{}),excel:e.jsx(p.LucideSheet,{}),ppt:e.jsx(p.LucideTableProperties,{})};function A(t,n=!1){const s=a.normalizeFileType(t),d=B[s]||e.jsx(e.Fragment,{});return n?D(s):d}const _="_wrap_1x1ms_2",j={wrap:_};function q({editor:t,node:n,updateAttributes:s,deleteNode:d,extension:l}){var M;const o=g.useRef(null),r=a.useEditableEditor(),{hasTrigger:c,fileName:v,fileSize:x,fileExt:L,fileType:C,url:u,error:k}=n.attrs,[H,f]=g.useState(!1),{t:y}=V.useLocale(),N=(M=l==null?void 0:l.options)==null?void 0:M.upload,m=g.useCallback(()=>{!r||u||r&&o.current.click()},[r,u]),z=g.useCallback(async T=>{const h=T.target.files&&T.target.files[0];if(!h)return;const F={fileName:a.extractFilename(h.name),fileSize:h.size,fileType:h.type,fileExt:a.extractFileExtension(h.name)};f(!0);try{const w=await N(h);s({...F,url:w}),f(!1)}catch(w){s({error:`File upload fail: ${w&&w.message}`||"Unknown error"}),f(!1),o.current.value=""}},[f,s]);g.useEffect(()=>{!u&&!c&&(m(),s({hasTrigger:!0}))},[u,c,m,s]);const E=g.useCallback(()=>d(),[t]);return r&&!u?e.jsx(i.NodeViewWrapper,{children:e.jsxs("div",{className:i.clsx(j.wrap,"render-wrapper"),children:[e.jsx("p",{onClick:m,style:{cursor:"pointer"},children:H?e.jsx("span",{children:y("editor.attachment.uploading")}):e.jsx("span",{children:y("editor.attachment.please_upload")})}),e.jsx("input",{hidden:!0,onChange:z,ref:o,type:"file"})]})}):u?e.jsx(i.NodeViewWrapper,{children:e.jsxs("div",{className:i.clsx(j.wrap,"render-wrapper"),onClick:m,children:[e.jsxs("div",{className:"richtext-flex richtext-items-center richtext-gap-[4px]",children:[e.jsx("span",{children:A(C)}),e.jsxs("span",{children:[v,".",L]}),e.jsxs("span",{children:["(",a.normalizeFileSize(x),")"]})]}),e.jsx(a.ActionButton,{action:E,icon:"Trash2",tooltip:y("editor.delete")})]})}):k!=="null"?e.jsx(i.NodeViewWrapper,{children:e.jsx("div",{className:i.clsx(j.wrap,"render-wrapper"),onClick:m,children:e.jsx("p",{children:k})})}):e.jsx(e.Fragment,{})}const R=b.Node.create({name:"attachment",content:"",marks:"",group:"block",selectable:!0,atom:!0,draggable:!0,addOptions(){var t;return{...(t=this.parent)==null?void 0:t.call(this),HTMLAttributes:{class:"attachment"},button:({editor:n,t:s})=>({component:a.ActionButton,componentProps:{action:()=>n.chain().focus().setAttachment().run(),isActive:()=>!1,disabled:!1,icon:"Attachment",tooltip:s("editor.attachment.tooltip")}})}},parseHTML(){return[{tag:"div[class=attachment]"}]},renderHTML({HTMLAttributes:t}){const{url:n="",fileName:s="",fileSize:d="",fileType:l="",fileExt:o=""}=t||{};return["div",b.mergeAttributes(this.options.HTMLAttributes||{},t||{}),n?["a",{href:n||"#"},["span",{class:"attachment__icon"},A(l,!0)],["span",{class:"attachment__text"},`${s}.${o} (${a.normalizeFileSize(d)})`]]:["div",{class:"attachment__placeholder"}]]},addAttributes(){return{fileName:{default:null,parseHTML:i.getDatasetAttribute("filename")},fileSize:{default:null,parseHTML:i.getDatasetAttribute("filesize")},fileType:{default:null,parseHTML:i.getDatasetAttribute("filetype")},fileExt:{default:null,parseHTML:i.getDatasetAttribute("fileext")},url:{default:null,parseHTML:i.getDatasetAttribute("url")},hasTrigger:{default:!1,parseHTML:t=>i.getDatasetAttribute("hastrigger")(t)==="true"},error:{default:null,parseHTML:i.getDatasetAttribute("error")}}},addCommands(){return{setAttachment:(t={})=>({chain:n})=>n().insertContent({type:this.name,attrs:t}).run()}},addNodeView(){return i.ReactNodeViewRenderer(q)}});exports.Attachment=R;