@breadstone/mosaik-elements-foundation 0.0.32 → 0.0.33

package/Controls/Components/Primitives/Jumbtron/Themes/JumbtronSubHeaderElement.Cosmopolitan.js

@@ -13,25 +13,25 @@ import { css } from '../../../../../Dom/Css';
 export function jumbtronSubHeaderElementCosmopolitanStyle() {
     return css `
 :host {
+  --jumbtron-sub-header-background-color: unset;
+  --jumbtron-sub-header-border-color: unset;
   --jumbtron-sub-header-font-family: unset;
-  --jumbtron-sub-header-font-size: unset;
-  --jumbtron-sub-header-font-line-height: unset;
-  --jumbtron-sub-header-font-weight: unset;
   --jumbtron-sub-header-font-letter-spacing: unset;
+  --jumbtron-sub-header-font-line-height: unset;
+  --jumbtron-sub-header-font-size: unset;
   --jumbtron-sub-header-font-text-decoration: unset;
   --jumbtron-sub-header-font-text-transform: unset;
-  --jumbtron-sub-header-padding-top: unset;
-  --jumbtron-sub-header-padding-right: unset;
+  --jumbtron-sub-header-font-weight: unset;
+  --jumbtron-sub-header-foreground-color: unset;
+  --jumbtron-sub-header-gap: unset;
   --jumbtron-sub-header-padding-bottom: unset;
   --jumbtron-sub-header-padding-left: unset;
-  --jumbtron-sub-header-gap: unset;
+  --jumbtron-sub-header-padding-right: unset;
+  --jumbtron-sub-header-padding-top: unset;
   --jumbtron-sub-header-transition-duration: unset;
   --jumbtron-sub-header-transition-mode: unset;
   --jumbtron-sub-header-transition-property: unset;
   --jumbtron-sub-header-translate: unset;
-  --jumbtron-sub-header-background-color: unset;
-  --jumbtron-sub-header-border-color: unset;
-  --jumbtron-sub-header-foreground-color: unset;
 }
 
 @media screen and (prefers-reduced-motion: reduce) {

package/Controls/Components/Primitives/Jumbtron/Themes/JumbtronSubHeaderElement.Joy.js

@@ -13,25 +13,25 @@ import { css } from '../../../../../Dom/Css';
 export function jumbtronSubHeaderElementJoyStyle() {
     return css `
 :host {
+  --jumbtron-sub-header-background-color: var(--joy-scheme-background);
+  --jumbtron-sub-header-border-color: var(--joy-scheme-highlight);
   --jumbtron-sub-header-font-family: var(--joy-font-family);
-  --jumbtron-sub-header-font-size: var(--joy-typography-headline3-font-size);
-  --jumbtron-sub-header-font-line-height: var(--joy-typography-headline3-line-height);
-  --jumbtron-sub-header-font-weight: var(--joy-typography-headline3-font-weight);
   --jumbtron-sub-header-font-letter-spacing: var(--joy-typography-headline3-letter-spacing);
+  --jumbtron-sub-header-font-line-height: var(--joy-typography-headline3-line-height);
+  --jumbtron-sub-header-font-size: var(--joy-typography-headline3-font-size);
   --jumbtron-sub-header-font-text-decoration: var(--joy-typography-headline3-text-decoration);
   --jumbtron-sub-header-font-text-transform: var(--joy-typography-headline3-text-transform);
-  --jumbtron-sub-header-padding-top: unset;
-  --jumbtron-sub-header-padding-right: unset;
+  --jumbtron-sub-header-font-weight: var(--joy-typography-headline3-font-weight);
+  --jumbtron-sub-header-foreground-color: var(--joy-scheme-middlelight);
+  --jumbtron-sub-header-gap: unset;
   --jumbtron-sub-header-padding-bottom: unset;
   --jumbtron-sub-header-padding-left: unset;
-  --jumbtron-sub-header-gap: unset;
+  --jumbtron-sub-header-padding-right: unset;
+  --jumbtron-sub-header-padding-top: unset;
   --jumbtron-sub-header-transition-duration: unset;
   --jumbtron-sub-header-transition-mode: unset;
   --jumbtron-sub-header-transition-property: unset;
   --jumbtron-sub-header-translate: unset;
-  --jumbtron-sub-header-background-color: var(--joy-scheme-background);
-  --jumbtron-sub-header-border-color: var(--joy-scheme-highlight);
-  --jumbtron-sub-header-foreground-color: var(--joy-scheme-middlelight);
 }
 
 @media screen and (prefers-reduced-motion: reduce) {

package/Controls/Components/Primitives/Jumbtron/Themes/JumbtronSubHeaderElement.Retro.js

@@ -13,25 +13,25 @@ import { css } from '../../../../../Dom/Css';
 export function jumbtronSubHeaderElementRetroStyle() {
     return css `
 :host {
+  --jumbtron-sub-header-background-color: unset;
+  --jumbtron-sub-header-border-color: unset;
   --jumbtron-sub-header-font-family: unset;
-  --jumbtron-sub-header-font-size: unset;
-  --jumbtron-sub-header-font-line-height: unset;
-  --jumbtron-sub-header-font-weight: unset;
   --jumbtron-sub-header-font-letter-spacing: unset;
+  --jumbtron-sub-header-font-line-height: unset;
+  --jumbtron-sub-header-font-size: unset;
   --jumbtron-sub-header-font-text-decoration: unset;
   --jumbtron-sub-header-font-text-transform: unset;
-  --jumbtron-sub-header-padding-top: unset;
-  --jumbtron-sub-header-padding-right: unset;
+  --jumbtron-sub-header-font-weight: unset;
+  --jumbtron-sub-header-foreground-color: unset;
+  --jumbtron-sub-header-gap: unset;
   --jumbtron-sub-header-padding-bottom: unset;
   --jumbtron-sub-header-padding-left: unset;
-  --jumbtron-sub-header-gap: unset;
+  --jumbtron-sub-header-padding-right: unset;
+  --jumbtron-sub-header-padding-top: unset;
   --jumbtron-sub-header-transition-duration: unset;
   --jumbtron-sub-header-transition-mode: unset;
   --jumbtron-sub-header-transition-property: unset;
   --jumbtron-sub-header-translate: unset;
-  --jumbtron-sub-header-background-color: unset;
-  --jumbtron-sub-header-border-color: unset;
-  --jumbtron-sub-header-foreground-color: unset;
 }
 
 @media screen and (prefers-reduced-motion: reduce) {

package/Controls/Components/Primitives/Kbd/KbdElement.d.ts

@@ -22,6 +22,7 @@ declare const KbdElement_base: (abstract new (...args: Array<any>) => import("..
  */
 export declare class KbdElement extends KbdElement_base implements IKbdElementProps {
     private readonly _modifierSymbols;
+    private readonly _modifierKeys;
     /**
      * @public
      */
@@ -35,6 +36,15 @@ export declare class KbdElement extends KbdElement_base implements IKbdElementPr
      * @readonly
      */
     static get is(): string;
+    /**
+     * Gets or sets the `value` property.
+     *
+     * @public
+     * @override
+     * @attr
+     */
+    get value(): Array<string>;
+    set value(value: Array<string>);
 }
 /**
  * @public

package/Controls/Components/Primitives/Kbd/KbdElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"KbdElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Kbd/KbdElement.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;;AAStD;;;;;;;;;;;;;;;;;;GAkBG;AACH,qBAUa,UACT,SAAQ,eACR,YAAW,gBAAgB;IAI3B,OAAO,CAAC,QAAQ,CAAC,gBAAgB,CAK9B;IAMH;;OAEG;;IASH;;;;;;;OAOG;IACH,WAAkB,EAAE,IAAI,MAAM,CAE7B;CA2BJ;AAED;;GAEG;AACH,yBAAiB,UAAU,CAAC;IACxB,KAAY,KAAK,GAAG,gBAAgB,CAAC;CACxC;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,YAAY,EAAE,UAAU,CAAC;KAC5B;CACJ"}
+{"version":3,"file":"KbdElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Kbd/KbdElement.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;;AAUtD;;;;;;;;;;;;;;;;;;GAkBG;AACH,qBAUa,UACT,SAAQ,eACR,YAAW,gBAAgB;IAI3B,OAAO,CAAC,QAAQ,CAAC,gBAAgB,CAK9B;IACH,OAAO,CAAC,QAAQ,CAAC,aAAa,CAK5B;IAMF;;OAEG;;IASH;;;;;;;OAOG;IACH,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;;;OAMG;IACH,IACoB,KAAK,IAAI,KAAK,CAAC,MAAM,CAAC,CAEzC;IACD,IAAoB,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,EAE7C;CAkBJ;AAED;;GAEG;AACH,yBAAiB,UAAU,CAAC;IACxB,KAAY,KAAK,GAAG,gBAAgB,CAAC;CACxC;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,YAAY,EAAE,UAAU,CAAC;KAC5B;CACJ"}

package/Controls/Components/Primitives/Kbd/KbdElement.js

@@ -18,6 +18,7 @@ import { kbdElementJoyStyle } from './Themes/KbdElement.Joy';
 import { kbdElementRetroStyle } from './Themes/KbdElement.Retro';
 import { kbdElementCosmopolitanStyle } from './Themes/KbdElement.Cosmopolitan';
 import { Themeable } from '../../../Behaviors/Themeable';
+import { Attribute } from '../../../Decorators/AttributeDecorator';
 // #endregion
 /**
  * Kbd - Represents user input from a keyboard, typically used for keyboard shortcuts or key sequences.
@@ -46,6 +47,12 @@ let KbdElement = class KbdElement extends Themeable(Valueable(Variantable(Custom
         [ModifierKeyName.Meta, '⌘'],
         [ModifierKeyName.Alt, '⌥']
     ]);
+    _modifierKeys = [
+        KeyName.Shift.toLowerCase(),
+        KeyName.Control.toLowerCase(),
+        KeyName.Meta.toLowerCase(),
+        KeyName.Alt.toLowerCase()
+    ];
     // #endregion
     // #region Ctor
     /**
@@ -67,6 +74,19 @@ let KbdElement = class KbdElement extends Themeable(Valueable(Variantable(Custom
     static get is() {
         return 'mosaik-kbd';
     }
+    /**
+     * Gets or sets the `value` property.
+     *
+     * @public
+     * @override
+     * @attr
+     */
+    get value() {
+        return super.value;
+    }
+    set value(value) {
+        super.value = value;
+    }
     // #endregion
     // #region Methods
     /**
@@ -74,18 +94,16 @@ let KbdElement = class KbdElement extends Themeable(Valueable(Variantable(Custom
      * @template
      */
     getModifierSymbol(key) {
-        const isModifierKey = [
-            KeyName.Shift.toLowerCase(),
-            KeyName.Control.toLowerCase(),
-            KeyName.Meta.toLowerCase(),
-            KeyName.Alt.toLowerCase()
-        ].includes(key.toLowerCase());
-        if (isModifierKey) {
-            return this._modifierSymbols.get(key) ?? key;
-        }
-        return key;
+        return this._modifierKeys.includes(key.toLowerCase())
+            ? this._modifierSymbols.get(key) ?? key
+            : key;
     }
 };
+__decorate([
+    Attribute({ type: Array }),
+    __metadata("design:type", Array),
+    __metadata("design:paramtypes", [Array])
+], KbdElement.prototype, "value", null);
 KbdElement = __decorate([
     Component({
         selector: 'mosaik-kbd',

package/Controls/Components/Primitives/Kbd/KbdElement.js.map

@@ -1 +1 @@
-{"version":3,"file":"KbdElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Kbd/KbdElement.ts"],"names":[],"mappings":"AAAA,kBAAkB;;;;;;;;;;AAElB,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC7D,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAC9D,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAE9D,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAC;AACjE,OAAO,EAAE,2BAA2B,EAAE,MAAM,kCAAkC,CAAC;AAC/E,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAEzD,aAAa;AAEb;;;;;;;;;;;;;;;;;;GAkBG;AAWI,IAAM,UAAU,GAAhB,MAAM,UACT,SAAQ,SAAS,CAAC,SAAS,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC,CAAC;IAGxD,iBAAiB;IAEA,gBAAgB,GAAiC,IAAI,GAAG,CAA0B;QAC/F,CAAC,eAAe,CAAC,KAAK,EAAE,GAAG,CAAC;QAC5B,CAAC,eAAe,CAAC,OAAO,EAAE,GAAG,CAAC;QAC9B,CAAC,eAAe,CAAC,IAAI,EAAE,GAAG,CAAC;QAC3B,CAAC,eAAe,CAAC,GAAG,EAAE,GAAG,CAAC;KAC7B,CAAC,CAAC;IAEH,aAAa;IAEb,eAAe;IAEf;;OAEG;IACH;QACI,KAAK,EAAE,CAAC;IACZ,CAAC;IAED,aAAa;IAEb,qBAAqB;IAErB;;;;;;;OAOG;IACI,MAAM,KAAK,EAAE;QAChB,OAAO,YAAY,CAAC;IACxB,CAAC;IAED,aAAa;IAEb,kBAAkB;IAElB;;;OAGG;IACI,iBAAiB,CAAC,GAAW;QAChC,MAAM,aAAa,GAAG;YAClB,OAAO,CAAC,KAAK,CAAC,WAAW,EAAE;YAC3B,OAAO,CAAC,OAAO,CAAC,WAAW,EAAE;YAC7B,OAAO,CAAC,IAAI,CAAC,WAAW,EAAE;YAC1B,OAAO,CAAC,GAAG,CAAC,WAAW,EAAE;SAC5B,CAAC,QAAQ,CAAC,GAAG,CAAC,WAAW,EAAa,CAAC,CAAC;QAEzC,IAAI,aAAa,EAAE,CAAC;YAChB,OAAO,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,GAAsB,CAAC,IAAI,GAAG,CAAC;QACpE,CAAC;QAED,OAAO,GAAG,CAAC;IACf,CAAC;CAIJ,CAAA;AAjEY,UAAU;IAVtB,SAAS,CAAC;QACP,QAAQ,EAAE,YAAY;QACtB,QAAQ,EAAE,kBAAkB;QAC5B,MAAM,EAAE;YACJ,GAAG,EAAE,kBAAkB;YACvB,KAAK,EAAE,oBAAoB;YAC3B,YAAY,EAAE,2BAA2B;SAC5C;QACD,OAAO,EAAE,EAAE;KACd,CAAC;;GACW,UAAU,CAiEtB"}
+{"version":3,"file":"KbdElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Kbd/KbdElement.ts"],"names":[],"mappings":"AAAA,kBAAkB;;;;;;;;;;AAElB,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC7D,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAC9D,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAE9D,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAC;AACjE,OAAO,EAAE,2BAA2B,EAAE,MAAM,kCAAkC,CAAC;AAC/E,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AAEnE,aAAa;AAEb;;;;;;;;;;;;;;;;;;GAkBG;AAWI,IAAM,UAAU,GAAhB,MAAM,UACT,SAAQ,SAAS,CAAC,SAAS,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC,CAAC;IAGxD,iBAAiB;IAEA,gBAAgB,GAAiC,IAAI,GAAG,CAA0B;QAC/F,CAAC,eAAe,CAAC,KAAK,EAAE,GAAG,CAAC;QAC5B,CAAC,eAAe,CAAC,OAAO,EAAE,GAAG,CAAC;QAC9B,CAAC,eAAe,CAAC,IAAI,EAAE,GAAG,CAAC;QAC3B,CAAC,eAAe,CAAC,GAAG,EAAE,GAAG,CAAC;KAC7B,CAAC,CAAC;IACc,aAAa,GAAkB;QAC5C,OAAO,CAAC,KAAK,CAAC,WAAW,EAAE;QAC3B,OAAO,CAAC,OAAO,CAAC,WAAW,EAAE;QAC7B,OAAO,CAAC,IAAI,CAAC,WAAW,EAAE;QAC1B,OAAO,CAAC,GAAG,CAAC,WAAW,EAAE;KAC5B,CAAC;IAEF,aAAa;IAEb,eAAe;IAEf;;OAEG;IACH;QACI,KAAK,EAAE,CAAC;IACZ,CAAC;IAED,aAAa;IAEb,qBAAqB;IAErB;;;;;;;OAOG;IACI,MAAM,KAAK,EAAE;QAChB,OAAO,YAAY,CAAC;IACxB,CAAC;IAED;;;;;;OAMG;IACH,IACoB,KAAK;QACrB,OAAO,KAAK,CAAC,KAAsB,CAAC;IACxC,CAAC;IACD,IAAoB,KAAK,CAAC,KAAoB;QAC1C,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC;IACxB,CAAC;IAED,aAAa;IAEb,kBAAkB;IAElB;;;OAGG;IACI,iBAAiB,CAAC,GAAW;QAChC,OAAO,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,GAAG,CAAC,WAAW,EAAa,CAAC;YAC5D,CAAC,CAAC,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,GAAsB,CAAC,IAAI,GAAG;YAC1D,CAAC,CAAC,GAAG,CAAC;IACd,CAAC;CAIJ,CAAA;AAxBG;IAAC,SAAS,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;8BAIM,KAAK;qCAAL,KAAK;uCADrC;AAxDQ,UAAU;IAVtB,SAAS,CAAC;QACP,QAAQ,EAAE,YAAY;QACtB,QAAQ,EAAE,kBAAkB;QAC5B,MAAM,EAAE;YACJ,GAAG,EAAE,kBAAkB;YACvB,KAAK,EAAE,oBAAoB;YAC3B,YAAY,EAAE,2BAA2B;SAC5C;QACD,OAAO,EAAE,EAAE;KACd,CAAC;;GACW,UAAU,CA6EtB"}

package/Controls/Components/Primitives/Kbd/KbdElementTemplate.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"KbdElementTemplate.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Kbd/KbdElementTemplate.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,cAAc,EAAQ,MAAM,sBAAsB,CAAC;AAEjE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAI/C;;;;GAIG;AACH,wBAAgB,kBAAkB,CAAC,CAAC,SAAS,UAAU,EAAE,CAAC,EAAE,CAAC,GAAG,cAAc,CAU7E"}
+{"version":3,"file":"KbdElementTemplate.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Kbd/KbdElementTemplate.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,cAAc,EAAQ,MAAM,sBAAsB,CAAC;AAEjE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAI/C;;;;GAIG;AACH,wBAAgB,kBAAkB,CAAC,CAAC,SAAS,UAAU,EAAE,CAAC,EAAE,CAAC,GAAG,cAAc,CAS7E"}

package/Controls/Components/Primitives/Kbd/KbdElementTemplate.js

@@ -8,11 +8,10 @@ import { repeat, unsafeHTML, when } from '../../../Directives/Directives';
  * @public
  */
 export function kbdElementTemplate(e) {
-    const values = e.value;
     return html `
-        ${repeat(values, (x) => x, (x, i) => html `
+        ${repeat(e.value, (x) => x, (x, i) => html `
         <kbd part="kbd">${unsafeHTML(e.getModifierSymbol(x))}</kbd>
-        ${when(i < values.length - 1, () => html `
+        ${when(i < e.value.length - 1, () => html `
         <span part="delimiter" role="text"> + </span>
         `)}
         `)}

package/Controls/Components/Primitives/Kbd/KbdElementTemplate.js.map

@@ -1 +1 @@
-{"version":3,"file":"KbdElementTemplate.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Kbd/KbdElementTemplate.ts"],"names":[],"mappings":"AAAA,kBAAkB;AAElB,OAAO,EAAuB,IAAI,EAAE,MAAM,sBAAsB,CAAC;AACjE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,gCAAgC,CAAC;AAG1E,aAAa;AAEb;;;;GAIG;AACH,MAAM,UAAU,kBAAkB,CAAuB,CAAI;IACzD,MAAM,MAAM,GAAG,CAAC,CAAC,KAAsB,CAAC;IACxC,OAAO,IAAI,CAAA;UACL,MAAM,CAAC,MAAM,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,IAAI,CAAA;0BACvB,UAAU,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC;UAClD,IAAI,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,GAAG,CAAC,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;SAEvC,CAAC;SACD,CAAC;GACP,CAAC;AACJ,CAAC"}
+{"version":3,"file":"KbdElementTemplate.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Kbd/KbdElementTemplate.ts"],"names":[],"mappings":"AAAA,kBAAkB;AAElB,OAAO,EAAuB,IAAI,EAAE,MAAM,sBAAsB,CAAC;AACjE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,gCAAgC,CAAC;AAG1E,aAAa;AAEb;;;;GAIG;AACH,MAAM,UAAU,kBAAkB,CAAuB,CAAI;IACzD,OAAO,IAAI,CAAA;UACL,MAAM,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,IAAI,CAAA;0BACxB,UAAU,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC;UAClD,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;;SAExC,CAAC;SACD,CAAC;GACP,CAAC;AACJ,CAAC"}

package/Controls/Components/Primitives/Kbd/Themes/KbdElement.Cosmopolitan.js

@@ -13,29 +13,29 @@ import { css } from '../../../../../Dom/Css';
 export function kbdElementCosmopolitanStyle() {
     return css `
 :host {
+  --kbd-background-color: unset;
+  --kbd-border-color: unset;
+  --kbd-border-radius: unset;
+  --kbd-border-style: unset;
+  --kbd-border-width: unset;
   --kbd-font-family: unset;
-  --kbd-font-size: unset;
-  --kbd-font-line-height: unset;
-  --kbd-font-weight: unset;
   --kbd-font-letter-spacing: unset;
+  --kbd-font-line-height: unset;
+  --kbd-font-size: unset;
   --kbd-font-text-decoration: unset;
   --kbd-font-text-transform: unset;
-  --kbd-padding-top: unset;
-  --kbd-padding-right: unset;
+  --kbd-font-weight: unset;
+  --kbd-foreground-color: unset;
+  --kbd-gap: unset;
   --kbd-padding-bottom: unset;
   --kbd-padding-left: unset;
-  --kbd-gap: unset;
+  --kbd-padding-right: unset;
+  --kbd-padding-top: unset;
+  --kbd-shadow: unset;
   --kbd-transition-duration: unset;
   --kbd-transition-mode: unset;
   --kbd-transition-property: unset;
   --kbd-translate: unset;
-  --kbd-background-color: unset;
-  --kbd-border-color: unset;
-  --kbd-border-radius: unset;
-  --kbd-border-style: unset;
-  --kbd-border-width: unset;
-  --kbd-foreground-color: unset;
-  --kbd-shadow: unset;
 }
 
 @media screen and (prefers-reduced-motion: reduce) {

package/Controls/Components/Primitives/Kbd/Themes/KbdElement.Joy.js

@@ -13,29 +13,29 @@ import { css } from '../../../../../Dom/Css';
 export function kbdElementJoyStyle() {
     return css `
 :host {
+  --kbd-background-color: var(--joy-scheme-highlight);
+  --kbd-border-color: var(--joy-scheme-transparent);
+  --kbd-border-radius: calc(var(--joy-layout-radius) / 2);
+  --kbd-border-style: solid;
+  --kbd-border-width: 0px;
   --kbd-font-family: var(--joy-font-family);
-  --kbd-font-size: var(--joy-typography-overline-font-size);
-  --kbd-font-line-height: var(--joy-typography-overline-line-height);
-  --kbd-font-weight: var(--joy-typography-overline-font-weight);
   --kbd-font-letter-spacing: var(--joy-typography-overline-letter-spacing);
+  --kbd-font-line-height: var(--joy-typography-overline-line-height);
+  --kbd-font-size: var(--joy-typography-overline-font-size);
   --kbd-font-text-decoration: var(--joy-typography-overline-text-decoration);
   --kbd-font-text-transform: var(--joy-typography-overline-text-transform);
-  --kbd-padding-top: calc(var(--joy-layout-space) / 2);
-  --kbd-padding-right: calc(var(--joy-layout-space) / 2);
+  --kbd-font-weight: var(--joy-typography-overline-font-weight);
+  --kbd-foreground-color: var(--joy-scheme-foreground);
+  --kbd-gap: var(--joy-layout-space);
   --kbd-padding-bottom: calc(var(--joy-layout-space) / 2);
   --kbd-padding-left: calc(var(--joy-layout-space) / 2);
-  --kbd-gap: var(--joy-layout-space);
+  --kbd-padding-right: calc(var(--joy-layout-space) / 2);
+  --kbd-padding-top: calc(var(--joy-layout-space) / 2);
+  --kbd-shadow: var(--joy-elevation-light);
   --kbd-transition-duration: unset;
   --kbd-transition-mode: unset;
   --kbd-transition-property: unset;
   --kbd-translate: unset;
-  --kbd-background-color: var(--joy-scheme-background);
-  --kbd-border-color: var(--joy-scheme-transparent);
-  --kbd-border-radius: calc(var(--joy-layout-radius) / 2);
-  --kbd-border-style: solid;
-  --kbd-border-width: 0px;
-  --kbd-foreground-color: var(--joy-scheme-foreground);
-  --kbd-shadow: var(--joy-elevation-light);
 }
 
 @media screen and (prefers-reduced-motion: reduce) {

package/Controls/Components/Primitives/Kbd/Themes/KbdElement.Retro.js

@@ -13,29 +13,29 @@ import { css } from '../../../../../Dom/Css';
 export function kbdElementRetroStyle() {
     return css `
 :host {
+  --kbd-background-color: unset;
+  --kbd-border-color: unset;
+  --kbd-border-radius: unset;
+  --kbd-border-style: unset;
+  --kbd-border-width: unset;
   --kbd-font-family: unset;
-  --kbd-font-size: unset;
-  --kbd-font-line-height: unset;
-  --kbd-font-weight: unset;
   --kbd-font-letter-spacing: unset;
+  --kbd-font-line-height: unset;
+  --kbd-font-size: unset;
   --kbd-font-text-decoration: unset;
   --kbd-font-text-transform: unset;
-  --kbd-padding-top: unset;
-  --kbd-padding-right: unset;
+  --kbd-font-weight: unset;
+  --kbd-foreground-color: unset;
+  --kbd-gap: unset;
   --kbd-padding-bottom: unset;
   --kbd-padding-left: unset;
-  --kbd-gap: unset;
+  --kbd-padding-right: unset;
+  --kbd-padding-top: unset;
+  --kbd-shadow: unset;
   --kbd-transition-duration: unset;
   --kbd-transition-mode: unset;
   --kbd-transition-property: unset;
   --kbd-translate: unset;
-  --kbd-background-color: unset;
-  --kbd-border-color: unset;
-  --kbd-border-radius: unset;
-  --kbd-border-style: unset;
-  --kbd-border-width: unset;
-  --kbd-foreground-color: unset;
-  --kbd-shadow: unset;
 }
 
 @media screen and (prefers-reduced-motion: reduce) {

package/Controls/Components/Primitives/Kbd/Themes/KbdShortcutElement.Cosmopolitan.js

@@ -14,17 +14,17 @@ export function kbdShortcutElementCosmopolitanStyle() {
     return css `
 :host {
   --kbd-shortcut-font-family: unset;
-  --kbd-shortcut-font-size: unset;
-  --kbd-shortcut-font-line-height: unset;
-  --kbd-shortcut-font-weight: unset;
   --kbd-shortcut-font-letter-spacing: unset;
+  --kbd-shortcut-font-line-height: unset;
+  --kbd-shortcut-font-size: unset;
   --kbd-shortcut-font-text-decoration: unset;
   --kbd-shortcut-font-text-transform: unset;
-  --kbd-shortcut-padding-top: unset;
-  --kbd-shortcut-padding-right: unset;
+  --kbd-shortcut-font-weight: unset;
+  --kbd-shortcut-gap: unset;
   --kbd-shortcut-padding-bottom: unset;
   --kbd-shortcut-padding-left: unset;
-  --kbd-shortcut-gap: unset;
+  --kbd-shortcut-padding-right: unset;
+  --kbd-shortcut-padding-top: unset;
   --kbd-shortcut-transition-duration: unset;
   --kbd-shortcut-transition-mode: unset;
   --kbd-shortcut-transition-property: unset;

package/Controls/Components/Primitives/Kbd/Themes/KbdShortcutElement.Joy.js

@@ -14,17 +14,17 @@ export function kbdShortcutElementJoyStyle() {
     return css `
 :host {
   --kbd-shortcut-font-family: unset;
-  --kbd-shortcut-font-size: unset;
-  --kbd-shortcut-font-line-height: unset;
-  --kbd-shortcut-font-weight: unset;
   --kbd-shortcut-font-letter-spacing: unset;
+  --kbd-shortcut-font-line-height: unset;
+  --kbd-shortcut-font-size: unset;
   --kbd-shortcut-font-text-decoration: unset;
   --kbd-shortcut-font-text-transform: unset;
-  --kbd-shortcut-padding-top: unset;
-  --kbd-shortcut-padding-right: unset;
+  --kbd-shortcut-font-weight: unset;
+  --kbd-shortcut-gap: unset;
   --kbd-shortcut-padding-bottom: unset;
   --kbd-shortcut-padding-left: unset;
-  --kbd-shortcut-gap: unset;
+  --kbd-shortcut-padding-right: unset;
+  --kbd-shortcut-padding-top: unset;
   --kbd-shortcut-transition-duration: unset;
   --kbd-shortcut-transition-mode: unset;
   --kbd-shortcut-transition-property: unset;

package/Controls/Components/Primitives/Kbd/Themes/KbdShortcutElement.Retro.js

@@ -14,17 +14,17 @@ export function kbdShortcutElementRetroStyle() {
     return css `
 :host {
   --kbd-shortcut-font-family: unset;
-  --kbd-shortcut-font-size: unset;
-  --kbd-shortcut-font-line-height: unset;
-  --kbd-shortcut-font-weight: unset;
   --kbd-shortcut-font-letter-spacing: unset;
+  --kbd-shortcut-font-line-height: unset;
+  --kbd-shortcut-font-size: unset;
   --kbd-shortcut-font-text-decoration: unset;
   --kbd-shortcut-font-text-transform: unset;
-  --kbd-shortcut-padding-top: unset;
-  --kbd-shortcut-padding-right: unset;
+  --kbd-shortcut-font-weight: unset;
+  --kbd-shortcut-gap: unset;
   --kbd-shortcut-padding-bottom: unset;
   --kbd-shortcut-padding-left: unset;
-  --kbd-shortcut-gap: unset;
+  --kbd-shortcut-padding-right: unset;
+  --kbd-shortcut-padding-top: unset;
   --kbd-shortcut-transition-duration: unset;
   --kbd-shortcut-transition-mode: unset;
   --kbd-shortcut-transition-property: unset;

package/Controls/Components/Primitives/Marquee/MarqueeElementTemplate.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MarqueeElementTemplate.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Marquee/MarqueeElementTemplate.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,cAAc,EAAQ,MAAM,sBAAsB,CAAC;AAEjE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAIvD;;;;GAIG;AACH,wBAAgB,sBAAsB,CAAC,CAAC,SAAS,cAAc,EAAE,CAAC,EAAE,CAAC,GAAG,cAAc,CAgBrF"}
+{"version":3,"file":"MarqueeElementTemplate.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Marquee/MarqueeElementTemplate.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,cAAc,EAAQ,MAAM,sBAAsB,CAAC;AACjE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAIvD;;;;GAIG;AACH,wBAAgB,sBAAsB,CAAC,CAAC,SAAS,cAAc,EAAE,CAAC,EAAE,CAAC,GAAG,cAAc,CAYrF"}

package/Controls/Components/Primitives/Marquee/MarqueeElementTemplate.js

@@ -1,6 +1,6 @@
+/* eslint-disable lit/prefer-static-styles */
 // #region Imports
 import { html } from '../../../../Dom/Html';
-import { style } from '../../../../Dom/Style';
 // #endregion
 /**
  * The template of the {@link MarqueeElement}.
@@ -8,14 +8,11 @@ import { style } from '../../../../Dom/Style';
  * @public
  */
 export function marqueeElementTemplate(e) {
-    const inlineStyle = style `
-        :host {
-            --marquee-speed: ${e.speed};
-        }
-    `;
     return html `
         <style>
-            ${inlineStyle}
+           :host {
+            --marquee-speed: ${e.speed};
+            }
         </style>
         <div part="track">
             <slot></slot>

package/Controls/Components/Primitives/Marquee/MarqueeElementTemplate.js.map

@@ -1 +1 @@
-{"version":3,"file":"MarqueeElementTemplate.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Marquee/MarqueeElementTemplate.ts"],"names":[],"mappings":"AAAA,kBAAkB;AAElB,OAAO,EAAuB,IAAI,EAAE,MAAM,sBAAsB,CAAC;AACjE,OAAO,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAG9C,aAAa;AAEb;;;;GAIG;AACH,MAAM,UAAU,sBAAsB,CAA2B,CAAI;IACjE,MAAM,WAAW,GAAG,KAAK,CAAA;;+BAEE,CAAC,CAAC,KAAK;;KAEjC,CAAC;IAEF,OAAO,IAAI,CAAA;;cAED,WAAW;;;;;;KAMpB,CAAC;AACN,CAAC"}
+{"version":3,"file":"MarqueeElementTemplate.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Marquee/MarqueeElementTemplate.ts"],"names":[],"mappings":"AAAA,6CAA6C;AAC7C,kBAAkB;AAElB,OAAO,EAAuB,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAGjE,aAAa;AAEb;;;;GAIG;AACH,MAAM,UAAU,sBAAsB,CAA2B,CAAI;IACjE,OAAO,IAAI,CAAA;;;+BAGgB,CAAC,CAAC,KAAK;;;;;;;KAOjC,CAAC;AACN,CAAC"}

package/Controls/Components/Primitives/Marquee/Themes/MarqueeElement.Cosmopolitan.js

@@ -13,24 +13,24 @@ import { css } from '../../../../../Dom/Css';
 export function marqueeElementCosmopolitanStyle() {
     return css `
 :host {
+  --marquee-direction: unset;
   --marquee-font-family: unset;
-  --marquee-font-size: unset;
-  --marquee-font-line-height: unset;
-  --marquee-font-weight: unset;
   --marquee-font-letter-spacing: unset;
+  --marquee-font-line-height: unset;
+  --marquee-font-size: unset;
   --marquee-font-text-decoration: unset;
   --marquee-font-text-transform: unset;
-  --marquee-padding-top: unset;
-  --marquee-padding-right: unset;
+  --marquee-font-weight: unset;
+  --marquee-gap: unset;
   --marquee-padding-bottom: unset;
   --marquee-padding-left: unset;
-  --marquee-gap: unset;
+  --marquee-padding-right: unset;
+  --marquee-padding-top: unset;
+  --marquee-speed: unset;
   --marquee-transition-duration: unset;
   --marquee-transition-mode: unset;
   --marquee-transition-property: unset;
   --marquee-translate: unset;
-  --marquee-direction: unset;
-  --marquee-speed: unset;
 }
 
 @media screen and (prefers-reduced-motion: reduce) {

package/Controls/Components/Primitives/Marquee/Themes/MarqueeElement.Joy.js

@@ -13,24 +13,24 @@ import { css } from '../../../../../Dom/Css';
 export function marqueeElementJoyStyle() {
     return css `
 :host {
+  --marquee-direction: normal;
   --marquee-font-family: unset;
-  --marquee-font-size: unset;
-  --marquee-font-line-height: unset;
-  --marquee-font-weight: unset;
   --marquee-font-letter-spacing: unset;
+  --marquee-font-line-height: unset;
+  --marquee-font-size: unset;
   --marquee-font-text-decoration: unset;
   --marquee-font-text-transform: unset;
-  --marquee-padding-top: unset;
-  --marquee-padding-right: unset;
+  --marquee-font-weight: unset;
+  --marquee-gap: unset;
   --marquee-padding-bottom: unset;
   --marquee-padding-left: unset;
-  --marquee-gap: unset;
+  --marquee-padding-right: unset;
+  --marquee-padding-top: unset;
+  --marquee-speed: unset;
   --marquee-transition-duration: unset;
   --marquee-transition-mode: unset;
   --marquee-transition-property: unset;
   --marquee-translate: unset;
-  --marquee-direction: normal;
-  --marquee-speed: unset;
 }
 
 @media screen and (prefers-reduced-motion: reduce) {

package/Controls/Components/Primitives/Marquee/Themes/MarqueeElement.Retro.js

@@ -13,24 +13,24 @@ import { css } from '../../../../../Dom/Css';
 export function marqueeElementRetroStyle() {
     return css `
 :host {
+  --marquee-direction: unset;
   --marquee-font-family: unset;
-  --marquee-font-size: unset;
-  --marquee-font-line-height: unset;
-  --marquee-font-weight: unset;
   --marquee-font-letter-spacing: unset;
+  --marquee-font-line-height: unset;
+  --marquee-font-size: unset;
   --marquee-font-text-decoration: unset;
   --marquee-font-text-transform: unset;
-  --marquee-padding-top: unset;
-  --marquee-padding-right: unset;
+  --marquee-font-weight: unset;
+  --marquee-gap: unset;
   --marquee-padding-bottom: unset;
   --marquee-padding-left: unset;
-  --marquee-gap: unset;
+  --marquee-padding-right: unset;
+  --marquee-padding-top: unset;
+  --marquee-speed: unset;
   --marquee-transition-duration: unset;
   --marquee-transition-mode: unset;
   --marquee-transition-property: unset;
   --marquee-translate: unset;
-  --marquee-direction: unset;
-  --marquee-speed: unset;
 }
 
 @media screen and (prefers-reduced-motion: reduce) {

package/Controls/Components/Primitives/Number/Themes/NumberCounterElement.Cosmopolitan.js

@@ -13,28 +13,28 @@ import { css } from '../../../../../Dom/Css';
 export function numberCounterElementCosmopolitanStyle() {
     return css `
 :host {
+  --number-counter-alignment: unset;
+  --number-counter-duration: unset;
   --number-counter-font-family: unset;
-  --number-counter-font-size: unset;
-  --number-counter-font-line-height: unset;
-  --number-counter-font-weight: unset;
   --number-counter-font-letter-spacing: unset;
+  --number-counter-font-line-height: unset;
+  --number-counter-font-size: unset;
   --number-counter-font-text-decoration: unset;
   --number-counter-font-text-transform: unset;
-  --number-counter-padding-top: unset;
-  --number-counter-padding-right: unset;
+  --number-counter-font-weight: unset;
+  --number-counter-from: unset;
+  --number-counter-gap: unset;
+  --number-counter-n: unset;
   --number-counter-padding-bottom: unset;
   --number-counter-padding-left: unset;
-  --number-counter-gap: unset;
+  --number-counter-padding-right: unset;
+  --number-counter-padding-top: unset;
+  --number-counter-timing: unset;
+  --number-counter-to: unset;
   --number-counter-transition-duration: unset;
   --number-counter-transition-mode: unset;
   --number-counter-transition-property: unset;
   --number-counter-translate: unset;
-  --number-counter-alignment: unset;
-  --number-counter-duration: unset;
-  --number-counter-from: unset;
-  --number-counter-n: unset;
-  --number-counter-timing: unset;
-  --number-counter-to: unset;
 }
 
 @media screen and (prefers-reduced-motion: reduce) {