@breadstone/mosaik-elements-foundation 0.0.226 → 0.0.227

package/Controls/Components/Primitives/Abstracts/Adorner/AdornerElement.d.ts

@@ -3,8 +3,76 @@ import { CustomElement } from '../../../Abstracts/CustomElement';
 import type { IAdornerElementProps } from './IAdornerElementProps';
 declare const AdornerElement_base: import("../../../../../Index").ControlBehaviorReturn<import("../../../../../Index").ControlBehaviorReturn<typeof CustomElement, IAttachable>, import("../../../../Behaviors/Disableable").IDisableableProps>;
 /**
- * The `{@link AdornerElement}` element.
+ * Adorner - Abstract base class for decorative overlay elements attached to controls.
  *
+ * @description
+ * The AdornerElement provides foundational functionality for creating decorative overlay elements
+ * that attach to and enhance other controls. Adorners are lightweight UI enhancements that appear
+ * in response to mouse interactions (hover, move, leave, down) and can be positioned relative to
+ * their target control using the Attachable behavior. Common use cases include tooltips, badges,
+ * resize handles, selection indicators, and contextual helpers. This abstract class manages the
+ * lifecycle of adorner DOM elements, handles mouse event subscriptions, and provides extension
+ * points for subclasses to implement custom show/hide behavior.
+ *
+ * @name Adorner
+ * @category Primitives
+ *
+ * @dependency {Attachable} - Positioning behavior for attaching to target elements
+ * @dependency {Disableable} - Disabled state management
+ *
+ * @example
+ * Creating a simple tooltip adorner:
+ * ```typescript
+ * export class TooltipElement extends AdornerElement {
+ *     protected show(): void {
+ *         const tooltip = this.create<HTMLDivElement>({
+ *             classes: 'mosaik-tooltip'
+ *         });
+ *         tooltip.textContent = this.getAttribute('tooltip-text') || '';
+ *     }
+ *
+ *     protected hide(): void {
+ *         this.dispose();
+ *     }
+ * }
+ * ```
+ *
+ * @example
+ * Creating a badge adorner:
+ * ```typescript
+ * export class BadgeAdorner extends AdornerElement {
+ *     private _badgeElement: HTMLElement | null = null;
+ *
+ *     protected show(): void {
+ *         if (!this._badgeElement) {
+ *             this._badgeElement = this.create<HTMLDivElement>({
+ *                 classes: ['mosaik-badge', 'mosaik-badge-corner']
+ *             });
+ *         }
+ *         this._badgeElement.style.display = 'block';
+ *     }
+ *
+ *     protected hide(): void {
+ *         if (this._badgeElement) {
+ *             this._badgeElement.style.display = 'none';
+ *         }
+ *     }
+ * }
+ * ```
+ *
+ * @example
+ * Using adorner with attachment configuration:
+ * ```html
+ * <mosaik-button control="my-button">Click Me</mosaik-button>
+ * <custom-tooltip-adorner
+ *     control="my-button"
+ *     tooltip-text="Click to perform action"
+ *     placement="top"
+ *     offset="8">
+ * </custom-tooltip-adorner>
+ * ```
+ *
+ * @abstract
  * @public
  */
 export declare abstract class AdornerElement extends AdornerElement_base implements IAdornerElementProps, IAttachable {

package/Controls/Components/Primitives/Abstracts/Adorner/AdornerElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AdornerElement.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Primitives/Abstracts/Adorner/AdornerElement.ts"],"names":[],"mappings":"AAIA,OAAO,EAAc,KAAK,WAAW,EAAE,MAAM,kCAAkC,CAAC;AAEhF,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AACjE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;;AAInE;;;;GAIG;AACH,8BAAsB,cAClB,SAAQ,mBACR,YAAW,oBAAoB,EAAE,WAAW;IAI5C,OAAO,CAAC,eAAe,CAAqB;IAC5C,OAAO,CAAC,uBAAuB,CAAoC;IACnE,OAAO,CAAC,sBAAsB,CAAoC;IAClE,OAAO,CAAC,uBAAuB,CAAoC;IACnE,OAAO,CAAC,sBAAsB,CAAoC;IAMlE;;OAEG;;IAcH;;;;;;;OAOG;IACH,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAMD;;;OAGG;cACgB,eAAe,IAAI,IAAI;IAW1C;;;OAGG;IACa,oBAAoB,IAAI,IAAI;IAQ5C;;;OAGG;IACH,SAAS,CAAC,QAAQ,CAAC,IAAI,IAAI,IAAI;IAE/B;;;OAGG;IACH,SAAS,CAAC,QAAQ,CAAC,IAAI,IAAI,IAAI;IAE/B;;OAEG;IACH,SAAS,CAAC,MAAM,CAAC,CAAC,SAAS,WAAW,EAAE,MAAM,EAAE;QAAE,MAAM,CAAC,EAAE,GAAG,CAAC;QAC3D,OAAO,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,GAAG,MAAM,CAAC;KAAE,GAAG,CAAC;IAkB3C;;OAEG;IACH,SAAS,CAAC,OAAO,IAAI,IAAI;CAY5B"}
+{"version":3,"file":"AdornerElement.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Primitives/Abstracts/Adorner/AdornerElement.ts"],"names":[],"mappings":"AAIA,OAAO,EAAc,KAAK,WAAW,EAAE,MAAM,kCAAkC,CAAC;AAEhF,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AACjE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;;AAInE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwEG;AACH,8BAAsB,cAClB,SAAQ,mBACR,YAAW,oBAAoB,EAAE,WAAW;IAI5C,OAAO,CAAC,eAAe,CAAqB;IAC5C,OAAO,CAAC,uBAAuB,CAAoC;IACnE,OAAO,CAAC,sBAAsB,CAAoC;IAClE,OAAO,CAAC,uBAAuB,CAAoC;IACnE,OAAO,CAAC,sBAAsB,CAAoC;IAMlE;;OAEG;;IAcH;;;;;;;OAOG;IACH,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAMD;;;OAGG;cACgB,eAAe,IAAI,IAAI;IAW1C;;;OAGG;IACa,oBAAoB,IAAI,IAAI;IAQ5C;;;OAGG;IACH,SAAS,CAAC,QAAQ,CAAC,IAAI,IAAI,IAAI;IAE/B;;;OAGG;IACH,SAAS,CAAC,QAAQ,CAAC,IAAI,IAAI,IAAI;IAE/B;;OAEG;IACH,SAAS,CAAC,MAAM,CAAC,CAAC,SAAS,WAAW,EAAE,MAAM,EAAE;QAAE,MAAM,CAAC,EAAE,GAAG,CAAC;QAC3D,OAAO,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,GAAG,MAAM,CAAC;KAAE,GAAG,CAAC;IAkB3C;;OAEG;IACH,SAAS,CAAC,OAAO,IAAI,IAAI;CAY5B"}

