@universal-material/web 3.0.69 → 3.0.70

package/select/select.js

@@ -4,44 +4,25 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     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 __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
-    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
-    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
-    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
-};
-var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
-    if (kind === "m") throw new TypeError("Private method is not writable");
-    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
-    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
-    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
-};
-var _UmSelect_instances, _UmSelect_navigationController, _UmSelect_connected, _UmSelect_handleClick, _UmSelect_handleMenuClick, _UmSelect_handleSlotChange, _UmSelect_attach;
-import { html } from 'lit';
+import { html, svg } from 'lit';
 import { customElement, query, state } from 'lit/decorators.js';
 import { html as staticHtml } from 'lit/static-html.js';
 import { styles } from './select.styles.js';
 import { UmTextFieldBase } from '../shared/text-field-base/text-field-base.js';
-import { UmOption } from './option.js';
 import { SelectNavigationController } from './select-navigation-controller.js';
 import './option.js';
 let UmSelect = class UmSelect extends UmTextFieldBase {
-    constructor() {
-        super(...arguments);
-        _UmSelect_instances.add(this);
-        this.nativeSelect = document.createElement('select');
-        _UmSelect_navigationController.set(this, new SelectNavigationController(this));
-        _UmSelect_connected.set(this, false);
-        this._options = [];
-        _UmSelect_handleClick.set(this, () => {
-            this.menu.toggle();
-        });
-    }
+    static { this.styles = [UmTextFieldBase.styles, styles]; }
+    #list;
+    #navigationController;
+    #mutationObserver;
+    #connected;
     get value() {
         return this.nativeSelect.value;
     }
     set value(value) {
         this.nativeSelect.value = value;
-        if (!__classPrivateFieldGet(this, _UmSelect_connected, "f")) {
+        if (!this.#connected) {
             return;
         }
         this.elementInternals.setFormValue(value);
@@ -52,82 +33,212 @@ let UmSelect = class UmSelect extends UmTextFieldBase {
     set selectedIndex(index) {
         this.nativeSelect.selectedIndex = index;
     }
-    get selectedOption() {
-        return this.options[this.selectedIndex] ?? null;
+    get selectedOptions() {
+        return this.nativeSelect.selectedOptions.length
+            ? [this.nativeSelect.selectedOptions[0]._parent]
+            : [];
     }
     get options() {
-        return this._options;
+        const options = Array.from(this.querySelectorAll('u-option'));
+        return options
+            .filter(o => o.constructor.name === 'UmOption');
+    }
+    constructor() {
+        super();
+        this.currentOptionIndex = 1;
+        this.nativeSelect = (() => {
+            const select = document.createElement('select');
+            select.setAttribute('tabindex', '-1');
+            select.setAttribute('part', 'select');
+            return select;
+        })();
+        this.#list = (() => {
+            const list = document.createElement('div');
+            list.role = 'listbox';
+            list.id = 'list';
+            list.className = 'list';
+            return list;
+        })();
+        this.#navigationController = new SelectNavigationController(this);
+        this.#connected = false;
+        this.#handleClick = (e) => {
+            this.menu.toggle();
+            if (!this.menu.open || !this.selectedOptions.length) {
+                return;
+            }
+            this.#navigationController.focusMenu(this.selectedOptions[0], e.detail === 0, false);
+        };
+        this.#handleMenuOpen = () => {
+            this.button.setAttribute('aria-expanded', 'true');
+            this.#setSelectedOption();
+        };
+        this.#handleMenuOpened = () => {
+            if (!this.selectedOptions.length) {
+                return;
+            }
+            const option = this.selectedOptions[0];
+            option.scrollIntoView({ block: 'nearest' });
+        };
+        this.#handleMenuClose = () => {
+            this.button.setAttribute('aria-expanded', 'false');
+            this.#navigationController.blurMenu();
+        };
+        this.#mutationObserver = new MutationObserver(() => this._updateOptions());
+        this.#mutationObserver.observe(this, { characterData: true, childList: true, subtree: true });
+    }
+    _updateOptions() {
+        const options = this.options;
+        for (const option of options) {
+            option._select = this;
+        }
+        this.#updateOptions(options);
+        this.#updateAccessibilityList(options);
+        const selectedOption = this.selectedOptions[0];
+        if (!selectedOption) {
+            return;
+        }
+        // eslint-disable-next-line no-self-assign
+        selectedOption.selected = selectedOption.selected;
+        this.empty = !selectedOption.textContent?.trim();
+        this.button.setAttribute('aria-labelledby', selectedOption._listItem.id);
+    }
+    #updateOptions(options) {
+        const maxLength = Math.max(options.length, this.nativeSelect.children.length);
+        for (let i = 0; i < maxLength; i++) {
+            const option = options[i];
+            const nativeOption = this.nativeSelect.children[i];
+            if (!option) {
+                nativeOption.remove();
+                continue;
+            }
+            if (!nativeOption) {
+                this.nativeSelect.appendChild(option._nativeOption);
+                continue;
+            }
+            nativeOption.insertAdjacentElement('beforebegin', option._nativeOption);
+        }
+    }
+    #updateAccessibilityList(options) {
+        const maxLength = Math.max(options.length, this.#list.children.length);
+        for (let i = 0; i < maxLength; i++) {
+            const option = options[i];
+            const item = this.#list.children[i];
+            if (!option) {
+                item.remove();
+                continue;
+            }
+            option._listItem.id = `item-${i + 1}`;
+            if (!item) {
+                this.#list.appendChild(option._listItem);
+                continue;
+            }
+            item.insertAdjacentElement('beforebegin', option._listItem);
+        }
+    }
+    #setSelectedOption() {
+        const options = this.options;
+        const selectedClassOptions = options.filter(o => o.classList.contains('selected'));
+        let found = false;
+        for (const option of selectedClassOptions) {
+            if (option.selected) {
+                found = true;
+                continue;
+            }
+            option.classList.remove('selected');
+        }
+        if (found) {
+            return;
+        }
+        const selectedOption = this.selectedOptions[0];
+        if (selectedOption) {
+            selectedOption.classList.add('selected');
+        }
     }
     renderControl() {
         return staticHtml `
-      <button class="button"></button>
+      <button 
+         class="button"
+         role="combobox"
+         aria-expanded="false"
+         aria-owns="select"
+         ?disabled=${this.disabled}></button>
       <div class="input"></div>`;
     }
     renderAfterContent() {
         return html `
       <u-menu>
-        <slot @slotchange=${__classPrivateFieldGet(this, _UmSelect_instances, "m", _UmSelect_handleSlotChange)}></slot>
+        <slot></slot>
       </u-menu>
     `;
     }
