@ebl-vue/editor-full 1.0.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.postcssrc.yml +33 -0
- package/LICENSE +21 -0
- package/README.md +1 -0
- package/dist/index.d.ts +5 -0
- package/dist/index.mjs +2565 -0
- package/dist/index.mjs.map +1 -0
- package/package.json +55 -0
- package/postcss.config.js +15 -0
- package/src/components/Editor/Editor.vue +209 -0
- package/src/components/index.ts +27 -0
- package/src/constants/index.ts +1 -0
- package/src/i18n/zh-cn.ts +151 -0
- package/src/icons/index.ts +78 -0
- package/src/index.ts +11 -0
- package/src/installer.ts +22 -0
- package/src/plugins/alert/index.css +150 -0
- package/src/plugins/alert/index.ts +463 -0
- package/src/plugins/block-alignment/index.css +9 -0
- package/src/plugins/block-alignment/index.ts +116 -0
- package/src/plugins/block-alignment/readme.md +1 -0
- package/src/plugins/code/LICENSE +21 -0
- package/src/plugins/code/index.css +120 -0
- package/src/plugins/code/index.ts +530 -0
- package/src/plugins/code/utils/string.ts +34 -0
- package/src/plugins/color-picker/index.ts +138 -0
- package/src/plugins/color-picker/styles.css +27 -0
- package/src/plugins/delimiter/index.css +14 -0
- package/src/plugins/delimiter/index.ts +122 -0
- package/src/plugins/drag-drop/index.css +19 -0
- package/src/plugins/drag-drop/index.ts +151 -0
- package/src/plugins/drag-drop/readme.md +1 -0
- package/src/plugins/header/H1.ts +405 -0
- package/src/plugins/header/H2.ts +403 -0
- package/src/plugins/header/H3.ts +404 -0
- package/src/plugins/header/H4.ts +405 -0
- package/src/plugins/header/H5.ts +405 -0
- package/src/plugins/header/H6.ts +406 -0
- package/src/plugins/header/index.css +20 -0
- package/src/plugins/header/index.ts +15 -0
- package/src/plugins/header/types.d.ts +46 -0
- package/src/plugins/indent/index.css +86 -0
- package/src/plugins/indent/index.ts +697 -0
- package/src/plugins/inline-code/index.css +11 -0
- package/src/plugins/inline-code/index.ts +205 -0
- package/src/plugins/list/ListRenderer/ChecklistRenderer.ts +211 -0
- package/src/plugins/list/ListRenderer/ListRenderer.ts +73 -0
- package/src/plugins/list/ListRenderer/OrderedListRenderer.ts +123 -0
- package/src/plugins/list/ListRenderer/UnorderedListRenderer.ts +123 -0
- package/src/plugins/list/ListRenderer/index.ts +6 -0
- package/src/plugins/list/ListTabulator/index.ts +1179 -0
- package/src/plugins/list/index.ts +502 -0
- package/src/plugins/list/styles/CssPrefix.ts +4 -0
- package/src/plugins/list/styles/icons/index.ts +10 -0
- package/src/plugins/list/styles/input.css +36 -0
- package/src/plugins/list/styles/list.css +165 -0
- package/src/plugins/list/types/Elements.ts +14 -0
- package/src/plugins/list/types/ItemMeta.ts +40 -0
- package/src/plugins/list/types/ListParams.ts +102 -0
- package/src/plugins/list/types/ListRenderer.ts +6 -0
- package/src/plugins/list/types/OlCounterType.ts +63 -0
- package/src/plugins/list/types/index.ts +14 -0
- package/src/plugins/list/utils/focusItem.ts +18 -0
- package/src/plugins/list/utils/getChildItems.ts +40 -0
- package/src/plugins/list/utils/getItemChildWrapper.ts +10 -0
- package/src/plugins/list/utils/getItemContentElement.ts +10 -0
- package/src/plugins/list/utils/getSiblings.ts +52 -0
- package/src/plugins/list/utils/isLastItem.ts +9 -0
- package/src/plugins/list/utils/itemHasSublist.ts +10 -0
- package/src/plugins/list/utils/normalizeData.ts +84 -0
- package/src/plugins/list/utils/removeChildWrapperIfEmpty.ts +31 -0
- package/src/plugins/list/utils/renderToolboxInput.ts +105 -0
- package/src/plugins/list/utils/stripNumbers.ts +7 -0
- package/src/plugins/list/utils/type-guards.ts +8 -0
- package/src/plugins/list.md +15 -0
- package/src/plugins/marker/index.css +4 -0
- package/src/plugins/marker/index.ts +187 -0
- package/src/plugins/paragraph/index.css +23 -0
- package/src/plugins/paragraph/index.ts +380 -0
- package/src/plugins/paragraph/types/icons.d.ts +4 -0
- package/src/plugins/paragraph/utils/makeFragment.ts +17 -0
- package/src/plugins/quote/index.css +26 -0
- package/src/plugins/quote/index.ts +206 -0
- package/src/plugins/table/index.ts +4 -0
- package/src/plugins/table/plugin.ts +254 -0
- package/src/plugins/table/style.css +388 -0
- package/src/plugins/table/table.ts +1192 -0
- package/src/plugins/table/toolbox.ts +165 -0
- package/src/plugins/table/utils/dom.ts +128 -0
- package/src/plugins/table/utils/popover.ts +172 -0
- package/src/plugins/table/utils/throttled.ts +22 -0
- package/src/plugins/underline/index.css +3 -0
- package/src/plugins/underline/index.ts +216 -0
- package/src/plugins/undo/index.ts +509 -0
- package/src/plugins/undo/observer.ts +101 -0
- package/src/style.css +89 -0
- package/src/utils/index.ts +15 -0
- package/src/utils/install.ts +19 -0
- package/tsconfig.json +37 -0
- package/types/index.d.ts +13 -0
- package/types/plugins/index.d.ts +0 -0
- package/vite.config.ts +79 -0
package/dist/index.mjs
ADDED
|
@@ -0,0 +1,2565 @@
|
|
|
1
|
+
(function(){"use strict";try{if(typeof document!="undefined"){var e=document.createElement("style");e.appendChild(document.createTextNode(':root{--color-border: #EFF0F1}.ebl-editor-title{min-height:55px}.ebl-editor-title-wrap{min-height:55px;margin:0 auto}.ebl-editor-title-input{min-height:55px;width:100%;font-weight:600;border:none;background-color:transparent;font-size:34px}.ebl-editor-title-input:focus{outline:none}.ebl-editor-title-input:active{outline:none}.ebl-editor-time-wrap{white-space:nowrap;font-size:14px;font-weight:400;line-height:22px;padding-top:12px;padding-bottom:8px;color:#646a73}.ce-block__content{max-width:650px}@media (min-width: 1050px){.ce-block__content,.ce-toolbar__content{max-width:700px}}.ce-toolbar,.ce-inline-toolbar{z-index:1000}.ce-toolbar__plus{border:1px solid #EFF0F1}.ce-toolbar .ce-popover__items{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap}.ce-toolbar .ce-popover__items .ce-popover-item{position:relative}.ce-toolbar .ce-popover__items .ce-popover-item__title{display:none}.ce-toolbar .ce-popover-item-html,.ce-toolbar .ce-popover-item-separator,.ce-toolbar .ce-popover-item[data-item-name=convert-to]{width:100%}.ce-toolbar .ce-popover-item[data-item-name=convert-to] .ce-popover-item__title{display:block}.ce-inline-toolbar .ce-popover__items{display:-webkit-box!important;display:-ms-flexbox!important;display:flex!important}.ce-inline-toolbar .ce-popover__items{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap}.ce-inline-toolbar .ce-popover__items .ce-popover-item__title{display:none}.ce-block--drop-target .ce-block__content:before{content:"";position:absolute;top:50%;left:-20px;margin-top:-1px;height:8px;width:8px;border:solid #a0a0a0;border-width:1px 1px 0 0;-webkit-transform-origin:right;transform-origin:right;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.ce-block--drop-target .ce-block__content:after{background:none}.ce-header{padding:.6em 0 3px;margin:0;line-height:1.25em;outline:none}.ce-header p,.ce-header div{padding:0!important;margin:0!important}.ce-tune-alignment--right{text-align:right}.ce-tune-alignment--center{text-align:center}.ce-tune-alignment--left{text-align:left}.ce-paragraph{line-height:1.6em;outline:none}.ce-block:only-of-type .ce-paragraph[data-placeholder-active]:empty:before,.ce-block:only-of-type .ce-paragraph[data-placeholder-active][data-empty=true]:before{content:attr(data-placeholder-active)}.ce-paragraph p:first-of-type{margin-top:0}.ce-paragraph p:last-of-type{margin-bottom:0}.ce-editorjs-x-shiki{border-radius:10px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;margin:10px 0}.ce-editorjs-x-shiki__code{position:relative;float:left;min-width:100%;overflow-x:auto}.ce-editorjs-x-shiki__selector{display:-webkit-box;display:-ms-flexbox;display:flex;gap:.25rem;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;z-index:12;border-bottom-style:solid;border-color:#9ca3af0d;padding:.5rem}.ce-editorjs-x-shiki__selector-language,.ce-editorjs-x-shiki__selector-theme{font-size:13px;font-family:inherit}.ce-editorjs-x-shiki__selector-language{width:90px}.ce-editorjs-x-shiki__selector select{border:none;outline:none}.ce-editorjs-x-shiki__span{position:relative;z-index:0;padding:20px;margin:0;white-space:pre;font-size:13px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.ce-editorjs-x-shiki__textarea{white-space:pre;overflow:hidden;background-color:transparent;position:absolute;padding:20px;inset:0;color:transparent;z-index:0;font-size:13px;caret-color:#999;resize:none;border:none;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.ce-editorjs-x-shiki__copy{width:24px;height:24px;cursor:pointer;position:relative;margin-right:0}.ce-editorjs-x-shiki__copy_tip{font-size:12px;width:60px;margin-left:-20px;background-color:#0c0c0c;color:#ececec;text-align:center;border-radius:6px;padding:5px 10px;position:absolute;z-index:1;top:125%;-webkit-transition:opacity .3s;transition:opacity .3s;visibility:hidden;opacity:0}.ce-editorjs-x-shiki__copy_tip:after{content:"";position:absolute;bottom:100%;left:50%;margin-left:-5px;border-width:5px;border-style:solid;border-color:transparent transparent #0c0c0c transparent}.ce-editorjs-x-shiki__copy_tip.visible{visibility:visible;opacity:1}.cdx-quote{overflow:hidden;margin:0;-webkit-box-sizing:border-box;box-sizing:border-box;word-wrap:break-word;word-break:break-all}.cdx-quote blockquote{margin:0}.cdx-block-quote{border:solid #acacac;border-width:0 0 0 3px;-webkit-box-shadow:none;box-shadow:none;color:#666;line-height:1.6em;padding:1px 0 0 12px;text-align:left}.ce-delimiter__line__wrapper{height:24px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.ce-delimiter__line{-webkit-box-flex:1;-ms-flex:1;flex:1;height:2px;background-color:#eff0f1}.cdx-list{margin:0;padding:0;outline:none;display:grid;counter-reset:item;grid-gap:var(--spacing-s);padding:var(--spacing-xs);--spacing-s: 8px;--spacing-xs: 6px;--list-counter-type: numeric;--radius-border: 5px;--checkbox-background: #fff;--color-border: #C9C9C9;--color-bg-checked: #369FFF;--line-height: 1.45em;--color-bg-checked-hover: #0059AB;--color-tick: #fff;--size-checkbox: 1.2em}.cdx-list ol{padding-left:0}.cdx-list__item{line-height:var(--line-height);display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;grid-template-areas:"checkbox content" ". child"}.cdx-list__item-children{display:grid;grid-area:child;grid-gap:var(--spacing-s);padding-top:var(--spacing-s)}.cdx-list__item [contenteditable]{outline:none}.cdx-list__item-content{word-break:break-word;white-space:pre-wrap;grid-area:content;padding-left:var(--spacing-s)}.cdx-list__item:before{counter-increment:item;white-space:nowrap}.cdx-list-ordered .cdx-list__item:before{content:counters(item,".",var(--list-counter-type)) "."}.cdx-list-ordered{counter-reset:item}.cdx-list-unordered{padding-left:0}.cdx-list-unordered .cdx-list__item:before{content:"•"}.cdx-list-checklist .cdx-list__item:before{content:""}.cdx-list__settings .cdx-settings-button{width:50%}.cdx-list__checkbox{padding-top:calc((var(--line-height) - var(--size-checkbox)) / 2);grid-area:checkbox;width:var(--size-checkbox);height:var(--size-checkbox);display:-webkit-box;display:-ms-flexbox;display:flex;cursor:pointer}.cdx-list__checkbox svg{opacity:0;height:var(--size-checkbox);width:var(--size-checkbox);left:-1px;top:-1px;position:absolute}@media (hover: hover){.cdx-list__checkbox:not(.cdx-list__checkbox--no-hover):hover .cdx-list__checkbox-check svg{opacity:1}}.cdx-list__checkbox--checked{line-height:var(--line-height)}@media (hover: hover){.cdx-list__checkbox--checked:not(.cdx-list__checkbox--checked--no-hover):hover .cdx-checklist__checkbox-check{background:var(--color-bg-checked-hover);border-color:var(--color-bg-checked-hover)}}.cdx-list__checkbox--checked .cdx-list__checkbox-check{background:var(--color-bg-checked);border-color:var(--color-bg-checked)}.cdx-list__checkbox--checked .cdx-list__checkbox-check svg{opacity:1}.cdx-list__checkbox--checked .cdx-list__checkbox-check svg path{stroke:var(--color-tick)}.cdx-list__checkbox--checked .cdx-list__checkbox-check:before{opacity:0;visibility:visible;-webkit-transform:scale(2.5);transform:scale(2.5)}.cdx-list__checkbox-check{cursor:pointer;display:inline-block;position:relative;margin:0 auto;width:var(--size-checkbox);height:var(--size-checkbox);-webkit-box-sizing:border-box;box-sizing:border-box;border-radius:var(--radius-border);border:1px solid var(--color-border);background:var(--checkbox-background)}.cdx-list__checkbox-check:before{content:"";position:absolute;inset:0;border-radius:100%;background-color:var(--color-bg-checked);visibility:hidden;pointer-events:none;-webkit-transform:scale(1);transform:scale(1);-webkit-transition:opacity .4s,-webkit-transform .4s ease-out;transition:opacity .4s,-webkit-transform .4s ease-out;transition:transform .4s ease-out,opacity .4s;transition:transform .4s ease-out,opacity .4s,-webkit-transform .4s ease-out}.cdx-list__checkbox-check--disabled{pointer-events:none}.cdx-list-start-with-field{background:#f8f8f8;border:1px solid rgba(226,226,229,.2);border-radius:6px;padding:2px;display:grid;grid-template-columns:auto auto 1fr;grid-template-rows:auto}.cdx-list-start-with-field--invalid{background:#ffeced;border:1px solid #E13F3F}.cdx-list-start-with-field--invalid .cdx-list-start-with-field__input{color:#e13f3f}.cdx-list-start-with-field__input{font-size:14px;outline:none;font-weight:500;font-family:inherit;border:0;background:transparent;margin:0;padding:0;line-height:22px;min-width:calc(100% - var(--toolbox-buttons-size) - var(--icon-margin-right))}.cdx-list-start-with-field__input::-webkit-input-placeholder{color:var(--grayText);font-weight:500}.cdx-list-start-with-field__input::-moz-placeholder{color:var(--grayText);font-weight:500}.cdx-list-start-with-field__input:-ms-input-placeholder{color:var(--grayText);font-weight:500}.cdx-list-start-with-field__input::-ms-input-placeholder{color:var(--grayText);font-weight:500}.cdx-list-start-with-field__input::placeholder{color:var(--grayText);font-weight:500}.cdx-alert{position:relative;padding:10px;border-radius:5px;margin-bottom:10px}.cdx-alert-primary{background-color:#ebf8ff;border:1px solid #4299e1;color:#2b6cb0}.cdx-alert-secondary{background-color:#f7fafc;border:1px solid #cbd5e0;color:#222731}.cdx-alert-info{background-color:#e6fdff;border:1px solid #4cd4ce;color:#00727c}.cdx-alert-success{background-color:#f0fff4;border:1px solid #68d391;color:#2f855a}.cdx-alert-warning{background-color:#fffaf0;border:1px solid #ed8936;color:#c05621}.cdx-alert-danger{background-color:#fff5f5;border:1px solid #fc8181;color:#c53030}.cdx-alert-light{background-color:#fff;border:1px solid #edf2f7;color:#1a202c}.cdx-alert-dark{background-color:#2d3748;border:1px solid #1a202c;color:#d3d3d3}.cdx-alert-align-left{text-align:left}.cdx-alert-align-center{text-align:center}.cdx-alert-align-right{text-align:right}.cdx-alert__message{outline:none}.cdx-alert [contentEditable=true][data-placeholder]:before{position:absolute;content:attr(data-placeholder);color:#707684;font-weight:400;opacity:0}.cdx-alert [contentEditable=true][data-placeholder]:empty:before{opacity:1}.cdx-alert [contentEditable=true][data-placeholder]:empty:focus:before{opacity:0}.ce-popover__item[data-item-name=alert-primary] .ce-popover__item-icon svg #background{fill:#ebf8ff;stroke:#4299e1}.ce-popover__item[data-item-name=alert-primary] .ce-popover__item-icon svg #content{fill:#2b6cb0}.ce-popover__item[data-item-name=alert-secondary] .ce-popover__item-icon svg #background{fill:#f7fafc;stroke:#cbd5e0}.ce-popover__item[data-item-name=alert-secondary] .ce-popover__item-icon svg #content{fill:#222731}.ce-popover__item[data-item-name=alert-info] .ce-popover__item-icon svg #background{fill:#e6fdff;stroke:#4cd4ce}.ce-popover__item[data-item-name=alert-info] .ce-popover__item-icon svg #content{fill:#00727c}.ce-popover__item[data-item-name=alert-success] .ce-popover__item-icon svg #background{fill:#f0fff4;stroke:#68d391}.ce-popover__item[data-item-name=alert-success] .ce-popover__item-icon svg #content{fill:#2f855a}.ce-popover__item[data-item-name=alert-warning] .ce-popover__item-icon svg #background{fill:#fffaf0;stroke:#ed8936}.ce-popover__item[data-item-name=alert-warning] .ce-popover__item-icon svg #content{fill:#c05621}.ce-popover__item[data-item-name=alert-danger] .ce-popover__item-icon svg #background{fill:#fff5f5;stroke:#fc8181}.ce-popover__item[data-item-name=alert-danger] .ce-popover__item-icon svg #content{fill:#c53030}.ce-popover__item[data-item-name=alert-light] .ce-popover__item-icon svg #background{fill:#fff;stroke:#edf2f7}.ce-popover__item[data-item-name=alert-light] .ce-popover__item-icon svg #content{fill:#1a202c}.ce-popover__item[data-item-name=alert-dark] .ce-popover__item-icon svg #background{fill:#2d3748;stroke:#1a202c}.ce-popover__item[data-item-name=alert-dark] .ce-popover__item-icon svg #content{fill:#d3d3d3}.cdx-alert_setting__icon_wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:10px}.cdx-alert_setting__icon_wrapper_align{margin-top:10px}.cdx-alert_setting__icon{display:inline-block;width:24px;height:24px;text-align:center;line-height:24px;cursor:pointer}.cdx-alert_setting__icon_active{opacity:.3}.ce-popover-indent-item{cursor:default!important}.ce-popover-indent-item{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:3px}.ce-popover-indent-item[version^="2.26"]{gap:10px}.ce-popover-indent-item:hover{background-color:transparent!important}.ce-popover-indent-item .ce-popover-item__icon{width:26px;height:26px;cursor:pointer;will-change:background-color,color;transition:.3s background-color,.3s color;padding:0;border-width:0px;color:#000;background-color:#fff;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;-webkit-transition:.3s background-color,.3s color;-moz-transition:.3s background-color,.3s color;-ms-transition:.3s background-color,.3s color;-o-transition:.3s background-color,.3s color}.ce-popover-indent-item .ce-popover-item--disabled{color:#707684;opacity:.3;cursor:default}.ce-popover-indent-item .ce-popover-item__icon:focus{outline:none}.ce-popover-indent-item[version^="2.26"]:hover .ce-popover-item__icon,.ce-popover-indent-item[version^="2.27"]:hover .ce-popover-item__icon,.ce-popover-indent-item[version^="2.28"]:hover .ce-popover-item__icon,.ce-popover-indent-item[version^="2.29"]:hover .ce-popover-item__icon,.ce-popover-indent-item[version^="2.26"] .ce-popover-item__icon,.ce-popover-indent-item[version^="2.27"] .ce-popover-item__icon,.ce-popover-indent-item[version^="2.28"] .ce-popover-item__icon,.ce-popover-indent-item[version^="2.29"] .ce-popover-item__icon{box-shadow:0 0 0 1px #c9c9cc7a!important;-webkit-box-shadow:0 0 0 1px rgba(201,201,204,.48)!important}.ce-popover-indent-item[version^="2.26"] .ce-popover-item__icon:hover,.ce-popover-indent-item[version^="2.27"] .ce-popover-item__icon:hover,.ce-popover-indent-item[version^="2.28"] .ce-popover-item__icon:hover,.ce-popover-indent-item[version^="2.29"] .ce-popover-item__icon:hover{background-color:#eff2f5}.ce-highlight-indent{display:inline-block;height:1.6em;top:50%;position:absolute;transform:translateY(-50%);-webkit-transform:translate(0px,-50%);-moz-transform:translate(0px,-50%);-ms-transform:translate(0px,-50%);-o-transform:translate(0px,-50%)}.ce-popover-indent-item[version^="2.3"] .ce-popover-item__title{margin-left:4px}.cdx-marker{background:#f5eb6f4a;padding:3px 0}.ce-popover--inline .ce-popover--nested .ce-popover__container{width:-webkit-min-content!important;width:-moz-min-content!important;width:min-content!important;min-width:0!important;min-width:initial!important}.ce-popover--inline .ce-popover--nested .ce-popover__items{width:-webkit-max-content;width:-moz-max-content;width:max-content}.editorjs__color-selector-container{display:grid;grid-gap:10px;padding:4px}.editorjs__color-selector__container-item{width:30px;height:30px;display:block;cursor:pointer;border-radius:100%;-webkit-transition:-webkit-transform .2s ease;transition:-webkit-transform .2s ease;transition:transform .2s ease;transition:transform .2s ease,-webkit-transform .2s ease}.editorjs__color-selector__container-item:hover{-webkit-transform:scale(1.1);transform:scale(1.1)}.cdx-underline{-webkit-text-decoration:underline;text-decoration:underline}.inline-code{background:#faeff0c7;color:#b44437;padding:3px 4px;border-radius:5px;margin:0 1px;font-family:inherit;font-size:.86em;font-weight:500;letter-spacing:.3px}.tc-wrap{--color-background: #f9f9fb;--color-text-secondary: #7b7e89;--color-border: #e8e8eb;--cell-size: 34px;--toolbox-icon-size: 18px;--toolbox-padding: 6px;--toolbox-aiming-field-size: calc(var(--toolbox-icon-size) + var(--toolbox-padding)*2);--col-width: 100px 100px 100px;position:relative;height:100%;margin-top:var(--toolbox-icon-size);-webkit-box-sizing:border-box;box-sizing:border-box;display:inline-grid;z-index:0}.tc-wrap svg{vertical-align:top}@media print{.tc-wrap{border-left-color:var(--color-border);border-left-style:solid;border-left-width:1px}}@media print{.tc-wrap .tc-row:after{display:none}}.tc-table{position:relative;width:100%;height:100%;display:grid;font-size:14px;border-top:1px solid var(--color-border);border-left:1px solid var(--color-border);line-height:1.4;overflow-x:auto}.tc-table:after{width:calc(var(--cell-size));height:100%;left:calc(var(--cell-size)*-1);top:0}.tc-table:after,.tc-table:before{position:absolute;content:""}.tc-table:before{width:100%;height:var(--toolbox-aiming-field-size);top:calc(var(--toolbox-aiming-field-size)*-1);left:0}.tc-table--heading .tc-row:first-child{font-weight:600;border-bottom:2px solid var(--color-border);position:sticky;top:0;z-index:2;background:var(--color-background)}.tc-table--heading .tc-row:first-child [contenteditable]:empty:before{content:attr(heading);color:var(--color-text-secondary)}.tc-table--heading .tc-row:first-child:after{bottom:-2px;border-bottom:2px solid var(--color-border)}.tc-add-column,.tc-add-row{display:-webkit-box;display:-ms-flexbox;display:flex;color:var(--color-text-secondary)}@media print{.tc-add{display:none}}.tc-add-column{display:grid;border-top:1px solid var(--color-border);grid-auto-rows:var(--cell-size);-webkit-box-align:center;-ms-flex-align:center;align-items:center;justify-items:center}.tc-add-column svg{padding:5px;position:sticky;top:0;background-color:var(--color-background)}.tc-add-column--disabled{visibility:hidden}@media print{.tc-add-column{display:none}}.tc-add-row{height:var(--cell-size);-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding-left:4px;position:relative}.tc-add-row--disabled{display:none}.tc-add-row:before{content:"";position:absolute;right:calc(var(--cell-size)*-1);width:var(--cell-size);height:100%}@media print{.tc-add-row{display:none}}.tc-add-column,.tc-add-row{-webkit-transition:0s;transition:0s;cursor:pointer;will-change:background-color}.tc-add-column:hover,.tc-add-row:hover{-webkit-transition:background-color .1s ease;transition:background-color .1s ease;background-color:var(--color-background)}.tc-add-row{margin-top:1px}.tc-add-row:hover:before{-webkit-transition:.1s;transition:.1s;background-color:var(--color-background)}.tc-row{display:grid;grid-template-columns:var(--col-width);position:relative;border-bottom:1px solid var(--color-border)}.tc-row--selected{background:var(--color-background)}.tc-row--selected:after{background:var(--color-background)}.tc-cell{border-right:1px solid var(--color-border);padding:6px 12px;overflow:hidden;outline:none;line-break:normal}.tc-cell--selected{background:var(--color-background)}.tc-wrap--readonly .tc-row:after{display:none}.tc-toolbox{--toolbox-padding: 6px;--popover-margin: 30px;--toggler-click-zone-size: 30px;--toggler-dots-color: #7b7e89;--toggler-dots-color-hovered: #1d202b;position:absolute;cursor:pointer;z-index:1;opacity:0;-webkit-transition:opacity .1s;transition:opacity .1s;will-change:left,opacity}.tc-toolbox--column{top:calc(var(--toggler-click-zone-size)*-1);-webkit-transform:translate(calc(var(--toggler-click-zone-size)*-1/2));transform:translate(calc(var(--toggler-click-zone-size)*-1/2));will-change:left,opacity}.tc-toolbox--row{left:calc(var(--popover-margin)*-1);-webkit-transform:translateY(calc(var(--toggler-click-zone-size)*-1/2));transform:translateY(calc(var(--toggler-click-zone-size)*-1/2));margin-top:-1px;will-change:top,opacity}.tc-toolbox--showed{opacity:1}.tc-toolbox .tc-popover{position:absolute;top:0;left:var(--popover-margin)}.tc-toolbox__toggler{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:var(--toggler-click-zone-size);height:var(--toggler-click-zone-size);color:var(--toggler-dots-color);opacity:0;-webkit-transition:opacity .15s ease;transition:opacity .15s ease;will-change:opacity}.tc-toolbox__toggler:hover{color:var(--toggler-dots-color-hovered)}.tc-toolbox__toggler svg{fill:currentColor}.tc-wrap:hover .tc-toolbox__toggler{opacity:1}.tc-settings .cdx-settings-button{width:50%;margin:0}.tc-popover{--color-border: #eaeaea;--color-background: #fff;--color-background-hover: rgba(232, 232, 235, .49);--color-background-confirm: #e24a4a;--color-background-confirm-hover: #d54040;--color-text-confirm: #fff;background:var(--color-background);border:1px solid var(--color-border);-webkit-box-shadow:0 3px 15px -3px rgba(13,20,33,.12941);box-shadow:0 3px 15px -3px #0d142121;border-radius:6px;padding:6px;display:none;will-change:opacity,transform}.tc-popover--opened{display:block;-webkit-animation:menuShowing .1s cubic-bezier(.215,.61,.355,1) forwards;animation:menuShowing .1s cubic-bezier(.215,.61,.355,1) forwards}.tc-popover__item{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:2px 14px 2px 2px;border-radius:5px;cursor:pointer;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.tc-popover__item:hover{background:var(--color-background-hover)}.tc-popover__item:not(:last-of-type){margin-bottom:2px}.tc-popover__item-icon{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:26px;height:26px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background:var(--color-background);border-radius:5px;border:1px solid var(--color-border);margin-right:8px}.tc-popover__item-label{line-height:22px;font-size:14px;font-weight:500}.tc-popover__item--confirm{background:var(--color-background-confirm);color:var(--color-text-confirm)}.tc-popover__item--confirm:hover{background-color:var(--color-background-confirm-hover)}.tc-popover__item--confirm .tc-popover__item-icon{background:var(--color-background-confirm);border-color:#0000001a}.tc-popover__item--confirm .tc-popover__item-icon svg{-webkit-transition:-webkit-transform .2s ease-in;transition:-webkit-transform .2s ease-in;transition:transform .2s ease-in;transition:transform .2s ease-in,-webkit-transform .2s ease-in;-webkit-transform:rotate(90deg) scale(1.2);transform:rotate(90deg) scale(1.2)}.tc-popover__item--hidden{display:none}@-webkit-keyframes menuShowing{0%{opacity:0;-webkit-transform:translateY(-8px) scale(.9);transform:translateY(-8px) scale(.9)}70%{opacity:1;-webkit-transform:translateY(2px);transform:translateY(2px)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes menuShowing{0%{opacity:0;-webkit-transform:translateY(-8px) scale(.9);transform:translateY(-8px) scale(.9)}70%{opacity:1;-webkit-transform:translateY(2px);transform:translateY(2px)}to{-webkit-transform:translateY(0);transform:translateY(0)}}.cell-resizable{cursor:col-resize}')),document.head.appendChild(e)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}})();
|
|
2
|
+
import { defineComponent as Mt, inject as _t, ref as Ht, onMounted as It, toRaw as At, onUnmounted as Bt, createElementBlock as Ot, openBlock as Dt, createElementVNode as P, withDirectives as Rt, vModelText as Nt, toDisplayString as $t } from "vue";
|
|
3
|
+
import Pt from "@ebl-vue/editorjs";
|
|
4
|
+
import { bundledLanguagesInfo as Wt, codeToHtml as zt } from "shiki";
|
|
5
|
+
import { make as w, isEmpty as it } from "@editorjs/dom";
|
|
6
|
+
import { focus as qt, isCaretAtStartOfInput as Ft, getCaretNodeAndOffset as Ut, getContenteditableSlice as Vt } from "@editorjs/caret";
|
|
7
|
+
import rt from "vanilla-caret-js";
|
|
8
|
+
const ot = Symbol("INSTALLED_KEY"), jt = (d, t) => (d.install = (e) => {
|
|
9
|
+
for (const i of [d, ...Object.values({})]) e.component(i.name, i);
|
|
10
|
+
}, d);
|
|
11
|
+
class Yt {
|
|
12
|
+
constructor(t, e, i, s) {
|
|
13
|
+
const { blocks: n, toolbar: r } = i;
|
|
14
|
+
this.toolbar = r, this.borderStyle = s || "1px dashed #aaa", this.api = n, this.holder = document.getElementById(t), this.readOnly = e, this.startBlock = null, this.endBlock = null, this.setDragListener(), this.setDropListener();
|
|
15
|
+
}
|
|
16
|
+
setElementCursor(t) {
|
|
17
|
+
if (!t) return;
|
|
18
|
+
const e = document.createRange(), i = window.getSelection();
|
|
19
|
+
e.setStart(t.childNodes[0], 0), e.collapse(!0), i == null || i.removeAllRanges(), i == null || i.addRange(e), t.focus();
|
|
20
|
+
}
|
|
21
|
+
setDragListener() {
|
|
22
|
+
var t;
|
|
23
|
+
if (!this.readOnly) {
|
|
24
|
+
const e = (t = this.holder) == null ? void 0 : t.querySelector(".ce-toolbar__settings-btn");
|
|
25
|
+
e ? this.initializeDragListener(e) : new MutationObserver((i, s) => {
|
|
26
|
+
var r;
|
|
27
|
+
const n = (r = this.holder) == null ? void 0 : r.querySelector(".ce-toolbar__settings-btn");
|
|
28
|
+
n && (this.initializeDragListener(n), s.disconnect());
|
|
29
|
+
}).observe(this.holder, { childList: !0, subtree: !0 });
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
initializeDragListener(t) {
|
|
33
|
+
t.setAttribute("draggable", "true"), t.addEventListener("dragstart", () => {
|
|
34
|
+
this.startBlock = this.api.getCurrentBlockIndex();
|
|
35
|
+
}), t.addEventListener("drag", () => {
|
|
36
|
+
if (this.toolbar.close(), !this.isTheOnlyBlock()) {
|
|
37
|
+
const e = this.holder.querySelectorAll(".ce-block"), i = this.holder.querySelector(".ce-block--drop-target");
|
|
38
|
+
this.setElementCursor(i), this.setBorderBlocks(e, i);
|
|
39
|
+
}
|
|
40
|
+
});
|
|
41
|
+
}
|
|
42
|
+
setBorderBlocks(t, e) {
|
|
43
|
+
Object.values(t).forEach((i) => {
|
|
44
|
+
const s = i.querySelector(".ce-block__content");
|
|
45
|
+
if (i !== e) s == null || s.style.removeProperty("border-top"), s == null || s.style.removeProperty("border-bottom");
|
|
46
|
+
else {
|
|
47
|
+
const n = Object.keys(t).find((r) => t[Number(r)] === e);
|
|
48
|
+
n && Number(n) > this.startBlock ? s.style.borderBottom = this.borderStyle : s.style.borderTop = this.borderStyle;
|
|
49
|
+
}
|
|
50
|
+
});
|
|
51
|
+
}
|
|
52
|
+
setDropListener() {
|
|
53
|
+
document.addEventListener("drop", (t) => {
|
|
54
|
+
const { target: e } = t;
|
|
55
|
+
if (this.holder.contains(e) && this.startBlock !== null) {
|
|
56
|
+
const i = this.getDropTarget(e);
|
|
57
|
+
if (i) {
|
|
58
|
+
const s = i.querySelector(".ce-block__content");
|
|
59
|
+
s == null || s.style.removeProperty("border-top"), s == null || s.style.removeProperty("border-bottom"), this.endBlock = this.getTargetPosition(i), this.moveBlocks();
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
this.startBlock = null;
|
|
63
|
+
});
|
|
64
|
+
}
|
|
65
|
+
static get isReadOnlySupported() {
|
|
66
|
+
return !0;
|
|
67
|
+
}
|
|
68
|
+
getDropTarget(t) {
|
|
69
|
+
return t.classList.contains("ce-block") ? t : t.closest(".ce-block");
|
|
70
|
+
}
|
|
71
|
+
getTargetPosition(t) {
|
|
72
|
+
return Array.from(t.parentNode.children).indexOf(t);
|
|
73
|
+
}
|
|
74
|
+
isTheOnlyBlock() {
|
|
75
|
+
return this.api.getBlocksCount() === 1;
|
|
76
|
+
}
|
|
77
|
+
moveBlocks() {
|
|
78
|
+
this.isTheOnlyBlock() || this.api.move(this.endBlock, this.startBlock);
|
|
79
|
+
}
|
|
80
|
+
}
|
|
81
|
+
const at = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M6 7L6 12M6 17L6 12M6 12L12 12M12 7V12M12 17L12 12"/><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M19 17V10.2135C19 10.1287 18.9011 10.0824 18.836 10.1367L16 12.5"/></svg>';
|
|
82
|
+
class Gt {
|
|
83
|
+
constructor({ data: t, config: e, api: i, readOnly: s }) {
|
|
84
|
+
this.api = i, this.readOnly = s, this._settings = { placeholder: "H1" }, this._data = this.normalizeData(t), this._element = this.getTag();
|
|
85
|
+
}
|
|
86
|
+
get _CSS() {
|
|
87
|
+
return { block: this.api.styles.block, wrapper: "ce-header" };
|
|
88
|
+
}
|
|
89
|
+
isHeaderData(t) {
|
|
90
|
+
return t.text !== void 0;
|
|
91
|
+
}
|
|
92
|
+
normalizeData(t) {
|
|
93
|
+
const e = { text: "", level: this.defaultLevel.number };
|
|
94
|
+
return this.isHeaderData(t) && (e.text = t.text || "", t.level === void 0 || isNaN(parseInt(t.level.toString())) || (e.level = parseInt(t.level.toString()))), e;
|
|
95
|
+
}
|
|
96
|
+
render() {
|
|
97
|
+
return this._element;
|
|
98
|
+
}
|
|
99
|
+
setLevel(t) {
|
|
100
|
+
this.data = { level: t, text: this.data.text };
|
|
101
|
+
}
|
|
102
|
+
merge(t) {
|
|
103
|
+
this._element.insertAdjacentHTML("beforeend", t.text);
|
|
104
|
+
}
|
|
105
|
+
validate(t) {
|
|
106
|
+
return t.text.trim() !== "";
|
|
107
|
+
}
|
|
108
|
+
save(t) {
|
|
109
|
+
return { text: t.innerHTML, level: this.defaultLevel.number };
|
|
110
|
+
}
|
|
111
|
+
static get conversionConfig() {
|
|
112
|
+
return { export: "text", import: "text" };
|
|
113
|
+
}
|
|
114
|
+
static get sanitize() {
|
|
115
|
+
return { level: !1, text: {} };
|
|
116
|
+
}
|
|
117
|
+
static get isReadOnlySupported() {
|
|
118
|
+
return !0;
|
|
119
|
+
}
|
|
120
|
+
get data() {
|
|
121
|
+
return this._data.text = this._element.innerHTML, this._data.level = this.defaultLevel.number, this._data;
|
|
122
|
+
}
|
|
123
|
+
set data(t) {
|
|
124
|
+
if (this._data = this.normalizeData(t), t.level !== void 0 && this._element.parentNode) {
|
|
125
|
+
const e = this.getTag();
|
|
126
|
+
e.innerHTML = this._element.innerHTML, this._element.parentNode.replaceChild(e, this._element), this._element = e;
|
|
127
|
+
}
|
|
128
|
+
t.text !== void 0 && (this._element.innerHTML = this._data.text || "");
|
|
129
|
+
}
|
|
130
|
+
getTag() {
|
|
131
|
+
const t = this.createHeadingElement();
|
|
132
|
+
return this.setElementContent(t), this.addStylesToElement(t), this.setEditability(t), this.addPlaceholder(t), t;
|
|
133
|
+
}
|
|
134
|
+
createHeadingElement() {
|
|
135
|
+
return document.createElement(this.defaultLevel.tag);
|
|
136
|
+
}
|
|
137
|
+
setElementContent(t) {
|
|
138
|
+
t.innerHTML = this._data.text || "";
|
|
139
|
+
}
|
|
140
|
+
addStylesToElement(t) {
|
|
141
|
+
t.classList.add(this._CSS.wrapper);
|
|
142
|
+
}
|
|
143
|
+
setEditability(t) {
|
|
144
|
+
t.contentEditable = this.readOnly ? "false" : "true";
|
|
145
|
+
}
|
|
146
|
+
addPlaceholder(t) {
|
|
147
|
+
t.dataset.placeholder = this.api.i18n.t(this._settings.placeholder || "");
|
|
148
|
+
}
|
|
149
|
+
get defaultLevel() {
|
|
150
|
+
return { number: 1, tag: "H1", svg: at };
|
|
151
|
+
}
|
|
152
|
+
onPaste(t) {
|
|
153
|
+
const e = t.detail;
|
|
154
|
+
if ("data" in e) {
|
|
155
|
+
const i = e.data;
|
|
156
|
+
this.data = { level: 1, text: i.innerHTML };
|
|
157
|
+
}
|
|
158
|
+
}
|
|
159
|
+
static get pasteConfig() {
|
|
160
|
+
return { tags: ["H1"] };
|
|
161
|
+
}
|
|
162
|
+
static get toolbox() {
|
|
163
|
+
return { icon: at, title: "H1" };
|
|
164
|
+
}
|
|
165
|
+
}
|
|
166
|
+
const lt = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M6 7L6 12M6 17L6 12M6 12L12 12M12 7V12M12 17L12 12"/><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M16 11C16 10 19 9.5 19 12C19 13.9771 16.0684 13.9997 16.0012 16.8981C15.9999 16.9533 16.0448 17 16.1 17L19.3 17"/></svg>';
|
|
167
|
+
class Kt {
|
|
168
|
+
constructor({ data: t, config: e, api: i, readOnly: s }) {
|
|
169
|
+
this.api = i, this.readOnly = s, this._settings = { placeholder: "H2" }, this._data = this.normalizeData(t), this._element = this.getTag();
|
|
170
|
+
}
|
|
171
|
+
get _CSS() {
|
|
172
|
+
return { block: this.api.styles.block, wrapper: "ce-header" };
|
|
173
|
+
}
|
|
174
|
+
isHeaderData(t) {
|
|
175
|
+
return t.text !== void 0;
|
|
176
|
+
}
|
|
177
|
+
normalizeData(t) {
|
|
178
|
+
const e = { text: "", level: this.defaultLevel.number };
|
|
179
|
+
return this.isHeaderData(t) && (e.text = t.text || "", t.level === void 0 || isNaN(parseInt(t.level.toString())) || (e.level = parseInt(t.level.toString()))), e;
|
|
180
|
+
}
|
|
181
|
+
render() {
|
|
182
|
+
return this._element;
|
|
183
|
+
}
|
|
184
|
+
setLevel(t) {
|
|
185
|
+
this.data = { level: t, text: this.data.text };
|
|
186
|
+
}
|
|
187
|
+
merge(t) {
|
|
188
|
+
this._element.insertAdjacentHTML("beforeend", t.text);
|
|
189
|
+
}
|
|
190
|
+
validate(t) {
|
|
191
|
+
return t.text.trim() !== "";
|
|
192
|
+
}
|
|
193
|
+
save(t) {
|
|
194
|
+
return { text: t.innerHTML, level: this.defaultLevel.number };
|
|
195
|
+
}
|
|
196
|
+
static get conversionConfig() {
|
|
197
|
+
return { export: "text", import: "text" };
|
|
198
|
+
}
|
|
199
|
+
static get sanitize() {
|
|
200
|
+
return { level: !1, text: {} };
|
|
201
|
+
}
|
|
202
|
+
static get isReadOnlySupported() {
|
|
203
|
+
return !0;
|
|
204
|
+
}
|
|
205
|
+
get data() {
|
|
206
|
+
return this._data.text = this._element.innerHTML, this._data.level = this.defaultLevel.number, this._data;
|
|
207
|
+
}
|
|
208
|
+
set data(t) {
|
|
209
|
+
if (this._data = this.normalizeData(t), t.level !== void 0 && this._element.parentNode) {
|
|
210
|
+
const e = this.getTag();
|
|
211
|
+
e.innerHTML = this._element.innerHTML, this._element.parentNode.replaceChild(e, this._element), this._element = e;
|
|
212
|
+
}
|
|
213
|
+
t.text !== void 0 && (this._element.innerHTML = this._data.text || "");
|
|
214
|
+
}
|
|
215
|
+
getTag() {
|
|
216
|
+
const t = this.createHeadingElement();
|
|
217
|
+
return this.setElementContent(t), this.addStylesToElement(t), this.setEditability(t), this.addPlaceholder(t), t;
|
|
218
|
+
}
|
|
219
|
+
createHeadingElement() {
|
|
220
|
+
return document.createElement(this.defaultLevel.tag);
|
|
221
|
+
}
|
|
222
|
+
setElementContent(t) {
|
|
223
|
+
t.innerHTML = this._data.text || "";
|
|
224
|
+
}
|
|
225
|
+
addStylesToElement(t) {
|
|
226
|
+
t.classList.add(this._CSS.wrapper);
|
|
227
|
+
}
|
|
228
|
+
setEditability(t) {
|
|
229
|
+
t.contentEditable = this.readOnly ? "false" : "true";
|
|
230
|
+
}
|
|
231
|
+
addPlaceholder(t) {
|
|
232
|
+
t.dataset.placeholder = this.api.i18n.t(this._settings.placeholder || "");
|
|
233
|
+
}
|
|
234
|
+
get defaultLevel() {
|
|
235
|
+
return { number: 2, tag: "H2", svg: lt };
|
|
236
|
+
}
|
|
237
|
+
onPaste(t) {
|
|
238
|
+
const e = t.detail;
|
|
239
|
+
if ("data" in e) {
|
|
240
|
+
const i = e.data;
|
|
241
|
+
this.data = { level: 2, text: i.innerHTML };
|
|
242
|
+
}
|
|
243
|
+
}
|
|
244
|
+
static get pasteConfig() {
|
|
245
|
+
return { tags: ["H2"] };
|
|
246
|
+
}
|
|
247
|
+
static get toolbox() {
|
|
248
|
+
return { icon: lt, title: "H2" };
|
|
249
|
+
}
|
|
250
|
+
}
|
|
251
|
+
const ht = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M6 7L6 12M6 17L6 12M6 12L12 12M12 7V12M12 17L12 12"/><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M16 11C16 10.5 16.8323 10 17.6 10C18.3677 10 19.5 10.311 19.5 11.5C19.5 12.5315 18.7474 12.9022 18.548 12.9823C18.5378 12.9864 18.5395 13.0047 18.5503 13.0063C18.8115 13.0456 20 13.3065 20 14.8C20 16 19.5 17 17.8 17C17.8 17 16 17 16 16.3"/></svg>';
|
|
252
|
+
class Xt {
|
|
253
|
+
constructor({ data: t, config: e, api: i, readOnly: s }) {
|
|
254
|
+
this.api = i, this.readOnly = s, this._settings = { placeholder: "H3" }, this._data = this.normalizeData(t), this._element = this.getTag();
|
|
255
|
+
}
|
|
256
|
+
get _CSS() {
|
|
257
|
+
return { block: this.api.styles.block, wrapper: "ce-header" };
|
|
258
|
+
}
|
|
259
|
+
isHeaderData(t) {
|
|
260
|
+
return t.text !== void 0;
|
|
261
|
+
}
|
|
262
|
+
normalizeData(t) {
|
|
263
|
+
const e = { text: "", level: this.defaultLevel.number };
|
|
264
|
+
return this.isHeaderData(t) && (e.text = t.text || "", t.level === void 0 || isNaN(parseInt(t.level.toString())) || (e.level = parseInt(t.level.toString()))), e;
|
|
265
|
+
}
|
|
266
|
+
render() {
|
|
267
|
+
return this._element;
|
|
268
|
+
}
|
|
269
|
+
setLevel(t) {
|
|
270
|
+
this.data = { level: t, text: this.data.text };
|
|
271
|
+
}
|
|
272
|
+
merge(t) {
|
|
273
|
+
this._element.insertAdjacentHTML("beforeend", t.text);
|
|
274
|
+
}
|
|
275
|
+
validate(t) {
|
|
276
|
+
return t.text.trim() !== "";
|
|
277
|
+
}
|
|
278
|
+
save(t) {
|
|
279
|
+
return { text: t.innerHTML, level: this.defaultLevel.number };
|
|
280
|
+
}
|
|
281
|
+
static get conversionConfig() {
|
|
282
|
+
return { export: "text", import: "text" };
|
|
283
|
+
}
|
|
284
|
+
static get sanitize() {
|
|
285
|
+
return { level: !1, text: {} };
|
|
286
|
+
}
|
|
287
|
+
static get isReadOnlySupported() {
|
|
288
|
+
return !0;
|
|
289
|
+
}
|
|
290
|
+
get data() {
|
|
291
|
+
return this._data.text = this._element.innerHTML, this._data.level = this.defaultLevel.number, this._data;
|
|
292
|
+
}
|
|
293
|
+
set data(t) {
|
|
294
|
+
if (this._data = this.normalizeData(t), t.level !== void 0 && this._element.parentNode) {
|
|
295
|
+
const e = this.getTag();
|
|
296
|
+
e.innerHTML = this._element.innerHTML, this._element.parentNode.replaceChild(e, this._element), this._element = e;
|
|
297
|
+
}
|
|
298
|
+
t.text !== void 0 && (this._element.innerHTML = this._data.text || "");
|
|
299
|
+
}
|
|
300
|
+
getTag() {
|
|
301
|
+
const t = this.createHeadingElement();
|
|
302
|
+
return this.setElementContent(t), this.addStylesToElement(t), this.setEditability(t), this.addPlaceholder(t), t;
|
|
303
|
+
}
|
|
304
|
+
createHeadingElement() {
|
|
305
|
+
return document.createElement(this.defaultLevel.tag);
|
|
306
|
+
}
|
|
307
|
+
setElementContent(t) {
|
|
308
|
+
t.innerHTML = this._data.text || "";
|
|
309
|
+
}
|
|
310
|
+
addStylesToElement(t) {
|
|
311
|
+
t.classList.add(this._CSS.wrapper);
|
|
312
|
+
}
|
|
313
|
+
setEditability(t) {
|
|
314
|
+
t.contentEditable = this.readOnly ? "false" : "true";
|
|
315
|
+
}
|
|
316
|
+
addPlaceholder(t) {
|
|
317
|
+
t.dataset.placeholder = this.api.i18n.t(this._settings.placeholder || "");
|
|
318
|
+
}
|
|
319
|
+
get defaultLevel() {
|
|
320
|
+
return { number: 3, tag: "H3", svg: ht };
|
|
321
|
+
}
|
|
322
|
+
onPaste(t) {
|
|
323
|
+
const e = t.detail;
|
|
324
|
+
if ("data" in e) {
|
|
325
|
+
const i = e.data;
|
|
326
|
+
this.data = { level: 3, text: i.innerHTML };
|
|
327
|
+
}
|
|
328
|
+
}
|
|
329
|
+
static get pasteConfig() {
|
|
330
|
+
return { tags: ["H3"] };
|
|
331
|
+
}
|
|
332
|
+
static get toolbox() {
|
|
333
|
+
return { icon: ht, title: "H3" };
|
|
334
|
+
}
|
|
335
|
+
}
|
|
336
|
+
const dt = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M6 7L6 12M6 17L6 12M6 12L12 12M12 7V12M12 17L12 12"/><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M18 10L15.2834 14.8511C15.246 14.9178 15.294 15 15.3704 15C16.8489 15 18.7561 15 20.2 15M19 17C19 15.7187 19 14.8813 19 13.6"/></svg>';
|
|
337
|
+
class Jt {
|
|
338
|
+
constructor({ data: t, config: e, api: i, readOnly: s }) {
|
|
339
|
+
this.api = i, this.readOnly = s, this._settings = { placeholder: "H4" }, this._data = this.normalizeData(t), this._element = this.getTag();
|
|
340
|
+
}
|
|
341
|
+
get _CSS() {
|
|
342
|
+
return { block: this.api.styles.block, wrapper: "ce-header" };
|
|
343
|
+
}
|
|
344
|
+
isHeaderData(t) {
|
|
345
|
+
return t.text !== void 0;
|
|
346
|
+
}
|
|
347
|
+
normalizeData(t) {
|
|
348
|
+
const e = { text: "", level: this.defaultLevel.number };
|
|
349
|
+
return this.isHeaderData(t) && (e.text = t.text || "", t.level === void 0 || isNaN(parseInt(t.level.toString())) || (e.level = parseInt(t.level.toString()))), e;
|
|
350
|
+
}
|
|
351
|
+
render() {
|
|
352
|
+
return this._element;
|
|
353
|
+
}
|
|
354
|
+
setLevel(t) {
|
|
355
|
+
this.data = { level: t, text: this.data.text };
|
|
356
|
+
}
|
|
357
|
+
merge(t) {
|
|
358
|
+
this._element.insertAdjacentHTML("beforeend", t.text);
|
|
359
|
+
}
|
|
360
|
+
validate(t) {
|
|
361
|
+
return t.text.trim() !== "";
|
|
362
|
+
}
|
|
363
|
+
save(t) {
|
|
364
|
+
return { text: t.innerHTML, level: this.defaultLevel.number };
|
|
365
|
+
}
|
|
366
|
+
static get conversionConfig() {
|
|
367
|
+
return { export: "text", import: "text" };
|
|
368
|
+
}
|
|
369
|
+
static get sanitize() {
|
|
370
|
+
return { level: !1, text: {} };
|
|
371
|
+
}
|
|
372
|
+
static get isReadOnlySupported() {
|
|
373
|
+
return !0;
|
|
374
|
+
}
|
|
375
|
+
get data() {
|
|
376
|
+
return this._data.text = this._element.innerHTML, this._data.level = this.defaultLevel.number, this._data;
|
|
377
|
+
}
|
|
378
|
+
set data(t) {
|
|
379
|
+
if (this._data = this.normalizeData(t), t.level !== void 0 && this._element.parentNode) {
|
|
380
|
+
const e = this.getTag();
|
|
381
|
+
e.innerHTML = this._element.innerHTML, this._element.parentNode.replaceChild(e, this._element), this._element = e;
|
|
382
|
+
}
|
|
383
|
+
t.text !== void 0 && (this._element.innerHTML = this._data.text || "");
|
|
384
|
+
}
|
|
385
|
+
getTag() {
|
|
386
|
+
const t = this.createHeadingElement();
|
|
387
|
+
return this.setElementContent(t), this.addStylesToElement(t), this.setEditability(t), this.addPlaceholder(t), t;
|
|
388
|
+
}
|
|
389
|
+
createHeadingElement() {
|
|
390
|
+
return document.createElement(this.defaultLevel.tag);
|
|
391
|
+
}
|
|
392
|
+
setElementContent(t) {
|
|
393
|
+
t.innerHTML = this._data.text || "";
|
|
394
|
+
}
|
|
395
|
+
addStylesToElement(t) {
|
|
396
|
+
t.classList.add(this._CSS.wrapper);
|
|
397
|
+
}
|
|
398
|
+
setEditability(t) {
|
|
399
|
+
t.contentEditable = this.readOnly ? "false" : "true";
|
|
400
|
+
}
|
|
401
|
+
addPlaceholder(t) {
|
|
402
|
+
t.dataset.placeholder = this.api.i18n.t(this._settings.placeholder || "");
|
|
403
|
+
}
|
|
404
|
+
get defaultLevel() {
|
|
405
|
+
return { number: 4, tag: "H4", svg: dt };
|
|
406
|
+
}
|
|
407
|
+
onPaste(t) {
|
|
408
|
+
const e = t.detail;
|
|
409
|
+
if ("data" in e) {
|
|
410
|
+
const i = e.data;
|
|
411
|
+
this.data = { level: 4, text: i.innerHTML };
|
|
412
|
+
}
|
|
413
|
+
}
|
|
414
|
+
static get pasteConfig() {
|
|
415
|
+
return { tags: ["H4"] };
|
|
416
|
+
}
|
|
417
|
+
static get toolbox() {
|
|
418
|
+
return { icon: dt, title: "H4" };
|
|
419
|
+
}
|
|
420
|
+
}
|
|
421
|
+
const ct = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M6 7L6 12M6 17L6 12M6 12L12 12M12 7V12M12 17L12 12"/><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M16 15.9C16 15.9 16.3768 17 17.8 17C19.5 17 20 15.6199 20 14.7C20 12.7323 17.6745 12.0486 16.1635 12.9894C16.094 13.0327 16 12.9846 16 12.9027V10.1C16 10.0448 16.0448 10 16.1 10H19.8"/></svg>';
|
|
422
|
+
class Zt {
|
|
423
|
+
constructor({ data: t, config: e, api: i, readOnly: s }) {
|
|
424
|
+
this.api = i, this.readOnly = s, this._settings = { placeholder: "H5" }, this._data = this.normalizeData(t), this._element = this.getTag();
|
|
425
|
+
}
|
|
426
|
+
get _CSS() {
|
|
427
|
+
return { block: this.api.styles.block, wrapper: "ce-header" };
|
|
428
|
+
}
|
|
429
|
+
isHeaderData(t) {
|
|
430
|
+
return t.text !== void 0;
|
|
431
|
+
}
|
|
432
|
+
normalizeData(t) {
|
|
433
|
+
const e = { text: "", level: this.defaultLevel.number };
|
|
434
|
+
return this.isHeaderData(t) && (e.text = t.text || "", t.level === void 0 || isNaN(parseInt(t.level.toString())) || (e.level = parseInt(t.level.toString()))), e;
|
|
435
|
+
}
|
|
436
|
+
render() {
|
|
437
|
+
return this._element;
|
|
438
|
+
}
|
|
439
|
+
setLevel(t) {
|
|
440
|
+
this.data = { level: t, text: this.data.text };
|
|
441
|
+
}
|
|
442
|
+
merge(t) {
|
|
443
|
+
this._element.insertAdjacentHTML("beforeend", t.text);
|
|
444
|
+
}
|
|
445
|
+
validate(t) {
|
|
446
|
+
return t.text.trim() !== "";
|
|
447
|
+
}
|
|
448
|
+
save(t) {
|
|
449
|
+
return { text: t.innerHTML, level: this.defaultLevel.number };
|
|
450
|
+
}
|
|
451
|
+
static get conversionConfig() {
|
|
452
|
+
return { export: "text", import: "text" };
|
|
453
|
+
}
|
|
454
|
+
static get sanitize() {
|
|
455
|
+
return { level: !1, text: {} };
|
|
456
|
+
}
|
|
457
|
+
static get isReadOnlySupported() {
|
|
458
|
+
return !0;
|
|
459
|
+
}
|
|
460
|
+
get data() {
|
|
461
|
+
return this._data.text = this._element.innerHTML, this._data.level = this.defaultLevel.number, this._data;
|
|
462
|
+
}
|
|
463
|
+
set data(t) {
|
|
464
|
+
if (this._data = this.normalizeData(t), t.level !== void 0 && this._element.parentNode) {
|
|
465
|
+
const e = this.getTag();
|
|
466
|
+
e.innerHTML = this._element.innerHTML, this._element.parentNode.replaceChild(e, this._element), this._element = e;
|
|
467
|
+
}
|
|
468
|
+
t.text !== void 0 && (this._element.innerHTML = this._data.text || "");
|
|
469
|
+
}
|
|
470
|
+
getTag() {
|
|
471
|
+
const t = this.createHeadingElement();
|
|
472
|
+
return this.setElementContent(t), this.addStylesToElement(t), this.setEditability(t), this.addPlaceholder(t), t;
|
|
473
|
+
}
|
|
474
|
+
createHeadingElement() {
|
|
475
|
+
return document.createElement(this.defaultLevel.tag);
|
|
476
|
+
}
|
|
477
|
+
setElementContent(t) {
|
|
478
|
+
t.innerHTML = this._data.text || "";
|
|
479
|
+
}
|
|
480
|
+
addStylesToElement(t) {
|
|
481
|
+
t.classList.add(this._CSS.wrapper);
|
|
482
|
+
}
|
|
483
|
+
setEditability(t) {
|
|
484
|
+
t.contentEditable = this.readOnly ? "false" : "true";
|
|
485
|
+
}
|
|
486
|
+
addPlaceholder(t) {
|
|
487
|
+
t.dataset.placeholder = this.api.i18n.t(this._settings.placeholder || "");
|
|
488
|
+
}
|
|
489
|
+
get defaultLevel() {
|
|
490
|
+
return { number: 5, tag: "H5", svg: ct };
|
|
491
|
+
}
|
|
492
|
+
onPaste(t) {
|
|
493
|
+
const e = t.detail;
|
|
494
|
+
if ("data" in e) {
|
|
495
|
+
const i = e.data;
|
|
496
|
+
this.data = { level: 5, text: i.innerHTML };
|
|
497
|
+
}
|
|
498
|
+
}
|
|
499
|
+
static get pasteConfig() {
|
|
500
|
+
return { tags: ["H5"] };
|
|
501
|
+
}
|
|
502
|
+
static get toolbox() {
|
|
503
|
+
return { icon: ct, title: "H5" };
|
|
504
|
+
}
|
|
505
|
+
}
|
|
506
|
+
const ut = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M6 7L6 12M6 17L6 12M6 12L12 12M12 7V12M12 17L12 12"/><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M19.5 10C16.5 10.5 16 13.3285 16 15M16 15V15C16 16.1046 16.8954 17 18 17H18.3246C19.3251 17 20.3191 16.3492 20.2522 15.3509C20.0612 12.4958 16 12.6611 16 15Z"/></svg>';
|
|
507
|
+
class Qt {
|
|
508
|
+
constructor({ data: t, config: e, api: i, readOnly: s }) {
|
|
509
|
+
this.api = i, this.readOnly = s, this._settings = { placeholder: "H6" }, this._data = this.normalizeData(t), this._element = this.getTag();
|
|
510
|
+
}
|
|
511
|
+
get _CSS() {
|
|
512
|
+
return { block: this.api.styles.block, wrapper: "ce-header" };
|
|
513
|
+
}
|
|
514
|
+
isHeaderData(t) {
|
|
515
|
+
return t.text !== void 0;
|
|
516
|
+
}
|
|
517
|
+
normalizeData(t) {
|
|
518
|
+
const e = { text: "", level: this.defaultLevel.number };
|
|
519
|
+
return this.isHeaderData(t) && (e.text = t.text || "", t.level === void 0 || isNaN(parseInt(t.level.toString())) || (e.level = parseInt(t.level.toString()))), e;
|
|
520
|
+
}
|
|
521
|
+
render() {
|
|
522
|
+
return this._element;
|
|
523
|
+
}
|
|
524
|
+
setLevel(t) {
|
|
525
|
+
this.data = { level: t, text: this.data.text };
|
|
526
|
+
}
|
|
527
|
+
merge(t) {
|
|
528
|
+
this._element.insertAdjacentHTML("beforeend", t.text);
|
|
529
|
+
}
|
|
530
|
+
validate(t) {
|
|
531
|
+
return t.text.trim() !== "";
|
|
532
|
+
}
|
|
533
|
+
save(t) {
|
|
534
|
+
return { text: t.innerHTML, level: this.defaultLevel.number };
|
|
535
|
+
}
|
|
536
|
+
static get conversionConfig() {
|
|
537
|
+
return { export: "text", import: "text" };
|
|
538
|
+
}
|
|
539
|
+
static get sanitize() {
|
|
540
|
+
return { level: !1, text: {} };
|
|
541
|
+
}
|
|
542
|
+
static get isReadOnlySupported() {
|
|
543
|
+
return !0;
|
|
544
|
+
}
|
|
545
|
+
get data() {
|
|
546
|
+
return this._data.text = this._element.innerHTML, this._data.level = this.defaultLevel.number, this._data;
|
|
547
|
+
}
|
|
548
|
+
set data(t) {
|
|
549
|
+
if (this._data = this.normalizeData(t), t.level !== void 0 && this._element.parentNode) {
|
|
550
|
+
const e = this.getTag();
|
|
551
|
+
e.innerHTML = this._element.innerHTML, this._element.parentNode.replaceChild(e, this._element), this._element = e;
|
|
552
|
+
}
|
|
553
|
+
t.text !== void 0 && (this._element.innerHTML = this._data.text || "");
|
|
554
|
+
}
|
|
555
|
+
getTag() {
|
|
556
|
+
const t = this.createHeadingElement();
|
|
557
|
+
return this.setElementContent(t), this.addStylesToElement(t), this.setEditability(t), this.addPlaceholder(t), t;
|
|
558
|
+
}
|
|
559
|
+
createHeadingElement() {
|
|
560
|
+
return document.createElement(this.defaultLevel.tag);
|
|
561
|
+
}
|
|
562
|
+
setElementContent(t) {
|
|
563
|
+
t.innerHTML = this._data.text || "";
|
|
564
|
+
}
|
|
565
|
+
addStylesToElement(t) {
|
|
566
|
+
t.classList.add(this._CSS.wrapper);
|
|
567
|
+
}
|
|
568
|
+
setEditability(t) {
|
|
569
|
+
t.contentEditable = this.readOnly ? "false" : "true";
|
|
570
|
+
}
|
|
571
|
+
addPlaceholder(t) {
|
|
572
|
+
t.dataset.placeholder = this.api.i18n.t(this._settings.placeholder || "");
|
|
573
|
+
}
|
|
574
|
+
get defaultLevel() {
|
|
575
|
+
return { number: 6, tag: "H6", svg: ut };
|
|
576
|
+
}
|
|
577
|
+
onPaste(t) {
|
|
578
|
+
const e = t.detail;
|
|
579
|
+
if ("data" in e) {
|
|
580
|
+
const i = e.data;
|
|
581
|
+
this.data = { level: 6, text: i.innerHTML };
|
|
582
|
+
}
|
|
583
|
+
}
|
|
584
|
+
static get pasteConfig() {
|
|
585
|
+
return { tags: ["H6"] };
|
|
586
|
+
}
|
|
587
|
+
static get toolbox() {
|
|
588
|
+
return { icon: ut, title: "H6" };
|
|
589
|
+
}
|
|
590
|
+
}
|
|
591
|
+
class st {
|
|
592
|
+
static get DEFAULT_ALIGNMENT() {
|
|
593
|
+
return "left";
|
|
594
|
+
}
|
|
595
|
+
static get isTune() {
|
|
596
|
+
return !0;
|
|
597
|
+
}
|
|
598
|
+
getAlignment() {
|
|
599
|
+
var t, e;
|
|
600
|
+
return (t = this.settings) != null && t.blocks && this.settings.blocks.hasOwnProperty(this.block.name) ? this.settings.blocks[this.block.name] : (e = this.settings) != null && e.default ? this.settings.default : st.DEFAULT_ALIGNMENT;
|
|
601
|
+
}
|
|
602
|
+
constructor({ api: t, data: e, config: i, block: s }) {
|
|
603
|
+
this.api = t, this.block = s, this.settings = i, this.data = e || { alignment: this.getAlignment() }, this.alignmentSettings = [{ name: "left", icon: '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M17 7L5 7"/><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M17 17H5"/><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M13 12L5 12"/></svg>' }, { name: "center", icon: '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M18 7L6 7"/><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M18 17H6"/><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M16 12L8 12"/></svg>' }, { name: "right", icon: '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M19 7L7 7"/><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M19 17H7"/><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M19 12L11 12"/></svg>' }], this._CSS = { alignment: { left: "ce-tune-alignment--left", center: "ce-tune-alignment--center", right: "ce-tune-alignment--right" } };
|
|
604
|
+
}
|
|
605
|
+
wrap(t) {
|
|
606
|
+
return this.wrapper = document.createElement("div"), this.wrapper.classList.toggle(this._CSS.alignment[this.data.alignment]), this.wrapper.append(t), this.wrapper;
|
|
607
|
+
}
|
|
608
|
+
render() {
|
|
609
|
+
const t = document.createElement("div");
|
|
610
|
+
return this.alignmentSettings.map((e) => {
|
|
611
|
+
const i = document.createElement("button");
|
|
612
|
+
i.classList.add(this.api.styles.settingsButton), i.innerHTML = e.icon, i.type = "button", i.classList.toggle(this.api.styles.settingsButtonActive, e.name === this.data.alignment);
|
|
613
|
+
const s = this.api.i18n.t(e.name + " align");
|
|
614
|
+
return this.api.tooltip.onHover(i, s, { placement: "top" }), t.appendChild(i), i;
|
|
615
|
+
}).forEach((e, i, s) => {
|
|
616
|
+
e.addEventListener("click", () => {
|
|
617
|
+
this.data = { alignment: this.alignmentSettings[i].name }, s.forEach((n, r) => {
|
|
618
|
+
const { name: o } = this.alignmentSettings[r];
|
|
619
|
+
n.classList.toggle(this.api.styles.settingsButtonActive, o === this.data.alignment), this.wrapper.classList.toggle(this._CSS.alignment[o], o === this.data.alignment);
|
|
620
|
+
});
|
|
621
|
+
});
|
|
622
|
+
}), t;
|
|
623
|
+
}
|
|
624
|
+
save() {
|
|
625
|
+
return this.data;
|
|
626
|
+
}
|
|
627
|
+
}
|
|
628
|
+
class nt {
|
|
629
|
+
static get DEFAULT_PLACEHOLDER() {
|
|
630
|
+
return "";
|
|
631
|
+
}
|
|
632
|
+
constructor({ data: t, config: e, api: i, readOnly: s }) {
|
|
633
|
+
var n;
|
|
634
|
+
this.api = i, this.readOnly = s, this._CSS = { block: this.api.styles.block, wrapper: "ce-paragraph" }, this.readOnly || (this.onKeyUp = this.onKeyUp.bind(this)), this._placeholder = e.placeholder ? e.placeholder : nt.DEFAULT_PLACEHOLDER, this._data = t != null ? t : {}, this._element = null, this._preserveBlank = (n = e.preserveBlank) != null ? n : !1;
|
|
635
|
+
}
|
|
636
|
+
onKeyUp(t) {
|
|
637
|
+
if (t.code !== "Backspace" && t.code !== "Delete" || !this._element) return;
|
|
638
|
+
const { textContent: e } = this._element;
|
|
639
|
+
e === "" && (this._element.innerHTML = "");
|
|
640
|
+
}
|
|
641
|
+
drawView() {
|
|
642
|
+
const t = document.createElement("DIV");
|
|
643
|
+
return t.classList.add(this._CSS.wrapper, this._CSS.block), t.contentEditable = "false", t.dataset.placeholderActive = this.api.i18n.t(this._placeholder), this._data.text && (t.innerHTML = this._data.text), this.readOnly || (t.contentEditable = "true", t.addEventListener("keyup", this.onKeyUp)), t;
|
|
644
|
+
}
|
|
645
|
+
render() {
|
|
646
|
+
return this._element = this.drawView(), this._element;
|
|
647
|
+
}
|
|
648
|
+
merge(t) {
|
|
649
|
+
if (!this._element) return;
|
|
650
|
+
this._data.text += t.text;
|
|
651
|
+
const e = function(i) {
|
|
652
|
+
const s = document.createElement("div");
|
|
653
|
+
s.innerHTML = i.trim();
|
|
654
|
+
const n = document.createDocumentFragment();
|
|
655
|
+
return n.append(...Array.from(s.childNodes)), n;
|
|
656
|
+
}(t.text);
|
|
657
|
+
this._element.appendChild(e), this._element.normalize();
|
|
658
|
+
}
|
|
659
|
+
validate(t) {
|
|
660
|
+
return !(t.text.trim() === "" && !this._preserveBlank);
|
|
661
|
+
}
|
|
662
|
+
save(t) {
|
|
663
|
+
return { text: t.innerHTML };
|
|
664
|
+
}
|
|
665
|
+
onPaste(t) {
|
|
666
|
+
const e = { text: t.detail.data.innerHTML };
|
|
667
|
+
this._data = e, window.requestAnimationFrame(() => {
|
|
668
|
+
this._element && (this._element.innerHTML = this._data.text || "");
|
|
669
|
+
});
|
|
670
|
+
}
|
|
671
|
+
static get conversionConfig() {
|
|
672
|
+
return { export: "text", import: "text" };
|
|
673
|
+
}
|
|
674
|
+
static get sanitize() {
|
|
675
|
+
return { text: { br: !0 } };
|
|
676
|
+
}
|
|
677
|
+
static get isReadOnlySupported() {
|
|
678
|
+
return !0;
|
|
679
|
+
}
|
|
680
|
+
static get pasteConfig() {
|
|
681
|
+
return { tags: ["P"] };
|
|
682
|
+
}
|
|
683
|
+
static get toolbox() {
|
|
684
|
+
return { icon: '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M8 9V7.2C8 7.08954 8.08954 7 8.2 7L12 7M16 9V7.2C16 7.08954 15.9105 7 15.8 7L12 7M12 7L12 17M12 17H10M12 17H14"/></svg>', title: "Text" };
|
|
685
|
+
}
|
|
686
|
+
}
|
|
687
|
+
class W {
|
|
688
|
+
constructor({ data: t, config: e, api: i, readOnly: s }) {
|
|
689
|
+
var n;
|
|
690
|
+
this._selectorLanguage = "", this._selectorTheme = "", this.api = i, this.readOnly = s, this.placeholder = this.api.i18n.t(e.placeholder || W.DEFAULT_PLACEHOLDER), this._selectorLanguage = t.lang || e.lang || W.DEFAULT_LANGUAGE, this._selectorTheme = t.theme || e.theme || W.DEFAULT_THEME, this.CSS = { baseClass: this.api.styles.block, input: this.api.styles.input, wrapper: "ce-editorjs-x-shiki", textarea: "ce-editorjs-x-shiki__textarea", span: "ce-editorjs-x-shiki__span", selectorLanguage: "ce-editorjs-x-shiki__selector-language", selectorTheme: "ce-editorjs-x-shiki__selector-theme" }, this.nodes = { holder: null, textarea: null }, this.data = { code: (n = t.code) != null ? n : "", lang: this._selectorLanguage, theme: this._selectorTheme }, this.nodes.holder = this.drawView();
|
|
691
|
+
}
|
|
692
|
+
static get isReadOnlySupported() {
|
|
693
|
+
return !0;
|
|
694
|
+
}
|
|
695
|
+
static get enableLineBreaks() {
|
|
696
|
+
return !0;
|
|
697
|
+
}
|
|
698
|
+
render() {
|
|
699
|
+
return this.nodes.holder;
|
|
700
|
+
}
|
|
701
|
+
save(t) {
|
|
702
|
+
return { code: t.querySelector("textarea").value, lang: this._selectorLanguage, theme: this._selectorTheme };
|
|
703
|
+
}
|
|
704
|
+
onPaste(t) {
|
|
705
|
+
const e = t.detail;
|
|
706
|
+
if ("data" in e) {
|
|
707
|
+
const i = e.data;
|
|
708
|
+
this.data = { code: i || "", lang: this._selectorLanguage, theme: this._selectorTheme };
|
|
709
|
+
}
|
|
710
|
+
}
|
|
711
|
+
get data() {
|
|
712
|
+
return this._data;
|
|
713
|
+
}
|
|
714
|
+
set data(t) {
|
|
715
|
+
this._data = t, this.nodes.textarea && (this.nodes.textarea.value = t.code);
|
|
716
|
+
}
|
|
717
|
+
static get toolbox() {
|
|
718
|
+
return { icon: '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 17C7 17 7 15.2536 7 13.5L5.5 12L7 10.5C7 8.74644 7 7 9 7"/><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 17C17 17 17 15.2536 17 13.5L18.5 12L17 10.5C17 8.74644 17 7 15 7"/></svg>', title: "Code" };
|
|
719
|
+
}
|
|
720
|
+
static get DEFAULT_PLACEHOLDER() {
|
|
721
|
+
return "Enter your code";
|
|
722
|
+
}
|
|
723
|
+
static get DEFAULT_LANGUAGE() {
|
|
724
|
+
return "javascript";
|
|
725
|
+
}
|
|
726
|
+
static get DEFAULT_THEME() {
|
|
727
|
+
return "vitesse-dark";
|
|
728
|
+
}
|
|
729
|
+
static get pasteConfig() {
|
|
730
|
+
return { tags: ["pre"] };
|
|
731
|
+
}
|
|
732
|
+
static get sanitize() {
|
|
733
|
+
return { code: !0 };
|
|
734
|
+
}
|
|
735
|
+
tabHandler(t) {
|
|
736
|
+
t.stopPropagation(), t.preventDefault();
|
|
737
|
+
const e = t.target, i = t.shiftKey, s = e.selectionStart, n = e.value, r = " ";
|
|
738
|
+
let o;
|
|
739
|
+
if (i) {
|
|
740
|
+
const a = function(h, l) {
|
|
741
|
+
let c = "";
|
|
742
|
+
for (; c !== `
|
|
743
|
+
` && l > 0; ) l -= 1, c = h.substr(l, 1);
|
|
744
|
+
return c === `
|
|
745
|
+
` && (l += 1), l;
|
|
746
|
+
}(n, s);
|
|
747
|
+
if (n.substr(a, 2) !== r) return;
|
|
748
|
+
e.value = n.substring(0, a) + n.substring(a + 2), o = s - 2;
|
|
749
|
+
} else o = s + 2, e.value = n.substring(0, s) + r + n.substring(s);
|
|
750
|
+
e.setSelectionRange(o, o);
|
|
751
|
+
}
|
|
752
|
+
drawView() {
|
|
753
|
+
const t = document.createElement("div"), e = document.createElement("div"), i = document.createElement("div"), s = document.createElement("div"), n = document.createElement("div"), r = document.createElement("div"), o = document.createElement("select"), a = document.createElement("select"), h = document.createElement("span"), l = document.createElement("textarea");
|
|
754
|
+
return t.classList.add(this.CSS.baseClass, this.CSS.wrapper), e.classList.add("ce-editorjs-x-shiki__code"), i.classList.add("ce-editorjs-x-shiki__selector"), s.classList.add("ce-editorjs-x-shiki__lang"), n.classList.add("ce-editorjs-x-shiki__copy"), r.classList.add("ce-editorjs-x-shiki__copy_tip"), o.classList.add(this.CSS.selectorLanguage), l.classList.add(this.CSS.textarea, this.CSS.input), s.innerHTML = this.data.lang, n.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17.25 8.5H10.25C9.2835 8.5 8.5 9.2835 8.5 10.25V17.25C8.5 18.2165 9.2835 19 10.25 19H17.25C18.2165 19 19 18.2165 19 17.25V10.25C19 9.2835 18.2165 8.5 17.25 8.5Z"/><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.5 8.5V6.75C15.5 6.28587 15.3156 5.84075 14.9874 5.51256C14.6592 5.18437 14.2141 5 13.75 5H6.75C6.28587 5 5.84075 5.18437 5.51256 5.51256C5.18437 5.84075 5 6.28587 5 6.75V13.75C5 14.2141 5.18437 14.6592 5.51256 14.9874C5.84075 15.3156 6.28587 15.5 6.75 15.5H8.5"/><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 12L15.5 12"/><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15.5L15.5 15.5"/></svg>', r.innerText = this.api.i18n.t("Copied"), Wt.forEach((c) => {
|
|
755
|
+
const u = document.createElement("option");
|
|
756
|
+
u.value = c.id, u.text = c.name, o.appendChild(u);
|
|
757
|
+
}), o.value = this.data.lang, l.value = this.data.code, l.placeholder = this.placeholder, l.spellcheck = !1, l.autocomplete = "off", l.autocapitalize = "off", this.readOnly && (l.disabled = !0), e.appendChild(h), e.appendChild(l), this.readOnly ? i.appendChild(s) : i.appendChild(o), n.appendChild(r), i.appendChild(n), t.appendChild(i), t.appendChild(e), this.runShiki().then(({ html: c, preStyle: u }) => {
|
|
758
|
+
h.innerHTML = c, t == null || t.setAttribute("style", u), o.setAttribute("style", u), a.setAttribute("style", u);
|
|
759
|
+
}), o.addEventListener("change", (c) => {
|
|
760
|
+
const u = c.target.value;
|
|
761
|
+
this._selectorLanguage = u, this.runShiki().then(({ html: p, preStyle: g }) => {
|
|
762
|
+
h.innerHTML = p, s.innerHTML = u;
|
|
763
|
+
});
|
|
764
|
+
}), a.addEventListener("change", (c) => {
|
|
765
|
+
const u = c.target.value;
|
|
766
|
+
this._selectorTheme = u, this.runShiki().then(({ html: p, preStyle: g }) => {
|
|
767
|
+
h.innerHTML = p, t == null || t.setAttribute("style", g), o.setAttribute("style", g), a.setAttribute("style", g);
|
|
768
|
+
});
|
|
769
|
+
}), l.addEventListener("input", () => {
|
|
770
|
+
this.data.code = l.value, this.runShiki().then(({ html: c, preStyle: u }) => {
|
|
771
|
+
h.innerHTML = c, t == null || t.setAttribute("style", u), o.setAttribute("style", u), a.setAttribute("style", u);
|
|
772
|
+
});
|
|
773
|
+
}), l.addEventListener("keydown", (c) => {
|
|
774
|
+
c.code === "Tab" && (this.tabHandler(c), this.data.code = l.value, this.runShiki().then(({ html: u, preStyle: p }) => {
|
|
775
|
+
h.innerHTML = u;
|
|
776
|
+
}));
|
|
777
|
+
}), n.addEventListener("click", (c) => {
|
|
778
|
+
this.copyCode(this.data.code, c);
|
|
779
|
+
}), this.nodes.textarea = l, t;
|
|
780
|
+
}
|
|
781
|
+
async runShiki() {
|
|
782
|
+
let t = "";
|
|
783
|
+
return { html: await zt(this.data.code, { lang: this._selectorLanguage, theme: this._selectorTheme, transformers: [{ preprocess: (e) => `${e}
|
|
784
|
+
`, pre(e) {
|
|
785
|
+
var i;
|
|
786
|
+
this.addClassToHast(e, "ce-editorjs-x-shiki__span"), t = ((i = e.properties) == null ? void 0 : i.style) || "";
|
|
787
|
+
} }] }), preStyle: t };
|
|
788
|
+
}
|
|
789
|
+
copyCode(t, e) {
|
|
790
|
+
this.data.code && navigator.clipboard.writeText(t).then(() => {
|
|
791
|
+
if (e.target) {
|
|
792
|
+
const i = e.target.parentElement;
|
|
793
|
+
if (i) {
|
|
794
|
+
const s = i.lastChild;
|
|
795
|
+
s && (s.classList.add("visible"), setTimeout(() => {
|
|
796
|
+
s.classList.remove("visible");
|
|
797
|
+
}, 2e3));
|
|
798
|
+
}
|
|
799
|
+
}
|
|
800
|
+
}).catch((i) => {
|
|
801
|
+
alert("Unable to copy");
|
|
802
|
+
});
|
|
803
|
+
}
|
|
804
|
+
}
|
|
805
|
+
class te {
|
|
806
|
+
constructor({ data: t, api: e, readOnly: i }) {
|
|
807
|
+
this.api = e, this.readOnly = i, this._data = { text: t.text || "" }, this._CSS = { baseClass: this.api.styles.block, wrapper: "cdx-quote", text: "cdx-quote__text", input: this.api.styles.input };
|
|
808
|
+
}
|
|
809
|
+
static get isReadOnlySupported() {
|
|
810
|
+
return !0;
|
|
811
|
+
}
|
|
812
|
+
static get toolbox() {
|
|
813
|
+
return { icon: `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
814
|
+
<path d="M10 10.8182L9 10.8182C8.80222 10.8182 8.60888 10.7649 8.44443 10.665C8.27998 10.5651 8.15181 10.4231 8.07612 10.257C8.00043 10.0909 7.98063 9.90808 8.01922 9.73174C8.0578 9.55539 8.15304 9.39341 8.29289 9.26627C8.43275 9.13913 8.61093 9.05255 8.80491 9.01747C8.99889 8.98239 9.19996 9.00039 9.38268 9.0692C9.56541 9.13801 9.72159 9.25453 9.83147 9.40403C9.94135 9.55353 10 9.72929 10 9.90909L10 12.1818C10 12.664 9.78929 13.1265 9.41421 13.4675C9.03914 13.8084 8.53043 14 8 14" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
815
|
+
<path d="M16 10.8182L15 10.8182C14.8022 10.8182 14.6089 10.7649 14.4444 10.665C14.28 10.5651 14.1518 10.4231 14.0761 10.257C14.0004 10.0909 13.9806 9.90808 14.0192 9.73174C14.0578 9.55539 14.153 9.39341 14.2929 9.26627C14.4327 9.13913 14.6109 9.05255 14.8049 9.01747C14.9989 8.98239 15.2 9.00039 15.3827 9.0692C15.5654 9.13801 15.7216 9.25453 15.8315 9.40403C15.9414 9.55353 16 9.72929 16 9.90909L16 12.1818C16 12.664 15.7893 13.1265 15.4142 13.4675C15.0391 13.8084 14.5304 14 14 14" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
816
|
+
</svg>`, title: "Quote" };
|
|
817
|
+
}
|
|
818
|
+
static get contentless() {
|
|
819
|
+
return !0;
|
|
820
|
+
}
|
|
821
|
+
static get enableLineBreaks() {
|
|
822
|
+
return !0;
|
|
823
|
+
}
|
|
824
|
+
static get conversionConfig() {
|
|
825
|
+
return { import: "text", export: function(t) {
|
|
826
|
+
return t.text;
|
|
827
|
+
} };
|
|
828
|
+
}
|
|
829
|
+
get CSS() {
|
|
830
|
+
return { baseClass: this.api.styles.block, wrapper: "cdx-quote", text: "cdx-quote__text", input: this.api.styles.input };
|
|
831
|
+
}
|
|
832
|
+
render() {
|
|
833
|
+
const t = w("div", [this._CSS.baseClass, this._CSS.wrapper]);
|
|
834
|
+
return this._quoteElement = w("blockquote", [this._CSS.input, this._CSS.text, "cdx-block-quote"], { contentEditable: !this.readOnly, innerHTML: this._data.text }), this._quoteElement.addEventListener("keydown", (e) => this.handleKeydown(e)), t.appendChild(this._quoteElement), t;
|
|
835
|
+
}
|
|
836
|
+
get currentItem() {
|
|
837
|
+
let t = window.getSelection().anchorNode;
|
|
838
|
+
return t.nodeType !== Node.ELEMENT_NODE && (t = t.parentNode), t.closest(`.${this.CSS.text}`);
|
|
839
|
+
}
|
|
840
|
+
handleKeydown(t) {
|
|
841
|
+
var i;
|
|
842
|
+
const e = this._quoteElement;
|
|
843
|
+
if (t.key === "Enter" && (t.shiftKey || (t.preventDefault(), this.getOutOfQuote())), t.key === "Backspace" && ((i = e.textContent) == null ? void 0 : i.trim().length) === 0) {
|
|
844
|
+
t.preventDefault();
|
|
845
|
+
const s = this.api.blocks.getCurrentBlockIndex();
|
|
846
|
+
return this.api.blocks.delete(s), this.api.blocks.insert("paragraph", { text: "" }), void this.api.caret.setToBlock(s);
|
|
847
|
+
}
|
|
848
|
+
}
|
|
849
|
+
getOutOfQuote() {
|
|
850
|
+
this.api.blocks.insert(), this.api.caret.setToBlock(this.api.blocks.getCurrentBlockIndex());
|
|
851
|
+
}
|
|
852
|
+
save(t) {
|
|
853
|
+
var i;
|
|
854
|
+
const e = t.querySelector(`.${this._CSS.text}`);
|
|
855
|
+
return Object.assign(this._data, { text: (i = e == null ? void 0 : e.innerHTML) != null ? i : "" });
|
|
856
|
+
}
|
|
857
|
+
static get sanitize() {
|
|
858
|
+
return { text: { br: !0 } };
|
|
859
|
+
}
|
|
860
|
+
}
|
|
861
|
+
class ee {
|
|
862
|
+
static get isReadOnlySupported() {
|
|
863
|
+
return !0;
|
|
864
|
+
}
|
|
865
|
+
static get contentless() {
|
|
866
|
+
return !0;
|
|
867
|
+
}
|
|
868
|
+
constructor({ data: t, config: e, api: i }) {
|
|
869
|
+
this.api = i, this._CSS = { block: this.api.styles.block, wrapper: "ce-delimiter" }, this._element = this.drawView();
|
|
870
|
+
}
|
|
871
|
+
drawView() {
|
|
872
|
+
let t = document.createElement("div"), e = document.createElement("div"), i = document.createElement("div");
|
|
873
|
+
return t.classList.add(this._CSS.wrapper, this._CSS.block), e.classList.add("ce-delimiter__line__wrapper"), i.classList.add("ce-delimiter__line"), e.appendChild(i), t.appendChild(e), t;
|
|
874
|
+
}
|
|
875
|
+
render() {
|
|
876
|
+
return this._element;
|
|
877
|
+
}
|
|
878
|
+
save(t) {
|
|
879
|
+
return {};
|
|
880
|
+
}
|
|
881
|
+
static get toolbox() {
|
|
882
|
+
return { icon: `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
883
|
+
<line x1="6" y1="12" x2="10" y2="12" stroke="black" stroke-width="2" stroke-linecap="round"/>
|
|
884
|
+
<line x1="14" y1="12" x2="18" y2="12" stroke="black" stroke-width="2" stroke-linecap="round"/>
|
|
885
|
+
</svg>
|
|
886
|
+
`, title: "Delimiter" };
|
|
887
|
+
}
|
|
888
|
+
static get pasteConfig() {
|
|
889
|
+
return { tags: ["HR"] };
|
|
890
|
+
}
|
|
891
|
+
onPaste(t) {
|
|
892
|
+
this.data = {};
|
|
893
|
+
}
|
|
894
|
+
}
|
|
895
|
+
const k = "cdx-list", v = { wrapper: k, item: `${k}__item`, itemContent: `${k}__item-content`, itemChildren: `${k}__item-children` };
|
|
896
|
+
class S {
|
|
897
|
+
static get CSS() {
|
|
898
|
+
return { ...v, orderedList: `${k}-ordered` };
|
|
899
|
+
}
|
|
900
|
+
constructor(t, e) {
|
|
901
|
+
this.config = e, this.readOnly = t;
|
|
902
|
+
}
|
|
903
|
+
renderWrapper(t) {
|
|
904
|
+
let e;
|
|
905
|
+
return e = w("ol", t === !0 ? [S.CSS.wrapper, S.CSS.orderedList] : [S.CSS.orderedList, S.CSS.itemChildren]), e;
|
|
906
|
+
}
|
|
907
|
+
renderItem(t, e) {
|
|
908
|
+
const i = w("li", S.CSS.item), s = w("div", S.CSS.itemContent, { innerHTML: t, contentEditable: (!this.readOnly).toString() });
|
|
909
|
+
return i.appendChild(s), i;
|
|
910
|
+
}
|
|
911
|
+
getItemContent(t) {
|
|
912
|
+
const e = t.querySelector(`.${S.CSS.itemContent}`);
|
|
913
|
+
return e ? it(e) ? "" : e.innerHTML : "";
|
|
914
|
+
}
|
|
915
|
+
getItemMeta() {
|
|
916
|
+
return {};
|
|
917
|
+
}
|
|
918
|
+
composeDefaultMeta() {
|
|
919
|
+
return {};
|
|
920
|
+
}
|
|
921
|
+
}
|
|
922
|
+
class x {
|
|
923
|
+
static get CSS() {
|
|
924
|
+
return { ...v, unorderedList: `${k}-unordered` };
|
|
925
|
+
}
|
|
926
|
+
constructor(t, e) {
|
|
927
|
+
this.config = e, this.readOnly = t;
|
|
928
|
+
}
|
|
929
|
+
renderWrapper(t) {
|
|
930
|
+
let e;
|
|
931
|
+
return e = w("ul", t === !0 ? [x.CSS.wrapper, x.CSS.unorderedList] : [x.CSS.unorderedList, x.CSS.itemChildren]), e;
|
|
932
|
+
}
|
|
933
|
+
renderItem(t, e) {
|
|
934
|
+
const i = w("li", x.CSS.item), s = w("div", x.CSS.itemContent, { innerHTML: t, contentEditable: (!this.readOnly).toString() });
|
|
935
|
+
return i.appendChild(s), i;
|
|
936
|
+
}
|
|
937
|
+
getItemContent(t) {
|
|
938
|
+
const e = t.querySelector(`.${x.CSS.itemContent}`);
|
|
939
|
+
return e ? it(e) ? "" : e.innerHTML : "";
|
|
940
|
+
}
|
|
941
|
+
getItemMeta() {
|
|
942
|
+
return {};
|
|
943
|
+
}
|
|
944
|
+
composeDefaultMeta() {
|
|
945
|
+
return {};
|
|
946
|
+
}
|
|
947
|
+
}
|
|
948
|
+
function A(d) {
|
|
949
|
+
return d.nodeType === Node.ELEMENT_NODE;
|
|
950
|
+
}
|
|
951
|
+
class m {
|
|
952
|
+
static get CSS() {
|
|
953
|
+
return { ...v, checklist: `${k}-checklist`, itemChecked: `${k}__checkbox--checked`, noHover: `${k}__checkbox--no-hover`, checkbox: `${k}__checkbox-check`, checkboxContainer: `${k}__checkbox`, checkboxCheckDisabled: `${k}__checkbox-check--disabled` };
|
|
954
|
+
}
|
|
955
|
+
constructor(t, e) {
|
|
956
|
+
this.config = e, this.readOnly = t;
|
|
957
|
+
}
|
|
958
|
+
renderWrapper(t) {
|
|
959
|
+
let e;
|
|
960
|
+
return t === !0 ? (e = w("ul", [m.CSS.wrapper, m.CSS.checklist]), e.addEventListener("click", (i) => {
|
|
961
|
+
const s = i.target;
|
|
962
|
+
if (s) {
|
|
963
|
+
const n = s.closest(`.${m.CSS.checkboxContainer}`);
|
|
964
|
+
n && n.contains(s) && this.toggleCheckbox(n);
|
|
965
|
+
}
|
|
966
|
+
})) : e = w("ul", [m.CSS.checklist, m.CSS.itemChildren]), e;
|
|
967
|
+
}
|
|
968
|
+
renderItem(t, e) {
|
|
969
|
+
const i = w("li", [m.CSS.item, m.CSS.item]), s = w("div", m.CSS.itemContent, { innerHTML: t, contentEditable: (!this.readOnly).toString() }), n = w("span", m.CSS.checkbox), r = w("div", m.CSS.checkboxContainer);
|
|
970
|
+
return e.checked === !0 && r.classList.add(m.CSS.itemChecked), this.readOnly && r.classList.add(m.CSS.checkboxCheckDisabled), n.innerHTML = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
971
|
+
<path d="M7 12L10.4884 15.8372C10.5677 15.9245 10.705 15.9245 10.7844 15.8372L17 9" stroke="black" stroke-width="2" stroke-linecap="round"/>
|
|
972
|
+
</svg>
|
|
973
|
+
`, r.appendChild(n), i.appendChild(r), i.appendChild(s), i;
|
|
974
|
+
}
|
|
975
|
+
getItemContent(t) {
|
|
976
|
+
const e = t.querySelector(`.${m.CSS.itemContent}`);
|
|
977
|
+
return e ? it(e) ? "" : e.innerHTML : "";
|
|
978
|
+
}
|
|
979
|
+
getItemMeta(t) {
|
|
980
|
+
const e = t.querySelector(`.${m.CSS.checkboxContainer}`);
|
|
981
|
+
return { checked: !!e && e.classList.contains(m.CSS.itemChecked) };
|
|
982
|
+
}
|
|
983
|
+
composeDefaultMeta() {
|
|
984
|
+
return { checked: !1 };
|
|
985
|
+
}
|
|
986
|
+
toggleCheckbox(t) {
|
|
987
|
+
t.classList.toggle(m.CSS.itemChecked), t.classList.add(m.CSS.noHover), t.addEventListener("mouseleave", () => this.removeSpecialHoverBehavior(t), { once: !0 });
|
|
988
|
+
}
|
|
989
|
+
removeSpecialHoverBehavior(t) {
|
|
990
|
+
t.classList.remove(m.CSS.noHover);
|
|
991
|
+
}
|
|
992
|
+
}
|
|
993
|
+
function j(d, t = "after") {
|
|
994
|
+
const e = [];
|
|
995
|
+
let i;
|
|
996
|
+
function s(n) {
|
|
997
|
+
switch (t) {
|
|
998
|
+
case "after":
|
|
999
|
+
return n.nextElementSibling;
|
|
1000
|
+
case "before":
|
|
1001
|
+
return n.previousElementSibling;
|
|
1002
|
+
}
|
|
1003
|
+
}
|
|
1004
|
+
for (i = s(d); i !== null; ) e.push(i), i = s(i);
|
|
1005
|
+
return e.length !== 0 ? e : null;
|
|
1006
|
+
}
|
|
1007
|
+
function E(d, t = !0) {
|
|
1008
|
+
let e = d;
|
|
1009
|
+
return d.classList.contains(v.item) && (e = d.querySelector(`.${v.itemChildren}`)), e === null ? [] : t ? Array.from(e.querySelectorAll(`:scope > .${v.item}`)) : Array.from(e.querySelectorAll(`.${v.item}`));
|
|
1010
|
+
}
|
|
1011
|
+
function H(d) {
|
|
1012
|
+
return d.querySelector(`.${v.itemChildren}`);
|
|
1013
|
+
}
|
|
1014
|
+
function Y(d) {
|
|
1015
|
+
let t = d;
|
|
1016
|
+
d.classList.contains(v.item) && (t = H(d)), t !== null && E(t).length === 0 && t.remove();
|
|
1017
|
+
}
|
|
1018
|
+
function q(d) {
|
|
1019
|
+
return d.querySelector(`.${v.itemContent}`);
|
|
1020
|
+
}
|
|
1021
|
+
function R(d, t = !0) {
|
|
1022
|
+
const e = q(d);
|
|
1023
|
+
e && qt(e, t);
|
|
1024
|
+
}
|
|
1025
|
+
class G {
|
|
1026
|
+
get currentItem() {
|
|
1027
|
+
const t = window.getSelection();
|
|
1028
|
+
if (!t) return null;
|
|
1029
|
+
let e = t.anchorNode;
|
|
1030
|
+
return e ? (A(e) || (e = e.parentNode), e && A(e) ? e.closest(`.${v.item}`) : null) : null;
|
|
1031
|
+
}
|
|
1032
|
+
get currentItemLevel() {
|
|
1033
|
+
const t = this.currentItem;
|
|
1034
|
+
if (t === null) return null;
|
|
1035
|
+
let e = t.parentNode, i = 0;
|
|
1036
|
+
for (; e !== null && e !== this.listWrapper; ) A(e) && e.classList.contains(v.item) && (i += 1), e = e.parentNode;
|
|
1037
|
+
return i + 1;
|
|
1038
|
+
}
|
|
1039
|
+
constructor({ data: t, config: e, api: i, readOnly: s, block: n }, r) {
|
|
1040
|
+
this.config = e, this.data = t, this.readOnly = s, this.api = i, this.block = n, this.renderer = r;
|
|
1041
|
+
}
|
|
1042
|
+
render() {
|
|
1043
|
+
return this.listWrapper = this.renderer.renderWrapper(!0), this.data.items.length ? this.appendItems(this.data.items, this.listWrapper) : this.appendItems([{ content: "", meta: {}, items: [] }], this.listWrapper), this.readOnly || this.listWrapper.addEventListener("keydown", (t) => {
|
|
1044
|
+
switch (t.key) {
|
|
1045
|
+
case "Enter":
|
|
1046
|
+
t.shiftKey || this.enterPressed(t);
|
|
1047
|
+
break;
|
|
1048
|
+
case "Backspace":
|
|
1049
|
+
this.backspace(t);
|
|
1050
|
+
break;
|
|
1051
|
+
case "Tab":
|
|
1052
|
+
t.shiftKey ? this.shiftTab(t) : this.addTab(t);
|
|
1053
|
+
}
|
|
1054
|
+
}, !1), "start" in this.data.meta && this.data.meta.start !== void 0 && this.changeStartWith(this.data.meta.start), "counterType" in this.data.meta && this.data.meta.counterType !== void 0 && this.changeCounters(this.data.meta.counterType), this.listWrapper;
|
|
1055
|
+
}
|
|
1056
|
+
save(t) {
|
|
1057
|
+
const e = t != null ? t : this.listWrapper, i = (r) => E(r).map((o) => {
|
|
1058
|
+
const a = H(o);
|
|
1059
|
+
return { content: this.renderer.getItemContent(o), meta: this.renderer.getItemMeta(o), items: a ? i(a) : [] };
|
|
1060
|
+
}), s = e ? i(e) : [];
|
|
1061
|
+
let n = { style: this.data.style, meta: {}, items: s };
|
|
1062
|
+
return this.data.style === "ordered" && (n.meta = { start: this.data.meta.start, counterType: this.data.meta.counterType }), n;
|
|
1063
|
+
}
|
|
1064
|
+
static get pasteConfig() {
|
|
1065
|
+
return { tags: ["OL", "UL", "LI"] };
|
|
1066
|
+
}
|
|
1067
|
+
merge(t) {
|
|
1068
|
+
const e = this.block.holder.querySelectorAll(`.${v.item}`), i = e[e.length - 1], s = q(i);
|
|
1069
|
+
if (i === null || s === null || (s.insertAdjacentHTML("beforeend", t.items[0].content), this.listWrapper === void 0)) return;
|
|
1070
|
+
const n = E(this.listWrapper);
|
|
1071
|
+
if (n.length === 0) return;
|
|
1072
|
+
let r = H(n[n.length - 1]);
|
|
1073
|
+
const o = t.items.shift();
|
|
1074
|
+
o !== void 0 && (o.items.length !== 0 && (r === null && (r = this.renderer.renderWrapper(!1)), this.appendItems(o.items, r)), t.items.length > 0 && this.appendItems(t.items, this.listWrapper));
|
|
1075
|
+
}
|
|
1076
|
+
onPaste(t) {
|
|
1077
|
+
const e = t.detail.data;
|
|
1078
|
+
this.data = this.pasteHandler(e);
|
|
1079
|
+
const i = this.listWrapper;
|
|
1080
|
+
i && i.parentNode && i.parentNode.replaceChild(this.render(), i);
|
|
1081
|
+
}
|
|
1082
|
+
pasteHandler(t) {
|
|
1083
|
+
const { tagName: e } = t;
|
|
1084
|
+
let i, s = "unordered";
|
|
1085
|
+
switch (e) {
|
|
1086
|
+
case "OL":
|
|
1087
|
+
s = "ordered", i = "ol";
|
|
1088
|
+
break;
|
|
1089
|
+
case "UL":
|
|
1090
|
+
case "LI":
|
|
1091
|
+
s = "unordered", i = "ul";
|
|
1092
|
+
}
|
|
1093
|
+
const n = { style: s, meta: {}, items: [] };
|
|
1094
|
+
s === "ordered" && (this.data.meta.counterType = "numeric", this.data.meta.start = 1);
|
|
1095
|
+
const r = (o) => Array.from(o.querySelectorAll(":scope > li")).map((a) => {
|
|
1096
|
+
var c;
|
|
1097
|
+
const h = a.querySelector(`:scope > ${i}`), l = h ? r(h) : [];
|
|
1098
|
+
return { content: (c = a.innerHTML) != null ? c : "", meta: {}, items: l };
|
|
1099
|
+
});
|
|
1100
|
+
return n.items = r(t), n;
|
|
1101
|
+
}
|
|
1102
|
+
changeStartWith(t) {
|
|
1103
|
+
this.listWrapper.style.setProperty("counter-reset", "item " + (t - 1)), this.data.meta.start = t;
|
|
1104
|
+
}
|
|
1105
|
+
changeCounters(t) {
|
|
1106
|
+
this.listWrapper.style.setProperty("--list-counter-type", t), this.data.meta.counterType = t;
|
|
1107
|
+
}
|
|
1108
|
+
enterPressed(t) {
|
|
1109
|
+
var o;
|
|
1110
|
+
const e = this.currentItem;
|
|
1111
|
+
if (t.stopPropagation(), t.preventDefault(), t.isComposing || e === null) return;
|
|
1112
|
+
const i = ((o = this.renderer) == null ? void 0 : o.getItemContent(e).trim().length) === 0, s = e.parentNode === this.listWrapper, n = e.previousElementSibling === null, r = this.api.blocks.getCurrentBlockIndex();
|
|
1113
|
+
if (s && i) return e.nextElementSibling !== null || function(a) {
|
|
1114
|
+
return a.querySelector(`.${v.itemChildren}`) !== null;
|
|
1115
|
+
}(e) ? void this.splitList(e) : void (n ? this.convertItemToDefaultBlock(r, !0) : this.convertItemToDefaultBlock());
|
|
1116
|
+
i ? this.unshiftItem(e) : this.splitItem(e);
|
|
1117
|
+
}
|
|
1118
|
+
backspace(t) {
|
|
1119
|
+
var i;
|
|
1120
|
+
const e = this.currentItem;
|
|
1121
|
+
e !== null && Ft(e) && ((i = window.getSelection()) == null ? void 0 : i.isCollapsed) !== !1 && (t.stopPropagation(), e.parentNode !== this.listWrapper || e.previousElementSibling !== null ? (t.preventDefault(), this.mergeItemWithPrevious(e)) : this.convertFirstItemToDefaultBlock());
|
|
1122
|
+
}
|
|
1123
|
+
shiftTab(t) {
|
|
1124
|
+
t.stopPropagation(), t.preventDefault(), this.currentItem !== null && this.unshiftItem(this.currentItem);
|
|
1125
|
+
}
|
|
1126
|
+
unshiftItem(t) {
|
|
1127
|
+
if (!t.parentNode || !A(t.parentNode)) return;
|
|
1128
|
+
const e = t.parentNode.closest(`.${v.item}`);
|
|
1129
|
+
if (!e) return;
|
|
1130
|
+
let i = H(t);
|
|
1131
|
+
if (t.parentElement === null) return;
|
|
1132
|
+
const s = j(t);
|
|
1133
|
+
s !== null && (i === null && (i = this.renderer.renderWrapper(!1)), s.forEach((n) => {
|
|
1134
|
+
i.appendChild(n);
|
|
1135
|
+
}), t.appendChild(i)), e.after(t), R(t, !1), Y(e);
|
|
1136
|
+
}
|
|
1137
|
+
splitList(t) {
|
|
1138
|
+
const e = E(t), i = this.block, s = this.api.blocks.getCurrentBlockIndex();
|
|
1139
|
+
if (e.length !== 0) {
|
|
1140
|
+
const a = e[0];
|
|
1141
|
+
this.unshiftItem(a), R(t, !1);
|
|
1142
|
+
}
|
|
1143
|
+
if (t.previousElementSibling === null && t.parentNode === this.listWrapper) return void this.convertItemToDefaultBlock(s);
|
|
1144
|
+
const n = j(t);
|
|
1145
|
+
if (n === null) return;
|
|
1146
|
+
const r = this.renderer.renderWrapper(!0);
|
|
1147
|
+
n.forEach((a) => {
|
|
1148
|
+
r.appendChild(a);
|
|
1149
|
+
});
|
|
1150
|
+
const o = this.save(r);
|
|
1151
|
+
o.meta.start = this.data.style == "ordered" ? 1 : void 0, this.api.blocks.insert(i == null ? void 0 : i.name, o, this.config, s + 1), this.convertItemToDefaultBlock(s + 1), r.remove();
|
|
1152
|
+
}
|
|
1153
|
+
splitItem(t) {
|
|
1154
|
+
const [e, i] = Ut();
|
|
1155
|
+
if (e === null) return;
|
|
1156
|
+
const s = q(t);
|
|
1157
|
+
let n;
|
|
1158
|
+
n = s === null ? "" : Vt(s, e, i, "right", !0);
|
|
1159
|
+
const r = H(t), o = this.renderItem(n);
|
|
1160
|
+
t == null || t.after(o), r && o.appendChild(r), R(o);
|
|
1161
|
+
}
|
|
1162
|
+
mergeItemWithPrevious(t) {
|
|
1163
|
+
var c;
|
|
1164
|
+
const e = t.previousElementSibling, i = t.parentNode;
|
|
1165
|
+
if (i === null || !A(i)) return;
|
|
1166
|
+
const s = i.closest(`.${v.item}`);
|
|
1167
|
+
if (!e && !s || e && !A(e)) return;
|
|
1168
|
+
let n;
|
|
1169
|
+
if (e) {
|
|
1170
|
+
const u = E(e, !1);
|
|
1171
|
+
n = u.length !== 0 && u.length !== 0 ? u[u.length - 1] : e;
|
|
1172
|
+
} else n = s;
|
|
1173
|
+
const r = this.renderer.getItemContent(t);
|
|
1174
|
+
if (!n) return;
|
|
1175
|
+
R(n, !1);
|
|
1176
|
+
const o = q(n);
|
|
1177
|
+
if (o === null) return;
|
|
1178
|
+
o.insertAdjacentHTML("beforeend", r);
|
|
1179
|
+
const a = E(t);
|
|
1180
|
+
if (a.length === 0) return t.remove(), void Y(n);
|
|
1181
|
+
const h = e || s, l = (c = H(h)) != null ? c : this.renderer.renderWrapper(!1);
|
|
1182
|
+
e ? a.forEach((u) => {
|
|
1183
|
+
l.appendChild(u);
|
|
1184
|
+
}) : a.forEach((u) => {
|
|
1185
|
+
l.prepend(u);
|
|
1186
|
+
}), H(h) === null && n.appendChild(l), t.remove();
|
|
1187
|
+
}
|
|
1188
|
+
addTab(t) {
|
|
1189
|
+
var n;
|
|
1190
|
+
t.stopPropagation(), t.preventDefault();
|
|
1191
|
+
const e = this.currentItem;
|
|
1192
|
+
if (!e) return;
|
|
1193
|
+
if (((n = this.config) == null ? void 0 : n.maxLevel) !== void 0) {
|
|
1194
|
+
const r = this.currentItemLevel;
|
|
1195
|
+
if (r !== null && r === this.config.maxLevel) return;
|
|
1196
|
+
}
|
|
1197
|
+
const i = e.previousSibling;
|
|
1198
|
+
if (i === null || !A(i)) return;
|
|
1199
|
+
const s = H(i);
|
|
1200
|
+
if (s)
|
|
1201
|
+
s.appendChild(e), E(e).forEach((r) => {
|
|
1202
|
+
s.appendChild(r);
|
|
1203
|
+
});
|
|
1204
|
+
else {
|
|
1205
|
+
const r = this.renderer.renderWrapper(!1);
|
|
1206
|
+
r.appendChild(e), E(e).forEach((o) => {
|
|
1207
|
+
r.appendChild(o);
|
|
1208
|
+
}), i.appendChild(r);
|
|
1209
|
+
}
|
|
1210
|
+
Y(e), R(e, !1);
|
|
1211
|
+
}
|
|
1212
|
+
convertItemToDefaultBlock(t, e) {
|
|
1213
|
+
let i;
|
|
1214
|
+
const s = this.currentItem, n = s !== null ? this.renderer.getItemContent(s) : "";
|
|
1215
|
+
e === !0 && this.api.blocks.delete(), i = t !== void 0 ? this.api.blocks.insert(void 0, { text: n }, void 0, t) : this.api.blocks.insert(), s == null || s.remove(), this.api.caret.setToBlock(i, "start");
|
|
1216
|
+
}
|
|
1217
|
+
convertFirstItemToDefaultBlock() {
|
|
1218
|
+
const t = this.currentItem;
|
|
1219
|
+
if (t === null) return;
|
|
1220
|
+
const e = E(t);
|
|
1221
|
+
if (e.length !== 0) {
|
|
1222
|
+
const r = e[0];
|
|
1223
|
+
this.unshiftItem(r), R(t);
|
|
1224
|
+
}
|
|
1225
|
+
const i = j(t), s = this.api.blocks.getCurrentBlockIndex(), n = i === null;
|
|
1226
|
+
this.convertItemToDefaultBlock(s, n);
|
|
1227
|
+
}
|
|
1228
|
+
renderItem(t, e) {
|
|
1229
|
+
const i = e != null ? e : this.renderer.composeDefaultMeta();
|
|
1230
|
+
switch (!0) {
|
|
1231
|
+
case this.renderer instanceof S:
|
|
1232
|
+
case this.renderer instanceof x:
|
|
1233
|
+
}
|
|
1234
|
+
return this.renderer.renderItem(t, i);
|
|
1235
|
+
}
|
|
1236
|
+
appendItems(t, e) {
|
|
1237
|
+
t.forEach((i) => {
|
|
1238
|
+
var n;
|
|
1239
|
+
const s = this.renderItem(i.content, i.meta);
|
|
1240
|
+
if (e.appendChild(s), i.items.length) {
|
|
1241
|
+
const r = (n = this.renderer) == null ? void 0 : n.renderWrapper(!1);
|
|
1242
|
+
this.appendItems(i.items, r), s.appendChild(r);
|
|
1243
|
+
}
|
|
1244
|
+
});
|
|
1245
|
+
}
|
|
1246
|
+
}
|
|
1247
|
+
const ie = /* @__PURE__ */ new Map([["Numeric", "numeric"], ["Lower Roman", "lower-roman"], ["Upper Roman", "upper-roman"], ["Lower Alpha", "lower-alpha"], ["Upper Alpha", "upper-alpha"]]);
|
|
1248
|
+
class F {
|
|
1249
|
+
static get isReadOnlySupported() {
|
|
1250
|
+
return !0;
|
|
1251
|
+
}
|
|
1252
|
+
static get enableLineBreaks() {
|
|
1253
|
+
return !0;
|
|
1254
|
+
}
|
|
1255
|
+
static get toolbox() {
|
|
1256
|
+
return [{ icon: `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
1257
|
+
<line x1="9" y1="7" x2="19" y2="7" stroke="black" stroke-width="2" stroke-linecap="round"/>
|
|
1258
|
+
<line x1="9" y1="12" x2="19" y2="12" stroke="black" stroke-width="2" stroke-linecap="round"/>
|
|
1259
|
+
<line x1="9" y1="17" x2="19" y2="17" stroke="black" stroke-width="2" stroke-linecap="round"/>
|
|
1260
|
+
<path d="M5.00001 17H4.99002" stroke="black" stroke-width="2" stroke-linecap="round"/>
|
|
1261
|
+
<path d="M5.00001 12H4.99002" stroke="black" stroke-width="2" stroke-linecap="round"/>
|
|
1262
|
+
<path d="M5.00001 7H4.99002" stroke="black" stroke-width="2" stroke-linecap="round"/>
|
|
1263
|
+
</svg>
|
|
1264
|
+
`, title: "Unordered List", data: { style: "unordered" } }, { icon: `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
1265
|
+
<line x1="12" y1="7" x2="19" y2="7" stroke="black" stroke-width="2" stroke-linecap="round"/>
|
|
1266
|
+
<line x1="12" y1="12" x2="19" y2="12" stroke="black" stroke-width="2" stroke-linecap="round"/>
|
|
1267
|
+
<line x1="12" y1="17" x2="19" y2="17" stroke="black" stroke-width="2" stroke-linecap="round"/>
|
|
1268
|
+
<path d="M7.79999 14L7.79999 7.2135C7.79999 7.12872 7.7011 7.0824 7.63597 7.13668L4.79999 9.5" stroke="black" stroke-width="2" stroke-linecap="round"/>
|
|
1269
|
+
</svg>
|
|
1270
|
+
`, title: "Ordered List", data: { style: "ordered" } }, { icon: `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
1271
|
+
<path d="M9.2 12L11.0586 13.8586C11.1367 13.9367 11.2633 13.9367 11.3414 13.8586L14.7 10.5" stroke="black" stroke-width="2" stroke-linecap="round"/>
|
|
1272
|
+
<rect x="5" y="5" width="14" height="14" rx="4" stroke="black" stroke-width="2"/>
|
|
1273
|
+
</svg>
|
|
1274
|
+
`, title: "Checklist", data: { style: "checklist" } }];
|
|
1275
|
+
}
|
|
1276
|
+
static get pasteConfig() {
|
|
1277
|
+
return { tags: ["OL", "UL", "LI"] };
|
|
1278
|
+
}
|
|
1279
|
+
static get conversionConfig() {
|
|
1280
|
+
return { export: (t) => F.joinRecursive(t), import: (t, e) => ({ meta: {}, items: [{ content: t, meta: {}, items: [] }], style: (e == null ? void 0 : e.defaultStyle) !== void 0 ? e.defaultStyle : "unordered" }) };
|
|
1281
|
+
}
|
|
1282
|
+
get listStyle() {
|
|
1283
|
+
return this.data.style || this.defaultListStyle;
|
|
1284
|
+
}
|
|
1285
|
+
set listStyle(t) {
|
|
1286
|
+
var i;
|
|
1287
|
+
this.data.style = t, this.changeTabulatorByStyle();
|
|
1288
|
+
const e = this.list.render();
|
|
1289
|
+
(i = this.listElement) == null || i.replaceWith(e), this.listElement = e;
|
|
1290
|
+
}
|
|
1291
|
+
constructor({ data: t, config: e, api: i, readOnly: s, block: n }) {
|
|
1292
|
+
var o;
|
|
1293
|
+
this.api = i, this.readOnly = s, this.config = e, this.block = n, this.defaultListStyle = ((o = this.config) == null ? void 0 : o.defaultStyle) || "unordered", this.defaultCounterTypes = this.config.counterTypes || Array.from(ie.values());
|
|
1294
|
+
const r = { style: this.defaultListStyle, meta: {}, items: [] };
|
|
1295
|
+
this.data = Object.keys(t).length ? function(a) {
|
|
1296
|
+
const h = [];
|
|
1297
|
+
return function(l) {
|
|
1298
|
+
return typeof l.items[0] == "string";
|
|
1299
|
+
}(a) ? (a.items.forEach((l) => {
|
|
1300
|
+
h.push({ content: l, meta: {}, items: [] });
|
|
1301
|
+
}), { style: a.style, meta: {}, items: h }) : function(l) {
|
|
1302
|
+
return typeof l.items[0] != "string" && "text" in l.items[0] && "checked" in l.items[0] && typeof l.items[0].text == "string" && typeof l.items[0].checked == "boolean";
|
|
1303
|
+
}(a) ? (a.items.forEach((l) => {
|
|
1304
|
+
h.push({ content: l.text, meta: { checked: l.checked }, items: [] });
|
|
1305
|
+
}), { style: "checklist", meta: {}, items: h }) : function(l) {
|
|
1306
|
+
return !("meta" in l);
|
|
1307
|
+
}(a) ? { style: a.style, meta: {}, items: a.items } : structuredClone(a);
|
|
1308
|
+
}(t) : r, this.listStyle === "ordered" && this.data.meta.counterType === void 0 && (this.data.meta.counterType = "numeric"), this.changeTabulatorByStyle();
|
|
1309
|
+
}
|
|
1310
|
+
static joinRecursive(t) {
|
|
1311
|
+
return t.items.map((e) => `${e.content} ${F.joinRecursive(e)}`).join("");
|
|
1312
|
+
}
|
|
1313
|
+
render() {
|
|
1314
|
+
return this.listElement = this.list.render(), this.listElement;
|
|
1315
|
+
}
|
|
1316
|
+
save() {
|
|
1317
|
+
return this.data = this.list.save(), this.data;
|
|
1318
|
+
}
|
|
1319
|
+
merge(t) {
|
|
1320
|
+
this.list.merge(t);
|
|
1321
|
+
}
|
|
1322
|
+
onPaste(t) {
|
|
1323
|
+
const { tagName: e } = t.detail.data;
|
|
1324
|
+
switch (e) {
|
|
1325
|
+
case "OL":
|
|
1326
|
+
this.listStyle = "ordered";
|
|
1327
|
+
break;
|
|
1328
|
+
case "UL":
|
|
1329
|
+
case "LI":
|
|
1330
|
+
this.listStyle = "unordered";
|
|
1331
|
+
}
|
|
1332
|
+
this.list.onPaste(t);
|
|
1333
|
+
}
|
|
1334
|
+
pasteHandler(t) {
|
|
1335
|
+
return this.list.pasteHandler(t);
|
|
1336
|
+
}
|
|
1337
|
+
changeCounters(t) {
|
|
1338
|
+
var e;
|
|
1339
|
+
(e = this.list) == null || e.changeCounters(t), this.data.meta.counterType = t;
|
|
1340
|
+
}
|
|
1341
|
+
changeStartWith(t) {
|
|
1342
|
+
var e;
|
|
1343
|
+
(e = this.list) == null || e.changeStartWith(t), this.data.meta.start = t;
|
|
1344
|
+
}
|
|
1345
|
+
changeTabulatorByStyle() {
|
|
1346
|
+
switch (this.listStyle) {
|
|
1347
|
+
case "ordered":
|
|
1348
|
+
this.list = new G({ data: this.data, readOnly: this.readOnly, api: this.api, config: this.config, block: this.block }, new S(this.readOnly, this.config));
|
|
1349
|
+
break;
|
|
1350
|
+
case "unordered":
|
|
1351
|
+
this.list = new G({ data: this.data, readOnly: this.readOnly, api: this.api, config: this.config, block: this.block }, new x(this.readOnly, this.config));
|
|
1352
|
+
break;
|
|
1353
|
+
case "checklist":
|
|
1354
|
+
this.list = new G({ data: this.data, readOnly: this.readOnly, api: this.api, config: this.config, block: this.block }, new m(this.readOnly, this.config));
|
|
1355
|
+
}
|
|
1356
|
+
}
|
|
1357
|
+
}
|
|
1358
|
+
class se {
|
|
1359
|
+
constructor(t, e, i) {
|
|
1360
|
+
this.holder = e, this.observer = null, this.debounceTimer = i, this.mutationDebouncer = this.debounce(() => {
|
|
1361
|
+
t();
|
|
1362
|
+
}, this.debounceTimer);
|
|
1363
|
+
}
|
|
1364
|
+
setMutationObserver() {
|
|
1365
|
+
const t = this.holder.querySelector(".codex-editor__redactor");
|
|
1366
|
+
this.observer = new MutationObserver((e) => {
|
|
1367
|
+
this.mutationHandler(e);
|
|
1368
|
+
}), this.observer.observe(t, { childList: !0, attributes: !0, subtree: !0, characterData: !0, characterDataOldValue: !0 });
|
|
1369
|
+
}
|
|
1370
|
+
mutationHandler(t) {
|
|
1371
|
+
let e = !1;
|
|
1372
|
+
t.forEach((i) => {
|
|
1373
|
+
switch (i.type) {
|
|
1374
|
+
case "childList":
|
|
1375
|
+
i.target === this.holder ? this.onDestroy() : e = !0;
|
|
1376
|
+
break;
|
|
1377
|
+
case "characterData":
|
|
1378
|
+
e = !0;
|
|
1379
|
+
break;
|
|
1380
|
+
case "attributes":
|
|
1381
|
+
i.target.classList.contains("ce-block") || i.target.classList.contains("tc-toolbox") || (e = !0);
|
|
1382
|
+
}
|
|
1383
|
+
}), e && this.mutationDebouncer();
|
|
1384
|
+
}
|
|
1385
|
+
debounce(t, e) {
|
|
1386
|
+
let i;
|
|
1387
|
+
return (...s) => {
|
|
1388
|
+
const n = this;
|
|
1389
|
+
clearTimeout(i), i = setTimeout(() => t.apply(n, s), e);
|
|
1390
|
+
};
|
|
1391
|
+
}
|
|
1392
|
+
onDestroy() {
|
|
1393
|
+
var e;
|
|
1394
|
+
const t = new CustomEvent("destroy");
|
|
1395
|
+
document.dispatchEvent(t), (e = this.observer) == null || e.disconnect();
|
|
1396
|
+
}
|
|
1397
|
+
}
|
|
1398
|
+
class ne {
|
|
1399
|
+
constructor({ editor: t, config: e = {}, onUpdate: i, maxLength: s }) {
|
|
1400
|
+
const n = { maxLength: 30, onUpdate() {
|
|
1401
|
+
}, config: { debounceTimer: 200, shortcuts: { undo: ["CMD+Z"], redo: ["CMD+Y", "CMD+SHIFT+Z"] } } }, { blocks: r, caret: o } = t, { configuration: a } = t, { holder: h, defaultBlock: l } = a, c = n.config.shortcuts, { shortcuts: u } = e, p = { ...c, ...u }, g = Array.isArray(p.undo) ? p.undo : [p.undo], b = Array.isArray(p.redo) ? p.redo : [p.redo], L = n.config.debounceTimer, { debounceTimer: T = L } = e;
|
|
1402
|
+
this.holder = typeof h == "string" ? document.getElementById(h) : h, this.editor = t, this.defaultBlock = l, this.blocks = r, this.caret = o, this.shouldSaveHistory = !0, this.readOnly = a.readOnly, this.maxLength = s || n.maxLength, this.onUpdate = i || n.onUpdate, this.config = { debounceTimer: T, shortcuts: { undo: g, redo: b } }, new se(() => this.registerChange(), this.holder, this.config.debounceTimer).setMutationObserver(), this.setEventListeners(), this.initialItem = null, this.clear();
|
|
1403
|
+
}
|
|
1404
|
+
static get isReadOnlySupported() {
|
|
1405
|
+
return !0;
|
|
1406
|
+
}
|
|
1407
|
+
truncate(t, e) {
|
|
1408
|
+
for (; t.length > e; ) t.shift();
|
|
1409
|
+
}
|
|
1410
|
+
initialize(t) {
|
|
1411
|
+
const e = "blocks" in t ? t.blocks : t, i = { index: e.length - 1, state: e };
|
|
1412
|
+
this.stack[0] = i, this.initialItem = i;
|
|
1413
|
+
}
|
|
1414
|
+
clear() {
|
|
1415
|
+
this.stack = this.initialItem ? [this.initialItem] : [{ index: 0, state: [{ type: this.defaultBlock, data: {} }] }], this.position = 0, this.onUpdate();
|
|
1416
|
+
}
|
|
1417
|
+
setReadOnly() {
|
|
1418
|
+
const t = this.holder.querySelector(".ce-toolbox");
|
|
1419
|
+
this.readOnly = !t;
|
|
1420
|
+
}
|
|
1421
|
+
registerChange() {
|
|
1422
|
+
this.setReadOnly(), this.readOnly || (this.editor && this.editor.save && this.shouldSaveHistory && this.editor.save().then((t) => {
|
|
1423
|
+
this.editorDidUpdate(t.blocks) && this.save(t.blocks);
|
|
1424
|
+
}), this.shouldSaveHistory = !0);
|
|
1425
|
+
}
|
|
1426
|
+
editorDidUpdate(t) {
|
|
1427
|
+
const { state: e } = this.stack[this.position];
|
|
1428
|
+
return !!t.length && (t.length !== e.length || JSON.stringify(e) !== JSON.stringify(t));
|
|
1429
|
+
}
|
|
1430
|
+
save(t) {
|
|
1431
|
+
this.position >= this.maxLength && this.truncate(this.stack, this.maxLength), this.position = Math.min(this.position, this.stack.length - 1), this.stack = this.stack.slice(0, this.position + 1);
|
|
1432
|
+
const e = this.blocks.getCurrentBlockIndex(), i = this.blocks.getBlocksCount();
|
|
1433
|
+
let s = e;
|
|
1434
|
+
t[e] || (s -= i - t.length);
|
|
1435
|
+
const n = !t[s] || t[s].type !== "paragraph" && t[s].type !== "header" ? null : this.getCaretIndex(e);
|
|
1436
|
+
this.stack.push({ index: s, state: t, caretIndex: n }), this.position += 1, this.onUpdate();
|
|
1437
|
+
}
|
|
1438
|
+
getCaretIndex(t) {
|
|
1439
|
+
const e = this.holder.getElementsByClassName("ce-block__content");
|
|
1440
|
+
return new rt(e[t].firstChild).getPos();
|
|
1441
|
+
}
|
|
1442
|
+
insertDeletedBlock(t, e, i) {
|
|
1443
|
+
for (let s = 0; s < t.length; s += 1) if (!e[s] || t[s].id !== e[s].id) {
|
|
1444
|
+
this.blocks.insert(t[s].type, t[s].data, {}, s, !0), this.caret.setToBlock(i, "end");
|
|
1445
|
+
break;
|
|
1446
|
+
}
|
|
1447
|
+
}
|
|
1448
|
+
blockWasDropped(t, e) {
|
|
1449
|
+
return t.length === e.length && t.some((i, s) => i.id !== e[s].id);
|
|
1450
|
+
}
|
|
1451
|
+
blockWasSkipped(t, e) {
|
|
1452
|
+
return t.length !== e.length;
|
|
1453
|
+
}
|
|
1454
|
+
contentChangedInNoFocusBlock(t, e) {
|
|
1455
|
+
return t !== e;
|
|
1456
|
+
}
|
|
1457
|
+
blockWasDeleted(t, e) {
|
|
1458
|
+
return t.length > e.length;
|
|
1459
|
+
}
|
|
1460
|
+
contentWasCopied(t, e, i) {
|
|
1461
|
+
return Object.keys(t[i].data).length === 0 && JSON.stringify(e[i + 1]) !== JSON.stringify(t[i + 1]);
|
|
1462
|
+
}
|
|
1463
|
+
async undo() {
|
|
1464
|
+
if (this.canUndo()) {
|
|
1465
|
+
const { index: t, state: e } = this.stack[this.position];
|
|
1466
|
+
this.position -= 1, this.shouldSaveHistory = !1;
|
|
1467
|
+
let { index: i } = this.stack[this.position];
|
|
1468
|
+
const { state: s, caretIndex: n } = this.stack[this.position];
|
|
1469
|
+
this.onUpdate();
|
|
1470
|
+
const r = this.blocks.getBlocksCount();
|
|
1471
|
+
if (s[i] || (i -= 1, this.stack[this.position].index = i), this.blockWasDeleted(s, e)) this.insertDeletedBlock(s, e, i);
|
|
1472
|
+
else if (this.contentWasCopied(s, e, i)) await this.blocks.render({ blocks: s }), this.caret.setToBlock(i, "end");
|
|
1473
|
+
else if (i < t && this.blockWasSkipped(s, e)) await this.blocks.delete(t), this.caret.setToBlock(i, "end");
|
|
1474
|
+
else if (r > s.length) await this.blocks.render({ blocks: s }), this.setCaretIndex(i, n);
|
|
1475
|
+
else if (this.blockWasDropped(s, e)) await this.blocks.render({ blocks: s }), this.caret.setToBlock(i, "end");
|
|
1476
|
+
else if (this.contentChangedInNoFocusBlock(i, t)) {
|
|
1477
|
+
const { id: a } = this.blocks.getBlockByIndex(t);
|
|
1478
|
+
await this.blocks.update(a, s[t].data), this.setCaretIndex(i, n);
|
|
1479
|
+
}
|
|
1480
|
+
const o = this.blocks.getBlockByIndex(i);
|
|
1481
|
+
o && (await this.blocks.update(o.id, s[i].data), this.setCaretIndex(i, n));
|
|
1482
|
+
}
|
|
1483
|
+
}
|
|
1484
|
+
setCaretIndex(t, e) {
|
|
1485
|
+
if (e && e !== -1) {
|
|
1486
|
+
const i = this.holder.getElementsByClassName("ce-block__content"), s = new rt(i[t].firstChild);
|
|
1487
|
+
setTimeout(() => s.setPos(e), 50);
|
|
1488
|
+
} else this.caret.setToBlock(t, "end");
|
|
1489
|
+
}
|
|
1490
|
+
async insertBlock(t, e) {
|
|
1491
|
+
await this.blocks.insert(t[e].type, t[e].data, {}, e, !0);
|
|
1492
|
+
}
|
|
1493
|
+
async insertSkippedBlocks(t, e, i) {
|
|
1494
|
+
for (let s = t.length; s < e.length; s += 1) this.insertBlock(e, s);
|
|
1495
|
+
JSON.stringify(t[i - 1]) !== JSON.stringify(e[i - 1]) && await this.updateModifiedBlock(e, i);
|
|
1496
|
+
}
|
|
1497
|
+
async updateModifiedBlock(t, e) {
|
|
1498
|
+
const i = t[e - 1];
|
|
1499
|
+
return this.editor.blocks.getById(i.id) ? this.blocks.update(i.id, i.data) : this.blocks.render({ blocks: t });
|
|
1500
|
+
}
|
|
1501
|
+
async redo() {
|
|
1502
|
+
if (this.canRedo()) {
|
|
1503
|
+
this.position += 1, this.shouldSaveHistory = !1;
|
|
1504
|
+
const { index: t, state: e, caretIndex: i } = this.stack[this.position], { index: s, state: n } = this.stack[this.position - 1];
|
|
1505
|
+
this.blockWasDeleted(n, e) ? (await this.blocks.delete(), this.caret.setToBlock(t, "end")) : this.blockWasSkipped(e, n) ? (await this.insertSkippedBlocks(n, e, t), this.caret.setToBlock(t, "end")) : this.blockWasDropped(e, n) && this.position !== 1 && (await this.blocks.render({ blocks: e }), this.caret.setToBlock(t, "end")), this.onUpdate();
|
|
1506
|
+
const r = this.blocks.getBlockByIndex(t);
|
|
1507
|
+
r && (await this.blocks.update(r.id, e[t].data), this.setCaretIndex(t, i));
|
|
1508
|
+
}
|
|
1509
|
+
}
|
|
1510
|
+
canUndo() {
|
|
1511
|
+
return !this.readOnly && this.position > 0;
|
|
1512
|
+
}
|
|
1513
|
+
canRedo() {
|
|
1514
|
+
return !this.readOnly && this.position < this.count();
|
|
1515
|
+
}
|
|
1516
|
+
count() {
|
|
1517
|
+
return this.stack.length - 1;
|
|
1518
|
+
}
|
|
1519
|
+
parseKeys(t) {
|
|
1520
|
+
const e = { CMD: /(Mac)/i.test(navigator.platform) ? "metaKey" : "ctrlKey", ALT: "altKey", SHIFT: "shiftKey" }, i = t.slice(0, -1).map((n) => e[n]), s = i.includes("shiftKey") && t.length === 2 ? t[t.length - 1].toUpperCase() : t[t.length - 1].toLowerCase();
|
|
1521
|
+
return i.push(s), i;
|
|
1522
|
+
}
|
|
1523
|
+
setEventListeners() {
|
|
1524
|
+
const { holder: t } = this, { shortcuts: e } = this.config, { undo: i, redo: s } = e, n = i.map((p) => p.replace(/ /g, "").split("+")), r = s.map((p) => p.replace(/ /g, "").split("+")), o = n.map((p) => this.parseKeys(p)), a = r.map((p) => this.parseKeys(p)), h = (p, g) => g.reduce((b, L) => b || ((T, _) => _.length === 3 && T[_[0]] && T[_[1]] && T.key.toLowerCase() === _[2])(p, L), !1), l = (p, g, b) => !(!((L, T) => T.reduce((_, U) => _ || ((z, V) => V.length === 2 && z[V[0]] && z.key.toLowerCase() === V[1])(L, U), !1))(p, g) || h(p, b)) || !!h(p, g), c = (p) => {
|
|
1525
|
+
l(p, o, a) && (p.preventDefault(), this.undo());
|
|
1526
|
+
}, u = (p) => {
|
|
1527
|
+
l(p, a, o) && (p.preventDefault(), this.redo());
|
|
1528
|
+
};
|
|
1529
|
+
t.addEventListener("keydown", c), t.addEventListener("keydown", u), t.addEventListener("destroy", () => {
|
|
1530
|
+
t.removeEventListener("keydown", c), t.removeEventListener("keydown", u);
|
|
1531
|
+
});
|
|
1532
|
+
}
|
|
1533
|
+
}
|
|
1534
|
+
class M {
|
|
1535
|
+
static get toolbox() {
|
|
1536
|
+
return { icon: '<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1763693072662" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2633" id="mx_n_1763693072663" width="24" height="24" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M83.2 147.2V448c0 25.6 19.2 44.8 44.8 44.8h768c25.6 0 44.8-19.2 44.8-44.8V147.2c0-25.6-19.2-44.8-44.8-44.8H128c-25.6 6.4-44.8 25.6-44.8 44.8z m89.6 256V192h684.8v211.2H172.8zM810.24 642.56c0-25.6-19.2-44.8-44.8-44.8h-640c-25.6 0-44.8 19.2-44.8 44.8 0 25.6 19.2 44.8 44.8 44.8h640c25.6 6.4 44.8-12.8 44.8-44.8zM554.56 866.24c0-25.6-19.2-44.8-44.8-44.8h-384c-25.6 0-44.8 19.2-44.8 44.8 0 25.6 19.2 44.8 44.8 44.8h384c25.6 6.4 44.8-12.8 44.8-44.8z" fill="#262626" p-id="2634"></path></svg>', title: "Alert" };
|
|
1537
|
+
}
|
|
1538
|
+
static get enableLineBreaks() {
|
|
1539
|
+
return !0;
|
|
1540
|
+
}
|
|
1541
|
+
static get DEFAULT_TYPE() {
|
|
1542
|
+
return "info";
|
|
1543
|
+
}
|
|
1544
|
+
static get DEFAULT_ALIGN_TYPE() {
|
|
1545
|
+
return "left";
|
|
1546
|
+
}
|
|
1547
|
+
static get DEFAULT_MESSAGE_PLACEHOLDER() {
|
|
1548
|
+
return "Type here...";
|
|
1549
|
+
}
|
|
1550
|
+
static get ALERT_TYPES() {
|
|
1551
|
+
return ["primary", "secondary", "info", "success", "warning", "danger", "light", "dark"];
|
|
1552
|
+
}
|
|
1553
|
+
static get ALIGN_TYPES() {
|
|
1554
|
+
return ["left", "center", "right"];
|
|
1555
|
+
}
|
|
1556
|
+
get CSS() {
|
|
1557
|
+
return { wrapper: "cdx-alert", wrapperForType: (t) => `cdx-alert-${t}`, wrapperForAlignType: (t) => `cdx-alert-align-${t}`, message: "cdx-alert__message" };
|
|
1558
|
+
}
|
|
1559
|
+
constructor({ data: t, config: e, api: i, readOnly: s }) {
|
|
1560
|
+
this.api = i, this.alertTypes = e.alertTypes || M.ALERT_TYPES, this.defaultType = e.defaultType || M.DEFAULT_TYPE, this.defaultAlign = e.defaultAlign || M.DEFAULT_ALIGN_TYPE, this.messagePlaceholder = e.messagePlaceholder || M.DEFAULT_MESSAGE_PLACEHOLDER, this.data = { type: this.alertTypes.includes(t.type) ? t.type : this.defaultType, align: M.ALIGN_TYPES.includes(t.align) ? t.align : this.defaultAlign, message: t.message || "" }, this.container = void 0, this.readOnly = s;
|
|
1561
|
+
}
|
|
1562
|
+
static get isReadOnlySupported() {
|
|
1563
|
+
return !0;
|
|
1564
|
+
}
|
|
1565
|
+
render() {
|
|
1566
|
+
const t = [this.CSS.wrapper, this.CSS.wrapperForType(this.data.type), this.CSS.wrapperForAlignType(this.data.align)];
|
|
1567
|
+
this.container = this._make("div", t);
|
|
1568
|
+
const e = this._make("div", [this.CSS.message], { contentEditable: !this.readOnly, innerHTML: this.data.message });
|
|
1569
|
+
return e.dataset.placeholder = this.messagePlaceholder, this.container.appendChild(e), this.container;
|
|
1570
|
+
}
|
|
1571
|
+
_getSettingIconStyle(t) {
|
|
1572
|
+
let e = "";
|
|
1573
|
+
switch (t) {
|
|
1574
|
+
case "primary":
|
|
1575
|
+
e = "cdx-alert-primary";
|
|
1576
|
+
break;
|
|
1577
|
+
case "secondary":
|
|
1578
|
+
e = "cdx-alert-secondary";
|
|
1579
|
+
break;
|
|
1580
|
+
case "info":
|
|
1581
|
+
e = "cdx-alert-info";
|
|
1582
|
+
break;
|
|
1583
|
+
case "success":
|
|
1584
|
+
e = "cdx-alert-success";
|
|
1585
|
+
break;
|
|
1586
|
+
case "warning":
|
|
1587
|
+
e = "cdx-alert-warning";
|
|
1588
|
+
break;
|
|
1589
|
+
case "danger":
|
|
1590
|
+
e = "cdx-alert-danger";
|
|
1591
|
+
break;
|
|
1592
|
+
case "light":
|
|
1593
|
+
e = "cdx-alert-light";
|
|
1594
|
+
break;
|
|
1595
|
+
case "dark":
|
|
1596
|
+
e = "cdx-alert-dark";
|
|
1597
|
+
}
|
|
1598
|
+
return this._make("div", ["cdx-alert_setting__icon", e], {});
|
|
1599
|
+
}
|
|
1600
|
+
renderSettings() {
|
|
1601
|
+
const t = document.createElement("div"), e = document.createElement("div"), i = document.createElement("div");
|
|
1602
|
+
return e.classList.add("cdx-alert_setting__icon_wrapper"), i.classList.add("cdx-alert_setting__icon_wrapper"), i.classList.add("cdx-alert_setting__icon_wrapper_align"), this.alertTypes.map((s) => {
|
|
1603
|
+
let n = this._getSettingIconStyle(s);
|
|
1604
|
+
return n.setAttribute("data-type", s), this.api.tooltip.onHover(n, this.api.i18n.t(`alert-${s}`), { placement: "top" }), n.innerText = "A", e.appendChild(n), n;
|
|
1605
|
+
}).forEach((s, n, r) => {
|
|
1606
|
+
const o = s.getAttribute("data-type");
|
|
1607
|
+
s.addEventListener("click", () => {
|
|
1608
|
+
this._changeAlertType(o), r.forEach((a, h) => {
|
|
1609
|
+
const l = a.getAttribute("data-type");
|
|
1610
|
+
a.classList.toggle("cdx-alert_setting__icon_active", l === this.data.type);
|
|
1611
|
+
});
|
|
1612
|
+
});
|
|
1613
|
+
}), M.ALIGN_TYPES.map((s) => {
|
|
1614
|
+
let n;
|
|
1615
|
+
return s === "left" && (n = document.createElement("div"), n.classList.add("cdx-alert_setting__icon"), n.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M17 7L5 7"/><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M17 17H5"/><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M13 12L5 12"/></svg>'), s === "right" && (n = document.createElement("div"), n.classList.add("cdx-alert_setting__icon"), n.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M19 7L7 7"/><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M19 17H7"/><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M19 12L11 12"/></svg>'), s === "center" && (n = document.createElement("div"), n.classList.add("cdx-alert_setting__icon"), n.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M18 7L6 7"/><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M18 17H6"/><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M16 12L8 12"/></svg>'), n == null || n.setAttribute("data-align", s), this.api.tooltip.onHover(n, this.api.i18n.t(`align-${s}`), { placement: "top" }), i.appendChild(n), n;
|
|
1616
|
+
}).forEach((s, n, r) => {
|
|
1617
|
+
const o = s.getAttribute("data-align");
|
|
1618
|
+
s.addEventListener("click", () => {
|
|
1619
|
+
this._changeAlignType(o), r.forEach((a, h) => {
|
|
1620
|
+
const l = a == null ? void 0 : a.getAttribute("data-align");
|
|
1621
|
+
a == null || a.classList.toggle("cdx-alert_setting__icon_active", l === this.data.align);
|
|
1622
|
+
});
|
|
1623
|
+
});
|
|
1624
|
+
}), t.appendChild(e), t.appendChild(i), t;
|
|
1625
|
+
}
|
|
1626
|
+
_getFormattedName(t) {
|
|
1627
|
+
return this.api.i18n.t(t.charAt(0).toUpperCase() + t.slice(1));
|
|
1628
|
+
}
|
|
1629
|
+
_changeAlertType(t) {
|
|
1630
|
+
this.data.type = t, this.alertTypes.forEach((e) => {
|
|
1631
|
+
const i = this.CSS.wrapperForType(e);
|
|
1632
|
+
this.container.classList.remove(i), t === e && this.container.classList.add(i);
|
|
1633
|
+
});
|
|
1634
|
+
}
|
|
1635
|
+
_changeAlignType(t) {
|
|
1636
|
+
this.data.align = t, M.ALIGN_TYPES.forEach((e) => {
|
|
1637
|
+
const i = this.CSS.wrapperForAlignType(e);
|
|
1638
|
+
this.container.classList.remove(i), t === e && this.container.classList.add(i);
|
|
1639
|
+
});
|
|
1640
|
+
}
|
|
1641
|
+
save(t) {
|
|
1642
|
+
const e = t.querySelector(`.${this.CSS.message}`);
|
|
1643
|
+
return { ...this.data, message: e.innerHTML };
|
|
1644
|
+
}
|
|
1645
|
+
_make(t, e = null, i = {}) {
|
|
1646
|
+
let s = document.createElement(t);
|
|
1647
|
+
Array.isArray(e) ? s.classList.add(...e) : e && s.classList.add(e);
|
|
1648
|
+
for (let n in i) s[n] = i[n];
|
|
1649
|
+
return s;
|
|
1650
|
+
}
|
|
1651
|
+
onPaste(t) {
|
|
1652
|
+
const { data: e } = t.detail;
|
|
1653
|
+
this.data = { type: this.defaultType, message: e.innerHTML || "" };
|
|
1654
|
+
}
|
|
1655
|
+
static get conversionConfig() {
|
|
1656
|
+
return { export: (t) => t.message, import: (t) => ({ message: t, type: this.DEFAULT_TYPE, alignType: this.DEFAULT_ALIGN_TYPE }) };
|
|
1657
|
+
}
|
|
1658
|
+
static get sanitize() {
|
|
1659
|
+
return { message: !0, type: !1, alignType: !1 };
|
|
1660
|
+
}
|
|
1661
|
+
}
|
|
1662
|
+
const pt = '<svg t="1763708081701" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2604" width="24" height="24"><path d="M469.3330000000001 725.333H896V640H469.3330000000001v85.333zM128 512l170.667 170.667V341.3330000000001L128 512z m0 384h768v-85.333H128V896z m0-768v85.333h768V128H128z m341.333 256H896v-85.333H469.3330000000001V384z m0 170.667H896v-85.334H469.3330000000001v85.334z" p-id="2605" fill="#000000"></path></svg>', gt = '<svg t="1763708124227" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2788" width="24" height="24"><path d="M128 896h768v-85.333H128V896z m0-554.667v341.334L298.667 512 128 341.333z m341.333 384H896V640H469.333v85.333zM128 128v85.333h768V128H128z m341.333 256H896v-85.333H469.333V384z m0 170.667H896v-85.334H469.333v85.334z" p-id="2789" fill="#000000"></path></svg>', mt = { orientation: !1 }, f = class f {
|
|
1663
|
+
constructor({ api: t, data: e, config: i, block: s, ...n }) {
|
|
1664
|
+
var o, a, h, l, c, u;
|
|
1665
|
+
this.wrapper = document.createElement("div"), this.DEFAULT_INDENT_KEY = "Tab", this.lastResizeTimeout = null, this.cachedMaxWidthForContent = null, this.api = t, this.block = s, !i && "settings" in n && (i = (o = n.settings) != null ? o : {}), this.config = { indentSize: 24, maxIndent: 8, minIndent: 0, multiblock: !1, autoIndent: !1, tuneName: null, orientation: "horizontal", customBlockIndentLimits: {}, handleShortcut: void 0, direction: "ltr", directionChangeHandler: null, version: "2.30", ...i != null ? i : {} }, this.changeConfigBasedOnVersionIfNeeded(), (a = this.config) != null && a.directionChangeHandler && this.config.directionChangeHandler(this.alignmentChangeListener.bind(this));
|
|
1666
|
+
const r = (u = (c = this.config.customBlockIndentLimits[(l = (h = this.block) == null ? void 0 : h.name) != null ? l : ""]) == null ? void 0 : c.min) != null ? u : this.config.minIndent;
|
|
1667
|
+
this.data = { indentLevel: r, ...e != null ? e : {} }, this.config.multiblock && this.config.tuneName, window.addEventListener("resize", (p) => this.onResize.call(this, p)), this.api.events.on("block changed", ({ event: p }) => {
|
|
1668
|
+
var L;
|
|
1669
|
+
const g = p.detail.target.id;
|
|
1670
|
+
((L = this.block) == null ? void 0 : L.id) === g && this.shouldApplyAutoIndent && queueMicrotask(() => this.autoIndentBlock());
|
|
1671
|
+
});
|
|
1672
|
+
}
|
|
1673
|
+
static get isTune() {
|
|
1674
|
+
return !0;
|
|
1675
|
+
}
|
|
1676
|
+
prepare() {
|
|
1677
|
+
}
|
|
1678
|
+
reset() {
|
|
1679
|
+
}
|
|
1680
|
+
render() {
|
|
1681
|
+
var r, o;
|
|
1682
|
+
const t = () => {
|
|
1683
|
+
if (this.data.indentLevel == this.maxIndent) {
|
|
1684
|
+
const a = this.getTuneButton("indent");
|
|
1685
|
+
if (a == null || a.classList.add(this.CSS.disabledItem), !a) return !0;
|
|
1686
|
+
}
|
|
1687
|
+
if (this.data.indentLevel == this.minIndent) {
|
|
1688
|
+
const a = this.getTuneButton("unindent");
|
|
1689
|
+
if (a == null || a.classList.add(this.CSS.disabledItem), !a) return !0;
|
|
1690
|
+
}
|
|
1691
|
+
};
|
|
1692
|
+
if (queueMicrotask(() => {
|
|
1693
|
+
t() && setTimeout(t, 300);
|
|
1694
|
+
}), this.config.orientation === "vertical") {
|
|
1695
|
+
const a = `${this.TuneNames.indentLeft}-${(r = this.block) == null ? void 0 : r.id}`, h = `${this.TuneNames.indentRight}-${(o = this.block) == null ? void 0 : o.id}`;
|
|
1696
|
+
return [{ title: this.rightText, hint: { title: this.api.i18n.t(this.rightText) }, onActivate: (l, c) => {
|
|
1697
|
+
this.handleIndentRight(), l.title = this.rightText;
|
|
1698
|
+
}, icon: gt, name: h }, { title: this.leftText, hint: { title: this.api.i18n.t(this.leftText) }, onActivate: (l, c) => {
|
|
1699
|
+
this.handleIndentLeft(), l.title = this.leftText;
|
|
1700
|
+
}, icon: pt, name: a }];
|
|
1701
|
+
}
|
|
1702
|
+
const e = `
|
|
1703
|
+
<div class="${this.CSS.popoverItem} ${this.CSS.customPopoverItem}" data-item-name='indent' version=${this.config.version}>
|
|
1704
|
+
<button type="button" class="${this.CSS.popoverItemIcon}" data-${this.TuneNames.indentLeft}>${pt}</button>
|
|
1705
|
+
<span class="${this.CSS.popoverItemTitle}">${this.api.sanitizer.clean(this.api.i18n.t("Indent"), {})}</span>
|
|
1706
|
+
<button type="button" class="${this.CSS.popoverItemIcon}" data-${this.TuneNames.indentRight} style="margin-left:10px;">${gt}</button>
|
|
1707
|
+
</div>
|
|
1708
|
+
`, i = this.createElementFromTemplate(e), s = i.querySelector(`[data-${this.TuneNames.indentRight}]`), n = i.querySelector(`[data-${this.TuneNames.indentLeft}]`);
|
|
1709
|
+
return s && (s.addEventListener("click", () => this.handleIndentRight()), this.api.tooltip.onHover(s, this.api.i18n.t("Indent right"), { placement: "top" })), n && (n.addEventListener("click", () => this.handleIndentLeft()), this.api.tooltip.onHover(n, this.api.i18n.t("Indent left"), { placement: "top" })), i;
|
|
1710
|
+
}
|
|
1711
|
+
wrap(t) {
|
|
1712
|
+
var i, s, n, r, o;
|
|
1713
|
+
this.wrapper.appendChild(t), this.wrapper.setAttribute(f.DATA_WRAPPER_NAME, "");
|
|
1714
|
+
let e = !!this.config.highlightIndent;
|
|
1715
|
+
if ((i = this.config.highlightIndent) != null && i.tuneNames && !this.config.highlightIndent.tuneNames.includes((n = (s = this.block) == null ? void 0 : s.name) != null ? n : "") && (e = !1), e) {
|
|
1716
|
+
const a = this.createElementFromTemplate(`
|
|
1717
|
+
<div class="${(o = (r = this.config.highlightIndent) == null ? void 0 : r.className) != null ? o : ""} ${this.CSS.highlightIndent}">
|
|
1718
|
+
</div>
|
|
1719
|
+
`), h = t.classList.contains(this.EditorCSS.content) ? t : t.querySelector(`.${this.EditorCSS.content}`);
|
|
1720
|
+
h == null || h.appendChild(a);
|
|
1721
|
+
}
|
|
1722
|
+
return this.applyStylesToWrapper(this.wrapper, this.data.indentLevel), this.wrapper.addEventListener("keydown", (...a) => this.onKeyDown.apply(this, a), { capture: !0 }), this.wrapper.addEventListener("focus", (a) => this.onFocus.call(this, a), { capture: !0 }), this.wrapper.addEventListener("blur", (a) => this.onBlur.call(this, a), { capture: !0 }), this.wrapper;
|
|
1723
|
+
}
|
|
1724
|
+
save() {
|
|
1725
|
+
return this.data;
|
|
1726
|
+
}
|
|
1727
|
+
get CSS() {
|
|
1728
|
+
return { customPopoverItem: "ce-popover-indent-item", popoverItem: "ce-popover-item", popoverItemIcon: "ce-popover-item__icon", popoverItemTitle: "ce-popover-item__title", disabledItem: "ce-popover-item--disabled", highlightIndent: "ce-highlight-indent" };
|
|
1729
|
+
}
|
|
1730
|
+
get EditorCSS() {
|
|
1731
|
+
return { block: "ce-block", content: "ce-block__content", redactor: "codex-editor__redactor" };
|
|
1732
|
+
}
|
|
1733
|
+
get TuneNames() {
|
|
1734
|
+
return { indentLeft: "tune-indent-left", indentRight: "tune-indent-right" };
|
|
1735
|
+
}
|
|
1736
|
+
get customInterval() {
|
|
1737
|
+
var t, e, i;
|
|
1738
|
+
return (i = this.config.customBlockIndentLimits[(e = (t = this.block) == null ? void 0 : t.name) != null ? e : ""]) != null ? i : {};
|
|
1739
|
+
}
|
|
1740
|
+
get maxIndent() {
|
|
1741
|
+
var t;
|
|
1742
|
+
return (t = this.customInterval.max) != null ? t : this.config.maxIndent;
|
|
1743
|
+
}
|
|
1744
|
+
get minIndent() {
|
|
1745
|
+
var t;
|
|
1746
|
+
return (t = this.customInterval.min) != null ? t : this.config.minIndent;
|
|
1747
|
+
}
|
|
1748
|
+
get isDirectionInverted() {
|
|
1749
|
+
return this.config.direction !== "ltr";
|
|
1750
|
+
}
|
|
1751
|
+
get rightText() {
|
|
1752
|
+
return this.api.i18n.t(this.isDirectionInverted ? "Un Indent" : "Indent");
|
|
1753
|
+
}
|
|
1754
|
+
get leftText() {
|
|
1755
|
+
return this.api.i18n.t(this.isDirectionInverted ? "Indent" : "Un Indent");
|
|
1756
|
+
}
|
|
1757
|
+
get shouldApplyAutoIndent() {
|
|
1758
|
+
var s;
|
|
1759
|
+
if (!this.config.autoIndent) return !1;
|
|
1760
|
+
if (typeof this.config.autoIndent == "boolean") return this.config.autoIndent;
|
|
1761
|
+
const t = this.api.blocks.getCurrentBlockIndex();
|
|
1762
|
+
if (t < 0) return !1;
|
|
1763
|
+
const e = this.api.blocks.getBlockByIndex(t);
|
|
1764
|
+
if (!e) return !1;
|
|
1765
|
+
const i = e.name;
|
|
1766
|
+
return !((s = this.config.autoIndent.tuneNames) != null && s.length) || this.config.autoIndent.tuneNames.includes(i);
|
|
1767
|
+
}
|
|
1768
|
+
handlePropagationForKeyEvent(t) {
|
|
1769
|
+
var r, o, a;
|
|
1770
|
+
if (!((r = this.block) != null && r.id) || this.config.handleShortcut === !1) return null;
|
|
1771
|
+
const e = t.key == this.DEFAULT_INDENT_KEY, i = typeof this.config.handleShortcut == "function";
|
|
1772
|
+
if (!i && !e) return null;
|
|
1773
|
+
const s = (a = (o = this.config).handleShortcut) == null ? void 0 : a.call(o, t, this.block.id);
|
|
1774
|
+
if (!s && i) return null;
|
|
1775
|
+
let n;
|
|
1776
|
+
switch (s) {
|
|
1777
|
+
case "indent":
|
|
1778
|
+
n = !0;
|
|
1779
|
+
break;
|
|
1780
|
+
case "unindent":
|
|
1781
|
+
n = !1;
|
|
1782
|
+
break;
|
|
1783
|
+
default:
|
|
1784
|
+
if (!e) return null;
|
|
1785
|
+
n = !t.shiftKey;
|
|
1786
|
+
}
|
|
1787
|
+
return t.stopPropagation(), t.preventDefault(), { isIndent: n };
|
|
1788
|
+
}
|
|
1789
|
+
onKeyDown(t) {
|
|
1790
|
+
var n, r, o;
|
|
1791
|
+
if (!((n = this.block) != null && n.id)) return;
|
|
1792
|
+
const e = this.handlePropagationForKeyEvent(t);
|
|
1793
|
+
if (!e) return;
|
|
1794
|
+
const { isIndent: i } = e;
|
|
1795
|
+
this.api.inlineToolbar.close();
|
|
1796
|
+
const s = this.getGlobalSelectedBlocks();
|
|
1797
|
+
if (!this.config.multiblock || s.length < 2) return i ? this.indentBlock() : this.unIndentBlock(), void ((o = (r = this.block).dispatchChange) == null ? void 0 : o.call(r));
|
|
1798
|
+
this.config.tuneName && s.forEach(async (a) => {
|
|
1799
|
+
var u, p, g, b;
|
|
1800
|
+
const h = await a.save();
|
|
1801
|
+
if (!h || !("tunes" in h) || typeof h.tunes != "object" || !h.tunes) return;
|
|
1802
|
+
const l = h.tunes[(u = this.config.tuneName) != null ? u : ""];
|
|
1803
|
+
if (!l) return;
|
|
1804
|
+
l.indentLevel = i ? Math.min(this.config.maxIndent, ((p = l.indentLevel) != null ? p : 0) + 1) : Math.max(0, ((g = l.indentLevel) != null ? g : 0) - 1), (b = a.dispatchChange) == null || b.call(a);
|
|
1805
|
+
const c = this.getWrapperBlockById(a.id);
|
|
1806
|
+
c instanceof HTMLElement && this.applyStylesToWrapper(c, l.indentLevel);
|
|
1807
|
+
});
|
|
1808
|
+
}
|
|
1809
|
+
handleIndentLeft() {
|
|
1810
|
+
var t, e;
|
|
1811
|
+
this.isDirectionInverted ? this.indentBlock() : this.unIndentBlock(), (e = (t = this.block) == null ? void 0 : t.dispatchChange) == null || e.call(t);
|
|
1812
|
+
}
|
|
1813
|
+
handleIndentRight() {
|
|
1814
|
+
var t, e;
|
|
1815
|
+
this.isDirectionInverted ? this.unIndentBlock() : this.indentBlock(), (e = (t = this.block) == null ? void 0 : t.dispatchChange) == null || e.call(t);
|
|
1816
|
+
}
|
|
1817
|
+
indentBlock() {
|
|
1818
|
+
this.wrapper && (this.data.indentLevel = Math.min(this.data.indentLevel + 1, this.maxIndent), this.applyStylesToWrapper(this.wrapper, this.data.indentLevel), this.toggleDisableStateForButtons());
|
|
1819
|
+
}
|
|
1820
|
+
unIndentBlock() {
|
|
1821
|
+
this.wrapper && (this.data.indentLevel = Math.max(this.data.indentLevel - 1, this.minIndent), this.applyStylesToWrapper(this.wrapper, this.data.indentLevel), this.toggleDisableStateForButtons());
|
|
1822
|
+
}
|
|
1823
|
+
autoIndentBlock() {
|
|
1824
|
+
var r, o;
|
|
1825
|
+
const t = this.api.blocks.getBlockIndex(this.block.id), e = this.api.blocks.getBlockByIndex(t - 1);
|
|
1826
|
+
if (!e) return;
|
|
1827
|
+
const i = (o = (r = e.holder) == null ? void 0 : r.querySelector(`[${f.DATA_WRAPPER_NAME}]`)) == null ? void 0 : o.getAttribute(f.DATA_INDENT_LEVEL), s = Number(i != null ? i : 0), n = Math.min(Math.max(s, this.minIndent), this.maxIndent);
|
|
1828
|
+
this.data.indentLevel = n, this.applyStylesToWrapper(this.wrapper, this.data.indentLevel);
|
|
1829
|
+
}
|
|
1830
|
+
toggleDisableStateForButtons() {
|
|
1831
|
+
var t, e, i, s;
|
|
1832
|
+
this.data.indentLevel === this.minIndent ? (t = this.getTuneButton("unindent")) == null || t.classList.add(this.CSS.disabledItem) : (e = this.getTuneButton("unindent")) == null || e.classList.remove(this.CSS.disabledItem), this.data.indentLevel === this.maxIndent ? (i = this.getTuneButton("indent")) == null || i.classList.add(this.CSS.disabledItem) : (s = this.getTuneButton("indent")) == null || s.classList.remove(this.CSS.disabledItem);
|
|
1833
|
+
}
|
|
1834
|
+
getTuneButton(t) {
|
|
1835
|
+
var i;
|
|
1836
|
+
let e = t === "indent" ? "indentRight" : "indentLeft";
|
|
1837
|
+
return this.isDirectionInverted && (e = t == "indent" ? "indentLeft" : "indentRight"), this.config.orientation === "vertical" ? this.getTuneByName(`${this.TuneNames[e]}-${(i = this.block) == null ? void 0 : i.id}`) : document.querySelector(`.${this.CSS.popoverItemIcon}[data-${this.TuneNames[e]}]`);
|
|
1838
|
+
}
|
|
1839
|
+
getTuneByName(t) {
|
|
1840
|
+
return document.querySelector(`.${this.CSS.popoverItem}[data-item-name="${t}"]`);
|
|
1841
|
+
}
|
|
1842
|
+
getTuneTitleByName(t) {
|
|
1843
|
+
var e;
|
|
1844
|
+
return (e = this.getTuneByName(t)) == null ? void 0 : e.querySelector(`.${this.CSS.popoverItemTitle}`);
|
|
1845
|
+
}
|
|
1846
|
+
applyStylesToWrapper(t, e = parseInt(t.getAttribute(f.DATA_INDENT_LEVEL) || "0")) {
|
|
1847
|
+
const i = e * this.config.indentSize;
|
|
1848
|
+
t.setAttribute(f.DATA_INDENT_LEVEL, e.toString());
|
|
1849
|
+
const s = t.querySelector(`.${this.EditorCSS.content}`), n = this.getBlockForWrapper(t) || document.querySelector(`.${this.EditorCSS.redactor}`);
|
|
1850
|
+
if (!(s instanceof HTMLElement && n)) return;
|
|
1851
|
+
const r = n.getBoundingClientRect().width;
|
|
1852
|
+
if (r === 0) return void queueMicrotask(() => this.applyStylesToWrapper.bind(this)(t, e));
|
|
1853
|
+
const o = (r - this.maxWidthForContent(t)) / 2, a = Math.max(0, Math.min(o, i)), h = 2 * a + "px", l = `${a}px`;
|
|
1854
|
+
this.isDirectionInverted ? (t.style.paddingLeft = "0px", t.style.paddingRight = h) : (t.style.paddingLeft = h, t.style.paddingRight = "0px");
|
|
1855
|
+
const c = t.querySelector(`.${this.CSS.highlightIndent}`);
|
|
1856
|
+
c instanceof HTMLElement && (this.isDirectionInverted ? (c.style.width = l, c.style.left = "100%", c.style.right = "") : (c.style.width = l, c.style.left = "", c.style.right = "100%"));
|
|
1857
|
+
}
|
|
1858
|
+
onFocus(t) {
|
|
1859
|
+
t.target instanceof HTMLElement && this.wrapper.contains(t.target) && this.wrapper.setAttribute(f.DATA_FOCUSED, "");
|
|
1860
|
+
}
|
|
1861
|
+
onBlur(t) {
|
|
1862
|
+
t.target instanceof HTMLElement && this.wrapper.contains(t.target) && this.wrapper.removeAttribute(f.DATA_FOCUSED);
|
|
1863
|
+
}
|
|
1864
|
+
onResize(t) {
|
|
1865
|
+
this.lastResizeTimeout && clearTimeout(this.lastResizeTimeout), this.lastResizeTimeout = setTimeout(() => {
|
|
1866
|
+
document.querySelectorAll(`[${f.DATA_WRAPPER_NAME}]`).forEach((e) => {
|
|
1867
|
+
e instanceof HTMLElement && this.applyStylesToWrapper(e);
|
|
1868
|
+
});
|
|
1869
|
+
}, 500);
|
|
1870
|
+
}
|
|
1871
|
+
getGlobalSelectedBlocks() {
|
|
1872
|
+
return new Array(this.api.blocks.getBlocksCount()).fill(0).map((t, e) => this.api.blocks.getBlockByIndex(e)).filter((t) => !!(t != null && t.selected));
|
|
1873
|
+
}
|
|
1874
|
+
getWrapperBlockById(t) {
|
|
1875
|
+
var i, s, n;
|
|
1876
|
+
const e = `.${this.EditorCSS.block}[data-id="${t}"] [${f.DATA_WRAPPER_NAME}]`;
|
|
1877
|
+
return (n = (s = document.querySelector(e)) != null ? s : (i = this.api.blocks.getById(t)) == null ? void 0 : i.holder.querySelector(`[${f.DATA_WRAPPER_NAME}]`)) != null ? n : null;
|
|
1878
|
+
}
|
|
1879
|
+
getBlockForWrapper(t) {
|
|
1880
|
+
let e = t;
|
|
1881
|
+
for (; !e.classList.contains(this.EditorCSS.block); ) {
|
|
1882
|
+
if (!e.parentElement || e instanceof HTMLHtmlElement) return null;
|
|
1883
|
+
e = e.parentElement;
|
|
1884
|
+
}
|
|
1885
|
+
return e;
|
|
1886
|
+
}
|
|
1887
|
+
alignmentChangeListener(t, e) {
|
|
1888
|
+
var i, s, n;
|
|
1889
|
+
if (t === ((i = this.block) == null ? void 0 : i.id) && e !== this.config.direction && (this.config.direction = e, this.applyStylesToWrapper(this.wrapper, this.data.indentLevel), this.toggleDisableStateForButtons(), this.config.orientation === "vertical")) {
|
|
1890
|
+
const r = this.getTuneTitleByName(`${this.TuneNames.indentRight}-${(s = this.block) == null ? void 0 : s.id}`);
|
|
1891
|
+
r && (r.textContent = this.rightText);
|
|
1892
|
+
const o = this.getTuneTitleByName(`${this.TuneNames.indentLeft}-${(n = this.block) == null ? void 0 : n.id}`);
|
|
1893
|
+
o && (o.textContent = this.leftText);
|
|
1894
|
+
}
|
|
1895
|
+
}
|
|
1896
|
+
createElementFromTemplate(t) {
|
|
1897
|
+
return new DOMParser().parseFromString(t, "text/html").body.firstChild;
|
|
1898
|
+
}
|
|
1899
|
+
changeConfigBasedOnVersionIfNeeded() {
|
|
1900
|
+
this.config.version && this.config.version < "2.27" && this.config.orientation === "vertical" && (this.config.orientation = "horizontal", mt.orientation, mt.orientation = !0);
|
|
1901
|
+
}
|
|
1902
|
+
maxWidthForContent(t) {
|
|
1903
|
+
const e = t.querySelector(`.${this.EditorCSS.content}`);
|
|
1904
|
+
if (e instanceof HTMLElement) {
|
|
1905
|
+
const { maxWidth: i } = window.getComputedStyle(e);
|
|
1906
|
+
if (i) return this.cachedMaxWidthForContent = parseInt(i), this.cachedMaxWidthForContent;
|
|
1907
|
+
}
|
|
1908
|
+
return this.cachedMaxWidthForContent !== null || (this.cachedMaxWidthForContent = 650), this.cachedMaxWidthForContent;
|
|
1909
|
+
}
|
|
1910
|
+
};
|
|
1911
|
+
f.DATA_WRAPPER_NAME = "data-block-indent-wrapper", f.DATA_FOCUSED = "data-focused", f.DATA_INDENT_LEVEL = "data-indent-level";
|
|
1912
|
+
let tt = f;
|
|
1913
|
+
class N {
|
|
1914
|
+
static get CSS() {
|
|
1915
|
+
return "cdx-marker";
|
|
1916
|
+
}
|
|
1917
|
+
constructor({ api: t }) {
|
|
1918
|
+
this.api = t, this.button = null, this.tag = "MARK", this.iconClasses = { base: this.api.styles.inlineToolButton, active: this.api.styles.inlineToolButtonActive };
|
|
1919
|
+
}
|
|
1920
|
+
static get isInline() {
|
|
1921
|
+
return !0;
|
|
1922
|
+
}
|
|
1923
|
+
render() {
|
|
1924
|
+
return this.button = document.createElement("button"), this.button.type = "button", this.button.classList.add(this.iconClasses.base), this.button.innerHTML = this.toolboxIcon, this.button;
|
|
1925
|
+
}
|
|
1926
|
+
surround(t) {
|
|
1927
|
+
if (!t) return;
|
|
1928
|
+
let e = this.api.selection.findParentTag(this.tag, N.CSS);
|
|
1929
|
+
e ? this.unwrap(e) : this.wrap(t);
|
|
1930
|
+
}
|
|
1931
|
+
wrap(t) {
|
|
1932
|
+
let e = document.createElement(this.tag);
|
|
1933
|
+
e.classList.add(N.CSS), e.appendChild(t.extractContents()), t.insertNode(e), this.api.selection.expandToTag(e);
|
|
1934
|
+
}
|
|
1935
|
+
unwrap(t) {
|
|
1936
|
+
this.api.selection.expandToTag(t);
|
|
1937
|
+
let e = window.getSelection(), i = e.getRangeAt(0), s = i.extractContents();
|
|
1938
|
+
t.parentNode.removeChild(t), i.insertNode(s), e.removeAllRanges(), e.addRange(i);
|
|
1939
|
+
}
|
|
1940
|
+
checkState() {
|
|
1941
|
+
const t = this.api.selection.findParentTag(this.tag, N.CSS);
|
|
1942
|
+
this.button.classList.toggle(this.iconClasses.active, !!t);
|
|
1943
|
+
}
|
|
1944
|
+
get toolboxIcon() {
|
|
1945
|
+
return '<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.3535 9.31802L12.7678 7.90381C13.5488 7.12276 14.8151 7.12276 15.5962 7.90381C16.3772 8.68486 16.3772 9.95119 15.5962 10.7322L14.182 12.1464M11.3535 9.31802L7.96729 12.7043C7.40889 13.2627 7.02826 13.9739 6.87339 14.7482L6.69798 15.6253C6.55803 16.325 7.17495 16.942 7.87467 16.802L8.75175 16.6266C9.52612 16.4717 10.2373 16.0911 10.7957 15.5327L14.182 12.1464M11.3535 9.31802L14.182 12.1464" stroke="black" stroke-width="2"/><line x1="15" y1="17" x2="19" y2="17" stroke="black" stroke-width="2" stroke-linecap="round"/></svg>';
|
|
1946
|
+
}
|
|
1947
|
+
static get sanitize() {
|
|
1948
|
+
return { mark: { class: N.CSS } };
|
|
1949
|
+
}
|
|
1950
|
+
}
|
|
1951
|
+
class re {
|
|
1952
|
+
constructor(t) {
|
|
1953
|
+
this.tag = "SPAN", this.class = "cdx-text-color", this.defaultColor = "#2644FF", this.lastRange = null, this.colors = ["#182a4e", "#0055cc", "#1f6a83", "#206e4e", "#e56910", "#ae2e24", "#5e4db2", "#758195", "#1e7afd", "#2998bd", "#23a06b", "#fea363", "#c9372c", "#8270db"], this.columns = 7;
|
|
1954
|
+
const { api: e, config: i } = t;
|
|
1955
|
+
this.api = e, i.colors && (this.colors = i.colors), i.columns && (this.columns = i.columns);
|
|
1956
|
+
}
|
|
1957
|
+
static get title() {
|
|
1958
|
+
return "Color";
|
|
1959
|
+
}
|
|
1960
|
+
static get isInline() {
|
|
1961
|
+
return !0;
|
|
1962
|
+
}
|
|
1963
|
+
render() {
|
|
1964
|
+
const t = document.createElement("button");
|
|
1965
|
+
return t.type = "button", t.innerHTML = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.24296 11.4075C5.23167 10.6253 5.52446 9.8395 6.12132 9.24264L9.65686 5.70711C10.0474 5.31658 10.6809 5.31693 11.0714 5.70745L16.0205 10.6565C16.2268 10.8629 16.3243 11.1371 16.3126 11.4075M5.24296 11.4075C5.25382 12.1607 5.54661 12.9106 6.12132 13.4853L8 15.364M5.24296 11.4075H11.9565M16.3126 11.4075C16.3022 11.6487 16.205 11.8869 16.0208 12.0711L12.4853 15.6066C11.3137 16.7782 9.41421 16.7782 8.24264 15.6066L8 15.364M16.3126 11.4075H11.9565M8 15.364L11.9565 11.4075" stroke="black" stroke-width="2"/>
|
|
1966
|
+
<path d="M20 17.4615C20 18.3112 19.3284 19 18.5 19C17.6716 19 17 18.3112 17 17.4615C17 16.6119 17.9 15.6154 18.5 15C19.1 15.6154 20 16.6119 20 17.4615Z" stroke="black" stroke-width="2"/></svg>`, t.classList.add(this.api.styles.inlineToolButton), t.addEventListener("mousedown", (e) => {
|
|
1967
|
+
e.preventDefault();
|
|
1968
|
+
}), t;
|
|
1969
|
+
}
|
|
1970
|
+
surround(t) {
|
|
1971
|
+
this.lastRange = t;
|
|
1972
|
+
}
|
|
1973
|
+
wrapAndColor(t, e) {
|
|
1974
|
+
if (!t) return;
|
|
1975
|
+
const i = t.extractContents(), s = document.createElement(this.tag);
|
|
1976
|
+
s.classList.add(this.class), s.appendChild(i), s.style.color = e, s.innerHTML = s.textContent || "", t.insertNode(s), this.api.selection.expandToTag(s);
|
|
1977
|
+
}
|
|
1978
|
+
renderActions() {
|
|
1979
|
+
const t = document.createElement("div");
|
|
1980
|
+
return t.classList.add("editorjs__color-selector-container"), t.style.gridTemplateColumns = `repeat(${this.columns}, 1fr)`, this.colors.forEach((e) => {
|
|
1981
|
+
const i = document.createElement("div");
|
|
1982
|
+
i.classList.add("editorjs__color-selector__container-item"), i.style.backgroundColor = e, i.onclick = () => {
|
|
1983
|
+
this.wrapAndColor(this.lastRange, e);
|
|
1984
|
+
}, t.append(i);
|
|
1985
|
+
}), t;
|
|
1986
|
+
}
|
|
1987
|
+
static get sanitize() {
|
|
1988
|
+
return { span: { style: { color: !0 } } };
|
|
1989
|
+
}
|
|
1990
|
+
}
|
|
1991
|
+
class oe extends re {
|
|
1992
|
+
static get sanitize() {
|
|
1993
|
+
}
|
|
1994
|
+
}
|
|
1995
|
+
const D = class D {
|
|
1996
|
+
constructor(t) {
|
|
1997
|
+
this.tag = "U", this.api = t.api, this.iconClasses = { base: this.api.styles.inlineToolButton, active: this.api.styles.inlineToolButtonActive };
|
|
1998
|
+
}
|
|
1999
|
+
static get CSS() {
|
|
2000
|
+
return "cdx-underline";
|
|
2001
|
+
}
|
|
2002
|
+
render() {
|
|
2003
|
+
return this.button = document.createElement("button"), this.button.type = "button", this.button.classList.add(this.iconClasses.base), this.button.innerHTML = this.toolboxIcon, this.button;
|
|
2004
|
+
}
|
|
2005
|
+
surround(t) {
|
|
2006
|
+
if (!t) return;
|
|
2007
|
+
const e = this.api.selection.findParentTag(this.tag, D.CSS);
|
|
2008
|
+
e ? this.unwrap(e) : this.wrap(t);
|
|
2009
|
+
}
|
|
2010
|
+
wrap(t) {
|
|
2011
|
+
const e = document.createElement(this.tag);
|
|
2012
|
+
e.classList.add(D.CSS), e.appendChild(t.extractContents()), t.insertNode(e), this.api.selection.expandToTag(e);
|
|
2013
|
+
}
|
|
2014
|
+
unwrap(t) {
|
|
2015
|
+
var n;
|
|
2016
|
+
this.api.selection.expandToTag(t);
|
|
2017
|
+
const e = window.getSelection();
|
|
2018
|
+
if (!e) return;
|
|
2019
|
+
const i = e.getRangeAt(0);
|
|
2020
|
+
if (!i) return;
|
|
2021
|
+
const s = i.extractContents();
|
|
2022
|
+
s && ((n = t.parentNode) == null || n.removeChild(t), i.insertNode(s), e.removeAllRanges(), e.addRange(i));
|
|
2023
|
+
}
|
|
2024
|
+
checkState() {
|
|
2025
|
+
var e;
|
|
2026
|
+
const t = this.api.selection.findParentTag(this.tag, D.CSS);
|
|
2027
|
+
return (e = this.button) == null || e.classList.toggle(this.iconClasses.active, !!t), !!t;
|
|
2028
|
+
}
|
|
2029
|
+
get toolboxIcon() {
|
|
2030
|
+
return `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2031
|
+
<path d="M9 7.5V11.5C9 12.2956 9.31607 13.0587 9.87868 13.6213C10.4413 14.1839 11.2044 14.5 12 14.5C12.7956 14.5 13.5587 14.1839 14.1213 13.6213C14.6839 13.0587 15 12.2956 15 11.5V7.5" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
2032
|
+
<path d="M7.71429 18H16.2857" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
2033
|
+
</svg>`;
|
|
2034
|
+
}
|
|
2035
|
+
static get sanitize() {
|
|
2036
|
+
return { u: { class: D.CSS } };
|
|
2037
|
+
}
|
|
2038
|
+
};
|
|
2039
|
+
D.isInline = !0;
|
|
2040
|
+
let et = D;
|
|
2041
|
+
class $ {
|
|
2042
|
+
constructor({ api: t }) {
|
|
2043
|
+
this.tag = "CODE", this.api = t, this.button = null, this.iconClasses = { base: this.api.styles.inlineToolButton, active: this.api.styles.inlineToolButtonActive };
|
|
2044
|
+
}
|
|
2045
|
+
static get CSS() {
|
|
2046
|
+
return "inline-code";
|
|
2047
|
+
}
|
|
2048
|
+
static get isInline() {
|
|
2049
|
+
return !0;
|
|
2050
|
+
}
|
|
2051
|
+
render() {
|
|
2052
|
+
return this.button = document.createElement("button"), this.button.type = "button", this.button.classList.add(this.iconClasses.base), this.button.innerHTML = this.toolboxIcon, this.button;
|
|
2053
|
+
}
|
|
2054
|
+
surround(t) {
|
|
2055
|
+
var i;
|
|
2056
|
+
if (!t) return;
|
|
2057
|
+
let e = this.api.selection.findParentTag(this.tag, $.CSS);
|
|
2058
|
+
e ? this.unwrap(e) : (i = t.commonAncestorContainer.parentElement) != null && i.querySelector(this.tag) || this.wrap(t);
|
|
2059
|
+
}
|
|
2060
|
+
wrap(t) {
|
|
2061
|
+
let e = document.createElement(this.tag);
|
|
2062
|
+
e.classList.add($.CSS), e.appendChild(t.extractContents()), t.insertNode(e), this.api.selection.expandToTag(e);
|
|
2063
|
+
}
|
|
2064
|
+
unwrap(t) {
|
|
2065
|
+
var n;
|
|
2066
|
+
this.api.selection.expandToTag(t);
|
|
2067
|
+
const e = window.getSelection();
|
|
2068
|
+
if (!e) return;
|
|
2069
|
+
const i = e.getRangeAt(0), s = i.extractContents();
|
|
2070
|
+
(n = t.parentNode) == null || n.removeChild(t), i.insertNode(s), e.removeAllRanges(), e.addRange(i);
|
|
2071
|
+
}
|
|
2072
|
+
checkState() {
|
|
2073
|
+
const t = this.api.selection.findParentTag(this.tag, $.CSS);
|
|
2074
|
+
return this.button && this.button.classList.toggle(this.iconClasses.active, !!t), !!t;
|
|
2075
|
+
}
|
|
2076
|
+
get toolboxIcon() {
|
|
2077
|
+
return `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2078
|
+
<path d="M9 8L5 12L9 16" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
2079
|
+
<path d="M15 8L19 12L15 16" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
2080
|
+
</svg>
|
|
2081
|
+
`;
|
|
2082
|
+
}
|
|
2083
|
+
static get sanitize() {
|
|
2084
|
+
return { code: { class: $.CSS } };
|
|
2085
|
+
}
|
|
2086
|
+
}
|
|
2087
|
+
function y(d, t, e = {}) {
|
|
2088
|
+
const i = document.createElement(d);
|
|
2089
|
+
Array.isArray(t) ? i.classList.add(...t) : t && i.classList.add(t);
|
|
2090
|
+
for (const s in e) Object.prototype.hasOwnProperty.call(e, s) && (i[s] = e[s]);
|
|
2091
|
+
return i;
|
|
2092
|
+
}
|
|
2093
|
+
function vt(d) {
|
|
2094
|
+
const t = d.getBoundingClientRect();
|
|
2095
|
+
return { y1: Math.floor(t.top + window.pageYOffset), x1: Math.floor(t.left + window.pageXOffset), x2: Math.floor(t.right + window.pageXOffset), y2: Math.floor(t.bottom + window.pageYOffset) };
|
|
2096
|
+
}
|
|
2097
|
+
function K(d, t) {
|
|
2098
|
+
const e = vt(d), i = vt(t);
|
|
2099
|
+
return { fromTopBorder: i.y1 - e.y1, fromLeftBorder: i.x1 - e.x1, fromRightBorder: e.x2 - i.x2, fromBottomBorder: e.y2 - i.y2 };
|
|
2100
|
+
}
|
|
2101
|
+
function ft(d, t) {
|
|
2102
|
+
return t.parentNode.insertBefore(d, t);
|
|
2103
|
+
}
|
|
2104
|
+
function Ct(d, t = !0) {
|
|
2105
|
+
const e = document.createRange(), i = window.getSelection();
|
|
2106
|
+
e.selectNodeContents(d), e.collapse(t), i.removeAllRanges(), i.addRange(e);
|
|
2107
|
+
}
|
|
2108
|
+
class C {
|
|
2109
|
+
constructor({ items: t }) {
|
|
2110
|
+
this.items = t, this.wrapper = void 0, this.itemEls = [];
|
|
2111
|
+
}
|
|
2112
|
+
static get CSS() {
|
|
2113
|
+
return { popover: "tc-popover", popoverOpened: "tc-popover--opened", item: "tc-popover__item", itemHidden: "tc-popover__item--hidden", itemConfirmState: "tc-popover__item--confirm", itemIcon: "tc-popover__item-icon", itemLabel: "tc-popover__item-label" };
|
|
2114
|
+
}
|
|
2115
|
+
render() {
|
|
2116
|
+
return this.wrapper = y("div", C.CSS.popover), this.items.forEach((t, e) => {
|
|
2117
|
+
const i = y("div", C.CSS.item), s = y("div", C.CSS.itemIcon, { innerHTML: t.icon }), n = y("div", C.CSS.itemLabel, { textContent: t.label });
|
|
2118
|
+
i.dataset.index = e, i.appendChild(s), i.appendChild(n), this.wrapper.appendChild(i), this.itemEls.push(i);
|
|
2119
|
+
}), this.wrapper.addEventListener("click", (t) => {
|
|
2120
|
+
this.popoverClicked(t);
|
|
2121
|
+
}), this.wrapper;
|
|
2122
|
+
}
|
|
2123
|
+
popoverClicked(t) {
|
|
2124
|
+
const e = t.target.closest(`.${C.CSS.item}`);
|
|
2125
|
+
if (!e) return;
|
|
2126
|
+
const i = e.dataset.index, s = this.items[i];
|
|
2127
|
+
!s.confirmationRequired || this.hasConfirmationState(e) ? s.onClick() : this.setConfirmationState(e);
|
|
2128
|
+
}
|
|
2129
|
+
setConfirmationState(t) {
|
|
2130
|
+
t.classList.add(C.CSS.itemConfirmState);
|
|
2131
|
+
}
|
|
2132
|
+
clearConfirmationState(t) {
|
|
2133
|
+
t.classList.remove(C.CSS.itemConfirmState);
|
|
2134
|
+
}
|
|
2135
|
+
hasConfirmationState(t) {
|
|
2136
|
+
return t.classList.contains(C.CSS.itemConfirmState);
|
|
2137
|
+
}
|
|
2138
|
+
get opened() {
|
|
2139
|
+
return this.wrapper.classList.contains(C.CSS.popoverOpened);
|
|
2140
|
+
}
|
|
2141
|
+
open() {
|
|
2142
|
+
this.items.forEach((t, e) => {
|
|
2143
|
+
typeof t.hideIf == "function" && this.itemEls[e].classList.toggle(C.CSS.itemHidden, t.hideIf());
|
|
2144
|
+
}), this.wrapper.classList.add(C.CSS.popoverOpened);
|
|
2145
|
+
}
|
|
2146
|
+
close() {
|
|
2147
|
+
this.wrapper.classList.remove(C.CSS.popoverOpened), this.itemEls.forEach((t) => {
|
|
2148
|
+
this.clearConfirmationState(t);
|
|
2149
|
+
});
|
|
2150
|
+
}
|
|
2151
|
+
}
|
|
2152
|
+
const wt = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M8 8L12 12M12 12L16 16M12 12L16 8M12 12L8 16"/></svg>';
|
|
2153
|
+
class I {
|
|
2154
|
+
constructor({ api: t, items: e, onOpen: i, onClose: s, cssModifier: n = "" }) {
|
|
2155
|
+
this.api = t, this.items = e, this.onOpen = i, this.onClose = s, this.cssModifier = n, this.popover = null, this.wrapper = this.createToolbox();
|
|
2156
|
+
}
|
|
2157
|
+
static get CSS() {
|
|
2158
|
+
return { toolbox: "tc-toolbox", toolboxShowed: "tc-toolbox--showed", toggler: "tc-toolbox__toggler" };
|
|
2159
|
+
}
|
|
2160
|
+
get element() {
|
|
2161
|
+
return this.wrapper;
|
|
2162
|
+
}
|
|
2163
|
+
createToolbox() {
|
|
2164
|
+
const t = y("div", [I.CSS.toolbox, this.cssModifier ? `${I.CSS.toolbox}--${this.cssModifier}` : ""]);
|
|
2165
|
+
t.dataset.mutationFree = "true";
|
|
2166
|
+
const e = this.createPopover(), i = this.createToggler();
|
|
2167
|
+
return t.appendChild(i), t.appendChild(e), t;
|
|
2168
|
+
}
|
|
2169
|
+
createToggler() {
|
|
2170
|
+
const t = y("div", I.CSS.toggler, { innerHTML: '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-width="2.6" d="M9.41 9.66H9.4"/><path stroke="currentColor" stroke-linecap="round" stroke-width="2.6" d="M14.6 9.66H14.59"/><path stroke="currentColor" stroke-linecap="round" stroke-width="2.6" d="M9.31 14.36H9.3"/><path stroke="currentColor" stroke-linecap="round" stroke-width="2.6" d="M14.6 14.36H14.59"/></svg>' });
|
|
2171
|
+
return t.addEventListener("click", () => {
|
|
2172
|
+
this.togglerClicked();
|
|
2173
|
+
}), t;
|
|
2174
|
+
}
|
|
2175
|
+
createPopover() {
|
|
2176
|
+
return this.popover = new C({ items: this.items }), this.popover.render();
|
|
2177
|
+
}
|
|
2178
|
+
togglerClicked() {
|
|
2179
|
+
var t, e;
|
|
2180
|
+
(t = this.popover) != null && t.opened ? (this.popover.close(), this.onClose()) : ((e = this.popover) == null || e.open(), this.onOpen());
|
|
2181
|
+
}
|
|
2182
|
+
show(t) {
|
|
2183
|
+
const e = t();
|
|
2184
|
+
Object.entries(e).forEach(([i, s]) => {
|
|
2185
|
+
this.wrapper.style[i] = s;
|
|
2186
|
+
}), this.wrapper.classList.add(I.CSS.toolboxShowed);
|
|
2187
|
+
}
|
|
2188
|
+
hide() {
|
|
2189
|
+
var t;
|
|
2190
|
+
(t = this.popover) == null || t.close(), this.wrapper.classList.remove(I.CSS.toolboxShowed);
|
|
2191
|
+
}
|
|
2192
|
+
}
|
|
2193
|
+
const kt = "tc-wrap", ae = "tc-wrap--readonly", bt = "tc-table", B = "tc-row", yt = "tc-table--heading", X = "tc-row--selected", O = "tc-cell", J = "tc-cell--selected", Z = "tc-add-row", Lt = "tc-add-row--disabled", Q = "tc-add-column", St = "tc-add-column--disabled";
|
|
2194
|
+
class le {
|
|
2195
|
+
constructor(t, e, i, s) {
|
|
2196
|
+
this.minCellWidhth = 50, this.defaultCellWidth = 100, this.handleDocumentMousedown = (n) => {
|
|
2197
|
+
this.wrapper.contains(n.target) && n.target.classList.contains("cell-resizable") && (n.preventDefault(), this.isDragging = !0, this.table.classList.add("table-resizing"), document.addEventListener("mousemove", this.handleDocumentMousemove), document.addEventListener("mouseup", this.handleDocumentMouseup), this.draggingRow = this.hoveredRow, this.draggingColumn = this.hoveredColumn, this.draggingColArr = this.getCellInCol(this.draggingColumn), this.startWidth = this.colWidthArr[this.draggingColumn - 1], this.mouseStartX = n.clientX);
|
|
2198
|
+
}, this.handleDocumentMousemove = (n) => {
|
|
2199
|
+
if (!this.isDragging) return;
|
|
2200
|
+
const r = n.clientX - this.mouseStartX, o = Math.max(this.startWidth + r, this.minCellWidhth);
|
|
2201
|
+
this.colWidthArr[this.draggingColumn - 1] = o, this.updateColWidth();
|
|
2202
|
+
}, this.handleDocumentMouseup = (n) => {
|
|
2203
|
+
this.updateToolboxesPosition(), this.isDragging = !1, this.table.classList.remove("table-resizing"), document.removeEventListener("mousemove", this.handleDocumentMousemove), document.removeEventListener("mouseup", this.handleDocumentMouseup);
|
|
2204
|
+
}, this.readOnly = t, this.api = e, this.data = i, this.config = s, this.wrapper = null, this.table = null, this.hoveredCell = null, this.isDragging = !1, this.draggingColArr = [], this.draggingRow = 0, this.draggingColumn = 0, this.startWidth = 0, this.mouseStartX = 0, this.colWidthArr = [], this.focusedCell = { row: 0, col: 0 }, this.toolboxColumn = this.createColumnToolbox(), this.toolboxRow = this.createRowToolbox(), this.createTableWrapper(), this.hoveredRow = 0, this.hoveredColumn = 0, this.selectedRow = 0, this.selectedColumn = 0, this.tunes = { withHeadings: !1 }, this.resize(), this.data.colWidth.length > 0 && (this.colWidthArr = this.data.colWidth), this.updateColWidth(), this.fill(), this.focusedCell = { row: 0, column: 0 }, this.documentClicked = (n) => {
|
|
2205
|
+
const r = n.target.closest(`.${bt}`) !== null, o = n.target.closest(`.${kt}`) === null;
|
|
2206
|
+
(r || o) && this.hideToolboxes();
|
|
2207
|
+
const a = n.target.closest(`.${Z}`), h = n.target.closest(`.${Q}`);
|
|
2208
|
+
a && a.parentNode === this.wrapper ? (this.addRow(void 0, !0), this.hideToolboxes()) : h && h.parentNode === this.wrapper && (this.addColumn(void 0, !0), this.hideToolboxes());
|
|
2209
|
+
}, this.readOnly || this.bindEvents();
|
|
2210
|
+
}
|
|
2211
|
+
getWrapper() {
|
|
2212
|
+
return this.wrapper;
|
|
2213
|
+
}
|
|
2214
|
+
bindEvents() {
|
|
2215
|
+
document.addEventListener("click", this.documentClicked), document.addEventListener("mousedown", (t) => this.handleDocumentMousedown(t)), this.table.addEventListener("mousemove", /* @__PURE__ */ function(t, e) {
|
|
2216
|
+
let i = 0;
|
|
2217
|
+
return function(...s) {
|
|
2218
|
+
const n = (/* @__PURE__ */ new Date()).getTime();
|
|
2219
|
+
if (!(n - i < t)) return i = n, e(...s);
|
|
2220
|
+
};
|
|
2221
|
+
}(150, (t) => this.onMouseMoveInTable(t)), { passive: !0 }), this.table.onkeypress = (t) => this.onKeyPressListener(t), this.table.addEventListener("keydown", (t) => this.onKeyDownListener(t)), this.table.addEventListener("focusin", (t) => this.focusInTableListener(t));
|
|
2222
|
+
}
|
|
2223
|
+
getCellInCol(t) {
|
|
2224
|
+
const e = [];
|
|
2225
|
+
return this.table.querySelectorAll(`.${B}`).forEach((i) => {
|
|
2226
|
+
const s = i.querySelector(`.${O}:nth-child(${t})`);
|
|
2227
|
+
s && e.push(s);
|
|
2228
|
+
}), e;
|
|
2229
|
+
}
|
|
2230
|
+
createColumnToolbox() {
|
|
2231
|
+
return new I({ api: this.api, cssModifier: "column", items: [{ label: this.api.i18n.t("Add column to left"), icon: '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14.9167 14.9167L11.5833 18.25M11.5833 18.25L8.25 14.9167M11.5833 18.25L11.5833 10.0833C11.5833 9.19928 11.9345 8.35143 12.5596 7.72631C13.1848 7.10119 14.0326 6.75 14.9167 6.75"/></svg>', hideIf: () => this.numberOfColumns === this.config.maxcols, onClick: () => {
|
|
2232
|
+
this.addColumn(this.selectedColumn, !0), this.hideToolboxes(), this.updateColWidth();
|
|
2233
|
+
} }, { label: this.api.i18n.t("Add column to right"), icon: '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.13333 14.9167L12.4667 18.25M12.4667 18.25L15.8 14.9167M12.4667 18.25L12.4667 10.0833C12.4667 9.19928 12.1155 8.35143 11.4904 7.72631C10.8652 7.10119 10.0174 6.75 9.13333 6.75"/></svg>', hideIf: () => this.numberOfColumns === this.config.maxcols, onClick: () => {
|
|
2234
|
+
this.addColumn(this.selectedColumn + 1, !0), this.hideToolboxes(), this.updateColWidth();
|
|
2235
|
+
} }, { label: this.api.i18n.t("Delete column"), icon: wt, hideIf: () => this.numberOfColumns === 1, confirmationRequired: !0, onClick: () => {
|
|
2236
|
+
this.deleteColumn(this.selectedColumn), this.hideToolboxes(), this.updateColWidth();
|
|
2237
|
+
} }], onOpen: () => {
|
|
2238
|
+
this.selectColumn(this.hoveredColumn), this.hideRowToolbox();
|
|
2239
|
+
}, onClose: () => {
|
|
2240
|
+
this.unselectColumn();
|
|
2241
|
+
} });
|
|
2242
|
+
}
|
|
2243
|
+
createRowToolbox() {
|
|
2244
|
+
return new I({ api: this.api, cssModifier: "row", items: [{ label: this.api.i18n.t("Add row above"), icon: '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14.8833 15.8333L18.2167 12.5M18.2167 12.5L14.8833 9.16667M18.2167 12.5L10.05 12.5C9.16595 12.5 8.31811 12.8512 7.69299 13.4763C7.06787 14.1014 6.71667 14.9493 6.71667 15.8333"/></svg>', hideIf: () => this.numberOfRows === this.config.maxrows, onClick: () => {
|
|
2245
|
+
this.addRow(this.selectedRow, !0), this.hideToolboxes();
|
|
2246
|
+
} }, { label: this.api.i18n.t("Add row below"), icon: '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14.8833 9.16666L18.2167 12.5M18.2167 12.5L14.8833 15.8333M18.2167 12.5H10.05C9.16594 12.5 8.31809 12.1488 7.69297 11.5237C7.06785 10.8986 6.71666 10.0507 6.71666 9.16666"/></svg>', hideIf: () => this.numberOfRows === this.config.maxrows, onClick: () => {
|
|
2247
|
+
this.addRow(this.selectedRow + 1, !0), this.hideToolboxes();
|
|
2248
|
+
} }, { label: this.api.i18n.t("Delete row"), icon: wt, hideIf: () => this.numberOfRows === 1, confirmationRequired: !0, onClick: () => {
|
|
2249
|
+
this.deleteRow(this.selectedRow), this.hideToolboxes();
|
|
2250
|
+
} }], onOpen: () => {
|
|
2251
|
+
this.selectRow(this.hoveredRow), this.hideColumnToolbox();
|
|
2252
|
+
}, onClose: () => {
|
|
2253
|
+
this.unselectRow();
|
|
2254
|
+
} });
|
|
2255
|
+
}
|
|
2256
|
+
moveCursorToNextRow() {
|
|
2257
|
+
this.focusedCell.row !== this.numberOfRows ? (this.focusedCell.row += 1, this.focusCell()) : (this.addRow(), this.focusedCell.row += 1, this.focusCell(), this.updateToolboxesPosition(0, 0));
|
|
2258
|
+
}
|
|
2259
|
+
getCell(t, e) {
|
|
2260
|
+
return this.table.querySelectorAll(`.${B}:nth-child(${t}) .${O}`)[e - 1];
|
|
2261
|
+
}
|
|
2262
|
+
getRow(t) {
|
|
2263
|
+
return this.table.querySelector(`.${B}:nth-child(${t})`);
|
|
2264
|
+
}
|
|
2265
|
+
getRowByCell(t) {
|
|
2266
|
+
return t.parentElement;
|
|
2267
|
+
}
|
|
2268
|
+
getRowFirstCell(t) {
|
|
2269
|
+
return t.querySelector(`.${O}:first-child`);
|
|
2270
|
+
}
|
|
2271
|
+
setCellContent(t, e, i) {
|
|
2272
|
+
this.getCell(t, e).innerHTML = i;
|
|
2273
|
+
}
|
|
2274
|
+
addColumn(t = -1, e = !1) {
|
|
2275
|
+
var n;
|
|
2276
|
+
let i = this.numberOfColumns;
|
|
2277
|
+
if (this.config && this.config.maxcols && this.numberOfColumns >= this.config.maxcols) return;
|
|
2278
|
+
for (let r = 1; r <= this.numberOfRows; r++) {
|
|
2279
|
+
let o;
|
|
2280
|
+
const a = this.createCell();
|
|
2281
|
+
if (t > 0 && t <= i ? (o = this.getCell(r, t), ft(a, o)) : o = this.getRow(r).appendChild(a), r === 1) {
|
|
2282
|
+
const h = this.getCell(r, t > 0 ? t : i + 1);
|
|
2283
|
+
h && e && Ct(h);
|
|
2284
|
+
}
|
|
2285
|
+
}
|
|
2286
|
+
const s = this.wrapper.querySelector(`.${Q}`);
|
|
2287
|
+
(n = this.config) != null && n.maxcols && this.numberOfColumns > this.config.maxcols - 1 && s && s.classList.add(St), this.addHeadingAttrToFirstRow(), this.colWidthArr.splice(t - 1, 0, this.defaultCellWidth);
|
|
2288
|
+
}
|
|
2289
|
+
addRow(t = -1, e = !1) {
|
|
2290
|
+
let i, s = y("div", B);
|
|
2291
|
+
this.tunes.withHeadings && this.removeHeadingAttrFromFirstRow();
|
|
2292
|
+
let n = this.numberOfColumns;
|
|
2293
|
+
if (this.config && this.config.maxrows && this.numberOfRows >= this.config.maxrows && o) return;
|
|
2294
|
+
t > 0 && t <= this.numberOfRows ? i = ft(s, this.getRow(t)) : i = this.table.appendChild(s), this.fillRow(i, n), this.tunes.withHeadings && this.addHeadingAttrToFirstRow();
|
|
2295
|
+
const r = this.getRowFirstCell(i);
|
|
2296
|
+
r && e && Ct(r);
|
|
2297
|
+
const o = this.wrapper.querySelector(`.${Z}`);
|
|
2298
|
+
return this.config && this.config.maxrows && this.numberOfRows >= this.config.maxrows && o && o.classList.add(Lt), i;
|
|
2299
|
+
}
|
|
2300
|
+
deleteColumn(t) {
|
|
2301
|
+
for (let i = 1; i <= this.numberOfRows; i++) {
|
|
2302
|
+
const s = this.getCell(i, t);
|
|
2303
|
+
if (!s) return;
|
|
2304
|
+
s.remove();
|
|
2305
|
+
}
|
|
2306
|
+
const e = this.wrapper.querySelector(`.${Q}`);
|
|
2307
|
+
e && e.classList.remove(St), this.colWidthArr.splice(t - 1, 1);
|
|
2308
|
+
}
|
|
2309
|
+
deleteRow(t) {
|
|
2310
|
+
this.getRow(t).remove();
|
|
2311
|
+
const e = this.wrapper.querySelector(`.${Z}`);
|
|
2312
|
+
e && e.classList.remove(Lt), this.addHeadingAttrToFirstRow();
|
|
2313
|
+
}
|
|
2314
|
+
createTableWrapper() {
|
|
2315
|
+
this.wrapper = y("div", kt), this.table = y("div", bt), this.readOnly && this.wrapper.classList.add(ae), this.wrapper.appendChild(this.toolboxRow.element), this.wrapper.appendChild(this.toolboxColumn.element), this.wrapper.appendChild(this.table);
|
|
2316
|
+
}
|
|
2317
|
+
computeInitialSize() {
|
|
2318
|
+
const t = this.data && this.data.content, e = Array.isArray(t), i = !!e && t.length, s = e ? t.length : void 0, n = i ? t[0].length : void 0, r = Number.parseInt(this.config && this.config.rows), o = Number.parseInt(this.config && this.config.cols), a = !isNaN(r) && r > 0 ? r : void 0, h = !isNaN(o) && o > 0 ? o : void 0;
|
|
2319
|
+
return { rows: s || a || 2, cols: n || h || 2 };
|
|
2320
|
+
}
|
|
2321
|
+
resize() {
|
|
2322
|
+
const { rows: t, cols: e } = this.computeInitialSize();
|
|
2323
|
+
for (let i = 0; i < t; i++) this.addRow();
|
|
2324
|
+
for (let i = 0; i < e; i++) this.addColumn();
|
|
2325
|
+
}
|
|
2326
|
+
updateColWidth() {
|
|
2327
|
+
let t = "";
|
|
2328
|
+
if (this.colWidthArr && this.colWidthArr.length > 0) for (let e = 0; e < this.colWidthArr.length; e++) t += " " + this.colWidthArr[e] + "px";
|
|
2329
|
+
t && this.wrapper.style.setProperty("--col-width", t);
|
|
2330
|
+
}
|
|
2331
|
+
fill() {
|
|
2332
|
+
const t = this.data;
|
|
2333
|
+
if (t && t.content) for (let e = 0; e < t.content.length; e++) for (let i = 0; i < t.content[e].length; i++) this.setCellContent(e + 1, i + 1, t.content[e][i]);
|
|
2334
|
+
}
|
|
2335
|
+
fillRow(t, e) {
|
|
2336
|
+
for (let i = 1; i <= e; i++) {
|
|
2337
|
+
const s = this.createCell();
|
|
2338
|
+
t.appendChild(s);
|
|
2339
|
+
}
|
|
2340
|
+
}
|
|
2341
|
+
createCell() {
|
|
2342
|
+
return y("div", O, { contentEditable: !this.readOnly });
|
|
2343
|
+
}
|
|
2344
|
+
get numberOfRows() {
|
|
2345
|
+
return this.table.childElementCount;
|
|
2346
|
+
}
|
|
2347
|
+
get numberOfColumns() {
|
|
2348
|
+
return this.numberOfRows ? this.table.querySelectorAll(`.${B}:first-child .${O}`).length : 0;
|
|
2349
|
+
}
|
|
2350
|
+
get isColumnMenuShowing() {
|
|
2351
|
+
return this.selectedColumn !== 0;
|
|
2352
|
+
}
|
|
2353
|
+
get isRowMenuShowing() {
|
|
2354
|
+
return this.selectedRow !== 0;
|
|
2355
|
+
}
|
|
2356
|
+
onMouseMoveInTable(t) {
|
|
2357
|
+
const { row: e, column: i, deltaXCell: s, deltaYCell: n } = this.getHoveredCell(t);
|
|
2358
|
+
this.hoveredColumn = i, this.hoveredRow = e, this.updateToolboxesPosition(), this.hoveredCell !== null && this.hoveredCell.classList.contains("cell-resizable") && this.hoveredCell.classList.remove("cell-resizable"), this.hoveredCell = this.getCell(e, i), this.cellIsResizable(this.hoveredCell, s) && (this.hoveredCell.classList.contains("cell-resizable") || this.hoveredCell.classList.add("cell-resizable"));
|
|
2359
|
+
}
|
|
2360
|
+
cellIsResizable(t, e) {
|
|
2361
|
+
return t.clientWidth - e <= 10;
|
|
2362
|
+
}
|
|
2363
|
+
onKeyPressListener(t) {
|
|
2364
|
+
if (t.key === "Enter") {
|
|
2365
|
+
if (t.shiftKey) return !0;
|
|
2366
|
+
this.moveCursorToNextRow();
|
|
2367
|
+
}
|
|
2368
|
+
return t.key !== "Enter";
|
|
2369
|
+
}
|
|
2370
|
+
onKeyDownListener(t) {
|
|
2371
|
+
t.key === "Tab" && t.stopPropagation();
|
|
2372
|
+
}
|
|
2373
|
+
focusInTableListener(t) {
|
|
2374
|
+
const e = t.target, i = this.getRowByCell(e);
|
|
2375
|
+
this.focusedCell = { row: Array.from(this.table.querySelectorAll(`.${B}`)).indexOf(i) + 1, column: Array.from(i.querySelectorAll(`.${O}`)).indexOf(e) + 1 };
|
|
2376
|
+
}
|
|
2377
|
+
hideToolboxes() {
|
|
2378
|
+
this.hideRowToolbox(), this.hideColumnToolbox(), this.updateToolboxesPosition();
|
|
2379
|
+
}
|
|
2380
|
+
hideRowToolbox() {
|
|
2381
|
+
this.unselectRow(), this.toolboxRow.hide();
|
|
2382
|
+
}
|
|
2383
|
+
hideColumnToolbox() {
|
|
2384
|
+
this.unselectColumn(), this.toolboxColumn.hide();
|
|
2385
|
+
}
|
|
2386
|
+
focusCell() {
|
|
2387
|
+
this.focusedCellElem.focus();
|
|
2388
|
+
}
|
|
2389
|
+
get focusedCellElem() {
|
|
2390
|
+
const { row: t, column: e } = this.focusedCell;
|
|
2391
|
+
return this.getCell(t, e);
|
|
2392
|
+
}
|
|
2393
|
+
updateToolboxesPosition(t = this.hoveredRow, e = this.hoveredColumn) {
|
|
2394
|
+
this.isColumnMenuShowing || e > 0 && e <= this.numberOfColumns && this.toolboxColumn.show(() => ({ left: `calc((100% - var(--cell-size)) / (${this.numberOfColumns} * 2) * (1 + (${e} - 1) * 2))` })), this.isRowMenuShowing || t > 0 && t <= this.numberOfRows && this.toolboxRow.show(() => {
|
|
2395
|
+
const i = this.getRow(t), { fromTopBorder: s } = K(this.table, i), { height: n } = i.getBoundingClientRect();
|
|
2396
|
+
return { top: `${Math.ceil(s + n / 2)}px` };
|
|
2397
|
+
});
|
|
2398
|
+
}
|
|
2399
|
+
setHeadingsSetting(t) {
|
|
2400
|
+
this.tunes.withHeadings = t, t ? (this.table.classList.add(yt), this.addHeadingAttrToFirstRow()) : (this.table.classList.remove(yt), this.removeHeadingAttrFromFirstRow());
|
|
2401
|
+
}
|
|
2402
|
+
addHeadingAttrToFirstRow() {
|
|
2403
|
+
for (let t = 1; t <= this.numberOfColumns; t++) {
|
|
2404
|
+
let e = this.getCell(1, t);
|
|
2405
|
+
e && e.setAttribute("heading", this.api.i18n.t("Heading"));
|
|
2406
|
+
}
|
|
2407
|
+
}
|
|
2408
|
+
removeHeadingAttrFromFirstRow() {
|
|
2409
|
+
for (let t = 1; t <= this.numberOfColumns; t++) {
|
|
2410
|
+
let e = this.getCell(1, t);
|
|
2411
|
+
e && e.removeAttribute("heading");
|
|
2412
|
+
}
|
|
2413
|
+
}
|
|
2414
|
+
selectRow(t) {
|
|
2415
|
+
const e = this.getRow(t);
|
|
2416
|
+
e && (this.selectedRow = t, e.classList.add(X));
|
|
2417
|
+
}
|
|
2418
|
+
unselectRow() {
|
|
2419
|
+
if (this.selectedRow <= 0) return;
|
|
2420
|
+
const t = this.table.querySelector(`.${X}`);
|
|
2421
|
+
t && t.classList.remove(X), this.selectedRow = 0;
|
|
2422
|
+
}
|
|
2423
|
+
selectColumn(t) {
|
|
2424
|
+
for (let e = 1; e <= this.numberOfRows; e++) {
|
|
2425
|
+
const i = this.getCell(e, t);
|
|
2426
|
+
i && i.classList.add(J);
|
|
2427
|
+
}
|
|
2428
|
+
this.selectedColumn = t;
|
|
2429
|
+
}
|
|
2430
|
+
unselectColumn() {
|
|
2431
|
+
if (this.selectedColumn <= 0) return;
|
|
2432
|
+
let t = this.table.querySelectorAll(`.${J}`);
|
|
2433
|
+
Array.from(t).forEach((e) => {
|
|
2434
|
+
e.classList.remove(J);
|
|
2435
|
+
}), this.selectedColumn = 0;
|
|
2436
|
+
}
|
|
2437
|
+
getHoveredCell(t) {
|
|
2438
|
+
let e = this.hoveredRow, i = this.hoveredColumn;
|
|
2439
|
+
const { width: s, height: n, x: r, y: o } = function(u, p) {
|
|
2440
|
+
const g = u.getBoundingClientRect(), { width: b, height: L, x: T, y: _ } = g, { clientX: U, clientY: z } = p;
|
|
2441
|
+
return { width: b, height: L, x: U - T, y: z - _ };
|
|
2442
|
+
}(this.table, t);
|
|
2443
|
+
if (r >= 0) {
|
|
2444
|
+
const u = ({ fromLeftBorder: g }) => r < g, p = ({ fromRightBorder: g }) => r > s - g;
|
|
2445
|
+
i = this.binSearch(this.numberOfColumns, (g) => this.getCell(1, g), u, p);
|
|
2446
|
+
}
|
|
2447
|
+
if (o >= 0) {
|
|
2448
|
+
const u = ({ fromTopBorder: g }) => o < g, p = ({ fromBottomBorder: g }) => o > n - g;
|
|
2449
|
+
e = this.binSearch(this.numberOfRows, (g) => this.getCell(g, 1), u, p);
|
|
2450
|
+
}
|
|
2451
|
+
const a = e || this.hoveredRow, h = i || this.hoveredColumn, { deltaXCell: l, deltaYCell: c } = this.getMousePositionRelateToCell(a, h, r, o);
|
|
2452
|
+
return { row: a, column: h, deltaXCell: l, deltaYCell: c };
|
|
2453
|
+
}
|
|
2454
|
+
getMousePositionRelateToCell(t, e, i, s) {
|
|
2455
|
+
const n = this.getCell(t, e), { fromTopBorder: r, fromLeftBorder: o } = K(this.table, n);
|
|
2456
|
+
return { deltaXCell: i - o, deltaYCell: s - r };
|
|
2457
|
+
}
|
|
2458
|
+
binSearch(t, e, i, s) {
|
|
2459
|
+
let n, r = 0, o = t + 1, a = 0;
|
|
2460
|
+
for (; r < o - 1 && a < 10; ) {
|
|
2461
|
+
n = Math.ceil((r + o) / 2);
|
|
2462
|
+
const h = e(n), l = K(this.table, h);
|
|
2463
|
+
if (i(l)) o = n;
|
|
2464
|
+
else {
|
|
2465
|
+
if (!s(l)) break;
|
|
2466
|
+
r = n;
|
|
2467
|
+
}
|
|
2468
|
+
a++;
|
|
2469
|
+
}
|
|
2470
|
+
return n;
|
|
2471
|
+
}
|
|
2472
|
+
getData() {
|
|
2473
|
+
const t = [];
|
|
2474
|
+
for (let e = 1; e <= this.numberOfRows; e++) {
|
|
2475
|
+
const i = this.table.querySelector(`.${B}:nth-child(${e})`), s = Array.from(i.querySelectorAll(`.${O}`));
|
|
2476
|
+
s.every((n) => !n.textContent.trim()) || t.push(s.map((n) => n.innerHTML));
|
|
2477
|
+
}
|
|
2478
|
+
return t;
|
|
2479
|
+
}
|
|
2480
|
+
destroy() {
|
|
2481
|
+
document.removeEventListener("click", this.documentClicked);
|
|
2482
|
+
}
|
|
2483
|
+
}
|
|
2484
|
+
class he {
|
|
2485
|
+
static get isReadOnlySupported() {
|
|
2486
|
+
return !0;
|
|
2487
|
+
}
|
|
2488
|
+
static get enableLineBreaks() {
|
|
2489
|
+
return !0;
|
|
2490
|
+
}
|
|
2491
|
+
constructor({ data: t, config: e, api: i, readOnly: s, block: n }) {
|
|
2492
|
+
this.api = i, this.readOnly = s, this.config = e, this.data = { withHeadings: this.getConfig("withHeadings", void 0, t), stretched: this.getConfig("stretched", void 0, t), content: t && t.content ? t.content : [], colWidth: t && t.colWidth ? t.colWidth : [] }, this.table = null;
|
|
2493
|
+
}
|
|
2494
|
+
static get toolbox() {
|
|
2495
|
+
return { icon: '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-width="2" d="M10 5V18.5"/><path stroke="currentColor" stroke-width="2" d="M5 10H19"/><rect width="14" height="14" x="5" y="5" stroke="currentColor" stroke-width="2" rx="4"/></svg>', title: "Table" };
|
|
2496
|
+
}
|
|
2497
|
+
render() {
|
|
2498
|
+
return this.table = new le(this.readOnly, this.api, this.data, this.config), this.container = y("div", this.api.styles.block), this.container.appendChild(this.table.getWrapper()), this.table.setHeadingsSetting(this.data.withHeadings), this.container;
|
|
2499
|
+
}
|
|
2500
|
+
renderSettings() {
|
|
2501
|
+
return [{ label: this.api.i18n.t("With headings"), icon: '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-width="2" d="M5 10H19"/><rect width="14" height="14" x="5" y="5" stroke="currentColor" stroke-width="2" rx="4"/></svg>', isActive: this.data.withHeadings, closeOnActivate: !0, toggle: !0, hint: { title: this.api.i18n.t("With headings") }, onActivate: () => {
|
|
2502
|
+
this.data.withHeadings = !0, this.table.setHeadingsSetting(this.data.withHeadings);
|
|
2503
|
+
} }, { label: this.api.i18n.t("Without headings"), icon: '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-width="2" d="M10 5V18.5"/><path stroke="currentColor" stroke-width="2" d="M14 5V18.5"/><path stroke="currentColor" stroke-width="2" d="M5 10H19"/><path stroke="currentColor" stroke-width="2" d="M5 14H19"/><rect width="14" height="14" x="5" y="5" stroke="currentColor" stroke-width="2" rx="4"/></svg>', isActive: !this.data.withHeadings, closeOnActivate: !0, toggle: !0, hint: { title: this.api.i18n.t("Without headings") }, onActivate: () => {
|
|
2504
|
+
this.data.withHeadings = !1, this.table.setHeadingsSetting(this.data.withHeadings);
|
|
2505
|
+
} }];
|
|
2506
|
+
}
|
|
2507
|
+
save() {
|
|
2508
|
+
const t = this.table.getData();
|
|
2509
|
+
return { withHeadings: this.data.withHeadings, stretched: this.data.stretched, content: t };
|
|
2510
|
+
}
|
|
2511
|
+
destroy() {
|
|
2512
|
+
this.table.destroy();
|
|
2513
|
+
}
|
|
2514
|
+
getConfig(t, e = void 0, i = void 0) {
|
|
2515
|
+
const s = this.data || i;
|
|
2516
|
+
return s ? s[t] ? s[t] : e : this.config && this.config[t] ? this.config[t] : e;
|
|
2517
|
+
}
|
|
2518
|
+
static get pasteConfig() {
|
|
2519
|
+
return { tags: ["TABLE", "TR", "TH", "TD"] };
|
|
2520
|
+
}
|
|
2521
|
+
onPaste(t) {
|
|
2522
|
+
if ("data" in t.detail) {
|
|
2523
|
+
const e = t.detail.data, i = e.querySelector(":scope > thead, tr:first-of-type th"), s = Array.from(e.querySelectorAll("tr")).map((n) => Array.from(n.querySelectorAll("th, td")).map((r) => r.innerHTML));
|
|
2524
|
+
this.data = { withHeadings: i !== null, content: s }, this.table.wrapper && this.table.wrapper.replaceWith(this.render());
|
|
2525
|
+
}
|
|
2526
|
+
}
|
|
2527
|
+
}
|
|
2528
|
+
const de = { class: "ebl-editor", id: "holder" }, ce = { class: "ce-block__content ebl-editor-title-wrap" }, ue = { class: "ce-block__content ebl-editor-time-wrap" }, pe = { class: "ebl-editor-time" }, ge = Mt({ name: "EblEditor", inheritAttrs: !1, __name: "Editor", props: { readOnly: { type: Boolean, default: !1 }, placeholder: { default: "Enter something" }, title: { default: "" }, lastUpdateTime: { default: "" }, data: { default: () => ({ blocks: [] }) } }, emits: ["onReady", "onChange"], setup(d, { emit: t }) {
|
|
2529
|
+
window.VERSION = "2.31.0";
|
|
2530
|
+
const e = _t("locale");
|
|
2531
|
+
let i = t;
|
|
2532
|
+
const s = d, n = Ht(s.title);
|
|
2533
|
+
let r = null;
|
|
2534
|
+
function o() {
|
|
2535
|
+
r !== null && r.save().then((a) => {
|
|
2536
|
+
}).catch((a) => {
|
|
2537
|
+
});
|
|
2538
|
+
}
|
|
2539
|
+
return It(() => {
|
|
2540
|
+
const a = At(s.data);
|
|
2541
|
+
r = new Pt({ holder: "holder", autofocus: !0, defaultBlock: "paragraph", placeholder: s.placeholder, tunes: ["indent", "blockAlignment"], tools: { inlineCode: $, underline: et, Color: { class: oe }, marker: { class: N }, indent: { class: tt }, alert: { class: M, inlineToolbar: !0 }, List: { class: F, inlineToolbar: !0, config: { defaultStyle: "unordered" } }, h1: { class: Gt, inlineToolbar: !0 }, h2: { class: Kt, inlineToolbar: !0 }, h3: { class: Xt, inlineToolbar: !0 }, h4: { class: Jt, inlineToolbar: !0 }, h5: { class: Zt, inlineToolbar: !0 }, h6: { class: Qt, inlineToolbar: !0 }, paragraph: { class: nt, inlineToolbar: !0 }, blockAlignment: { class: st, inlineToolbar: !0 }, code: { class: W, config: { lang: "javascript", theme: "catppuccin-latte" } }, quote: { class: te, inlineToolbar: !0 }, delimiter: ee, table: { class: he, inlineToolbar: !0, config: { rows: 2, cols: 3 } } }, data: a, readOnly: s.readOnly, i18n: e, onChange: (h, l) => {
|
|
2542
|
+
i("onChange", h, l);
|
|
2543
|
+
}, onReady: () => {
|
|
2544
|
+
new Yt("holder", s.readOnly, r, "1px solid #999"), new ne({ editor: r, config: { debounceTimer: 200, maxLength: 100 }, onUpdate: () => {
|
|
2545
|
+
} }).initialize(a), i("onReady");
|
|
2546
|
+
} });
|
|
2547
|
+
}), Bt(() => {
|
|
2548
|
+
r !== null && (r.destroy(), r = null);
|
|
2549
|
+
}), (a, h) => (Dt(), Ot("div", de, [P("div", ce, [Rt(P("input", { type: "text", "onUpdate:modelValue": h[0] || (h[0] = (l) => n.value = l), placeholder: "请输入标题", class: "ebl-editor-title-input" }, null, 512), [[Nt, n.value]])]), P("div", ue, [P("span", pe, "最后修改时间:" + $t(a.lastUpdateTime), 1)]), P("button", { onClick: o }, "保存")]));
|
|
2550
|
+
} }), xt = [ge];
|
|
2551
|
+
let Tt = [];
|
|
2552
|
+
for (let d in xt) {
|
|
2553
|
+
const t = jt(xt[d]);
|
|
2554
|
+
Tt.push(t);
|
|
2555
|
+
}
|
|
2556
|
+
const Et = /* @__PURE__ */ ((d = []) => ({ version: "1.0.5", install: (t, e) => {
|
|
2557
|
+
t[ot] || (t[ot] = !0, d.forEach((i) => t.use(i)), e && t.provide("locale", e.locale));
|
|
2558
|
+
} }))(Tt), be = Et.install, ye = Et.version;
|
|
2559
|
+
export {
|
|
2560
|
+
ge as EblEditor,
|
|
2561
|
+
Et as default,
|
|
2562
|
+
be as install,
|
|
2563
|
+
ye as version
|
|
2564
|
+
};
|
|
2565
|
+
//# sourceMappingURL=index.mjs.map
|