package/Controls/Components/Primitives/Abstracts/Adorner/AdornerElement.js

@@ -6,8 +6,76 @@ import { Disableable } from '../../../../Behaviors/Disableable';
 import { CustomElement } from '../../../Abstracts/CustomElement';
 // #endregion
 /**
- * The `{@link AdornerElement}` element.
+ * Adorner - Abstract base class for decorative overlay elements attached to controls.
  *
+ * @description
+ * The AdornerElement provides foundational functionality for creating decorative overlay elements
+ * that attach to and enhance other controls. Adorners are lightweight UI enhancements that appear
+ * in response to mouse interactions (hover, move, leave, down) and can be positioned relative to
+ * their target control using the Attachable behavior. Common use cases include tooltips, badges,
+ * resize handles, selection indicators, and contextual helpers. This abstract class manages the
+ * lifecycle of adorner DOM elements, handles mouse event subscriptions, and provides extension
+ * points for subclasses to implement custom show/hide behavior.
+ *
+ * @name Adorner
+ * @category Primitives
+ *
+ * @dependency {Attachable} - Positioning behavior for attaching to target elements
+ * @dependency {Disableable} - Disabled state management
+ *
+ * @example
+ * Creating a simple tooltip adorner:
+ * ```typescript
+ * export class TooltipElement extends AdornerElement {
+ *     protected show(): void {
+ *         const tooltip = this.create<HTMLDivElement>({
+ *             classes: 'mosaik-tooltip'
+ *         });
+ *         tooltip.textContent = this.getAttribute('tooltip-text') || '';
+ *     }
+ *
+ *     protected hide(): void {
+ *         this.dispose();
+ *     }
+ * }
+ * ```
+ *
+ * @example
+ * Creating a badge adorner:
+ * ```typescript
+ * export class BadgeAdorner extends AdornerElement {
+ *     private _badgeElement: HTMLElement | null = null;
+ *
+ *     protected show(): void {
+ *         if (!this._badgeElement) {
+ *             this._badgeElement = this.create<HTMLDivElement>({
+ *                 classes: ['mosaik-badge', 'mosaik-badge-corner']
+ *             });
+ *         }
+ *         this._badgeElement.style.display = 'block';
+ *     }
+ *
+ *     protected hide(): void {
+ *         if (this._badgeElement) {
+ *             this._badgeElement.style.display = 'none';
+ *         }
+ *     }
+ * }
+ * ```
+ *
+ * @example
+ * Using adorner with attachment configuration:
+ * ```html
+ * <mosaik-button control="my-button">Click Me</mosaik-button>
+ * <custom-tooltip-adorner
+ *     control="my-button"
+ *     tooltip-text="Click to perform action"
+ *     placement="top"
+ *     offset="8">
+ * </custom-tooltip-adorner>
+ * ```
+ *
+ * @abstract
  * @public
  */
 export class AdornerElement extends Disableable(Attachable(CustomElement)) {

package/Controls/Components/Primitives/Abstracts/Adorner/AdornerElement.js.map

@@ -1 +1 @@
-{"version":3,"file":"AdornerElement.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Primitives/Abstracts/Adorner/AdornerElement.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"AdornerElement.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Primitives/Abstracts/Adorner/AdornerElement.ts"],"names":[],"mappings":"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"}

package/Controls/Components/Primitives/Abstracts/Toggable/ToggableElement.d.ts

@@ -1,26 +1,92 @@
 import { IEventEmitter } from '@breadstone/mosaik-elements';
+import type { ICheckedEventDetail, IIndeterminateEventDetail, IUncheckedEventDetail } from '../../../../events';
 import { CustomElement } from '../../../Abstracts/CustomElement';
-import type { IToggableCheckedEvent, IToggableCheckedEventDetail } from './Events/ToggableCheckedEventDetail';
-import type { IToggableIndeterminateEvent, IToggableIndeterminateEventDetail } from './Events/ToggableIndeterminateEventDetail';
-import type { IToggableUncheckedEvent } from './Events/ToggableUncheckedEventDetail';
-import type { IToggableElementEvents } from './IToggableElementEvents';
 import type { IToggableElementProps } from './IToggableElementProps';
 declare const ToggableElement_base: import("../../../../../Index").ControlBehaviorReturn<typeof CustomElement, import("../../../../Behaviors/Focusable").IFocusableProps>;
 /**
- * The {@link ToggableElement} is a abstract base class for a toggable behavior.
+ * Toggable - Abstract base class for elements with toggleable checked/unchecked states.
  *
- * @fires checked - Called when the element is checked.
- * @fires unchecked - Called when the element is unchecked.
- * @fires indeterminate - Called when the element is indeterminate.
+ * @description
+ * The ToggableElement provides comprehensive toggle behavior for interactive components that
+ * support checked, unchecked, and optionally indeterminate states. This abstract base class
+ * implements the complete state management lifecycle including keyboard interaction (Space/Enter
+ * keys), state transition logic, and event emission for state changes. It supports both two-state
+ * (checked/unchecked) and three-state (checked/unchecked/indeterminate) modes, making it ideal
+ * as a foundation for checkboxes, radio buttons, toggle switches, expandable sections, and other
+ * binary or tri-state UI controls. The class leverages the Focusable behavior for keyboard
+ * accessibility and provides convenient methods (check, uncheck, toggle) for programmatic control.
  *
- * @keyhandle Space - Toggles the element.
- * @keyhandle Enter - Toggles the element.
+ * @name Toggable
+ * @category Primitives
  *
+ * @dependency {Focusable} - Focus management and keyboard interaction support
+ * @dependency {KeyboardController} - Keyboard event handling and key binding management
+ *
+ * @fires checked {CheckedEvent} - Dispatched when the element transitions to checked state (isChecked = true)
+ * @fires unchecked {UncheckedEvent} - Dispatched when the element transitions to unchecked state (isChecked = false)
+ * @fires indeterminate {IndeterminateEvent} - Dispatched when the element transitions to indeterminate state (isChecked = null, requires isThreeState = true)
+ *
+ * @example
+ * Creating a custom checkbox component:
+ * ```typescript
+ * @Component({
+ *     selector: 'mosaik-checkbox',
+ *     template: checkboxTemplate
+ * })
+ * export class CheckboxElement extends ToggableElement {
+ *     public constructor() {
+ *         super();
+ *         this.isThreeState = false;
+ *     }
+ * }
+ * ```
+ *
+ * @example
+ * Using three-state toggle:
+ * ```html
+ * <custom-toggle is-three-state>
+ *     <!-- Cycles through: unchecked → checked → indeterminate → unchecked -->
+ * </custom-toggle>
+ * ```
+ *
+ * @example
+ * Programmatic control:
+ * ```typescript
+ * const toggle = document.querySelector('custom-toggle');
+ * toggle.check();      // Set to checked
+ * toggle.uncheck();    // Set to unchecked
+ * toggle.toggle();     // Cycle to next state
+ *
+ * // Listen to state changes
+ * toggle.checked.subscribe(() => {
+ *     console.log('Element is now checked');
+ * });
+ * ```
+ *
+ * @example
+ * Handling indeterminate state for parent-child relationships:
+ * ```typescript
+ * class SelectAllCheckbox extends ToggableElement {
+ *     private updateFromChildren(children: Array<CheckboxElement>): void {
+ *         const allChecked = children.every(c => c.isChecked);
+ *         const someChecked = children.some(c => c.isChecked);
+ *
+ *         this.isThreeState = true;
+ *         if (allChecked) {
+ *             this.isChecked = true;
+ *         } else if (someChecked) {
+ *             this.isChecked = null;  // Indeterminate
+ *         } else {
+ *             this.isChecked = false;
+ *         }
+ *     }
+ * }
+ * ```
  *
- * @public
  * @abstract
+ * @public
  */
-export declare class ToggableElement extends ToggableElement_base implements IToggableElementProps, IToggableElementEvents {
+export declare class ToggableElement extends ToggableElement_base implements IToggableElementProps {
     private readonly _checked;
     private readonly _unchecked;
     private readonly _indeterminate;
@@ -56,31 +122,31 @@ export declare class ToggableElement extends ToggableElement_base implements ITo
     set isThreeState(value: boolean);
     /**
      * Called when the `isChecked` property is `true`.
-     * Provides reference to the `{@link IToggableCheckedEventDetail}` as event argument.
+     * Provides reference to the `{@link ICheckedEventDetail}` as event argument.
      *
      * @public
      * @eventProperty
      * @readonly
      */
-    get checked(): IEventEmitter<IToggableCheckedEventDetail>;
+    get checked(): IEventEmitter<ICheckedEventDetail>;
     /**
      * Called when the `isChecked` property is `false`.
-     * Provides reference to the `{@link IToggableCheckedEventDetail}` as event argument.
+     * Provides reference to the `{@link IUncheckedEventDetail}` as event argument.
      *
      * @public
      * @eventProperty
      * @readonly
      */
-    get unchecked(): IEventEmitter<IToggableCheckedEventDetail>;
+    get unchecked(): IEventEmitter<IUncheckedEventDetail>;
     /**
      * Called when the `isChecked` property is `null`.
-     * Provides reference to the `{@link IToggableIndeterminateEventDetail}` as event argument.
+     * Provides reference to the `{@link IIndeterminateEventDetail}` as event argument.
      *
      * @public
      * @eventProperty
      * @readonly
      */
-    get indeterminate(): IEventEmitter<IToggableIndeterminateEventDetail>;
+    get indeterminate(): IEventEmitter<IIndeterminateEventDetail>;
     /**
      * @public
      * @override
@@ -115,11 +181,6 @@ export declare class ToggableElement extends ToggableElement_base implements ITo
  * @public
  */
 declare global {
-    interface HTMLElementEventMap {
-        checked: IToggableCheckedEvent;
-        unchecked: IToggableUncheckedEvent;
-        indeterminate: IToggableIndeterminateEvent;
-    }
 }
 export {};
 //# sourceMappingURL=ToggableElement.d.ts.map

package/Controls/Components/Primitives/Abstracts/Toggable/ToggableElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ToggableElement.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Primitives/Abstracts/Toggable/ToggableElement.ts"],"names":[],"mappings":"AAGA,OAAO,EAA2B,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAKrF,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AACjE,OAAO,KAAK,EAAE,qBAAqB,EAAE,2BAA2B,EAAE,MAAM,qCAAqC,CAAC;AAC9G,OAAO,KAAK,EAAE,2BAA2B,EAAE,iCAAiC,EAAE,MAAM,2CAA2C,CAAC;AAChI,OAAO,KAAK,EAAE,uBAAuB,EAAiC,MAAM,uCAAuC,CAAC;AACpH,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AACvE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;;AAIrE;;;;;;;;;;;;;GAaG;AACH,qBAAa,eAAgB,SAAQ,oBAAyB,YAAW,qBAAqB,EAAE,sBAAsB;IAIlH,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAA6C;IACtE,OAAO,CAAC,QAAQ,CAAC,UAAU,CAA+C;IAC1E,OAAO,CAAC,QAAQ,CAAC,cAAc,CAAmD;IAClF,OAAO,CAAC,QAAQ,CAAC,mBAAmB,CAAqB;IACzD,OAAO,CAAC,UAAU,CAAiB;IACnC,OAAO,CAAC,aAAa,CAAU;;IAqB/B;;;;;;;OAOG;IACH,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;;OAKG;IACH,IAIW,SAAS,IAAI,OAAO,GAAG,IAAI,CAErC;IAED,IAAW,SAAS,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI,EAazC;IAED;;;;;;OAMG;IACH,IAIW,YAAY,IAAI,OAAO,CAEjC;IAED,IAAW,YAAY,CAAC,KAAK,EAAE,OAAO,EAKrC;IAED;;;;;;;OAOG;IACH,IACW,OAAO,IAAI,aAAa,CAAC,2BAA2B,CAAC,CAE/D;IAED;;;;;;;OAOG;IACH,IACW,SAAS,IAAI,aAAa,CAAC,2BAA2B,CAAC,CAEjE;IAED;;;;;;;OAOG;IACH,IACW,aAAa,IAAI,aAAa,CAAC,iCAAiC,CAAC,CAE3E;IAMD;;;OAGG;IACa,iBAAiB,IAAI,IAAI;IAOzC;;OAEG;IACI,KAAK,IAAI,IAAI;IAQpB;;OAEG;IACI,OAAO,IAAI,IAAI;IAQtB;;OAEG;IACI,MAAM,IAAI,IAAI;IAIrB;;;;OAIG;IACH,SAAS,CAAC,kBAAkB,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI,EAAE,QAAQ,EAAE,OAAO,GAAG,IAAI,GAAG,IAAI;IAanF;;;;OAIG;IACH,OAAO,CAAC,iBAAiB;CAwB5B;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEX,UAAU,mBAAmB;QAIzB,OAAO,EAAE,qBAAqB,CAAC;QAI/B,SAAS,EAAE,uBAAuB,CAAC;QACnC,aAAa,EAAE,2BAA2B,CAAC;KAC9C;CAEJ"}
+{"version":3,"file":"ToggableElement.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Primitives/Abstracts/Toggable/ToggableElement.ts"],"names":[],"mappings":"AAEA,OAAO,EAA2B,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAKrF,OAAO,KAAK,EAAE,mBAAmB,EAAE,yBAAyB,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAC;AAEhH,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AACjE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;;AAIrE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkFG;AACH,qBAAa,eAAgB,SAAQ,oBAAyB,YAAW,qBAAqB;IAI1F,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAqC;IAC9D,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAuC;IAClE,OAAO,CAAC,QAAQ,CAAC,cAAc,CAA2C;IAC1E,OAAO,CAAC,QAAQ,CAAC,mBAAmB,CAAqB;IACzD,OAAO,CAAC,UAAU,CAAiB;IACnC,OAAO,CAAC,aAAa,CAAU;;IAqB/B;;;;;;;OAOG;IACH,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;;OAKG;IACH,IAIW,SAAS,IAAI,OAAO,GAAG,IAAI,CAErC;IAED,IAAW,SAAS,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI,EAazC;IAED;;;;;;OAMG;IACH,IAIW,YAAY,IAAI,OAAO,CAEjC;IAED,IAAW,YAAY,CAAC,KAAK,EAAE,OAAO,EAKrC;IAED;;;;;;;OAOG;IACH,IACW,OAAO,IAAI,aAAa,CAAC,mBAAmB,CAAC,CAEvD;IAED;;;;;;;OAOG;IACH,IACW,SAAS,IAAI,aAAa,CAAC,qBAAqB,CAAC,CAE3D;IAED;;;;;;;OAOG;IACH,IACW,aAAa,IAAI,aAAa,CAAC,yBAAyB,CAAC,CAEnE;IAMD;;;OAGG;IACa,iBAAiB,IAAI,IAAI;IAOzC;;OAEG;IACI,KAAK,IAAI,IAAI;IAQpB;;OAEG;IACI,OAAO,IAAI,IAAI;IAQtB;;OAEG;IACI,MAAM,IAAI,IAAI;IAIrB;;;;OAIG;IACH,SAAS,CAAC,kBAAkB,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI,EAAE,QAAQ,EAAE,OAAO,GAAG,IAAI,GAAG,IAAI;IAanF;;;;OAIG;IACH,OAAO,CAAC,iBAAiB;CAwB5B;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;CACd"}

package/Controls/Components/Primitives/Abstracts/Toggable/ToggableElement.js

@@ -8,8 +8,8 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 var __metadata = (this && this.__metadata) || function (k, v) {
     if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
 };
-import { Emit } from '../../../../../Events/Decorators/EmitDecorator';
 import { HTMLElementEventEmitter } from '@breadstone/mosaik-elements';
+import { Emit } from '../../../../../events/Decorators/EmitDecorator';
 import { Focusable } from '../../../../Behaviors/Focusable';
 import { KeyboardController } from '../../../../Controllers/KeyboardController';
 import { Attribute } from '../../../../Decorators/AttributeDecorator';
@@ -17,18 +17,87 @@ import { Key } from '../../../../Types/Key';
 import { CustomElement } from '../../../Abstracts/CustomElement';
 // #endregion
 /**
- * The {@link ToggableElement} is a abstract base class for a toggable behavior.
+ * Toggable - Abstract base class for elements with toggleable checked/unchecked states.
  *
- * @fires checked - Called when the element is checked.
- * @fires unchecked - Called when the element is unchecked.
- * @fires indeterminate - Called when the element is indeterminate.
+ * @description
+ * The ToggableElement provides comprehensive toggle behavior for interactive components that
+ * support checked, unchecked, and optionally indeterminate states. This abstract base class
+ * implements the complete state management lifecycle including keyboard interaction (Space/Enter
+ * keys), state transition logic, and event emission for state changes. It supports both two-state
+ * (checked/unchecked) and three-state (checked/unchecked/indeterminate) modes, making it ideal
+ * as a foundation for checkboxes, radio buttons, toggle switches, expandable sections, and other
+ * binary or tri-state UI controls. The class leverages the Focusable behavior for keyboard
+ * accessibility and provides convenient methods (check, uncheck, toggle) for programmatic control.
  *
- * @keyhandle Space - Toggles the element.
- * @keyhandle Enter - Toggles the element.
+ * @name Toggable
+ * @category Primitives
  *
+ * @dependency {Focusable} - Focus management and keyboard interaction support
+ * @dependency {KeyboardController} - Keyboard event handling and key binding management
+ *
+ * @fires checked {CheckedEvent} - Dispatched when the element transitions to checked state (isChecked = true)
+ * @fires unchecked {UncheckedEvent} - Dispatched when the element transitions to unchecked state (isChecked = false)
+ * @fires indeterminate {IndeterminateEvent} - Dispatched when the element transitions to indeterminate state (isChecked = null, requires isThreeState = true)
+ *
+ * @example
+ * Creating a custom checkbox component:
+ * ```typescript
+ * @Component({
+ *     selector: 'mosaik-checkbox',
+ *     template: checkboxTemplate
+ * })
+ * export class CheckboxElement extends ToggableElement {
+ *     public constructor() {
+ *         super();
+ *         this.isThreeState = false;
+ *     }
+ * }
+ * ```
+ *
+ * @example
+ * Using three-state toggle:
+ * ```html
+ * <custom-toggle is-three-state>
+ *     <!-- Cycles through: unchecked → checked → indeterminate → unchecked -->
+ * </custom-toggle>
+ * ```
+ *
+ * @example
+ * Programmatic control:
+ * ```typescript
+ * const toggle = document.querySelector('custom-toggle');
+ * toggle.check();      // Set to checked
+ * toggle.uncheck();    // Set to unchecked
+ * toggle.toggle();     // Cycle to next state
+ *
+ * // Listen to state changes
+ * toggle.checked.subscribe(() => {
+ *     console.log('Element is now checked');
+ * });
+ * ```
+ *
+ * @example
+ * Handling indeterminate state for parent-child relationships:
+ * ```typescript
+ * class SelectAllCheckbox extends ToggableElement {
+ *     private updateFromChildren(children: Array<CheckboxElement>): void {
+ *         const allChecked = children.every(c => c.isChecked);
+ *         const someChecked = children.some(c => c.isChecked);
+ *
+ *         this.isThreeState = true;
+ *         if (allChecked) {
+ *             this.isChecked = true;
+ *         } else if (someChecked) {
+ *             this.isChecked = null;  // Indeterminate
+ *         } else {
+ *             this.isChecked = false;
+ *         }
+ *     }
+ * }
+ * ```
  *
- * @public
  * @abstract
+ * @public
  */
 export class ToggableElement extends Focusable(CustomElement) {
     // #region Fields
@@ -101,7 +170,7 @@ export class ToggableElement extends Focusable(CustomElement) {
     }
     /**
      * Called when the `isChecked` property is `true`.
-     * Provides reference to the `{@link IToggableCheckedEventDetail}` as event argument.
+     * Provides reference to the `{@link ICheckedEventDetail}` as event argument.
      *
      * @public
      * @eventProperty
@@ -112,7 +181,7 @@ export class ToggableElement extends Focusable(CustomElement) {
     }
     /**
      * Called when the `isChecked` property is `false`.
-     * Provides reference to the `{@link IToggableCheckedEventDetail}` as event argument.
+     * Provides reference to the `{@link IUncheckedEventDetail}` as event argument.
      *
      * @public
      * @eventProperty
@@ -123,7 +192,7 @@ export class ToggableElement extends Focusable(CustomElement) {
     }
     /**
      * Called when the `isChecked` property is `null`.
-     * Provides reference to the `{@link IToggableIndeterminateEventDetail}` as event argument.
+     * Provides reference to the `{@link IIndeterminateEventDetail}` as event argument.
      *
      * @public
      * @eventProperty

package/Controls/Components/Primitives/Abstracts/Toggable/ToggableElement.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToggableElement.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Primitives/Abstracts/Toggable/ToggableElement.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"ToggableElement.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Primitives/Abstracts/Toggable/ToggableElement.ts"],"names":[],"mappings":"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"}

package/Controls/Components/Primitives/Abstracts/UpDown/Abstracts/UpDownBaseElement.d.ts

@@ -1,9 +1,84 @@
 import { InputBaseElement } from '../../../../Inputs/Abstracts/InputBase';
 /**
- * UpDownBaseElement - A updown represents a control that enables users to select a value from a given minimum and maximum range.
+ * UpDown Base Element - The foundational base class for all numeric and value spinner components.
+ *
+ * @description
+ * UpDownBaseElement provides the core infrastructure for input controls that allow users to
+ * incrementally adjust values within a defined range using up/down buttons or keyboard navigation.
+ * It extends InputBaseElement with range constraints (min/max) and manages the connection between
+ * the visual input element and change event handling. This abstract class establishes the common
+ * API surface for numeric spinners, time pickers, quantity selectors, and other bounded value
+ * controls. Subclasses must implement the abstract min/max properties and the onInputChanged()
+ * method to handle value type-specific logic (numbers, dates, times, etc.).
+ *
+ * @remarks
+ * The class manages the lifecycle of the internal input element subscription, automatically
+ * attaching event listeners in onApplyTemplate() and cleaning them up in disconnectedCallback().
+ * The generic type parameter `T` allows type-safe implementations for different value types
+ * (number, Date, string, etc.).
+ *
+ * @name UpDownBaseElement
+ * @category Abstract Elements
+ *
+ * @slot [dynamic] - Slots are defined by concrete updown implementations
+ *
+ * @csspart [dynamic] - Parts are defined by concrete updown implementations
+ *
+ * @fires connected {ConnectedEvent} - Emitted when the element is connected to the DOM
+ * @fires disconnected {DisconnectedEvent} - Emitted when the element is disconnected from the DOM
+ * @fires changed {PropertyChangedEvent} - Emitted when any attribute changes before update
+ * @fires input {Event} - Emitted when the input value changes
+ *
+ * @example
+ * Extending UpDownBaseElement for a numeric spinner:
+ * ```typescript
+ * export class NumericUpDownElement extends UpDownBaseElement<number> {
+ *   private _min: number = 0;
+ *   private _max: number = 100;
+ *
+ *   public get min(): number { return this._min; }
+ *   public set min(value: number) { this._min = value; }
+ *
+ *   public get max(): number { return this._max; }
+ *   public set max(value: number) { this._max = value; }
+ *
+ *   protected onInputChanged(event: Event): void {
+ *     const value = parseFloat(this.input?.value ?? '0');
+ *     this.value = Math.max(this.min, Math.min(this.max, value));
+ *   }
+ * }
+ * ```
+ *
+ * @example
+ * Using updown controls in HTML:
+ * ```html
+ * <numeric-updown min="0" max="100" value="50"></numeric-updown>
+ * <time-updown min="00:00" max="23:59" value="12:00"></time-updown>
+ * ```
+ *
+ * @example
+ * Programmatically setting values with range enforcement:
+ * ```typescript
+ * const updown = document.querySelector('numeric-updown');
+ * updown.min = 10;
+ * updown.max = 90;
+ * updown.value = 50; // Within range
+ * updown.setInputValue('75'); // Triggers input event and validation
+ * ```
+ *
+ * @example
+ * Accessing the internal input element:
+ * ```typescript
+ * protected override onApplyTemplate(): void {
+ *   super.onApplyTemplate();
+ *   if (this.input) {
+ *     this.input.setAttribute('inputmode', 'numeric');
+ *   }
+ * }
+ * ```
  *
- * @public
  * @abstract
+ * @public
  */
 export declare abstract class UpDownBaseElement<T> extends InputBaseElement {
     private _inputSubscription;

package/Controls/Components/Primitives/Abstracts/UpDown/Abstracts/UpDownBaseElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UpDownBaseElement.d.ts","sourceRoot":"","sources":["../../../../../../../src/Controls/Components/Primitives/Abstracts/UpDown/Abstracts/UpDownBaseElement.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAI1E;;;;;GAKG;AACH,8BAAsB,iBAAiB,CAAC,CAAC,CAAE,SAAQ,gBAAgB;IAI/D,OAAO,CAAC,kBAAkB,CAAoC;IAM9D;;;;OAIG;;IAWH;;;;OAIG;IACH,SAAgB,GAAG,EAAE,CAAC,CAAC;IAEvB;;;;OAIG;IACH,SAAgB,GAAG,EAAE,CAAC,CAAC;IAEvB;;;;;OAKG;IACH,SAAS,KAAK,KAAK,IAAI,gBAAgB,GAAG,IAAI,CAM7C;IAMe,oBAAoB,IAAI,IAAI;IAK5C;;;OAGG;IACH,SAAS,CAAC,QAAQ,CAAC,cAAc,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI;cAElC,eAAe,IAAI,IAAI;IAQ1C;;OAEG;IACH,SAAS,CAAC,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;CAU/C"}
+{"version":3,"file":"UpDownBaseElement.d.ts","sourceRoot":"","sources":["../../../../../../../src/Controls/Components/Primitives/Abstracts/UpDown/Abstracts/UpDownBaseElement.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAI1E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgFG;AACH,8BAAsB,iBAAiB,CAAC,CAAC,CAAE,SAAQ,gBAAgB;IAI/D,OAAO,CAAC,kBAAkB,CAAoC;IAM9D;;;;OAIG;;IAWH;;;;OAIG;IACH,SAAgB,GAAG,EAAE,CAAC,CAAC;IAEvB;;;;OAIG;IACH,SAAgB,GAAG,EAAE,CAAC,CAAC;IAEvB;;;;;OAKG;IACH,SAAS,KAAK,KAAK,IAAI,gBAAgB,GAAG,IAAI,CAM7C;IAMe,oBAAoB,IAAI,IAAI;IAK5C;;;OAGG;IACH,SAAS,CAAC,QAAQ,CAAC,cAAc,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI;cAElC,eAAe,IAAI,IAAI;IAQ1C;;OAEG;IACH,SAAS,CAAC,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;CAU/C"}