@universal-material/web 3.7.2 → 3.9.0

package/button/button-base.d.ts

@@ -1,10 +1,17 @@
 import { CSSResultGroup } from '@lit/reactive-element/css-tag';
-import { UmButtonWrapper } from '../shared/button-wrapper.js';
-export declare abstract class UmButtonBase extends UmButtonWrapper {
+import { ButtonWrapper } from '../shared/button-wrapper.js';
+export declare abstract class ButtonBase extends ButtonWrapper {
     #private;
     static readonly formAssociated = true;
     static styles: CSSResultGroup;
+    /**
+     * The button behavior. Mirrors the native `type` attribute and accepts
+     * values like `submit`, `reset` or `button`.
+     */
     type: string;
+    /**
+     * The value submitted with the form when this button is the submitter
+     */
     value: string;
     get form(): HTMLFormElement | null;
     constructor();

package/button/button-base.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button-base.d.ts","sourceRoot":"","sources":["../../src/button/button-base.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAI/D,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAG9D,8BAAsB,YAAa,SAAQ,eAAe;;IAExD,MAAM,CAAC,QAAQ,CAAC,cAAc,QAAQ;IAEtC,OAAgB,MAAM,EAAE,cAAc,CAAoC;IAE9D,IAAI,SAAY;IAEC,KAAK,SAAM;IAExC,IAAI,IAAI,IAAI,eAAe,GAAG,IAAI,CAEjC;;cASkB,YAAY,CAAC,CAAC,EAAE,OAAO,GAAG,IAAI;CA8BlD"}
+{"version":3,"file":"button-base.d.ts","sourceRoot":"","sources":["../../src/button/button-base.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAI/D,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAG5D,8BAAsB,UAAW,SAAQ,aAAa;;IAEpD,MAAM,CAAC,QAAQ,CAAC,cAAc,QAAQ;IAEtC,OAAgB,MAAM,EAAE,cAAc,CAAkC;IAExE;;;OAGG;IACS,IAAI,SAAY;IAE5B;;OAEG;IAC0B,KAAK,SAAM;IAExC,IAAI,IAAI,IAAI,eAAe,GAAG,IAAI,CAEjC;;cASkB,YAAY,CAAC,CAAC,EAAE,OAAO,GAAG,IAAI;CA8BlD"}

package/button/button-base.js

@@ -1,17 +1,24 @@
 import { __decorate } from "tslib";
 import { property } from 'lit/decorators.js';
-import { UmButtonWrapper } from '../shared/button-wrapper.js';
+import { ButtonWrapper } from '../shared/button-wrapper.js';
 import { styles } from './button-base.styles.js';
-export class UmButtonBase extends UmButtonWrapper {
+export class ButtonBase extends ButtonWrapper {
     static { this.formAssociated = true; }
-    static { this.styles = [UmButtonWrapper.styles, styles]; }
+    static { this.styles = [ButtonWrapper.styles, styles]; }
     get form() {
         return this.#elementInternals.form;
     }
     #elementInternals;
     constructor() {
         super();
+        /**
+         * The button behavior. Mirrors the native `type` attribute and accepts
+         * values like `submit`, `reset` or `button`.
+         */
         this.type = 'submit';
+        /**
+         * The value submitted with the form when this button is the submitter
+         */
         this.value = '';
         this.#elementInternals = this.attachInternals();
     }
@@ -39,8 +46,8 @@ export class UmButtonBase extends UmButtonWrapper {
 }
 __decorate([
     property()
-], UmButtonBase.prototype, "type", void 0);
+], ButtonBase.prototype, "type", void 0);
 __decorate([
     property({ reflect: true })
-], UmButtonBase.prototype, "value", void 0);
+], ButtonBase.prototype, "value", void 0);
 //# sourceMappingURL=button-base.js.map

package/button/button-base.js.map

@@ -1 +1 @@
-{"version":3,"file":"button-base.js","sourceRoot":"","sources":["../../src/button/button-base.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAC9D,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEjD,MAAM,OAAgB,YAAa,SAAQ,eAAe;aAExC,mBAAc,GAAG,IAAI,AAAP,CAAQ;aAEtB,WAAM,GAAmB,CAAC,eAAe,CAAC,MAAM,EAAE,MAAM,CAAC,AAAnD,CAAoD;IAM1E,IAAI,IAAI;QACN,OAAO,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC;IACrC,CAAC;IAEQ,iBAAiB,CAAmB;IAE7C;QACE,KAAK,EAAE,CAAC;QAXE,SAAI,GAAG,QAAQ,CAAC;QAEC,UAAK,GAAG,EAAE,CAAC;QAUtC,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;IAClD,CAAC;IAEkB,YAAY,CAAC,CAAU;QAExC,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YAC1C,OAAO;QACT,CAAC;QAED,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YACf,OAAO;QACT,CAAC;QAED,IAAI,CAAC,iBAAiB,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAEhD,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,EAAE,CAAC;YAC1B,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;YAClB,OAAO;QACT,CAAC;QAED,IAAI,CAAC,IAAI,CAAC,gBAAgB,CACxB,QAAQ,EACR,WAAW,CAAC,EAAE;YACZ,MAAM,CAAC,cAAc,CAAC,WAAW,EAAE,WAAW,EAAE;gBAC9C,YAAY,EAAE,IAAI;gBAClB,UAAU,EAAE,IAAI;gBAChB,GAAG,EAAE,GAAG,EAAE,CAAC,IAAI;aAChB,CAAC,CAAC;QACL,CAAC,EACD,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,CAC9B,CAAC;QACF,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC;IAC5B,CAAC;;AA5CW;IAAX,QAAQ,EAAE;0CAAiB;AAEC;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;2CAAY","sourcesContent":["import { CSSResultGroup } from '@lit/reactive-element/css-tag';\n\nimport { property } from 'lit/decorators.js';\n\nimport { UmButtonWrapper } from '../shared/button-wrapper.js';\nimport { styles } from './button-base.styles.js';\n\nexport abstract class UmButtonBase extends UmButtonWrapper {\n\n  static readonly formAssociated = true;\n\n  static override styles: CSSResultGroup = [UmButtonWrapper.styles, styles];\n\n  @property() type = 'submit';\n\n  @property({ reflect: true }) value = '';\n\n  get form(): HTMLFormElement | null {\n    return this.#elementInternals.form;\n  }\n\n  readonly #elementInternals: ElementInternals;\n\n  constructor() {\n    super();\n    this.#elementInternals = this.attachInternals();\n  }\n\n  protected override _handleClick(_: UIEvent): void {\n\n    if (this.type === 'button' || !!this.href) {\n      return;\n    }\n\n    if (!this.form) {\n      return;\n    }\n\n    this.#elementInternals.setFormValue(this.value);\n\n    if (this.type === 'reset') {\n      this.form.reset();\n      return;\n    }\n\n    this.form.addEventListener(\n      'submit',\n      submitEvent => {\n        Object.defineProperty(submitEvent, 'submitter', {\n          configurable: true,\n          enumerable: true,\n          get: () => this,\n        });\n      },\n      { capture: true, once: true },\n    );\n    this.form.requestSubmit();\n  }\n}\n"]}
+{"version":3,"file":"button-base.js","sourceRoot":"","sources":["../../src/button/button-base.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAC5D,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEjD,MAAM,OAAgB,UAAW,SAAQ,aAAa;aAEpC,mBAAc,GAAG,IAAI,AAAP,CAAQ;aAEtB,WAAM,GAAmB,CAAC,aAAa,CAAC,MAAM,EAAE,MAAM,CAAC,AAAjD,CAAkD;IAaxE,IAAI,IAAI;QACN,OAAO,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC;IACrC,CAAC;IAEQ,iBAAiB,CAAmB;IAE7C;QACE,KAAK,EAAE,CAAC;QAlBV;;;WAGG;QACS,SAAI,GAAG,QAAQ,CAAC;QAE5B;;WAEG;QAC0B,UAAK,GAAG,EAAE,CAAC;QAUtC,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;IAClD,CAAC;IAEkB,YAAY,CAAC,CAAU;QAExC,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YAC1C,OAAO;QACT,CAAC;QAED,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YACf,OAAO;QACT,CAAC;QAED,IAAI,CAAC,iBAAiB,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAEhD,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,EAAE,CAAC;YAC1B,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;YAClB,OAAO;QACT,CAAC;QAED,IAAI,CAAC,IAAI,CAAC,gBAAgB,CACxB,QAAQ,EACR,WAAW,CAAC,EAAE;YACZ,MAAM,CAAC,cAAc,CAAC,WAAW,EAAE,WAAW,EAAE;gBAC9C,YAAY,EAAE,IAAI;gBAClB,UAAU,EAAE,IAAI;gBAChB,GAAG,EAAE,GAAG,EAAE,CAAC,IAAI;aAChB,CAAC,CAAC;QACL,CAAC,EACD,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,CAC9B,CAAC;QACF,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC;IAC5B,CAAC;;AA/CW;IAAX,QAAQ,EAAE;wCAAiB;AAKC;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;yCAAY","sourcesContent":["import { CSSResultGroup } from '@lit/reactive-element/css-tag';\n\nimport { property } from 'lit/decorators.js';\n\nimport { ButtonWrapper } from '../shared/button-wrapper.js';\nimport { styles } from './button-base.styles.js';\n\nexport abstract class ButtonBase extends ButtonWrapper {\n\n  static readonly formAssociated = true;\n\n  static override styles: CSSResultGroup = [ButtonWrapper.styles, styles];\n\n  /**\n   * The button behavior. Mirrors the native `type` attribute and accepts\n   * values like `submit`, `reset` or `button`.\n   */\n  @property() type = 'submit';\n\n  /**\n   * The value submitted with the form when this button is the submitter\n   */\n  @property({ reflect: true }) value = '';\n\n  get form(): HTMLFormElement | null {\n    return this.#elementInternals.form;\n  }\n\n  readonly #elementInternals: ElementInternals;\n\n  constructor() {\n    super();\n    this.#elementInternals = this.attachInternals();\n  }\n\n  protected override _handleClick(_: UIEvent): void {\n\n    if (this.type === 'button' || !!this.href) {\n      return;\n    }\n\n    if (!this.form) {\n      return;\n    }\n\n    this.#elementInternals.setFormValue(this.value);\n\n    if (this.type === 'reset') {\n      this.form.reset();\n      return;\n    }\n\n    this.form.addEventListener(\n      'submit',\n      submitEvent => {\n        Object.defineProperty(submitEvent, 'submitter', {\n          configurable: true,\n          enumerable: true,\n          get: () => this,\n        });\n      },\n      { capture: true, once: true },\n    );\n    this.form.requestSubmit();\n  }\n}\n"]}

package/button/button-set.d.ts

@@ -1,5 +1,5 @@
-import { UmSetBase } from '../shared/sets/set-base.js';
-export declare class UmButtonSet extends UmSetBase {
+import { SetBase } from '../shared/sets/set-base.js';
+export declare class ButtonSet extends SetBase {
     static styles: import("lit").CSSResultGroup[];
     /**
      * Whether to render the buttons stacked or not
@@ -9,7 +9,7 @@ export declare class UmButtonSet extends UmSetBase {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        'u-button-set': UmButtonSet;
+        'u-button-set': ButtonSet;
     }
 }
 //# sourceMappingURL=button-set.d.ts.map

package/button/button-set.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button-set.d.ts","sourceRoot":"","sources":["../../src/button/button-set.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAGvD,qBACa,WAAY,SAAQ,SAAS;IAExC,OAAgB,MAAM,iCAA8B;IAEpD;;OAEG;IACyC,KAAK,UAAS;IAEjD,SAAS,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAS;CACxD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,WAAW,CAAC;KAC7B;CACF"}
+{"version":3,"file":"button-set.d.ts","sourceRoot":"","sources":["../../src/button/button-set.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAGrD,qBACa,SAAU,SAAQ,OAAO;IAEpC,OAAgB,MAAM,iCAA4B;IAElD;;OAEG;IACyC,KAAK,UAAS;IAEjD,SAAS,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAS;CACxD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,SAAS,CAAC;KAC3B;CACF"}

package/button/button-set.js

@@ -1,8 +1,8 @@
 import { __decorate } from "tslib";
 import { customElement, property } from 'lit/decorators.js';
-import { UmSetBase } from '../shared/sets/set-base.js';
+import { SetBase } from '../shared/sets/set-base.js';
 import { styles } from './button-set.styles.js';
-let UmButtonSet = class UmButtonSet extends UmSetBase {
+let ButtonSet = class ButtonSet extends SetBase {
     constructor() {
         super(...arguments);
         /**
@@ -11,13 +11,13 @@ let UmButtonSet = class UmButtonSet extends UmSetBase {
         this.stack = false;
         this.alignment = 'end';
     }
-    static { this.styles = [UmSetBase.styles, styles]; }
+    static { this.styles = [SetBase.styles, styles]; }
 };
 __decorate([
     property({ type: Boolean, reflect: true })
-], UmButtonSet.prototype, "stack", void 0);
-UmButtonSet = __decorate([
+], ButtonSet.prototype, "stack", void 0);
+ButtonSet = __decorate([
     customElement('u-button-set')
-], UmButtonSet);
-export { UmButtonSet };
+], ButtonSet);
+export { ButtonSet };
 //# sourceMappingURL=button-set.js.map

package/button/button-set.js.map

@@ -1 +1 @@
-{"version":3,"file":"button-set.js","sourceRoot":"","sources":["../../src/button/button-set.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AACvD,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAGzC,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,SAAS;IAAnC;;QAIL;;WAEG;QACyC,UAAK,GAAG,KAAK,CAAC;QAEjD,cAAS,GAA+B,KAAK,CAAC;IACzD,CAAC;aARiB,WAAM,GAAG,CAAC,SAAS,CAAC,MAAM,EAAE,MAAM,CAAC,AAA7B,CAA8B;;AAKR;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;0CAAe;AAP/C,WAAW;IADvB,aAAa,CAAC,cAAc,CAAC;GACjB,WAAW,CAUvB","sourcesContent":["import { customElement, property } from 'lit/decorators.js';\n\nimport { UmSetBase } from '../shared/sets/set-base.js';\nimport { styles } from './button-set.styles.js';\n\n@customElement('u-button-set')\nexport class UmButtonSet extends UmSetBase {\n\n  static override styles = [UmSetBase.styles, styles];\n\n  /**\n   * Whether to render the buttons stacked or not\n   */\n  @property({ type: Boolean, reflect: true }) stack = false;\n\n  override alignment: 'start' | 'center' | 'end' = 'end';\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-button-set': UmButtonSet;\n  }\n}\n"]}
+{"version":3,"file":"button-set.js","sourceRoot":"","sources":["../../src/button/button-set.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAGzC,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,OAAO;IAA/B;;QAIL;;WAEG;QACyC,UAAK,GAAG,KAAK,CAAC;QAEjD,cAAS,GAA+B,KAAK,CAAC;IACzD,CAAC;aARiB,WAAM,GAAG,CAAC,OAAO,CAAC,MAAM,EAAE,MAAM,CAAC,AAA3B,CAA4B;;AAKN;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;wCAAe;AAP/C,SAAS;IADrB,aAAa,CAAC,cAAc,CAAC;GACjB,SAAS,CAUrB","sourcesContent":["import { customElement, property } from 'lit/decorators.js';\n\nimport { SetBase } from '../shared/sets/set-base.js';\nimport { styles } from './button-set.styles.js';\n\n@customElement('u-button-set')\nexport class ButtonSet extends SetBase {\n\n  static override styles = [SetBase.styles, styles];\n\n  /**\n   * Whether to render the buttons stacked or not\n   */\n  @property({ type: Boolean, reflect: true }) stack = false;\n\n  override alignment: 'start' | 'center' | 'end' = 'end';\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-button-set': ButtonSet;\n  }\n}\n"]}

package/button/button.d.ts

@@ -1,21 +1,24 @@
 import { PropertyValues } from '@lit/reactive-element';
 import { CSSResultGroup } from '@lit/reactive-element/css-tag';
 import { HTMLTemplateResult } from 'lit';
-import { UmToggleButton } from './toggle-button.js';
+import { ToggleButton } from './toggle-button.js';
 import '../ripple/ripple.js';
-export type UmButtonVariant = 'filled' | 'tonal' | 'elevated' | 'outlined' | 'text';
-export type UmButtonColor = 'primary' | 'secondary' | 'tertiary' | 'error';
-export declare class UmButton extends UmToggleButton {
+export type ButtonVariant = 'filled' | 'tonal' | 'elevated' | 'outlined' | 'text';
+export type ButtonColor = 'primary' | 'secondary' | 'tertiary' | 'error';
+export declare class Button extends ToggleButton {
     #private;
     static styles: CSSResultGroup;
     /**
      * The Button variant to render
      */
-    variant: UmButtonVariant;
+    variant: ButtonVariant;
     /**
      * The Button color
      */
-    color: UmButtonColor;
+    color: ButtonColor;
+    /**
+     * Whether the slotted icon is rendered after the label instead of before
+     */
     trailingIcon: boolean;
     private _hasIcon;
     private _hasSelectionLabel;
@@ -28,7 +31,7 @@ export declare class UmButton extends UmToggleButton {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        'u-button': UmButton;
+        'u-button': Button;
     }
 }
 //# sourceMappingURL=button.d.ts.map

package/button/button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/button/button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAE/D,OAAO,EAAQ,kBAAkB,EAAE,MAAM,KAAK,CAAC;AAK/C,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAEpD,OAAO,qBAAqB,CAAC;AAE7B,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG,OAAO,GAAG,UAAU,GAAG,UAAU,GAAG,MAAM,CAAC;AACpF,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,OAAO,CAAC;AAE3E,qBACa,QAAS,SAAQ,cAAc;;IAC1C,OAAgB,MAAM,EAAE,cAAc,CAAmC;IAEzE;;OAEG;IACS,OAAO,EAAE,eAAe,CAAY;IAEhD;;OAEG;IACS,KAAK,EAAE,aAAa,CAAa;IAE2B,YAAY,UAAS;IAEpF,OAAO,CAAC,QAAQ,CAAS;IACzB,OAAO,CAAC,kBAAkB,CAAS;IACnC,iBAAiB,UAAS;IAEF,OAAO,CAAC,QAAQ,CAAC,YAAY,CAAe;IACtD,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAe;IAInD,YAAY,CAAC,iBAAiB,EAAE,cAAc;cAuBpC,oBAAoB,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;cAW/C,cAAc,IAAI,kBAAkB;CAiCxD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,QAAQ,CAAC;KACtB;CACF"}
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/button/button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAE/D,OAAO,EAAQ,kBAAkB,EAAE,MAAM,KAAK,CAAC;AAK/C,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAElD,OAAO,qBAAqB,CAAC;AAE7B,MAAM,MAAM,aAAa,GAAG,QAAQ,GAAG,OAAO,GAAG,UAAU,GAAG,UAAU,GAAG,MAAM,CAAC;AAClF,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,OAAO,CAAC;AAEzE,qBACa,MAAO,SAAQ,YAAY;;IACtC,OAAgB,MAAM,EAAE,cAAc,CAAiC;IAEvE;;OAEG;IACS,OAAO,EAAE,aAAa,CAAY;IAE9C;;OAEG;IACS,KAAK,EAAE,WAAW,CAAa;IAE3C;;OAEG;IACqE,YAAY,UAAS;IAEpF,OAAO,CAAC,QAAQ,CAAS;IACzB,OAAO,CAAC,kBAAkB,CAAS;IACnC,iBAAiB,UAAS;IAEF,OAAO,CAAC,QAAQ,CAAC,YAAY,CAAe;IACtD,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAe;IAInD,YAAY,CAAC,iBAAiB,EAAE,cAAc;cAuBpC,oBAAoB,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;cAW/C,cAAc,IAAI,kBAAkB;CAiCxD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,MAAM,CAAC;KACpB;CACF"}

package/button/button.js

@@ -3,9 +3,9 @@ import { html } from 'lit';
 import { customElement, property, query, state } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
 import { styles } from './button.styles.js';
-import { UmToggleButton } from './toggle-button.js';
+import { ToggleButton } from './toggle-button.js';
 import '../ripple/ripple.js';
-let UmButton = class UmButton extends UmToggleButton {
+let Button = class Button extends ToggleButton {
     constructor() {
         super(...arguments);
         /**
@@ -16,12 +16,15 @@ let UmButton = class UmButton extends UmToggleButton {
          * The Button color
          */
         this.color = 'primary';
+        /**
+         * Whether the slotted icon is rendered after the label instead of before
+         */
         this.trailingIcon = false;
         this._hasIcon = false;
         this._hasSelectionLabel = false;
         this.animateTextChange = false;
     }
-    static { this.styles = [UmToggleButton.styles, styles]; }
+    static { this.styles = [ToggleButton.styles, styles]; }
     #textSizeObserver;
     firstUpdated(changedProperties) {
         super.firstUpdated(changedProperties);
@@ -81,30 +84,30 @@ let UmButton = class UmButton extends UmToggleButton {
 };
 __decorate([
     property()
-], UmButton.prototype, "variant", void 0);
+], Button.prototype, "variant", void 0);
 __decorate([
     property()
-], UmButton.prototype, "color", void 0);
+], Button.prototype, "color", void 0);
 __decorate([
     property({ type: Boolean, attribute: 'trailing-icon', reflect: true })
-], UmButton.prototype, "trailingIcon", void 0);
+], Button.prototype, "trailingIcon", void 0);
 __decorate([
     state()
-], UmButton.prototype, "_hasIcon", void 0);
+], Button.prototype, "_hasIcon", void 0);
 __decorate([
     state()
-], UmButton.prototype, "_hasSelectionLabel", void 0);
+], Button.prototype, "_hasSelectionLabel", void 0);
 __decorate([
     state()
-], UmButton.prototype, "animateTextChange", void 0);
+], Button.prototype, "animateTextChange", void 0);
 __decorate([
     query('.label-container', true)
-], UmButton.prototype, "_textWrapper", void 0);
+], Button.prototype, "_textWrapper", void 0);
 __decorate([
     query('#label', true)
-], UmButton.prototype, "_text", void 0);
-UmButton = __decorate([
+], Button.prototype, "_text", void 0);
+Button = __decorate([
     customElement('u-button')
-], UmButton);
-export { UmButton };
+], Button);
+export { Button };
 //# sourceMappingURL=button.js.map