+    renderDefaultTrailingIcon() {
+        return svg `
+      <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 -960 960 960" width="1em" fill="currentColor">
+        <path d="M480-360 280-560h400L480-360Z"/>
+      </svg>`;
+    }
     updated(changedProperties) {
         super.updated(changedProperties);
-        this.empty = !this.selectedOption?.textContent?.trim();
+        this.empty = !this.selectedOptions[0]?.textContent?.trim();
         this.elementInternals.setFormValue(this.nativeSelect.value || null);
     }
+    attributeChangedCallback(name, _old, value) {
+        super.attributeChangedCallback(name, _old, value);
+        if (name !== 'disabled') {
+            return;
+        }
+        this.nativeSelect.disabled = value === null;
+    }
     connectedCallback() {
         super.connectedCallback();
-        __classPrivateFieldSet(this, _UmSelect_connected, true, "f");
-        __classPrivateFieldGet(this, _UmSelect_instances, "m", _UmSelect_attach).call(this);
+        this.#connected = true;
+        this.#attach();
     }
     disconnectedCallback() {
         super.disconnectedCallback();
-        __classPrivateFieldGet(this, _UmSelect_navigationController, "f").detach();
-        __classPrivateFieldSet(this, _UmSelect_connected, false, "f");
+        this.#navigationController.detach();
+        this.#connected = false;
         this.nativeSelect.remove();
-        this.container.removeEventListener('click', __classPrivateFieldGet(this, _UmSelect_handleClick, "f"));
-        this.menu.removeEventListener('click', __classPrivateFieldGet(this, _UmSelect_instances, "m", _UmSelect_handleMenuClick));
+        this.button.removeEventListener('click', this.#handleClick);
+        this.menu.removeEventListener('click', this.#handleMenuClick);
+        this.menu.removeEventListener('open', this.#handleMenuOpen);
+        this.menu.removeEventListener('opened', this.#handleMenuOpened);
+        this.menu.removeEventListener('close', this.#handleMenuClose);
+    }
+    #handleClick;
+    #handleMenuClick(e) {
+        e.stopPropagation();
+    }
+    #handleMenuOpen;
+    #handleMenuOpened;
+    #handleMenuClose;
+    async #attach() {
+        await this.updateComplete;
+        this.nativeSelect.disabled = this.hasAttribute('disabled');
+        this.#navigationController.attach(this);
+        this._updateOptions();
+        this.input.appendChild(this.nativeSelect);
+        this.input.appendChild(this.#list);
+        this.button.addEventListener('click', this.#handleClick);
+        this.menu.anchorElement = this.container;
+        this.menu.addEventListener('click', this.#handleMenuClick);
+        this.menu.addEventListener('open', this.#handleMenuOpen);
+        this.menu.addEventListener('opened', this.#handleMenuOpened);
+        this.menu.addEventListener('close', this.#handleMenuClose);
     }
     get menuItems() {
         return this.options;
     }
 };
-_UmSelect_navigationController = new WeakMap();
-_UmSelect_connected = new WeakMap();
-_UmSelect_handleClick = new WeakMap();
-_UmSelect_instances = new WeakSet();
-_UmSelect_handleMenuClick = function _UmSelect_handleMenuClick(e) {
-    e.stopPropagation();
-};
-_UmSelect_handleSlotChange = function _UmSelect_handleSlotChange(e) {
-    const slot = e.target;
-    const elements = slot.assignedElements({
-        flatten: true
-    });
-    this.options.length = 0;
-    for (const element of elements) {
-        if (element instanceof UmOption) {
-            this.options.push(element);
-        }
-    }
-    this.requestUpdate();
-};
-_UmSelect_attach = async function _UmSelect_attach() {
-    await this.updateComplete;
-    __classPrivateFieldGet(this, _UmSelect_navigationController, "f").attach(this);
-    this.nativeSelect.setAttribute('tabindex', '-1');
-    this.input.appendChild(this.nativeSelect);
-    this.container.addEventListener('click', __classPrivateFieldGet(this, _UmSelect_handleClick, "f"));
-    this.menu.anchorElement = this.container;
-    this.menu.addEventListener('click', __classPrivateFieldGet(this, _UmSelect_instances, "m", _UmSelect_handleMenuClick));
-};
-UmSelect.styles = [UmTextFieldBase.styles, styles];
 __decorate([
     state()
 ], UmSelect.prototype, "value", null);
 __decorate([
     query('u-menu')
 ], UmSelect.prototype, "menu", void 0);
+__decorate([
+    query('.button')
+], UmSelect.prototype, "button", void 0);
 __decorate([
     query('.input')
 ], UmSelect.prototype, "input", void 0);

package/select/select.js.map

@@ -1 +1 @@
-{"version":3,"file":"select.js","sourceRoot":"","sources":["../../src/select/select.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AACA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAE3B,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAChE,OAAO,EAAE,IAAI,IAAI,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAExD,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAI5C,OAAO,EAAE,eAAe,EAAE,MAAM,8CAA8C,CAAC;AAC/E,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,0BAA0B,EAAE,MAAM,mCAAmC,CAAC;AAE/E,OAAO,aAAa,CAAC;AAGd,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,eAAe;IAAtC;;;QAGL,iBAAY,GAAsB,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;QACnE,yCAAwB,IAAI,0BAA0B,CAAC,IAAI,CAAC,EAAC;QAC7D,8BAAa,KAAK,EAAC;QA+BX,aAAQ,GAAe,EAAE,CAAC;QA0ClC,gCAAe,GAAG,EAAE;YAClB,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC;QACrB,CAAC,EAAC;IAuCJ,CAAC;IA/GC,IAAI,KAAK;QACP,OAAO,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC;IACjC,CAAC;IACD,IAAI,KAAK,CAAC,KAAa;QACrB,IAAI,CAAC,YAAY,CAAC,KAAK,GAAG,KAAK,CAAC;QAEhC,IAAI,CAAC,uBAAA,IAAI,2BAAW,EAAE,CAAC;YACrB,OAAO;QACT,CAAC;QAED,IAAI,CAAC,gBAAgB,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;IAC5C,CAAC;IAMD,IAAI,aAAa;QACf,OAAO,IAAI,CAAC,YAAY,CAAC,aAAa,CAAC;IACzC,CAAC;IACD,IAAI,aAAa,CAAC,KAAa;QAC7B,IAAI,CAAC,YAAY,CAAC,aAAa,GAAG,KAAK,CAAC;IAC1C,CAAC;IAED,IAAI,cAAc;QAChB,OAAO,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,IAAI,CAAC;IAClD,CAAC;IAGD,IAAI,OAAO;QACT,OAAO,IAAI,CAAC,QAAQ,CAAC;IACvB,CAAC;IAEkB,aAAa;QAC9B,OAAO,UAAU,CAAA;;gCAEW,CAAC;IAC/B,CAAC;IAEkB,kBAAkB;QACnC,OAAO,IAAI,CAAA;;4BAEa,uBAAA,IAAI,uDAAkB;;KAE7C,CAAC;IACJ,CAAC;IAEkB,OAAO,CAAC,iBAAiC;QAC1D,KAAK,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC;QACjC,IAAI,CAAC,KAAK,GAAG,CAAC,IAAI,CAAC,cAAc,EAAE,WAAW,EAAE,IAAI,EAAE,CAAC;QACvD,IAAI,CAAC,gBAAgB,CAAC,YAAY,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,IAAI,IAAI,CAAC,CAAC;IACtE,CAAC;IAEQ,iBAAiB;QACxB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAE1B,uBAAA,IAAI,uBAAc,IAAI,MAAA,CAAC;QACvB,uBAAA,IAAI,6CAAQ,MAAZ,IAAI,CAAU,CAAC;IACjB,CAAC;IAEQ,oBAAoB;QAC3B,KAAK,CAAC,oBAAoB,EAAE,CAAC;QAE7B,uBAAA,IAAI,sCAAsB,CAAC,MAAM,EAAE,CAAC;QACpC,uBAAA,IAAI,uBAAc,KAAK,MAAA,CAAC;QACxB,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,CAAC;QAC3B,IAAI,CAAC,SAAS,CAAC,mBAAmB,CAAC,OAAO,EAAE,uBAAA,IAAI,6BAAa,CAAC,CAAC;QAC/D,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,OAAO,EAAE,uBAAA,IAAI,sDAAiB,CAAC,CAAC;IAChE,CAAC;IAuCD,IAAI,SAAS;QACX,OAAO,IAAI,CAAC,OAAO,CAAC;IACtB,CAAC;;;;;;+DAnCgB,CAAQ;IACvB,CAAC,CAAC,eAAe,EAAE,CAAC;AACtB,CAAC;iEAEiB,CAAQ;IACxB,MAAM,IAAI,GAAG,CAAC,CAAC,MAAyB,CAAC;IACzC,MAAM,QAAQ,GAAG,IAAI,CAAC,gBAAgB,CAAC;QACrC,OAAO,EAAE,IAAI;KACd,CAAC,CAAC;IAEH,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC;IAExB,KAAK,MAAM,OAAO,IAAI,QAAQ,EAAE,CAAC;QAC/B,IAAI,OAAO,YAAY,QAAQ,EAAE,CAAC;YAChC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;QAC5B,CAAC;IACH,CAAC;IAED,IAAI,CAAC,aAAa,EAAE,CAAC;AACvB,CAAC;mBAED,KAAK;IACH,MAAM,IAAI,CAAC,cAAc,CAAC;IAE1B,uBAAA,IAAI,sCAAsB,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IACxC,IAAI,CAAC,YAAY,CAAC,YAAY,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC;IACjD,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;IAC1C,IAAI,CAAC,SAAS,CAAC,gBAAgB,CAAC,OAAO,EAAE,uBAAA,IAAI,6BAAa,CAAC,CAAC;IAE5D,IAAI,CAAC,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,SAAS,CAAC;IACzC,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,uBAAA,IAAI,sDAAiB,CAAC,CAAC;AAC7D,CAAC;AAhHe,eAAM,GAAG,CAAC,eAAe,CAAC,MAAM,EAAE,MAAM,CAAC,AAAnC,CAAoC;AAO1D;IADC,KAAK,EAAE;qCAGP;AAWgB;IAAhB,KAAK,CAAC,QAAQ,CAAC;sCAAe;AACd;IAAhB,KAAK,CAAC,QAAQ,CAAC;uCAAqB;AAGrC;IADC,KAAK,EAAE;6CAGP;AA3BU,QAAQ;IADpB,aAAa,CAAC,UAAU,CAAC;GACb,QAAQ,CAuHpB","sourcesContent":["import { PropertyValues } from '@lit/reactive-element';\nimport { html } from 'lit';\nimport { TemplateResult } from 'lit-html';\nimport { customElement, query, state } from 'lit/decorators.js';\nimport { html as staticHtml } from 'lit/static-html.js';\n\nimport { styles } from './select.styles.js';\n\nimport { UmMenu } from '../menu/menu.js';\nimport { UmMenuField } from '../shared/menu-field/menu-field.js';\nimport { UmTextFieldBase } from '../shared/text-field-base/text-field-base.js';\nimport { UmOption } from './option.js';\nimport { SelectNavigationController } from './select-navigation-controller.js';\n\nimport './option.js';\n\n@customElement('u-select')\nexport class UmSelect extends UmTextFieldBase implements UmMenuField {\n  static override styles = [UmTextFieldBase.styles, styles];\n\n  nativeSelect: HTMLSelectElement = document.createElement('select');\n  #navigationController = new SelectNavigationController(this);\n  #connected = false;\n\n  @state()\n  get value(): string {\n    return this.nativeSelect.value;\n  }\n  set value(value: string) {\n    this.nativeSelect.value = value;\n\n    if (!this.#connected) {\n      return;\n    }\n\n    this.elementInternals.setFormValue(value);\n  }\n\n  @query('u-menu') menu!: UmMenu;\n  @query('.input') input!: HTMLElement;\n\n  @state()\n  get selectedIndex(): number {\n    return this.nativeSelect.selectedIndex;\n  }\n  set selectedIndex(index: number) {\n    this.nativeSelect.selectedIndex = index;\n  }\n\n  get selectedOption(): UmOption | null {\n    return this.options[this.selectedIndex] ?? null;\n  }\n\n  private _options: UmOption[] = [];\n  get options(): UmOption[] {\n    return this._options;\n  }\n\n  protected override renderControl(): TemplateResult {\n    return staticHtml`\n      <button class=\"button\"></button>\n      <div class=\"input\"></div>`;\n  }\n\n  protected override renderAfterContent(): TemplateResult {\n    return html`\n      <u-menu>\n        <slot @slotchange=${this.#handleSlotChange}></slot>\n      </u-menu>\n    `;\n  }\n\n  protected override updated(changedProperties: PropertyValues) {\n    super.updated(changedProperties);\n    this.empty = !this.selectedOption?.textContent?.trim();\n    this.elementInternals.setFormValue(this.nativeSelect.value || null);\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n\n    this.#connected = true;\n    this.#attach();\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n\n    this.#navigationController.detach();\n    this.#connected = false;\n    this.nativeSelect.remove();\n    this.container.removeEventListener('click', this.#handleClick);\n    this.menu.removeEventListener('click', this.#handleMenuClick);\n  }\n\n  #handleClick = () => {\n    this.menu.toggle();\n  };\n\n  #handleMenuClick(e: Event) {\n    e.stopPropagation();\n  }\n\n  #handleSlotChange(e: Event) {\n    const slot = e.target as HTMLSlotElement;\n    const elements = slot.assignedElements({\n      flatten: true\n    });\n\n    this.options.length = 0;\n\n    for (const element of elements) {\n      if (element instanceof UmOption) {\n        this.options.push(element)\n      }\n    }\n\n    this.requestUpdate();\n  }\n\n  async #attach(): Promise<void> {\n    await this.updateComplete;\n\n    this.#navigationController.attach(this);\n    this.nativeSelect.setAttribute('tabindex', '-1');\n    this.input.appendChild(this.nativeSelect);\n    this.container.addEventListener('click', this.#handleClick);\n\n    this.menu.anchorElement = this.container;\n    this.menu.addEventListener('click', this.#handleMenuClick);\n  }\n\n  get menuItems(): UmOption[] {\n    return this.options;\n  }\n\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-select': UmSelect;\n  }\n}\n"]}
+{"version":3,"file":"select.js","sourceRoot":"","sources":["../../src/select/select.ts"],"names":[],"mappings":"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","sourcesContent":["import { PropertyValues } from '@lit/reactive-element';\nimport { html, svg, TemplateResult } from 'lit';\nimport { customElement, query, state } from 'lit/decorators.js';\nimport { html as staticHtml } from 'lit/static-html.js';\n\nimport { styles } from './select.styles.js';\n\nimport { UmMenu } from '../menu/menu.js';\nimport { UmMenuField } from '../shared/menu-field/menu-field.js';\nimport { UmTextFieldBase } from '../shared/text-field-base/text-field-base.js';\nimport { ExtendedSelect } from './extended-select.js';\nimport { UmOption } from './option.js';\nimport { SelectNavigationController } from './select-navigation-controller.js';\n\nimport './option.js';\n\n@customElement('u-select')\nexport class UmSelect extends UmTextFieldBase implements UmMenuField {\n  currentOptionIndex = 1;\n\n  static override styles = [UmTextFieldBase.styles, styles];\n\n  nativeSelect: ExtendedSelect = (() => {\n    const select = <ExtendedSelect>document.createElement('select');\n    select.setAttribute('tabindex', '-1');\n    select.setAttribute('part', 'select');\n\n    return select;\n  })();\n\n  #list: HTMLElement = (() => {\n    const list = document.createElement('div');\n    list.role = 'listbox';\n    list.id = 'list';\n    list.className = 'list';\n\n    return list;\n  })();\n\n  #navigationController = new SelectNavigationController(this);\n  readonly #mutationObserver: MutationObserver;\n  #connected = false;\n\n  @state()\n  get value(): string {\n    return this.nativeSelect.value;\n  }\n  set value(value: string) {\n    this.nativeSelect.value = value;\n\n    if (!this.#connected) {\n      return;\n    }\n\n    this.elementInternals.setFormValue(value);\n  }\n\n  @query('u-menu') menu!: UmMenu;\n  @query('.button') button!: HTMLButtonElement;\n  @query('.input') input!: HTMLElement;\n\n  @state()\n  get selectedIndex(): number {\n    return this.nativeSelect.selectedIndex;\n  }\n  set selectedIndex(index: number) {\n    this.nativeSelect.selectedIndex = index;\n  }\n\n  get selectedOptions(): UmOption[] {\n    return this.nativeSelect.selectedOptions.length\n      ? [this.nativeSelect.selectedOptions[0]._parent]\n      : [];\n  }\n\n  get options(): UmOption[] {\n    const options = Array.from(this.querySelectorAll<UmOption>('u-option'));\n\n    return options\n      .filter(o => o.constructor.name === 'UmOption');\n  }\n\n  constructor() {\n    super();\n\n    this.#mutationObserver = new MutationObserver(() => this._updateOptions())\n    this.#mutationObserver.observe(this, {characterData: true, childList: true, subtree: true});\n  }\n\n  _updateOptions() {\n\n    const options = this.options;\n\n    for (const option of options) {\n      option._select = this;\n    }\n\n    this.#updateOptions(options);\n    this.#updateAccessibilityList(options);\n\n    const selectedOption = this.selectedOptions[0];\n\n    if (!selectedOption) {\n      return;\n    }\n\n    // eslint-disable-next-line no-self-assign\n    selectedOption.selected = selectedOption.selected;\n    this.empty = !selectedOption.textContent?.trim();\n    this.button.setAttribute('aria-labelledby', selectedOption._listItem.id)\n  }\n\n  #updateOptions(options: UmOption[]) {\n    const maxLength = Math.max(options.length, this.nativeSelect.children.length);\n\n    for (let i = 0; i < maxLength; i++) {\n      const option = options[i];\n      const nativeOption = this.nativeSelect.children[i];\n\n      if (!option) {\n        nativeOption.remove();\n        continue;\n      }\n\n      if (!nativeOption) {\n        this.nativeSelect.appendChild(option._nativeOption);\n        continue;\n      }\n\n      nativeOption.insertAdjacentElement('beforebegin', option._nativeOption);\n    }\n  }\n\n  #updateAccessibilityList(options: UmOption[]) {\n\n    const maxLength = Math.max(options.length, this.#list.children.length);\n\n    for (let i = 0; i < maxLength; i++) {\n      const option = options[i];\n      const item = this.#list.children[i];\n\n      if (!option) {\n        item.remove();\n        continue;\n      }\n\n      option._listItem.id = `item-${i + 1}`;\n\n      if (!item) {\n        this.#list.appendChild(option._listItem);\n        continue;\n      }\n\n      item.insertAdjacentElement('beforebegin', option._listItem);\n    }\n  }\n\n  #setSelectedOption() {\n    const options = this.options;\n\n    const selectedClassOptions = options.filter(o => o.classList.contains('selected'));\n\n    let found = false;\n\n    for (const option of selectedClassOptions) {\n      if (option.selected) {\n        found = true;\n        continue;\n      }\n \n      option.classList.remove('selected');\n    }\n\n    if (found) {\n      return;\n    }\n\n    const selectedOption = this.selectedOptions[0];\n\n    if (selectedOption) {\n      selectedOption.classList.add('selected');\n    }\n  }\n\n  protected override renderControl(): TemplateResult {\n    return staticHtml`\n      <button \n         class=\"button\"\n         role=\"combobox\"\n         aria-expanded=\"false\"\n         aria-owns=\"select\"\n         ?disabled=${this.disabled}></button>\n      <div class=\"input\"></div>`;\n  }\n\n  protected override renderAfterContent(): TemplateResult {\n    return html`\n      <u-menu>\n        <slot></slot>\n      </u-menu>\n    `;\n  }\n\n  protected override renderDefaultTrailingIcon(): TemplateResult {\n    return svg`\n      <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"1em\" viewBox=\"0 -960 960 960\" width=\"1em\" fill=\"currentColor\">\n        <path d=\"M480-360 280-560h400L480-360Z\"/>\n      </svg>`;\n  }\n\n  protected override updated(changedProperties: PropertyValues) {\n    super.updated(changedProperties);\n    this.empty = !this.selectedOptions[0]?.textContent?.trim();\n    this.elementInternals.setFormValue(this.nativeSelect.value || null);\n  }\n\n  override attributeChangedCallback(name: string, _old: string | null, value: string | null) {\n    super.attributeChangedCallback(name, _old, value);\n\n    if (name !== 'disabled') {\n      return;\n    }\n\n    this.nativeSelect.disabled = value === null;\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n\n    this.#connected = true;\n    this.#attach();\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n\n    this.#navigationController.detach();\n    this.#connected = false;\n    this.nativeSelect.remove();\n    this.button.removeEventListener('click', this.#handleClick);\n    this.menu.removeEventListener('click', this.#handleMenuClick);\n    this.menu.removeEventListener('open', this.#handleMenuOpen);\n    this.menu.removeEventListener('opened', this.#handleMenuOpened);\n    this.menu.removeEventListener('close', this.#handleMenuClose);\n  }\n\n  #handleClick = (e: MouseEvent) => {\n    this.menu.toggle();\n\n    if (!this.menu.open || !this.selectedOptions.length) {\n      return;\n    }\n\n    this.#navigationController.focusMenu(this.selectedOptions[0], e.detail === 0, false);\n  };\n\n  #handleMenuClick(e: Event) {\n    e.stopPropagation();\n  }\n\n  #handleMenuOpen = () => {\n    this.button.setAttribute('aria-expanded', 'true');\n    this.#setSelectedOption();\n  };\n\n  #handleMenuOpened = () => {\n    if (!this.selectedOptions.length) {\n      return;\n    }\n\n    const option = this.selectedOptions[0];\n    option.scrollIntoView({block: 'nearest'});\n  };\n\n  #handleMenuClose = () => {\n    this.button.setAttribute('aria-expanded', 'false');\n    this.#navigationController.blurMenu();\n  };\n\n  async #attach(): Promise<void> {\n    await this.updateComplete;\n\n    this.nativeSelect.disabled = this.hasAttribute('disabled');\n\n    this.#navigationController.attach(this);\n    this._updateOptions();\n\n    this.input.appendChild(this.nativeSelect);\n    this.input.appendChild(this.#list);\n    this.button.addEventListener('click', this.#handleClick);\n\n    this.menu.anchorElement = this.container;\n    this.menu.addEventListener('click', this.#handleMenuClick);\n    this.menu.addEventListener('open', this.#handleMenuOpen);\n    this.menu.addEventListener('opened', this.#handleMenuOpened);\n    this.menu.addEventListener('close', this.#handleMenuClose);\n  }\n\n  get menuItems(): UmOption[] {\n    return this.options;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-select': UmSelect;\n  }\n}\n"]}

package/select/select.styles.d.ts.map

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

package/select/select.styles.js

@@ -1,16 +1,16 @@
 import { css } from 'lit';
 export const styles = css `
-  .container {
-    cursor: pointer;
-  }
-
   u-menu {
     display: block;
     width: 100%;
   }
   u-menu::part(menu) {
-    width: 100%;
-    max-width: 100%;
+    min-width: 100%;
+    max-width: 50vw;
+  }
+
+  :host(:not([disabled])) .button {
+    cursor: pointer;
   }
 
   .button {
@@ -25,6 +25,15 @@ export const styles = css `
 
   select {
     pointer-events: none;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+  }
+
+  .list {
+    width: 2px;
+    height: 2px;
+    margin: -1px;
+    overflow: hidden;
   }
 `;
 //# sourceMappingURL=select.styles.js.map

package/select/select.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"select.styles.js","sourceRoot":"","sources":["../../src/select/select.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2BzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n  .container {\n    cursor: pointer;\n  }\n\n  u-menu {\n    display: block;\n    width: 100%;\n  }\n  u-menu::part(menu) {\n    width: 100%;\n    max-width: 100%;\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  select {\n    pointer-events: none;\n  }\n`;\n"]}
+{"version":3,"file":"select.styles.js","sourceRoot":"","sources":["../../src/select/select.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoCzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n  u-menu {\n    display: block;\n    width: 100%;\n  }\n  u-menu::part(menu) {\n    min-width: 100%;\n    max-width: 50vw;\n  }\n\n  :host(:not([disabled])) .button {\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  select {\n    pointer-events: none;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n  }\n\n  .list {\n    width: 2px;\n    height: 2px;\n    margin: -1px;\n    overflow: hidden;\n  }\n`;\n"]}

package/shared/button-wrapper.d.ts

@@ -1,8 +1,10 @@
+import { CSSResultGroup } from '@lit/reactive-element/css-tag';
 import { HTMLTemplateResult, LitElement } from 'lit';
 import '../elevation/elevation.js';
 import '../ripple/ripple.js';
 export declare abstract class UmButtonWrapper extends LitElement {
     #private;
+    static styles: CSSResultGroup;
     /**
      * Whether the button is disabled or not.
      */

package/shared/button-wrapper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button-wrapper.d.ts","sourceRoot":"","sources":["../../src/shared/button-wrapper.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAW,MAAM,KAAK,CAAC;AAMpE,OAAO,2BAA2B,CAAC;AACnC,OAAO,qBAAqB,CAAC;AAE7B,8BAAsB,eAAgB,SAAQ,UAAU;;IAEtD;;OAEG;IACuC,QAAQ,UAAS;IAElD,YAAY,UAAQ;IAE7B;;OAEG;IACS,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAErC;;;OAGG;IACS,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC;IAE3B,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAEnB,QAAQ,CAAC,aAAa,EAAG,WAAW,CAAC;IACpC,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAY;IAEtD,SAAS,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAQ;IAE1C,IAAI,QAAQ,IAAI,MAAM,CAErB;cAEkB,MAAM,IAAI,kBAAkB;IAM/C,OAAO,CAAC,YAAY;IAiBpB,OAAO,CAAC,UAAU;IAiBlB,SAAS,CAAC,QAAQ,CAAC,aAAa,IAAI,kBAAkB;IAE7C,iBAAiB;IAMjB,oBAAoB;IAMpB,KAAK;IAIL,IAAI;IAKb,SAAS,CAAC,YAAY,IAAI,MAAM,GAAG,IAAI;IAIvC,OAAO,CAAC,iBAAiB;IA8BzB,SAAS,CAAC,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,IAAI;CAGxC"}
+{"version":3,"file":"button-wrapper.d.ts","sourceRoot":"","sources":["../../src/shared/button-wrapper.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAC/D,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAW,MAAM,KAAK,CAAC;AASpE,OAAO,2BAA2B,CAAC;AACnC,OAAO,qBAAqB,CAAC;AAE7B,8BAAsB,eAAgB,SAAQ,UAAU;;IAEtD,OAAgB,MAAM,EAAE,cAAc,CAAuB;IAE7D;;OAEG;IACuC,QAAQ,UAAS;IAElD,YAAY,UAAQ;IAE7B;;OAEG;IACS,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAErC;;;OAGG;IACS,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC;IAE3B,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAEnB,QAAQ,CAAC,aAAa,EAAG,WAAW,CAAC;IACpC,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAY;IAEtD,SAAS,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAQ;IAE1C,IAAI,QAAQ,IAAI,MAAM,CAErB;cAEkB,MAAM,IAAI,kBAAkB;IAM/C,OAAO,CAAC,YAAY;IAiBpB,OAAO,CAAC,UAAU;IAiBlB,SAAS,CAAC,QAAQ,CAAC,aAAa,IAAI,kBAAkB;IAE7C,iBAAiB;IAMjB,oBAAoB;IAMpB,KAAK;IAIL,IAAI;IAKb,SAAS,CAAC,YAAY,IAAI,MAAM,GAAG,IAAI;IAIvC,OAAO,CAAC,iBAAiB;IA8BzB,SAAS,CAAC,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,IAAI;CAGxC"}

package/shared/button-wrapper.js

@@ -4,21 +4,16 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     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 __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
-    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
-    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
-    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
-};
-var _UmButtonWrapper_instances, _UmButtonWrapper_innerClickHandler;
 import { html, LitElement, nothing } from 'lit';
 import { property, query, state } from 'lit/decorators.js';
+import { styles as baseStyles } from './base.styles.js';
+import { styles } from './button-wrapper.styles';
 import { redispatchEvent } from './redispatch-event.js';
 import '../elevation/elevation.js';
 import '../ripple/ripple.js';
 export class UmButtonWrapper extends LitElement {
     constructor() {
         super(...arguments);
-        _UmButtonWrapper_instances.add(this);
         /**
          * Whether the button is disabled or not.
          */
@@ -26,6 +21,7 @@ export class UmButtonWrapper extends LitElement {
         this.renderRipple = true;
         this.innerRole = null;
     }
+    static { this.styles = [baseStyles, styles]; }
     get pathname() {
         return this.buttonElement?.pathname;
     }
@@ -44,7 +40,7 @@ export class UmButtonWrapper extends LitElement {
         aria-labelledby="${this.getAriaLabel() ? nothing : 'text'}"
         .role=${this.innerRole}
         type="button"
-        @click=${__classPrivateFieldGet(this, _UmButtonWrapper_instances, "m", _UmButtonWrapper_innerClickHandler)}>
+        @click=${this.#innerClickHandler}>
         <u-ripple ?disabled=${this.disabled || !this.renderRipple}></u-ripple>
         <u-elevation></u-elevation>
       </button>
@@ -60,7 +56,7 @@ export class UmButtonWrapper extends LitElement {
       aria-labelledby="${this.ariaLabel ? nothing : 'text'}"
       .role=${this.innerRole}
       target=${this.target || nothing}
-      @click=${__classPrivateFieldGet(this, _UmButtonWrapper_instances, "m", _UmButtonWrapper_innerClickHandler)}>
+      @click=${this.#innerClickHandler}>
       <u-elevation></u-elevation>
       <u-ripple ?disabled=${this.disabled || !this.renderRipple}></u-ripple>
     </a>
@@ -91,22 +87,22 @@ export class UmButtonWrapper extends LitElement {
         this.removeAttribute('tabindex');
         setTimeout(() => this.buttonElement?.focus());
     }
+    #innerClickHandler(event) {
+        if (this.disabled) {
+            return;
+        }
+        const preventDefault = !redispatchEvent(this, event);
+        if (preventDefault) {
+            return;
+        }
+        if (!event.pointerType) {
+            this.ripple.createRipple();
+        }
+        this.handleClick(event);
+    }
     handleClick(_) {
     }
 }
-_UmButtonWrapper_instances = new WeakSet(), _UmButtonWrapper_innerClickHandler = function _UmButtonWrapper_innerClickHandler(event) {
-    if (this.disabled) {
-        return;
-    }
-    const preventDefault = !redispatchEvent(this, event);
-    if (preventDefault) {
-        return;
-    }
-    if (!event.pointerType) {
-        this.ripple.createRipple();
-    }
-    this.handleClick(event);
-};
 __decorate([
     property({ type: Boolean, reflect: true })
 ], UmButtonWrapper.prototype, "disabled", void 0);

package/shared/button-wrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"button-wrapper.js","sourceRoot":"","sources":["../../src/shared/button-wrapper.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, HTMLTemplateResult, LitElement, nothing } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\n\nimport { UmRipple } from '../ripple/ripple.js';\nimport { redispatchEvent } from './redispatch-event.js';\n\nimport '../elevation/elevation.js';\nimport '../ripple/ripple.js';\n\nexport abstract class UmButtonWrapper extends LitElement {\n\n  /**\n   * Whether the button is disabled or not.\n   */\n  @property({type: Boolean, reflect: true}) disabled = false;\n\n  @state() renderRipple = true;\n\n  /**\n   * The URL that the link button points to.\n   */\n  @property() href: string | undefined;\n\n  /**\n   * Where to display the linked `href` URL for a link button. Common options\n   * include `_blank` to open in a new tab.\n   */\n  @property() target: string | undefined;\n\n  @property() name: string | undefined;\n\n  @query('.button') readonly buttonElement!: HTMLElement;\n  @query('u-ripple') private readonly ripple!: UmRipple;\n\n  protected innerRole: string | null = null;\n\n  get pathname(): string {\n    return (<HTMLAnchorElement>this.buttonElement)?.pathname\n  }\n\n  protected override render(): HTMLTemplateResult {\n    return typeof this.href === 'string'\n      ? this.renderLink()\n      : this.renderButton();\n  }\n\n  private renderButton() {\n    return html`\n      <button\n        id=\"button\"\n        class=\"button focus-ring\"\n        ?disabled=${this.disabled}\n        aria-label=${this.getAriaLabel() || nothing}\n        aria-labelledby=\"${this.getAriaLabel() ? nothing : 'text'}\"\n        .role=${this.innerRole}\n        type=\"button\"\n        @click=${this.#innerClickHandler}>\n        <u-ripple ?disabled=${this.disabled || !this.renderRipple}></u-ripple>\n        <u-elevation></u-elevation>\n      </button>\n      <div class=\"content\">${this.renderContent()}</div>`;\n  }\n\n  private renderLink() {\n    return html`<a\n      id=\"link\"\n      class=\"button\"\n      href=${this.disabled ? nothing : this.href}\n      aria-disabled=${this.disabled || nothing}\n      aria-label=${this.ariaLabel || nothing}\n      aria-labelledby=\"${this.ariaLabel ? nothing : 'text'}\"\n      .role=${this.innerRole}\n      target=${this.target || nothing}\n      @click=${this.#innerClickHandler}>\n      <u-elevation></u-elevation>\n      <u-ripple ?disabled=${this.disabled || !this.renderRipple}></u-ripple>\n    </a>\n    <div class=\"content\">${this.renderContent()}</div>`;\n  }\n\n  protected abstract renderContent(): HTMLTemplateResult;\n\n  override connectedCallback() {\n    super.connectedCallback();\n\n    this.addEventListener('focus', this.innerFocusHandler)\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n\n    this.removeEventListener('focus', this.innerFocusHandler);\n  }\n\n  override focus() {\n    this.buttonElement?.focus();\n  }\n\n  override blur() {\n\n    this.buttonElement?.blur();\n  }\n\n  protected getAriaLabel(): string | null {\n    return this.ariaLabel;\n  }\n\n  private innerFocusHandler(): void {\n    const tabIndexAttributeValue = this.getAttribute('tabindex');\n\n    if (tabIndexAttributeValue !== \"0\") {\n      return;\n    }\n \n    this.removeAttribute('tabindex');\n    setTimeout(() => this.buttonElement?.focus());\n  }\n\n  #innerClickHandler(event: MouseEvent): void {\n    \n    if (this.disabled) {\n      return;\n    }\n\n    const preventDefault = !redispatchEvent(this, event);\n\n    if (preventDefault) {\n      return;\n    }\n\n    if (!(<PointerEvent>event).pointerType) {\n      this.ripple.createRipple();\n    }\n\n    this.handleClick(event);\n  }\n\n  protected handleClick(_: UIEvent): void {\n\n  }\n}\n"]}
+{"version":3,"file":"button-wrapper.js","sourceRoot":"","sources":["../../src/shared/button-wrapper.ts"],"names":[],"mappings":"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","sourcesContent":["import { CSSResultGroup } from '@lit/reactive-element/css-tag';\nimport { html, HTMLTemplateResult, LitElement, nothing } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\n\nimport { styles as baseStyles } from './base.styles.js';\n\nimport { UmRipple } from '../ripple/ripple.js';\nimport { styles } from './button-wrapper.styles';\nimport { redispatchEvent } from './redispatch-event.js';\n\nimport '../elevation/elevation.js';\nimport '../ripple/ripple.js';\n\nexport abstract class UmButtonWrapper extends LitElement {\n\n  static override styles: CSSResultGroup = [baseStyles, styles]\n\n  /**\n   * Whether the button is disabled or not.\n   */\n  @property({type: Boolean, reflect: true}) disabled = false;\n\n  @state() renderRipple = true;\n\n  /**\n   * The URL that the link button points to.\n   */\n  @property() href: string | undefined;\n\n  /**\n   * Where to display the linked `href` URL for a link button. Common options\n   * include `_blank` to open in a new tab.\n   */\n  @property() target: string | undefined;\n\n  @property() name: string | undefined;\n\n  @query('.button') readonly buttonElement!: HTMLElement;\n  @query('u-ripple') private readonly ripple!: UmRipple;\n\n  protected innerRole: string | null = null;\n\n  get pathname(): string {\n    return (<HTMLAnchorElement>this.buttonElement)?.pathname\n  }\n\n  protected override render(): HTMLTemplateResult {\n    return typeof this.href === 'string'\n      ? this.renderLink()\n      : this.renderButton();\n  }\n\n  private renderButton() {\n    return html`\n      <button\n        id=\"button\"\n        class=\"button focus-ring\"\n        ?disabled=${this.disabled}\n        aria-label=${this.getAriaLabel() || nothing}\n        aria-labelledby=\"${this.getAriaLabel() ? nothing : 'text'}\"\n        .role=${this.innerRole}\n        type=\"button\"\n        @click=${this.#innerClickHandler}>\n        <u-ripple ?disabled=${this.disabled || !this.renderRipple}></u-ripple>\n        <u-elevation></u-elevation>\n      </button>\n      <div class=\"content\">${this.renderContent()}</div>`;\n  }\n\n  private renderLink() {\n    return html`<a\n      id=\"link\"\n      class=\"button\"\n      href=${this.disabled ? nothing : this.href}\n      aria-disabled=${this.disabled || nothing}\n      aria-label=${this.ariaLabel || nothing}\n      aria-labelledby=\"${this.ariaLabel ? nothing : 'text'}\"\n      .role=${this.innerRole}\n      target=${this.target || nothing}\n      @click=${this.#innerClickHandler}>\n      <u-elevation></u-elevation>\n      <u-ripple ?disabled=${this.disabled || !this.renderRipple}></u-ripple>\n    </a>\n    <div class=\"content\">${this.renderContent()}</div>`;\n  }\n\n  protected abstract renderContent(): HTMLTemplateResult;\n\n  override connectedCallback() {\n    super.connectedCallback();\n\n    this.addEventListener('focus', this.innerFocusHandler)\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n\n    this.removeEventListener('focus', this.innerFocusHandler);\n  }\n\n  override focus() {\n    this.buttonElement?.focus();\n  }\n\n  override blur() {\n\n    this.buttonElement?.blur();\n  }\n\n  protected getAriaLabel(): string | null {\n    return this.ariaLabel;\n  }\n\n  private innerFocusHandler(): void {\n    const tabIndexAttributeValue = this.getAttribute('tabindex');\n\n    if (tabIndexAttributeValue !== \"0\") {\n      return;\n    }\n \n    this.removeAttribute('tabindex');\n    setTimeout(() => this.buttonElement?.focus());\n  }\n\n  #innerClickHandler(event: MouseEvent): void {\n    \n    if (this.disabled) {\n      return;\n    }\n\n    const preventDefault = !redispatchEvent(this, event);\n\n    if (preventDefault) {\n      return;\n    }\n\n    if (!(<PointerEvent>event).pointerType) {\n      this.ripple.createRipple();\n    }\n\n    this.handleClick(event);\n  }\n\n  protected handleClick(_: UIEvent): void {\n\n  }\n}\n"]}

package/shared/button-wrapper.styles.d.ts

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

package/shared/button-wrapper.styles.d.ts.map

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

package/shared/button-wrapper.styles.js

@@ -0,0 +1,63 @@
+import { css } from 'lit';
+export const styles = css `
+  :host {
+    --_color-primary: var(--u-color-primary, rgb(103, 80, 164));
+    -webkit-tap-highlight-color: transparent;
+    --u-elevation-level: 0;
+    position: relative;
+    display: inline-block;
+    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");
+    appearance: none !important;
+  }
+
+  :host([disabled]) {
+    --u-elevation-level: 0 !important;
+    background-color: var(--u-button-disabled-background-color, rgba(var(--u-color-on-surface-rgb, 29, 27, 32), var(--u-button-disabled-background-opacity, 0.12))) !important;
+    color: var(--u-button-disabled-text-color, rgba(var(--u-color-on-surface-rgb, 29, 27, 32), var(--u-button-disabled-color, 0.38))) !important;
+  }
+
+  :host([disabled]) .button {
+    cursor: default;
+  }
+
+  * {
+    color: inherit;
+  }
+
+  u-elevation {
+    z-index: -1;
+  }
+
+  .button {
+    cursor: pointer;
+    position: absolute;
+    inset-inline-start: 0;
+    inset-block-start: 0;
+    width: 100%;
+    height: 100%;
+    font-family: inherit;
+    border-radius: inherit;
+    color: inherit;
+    border: none;
+    margin: 0;
+    padding: 0;
+    text-align: center;
+    white-space: nowrap;
+    background: transparent;
+    user-select: none;
+    text-decoration: none;
+    outline: 0;
+    z-index: 0;
+  }
+
+  .content {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    white-space: nowrap;
+    border-radius: inherit;
+    width: 100%;
+    height: 100%;
+  }
+`;
+//# sourceMappingURL=button-wrapper.styles.js.map

package/shared/button-wrapper.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button-wrapper.styles.js","sourceRoot":"","sources":["../../src/shared/button-wrapper.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4DzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n  :host {\n    --_color-primary: var(--u-color-primary, rgb(103, 80, 164));\n    -webkit-tap-highlight-color: transparent;\n    --u-elevation-level: 0;\n    position: relative;\n    display: inline-block;\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    appearance: none !important;\n  }\n\n  :host([disabled]) {\n    --u-elevation-level: 0 !important;\n    background-color: var(--u-button-disabled-background-color, rgba(var(--u-color-on-surface-rgb, 29, 27, 32), var(--u-button-disabled-background-opacity, 0.12))) !important;\n    color: var(--u-button-disabled-text-color, rgba(var(--u-color-on-surface-rgb, 29, 27, 32), var(--u-button-disabled-color, 0.38))) !important;\n  }\n\n  :host([disabled]) .button {\n    cursor: default;\n  }\n\n  * {\n    color: inherit;\n  }\n\n  u-elevation {\n    z-index: -1;\n  }\n\n  .button {\n    cursor: pointer;\n    position: absolute;\n    inset-inline-start: 0;\n    inset-block-start: 0;\n    width: 100%;\n    height: 100%;\n    font-family: inherit;\n    border-radius: inherit;\n    color: inherit;\n    border: none;\n    margin: 0;\n    padding: 0;\n    text-align: center;\n    white-space: nowrap;\n    background: transparent;\n    user-select: none;\n    text-decoration: none;\n    outline: 0;\n    z-index: 0;\n  }\n\n  .content {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    white-space: nowrap;\n    border-radius: inherit;\n    width: 100%;\n    height: 100%;\n  }\n`;\n"]}

package/shared/compare-text.d.ts

@@ -0,0 +1,2 @@
+export declare function normalizedStartsWith(text: string | null, term: string | null): boolean;
+//# sourceMappingURL=compare-text.d.ts.map

package/shared/compare-text.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"compare-text.d.ts","sourceRoot":"","sources":["../../src/shared/compare-text.ts"],"names":[],"mappings":"AAEA,wBAAgB,oBAAoB,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,EAAE,IAAI,EAAE,MAAM,GAAG,IAAI,GAAG,OAAO,CAEtF"}

package/shared/compare-text.js

@@ -0,0 +1,5 @@
+import { normalizeText } from './normalize-text.js';
+export function normalizedStartsWith(text, term) {
+    return normalizeText(text).toLowerCase().startsWith(normalizeText(term).toLowerCase());
+}
+//# sourceMappingURL=compare-text.js.map