@universal-material/web 3.0.69 → 3.0.71

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 (194) hide show
  1. package/app-bar/top-app-bar.js +3 -2
  2. package/app-bar/top-app-bar.js.map +1 -1
  3. package/button/button-base.d.ts +1 -0
  4. package/button/button-base.d.ts.map +1 -1
  5. package/button/button-base.js +7 -18
  6. package/button/button-base.js.map +1 -1
  7. package/button/button-base.styles.d.ts +2 -0
  8. package/button/button-base.styles.d.ts.map +1 -0
  9. package/button/button-base.styles.js +16 -0
  10. package/button/button-base.styles.js.map +1 -0
  11. package/button/button-set.d.ts +1 -1
  12. package/button/button-set.d.ts.map +1 -1
  13. package/button/button-set.js +1 -1
  14. package/button/button-set.js.map +1 -1
  15. package/button/button-set.styles.d.ts.map +1 -1
  16. package/button/button-set.styles.js +0 -19
  17. package/button/button-set.styles.js.map +1 -1
  18. package/button/button.d.ts +2 -2
  19. package/button/button.d.ts.map +1 -1
  20. package/button/button.js +1 -1
  21. package/button/button.js.map +1 -1
  22. package/button/button.styles.d.ts.map +1 -1
  23. package/button/button.styles.js +0 -100
  24. package/button/button.styles.js.map +1 -1
  25. package/button/fab.d.ts +2 -2
  26. package/button/fab.d.ts.map +1 -1
  27. package/button/fab.js +1 -1
  28. package/button/fab.js.map +1 -1
  29. package/button/fab.styles.d.ts.map +1 -1
  30. package/button/fab.styles.js +0 -100
  31. package/button/fab.styles.js.map +1 -1
  32. package/button/icon-button.d.ts +2 -2
  33. package/button/icon-button.d.ts.map +1 -1
  34. package/button/icon-button.js +1 -1
  35. package/button/icon-button.js.map +1 -1
  36. package/button/icon-button.styles.d.ts.map +1 -1
  37. package/button/icon-button.styles.js +0 -100
  38. package/button/icon-button.styles.js.map +1 -1
  39. package/card/card-content.js +1 -1
  40. package/card/card-content.js.map +1 -1
  41. package/card/card-media.js +1 -1
  42. package/card/card-media.js.map +1 -1
  43. package/card/card.js +1 -1
  44. package/card/card.js.map +1 -1
  45. package/checkbox/checkbox.js +8 -20
  46. package/checkbox/checkbox.js.map +1 -1
  47. package/chip/chip-set.d.ts +1 -1
  48. package/chip/chip-set.d.ts.map +1 -1
  49. package/chip/chip-set.js +1 -1
  50. package/chip/chip-set.js.map +1 -1
  51. package/chip/chip-set.styles.d.ts.map +1 -1
  52. package/chip/chip-set.styles.js +0 -19
  53. package/chip/chip-set.styles.js.map +1 -1
  54. package/chip/chip.d.ts +1 -1
  55. package/chip/chip.d.ts.map +1 -1
  56. package/chip/chip.js +39 -54
  57. package/chip/chip.js.map +1 -1
  58. package/chip/chip.styles.d.ts.map +1 -1
  59. package/chip/chip.styles.js +0 -87
  60. package/chip/chip.styles.js.map +1 -1
  61. package/chip-field/chip-field.js +72 -86
  62. package/chip-field/chip-field.js.map +1 -1
  63. package/custom-elements.json +3207 -2538
  64. package/dialog/confirm-dialog-builder.js +6 -22
  65. package/dialog/confirm-dialog-builder.js.map +1 -1
  66. package/dialog/dialog-builder.js +4 -17
  67. package/dialog/dialog-builder.js.map +1 -1
  68. package/dialog/dialog.js +65 -80
  69. package/dialog/dialog.js.map +1 -1
  70. package/dialog/message-dialog-builder.js +3 -19
  71. package/dialog/message-dialog-builder.js.map +1 -1
  72. package/elevation/elevation.js +1 -1
  73. package/elevation/elevation.js.map +1 -1
  74. package/field/field-base.d.ts +2 -2
  75. package/field/field-base.d.ts.map +1 -1
  76. package/field/field-base.js +13 -16
  77. package/field/field-base.js.map +1 -1
  78. package/field/field-base.styles.js +1 -1
  79. package/field/field-base.styles.js.map +1 -1
  80. package/list/list-item.js +1 -1
  81. package/list/list-item.js.map +1 -1
  82. package/list/list.js +1 -1
  83. package/list/list.js.map +1 -1
  84. package/menu/menu-item.d.ts +12 -6
  85. package/menu/menu-item.d.ts.map +1 -1
  86. package/menu/menu-item.js +49 -31
  87. package/menu/menu-item.js.map +1 -1
  88. package/menu/menu-item.styles.d.ts.map +1 -1
  89. package/menu/menu-item.styles.js +15 -90
  90. package/menu/menu-item.styles.js.map +1 -1
  91. package/menu/menu.d.ts.map +1 -1
  92. package/menu/menu.js +129 -134
  93. package/menu/menu.js.map +1 -1
  94. package/navigation/drawer-item.d.ts +1 -1
  95. package/navigation/drawer-item.d.ts.map +1 -1
  96. package/navigation/drawer-item.js +4 -5
  97. package/navigation/drawer-item.js.map +1 -1
  98. package/navigation/drawer-item.styles.d.ts.map +1 -1
  99. package/navigation/drawer-item.styles.js +0 -87
  100. package/navigation/drawer-item.styles.js.map +1 -1
  101. package/navigation/drawer.js +4 -4
  102. package/navigation/drawer.js.map +1 -1
  103. package/navigation/side-navigation.js +8 -20
  104. package/navigation/side-navigation.js.map +1 -1
  105. package/package.json +18 -18
  106. package/progress/circular-progress.d.ts +1 -2
  107. package/progress/circular-progress.d.ts.map +1 -1
  108. package/progress/circular-progress.js +19 -27
  109. package/progress/circular-progress.js.map +1 -1
  110. package/progress/progress-bar.d.ts +1 -2
  111. package/progress/progress-bar.d.ts.map +1 -1
  112. package/progress/progress-bar.js +12 -20
  113. package/progress/progress-bar.js.map +1 -1
  114. package/radio/radio.js +53 -61
  115. package/radio/radio.js.map +1 -1
  116. package/ripple/ripple.js +3 -2
  117. package/ripple/ripple.js.map +1 -1
  118. package/select/extended-option.d.ts +5 -0
  119. package/select/extended-option.d.ts.map +1 -0
  120. package/select/extended-option.js +2 -0
  121. package/select/extended-option.js.map +1 -0
  122. package/select/extended-select.d.ts +6 -0
  123. package/select/extended-select.d.ts.map +1 -0
  124. package/select/extended-select.js +2 -0
  125. package/select/extended-select.js.map +1 -0
  126. package/select/option.d.ts +10 -0
  127. package/select/option.d.ts.map +1 -1
  128. package/select/option.js +84 -74
  129. package/select/option.js.map +1 -1
  130. package/select/option.styles.d.ts.map +1 -1
  131. package/select/option.styles.js +10 -0
  132. package/select/option.styles.js.map +1 -1
  133. package/select/select-navigation-controller.d.ts +10 -2
  134. package/select/select-navigation-controller.d.ts.map +1 -1
  135. package/select/select-navigation-controller.js +66 -3
  136. package/select/select-navigation-controller.js.map +1 -1
  137. package/select/select.d.ts +10 -4
  138. package/select/select.d.ts.map +1 -1
  139. package/select/select.js +179 -68
  140. package/select/select.js.map +1 -1
  141. package/select/select.styles.d.ts.map +1 -1
  142. package/select/select.styles.js +15 -6
  143. package/select/select.styles.js.map +1 -1
  144. package/shared/button-wrapper.d.ts +2 -0
  145. package/shared/button-wrapper.d.ts.map +1 -1
  146. package/shared/button-wrapper.js +18 -22
  147. package/shared/button-wrapper.js.map +1 -1
  148. package/shared/button-wrapper.styles.d.ts +2 -0
  149. package/shared/button-wrapper.styles.d.ts.map +1 -0
  150. package/shared/button-wrapper.styles.js +63 -0
  151. package/shared/button-wrapper.styles.js.map +1 -0
  152. package/shared/compare-text.d.ts +2 -0
  153. package/shared/compare-text.d.ts.map +1 -0
  154. package/shared/compare-text.js +5 -0
  155. package/shared/compare-text.js.map +1 -0
  156. package/shared/menu-field/menu-field-navigation-controller.d.ts +11 -4
  157. package/shared/menu-field/menu-field-navigation-controller.d.ts.map +1 -1
  158. package/shared/menu-field/menu-field-navigation-controller.js +56 -31
  159. package/shared/menu-field/menu-field-navigation-controller.js.map +1 -1
  160. package/shared/mixin-attribute-properties.d.ts.map +1 -1
  161. package/shared/normalize-text.d.ts +1 -1
  162. package/shared/normalize-text.d.ts.map +1 -1
  163. package/shared/normalize-text.js +1 -1
  164. package/shared/normalize-text.js.map +1 -1
  165. package/shared/selection-control/selection-control-list-item.d.ts.map +1 -1
  166. package/shared/selection-control/selection-control-list-item.js +7 -7
  167. package/shared/selection-control/selection-control-list-item.js.map +1 -1
  168. package/shared/selection-control/selection-control.js +16 -28
  169. package/shared/selection-control/selection-control.js.map +1 -1
  170. package/shared/sets/set-base.d.ts +2 -0
  171. package/shared/sets/set-base.d.ts.map +1 -1
  172. package/shared/sets/set-base.js +2 -0
  173. package/shared/sets/set-base.js.map +1 -1
  174. package/shared/sets/set-base.styles.d.ts +2 -0
  175. package/shared/sets/set-base.styles.d.ts.map +1 -0
  176. package/shared/sets/set-base.styles.js +22 -0
  177. package/shared/sets/set-base.styles.js.map +1 -0
  178. package/shared/text-field-base/text-field-base.js +6 -6
  179. package/shared/text-field-base/text-field-base.js.map +1 -1
  180. package/snackbar/snackbar.d.ts.map +1 -1
  181. package/snackbar/snackbar.js +13 -7
  182. package/snackbar/snackbar.js.map +1 -1
  183. package/switch/switch.js +4 -4
  184. package/switch/switch.js.map +1 -1
  185. package/text-field/text-field.d.ts +2 -0
  186. package/text-field/text-field.d.ts.map +1 -1
  187. package/text-field/text-field.js +22 -30
  188. package/text-field/text-field.js.map +1 -1
  189. package/typeahead/highlight.js +7 -24
  190. package/typeahead/highlight.js.map +1 -1
  191. package/typeahead/typeahead.d.ts +3 -0
  192. package/typeahead/typeahead.d.ts.map +1 -1
  193. package/typeahead/typeahead.js +184 -180
  194. package/typeahead/typeahead.js.map +1 -1
