@breadstone/mosaik-elements-foundation 0.0.30 → 0.0.32

package/Controls/Components/Selectors/Tree/TreeItemElementTemplate.js

@@ -2,7 +2,7 @@
 import { html } from '../../../../Dom/Html';
 import { Icons } from '../../../../Resources/Icons';
 import { choose, when } from '../../../Directives/Directives';
-import { query } from '../../../Directives/Query';
+import { queryShadow } from '../../../Directives/QueryShadow';
 import { Appearance } from '../../../Types/Appearance';
 import { CheckType } from '../../../Types/CheckType';
 import { SelectionMode } from '../../../Types/SelectionMode';
@@ -22,8 +22,10 @@ export function treeItemElementTemplate(e) {
                                .appearance="${Appearance.Plain}"
                                .icon="${Icons.caretDown}"
                                .size="${Size.Small}"
+                               .dir="${e.dir}"
+                               .lang="${e.lang}"
                                ?disabled="${e.disabled}"
-                               @click="${() => query(e, '[part="expandable"]', { shadow: true, strict: true }).toggle()}"></mosaik-button>
+                               @click="${(x) => { queryShadow(e, '[part="expandable"]', true).toggle(); x.stopPropagation(); }}"></mosaik-button>
             </div>
             `)}
             ${when(e.isBusy, () => html `
@@ -31,12 +33,16 @@ export function treeItemElementTemplate(e) {
                 <mosaik-progress-ring part="progressRing"
                                       .thickness="${2}"
                                       .radius="${12}"
-                                      .isIndeterminate="${true}"></mosaik-progress-ring>
+                                      .isIndeterminate="${true}"
+                                      .dir="${e.dir}"
+                                      .lang="${e.lang}"></mosaik-progress-ring>
             </div>
             `)}
             <slot name="text">
                 <mosaik-text part="text"
-                             .text="${e.text}"></mosaik-text>
+                             .text="${e.text}"
+                             .dir="${e.dir}"
+                             .lang="${e.lang}"></mosaik-text>
             </slot>
             ${choose(e.parent.selectionMode, [[SelectionMode.None, () => html `
             `], [SelectionMode.Single, () => html `
@@ -45,11 +51,17 @@ export function treeItemElementTemplate(e) {
                               .appearance="${Appearance.Outline}"
                               .variant="${e.variant}"
                               .type="${CheckType.Hook}"
+                              .dir="${e.dir}"
+                              .lang="${e.lang}"
                               ?checked="${e.isChecked}"
                               ?disabled="${e.disabled}"></mosaik-checkmark>
             `]])}
         </div>
         <mosaik-expandable part="expandable"
+                           exportparts="content:content"
+                           .dir="${e.dir}"
+                           .lang="${e.lang}"
+                           .isExpanded="${e.isExpanded}"
                            ?hidden="${!e.hasSlotContent('')}"
                            @toggled="${() => e.onExpandableToggle()}">
             <slot></slot>

package/Controls/Components/Selectors/Tree/TreeItemElementTemplate.js.map

@@ -1 +1 @@
-{"version":3,"file":"TreeItemElementTemplate.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Selectors/Tree/TreeItemElementTemplate.ts"],"names":[],"mappings":"AAAA,kBAAkB;AAElB,OAAO,EAAE,IAAI,EAAuB,MAAM,sBAAsB,CAAC;AACjE,OAAO,EAAE,KAAK,EAAE,MAAM,6BAA6B,CAAC;AACpD,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,gCAAgC,CAAC;AAC9D,OAAO,EAAE,KAAK,EAAE,MAAM,2BAA2B,CAAC;AAClD,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AACvD,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAI3C,aAAa;AAEb;;;;GAIG;AACH,MAAM,UAAU,uBAAuB,CAA4B,CAAI;IACnE,OAAO,IAAI,CAAA;;cAED,IAAI,CAAC,CAAC,CAAC,WAAW,IAAI,CAAC,CAAC,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;;8CAGX,UAAU,CAAC,KAAK;wCACtB,KAAK,CAAC,SAAS;wCACf,IAAI,CAAC,KAAK;4CACN,CAAC,CAAC,QAAQ;yCACb,GAAG,EAAE,CAAC,KAAK,CAAoB,CAAC,EAAE,qBAAqB,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC,MAAM,EAAE;;aAE7H,CAAC;cACA,IAAI,CAAC,CAAC,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;;oDAGa,CAAC;iDACJ,EAAE;0DACO,IAAI;;aAEjD,CAAC;;;sCAGwB,CAAC,CAAC,IAAI;;cAE9B,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,aAAa,EAAE,CAAC,CAAC,aAAa,CAAC,IAAI,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;aAChE,CAAC,EAAE,CAAC,aAAa,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;aACpC,CAAC,EAAE,CAAC,aAAa,CAAC,QAAQ,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;6CAEN,UAAU,CAAC,OAAO;0CACrB,CAAC,CAAC,OAAO;uCACZ,SAAS,CAAC,IAAI;0CACX,CAAC,CAAC,SAAS;2CACV,CAAC,CAAC,QAAQ;aACxC,CAAC,CAAC,CAAC;;;sCAGsB,CAAC,CAAC,CAAC,cAAc,CAAC,EAAE,CAAC;uCACpB,GAAG,EAAE,CAAC,CAAC,CAAC,kBAAkB,EAAE;;;KAG9D,CAAC;AACN,CAAC"}
+{"version":3,"file":"TreeItemElementTemplate.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Selectors/Tree/TreeItemElementTemplate.ts"],"names":[],"mappings":"AAAA,kBAAkB;AAElB,OAAO,EAAE,IAAI,EAAuB,MAAM,sBAAsB,CAAC;AACjE,OAAO,EAAE,KAAK,EAAE,MAAM,6BAA6B,CAAC;AACpD,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,gCAAgC,CAAC;AAC9D,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAC9D,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AACvD,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAI3C,aAAa;AAEb;;;;GAIG;AACH,MAAM,UAAU,uBAAuB,CAA4B,CAAI;IACnE,OAAO,IAAI,CAAA;;cAED,IAAI,CAAC,CAAC,CAAC,WAAW,IAAI,CAAC,CAAC,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;;8CAGX,UAAU,CAAC,KAAK;wCACtB,KAAK,CAAC,SAAS;wCACf,IAAI,CAAC,KAAK;uCACX,CAAC,CAAC,GAAG;wCACJ,CAAC,CAAC,IAAI;4CACF,CAAC,CAAC,QAAQ;yCACb,CAAC,CAAQ,EAAE,EAAE,GAAG,WAAW,CAAoB,CAAC,EAAE,qBAAqB,EAAE,IAAI,CAAC,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,CAAC,eAAe,EAAE,CAAC,CAAC,CAAC;;aAE3I,CAAC;cACA,IAAI,CAAC,CAAC,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;;oDAGa,CAAC;iDACJ,EAAE;0DACO,IAAI;8CAChB,CAAC,CAAC,GAAG;+CACJ,CAAC,CAAC,IAAI;;aAExC,CAAC;;;sCAGwB,CAAC,CAAC,IAAI;qCACP,CAAC,CAAC,GAAG;sCACJ,CAAC,CAAC,IAAI;;cAE9B,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,aAAa,EAAE,CAAC,CAAC,aAAa,CAAC,IAAI,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;aAChE,CAAC,EAAE,CAAC,aAAa,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;aACpC,CAAC,EAAE,CAAC,aAAa,CAAC,QAAQ,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;6CAEN,UAAU,CAAC,OAAO;0CACrB,CAAC,CAAC,OAAO;uCACZ,SAAS,CAAC,IAAI;sCACf,CAAC,CAAC,GAAG;uCACJ,CAAC,CAAC,IAAI;0CACH,CAAC,CAAC,SAAS;2CACV,CAAC,CAAC,QAAQ;aACxC,CAAC,CAAC,CAAC;;;;mCAImB,CAAC,CAAC,GAAG;oCACJ,CAAC,CAAC,IAAI;0CACA,CAAC,CAAC,UAAU;sCAChB,CAAC,CAAC,CAAC,cAAc,CAAC,EAAE,CAAC;uCACpB,GAAG,EAAE,CAAC,CAAC,CAAC,kBAAkB,EAAE;;;KAG9D,CAAC;AACN,CAAC"}

package/Controls/Components/Selectors/Wizard/WizardController.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WizardController.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Selectors/Wizard/WizardController.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,iBAAiB,EAAE,KAAK,wBAAwB,EAAE,KAAK,cAAc,EAAE,MAAM,kDAAkD,CAAC;AACzI,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAIrD;;;;GAIG;AACH,UAAU,oBAAqB,SAAQ,cAAc,EAAE,IAAI,CAAC,aAAa,EAAE,QAAQ,GAAG,gBAAgB,GAAG,YAAY,CAAC;CACrH;AAED;;;;GAIG;AACH,qBAAa,gBACT,SAAQ,iBAAiB,CAAC,aAAa,EAAE,oBAAoB,CAAC;IAI9D;;;;OAIG;gBACgB,IAAI,EAAE,aAAa,EAAE,MAAM,EAAE,wBAAwB,CAAC,aAAa,CAAC;IAQvF;;;;;;;OAOG;cACgB,GAAG,CAAC,OAAO,EAAE,aAAa,GAAG,oBAAoB;CAWvE"}
+{"version":3,"file":"WizardController.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Selectors/Wizard/WizardController.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,iBAAiB,EAAE,KAAK,wBAAwB,EAAE,KAAK,cAAc,EAAE,MAAM,kDAAkD,CAAC;AACzI,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAIrD;;;;GAIG;AACH,UAAU,oBACN,SAAQ,cAAc,EAAE,IAAI,CAAC,aAAa,EAAE,QAAQ,GAAG,gBAAgB,GAAG,YAAY,CAAC;CAC1F;AAED;;;;GAIG;AACH,qBAAa,gBACT,SAAQ,iBAAiB,CAAC,aAAa,EAAE,oBAAoB,CAAC;IAI9D;;;;OAIG;gBACgB,IAAI,EAAE,aAAa,EAAE,MAAM,EAAE,wBAAwB,CAAC,aAAa,CAAC;IAQvF;;;;;;;OAOG;cACgB,GAAG,CAAC,OAAO,EAAE,aAAa,GAAG,oBAAoB;CAWvE"}

package/Controls/Components/Selectors/Wizard/WizardController.js.map

@@ -1 +1 @@
-{"version":3,"file":"WizardController.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Selectors/Wizard/WizardController.ts"],"names":[],"mappings":"AAAA,kBAAkB;AAElB,OAAO,EAAE,iBAAiB,EAAsD,MAAM,kDAAkD,CAAC;AAazI;;;;GAIG;AACH,MAAM,OAAO,gBACT,SAAQ,iBAAsD;IAE9D,eAAe;IAEf;;;;OAIG;IACH,YAAmB,IAAmB,EAAE,MAA+C;QACnF,KAAK,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC;IACxB,CAAC;IAED,aAAa;IAEb,kBAAkB;IAElB;;;;;;;OAOG;IACgB,GAAG,CAAC,OAAsB;QACzC,OAAO;YACH,IAAI,EAAE,OAAO,CAAC,IAAI;YAClB,MAAM,EAAE,CAAC,KAAa,EAAE,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC;YAChD,cAAc,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,cAAc,EAAE;YAC9C,UAAU,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,UAAU,EAAE;SACzC,CAAC;IACN,CAAC;CAIJ"}
+{"version":3,"file":"WizardController.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Selectors/Wizard/WizardController.ts"],"names":[],"mappings":"AAAA,kBAAkB;AAElB,OAAO,EAAE,iBAAiB,EAAsD,MAAM,kDAAkD,CAAC;AAczI;;;;GAIG;AACH,MAAM,OAAO,gBACT,SAAQ,iBAAsD;IAE9D,eAAe;IAEf;;;;OAIG;IACH,YAAmB,IAAmB,EAAE,MAA+C;QACnF,KAAK,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC;IACxB,CAAC;IAED,aAAa;IAEb,kBAAkB;IAElB;;;;;;;OAOG;IACgB,GAAG,CAAC,OAAsB;QACzC,OAAO;YACH,IAAI,EAAE,OAAO,CAAC,IAAI;YAClB,MAAM,EAAE,CAAC,KAAa,EAAE,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC;YAChD,cAAc,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,cAAc,EAAE;YAC9C,UAAU,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,UAAU,EAAE;SACzC,CAAC;IACN,CAAC;CAIJ"}

package/Controls/Components/States/Abstracts/StateElement.d.ts

@@ -1,6 +1,7 @@
+import { ISlottable, ISlottableProps } from '../../../Behaviors/Slottable';
 import { ITextFormattableProps } from '../../../Behaviors/TextFormattable';
 import { CustomElement } from '../../Abstracts/CustomElement';
-declare const StateElement_base: import("../../../../Index").ControlBehaviorReturn<typeof CustomElement, ITextFormattableProps>;
+declare const StateElement_base: import("../../../../Index").ControlBehaviorReturn<import("../../../../Index").ControlBehaviorReturn<typeof CustomElement, ISlottableProps & ISlottable>, ITextFormattableProps>;
 /**
  * A `StateElement` is an abstract component for representing states.
  * For example, empty or error
@@ -8,7 +9,7 @@ declare const StateElement_base: import("../../../../Index").ControlBehaviorRetu
  * @public
  * @abstract
  */
-export declare class StateElement extends StateElement_base implements ITextFormattableProps {
+export declare class StateElement extends StateElement_base implements ITextFormattableProps, ISlottableProps, ISlottable {
     private _content;
     /**
      * Constructs a new instance of the `StateElement` class.

package/Controls/Components/States/Abstracts/StateElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StateElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Abstracts/StateElement.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,qBAAqB,EAAmB,MAAM,oCAAoC,CAAC;AAE5F,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;;AAI9D;;;;;;GAMG;AACH,qBAAa,YACT,SAAQ,iBACR,YAAW,qBAAqB;IAIhC,OAAO,CAAC,QAAQ,CAAS;IAMzB;;;;OAIG;;IAWH;;;;OAIG;IACH,IACW,OAAO,IAAI,MAAM,CAE3B;IACD,IAAW,OAAO,CAAC,KAAK,EAAE,MAAM,EAI/B;CAIJ"}
+{"version":3,"file":"StateElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Abstracts/StateElement.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,eAAe,EAAa,MAAM,8BAA8B,CAAC;AACtF,OAAO,EAAE,qBAAqB,EAAmB,MAAM,oCAAoC,CAAC;AAE5F,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;;AAI9D;;;;;;GAMG;AACH,qBAAa,YACT,SAAQ,iBACR,YAAW,qBAAqB,EAAE,eAAe,EAAE,UAAU;IAI7D,OAAO,CAAC,QAAQ,CAAS;IAMzB;;;;OAIG;;IAWH;;;;OAIG;IACH,IACW,OAAO,IAAI,MAAM,CAE3B;IACD,IAAW,OAAO,CAAC,KAAK,EAAE,MAAM,EAI/B;CAIJ"}

package/Controls/Components/States/Abstracts/StateElement.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 { TextFormattable } from '../../../Behaviors/TextFormattable';
 import { Property } from '../../../Decorators/PropertyDecorator';
 import { CustomElement } from '../../Abstracts/CustomElement';
@@ -19,7 +20,7 @@ import { CustomElement } from '../../Abstracts/CustomElement';
  * @public
  * @abstract
  */
-export class StateElement extends TextFormattable(CustomElement) {
+export class StateElement extends TextFormattable(Slottable(CustomElement)) {
     // #region Fields
     _content;
     // #endregion
@@ -44,7 +45,7 @@ export class StateElement extends TextFormattable(CustomElement) {
         return this._content;
     }
     set content(value) {
-        if (value !== undefined && value !== null) {
+        if (this._content !== value) {
             this._content = value;
         }
     }

package/Controls/Components/States/Abstracts/StateElement.js.map

@@ -1 +1 @@
-{"version":3,"file":"StateElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Abstracts/StateElement.ts"],"names":[],"mappings":"AAAA,kBAAkB;;;;;;;;;;AAElB,OAAO,EAAyB,eAAe,EAAE,MAAM,oCAAoC,CAAC;AAC5F,OAAO,EAAE,QAAQ,EAAE,MAAM,uCAAuC,CAAC;AACjE,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAE9D,aAAa;AAEb;;;;;;GAMG;AACH,MAAM,OAAO,YACT,SAAQ,eAAe,CAAC,aAAa,CAAC;IAGtC,iBAAiB;IAET,QAAQ,CAAS;IAEzB,aAAa;IAEb,eAAe;IAEf;;;;OAIG;IACH;QACI,KAAK,EAAE,CAAC;QAER,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC;IACvB,CAAC;IAED,aAAa;IAEb,qBAAqB;IAErB;;;;OAIG;IACH,IACW,OAAO;QACd,OAAO,IAAI,CAAC,QAAQ,CAAC;IACzB,CAAC;IACD,IAAW,OAAO,CAAC,KAAa;QAC5B,IAAI,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,IAAI,EAAE,CAAC;YACxC,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;QAC1B,CAAC;IACL,CAAC;CAIJ;AAZG;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;;2CAG1B"}
+{"version":3,"file":"StateElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Abstracts/StateElement.ts"],"names":[],"mappings":"AAAA,kBAAkB;;;;;;;;;;AAElB,OAAO,EAA+B,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACtF,OAAO,EAAyB,eAAe,EAAE,MAAM,oCAAoC,CAAC;AAC5F,OAAO,EAAE,QAAQ,EAAE,MAAM,uCAAuC,CAAC;AACjE,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAE9D,aAAa;AAEb;;;;;;GAMG;AACH,MAAM,OAAO,YACT,SAAQ,eAAe,CAAC,SAAS,CAAC,aAAa,CAAC,CAAC;IAGjD,iBAAiB;IAET,QAAQ,CAAS;IAEzB,aAAa;IAEb,eAAe;IAEf;;;;OAIG;IACH;QACI,KAAK,EAAE,CAAC;QAER,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC;IACvB,CAAC;IAED,aAAa;IAEb,qBAAqB;IAErB;;;;OAIG;IACH,IACW,OAAO;QACd,OAAO,IAAI,CAAC,QAAQ,CAAC;IACzB,CAAC;IACD,IAAW,OAAO,CAAC,KAAa;QAC5B,IAAI,IAAI,CAAC,QAAQ,KAAK,KAAK,EAAE,CAAC;YAC1B,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;QAC1B,CAAC;IACL,CAAC;CAIJ;AAZG;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;;2CAG1B"}

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

@@ -1,13 +1,5 @@
 import { StateElement } from '../Abstracts/StateElement';
-/**
- * Represents the `{@link IEmptyStateElementProps}` interface.
- *
- * @public
- */
-export interface IEmptyStateElementProps {
-    icon: string;
-    header: string;
-}
+import { IEmptyStateElementProps } from './IEmptyStateElementProps';
 declare const EmptyStateElement_base: (abstract new (...args: Array<any>) => import("../../../Behaviors/Themeable").IThemeableProps) & typeof StateElement & import("../../../Behaviors/Themeable").IThemeableCtor;
 /**
  * Empty State - A UI component used to display a message or indication when there is no content or data.

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":"AASA,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AASzD;;;;GAIG;AACH,MAAM,WAAW,uBAAuB;IAEpC,IAAI,EAAE,MAAM,CAAC;IAEb,MAAM,EAAE,MAAM,CAAC;CAElB;;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AACH,qBAca,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;;;;OAIG;IACH,IACW,IAAI,IAAI,MAAM,CAExB;IAED,IAAW,IAAI,CAAC,KAAK,EAAE,MAAM,EAI5B;IAED;;;;;OAKG;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":"AAQA,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAMzD,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;;AAIpE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AACH,qBAca,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;;;;OAIG;IACH,IACW,IAAI,IAAI,MAAM,CAExB;IAED,IAAW,IAAI,CAAC,KAAK,EAAE,MAAM,EAI5B;IAED;;;;;OAKG;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,7 +8,6 @@ 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 { Icons } from '../../../../Resources/Icons';
 import { Attribute } from '../../../Decorators/AttributeDecorator';
 import { Component } from '../../../Decorators/ComponentDecorator';
 import { Property } from '../../../Decorators/PropertyDecorator';
@@ -21,6 +20,7 @@ import { emptyStateElementJoyStyle } from './Themes/EmptyStateElement.Joy';
 import { emptyStateElementRetroStyle } from './Themes/EmptyStateElement.Retro';
 import { emptyStateElementCosmopolitanStyle } from './Themes/EmptyStateElement.Cosmopolitan';
 import { Themeable } from '../../../Behaviors/Themeable';
+// #endregion
 /**
  * Empty State - A UI component used to display a message or indication when there is no content or data.
  *
@@ -79,7 +79,7 @@ let EmptyStateElement = class EmptyStateElement extends Themeable(StateElement)
      */
     constructor() {
         super();
-        this._icon = Icons.glasses;
+        this._icon = '';
         this._header = '';
     }
     // #endregion

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,KAAK,EAAE,MAAM,6BAA6B,CAAC;AACpD,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,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAChE,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAC3D,OAAO,EAAE,WAAW,EAAE,MAAM,mCAAmC,CAAC;AAChE,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,yBAAyB,EAAE,MAAM,6BAA6B,CAAC;AACxE,OAAO,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAC;AAC3E,OAAO,EAAE,2BAA2B,EAAE,MAAM,kCAAkC,CAAC;AAC/E,OAAO,EAAE,kCAAkC,EAAE,MAAM,yCAAyC,CAAC;AAC7F,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAiBzD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AAeI,IAAM,iBAAiB,GAAvB,MAAM,iBACT,SAAQ,SAAS,CAAC,YAAY,CAAC;IAG/B,iBAAiB;IAET,OAAO,CAAS;IAChB,KAAK,CAAS;IAEtB,aAAa;IAEb,eAAe;IAEf;;;;OAIG;IACH;QACI,KAAK,EAAE,CAAC;QAER,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC;QAC3B,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;;;;OAIG;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;;;;;OAKG;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;AA9BG;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;;6CAG1B;AAcD;IAAC,SAAS,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;;+CAG3B;AAjEQ,iBAAiB;IAd7B,SAAS,CAAC;QACP,QAAQ,EAAE,oBAAoB;QAC9B,QAAQ,EAAE,yBAAyB;QACnC,MAAM,EAAE;YACJ,GAAG,EAAE,yBAAyB;YAC9B,KAAK,EAAE,2BAA2B;YAClC,YAAY,EAAE,kCAAkC;SACnD;QACD,OAAO,EAAE;YACL,WAAW;YACX,WAAW;YACX,YAAY;SACf;KACJ,CAAC;;GACW,iBAAiB,CA2E7B"}
+{"version":3,"file":"EmptyStateElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Empty/EmptyStateElement.ts"],"names":[],"mappings":"AAAA,kBAAkB;;;;;;;;;;AAElB,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,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAChE,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAC3D,OAAO,EAAE,WAAW,EAAE,MAAM,mCAAmC,CAAC;AAChE,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,yBAAyB,EAAE,MAAM,6BAA6B,CAAC;AACxE,OAAO,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAC;AAC3E,OAAO,EAAE,2BAA2B,EAAE,MAAM,kCAAkC,CAAC;AAC/E,OAAO,EAAE,kCAAkC,EAAE,MAAM,yCAAyC,CAAC;AAC7F,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAGzD,aAAa;AAEb;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AAeI,IAAM,iBAAiB,GAAvB,MAAM,iBACT,SAAQ,SAAS,CAAC,YAAY,CAAC;IAG/B,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;;;;OAIG;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;;;;;OAKG;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;AA9BG;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;;6CAG1B;AAcD;IAAC,SAAS,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;;+CAG3B;AAjEQ,iBAAiB;IAd7B,SAAS,CAAC;QACP,QAAQ,EAAE,oBAAoB;QAC9B,QAAQ,EAAE,yBAAyB;QACnC,MAAM,EAAE;YACJ,GAAG,EAAE,yBAAyB;YAC9B,KAAK,EAAE,2BAA2B;YAClC,YAAY,EAAE,kCAAkC;SACnD;QACD,OAAO,EAAE;YACL,WAAW;YACX,WAAW;YACX,YAAY;SACf;KACJ,CAAC;;GACW,iBAAiB,CA2E7B"}

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;AAMjE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAI7D;;;;GAIG;AACH,wBAAgB,yBAAyB,CAAC,CAAC,SAAS,iBAAiB,EAAE,CAAC,EAAE,CAAC,GAAG,cAAc,CA2B3F"}
+{"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;AAM7D;;;;GAIG;AACH,wBAAgB,yBAAyB,CAAC,CAAC,SAAS,iBAAiB,EAAE,CAAC,EAAE,CAAC,GAAG,cAAc,CA8B3F"}

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

@@ -1,10 +1,11 @@
 // #region Imports
 import { html } from '../../../../Dom/Html';
-import { Icons } from '../../../../Resources/Icons';
 import { when } from '../../../Directives/Directives';
 import { Orientation } from '../../../Types/Orientation';
 import { Size } from '../../../Types/Size';
 import { TextAlignment } from '../../../Types/TextAlignment';
+import { Icons } from '../../../../Resources/Icons';
+import { styleSheetVar } from '../../../Directives/StyleSheetVarDirective';
 // #endregion
 /**
  * The template of the {@link EmptyStateElement}.
@@ -13,9 +14,11 @@ import { TextAlignment } from '../../../Types/TextAlignment';
  */
 export function emptyStateElementTemplate(e) {
     return html `
+        ${when(e.icon.trim() !== '', () => html `
         <mosaik-icon part="icon"
                      .size="${Size.Giant}"
-                     .data="${e.icon || Icons.glasses}"></mosaik-icon>
+                     .data="${e.icon.trim() ? e.icon : Icons.glasses}"></mosaik-icon>
+        `)}
         ${when(e.header, () => html `
         <mosaik-text part="header"
                      .readonly="${true}"
@@ -34,7 +37,8 @@ export function emptyStateElementTemplate(e) {
         `)}
         <slot></slot>
         <mosaik-stack .orientation="${Orientation.Horizontal}"
-                      .gap="${'16px'}">
+                      .gap="${styleSheetVar('--empty-state-gap')}"
+                      ?hidden="${!e.hasSlotContent('actions')}">
             <slot name="actions"></slot>
         </mosaik-stack>
     `;

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,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACzD,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,IAAI,KAAK,CAAC,OAAO;UAC3C,IAAI,CAAC,CAAC,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;kCAED,IAAI;8BACR,IAAI;mCACC,aAAa,CAAC,MAAM;8BACzB,CAAC,CAAC,MAAM;mCACH,CAAC,CAAC,SAAS;SACrC,CAAC;UACA,IAAI,CAAC,CAAC,CAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;kCAEF,IAAI;8BACR,IAAI;mCACC,aAAa,CAAC,MAAM;8BACzB,CAAC,CAAC,OAAO;mCACJ,CAAC,CAAC,SAAS;SACrC,CAAC;;sCAE4B,WAAW,CAAC,UAAU;8BAC9B,MAAM;;;KAG/B,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,IAAI,EAAE,MAAM,gCAAgC,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACzD,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAE7D,OAAO,EAAE,KAAK,EAAE,MAAM,6BAA6B,CAAC;AACpD,OAAO,EAAE,aAAa,EAAE,MAAM,4CAA4C,CAAC;AAE3E,aAAa;AAEb;;;;GAIG;AACH,MAAM,UAAU,yBAAyB,CAA8B,CAAI;IACvE,OAAO,IAAI,CAAA;UACL,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;8BAEjB,IAAI,CAAC,KAAK;8BACV,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO;SAC3D,CAAC;UACA,IAAI,CAAC,CAAC,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;kCAED,IAAI;8BACR,IAAI;mCACC,aAAa,CAAC,MAAM;8BACzB,CAAC,CAAC,MAAM;mCACH,CAAC,CAAC,SAAS;SACrC,CAAC;UACA,IAAI,CAAC,CAAC,CAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;kCAEF,IAAI;8BACR,IAAI;mCACC,aAAa,CAAC,MAAM;8BACzB,CAAC,CAAC,OAAO;mCACJ,CAAC,CAAC,SAAS;SACrC,CAAC;;sCAE4B,WAAW,CAAC,UAAU;8BAC9B,aAAa,CAAC,mBAAmB,CAAC;iCAC/B,CAAC,CAAC,CAAC,cAAc,CAAC,SAAS,CAAC;;;KAGxD,CAAC;AACN,CAAC"}

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

@@ -0,0 +1,12 @@
+import type { ISlottableProps } from '../../../Behaviors/Slottable';
+import type { ITextFormattableProps } from '../../../Behaviors/TextFormattable';
+/**
+ * Represents the `{@link IEmptyStateElementProps}` interface.
+ *
+ * @public
+ */
+export interface IEmptyStateElementProps extends ISlottableProps, ITextFormattableProps {
+    icon: string;
+    header: string;
+}
+//# sourceMappingURL=IEmptyStateElementProps.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"IEmptyStateElementProps.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Empty/IEmptyStateElementProps.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AACpE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,oCAAoC,CAAC;AAIhF;;;;GAIG;AACH,MAAM,WAAW,uBAAwB,SAAQ,eAAe,EAAE,qBAAqB;IAEnF,IAAI,EAAE,MAAM,CAAC;IAEb,MAAM,EAAE,MAAM,CAAC;CAElB"}

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

@@ -0,0 +1,3 @@
+// #region Imports
+export {};
+//# sourceMappingURL=IEmptyStateElementProps.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"IEmptyStateElementProps.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Empty/IEmptyStateElementProps.ts"],"names":[],"mappings":"AAAA,kBAAkB"}

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

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

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

@@ -37,7 +37,6 @@ export function emptyStateElementCosmopolitanStyle() {
   --empty-state-header-font-text-decoration: unset;
   --empty-state-header-font-text-transform: unset;
   --empty-state-header-font-weight: unset;
-  --empty-state-icon-foreground-color: unset;
 }
 
 @media screen and (prefers-reduced-motion: reduce) {
@@ -71,11 +70,15 @@ export function emptyStateElementCosmopolitanStyle() {
   width: 100%;
   max-width: 100%;
   height: 100%;
-  color: var(--empty-state-foreground-color);
-  flex-direction: column;
+  padding-top: var(--empty-state-padding-top);
+  padding-right: var(--empty-state-padding-right);
+  padding-bottom: var(--empty-state-padding-bottom);
+  padding-left: var(--empty-state-padding-left);
   place-content: center;
   align-items: center;
-  padding: 16px;
+  gap: var(--empty-state-gap);
+  color: var(--empty-state-foreground-color);
+  flex-direction: column;
   display: flex;
   overflow: hidden;
 }

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

@@ -1 +1 @@
-{"version":3,"file":"EmptyStateElement.Cosmopolitan.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/States/Empty/Themes/EmptyStateElement.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,kCAAkC;IAC9C,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA+FT,CAAC;AACN,CAAC"}
+{"version":3,"file":"EmptyStateElement.Cosmopolitan.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/States/Empty/Themes/EmptyStateElement.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,kCAAkC;IAC9C,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAkGT,CAAC;AACN,CAAC"}

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

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

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

@@ -20,11 +20,11 @@ export function emptyStateElementJoyStyle() {
   --empty-state-font-letter-spacing: unset;
   --empty-state-font-text-decoration: unset;
   --empty-state-font-text-transform: unset;
-  --empty-state-padding-top: unset;
-  --empty-state-padding-right: unset;
-  --empty-state-padding-bottom: unset;
-  --empty-state-padding-left: unset;
-  --empty-state-gap: unset;
+  --empty-state-padding-top: calc(var(--joy-layout-space) * 2);
+  --empty-state-padding-right: calc(var(--joy-layout-space) * 2);
+  --empty-state-padding-bottom: calc(var(--joy-layout-space) * 2);
+  --empty-state-padding-left: calc(var(--joy-layout-space) * 2);
+  --empty-state-gap: var(--joy-layout-space);
   --empty-state-transition-duration: unset;
   --empty-state-transition-mode: unset;
   --empty-state-transition-property: unset;
@@ -70,11 +70,15 @@ export function emptyStateElementJoyStyle() {
   width: 100%;
   max-width: 100%;
   height: 100%;
-  color: var(--empty-state-foreground-color);
-  flex-direction: column;
+  padding-top: var(--empty-state-padding-top);
+  padding-right: var(--empty-state-padding-right);
+  padding-bottom: var(--empty-state-padding-bottom);
+  padding-left: var(--empty-state-padding-left);
   place-content: center;
   align-items: center;
-  padding: 16px;
+  gap: var(--empty-state-gap);
+  color: var(--empty-state-foreground-color);
+  flex-direction: column;
   display: flex;
   overflow: hidden;
 }

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

@@ -1 +1 @@
-{"version":3,"file":"EmptyStateElement.Joy.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/States/Empty/Themes/EmptyStateElement.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,yBAAyB;IACrC,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAkHT,CAAC;AACN,CAAC"}
+{"version":3,"file":"EmptyStateElement.Joy.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/States/Empty/Themes/EmptyStateElement.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,yBAAyB;IACrC,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAsHT,CAAC;AACN,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"EmptyStateElement.Retro.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/States/Empty/Themes/EmptyStateElement.Retro.ts"],"names":[],"mappings":"AASA,OAAO,EAAO,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAI7D;;GAEG;AACH,wBAAgB,2BAA2B,IAAI,SAAS,CAoHvD"}
+{"version":3,"file":"EmptyStateElement.Retro.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/States/Empty/Themes/EmptyStateElement.Retro.ts"],"names":[],"mappings":"AASA,OAAO,EAAO,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAI7D;;GAEG;AACH,wBAAgB,2BAA2B,IAAI,SAAS,CAwHvD"}

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

@@ -20,11 +20,11 @@ export function emptyStateElementRetroStyle() {
   --empty-state-font-letter-spacing: unset;
   --empty-state-font-text-decoration: unset;
   --empty-state-font-text-transform: unset;
-  --empty-state-padding-top: unset;
-  --empty-state-padding-right: unset;
-  --empty-state-padding-bottom: unset;
-  --empty-state-padding-left: unset;
-  --empty-state-gap: unset;
+  --empty-state-padding-top: calc(var(--retro-layout-space) * 2);
+  --empty-state-padding-right: calc(var(--retro-layout-space) * 2);
+  --empty-state-padding-bottom: calc(var(--retro-layout-space) * 2);
+  --empty-state-padding-left: calc(var(--retro-layout-space) * 2);
+  --empty-state-gap: var(--retro-layout-space);
   --empty-state-transition-duration: unset;
   --empty-state-transition-mode: unset;
   --empty-state-transition-property: unset;
@@ -70,11 +70,15 @@ export function emptyStateElementRetroStyle() {
   width: 100%;
   max-width: 100%;
   height: 100%;
-  color: var(--empty-state-foreground-color);
-  flex-direction: column;
+  padding-top: var(--empty-state-padding-top);
+  padding-right: var(--empty-state-padding-right);
+  padding-bottom: var(--empty-state-padding-bottom);
+  padding-left: var(--empty-state-padding-left);
   place-content: center;
   align-items: center;
-  padding: 16px;
+  gap: var(--empty-state-gap);
+  color: var(--empty-state-foreground-color);
+  flex-direction: column;
   display: flex;
   overflow: hidden;
 }

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

@@ -1 +1 @@
-{"version":3,"file":"EmptyStateElement.Retro.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/States/Empty/Themes/EmptyStateElement.Retro.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,2BAA2B;IACvC,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAkHT,CAAC;AACN,CAAC"}
+{"version":3,"file":"EmptyStateElement.Retro.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/States/Empty/Themes/EmptyStateElement.Retro.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,2BAA2B;IACvC,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAsHT,CAAC;AACN,CAAC"}

package/Controls/Components/States/Error/ErrorStateElement.d.ts

@@ -1,14 +1,5 @@
 import { StateElement } from '../Abstracts/StateElement';
-/**
- * Represents the `{@link IErrorStateElementProps}` interface.
- *
- * @public
- */
-export interface IErrorStateElementProps {
-    icon: string;
-    header: string;
-    code: string;
-}
+import { IErrorStateElementProps } from './IErrorStateElementProps';
 declare const ErrorStateElement_base: (abstract new (...args: Array<any>) => import("../../../Behaviors/Themeable").IThemeableProps) & typeof StateElement & import("../../../Behaviors/Themeable").IThemeableCtor;
 /**
  * Error State - A UI component used to display an error message or indicator to the user.

package/Controls/Components/States/Error/ErrorStateElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorStateElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Error/ErrorStateElement.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AASzD;;;;GAIG;AACH,MAAM,WAAW,uBAAuB;IAEpC,IAAI,EAAE,MAAM,CAAC;IAEb,MAAM,EAAE,MAAM,CAAC;IAEf,IAAI,EAAE,MAAM,CAAC;CAEhB;;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8CG;AACH,qBAca,iBACT,SAAQ,sBACR,YAAW,uBAAuB;IAIlC,OAAO,CAAC,KAAK,CAAS;IACtB,OAAO,CAAC,OAAO,CAAS;IACxB,OAAO,CAAC,KAAK,CAAS;IAMtB;;;;OAIG;;IAaH;;;;;;MAME;IACF,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;OAIG;IACH,IACW,IAAI,IAAI,MAAM,CAExB;IAED,IAAW,IAAI,CAAC,KAAK,EAAE,MAAM,EAI5B;IAED;;;;OAIG;IACH,IACW,MAAM,IAAI,MAAM,CAE1B;IAED,IAAW,MAAM,CAAC,KAAK,EAAE,MAAM,EAI9B;IAED;;;;;OAKG;IACH,IACW,IAAI,IAAI,MAAM,CAExB;IACD,IAAW,IAAI,CAAC,KAAK,EAAE,MAAM,EAI5B;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":"ErrorStateElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Error/ErrorStateElement.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAMzD,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;;AAIpE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8CG;AACH,qBAca,iBACT,SAAQ,sBACR,YAAW,uBAAuB;IAIlC,OAAO,CAAC,KAAK,CAAS;IACtB,OAAO,CAAC,OAAO,CAAS;IACxB,OAAO,CAAC,KAAK,CAAS;IAMtB;;;;OAIG;;IAaH;;;;;;MAME;IACF,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;OAIG;IACH,IACW,IAAI,IAAI,MAAM,CAExB;IAED,IAAW,IAAI,CAAC,KAAK,EAAE,MAAM,EAI5B;IAED;;;;OAIG;IACH,IACW,MAAM,IAAI,MAAM,CAE1B;IAED,IAAW,MAAM,CAAC,KAAK,EAAE,MAAM,EAI9B;IAED;;;;;OAKG;IACH,IACW,IAAI,IAAI,MAAM,CAExB;IACD,IAAW,IAAI,CAAC,KAAK,EAAE,MAAM,EAI5B;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/Error/ErrorStateElement.js

@@ -20,6 +20,7 @@ import { errorStateElementJoyStyle } from './Themes/ErrorStateElement.Joy';
 import { errorStateElementRetroStyle } from './Themes/ErrorStateElement.Retro';
 import { errorStateElementCosmopolitanStyle } from './Themes/ErrorStateElement.Cosmopolitan';
 import { Themeable } from '../../../Behaviors/Themeable';
+// #endregion
 /**
  * Error State - A UI component used to display an error message or indicator to the user.
  *

package/Controls/Components/States/Error/ErrorStateElement.js.map

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

package/Controls/Components/States/Error/ErrorStateElementTemplate.d.ts.map

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

package/Controls/Components/States/Error/ErrorStateElementTemplate.js

@@ -3,6 +3,7 @@ import { html } from '../../../../Dom/Html';
 import { Icons } from '../../../../Resources/Icons';
 import { when } from '../../../Directives/Directives';
 import { flex } from '../../../Directives/Flex/FlexDirective';
+import { styleSheetVar } from '../../../Directives/StyleSheetVarDirective';
 import { Orientation } from '../../../Types/Orientation';
 import { Size } from '../../../Types/Size';
 import { TextAlignment } from '../../../Types/TextAlignment';
@@ -43,7 +44,8 @@ export function errorStateElementTemplate(e) {
             .data="${e.icon.trim().length > 0 ? e.icon : Icons.errorCircle}"
             .variant="${Variant.Danger}"></mosaik-icon>
         <mosaik-stack .orientation="${Orientation.Horizontal}"
-                      .gap="${'16px'}">
+                      .gap="${styleSheetVar('--error-state-gap')}"
+                      ?hidden="${!e.hasSlotContent('actions')}">
             <slot name="actions"></slot>
         </mosaik-stack>
     `;

package/Controls/Components/States/Error/ErrorStateElementTemplate.js.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorStateElementTemplate.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Error/ErrorStateElementTemplate.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,wCAAwC,CAAC;AAC9D,OAAO,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACzD,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAGjD,aAAa;AAEb;;;;GAIG;AACH,MAAM,UAAU,yBAAyB,CAA8B,CAAI;IACvE,OAAO,IAAI,CAAA;eACA,IAAI,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,CAAC;cAC9B,IAAI,CAAC,CAAC,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;sCAED,IAAI;kCACR,IAAI;uCACC,aAAa,CAAC,MAAM;kCACzB,CAAC,CAAC,MAAM;aAC7B,CAAC;cACA,IAAI,CAAC,CAAC,CAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;qCAEH,IAAI;iCACR,IAAI;sCACC,aAAa,CAAC,MAAM;iCACzB,CAAC,CAAC,OAAO;aAC7B,CAAC;cACA,IAAI,CAAC,CAAC,CAAC,IAAI,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;sCAEC,IAAI;kCACR,IAAI;uCACC,aAAa,CAAC,MAAM;kCACzB,CAAC,CAAC,IAAI;aAC3B,CAAC;;;qBAGO,IAAI,CAAC,KAAK;qBACV,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,WAAW;wBAClD,OAAO,CAAC,MAAM;sCACA,WAAW,CAAC,UAAU;8BAC9B,MAAM;;;KAG/B,CAAC;AACN,CAAC"}
+{"version":3,"file":"ErrorStateElementTemplate.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Error/ErrorStateElementTemplate.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,wCAAwC,CAAC;AAC9D,OAAO,EAAE,aAAa,EAAE,MAAM,4CAA4C,CAAC;AAC3E,OAAO,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACzD,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AAGjD,aAAa;AAEb;;;;GAIG;AACH,MAAM,UAAU,yBAAyB,CAA8B,CAAI;IACvE,OAAO,IAAI,CAAA;eACA,IAAI,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,CAAC;cAC9B,IAAI,CAAC,CAAC,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;sCAED,IAAI;kCACR,IAAI;uCACC,aAAa,CAAC,MAAM;kCACzB,CAAC,CAAC,MAAM;aAC7B,CAAC;cACA,IAAI,CAAC,CAAC,CAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;qCAEH,IAAI;iCACR,IAAI;sCACC,aAAa,CAAC,MAAM;iCACzB,CAAC,CAAC,OAAO;aAC7B,CAAC;cACA,IAAI,CAAC,CAAC,CAAC,IAAI,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;sCAEC,IAAI;kCACR,IAAI;uCACC,aAAa,CAAC,MAAM;kCACzB,CAAC,CAAC,IAAI;aAC3B,CAAC;;;qBAGO,IAAI,CAAC,KAAK;qBACV,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,WAAW;wBAClD,OAAO,CAAC,MAAM;sCACA,WAAW,CAAC,UAAU;8BAC9B,aAAa,CAAC,mBAAmB,CAAC;iCAC/B,CAAC,CAAC,CAAC,cAAc,CAAC,SAAS,CAAC;;;KAGxD,CAAC;AACN,CAAC"}

package/Controls/Components/States/Error/IErrorStateElementProps.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Represents the `{@link IErrorStateElementProps}` interface.
+ *
+ * @public
+ */
+export interface IErrorStateElementProps {
+    icon: string;
+    header: string;
+    code: string;
+}
+//# sourceMappingURL=IErrorStateElementProps.d.ts.map

package/Controls/Components/States/Error/IErrorStateElementProps.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"IErrorStateElementProps.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Error/IErrorStateElementProps.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,MAAM,WAAW,uBAAuB;IAEpC,IAAI,EAAE,MAAM,CAAC;IAEb,MAAM,EAAE,MAAM,CAAC;IAEf,IAAI,EAAE,MAAM,CAAC;CAEhB"}

package/Controls/Components/States/Error/IErrorStateElementProps.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=IErrorStateElementProps.js.map

package/Controls/Components/States/Error/IErrorStateElementProps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IErrorStateElementProps.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/States/Error/IErrorStateElementProps.ts"],"names":[],"mappings":""}

package/Controls/Components/States/Error/Themes/ErrorStateElement.Cosmopolitan.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorStateElement.Cosmopolitan.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/States/Error/Themes/ErrorStateElement.Cosmopolitan.ts"],"names":[],"mappings":"AASA,OAAO,EAAO,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAI7D;;GAEG;AACH,wBAAgB,kCAAkC,IAAI,SAAS,CA0F9D"}
+{"version":3,"file":"ErrorStateElement.Cosmopolitan.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/States/Error/Themes/ErrorStateElement.Cosmopolitan.ts"],"names":[],"mappings":"AASA,OAAO,EAAO,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAI7D;;GAEG;AACH,wBAAgB,kCAAkC,IAAI,SAAS,CA+F9D"}

package/Controls/Components/States/Error/Themes/ErrorStateElement.Cosmopolitan.js

@@ -29,6 +29,7 @@ export function errorStateElementCosmopolitanStyle() {
   --error-state-transition-mode: unset;
   --error-state-transition-property: unset;
   --error-state-translate: unset;
+  --error-state-foreground-color: unset;
   --error-state-header-font-family: unset;
   --error-state-header-font-letter-spacing: unset;
   --error-state-header-font-line-height: unset;
@@ -66,13 +67,17 @@ export function errorStateElementCosmopolitanStyle() {
 
 :host {
   box-sizing: border-box;
-  flex-direction: column;
-  place-content: center;
-  align-items: center;
   width: 100%;
   max-width: 100%;
   height: 100%;
-  padding: 16px;
+  padding-top: var(--error-state-padding-top);
+  padding-right: var(--error-state-padding-right);
+  padding-bottom: var(--error-state-padding-bottom);
+  padding-left: var(--error-state-padding-left);
+  place-content: center;
+  align-items: center;
+  gap: var(--error-state-gap);
+  flex-direction: column;
   display: flex;
   overflow: hidden;
 }

package/Controls/Components/States/Error/Themes/ErrorStateElement.Cosmopolitan.js.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorStateElement.Cosmopolitan.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/States/Error/Themes/ErrorStateElement.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,kCAAkC;IAC9C,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAwFT,CAAC;AACN,CAAC"}
+{"version":3,"file":"ErrorStateElement.Cosmopolitan.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/States/Error/Themes/ErrorStateElement.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,kCAAkC;IAC9C,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA6FT,CAAC;AACN,CAAC"}

package/Controls/Components/States/Error/Themes/ErrorStateElement.Joy.d.ts.map

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