@hufe921/canvas-editor 0.9.92 → 0.9.93

package/dist/canvas-editor.es.js

@@ -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.92";
+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,
@@ -4934,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,
@@ -5813,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);
     }
   }
@@ -5847,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();
@@ -5880,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;
     }
@@ -6019,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();
@@ -6057,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);
       }
@@ -7567,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)
@@ -7591,6 +7629,7 @@ class GlobalEvent {
       this.hyperlinkParticle.clearHyperlinkPopup();
       this.control.destroyControl();
       this.dateParticle.clearDatePicker();
+      this.imageParticle.destroyFloatImage();
     });
     __publicField(this, "setCanvasEventAbility", () => {
       this.canvasEvent.setIsAllowDrag(false);
@@ -7641,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)`);
   }
@@ -7798,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;
@@ -7833,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;
@@ -7842,7 +7884,8 @@ class Position {
           if (!element.imgFloatPosition) {
             element.imgFloatPosition = {
               x,
-              y
+              y,
+              pageNo
             };
           }
           this.floatPositionList.push({
@@ -7985,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;
@@ -8078,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;
@@ -8211,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) {
@@ -8274,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) {
@@ -10011,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");
@@ -10018,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");
@@ -10029,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;
@@ -10036,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;
   }
@@ -10064,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`);
@@ -10093,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`);
@@ -10122,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`;
@@ -10393,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() {
@@ -13018,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);
@@ -13070,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() {
@@ -13728,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"
     }
@@ -13822,6 +13952,7 @@ const contextmenu = {
     textWrapType: {
       embed: "Embed",
       upDown: "Up down",
+      surround: "Surround",
       floatTop: "Float above text",
       floatBottom: "Float below text"
     }
@@ -14838,187 +14969,893 @@ class Actuator {
     });
   }
 }
-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");
+class TableOperate {
+  constructor(draw) {
+    __publicField(this, "draw");
     __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, "position");
     __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);
-    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;
+    __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)
+  insertTable(row, col) {
+    var _a;
+    const { startIndex, endIndex } = this.range.getRange();
+    if (!~startIndex && !~endIndex)
       return;
-    if (payload === EditorMode.PRINT) {
-      this.printModeData = {
-        header: this.header.getElementList(),
-        main: this.elementList,
-        footer: this.footer.getElementList()
-      };
-      const clonePrintModeData = deepClone(this.printModeData);
-      const editorDataKeys = ["header", "main", "footer"];
-      editorDataKeys.forEach((key) => {
-        clonePrintModeData[key] = this.control.filterAssistElement(clonePrintModeData[key]);
-      });
-      this.setEditorData(clonePrintModeData);
+    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;
     }
-    if (this.mode === EditorMode.PRINT && this.printModeData) {
-      this.setEditorData(this.printModeData);
-      this.printModeData = null;
+    const innerWidth = this.draw.getContextInnerWidth() - offsetX;
+    const colgroup = [];
+    const colWidth = innerWidth / col;
+    for (let c = 0; c < col; c++) {
+      colgroup.push({
+        width: colWidth
+      });
     }
-    this.clearSideEffect();
-    this.range.clearRange();
-    this.mode = payload;
-    this.options.mode = payload;
-    this.render({
-      isSetCursor: false,
-      isSubmitHistory: false
-    });
+    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()
+      };
+      const clonePrintModeData = deepClone(this.printModeData);
+      const editorDataKeys = ["header", "main", "footer"];
+      editorDataKeys.forEach((key) => {
+        clonePrintModeData[key] = this.control.filterAssistElement(clonePrintModeData[key]);
+      });
+      this.setEditorData(clonePrintModeData);
+    }
+    if (this.mode === EditorMode.PRINT && this.printModeData) {
+      this.setEditorData(this.printModeData);
+      this.printModeData = null;
+    }
+    this.clearSideEffect();
+    this.range.clearRange();
+    this.mode = payload;
+    this.options.mode = payload;
+    this.render({
+      isSetCursor: false,
+      isSubmitHistory: false
+    });
   }
   isReadonly() {
     switch (this.mode) {
@@ -15403,6 +16240,9 @@ class Draw {
   getTableTool() {
     return this.tableTool;
   }
+  getTableOperate() {
+    return this.tableOperate;
+  }
   getTableParticle() {
     return this.tableParticle;
   }
@@ -15750,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");
@@ -15768,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;
@@ -15783,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;
@@ -15837,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);
@@ -16045,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) {
@@ -16058,8 +16904,6 @@ class Draw {
             const left2 = Math.min(rowRemainingWidth, extraWidth) * scale;
             rowElement.left = left2;
             curRow.width += left2;
-          } else {
-            rowElement.left = 0;
           }
           controlRealWidth = 0;
         }
@@ -16090,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,
@@ -16133,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++) {
@@ -16145,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;
   }
@@ -16238,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) {
@@ -16428,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);
       }