package/menu/menu.js CHANGED
@@ -4,18 +4,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
4
4
  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;
5
5
  return c > 3 && r && Object.defineProperty(target, key, r), r;
6
6
  };
7
- var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
8
- if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
9
- 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");
10
- return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
11
- };
12
- var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
13
- if (kind === "m") throw new TypeError("Private method is not writable");
14
- if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
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
- return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
17
- };
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
7
  import { html, LitElement } from 'lit';
20
8
  import { customElement, property, query } from 'lit/decorators.js';
21
9
  import { styles as baseStyles } from '../shared/base.styles.js';
@@ -24,8 +12,7 @@ import '../elevation/elevation.js';
24
12
  let UmMenu = class UmMenu extends LitElement {
25
13
  constructor() {
26
14
  super(...arguments);
27
- _UmMenu_instances.add(this);
28
- _UmMenu_open.set(this, false);
15
+ this.#open = false;
29
16
  this.positioning = 'relative';
30
17
  this.manualFocus = false;
31
18
  /**
@@ -44,7 +31,6 @@ let UmMenu = class UmMenu extends LitElement {
44
31
  * Don't limit the height of the menu
45
32
  */
46
33
  this.allowOverflow = false;
47
- _UmMenu_anchorElement.set(this, void 0);
48
34
  this.toggle = () => {
49
35
  if (this.open) {
50
36
  this.close();
@@ -58,20 +44,32 @@ let UmMenu = class UmMenu extends LitElement {
58
44
  }
59
45
  };
60
46
  }
47
+ static { this.styles = [baseStyles, styles]; }
48
+ #open;
61
49
  /**
62
50
  * Opens the menu and makes it visible. Alternative to the `.show()`, `.close()` and `.toggle()` methods
63
51
  */
64
52
  get open() {
65
- return __classPrivateFieldGet(this, _UmMenu_open, "f");
53
+ return this.#open;
66
54
  }
67
55
  set open(open) {
68
56
  if (!open) {
69
- __classPrivateFieldSet(this, _UmMenu_open, open, "f");
57
+ const closePrevented = !this.dispatchEvent(new Event('close', { cancelable: true }));
58
+ if (closePrevented) {
59
+ return;
60
+ }
61
+ this.#open = open;
62
+ this.menu?.addEventListener('transitionend', () => this.dispatchEvent(new Event('closed')), { capture: true, once: true });
70
63
  document.removeEventListener('click', this.close);
71
64
  return;
72
65
  }
66
+ const openPrevented = !this.dispatchEvent(new Event('open', { cancelable: true }));
67
+ if (openPrevented) {
68
+ return;
69
+ }
73
70
  this.calcDropdownPositioning();
74
- __classPrivateFieldSet(this, _UmMenu_open, open, "f");
71
+ this.#open = open;
72
+ this.menu?.addEventListener('transitionend', () => this.dispatchEvent(new Event('opened')), { capture: true, once: true });
75
73
  setTimeout(() => document.addEventListener('click', this.close));
76
74
  if (this.manualFocus) {
77
75
  return;
@@ -81,11 +79,12 @@ let UmMenu = class UmMenu extends LitElement {
81
79
  get scrollContainer() {
82
80
  return this.menu;
83
81
  }
82
+ #anchorElement;
84
83
  get anchorElement() {
85
- return __classPrivateFieldGet(this, _UmMenu_anchorElement, "f") ?? this.parentElement ?? this.getRootNode().host;
84
+ return this.#anchorElement ?? this.parentElement ?? this.getRootNode().host;
86
85
  }
87
86
  set anchorElement(anchorElement) {
88
- __classPrivateFieldSet(this, _UmMenu_anchorElement, anchorElement, "f");
87
+ this.#anchorElement = anchorElement;
89
88
  }
90
89
  render() {
91
90
  return html `
@@ -115,9 +114,116 @@ let UmMenu = class UmMenu extends LitElement {
115
114
  }
116
115
  const menuPosition = this.getMenuPosition();
117
116
  const menuSize = this.getMenuSize();
118
- __classPrivateFieldGet(this, _UmMenu_instances, "m", _UmMenu_resetMenu).call(this);
119
- __classPrivateFieldGet(this, _UmMenu_instances, "m", _UmMenu_setToOpenUpOrDown).call(this, menuPosition, menuSize);
120
- __classPrivateFieldGet(this, _UmMenu_instances, "m", _UmMenu_setToOpenToStartOrEnd).call(this, menuPosition, menuSize);
117
+ this.#resetMenu();
118
+ this.#setToOpenUpOrDown(menuPosition, menuSize);
119
+ this.#setToOpenToStartOrEnd(menuPosition, menuSize);
120
+ }
121
+ #resetMenu() {
122
+ this.menu.className = 'menu';
123
+ this.menu.style.top = '';
124
+ this.menu.style.bottom = '';
125
+ this.menu.style.left = '';
126
+ this.menu.style.right = '';
127
+ this.menu.style.maxHeight = '';
128
+ }
129
+ #setToOpenUpOrDown(menuPosition, menuSize) {
130
+ if (this.anchorCorner.startsWith('auto-')) {
131
+ this.#openBlockAuto(menuPosition, menuSize);
132
+ return;
133
+ }
134
+ const side = this.anchorCorner.startsWith('start-')
135
+ ? menuPosition.bounds.top
136
+ : menuPosition.bounds.bottom;
137
+ if (this.direction.startsWith('up-')) {
138
+ this.#tryOpenUp(side, menuSize);
139
+ return;
140
+ }
141
+ this.#tryOpenDown(side, menuSize);
142
+ }
143
+ #openBlockAuto(menuPosition, menuSize) {
144
+ const topSide = menuPosition.bounds.top;
145
+ const bottomSide = menuPosition.bounds.bottom;
146
+ const viewPortHeight = window.innerHeight;
147
+ if (bottomSide.bottom >= topSide.top || viewPortHeight - (bottomSide.top + menuSize.height) >= 0) {
148
+ this.#openDown(bottomSide);
149
+ return;
150
+ }
151
+ this.#openUp(topSide);
152
+ }
153
+ #tryOpenUp(side, menuSize) {
154
+ if (side.top === side.bottom || side.top - menuSize.height >= 0) {
155
+ this.#openUp(side);
156
+ return;
157
+ }
158
+ this.#openToLargestBlockSide(side);
159
+ }
160
+ #tryOpenDown(side, menuSize) {
161
+ const viewPortHeight = window.innerHeight;
162
+ if (side.top === side.bottom || viewPortHeight - (side.top + menuSize.height) >= 0) {
163
+ this.#openDown(side);
164
+ return;
165
+ }
166
+ this.#openToLargestBlockSide(side);
167
+ }
168
+ #openToLargestBlockSide(side) {
169
+ if (side.top > side.bottom) {
170
+ this.#openUp(side);
171
+ return;
172
+ }
173
+ this.#openDown(side);
174
+ }
175
+ #setToOpenToStartOrEnd(menuPosition, menuSize) {
176
+ const openStart = menuPosition.isRtl
177
+ ? this.#tryOpenRight.bind(this)
178
+ : this.#tryOpenLeft.bind(this);
179
+ const openEnd = menuPosition.isRtl
180
+ ? this.#tryOpenLeft.bind(this)
181
+ : this.#tryOpenRight.bind(this);
182
+ const side = this.anchorCorner.endsWith('-start')
183
+ ? menuPosition.bounds.start
184
+ : menuPosition.bounds.end;
185
+ if (this.direction.endsWith('-start')) {
186
+ openStart(side, menuSize);
187
+ return;
188
+ }
189
+ openEnd(side, menuSize);
190
+ }
191
+ #tryOpenLeft(side, menuSize) {
192
+ if (side.left === side.right || side.left - menuSize.width >= 0) {
193
+ this.menu.style.right = `${side.relativeX * -1}px`;
194
+ return;
195
+ }
196
+ this.#openToLargestInlineSide(side);
197
+ }
198
+ #tryOpenRight(side, menuSize) {
199
+ const viewPortWidth = window.innerWidth;
200
+ if (side.left === side.right || viewPortWidth - (side.left + menuSize.width) >= 0) {
201
+ this.menu.style.left = `${side.relativeX}px`;
202
+ return;
203
+ }
204
+ this.#openToLargestInlineSide(side);
205
+ }
206
+ #openToLargestInlineSide(side) {
207
+ if (side.left > side.right) {
208
+ this.menu.style.right = `${side.relativeX * -1}px`;
209
+ return;
210
+ }
211
+ this.menu.style.left = `${side.relativeX}px`;
212
+ }
213
+ #openUp(side) {
214
+ const viewPortHeight = window.innerHeight;
215
+ this.menu.style.bottom = `${side.relativeY * -1}px`;
216
+ this.menu.classList.add('up');
217
+ this.menu.style.maxHeight = this.allowOverflow
218
+ ? ''
219
+ : `${viewPortHeight - side.bottom}px`;
220
+ }
221
+ #openDown(side) {
222
+ const viewPortHeight = window.innerHeight;
223
+ this.menu.style.top = `${side.relativeY}px`;
224
+ this.menu.style.maxHeight = this.allowOverflow
225
+ ? ''
226
+ : `${viewPortHeight - side.top}px`;
121
227
  }
122
228
  getMenuPosition() {
123
229
  const viewPortWidth = window.innerWidth;
@@ -174,117 +280,6 @@ let UmMenu = class UmMenu extends LitElement {
174
280
  };
175
281
  }
176
282
  };
177
- _UmMenu_open = new WeakMap();
178
- _UmMenu_anchorElement = new WeakMap();
179
- _UmMenu_instances = new WeakSet();
180
- _UmMenu_resetMenu = function _UmMenu_resetMenu() {
181
- this.menu.className = 'menu';
182
- this.menu.style.top = '';
183
- this.menu.style.bottom = '';
184
- this.menu.style.left = '';
185
- this.menu.style.right = '';
186
- this.menu.style.maxHeight = '';
187
- };
188
- _UmMenu_setToOpenUpOrDown = function _UmMenu_setToOpenUpOrDown(menuPosition, menuSize) {
189
- if (this.anchorCorner.startsWith('auto-')) {
190
- __classPrivateFieldGet(this, _UmMenu_instances, "m", _UmMenu_openBlockAuto).call(this, menuPosition, menuSize);
191
- return;
192
- }
193
- const side = this.anchorCorner.startsWith('start-')
194
- ? menuPosition.bounds.top
195
- : menuPosition.bounds.bottom;
196
- if (this.direction.startsWith('up-')) {
197
- __classPrivateFieldGet(this, _UmMenu_instances, "m", _UmMenu_tryOpenUp).call(this, side, menuSize);
198
- return;
199
- }
200
- __classPrivateFieldGet(this, _UmMenu_instances, "m", _UmMenu_tryOpenDown).call(this, side, menuSize);
201
- };
202
- _UmMenu_openBlockAuto = function _UmMenu_openBlockAuto(menuPosition, menuSize) {
203
- const topSide = menuPosition.bounds.top;
204
- const bottomSide = menuPosition.bounds.bottom;
205
- const viewPortHeight = window.innerHeight;
206
- if (bottomSide.bottom >= topSide.top || viewPortHeight - (bottomSide.top + menuSize.height) >= 0) {
207
- __classPrivateFieldGet(this, _UmMenu_instances, "m", _UmMenu_openDown).call(this, bottomSide);
208
- return;
209
- }
210
- __classPrivateFieldGet(this, _UmMenu_instances, "m", _UmMenu_openUp).call(this, topSide);
211
- };
212
- _UmMenu_tryOpenUp = function _UmMenu_tryOpenUp(side, menuSize) {
213
- if (side.top === side.bottom || side.top - menuSize.height >= 0) {
214
- __classPrivateFieldGet(this, _UmMenu_instances, "m", _UmMenu_openUp).call(this, side);
215
- return;
216
- }
217
- __classPrivateFieldGet(this, _UmMenu_instances, "m", _UmMenu_openToLargestBlockSide).call(this, side);
218
- };
219
- _UmMenu_tryOpenDown = function _UmMenu_tryOpenDown(side, menuSize) {
220
- const viewPortHeight = window.innerHeight;
221
- if (side.top === side.bottom || viewPortHeight - (side.top + menuSize.height) >= 0) {
222
- __classPrivateFieldGet(this, _UmMenu_instances, "m", _UmMenu_openDown).call(this, side);
223
- return;
224
- }
225
- __classPrivateFieldGet(this, _UmMenu_instances, "m", _UmMenu_openToLargestBlockSide).call(this, side);
226
- };
227
- _UmMenu_openToLargestBlockSide = function _UmMenu_openToLargestBlockSide(side) {
228
- if (side.top > side.bottom) {
229
- __classPrivateFieldGet(this, _UmMenu_instances, "m", _UmMenu_openUp).call(this, side);
230
- return;
231
- }
232
- __classPrivateFieldGet(this, _UmMenu_instances, "m", _UmMenu_openDown).call(this, side);
233
- };
234
- _UmMenu_setToOpenToStartOrEnd = function _UmMenu_setToOpenToStartOrEnd(menuPosition, menuSize) {
235
- const openStart = menuPosition.isRtl
236
- ? __classPrivateFieldGet(this, _UmMenu_instances, "m", _UmMenu_tryOpenRight).bind(this)
237
- : __classPrivateFieldGet(this, _UmMenu_instances, "m", _UmMenu_tryOpenLeft).bind(this);
238
- const openEnd = menuPosition.isRtl
239
- ? __classPrivateFieldGet(this, _UmMenu_instances, "m", _UmMenu_tryOpenLeft).bind(this)
240
- : __classPrivateFieldGet(this, _UmMenu_instances, "m", _UmMenu_tryOpenRight).bind(this);
241
- const side = this.anchorCorner.endsWith('-start')
242
- ? menuPosition.bounds.start
243
- : menuPosition.bounds.end;
244
- if (this.direction.endsWith('-start')) {
245
- openStart(side, menuSize);
246
- return;
247
- }
248
- openEnd(side, menuSize);
249
- };
250
- _UmMenu_tryOpenLeft = function _UmMenu_tryOpenLeft(side, menuSize) {
251
- if (side.left === side.right || side.left - menuSize.width >= 0) {
252
- this.menu.style.right = `${side.relativeX * -1}px`;
253
- return;
254
- }
255
- __classPrivateFieldGet(this, _UmMenu_instances, "m", _UmMenu_openToLargestInlineSide).call(this, side);
256
- };
257
- _UmMenu_tryOpenRight = function _UmMenu_tryOpenRight(side, menuSize) {
258
- const viewPortWidth = window.innerWidth;
259
- if (side.left === side.right || viewPortWidth - (side.left + menuSize.width) >= 0) {
260
- this.menu.style.left = `${side.relativeX}px`;
261
- return;
262
- }
263
- __classPrivateFieldGet(this, _UmMenu_instances, "m", _UmMenu_openToLargestInlineSide).call(this, side);
264
- };
265
- _UmMenu_openToLargestInlineSide = function _UmMenu_openToLargestInlineSide(side) {
266
- if (side.left > side.right) {
267
- this.menu.style.right = `${side.relativeX * -1}px`;
268
- return;
269
- }
270
- this.menu.style.left = `${side.relativeX}px`;
271
- };
272
- _UmMenu_openUp = function _UmMenu_openUp(side) {
273
- const viewPortHeight = window.innerHeight;
274
- this.menu.style.bottom = `${side.relativeY * -1}px`;
275
- this.menu.classList.add('up');
276
- this.menu.style.maxHeight = this.allowOverflow
277
- ? ''
278
- : `${viewPortHeight - side.bottom}px`;
279
- };
280
- _UmMenu_openDown = function _UmMenu_openDown(side) {
281
- const viewPortHeight = window.innerHeight;
282
- this.menu.style.top = `${side.relativeY}px`;
283
- this.menu.style.maxHeight = this.allowOverflow
284
- ? ''
285
- : `${viewPortHeight - side.top}px`;
286
- };
287
- UmMenu.styles = [baseStyles, styles];
288
283
  __decorate([
289
284
  property({ type: Boolean, reflect: true })
290
285
  ], UmMenu.prototype, "open", null);
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\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
+ {"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 const closePrevented = !this.dispatchEvent(new Event('close', {cancelable: true}));\n\n if (closePrevented) {\n return;\n }\n\n this.#open = open;\n this.menu?.addEventListener('transitionend', () => this.dispatchEvent(new Event('closed')), {capture: true, once: true});\n\n document.removeEventListener('click', this.close);\n return;\n }\n\n const openPrevented = !this.dispatchEvent(new Event('open', {cancelable: true}));\n\n if (openPrevented) {\n return;\n }\n\n this.calcDropdownPositioning();\n this.#open = open;\n\n this.menu?.addEventListener('transitionend', () =>\n this.dispatchEvent(new Event('opened')), {capture: true, once: true});\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,7 +1,7 @@
1
1
  import { HTMLTemplateResult } from 'lit';
2
2
  import { UmButtonWrapper } from '../shared/button-wrapper.js';
3
3
  export declare class UmDrawerItem extends UmButtonWrapper {
4
- static styles: import("lit").CSSResult[];
4
+ static styles: import("lit").CSSResultGroup[];
5
5
  /**
6
6
  * Whether the drawer item has icon or not
7
7
  *
@@ -1 +1 @@
1
- {"version":3,"file":"drawer-item.d.ts","sourceRoot":"","sources":["../../src/navigation/drawer-item.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,MAAM,KAAK,CAAC;AAM/C,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAE9D,qBACa,YAAa,SAAQ,eAAe;IAE/C,OAAgB,MAAM,4BAGpB;IAEF;;;;OAIG;IAC8D,OAAO,UAAS;IAEjF;;;;OAIG;IAC+D,QAAQ,UAAS;IAEnF;;;;OAIG;IACuC,MAAM,UAAS;IAEzD;;OAEG;IACsE,cAAc,UAAS;IAGhG,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAiB;IAG/C,OAAO,CAAC,QAAQ,CAAC,cAAc,CAAiB;IAEvC,iBAAiB;cAKP,aAAa,IAAI,kBAAkB;IAiBtD,OAAO,CAAC,oBAAoB;IAI5B,OAAO,CAAC,qBAAqB;IAIpB,WAAW,IAAI,IAAI;CAW7B;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,YAAY,CAAC;KAC/B;CACF"}
1
+ {"version":3,"file":"drawer-item.d.ts","sourceRoot":"","sources":["../../src/navigation/drawer-item.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,kBAAkB,EAAE,MAAM,KAAK,CAAC;AAK/C,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAE9D,qBACa,YAAa,SAAQ,eAAe;IAE/C,OAAgB,MAAM,iCAGpB;IAEF;;;;OAIG;IAC8D,OAAO,UAAS;IAEjF;;;;OAIG;IAC+D,QAAQ,UAAS;IAEnF;;;;OAIG;IACuC,MAAM,UAAS;IAEzD;;OAEG;IACsE,cAAc,UAAS;IAGhG,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAiB;IAG/C,OAAO,CAAC,QAAQ,CAAC,cAAc,CAAiB;IAEvC,iBAAiB;cAKP,aAAa,IAAI,kBAAkB;IAiBtD,OAAO,CAAC,oBAAoB;IAI5B,OAAO,CAAC,qBAAqB;IAIpB,WAAW,IAAI,IAAI;CAW7B;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,YAAY,CAAC;KAC/B;CACF"}
@@ -6,7 +6,6 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
6
6
  };
7
7
  import { html } from 'lit';
8
8
  import { customElement, property, queryAssignedElements } from 'lit/decorators.js';
9
- import { styles as baseStyles } from '../shared/base.styles.js';
10
9
  import { styles } from './drawer-item.styles.js';
11
10
  import { UmButtonWrapper } from '../shared/button-wrapper.js';
12
11
  let UmDrawerItem = class UmDrawerItem extends UmButtonWrapper {
@@ -35,6 +34,10 @@ let UmDrawerItem = class UmDrawerItem extends UmButtonWrapper {
35
34
  */
36
35
  this.keepDrawerOpen = false;
37
36
  }
37
+ static { this.styles = [
38
+ UmButtonWrapper.styles,
39
+ styles
40
+ ]; }
38
41
  connectedCallback() {
39
42
  super.connectedCallback();
40
43
  this.setAttribute('aria-labelledby', 'label');
@@ -71,10 +74,6 @@ let UmDrawerItem = class UmDrawerItem extends UmButtonWrapper {
71
74
  }
72
75
  }
73
76
  };
74
- UmDrawerItem.styles = [
75
- baseStyles,
76
- styles
77
- ];
78
77
  __decorate([
79
78
  property({ type: Boolean, attribute: 'has-icon', reflect: true })
80
79
  ], UmDrawerItem.prototype, "hasIcon", void 0);
@@ -1 +1 @@
1
- {"version":3,"file":"drawer-item.js","sourceRoot":"","sources":["../../src/navigation/drawer-item.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAsB,MAAM,KAAK,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAEnF,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEjD,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAGvD,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,eAAe;IAA1C;;QAOL;;;;WAIG;QAC8D,YAAO,GAAG,KAAK,CAAC;QAEjF;;;;WAIG;QAC+D,aAAQ,GAAG,KAAK,CAAC;QAEnF;;;;WAIG;QACuC,WAAM,GAAG,KAAK,CAAC;QAEzD;;WAEG;QACsE,mBAAc,GAAG,KAAK,CAAC;IAiDlG,CAAC;IAzCU,iBAAiB;QACxB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,YAAY,CAAC,iBAAiB,EAAE,OAAO,CAAC,CAAC;IAChD,CAAC;IAEkB,aAAa;QAC9B,OAAO,IAAI,CAAA;;;;;yBAKU,IAAI,CAAC,oBAAoB;;;;;;yBAMzB,IAAI,CAAC,qBAAqB;;KAE9C,CAAC;IACJ,CAAC;IAEO,oBAAoB;QAC1B,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,CAAC;IAC/C,CAAC;IAEO,qBAAqB;QAC3B,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,cAAc,CAAC,MAAM,GAAG,CAAC,CAAC;IACjD,CAAC;IAEQ,WAAW;QAClB,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YACxB,OAAO;QACT,CAAC;QAED,MAAM,cAAc,GAAG,IAAI,CAAC,OAAO,CAAC,mBAAmB,CAAC,CAAC;QAEzD,IAAI,cAAc,EAAE,CAAC;YACnB,cAAc,CAAC,YAAY,GAAG,KAAK,CAAC;QACtC,CAAC;IACH,CAAC;;AA7Ee,mBAAM,GAAG;IACvB,UAAU;IACV,MAAM;CACP,AAHqB,CAGpB;AAO+D;IAAhE,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;6CAAiB;AAOf;IAAjE,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;8CAAkB;AAOzC;IAAzC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;4CAAgB;AAKgB;IAAxE,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,kBAAkB,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;oDAAwB;AAG/E;IADhB,qBAAqB,CAAC,EAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;mDACN;AAG9B;IADhB,qBAAqB,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;oDACN;AArCrC,YAAY;IADxB,aAAa,CAAC,eAAe,CAAC;GAClB,YAAY,CAgFxB","sourcesContent":["import { html, HTMLTemplateResult } from 'lit';\nimport { customElement, property, queryAssignedElements } from 'lit/decorators.js';\n\nimport { styles as baseStyles } from '../shared/base.styles.js';\nimport { styles } from './drawer-item.styles.js';\n\nimport { UmButtonWrapper } from '../shared/button-wrapper.js';\n\n@customElement('u-drawer-item')\nexport class UmDrawerItem extends UmButtonWrapper {\n\n static override styles = [\n baseStyles,\n styles\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 /**\n * Whether the drawer item is active or not\n *\n * _Note:_ Readonly\n */\n @property({type: Boolean, reflect: true}) active = false;\n\n /**\n * If true, it will not attempt to close de navigation drawer on click\n */\n @property({type: Boolean, attribute: 'keep-drawer-open', reflect: true}) keepDrawerOpen = false;\n\n @queryAssignedElements({slot: 'icon', flatten: true})\n private readonly assignedIcons!: HTMLElement[];\n\n @queryAssignedElements({slot: 'badge', flatten: true})\n private readonly assignedBadges!: HTMLElement[];\n\n override connectedCallback() {\n super.connectedCallback();\n this.setAttribute('aria-labelledby', 'label');\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 <span class=\"badge\">\n <slot\n name=\"badge\"\n @slotchange=\"${this.handleBadgeSlotChange}\"></slot>\n </span>\n `;\n }\n\n private handleIconSlotChange() {\n this.hasIcon = this.assignedIcons.length > 0;\n }\n\n private handleBadgeSlotChange() {\n this.hasBadge = this.assignedBadges.length > 0;\n }\n\n override handleClick(): void {\n if (this.keepDrawerOpen) {\n return;\n }\n\n const sideNavigation = this.closest('u-side-navigation');\n\n if (sideNavigation) {\n sideNavigation.toggleDrawer = false;\n }\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-drawer-item': UmDrawerItem;\n }\n}\n"]}
1
+ {"version":3,"file":"drawer-item.js","sourceRoot":"","sources":["../../src/navigation/drawer-item.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAsB,MAAM,KAAK,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAEnF,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEjD,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAGvD,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,eAAe;IAA1C;;QAOL;;;;WAIG;QAC8D,YAAO,GAAG,KAAK,CAAC;QAEjF;;;;WAIG;QAC+D,aAAQ,GAAG,KAAK,CAAC;QAEnF;;;;WAIG;QACuC,WAAM,GAAG,KAAK,CAAC;QAEzD;;WAEG;QACsE,mBAAc,GAAG,KAAK,CAAC;IAiDlG,CAAC;aA9EiB,WAAM,GAAG;QACvB,eAAe,CAAC,MAAM;QACtB,MAAM;KACP,AAHqB,CAGpB;IAkCO,iBAAiB;QACxB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,YAAY,CAAC,iBAAiB,EAAE,OAAO,CAAC,CAAC;IAChD,CAAC;IAEkB,aAAa;QAC9B,OAAO,IAAI,CAAA;;;;;yBAKU,IAAI,CAAC,oBAAoB;;;;;;yBAMzB,IAAI,CAAC,qBAAqB;;KAE9C,CAAC;IACJ,CAAC;IAEO,oBAAoB;QAC1B,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,CAAC;IAC/C,CAAC;IAEO,qBAAqB;QAC3B,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,cAAc,CAAC,MAAM,GAAG,CAAC,CAAC;IACjD,CAAC;IAEQ,WAAW;QAClB,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YACxB,OAAO;QACT,CAAC;QAED,MAAM,cAAc,GAAG,IAAI,CAAC,OAAO,CAAC,mBAAmB,CAAC,CAAC;QAEzD,IAAI,cAAc,EAAE,CAAC;YACnB,cAAc,CAAC,YAAY,GAAG,KAAK,CAAC;QACtC,CAAC;IACH,CAAC;;AAnEgE;IAAhE,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;6CAAiB;AAOf;IAAjE,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;8CAAkB;AAOzC;IAAzC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;4CAAgB;AAKgB;IAAxE,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,kBAAkB,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;oDAAwB;AAG/E;IADhB,qBAAqB,CAAC,EAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;mDACN;AAG9B;IADhB,qBAAqB,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;oDACN;AArCrC,YAAY;IADxB,aAAa,CAAC,eAAe,CAAC;GAClB,YAAY,CAgFxB","sourcesContent":["import { html, HTMLTemplateResult } from 'lit';\nimport { customElement, property, queryAssignedElements } from 'lit/decorators.js';\n\nimport { styles } from './drawer-item.styles.js';\n\nimport { UmButtonWrapper } from '../shared/button-wrapper.js';\n\n@customElement('u-drawer-item')\nexport class UmDrawerItem extends UmButtonWrapper {\n\n static override styles = [\n UmButtonWrapper.styles,\n styles\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 /**\n * Whether the drawer item is active or not\n *\n * _Note:_ Readonly\n */\n @property({type: Boolean, reflect: true}) active = false;\n\n /**\n * If true, it will not attempt to close de navigation drawer on click\n */\n @property({type: Boolean, attribute: 'keep-drawer-open', reflect: true}) keepDrawerOpen = false;\n\n @queryAssignedElements({slot: 'icon', flatten: true})\n private readonly assignedIcons!: HTMLElement[];\n\n @queryAssignedElements({slot: 'badge', flatten: true})\n private readonly assignedBadges!: HTMLElement[];\n\n override connectedCallback() {\n super.connectedCallback();\n this.setAttribute('aria-labelledby', 'label');\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 <span class=\"badge\">\n <slot\n name=\"badge\"\n @slotchange=\"${this.handleBadgeSlotChange}\"></slot>\n </span>\n `;\n }\n\n private handleIconSlotChange() {\n this.hasIcon = this.assignedIcons.length > 0;\n }\n\n private handleBadgeSlotChange() {\n this.hasBadge = this.assignedBadges.length > 0;\n }\n\n override handleClick(): void {\n if (this.keepDrawerOpen) {\n return;\n }\n\n const sideNavigation = this.closest('u-side-navigation');\n\n if (sideNavigation) {\n sideNavigation.toggleDrawer = false;\n }\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-drawer-item': UmDrawerItem;\n }\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"drawer-item.styles.d.ts","sourceRoot":"","sources":["../../src/navigation/drawer-item.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAkIlB,CAAC"}
1
+ {"version":3,"file":"drawer-item.styles.d.ts","sourceRoot":"","sources":["../../src/navigation/drawer-item.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBA2ClB,CAAC"}
@@ -1,92 +1,5 @@
1
1
  import { css } from 'lit';
2
2
  export const styles = css `
3
- :host,
4
- * {
5
- --_focus-ring-outline-offset: var(--u-focus-ring-outline-offset, 2px);
6
- 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");
7
- box-sizing: border-box;
8
- outline: 0;
9
- }
10
-
11
- :host(.force-focus-ring) .focus-ring,
12
- .focus-ring:focus-visible {
13
- --_color-primary: var(--u-color-primary, rgb(103, 80, 164));
14
- animation: u-focus-pulse 500ms ease;
15
- animation-fill-mode: forwards;
16
- outline-offset: var(--_focus-ring-outline-offset);
17
- }
18
-
19
- @keyframes u-focus-pulse {
20
- 0% {
21
- outline: 0 solid var(--_color-primary);
22
- }
23
- 50% {
24
- outline: 6px solid var(--_color-primary);
25
- }
26
- 100% {
27
- outline: 4px solid var(--_color-primary);
28
- }
29
- }
30
- :host {
31
- --_color-primary: var(--u-color-primary, rgb(103, 80, 164));
32
- -webkit-tap-highlight-color: transparent;
33
- --u-elevation-level: 0;
34
- position: relative;
35
- display: inline-block;
36
- 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");
37
- appearance: none !important;
38
- }
39
-
40
- :host([disabled]) {
41
- --u-elevation-level: 0 !important;
42
- 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;
43
- 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;
44
- }
45
-
46
- :host([disabled]) .button {
47
- cursor: default;
48
- }
49
-
50
- * {
51
- color: inherit;
52
- }
53
-
54
- u-elevation {
55
- z-index: -1;
56
- }
57
-
58
- .button {
59
- cursor: pointer;
60
- position: absolute;
61
- inset-inline-start: 0;
62
- inset-block-start: 0;
63
- width: 100%;
64
- height: 100%;
65
- font-family: inherit;
66
- border-radius: inherit;
67
- color: inherit;
68
- border: none;
69
- margin: 0;
70
- padding: 0;
71
- text-align: center;
72
- white-space: nowrap;
73
- background: transparent;
74
- user-select: none;
75
- text-decoration: none;
76
- outline: 0;
77
- z-index: 0;
78
- }
79
-
80
- .content {
81
- display: inline-flex;
82
- align-items: center;
83
- justify-content: center;
84
- white-space: nowrap;
85
- border-radius: inherit;
86
- width: 100%;
87
- height: 100%;
88
- }
89
-
90
3
  :host {
91
4
  display: block;
92
5
  --_drawer-item-icon-size: var(--u-drawer-item-icon-size, 1.125rem);
@@ -1 +1 @@
1
- {"version":3,"file":"drawer-item.styles.js","sourceRoot":"","sources":["../../src/navigation/drawer-item.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkIzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n :host,\n * {\n --_focus-ring-outline-offset: var(--u-focus-ring-outline-offset, 2px);\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 box-sizing: border-box;\n outline: 0;\n }\n\n :host(.force-focus-ring) .focus-ring,\n .focus-ring:focus-visible {\n --_color-primary: var(--u-color-primary, rgb(103, 80, 164));\n animation: u-focus-pulse 500ms ease;\n animation-fill-mode: forwards;\n outline-offset: var(--_focus-ring-outline-offset);\n }\n\n @keyframes u-focus-pulse {\n 0% {\n outline: 0 solid var(--_color-primary);\n }\n 50% {\n outline: 6px solid var(--_color-primary);\n }\n 100% {\n outline: 4px solid var(--_color-primary);\n }\n }\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 :host {\n display: block;\n --_drawer-item-icon-size: var(--u-drawer-item-icon-size, 1.125rem);\n --_drawer-item-padding: var(--u-drawer-item-padding, 16px);\n font-family: var(--u-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 line-height: var(--u-drawer-item-line-height, var(--u-label-l-line-height, 1.25rem));\n font-size: var(--u-drawer-item-font-size, var(--u-label-l-font-size, 0.875rem));\n letter-spacing: var(--u-drawer-item-letter-spacing, var(--u-label-l-letter-spacing, 0.0071428571rem));\n font-weight: var(--u-drawer-item-font-weight, var(--u-label-l-font-weight, var(--u-font-weight-medium, 500)));\n height: var(--u-drawer-item-height, 56px);\n padding-inline: var(--_drawer-item-padding);\n margin-inline: calc(var(--_drawer-item-padding) * -1);\n border-radius: var(--u-drawer-item-shape-corner, var(--u-shape-corner-full, 9999px));\n color: var(--u-drawer-item-label-inactive-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n }\n\n :host([active]) {\n color: var(--u-drawer-item-label-active-color, var(--_color-primary));\n }\n\n :host(:not([has-icon])) .icon,\n :host(:not([has-badge])) .badge {\n display: none;\n }\n\n .icon {\n font-size: var(--_drawer-item-icon-size);\n line-height: var(--_drawer-item-icon-size);\n margin-inline-end: var(--u-drawer-item-icon-margin, 16px);\n }\n\n .badge {\n display: flex;\n justify-content: center;\n align-items: center;\n margin-inline-start: auto;\n padding-inline: var(--u-drawer-item-badge-padding, 12px 8px);\n }\n\n .content {\n justify-content: flex-start;\n }\n`;\n"]}
1
+ {"version":3,"file":"drawer-item.styles.js","sourceRoot":"","sources":["../../src/navigation/drawer-item.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2CzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n :host {\n display: block;\n --_drawer-item-icon-size: var(--u-drawer-item-icon-size, 1.125rem);\n --_drawer-item-padding: var(--u-drawer-item-padding, 16px);\n font-family: var(--u-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 line-height: var(--u-drawer-item-line-height, var(--u-label-l-line-height, 1.25rem));\n font-size: var(--u-drawer-item-font-size, var(--u-label-l-font-size, 0.875rem));\n letter-spacing: var(--u-drawer-item-letter-spacing, var(--u-label-l-letter-spacing, 0.0071428571rem));\n font-weight: var(--u-drawer-item-font-weight, var(--u-label-l-font-weight, var(--u-font-weight-medium, 500)));\n height: var(--u-drawer-item-height, 56px);\n padding-inline: var(--_drawer-item-padding);\n margin-inline: calc(var(--_drawer-item-padding) * -1);\n border-radius: var(--u-drawer-item-shape-corner, var(--u-shape-corner-full, 9999px));\n color: var(--u-drawer-item-label-inactive-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n }\n\n :host([active]) {\n color: var(--u-drawer-item-label-active-color, var(--_color-primary));\n }\n\n :host(:not([has-icon])) .icon,\n :host(:not([has-badge])) .badge {\n display: none;\n }\n\n .icon {\n font-size: var(--_drawer-item-icon-size);\n line-height: var(--_drawer-item-icon-size);\n margin-inline-end: var(--u-drawer-item-icon-margin, 16px);\n }\n\n .badge {\n display: flex;\n justify-content: center;\n align-items: center;\n margin-inline-start: auto;\n padding-inline: var(--u-drawer-item-badge-padding, 12px 8px);\n }\n\n .content {\n justify-content: flex-start;\n }\n`;\n"]}
@@ -9,14 +9,14 @@ import { customElement } from 'lit/decorators.js';
9
9
  import { styles as baseStyles } from '../shared/base.styles.js';
10
10
  import { styles } from './drawer.styles.js';
11
11
  let UmDrawer = class UmDrawer extends LitElement {
12
+ static { this.styles = [
13
+ baseStyles,
14
+ styles
15
+ ]; }
12
16
  render() {
13
17
  return html `<slot></slot>`;
14
18
  }
15
19
  };
16
- UmDrawer.styles = [
17
- baseStyles,
18
- styles
19
- ];
20
20
  UmDrawer = __decorate([
21
21
  customElement('u-drawer')
22
22
  ], UmDrawer);
@@ -1 +1 @@
1
- {"version":3,"file":"drawer.js","sourceRoot":"","sources":["../../src/navigation/drawer.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAsB,UAAU,EAAE,MAAM,KAAK,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAElD,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAGrC,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,UAAU;IAMnB,MAAM;QACvB,OAAO,IAAI,CAAA,eAAe,CAAA;IAC5B,CAAC;;AAPe,eAAM,GAAG;IACvB,UAAU;IACV,MAAM;CACP,AAHqB,CAGpB;AAJS,QAAQ;IADpB,aAAa,CAAC,UAAU,CAAC;GACb,QAAQ,CASpB","sourcesContent":["import { html, HTMLTemplateResult, LitElement } from 'lit';\nimport { customElement } from 'lit/decorators.js';\n\nimport { styles as baseStyles } from '../shared/base.styles.js';\nimport { styles } from './drawer.styles.js';\n\n@customElement('u-drawer')\nexport class UmDrawer extends LitElement {\n static override styles = [\n baseStyles,\n styles\n ];\n\n protected override render(): HTMLTemplateResult {\n return html`<slot></slot>`\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-drawer': UmDrawer;\n }\n}\n"]}
1
+ {"version":3,"file":"drawer.js","sourceRoot":"","sources":["../../src/navigation/drawer.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAsB,UAAU,EAAE,MAAM,KAAK,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAElD,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAGrC,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQ,UAAU;aACtB,WAAM,GAAG;QACvB,UAAU;QACV,MAAM;KACP,AAHqB,CAGpB;IAEiB,MAAM;QACvB,OAAO,IAAI,CAAA,eAAe,CAAA;IAC5B,CAAC;;AARU,QAAQ;IADpB,aAAa,CAAC,UAAU,CAAC;GACb,QAAQ,CASpB","sourcesContent":["import { html, HTMLTemplateResult, LitElement } from 'lit';\nimport { customElement } from 'lit/decorators.js';\n\nimport { styles as baseStyles } from '../shared/base.styles.js';\nimport { styles } from './drawer.styles.js';\n\n@customElement('u-drawer')\nexport class UmDrawer extends LitElement {\n static override styles = [\n baseStyles,\n styles\n ];\n\n protected override render(): HTMLTemplateResult {\n return html`<slot></slot>`\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'u-drawer': UmDrawer;\n }\n}\n"]}