@qxs-bns/components-wc 0.0.3 → 0.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,4 +1,4 @@
1
- import{Editor as e}from"@tiptap/core";import t from"@tiptap/extension-blockquote";import i from"@tiptap/extension-bold";import o from"@tiptap/extension-bullet-list";import r from"@tiptap/extension-code";import l from"@tiptap/extension-document";import s from"@tiptap/extension-heading";import n from"@tiptap/extension-history";import a from"@tiptap/extension-horizontal-rule";import d from"@tiptap/extension-image";import c from"@tiptap/extension-italic";import b from"@tiptap/extension-link";import p from"@tiptap/extension-list-item";import h from"@tiptap/extension-ordered-list";import g from"@tiptap/extension-paragraph";import u from"@tiptap/extension-strike";import{Table as x}from"@tiptap/extension-table";import{TableCell as m}from"@tiptap/extension-table-cell";import{TableHeader as v}from"@tiptap/extension-table-header";import{TableRow as f}from"@tiptap/extension-table-row";import _ from"@tiptap/extension-text";import y from"@tiptap/extension-text-align";import w from"@tiptap/extension-underline";import k from"../node_modules/.pnpm/@tiptap_extension-placeholder@3.20.5_@tiptap_extensions@3.20.5_@tiptap_core@3.20.5_@tiptap_pm@3.20.5__@tiptap_pm@3.20.5_/node_modules/@tiptap/extension-placeholder/dist/index.mjs";import{css as C,LitElement as T,html as M}from"lit";import{property as $}from"../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/decorators/property.mjs";import{state as A}from"../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/decorators/state.mjs";import{safeCustomElement as R}from"../base/define.mjs";var B=Object.defineProperty,P=Object.getOwnPropertyDescriptor,S=(e,t,i,o)=>{for(var r,l=o>1?void 0:o?P(t,i):t,s=e.length-1;s>=0;s--)(r=e[s])&&(l=(o?r(t,i,l):r(l))||l);return o&&l&&B(t,i,l),l};let I=class extends T{constructor(){super(...arguments),this.content="",this.readonly=!1,this.preview=!1,this.uploadImage=async e=>new Promise((t,i)=>{const o=new FileReader;o.onload=e=>t(e.target?.result),o.onerror=i,o.readAsDataURL(e)}),this._editor=null,this._pendingContent=null,this._tableRows=3,this._tableCols=3,this._hoverRow=0,this._hoverCol=0,this._tableDropdownOpen=!1,this._isLoading=!0,this._tableCellToolbar={x:0,y:0,visible:!1,cellRow:0,cellCol:0},this._tableEdgeHover={type:null,index:0,position:{x:0,y:0}},this._imageToolbar={x:0,y:0,visible:!1},this._imageMoreMenuVisible=!1,this._hasSlashCommand=!1,this._tableEdgeDetectionSetup=!1}_initEditor(){if(this._editor)return;const C=this.shadowRoot?.querySelector(".editor-content");if(!C)return void requestAnimationFrame(()=>this._initEditor());this._isLoading=!1;const T=[l,g,_,i,c,w,u,r,s.configure({levels:[1,2,3]}),o,h,p,t,a,n,d.configure({inline:!1,allowBase64:!0}),b.configure({openOnClick:!1,HTMLAttributes:{rel:"noopener noreferrer"}}),y.configure({types:["heading","paragraph"]}),x.configure({resizable:!0}),f,m,v,k.configure({placeholder:"输入 / 唤出快捷命令"})];this._editor=new e({element:C,extensions:T,content:(this._pendingContent??this.content)||"<p></p>",editable:!this.readonly}),this._pendingContent=null,this._editor.on("selectionUpdate",()=>{this.requestUpdate(),this._updateBubbleMenuPosition(),this._editor?.isActive("table")?this._showTableCellToolbar():this._hideTableCellToolbar();const e=this._editor;if(e){const{selection:t}=e.state,{$from:i}=t;if("image"===i.node(i.depth).type.name){const t=e.view.coordsAtPos(i.start()),o=this.shadowRoot?.querySelector(".editor-wrapper")?.getBoundingClientRect();if(o){const e=t.left-o.left+(t.right-t.left)/2,i=t.top-o.top-40;this._showImageToolbar({x:e,y:i})}}else this._hideImageToolbar()}}),this._editor.on("transaction",()=>{this.requestUpdate(),this._editor?.isActive("table")?this._showTableCellToolbar():this._hideTableCellToolbar(),this._checkSlashCommand(),this._setupTableEdgeDetection()})}_setupTableEdgeDetection(){const e=this.shadowRoot?.querySelector(".editor-content");e&&!this._tableEdgeDetectionSetup&&(this._tableEdgeDetectionSetup=!0,e.addEventListener("mousemove",e=>{this._handleTableEdgeMouseMove(e)}),e.addEventListener("mouseleave",()=>{this._tableEdgeHover={type:null,index:0,position:{x:0,y:0}}}),e.addEventListener("click",e=>{const t=e.target;if("IMG"===t.tagName){const e=this._editor?.view.posAtDOM(t,0);void 0!==e&&this._editor?.chain().focus().setNodeSelection(e).run()}}))}_handleTableEdgeMouseMove(e){if(!this._editor?.isActive("table"))return this._tableEdgeHover={type:null,index:0,position:{x:0,y:0}},void this.requestUpdate();const t=e.target.closest("table");if(!t)return this._tableEdgeHover={type:null,index:0,position:{x:0,y:0}},void this.requestUpdate();const i=t.getBoundingClientRect(),o=this.shadowRoot?.querySelector(".editor-wrapper");if(!o)return;const r=o.getBoundingClientRect(),l=e.clientX-r.left,s=e.clientY-r.top,n=10,a=i.height/t.rows.length;for(let o=0;o<t.rows.length;o++){const t=i.top+o*a,s=t+a;if(e.clientY>=t-n&&e.clientY<=t+n)return this._tableEdgeHover={type:"row",index:o,position:{x:l,y:t-r.top}},void this.requestUpdate();if(e.clientY>=s-n&&e.clientY<=s+n)return this._tableEdgeHover={type:"row",index:o+1,position:{x:l,y:s-r.top}},void this.requestUpdate()}const d=i.width/t.rows[0]?.cells.length||1;for(let o=0;o<(t.rows[0]?.cells.length||0);o++){const t=i.left+o*d,l=t+d;if(e.clientX>=t-n&&e.clientX<=t+n)return this._tableEdgeHover={type:"col",index:o,position:{x:t-r.left,y:s}},void this.requestUpdate();if(e.clientX>=l-n&&e.clientX<=l+n)return this._tableEdgeHover={type:"col",index:o+1,position:{x:l-r.left,y:s}},void this.requestUpdate()}this._tableEdgeHover={type:null,index:0,position:{x:0,y:0}},this.requestUpdate()}_checkSlashCommand(){if(!this._editor)return;const{selection:e}=this._editor.state,t=this._editor.state.doc.textBetween(Math.max(0,e.from-10),e.from," ");this._hasSlashCommand=t.endsWith("/")}firstUpdated(){this._initEditor()}updated(e){if(this._editor)return e.has("content")&&this._editor.commands.setContent(this.content||"<p></p>"),void(e.has("readonly")&&this._editor.setEditable(!this.readonly));e.has("content")&&(this._pendingContent=this.content);const t=this.shadowRoot?.querySelector(".editor-content");t&&!this._editor&&this._initEditor()}disconnectedCallback(){super.disconnectedCallback(),this._editor?.destroy(),this._editor=null}getContent(){return this._editor?.getHTML()??""}_applyFormat(e){if(this._hasSlashCommand&&this._editor){const{selection:e}=this._editor.state;this._editor.chain().focus().deleteRange({from:e.from-1,to:e.from}).run(),this._hasSlashCommand=!1}e()}_toggleBold(){this._applyFormat(()=>this._editor?.chain().focus().toggleBold().run())}_toggleItalic(){this._applyFormat(()=>this._editor?.chain().focus().toggleItalic().run())}_toggleUnderline(){this._applyFormat(()=>this._editor?.chain().focus().toggleUnderline().run())}_toggleStrike(){this._applyFormat(()=>this._editor?.chain().focus().toggleStrike().run())}_toggleCode(){this._applyFormat(()=>this._editor?.chain().focus().toggleCode().run())}_setHeading(e){this._applyFormat(()=>this._editor?.chain().focus().toggleHeading({level:e}).run())}_setParagraph(){this._applyFormat(()=>this._editor?.chain().focus().setParagraph().run())}_toggleBulletList(){this._applyFormat(()=>this._editor?.chain().focus().toggleBulletList().run())}_toggleOrderedList(){this._applyFormat(()=>this._editor?.chain().focus().toggleOrderedList().run())}_toggleBlockquote(){this._applyFormat(()=>this._editor?.chain().focus().toggleBlockquote().run())}_setTextAlign(e){this._applyFormat(()=>this._editor?.chain().focus().setTextAlign(e).run())}_setLink(){const e=window.prompt("请输入链接地址:");e&&this._applyFormat(()=>this._editor?.chain().focus().setLink({href:e}).run())}_unsetLink(){this._applyFormat(()=>this._editor?.chain().focus().unsetLink().run())}_insertTable(e,t){this._editor?.chain().focus().insertTable({rows:e??this._tableRows,cols:t??this._tableCols,withHeaderRow:!0}).run()}async _handleImageUpload(e){const t=e.target,i=t.files?.[0];if(i)try{const e=await this.uploadImage(i);this._editor?.chain().focus().setImage({src:e}).run()}catch(e){}t.value=""}_triggerImageUpload(){const e=this.shadowRoot?.querySelector(".image-input");e?.click()}_insertTableByClick(e,t){if(this._hasSlashCommand&&this._editor){const{selection:e}=this._editor.state;this._editor.chain().focus().deleteRange({from:e.from-1,to:e.from}).run(),this._hasSlashCommand=!1}this._tableRows=e,this._tableCols=t,this._insertTable(e,t)}_insertHorizontalRule(){this._editor?.chain().focus().setHorizontalRule().run()}_showTableCellToolbar(){if(!this._editor?.isActive("table"))return;const{state:e}=this._editor,{selection:t}=e,i=this._editor.view.coordsAtPos(t.from),o=this.shadowRoot?.querySelector(".editor-wrapper");if(!o)return;const r=o.getBoundingClientRect(),l=this._getTableCellRow(),s=this._getTableCellCol();(0===l||0===s)&&(this._tableCellToolbar={x:i.left-r.left,y:i.bottom-r.top+8,visible:!0,cellRow:l,cellCol:s})}_getTableCellRow(){if(!this._editor)return 0;const{selection:e}=this._editor.state,t=this._editor.state.doc.resolve(e.from);for(let e=t.depth;e>0;e--){if("tableCell"===t.node(e).type.name)return t.index(e-1)}return 0}_getTableCellCol(){if(!this._editor)return 0;const{selection:e}=this._editor.state,t=this._editor.state.doc.resolve(e.from);for(let e=t.depth;e>0;e--){if("tableCell"===t.node(e).type.name)return t.index(e)}return 0}_hideTableCellToolbar(){this._tableCellToolbar={...this._tableCellToolbar,visible:!1}}_addTableRowAbove(){this._editor?.chain().focus().addRowBefore().run(),this._hideTableCellToolbar()}_addTableRowBelow(){this._editor?.chain().focus().addRowAfter().run(),this._hideTableCellToolbar()}_addTableColumnLeft(){this._editor?.chain().focus().addColumnBefore().run(),this._hideTableCellToolbar()}_addTableColumnRight(){this._editor?.chain().focus().addColumnAfter().run(),this._hideTableCellToolbar()}_deleteTableRow(){this._editor?.chain().focus().deleteRow().run(),this._hideTableCellToolbar()}_deleteTableColumn(){this._editor?.chain().focus().deleteColumn().run(),this._hideTableCellToolbar()}_deleteTable(){this._editor?.chain().focus().deleteTable().run(),this._hideTableCellToolbar()}_showImageToolbar(e){this._imageToolbar={x:e.x,y:e.y,visible:!0},this._imageMoreMenuVisible=!1}_hideImageToolbar(){this._imageToolbar={...this._imageToolbar,visible:!1},this._imageMoreMenuVisible=!1}_toggleImageMoreMenu(){this._imageMoreMenuVisible=!this._imageMoreMenuVisible}_deleteImage(){this._editor?.chain().focus().deleteNode("image").run(),this._hideImageToolbar()}_insertImageAfter(){this._triggerImageUpload(),this._imageMoreMenuVisible=!1}_setImageAlignLeft(){const e=this._editor;if(e){const{selection:t}=e.state,i=t.from;e.chain().focus().setNodeSelection(i).run();const o=this.shadowRoot?.querySelector(".ProseMirror img.ProseMirror-selectednode");o&&(o.style.display="block",o.style.margin="0 auto 0 0")}this._imageMoreMenuVisible=!1}_setImageAlignCenter(){const e=this._editor;if(e){const{selection:t}=e.state,i=t.from;e.chain().focus().setNodeSelection(i).run();const o=this.shadowRoot?.querySelector(".ProseMirror img.ProseMirror-selectednode");o&&(o.style.display="block",o.style.margin="0 auto")}this._imageMoreMenuVisible=!1}_setImageAlignRight(){const e=this._editor;if(e){const{selection:t}=e.state,i=t.from;e.chain().focus().setNodeSelection(i).run();const o=this.shadowRoot?.querySelector(".ProseMirror img.ProseMirror-selectednode");o&&(o.style.display="block",o.style.margin="0 0 0 auto")}this._imageMoreMenuVisible=!1}_updateImageToolbarPosition(){requestAnimationFrame(()=>{const e=this._editor;if(!e)return;const{selection:t}=e.state,{$from:i}=t;if("image"===i.node(i.depth).type.name?i.node(i.depth):null){const t=e.view.coordsAtPos(i.start()),o=this.shadowRoot?.querySelector(".editor-wrapper")?.getBoundingClientRect();if(o){const e=t.left-o.left+(t.right-t.left)/2,i=t.top-o.top-40;this._showImageToolbar({x:e,y:i})}}else this._hideImageToolbar()})}_getTextLabel(){const e=this._editor;return e?e.isActive("heading",{level:1})?"标题 1":e.isActive("heading",{level:2})?"标题 2":e.isActive("heading",{level:3})?"标题 3":"正文":"正文"}_getAlignLabel(){const e=this._editor;return e?e.isActive({textAlign:"center"})?"居中":e.isActive({textAlign:"right"})?"右对齐":"左对齐":"对齐"}_updateBubbleMenuPosition(){requestAnimationFrame(()=>{const e=this.shadowRoot?.querySelector(".bubble-menu"),t=this.shadowRoot?.querySelector(".ProseMirror"),i=this.shadowRoot?.querySelector(".editor-wrapper");if(!e||!t||!i)return;const o=this._editor,r=o?.isActive("table")??!1,{selection:l}=o?.state??{selection:null};if(r&&l&&!l.empty&&o){const{from:t,to:i}=l,r=o.state.doc.resolve(t),s=o.state.doc.resolve(i);let n=!1;for(let e=r.depth;e>=0;e--)if("table"===r.node(e).type.name){n=!0;break}const a=r.node(r.depth),d=s.node(s.depth);if("table"!==a.type.name&&"table"!==d.type.name||(n=!0),n)return e.style.opacity="0",void(e.style.visibility="hidden")}if(l&&!l.empty);else if(!l||l.empty&&!this._hasSlashCommand)return e.style.opacity="0",void(e.style.visibility="hidden");const s=i.getBoundingClientRect(),n=e.getBoundingClientRect(),{from:a}=l,d=this._editor?.view.coordsAtPos(a);if(!d)return;let c=d.left-s.left,b=d.top-s.top-40;c+n.width>s.width&&(c=s.width-n.width-8),c<0&&(c=8),b<0&&(b=d.bottom-s.top+8),e.style.left=`${c}px`,e.style.top=`${b}px`,e.style.opacity="1",e.style.visibility="visible"})}render(){const e=this._editor;return M`
1
+ import{Editor as e}from"@tiptap/core";import t from"@tiptap/extension-blockquote";import i from"@tiptap/extension-bold";import o from"@tiptap/extension-bullet-list";import r from"@tiptap/extension-code";import l from"@tiptap/extension-document";import s from"@tiptap/extension-heading";import n from"@tiptap/extension-history";import a from"@tiptap/extension-horizontal-rule";import d from"@tiptap/extension-image";import c from"@tiptap/extension-italic";import p from"@tiptap/extension-link";import b from"@tiptap/extension-list-item";import h from"@tiptap/extension-ordered-list";import g from"@tiptap/extension-paragraph";import u from"@tiptap/extension-strike";import{Table as x}from"@tiptap/extension-table";import{TableCell as m}from"@tiptap/extension-table-cell";import{TableHeader as v}from"@tiptap/extension-table-header";import{TableRow as f}from"@tiptap/extension-table-row";import y from"@tiptap/extension-text";import _ from"@tiptap/extension-text-align";import w from"@tiptap/extension-underline";import k from"../node_modules/.pnpm/@tiptap_extension-placeholder@3.20.5_@tiptap_extensions@3.20.5_@tiptap_core@3.20.5_@tiptap_pm@3.20.5__@tiptap_pm@3.20.5_/node_modules/@tiptap/extension-placeholder/dist/index.mjs";import{css as C,LitElement as T,html as M}from"lit";import{property as $}from"../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/decorators/property.mjs";import{state as A}from"../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/decorators/state.mjs";import{safeCustomElement as B}from"../base/define.mjs";var R=Object.defineProperty,P=Object.getOwnPropertyDescriptor,q=(e,t,i,o)=>{for(var r,l=o>1?void 0:o?P(t,i):t,s=e.length-1;s>=0;s--)(r=e[s])&&(l=(o?r(t,i,l):r(l))||l);return o&&l&&R(t,i,l),l};let E=class extends T{constructor(){super(...arguments),this.content="",this.readonly=!1,this.preview=!1,this.isEdit=!1,this.uploadImage=async e=>new Promise((t,i)=>{const o=new FileReader;o.onload=e=>t(e.target?.result),o.onerror=i,o.readAsDataURL(e)}),this._editor=null,this._pendingContent=null,this._tableRows=3,this._tableCols=3,this._hoverRow=0,this._hoverCol=0,this._tableDropdownOpen=!1,this._isLoading=!0,this._tableCellToolbar={x:0,y:0,visible:!1,cellRow:0,cellCol:0},this._tableEdgeHover={type:null,index:0,position:{x:0,y:0}},this._imageToolbar={x:0,y:0,visible:!1},this._imageMoreMenuVisible=!1,this._hasSlashCommand=!1,this._tableEdgeDetectionSetup=!1}_initEditor(){if(this._editor)return;const C=this.shadowRoot?.querySelector(".editor-content");if(!C)return void requestAnimationFrame(()=>this._initEditor());this._isLoading=!1;const T=[l,g,y,i,c,w,u,r,s.configure({levels:[1,2,3]}),o,h,b,t,a,n,d.configure({inline:!1,allowBase64:!0}),p.configure({openOnClick:!1,HTMLAttributes:{rel:"noopener noreferrer"}}),_.configure({types:["heading","paragraph"]}),x.configure({resizable:!0}),f,m,v,k.configure({placeholder:"输入 / 唤出快捷命令"})];this._editor=new e({element:C,extensions:T,content:(this._pendingContent??this.content)||"<p></p>",editable:!this.readonly}),this._pendingContent=null,this._editor.on("selectionUpdate",()=>{this.requestUpdate(),this._updateBubbleMenuPosition(),this._editor?.isActive("table")?this._showTableCellToolbar():this._hideTableCellToolbar();const e=this._editor;if(e){const{selection:t}=e.state,{$from:i}=t;if("image"===i.node(i.depth).type.name){const t=e.view.coordsAtPos(i.start()),o=this.shadowRoot?.querySelector(".editor-wrapper")?.getBoundingClientRect();if(o){const e=t.left-o.left+(t.right-t.left)/2,i=t.top-o.top-40;this._showImageToolbar({x:e,y:i})}}else this._hideImageToolbar()}}),this._editor.on("transaction",()=>{this.requestUpdate(),this._editor?.isActive("table")?this._showTableCellToolbar():this._hideTableCellToolbar(),this._checkSlashCommand(),this._setupTableEdgeDetection()})}_setupTableEdgeDetection(){const e=this.shadowRoot?.querySelector(".editor-content");e&&!this._tableEdgeDetectionSetup&&(this._tableEdgeDetectionSetup=!0,e.addEventListener("mousemove",e=>{this._handleTableEdgeMouseMove(e)}),e.addEventListener("mouseleave",()=>{this._tableEdgeHover={type:null,index:0,position:{x:0,y:0}}}),e.addEventListener("click",e=>{const t=e.target;if("IMG"===t.tagName){const e=this._editor?.view.posAtDOM(t,0);void 0!==e&&this._editor?.chain().focus().setNodeSelection(e).run()}}))}_handleTableEdgeMouseMove(e){if(!this._editor?.isActive("table"))return this._tableEdgeHover={type:null,index:0,position:{x:0,y:0}},void this.requestUpdate();const t=e.target.closest("table");if(!t)return this._tableEdgeHover={type:null,index:0,position:{x:0,y:0}},void this.requestUpdate();const i=t.getBoundingClientRect(),o=this.shadowRoot?.querySelector(".editor-wrapper");if(!o)return;const r=o.getBoundingClientRect(),l=e.clientX-r.left,s=e.clientY-r.top,n=10,a=i.height/t.rows.length;for(let o=0;o<t.rows.length;o++){const t=i.top+o*a,s=t+a;if(e.clientY>=t-n&&e.clientY<=t+n)return this._tableEdgeHover={type:"row",index:o,position:{x:l,y:t-r.top}},void this.requestUpdate();if(e.clientY>=s-n&&e.clientY<=s+n)return this._tableEdgeHover={type:"row",index:o+1,position:{x:l,y:s-r.top}},void this.requestUpdate()}const d=i.width/t.rows[0]?.cells.length||1;for(let o=0;o<(t.rows[0]?.cells.length||0);o++){const t=i.left+o*d,l=t+d;if(e.clientX>=t-n&&e.clientX<=t+n)return this._tableEdgeHover={type:"col",index:o,position:{x:t-r.left,y:s}},void this.requestUpdate();if(e.clientX>=l-n&&e.clientX<=l+n)return this._tableEdgeHover={type:"col",index:o+1,position:{x:l-r.left,y:s}},void this.requestUpdate()}this._tableEdgeHover={type:null,index:0,position:{x:0,y:0}},this.requestUpdate()}_checkSlashCommand(){if(!this._editor)return;const{selection:e}=this._editor.state,t=this._editor.state.doc.textBetween(Math.max(0,e.from-10),e.from," ");this._hasSlashCommand=t.endsWith("/")}firstUpdated(){this._initEditor()}updated(e){if(this._editor)return e.has("content")&&this._editor.commands.setContent(this.content||"<p></p>"),void(e.has("readonly")&&this._editor.setEditable(!this.readonly));e.has("content")&&(this._pendingContent=this.content);const t=this.shadowRoot?.querySelector(".editor-content");t&&!this._editor&&this._initEditor()}disconnectedCallback(){super.disconnectedCallback(),this._editor?.destroy(),this._editor=null}getContent(){return this._editor?.getHTML()??""}_applyFormat(e){if(this._hasSlashCommand&&this._editor){const{selection:e}=this._editor.state;this._editor.chain().focus().deleteRange({from:e.from-1,to:e.from}).run(),this._hasSlashCommand=!1}e()}_toggleBold(){this._applyFormat(()=>this._editor?.chain().focus().toggleBold().run())}_toggleItalic(){this._applyFormat(()=>this._editor?.chain().focus().toggleItalic().run())}_toggleUnderline(){this._applyFormat(()=>this._editor?.chain().focus().toggleUnderline().run())}_toggleStrike(){this._applyFormat(()=>this._editor?.chain().focus().toggleStrike().run())}_toggleCode(){this._applyFormat(()=>this._editor?.chain().focus().toggleCode().run())}_setHeading(e){this._applyFormat(()=>this._editor?.chain().focus().toggleHeading({level:e}).run())}_setParagraph(){this._applyFormat(()=>this._editor?.chain().focus().setParagraph().run())}_toggleBulletList(){this._applyFormat(()=>this._editor?.chain().focus().toggleBulletList().run())}_toggleOrderedList(){this._applyFormat(()=>this._editor?.chain().focus().toggleOrderedList().run())}_toggleBlockquote(){this._applyFormat(()=>this._editor?.chain().focus().toggleBlockquote().run())}_setTextAlign(e){this._applyFormat(()=>this._editor?.chain().focus().setTextAlign(e).run())}_setLink(){const e=window.prompt("请输入链接地址:");e&&this._applyFormat(()=>this._editor?.chain().focus().setLink({href:e}).run())}_unsetLink(){this._applyFormat(()=>this._editor?.chain().focus().unsetLink().run())}_insertTable(e,t){this._editor?.chain().focus().insertTable({rows:e??this._tableRows,cols:t??this._tableCols,withHeaderRow:!0}).run()}async _handleImageUpload(e){const t=e.target,i=t.files?.[0];if(i)try{const e=await this.uploadImage(i);this._editor?.chain().focus().setImage({src:e}).run()}catch(e){}t.value=""}_triggerImageUpload(){const e=this.shadowRoot?.querySelector(".image-input");e?.click()}_insertTableByClick(e,t){if(this._hasSlashCommand&&this._editor){const{selection:e}=this._editor.state;this._editor.chain().focus().deleteRange({from:e.from-1,to:e.from}).run(),this._hasSlashCommand=!1}this._tableRows=e,this._tableCols=t,this._insertTable(e,t)}_insertHorizontalRule(){this._editor?.chain().focus().setHorizontalRule().run()}_showTableCellToolbar(){if(!this._editor?.isActive("table"))return;const{state:e}=this._editor,{selection:t}=e,i=this._editor.view.coordsAtPos(t.from),o=this.shadowRoot?.querySelector(".editor-wrapper");if(!o)return;const r=o.getBoundingClientRect(),l=this._getTableCellRow(),s=this._getTableCellCol();(0===l||0===s)&&(this._tableCellToolbar={x:i.left-r.left,y:i.bottom-r.top+8,visible:!0,cellRow:l,cellCol:s})}_getTableCellRow(){if(!this._editor)return 0;const{selection:e}=this._editor.state,t=this._editor.state.doc.resolve(e.from);for(let e=t.depth;e>0;e--){if("tableCell"===t.node(e).type.name)return t.index(e-1)}return 0}_getTableCellCol(){if(!this._editor)return 0;const{selection:e}=this._editor.state,t=this._editor.state.doc.resolve(e.from);for(let e=t.depth;e>0;e--){if("tableCell"===t.node(e).type.name)return t.index(e)}return 0}_hideTableCellToolbar(){this._tableCellToolbar={...this._tableCellToolbar,visible:!1}}_addTableRowAbove(){this._editor?.chain().focus().addRowBefore().run(),this._hideTableCellToolbar()}_addTableRowBelow(){this._editor?.chain().focus().addRowAfter().run(),this._hideTableCellToolbar()}_addTableColumnLeft(){this._editor?.chain().focus().addColumnBefore().run(),this._hideTableCellToolbar()}_addTableColumnRight(){this._editor?.chain().focus().addColumnAfter().run(),this._hideTableCellToolbar()}_deleteTableRow(){this._editor?.chain().focus().deleteRow().run(),this._hideTableCellToolbar()}_deleteTableColumn(){this._editor?.chain().focus().deleteColumn().run(),this._hideTableCellToolbar()}_deleteTable(){this._editor?.chain().focus().deleteTable().run(),this._hideTableCellToolbar()}_showImageToolbar(e){this._imageToolbar={x:e.x,y:e.y,visible:!0},this._imageMoreMenuVisible=!1}_hideImageToolbar(){this._imageToolbar={...this._imageToolbar,visible:!1},this._imageMoreMenuVisible=!1}_toggleImageMoreMenu(){this._imageMoreMenuVisible=!this._imageMoreMenuVisible}_deleteImage(){this._editor?.chain().focus().deleteNode("image").run(),this._hideImageToolbar()}_insertImageAfter(){this._triggerImageUpload(),this._imageMoreMenuVisible=!1}_setImageAlignLeft(){const e=this._editor;if(e){const{selection:t}=e.state,i=t.from;e.chain().focus().setNodeSelection(i).run();const o=this.shadowRoot?.querySelector(".ProseMirror img.ProseMirror-selectednode");o&&(o.style.display="block",o.style.margin="0 auto 0 0")}this._imageMoreMenuVisible=!1}_setImageAlignCenter(){const e=this._editor;if(e){const{selection:t}=e.state,i=t.from;e.chain().focus().setNodeSelection(i).run();const o=this.shadowRoot?.querySelector(".ProseMirror img.ProseMirror-selectednode");o&&(o.style.display="block",o.style.margin="0 auto")}this._imageMoreMenuVisible=!1}_setImageAlignRight(){const e=this._editor;if(e){const{selection:t}=e.state,i=t.from;e.chain().focus().setNodeSelection(i).run();const o=this.shadowRoot?.querySelector(".ProseMirror img.ProseMirror-selectednode");o&&(o.style.display="block",o.style.margin="0 0 0 auto")}this._imageMoreMenuVisible=!1}_updateImageToolbarPosition(){requestAnimationFrame(()=>{const e=this._editor;if(!e)return;const{selection:t}=e.state,{$from:i}=t;if("image"===i.node(i.depth).type.name?i.node(i.depth):null){const t=e.view.coordsAtPos(i.start()),o=this.shadowRoot?.querySelector(".editor-wrapper")?.getBoundingClientRect();if(o){const e=t.left-o.left+(t.right-t.left)/2,i=t.top-o.top-40;this._showImageToolbar({x:e,y:i})}}else this._hideImageToolbar()})}_getTextLabel(){const e=this._editor;return e?e.isActive("heading",{level:1})?"标题 1":e.isActive("heading",{level:2})?"标题 2":e.isActive("heading",{level:3})?"标题 3":"正文":"正文"}_getAlignLabel(){const e=this._editor;return e?e.isActive({textAlign:"center"})?"居中":e.isActive({textAlign:"right"})?"右对齐":"左对齐":"对齐"}_updateBubbleMenuPosition(){requestAnimationFrame(()=>{const e=this.shadowRoot?.querySelector(".bubble-menu"),t=this.shadowRoot?.querySelector(".ProseMirror"),i=this.shadowRoot?.querySelector(".editor-wrapper");if(!e||!t||!i)return;const o=this._editor,r=o?.isActive("table")??!1,{selection:l}=o?.state??{selection:null};if(r&&l&&!l.empty&&o){const{from:t,to:i}=l,r=o.state.doc.resolve(t),s=o.state.doc.resolve(i);let n=!1;for(let e=r.depth;e>=0;e--)if("table"===r.node(e).type.name){n=!0;break}const a=r.node(r.depth),d=s.node(s.depth);if("table"!==a.type.name&&"table"!==d.type.name||(n=!0),n)return e.style.opacity="0",void(e.style.visibility="hidden")}if(l&&!l.empty);else if(!l||l.empty&&!this._hasSlashCommand)return e.style.opacity="0",void(e.style.visibility="hidden");const s=i.getBoundingClientRect(),n=e.getBoundingClientRect(),{from:a}=l,d=this._editor?.view.coordsAtPos(a);if(!d)return;let c=d.left-s.left,p=d.top-s.top-40;c+n.width>s.width&&(c=s.width-n.width-8),c<0&&(c=8),p<0&&(p=d.bottom-s.top+8),e.style.left=`${c}px`,e.style.top=`${p}px`,e.style.opacity="1",e.style.visibility="visible"})}render(){const e=this._editor;return M`
2
2
  <div class="editor-wrapper ${this._isLoading?"loading":""} ${this.preview?"preview":""}">
3
3
  ${this._isLoading?M`
4
4
  <div class="loading-placeholder">
@@ -294,7 +294,7 @@ import{Editor as e}from"@tiptap/core";import t from"@tiptap/extension-blockquote
294
294
  @mouseenter=${()=>{this._hoverRow=i,this._hoverCol=o}}
295
295
  @mouseleave=${()=>{this._hoverRow=0,this._hoverCol=0}}
296
296
  ></div>
297
- `)}return e}};I.styles=C`
297
+ `)}return e}};E.styles=C`
298
298
  :host {
299
299
  display: block;
300
300
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, sans-serif;
@@ -303,14 +303,14 @@ import{Editor as e}from"@tiptap/core";import t from"@tiptap/extension-blockquote
303
303
  .editor-wrapper {
304
304
  border: 1px solid #e3e3e3;
305
305
  border-radius: 12px;
306
- background: transparent;
306
+ background: #fff;
307
307
  overflow: visible;
308
308
  position: relative;
309
309
  }
310
310
 
311
311
  .editor-wrapper:focus-within {
312
- border-color: #1e96fc;
313
- box-shadow: 0 0 0 2px rgba(30, 150, 252, 0.1);
312
+ border-color: var(--qxs-color-primary, #3D61E3);
313
+ box-shadow: 0 0 0 2px rgba(61, 97, 227, 0.1);
314
314
  }
315
315
 
316
316
  .editor-wrapper.preview {
@@ -319,14 +319,20 @@ import{Editor as e}from"@tiptap/core";import t from"@tiptap/extension-blockquote
319
319
  background: transparent;
320
320
  }
321
321
 
322
+ .editor-wrapper.is-edit {
323
+ border: 1px solid #dcdfe6;
324
+ border-radius: 3px;
325
+ background: #fff;
326
+ }
327
+
322
328
  .editor-wrapper.preview .editor-content {
323
329
  padding: 8px 12px;
324
330
  min-height: unset;
325
331
  }
326
332
 
327
333
  .editor-content {
328
- padding: 16px 20px;
329
- min-height: 200px;
334
+ padding: 12px 16px;
335
+ min-height: 80px;
330
336
  cursor: text;
331
337
  }
332
338
 
@@ -372,7 +378,7 @@ import{Editor as e}from"@tiptap/core";import t from"@tiptap/extension-blockquote
372
378
  width: 24px;
373
379
  height: 24px;
374
380
  border: 2px solid #e3e3e3;
375
- border-top-color: #1e96fc;
381
+ border-top-color: var(--qxs-color-primary, #3D61E3);
376
382
  border-radius: 50%;
377
383
  animation: spin 0.8s linear infinite;
378
384
  }
@@ -506,13 +512,13 @@ import{Editor as e}from"@tiptap/core";import t from"@tiptap/extension-blockquote
506
512
  }
507
513
 
508
514
  .ProseMirror a {
509
- color: #1e96fc;
515
+ color: var(--qxs-color-primary, #3D61E3);
510
516
  text-decoration: underline;
511
517
  cursor: pointer;
512
518
  }
513
519
 
514
520
  .ProseMirror img.ProseMirror-selectednode {
515
- outline: 2px solid #1e96fc;
521
+ outline: 2px solid var(--qxs-color-primary, #3D61E3);
516
522
  }
517
523
 
518
524
  /* Table styles */
@@ -571,7 +577,7 @@ import{Editor as e}from"@tiptap/core";import t from"@tiptap/extension-blockquote
571
577
 
572
578
  .table-cell-toolbar-btn:hover {
573
579
  background: #ecf5ff;
574
- color: #1e96fc;
580
+ color: var(--qxs-color-primary, #3D61E3);
575
581
  }
576
582
 
577
583
  .table-cell-toolbar-btn.danger:hover {
@@ -599,8 +605,8 @@ import{Editor as e}from"@tiptap/core";import t from"@tiptap/extension-blockquote
599
605
 
600
606
  .table-edge-add:hover {
601
607
  background: #ecf5ff;
602
- border-color: #1e96fc;
603
- color: #1e96fc;
608
+ border-color: var(--qxs-color-primary, #3D61E3);
609
+ color: var(--qxs-color-primary, #3D61E3);
604
610
  }
605
611
 
606
612
  .table-edge-add.visible {
@@ -672,7 +678,7 @@ import{Editor as e}from"@tiptap/core";import t from"@tiptap/extension-blockquote
672
678
  }
673
679
 
674
680
  .bubble-btn.is-active {
675
- background: #1e96fc;
681
+ background: var(--qxs-color-primary, #3D61E3);
676
682
  color: #fff;
677
683
  }
678
684
 
@@ -774,7 +780,7 @@ import{Editor as e}from"@tiptap/core";import t from"@tiptap/extension-blockquote
774
780
  }
775
781
 
776
782
  .bubble-dropdown-item.is-active {
777
- background: #1e96fc;
783
+ background: var(--qxs-color-primary, #3D61E3);
778
784
  color: #fff;
779
785
  }
780
786
 
@@ -809,7 +815,7 @@ import{Editor as e}from"@tiptap/core";import t from"@tiptap/extension-blockquote
809
815
 
810
816
  .table-grid-preview .table-cell:hover {
811
817
  background: rgba(30, 150, 252, 0.3);
812
- border-color: #1e96fc;
818
+ border-color: var(--qxs-color-primary, #3D61E3);
813
819
  }
814
820
 
815
821
  .table-grid-preview .table-cell.selected {
@@ -855,7 +861,7 @@ import{Editor as e}from"@tiptap/core";import t from"@tiptap/extension-blockquote
855
861
 
856
862
  .image-toolbar-btn:hover {
857
863
  background: #f5f5f5;
858
- color: #1e96fc;
864
+ color: var(--qxs-color-primary, #3D61E3);
859
865
  }
860
866
 
861
867
  .image-toolbar-btn.danger:hover {
@@ -911,7 +917,7 @@ import{Editor as e}from"@tiptap/core";import t from"@tiptap/extension-blockquote
911
917
 
912
918
  .image-more-menu-item:hover {
913
919
  background: #f5f5f5;
914
- color: #1e96fc;
920
+ color: var(--qxs-color-primary, #3D61E3);
915
921
  }
916
922
 
917
923
  .image-more-menu-item svg {
@@ -924,8 +930,8 @@ import{Editor as e}from"@tiptap/core";import t from"@tiptap/extension-blockquote
924
930
 
925
931
  /* Selected Image */
926
932
  .ProseMirror img.selected {
927
- outline: 2px solid #1e96fc;
933
+ outline: 2px solid var(--qxs-color-primary, #3D61E3);
928
934
  outline-offset: 2px;
929
935
  }
930
- `,S([$({type:String,attribute:"content"})],I.prototype,"content",2),S([$({type:Boolean,attribute:"readonly"})],I.prototype,"readonly",2),S([$({type:Boolean,attribute:"preview"})],I.prototype,"preview",2),S([$({type:Object,attribute:"upload-image"})],I.prototype,"uploadImage",2),S([A()],I.prototype,"_pendingContent",2),S([A()],I.prototype,"_hoverRow",2),S([A()],I.prototype,"_hoverCol",2),S([A()],I.prototype,"_tableDropdownOpen",2),S([A()],I.prototype,"_isLoading",2),S([A()],I.prototype,"_tableCellToolbar",2),S([A()],I.prototype,"_tableEdgeHover",2),S([A()],I.prototype,"_imageToolbar",2),S([A()],I.prototype,"_imageMoreMenuVisible",2),S([A()],I.prototype,"_hasSlashCommand",2),I=S([R("qxs-blocksuite-editor")],I);export{I as QxsBlocksuiteEditor};
936
+ `,q([$({type:String,attribute:"content"})],E.prototype,"content",2),q([$({type:Boolean,attribute:"readonly"})],E.prototype,"readonly",2),q([$({type:Boolean,attribute:"preview"})],E.prototype,"preview",2),q([$({type:Boolean,attribute:"is-edit"})],E.prototype,"isEdit",2),q([$({type:Object,attribute:"upload-image"})],E.prototype,"uploadImage",2),q([A()],E.prototype,"_pendingContent",2),q([A()],E.prototype,"_hoverRow",2),q([A()],E.prototype,"_hoverCol",2),q([A()],E.prototype,"_tableDropdownOpen",2),q([A()],E.prototype,"_isLoading",2),q([A()],E.prototype,"_tableCellToolbar",2),q([A()],E.prototype,"_tableEdgeHover",2),q([A()],E.prototype,"_imageToolbar",2),q([A()],E.prototype,"_imageMoreMenuVisible",2),q([A()],E.prototype,"_hasSlashCommand",2),E=q([B("qxs-blocksuite-editor")],E);export{E as QxsBlocksuiteEditor};
931
937
  //# sourceMappingURL=blocksuite-editor.mjs.map