@@ -16458,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;
@@ -16484,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);
@@ -16555,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();
@@ -17187,25 +18086,25 @@ 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);
@@ -17496,1026 +18395,384 @@ class CommandAdapt {
         el.size -= 2;
       }
       isExistUpdate = true;
-    });
-    if (isExistUpdate) {
-      this.draw.render(renderOption);
-    }
-  }
-  bold() {
-    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
-    if (isDisabled)
-      return;
-    const selection = this.range.getSelectionElementList();
-    if (selection == null ? void 0 : selection.length) {
-      const noBoldIndex = selection.findIndex((s) => !s.bold);
-      selection.forEach((el) => {
-        el.bold = !!~noBoldIndex;
-      });
-      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.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) {
-    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
-    if (isDisabled)
-      return;
-    const selection = this.range.getSelectionElementList();
-    if (selection == null ? void 0 : selection.length) {
-      selection.forEach((el) => {
-        if (payload) {
-          el.color = payload;
-        } else {
-          delete el.color;
-        }
-      });
-      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 });
-      }
+    });
+    if (isExistUpdate) {
+      this.draw.render(renderOption);
     }
   }
-  highlight(payload) {
+  bold() {
     const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
     if (isDisabled)
       return;
     const selection = this.range.getSelectionElementList();
     if (selection == null ? void 0 : selection.length) {
+      const noBoldIndex = selection.findIndex((s) => !s.bold);
       selection.forEach((el) => {
-        if (payload) {
-          el.highlight = payload;
-        } else {
-          delete el.highlight;
-        }
-      });
-      this.draw.render({
-        isSetCursor: false,
-        isCompute: false
+        el.bold = !!~noBoldIndex;
       });
+      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) {
-        if (payload) {
-          enterElement.highlight = payload;
-        } else {
-          delete enterElement.highlight;
-        }
+        enterElement.bold = !enterElement.bold;
         this.draw.render({ curIndex: endIndex, isCompute: false });
       }
     }
   }
-  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;
-        }
-      }
-    });
-    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;
+  italic() {
     const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
     if (isDisabled)
       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, {
-      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 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;
-          }
-        }
-      }
-    }
-    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
-          }
-        ]
+    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;
       });
-    }
-    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 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];
-    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;
-          }
-        }
+      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 });
       }
     }
-    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
-          }
-        ]
+  }
+  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 });
+      }
     }
-    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();
   }
-  insertTableLeftCol() {
-    const isReadonly = this.draw.isReadonly();
-    if (isReadonly)
-      return;
-    const positionContext = this.position.getPositionContext();
-    if (!positionContext.isTable)
+  strikeout() {
+    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) {
+      const noStrikeoutIndex = selection.findIndex((s) => !s.strikeout);
+      selection.forEach((el) => {
+        el.strikeout = !!~noStrikeoutIndex;
       });
-    }
-    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) {
+        enterElement.strikeout = !enterElement.strikeout;
+        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)
+  superscript() {
+    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, 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;
+    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.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();
+    this.draw.render({ isSetCursor: false });
   }
-  deleteTableRow() {
-    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, 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 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) {
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
+    if (isDisabled)
       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--;
+    const selection = this.range.getSelectionElementList();
+    if (selection == null ? void 0 : selection.length) {
+      selection.forEach((el) => {
+        if (payload) {
+          el.color = payload;
+        } else {
+          delete el.color;
+        }
+      });
+      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 });
       }
     }
-    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
-            }
-          ]
-        });
+  }
+  highlight(payload) {
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
+    if (isDisabled)
+      return;
+    const selection = this.range.getSelectionElementList();
+    if (selection == null ? void 0 : selection.length) {
+      selection.forEach((el) => {
+        if (payload) {
+          el.highlight = payload;
+        } else {
+          delete el.highlight;
+        }
+      });
+      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 });
       }
     }
-    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 isReadonly = this.draw.isReadonly();
-    if (isReadonly)
+  title(payload) {
+    const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
+    if (isDisabled)
       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 elementList = this.draw.getElementList();
+    const changeElementList = startIndex === endIndex ? this.range.getRangeParagraphElementList() : elementList.slice(startIndex + 1, endIndex + 1);
+    if (!changeElementList || !changeElementList.length)
       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);
-          }
+    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;
         }
       }
-    }
-    (_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();
+    const isSetCursor = startIndex === endIndex;
+    const curIndex = isSetCursor ? endIndex : startIndex;
+    this.draw.render({ curIndex, isSetCursor });
   }
