@universal-material/web 3.0.65 → 3.0.66

package/select/select.d.ts

@@ -0,0 +1,31 @@
+import { PropertyValues } from '@lit/reactive-element';
+import { HTMLTemplateResult } from 'lit';
+import { UmMenu } from '../menu/menu.js';
+import { UmTextFieldBase } from '../shared/text-field-base/text-field-base.js';
+import { UmOption } from './option.js';
+import './option.js';
+export declare class UmSelect extends UmTextFieldBase {
+    #private;
+    static styles: import("lit").CSSResultGroup[];
+    get value(): string;
+    set value(value: string);
+    menu: UmMenu;
+    nativeSelect: HTMLSelectElement;
+    nativeOptions: HTMLOptionElement[];
+    get selectedIndex(): number;
+    set selectedIndex(index: number);
+    get selectedOption(): UmOption | null;
+    private _options;
+    get options(): UmOption[];
+    protected renderControl(): HTMLTemplateResult;
+    protected renderAfterContent(): HTMLTemplateResult;
+    protected updated(changedProperties: PropertyValues): void;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'u-select': UmSelect;
+    }
+}
+//# sourceMappingURL=select.d.ts.map

package/select/select.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../src/select/select.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAQ,kBAAkB,EAAE,MAAM,KAAK,CAAC;AAK/C,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACzC,OAAO,EAAE,eAAe,EAAE,MAAM,8CAA8C,CAAC;AAC/E,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEvC,OAAO,aAAa,CAAC;AAErB,qBACa,QAAS,SAAQ,eAAe;;IAC3C,OAAgB,MAAM,iCAAoC;IAE1D,IACI,KAAK,IAAI,MAAM,CAElB;IACD,IAAI,KAAK,CAAC,KAAK,EAAE,MAAM,EAGtB;IAEgB,IAAI,EAAG,MAAM,CAAC;IACd,YAAY,EAAG,iBAAiB,CAAC;IAC9B,aAAa,EAAG,iBAAiB,EAAE,CAAC;IAExD,IACI,aAAa,IAAI,MAAM,CAE1B;IACD,IAAI,aAAa,CAAC,KAAK,EAAE,MAAM,EAE9B;IAED,IAAI,cAAc,IAAI,QAAQ,GAAG,IAAI,CAEpC;IAED,OAAO,CAAC,QAAQ,CAAkB;IAClC,IAAI,OAAO,IAAI,QAAQ,EAAE,CAExB;cAEkB,aAAa,IAAI,kBAAkB;cAUnC,kBAAkB,IAAI,kBAAkB;cAQxC,OAAO,CAAC,iBAAiB,EAAE,cAAc;IAMnD,iBAAiB;IAMjB,oBAAoB;CAuC9B;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,QAAQ,CAAC;KACtB;CACF"}

package/select/select.js

@@ -0,0 +1,122 @@
+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 __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 _UmSelect_instances, _UmSelect_handleClick, _UmSelect_handleMenuClick, _UmSelect_handleSlotChange, _UmSelect_attach;
+import { html } from 'lit';
+import { customElement, query, queryAll, state } from 'lit/decorators.js';
+import { styles } from './select.styles.js';
+import { UmTextFieldBase } from '../shared/text-field-base/text-field-base.js';
+import { UmOption } from './option.js';
+import './option.js';
+let UmSelect = class UmSelect extends UmTextFieldBase {
+    constructor() {
+        super(...arguments);
+        _UmSelect_instances.add(this);
+        this._options = [];
+        _UmSelect_handleClick.set(this, () => {
+            this.menu.toggle();
+        });
+    }
+    get value() {
+        return this.nativeSelect?.value ?? '';
+    }
+    set value(value) {
+        this.nativeSelect.value = value;
+        this.elementInternals.setFormValue(value);
+    }
+    get selectedIndex() {
+        return this.nativeSelect?.selectedIndex ?? -1;
+    }
+    set selectedIndex(index) {
+        this.nativeSelect.selectedIndex = index;
+    }
+    get selectedOption() {
+        return this.options[this.selectedIndex] ?? null;
+    }
+    get options() {
+        return this._options;
+    }
+    renderControl() {
+        return html `
+      <div class="input">
+        <select>
+          ${this.options.map(o => html `<option value="${o.value}" ?selected=${o._selectedAttribute}>${o.textContent}</option>`)}
+        </select>
+      </div>
+    `;
+    }
+    renderAfterContent() {
+        return html `
+      <u-menu>
+        <slot @slotchange=${__classPrivateFieldGet(this, _UmSelect_instances, "m", _UmSelect_handleSlotChange)}></slot>
+      </u-menu>
+    `;
+    }
+    updated(changedProperties) {
+        super.updated(changedProperties);
+        this.empty = this.nativeSelect && !this.nativeSelect.options[this.nativeSelect.selectedIndex]?.label?.trim();
+        this.elementInternals.setFormValue(this.nativeSelect.value);
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        __classPrivateFieldGet(this, _UmSelect_instances, "m", _UmSelect_attach).call(this);
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this.container.removeEventListener('click', __classPrivateFieldGet(this, _UmSelect_handleClick, "f"));
+        this.menu.removeEventListener('click', __classPrivateFieldGet(this, _UmSelect_instances, "m", _UmSelect_handleMenuClick));
+    }
+};
+_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;
+    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('select')
+], UmSelect.prototype, "nativeSelect", void 0);
+__decorate([
+    queryAll('option')
+], UmSelect.prototype, "nativeOptions", void 0);
+__decorate([
+    state()
+], UmSelect.prototype, "selectedIndex", null);
+UmSelect = __decorate([
+    customElement('u-select')
+], UmSelect);
+export { UmSelect };
+//# sourceMappingURL=select.js.map

