@hufe921/canvas-editor 0.9.39 → 0.9.41

package/dist/canvas-editor.es.js

@@ -1,4 +1,4 @@
-(()=>{(function(){"use strict";try{if(typeof document!="undefined"){var e=document.createElement("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}.ce-resizer-selection>div{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}.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-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-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-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;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}}')),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__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}.ce-resizer-selection>div{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}.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-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-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-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;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}}')),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.39";
+const version = "0.9.41";
 var MaxHeightRatio;
 (function(MaxHeightRatio2) {
   MaxHeightRatio2["HALF"] = "half";
@@ -38,7 +38,22 @@ var NumberType;
 const ZERO = "\u200B";
 const WRAP = "\n";
 const NBSP = " ";
-const PUNCTUATION_LIST = ["\xB7", "\u3001", ":", "\uFF1A", ",", "\uFF0C", ".", "\u3002", ";", "\uFF1B", "?", "\uFF1F", "!", "\uFF01"];
+const PUNCTUATION_LIST = [
+  "\xB7",
+  "\u3001",
+  ":",
+  "\uFF1A",
+  ",",
+  "\uFF0C",
+  ".",
+  "\u3002",
+  ";",
+  "\uFF1B",
+  "?",
+  "\uFF1F",
+  "!",
+  "\uFF01"
+];
 const maxHeightRadioMapping = {
   [MaxHeightRatio.HALF]: 1 / 2,
   [MaxHeightRatio.ONE_THIRD]: 1 / 3,
@@ -154,8 +169,37 @@ function nextTick(fn) {
   }, 0);
 }
 function convertNumberToChinese(num) {
-  const chineseNum = ["\u96F6", "\u4E00", "\u4E8C", "\u4E09", "\u56DB", "\u4E94", "\u516D", "\u4E03", "\u516B", "\u4E5D"];
-  const chineseUnit = ["", "\u5341", "\u767E", "\u5343", "\u4E07", "\u5341", "\u767E", "\u5343", "\u4EBF", "\u5341", "\u767E", "\u5343", "\u4E07", "\u5341", "\u767E", "\u5343", "\u4EBF"];
+  const chineseNum = [
+    "\u96F6",
+    "\u4E00",
+    "\u4E8C",
+    "\u4E09",
+    "\u56DB",
+    "\u4E94",
+    "\u516D",
+    "\u4E03",
+    "\u516B",
+    "\u4E5D"
+  ];
+  const chineseUnit = [
+    "",
+    "\u5341",
+    "\u767E",
+    "\u5343",
+    "\u4E07",
+    "\u5341",
+    "\u767E",
+    "\u5343",
+    "\u4EBF",
+    "\u5341",
+    "\u767E",
+    "\u5343",
+    "\u4E07",
+    "\u5341",
+    "\u767E",
+    "\u5343",
+    "\u4EBF"
+  ];
   if (!num || isNaN(num))
     return "\u96F6";
   const numStr = num.toString().split("");
@@ -279,10 +323,7 @@ const TABLE_CONTEXT_ATTR = [
   "trId",
   "tableId"
 ];
-const TITLE_CONTEXT_ATTR = [
-  "level",
-  "titleId"
-];
+const TITLE_CONTEXT_ATTR = ["level", "titleId"];
 const LIST_CONTEXT_ATTR = [
   "listId",
   "listType",
@@ -307,113 +348,11 @@ const INLINE_ELEMENT_TYPE = [
   ElementType.SEPARATOR,
   ElementType.TABLE
 ];
-const INLINE_NODE_NAME = [
-  "HR",
-  "TABLE",
-  "UL",
-  "OL"
-];
+const INLINE_NODE_NAME = ["HR", "TABLE", "UL", "OL"];
 const VIRTUAL_ELEMENT_TYPE = [
   ElementType.TITLE,
   ElementType.LIST
 ];
-var ListType;
-(function(ListType2) {
-  ListType2["UL"] = "ul";
-  ListType2["OL"] = "ol";
-})(ListType || (ListType = {}));
-var UlStyle;
-(function(UlStyle2) {
-  UlStyle2["DISC"] = "disc";
-  UlStyle2["CIRCLE"] = "circle";
-  UlStyle2["SQUARE"] = "square";
-})(UlStyle || (UlStyle = {}));
-var OlStyle;
-(function(OlStyle2) {
-  OlStyle2["DECIMAL"] = "decimal";
-})(OlStyle || (OlStyle = {}));
-var ListStyle;
-(function(ListStyle2) {
-  ListStyle2["DISC"] = "disc";
-  ListStyle2["CIRCLE"] = "circle";
-  ListStyle2["SQUARE"] = "square";
-  ListStyle2["DECIMAL"] = "decimal";
-})(ListStyle || (ListStyle = {}));
-const ulStyleMapping = {
-  [UlStyle.DISC]: "\u2022",
-  [UlStyle.CIRCLE]: "\u25E6",
-  [UlStyle.SQUARE]: "\u25AB\uFE0E"
-};
-const listTypeElementMapping = {
-  [ListType.OL]: "ol",
-  [ListType.UL]: "ul"
-};
-const listStyleCSSMapping = {
-  [ListStyle.DISC]: "disc",
-  [ListStyle.CIRCLE]: "circle",
-  [ListStyle.SQUARE]: "square",
-  [ListStyle.DECIMAL]: "decimal"
-};
-var TitleLevel;
-(function(TitleLevel2) {
-  TitleLevel2["FIRST"] = "first";
-  TitleLevel2["SECOND"] = "second";
-  TitleLevel2["THIRD"] = "third";
-  TitleLevel2["FOURTH"] = "fourth";
-  TitleLevel2["FIFTH"] = "fifth";
-  TitleLevel2["SIXTH"] = "sixth";
-})(TitleLevel || (TitleLevel = {}));
-const defaultTitleOption = {
-  defaultFirstSize: 26,
-  defaultSecondSize: 24,
-  defaultThirdSize: 22,
-  defaultFourthSize: 20,
-  defaultFifthSize: 18,
-  defaultSixthSize: 16
-};
-const titleSizeMapping = {
-  [TitleLevel.FIRST]: "defaultFirstSize",
-  [TitleLevel.SECOND]: "defaultSecondSize",
-  [TitleLevel.THIRD]: "defaultThirdSize",
-  [TitleLevel.FOURTH]: "defaultFourthSize",
-  [TitleLevel.FIFTH]: "defaultFifthSize",
-  [TitleLevel.SIXTH]: "defaultSixthSize"
-};
-const titleOrderNumberMapping = {
-  [TitleLevel.FIRST]: 1,
-  [TitleLevel.SECOND]: 2,
-  [TitleLevel.THIRD]: 3,
-  [TitleLevel.FOURTH]: 4,
-  [TitleLevel.FIFTH]: 5,
-  [TitleLevel.SIXTH]: 6
-};
-const titleNodeNameMapping = {
-  "H1": TitleLevel.FIRST,
-  "H2": TitleLevel.SECOND,
-  "H3": TitleLevel.THIRD,
-  "H4": TitleLevel.FOURTH,
-  "H5": TitleLevel.FIFTH,
-  "H6": TitleLevel.SIXTH
-};
-var ControlType;
-(function(ControlType2) {
-  ControlType2["TEXT"] = "text";
-  ControlType2["SELECT"] = "select";
-  ControlType2["CHECKBOX"] = "checkbox";
-})(ControlType || (ControlType = {}));
-var ControlComponent;
-(function(ControlComponent2) {
-  ControlComponent2["PREFIX"] = "prefix";
-  ControlComponent2["POSTFIX"] = "postfix";
-  ControlComponent2["PLACEHOLDER"] = "placeholder";
-  ControlComponent2["VALUE"] = "value";
-  ControlComponent2["CHECKBOX"] = "checkbox";
-})(ControlComponent || (ControlComponent = {}));
-var ImageDisplay;
-(function(ImageDisplay2) {
-  ImageDisplay2["INLINE"] = "inline";
-  ImageDisplay2["BLOCK"] = "block";
-})(ImageDisplay || (ImageDisplay = {}));
 class ImageParticle {
   constructor(draw) {
     __publicField(this, "draw");
@@ -2095,9 +2034,13 @@ const raw = {
 const SYMB = {
   "\\frac": { glyph: 0, arity: 2, flags: {} },
   "\\binom": { glyph: 0, arity: 2, flags: {} },
-  "\\sqrt": { glyph: 2267, arity: 1, flags: { opt: true, xfl: true, yfl: true } },
+  "\\sqrt": {
+    glyph: 2267,
+    arity: 1,
+    flags: { opt: true, xfl: true, yfl: true }
+  },
   "^": { glyph: 0, arity: 1, flags: {} },
-  "_": { glyph: 0, arity: 1, flags: {} },
+  _: { glyph: 0, arity: 1, flags: {} },
   "(": { glyph: 2221, arity: 0, flags: { yfl: true } },
   ")": { glyph: 2222, arity: 0, flags: { yfl: true } },
   "[": { glyph: 2223, arity: 0, flags: { yfl: true } },
@@ -2132,12 +2075,28 @@ const SYMB = {
   "\\dagger": { glyph: 2277, arity: 0, flags: {} },
   "\\ddagger": { glyph: 2278, arity: 0, flags: {} },
   "\\ell": { glyph: 662, arity: 0, flags: {} },
-  "\\vec": { glyph: 2261, arity: 1, flags: { hat: true, xfl: true, yfl: true } },
-  "\\overrightarrow": { glyph: 2261, arity: 1, flags: { hat: true, xfl: true, yfl: true } },
-  "\\overleftarrow": { glyph: 2263, arity: 1, flags: { hat: true, xfl: true, yfl: true } },
+  "\\vec": {
+    glyph: 2261,
+    arity: 1,
+    flags: { hat: true, xfl: true, yfl: true }
+  },
+  "\\overrightarrow": {
+    glyph: 2261,
+    arity: 1,
+    flags: { hat: true, xfl: true, yfl: true }
+  },
+  "\\overleftarrow": {
+    glyph: 2263,
+    arity: 1,
+    flags: { hat: true, xfl: true, yfl: true }
+  },
   "\\bar": { glyph: 2231, arity: 1, flags: { hat: true, xfl: true } },
   "\\overline": { glyph: 2231, arity: 1, flags: { hat: true, xfl: true } },
-  "\\widehat": { glyph: 2247, arity: 1, flags: { hat: true, xfl: true, yfl: true } },
+  "\\widehat": {
+    glyph: 2247,
+    arity: 1,
+    flags: { hat: true, xfl: true, yfl: true }
+  },
   "\\hat": { glyph: 2247, arity: 1, flags: { hat: true } },
   "\\acute": { glyph: 2248, arity: 1, flags: { hat: true } },
   "\\grave": { glyph: 2249, arity: 1, flags: { hat: true } },
@@ -2401,7 +2360,13 @@ function tokenize(str) {
   return tokens;
 }
 function parseAtom(x) {
-  return { type: SYMB[x] ? "symb" : "char", mode: "math", text: x, chld: [], bbox: null };
+  return {
+    type: SYMB[x] ? "symb" : "char",
+    mode: "math",
+    text: x,
+    chld: [],
+    bbox: null
+  };
 }
 function parse(tokens) {
   let i = 0;
@@ -2847,7 +2812,12 @@ function plan(expr, mode = "math") {
     const mw = Math.max(a.bbox.w, b.bbox.w) * s;
     transform(a, s, null, (mw - a.bbox.w * s) / 2, 0);
     transform(b, s, null, (mw - b.bbox.w * s) / 2, a.bbox.h + CONFIG.FRAC_SPACING);
-    expr.bbox = { x: 0, y: -a.bbox.h + 1 - CONFIG.FRAC_SPACING / 2, w: mw, h: a.bbox.h + b.bbox.h + CONFIG.FRAC_SPACING };
+    expr.bbox = {
+      x: 0,
+      y: -a.bbox.h + 1 - CONFIG.FRAC_SPACING / 2,
+      w: mw,
+      h: a.bbox.h + b.bbox.h + CONFIG.FRAC_SPACING
+    };
   } else if (expr.text == "\\binom") {
     const a = expr.chld[0];
     const b = expr.chld[1];
@@ -2872,7 +2842,12 @@ function plan(expr, mode = "math") {
       transform(f, CONFIG.SQRT_MAG_SCALE, null, 0, 0.5);
     }
     transform(e, 1, null, 1 + pl, 0.5);
-    expr.bbox = { x: 0, y: 2 - e.bbox.h - 0.5, w: e.bbox.w + 1 + pl, h: e.bbox.h + 0.5 };
+    expr.bbox = {
+      x: 0,
+      y: 2 - e.bbox.h - 0.5,
+      w: e.bbox.w + 1 + pl,
+      h: e.bbox.h + 0.5
+    };
   } else if (SYMB[expr.text] && SYMB[expr.text].flags.hat) {
     const e = expr.chld[0];
     plan(e);
@@ -2947,18 +2922,18 @@ function plan(expr, mode = "math") {
     }
     dy += mh;
     const m2s = {
-      "bmatrix": ["[", "]"],
-      "pmatrix": ["(", ")"],
-      "Bmatrix": ["\\{", "\\}"],
-      "cases": ["\\{"]
+      bmatrix: ["[", "]"],
+      pmatrix: ["(", ")"],
+      Bmatrix: ["\\{", "\\}"],
+      cases: ["\\{"]
     };
     const alt = (_c = {
-      "bmatrix": "center",
-      "pmatrix": "center",
-      "Bmatrix": "center",
-      "cases": "left",
-      "matrix": "center",
-      "aligned": "equation"
+      bmatrix: "center",
+      pmatrix: "center",
+      Bmatrix: "center",
+      cases: "left",
+      matrix: "center",
+      aligned: "equation"
     }[expr.text]) != null ? _c : "left";
     const hasLp = !!m2s[expr.text];
     const hasRp = !!m2s[expr.text] && m2s[expr.text].length > 1;
@@ -2971,7 +2946,12 @@ function plan(expr, mode = "math") {
     for (let i = 0; i < expr.chld.length; i++) {
       transform(expr.chld[i], 1, null, -bb.x + (hasLp ? 1.5 : 0), -bb.y);
     }
-    expr.bbox = { x: 0, y: 0, w: bb.w + 1.5 * Number(hasLp) + 1.5 * Number(hasRp), h: bb.h };
+    expr.bbox = {
+      x: 0,
+      y: 0,
+      w: bb.w + 1.5 * Number(hasLp) + 1.5 * Number(hasRp),
+      h: bb.h
+    };
     if (hasLp) {
       expr.chld.unshift({
         type: "symb",
@@ -3447,6 +3427,103 @@ const defaultControlOption = {
   prefix: "{",
   postfix: "}"
 };
+var ListType;
+(function(ListType2) {
+  ListType2["UL"] = "ul";
+  ListType2["OL"] = "ol";
+})(ListType || (ListType = {}));
+var UlStyle;
+(function(UlStyle2) {
+  UlStyle2["DISC"] = "disc";
+  UlStyle2["CIRCLE"] = "circle";
+  UlStyle2["SQUARE"] = "square";
+})(UlStyle || (UlStyle = {}));
+var OlStyle;
+(function(OlStyle2) {
+  OlStyle2["DECIMAL"] = "decimal";
+})(OlStyle || (OlStyle = {}));
+var ListStyle;
+(function(ListStyle2) {
+  ListStyle2["DISC"] = "disc";
+  ListStyle2["CIRCLE"] = "circle";
+  ListStyle2["SQUARE"] = "square";
+  ListStyle2["DECIMAL"] = "decimal";
+})(ListStyle || (ListStyle = {}));
+const ulStyleMapping = {
+  [UlStyle.DISC]: "\u2022",
+  [UlStyle.CIRCLE]: "\u25E6",
+  [UlStyle.SQUARE]: "\u25AB\uFE0E"
+};
+const listTypeElementMapping = {
+  [ListType.OL]: "ol",
+  [ListType.UL]: "ul"
+};
+const listStyleCSSMapping = {
+  [ListStyle.DISC]: "disc",
+  [ListStyle.CIRCLE]: "circle",
+  [ListStyle.SQUARE]: "square",
+  [ListStyle.DECIMAL]: "decimal"
+};
+var TitleLevel;
+(function(TitleLevel2) {
+  TitleLevel2["FIRST"] = "first";
+  TitleLevel2["SECOND"] = "second";
+  TitleLevel2["THIRD"] = "third";
+  TitleLevel2["FOURTH"] = "fourth";
+  TitleLevel2["FIFTH"] = "fifth";
+  TitleLevel2["SIXTH"] = "sixth";
+})(TitleLevel || (TitleLevel = {}));
+const defaultTitleOption = {
+  defaultFirstSize: 26,
+  defaultSecondSize: 24,
+  defaultThirdSize: 22,
+  defaultFourthSize: 20,
+  defaultFifthSize: 18,
+  defaultSixthSize: 16
+};
+const titleSizeMapping = {
+  [TitleLevel.FIRST]: "defaultFirstSize",
+  [TitleLevel.SECOND]: "defaultSecondSize",
+  [TitleLevel.THIRD]: "defaultThirdSize",
+  [TitleLevel.FOURTH]: "defaultFourthSize",
+  [TitleLevel.FIFTH]: "defaultFifthSize",
+  [TitleLevel.SIXTH]: "defaultSixthSize"
+};
+const titleOrderNumberMapping = {
+  [TitleLevel.FIRST]: 1,
+  [TitleLevel.SECOND]: 2,
+  [TitleLevel.THIRD]: 3,
+  [TitleLevel.FOURTH]: 4,
+  [TitleLevel.FIFTH]: 5,
+  [TitleLevel.SIXTH]: 6
+};
+const titleNodeNameMapping = {
+  H1: TitleLevel.FIRST,
+  H2: TitleLevel.SECOND,
+  H3: TitleLevel.THIRD,
+  H4: TitleLevel.FOURTH,
+  H5: TitleLevel.FIFTH,
+  H6: TitleLevel.SIXTH
+};
+var ControlType;
+(function(ControlType2) {
+  ControlType2["TEXT"] = "text";
+  ControlType2["SELECT"] = "select";
+  ControlType2["CHECKBOX"] = "checkbox";
+})(ControlType || (ControlType = {}));
+var ControlComponent;
+(function(ControlComponent2) {
+  ControlComponent2["PREFIX"] = "prefix";
+  ControlComponent2["POSTFIX"] = "postfix";
+  ControlComponent2["PLACEHOLDER"] = "placeholder";
+  ControlComponent2["VALUE"] = "value";
+  ControlComponent2["CHECKBOX"] = "checkbox";
+})(ControlComponent || (ControlComponent = {}));
+var ImageDisplay;
+(function(ImageDisplay2) {
+  ImageDisplay2["INLINE"] = "inline";
+  ImageDisplay2["BLOCK"] = "block";
+})(ImageDisplay || (ImageDisplay = {}));
 function unzipElementList(elementList) {
   const result = [];
   for (let v = 0; v < elementList.length; v++) {
@@ -3638,9 +3715,11 @@ function formatElementList(elementList, options) {
             if (Array.isArray(valueSets) && valueSets.length) {
               const valueSet = valueSets.find((v) => v.code === code);
               if (valueSet) {
-                valueList = [{
-                  value: valueSet.value
-                }];
+                valueList = [
+                  {
+                    value: valueSet.value
+                  }
+                ];
               }
             }
           }
@@ -3942,8 +4021,9 @@ function formatElementContext(sourceElementList, formatElementList2, anchorIndex
   const { isBreakWhenWrap = false } = options || {};
   for (let e = 0; e < formatElementList2.length; e++) {
     const targetElement = formatElementList2[e];
-    if (isBreakWhenWrap && !copyElement.listId && /^\n/.test(targetElement.value))
+    if (isBreakWhenWrap && !copyElement.listId && /^\n/.test(targetElement.value)) {
       break;
+    }
     if (!copyElement.listId && targetElement.type === ElementType.LIST) {
       (_a = targetElement.valueList) == null ? void 0 : _a.forEach((valueItem) => {
         cloneProperty(TABLE_CONTEXT_ATTR, copyElement, valueItem);
@@ -3956,31 +4036,6 @@ function formatElementContext(sourceElementList, formatElementList2, anchorIndex
     cloneProperty(EDITOR_ELEMENT_CONTEXT_ATTR, copyElement, targetElement);
   }
 }
-function writeClipboardItem(text, html) {
-  if (!text || !html)
-    return;
-  const plainText = new Blob([text], { type: "text/plain" });
-  const htmlText = new Blob([html], { type: "text/html" });
-  if (window.ClipboardItem) {
-    const item = new ClipboardItem({
-      [plainText.type]: plainText,
-      [htmlText.type]: htmlText
-    });
-    window.navigator.clipboard.write([item]);
-  } else {
-    const fakeElement = document.createElement("div");
-    fakeElement.setAttribute("contenteditable", "true");
-    fakeElement.innerHTML = html;
-    document.body.append(fakeElement);
-    const selection = window.getSelection();
-    const range = document.createRange();
-    range.selectNodeContents(fakeElement);
-    selection == null ? void 0 : selection.removeAllRanges();
-    selection == null ? void 0 : selection.addRange(range);
-    document.execCommand("copy");
-    fakeElement.remove();
-  }
-}
 function convertElementToDom(element, options) {
   let tagName = "span";
   if (element.type === ElementType.SUPERSCRIPT) {
@@ -4012,10 +4067,10 @@ function convertElementToDom(element, options) {
   dom.innerText = element.value.replace(new RegExp(`${ZERO}`, "g"), "\n");
   return dom;
 }
-function writeElementList(elementList, options) {
-  function buildDomFromElementList(payload) {
+function createDomFromElementList(elementList, options) {
+  function buildDom(payload) {
     var _a, _b, _c, _d, _e;
-    const clipboardDom2 = document.createElement("div");
+    const clipboardDom = document.createElement("div");
     for (let e = 0; e < payload.length; e++) {
       const element = payload[e];
       if (element.type === ElementType.TABLE) {
@@ -4030,7 +4085,7 @@ function writeElementList(elementList, options) {
             const td = tr.tdList[d];
             tdDom.colSpan = td.colspan;
             tdDom.rowSpan = td.rowspan;
-            const childDom = buildDomFromElementList(zipElementList(td.value));
+            const childDom = buildDom(zipElementList(td.value));
             tdDom.innerHTML = childDom.innerHTML;
             if (td.backgroundColor) {
               tdDom.style.backgroundColor = td.backgroundColor;
@@ -4039,19 +4094,19 @@ function writeElementList(elementList, options) {
           }
           tableDom.append(trDom);
         }
-        clipboardDom2.append(tableDom);
+        clipboardDom.append(tableDom);
       } else if (element.type === ElementType.HYPERLINK) {
         const a = document.createElement("a");
         a.innerText = element.valueList.map((v) => v.value).join("");
         if (element.url) {
           a.href = element.url;
         }
-        clipboardDom2.append(a);
+        clipboardDom.append(a);
       } else if (element.type === ElementType.TITLE) {
         const h = document.createElement(`h${titleOrderNumberMapping[element.level]}`);
-        const childDom = buildDomFromElementList(zipElementList(element.valueList));
+        const childDom = buildDom(zipElementList(element.valueList));
         h.innerHTML = childDom.innerHTML;
-        clipboardDom2.append(h);
+        clipboardDom.append(h);
       } else if (element.type === ElementType.LIST) {
         const list = document.createElement(listTypeElementMapping[element.listType]);
         if (element.listStyle) {
@@ -4083,11 +4138,11 @@ function writeElementList(elementList, options) {
         }
         listElementListMap.forEach((listElementList) => {
           const li = document.createElement("li");
-          const childDom = buildDomFromElementList(listElementList);
+          const childDom = buildDom(listElementList);
           li.innerHTML = childDom.innerHTML;
           list.append(li);
         });
-        clipboardDom2.append(list);
+        clipboardDom.append(list);
       } else if (element.type === ElementType.IMAGE) {
         const img = document.createElement("img");
         if (element.value) {
@@ -4095,46 +4150,39 @@ function writeElementList(elementList, options) {
           img.width = element.width;
           img.height = element.height;
         }
-        clipboardDom2.append(img);
+        clipboardDom.append(img);
       } else if (element.type === ElementType.SEPARATOR) {
         const hr = document.createElement("hr");
-        clipboardDom2.append(hr);
+        clipboardDom.append(hr);
       } else if (element.type === ElementType.CHECKBOX) {
         const checkbox = document.createElement("input");
         checkbox.type = "checkbox";
         if ((_a = element.checkbox) == null ? void 0 : _a.value) {
           checkbox.setAttribute("checked", "true");
         }
-        clipboardDom2.append(checkbox);
+        clipboardDom.append(checkbox);
       } else if (!element.type || element.type === ElementType.LATEX || TEXTLIKE_ELEMENT_TYPE.includes(element.type)) {
-        let text2 = "";
+        let text = "";
         if (element.type === ElementType.CONTROL) {
-          text2 = ((_c = (_b = element.control.value) == null ? void 0 : _b[0]) == null ? void 0 : _c.value) || "";
+          text = ((_c = (_b = element.control.value) == null ? void 0 : _b[0]) == null ? void 0 : _c.value) || "";
         } else if (element.type === ElementType.DATE) {
-          text2 = ((_d = element.valueList) == null ? void 0 : _d.map((v) => v.value).join("")) || "";
+          text = ((_d = element.valueList) == null ? void 0 : _d.map((v) => v.value).join("")) || "";
         } else {
-          text2 = element.value;
+          text = element.value;
         }
-        if (!text2)
+        if (!text)
           continue;
         if (((_e = payload[e - 1]) == null ? void 0 : _e.type) === ElementType.TITLE) {
-          text2 = text2.replace(/^\n/, "");
+          text = text.replace(/^\n/, "");
         }
         const dom = convertElementToDom(element, options);
-        dom.innerText = text2.replace(new RegExp(`${ZERO}`, "g"), "\n");
-        clipboardDom2.append(dom);
+        dom.innerText = text.replace(new RegExp(`${ZERO}`, "g"), "\n");
+        clipboardDom.append(dom);
       }
     }
-    return clipboardDom2;
+    return clipboardDom;
   }
-  const clipboardDom = buildDomFromElementList(zipElementList(elementList));
-  document.body.append(clipboardDom);
-  const text = clipboardDom.innerText;
-  clipboardDom.remove();
-  const html = clipboardDom.innerHTML;
-  if (!text || !html)
-    return;
-  writeClipboardItem(text, html);
+  return buildDom(zipElementList(elementList));
 }
 function convertTextNodeToElement(textNode) {
   if (!textNode || textNode.nodeType !== 3)
@@ -4189,9 +4237,11 @@ function getElementListByHTML(htmlText, options) {
             elementList.push({
               type: ElementType.HYPERLINK,
               value: "",
-              valueList: [{
-                value
-              }],
+              valueList: [
+                {
+                  value
+                }
+              ],
               url: aElement.href
             });
           }
@@ -4394,15 +4444,17 @@ class CursorAgent {
                 let start = 0;
                 while (start < pasteElementList.length) {
                   const pasteElement = pasteElementList[start];
-                  if (anchorElement.titleId && /^\n/.test(pasteElement.value))
+                  if (anchorElement.titleId && /^\n/.test(pasteElement.value)) {
                     break;
+                  }
                   if (VIRTUAL_ELEMENT_TYPE.includes(pasteElement.type)) {
                     pasteElementList.splice(start, 1);
                     if (pasteElement.valueList) {
                       for (let v = 0; v < pasteElement.valueList.length; v++) {
                         const element = pasteElement.valueList[v];
-                        if (element.value === ZERO || element.value === "\n")
+                        if (element.value === ZERO || element.value === "\n") {
                           continue;
+                        }
                         pasteElementList.splice(start, 0, element);
                         start++;
                       }
@@ -4488,7 +4540,7 @@ class Cursor {
     return this.getAgentDom().value;
   }
   clearAgentDomValue() {
-    return this.getAgentDom().value = "";
+    this.getAgentDom().value = "";
   }
   _blinkStart() {
     this.cursorDom.classList.add(this.ANIMATION_CLASS);
@@ -4510,13 +4562,17 @@ class Cursor {
     }
   }
   drawCursor(payload) {
-    const cursorPosition = this.position.getCursorPosition();
+    let cursorPosition = this.position.getCursorPosition();
     if (!cursorPosition)
       return;
     const { scale, cursor } = this.options;
-    const { color, width, isShow = true, isBlink = true, isFocus = true } = __spreadValues(__spreadValues({}, cursor), payload);
+    const { color, width, isShow = true, isBlink = true, isFocus = true, hitLineStartIndex } = __spreadValues(__spreadValues({}, cursor), payload);
     const height = this.draw.getHeight();
     const pageGap = this.draw.getPageGap();
+    if (hitLineStartIndex) {
+      const positionList = this.position.getPositionList();
+      cursorPosition = positionList[hitLineStartIndex];
+    }
     const { metrics, coordinate: { leftTop, rightTop }, ascent, pageNo } = cursorPosition;
     const zoneManager = this.draw.getZone();
     const curPageNo = zoneManager.isMainActive() ? pageNo : this.draw.getPageNo();
@@ -4532,7 +4588,7 @@ class Cursor {
     }
     const descent = metrics.boundingBoxDescent < 0 ? 0 : metrics.boundingBoxDescent;
     const cursorTop = leftTop[1] + ascent + descent - (cursorHeight - offsetHeight) + preY;
-    const cursorLeft = rightTop[0];
+    const cursorLeft = hitLineStartIndex ? leftTop[0] : rightTop[0];
     agentCursorDom.style.left = `${cursorLeft}px`;
     agentCursorDom.style.top = `${cursorTop + cursorHeight - CURSOR_AGENT_HEIGHT * scale}px`;
     if (!isShow)
@@ -4776,7 +4832,7 @@ function mousedown(evt, host) {
   });
   if (!positionResult)
     return;
-  const { index: index2, isDirectHit, isCheckbox, isImage, isTable, tdValueIndex } = positionResult;
+  const { index: index2, isDirectHit, isCheckbox, isImage, isTable, tdValueIndex, hitLineStartIndex } = positionResult;
   host.mouseDownStartPosition = __spreadProps(__spreadValues({}, positionResult), {
     index: isTable ? tdValueIndex : index2
   });
@@ -4811,6 +4867,11 @@ function mousedown(evt, host) {
       isSetCursor: !isDirectHitImage && !isDirectHitCheckbox,
       isCompute: false
     });
+    if (hitLineStartIndex) {
+      host.getDraw().getCursor().drawCursor({
+        hitLineStartIndex
+      });
+    }
   }
   const previewer = draw.getPreviewer();
   previewer.clearResizer();
@@ -4978,8 +5039,9 @@ function mouseleave(evt, host) {
   const draw = host.getDraw();
   const pageContainer = draw.getPageContainer();
   const { x, y, width, height } = pageContainer.getBoundingClientRect();
-  if (evt.x >= x && evt.x <= x + width && evt.y >= y && evt.y <= y + height)
+  if (evt.x >= x && evt.x <= x + width && evt.y >= y && evt.y <= y + height) {
     return;
+  }
   host.setIsAllowSelection(false);
 }
 function mousemove(evt, host) {
@@ -5187,8 +5249,9 @@ function keydown(evt, host) {
         }
       }
       const maxElementListIndex = elementList.length - 1;
-      if (anchorStartIndex > maxElementListIndex || anchorEndIndex > maxElementListIndex)
+      if (anchorStartIndex > maxElementListIndex || anchorEndIndex > maxElementListIndex) {
         return;
+      }
       rangeManager.setRange(anchorStartIndex, anchorEndIndex);
       const isCollapsed2 = anchorStartIndex === anchorEndIndex;
       draw.render({
@@ -5293,6 +5356,10 @@ function keydown(evt, host) {
     if (listener.saved) {
       listener.saved(draw.getValue());
     }
+    const eventBus = draw.getEventBus();
+    if (eventBus.isSubscribe("saved")) {
+      eventBus.emit("saved", draw.getValue());
+    }
     evt.preventDefault();
   } else if (evt.key === KeyMap.ESC) {
     host.clearPainterStyle();
@@ -5302,10 +5369,12 @@ function keydown(evt, host) {
     }
     evt.preventDefault();
   } else if (evt.key === KeyMap.TAB) {
-    draw.insertElementList([{
-      type: ElementType.TAB,
-      value: ""
-    }]);
+    draw.insertElementList([
+      {
+        type: ElementType.TAB,
+        value: ""
+      }
+    ]);
     evt.preventDefault();
   }
 }
@@ -5396,6 +5465,41 @@ function removeComposingInput(host) {
   rangeManager.setRange(startIndex, startIndex);
   host.compositionInfo = null;
 }
+function writeClipboardItem(text, html) {
+  if (!text || !html)
+    return;
+  const plainText = new Blob([text], { type: "text/plain" });
+  const htmlText = new Blob([html], { type: "text/html" });
+  if (window.ClipboardItem) {
+    const item = new ClipboardItem({
+      [plainText.type]: plainText,
+      [htmlText.type]: htmlText
+    });
+    window.navigator.clipboard.write([item]);
+  } else {
+    const fakeElement = document.createElement("div");
+    fakeElement.setAttribute("contenteditable", "true");
+    fakeElement.innerHTML = html;
+    document.body.append(fakeElement);
+    const selection = window.getSelection();
+    const range = document.createRange();
+    range.selectNodeContents(fakeElement);
+    selection == null ? void 0 : selection.removeAllRanges();
+    selection == null ? void 0 : selection.addRange(range);
+    document.execCommand("copy");
+    fakeElement.remove();
+  }
+}
+function writeElementList(elementList, options) {
+  const clipboardDom = createDomFromElementList(elementList, options);
+  document.body.append(clipboardDom);
+  const text = clipboardDom.innerText;
+  clipboardDom.remove();
+  const html = clipboardDom.innerHTML;
+  if (!text || !html)
+    return;
+  writeClipboardItem(text, html);
+}
 function cut(host) {
   const draw = host.getDraw();
   const rangeManager = draw.getRange();
@@ -5762,7 +5866,6 @@ class CanvasEvent {
 class GlobalEvent {
   constructor(draw, canvasEvent) {
     __publicField(this, "draw");
-    __publicField(this, "canvas");
     __publicField(this, "options");
     __publicField(this, "cursor");
     __publicField(this, "canvasEvent");
@@ -5773,17 +5876,17 @@ class GlobalEvent {
     __publicField(this, "control");
     __publicField(this, "dateParticle");
     __publicField(this, "dprMediaQueryList");
-    __publicField(this, "recoverEffect", (evt) => {
+    __publicField(this, "clearSideEffect", (evt) => {
       if (!this.cursor)
         return;
-      const cursorDom = this.cursor.getCursorDom();
-      const agentDom = this.cursor.getAgentDom();
-      const innerDoms = [this.canvas, cursorDom, agentDom, document.body];
-      if (innerDoms.includes(evt.target)) {
+      const target = (evt == null ? void 0 : evt.composedPath()[0]) || evt.target;
+      const pageList = this.draw.getPageList();
+      const innerEditorDom = findParent(target, (node) => pageList.includes(node), true);
+      if (innerEditorDom) {
         this.setRangeStyle();
         return;
       }
-      const outerEditorDom = findParent(evt.target, (node) => !!node && node.nodeType === 1 && !!node.getAttribute(EDITOR_COMPONENT), true);
+      const outerEditorDom = findParent(target, (node) => !!node && node.nodeType === 1 && !!node.getAttribute(EDITOR_COMPONENT), true);
       if (outerEditorDom) {
         this.setRangeStyle();
         this.watchCursorActive();
@@ -5824,14 +5927,16 @@ class GlobalEvent {
     __publicField(this, "_handleVisibilityChange", () => {
       var _a;
       if (document.visibilityState) {
-        (_a = this.cursor) == null ? void 0 : _a.drawCursor();
+        const isCollapsed = this.range.getIsCollapsed();
+        (_a = this.cursor) == null ? void 0 : _a.drawCursor({
+          isShow: isCollapsed
+        });
       }
     });
     __publicField(this, "_handleDprChange", () => {
       this.draw.setPageDevicePixel();
     });
     this.draw = draw;
-    this.canvas = draw.getPage();
     this.options = draw.getOptions();
     this.canvasEvent = canvasEvent;
     this.cursor = null;
@@ -5848,18 +5953,18 @@ class GlobalEvent {
     this.addEvent();
   }
   addEvent() {
-    window.addEventListener("blur", this.recoverEffect);
+    window.addEventListener("blur", this.clearSideEffect);
     document.addEventListener("keyup", this.setRangeStyle);
-    document.addEventListener("click", this.recoverEffect);
+    document.addEventListener("click", this.clearSideEffect);
     document.addEventListener("mouseup", this.setCanvasEventAbility);
     document.addEventListener("wheel", this.setPageScale, { passive: false });
     document.addEventListener("visibilitychange", this._handleVisibilityChange);
     this.dprMediaQueryList.addEventListener("change", this._handleDprChange);
   }
   removeEvent() {
-    window.removeEventListener("blur", this.recoverEffect);
+    window.removeEventListener("blur", this.clearSideEffect);
     document.removeEventListener("keyup", this.setRangeStyle);
-    document.removeEventListener("click", this.recoverEffect);
+    document.removeEventListener("click", this.clearSideEffect);
     document.removeEventListener("mouseup", this.setCanvasEventAbility);
     document.removeEventListener("wheel", this.setPageScale);
     document.removeEventListener("visibilitychange", this._handleVisibilityChange);
@@ -6039,6 +6144,7 @@ class Position {
           metrics,
           ascent: offsetY,
           lineHeight: curRow.height,
+          isFirstLetter: j === 0,
           isLastLetter: j === curRow.elementList.length - 1,
           coordinate: {
             leftTop: [x, y],
@@ -6148,7 +6254,7 @@ class Position {
     const isMainActive = zoneManager.isMainActive();
     const positionNo = isMainActive ? curPageNo : 0;
     for (let j = 0; j < positionList.length; j++) {
-      const { index: index2, pageNo, coordinate: { leftTop, rightTop, leftBottom } } = positionList[j];
+      const { index: index2, pageNo, isFirstLetter, coordinate: { leftTop, rightTop, leftBottom } } = positionList[j];
       if (positionNo !== pageNo)
         continue;
       if (leftTop[0] <= x && rightTop[0] >= x && leftTop[1] <= y && leftBottom[1] >= y) {
@@ -6169,7 +6275,7 @@ class Position {
                 positionList: td.positionList
               });
               if (~tablePosition.index) {
-                const { index: tdValueIndex } = tablePosition;
+                const { index: tdValueIndex, hitLineStartIndex: hitLineStartIndex3 } = tablePosition;
                 const tdValueElement = td.value[tdValueIndex];
                 return {
                   index: index2,
@@ -6183,7 +6289,8 @@ class Position {
                   tdValueIndex,
                   tdId: td.id,
                   trId: tr.id,
-                  tableId: element.id
+                  tableId: element.id,
+                  hitLineStartIndex: hitLineStartIndex3
                 };
               }
             }
@@ -6203,13 +6310,18 @@ class Position {
             isCheckbox: true
           };
         }
+        let hitLineStartIndex2;
         if (elementList[index2].value !== ZERO) {
           const valueWidth = rightTop[0] - leftTop[0];
           if (x < leftTop[0] + valueWidth / 2) {
             curPositionIndex2 = j - 1;
+            if (isFirstLetter) {
+              hitLineStartIndex2 = j;
+            }
           }
         }
         return {
+          hitLineStartIndex: hitLineStartIndex2,
           index: curPositionIndex2,
           isControl: element.type === ElementType.CONTROL
         };
@@ -6217,6 +6329,7 @@ class Position {
     }
     let isLastArea = false;
     let curPositionIndex = -1;
+    let hitLineStartIndex;
     if (isTable) {
       const { scale } = this.options;
       const { td, tablePosition } = payload;
@@ -6242,7 +6355,16 @@ class Position {
         const isHead = x < this.options.margins[3];
         if (isHead) {
           const headIndex = positionList.findIndex((p) => p.pageNo === positionNo && p.rowNo === lastLetterList[j].rowNo);
-          curPositionIndex = ~headIndex ? positionList[headIndex].value === ZERO ? headIndex : headIndex - 1 : index2;
+          if (~headIndex) {
+            if (positionList[headIndex].value === ZERO) {
+              curPositionIndex = headIndex;
+            } else {
+              curPositionIndex = headIndex - 1;
+              hitLineStartIndex = headIndex;
+            }
+          } else {
+            curPositionIndex = index2;
+          }
         } else {
           curPositionIndex = index2;
         }
@@ -6282,6 +6404,7 @@ class Position {
       };
     }
     return {
+      hitLineStartIndex,
       index: curPositionIndex,
       isControl: ((_b = elementList[curPositionIndex]) == null ? void 0 : _b.type) === ElementType.CONTROL
     };
@@ -6328,11 +6451,13 @@ class RangeManager {
     __publicField(this, "options");
     __publicField(this, "range");
     __publicField(this, "listener");
+    __publicField(this, "eventBus");
     __publicField(this, "position");
     __publicField(this, "historyManager");
     this.draw = draw;
     this.options = draw.getOptions();
     this.listener = draw.getListener();
+    this.eventBus = draw.getEventBus();
     this.position = draw.getPosition();
     this.historyManager = draw.getHistoryManager();
     this.range = {
@@ -6401,8 +6526,9 @@ class RangeManager {
       if (!rowArray.includes(rowNo)) {
         rowArray.unshift(rowNo);
       }
-      if (((_a = positionList[start]) == null ? void 0 : _a.value) === ZERO || elementList[start].titleId !== ((_b = elementList[start - 1]) == null ? void 0 : _b.titleId))
+      if (((_a = positionList[start]) == null ? void 0 : _a.value) === ZERO || elementList[start].titleId !== ((_b = elementList[start - 1]) == null ? void 0 : _b.titleId)) {
         break;
+      }
       start--;
     }
     if (startIndex !== endIndex) {
@@ -6422,8 +6548,9 @@ class RangeManager {
     }
     let end = endIndex;
     while (end < positionList.length) {
-      if (positionList[end].value === ZERO || elementList[end].titleId !== ((_c = elementList[end + 1]) == null ? void 0 : _c.titleId))
+      if (positionList[end].value === ZERO || elementList[end].titleId !== ((_c = elementList[end + 1]) == null ? void 0 : _c.titleId)) {
         break;
+      }
       const { pageNo, rowNo } = positionList[end];
       let rowArray = rangeRow.get(pageNo);
       if (!rowArray) {
@@ -6499,7 +6626,9 @@ class RangeManager {
     this.setRange(range.startIndex, range.endIndex, range.tableId, range.startTdIndex, range.endTdIndex, range.startTrIndex, range.endTrIndex);
   }
   setRangeStyle() {
-    if (!this.listener.rangeStyleChange)
+    const rangeStyleChangeListener = this.listener.rangeStyleChange;
+    const isSubscribeRangeStyleChange = this.eventBus.isSubscribe("rangeStyleChange");
+    if (!rangeStyleChangeListener && !isSubscribeRangeStyleChange)
       return;
     const { startIndex, endIndex, isCrossRowCol } = this.range;
     if (!~startIndex && !~endIndex)
@@ -6535,7 +6664,7 @@ class RangeManager {
     const painter = !!this.draw.getPainterStyle();
     const undo = this.historyManager.isCanUndo();
     const redo = this.historyManager.isCanRedo();
-    this.listener.rangeStyleChange({
+    const rangeStyle = {
       type,
       undo,
       redo,
@@ -6554,10 +6683,18 @@ class RangeManager {
       level,
       listType,
       listStyle
-    });
+    };
+    if (rangeStyleChangeListener) {
+      rangeStyleChangeListener(rangeStyle);
+    }
+    if (isSubscribeRangeStyleChange) {
+      this.eventBus.emit("rangeStyleChange", rangeStyle);
+    }
   }
   recoveryRangeStyle() {
-    if (!this.listener.rangeStyleChange)
+    const rangeStyleChangeListener = this.listener.rangeStyleChange;
+    const isSubscribeRangeStyleChange = this.eventBus.isSubscribe("rangeStyleChange");
+    if (!rangeStyleChangeListener && !isSubscribeRangeStyleChange)
       return;
     const font = this.options.defaultFont;
     const size = this.options.defaultSize;
@@ -6565,7 +6702,7 @@ class RangeManager {
     const painter = !!this.draw.getPainterStyle();
     const undo = this.historyManager.isCanUndo();
     const redo = this.historyManager.isCanRedo();
-    this.listener.rangeStyleChange({
+    const rangeStyle = {
       type: null,
       undo,
       redo,
@@ -6584,7 +6721,13 @@ class RangeManager {
       level: null,
       listType: null,
       listStyle: null
-    });
+    };
+    if (rangeStyleChangeListener) {
+      rangeStyleChangeListener(rangeStyle);
+    }
+    if (isSubscribeRangeStyleChange) {
+      this.eventBus.emit("rangeStyleChange", rangeStyle);
+    }
   }
   shrinkBoundary() {
     const elementList = this.draw.getElementList();
@@ -6686,12 +6829,13 @@ class AbstractRichText {
   }
   clearFillInfo() {
     this.fillColor = void 0;
-    return this.fillRect = {
+    this.fillRect = {
       x: 0,
       y: 0,
       width: 0,
       height: 0
     };
+    return this.fillRect;
   }
   recordFillInfo(ctx, x, y, width, height, color) {
     const isFirstRecord = !this.fillRect.width;
@@ -6750,7 +6894,10 @@ class Margin {
     const leftTopPoint = [margins[3], margins[0]];
     const rightTopPoint = [width - margins[1], margins[0]];
     const leftBottomPoint = [margins[3], height - margins[2]];
-    const rightBottomPoint = [width - margins[1], height - margins[2]];
+    const rightBottomPoint = [
+      width - margins[1],
+      height - margins[2]
+    ];
     ctx.moveTo(leftTopPoint[0] - marginIndicatorSize, leftTopPoint[1]);
     ctx.lineTo(...leftTopPoint);
     ctx.lineTo(leftTopPoint[0], leftTopPoint[1] - marginIndicatorSize);
@@ -6971,8 +7118,9 @@ class Search {
   }
   render(ctx, pageIndex) {
     var _a, _b;
-    if (!this.searchMatchList || !this.searchMatchList.length || !this.searchKeyword)
+    if (!this.searchMatchList || !this.searchMatchList.length || !this.searchKeyword) {
       return;
+    }
     const { searchMatchAlpha, searchMatchColor, searchNavigateMatchColor } = this.options;
     const positionList = this.position.getOriginalPositionList();
     const elementList = this.draw.getOriginalElementList();
@@ -8341,8 +8489,9 @@ class SelectControl {
       return;
     const { startIndex } = this.control.getRange();
     const elementList = this.control.getElementList();
-    if (((_a = elementList[startIndex + 1]) == null ? void 0 : _a.controlId) !== this.element.controlId)
+    if (((_a = elementList[startIndex + 1]) == null ? void 0 : _a.controlId) !== this.element.controlId) {
       return;
+    }
     this._createSelectPopupDom();
     this.isPopup = true;
   }
@@ -8488,11 +8637,13 @@ class Control {
     __publicField(this, "draw");
     __publicField(this, "range");
     __publicField(this, "listener");
+    __publicField(this, "eventBus");
     __publicField(this, "options");
     __publicField(this, "activeControl");
     this.draw = draw;
     this.range = draw.getRange();
     this.listener = draw.getListener();
+    this.eventBus = draw.getEventBus();
     this.options = draw.getOptions().control;
     this.activeControl = null;
   }
@@ -8572,17 +8723,24 @@ class Control {
     } else if (control.type === ControlType.CHECKBOX) {
       this.activeControl = new CheckboxControl(element, this);
     }
-    setTimeout(() => {
+    nextTick(() => {
       var _a;
-      if (this.listener.controlChange) {
-        let payload;
-        const value = (_a = this.activeControl) == null ? void 0 : _a.getValue();
-        if (value && value.length) {
-          payload = zipElementList(value)[0].control;
-        } else {
-          payload = pickElementAttr(deepClone(element)).control;
-        }
-        this.listener.controlChange(payload);
+      const controlChangeListener = this.listener.controlChange;
+      const isSubscribeControlChange = this.eventBus.isSubscribe("controlChange");
+      if (!controlChangeListener && !isSubscribeControlChange)
+        return;
+      let payload;
+      const value = (_a = this.activeControl) == null ? void 0 : _a.getValue();
+      if (value && value.length) {
+        payload = zipElementList(value)[0].control;
+      } else {
+        payload = pickElementAttr(deepClone(element)).control;
+      }
+      if (controlChangeListener) {
+        controlChangeListener(payload);
+      }
+      if (isSubscribeControlChange) {
+        this.eventBus.emit("controlChange", payload);
       }
     });
   }
@@ -8592,9 +8750,16 @@ class Control {
         this.activeControl.destroy();
       }
       this.activeControl = null;
-      setTimeout(() => {
-        if (this.listener.controlChange) {
-          this.listener.controlChange(null);
+      nextTick(() => {
+        const controlChangeListener = this.listener.controlChange;
+        const isSubscribeControlChange = this.eventBus.isSubscribe("controlChange");
+        if (!controlChangeListener && !isSubscribeControlChange)
+          return;
+        if (controlChangeListener) {
+          controlChangeListener(null);
+        }
+        if (isSubscribeControlChange) {
+          this.eventBus.emit("controlChange", null);
         }
       });
     }
@@ -8918,7 +9083,12 @@ class Previewer {
     const resizerImage = document.createElement("img");
     resizerImageContainer.append(resizerImage);
     this.container.append(resizerImageContainer);
-    return { resizerSelection, resizerHandleList, resizerImageContainer, resizerImage };
+    return {
+      resizerSelection,
+      resizerHandleList,
+      resizerImageContainer,
+      resizerImage
+    };
   }
   _mousedown(evt) {
     this.canvas = this.draw.getPage();
@@ -9447,7 +9617,8 @@ class DatePicker {
     const { weeks: { sun, mon, tue, wed, thu, fri, sat } } = this.lang;
     const weekList = [sun, mon, tue, wed, thu, fri, sat];
     this.dom.datePickerWeek.childNodes.forEach((child, i) => {
-      child.innerText = weekList[i];
+      const childElement = child;
+      childElement.innerText = weekList[i];
     });
     const hourTitle = this.dom.time.hour.previousElementSibling;
     hourTitle.innerText = this.lang.hour;
@@ -9551,7 +9722,11 @@ class DatePicker {
     timeDomList.forEach((timeDom) => {
       timeDom.querySelectorAll("li").forEach((li) => li.classList.remove("active"));
     });
-    const pickList = [[hourDom, hour], [minuteDom, minute], [secondDom, second]];
+    const pickList = [
+      [hourDom, hour],
+      [minuteDom, minute],
+      [secondDom, second]
+    ];
     pickList.forEach(([dom, time]) => {
       const pickDom = dom.querySelector(`[data-id='${time}']`);
       pickDom.classList.add("active");
@@ -9701,9 +9876,11 @@ class DateParticle {
       type: ElementType.DATE,
       value: "",
       dateFormat: startElement.dateFormat,
-      valueList: [{
-        value: date
-      }]
+      valueList: [
+        {
+          value: date
+        }
+      ]
     };
     formatElementContext(elementList, [dateElement], leftIndex);
     this.draw.insertElementList([dateElement]);
@@ -10088,6 +10265,10 @@ class Zone {
       if (listener.zoneChange) {
         listener.zoneChange(payload);
       }
+      const eventBus = this.draw.getEventBus();
+      if (eventBus.isSubscribe("zoneChange")) {
+        eventBus.emit("zoneChange", payload);
+      }
     });
   }
   drawZoneIndicator() {
@@ -10388,12 +10569,14 @@ class Placeholder {
     if (!data2)
       return;
     this._recovery();
-    this.elementList = [{
-      value: data2,
-      font,
-      size,
-      color
-    }];
+    this.elementList = [
+      {
+        value: data2,
+        font,
+        size,
+        color
+      }
+    ];
     formatElementList(this.elementList, {
       editorOptions: this.options
     });
@@ -10413,12 +10596,13 @@ class Placeholder {
   }
 }
 class Draw {
-  constructor(rootContainer, options, data2, listener) {
+  constructor(rootContainer, options, data2, listener, eventBus) {
     __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");
@@ -10427,6 +10611,7 @@ class Draw {
     __publicField(this, "elementList");
     __publicField(this, "footerElementList");
     __publicField(this, "listener");
+    __publicField(this, "eventBus");
     __publicField(this, "i18n");
     __publicField(this, "canvasEvent");
     __publicField(this, "globalEvent");
@@ -10475,12 +10660,14 @@ class Draw {
     this.pageList = [];
     this.ctxList = [];
     this.pageNo = 0;
+    this.pagePixelRatio = null;
     this.mode = options.mode;
     this.options = options;
     this.headerElementList = data2.header || [];
     this.elementList = data2.main;
     this.footerElementList = data2.footer || [];
     this.listener = listener;
+    this.eventBus = eventBus;
     this._formatContainer();
     this.pageContainer = this._createPageContainer();
     this._createPage(0);
@@ -10622,6 +10809,9 @@ class Draw {
     if (this.listener.visiblePageNoListChange) {
       this.listener.visiblePageNoListChange(this.visiblePageNoList);
     }
+    if (this.eventBus.isSubscribe("visiblePageNoListChange")) {
+      this.eventBus.emit("visiblePageNoListChange", this.visiblePageNoList);
+    }
   }
   getIntersectionPageNo() {
     return this.intersectionPageNo;
@@ -10631,6 +10821,9 @@ class Draw {
     if (this.listener.intersectionPageNoChange) {
       this.listener.intersectionPageNoChange(this.intersectionPageNo);
     }
+    if (this.eventBus.isSubscribe("intersectionPageNoChange")) {
+      this.eventBus.emit("intersectionPageNoChange", this.intersectionPageNo);
+    }
   }
   getPageNo() {
     return this.pageNo;
@@ -10788,8 +10981,9 @@ class Draw {
         let startIndex = endIndex;
         while (startIndex < elementList.length) {
           const curElement = elementList[startIndex];
-          if (curElement.listId !== endElementListId || curElement.value === ZERO)
+          if (curElement.listId !== endElementListId || curElement.value === ZERO) {
             break;
+          }
           delete curElement.listId;
           delete curElement.listType;
           delete curElement.listStyle;
@@ -10805,6 +10999,9 @@ class Draw {
   getListener() {
     return this.listener;
   }
+  getEventBus() {
+    return this.eventBus;
+  }
   getCursor() {
     return this.cursor;
   }
@@ -10850,7 +11047,10 @@ class Draw {
   getRowCount() {
     return this.rowList.length;
   }
-  async getDataURL() {
+  async getDataURL(pixelRatio) {
+    if (pixelRatio) {
+      this.setPagePixelRatio(pixelRatio);
+    }
     this.render({
       isLazy: false,
       isCompute: false,
@@ -10858,7 +11058,11 @@ class Draw {
       isSubmitHistory: false
     });
     await this.imageObserver.allSettled();
-    return this.pageList.map((c) => c.toDataURL());
+    const dataUrlList = this.pageList.map((c) => c.toDataURL());
+    if (pixelRatio) {
+      this.setPagePixelRatio(null);
+    }
+    return dataUrlList;
   }
   getPainterStyle() {
     return this.painterStyle && Object.keys(this.painterStyle).length ? this.painterStyle : null;
@@ -10891,7 +11095,7 @@ class Draw {
     this.options.pageMode = payload;
     if (payload === PageMode.PAGING) {
       const { height } = this.options;
-      const dpr = window.devicePixelRatio;
+      const dpr = this.getPagePixelRatio();
       const canvas = this.pageList[0];
       canvas.style.height = `${height}px`;
       canvas.height = height * dpr;
@@ -10910,10 +11114,13 @@ class Draw {
       if (this.listener.pageModeChange) {
         this.listener.pageModeChange(payload);
       }
+      if (this.eventBus.isSubscribe("pageModeChange")) {
+        this.eventBus.emit("pageModeChange", payload);
+      }
     });
   }
   setPageScale(payload) {
-    const dpr = window.devicePixelRatio;
+    const dpr = this.getPagePixelRatio();
     this.options.scale = payload;
     const width = this.getWidth();
     const height = this.getHeight();
@@ -10934,8 +11141,18 @@ class Draw {
       this.listener.pageScaleChange(payload);
     }
   }
+  getPagePixelRatio() {
+    return this.pagePixelRatio || window.devicePixelRatio;
+  }
+  setPagePixelRatio(payload) {
+    if (!this.pagePixelRatio && payload === window.devicePixelRatio || payload === this.pagePixelRatio) {
+      return;
+    }
+    this.pagePixelRatio = payload;
+    this.setPageDevicePixel();
+  }
   setPageDevicePixel() {
-    const dpr = window.devicePixelRatio;
+    const dpr = this.getPagePixelRatio();
     const width = this.getWidth();
     const height = this.getHeight();
     this.pageList.forEach((p, i) => {
@@ -10951,7 +11168,7 @@ class Draw {
   setPaperSize(width, height) {
     this.options.width = width;
     this.options.height = height;
-    const dpr = window.devicePixelRatio;
+    const dpr = this.getPagePixelRatio();
     const realWidth = this.getWidth();
     const realHeight = this.getHeight();
     this.container.style.width = `${realWidth}px`;
@@ -10968,7 +11185,7 @@ class Draw {
     });
   }
   setPaperDirection(payload) {
-    const dpr = window.devicePixelRatio;
+    const dpr = this.getPagePixelRatio();
     this.options.paperDirection = payload;
     const width = this.getWidth();
     const height = this.getHeight();
@@ -11067,7 +11284,7 @@ class Draw {
     canvas.style.marginBottom = `${this.getPageGap()}px`;
     canvas.setAttribute("data-index", String(pageNo));
     this.pageContainer.append(canvas);
-    const dpr = window.devicePixelRatio;
+    const dpr = this.getPagePixelRatio();
     canvas.width = width * dpr;
     canvas.height = height * dpr;
     canvas.style.cursor = "text";
@@ -11077,7 +11294,7 @@ class Draw {
     this.ctxList.push(ctx);
   }
   _initPageContext(ctx) {
-    const dpr = window.devicePixelRatio;
+    const dpr = this.getPagePixelRatio();
     ctx.scale(dpr, dpr);
     ctx.letterSpacing = "0px";
     ctx.wordSpacing = "0px";
@@ -11385,7 +11602,7 @@ class Draw {
     if (pageMode === PageMode.CONTINUITY) {
       pageRowList[0] = this.rowList;
       pageHeight += this.rowList.reduce((pre, cur) => pre + cur.height, 0);
-      const dpr = window.devicePixelRatio;
+      const dpr = this.getPagePixelRatio();
       const pageDom = this.pageList[0];
       const pageDomHeight = Number(pageDom.style.height.replace("px", ""));
       if (pageHeight > pageDomHeight) {
@@ -11733,8 +11950,16 @@ class Draw {
       if (this.listener.pageSizeChange) {
         this.listener.pageSizeChange(this.pageRowList.length);
       }
-      if (this.listener.contentChange && isSubmitHistory) {
-        this.listener.contentChange();
+      if (this.eventBus.isSubscribe("pageSizeChange")) {
+        this.eventBus.emit("pageSizeChange", this.pageRowList.length);
+      }
+      if (isSubmitHistory) {
+        if (this.listener.contentChange) {
+          this.listener.contentChange();
+        }
+        if (this.eventBus.isSubscribe("contentChange")) {
+          this.eventBus.emit("contentChange");
+        }
       }
     });
   }
@@ -11822,6 +12047,7 @@ class Command {
     __publicField(this, "getCatalog");
     __publicField(this, "getImage");
     __publicField(this, "getValue");
+    __publicField(this, "getHTML");
     __publicField(this, "getWordCount");
     __publicField(this, "getRangeText");
     __publicField(this, "getRangeContext");
@@ -11901,6 +12127,7 @@ class Command {
     this.executeWordTool = adapt.wordTool.bind(adapt);
     this.getImage = adapt.getImage.bind(adapt);
     this.getValue = adapt.getValue.bind(adapt);
+    this.getHTML = adapt.getHTML.bind(adapt);
     this.getWordCount = adapt.getWordCount.bind(adapt);
     this.getRangeText = adapt.getRangeText.bind(adapt);
     this.getRangeContext = adapt.getRangeContext.bind(adapt);
@@ -12125,8 +12352,9 @@ class CommandAdapt {
       return;
     let isExistUpdate = false;
     selection.forEach((el) => {
-      if (!el.size && payload === defaultSize || el.size && el.size === payload)
+      if (!el.size && payload === defaultSize || el.size && el.size === payload) {
         return;
+      }
       el.size = payload;
       isExistUpdate = true;
     });
@@ -12529,13 +12757,15 @@ class CommandAdapt {
         id: newTdId,
         rowspan: 1,
         colspan: curTd.colspan,
-        value: [{
-          value: ZERO,
-          size: 16,
-          tableId,
-          trId: newTrId,
-          tdId: newTdId
-        }]
+        value: [
+          {
+            value: ZERO,
+            size: 16,
+            tableId,
+            trId: newTrId,
+            tdId: newTdId
+          }
+        ]
       });
     }
     curTrList.splice(trIndex, 0, newTr);
@@ -12590,13 +12820,15 @@ class CommandAdapt {
         id: newTdId,
         rowspan: 1,
         colspan: curTd.colspan,
-        value: [{
-          value: ZERO,
-          size: 16,
-          tableId,
-          trId: newTrId,
-          tdId: newTdId
-        }]
+        value: [
+          {
+            value: ZERO,
+            size: 16,
+            tableId,
+            trId: newTrId,
+            tdId: newTdId
+          }
+        ]
       });
     }
     curTrList.splice(trIndex + 1, 0, newTr);
@@ -12632,13 +12864,15 @@ class CommandAdapt {
         id: tdId,
         rowspan: 1,
         colspan: 1,
-        value: [{
-          value: ZERO,
-          size: 16,
-          tableId,
-          trId: tr.id,
-          tdId
-        }]
+        value: [
+          {
+            value: ZERO,
+            size: 16,
+            tableId,
+            trId: tr.id,
+            tdId
+          }
+        ]
       });
     }
     const colgroup = element.colgroup;
@@ -12686,13 +12920,15 @@ class CommandAdapt {
         id: tdId,
         rowspan: 1,
         colspan: 1,
-        value: [{
-          value: ZERO,
-          size: 16,
-          tableId,
-          trId: tr.id,
-          tdId
-        }]
+        value: [
+          {
+            value: ZERO,
+            size: 16,
+            tableId,
+            trId: tr.id,
+            tdId
+          }
+        ]
       });
     }
     const colgroup = element.colgroup;
@@ -12748,13 +12984,15 @@ class CommandAdapt {
             id: tdId,
             rowspan: 1,
             colspan: 1,
-            value: [{
-              value: ZERO,
-              size: 16,
-              tableId: element.id,
-              trId: tr.id,
-              tdId
-            }]
+            value: [
+              {
+                value: ZERO,
+                size: 16,
+                tableId: element.id,
+                trId: tr.id,
+                tdId
+              }
+            ]
           });
           start += 1;
         }
@@ -12963,13 +13201,15 @@ class CommandAdapt {
           id: tdId,
           rowspan: 1,
           colspan: 1,
-          value: [{
-            value: ZERO,
-            size: 16,
-            tableId: element.id,
-            trId: curTr.id,
-            tdId
-          }]
+          value: [
+            {
+              value: ZERO,
+              size: 16,
+              tableId: element.id,
+              trId: curTr.id,
+              tdId
+            }
+          ]
         });
       }
       curTd.colspan = 1;
@@ -12983,13 +13223,15 @@ class CommandAdapt {
             id: tdId,
             rowspan: 1,
             colspan: 1,
-            value: [{
-              value: ZERO,
-              size: 16,
-              tableId: element.id,
-              trId: tr.id,
-              tdId
-            }]
+            value: [
+              {
+                value: ZERO,
+                size: 16,
+                tableId: element.id,
+                trId: tr.id,
+                tdId
+              }
+            ]
           });
         }
       }
@@ -13188,8 +13430,9 @@ class CommandAdapt {
     let curIndex = -1;
     const endElement = elementList[endIndex + 1];
     if (endElement && endElement.type === ElementType.SEPARATOR) {
-      if (endElement.dashArray && endElement.dashArray.join() === payload.join())
+      if (endElement.dashArray && endElement.dashArray.join() === payload.join()) {
         return;
+      }
       curIndex = endIndex;
       endElement.dashArray = payload;
     } else {
@@ -13217,10 +13460,12 @@ class CommandAdapt {
     const activeControl = this.control.getActiveControl();
     if (activeControl)
       return;
-    this.insertElementList([{
-      type: ElementType.PAGE_BREAK,
-      value: WRAP
-    }]);
+    this.insertElementList([
+      {
+        type: ElementType.PAGE_BREAK,
+        value: WRAP
+      }
+    ]);
   }
   addWatermark(payload) {
     const isReadonly = this.draw.isReadonly();
@@ -13408,13 +13653,13 @@ class CommandAdapt {
     });
   }
   async print() {
-    const { scale } = this.options;
+    const { scale, printPixelRatio } = this.options;
     if (scale !== 1) {
       this.draw.setPageScale(1);
     }
     const width = this.draw.getOriginalWidth();
     const height = this.draw.getOriginalHeight();
-    const base64List = await this.draw.getDataURL();
+    const base64List = await this.draw.getDataURL(printPixelRatio);
     printImageBase64(base64List, width, height);
     if (scale !== 1) {
       this.draw.setPageScale(scale);
@@ -13449,12 +13694,23 @@ class CommandAdapt {
       isSetCursor: false
     });
   }
-  getImage() {
-    return this.draw.getDataURL();
+  getImage(pixelRatio) {
+    return this.draw.getDataURL(pixelRatio);
   }
   getValue(options) {
     return this.draw.getValue(options);
   }
+  getHTML() {
+    const options = this.options;
+    const headerElementList = this.draw.getHeaderElementList();
+    const mainElementList = this.draw.getOriginalMainElementList();
+    const footerElementList = this.draw.getFooterElementList();
+    return {
+      header: createDomFromElementList(headerElementList, options).innerHTML,
+      main: createDomFromElementList(mainElementList, options).innerHTML,
+      footer: createDomFromElementList(footerElementList, options).innerHTML
+    };
+  }
   getWordCount() {
     return this.workerManager.getWordCount();
   }
@@ -13649,7 +13905,7 @@ const controlMenus = [
     i18nPath: "contextmenu.control.delete",
     when: (payload) => {
       var _a;
-      return !payload.editorHasSelection && ((_a = payload.startElement) == null ? void 0 : _a.type) === ElementType.CONTROL;
+      return !payload.isReadonly && !payload.editorHasSelection && ((_a = payload.startElement) == null ? void 0 : _a.type) === ElementType.CONTROL;
     },
     callback: (command) => {
       command.executeRemoveControl();
@@ -13714,7 +13970,7 @@ const hyperlinkMenus = [
     i18nPath: "contextmenu.hyperlink.delete",
     when: (payload) => {
       var _a;
-      return ((_a = payload.startElement) == null ? void 0 : _a.type) === ElementType.HYPERLINK;
+      return !payload.isReadonly && ((_a = payload.startElement) == null ? void 0 : _a.type) === ElementType.HYPERLINK;
     },
     callback: (command) => {
       command.executeDeleteHyperlink();
@@ -13724,7 +13980,7 @@ const hyperlinkMenus = [
     i18nPath: "contextmenu.hyperlink.cancel",
     when: (payload) => {
       var _a;
-      return ((_a = payload.startElement) == null ? void 0 : _a.type) === ElementType.HYPERLINK;
+      return !payload.isReadonly && ((_a = payload.startElement) == null ? void 0 : _a.type) === ElementType.HYPERLINK;
     },
     callback: (command) => {
       command.executeCancelHyperlink();
@@ -13734,7 +13990,7 @@ const hyperlinkMenus = [
     i18nPath: "contextmenu.hyperlink.edit",
     when: (payload) => {
       var _a;
-      return ((_a = payload.startElement) == null ? void 0 : _a.type) === ElementType.HYPERLINK;
+      return !payload.isReadonly && ((_a = payload.startElement) == null ? void 0 : _a.type) === ElementType.HYPERLINK;
     },
     callback: (command, context) => {
       var _a;
@@ -13751,7 +14007,7 @@ const imageMenus = [
     icon: "image-change",
     when: (payload) => {
       var _a;
-      return !payload.editorHasSelection && ((_a = payload.startElement) == null ? void 0 : _a.type) === ElementType.IMAGE;
+      return !payload.isReadonly && !payload.editorHasSelection && ((_a = payload.startElement) == null ? void 0 : _a.type) === ElementType.IMAGE;
     },
     callback: (command) => {
       const proxyInputFile = document.createElement("input");
@@ -13784,7 +14040,7 @@ const imageMenus = [
     i18nPath: "contextmenu.image.textWrap",
     when: (payload) => {
       var _a;
-      return !payload.editorHasSelection && ((_a = payload.startElement) == null ? void 0 : _a.type) === ElementType.IMAGE;
+      return !payload.isReadonly && !payload.editorHasSelection && ((_a = payload.startElement) == null ? void 0 : _a.type) === ElementType.IMAGE;
     },
     childMenus: [
       {
@@ -14008,9 +14264,10 @@ class ContextMenu {
       }
       evt.preventDefault();
     });
-    __publicField(this, "_handleEffect", (evt) => {
+    __publicField(this, "_handleSideEffect", (evt) => {
       if (this.contextMenuContainerList.length) {
-        const contextMenuDom = findParent(evt.target, (node) => !!node && node.nodeType === 1 && node.getAttribute(EDITOR_COMPONENT) === EditorComponent.CONTEXTMENU, true);
+        const target = (evt == null ? void 0 : evt.composedPath()[0]) || evt.target;
+        const contextMenuDom = findParent(target, (node) => !!node && node.nodeType === 1 && node.getAttribute(EDITOR_COMPONENT) === EditorComponent.CONTEXTMENU, true);
         if (!contextMenuDom) {
           this.dispose();
         }
@@ -14036,11 +14293,11 @@ class ContextMenu {
   }
   _addEvent() {
     this.container.addEventListener("contextmenu", this._proxyContextMenuEvent);
-    document.addEventListener("mousedown", this._handleEffect);
+    document.addEventListener("mousedown", this._handleSideEffect);
   }
   removeEvent() {
     this.container.removeEventListener("contextmenu", this._proxyContextMenuEvent);
-    document.removeEventListener("mousedown", this._handleEffect);
+    document.removeEventListener("mousedown", this._handleSideEffect);
   }
   _getContext() {
     const isReadonly = this.draw.isReadonly();
@@ -14375,11 +14632,7 @@ class Shortcut {
     this.command = command;
     this.globalShortcutList = [];
     this.agentShortcutList = [];
-    this._addShortcutList([
-      ...richtextKeys,
-      ...titleKeys,
-      ...listKeys
-    ]);
+    this._addShortcutList([...richtextKeys, ...titleKeys, ...listKeys]);
     this._addEvent();
     const agentDom = draw.getCursor().getAgentDom();
     agentDom.addEventListener("keydown", this._agentKeydown.bind(this));
@@ -14440,10 +14693,48 @@ class Plugin {
     pluginFunction(this.editor, options);
   }
 }
+class EventBus {
+  constructor() {
+    __publicField(this, "eventHub");
+    this.eventHub = new Map();
+  }
+  on(eventName, callback) {
+    if (!eventName || typeof callback !== "function")
+      return;
+    const eventSet = this.eventHub.get(eventName) || new Set();
+    eventSet.add(callback);
+    this.eventHub.set(eventName, eventSet);
+  }
+  emit(eventName, payload) {
+    if (!eventName)
+      return;
+    const callBackSet = this.eventHub.get(eventName);
+    if (!callBackSet)
+      return;
+    if (callBackSet.size === 1) {
+      const callBack = [...callBackSet];
+      return callBack[0](payload);
+    }
+    callBackSet.forEach((callBack) => callBack(payload));
+  }
+  off(eventName, callback) {
+    if (!eventName || typeof callback !== "function")
+      return;
+    const callBackSet = this.eventHub.get(eventName);
+    if (!callBackSet)
+      return;
+    callBackSet.delete(callback);
+  }
+  isSubscribe(eventName) {
+    const eventSet = this.eventHub.get(eventName);
+    return !!eventSet && eventSet.size > 0;
+  }
+}
 class Editor {
   constructor(container, data2, options = {}) {
     __publicField(this, "command");
     __publicField(this, "listener");
+    __publicField(this, "eventBus");
     __publicField(this, "register");
     __publicField(this, "destroy");
     __publicField(this, "use");
@@ -14492,7 +14783,8 @@ class Editor {
       paperDirection: PaperDirection.VERTICAL,
       inactiveAlpha: 0.6,
       historyMaxRecordCount: 100,
-      wordBreak: WordBreak.BREAK_WORD
+      wordBreak: WordBreak.BREAK_WORD,
+      printPixelRatio: 3
     }, options), {
       header: headerOptions,
       footer: footerOptions,
@@ -14514,17 +14806,23 @@ class Editor {
       mainElementList = data2.main;
       footerElementList = data2.footer || [];
     }
-    [headerElementList, mainElementList, footerElementList].forEach((elementList) => {
+    const pageComponentData = [
+      headerElementList,
+      mainElementList,
+      footerElementList
+    ];
+    pageComponentData.forEach((elementList) => {
       formatElementList(elementList, {
         editorOptions
       });
     });
     this.listener = new Listener();
+    this.eventBus = new EventBus();
     const draw = new Draw(container, editorOptions, {
       header: headerElementList,
       main: mainElementList,
       footer: footerElementList
-    }, this.listener);
+    }, this.listener, this.eventBus);
     this.command = new Command(new CommandAdapt(draw));
     const contextMenu = new ContextMenu(draw, this.command);
     const shortcut = new Shortcut(draw, this.command);