npm - @ones-editor/editor - Versions diffs - 2.2.14-beta.15 → 2.2.14-beta.17 - Mend

@ones-editor/editor 2.2.14-beta.15 → 2.2.14-beta.17

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (9) hide show

package/@ones-editor/drawio-embed/src/dom/toast.d.ts +2 -0
package/@ones-editor/drawio-embed/src/helper/paste-handler.d.ts +8 -0
package/@ones-editor/drawio-embed/src/index.d.ts +2 -1
package/@ones-editor/graph-embed/src/helper/graph-base.d.ts +1 -1
package/@ones-editor/graph-embed/src/mermaid/mermaid.d.ts +1 -0
package/@ones-editor/tsconfig.tsbuildinfo +1 -1
package/@ones-editor/ui-base/src/toast/index.d.ts +3 -1
package/dist/index.js +185 -61
package/package.json +1 -1

package/@ones-editor/ui-base/src/toast/index.d.ts CHANGED Viewed

@@ -2,11 +2,13 @@ import './toast.scss';
 export type ToastOptions = {
     html: boolean;
     duration: number;
+    autoClose: boolean;
     theme: string;
     id: string;
     position: {
         x: number;
         y: number;
     };
+    onClick: (e: MouseEvent) => boolean;
 };
-export declare function showToast(text: string, options?: Partial<ToastOptions>): void;
+export declare function showToast(text: string, options?: Partial<ToastOptions>): () => void;

package/dist/index.js CHANGED Viewed

