diff --git a/source/components/datatable/save-button.mjs b/source/components/datatable/save-button.mjs
index 4bc5d7736f3aac9c3b4a373202db3dc6c24b262d..8a4d6d5404e7cb4294e088817e08a2fc6528f326 100644
--- a/source/components/datatable/save-button.mjs
+++ b/source/components/datatable/save-button.mjs
@@ -32,7 +32,7 @@ import { Datasource } from "./datasource.mjs";
import { Rest as RestDatasource } from "./datasource/rest.mjs";
import { BadgeStyleSheet } from "../stylesheet/badge.mjs";
import { SaveButtonStyleSheet } from "./stylesheet/save-button.mjs";
-import "../form/state-button.mjs";
+import "../form/message-state-button.mjs";
import {
handleDataSourceChanges,
@@ -315,12 +315,13 @@ function getTranslations() {
* @throws {Error} the selector must match exactly one element
*/
function initControlReferences() {
+
if (!this.shadowRoot) {
throw new Error("no shadow-root is defined");
}
this[stateButtonElementSymbol] = this.shadowRoot.querySelector(
- "[data-monster-role=state-button]",
+ "[data-monster-role=save-button]",
);
this[badgeElementSymbol] = this.shadowRoot.querySelector(
@@ -332,9 +333,9 @@ function initControlReferences() {
const states = {
changed: new State(
"changed",
- '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-cloud-arrow-up" viewBox="0 0 16 16">\n' +
- ' <path fill-rule="evenodd" d="M7.646 5.146a.5.5 0 0 1 .708 0l2 2a.5.5 0 0 1-.708.708L8.5 6.707V10.5a.5.5 0 0 1-1 0V6.707L6.354 7.854a.5.5 0 1 1-.708-.708z"/>\n' +
- ' <path d="M4.406 3.342A5.53 5.53 0 0 1 8 2c2.69 0 4.923 2 5.166 4.579C14.758 6.804 16 8.137 16 9.773 16 11.569 14.502 13 12.687 13H3.781C1.708 13 0 11.366 0 9.318c0-1.763 1.266-3.223 2.942-3.593.143-.863.698-1.723 1.464-2.383m.653.757c-.757.653-1.153 1.44-1.153 2.056v.448l-.445.049C2.064 6.805 1 7.952 1 9.318 1 10.785 2.23 12 3.781 12h8.906C13.98 12 15 10.988 15 9.773c0-1.216-1.02-2.228-2.313-2.228h-.5v-.5C12.188 4.825 10.328 3 8 3a4.53 4.53 0 0 0-2.941 1.1z"/>\n' +
+ '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-cloud-arrow-up" viewBox="0 0 16 16">' +
+ '<path fill-rule="evenodd" d="M7.646 5.146a.5.5 0 0 1 .708 0l2 2a.5.5 0 0 1-.708.708L8.5 6.707V10.5a.5.5 0 0 1-1 0V6.707L6.354 7.854a.5.5 0 1 1-.708-.708z"/>' +
+ '<path d="M4.406 3.342A5.53 5.53 0 0 1 8 2c2.69 0 4.923 2 5.166 4.579C14.758 6.804 16 8.137 16 9.773 16 11.569 14.502 13 12.687 13H3.781C1.708 13 0 11.366 0 9.318c0-1.763 1.266-3.223 2.942-3.593.143-.863.698-1.723 1.464-2.383m.653.757c-.757.653-1.153 1.44-1.153 2.056v.448l-.445.049C2.064 6.805 1 7.952 1 9.318 1 10.785 2.23 12 3.781 12h8.906C13.98 12 15 10.988 15 9.773c0-1.216-1.02-2.228-2.313-2.228h-.5v-.5C12.188 4.825 10.328 3 8 3a4.53 4.53 0 0 0-2.941 1.1z"/>' +
"</svg>",
),
};
@@ -346,6 +347,9 @@ function initControlReferences() {
"labels.button",
this.getOption("labels.button"),
);
+
+ console.log(this[stateButtonElementSymbol])
+
});
}
@@ -399,7 +403,9 @@ function getTemplate() {
return `
<div data-monster-role="control" part="control"
data-monster-attributes="disabled path:disabled | if:true">
- <monster-state-button data-monster-role="state-button">save</monster-state-button>
+ <monster-message-state-button part="button"
+ data-monster-role="save-button"
+ ></monster-message-state-button>
<div data-monster-attributes="disabled path:disabled | if:true, class path:classes.badge"
data-monster-role="badge"
data-monster-replace="path:changes"></div>
diff --git a/source/components/form/api-bar.mjs b/source/components/form/api-bar.mjs
index ac8dac636eb9ad389b01dcc6862c7dffd5a8d42b..9ecbc7837ac2f206e4c3f70d8a9228cc232218b8 100644
--- a/source/components/form/api-bar.mjs
+++ b/source/components/form/api-bar.mjs
@@ -168,6 +168,7 @@ class ApiBar extends ButtonBar {
) {
this.importButtons(map);
}
+ return map;
});
}
diff --git a/source/components/form/message-state-button.mjs b/source/components/form/message-state-button.mjs
index 23bccde84b8f79907a79a27c7109881d45a48677..0b8e8e859ff89c1db917a7ac368e6009cfef9e05 100644
--- a/source/components/form/message-state-button.mjs
+++ b/source/components/form/message-state-button.mjs
@@ -69,6 +69,9 @@ class MessageStateButton extends Popper {
* @throws {TypeError} value is not an instance
*/
setState(state, timeout) {
+
+ console.log(this[buttonElementSymbol]);
+
return this[buttonElementSymbol].setState(state, timeout);
}
@@ -81,7 +84,7 @@ class MessageStateButton extends Popper {
}
/**
- * @return {Monster.Components.Form.Types.State|undefined}
+ * @return {MessageStateButton|undefined}
*/
getState() {
return this[buttonElementSymbol].getState();
diff --git a/source/components/form/state-button.mjs b/source/components/form/state-button.mjs
index 612a2ecc645121096db055108e5da5565c4ea3fd..28a10366948615a7f00c3c78073d1b11b8cc619e 100644
--- a/source/components/form/state-button.mjs
+++ b/source/components/form/state-button.mjs
@@ -107,7 +107,7 @@ class StateButton extends Button {
const obj = this.getOption(`states.${validateString(state)}`);
if (obj === undefined) {
- throw new Error("not found");
+ throw new Error("state not found");
}
this.setOption("current", validateInstance(obj, State));