@limetech/lime-elements 37.67.0 → 37.69.0

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 (162) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/dist/cjs/lime-elements.cjs.js +1 -1
  3. package/dist/cjs/limel-action-bar-item_2.cjs.entry.js +122 -0
  4. package/dist/cjs/limel-action-bar-item_2.cjs.entry.js.map +1 -0
  5. package/dist/cjs/{limel-action-bar_4.cjs.entry.js → limel-action-bar_2.cjs.entry.js} +2 -116
  6. package/dist/cjs/limel-action-bar_2.cjs.entry.js.map +1 -0
  7. package/dist/cjs/{limel-breadcrumbs_5.cjs.entry.js → limel-breadcrumbs_7.cjs.entry.js} +3344 -407
  8. package/dist/cjs/limel-breadcrumbs_7.cjs.entry.js.map +1 -0
  9. package/dist/cjs/limel-callout.cjs.entry.js +1 -1
  10. package/dist/cjs/limel-card.cjs.entry.js +85 -0
  11. package/dist/cjs/limel-card.cjs.entry.js.map +1 -0
  12. package/dist/cjs/limel-chart.cjs.entry.js +216 -0
  13. package/dist/cjs/limel-chart.cjs.entry.js.map +1 -0
  14. package/dist/cjs/limel-chip_2.cjs.entry.js +1 -1
  15. package/dist/cjs/limel-dynamic-label_2.cjs.entry.js +91 -0
  16. package/dist/cjs/limel-dynamic-label_2.cjs.entry.js.map +1 -0
  17. package/dist/cjs/limel-file-viewer.cjs.entry.js +1 -1
  18. package/dist/cjs/limel-file.cjs.entry.js +1 -1
  19. package/dist/cjs/limel-flatpickr-adapter.cjs.entry.js +1 -1
  20. package/dist/cjs/limel-icon.cjs.entry.js +208 -0
  21. package/dist/cjs/limel-icon.cjs.entry.js.map +1 -0
  22. package/dist/cjs/limel-linear-progress.cjs.entry.js +1 -1
  23. package/dist/cjs/{limel-icon_2.cjs.entry.js → limel-portal.cjs.entry.js} +1 -201
  24. package/dist/cjs/limel-portal.cjs.entry.js.map +1 -0
  25. package/dist/cjs/limel-prosemirror-adapter.cjs.entry.js +1 -1
  26. package/dist/cjs/limel-snackbar.cjs.entry.js +1 -1
  27. package/dist/cjs/loader.cjs.js +1 -1
  28. package/dist/cjs/{translations-6c4447f4.js → translations-9ccca4b6.js} +9 -1
  29. package/dist/cjs/translations-9ccca4b6.js.map +1 -0
  30. package/dist/collection/collection-manifest.json +2 -0
  31. package/dist/collection/components/card/card.css +202 -0
  32. package/dist/collection/components/card/card.js +282 -0
  33. package/dist/collection/components/card/card.js.map +1 -0
  34. package/dist/collection/components/chart/chart.css +758 -0
  35. package/dist/collection/components/chart/chart.js +418 -0
  36. package/dist/collection/components/chart/chart.js.map +1 -0
  37. package/dist/collection/components/chart/chart.types.js +2 -0
  38. package/dist/collection/components/chart/chart.types.js.map +1 -0
  39. package/dist/collection/style/mixins.scss +16 -0
  40. package/dist/collection/translations/da.js +1 -0
  41. package/dist/collection/translations/da.js.map +1 -1
  42. package/dist/collection/translations/de.js +1 -0
  43. package/dist/collection/translations/de.js.map +1 -1
  44. package/dist/collection/translations/en.js +1 -0
  45. package/dist/collection/translations/en.js.map +1 -1
  46. package/dist/collection/translations/fi.js +1 -0
  47. package/dist/collection/translations/fi.js.map +1 -1
  48. package/dist/collection/translations/fr.js +1 -0
  49. package/dist/collection/translations/fr.js.map +1 -1
  50. package/dist/collection/translations/nl.js +1 -0
  51. package/dist/collection/translations/nl.js.map +1 -1
  52. package/dist/collection/translations/no.js +1 -0
  53. package/dist/collection/translations/no.js.map +1 -1
  54. package/dist/collection/translations/sv.js +1 -0
  55. package/dist/collection/translations/sv.js.map +1 -1
  56. package/dist/esm/lime-elements.js +1 -1
  57. package/dist/esm/limel-action-bar-item_2.entry.js +117 -0
  58. package/dist/esm/limel-action-bar-item_2.entry.js.map +1 -0
  59. package/dist/esm/{limel-action-bar_4.entry.js → limel-action-bar_2.entry.js} +3 -115
  60. package/dist/esm/limel-action-bar_2.entry.js.map +1 -0
  61. package/dist/esm/{limel-breadcrumbs_5.entry.js → limel-breadcrumbs_7.entry.js} +3333 -398
  62. package/dist/esm/limel-breadcrumbs_7.entry.js.map +1 -0
  63. package/dist/esm/limel-callout.entry.js +1 -1
  64. package/dist/esm/limel-card.entry.js +81 -0
  65. package/dist/esm/limel-card.entry.js.map +1 -0
  66. package/dist/esm/limel-chart.entry.js +212 -0
  67. package/dist/esm/limel-chart.entry.js.map +1 -0
  68. package/dist/esm/limel-chip_2.entry.js +1 -1
  69. package/dist/esm/limel-dynamic-label_2.entry.js +86 -0
  70. package/dist/esm/limel-dynamic-label_2.entry.js.map +1 -0
  71. package/dist/esm/limel-file-viewer.entry.js +1 -1
  72. package/dist/esm/limel-file.entry.js +1 -1
  73. package/dist/esm/limel-flatpickr-adapter.entry.js +1 -1
  74. package/dist/esm/limel-icon.entry.js +204 -0
  75. package/dist/esm/limel-icon.entry.js.map +1 -0
  76. package/dist/esm/limel-linear-progress.entry.js +1 -1
  77. package/dist/esm/{limel-icon_2.entry.js → limel-portal.entry.js} +2 -201
  78. package/dist/esm/limel-portal.entry.js.map +1 -0
  79. package/dist/esm/limel-prosemirror-adapter.entry.js +1 -1
  80. package/dist/esm/limel-snackbar.entry.js +1 -1
  81. package/dist/esm/loader.js +1 -1
  82. package/dist/esm/{translations-26583a3b.js → translations-453e0db7.js} +9 -1
  83. package/dist/esm/translations-453e0db7.js.map +1 -0
  84. package/dist/lime-elements/lime-elements.esm.js +1 -1
  85. package/dist/lime-elements/lime-elements.esm.js.map +1 -1
  86. package/dist/lime-elements/{p-5d12d8d2.entry.js → p-0ee1d461.entry.js} +2 -2
  87. package/dist/lime-elements/p-18b068c9.entry.js +2 -0
  88. package/dist/lime-elements/p-18b068c9.entry.js.map +1 -0
  89. package/dist/lime-elements/{p-195df464.entry.js → p-1e99b371.entry.js} +2 -2
  90. package/dist/lime-elements/{p-4fd0ac1e.entry.js → p-2cbfe8f9.entry.js} +2 -2
  91. package/dist/lime-elements/{p-adfa2c05.entry.js → p-3fcb2b67.entry.js} +2 -2
  92. package/dist/lime-elements/{p-1a0aaf41.entry.js → p-488decb0.entry.js} +2 -2
  93. package/dist/lime-elements/p-5d08ef7d.entry.js +2 -0
  94. package/dist/lime-elements/p-5d08ef7d.entry.js.map +1 -0
  95. package/dist/lime-elements/p-7f9e0f52.entry.js +2 -0
  96. package/dist/lime-elements/p-7f9e0f52.entry.js.map +1 -0
  97. package/dist/lime-elements/p-8915fa60.js +2 -0
  98. package/dist/lime-elements/p-8915fa60.js.map +1 -0
  99. package/dist/lime-elements/p-97ae94e0.entry.js +266 -0
  100. package/dist/lime-elements/p-97ae94e0.entry.js.map +1 -0
  101. package/dist/lime-elements/{p-fbaa1b19.entry.js → p-9d2f6454.entry.js} +2 -2
  102. package/dist/lime-elements/p-9f8aa8e7.entry.js +2 -0
  103. package/dist/lime-elements/p-9f8aa8e7.entry.js.map +1 -0
  104. package/dist/lime-elements/{p-03eea223.entry.js → p-a451cece.entry.js} +2 -2
  105. package/dist/lime-elements/p-a8e24972.entry.js +2 -0
  106. package/dist/lime-elements/p-a8e24972.entry.js.map +1 -0
  107. package/dist/lime-elements/p-d696f6b8.entry.js +2 -0
  108. package/dist/lime-elements/p-d696f6b8.entry.js.map +1 -0
  109. package/dist/lime-elements/p-d93f1964.entry.js +2 -0
  110. package/dist/lime-elements/p-d93f1964.entry.js.map +1 -0
  111. package/dist/lime-elements/{p-0f484317.entry.js → p-dd031410.entry.js} +2 -2
  112. package/dist/lime-elements/style/mixins.scss +16 -0
  113. package/dist/scss/mixins.scss +16 -0
  114. package/dist/types/components/card/card.d.ts +75 -0
  115. package/dist/types/components/chart/chart.d.ts +94 -0
  116. package/dist/types/components/chart/chart.types.d.ts +25 -0
  117. package/dist/types/components.d.ts +346 -4
  118. package/dist/types/translations/da.d.ts +1 -0
  119. package/dist/types/translations/de.d.ts +1 -0
  120. package/dist/types/translations/en.d.ts +1 -0
  121. package/dist/types/translations/fi.d.ts +1 -0
  122. package/dist/types/translations/fr.d.ts +1 -0
  123. package/dist/types/translations/nl.d.ts +1 -0
  124. package/dist/types/translations/no.d.ts +1 -0
  125. package/dist/types/translations/sv.d.ts +1 -0
  126. package/package.json +1 -1
  127. package/dist/cjs/component-864afce0.js +0 -2447
  128. package/dist/cjs/component-864afce0.js.map +0 -1
  129. package/dist/cjs/limel-action-bar_4.cjs.entry.js.map +0 -1
  130. package/dist/cjs/limel-breadcrumbs_5.cjs.entry.js.map +0 -1
  131. package/dist/cjs/limel-dynamic-label_4.cjs.entry.js +0 -600
  132. package/dist/cjs/limel-dynamic-label_4.cjs.entry.js.map +0 -1
  133. package/dist/cjs/limel-icon_2.cjs.entry.js.map +0 -1
  134. package/dist/cjs/translations-6c4447f4.js.map +0 -1
  135. package/dist/esm/component-5e233629.js +0 -2439
  136. package/dist/esm/component-5e233629.js.map +0 -1
  137. package/dist/esm/limel-action-bar_4.entry.js.map +0 -1
  138. package/dist/esm/limel-breadcrumbs_5.entry.js.map +0 -1
  139. package/dist/esm/limel-dynamic-label_4.entry.js +0 -593
  140. package/dist/esm/limel-dynamic-label_4.entry.js.map +0 -1
  141. package/dist/esm/limel-icon_2.entry.js.map +0 -1
  142. package/dist/esm/translations-26583a3b.js.map +0 -1
  143. package/dist/lime-elements/p-61047574.entry.js +0 -2
  144. package/dist/lime-elements/p-61047574.entry.js.map +0 -1
  145. package/dist/lime-elements/p-b9b0853b.entry.js +0 -68
  146. package/dist/lime-elements/p-b9b0853b.entry.js.map +0 -1
  147. package/dist/lime-elements/p-bd261424.entry.js +0 -2
  148. package/dist/lime-elements/p-bd261424.entry.js.map +0 -1
  149. package/dist/lime-elements/p-d528606a.js +0 -200
  150. package/dist/lime-elements/p-d528606a.js.map +0 -1
  151. package/dist/lime-elements/p-e78fcffb.entry.js +0 -2
  152. package/dist/lime-elements/p-e78fcffb.entry.js.map +0 -1
  153. package/dist/lime-elements/p-fe15bcbb.js +0 -2
  154. package/dist/lime-elements/p-fe15bcbb.js.map +0 -1
  155. /package/dist/lime-elements/{p-5d12d8d2.entry.js.map → p-0ee1d461.entry.js.map} +0 -0
  156. /package/dist/lime-elements/{p-195df464.entry.js.map → p-1e99b371.entry.js.map} +0 -0
  157. /package/dist/lime-elements/{p-4fd0ac1e.entry.js.map → p-2cbfe8f9.entry.js.map} +0 -0
  158. /package/dist/lime-elements/{p-adfa2c05.entry.js.map → p-3fcb2b67.entry.js.map} +0 -0
  159. /package/dist/lime-elements/{p-1a0aaf41.entry.js.map → p-488decb0.entry.js.map} +0 -0
  160. /package/dist/lime-elements/{p-fbaa1b19.entry.js.map → p-9d2f6454.entry.js.map} +0 -0
  161. /package/dist/lime-elements/{p-03eea223.entry.js.map → p-a451cece.entry.js.map} +0 -0
  162. /package/dist/lime-elements/{p-0f484317.entry.js.map → p-dd031410.entry.js.map} +0 -0
