npm - @hufe921/canvas-editor - Versions diffs - 0.9.91 → 0.9.93 - Mend

@hufe921/canvas-editor 0.9.91 → 0.9.93

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.

Files changed (36) hide show

package/dist/canvas-editor.es.js CHANGED Viewed

@@ -1,4 +1,4 @@
-(()=>{(function(){"use strict";try{if(typeof document!="undefined"){var e=document.createElement("style");e.id="canvas-editor-style",e.appendChild(document.createTextNode('.ce-select-control-popup{max-width:160px;min-width:69px;max-height:225px;position:absolute;z-index:1;border:1px solid #e4e7ed;border-radius:4px;background-color:#fff;box-shadow:0 2px 12px #0000001a;box-sizing:border-box;margin:5px 0;overflow-y:auto}.ce-select-control-popup ul{list-style:none;padding:3px 0;margin:0;box-sizing:border-box}.ce-select-control-popup ul li{font-size:13px;padding:0 20px;position:relative;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#666;height:36px;line-height:36px;box-sizing:border-box;cursor:pointer}.ce-select-control-popup ul li:hover{background-color:#eef2fd}.ce-select-control-popup ul li.active{color:var(--COLOR-HOVER, #5175f4);font-weight:700}.ce-date-container{display:none;width:300px;overflow:hidden;left:0;right:0;position:absolute;z-index:1;color:#606266;background:#ffffff;border-radius:4px;padding:10px;user-select:none;border:1px solid #e4e7ed;box-shadow:0 2px 12px #0000001a}.ce-date-container.active{display:block}.ce-date-wrap{display:none}.ce-date-wrap.active{display:block}.ce-date-title{display:flex;justify-content:center;align-items:center;text-align:center;color:#606266;font-size:16px}.ce-date-title>span{display:inline-block}.ce-date-title>span:not(.ce-date-title__now){font-family:cursive;cursor:pointer}.ce-date-title>span:not(.ce-date-title__now):hover{color:#5175f4}.ce-date-title .ce-date-title__pre-year,.ce-date-title .ce-date-title__pre-month{width:15%}.ce-date-title .ce-date-title__now{width:40%}.ce-date-title .ce-date-title__next-year,.ce-date-title .ce-date-title__next-month{width:15%}.ce-date-week{width:100%;display:flex;justify-content:center;margin-top:15px;padding-bottom:5px;border-bottom:1px solid #e4e7ed}.ce-date-week>span{list-style:none;width:14.28571%;text-align:center;color:#606266;font-size:14px}.ce-date-day{width:100%;display:flex;flex-wrap:wrap;align-items:center;margin-top:5px}.ce-date-day>div{width:14.28571%;height:40px;text-align:center;color:#606266;font-size:14px;cursor:pointer;line-height:40px;border-radius:4px}.ce-date-day>div:hover{color:#5175f4;opacity:.8}.ce-date-day>div.active{color:#5175f4;font-weight:700}.ce-date-day>div.disable{color:#c0c4cc}.ce-date-day>div.select{color:#fff;background-color:#5175f4}.ce-time-wrap{display:none;padding:10px;height:286px}.ce-time-wrap ::-webkit-scrollbar{width:0}.ce-time-wrap.active{display:flex}.ce-time-wrap li{list-style:none}.ce-time-wrap>li{width:33.3%;height:100%;text-align:center}.ce-time-wrap>li>span{transform:translateY(-5px);display:inline-block}.ce-time-wrap>li>ol{height:calc(100% - 20px);overflow-y:auto;border:1px solid #e2e2e2;position:relative}.ce-time-wrap>li:first-child>ol{border-right:0}.ce-time-wrap>li:last-child>ol{border-left:0}.ce-time-wrap>li>ol>li{line-height:30px;cursor:pointer;transition:all .3s}.ce-time-wrap>li>ol>li:hover{background-color:#eaeaea}.ce-time-wrap>li>ol>li.active{color:#fff;background:#5175F4}.ce-date-menu{width:100%;height:28px;display:flex;justify-content:flex-end;align-items:center;padding-top:10px;position:relative;border-top:1px solid #e4e7ed}.ce-date-menu button{display:inline-block;line-height:1;white-space:nowrap;cursor:pointer;background:#fff;border:1px solid #dcdfe6;color:#606266;appearance:none;text-align:center;box-sizing:border-box;outline:none;transition:.1s;font-weight:500;user-select:none;padding:7px 15px;font-size:12px;border-radius:3px;margin:0 0 0 10px}.ce-date-menu button:hover{color:#5175f4;border-color:#5175f4}.ce-date-menu button.ce-date-menu__time{border:1px solid transparent;position:absolute;left:0;margin-left:0}.ce-date-menu button.ce-date-menu__time:hover{color:#5175f4}.ce-block-item{position:absolute;z-index:0;overflow:hidden;border-radius:8px;background-color:#fff;border:1px solid rgb(235 236 240)}.ce-table-tool__row{position:absolute;width:12px;border-radius:6.5px;overflow:hidden;background-color:#e2e6ed}.ce-table-tool__row .ce-table-tool__row__item{width:100%;position:relative}.ce-table-tool__row .ce-table-tool__row__item:after{content:"";position:absolute;bottom:0;left:2px;width:8px;height:1px;background-color:#c0c6cf}.ce-table-tool__row .ce-table-tool__row__item:last-child:after{display:none}.ce-table-tool__col{position:absolute;height:12px;border-radius:6.5px;overflow:hidden;background-color:#e2e6ed;display:flex}.ce-table-tool__col .ce-table-tool__col__item{height:100%;position:relative}.ce-table-tool__col .ce-table-tool__col__item:after{content:"";position:absolute;top:2px;left:-1px;width:1px;height:8px;z-index:1;background-color:#c0c6cf}.ce-table-tool__col .ce-table-tool__col__item:first-child:after{display:none}.ce-table-tool__row .ce-table-tool__row__item.active,.ce-table-tool__col .ce-table-tool__col__item.active{background-color:#c4d7fa}.ce-table-tool__col .ce-table-tool__anchor{right:-5px;width:10px;height:12px;z-index:9;position:absolute;cursor:col-resize}.ce-table-tool__row .ce-table-tool__anchor{bottom:-5px;left:0;width:12px;height:10px;z-index:9;position:absolute;cursor:row-resize}.ce-table-anchor__line{z-index:9;position:absolute;border:1px dotted #000000}.ce-table-tool__border{position:absolute;z-index:1;background:transparent;pointer-events:none}.ce-table-tool__border__row{position:absolute;cursor:row-resize;pointer-events:auto}.ce-table-tool__border__col{position:absolute;cursor:col-resize;pointer-events:auto}.ce-resizer-selection{position:absolute;border:1px solid;pointer-events:none}.ce-resizer-selection .resizer-handle{position:absolute;z-index:9;width:10px;height:10px;box-shadow:0 1px 4px #0000004d;border-radius:5px;border:2px solid #ffffff;box-sizing:border-box;pointer-events:initial}.ce-resizer-selection .handle-0{cursor:nw-resize}.ce-resizer-selection .handle-1{cursor:n-resize}.ce-resizer-selection .handle-2{cursor:ne-resize}.ce-resizer-selection .handle-3{cursor:e-resize}.ce-resizer-selection .handle-4{cursor:se-resize}.ce-resizer-selection .handle-5{cursor:s-resize}.ce-resizer-selection .handle-6{cursor:sw-resize}.ce-resizer-selection .handle-7{cursor:w-resize}.ce-resizer-size-view{display:flex;align-items:center;height:20px;white-space:nowrap;position:absolute;z-index:9;top:-30px;left:0;opacity:.9;background-color:#000;padding:0 5px;border-radius:4px}.ce-resizer-size-view span{color:#fff;font-size:12px}.ce-resizer-image{position:absolute;opacity:.5}.ce-image-previewer{position:fixed;left:0;top:0;z-index:1000;width:100%;height:100%;overflow:hidden;background:#f2f4f7;display:flex;align-items:center;justify-content:center;animation:previewerAnimation .3s}@keyframes previewerAnimation{0%{opacity:.1}to{opacity:1}}.ce-image-previewer .image-close{width:24px;height:24px;display:inline-block;position:absolute;right:50px;top:30px;z-index:99;cursor:pointer;background:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTIzLjk3IDdsMS40MTUgMS40MTQtNy43NzkgNy43NzggNy43NzkgNy43NzktMS40MTQgMS40MTQtNy43NzktNy43NzktNy43NzggNy43NzlMNyAyMy45N2w3Ljc3OC03Ljc3OUw3IDguNDE0IDguNDE0IDdsNy43NzggNy43NzhMMjMuOTcxIDd6IiBmaWxsPSIjM0Q0NzU3IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=) no-repeat;background-size:100% 100%;transition:all .3s;border-radius:50%}.ce-image-previewer .image-close:hover{background-color:#e2e6ed}.ce-image-previewer .ce-image-container{position:relative}.ce-image-previewer .ce-image-container img{cursor:move;position:relative}.ce-image-previewer .ce-image-menu{height:50px;position:absolute;bottom:50px;z-index:99;display:flex;align-items:center;justify-content:center}.ce-image-previewer .ce-image-menu i{width:32px;height:32px;margin:0 8px;cursor:pointer;display:inline-block;background-repeat:no-repeat;background-size:100% 100%;transition:all .3s;border-radius:50%}.ce-image-previewer .ce-image-menu i:hover{background-color:#e2e6ed}.ce-image-previewer .ce-image-menu i.zoom-in{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTE0IDE0di00aDJ2NGg0djJoLTR2NGgtMnYtNGgtNHYtMmg0em04Ljc0OSAxMC4xNjNBMTEuOTUyIDExLjk1MiAwIDAxMTUgMjdDOC4zNzMgMjcgMyAyMS42MjcgMyAxNVM4LjM3MyAzIDE1IDNzMTIgNS4zNzMgMTIgMTJjMCAyLjk1NC0xLjA2NyA1LjY1OC0yLjgzNyA3Ljc0OWw0LjkwOCA0LjkwOC0xLjQxNCAxLjQxNC00LjkwOC00LjkwOHpNMTUgMjVjNS41MjMgMCAxMC00LjQ3NyAxMC0xMFMyMC41MjMgNSAxNSA1IDUgOS40NzcgNSAxNXM0LjQ3NyAxMCAxMCAxMHoiIGZpbGw9IiMzRDQ3NTciLz48L3N2Zz4=)}.ce-image-previewer .ce-image-menu i.zoom-out{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTIyLjc0OSAyNC4xNjNBMTEuOTUyIDExLjk1MiAwIDAxMTUgMjdDOC4zNzMgMjcgMyAyMS42MjcgMyAxNVM4LjM3MyAzIDE1IDNzMTIgNS4zNzMgMTIgMTJjMCAyLjk1NC0xLjA2NyA1LjY1OC0yLjgzNyA3Ljc0OWw0LjkwOCA0LjkwOC0xLjQxNCAxLjQxNC00LjkwOC00LjkwOHpNMTUgMjVjNS41MjMgMCAxMC00LjQ3NyAxMC0xMFMyMC41MjMgNSAxNSA1IDUgOS40NzcgNSAxNXM0LjQ3NyAxMCAxMCAxMHptLTUtMTFoMTB2MkgxMHYtMnoiIGZpbGw9IiMzRDQ3NTciLz48L3N2Zz4=)}.ce-image-previewer .ce-image-menu i.rotate{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0iIzNENDc1NyIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMTYgNGM2LjYyNyAwIDEyIDUuMzczIDEyIDEyYTExLjk3IDExLjk3IDAgMDEtNCA4Ljk0NFYyM2gtLjg2QTkuOTY4IDkuOTY4IDAgMDAyNiAxNmMwLTUuNTIzLTQuNDc3LTEwLTEwLTEwUzYgMTAuNDc3IDYgMTZjMCA1LjE4NSAzLjk0NyA5LjQ0OSA5IDkuOTV2Mi4wMDlDOC44NCAyNy40NTEgNCAyMi4yOTEgNCAxNiA0IDkuMzczIDkuMzczIDQgMTYgNHoiIGZpbGwtcnVsZT0ibm9uemVybyIvPjxwYXRoIGQ9Ik0xOS44NzkgMjcuMzI4bDEuNzY3LTYuNzE3IDQuOTUgNC45NXoiLz48L2c+PC9zdmc+)}.ce-image-previewer .ce-image-menu i.original-size{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTQgNGgyNHYyNEg0VjR6bTIgMnYyMGgyMFY2SDZ6bTQgNWgydjEwaC0yVjExem01IDJoMnYyaC0ydi0yem0wIDRoMnYyaC0ydi0yem01LTZoMnYxMGgtMlYxMXoiIGZpbGw9IiMzRDQ3NTciLz48L3N2Zz4=)}.ce-image-previewer .ce-image-menu i.image-download{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTQuNSAxNXYzLjVoMTVWMTVIMjF2NUgzdi01aDEuNXptOC4yMzItMTEuMjI2djkuMTk2bDQuMDUtNC4wNSAxLjA2IDEuMDYtNS44MzQgNS44MzQtNS44MzMtNS44MzMgMS4wNi0xLjA2IDMuOTk4IDMuOTk2VjMuNzc0aDEuNXoiIGZpbGw9IiMzRDQ3NTciLz48L3N2Zz4=)}.ce-contextmenu-container{z-index:9;position:fixed;display:none;padding:4px;overflow-x:hidden;overflow-y:auto;background:#fff;box-shadow:0 2px 12px #38383833;border:1px solid #e2e6ed;border-radius:2px}.ce-contextmenu-content{display:flex;flex-direction:column}.ce-contextmenu-content .ce-contextmenu-sub-item:after{position:absolute;content:"";width:16px;height:16px;right:12px;background:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMCAwaDE2djE2SDB6Ii8+PGcgZmlsbD0iIzc2N0M4NSI+PHBhdGggZD0iTTcgMTIuMjQzbC0uNzA3LS43MDcgNC4yNDMtNC4yNDMuNzA3LjcwN3oiLz48cGF0aCBkPSJNNi4yOTMgNC40NjRMNyAzLjc1NyAxMS4yNDMgOGwtLjcwNy43MDd6Ii8+PC9nPjwvZz48L3N2Zz4=)}.ce-contextmenu-content .ce-contextmenu-item{min-width:140px;padding:0 32px 0 16px;height:30px;display:flex;align-items:center;white-space:nowrap;box-sizing:border-box;cursor:pointer}.ce-contextmenu-content .ce-contextmenu-item.hover{background:rgba(25,55,88,.04)}.ce-contextmenu-content .ce-contextmenu-item span{max-width:300px;font-size:12px;color:#3d4757;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.ce-contextmenu-content .ce-contextmenu-item span.ce-shortcut{color:#767c85;height:30px;flex:1;text-align:right;line-height:30px;margin-left:20px}.ce-contextmenu-content .ce-contextmenu-item i{width:16px;height:16px;vertical-align:middle;display:inline-block;background-repeat:no-repeat;background-size:100% 100%;flex-shrink:0;margin-right:8px}.ce-contextmenu-divider{background-color:#e2e6ed;margin:4px 16px;height:1px}.ce-contextmenu-print{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjM0Q0NzU3IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0xMiA0aC0xVjJINXYySDRWMmExIDEgMCAwMTEtMWg2YTEgMSAwIDAxMSAxdjJ6bTAgNXY0YTEgMSAwIDAxLTEgMUg1YTEgMSAwIDAxLTEtMVY5aDF2NGg2VjloMXoiLz48cGF0aCBkPSJNMTIgMTJ2LTFoMlY1SDJ2NmgydjFIMmExIDEgMCAwMS0xLTFWNWExIDEgMCAwMTEtMWgxMmExIDEgMCAwMTEgMXY2YTEgMSAwIDAxLTEgMWgtMnoiLz48cGF0aCBkPSJNMyA4aDEwdjFIM3ptOC0yaDJ2MWgtMnoiLz48L2c+PC9zdmc+)}.ce-contextmenu-image{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSLlm77lsYJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4PSIwIiB5PSIwIiB2aWV3Qm94PSIwIDAgMTYgMTYiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxzdHlsZT4uc3Qwe2ZpbGw6IzNkNDc1N308L3N0eWxlPjxnIGlkPSJfeDMwXzAt5YWs5YWxX3gyRl8wMuW3peWFt+agj194MkZf5o+S5YWl5Zu+54mHLTE2cHgtIj48ZyBpZD0iR3JvdXAtMTkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEgMSkiPjxwYXRoIGlkPSJDb21iaW5lZC1TaGFwZSIgY2xhc3M9InN0MCIgZD0iTTEgMGgxMmMuNiAwIDEgLjQgMSAxdjExYzAgLjYtLjQgMS0xIDFIMWMtLjYgMC0xLS40LTEtMVYxYzAtLjYuNC0xIDEtMXptMCAxdjExaDEyVjFIMXoiLz48Y2lyY2xlIGlkPSLmpK3lnIblvaIiIGNsYXNzPSJzdDAiIGN4PSIxMCIgY3k9IjQiIHI9IjEiLz48cGF0aCBpZD0iUGF0aCIgY2xhc3M9InN0MCIgZD0iTTguNSAxMS4ybC00LTQuMUwxIDEwLjdWOS4yYzEuNy0xLjYgMi43LTIuNSAzLTIuOC40LS41LjctLjQgMSAwTDguNSAxMCAxMSA3LjNjLjQtLjUuNi0uNSAxLS4xbDIgMi44djEuNWwtMi41LTMuNC0zIDMuMXoiLz48L2c+PC9nPjwvc3ZnPg==)}.ce-contextmenu-image-change{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyIDQpIiBmaWxsPSIjM0Q0NzU3Ij48Y2lyY2xlIGZpbGwtcnVsZT0ibm9uemVybyIgY3g9IjMiIGN5PSIxIiByPSIxIi8+PHBhdGggZD0iTTcuNDczIDguMjIzTDMuNDcgNC4xMDcgMCA3LjY2N3YtMS41QzEuNzE1IDQuNiAyLjcwNyAzLjY2NCAyLjk3NSAzLjM1OGMuNDAyLS40NTcuNjUxLS4zOSAxLjA0MiAwTDcuNDczIDcgOS45NiA0LjM0OWMuNDE0LS40NjIuNjItLjQ2MiAxLjAxMS0uMDcxTDEzIDcuMDZ2MS41bC0yLjUxLTMuNDEtMy4wMTcgMy4wNzJ6Ii8+PC9nPjxwYXRoIGQ9Ik02IDEuNUgxLjV2MTJoMTN2LTRWMTNhLjUuNSAwIDAxLS41LjVIMmEuNS41IDAgMDEtLjUtLjVWMmEuNS41IDAgMDEuNS0uNWg0em04LjUgOFY2bC0uNS41aDFsLS41LS41djMuNXpNNiAxLjVoNEw5LjUgMXYxbC41LS41SDZ6IiBzdHJva2U9IiMzRDQ3NTciLz48cGF0aCBkPSJNMTMuMDg1IDEuMzE2bC0zLjgxNCA0YTEgMSAwIDAwMS40NTggMS4zNjhsMy44MTUtNGExIDEgMCAxMC0xLjQ1OS0xLjM2OHoiIGZpbGw9IiMzRDQ3NTciIGZpbGwtcnVsZT0ibm9uemVybyIvPjwvZz48L3N2Zz4=)}.ce-contextmenu-insert-row-col{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBzdHJva2U9IiMzRDQ3NTciIGQ9Ik04LjUgNS41aDZ2NGgtNnoiLz48cGF0aCBmaWxsPSIjM0Q0NzU3IiBkPSJNNCA3djFoMlY3em0tMyAuNUw0IDV2NXpNMSAxaDEydjFIMXptMCAxMmgxMnYxSDF6Ii8+PC9nPjwvc3ZnPg==)}.ce-contextmenu-insert-top-row{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBmaWxsPSIjM0Q0NzU3IiBkPSJNOCA1SDd2M2gxem0tLjUtM0wxMCA1SDV6Ii8+PHJlY3Qgc3Ryb2tlPSIjM0Q0NzU3IiB4PSIxLjUiIHk9IjEwLjUiIHdpZHRoPSIxMiIgaGVpZ2h0PSIzIiByeD0iMSIvPjwvZz48L3N2Zz4=)}.ce-contextmenu-insert-bottom-row{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBmaWxsPSIjM0Q0NzU3IiBkPSJNNyAxMWgxVjhIN3ptLjUgM0w1IDExaDV6Ii8+PHJlY3Qgc3Ryb2tlPSIjM0Q0NzU3IiB4PSIxLjUiIHk9IjIuNSIgd2lkdGg9IjEyIiBoZWlnaHQ9IjMiIHJ4PSIxIi8+PC9nPjwvc3ZnPg==)}.ce-contextmenu-insert-left-col{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBmaWxsPSIjM0Q0NzU3IiBkPSJNMTEgN3YxaDNWN3ptLTMgLjVMMTEgNXY1eiIvPjxyZWN0IHN0cm9rZT0iIzNENDc1NyIgdHJhbnNmb3JtPSJyb3RhdGUoOTAgNCA3LjUpIiB4PSItMiIgeT0iNiIgd2lkdGg9IjEyIiBoZWlnaHQ9IjMiIHJ4PSIxIi8+PC9nPjwvc3ZnPg==)}.ce-contextmenu-insert-right-col{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBmaWxsPSIjM0Q0NzU3IiBkPSJNNSA4VjdIMnYxem0zLS41TDUgMTBWNXoiLz48cmVjdCBzdHJva2U9IiMzRDQ3NTciIHRyYW5zZm9ybT0icm90YXRlKDkwIDEyIDcuNSkiIHg9IjYiIHk9IjYiIHdpZHRoPSIxMiIgaGVpZ2h0PSIzIiByeD0iMSIvPjwvZz48L3N2Zz4=)}.ce-contextmenu-delete-row-col{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBzdHJva2U9IiM5MjlBQTgiIGQ9Ik04LjUgNi41aDZ2MmgtNnoiLz48cGF0aCBmaWxsPSIjM0Q0NzU3IiBkPSJNMiAxMmgxMXYxSDJ6TTIgMmgxMXYxSDJ6bS42MyAzTDcgOS4zNWwtLjYzNS42NUwyIDUuNjN6Ii8+PHBhdGggZmlsbD0iIzNENDc1NyIgZD0iTTIgOS4zNjNMNi4zNTUgNSA3IDUuNzA3IDIuNjk1IDEweiIvPjwvZz48L3N2Zz4=)}.ce-contextmenu-delete-row{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBzdHJva2U9IiM5MjlBQTgiIGQ9Ik04LjUgNS41aDZ2NGgtNnoiLz48cGF0aCBmaWxsPSIjM0Q0NzU3IiBkPSJNMSAxM2gxMnYxSDF6TTEgMWgxMnYxSDF6bTAgNGgxdjFIMXptMSAxaDF2MUgyem0xIDFoMXYxSDN6bTEtMWgxdjFINHptMS0xaDF2MUg1ek00IDhoMXYxSDR6TTIgOGgxdjFIMnptMyAxaDF2MUg1ek0xIDloMXYxSDF6Ii8+PC9nPjwvc3ZnPg==)}.ce-contextmenu-delete-col{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBzdHJva2U9IiM5MjlBQTgiIGQ9Ik01LjUgNy41di02aDR2NnoiLz48cGF0aCBmaWxsPSIjM0Q0NzU3IiBkPSJNMTMgMTVWM2gxdjEyek0xIDE1VjNoMXYxMnptNCAwdi0xaDF2MXptMS0xdi0xaDF2MXptMS0xdi0xaDF2MXptLTEtMXYtMWgxdjF6bS0xLTF2LTFoMXYxem0zIDF2LTFoMXYxem0wIDJ2LTFoMXYxem0xLTN2LTFoMXYxem0wIDR2LTFoMXYxeiIvPjwvZz48L3N2Zz4=)}.ce-contextmenu-delete-table{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0iIzNENDc1NyIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMTQgMTNoLTF2LTNIMnYzSDF2LTNhMSAxIDAgMDExLTFoMTFhMSAxIDAgMDExIDF2M3oiIGZpbGwtcnVsZT0ibm9uemVybyIvPjxwYXRoIGQ9Ik01LjYyNSAyTDEwIDYuMzc1IDkuMzc1IDcgNSAyLjYyNXoiLz48cGF0aCBkPSJNNSA2LjM3NUw5LjM3NSAybC42MjUuNjI1TDUuNjI1IDd6Ii8+PC9nPjwvc3ZnPg==)}.ce-contextmenu-merge-cell{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0iIzNENDc1NyIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNNiAxdjFIMnYxMWg0djFIMmExIDEgMCAwMS0xLTFWMmExIDEgMCAwMTEtMWg0em0zIDBoNGExIDEgMCAwMTEgMXYxMWExIDEgMCAwMS0xIDFIOXYtMWg0VjJIOVYxeiIvPjxwYXRoIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTYgMWgxdjRINnptMiAwaDF2NEg4eiIvPjxwYXRoIGQ9Ik04IDcuNUwxMCA2djN6bS0xIDBMNSA2djN6Ii8+PHBhdGggZD0iTTkgN2gzdjFIOXpNMyA3aDN2MUgzeiIvPjxwYXRoIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTggMTBoMXY0SDh6bS0yIDBoMXY0SDZ6Ii8+PC9nPjwvc3ZnPg==)}.ce-contextmenu-merge-cancel-cell{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0iIzNENDc1NyIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNNiAxdjFIMnYxMWg0djFIMmExIDEgMCAwMS0xLTFWMmExIDEgMCAwMTEtMWg0em0zIDBoNGExIDEgMCAwMTEgMXYxMWExIDEgMCAwMS0xIDFIOXYtMWg0VjJIOVYxeiIvPjxwYXRoIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTYgMWgxdjRINnptMiAwaDF2NEg4eiIvPjxwYXRoIGQ9Ik0zIDcuNUw1IDZ2M3ptOSAwTDEwIDZ2M3oiLz48cGF0aCBkPSJNNCA3aDN2MUg0em00IDBoM3YxSDh6Ii8+PHBhdGggZmlsbC1ydWxlPSJub256ZXJvIiBkPSJNOCAxMGgxdjRIOHptLTIgMGgxdjRINnoiLz48L2c+PC9zdmc+)}.ce-contextmenu-vertical-align{background-image:url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjE2IiB2aWV3Qm94PSIwIDAgMTYgMTYiIHdpZHRoPSIxNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMiAxM2gxMnYxSDJ6bTAtM2g4djFIMnptMC0zaDEydjFIMnptMC02aDEydjFIMnptMCAzaDh2MUgyeiIgZmlsbD0iIzNkNDc1NyIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+)}.ce-contextmenu-vertical-align-top{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTggOEg3djZoMXptLS41LTNMMTAgOEg1ek0yIDNoMTF2MUgyeiIgZmlsbD0iIzNENDc1NyIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+)}.ce-contextmenu-vertical-align-middle{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNOCAxMkg3djNoMXptLS41LTNsMi41IDNINXpNNyAzaDFWMEg3em0uNSAzTDUgM2g1ek0yIDdoMTF2MUgyeiIgZmlsbD0iIzNENDc1NyIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+)}.ce-contextmenu-vertical-align-bottom{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTcgOWgxVjNIN3ptLjUgM0w1IDloNXpNMiAxM2gxMXYxSDJ6IiBmaWxsPSIjM0Q0NzU3IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=)}.ce-contextmenu-border-all{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTIuNSAzYS41LjUgMCAwMS41LS41aDExYS41LjUgMCAwMS41LjV2MTFhLjUuNSAwIDAxLS41LjVIM2EuNS41IDAgMDEtLjUtLjVWM3oiIHN0cm9rZT0iIzNENDc1NyIvPjxwYXRoIGZpbGw9IiMzRDQ3NTciIGQ9Ik0zIDhoMTF2MUgzeiIvPjxwYXRoIGZpbGw9IiMzRDQ3NTciIGQ9Ik05IDN2MTFIOFYzeiIvPjwvc3ZnPg==)}.ce-contextmenu-border-empty{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMyAzaC0xVjJoMWExIDEgMCAwMTEgMXYxaC0xVjN6bS0zLTF2MUg4LjV2MmgtMVYzSDZWMmg0ek00IDJ2MUgzdjFIMlYzYTEgMSAwIDAxMS0xaDF6TTIgNmgxdjEuNWgydjFIM1YxMEgyVjZ6bTAgNmgxdjFoMXYxSDNhMSAxIDAgMDEtMS0xdi0xem00IDJ2LTFoMS41di0yaDF2MkgxMHYxSDZ6bTYgMHYtMWgxdi0xaDF2MWExIDEgMCAwMS0xIDFoLTF6bTItNGgtMVY4LjVoLTJ2LTFoMlY2aDF2NHpNOC41IDcuNXYtMWgtMXYxaC0xdjFoMXYxaDF2LTFoMXYtMWgtMXoiIGZpbGw9IiNBQUFDQjAiLz48L3N2Zz4=)}.ce-contextmenu-border-external{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTIuNSAzYS41LjUgMCAwMS41LS41aDExYS41LjUgMCAwMS41LjV2MTFhLjUuNSAwIDAxLS41LjVIM2EuNS41IDAgMDEtLjUtLjVWM3oiIHN0cm9rZT0iIzNENDc1NyIvPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNOSA1VjNIOHYyaDF6bTAgOXYtMkg4djJoMXpNNSA4SDN2MWgyVjh6bTkgMGgtMnYxaDJWOHpNOSA3djFoMXYxSDl2MUg4VjlIN1Y4aDFWN2gxeiIgZmlsbD0iI0FBQUNCMCIvPjwvc3ZnPg==)}.ce-contextmenu-border-td{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTIuNSAzYS41LjUgMCAwMS41LS41aDExYS41LjUgMCAwMS41LjV2MTFhLjUuNSAwIDAxLS41LjVIM2EuNS41IDAgMDEtLjUtLjVWM3oiIHN0cm9rZT0iI0FBQUNCMCIvPjxwYXRoIHN0cm9rZT0iIzNENDc1NyIgZD0iTTguNSAyLjUgdjYgaC02Ii8+PC9zdmc+)}.ce-contextmenu-border-td-top{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTIuNSAzYS41LjUgMCAwMS41LS41aDExYS41LjUgMCAwMS41LjV2MTFhLjUuNSAwIDAxLS41LjVIM2EuNS41IDAgMDEtLjUtLjVWM3oiIHN0cm9rZT0iI0FBQUNCMCIvPjxwYXRoIHN0cm9rZT0iIzNENDc1NyIgc3Ryb2tlLXdpZHRoPSIyIiBkPSJNMi41IDMgaDEyIi8+PC9zdmc+)}.ce-contextmenu-border-td-left{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTIuNSAzYS41LjUgMCAwMS41LS41aDExYS41LjUgMCAwMS41LjV2MTFhLjUuNSAwIDAxLS41LjVIM2EuNS41IDAgMDEtLjUtLjVWM3oiIHN0cm9rZT0iI0FBQUNCMCIvPjxwYXRoIHN0cm9rZT0iIzNENDc1NyIgc3Ryb2tlLXdpZHRoPSIyIiBkPSJNMyAzIHYxMSIvPjwvc3ZnPg==)}.ce-contextmenu-border-td-bottom{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTIuNSAzYS41LjUgMCAwMS41LS41aDExYS41LjUgMCAwMS41LjV2MTFhLjUuNSAwIDAxLS41LjVIM2EuNS41IDAgMDEtLjUtLjVWM3oiIHN0cm9rZT0iI0FBQUNCMCIvPjxwYXRoIHN0cm9rZT0iIzNENDc1NyIgc3Ryb2tlLXdpZHRoPSIyIiBkPSJNMi41IDE0IGgxMiIvPjwvc3ZnPg==)}.ce-contextmenu-border-td-right{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTIuNSAzYS41LjUgMCAwMS41LS41aDExYS41LjUgMCAwMS41LjV2MTFhLjUuNSAwIDAxLS41LjVIM2EuNS41IDAgMDEtLjUtLjVWM3oiIHN0cm9rZT0iI0FBQUNCMCIvPjxwYXRoIHN0cm9rZT0iIzNENDc1NyIgc3Ryb2tlLXdpZHRoPSIyIiBkPSJNMTQgMyB2MTEiLz48L3N2Zz4=)}.ce-contextmenu-border-td-forward{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTIuNSAzYS41LjUgMCAwMS41LS41aDExYS41LjUgMCAwMS41LjV2MTFhLjUuNSAwIDAxLS41LjVIM2EuNS41IDAgMDEtLjUtLjVWM3oiIHN0cm9rZT0iI0FBQUNCMCIgLz48cGF0aCBzdHJva2U9IiMzRDQ3NTciIGQ9Ik0xNCAzIGwtMTEgMTEiIC8+PC9zdmc+)}.ce-contextmenu-border-td-back{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTIuNSAzYS41LjUgMCAwMS41LS41aDExYS41LjUgMCAwMS41LjV2MTFhLjUuNSAwIDAxLS41LjVIM2EuNS41IDAgMDEtLjUtLjVWM3oiIHN0cm9rZT0iI0FBQUNCMCIgLz48cGF0aCBzdHJva2U9IiMzRDQ3NTciIGQ9Ik0zIDMgbDExIDExIiAvPjwvc3ZnPg==)}.ce-hyperlink-popup{background:#fff;box-shadow:0 2px 12px #626b8433;border-radius:2px;color:#3d4757;padding:12px 16px;position:absolute;z-index:1;text-align:center;display:none}.ce-hyperlink-popup a{min-width:100px;max-width:300px;font-size:12px;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;text-decoration:none;border-bottom-width:1px;border-bottom-style:solid;color:#00f}.ce-zone-indicator>div{padding:3px 6px;color:#000;font-size:12px;background:rgb(218 231 252);position:absolute;transform-origin:0 0}.ce-zone-indicator-border__top,.ce-zone-indicator-border__bottom,.ce-zone-indicator-border__left,.ce-zone-indicator-border__right{display:block;position:absolute;z-index:0}.ce-zone-indicator-border__top{border-top:2px dashed rgb(238,238,238)}.ce-zone-indicator-border__bottom{border-top:2px dashed rgb(238,238,238);width:100%}.ce-zone-indicator-border__left{border-left:2px dashed rgb(238,238,238)}.ce-zone-indicator-border__right{border-right:2px dashed rgb(238,238,238)}.ce-zone-tip{display:none;align-items:center;height:30px;white-space:nowrap;position:fixed;opacity:.9;background-color:#000;padding:0 5px;border-radius:4px;z-index:9;transition:all .3s;outline:none;user-select:none;pointer-events:none;transform:translate(10px,10px)}.ce-zone-tip.show{display:flex}.ce-zone-tip span{color:#fff;font-size:12px}.ce-inputarea{width:100px;height:30px;min-width:0;min-height:0;margin:0;padding:0;left:0;right:0;letter-spacing:0;font-size:12px;position:absolute;z-index:-1;outline:none;resize:none;border:none;overflow:hidden;color:transparent;user-select:none;caret-color:transparent;background-color:transparent}.ce-cursor{width:1px;height:20px;left:0;right:0;position:absolute;outline:none;background-color:#000;pointer-events:none}.ce-cursor.ce-cursor--animation{animation-duration:1s;animation-iteration-count:infinite;animation-name:cursorAnimation}@keyframes cursorAnimation{0%{opacity:1}13%{opacity:0}50%{opacity:0}63%{opacity:1}to{opacity:1}}.ce-float-image{position:absolute;opacity:.5;pointer-events:none}')),document.head.appendChild(e)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}})();})();
+(()=>{(function(){"use strict";try{if(typeof document!="undefined"){var e=document.createElement("style");e.id="canvas-editor-style",e.appendChild(document.createTextNode('.ce-select-control-popup{max-width:160px;min-width:69px;max-height:225px;position:absolute;z-index:1;border:1px solid #e4e7ed;border-radius:4px;background-color:#fff;box-shadow:0 2px 12px #0000001a;box-sizing:border-box;margin:5px 0;overflow-y:auto}.ce-select-control-popup ul{list-style:none;padding:3px 0;margin:0;box-sizing:border-box}.ce-select-control-popup ul li{font-size:13px;padding:0 20px;position:relative;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#666;height:36px;line-height:36px;box-sizing:border-box;cursor:pointer}.ce-select-control-popup ul li:hover{background-color:#eef2fd}.ce-select-control-popup ul li.active{color:var(--COLOR-HOVER, #5175f4);font-weight:700}.ce-date-container{display:none;width:300px;overflow:hidden;left:0;right:0;position:absolute;z-index:1;color:#606266;background:#ffffff;border-radius:4px;padding:10px;user-select:none;border:1px solid #e4e7ed;box-shadow:0 2px 12px #0000001a}.ce-date-container.active{display:block}.ce-date-wrap{display:none}.ce-date-wrap.active{display:block}.ce-date-title{display:flex;justify-content:center;align-items:center;text-align:center;color:#606266;font-size:16px}.ce-date-title>span{display:inline-block}.ce-date-title>span:not(.ce-date-title__now){font-family:cursive;cursor:pointer}.ce-date-title>span:not(.ce-date-title__now):hover{color:#5175f4}.ce-date-title .ce-date-title__pre-year,.ce-date-title .ce-date-title__pre-month{width:15%}.ce-date-title .ce-date-title__now{width:40%}.ce-date-title .ce-date-title__next-year,.ce-date-title .ce-date-title__next-month{width:15%}.ce-date-week{width:100%;display:flex;justify-content:center;margin-top:15px;padding-bottom:5px;border-bottom:1px solid #e4e7ed}.ce-date-week>span{list-style:none;width:14.28571%;text-align:center;color:#606266;font-size:14px}.ce-date-day{width:100%;display:flex;flex-wrap:wrap;align-items:center;margin-top:5px}.ce-date-day>div{width:14.28571%;height:40px;text-align:center;color:#606266;font-size:14px;cursor:pointer;line-height:40px;border-radius:4px}.ce-date-day>div:hover{color:#5175f4;opacity:.8}.ce-date-day>div.active{color:#5175f4;font-weight:700}.ce-date-day>div.disable{color:#c0c4cc}.ce-date-day>div.select{color:#fff;background-color:#5175f4}.ce-time-wrap{display:none;padding:10px;height:286px}.ce-time-wrap ::-webkit-scrollbar{width:0}.ce-time-wrap.active{display:flex}.ce-time-wrap li{list-style:none}.ce-time-wrap>li{width:33.3%;height:100%;text-align:center}.ce-time-wrap>li>span{transform:translateY(-5px);display:inline-block}.ce-time-wrap>li>ol{height:calc(100% - 20px);overflow-y:auto;border:1px solid #e2e2e2;position:relative}.ce-time-wrap>li:first-child>ol{border-right:0}.ce-time-wrap>li:last-child>ol{border-left:0}.ce-time-wrap>li>ol>li{line-height:30px;cursor:pointer;transition:all .3s}.ce-time-wrap>li>ol>li:hover{background-color:#eaeaea}.ce-time-wrap>li>ol>li.active{color:#fff;background:#5175F4}.ce-date-menu{width:100%;height:28px;display:flex;justify-content:flex-end;align-items:center;padding-top:10px;position:relative;border-top:1px solid #e4e7ed}.ce-date-menu button{display:inline-block;line-height:1;white-space:nowrap;cursor:pointer;background:#fff;border:1px solid #dcdfe6;color:#606266;appearance:none;text-align:center;box-sizing:border-box;outline:none;transition:.1s;font-weight:500;user-select:none;padding:7px 15px;font-size:12px;border-radius:3px;margin:0 0 0 10px}.ce-date-menu button:hover{color:#5175f4;border-color:#5175f4}.ce-date-menu button.ce-date-menu__time{border:1px solid transparent;position:absolute;left:0;margin-left:0}.ce-date-menu button.ce-date-menu__time:hover{color:#5175f4}.ce-block-item{position:absolute;z-index:0;overflow:hidden;border-radius:8px;background-color:#fff;border:1px solid rgb(235 236 240)}.ce-table-tool__row{position:absolute;width:12px;border-radius:6.5px;overflow:hidden;background-color:#e2e6ed}.ce-table-tool__row .ce-table-tool__row__item{width:100%;position:relative}.ce-table-tool__row .ce-table-tool__row__item:after{content:"";position:absolute;bottom:0;left:2px;width:8px;height:1px;background-color:#c0c6cf}.ce-table-tool__row .ce-table-tool__row__item:last-child:after{display:none}.ce-table-tool__quick__add{width:16px;height:16px;position:absolute;border-radius:50%;background-color:#e2e6ed;cursor:pointer}.ce-table-tool__quick__add:after{content:"+";color:#fff;position:absolute;top:50%;left:50%;transform:translate(-50%,-55%)}.ce-table-tool__col{position:absolute;height:12px;border-radius:6.5px;overflow:hidden;background-color:#e2e6ed;display:flex}.ce-table-tool__col .ce-table-tool__col__item{height:100%;position:relative}.ce-table-tool__col .ce-table-tool__col__item:after{content:"";position:absolute;top:2px;left:-1px;width:1px;height:8px;z-index:1;background-color:#c0c6cf}.ce-table-tool__col .ce-table-tool__col__item:first-child:after{display:none}.ce-table-tool__row .ce-table-tool__row__item.active,.ce-table-tool__col .ce-table-tool__col__item.active{background-color:#c4d7fa}.ce-table-tool__col .ce-table-tool__anchor{right:-5px;width:10px;height:12px;z-index:9;position:absolute;cursor:col-resize}.ce-table-tool__row .ce-table-tool__anchor{bottom:-5px;left:0;width:12px;height:10px;z-index:9;position:absolute;cursor:row-resize}.ce-table-anchor__line{z-index:9;position:absolute;border:1px dotted #000000}.ce-table-tool__border{position:absolute;z-index:1;background:transparent;pointer-events:none}.ce-table-tool__border__row{position:absolute;cursor:row-resize;pointer-events:auto}.ce-table-tool__border__col{position:absolute;cursor:col-resize;pointer-events:auto}.ce-resizer-selection{position:absolute;border:1px solid;pointer-events:none}.ce-resizer-selection .resizer-handle{position:absolute;z-index:9;width:10px;height:10px;box-shadow:0 1px 4px #0000004d;border-radius:5px;border:2px solid #ffffff;box-sizing:border-box;pointer-events:initial}.ce-resizer-selection .handle-0{cursor:nw-resize}.ce-resizer-selection .handle-1{cursor:n-resize}.ce-resizer-selection .handle-2{cursor:ne-resize}.ce-resizer-selection .handle-3{cursor:e-resize}.ce-resizer-selection .handle-4{cursor:se-resize}.ce-resizer-selection .handle-5{cursor:s-resize}.ce-resizer-selection .handle-6{cursor:sw-resize}.ce-resizer-selection .handle-7{cursor:w-resize}.ce-resizer-size-view{display:flex;align-items:center;height:20px;white-space:nowrap;position:absolute;z-index:9;top:-30px;left:0;opacity:.9;background-color:#000;padding:0 5px;border-radius:4px}.ce-resizer-size-view span{color:#fff;font-size:12px}.ce-resizer-image{position:absolute;opacity:.5}.ce-image-previewer{position:fixed;left:0;top:0;z-index:1000;width:100%;height:100%;overflow:hidden;background:#f2f4f7;display:flex;align-items:center;justify-content:center;animation:previewerAnimation .3s}@keyframes previewerAnimation{0%{opacity:.1}to{opacity:1}}.ce-image-previewer .image-close{width:24px;height:24px;display:inline-block;position:absolute;right:50px;top:30px;z-index:99;cursor:pointer;background:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTIzLjk3IDdsMS40MTUgMS40MTQtNy43NzkgNy43NzggNy43NzkgNy43NzktMS40MTQgMS40MTQtNy43NzktNy43NzktNy43NzggNy43NzlMNyAyMy45N2w3Ljc3OC03Ljc3OUw3IDguNDE0IDguNDE0IDdsNy43NzggNy43NzhMMjMuOTcxIDd6IiBmaWxsPSIjM0Q0NzU3IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=) no-repeat;background-size:100% 100%;transition:all .3s;border-radius:50%}.ce-image-previewer .image-close:hover{background-color:#e2e6ed}.ce-image-previewer .ce-image-container{position:relative}.ce-image-previewer .ce-image-container img{cursor:move;position:relative}.ce-image-previewer .ce-image-menu{height:50px;position:absolute;bottom:50px;z-index:99;display:flex;align-items:center;justify-content:center}.ce-image-previewer .ce-image-menu i{width:32px;height:32px;margin:0 8px;cursor:pointer;display:inline-block;background-repeat:no-repeat;background-size:100% 100%;transition:all .3s;border-radius:50%}.ce-image-previewer .ce-image-menu i:hover{background-color:#e2e6ed}.ce-image-previewer .ce-image-menu i.zoom-in{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTE0IDE0di00aDJ2NGg0djJoLTR2NGgtMnYtNGgtNHYtMmg0em04Ljc0OSAxMC4xNjNBMTEuOTUyIDExLjk1MiAwIDAxMTUgMjdDOC4zNzMgMjcgMyAyMS42MjcgMyAxNVM4LjM3MyAzIDE1IDNzMTIgNS4zNzMgMTIgMTJjMCAyLjk1NC0xLjA2NyA1LjY1OC0yLjgzNyA3Ljc0OWw0LjkwOCA0LjkwOC0xLjQxNCAxLjQxNC00LjkwOC00LjkwOHpNMTUgMjVjNS41MjMgMCAxMC00LjQ3NyAxMC0xMFMyMC41MjMgNSAxNSA1IDUgOS40NzcgNSAxNXM0LjQ3NyAxMCAxMCAxMHoiIGZpbGw9IiMzRDQ3NTciLz48L3N2Zz4=)}.ce-image-previewer .ce-image-menu i.zoom-out{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTIyLjc0OSAyNC4xNjNBMTEuOTUyIDExLjk1MiAwIDAxMTUgMjdDOC4zNzMgMjcgMyAyMS42MjcgMyAxNVM4LjM3MyAzIDE1IDNzMTIgNS4zNzMgMTIgMTJjMCAyLjk1NC0xLjA2NyA1LjY1OC0yLjgzNyA3Ljc0OWw0LjkwOCA0LjkwOC0xLjQxNCAxLjQxNC00LjkwOC00LjkwOHpNMTUgMjVjNS41MjMgMCAxMC00LjQ3NyAxMC0xMFMyMC41MjMgNSAxNSA1IDUgOS40NzcgNSAxNXM0LjQ3NyAxMCAxMCAxMHptLTUtMTFoMTB2MkgxMHYtMnoiIGZpbGw9IiMzRDQ3NTciLz48L3N2Zz4=)}.ce-image-previewer .ce-image-menu i.rotate{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0iIzNENDc1NyIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMTYgNGM2LjYyNyAwIDEyIDUuMzczIDEyIDEyYTExLjk3IDExLjk3IDAgMDEtNCA4Ljk0NFYyM2gtLjg2QTkuOTY4IDkuOTY4IDAgMDAyNiAxNmMwLTUuNTIzLTQuNDc3LTEwLTEwLTEwUzYgMTAuNDc3IDYgMTZjMCA1LjE4NSAzLjk0NyA5LjQ0OSA5IDkuOTV2Mi4wMDlDOC44NCAyNy40NTEgNCAyMi4yOTEgNCAxNiA0IDkuMzczIDkuMzczIDQgMTYgNHoiIGZpbGwtcnVsZT0ibm9uemVybyIvPjxwYXRoIGQ9Ik0xOS44NzkgMjcuMzI4bDEuNzY3LTYuNzE3IDQuOTUgNC45NXoiLz48L2c+PC9zdmc+)}.ce-image-previewer .ce-image-menu i.original-size{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTQgNGgyNHYyNEg0VjR6bTIgMnYyMGgyMFY2SDZ6bTQgNWgydjEwaC0yVjExem01IDJoMnYyaC0ydi0yem0wIDRoMnYyaC0ydi0yem01LTZoMnYxMGgtMlYxMXoiIGZpbGw9IiMzRDQ3NTciLz48L3N2Zz4=)}.ce-image-previewer .ce-image-menu i.image-download{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTQuNSAxNXYzLjVoMTVWMTVIMjF2NUgzdi01aDEuNXptOC4yMzItMTEuMjI2djkuMTk2bDQuMDUtNC4wNSAxLjA2IDEuMDYtNS44MzQgNS44MzQtNS44MzMtNS44MzMgMS4wNi0xLjA2IDMuOTk4IDMuOTk2VjMuNzc0aDEuNXoiIGZpbGw9IiMzRDQ3NTciLz48L3N2Zz4=)}.ce-contextmenu-container{z-index:9;position:fixed;display:none;padding:4px;overflow-x:hidden;overflow-y:auto;background:#fff;box-shadow:0 2px 12px #38383833;border:1px solid #e2e6ed;border-radius:2px}.ce-contextmenu-content{display:flex;flex-direction:column}.ce-contextmenu-content .ce-contextmenu-sub-item:after{position:absolute;content:"";width:16px;height:16px;right:12px;background:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMCAwaDE2djE2SDB6Ii8+PGcgZmlsbD0iIzc2N0M4NSI+PHBhdGggZD0iTTcgMTIuMjQzbC0uNzA3LS43MDcgNC4yNDMtNC4yNDMuNzA3LjcwN3oiLz48cGF0aCBkPSJNNi4yOTMgNC40NjRMNyAzLjc1NyAxMS4yNDMgOGwtLjcwNy43MDd6Ii8+PC9nPjwvZz48L3N2Zz4=)}.ce-contextmenu-content .ce-contextmenu-item{min-width:140px;padding:0 32px 0 16px;height:30px;display:flex;align-items:center;white-space:nowrap;box-sizing:border-box;cursor:pointer}.ce-contextmenu-content .ce-contextmenu-item.hover{background:rgba(25,55,88,.04)}.ce-contextmenu-content .ce-contextmenu-item span{max-width:300px;font-size:12px;color:#3d4757;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.ce-contextmenu-content .ce-contextmenu-item span.ce-shortcut{color:#767c85;height:30px;flex:1;text-align:right;line-height:30px;margin-left:20px}.ce-contextmenu-content .ce-contextmenu-item i{width:16px;height:16px;vertical-align:middle;display:inline-block;background-repeat:no-repeat;background-size:100% 100%;flex-shrink:0;margin-right:8px}.ce-contextmenu-divider{background-color:#e2e6ed;margin:4px 16px;height:1px}.ce-contextmenu-print{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjM0Q0NzU3IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0xMiA0aC0xVjJINXYySDRWMmExIDEgMCAwMTEtMWg2YTEgMSAwIDAxMSAxdjJ6bTAgNXY0YTEgMSAwIDAxLTEgMUg1YTEgMSAwIDAxLTEtMVY5aDF2NGg2VjloMXoiLz48cGF0aCBkPSJNMTIgMTJ2LTFoMlY1SDJ2NmgydjFIMmExIDEgMCAwMS0xLTFWNWExIDEgMCAwMTEtMWgxMmExIDEgMCAwMTEgMXY2YTEgMSAwIDAxLTEgMWgtMnoiLz48cGF0aCBkPSJNMyA4aDEwdjFIM3ptOC0yaDJ2MWgtMnoiLz48L2c+PC9zdmc+)}.ce-contextmenu-image{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSLlm77lsYJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4PSIwIiB5PSIwIiB2aWV3Qm94PSIwIDAgMTYgMTYiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxzdHlsZT4uc3Qwe2ZpbGw6IzNkNDc1N308L3N0eWxlPjxnIGlkPSJfeDMwXzAt5YWs5YWxX3gyRl8wMuW3peWFt+agj194MkZf5o+S5YWl5Zu+54mHLTE2cHgtIj48ZyBpZD0iR3JvdXAtMTkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEgMSkiPjxwYXRoIGlkPSJDb21iaW5lZC1TaGFwZSIgY2xhc3M9InN0MCIgZD0iTTEgMGgxMmMuNiAwIDEgLjQgMSAxdjExYzAgLjYtLjQgMS0xIDFIMWMtLjYgMC0xLS40LTEtMVYxYzAtLjYuNC0xIDEtMXptMCAxdjExaDEyVjFIMXoiLz48Y2lyY2xlIGlkPSLmpK3lnIblvaIiIGNsYXNzPSJzdDAiIGN4PSIxMCIgY3k9IjQiIHI9IjEiLz48cGF0aCBpZD0iUGF0aCIgY2xhc3M9InN0MCIgZD0iTTguNSAxMS4ybC00LTQuMUwxIDEwLjdWOS4yYzEuNy0xLjYgMi43LTIuNSAzLTIuOC40LS41LjctLjQgMSAwTDguNSAxMCAxMSA3LjNjLjQtLjUuNi0uNSAxLS4xbDIgMi44djEuNWwtMi41LTMuNC0zIDMuMXoiLz48L2c+PC9nPjwvc3ZnPg==)}.ce-contextmenu-image-change{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyIDQpIiBmaWxsPSIjM0Q0NzU3Ij48Y2lyY2xlIGZpbGwtcnVsZT0ibm9uemVybyIgY3g9IjMiIGN5PSIxIiByPSIxIi8+PHBhdGggZD0iTTcuNDczIDguMjIzTDMuNDcgNC4xMDcgMCA3LjY2N3YtMS41QzEuNzE1IDQuNiAyLjcwNyAzLjY2NCAyLjk3NSAzLjM1OGMuNDAyLS40NTcuNjUxLS4zOSAxLjA0MiAwTDcuNDczIDcgOS45NiA0LjM0OWMuNDE0LS40NjIuNjItLjQ2MiAxLjAxMS0uMDcxTDEzIDcuMDZ2MS41bC0yLjUxLTMuNDEtMy4wMTcgMy4wNzJ6Ii8+PC9nPjxwYXRoIGQ9Ik02IDEuNUgxLjV2MTJoMTN2LTRWMTNhLjUuNSAwIDAxLS41LjVIMmEuNS41IDAgMDEtLjUtLjVWMmEuNS41IDAgMDEuNS0uNWg0em04LjUgOFY2bC0uNS41aDFsLS41LS41djMuNXpNNiAxLjVoNEw5LjUgMXYxbC41LS41SDZ6IiBzdHJva2U9IiMzRDQ3NTciLz48cGF0aCBkPSJNMTMuMDg1IDEuMzE2bC0zLjgxNCA0YTEgMSAwIDAwMS40NTggMS4zNjhsMy44MTUtNGExIDEgMCAxMC0xLjQ1OS0xLjM2OHoiIGZpbGw9IiMzRDQ3NTciIGZpbGwtcnVsZT0ibm9uemVybyIvPjwvZz48L3N2Zz4=)}.ce-contextmenu-insert-row-col{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBzdHJva2U9IiMzRDQ3NTciIGQ9Ik04LjUgNS41aDZ2NGgtNnoiLz48cGF0aCBmaWxsPSIjM0Q0NzU3IiBkPSJNNCA3djFoMlY3em0tMyAuNUw0IDV2NXpNMSAxaDEydjFIMXptMCAxMmgxMnYxSDF6Ii8+PC9nPjwvc3ZnPg==)}.ce-contextmenu-insert-top-row{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBmaWxsPSIjM0Q0NzU3IiBkPSJNOCA1SDd2M2gxem0tLjUtM0wxMCA1SDV6Ii8+PHJlY3Qgc3Ryb2tlPSIjM0Q0NzU3IiB4PSIxLjUiIHk9IjEwLjUiIHdpZHRoPSIxMiIgaGVpZ2h0PSIzIiByeD0iMSIvPjwvZz48L3N2Zz4=)}.ce-contextmenu-insert-bottom-row{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBmaWxsPSIjM0Q0NzU3IiBkPSJNNyAxMWgxVjhIN3ptLjUgM0w1IDExaDV6Ii8+PHJlY3Qgc3Ryb2tlPSIjM0Q0NzU3IiB4PSIxLjUiIHk9IjIuNSIgd2lkdGg9IjEyIiBoZWlnaHQ9IjMiIHJ4PSIxIi8+PC9nPjwvc3ZnPg==)}.ce-contextmenu-insert-left-col{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBmaWxsPSIjM0Q0NzU3IiBkPSJNMTEgN3YxaDNWN3ptLTMgLjVMMTEgNXY1eiIvPjxyZWN0IHN0cm9rZT0iIzNENDc1NyIgdHJhbnNmb3JtPSJyb3RhdGUoOTAgNCA3LjUpIiB4PSItMiIgeT0iNiIgd2lkdGg9IjEyIiBoZWlnaHQ9IjMiIHJ4PSIxIi8+PC9nPjwvc3ZnPg==)}.ce-contextmenu-insert-right-col{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBmaWxsPSIjM0Q0NzU3IiBkPSJNNSA4VjdIMnYxem0zLS41TDUgMTBWNXoiLz48cmVjdCBzdHJva2U9IiMzRDQ3NTciIHRyYW5zZm9ybT0icm90YXRlKDkwIDEyIDcuNSkiIHg9IjYiIHk9IjYiIHdpZHRoPSIxMiIgaGVpZ2h0PSIzIiByeD0iMSIvPjwvZz48L3N2Zz4=)}.ce-contextmenu-delete-row-col{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBzdHJva2U9IiM5MjlBQTgiIGQ9Ik04LjUgNi41aDZ2MmgtNnoiLz48cGF0aCBmaWxsPSIjM0Q0NzU3IiBkPSJNMiAxMmgxMXYxSDJ6TTIgMmgxMXYxSDJ6bS42MyAzTDcgOS4zNWwtLjYzNS42NUwyIDUuNjN6Ii8+PHBhdGggZmlsbD0iIzNENDc1NyIgZD0iTTIgOS4zNjNMNi4zNTUgNSA3IDUuNzA3IDIuNjk1IDEweiIvPjwvZz48L3N2Zz4=)}.ce-contextmenu-delete-row{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBzdHJva2U9IiM5MjlBQTgiIGQ9Ik04LjUgNS41aDZ2NGgtNnoiLz48cGF0aCBmaWxsPSIjM0Q0NzU3IiBkPSJNMSAxM2gxMnYxSDF6TTEgMWgxMnYxSDF6bTAgNGgxdjFIMXptMSAxaDF2MUgyem0xIDFoMXYxSDN6bTEtMWgxdjFINHptMS0xaDF2MUg1ek00IDhoMXYxSDR6TTIgOGgxdjFIMnptMyAxaDF2MUg1ek0xIDloMXYxSDF6Ii8+PC9nPjwvc3ZnPg==)}.ce-contextmenu-delete-col{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBzdHJva2U9IiM5MjlBQTgiIGQ9Ik01LjUgNy41di02aDR2NnoiLz48cGF0aCBmaWxsPSIjM0Q0NzU3IiBkPSJNMTMgMTVWM2gxdjEyek0xIDE1VjNoMXYxMnptNCAwdi0xaDF2MXptMS0xdi0xaDF2MXptMS0xdi0xaDF2MXptLTEtMXYtMWgxdjF6bS0xLTF2LTFoMXYxem0zIDF2LTFoMXYxem0wIDJ2LTFoMXYxem0xLTN2LTFoMXYxem0wIDR2LTFoMXYxeiIvPjwvZz48L3N2Zz4=)}.ce-contextmenu-delete-table{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0iIzNENDc1NyIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMTQgMTNoLTF2LTNIMnYzSDF2LTNhMSAxIDAgMDExLTFoMTFhMSAxIDAgMDExIDF2M3oiIGZpbGwtcnVsZT0ibm9uemVybyIvPjxwYXRoIGQ9Ik01LjYyNSAyTDEwIDYuMzc1IDkuMzc1IDcgNSAyLjYyNXoiLz48cGF0aCBkPSJNNSA2LjM3NUw5LjM3NSAybC42MjUuNjI1TDUuNjI1IDd6Ii8+PC9nPjwvc3ZnPg==)}.ce-contextmenu-merge-cell{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0iIzNENDc1NyIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNNiAxdjFIMnYxMWg0djFIMmExIDEgMCAwMS0xLTFWMmExIDEgMCAwMTEtMWg0em0zIDBoNGExIDEgMCAwMTEgMXYxMWExIDEgMCAwMS0xIDFIOXYtMWg0VjJIOVYxeiIvPjxwYXRoIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTYgMWgxdjRINnptMiAwaDF2NEg4eiIvPjxwYXRoIGQ9Ik04IDcuNUwxMCA2djN6bS0xIDBMNSA2djN6Ii8+PHBhdGggZD0iTTkgN2gzdjFIOXpNMyA3aDN2MUgzeiIvPjxwYXRoIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTggMTBoMXY0SDh6bS0yIDBoMXY0SDZ6Ii8+PC9nPjwvc3ZnPg==)}.ce-contextmenu-merge-cancel-cell{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0iIzNENDc1NyIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNNiAxdjFIMnYxMWg0djFIMmExIDEgMCAwMS0xLTFWMmExIDEgMCAwMTEtMWg0em0zIDBoNGExIDEgMCAwMTEgMXYxMWExIDEgMCAwMS0xIDFIOXYtMWg0VjJIOVYxeiIvPjxwYXRoIGZpbGwtcnVsZT0ibm9uemVybyIgZD0iTTYgMWgxdjRINnptMiAwaDF2NEg4eiIvPjxwYXRoIGQ9Ik0zIDcuNUw1IDZ2M3ptOSAwTDEwIDZ2M3oiLz48cGF0aCBkPSJNNCA3aDN2MUg0em00IDBoM3YxSDh6Ii8+PHBhdGggZmlsbC1ydWxlPSJub256ZXJvIiBkPSJNOCAxMGgxdjRIOHptLTIgMGgxdjRINnoiLz48L2c+PC9zdmc+)}.ce-contextmenu-vertical-align{background-image:url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjE2IiB2aWV3Qm94PSIwIDAgMTYgMTYiIHdpZHRoPSIxNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMiAxM2gxMnYxSDJ6bTAtM2g4djFIMnptMC0zaDEydjFIMnptMC02aDEydjFIMnptMCAzaDh2MUgyeiIgZmlsbD0iIzNkNDc1NyIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+)}.ce-contextmenu-vertical-align-top{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTggOEg3djZoMXptLS41LTNMMTAgOEg1ek0yIDNoMTF2MUgyeiIgZmlsbD0iIzNENDc1NyIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+)}.ce-contextmenu-vertical-align-middle{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNOCAxMkg3djNoMXptLS41LTNsMi41IDNINXpNNyAzaDFWMEg3em0uNSAzTDUgM2g1ek0yIDdoMTF2MUgyeiIgZmlsbD0iIzNENDc1NyIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+)}.ce-contextmenu-vertical-align-bottom{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTcgOWgxVjNIN3ptLjUgM0w1IDloNXpNMiAxM2gxMXYxSDJ6IiBmaWxsPSIjM0Q0NzU3IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=)}.ce-contextmenu-border-all{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTIuNSAzYS41LjUgMCAwMS41LS41aDExYS41LjUgMCAwMS41LjV2MTFhLjUuNSAwIDAxLS41LjVIM2EuNS41IDAgMDEtLjUtLjVWM3oiIHN0cm9rZT0iIzNENDc1NyIvPjxwYXRoIGZpbGw9IiMzRDQ3NTciIGQ9Ik0zIDhoMTF2MUgzeiIvPjxwYXRoIGZpbGw9IiMzRDQ3NTciIGQ9Ik05IDN2MTFIOFYzeiIvPjwvc3ZnPg==)}.ce-contextmenu-border-empty{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMyAzaC0xVjJoMWExIDEgMCAwMTEgMXYxaC0xVjN6bS0zLTF2MUg4LjV2MmgtMVYzSDZWMmg0ek00IDJ2MUgzdjFIMlYzYTEgMSAwIDAxMS0xaDF6TTIgNmgxdjEuNWgydjFIM1YxMEgyVjZ6bTAgNmgxdjFoMXYxSDNhMSAxIDAgMDEtMS0xdi0xem00IDJ2LTFoMS41di0yaDF2MkgxMHYxSDZ6bTYgMHYtMWgxdi0xaDF2MWExIDEgMCAwMS0xIDFoLTF6bTItNGgtMVY4LjVoLTJ2LTFoMlY2aDF2NHpNOC41IDcuNXYtMWgtMXYxaC0xdjFoMXYxaDF2LTFoMXYtMWgtMXoiIGZpbGw9IiNBQUFDQjAiLz48L3N2Zz4=)}.ce-contextmenu-border-external{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTIuNSAzYS41LjUgMCAwMS41LS41aDExYS41LjUgMCAwMS41LjV2MTFhLjUuNSAwIDAxLS41LjVIM2EuNS41IDAgMDEtLjUtLjVWM3oiIHN0cm9rZT0iIzNENDc1NyIvPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNOSA1VjNIOHYyaDF6bTAgOXYtMkg4djJoMXpNNSA4SDN2MWgyVjh6bTkgMGgtMnYxaDJWOHpNOSA3djFoMXYxSDl2MUg4VjlIN1Y4aDFWN2gxeiIgZmlsbD0iI0FBQUNCMCIvPjwvc3ZnPg==)}.ce-contextmenu-border-td{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTIuNSAzYS41LjUgMCAwMS41LS41aDExYS41LjUgMCAwMS41LjV2MTFhLjUuNSAwIDAxLS41LjVIM2EuNS41IDAgMDEtLjUtLjVWM3oiIHN0cm9rZT0iI0FBQUNCMCIvPjxwYXRoIHN0cm9rZT0iIzNENDc1NyIgZD0iTTguNSAyLjUgdjYgaC02Ii8+PC9zdmc+)}.ce-contextmenu-border-td-top{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTIuNSAzYS41LjUgMCAwMS41LS41aDExYS41LjUgMCAwMS41LjV2MTFhLjUuNSAwIDAxLS41LjVIM2EuNS41IDAgMDEtLjUtLjVWM3oiIHN0cm9rZT0iI0FBQUNCMCIvPjxwYXRoIHN0cm9rZT0iIzNENDc1NyIgc3Ryb2tlLXdpZHRoPSIyIiBkPSJNMi41IDMgaDEyIi8+PC9zdmc+)}.ce-contextmenu-border-td-left{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTIuNSAzYS41LjUgMCAwMS41LS41aDExYS41LjUgMCAwMS41LjV2MTFhLjUuNSAwIDAxLS41LjVIM2EuNS41IDAgMDEtLjUtLjVWM3oiIHN0cm9rZT0iI0FBQUNCMCIvPjxwYXRoIHN0cm9rZT0iIzNENDc1NyIgc3Ryb2tlLXdpZHRoPSIyIiBkPSJNMyAzIHYxMSIvPjwvc3ZnPg==)}.ce-contextmenu-border-td-bottom{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTIuNSAzYS41LjUgMCAwMS41LS41aDExYS41LjUgMCAwMS41LjV2MTFhLjUuNSAwIDAxLS41LjVIM2EuNS41IDAgMDEtLjUtLjVWM3oiIHN0cm9rZT0iI0FBQUNCMCIvPjxwYXRoIHN0cm9rZT0iIzNENDc1NyIgc3Ryb2tlLXdpZHRoPSIyIiBkPSJNMi41IDE0IGgxMiIvPjwvc3ZnPg==)}.ce-contextmenu-border-td-right{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTIuNSAzYS41LjUgMCAwMS41LS41aDExYS41LjUgMCAwMS41LjV2MTFhLjUuNSAwIDAxLS41LjVIM2EuNS41IDAgMDEtLjUtLjVWM3oiIHN0cm9rZT0iI0FBQUNCMCIvPjxwYXRoIHN0cm9rZT0iIzNENDc1NyIgc3Ryb2tlLXdpZHRoPSIyIiBkPSJNMTQgMyB2MTEiLz48L3N2Zz4=)}.ce-contextmenu-border-td-forward{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTIuNSAzYS41LjUgMCAwMS41LS41aDExYS41LjUgMCAwMS41LjV2MTFhLjUuNSAwIDAxLS41LjVIM2EuNS41IDAgMDEtLjUtLjVWM3oiIHN0cm9rZT0iI0FBQUNCMCIgLz48cGF0aCBzdHJva2U9IiMzRDQ3NTciIGQ9Ik0xNCAzIGwtMTEgMTEiIC8+PC9zdmc+)}.ce-contextmenu-border-td-back{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTIuNSAzYS41LjUgMCAwMS41LS41aDExYS41LjUgMCAwMS41LjV2MTFhLjUuNSAwIDAxLS41LjVIM2EuNS41IDAgMDEtLjUtLjVWM3oiIHN0cm9rZT0iI0FBQUNCMCIgLz48cGF0aCBzdHJva2U9IiMzRDQ3NTciIGQ9Ik0zIDMgbDExIDExIiAvPjwvc3ZnPg==)}.ce-hyperlink-popup{background:#fff;box-shadow:0 2px 12px #626b8433;border-radius:2px;color:#3d4757;padding:12px 16px;position:absolute;z-index:1;text-align:center;display:none}.ce-hyperlink-popup a{min-width:100px;max-width:300px;font-size:12px;display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;text-decoration:none;border-bottom-width:1px;border-bottom-style:solid;color:#00f}.ce-zone-indicator>div{padding:3px 6px;color:#000;font-size:12px;background:rgb(218 231 252);position:absolute;transform-origin:0 0}.ce-zone-indicator-border__top,.ce-zone-indicator-border__bottom,.ce-zone-indicator-border__left,.ce-zone-indicator-border__right{display:block;position:absolute;z-index:0}.ce-zone-indicator-border__top{border-top:2px dashed rgb(238,238,238)}.ce-zone-indicator-border__bottom{border-top:2px dashed rgb(238,238,238);width:100%}.ce-zone-indicator-border__left{border-left:2px dashed rgb(238,238,238)}.ce-zone-indicator-border__right{border-right:2px dashed rgb(238,238,238)}.ce-zone-tip{display:none;align-items:center;height:30px;white-space:nowrap;position:fixed;opacity:.9;background-color:#000;padding:0 5px;border-radius:4px;z-index:9;transition:all .3s;outline:none;user-select:none;pointer-events:none;transform:translate(10px,10px)}.ce-zone-tip.show{display:flex}.ce-zone-tip span{color:#fff;font-size:12px}.ce-inputarea{width:100px;height:30px;min-width:0;min-height:0;margin:0;padding:0;left:0;right:0;letter-spacing:0;font-size:12px;position:absolute;z-index:-1;outline:none;resize:none;border:none;overflow:hidden;color:transparent;user-select:none;caret-color:transparent;background-color:transparent}.ce-cursor{width:1px;height:20px;left:0;right:0;position:absolute;outline:none;background-color:#000;pointer-events:none}.ce-cursor.ce-cursor--animation{animation-duration:1s;animation-iteration-count:infinite;animation-name:cursorAnimation}@keyframes cursorAnimation{0%{opacity:1}13%{opacity:0}50%{opacity:0}63%{opacity:1}to{opacity:1}}.ce-float-image{position:absolute;opacity:.5;pointer-events:none}')),document.head.appendChild(e)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}})();})();
 var __defProp = Object.defineProperty;
 var __defProps = Object.defineProperties;
 var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
@@ -23,7 +23,7 @@ var __publicField = (obj, key, value) => {
   return value;
 };
 var index = "";
-const version = "0.9.91";
+const version = "0.9.93";
 var MaxHeightRatio;
 (function(MaxHeightRatio2) {
   MaxHeightRatio2["HALF"] = "half";
@@ -39,6 +39,7 @@ var ImageDisplay;
 (function(ImageDisplay2) {
   ImageDisplay2["INLINE"] = "inline";
   ImageDisplay2["BLOCK"] = "block";
+  ImageDisplay2["SURROUND"] = "surround";
   ImageDisplay2["FLOAT_TOP"] = "float-top";
   ImageDisplay2["FLOAT_BOTTOM"] = "float-bottom";
 })(ImageDisplay || (ImageDisplay = {}));
@@ -369,6 +370,20 @@ function isObjectEqual(obj1, obj2) {
   }
   return !obj1Keys.some((key) => obj2[key] !== obj1[key]);
 }
+function isRectIntersect(rect1, rect2) {
+  const rect1Left = rect1.x;
+  const rect1Right = rect1.x + rect1.width;
+  const rect1Top = rect1.y;
+  const rect1Bottom = rect1.y + rect1.height;
+  const rect2Left = rect2.x;
+  const rect2Right = rect2.x + rect2.width;
+  const rect2Top = rect2.y;
+  const rect2Bottom = rect2.y + rect2.height;
+  if (rect1Left > rect2Right || rect1Right < rect2Left || rect1Top > rect2Bottom || rect1Bottom < rect2Top) {
+    return false;
+  }
+  return true;
+}
 const CURSOR_AGENT_OFFSET_HEIGHT = 12;
 const defaultCursorOption = {
   width: 1,
@@ -477,6 +492,8 @@ const EDITOR_ELEMENT_ZIP_ATTR = [
 ];
 const TABLE_TD_ZIP_ATTR = [
   "conceptId",
+  "extension",
+  "externalId",
   "verticalAlign",
   "backgroundColor",
   "borderTypes",
@@ -4356,10 +4373,11 @@ function formatElementContext(sourceElementList, formatElementList2, anchorIndex
   let copyElement = getAnchorElement(sourceElementList, anchorIndex);
   if (!copyElement)
     return;
-  if ((_a = copyElement.title) == null ? void 0 : _a.disabled) {
+  const { isBreakWhenWrap = false, editorOptions } = options || {};
+  const { mode } = editorOptions || {};
+  if (mode !== EditorMode.DESIGN && ((_a = copyElement.title) == null ? void 0 : _a.disabled)) {
     copyElement = omitObject(copyElement, TITLE_CONTEXT_ATTR);
   }
-  const { isBreakWhenWrap = false } = options || {};
   let isBreakWarped = false;
   for (let e = 0; e < formatElementList2.length; e++) {
     const targetElement = formatElementList2[e];
@@ -4375,7 +4393,7 @@ function formatElementContext(sourceElementList, formatElementList2, anchorIndex
       continue;
     }
     if ((_c = targetElement.valueList) == null ? void 0 : _c.length) {
-      formatElementContext(sourceElementList, targetElement.valueList, anchorIndex);
+      formatElementContext(sourceElementList, targetElement.valueList, anchorIndex, options);
     }
     const cloneAttr = [...EDITOR_ELEMENT_CONTEXT_ATTR];
     if (!getIsBlockElement(targetElement)) {
@@ -4931,6 +4949,25 @@ function replaceHTMLElementTag(oldDom, tagName) {
   newDom.innerHTML = oldDom.innerHTML;
   return newDom;
 }
+function pickSurroundElementList(elementList) {
+  const surroundElementList = [];
+  for (let e = 0; e < elementList.length; e++) {
+    const element = elementList[e];
+    if (element.imgDisplay === ImageDisplay.SURROUND) {
+      surroundElementList.push(element);
+    }
+  }
+  return surroundElementList;
+}
+function deleteSurroundElementList(elementList, pageNo) {
+  var _a;
+  for (let s = elementList.length - 1; s >= 0; s--) {
+    const surroundElement = elementList[s];
+    if (((_a = surroundElement.imgFloatPosition) == null ? void 0 : _a.pageNo) === pageNo) {
+      elementList.splice(s, 1);
+    }
+  }
+}
 function setClipboardData(data2) {
   localStorage.setItem(EDITOR_CLIPBOARD, JSON.stringify({
     text: data2.text,
@@ -5028,7 +5065,8 @@ function pasteElement(host, elementList) {
       }
     }
     formatElementContext(originalElementList, elementList, startIndex, {
-      isBreakWhenWrap: true
+      isBreakWhenWrap: true,
+      editorOptions: draw.getOptions()
     });
   }
   draw.insertElementList(elementList);
@@ -5063,7 +5101,9 @@ function pasteImage(host, file) {
         height: image.height
       };
       if (~startIndex) {
-        formatElementContext(elementList, [imageElement], startIndex);
+        formatElementContext(elementList, [imageElement], startIndex, {
+          editorOptions: draw.getOptions()
+        });
       }
       draw.insertElementList([imageElement]);
     };
@@ -5391,6 +5431,7 @@ var EditorMode;
   EditorMode2["READONLY"] = "readonly";
   EditorMode2["FORM"] = "form";
   EditorMode2["PRINT"] = "print";
+  EditorMode2["DESIGN"] = "design";
 })(EditorMode || (EditorMode = {}));
 var EditorZone;
 (function(EditorZone2) {
@@ -5595,7 +5636,10 @@ class CheckboxControl {
       nextIndex++;
     }
     control.code = codes.join(",");
-    this.control.repaintControl();
+    this.control.repaintControl({
+      curIndex: startIndex,
+      isSetCursor: false
+    });
   }
   keydown(evt) {
     if (this.control.getIsDisabledControl()) {
@@ -5647,7 +5691,10 @@ class RadioControl extends CheckboxControl {
       nextIndex++;
     }
     control.code = codes.join(",");
-    this.control.repaintControl();
+    this.control.repaintControl({
+      curIndex: startIndex,
+      isSetCursor: false
+    });
   }
 }
 function setRangeCache(host) {
@@ -5800,7 +5847,7 @@ function mousedown(evt, host) {
       isShow: false
     });
     setRangeCache(host);
-    if (curElement.imgDisplay === ImageDisplay.FLOAT_TOP || curElement.imgDisplay === ImageDisplay.FLOAT_BOTTOM) {
+    if (curElement.imgDisplay === ImageDisplay.SURROUND || curElement.imgDisplay === ImageDisplay.FLOAT_TOP || curElement.imgDisplay === ImageDisplay.FLOAT_BOTTOM) {
       draw.getImageParticle().createFloatImage(curElement);
     }
   }
@@ -5834,13 +5881,14 @@ function getElementIndexByDragId(dragId, elementList) {
 }
 function moveImgPosition(element, evt, host) {
   const draw = host.getDraw();
-  if (element.imgDisplay === ImageDisplay.FLOAT_TOP || element.imgDisplay === ImageDisplay.FLOAT_BOTTOM) {
+  if (element.imgDisplay === ImageDisplay.SURROUND || element.imgDisplay === ImageDisplay.FLOAT_TOP || element.imgDisplay === ImageDisplay.FLOAT_BOTTOM) {
     const moveX = evt.offsetX - host.mouseDownStartPosition.x;
     const moveY = evt.offsetY - host.mouseDownStartPosition.y;
     const imgFloatPosition = element.imgFloatPosition;
     element.imgFloatPosition = {
       x: imgFloatPosition.x + moveX,
-      y: imgFloatPosition.y + moveY
+      y: imgFloatPosition.y + moveY,
+      pageNo: draw.getPageNo()
     };
   }
   draw.getImageParticle().destroyFloatImage();
@@ -5867,24 +5915,26 @@ function mouseup(evt, host) {
     if (range.startIndex >= cacheStartIndex && range.endIndex <= cacheEndIndex && ((_a = host.cachePositionContext) == null ? void 0 : _a.tdId) === positionContext.tdId) {
       draw.clearSideEffect();
       let isSubmitHistory = false;
+      let isCompute = false;
       if (isCacheRangeCollapsed) {
         const dragElement = cacheElementList[cacheEndIndex];
         if (dragElement.type === ElementType.IMAGE || dragElement.type === ElementType.LATEX) {
           moveImgPosition(dragElement, evt, host);
-          if (dragElement.imgDisplay === ImageDisplay.FLOAT_TOP || dragElement.imgDisplay === ImageDisplay.FLOAT_BOTTOM) {
+          if (dragElement.imgDisplay === ImageDisplay.SURROUND || dragElement.imgDisplay === ImageDisplay.FLOAT_TOP || dragElement.imgDisplay === ImageDisplay.FLOAT_BOTTOM) {
             draw.getPreviewer().drawResizer(dragElement);
             isSubmitHistory = true;
           } else {
             const cachePosition = cachePositionList[cacheEndIndex];
             draw.getPreviewer().drawResizer(dragElement, cachePosition);
           }
+          isCompute = dragElement.imgDisplay === ImageDisplay.SURROUND;
         }
       }
       rangeManager.replaceRange(__spreadValues({}, cacheRange));
       draw.render({
-        isSetCursor: false,
-        isCompute: false,
-        isSubmitHistory
+        isCompute,
+        isSubmitHistory,
+        isSetCursor: false
       });
       return;
     }
@@ -5935,7 +5985,9 @@ function mouseup(evt, host) {
         return newElement;
       }
     });
-    formatElementContext(elementList, replaceElementList, range.startIndex);
+    formatElementContext(elementList, replaceElementList, range.startIndex, {
+      editorOptions: draw.getOptions()
+    });
     const cacheStartElement = cacheElementList[cacheStartIndex];
     const cacheStartPosition = cachePositionList[cacheStartIndex];
     const cacheRangeStartId = createDragId(cacheElementList[cacheStartIndex]);
@@ -6004,7 +6056,7 @@ function mouseup(evt, host) {
       isSetCursor: false
     });
     if (imgElement) {
-      if (imgElement.imgDisplay === ImageDisplay.FLOAT_TOP || imgElement.imgDisplay === ImageDisplay.FLOAT_BOTTOM) {
+      if (imgElement.imgDisplay === ImageDisplay.SURROUND || imgElement.imgDisplay === ImageDisplay.FLOAT_TOP || imgElement.imgDisplay === ImageDisplay.FLOAT_BOTTOM) {
         draw.getPreviewer().drawResizer(imgElement);
       } else {
         const dragPositionList = position.getPositionList();
@@ -6042,7 +6094,7 @@ function mousemove(evt, host) {
     const cacheStartIndex = (_a = host.cacheRange) == null ? void 0 : _a.startIndex;
     if (cacheStartIndex) {
       const dragElement = host.cacheElementList[cacheStartIndex];
-      if ((dragElement == null ? void 0 : dragElement.type) === ElementType.IMAGE && (dragElement.imgDisplay === ImageDisplay.FLOAT_TOP || dragElement.imgDisplay === ImageDisplay.FLOAT_BOTTOM)) {
+      if ((dragElement == null ? void 0 : dragElement.type) === ElementType.IMAGE && (dragElement.imgDisplay === ImageDisplay.SURROUND || dragElement.imgDisplay === ImageDisplay.FLOAT_TOP || dragElement.imgDisplay === ImageDisplay.FLOAT_BOTTOM)) {
         draw.getPreviewer().clearResizer();
         draw.getImageParticle().dragFloatImage(evt.movementX, evt.movementY);
       }
@@ -6264,7 +6316,8 @@ function enter(evt, host) {
     enterText.listWrap = true;
   }
   formatElementContext(elementList, [enterText], startIndex, {
-    isBreakWhenWrap: true
+    isBreakWhenWrap: true,
+    editorOptions: draw.getOptions()
   });
   if (!(endElement.titleId && endElement.titleId !== ((_b = elementList[endIndex + 1]) == null ? void 0 : _b.titleId))) {
     const copyElement = getAnchorElement(elementList, endIndex);
@@ -6604,7 +6657,9 @@ function tab(evt, host) {
     const rangeManager = draw.getRange();
     const { startIndex } = rangeManager.getRange();
     const elementList = draw.getElementList();
-    formatElementContext(elementList, [tabElement], startIndex);
+    formatElementContext(elementList, [tabElement], startIndex, {
+      editorOptions: draw.getOptions()
+    });
     draw.insertElementList([tabElement]);
   }
 }
@@ -6980,12 +7035,13 @@ function input(data2, host) {
   const copyElement = getAnchorElement(elementList, endIndex);
   if (!copyElement)
     return;
+  const isDesignMode = draw.isDesignMode();
   const inputData = splitText(text).map((value) => {
     var _a2, _b;
     const newElement = {
       value
     };
-    if (!((_a2 = copyElement.title) == null ? void 0 : _a2.disabled) && !((_b = copyElement.control) == null ? void 0 : _b.disabled)) {
+    if (isDesignMode || !((_a2 = copyElement.title) == null ? void 0 : _a2.disabled) && !((_b = copyElement.control) == null ? void 0 : _b.disabled)) {
       const nextElement = elementList[endIndex + 1];
       if (!copyElement.type || copyElement.type === TEXT || copyElement.type === HYPERLINK && (nextElement == null ? void 0 : nextElement.type) === HYPERLINK || copyElement.type === DATE && (nextElement == null ? void 0 : nextElement.type) === DATE || copyElement.type === SUBSCRIPT && (nextElement == null ? void 0 : nextElement.type) === SUBSCRIPT || copyElement.type === SUPERSCRIPT && (nextElement == null ? void 0 : nextElement.type) === SUPERSCRIPT) {
         EDITOR_ELEMENT_COPY_ATTR.forEach((attr) => {
@@ -7012,7 +7068,9 @@ function input(data2, host) {
     if (startIndex !== endIndex) {
       draw.spliceElementList(elementList, start, endIndex - startIndex);
     }
-    formatElementContext(elementList, inputData, startIndex);
+    formatElementContext(elementList, inputData, startIndex, {
+      editorOptions: draw.getOptions()
+    });
     draw.spliceElementList(elementList, start, 0, ...inputData);
     curIndex = startIndex + inputData.length;
   }
@@ -7546,6 +7604,7 @@ class GlobalEvent {
     __publicField(this, "hyperlinkParticle");
     __publicField(this, "control");
     __publicField(this, "dateParticle");
+    __publicField(this, "imageParticle");
     __publicField(this, "dprMediaQueryList");
     __publicField(this, "clearSideEffect", (evt) => {
       if (!this.cursor)
@@ -7570,6 +7629,7 @@ class GlobalEvent {
       this.hyperlinkParticle.clearHyperlinkPopup();
       this.control.destroyControl();
       this.dateParticle.clearDatePicker();
+      this.imageParticle.destroyFloatImage();
     });
     __publicField(this, "setCanvasEventAbility", () => {
       this.canvasEvent.setIsAllowDrag(false);
@@ -7620,6 +7680,7 @@ class GlobalEvent {
     this.tableTool = draw.getTableTool();
     this.hyperlinkParticle = draw.getHyperlinkParticle();
     this.dateParticle = draw.getDateParticle();
+    this.imageParticle = draw.getImageParticle();
     this.control = draw.getControl();
     this.dprMediaQueryList = window.matchMedia(`(resolution: ${window.devicePixelRatio}dppx)`);
   }
@@ -7715,6 +7776,7 @@ class Position {
     __publicField(this, "positionList");
     __publicField(this, "floatPositionList");
     __publicField(this, "draw");
+    __publicField(this, "eventBus");
     __publicField(this, "options");
     this.positionList = [];
     this.floatPositionList = [];
@@ -7724,6 +7786,7 @@ class Position {
       isControl: false
     };
     this.draw = draw;
+    this.eventBus = draw.getEventBus();
     this.options = draw.getOptions();
   }
   getFloatPositionList() {
@@ -7775,11 +7838,13 @@ class Position {
     let index2 = startIndex;
     for (let i = 0; i < rowList.length; i++) {
       const curRow = rowList[i];
-      const curRowWidth = curRow.width + (curRow.offsetX || 0);
-      if (curRow.rowFlex === RowFlex.CENTER) {
-        x += (innerWidth - curRowWidth) / 2;
-      } else if (curRow.rowFlex === RowFlex.RIGHT) {
-        x += innerWidth - curRowWidth;
+      if (!curRow.isSurround) {
+        const curRowWidth = curRow.width + (curRow.offsetX || 0);
+        if (curRow.rowFlex === RowFlex.CENTER) {
+          x += (innerWidth - curRowWidth) / 2;
+        } else if (curRow.rowFlex === RowFlex.RIGHT) {
+          x += innerWidth - curRowWidth;
+        }
       }
       x += curRow.offsetX || 0;
       const tablePreX = x;
@@ -7810,7 +7875,7 @@ class Position {
             rightBottom: [x + metrics.width, y + curRow.height]
           }
         };
-        if (element.imgDisplay === ImageDisplay.FLOAT_TOP || element.imgDisplay === ImageDisplay.FLOAT_BOTTOM) {
+        if (element.imgDisplay === ImageDisplay.SURROUND || element.imgDisplay === ImageDisplay.FLOAT_TOP || element.imgDisplay === ImageDisplay.FLOAT_BOTTOM) {
           const prePosition = positionList[positionList.length - 1];
           if (prePosition) {
             positionItem.metrics = prePosition.metrics;
@@ -7819,7 +7884,8 @@ class Position {
           if (!element.imgFloatPosition) {
             element.imgFloatPosition = {
               x,
-              y
+              y,
+              pageNo
             };
           }
           this.floatPositionList.push({
@@ -7940,6 +8006,10 @@ class Position {
     return this.positionContext;
   }
   setPositionContext(payload) {
+    this.eventBus.emit("positionContextChange", {
+      value: payload,
+      oldValue: this.positionContext
+    });
     this.positionContext = payload;
   }
   getPositionByXY(payload) {
@@ -7958,7 +8028,7 @@ class Position {
     const positionNo = isMainActive ? curPageNo : 0;
     if (!isTable) {
       const floatTopPosition = this.getFloatPositionByXY(__spreadProps(__spreadValues({}, payload), {
-        imgDisplay: ImageDisplay.FLOAT_TOP
+        imgDisplays: [ImageDisplay.FLOAT_TOP, ImageDisplay.SURROUND]
       }));
       if (floatTopPosition)
         return floatTopPosition;
@@ -8051,7 +8121,7 @@ class Position {
     }
     if (!isTable) {
       const floatBottomPosition = this.getFloatPositionByXY(__spreadProps(__spreadValues({}, payload), {
-        imgDisplay: ImageDisplay.FLOAT_BOTTOM
+        imgDisplays: [ImageDisplay.FLOAT_BOTTOM]
       }));
       if (floatBottomPosition)
         return floatBottomPosition;
@@ -8184,7 +8254,7 @@ class Position {
     const currentZone = this.draw.getZone().getZone();
     for (let f = 0; f < this.floatPositionList.length; f++) {
       const { position, element, isTable, index: index2, trIndex, tdIndex, tdValueIndex, zone: floatElementZone, pageNo } = this.floatPositionList[f];
-      if (currentPageNo === pageNo && element.type === ElementType.IMAGE && element.imgDisplay === payload.imgDisplay && (!floatElementZone || floatElementZone === currentZone)) {
+      if (currentPageNo === pageNo && element.type === ElementType.IMAGE && element.imgDisplay && payload.imgDisplays.includes(element.imgDisplay) && (!floatElementZone || floatElementZone === currentZone)) {
         const imgFloatPosition = element.imgFloatPosition;
         if (x >= imgFloatPosition.x && x <= imgFloatPosition.x + element.width && y >= imgFloatPosition.y && y <= imgFloatPosition.y + element.height) {
           if (isTable) {
@@ -8247,6 +8317,38 @@ class Position {
     });
     return positionResult;
   }
+  setSurroundPosition(payload) {
+    var _a;
+    const { pageNo, row, rowElement, rowElementRect, surroundElementList, availableWidth } = payload;
+    let x = rowElementRect.x;
+    let rowIncreaseWidth = 0;
+    if (surroundElementList.length && !getIsBlockElement(rowElement) && !((_a = rowElement.control) == null ? void 0 : _a.minWidth)) {
+      for (let s = 0; s < surroundElementList.length; s++) {
+        const surroundElement = surroundElementList[s];
+        const floatPosition = surroundElement.imgFloatPosition;
+        if (floatPosition.pageNo !== pageNo)
+          continue;
+        const surroundRect = __spreadProps(__spreadValues({}, floatPosition), {
+          width: surroundElement.width,
+          height: surroundElement.height
+        });
+        if (isRectIntersect(rowElementRect, surroundRect)) {
+          row.isSurround = true;
+          const translateX = surroundRect.width + surroundRect.x - rowElementRect.x;
+          rowElement.left = translateX;
+          row.width += translateX;
+          rowIncreaseWidth += translateX;
+          x = surroundRect.x + surroundRect.width;
+          if (row.width + rowElement.metrics.width > availableWidth) {
+            rowElement.left = 0;
+            row.width -= rowIncreaseWidth;
+            break;
+          }
+        }
+      }
+    }
+    return { x, rowIncreaseWidth };
+  }
 }
 class RangeManager {
   constructor(draw) {
@@ -9984,6 +10086,9 @@ class TableTool {
   constructor(draw) {
     __publicField(this, "MIN_TD_WIDTH", 20);
     __publicField(this, "ROW_COL_OFFSET", 18);
+    __publicField(this, "ROW_COL_QUICK_WIDTH", 16);
+    __publicField(this, "ROW_COL_QUICK_OFFSET", 5);
+    __publicField(this, "ROW_COL_QUICK_POSITION", this.ROW_COL_OFFSET + (this.ROW_COL_OFFSET - this.ROW_COL_QUICK_WIDTH) / 2);
     __publicField(this, "BORDER_VALUE", 4);
     __publicField(this, "draw");
     __publicField(this, "canvas");
@@ -9991,6 +10096,8 @@ class TableTool {
     __publicField(this, "position");
     __publicField(this, "container");
     __publicField(this, "toolRowContainer");
+    __publicField(this, "toolRowAddBtn");
+    __publicField(this, "toolColAddBtn");
     __publicField(this, "toolColContainer");
     __publicField(this, "toolBorderContainer");
     __publicField(this, "anchorLine");
@@ -10002,6 +10109,8 @@ class TableTool {
     this.position = draw.getPosition();
     this.container = draw.getContainer();
     this.toolRowContainer = null;
+    this.toolRowAddBtn = null;
+    this.toolColAddBtn = null;
     this.toolColContainer = null;
     this.toolBorderContainer = null;
     this.anchorLine = null;
@@ -10009,11 +10118,15 @@ class TableTool {
     this.mousedownY = 0;
   }
   dispose() {
-    var _a, _b, _c;
+    var _a, _b, _c, _d, _e;
     (_a = this.toolRowContainer) == null ? void 0 : _a.remove();
-    (_b = this.toolColContainer) == null ? void 0 : _b.remove();
-    (_c = this.toolBorderContainer) == null ? void 0 : _c.remove();
+    (_b = this.toolRowAddBtn) == null ? void 0 : _b.remove();
+    (_c = this.toolColAddBtn) == null ? void 0 : _c.remove();
+    (_d = this.toolColContainer) == null ? void 0 : _d.remove();
+    (_e = this.toolBorderContainer) == null ? void 0 : _e.remove();
     this.toolRowContainer = null;
+    this.toolRowAddBtn = null;
+    this.toolColAddBtn = null;
     this.toolColContainer = null;
     this.toolBorderContainer = null;
   }
@@ -10037,6 +10150,8 @@ class TableTool {
     const td = element.trList[trIndex].tdList[tdIndex];
     const rowIndex = td.rowIndex;
     const colIndex = td.colIndex;
+    const tableHeight = element.height * scale;
+    const tableWidth = element.width * scale;
     const rowHeightList = trList.map((tr) => tr.height);
     const rowContainer = document.createElement("div");
     rowContainer.classList.add(`${EDITOR_PREFIX}-table-tool__row`);
@@ -10066,6 +10181,23 @@ class TableTool {
     rowContainer.style.top = `${tableY}px`;
     this.container.append(rowContainer);
     this.toolRowContainer = rowContainer;
+    const rowAddBtn = document.createElement("div");
+    rowAddBtn.classList.add(`${EDITOR_PREFIX}-table-tool__quick__add`);
+    rowAddBtn.style.height = `${tableHeight * scale}`;
+    rowAddBtn.style.left = `${tableX}px`;
+    rowAddBtn.style.top = `${tableY + tableHeight}px`;
+    rowAddBtn.style.transform = `translate(-${this.ROW_COL_QUICK_POSITION * scale}px, ${this.ROW_COL_QUICK_OFFSET * scale}px)`;
+    rowAddBtn.onclick = () => {
+      this.position.setPositionContext({
+        index: index2,
+        isTable: true,
+        trIndex: trList.length - 1,
+        tdIndex: 0
+      });
+      this.draw.getTableOperate().insertTableBottomRow();
+    };
+    this.container.append(rowAddBtn);
+    this.toolRowAddBtn = rowAddBtn;
     const colWidthList = colgroup.map((col) => col.width);
     const colContainer = document.createElement("div");
     colContainer.classList.add(`${EDITOR_PREFIX}-table-tool__col`);
@@ -10095,8 +10227,23 @@ class TableTool {
     colContainer.style.top = `${tableY}px`;
     this.container.append(colContainer);
     this.toolColContainer = colContainer;
-    const tableHeight = element.height * scale;
-    const tableWidth = element.width * scale;
+    const colAddBtn = document.createElement("div");
+    colAddBtn.classList.add(`${EDITOR_PREFIX}-table-tool__quick__add`);
+    colAddBtn.style.height = `${tableHeight * scale}`;
+    colAddBtn.style.left = `${tableX + tableWidth}px`;
+    colAddBtn.style.top = `${tableY}px`;
+    colAddBtn.style.transform = `translate(${this.ROW_COL_QUICK_OFFSET * scale}px, -${this.ROW_COL_QUICK_POSITION * scale}px)`;
+    colAddBtn.onclick = () => {
+      this.position.setPositionContext({
+        index: index2,
+        isTable: true,
+        trIndex: 0,
+        tdIndex: trList[0].tdList.length - 1 || 0
+      });
+      this.draw.getTableOperate().insertTableRightCol();
+    };
+    this.container.append(colAddBtn);
+    this.toolColAddBtn = colAddBtn;
     const borderContainer = document.createElement("div");
     borderContainer.classList.add(`${EDITOR_PREFIX}-table-tool__border`);
     borderContainer.style.height = `${tableHeight}px`;
@@ -10366,9 +10513,14 @@ class Header {
   }
   _computeRowList() {
     const innerWidth = this.draw.getInnerWidth();
+    const margins = this.draw.getMargins();
+    const surroundElementList = pickSurroundElementList(this.elementList);
     this.rowList = this.draw.computeRowList({
+      startX: margins[3],
+      startY: this.getHeaderTop(),
       innerWidth,
-      elementList: this.elementList
+      elementList: this.elementList,
+      surroundElementList
     });
   }
   _computePositionList() {
@@ -10701,6 +10853,8 @@ class SelectControl {
     __publicField(this, "control");
     __publicField(this, "isPopup");
     __publicField(this, "selectDom");
+    __publicField(this, "options");
+    this.options = control.getDraw().getOptions();
     this.element = element;
     this.control = control;
     this.isPopup = false;
@@ -10877,7 +11031,9 @@ class SelectControl {
         value: data2[i],
         controlComponent: ControlComponent.VALUE
       });
-      formatElementContext(elementList, [newElement], prefixIndex);
+      formatElementContext(elementList, [newElement], prefixIndex, {
+        editorOptions: this.options
+      });
       draw.spliceElementList(elementList, start + i, 0, newElement);
     }
     control.code = code;
@@ -10947,6 +11103,8 @@ class TextControl {
   constructor(element, control) {
     __publicField(this, "element");
     __publicField(this, "control");
+    __publicField(this, "options");
+    this.options = control.getDraw().getOptions();
     this.element = element;
     this.control = control;
   }
@@ -11010,7 +11168,9 @@ class TextControl {
       const newElement = __spreadProps(__spreadValues(__spreadValues({}, anchorElement), data2[i]), {
         controlComponent: ControlComponent.VALUE
       });
-      formatElementContext(elementList, [newElement], startIndex);
+      formatElementContext(elementList, [newElement], startIndex, {
+        editorOptions: this.options
+      });
       draw.spliceElementList(elementList, start + i, 0, newElement);
     }
     return start + data2.length - 1;
@@ -11568,8 +11728,10 @@ class DateControl {
     __publicField(this, "control");
     __publicField(this, "isPopup");
     __publicField(this, "datePicker");
+    __publicField(this, "options");
     const draw = control.getDraw();
     this.draw = draw;
+    this.options = draw.getOptions();
     this.element = element;
     this.control = control;
     this.isPopup = false;
@@ -11648,7 +11810,9 @@ class DateControl {
       const newElement = __spreadProps(__spreadValues(__spreadValues({}, anchorElement), data2[i]), {
         controlComponent: ControlComponent.VALUE
       });
-      formatElementContext(elementList, [newElement], startIndex);
+      formatElementContext(elementList, [newElement], startIndex, {
+        editorOptions: this.options
+      });
       draw.spliceElementList(elementList, start + i, 0, newElement);
     }
     return start + data2.length - 1;
@@ -11694,7 +11858,9 @@ class DateControl {
         value: date[i],
         controlComponent: ControlComponent.VALUE
       });
-      formatElementContext(elementList, [newElement], prefixIndex);
+      formatElementContext(elementList, [newElement], prefixIndex, {
+        editorOptions: this.options
+      });
       draw.spliceElementList(elementList, start + i, 0, newElement);
     }
     if (!context.range) {
@@ -11939,7 +12105,7 @@ class Control {
   }
   getIsDisabledControl(context = {}) {
     var _a, _b;
-    if (!this.activeControl)
+    if (this.draw.isDesignMode() || !this.activeControl)
       return false;
     const { startIndex, endIndex } = context.range || this.range.getRange();
     if (startIndex === endIndex && ~startIndex && ~endIndex) {
@@ -12056,7 +12222,7 @@ class Control {
     }
   }
   repaintControl(options = {}) {
-    const { curIndex, isCompute = true, isSubmitHistory = true } = options;
+    const { curIndex, isCompute = true, isSubmitHistory = true, isSetCursor = true } = options;
     if (curIndex === void 0) {
       this.range.clearRange();
       this.draw.render({
@@ -12069,6 +12235,7 @@ class Control {
       this.draw.render({
         curIndex,
         isCompute,
+        isSetCursor,
         isSubmitHistory
       });
     }
@@ -12146,9 +12313,11 @@ class Control {
   removeControl(startIndex, context = {}) {
     const elementList = context.elementList || this.getElementList();
     const startElement = elementList[startIndex];
-    const { deletable = true } = startElement.control;
-    if (!deletable)
-      return null;
+    if (!this.draw.isDesignMode()) {
+      const { deletable = true } = startElement.control;
+      if (!deletable)
+        return null;
+    }
     let leftIndex = -1;
     let rightIndex = -1;
     let preIndex = startIndex;
@@ -12220,7 +12389,9 @@ class Control {
         controlComponent: ControlComponent.PLACEHOLDER,
         color: this.controlOptions.placeholderColor
       });
-      formatElementContext(elementList, [newElement], startIndex);
+      formatElementContext(elementList, [newElement], startIndex, {
+        editorOptions: this.options
+      });
       this.draw.spliceElementList(elementList, startIndex + p + 1, 0, newElement);
     }
   }
@@ -12972,7 +13143,7 @@ function WorkerWrapper$2() {
     objURL && (window.URL || window.webkitURL).revokeObjectURL(objURL);
   }
 }
-const encodedJs$1 = "KCgpPT57KGZ1bmN0aW9uKCl7InVzZSBzdHJpY3QiO3ZhciBhOyhmdW5jdGlvbih0KXt0LlRFWFQ9InRleHQiLHQuSU1BR0U9ImltYWdlIix0LlRBQkxFPSJ0YWJsZSIsdC5IWVBFUkxJTks9Imh5cGVybGluayIsdC5TVVBFUlNDUklQVD0ic3VwZXJzY3JpcHQiLHQuU1VCU0NSSVBUPSJzdWJzY3JpcHQiLHQuU0VQQVJBVE9SPSJzZXBhcmF0b3IiLHQuUEFHRV9CUkVBSz0icGFnZUJyZWFrIix0LkNPTlRST0w9ImNvbnRyb2wiLHQuQ0hFQ0tCT1g9ImNoZWNrYm94Iix0LlJBRElPPSJyYWRpbyIsdC5MQVRFWD0ibGF0ZXgiLHQuVEFCPSJ0YWIiLHQuREFURT0iZGF0ZSIsdC5CTE9DSz0iYmxvY2siLHQuVElUTEU9InRpdGxlIix0LkxJU1Q9Imxpc3QifSkoYXx8KGE9e30pKTt2YXIgYzsoZnVuY3Rpb24odCl7dC5GSVJTVD0iZmlyc3QiLHQuU0VDT05EPSJzZWNvbmQiLHQuVEhJUkQ9InRoaXJkIix0LkZPVVJUSD0iZm91cnRoIix0LkZJRlRIPSJmaWZ0aCIsdC5TSVhUSD0ic2l4dGgifSkoY3x8KGM9e30pKTtjb25zdCBJPXtbYy5GSVJTVF06MSxbYy5TRUNPTkRdOjIsW2MuVEhJUkRdOjMsW2MuRk9VUlRIXTo0LFtjLkZJRlRIXTo1LFtjLlNJWFRIXTo2fSx2PVthLlRFWFQsYS5IWVBFUkxJTkssYS5TVUJTQ1JJUFQsYS5TVVBFUlNDUklQVCxhLkNPTlRST0wsYS5EQVRFXSxoPSJcdTIwMEIiO2Z1bmN0aW9uIFQodCl7cmV0dXJuIXQudHlwZXx8di5pbmNsdWRlcyh0LnR5cGUpfWZ1bmN0aW9uIGYodCl7Y29uc3QgaT1bXTtsZXQgZT0wO2Zvcig7ZTx0Lmxlbmd0aDspe2NvbnN0IHM9dFtlXTtpZihzLnRpdGxlSWQpe2NvbnN0IG89cy50aXRsZUlkLGw9cy5sZXZlbCxuPXt0eXBlOmEuVElUTEUsdmFsdWU6IiIsbGV2ZWw6bCx0aXRsZUlkOm99LHI9W107Zm9yKDtlPHQubGVuZ3RoOyl7Y29uc3QgdT10W2VdO2lmKG8hPT11LnRpdGxlSWQpe2UtLTticmVha31yLnB1c2godSksZSsrfW4udmFsdWU9ci5maWx0ZXIodT0+VCh1KSkubWFwKHU9PnUudmFsdWUpLmpvaW4oIiIpLnJlcGxhY2UobmV3IFJlZ0V4cChoLCJnIiksIiIpLGkucHVzaChuKX1lKyt9aWYoIWkubGVuZ3RoKXJldHVybiBudWxsO2NvbnN0IGc9KHMsbyk9Pntjb25zdCBsPW8uc3ViQ2F0YWxvZ1tvLnN1YkNhdGFsb2cubGVuZ3RoLTFdLG49SVtsPT1udWxsP3ZvaWQgMDpsLmxldmVsXSxyPUlbcy5sZXZlbF07bCYmcj5uP2cocyxsKTpvLnN1YkNhdGFsb2cucHVzaCh7aWQ6cy50aXRsZUlkLG5hbWU6cy52YWx1ZSxsZXZlbDpzLmxldmVsLHN1YkNhdGFsb2c6W119KX0sUj1bXTtmb3IobGV0IHM9MDtzPGkubGVuZ3RoO3MrKyl7Y29uc3Qgbz1pW3NdLGw9UltSLmxlbmd0aC0xXSxuPUlbbD09bnVsbD92b2lkIDA6bC5sZXZlbF0scj1JW28ubGV2ZWxdO2wmJnI+bj9nKG8sbCk6Ui5wdXNoKHtpZDpvLnRpdGxlSWQsbmFtZTpvLnZhbHVlLGxldmVsOm8ubGV2ZWwsc3ViQ2F0YWxvZzpbXX0pfXJldHVybiBSfW9ubWVzc2FnZT10PT57Y29uc3QgaT10LmRhdGEsZT1mKGkpO3Bvc3RNZXNzYWdlKGUpfX0pKCk7fSkoKTsK";
+const encodedJs$1 = "KCgpPT57KGZ1bmN0aW9uKCl7InVzZSBzdHJpY3QiO3ZhciBsOyhmdW5jdGlvbih0KXt0LlRFWFQ9InRleHQiLHQuSU1BR0U9ImltYWdlIix0LlRBQkxFPSJ0YWJsZSIsdC5IWVBFUkxJTks9Imh5cGVybGluayIsdC5TVVBFUlNDUklQVD0ic3VwZXJzY3JpcHQiLHQuU1VCU0NSSVBUPSJzdWJzY3JpcHQiLHQuU0VQQVJBVE9SPSJzZXBhcmF0b3IiLHQuUEFHRV9CUkVBSz0icGFnZUJyZWFrIix0LkNPTlRST0w9ImNvbnRyb2wiLHQuQ0hFQ0tCT1g9ImNoZWNrYm94Iix0LlJBRElPPSJyYWRpbyIsdC5MQVRFWD0ibGF0ZXgiLHQuVEFCPSJ0YWIiLHQuREFURT0iZGF0ZSIsdC5CTE9DSz0iYmxvY2siLHQuVElUTEU9InRpdGxlIix0LkxJU1Q9Imxpc3QifSkobHx8KGw9e30pKTt2YXIgYTsoZnVuY3Rpb24odCl7dC5GSVJTVD0iZmlyc3QiLHQuU0VDT05EPSJzZWNvbmQiLHQuVEhJUkQ9InRoaXJkIix0LkZPVVJUSD0iZm91cnRoIix0LkZJRlRIPSJmaWZ0aCIsdC5TSVhUSD0ic2l4dGgifSkoYXx8KGE9e30pKTtjb25zdCBnPXtbYS5GSVJTVF06MSxbYS5TRUNPTkRdOjIsW2EuVEhJUkRdOjMsW2EuRk9VUlRIXTo0LFthLkZJRlRIXTo1LFthLlNJWFRIXTo2fSxMPVtsLlRFWFQsbC5IWVBFUkxJTkssbC5TVUJTQ1JJUFQsbC5TVVBFUlNDUklQVCxsLkNPTlRST0wsbC5EQVRFXSxUPSJcdTIwMEIiO2Z1bmN0aW9uIGQodCl7cmV0dXJuIXQudHlwZXx8TC5pbmNsdWRlcyh0LnR5cGUpfWZ1bmN0aW9uIGYodCl7Y29uc3R7ZWxlbWVudExpc3Q6bixwb3NpdGlvbkxpc3Q6dn09dCxJPVtdO2xldCBpPTA7Zm9yKDtpPG4ubGVuZ3RoOyl7Y29uc3Qgcz1uW2ldO2lmKHMudGl0bGVJZCl7Y29uc3QgZT1zLnRpdGxlSWQsbz1zLmxldmVsLGM9e3R5cGU6bC5USVRMRSx2YWx1ZToiIixsZXZlbDpvLHRpdGxlSWQ6ZSxwYWdlTm86dltpXS5wYWdlTm99LHI9W107Zm9yKDtpPG4ubGVuZ3RoOyl7Y29uc3QgdT1uW2ldO2lmKGUhPT11LnRpdGxlSWQpe2ktLTticmVha31yLnB1c2godSksaSsrfWMudmFsdWU9ci5maWx0ZXIodT0+ZCh1KSkubWFwKHU9PnUudmFsdWUpLmpvaW4oIiIpLnJlcGxhY2UobmV3IFJlZ0V4cChULCJnIiksIiIpLEkucHVzaChjKX1pKyt9aWYoIUkubGVuZ3RoKXJldHVybiBudWxsO2NvbnN0IGg9KHMsZSk9Pntjb25zdCBvPWUuc3ViQ2F0YWxvZ1tlLnN1YkNhdGFsb2cubGVuZ3RoLTFdLGM9Z1tvPT1udWxsP3ZvaWQgMDpvLmxldmVsXSxyPWdbcy5sZXZlbF07byYmcj5jP2gocyxvKTplLnN1YkNhdGFsb2cucHVzaCh7aWQ6cy50aXRsZUlkLG5hbWU6cy52YWx1ZSxsZXZlbDpzLmxldmVsLHBhZ2VObzpzLnBhZ2VObyxzdWJDYXRhbG9nOltdfSl9LFI9W107Zm9yKGxldCBzPTA7czxJLmxlbmd0aDtzKyspe2NvbnN0IGU9SVtzXSxvPVJbUi5sZW5ndGgtMV0sYz1nW289PW51bGw/dm9pZCAwOm8ubGV2ZWxdLHI9Z1tlLmxldmVsXTtvJiZyPmM/aChlLG8pOlIucHVzaCh7aWQ6ZS50aXRsZUlkLG5hbWU6ZS52YWx1ZSxsZXZlbDplLmxldmVsLHBhZ2VObzplLnBhZ2VObyxzdWJDYXRhbG9nOltdfSl9cmV0dXJuIFJ9b25tZXNzYWdlPXQ9Pntjb25zdCBuPXQuZGF0YSx2PWYobik7cG9zdE1lc3NhZ2Uodil9fSkoKTt9KSgpOwo=";
 const blob$1 = typeof window !== "undefined" && window.Blob && new Blob([atob(encodedJs$1)], { type: "text/javascript;charset=utf-8" });
 function WorkerWrapper$1() {
   const objURL = blob$1 && (window.URL || window.webkitURL).createObjectURL(blob$1);
@@ -13024,7 +13195,11 @@ class WorkerManager {
         reject(evt);
       };
       const elementList = this.draw.getOriginalMainElementList();
-      this.catalogWorker.postMessage(elementList);
+      const positionList = this.draw.getPosition().getOriginalMainPositionList();
+      this.catalogWorker.postMessage({
+        elementList,
+        positionList
+      });
     });
   }
   getGroupIds() {
@@ -13109,10 +13284,12 @@ class Previewer {
     return { x, y };
   }
   _createResizerDom() {
+    const { scale } = this.options;
     const resizerSelection = document.createElement("div");
     resizerSelection.classList.add(`${EDITOR_PREFIX}-resizer-selection`);
     resizerSelection.style.display = "none";
     resizerSelection.style.borderColor = this.options.resizerColor;
+    resizerSelection.style.borderWidth = `${scale}px`;
     const resizerHandleList = [];
     for (let i = 0; i < 8; i++) {
       const handleDom = document.createElement("div");
@@ -13365,12 +13542,13 @@ class Previewer {
     document.body.style.overflow = "auto";
   }
   _updateResizerRect(width, height) {
-    const handleSize = this.options.resizerSize;
+    const { resizerSize: handleSize, scale } = this.options;
     this.resizerSelection.style.width = `${width}px`;
     this.resizerSelection.style.height = `${height}px`;
     for (let i = 0; i < 8; i++) {
       const left2 = i === 0 || i === 6 || i === 7 ? -handleSize : i === 1 || i === 5 ? width / 2 : width - handleSize;
       const top = i === 0 || i === 1 || i === 2 ? -handleSize : i === 3 || i === 7 ? height / 2 - handleSize : height - handleSize;
+      this.resizerHandleList[i].style.transform = `scale(${scale})`;
       this.resizerHandleList[i].style.left = `${left2}px`;
       this.resizerHandleList[i].style.top = `${top}px`;
     }
@@ -13396,6 +13574,7 @@ class Previewer {
     const { x: resizerLeft, y: resizerTop } = this._getElementPosition(element, position);
     this.resizerSelection.style.left = `${resizerLeft}px`;
     this.resizerSelection.style.top = `${resizerTop}px`;
+    this.resizerSelection.style.borderWidth = `${scale}px`;
     this._updateResizerRect(elementWidth, elementHeight);
     this.resizerSelection.style.display = "block";
     this.curElement = element;
@@ -13413,7 +13592,9 @@ class DateParticle {
     __publicField(this, "draw");
     __publicField(this, "range");
     __publicField(this, "datePicker");
+    __publicField(this, "options");
     this.draw = draw;
+    this.options = draw.getOptions();
     this.range = draw.getRange();
     this.datePicker = new DatePicker(draw, {
       onSubmit: this._setValue.bind(this)
@@ -13440,7 +13621,9 @@ class DateParticle {
         }
       ]
     };
-    formatElementContext(elementList, [dateElement], leftIndex);
+    formatElementContext(elementList, [dateElement], leftIndex, {
+      editorOptions: this.options
+    });
     this.draw.insertElementList([dateElement]);
   }
   getDateElementRange() {
@@ -13674,6 +13857,7 @@ const contextmenu$1 = {
     textWrapType: {
       embed: "\u5D4C\u5165\u578B",
       upDown: "\u4E0A\u4E0B\u578B\u73AF\u7ED5",
+      surround: "\u56DB\u5468\u578B\u73AF\u7ED5",
       floatTop: "\u6D6E\u4E8E\u6587\u5B57\u4E0A\u65B9",
       floatBottom: "\u886C\u4E8E\u6587\u5B57\u4E0B\u65B9"
     }
@@ -13768,6 +13952,7 @@ const contextmenu = {
     textWrapType: {
       embed: "Embed",
       upDown: "Up down",
+      surround: "Surround",
       floatTop: "Float above text",
       floatBottom: "Float below text"
     }
@@ -14764,163 +14949,890 @@ class PageBorder {
     ctx.restore();
   }
 }
-class Draw {
-  constructor(rootContainer, options, data2, listener, eventBus, override) {
-    __publicField(this, "container");
-    __publicField(this, "pageContainer");
-    __publicField(this, "pageList");
-    __publicField(this, "ctxList");
-    __publicField(this, "pageNo");
-    __publicField(this, "pagePixelRatio");
-    __publicField(this, "mode");
-    __publicField(this, "options");
-    __publicField(this, "position");
-    __publicField(this, "zone");
-    __publicField(this, "elementList");
-    __publicField(this, "listener");
+function positionContextChange(draw, payload) {
+  const { value, oldValue } = payload;
+  if (oldValue.isTable && !value.isTable) {
+    draw.getTableTool().dispose();
+  }
+}
+class Actuator {
+  constructor(draw) {
+    __publicField(this, "draw");
     __publicField(this, "eventBus");
-    __publicField(this, "override");
-    __publicField(this, "i18n");
-    __publicField(this, "canvasEvent");
-    __publicField(this, "globalEvent");
-    __publicField(this, "cursor");
-    __publicField(this, "range");
-    __publicField(this, "margin");
-    __publicField(this, "background");
-    __publicField(this, "search");
-    __publicField(this, "group");
-    __publicField(this, "underline");
-    __publicField(this, "strikeout");
-    __publicField(this, "highlight");
-    __publicField(this, "historyManager");
-    __publicField(this, "previewer");
-    __publicField(this, "imageParticle");
-    __publicField(this, "laTexParticle");
-    __publicField(this, "textParticle");
-    __publicField(this, "tableParticle");
-    __publicField(this, "tableTool");
-    __publicField(this, "pageNumber");
-    __publicField(this, "lineNumber");
-    __publicField(this, "waterMark");
-    __publicField(this, "placeholder");
-    __publicField(this, "header");
-    __publicField(this, "footer");
-    __publicField(this, "hyperlinkParticle");
-    __publicField(this, "dateParticle");
-    __publicField(this, "separatorParticle");
-    __publicField(this, "pageBreakParticle");
-    __publicField(this, "superscriptParticle");
-    __publicField(this, "subscriptParticle");
-    __publicField(this, "checkboxParticle");
-    __publicField(this, "radioParticle");
-    __publicField(this, "blockParticle");
-    __publicField(this, "listParticle");
-    __publicField(this, "lineBreakParticle");
-    __publicField(this, "control");
-    __publicField(this, "pageBorder");
-    __publicField(this, "workerManager");
-    __publicField(this, "scrollObserver");
-    __publicField(this, "selectionObserver");
-    __publicField(this, "imageObserver");
-    __publicField(this, "LETTER_REG");
-    __publicField(this, "WORD_LIKE_REG");
-    __publicField(this, "rowList");
-    __publicField(this, "pageRowList");
-    __publicField(this, "painterStyle");
-    __publicField(this, "painterOptions");
-    __publicField(this, "visiblePageNoList");
-    __publicField(this, "intersectionPageNo");
-    __publicField(this, "lazyRenderIntersectionObserver");
-    __publicField(this, "printModeData");
-    this.container = this._wrapContainer(rootContainer);
-    this.pageList = [];
-    this.ctxList = [];
-    this.pageNo = 0;
-    this.pagePixelRatio = null;
-    this.mode = options.mode;
-    this.options = options;
-    this.elementList = data2.main;
-    this.listener = listener;
-    this.eventBus = eventBus;
-    this.override = override;
-    this._formatContainer();
-    this.pageContainer = this._createPageContainer();
-    this._createPage(0);
-    this.i18n = new I18n();
-    this.historyManager = new HistoryManager(this);
-    this.position = new Position(this);
-    this.zone = new Zone(this);
-    this.range = new RangeManager(this);
-    this.margin = new Margin(this);
-    this.background = new Background(this);
-    this.search = new Search(this);
-    this.group = new Group(this);
-    this.underline = new Underline(this);
-    this.strikeout = new Strikeout(this);
-    this.highlight = new Highlight(this);
-    this.previewer = new Previewer(this);
-    this.imageParticle = new ImageParticle(this);
-    this.laTexParticle = new LaTexParticle(this);
-    this.textParticle = new TextParticle(this);
-    this.tableParticle = new TableParticle(this);
-    this.tableTool = new TableTool(this);
-    this.pageNumber = new PageNumber(this);
-    this.lineNumber = new LineNumber(this);
-    this.waterMark = new Watermark(this);
-    this.placeholder = new Placeholder(this);
-    this.header = new Header(this, data2.header);
-    this.footer = new Footer(this, data2.footer);
-    this.hyperlinkParticle = new HyperlinkParticle(this);
-    this.dateParticle = new DateParticle(this);
-    this.separatorParticle = new SeparatorParticle(this);
-    this.pageBreakParticle = new PageBreakParticle(this);
-    this.superscriptParticle = new SuperscriptParticle();
-    this.subscriptParticle = new SubscriptParticle();
-    this.checkboxParticle = new CheckboxParticle(this);
-    this.radioParticle = new RadioParticle(this);
-    this.blockParticle = new BlockParticle(this);
-    this.listParticle = new ListParticle(this);
-    this.lineBreakParticle = new LineBreakParticle(this);
-    this.control = new Control(this);
-    this.pageBorder = new PageBorder(this);
-    this.scrollObserver = new ScrollObserver(this);
-    this.selectionObserver = new SelectionObserver(this);
-    this.imageObserver = new ImageObserver();
-    new MouseObserver(this);
-    this.canvasEvent = new CanvasEvent(this);
-    this.cursor = new Cursor(this, this.canvasEvent);
-    this.canvasEvent.register();
-    this.globalEvent = new GlobalEvent(this, this.canvasEvent);
-    this.globalEvent.register();
-    this.workerManager = new WorkerManager(this);
-    const { letterClass } = options;
-    this.LETTER_REG = new RegExp(`[${letterClass.join("")}]`);
-    this.WORD_LIKE_REG = new RegExp(`${letterClass.map((letter) => `[^${letter}][${letter}]`).join("|")}`);
-    this.rowList = [];
-    this.pageRowList = [];
-    this.painterStyle = null;
-    this.painterOptions = null;
-    this.visiblePageNoList = [];
-    this.intersectionPageNo = 0;
-    this.lazyRenderIntersectionObserver = null;
-    this.printModeData = null;
-    this.render({
-      isInit: true,
-      isSetCursor: false,
-      isFirstRender: true
-    });
+    this.draw = draw;
+    this.eventBus = draw.getEventBus();
+    this.execute();
   }
-  getLetterReg() {
-    return this.LETTER_REG;
+  execute() {
+    this.eventBus.on("positionContextChange", (payload) => {
+      positionContextChange(this.draw, payload);
+    });
   }
-  getMode() {
-    return this.mode;
+}
+class TableOperate {
+  constructor(draw) {
+    __publicField(this, "draw");
+    __publicField(this, "range");
+    __publicField(this, "position");
+    __publicField(this, "tableTool");
+    __publicField(this, "tableParticle");
+    __publicField(this, "options");
+    this.draw = draw;
+    this.range = draw.getRange();
+    this.position = draw.getPosition();
+    this.tableTool = draw.getTableTool();
+    this.tableParticle = draw.getTableParticle();
+    this.options = draw.getOptions();
   }
-  setMode(payload) {
-    if (this.mode === payload)
-      return;
-    if (payload === EditorMode.PRINT) {
-      this.printModeData = {
+  insertTable(row, col) {
+    var _a;
+    const { startIndex, endIndex } = this.range.getRange();
+    if (!~startIndex && !~endIndex)
+      return;
+    const { defaultTrMinHeight } = this.options.table;
+    const elementList = this.draw.getElementList();
+    let offsetX = 0;
+    if ((_a = elementList[startIndex]) == null ? void 0 : _a.listId) {
+      const positionList = this.position.getPositionList();
+      const { rowIndex } = positionList[startIndex];
+      const rowList = this.draw.getRowList();
+      const row2 = rowList[rowIndex];
+      offsetX = (row2 == null ? void 0 : row2.offsetX) || 0;
+    }
+    const innerWidth = this.draw.getContextInnerWidth() - offsetX;
+    const colgroup = [];
+    const colWidth = innerWidth / col;
+    for (let c = 0; c < col; c++) {
+      colgroup.push({
+        width: colWidth
+      });
+    }
+    const trList = [];
+    for (let r = 0; r < row; r++) {
+      const tdList = [];
+      const tr = {
+        height: defaultTrMinHeight,
+        tdList
+      };
+      for (let c = 0; c < col; c++) {
+        tdList.push({
+          colspan: 1,
+          rowspan: 1,
+          value: []
+        });
+      }
+      trList.push(tr);
+    }
+    const element = {
+      type: ElementType.TABLE,
+      value: "",
+      colgroup,
+      trList
+    };
+    formatElementList([element], {
+      editorOptions: this.options
+    });
+    formatElementContext(elementList, [element], startIndex, {
+      editorOptions: this.options
+    });
+    const curIndex = startIndex + 1;
+    this.draw.spliceElementList(elementList, curIndex, startIndex === endIndex ? 0 : endIndex - startIndex, element);
+    this.range.setRange(curIndex, curIndex);
+    this.draw.render({ curIndex, isSetCursor: false });
+  }
+  insertTableTopRow() {
+    const positionContext = this.position.getPositionContext();
+    if (!positionContext.isTable)
+      return;
+    const { index: index2, trIndex, tableId } = positionContext;
+    const originalElementList = this.draw.getOriginalElementList();
+    const element = originalElementList[index2];
+    const curTrList = element.trList;
+    const curTr = curTrList[trIndex];
+    if (curTr.tdList.length < element.colgroup.length) {
+      const curTrNo = curTr.tdList[0].rowIndex;
+      for (let t = 0; t < trIndex; t++) {
+        const tr = curTrList[t];
+        for (let d = 0; d < tr.tdList.length; d++) {
+          const td = tr.tdList[d];
+          if (td.rowspan > 1 && td.rowIndex + td.rowspan >= curTrNo + 1) {
+            td.rowspan += 1;
+          }
+        }
+      }
+    }
+    const newTrId = getUUID();
+    const newTr = {
+      height: curTr.height,
+      id: newTrId,
+      tdList: []
+    };
+    for (let t = 0; t < curTr.tdList.length; t++) {
+      const curTd = curTr.tdList[t];
+      const newTdId = getUUID();
+      newTr.tdList.push({
+        id: newTdId,
+        rowspan: 1,
+        colspan: curTd.colspan,
+        value: [
+          {
+            value: ZERO,
+            size: 16,
+            tableId,
+            trId: newTrId,
+            tdId: newTdId
+          }
+        ]
+      });
+    }
+    curTrList.splice(trIndex, 0, newTr);
+    this.position.setPositionContext({
+      isTable: true,
+      index: index2,
+      trIndex,
+      tdIndex: 0,
+      tdId: newTr.tdList[0].id,
+      trId: newTr.id,
+      tableId
+    });
+    this.range.setRange(0, 0);
+    this.draw.render({ curIndex: 0 });
+    this.tableTool.render();
+  }
+  insertTableBottomRow() {
+    const positionContext = this.position.getPositionContext();
+    if (!positionContext.isTable)
+      return;
+    const { index: index2, trIndex, tableId } = positionContext;
+    const originalElementList = this.draw.getOriginalElementList();
+    const element = originalElementList[index2];
+    const curTrList = element.trList;
+    const curTr = curTrList[trIndex];
+    const anchorTr = curTrList.length - 1 === trIndex ? curTr : curTrList[trIndex + 1];
+    if (anchorTr.tdList.length < element.colgroup.length) {
+      const curTrNo = anchorTr.tdList[0].rowIndex;
+      for (let t = 0; t < trIndex + 1; t++) {
+        const tr = curTrList[t];
+        for (let d = 0; d < tr.tdList.length; d++) {
+          const td = tr.tdList[d];
+          if (td.rowspan > 1 && td.rowIndex + td.rowspan >= curTrNo + 1) {
+            td.rowspan += 1;
+          }
+        }
+      }
+    }
+    const newTrId = getUUID();
+    const newTr = {
+      height: anchorTr.height,
+      id: newTrId,
+      tdList: []
+    };
+    for (let t = 0; t < anchorTr.tdList.length; t++) {
+      const curTd = anchorTr.tdList[t];
+      const newTdId = getUUID();
+      newTr.tdList.push({
+        id: newTdId,
+        rowspan: 1,
+        colspan: curTd.colspan,
+        value: [
+          {
+            value: ZERO,
+            size: 16,
+            tableId,
+            trId: newTrId,
+            tdId: newTdId
+          }
+        ]
+      });
+    }
+    curTrList.splice(trIndex + 1, 0, newTr);
+    this.position.setPositionContext({
+      isTable: true,
+      index: index2,
+      trIndex: trIndex + 1,
+      tdIndex: 0,
+      tdId: newTr.tdList[0].id,
+      trId: newTr.id,
+      tableId
+    });
+    this.range.setRange(0, 0);
+    this.draw.render({ curIndex: 0 });
+  }
+  insertTableLeftCol() {
+    const positionContext = this.position.getPositionContext();
+    if (!positionContext.isTable)
+      return;
+    const { index: index2, tdIndex, tableId } = positionContext;
+    const originalElementList = this.draw.getOriginalElementList();
+    const element = originalElementList[index2];
+    const curTrList = element.trList;
+    const curTdIndex = tdIndex;
+    for (let t = 0; t < curTrList.length; t++) {
+      const tr = curTrList[t];
+      const tdId = getUUID();
+      tr.tdList.splice(curTdIndex, 0, {
+        id: tdId,
+        rowspan: 1,
+        colspan: 1,
+        value: [
+          {
+            value: ZERO,
+            size: 16,
+            tableId,
+            trId: tr.id,
+            tdId
+          }
+        ]
+      });
+    }
+    const colgroup = element.colgroup;
+    colgroup.splice(curTdIndex, 0, {
+      width: this.options.table.defaultColMinWidth
+    });
+    const colgroupWidth = colgroup.reduce((pre, cur) => pre + cur.width, 0);
+    const width = this.draw.getOriginalInnerWidth();
+    if (colgroupWidth > width) {
+      const adjustWidth = (colgroupWidth - width) / colgroup.length;
+      for (let g = 0; g < colgroup.length; g++) {
+        const group2 = colgroup[g];
+        group2.width -= adjustWidth;
+      }
+    }
+    this.position.setPositionContext({
+      isTable: true,
+      index: index2,
+      trIndex: 0,
+      tdIndex: curTdIndex,
+      tdId: curTrList[0].tdList[curTdIndex].id,
+      trId: curTrList[0].id,
+      tableId
+    });
+    this.range.setRange(0, 0);
+    this.draw.render({ curIndex: 0 });
+    this.tableTool.render();
+  }
+  insertTableRightCol() {
+    const positionContext = this.position.getPositionContext();
+    if (!positionContext.isTable)
+      return;
+    const { index: index2, tdIndex, tableId } = positionContext;
+    const originalElementList = this.draw.getOriginalElementList();
+    const element = originalElementList[index2];
+    const curTrList = element.trList;
+    const curTdIndex = tdIndex + 1;
+    for (let t = 0; t < curTrList.length; t++) {
+      const tr = curTrList[t];
+      const tdId = getUUID();
+      tr.tdList.splice(curTdIndex, 0, {
+        id: tdId,
+        rowspan: 1,
+        colspan: 1,
+        value: [
+          {
+            value: ZERO,
+            size: 16,
+            tableId,
+            trId: tr.id,
+            tdId
+          }
+        ]
+      });
+    }
+    const colgroup = element.colgroup;
+    colgroup.splice(curTdIndex, 0, {
+      width: this.options.table.defaultColMinWidth
+    });
+    const colgroupWidth = colgroup.reduce((pre, cur) => pre + cur.width, 0);
+    const width = this.draw.getOriginalInnerWidth();
+    if (colgroupWidth > width) {
+      const adjustWidth = (colgroupWidth - width) / colgroup.length;
+      for (let g = 0; g < colgroup.length; g++) {
+        const group2 = colgroup[g];
+        group2.width -= adjustWidth;
+      }
+    }
+    this.position.setPositionContext({
+      isTable: true,
+      index: index2,
+      trIndex: 0,
+      tdIndex: curTdIndex,
+      tdId: curTrList[0].tdList[curTdIndex].id,
+      trId: curTrList[0].id,
+      tableId
+    });
+    this.range.setRange(0, 0);
+    this.draw.render({ curIndex: 0 });
+  }
+  deleteTableRow() {
+    const positionContext = this.position.getPositionContext();
+    if (!positionContext.isTable)
+      return;
+    const { index: index2, trIndex, tdIndex } = positionContext;
+    const originalElementList = this.draw.getOriginalElementList();
+    const element = originalElementList[index2];
+    const trList = element.trList;
+    const curTr = trList[trIndex];
+    const curTdRowIndex = curTr.tdList[tdIndex].rowIndex;
+    if (trList.length <= 1) {
+      this.deleteTable();
+      return;
+    }
+    for (let r = 0; r < curTdRowIndex; r++) {
+      const tr = trList[r];
+      const tdList = tr.tdList;
+      for (let d = 0; d < tdList.length; d++) {
+        const td = tdList[d];
+        if (td.rowIndex + td.rowspan > curTdRowIndex) {
+          td.rowspan--;
+        }
+      }
+    }
+    for (let d = 0; d < curTr.tdList.length; d++) {
+      const td = curTr.tdList[d];
+      if (td.rowspan > 1) {
+        const tdId = getUUID();
+        const nextTr = trList[trIndex + 1];
+        nextTr.tdList.splice(d, 0, {
+          id: tdId,
+          rowspan: td.rowspan - 1,
+          colspan: td.colspan,
+          value: [
+            {
+              value: ZERO,
+              size: 16,
+              tableId: element.id,
+              trId: nextTr.id,
+              tdId
+            }
+          ]
+        });
+      }
+    }
+    trList.splice(trIndex, 1);
+    this.position.setPositionContext({
+      isTable: false
+    });
+    this.range.clearRange();
+    this.draw.render({
+      curIndex: positionContext.index
+    });
+    this.tableTool.dispose();
+  }
+  deleteTableCol() {
+    var _a;
+    const positionContext = this.position.getPositionContext();
+    if (!positionContext.isTable)
+      return;
+    const { index: index2, tdIndex, trIndex } = positionContext;
+    const originalElementList = this.draw.getOriginalElementList();
+    const element = originalElementList[index2];
+    const curTrList = element.trList;
+    const curTd = curTrList[trIndex].tdList[tdIndex];
+    const curColIndex = curTd.colIndex;
+    const moreTdTr = curTrList.find((tr) => tr.tdList.length > 1);
+    if (!moreTdTr) {
+      this.deleteTable();
+      return;
+    }
+    for (let t = 0; t < curTrList.length; t++) {
+      const tr = curTrList[t];
+      for (let d = 0; d < tr.tdList.length; d++) {
+        const td = tr.tdList[d];
+        if (td.colIndex <= curColIndex && td.colIndex + td.colspan > curColIndex) {
+          if (td.colspan > 1) {
+            td.colspan--;
+          } else {
+            tr.tdList.splice(d, 1);
+          }
+        }
+      }
+    }
+    (_a = element.colgroup) == null ? void 0 : _a.splice(curColIndex, 1);
+    this.position.setPositionContext({
+      isTable: false
+    });
+    this.range.setRange(0, 0);
+    this.draw.render({
+      curIndex: positionContext.index
+    });
+    this.tableTool.dispose();
+  }
+  deleteTable() {
+    const positionContext = this.position.getPositionContext();
+    if (!positionContext.isTable)
+      return;
+    const originalElementList = this.draw.getOriginalElementList();
+    originalElementList.splice(positionContext.index, 1);
+    const curIndex = positionContext.index - 1;
+    this.position.setPositionContext({
+      isTable: false,
+      index: curIndex
+    });
+    this.range.setRange(curIndex, curIndex);
+    this.draw.render({ curIndex });
+    this.tableTool.dispose();
+  }
+  mergeTableCell() {
+    const positionContext = this.position.getPositionContext();
+    if (!positionContext.isTable)
+      return;
+    const { isCrossRowCol, startTdIndex, endTdIndex, startTrIndex, endTrIndex } = this.range.getRange();
+    if (!isCrossRowCol)
+      return;
+    const { index: index2 } = positionContext;
+    const originalElementList = this.draw.getOriginalElementList();
+    const element = originalElementList[index2];
+    const curTrList = element.trList;
+    let startTd = curTrList[startTrIndex].tdList[startTdIndex];
+    let endTd = curTrList[endTrIndex].tdList[endTdIndex];
+    if (startTd.x > endTd.x || startTd.y > endTd.y) {
+      [startTd, endTd] = [endTd, startTd];
+    }
+    const startColIndex = startTd.colIndex;
+    const endColIndex = endTd.colIndex + (endTd.colspan - 1);
+    const startRowIndex = startTd.rowIndex;
+    const endRowIndex = endTd.rowIndex + (endTd.rowspan - 1);
+    const rowCol = [];
+    for (let t = 0; t < curTrList.length; t++) {
+      const tr = curTrList[t];
+      const tdList = [];
+      for (let d = 0; d < tr.tdList.length; d++) {
+        const td = tr.tdList[d];
+        const tdColIndex = td.colIndex;
+        const tdRowIndex = td.rowIndex;
+        if (tdColIndex >= startColIndex && tdColIndex <= endColIndex && tdRowIndex >= startRowIndex && tdRowIndex <= endRowIndex) {
+          tdList.push(td);
+        }
+      }
+      if (tdList.length) {
+        rowCol.push(tdList);
+      }
+    }
+    if (!rowCol.length)
+      return;
+    const lastRow = rowCol[rowCol.length - 1];
+    const leftTop = rowCol[0][0];
+    const rightBottom = lastRow[lastRow.length - 1];
+    const startX = leftTop.x;
+    const startY = leftTop.y;
+    const endX = rightBottom.x + rightBottom.width;
+    const endY = rightBottom.y + rightBottom.height;
+    for (let t = 0; t < rowCol.length; t++) {
+      const tr = rowCol[t];
+      for (let d = 0; d < tr.length; d++) {
+        const td = tr[d];
+        const tdStartX = td.x;
+        const tdStartY = td.y;
+        const tdEndX = tdStartX + td.width;
+        const tdEndY = tdStartY + td.height;
+        if (startX > tdStartX || startY > tdStartY || endX < tdEndX || endY < tdEndY) {
+          return;
+        }
+      }
+    }
+    const mergeTdIdList = [];
+    const anchorTd = rowCol[0][0];
+    for (let t = 0; t < rowCol.length; t++) {
+      const tr = rowCol[t];
+      for (let d = 0; d < tr.length; d++) {
+        const td = tr[d];
+        const isAnchorTd = t === 0 && d === 0;
+        if (!isAnchorTd) {
+          mergeTdIdList.push(td.id);
+        }
+        if (t === 0 && d !== 0) {
+          anchorTd.colspan += td.colspan;
+        }
+        if (t !== 0) {
+          if (anchorTd.colIndex === td.colIndex) {
+            anchorTd.rowspan += td.rowspan;
+          }
+        }
+      }
+    }
+    for (let t = 0; t < curTrList.length; t++) {
+      const tr = curTrList[t];
+      let d = 0;
+      while (d < tr.tdList.length) {
+        const td = tr.tdList[d];
+        if (mergeTdIdList.includes(td.id)) {
+          tr.tdList.splice(d, 1);
+          d--;
+        }
+        d++;
+      }
+    }
+    this.position.setPositionContext(__spreadProps(__spreadValues({}, positionContext), {
+      trIndex: anchorTd.trIndex,
+      tdIndex: anchorTd.tdIndex
+    }));
+    const curIndex = anchorTd.value.length - 1;
+    this.range.setRange(curIndex, curIndex);
+    this.draw.render();
+    this.tableTool.render();
+  }
+  cancelMergeTableCell() {
+    const positionContext = this.position.getPositionContext();
+    if (!positionContext.isTable)
+      return;
+    const { index: index2, tdIndex, trIndex } = positionContext;
+    const originalElementList = this.draw.getOriginalElementList();
+    const element = originalElementList[index2];
+    const curTrList = element.trList;
+    const curTr = curTrList[trIndex];
+    const curTd = curTr.tdList[tdIndex];
+    if (curTd.rowspan === 1 && curTd.colspan === 1)
+      return;
+    const colspan = curTd.colspan;
+    if (curTd.colspan > 1) {
+      for (let c = 1; c < curTd.colspan; c++) {
+        const tdId = getUUID();
+        curTr.tdList.splice(tdIndex + c, 0, {
+          id: tdId,
+          rowspan: 1,
+          colspan: 1,
+          value: [
+            {
+              value: ZERO,
+              size: 16,
+              tableId: element.id,
+              trId: curTr.id,
+              tdId
+            }
+          ]
+        });
+      }
+      curTd.colspan = 1;
+    }
+    if (curTd.rowspan > 1) {
+      for (let r = 1; r < curTd.rowspan; r++) {
+        const tr = curTrList[trIndex + r];
+        for (let c = 0; c < colspan; c++) {
+          const tdId = getUUID();
+          tr.tdList.splice(curTd.colIndex, 0, {
+            id: tdId,
+            rowspan: 1,
+            colspan: 1,
+            value: [
+              {
+                value: ZERO,
+                size: 16,
+                tableId: element.id,
+                trId: tr.id,
+                tdId
+              }
+            ]
+          });
+        }
+      }
+      curTd.rowspan = 1;
+    }
+    const curIndex = curTd.value.length - 1;
+    this.range.setRange(curIndex, curIndex);
+    this.draw.render();
+    this.tableTool.render();
+  }
+  tableTdVerticalAlign(payload) {
+    const rowCol = this.tableParticle.getRangeRowCol();
+    if (!rowCol)
+      return;
+    for (let r = 0; r < rowCol.length; r++) {
+      const row = rowCol[r];
+      for (let c = 0; c < row.length; c++) {
+        const td = row[c];
+        if (!td || td.verticalAlign === payload || !td.verticalAlign && payload === VerticalAlign.TOP) {
+          continue;
+        }
+        td.verticalAlign = payload;
+      }
+    }
+    const { endIndex } = this.range.getRange();
+    this.draw.render({
+      curIndex: endIndex
+    });
+  }
+  tableBorderType(payload) {
+    const positionContext = this.position.getPositionContext();
+    if (!positionContext.isTable)
+      return;
+    const { index: index2 } = positionContext;
+    const originalElementList = this.draw.getOriginalElementList();
+    const element = originalElementList[index2];
+    if (!element.borderType && payload === TableBorder.ALL || element.borderType === payload) {
+      return;
+    }
+    element.borderType = payload;
+    const { endIndex } = this.range.getRange();
+    this.draw.render({
+      curIndex: endIndex
+    });
+  }
+  tableTdBorderType(payload) {
+    const rowCol = this.tableParticle.getRangeRowCol();
+    if (!rowCol)
+      return;
+    const tdList = rowCol.flat();
+    const isSetBorderType = tdList.some((td) => {
+      var _a;
+      return !((_a = td.borderTypes) == null ? void 0 : _a.includes(payload));
+    });
+    tdList.forEach((td) => {
+      if (!td.borderTypes) {
+        td.borderTypes = [];
+      }
+      const borderTypeIndex = td.borderTypes.findIndex((type) => type === payload);
+      if (isSetBorderType) {
+        if (!~borderTypeIndex) {
+          td.borderTypes.push(payload);
+        }
+      } else {
+        if (~borderTypeIndex) {
+          td.borderTypes.splice(borderTypeIndex, 1);
+        }
+      }
+      if (!td.borderTypes.length) {
+        delete td.borderTypes;
+      }
+    });
+    const { endIndex } = this.range.getRange();
+    this.draw.render({
+      curIndex: endIndex
+    });
+  }
+  tableTdSlashType(payload) {
+    const rowCol = this.tableParticle.getRangeRowCol();
+    if (!rowCol)
+      return;
+    const tdList = rowCol.flat();
+    const isSetTdSlashType = tdList.some((td) => {
+      var _a;
+      return !((_a = td.slashTypes) == null ? void 0 : _a.includes(payload));
+    });
+    tdList.forEach((td) => {
+      if (!td.slashTypes) {
+        td.slashTypes = [];
+      }
+      const slashTypeIndex = td.slashTypes.findIndex((type) => type === payload);
+      if (isSetTdSlashType) {
+        if (!~slashTypeIndex) {
+          td.slashTypes.push(payload);
+        }
+      } else {
+        if (~slashTypeIndex) {
+          td.slashTypes.splice(slashTypeIndex, 1);
+        }
+      }
+      if (!td.slashTypes.length) {
+        delete td.slashTypes;
+      }
+    });
+    const { endIndex } = this.range.getRange();
+    this.draw.render({
+      curIndex: endIndex
+    });
+  }
+  tableTdBackgroundColor(payload) {
+    const rowCol = this.tableParticle.getRangeRowCol();
+    if (!rowCol)
+      return;
+    for (let r = 0; r < rowCol.length; r++) {
+      const row = rowCol[r];
+      for (let c = 0; c < row.length; c++) {
+        const col = row[c];
+        col.backgroundColor = payload;
+      }
+    }
+    const { endIndex } = this.range.getRange();
+    this.range.setRange(endIndex, endIndex);
+    this.draw.render({
+      isCompute: false
+    });
+  }
+  tableSelectAll() {
+    const positionContext = this.position.getPositionContext();
+    const { index: index2, tableId, isTable } = positionContext;
+    if (!isTable || !tableId)
+      return;
+    const { startIndex, endIndex } = this.range.getRange();
+    const originalElementList = this.draw.getOriginalElementList();
+    const trList = originalElementList[index2].trList;
+    const endTrIndex = trList.length - 1;
+    const endTdIndex = trList[endTrIndex].tdList.length - 1;
+    this.range.replaceRange({
+      startIndex,
+      endIndex,
+      tableId,
+      startTdIndex: 0,
+      endTdIndex,
+      startTrIndex: 0,
+      endTrIndex
+    });
+    this.draw.render({
+      isCompute: false,
+      isSubmitHistory: false
+    });
+  }
+}
+class Draw {
+  constructor(rootContainer, options, data2, listener, eventBus, override) {
+    __publicField(this, "container");
+    __publicField(this, "pageContainer");
+    __publicField(this, "pageList");
+    __publicField(this, "ctxList");
+    __publicField(this, "pageNo");
+    __publicField(this, "pagePixelRatio");
+    __publicField(this, "mode");
+    __publicField(this, "options");
+    __publicField(this, "position");
+    __publicField(this, "zone");
+    __publicField(this, "elementList");
+    __publicField(this, "listener");
+    __publicField(this, "eventBus");
+    __publicField(this, "override");
+    __publicField(this, "i18n");
+    __publicField(this, "canvasEvent");
+    __publicField(this, "globalEvent");
+    __publicField(this, "cursor");
+    __publicField(this, "range");
+    __publicField(this, "margin");
+    __publicField(this, "background");
+    __publicField(this, "search");
+    __publicField(this, "group");
+    __publicField(this, "underline");
+    __publicField(this, "strikeout");
+    __publicField(this, "highlight");
+    __publicField(this, "historyManager");
+    __publicField(this, "previewer");
+    __publicField(this, "imageParticle");
+    __publicField(this, "laTexParticle");
+    __publicField(this, "textParticle");
+    __publicField(this, "tableParticle");
+    __publicField(this, "tableTool");
+    __publicField(this, "tableOperate");
+    __publicField(this, "pageNumber");
+    __publicField(this, "lineNumber");
+    __publicField(this, "waterMark");
+    __publicField(this, "placeholder");
+    __publicField(this, "header");
+    __publicField(this, "footer");
+    __publicField(this, "hyperlinkParticle");
+    __publicField(this, "dateParticle");
+    __publicField(this, "separatorParticle");
+    __publicField(this, "pageBreakParticle");
+    __publicField(this, "superscriptParticle");
+    __publicField(this, "subscriptParticle");
+    __publicField(this, "checkboxParticle");
+    __publicField(this, "radioParticle");
+    __publicField(this, "blockParticle");
+    __publicField(this, "listParticle");
+    __publicField(this, "lineBreakParticle");
+    __publicField(this, "control");
+    __publicField(this, "pageBorder");
+    __publicField(this, "workerManager");
+    __publicField(this, "scrollObserver");
+    __publicField(this, "selectionObserver");
+    __publicField(this, "imageObserver");
+    __publicField(this, "LETTER_REG");
+    __publicField(this, "WORD_LIKE_REG");
+    __publicField(this, "rowList");
+    __publicField(this, "pageRowList");
+    __publicField(this, "painterStyle");
+    __publicField(this, "painterOptions");
+    __publicField(this, "visiblePageNoList");
+    __publicField(this, "intersectionPageNo");
+    __publicField(this, "lazyRenderIntersectionObserver");
+    __publicField(this, "printModeData");
+    this.container = this._wrapContainer(rootContainer);
+    this.pageList = [];
+    this.ctxList = [];
+    this.pageNo = 0;
+    this.pagePixelRatio = null;
+    this.mode = options.mode;
+    this.options = options;
+    this.elementList = data2.main;
+    this.listener = listener;
+    this.eventBus = eventBus;
+    this.override = override;
+    this._formatContainer();
+    this.pageContainer = this._createPageContainer();
+    this._createPage(0);
+    this.i18n = new I18n();
+    this.historyManager = new HistoryManager(this);
+    this.position = new Position(this);
+    this.zone = new Zone(this);
+    this.range = new RangeManager(this);
+    this.margin = new Margin(this);
+    this.background = new Background(this);
+    this.search = new Search(this);
+    this.group = new Group(this);
+    this.underline = new Underline(this);
+    this.strikeout = new Strikeout(this);
+    this.highlight = new Highlight(this);
+    this.previewer = new Previewer(this);
+    this.imageParticle = new ImageParticle(this);
+    this.laTexParticle = new LaTexParticle(this);
+    this.textParticle = new TextParticle(this);
+    this.tableParticle = new TableParticle(this);
+    this.tableTool = new TableTool(this);
+    this.tableOperate = new TableOperate(this);
+    this.pageNumber = new PageNumber(this);
+    this.lineNumber = new LineNumber(this);
+    this.waterMark = new Watermark(this);
+    this.placeholder = new Placeholder(this);
+    this.header = new Header(this, data2.header);
+    this.footer = new Footer(this, data2.footer);
+    this.hyperlinkParticle = new HyperlinkParticle(this);
+    this.dateParticle = new DateParticle(this);
+    this.separatorParticle = new SeparatorParticle(this);
+    this.pageBreakParticle = new PageBreakParticle(this);
+    this.superscriptParticle = new SuperscriptParticle();
+    this.subscriptParticle = new SubscriptParticle();
+    this.checkboxParticle = new CheckboxParticle(this);
+    this.radioParticle = new RadioParticle(this);
+    this.blockParticle = new BlockParticle(this);
+    this.listParticle = new ListParticle(this);
+    this.lineBreakParticle = new LineBreakParticle(this);
+    this.control = new Control(this);
+    this.pageBorder = new PageBorder(this);
+    this.scrollObserver = new ScrollObserver(this);
+    this.selectionObserver = new SelectionObserver(this);
+    this.imageObserver = new ImageObserver();
+    new MouseObserver(this);
+    this.canvasEvent = new CanvasEvent(this);
+    this.cursor = new Cursor(this, this.canvasEvent);
+    this.canvasEvent.register();
+    this.globalEvent = new GlobalEvent(this, this.canvasEvent);
+    this.globalEvent.register();
+    this.workerManager = new WorkerManager(this);
+    new Actuator(this);
+    const { letterClass } = options;
+    this.LETTER_REG = new RegExp(`[${letterClass.join("")}]`);
+    this.WORD_LIKE_REG = new RegExp(`${letterClass.map((letter) => `[^${letter}][${letter}]`).join("|")}`);
+    this.rowList = [];
+    this.pageRowList = [];
+    this.painterStyle = null;
+    this.painterOptions = null;
+    this.visiblePageNoList = [];
+    this.intersectionPageNo = 0;
+    this.lazyRenderIntersectionObserver = null;
+    this.printModeData = null;
+    this.render({
+      isInit: true,
+      isSetCursor: false,
+      isFirstRender: true
+    });
+  }
+  getLetterReg() {
+    return this.LETTER_REG;
+  }
+  getMode() {
+    return this.mode;
+  }
+  setMode(payload) {
+    if (this.mode === payload)
+      return;
+    if (payload === EditorMode.PRINT) {
+      this.printModeData = {
         header: this.header.getElementList(),
         main: this.elementList,
         footer: this.footer.getElementList()
@@ -14947,6 +15859,8 @@ class Draw {
   }
   isReadonly() {
     switch (this.mode) {
+      case EditorMode.DESIGN:
+        return false;
       case EditorMode.READONLY:
       case EditorMode.PRINT:
         return true;
@@ -14957,13 +15871,17 @@ class Draw {
     }
   }
   isDisabled() {
-    var _a, _b, _c, _d;
+    var _a, _b, _c, _d, _e;
+    if (this.mode === EditorMode.DESIGN)
+      return false;
     const { startIndex, endIndex } = this.range.getRange();
     const elementList = this.getElementList();
+    if ((_a = this.getTd()) == null ? void 0 : _a.disabled)
+      return true;
     if (startIndex === endIndex) {
       const startElement = elementList[startIndex];
       const nextElement = elementList[startIndex + 1];
-      return !!(((_a = startElement == null ? void 0 : startElement.title) == null ? void 0 : _a.disabled) && ((_b = nextElement == null ? void 0 : nextElement.title) == null ? void 0 : _b.disabled) || ((_c = startElement == null ? void 0 : startElement.control) == null ? void 0 : _c.disabled) && ((_d = nextElement == null ? void 0 : nextElement.control) == null ? void 0 : _d.disabled));
+      return !!(((_b = startElement == null ? void 0 : startElement.title) == null ? void 0 : _b.disabled) && ((_c = nextElement == null ? void 0 : nextElement.title) == null ? void 0 : _c.disabled) || ((_d = startElement == null ? void 0 : startElement.control) == null ? void 0 : _d.disabled) && ((_e = nextElement == null ? void 0 : nextElement.control) == null ? void 0 : _e.disabled));
     }
     const selectionElementList = elementList.slice(startIndex + 1, endIndex + 1);
     return selectionElementList.some((element) => {
@@ -14971,6 +15889,9 @@ class Draw {
       return ((_a2 = element.title) == null ? void 0 : _a2.disabled) || ((_b2 = element.control) == null ? void 0 : _b2.disabled);
     });
   }
+  isDesignMode() {
+    return this.mode === EditorMode.DESIGN;
+  }
   getOriginalWidth() {
     const { paperDirection, width, height } = this.options;
     return paperDirection === PaperDirection.VERTICAL ? width : height;
@@ -15182,6 +16103,15 @@ class Draw {
   getFooterElementList() {
     return this.footer.getElementList();
   }
+  getTd() {
+    const positionContext = this.position.getPositionContext();
+    const { index: index2, trIndex, tdIndex, isTable } = positionContext;
+    if (isTable) {
+      const elementList = this.getOriginalElementList();
+      return elementList[index2].trList[trIndex].tdList[tdIndex];
+    }
+    return null;
+  }
   insertElementList(payload) {
     if (!payload.length || !this.range.getIsCanInput())
       return;
@@ -15246,7 +16176,8 @@ class Draw {
     });
   }
   spliceElementList(elementList, start, deleteCount, ...items) {
-    var _a, _b, _c;
+    var _a, _b, _c, _d;
+    const isDesignMode = this.isDesignMode();
     if (deleteCount > 0) {
       const endIndex = start + deleteCount;
       const endElement = elementList[endIndex];
@@ -15265,10 +16196,11 @@ class Draw {
         }
       }
       if (!this.control.getActiveControl()) {
+        const tdDeletable = (_b = this.getTd()) == null ? void 0 : _b.deletable;
         let deleteIndex = endIndex - 1;
         while (deleteIndex >= start) {
           const deleteElement = elementList[deleteIndex];
-          if (((_b = deleteElement == null ? void 0 : deleteElement.control) == null ? void 0 : _b.deletable) !== false && ((_c = deleteElement == null ? void 0 : deleteElement.title) == null ? void 0 : _c.deletable) !== false) {
+          if (isDesignMode || tdDeletable !== false && ((_c = deleteElement == null ? void 0 : deleteElement.control) == null ? void 0 : _c.deletable) !== false && ((_d = deleteElement == null ? void 0 : deleteElement.title) == null ? void 0 : _d.deletable) !== false) {
             elementList.splice(deleteIndex, 1);
           }
           deleteIndex--;
@@ -15308,6 +16240,9 @@ class Draw {
   getTableTool() {
     return this.tableTool;
   }
+  getTableOperate() {
+    return this.tableOperate;
+  }
   getTableParticle() {
     return this.tableParticle;
   }
@@ -15655,7 +16590,7 @@ class Draw {
   }
   computeRowList(payload) {
     var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
-    const { innerWidth, elementList, isPagingMode = false } = payload;
+    const { innerWidth, elementList, isPagingMode = false, isFromTable = false, startX = 0, startY = 0, pageHeight = 0, mainOuterHeight = 0, surroundElementList = [] } = payload;
     const { defaultSize, defaultRowMargin, scale, table: { tdPadding }, defaultTabWidth } = this.options;
     const defaultBasicRowMarginHeight = this.getDefaultBasicRowMarginHeight();
     const canvas = document.createElement("canvas");
@@ -15673,6 +16608,9 @@ class Draw {
         rowFlex: ((_a = elementList == null ? void 0 : elementList[0]) == null ? void 0 : _a.rowFlex) || ((_b = elementList == null ? void 0 : elementList[1]) == null ? void 0 : _b.rowFlex)
       });
     }
+    let x = startX;
+    let y = startY;
+    let pageNo = 0;
     let listId;
     let listIndex = 0;
     let controlRealWidth = 0;
@@ -15688,8 +16626,9 @@ class Draw {
       };
       const offsetX = curRow.offsetX || element.listId && listStyleMap.get(element.listId) || 0;
       const availableWidth = innerWidth - offsetX;
+      x += curRow.elementList.length === 1 ? offsetX : 0;
       if (element.type === ElementType.IMAGE || element.type === ElementType.LATEX) {
-        if (element.imgDisplay === ImageDisplay.FLOAT_TOP || element.imgDisplay === ImageDisplay.FLOAT_BOTTOM) {
+        if (element.imgDisplay === ImageDisplay.SURROUND || element.imgDisplay === ImageDisplay.FLOAT_TOP || element.imgDisplay === ImageDisplay.FLOAT_BOTTOM) {
           metrics.width = 0;
           metrics.height = 0;
           metrics.boundingBoxDescent = 0;
@@ -15742,6 +16681,7 @@ class Draw {
             const rowList2 = this.computeRowList({
               innerWidth: (td.width - tdPaddingWidth) * scale,
               elementList: td.value,
+              isFromTable: true,
               isPagingMode
             });
             const rowHeight = rowList2.reduce((pre, cur) => pre + cur.height, 0);
@@ -15950,6 +16890,7 @@ class Draw {
       const height = rowMargin + metrics.boundingBoxAscent + metrics.boundingBoxDescent + rowMargin;
       const rowElement = Object.assign(element, {
         metrics,
+        left: 0,
         style: this.getElementFont(element, scale)
       });
       if ((_g = rowElement.control) == null ? void 0 : _g.minWidth) {
@@ -15963,8 +16904,6 @@ class Draw {
             const left2 = Math.min(rowRemainingWidth, extraWidth) * scale;
             rowElement.left = left2;
             curRow.width += left2;
-          } else {
-            rowElement.left = 0;
           }
           controlRealWidth = 0;
         }
@@ -15995,9 +16934,26 @@ class Draw {
         }
       }
       listId = element.listId;
+      const surroundPosition = this.position.setSurroundPosition({
+        pageNo,
+        rowElement,
+        row: curRow,
+        rowElementRect: {
+          x,
+          y,
+          height,
+          width: metrics.width
+        },
+        availableWidth,
+        surroundElementList
+      });
+      x = surroundPosition.x;
+      curRowWidth += surroundPosition.rowIncreaseWidth;
+      x += metrics.width;
       const isForceBreak = element.type === ElementType.SEPARATOR || element.type === ElementType.TABLE || (preElement == null ? void 0 : preElement.type) === ElementType.TABLE || (preElement == null ? void 0 : preElement.type) === ElementType.BLOCK || element.type === ElementType.BLOCK || (preElement == null ? void 0 : preElement.imgDisplay) === ImageDisplay.INLINE || element.imgDisplay === ImageDisplay.INLINE || (preElement == null ? void 0 : preElement.listId) !== element.listId || i !== 0 && element.value === ZERO;
       const isWidthNotEnough = curRowWidth > availableWidth;
-      if (isForceBreak || isWidthNotEnough) {
+      const isWrap = isForceBreak || isWidthNotEnough;
+      if (isWrap) {
         const row = {
           width: metrics.width,
           height,
@@ -16038,9 +16994,9 @@ class Draw {
         }
         curRow.elementList.push(rowElement);
       }
-      if (isForceBreak || isWidthNotEnough || i === elementList.length - 1) {
+      if (isWrap || i === elementList.length - 1) {
         curRow.isWidthNotEnough = isWidthNotEnough && !isForceBreak;
-        if ((preElement == null ? void 0 : preElement.rowFlex) === RowFlex.JUSTIFY || (preElement == null ? void 0 : preElement.rowFlex) === RowFlex.ALIGNMENT && isWidthNotEnough) {
+        if (!curRow.isSurround && ((preElement == null ? void 0 : preElement.rowFlex) === RowFlex.JUSTIFY || (preElement == null ? void 0 : preElement.rowFlex) === RowFlex.ALIGNMENT && isWidthNotEnough)) {
           const rowElementList = ((_k = curRow.elementList[0]) == null ? void 0 : _k.value) === ZERO ? curRow.elementList.slice(1) : curRow.elementList;
           const gap = (availableWidth - curRow.width) / (rowElementList.length - 1);
           for (let e = 0; e < rowElementList.length - 1; e++) {
@@ -16050,6 +17006,32 @@ class Draw {
           curRow.width = availableWidth;
         }
       }
+      if (isWrap) {
+        x = startX;
+        y += curRow.height;
+        if (isPagingMode && !isFromTable && pageHeight && (y - startY + mainOuterHeight + height > pageHeight || element.type === ElementType.PAGE_BREAK)) {
+          y = startY;
+          deleteSurroundElementList(surroundElementList, pageNo);
+          pageNo += 1;
+        }
+        rowElement.left = 0;
+        const nextRow = rowList[rowList.length - 1];
+        const surroundPosition2 = this.position.setSurroundPosition({
+          pageNo,
+          rowElement,
+          row: nextRow,
+          rowElementRect: {
+            x,
+            y,
+            height,
+            width: metrics.width
+          },
+          availableWidth,
+          surroundElementList
+        });
+        x = surroundPosition2.x;
+        x += metrics.width;
+      }
     }
     return rowList;
   }
@@ -16096,18 +17078,22 @@ class Draw {
     return pageRowList;
   }
   _drawHighlight(ctx, payload) {
+    var _a;
+    const { control: { activeBackgroundColor } } = this.options;
     const { rowList, positionList } = payload;
+    const activeControlElement = (_a = this.control.getActiveControl()) == null ? void 0 : _a.getElement();
     for (let i = 0; i < rowList.length; i++) {
       const curRow = rowList[i];
       for (let j = 0; j < curRow.elementList.length; j++) {
         const element = curRow.elementList[j];
         const preElement = curRow.elementList[j - 1];
-        if (element.highlight) {
+        if (element.highlight || activeBackgroundColor && activeControlElement && element.controlId === activeControlElement.controlId && !this.control.getIsRangeInPostfix()) {
           if (preElement && preElement.highlight && preElement.highlight !== element.highlight) {
             this.highlight.render(ctx);
           }
           const { coordinate: { leftTop: [x, y] } } = positionList[curRow.startIndex + j];
-          this.highlight.recordFillInfo(ctx, x, y, element.metrics.width, curRow.height, element.highlight);
+          const offsetX = element.left || 0;
+          this.highlight.recordFillInfo(ctx, x - offsetX, y, element.metrics.width + offsetX, curRow.height, element.highlight || activeBackgroundColor);
         } else if (preElement == null ? void 0 : preElement.highlight) {
           this.highlight.render(ctx);
         }
@@ -16139,7 +17125,7 @@ class Draw {
         const preElement = curRow.elementList[j - 1];
         if (element.type === ElementType.IMAGE) {
           this.textParticle.complete();
-          if (element.imgDisplay !== ImageDisplay.FLOAT_TOP && element.imgDisplay !== ImageDisplay.FLOAT_BOTTOM) {
+          if (element.imgDisplay !== ImageDisplay.SURROUND && element.imgDisplay !== ImageDisplay.FLOAT_TOP && element.imgDisplay !== ImageDisplay.FLOAT_BOTTOM) {
             this.imageParticle.render(ctx, element, x, y + offsetY);
           }
         } else if (element.type === ElementType.LATEX) {
@@ -16329,11 +17315,11 @@ class Draw {
   _drawFloat(ctx, payload) {
     const { scale } = this.options;
     const floatPositionList = this.position.getFloatPositionList();
-    const { imgDisplay, pageNo } = payload;
+    const { imgDisplays, pageNo } = payload;
     for (let e = 0; e < floatPositionList.length; e++) {
       const floatPosition = floatPositionList[e];
       const element = floatPosition.element;
-      if ((pageNo === floatPosition.pageNo || floatPosition.zone === EditorZone.HEADER || floatPosition.zone == EditorZone.FOOTER) && element.imgDisplay === imgDisplay && element.type === ElementType.IMAGE) {
+      if ((pageNo === floatPosition.pageNo || floatPosition.zone === EditorZone.HEADER || floatPosition.zone == EditorZone.FOOTER) && element.imgDisplay && imgDisplays.includes(element.imgDisplay) && element.type === ElementType.IMAGE) {
         const imgFloatPosition = element.imgFloatPosition;
         this.imageParticle.render(ctx, element, imgFloatPosition.x * scale, imgFloatPosition.y * scale);
       }
@@ -16359,7 +17345,7 @@ class Draw {
     }
     this._drawFloat(ctx, {
       pageNo,
-      imgDisplay: ImageDisplay.FLOAT_BOTTOM
+      imgDisplays: [ImageDisplay.FLOAT_BOTTOM]
     });
     this.control.renderHighlightList(ctx, pageNo);
     const index2 = (_a = rowList[0]) == null ? void 0 : _a.startIndex;
@@ -16385,7 +17371,7 @@ class Draw {
     }
     this._drawFloat(ctx, {
       pageNo,
-      imgDisplay: ImageDisplay.FLOAT_TOP
+      imgDisplays: [ImageDisplay.FLOAT_TOP, ImageDisplay.SURROUND]
     });
     if (this.search.getSearchKeyword()) {
       this.search.render(ctx, pageNo);
@@ -16456,9 +17442,21 @@ class Draw {
           this.footer.compute();
         }
       }
+      const margins = this.getMargins();
+      const pageHeight = this.getHeight();
+      const extraHeight = this.header.getExtraHeight();
+      const mainOuterHeight = this.getMainOuterHeight();
+      const startX = margins[3];
+      const startY = margins[0] + extraHeight;
+      const surroundElementList = pickSurroundElementList(this.elementList);
       this.rowList = this.computeRowList({
+        startX,
+        startY,
+        pageHeight,
+        mainOuterHeight,
         isPagingMode,
         innerWidth,
+        surroundElementList,
         elementList: this.elementList
       });
       this.pageRowList = this._computePageList();
@@ -16683,6 +17681,7 @@ class Command {
     __publicField(this, "executeInsertControl");
     __publicField(this, "executeUpdateOptions");
     __publicField(this, "executeInsertTitle");
+    __publicField(this, "executeFocus");
     __publicField(this, "getCatalog");
     __publicField(this, "getImage");
     __publicField(this, "getOptions");
@@ -16792,6 +17791,7 @@ class Command {
     this.executeSetZone = adapt.setZone.bind(adapt);
     this.executeUpdateOptions = adapt.updateOptions.bind(adapt);
     this.executeInsertTitle = adapt.insertTitle.bind(adapt);
+    this.executeFocus = adapt.focus.bind(adapt);
     this.getImage = adapt.getImage.bind(adapt);
     this.getOptions = adapt.getOptions.bind(adapt);
     this.getValue = adapt.getValue.bind(adapt);
@@ -16851,7 +17851,8 @@ const defaultControlOption = {
   prefix: "{",
   postfix: "}",
   borderWidth: 1,
-  borderColor: "#000000"
+  borderColor: "#000000",
+  activeBackgroundColor: ""
 };
 const defaultFooterOption = {
   bottom: 30,
@@ -17085,32 +18086,32 @@ class CommandAdapt {
     __publicField(this, "position");
     __publicField(this, "historyManager");
     __publicField(this, "canvasEvent");
-    __publicField(this, "tableTool");
     __publicField(this, "options");
     __publicField(this, "control");
     __publicField(this, "workerManager");
     __publicField(this, "searchManager");
     __publicField(this, "i18n");
     __publicField(this, "zone");
+    __publicField(this, "tableOperate");
     this.draw = draw;
     this.range = draw.getRange();
     this.position = draw.getPosition();
     this.historyManager = draw.getHistoryManager();
     this.canvasEvent = draw.getCanvasEvent();
-    this.tableTool = draw.getTableTool();
     this.options = draw.getOptions();
     this.control = draw.getControl();
     this.workerManager = draw.getWorkerManager();
     this.searchManager = draw.getSearch();
     this.i18n = draw.getI18n();
     this.zone = draw.getZone();
+    this.tableOperate = draw.getTableOperate();
   }
   mode(payload) {
     this.draw.setMode(payload);
   }
   cut() {
-    const isReadonly = this.draw.isReadonly();
-    if (isReadonly)
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
+    if (isDisabled)
       return;
     this.canvasEvent.cut();
   }
@@ -17118,8 +18119,8 @@ class CommandAdapt {
     this.canvasEvent.copy();
   }
   paste(payload) {
-    const isReadonly = this.draw.isReadonly();
-    if (isReadonly)
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
+    if (isDisabled)
       return;
     pasteByApi(this.canvasEvent, payload);
   }
@@ -17127,8 +18128,8 @@ class CommandAdapt {
     this.canvasEvent.selectAll();
   }
   backspace() {
-    const isReadonly = this.draw.isReadonly();
-    if (isReadonly)
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
+    if (isDisabled)
       return;
     const elementList = this.draw.getElementList();
     const { startIndex, endIndex } = this.range.getRange();
@@ -17418,137 +18419,42 @@ class CommandAdapt {
         enterElement.bold = !enterElement.bold;
         this.draw.render({ curIndex: endIndex, isCompute: false });
       }
-    }
-  }
-  italic() {
-    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
-    if (isDisabled)
-      return;
-    const selection = this.range.getSelectionElementList();
-    if (selection == null ? void 0 : selection.length) {
-      const noItalicIndex = selection.findIndex((s) => !s.italic);
-      selection.forEach((el) => {
-        el.italic = !!~noItalicIndex;
-      });
-      this.draw.render({ isSetCursor: false });
-    } else {
-      const { endIndex } = this.range.getRange();
-      const elementList = this.draw.getElementList();
-      const enterElement = elementList[endIndex];
-      if ((enterElement == null ? void 0 : enterElement.value) === ZERO) {
-        enterElement.italic = !enterElement.italic;
-        this.draw.render({ curIndex: endIndex, isCompute: false });
-      }
-    }
-  }
-  underline(textDecoration) {
-    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
-    if (isDisabled)
-      return;
-    const selection = this.range.getSelectionElementList();
-    if (selection == null ? void 0 : selection.length) {
-      const isSetUnderline = selection.some((s) => !s.underline || !textDecoration && s.textDecoration || textDecoration && !s.textDecoration || textDecoration && s.textDecoration && !isObjectEqual(s.textDecoration, textDecoration));
-      selection.forEach((el) => {
-        el.underline = isSetUnderline;
-        if (isSetUnderline && textDecoration) {
-          el.textDecoration = textDecoration;
-        } else {
-          delete el.textDecoration;
-        }
-      });
-      this.draw.render({
-        isSetCursor: false,
-        isCompute: false
-      });
-    } else {
-      const { endIndex } = this.range.getRange();
-      const elementList = this.draw.getElementList();
-      const enterElement = elementList[endIndex];
-      if ((enterElement == null ? void 0 : enterElement.value) === ZERO) {
-        enterElement.underline = !enterElement.underline;
-        this.draw.render({ curIndex: endIndex, isCompute: false });
-      }
-    }
-  }
-  strikeout() {
-    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
-    if (isDisabled)
-      return;
-    const selection = this.range.getSelectionElementList();
-    if (selection == null ? void 0 : selection.length) {
-      const noStrikeoutIndex = selection.findIndex((s) => !s.strikeout);
-      selection.forEach((el) => {
-        el.strikeout = !!~noStrikeoutIndex;
-      });
-      this.draw.render({
-        isSetCursor: false,
-        isCompute: false
-      });
-    } else {
-      const { endIndex } = this.range.getRange();
-      const elementList = this.draw.getElementList();
-      const enterElement = elementList[endIndex];
-      if ((enterElement == null ? void 0 : enterElement.value) === ZERO) {
-        enterElement.strikeout = !enterElement.strikeout;
-        this.draw.render({ curIndex: endIndex, isCompute: false });
-      }
-    }
-  }
-  superscript() {
-    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
-    if (isDisabled)
-      return;
-    const selection = this.range.getSelectionElementList();
-    if (!selection)
-      return;
-    const superscriptIndex = selection.findIndex((s) => s.type === ElementType.SUPERSCRIPT);
-    selection.forEach((el) => {
-      if (~superscriptIndex) {
-        if (el.type === ElementType.SUPERSCRIPT) {
-          el.type = ElementType.TEXT;
-          delete el.actualSize;
-        }
-      } else {
-        if (!el.type || el.type === ElementType.TEXT || el.type === ElementType.SUBSCRIPT) {
-          el.type = ElementType.SUPERSCRIPT;
-        }
-      }
-    });
-    this.draw.render({ isSetCursor: false });
-  }
-  subscript() {
-    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
-    if (isDisabled)
-      return;
-    const selection = this.range.getSelectionElementList();
-    if (!selection)
-      return;
-    const subscriptIndex = selection.findIndex((s) => s.type === ElementType.SUBSCRIPT);
-    selection.forEach((el) => {
-      if (~subscriptIndex) {
-        if (el.type === ElementType.SUBSCRIPT) {
-          el.type = ElementType.TEXT;
-          delete el.actualSize;
-        }
-      } else {
-        if (!el.type || el.type === ElementType.TEXT || el.type === ElementType.SUPERSCRIPT) {
-          el.type = ElementType.SUBSCRIPT;
-        }
-      }
-    });
-    this.draw.render({ isSetCursor: false });
+    }
   }
-  color(payload) {
+  italic() {
     const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
     if (isDisabled)
       return;
     const selection = this.range.getSelectionElementList();
     if (selection == null ? void 0 : selection.length) {
+      const noItalicIndex = selection.findIndex((s) => !s.italic);
       selection.forEach((el) => {
-        if (payload) {
-          el.color = payload;
+        el.italic = !!~noItalicIndex;
+      });
+      this.draw.render({ isSetCursor: false });
+    } else {
+      const { endIndex } = this.range.getRange();
+      const elementList = this.draw.getElementList();
+      const enterElement = elementList[endIndex];
+      if ((enterElement == null ? void 0 : enterElement.value) === ZERO) {
+        enterElement.italic = !enterElement.italic;
+        this.draw.render({ curIndex: endIndex, isCompute: false });
+      }
+    }
+  }
+  underline(textDecoration) {
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
+    if (isDisabled)
+      return;
+    const selection = this.range.getSelectionElementList();
+    if (selection == null ? void 0 : selection.length) {
+      const isSetUnderline = selection.some((s) => !s.underline || !textDecoration && s.textDecoration || textDecoration && !s.textDecoration || textDecoration && s.textDecoration && !isObjectEqual(s.textDecoration, textDecoration));
+      selection.forEach((el) => {
+        el.underline = isSetUnderline;
+        if (isSetUnderline && textDecoration) {
+          el.textDecoration = textDecoration;
         } else {
-          delete el.color;
+          delete el.textDecoration;
         }
       });
       this.draw.render({
@@ -17560,27 +18466,20 @@ class CommandAdapt {
       const elementList = this.draw.getElementList();
       const enterElement = elementList[endIndex];
       if ((enterElement == null ? void 0 : enterElement.value) === ZERO) {
-        if (payload) {
-          enterElement.color = payload;
-        } else {
-          delete enterElement.color;
-        }
+        enterElement.underline = !enterElement.underline;
         this.draw.render({ curIndex: endIndex, isCompute: false });
       }
     }
   }
-  highlight(payload) {
+  strikeout() {
     const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
     if (isDisabled)
       return;
     const selection = this.range.getSelectionElementList();
     if (selection == null ? void 0 : selection.length) {
+      const noStrikeoutIndex = selection.findIndex((s) => !s.strikeout);
       selection.forEach((el) => {
-        if (payload) {
-          el.highlight = payload;
-        } else {
-          delete el.highlight;
-        }
+        el.strikeout = !!~noStrikeoutIndex;
       });
       this.draw.render({
         isSetCursor: false,
@@ -17591,831 +18490,293 @@ class CommandAdapt {
       const elementList = this.draw.getElementList();
       const enterElement = elementList[endIndex];
       if ((enterElement == null ? void 0 : enterElement.value) === ZERO) {
-        if (payload) {
-          enterElement.highlight = payload;
-        } else {
-          delete enterElement.highlight;
-        }
+        enterElement.strikeout = !enterElement.strikeout;
         this.draw.render({ curIndex: endIndex, isCompute: false });
       }
     }
   }
-  title(payload) {
-    const isReadonly = this.draw.isReadonly();
-    if (isReadonly)
-      return;
-    const { startIndex, endIndex } = this.range.getRange();
-    if (!~startIndex && !~endIndex)
+  superscript() {
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
+    if (isDisabled)
       return;
-    const elementList = this.draw.getElementList();
-    const changeElementList = startIndex === endIndex ? this.range.getRangeParagraphElementList() : elementList.slice(startIndex + 1, endIndex + 1);
-    if (!changeElementList || !changeElementList.length)
+    const selection = this.range.getSelectionElementList();
+    if (!selection)
       return;
-    const titleId = getUUID();
-    const titleOptions = this.draw.getOptions().title;
-    changeElementList.forEach((el) => {
-      if (!el.type && el.value === ZERO)
-        return;
-      if (payload) {
-        el.level = payload;
-        el.titleId = titleId;
-        if (isTextLikeElement(el)) {
-          el.size = titleOptions[titleSizeMapping[payload]];
-          el.bold = true;
+    const superscriptIndex = selection.findIndex((s) => s.type === ElementType.SUPERSCRIPT);
+    selection.forEach((el) => {
+      if (~superscriptIndex) {
+        if (el.type === ElementType.SUPERSCRIPT) {
+          el.type = ElementType.TEXT;
+          delete el.actualSize;
         }
       } else {
-        if (el.titleId) {
-          delete el.titleId;
-          delete el.title;
-          delete el.level;
-          delete el.size;
-          delete el.bold;
-        }
-      }
-    });
-    const isSetCursor = startIndex === endIndex;
-    const curIndex = isSetCursor ? endIndex : startIndex;
-    this.draw.render({ curIndex, isSetCursor });
-  }
-  list(listType, listStyle) {
-    const isReadonly = this.draw.isReadonly();
-    if (isReadonly)
-      return;
-    this.draw.getListParticle().setList(listType, listStyle);
-  }
-  rowFlex(payload) {
-    const isReadonly = this.draw.isReadonly();
-    if (isReadonly)
-      return;
-    const { startIndex, endIndex } = this.range.getRange();
-    if (!~startIndex && !~endIndex)
-      return;
-    const rowElementList = this.range.getRangeRowElementList();
-    if (!rowElementList)
-      return;
-    rowElementList.forEach((element) => {
-      element.rowFlex = payload;
-    });
-    const isSetCursor = startIndex === endIndex;
-    const curIndex = isSetCursor ? endIndex : startIndex;
-    this.draw.render({ curIndex, isSetCursor });
-  }
-  rowMargin(payload) {
-    const isReadonly = this.draw.isReadonly();
-    if (isReadonly)
-      return;
-    const { startIndex, endIndex } = this.range.getRange();
-    if (!~startIndex && !~endIndex)
-      return;
-    const rowElementList = this.range.getRangeRowElementList();
-    if (!rowElementList)
-      return;
-    rowElementList.forEach((element) => {
-      element.rowMargin = payload;
-    });
-    const isSetCursor = startIndex === endIndex;
-    const curIndex = isSetCursor ? endIndex : startIndex;
-    this.draw.render({ curIndex, isSetCursor });
-  }
-  insertTable(row, col) {
-    var _a;
-    const isReadonly = this.draw.isReadonly();
-    if (isReadonly)
-      return;
-    const activeControl = this.control.getActiveControl();
-    if (activeControl)
-      return;
-    const { startIndex, endIndex } = this.range.getRange();
-    if (!~startIndex && !~endIndex)
-      return;
-    const { defaultTrMinHeight } = this.options.table;
-    const elementList = this.draw.getElementList();
-    let offsetX = 0;
-    if ((_a = elementList[startIndex]) == null ? void 0 : _a.listId) {
-      const positionList = this.position.getPositionList();
-      const { rowIndex } = positionList[startIndex];
-      const rowList = this.draw.getRowList();
-      const row2 = rowList[rowIndex];
-      offsetX = (row2 == null ? void 0 : row2.offsetX) || 0;
-    }
-    const innerWidth = this.draw.getContextInnerWidth() - offsetX;
-    const colgroup = [];
-    const colWidth = innerWidth / col;
-    for (let c = 0; c < col; c++) {
-      colgroup.push({
-        width: colWidth
-      });
-    }
-    const trList = [];
-    for (let r = 0; r < row; r++) {
-      const tdList = [];
-      const tr = {
-        height: defaultTrMinHeight,
-        tdList
-      };
-      for (let c = 0; c < col; c++) {
-        tdList.push({
-          colspan: 1,
-          rowspan: 1,
-          value: []
-        });
-      }
-      trList.push(tr);
-    }
-    const element = {
-      type: ElementType.TABLE,
-      value: "",
-      colgroup,
-      trList
-    };
-    formatElementList([element], {
-      editorOptions: this.options
-    });
-    formatElementContext(elementList, [element], startIndex);
-    const curIndex = startIndex + 1;
-    this.draw.spliceElementList(elementList, curIndex, startIndex === endIndex ? 0 : endIndex - startIndex, element);
-    this.range.setRange(curIndex, curIndex);
-    this.draw.render({ curIndex, isSetCursor: false });
-  }
-  insertTableTopRow() {
-    const isReadonly = this.draw.isReadonly();
-    if (isReadonly)
-      return;
-    const positionContext = this.position.getPositionContext();
-    if (!positionContext.isTable)
-      return;
-    const { index: index2, trIndex, tableId } = positionContext;
-    const originalElementList = this.draw.getOriginalElementList();
-    const element = originalElementList[index2];
-    const curTrList = element.trList;
-    const curTr = curTrList[trIndex];
-    if (curTr.tdList.length < element.colgroup.length) {
-      const curTrNo = curTr.tdList[0].rowIndex;
-      for (let t = 0; t < trIndex; t++) {
-        const tr = curTrList[t];
-        for (let d = 0; d < tr.tdList.length; d++) {
-          const td = tr.tdList[d];
-          if (td.rowspan > 1 && td.rowIndex + td.rowspan >= curTrNo + 1) {
-            td.rowspan += 1;
-          }
+        if (!el.type || el.type === ElementType.TEXT || el.type === ElementType.SUBSCRIPT) {
+          el.type = ElementType.SUPERSCRIPT;
         }
-      }
-    }
-    const newTrId = getUUID();
-    const newTr = {
-      height: curTr.height,
-      id: newTrId,
-      tdList: []
-    };
-    for (let t = 0; t < curTr.tdList.length; t++) {
-      const curTd = curTr.tdList[t];
-      const newTdId = getUUID();
-      newTr.tdList.push({
-        id: newTdId,
-        rowspan: 1,
-        colspan: curTd.colspan,
-        value: [
-          {
-            value: ZERO,
-            size: 16,
-            tableId,
-            trId: newTrId,
-            tdId: newTdId
-          }
-        ]
-      });
-    }
-    curTrList.splice(trIndex, 0, newTr);
-    this.position.setPositionContext({
-      isTable: true,
-      index: index2,
-      trIndex,
-      tdIndex: 0,
-      tdId: newTr.tdList[0].id,
-      trId: newTr.id,
-      tableId
+      }
     });
-    this.range.setRange(0, 0);
-    this.draw.render({ curIndex: 0 });
-    this.tableTool.render();
+    this.draw.render({ isSetCursor: false });
   }
-  insertTableBottomRow() {
-    const isReadonly = this.draw.isReadonly();
-    if (isReadonly)
+  subscript() {
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
+    if (isDisabled)
       return;
-    const positionContext = this.position.getPositionContext();
-    if (!positionContext.isTable)
+    const selection = this.range.getSelectionElementList();
+    if (!selection)
       return;
-    const { index: index2, trIndex, tableId } = positionContext;
-    const originalElementList = this.draw.getOriginalElementList();
-    const element = originalElementList[index2];
-    const curTrList = element.trList;
-    const curTr = curTrList[trIndex];
-    const anchorTr = curTrList.length - 1 === trIndex ? curTr : curTrList[trIndex + 1];
-    if (anchorTr.tdList.length < element.colgroup.length) {
-      const curTrNo = anchorTr.tdList[0].rowIndex;
-      for (let t = 0; t < trIndex + 1; t++) {
-        const tr = curTrList[t];
-        for (let d = 0; d < tr.tdList.length; d++) {
-          const td = tr.tdList[d];
-          if (td.rowspan > 1 && td.rowIndex + td.rowspan >= curTrNo + 1) {
-            td.rowspan += 1;
-          }
+    const subscriptIndex = selection.findIndex((s) => s.type === ElementType.SUBSCRIPT);
+    selection.forEach((el) => {
+      if (~subscriptIndex) {
+        if (el.type === ElementType.SUBSCRIPT) {
+          el.type = ElementType.TEXT;
+          delete el.actualSize;
+        }
+      } else {
+        if (!el.type || el.type === ElementType.TEXT || el.type === ElementType.SUPERSCRIPT) {
+          el.type = ElementType.SUBSCRIPT;
         }
       }
-    }
-    const newTrId = getUUID();
-    const newTr = {
-      height: anchorTr.height,
-      id: newTrId,
-      tdList: []
-    };
-    for (let t = 0; t < anchorTr.tdList.length; t++) {
-      const curTd = anchorTr.tdList[t];
-      const newTdId = getUUID();
-      newTr.tdList.push({
-        id: newTdId,
-        rowspan: 1,
-        colspan: curTd.colspan,
-        value: [
-          {
-            value: ZERO,
-            size: 16,
-            tableId,
-            trId: newTrId,
-            tdId: newTdId
-          }
-        ]
-      });
-    }
-    curTrList.splice(trIndex + 1, 0, newTr);
-    this.position.setPositionContext({
-      isTable: true,
-      index: index2,
-      trIndex: trIndex + 1,
-      tdIndex: 0,
-      tdId: newTr.tdList[0].id,
-      trId: newTr.id,
-      tableId
     });
-    this.range.setRange(0, 0);
-    this.draw.render({ curIndex: 0 });
-    this.tableTool.render();
+    this.draw.render({ isSetCursor: false });
   }
-  insertTableLeftCol() {
-    const isReadonly = this.draw.isReadonly();
-    if (isReadonly)
-      return;
-    const positionContext = this.position.getPositionContext();
-    if (!positionContext.isTable)
+  color(payload) {
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
+    if (isDisabled)
       return;
-    const { index: index2, tdIndex, tableId } = positionContext;
-    const originalElementList = this.draw.getOriginalElementList();
-    const element = originalElementList[index2];
-    const curTrList = element.trList;
-    const curTdIndex = tdIndex;
-    for (let t = 0; t < curTrList.length; t++) {
-      const tr = curTrList[t];
-      const tdId = getUUID();
-      tr.tdList.splice(curTdIndex, 0, {
-        id: tdId,
-        rowspan: 1,
-        colspan: 1,
-        value: [
-          {
-            value: ZERO,
-            size: 16,
-            tableId,
-            trId: tr.id,
-            tdId
-          }
-        ]
+    const selection = this.range.getSelectionElementList();
+    if (selection == null ? void 0 : selection.length) {
+      selection.forEach((el) => {
+        if (payload) {
+          el.color = payload;
+        } else {
+          delete el.color;
+        }
       });
-    }
-    const colgroup = element.colgroup;
-    colgroup.splice(curTdIndex, 0, {
-      width: this.options.table.defaultColMinWidth
-    });
-    const colgroupWidth = colgroup.reduce((pre, cur) => pre + cur.width, 0);
-    const width = this.draw.getOriginalInnerWidth();
-    if (colgroupWidth > width) {
-      const adjustWidth = (colgroupWidth - width) / colgroup.length;
-      for (let g = 0; g < colgroup.length; g++) {
-        const group2 = colgroup[g];
-        group2.width -= adjustWidth;
+      this.draw.render({
+        isSetCursor: false,
+        isCompute: false
+      });
+    } else {
+      const { endIndex } = this.range.getRange();
+      const elementList = this.draw.getElementList();
+      const enterElement = elementList[endIndex];
+      if ((enterElement == null ? void 0 : enterElement.value) === ZERO) {
+        if (payload) {
+          enterElement.color = payload;
+        } else {
+          delete enterElement.color;
+        }
+        this.draw.render({ curIndex: endIndex, isCompute: false });
       }
     }
-    this.position.setPositionContext({
-      isTable: true,
-      index: index2,
-      trIndex: 0,
-      tdIndex: curTdIndex,
-      tdId: curTrList[0].tdList[curTdIndex].id,
-      trId: curTrList[0].id,
-      tableId
-    });
-    this.range.setRange(0, 0);
-    this.draw.render({ curIndex: 0 });
-    this.tableTool.render();
   }
-  insertTableRightCol() {
-    const isReadonly = this.draw.isReadonly();
-    if (isReadonly)
-      return;
-    const positionContext = this.position.getPositionContext();
-    if (!positionContext.isTable)
+  highlight(payload) {
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
+    if (isDisabled)
       return;
-    const { index: index2, tdIndex, tableId } = positionContext;
-    const originalElementList = this.draw.getOriginalElementList();
-    const element = originalElementList[index2];
-    const curTrList = element.trList;
-    const curTdIndex = tdIndex + 1;
-    for (let t = 0; t < curTrList.length; t++) {
-      const tr = curTrList[t];
-      const tdId = getUUID();
-      tr.tdList.splice(curTdIndex, 0, {
-        id: tdId,
-        rowspan: 1,
-        colspan: 1,
-        value: [
-          {
-            value: ZERO,
-            size: 16,
-            tableId,
-            trId: tr.id,
-            tdId
-          }
-        ]
+    const selection = this.range.getSelectionElementList();
+    if (selection == null ? void 0 : selection.length) {
+      selection.forEach((el) => {
+        if (payload) {
+          el.highlight = payload;
+        } else {
+          delete el.highlight;
+        }
       });
-    }
-    const colgroup = element.colgroup;
-    colgroup.splice(curTdIndex, 0, {
-      width: this.options.table.defaultColMinWidth
-    });
-    const colgroupWidth = colgroup.reduce((pre, cur) => pre + cur.width, 0);
-    const width = this.draw.getOriginalInnerWidth();
-    if (colgroupWidth > width) {
-      const adjustWidth = (colgroupWidth - width) / colgroup.length;
-      for (let g = 0; g < colgroup.length; g++) {
-        const group2 = colgroup[g];
-        group2.width -= adjustWidth;
+      this.draw.render({
+        isSetCursor: false,
+        isCompute: false
+      });
+    } else {
+      const { endIndex } = this.range.getRange();
+      const elementList = this.draw.getElementList();
+      const enterElement = elementList[endIndex];
+      if ((enterElement == null ? void 0 : enterElement.value) === ZERO) {
+        if (payload) {
+          enterElement.highlight = payload;
+        } else {
+          delete enterElement.highlight;
+        }
+        this.draw.render({ curIndex: endIndex, isCompute: false });
       }
     }
-    this.position.setPositionContext({
-      isTable: true,
-      index: index2,
-      trIndex: 0,
-      tdIndex: curTdIndex,
-      tdId: curTrList[0].tdList[curTdIndex].id,
-      trId: curTrList[0].id,
-      tableId
+  }
+  title(payload) {
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
+    if (isDisabled)
+      return;
+    const { startIndex, endIndex } = this.range.getRange();
+    if (!~startIndex && !~endIndex)
+      return;
+    const elementList = this.draw.getElementList();
+    const changeElementList = startIndex === endIndex ? this.range.getRangeParagraphElementList() : elementList.slice(startIndex + 1, endIndex + 1);
+    if (!changeElementList || !changeElementList.length)
+      return;
+    const titleId = getUUID();
+    const titleOptions = this.draw.getOptions().title;
+    changeElementList.forEach((el) => {
+      if (!el.type && el.value === ZERO)
+        return;
+      if (payload) {
+        el.level = payload;
+        el.titleId = titleId;
+        if (isTextLikeElement(el)) {
+          el.size = titleOptions[titleSizeMapping[payload]];
+          el.bold = true;
+        }
+      } else {
+        if (el.titleId) {
+          delete el.titleId;
+          delete el.title;
+          delete el.level;
+          delete el.size;
+          delete el.bold;
+        }
+      }
     });
-    this.range.setRange(0, 0);
-    this.draw.render({ curIndex: 0 });
-    this.tableTool.render();
+    const isSetCursor = startIndex === endIndex;
+    const curIndex = isSetCursor ? endIndex : startIndex;
+    this.draw.render({ curIndex, isSetCursor });
   }
-  deleteTableRow() {
+  list(listType, listStyle) {
     const isReadonly = this.draw.isReadonly();
     if (isReadonly)
       return;
-    const positionContext = this.position.getPositionContext();
-    if (!positionContext.isTable)
+    this.draw.getListParticle().setList(listType, listStyle);
+  }
+  rowFlex(payload) {
+    const isReadonly = this.draw.isReadonly();
+    if (isReadonly)
       return;
-    const { index: index2, trIndex, tdIndex } = positionContext;
-    const originalElementList = this.draw.getOriginalElementList();
-    const element = originalElementList[index2];
-    const trList = element.trList;
-    const curTr = trList[trIndex];
-    const curTdRowIndex = curTr.tdList[tdIndex].rowIndex;
-    if (trList.length <= 1) {
-      this.deleteTable();
+    const { startIndex, endIndex } = this.range.getRange();
+    if (!~startIndex && !~endIndex)
       return;
-    }
-    for (let r = 0; r < curTdRowIndex; r++) {
-      const tr = trList[r];
-      const tdList = tr.tdList;
-      for (let d = 0; d < tdList.length; d++) {
-        const td = tdList[d];
-        if (td.rowIndex + td.rowspan > curTdRowIndex) {
-          td.rowspan--;
-        }
-      }
-    }
-    for (let d = 0; d < curTr.tdList.length; d++) {
-      const td = curTr.tdList[d];
-      if (td.rowspan > 1) {
-        const tdId = getUUID();
-        const nextTr = trList[trIndex + 1];
-        nextTr.tdList.splice(d, 0, {
-          id: tdId,
-          rowspan: td.rowspan - 1,
-          colspan: td.colspan,
-          value: [
-            {
-              value: ZERO,
-              size: 16,
-              tableId: element.id,
-              trId: nextTr.id,
-              tdId
-            }
-          ]
-        });
-      }
-    }
-    trList.splice(trIndex, 1);
-    this.position.setPositionContext({
-      isTable: false
-    });
-    this.range.clearRange();
-    this.draw.render({
-      curIndex: positionContext.index
+    const rowElementList = this.range.getRangeRowElementList();
+    if (!rowElementList)
+      return;
+    rowElementList.forEach((element) => {
+      element.rowFlex = payload;
     });
-    this.tableTool.dispose();
+    const isSetCursor = startIndex === endIndex;
+    const curIndex = isSetCursor ? endIndex : startIndex;
+    this.draw.render({ curIndex, isSetCursor });
   }
-  deleteTableCol() {
-    var _a;
+  rowMargin(payload) {
     const isReadonly = this.draw.isReadonly();
     if (isReadonly)
       return;
-    const positionContext = this.position.getPositionContext();
-    if (!positionContext.isTable)
+    const { startIndex, endIndex } = this.range.getRange();
+    if (!~startIndex && !~endIndex)
       return;
-    const { index: index2, tdIndex, trIndex } = positionContext;
-    const originalElementList = this.draw.getOriginalElementList();
-    const element = originalElementList[index2];
-    const curTrList = element.trList;
-    const curTd = curTrList[trIndex].tdList[tdIndex];
-    const curColIndex = curTd.colIndex;
-    const moreTdTr = curTrList.find((tr) => tr.tdList.length > 1);
-    if (!moreTdTr) {
-      this.deleteTable();
+    const rowElementList = this.range.getRangeRowElementList();
+    if (!rowElementList)
       return;
-    }
-    for (let t = 0; t < curTrList.length; t++) {
-      const tr = curTrList[t];
-      for (let d = 0; d < tr.tdList.length; d++) {
-        const td = tr.tdList[d];
-        if (td.colIndex <= curColIndex && td.colIndex + td.colspan > curColIndex) {
-          if (td.colspan > 1) {
-            td.colspan--;
-          } else {
-            tr.tdList.splice(d, 1);
-          }
-        }
-      }
-    }
-    (_a = element.colgroup) == null ? void 0 : _a.splice(curColIndex, 1);
-    this.position.setPositionContext({
-      isTable: false
-    });
-    this.range.setRange(0, 0);
-    this.draw.render({
-      curIndex: positionContext.index
+    rowElementList.forEach((element) => {
+      element.rowMargin = payload;
     });
-    this.tableTool.dispose();
+    const isSetCursor = startIndex === endIndex;
+    const curIndex = isSetCursor ? endIndex : startIndex;
+    this.draw.render({ curIndex, isSetCursor });
   }
-  deleteTable() {
+  insertTable(row, col) {
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
+    if (isDisabled)
+      return;
+    const activeControl = this.control.getActiveControl();
+    if (activeControl)
+      return;
+    this.tableOperate.insertTable(row, col);
+  }
+  insertTableTopRow() {
     const isReadonly = this.draw.isReadonly();
     if (isReadonly)
       return;
-    const positionContext = this.position.getPositionContext();
-    if (!positionContext.isTable)
-      return;
-    const originalElementList = this.draw.getOriginalElementList();
-    originalElementList.splice(positionContext.index, 1);
-    const curIndex = positionContext.index - 1;
-    this.position.setPositionContext({
-      isTable: false,
-      index: curIndex
-    });
-    this.range.setRange(curIndex, curIndex);
-    this.draw.render({ curIndex });
-    this.tableTool.dispose();
+    this.tableOperate.insertTableTopRow();
   }
-  mergeTableCell() {
+  insertTableBottomRow() {
     const isReadonly = this.draw.isReadonly();
     if (isReadonly)
       return;
-    const positionContext = this.position.getPositionContext();
-    if (!positionContext.isTable)
+    this.tableOperate.insertTableBottomRow();
+  }
+  insertTableLeftCol() {
+    const isReadonly = this.draw.isReadonly();
+    if (isReadonly)
       return;
-    const { isCrossRowCol, startTdIndex, endTdIndex, startTrIndex, endTrIndex } = this.range.getRange();
-    if (!isCrossRowCol)
+    this.tableOperate.insertTableLeftCol();
+  }
+  insertTableRightCol() {
+    const isReadonly = this.draw.isReadonly();
+    if (isReadonly)
       return;
-    const { index: index2 } = positionContext;
-    const originalElementList = this.draw.getOriginalElementList();
-    const element = originalElementList[index2];
-    const curTrList = element.trList;
-    let startTd = curTrList[startTrIndex].tdList[startTdIndex];
-    let endTd = curTrList[endTrIndex].tdList[endTdIndex];
-    if (startTd.x > endTd.x || startTd.y > endTd.y) {
-      [startTd, endTd] = [endTd, startTd];
-    }
-    const startColIndex = startTd.colIndex;
-    const endColIndex = endTd.colIndex + (endTd.colspan - 1);
-    const startRowIndex = startTd.rowIndex;
-    const endRowIndex = endTd.rowIndex + (endTd.rowspan - 1);
-    const rowCol = [];
-    for (let t = 0; t < curTrList.length; t++) {
-      const tr = curTrList[t];
-      const tdList = [];
-      for (let d = 0; d < tr.tdList.length; d++) {
-        const td = tr.tdList[d];
-        const tdColIndex = td.colIndex;
-        const tdRowIndex = td.rowIndex;
-        if (tdColIndex >= startColIndex && tdColIndex <= endColIndex && tdRowIndex >= startRowIndex && tdRowIndex <= endRowIndex) {
-          tdList.push(td);
-        }
-      }
-      if (tdList.length) {
-        rowCol.push(tdList);
-      }
-    }
-    if (!rowCol.length)
+    this.tableOperate.insertTableRightCol();
+  }
+  deleteTableRow() {
+    const isReadonly = this.draw.isReadonly();
+    if (isReadonly)
       return;
-    const lastRow = rowCol[rowCol.length - 1];
-    const leftTop = rowCol[0][0];
-    const rightBottom = lastRow[lastRow.length - 1];
-    const startX = leftTop.x;
-    const startY = leftTop.y;
-    const endX = rightBottom.x + rightBottom.width;
-    const endY = rightBottom.y + rightBottom.height;
-    for (let t = 0; t < rowCol.length; t++) {
-      const tr = rowCol[t];
-      for (let d = 0; d < tr.length; d++) {
-        const td = tr[d];
-        const tdStartX = td.x;
-        const tdStartY = td.y;
-        const tdEndX = tdStartX + td.width;
-        const tdEndY = tdStartY + td.height;
-        if (startX > tdStartX || startY > tdStartY || endX < tdEndX || endY < tdEndY) {
-          return;
-        }
-      }
-    }
-    const mergeTdIdList = [];
-    const anchorTd = rowCol[0][0];
-    for (let t = 0; t < rowCol.length; t++) {
-      const tr = rowCol[t];
-      for (let d = 0; d < tr.length; d++) {
-        const td = tr[d];
-        const isAnchorTd = t === 0 && d === 0;
-        if (!isAnchorTd) {
-          mergeTdIdList.push(td.id);
-        }
-        if (t === 0 && d !== 0) {
-          anchorTd.colspan += td.colspan;
-        }
-        if (t !== 0) {
-          if (anchorTd.colIndex === td.colIndex) {
-            anchorTd.rowspan += td.rowspan;
-          }
-        }
-      }
-    }
-    for (let t = 0; t < curTrList.length; t++) {
-      const tr = curTrList[t];
-      let d = 0;
-      while (d < tr.tdList.length) {
-        const td = tr.tdList[d];
-        if (mergeTdIdList.includes(td.id)) {
-          tr.tdList.splice(d, 1);
-          d--;
-        }
-        d++;
-      }
-    }
-    this.position.setPositionContext(__spreadProps(__spreadValues({}, positionContext), {
-      trIndex: anchorTd.trIndex,
-      tdIndex: anchorTd.tdIndex
-    }));
-    const curIndex = anchorTd.value.length - 1;
-    this.range.setRange(curIndex, curIndex);
-    this.draw.render();
-    this.tableTool.render();
+    this.tableOperate.deleteTableRow();
+  }
+  deleteTableCol() {
+    const isReadonly = this.draw.isReadonly();
+    if (isReadonly)
+      return;
+    this.tableOperate.deleteTableCol();
   }
-  cancelMergeTableCell() {
+  deleteTable() {
     const isReadonly = this.draw.isReadonly();
     if (isReadonly)
       return;
-    const positionContext = this.position.getPositionContext();
-    if (!positionContext.isTable)
+    this.tableOperate.deleteTable();
+  }
+  mergeTableCell() {
+    const isReadonly = this.draw.isReadonly();
+    if (isReadonly)
       return;
-    const { index: index2, tdIndex, trIndex } = positionContext;
-    const originalElementList = this.draw.getOriginalElementList();
-    const element = originalElementList[index2];
-    const curTrList = element.trList;
-    const curTr = curTrList[trIndex];
-    const curTd = curTr.tdList[tdIndex];
-    if (curTd.rowspan === 1 && curTd.colspan === 1)
+    this.tableOperate.mergeTableCell();
+  }
+  cancelMergeTableCell() {
+    const isReadonly = this.draw.isReadonly();
+    if (isReadonly)
       return;
-    const colspan = curTd.colspan;
-    if (curTd.colspan > 1) {
-      for (let c = 1; c < curTd.colspan; c++) {
-        const tdId = getUUID();
-        curTr.tdList.splice(tdIndex + c, 0, {
-          id: tdId,
-          rowspan: 1,
-          colspan: 1,
-          value: [
-            {
-              value: ZERO,
-              size: 16,
-              tableId: element.id,
-              trId: curTr.id,
-              tdId
-            }
-          ]
-        });
-      }
-      curTd.colspan = 1;
-    }
-    if (curTd.rowspan > 1) {
-      for (let r = 1; r < curTd.rowspan; r++) {
-        const tr = curTrList[trIndex + r];
-        for (let c = 0; c < colspan; c++) {
-          const tdId = getUUID();
-          tr.tdList.splice(curTd.colIndex, 0, {
-            id: tdId,
-            rowspan: 1,
-            colspan: 1,
-            value: [
-              {
-                value: ZERO,
-                size: 16,
-                tableId: element.id,
-                trId: tr.id,
-                tdId
-              }
-            ]
-          });
-        }
-      }
-      curTd.rowspan = 1;
-    }
-    const curIndex = curTd.value.length - 1;
-    this.range.setRange(curIndex, curIndex);
-    this.draw.render();
-    this.tableTool.render();
+    this.tableOperate.cancelMergeTableCell();
   }
   tableTdVerticalAlign(payload) {
     const isReadonly = this.draw.isReadonly();
     if (isReadonly)
       return;
-    const rowCol = this.draw.getTableParticle().getRangeRowCol();
-    if (!rowCol)
-      return;
-    for (let r = 0; r < rowCol.length; r++) {
-      const row = rowCol[r];
-      for (let c = 0; c < row.length; c++) {
-        const td = row[c];
-        if (!td || td.verticalAlign === payload || !td.verticalAlign && payload === VerticalAlign.TOP) {
-          continue;
-        }
-        td.verticalAlign = payload;
-      }
-    }
-    const { endIndex } = this.range.getRange();
-    this.draw.render({
-      curIndex: endIndex
-    });
+    this.tableOperate.tableTdVerticalAlign(payload);
   }
   tableBorderType(payload) {
     const isReadonly = this.draw.isReadonly();
     if (isReadonly)
       return;
-    const positionContext = this.position.getPositionContext();
-    if (!positionContext.isTable)
-      return;
-    const { index: index2 } = positionContext;
-    const originalElementList = this.draw.getOriginalElementList();
-    const element = originalElementList[index2];
-    if (!element.borderType && payload === TableBorder.ALL || element.borderType === payload) {
-      return;
-    }
-    element.borderType = payload;
-    const { endIndex } = this.range.getRange();
-    this.draw.render({
-      curIndex: endIndex
-    });
+    this.tableOperate.tableBorderType(payload);
   }
   tableTdBorderType(payload) {
     const isReadonly = this.draw.isReadonly();
     if (isReadonly)
       return;
-    const rowCol = this.draw.getTableParticle().getRangeRowCol();
-    if (!rowCol)
-      return;
-    const tdList = rowCol.flat();
-    const isSetBorderType = tdList.some((td) => {
-      var _a;
-      return !((_a = td.borderTypes) == null ? void 0 : _a.includes(payload));
-    });
-    tdList.forEach((td) => {
-      if (!td.borderTypes) {
-        td.borderTypes = [];
-      }
-      const borderTypeIndex = td.borderTypes.findIndex((type) => type === payload);
-      if (isSetBorderType) {
-        if (!~borderTypeIndex) {
-          td.borderTypes.push(payload);
-        }
-      } else {
-        if (~borderTypeIndex) {
-          td.borderTypes.splice(borderTypeIndex, 1);
-        }
-      }
-      if (!td.borderTypes.length) {
-        delete td.borderTypes;
-      }
-    });
-    const { endIndex } = this.range.getRange();
-    this.draw.render({
-      curIndex: endIndex
-    });
+    this.tableOperate.tableTdBorderType(payload);
   }
   tableTdSlashType(payload) {
     const isReadonly = this.draw.isReadonly();
     if (isReadonly)
       return;
-    const rowCol = this.draw.getTableParticle().getRangeRowCol();
-    if (!rowCol)
-      return;
-    const tdList = rowCol.flat();
-    const isSetTdSlashType = tdList.some((td) => {
-      var _a;
-      return !((_a = td.slashTypes) == null ? void 0 : _a.includes(payload));
-    });
-    tdList.forEach((td) => {
-      if (!td.slashTypes) {
-        td.slashTypes = [];
-      }
-      const slashTypeIndex = td.slashTypes.findIndex((type) => type === payload);
-      if (isSetTdSlashType) {
-        if (!~slashTypeIndex) {
-          td.slashTypes.push(payload);
-        }
-      } else {
-        if (~slashTypeIndex) {
-          td.slashTypes.splice(slashTypeIndex, 1);
-        }
-      }
-      if (!td.slashTypes.length) {
-        delete td.slashTypes;
-      }
-    });
-    const { endIndex } = this.range.getRange();
-    this.draw.render({
-      curIndex: endIndex
-    });
+    this.tableOperate.tableTdSlashType(payload);
   }
   tableTdBackgroundColor(payload) {
     const isReadonly = this.draw.isReadonly();
     if (isReadonly)
       return;
-    const rowCol = this.draw.getTableParticle().getRangeRowCol();
-    if (!rowCol)
-      return;
-    for (let r = 0; r < rowCol.length; r++) {
-      const row = rowCol[r];
-      for (let c = 0; c < row.length; c++) {
-        const col = row[c];
-        col.backgroundColor = payload;
-      }
-    }
-    const { endIndex } = this.range.getRange();
-    this.range.setRange(endIndex, endIndex);
-    this.draw.render({
-      isCompute: false
-    });
+    this.tableOperate.tableTdBackgroundColor(payload);
   }
   tableSelectAll() {
-    const positionContext = this.position.getPositionContext();
-    const { index: index2, tableId, isTable } = positionContext;
-    if (!isTable || !tableId)
-      return;
-    const { startIndex, endIndex } = this.range.getRange();
-    const originalElementList = this.draw.getOriginalElementList();
-    const trList = originalElementList[index2].trList;
-    const endTrIndex = trList.length - 1;
-    const endTdIndex = trList[endTrIndex].tdList.length - 1;
-    this.range.replaceRange({
-      startIndex,
-      endIndex,
-      tableId,
-      startTdIndex: 0,
-      endTdIndex,
-      startTrIndex: 0,
-      endTrIndex
-    });
-    this.draw.render({
-      isCompute: false,
-      isSubmitHistory: false
-    });
+    this.tableOperate.tableSelectAll();
   }
   hyperlink(payload) {
-    const isReadonly = this.draw.isReadonly();
-    if (isReadonly)
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
+    if (isDisabled)
       return;
     const activeControl = this.control.getActiveControl();
     if (activeControl)
@@ -18435,7 +18796,9 @@ class CommandAdapt {
     if (!newElementList)
       return;
     const start = startIndex + 1;
-    formatElementContext(elementList, newElementList, startIndex);
+    formatElementContext(elementList, newElementList, startIndex, {
+      editorOptions: this.options
+    });
     this.draw.spliceElementList(elementList, start, startIndex === endIndex ? 0 : endIndex - startIndex, ...newElementList);
     const curIndex = start + newElementList.length - 1;
     this.range.setRange(curIndex, curIndex);
@@ -18477,8 +18840,8 @@ class CommandAdapt {
     return [leftIndex, rightIndex];
   }
   deleteHyperlink() {
-    const isReadonly = this.draw.isReadonly();
-    if (isReadonly)
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
+    if (isDisabled)
       return;
     const hyperRange = this.getHyperlinkRange();
     if (!hyperRange)
@@ -18494,8 +18857,8 @@ class CommandAdapt {
     });
   }
   cancelHyperlink() {
-    const isReadonly = this.draw.isReadonly();
-    if (isReadonly)
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
+    if (isDisabled)
       return;
     const hyperRange = this.getHyperlinkRange();
     if (!hyperRange)
@@ -18517,8 +18880,8 @@ class CommandAdapt {
     });
   }
   editHyperlink(payload) {
-    const isReadonly = this.draw.isReadonly();
-    if (isReadonly)
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
+    if (isDisabled)
       return;
     const hyperRange = this.getHyperlinkRange();
     if (!hyperRange)
@@ -18537,8 +18900,8 @@ class CommandAdapt {
     });
   }
   separator(payload) {
-    const isReadonly = this.draw.isReadonly();
-    if (isReadonly)
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
+    if (isDisabled)
       return;
     const activeControl = this.control.getActiveControl();
     if (activeControl)
@@ -18561,7 +18924,9 @@ class CommandAdapt {
         type: ElementType.SEPARATOR,
         dashArray: payload
       };
-      formatElementContext(elementList, [newElement], startIndex);
+      formatElementContext(elementList, [newElement], startIndex, {
+        editorOptions: this.options
+      });
       if (startIndex !== 0 && elementList[startIndex].value === ZERO) {
         this.draw.spliceElementList(elementList, startIndex, 1, newElement);
         curIndex = startIndex - 1;
@@ -18574,8 +18939,8 @@ class CommandAdapt {
     this.draw.render({ curIndex });
   }
   pageBreak() {
-    const isReadonly = this.draw.isReadonly();
-    if (isReadonly)
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
+    if (isDisabled)
       return;
     const activeControl = this.control.getActiveControl();
     if (activeControl)
@@ -18809,10 +19174,11 @@ class CommandAdapt {
       return;
     element.imgDisplay = display;
     const { startIndex, endIndex } = this.range.getRange();
-    if (display === ImageDisplay.FLOAT_TOP || display === ImageDisplay.FLOAT_BOTTOM) {
+    if (display === ImageDisplay.SURROUND || display === ImageDisplay.FLOAT_TOP || display === ImageDisplay.FLOAT_BOTTOM) {
       const positionList = this.position.getPositionList();
-      const { coordinate: { leftTop } } = positionList[startIndex];
+      const { pageNo, coordinate: { leftTop } } = positionList[startIndex];
       element.imgFloatPosition = {
+        pageNo,
         x: leftTop[0],
         y: leftTop[1]
       };
@@ -18932,6 +19298,19 @@ class CommandAdapt {
         tableElement = zipElementList([originTableElement])[0];
       }
     }
+    let titleId = null;
+    let titleStartPageNo = null;
+    let start = startIndex - 1;
+    while (start > 0) {
+      const curElement = elementList[start];
+      const preElement = elementList[start - 1];
+      if (curElement.titleId && curElement.titleId !== (preElement == null ? void 0 : preElement.titleId)) {
+        titleId = curElement.titleId;
+        titleStartPageNo = positionList[start].pageNo;
+        break;
+      }
+      start--;
+    }
     return deepClone({
       isCollapsed,
       startElement,
@@ -18945,7 +19324,9 @@ class CommandAdapt {
       tdIndex: tdIndex != null ? tdIndex : null,
       tableElement,
       selectionText,
-      selectionElementList
+      selectionElementList,
+      titleId,
+      titleStartPageNo
     });
   }
   getRangeRow() {
@@ -18997,14 +19378,15 @@ class CommandAdapt {
   insertElementList(payload) {
     if (!payload.length)
       return;
-    const isReadonly = this.draw.isReadonly();
-    if (isReadonly)
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
+    if (isDisabled)
       return;
     const cloneElementList = deepClone(payload);
     const { startIndex } = this.range.getRange();
     const elementList = this.draw.getElementList();
     formatElementContext(elementList, cloneElementList, startIndex, {
-      isBreakWhenWrap: true
+      isBreakWhenWrap: true,
+      editorOptions: this.options
     });
     this.draw.insertElementList(cloneElementList);
   }
@@ -19036,7 +19418,7 @@ class CommandAdapt {
       const elementIndex = getElementIndexById(elementList);
       if (~elementIndex) {
         elementList[elementIndex] = __spreadValues(__spreadValues({}, elementList[elementIndex]), payload.properties);
-        formatElementList([elementList[elementIndex]], {
+        formatElementList(zipElementList([elementList[elementIndex]]), {
           isHandleFirstElement: false,
           editorOptions: this.options
         });
@@ -19284,8 +19666,8 @@ class CommandAdapt {
     }
   }
   insertControl(payload) {
-    const isReadonly = this.draw.isReadonly();
-    if (isReadonly)
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
+    if (isDisabled)
       return;
     const cloneElement = deepClone(payload);
     const { startIndex } = this.range.getRange();
@@ -19410,8 +19792,8 @@ class CommandAdapt {
   }
   insertTitle(payload) {
     var _a;
-    const isReadonly = this.draw.isReadonly();
-    if (isReadonly)
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
+    if (isDisabled)
       return;
     const cloneElement = deepClone(payload);
     const { startIndex } = this.range.getRange();
@@ -19429,6 +19811,21 @@ class CommandAdapt {
     });
     this.draw.insertElementList([cloneElement]);
   }
+  focus(payload) {
+    const { position = LocationPosition.AFTER } = payload || {};
+    const curIndex = position === LocationPosition.BEFORE ? 0 : this.draw.getOriginalMainElementList().length - 1;
+    this.range.setRange(curIndex, curIndex);
+    this.draw.render({
+      curIndex,
+      isCompute: false,
+      isSubmitHistory: false
+    });
+    const positionList = this.draw.getPosition().getPositionList();
+    this.draw.getCursor().moveCursorToVisible({
+      cursorPosition: positionList[curIndex],
+      direction: MoveDirection.DOWN
+    });
+  }
 }
 class Listener {
   constructor() {
@@ -19492,6 +19889,7 @@ const INTERNAL_CONTEXT_MENU_KEY = {
     TEXT_WRAP: "imageTextWrap",
     TEXT_WRAP_EMBED: "imageTextWrapEmbed",
     TEXT_WRAP_UP_DOWN: "imageTextWrapUpDown",
+    TEXT_WRAP_SURROUND: "imageTextWrapSurround",
     TEXT_WRAP_FLOAT_TOP: "imageTextWrapFloatTop",
     TEXT_WRAP_FLOAT_BOTTOM: "imageTextWrapFloatBottom"
   },
@@ -19637,7 +20035,7 @@ const hyperlinkMenus = [
     }
   }
 ];
-const { IMAGE: { CHANGE, SAVE_AS, TEXT_WRAP, TEXT_WRAP_EMBED, TEXT_WRAP_UP_DOWN, TEXT_WRAP_FLOAT_TOP, TEXT_WRAP_FLOAT_BOTTOM } } = INTERNAL_CONTEXT_MENU_KEY;
+const { IMAGE: { CHANGE, SAVE_AS, TEXT_WRAP, TEXT_WRAP_EMBED, TEXT_WRAP_UP_DOWN, TEXT_WRAP_SURROUND, TEXT_WRAP_FLOAT_TOP, TEXT_WRAP_FLOAT_BOTTOM } } = INTERNAL_CONTEXT_MENU_KEY;
 const imageMenus = [
   {
     key: CHANGE,
@@ -19699,6 +20097,14 @@ const imageMenus = [
           command.executeChangeImageDisplay(context.startElement, ImageDisplay.INLINE);
         }
       },
+      {
+        key: TEXT_WRAP_SURROUND,
+        i18nPath: "contextmenu.image.textWrapType.surround",
+        when: () => true,
+        callback: (command, context) => {
+          command.executeChangeImageDisplay(context.startElement, ImageDisplay.SURROUND);
+        }
+      },
       {
         key: TEXT_WRAP_FLOAT_TOP,
         i18nPath: "contextmenu.image.textWrapType.floatTop",