@breadstone/mosaik-elements-foundation 0.0.226 → 0.0.227

package/Controls/Behaviors/Selectable.js.map

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

package/Controls/Behaviors/Slottable.d.ts

@@ -32,6 +32,15 @@ export interface ISlottable {
      * @returns The assigned elements of a slot.
      */
     getSlotAssignmentsOf<T extends Element = Element>(slotName: string, element: Constructor<T>): Array<T>;
+    /**
+     * Returns the assigned elements of a slot as string.
+     *
+     * @public
+     * @hidden
+     * @param slotName - The slot name (For default slot, pass an empty string).
+     * @returns The assigned elements of a slot as string.
+     */
+    getSlotContent(slotName: string): string;
     /**
      * Returns a boolean that indicates if a slot has content.
      *

package/Controls/Behaviors/Slottable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Slottable.d.ts","sourceRoot":"","sources":["../../../src/Controls/Behaviors/Slottable.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AAE3E,OAAO,KAAK,EAAE,mBAAmB,EAAE,qBAAqB,EAAE,MAAM,sBAAsB,CAAC;AAIvF,MAAM,WAAW,UAAU;IAIvB;;;;;;;;OAQG;IACH,YAAY,CAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,GAAG,IAAI,GAAG,IAAI,CAAC;IAE3D;;;;;;;;OAQG;IACH,kBAAkB,CAAC,CAAC,SAAS,OAAO,GAAG,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,OAAO,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC;IAExG;;;;;;;;OAQG;IACH,oBAAoB,CAAC,CAAC,SAAS,OAAO,GAAG,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC;IAEvG;;;;;;;OAOG;IACH,cAAc,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAC;IAE1C;;;;;;;OAOG;IACH,OAAO,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAC;IAEnC;;;;;;;OAOG;IACH,aAAa,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAI1C;AAED;;;;GAIG;AAEH,MAAM,WAAW,eAAe;CAK/B;AAED;;;;GAIG;AACH,eAAO,MAAM,SAAS,GAAI,CAAC,SAAS,mBAAmB,CAAC,aAAa,CAAC,EAAE,MAAM,CAAC,KAAG,qBAAqB,CAAC,CAAC,EAAE,eAAe,GAAG,UAAU,CAiItI,CAAC"}
+{"version":3,"file":"Slottable.d.ts","sourceRoot":"","sources":["../../../src/Controls/Behaviors/Slottable.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AAE3E,OAAO,KAAK,EAAE,mBAAmB,EAAE,qBAAqB,EAAE,MAAM,sBAAsB,CAAC;AAIvF,MAAM,WAAW,UAAU;IAIvB;;;;;;;;OAQG;IACH,YAAY,CAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,GAAG,IAAI,GAAG,IAAI,CAAC;IAE3D;;;;;;;;OAQG;IACH,kBAAkB,CAAC,CAAC,SAAS,OAAO,GAAG,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,OAAO,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC;IAExG;;;;;;;;OAQG;IACH,oBAAoB,CAAC,CAAC,SAAS,OAAO,GAAG,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC;IAEvG;;;;;;;OAOG;IACH,cAAc,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,CAAC;IAEzC;;;;;;;OAOG;IACH,cAAc,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAC;IAE1C;;;;;;;OAOG;IACH,OAAO,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAC;IAEnC;;;;;;;OAOG;IACH,aAAa,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAI1C;AAED;;;;GAIG;AAEH,MAAM,WAAW,eAAe;CAK/B;AAED;;;;GAIG;AACH,eAAO,MAAM,SAAS,GAAI,CAAC,SAAS,mBAAmB,CAAC,aAAa,CAAC,EAAE,MAAM,CAAC,KAAG,qBAAqB,CAAC,CAAC,EAAE,eAAe,GAAG,UAAU,CA6NtI,CAAC"}

package/Controls/Behaviors/Slottable.js

@@ -76,6 +76,82 @@ export const Slottable = (base) => {
         getSlotAssignmentsOf(slotName, element) {
             return this.getSlotAssignments(slotName).filter((x) => x instanceof element);
         }
+        /**
+         * Returns the assigned elements of a slot as string.
+         * This method extracts text content recursively, including from Shadow DOMs
+         * and Custom Elements with known text properties (like `mosaik-text`).
+         *
+         * @public
+         * @hidden
+         * @param slotName - The slot name (For default slot, pass an empty string).
+         * @returns The assigned elements of a slot as string.
+         */
+        getSlotContent(slotName) {
+            const assignedNodes = this._slotController.getAssignedNodes(slotName);
+            return assignedNodes.map((node) => this.extractTextContent(node)).join('');
+        }
+        /**
+         * Extracts text content from a node, including from Shadow DOMs and
+         * Custom Elements with known text properties.
+         *
+         * @private
+         * @param node - The node to extract text from.
+         * @returns The extracted text content.
+         */
+        extractTextContent(node) {
+            // Text nodes: return content directly
+            if (node.nodeType === Node.TEXT_NODE) {
+                return node.textContent ?? '';
+            }
+            // Element nodes: check for known text properties first
+            if (node instanceof HTMLElement) {
+                // Check for known text properties on Custom Elements (e.g., mosaik-text)
+                const textProperty = node.text;
+                if (typeof textProperty === 'string' && textProperty.length > 0) {
+                    return textProperty;
+                }
+                // If element has Shadow DOM, extract from there
+                if (node.shadowRoot) {
+                    return this.extractTextFromShadowRoot(node.shadowRoot);
+                }
+                // Otherwise, recursively extract from children
+                return Array.from(node.childNodes)
+                    .map((child) => this.extractTextContent(child))
+                    .join('');
+            }
+            // Fallback to textContent for other node types
+            return node.textContent ?? '';
+        }
+        /**
+         * Extracts visible text content from a Shadow DOM.
+         *
+         * @private
+         * @param shadowRoot - The shadow root to extract text from.
+         * @returns The extracted text content.
+         */
+        extractTextFromShadowRoot(shadowRoot) {
+            const texts = [];
+            const walker = document.createTreeWalker(shadowRoot, NodeFilter.SHOW_TEXT | NodeFilter.SHOW_ELEMENT, {
+                acceptNode: (visitedNode) => {
+                    // Skip slot elements (they project content we've already processed)
+                    if (visitedNode instanceof HTMLSlotElement) {
+                        return NodeFilter.FILTER_REJECT;
+                    }
+                    return NodeFilter.FILTER_ACCEPT;
+                }
+            });
+            let currentNode = walker.currentNode;
+            while (currentNode) {
+                if (currentNode.nodeType === Node.TEXT_NODE) {
+                    const text = currentNode.textContent?.trim();
+                    if (text) {
+                        texts.push(text);
+                    }
+                }
+                currentNode = walker.nextNode();
+            }
+            return texts.join(' ');
+        }
         /**
          * Returns a boolean that indicates if a slot has content.
          *

package/Controls/Behaviors/Slottable.js.map

@@ -1 +1 @@
-{"version":3,"file":"Slottable.js","sourceRoot":"","sources":["../../../src/Controls/Behaviors/Slottable.ts"],"names":[],"mappings":"AAAA,4DAA4D;AAC5D,yDAAyD;AACzD,kBAAkB;AAIlB,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAyF/D;;;;GAIG;AACH,MAAM,CAAC,MAAM,SAAS,GAAG,CAA+C,IAAO,EAA0D,EAAE;IACvI,MAAe,gBAAiB,SAAQ,IAAI;QAExC,iBAAiB;QAEA,eAAe,CAAiB;QAEjD,aAAa;QAEb,eAAe;QAEf;;;;WAIG;QACH,YAAmB,GAAG,IAAgB;YAClC,KAAK,CAAC,IAAI,CAAC,CAAC;YAEZ,IAAI,CAAC,eAAe,GAAG,IAAI,cAAc,CAAC,IAAI,EAAE;gBAC5C,QAAQ,EAAE,CAAC,QAAQ,EAAE,EAAE;oBACnB,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;gBACjC,CAAC;aACJ,CAAC,CAAC;QACP,CAAC;QAED,aAAa;QAEb,kBAAkB;QAElB;;;;;;;;WAQG;QACI,YAAY,CAAC,QAAgB,EAAE,IAAoB;YACtD,MAAM,YAAY,GAAG,QAAQ,CAAC,CAAC,CAAC,cAAc,QAAQ,IAAI,CAAC,CAAC,CAAC,kBAAkB,CAAC;YAChF,MAAM,IAAI,GAAG,IAAI,CAAC,UAAU,EAAE,aAAa,CAAkB,YAAY,CAAC,CAAC;YAE3E,IAAI,CAAC,IAAI,EAAE,CAAC;gBACR,MAAM,gBAAgB,GAAG,QAAQ;oBAC7B,CAAC,CAAC,aAAa,QAAQ,kBAAkB;oBACzC,CAAC,CAAC,iCAAiC,CAAC;gBACxC,MAAM,IAAI,KAAK,CAAC,gBAAgB,CAAC,CAAC;YACtC,CAAC;YAED,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;QACtB,CAAC;QAED;;;;;;;;WAQG;QACI,kBAAkB,CAAqC,QAAgB,EAAE,MAAiC;YAC7G,MAAM,QAAQ,GAAG,IAAI,CAAC,eAAe,CAAC,mBAAmB,CAAC,QAAQ,CAAoB,CAAC;YAEvF,IAAI,MAAM,EAAE,CAAC;gBACT,OAAO,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;YAC7C,CAAC;YAED,OAAO,QAAQ,CAAC;QACpB,CAAC;QAED;;;;;;;;WAQG;QACI,oBAAoB,CAAqC,QAAgB,EAAE,OAA8B;YAC5G,OAAO,IAAI,CAAC,kBAAkB,CAAW,QAAQ,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,YAAY,OAAO,CAAC,CAAC;QAC3F,CAAC;QAED;;;;;;;WAOG;QACI,cAAc,CAAC,QAAgB;YAClC,MAAM,kBAAkB,GAAG,IAAI,CAAC,eAAe,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;YAC7E,MAAM,UAAU,GAAG,IAAI,CAAC,eAAe,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC;YAE7D,OAAO,kBAAkB,IAAI,UAAU,CAAC;QAC5C,CAAC;QAED;;;;;;;WAOG;QACI,OAAO,CAAC,QAAgB;YAC3B,OAAO,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;QAClD,CAAC;QAED;;;;;;;WAOG;QACI,aAAa,CAAC,SAAkB;YACnC,WAAW;QACf,CAAC;KAIJ;IAED,OAAO,gBAAgB,CAAC;AAC5B,CAAC,CAAC"}
+{"version":3,"file":"Slottable.js","sourceRoot":"","sources":["../../../src/Controls/Behaviors/Slottable.ts"],"names":[],"mappings":"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"}

package/Controls/Components/Abstracts/CustomElement.d.ts

@@ -1,22 +1,90 @@
+import { IEventEmitter, IEventListenerSubscription } from '@breadstone/mosaik-elements';
 import { LitElement, type PropertyDeclaration } from 'lit';
 import { CSSResultGroup } from '../../../Dom/Css';
+import type { IPropertyChangedEventDetail } from '../../events';
 import { FlowDirection } from '../../Types/FlowDirection';
-import { IPropertyChangedEvent, type IPropertyChangedEventDetail } from './Events/IChangedEvent';
-import type { ICustomElementEvents } from './ICustomElementEvents';
 import type { IConnectedCallback } from './Interfaces/IConnectedCallback';
 import type { IDisconnectedCallback } from './Interfaces/IDisconnectedCallback';
-import { IEventEmitter, IEventListenerSubscription, IEventDetail } from '@breadstone/mosaik-elements';
 export type UnpackCustomEvent<T> = T extends CustomEvent<infer U> ? U : unknown;
 /**
- * The base class of all custom components.
+ * Custom Element - The foundational base class for all Mosaik web components.
  *
- * @fires connected {CustomEvent<IEventDetail>} - Called when the element is connected to the DOM.
- * @fires disconnected {CustomEvent<IEventDetail>} - Called when the element is disconnected from the DOM.
- * @fires changed {IPropertyChangedEvent} - Called when the element will be updated.
+ * @description
+ * CustomElement extends LitElement and provides the core infrastructure for all Mosaik components.
+ * It establishes fundamental patterns including lifecycle management, event handling, style adoption,
+ * internationalization (i18n) support, and template part querying. This abstract class serves as the
+ * root of the component hierarchy and provides essential features like custom style injection via
+ * shadow DOM, automatic event subscription cleanup, property change tracking, and bidirectional text
+ * support. All Mosaik components inherit from this base class either directly or through specialized
+ * intermediate base classes.
  *
+ * @name CustomElement
+ * @category Abstract Elements
+ *
+ * @slot style - Custom styles injection slot for shadow DOM styling escape hatch
+ *
+ * @csspart [dynamic] - Parts are defined by concrete component 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
+ *
+ * @example
+ * Extending CustomElement to create a new component:
+ * ```typescript
+ * export class MyElement extends CustomElement {
+ *   constructor() {
+ *     super();
+ *   }
+ *   protected override render() {
+ *     return html`<div>My Component</div>`;
+ *   }
+ * }
+ * ```
+ *
+ * @example
+ * Injecting custom styles via the style slot:
+ * ```html
+ * <mosaik-card>
+ *   <style slot="style">
+ *     .title { color: purple; font-size: 2rem; }
+ *   </style>
+ *   <h3 class="title">Custom Title</h3>
+ * </mosaik-card>
+ * ```
+ *
+ * @example
+ * Using lifecycle events:
+ * ```typescript
+ * element.connected.on(() => {
+ *   console.log('Element connected to DOM');
+ * });
+ * element.changed.on(({ propertyName, oldValue, newValue }) => {
+ *   console.log(`Property ${propertyName} changed from ${oldValue} to ${newValue}`);
+ * });
+ * ```
+ *
+ * @example
+ * Querying template parts:
+ * ```typescript
+ * protected override onApplyTemplate(): void {
+ *   const header = this.getTemplatePart<HTMLElement>('header');
+ *   const items = this.getTemplateParts<HTMLElement>('item');
+ * }
+ * ```
+ *
+ * @abstract
  * @public
  */
-export declare class CustomElement extends LitElement implements IConnectedCallback, IDisconnectedCallback, ICustomElementEvents {
+export declare class CustomElement extends LitElement implements IConnectedCallback, IDisconnectedCallback {
+    /**
+     * The slot name used for custom styles injection.
+     * Users can inject custom styles via `<style slot="style">...</style>`.
+     *
+     * @public
+     * @readonly
+     */
+    static get CUSTOM_STYLES_SLOT(): string;
     private readonly _connected;
     private readonly _disconnected;
     private readonly _changed;
@@ -52,6 +120,7 @@ export declare class CustomElement extends LitElement implements IConnectedCallb
      * Provides reference to `IEventEmitter` as event argument.
      *
      * @public
+     * @hidden
      * @eventProperty
      * @readonly
      */
@@ -61,6 +130,7 @@ export declare class CustomElement extends LitElement implements IConnectedCallb
      * Provides reference to `IEventEmitter` as event argument.
      *
      * @public
+     * @hidden
      * @eventProperty
      * @readonly
      */
@@ -70,6 +140,7 @@ export declare class CustomElement extends LitElement implements IConnectedCallb
      * Provides reference to `IEventEmitter` as event argument.
      *
      * @public
+     * @hidden
      * @eventProperty
      * @readonly
      */
@@ -77,22 +148,26 @@ export declare class CustomElement extends LitElement implements IConnectedCallb
     /**
      * @public
      * @override
+     * @hidden
      */
     connectedCallback(): void;
     /**
      * @public
      * @override
+     * @hidden
      */
     disconnectedCallback(): void;
     /**
      * @public
      * @override
+     * @hidden
      */
     attributeChangedCallback(name: string, old: string | null, value: string | null): void;
     /**
      * Adopts the specified styles.
      *
      * @public
+     * @hidden
      * @param styles - The styles to adopt.
      */
     adoptStyle(styles: CSSResultGroup): void;
@@ -111,6 +186,9 @@ export declare class CustomElement extends LitElement implements IConnectedCallb
      * @hidden
      */
     off(subscription: IEventListenerSubscription): void;
+    /**
+     * @hidden
+     */
     off<TEvent extends keyof HTMLElementEventMap>(event: TEvent, listener: (this: HTMLElement, event: HTMLElementEventMap[TEvent]) => unknown): void;
     /**
      * Emits a custom event with more convenient defaults.
@@ -119,6 +197,9 @@ export declare class CustomElement extends LitElement implements IConnectedCallb
      * @hidden
      */
     emit<TEvent extends Event, TDetail extends UnpackCustomEvent<TEvent>>(event: TEvent, eventInitDict?: CustomEventInit<TDetail>): boolean;
+    /**
+     * @hidden
+     */
     emit<TEvent extends keyof HTMLElementEventMap, TDetail extends UnpackCustomEvent<HTMLElementEventMap[TEvent]>>(type: keyof HTMLElementEventMap, eventInitDict?: CustomEventInit<TDetail>): boolean;
     /**
      * @public
@@ -149,6 +230,33 @@ export declare class CustomElement extends LitElement implements IConnectedCallb
      * @virtual
      */
     protected onApplyTemplate(): void;
+    /**
+     * Adopts custom styles from the light DOM into the shadow DOM.
+     *
+     * This method enables the "styling escape hatch" pattern, allowing developers
+     * to inject custom styles into a component's shadow DOM via a slotted style element:
+     *
+     * @example
+     * ```html
+     * <mosaik-card>
+     *   <style slot="custom-styles">
+     *     .title { color: purple; font-size: 2rem; }
+     *   </style>
+     *   <h3 class="title">Custom Title</h3>
+     * </mosaik-card>
+     * ```
+     *
+     * @remarks
+     * - Only `<style>` elements with `slot="custom-styles"` are processed.
+     * - Uses `textContent` instead of `innerHTML` to prevent XSS attacks.
+     * - Styles are adopted via `CSSStyleSheet` API for optimal performance.
+     * - The style element remains in the light DOM but its content is adopted.
+     * - This method is called automatically during `firstUpdated`.
+     * - Custom styles are appended after component styles, allowing overrides.
+     *
+     * @protected
+     */
+    protected adoptCustomStyles(): void;
     /**
      * Returns the template part with the specified name.
      * The template child is a child element with the `part` attribute.
@@ -183,24 +291,14 @@ export declare class CustomElement extends LitElement implements IConnectedCallb
      */
     protected render(): unknown;
     /**
-     * Returns the lang attribute of the absolute root node in the DOM.
-     *
      * @private
      */
-    private getRootLang;
     private registerSubscription;
+    /**
+     * @private
+     */
     private unregisterSubscription;
 }
-/**
- * @public
- */
-declare global {
-    interface HTMLElementEventMap {
-        connected: CustomEvent<IEventDetail>;
-        disconnected: CustomEvent<IEventDetail>;
-        changed: IPropertyChangedEvent;
-    }
-}
 /**
  * Defines the supported matching modes for the `part` attribute.
  *

package/Controls/Components/Abstracts/CustomElement.d.ts.map

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

package/Controls/Components/Abstracts/CustomElement.js

@@ -8,24 +8,94 @@ 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 { EventListenerSubscription, HTMLElementEventEmitter, isEventListenerSubscription } from '@breadstone/mosaik-elements';
 import { LitElement, nothing } from 'lit';
 import { DomServiceLocator } from '../../../Dom/Dom';
-import { Emit } from '../../../Events/Decorators/EmitDecorator';
+import { Emit } from '../../../events/Decorators/EmitDecorator';
 import { Attribute } from '../../Decorators/AttributeDecorator';
 import { FlowDirection } from '../../Types/FlowDirection';
-import { HTMLElementEventEmitter, EventListenerSubscription } from '@breadstone/mosaik-elements';
-import { isEventListenerSubscription } from '@breadstone/mosaik-elements';
 /**
- * The base class of all custom components.
+ * Custom Element - The foundational base class for all Mosaik web components.
  *
- * @fires connected {CustomEvent<IEventDetail>} - Called when the element is connected to the DOM.
- * @fires disconnected {CustomEvent<IEventDetail>} - Called when the element is disconnected from the DOM.
- * @fires changed {IPropertyChangedEvent} - Called when the element will be updated.
+ * @description
+ * CustomElement extends LitElement and provides the core infrastructure for all Mosaik components.
+ * It establishes fundamental patterns including lifecycle management, event handling, style adoption,
+ * internationalization (i18n) support, and template part querying. This abstract class serves as the
+ * root of the component hierarchy and provides essential features like custom style injection via
+ * shadow DOM, automatic event subscription cleanup, property change tracking, and bidirectional text
+ * support. All Mosaik components inherit from this base class either directly or through specialized
+ * intermediate base classes.
  *
+ * @name CustomElement
+ * @category Abstract Elements
+ *
+ * @slot style - Custom styles injection slot for shadow DOM styling escape hatch
+ *
+ * @csspart [dynamic] - Parts are defined by concrete component 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
+ *
+ * @example
+ * Extending CustomElement to create a new component:
+ * ```typescript
+ * export class MyElement extends CustomElement {
+ *   constructor() {
+ *     super();
+ *   }
+ *   protected override render() {
+ *     return html`<div>My Component</div>`;
+ *   }
+ * }
+ * ```
+ *
+ * @example
+ * Injecting custom styles via the style slot:
+ * ```html
+ * <mosaik-card>
+ *   <style slot="style">
+ *     .title { color: purple; font-size: 2rem; }
+ *   </style>
+ *   <h3 class="title">Custom Title</h3>
+ * </mosaik-card>
+ * ```
+ *
+ * @example
+ * Using lifecycle events:
+ * ```typescript
+ * element.connected.on(() => {
+ *   console.log('Element connected to DOM');
+ * });
+ * element.changed.on(({ propertyName, oldValue, newValue }) => {
+ *   console.log(`Property ${propertyName} changed from ${oldValue} to ${newValue}`);
+ * });
+ * ```
+ *
+ * @example
+ * Querying template parts:
+ * ```typescript
+ * protected override onApplyTemplate(): void {
+ *   const header = this.getTemplatePart<HTMLElement>('header');
+ *   const items = this.getTemplateParts<HTMLElement>('item');
+ * }
+ * ```
+ *
+ * @abstract
  * @public
  */
 export class CustomElement extends LitElement {
     // #region Fields
+    /**
+     * The slot name used for custom styles injection.
+     * Users can inject custom styles via `<style slot="style">...</style>`.
+     *
+     * @public
+     * @readonly
+     */
+    static get CUSTOM_STYLES_SLOT() {
+        return 'style';
+    }
     _connected;
     _disconnected;
     _changed;
@@ -42,7 +112,7 @@ export class CustomElement extends LitElement {
     constructor() {
         super();
         this._dir = 'auto';
-        this._lang = this.getRootLang();
+        this._lang = document.documentElement.lang; // Default to document language
         this._subscriptions = new Map();
         this._connected = new HTMLElementEventEmitter(this, 'connected');
         this._disconnected = new HTMLElementEventEmitter(this, 'disconnected');
@@ -87,6 +157,7 @@ export class CustomElement extends LitElement {
      * Provides reference to `IEventEmitter` as event argument.
      *
      * @public
+     * @hidden
      * @eventProperty
      * @readonly
      */
@@ -98,6 +169,7 @@ export class CustomElement extends LitElement {
      * Provides reference to `IEventEmitter` as event argument.
      *
      * @public
+     * @hidden
      * @eventProperty
      * @readonly
      */
@@ -109,6 +181,7 @@ export class CustomElement extends LitElement {
      * Provides reference to `IEventEmitter` as event argument.
      *
      * @public
+     * @hidden
      * @eventProperty
      * @readonly
      */
@@ -120,6 +193,7 @@ export class CustomElement extends LitElement {
     /**
      * @public
      * @override
+     * @hidden
      */
     connectedCallback() {
         super.connectedCallback();
@@ -128,6 +202,7 @@ export class CustomElement extends LitElement {
     /**
      * @public
      * @override
+     * @hidden
      */
     disconnectedCallback() {
         super.disconnectedCallback();
@@ -140,13 +215,15 @@ export class CustomElement extends LitElement {
     /**
      * @public
      * @override
+     * @hidden
      */
     attributeChangedCallback(name, old, value) {
         super.attributeChangedCallback(name, old, value);
         if (old !== value) {
             this._changed.emit({
                 propertyName: name,
-                value: value
+                oldValue: old,
+                newValue: value
             });
         }
     }
@@ -154,6 +231,7 @@ export class CustomElement extends LitElement {
      * Adopts the specified styles.
      *
      * @public
+     * @hidden
      * @param styles - The styles to adopt.
      */
     adoptStyle(styles) {
@@ -189,6 +267,9 @@ export class CustomElement extends LitElement {
         this.registerSubscription(event, subscription);
         return subscription;
     }
+    /**
+     * @hidden
+     */
     off(...args) {
         if (isEventListenerSubscription(args[0])) {
             args[0].dispose();
@@ -206,6 +287,9 @@ export class CustomElement extends LitElement {
         }
         subscription.dispose();
     }
+    /**
+     * @hidden
+     */
     emit(...args) {
         const nameOrInstance = args.at(0);
         const init = args.at(1);
@@ -238,6 +322,7 @@ export class CustomElement extends LitElement {
      */
     firstUpdated(changedProperties) {
         super.firstUpdated(changedProperties);
+        this.adoptCustomStyles();
         this.onApplyTemplate();
     }
     /**
@@ -264,6 +349,60 @@ export class CustomElement extends LitElement {
     onApplyTemplate() {
         // override
     }
+    /**
+     * Adopts custom styles from the light DOM into the shadow DOM.
+     *
+     * This method enables the "styling escape hatch" pattern, allowing developers
+     * to inject custom styles into a component's shadow DOM via a slotted style element:
+     *
+     * @example
+     * ```html
+     * <mosaik-card>
+     *   <style slot="custom-styles">
+     *     .title { color: purple; font-size: 2rem; }
+     *   </style>
+     *   <h3 class="title">Custom Title</h3>
+     * </mosaik-card>
+     * ```
+     *
+     * @remarks
+     * - Only `<style>` elements with `slot="custom-styles"` are processed.
+     * - Uses `textContent` instead of `innerHTML` to prevent XSS attacks.
+     * - Styles are adopted via `CSSStyleSheet` API for optimal performance.
+     * - The style element remains in the light DOM but its content is adopted.
+     * - This method is called automatically during `firstUpdated`.
+     * - Custom styles are appended after component styles, allowing overrides.
+     *
+     * @protected
+     */
+    adoptCustomStyles() {
+        if (!this.shadowRoot) {
+            return;
+        }
+        const slotName = this.constructor.CUSTOM_STYLES_SLOT;
+        const customStyleElement = this.querySelector(`style[slot="${slotName}"]`);
+        if (customStyleElement?.tagName !== 'STYLE') {
+            return;
+        }
+        // Use textContent to avoid XSS from innerHTML
+        const cssText = customStyleElement.textContent;
+        if (cssText.trim().length === 0) {
+            return;
+        }
+        try {
+            // Create a new CSSStyleSheet and adopt it
+            const sheet = new CSSStyleSheet();
+            sheet.replaceSync(cssText);
+            // Append to existing adopted stylesheets
+            this.shadowRoot.adoptedStyleSheets = [
+                ...this.shadowRoot.adoptedStyleSheets,
+                sheet
+            ];
+        }
+        catch (error) {
+            console.warn(`[${this.localName}] Failed to adopt custom styles:`, error instanceof Error ? error.message : error);
+        }
+    }
     /**
      * Returns the template part with the specified name.
      * The template child is a child element with the `part` attribute.
@@ -351,13 +490,8 @@ export class CustomElement extends LitElement {
             : super.render();
     }
     /**
-     * Returns the lang attribute of the absolute root node in the DOM.
-     *
      * @private
      */
-    getRootLang() {
-        return document.documentElement.lang;
-    }
     registerSubscription(event, subscription) {
         if (!this._subscriptions.has(event)) {
             this._subscriptions.set(event, new Set());
@@ -368,6 +502,9 @@ export class CustomElement extends LitElement {
         }
         sub.add(subscription);
     }
+    /**
+     * @private
+     */
     unregisterSubscription(subscription) {
         const subscriptions = this._subscriptions.get(subscription.eventName);
         if (!subscriptions) {