@@ -1,2439 +0,0 @@
1
- import { _ as __extends, a as __assign, M as MDCFoundation, m as matches, d as closest, b as MDCComponent, c as __values } from './ponyfill-9f1f6cd2.js';
2
- import { g as getCorrectPropertyName } from './util-f1bde91c.js';
3
-
4
- /**
5
- * @license
6
- * Copyright 2018 Google Inc.
7
- *
8
- * Permission is hereby granted, free of charge, to any person obtaining a copy
9
- * of this software and associated documentation files (the "Software"), to deal
10
- * in the Software without restriction, including without limitation the rights
11
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
12
- * copies of the Software, and to permit persons to whom the Software is
13
- * furnished to do so, subject to the following conditions:
14
- *
15
- * The above copyright notice and this permission notice shall be included in
16
- * all copies or substantial portions of the Software.
17
- *
18
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
19
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
20
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
21
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
22
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
23
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
24
- * THE SOFTWARE.
25
- */
26
- var cssClasses$1 = {
27
- ANCHOR: 'mdc-menu-surface--anchor',
28
- ANIMATING_CLOSED: 'mdc-menu-surface--animating-closed',
29
- ANIMATING_OPEN: 'mdc-menu-surface--animating-open',
30
- FIXED: 'mdc-menu-surface--fixed',
31
- IS_OPEN_BELOW: 'mdc-menu-surface--is-open-below',
32
- OPEN: 'mdc-menu-surface--open',
33
- ROOT: 'mdc-menu-surface',
34
- };
35
- // tslint:disable:object-literal-sort-keys
36
- var strings$1 = {
37
- CLOSED_EVENT: 'MDCMenuSurface:closed',
38
- CLOSING_EVENT: 'MDCMenuSurface:closing',
39
- OPENED_EVENT: 'MDCMenuSurface:opened',
40
- FOCUSABLE_ELEMENTS: [
41
- 'button:not(:disabled)',
42
- '[href]:not([aria-disabled="true"])',
43
- 'input:not(:disabled)',
44
- 'select:not(:disabled)',
45
- 'textarea:not(:disabled)',
46
- '[tabindex]:not([tabindex="-1"]):not([aria-disabled="true"])',
47
- ].join(', '),
48
- };
49
- // tslint:enable:object-literal-sort-keys
50
- var numbers$1 = {
51
- /** Total duration of menu-surface open animation. */
52
- TRANSITION_OPEN_DURATION: 120,
53
- /** Total duration of menu-surface close animation. */
54
- TRANSITION_CLOSE_DURATION: 75,
55
- /**
56
- * Margin left to the edge of the viewport when menu-surface is at maximum
57
- * possible height. Also used as a viewport margin.
58
- */
59
- MARGIN_TO_EDGE: 32,
60
- /**
61
- * Ratio of anchor width to menu-surface width for switching from corner
62
- * positioning to center positioning.
63
- */
64
- ANCHOR_TO_MENU_SURFACE_WIDTH_RATIO: 0.67,
65
- /**
66
- * Amount of time to wait before restoring focus when closing the menu
67
- * surface. This is important because if a touch event triggered the menu
68
- * close, and the subsequent mouse event occurs after focus is restored, then
69
- * the restored focus would be lost.
70
- */
71
- TOUCH_EVENT_WAIT_MS: 30,
72
- };
73
- /**
74
- * Enum for bits in the {@see Corner) bitmap.
75
- */
76
- var CornerBit;
77
- (function (CornerBit) {
78
- CornerBit[CornerBit["BOTTOM"] = 1] = "BOTTOM";
79
- CornerBit[CornerBit["CENTER"] = 2] = "CENTER";
80
- CornerBit[CornerBit["RIGHT"] = 4] = "RIGHT";
81
- CornerBit[CornerBit["FLIP_RTL"] = 8] = "FLIP_RTL";
82
- })(CornerBit || (CornerBit = {}));
83
- /**
84
- * Enum for representing an element corner for positioning the menu-surface.
85
- *
86
- * The START constants map to LEFT if element directionality is left
87
- * to right and RIGHT if the directionality is right to left.
88
- * Likewise END maps to RIGHT or LEFT depending on the directionality.
89
- */
90
- var Corner;
91
- (function (Corner) {
92
- Corner[Corner["TOP_LEFT"] = 0] = "TOP_LEFT";
93
- Corner[Corner["TOP_RIGHT"] = 4] = "TOP_RIGHT";
94
- Corner[Corner["BOTTOM_LEFT"] = 1] = "BOTTOM_LEFT";
95
- Corner[Corner["BOTTOM_RIGHT"] = 5] = "BOTTOM_RIGHT";
96
- Corner[Corner["TOP_START"] = 8] = "TOP_START";
97
- Corner[Corner["TOP_END"] = 12] = "TOP_END";
98
- Corner[Corner["BOTTOM_START"] = 9] = "BOTTOM_START";
99
- Corner[Corner["BOTTOM_END"] = 13] = "BOTTOM_END";
100
- })(Corner || (Corner = {}));
101
-
102
- /**
103
- * @license
104
- * Copyright 2018 Google Inc.
105
- *
106
- * Permission is hereby granted, free of charge, to any person obtaining a copy
107
- * of this software and associated documentation files (the "Software"), to deal
108
- * in the Software without restriction, including without limitation the rights
109
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
110
- * copies of the Software, and to permit persons to whom the Software is
111
- * furnished to do so, subject to the following conditions:
112
- *
113
- * The above copyright notice and this permission notice shall be included in
114
- * all copies or substantial portions of the Software.
115
- *
116
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
117
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
118
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
119
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
120
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
121
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
122
- * THE SOFTWARE.
123
- */
124
- var _a, _b;
125
- var cssClasses = {
126
- LIST_ITEM_ACTIVATED_CLASS: 'mdc-list-item--activated',
127
- LIST_ITEM_CLASS: 'mdc-list-item',
128
- LIST_ITEM_DISABLED_CLASS: 'mdc-list-item--disabled',
129
- LIST_ITEM_SELECTED_CLASS: 'mdc-list-item--selected',
130
- LIST_ITEM_TEXT_CLASS: 'mdc-list-item__text',
131
- LIST_ITEM_PRIMARY_TEXT_CLASS: 'mdc-list-item__primary-text',
132
- ROOT: 'mdc-list',
133
- };
134
- var evolutionClassNameMap = (_a = {},
135
- _a["" + cssClasses.LIST_ITEM_ACTIVATED_CLASS] = 'mdc-list-item--activated',
136
- _a["" + cssClasses.LIST_ITEM_CLASS] = 'mdc-list-item',
137
- _a["" + cssClasses.LIST_ITEM_DISABLED_CLASS] = 'mdc-list-item--disabled',
138
- _a["" + cssClasses.LIST_ITEM_SELECTED_CLASS] = 'mdc-list-item--selected',
139
- _a["" + cssClasses.LIST_ITEM_PRIMARY_TEXT_CLASS] = 'mdc-list-item__primary-text',
140
- _a["" + cssClasses.ROOT] = 'mdc-list',
141
- _a);
142
- var deprecatedClassNameMap = (_b = {},
143
- _b["" + cssClasses.LIST_ITEM_ACTIVATED_CLASS] = 'mdc-deprecated-list-item--activated',
144
- _b["" + cssClasses.LIST_ITEM_CLASS] = 'mdc-deprecated-list-item',
145
- _b["" + cssClasses.LIST_ITEM_DISABLED_CLASS] = 'mdc-deprecated-list-item--disabled',
146
- _b["" + cssClasses.LIST_ITEM_SELECTED_CLASS] = 'mdc-deprecated-list-item--selected',
147
- _b["" + cssClasses.LIST_ITEM_TEXT_CLASS] = 'mdc-deprecated-list-item__text',
148
- _b["" + cssClasses.LIST_ITEM_PRIMARY_TEXT_CLASS] = 'mdc-deprecated-list-item__primary-text',
149
- _b["" + cssClasses.ROOT] = 'mdc-deprecated-list',
150
- _b);
151
- var strings = {
152
- ACTION_EVENT: 'MDCList:action',
153
- ARIA_CHECKED: 'aria-checked',
154
- ARIA_CHECKED_CHECKBOX_SELECTOR: '[role="checkbox"][aria-checked="true"]',
155
- ARIA_CHECKED_RADIO_SELECTOR: '[role="radio"][aria-checked="true"]',
156
- ARIA_CURRENT: 'aria-current',
157
- ARIA_DISABLED: 'aria-disabled',
158
- ARIA_ORIENTATION: 'aria-orientation',
159
- ARIA_ORIENTATION_HORIZONTAL: 'horizontal',
160
- ARIA_ROLE_CHECKBOX_SELECTOR: '[role="checkbox"]',
161
- ARIA_SELECTED: 'aria-selected',
162
- ARIA_INTERACTIVE_ROLES_SELECTOR: '[role="listbox"], [role="menu"]',
163
- ARIA_MULTI_SELECTABLE_SELECTOR: '[aria-multiselectable="true"]',
164
- CHECKBOX_RADIO_SELECTOR: 'input[type="checkbox"], input[type="radio"]',
165
- CHECKBOX_SELECTOR: 'input[type="checkbox"]',
166
- CHILD_ELEMENTS_TO_TOGGLE_TABINDEX: "\n ." + cssClasses.LIST_ITEM_CLASS + " button:not(:disabled),\n ." + cssClasses.LIST_ITEM_CLASS + " a,\n ." + deprecatedClassNameMap[cssClasses.LIST_ITEM_CLASS] + " button:not(:disabled),\n ." + deprecatedClassNameMap[cssClasses.LIST_ITEM_CLASS] + " a\n ",
167
- DEPRECATED_SELECTOR: '.mdc-deprecated-list',
168
- FOCUSABLE_CHILD_ELEMENTS: "\n ." + cssClasses.LIST_ITEM_CLASS + " button:not(:disabled),\n ." + cssClasses.LIST_ITEM_CLASS + " a,\n ." + cssClasses.LIST_ITEM_CLASS + " input[type=\"radio\"]:not(:disabled),\n ." + cssClasses.LIST_ITEM_CLASS + " input[type=\"checkbox\"]:not(:disabled),\n ." + deprecatedClassNameMap[cssClasses.LIST_ITEM_CLASS] + " button:not(:disabled),\n ." + deprecatedClassNameMap[cssClasses.LIST_ITEM_CLASS] + " a,\n ." + deprecatedClassNameMap[cssClasses.LIST_ITEM_CLASS] + " input[type=\"radio\"]:not(:disabled),\n ." + deprecatedClassNameMap[cssClasses.LIST_ITEM_CLASS] + " input[type=\"checkbox\"]:not(:disabled)\n ",
169
- RADIO_SELECTOR: 'input[type="radio"]',
170
- SELECTED_ITEM_SELECTOR: '[aria-selected="true"], [aria-current="true"]',
171
- };
172
- var numbers = {
173
- UNSET_INDEX: -1,
174
- TYPEAHEAD_BUFFER_CLEAR_TIMEOUT_MS: 300
175
- };
176
- var evolutionAttribute = 'evolution';
177
-
178
- /**
179
- * @license
180
- * Copyright 2020 Google Inc.
181
- *
182
- * Permission is hereby granted, free of charge, to any person obtaining a copy
183
- * of this software and associated documentation files (the "Software"), to deal
184
- * in the Software without restriction, including without limitation the rights
185
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
186
- * copies of the Software, and to permit persons to whom the Software is
187
- * furnished to do so, subject to the following conditions:
188
- *
189
- * The above copyright notice and this permission notice shall be included in
190
- * all copies or substantial portions of the Software.
191
- *
192
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
193
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
194
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
195
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
196
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
197
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
198
- * THE SOFTWARE.
199
- */
200
- /**
201
- * KEY provides normalized string values for keys.
202
- */
203
- var KEY = {
204
- UNKNOWN: 'Unknown',
205
- BACKSPACE: 'Backspace',
206
- ENTER: 'Enter',
207
- SPACEBAR: 'Spacebar',
208
- PAGE_UP: 'PageUp',
209
- PAGE_DOWN: 'PageDown',
210
- END: 'End',
211
- HOME: 'Home',
212
- ARROW_LEFT: 'ArrowLeft',
213
- ARROW_UP: 'ArrowUp',
214
- ARROW_RIGHT: 'ArrowRight',
215
- ARROW_DOWN: 'ArrowDown',
216
- DELETE: 'Delete',
217
- ESCAPE: 'Escape',
218
- TAB: 'Tab',
219
- };
220
- var normalizedKeys = new Set();
221
- // IE11 has no support for new Map with iterable so we need to initialize this
222
- // by hand.
223
- normalizedKeys.add(KEY.BACKSPACE);
224
- normalizedKeys.add(KEY.ENTER);
225
- normalizedKeys.add(KEY.SPACEBAR);
226
- normalizedKeys.add(KEY.PAGE_UP);
227
- normalizedKeys.add(KEY.PAGE_DOWN);
228
- normalizedKeys.add(KEY.END);
229
- normalizedKeys.add(KEY.HOME);
230
- normalizedKeys.add(KEY.ARROW_LEFT);
231
- normalizedKeys.add(KEY.ARROW_UP);
232
- normalizedKeys.add(KEY.ARROW_RIGHT);
233
- normalizedKeys.add(KEY.ARROW_DOWN);
234
- normalizedKeys.add(KEY.DELETE);
235
- normalizedKeys.add(KEY.ESCAPE);
236
- normalizedKeys.add(KEY.TAB);
237
- var KEY_CODE = {
238
- BACKSPACE: 8,
239
- ENTER: 13,
240
- SPACEBAR: 32,
241
- PAGE_UP: 33,
242
- PAGE_DOWN: 34,
243
- END: 35,
244
- HOME: 36,
245
- ARROW_LEFT: 37,
246
- ARROW_UP: 38,
247
- ARROW_RIGHT: 39,
248
- ARROW_DOWN: 40,
249
- DELETE: 46,
250
- ESCAPE: 27,
251
- TAB: 9,
252
- };
253
- var mappedKeyCodes = new Map();
254
- // IE11 has no support for new Map with iterable so we need to initialize this
255
- // by hand.
256
- mappedKeyCodes.set(KEY_CODE.BACKSPACE, KEY.BACKSPACE);
257
- mappedKeyCodes.set(KEY_CODE.ENTER, KEY.ENTER);
258
- mappedKeyCodes.set(KEY_CODE.SPACEBAR, KEY.SPACEBAR);
259
- mappedKeyCodes.set(KEY_CODE.PAGE_UP, KEY.PAGE_UP);
260
- mappedKeyCodes.set(KEY_CODE.PAGE_DOWN, KEY.PAGE_DOWN);
261
- mappedKeyCodes.set(KEY_CODE.END, KEY.END);
262
- mappedKeyCodes.set(KEY_CODE.HOME, KEY.HOME);
263
- mappedKeyCodes.set(KEY_CODE.ARROW_LEFT, KEY.ARROW_LEFT);
264
- mappedKeyCodes.set(KEY_CODE.ARROW_UP, KEY.ARROW_UP);
265
- mappedKeyCodes.set(KEY_CODE.ARROW_RIGHT, KEY.ARROW_RIGHT);
266
- mappedKeyCodes.set(KEY_CODE.ARROW_DOWN, KEY.ARROW_DOWN);
267
- mappedKeyCodes.set(KEY_CODE.DELETE, KEY.DELETE);
268
- mappedKeyCodes.set(KEY_CODE.ESCAPE, KEY.ESCAPE);
269
- mappedKeyCodes.set(KEY_CODE.TAB, KEY.TAB);
270
- var navigationKeys = new Set();
271
- // IE11 has no support for new Set with iterable so we need to initialize this
272
- // by hand.
273
- navigationKeys.add(KEY.PAGE_UP);
274
- navigationKeys.add(KEY.PAGE_DOWN);
275
- navigationKeys.add(KEY.END);
276
- navigationKeys.add(KEY.HOME);
277
- navigationKeys.add(KEY.ARROW_LEFT);
278
- navigationKeys.add(KEY.ARROW_UP);
279
- navigationKeys.add(KEY.ARROW_RIGHT);
280
- navigationKeys.add(KEY.ARROW_DOWN);
281
- /**
282
- * normalizeKey returns the normalized string for a navigational action.
283
- */
284
- function normalizeKey(evt) {
285
- var key = evt.key;
286
- // If the event already has a normalized key, return it
287
- if (normalizedKeys.has(key)) {
288
- return key;
289
- }
290
- // tslint:disable-next-line:deprecation
291
- var mappedKey = mappedKeyCodes.get(evt.keyCode);
292
- if (mappedKey) {
293
- return mappedKey;
294
- }
295
- return KEY.UNKNOWN;
296
- }
297
-
298
- /**
299
- * @license
300
- * Copyright 2020 Google Inc.
301
- *
302
- * Permission is hereby granted, free of charge, to any person obtaining a copy
303
- * of this software and associated documentation files (the "Software"), to deal
304
- * in the Software without restriction, including without limitation the rights
305
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
306
- * copies of the Software, and to permit persons to whom the Software is
307
- * furnished to do so, subject to the following conditions:
308
- *
309
- * The above copyright notice and this permission notice shall be included in
310
- * all copies or substantial portions of the Software.
311
- *
312
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
313
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
314
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
315
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
316
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
317
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
318
- * THE SOFTWARE.
319
- */
320
- var ELEMENTS_KEY_ALLOWED_IN = ['input', 'button', 'textarea', 'select'];
321
- /**
322
- * Ensures that preventDefault is only called if the containing element
323
- * doesn't consume the event, and it will cause an unintended scroll.
324
- *
325
- * @param evt keyboard event to be prevented.
326
- */
327
- var preventDefaultEvent = function (evt) {
328
- var target = evt.target;
329
- if (!target) {
330
- return;
331
- }
332
- var tagName = ("" + target.tagName).toLowerCase();
333
- if (ELEMENTS_KEY_ALLOWED_IN.indexOf(tagName) === -1) {
334
- evt.preventDefault();
335
- }
336
- };
337
-
338
- /**
339
- * @license
340
- * Copyright 2020 Google Inc.
341
- *
342
- * Permission is hereby granted, free of charge, to any person obtaining a copy
343
- * of this software and associated documentation files (the "Software"), to deal
344
- * in the Software without restriction, including without limitation the rights
345
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
346
- * copies of the Software, and to permit persons to whom the Software is
347
- * furnished to do so, subject to the following conditions:
348
- *
349
- * The above copyright notice and this permission notice shall be included in
350
- * all copies or substantial portions of the Software.
351
- *
352
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
353
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
354
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
355
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
356
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
357
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
358
- * THE SOFTWARE.
359
- */
360
- /**
361
- * Initializes a state object for typeahead. Use the same reference for calls to
362
- * typeahead functions.
363
- *
364
- * @return The current state of the typeahead process. Each state reference
365
- * represents a typeahead instance as the reference is typically mutated
366
- * in-place.
367
- */
368
- function initState() {
369
- var state = {
370
- bufferClearTimeout: 0,
371
- currentFirstChar: '',
372
- sortedIndexCursor: 0,
373
- typeaheadBuffer: '',
374
- };
375
- return state;
376
- }
377
- /**
378
- * Initializes typeahead state by indexing the current list items by primary
379
- * text into the sortedIndexByFirstChar data structure.
380
- *
381
- * @param listItemCount numer of items in the list
382
- * @param getPrimaryTextByItemIndex function that returns the primary text at a
383
- * given index
384
- *
385
- * @return Map that maps the first character of the primary text to the full
386
- * list text and it's index
387
- */
388
- function initSortedIndex(listItemCount, getPrimaryTextByItemIndex) {
389
- var sortedIndexByFirstChar = new Map();
390
- // Aggregate item text to index mapping
391
- for (var i = 0; i < listItemCount; i++) {
392
- var primaryText = getPrimaryTextByItemIndex(i).trim();
393
- if (!primaryText) {
394
- continue;
395
- }
396
- var firstChar = primaryText[0].toLowerCase();
397
- if (!sortedIndexByFirstChar.has(firstChar)) {
398
- sortedIndexByFirstChar.set(firstChar, []);
399
- }
400
- sortedIndexByFirstChar.get(firstChar).push({ text: primaryText.toLowerCase(), index: i });
401
- }
402
- // Sort the mapping
403
- // TODO(b/157162694): Investigate replacing forEach with Map.values()
404
- sortedIndexByFirstChar.forEach(function (values) {
405
- values.sort(function (first, second) {
406
- return first.index - second.index;
407
- });
408
- });
409
- return sortedIndexByFirstChar;
410
- }
411
- /**
412
- * Given the next desired character from the user, it attempts to find the next
413
- * list option matching the buffer. Wraps around if at the end of options.
414
- *
415
- * @param opts Options and accessors
416
- * - nextChar - the next character to match against items
417
- * - sortedIndexByFirstChar - output of `initSortedIndex(...)`
418
- * - focusedItemIndex - the index of the currently focused item
419
- * - focusItemAtIndex - function that focuses a list item at given index
420
- * - skipFocus - whether or not to focus the matched item
421
- * - isItemAtIndexDisabled - function that determines whether an item at a
422
- * given index is disabled
423
- * @param state The typeahead state instance. See `initState`.
424
- *
425
- * @return The index of the matched item, or -1 if no match.
426
- */
427
- function matchItem(opts, state) {
428
- var nextChar = opts.nextChar, focusItemAtIndex = opts.focusItemAtIndex, sortedIndexByFirstChar = opts.sortedIndexByFirstChar, focusedItemIndex = opts.focusedItemIndex, skipFocus = opts.skipFocus, isItemAtIndexDisabled = opts.isItemAtIndexDisabled;
429
- clearTimeout(state.bufferClearTimeout);
430
- state.bufferClearTimeout = setTimeout(function () {
431
- clearBuffer(state);
432
- }, numbers.TYPEAHEAD_BUFFER_CLEAR_TIMEOUT_MS);
433
- state.typeaheadBuffer = state.typeaheadBuffer + nextChar;
434
- var index;
435
- if (state.typeaheadBuffer.length === 1) {
436
- index = matchFirstChar(sortedIndexByFirstChar, focusedItemIndex, isItemAtIndexDisabled, state);
437
- }
438
- else {
439
- index = matchAllChars(sortedIndexByFirstChar, isItemAtIndexDisabled, state);
440
- }
441
- if (index !== -1 && !skipFocus) {
442
- focusItemAtIndex(index);
443
- }
444
- return index;
445
- }
446
- /**
447
- * Matches the user's single input character in the buffer to the
448
- * next option that begins with such character. Wraps around if at
449
- * end of options. Returns -1 if no match is found.
450
- */
451
- function matchFirstChar(sortedIndexByFirstChar, focusedItemIndex, isItemAtIndexDisabled, state) {
452
- var firstChar = state.typeaheadBuffer[0];
453
- var itemsMatchingFirstChar = sortedIndexByFirstChar.get(firstChar);
454
- if (!itemsMatchingFirstChar) {
455
- return -1;
456
- }
457
- // Has the same firstChar been recently matched?
458
- // Also, did starting index remain the same between key presses?
459
- // If both hold true, simply increment index.
460
- if (firstChar === state.currentFirstChar &&
461
- itemsMatchingFirstChar[state.sortedIndexCursor].index ===
462
- focusedItemIndex) {
463
- state.sortedIndexCursor =
464
- (state.sortedIndexCursor + 1) % itemsMatchingFirstChar.length;
465
- var newIndex = itemsMatchingFirstChar[state.sortedIndexCursor].index;
466
- if (!isItemAtIndexDisabled(newIndex)) {
467
- return newIndex;
468
- }
469
- }
470
- // If we're here, it means one of the following happened:
471
- // - either firstChar or startingIndex has changed, invalidating the
472
- // cursor.
473
- // - The next item of typeahead is disabled, so we have to look further.
474
- state.currentFirstChar = firstChar;
475
- var newCursorPosition = -1;
476
- var cursorPosition;
477
- // Find the first non-disabled item as a fallback.
478
- for (cursorPosition = 0; cursorPosition < itemsMatchingFirstChar.length; cursorPosition++) {
479
- if (!isItemAtIndexDisabled(itemsMatchingFirstChar[cursorPosition].index)) {
480
- newCursorPosition = cursorPosition;
481
- break;
482
- }
483
- }
484
- // Advance cursor to first item matching the firstChar that is positioned
485
- // after starting item. Cursor is unchanged from fallback if there's no
486
- // such item.
487
- for (; cursorPosition < itemsMatchingFirstChar.length; cursorPosition++) {
488
- if (itemsMatchingFirstChar[cursorPosition].index > focusedItemIndex &&
489
- !isItemAtIndexDisabled(itemsMatchingFirstChar[cursorPosition].index)) {
490
- newCursorPosition = cursorPosition;
491
- break;
492
- }
493
- }
494
- if (newCursorPosition !== -1) {
495
- state.sortedIndexCursor = newCursorPosition;
496
- return itemsMatchingFirstChar[state.sortedIndexCursor].index;
497
- }
498
- return -1;
499
- }
500
- /**
501
- * Attempts to find the next item that matches all of the typeahead buffer.
502
- * Wraps around if at end of options. Returns -1 if no match is found.
503
- */
504
- function matchAllChars(sortedIndexByFirstChar, isItemAtIndexDisabled, state) {
505
- var firstChar = state.typeaheadBuffer[0];
506
- var itemsMatchingFirstChar = sortedIndexByFirstChar.get(firstChar);
507
- if (!itemsMatchingFirstChar) {
508
- return -1;
509
- }
510
- // Do nothing if text already matches
511
- var startingItem = itemsMatchingFirstChar[state.sortedIndexCursor];
512
- if (startingItem.text.lastIndexOf(state.typeaheadBuffer, 0) === 0 &&
513
- !isItemAtIndexDisabled(startingItem.index)) {
514
- return startingItem.index;
515
- }
516
- // Find next item that matches completely; if no match, we'll eventually
517
- // loop around to same position
518
- var cursorPosition = (state.sortedIndexCursor + 1) % itemsMatchingFirstChar.length;
519
- var nextCursorPosition = -1;
520
- while (cursorPosition !== state.sortedIndexCursor) {
521
- var currentItem = itemsMatchingFirstChar[cursorPosition];
522
- var matches = currentItem.text.lastIndexOf(state.typeaheadBuffer, 0) === 0;
523
- var isEnabled = !isItemAtIndexDisabled(currentItem.index);
524
- if (matches && isEnabled) {
525
- nextCursorPosition = cursorPosition;
526
- break;
527
- }
528
- cursorPosition = (cursorPosition + 1) % itemsMatchingFirstChar.length;
529
- }
530
- if (nextCursorPosition !== -1) {
531
- state.sortedIndexCursor = nextCursorPosition;
532
- return itemsMatchingFirstChar[state.sortedIndexCursor].index;
533
- }
534
- return -1;
535
- }
536
- /**
537
- * Whether or not the given typeahead instaance state is currently typing.
538
- *
539
- * @param state The typeahead state instance. See `initState`.
540
- */
541
- function isTypingInProgress(state) {
542
- return state.typeaheadBuffer.length > 0;
543
- }
544
- /**
545
- * Clears the typeahaed buffer so that it resets item matching to the first
546
- * character.
547
- *
548
- * @param state The typeahead state instance. See `initState`.
549
- */
550
- function clearBuffer(state) {
551
- state.typeaheadBuffer = '';
552
- }
553
- /**
554
- * Given a keydown event, it calculates whether or not to automatically focus a
555
- * list item depending on what was typed mimicing the typeahead functionality of
556
- * a standard <select> element that is open.
557
- *
558
- * @param opts Options and accessors
559
- * - event - the KeyboardEvent to handle and parse
560
- * - sortedIndexByFirstChar - output of `initSortedIndex(...)`
561
- * - focusedItemIndex - the index of the currently focused item
562
- * - focusItemAtIndex - function that focuses a list item at given index
563
- * - isItemAtFocusedIndexDisabled - whether or not the currently focused item
564
- * is disabled
565
- * - isTargetListItem - whether or not the event target is a list item
566
- * @param state The typeahead state instance. See `initState`.
567
- *
568
- * @returns index of the item matched by the keydown. -1 if not matched.
569
- */
570
- function handleKeydown(opts, state) {
571
- var event = opts.event, isTargetListItem = opts.isTargetListItem, focusedItemIndex = opts.focusedItemIndex, focusItemAtIndex = opts.focusItemAtIndex, sortedIndexByFirstChar = opts.sortedIndexByFirstChar, isItemAtIndexDisabled = opts.isItemAtIndexDisabled;
572
- var isArrowLeft = normalizeKey(event) === 'ArrowLeft';
573
- var isArrowUp = normalizeKey(event) === 'ArrowUp';
574
- var isArrowRight = normalizeKey(event) === 'ArrowRight';
575
- var isArrowDown = normalizeKey(event) === 'ArrowDown';
576
- var isHome = normalizeKey(event) === 'Home';
577
- var isEnd = normalizeKey(event) === 'End';
578
- var isEnter = normalizeKey(event) === 'Enter';
579
- var isSpace = normalizeKey(event) === 'Spacebar';
580
- if (event.ctrlKey || event.metaKey || isArrowLeft || isArrowUp ||
581
- isArrowRight || isArrowDown || isHome || isEnd || isEnter) {
582
- return -1;
583
- }
584
- var isCharacterKey = !isSpace && event.key.length === 1;
585
- if (isCharacterKey) {
586
- preventDefaultEvent(event);
587
- var matchItemOpts = {
588
- focusItemAtIndex: focusItemAtIndex,
589
- focusedItemIndex: focusedItemIndex,
590
- nextChar: event.key.toLowerCase(),
591
- sortedIndexByFirstChar: sortedIndexByFirstChar,
592
- skipFocus: false,
593
- isItemAtIndexDisabled: isItemAtIndexDisabled,
594
- };
595
- return matchItem(matchItemOpts, state);
596
- }
597
- if (!isSpace) {
598
- return -1;
599
- }
600
- if (isTargetListItem) {
601
- preventDefaultEvent(event);
602
- }
603
- var typeaheadOnListItem = isTargetListItem && isTypingInProgress(state);
604
- if (typeaheadOnListItem) {
605
- var matchItemOpts = {
606
- focusItemAtIndex: focusItemAtIndex,
607
- focusedItemIndex: focusedItemIndex,
608
- nextChar: ' ',
609
- sortedIndexByFirstChar: sortedIndexByFirstChar,
610
- skipFocus: false,
611
- isItemAtIndexDisabled: isItemAtIndexDisabled,
612
- };
613
- // space participates in typeahead matching if in rapid typing mode
614
- return matchItem(matchItemOpts, state);
615
- }
616
- return -1;
617
- }
618
-
619
- /**
620
- * @license
621
- * Copyright 2018 Google Inc.
622
- *
623
- * Permission is hereby granted, free of charge, to any person obtaining a copy
624
- * of this software and associated documentation files (the "Software"), to deal
625
- * in the Software without restriction, including without limitation the rights
626
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
627
- * copies of the Software, and to permit persons to whom the Software is
628
- * furnished to do so, subject to the following conditions:
629
- *
630
- * The above copyright notice and this permission notice shall be included in
631
- * all copies or substantial portions of the Software.
632
- *
633
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
634
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
635
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
636
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
637
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
638
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
639
- * THE SOFTWARE.
640
- */
641
- function isNumberArray(selectedIndex) {
642
- return selectedIndex instanceof Array;
643
- }
644
- var MDCListFoundation = /** @class */ (function (_super) {
645
- __extends(MDCListFoundation, _super);
646
- function MDCListFoundation(adapter) {
647
- var _this = _super.call(this, __assign(__assign({}, MDCListFoundation.defaultAdapter), adapter)) || this;
648
- _this.wrapFocus = false;
649
- _this.isVertical = true;
650
- _this.isSingleSelectionList = false;
651
- _this.selectedIndex = numbers.UNSET_INDEX;
652
- _this.focusedItemIndex = numbers.UNSET_INDEX;
653
- _this.useActivatedClass = false;
654
- _this.useSelectedAttr = false;
655
- _this.ariaCurrentAttrValue = null;
656
- _this.isCheckboxList = false;
657
- _this.isRadioList = false;
658
- _this.hasTypeahead = false;
659
- // Transiently holds current typeahead prefix from user.
660
- _this.typeaheadState = initState();
661
- _this.sortedIndexByFirstChar = new Map();
662
- return _this;
663
- }
664
- Object.defineProperty(MDCListFoundation, "strings", {
665
- get: function () {
666
- return strings;
667
- },
668
- enumerable: false,
669
- configurable: true
670
- });
671
- Object.defineProperty(MDCListFoundation, "cssClasses", {
672
- get: function () {
673
- return cssClasses;
674
- },
675
- enumerable: false,
676
- configurable: true
677
- });
678
- Object.defineProperty(MDCListFoundation, "numbers", {
679
- get: function () {
680
- return numbers;
681
- },
682
- enumerable: false,
683
- configurable: true
684
- });
685
- Object.defineProperty(MDCListFoundation, "defaultAdapter", {
686
- get: function () {
687
- return {
688
- addClassForElementIndex: function () { return undefined; },
689
- focusItemAtIndex: function () { return undefined; },
690
- getAttributeForElementIndex: function () { return null; },
691
- getFocusedElementIndex: function () { return 0; },
692
- getListItemCount: function () { return 0; },
693
- hasCheckboxAtIndex: function () { return false; },
694
- hasRadioAtIndex: function () { return false; },
695
- isCheckboxCheckedAtIndex: function () { return false; },
696
- isFocusInsideList: function () { return false; },
697
- isRootFocused: function () { return false; },
698
- listItemAtIndexHasClass: function () { return false; },
699
- notifyAction: function () { return undefined; },
700
- removeClassForElementIndex: function () { return undefined; },
701
- setAttributeForElementIndex: function () { return undefined; },
702
- setCheckedCheckboxOrRadioAtIndex: function () { return undefined; },
703
- setTabIndexForListItemChildren: function () { return undefined; },
704
- getPrimaryTextAtIndex: function () { return ''; },
705
- };
706
- },
707
- enumerable: false,
708
- configurable: true
709
- });
710
- MDCListFoundation.prototype.layout = function () {
711
- if (this.adapter.getListItemCount() === 0) {
712
- return;
713
- }
714
- // TODO(b/172274142): consider all items when determining the list's type.
715
- if (this.adapter.hasCheckboxAtIndex(0)) {
716
- this.isCheckboxList = true;
717
- }
718
- else if (this.adapter.hasRadioAtIndex(0)) {
719
- this.isRadioList = true;
720
- }
721
- else {
722
- this.maybeInitializeSingleSelection();
723
- }
724
- if (this.hasTypeahead) {
725
- this.sortedIndexByFirstChar = this.typeaheadInitSortedIndex();
726
- }
727
- };
728
- /** Returns the index of the item that was last focused. */
729
- MDCListFoundation.prototype.getFocusedItemIndex = function () {
730
- return this.focusedItemIndex;
731
- };
732
- /** Toggles focus wrapping with keyboard navigation. */
733
- MDCListFoundation.prototype.setWrapFocus = function (value) {
734
- this.wrapFocus = value;
735
- };
736
- /**
737
- * Toggles orientation direction for keyboard navigation (true for vertical,
738
- * false for horizontal).
739
- */
740
- MDCListFoundation.prototype.setVerticalOrientation = function (value) {
741
- this.isVertical = value;
742
- };
743
- /** Toggles single-selection behavior. */
744
- MDCListFoundation.prototype.setSingleSelection = function (value) {
745
- this.isSingleSelectionList = value;
746
- if (value) {
747
- this.maybeInitializeSingleSelection();
748
- this.selectedIndex = this.getSelectedIndexFromDOM();
749
- }
750
- };
751
- /**
752
- * Automatically determines whether the list is single selection list. If so,
753
- * initializes the internal state to match the selected item.
754
- */
755
- MDCListFoundation.prototype.maybeInitializeSingleSelection = function () {
756
- var selectedItemIndex = this.getSelectedIndexFromDOM();
757
- if (selectedItemIndex === numbers.UNSET_INDEX)
758
- return;
759
- var hasActivatedClass = this.adapter.listItemAtIndexHasClass(selectedItemIndex, cssClasses.LIST_ITEM_ACTIVATED_CLASS);
760
- if (hasActivatedClass) {
761
- this.setUseActivatedClass(true);
762
- }
763
- this.isSingleSelectionList = true;
764
- this.selectedIndex = selectedItemIndex;
765
- };
766
- /** @return Index of the first selected item based on the DOM state. */
767
- MDCListFoundation.prototype.getSelectedIndexFromDOM = function () {
768
- var selectedIndex = numbers.UNSET_INDEX;
769
- var listItemsCount = this.adapter.getListItemCount();
770
- for (var i = 0; i < listItemsCount; i++) {
771
- var hasSelectedClass = this.adapter.listItemAtIndexHasClass(i, cssClasses.LIST_ITEM_SELECTED_CLASS);
772
- var hasActivatedClass = this.adapter.listItemAtIndexHasClass(i, cssClasses.LIST_ITEM_ACTIVATED_CLASS);
773
- if (!(hasSelectedClass || hasActivatedClass)) {
774
- continue;
775
- }
776
- selectedIndex = i;
777
- break;
778
- }
779
- return selectedIndex;
780
- };
781
- /**
782
- * Sets whether typeahead is enabled on the list.
783
- * @param hasTypeahead Whether typeahead is enabled.
784
- */
785
- MDCListFoundation.prototype.setHasTypeahead = function (hasTypeahead) {
786
- this.hasTypeahead = hasTypeahead;
787
- if (hasTypeahead) {
788
- this.sortedIndexByFirstChar = this.typeaheadInitSortedIndex();
789
- }
790
- };
791
- /**
792
- * @return Whether typeahead is currently matching a user-specified prefix.
793
- */
794
- MDCListFoundation.prototype.isTypeaheadInProgress = function () {
795
- return this.hasTypeahead &&
796
- isTypingInProgress(this.typeaheadState);
797
- };
798
- /** Toggle use of the "activated" CSS class. */
799
- MDCListFoundation.prototype.setUseActivatedClass = function (useActivated) {
800
- this.useActivatedClass = useActivated;
801
- };
802
- /**
803
- * Toggles use of the selected attribute (true for aria-selected, false for
804
- * aria-checked).
805
- */
806
- MDCListFoundation.prototype.setUseSelectedAttribute = function (useSelected) {
807
- this.useSelectedAttr = useSelected;
808
- };
809
- MDCListFoundation.prototype.getSelectedIndex = function () {
810
- return this.selectedIndex;
811
- };
812
- MDCListFoundation.prototype.setSelectedIndex = function (index, _a) {
813
- var _b = _a === void 0 ? {} : _a, forceUpdate = _b.forceUpdate;
814
- if (!this.isIndexValid(index)) {
815
- return;
816
- }
817
- if (this.isCheckboxList) {
818
- this.setCheckboxAtIndex(index);
819
- }
820
- else if (this.isRadioList) {
821
- this.setRadioAtIndex(index);
822
- }
823
- else {
824
- this.setSingleSelectionAtIndex(index, { forceUpdate: forceUpdate });
825
- }
826
- };
827
- /**
828
- * Focus in handler for the list items.
829
- */
830
- MDCListFoundation.prototype.handleFocusIn = function (listItemIndex) {
831
- if (listItemIndex >= 0) {
832
- this.focusedItemIndex = listItemIndex;
833
- this.adapter.setAttributeForElementIndex(listItemIndex, 'tabindex', '0');
834
- this.adapter.setTabIndexForListItemChildren(listItemIndex, '0');
835
- }
836
- };
837
- /**
838
- * Focus out handler for the list items.
839
- */
840
- MDCListFoundation.prototype.handleFocusOut = function (listItemIndex) {
841
- var _this = this;
842
- if (listItemIndex >= 0) {
843
- this.adapter.setAttributeForElementIndex(listItemIndex, 'tabindex', '-1');
844
- this.adapter.setTabIndexForListItemChildren(listItemIndex, '-1');
845
- }
846
- /**
847
- * Between Focusout & Focusin some browsers do not have focus on any
848
- * element. Setting a delay to wait till the focus is moved to next element.
849
- */
850
- setTimeout(function () {
851
- if (!_this.adapter.isFocusInsideList()) {
852
- _this.setTabindexToFirstSelectedOrFocusedItem();
853
- }
854
- }, 0);
855
- };
856
- /**
857
- * Key handler for the list.
858
- */
859
- MDCListFoundation.prototype.handleKeydown = function (event, isRootListItem, listItemIndex) {
860
- var _this = this;
861
- var isArrowLeft = normalizeKey(event) === 'ArrowLeft';
862
- var isArrowUp = normalizeKey(event) === 'ArrowUp';
863
- var isArrowRight = normalizeKey(event) === 'ArrowRight';
864
- var isArrowDown = normalizeKey(event) === 'ArrowDown';
865
- var isHome = normalizeKey(event) === 'Home';
866
- var isEnd = normalizeKey(event) === 'End';
867
- var isEnter = normalizeKey(event) === 'Enter';
868
- var isSpace = normalizeKey(event) === 'Spacebar';
869
- // Have to check both upper and lower case, because having caps lock on
870
- // affects the value.
871
- var isLetterA = event.key === 'A' || event.key === 'a';
872
- if (this.adapter.isRootFocused()) {
873
- if (isArrowUp || isEnd) {
874
- event.preventDefault();
875
- this.focusLastElement();
876
- }
877
- else if (isArrowDown || isHome) {
878
- event.preventDefault();
879
- this.focusFirstElement();
880
- }
881
- if (this.hasTypeahead) {
882
- var handleKeydownOpts = {
883
- event: event,
884
- focusItemAtIndex: function (index) {
885
- _this.focusItemAtIndex(index);
886
- },
887
- focusedItemIndex: -1,
888
- isTargetListItem: isRootListItem,
889
- sortedIndexByFirstChar: this.sortedIndexByFirstChar,
890
- isItemAtIndexDisabled: function (index) {
891
- return _this.adapter.listItemAtIndexHasClass(index, cssClasses.LIST_ITEM_DISABLED_CLASS);
892
- },
893
- };
894
- handleKeydown(handleKeydownOpts, this.typeaheadState);
895
- }
896
- return;
897
- }
898
- var currentIndex = this.adapter.getFocusedElementIndex();
899
- if (currentIndex === -1) {
900
- currentIndex = listItemIndex;
901
- if (currentIndex < 0) {
902
- // If this event doesn't have a mdc-list-item ancestor from the
903
- // current list (not from a sublist), return early.
904
- return;
905
- }
906
- }
907
- if ((this.isVertical && isArrowDown) ||
908
- (!this.isVertical && isArrowRight)) {
909
- preventDefaultEvent(event);
910
- this.focusNextElement(currentIndex);
911
- }
912
- else if ((this.isVertical && isArrowUp) || (!this.isVertical && isArrowLeft)) {
913
- preventDefaultEvent(event);
914
- this.focusPrevElement(currentIndex);
915
- }
916
- else if (isHome) {
917
- preventDefaultEvent(event);
918
- this.focusFirstElement();
919
- }
920
- else if (isEnd) {
921
- preventDefaultEvent(event);
922
- this.focusLastElement();
923
- }
924
- else if (isLetterA && event.ctrlKey && this.isCheckboxList) {
925
- event.preventDefault();
926
- this.toggleAll(this.selectedIndex === numbers.UNSET_INDEX ?
927
- [] :
928
- this.selectedIndex);
929
- }
930
- else if (isEnter || isSpace) {
931
- if (isRootListItem) {
932
- // Return early if enter key is pressed on anchor element which triggers
933
- // synthetic MouseEvent event.
934
- var target = event.target;
935
- if (target && target.tagName === 'A' && isEnter) {
936
- return;
937
- }
938
- preventDefaultEvent(event);
939
- if (this.adapter.listItemAtIndexHasClass(currentIndex, cssClasses.LIST_ITEM_DISABLED_CLASS)) {
940
- return;
941
- }
942
- if (!this.isTypeaheadInProgress()) {
943
- if (this.isSelectableList()) {
944
- this.setSelectedIndexOnAction(currentIndex);
945
- }
946
- this.adapter.notifyAction(currentIndex);
947
- }
948
- }
949
- }
950
- if (this.hasTypeahead) {
951
- var handleKeydownOpts = {
952
- event: event,
953
- focusItemAtIndex: function (index) {
954
- _this.focusItemAtIndex(index);
955
- },
956
- focusedItemIndex: this.focusedItemIndex,
957
- isTargetListItem: isRootListItem,
958
- sortedIndexByFirstChar: this.sortedIndexByFirstChar,
959
- isItemAtIndexDisabled: function (index) { return _this.adapter.listItemAtIndexHasClass(index, cssClasses.LIST_ITEM_DISABLED_CLASS); },
960
- };
961
- handleKeydown(handleKeydownOpts, this.typeaheadState);
962
- }
963
- };
964
- /**
965
- * Click handler for the list.
966
- */
967
- MDCListFoundation.prototype.handleClick = function (index, toggleCheckbox) {
968
- if (index === numbers.UNSET_INDEX) {
969
- return;
970
- }
971
- if (this.adapter.listItemAtIndexHasClass(index, cssClasses.LIST_ITEM_DISABLED_CLASS)) {
972
- return;
973
- }
974
- if (this.isSelectableList()) {
975
- this.setSelectedIndexOnAction(index, toggleCheckbox);
976
- }
977
- this.adapter.notifyAction(index);
978
- };
979
- /**
980
- * Focuses the next element on the list.
981
- */
982
- MDCListFoundation.prototype.focusNextElement = function (index) {
983
- var count = this.adapter.getListItemCount();
984
- var nextIndex = index + 1;
985
- if (nextIndex >= count) {
986
- if (this.wrapFocus) {
987
- nextIndex = 0;
988
- }
989
- else {
990
- // Return early because last item is already focused.
991
- return index;
992
- }
993
- }
994
- this.focusItemAtIndex(nextIndex);
995
- return nextIndex;
996
- };
997
- /**
998
- * Focuses the previous element on the list.
999
- */
1000
- MDCListFoundation.prototype.focusPrevElement = function (index) {
1001
- var prevIndex = index - 1;
1002
- if (prevIndex < 0) {
1003
- if (this.wrapFocus) {
1004
- prevIndex = this.adapter.getListItemCount() - 1;
1005
- }
1006
- else {
1007
- // Return early because first item is already focused.
1008
- return index;
1009
- }
1010
- }
1011
- this.focusItemAtIndex(prevIndex);
1012
- return prevIndex;
1013
- };
1014
- MDCListFoundation.prototype.focusFirstElement = function () {
1015
- this.focusItemAtIndex(0);
1016
- return 0;
1017
- };
1018
- MDCListFoundation.prototype.focusLastElement = function () {
1019
- var lastIndex = this.adapter.getListItemCount() - 1;
1020
- this.focusItemAtIndex(lastIndex);
1021
- return lastIndex;
1022
- };
1023
- MDCListFoundation.prototype.focusInitialElement = function () {
1024
- var initialIndex = this.getFirstSelectedOrFocusedItemIndex();
1025
- this.focusItemAtIndex(initialIndex);
1026
- return initialIndex;
1027
- };
1028
- /**
1029
- * @param itemIndex Index of the list item
1030
- * @param isEnabled Sets the list item to enabled or disabled.
1031
- */
1032
- MDCListFoundation.prototype.setEnabled = function (itemIndex, isEnabled) {
1033
- if (!this.isIndexValid(itemIndex)) {
1034
- return;
1035
- }
1036
- if (isEnabled) {
1037
- this.adapter.removeClassForElementIndex(itemIndex, cssClasses.LIST_ITEM_DISABLED_CLASS);
1038
- this.adapter.setAttributeForElementIndex(itemIndex, strings.ARIA_DISABLED, 'false');
1039
- }
1040
- else {
1041
- this.adapter.addClassForElementIndex(itemIndex, cssClasses.LIST_ITEM_DISABLED_CLASS);
1042
- this.adapter.setAttributeForElementIndex(itemIndex, strings.ARIA_DISABLED, 'true');
1043
- }
1044
- };
1045
- MDCListFoundation.prototype.setSingleSelectionAtIndex = function (index, _a) {
1046
- var _b = _a === void 0 ? {} : _a, forceUpdate = _b.forceUpdate;
1047
- if (this.selectedIndex === index && !forceUpdate) {
1048
- return;
1049
- }
1050
- var selectedClassName = cssClasses.LIST_ITEM_SELECTED_CLASS;
1051
- if (this.useActivatedClass) {
1052
- selectedClassName = cssClasses.LIST_ITEM_ACTIVATED_CLASS;
1053
- }
1054
- if (this.selectedIndex !== numbers.UNSET_INDEX) {
1055
- this.adapter.removeClassForElementIndex(this.selectedIndex, selectedClassName);
1056
- }
1057
- this.setAriaForSingleSelectionAtIndex(index);
1058
- this.setTabindexAtIndex(index);
1059
- if (index !== numbers.UNSET_INDEX) {
1060
- this.adapter.addClassForElementIndex(index, selectedClassName);
1061
- }
1062
- this.selectedIndex = index;
1063
- };
1064
- /**
1065
- * Sets aria attribute for single selection at given index.
1066
- */
1067
- MDCListFoundation.prototype.setAriaForSingleSelectionAtIndex = function (index) {
1068
- // Detect the presence of aria-current and get the value only during list
1069
- // initialization when it is in unset state.
1070
- if (this.selectedIndex === numbers.UNSET_INDEX) {
1071
- this.ariaCurrentAttrValue =
1072
- this.adapter.getAttributeForElementIndex(index, strings.ARIA_CURRENT);
1073
- }
1074
- var isAriaCurrent = this.ariaCurrentAttrValue !== null;
1075
- var ariaAttribute = isAriaCurrent ? strings.ARIA_CURRENT : strings.ARIA_SELECTED;
1076
- if (this.selectedIndex !== numbers.UNSET_INDEX) {
1077
- this.adapter.setAttributeForElementIndex(this.selectedIndex, ariaAttribute, 'false');
1078
- }
1079
- if (index !== numbers.UNSET_INDEX) {
1080
- var ariaAttributeValue = isAriaCurrent ? this.ariaCurrentAttrValue : 'true';
1081
- this.adapter.setAttributeForElementIndex(index, ariaAttribute, ariaAttributeValue);
1082
- }
1083
- };
1084
- /**
1085
- * Returns the attribute to use for indicating selection status.
1086
- */
1087
- MDCListFoundation.prototype.getSelectionAttribute = function () {
1088
- return this.useSelectedAttr ? strings.ARIA_SELECTED : strings.ARIA_CHECKED;
1089
- };
1090
- /**
1091
- * Toggles radio at give index. Radio doesn't change the checked state if it
1092
- * is already checked.
1093
- */
1094
- MDCListFoundation.prototype.setRadioAtIndex = function (index) {
1095
- var selectionAttribute = this.getSelectionAttribute();
1096
- this.adapter.setCheckedCheckboxOrRadioAtIndex(index, true);
1097
- if (this.selectedIndex !== numbers.UNSET_INDEX) {
1098
- this.adapter.setAttributeForElementIndex(this.selectedIndex, selectionAttribute, 'false');
1099
- }
1100
- this.adapter.setAttributeForElementIndex(index, selectionAttribute, 'true');
1101
- this.selectedIndex = index;
1102
- };
1103
- MDCListFoundation.prototype.setCheckboxAtIndex = function (index) {
1104
- var selectionAttribute = this.getSelectionAttribute();
1105
- for (var i = 0; i < this.adapter.getListItemCount(); i++) {
1106
- var isChecked = false;
1107
- if (index.indexOf(i) >= 0) {
1108
- isChecked = true;
1109
- }
1110
- this.adapter.setCheckedCheckboxOrRadioAtIndex(i, isChecked);
1111
- this.adapter.setAttributeForElementIndex(i, selectionAttribute, isChecked ? 'true' : 'false');
1112
- }
1113
- this.selectedIndex = index;
1114
- };
1115
- MDCListFoundation.prototype.setTabindexAtIndex = function (index) {
1116
- if (this.focusedItemIndex === numbers.UNSET_INDEX && index !== 0) {
1117
- // If some list item was selected set first list item's tabindex to -1.
1118
- // Generally, tabindex is set to 0 on first list item of list that has no
1119
- // preselected items.
1120
- this.adapter.setAttributeForElementIndex(0, 'tabindex', '-1');
1121
- }
1122
- else if (this.focusedItemIndex >= 0 && this.focusedItemIndex !== index) {
1123
- this.adapter.setAttributeForElementIndex(this.focusedItemIndex, 'tabindex', '-1');
1124
- }
1125
- // Set the previous selection's tabindex to -1. We need this because
1126
- // in selection menus that are not visible, programmatically setting an
1127
- // option will not change focus but will change where tabindex should be 0.
1128
- if (!(this.selectedIndex instanceof Array) &&
1129
- this.selectedIndex !== index) {
1130
- this.adapter.setAttributeForElementIndex(this.selectedIndex, 'tabindex', '-1');
1131
- }
1132
- if (index !== numbers.UNSET_INDEX) {
1133
- this.adapter.setAttributeForElementIndex(index, 'tabindex', '0');
1134
- }
1135
- };
1136
- /**
1137
- * @return Return true if it is single selectin list, checkbox list or radio
1138
- * list.
1139
- */
1140
- MDCListFoundation.prototype.isSelectableList = function () {
1141
- return this.isSingleSelectionList || this.isCheckboxList ||
1142
- this.isRadioList;
1143
- };
1144
- MDCListFoundation.prototype.setTabindexToFirstSelectedOrFocusedItem = function () {
1145
- var targetIndex = this.getFirstSelectedOrFocusedItemIndex();
1146
- this.setTabindexAtIndex(targetIndex);
1147
- };
1148
- MDCListFoundation.prototype.getFirstSelectedOrFocusedItemIndex = function () {
1149
- // Action lists retain focus on the most recently focused item.
1150
- if (!this.isSelectableList()) {
1151
- return Math.max(this.focusedItemIndex, 0);
1152
- }
1153
- // Single-selection lists focus the selected item.
1154
- if (typeof this.selectedIndex === 'number' &&
1155
- this.selectedIndex !== numbers.UNSET_INDEX) {
1156
- return this.selectedIndex;
1157
- }
1158
- // Multiple-selection lists focus the first selected item.
1159
- if (isNumberArray(this.selectedIndex) && this.selectedIndex.length > 0) {
1160
- return this.selectedIndex.reduce(function (minIndex, currentIndex) { return Math.min(minIndex, currentIndex); });
1161
- }
1162
- // Selection lists without a selection focus the first item.
1163
- return 0;
1164
- };
1165
- MDCListFoundation.prototype.isIndexValid = function (index) {
1166
- var _this = this;
1167
- if (index instanceof Array) {
1168
- if (!this.isCheckboxList) {
1169
- throw new Error('MDCListFoundation: Array of index is only supported for checkbox based list');
1170
- }
1171
- if (index.length === 0) {
1172
- return true;
1173
- }
1174
- else {
1175
- return index.some(function (i) { return _this.isIndexInRange(i); });
1176
- }
1177
- }
1178
- else if (typeof index === 'number') {
1179
- if (this.isCheckboxList) {
1180
- throw new Error("MDCListFoundation: Expected array of index for checkbox based list but got number: " + index);
1181
- }
1182
- return this.isIndexInRange(index) ||
1183
- this.isSingleSelectionList && index === numbers.UNSET_INDEX;
1184
- }
1185
- else {
1186
- return false;
1187
- }
1188
- };
1189
- MDCListFoundation.prototype.isIndexInRange = function (index) {
1190
- var listSize = this.adapter.getListItemCount();
1191
- return index >= 0 && index < listSize;
1192
- };
1193
- /**
1194
- * Sets selected index on user action, toggles checkbox / radio based on
1195
- * toggleCheckbox value. User interaction should not toggle list item(s) when
1196
- * disabled.
1197
- */
1198
- MDCListFoundation.prototype.setSelectedIndexOnAction = function (index, toggleCheckbox) {
1199
- if (toggleCheckbox === void 0) { toggleCheckbox = true; }
1200
- if (this.isCheckboxList) {
1201
- this.toggleCheckboxAtIndex(index, toggleCheckbox);
1202
- }
1203
- else {
1204
- this.setSelectedIndex(index);
1205
- }
1206
- };
1207
- MDCListFoundation.prototype.toggleCheckboxAtIndex = function (index, toggleCheckbox) {
1208
- var selectionAttribute = this.getSelectionAttribute();
1209
- var isChecked = this.adapter.isCheckboxCheckedAtIndex(index);
1210
- if (toggleCheckbox) {
1211
- isChecked = !isChecked;
1212
- this.adapter.setCheckedCheckboxOrRadioAtIndex(index, isChecked);
1213
- }
1214
- this.adapter.setAttributeForElementIndex(index, selectionAttribute, isChecked ? 'true' : 'false');
1215
- // If none of the checkbox items are selected and selectedIndex is not
1216
- // initialized then provide a default value.
1217
- var selectedIndexes = this.selectedIndex === numbers.UNSET_INDEX ?
1218
- [] :
1219
- this.selectedIndex.slice();
1220
- if (isChecked) {
1221
- selectedIndexes.push(index);
1222
- }
1223
- else {
1224
- selectedIndexes = selectedIndexes.filter(function (i) { return i !== index; });
1225
- }
1226
- this.selectedIndex = selectedIndexes;
1227
- };
1228
- MDCListFoundation.prototype.focusItemAtIndex = function (index) {
1229
- this.adapter.focusItemAtIndex(index);
1230
- this.focusedItemIndex = index;
1231
- };
1232
- MDCListFoundation.prototype.toggleAll = function (currentlySelectedIndexes) {
1233
- var count = this.adapter.getListItemCount();
1234
- // If all items are selected, deselect everything.
1235
- if (currentlySelectedIndexes.length === count) {
1236
- this.setCheckboxAtIndex([]);
1237
- }
1238
- else {
1239
- // Otherwise select all enabled options.
1240
- var allIndexes = [];
1241
- for (var i = 0; i < count; i++) {
1242
- if (!this.adapter.listItemAtIndexHasClass(i, cssClasses.LIST_ITEM_DISABLED_CLASS) ||
1243
- currentlySelectedIndexes.indexOf(i) > -1) {
1244
- allIndexes.push(i);
1245
- }
1246
- }
1247
- this.setCheckboxAtIndex(allIndexes);
1248
- }
1249
- };
1250
- /**
1251
- * Given the next desired character from the user, adds it to the typeahead
1252
- * buffer. Then, attempts to find the next option matching the buffer. Wraps
1253
- * around if at the end of options.
1254
- *
1255
- * @param nextChar The next character to add to the prefix buffer.
1256
- * @param startingIndex The index from which to start matching. Only relevant
1257
- * when starting a new match sequence. To start a new match sequence,
1258
- * clear the buffer using `clearTypeaheadBuffer`, or wait for the buffer
1259
- * to clear after a set interval defined in list foundation. Defaults to
1260
- * the currently focused index.
1261
- * @return The index of the matched item, or -1 if no match.
1262
- */
1263
- MDCListFoundation.prototype.typeaheadMatchItem = function (nextChar, startingIndex, skipFocus) {
1264
- var _this = this;
1265
- if (skipFocus === void 0) { skipFocus = false; }
1266
- var opts = {
1267
- focusItemAtIndex: function (index) {
1268
- _this.focusItemAtIndex(index);
1269
- },
1270
- focusedItemIndex: startingIndex ? startingIndex : this.focusedItemIndex,
1271
- nextChar: nextChar,
1272
- sortedIndexByFirstChar: this.sortedIndexByFirstChar,
1273
- skipFocus: skipFocus,
1274
- isItemAtIndexDisabled: function (index) { return _this.adapter.listItemAtIndexHasClass(index, cssClasses.LIST_ITEM_DISABLED_CLASS); }
1275
- };
1276
- return matchItem(opts, this.typeaheadState);
1277
- };
1278
- /**
1279
- * Initializes the MDCListTextAndIndex data structure by indexing the current
1280
- * list items by primary text.
1281
- *
1282
- * @return The primary texts of all the list items sorted by first character.
1283
- */
1284
- MDCListFoundation.prototype.typeaheadInitSortedIndex = function () {
1285
- return initSortedIndex(this.adapter.getListItemCount(), this.adapter.getPrimaryTextAtIndex);
1286
- };
1287
- /**
1288
- * Clears the typeahead buffer.
1289
- */
1290
- MDCListFoundation.prototype.clearTypeaheadBuffer = function () {
1291
- clearBuffer(this.typeaheadState);
1292
- };
1293
- return MDCListFoundation;
1294
- }(MDCFoundation));
1295
-
1296
- /**
1297
- * @license
1298
- * Copyright 2018 Google Inc.
1299
- *
1300
- * Permission is hereby granted, free of charge, to any person obtaining a copy
1301
- * of this software and associated documentation files (the "Software"), to deal
1302
- * in the Software without restriction, including without limitation the rights
1303
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
1304
- * copies of the Software, and to permit persons to whom the Software is
1305
- * furnished to do so, subject to the following conditions:
1306
- *
1307
- * The above copyright notice and this permission notice shall be included in
1308
- * all copies or substantial portions of the Software.
1309
- *
1310
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
1311
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
1312
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
1313
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
1314
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
1315
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
1316
- * THE SOFTWARE.
1317
- */
1318
- var MDCList = /** @class */ (function (_super) {
1319
- __extends(MDCList, _super);
1320
- function MDCList() {
1321
- return _super !== null && _super.apply(this, arguments) || this;
1322
- }
1323
- Object.defineProperty(MDCList.prototype, "vertical", {
1324
- set: function (value) {
1325
- this.foundation.setVerticalOrientation(value);
1326
- },
1327
- enumerable: false,
1328
- configurable: true
1329
- });
1330
- Object.defineProperty(MDCList.prototype, "listElements", {
1331
- get: function () {
1332
- return Array.from(this.root.querySelectorAll("." + this.classNameMap[cssClasses.LIST_ITEM_CLASS]));
1333
- },
1334
- enumerable: false,
1335
- configurable: true
1336
- });
1337
- Object.defineProperty(MDCList.prototype, "wrapFocus", {
1338
- set: function (value) {
1339
- this.foundation.setWrapFocus(value);
1340
- },
1341
- enumerable: false,
1342
- configurable: true
1343
- });
1344
- Object.defineProperty(MDCList.prototype, "typeaheadInProgress", {
1345
- /**
1346
- * @return Whether typeahead is currently matching a user-specified prefix.
1347
- */
1348
- get: function () {
1349
- return this.foundation.isTypeaheadInProgress();
1350
- },
1351
- enumerable: false,
1352
- configurable: true
1353
- });
1354
- Object.defineProperty(MDCList.prototype, "hasTypeahead", {
1355
- /**
1356
- * Sets whether typeahead functionality is enabled on the list.
1357
- * @param hasTypeahead Whether typeahead is enabled.
1358
- */
1359
- set: function (hasTypeahead) {
1360
- this.foundation.setHasTypeahead(hasTypeahead);
1361
- },
1362
- enumerable: false,
1363
- configurable: true
1364
- });
1365
- Object.defineProperty(MDCList.prototype, "singleSelection", {
1366
- set: function (isSingleSelectionList) {
1367
- this.foundation.setSingleSelection(isSingleSelectionList);
1368
- },
1369
- enumerable: false,
1370
- configurable: true
1371
- });
1372
- Object.defineProperty(MDCList.prototype, "selectedIndex", {
1373
- get: function () {
1374
- return this.foundation.getSelectedIndex();
1375
- },
1376
- set: function (index) {
1377
- this.foundation.setSelectedIndex(index);
1378
- },
1379
- enumerable: false,
1380
- configurable: true
1381
- });
1382
- MDCList.attachTo = function (root) {
1383
- return new MDCList(root);
1384
- };
1385
- MDCList.prototype.initialSyncWithDOM = function () {
1386
- this.isEvolutionEnabled =
1387
- evolutionAttribute in this.root.dataset;
1388
- if (this.isEvolutionEnabled) {
1389
- this.classNameMap = evolutionClassNameMap;
1390
- }
1391
- else if (matches(this.root, strings.DEPRECATED_SELECTOR)) {
1392
- this.classNameMap = deprecatedClassNameMap;
1393
- }
1394
- else {
1395
- this.classNameMap =
1396
- Object.values(cssClasses)
1397
- .reduce(function (obj, className) {
1398
- obj[className] = className;
1399
- return obj;
1400
- }, {});
1401
- }
1402
- this.handleClick = this.handleClickEvent.bind(this);
1403
- this.handleKeydown = this.handleKeydownEvent.bind(this);
1404
- this.focusInEventListener = this.handleFocusInEvent.bind(this);
1405
- this.focusOutEventListener = this.handleFocusOutEvent.bind(this);
1406
- this.listen('keydown', this.handleKeydown);
1407
- this.listen('click', this.handleClick);
1408
- this.listen('focusin', this.focusInEventListener);
1409
- this.listen('focusout', this.focusOutEventListener);
1410
- this.layout();
1411
- this.initializeListType();
1412
- this.ensureFocusable();
1413
- };
1414
- MDCList.prototype.destroy = function () {
1415
- this.unlisten('keydown', this.handleKeydown);
1416
- this.unlisten('click', this.handleClick);
1417
- this.unlisten('focusin', this.focusInEventListener);
1418
- this.unlisten('focusout', this.focusOutEventListener);
1419
- };
1420
- MDCList.prototype.layout = function () {
1421
- var direction = this.root.getAttribute(strings.ARIA_ORIENTATION);
1422
- this.vertical = direction !== strings.ARIA_ORIENTATION_HORIZONTAL;
1423
- var itemSelector = "." + this.classNameMap[cssClasses.LIST_ITEM_CLASS] + ":not([tabindex])";
1424
- var childSelector = strings.FOCUSABLE_CHILD_ELEMENTS;
1425
- // List items need to have at least tabindex=-1 to be focusable.
1426
- var itemEls = this.root.querySelectorAll(itemSelector);
1427
- if (itemEls.length) {
1428
- Array.prototype.forEach.call(itemEls, function (el) {
1429
- el.setAttribute('tabindex', '-1');
1430
- });
1431
- }
1432
- // Child button/a elements are not tabbable until the list item is focused.
1433
- var focusableChildEls = this.root.querySelectorAll(childSelector);
1434
- if (focusableChildEls.length) {
1435
- Array.prototype.forEach.call(focusableChildEls, function (el) {
1436
- el.setAttribute('tabindex', '-1');
1437
- });
1438
- }
1439
- if (this.isEvolutionEnabled) {
1440
- this.foundation.setUseSelectedAttribute(true);
1441
- }
1442
- this.foundation.layout();
1443
- };
1444
- /**
1445
- * Extracts the primary text from a list item.
1446
- * @param item The list item element.
1447
- * @return The primary text in the element.
1448
- */
1449
- MDCList.prototype.getPrimaryText = function (item) {
1450
- var _a;
1451
- var primaryText = item.querySelector("." + this.classNameMap[cssClasses.LIST_ITEM_PRIMARY_TEXT_CLASS]);
1452
- if (this.isEvolutionEnabled || primaryText) {
1453
- return (_a = primaryText === null || primaryText === void 0 ? void 0 : primaryText.textContent) !== null && _a !== void 0 ? _a : '';
1454
- }
1455
- var singleLineText = item.querySelector("." + this.classNameMap[cssClasses.LIST_ITEM_TEXT_CLASS]);
1456
- return (singleLineText && singleLineText.textContent) || '';
1457
- };
1458
- /**
1459
- * Initialize selectedIndex value based on pre-selected list items.
1460
- */
1461
- MDCList.prototype.initializeListType = function () {
1462
- var _this = this;
1463
- this.isInteractive =
1464
- matches(this.root, strings.ARIA_INTERACTIVE_ROLES_SELECTOR);
1465
- if (this.isEvolutionEnabled && this.isInteractive) {
1466
- var selection = Array.from(this.root.querySelectorAll(strings.SELECTED_ITEM_SELECTOR), function (listItem) { return _this.listElements.indexOf(listItem); });
1467
- if (matches(this.root, strings.ARIA_MULTI_SELECTABLE_SELECTOR)) {
1468
- this.selectedIndex = selection;
1469
- }
1470
- else if (selection.length > 0) {
1471
- this.selectedIndex = selection[0];
1472
- }
1473
- return;
1474
- }
1475
- var checkboxListItems = this.root.querySelectorAll(strings.ARIA_ROLE_CHECKBOX_SELECTOR);
1476
- var radioSelectedListItem = this.root.querySelector(strings.ARIA_CHECKED_RADIO_SELECTOR);
1477
- if (checkboxListItems.length) {
1478
- var preselectedItems = this.root.querySelectorAll(strings.ARIA_CHECKED_CHECKBOX_SELECTOR);
1479
- this.selectedIndex = Array.from(preselectedItems, function (listItem) { return _this.listElements.indexOf(listItem); });
1480
- }
1481
- else if (radioSelectedListItem) {
1482
- this.selectedIndex = this.listElements.indexOf(radioSelectedListItem);
1483
- }
1484
- };
1485
- /**
1486
- * Updates the list item at itemIndex to the desired isEnabled state.
1487
- * @param itemIndex Index of the list item
1488
- * @param isEnabled Sets the list item to enabled or disabled.
1489
- */
1490
- MDCList.prototype.setEnabled = function (itemIndex, isEnabled) {
1491
- this.foundation.setEnabled(itemIndex, isEnabled);
1492
- };
1493
- /**
1494
- * Given the next desired character from the user, adds it to the typeahead
1495
- * buffer. Then, attempts to find the next option matching the buffer. Wraps
1496
- * around if at the end of options.
1497
- *
1498
- * @param nextChar The next character to add to the prefix buffer.
1499
- * @param startingIndex The index from which to start matching. Defaults to
1500
- * the currently focused index.
1501
- * @return The index of the matched item.
1502
- */
1503
- MDCList.prototype.typeaheadMatchItem = function (nextChar, startingIndex) {
1504
- return this.foundation.typeaheadMatchItem(nextChar, startingIndex, /** skipFocus */ true);
1505
- };
1506
- MDCList.prototype.getDefaultFoundation = function () {
1507
- var _this = this;
1508
- // DO NOT INLINE this variable. For backward compatibility, foundations take
1509
- // a Partial<MDCFooAdapter>. To ensure we don't accidentally omit any
1510
- // methods, we need a separate, strongly typed adapter variable.
1511
- var adapter = {
1512
- addClassForElementIndex: function (index, className) {
1513
- var element = _this.listElements[index];
1514
- if (element) {
1515
- element.classList.add(_this.classNameMap[className]);
1516
- }
1517
- },
1518
- focusItemAtIndex: function (index) {
1519
- var element = _this.listElements[index];
1520
- if (element) {
1521
- element.focus();
1522
- }
1523
- },
1524
- getAttributeForElementIndex: function (index, attr) {
1525
- return _this.listElements[index].getAttribute(attr);
1526
- },
1527
- getFocusedElementIndex: function () {
1528
- return _this.listElements.indexOf(document.activeElement);
1529
- },
1530
- getListItemCount: function () { return _this.listElements.length; },
1531
- getPrimaryTextAtIndex: function (index) {
1532
- return _this.getPrimaryText(_this.listElements[index]);
1533
- },
1534
- hasCheckboxAtIndex: function (index) {
1535
- var listItem = _this.listElements[index];
1536
- return !!listItem.querySelector(strings.CHECKBOX_SELECTOR);
1537
- },
1538
- hasRadioAtIndex: function (index) {
1539
- var listItem = _this.listElements[index];
1540
- return !!listItem.querySelector(strings.RADIO_SELECTOR);
1541
- },
1542
- isCheckboxCheckedAtIndex: function (index) {
1543
- var listItem = _this.listElements[index];
1544
- var toggleEl = listItem.querySelector(strings.CHECKBOX_SELECTOR);
1545
- return toggleEl.checked;
1546
- },
1547
- isFocusInsideList: function () {
1548
- return _this.root !== document.activeElement &&
1549
- _this.root.contains(document.activeElement);
1550
- },
1551
- isRootFocused: function () { return document.activeElement === _this.root; },
1552
- listItemAtIndexHasClass: function (index, className) {
1553
- return _this.listElements[index].classList.contains(_this.classNameMap[className]);
1554
- },
1555
- notifyAction: function (index) {
1556
- _this.emit(strings.ACTION_EVENT, { index: index }, /** shouldBubble */ true);
1557
- },
1558
- removeClassForElementIndex: function (index, className) {
1559
- var element = _this.listElements[index];
1560
- if (element) {
1561
- element.classList.remove(_this.classNameMap[className]);
1562
- }
1563
- },
1564
- setAttributeForElementIndex: function (index, attr, value) {
1565
- var element = _this.listElements[index];
1566
- if (element) {
1567
- element.setAttribute(attr, value);
1568
- }
1569
- },
1570
- setCheckedCheckboxOrRadioAtIndex: function (index, isChecked) {
1571
- var listItem = _this.listElements[index];
1572
- var toggleEl = listItem.querySelector(strings.CHECKBOX_RADIO_SELECTOR);
1573
- toggleEl.checked = isChecked;
1574
- var event = document.createEvent('Event');
1575
- event.initEvent('change', true, true);
1576
- toggleEl.dispatchEvent(event);
1577
- },
1578
- setTabIndexForListItemChildren: function (listItemIndex, tabIndexValue) {
1579
- var element = _this.listElements[listItemIndex];
1580
- var selector = strings.CHILD_ELEMENTS_TO_TOGGLE_TABINDEX;
1581
- Array.prototype.forEach.call(element.querySelectorAll(selector), function (el) {
1582
- el.setAttribute('tabindex', tabIndexValue);
1583
- });
1584
- },
1585
- };
1586
- return new MDCListFoundation(adapter);
1587
- };
1588
- /**
1589
- * Ensures that at least one item is focusable if the list is interactive and
1590
- * doesn't specify a suitable tabindex.
1591
- */
1592
- MDCList.prototype.ensureFocusable = function () {
1593
- if (this.isEvolutionEnabled && this.isInteractive) {
1594
- if (!this.root.querySelector("." + this.classNameMap[cssClasses.LIST_ITEM_CLASS] + "[tabindex=\"0\"]")) {
1595
- var index = this.initialFocusIndex();
1596
- if (index !== -1) {
1597
- this.listElements[index].tabIndex = 0;
1598
- }
1599
- }
1600
- }
1601
- };
1602
- MDCList.prototype.initialFocusIndex = function () {
1603
- if (this.selectedIndex instanceof Array && this.selectedIndex.length > 0) {
1604
- return this.selectedIndex[0];
1605
- }
1606
- if (typeof this.selectedIndex === 'number' &&
1607
- this.selectedIndex !== numbers.UNSET_INDEX) {
1608
- return this.selectedIndex;
1609
- }
1610
- var el = this.root.querySelector("." + this.classNameMap[cssClasses.LIST_ITEM_CLASS] + ":not(." + this.classNameMap[cssClasses.LIST_ITEM_DISABLED_CLASS] + ")");
1611
- if (el === null) {
1612
- return -1;
1613
- }
1614
- return this.getListItemIndex(el);
1615
- };
1616
- /**
1617
- * Used to figure out which list item this event is targetting. Or returns -1
1618
- * if there is no list item
1619
- */
1620
- MDCList.prototype.getListItemIndex = function (el) {
1621
- var nearestParent = closest(el, "." + this.classNameMap[cssClasses.LIST_ITEM_CLASS] + ", ." + this.classNameMap[cssClasses.ROOT]);
1622
- // Get the index of the element if it is a list item.
1623
- if (nearestParent &&
1624
- matches(nearestParent, "." + this.classNameMap[cssClasses.LIST_ITEM_CLASS])) {
1625
- return this.listElements.indexOf(nearestParent);
1626
- }
1627
- return -1;
1628
- };
1629
- /**
1630
- * Used to figure out which element was clicked before sending the event to
1631
- * the foundation.
1632
- */
1633
- MDCList.prototype.handleFocusInEvent = function (evt) {
1634
- var index = this.getListItemIndex(evt.target);
1635
- this.foundation.handleFocusIn(index);
1636
- };
1637
- /**
1638
- * Used to figure out which element was clicked before sending the event to
1639
- * the foundation.
1640
- */
1641
- MDCList.prototype.handleFocusOutEvent = function (evt) {
1642
- var index = this.getListItemIndex(evt.target);
1643
- this.foundation.handleFocusOut(index);
1644
- };
1645
- /**
1646
- * Used to figure out which element was focused when keydown event occurred
1647
- * before sending the event to the foundation.
1648
- */
1649
- MDCList.prototype.handleKeydownEvent = function (evt) {
1650
- var index = this.getListItemIndex(evt.target);
1651
- var target = evt.target;
1652
- this.foundation.handleKeydown(evt, target.classList.contains(this.classNameMap[cssClasses.LIST_ITEM_CLASS]), index);
1653
- };
1654
- /**
1655
- * Used to figure out which element was clicked before sending the event to
1656
- * the foundation.
1657
- */
1658
- MDCList.prototype.handleClickEvent = function (evt) {
1659
- var index = this.getListItemIndex(evt.target);
1660
- var target = evt.target;
1661
- // Toggle the checkbox only if it's not the target of the event, or the
1662
- // checkbox will have 2 change events.
1663
- var toggleCheckbox = !matches(target, strings.CHECKBOX_RADIO_SELECTOR);
1664
- this.foundation.handleClick(index, toggleCheckbox);
1665
- };
1666
- return MDCList;
1667
- }(MDCComponent));
1668
-
1669
- /**
1670
- * @license
1671
- * Copyright 2018 Google Inc.
1672
- *
1673
- * Permission is hereby granted, free of charge, to any person obtaining a copy
1674
- * of this software and associated documentation files (the "Software"), to deal
1675
- * in the Software without restriction, including without limitation the rights
1676
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
1677
- * copies of the Software, and to permit persons to whom the Software is
1678
- * furnished to do so, subject to the following conditions:
1679
- *
1680
- * The above copyright notice and this permission notice shall be included in
1681
- * all copies or substantial portions of the Software.
1682
- *
1683
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
1684
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
1685
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
1686
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
1687
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
1688
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
1689
- * THE SOFTWARE.
1690
- */
1691
- var MDCMenuSurfaceFoundation = /** @class */ (function (_super) {
1692
- __extends(MDCMenuSurfaceFoundation, _super);
1693
- function MDCMenuSurfaceFoundation(adapter) {
1694
- var _this = _super.call(this, __assign(__assign({}, MDCMenuSurfaceFoundation.defaultAdapter), adapter)) || this;
1695
- _this.isSurfaceOpen = false;
1696
- _this.isQuickOpen = false;
1697
- _this.isHoistedElement = false;
1698
- _this.isFixedPosition = false;
1699
- _this.isHorizontallyCenteredOnViewport = false;
1700
- _this.maxHeight = 0;
1701
- _this.openAnimationEndTimerId = 0;
1702
- _this.closeAnimationEndTimerId = 0;
1703
- _this.animationRequestId = 0;
1704
- _this.anchorCorner = Corner.TOP_START;
1705
- /**
1706
- * Corner of the menu surface to which menu surface is attached to anchor.
1707
- *
1708
- * Anchor corner --->+----------+
1709
- * | ANCHOR |
1710
- * +----------+
1711
- * Origin corner --->+--------------+
1712
- * | |
1713
- * | |
1714
- * | MENU SURFACE |
1715
- * | |
1716
- * | |
1717
- * +--------------+
1718
- */
1719
- _this.originCorner = Corner.TOP_START;
1720
- _this.anchorMargin = { top: 0, right: 0, bottom: 0, left: 0 };
1721
- _this.position = { x: 0, y: 0 };
1722
- return _this;
1723
- }
1724
- Object.defineProperty(MDCMenuSurfaceFoundation, "cssClasses", {
1725
- get: function () {
1726
- return cssClasses$1;
1727
- },
1728
- enumerable: false,
1729
- configurable: true
1730
- });
1731
- Object.defineProperty(MDCMenuSurfaceFoundation, "strings", {
1732
- get: function () {
1733
- return strings$1;
1734
- },
1735
- enumerable: false,
1736
- configurable: true
1737
- });
1738
- Object.defineProperty(MDCMenuSurfaceFoundation, "numbers", {
1739
- get: function () {
1740
- return numbers$1;
1741
- },
1742
- enumerable: false,
1743
- configurable: true
1744
- });
1745
- Object.defineProperty(MDCMenuSurfaceFoundation, "Corner", {
1746
- get: function () {
1747
- return Corner;
1748
- },
1749
- enumerable: false,
1750
- configurable: true
1751
- });
1752
- Object.defineProperty(MDCMenuSurfaceFoundation, "defaultAdapter", {
1753
- /**
1754
- * @see {@link MDCMenuSurfaceAdapter} for typing information on parameters and return types.
1755
- */
1756
- get: function () {
1757
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
1758
- return {
1759
- addClass: function () { return undefined; },
1760
- removeClass: function () { return undefined; },
1761
- hasClass: function () { return false; },
1762
- hasAnchor: function () { return false; },
1763
- isElementInContainer: function () { return false; },
1764
- isFocused: function () { return false; },
1765
- isRtl: function () { return false; },
1766
- getInnerDimensions: function () { return ({ height: 0, width: 0 }); },
1767
- getAnchorDimensions: function () { return null; },
1768
- getWindowDimensions: function () { return ({ height: 0, width: 0 }); },
1769
- getBodyDimensions: function () { return ({ height: 0, width: 0 }); },
1770
- getWindowScroll: function () { return ({ x: 0, y: 0 }); },
1771
- setPosition: function () { return undefined; },
1772
- setMaxHeight: function () { return undefined; },
1773
- setTransformOrigin: function () { return undefined; },
1774
- saveFocus: function () { return undefined; },
1775
- restoreFocus: function () { return undefined; },
1776
- notifyClose: function () { return undefined; },
1777
- notifyOpen: function () { return undefined; },
1778
- notifyClosing: function () { return undefined; },
1779
- };
1780
- // tslint:enable:object-literal-sort-keys
1781
- },
1782
- enumerable: false,
1783
- configurable: true
1784
- });
1785
- MDCMenuSurfaceFoundation.prototype.init = function () {
1786
- var _a = MDCMenuSurfaceFoundation.cssClasses, ROOT = _a.ROOT, OPEN = _a.OPEN;
1787
- if (!this.adapter.hasClass(ROOT)) {
1788
- throw new Error(ROOT + " class required in root element.");
1789
- }
1790
- if (this.adapter.hasClass(OPEN)) {
1791
- this.isSurfaceOpen = true;
1792
- }
1793
- };
1794
- MDCMenuSurfaceFoundation.prototype.destroy = function () {
1795
- clearTimeout(this.openAnimationEndTimerId);
1796
- clearTimeout(this.closeAnimationEndTimerId);
1797
- // Cancel any currently running animations.
1798
- cancelAnimationFrame(this.animationRequestId);
1799
- };
1800
- /**
1801
- * @param corner Default anchor corner alignment of top-left menu surface
1802
- * corner.
1803
- */
1804
- MDCMenuSurfaceFoundation.prototype.setAnchorCorner = function (corner) {
1805
- this.anchorCorner = corner;
1806
- };
1807
- /**
1808
- * Flip menu corner horizontally.
1809
- */
1810
- MDCMenuSurfaceFoundation.prototype.flipCornerHorizontally = function () {
1811
- this.originCorner = this.originCorner ^ CornerBit.RIGHT;
1812
- };
1813
- /**
1814
- * @param margin Set of margin values from anchor.
1815
- */
1816
- MDCMenuSurfaceFoundation.prototype.setAnchorMargin = function (margin) {
1817
- this.anchorMargin.top = margin.top || 0;
1818
- this.anchorMargin.right = margin.right || 0;
1819
- this.anchorMargin.bottom = margin.bottom || 0;
1820
- this.anchorMargin.left = margin.left || 0;
1821
- };
1822
- /** Used to indicate if the menu-surface is hoisted to the body. */
1823
- MDCMenuSurfaceFoundation.prototype.setIsHoisted = function (isHoisted) {
1824
- this.isHoistedElement = isHoisted;
1825
- };
1826
- /**
1827
- * Used to set the menu-surface calculations based on a fixed position menu.
1828
- */
1829
- MDCMenuSurfaceFoundation.prototype.setFixedPosition = function (isFixedPosition) {
1830
- this.isFixedPosition = isFixedPosition;
1831
- };
1832
- /**
1833
- * @return Returns true if menu is in fixed (`position: fixed`) position.
1834
- */
1835
- MDCMenuSurfaceFoundation.prototype.isFixed = function () {
1836
- return this.isFixedPosition;
1837
- };
1838
- /** Sets the menu-surface position on the page. */
1839
- MDCMenuSurfaceFoundation.prototype.setAbsolutePosition = function (x, y) {
1840
- this.position.x = this.isFinite(x) ? x : 0;
1841
- this.position.y = this.isFinite(y) ? y : 0;
1842
- };
1843
- /** Sets whether menu-surface should be horizontally centered to viewport. */
1844
- MDCMenuSurfaceFoundation.prototype.setIsHorizontallyCenteredOnViewport = function (isCentered) {
1845
- this.isHorizontallyCenteredOnViewport = isCentered;
1846
- };
1847
- MDCMenuSurfaceFoundation.prototype.setQuickOpen = function (quickOpen) {
1848
- this.isQuickOpen = quickOpen;
1849
- };
1850
- /**
1851
- * Sets maximum menu-surface height on open.
1852
- * @param maxHeight The desired max-height. Set to 0 (default) to
1853
- * automatically calculate max height based on available viewport space.
1854
- */
1855
- MDCMenuSurfaceFoundation.prototype.setMaxHeight = function (maxHeight) {
1856
- this.maxHeight = maxHeight;
1857
- };
1858
- MDCMenuSurfaceFoundation.prototype.isOpen = function () {
1859
- return this.isSurfaceOpen;
1860
- };
1861
- /**
1862
- * Open the menu surface.
1863
- */
1864
- MDCMenuSurfaceFoundation.prototype.open = function () {
1865
- var _this = this;
1866
- if (this.isSurfaceOpen) {
1867
- return;
1868
- }
1869
- this.adapter.saveFocus();
1870
- if (this.isQuickOpen) {
1871
- this.isSurfaceOpen = true;
1872
- this.adapter.addClass(MDCMenuSurfaceFoundation.cssClasses.OPEN);
1873
- this.dimensions = this.adapter.getInnerDimensions();
1874
- this.autoposition();
1875
- this.adapter.notifyOpen();
1876
- }
1877
- else {
1878
- this.adapter.addClass(MDCMenuSurfaceFoundation.cssClasses.ANIMATING_OPEN);
1879
- this.animationRequestId = requestAnimationFrame(function () {
1880
- _this.dimensions = _this.adapter.getInnerDimensions();
1881
- _this.autoposition();
1882
- _this.adapter.addClass(MDCMenuSurfaceFoundation.cssClasses.OPEN);
1883
- _this.openAnimationEndTimerId = setTimeout(function () {
1884
- _this.openAnimationEndTimerId = 0;
1885
- _this.adapter.removeClass(MDCMenuSurfaceFoundation.cssClasses.ANIMATING_OPEN);
1886
- _this.adapter.notifyOpen();
1887
- }, numbers$1.TRANSITION_OPEN_DURATION);
1888
- });
1889
- this.isSurfaceOpen = true;
1890
- }
1891
- };
1892
- /**
1893
- * Closes the menu surface.
1894
- */
1895
- MDCMenuSurfaceFoundation.prototype.close = function (skipRestoreFocus) {
1896
- var _this = this;
1897
- if (skipRestoreFocus === void 0) { skipRestoreFocus = false; }
1898
- if (!this.isSurfaceOpen) {
1899
- return;
1900
- }
1901
- this.adapter.notifyClosing();
1902
- if (this.isQuickOpen) {
1903
- this.isSurfaceOpen = false;
1904
- if (!skipRestoreFocus) {
1905
- this.maybeRestoreFocus();
1906
- }
1907
- this.adapter.removeClass(MDCMenuSurfaceFoundation.cssClasses.OPEN);
1908
- this.adapter.removeClass(MDCMenuSurfaceFoundation.cssClasses.IS_OPEN_BELOW);
1909
- this.adapter.notifyClose();
1910
- return;
1911
- }
1912
- this.adapter.addClass(MDCMenuSurfaceFoundation.cssClasses.ANIMATING_CLOSED);
1913
- requestAnimationFrame(function () {
1914
- _this.adapter.removeClass(MDCMenuSurfaceFoundation.cssClasses.OPEN);
1915
- _this.adapter.removeClass(MDCMenuSurfaceFoundation.cssClasses.IS_OPEN_BELOW);
1916
- _this.closeAnimationEndTimerId = setTimeout(function () {
1917
- _this.closeAnimationEndTimerId = 0;
1918
- _this.adapter.removeClass(MDCMenuSurfaceFoundation.cssClasses.ANIMATING_CLOSED);
1919
- _this.adapter.notifyClose();
1920
- }, numbers$1.TRANSITION_CLOSE_DURATION);
1921
- });
1922
- this.isSurfaceOpen = false;
1923
- if (!skipRestoreFocus) {
1924
- this.maybeRestoreFocus();
1925
- }
1926
- };
1927
- /** Handle clicks and close if not within menu-surface element. */
1928
- MDCMenuSurfaceFoundation.prototype.handleBodyClick = function (evt) {
1929
- var el = evt.target;
1930
- if (this.adapter.isElementInContainer(el)) {
1931
- return;
1932
- }
1933
- this.close();
1934
- };
1935
- /** Handle keys that close the surface. */
1936
- MDCMenuSurfaceFoundation.prototype.handleKeydown = function (evt) {
1937
- var keyCode = evt.keyCode, key = evt.key;
1938
- var isEscape = key === 'Escape' || keyCode === 27;
1939
- if (isEscape) {
1940
- this.close();
1941
- }
1942
- };
1943
- MDCMenuSurfaceFoundation.prototype.autoposition = function () {
1944
- var _a;
1945
- // Compute measurements for autoposition methods reuse.
1946
- this.measurements = this.getAutoLayoutmeasurements();
1947
- var corner = this.getoriginCorner();
1948
- var maxMenuSurfaceHeight = this.getMenuSurfaceMaxHeight(corner);
1949
- var verticalAlignment = this.hasBit(corner, CornerBit.BOTTOM) ? 'bottom' : 'top';
1950
- var horizontalAlignment = this.hasBit(corner, CornerBit.RIGHT) ? 'right' : 'left';
1951
- var horizontalOffset = this.getHorizontalOriginOffset(corner);
1952
- var verticalOffset = this.getVerticalOriginOffset(corner);
1953
- var _b = this.measurements, anchorSize = _b.anchorSize, surfaceSize = _b.surfaceSize;
1954
- var position = (_a = {},
1955
- _a[horizontalAlignment] = horizontalOffset,
1956
- _a[verticalAlignment] = verticalOffset,
1957
- _a);
1958
- // Center align when anchor width is comparable or greater than menu
1959
- // surface, otherwise keep corner.
1960
- if (anchorSize.width / surfaceSize.width >
1961
- numbers$1.ANCHOR_TO_MENU_SURFACE_WIDTH_RATIO) {
1962
- horizontalAlignment = 'center';
1963
- }
1964
- // If the menu-surface has been hoisted to the body, it's no longer relative
1965
- // to the anchor element
1966
- if (this.isHoistedElement || this.isFixedPosition) {
1967
- this.adjustPositionForHoistedElement(position);
1968
- }
1969
- this.adapter.setTransformOrigin(horizontalAlignment + " " + verticalAlignment);
1970
- this.adapter.setPosition(position);
1971
- this.adapter.setMaxHeight(maxMenuSurfaceHeight ? maxMenuSurfaceHeight + 'px' : '');
1972
- // If it is opened from the top then add is-open-below class
1973
- if (!this.hasBit(corner, CornerBit.BOTTOM)) {
1974
- this.adapter.addClass(MDCMenuSurfaceFoundation.cssClasses.IS_OPEN_BELOW);
1975
- }
1976
- };
1977
- /**
1978
- * @return Measurements used to position menu surface popup.
1979
- */
1980
- MDCMenuSurfaceFoundation.prototype.getAutoLayoutmeasurements = function () {
1981
- var anchorRect = this.adapter.getAnchorDimensions();
1982
- var bodySize = this.adapter.getBodyDimensions();
1983
- var viewportSize = this.adapter.getWindowDimensions();
1984
- var windowScroll = this.adapter.getWindowScroll();
1985
- if (!anchorRect) {
1986
- // tslint:disable:object-literal-sort-keys Positional properties are more readable when they're grouped together
1987
- anchorRect = {
1988
- top: this.position.y,
1989
- right: this.position.x,
1990
- bottom: this.position.y,
1991
- left: this.position.x,
1992
- width: 0,
1993
- height: 0,
1994
- };
1995
- // tslint:enable:object-literal-sort-keys
1996
- }
1997
- return {
1998
- anchorSize: anchorRect,
1999
- bodySize: bodySize,
2000
- surfaceSize: this.dimensions,
2001
- viewportDistance: {
2002
- // tslint:disable:object-literal-sort-keys Positional properties are more readable when they're grouped together
2003
- top: anchorRect.top,
2004
- right: viewportSize.width - anchorRect.right,
2005
- bottom: viewportSize.height - anchorRect.bottom,
2006
- left: anchorRect.left,
2007
- // tslint:enable:object-literal-sort-keys
2008
- },
2009
- viewportSize: viewportSize,
2010
- windowScroll: windowScroll,
2011
- };
2012
- };
2013
- /**
2014
- * Computes the corner of the anchor from which to animate and position the
2015
- * menu surface.
2016
- *
2017
- * Only LEFT or RIGHT bit is used to position the menu surface ignoring RTL
2018
- * context. E.g., menu surface will be positioned from right side on TOP_END.
2019
- */
2020
- MDCMenuSurfaceFoundation.prototype.getoriginCorner = function () {
2021
- var corner = this.originCorner;
2022
- var _a = this.measurements, viewportDistance = _a.viewportDistance, anchorSize = _a.anchorSize, surfaceSize = _a.surfaceSize;
2023
- var MARGIN_TO_EDGE = MDCMenuSurfaceFoundation.numbers.MARGIN_TO_EDGE;
2024
- var isAnchoredToBottom = this.hasBit(this.anchorCorner, CornerBit.BOTTOM);
2025
- var availableTop;
2026
- var availableBottom;
2027
- if (isAnchoredToBottom) {
2028
- availableTop =
2029
- viewportDistance.top - MARGIN_TO_EDGE + this.anchorMargin.bottom;
2030
- availableBottom =
2031
- viewportDistance.bottom - MARGIN_TO_EDGE - this.anchorMargin.bottom;
2032
- }
2033
- else {
2034
- availableTop =
2035
- viewportDistance.top - MARGIN_TO_EDGE + this.anchorMargin.top;
2036
- availableBottom = viewportDistance.bottom - MARGIN_TO_EDGE +
2037
- anchorSize.height - this.anchorMargin.top;
2038
- }
2039
- var isAvailableBottom = availableBottom - surfaceSize.height > 0;
2040
- if (!isAvailableBottom && availableTop > availableBottom) {
2041
- // Attach bottom side of surface to the anchor.
2042
- corner = this.setBit(corner, CornerBit.BOTTOM);
2043
- }
2044
- var isRtl = this.adapter.isRtl();
2045
- var isFlipRtl = this.hasBit(this.anchorCorner, CornerBit.FLIP_RTL);
2046
- var hasRightBit = this.hasBit(this.anchorCorner, CornerBit.RIGHT) ||
2047
- this.hasBit(corner, CornerBit.RIGHT);
2048
- // Whether surface attached to right side of anchor element.
2049
- var isAnchoredToRight = false;
2050
- // Anchored to start
2051
- if (isRtl && isFlipRtl) {
2052
- isAnchoredToRight = !hasRightBit;
2053
- }
2054
- else {
2055
- // Anchored to right
2056
- isAnchoredToRight = hasRightBit;
2057
- }
2058
- var availableLeft;
2059
- var availableRight;
2060
- if (isAnchoredToRight) {
2061
- availableLeft =
2062
- viewportDistance.left + anchorSize.width + this.anchorMargin.right;
2063
- availableRight = viewportDistance.right - this.anchorMargin.right;
2064
- }
2065
- else {
2066
- availableLeft = viewportDistance.left + this.anchorMargin.left;
2067
- availableRight =
2068
- viewportDistance.right + anchorSize.width - this.anchorMargin.left;
2069
- }
2070
- var isAvailableLeft = availableLeft - surfaceSize.width > 0;
2071
- var isAvailableRight = availableRight - surfaceSize.width > 0;
2072
- var isOriginCornerAlignedToEnd = this.hasBit(corner, CornerBit.FLIP_RTL) &&
2073
- this.hasBit(corner, CornerBit.RIGHT);
2074
- if (isAvailableRight && isOriginCornerAlignedToEnd && isRtl ||
2075
- !isAvailableLeft && isOriginCornerAlignedToEnd) {
2076
- // Attach left side of surface to the anchor.
2077
- corner = this.unsetBit(corner, CornerBit.RIGHT);
2078
- }
2079
- else if (isAvailableLeft && isAnchoredToRight && isRtl ||
2080
- (isAvailableLeft && !isAnchoredToRight && hasRightBit) ||
2081
- (!isAvailableRight && availableLeft >= availableRight)) {
2082
- // Attach right side of surface to the anchor.
2083
- corner = this.setBit(corner, CornerBit.RIGHT);
2084
- }
2085
- return corner;
2086
- };
2087
- /**
2088
- * @param corner Origin corner of the menu surface.
2089
- * @return Maximum height of the menu surface, based on available space. 0
2090
- * indicates should not be set.
2091
- */
2092
- MDCMenuSurfaceFoundation.prototype.getMenuSurfaceMaxHeight = function (corner) {
2093
- if (this.maxHeight > 0) {
2094
- return this.maxHeight;
2095
- }
2096
- var viewportDistance = this.measurements.viewportDistance;
2097
- var maxHeight = 0;
2098
- var isBottomAligned = this.hasBit(corner, CornerBit.BOTTOM);
2099
- var isBottomAnchored = this.hasBit(this.anchorCorner, CornerBit.BOTTOM);
2100
- var MARGIN_TO_EDGE = MDCMenuSurfaceFoundation.numbers.MARGIN_TO_EDGE;
2101
- // When maximum height is not specified, it is handled from CSS.
2102
- if (isBottomAligned) {
2103
- maxHeight = viewportDistance.top + this.anchorMargin.top - MARGIN_TO_EDGE;
2104
- if (!isBottomAnchored) {
2105
- maxHeight += this.measurements.anchorSize.height;
2106
- }
2107
- }
2108
- else {
2109
- maxHeight = viewportDistance.bottom - this.anchorMargin.bottom +
2110
- this.measurements.anchorSize.height - MARGIN_TO_EDGE;
2111
- if (isBottomAnchored) {
2112
- maxHeight -= this.measurements.anchorSize.height;
2113
- }
2114
- }
2115
- return maxHeight;
2116
- };
2117
- /**
2118
- * @param corner Origin corner of the menu surface.
2119
- * @return Horizontal offset of menu surface origin corner from corresponding
2120
- * anchor corner.
2121
- */
2122
- MDCMenuSurfaceFoundation.prototype.getHorizontalOriginOffset = function (corner) {
2123
- var anchorSize = this.measurements.anchorSize;
2124
- // isRightAligned corresponds to using the 'right' property on the surface.
2125
- var isRightAligned = this.hasBit(corner, CornerBit.RIGHT);
2126
- var avoidHorizontalOverlap = this.hasBit(this.anchorCorner, CornerBit.RIGHT);
2127
- if (isRightAligned) {
2128
- var rightOffset = avoidHorizontalOverlap ?
2129
- anchorSize.width - this.anchorMargin.left :
2130
- this.anchorMargin.right;
2131
- // For hoisted or fixed elements, adjust the offset by the difference
2132
- // between viewport width and body width so when we calculate the right
2133
- // value (`adjustPositionForHoistedElement`) based on the element
2134
- // position, the right property is correct.
2135
- if (this.isHoistedElement || this.isFixedPosition) {
2136
- return rightOffset -
2137
- (this.measurements.viewportSize.width -
2138
- this.measurements.bodySize.width);
2139
- }
2140
- return rightOffset;
2141
- }
2142
- return avoidHorizontalOverlap ? anchorSize.width - this.anchorMargin.right :
2143
- this.anchorMargin.left;
2144
- };
2145
- /**
2146
- * @param corner Origin corner of the menu surface.
2147
- * @return Vertical offset of menu surface origin corner from corresponding
2148
- * anchor corner.
2149
- */
2150
- MDCMenuSurfaceFoundation.prototype.getVerticalOriginOffset = function (corner) {
2151
- var anchorSize = this.measurements.anchorSize;
2152
- var isBottomAligned = this.hasBit(corner, CornerBit.BOTTOM);
2153
- var avoidVerticalOverlap = this.hasBit(this.anchorCorner, CornerBit.BOTTOM);
2154
- var y = 0;
2155
- if (isBottomAligned) {
2156
- y = avoidVerticalOverlap ? anchorSize.height - this.anchorMargin.top :
2157
- -this.anchorMargin.bottom;
2158
- }
2159
- else {
2160
- y = avoidVerticalOverlap ?
2161
- (anchorSize.height + this.anchorMargin.bottom) :
2162
- this.anchorMargin.top;
2163
- }
2164
- return y;
2165
- };
2166
- /**
2167
- * Calculates the offsets for positioning the menu-surface when the
2168
- * menu-surface has been hoisted to the body.
2169
- */
2170
- MDCMenuSurfaceFoundation.prototype.adjustPositionForHoistedElement = function (position) {
2171
- var e_1, _a;
2172
- var _b = this.measurements, windowScroll = _b.windowScroll, viewportDistance = _b.viewportDistance, surfaceSize = _b.surfaceSize, viewportSize = _b.viewportSize;
2173
- var props = Object.keys(position);
2174
- try {
2175
- for (var props_1 = __values(props), props_1_1 = props_1.next(); !props_1_1.done; props_1_1 = props_1.next()) {
2176
- var prop = props_1_1.value;
2177
- var value = position[prop] || 0;
2178
- if (this.isHorizontallyCenteredOnViewport &&
2179
- (prop === 'left' || prop === 'right')) {
2180
- position[prop] = (viewportSize.width - surfaceSize.width) / 2;
2181
- continue;
2182
- }
2183
- // Hoisted surfaces need to have the anchor elements location on the page
2184
- // added to the position properties for proper alignment on the body.
2185
- value += viewportDistance[prop];
2186
- // Surfaces that are absolutely positioned need to have additional
2187
- // calculations for scroll and bottom positioning.
2188
- if (!this.isFixedPosition) {
2189
- if (prop === 'top') {
2190
- value += windowScroll.y;
2191
- }
2192
- else if (prop === 'bottom') {
2193
- value -= windowScroll.y;
2194
- }
2195
- else if (prop === 'left') {
2196
- value += windowScroll.x;
2197
- }
2198
- else { // prop === 'right'
2199
- value -= windowScroll.x;
2200
- }
2201
- }
2202
- position[prop] = value;
2203
- }
2204
- }
2205
- catch (e_1_1) { e_1 = { error: e_1_1 }; }
2206
- finally {
2207
- try {
2208
- if (props_1_1 && !props_1_1.done && (_a = props_1.return)) _a.call(props_1);
2209
- }
2210
- finally { if (e_1) throw e_1.error; }
2211
- }
2212
- };
2213
- /**
2214
- * The last focused element when the menu surface was opened should regain
2215
- * focus, if the user is focused on or within the menu surface when it is
2216
- * closed.
2217
- */
2218
- MDCMenuSurfaceFoundation.prototype.maybeRestoreFocus = function () {
2219
- var _this = this;
2220
- var isRootFocused = this.adapter.isFocused();
2221
- var childHasFocus = document.activeElement &&
2222
- this.adapter.isElementInContainer(document.activeElement);
2223
- if (isRootFocused || childHasFocus) {
2224
- // Wait before restoring focus when closing the menu surface. This is
2225
- // important because if a touch event triggered the menu close, and the
2226
- // subsequent mouse event occurs after focus is restored, then the
2227
- // restored focus would be lost.
2228
- setTimeout(function () {
2229
- _this.adapter.restoreFocus();
2230
- }, numbers$1.TOUCH_EVENT_WAIT_MS);
2231
- }
2232
- };
2233
- MDCMenuSurfaceFoundation.prototype.hasBit = function (corner, bit) {
2234
- return Boolean(corner & bit); // tslint:disable-line:no-bitwise
2235
- };
2236
- MDCMenuSurfaceFoundation.prototype.setBit = function (corner, bit) {
2237
- return corner | bit; // tslint:disable-line:no-bitwise
2238
- };
2239
- MDCMenuSurfaceFoundation.prototype.unsetBit = function (corner, bit) {
2240
- return corner ^ bit;
2241
- };
2242
- /**
2243
- * isFinite that doesn't force conversion to number type.
2244
- * Equivalent to Number.isFinite in ES2015, which is not supported in IE.
2245
- */
2246
- MDCMenuSurfaceFoundation.prototype.isFinite = function (num) {
2247
- return typeof num === 'number' && isFinite(num);
2248
- };
2249
- return MDCMenuSurfaceFoundation;
2250
- }(MDCFoundation));
2251
-
2252
- /**
2253
- * @license
2254
- * Copyright 2018 Google Inc.
2255
- *
2256
- * Permission is hereby granted, free of charge, to any person obtaining a copy
2257
- * of this software and associated documentation files (the "Software"), to deal
2258
- * in the Software without restriction, including without limitation the rights
2259
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
2260
- * copies of the Software, and to permit persons to whom the Software is
2261
- * furnished to do so, subject to the following conditions:
2262
- *
2263
- * The above copyright notice and this permission notice shall be included in
2264
- * all copies or substantial portions of the Software.
2265
- *
2266
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
2267
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
2268
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
2269
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
2270
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
2271
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
2272
- * THE SOFTWARE.
2273
- */
2274
- var MDCMenuSurface = /** @class */ (function (_super) {
2275
- __extends(MDCMenuSurface, _super);
2276
- function MDCMenuSurface() {
2277
- return _super !== null && _super.apply(this, arguments) || this;
2278
- }
2279
- MDCMenuSurface.attachTo = function (root) {
2280
- return new MDCMenuSurface(root);
2281
- };
2282
- MDCMenuSurface.prototype.initialSyncWithDOM = function () {
2283
- var _this = this;
2284
- var parentEl = this.root.parentElement;
2285
- this.anchorElement = parentEl && parentEl.classList.contains(cssClasses$1.ANCHOR) ? parentEl : null;
2286
- if (this.root.classList.contains(cssClasses$1.FIXED)) {
2287
- this.setFixedPosition(true);
2288
- }
2289
- this.handleKeydown = function (event) {
2290
- _this.foundation.handleKeydown(event);
2291
- };
2292
- this.handleBodyClick = function (event) {
2293
- _this.foundation.handleBodyClick(event);
2294
- };
2295
- // capture so that no race between handleBodyClick and quickOpen when
2296
- // menusurface opened on button click which registers this listener
2297
- this.registerBodyClickListener = function () {
2298
- document.body.addEventListener('click', _this.handleBodyClick, { capture: true });
2299
- };
2300
- this.deregisterBodyClickListener = function () {
2301
- document.body.removeEventListener('click', _this.handleBodyClick, { capture: true });
2302
- };
2303
- this.listen('keydown', this.handleKeydown);
2304
- this.listen(strings$1.OPENED_EVENT, this.registerBodyClickListener);
2305
- this.listen(strings$1.CLOSED_EVENT, this.deregisterBodyClickListener);
2306
- };
2307
- MDCMenuSurface.prototype.destroy = function () {
2308
- this.unlisten('keydown', this.handleKeydown);
2309
- this.unlisten(strings$1.OPENED_EVENT, this.registerBodyClickListener);
2310
- this.unlisten(strings$1.CLOSED_EVENT, this.deregisterBodyClickListener);
2311
- _super.prototype.destroy.call(this);
2312
- };
2313
- MDCMenuSurface.prototype.isOpen = function () {
2314
- return this.foundation.isOpen();
2315
- };
2316
- MDCMenuSurface.prototype.open = function () {
2317
- this.foundation.open();
2318
- };
2319
- MDCMenuSurface.prototype.close = function (skipRestoreFocus) {
2320
- if (skipRestoreFocus === void 0) { skipRestoreFocus = false; }
2321
- this.foundation.close(skipRestoreFocus);
2322
- };
2323
- Object.defineProperty(MDCMenuSurface.prototype, "quickOpen", {
2324
- set: function (quickOpen) {
2325
- this.foundation.setQuickOpen(quickOpen);
2326
- },
2327
- enumerable: false,
2328
- configurable: true
2329
- });
2330
- /** Sets the foundation to use page offsets for an positioning when the menu is hoisted to the body. */
2331
- MDCMenuSurface.prototype.setIsHoisted = function (isHoisted) {
2332
- this.foundation.setIsHoisted(isHoisted);
2333
- };
2334
- /** Sets the element that the menu-surface is anchored to. */
2335
- MDCMenuSurface.prototype.setMenuSurfaceAnchorElement = function (element) {
2336
- this.anchorElement = element;
2337
- };
2338
- /** Sets the menu-surface to position: fixed. */
2339
- MDCMenuSurface.prototype.setFixedPosition = function (isFixed) {
2340
- if (isFixed) {
2341
- this.root.classList.add(cssClasses$1.FIXED);
2342
- }
2343
- else {
2344
- this.root.classList.remove(cssClasses$1.FIXED);
2345
- }
2346
- this.foundation.setFixedPosition(isFixed);
2347
- };
2348
- /** Sets the absolute x/y position to position based on. Requires the menu to be hoisted. */
2349
- MDCMenuSurface.prototype.setAbsolutePosition = function (x, y) {
2350
- this.foundation.setAbsolutePosition(x, y);
2351
- this.setIsHoisted(true);
2352
- };
2353
- /**
2354
- * @param corner Default anchor corner alignment of top-left surface corner.
2355
- */
2356
- MDCMenuSurface.prototype.setAnchorCorner = function (corner) {
2357
- this.foundation.setAnchorCorner(corner);
2358
- };
2359
- MDCMenuSurface.prototype.setAnchorMargin = function (margin) {
2360
- this.foundation.setAnchorMargin(margin);
2361
- };
2362
- MDCMenuSurface.prototype.getDefaultFoundation = function () {
2363
- var _this = this;
2364
- // DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
2365
- // To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
2366
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
2367
- var adapter = {
2368
- addClass: function (className) { return _this.root.classList.add(className); },
2369
- removeClass: function (className) { return _this.root.classList.remove(className); },
2370
- hasClass: function (className) { return _this.root.classList.contains(className); },
2371
- hasAnchor: function () { return !!_this.anchorElement; },
2372
- notifyClose: function () {
2373
- return _this.emit(MDCMenuSurfaceFoundation.strings.CLOSED_EVENT, {});
2374
- },
2375
- notifyClosing: function () {
2376
- _this.emit(MDCMenuSurfaceFoundation.strings.CLOSING_EVENT, {});
2377
- },
2378
- notifyOpen: function () {
2379
- return _this.emit(MDCMenuSurfaceFoundation.strings.OPENED_EVENT, {});
2380
- },
2381
- isElementInContainer: function (el) { return _this.root.contains(el); },
2382
- isRtl: function () {
2383
- return getComputedStyle(_this.root).getPropertyValue('direction') === 'rtl';
2384
- },
2385
- setTransformOrigin: function (origin) {
2386
- var propertyName = getCorrectPropertyName(window, 'transform') + "-origin";
2387
- _this.root.style.setProperty(propertyName, origin);
2388
- },
2389
- isFocused: function () { return document.activeElement === _this.root; },
2390
- saveFocus: function () {
2391
- _this.previousFocus =
2392
- document.activeElement;
2393
- },
2394
- restoreFocus: function () {
2395
- if (_this.root.contains(document.activeElement)) {
2396
- if (_this.previousFocus && _this.previousFocus.focus) {
2397
- _this.previousFocus.focus();
2398
- }
2399
- }
2400
- },
2401
- getInnerDimensions: function () {
2402
- return {
2403
- width: _this.root.offsetWidth,
2404
- height: _this.root.offsetHeight
2405
- };
2406
- },
2407
- getAnchorDimensions: function () { return _this.anchorElement ?
2408
- _this.anchorElement.getBoundingClientRect() :
2409
- null; },
2410
- getWindowDimensions: function () {
2411
- return { width: window.innerWidth, height: window.innerHeight };
2412
- },
2413
- getBodyDimensions: function () {
2414
- return { width: document.body.clientWidth, height: document.body.clientHeight };
2415
- },
2416
- getWindowScroll: function () {
2417
- return { x: window.pageXOffset, y: window.pageYOffset };
2418
- },
2419
- setPosition: function (position) {
2420
- var rootHTML = _this.root;
2421
- rootHTML.style.left = 'left' in position ? position.left + "px" : '';
2422
- rootHTML.style.right = 'right' in position ? position.right + "px" : '';
2423
- rootHTML.style.top = 'top' in position ? position.top + "px" : '';
2424
- rootHTML.style.bottom =
2425
- 'bottom' in position ? position.bottom + "px" : '';
2426
- },
2427
- setMaxHeight: function (height) {
2428
- _this.root.style.maxHeight = height;
2429
- },
2430
- };
2431
- // tslint:enable:object-literal-sort-keys
2432
- return new MDCMenuSurfaceFoundation(adapter);
2433
- };
2434
- return MDCMenuSurface;
2435
- }(MDCComponent));
2436
-
2437
- export { Corner as C, MDCMenuSurfaceFoundation as M, MDCListFoundation as a, MDCMenuSurface as b, cssClasses as c, MDCList as d, numbers as n, strings as s };
2438
-
2439
- //# sourceMappingURL=component-5e233629.js.map