package/button/button.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.js","sourceRoot":"","sources":["../../src/button/button.ts"],"names":[],"mappings":"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","sourcesContent":["import { PropertyValues } from '@lit/reactive-element';\nimport { CSSResultGroup } from '@lit/reactive-element/css-tag';\n\nimport { html, HTMLTemplateResult } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\n\nimport { styles } from './button.styles.js';\nimport { UmToggleButton } from './toggle-button.js';\n\nimport '../ripple/ripple.js';\n\nexport type UmButtonVariant = 'filled' | 'tonal' | 'elevated' | 'outlined' | 'text';\nexport type UmButtonColor = 'primary' | 'secondary' | 'tertiary' | 'error';\n\n@customElement('u-button')\nexport class UmButton extends UmToggleButton {\n  static override styles: CSSResultGroup = [UmToggleButton.styles, styles];\n\n  /**\n   * The Button variant to render\n   */\n  @property() variant: UmButtonVariant = 'filled';\n\n  /**\n   * The Button color\n   */\n  @property() color: UmButtonColor = 'primary';\n\n  @property({ type: Boolean, attribute: 'trailing-icon', reflect: true }) trailingIcon = false;\n\n  @state() private _hasIcon = false;\n  @state() private _hasSelectionLabel = false;\n  @state() animateTextChange = false;\n\n  @query('.label-container', true) private readonly _textWrapper!: HTMLElement;\n  @query('#label', true) private readonly _text!: HTMLElement;\n\n  #textSizeObserver!: ResizeObserver | null;\n\n  override firstUpdated(changedProperties: PropertyValues) {\n    super.firstUpdated(changedProperties);\n\n    this.#textSizeObserver = new ResizeObserver(() => this.#setTextWrapperWidth());\n    this.#textSizeObserver.observe(this._text);\n    this.#setTextWrapperWidth();\n  }\n\n  #setTextWrapperWidth(): void {\n\n    const width = `${this._text.offsetWidth}px`;\n    this._textWrapper.style.width = width;\n\n    const animateTextChange = !!parseInt(width, 10);\n\n    if (this.animateTextChange === animateTextChange) {\n      return;\n    }\n\n    setTimeout(() =>\n      this.animateTextChange = animateTextChange);\n  }\n\n  protected override _getContainerClasses(): Record<string, boolean> {\n    return {\n      ...super._getContainerClasses(),\n      [this.color]: true,\n      [this.variant]: true,\n      'trailing-icon': this.trailingIcon,\n      'has-icon': this._hasIcon,\n      'has-selection-label': this._hasSelectionLabel,\n    };\n  }\n\n  protected override _renderContent(): HTMLTemplateResult {\n    const labelContainerClasses = { animate: this.animateTextChange };\n\n    return html`\n      <span class=\"icon-container\" aria-hidden=\"true\">\n        <span class=\"icon icon-default\">\n          <slot name=\"icon\" @slotchange=\"${this.#handleIconSlotChange}\"></slot>\n        </span>\n        <span class=\"icon icon-selected\">\n          <slot name=\"icon-selected\" @slotchange=\"${this._handleSelectedIconSlotChange}\"></slot>\n        </span>\n      </span>\n\n      <span class=\"label-container ${classMap(labelContainerClasses)}\">\n        <span id=\"label\">\n          <span class=\"label label-default\">\n            <slot></slot>\n          </span>\n          <span class=\"label label-selected\">\n            <slot name=\"label-selected\" @slotchange=\"${this.#handleSelectedLabelSlotChange}\"></slot>\n          </span>\n        </span>\n      </span>\n    `;\n  }\n\n  #handleIconSlotChange(e: Event) {\n    this._hasIcon = (e.target as HTMLSlotElement).assignedElements({ flatten: true }).length > 0;\n  }\n\n  #handleSelectedLabelSlotChange(e: Event): void {\n    this._hasSelectionLabel = (e.target as HTMLSlotElement).assignedElements({ flatten: true }).length > 0;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-button': UmButton;\n  }\n}\n"]}
+{"version":3,"file":"button.js","sourceRoot":"","sources":["../../src/button/button.ts"],"names":[],"mappings":"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","sourcesContent":["import { PropertyValues } from '@lit/reactive-element';\nimport { CSSResultGroup } from '@lit/reactive-element/css-tag';\n\nimport { html, HTMLTemplateResult } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\n\nimport { styles } from './button.styles.js';\nimport { ToggleButton } from './toggle-button.js';\n\nimport '../ripple/ripple.js';\n\nexport type ButtonVariant = 'filled' | 'tonal' | 'elevated' | 'outlined' | 'text';\nexport type ButtonColor = 'primary' | 'secondary' | 'tertiary' | 'error';\n\n@customElement('u-button')\nexport class Button extends ToggleButton {\n  static override styles: CSSResultGroup = [ToggleButton.styles, styles];\n\n  /**\n   * The Button variant to render\n   */\n  @property() variant: ButtonVariant = 'filled';\n\n  /**\n   * The Button color\n   */\n  @property() color: ButtonColor = 'primary';\n\n  /**\n   * Whether the slotted icon is rendered after the label instead of before\n   */\n  @property({ type: Boolean, attribute: 'trailing-icon', reflect: true }) trailingIcon = false;\n\n  @state() private _hasIcon = false;\n  @state() private _hasSelectionLabel = false;\n  @state() animateTextChange = false;\n\n  @query('.label-container', true) private readonly _textWrapper!: HTMLElement;\n  @query('#label', true) private readonly _text!: HTMLElement;\n\n  #textSizeObserver!: ResizeObserver | null;\n\n  override firstUpdated(changedProperties: PropertyValues) {\n    super.firstUpdated(changedProperties);\n\n    this.#textSizeObserver = new ResizeObserver(() => this.#setTextWrapperWidth());\n    this.#textSizeObserver.observe(this._text);\n    this.#setTextWrapperWidth();\n  }\n\n  #setTextWrapperWidth(): void {\n\n    const width = `${this._text.offsetWidth}px`;\n    this._textWrapper.style.width = width;\n\n    const animateTextChange = !!parseInt(width, 10);\n\n    if (this.animateTextChange === animateTextChange) {\n      return;\n    }\n\n    setTimeout(() =>\n      this.animateTextChange = animateTextChange);\n  }\n\n  protected override _getContainerClasses(): Record<string, boolean> {\n    return {\n      ...super._getContainerClasses(),\n      [this.color]: true,\n      [this.variant]: true,\n      'trailing-icon': this.trailingIcon,\n      'has-icon': this._hasIcon,\n      'has-selection-label': this._hasSelectionLabel,\n    };\n  }\n\n  protected override _renderContent(): HTMLTemplateResult {\n    const labelContainerClasses = { animate: this.animateTextChange };\n\n    return html`\n      <span class=\"icon-container\" aria-hidden=\"true\">\n        <span class=\"icon icon-default\">\n          <slot name=\"icon\" @slotchange=\"${this.#handleIconSlotChange}\"></slot>\n        </span>\n        <span class=\"icon icon-selected\">\n          <slot name=\"icon-selected\" @slotchange=\"${this._handleSelectedIconSlotChange}\"></slot>\n        </span>\n      </span>\n\n      <span class=\"label-container ${classMap(labelContainerClasses)}\">\n        <span id=\"label\">\n          <span class=\"label label-default\">\n            <slot></slot>\n          </span>\n          <span class=\"label label-selected\">\n            <slot name=\"label-selected\" @slotchange=\"${this.#handleSelectedLabelSlotChange}\"></slot>\n          </span>\n        </span>\n      </span>\n    `;\n  }\n\n  #handleIconSlotChange(e: Event) {\n    this._hasIcon = (e.target as HTMLSlotElement).assignedElements({ flatten: true }).length > 0;\n  }\n\n  #handleSelectedLabelSlotChange(e: Event): void {\n    this._hasSelectionLabel = (e.target as HTMLSlotElement).assignedElements({ flatten: true }).length > 0;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-button': Button;\n  }\n}\n"]}

package/button/fab-menu-color-context.d.ts

@@ -1,5 +1,5 @@
-import { UmFabColor } from './fab.js';
+import { FabColor } from './fab.js';
 export declare const fabMenuColorContext: {
-    __context__: UmFabColor;
+    __context__: FabColor;
 };
 //# sourceMappingURL=fab-menu-color-context.d.ts.map

package/button/fab-menu-color-context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"fab-menu-color-context.d.ts","sourceRoot":"","sources":["../../src/button/fab-menu-color-context.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAEtC,eAAO,MAAM,mBAAmB;;CAA2D,CAAC"}
+{"version":3,"file":"fab-menu-color-context.d.ts","sourceRoot":"","sources":["../../src/button/fab-menu-color-context.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AAEpC,eAAO,MAAM,mBAAmB;;CAAyD,CAAC"}

package/button/fab-menu-color-context.js.map

@@ -1 +1 @@
-{"version":3,"file":"fab-menu-color-context.js","sourceRoot":"","sources":["../../src/button/fab-menu-color-context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAI7C,MAAM,CAAC,MAAM,mBAAmB,GAAG,aAAa,CAAa,MAAM,CAAC,qBAAqB,CAAC,CAAC,CAAC","sourcesContent":["import { createContext } from '@lit/context';\n\nimport { UmFabColor } from './fab.js';\n\nexport const fabMenuColorContext = createContext<UmFabColor>(Symbol('fabMenuColorContext'));\n"]}
+{"version":3,"file":"fab-menu-color-context.js","sourceRoot":"","sources":["../../src/button/fab-menu-color-context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAI7C,MAAM,CAAC,MAAM,mBAAmB,GAAG,aAAa,CAAW,MAAM,CAAC,qBAAqB,CAAC,CAAC,CAAC","sourcesContent":["import { createContext } from '@lit/context';\n\nimport { FabColor } from './fab.js';\n\nexport const fabMenuColorContext = createContext<FabColor>(Symbol('fabMenuColorContext'));\n"]}

package/button/fab-menu-item.d.ts

@@ -1,6 +1,6 @@
 import { HTMLTemplateResult } from 'lit';
-import { UmButtonBase } from './button-base.js';
-export declare class UmFabMenuItem extends UmButtonBase {
+import { ButtonBase } from './button-base.js';
+export declare class FabMenuItem extends ButtonBase {
     #private;
     static styles: import("lit").CSSResultGroup[];
     private readonly _color;
@@ -17,7 +17,7 @@ export declare class UmFabMenuItem extends UmButtonBase {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        'u-fab-menu-item': UmFabMenuItem;
+        'u-fab-menu-item': FabMenuItem;
     }
 }
 //# sourceMappingURL=fab-menu-item.d.ts.map

package/button/fab-menu-item.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"fab-menu-item.d.ts","sourceRoot":"","sources":["../../src/button/fab-menu-item.ts"],"names":[],"mappings":"AAEA,OAAO,EAAQ,kBAAkB,EAAE,MAAM,KAAK,CAAC;AAG/C,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAMhD,qBACa,aAAc,SAAQ,YAAY;;IAE7C,OAAgB,MAAM,iCAAiC;IAKvD,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAc;IAIrC,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAW;IAErC;;OAEG;IACS,KAAK,EAAE,MAAM,GAAG,IAAI,CAAQ;IAE/B,OAAO,CAAC,QAAQ,CAAS;IAElC,IACI,MAAM,WAET;IAED,IAAI,MAAM,CAAC,KAAK,QAAA,EAGf;cAEkB,oBAAoB,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;cAS/C,cAAc,IAAI,kBAAkB;CAaxD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,aAAa,CAAC;KAClC;CACF"}
+{"version":3,"file":"fab-menu-item.d.ts","sourceRoot":"","sources":["../../src/button/fab-menu-item.ts"],"names":[],"mappings":"AAEA,OAAO,EAAQ,kBAAkB,EAAE,MAAM,KAAK,CAAC;AAG/C,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAM9C,qBACa,WAAY,SAAQ,UAAU;;IAEzC,OAAgB,MAAM,iCAA+B;IAKrD,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAY;IAInC,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAW;IAErC;;OAEG;IACS,KAAK,EAAE,MAAM,GAAG,IAAI,CAAQ;IAE/B,OAAO,CAAC,QAAQ,CAAS;IAElC,IACI,MAAM,WAET;IAED,IAAI,MAAM,CAAC,KAAK,QAAA,EAGf;cAEkB,oBAAoB,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;cAS/C,cAAc,IAAI,kBAAkB;CAaxD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,WAAW,CAAC;KAChC;CACF"}

package/button/fab-menu-item.js

@@ -2,11 +2,11 @@ import { __decorate } from "tslib";
 import { consume } from '@lit/context';
 import { html } from 'lit';
 import { customElement, property, state } from 'lit/decorators.js';
-import { UmButtonBase } from './button-base.js';
+import { ButtonBase } from './button-base.js';
 import { fabMenuColorContext } from './fab-menu-color-context.js';
 import { styles } from './fab-menu-item.styles.js';
 import { fabMenuOpenContext } from './fab-menu-open-context.js';
-let UmFabMenuItem = class UmFabMenuItem extends UmButtonBase {
+let FabMenuItem = class FabMenuItem extends ButtonBase {
     constructor() {
         super(...arguments);
         this.#index = 0;
@@ -16,7 +16,7 @@ let UmFabMenuItem = class UmFabMenuItem extends UmButtonBase {
         this.label = null;
         this._hasIcon = false;
     }
-    static { this.styles = [UmButtonBase.styles, styles]; }
+    static { this.styles = [ButtonBase.styles, styles]; }
     #index;
     get _index() {
         return this.#index;
@@ -49,22 +49,22 @@ let UmFabMenuItem = class UmFabMenuItem extends UmButtonBase {
 __decorate([
     consume({ context: fabMenuColorContext, subscribe: true }),
     state()
-], UmFabMenuItem.prototype, "_color", void 0);
+], FabMenuItem.prototype, "_color", void 0);
 __decorate([
     consume({ context: fabMenuOpenContext, subscribe: true }),
     state()
-], UmFabMenuItem.prototype, "_menuOpen", void 0);
+], FabMenuItem.prototype, "_menuOpen", void 0);
 __decorate([
     property()
-], UmFabMenuItem.prototype, "label", void 0);
+], FabMenuItem.prototype, "label", void 0);
 __decorate([
     state()
-], UmFabMenuItem.prototype, "_hasIcon", void 0);
+], FabMenuItem.prototype, "_hasIcon", void 0);
 __decorate([
     state()
-], UmFabMenuItem.prototype, "_index", null);
-UmFabMenuItem = __decorate([
+], FabMenuItem.prototype, "_index", null);
+FabMenuItem = __decorate([
     customElement('u-fab-menu-item')
-], UmFabMenuItem);
-export { UmFabMenuItem };
+], FabMenuItem);
+export { FabMenuItem };
 //# sourceMappingURL=fab-menu-item.js.map

