@breadstone/mosaik-elements-foundation 0.0.147 → 0.0.148

package/Controls/Components/Primitives/Divider/DividerElement.d.ts

@@ -2,9 +2,49 @@ import { CustomElement } from '../../Abstracts/CustomElement';
 import type { IDividerElementProps } from './IDividerElementProps';
 declare const DividerElement_base: (abstract new (...args: Array<any>) => import("../../../Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Orientable").IOrientableProps) & typeof CustomElement & import("../../../Behaviors/Themeable").IThemeableCtor;
 /**
- * Divider - A horizontal or vertical line used to separate or divide elements.
+ * Divider - A visual separator element that creates distinct sections within layouts.
  *
+ * Renders as a horizontal or vertical line to separate content areas, groups, or sections.
+ * Supports customizable thickness and adapts styling based on the current theme.
+ * Commonly used in menus, lists, forms, and content layouts.
+ *
+ * @name DividerElement
  * @element mosaik-divider
+ * @category Primitive
+ *
+ * @csspart divider - The main divider line element
+ *
+ * @cssprop --divider-color - Color of the divider line
+ * @cssprop --divider-thickness - Thickness of the divider line in pixels
+ * @cssprop --divider-opacity - Opacity level of the divider
+ * @cssprop --divider-margin - Margin space around the divider
+ *
+ * @example
+ * ```html
+ * <!-- Horizontal divider (default) -->
+ * <div>Section 1</div>
+ * <mosaik-divider></mosaik-divider>
+ * <div>Section 2</div>
+ *
+ * <!-- Vertical divider -->
+ * <div style="display: flex; align-items: center;">
+ *   <span>Item 1</span>
+ *   <mosaik-divider orientation="vertical"></mosaik-divider>
+ *   <span>Item 2</span>
+ * </div>
+ *
+ * <!-- Custom thickness divider -->
+ * <mosaik-divider thickness="3"></mosaik-divider>
+ *
+ * <!-- In navigation menu -->
+ * <nav>
+ *   <a href="/home">Home</a>
+ *   <mosaik-divider orientation="vertical"></mosaik-divider>
+ *   <a href="/about">About</a>
+ *   <mosaik-divider orientation="vertical"></mosaik-divider>
+ *   <a href="/contact">Contact</a>
+ * </nav>
+ * ```
  *
  * @public
  */

package/Controls/Components/Primitives/Divider/DividerElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DividerElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Divider/DividerElement.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAE9D,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;;AAQnE;;;;;;GAMG;AACH,qBAUa,cACT,SAAQ,mBACR,YAAW,oBAAoB;IAI/B,OAAO,CAAC,UAAU,CAAC,CAAS;IAM5B;;OAEG;;IAWH;;;;;;MAME;IACF,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAMD;;;;;OAKG;IACH,IACW,SAAS,IAAI,MAAM,GAAG,SAAS,CAEzC;IACD,IAAW,SAAS,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAK7C;CAaJ;AAED;;GAEG;AACH,yBAAiB,cAAc,CAAC;IAC5B,KAAY,KAAK,GAAG,oBAAoB,CAAC;CAC5C;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEX,UAAU,qBAAqB;QAE3B,gBAAgB,EAAE,cAAc,CAAC;KACpC;CACJ"}
+{"version":3,"file":"DividerElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Divider/DividerElement.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAE9D,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;;AAQnE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8CG;AACH,qBAUa,cACT,SAAQ,mBACR,YAAW,oBAAoB;IAI/B,OAAO,CAAC,UAAU,CAAC,CAAS;IAM5B;;OAEG;;IAWH;;;;;;MAME;IACF,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAMD;;;;;OAKG;IACH,IACW,SAAS,IAAI,MAAM,GAAG,SAAS,CAEzC;IACD,IAAW,SAAS,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAK7C;CAaJ;AAED;;GAEG;AACH,yBAAiB,cAAc,CAAC;IAC5B,KAAY,KAAK,GAAG,oBAAoB,CAAC;CAC5C;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEX,UAAU,qBAAqB;QAE3B,gBAAgB,EAAE,cAAc,CAAC;KACpC;CACJ"}

package/Controls/Components/Primitives/Divider/DividerElement.js

@@ -19,9 +19,49 @@ import { dividerElementCosmopolitanStyle } from './Themes/DividerElement.Cosmopo
 import { Themeable } from '../../../Behaviors/Themeable';
 // #endregion
 /**
- * Divider - A horizontal or vertical line used to separate or divide elements.
+ * Divider - A visual separator element that creates distinct sections within layouts.
  *
+ * Renders as a horizontal or vertical line to separate content areas, groups, or sections.
+ * Supports customizable thickness and adapts styling based on the current theme.
+ * Commonly used in menus, lists, forms, and content layouts.
+ *
+ * @name DividerElement
  * @element mosaik-divider
+ * @category Primitive
+ *
+ * @csspart divider - The main divider line element
+ *
+ * @cssprop --divider-color - Color of the divider line
+ * @cssprop --divider-thickness - Thickness of the divider line in pixels
+ * @cssprop --divider-opacity - Opacity level of the divider
+ * @cssprop --divider-margin - Margin space around the divider
+ *
+ * @example
+ * ```html
+ * <!-- Horizontal divider (default) -->
+ * <div>Section 1</div>
+ * <mosaik-divider></mosaik-divider>
+ * <div>Section 2</div>
+ *
+ * <!-- Vertical divider -->
+ * <div style="display: flex; align-items: center;">
+ *   <span>Item 1</span>
+ *   <mosaik-divider orientation="vertical"></mosaik-divider>
+ *   <span>Item 2</span>
+ * </div>
+ *
+ * <!-- Custom thickness divider -->
+ * <mosaik-divider thickness="3"></mosaik-divider>
+ *
+ * <!-- In navigation menu -->
+ * <nav>
+ *   <a href="/home">Home</a>
+ *   <mosaik-divider orientation="vertical"></mosaik-divider>
+ *   <a href="/about">About</a>
+ *   <mosaik-divider orientation="vertical"></mosaik-divider>
+ *   <a href="/contact">Contact</a>
+ * </nav>
+ * ```
  *
  * @public
  */