-  deleteTable() {
+  list(listType, listStyle) {
     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.draw.getListParticle().setList(listType, listStyle);
   }
-  mergeTableCell() {
+  rowFlex(payload) {
     const isReadonly = this.draw.isReadonly();
     if (isReadonly)
       return;
-    const positionContext = this.position.getPositionContext();
-    if (!positionContext.isTable)
-      return;
-    const { isCrossRowCol, startTdIndex, endTdIndex, startTrIndex, endTrIndex } = this.range.getRange();
-    if (!isCrossRowCol)
+    const { startIndex, endIndex } = this.range.getRange();
+    if (!~startIndex && !~endIndex)
       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)
+    const rowElementList = this.range.getRangeRowElementList();
+    if (!rowElementList)
       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();
+    rowElementList.forEach((element) => {
+      element.rowFlex = payload;
+    });
+    const isSetCursor = startIndex === endIndex;
+    const curIndex = isSetCursor ? endIndex : startIndex;
+    this.draw.render({ curIndex, isSetCursor });
   }
-  cancelMergeTableCell() {
+  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 curTr = curTrList[trIndex];
-    const curTd = curTr.tdList[tdIndex];
-    if (curTd.rowspan === 1 && curTd.colspan === 1)
+    const rowElementList = this.range.getRangeRowElementList();
+    if (!rowElementList)
       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();
+    rowElementList.forEach((element) => {
+      element.rowMargin = payload;
+    });
+    const isSetCursor = startIndex === endIndex;
+    const curIndex = isSetCursor ? endIndex : startIndex;
+    this.draw.render({ curIndex, isSetCursor });
   }
-  tableTdVerticalAlign(payload) {
+  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 rowCol = this.draw.getTableParticle().getRangeRowCol();
-    if (!rowCol)
+    this.tableOperate.insertTableTopRow();
+  }
+  insertTableBottomRow() {
+    const isReadonly = this.draw.isReadonly();
+    if (isReadonly)
       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.insertTableBottomRow();
   }
-  tableBorderType(payload) {
+  insertTableLeftCol() {
     const isReadonly = this.draw.isReadonly();
     if (isReadonly)
       return;
-    const positionContext = this.position.getPositionContext();
-    if (!positionContext.isTable)
+    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];
-    if (!element.borderType && payload === TableBorder.ALL || element.borderType === payload) {
+    this.tableOperate.insertTableRightCol();
+  }
+  deleteTableRow() {
+    const isReadonly = this.draw.isReadonly();
+    if (isReadonly)
       return;
-    }
-    element.borderType = payload;
-    const { endIndex } = this.range.getRange();
-    this.draw.render({
-      curIndex: endIndex
-    });
+    this.tableOperate.deleteTableRow();
   }
-  tableTdBorderType(payload) {
+  deleteTableCol() {
     const isReadonly = this.draw.isReadonly();
     if (isReadonly)
       return;
-    const rowCol = this.draw.getTableParticle().getRangeRowCol();
-    if (!rowCol)
+    this.tableOperate.deleteTableCol();
+  }
+  deleteTable() {
+    const isReadonly = this.draw.isReadonly();
+    if (isReadonly)
       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.deleteTable();
   }
-  tableTdSlashType(payload) {
+  mergeTableCell() {
     const isReadonly = this.draw.isReadonly();
     if (isReadonly)
       return;
-    const rowCol = this.draw.getTableParticle().getRangeRowCol();
-    if (!rowCol)
+    this.tableOperate.mergeTableCell();
+  }
+  cancelMergeTableCell() {
+    const isReadonly = this.draw.isReadonly();
+    if (isReadonly)
       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.cancelMergeTableCell();
   }
-  tableTdBackgroundColor(payload) {
+  tableTdVerticalAlign(payload) {
     const isReadonly = this.draw.isReadonly();
     if (isReadonly)
       return;
-    const rowCol = this.draw.getTableParticle().getRangeRowCol();
-    if (!rowCol)
+    this.tableOperate.tableTdVerticalAlign(payload);
+  }
+  tableBorderType(payload) {
+    const isReadonly = this.draw.isReadonly();
+    if (isReadonly)
       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.tableBorderType(payload);
   }
-  tableSelectAll() {
-    const positionContext = this.position.getPositionContext();
-    const { index: index2, tableId, isTable } = positionContext;
-    if (!isTable || !tableId)
+  tableTdBorderType(payload) {
+    const isReadonly = this.draw.isReadonly();
+    if (isReadonly)
       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.tableTdBorderType(payload);
+  }
+  tableTdSlashType(payload) {
+    const isReadonly = this.draw.isReadonly();
+    if (isReadonly)
+      return;
+    this.tableOperate.tableTdSlashType(payload);
+  }
+  tableTdBackgroundColor(payload) {
+    const isReadonly = this.draw.isReadonly();
+    if (isReadonly)
+      return;
+    this.tableOperate.tableTdBackgroundColor(payload);
+  }
+  tableSelectAll() {
+    this.tableOperate.tableSelectAll();
   }
   hyperlink(payload) {
     const isDisabled = this.draw.isReadonly() || this.draw.isDisabled();
@@ -18917,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]
       };
@@ -19040,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,
@@ -19053,7 +19324,9 @@ class CommandAdapt {
       tdIndex: tdIndex != null ? tdIndex : null,
       tableElement,
       selectionText,
-      selectionElementList
+      selectionElementList,
+      titleId,
+      titleStartPageNo
     });
   }
   getRangeRow() {
@@ -19145,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
         });
@@ -19616,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"
   },
@@ -19761,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,
@@ -19823,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",