reactjs-tiptap-editor/lib/TaskList.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 a=require("./index-CSvnpArE.cjs"),k=require("./RichTextEditor-DaQRHXru.cjs"),b=/^\s*(\[([( |x])?\])\s$/,f=a.Node.create({name:"taskItem",addOptions(){return{nested:!1,HTMLAttributes:{},taskListTypeName:"taskList"}},content(){return this.options.nested?"paragraph block*":"paragraph+"},defining:!0,addAttributes(){return{checked:{default:!1,keepOnSplit:!1,parseHTML:t=>{const n=t.getAttribute("data-checked");return n===""||n==="true"},renderHTML:t=>({"data-checked":t.checked})}}},parseHTML(){return[{tag:`li[data-type="${this.name}"]`,priority:51}]},renderHTML({node:t,HTMLAttributes:n}){return["li",a.mergeAttributes(this.options.HTMLAttributes,n,{"data-type":this.name}),["label",["input",{type:"checkbox",checked:t.attrs.checked?"checked":null}],["span"]],["div",0]]},addKeyboardShortcuts(){const t={Enter:()=>this.editor.commands.splitListItem(this.name),"Shift-Tab":()=>this.editor.commands.liftListItem(this.name)};return this.options.nested?{...t,Tab:()=>this.editor.commands.sinkListItem(this.name)}:t},addNodeView(){return({node:t,HTMLAttributes:n,getPos:c,editor:o})=>{const i=document.createElement("li"),d=document.createElement("label"),m=document.createElement("span"),s=document.createElement("input"),p=document.createElement("div");return d.contentEditable="false",s.type="checkbox",s.addEventListener("mousedown",e=>e.preventDefault()),s.addEventListener("change",e=>{if(!o.isEditable&&!this.options.onReadOnlyChecked){s.checked=!s.checked;return}const{checked:r}=e.target;o.isEditable&&typeof c=="function"&&o.chain().focus(void 0,{scrollIntoView:!1}).command(({tr:l})=>{const u=c();if(typeof u!="number")return!1;const h=l.doc.nodeAt(u);return l.setNodeMarkup(u,void 0,{...h==null?void 0:h.attrs,checked:r}),!0}).run(),!o.isEditable&&this.options.onReadOnlyChecked&&(this.options.onReadOnlyChecked(t,r)||(s.checked=!s.checked))}),Object.entries(this.options.HTMLAttributes).forEach(([e,r])=>{i.setAttribute(e,r)}),i.dataset.checked=t.attrs.checked,s.checked=t.attrs.checked,d.append(s,m),i.append(d,p),Object.entries(n).forEach(([e,r])=>{i.setAttribute(e,r)}),{dom:i,contentDOM:p,update:e=>e.type!==this.type?!1:(i.dataset.checked=e.attrs.checked,s.checked=e.attrs.checked,!0)}}},addInputRules(){return[a.wrappingInputRule({find:b,type:this.type,getAttributes:t=>({checked:t[t.length-1]==="x"})})]}}),L=a.Node.create({name:"taskList",addOptions(){return{itemTypeName:"taskItem",HTMLAttributes:{}}},group:"block list",content(){return`${this.options.itemTypeName}+`},parseHTML(){return[{tag:`ul[data-type="${this.name}"]`,priority:51}]},renderHTML({HTMLAttributes:t}){return["ul",a.mergeAttributes(this.options.HTMLAttributes,t,{"data-type":this.name}),0]},addCommands(){return{toggleTaskList:()=>({commands:t})=>t.toggleList(this.name,this.options.itemTypeName)}},addKeyboardShortcuts(){return{"Mod-Shift-9":()=>this.editor.commands.toggleTaskList()}}}),T=L.extend({addOptions(){var t;return{...(t=this.parent)==null?void 0:t.call(this),HTMLAttributes:{class:"task-list"},taskItem:{HTMLAttributes:{class:"task-list-item"}},button:({editor:n,t:c})=>({component:k.ActionButton,componentProps:{action:()=>n.commands.toggleTaskList(),isActive:()=>n.isActive("taskList")||!1,disabled:!1,icon:"ListTodo",shortcutKeys:["shift","mod","9"],tooltip:c("editor.tasklist.tooltip")}})}},addExtensions(){return[f.configure(this.options.taskItem)]}});exports.TaskList=T;