@schukai/monster 3.99.1 → 3.99.3

package/source/components/form/action-button.mjs

@@ -31,7 +31,7 @@ import {
 	ATTRIBUTE_ERRORMESSAGE,
 	ATTRIBUTE_ROLE,
 } from "../../dom/constants.mjs";
-import {addErrorAttribute} from "../../dom/error.mjs";
+import { addErrorAttribute } from "../../dom/error.mjs";
 
 export { ActionButton };
 

package/source/components/form/api-button.mjs

@@ -35,7 +35,7 @@ import { ApiButtonStyleSheet } from "./stylesheet/api-button.mjs";
 import { isObject, isFunction } from "../../types/is.mjs";
 import { getGlobal } from "../../types/global.mjs";
 import { Formatter } from "../../text/formatter.mjs";
-import {addErrorAttribute} from "../../dom/error.mjs";
+import { addErrorAttribute } from "../../dom/error.mjs";
 export { ApiButton };
 
 /**

package/source/components/form/button-bar.mjs

@@ -41,7 +41,7 @@ import { STYLE_DISPLAY_MODE_BLOCK } from "./constants.mjs";
 import { ButtonBarStyleSheet } from "./stylesheet/button-bar.mjs";
 import { positionPopper } from "./util/floating-ui.mjs";
 import { convertToPixels } from "../../dom/dimension.mjs";
-import {addErrorAttribute} from "../../dom/error.mjs";
+import { addErrorAttribute } from "../../dom/error.mjs";
 export { ButtonBar };
 
 /**

package/source/components/form/button.mjs

@@ -30,7 +30,7 @@ import { ATTRIBUTE_BUTTON_CLASS } from "./constants.mjs";
 import { ButtonStyleSheet } from "./stylesheet/button.mjs";
 import { RippleStyleSheet } from "../stylesheet/ripple.mjs";
 import { fireCustomEvent } from "../../dom/events.mjs";
-import {addErrorAttribute} from "../../dom/error.mjs";
+import { addErrorAttribute } from "../../dom/error.mjs";
 
 export { Button };
 

package/source/components/form/context-error.mjs

@@ -24,7 +24,7 @@ import {
 	ATTRIBUTE_ERRORMESSAGE,
 	ATTRIBUTE_ROLE,
 } from "../../dom/constants.mjs";
-import {addErrorAttribute} from "../../dom/error.mjs";
+import { addErrorAttribute } from "../../dom/error.mjs";
 
 export { ContextError };
 

package/source/components/form/field-set.mjs

@@ -29,7 +29,7 @@ import { FieldSetStyleSheet } from "./stylesheet/field-set.mjs";
 import "../layout/collapse.mjs";
 import "./toggle-switch.mjs";
 import { getLocaleOfDocument } from "../../dom/locale.mjs";
-import {addErrorAttribute} from "../../dom/error.mjs";
+import { addErrorAttribute } from "../../dom/error.mjs";
 
 export { FieldSet };
 

package/source/components/form/popper-button.mjs

@@ -12,27 +12,27 @@
  * SPDX-License-Identifier: AGPL-3.0
  */
 
-import {instanceSymbol} from "../../constants.mjs";
-import {addAttributeToken} from "../../dom/attributes.mjs";
+import { instanceSymbol } from "../../constants.mjs";
+import { addAttributeToken } from "../../dom/attributes.mjs";
 import {
-    ATTRIBUTE_ERRORMESSAGE,
-    ATTRIBUTE_ROLE,
+	ATTRIBUTE_ERRORMESSAGE,
+	ATTRIBUTE_ROLE,
 } from "../../dom/constants.mjs";
 import {
-    assembleMethodSymbol,
-    registerCustomElement,
+	assembleMethodSymbol,
+	registerCustomElement,
 } from "../../dom/customelement.mjs";
