@universal-material/web 3.0.67 → 3.0.69

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (42) hide show
  1. package/custom-elements.json +1930 -1659
  2. package/menu/menu-item.d.ts.map +1 -1
  3. package/menu/menu-item.js +3 -1
  4. package/menu/menu-item.js.map +1 -1
  5. package/menu/menu.d.ts +1 -1
  6. package/menu/menu.d.ts.map +1 -1
  7. package/menu/menu.js +15 -18
  8. package/menu/menu.js.map +1 -1
  9. package/menu/menu.styles.d.ts.map +1 -1
  10. package/menu/menu.styles.js +1 -0
  11. package/menu/menu.styles.js.map +1 -1
  12. package/package.json +1 -1
  13. package/progress/circular-progress.d.ts.map +1 -1
  14. package/progress/circular-progress.js +0 -3
  15. package/progress/circular-progress.js.map +1 -1
  16. package/select/option.d.ts +0 -1
  17. package/select/option.d.ts.map +1 -1
  18. package/select/option.js +22 -14
  19. package/select/option.js.map +1 -1
  20. package/select/select-navigation-controller.d.ts +6 -0
  21. package/select/select-navigation-controller.d.ts.map +1 -0
  22. package/select/select-navigation-controller.js +17 -0
  23. package/select/select-navigation-controller.js.map +1 -0
  24. package/select/select.d.ts +3 -1
  25. package/select/select.d.ts.map +1 -1
  26. package/select/select.js +19 -8
  27. package/select/select.js.map +1 -1
  28. package/select/select.styles.d.ts.map +1 -1
  29. package/select/select.styles.js +10 -0
  30. package/select/select.styles.js.map +1 -1
  31. package/shared/menu-field/menu-field-navigation-controller.d.ts +13 -0
  32. package/shared/menu-field/menu-field-navigation-controller.d.ts.map +1 -0
  33. package/shared/menu-field/menu-field-navigation-controller.js +78 -0
  34. package/shared/menu-field/menu-field-navigation-controller.js.map +1 -0
  35. package/shared/menu-field/menu-field.d.ts +7 -0
  36. package/shared/menu-field/menu-field.d.ts.map +1 -0
  37. package/shared/menu-field/menu-field.js +2 -0
  38. package/shared/menu-field/menu-field.js.map +1 -0
  39. package/typeahead/typeahead.d.ts +0 -3
  40. package/typeahead/typeahead.d.ts.map +1 -1
  41. package/typeahead/typeahead.js +11 -41
  42. package/typeahead/typeahead.js.map +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"menu-item.d.ts","sourceRoot":"","sources":["../../src/menu/menu-item.ts"],"names":[],"mappings":"AACA,OAAO,EAAQ,kBAAkB,EAAE,MAAM,KAAK,CAAC;AAK/C,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAE9D,qBACa,UAAW,SAAQ,eAAe;;IAE7C,OAAgB,MAAM,0BAAU;IAIhC;;OAEG;IACH,IACI,MAAM,IAAI,OAAO,CAEpB;IACD,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,EASzB;IAED;;;;OAIG;IAC8D,OAAO,UAAS;IAEjF;;;;OAIG;IAC+D,QAAQ,UAAS;IAGnF,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAiB;IAEtC,SAAS,SAAc;IAEvB,iBAAiB;cAKP,aAAa,IAAI,kBAAkB;IAYtD,OAAO,CAAC,oBAAoB;CAG7B;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,UAAU,CAAC;KAC3B;CACF"}
