diff --git a/src/editor/dialogs/SePlainAlertDialog.js b/src/editor/dialogs/SePlainAlertDialog.js
new file mode 100644
index 00000000..6deb1261
--- /dev/null
+++ b/src/editor/dialogs/SePlainAlertDialog.js
@@ -0,0 +1,77 @@
+/* eslint-disable node/no-unpublished-import */
+import PlainAlertDialog from 'elix/src/plain/PlainAlertDialog.js';
+// import AlertDialog from 'elix/define/AlertDialog.js';
+import {defaultState, template} from 'elix/src/base/internal.js';
+import {fragmentFrom} from 'elix/src/core/htmlLiterals.js';
+import PlainBorderButton from 'elix/define/BorderButton.js';
+
+/**
+ * AlertDialog component in the Plain reference design system
+ *
+ * @inherits AlertDialog
+ * @mixes PlainModalOverlayMixin
+ * @part {PlainBorderButton} choice-button
+ */
+export default class SePlainAlertDialog extends PlainAlertDialog {
+ /**
+ * @function get
+ * @returns {PlainObject}
+ */
+ get [template] () {
+ const result = super[template];
+ // Replace the default slot with a new default slot and a button container.
+ const defaultSlot = result.content.querySelector('#frameContent');
+ if (defaultSlot) {
+ defaultSlot.replaceWith(fragmentFrom.html`
+
+ `);
+ }
+ console.log(result.content);
+
+ result.content.append(
+ fragmentFrom.html`
+
+ `
+ );
+ return result;
+ }
+}
+
+customElements.define('se-elix-alert-dialog', SePlainAlertDialog);
diff --git a/src/editor/dialogs/seAlertDialog.js b/src/editor/dialogs/seAlertDialog.js
index ef95c6df..8d83e2f8 100644
--- a/src/editor/dialogs/seAlertDialog.js
+++ b/src/editor/dialogs/seAlertDialog.js
@@ -1,8 +1,7 @@
-// eslint-disable-next-line node/no-unpublished-import
-import AlertDialog from 'elix/define/AlertDialog.js';
+import SePlainAlertDialog from './SePlainAlertDialog.js';
-const dialog = new AlertDialog();
const seAlert = (text) => {
+ const dialog = new SePlainAlertDialog();
dialog.textContent = text;
dialog.choices = ['Ok'];
dialog.open();
diff --git a/src/editor/dialogs/seConfirmDialog.js b/src/editor/dialogs/seConfirmDialog.js
index 66aa5cd0..eee1c0c1 100644
--- a/src/editor/dialogs/seConfirmDialog.js
+++ b/src/editor/dialogs/seConfirmDialog.js
@@ -1,8 +1,7 @@
-// eslint-disable-next-line node/no-unpublished-import
-import AlertDialog from 'elix/define/AlertDialog.js';
+import SePlainAlertDialog from './SePlainAlertDialog.js';
const seConfirm = async (text, choices) => {
- const dialog = new AlertDialog();
+ const dialog = new SePlainAlertDialog();
dialog.textContent = text;
dialog.choices = (choices === undefined) ? ['Ok', 'Cancel'] : choices;
dialog.open();
diff --git a/src/editor/dialogs/sePromptDialog.js b/src/editor/dialogs/sePromptDialog.js
index 10fdf802..b7e3a098 100644
--- a/src/editor/dialogs/sePromptDialog.js
+++ b/src/editor/dialogs/sePromptDialog.js
@@ -1,5 +1,4 @@
-// eslint-disable-next-line node/no-unpublished-import
-import AlertDialog from 'elix/define/AlertDialog.js';
+import SePlainAlertDialog from './SePlainAlertDialog.js';
/**
* @class SePromptDialog
*/
@@ -11,7 +10,7 @@ export class SePromptDialog extends HTMLElement {
super();
// create the shadowDom and insert the template
this._shadowRoot = this.attachShadow({mode: 'open'});
- this.dialog = new AlertDialog();
+ this.dialog = new SePlainAlertDialog();
}
/**
* @function observedAttributes
diff --git a/src/editor/dialogs/seSelectDialog.js b/src/editor/dialogs/seSelectDialog.js
index a02caf03..27f754bf 100644
--- a/src/editor/dialogs/seSelectDialog.js
+++ b/src/editor/dialogs/seSelectDialog.js
@@ -1,8 +1,7 @@
-// eslint-disable-next-line node/no-unpublished-import
-import AlertDialog from 'elix/define/AlertDialog.js';
+import SePlainAlertDialog from './SePlainAlertDialog.js';
-const dialog = new AlertDialog();
const seSelect = async (text, choices) => {
+ const dialog = new SePlainAlertDialog();
dialog.textContent = text;
dialog.choices = choices;
dialog.open();
diff --git a/src/editor/svgedit.js b/src/editor/svgedit.js
index f63ef3bc..cd3e980a 100644
--- a/src/editor/svgedit.js
+++ b/src/editor/svgedit.js
@@ -1250,7 +1250,7 @@ class Editor extends EditorStartup {
* @param {Event} e
* @returns {void} Resolves to `undefined`
*/
- saveSourceEditor (e) {
+ async saveSourceEditor (e) {
const $editorDialog = document.getElementById('se-svg-editor-dialog');
if ($editorDialog.getAttribute('dialog') !== 'open') return;
const saveChanges = () => {
@@ -1262,8 +1262,8 @@ class Editor extends EditorStartup {
};
if (!this.svgCanvas.setSvgString(e.detail.value)) {
- const ok = seConfirm(this.uiStrings.notification.QerrorsRevertToSource);
- if (!ok) {
+ const ok = await seConfirm(this.uiStrings.notification.QerrorsRevertToSource);
+ if (ok === false || ok === 'Cancel') {
return;
}
saveChanges();