package/select/select.js.map

@@ -0,0 +1 @@
+{"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, HTMLTemplateResult } from 'lit';\nimport { customElement, query, queryAll, state } from 'lit/decorators.js';\n\nimport { styles } from './select.styles.js';\n\nimport { UmMenu } from '../menu/menu.js';\nimport { UmTextFieldBase } from '../shared/text-field-base/text-field-base.js';\nimport { UmOption } from './option.js';\n\nimport './option.js';\n\n@customElement('u-select')\nexport class UmSelect extends UmTextFieldBase {\n  static override styles = [UmTextFieldBase.styles, styles];\n\n  @state()\n  get value(): string {\n    return this.nativeSelect?.value ?? '';\n  }\n  set value(value: string) {\n    this.nativeSelect.value = value;\n    this.elementInternals.setFormValue(value);\n  }\n\n  @query('u-menu') menu!: UmMenu;\n  @query('select') nativeSelect!: HTMLSelectElement;\n  @queryAll('option') nativeOptions!: HTMLOptionElement[];\n\n  @state()\n  get selectedIndex(): number {\n    return this.nativeSelect?.selectedIndex ?? -1;\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(): HTMLTemplateResult {\n    return html`\n      <div class=\"input\">\n        <select>\n          ${this.options.map(o => html`<option value=\"${o.value}\" ?selected=${o._selectedAttribute}>${o.textContent}</option>`)}\n        </select>\n      </div>\n    `;\n  }\n\n  protected override renderAfterContent(): HTMLTemplateResult {\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.nativeSelect && !this.nativeSelect.options[this.nativeSelect.selectedIndex]?.label?.trim();\n    this.elementInternals.setFormValue(this.nativeSelect.value);\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n\n    this.#attach();\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\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.container.addEventListener('click', this.#handleClick);\n\n    this.menu.anchorElement = this.container;\n    this.menu.addEventListener('click', this.#handleMenuClick);\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-select': UmSelect;\n  }\n}\n"]}

package/select/select.styles.d.ts

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

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

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

package/select/select.styles.js

@@ -0,0 +1,20 @@
+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%;
+  }
+
+  select {
+    pointer-events: none;
+  }
+`;
+//# sourceMappingURL=select.styles.js.map

package/select/select.styles.js.map

@@ -0,0 +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;;;;;;;;;;;;;;;;;CAiBzB,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  select {\n    pointer-events: none;\n  }\n`;\n"]}

package/shared/text-field-base/text-field-base.styles.js

@@ -1,6 +1,6 @@
 import { css } from 'lit';
 export const styles = css `
-  :host {
+  .container {
     cursor: text;
   }
 `;

package/shared/text-field-base/text-field-base.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"text-field-base.styles.js","sourceRoot":"","sources":["../../../src/shared/text-field-base/text-field-base.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;CAIzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n  :host {\n    cursor: text;\n  }\n`;\n"]}
+{"version":3,"file":"text-field-base.styles.js","sourceRoot":"","sources":["../../../src/shared/text-field-base/text-field-base.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;CAIzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n  .container {\n    cursor: text;\n  }\n`;\n"]}