feat(api-bar): return the fetched map

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>

source/components/form/api-bar.mjs

@@ -168,6 +168,7 @@ class ApiBar extends ButtonBar {
 			) {
 				this.importButtons(map);
 			}
+			return map;
 		});
 	}
 

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();

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));