@breadstone/mosaik-elements-foundation 0.1.9 → 0.1.11

package/Controls/Components/Selectors/Stepper/Themes/StepperElement.Memphis.js

@@ -105,19 +105,46 @@ export function stepperElementMemphisStyle() {
 
 :host [part="header"].is-vertical {
   flex-direction: column;
+  gap: 0;
 }
 
 :host [part="header"].is-vertical [part="step-container"] {
   flex-direction: column;
-  align-items: flex-start;
+  flex: none;
+  align-items: stretch;
+  gap: 0;
+  width: 100%;
+}
+
+:host [part="header"].is-vertical [part="step-body"] {
+  grid-template-columns: var(--stepper-icon-size) minmax(0, 1fr);
+  -moz-column-gap: var(--stepper-gap);
+  column-gap: var(--stepper-gap);
+  min-height: var(--stepper-vertical-connector-length);
+  width: 100%;
+  display: grid;
+}
+
+:host [part="header"].is-vertical [part="step-body"] [part="content"] {
+  padding-bottom: var(--stepper-content-gap);
+  grid-column: 2;
+  min-width: 0;
+  margin-top: 0;
+  display: none;
+}
+
+:host [part="header"].is-vertical [part="step-body"].is-active [part="content"] {
+  display: block;
 }
 
-:host [part="header"].is-vertical [part="connector"] {
+:host [part="header"].is-vertical [part="step-body"] [part="connector"] {
   min-width: unset;
   width: var(--stepper-connector-size);
-  height: var(--stepper-vertical-connector-length);
+  height: auto;
   min-height: 48px;
   margin: var(--stepper-vertical-connector-margin) 0;
+  grid-column: 1;
+  place-self: stretch center;
 }
 
 :host [part="step-container"] {
@@ -178,7 +205,7 @@ export function stepperElementMemphisStyle() {
   flex: 1 1 0;
 }
 
-:host [part="content"], :host [part="footer"] {
+:host > [part="content"], :host > [part="footer"] {
   margin-top: var(--stepper-content-gap);
 }
 

package/Controls/Components/Selectors/Stepper/Themes/StepperElement.Memphis.js.map

@@ -1 +1 @@
-{"version":3,"file":"StepperElement.Memphis.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Selectors/Stepper/Themes/StepperElement.Memphis.ts"],"names":[],"mappings":"AAAA,iFAAiF;AACjF,mBAAmB;AACnB,yCAAyC;AACzC,qGAAqG;AACrG,oBAAoB;AACpB,iFAAiF;AAEjF,kBAAkB;AAElB,OAAO,EAAE,GAAG,EAAkB,MAAM,wBAAwB,CAAC;AAE7D,aAAa;AAEb;;GAEG;AACH,MAAM,UAAU,0BAA0B;IACtC,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAmLT,CAAC;AACN,CAAC"}
+{"version":3,"file":"StepperElement.Memphis.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Selectors/Stepper/Themes/StepperElement.Memphis.ts"],"names":[],"mappings":"AAAA,iFAAiF;AACjF,mBAAmB;AACnB,yCAAyC;AACzC,qGAAqG;AACrG,oBAAoB;AACpB,iFAAiF;AAEjF,kBAAkB;AAElB,OAAO,EAAE,GAAG,EAAkB,MAAM,wBAAwB,CAAC;AAE7D,aAAa;AAEb;;GAEG;AACH,MAAM,UAAU,0BAA0B;IACtC,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA8MT,CAAC;AACN,CAAC"}

package/Controls/Components/States/Busy/BusyStateElement.d.ts

@@ -1,6 +1,7 @@
+import { ISlottable } from '../../../Behaviors/Slottable';
 import { StateBaseElement } from '../Abstracts/StateBaseElement';
 import { IBusyStateElementProps } from './IBusyStateElementProps';
-declare const BusyStateElement_base: (abstract new (...args: Array<any>) => import("../../../Behaviors/Themeable").IThemeableProps) & typeof StateBaseElement & import("../../../Behaviors/Themeable").IThemeableCtor;
+declare const BusyStateElement_base: (abstract new (...args: Array<any>) => import("../../../Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Slottable").ISlottableProps & ISlottable) & typeof StateBaseElement & import("../../../Behaviors/Themeable").IThemeableCtor;
 /**
  * BusyState - A loading state component that indicates ongoing processes or data retrieval operations.
  *
@@ -16,8 +17,10 @@ declare const BusyStateElement_base: (abstract new (...args: Array<any>) => impo
  * @element mosaik-busy-state
  * @category States
  *
- * @slot - Default content area for additional loading state information or custom elements
+ * @slot  - The default slot.
  * @slot actions - Action buttons or controls available during loading (e.g., cancel operation, dismiss)
+ * @slot - Default content area for additional loading state information or custom elements
+ * @slot header - The header slot.
  *
  * @csspart actions - The container for action slot elements
  * @csspart content - The content text container for detailed loading information
@@ -84,7 +87,7 @@ declare const BusyStateElement_base: (abstract new (...args: Array<any>) => impo
  *
  * @public
  */
-export declare class BusyStateElement extends BusyStateElement_base implements IBusyStateElementProps {
+export declare class BusyStateElement extends BusyStateElement_base implements IBusyStateElementProps, ISlottable {
     private _header;
     private _icon;
     /**

package/Controls/Components/States/Busy/BusyStateElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BusyStateElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Busy/BusyStateElement.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAEjE,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;;AAOlE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkFG;AACH,qBAaa,gBACT,SAAQ,qBACR,YAAW,sBAAsB;IAIjC,OAAO,CAAC,OAAO,CAAS;IACxB,OAAO,CAAC,KAAK,CAAS;IAMtB;;;;OAIG;;IAYH;;;;;;MAME;IACF,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;;;OAMG;IACH,IACW,IAAI,IAAI,MAAM,CAExB;IAED,IAAW,IAAI,CAAC,KAAK,EAAE,MAAM,EAI5B;IAED;;;;;;;OAOG;IACH,IACW,MAAM,IAAI,MAAM,CAE1B;IAED,IAAW,MAAM,CAAC,KAAK,EAAE,MAAM,EAI9B;CAIJ;AAED;;GAEG;AACH,yBAAiB,gBAAgB,CAAC;IAC9B,KAAY,KAAK,GAAG,sBAAsB,CAAC;CAC9C;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,mBAAmB,EAAE,gBAAgB,CAAC;KACzC;CACJ"}
+{"version":3,"file":"BusyStateElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Busy/BusyStateElement.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAa,MAAM,8BAA8B,CAAC;AAOrE,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAEjE,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;;AAOlE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoFG;AACH,qBAaa,gBACT,SAAQ,qBACR,YAAW,sBAAsB,EAAE,UAAU;IAI7C,OAAO,CAAC,OAAO,CAAS;IACxB,OAAO,CAAC,KAAK,CAAS;IAMtB;;;;OAIG;;IAYH;;;;;;MAME;IACF,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;;;OAMG;IACH,IACW,IAAI,IAAI,MAAM,CAExB;IAED,IAAW,IAAI,CAAC,KAAK,EAAE,MAAM,EAI5B;IAED;;;;;;;OAOG;IACH,IACW,MAAM,IAAI,MAAM,CAE1B;IAED,IAAW,MAAM,CAAC,KAAK,EAAE,MAAM,EAI9B;CAIJ;AAED;;GAEG;AACH,yBAAiB,gBAAgB,CAAC;IAC9B,KAAY,KAAK,GAAG,sBAAsB,CAAC;CAC9C;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,mBAAmB,EAAE,gBAAgB,CAAC;KACzC;CACJ"}

package/Controls/Components/States/Busy/BusyStateElement.js

@@ -8,6 +8,7 @@ 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 { Slottable } from '../../../Behaviors/Slottable';
 import { Themeable } from '../../../Behaviors/Themeable';
 import { Attribute } from '../../../Decorators/AttributeDecorator';
 import { Component } from '../../../Decorators/ComponentDecorator';
@@ -35,8 +36,10 @@ import { busyStateElementMemphisStyle } from './Themes/BusyStateElement.Memphis'
  * @element mosaik-busy-state
  * @category States
  *
- * @slot - Default content area for additional loading state information or custom elements
+ * @slot  - The default slot.
  * @slot actions - Action buttons or controls available during loading (e.g., cancel operation, dismiss)
+ * @slot - Default content area for additional loading state information or custom elements
+ * @slot header - The header slot.
  *
  * @csspart actions - The container for action slot elements
  * @csspart content - The content text container for detailed loading information
@@ -103,7 +106,7 @@ import { busyStateElementMemphisStyle } from './Themes/BusyStateElement.Memphis'
  *
  * @public
  */
-let BusyStateElement = class BusyStateElement extends Themeable(StateBaseElement) {
+let BusyStateElement = class BusyStateElement extends Themeable(Slottable(StateBaseElement)) {
     // #region Fields
     _header;
     _icon;

package/Controls/Components/States/Busy/BusyStateElement.js.map

@@ -1 +1 @@
-{"version":3,"file":"BusyStateElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Busy/BusyStateElement.ts"],"names":[],"mappings":"AAAA,kBAAkB;;;;;;;;;;AAElB,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,QAAQ,EAAE,MAAM,uCAAuC,CAAC;AACjE,OAAO,EAAE,WAAW,EAAE,MAAM,mCAAmC,CAAC;AAChE,OAAO,EAAE,mBAAmB,EAAE,MAAM,+CAA+C,CAAC;AACpF,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AACjE,OAAO,EAAE,wBAAwB,EAAE,MAAM,4BAA4B,CAAC;AAEtE,OAAO,EAAE,iCAAiC,EAAE,MAAM,wCAAwC,CAAC;AAC3F,OAAO,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC;AACzE,OAAO,EAAE,4BAA4B,EAAE,MAAM,mCAAmC,CAAC;AAEjF,aAAa;AAEb;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkFG;AAcI,IAAM,gBAAgB,GAAtB,MAAM,gBACT,SAAQ,SAAS,CAAC,gBAAgB,CAAC;IAGnC,iBAAiB;IAET,OAAO,CAAS;IAChB,KAAK,CAAS;IAEtB,aAAa;IAEb,eAAe;IAEf;;;;OAIG;IACH;QACI,KAAK,EAAE,CAAC;QAER,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;QAChB,IAAI,CAAC,OAAO,GAAG,EAAE,CAAC;IACtB,CAAC;IAED,aAAa;IAEb,qBAAqB;IAErB;;;;;;MAME;IACK,MAAM,KAAK,EAAE;QAChB,OAAO,mBAAmB,CAAC;IAC/B,CAAC;IAED;;;;;;OAMG;IACH,IACW,IAAI;QACX,OAAO,IAAI,CAAC,KAAK,CAAC;IACtB,CAAC;IAED,IAAW,IAAI,CAAC,KAAa;QACzB,IAAI,IAAI,CAAC,KAAK,KAAK,KAAK,EAAE,CAAC;YACvB,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;QACvB,CAAC;IACL,CAAC;IAED;;;;;;;OAOG;IACH,IACW,MAAM;QACb,OAAO,IAAI,CAAC,OAAO,CAAC;IACxB,CAAC;IAED,IAAW,MAAM,CAAC,KAAa;QAC3B,IAAI,IAAI,CAAC,OAAO,KAAK,KAAK,EAAE,CAAC;YACzB,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QACzB,CAAC;IACL,CAAC;CAIJ,CAAA;AAhCG;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;;4CAG1B;AAgBD;IAAC,SAAS,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;;8CAG3B;AArEQ,gBAAgB;IAb5B,SAAS,CAAC;QACP,QAAQ,EAAE,mBAAmB;QAC7B,QAAQ,EAAE,wBAAwB;QAClC,MAAM,EAAE;YACJ,GAAG,EAAE,wBAAwB;YAC7B,OAAO,EAAE,4BAA4B;YACrC,YAAY,EAAE,iCAAiC;SAClD;QACD,OAAO,EAAE;YACL,mBAAmB;YACnB,WAAW;SACd;KACJ,CAAC;;GACW,gBAAgB,CA+E5B"}
+{"version":3,"file":"BusyStateElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Busy/BusyStateElement.ts"],"names":[],"mappings":"AAAA,kBAAkB;;;;;;;;;;AAElB,OAAO,EAAc,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACrE,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,QAAQ,EAAE,MAAM,uCAAuC,CAAC;AACjE,OAAO,EAAE,WAAW,EAAE,MAAM,mCAAmC,CAAC;AAChE,OAAO,EAAE,mBAAmB,EAAE,MAAM,+CAA+C,CAAC;AACpF,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AACjE,OAAO,EAAE,wBAAwB,EAAE,MAAM,4BAA4B,CAAC;AAEtE,OAAO,EAAE,iCAAiC,EAAE,MAAM,wCAAwC,CAAC;AAC3F,OAAO,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC;AACzE,OAAO,EAAE,4BAA4B,EAAE,MAAM,mCAAmC,CAAC;AAEjF,aAAa;AAEb;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoFG;AAcI,IAAM,gBAAgB,GAAtB,MAAM,gBACT,SAAQ,SAAS,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAG9C,iBAAiB;IAET,OAAO,CAAS;IAChB,KAAK,CAAS;IAEtB,aAAa;IAEb,eAAe;IAEf;;;;OAIG;IACH;QACI,KAAK,EAAE,CAAC;QAER,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;QAChB,IAAI,CAAC,OAAO,GAAG,EAAE,CAAC;IACtB,CAAC;IAED,aAAa;IAEb,qBAAqB;IAErB;;;;;;MAME;IACK,MAAM,KAAK,EAAE;QAChB,OAAO,mBAAmB,CAAC;IAC/B,CAAC;IAED;;;;;;OAMG;IACH,IACW,IAAI;QACX,OAAO,IAAI,CAAC,KAAK,CAAC;IACtB,CAAC;IAED,IAAW,IAAI,CAAC,KAAa;QACzB,IAAI,IAAI,CAAC,KAAK,KAAK,KAAK,EAAE,CAAC;YACvB,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;QACvB,CAAC;IACL,CAAC;IAED;;;;;;;OAOG;IACH,IACW,MAAM;QACb,OAAO,IAAI,CAAC,OAAO,CAAC;IACxB,CAAC;IAED,IAAW,MAAM,CAAC,KAAa;QAC3B,IAAI,IAAI,CAAC,OAAO,KAAK,KAAK,EAAE,CAAC;YACzB,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QACzB,CAAC;IACL,CAAC;CAIJ,CAAA;AAhCG;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;;4CAG1B;AAgBD;IAAC,SAAS,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;;8CAG3B;AArEQ,gBAAgB;IAb5B,SAAS,CAAC;QACP,QAAQ,EAAE,mBAAmB;QAC7B,QAAQ,EAAE,wBAAwB;QAClC,MAAM,EAAE;YACJ,GAAG,EAAE,wBAAwB;YAC7B,OAAO,EAAE,4BAA4B;YACrC,YAAY,EAAE,iCAAiC;SAClD;QACD,OAAO,EAAE;YACL,mBAAmB;YACnB,WAAW;SACd;KACJ,CAAC;;GACW,gBAAgB,CA+E5B"}

package/Controls/Components/States/Busy/BusyStateElementTemplate.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BusyStateElementTemplate.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Busy/BusyStateElementTemplate.ts"],"names":[],"mappings":"AAEA,OAAO,EAAQ,KAAK,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAGjE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAI3D;;;;GAIG;AACH,wBAAgB,wBAAwB,CAAC,CAAC,SAAS,gBAAgB,EAAE,CAAC,EAAE,CAAC,GAAG,cAAc,CA4BzF"}
+{"version":3,"file":"BusyStateElementTemplate.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Busy/BusyStateElementTemplate.ts"],"names":[],"mappings":"AAEA,OAAO,EAAQ,KAAK,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAGjE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAI3D;;;;GAIG;AACH,wBAAgB,wBAAwB,CAAC,CAAC,SAAS,gBAAgB,EAAE,CAAC,EAAE,CAAC,GAAG,cAAc,CAgCzF"}

package/Controls/Components/States/Busy/BusyStateElementTemplate.js

@@ -14,22 +14,26 @@ export function busyStateElementTemplate(e) {
                               .radius="${'26px'}"
                               .isIndeterminate="${true}"></mosaik-progress-ring>
         <div part="root">
-            ${when(e.header, () => html `
-            <mosaik-text part="header"
-                         .readonly="${true}"
-                         .wrap="${true}"
-                         .alignment="${TextAlignment.Center}"
-                         .text="${e.header}"
-                         .formatter="${e.formatter}"></mosaik-text>
-            `)}
-            ${when(e.content, () => html `
-            <mosaik-text part="content"
-                         .readonly="${true}"
-                         .wrap="${true}"
-                         .alignment="${TextAlignment.Center}"
-                         .text="${e.content}"
-                         .formatter="${e.formatter}"></mosaik-text>
-            `)}
+            <slot name="header">
+                ${when(e.header.trim(), () => html `
+                <mosaik-text part="header"
+                             .readonly="${true}"
+                             .wrap="${true}"
+                             .alignment="${TextAlignment.Center}"
+                             .text="${e.header}"
+                             .formatter="${e.formatter}"></mosaik-text>
+                `)}
+            </slot>
+            <slot name="content">
+                ${when(e.content.trim(), () => html `
+                <mosaik-text part="content"
+                             .readonly="${true}"
+                             .wrap="${true}"
+                             .alignment="${TextAlignment.Center}"
+                             .text="${e.content}"
+                             .formatter="${e.formatter}"></mosaik-text>
+                `)}
+            </slot>
             <slot></slot>
         </div>
         <div part="actions" ?hidden="${!e.hasSlotContent('actions')}">

package/Controls/Components/States/Busy/BusyStateElementTemplate.js.map

@@ -1 +1 @@
-{"version":3,"file":"BusyStateElementTemplate.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Busy/BusyStateElementTemplate.ts"],"names":[],"mappings":"AAAA,kBAAkB;AAElB,OAAO,EAAE,IAAI,EAAuB,MAAM,sBAAsB,CAAC;AACjE,OAAO,EAAE,IAAI,EAAE,MAAM,gCAAgC,CAAC;AACtD,OAAO,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAG7D,aAAa;AAEb;;;;GAIG;AACH,MAAM,UAAU,wBAAwB,CAA6B,CAAI;IACrE,OAAO,IAAI,CAAA;;yCAE0B,MAAM;kDACG,IAAI;;cAExC,IAAI,CAAC,CAAC,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;sCAED,IAAI;kCACR,IAAI;uCACC,aAAa,CAAC,MAAM;kCACzB,CAAC,CAAC,MAAM;uCACH,CAAC,CAAC,SAAS;aACrC,CAAC;cACA,IAAI,CAAC,CAAC,CAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;sCAEF,IAAI;kCACR,IAAI;uCACC,aAAa,CAAC,MAAM;kCACzB,CAAC,CAAC,OAAO;uCACJ,CAAC,CAAC,SAAS;aACrC,CAAC;;;uCAGyB,CAAC,CAAC,CAAC,cAAc,CAAC,SAAS,CAAC;;;KAG9D,CAAC;AACN,CAAC"}
+{"version":3,"file":"BusyStateElementTemplate.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Busy/BusyStateElementTemplate.ts"],"names":[],"mappings":"AAAA,kBAAkB;AAElB,OAAO,EAAE,IAAI,EAAuB,MAAM,sBAAsB,CAAC;AACjE,OAAO,EAAE,IAAI,EAAE,MAAM,gCAAgC,CAAC;AACtD,OAAO,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAG7D,aAAa;AAEb;;;;GAIG;AACH,MAAM,UAAU,wBAAwB,CAA6B,CAAI;IACrE,OAAO,IAAI,CAAA;;yCAE0B,MAAM;kDACG,IAAI;;;kBAGpC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,EAAE,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;0CAER,IAAI;sCACR,IAAI;2CACC,aAAa,CAAC,MAAM;sCACzB,CAAC,CAAC,MAAM;2CACH,CAAC,CAAC,SAAS;iBACrC,CAAC;;;kBAGA,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;0CAET,IAAI;sCACR,IAAI;2CACC,aAAa,CAAC,MAAM;sCACzB,CAAC,CAAC,OAAO;2CACJ,CAAC,CAAC,SAAS;iBACrC,CAAC;;;;uCAIqB,CAAC,CAAC,CAAC,cAAc,CAAC,SAAS,CAAC;;;KAG9D,CAAC;AACN,CAAC"}

package/Controls/Components/States/Busy/Themes/BusyStateElement.Cosmopolitan.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BusyStateElement.Cosmopolitan.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/States/Busy/Themes/BusyStateElement.Cosmopolitan.ts"],"names":[],"mappings":"AASA,OAAO,EAAO,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAI7D;;GAEG;AACH,wBAAgB,iCAAiC,IAAI,SAAS,CAuH7D"}
+{"version":3,"file":"BusyStateElement.Cosmopolitan.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/States/Busy/Themes/BusyStateElement.Cosmopolitan.ts"],"names":[],"mappings":"AASA,OAAO,EAAO,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAI7D;;GAEG;AACH,wBAAgB,iCAAiC,IAAI,SAAS,CA2I7D"}

package/Controls/Components/States/Busy/Themes/BusyStateElement.Cosmopolitan.js

@@ -93,7 +93,7 @@ export function busyStateElementCosmopolitanStyle() {
   --icon-foreground-color: var(--busy-state-foreground-color);
 }
 
-:host [part="header"] {
+:host slot[name="header"] {
   font-family: var(--busy-state-header-font-family);
   font-size: var(--busy-state-header-font-size);
   line-height: var(--busy-state-header-font-line-height);
@@ -104,7 +104,17 @@ export function busyStateElementCosmopolitanStyle() {
   text-transform: var(--busy-state-header-font-text-transform);
 }
 
-:host [part="content"] {
+:host slot[name="header"] mosaik-text {
+  font-family: inherit;
+  font-size: inherit;
+  line-height: inherit;
+  font-weight: inherit;
+  letter-spacing: inherit;
+  text-decoration: inherit;
+  text-transform: inherit;
+}
+
+:host slot[name="content"] {
   font-family: var(--busy-state-content-font-family);
   font-size: var(--busy-state-content-font-size);
   line-height: var(--busy-state-content-font-line-height);
@@ -115,6 +125,16 @@ export function busyStateElementCosmopolitanStyle() {
   text-transform: var(--busy-state-content-font-text-transform);
 }
 
+:host slot[name="content"] mosaik-text {
+  font-family: inherit;
+  font-size: inherit;
+  line-height: inherit;
+  font-weight: inherit;
+  letter-spacing: inherit;
+  text-decoration: inherit;
+  text-transform: inherit;
+}
+
 :host [part="root"] {
   flex-direction: column;
   align-items: center;

package/Controls/Components/States/Busy/Themes/BusyStateElement.Cosmopolitan.js.map

@@ -1 +1 @@
-{"version":3,"file":"BusyStateElement.Cosmopolitan.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/States/Busy/Themes/BusyStateElement.Cosmopolitan.ts"],"names":[],"mappings":"AAAA,iFAAiF;AACjF,mBAAmB;AACnB,yCAAyC;AACzC,qGAAqG;AACrG,oBAAoB;AACpB,iFAAiF;AAEjF,kBAAkB;AAElB,OAAO,EAAE,GAAG,EAAkB,MAAM,wBAAwB,CAAC;AAE7D,aAAa;AAEb;;GAEG;AACH,MAAM,UAAU,iCAAiC;IAC7C,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAqHT,CAAC;AACN,CAAC"}
+{"version":3,"file":"BusyStateElement.Cosmopolitan.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/States/Busy/Themes/BusyStateElement.Cosmopolitan.ts"],"names":[],"mappings":"AAAA,iFAAiF;AACjF,mBAAmB;AACnB,yCAAyC;AACzC,qGAAqG;AACrG,oBAAoB;AACpB,iFAAiF;AAEjF,kBAAkB;AAElB,OAAO,EAAE,GAAG,EAAkB,MAAM,wBAAwB,CAAC;AAE7D,aAAa;AAEb;;GAEG;AACH,MAAM,UAAU,iCAAiC;IAC7C,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAyIT,CAAC;AACN,CAAC"}

package/Controls/Components/States/Busy/Themes/BusyStateElement.Joy.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BusyStateElement.Joy.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/States/Busy/Themes/BusyStateElement.Joy.ts"],"names":[],"mappings":"AASA,OAAO,EAAO,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAI7D;;GAEG;AACH,wBAAgB,wBAAwB,IAAI,SAAS,CA2IpD"}
+{"version":3,"file":"BusyStateElement.Joy.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/States/Busy/Themes/BusyStateElement.Joy.ts"],"names":[],"mappings":"AASA,OAAO,EAAO,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAI7D;;GAEG;AACH,wBAAgB,wBAAwB,IAAI,SAAS,CA+JpD"}

package/Controls/Components/States/Busy/Themes/BusyStateElement.Joy.js

@@ -93,7 +93,7 @@ export function busyStateElementJoyStyle() {
   --icon-foreground-color: var(--busy-state-foreground-color);
 }
 
-:host [part="header"] {
+:host slot[name="header"] {
   font-family: var(--busy-state-header-font-family);
   font-size: var(--busy-state-header-font-size);
   line-height: var(--busy-state-header-font-line-height);
@@ -104,7 +104,17 @@ export function busyStateElementJoyStyle() {
   text-transform: var(--busy-state-header-font-text-transform);
 }
 
-:host [part="content"] {
+:host slot[name="header"] mosaik-text {
+  font-family: inherit;
+  font-size: inherit;
+  line-height: inherit;
+  font-weight: inherit;
+  letter-spacing: inherit;
+  text-decoration: inherit;
+  text-transform: inherit;
+}
+
+:host slot[name="content"] {
   font-family: var(--busy-state-content-font-family);
   font-size: var(--busy-state-content-font-size);
   line-height: var(--busy-state-content-font-line-height);
@@ -115,6 +125,16 @@ export function busyStateElementJoyStyle() {
   text-transform: var(--busy-state-content-font-text-transform);
 }
 
+:host slot[name="content"] mosaik-text {
+  font-family: inherit;
+  font-size: inherit;
+  line-height: inherit;
+  font-weight: inherit;
+  letter-spacing: inherit;
+  text-decoration: inherit;
+  text-transform: inherit;
+}
+
 :host [part="root"] {
   flex-direction: column;
   align-items: center;
@@ -128,7 +148,7 @@ export function busyStateElementJoyStyle() {
   display: flex;
 }
 
-:host [part="header"] {
+:host slot[name="header"] {
   --busy-state-header-font-family: var(--joy-typography-body1-font-family);
   --busy-state-header-font-size: var(--joy-typography-body1-font-size);
   --busy-state-header-font-line-height: var(--joy-typography-body1-line-height);
@@ -138,7 +158,7 @@ export function busyStateElementJoyStyle() {
   --busy-state-header-font-text-transform: var(--joy-typography-body1-text-transform);
 }
 
-:host [part="content"] {
+:host slot[name="content"] {
   --busy-state-content-font-family: var(--joy-typography-body2-font-family);
   --busy-state-content-font-size: var(--joy-typography-body2-font-size);
   --busy-state-content-font-line-height: var(--joy-typography-body2-line-height);

package/Controls/Components/States/Busy/Themes/BusyStateElement.Joy.js.map

@@ -1 +1 @@
-{"version":3,"file":"BusyStateElement.Joy.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/States/Busy/Themes/BusyStateElement.Joy.ts"],"names":[],"mappings":"AAAA,iFAAiF;AACjF,mBAAmB;AACnB,yCAAyC;AACzC,qGAAqG;AACrG,oBAAoB;AACpB,iFAAiF;AAEjF,kBAAkB;AAElB,OAAO,EAAE,GAAG,EAAkB,MAAM,wBAAwB,CAAC;AAE7D,aAAa;AAEb;;GAEG;AACH,MAAM,UAAU,wBAAwB;IACpC,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAyIT,CAAC;AACN,CAAC"}
+{"version":3,"file":"BusyStateElement.Joy.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/States/Busy/Themes/BusyStateElement.Joy.ts"],"names":[],"mappings":"AAAA,iFAAiF;AACjF,mBAAmB;AACnB,yCAAyC;AACzC,qGAAqG;AACrG,oBAAoB;AACpB,iFAAiF;AAEjF,kBAAkB;AAElB,OAAO,EAAE,GAAG,EAAkB,MAAM,wBAAwB,CAAC;AAE7D,aAAa;AAEb;;GAEG;AACH,MAAM,UAAU,wBAAwB;IACpC,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA6JT,CAAC;AACN,CAAC"}

package/Controls/Components/States/Busy/Themes/BusyStateElement.Memphis.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BusyStateElement.Memphis.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/States/Busy/Themes/BusyStateElement.Memphis.ts"],"names":[],"mappings":"AASA,OAAO,EAAO,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAI7D;;GAEG;AACH,wBAAgB,4BAA4B,IAAI,SAAS,CA2IxD"}
+{"version":3,"file":"BusyStateElement.Memphis.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/States/Busy/Themes/BusyStateElement.Memphis.ts"],"names":[],"mappings":"AASA,OAAO,EAAO,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAI7D;;GAEG;AACH,wBAAgB,4BAA4B,IAAI,SAAS,CA+JxD"}

package/Controls/Components/States/Busy/Themes/BusyStateElement.Memphis.js

@@ -93,7 +93,7 @@ export function busyStateElementMemphisStyle() {
   --icon-foreground-color: var(--busy-state-foreground-color);
 }
 
-:host [part="header"] {
+:host slot[name="header"] {
   font-family: var(--busy-state-header-font-family);
   font-size: var(--busy-state-header-font-size);
   line-height: var(--busy-state-header-font-line-height);
@@ -104,7 +104,17 @@ export function busyStateElementMemphisStyle() {
   text-transform: var(--busy-state-header-font-text-transform);
 }
 
-:host [part="content"] {
+:host slot[name="header"] mosaik-text {
+  font-family: inherit;
+  font-size: inherit;
+  line-height: inherit;
+  font-weight: inherit;
+  letter-spacing: inherit;
+  text-decoration: inherit;
+  text-transform: inherit;
+}
+
+:host slot[name="content"] {
   font-family: var(--busy-state-content-font-family);
   font-size: var(--busy-state-content-font-size);
   line-height: var(--busy-state-content-font-line-height);
@@ -115,6 +125,16 @@ export function busyStateElementMemphisStyle() {
   text-transform: var(--busy-state-content-font-text-transform);
 }
 
+:host slot[name="content"] mosaik-text {
+  font-family: inherit;
+  font-size: inherit;
+  line-height: inherit;
+  font-weight: inherit;
+  letter-spacing: inherit;
+  text-decoration: inherit;
+  text-transform: inherit;
+}
+
 :host [part="root"] {
   flex-direction: column;
   align-items: center;
@@ -128,7 +148,7 @@ export function busyStateElementMemphisStyle() {
   display: flex;
 }
 
-:host [part="header"] {
+:host slot[name="header"] {
   --busy-state-header-font-family: var(--memphis-typography-body1-font-family);
   --busy-state-header-font-size: var(--memphis-typography-body1-font-size);
   --busy-state-header-font-line-height: var(--memphis-typography-body1-line-height);
@@ -138,7 +158,7 @@ export function busyStateElementMemphisStyle() {
   --busy-state-header-font-text-transform: var(--memphis-typography-body1-text-transform);
 }
 
-:host [part="content"] {
+:host slot[name="content"] {
   --busy-state-content-font-family: var(--memphis-typography-body2-font-family);
   --busy-state-content-font-size: var(--memphis-typography-body2-font-size);
   --busy-state-content-font-line-height: var(--memphis-typography-body2-line-height);

package/Controls/Components/States/Busy/Themes/BusyStateElement.Memphis.js.map

@@ -1 +1 @@
-{"version":3,"file":"BusyStateElement.Memphis.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/States/Busy/Themes/BusyStateElement.Memphis.ts"],"names":[],"mappings":"AAAA,iFAAiF;AACjF,mBAAmB;AACnB,yCAAyC;AACzC,qGAAqG;AACrG,oBAAoB;AACpB,iFAAiF;AAEjF,kBAAkB;AAElB,OAAO,EAAE,GAAG,EAAkB,MAAM,wBAAwB,CAAC;AAE7D,aAAa;AAEb;;GAEG;AACH,MAAM,UAAU,4BAA4B;IACxC,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAyIT,CAAC;AACN,CAAC"}
+{"version":3,"file":"BusyStateElement.Memphis.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/States/Busy/Themes/BusyStateElement.Memphis.ts"],"names":[],"mappings":"AAAA,iFAAiF;AACjF,mBAAmB;AACnB,yCAAyC;AACzC,qGAAqG;AACrG,oBAAoB;AACpB,iFAAiF;AAEjF,kBAAkB;AAElB,OAAO,EAAE,GAAG,EAAkB,MAAM,wBAAwB,CAAC;AAE7D,aAAa;AAEb;;GAEG;AACH,MAAM,UAAU,4BAA4B;IACxC,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA6JT,CAAC;AACN,CAAC"}

package/Controls/Components/States/Empty/EmptyStateElement.d.ts

@@ -1,6 +1,8 @@
+import { ISlottable } from '../../../Behaviors/Slottable';
+import { Size } from '../../../Types/Size';
 import { StateBaseElement } from '../Abstracts/StateBaseElement';
 import { IEmptyStateElementProps } from './IEmptyStateElementProps';
-declare const EmptyStateElement_base: (abstract new (...args: Array<any>) => import("../../../Behaviors/Themeable").IThemeableProps) & typeof StateBaseElement & import("../../../Behaviors/Themeable").IThemeableCtor;
+declare const EmptyStateElement_base: (abstract new (...args: Array<any>) => import("../../../Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Slottable").ISlottableProps & ISlottable) & typeof StateBaseElement & import("../../../Behaviors/Themeable").IThemeableCtor;
 /**
  * EmptyState - A user-friendly placeholder component for displaying when no content or data is available.
  *
@@ -16,8 +18,10 @@ declare const EmptyStateElement_base: (abstract new (...args: Array<any>) => imp
  * @element mosaik-empty-state
  * @category States
  *
- * @slot - Default content area for additional empty state information or custom elements
+ * @slot  - The default slot.
  * @slot actions - Action buttons or links for user guidance and next steps
+ * @slot - Default content area for additional empty state information or custom elements
+ * @slot header - The header slot.
  *
  * @csspart actions - The container for action slot elements
  * @csspart content - The content text container for detailed explanation
@@ -96,9 +100,10 @@ declare const EmptyStateElement_base: (abstract new (...args: Array<any>) => imp
  *
  * @public
  */
-export declare class EmptyStateElement extends EmptyStateElement_base implements IEmptyStateElementProps {
+export declare class EmptyStateElement extends EmptyStateElement_base implements IEmptyStateElementProps, ISlottable {
     private _header;
     private _icon;
+    private _iconSize;
     /**
      * Constructs a new instance of the `EmptyStateElement` class.
      *
@@ -122,6 +127,15 @@ export declare class EmptyStateElement extends EmptyStateElement_base implements
      */
     get icon(): string;
     set icon(value: string);
+    /**
+     * Gets or sets the `iconSize` property.
+     * The default value is `null`, which means the icon size is not specified.
+     *
+     * @public
+     * @attr icon-size
+     */
+    get iconSize(): Size | null;
+    set iconSize(value: Size | null);
     /**
      * Gets or sets the `header` property.
      * The primary message displayed to users in the empty state.

package/Controls/Components/States/Empty/EmptyStateElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EmptyStateElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Empty/EmptyStateElement.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAEjE,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;;AAOpE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8FG;AACH,qBAaa,iBACT,SAAQ,sBACR,YAAW,uBAAuB;IAIlC,OAAO,CAAC,OAAO,CAAS;IACxB,OAAO,CAAC,KAAK,CAAS;IAMtB;;;;OAIG;;IAYH;;;;;;MAME;IACF,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;;;OAMG;IACH,IACW,IAAI,IAAI,MAAM,CAExB;IAED,IAAW,IAAI,CAAC,KAAK,EAAE,MAAM,EAI5B;IAED;;;;;;;OAOG;IACH,IACW,MAAM,IAAI,MAAM,CAE1B;IAED,IAAW,MAAM,CAAC,KAAK,EAAE,MAAM,EAI9B;CAIJ;AAED;;GAEG;AACH,yBAAiB,iBAAiB,CAAC;IAC/B,KAAY,KAAK,GAAG,uBAAuB,CAAC;CAC/C;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEX,UAAU,qBAAqB;QAE3B,oBAAoB,EAAE,iBAAiB,CAAC;KAC3C;CACJ"}
+{"version":3,"file":"EmptyStateElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Empty/EmptyStateElement.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAa,MAAM,8BAA8B,CAAC;AAKrE,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAG3C,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAEjE,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;;AAOpE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgGG;AACH,qBAaa,iBACT,SAAQ,sBACR,YAAW,uBAAuB,EAAE,UAAU;IAI9C,OAAO,CAAC,OAAO,CAAS;IACxB,OAAO,CAAC,KAAK,CAAS;IACtB,OAAO,CAAC,SAAS,CAAc;IAM/B;;;;OAIG;;IAaH;;;;;;MAME;IACF,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;;;OAMG;IACH,IACW,IAAI,IAAI,MAAM,CAExB;IAED,IAAW,IAAI,CAAC,KAAK,EAAE,MAAM,EAI5B;IAED;;;;;;OAMG;IACH,IACW,QAAQ,IAAI,IAAI,GAAG,IAAI,CAEjC;IAED,IAAW,QAAQ,CAAC,KAAK,EAAE,IAAI,GAAG,IAAI,EAKrC;IAED;;;;;;;OAOG;IACH,IACW,MAAM,IAAI,MAAM,CAE1B;IAED,IAAW,MAAM,CAAC,KAAK,EAAE,MAAM,EAI9B;CAIJ;AAED;;GAEG;AACH,yBAAiB,iBAAiB,CAAC;IAC/B,KAAY,KAAK,GAAG,uBAAuB,CAAC;CAC/C;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEX,UAAU,qBAAqB;QAE3B,oBAAoB,EAAE,iBAAiB,CAAC;KAC3C;CACJ"}

package/Controls/Components/States/Empty/EmptyStateElement.js

@@ -8,10 +8,12 @@ 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 { Slottable } from '../../../Behaviors/Slottable';
 import { Themeable } from '../../../Behaviors/Themeable';
 import { Attribute } from '../../../Decorators/AttributeDecorator';
 import { Component } from '../../../Decorators/ComponentDecorator';
 import { Property } from '../../../Decorators/PropertyDecorator';
+import { Size } from '../../../Types/Size';
 import { IconElement } from '../../Media/Icon/IconElement';
 import { TextElement } from '../../Primitives/Text/TextElement';
 import { StateBaseElement } from '../Abstracts/StateBaseElement';
@@ -35,8 +37,10 @@ import { emptyStateElementMemphisStyle } from './Themes/EmptyStateElement.Memphi
  * @element mosaik-empty-state
  * @category States
  *
- * @slot - Default content area for additional empty state information or custom elements
+ * @slot  - The default slot.
  * @slot actions - Action buttons or links for user guidance and next steps
+ * @slot - Default content area for additional empty state information or custom elements
+ * @slot header - The header slot.
  *
  * @csspart actions - The container for action slot elements
  * @csspart content - The content text container for detailed explanation
@@ -115,10 +119,11 @@ import { emptyStateElementMemphisStyle } from './Themes/EmptyStateElement.Memphi
  *
  * @public
  */
-let EmptyStateElement = class EmptyStateElement extends Themeable(StateBaseElement) {
+let EmptyStateElement = class EmptyStateElement extends Themeable(Slottable(StateBaseElement)) {
     // #region Fields
     _header;
     _icon;
+    _iconSize;
     // #endregion
     // #region Ctor
     /**
@@ -130,6 +135,7 @@ let EmptyStateElement = class EmptyStateElement extends Themeable(StateBaseEleme
         super();
         this._icon = '';
         this._header = '';
+        this._iconSize = null;
     }
     // #endregion
     // #region Properties
@@ -158,6 +164,22 @@ let EmptyStateElement = class EmptyStateElement extends Themeable(StateBaseEleme
             this._icon = value;
         }
     }
+    /**
+     * Gets or sets the `iconSize` property.
+     * The default value is `null`, which means the icon size is not specified.
+     *
+     * @public
+     * @attr icon-size
+     */
+    get iconSize() {
+        return this._iconSize;
+    }
+    set iconSize(value) {
+        if (this._iconSize !== value) {
+            this._iconSize = value;
+            this.requestUpdate('iconSize');
+        }
+    }
     /**
      * Gets or sets the `header` property.
      * The primary message displayed to users in the empty state.
@@ -180,6 +202,11 @@ __decorate([
     __metadata("design:type", String),
     __metadata("design:paramtypes", [String])
 ], EmptyStateElement.prototype, "icon", null);
+__decorate([
+    Attribute({ type: Size }),
+    __metadata("design:type", Object),
+    __metadata("design:paramtypes", [Object])
+], EmptyStateElement.prototype, "iconSize", null);
 __decorate([
     Attribute({ type: String }),
     __metadata("design:type", String),

package/Controls/Components/States/Empty/EmptyStateElement.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmptyStateElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Empty/EmptyStateElement.ts"],"names":[],"mappings":"AAAA,kBAAkB;;;;;;;;;;AAElB,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,QAAQ,EAAE,MAAM,uCAAuC,CAAC;AACjE,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAC3D,OAAO,EAAE,WAAW,EAAE,MAAM,mCAAmC,CAAC;AAChE,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AACjE,OAAO,EAAE,yBAAyB,EAAE,MAAM,6BAA6B,CAAC;AAExE,OAAO,EAAE,kCAAkC,EAAE,MAAM,yCAAyC,CAAC;AAC7F,OAAO,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAC;AAC3E,OAAO,EAAE,6BAA6B,EAAE,MAAM,oCAAoC,CAAC;AAEnF,aAAa;AAEb;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8FG;AAcI,IAAM,iBAAiB,GAAvB,MAAM,iBACT,SAAQ,SAAS,CAAC,gBAAgB,CAAC;IAGnC,iBAAiB;IAET,OAAO,CAAS;IAChB,KAAK,CAAS;IAEtB,aAAa;IAEb,eAAe;IAEf;;;;OAIG;IACH;QACI,KAAK,EAAE,CAAC;QAER,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;QAChB,IAAI,CAAC,OAAO,GAAG,EAAE,CAAC;IACtB,CAAC;IAED,aAAa;IAEb,qBAAqB;IAErB;;;;;;MAME;IACK,MAAM,KAAK,EAAE;QAChB,OAAO,oBAAoB,CAAC;IAChC,CAAC;IAED;;;;;;OAMG;IACH,IACW,IAAI;QACX,OAAO,IAAI,CAAC,KAAK,CAAC;IACtB,CAAC;IAED,IAAW,IAAI,CAAC,KAAa;QACzB,IAAI,IAAI,CAAC,KAAK,KAAK,KAAK,EAAE,CAAC;YACvB,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;QACvB,CAAC;IACL,CAAC;IAED;;;;;;;OAOG;IACH,IACW,MAAM;QACb,OAAO,IAAI,CAAC,OAAO,CAAC;IACxB,CAAC;IAED,IAAW,MAAM,CAAC,KAAa;QAC3B,IAAI,IAAI,CAAC,OAAO,KAAK,KAAK,EAAE,CAAC;YACzB,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QACzB,CAAC;IACL,CAAC;CAIJ,CAAA;AAhCG;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;;6CAG1B;AAgBD;IAAC,SAAS,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;;+CAG3B;AArEQ,iBAAiB;IAb7B,SAAS,CAAC;QACP,QAAQ,EAAE,oBAAoB;QAC9B,QAAQ,EAAE,yBAAyB;QACnC,MAAM,EAAE;YACJ,GAAG,EAAE,yBAAyB;YAC9B,OAAO,EAAE,6BAA6B;YACtC,YAAY,EAAE,kCAAkC;SACnD;QACD,OAAO,EAAE;YACL,WAAW;YACX,WAAW;SACd;KACJ,CAAC;;GACW,iBAAiB,CA+E7B"}
+{"version":3,"file":"EmptyStateElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Empty/EmptyStateElement.ts"],"names":[],"mappings":"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"}

package/Controls/Components/States/Empty/EmptyStateElementTemplate.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EmptyStateElementTemplate.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Empty/EmptyStateElementTemplate.ts"],"names":[],"mappings":"AAEA,OAAO,EAAQ,KAAK,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAKjE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAI7D;;;;GAIG;AACH,wBAAgB,yBAAyB,CAAC,CAAC,SAAS,iBAAiB,EAAE,CAAC,EAAE,CAAC,GAAG,cAAc,CA6B3F"}
+{"version":3,"file":"EmptyStateElementTemplate.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Empty/EmptyStateElementTemplate.ts"],"names":[],"mappings":"AAEA,OAAO,EAAQ,KAAK,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAKjE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAI7D;;;;GAIG;AACH,wBAAgB,yBAAyB,CAAC,CAAC,SAAS,iBAAiB,EAAE,CAAC,EAAE,CAAC,GAAG,cAAc,CAiC3F"}

package/Controls/Components/States/Empty/EmptyStateElementTemplate.js

@@ -13,26 +13,30 @@ import { TextAlignment } from '../../../Types/TextAlignment';
 export function emptyStateElementTemplate(e) {
     return html `
         <mosaik-icon part="icon"
-                     .size="${Size.Giant}"
+                     .size="${e.iconSize ?? Size.Giant}"
                      .data="${e.icon.trim() ? e.icon : Icons.glasses}"
                      .variant="${'neutral'}"></mosaik-icon>
         <div part="root">
-            ${when(e.header, () => html `
-            <mosaik-text part="header"
-                         .readonly="${true}"
-                         .wrap="${true}"
-                         .alignment="${TextAlignment.Center}"
-                         .text="${e.header}"
-                         .formatter="${e.formatter}"></mosaik-text>
-            `)}
-            ${when(e.content, () => html `
-            <mosaik-text part="content"
-                         .readonly="${true}"
-                         .wrap="${true}"
-                         .alignment="${TextAlignment.Center}"
-                         .text="${e.content}"
-                         .formatter="${e.formatter}"></mosaik-text>
-            `)}
+            <slot name="header">
+                ${when(e.header.trim(), () => html `
+                <mosaik-text part="header"
+                            .readonly="${true}"
+                            .wrap="${true}"
+                            .alignment="${TextAlignment.Center}"
+                            .text="${e.header}"
+                            .formatter="${e.formatter}"></mosaik-text>
+                `)}
+            </slot>
+            <slot name="content">
+                ${when(e.content.trim(), () => html `
+                <mosaik-text part="content"
+                            .readonly="${true}"
+                            .wrap="${true}"
+                            .alignment="${TextAlignment.Center}"
+                            .text="${e.content}"
+                            .formatter="${e.formatter}"></mosaik-text>
+                `)}
+            </slot>
             <slot></slot>
         </div>
         <div part="actions" ?hidden="${!e.hasSlotContent('actions')}">

package/Controls/Components/States/Empty/EmptyStateElementTemplate.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmptyStateElementTemplate.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Empty/EmptyStateElementTemplate.ts"],"names":[],"mappings":"AAAA,kBAAkB;AAElB,OAAO,EAAE,IAAI,EAAuB,MAAM,sBAAsB,CAAC;AACjE,OAAO,EAAE,KAAK,EAAE,MAAM,6BAA6B,CAAC;AACpD,OAAO,EAAE,IAAI,EAAE,MAAM,gCAAgC,CAAC;AACtD,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAG7D,aAAa;AAEb;;;;GAIG;AACH,MAAM,UAAU,yBAAyB,CAA8B,CAAI;IACvE,OAAO,IAAI,CAAA;;8BAEe,IAAI,CAAC,KAAK;8BACV,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO;iCACnC,SAAS;;cAE5B,IAAI,CAAC,CAAC,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;sCAED,IAAI;kCACR,IAAI;uCACC,aAAa,CAAC,MAAM;kCACzB,CAAC,CAAC,MAAM;uCACH,CAAC,CAAC,SAAS;aACrC,CAAC;cACA,IAAI,CAAC,CAAC,CAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;sCAEF,IAAI;kCACR,IAAI;uCACC,aAAa,CAAC,MAAM;kCACzB,CAAC,CAAC,OAAO;uCACJ,CAAC,CAAC,SAAS;aACrC,CAAC;;;uCAGyB,CAAC,CAAC,CAAC,cAAc,CAAC,SAAS,CAAC;;;KAG9D,CAAC;AACN,CAAC"}
+{"version":3,"file":"EmptyStateElementTemplate.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Empty/EmptyStateElementTemplate.ts"],"names":[],"mappings":"AAAA,kBAAkB;AAElB,OAAO,EAAE,IAAI,EAAuB,MAAM,sBAAsB,CAAC;AACjE,OAAO,EAAE,KAAK,EAAE,MAAM,6BAA6B,CAAC;AACpD,OAAO,EAAE,IAAI,EAAE,MAAM,gCAAgC,CAAC;AACtD,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAG7D,aAAa;AAEb;;;;GAIG;AACH,MAAM,UAAU,yBAAyB,CAA8B,CAAI;IACvE,OAAO,IAAI,CAAA;;8BAEe,CAAC,CAAC,QAAQ,IAAI,IAAI,CAAC,KAAK;8BACxB,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO;iCACnC,SAAS;;;kBAGxB,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,EAAE,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;yCAET,IAAI;qCACR,IAAI;0CACC,aAAa,CAAC,MAAM;qCACzB,CAAC,CAAC,MAAM;0CACH,CAAC,CAAC,SAAS;iBACpC,CAAC;;;kBAGA,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;yCAEV,IAAI;qCACR,IAAI;0CACC,aAAa,CAAC,MAAM;qCACzB,CAAC,CAAC,OAAO;0CACJ,CAAC,CAAC,SAAS;iBACpC,CAAC;;;;uCAIqB,CAAC,CAAC,CAAC,cAAc,CAAC,SAAS,CAAC;;;KAG9D,CAAC;AACN,CAAC"}