package/button/fab-menu-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"fab-menu-item.js","sourceRoot":"","sources":["../../src/button/fab-menu-item.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,IAAI,EAAsB,MAAM,KAAK,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAEnE,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAChD,OAAO,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;AAClE,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACnD,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAIzD,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,YAAY;IAAxC;;QAGL,WAAM,GAAG,CAAC,CAAC;QAUX;;WAEG;QACS,UAAK,GAAkB,IAAI,CAAC;QAEvB,aAAQ,GAAG,KAAK,CAAC;IAkCpC,CAAC;aAlDiB,WAAM,GAAG,CAAC,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC,AAAhC,CAAiC;IACvD,MAAM,CAAK;IAkBX,IAAI,MAAM;QACR,OAAO,IAAI,CAAC,MAAM,CAAC;IACrB,CAAC;IAED,IAAI,MAAM,CAAC,KAAK;QACd,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACpB,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,8BAA8B,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC;IAC3E,CAAC;IAEkB,oBAAoB;QACrC,OAAO;YACL,GAAG,KAAK,CAAC,oBAAoB,EAAE;YAC/B,IAAI,EAAE,IAAI,CAAC,SAAS;YACpB,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,IAAI;YACnB,UAAU,EAAE,IAAI,CAAC,QAAQ;SAC1B,CAAC;IACJ,CAAC;IAEkB,cAAc;QAC/B,OAAO,IAAI,CAAA;;;4BAGa,IAAI,CAAC,qBAAqB;;4BAE1B,IAAI,CAAC,KAAK;KACjC,CAAC;IACJ,CAAC;IAED,qBAAqB,CAAC,CAAQ;QAC5B,IAAI,CAAC,QAAQ,GAAI,CAAC,CAAC,MAA0B,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;IAC/F,CAAC;;AA5CgB;IAFhB,OAAO,CAAC,EAAE,OAAO,EAAE,mBAAmB,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IAC1D,KAAK,EAAE;6CAC6B;AAIpB;IAFhB,OAAO,CAAC,EAAE,OAAO,EAAE,kBAAkB,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IACzD,KAAK,EAAE;gDAC6B;AAKzB;IAAX,QAAQ,EAAE;4CAA6B;AAEvB;IAAhB,KAAK,EAAE;+CAA0B;AAGlC;IADC,KAAK,EAAE;2CAGP;AAvBU,aAAa;IADzB,aAAa,CAAC,iBAAiB,CAAC;GACpB,aAAa,CAoDzB","sourcesContent":["import { consume } from '@lit/context';\n\nimport { html, HTMLTemplateResult } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\n\nimport { UmButtonBase } from './button-base.js';\nimport { fabMenuColorContext } from './fab-menu-color-context.js';\nimport { styles } from './fab-menu-item.styles.js';\nimport { fabMenuOpenContext } from './fab-menu-open-context.js';\nimport { UmFabColor } from './fab.js';\n\n@customElement('u-fab-menu-item')\nexport class UmFabMenuItem extends UmButtonBase {\n\n  static override styles = [UmButtonBase.styles, styles];\n  #index = 0;\n\n  @consume({ context: fabMenuColorContext, subscribe: true })\n  @state()\n  private readonly _color!: UmFabColor;\n\n  @consume({ context: fabMenuOpenContext, subscribe: true })\n  @state()\n  private readonly _menuOpen!: boolean;\n\n  /**\n   * The text to display the FAB menu item.\n   */\n  @property() label: string | null = null;\n\n  @state() private _hasIcon = false;\n\n  @state()\n  get _index() {\n    return this.#index;\n  }\n\n  set _index(value) {\n    this.#index = value;\n    this.style.setProperty('--_animation-delay-increment', value.toString());\n  }\n\n  protected override _getContainerClasses(): Record<string, boolean> {\n    return {\n      ...super._getContainerClasses(),\n      open: this._menuOpen,\n      [this._color]: true,\n      'has-icon': this._hasIcon,\n    };\n  }\n\n  protected override _renderContent(): HTMLTemplateResult {\n    return html`\n      <span class=\"clipper\"></span>\n      <span class=\"icon\" aria-hidden=\"true\">\n        <slot @slotchange=${this.#handleIconSlotChange}></slot>\n      </span>\n      <span class=\"label\">${this.label}</span>\n    `;\n  }\n\n  #handleIconSlotChange(e: Event) {\n    this._hasIcon = (e.target as HTMLSlotElement).assignedElements({ flatten: true }).length > 0;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-fab-menu-item': UmFabMenuItem;\n  }\n}\n"]}
+{"version":3,"file":"fab-menu-item.js","sourceRoot":"","sources":["../../src/button/fab-menu-item.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,IAAI,EAAsB,MAAM,KAAK,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAEnE,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;AAClE,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACnD,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAIzD,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,UAAU;IAApC;;QAGL,WAAM,GAAG,CAAC,CAAC;QAUX;;WAEG;QACS,UAAK,GAAkB,IAAI,CAAC;QAEvB,aAAQ,GAAG,KAAK,CAAC;IAkCpC,CAAC;aAlDiB,WAAM,GAAG,CAAC,UAAU,CAAC,MAAM,EAAE,MAAM,CAAC,AAA9B,CAA+B;IACrD,MAAM,CAAK;IAkBX,IAAI,MAAM;QACR,OAAO,IAAI,CAAC,MAAM,CAAC;IACrB,CAAC;IAED,IAAI,MAAM,CAAC,KAAK;QACd,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACpB,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,8BAA8B,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC;IAC3E,CAAC;IAEkB,oBAAoB;QACrC,OAAO;YACL,GAAG,KAAK,CAAC,oBAAoB,EAAE;YAC/B,IAAI,EAAE,IAAI,CAAC,SAAS;YACpB,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,IAAI;YACnB,UAAU,EAAE,IAAI,CAAC,QAAQ;SAC1B,CAAC;IACJ,CAAC;IAEkB,cAAc;QAC/B,OAAO,IAAI,CAAA;;;4BAGa,IAAI,CAAC,qBAAqB;;4BAE1B,IAAI,CAAC,KAAK;KACjC,CAAC;IACJ,CAAC;IAED,qBAAqB,CAAC,CAAQ;QAC5B,IAAI,CAAC,QAAQ,GAAI,CAAC,CAAC,MAA0B,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;IAC/F,CAAC;;AA5CgB;IAFhB,OAAO,CAAC,EAAE,OAAO,EAAE,mBAAmB,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IAC1D,KAAK,EAAE;2CAC2B;AAIlB;IAFhB,OAAO,CAAC,EAAE,OAAO,EAAE,kBAAkB,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IACzD,KAAK,EAAE;8CAC6B;AAKzB;IAAX,QAAQ,EAAE;0CAA6B;AAEvB;IAAhB,KAAK,EAAE;6CAA0B;AAGlC;IADC,KAAK,EAAE;yCAGP;AAvBU,WAAW;IADvB,aAAa,CAAC,iBAAiB,CAAC;GACpB,WAAW,CAoDvB","sourcesContent":["import { consume } from '@lit/context';\n\nimport { html, HTMLTemplateResult } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\n\nimport { ButtonBase } from './button-base.js';\nimport { fabMenuColorContext } from './fab-menu-color-context.js';\nimport { styles } from './fab-menu-item.styles.js';\nimport { fabMenuOpenContext } from './fab-menu-open-context.js';\nimport { FabColor } from './fab.js';\n\n@customElement('u-fab-menu-item')\nexport class FabMenuItem extends ButtonBase {\n\n  static override styles = [ButtonBase.styles, styles];\n  #index = 0;\n\n  @consume({ context: fabMenuColorContext, subscribe: true })\n  @state()\n  private readonly _color!: FabColor;\n\n  @consume({ context: fabMenuOpenContext, subscribe: true })\n  @state()\n  private readonly _menuOpen!: boolean;\n\n  /**\n   * The text to display the FAB menu item.\n   */\n  @property() label: string | null = null;\n\n  @state() private _hasIcon = false;\n\n  @state()\n  get _index() {\n    return this.#index;\n  }\n\n  set _index(value) {\n    this.#index = value;\n    this.style.setProperty('--_animation-delay-increment', value.toString());\n  }\n\n  protected override _getContainerClasses(): Record<string, boolean> {\n    return {\n      ...super._getContainerClasses(),\n      open: this._menuOpen,\n      [this._color]: true,\n      'has-icon': this._hasIcon,\n    };\n  }\n\n  protected override _renderContent(): HTMLTemplateResult {\n    return html`\n      <span class=\"clipper\"></span>\n      <span class=\"icon\" aria-hidden=\"true\">\n        <slot @slotchange=${this.#handleIconSlotChange}></slot>\n      </span>\n      <span class=\"label\">${this.label}</span>\n    `;\n  }\n\n  #handleIconSlotChange(e: Event) {\n    this._hasIcon = (e.target as HTMLSlotElement).assignedElements({ flatten: true }).length > 0;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-fab-menu-item': FabMenuItem;\n  }\n}\n"]}

package/button/fab-menu.d.ts

@@ -1,26 +1,41 @@
 import { HTMLTemplateResult, LitElement } from 'lit';
-import { UmFabColor, UmFabSize } from './fab.js';
-export declare class UmFabMenu extends LitElement {
+import { FabColor, FabSize } from './fab.js';
+export declare class FabMenu extends LitElement {
     #private;
     static styles: import("lit").CSSResult[];
     /**
      * The FAB color variant to render.
      */
-    color: UmFabColor;
+    color: FabColor;
     /**
      * The size of the FAB.
      */
-    size: UmFabSize;
+    size: FabSize;
     /**
      * Lowers the FAB's elevation.
      */
     lowered: boolean;
     open: boolean;
+    /**
+     * The element the FAB menu will observe for scroll. Accepts an
+     * `HTMLElement`, the id of an element, `'window'` to use the window
+     * scroll, or `'none'` to disable. When unset, the FAB menu consumes the
+     * scroll container provided by an ancestor `u-scaffold` via context,
+     * falling back to `'window'`. Reserved for future scroll-driven behaviors.
+     */
+    scrollContainer: 'none' | 'window' | string | HTMLElement | undefined;
+    protected readonly _scrollContainerFromContext: HTMLElement | undefined;
+    /**
+     * The resolved scroll target according to the precedence
+     * explicit > context > window. Returns `null` when the explicit value
+     * is `'none'`.
+     */
+    protected get _effectiveScrollContainer(): HTMLElement | Window | null;
     protected render(): HTMLTemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {
-        'u-fab-menu': UmFabMenu;
+        'u-fab-menu': FabMenu;
     }
 }
 //# sourceMappingURL=fab-menu.d.ts.map

package/button/fab-menu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"fab-menu.d.ts","sourceRoot":"","sources":["../../src/button/fab-menu.ts"],"names":[],"mappings":"AAEA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAQ3D,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAEjD,qBACa,SAAU,SAAQ,UAAU;;IAEvC,OAAgB,MAAM,4BAAY;IAElC;;OAEG;IAGH,KAAK,EAAE,UAAU,CAAa;IAE9B;;OAEG;IACS,IAAI,EAAE,SAAS,CAAY;IAEvC;;OAEG;IACyC,OAAO,UAAS;IAI5D,IAAI,UAAS;cAEM,MAAM,IAAI,kBAAkB;CAmDhD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,YAAY,EAAE,SAAS,CAAC;KACzB;CACF"}
+{"version":3,"file":"fab-menu.d.ts","sourceRoot":"","sources":["../../src/button/fab-menu.ts"],"names":[],"mappings":"AAEA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAS3D,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAE7C,qBACa,OAAQ,SAAQ,UAAU;;IAErC,OAAgB,MAAM,4BAAY;IAElC;;OAEG;IAGH,KAAK,EAAE,QAAQ,CAAa;IAE5B;;OAEG;IACS,IAAI,EAAE,OAAO,CAAY;IAErC;;OAEG;IACyC,OAAO,UAAS;IAI5D,IAAI,UAAS;IAEb;;;;;;OAMG;IAEH,eAAe,EAAE,MAAM,GAAG,QAAQ,GAAG,MAAM,GAAG,WAAW,GAAG,SAAS,CAAa;IAIlF,SAAS,CAAC,QAAQ,CAAC,2BAA2B,EAAG,WAAW,GAAG,SAAS,CAAC;IAEzE;;;;OAIG;IACH,SAAS,KAAK,yBAAyB,IAAI,WAAW,GAAG,MAAM,GAAG,IAAI,CAoBrE;cAEkB,MAAM,IAAI,kBAAkB;CAmDhD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,YAAY,EAAE,OAAO,CAAC;KACvB;CACF"}

package/button/fab-menu.js

@@ -1,13 +1,14 @@
 import { __decorate } from "tslib";
-import { provide } from '@lit/context';
+import { consume, provide } from '@lit/context';
 import { html, LitElement } from 'lit';
 import { customElement, property, state } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
+import { scrollContainerContext } from '../scaffold/scroll-container-context.js';
 import { fabMenuColorContext } from './fab-menu-color-context.js';
-import { UmFabMenuItem } from './fab-menu-item.js';
+import { FabMenuItem } from './fab-menu-item.js';
 import { fabMenuOpenContext } from './fab-menu-open-context.js';
 import { styles } from './fab-menu.styles.js';
-let UmFabMenu = class UmFabMenu extends LitElement {
+let FabMenu = class FabMenu extends LitElement {
     constructor() {
         super(...arguments);
         /**
@@ -23,8 +24,37 @@ let UmFabMenu = class UmFabMenu extends LitElement {
          */
         this.lowered = false;
         this.open = false;
+        /**
+         * The element the FAB menu will observe for scroll. Accepts an
+         * `HTMLElement`, the id of an element, `'window'` to use the window
+         * scroll, or `'none'` to disable. When unset, the FAB menu consumes the
+         * scroll container provided by an ancestor `u-scaffold` via context,
+         * falling back to `'window'`. Reserved for future scroll-driven behaviors.
+         */
+        this.scrollContainer = undefined;
     }
     static { this.styles = [styles]; }
+    /**
+     * The resolved scroll target according to the precedence
+     * explicit > context > window. Returns `null` when the explicit value
+     * is `'none'`.
+     */
+    get _effectiveScrollContainer() {
+        const explicit = this.scrollContainer;
+        if (explicit === 'none') {
+            return null;
+        }
+        if (explicit instanceof HTMLElement) {
+            return explicit;
+        }
+        if (typeof explicit === 'string' && explicit.length > 0) {
+            if (explicit === 'window') {
+                return window;
+            }
+            return document.getElementById(explicit);
+        }
+        return this._scrollContainerFromContext ?? window;
+    }
     render() {
         const containerClasses = classMap({
             open: this.open,
@@ -66,7 +96,7 @@ let UmFabMenu = class UmFabMenu extends LitElement {
     #handleIconItemsSlotChange(event) {
         const elements = event.target.assignedElements({ flatten: true });
         let index = 0;
-        for (const element of elements.filter(e => e instanceof UmFabMenuItem).reverse()) {
+        for (const element of elements.filter(e => e instanceof FabMenuItem).reverse()) {
             element._index = index;
             index++;
         }
@@ -75,19 +105,26 @@ let UmFabMenu = class UmFabMenu extends LitElement {
 __decorate([
     provide({ context: fabMenuColorContext }),
     property()
-], UmFabMenu.prototype, "color", void 0);
+], FabMenu.prototype, "color", void 0);
 __decorate([
     property()
-], UmFabMenu.prototype, "size", void 0);
+], FabMenu.prototype, "size", void 0);
 __decorate([
     property({ type: Boolean, reflect: true })
-], UmFabMenu.prototype, "lowered", void 0);
+], FabMenu.prototype, "lowered", void 0);
 __decorate([
     provide({ context: fabMenuOpenContext }),
     state()
-], UmFabMenu.prototype, "open", void 0);
-UmFabMenu = __decorate([
+], FabMenu.prototype, "open", void 0);
+__decorate([
+    property({ attribute: 'scroll-container' })
+], FabMenu.prototype, "scrollContainer", void 0);
+__decorate([
+    consume({ context: scrollContainerContext, subscribe: true }),
+    state()
+], FabMenu.prototype, "_scrollContainerFromContext", void 0);
+FabMenu = __decorate([
     customElement('u-fab-menu')
-], UmFabMenu);
-export { UmFabMenu };
+], FabMenu);
+export { FabMenu };
 //# sourceMappingURL=fab-menu.js.map

package/button/fab-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"fab-menu.js","sourceRoot":"","sources":["../../src/button/fab-menu.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,IAAI,EAAsB,UAAU,EAAE,MAAM,KAAK,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAEvD,OAAO,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;AAClE,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAIvC,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,UAAU;IAAlC;;QAIL;;WAEG;QAGH,UAAK,GAAe,SAAS,CAAC;QAE9B;;WAEG;QACS,SAAI,GAAc,QAAQ,CAAC;QAEvC;;WAEG;QACyC,YAAO,GAAG,KAAK,CAAC;QAI5D,SAAI,GAAG,KAAK,CAAC;IAqDf,CAAC;aA1EiB,WAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;IAuBf,MAAM;QACvB,MAAM,gBAAgB,GAAG,QAAQ,CAAC;YAChC,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,IAAI;SACnB,CAAC,CAAC;QAEH,OAAO,IAAI,CAAA;8BACe,gBAAgB;;8BAEhB,IAAI,CAAC,0BAA0B;;gDAEb,IAAI,CAAC,IAAI;;;qBAGpC,IAAI,CAAC,KAAK;uBACR,IAAI,CAAC,OAAO;oBACf,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI;qBAC/B,IAAI,CAAC,OAAO;;;;;;;;;;;;;;;;;KAiB5B,CAAC;IACJ,CAAC;IAED,OAAO;QACL,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC;IACzB,CAAC;IAED,0BAA0B,CAAC,KAAY;QACrC,MAAM,QAAQ,GAAI,KAAK,CAAC,MAA0B,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;QAEvF,IAAI,KAAK,GAAG,CAAC,CAAC;QAEd,KAAK,MAAM,OAAO,IAAI,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,YAAY,aAAa,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC;YACjF,OAAO,CAAC,MAAM,GAAG,KAAK,CAAC;YACvB,KAAK,EAAE,CAAC;QACV,CAAC;IACH,CAAC;;AAlED;IAFC,OAAO,CAAC,EAAE,OAAO,EAAE,mBAAmB,EAAE,CAAC;IACzC,QAAQ,EAAE;wCACmB;AAKlB;IAAX,QAAQ,EAAE;uCAA4B;AAKK;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;0CAAiB;AAI5D;IAFC,OAAO,CAAC,EAAE,OAAO,EAAE,kBAAkB,EAAE,CAAC;IACxC,KAAK,EAAE;uCACK;AAvBF,SAAS;IADrB,aAAa,CAAC,YAAY,CAAC;GACf,SAAS,CA4ErB","sourcesContent":["import { provide } from '@lit/context';\n\nimport { html, HTMLTemplateResult, LitElement } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\n\nimport { fabMenuColorContext } from './fab-menu-color-context.js';\nimport { UmFabMenuItem } from './fab-menu-item.js';\nimport { fabMenuOpenContext } from './fab-menu-open-context.js';\nimport { styles } from './fab-menu.styles.js';\nimport { UmFabColor, UmFabSize } from './fab.js';\n\n@customElement('u-fab-menu')\nexport class UmFabMenu extends LitElement {\n\n  static override styles = [styles];\n\n  /**\n   * The FAB color variant to render.\n   */\n  @provide({ context: fabMenuColorContext })\n  @property()\n  color: UmFabColor = 'primary';\n\n  /**\n   * The size of the FAB.\n   */\n  @property() size: UmFabSize = 'medium';\n\n  /**\n   * Lowers the FAB's elevation.\n   */\n  @property({ type: Boolean, reflect: true }) lowered = false;\n\n  @provide({ context: fabMenuOpenContext })\n  @state()\n  open = false;\n\n  protected override render(): HTMLTemplateResult {\n    const containerClasses = classMap({\n      open: this.open,\n      [this.color]: true,\n    });\n\n    return html`\n      <div class=\"container ${containerClasses}\">\n        <div class=\"menu-items\">\n          <slot @slotchange=${this.#handleIconItemsSlotChange}></slot>\n        </div>\n        <u-fab class=\"toggle-container\" .size=${this.size}>\n          <u-fab \n            class=\"toggle\"\n            .color=${this.color}\n            .lowered=${this.lowered}\n            .size=${this.open ? 'medium' : this.size}\n            @click=${this.#toggle}>\n            <span class=\"icon-container\" aria-hidden=\"true\">\n              <span class=\"icon icon-default\">\n                <slot name=\"icon\"></slot>\n              </span>\n              <span class=\"icon icon-close\">\n                <slot name=\"close-icon\">\n                  <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"1em\" viewBox=\"0 -960 960 960\" width=\"1em\" fill=\"currentColor\">\n                    <path\n                      d=\"m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z\" />\n                  </svg>\n                </slot>\n              </span>\n            </span>\n          </u-fab>\n        </u-fab>\n      </div>\n    `;\n  }\n\n  #toggle(): void {\n    this.open = !this.open;\n  }\n\n  #handleIconItemsSlotChange(event: Event) {\n    const elements = (event.target as HTMLSlotElement).assignedElements({ flatten: true });\n\n    let index = 0;\n\n    for (const element of elements.filter(e => e instanceof UmFabMenuItem).reverse()) {\n      element._index = index;\n      index++;\n    }\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-fab-menu': UmFabMenu;\n  }\n}\n"]}
+{"version":3,"file":"fab-menu.js","sourceRoot":"","sources":["../../src/button/fab-menu.ts"],"names":[],"mappings":"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","sourcesContent":["import { consume, provide } from '@lit/context';\n\nimport { html, HTMLTemplateResult, LitElement } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\n\nimport { scrollContainerContext } from '../scaffold/scroll-container-context.js';\nimport { fabMenuColorContext } from './fab-menu-color-context.js';\nimport { FabMenuItem } from './fab-menu-item.js';\nimport { fabMenuOpenContext } from './fab-menu-open-context.js';\nimport { styles } from './fab-menu.styles.js';\nimport { FabColor, FabSize } from './fab.js';\n\n@customElement('u-fab-menu')\nexport class FabMenu extends LitElement {\n\n  static override styles = [styles];\n\n  /**\n   * The FAB color variant to render.\n   */\n  @provide({ context: fabMenuColorContext })\n  @property()\n  color: FabColor = 'primary';\n\n  /**\n   * The size of the FAB.\n   */\n  @property() size: FabSize = 'medium';\n\n  /**\n   * Lowers the FAB's elevation.\n   */\n  @property({ type: Boolean, reflect: true }) lowered = false;\n\n  @provide({ context: fabMenuOpenContext })\n  @state()\n  open = false;\n\n  /**\n   * The element the FAB menu will observe for scroll. Accepts an\n   * `HTMLElement`, the id of an element, `'window'` to use the window\n   * scroll, or `'none'` to disable. When unset, the FAB menu consumes the\n   * scroll container provided by an ancestor `u-scaffold` via context,\n   * falling back to `'window'`. Reserved for future scroll-driven behaviors.\n   */\n  @property({ attribute: 'scroll-container' })\n  scrollContainer: 'none' | 'window' | string | HTMLElement | undefined = undefined;\n\n  @consume({ context: scrollContainerContext, subscribe: true })\n  @state()\n  protected readonly _scrollContainerFromContext!: HTMLElement | undefined;\n\n  /**\n   * The resolved scroll target according to the precedence\n   * explicit > context > window. Returns `null` when the explicit value\n   * is `'none'`.\n   */\n  protected get _effectiveScrollContainer(): HTMLElement | Window | null {\n    const explicit = this.scrollContainer;\n\n    if (explicit === 'none') {\n      return null;\n    }\n\n    if (explicit instanceof HTMLElement) {\n      return explicit;\n    }\n\n    if (typeof explicit === 'string' && explicit.length > 0) {\n      if (explicit === 'window') {\n        return window;\n      }\n\n      return document.getElementById(explicit);\n    }\n\n    return this._scrollContainerFromContext ?? window;\n  }\n\n  protected override render(): HTMLTemplateResult {\n    const containerClasses = classMap({\n      open: this.open,\n      [this.color]: true,\n    });\n\n    return html`\n      <div class=\"container ${containerClasses}\">\n        <div class=\"menu-items\">\n          <slot @slotchange=${this.#handleIconItemsSlotChange}></slot>\n        </div>\n        <u-fab class=\"toggle-container\" .size=${this.size}>\n          <u-fab \n            class=\"toggle\"\n            .color=${this.color}\n            .lowered=${this.lowered}\n            .size=${this.open ? 'medium' : this.size}\n            @click=${this.#toggle}>\n            <span class=\"icon-container\" aria-hidden=\"true\">\n              <span class=\"icon icon-default\">\n                <slot name=\"icon\"></slot>\n              </span>\n              <span class=\"icon icon-close\">\n                <slot name=\"close-icon\">\n                  <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"1em\" viewBox=\"0 -960 960 960\" width=\"1em\" fill=\"currentColor\">\n                    <path\n                      d=\"m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z\" />\n                  </svg>\n                </slot>\n              </span>\n            </span>\n          </u-fab>\n        </u-fab>\n      </div>\n    `;\n  }\n\n  #toggle(): void {\n    this.open = !this.open;\n  }\n\n  #handleIconItemsSlotChange(event: Event) {\n    const elements = (event.target as HTMLSlotElement).assignedElements({ flatten: true });\n\n    let index = 0;\n\n    for (const element of elements.filter(e => e instanceof FabMenuItem).reverse()) {\n      element._index = index;\n      index++;\n    }\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-fab-menu': FabMenu;\n  }\n}\n"]}