1
+ {"version":3,"file":"menu-item.d.ts","sourceRoot":"","sources":["../../src/menu/menu-item.ts"],"names":[],"mappings":"AACA,OAAO,EAAQ,kBAAkB,EAAE,MAAM,KAAK,CAAC;AAK/C,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAE9D,qBACa,UAAW,SAAQ,eAAe;;IAE7C,OAAgB,MAAM,0BAAU;IAIhC;;OAEG;IACH,IACI,MAAM,IAAI,OAAO,CAEpB;IACD,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,EASzB;IAED;;;;OAIG;IAC8D,OAAO,UAAS;IAEjF;;;;OAIG;IAC+D,QAAQ,UAAS;IAGnF,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAiB;IAEtC,SAAS,SAAc;IAEvB,iBAAiB;cAKP,aAAa,IAAI,kBAAkB;IActD,OAAO,CAAC,oBAAoB;CAG7B;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,UAAU,CAAC;KAC3B;CACF"}
package/menu/menu-item.js CHANGED
@@ -64,7 +64,9 @@ let UmMenuItem = class UmMenuItem extends UmButtonWrapper {
64
64
  aria-hidden="true"
65
65
  @slotchange="${this.handleIconSlotChange}"></slot>
66
66
  </div>
67
- <span class="label" id="text"><slot></slot></span>
67
+ <span class="label" id="text">
68
+ <slot></slot>
69
+ </span>
68
70
  `;
69
71
  }
70
72
  handleIconSlotChange() {
@@ -1 +1 @@
1
- {"version":3,"file":"menu-item.js","sourceRoot":"","sources":["../../src/menu/menu-item.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AACA,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,uBAAuB,CAAC;AAE/C,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAGvD,IAAM,UAAU,GAAhB,MAAM,UAAW,SAAQ,eAAe;IAAxC;;QAIL,6BAAU,KAAK,EAAC;QAoBhB;;;;WAIG;QAC8D,YAAO,GAAG,KAAK,CAAC;QAEjF;;;;WAIG;QAC+D,aAAQ,GAAG,KAAK,CAAC;QAK1E,cAAS,GAAG,UAAU,CAAC;IAsBlC,CAAC;IAzDC;;OAEG;IAEH,IAAI,MAAM;QACR,OAAO,uBAAA,IAAI,0BAAQ,CAAC;IACtB,CAAC;IACD,IAAI,MAAM,CAAC,MAAe;QACxB,uBAAA,IAAI,sBAAW,MAAM,MAAA,CAAC;QAEtB,IAAI,MAAM,EAAE,CAAC;YACX,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC;YACvC,OAAO;QACT,CAAC;QAED,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,kBAAkB,CAAC,CAAC;IAC5C,CAAC;IAqBQ,iBAAiB;QACxB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,IAAI,GAAG,cAAc,CAAC;IAC7B,CAAC;IAEkB,aAAa;QAC9B,OAAO,IAAI,CAAA;;;;;yBAKU,IAAI,CAAC,oBAAoB;;;KAG7C,CAAC;IACJ,CAAC;IAEO,oBAAoB;QAC1B,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,CAAC;IAC/C,CAAC;;;AA5De,iBAAM,GAAG,MAAM,AAAT,CAAU;AAQhC;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;wCAGxC;AAiBgE;IAAhE,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;2CAAiB;AAOf;IAAjE,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;4CAAkB;AAGlE;IADhB,qBAAqB,CAAC,EAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;iDACN;AAvCpC,UAAU;IADtB,aAAa,CAAC,aAAa,CAAC;GAChB,UAAU,CA+DtB","sourcesContent":["\nimport { html, HTMLTemplateResult } from 'lit';\nimport { customElement, property, queryAssignedElements } from 'lit/decorators.js';\n\nimport { styles } from './menu-item.styles.js';\n\nimport { UmButtonWrapper } from '../shared/button-wrapper.js';\n\n@customElement('u-menu-item')\nexport class UmMenuItem extends UmButtonWrapper {\n\n static override styles = styles;\n\n #active = false;\n\n /**\n * Force show focus ring\n */\n @property({type: Boolean, reflect: true})\n get active(): boolean {\n return this.#active;\n }\n set active(active: boolean) {\n this.#active = active;\n\n if (active) {\n this.classList.add('force-focus-ring');\n return;\n }\n\n this.classList.remove('force-focus-ring');\n }\n\n /**\n * Whether the drawer item has icon or not\n *\n * _Note:_ Readonly\n */\n @property({type: Boolean, attribute: 'has-icon', reflect: true}) hasIcon = false;\n\n /**\n * Whether the drawer item has badge or not\n *\n * _Note:_ Readonly\n */\n @property({type: Boolean, attribute: 'has-badge', reflect: true}) hasBadge = false;\n\n @queryAssignedElements({slot: 'icon', flatten: true})\n private readonly assignedIcons!: HTMLElement[];\n\n override innerRole = 'menuitem';\n\n override connectedCallback() {\n super.connectedCallback();\n this.role = 'presentation';\n }\n\n protected override renderContent(): HTMLTemplateResult {\n return html`\n <div class=\"icon\">\n <slot\n name=\"icon\"\n aria-hidden=\"true\"\n @slotchange=\"${this.handleIconSlotChange}\"></slot>\n </div>\n <span class=\"label\" id=\"text\"><slot></slot></span>\n `;\n }\n\n private handleIconSlotChange() {\n this.hasIcon = this.assignedIcons.length > 0;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-menu-item': UmMenuItem;\n }\n}\n"]}
1
+ {"version":3,"file":"menu-item.js","sourceRoot":"","sources":["../../src/menu/menu-item.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AACA,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,uBAAuB,CAAC;AAE/C,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAGvD,IAAM,UAAU,GAAhB,MAAM,UAAW,SAAQ,eAAe;IAAxC;;QAIL,6BAAU,KAAK,EAAC;QAoBhB;;;;WAIG;QAC8D,YAAO,GAAG,KAAK,CAAC;QAEjF;;;;WAIG;QAC+D,aAAQ,GAAG,KAAK,CAAC;QAK1E,cAAS,GAAG,UAAU,CAAC;IAwBlC,CAAC;IA3DC;;OAEG;IAEH,IAAI,MAAM;QACR,OAAO,uBAAA,IAAI,0BAAQ,CAAC;IACtB,CAAC;IACD,IAAI,MAAM,CAAC,MAAe;QACxB,uBAAA,IAAI,sBAAW,MAAM,MAAA,CAAC;QAEtB,IAAI,MAAM,EAAE,CAAC;YACX,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC;YACvC,OAAO;QACT,CAAC;QAED,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,kBAAkB,CAAC,CAAC;IAC5C,CAAC;IAqBQ,iBAAiB;QACxB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,IAAI,GAAG,cAAc,CAAC;IAC7B,CAAC;IAEkB,aAAa;QAC9B,OAAO,IAAI,CAAA;;;;;yBAKU,IAAI,CAAC,oBAAoB;;;;;KAK7C,CAAC;IACJ,CAAC;IAEO,oBAAoB;QAC1B,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,CAAC;IAC/C,CAAC;;;AA9De,iBAAM,GAAG,MAAM,AAAT,CAAU;AAQhC;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;wCAGxC;AAiBgE;IAAhE,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;2CAAiB;AAOf;IAAjE,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;4CAAkB;AAGlE;IADhB,qBAAqB,CAAC,EAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;iDACN;AAvCpC,UAAU;IADtB,aAAa,CAAC,aAAa,CAAC;GAChB,UAAU,CAiEtB","sourcesContent":["\nimport { html, HTMLTemplateResult } from 'lit';\nimport { customElement, property, queryAssignedElements } from 'lit/decorators.js';\n\nimport { styles } from './menu-item.styles.js';\n\nimport { UmButtonWrapper } from '../shared/button-wrapper.js';\n\n@customElement('u-menu-item')\nexport class UmMenuItem extends UmButtonWrapper {\n\n static override styles = styles;\n\n #active = false;\n\n /**\n * Force show focus ring\n */\n @property({type: Boolean, reflect: true})\n get active(): boolean {\n return this.#active;\n }\n set active(active: boolean) {\n this.#active = active;\n\n if (active) {\n this.classList.add('force-focus-ring');\n return;\n }\n\n this.classList.remove('force-focus-ring');\n }\n\n /**\n * Whether the drawer item has icon or not\n *\n * _Note:_ Readonly\n */\n @property({type: Boolean, attribute: 'has-icon', reflect: true}) hasIcon = false;\n\n /**\n * Whether the drawer item has badge or not\n *\n * _Note:_ Readonly\n */\n @property({type: Boolean, attribute: 'has-badge', reflect: true}) hasBadge = false;\n\n @queryAssignedElements({slot: 'icon', flatten: true})\n private readonly assignedIcons!: HTMLElement[];\n\n override innerRole = 'menuitem';\n\n override connectedCallback() {\n super.connectedCallback();\n this.role = 'presentation';\n }\n\n protected override renderContent(): HTMLTemplateResult {\n return html`\n <div class=\"icon\">\n <slot\n name=\"icon\"\n aria-hidden=\"true\"\n @slotchange=\"${this.handleIconSlotChange}\"></slot>\n </div>\n <span class=\"label\" id=\"text\">\n <slot></slot>\n </span>\n `;\n }\n\n private handleIconSlotChange() {\n this.hasIcon = this.assignedIcons.length > 0;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-menu-item': UmMenuItem;\n }\n}\n"]}
package/menu/menu.d.ts CHANGED
@@ -28,11 +28,11 @@ export declare class UmMenu extends LitElement {
28
28
  allowOverflow: boolean;
29
29
  menu: HTMLElement;
30
30
  ref: HTMLElement;
31
+ get scrollContainer(): HTMLElement;
31
32
  get anchorElement(): HTMLElement | null | undefined;
32
33
  set anchorElement(anchorElement: HTMLElement | null | undefined);
33
34
  protected render(): HTMLTemplateResult;
34
35
  connectedCallback(): void;
35
- disconnectedCallback(): void;
36
36
  toggle: () => void;
37
37
  show(): void;
38
38
  close: () => void;
@@ -1 +1 @@
1
- {"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../src/menu/menu.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAM3D,OAAO,2BAA2B,CAAC;AAiCnC,qBACa,MAAO,SAAQ,UAAU;;IAEpC,OAAgB,MAAM,4BAAwB;IAK9C;;OAEG;IACH,IACI,IAAI,IAAI,OAAO,CAAsB;IACzC,IAAI,IAAI,CAAC,IAAI,EAAE,OAAO,EAYrB;IAE0B,WAAW,EAAE,UAAU,GAAG,OAAO,CAAc;IAE/C,WAAW,UAAS;IAE/C;;;OAGG;IAEH,YAAY,EAAE,YAAY,GAAG,UAAU,GAAG,aAAa,GAAG,WAAW,GAAG,WAAW,GAAG,SAAS,CAAe;IAE9G;;;;;OAKG;IACwB,SAAS,EAAE,UAAU,GAAG,QAAQ,GAAG,YAAY,GAAG,UAAU,CAAc;IAErG;;OAEG;IACoE,aAAa,UAAS;IAE7E,IAAI,EAAG,WAAW,CAAC;IACpB,GAAG,EAAG,WAAW,CAAC;IAIjC,IAAI,aAAa,IAAI,WAAW,GAAG,IAAI,GAAG,SAAS,CAElD;IACD,IAAI,aAAa,CAAC,aAAa,EAAE,WAAW,GAAG,IAAI,GAAG,SAAS,EAE9D;cAEkB,MAAM,IAAI,kBAAkB;IAYtC,iBAAiB;IAQjB,oBAAoB;IAK7B,MAAM,aAOJ;IAEF,IAAI,IAAI,IAAI;IASZ,KAAK,aAQJ;IAED,OAAO,CAAC,uBAAuB;IA0J/B,OAAO,CAAC,eAAe;IAqDvB,OAAO,CAAC,WAAW;CAWpB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,QAAQ,EAAE,MAAM,CAAC;KAClB;CACF"}
1
+ {"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../src/menu/menu.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAM3D,OAAO,2BAA2B,CAAC;AAiCnC,qBACa,MAAO,SAAQ,UAAU;;IAEpC,OAAgB,MAAM,4BAAwB;IAI9C;;OAEG;IACH,IACI,IAAI,IAAI,OAAO,CAElB;IACD,IAAI,IAAI,CAAC,IAAI,EAAE,OAAO,EAiBrB;IAE0B,WAAW,EAAE,UAAU,GAAG,OAAO,CAAc;IAE/C,WAAW,UAAS;IAE/C;;;OAGG;IAEH,YAAY,EAAE,YAAY,GAAG,UAAU,GAAG,aAAa,GAAG,WAAW,GAAG,WAAW,GAAG,SAAS,CAAe;IAE9G;;;;;OAKG;IACwB,SAAS,EAAE,UAAU,GAAG,QAAQ,GAAG,YAAY,GAAG,UAAU,CAAc;IAErG;;OAEG;IACoE,aAAa,UAAS;IAE7E,IAAI,EAAG,WAAW,CAAC;IACpB,GAAG,EAAG,WAAW,CAAC;IAEjC,IAAI,eAAe,IAAI,WAAW,CAEjC;IAID,IAAI,aAAa,IAAI,WAAW,GAAG,IAAI,GAAG,SAAS,CAElD;IACD,IAAI,aAAa,CAAC,aAAa,EAAE,WAAW,GAAG,IAAI,GAAG,SAAS,EAE9D;cAEkB,MAAM,IAAI,kBAAkB;IAYtC,iBAAiB;IAO1B,MAAM,aAOJ;IAEF,IAAI,IAAI,IAAI;IAMZ,KAAK,aAIJ;IAED,OAAO,CAAC,uBAAuB;IA0J/B,OAAO,CAAC,eAAe;IAqDvB,OAAO,CAAC,WAAW;CAWpB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,QAAQ,EAAE,MAAM,CAAC;KAClB;CACF"}
package/menu/menu.js CHANGED
@@ -15,7 +15,7 @@ var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (
15
15
  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");
16
16
  return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
17
17
  };
18
- var _UmMenu_instances, _UmMenu_open, _UmMenu_justShow, _UmMenu_anchorElement, _UmMenu_resetMenu, _UmMenu_setToOpenUpOrDown, _UmMenu_openBlockAuto, _UmMenu_tryOpenUp, _UmMenu_tryOpenDown, _UmMenu_openToLargestBlockSide, _UmMenu_setToOpenToStartOrEnd, _UmMenu_tryOpenLeft, _UmMenu_tryOpenRight, _UmMenu_openToLargestInlineSide, _UmMenu_openUp, _UmMenu_openDown;
18
+ var _UmMenu_instances, _UmMenu_open, _UmMenu_anchorElement, _UmMenu_resetMenu, _UmMenu_setToOpenUpOrDown, _UmMenu_openBlockAuto, _UmMenu_tryOpenUp, _UmMenu_tryOpenDown, _UmMenu_openToLargestBlockSide, _UmMenu_setToOpenToStartOrEnd, _UmMenu_tryOpenLeft, _UmMenu_tryOpenRight, _UmMenu_openToLargestInlineSide, _UmMenu_openUp, _UmMenu_openDown;
19
19
  import { html, LitElement } from 'lit';
20
20
  import { customElement, property, query } from 'lit/decorators.js';
21
21
  import { styles as baseStyles } from '../shared/base.styles.js';
@@ -26,7 +26,6 @@ let UmMenu = class UmMenu extends LitElement {
26
26
  super(...arguments);
27
27
  _UmMenu_instances.add(this);
28
28
  _UmMenu_open.set(this, false);
29
- _UmMenu_justShow.set(this, false);
30
29
  this.positioning = 'relative';
31
30
  this.manualFocus = false;
32
31
  /**
@@ -54,27 +53,33 @@ let UmMenu = class UmMenu extends LitElement {
54
53
  this.show();
55
54
  };
56
55
  this.close = () => {
57
- if (this.open && !__classPrivateFieldGet(this, _UmMenu_justShow, "f")) {
56
+ if (this.open) {
58
57
  this.open = false;
59
- return;
60
58
  }
61
- __classPrivateFieldSet(this, _UmMenu_justShow, false, "f");
62
59
  };
63
60
  }
64
61
  /**
65
62
  * Opens the menu and makes it visible. Alternative to the `.show()`, `.close()` and `.toggle()` methods
66
63
  */
67
- get open() { return __classPrivateFieldGet(this, _UmMenu_open, "f"); }
64
+ get open() {
65
+ return __classPrivateFieldGet(this, _UmMenu_open, "f");
66
+ }
68
67
  set open(open) {
69
68
  if (!open) {
70
69
  __classPrivateFieldSet(this, _UmMenu_open, open, "f");
70
+ document.removeEventListener('click', this.close);
71
71
  return;
72
72
  }
73
73
  this.calcDropdownPositioning();
74
74
  __classPrivateFieldSet(this, _UmMenu_open, open, "f");
75
- if (!this.manualFocus) {
76
- setTimeout(() => this.querySelector('u-menu-item:not([disabled])')?.focus());
75
+ setTimeout(() => document.addEventListener('click', this.close));
76
+ if (this.manualFocus) {
77
+ return;
77
78
  }
79
+ setTimeout(() => this.querySelector('u-menu-item:not([disabled])')?.focus());
80
+ }
81
+ get scrollContainer() {
82
+ return this.menu;
78
83
  }
79
84
  get anchorElement() {
80
85
  return __classPrivateFieldGet(this, _UmMenu_anchorElement, "f") ?? this.parentElement ?? this.getRootNode().host;
@@ -95,21 +100,14 @@ let UmMenu = class UmMenu extends LitElement {
95
100
  }
96
101
  connectedCallback() {
97
102
  super.connectedCallback();
98
- window.addEventListener('click', this.close);
99
103
  this.role = "listbox";
100
104
  // eslint-disable-next-line no-self-assign
101
105
  this.open = this.open;
102
106
  }
103
- disconnectedCallback() {
104
- super.disconnectedCallback();
105
- window.removeEventListener('click', this.close);
106
- }
107
107
  show() {
108
- if (this.open) {
109
- return;
108
+ if (!this.open) {
109
+ this.open = true;
110
110
  }
111
- __classPrivateFieldSet(this, _UmMenu_justShow, true, "f");
112
- this.open = true;
113
111
  }
114
112
  calcDropdownPositioning() {
115
113
  if (!this.anchorElement) {
@@ -177,7 +175,6 @@ let UmMenu = class UmMenu extends LitElement {
177
175
  }
178
176
  };
179
177
  _UmMenu_open = new WeakMap();
180
- _UmMenu_justShow = new WeakMap();
181
178
  _UmMenu_anchorElement = new WeakMap();
182
179
  _UmMenu_instances = new WeakSet();
183
180
  _UmMenu_resetMenu = function _UmMenu_resetMenu() {
package/menu/menu.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"menu.js","sourceRoot":"","sources":["../../src/menu/menu.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, HTMLTemplateResult, LitElement } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\n\nimport { styles as baseStyles } from '../shared/base.styles.js';\nimport { styles } from './menu.styles.js';\n\nimport '../elevation/elevation.js';\n\ninterface AnchorCornerBlockSide {\n top: number;\n bottom: number;\n relativeY: number;\n}\n\ninterface AnchorCornerInlineSide {\n left: number;\n right: number;\n relativeX: number;\n}\n\ninterface AnchorBounds {\n top: AnchorCornerBlockSide;\n bottom: AnchorCornerBlockSide;\n start: AnchorCornerInlineSide;\n end: AnchorCornerInlineSide;\n width: number;\n height: number;\n}\n\ninterface MenuPosition {\n bounds: AnchorBounds;\n isRtl: boolean;\n}\n\ninterface MenuSize {\n width: number;\n height: number;\n}\n\n@customElement('u-menu')\nexport class UmMenu extends LitElement {\n\n static override styles = [baseStyles, styles];\n\n #open = false;\n #justShow = false;\n\n /**\n * Opens the menu and makes it visible. Alternative to the `.show()`, `.close()` and `.toggle()` methods\n */\n @property({type: Boolean, reflect: true})\n get open(): boolean { return this.#open }\n set open(open: boolean) {\n if (!open) {\n this.#open = open;\n return;\n }\n \n this.calcDropdownPositioning();\n this.#open = open;\n\n if (!this.manualFocus) {\n setTimeout(() => this.querySelector<HTMLElement>('u-menu-item:not([disabled])')?.focus());\n }\n }\n\n @property({reflect: true}) positioning: 'relative' | 'fixed' = 'relative';\n\n @property({type: Boolean}) manualFocus = false;\n\n /**\n * The corner of the anchor which to align the menu in the standard logical\n * property style of <block>-<inline> e.g. `'end-start'`.\n */\n @property({attribute: 'anchor-corner', reflect: true})\n anchorCorner: 'auto-start' | 'auto-end' | 'start-start' | 'start-end' | 'end-start' | 'end-end' = 'end-start';\n\n /**\n * The direction of the menu. e.g. `'down-end'`.\n *\n * NOTE: This value may not be respected by the menu positioning algorithm\n * if the menu would render outside the viewport.\n */\n @property({reflect: true}) direction: 'up-start' | 'up-end' | 'down-start' | 'down-end' = 'down-end';\n\n /**\n * Don't limit the height of the menu\n */\n @property({type: Boolean, attribute: 'allow-overflow', reflect: true}) allowOverflow = false;\n\n @query('.menu') menu!: HTMLElement;\n @query('.ref') ref!: HTMLElement;\n\n #anchorElement: HTMLElement | null | undefined;\n\n get anchorElement(): HTMLElement | null | undefined {\n return this.#anchorElement ?? this.parentElement! ?? (<ShadowRoot>this.getRootNode()).host;\n }\n set anchorElement(anchorElement: HTMLElement | null | undefined) {\n this.#anchorElement = anchorElement;\n }\n\n protected override render(): HTMLTemplateResult {\n return html`\n <div class=\"ref\"></div>\n <div class=\"menu\" part=\"menu\" ?inert=${!this.open}>\n <u-elevation></u-elevation>\n <div role=\"menu\" class=\"content\" part=\"content\">\n <slot></slot>\n </div>\n </div>\n `;\n }\n\n override connectedCallback() {\n super.connectedCallback();\n window.addEventListener('click', this.close);\n this.role = \"listbox\";\n // eslint-disable-next-line no-self-assign\n this.open = this.open;\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback();\n window.removeEventListener('click', this.close);\n }\n\n toggle = () => {\n if (this.open) {\n this.close();\n return;\n }\n\n this.show();\n };\n\n show(): void {\n if (this.open) {\n return;\n }\n\n this.#justShow = true;\n this.open = true;\n }\n\n close = () => {\n\n if (this.open && !this.#justShow) {\n this.open = false;\n return;\n }\n\n this.#justShow = false;\n }\n\n private calcDropdownPositioning() {\n if (!this.anchorElement) {\n return;\n }\n\n const menuPosition = this.getMenuPosition();\n const menuSize = this.getMenuSize()\n\n this.#resetMenu();\n this.#setToOpenUpOrDown(menuPosition, menuSize);\n this.#setToOpenToStartOrEnd(menuPosition, menuSize);\n }\n\n #resetMenu() {\n this.menu.className = 'menu';\n this.menu.style.top = '';\n this.menu.style.bottom = '';\n this.menu.style.left = '';\n this.menu.style.right = '';\n this.menu.style.maxHeight = '';\n }\n\n #setToOpenUpOrDown(menuPosition: MenuPosition, menuSize: MenuSize): void {\n if (this.anchorCorner.startsWith('auto-')) {\n this.#openBlockAuto(menuPosition, menuSize);\n return;\n }\n\n const side = this.anchorCorner.startsWith('start-')\n ? menuPosition.bounds.top\n : menuPosition.bounds.bottom;\n\n if (this.direction.startsWith('up-')) {\n this.#tryOpenUp(side, menuSize);\n return;\n }\n\n this.#tryOpenDown(side, menuSize);\n }\n\n #openBlockAuto(menuPosition: MenuPosition, menuSize: MenuSize): void {\n const topSide = menuPosition.bounds.top;\n const bottomSide = menuPosition.bounds.bottom;\n\n const viewPortHeight = window.innerHeight;\n\n if (bottomSide.bottom >= topSide.top || viewPortHeight - (bottomSide.top + menuSize.height) >= 0) {\n this.#openDown(bottomSide);\n return;\n }\n\n this.#openUp(topSide);\n }\n\n #tryOpenUp(side: AnchorCornerBlockSide, menuSize: MenuSize): void {\n\n if (side.top === side.bottom || side.top - menuSize.height >= 0) {\n this.#openUp(side);\n return;\n }\n\n this.#openToLargestBlockSide(side);\n }\n\n #tryOpenDown(side: AnchorCornerBlockSide, menuSize: MenuSize): void {\n\n const viewPortHeight = window.innerHeight;\n\n if (side.top === side.bottom || viewPortHeight - (side.top + menuSize.height) >= 0) {\n this.#openDown(side);\n return;\n }\n\n this.#openToLargestBlockSide(side);\n }\n\n #openToLargestBlockSide(side: AnchorCornerBlockSide) {\n if (side.top > side.bottom) {\n this.#openUp(side);\n return;\n }\n\n this.#openDown(side);\n }\n\n #setToOpenToStartOrEnd(menuPosition: MenuPosition, menuSize: MenuSize): void {\n const openStart = menuPosition.isRtl\n ? this.#tryOpenRight.bind(this)\n : this.#tryOpenLeft.bind(this);\n const openEnd = menuPosition.isRtl\n ? this.#tryOpenLeft.bind(this)\n : this.#tryOpenRight.bind(this);\n\n const side = this.anchorCorner.endsWith('-start')\n ? menuPosition.bounds.start\n : menuPosition.bounds.end;\n\n if (this.direction.endsWith('-start')) {\n openStart(side, menuSize);\n return;\n }\n\n openEnd(side, menuSize);\n }\n\n #tryOpenLeft(side: AnchorCornerInlineSide, menuSize: MenuSize): void {\n\n if (side.left === side.right || side.left - menuSize.width >= 0) {\n this.menu.style.right = `${side.relativeX * -1}px`;\n return;\n }\n\n this.#openToLargestInlineSide(side);\n }\n\n #tryOpenRight(side: AnchorCornerInlineSide, menuSize: MenuSize): void {\n\n const viewPortWidth = window.innerWidth;\n\n if (side.left === side.right || viewPortWidth - (side.left + menuSize.width) >= 0) {\n this.menu.style.left = `${side.relativeX}px`;\n return;\n }\n\n this.#openToLargestInlineSide(side);\n }\n\n #openToLargestInlineSide(side: AnchorCornerInlineSide) {\n if (side.left > side.right) {\n this.menu.style.right = `${side.relativeX * -1}px`;\n return;\n }\n\n this.menu.style.left = `${side.relativeX}px`;\n }\n\n #openUp(side: AnchorCornerBlockSide) {\n const viewPortHeight = window.innerHeight;\n\n this.menu.style.bottom = `${side.relativeY * -1}px`;\n this.menu.classList.add('up');\n this.menu.style.maxHeight = this.allowOverflow\n ? ''\n : `${viewPortHeight - side.bottom}px`;\n }\n\n #openDown(side: AnchorCornerBlockSide) {\n const viewPortHeight = window.innerHeight;\n this.menu.style.top = `${side.relativeY}px`;\n this.menu.style.maxHeight = this.allowOverflow\n ? ''\n : `${viewPortHeight - side.top}px`;\n }\n\n private getMenuPosition(): MenuPosition {\n const viewPortWidth = window.innerWidth;\n const viewPortHeight = window.innerHeight;\n\n const anchorElement = this.anchorElement!;\n const anchorRect = anchorElement.getBoundingClientRect() as DOMRect\n const refRect = this.ref.getBoundingClientRect() as DOMRect\n const anchorStyles = getComputedStyle(anchorElement);\n const isRtl = anchorStyles.direction === 'rtl';\n\n const width = parseInt(anchorStyles.width, 10);\n const height = parseInt(anchorStyles.height, 10);\n\n const rectX = refRect.left;\n const rectY = refRect.top;\n\n const leftPoint: AnchorCornerInlineSide = {\n left: anchorRect.left,\n right: viewPortWidth - anchorRect.left,\n relativeX: anchorRect.left - rectX\n };\n\n const rightPoint: AnchorCornerInlineSide = {\n left: anchorRect.right,\n right: viewPortWidth - anchorRect.right,\n relativeX: leftPoint.relativeX + width\n };\n\n const topPoint: AnchorCornerBlockSide = {\n top: anchorRect.top,\n relativeY: anchorRect.top - rectY,\n bottom: viewPortHeight - anchorRect.top\n };\n\n const anchorBounds: AnchorBounds = {\n top: topPoint,\n bottom: {\n top: anchorRect.bottom,\n relativeY: topPoint.relativeY + height,\n bottom: viewPortHeight - anchorRect.bottom\n },\n start: isRtl ? rightPoint : leftPoint,\n end: isRtl ? leftPoint : rightPoint,\n width,\n height\n }\n\n return {\n isRtl: isRtl,\n bounds: anchorBounds\n };\n }\n\n private getMenuSize(): MenuSize {\n const menu = this.menu;\n const styles = getComputedStyle(menu);\n const width = parseInt(styles.width, 10);\n const height = parseInt(styles.height, 10);\n\n return {\n width: width,\n height: height\n };\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-menu': UmMenu;\n }\n}\n"]}
1
+ {"version":3,"file":"menu.js","sourceRoot":"","sources":["../../src/menu/menu.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, HTMLTemplateResult, LitElement } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\n\nimport { styles as baseStyles } from '../shared/base.styles.js';\nimport { styles } from './menu.styles.js';\n\nimport '../elevation/elevation.js';\n\ninterface AnchorCornerBlockSide {\n top: number;\n bottom: number;\n relativeY: number;\n}\n\ninterface AnchorCornerInlineSide {\n left: number;\n right: number;\n relativeX: number;\n}\n\ninterface AnchorBounds {\n top: AnchorCornerBlockSide;\n bottom: AnchorCornerBlockSide;\n start: AnchorCornerInlineSide;\n end: AnchorCornerInlineSide;\n width: number;\n height: number;\n}\n\ninterface MenuPosition {\n bounds: AnchorBounds;\n isRtl: boolean;\n}\n\ninterface MenuSize {\n width: number;\n height: number;\n}\n\n@customElement('u-menu')\nexport class UmMenu extends LitElement {\n\n static override styles = [baseStyles, styles];\n\n #open = false;\n\n /**\n * Opens the menu and makes it visible. Alternative to the `.show()`, `.close()` and `.toggle()` methods\n */\n @property({type: Boolean, reflect: true})\n get open(): boolean {\n return this.#open\n }\n set open(open: boolean) {\n if (!open) {\n this.#open = open;\n document.removeEventListener('click', this.close);\n return;\n }\n\n this.calcDropdownPositioning();\n this.#open = open;\n\n setTimeout(() => document.addEventListener('click', this.close));\n\n if (this.manualFocus) {\n return;\n }\n\n setTimeout(() => this.querySelector<HTMLElement>('u-menu-item:not([disabled])')?.focus());\n }\n\n @property({reflect: true}) positioning: 'relative' | 'fixed' = 'relative';\n\n @property({type: Boolean}) manualFocus = false;\n\n /**\n * The corner of the anchor which to align the menu in the standard logical\n * property style of <block>-<inline> e.g. `'end-start'`.\n */\n @property({attribute: 'anchor-corner', reflect: true})\n anchorCorner: 'auto-start' | 'auto-end' | 'start-start' | 'start-end' | 'end-start' | 'end-end' = 'end-start';\n\n /**\n * The direction of the menu. e.g. `'down-end'`.\n *\n * NOTE: This value may not be respected by the menu positioning algorithm\n * if the menu would render outside the viewport.\n */\n @property({reflect: true}) direction: 'up-start' | 'up-end' | 'down-start' | 'down-end' = 'down-end';\n\n /**\n * Don't limit the height of the menu\n */\n @property({type: Boolean, attribute: 'allow-overflow', reflect: true}) allowOverflow = false;\n\n @query('.menu') menu!: HTMLElement;\n @query('.ref') ref!: HTMLElement;\n\n get scrollContainer(): HTMLElement {\n return this.menu;\n }\n\n #anchorElement: HTMLElement | null | undefined;\n\n get anchorElement(): HTMLElement | null | undefined {\n return this.#anchorElement ?? this.parentElement! ?? (<ShadowRoot>this.getRootNode()).host;\n }\n set anchorElement(anchorElement: HTMLElement | null | undefined) {\n this.#anchorElement = anchorElement;\n }\n\n protected override render(): HTMLTemplateResult {\n return html`\n <div class=\"ref\"></div>\n <div class=\"menu\" part=\"menu\" ?inert=${!this.open}>\n <u-elevation></u-elevation>\n <div role=\"menu\" class=\"content\" part=\"content\">\n <slot></slot>\n </div>\n </div>\n `;\n }\n\n override connectedCallback() {\n super.connectedCallback();\n this.role = \"listbox\";\n // eslint-disable-next-line no-self-assign\n this.open = this.open;\n }\n\n toggle = () => {\n if (this.open) {\n this.close();\n return;\n }\n\n this.show();\n };\n\n show(): void {\n if (!this.open) {\n this.open = true;\n }\n }\n\n close = () => {\n if (this.open) {\n this.open = false;\n }\n }\n\n private calcDropdownPositioning() {\n if (!this.anchorElement) {\n return;\n }\n\n const menuPosition = this.getMenuPosition();\n const menuSize = this.getMenuSize();\n\n this.#resetMenu();\n this.#setToOpenUpOrDown(menuPosition, menuSize);\n this.#setToOpenToStartOrEnd(menuPosition, menuSize);\n }\n\n #resetMenu() {\n this.menu.className = 'menu';\n this.menu.style.top = '';\n this.menu.style.bottom = '';\n this.menu.style.left = '';\n this.menu.style.right = '';\n this.menu.style.maxHeight = '';\n }\n\n #setToOpenUpOrDown(menuPosition: MenuPosition, menuSize: MenuSize): void {\n if (this.anchorCorner.startsWith('auto-')) {\n this.#openBlockAuto(menuPosition, menuSize);\n return;\n }\n\n const side = this.anchorCorner.startsWith('start-')\n ? menuPosition.bounds.top\n : menuPosition.bounds.bottom;\n\n if (this.direction.startsWith('up-')) {\n this.#tryOpenUp(side, menuSize);\n return;\n }\n\n this.#tryOpenDown(side, menuSize);\n }\n\n #openBlockAuto(menuPosition: MenuPosition, menuSize: MenuSize): void {\n const topSide = menuPosition.bounds.top;\n const bottomSide = menuPosition.bounds.bottom;\n\n const viewPortHeight = window.innerHeight;\n\n if (bottomSide.bottom >= topSide.top || viewPortHeight - (bottomSide.top + menuSize.height) >= 0) {\n this.#openDown(bottomSide);\n return;\n }\n\n this.#openUp(topSide);\n }\n\n #tryOpenUp(side: AnchorCornerBlockSide, menuSize: MenuSize): void {\n\n if (side.top === side.bottom || side.top - menuSize.height >= 0) {\n this.#openUp(side);\n return;\n }\n\n this.#openToLargestBlockSide(side);\n }\n\n #tryOpenDown(side: AnchorCornerBlockSide, menuSize: MenuSize): void {\n\n const viewPortHeight = window.innerHeight;\n\n if (side.top === side.bottom || viewPortHeight - (side.top + menuSize.height) >= 0) {\n this.#openDown(side);\n return;\n }\n\n this.#openToLargestBlockSide(side);\n }\n\n #openToLargestBlockSide(side: AnchorCornerBlockSide) {\n if (side.top > side.bottom) {\n this.#openUp(side);\n return;\n }\n\n this.#openDown(side);\n }\n\n #setToOpenToStartOrEnd(menuPosition: MenuPosition, menuSize: MenuSize): void {\n const openStart = menuPosition.isRtl\n ? this.#tryOpenRight.bind(this)\n : this.#tryOpenLeft.bind(this);\n const openEnd = menuPosition.isRtl\n ? this.#tryOpenLeft.bind(this)\n : this.#tryOpenRight.bind(this);\n\n const side = this.anchorCorner.endsWith('-start')\n ? menuPosition.bounds.start\n : menuPosition.bounds.end;\n\n if (this.direction.endsWith('-start')) {\n openStart(side, menuSize);\n return;\n }\n\n openEnd(side, menuSize);\n }\n\n #tryOpenLeft(side: AnchorCornerInlineSide, menuSize: MenuSize): void {\n\n if (side.left === side.right || side.left - menuSize.width >= 0) {\n this.menu.style.right = `${side.relativeX * -1}px`;\n return;\n }\n\n this.#openToLargestInlineSide(side);\n }\n\n #tryOpenRight(side: AnchorCornerInlineSide, menuSize: MenuSize): void {\n\n const viewPortWidth = window.innerWidth;\n\n if (side.left === side.right || viewPortWidth - (side.left + menuSize.width) >= 0) {\n this.menu.style.left = `${side.relativeX}px`;\n return;\n }\n\n this.#openToLargestInlineSide(side);\n }\n\n #openToLargestInlineSide(side: AnchorCornerInlineSide) {\n if (side.left > side.right) {\n this.menu.style.right = `${side.relativeX * -1}px`;\n return;\n }\n\n this.menu.style.left = `${side.relativeX}px`;\n }\n\n #openUp(side: AnchorCornerBlockSide) {\n const viewPortHeight = window.innerHeight;\n\n this.menu.style.bottom = `${side.relativeY * -1}px`;\n this.menu.classList.add('up');\n this.menu.style.maxHeight = this.allowOverflow\n ? ''\n : `${viewPortHeight - side.bottom}px`;\n }\n\n #openDown(side: AnchorCornerBlockSide) {\n const viewPortHeight = window.innerHeight;\n this.menu.style.top = `${side.relativeY}px`;\n this.menu.style.maxHeight = this.allowOverflow\n ? ''\n : `${viewPortHeight - side.top}px`;\n }\n\n private getMenuPosition(): MenuPosition {\n const viewPortWidth = window.innerWidth;\n const viewPortHeight = window.innerHeight;\n\n const anchorElement = this.anchorElement!;\n const anchorRect = anchorElement.getBoundingClientRect() as DOMRect\n const refRect = this.ref.getBoundingClientRect() as DOMRect\n const anchorStyles = getComputedStyle(anchorElement);\n const isRtl = anchorStyles.direction === 'rtl';\n\n const width = parseInt(anchorStyles.width, 10);\n const height = parseInt(anchorStyles.height, 10);\n\n const rectX = refRect.left;\n const rectY = refRect.top;\n\n const leftPoint: AnchorCornerInlineSide = {\n left: anchorRect.left,\n right: viewPortWidth - anchorRect.left,\n relativeX: anchorRect.left - rectX\n };\n\n const rightPoint: AnchorCornerInlineSide = {\n left: anchorRect.right,\n right: viewPortWidth - anchorRect.right,\n relativeX: leftPoint.relativeX + width\n };\n\n const topPoint: AnchorCornerBlockSide = {\n top: anchorRect.top,\n relativeY: anchorRect.top - rectY,\n bottom: viewPortHeight - anchorRect.top\n };\n\n const anchorBounds: AnchorBounds = {\n top: topPoint,\n bottom: {\n top: anchorRect.bottom,\n relativeY: topPoint.relativeY + height,\n bottom: viewPortHeight - anchorRect.bottom\n },\n start: isRtl ? rightPoint : leftPoint,\n end: isRtl ? leftPoint : rightPoint,\n width,\n height\n }\n\n return {\n isRtl: isRtl,\n bounds: anchorBounds\n };\n }\n\n private getMenuSize(): MenuSize {\n const menu = this.menu;\n const styles = getComputedStyle(menu);\n const width = parseInt(styles.width, 10);\n const height = parseInt(styles.height, 10);\n\n return {\n width: width,\n height: height\n };\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-menu': UmMenu;\n }\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"menu.styles.d.ts","sourceRoot":"","sources":["../../src/menu/menu.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAwDlB,CAAC"}
1
+ {"version":3,"file":"menu.styles.d.ts","sourceRoot":"","sources":["../../src/menu/menu.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAyDlB,CAAC"}
@@ -43,6 +43,7 @@ export const styles = css `
43
43
  padding-block: var(--u-menu-padding, 8px);
44
44
  opacity: 0;
45
45
  transition: opacity 1ms 400ms;
46
+ scroll-padding-block: 32px;
46
47
  overflow: auto;
47
48
  }
48
49
 
@@ -1 +1 @@
1
- {"version":3,"file":"menu.styles.js","sourceRoot":"","sources":["../../src/menu/menu.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwDzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n :host {\n --u-elevation-level: var(--u-menu-elevation-level, 2);\n display: block;\n width: 0;\n }\n\n :host([positioning=relative]) {\n position: relative;\n }\n\n :host([positioning=fixed]) {\n position: fixed;\n }\n\n .ref {\n position: absolute;\n inset-inline-start: 0;\n pointer-events: none;\n }\n\n .menu {\n position: absolute;\n display: flex;\n min-width: var(--u-menu-min-width, 112px);\n max-width: var(--u-menu-max-width, 280px);\n background: var(--u-menu-background-color, var(--u-color-surface-container, rgb(243, 237, 247)));\n border-radius: var(--u-menu-shape-corner, var(--u-shape-corner-extra-small, 4px));\n opacity: 0;\n transition: transform 350ms cubic-bezier(0.19, 1, 0.22, 1) 350ms, opacity 350ms;\n transform: scale3d(0, 0, 1);\n transform-origin: top;\n z-index: var(--u-menu-z-index, 1020);\n }\n .menu.up {\n transform: scale3d(1, 0, 0);\n transform-origin: bottom;\n }\n\n .content {\n width: 100%;\n padding-block: var(--u-menu-padding, 8px);\n opacity: 0;\n transition: opacity 1ms 400ms;\n overflow: auto;\n }\n\n :host([open]) .menu {\n opacity: 1;\n transition: transform 350ms cubic-bezier(0.19, 1, 0.22, 1), opacity 250ms;\n transform: scale3d(1, 1, 1);\n }\n :host([open]) .content {\n opacity: 1;\n transition: opacity 300ms 150ms;\n }\n`;\n"]}
1
+ {"version":3,"file":"menu.styles.js","sourceRoot":"","sources":["../../src/menu/menu.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyDzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n :host {\n --u-elevation-level: var(--u-menu-elevation-level, 2);\n display: block;\n width: 0;\n }\n\n :host([positioning=relative]) {\n position: relative;\n }\n\n :host([positioning=fixed]) {\n position: fixed;\n }\n\n .ref {\n position: absolute;\n inset-inline-start: 0;\n pointer-events: none;\n }\n\n .menu {\n position: absolute;\n display: flex;\n min-width: var(--u-menu-min-width, 112px);\n max-width: var(--u-menu-max-width, 280px);\n background: var(--u-menu-background-color, var(--u-color-surface-container, rgb(243, 237, 247)));\n border-radius: var(--u-menu-shape-corner, var(--u-shape-corner-extra-small, 4px));\n opacity: 0;\n transition: transform 350ms cubic-bezier(0.19, 1, 0.22, 1) 350ms, opacity 350ms;\n transform: scale3d(0, 0, 1);\n transform-origin: top;\n z-index: var(--u-menu-z-index, 1020);\n }\n .menu.up {\n transform: scale3d(1, 0, 0);\n transform-origin: bottom;\n }\n\n .content {\n width: 100%;\n padding-block: var(--u-menu-padding, 8px);\n opacity: 0;\n transition: opacity 1ms 400ms;\n scroll-padding-block: 32px;\n overflow: auto;\n }\n\n :host([open]) .menu {\n opacity: 1;\n transition: transform 350ms cubic-bezier(0.19, 1, 0.22, 1), opacity 250ms;\n transform: scale3d(1, 1, 1);\n }\n :host([open]) .content {\n opacity: 1;\n transition: opacity 300ms 150ms;\n }\n`;\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@universal-material/web",
3
- "version": "3.0.67",
3
+ "version": "3.0.69",
4
4
  "description": "Material web components",
5
5
  "type": "module",
6
6
  "keywords": [
@@ -1 +1 @@
1
- {"version":3,"file":"circular-progress.d.ts","sourceRoot":"","sources":["../../src/progress/circular-progress.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAO,MAAM,KAAK,CAAC;AACtC,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAQ1C,qBACa,kBAAmB,SAAQ,UAAU;;IAChD,OAAgB,MAAM,4BAAY;IAER,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,GAAG,EAAE,MAAM,CAAK;cAEvB,MAAM,IAAI,cAAc;CAiE5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,qBAAqB,EAAE,kBAAkB,CAAC;KAC3C;CACF"}
1
+ {"version":3,"file":"circular-progress.d.ts","sourceRoot":"","sources":["../../src/progress/circular-progress.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAO,MAAM,KAAK,CAAC;AACtC,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAQ1C,qBACa,kBAAmB,SAAQ,UAAU;;IAChD,OAAgB,MAAM,4BAAY;IAER,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,GAAG,EAAE,MAAM,CAAK;cAEvB,MAAM,IAAI,cAAc;CA6D5C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,qBAAqB,EAAE,kBAAkB,CAAC;KAC3C;CACF"}
@@ -52,9 +52,6 @@ _UmCircularProgress_renderDeterminate = function _UmCircularProgress_renderDeter
52
52
  proportion = Math.floor(proportion * 100) / 100;
53
53
  const percentage = basePercentage - basePercentage * proportion;
54
54
  const trackPercentage = basePercentage - basePercentage * Math.max(1 - offset - proportion, 0) * -1;
55
- console.log(this.value);
56
- console.log(basePercentage);
57
- console.log(percentage);
58
55
  return svg `
59
56
  <svg class="circular on-going" viewBox="0 0 50 50">
60
57
  <circle
@@ -1 +1 @@
1
- {"version":3,"file":"circular-progress.js","sourceRoot":"","sources":["../../src/progress/circular-progress.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAEtC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,MAAM,EAAE,MAAM,+BAA+B,CAAC;AAEvD,MAAM,cAAc,GAAG,GAAG,CAAC;AAE3B,6CAA6C;AAEtC,IAAM,kBAAkB,GAAxB,MAAM,kBAAmB,SAAQ,UAAU;IAA3C;;;QAIqB,QAAG,GAAW,CAAC,CAAC;IAmE5C,CAAC;IAjEoB,MAAM;QACvB,OAAO,IAAI,CAAC,KAAK,KAAK,SAAS;YAC7B,CAAC,CAAC,uBAAA,IAAI,8EAAqB,MAAzB,IAAI,CAAuB;YAC7B,CAAC,CAAC,uBAAA,IAAI,4EAAmB,MAAvB,IAAI,CAAqB,CAAC;IAChC,CAAC;;;6EAEa,SAAiB;IAC7B,OAAO,GAAG,CAAA;6BACe,SAAS;;;;;;;;;aASzB,CAAC;AACZ,CAAC;;IAGC,OAAO,uBAAA,IAAI,uEAAc,MAAlB,IAAI,EAAe,eAAe,CAAC,CAAC;AAC7C,CAAC;;IAIC,IAAI,UAAU,GAAG,IAAI,CAAC,KAAM,GAAG,IAAI,CAAC,GAAG,CAAC;IACxC,MAAM,MAAM,GAAG,UAAU,KAAK,CAAC,IAAI,UAAU,KAAK,CAAC;QACjD,CAAC,CAAC,CAAC;QACH,CAAC,CAAC,OAAO,CAAC;IACZ,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,UAAW,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC;IACjD,MAAM,UAAU,GAAG,cAAc,GAAG,cAAc,GAAG,UAAU,CAAC;IAChE,MAAM,eAAe,GAAG,cAAc,GAAG,cAAc,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,MAAM,GAAG,UAAU,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;IAEpG,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IACxB,OAAO,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAC5B,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;IAExB,OAAO,GAAG,CAAA;;;;;;;;;;6BAUe,GAAG,cAAc,GAAG;8BACnB,GAAG,UAAU,GAAG;;;;;;;;;;;6BAWjB,GAAG,cAAc,GAAG;8BACnB,GAAG,eAAe,GAAG;;KAE9C,CAAC;AACJ,CAAC;AArEe,yBAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAER;IAAzB,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;iDAA2B;AAC1B;IAAzB,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;+CAAiB;AAJ/B,kBAAkB;IAD9B,aAAa,CAAC,qBAAqB,CAAC;GACxB,kBAAkB,CAuE9B","sourcesContent":["import { LitElement, svg } from 'lit';\nimport { TemplateResult } from 'lit-html';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { styles } from './circular-progress.styles.js';\n\nconst basePercentage = 255;\n\n// https://codepen.io/ConAntonakos/pen/ryMaOX\n@customElement('u-circular-progress')\nexport class UmCircularProgress extends LitElement {\n static override styles = [styles];\n\n @property({type: Number}) value: number | undefined;\n @property({type: Number}) max: number = 1;\n\n protected override render(): TemplateResult {\n return this.value === undefined\n ? this.#renderIndeterminate()\n : this.#renderDeterminate();\n }\n\n #renderCircle(className: string): TemplateResult {\n return svg`\n <svg class=\"circular ${className}\" viewBox=\"0 0 50 50\">\n <circle\n class=\"path\"\n cx=\"50%\"\n cy=\"50%\"\n r=\"20\"\n fill=\"none\"\n stroke-width=\"4\"\n stroke-miterlimit=\"10\" />\n </svg>`;\n }\n\n #renderIndeterminate(): TemplateResult {\n return this.#renderCircle('indeterminate');\n }\n\n #renderDeterminate(): TemplateResult {\n\n let proportion = this.value! / this.max;\n const offset = proportion === 0 || proportion === 1\n ? 0\n : 0.10625;\n proportion = Math.floor(proportion! * 100) / 100;\n const percentage = basePercentage - basePercentage * proportion;\n const trackPercentage = basePercentage - basePercentage * Math.max(1 - offset - proportion, 0) * -1;\n\n console.log(this.value);\n console.log(basePercentage);\n console.log(percentage);\n\n return svg`\n <svg class=\"circular on-going\" viewBox=\"0 0 50 50\">\n <circle\n class=\"path\"\n cx=\"50%\"\n cy=\"50%\"\n r=\"20\"\n fill=\"none\"\n stroke-width=\"4\"\n stroke-miterlimit=\"10\"\n stroke-dasharray=${`${basePercentage}%`} \n stroke-dashoffset=${`${percentage}%`} />\n </svg>\n <svg class=\"circular track on-going\" viewBox=\"0 0 50 50\">\n <circle\n class=\"path\"\n cx=\"50%\"\n cy=\"50%\"\n r=\"20\"\n fill=\"none\"\n stroke-width=\"4\"\n stroke-miterlimit=\"10\"\n stroke-dasharray=${`${basePercentage}%`}\n stroke-dashoffset=${`${trackPercentage}%`}/>\n </svg>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-circular-progress': UmCircularProgress;\n }\n}\n"]}
1
+ {"version":3,"file":"circular-progress.js","sourceRoot":"","sources":["../../src/progress/circular-progress.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAEtC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,EAAE,MAAM,EAAE,MAAM,+BAA+B,CAAC;AAEvD,MAAM,cAAc,GAAG,GAAG,CAAC;AAE3B,6CAA6C;AAEtC,IAAM,kBAAkB,GAAxB,MAAM,kBAAmB,SAAQ,UAAU;IAA3C;;;QAIqB,QAAG,GAAW,CAAC,CAAC;IA+D5C,CAAC;IA7DoB,MAAM;QACvB,OAAO,IAAI,CAAC,KAAK,KAAK,SAAS;YAC7B,CAAC,CAAC,uBAAA,IAAI,8EAAqB,MAAzB,IAAI,CAAuB;YAC7B,CAAC,CAAC,uBAAA,IAAI,4EAAmB,MAAvB,IAAI,CAAqB,CAAC;IAChC,CAAC;;;6EAEa,SAAiB;IAC7B,OAAO,GAAG,CAAA;6BACe,SAAS;;;;;;;;;aASzB,CAAC;AACZ,CAAC;;IAGC,OAAO,uBAAA,IAAI,uEAAc,MAAlB,IAAI,EAAe,eAAe,CAAC,CAAC;AAC7C,CAAC;;IAIC,IAAI,UAAU,GAAG,IAAI,CAAC,KAAM,GAAG,IAAI,CAAC,GAAG,CAAC;IACxC,MAAM,MAAM,GAAG,UAAU,KAAK,CAAC,IAAI,UAAU,KAAK,CAAC;QACjD,CAAC,CAAC,CAAC;QACH,CAAC,CAAC,OAAO,CAAC;IACZ,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,UAAW,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC;IACjD,MAAM,UAAU,GAAG,cAAc,GAAG,cAAc,GAAG,UAAU,CAAC;IAChE,MAAM,eAAe,GAAG,cAAc,GAAG,cAAc,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,MAAM,GAAG,UAAU,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;IAEpG,OAAO,GAAG,CAAA;;;;;;;;;;6BAUe,GAAG,cAAc,GAAG;8BACnB,GAAG,UAAU,GAAG;;;;;;;;;;;6BAWjB,GAAG,cAAc,GAAG;8BACnB,GAAG,eAAe,GAAG;;KAE9C,CAAC;AACJ,CAAC;AAjEe,yBAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAER;IAAzB,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;iDAA2B;AAC1B;IAAzB,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;+CAAiB;AAJ/B,kBAAkB;IAD9B,aAAa,CAAC,qBAAqB,CAAC;GACxB,kBAAkB,CAmE9B","sourcesContent":["import { LitElement, svg } from 'lit';\nimport { TemplateResult } from 'lit-html';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { styles } from './circular-progress.styles.js';\n\nconst basePercentage = 255;\n\n// https://codepen.io/ConAntonakos/pen/ryMaOX\n@customElement('u-circular-progress')\nexport class UmCircularProgress extends LitElement {\n static override styles = [styles];\n\n @property({type: Number}) value: number | undefined;\n @property({type: Number}) max: number = 1;\n\n protected override render(): TemplateResult {\n return this.value === undefined\n ? this.#renderIndeterminate()\n : this.#renderDeterminate();\n }\n\n #renderCircle(className: string): TemplateResult {\n return svg`\n <svg class=\"circular ${className}\" viewBox=\"0 0 50 50\">\n <circle\n class=\"path\"\n cx=\"50%\"\n cy=\"50%\"\n r=\"20\"\n fill=\"none\"\n stroke-width=\"4\"\n stroke-miterlimit=\"10\" />\n </svg>`;\n }\n\n #renderIndeterminate(): TemplateResult {\n return this.#renderCircle('indeterminate');\n }\n\n #renderDeterminate(): TemplateResult {\n\n let proportion = this.value! / this.max;\n const offset = proportion === 0 || proportion === 1\n ? 0\n : 0.10625;\n proportion = Math.floor(proportion! * 100) / 100;\n const percentage = basePercentage - basePercentage * proportion;\n const trackPercentage = basePercentage - basePercentage * Math.max(1 - offset - proportion, 0) * -1;\n\n return svg`\n <svg class=\"circular on-going\" viewBox=\"0 0 50 50\">\n <circle\n class=\"path\"\n cx=\"50%\"\n cy=\"50%\"\n r=\"20\"\n fill=\"none\"\n stroke-width=\"4\"\n stroke-miterlimit=\"10\"\n stroke-dasharray=${`${basePercentage}%`} \n stroke-dashoffset=${`${percentage}%`} />\n </svg>\n <svg class=\"circular track on-going\" viewBox=\"0 0 50 50\">\n <circle\n class=\"path\"\n cx=\"50%\"\n cy=\"50%\"\n r=\"20\"\n fill=\"none\"\n stroke-width=\"4\"\n stroke-miterlimit=\"10\"\n stroke-dasharray=${`${basePercentage}%`}\n stroke-dashoffset=${`${trackPercentage}%`}/>\n </svg>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-circular-progress': UmCircularProgress;\n }\n}\n"]}
@@ -10,7 +10,6 @@ export declare class UmOption extends UmMenuItem {
10
10
  private set _selectedAttribute(value);
11
11
  connectedCallback(): void;
12
12
  disconnectedCallback(): void;
13
- private setNativeOption;
14
13
  }
15
14
  declare global {
16
15
  interface HTMLElementTagNameMap {
@@ -1 +1 @@
1
- {"version":3,"file":"option.d.ts","sourceRoot":"","sources":["../../src/select/option.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAGlD,OAAO,aAAa,CAAC;AAErB,qBACa,QAAS,SAAQ,UAAU;;IAItC,IACI,KAAK,IAAI,MAAM,CAElB;IACD,IAAI,KAAK,CAAC,KAAK,EAAE,MAAM,EAEtB;IAED,IACI,QAAQ,IAAI,OAAO,CAEtB;IACD,IAAI,QAAQ,CAAC,QAAQ,EAAE,OAAO,EAU7B;IAID,OAAO,KAAK,kBAAkB,GAE7B;IAED,OAAO,KAAK,kBAAkB,QAO7B;IAIQ,iBAAiB;IAQjB,oBAAoB;IA2C7B,OAAO,CAAC,eAAe;CAYxB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,QAAQ,CAAC;KACtB;CACF"}
1
+ {"version":3,"file":"option.d.ts","sourceRoot":"","sources":["../../src/select/option.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAGlD,OAAO,aAAa,CAAC;AAErB,qBACa,QAAS,SAAQ,UAAU;;IAKtC,IACI,KAAK,IAAI,MAAM,CAElB;IACD,IAAI,KAAK,CAAC,KAAK,EAAE,MAAM,EAEtB;IAED,IACI,QAAQ,IAAI,OAAO,CAEtB;IACD,IAAI,QAAQ,CAAC,QAAQ,EAAE,OAAO,EAU7B;IAID,OAAO,KAAK,kBAAkB,GAE7B;IAED,OAAO,KAAK,kBAAkB,QAO7B;IAIQ,iBAAiB;IAQjB,oBAAoB;CAiE9B;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,QAAQ,CAAC;KACtB;CACF"}
package/select/option.js CHANGED
@@ -15,7 +15,7 @@ var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (
15
15
  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");
16
16
  return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
17
17
  };
18
- var _UmOption_instances, _UmOption_nativeOption, _UmOption_select, _UmOption_attach, _UmOption_handleClick;
18
+ var _UmOption_instances, _UmOption_nativeOption, _UmOption_mutationObserver, _UmOption_select, _UmOption_attach, _UmOption_handleClick, _UmOption_updateContent, _UmOption_setNativeOption;
19
19
  import { customElement, property, state } from 'lit/decorators.js';
20
20
  import { UmMenuItem } from '../menu/menu-item.js';
21
21
  import './select.js';
@@ -24,6 +24,7 @@ let UmOption = class UmOption extends UmMenuItem {
24
24
  super(...arguments);
25
25
  _UmOption_instances.add(this);
26
26
  _UmOption_nativeOption.set(this, document.createElement('option'));
27
+ _UmOption_mutationObserver.set(this, null);
27
28
  _UmOption_select.set(this, void 0);
28
29
  }
29
30
  get value() {
@@ -64,6 +65,8 @@ let UmOption = class UmOption extends UmMenuItem {
64
65
  disconnectedCallback() {
65
66
  super.disconnectedCallback();
66
67
  this.removeEventListener('click', __classPrivateFieldGet(this, _UmOption_instances, "m", _UmOption_handleClick));
68
+ __classPrivateFieldGet(this, _UmOption_mutationObserver, "f").disconnect();
69
+ __classPrivateFieldSet(this, _UmOption_mutationObserver, null, "f");
67
70
  __classPrivateFieldGet(this, _UmOption_nativeOption, "f").remove();
68
71
  if (!__classPrivateFieldGet(this, _UmOption_select, "f")) {
69
72
  return;
@@ -72,30 +75,21 @@ let UmOption = class UmOption extends UmMenuItem {
72
75
  __classPrivateFieldGet(this, _UmOption_select, "f").value = __classPrivateFieldGet(this, _UmOption_select, "f").value;
73
76
  __classPrivateFieldSet(this, _UmOption_select, null, "f");
74
77
  }
75
- setNativeOption() {
76
- __classPrivateFieldGet(this, _UmOption_nativeOption, "f").textContent = this.textContent;
77
- if (this.hasAttribute('selected')) {
78
- __classPrivateFieldGet(this, _UmOption_nativeOption, "f").setAttribute('selected', '');
79
- }
80
- else {
81
- __classPrivateFieldGet(this, _UmOption_nativeOption, "f").removeAttribute('selected');
82
- }
83
- __classPrivateFieldGet(this, _UmOption_select, "f").nativeSelect.appendChild(__classPrivateFieldGet(this, _UmOption_nativeOption, "f"));
84
- __classPrivateFieldGet(this, _UmOption_select, "f").empty = !__classPrivateFieldGet(this, _UmOption_nativeOption, "f").textContent?.trim();
85
- }
86
78
  };
87
79
  _UmOption_nativeOption = new WeakMap();
80
+ _UmOption_mutationObserver = new WeakMap();
88
81
  _UmOption_select = new WeakMap();
89
82
  _UmOption_instances = new WeakSet();
90
83
  _UmOption_attach = async function _UmOption_attach() {
91
- await this.updateComplete;
92
84
  __classPrivateFieldSet(this, _UmOption_select, this.parentElement.tagName === 'U-SELECT'
93
85
  ? this.parentElement
94
86
  : null, "f");
95
87
  if (!__classPrivateFieldGet(this, _UmOption_select, "f")) {
96
88
  return;
97
89
  }
98
- this.setNativeOption();
90
+ __classPrivateFieldSet(this, _UmOption_mutationObserver, new MutationObserver(() => __classPrivateFieldGet(this, _UmOption_instances, "m", _UmOption_updateContent).call(this)), "f");
91
+ __classPrivateFieldGet(this, _UmOption_mutationObserver, "f").observe(this, { characterData: true, childList: true, subtree: true });
92
+ await __classPrivateFieldGet(this, _UmOption_instances, "m", _UmOption_setNativeOption).call(this);
99
93
  };
100
94
  _UmOption_handleClick = function _UmOption_handleClick(e) {
101
95
  if (!__classPrivateFieldGet(this, _UmOption_select, "f")) {
@@ -109,6 +103,20 @@ _UmOption_handleClick = function _UmOption_handleClick(e) {
109
103
  __classPrivateFieldGet(this, _UmOption_select, "f").dispatchEvent(new Event('change', { bubbles: true }));
110
104
  __classPrivateFieldGet(this, _UmOption_select, "f").menu?.close();
111
105
  };
106
+ _UmOption_updateContent = function _UmOption_updateContent() {
107
+ __classPrivateFieldGet(this, _UmOption_nativeOption, "f").textContent = this.textContent;
108
+ };
109
+ _UmOption_setNativeOption = async function _UmOption_setNativeOption() {
110
+ if (this.hasAttribute('selected')) {
111
+ __classPrivateFieldGet(this, _UmOption_nativeOption, "f").setAttribute('selected', '');
112
+ }
113
+ else {
114
+ __classPrivateFieldGet(this, _UmOption_nativeOption, "f").removeAttribute('selected');
115
+ }
116
+ __classPrivateFieldGet(this, _UmOption_select, "f").nativeSelect.appendChild(__classPrivateFieldGet(this, _UmOption_nativeOption, "f"));
117
+ await this.updateComplete;
118
+ __classPrivateFieldGet(this, _UmOption_instances, "m", _UmOption_updateContent).call(this);
119
+ };
112
120
  __decorate([
113
121
  property({ reflect: true })
114
122
  ], UmOption.prototype, "value", null);
@@ -1 +1 @@
1
- {"version":3,"file":"option.js","sourceRoot":"","sources":["../../src/select/option.ts"],"names":[],"mappings":"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","sourcesContent":["import { customElement, property, state } from 'lit/decorators.js';\n\nimport { UmMenuItem } from '../menu/menu-item.js';\nimport { UmSelect } from './select.js';\n\nimport './select.js';\n\n@customElement('u-option')\nexport class UmOption extends UmMenuItem {\n\n #nativeOption: HTMLOptionElement = document.createElement('option');\n\n @property({reflect: true})\n get value(): string {\n return this.#nativeOption.value;\n }\n set value(value: string) {\n this.#nativeOption.value = value;\n }\n\n @state()\n get selected(): boolean {\n return this.#nativeOption.selected;\n }\n set selected(selected: boolean) {\n if (this.selected === selected) {\n return;\n }\n\n this.#nativeOption.selected = selected;\n\n if (this.#select) {\n this.#select.empty = !this.#nativeOption.textContent?.trim();\n }\n }\n\n @property({type: Boolean, attribute: 'selected'})\n // @ts-ignore\n private get _selectedAttribute(): boolean {\n return this.#nativeOption.hasAttribute('selected');\n }\n // @ts-ignore\n private set _selectedAttribute(selected: boolean) {\n if (selected) {\n this.#nativeOption.setAttribute('selected', '');\n return;\n }\n\n this.#nativeOption.removeAttribute('selected');\n }\n\n #select!: UmSelect | null;\n\n override connectedCallback() {\n super.connectedCallback();\n this.addEventListener('click', this.#handleClick);\n this.setAttribute('tabindex', '-1');\n\n this.#attach();\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener('click', this.#handleClick);\n this.#nativeOption.remove();\n\n if (!this.#select) {\n return;\n }\n\n // eslint-disable-next-line no-self-assign\n this.#select.value = this.#select.value;\n this.#select = null;\n }\n\n async #attach(): Promise<void> {\n await this.updateComplete;\n this.#select = this.parentElement!.tagName === 'U-SELECT'\n ? this.parentElement as UmSelect\n : null;\n\n if (!this.#select) {\n return;\n }\n\n this.setNativeOption();\n }\n\n #handleClick(e: Event) {\n if (!this.#select) {\n return;\n }\n\n e.stopPropagation();\n\n this.selected = true;\n // eslint-disable-next-line no-self-assign\n this.#select.value = this.#select.value;\n this.#select.dispatchEvent(new InputEvent('input', {bubbles: true, composed: true}));\n this.#select.dispatchEvent(new Event('change', {bubbles: true}));\n\n this.#select.menu?.close();\n }\n\n private setNativeOption() {\n this.#nativeOption.textContent = this.textContent;\n\n if (this.hasAttribute('selected')) {\n this.#nativeOption.setAttribute('selected', '');\n } else {\n this.#nativeOption.removeAttribute('selected');\n }\n\n this.#select!.nativeSelect.appendChild(this.#nativeOption);\n this.#select!.empty = !this.#nativeOption.textContent?.trim();\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-option': UmOption;\n }\n}\n"]}
1
+ {"version":3,"file":"option.js","sourceRoot":"","sources":["../../src/select/option.ts"],"names":[],"mappings":"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","sourcesContent":["import { customElement, property, state } from 'lit/decorators.js';\n\nimport { UmMenuItem } from '../menu/menu-item.js';\nimport { UmSelect } from './select.js';\n\nimport './select.js';\n\n@customElement('u-option')\nexport class UmOption extends UmMenuItem {\n\n #nativeOption: HTMLOptionElement = document.createElement('option');\n #mutationObserver: MutationObserver | null = null;\n\n @property({reflect: true})\n get value(): string {\n return this.#nativeOption.value;\n }\n set value(value: string) {\n this.#nativeOption.value = value;\n }\n\n @state()\n get selected(): boolean {\n return this.#nativeOption.selected;\n }\n set selected(selected: boolean) {\n if (this.selected === selected) {\n return;\n }\n\n this.#nativeOption.selected = selected;\n\n if (this.#select) {\n this.#select.empty = !this.#nativeOption.textContent?.trim();\n }\n }\n\n @property({type: Boolean, attribute: 'selected'})\n // @ts-ignore\n private get _selectedAttribute(): boolean {\n return this.#nativeOption.hasAttribute('selected');\n }\n // @ts-ignore\n private set _selectedAttribute(selected: boolean) {\n if (selected) {\n this.#nativeOption.setAttribute('selected', '');\n return;\n }\n\n this.#nativeOption.removeAttribute('selected');\n }\n\n #select!: UmSelect | null;\n\n override connectedCallback() {\n super.connectedCallback();\n this.addEventListener('click', this.#handleClick);\n this.setAttribute('tabindex', '-1');\n\n this.#attach();\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener('click', this.#handleClick);\n\n this.#mutationObserver!.disconnect();\n this.#mutationObserver = null;\n this.#nativeOption.remove();\n\n if (!this.#select) {\n return;\n }\n\n // eslint-disable-next-line no-self-assign\n this.#select.value = this.#select.value;\n this.#select = null;\n }\n\n async #attach(): Promise<void> {\n\n this.#select = this.parentElement!.tagName === 'U-SELECT'\n ? this.parentElement as UmSelect\n : null;\n\n if (!this.#select) {\n return;\n }\n\n this.#mutationObserver = new MutationObserver(() => this.#updateContent())\n this.#mutationObserver.observe(this, {characterData: true, childList: true, subtree: true});\n\n await this.#setNativeOption();\n }\n\n #handleClick(e: Event) {\n if (!this.#select) {\n return;\n }\n\n e.stopPropagation();\n\n this.selected = true;\n // eslint-disable-next-line no-self-assign\n this.#select.value = this.#select.value;\n this.#select.dispatchEvent(new InputEvent('input', {bubbles: true, composed: true}));\n this.#select.dispatchEvent(new Event('change', {bubbles: true}));\n\n this.#select.menu?.close();\n }\n\n #updateContent() {\n this.#nativeOption.textContent = this.textContent;\n }\n\n async #setNativeOption(): Promise<void> {\n if (this.hasAttribute('selected')) {\n this.#nativeOption.setAttribute('selected', '');\n } else {\n this.#nativeOption.removeAttribute('selected');\n }\n\n this.#select!.nativeSelect.appendChild(this.#nativeOption);\n\n await this.updateComplete;\n this.#updateContent();\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-option': UmOption;\n }\n}\n"]}
@@ -0,0 +1,6 @@
1
+ import { MenuFieldNavigationController } from '../shared/menu-field/menu-field-navigation-controller.js';
2
+ import { UmSelect } from './select.js';
3
+ export declare class SelectNavigationController extends MenuFieldNavigationController<UmSelect> {
4
+ protected handleKeyDown(event: KeyboardEvent): void;
5
+ }
6
+ //# sourceMappingURL=select-navigation-controller.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"select-navigation-controller.d.ts","sourceRoot":"","sources":["../../src/select/select-navigation-controller.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,6BAA6B,EAAE,MAAM,0DAA0D,CAAC;AACzG,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEvC,qBAAa,0BAA2B,SAAQ,6BAA6B,CAAC,QAAQ,CAAC;cAClE,aAAa,CAAC,KAAK,EAAE,aAAa;CAgBtD"}
@@ -0,0 +1,17 @@
1
+ import { MenuFieldNavigationController } from '../shared/menu-field/menu-field-navigation-controller.js';
2
+ export class SelectNavigationController extends MenuFieldNavigationController {
3
+ handleKeyDown(event) {
4
+ if (this.host.menu.open) {
5
+ super.handleKeyDown(event);
6
+ return;
7
+ }
8
+ const isDown = event.key === 'ArrowDown';
9
+ const isUp = event.key === 'ArrowUp';
10
+ if (!isDown && !isUp) {
11
+ return;
12
+ }
13
+ event.preventDefault();
14
+ this.host.menu.show();
15
+ }
16
+ }
17
+ //# sourceMappingURL=select-navigation-controller.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"select-navigation-controller.js","sourceRoot":"","sources":["../../src/select/select-navigation-controller.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,6BAA6B,EAAE,MAAM,0DAA0D,CAAC;AAGzG,MAAM,OAAO,0BAA2B,SAAQ,6BAAuC;IAClE,aAAa,CAAC,KAAoB;QACnD,IAAI,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YACxB,KAAK,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;YAC3B,OAAO;QACT,CAAC;QAED,MAAM,MAAM,GAAG,KAAK,CAAC,GAAG,KAAK,WAAW,CAAC;QACzC,MAAM,IAAI,GAAG,KAAK,CAAC,GAAG,KAAK,SAAS,CAAC;QAErC,IAAI,CAAC,MAAM,IAAI,CAAC,IAAI,EAAE,CAAC;YACrB,OAAO;QACT,CAAC;QAED,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;IACxB,CAAC;CACF","sourcesContent":["import { MenuFieldNavigationController } from '../shared/menu-field/menu-field-navigation-controller.js';\nimport { UmSelect } from './select.js';\n\nexport class SelectNavigationController extends MenuFieldNavigationController<UmSelect> {\n protected override handleKeyDown(event: KeyboardEvent) {\n if (this.host.menu.open) {\n super.handleKeyDown(event);\n return;\n }\n\n const isDown = event.key === 'ArrowDown';\n const isUp = event.key === 'ArrowUp';\n\n if (!isDown && !isUp) {\n return;\n }\n\n event.preventDefault();\n this.host.menu.show();\n }\n}\n"]}
@@ -1,10 +1,11 @@
1
1
  import { PropertyValues } from '@lit/reactive-element';
2
2
  import { TemplateResult } from 'lit-html';
3
3
  import { UmMenu } from '../menu/menu.js';
4
+ import { UmMenuField } from '../shared/menu-field/menu-field.js';
4
5
  import { UmTextFieldBase } from '../shared/text-field-base/text-field-base.js';
5
6
  import { UmOption } from './option.js';
6
7
  import './option.js';
7
- export declare class UmSelect extends UmTextFieldBase {
8
+ export declare class UmSelect extends UmTextFieldBase implements UmMenuField {
8
9
  #private;
9
10
  static styles: import("lit").CSSResultGroup[];
10
11
  nativeSelect: HTMLSelectElement;
@@ -22,6 +23,7 @@ export declare class UmSelect extends UmTextFieldBase {
22
23
  protected updated(changedProperties: PropertyValues): void;
23
24
  connectedCallback(): void;
24
25
  disconnectedCallback(): void;
26
+ get menuItems(): UmOption[];
25
27
  }
26
28
  declare global {
27
29
  interface HTMLElementTagNameMap {
@@ -1 +1 @@
1
- {"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../src/select/select.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAEvD,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAM1C,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,YAAY,EAAE,iBAAiB,CAAoC;IAGnE,IACI,KAAK,IAAI,MAAM,CAElB;IACD,IAAI,KAAK,CAAC,KAAK,EAAE,MAAM,EAMtB;IAEgB,IAAI,EAAG,MAAM,CAAC;IACd,KAAK,EAAG,WAAW,CAAC;IAErC,IACI,aAAa,IAAI,MAAM,CAE1B;IACD,IAAI,aAAa,CAAC,KAAK,EAAE,MAAM,EAI9B;IAED,IAAI,cAAc,IAAI,QAAQ,GAAG,IAAI,CAEpC;IAED,OAAO,CAAC,QAAQ,CAAkB;IAClC,IAAI,OAAO,IAAI,QAAQ,EAAE,CAExB;cAEkB,aAAa,IAAI,cAAc;cAI/B,kBAAkB,IAAI,cAAc;cAQpC,OAAO,CAAC,iBAAiB,EAAE,cAAc;IAKnD,iBAAiB;IAOjB,oBAAoB;CA0C9B;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,QAAQ,CAAC;KACtB;CACF"}
1
+ {"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../src/select/select.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAEvD,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAM1C,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,oCAAoC,CAAC;AACjE,OAAO,EAAE,eAAe,EAAE,MAAM,8CAA8C,CAAC;AAC/E,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAGvC,OAAO,aAAa,CAAC;AAErB,qBACa,QAAS,SAAQ,eAAgB,YAAW,WAAW;;IAClE,OAAgB,MAAM,iCAAoC;IAE1D,YAAY,EAAE,iBAAiB,CAAoC;IAInE,IACI,KAAK,IAAI,MAAM,CAElB;IACD,IAAI,KAAK,CAAC,KAAK,EAAE,MAAM,EAQtB;IAEgB,IAAI,EAAG,MAAM,CAAC;IACd,KAAK,EAAG,WAAW,CAAC;IAErC,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,cAAc;cAM/B,kBAAkB,IAAI,cAAc;cAQpC,OAAO,CAAC,iBAAiB,EAAE,cAAc;IAMnD,iBAAiB;IAOjB,oBAAoB;IA+C7B,IAAI,SAAS,IAAI,QAAQ,EAAE,CAE1B;CAEF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,QAAQ,CAAC;KACtB;CACF"}
package/select/select.js CHANGED
@@ -15,19 +15,21 @@ var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (
15
15
  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");
16
16
  return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
17
17
  };
18
- var _UmSelect_instances, _UmSelect_connected, _UmSelect_handleClick, _UmSelect_handleMenuClick, _UmSelect_handleSlotChange, _UmSelect_attach;
18
+ var _UmSelect_instances, _UmSelect_navigationController, _UmSelect_connected, _UmSelect_handleClick, _UmSelect_handleMenuClick, _UmSelect_handleSlotChange, _UmSelect_attach;
19
19
  import { html } from 'lit';
20
20
  import { customElement, query, state } from 'lit/decorators.js';
21
21
  import { html as staticHtml } from 'lit/static-html.js';
22
22
  import { styles } from './select.styles.js';
23
23
  import { UmTextFieldBase } from '../shared/text-field-base/text-field-base.js';
24
24
  import { UmOption } from './option.js';
25
+ import { SelectNavigationController } from './select-navigation-controller.js';
25
26
  import './option.js';
26
27
  let UmSelect = class UmSelect extends UmTextFieldBase {
27
28
  constructor() {
28
29
  super(...arguments);
29
30
  _UmSelect_instances.add(this);
30
31
  this.nativeSelect = document.createElement('select');
32
+ _UmSelect_navigationController.set(this, new SelectNavigationController(this));
31
33
  _UmSelect_connected.set(this, false);
32
34
  this._options = [];
33
35
  _UmSelect_handleClick.set(this, () => {
@@ -39,17 +41,16 @@ let UmSelect = class UmSelect extends UmTextFieldBase {
39
41
  }
40
42
  set value(value) {
41
43
  this.nativeSelect.value = value;
42
- if (__classPrivateFieldGet(this, _UmSelect_connected, "f")) {
43
- this.elementInternals.setFormValue(value);
44
+ if (!__classPrivateFieldGet(this, _UmSelect_connected, "f")) {
45
+ return;
44
46
  }
47
+ this.elementInternals.setFormValue(value);
45
48
  }
46
49
  get selectedIndex() {
47
- return this.nativeSelect?.selectedIndex ?? -1;
50
+ return this.nativeSelect.selectedIndex;
48
51
  }
49
52
  set selectedIndex(index) {
50
- if (this.nativeSelect) {
51
- this.nativeSelect.selectedIndex = index;
52
- }
53
+ this.nativeSelect.selectedIndex = index;
53
54
  }
54
55
  get selectedOption() {
55
56
  return this.options[this.selectedIndex] ?? null;
@@ -58,7 +59,9 @@ let UmSelect = class UmSelect extends UmTextFieldBase {
58
59
  return this._options;
59
60
  }
60
61
  renderControl() {
61
- return staticHtml `<div class="input"></div>`;
62
+ return staticHtml `
63
+ <button class="button"></button>
64
+ <div class="input"></div>`;
62
65
  }
63
66
  renderAfterContent() {
64
67
  return html `
@@ -69,6 +72,7 @@ let UmSelect = class UmSelect extends UmTextFieldBase {
69
72
  }
70
73
  updated(changedProperties) {
71
74
  super.updated(changedProperties);
75
+ this.empty = !this.selectedOption?.textContent?.trim();
72
76
  this.elementInternals.setFormValue(this.nativeSelect.value || null);
73
77
  }
74
78
  connectedCallback() {
@@ -78,12 +82,17 @@ let UmSelect = class UmSelect extends UmTextFieldBase {
78
82
  }
79
83
  disconnectedCallback() {
80
84
  super.disconnectedCallback();
85
+ __classPrivateFieldGet(this, _UmSelect_navigationController, "f").detach();
81
86
  __classPrivateFieldSet(this, _UmSelect_connected, false, "f");
82
87
  this.nativeSelect.remove();
83
88
  this.container.removeEventListener('click', __classPrivateFieldGet(this, _UmSelect_handleClick, "f"));
84
89
  this.menu.removeEventListener('click', __classPrivateFieldGet(this, _UmSelect_instances, "m", _UmSelect_handleMenuClick));
85
90
  }
91
+ get menuItems() {
92
+ return this.options;
93
+ }
86
94
  };
95
+ _UmSelect_navigationController = new WeakMap();
87
96
  _UmSelect_connected = new WeakMap();
88
97
  _UmSelect_handleClick = new WeakMap();
89
98
  _UmSelect_instances = new WeakSet();
@@ -105,6 +114,8 @@ _UmSelect_handleSlotChange = function _UmSelect_handleSlotChange(e) {
105
114
  };
106
115
  _UmSelect_attach = async function _UmSelect_attach() {
107
116
  await this.updateComplete;
117
+ __classPrivateFieldGet(this, _UmSelect_navigationController, "f").attach(this);
118
+ this.nativeSelect.setAttribute('tabindex', '-1');
108
119
  this.input.appendChild(this.nativeSelect);
109
120
  this.container.addEventListener('click', __classPrivateFieldGet(this, _UmSelect_handleClick, "f"));
110
121
  this.menu.anchorElement = this.container;