package/Controls/Components/Primitives/Divider/DividerElement.js.map

@@ -1 +1 @@
-{"version":3,"file":"DividerElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Divider/DividerElement.ts"],"names":[],"mappings":"AAAA,kBAAkB;;;;;;;;;;AAElB,OAAO,EAAE,UAAU,EAAE,MAAM,+BAA+B,CAAC;AAC3D,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAElE,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AACrE,OAAO,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC;AACzE,OAAO,EAAE,+BAA+B,EAAE,MAAM,sCAAsC,CAAC;AACvF,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAEzD,aAAa;AAEb;;;;;;GAMG;AAWI,IAAM,cAAc,GAApB,MAAM,cACT,SAAQ,SAAS,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC;IAG5C,iBAAiB;IAET,UAAU,CAAU;IAE5B,aAAa;IAEb,eAAe;IAEf;;OAEG;IACH;QACI,KAAK,EAAE,CAAC;QAER,IAAI,CAAC,UAAU,GAAG,SAAS,CAAC;IAChC,CAAC;IAED,aAAa;IAEb,qBAAqB;IAErB;;;;;;MAME;IACK,MAAM,KAAK,EAAE;QAChB,OAAO,gBAAgB,CAAC;IAC5B,CAAC;IAED,aAAa;IAEb,kBAAkB;IAElB;;;;;OAKG;IACH,IACW,SAAS;QAChB,OAAO,IAAI,CAAC,UAAU,CAAC;IAC3B,CAAC;IACD,IAAW,SAAS,CAAC,KAAyB;QAC1C,IAAI,IAAI,CAAC,UAAU,KAAK,KAAK,EAAE,CAAC;YAC5B,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;YACxB,IAAI,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;QACpC,CAAC;IACL,CAAC;CAaJ,CAAA;AAtBG;IAAC,SAAS,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;;+CAG3B;AAjDQ,cAAc;IAV1B,SAAS,CAAC;QACP,QAAQ,EAAE,gBAAgB;QAC1B,QAAQ,EAAE,sBAAsB;QAChC,MAAM,EAAE;YACJ,GAAG,EAAE,sBAAsB;YAC3B,KAAK,EAAE,wBAAwB;YAC/B,YAAY,EAAE,+BAA+B;SAChD;QACD,OAAO,EAAE,EAAE;KACd,CAAC;;GACW,cAAc,CAoE1B"}
+{"version":3,"file":"DividerElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Divider/DividerElement.ts"],"names":[],"mappings":"AAAA,kBAAkB;;;;;;;;;;AAElB,OAAO,EAAE,UAAU,EAAE,MAAM,+BAA+B,CAAC;AAC3D,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAElE,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AACrE,OAAO,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC;AACzE,OAAO,EAAE,+BAA+B,EAAE,MAAM,sCAAsC,CAAC;AACvF,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAEzD,aAAa;AAEb;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8CG;AAWI,IAAM,cAAc,GAApB,MAAM,cACT,SAAQ,SAAS,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC;IAG5C,iBAAiB;IAET,UAAU,CAAU;IAE5B,aAAa;IAEb,eAAe;IAEf;;OAEG;IACH;QACI,KAAK,EAAE,CAAC;QAER,IAAI,CAAC,UAAU,GAAG,SAAS,CAAC;IAChC,CAAC;IAED,aAAa;IAEb,qBAAqB;IAErB;;;;;;MAME;IACK,MAAM,KAAK,EAAE;QAChB,OAAO,gBAAgB,CAAC;IAC5B,CAAC;IAED,aAAa;IAEb,kBAAkB;IAElB;;;;;OAKG;IACH,IACW,SAAS;QAChB,OAAO,IAAI,CAAC,UAAU,CAAC;IAC3B,CAAC;IACD,IAAW,SAAS,CAAC,KAAyB;QAC1C,IAAI,IAAI,CAAC,UAAU,KAAK,KAAK,EAAE,CAAC;YAC5B,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;YACxB,IAAI,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;QACpC,CAAC;IACL,CAAC;CAaJ,CAAA;AAtBG;IAAC,SAAS,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;;+CAG3B;AAjDQ,cAAc;IAV1B,SAAS,CAAC;QACP,QAAQ,EAAE,gBAAgB;QAC1B,QAAQ,EAAE,sBAAsB;QAChC,MAAM,EAAE;YACJ,GAAG,EAAE,sBAAsB;YAC3B,KAAK,EAAE,wBAAwB;YAC/B,YAAY,EAAE,+BAA+B;SAChD;QACD,OAAO,EAAE,EAAE;KACd,CAAC;;GACW,cAAc,CAoE1B"}

package/Controls/Components/Primitives/FocusRing/FocusRingElement.d.ts