@@ -762,7 +762,7 @@ div.comment-editor-root div.root.select-all > .container-blocks > div[data-type=
 ::placeholder {
   color: #bbb;
 }/* The snackbar - position it at the bottom and in the middle of the screen */
-.toast {
+.ones-editor-toast {
   font-family: Avenir, Helvetica, Arial, sans-serif;
   visibility: hidden; /* Hidden by default. Visible on click */
   min-width: 250px; /* Set a default minimum width */
@@ -773,20 +773,35 @@ div.comment-editor-root div.root.select-all > .container-blocks > div[data-type=
   border-radius: 2px; /* Rounded borders */
   padding: 8px; /* Padding */
   position: fixed; /* Sit on top of the screen */
-  z-index: 1; /* Add a z-index if needed */
+  z-index: 12000; /* Add a z-index if needed */
   left: 50%; /* Center the snackbar */
   bottom: 30px; /* 30px from the bottom */
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  font-size: 14px;
 }
-.toast.show {
+.ones-editor-toast.show {
   visibility: visible; /* Show the snackbar */
   animation: toast_fade_in 0.5s, toast_fade_out 0.5s 2.5s;
 }
-.toast.positioned.show {
+.ones-editor-toast.positioned.show {
   animation: toast_fade_in_positioned 0.5s, toast_fade_out_positioned 0.5s 2.5s;
 }
-.toast.positioned {
+.ones-editor-toast.positioned {
   bottom: unset;
 }
+.ones-editor-toast > .close {
+  width: 24px;
+  height: 24px;
+  justify-content: center;
+  display: inline-flex;
+  align-items: center;
+  cursor: pointer;
+}
+.ones-editor-toast > .close:hover {
+  background-color: rgba(255, 255, 255, 0.1019607843);
+}
 @keyframes toast_fade_in {
   from {
     bottom: 0;
@@ -6985,6 +7000,23 @@ div[data-command-bar-id=mobile-bottom-menu] .mobile-menu-wrap.editor-mention .co
 }
 .command-item[data-id=preset-1] {
   background-color: #fff0d9 !important;
+}.ones-editor-toast[data-theme=warn] {
+  background-color: #f59300;
+}
+.ones-editor-toast[data-theme=warn] .toast-message {
+  display: inline-flex;
+  align-items: center;
+}
+.ones-editor-toast[data-theme=warn] .toast-message svg {
+  margin-right: 8px;
+  width: 24px;
+  height: 24px;
+  fill: white;
+}
+.ones-editor-toast[data-theme=warn] a {
+  margin-left: 5px;
+  text-decoration: underline;
+  cursor: pointer;
 }:root {
   --editor-quoted-color: #7084a4;
   --editor-drawio-empty-svg: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDgiIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgMCA0OCA0OCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0zOC43MjAzIDI4LjcwOTdIMjUuOTIzM0MyNS4yMTY1IDI4LjcwOTcgMjQuNjQzNSAyOC4xNDgxIDI0LjY0MzUgMjcuNDU1MlYyNS43MzMzSDIwLjUyODNDMjAuNDk4NiAyNS43Njk2IDIwLjQ2NjkgMjUuODA0MiAyMC40MzMzIDI1LjgzN0wxNS45MTkyIDMwLjI2MjFWMzQuNzU1NkgyNC42NDM1VjMzLjcyNzZDMjQuNjQzNSAzMy4wMzQ4IDI1LjIxNjUgMzIuNDczMiAyNS45MjMzIDMyLjQ3MzJIMzguNzIwM0MzOS40MjcgMzIuNDczMiA0MCAzMy4wMzQ4IDQwIDMzLjcyNzZWMzguNzQ1NUM0MCAzOS40MzgzIDM5LjQyNyA0MCAzOC43MjAzIDQwSDI1LjkyMzNDMjUuMjE2NSA0MCAyNC42NDM1IDM5LjQzODMgMjQuNjQzNSAzOC43NDU1VjM3LjMzMzNIMTQuNjI2M0MxMy45MTIyIDM3LjMzMzMgMTMuMzMzMyAzNi43NTYyIDEzLjMzMzMgMzYuMDQ0NFYzMC42OTQxTDguMzc4NTIgMjUuODM3QzguMTM2MjYgMjUuNjAxNCA4IDI1LjI4MDggOCAyNC45NDYzQzggMjQuNjExOCA4LjEzNjI2IDI0LjI5MTEgOC4zNzg1MiAyNC4wNTU2TDEzLjMzMzMgMTkuMTk4NVYxNS43NzJDMTEuNzc5OCAxNS4yMjI5IDEwLjY2NjcgMTMuNzQxNiAxMC42NjY3IDEyQzEwLjY2NjcgOS43OTA4NSAxMi40NTc1IDggMTQuNjY2NyA4QzE2Ljg3NTggOCAxOC42NjY2IDkuNzkwODUgMTguNjY2NiAxMkMxOC42NjY2IDEzLjcyNjUgMTcuNTU4OCAxNS4yNTgxIDE1LjkxOTEgMTUuNzk4OFYxOS4yODg4QzE1LjkxOTEgMTkuMzkxOCAxNS45MDY4IDE5LjQ5NDMgMTUuODgyMyAxOS41OTQzTDE5LjUxNTEgMjMuMTU1NUgyNC42NDM1VjIyLjQzNzNDMjQuNjQzNSAyMS43NDQ1IDI1LjIxNjUgMjEuMTgyOSAyNS45MjMzIDIxLjE4MjlIMzguNzIwM0MzOS40MjcgMjEuMTgyOSA0MCAyMS43NDQ1IDQwIDIyLjQzNzNWMjcuNDU1MkM0MCAyOC4xNDgxIDM5LjQyNyAyOC43MDk3IDM4LjcyMDMgMjguNzA5N1pNMjcuMjAzIDM3LjQ5MUgzNy40NDA2VjM0Ljk4MjFIMjcuMjAzVjM3LjQ5MVpNMTQuNDA1OSAyOC4xOTU0TDExLjA5MTUgMjQuOTQ2M0wxNC40MDU5IDIxLjY5NzJMMTcuNzIwNCAyNC45NDYzTDE0LjQwNTkgMjguMTk1NFpNMjcuMjAzIDI2LjIwMDhIMzcuNDQwNlYyMy42OTE4SDI3LjIwM1YyNi4yMDA4WiIgZmlsbD0iIzA3MTQyQSIvPgo8L3N2Zz4K");
@@ -7109,14 +7141,19 @@ div.editor-root.readonly div.editor-content div[data-type=editor-container] .emb
 .embed-block[data-embed-type=flowchart] div[data-type=block-content],
 .embed-block[data-embed-type=plantuml] div[data-type=block-content] {
   --border-color: #e5e5e5;
-  display: flex;
-  flex-direction: column;
   outline: 1px solid var(--border-color);
   border-radius: 3px;
 }
-.embed-block[data-embed-type=mermaid] div[data-type=block-content] .embed-graph-header,
-.embed-block[data-embed-type=flowchart] div[data-type=block-content] .embed-graph-header,
-.embed-block[data-embed-type=plantuml] div[data-type=block-content] .embed-graph-header {
+.embed-block[data-embed-type=mermaid] div[data-type=block-content] .embed-graph-wrapper,
+.embed-block[data-embed-type=flowchart] div[data-type=block-content] .embed-graph-wrapper,
+.embed-block[data-embed-type=plantuml] div[data-type=block-content] .embed-graph-wrapper {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+}
+.embed-block[data-embed-type=mermaid] div[data-type=block-content] .embed-graph-wrapper .embed-graph-header,
+.embed-block[data-embed-type=flowchart] div[data-type=block-content] .embed-graph-wrapper .embed-graph-header,
+.embed-block[data-embed-type=plantuml] div[data-type=block-content] .embed-graph-wrapper .embed-graph-header {
   display: flex;
   align-items: center;
   flex-shrink: 0;
@@ -7126,58 +7163,58 @@ div.editor-root.readonly div.editor-content div[data-type=editor-container] .emb
   background: var(--Background-Default-o-color-bg-weak, #f7f8fa);
   border-bottom: 1px solid var(--border-color);
 }
-.embed-block[data-embed-type=mermaid] div[data-type=block-content] .embed-graph-header .editor-command-bar-root,
-.embed-block[data-embed-type=mermaid] div[data-type=block-content] .embed-graph-header .editor-command-bar,
-.embed-block[data-embed-type=flowchart] div[data-type=block-content] .embed-graph-header .editor-command-bar-root,
-.embed-block[data-embed-type=flowchart] div[data-type=block-content] .embed-graph-header .editor-command-bar,
-.embed-block[data-embed-type=plantuml] div[data-type=block-content] .embed-graph-header .editor-command-bar-root,
-.embed-block[data-embed-type=plantuml] div[data-type=block-content] .embed-graph-header .editor-command-bar {
+.embed-block[data-embed-type=mermaid] div[data-type=block-content] .embed-graph-wrapper .embed-graph-header .editor-command-bar-root,
+.embed-block[data-embed-type=mermaid] div[data-type=block-content] .embed-graph-wrapper .embed-graph-header .editor-command-bar,
+.embed-block[data-embed-type=flowchart] div[data-type=block-content] .embed-graph-wrapper .embed-graph-header .editor-command-bar-root,
+.embed-block[data-embed-type=flowchart] div[data-type=block-content] .embed-graph-wrapper .embed-graph-header .editor-command-bar,
+.embed-block[data-embed-type=plantuml] div[data-type=block-content] .embed-graph-wrapper .embed-graph-header .editor-command-bar-root,
+.embed-block[data-embed-type=plantuml] div[data-type=block-content] .embed-graph-wrapper .embed-graph-header .editor-command-bar {
   background-color: transparent;
 }
-.embed-block[data-embed-type=mermaid] div[data-type=block-content] .embed-graph-content,
-.embed-block[data-embed-type=flowchart] div[data-type=block-content] .embed-graph-content,
-.embed-block[data-embed-type=plantuml] div[data-type=block-content] .embed-graph-content {
+.embed-block[data-embed-type=mermaid] div[data-type=block-content] .embed-graph-wrapper .embed-graph-content,
+.embed-block[data-embed-type=flowchart] div[data-type=block-content] .embed-graph-wrapper .embed-graph-content,
+.embed-block[data-embed-type=plantuml] div[data-type=block-content] .embed-graph-wrapper .embed-graph-content {
   position: relative;
   display: flex;
   flex-direction: column;
   height: calc(100% - 40px);
   flex: 1;
 }
-.embed-block[data-embed-type=mermaid] div[data-type=block-content] .embed-graph-content .graph-content,
-.embed-block[data-embed-type=flowchart] div[data-type=block-content] .embed-graph-content .graph-content,
-.embed-block[data-embed-type=plantuml] div[data-type=block-content] .embed-graph-content .graph-content {
+.embed-block[data-embed-type=mermaid] div[data-type=block-content] .embed-graph-wrapper .embed-graph-content .graph-content,
+.embed-block[data-embed-type=flowchart] div[data-type=block-content] .embed-graph-wrapper .embed-graph-content .graph-content,
+.embed-block[data-embed-type=plantuml] div[data-type=block-content] .embed-graph-wrapper .embed-graph-content .graph-content {
   flex: 1;
   display: flex;
   height: 100%;
 }
-.embed-block[data-embed-type=mermaid] div[data-type=block-content] .embed-graph-content .graph-content .embed-graph-left,
-.embed-block[data-embed-type=flowchart] div[data-type=block-content] .embed-graph-content .graph-content .embed-graph-left,
-.embed-block[data-embed-type=plantuml] div[data-type=block-content] .embed-graph-content .graph-content .embed-graph-left {
+.embed-block[data-embed-type=mermaid] div[data-type=block-content] .embed-graph-wrapper .embed-graph-content .graph-content .embed-graph-left,
+.embed-block[data-embed-type=flowchart] div[data-type=block-content] .embed-graph-wrapper .embed-graph-content .graph-content .embed-graph-left,
+.embed-block[data-embed-type=plantuml] div[data-type=block-content] .embed-graph-wrapper .embed-graph-content .graph-content .embed-graph-left {
   border-right: 1px solid var(--border-color);
 }
-.embed-block[data-embed-type=mermaid] div[data-type=block-content] .embed-graph-content .graph-content .embed-graph-left,
-.embed-block[data-embed-type=mermaid] div[data-type=block-content] .embed-graph-content .graph-content .embed-graph-right,
-.embed-block[data-embed-type=flowchart] div[data-type=block-content] .embed-graph-content .graph-content .embed-graph-left,
-.embed-block[data-embed-type=flowchart] div[data-type=block-content] .embed-graph-content .graph-content .embed-graph-right,
-.embed-block[data-embed-type=plantuml] div[data-type=block-content] .embed-graph-content .graph-content .embed-graph-left,
-.embed-block[data-embed-type=plantuml] div[data-type=block-content] .embed-graph-content .graph-content .embed-graph-right {
+.embed-block[data-embed-type=mermaid] div[data-type=block-content] .embed-graph-wrapper .embed-graph-content .graph-content .embed-graph-left,
+.embed-block[data-embed-type=mermaid] div[data-type=block-content] .embed-graph-wrapper .embed-graph-content .graph-content .embed-graph-right,
+.embed-block[data-embed-type=flowchart] div[data-type=block-content] .embed-graph-wrapper .embed-graph-content .graph-content .embed-graph-left,
+.embed-block[data-embed-type=flowchart] div[data-type=block-content] .embed-graph-wrapper .embed-graph-content .graph-content .embed-graph-right,
+.embed-block[data-embed-type=plantuml] div[data-type=block-content] .embed-graph-wrapper .embed-graph-content .graph-content .embed-graph-left,
+.embed-block[data-embed-type=plantuml] div[data-type=block-content] .embed-graph-wrapper .embed-graph-content .graph-content .embed-graph-right {
   display: flex;
   align-items: center;
   justify-content: center;
   overflow: hidden;
   padding: 10px;
 }
-.embed-block[data-embed-type=mermaid] div[data-type=block-content] .embed-graph-content .graph-content .embed-graph-left > div,
-.embed-block[data-embed-type=mermaid] div[data-type=block-content] .embed-graph-content .graph-content .embed-graph-right > div,
-.embed-block[data-embed-type=flowchart] div[data-type=block-content] .embed-graph-content .graph-content .embed-graph-left > div,
-.embed-block[data-embed-type=flowchart] div[data-type=block-content] .embed-graph-content .graph-content .embed-graph-right > div,
-.embed-block[data-embed-type=plantuml] div[data-type=block-content] .embed-graph-content .graph-content .embed-graph-left > div,
-.embed-block[data-embed-type=plantuml] div[data-type=block-content] .embed-graph-content .graph-content .embed-graph-right > div {
+.embed-block[data-embed-type=mermaid] div[data-type=block-content] .embed-graph-wrapper .embed-graph-content .graph-content .embed-graph-left > div,
+.embed-block[data-embed-type=mermaid] div[data-type=block-content] .embed-graph-wrapper .embed-graph-content .graph-content .embed-graph-right > div,
+.embed-block[data-embed-type=flowchart] div[data-type=block-content] .embed-graph-wrapper .embed-graph-content .graph-content .embed-graph-left > div,
+.embed-block[data-embed-type=flowchart] div[data-type=block-content] .embed-graph-wrapper .embed-graph-content .graph-content .embed-graph-right > div,
+.embed-block[data-embed-type=plantuml] div[data-type=block-content] .embed-graph-wrapper .embed-graph-content .graph-content .embed-graph-left > div,
+.embed-block[data-embed-type=plantuml] div[data-type=block-content] .embed-graph-wrapper .embed-graph-content .graph-content .embed-graph-right > div {
   flex: 1;
 }
-.embed-block[data-embed-type=mermaid] div[data-type=block-content] .embed-graph-content .resize-gripper,
-.embed-block[data-embed-type=flowchart] div[data-type=block-content] .embed-graph-content .resize-gripper,
-.embed-block[data-embed-type=plantuml] div[data-type=block-content] .embed-graph-content .resize-gripper {
+.embed-block[data-embed-type=mermaid] div[data-type=block-content] .embed-graph-wrapper .embed-graph-content .resize-gripper,
+.embed-block[data-embed-type=flowchart] div[data-type=block-content] .embed-graph-wrapper .embed-graph-content .resize-gripper,
+.embed-block[data-embed-type=plantuml] div[data-type=block-content] .embed-graph-wrapper .embed-graph-content .resize-gripper {
   position: absolute;
   top: 0;
   width: 10px;
@@ -7301,6 +7338,9 @@ div.editor-root:not(.readonly) div.editor-content div[data-type=editor-container
   background-color: transparent;
 }
 div[data-type=editor-block].layout-block .layout-column-container > .container-blocks > .embed-block[data-embed-type=mermaid] div[data-type=block-content], div[data-type=editor-block].layout-block .layout-column-container > .container-blocks > .embed-block[data-embed-type=flowchart] div[data-type=block-content], div[data-type=editor-block].layout-block .layout-column-container > .container-blocks > .embed-block[data-embed-type=plantuml] div[data-type=block-content] {
+  overflow-x: auto;
+}
+div[data-type=editor-block].layout-block .layout-column-container > .container-blocks > .embed-block[data-embed-type=mermaid] div[data-type=block-content] .embed-graph-wrapper, div[data-type=editor-block].layout-block .layout-column-container > .container-blocks > .embed-block[data-embed-type=flowchart] div[data-type=block-content] .embed-graph-wrapper, div[data-type=editor-block].layout-block .layout-column-container > .container-blocks > .embed-block[data-embed-type=plantuml] div[data-type=block-content] .embed-graph-wrapper {
   min-width: 290px;
 }
 div.comment-editor-root [data-type=editor-container].root .embed-block[data-embed-type=mermaid],
@@ -39695,7 +39735,7 @@ ${codeText}
   const DownloadIcon$1 = '<svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path fill-rule="evenodd" clip-rule="evenodd" d="M8.00001 9.2376L8.00006 1L9.00006 1.00001L9.00001 9.2373L12.1299 6.10621L12.8372 6.81318L8.85364 10.7982L8.50009 11.1519L8.14647 10.7983L4.16145 6.81325L4.86855 6.10614L8.00001 9.2376ZM3 13.9434C3 14.2195 3.22386 14.4434 3.5 14.4434L13.5 14.4434C13.7761 14.4434 14 14.2195 14 13.9434V9.94336H15V13.9434C15 14.7718 14.3284 15.4434 13.5 15.4434L3.5 15.4434C2.67157 15.4434 2 14.7718 2 13.9434L2 9.94336H3L3 13.9434Z" fill="currentColor"/>\n</svg>\n';
   const alterEmoji = '<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">\n<circle cx="5" cy="6" r="1" fill="#2D2D2E"/>\n<circle cx="11" cy="6" r="1" fill="#2D2D2E"/>\n<path fill-rule="evenodd" clip-rule="evenodd" d="M4.12622 9C4.57027 10.7252 6.13637 12 8.0002 12C9.86403 12 11.4301 10.7252 11.8742 9H10.2922C9.90639 9.88294 9.02535 10.5 8.0002 10.5C6.97505 10.5 6.09401 9.88294 5.70823 9H4.12622Z" fill="#2D2D2E"/>\n<path fill-rule="evenodd" clip-rule="evenodd" d="M14.5 8C14.5 11.5899 11.5899 14.5 8 14.5C4.41015 14.5 1.5 11.5899 1.5 8C1.5 4.41015 4.41015 1.5 8 1.5C8.69781 1.5 9.36994 1.60996 10 1.8135V0.252035C9.36076 0.087506 8.6906 0 8 0C3.58172 0 0 3.58172 0 8C0 12.4183 3.58172 16 8 16C12.4183 16 16 12.4183 16 8C16 7.3094 15.9125 6.63924 15.748 6H14.1865C14.39 6.63006 14.5 7.30219 14.5 8Z" fill="#2D2D2E"/>\n<line x1="12" y1="2.5" x2="15" y2="2.5" stroke="#2D2D2E"/>\n<line x1="13.5" y1="1" x2="13.5" y2="4" stroke="#2D2D2E"/>\n</svg>\n';
   const ForbiddenIcon = '<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M8 15C11.866 15 15 11.866 15 8M8 15C4.13401 15 1 11.866 1 8M8 15C11.8324 15 15 11.8324 15 8M8 15C4.16755 15 1 11.8324 1 8M15 8C15 4.13401 11.866 1 8 1M15 8C15 4.16755 11.8324 1 8 1M1 8C1 4.13401 4.13401 1 8 1M1 8C1 4.16755 4.16755 1 8 1M12.9581 12.7581L3.2 3" stroke="currentColor" stroke-width="1" stroke-linecap="square" stroke-linejoin="round"/>\n</svg>\n';
-  const WarningFilledIcon = '<svg width="1em" height="1em" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path fill-rule="evenodd" clip-rule="evenodd" d="M14.7768 15.0001H2.22316C1.45534 15.0001 0.973967 14.1706 1.35491 13.5039L7.63174 2.51949C8.01563 1.84767 8.98433 1.84767 9.36822 2.51949L13.6428 10.0001L15.645 13.5039C16.026 14.1706 15.5446 15.0001 14.7768 15.0001ZM8.99998 6.00006V10.0001H7.99998V6.00006H8.99998ZM8.99998 13.0001V11.0001H7.99998V13.0001H8.99998Z" fill="#F59300"/>\n</svg>\n';
+  const WarningFilledIcon = '<svg width="1em" height="1em" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path fill-rule="evenodd" clip-rule="evenodd" d="M14.7768 15.0001H2.22316C1.45534 15.0001 0.973967 14.1706 1.35491 13.5039L7.63174 2.51949C8.01563 1.84767 8.98433 1.84767 9.36822 2.51949L13.6428 10.0001L15.645 13.5039C16.026 14.1706 15.5446 15.0001 14.7768 15.0001ZM8.99998 6.00006V10.0001H7.99998V6.00006H8.99998ZM8.99998 13.0001V11.0001H7.99998V13.0001H8.99998Z" fill="currentColor"/>\n</svg>\n';
   const InformationFilledIcon = '<svg width="1em" height="1em" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path fill-rule="evenodd" clip-rule="evenodd" d="M15.5 8C15.5 11.8659 12.3659 15 8.5 15C4.63408 15 1.5 11.8659 1.5 8C1.5 4.13408 4.63408 1 8.5 1C12.3659 1 15.5 4.13408 15.5 8ZM9 7V12H8V7H9ZM9 6V4H8V6H9Z" fill="#0064FF"/>\n</svg>\n';
   const AddEmojiIcon = '<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path fill-rule="evenodd" clip-rule="evenodd" d="M13 0V2H11V3H13V5H14V3H16V2H14V0H13ZM8 1.5C4.41015 1.5 1.5 4.41015 1.5 8C1.5 11.5899 4.41015 14.5 8 14.5C11.5899 14.5 14.5 11.5899 14.5 8C14.5 7.68424 14.4775 7.37402 14.4341 7.0708L15.4241 6.9292C15.4741 7.27918 15.5 7.63672 15.5 8C15.5 12.1421 12.1421 15.5 8 15.5C3.85786 15.5 0.5 12.1421 0.5 8C0.5 3.85786 3.85786 0.5 8 0.5C8.36328 0.5 8.72082 0.525866 9.0708 0.575927L8.9292 1.56585C8.62598 1.52248 8.31576 1.5 8 1.5ZM6.5 6C6.5 6.55228 6.05228 7 5.5 7C4.94772 7 4.5 6.55228 4.5 6C4.5 5.44772 4.94772 5 5.5 5C6.05228 5 6.5 5.44772 6.5 6ZM10.5 7C11.0523 7 11.5 6.55228 11.5 6C11.5 5.44772 11.0523 5 10.5 5C9.94771 5 9.5 5.44772 9.5 6C9.5 6.55228 9.94771 7 10.5 7ZM5.5 9C5.5 9.21658 5.52742 9.42603 5.57873 9.62537C5.85629 10.7037 6.83579 11.5 8 11.5C9.16421 11.5 10.1437 10.7037 10.4213 9.62537C10.4726 9.42603 10.5 9.21658 10.5 9H11.5C11.5 9.30137 11.4618 9.59454 11.3897 9.87463C11.0012 11.3841 9.63155 12.5 8 12.5C6.36845 12.5 4.9988 11.3841 4.61029 9.87463C4.53821 9.59454 4.5 9.30137 4.5 9H5.5Z" fill="currentColor"/>\n</svg>\n';
   const BallIcon = '<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">\n<mask id="path-1-inside-1_1548_11413" fill="white">\n<path fill-rule="evenodd" clip-rule="evenodd" d="M11.5013 3.3051C10.1794 2.54193 8.68788 2.3389 7.30151 2.62236C7.45689 4.13682 7.15402 5.71323 6.33478 7.13219C5.50852 8.56333 4.11113 9.53449 2.72696 10.1315C3.13679 11.5836 4.09134 12.8834 5.50125 13.6974C6.88859 14.4984 8.46285 14.6824 9.90627 14.3344C9.73444 12.799 10.0339 11.1962 10.8656 9.75572C11.672 8.35905 12.8605 7.31942 14.2224 6.69331C13.7867 5.31322 12.8534 4.08575 11.5013 3.3051ZM14.4471 7.6945C13.3477 8.2443 12.3923 9.11137 11.7316 10.2557C11.049 11.4381 10.78 12.7449 10.8797 14.0101C12.0246 13.5168 13.0262 12.6639 13.6974 11.5013C14.3889 10.3035 14.6205 8.96642 14.4471 7.6945ZM3.3051 5.50125C4.01521 4.2713 5.09503 3.38789 6.32314 2.91033C6.41573 4.16535 6.14557 5.45992 5.46876 6.63219C4.82049 7.75503 3.71484 8.57888 2.53314 9.12317C2.40542 7.90718 2.64699 6.64113 3.3051 5.50125ZM2.43907 5.00125C4.37207 1.6532 8.6532 0.506078 12.0013 2.43907C15.3493 4.37207 16.4964 8.6532 14.5634 12.0013C12.6304 15.3493 8.3493 16.4964 5.00125 14.5634C1.6532 12.6304 0.506078 8.3493 2.43907 5.00125Z"/>\n</mask>\n<path d="M7.30151 2.62236L7.10119 1.64262L6.21435 1.82395L6.30673 2.72442L7.30151 2.62236ZM11.5013 3.3051L11.0013 4.17113L11.5013 3.3051ZM6.33478 7.13219L5.46876 6.63219L6.33478 7.13219ZM2.72696 10.1315L2.33094 9.21321L1.52664 9.56009L1.76455 10.4031L2.72696 10.1315ZM5.50125 13.6974L5.00125 14.5634L5.50125 13.6974ZM9.90627 14.3344L10.1406 15.3066L10.9982 15.0999L10.9001 14.2232L9.90627 14.3344ZM10.8656 9.75572L11.7316 10.2557H11.7316L10.8656 9.75572ZM14.2224 6.69331L14.6401 7.60189L15.4416 7.23343L15.176 6.39225L14.2224 6.69331ZM14.4471 7.6945L15.4379 7.55935L15.2491 6.17528L13.9997 6.80012L14.4471 7.6945ZM11.7316 10.2557L10.8656 9.75572H10.8656L11.7316 10.2557ZM10.8797 14.0101L9.88282 14.0886L9.99256 15.4812L11.2754 14.9285L10.8797 14.0101ZM13.6974 11.5013L12.8314 11.0013L13.6974 11.5013ZM6.32314 2.91033L7.32043 2.83676L7.22095 1.48827L5.96072 1.97831L6.32314 2.91033ZM3.3051 5.50125L2.43907 5.00125H2.43907L3.3051 5.50125ZM5.46876 6.63219L6.33478 7.13219L5.46876 6.63219ZM2.53314 9.12317L1.53861 9.22763L1.68435 10.6151L2.95149 10.0315L2.53314 9.12317ZM12.0013 2.43907L12.5013 1.57305V1.57305L12.0013 2.43907ZM2.43907 5.00125L1.57305 4.50125L2.43907 5.00125ZM5.00125 14.5634L5.50125 13.6974L5.00125 14.5634ZM7.50182 3.60209C8.65795 3.36571 9.89913 3.53482 11.0013 4.17113L12.0013 2.43907C10.4597 1.54905 8.71781 1.31209 7.10119 1.64262L7.50182 3.60209ZM7.20081 7.63219C8.12871 6.02502 8.47241 4.23693 8.29629 2.5203L6.30673 2.72442C6.44137 4.03672 6.17934 5.40143 5.46876 6.63219L7.20081 7.63219ZM3.12298 11.0497C4.62558 10.4017 6.23063 9.31259 7.20081 7.63219L5.46876 6.63219C4.7864 7.81407 3.59667 8.66733 2.33094 9.21321L3.12298 11.0497ZM6.00125 12.8314C4.82601 12.1529 4.03127 11.0713 3.68936 9.85983L1.76455 10.4031C2.24231 12.0959 3.35667 13.6139 5.00125 14.5634L6.00125 12.8314ZM9.67195 13.3623C8.46788 13.6525 7.15776 13.4991 6.00125 12.8314L5.00125 14.5634C6.61943 15.4977 8.45783 15.7122 10.1406 15.3066L9.67195 13.3623ZM10.9001 14.2232C10.7512 12.8926 11.0103 11.5051 11.7316 10.2557L9.99958 9.25572C9.05756 10.8874 8.71771 12.7053 8.91247 14.4457L10.9001 14.2232ZM11.7316 10.2557C12.4311 9.04424 13.4601 8.14438 14.6401 7.60189L13.8047 5.78473C12.2609 6.49445 10.9129 7.67385 9.99958 9.25572L11.7316 10.2557ZM11.0013 4.17113C12.1285 4.82195 12.9054 5.84331 13.2688 6.99437L15.176 6.39225C14.668 4.78312 13.5782 3.34955 12.0013 2.43907L11.0013 4.17113ZM13.9997 6.80012C12.7306 7.43489 11.6272 8.43667 10.8656 9.75572L12.5977 10.7557C13.1575 9.78606 13.9649 9.05372 14.8944 8.58888L13.9997 6.80012ZM10.8656 9.75572C10.0787 11.1187 9.76773 12.6282 9.88282 14.0886L11.8766 13.9315C11.7923 12.8617 12.0193 11.7575 12.5977 10.7557L10.8656 9.75572ZM12.8314 11.0013C12.2714 11.9711 11.438 12.6807 10.4841 13.0917L11.2754 14.9285C12.6112 14.353 13.7809 13.3566 14.5634 12.0013L12.8314 11.0013ZM13.4562 7.82965C13.6008 8.88963 13.4082 10.0022 12.8314 11.0013L14.5634 12.0013C15.3697 10.6048 15.6403 9.0432 15.4379 7.55935L13.4562 7.82965ZM5.96072 1.97831C4.52816 2.53538 3.26705 3.56715 2.43907 5.00125L4.17113 6.00125C4.76337 4.97546 5.6619 4.2404 6.68556 3.84234L5.96072 1.97831ZM6.33478 7.13219C7.11497 5.78087 7.42731 4.28557 7.32043 2.83676L5.32585 2.9839C5.40414 4.04514 5.17618 5.13896 4.60273 6.13219L6.33478 7.13219ZM2.95149 10.0315C4.24894 9.43386 5.54945 8.49242 6.33478 7.13219L4.60273 6.13219C4.09152 7.01764 3.18075 7.72391 2.11479 8.21488L2.95149 10.0315ZM2.43907 5.00125C1.6719 6.33004 1.38957 7.80869 1.53861 9.22763L3.52767 9.01871C3.42126 8.00567 3.62209 6.95221 4.17113 6.00125L2.43907 5.00125ZM12.5013 1.57305C8.67491 -0.63609 3.78219 0.674911 1.57305 4.50125L3.3051 5.50125C4.96195 2.6315 8.6315 1.64825 11.5013 3.3051L12.5013 1.57305ZM15.4295 12.5013C17.6386 8.67491 16.3276 3.78219 12.5013 1.57305L11.5013 3.3051C14.371 4.96195 15.3543 8.6315 13.6974 11.5013L15.4295 12.5013ZM4.50125 15.4295C8.32759 17.6386 13.2203 16.3276 15.4295 12.5013L13.6974 11.5013C12.0406 14.371 8.37101 15.3543 5.50125 13.6974L4.50125 15.4295ZM1.57305 4.50125C-0.63609 8.32759 0.674911 13.2203 4.50125 15.4295L5.50125 13.6974C2.6315 12.0406 1.64825 8.37101 3.3051 5.50125L1.57305 4.50125Z" fill="currentColor" mask="url(#path-1-inside-1_1548_11413)"/>\n</svg>\n';
@@ -40890,10 +40930,11 @@ ${codeText}
     }
   }
   const list = "";
-  const toast = "";
+  const toast$1 = "";
   function showToast(text2, options) {
+    var _a;
     const toast2 = document.createElement("div");
-    toast2.classList.add("toast", "show");
+    toast2.classList.add("ones-editor-toast", "show");
     if (options == null ? void 0 : options.theme) {
       toast2.setAttribute("data-theme", options.theme);
     }
@@ -40910,13 +40951,29 @@ ${codeText}
       toast2.style.top = `${options.position.y}px`;
       toast2.classList.add("positioned");
     }
-    document.body.appendChild(toast2);
-    setTimeout(() => {
+    const exit = () => {
       toast2.classList.remove("show");
       setTimeout(() => {
         toast2.remove();
       }, 500);
-    }, (options == null ? void 0 : options.duration) || 3e3);
+    };
+    toast2.onclick = (e2) => {
+      var _a2;
+      if ((_a2 = options == null ? void 0 : options.onClick) == null ? void 0 : _a2.call(options, e2)) {
+        exit();
+      }
+    };
+    const autoClose = (_a = options == null ? void 0 : options.autoClose) != null ? _a : true;
+    if (!autoClose) {
+      const icon = createElement("span", ["close"], toast2);
+      icon.innerHTML = CloseIcon;
+      icon.onclick = exit;
+    }
+    document.body.appendChild(toast2);
+    if (options == null ? void 0 : options.autoClose) {
+      setTimeout(() => exit(), (options == null ? void 0 : options.duration) || 3e3);
+    }
+    return exit;
   }
   function initMenuItem$1(item, elem) {
     var _a, _b;
@@ -80608,7 +80665,7 @@ ${content}
       "preset-1": {
         name: i18n$1.t("callout.command.presetAlert"),
         backgroundColor: 2,
-        icon: WarningFilledIcon
+        icon: WarningFilledIcon.replaceAll('fill="currentColor"', 'fill="#F59300"')
       }
     };
     return presets[id];
@@ -81842,8 +81899,9 @@ ${content}
       const oldCode = this.getGraphData(data2).code;
       return oldCode !== code;
     }
-    createEmbedContent(content, blockData) {
+    createEmbedContent(blockContent, blockData) {
       const { code, src, height, flex = DEFAULT_FLEX, view } = this.getGraphData(blockData);
+      const content = createElement("div", ["embed-graph-wrapper"], blockContent);
       const header = createElement("div", ["embed-graph-header"], content, i18n$1.t(`graph.${this.graphType}`));
       this.viewSelect = new ViewSelect(header);
       this.viewSelect.addListener("viewChange", this.updateLayoutData);
@@ -81858,13 +81916,16 @@ ${content}
       const realView = this.getRealView(view);
       this.viewSelect.setSelectedView(realView);
       this.updateLayout(realView, flex);
-      this.updateHeight(content, height);
+      this.updateHeight(blockContent, height);
       this.updateDraw(src, code);
       setTimeout(() => {
         if (clientType.isMobile) {
           return;
         }
         const blockElement = this.editor.getBlockById(blockData.id);
+        if (!this.editor.readonly) {
+          addClass(blockElement, "no-highlighted");
+        }
         blockElement.addEventListener("mousedown", this.handleClick, { capture: true });
         EmbedBlockResizer.register(this.editor, blockElement, { maxHeight: GRAPH_MAX_HEIGHT, minHeight: GRAPH_MIN_HEIGHT });
       });
@@ -81987,6 +82048,9 @@ ${content}
     static get(editor, id) {
       return editor.addCustom(`${MERMAID_TYPE}_${id}`, () => new _MermaidInstance(editor));
     }
+    static destroyCustom(editor, id) {
+      editor.destroyCustom(`${MERMAID_TYPE}_${id}`);
+    }
     code2ObjectUrl(code) {
       return mermaidCodeToObjectUrl(this.editor, code);
     }
@@ -82113,8 +82177,7 @@ ${data2.mermaidText}
   }
   function handleDeleteBlock$2(editor, block) {
     const blockId = getBlockId(block);
-    const mermaid = MermaidInstance.get(editor, blockId);
-    mermaid.destroy();
+    MermaidInstance.destroyCustom(editor, blockId);
   }
   const MermaidEmbed = {
     embedType: MERMAID_TYPE,
@@ -82486,6 +82549,28 @@ ${data2.flowchartText}
 </add>
 </mxStylesheet>
 `;
+  const toast = "";
+  const showWarnToast = (exit) => {
+    const errorHTML = `<span class="toast-message">${WarningFilledIcon}${i18n$1.t("drawio.errorTips")} <a>\u8FD4\u56DE\u9875\u9762</a></span>`;
+    const onClick = (e2) => {
+      if (e2.target instanceof HTMLAnchorElement) {
+        exit();
+        return true;
+      }
+      return false;
+    };
+    const hide = showToast(errorHTML, {
+      autoClose: false,
+      position: {
+        y: 30,
+        x: window.innerWidth / 2
+      },
+      html: true,
+      onClick,
+      theme: "warn"
+    });
+    return hide;
+  };
   const BORDER = 0;
   const SAVE_DELAY_TIME = 30 * 1e3;
   const DRAWIO_EMPTY_CLASS = "editor-empty-drawio";
@@ -82626,9 +82711,12 @@ ${data2.flowchartText}
     }
   }
   function contactWithIframe(editor, block, drawIoData, iframe, loaded, exit, isInitializationCompleted2) {
+    let hide = () => {
+    };
     const destroy = () => {
       window.removeEventListener("message", receive);
       exit();
+      hide();
     };
     const loadingHandler = new LoadingHandler();
     loadingHandler.setLoading(iframe, i18n$1.t("drawio.loading"));
@@ -82649,15 +82737,16 @@ ${data2.flowchartText}
             }), "*");
             break;
           case "init":
-            if (xml != null) {
-              iframe.contentWindow.postMessage(JSON.stringify({
-                action: "load",
-                saveAndExit: 1,
-                noSaveBtn: 1,
-                noExitBtn: 0,
-                xml
-              }), "*");
+            if (xml == null) {
+              hide = showWarnToast(destroy);
             }
+            iframe.contentWindow.postMessage(JSON.stringify({
+              action: "load",
+              saveAndExit: 1,
+              noSaveBtn: 1,
+              noExitBtn: 0,
+              xml: xml || ""
+            }), "*");
             loaded();
             loadingHandler.removeLoading();
             break;
@@ -83117,6 +83206,38 @@ ${data2.flowchartText}
     getBlockProperties: getBlockProperties$3,
     convertTo: convertTo$3
   };
+  class DrawioPasteHandler {
+    constructor(editor) {
+      __publicField(this, "handleBeforePasteDoc", async (editor, doc2) => {
+        Object.values(doc2.blocks).forEach((blocks) => {
+          var _a;
+          for (let i = blocks.length - 1; i >= 0; i -= 1) {
+            const block = blocks[i];
+            if (block.type === "embed" && block.embedType === "drawio") {
+              const src = ((_a = block.embedData) == null ? void 0 : _a.src) || "";
+              if (!this.isSameOrigin(editor, doc2, src)) {
+                blocks.splice(i, 1);
+              }
+            }
+          }
+        });
+        return false;
+      });
+      this.editor = editor;
+      setTimeout(() => {
+        this.editor.input.addHandler(this);
+      });
+    }
+    isSameOrigin(editor, doc2, src) {
+      var _a, _b;
+      const apiServer = ((_b = (_a = editor.doc).getServerMeta) == null ? void 0 : _b.call(_a).apiServer) || window.location.origin;
+      const origin = new URL(apiServer).origin;
+      const docServer = src.startsWith("http") ? src : doc2.meta.apiServer;
+      return (docServer == null ? void 0 : docServer.startsWith(origin)) || false;
+    }
+    destroy() {
+    }
+  }
   const style = "";
   const logger$f = getLogger("plantuml-helper");
   const PLANTUML_TYPE = "plantuml";
@@ -88998,6 +89119,7 @@ ${data2.plantumlText}
     editor.addCustom("list-to-mention", () => new OnesEditorBlockMention(editor));
     editor.addCustom("code-caret", () => new OnesEditorCodeCaret(editor));
     editor.addCustom("image-paste-handler", () => new ImagePasteHandler(editor));
+    editor.addCustom("drawio-paste-handler", () => new DrawioPasteHandler(editor));
     editor.addCustom("layout-paste-handler", () => new LayoutBlockCaptionInputHandler(editor, true));
     if ((_n = options.componentsOptions) == null ? void 0 : _n.mention) {
       const mentionOptions = options.componentsOptions.mention;
@@ -89057,7 +89179,7 @@ ${data2.plantumlText}
         }
       }
     });
-    editor.version = "2.2.14-beta.15";
+    editor.version = "2.2.14-beta.17";
     return editor;
   }
   function isDoc(doc2) {
@@ -89129,6 +89251,7 @@ ${data2.plantumlText}
     } else {
       editor.addCustom("mobile-helper", () => new OnesEditorMobileHelper(editor));
     }
+    editor.addCustom("drawio-paste-handler", () => new DrawioPasteHandler(editor));
     editor.addCustom("image-paste-handler", () => new ImagePasteHandler(editor));
     if (enableComments) {
       editor.addCustom(
@@ -89158,7 +89281,7 @@ ${data2.plantumlText}
     });
     editor.addCustom(DOC_RE_AUTH_KEYS, (editor2) => new DocReAuthCallbacks(editor2));
     OnesEditorToolbar.register(editor);
-    editor.version = "2.2.14-beta.15";
+    editor.version = "2.2.14-beta.17";
     return editor;
   }
   async function showDocVersions(editor, options, serverUrl) {
@@ -134923,6 +135046,7 @@ ${data2.plantumlText}
   exports2.DocReAuthCallbacks = DocReAuthCallbacks;
   exports2.DragDrop = DragDrop;
   exports2.DrawioEmbed = DrawioEmbed;
+  exports2.DrawioPasteHandler = DrawioPasteHandler;
   exports2.EditorBlocks = EditorBlocks;
   exports2.EditorBoxes = EditorBoxes;
   exports2.EditorCommandProviders = EditorCommandProviders;

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@ones-editor/editor",
-  "version": "2.2.14-beta.15",
+  "version": "2.2.14-beta.17",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "dependencies": {