@universal-material/web 3.0.136 → 3.0.138

package/app-bar/top-app-bar.d.ts

@@ -23,9 +23,9 @@ export declare class UmTopAppBar extends LitElement {
     containerScrolled: boolean;
     private readonly assignedLeadingIcons;
     private readonly assignedTrailingIcons;
-    private _container;
-    private _extendedContent;
-    private _headlineElement;
+    private readonly _container;
+    private readonly _extendedContent;
+    private readonly _headlineElement;
     private containerSizeObserver;
     private scrollContainerElement;
     private getScrollContainer;

package/app-bar/top-app-bar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"top-app-bar.d.ts","sourceRoot":"","sources":["../../src/app-bar/top-app-bar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAW,MAAM,KAAK,CAAC;AAOpE,qBACa,WAAY,SAAQ,UAAU;;IACzC,OAAgB,MAAM,4BAAwB;IAE9C;;;;OAIG;IAEH,cAAc,UAAS;IAEvB;;;;OAIG;IAEH,eAAe,UAAS;IAGxB,QAAQ,EAAE,OAAO,GAAG,UAAU,GAAG,QAAQ,CAAW;IAGpD,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAW;IAEjC,QAAQ,EAAE,MAAM,CAAM;IAElC,IACI,eAAe,IAAI,MAAM,GAAG,QAAQ,GAAG,MAAM,GAAG,SAAS,CAE5D;IACD,IAAI,eAAe,CAAC,WAAW,EAAE,MAAM,GAAG,WAAW,GAAG,SAAS,EAShE;IAGD,iBAAiB,EAAE,OAAO,CAAS;IAGnC,OAAO,CAAC,QAAQ,CAAC,oBAAoB,CAAiB;IAGtD,OAAO,CAAC,QAAQ,CAAC,qBAAqB,CAAiB;IAE5B,OAAO,CAAC,UAAU,CAAe;IAChC,OAAO,CAAC,gBAAgB,CAAe;IAC/C,OAAO,CAAC,gBAAgB,CAAe;IAE3D,OAAO,CAAC,qBAAqB,CAA+B;IAE5D,OAAO,CAAC,sBAAsB,CAGd;IAEhB,OAAO,CAAC,kBAAkB;IAiB1B,OAAO,CAAC,2BAA2B;IAInC,OAAO,CAAC,4BAA4B;IAI3B,MAAM,IAAI,kBAAkB;cA6BlB,OAAO,CAAC,kBAAkB,EAAE,cAAc;IAKpD,YAAY,CAAC,iBAAiB,EAAE,cAAc;IAO9C,iBAAiB;IAMjB,oBAAoB;IAgC7B,OAAO,CAAC,MAAM,CAAC,YAAY;IAY3B,OAAO,CAAC,wBAAwB;CAGjC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,WAAW,CAAC;KAC9B;CACF"}
+{"version":3,"file":"top-app-bar.d.ts","sourceRoot":"","sources":["../../src/app-bar/top-app-bar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAEvD,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAW,MAAM,KAAK,CAAC;AAMpE,qBACa,WAAY,SAAQ,UAAU;;IACzC,OAAgB,MAAM,4BAAwB;IAE9C;;;;OAIG;IAEH,cAAc,UAAS;IAEvB;;;;OAIG;IAEH,eAAe,UAAS;IAGxB,QAAQ,EAAE,OAAO,GAAG,UAAU,GAAG,QAAQ,CAAW;IAGpD,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAW;IAEjC,QAAQ,SAAM;IAE1B,IACI,eAAe,IAAI,MAAM,GAAG,QAAQ,GAAG,MAAM,GAAG,SAAS,CAE5D;IAED,IAAI,eAAe,CAAC,WAAW,EAAE,MAAM,GAAG,WAAW,GAAG,SAAS,EAShE;IAGD,iBAAiB,UAAS;IAG1B,OAAO,CAAC,QAAQ,CAAC,oBAAoB,CAAiB;IAGtD,OAAO,CAAC,QAAQ,CAAC,qBAAqB,CAAiB;IAE5B,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAe;IACzC,OAAO,CAAC,QAAQ,CAAC,gBAAgB,CAAe;IACxD,OAAO,CAAC,QAAQ,CAAC,gBAAgB,CAAe;IAEpE,OAAO,CAAC,qBAAqB,CAA+B;IAE5D,OAAO,CAAC,sBAAsB,CAGd;IAEhB,OAAO,CAAC,kBAAkB;IAiB1B,OAAO,CAAC,2BAA2B;IAInC,OAAO,CAAC,4BAA4B;IAI3B,MAAM,IAAI,kBAAkB;cA6BlB,OAAO,CAAC,kBAAkB,EAAE,cAAc;IAKpD,YAAY,CAAC,iBAAiB,EAAE,cAAc;IAO9C,iBAAiB;IAMjB,oBAAoB;IAgC7B,OAAO,CAAC,MAAM,CAAC,YAAY;IAY3B,OAAO,CAAC,wBAAwB;CAGjC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,WAAW,CAAC;KAC9B;CACF"}

package/app-bar/top-app-bar.js

@@ -1,15 +1,10 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
 var _a;
 var UmTopAppBar_1;
+import { __decorate } from "tslib";
 import { html, LitElement, nothing } from 'lit';
 import { customElement, property, query, queryAssignedElements } from 'lit/decorators.js';
-import { styles } from './top-app-bar.styles.js';
 import { styles as baseStyles } from '../shared/base.styles';
+import { styles } from './top-app-bar.styles.js';
 let UmTopAppBar = class UmTopAppBar extends LitElement {
     constructor() {
         super(...arguments);

package/app-bar/top-app-bar.js.map

@@ -1 +1 @@
-{"version":3,"file":"top-app-bar.js","sourceRoot":"","sources":["../../src/app-bar/top-app-bar.ts"],"names":[],"mappings":"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","sourcesContent":["import { PropertyValues } from '@lit/reactive-element';\nimport { html, HTMLTemplateResult, LitElement, nothing } from 'lit';\nimport { customElement, property, query, queryAssignedElements } from 'lit/decorators.js';\n\nimport { styles } from './top-app-bar.styles.js';\n\nimport { styles as baseStyles } from '../shared/base.styles';\n\n@customElement('u-top-app-bar')\nexport class UmTopAppBar extends LitElement {\n  static override styles = [baseStyles, styles];\n\n  /**\n   * Whether the app bar has leading icon or not\n   *\n   * _Note:_ Readonly\n   */\n  @property({ type: Boolean, attribute: 'has-leading-icon', reflect: true })\n  hasLeadingIcon = false;\n\n  /**\n   * Whether the app bar has trailing icon or not\n   *\n   * _Note:_ Readonly\n   */\n  @property({ type: Boolean, attribute: 'has-trailing-icon', reflect: true })\n  hasTrailingIcon = false;\n\n  @property({ reflect: true })\n  position: 'fixed' | 'absolute' | 'static' = 'fixed';\n\n  @property({ reflect: true })\n  size: 'small' | 'medium' | 'large' = 'small';\n\n  @property() headline: string = '';\n\n  @property({ reflect: true })\n  get scrollContainer(): 'none' | 'window' | string | undefined {\n    return this.attributes.getNamedItem('scrollContainer')?.value;\n  }\n  set scrollContainer(idOrElement: string | HTMLElement | undefined) {\n    this.scrollContainerElement?.removeEventListener('scroll', this.#updateScroll);\n\n    if (idOrElement === 'none') {\n      return;\n    }\n\n    this.scrollContainerElement = this.getScrollContainer(idOrElement)!;\n    this.scrollContainerElement?.addEventListener('scroll', this.#updateScroll);\n  }\n\n  @property({ type: Boolean, attribute: 'container-scrolled', reflect: true })\n  containerScrolled: boolean = false;\n\n  @queryAssignedElements({ slot: 'leading-icon', flatten: true })\n  private readonly assignedLeadingIcons!: HTMLElement[];\n\n  @queryAssignedElements({ slot: 'trailing-icon', flatten: true })\n  private readonly assignedTrailingIcons!: HTMLElement[];\n\n  @query('.container', true) private _container!: HTMLElement;\n  @query('.extended-content') private _extendedContent!: HTMLElement;\n  @query('.headline') private _headlineElement!: HTMLElement;\n\n  private containerSizeObserver: ResizeObserver | null = null;\n\n  private scrollContainerElement: {\n    addEventListener: typeof window.addEventListener;\n    removeEventListener: typeof window.removeEventListener;\n  } | null = null;\n\n  private getScrollContainer(idOrElement: string | HTMLElement | undefined):\n    | {\n        addEventListener: typeof window.addEventListener;\n        removeEventListener: typeof window.removeEventListener;\n      }\n    | undefined {\n    if (idOrElement instanceof HTMLElement) {\n      return idOrElement;\n    }\n\n    if (idOrElement === 'window') {\n      return window;\n    }\n\n    return document.getElementById(idOrElement!)!;\n  }\n\n  private handleLeadingIconSlotChange() {\n    this.hasLeadingIcon = this.assignedLeadingIcons.length > 0;\n  }\n\n  private handleTrailingIconSlotChange() {\n    this.hasTrailingIcon = this.assignedTrailingIcons.length > 0;\n  }\n\n  override render(): HTMLTemplateResult {\n    const extendedContent = html`\n      <div class=\"extended-content\" part=\"extended-content\">\n        <slot name=\"extended-content\">${this.headline}</slot>\n      </div>\n    `;\n\n    return html`\n      <div class=\"container\" part=\"container\">\n        <div class=\"content\" part=\"content\">\n          <div class=\"icon leading-icon\" part=\"icon leading\">\n            <slot name=\"leading-icon\" @slotchange=\"${this.handleLeadingIconSlotChange}\"></slot>\n          </div>\n          <div class=\"headline\" part=\"headline\">\n            <slot>\n              <span>${this.headline}</span>\n            </slot>\n          </div>\n\n          <div class=\"icon trailing-icon\" part=\"icon trailing\">\n            <slot name=\"trailing-icon\" @slotchange=\"${this.handleTrailingIconSlotChange}\"></slot>\n          </div>\n        </div>\n        <slot name=\"additional-content\"></slot>\n      </div>\n      ${this.size !== 'small' ? extendedContent : nothing}\n    `;\n  }\n\n  protected override updated(_changedProperties: PropertyValues) {\n    super.updated(_changedProperties);\n    this.#updateScroll();\n  }\n\n  override firstUpdated(changedProperties: PropertyValues) {\n    super.firstUpdated(changedProperties);\n    this.containerSizeObserver = new ResizeObserver(() => this.setContentHeightProperty());\n    this.containerSizeObserver.observe(this._container);\n    this.setContentHeightProperty();\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n\n    this.scrollContainer = this.scrollContainer || 'window';\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n\n    this.containerSizeObserver!.disconnect();\n    this.containerSizeObserver = null;\n  }\n\n  #updateScroll = () => {\n    const container = this.scrollContainerElement ?? window;\n\n    const extendedContentHeight = Math.max(this._extendedContent?.offsetHeight ?? 0, 0);\n\n    const scrollTop = UmTopAppBar.getScrollTop(container as any);\n\n    this.containerScrolled = scrollTop > extendedContentHeight;\n\n    this._headlineElement.style.opacity = scrollTop >= extendedContentHeight ? '1' : '0';\n\n    if (extendedContentHeight === 0) {\n      return;\n    }\n\n    const scrollOffset = this._extendedContent.offsetHeight * 0.7;\n\n    if (scrollTop > scrollOffset) {\n      this._extendedContent.style.opacity = '0';\n      return;\n    }\n\n    this._extendedContent.style.opacity = 1 - scrollTop / scrollOffset + '';\n  };\n\n  private static getScrollTop(container: HTMLElement & Window): number {\n    if (typeof container.scrollY === 'number') {\n      return container.scrollY;\n    }\n\n    if (typeof container.scrollTop === 'number') {\n      return container.scrollTop;\n    }\n\n    return document.body.scrollTop;\n  }\n\n  private setContentHeightProperty() {\n    this.style.setProperty('--_content-height', `${this._container.clientHeight}px`);\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-top-app-bar': UmTopAppBar;\n  }\n}\n"]}
+{"version":3,"file":"top-app-bar.js","sourceRoot":"","sources":["../../src/app-bar/top-app-bar.ts"],"names":[],"mappings":"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","sourcesContent":["import { PropertyValues } from '@lit/reactive-element';\n\nimport { html, HTMLTemplateResult, LitElement, nothing } from 'lit';\nimport { customElement, property, query, queryAssignedElements } from 'lit/decorators.js';\n\nimport { styles as baseStyles } from '../shared/base.styles';\nimport { styles } from './top-app-bar.styles.js';\n\n@customElement('u-top-app-bar')\nexport class UmTopAppBar extends LitElement {\n  static override styles = [baseStyles, styles];\n\n  /**\n   * Whether the app bar has leading icon or not\n   *\n   * _Note:_ Readonly\n   */\n  @property({ type: Boolean, attribute: 'has-leading-icon', reflect: true })\n  hasLeadingIcon = false;\n\n  /**\n   * Whether the app bar has trailing icon or not\n   *\n   * _Note:_ Readonly\n   */\n  @property({ type: Boolean, attribute: 'has-trailing-icon', reflect: true })\n  hasTrailingIcon = false;\n\n  @property({ reflect: true })\n  position: 'fixed' | 'absolute' | 'static' = 'fixed';\n\n  @property({ reflect: true })\n  size: 'small' | 'medium' | 'large' = 'small';\n\n  @property() headline = '';\n\n  @property({ reflect: true })\n  get scrollContainer(): 'none' | 'window' | string | undefined {\n    return this.attributes.getNamedItem('scrollContainer')?.value;\n  }\n\n  set scrollContainer(idOrElement: string | HTMLElement | undefined) {\n    this.scrollContainerElement?.removeEventListener('scroll', this.#updateScroll);\n\n    if (idOrElement === 'none') {\n      return;\n    }\n\n    this.scrollContainerElement = this.getScrollContainer(idOrElement)!;\n    this.scrollContainerElement?.addEventListener('scroll', this.#updateScroll);\n  }\n\n  @property({ type: Boolean, attribute: 'container-scrolled', reflect: true })\n  containerScrolled = false;\n\n  @queryAssignedElements({ slot: 'leading-icon', flatten: true })\n  private readonly assignedLeadingIcons!: HTMLElement[];\n\n  @queryAssignedElements({ slot: 'trailing-icon', flatten: true })\n  private readonly assignedTrailingIcons!: HTMLElement[];\n\n  @query('.container', true) private readonly _container!: HTMLElement;\n  @query('.extended-content') private readonly _extendedContent!: HTMLElement;\n  @query('.headline') private readonly _headlineElement!: HTMLElement;\n\n  private containerSizeObserver: ResizeObserver | null = null;\n\n  private scrollContainerElement: {\n    addEventListener: typeof window.addEventListener;\n    removeEventListener: typeof window.removeEventListener;\n  } | null = null;\n\n  private getScrollContainer(idOrElement: string | HTMLElement | undefined):\n    | {\n      addEventListener: typeof window.addEventListener;\n      removeEventListener: typeof window.removeEventListener;\n    }\n    | undefined {\n    if (idOrElement instanceof HTMLElement) {\n      return idOrElement;\n    }\n\n    if (idOrElement === 'window') {\n      return window;\n    }\n\n    return document.getElementById(idOrElement!)!;\n  }\n\n  private handleLeadingIconSlotChange() {\n    this.hasLeadingIcon = this.assignedLeadingIcons.length > 0;\n  }\n\n  private handleTrailingIconSlotChange() {\n    this.hasTrailingIcon = this.assignedTrailingIcons.length > 0;\n  }\n\n  override render(): HTMLTemplateResult {\n    const extendedContent = html`\n      <div class=\"extended-content\" part=\"extended-content\">\n        <slot name=\"extended-content\">${this.headline}</slot>\n      </div>\n    `;\n\n    return html`\n      <div class=\"container\" part=\"container\">\n        <div class=\"content\" part=\"content\">\n          <div class=\"icon leading-icon\" part=\"icon leading\">\n            <slot name=\"leading-icon\" @slotchange=\"${this.handleLeadingIconSlotChange}\"></slot>\n          </div>\n          <div class=\"headline\" part=\"headline\">\n            <slot>\n              <span>${this.headline}</span>\n            </slot>\n          </div>\n\n          <div class=\"icon trailing-icon\" part=\"icon trailing\">\n            <slot name=\"trailing-icon\" @slotchange=\"${this.handleTrailingIconSlotChange}\"></slot>\n          </div>\n        </div>\n        <slot name=\"additional-content\"></slot>\n      </div>\n      ${this.size !== 'small' ? extendedContent : nothing}\n    `;\n  }\n\n  protected override updated(_changedProperties: PropertyValues) {\n    super.updated(_changedProperties);\n    this.#updateScroll();\n  }\n\n  override firstUpdated(changedProperties: PropertyValues) {\n    super.firstUpdated(changedProperties);\n    this.containerSizeObserver = new ResizeObserver(() => this.setContentHeightProperty());\n    this.containerSizeObserver.observe(this._container);\n    this.setContentHeightProperty();\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n\n    this.scrollContainer = this.scrollContainer || 'window';\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n\n    this.containerSizeObserver!.disconnect();\n    this.containerSizeObserver = null;\n  }\n\n  readonly #updateScroll = () => {\n    const container = this.scrollContainerElement ?? window;\n\n    const extendedContentHeight = Math.max(this._extendedContent?.offsetHeight ?? 0, 0);\n\n    const scrollTop = UmTopAppBar.getScrollTop(container as any);\n\n    this.containerScrolled = scrollTop > extendedContentHeight;\n\n    this._headlineElement.style.opacity = scrollTop >= extendedContentHeight ? '1' : '0';\n\n    if (extendedContentHeight === 0) {\n      return;\n    }\n\n    const scrollOffset = this._extendedContent.offsetHeight * 0.7;\n\n    if (scrollTop > scrollOffset) {\n      this._extendedContent.style.opacity = '0';\n      return;\n    }\n\n    this._extendedContent.style.opacity = 1 - scrollTop / scrollOffset + '';\n  };\n\n  private static getScrollTop(container: HTMLElement & Window): number {\n    if (typeof container.scrollY === 'number') {\n      return container.scrollY;\n    }\n\n    if (typeof container.scrollTop === 'number') {\n      return container.scrollTop;\n    }\n\n    return document.body.scrollTop;\n  }\n\n  private setContentHeightProperty() {\n    this.style.setProperty('--_content-height', `${this._container.clientHeight}px`);\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-top-app-bar': UmTopAppBar;\n  }\n}\n"]}

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":"AAIA,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAE9D,8BAAsB,YAAa,SAAQ,eAAe;;IAExD,MAAM,CAAC,QAAQ,CAAC,cAAc,QAAQ;IAEtC,OAAgB,MAAM,iCAAmC;IAE7C,IAAI,EAAE,MAAM,CAAY;IAET,KAAK,EAAE,MAAM,CAAM;IAE9C,IAAI,IAAI,IAAI,eAAe,GAAG,IAAI,CAEjC;;cASkB,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,IAAI;CA8BjD"}
+{"version":3,"file":"button-base.d.ts","sourceRoot":"","sources":["../../src/button/button-base.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAG9D,8BAAsB,YAAa,SAAQ,eAAe;;IAExD,MAAM,CAAC,QAAQ,CAAC,cAAc,QAAQ;IAEtC,OAAgB,MAAM,iCAAoC;IAE9C,IAAI,SAAY;IAEC,KAAK,SAAM;IAExC,IAAI,IAAI,IAAI,eAAe,GAAG,IAAI,CAEjC;;cASkB,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,IAAI;CA8BjD"}

package/button/button-base.js

@@ -1,12 +1,7 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+import { __decorate } from "tslib";
 import { property } from 'lit/decorators.js';
-import { styles } from './button-base.styles.js';
 import { UmButtonWrapper } from '../shared/button-wrapper.js';
+import { styles } from './button-base.styles.js';
 export class UmButtonBase extends UmButtonWrapper {
     static { this.formAssociated = true; }
     static { this.styles = [UmButtonWrapper.styles, styles]; }
@@ -32,7 +27,7 @@ export class UmButtonBase extends UmButtonWrapper {
             this.form.reset();
             return;
         }
-        this.form.addEventListener('submit', (submitEvent) => {
+        this.form.addEventListener('submit', submitEvent => {
             Object.defineProperty(submitEvent, 'submitter', {
                 configurable: true,
                 enumerable: true,

package/button/button-base.js.map

@@ -1 +1 @@
-{"version":3,"file":"button-base.js","sourceRoot":"","sources":["../../src/button/button-base.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEjD,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAE9D,MAAM,OAAgB,YAAa,SAAQ,eAAe;aAExC,mBAAc,GAAG,IAAI,AAAP,CAAQ;aAEtB,WAAM,GAAG,CAAC,eAAe,CAAC,MAAM,EAAE,MAAM,CAAC,AAAnC,CAAmC;IAMzD,IAAI,IAAI;QACN,OAAO,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC;IACrC,CAAC;IAEQ,iBAAiB,CAAmB;IAE7C;QACE,KAAK,EAAE,CAAC;QAXE,SAAI,GAAW,QAAQ,CAAC;QAET,UAAK,GAAW,EAAE,CAAC;QAU5C,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;IAClD,CAAC;IAEkB,WAAW,CAAC,CAAU;QAEvC,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,CAAC,WAAW,EAAE,EAAE;YACd,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,EAAC,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAC,CAC5B,CAAC;QACF,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC;IAC5B,CAAC;;AA5CW;IAAX,QAAQ,EAAE;0CAAyB;AAET;IAA1B,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC;2CAAoB","sourcesContent":["import { property } from 'lit/decorators.js';\n\nimport { styles } from './button-base.styles.js';\n\nimport { UmButtonWrapper } from '../shared/button-wrapper.js';\n\nexport abstract class UmButtonBase extends UmButtonWrapper {\n\n  static readonly formAssociated = true;\n\n  static override styles = [UmButtonWrapper.styles, styles]\n\n  @property() type: string = 'submit';\n\n  @property({reflect: true}) value: string = '';\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":";AAAA,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,GAAG,CAAC,eAAe,CAAC,MAAM,EAAE,MAAM,CAAC,AAAnC,CAAoC;IAM1D,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,WAAW,CAAC,CAAU;QAEvC,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 { 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 = [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"]}

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":"AAIA,OAAO,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAEvD,qBACa,WAAY,SAAQ,SAAS;IAExC,OAAgB,MAAM,iCAA8B;IAEpD;;OAEG;IACuC,KAAK,UAAS;IAE/C,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,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"}

package/button/button-set.js

@@ -1,12 +1,7 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+import { __decorate } from "tslib";
 import { customElement, property } from 'lit/decorators.js';
-import { styles } from './button-set.styles.js';
 import { UmSetBase } from '../shared/sets/set-base.js';
+import { styles } from './button-set.styles.js';
 let UmButtonSet = class UmButtonSet extends UmSetBase {
     constructor() {
         super(...arguments);

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,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAEhD,OAAO,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAGhD,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,SAAS;IAAnC;;QAIL;;WAEG;QACuC,UAAK,GAAG,KAAK,CAAC;QAE/C,cAAS,GAA+B,KAAK,CAAC;IACzD,CAAC;aARiB,WAAM,GAAG,CAAC,SAAS,CAAC,MAAM,EAAE,MAAM,CAAC,AAA7B,CAA8B;;AAKV;IAAzC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;0CAAe;AAP7C,WAAW;IADvB,aAAa,CAAC,cAAc,CAAC;GACjB,WAAW,CAUvB","sourcesContent":["import { customElement, property } from 'lit/decorators.js';\n\nimport { styles } from './button-set.styles.js';\n\nimport { UmSetBase } from '../shared/sets/set-base.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,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"]}

package/button/button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/button/button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAW,MAAM,KAAK,CAAC;AAKxD,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAEhD,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,GAAG,SAAS,CAAC;AAEvF,qBACa,QAAS,SAAQ,YAAY;IACxC,OAAgB,MAAM,+DAAiC;IAEvD;;OAEG;IAC0B,OAAO,EAAE,eAAe,CAAY;IAEjE;;;;OAIG;IAC0B,KAAK,EAAE,aAAa,CAAC;IAEsB,YAAY,UAAS;IAE7F;;;;OAIG;IACgE,OAAO,UAAS;cAEhE,aAAa,IAAI,kBAAkB;IActD,OAAO,CAAC,gBAAgB;CAGzB;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,EAAQ,kBAAkB,EAAW,MAAM,KAAK,CAAC;AAGxD,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAGhD,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,GAAG,SAAS,CAAC;AAEvF,qBACa,QAAS,SAAQ,YAAY;IACxC,OAAgB,MAAM,+DAAiC;IAEvD;;OAEG;IAC0B,OAAO,EAAE,eAAe,CAAY;IAEjE;;;;OAIG;IAC0B,KAAK,EAAE,aAAa,CAAC;IAEsB,YAAY,UAAS;IAE7F;;;;OAIG;IACgE,OAAO,UAAS;cAEhE,aAAa,IAAI,kBAAkB;IActD,OAAO,CAAC,gBAAgB;CAGzB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,QAAQ,CAAC;KACtB;CACF"}

package/button/button.js

@@ -1,13 +1,8 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+import { __decorate } from "tslib";
 import { html, nothing } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
-import { styles } from './button.styles.js';
 import { UmButtonBase } from './button-base.js';
+import { styles } from './button.styles.js';
 import '../ripple/ripple.js';
 let UmButton = class UmButton extends UmButtonBase {
     constructor() {

package/button/button.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.js","sourceRoot":"","sources":["../../src/button/button.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAsB,OAAO,EAAE,MAAM,KAAK,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAE5C,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAEhD,OAAO,qBAAqB,CAAC;AAMtB,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,YAAY;IAAnC;;QAGL;;WAEG;QAC0B,YAAO,GAAoB,QAAQ,CAAC;QASO,iBAAY,GAAG,KAAK,CAAC;QAE7F;;;;WAIG;QACgE,YAAO,GAAG,KAAK,CAAC;IAmBrF,CAAC;aAxCiB,WAAM,GAAG,CAAC,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC,AAAhC,CAAiC;IAuBpC,aAAa;QAC9B,MAAM,IAAI,GAAG,IAAI,CAAA;;4DAEuC,IAAI,CAAC,gBAAgB;;KAE5E,CAAC;QAEF,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI;;QAElC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO;KACrC,CAAC;IACJ,CAAC;IAEO,gBAAgB,CAAC,CAAQ;QAC/B,IAAI,CAAC,OAAO,GAAqB,CAAC,CAAC,MAAO,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;IAC5F,CAAC;;AAlC4B;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;yCAAqC;AAOpC;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uCAAsB;AAEsB;IAAvE,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,eAAe,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;8CAAsB;AAO1B;IAAlE,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;yCAAiB;AAtBxE,QAAQ;IADpB,aAAa,CAAC,UAAU,CAAC;GACb,QAAQ,CAyCpB","sourcesContent":["import { html, HTMLTemplateResult, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { styles } from './button.styles.js';\n\nimport { UmButtonBase } from './button-base.js';\n\nimport '../ripple/ripple.js';\n\nexport type UmButtonVariant = 'filled' | 'tonal' | 'elevated' | 'outlined' | 'text';\nexport type UmButtonColor = 'primary' | 'secondary' | 'tertiary' | 'error' | undefined;\n\n@customElement('u-button')\nexport class UmButton extends UmButtonBase {\n  static override styles = [UmButtonBase.styles, styles];\n\n  /**\n   * The Button variant to render\n   */\n  @property({ reflect: true }) variant: UmButtonVariant = 'filled';\n\n  /**\n   * The Button color\n   *\n   1\n   */\n  @property({ reflect: true }) color: UmButtonColor;\n\n  @property({ type: Boolean, attribute: 'trailing-icon', reflect: true }) trailingIcon = false;\n\n  /**\n   * Whether the button has icon or not\n   *\n   * _Note:_ Readonly\n   */\n  @property({ type: Boolean, attribute: 'has-icon', reflect: true }) hasIcon = false;\n\n  protected override renderContent(): HTMLTemplateResult {\n    const icon = html`\n      <span class=\"icon\">\n        <slot name=\"icon\" aria-hidden=\"true\" @slotchange=\"${this.handleSlotChange}\"></slot>\n      </span>\n    `;\n\n    return html`\n      ${this.trailingIcon ? nothing : icon}\n      <span id=\"text\"><slot></slot></span>\n      ${this.trailingIcon ? icon : nothing}\n    `;\n  }\n\n  private handleSlotChange(e: Event) {\n    this.hasIcon = (<HTMLSlotElement>e.target).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":";AAAA,OAAO,EAAE,IAAI,EAAsB,OAAO,EAAE,MAAM,KAAK,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAChD,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAE5C,OAAO,qBAAqB,CAAC;AAMtB,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,YAAY;IAAnC;;QAGL;;WAEG;QAC0B,YAAO,GAAoB,QAAQ,CAAC;QASO,iBAAY,GAAG,KAAK,CAAC;QAE7F;;;;WAIG;QACgE,YAAO,GAAG,KAAK,CAAC;IAmBrF,CAAC;aAxCiB,WAAM,GAAG,CAAC,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC,AAAhC,CAAiC;IAuBpC,aAAa;QAC9B,MAAM,IAAI,GAAG,IAAI,CAAA;;4DAEuC,IAAI,CAAC,gBAAgB;;KAE5E,CAAC;QAEF,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI;;QAElC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO;KACrC,CAAC;IACJ,CAAC;IAEO,gBAAgB,CAAC,CAAQ;QAC/B,IAAI,CAAC,OAAO,GAAI,CAAC,CAAC,MAA0B,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;IAC9F,CAAC;;AAlC4B;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;yCAAqC;AAOpC;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uCAAsB;AAEsB;IAAvE,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,eAAe,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;8CAAsB;AAO1B;IAAlE,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;yCAAiB;AAtBxE,QAAQ;IADpB,aAAa,CAAC,UAAU,CAAC;GACb,QAAQ,CAyCpB","sourcesContent":["import { html, HTMLTemplateResult, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { UmButtonBase } from './button-base.js';\nimport { styles } from './button.styles.js';\n\nimport '../ripple/ripple.js';\n\nexport type UmButtonVariant = 'filled' | 'tonal' | 'elevated' | 'outlined' | 'text';\nexport type UmButtonColor = 'primary' | 'secondary' | 'tertiary' | 'error' | undefined;\n\n@customElement('u-button')\nexport class UmButton extends UmButtonBase {\n  static override styles = [UmButtonBase.styles, styles];\n\n  /**\n   * The Button variant to render\n   */\n  @property({ reflect: true }) variant: UmButtonVariant = 'filled';\n\n  /**\n   * The Button color\n   *\n   1\n   */\n  @property({ reflect: true }) color: UmButtonColor;\n\n  @property({ type: Boolean, attribute: 'trailing-icon', reflect: true }) trailingIcon = false;\n\n  /**\n   * Whether the button has icon or not\n   *\n   * _Note:_ Readonly\n   */\n  @property({ type: Boolean, attribute: 'has-icon', reflect: true }) hasIcon = false;\n\n  protected override renderContent(): HTMLTemplateResult {\n    const icon = html`\n      <span class=\"icon\">\n        <slot name=\"icon\" aria-hidden=\"true\" @slotchange=\"${this.handleSlotChange}\"></slot>\n      </span>\n    `;\n\n    return html`\n      ${this.trailingIcon ? nothing : icon}\n      <span id=\"text\"><slot></slot></span>\n      ${this.trailingIcon ? icon : nothing}\n    `;\n  }\n\n  private handleSlotChange(e: Event) {\n    this.hasIcon = (e.target as HTMLSlotElement).assignedElements({ flatten: true }).length > 0;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-button': UmButton;\n  }\n}\n"]}

package/button/button.styles.js

@@ -71,7 +71,7 @@ export const styles = css `
 
   :host([disabled][variant=outlined]) {
     background-color: transparent !important;
-    border-color: var(--u-outlined-button-disabled-border-color, rgba(var(--u-color-on-surface-rgb, 29, 27, 32), var(--u-outlined-button-disabled-border-opacity, 0.12))) !important;
+    border-color: var(--u-outlined-button-disabled-border-color, color-mix(in srgb, var(--u-color-on-surface, rgb(29, 27, 32)) var(--u-outlined-button-disabled-border-opacity, 12%), transparent)) !important;
   }
 
   @media (hover: hover) {

package/button/button.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.styles.js","sourceRoot":"","sources":["../../src/button/button.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoGzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n  :host {\n    --u-common-button-line-height: var(--u-label-large-line-height, 1.25rem);\n    --u-common-button-font-size: var(--u-label-large-font-size, 0.875rem);\n    --u-common-button-font-weight: var(--u-font-weight-medium, 500);\n    --_common-button-height: var(--u-common-button-height, 2.5rem);\n    --_common-button-padding: var(--u-common-button-padding, 24px);\n    --_common-button-icon-size: var(--u-common-button-icon-size, 1.125rem);\n    --_common-button-icon-padding: var(--u-common-button-icon-padding, 16px);\n    --_common-button-icon-margin: var(--u-common-button-icon-margin, 8px);\n    border-radius: var(--u-common-button-shape-corner, var(--u-shape-corner-full, 9999px));\n    font-family: var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");\n    height: var(--u-common-button-height, 40px);\n    font-size: var(--u-common-button-font-size);\n    font-weight: var(--u-common-button-font-weight);\n    padding-inline: var(--_common-button-padding);\n    box-sizing: border-box;\n  }\n\n  :host([variant=filled]),\n  :host([variant=filled][color=primary]) {\n    background-color: var(--u-filled-button-primary-container-color, var(--_color-primary));\n    color: var(--u-filled-button-primary-text-color, var(--u-color-on-primary, rgb(255, 255, 255)));\n  }\n\n  :host([variant=filled][color=secondary]) {\n    background-color: var(--u-filled-button-secondary-container-color, var(--u-color-secondary, rgb(98, 91, 113)));\n    color: var(--u-filled-button-secondary-text-color, var(--u-color-on-secondary, rgb(255, 255, 255)));\n  }\n\n  :host([variant=filled][color=tertiary]) {\n    background-color: var(--u-filled-button-tertiary-container-color, var(--u-color-tertiary, rgb(125, 82, 96)));\n    color: var(--u-filled-button-tertiary-text-color, var(--u-color-on-tertiary, rgb(255, 255, 255)));\n  }\n\n  :host([variant=filled][color=error]) {\n    background-color: var(--u-filled-button-error-container-color, var(--u-color-error, rgb(179, 38, 30)));\n    color: var(--u-filled-button-error-text-color, var(--u-color-on-error, rgb(255, 255, 255)));\n  }\n\n  :host([variant=tonal]) {\n    background-color: var(--u-tonal-button-bg-color, var(--u-color-secondary-container, rgb(232, 222, 248)));\n    color: var(--u-tonal-button-text-color, var(--u-color-on-secondary-container, rgb(29, 25, 43)));\n  }\n\n  :host([variant=elevated]) {\n    background-color: var(--u-elevated-button-bg-color, var(--u-color-surface-container-low, rgb(247, 242, 250)));\n    color: var(--u-tonal-button-text-color, var(--u-color-on-secondary-container, rgb(29, 25, 43)));\n  }\n\n  @media (hover: hover) {\n    :host([variant=filled]:hover:not(:focus-within):not(:active)),\n    :host([variant=tonal]:hover:not(:focus-within):not(:active)) {\n      --u-elevation-level: var(--u-filled-button-hover-elevation-level, 1);\n    }\n  }\n  :host([variant=text]) {\n    color: var(--u-text-button-text-color, var(--_color-primary));\n  }\n\n  :host([variant=outlined]) {\n    color: var(--u-outlined-button-text-color, var(--u-text-button-text-color, var(--_color-primary)));\n    border: 1px solid var(--u-outlined-button-outline-color, var(--u-color-outline, rgb(121, 116, 126)));\n  }\n\n  :host([variant=elevated]) {\n    --u-elevation-level: var(--u-elevated-button-elevation-level, 1);\n    color: var(--u-elevated-button-text-color, var(--_color-primary));\n  }\n\n  :host([disabled][variant=outlined]) {\n    background-color: transparent !important;\n    border-color: var(--u-outlined-button-disabled-border-color, rgba(var(--u-color-on-surface-rgb, 29, 27, 32), var(--u-outlined-button-disabled-border-opacity, 0.12))) !important;\n  }\n\n  @media (hover: hover) {\n    :host([variant=elevated]:hover) {\n      --u-elevation-level: var(--u-elevated-button-hover-elevation-level, 2);\n    }\n  }\n  :host([has-icon]) {\n    padding-inline: var(--_common-button-icon-padding) var(--_common-button-padding);\n  }\n\n  :host([has-icon][trailing-icon]) {\n    padding-inline: var(--_common-button-padding) var(--_common-button-icon-padding);\n  }\n\n  :host(:not([has-icon])) .icon {\n    display: none;\n  }\n\n  .icon {\n    font-size: var(--_common-button-icon-size);\n    margin-inline-end: var(--_common-button-icon-margin);\n  }\n\n  :host([trailing-icon]) .icon {\n    margin-inline: var(--_common-button-icon-margin) 0;\n  }\n`;\n"]}
+{"version":3,"file":"button.styles.js","sourceRoot":"","sources":["../../src/button/button.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoGzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n  :host {\n    --u-common-button-line-height: var(--u-label-large-line-height, 1.25rem);\n    --u-common-button-font-size: var(--u-label-large-font-size, 0.875rem);\n    --u-common-button-font-weight: var(--u-font-weight-medium, 500);\n    --_common-button-height: var(--u-common-button-height, 2.5rem);\n    --_common-button-padding: var(--u-common-button-padding, 24px);\n    --_common-button-icon-size: var(--u-common-button-icon-size, 1.125rem);\n    --_common-button-icon-padding: var(--u-common-button-icon-padding, 16px);\n    --_common-button-icon-margin: var(--u-common-button-icon-margin, 8px);\n    border-radius: var(--u-common-button-shape-corner, var(--u-shape-corner-full, 9999px));\n    font-family: var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");\n    height: var(--u-common-button-height, 40px);\n    font-size: var(--u-common-button-font-size);\n    font-weight: var(--u-common-button-font-weight);\n    padding-inline: var(--_common-button-padding);\n    box-sizing: border-box;\n  }\n\n  :host([variant=filled]),\n  :host([variant=filled][color=primary]) {\n    background-color: var(--u-filled-button-primary-container-color, var(--_color-primary));\n    color: var(--u-filled-button-primary-text-color, var(--u-color-on-primary, rgb(255, 255, 255)));\n  }\n\n  :host([variant=filled][color=secondary]) {\n    background-color: var(--u-filled-button-secondary-container-color, var(--u-color-secondary, rgb(98, 91, 113)));\n    color: var(--u-filled-button-secondary-text-color, var(--u-color-on-secondary, rgb(255, 255, 255)));\n  }\n\n  :host([variant=filled][color=tertiary]) {\n    background-color: var(--u-filled-button-tertiary-container-color, var(--u-color-tertiary, rgb(125, 82, 96)));\n    color: var(--u-filled-button-tertiary-text-color, var(--u-color-on-tertiary, rgb(255, 255, 255)));\n  }\n\n  :host([variant=filled][color=error]) {\n    background-color: var(--u-filled-button-error-container-color, var(--u-color-error, rgb(179, 38, 30)));\n    color: var(--u-filled-button-error-text-color, var(--u-color-on-error, rgb(255, 255, 255)));\n  }\n\n  :host([variant=tonal]) {\n    background-color: var(--u-tonal-button-bg-color, var(--u-color-secondary-container, rgb(232, 222, 248)));\n    color: var(--u-tonal-button-text-color, var(--u-color-on-secondary-container, rgb(29, 25, 43)));\n  }\n\n  :host([variant=elevated]) {\n    background-color: var(--u-elevated-button-bg-color, var(--u-color-surface-container-low, rgb(247, 242, 250)));\n    color: var(--u-tonal-button-text-color, var(--u-color-on-secondary-container, rgb(29, 25, 43)));\n  }\n\n  @media (hover: hover) {\n    :host([variant=filled]:hover:not(:focus-within):not(:active)),\n    :host([variant=tonal]:hover:not(:focus-within):not(:active)) {\n      --u-elevation-level: var(--u-filled-button-hover-elevation-level, 1);\n    }\n  }\n  :host([variant=text]) {\n    color: var(--u-text-button-text-color, var(--_color-primary));\n  }\n\n  :host([variant=outlined]) {\n    color: var(--u-outlined-button-text-color, var(--u-text-button-text-color, var(--_color-primary)));\n    border: 1px solid var(--u-outlined-button-outline-color, var(--u-color-outline, rgb(121, 116, 126)));\n  }\n\n  :host([variant=elevated]) {\n    --u-elevation-level: var(--u-elevated-button-elevation-level, 1);\n    color: var(--u-elevated-button-text-color, var(--_color-primary));\n  }\n\n  :host([disabled][variant=outlined]) {\n    background-color: transparent !important;\n    border-color: var(--u-outlined-button-disabled-border-color, color-mix(in srgb, var(--u-color-on-surface, rgb(29, 27, 32)) var(--u-outlined-button-disabled-border-opacity, 12%), transparent)) !important;\n  }\n\n  @media (hover: hover) {\n    :host([variant=elevated]:hover) {\n      --u-elevation-level: var(--u-elevated-button-hover-elevation-level, 2);\n    }\n  }\n  :host([has-icon]) {\n    padding-inline: var(--_common-button-icon-padding) var(--_common-button-padding);\n  }\n\n  :host([has-icon][trailing-icon]) {\n    padding-inline: var(--_common-button-padding) var(--_common-button-icon-padding);\n  }\n\n  :host(:not([has-icon])) .icon {\n    display: none;\n  }\n\n  .icon {\n    font-size: var(--_common-button-icon-size);\n    margin-inline-end: var(--_common-button-icon-margin);\n  }\n\n  :host([trailing-icon]) .icon {\n    margin-inline: var(--_common-button-icon-margin) 0;\n  }\n`;\n"]}

package/button/fab.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"fab.d.ts","sourceRoot":"","sources":["../../src/button/fab.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAW,MAAM,KAAK,CAAC;AAKxD,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAEhD,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,SAAS,GAAG,SAAS,CAAC;AACtF,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAErD,qBACa,KAAM,SAAQ,YAAY;IAErC,OAAgB,MAAM,+DAAiC;IAEvD;;OAEG;IACwB,KAAK,EAAE,UAAU,CAAa;IAEzD;;OAEG;IACwB,IAAI,EAAE,SAAS,CAAY;IAEtD;;OAEG;IACwB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAQ;IAEvD;;OAEG;IACuC,OAAO,UAAS;IAE1D,IACI,QAAQ,IAAI,OAAO,CAEtB;cAEkB,aAAa,IAAI,kBAAkB;CAQvD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,OAAO,EAAE,KAAK,CAAC;KAChB;CACF"}
+{"version":3,"file":"fab.d.ts","sourceRoot":"","sources":["../../src/button/fab.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAW,MAAM,KAAK,CAAC;AAGxD,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAGhD,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,SAAS,GAAG,SAAS,CAAC;AACtF,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAErD,qBACa,KAAM,SAAQ,YAAY;IAErC,OAAgB,MAAM,+DAAiC;IAEvD;;OAEG;IAC0B,KAAK,EAAE,UAAU,CAAa;IAE3D;;OAEG;IAC0B,IAAI,EAAE,SAAS,CAAY;IAExD;;OAEG;IAC0B,KAAK,EAAE,MAAM,GAAG,IAAI,CAAQ;IAEzD;;OAEG;IACyC,OAAO,UAAS;IAE5D,IACI,QAAQ,IAAI,OAAO,CAEtB;cAEkB,aAAa,IAAI,kBAAkB;CAQvD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,OAAO,EAAE,KAAK,CAAC;KAChB;CACF"}

package/button/fab.js

@@ -1,13 +1,8 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+import { __decorate } from "tslib";
 import { html, nothing } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
-import { styles } from './fab.styles.js';
 import { UmButtonBase } from './button-base.js';
+import { styles } from './fab.styles.js';
 let UmFab = class UmFab extends UmButtonBase {
     constructor() {
         super(...arguments);

package/button/fab.js.map

@@ -1 +1 @@
-{"version":3,"file":"fab.js","sourceRoot":"","sources":["../../src/button/fab.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAsB,OAAO,EAAE,MAAM,KAAK,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAEzC,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAMzC,IAAM,KAAK,GAAX,MAAM,KAAM,SAAQ,YAAY;IAAhC;;QAIL;;WAEG;QACwB,UAAK,GAAe,SAAS,CAAC;QAEzD;;WAEG;QACwB,SAAI,GAAc,QAAQ,CAAC;QAEtD;;WAEG;QACwB,UAAK,GAAkB,IAAI,CAAC;QAEvD;;WAEG;QACuC,YAAO,GAAG,KAAK,CAAC;IAe5D,CAAC;aAnCiB,WAAM,GAAG,CAAC,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC,AAAhC,CAAiC;IAuBvD,IAAI,QAAQ;QACV,OAAO,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC;IACtB,CAAC;IAEkB,aAAa;QAC9B,MAAM,QAAQ,GAAG,IAAI,CAAA,SAAS,IAAI,CAAC,KAAK,SAAS,CAAC;QAElD,OAAO,IAAI,CAAA;;QAEP,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO;KAClC,CAAC;IACJ,CAAC;;AA7B0B;IAA1B,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC;oCAA+B;AAK9B;IAA1B,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC;mCAA4B;AAK3B;IAA1B,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC;oCAA6B;AAKb;IAAzC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;sCAAiB;AAG1D;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;qCAGxC;AA3BU,KAAK;IADjB,aAAa,CAAC,OAAO,CAAC;GACV,KAAK,CAqCjB","sourcesContent":["import { html, HTMLTemplateResult, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { styles } from './fab.styles.js';\n\nimport { UmButtonBase } from './button-base.js';\n\nexport type UmFabColor = 'primary' | 'secondary' | 'tertiary' | 'surface' | 'branded';\nexport type UmFabSize = 'small' | 'medium' | 'large';\n\n@customElement('u-fab')\nexport class UmFab extends UmButtonBase {\n\n  static override styles = [UmButtonBase.styles, styles];\n  \n  /**\n   * The FAB color variant to render.\n   */\n  @property({reflect: true}) color: UmFabColor = 'primary';\n\n  /**\n   * The size of the FAB.\n   */\n  @property({reflect: true}) size: UmFabSize = 'medium';\n\n  /**\n   * The text to display the FAB.\n   */\n  @property({reflect: true}) label: string | null = null;\n\n  /**\n   * Lowers the FAB's elevation.\n   */\n  @property({type: Boolean, reflect: true}) lowered = false;\n\n  @property({type: Boolean, reflect: true})\n  get extended(): boolean {\n    return !!this.label;\n  }\n\n  protected override renderContent(): HTMLTemplateResult {\n    const labelTag = html`<span>${this.label}</span>`;\n\n    return html`\n      <span class=\"icon\" aria-hidden=\"true\"><slot></slot></span>\n      ${this.label ? labelTag : nothing}\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-fab': UmFab;\n  }\n}\n"]}
+{"version":3,"file":"fab.js","sourceRoot":"","sources":["../../src/button/fab.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAsB,OAAO,EAAE,MAAM,KAAK,CAAC;AACxD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAChD,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAMlC,IAAM,KAAK,GAAX,MAAM,KAAM,SAAQ,YAAY;IAAhC;;QAIL;;WAEG;QAC0B,UAAK,GAAe,SAAS,CAAC;QAE3D;;WAEG;QAC0B,SAAI,GAAc,QAAQ,CAAC;QAExD;;WAEG;QAC0B,UAAK,GAAkB,IAAI,CAAC;QAEzD;;WAEG;QACyC,YAAO,GAAG,KAAK,CAAC;IAe9D,CAAC;aAnCiB,WAAM,GAAG,CAAC,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC,AAAhC,CAAiC;IAuBvD,IAAI,QAAQ;QACV,OAAO,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC;IACtB,CAAC;IAEkB,aAAa;QAC9B,MAAM,QAAQ,GAAG,IAAI,CAAA,SAAS,IAAI,CAAC,KAAK,SAAS,CAAC;QAElD,OAAO,IAAI,CAAA;;QAEP,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO;KAClC,CAAC;IACJ,CAAC;;AA7B4B;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;oCAA+B;AAK9B;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;mCAA4B;AAK3B;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;oCAA6B;AAKb;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;sCAAiB;AAG5D;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;qCAG1C;AA3BU,KAAK;IADjB,aAAa,CAAC,OAAO,CAAC;GACV,KAAK,CAqCjB","sourcesContent":["import { html, HTMLTemplateResult, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { UmButtonBase } from './button-base.js';\nimport { styles } from './fab.styles.js';\n\nexport type UmFabColor = 'primary' | 'secondary' | 'tertiary' | 'surface' | 'branded';\nexport type UmFabSize = 'small' | 'medium' | 'large';\n\n@customElement('u-fab')\nexport class UmFab extends UmButtonBase {\n\n  static override styles = [UmButtonBase.styles, styles];\n\n  /**\n   * The FAB color variant to render.\n   */\n  @property({ reflect: true }) color: UmFabColor = 'primary';\n\n  /**\n   * The size of the FAB.\n   */\n  @property({ reflect: true }) size: UmFabSize = 'medium';\n\n  /**\n   * The text to display the FAB.\n   */\n  @property({ reflect: true }) label: string | null = null;\n\n  /**\n   * Lowers the FAB's elevation.\n   */\n  @property({ type: Boolean, reflect: true }) lowered = false;\n\n  @property({ type: Boolean, reflect: true })\n  get extended(): boolean {\n    return !!this.label;\n  }\n\n  protected override renderContent(): HTMLTemplateResult {\n    const labelTag = html`<span>${this.label}</span>`;\n\n    return html`\n      <span class=\"icon\" aria-hidden=\"true\"><slot></slot></span>\n      ${this.label ? labelTag : nothing}\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-fab': UmFab;\n  }\n}\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"icon-button.d.ts","sourceRoot":"","sources":["../../src/button/icon-button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,MAAM,KAAK,CAAC;AAK/C,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAEhD,MAAM,MAAM,mBAAmB,GAAG,UAAU,GAAG,QAAQ,GAAG,OAAO,GAAG,UAAU,CAAC;AAE/E,qBACa,YAAa,SAAQ,YAAY;IAE5C,OAAgB,MAAM,+DAAiC;IAE5B,OAAO,EAAE,mBAAmB,CAAc;IAErE;;;OAGG;IACwB,MAAM,UAAS;IAEiC,gBAAgB,UAAS;IAEpG;;;;OAIG;IACuC,QAAQ,UAAS;IAE3D;;OAEG;IAC2C,iBAAiB,SAAM;IAGrE,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAiB;cAE5B,aAAa,IAAI,kBAAkB;cAUnC,WAAW,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;IAW3C,YAAY,IAAI,MAAM,GAAG,IAAI;IAMtC,OAAO,CAAC,gBAAgB;CAGzB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,YAAY,CAAC;KAC/B;CACF"}
+{"version":3,"file":"icon-button.d.ts","sourceRoot":"","sources":["../../src/button/icon-button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,MAAM,KAAK,CAAC;AAG/C,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAGhD,MAAM,MAAM,mBAAmB,GAAG,UAAU,GAAG,QAAQ,GAAG,OAAO,GAAG,UAAU,CAAC;AAE/E,qBACa,YAAa,SAAQ,YAAY;IAE5C,OAAgB,MAAM,+DAAiC;IAE1B,OAAO,EAAE,mBAAmB,CAAc;IAEvE;;;OAGG;IAC0B,MAAM,UAAS;IAEiC,gBAAgB,UAAS;IAEtG;;;;OAIG;IACyC,QAAQ,UAAS;IAE7D;;OAEG;IAC6C,iBAAiB,SAAM;IAGvE,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAiB;cAE5B,aAAa,IAAI,kBAAkB;cAUnC,WAAW,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;IAW3C,YAAY,IAAI,MAAM,GAAG,IAAI;IAMtC,OAAO,CAAC,gBAAgB;CAGzB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,YAAY,CAAC;KAC/B;CACF"}

package/button/icon-button.js

@@ -1,13 +1,8 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+import { __decorate } from "tslib";
 import { html } from 'lit';
 import { customElement, property, queryAssignedElements } from 'lit/decorators.js';
-import { styles } from './icon-button.styles.js';
 import { UmButtonBase } from './button-base.js';
+import { styles } from './icon-button.styles.js';
 let UmIconButton = class UmIconButton extends UmButtonBase {
     constructor() {
         super(...arguments);

package/button/icon-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"icon-button.js","sourceRoot":"","sources":["../../src/button/icon-button.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAsB,MAAM,KAAK,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAEnF,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEjD,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAKzC,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,YAAY;IAAvC;;QAIsB,YAAO,GAAwB,UAAU,CAAC;QAErE;;;WAGG;QACwB,WAAM,GAAG,KAAK,CAAC;QAEiC,qBAAgB,GAAG,KAAK,CAAC;QAEpG;;;;WAIG;QACuC,aAAQ,GAAG,KAAK,CAAC;QAE3D;;WAEG;QAC2C,sBAAiB,GAAG,EAAE,CAAC;IAmCvE,CAAC;aAzDiB,WAAM,GAAG,CAAC,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC,AAAhC,CAAiC;IA2BpC,aAAa;QAE9B,OAAO,IAAI,CAAA;;;6CAG8B,IAAI,CAAC,gBAAgB;;KAE7D,CAAC;IACJ,CAAC;IAEkB,WAAW,CAAC,KAAc;QAC3C,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;QAEzB,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC;YACjB,OAAO;QACT,CAAC;QAED,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;QAC/B,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,QAAQ,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,CAAC,CAAC;IAC3D,CAAC;IAEQ,YAAY;QACnB,OAAO,IAAI,CAAC,QAAQ;YAClB,CAAC,CAAC,IAAI,CAAC,iBAAiB,IAAI,KAAK,CAAC,YAAY,EAAE;YAChD,CAAC,CAAC,KAAK,CAAC,YAAY,EAAE,CAAC;IAC3B,CAAC;IAEO,gBAAgB;QACtB,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,CAAC;IACxD,CAAC;;AAtD0B;IAA1B,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC;6CAA2C;AAM1C;IAA1B,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;4CAAgB;AAEiC;IAA1E,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,oBAAoB,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;sDAA0B;AAO1D;IAAzC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;8CAAkB;AAKb;IAA7C,QAAQ,CAAC,EAAC,SAAS,EAAE,qBAAqB,EAAC,CAAC;uDAAwB;AAGpD;IADhB,qBAAqB,CAAC,EAAC,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;mDACV;AA3BpC,YAAY;IADxB,aAAa,CAAC,eAAe,CAAC;GAClB,YAAY,CA2DxB","sourcesContent":["import { html, HTMLTemplateResult } from 'lit';\nimport { customElement, property, queryAssignedElements } from 'lit/decorators.js';\n\nimport { styles } from './icon-button.styles.js';\n\nimport { UmButtonBase } from './button-base.js';\n\nexport type UmIconButtonVariant = 'standard' | 'filled' | 'tonal' | 'outlined';\n\n@customElement('u-icon-button')\nexport class UmIconButton extends UmButtonBase {\n\n  static override styles = [UmButtonBase.styles, styles];\n\n  @property({reflect: true}) variant: UmIconButtonVariant = 'standard';\n\n  /**\n   * When true, the button will toggle between selected and unselected\n   * states\n   */\n  @property({type: Boolean}) toggle = false;\n\n  @property({type: Boolean, attribute: 'has-selection-icon', reflect: true}) hasSelectionIcon = false;\n\n  /**\n   * Sets the selected state. When false, displays the default icon. When true,\n   * displays the selected icon, or the default icon If no `slot=\"selected\"`\n   * icon is provided.\n   */\n  @property({type: Boolean, reflect: true}) selected = false;\n\n  /**\n   * The `aria-label` of the button when the button is toggleable and selected.\n   */\n  @property({attribute: 'aria-label-selected'}) ariaLabelSelected = '';\n\n  @queryAssignedElements({slot: 'selected', flatten: true})\n  private readonly selectedIcons!: HTMLElement[];\n\n  protected override renderContent(): HTMLTemplateResult {\n\n    return html`\n      <span class=\"icon\" aria-hidden=\"true\"><slot></slot></span>\n      <span class=\"icon icon-selected\" aria-hidden=\"true\">\n        <slot name=\"selected\" @slotchange=\"${this.handleSlotChange}\"></slot>\n      </span>\n    `;\n  }\n\n  protected override handleClick(event: UIEvent): void {\n    super.handleClick(event);\n\n    if (!this.toggle) {\n      return;\n    }\n\n    this.selected = !this.selected;\n    this.dispatchEvent(new Event('change', {bubbles: true}));\n  }\n\n  override getAriaLabel(): string | null {\n    return this.selected\n      ? this.ariaLabelSelected || super.getAriaLabel()\n      : super.getAriaLabel();\n  }\n\n  private handleSlotChange() {\n    this.hasSelectionIcon = this.selectedIcons.length > 0;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-icon-button': UmIconButton;\n  }\n}\n"]}
+{"version":3,"file":"icon-button.js","sourceRoot":"","sources":["../../src/button/icon-button.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAsB,MAAM,KAAK,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAEnF,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAChD,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAK1C,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,YAAY;IAAvC;;QAIwB,YAAO,GAAwB,UAAU,CAAC;QAEvE;;;WAGG;QAC0B,WAAM,GAAG,KAAK,CAAC;QAEiC,qBAAgB,GAAG,KAAK,CAAC;QAEtG;;;;WAIG;QACyC,aAAQ,GAAG,KAAK,CAAC;QAE7D;;WAEG;QAC6C,sBAAiB,GAAG,EAAE,CAAC;IAmCzE,CAAC;aAzDiB,WAAM,GAAG,CAAC,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC,AAAhC,CAAiC;IA2BpC,aAAa;QAE9B,OAAO,IAAI,CAAA;;;6CAG8B,IAAI,CAAC,gBAAgB;;KAE7D,CAAC;IACJ,CAAC;IAEkB,WAAW,CAAC,KAAc;QAC3C,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;QAEzB,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC;YACjB,OAAO;QACT,CAAC;QAED,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;QAC/B,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;IAC7D,CAAC;IAEQ,YAAY;QACnB,OAAO,IAAI,CAAC,QAAQ;YAClB,CAAC,CAAC,IAAI,CAAC,iBAAiB,IAAI,KAAK,CAAC,YAAY,EAAE;YAChD,CAAC,CAAC,KAAK,CAAC,YAAY,EAAE,CAAC;IAC3B,CAAC;IAEO,gBAAgB;QACtB,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,CAAC;IACxD,CAAC;;AAtD4B;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;6CAA2C;AAM1C;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;4CAAgB;AAEiC;IAA5E,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,oBAAoB,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;sDAA0B;AAO1D;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;8CAAkB;AAKb;IAA/C,QAAQ,CAAC,EAAE,SAAS,EAAE,qBAAqB,EAAE,CAAC;uDAAwB;AAGtD;IADhB,qBAAqB,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;mDACZ;AA3BpC,YAAY;IADxB,aAAa,CAAC,eAAe,CAAC;GAClB,YAAY,CA2DxB","sourcesContent":["import { html, HTMLTemplateResult } from 'lit';\nimport { customElement, property, queryAssignedElements } from 'lit/decorators.js';\n\nimport { UmButtonBase } from './button-base.js';\nimport { styles } from './icon-button.styles.js';\n\nexport type UmIconButtonVariant = 'standard' | 'filled' | 'tonal' | 'outlined';\n\n@customElement('u-icon-button')\nexport class UmIconButton extends UmButtonBase {\n\n  static override styles = [UmButtonBase.styles, styles];\n\n  @property({ reflect: true }) variant: UmIconButtonVariant = 'standard';\n\n  /**\n   * When true, the button will toggle between selected and unselected\n   * states\n   */\n  @property({ type: Boolean }) toggle = false;\n\n  @property({ type: Boolean, attribute: 'has-selection-icon', reflect: true }) hasSelectionIcon = false;\n\n  /**\n   * Sets the selected state. When false, displays the default icon. When true,\n   * displays the selected icon, or the default icon If no `slot=\"selected\"`\n   * icon is provided.\n   */\n  @property({ type: Boolean, reflect: true }) selected = false;\n\n  /**\n   * The `aria-label` of the button when the button is toggleable and selected.\n   */\n  @property({ attribute: 'aria-label-selected' }) ariaLabelSelected = '';\n\n  @queryAssignedElements({ slot: 'selected', flatten: true })\n  private readonly selectedIcons!: HTMLElement[];\n\n  protected override renderContent(): HTMLTemplateResult {\n\n    return html`\n      <span class=\"icon\" aria-hidden=\"true\"><slot></slot></span>\n      <span class=\"icon icon-selected\" aria-hidden=\"true\">\n        <slot name=\"selected\" @slotchange=\"${this.handleSlotChange}\"></slot>\n      </span>\n    `;\n  }\n\n  protected override handleClick(event: UIEvent): void {\n    super.handleClick(event);\n\n    if (!this.toggle) {\n      return;\n    }\n\n    this.selected = !this.selected;\n    this.dispatchEvent(new Event('change', { bubbles: true }));\n  }\n\n  override getAriaLabel(): string | null {\n    return this.selected\n      ? this.ariaLabelSelected || super.getAriaLabel()\n      : super.getAriaLabel();\n  }\n\n  private handleSlotChange() {\n    this.hasSelectionIcon = this.selectedIcons.length > 0;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-icon-button': UmIconButton;\n  }\n}\n"]}

package/button/icon-button.styles.js

@@ -71,7 +71,7 @@ export const styles = css `
 
   :host([disabled][variant=outlined]) {
     background-color: transparent !important;
-    border-color: var(--u-outlined-icon-button-disabled-border-color, rgba(var(--u-color-on-surface-rgb, 29, 27, 32), var(--u-outlined-icon-button-disabled-border-opacity, 0.12))) !important;
+    border-color: var(--u-outlined-icon-button-disabled-border-color, color-mix(in srgb, var(--u-color-on-surface, rgb(29, 27, 32)) var(--u-outlined-icon-button-disabled-border-opacity, 12%), transparent)) !important;
   }
 `;
 //# sourceMappingURL=icon-button.styles.js.map

package/button/icon-button.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"icon-button.styles.js","sourceRoot":"","sources":["../../src/button/icon-button.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0EzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n  :host {\n    --_icon-button-size: var(--u-icon-button-size, 2.5rem);\n    --_color-surface-container-highest: var(--u-color-surface-container-highest, rgb(230, 224, 233));\n    width: var(--_icon-button-size);\n    height: var(--_icon-button-size);\n    border-radius: var(--u-icon-button-shape-corner, 9999px);\n    font-family: var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");\n  }\n\n  .icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    font-size: var(--u-icon-button-icon-size, 1.5rem);\n  }\n  .icon.icon-selected {\n    display: none;\n  }\n\n  :host([selected][has-selection-icon]) .icon:not(.icon-selected) {\n    display: none;\n  }\n  :host([selected][has-selection-icon]) .icon.icon-selected {\n    display: inline-block;\n  }\n\n  :host([variant=filled]) {\n    background-color: var(--u-filled-icon-button-unselected-bg-color, var(--_color-surface-container-highest));\n    color: var(--u-filled-icon-button-unselected-text-color, var(--_color-primary));\n  }\n\n  :host([variant=tonal]) {\n    background-color: var(--u-total-icon-button-unselected-bg-color, var(--_color-surface-container-highest));\n    color: var(--u-tonal-icon-button-unselected-text-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n  }\n\n  :host([selected][variant=filled]),\n  :host([variant=filled]:not([has-selection-icon])) {\n    background-color: var(--u-filled-icon-button-bg-color, var(--_color-primary));\n    color: var(--u-filled-icon-button-text-color, var(--u-color-on-primary, rgb(255, 255, 255)));\n  }\n\n  :host([selected][variant=tonal]),\n  :host([variant=tonal]:not([has-selection-icon])) {\n    background-color: var(--u-tonal-icon-button-bg-color, var(--u-color-secondary-container, rgb(232, 222, 248)));\n    color: var(--u-tonal-icon-button-text-color, var(--u-color-on-secondary-container, rgb(29, 25, 43)));\n  }\n\n  :host([variant=standard]),\n  :host([variant=outlined]) {\n    color: var(--u-standard-icon-button-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n  }\n\n  :host([variant=outlined]) {\n    border: 1px solid var(--u-color-outline, rgb(121, 116, 126));\n    color: var(--u-outlined-icon-button-color, var(--u-standard-icon-button-color, var(--u-color-on-surface-variant, rgb(73, 69, 79))));\n  }\n\n  :host([selected][variant=outlined]) {\n    border: none;\n    background-color: var(--u-outlined-icon-button-selected-bg-color, var(--u-color-inverse-surface, rgb(50, 47, 53)));\n    color: var(--u-outlined-icon-button-selected-text-color, var(--u-color-on-inverse-surface, rgb(245, 239, 247)));\n  }\n\n  :host([selected][variant=standard]) {\n    color: var(--u-standard-icon-button-selected-text-color, var(--_color-primary));\n    background-color: var(--u-standard-icon-button-selected-bg-color, transparent);\n  }\n\n  :host([disabled][variant=outlined]) {\n    background-color: transparent !important;\n    border-color: var(--u-outlined-icon-button-disabled-border-color, rgba(var(--u-color-on-surface-rgb, 29, 27, 32), var(--u-outlined-icon-button-disabled-border-opacity, 0.12))) !important;\n  }\n`;\n"]}
+{"version":3,"file":"icon-button.styles.js","sourceRoot":"","sources":["../../src/button/icon-button.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0EzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n  :host {\n    --_icon-button-size: var(--u-icon-button-size, 2.5rem);\n    --_color-surface-container-highest: var(--u-color-surface-container-highest, rgb(230, 224, 233));\n    width: var(--_icon-button-size);\n    height: var(--_icon-button-size);\n    border-radius: var(--u-icon-button-shape-corner, 9999px);\n    font-family: var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");\n  }\n\n  .icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    font-size: var(--u-icon-button-icon-size, 1.5rem);\n  }\n  .icon.icon-selected {\n    display: none;\n  }\n\n  :host([selected][has-selection-icon]) .icon:not(.icon-selected) {\n    display: none;\n  }\n  :host([selected][has-selection-icon]) .icon.icon-selected {\n    display: inline-block;\n  }\n\n  :host([variant=filled]) {\n    background-color: var(--u-filled-icon-button-unselected-bg-color, var(--_color-surface-container-highest));\n    color: var(--u-filled-icon-button-unselected-text-color, var(--_color-primary));\n  }\n\n  :host([variant=tonal]) {\n    background-color: var(--u-total-icon-button-unselected-bg-color, var(--_color-surface-container-highest));\n    color: var(--u-tonal-icon-button-unselected-text-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n  }\n\n  :host([selected][variant=filled]),\n  :host([variant=filled]:not([has-selection-icon])) {\n    background-color: var(--u-filled-icon-button-bg-color, var(--_color-primary));\n    color: var(--u-filled-icon-button-text-color, var(--u-color-on-primary, rgb(255, 255, 255)));\n  }\n\n  :host([selected][variant=tonal]),\n  :host([variant=tonal]:not([has-selection-icon])) {\n    background-color: var(--u-tonal-icon-button-bg-color, var(--u-color-secondary-container, rgb(232, 222, 248)));\n    color: var(--u-tonal-icon-button-text-color, var(--u-color-on-secondary-container, rgb(29, 25, 43)));\n  }\n\n  :host([variant=standard]),\n  :host([variant=outlined]) {\n    color: var(--u-standard-icon-button-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n  }\n\n  :host([variant=outlined]) {\n    border: 1px solid var(--u-color-outline, rgb(121, 116, 126));\n    color: var(--u-outlined-icon-button-color, var(--u-standard-icon-button-color, var(--u-color-on-surface-variant, rgb(73, 69, 79))));\n  }\n\n  :host([selected][variant=outlined]) {\n    border: none;\n    background-color: var(--u-outlined-icon-button-selected-bg-color, var(--u-color-inverse-surface, rgb(50, 47, 53)));\n    color: var(--u-outlined-icon-button-selected-text-color, var(--u-color-on-inverse-surface, rgb(245, 239, 247)));\n  }\n\n  :host([selected][variant=standard]) {\n    color: var(--u-standard-icon-button-selected-text-color, var(--_color-primary));\n    background-color: var(--u-standard-icon-button-selected-bg-color, transparent);\n  }\n\n  :host([disabled][variant=outlined]) {\n    background-color: transparent !important;\n    border-color: var(--u-outlined-icon-button-disabled-border-color, color-mix(in srgb, var(--u-color-on-surface, rgb(29, 27, 32)) var(--u-outlined-icon-button-disabled-border-opacity, 12%), transparent)) !important;\n  }\n`;\n"]}

package/button-field/button-field.d.ts

@@ -0,0 +1,18 @@
+import { TemplateResult } from 'lit';
+import { UmTextFieldBase } from '../shared/text-field-base/text-field-base.js';
+export declare class UmButtonField extends UmTextFieldBase {
+    static styles: import("lit").CSSResultGroup[];
+    protected _value: string;
+    get value(): string;
+    set value(value: string);
+    _button: HTMLButtonElement;
+    _input: HTMLElement;
+    protected renderControl(): TemplateResult;
+    protected renderAfterContent(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'u-button-field': UmButtonField;
+    }
+}
+//# sourceMappingURL=button-field.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"button-field.d.ts","sourceRoot":"","sources":["../../src/button-field/button-field.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,cAAc,EAAE,MAAM,KAAK,CAAC;AAI3C,OAAO,EAAE,eAAe,EAAE,MAAM,8CAA8C,CAAC;AAG/E,qBACa,aAAc,SAAQ,eAAe;IAChD,OAAgB,MAAM,iCAAoC;IAE1D,SAAS,CAAC,MAAM,SAAM;IACtB,IACI,KAAK,IAIQ,MAAM,CAFtB;IAED,IAAI,KAAK,CAAC,KAAK,EAAE,MAAM,EAItB;IAEuB,OAAO,EAAG,iBAAiB,CAAC;IAC7B,MAAM,EAAG,WAAW,CAAC;cAEzB,aAAa,IAAI,cAAc;cAa/B,kBAAkB,IAAI,cAAc;CAOxD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,gBAAgB,EAAE,aAAa,CAAC;KACjC;CACF"}

package/button-field/button-field.js

@@ -0,0 +1,54 @@
+import { __decorate } from "tslib";
+import { html } from 'lit';
+import { customElement, property, query } from 'lit/decorators.js';
+import { html as staticHtml } from 'lit/static-html.js';
+import { UmTextFieldBase } from '../shared/text-field-base/text-field-base.js';
+import { styles } from './button-field.styles';
+let UmButtonField = class UmButtonField extends UmTextFieldBase {
+    constructor() {
+        super(...arguments);
+        this._value = '';
+    }
+    static { this.styles = [UmTextFieldBase.styles, styles]; }
+    get value() {
+        return this._value;
+    }
+    set value(value) {
+        this._value = value;
+        this.empty = !value;
+        this.elementInternals.setFormValue(value);
+    }
+    renderControl() {
+        return staticHtml `
+      <button 
+         class="button"
+         aria-expanded="false"
+         aria-owns="select"
+         ?disabled=${this.disabled}></button>
+      <div class="input">
+        <slot>${this.value}</slot>
+      </div>
+      <u-ripple ?disabled=${this.disabled}></u-ripple>`;
+    }
+    renderAfterContent() {
+        return html `
+      <u-menu>
+        <slot></slot>
+      </u-menu>
+    `;
+    }
+};
+__decorate([
+    property()
+], UmButtonField.prototype, "value", null);
+__decorate([
+    query('.button', true)
+], UmButtonField.prototype, "_button", void 0);
+__decorate([
+    query('.input', true)
+], UmButtonField.prototype, "_input", void 0);
+UmButtonField = __decorate([
+    customElement('u-button-field')
+], UmButtonField);
+export { UmButtonField };
+//# sourceMappingURL=button-field.js.map

package/button-field/button-field.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button-field.js","sourceRoot":"","sources":["../../src/button-field/button-field.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAkB,MAAM,KAAK,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,IAAI,IAAI,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAExD,OAAO,EAAE,eAAe,EAAE,MAAM,8CAA8C,CAAC;AAC/E,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAGxC,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,eAAe;IAA3C;;QAGK,WAAM,GAAG,EAAE,CAAC;IAmCxB,CAAC;aArCiB,WAAM,GAAG,CAAC,eAAe,CAAC,MAAM,EAAE,MAAM,CAAC,AAAnC,CAAoC;IAI1D,IAAI,KAAK;QACP,OAAO,IAAI,CAAC,MAAM,CAAC;IACrB,CAAC;IAED,IAAI,KAAK,CAAC,KAAa;QACrB,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACpB,IAAI,CAAC,KAAK,GAAG,CAAC,KAAK,CAAC;QACpB,IAAI,CAAC,gBAAgB,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;IAC5C,CAAC;IAKkB,aAAa;QAC9B,OAAO,UAAU,CAAA;;;;;qBAKA,IAAI,CAAC,QAAQ;;gBAElB,IAAI,CAAC,KAAK;;4BAEE,IAAI,CAAC,QAAQ,cAAc,CAAC;IACtD,CAAC;IAEkB,kBAAkB;QACnC,OAAO,IAAI,CAAA;;;;KAIV,CAAC;IACJ,CAAC;;AAhCD;IADC,QAAQ,EAAE;0CAGV;AAQuB;IAAvB,KAAK,CAAC,SAAS,EAAE,IAAI,CAAC;8CAA6B;AAC7B;IAAtB,KAAK,CAAC,QAAQ,EAAE,IAAI,CAAC;6CAAsB;AAhBjC,aAAa;IADzB,aAAa,CAAC,gBAAgB,CAAC;GACnB,aAAa,CAsCzB","sourcesContent":["import { html, TemplateResult } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { html as staticHtml } from 'lit/static-html.js';\n\nimport { UmTextFieldBase } from '../shared/text-field-base/text-field-base.js';\nimport { styles } from './button-field.styles';\n\n@customElement('u-button-field')\nexport class UmButtonField extends UmTextFieldBase {\n  static override styles = [UmTextFieldBase.styles, styles];\n\n  protected _value = '';\n  @property()\n  get value() {\n    return this._value;\n  }\n\n  set value(value: string) {\n    this._value = value;\n    this.empty = !value;\n    this.elementInternals.setFormValue(value);\n  }\n\n  @query('.button', true) _button!: HTMLButtonElement;\n  @query('.input', true) _input!: HTMLElement;\n\n  protected override renderControl(): TemplateResult {\n    return staticHtml`\n      <button \n         class=\"button\"\n         aria-expanded=\"false\"\n         aria-owns=\"select\"\n         ?disabled=${this.disabled}></button>\n      <div class=\"input\">\n        <slot>${this.value}</slot>\n      </div>\n      <u-ripple ?disabled=${this.disabled}></u-ripple>`;\n  }\n\n  protected override renderAfterContent(): TemplateResult {\n    return html`\n      <u-menu>\n        <slot></slot>\n      </u-menu>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-button-field': UmButtonField;\n  }\n}\n"]}

package/button-field/button-field.styles.d.ts

@@ -0,0 +1,2 @@
+export declare const styles: import("lit").CSSResult;
+//# sourceMappingURL=button-field.styles.d.ts.map

package/button-field/button-field.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button-field.styles.d.ts","sourceRoot":"","sources":["../../src/button-field/button-field.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAclB,CAAC"}

package/button-field/button-field.styles.js

@@ -0,0 +1,17 @@
+import { css } from 'lit';
+export const styles = css `
+  :host(:not([disabled])) .container {
+    cursor: pointer;
+  }
+
+  .button {
+    position: absolute;
+    inset: 0;
+    margin: 0;
+    padding: 0;
+    background: transparent;
+    border: none;
+    appearance: none;
+  }
+`;
+//# sourceMappingURL=button-field.styles.js.map

package/button-field/button-field.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button-field.styles.js","sourceRoot":"","sources":["../../src/button-field/button-field.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;;;;;;;;;;;CAczB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n  :host(:not([disabled])) .container {\n    cursor: pointer;\n  }\n\n  .button {\n    position: absolute;\n    inset: 0;\n    margin: 0;\n    padding: 0;\n    background: transparent;\n    border: none;\n    appearance: none;\n  }\n`;\n"]}

package/calendar/calendar-adapter.d.ts

@@ -0,0 +1,6 @@
+export interface CalendarAdapter {
+    getWeekDays(locale: string): string[];
+    getDay(date: Date): string;
+    getMonth(date: Date): string;
+}
+//# sourceMappingURL=calendar-adapter.d.ts.map

package/calendar/calendar-adapter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar-adapter.d.ts","sourceRoot":"","sources":["../../src/calendar/calendar-adapter.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,eAAe;IAC9B,WAAW,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IACtC,MAAM,CAAC,IAAI,EAAE,IAAI,GAAG,MAAM,CAAC;IAC3B,QAAQ,CAAC,IAAI,EAAE,IAAI,GAAG,MAAM,CAAC;CAC9B"}

package/calendar/calendar-adapter.js

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

package/calendar/calendar-adapter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar-adapter.js","sourceRoot":"","sources":["../../src/calendar/calendar-adapter.ts"],"names":[],"mappings":"","sourcesContent":["export interface CalendarAdapter {\n  getWeekDays(locale: string): string[];\n  getDay(date: Date): string;\n  getMonth(date: Date): string;\n}\n"]}

package/calendar/calendar-base.d.ts

@@ -0,0 +1,30 @@
+import { CSSResultGroup } from '@lit/reactive-element/css-tag';
+import { HTMLTemplateResult, LitElement } from 'lit';
+import { DirectiveResult } from 'lit-html/directive.js';
+import { ClassMapDirective } from 'lit-html/directives/class-map';
+import { DefaultCalendarAdapter } from './default-calendar-adapter.js';
+export declare abstract class UmCalendarBase extends LitElement {
+    #private;
+    static styles: CSSResultGroup;
+    weekDays: string[];
+    dateRenderer: ((date: Date, day: string) => HTMLElement) | null;
+    dateOutsideMonth: boolean;
+    get year(): number;
+    set year(year: number);
+    get month(): number;
+    set month(month: number);
+    _displayingMonthDate: Date;
+    locale: string | null;
+    _innerLocale: string;
+    adapter: DefaultCalendarAdapter;
+    protected constructor();
+    connectedCallback(): void;
+    render(): HTMLTemplateResult;
+    protected _getCalendarClassMap(): DirectiveResult<typeof ClassMapDirective> | null;
+    protected abstract _selectDate(date: Date): void;
+    protected abstract _getSelectedDateClasses(date: Date): Record<string, boolean>;
+    protected _getDateFromIsoDate(isoDate: string): Date;
+    protected _getDateString(date: Date | null): string;
+    protected _getDateFromString(dateString: string): Date | null;
+}
+//# sourceMappingURL=calendar-base.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"calendar-base.d.ts","sourceRoot":"","sources":["../../src/calendar/calendar-base.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAE/D,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAC3D,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AACxD,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAKlE,OAAO,EAAE,sBAAsB,EAAE,MAAM,+BAA+B,CAAC;AAEvE,8BAAsB,cAAe,SAAQ,UAAU;;IACrD,OAAgB,MAAM,EAAE,cAAc,CAAY;IAEzC,QAAQ,EAAE,MAAM,EAAE,CAAM;IACxB,YAAY,EAAE,CAAC,CAAC,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,WAAW,CAAC,GAAG,IAAI,CAAQ;IACnD,gBAAgB,UAAS;IAEtD,IAAI,IAAI,IAAI,MAAM,CAEjB;IAED,IAAI,IAAI,CAAC,IAAI,EAAE,MAAM,EAGpB;IAED,IAAI,KAAK,IAAI,MAAM,CAElB;IAED,IAAI,KAAK,CAAC,KAAK,EAAE,MAAM,EAGtB;IAGQ,oBAAoB,EAAE,IAAI,CAAC;IAExB,MAAM,EAAE,MAAM,GAAG,IAAI,CAAQ;IACzC,YAAY,EAAE,MAAM,CAAsB;IAC1C,OAAO,yBAAgC;IAEvC,SAAS;IAWA,iBAAiB;IAejB,MAAM,IAAI,kBAAkB;IAwGrC,SAAS,CAAC,oBAAoB,IAAI,eAAe,CAAC,OAAO,iBAAiB,CAAC,GAAG,IAAI;IAIlF,SAAS,CAAC,QAAQ,CAAC,WAAW,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI;IAChD,SAAS,CAAC,QAAQ,CAAC,uBAAuB,CAAC,IAAI,EAAE,IAAI,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IAE/E,SAAS,CAAC,mBAAmB,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI;IAQpD,SAAS,CAAC,cAAc,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,MAAM;IAenD,SAAS,CAAC,kBAAkB,CAAC,UAAU,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;CAqB9D"}