@@ -18,6 +18,8 @@ declare const FocusRingElement_base: (abstract new (...args: Array<any>) => impo
  *
  * @description
  * The Focus Ring element is a visible indicator that highlights the currently focused element, aiding accessibility.
+ * It provides visual feedback to users navigating with keyboard or other assistive technologies, helping them understand
+ * which element currently has focus.
  *
  * @name Focus Ring
  * @element mosaik-focus-ring
@@ -28,11 +30,23 @@ declare const FocusRingElement_base: (abstract new (...args: Array<any>) => impo
  * @cssprop {String} --focus-ring-width - The width.
  * @cssprop {String} --focus-ring-active-width - The active width.
  * @cssprop {String} --focus-ring-shape - The shape.
- * @cssprop {String} --focus-ring-x - The x.
- * @cssprop {String} --focus-ring-y - The y.
- * @cssprop {String} --focus-ring-blur - The blur.
- * @cssprop {String} --focus-ring-width - The width.
+ * @cssprop {String} --focus-ring-x - The x position.
+ * @cssprop {String} --focus-ring-y - The y position.
+ * @cssprop {String} --focus-ring-blur - The blur amount.
  * @cssprop {String} --focus-ring-color - The color.
+ * @cssprop {String} --focus-ring-border-color - The border color.
+ * @cssprop {String} --focus-ring-border-width - The border width.
+ * @cssprop {String} --focus-ring-border-style - The border style.
+ * @cssprop {String} --focus-ring-border-radius - The border radius.
+ * @cssprop {String} --focus-ring-shadow - The shadow.
+ * @cssprop {String} --focus-ring-transition-duration - The transition duration.
+ * @cssprop {String} --focus-ring-transition-mode - The transition mode.
+ * @cssprop {String} --focus-ring-transition-property - The transition property.
+ *
+ * @example
+ * ```html
+ * <mosaik-focus-ring visible="true" for="button"></mosaik-focus-ring>
+ * ```
  *
  * @public
  */

package/Controls/Components/Primitives/FocusRing/FocusRingElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FocusRingElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/FocusRing/FocusRingElement.ts"],"names":[],"mappings":"AAGA,OAAO,EAAc,KAAK,WAAW,EAAE,MAAM,+BAA+B,CAAC;AAC7E,OAAO,EAAe,KAAK,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AAIrF,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,+CAA+C,CAAC;AASxF;;;;GAIG;AACH,MAAM,WAAW,sBAAuB,SAAQ,iBAAiB;IAE7D,OAAO,EAAE,OAAO,CAAC;IAEjB,MAAM,EAAE,OAAO,CAAC;IAEhB,UAAU,EAAE,QAAQ,GAAG,MAAM,CAAC;CAEjC;;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,qBAUa,gBACT,SAAQ,qBACR,YAAW,kBAAkB,EAAE,sBAAsB,EAAE,WAAW;IAIlE,OAAO,CAAC,oBAAoB,CAAoC;IAChE,OAAO,CAAC,qBAAqB,CAAoC;IACjE,OAAO,CAAC,wBAAwB,CAAoC;IACpE,OAAO,CAAC,QAAQ,CAAU;IAC1B,OAAO,CAAC,OAAO,CAAU;IACzB,OAAO,CAAC,WAAW,CAAoB;IAMvC;;OAEG;;IAgBH;;;;;;;OAOG;IACH,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;;OAKG;IACH,IAIW,OAAO,IAAI,OAAO,CAE5B;IACD,IAAW,OAAO,CAAC,KAAK,EAAE,OAAO,EAKhC;IAED;;;;;OAKG;IACH,IAIW,MAAM,IAAI,OAAO,CAE3B;IACD,IAAW,MAAM,CAAC,KAAK,EAAE,OAAO,EAK/B;IAED;;;;;OAKG;IACH,IACW,UAAU,IAAI,QAAQ,GAAG,MAAM,CAEzC;IACD,IAAW,UAAU,CAAC,KAAK,EAAE,QAAQ,GAAG,MAAM,EAK7C;IAMD;;;OAGG;IACa,iBAAiB,IAAI,IAAI;IAUzC;;OAEG;IAEH,SAAS,CAAC,oBAAoB,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,EAAE,IAAI,EAAE,WAAW,GAAG,IAAI,GAAG,IAAI;IAcxF;;OAEG;IACH,OAAO,CAAC,WAAW;CAmBtB;AAED;;GAEG;AACH,yBAAiB,gBAAgB,CAAC;IAC9B,KAAY,KAAK,GAAG,sBAAsB,CAAC;CAC9C;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEX,UAAU,qBAAqB;QAE3B,mBAAmB,EAAE,gBAAgB,CAAC;KACzC;CACJ"}
+{"version":3,"file":"FocusRingElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/FocusRing/FocusRingElement.ts"],"names":[],"mappings":"AAGA,OAAO,EAAc,KAAK,WAAW,EAAE,MAAM,+BAA+B,CAAC;AAC7E,OAAO,EAAe,KAAK,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AAIrF,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,+CAA+C,CAAC;AASxF;;;;GAIG;AACH,MAAM,WAAW,sBAAuB,SAAQ,iBAAiB;IAE7D,OAAO,EAAE,OAAO,CAAC;IAEjB,MAAM,EAAE,OAAO,CAAC;IAEhB,UAAU,EAAE,QAAQ,GAAG,MAAM,CAAC;CAEjC;;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,qBAUa,gBACT,SAAQ,qBACR,YAAW,kBAAkB,EAAE,sBAAsB,EAAE,WAAW;IAIlE,OAAO,CAAC,oBAAoB,CAAoC;IAChE,OAAO,CAAC,qBAAqB,CAAoC;IACjE,OAAO,CAAC,wBAAwB,CAAoC;IACpE,OAAO,CAAC,QAAQ,CAAU;IAC1B,OAAO,CAAC,OAAO,CAAU;IACzB,OAAO,CAAC,WAAW,CAAoB;IAMvC;;OAEG;;IAgBH;;;;;;;OAOG;IACH,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;;OAKG;IACH,IAIW,OAAO,IAAI,OAAO,CAE5B;IACD,IAAW,OAAO,CAAC,KAAK,EAAE,OAAO,EAKhC;IAED;;;;;OAKG;IACH,IAIW,MAAM,IAAI,OAAO,CAE3B;IACD,IAAW,MAAM,CAAC,KAAK,EAAE,OAAO,EAK/B;IAED;;;;;OAKG;IACH,IACW,UAAU,IAAI,QAAQ,GAAG,MAAM,CAEzC;IACD,IAAW,UAAU,CAAC,KAAK,EAAE,QAAQ,GAAG,MAAM,EAK7C;IAMD;;;OAGG;IACa,iBAAiB,IAAI,IAAI;IAUzC;;OAEG;IAEH,SAAS,CAAC,oBAAoB,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,EAAE,IAAI,EAAE,WAAW,GAAG,IAAI,GAAG,IAAI;IAcxF;;OAEG;IACH,OAAO,CAAC,WAAW;CAmBtB;AAED;;GAEG;AACH,yBAAiB,gBAAgB,CAAC;IAC9B,KAAY,KAAK,GAAG,sBAAsB,CAAC;CAC9C;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEX,UAAU,qBAAqB;QAE3B,mBAAmB,EAAE,gBAAgB,CAAC;KACzC;CACJ"}

package/Controls/Components/Primitives/FocusRing/FocusRingElement.js

@@ -25,6 +25,8 @@ import { Themeable } from '../../../Behaviors/Themeable';
  *
  * @description
  * The Focus Ring element is a visible indicator that highlights the currently focused element, aiding accessibility.
+ * It provides visual feedback to users navigating with keyboard or other assistive technologies, helping them understand
+ * which element currently has focus.
  *
  * @name Focus Ring
  * @element mosaik-focus-ring
@@ -35,11 +37,23 @@ import { Themeable } from '../../../Behaviors/Themeable';
  * @cssprop {String} --focus-ring-width - The width.
  * @cssprop {String} --focus-ring-active-width - The active width.
  * @cssprop {String} --focus-ring-shape - The shape.
- * @cssprop {String} --focus-ring-x - The x.
- * @cssprop {String} --focus-ring-y - The y.
- * @cssprop {String} --focus-ring-blur - The blur.
- * @cssprop {String} --focus-ring-width - The width.
+ * @cssprop {String} --focus-ring-x - The x position.
+ * @cssprop {String} --focus-ring-y - The y position.
+ * @cssprop {String} --focus-ring-blur - The blur amount.
  * @cssprop {String} --focus-ring-color - The color.
+ * @cssprop {String} --focus-ring-border-color - The border color.
+ * @cssprop {String} --focus-ring-border-width - The border width.
+ * @cssprop {String} --focus-ring-border-style - The border style.
+ * @cssprop {String} --focus-ring-border-radius - The border radius.
+ * @cssprop {String} --focus-ring-shadow - The shadow.
+ * @cssprop {String} --focus-ring-transition-duration - The transition duration.
+ * @cssprop {String} --focus-ring-transition-mode - The transition mode.
+ * @cssprop {String} --focus-ring-transition-property - The transition property.
+ *
+ * @example
+ * ```html
+ * <mosaik-focus-ring visible="true" for="button"></mosaik-focus-ring>
+ * ```
  *
  * @public
  */

package/Controls/Components/Primitives/FocusRing/FocusRingElement.js.map

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

package/Controls/Components/Primitives/Skeleton/SkeletonElement.d.ts

@@ -5,20 +5,41 @@ import { ISkeletonElementProps } from './ISkeletonElementProps';
 type Target = '_blank' | '_self' | '_parent' | '_top';
 declare const SkeletonElement_base: (abstract new (...args: Array<any>) => import("../../../Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Dimensionable").IDimensionableProps) & typeof CustomElement & import("../../../Behaviors/Themeable").IThemeableCtor;
 /**
- * Skeleton - A placeholder component used to indicate loading or waiting states.
+ * Skeleton - A placeholder element that mimics content structure during loading states.
  *
+ * Provides visual feedback while content loads by displaying placeholder shapes that approximate
+ * the final content layout. Reduces perceived loading time and improves user experience.
+ * Supports various shapes (rectangle, circle, text) with optional shimmer animation.
+ *
+ * @name SkeletonElement
  * @element mosaik-skeleton
+ * @category Primitive
  *
- * @description
- * The Skeleton component is used to provide visual feedback to users while content is being loaded or processed.
- * It typically represents the approximate size and shape of the content to be loaded, helping users understand the layout of the page and reducing perceived loading times.
- * Skeletons are commonly used in applications with dynamic or asynchronous content, such as social media feeds, news articles, and product listings.
+ * @csspart skeleton - The main skeleton placeholder element
  *
- * @category Primitives
+ * @cssprop --skeleton-color - Background color of the skeleton placeholder
+ * @cssprop --skeleton-highlight-color - Color of the shimmer highlight animation
+ * @cssprop --skeleton-animation-duration - Duration of the shimmer animation cycle
+ * @cssprop --skeleton-border-radius - Border radius for rounded skeleton shapes
  *
  * @example
  * ```html
- * <mosaik-skeleton shape="rect"></mosaik-skeleton>
+ * <!-- Text line skeleton -->
+ * <mosaik-skeleton shape="text" width="200px" height="16px"></mosaik-skeleton>
+ *
+ * <!-- Avatar skeleton with shimmer -->
+ * <mosaik-skeleton shape="circle" width="40px" height="40px" shimmer></mosaik-skeleton>
+ *
+ * <!-- Card skeleton -->
+ * <mosaik-skeleton shape="rect" width="300px" height="200px" shimmer></mosaik-skeleton>
+ *
+ * <!-- Loading article layout -->
+ * <div class="article-skeleton">
+ *   <mosaik-skeleton shape="rect" width="100%" height="200px" shimmer></mosaik-skeleton>
+ *   <mosaik-skeleton shape="text" width="80%" height="24px"></mosaik-skeleton>
+ *   <mosaik-skeleton shape="text" width="60%" height="16px"></mosaik-skeleton>
+ *   <mosaik-skeleton shape="text" width="90%" height="16px"></mosaik-skeleton>
+ * </div>
  * ```
  *
  * @public

package/Controls/Components/Primitives/Skeleton/SkeletonElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SkeletonElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Skeleton/SkeletonElement.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAKtD,OAAO,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAShE,KAAK,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,CAAC;;AAEtD;;;;;;;;;;;;;;;;;;GAkBG;AACH,qBAUa,eACT,SAAQ,oBACR,YAAW,qBAAqB;IAIhC,OAAO,CAAC,MAAM,CAAgB;IAC9B,OAAO,CAAC,QAAQ,CAAU;IAM1B;;OAEG;;IAYH;;;;;;;OAOG;IACH,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAEM,MAAM,CAAC,EAAE,MAAM,CAAC;IAEvB;;;;;OAKG;IACH,IACW,KAAK,IAAI,aAAa,CAEhC;IACD,IAAW,KAAK,CAAC,KAAK,EAAE,aAAa,EAKpC;IAED;;;;;OAKG;IACH,IACW,OAAO,IAAI,OAAO,CAE5B;IACD,IAAW,OAAO,CAAC,KAAK,EAAE,OAAO,EAKhC;IAMD;;OAEG;IAEH,SAAS,CAAC,sBAAsB,CAAC,IAAI,CAAC,EAAE,SAAS,EAAE,IAAI,CAAC,EAAE,SAAS,GAAG,IAAI;IAK1E;;OAEG;IAEH,SAAS,CAAC,uBAAuB,CAAC,IAAI,CAAC,EAAE,SAAS,EAAE,IAAI,CAAC,EAAE,SAAS,GAAG,IAAI;CAO9E;AAED;;GAEG;AACH,yBAAiB,eAAe,CAAC;IAC7B,KAAY,KAAK,GAAG,qBAAqB,CAAC;CAC7C;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,iBAAiB,EAAE,eAAe,CAAC;KACtC;CACJ"}
+{"version":3,"file":"SkeletonElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Skeleton/SkeletonElement.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAKtD,OAAO,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAShE,KAAK,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,CAAC;;AAEtD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AACH,qBAUa,eACT,SAAQ,oBACR,YAAW,qBAAqB;IAIhC,OAAO,CAAC,MAAM,CAAgB;IAC9B,OAAO,CAAC,QAAQ,CAAU;IAM1B;;OAEG;;IAYH;;;;;;;OAOG;IACH,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAEM,MAAM,CAAC,EAAE,MAAM,CAAC;IAEvB;;;;;OAKG;IACH,IACW,KAAK,IAAI,aAAa,CAEhC;IACD,IAAW,KAAK,CAAC,KAAK,EAAE,aAAa,EAKpC;IAED;;;;;OAKG;IACH,IAEW,OAAO,IAAI,OAAO,CAE5B;IACD,IAAW,OAAO,CAAC,KAAK,EAAE,OAAO,EAKhC;IAMD;;OAEG;IAEH,SAAS,CAAC,sBAAsB,CAAC,IAAI,CAAC,EAAE,SAAS,EAAE,IAAI,CAAC,EAAE,SAAS,GAAG,IAAI;IAK1E;;OAEG;IAEH,SAAS,CAAC,uBAAuB,CAAC,IAAI,CAAC,EAAE,SAAS,EAAE,IAAI,CAAC,EAAE,SAAS,GAAG,IAAI;CAO9E;AAED;;GAEG;AACH,yBAAiB,eAAe,CAAC;IAC7B,KAAY,KAAK,GAAG,qBAAqB,CAAC;CAC7C;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,iBAAiB,EAAE,eAAe,CAAC;KACtC;CACJ"}

package/Controls/Components/Primitives/Skeleton/SkeletonElement.js

@@ -22,20 +22,41 @@ import { skeletonElementRetroStyle } from './Themes/SkeletonElement.Retro';
 import { skeletonElementCosmopolitanStyle } from './Themes/SkeletonElement.Cosmopolitan';
 import { Themeable } from '../../../Behaviors/Themeable';
 /**
- * Skeleton - A placeholder component used to indicate loading or waiting states.
+ * Skeleton - A placeholder element that mimics content structure during loading states.
  *
+ * Provides visual feedback while content loads by displaying placeholder shapes that approximate
+ * the final content layout. Reduces perceived loading time and improves user experience.
+ * Supports various shapes (rectangle, circle, text) with optional shimmer animation.
+ *
+ * @name SkeletonElement
  * @element mosaik-skeleton
+ * @category Primitive
  *
- * @description
- * The Skeleton component is used to provide visual feedback to users while content is being loaded or processed.
- * It typically represents the approximate size and shape of the content to be loaded, helping users understand the layout of the page and reducing perceived loading times.
- * Skeletons are commonly used in applications with dynamic or asynchronous content, such as social media feeds, news articles, and product listings.
+ * @csspart skeleton - The main skeleton placeholder element
  *
- * @category Primitives
+ * @cssprop --skeleton-color - Background color of the skeleton placeholder
+ * @cssprop --skeleton-highlight-color - Color of the shimmer highlight animation
+ * @cssprop --skeleton-animation-duration - Duration of the shimmer animation cycle
+ * @cssprop --skeleton-border-radius - Border radius for rounded skeleton shapes
  *
  * @example
  * ```html
- * <mosaik-skeleton shape="rect"></mosaik-skeleton>
+ * <!-- Text line skeleton -->
+ * <mosaik-skeleton shape="text" width="200px" height="16px"></mosaik-skeleton>
+ *
+ * <!-- Avatar skeleton with shimmer -->
+ * <mosaik-skeleton shape="circle" width="40px" height="40px" shimmer></mosaik-skeleton>
+ *
+ * <!-- Card skeleton -->
+ * <mosaik-skeleton shape="rect" width="300px" height="200px" shimmer></mosaik-skeleton>
+ *
+ * <!-- Loading article layout -->
+ * <div class="article-skeleton">
+ *   <mosaik-skeleton shape="rect" width="100%" height="200px" shimmer></mosaik-skeleton>
+ *   <mosaik-skeleton shape="text" width="80%" height="24px"></mosaik-skeleton>
+ *   <mosaik-skeleton shape="text" width="60%" height="16px"></mosaik-skeleton>
+ *   <mosaik-skeleton shape="text" width="90%" height="16px"></mosaik-skeleton>
+ * </div>
  * ```
  *
  * @public
@@ -121,7 +142,8 @@ __decorate([
     __metadata("design:paramtypes", [String])
 ], SkeletonElement.prototype, "shape", null);
 __decorate([
-    Attribute({ type: Boolean, useDefault: true }),
+    Attribute({ type: Boolean,
+        useDefault: true }),
     __metadata("design:type", Boolean),
     __metadata("design:paramtypes", [Boolean])
 ], SkeletonElement.prototype, "shimmer", null);

package/Controls/Components/Primitives/Skeleton/SkeletonElement.js.map

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

package/Controls/Components/Primitives/Spacer/SpacerElement.d.ts

@@ -4,14 +4,45 @@ import { CustomElement } from '../../Abstracts/CustomElement';
 import { type ISpacerElementProps } from './ISpacerElementProps';
 declare const SpacerElement_base: (abstract new (...args: Array<any>) => import("../../../Behaviors/Themeable").IThemeableProps) & typeof CustomElement & import("../../../Behaviors/Themeable").IThemeableCtor;
 /**
- * Spacer - An empty or transparent element used for creating space or layout separation.
+ * Spacer - A flexible spacing element for creating consistent gaps and layout control.
  *
- * @description
- * The Spacer component is a versatile layout element used to add spacing, margins, or gaps between other UI elements.
- * It helps control the visual layout and alignment of components in a user interface, providing consistent spacing between elements.
- * Spacers can be applied both horizontally and vertically to achieve precise spacing and alignment.
+ * Provides precise spacing control between UI elements with configurable thickness, size multipliers,
+ * and directional spacing. Essential for maintaining consistent visual rhythm and alignment in layouts.
+ * Supports responsive spacing based on design system tokens.
  *
+ * @name SpacerElement
  * @element mosaik-spacer
+ * @category Primitive
+ *
+ * @csspart spacer - The main spacing container element
+ *
+ * @cssprop --spacer-thickness - Base thickness for the spacer element
+ * @cssprop --spacer-multiplier - Multiplier applied to base spacing values
+ * @cssprop --spacer-size - Predefined size category (xs, sm, md, lg, xl)
+ *
+ * @example
+ * ```html
+ * <!-- Basic spacing -->
+ * <div>Content Above</div>
+ * <mosaik-spacer></mosaik-spacer>
+ * <div>Content Below</div>
+ *
+ * <!-- Custom multiplier for larger gap -->
+ * <mosaik-spacer multiplier="2"></mosaik-spacer>
+ *
+ * <!-- Size-based spacing -->
+ * <mosaik-spacer size="lg"></mosaik-spacer>
+ *
+ * <!-- Multiple thickness values -->
+ * <mosaik-spacer thickness="md lg"></mosaik-spacer>
+ *
+ * <!-- Flex layout spacing -->
+ * <div style="display: flex; align-items: center;">
+ *   <button>Button 1</button>
+ *   <mosaik-spacer></mosaik-spacer>
+ *   <button>Button 2</button>
+ * </div>
+ * ```
  *
  * @public
  */

package/Controls/Components/Primitives/Spacer/SpacerElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SpacerElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Spacer/SpacerElement.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAC3C,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACtD,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,EAAgC,KAAK,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;;AAQ/F;;;;;;;;;;;GAWG;AACH,qBAUa,aACT,SAAQ,kBACR,YAAW,mBAAmB;IAI9B,OAAO,CAAC,WAAW,CAAS;IAC5B,OAAO,CAAC,KAAK,CAAO;IACpB,OAAO,CAAC,UAAU,CAAwB;IAC1C,OAAO,CAAC,OAAO,CAAU;IACzB,OAAO,CAAC,oBAAoB,CAA6B;IAMzD;;OAEG;;IAeH;;;;;;;OAOG;IACH,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;;;;OAOG;IACH,IACW,UAAU,IAAI,MAAM,CAE9B;IACD,IAAW,UAAU,CAAC,KAAK,EAAE,MAAM,EAOlC;IAED;;;;;;;;OAQG;IACH,IACW,IAAI,IAAI,IAAI,CAEtB;IACD,IAAW,IAAI,CAAC,KAAK,EAAE,IAAI,EAK1B;IAED;;;;;;;;OAQG;IACH,IAQW,SAAS,IAAI,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,IAAI,CAEtD;IACD,IAAW,SAAS,CAAC,KAAK,EAAE,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,IAAI,EAK1D;IAED;;;;;;;;OAQG;IACH,IAIW,MAAM,IAAI,OAAO,CAE3B;IACD,IAAW,MAAM,CAAC,KAAK,EAAE,OAAO,EAK/B;IAED;;;;;;;OAOG;IACH,IACW,mBAAmB,IAAI,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAE3D;IACD,IAAW,mBAAmB,CAAC,KAAK,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,EAK/D;IAMD;;;;;OAKG;IACI,eAAe,CAAC,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,MAAM,GAAG,OAAO;IAyBrE;;;;OAIG;IACH,OAAO,CAAC,cAAc;IAiBtB;;;;OAIG;IACH,OAAO,CAAC,iBAAiB;IAqCzB;;;;OAIG;IACH,OAAO,CAAC,eAAe;IAiBvB;;;;OAIG;IACH,OAAO,CAAC,SAAS;CAcpB;AAED;;GAEG;AACH,yBAAiB,aAAa,CAAC;IAC3B,KAAY,KAAK,GAAG,mBAAmB,CAAC;CAC3C;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEX,UAAU,qBAAqB;QAE3B,eAAe,EAAE,aAAa,CAAC;KAClC;CACJ"}
+{"version":3,"file":"SpacerElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Spacer/SpacerElement.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAC3C,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACtD,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,EAAgC,KAAK,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;;AAQ/F;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0CG;AACH,qBAUa,aACT,SAAQ,kBACR,YAAW,mBAAmB;IAI9B,OAAO,CAAC,WAAW,CAAS;IAC5B,OAAO,CAAC,KAAK,CAAO;IACpB,OAAO,CAAC,UAAU,CAAwB;IAC1C,OAAO,CAAC,OAAO,CAAU;IACzB,OAAO,CAAC,oBAAoB,CAA6B;IAMzD;;OAEG;;IAeH;;;;;;;OAOG;IACH,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;;;;OAOG;IACH,IACW,UAAU,IAAI,MAAM,CAE9B;IACD,IAAW,UAAU,CAAC,KAAK,EAAE,MAAM,EAOlC;IAED;;;;;;;;OAQG;IACH,IACW,IAAI,IAAI,IAAI,CAEtB;IACD,IAAW,IAAI,CAAC,KAAK,EAAE,IAAI,EAK1B;IAED;;;;;;;;OAQG;IACH,IAQW,SAAS,IAAI,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,IAAI,CAEtD;IACD,IAAW,SAAS,CAAC,KAAK,EAAE,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,IAAI,EAK1D;IAED;;;;;;;;OAQG;IACH,IAIW,MAAM,IAAI,OAAO,CAE3B;IACD,IAAW,MAAM,CAAC,KAAK,EAAE,OAAO,EAK/B;IAED;;;;;;;OAOG;IACH,IACW,mBAAmB,IAAI,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAE3D;IACD,IAAW,mBAAmB,CAAC,KAAK,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,EAK/D;IAMD;;;;;OAKG;IACI,eAAe,CAAC,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,MAAM,GAAG,OAAO;IAyBrE;;;;OAIG;IACH,OAAO,CAAC,cAAc;IAiBtB;;;;OAIG;IACH,OAAO,CAAC,iBAAiB;IAqCzB;;;;OAIG;IACH,OAAO,CAAC,eAAe;IAiBvB;;;;OAIG;IACH,OAAO,CAAC,SAAS;CAcpB;AAED;;GAEG;AACH,yBAAiB,aAAa,CAAC;IAC3B,KAAY,KAAK,GAAG,mBAAmB,CAAC;CAC3C;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEX,UAAU,qBAAqB;QAE3B,eAAe,EAAE,aAAa,CAAC;KAClC;CACJ"}

package/Controls/Components/Primitives/Spacer/SpacerElement.js

@@ -20,14 +20,45 @@ import { spacerElementCosmopolitanStyle } from './Themes/SpacerElement.Cosmopoli
 import { Themeable } from '../../../Behaviors/Themeable';
 import { Property } from '../../../Decorators/PropertyDecorator';
 /**
- * Spacer - An empty or transparent element used for creating space or layout separation.
+ * Spacer - A flexible spacing element for creating consistent gaps and layout control.
  *
- * @description
- * The Spacer component is a versatile layout element used to add spacing, margins, or gaps between other UI elements.
- * It helps control the visual layout and alignment of components in a user interface, providing consistent spacing between elements.
- * Spacers can be applied both horizontally and vertically to achieve precise spacing and alignment.
+ * Provides precise spacing control between UI elements with configurable thickness, size multipliers,
+ * and directional spacing. Essential for maintaining consistent visual rhythm and alignment in layouts.
+ * Supports responsive spacing based on design system tokens.
  *
+ * @name SpacerElement
  * @element mosaik-spacer
+ * @category Primitive
+ *
+ * @csspart spacer - The main spacing container element
+ *
+ * @cssprop --spacer-thickness - Base thickness for the spacer element
+ * @cssprop --spacer-multiplier - Multiplier applied to base spacing values
+ * @cssprop --spacer-size - Predefined size category (xs, sm, md, lg, xl)
+ *
+ * @example
+ * ```html
+ * <!-- Basic spacing -->
+ * <div>Content Above</div>
+ * <mosaik-spacer></mosaik-spacer>
+ * <div>Content Below</div>
+ *
+ * <!-- Custom multiplier for larger gap -->
+ * <mosaik-spacer multiplier="2"></mosaik-spacer>
+ *
+ * <!-- Size-based spacing -->
+ * <mosaik-spacer size="lg"></mosaik-spacer>
+ *
+ * <!-- Multiple thickness values -->
+ * <mosaik-spacer thickness="md lg"></mosaik-spacer>
+ *
+ * <!-- Flex layout spacing -->
+ * <div style="display: flex; align-items: center;">
+ *   <button>Button 1</button>
+ *   <mosaik-spacer></mosaik-spacer>
+ *   <button>Button 2</button>
+ * </div>
+ * ```
  *
  * @public
  */

package/Controls/Components/Primitives/Spacer/SpacerElement.js.map

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

package/Controls/Components/Primitives/Text/TextElement.d.ts

@@ -4,22 +4,100 @@ import { CustomElement } from '../../Abstracts/CustomElement';
 import type { ITextElementProps } from './ITextElementProps';
 declare const TextElement_base: (abstract new (...args: Array<any>) => import("../../../Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Variantable").IVariantableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Disableable").IDisableableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/TextFormattable").ITextFormattableProps) & typeof CustomElement & import("../../../Behaviors/Themeable").IThemeableCtor;
 /**
- * Text - A user interface component for displaying written content or information.
+ * Text - A fundamental typography component for displaying formatted text content with comprehensive styling options.
  *
- * @description
- * The Text component is used to display written content or information to users. It is a fundamental element for
- * presenting text-based content in various user interfaces, such as paragraphs, headings, labels, or descriptions.
- * Text components can include both plain text and formatted text, allowing developers to style and structure the
- * content as needed.
+ * Provides flexible text rendering with built-in formatting capabilities, variant support, and extensive
+ * customization options. Supports semantic text roles (headings, body, captions), text alignment,
+ * formatting functions, and accessibility features for comprehensive typography management.
  *
+ * @name TextElement
  * @element mosaik-text
- * @category Display
+ * @category Primitives
  *
- * @slot text - The text slot.
+ * @slot text - Primary text content area for displaying formatted text
+ * @slot - Default content area for text and inline elements
+ *
+ * @csspart text - Text content styling container for typography control
+ *
+ * @cssprop --text-font-family - Font family for text content
+ * @cssprop --text-font-size - Font size for text content
+ * @cssprop --text-font-line-height - Line height for text content
+ * @cssprop --text-font-weight - Font weight for text content
+ * @cssprop --text-font-letter-spacing - Letter spacing for text content
+ * @cssprop --text-font-decoration - Text decoration (underline, strikethrough, etc.)
+ * @cssprop --text-font-transform - Text transform (uppercase, lowercase, capitalize)
+ * @cssprop --text-padding-top - Top padding for text container
+ * @cssprop --text-padding-right - Right padding for text container
+ * @cssprop --text-padding-bottom - Bottom padding for text container
+ * @cssprop --text-padding-left - Left padding for text container
+ * @cssprop --text-gap - Gap between text elements when multiple
+ * @cssprop --text-transition-duration - Animation duration for text changes
+ * @cssprop --text-transition-mode - Animation easing mode for text transitions
+ * @cssprop --text-transition-property - CSS properties to animate during transitions
+ * @cssprop --text-foreground-color - Text color for primary content
+ * @cssprop --text-background-color - Background color for text container
+ * @cssprop --text-border-color - Border color for text container
+ * @cssprop --text-border-width - Border width for text container
+ * @cssprop --text-border-radius - Border radius for text container styling
+ * @cssprop --text-border-style - Border style for text container
+ * @cssprop --text-shadow - Text shadow effect for enhanced visibility
+ *
+ * @dependency TextFormatter - For advanced text formatting and processing
+ * @dependency TextAlignment - For text alignment and layout control
  *
  * @example
  * ```html
- * <mosaik-text text="This is an example of a Text component.">
+ * <!-- Basic text content -->
+ * <mosaik-text>Welcome to our application</mosaik-text>
+ *
+ * <!-- Heading text with variant -->
+ * <mosaik-text variant="headline">Page Title</mosaik-text>
+ *
+ * <!-- Body text with formatting -->
+ * <mosaik-text variant="body" alignment="center">
+ *   This is centered body text with standard styling.
+ * </mosaik-text>
+ *
+ * <!-- Caption text -->
+ * <mosaik-text variant="caption" alignment="right">
+ *   Last updated: March 15, 2024
+ * </mosaik-text>
+ *
+ * <!-- Formatted text with custom styling -->
+ * <mosaik-text
+ *   variant="subtitle"
+ *   style="
+ *     --text-foreground-color: #007acc;
+ *     --text-font-weight: 600;
+ *     --text-font-transform: uppercase;
+ *   ">
+ *   Important Notice
+ * </mosaik-text>
+ *
+ * <!-- Text with slot content -->
+ * <mosaik-text variant="body">
+ *   <span slot="text">
+ *     Visit our <a href="/docs">documentation</a> for more information.
+ *   </span>
+ * </mosaik-text>
+ *
+ * <!-- Disabled text -->
+ * <mosaik-text variant="body" disabled="true">
+ *   This feature is currently unavailable.
+ * </mosaik-text>
+ *
+ * <!-- Text with custom formatting -->
+ * <mosaik-text
+ *   variant="body"
+ *   formatter="currency"
+ *   value="1299.99">
+ * </mosaik-text>
+ *
+ * <!-- Multiline text content -->
+ * <mosaik-text variant="body" alignment="justify">
+ *   Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+ *   Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+ *   Ut enim ad minim veniam, quis nostrud exercitation ullamco.
  * </mosaik-text>
  * ```
  *