reactjs-tiptap-editor/lib/Column.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 u=require("./clsx-CXbNJWDD.cjs"),x=require("@tiptap/pm/state"),A=require("@tiptap/pm/model"),f=require("react/jsx-runtime"),h=require("./index-BnVcq33n.cjs");require("react");require("./theme.cjs");function v(e,t,r=null){return r?e.createChecked({index:t},r):e.createAndFill({index:t})}function M(e){if(e.cached.columnsNodeTypes)return e.cached.columnsNodeTypes;const t={columns:e.nodes.columns,column:e.nodes.column};return e.cached.columnsNodeTypes=t,t}function H(e,t,r=null){const n=M(e),c=[];for(let o=0;o<t;o+=1){const s=v(n.column,o,r);s&&c.push(s)}return n.columns.createChecked({cols:t},c)}function C({state:e,dispatch:t,type:r}){const n=u.findParentNode(o=>o.type.name===b.name)(e.selection),c=u.findParentNode(o=>o.type.name===T.name)(e.selection);if(t&&n&&c){const o=n.node,s=c.node.attrs.index,i=o.toJSON();let l=s;r==="delete"?(l=s-1,i.content.splice(s,1)):(l=r==="addBefore"?s:s+1,i.content.splice(l,0,{type:"column",attrs:{index:s},content:[{type:"paragraph"}]})),i.attrs.cols=i.content.length,i.content.forEach((m,y)=>{m.attrs.index=y});const d=A.Node.fromJSON(e.schema,i);let a=n.pos;d.content.forEach((m,y,N)=>{N<l&&(a+=m.nodeSize)});const p=e.tr.setTime(Date.now());p.replaceWith(n.pos,n.pos+n.node.nodeSize,d).setSelection(x.TextSelection.near(p.doc.resolve(a))),t(p)}return!0}function S({state:e,dispatch:t,type:r}){const n=u.findParentNode(o=>o.type.name===b.name)(e.selection),c=u.findParentNode(o=>o.type.name===T.name)(e.selection);if(t&&n&&c){const o=n.node,s=c.node.attrs.index;let i=0;r==="before"?i=(s-1+o.attrs.cols)%o.attrs.cols:i=(s+1)%o.attrs.cols;let l=n.pos;o.content.forEach((a,p,m)=>{m<i&&(l+=a.nodeSize)});const d=e.tr.setTime(Date.now());return d.setSelection(x.TextSelection.near(d.doc.resolve(l))),t(d),!0}return!1}function O(){const e=h.useButtonProps(g.name),{icon:t=void 0,tooltip:r=void 0,shortcutKeys:n=void 0,tooltipOptions:c={},action:o=void 0,isActive:s=void 0}=(e==null?void 0:e.componentProps)??{},{dataState:i,disabled:l,update:d}=h.useToggleActive(s),a=()=>{l||o&&(o(),d())};return e?f.jsx(h.ActionButton,{action:a,dataState:i,disabled:l,icon:t,shortcutKeys:n,tooltip:r,tooltipOptions:c}):f.jsx(f.Fragment,{})}const I=200,g=u.Extension.create({name:"richtextColumnExtension",addOptions(){var e;return{...(e=this.parent)==null?void 0:e.call(this),button:({editor:t,t:r})=>({componentProps:{action:()=>{t.chain().focus().insertColumns({cols:2}).run()},icon:"Columns",tooltip:r("editor.columns.tooltip")}})}}}),T=u.Node3.create({name:"column",content:"block+",isolating:!0,addOptions(){return{HTMLAttributes:{class:"column"}}},addAttributes(){return{index:{default:0,parseHTML:e=>e.getAttribute("index")}}},parseHTML(){return[{tag:"div[class=column]"}]},renderHTML({HTMLAttributes:e}){return["div",u.mergeAttributes(this.options.HTMLAttributes,e),0]}}),b=u.Node3.create({name:"columns",group:"block",defining:!0,isolating:!0,allowGapCursor:!1,content:"column{1,}",priority:I,addOptions(){return{HTMLAttributes:{class:"columns"}}},addAttributes(){return{cols:{default:2,parseHTML:e=>e.getAttribute("cols")}}},parseHTML(){return[{tag:"div[class=grid]"}]},renderHTML({HTMLAttributes:e}){return["div",u.mergeAttributes(this.options.HTMLAttributes,e),0]},addCommands(){return{insertColumns:e=>({tr:t,dispatch:r,editor:n})=>{const c=H(n.schema,e&&e.cols||3);if(r){const o=t.selection.anchor+1;t.replaceSelectionWith(c).scrollIntoView().setSelection(x.TextSelection.near(t.doc.resolve(o)))}return!0},addColBefore:()=>({dispatch:e,state:t})=>C({dispatch:e,state:t,type:"addBefore"}),addColAfter:()=>({dispatch:e,state:t})=>C({dispatch:e,state:t,type:"addAfter"}),deleteCol:()=>({dispatch:e,state:t})=>C({dispatch:e,state:t,type:"delete"})}},addKeyboardShortcuts(){return{"Mod-Alt-G":()=>this.editor.commands.insertColumns(),Tab:()=>S({state:this.editor.state,dispatch:this.editor.view.dispatch,type:"after"}),"Shift-Tab":()=>S({state:this.editor.state,dispatch:this.editor.view.dispatch,type:"before"})}}});exports.Column=g;exports.ColumnNode=T;exports.MultipleColumnNode=b;exports.RichTextColumn=O;