-import {getDocument} from "../../dom/util.mjs";
-import {isFunction} from "../../types/is.mjs";
-import {DeadMansSwitch} from "../../util/deadmansswitch.mjs";
-import {Popper} from "./popper.mjs";
-import {STYLE_DISPLAY_MODE_BLOCK} from "./constants.mjs";
-import {PopperButtonStyleSheet} from "./stylesheet/popper-button.mjs";
-import {positionPopper} from "./util/floating-ui.mjs";
+import { getDocument } from "../../dom/util.mjs";
+import { isFunction } from "../../types/is.mjs";
+import { DeadMansSwitch } from "../../util/deadmansswitch.mjs";
+import { Popper } from "./popper.mjs";
+import { STYLE_DISPLAY_MODE_BLOCK } from "./constants.mjs";
+import { PopperButtonStyleSheet } from "./stylesheet/popper-button.mjs";
+import { positionPopper } from "./util/floating-ui.mjs";
 import "./button.mjs";
-import {addErrorAttribute} from "../../dom/error.mjs";
+import { addErrorAttribute } from "../../dom/error.mjs";
 
-export {PopperButton};
+export { PopperButton };
 
 /**
  * @private
@@ -141,205 +141,205 @@ const arrowElementSymbol = Symbol("arrowElement");
  * @fires monster-changed
  */
 class PopperButton extends Popper {
-    /**
-     * This method is called by the `instanceof` operator.
-     * @return {symbol}
-     * @since 2.1.0
-     */
-    static get [instanceSymbol]() {
-        return Symbol.for(
-            "@schukai/monster/components/form/popper-button@@instance",
-        );
-    }
-
-    /**
-     * To set the options via the HTML tag, the attribute `data-monster-options` must be used.
-     * @see {@link https://monsterjs.org/en/doc/#configurate-a-monster-control}
-     *
-     * The individual configuration values can be found in the table.
-     *
-     * @property {Object} templates - The templates for the control.
-     * @property {string} templates.main - The main template.
-     * @property {object} labels - The labels for the control.
-     * @property {string} labels.button - The label for the button.
-     * @property {string} content - The content of the popper.
-     * @property {object} popper - The popper options.
-     * @extends {Button.defaults}
-     */
-    get defaults() {
-        return Object.assign({}, super.defaults, {
-            templates: {
-                main: getTemplate(),
-            },
-            actions: {
-                click: (e) => {
-                    this.toggleDialog();
-                },
-            },
-            classes: {
-                button: "monster-button",
-            },
-            labels: {
-                button: '<slot name="button"></slot>',
-            },
-            mode: "click",
-            value: null,
-        });
-    }
-
-    /**
-     *
-     * @return {Monster.Components.Form.PopperButton}
-     */
-    [assembleMethodSymbol]() {
-        super[assembleMethodSymbol]();
-        initControlReferences.call(this);
-        initEventHandler.call(this);
-
-        return this;
-    }
-
-    /**
-     * @return {string}
-     */
-    static getTag() {
-        return "monster-popper-button";
-    }
-
-    /**
-     * @return {CSSStyleSheet[]}
-     */
-    static getCSSStyleSheet() {
-        const styles = super.getCSSStyleSheet();
-        styles.push(PopperButtonStyleSheet);
-        return styles;
-    }
-
-    /**
-     * @return {void}
-     */
-    connectedCallback() {
-        super.connectedCallback();
-
-        const document = getDocument();
-
-        for (const [, type] of Object.entries(["click", "touch"])) {
-            // close on outside ui-events
-            document.addEventListener(type, this[closeEventHandler]);
-        }
-
-        updatePopper.call(this);
-        attachResizeObserver.call(this);
-    }
-
-    /**
-     * @return {void}
-     */
-    disconnectedCallback() {
-        super.disconnectedCallback();
-
-        // close on outside ui-events
-        for (const [, type] of Object.entries(["click", "touch"])) {
-            document.removeEventListener(type, this[closeEventHandler]);
-        }
-
-        disconnectResizeObserver.call(this);
-    }
-
-    /**
-     * The Button.click() method simulates a click on the internal button element.
-     *
-     * @since 3.27.0
-     * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/click}
-     */
-    click() {
-        if (this.getOption("disabled") === true) {
-            return;
-        }
-
-        if (
-            this[buttonElementSymbol] &&
-            isFunction(this[buttonElementSymbol].click)
-        ) {
-            this[buttonElementSymbol].click();
-        }
-    }
-
-    /**
-     * The Button.focus() method sets focus on the internal button element.
-     *
-     * @since 3.27.0
-     * @param {Object} options
-     * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/focus}
-     */
-    focus(options) {
-        if (this.getOption("disabled") === true) {
-            return;
-        }
-
-        if (
-            this[buttonElementSymbol] &&
-            isFunction(this[buttonElementSymbol].focus)
-        ) {
-            this[buttonElementSymbol].focus(options);
-        }
-    }
-
-    /**
-     * The Button.blur() method removes focus from the internal button element.
-     */
-    blur() {
-        if (
-            this[buttonElementSymbol] &&
-            isFunction(this[buttonElementSymbol].blur)
-        ) {
-            this[buttonElementSymbol].blur();
-        }
-    }
-
-    /**
-     * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/attachInternals}
-     * @return {boolean}
-     */
-    static get formAssociated() {
-        return true;
-    }
-
-    /**
-     * The current selection of the Select
-     *
-     * ```
-     * e = document.querySelector('monster-select');
-     * console.log(e.value)
-     * // ↦ 1
-     * // ↦ ['1','2']
-     * ```
-     *
-     * @property {string|array}
-     */
-    get value() {
-        return this.getOption("value");
-    }
-
-    /**
-     * Set selection
-     *
-     * ```
-     * e = document.querySelector('monster-select');
-     * e.value=1
-     * ```
-     *
-     * @property {string|array} value
-     * @throws {Error} unsupported type
-     */
-    set value(value) {
-        this.setOption("value", value);
-        try {
-            this?.setFormValue(this.value);
-        } catch (e) {
-            addErrorAttribute(this, e);
-        }
-    }
+	/**
+	 * This method is called by the `instanceof` operator.
+	 * @return {symbol}
+	 * @since 2.1.0
+	 */
+	static get [instanceSymbol]() {
+		return Symbol.for(
+			"@schukai/monster/components/form/popper-button@@instance",
+		);
+	}
+
+	/**
+	 * To set the options via the HTML tag, the attribute `data-monster-options` must be used.
+	 * @see {@link https://monsterjs.org/en/doc/#configurate-a-monster-control}
+	 *
+	 * The individual configuration values can be found in the table.
+	 *
+	 * @property {Object} templates - The templates for the control.
+	 * @property {string} templates.main - The main template.
+	 * @property {object} labels - The labels for the control.
+	 * @property {string} labels.button - The label for the button.
+	 * @property {string} content - The content of the popper.
+	 * @property {object} popper - The popper options.
+	 * @extends {Button.defaults}
+	 */
+	get defaults() {
+		return Object.assign({}, super.defaults, {
+			templates: {
+				main: getTemplate(),
+			},
+			actions: {
+				click: (e) => {
+					this.toggleDialog();
+				},
+			},
+			classes: {
+				button: "monster-button",
+			},
+			labels: {
+				button: '<slot name="button"></slot>',
+			},
+			mode: "click",
+			value: null,
+		});
+	}
+
+	/**
+	 *
+	 * @return {Monster.Components.Form.PopperButton}
+	 */
+	[assembleMethodSymbol]() {
+		super[assembleMethodSymbol]();
+		initControlReferences.call(this);
+		initEventHandler.call(this);
+
+		return this;
+	}
+
+	/**
+	 * @return {string}
+	 */
+	static getTag() {
+		return "monster-popper-button";
+	}
+
+	/**
+	 * @return {CSSStyleSheet[]}
+	 */
+	static getCSSStyleSheet() {
+		const styles = super.getCSSStyleSheet();
+		styles.push(PopperButtonStyleSheet);
+		return styles;
+	}
+
+	/**
+	 * @return {void}
+	 */
+	connectedCallback() {
+		super.connectedCallback();
+
+		const document = getDocument();
+
+		for (const [, type] of Object.entries(["click", "touch"])) {
+			// close on outside ui-events
+			document.addEventListener(type, this[closeEventHandler]);
+		}
+
+		updatePopper.call(this);
+		attachResizeObserver.call(this);
+	}
+
+	/**
+	 * @return {void}
+	 */
+	disconnectedCallback() {
+		super.disconnectedCallback();
+
+		// close on outside ui-events
+		for (const [, type] of Object.entries(["click", "touch"])) {
+			document.removeEventListener(type, this[closeEventHandler]);
+		}
+
+		disconnectResizeObserver.call(this);
+	}
+
+	/**
+	 * The Button.click() method simulates a click on the internal button element.
+	 *
+	 * @since 3.27.0
+	 * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/click}
+	 */
+	click() {
+		if (this.getOption("disabled") === true) {
+			return;
+		}
+
+		if (
+			this[buttonElementSymbol] &&
+			isFunction(this[buttonElementSymbol].click)
+		) {
+			this[buttonElementSymbol].click();
+		}
+	}
+
+	/**
+	 * The Button.focus() method sets focus on the internal button element.
+	 *
+	 * @since 3.27.0
+	 * @param {Object} options
+	 * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/focus}
+	 */
+	focus(options) {
+		if (this.getOption("disabled") === true) {
+			return;
+		}
+
+		if (
+			this[buttonElementSymbol] &&
+			isFunction(this[buttonElementSymbol].focus)
+		) {
+			this[buttonElementSymbol].focus(options);
+		}
+	}
+
+	/**
+	 * The Button.blur() method removes focus from the internal button element.
+	 */
+	blur() {
+		if (
+			this[buttonElementSymbol] &&
+			isFunction(this[buttonElementSymbol].blur)
+		) {
+			this[buttonElementSymbol].blur();
+		}
+	}
+
+	/**
+	 * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/attachInternals}
+	 * @return {boolean}
+	 */
+	static get formAssociated() {
+		return true;
+	}
+
+	/**
+	 * The current selection of the Select
+	 *
+	 * ```
+	 * e = document.querySelector('monster-select');
+	 * console.log(e.value)
+	 * // ↦ 1
+	 * // ↦ ['1','2']
+	 * ```
+	 *
+	 * @property {string|array}
+	 */
+	get value() {
+		return this.getOption("value");
+	}
+
+	/**
+	 * Set selection
+	 *
+	 * ```
+	 * e = document.querySelector('monster-select');
+	 * e.value=1
+	 * ```
+	 *
+	 * @property {string|array} value
+	 * @throws {Error} unsupported type
+	 */
+	set value(value) {
+		this.setOption("value", value);
+		try {
+			this?.setFormValue(this.value);
+		} catch (e) {
+			addErrorAttribute(this, e);
+		}
+	}
 }
 
 /**
@@ -347,67 +347,67 @@ class PopperButton extends Popper {
  * @return {initEventHandler}
  */
 function initEventHandler() {
-    this[closeEventHandler] = (event) => {
-        const path = event.composedPath();
-
-        for (const [, element] of Object.entries(path)) {
-            if (element === this) {
-                return;
-            }
-        }
-        this.hideDialog();
-    };
-
-    return this;
+	this[closeEventHandler] = (event) => {
+		const path = event.composedPath();
+
+		for (const [, element] of Object.entries(path)) {
+			if (element === this) {
+				return;
+			}
+		}
+		this.hideDialog();
+	};
+
+	return this;
 }
 
 /**
  * @private
  */
 function attachResizeObserver() {
-    // against flickering
-    this[resizeObserverSymbol] = new ResizeObserver(() => {
-        if (this[timerCallbackSymbol] instanceof DeadMansSwitch) {
-            try {
-                this[timerCallbackSymbol].touch();
-                return;
-            } catch (e) {
-                delete this[timerCallbackSymbol];
-            }
-        }
-
-        this[timerCallbackSymbol] = new DeadMansSwitch(200, () => {
-            updatePopper.call(this);
-        });
-    });
-
-    this[resizeObserverSymbol].observe(this.parentElement);
+	// against flickering
+	this[resizeObserverSymbol] = new ResizeObserver(() => {
+		if (this[timerCallbackSymbol] instanceof DeadMansSwitch) {
+			try {
+				this[timerCallbackSymbol].touch();
+				return;
+			} catch (e) {
+				delete this[timerCallbackSymbol];
+			}
+		}
+
+		this[timerCallbackSymbol] = new DeadMansSwitch(200, () => {
+			updatePopper.call(this);
+		});
+	});
+
+	this[resizeObserverSymbol].observe(this.parentElement);
 }
 
 function disconnectResizeObserver() {
-    if (this[resizeObserverSymbol] instanceof ResizeObserver) {
-        this[resizeObserverSymbol].disconnect();
-    }
+	if (this[resizeObserverSymbol] instanceof ResizeObserver) {
+		this[resizeObserverSymbol].disconnect();
+	}
 }
 
 /**
  * @private
  */
 function updatePopper() {
-    if (this[popperElementSymbol].style.display !== STYLE_DISPLAY_MODE_BLOCK) {
-        return;
-    }
-
-    if (this.getOption("disabled", false) === true) {
-        return;
-    }
-
-    positionPopper.call(
-        this,
-        this[controlElementSymbol],
-        this[popperElementSymbol],
-        this.getOption("popper", {}),
-    );
+	if (this[popperElementSymbol].style.display !== STYLE_DISPLAY_MODE_BLOCK) {
+		return;
+	}
+
+	if (this.getOption("disabled", false) === true) {
+		return;
+	}
+
+	positionPopper.call(
+		this,
+		this[controlElementSymbol],
+		this[popperElementSymbol],
+		this.getOption("popper", {}),
+	);
 }
 
 /**
@@ -415,21 +415,21 @@ function updatePopper() {
  * @return {Select}
  */
 function initControlReferences() {
-    this[controlElementSymbol] = this.shadowRoot.querySelector(
-        `[${ATTRIBUTE_ROLE}=control]`,
-    );
+	this[controlElementSymbol] = this.shadowRoot.querySelector(
+		`[${ATTRIBUTE_ROLE}=control]`,
+	);
 
-    this[buttonElementSymbol] = this.shadowRoot.querySelector(
-        `[${ATTRIBUTE_ROLE}=button]`,
-    );
+	this[buttonElementSymbol] = this.shadowRoot.querySelector(
+		`[${ATTRIBUTE_ROLE}=button]`,
+	);
 
-    this[popperElementSymbol] = this.shadowRoot.querySelector(
-        `[${ATTRIBUTE_ROLE}=popper]`,
-    );
+	this[popperElementSymbol] = this.shadowRoot.querySelector(
+		`[${ATTRIBUTE_ROLE}=popper]`,
+	);
 
-    this[arrowElementSymbol] = this.shadowRoot.querySelector(
-        `[${ATTRIBUTE_ROLE}=arrow]`,
-    );
+	this[arrowElementSymbol] = this.shadowRoot.querySelector(
+		`[${ATTRIBUTE_ROLE}=arrow]`,
+	);
 }
 
 /**
@@ -437,8 +437,8 @@ function initControlReferences() {
  * @return {string}
  */
 function getTemplate() {
-    // language=HTML
-    return `
+	// language=HTML
+	return `
         <div data-monster-role="control" part="control">
             <button data-monster-attributes="disabled path:disabled | if:true, class path:classes.button"
                     data-monster-role="button"