@ptcwebops/ptcw-design 6.4.18 → 6.4.19

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 (422) hide show
  1. package/dist/cjs/academic-form-test_10.cjs.entry.js +12557 -0
  2. package/dist/cjs/buying-option-cards-slider.cjs.entry.js +4 -0
  3. package/dist/cjs/event-podcast-slider-example.cjs.entry.js +1 -1
  4. package/dist/cjs/featured-events-slider-example.cjs.entry.js +1 -1
  5. package/dist/cjs/homepage-jumbotron.cjs.entry.js +1 -1
  6. package/dist/cjs/icon-asset.cjs.entry.js +65 -0
  7. package/dist/cjs/interfaces-574e6df7.js +15 -0
  8. package/dist/cjs/list-item.cjs.entry.js +52 -0
  9. package/dist/cjs/loader.cjs.js +1 -1
  10. package/dist/cjs/ptc-background-video.cjs.entry.js +152 -0
  11. package/dist/cjs/ptc-breadcrumb.cjs.entry.js +63 -0
  12. package/dist/cjs/ptc-case-studies-slider.cjs.entry.js +1 -1
  13. package/dist/cjs/ptc-icon-card-slider-example.cjs.entry.js +1 -1
  14. package/dist/cjs/ptc-icon-component.cjs.entry.js +1 -1
  15. package/dist/cjs/ptc-img.cjs.entry.js +136 -0
  16. package/dist/cjs/ptc-jumbotron.cjs.entry.js +184 -0
  17. package/dist/cjs/ptc-multi-select.cjs.entry.js +326 -0
  18. package/dist/cjs/ptc-picture.cjs.entry.js +185 -0
  19. package/dist/cjs/ptc-subnav-v2.cjs.entry.js +595 -0
  20. package/dist/cjs/ptc-tooltip.cjs.entry.js +113 -0
  21. package/dist/cjs/ptcw-design.cjs.js +1 -1
  22. package/dist/cjs/storefront-enhanced-product-list-alt-example.cjs.entry.js +1 -1
  23. package/dist/cjs/storefront-enhanced-product-list-example.cjs.entry.js +1 -1
  24. package/dist/collection/components/buying-option-cards-slider/buying-option-cards-slider.js +4 -0
  25. package/dist/collection/components/organism-bundles/event-podcast-slider-example/event-podcast-slider-example.css +16 -11
  26. package/dist/collection/components/organism-bundles/featured-events-slider-example/featured-events-slider-example.css +16 -11
  27. package/dist/collection/components/organism-bundles/homepage-jumbotron/homepage-jumbotron.css +16 -11
  28. package/dist/collection/components/organism-bundles/ptc-icon-card-slider-example/ptc-icon-card-slider-example.css +16 -11
  29. package/dist/collection/components/organism-bundles/storefront-enhanced-product-list-example/storefront-enhanced-product-list-example.css +16 -11
  30. package/dist/collection/components/ptc-case-studies-slider/ptc-case-studies-slider.css +16 -11
  31. package/dist/collection/components/ptc-icon-component/ptc-icon-component.css +16 -11
  32. package/dist/collection/components/ptc-seo-title/ptc-seo-title.js +3 -3
  33. package/dist/custom-elements/index.js +11 -7
  34. package/dist/esm/academic-form-test_10.entry.js +12544 -0
  35. package/dist/esm/author-listing-example.entry.js +1 -1
  36. package/dist/esm/blog-detail-content_2.entry.js +2 -2
  37. package/dist/esm/blog-detail-layout.entry.js +2 -2
  38. package/dist/esm/blogs-search-section.entry.js +2 -2
  39. package/dist/esm/bundle-example.entry.js +1 -1
  40. package/dist/esm/bundle-jumbotron-example.entry.js +1 -1
  41. package/dist/esm/buying-option-card.entry.js +1 -1
  42. package/dist/esm/buying-option-cards-slider.entry.js +5 -1
  43. package/dist/esm/dropdown-item.entry.js +1 -1
  44. package/dist/esm/dynamic-box-bundle.entry.js +1 -1
  45. package/dist/esm/embedded-form.entry.js +1 -1
  46. package/dist/esm/event-jumbotron-example.entry.js +1 -1
  47. package/dist/esm/event-podcast-slider-example.entry.js +2 -2
  48. package/dist/esm/featured-events-slider-example.entry.js +2 -2
  49. package/dist/esm/featured-list.entry.js +1 -1
  50. package/dist/esm/fl-tab-content_3.entry.js +1 -1
  51. package/dist/esm/footer-form.entry.js +1 -1
  52. package/dist/esm/homepage-clickable-tab.entry.js +1 -1
  53. package/dist/esm/homepage-jumbotron.entry.js +3 -3
  54. package/dist/esm/homepage-toggled-content.entry.js +2 -2
  55. package/dist/esm/icon-asset.entry.js +61 -0
  56. package/dist/esm/{index-0bf594c4.js → index-c83db688.js} +1 -1
  57. package/dist/esm/innovator-toggle-container.entry.js +2 -2
  58. package/dist/esm/interfaces-4caedd26.js +12 -0
  59. package/dist/esm/jumbotron-sub-menu.entry.js +1 -1
  60. package/dist/esm/jumbotron-sub-mune.entry.js +1 -1
  61. package/dist/esm/list-item.entry.js +48 -0
  62. package/dist/esm/loader.js +3 -3
  63. package/dist/esm/most-popular-news.entry.js +2 -2
  64. package/dist/esm/my-component.entry.js +2 -2
  65. package/dist/esm/news-search-result.entry.js +1 -1
  66. package/dist/esm/ptc-accordion-item.entry.js +2 -2
  67. package/dist/esm/ptc-accordion.entry.js +1 -1
  68. package/dist/esm/ptc-announcement.entry.js +1 -1
  69. package/dist/esm/ptc-back-to-top.entry.js +1 -1
  70. package/dist/esm/ptc-background-video.entry.js +148 -0
  71. package/dist/esm/ptc-badge.entry.js +1 -1
  72. package/dist/esm/ptc-bio-card.entry.js +1 -1
  73. package/dist/esm/ptc-blue-pill-announcement-bar.entry.js +1 -1
  74. package/dist/esm/ptc-breadcrumb.entry.js +59 -0
  75. package/dist/esm/ptc-brightcov-video.entry.js +1 -1
  76. package/dist/esm/ptc-card-bottom_2.entry.js +1 -1
  77. package/dist/esm/ptc-card-content.entry.js +1 -1
  78. package/dist/esm/ptc-card_2.entry.js +1 -1
  79. package/dist/esm/ptc-case-studies-slider.entry.js +2 -2
  80. package/dist/esm/ptc-checkbox-group.entry.js +1 -1
  81. package/dist/esm/ptc-checkbox.entry.js +1 -1
  82. package/dist/esm/ptc-close-icon_2.entry.js +1 -1
  83. package/dist/esm/ptc-collapse-list.entry.js +2 -2
  84. package/dist/esm/ptc-container.entry.js +1 -1
  85. package/dist/esm/ptc-countdown.entry.js +1 -1
  86. package/dist/esm/ptc-date.entry.js +1 -1
  87. package/dist/esm/ptc-dropdown.entry.js +1 -1
  88. package/dist/esm/ptc-dynamic-card.entry.js +1 -1
  89. package/dist/esm/ptc-ellipsis-dropdown.entry.js +1 -1
  90. package/dist/esm/ptc-embedded-quiz.entry.js +1 -1
  91. package/dist/esm/ptc-enhanced-product-listing-card.entry.js +1 -1
  92. package/dist/esm/ptc-featured-list.entry.js +1 -1
  93. package/dist/esm/ptc-filter-dropdown_4.entry.js +1 -1
  94. package/dist/esm/ptc-filter-level-theater.entry.js +1 -1
  95. package/dist/esm/ptc-filter-tag_2.entry.js +1 -1
  96. package/dist/esm/ptc-footer.entry.js +1 -1
  97. package/dist/esm/ptc-form-radio-button.entry.js +1 -1
  98. package/dist/esm/ptc-form-radio-group.entry.js +1 -1
  99. package/dist/esm/ptc-form.entry.js +1 -1
  100. package/dist/esm/ptc-hero-footer-cta.entry.js +1 -1
  101. package/dist/esm/ptc-hero.entry.js +1 -1
  102. package/dist/esm/ptc-homepage-image-feature.entry.js +2 -2
  103. package/dist/esm/ptc-homepage-video-background.entry.js +2 -2
  104. package/dist/esm/ptc-icon-card-slider-example.entry.js +2 -2
  105. package/dist/esm/ptc-icon-card.entry.js +2 -2
  106. package/dist/esm/ptc-icon-component.entry.js +2 -2
  107. package/dist/esm/ptc-icon-list.entry.js +1 -1
  108. package/dist/esm/ptc-icon-minimize.entry.js +1 -1
  109. package/dist/esm/ptc-image-download-strip.entry.js +1 -1
  110. package/dist/esm/ptc-img.entry.js +132 -0
  111. package/dist/esm/ptc-info-tile.entry.js +1 -1
  112. package/dist/esm/ptc-inline-cta.entry.js +1 -1
  113. package/dist/esm/ptc-jumbotron.entry.js +180 -0
  114. package/dist/esm/ptc-link.entry.js +2 -2
  115. package/dist/esm/ptc-list.entry.js +1 -1
  116. package/dist/esm/ptc-media-card.entry.js +2 -2
  117. package/dist/esm/ptc-minimized-nav.entry.js +1 -1
  118. package/dist/esm/ptc-mobile-select.entry.js +1 -1
  119. package/dist/esm/ptc-modal-quiz.entry.js +1 -1
  120. package/dist/esm/ptc-multi-select.entry.js +322 -0
  121. package/dist/esm/ptc-nav-card.entry.js +1 -1
  122. package/dist/esm/ptc-nav-link.entry.js +1 -1
  123. package/dist/esm/ptc-nav-pills.entry.js +1 -1
  124. package/dist/esm/ptc-nav-skip-to-content.entry.js +1 -1
  125. package/dist/esm/ptc-nav-slider.entry.js +1 -1
  126. package/dist/esm/ptc-nav-submenu.entry.js +1 -1
  127. package/dist/esm/ptc-nav-tile.entry.js +1 -1
  128. package/dist/esm/ptc-news.entry.js +1 -1
  129. package/dist/esm/ptc-office-location-card.entry.js +1 -1
  130. package/dist/esm/ptc-office-locations.entry.js +1 -1
  131. package/dist/esm/ptc-overlay.entry.js +1 -1
  132. package/dist/esm/ptc-picture.entry.js +181 -0
  133. package/dist/esm/ptc-podcast-card.entry.js +1 -1
  134. package/dist/esm/ptc-preferance-center-form.entry.js +1 -1
  135. package/dist/esm/ptc-preloader.entry.js +1 -1
  136. package/dist/esm/ptc-previous-url.entry.js +1 -1
  137. package/dist/esm/ptc-pricing-add-on-card.entry.js +1 -1
  138. package/dist/esm/ptc-pricing-add-on-section.entry.js +1 -1
  139. package/dist/esm/ptc-pricing-block.entry.js +1 -1
  140. package/dist/esm/ptc-pricing-packaging-table.entry.js +2 -2
  141. package/dist/esm/ptc-pricing-tabs.entry.js +2 -2
  142. package/dist/esm/ptc-product-card.entry.js +1 -1
  143. package/dist/esm/ptc-product-category.entry.js +1 -1
  144. package/dist/esm/ptc-product-dropdown.entry.js +1 -1
  145. package/dist/esm/ptc-product-highlight-card.entry.js +1 -1
  146. package/dist/esm/ptc-product-list.entry.js +1 -1
  147. package/dist/esm/ptc-product-sidebar.entry.js +1 -1
  148. package/dist/esm/ptc-progress-bar.entry.js +1 -1
  149. package/dist/esm/ptc-quantity-counter.entry.js +1 -1
  150. package/dist/esm/ptc-quote.entry.js +1 -1
  151. package/dist/esm/ptc-readmore-char.entry.js +1 -1
  152. package/dist/esm/ptc-readmore-new.entry.js +1 -1
  153. package/dist/esm/ptc-readmore-v3.entry.js +1 -1
  154. package/dist/esm/ptc-readmore.entry.js +1 -1
  155. package/dist/esm/ptc-related-card-rail.entry.js +1 -1
  156. package/dist/esm/ptc-responsive-wrapper.entry.js +1 -1
  157. package/dist/esm/ptc-scroll-button.entry.js +1 -1
  158. package/dist/esm/ptc-search-field.entry.js +1 -1
  159. package/dist/esm/ptc-seo-title.entry.js +1 -1
  160. package/dist/esm/ptc-shopping-cart.entry.js +1 -1
  161. package/dist/esm/ptc-showcase-card.entry.js +1 -1
  162. package/dist/esm/ptc-skeleton.entry.js +1 -1
  163. package/dist/esm/ptc-slit-card.entry.js +1 -1
  164. package/dist/esm/ptc-social-icons-footer.entry.js +2 -2
  165. package/dist/esm/ptc-social-icons.entry.js +1 -1
  166. package/dist/esm/ptc-span.entry.js +1 -1
  167. package/dist/esm/ptc-square-card.entry.js +1 -1
  168. package/dist/esm/ptc-sticky-icons.entry.js +1 -1
  169. package/dist/esm/ptc-sticky-section.entry.js +1 -1
  170. package/dist/esm/ptc-sticky-title.entry.js +1 -1
  171. package/dist/esm/ptc-store-card-list.entry.js +1 -1
  172. package/dist/esm/ptc-store-card.entry.js +1 -1
  173. package/dist/esm/ptc-subnav-card.entry.js +1 -1
  174. package/dist/esm/ptc-subnav-v2.entry.js +591 -0
  175. package/dist/esm/ptc-subnav.entry.js +1 -1
  176. package/dist/esm/ptc-svg-btn.entry.js +1 -1
  177. package/dist/esm/ptc-tab-list.entry.js +1 -1
  178. package/dist/esm/ptc-tab.entry.js +1 -1
  179. package/dist/esm/ptc-tabs.entry.js +1 -1
  180. package/dist/esm/ptc-text-copy-with-background.entry.js +1 -1
  181. package/dist/esm/ptc-theater-video-modal.entry.js +1 -1
  182. package/dist/esm/ptc-tooltip-v2.entry.js +1 -1
  183. package/dist/esm/ptc-tooltip-v3.entry.js +1 -1
  184. package/dist/esm/ptc-tooltip.entry.js +109 -0
  185. package/dist/esm/ptc-two-column-media.entry.js +1 -1
  186. package/dist/esm/ptc-value-led-card.entry.js +1 -1
  187. package/dist/esm/ptc-value-led-content-highlight.entry.js +1 -1
  188. package/dist/esm/ptc-value-led-content.entry.js +1 -1
  189. package/dist/esm/ptc-value-led-intro.entry.js +1 -1
  190. package/dist/esm/ptc-value-led-layout.entry.js +1 -1
  191. package/dist/esm/ptc-value-led-speed-bump.entry.js +1 -1
  192. package/dist/esm/ptc-value-prop-card.entry.js +1 -1
  193. package/dist/esm/ptc-video-embed.entry.js +1 -1
  194. package/dist/esm/ptc-white-paper.entry.js +1 -1
  195. package/dist/esm/ptcw-design.js +3 -3
  196. package/dist/esm/sequential-bundle-example.entry.js +1 -1
  197. package/dist/esm/sequential-bundle.entry.js +1 -1
  198. package/dist/esm/storefront-enhanced-product-list-alt-example.entry.js +2 -2
  199. package/dist/esm/storefront-enhanced-product-list-example.entry.js +2 -2
  200. package/dist/esm/tab-content.entry.js +1 -1
  201. package/dist/esm/tab-header.entry.js +1 -1
  202. package/dist/esm/{utils-a64ba942.js → utils-d14265f5.js} +1 -1
  203. package/dist/ptcw-design/{p-ad4f4f33.entry.js → p-00e21489.entry.js} +1 -1
  204. package/dist/ptcw-design/{p-17890eea.entry.js → p-04223295.entry.js} +1 -1
  205. package/dist/ptcw-design/{p-74a845fd.entry.js → p-04aae3f5.entry.js} +1 -1
  206. package/dist/ptcw-design/{p-c9a73ad1.entry.js → p-04f0b1ba.entry.js} +1 -1
  207. package/dist/ptcw-design/p-08f607e5.entry.js +1 -0
  208. package/dist/ptcw-design/p-0a86d91a.entry.js +1 -0
  209. package/dist/ptcw-design/{p-e8b51e7d.entry.js → p-0a9ee6c2.entry.js} +1 -1
  210. package/dist/ptcw-design/p-0b146b4b.entry.js +1 -0
  211. package/dist/ptcw-design/{p-c80265d9.entry.js → p-0c914932.entry.js} +1 -1
  212. package/dist/ptcw-design/{p-f004e5de.entry.js → p-0ddf2a09.entry.js} +1 -1
  213. package/dist/ptcw-design/{p-f9e57052.entry.js → p-136c990d.entry.js} +1 -1
  214. package/dist/ptcw-design/{p-36d6e662.entry.js → p-13e338a5.entry.js} +1 -1
  215. package/dist/ptcw-design/{p-8cdcfb51.entry.js → p-15e36f30.entry.js} +1 -1
  216. package/dist/ptcw-design/{p-f418ef26.entry.js → p-18d699f0.entry.js} +1 -1
  217. package/dist/ptcw-design/p-1a853854.entry.js +1 -0
  218. package/dist/ptcw-design/{p-908ad455.entry.js → p-1c63c812.entry.js} +1 -1
  219. package/dist/ptcw-design/{p-8482f517.entry.js → p-1cb02c28.entry.js} +1 -1
  220. package/dist/ptcw-design/{p-9a07b9e3.entry.js → p-1e1ed5df.entry.js} +1 -1
  221. package/dist/ptcw-design/{p-752159e2.entry.js → p-1f356fcf.entry.js} +1 -1
  222. package/dist/ptcw-design/{p-2fd01953.entry.js → p-21fa5abe.entry.js} +1 -1
  223. package/dist/ptcw-design/{p-c9762c88.entry.js → p-23cb5b5b.entry.js} +1 -1
  224. package/dist/ptcw-design/p-243075b7.entry.js +1 -0
  225. package/dist/ptcw-design/{p-a22d7ae8.entry.js → p-257a68df.entry.js} +1 -1
  226. package/dist/ptcw-design/p-264cd2d3.entry.js +1 -0
  227. package/dist/ptcw-design/p-27e39236.entry.js +1 -0
  228. package/dist/ptcw-design/{p-14c77b5e.entry.js → p-27e47c25.entry.js} +1 -1
  229. package/dist/ptcw-design/{p-f20e4230.entry.js → p-2a22123e.entry.js} +1 -1
  230. package/dist/ptcw-design/{p-f4ae5a99.entry.js → p-2b08a37d.entry.js} +1 -1
  231. package/dist/ptcw-design/{p-315b7885.entry.js → p-2c287230.entry.js} +1 -1
  232. package/dist/ptcw-design/{p-54891548.entry.js → p-2c2f895a.entry.js} +1 -1
  233. package/dist/ptcw-design/p-37f92bb4.entry.js +1 -0
  234. package/dist/ptcw-design/{p-a2710bbf.entry.js → p-3872fce7.entry.js} +1 -1
  235. package/dist/ptcw-design/{p-9050ab76.entry.js → p-3a034cd1.entry.js} +1 -1
  236. package/dist/ptcw-design/p-3a24991d.entry.js +1 -0
  237. package/dist/ptcw-design/p-3ddb6c50.entry.js +1 -0
  238. package/dist/ptcw-design/{p-3c941935.entry.js → p-3e4861a2.entry.js} +1 -1
  239. package/dist/ptcw-design/p-3eccbe24.entry.js +1 -0
  240. package/dist/ptcw-design/p-3ed4a7ed.entry.js +1 -0
  241. package/dist/ptcw-design/{p-3596ce5a.entry.js → p-44eac15a.entry.js} +1 -1
  242. package/dist/ptcw-design/{p-83632220.entry.js → p-45623f8a.entry.js} +1 -1
  243. package/dist/ptcw-design/{p-1e9f25fc.entry.js → p-46f67bec.entry.js} +1 -1
  244. package/dist/ptcw-design/p-4ab3249d.entry.js +1 -0
  245. package/dist/ptcw-design/{p-e2da8109.entry.js → p-4c2ffab9.entry.js} +1 -1
  246. package/dist/ptcw-design/{p-efe8563a.entry.js → p-4d14b3b7.entry.js} +1 -1
  247. package/dist/ptcw-design/{p-a1dc7ae5.entry.js → p-4f3dea53.entry.js} +1 -1
  248. package/dist/ptcw-design/{p-ed5a467e.entry.js → p-4f4f97a6.entry.js} +1 -1
  249. package/dist/ptcw-design/{p-91e5c8d4.entry.js → p-506dac1f.entry.js} +1 -1
  250. package/dist/ptcw-design/{p-9e8e2835.entry.js → p-523141fd.entry.js} +1 -1
  251. package/dist/ptcw-design/{p-bca81995.entry.js → p-560b05a5.entry.js} +1 -1
  252. package/dist/ptcw-design/p-567535fb.entry.js +1 -0
  253. package/dist/ptcw-design/{p-a31f22a1.entry.js → p-571d9690.entry.js} +1 -1
  254. package/dist/ptcw-design/{p-c8de7309.entry.js → p-575861b3.entry.js} +1 -1
  255. package/dist/ptcw-design/{p-ec395ae9.entry.js → p-5877f093.entry.js} +1 -1
  256. package/dist/ptcw-design/{p-07b46e6e.entry.js → p-58909b95.entry.js} +1 -1
  257. package/dist/ptcw-design/{p-cab0274c.entry.js → p-5946d7c9.entry.js} +1 -1
  258. package/dist/ptcw-design/{p-807ad5c4.entry.js → p-5980d65d.entry.js} +1 -1
  259. package/dist/ptcw-design/{p-7c6d6a5e.entry.js → p-5dd538c4.entry.js} +1 -1
  260. package/dist/ptcw-design/p-5e4c1edf.entry.js +1 -0
  261. package/dist/ptcw-design/{p-5fb671ee.entry.js → p-61d28206.entry.js} +1 -1
  262. package/dist/ptcw-design/{p-9220308d.entry.js → p-62c56201.entry.js} +1 -1
  263. package/dist/ptcw-design/p-62dcdd28.entry.js +1 -0
  264. package/dist/ptcw-design/{p-3e13f29c.entry.js → p-66ecd7b9.entry.js} +1 -1
  265. package/dist/ptcw-design/p-6a561487.entry.js +1 -0
  266. package/dist/ptcw-design/{p-575c7fc0.entry.js → p-6aa9ed95.entry.js} +1 -1
  267. package/dist/ptcw-design/p-6abc061b.entry.js +1 -0
  268. package/dist/ptcw-design/{p-32a1c28b.entry.js → p-6d27b5a2.entry.js} +1 -1
  269. package/dist/ptcw-design/p-711bcdad.js +1 -0
  270. package/dist/ptcw-design/{p-c9c55caf.entry.js → p-73fd95da.entry.js} +1 -1
  271. package/dist/ptcw-design/{p-522cb451.entry.js → p-757954b2.entry.js} +1 -1
  272. package/dist/ptcw-design/p-761a31f8.entry.js +1 -0
  273. package/dist/ptcw-design/{p-3e13b735.entry.js → p-76d98c5a.entry.js} +1 -1
  274. package/dist/ptcw-design/{p-2fdd81d4.entry.js → p-7714bbaf.entry.js} +1 -1
  275. package/dist/ptcw-design/{p-af32c90a.entry.js → p-784cae5c.entry.js} +1 -1
  276. package/dist/ptcw-design/{p-ecfc8211.entry.js → p-7a1db471.entry.js} +1 -1
  277. package/dist/ptcw-design/{p-183ba1ca.entry.js → p-7d29a418.entry.js} +1 -1
  278. package/dist/ptcw-design/p-7da19c78.entry.js +1 -0
  279. package/dist/ptcw-design/{p-2fa5814b.entry.js → p-7f4919b7.entry.js} +1 -1
  280. package/dist/ptcw-design/p-80c69354.entry.js +1 -0
  281. package/dist/ptcw-design/{p-a974f98f.entry.js → p-8191928d.entry.js} +1 -1
  282. package/dist/ptcw-design/{p-c1302aea.entry.js → p-8340bed4.entry.js} +1 -1
  283. package/dist/ptcw-design/{p-ff369ed7.entry.js → p-84c15835.entry.js} +1 -1
  284. package/dist/ptcw-design/{p-3c52fabe.entry.js → p-8533988f.entry.js} +1 -1
  285. package/dist/ptcw-design/{p-1ab6201b.entry.js → p-85f32bf5.entry.js} +1 -1
  286. package/dist/ptcw-design/{p-ce39cff2.entry.js → p-88d1894d.entry.js} +1 -1
  287. package/dist/ptcw-design/{p-bf2f9183.entry.js → p-89ba3dfd.entry.js} +1 -1
  288. package/dist/ptcw-design/{p-e2e357e7.entry.js → p-8d4572f7.entry.js} +1 -1
  289. package/dist/ptcw-design/{p-cf0f6559.entry.js → p-927373d4.entry.js} +1 -1
  290. package/dist/ptcw-design/{p-e1bd2c43.entry.js → p-92e76318.entry.js} +1 -1
  291. package/dist/ptcw-design/{p-80c56c81.entry.js → p-931650bb.entry.js} +1 -1
  292. package/dist/ptcw-design/{p-2ba77e9d.entry.js → p-9354b7fd.entry.js} +1 -1
  293. package/dist/ptcw-design/{p-3b481342.entry.js → p-9493dfa0.entry.js} +1 -1
  294. package/dist/ptcw-design/p-97eb1025.entry.js +1 -0
  295. package/dist/ptcw-design/{p-ce125ef2.entry.js → p-98610430.entry.js} +1 -1
  296. package/dist/ptcw-design/p-99daf693.entry.js +1 -0
  297. package/dist/ptcw-design/{p-8eb36507.entry.js → p-9a335b5b.entry.js} +1 -1
  298. package/dist/ptcw-design/{p-0abb6e77.entry.js → p-9ac99185.entry.js} +1 -1
  299. package/dist/ptcw-design/{p-290012e3.entry.js → p-9b26ea67.entry.js} +1 -1
  300. package/dist/ptcw-design/{p-6d628113.entry.js → p-9de963f8.entry.js} +1 -1
  301. package/dist/ptcw-design/{p-6251a6d6.entry.js → p-9e4e21a4.entry.js} +1 -1
  302. package/dist/ptcw-design/p-9efa8199.entry.js +1 -0
  303. package/dist/ptcw-design/{p-5877ab67.entry.js → p-9fc6a83d.entry.js} +1 -1
  304. package/dist/ptcw-design/{p-afb5bdb9.entry.js → p-a04bedc2.entry.js} +1 -1
  305. package/dist/ptcw-design/{p-dadbab48.entry.js → p-a0bf3dd2.entry.js} +1 -1
  306. package/dist/ptcw-design/p-a264f646.entry.js +1 -0
  307. package/dist/ptcw-design/{p-e2e33ddb.entry.js → p-a37c5209.entry.js} +1 -1
  308. package/dist/ptcw-design/{p-b6cc4c2a.entry.js → p-a41c7e39.entry.js} +1 -1
  309. package/dist/ptcw-design/{p-dabb1b70.entry.js → p-a54c6da5.entry.js} +1 -1
  310. package/dist/ptcw-design/{p-6f29592a.entry.js → p-a5efeb04.entry.js} +1 -1
  311. package/dist/ptcw-design/{p-991465fb.entry.js → p-a79f33df.entry.js} +1 -1
  312. package/dist/ptcw-design/{p-7123abad.entry.js → p-a7a41de8.entry.js} +1 -1
  313. package/dist/ptcw-design/{p-be00fb74.entry.js → p-a7cb3851.entry.js} +1 -1
  314. package/dist/ptcw-design/{p-ed53cb3a.entry.js → p-a8304a3e.entry.js} +1 -1
  315. package/dist/ptcw-design/{p-de663192.entry.js → p-a8504f11.entry.js} +1 -1
  316. package/dist/ptcw-design/{p-11e86045.entry.js → p-a9533f9c.entry.js} +1 -1
  317. package/dist/ptcw-design/{p-e50a5a46.entry.js → p-a993c0a6.entry.js} +1 -1
  318. package/dist/ptcw-design/{p-c5417010.entry.js → p-aac082cf.entry.js} +1 -1
  319. package/dist/ptcw-design/{p-87f07d6b.entry.js → p-aadf9416.entry.js} +1 -1
  320. package/dist/ptcw-design/{p-6f1cc5e5.entry.js → p-ab4906a7.entry.js} +1 -1
  321. package/dist/ptcw-design/{p-944c5be8.js → p-ac75c7ad.js} +1 -1
  322. package/dist/ptcw-design/p-ac766cb3.entry.js +1 -0
  323. package/dist/ptcw-design/{p-e249cd90.entry.js → p-ac7b2779.entry.js} +1 -1
  324. package/dist/ptcw-design/{p-b293a0b1.entry.js → p-aea09a70.entry.js} +1 -1
  325. package/dist/ptcw-design/p-af9912b6.entry.js +1 -0
  326. package/dist/ptcw-design/p-afc1e1e9.entry.js +1 -0
  327. package/dist/ptcw-design/{p-b82dd7f9.entry.js → p-b19cda95.entry.js} +1 -1
  328. package/dist/ptcw-design/{p-79762cf6.entry.js → p-b436f56d.entry.js} +1 -1
  329. package/dist/ptcw-design/{p-ca039722.entry.js → p-baeee2b4.entry.js} +1 -1
  330. package/dist/ptcw-design/p-bb9a879f.entry.js +1 -0
  331. package/dist/ptcw-design/{p-73293d32.entry.js → p-bf84ecc0.entry.js} +1 -1
  332. package/dist/ptcw-design/{p-9a28ded2.entry.js → p-bfacfe67.entry.js} +1 -1
  333. package/dist/ptcw-design/{p-fb0c3eeb.entry.js → p-c061b32d.entry.js} +1 -1
  334. package/dist/ptcw-design/{p-5344a1f4.entry.js → p-c4674bc8.entry.js} +1 -1
  335. package/dist/ptcw-design/{p-dd38bf84.entry.js → p-c5f42895.entry.js} +1 -1
  336. package/dist/ptcw-design/{p-61a5012d.entry.js → p-c631608f.entry.js} +1 -1
  337. package/dist/ptcw-design/{p-e87a4ff8.entry.js → p-c68d31c6.entry.js} +1 -1
  338. package/dist/ptcw-design/{p-43756439.entry.js → p-c6a0dd99.entry.js} +1 -1
  339. package/dist/ptcw-design/p-c89030e4.entry.js +1 -0
  340. package/dist/ptcw-design/p-cbbe2bba.entry.js +1 -0
  341. package/dist/ptcw-design/{p-384548ef.entry.js → p-cc652ebe.entry.js} +1 -1
  342. package/dist/ptcw-design/{p-fa045097.entry.js → p-cc92b9ed.entry.js} +1 -1
  343. package/dist/ptcw-design/p-d6ee094b.entry.js +1 -0
  344. package/dist/ptcw-design/{p-75d8b6ec.entry.js → p-d74ccb19.entry.js} +1 -1
  345. package/dist/ptcw-design/{p-81736d6a.entry.js → p-d77531c8.entry.js} +1 -1
  346. package/dist/ptcw-design/p-d8575311.entry.js +1 -0
  347. package/dist/ptcw-design/{p-f5665cfe.entry.js → p-d8b2466d.entry.js} +1 -1
  348. package/dist/ptcw-design/{p-e880b556.entry.js → p-db0fc94d.entry.js} +1 -1
  349. package/dist/ptcw-design/p-e01173ca.entry.js +1 -0
  350. package/dist/ptcw-design/{p-7524411a.entry.js → p-e0d95058.entry.js} +1 -1
  351. package/dist/ptcw-design/p-e0e87d61.entry.js +1 -0
  352. package/dist/ptcw-design/{p-0bb3ea9a.entry.js → p-e235bf27.entry.js} +1 -1
  353. package/dist/ptcw-design/{p-53d2547b.entry.js → p-e3867512.entry.js} +1 -1
  354. package/dist/ptcw-design/{p-d1f57070.entry.js → p-e3bf092e.entry.js} +1 -1
  355. package/dist/ptcw-design/p-e4fe0995.entry.js +1 -0
  356. package/dist/ptcw-design/p-e7220c36.entry.js +1 -0
  357. package/dist/ptcw-design/{p-b1053240.entry.js → p-e73a1a0b.entry.js} +1 -1
  358. package/dist/ptcw-design/{p-b9966f20.entry.js → p-e9684da3.entry.js} +1 -1
  359. package/dist/ptcw-design/p-eb193fd7.entry.js +404 -0
  360. package/dist/ptcw-design/{p-fe56e336.entry.js → p-ee91170c.entry.js} +1 -1
  361. package/dist/ptcw-design/{p-681d26ef.entry.js → p-eeaa2123.entry.js} +1 -1
  362. package/dist/ptcw-design/{p-f2006b03.entry.js → p-f5c97ab2.entry.js} +1 -1
  363. package/dist/ptcw-design/{p-d6271974.entry.js → p-f5d8a3b1.entry.js} +1 -1
  364. package/dist/ptcw-design/{p-fab2fc8d.entry.js → p-fb835c5a.entry.js} +1 -1
  365. package/dist/ptcw-design/{p-0ed4609e.entry.js → p-fb8584e4.entry.js} +1 -1
  366. package/dist/ptcw-design/{p-973c69d8.entry.js → p-fbd9c8fc.entry.js} +1 -1
  367. package/dist/ptcw-design/p-fd7e5935.entry.js +1 -0
  368. package/dist/ptcw-design/{p-e6ebc832.entry.js → p-fdee2cdc.entry.js} +1 -1
  369. package/dist/ptcw-design/{p-22cf00e7.js → p-fe497e4a.js} +1 -1
  370. package/dist/ptcw-design/ptcw-design.esm.js +1 -1
  371. package/dist/types/components.d.ts +62 -62
  372. package/package.json +1 -1
  373. package/readme.md +1 -1
  374. package/dist/cjs/academic-form-test.cjs.entry.js +0 -82
  375. package/dist/cjs/component-06dda623.js +0 -4665
  376. package/dist/cjs/component-5b5b6a98.js +0 -1819
  377. package/dist/cjs/icon-asset_14.cjs.entry.js +0 -1982
  378. package/dist/cjs/ptc-data-lookup.cjs.entry.js +0 -675
  379. package/dist/cjs/ptc-form-checkbox_2.cjs.entry.js +0 -4476
  380. package/dist/cjs/ptc-multi-select_2.cjs.entry.js +0 -730
  381. package/dist/esm/academic-form-test.entry.js +0 -78
  382. package/dist/esm/component-274da230.js +0 -4663
  383. package/dist/esm/component-341e4eaa.js +0 -1802
  384. package/dist/esm/icon-asset_14.entry.js +0 -1965
  385. package/dist/esm/ptc-data-lookup.entry.js +0 -671
  386. package/dist/esm/ptc-form-checkbox_2.entry.js +0 -4471
  387. package/dist/esm/ptc-multi-select_2.entry.js +0 -725
  388. package/dist/ptcw-design/p-068b64a1.entry.js +0 -1
  389. package/dist/ptcw-design/p-0824f503.entry.js +0 -1
  390. package/dist/ptcw-design/p-0ec2a26d.entry.js +0 -1
  391. package/dist/ptcw-design/p-1b3394a7.entry.js +0 -1
  392. package/dist/ptcw-design/p-212cdacd.entry.js +0 -1
  393. package/dist/ptcw-design/p-2bc4bf65.entry.js +0 -1
  394. package/dist/ptcw-design/p-2f82de8f.entry.js +0 -1
  395. package/dist/ptcw-design/p-32bbcb5a.entry.js +0 -1
  396. package/dist/ptcw-design/p-39255f59.entry.js +0 -1
  397. package/dist/ptcw-design/p-47aa1583.entry.js +0 -1
  398. package/dist/ptcw-design/p-53e214a6.entry.js +0 -1
  399. package/dist/ptcw-design/p-5bbfd7b3.entry.js +0 -1
  400. package/dist/ptcw-design/p-7815e38b.entry.js +0 -1
  401. package/dist/ptcw-design/p-79a6e764.entry.js +0 -1
  402. package/dist/ptcw-design/p-7b89a8e1.entry.js +0 -1
  403. package/dist/ptcw-design/p-83c3d6c9.entry.js +0 -1
  404. package/dist/ptcw-design/p-87a9a028.entry.js +0 -1
  405. package/dist/ptcw-design/p-87e4c337.entry.js +0 -1
  406. package/dist/ptcw-design/p-89da867f.entry.js +0 -1
  407. package/dist/ptcw-design/p-9461c4eb.entry.js +0 -1
  408. package/dist/ptcw-design/p-973b06d1.entry.js +0 -1
  409. package/dist/ptcw-design/p-9d8a9a72.entry.js +0 -1
  410. package/dist/ptcw-design/p-bdb2e42c.entry.js +0 -1
  411. package/dist/ptcw-design/p-be533f0d.js +0 -134
  412. package/dist/ptcw-design/p-bf15988f.entry.js +0 -68
  413. package/dist/ptcw-design/p-c1513c3f.js +0 -203
  414. package/dist/ptcw-design/p-c33fd408.entry.js +0 -1
  415. package/dist/ptcw-design/p-c389eb7d.entry.js +0 -1
  416. package/dist/ptcw-design/p-d428ba40.entry.js +0 -1
  417. package/dist/ptcw-design/p-d8c1a14a.entry.js +0 -1
  418. package/dist/ptcw-design/p-e1373325.entry.js +0 -1
  419. package/dist/ptcw-design/p-e51bb274.entry.js +0 -1
  420. package/dist/ptcw-design/p-eabf87be.entry.js +0 -1
  421. package/dist/ptcw-design/p-edaf241d.entry.js +0 -1
  422. package/dist/ptcw-design/p-fef688c2.entry.js +0 -1
@@ -1,4665 +0,0 @@
1
- 'use strict';
2
-
3
- const component = require('./component-5b5b6a98.js');
4
-
5
- /**
6
- * @license
7
- * Copyright 2018 Google Inc.
8
- *
9
- * Permission is hereby granted, free of charge, to any person obtaining a copy
10
- * of this software and associated documentation files (the "Software"), to deal
11
- * in the Software without restriction, including without limitation the rights
12
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
13
- * copies of the Software, and to permit persons to whom the Software is
14
- * furnished to do so, subject to the following conditions:
15
- *
16
- * The above copyright notice and this permission notice shall be included in
17
- * all copies or substantial portions of the Software.
18
- *
19
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
20
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
21
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
22
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
23
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
24
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
25
- * THE SOFTWARE.
26
- */
27
- var cssClasses$4 = {
28
- ANCHOR: 'mdc-menu-surface--anchor',
29
- ANIMATING_CLOSED: 'mdc-menu-surface--animating-closed',
30
- ANIMATING_OPEN: 'mdc-menu-surface--animating-open',
31
- FIXED: 'mdc-menu-surface--fixed',
32
- IS_OPEN_BELOW: 'mdc-menu-surface--is-open-below',
33
- OPEN: 'mdc-menu-surface--open',
34
- ROOT: 'mdc-menu-surface',
35
- };
36
- // tslint:disable:object-literal-sort-keys
37
- var strings$5 = {
38
- CLOSED_EVENT: 'MDCMenuSurface:closed',
39
- CLOSING_EVENT: 'MDCMenuSurface:closing',
40
- OPENED_EVENT: 'MDCMenuSurface:opened',
41
- OPENING_EVENT: 'MDCMenuSurface:opening',
42
- FOCUSABLE_ELEMENTS: [
43
- 'button:not(:disabled)',
44
- '[href]:not([aria-disabled="true"])',
45
- 'input:not(:disabled)',
46
- 'select:not(:disabled)',
47
- 'textarea:not(:disabled)',
48
- '[tabindex]:not([tabindex="-1"]):not([aria-disabled="true"])',
49
- ].join(', '),
50
- };
51
- // tslint:enable:object-literal-sort-keys
52
- var numbers$3 = {
53
- /** Total duration of menu-surface open animation. */
54
- TRANSITION_OPEN_DURATION: 120,
55
- /** Total duration of menu-surface close animation. */
56
- TRANSITION_CLOSE_DURATION: 75,
57
- /**
58
- * Margin left to the edge of the viewport when menu-surface is at maximum
59
- * possible height. Also used as a viewport margin.
60
- */
61
- MARGIN_TO_EDGE: 32,
62
- /**
63
- * Ratio of anchor width to menu-surface width for switching from corner
64
- * positioning to center positioning.
65
- */
66
- ANCHOR_TO_MENU_SURFACE_WIDTH_RATIO: 0.67,
67
- /**
68
- * Amount of time to wait before restoring focus when closing the menu
69
- * surface. This is important because if a touch event triggered the menu
70
- * close, and the subsequent mouse event occurs after focus is restored, then
71
- * the restored focus would be lost.
72
- */
73
- TOUCH_EVENT_WAIT_MS: 30,
74
- };
75
- /**
76
- * Enum for bits in the {@see Corner) bitmap.
77
- */
78
- var CornerBit;
79
- (function (CornerBit) {
80
- CornerBit[CornerBit["BOTTOM"] = 1] = "BOTTOM";
81
- CornerBit[CornerBit["CENTER"] = 2] = "CENTER";
82
- CornerBit[CornerBit["RIGHT"] = 4] = "RIGHT";
83
- CornerBit[CornerBit["FLIP_RTL"] = 8] = "FLIP_RTL";
84
- })(CornerBit || (CornerBit = {}));
85
- /**
86
- * Enum for representing an element corner for positioning the menu-surface.
87
- *
88
- * The START constants map to LEFT if element directionality is left
89
- * to right and RIGHT if the directionality is right to left.
90
- * Likewise END maps to RIGHT or LEFT depending on the directionality.
91
- */
92
- var Corner;
93
- (function (Corner) {
94
- Corner[Corner["TOP_LEFT"] = 0] = "TOP_LEFT";
95
- Corner[Corner["TOP_RIGHT"] = 4] = "TOP_RIGHT";
96
- Corner[Corner["BOTTOM_LEFT"] = 1] = "BOTTOM_LEFT";
97
- Corner[Corner["BOTTOM_RIGHT"] = 5] = "BOTTOM_RIGHT";
98
- Corner[Corner["TOP_START"] = 8] = "TOP_START";
99
- Corner[Corner["TOP_END"] = 12] = "TOP_END";
100
- Corner[Corner["BOTTOM_START"] = 9] = "BOTTOM_START";
101
- Corner[Corner["BOTTOM_END"] = 13] = "BOTTOM_END";
102
- })(Corner || (Corner = {}));
103
-
104
- /**
105
- * @license
106
- * Copyright 2018 Google Inc.
107
- *
108
- * Permission is hereby granted, free of charge, to any person obtaining a copy
109
- * of this software and associated documentation files (the "Software"), to deal
110
- * in the Software without restriction, including without limitation the rights
111
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
112
- * copies of the Software, and to permit persons to whom the Software is
113
- * furnished to do so, subject to the following conditions:
114
- *
115
- * The above copyright notice and this permission notice shall be included in
116
- * all copies or substantial portions of the Software.
117
- *
118
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
119
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
120
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
121
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
122
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
123
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
124
- * THE SOFTWARE.
125
- */
126
- var _a, _b;
127
- var cssClasses$3 = {
128
- LIST_ITEM_ACTIVATED_CLASS: 'mdc-list-item--activated',
129
- LIST_ITEM_CLASS: 'mdc-list-item',
130
- LIST_ITEM_DISABLED_CLASS: 'mdc-list-item--disabled',
131
- LIST_ITEM_SELECTED_CLASS: 'mdc-list-item--selected',
132
- LIST_ITEM_TEXT_CLASS: 'mdc-list-item__text',
133
- LIST_ITEM_PRIMARY_TEXT_CLASS: 'mdc-list-item__primary-text',
134
- ROOT: 'mdc-list',
135
- };
136
- var evolutionClassNameMap = (_a = {},
137
- _a["" + cssClasses$3.LIST_ITEM_ACTIVATED_CLASS] = 'mdc-list-item--activated',
138
- _a["" + cssClasses$3.LIST_ITEM_CLASS] = 'mdc-list-item',
139
- _a["" + cssClasses$3.LIST_ITEM_DISABLED_CLASS] = 'mdc-list-item--disabled',
140
- _a["" + cssClasses$3.LIST_ITEM_SELECTED_CLASS] = 'mdc-list-item--selected',
141
- _a["" + cssClasses$3.LIST_ITEM_PRIMARY_TEXT_CLASS] = 'mdc-list-item__primary-text',
142
- _a["" + cssClasses$3.ROOT] = 'mdc-list',
143
- _a);
144
- var deprecatedClassNameMap = (_b = {},
145
- _b["" + cssClasses$3.LIST_ITEM_ACTIVATED_CLASS] = 'mdc-deprecated-list-item--activated',
146
- _b["" + cssClasses$3.LIST_ITEM_CLASS] = 'mdc-deprecated-list-item',
147
- _b["" + cssClasses$3.LIST_ITEM_DISABLED_CLASS] = 'mdc-deprecated-list-item--disabled',
148
- _b["" + cssClasses$3.LIST_ITEM_SELECTED_CLASS] = 'mdc-deprecated-list-item--selected',
149
- _b["" + cssClasses$3.LIST_ITEM_TEXT_CLASS] = 'mdc-deprecated-list-item__text',
150
- _b["" + cssClasses$3.LIST_ITEM_PRIMARY_TEXT_CLASS] = 'mdc-deprecated-list-item__primary-text',
151
- _b["" + cssClasses$3.ROOT] = 'mdc-deprecated-list',
152
- _b);
153
- var strings$4 = {
154
- ACTION_EVENT: 'MDCList:action',
155
- SELECTION_CHANGE_EVENT: 'MDCList:selectionChange',
156
- ARIA_CHECKED: 'aria-checked',
157
- ARIA_CHECKED_CHECKBOX_SELECTOR: '[role="checkbox"][aria-checked="true"]',
158
- ARIA_CHECKED_RADIO_SELECTOR: '[role="radio"][aria-checked="true"]',
159
- ARIA_CURRENT: 'aria-current',
160
- ARIA_DISABLED: 'aria-disabled',
161
- ARIA_ORIENTATION: 'aria-orientation',
162
- ARIA_ORIENTATION_HORIZONTAL: 'horizontal',
163
- ARIA_ROLE_CHECKBOX_SELECTOR: '[role="checkbox"]',
164
- ARIA_SELECTED: 'aria-selected',
165
- ARIA_INTERACTIVE_ROLES_SELECTOR: '[role="listbox"], [role="menu"]',
166
- ARIA_MULTI_SELECTABLE_SELECTOR: '[aria-multiselectable="true"]',
167
- CHECKBOX_RADIO_SELECTOR: 'input[type="checkbox"], input[type="radio"]',
168
- CHECKBOX_SELECTOR: 'input[type="checkbox"]',
169
- CHILD_ELEMENTS_TO_TOGGLE_TABINDEX: "\n ." + cssClasses$3.LIST_ITEM_CLASS + " button:not(:disabled),\n ." + cssClasses$3.LIST_ITEM_CLASS + " a,\n ." + deprecatedClassNameMap[cssClasses$3.LIST_ITEM_CLASS] + " button:not(:disabled),\n ." + deprecatedClassNameMap[cssClasses$3.LIST_ITEM_CLASS] + " a\n ",
170
- DEPRECATED_SELECTOR: '.mdc-deprecated-list',
171
- FOCUSABLE_CHILD_ELEMENTS: "\n ." + cssClasses$3.LIST_ITEM_CLASS + " button:not(:disabled),\n ." + cssClasses$3.LIST_ITEM_CLASS + " a,\n ." + cssClasses$3.LIST_ITEM_CLASS + " input[type=\"radio\"]:not(:disabled),\n ." + cssClasses$3.LIST_ITEM_CLASS + " input[type=\"checkbox\"]:not(:disabled),\n ." + deprecatedClassNameMap[cssClasses$3.LIST_ITEM_CLASS] + " button:not(:disabled),\n ." + deprecatedClassNameMap[cssClasses$3.LIST_ITEM_CLASS] + " a,\n ." + deprecatedClassNameMap[cssClasses$3.LIST_ITEM_CLASS] + " input[type=\"radio\"]:not(:disabled),\n ." + deprecatedClassNameMap[cssClasses$3.LIST_ITEM_CLASS] + " input[type=\"checkbox\"]:not(:disabled)\n ",
172
- RADIO_SELECTOR: 'input[type="radio"]',
173
- SELECTED_ITEM_SELECTOR: '[aria-selected="true"], [aria-current="true"]',
174
- };
175
- var numbers$2 = {
176
- UNSET_INDEX: -1,
177
- TYPEAHEAD_BUFFER_CLEAR_TIMEOUT_MS: 300
178
- };
179
- var evolutionAttribute = 'evolution';
180
-
181
- /**
182
- * @license
183
- * Copyright 2020 Google Inc.
184
- *
185
- * Permission is hereby granted, free of charge, to any person obtaining a copy
186
- * of this software and associated documentation files (the "Software"), to deal
187
- * in the Software without restriction, including without limitation the rights
188
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
189
- * copies of the Software, and to permit persons to whom the Software is
190
- * furnished to do so, subject to the following conditions:
191
- *
192
- * The above copyright notice and this permission notice shall be included in
193
- * all copies or substantial portions of the Software.
194
- *
195
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
196
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
197
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
198
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
199
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
200
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
201
- * THE SOFTWARE.
202
- */
203
- /**
204
- * KEY provides normalized string values for keys.
205
- */
206
- var KEY = {
207
- UNKNOWN: 'Unknown',
208
- BACKSPACE: 'Backspace',
209
- ENTER: 'Enter',
210
- SPACEBAR: 'Spacebar',
211
- PAGE_UP: 'PageUp',
212
- PAGE_DOWN: 'PageDown',
213
- END: 'End',
214
- HOME: 'Home',
215
- ARROW_LEFT: 'ArrowLeft',
216
- ARROW_UP: 'ArrowUp',
217
- ARROW_RIGHT: 'ArrowRight',
218
- ARROW_DOWN: 'ArrowDown',
219
- DELETE: 'Delete',
220
- ESCAPE: 'Escape',
221
- TAB: 'Tab',
222
- };
223
- var normalizedKeys = new Set();
224
- // IE11 has no support for new Map with iterable so we need to initialize this
225
- // by hand.
226
- normalizedKeys.add(KEY.BACKSPACE);
227
- normalizedKeys.add(KEY.ENTER);
228
- normalizedKeys.add(KEY.SPACEBAR);
229
- normalizedKeys.add(KEY.PAGE_UP);
230
- normalizedKeys.add(KEY.PAGE_DOWN);
231
- normalizedKeys.add(KEY.END);
232
- normalizedKeys.add(KEY.HOME);
233
- normalizedKeys.add(KEY.ARROW_LEFT);
234
- normalizedKeys.add(KEY.ARROW_UP);
235
- normalizedKeys.add(KEY.ARROW_RIGHT);
236
- normalizedKeys.add(KEY.ARROW_DOWN);
237
- normalizedKeys.add(KEY.DELETE);
238
- normalizedKeys.add(KEY.ESCAPE);
239
- normalizedKeys.add(KEY.TAB);
240
- var KEY_CODE = {
241
- BACKSPACE: 8,
242
- ENTER: 13,
243
- SPACEBAR: 32,
244
- PAGE_UP: 33,
245
- PAGE_DOWN: 34,
246
- END: 35,
247
- HOME: 36,
248
- ARROW_LEFT: 37,
249
- ARROW_UP: 38,
250
- ARROW_RIGHT: 39,
251
- ARROW_DOWN: 40,
252
- DELETE: 46,
253
- ESCAPE: 27,
254
- TAB: 9,
255
- };
256
- var mappedKeyCodes = new Map();
257
- // IE11 has no support for new Map with iterable so we need to initialize this
258
- // by hand.
259
- mappedKeyCodes.set(KEY_CODE.BACKSPACE, KEY.BACKSPACE);
260
- mappedKeyCodes.set(KEY_CODE.ENTER, KEY.ENTER);
261
- mappedKeyCodes.set(KEY_CODE.SPACEBAR, KEY.SPACEBAR);
262
- mappedKeyCodes.set(KEY_CODE.PAGE_UP, KEY.PAGE_UP);
263
- mappedKeyCodes.set(KEY_CODE.PAGE_DOWN, KEY.PAGE_DOWN);
264
- mappedKeyCodes.set(KEY_CODE.END, KEY.END);
265
- mappedKeyCodes.set(KEY_CODE.HOME, KEY.HOME);
266
- mappedKeyCodes.set(KEY_CODE.ARROW_LEFT, KEY.ARROW_LEFT);
267
- mappedKeyCodes.set(KEY_CODE.ARROW_UP, KEY.ARROW_UP);
268
- mappedKeyCodes.set(KEY_CODE.ARROW_RIGHT, KEY.ARROW_RIGHT);
269
- mappedKeyCodes.set(KEY_CODE.ARROW_DOWN, KEY.ARROW_DOWN);
270
- mappedKeyCodes.set(KEY_CODE.DELETE, KEY.DELETE);
271
- mappedKeyCodes.set(KEY_CODE.ESCAPE, KEY.ESCAPE);
272
- mappedKeyCodes.set(KEY_CODE.TAB, KEY.TAB);
273
- var navigationKeys = new Set();
274
- // IE11 has no support for new Set with iterable so we need to initialize this
275
- // by hand.
276
- navigationKeys.add(KEY.PAGE_UP);
277
- navigationKeys.add(KEY.PAGE_DOWN);
278
- navigationKeys.add(KEY.END);
279
- navigationKeys.add(KEY.HOME);
280
- navigationKeys.add(KEY.ARROW_LEFT);
281
- navigationKeys.add(KEY.ARROW_UP);
282
- navigationKeys.add(KEY.ARROW_RIGHT);
283
- navigationKeys.add(KEY.ARROW_DOWN);
284
- /**
285
- * normalizeKey returns the normalized string for a navigational action.
286
- */
287
- function normalizeKey(evt) {
288
- var key = evt.key;
289
- // If the event already has a normalized key, return it
290
- if (normalizedKeys.has(key)) {
291
- return key;
292
- }
293
- // tslint:disable-next-line:deprecation
294
- var mappedKey = mappedKeyCodes.get(evt.keyCode);
295
- if (mappedKey) {
296
- return mappedKey;
297
- }
298
- return KEY.UNKNOWN;
299
- }
300
-
301
- /**
302
- * @license
303
- * Copyright 2020 Google Inc.
304
- *
305
- * Permission is hereby granted, free of charge, to any person obtaining a copy
306
- * of this software and associated documentation files (the "Software"), to deal
307
- * in the Software without restriction, including without limitation the rights
308
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
309
- * copies of the Software, and to permit persons to whom the Software is
310
- * furnished to do so, subject to the following conditions:
311
- *
312
- * The above copyright notice and this permission notice shall be included in
313
- * all copies or substantial portions of the Software.
314
- *
315
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
316
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
317
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
318
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
319
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
320
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
321
- * THE SOFTWARE.
322
- */
323
- var ELEMENTS_KEY_ALLOWED_IN = ['input', 'button', 'textarea', 'select'];
324
- /**
325
- * Ensures that preventDefault is only called if the containing element
326
- * doesn't consume the event, and it will cause an unintended scroll.
327
- *
328
- * @param evt keyboard event to be prevented.
329
- */
330
- var preventDefaultEvent = function (evt) {
331
- var target = evt.target;
332
- if (!target) {
333
- return;
334
- }
335
- var tagName = ("" + target.tagName).toLowerCase();
336
- if (ELEMENTS_KEY_ALLOWED_IN.indexOf(tagName) === -1) {
337
- evt.preventDefault();
338
- }
339
- };
340
-
341
- /**
342
- * @license
343
- * Copyright 2020 Google Inc.
344
- *
345
- * Permission is hereby granted, free of charge, to any person obtaining a copy
346
- * of this software and associated documentation files (the "Software"), to deal
347
- * in the Software without restriction, including without limitation the rights
348
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
349
- * copies of the Software, and to permit persons to whom the Software is
350
- * furnished to do so, subject to the following conditions:
351
- *
352
- * The above copyright notice and this permission notice shall be included in
353
- * all copies or substantial portions of the Software.
354
- *
355
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
356
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
357
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
358
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
359
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
360
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
361
- * THE SOFTWARE.
362
- */
363
- /**
364
- * Initializes a state object for typeahead. Use the same reference for calls to
365
- * typeahead functions.
366
- *
367
- * @return The current state of the typeahead process. Each state reference
368
- * represents a typeahead instance as the reference is typically mutated
369
- * in-place.
370
- */
371
- function initState() {
372
- var state = {
373
- bufferClearTimeout: 0,
374
- currentFirstChar: '',
375
- sortedIndexCursor: 0,
376
- typeaheadBuffer: '',
377
- };
378
- return state;
379
- }
380
- /**
381
- * Initializes typeahead state by indexing the current list items by primary
382
- * text into the sortedIndexByFirstChar data structure.
383
- *
384
- * @param listItemCount numer of items in the list
385
- * @param getPrimaryTextByItemIndex function that returns the primary text at a
386
- * given index
387
- *
388
- * @return Map that maps the first character of the primary text to the full
389
- * list text and it's index
390
- */
391
- function initSortedIndex(listItemCount, getPrimaryTextByItemIndex) {
392
- var sortedIndexByFirstChar = new Map();
393
- // Aggregate item text to index mapping
394
- for (var i = 0; i < listItemCount; i++) {
395
- var primaryText = getPrimaryTextByItemIndex(i).trim();
396
- if (!primaryText) {
397
- continue;
398
- }
399
- var firstChar = primaryText[0].toLowerCase();
400
- if (!sortedIndexByFirstChar.has(firstChar)) {
401
- sortedIndexByFirstChar.set(firstChar, []);
402
- }
403
- sortedIndexByFirstChar.get(firstChar).push({ text: primaryText.toLowerCase(), index: i });
404
- }
405
- // Sort the mapping
406
- // TODO(b/157162694): Investigate replacing forEach with Map.values()
407
- sortedIndexByFirstChar.forEach(function (values) {
408
- values.sort(function (first, second) {
409
- return first.index - second.index;
410
- });
411
- });
412
- return sortedIndexByFirstChar;
413
- }
414
- /**
415
- * Given the next desired character from the user, it attempts to find the next
416
- * list option matching the buffer. Wraps around if at the end of options.
417
- *
418
- * @param opts Options and accessors
419
- * - nextChar - the next character to match against items
420
- * - sortedIndexByFirstChar - output of `initSortedIndex(...)`
421
- * - focusedItemIndex - the index of the currently focused item
422
- * - focusItemAtIndex - function that focuses a list item at given index
423
- * - skipFocus - whether or not to focus the matched item
424
- * - isItemAtIndexDisabled - function that determines whether an item at a
425
- * given index is disabled
426
- * @param state The typeahead state instance. See `initState`.
427
- *
428
- * @return The index of the matched item, or -1 if no match.
429
- */
430
- function matchItem(opts, state) {
431
- var nextChar = opts.nextChar, focusItemAtIndex = opts.focusItemAtIndex, sortedIndexByFirstChar = opts.sortedIndexByFirstChar, focusedItemIndex = opts.focusedItemIndex, skipFocus = opts.skipFocus, isItemAtIndexDisabled = opts.isItemAtIndexDisabled;
432
- clearTimeout(state.bufferClearTimeout);
433
- state.bufferClearTimeout = setTimeout(function () {
434
- clearBuffer(state);
435
- }, numbers$2.TYPEAHEAD_BUFFER_CLEAR_TIMEOUT_MS);
436
- state.typeaheadBuffer = state.typeaheadBuffer + nextChar;
437
- var index;
438
- if (state.typeaheadBuffer.length === 1) {
439
- index = matchFirstChar(sortedIndexByFirstChar, focusedItemIndex, isItemAtIndexDisabled, state);
440
- }
441
- else {
442
- index = matchAllChars(sortedIndexByFirstChar, isItemAtIndexDisabled, state);
443
- }
444
- if (index !== -1 && !skipFocus) {
445
- focusItemAtIndex(index);
446
- }
447
- return index;
448
- }
449
- /**
450
- * Matches the user's single input character in the buffer to the
451
- * next option that begins with such character. Wraps around if at
452
- * end of options. Returns -1 if no match is found.
453
- */
454
- function matchFirstChar(sortedIndexByFirstChar, focusedItemIndex, isItemAtIndexDisabled, state) {
455
- var firstChar = state.typeaheadBuffer[0];
456
- var itemsMatchingFirstChar = sortedIndexByFirstChar.get(firstChar);
457
- if (!itemsMatchingFirstChar) {
458
- return -1;
459
- }
460
- // Has the same firstChar been recently matched?
461
- // Also, did starting index remain the same between key presses?
462
- // If both hold true, simply increment index.
463
- if (firstChar === state.currentFirstChar &&
464
- itemsMatchingFirstChar[state.sortedIndexCursor].index ===
465
- focusedItemIndex) {
466
- state.sortedIndexCursor =
467
- (state.sortedIndexCursor + 1) % itemsMatchingFirstChar.length;
468
- var newIndex = itemsMatchingFirstChar[state.sortedIndexCursor].index;
469
- if (!isItemAtIndexDisabled(newIndex)) {
470
- return newIndex;
471
- }
472
- }
473
- // If we're here, it means one of the following happened:
474
- // - either firstChar or startingIndex has changed, invalidating the
475
- // cursor.
476
- // - The next item of typeahead is disabled, so we have to look further.
477
- state.currentFirstChar = firstChar;
478
- var newCursorPosition = -1;
479
- var cursorPosition;
480
- // Find the first non-disabled item as a fallback.
481
- for (cursorPosition = 0; cursorPosition < itemsMatchingFirstChar.length; cursorPosition++) {
482
- if (!isItemAtIndexDisabled(itemsMatchingFirstChar[cursorPosition].index)) {
483
- newCursorPosition = cursorPosition;
484
- break;
485
- }
486
- }
487
- // Advance cursor to first item matching the firstChar that is positioned
488
- // after starting item. Cursor is unchanged from fallback if there's no
489
- // such item.
490
- for (; cursorPosition < itemsMatchingFirstChar.length; cursorPosition++) {
491
- if (itemsMatchingFirstChar[cursorPosition].index > focusedItemIndex &&
492
- !isItemAtIndexDisabled(itemsMatchingFirstChar[cursorPosition].index)) {
493
- newCursorPosition = cursorPosition;
494
- break;
495
- }
496
- }
497
- if (newCursorPosition !== -1) {
498
- state.sortedIndexCursor = newCursorPosition;
499
- return itemsMatchingFirstChar[state.sortedIndexCursor].index;
500
- }
501
- return -1;
502
- }
503
- /**
504
- * Attempts to find the next item that matches all of the typeahead buffer.
505
- * Wraps around if at end of options. Returns -1 if no match is found.
506
- */
507
- function matchAllChars(sortedIndexByFirstChar, isItemAtIndexDisabled, state) {
508
- var firstChar = state.typeaheadBuffer[0];
509
- var itemsMatchingFirstChar = sortedIndexByFirstChar.get(firstChar);
510
- if (!itemsMatchingFirstChar) {
511
- return -1;
512
- }
513
- // Do nothing if text already matches
514
- var startingItem = itemsMatchingFirstChar[state.sortedIndexCursor];
515
- if (startingItem.text.lastIndexOf(state.typeaheadBuffer, 0) === 0 &&
516
- !isItemAtIndexDisabled(startingItem.index)) {
517
- return startingItem.index;
518
- }
519
- // Find next item that matches completely; if no match, we'll eventually
520
- // loop around to same position
521
- var cursorPosition = (state.sortedIndexCursor + 1) % itemsMatchingFirstChar.length;
522
- var nextCursorPosition = -1;
523
- while (cursorPosition !== state.sortedIndexCursor) {
524
- var currentItem = itemsMatchingFirstChar[cursorPosition];
525
- var matches = currentItem.text.lastIndexOf(state.typeaheadBuffer, 0) === 0;
526
- var isEnabled = !isItemAtIndexDisabled(currentItem.index);
527
- if (matches && isEnabled) {
528
- nextCursorPosition = cursorPosition;
529
- break;
530
- }
531
- cursorPosition = (cursorPosition + 1) % itemsMatchingFirstChar.length;
532
- }
533
- if (nextCursorPosition !== -1) {
534
- state.sortedIndexCursor = nextCursorPosition;
535
- return itemsMatchingFirstChar[state.sortedIndexCursor].index;
536
- }
537
- return -1;
538
- }
539
- /**
540
- * Whether or not the given typeahead instaance state is currently typing.
541
- *
542
- * @param state The typeahead state instance. See `initState`.
543
- */
544
- function isTypingInProgress(state) {
545
- return state.typeaheadBuffer.length > 0;
546
- }
547
- /**
548
- * Clears the typeahaed buffer so that it resets item matching to the first
549
- * character.
550
- *
551
- * @param state The typeahead state instance. See `initState`.
552
- */
553
- function clearBuffer(state) {
554
- state.typeaheadBuffer = '';
555
- }
556
- /**
557
- * Given a keydown event, it calculates whether or not to automatically focus a
558
- * list item depending on what was typed mimicing the typeahead functionality of
559
- * a standard <select> element that is open.
560
- *
561
- * @param opts Options and accessors
562
- * - event - the KeyboardEvent to handle and parse
563
- * - sortedIndexByFirstChar - output of `initSortedIndex(...)`
564
- * - focusedItemIndex - the index of the currently focused item
565
- * - focusItemAtIndex - function that focuses a list item at given index
566
- * - isItemAtFocusedIndexDisabled - whether or not the currently focused item
567
- * is disabled
568
- * - isTargetListItem - whether or not the event target is a list item
569
- * @param state The typeahead state instance. See `initState`.
570
- *
571
- * @returns index of the item matched by the keydown. -1 if not matched.
572
- */
573
- function handleKeydown(opts, state) {
574
- var event = opts.event, isTargetListItem = opts.isTargetListItem, focusedItemIndex = opts.focusedItemIndex, focusItemAtIndex = opts.focusItemAtIndex, sortedIndexByFirstChar = opts.sortedIndexByFirstChar, isItemAtIndexDisabled = opts.isItemAtIndexDisabled;
575
- var isArrowLeft = normalizeKey(event) === 'ArrowLeft';
576
- var isArrowUp = normalizeKey(event) === 'ArrowUp';
577
- var isArrowRight = normalizeKey(event) === 'ArrowRight';
578
- var isArrowDown = normalizeKey(event) === 'ArrowDown';
579
- var isHome = normalizeKey(event) === 'Home';
580
- var isEnd = normalizeKey(event) === 'End';
581
- var isEnter = normalizeKey(event) === 'Enter';
582
- var isSpace = normalizeKey(event) === 'Spacebar';
583
- if (event.altKey || event.ctrlKey || event.metaKey || isArrowLeft ||
584
- isArrowUp || isArrowRight || isArrowDown || isHome || isEnd || isEnter) {
585
- return -1;
586
- }
587
- var isCharacterKey = !isSpace && event.key.length === 1;
588
- if (isCharacterKey) {
589
- preventDefaultEvent(event);
590
- var matchItemOpts = {
591
- focusItemAtIndex: focusItemAtIndex,
592
- focusedItemIndex: focusedItemIndex,
593
- nextChar: event.key.toLowerCase(),
594
- sortedIndexByFirstChar: sortedIndexByFirstChar,
595
- skipFocus: false,
596
- isItemAtIndexDisabled: isItemAtIndexDisabled,
597
- };
598
- return matchItem(matchItemOpts, state);
599
- }
600
- if (!isSpace) {
601
- return -1;
602
- }
603
- if (isTargetListItem) {
604
- preventDefaultEvent(event);
605
- }
606
- var typeaheadOnListItem = isTargetListItem && isTypingInProgress(state);
607
- if (typeaheadOnListItem) {
608
- var matchItemOpts = {
609
- focusItemAtIndex: focusItemAtIndex,
610
- focusedItemIndex: focusedItemIndex,
611
- nextChar: ' ',
612
- sortedIndexByFirstChar: sortedIndexByFirstChar,
613
- skipFocus: false,
614
- isItemAtIndexDisabled: isItemAtIndexDisabled,
615
- };
616
- // space participates in typeahead matching if in rapid typing mode
617
- return matchItem(matchItemOpts, state);
618
- }
619
- return -1;
620
- }
621
-
622
- /**
623
- * @license
624
- * Copyright 2018 Google Inc.
625
- *
626
- * Permission is hereby granted, free of charge, to any person obtaining a copy
627
- * of this software and associated documentation files (the "Software"), to deal
628
- * in the Software without restriction, including without limitation the rights
629
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
630
- * copies of the Software, and to permit persons to whom the Software is
631
- * furnished to do so, subject to the following conditions:
632
- *
633
- * The above copyright notice and this permission notice shall be included in
634
- * all copies or substantial portions of the Software.
635
- *
636
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
637
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
638
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
639
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
640
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
641
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
642
- * THE SOFTWARE.
643
- */
644
- function isNumberArray(selectedIndex) {
645
- return selectedIndex instanceof Array;
646
- }
647
- /** List of modifier keys to consider while handling keyboard events. */
648
- var handledModifierKeys = ['Alt', 'Control', 'Meta', 'Shift'];
649
- /** Checks if the event has the given modifier keys. */
650
- function createModifierChecker(event) {
651
- var eventModifiers = new Set(event ? handledModifierKeys.filter(function (m) { return event.getModifierState(m); }) : []);
652
- return function (modifiers) {
653
- return modifiers.every(function (m) { return eventModifiers.has(m); }) &&
654
- modifiers.length === eventModifiers.size;
655
- };
656
- }
657
- var MDCListFoundation = /** @class */ (function (_super) {
658
- component.__extends(MDCListFoundation, _super);
659
- function MDCListFoundation(adapter) {
660
- var _this = _super.call(this, component.__assign(component.__assign({}, MDCListFoundation.defaultAdapter), adapter)) || this;
661
- _this.wrapFocus = false;
662
- _this.isVertical = true;
663
- _this.isSingleSelectionList = false;
664
- _this.areDisabledItemsFocusable = true;
665
- _this.selectedIndex = numbers$2.UNSET_INDEX;
666
- _this.focusedItemIndex = numbers$2.UNSET_INDEX;
667
- _this.useActivatedClass = false;
668
- _this.useSelectedAttr = false;
669
- _this.ariaCurrentAttrValue = null;
670
- _this.isCheckboxList = false;
671
- _this.isRadioList = false;
672
- _this.lastSelectedIndex = null;
673
- _this.hasTypeahead = false;
674
- // Transiently holds current typeahead prefix from user.
675
- _this.typeaheadState = initState();
676
- _this.sortedIndexByFirstChar = new Map();
677
- return _this;
678
- }
679
- Object.defineProperty(MDCListFoundation, "strings", {
680
- get: function () {
681
- return strings$4;
682
- },
683
- enumerable: false,
684
- configurable: true
685
- });
686
- Object.defineProperty(MDCListFoundation, "cssClasses", {
687
- get: function () {
688
- return cssClasses$3;
689
- },
690
- enumerable: false,
691
- configurable: true
692
- });
693
- Object.defineProperty(MDCListFoundation, "numbers", {
694
- get: function () {
695
- return numbers$2;
696
- },
697
- enumerable: false,
698
- configurable: true
699
- });
700
- Object.defineProperty(MDCListFoundation, "defaultAdapter", {
701
- get: function () {
702
- return {
703
- addClassForElementIndex: function () { return undefined; },
704
- focusItemAtIndex: function () { return undefined; },
705
- getAttributeForElementIndex: function () { return null; },
706
- getFocusedElementIndex: function () { return 0; },
707
- getListItemCount: function () { return 0; },
708
- hasCheckboxAtIndex: function () { return false; },
709
- hasRadioAtIndex: function () { return false; },
710
- isCheckboxCheckedAtIndex: function () { return false; },
711
- isFocusInsideList: function () { return false; },
712
- isRootFocused: function () { return false; },
713
- listItemAtIndexHasClass: function () { return false; },
714
- notifyAction: function () { return undefined; },
715
- notifySelectionChange: function () { },
716
- removeClassForElementIndex: function () { return undefined; },
717
- setAttributeForElementIndex: function () { return undefined; },
718
- setCheckedCheckboxOrRadioAtIndex: function () { return undefined; },
719
- setTabIndexForListItemChildren: function () { return undefined; },
720
- getPrimaryTextAtIndex: function () { return ''; },
721
- };
722
- },
723
- enumerable: false,
724
- configurable: true
725
- });
726
- MDCListFoundation.prototype.layout = function () {
727
- if (this.adapter.getListItemCount() === 0) {
728
- return;
729
- }
730
- // TODO(b/172274142): consider all items when determining the list's type.
731
- if (this.adapter.hasCheckboxAtIndex(0)) {
732
- this.isCheckboxList = true;
733
- }
734
- else if (this.adapter.hasRadioAtIndex(0)) {
735
- this.isRadioList = true;
736
- }
737
- else {
738
- this.maybeInitializeSingleSelection();
739
- }
740
- if (this.hasTypeahead) {
741
- this.sortedIndexByFirstChar = this.typeaheadInitSortedIndex();
742
- }
743
- };
744
- /** Returns the index of the item that was last focused. */
745
- MDCListFoundation.prototype.getFocusedItemIndex = function () {
746
- return this.focusedItemIndex;
747
- };
748
- /** Toggles focus wrapping with keyboard navigation. */
749
- MDCListFoundation.prototype.setWrapFocus = function (value) {
750
- this.wrapFocus = value;
751
- };
752
- /**
753
- * Toggles orientation direction for keyboard navigation (true for vertical,
754
- * false for horizontal).
755
- */
756
- MDCListFoundation.prototype.setVerticalOrientation = function (value) {
757
- this.isVertical = value;
758
- };
759
- /** Toggles single-selection behavior. */
760
- MDCListFoundation.prototype.setSingleSelection = function (value) {
761
- this.isSingleSelectionList = value;
762
- if (value) {
763
- this.maybeInitializeSingleSelection();
764
- this.selectedIndex = this.getSelectedIndexFromDOM();
765
- }
766
- };
767
- MDCListFoundation.prototype.setDisabledItemsFocusable = function (value) {
768
- this.areDisabledItemsFocusable = value;
769
- };
770
- /**
771
- * Automatically determines whether the list is single selection list. If so,
772
- * initializes the internal state to match the selected item.
773
- */
774
- MDCListFoundation.prototype.maybeInitializeSingleSelection = function () {
775
- var selectedItemIndex = this.getSelectedIndexFromDOM();
776
- if (selectedItemIndex === numbers$2.UNSET_INDEX)
777
- return;
778
- var hasActivatedClass = this.adapter.listItemAtIndexHasClass(selectedItemIndex, cssClasses$3.LIST_ITEM_ACTIVATED_CLASS);
779
- if (hasActivatedClass) {
780
- this.setUseActivatedClass(true);
781
- }
782
- this.isSingleSelectionList = true;
783
- this.selectedIndex = selectedItemIndex;
784
- };
785
- /** @return Index of the first selected item based on the DOM state. */
786
- MDCListFoundation.prototype.getSelectedIndexFromDOM = function () {
787
- var selectedIndex = numbers$2.UNSET_INDEX;
788
- var listItemsCount = this.adapter.getListItemCount();
789
- for (var i = 0; i < listItemsCount; i++) {
790
- var hasSelectedClass = this.adapter.listItemAtIndexHasClass(i, cssClasses$3.LIST_ITEM_SELECTED_CLASS);
791
- var hasActivatedClass = this.adapter.listItemAtIndexHasClass(i, cssClasses$3.LIST_ITEM_ACTIVATED_CLASS);
792
- if (!(hasSelectedClass || hasActivatedClass)) {
793
- continue;
794
- }
795
- selectedIndex = i;
796
- break;
797
- }
798
- return selectedIndex;
799
- };
800
- /**
801
- * Sets whether typeahead is enabled on the list.
802
- * @param hasTypeahead Whether typeahead is enabled.
803
- */
804
- MDCListFoundation.prototype.setHasTypeahead = function (hasTypeahead) {
805
- this.hasTypeahead = hasTypeahead;
806
- if (hasTypeahead) {
807
- this.sortedIndexByFirstChar = this.typeaheadInitSortedIndex();
808
- }
809
- };
810
- /**
811
- * @return Whether typeahead is currently matching a user-specified prefix.
812
- */
813
- MDCListFoundation.prototype.isTypeaheadInProgress = function () {
814
- return this.hasTypeahead &&
815
- isTypingInProgress(this.typeaheadState);
816
- };
817
- /** Toggle use of the "activated" CSS class. */
818
- MDCListFoundation.prototype.setUseActivatedClass = function (useActivated) {
819
- this.useActivatedClass = useActivated;
820
- };
821
- /**
822
- * Toggles use of the selected attribute (true for aria-selected, false for
823
- * aria-checked).
824
- */
825
- MDCListFoundation.prototype.setUseSelectedAttribute = function (useSelected) {
826
- this.useSelectedAttr = useSelected;
827
- };
828
- MDCListFoundation.prototype.getSelectedIndex = function () {
829
- return this.selectedIndex;
830
- };
831
- MDCListFoundation.prototype.setSelectedIndex = function (index, options) {
832
- if (options === void 0) { options = {}; }
833
- if (!this.isIndexValid(index)) {
834
- return;
835
- }
836
- if (this.isCheckboxList) {
837
- this.setCheckboxAtIndex(index, options);
838
- }
839
- else if (this.isRadioList) {
840
- this.setRadioAtIndex(index, options);
841
- }
842
- else {
843
- this.setSingleSelectionAtIndex(index, options);
844
- }
845
- };
846
- /**
847
- * Focus in handler for the list items.
848
- */
849
- MDCListFoundation.prototype.handleFocusIn = function (listItemIndex) {
850
- if (listItemIndex >= 0) {
851
- this.focusedItemIndex = listItemIndex;
852
- this.adapter.setAttributeForElementIndex(listItemIndex, 'tabindex', '0');
853
- this.adapter.setTabIndexForListItemChildren(listItemIndex, '0');
854
- }
855
- };
856
- /**
857
- * Focus out handler for the list items.
858
- */
859
- MDCListFoundation.prototype.handleFocusOut = function (listItemIndex) {
860
- var _this = this;
861
- if (listItemIndex >= 0) {
862
- this.adapter.setAttributeForElementIndex(listItemIndex, 'tabindex', '-1');
863
- this.adapter.setTabIndexForListItemChildren(listItemIndex, '-1');
864
- }
865
- /**
866
- * Between Focusout & Focusin some browsers do not have focus on any
867
- * element. Setting a delay to wait till the focus is moved to next element.
868
- */
869
- setTimeout(function () {
870
- if (!_this.adapter.isFocusInsideList()) {
871
- _this.setTabindexToFirstSelectedOrFocusedItem();
872
- }
873
- }, 0);
874
- };
875
- MDCListFoundation.prototype.isIndexDisabled = function (index) {
876
- return this.adapter.listItemAtIndexHasClass(index, cssClasses$3.LIST_ITEM_DISABLED_CLASS);
877
- };
878
- /**
879
- * Key handler for the list.
880
- */
881
- MDCListFoundation.prototype.handleKeydown = function (event, isRootListItem, listItemIndex) {
882
- var _this = this;
883
- var _a;
884
- var isArrowLeft = normalizeKey(event) === 'ArrowLeft';
885
- var isArrowUp = normalizeKey(event) === 'ArrowUp';
886
- var isArrowRight = normalizeKey(event) === 'ArrowRight';
887
- var isArrowDown = normalizeKey(event) === 'ArrowDown';
888
- var isHome = normalizeKey(event) === 'Home';
889
- var isEnd = normalizeKey(event) === 'End';
890
- var isEnter = normalizeKey(event) === 'Enter';
891
- var isSpace = normalizeKey(event) === 'Spacebar';
892
- // The keys for forward and back differ based on list orientation.
893
- var isForward = (this.isVertical && isArrowDown) || (!this.isVertical && isArrowRight);
894
- var isBack = (this.isVertical && isArrowUp) || (!this.isVertical && isArrowLeft);
895
- // Have to check both upper and lower case, because having caps lock on
896
- // affects the value.
897
- var isLetterA = event.key === 'A' || event.key === 'a';
898
- var eventHasModifiers = createModifierChecker(event);
899
- if (this.adapter.isRootFocused()) {
900
- if ((isBack || isEnd) && eventHasModifiers([])) {
901
- event.preventDefault();
902
- this.focusLastElement();
903
- }
904
- else if ((isForward || isHome) && eventHasModifiers([])) {
905
- event.preventDefault();
906
- this.focusFirstElement();
907
- }
908
- else if (isBack && eventHasModifiers(['Shift']) && this.isCheckboxList) {
909
- event.preventDefault();
910
- var focusedIndex = this.focusLastElement();
911
- if (focusedIndex !== -1) {
912
- this.setSelectedIndexOnAction(focusedIndex, false);
913
- }
914
- }
915
- else if (isForward && eventHasModifiers(['Shift']) && this.isCheckboxList) {
916
- event.preventDefault();
917
- var focusedIndex = this.focusFirstElement();
918
- if (focusedIndex !== -1) {
919
- this.setSelectedIndexOnAction(focusedIndex, false);
920
- }
921
- }
922
- if (this.hasTypeahead) {
923
- var handleKeydownOpts = {
924
- event: event,
925
- focusItemAtIndex: function (index) {
926
- _this.focusItemAtIndex(index);
927
- },
928
- focusedItemIndex: -1,
929
- isTargetListItem: isRootListItem,
930
- sortedIndexByFirstChar: this.sortedIndexByFirstChar,
931
- isItemAtIndexDisabled: function (index) { return _this.isIndexDisabled(index); },
932
- };
933
- handleKeydown(handleKeydownOpts, this.typeaheadState);
934
- }
935
- return;
936
- }
937
- var currentIndex = this.adapter.getFocusedElementIndex();
938
- if (currentIndex === -1) {
939
- currentIndex = listItemIndex;
940
- if (currentIndex < 0) {
941
- // If this event doesn't have a mdc-list-item ancestor from the
942
- // current list (not from a sublist), return early.
943
- return;
944
- }
945
- }
946
- if (isForward && eventHasModifiers([])) {
947
- preventDefaultEvent(event);
948
- this.focusNextElement(currentIndex);
949
- }
950
- else if (isBack && eventHasModifiers([])) {
951
- preventDefaultEvent(event);
952
- this.focusPrevElement(currentIndex);
953
- }
954
- else if (isForward && eventHasModifiers(['Shift']) && this.isCheckboxList) {
955
- preventDefaultEvent(event);
956
- var focusedIndex = this.focusNextElement(currentIndex);
957
- if (focusedIndex !== -1) {
958
- this.setSelectedIndexOnAction(focusedIndex, false);
959
- }
960
- }
961
- else if (isBack && eventHasModifiers(['Shift']) && this.isCheckboxList) {
962
- preventDefaultEvent(event);
963
- var focusedIndex = this.focusPrevElement(currentIndex);
964
- if (focusedIndex !== -1) {
965
- this.setSelectedIndexOnAction(focusedIndex, false);
966
- }
967
- }
968
- else if (isHome && eventHasModifiers([])) {
969
- preventDefaultEvent(event);
970
- this.focusFirstElement();
971
- }
972
- else if (isEnd && eventHasModifiers([])) {
973
- preventDefaultEvent(event);
974
- this.focusLastElement();
975
- }
976
- else if (isHome && eventHasModifiers(['Control', 'Shift']) &&
977
- this.isCheckboxList) {
978
- preventDefaultEvent(event);
979
- if (this.isIndexDisabled(currentIndex)) {
980
- return;
981
- }
982
- this.focusFirstElement();
983
- this.toggleCheckboxRange(0, currentIndex, currentIndex);
984
- }
985
- else if (isEnd && eventHasModifiers(['Control', 'Shift']) &&
986
- this.isCheckboxList) {
987
- preventDefaultEvent(event);
988
- if (this.isIndexDisabled(currentIndex)) {
989
- return;
990
- }
991
- this.focusLastElement();
992
- this.toggleCheckboxRange(currentIndex, this.adapter.getListItemCount() - 1, currentIndex);
993
- }
994
- else if (isLetterA && eventHasModifiers(['Control']) && this.isCheckboxList) {
995
- event.preventDefault();
996
- this.checkboxListToggleAll(this.selectedIndex === numbers$2.UNSET_INDEX ?
997
- [] :
998
- this.selectedIndex, true);
999
- }
1000
- else if ((isEnter || isSpace) && eventHasModifiers([])) {
1001
- if (isRootListItem) {
1002
- // Return early if enter key is pressed on anchor element which triggers
1003
- // synthetic MouseEvent event.
1004
- var target = event.target;
1005
- if (target && target.tagName === 'A' && isEnter) {
1006
- return;
1007
- }
1008
- preventDefaultEvent(event);
1009
- if (this.isIndexDisabled(currentIndex)) {
1010
- return;
1011
- }
1012
- if (!this.isTypeaheadInProgress()) {
1013
- if (this.isSelectableList()) {
1014
- this.setSelectedIndexOnAction(currentIndex, false);
1015
- }
1016
- this.adapter.notifyAction(currentIndex);
1017
- }
1018
- }
1019
- }
1020
- else if ((isEnter || isSpace) && eventHasModifiers(['Shift']) &&
1021
- this.isCheckboxList) {
1022
- // Return early if enter key is pressed on anchor element which triggers
1023
- // synthetic MouseEvent event.
1024
- var target = event.target;
1025
- if (target && target.tagName === 'A' && isEnter) {
1026
- return;
1027
- }
1028
- preventDefaultEvent(event);
1029
- if (this.isIndexDisabled(currentIndex)) {
1030
- return;
1031
- }
1032
- if (!this.isTypeaheadInProgress()) {
1033
- this.toggleCheckboxRange((_a = this.lastSelectedIndex) !== null && _a !== void 0 ? _a : currentIndex, currentIndex, currentIndex);
1034
- this.adapter.notifyAction(currentIndex);
1035
- }
1036
- }
1037
- if (this.hasTypeahead) {
1038
- var handleKeydownOpts = {
1039
- event: event,
1040
- focusItemAtIndex: function (index) { _this.focusItemAtIndex(index); },
1041
- focusedItemIndex: this.focusedItemIndex,
1042
- isTargetListItem: isRootListItem,
1043
- sortedIndexByFirstChar: this.sortedIndexByFirstChar,
1044
- isItemAtIndexDisabled: function (index) { return _this.isIndexDisabled(index); },
1045
- };
1046
- handleKeydown(handleKeydownOpts, this.typeaheadState);
1047
- }
1048
- };
1049
- /**
1050
- * Click handler for the list.
1051
- *
1052
- * @param index Index for the item that has been clicked.
1053
- * @param isCheckboxAlreadyUpdatedInAdapter Whether the checkbox for
1054
- * the list item has already been updated in the adapter. This attribute
1055
- * should be set to `true` when e.g. the click event directly landed on
1056
- * the underlying native checkbox element which would cause the checked
1057
- * state to be already toggled within `adapter.isCheckboxCheckedAtIndex`.
1058
- */
1059
- MDCListFoundation.prototype.handleClick = function (index, isCheckboxAlreadyUpdatedInAdapter, event) {
1060
- var _a;
1061
- var eventHasModifiers = createModifierChecker(event);
1062
- if (index === numbers$2.UNSET_INDEX) {
1063
- return;
1064
- }
1065
- if (this.isIndexDisabled(index)) {
1066
- return;
1067
- }
1068
- if (eventHasModifiers([])) {
1069
- if (this.isSelectableList()) {
1070
- this.setSelectedIndexOnAction(index, isCheckboxAlreadyUpdatedInAdapter);
1071
- }
1072
- this.adapter.notifyAction(index);
1073
- }
1074
- else if (this.isCheckboxList && eventHasModifiers(['Shift'])) {
1075
- this.toggleCheckboxRange((_a = this.lastSelectedIndex) !== null && _a !== void 0 ? _a : index, index, index);
1076
- this.adapter.notifyAction(index);
1077
- }
1078
- };
1079
- /**
1080
- * Focuses the next element on the list.
1081
- */
1082
- MDCListFoundation.prototype.focusNextElement = function (index) {
1083
- var count = this.adapter.getListItemCount();
1084
- var nextIndex = index;
1085
- var firstChecked = null;
1086
- do {
1087
- nextIndex++;
1088
- if (nextIndex >= count) {
1089
- if (this.wrapFocus) {
1090
- nextIndex = 0;
1091
- }
1092
- else {
1093
- // Return early because last item is already focused.
1094
- return index;
1095
- }
1096
- }
1097
- if (nextIndex === firstChecked) {
1098
- return -1;
1099
- }
1100
- firstChecked = firstChecked !== null && firstChecked !== void 0 ? firstChecked : nextIndex;
1101
- } while (!this.areDisabledItemsFocusable && this.isIndexDisabled(nextIndex));
1102
- this.focusItemAtIndex(nextIndex);
1103
- return nextIndex;
1104
- };
1105
- /**
1106
- * Focuses the previous element on the list.
1107
- */
1108
- MDCListFoundation.prototype.focusPrevElement = function (index) {
1109
- var count = this.adapter.getListItemCount();
1110
- var prevIndex = index;
1111
- var firstChecked = null;
1112
- do {
1113
- prevIndex--;
1114
- if (prevIndex < 0) {
1115
- if (this.wrapFocus) {
1116
- prevIndex = count - 1;
1117
- }
1118
- else {
1119
- // Return early because first item is already focused.
1120
- return index;
1121
- }
1122
- }
1123
- if (prevIndex === firstChecked) {
1124
- return -1;
1125
- }
1126
- firstChecked = firstChecked !== null && firstChecked !== void 0 ? firstChecked : prevIndex;
1127
- } while (!this.areDisabledItemsFocusable && this.isIndexDisabled(prevIndex));
1128
- this.focusItemAtIndex(prevIndex);
1129
- return prevIndex;
1130
- };
1131
- MDCListFoundation.prototype.focusFirstElement = function () {
1132
- // Pass -1 to `focusNextElement`, since it will incremement to 0 and focus
1133
- // the first element.
1134
- return this.focusNextElement(-1);
1135
- };
1136
- MDCListFoundation.prototype.focusLastElement = function () {
1137
- // Pass the length of the list to `focusNextElement` since it will decrement
1138
- // to length - 1 and focus the last element.
1139
- return this.focusPrevElement(this.adapter.getListItemCount());
1140
- };
1141
- MDCListFoundation.prototype.focusInitialElement = function () {
1142
- var initialIndex = this.getFirstSelectedOrFocusedItemIndex();
1143
- this.focusItemAtIndex(initialIndex);
1144
- return initialIndex;
1145
- };
1146
- /**
1147
- * @param itemIndex Index of the list item
1148
- * @param isEnabled Sets the list item to enabled or disabled.
1149
- */
1150
- MDCListFoundation.prototype.setEnabled = function (itemIndex, isEnabled) {
1151
- if (!this.isIndexValid(itemIndex, false)) {
1152
- return;
1153
- }
1154
- if (isEnabled) {
1155
- this.adapter.removeClassForElementIndex(itemIndex, cssClasses$3.LIST_ITEM_DISABLED_CLASS);
1156
- this.adapter.setAttributeForElementIndex(itemIndex, strings$4.ARIA_DISABLED, 'false');
1157
- }
1158
- else {
1159
- this.adapter.addClassForElementIndex(itemIndex, cssClasses$3.LIST_ITEM_DISABLED_CLASS);
1160
- this.adapter.setAttributeForElementIndex(itemIndex, strings$4.ARIA_DISABLED, 'true');
1161
- }
1162
- };
1163
- MDCListFoundation.prototype.setSingleSelectionAtIndex = function (index, options) {
1164
- if (options === void 0) { options = {}; }
1165
- if (this.selectedIndex === index && !options.forceUpdate) {
1166
- return;
1167
- }
1168
- var selectedClassName = cssClasses$3.LIST_ITEM_SELECTED_CLASS;
1169
- if (this.useActivatedClass) {
1170
- selectedClassName = cssClasses$3.LIST_ITEM_ACTIVATED_CLASS;
1171
- }
1172
- if (this.selectedIndex !== numbers$2.UNSET_INDEX) {
1173
- this.adapter.removeClassForElementIndex(this.selectedIndex, selectedClassName);
1174
- }
1175
- this.setAriaForSingleSelectionAtIndex(index);
1176
- this.setTabindexAtIndex(index);
1177
- if (index !== numbers$2.UNSET_INDEX) {
1178
- this.adapter.addClassForElementIndex(index, selectedClassName);
1179
- }
1180
- this.selectedIndex = index;
1181
- // If the selected value has changed through user interaction,
1182
- // we want to notify the selection change to the adapter.
1183
- if (options.isUserInteraction && !options.forceUpdate) {
1184
- this.adapter.notifySelectionChange([index]);
1185
- }
1186
- };
1187
- /**
1188
- * Sets aria attribute for single selection at given index.
1189
- */
1190
- MDCListFoundation.prototype.setAriaForSingleSelectionAtIndex = function (index) {
1191
- // Detect the presence of aria-current and get the value only during list
1192
- // initialization when it is in unset state.
1193
- if (this.selectedIndex === numbers$2.UNSET_INDEX) {
1194
- this.ariaCurrentAttrValue =
1195
- this.adapter.getAttributeForElementIndex(index, strings$4.ARIA_CURRENT);
1196
- }
1197
- var isAriaCurrent = this.ariaCurrentAttrValue !== null;
1198
- var ariaAttribute = isAriaCurrent ? strings$4.ARIA_CURRENT : strings$4.ARIA_SELECTED;
1199
- if (this.selectedIndex !== numbers$2.UNSET_INDEX) {
1200
- this.adapter.setAttributeForElementIndex(this.selectedIndex, ariaAttribute, 'false');
1201
- }
1202
- if (index !== numbers$2.UNSET_INDEX) {
1203
- var ariaAttributeValue = isAriaCurrent ? this.ariaCurrentAttrValue : 'true';
1204
- this.adapter.setAttributeForElementIndex(index, ariaAttribute, ariaAttributeValue);
1205
- }
1206
- };
1207
- /**
1208
- * Returns the attribute to use for indicating selection status.
1209
- */
1210
- MDCListFoundation.prototype.getSelectionAttribute = function () {
1211
- return this.useSelectedAttr ? strings$4.ARIA_SELECTED : strings$4.ARIA_CHECKED;
1212
- };
1213
- /**
1214
- * Toggles radio at give index. Radio doesn't change the checked state if it
1215
- * is already checked.
1216
- */
1217
- MDCListFoundation.prototype.setRadioAtIndex = function (index, options) {
1218
- if (options === void 0) { options = {}; }
1219
- var selectionAttribute = this.getSelectionAttribute();
1220
- this.adapter.setCheckedCheckboxOrRadioAtIndex(index, true);
1221
- if (this.selectedIndex === index && !options.forceUpdate) {
1222
- return;
1223
- }
1224
- if (this.selectedIndex !== numbers$2.UNSET_INDEX) {
1225
- this.adapter.setAttributeForElementIndex(this.selectedIndex, selectionAttribute, 'false');
1226
- }
1227
- this.adapter.setAttributeForElementIndex(index, selectionAttribute, 'true');
1228
- this.selectedIndex = index;
1229
- // If the selected value has changed through user interaction,
1230
- // we want to notify the selection change to the adapter.
1231
- if (options.isUserInteraction && !options.forceUpdate) {
1232
- this.adapter.notifySelectionChange([index]);
1233
- }
1234
- };
1235
- MDCListFoundation.prototype.setCheckboxAtIndex = function (index, options) {
1236
- if (options === void 0) { options = {}; }
1237
- var currentIndex = this.selectedIndex;
1238
- // If this update is not triggered by a user interaction, we do not
1239
- // need to know about the currently selected indices and can avoid
1240
- // constructing the `Set` for performance reasons.
1241
- var currentlySelected = options.isUserInteraction ?
1242
- new Set(currentIndex === numbers$2.UNSET_INDEX ? [] :
1243
- currentIndex) :
1244
- null;
1245
- var selectionAttribute = this.getSelectionAttribute();
1246
- var changedIndices = [];
1247
- for (var i = 0; i < this.adapter.getListItemCount(); i++) {
1248
- var previousIsChecked = currentlySelected === null || currentlySelected === void 0 ? void 0 : currentlySelected.has(i);
1249
- var newIsChecked = index.indexOf(i) >= 0;
1250
- // If the selection has changed for this item, we keep track of it
1251
- // so that we can notify the adapter.
1252
- if (newIsChecked !== previousIsChecked) {
1253
- changedIndices.push(i);
1254
- }
1255
- this.adapter.setCheckedCheckboxOrRadioAtIndex(i, newIsChecked);
1256
- this.adapter.setAttributeForElementIndex(i, selectionAttribute, newIsChecked ? 'true' : 'false');
1257
- }
1258
- this.selectedIndex = index;
1259
- // If the selected value has changed through user interaction,
1260
- // we want to notify the selection change to the adapter.
1261
- if (options.isUserInteraction && changedIndices.length) {
1262
- this.adapter.notifySelectionChange(changedIndices);
1263
- }
1264
- };
1265
- /**
1266
- * Toggles the state of all checkboxes in the given range (inclusive) based on
1267
- * the state of the checkbox at the `toggleIndex`. To determine whether to set
1268
- * the given range to checked or unchecked, read the value of the checkbox at
1269
- * the `toggleIndex` and negate it. Then apply that new checked state to all
1270
- * checkboxes in the range.
1271
- * @param fromIndex The start of the range of checkboxes to toggle
1272
- * @param toIndex The end of the range of checkboxes to toggle
1273
- * @param toggleIndex The index that will be used to determine the new state
1274
- * of the given checkbox range.
1275
- */
1276
- MDCListFoundation.prototype.toggleCheckboxRange = function (fromIndex, toIndex, toggleIndex) {
1277
- this.lastSelectedIndex = toggleIndex;
1278
- var currentlySelected = new Set(this.selectedIndex === numbers$2.UNSET_INDEX ?
1279
- [] :
1280
- this.selectedIndex);
1281
- var newIsChecked = !(currentlySelected === null || currentlySelected === void 0 ? void 0 : currentlySelected.has(toggleIndex));
1282
- var _a = component.__read([fromIndex, toIndex].sort(), 2), startIndex = _a[0], endIndex = _a[1];
1283
- var selectionAttribute = this.getSelectionAttribute();
1284
- var changedIndices = [];
1285
- for (var i = startIndex; i <= endIndex; i++) {
1286
- if (this.isIndexDisabled(i)) {
1287
- continue;
1288
- }
1289
- var previousIsChecked = currentlySelected.has(i);
1290
- // If the selection has changed for this item, we keep track of it
1291
- // so that we can notify the adapter.
1292
- if (newIsChecked !== previousIsChecked) {
1293
- changedIndices.push(i);
1294
- this.adapter.setCheckedCheckboxOrRadioAtIndex(i, newIsChecked);
1295
- this.adapter.setAttributeForElementIndex(i, selectionAttribute, "" + newIsChecked);
1296
- if (newIsChecked) {
1297
- currentlySelected.add(i);
1298
- }
1299
- else {
1300
- currentlySelected.delete(i);
1301
- }
1302
- }
1303
- }
1304
- // If the selected value has changed, update and notify the selection change
1305
- // to the adapter.
1306
- if (changedIndices.length) {
1307
- this.selectedIndex = component.__spreadArray([], component.__read(currentlySelected));
1308
- this.adapter.notifySelectionChange(changedIndices);
1309
- }
1310
- };
1311
- MDCListFoundation.prototype.setTabindexAtIndex = function (index) {
1312
- if (this.focusedItemIndex === numbers$2.UNSET_INDEX && index !== 0) {
1313
- // If some list item was selected set first list item's tabindex to -1.
1314
- // Generally, tabindex is set to 0 on first list item of list that has no
1315
- // preselected items.
1316
- this.adapter.setAttributeForElementIndex(0, 'tabindex', '-1');
1317
- }
1318
- else if (this.focusedItemIndex >= 0 && this.focusedItemIndex !== index) {
1319
- this.adapter.setAttributeForElementIndex(this.focusedItemIndex, 'tabindex', '-1');
1320
- }
1321
- // Set the previous selection's tabindex to -1. We need this because
1322
- // in selection menus that are not visible, programmatically setting an
1323
- // option will not change focus but will change where tabindex should be 0.
1324
- if (!(this.selectedIndex instanceof Array) &&
1325
- this.selectedIndex !== index) {
1326
- this.adapter.setAttributeForElementIndex(this.selectedIndex, 'tabindex', '-1');
1327
- }
1328
- if (index !== numbers$2.UNSET_INDEX) {
1329
- this.adapter.setAttributeForElementIndex(index, 'tabindex', '0');
1330
- }
1331
- };
1332
- /**
1333
- * @return Return true if it is single selectin list, checkbox list or radio
1334
- * list.
1335
- */
1336
- MDCListFoundation.prototype.isSelectableList = function () {
1337
- return this.isSingleSelectionList || this.isCheckboxList ||
1338
- this.isRadioList;
1339
- };
1340
- MDCListFoundation.prototype.setTabindexToFirstSelectedOrFocusedItem = function () {
1341
- var targetIndex = this.getFirstSelectedOrFocusedItemIndex();
1342
- this.setTabindexAtIndex(targetIndex);
1343
- };
1344
- MDCListFoundation.prototype.getFirstSelectedOrFocusedItemIndex = function () {
1345
- // Action lists retain focus on the most recently focused item.
1346
- if (!this.isSelectableList()) {
1347
- return Math.max(this.focusedItemIndex, 0);
1348
- }
1349
- // Single-selection lists focus the selected item.
1350
- if (typeof this.selectedIndex === 'number' &&
1351
- this.selectedIndex !== numbers$2.UNSET_INDEX) {
1352
- return this.selectedIndex;
1353
- }
1354
- // Multiple-selection lists focus the first selected item.
1355
- if (isNumberArray(this.selectedIndex) && this.selectedIndex.length > 0) {
1356
- return this.selectedIndex.reduce(function (minIndex, currentIndex) { return Math.min(minIndex, currentIndex); });
1357
- }
1358
- // Selection lists without a selection focus the first item.
1359
- return 0;
1360
- };
1361
- MDCListFoundation.prototype.isIndexValid = function (index, validateListType) {
1362
- var _this = this;
1363
- if (validateListType === void 0) { validateListType = true; }
1364
- if (index instanceof Array) {
1365
- if (!this.isCheckboxList && validateListType) {
1366
- throw new Error('MDCListFoundation: Array of index is only supported for checkbox based list');
1367
- }
1368
- if (index.length === 0) {
1369
- return true;
1370
- }
1371
- else {
1372
- return index.some(function (i) { return _this.isIndexInRange(i); });
1373
- }
1374
- }
1375
- else if (typeof index === 'number') {
1376
- if (this.isCheckboxList && validateListType) {
1377
- throw new Error("MDCListFoundation: Expected array of index for checkbox based list but got number: " + index);
1378
- }
1379
- return this.isIndexInRange(index) ||
1380
- this.isSingleSelectionList && index === numbers$2.UNSET_INDEX;
1381
- }
1382
- else {
1383
- return false;
1384
- }
1385
- };
1386
- MDCListFoundation.prototype.isIndexInRange = function (index) {
1387
- var listSize = this.adapter.getListItemCount();
1388
- return index >= 0 && index < listSize;
1389
- };
1390
- /**
1391
- * Sets selected index on user action, toggles checkboxes in checkbox lists
1392
- * by default, unless `isCheckboxAlreadyUpdatedInAdapter` is set to `true`.
1393
- *
1394
- * In cases where `isCheckboxAlreadyUpdatedInAdapter` is set to `true`, the
1395
- * UI is just updated to reflect the value returned by the adapter.
1396
- *
1397
- * When calling this, make sure user interaction does not toggle disabled
1398
- * list items.
1399
- */
1400
- MDCListFoundation.prototype.setSelectedIndexOnAction = function (index, isCheckboxAlreadyUpdatedInAdapter) {
1401
- this.lastSelectedIndex = index;
1402
- if (this.isCheckboxList) {
1403
- this.toggleCheckboxAtIndex(index, isCheckboxAlreadyUpdatedInAdapter);
1404
- this.adapter.notifySelectionChange([index]);
1405
- }
1406
- else {
1407
- this.setSelectedIndex(index, { isUserInteraction: true });
1408
- }
1409
- };
1410
- MDCListFoundation.prototype.toggleCheckboxAtIndex = function (index, isCheckboxAlreadyUpdatedInAdapter) {
1411
- var selectionAttribute = this.getSelectionAttribute();
1412
- var adapterIsChecked = this.adapter.isCheckboxCheckedAtIndex(index);
1413
- // By default the checked value from the adapter is toggled unless the
1414
- // checked state in the adapter has already been updated beforehand.
1415
- // This can be happen when the underlying native checkbox has already
1416
- // been updated through the native click event.
1417
- var newCheckedValue;
1418
- if (isCheckboxAlreadyUpdatedInAdapter) {
1419
- newCheckedValue = adapterIsChecked;
1420
- }
1421
- else {
1422
- newCheckedValue = !adapterIsChecked;
1423
- this.adapter.setCheckedCheckboxOrRadioAtIndex(index, newCheckedValue);
1424
- }
1425
- this.adapter.setAttributeForElementIndex(index, selectionAttribute, newCheckedValue ? 'true' : 'false');
1426
- // If none of the checkbox items are selected and selectedIndex is not
1427
- // initialized then provide a default value.
1428
- var selectedIndexes = this.selectedIndex === numbers$2.UNSET_INDEX ?
1429
- [] :
1430
- this.selectedIndex.slice();
1431
- if (newCheckedValue) {
1432
- selectedIndexes.push(index);
1433
- }
1434
- else {
1435
- selectedIndexes = selectedIndexes.filter(function (i) { return i !== index; });
1436
- }
1437
- this.selectedIndex = selectedIndexes;
1438
- };
1439
- MDCListFoundation.prototype.focusItemAtIndex = function (index) {
1440
- this.adapter.focusItemAtIndex(index);
1441
- this.focusedItemIndex = index;
1442
- };
1443
- MDCListFoundation.prototype.checkboxListToggleAll = function (currentlySelectedIndexes, isUserInteraction) {
1444
- var count = this.adapter.getListItemCount();
1445
- // If all items are selected, deselect everything.
1446
- if (currentlySelectedIndexes.length === count) {
1447
- this.setCheckboxAtIndex([], { isUserInteraction: isUserInteraction });
1448
- }
1449
- else {
1450
- // Otherwise select all enabled options.
1451
- var allIndexes = [];
1452
- for (var i = 0; i < count; i++) {
1453
- if (!this.isIndexDisabled(i) ||
1454
- currentlySelectedIndexes.indexOf(i) > -1) {
1455
- allIndexes.push(i);
1456
- }
1457
- }
1458
- this.setCheckboxAtIndex(allIndexes, { isUserInteraction: isUserInteraction });
1459
- }
1460
- };
1461
- /**
1462
- * Given the next desired character from the user, adds it to the typeahead
1463
- * buffer. Then, attempts to find the next option matching the buffer. Wraps
1464
- * around if at the end of options.
1465
- *
1466
- * @param nextChar The next character to add to the prefix buffer.
1467
- * @param startingIndex The index from which to start matching. Only relevant
1468
- * when starting a new match sequence. To start a new match sequence,
1469
- * clear the buffer using `clearTypeaheadBuffer`, or wait for the buffer
1470
- * to clear after a set interval defined in list foundation. Defaults to
1471
- * the currently focused index.
1472
- * @return The index of the matched item, or -1 if no match.
1473
- */
1474
- MDCListFoundation.prototype.typeaheadMatchItem = function (nextChar, startingIndex, skipFocus) {
1475
- var _this = this;
1476
- if (skipFocus === void 0) { skipFocus = false; }
1477
- var opts = {
1478
- focusItemAtIndex: function (index) {
1479
- _this.focusItemAtIndex(index);
1480
- },
1481
- focusedItemIndex: startingIndex ? startingIndex : this.focusedItemIndex,
1482
- nextChar: nextChar,
1483
- sortedIndexByFirstChar: this.sortedIndexByFirstChar,
1484
- skipFocus: skipFocus,
1485
- isItemAtIndexDisabled: function (index) { return _this.isIndexDisabled(index); }
1486
- };
1487
- return matchItem(opts, this.typeaheadState);
1488
- };
1489
- /**
1490
- * Initializes the MDCListTextAndIndex data structure by indexing the current
1491
- * list items by primary text.
1492
- *
1493
- * @return The primary texts of all the list items sorted by first character.
1494
- */
1495
- MDCListFoundation.prototype.typeaheadInitSortedIndex = function () {
1496
- return initSortedIndex(this.adapter.getListItemCount(), this.adapter.getPrimaryTextAtIndex);
1497
- };
1498
- /**
1499
- * Clears the typeahead buffer.
1500
- */
1501
- MDCListFoundation.prototype.clearTypeaheadBuffer = function () {
1502
- clearBuffer(this.typeaheadState);
1503
- };
1504
- return MDCListFoundation;
1505
- }(component.MDCFoundation));
1506
-
1507
- /**
1508
- * @license
1509
- * Copyright 2018 Google Inc.
1510
- *
1511
- * Permission is hereby granted, free of charge, to any person obtaining a copy
1512
- * of this software and associated documentation files (the "Software"), to deal
1513
- * in the Software without restriction, including without limitation the rights
1514
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
1515
- * copies of the Software, and to permit persons to whom the Software is
1516
- * furnished to do so, subject to the following conditions:
1517
- *
1518
- * The above copyright notice and this permission notice shall be included in
1519
- * all copies or substantial portions of the Software.
1520
- *
1521
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
1522
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
1523
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
1524
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
1525
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
1526
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
1527
- * THE SOFTWARE.
1528
- */
1529
- var MDCList = /** @class */ (function (_super) {
1530
- component.__extends(MDCList, _super);
1531
- function MDCList() {
1532
- return _super !== null && _super.apply(this, arguments) || this;
1533
- }
1534
- Object.defineProperty(MDCList.prototype, "vertical", {
1535
- set: function (value) {
1536
- this.foundation.setVerticalOrientation(value);
1537
- },
1538
- enumerable: false,
1539
- configurable: true
1540
- });
1541
- Object.defineProperty(MDCList.prototype, "listElements", {
1542
- get: function () {
1543
- return Array.from(this.root.querySelectorAll("." + this.classNameMap[cssClasses$3.LIST_ITEM_CLASS]));
1544
- },
1545
- enumerable: false,
1546
- configurable: true
1547
- });
1548
- Object.defineProperty(MDCList.prototype, "wrapFocus", {
1549
- set: function (value) {
1550
- this.foundation.setWrapFocus(value);
1551
- },
1552
- enumerable: false,
1553
- configurable: true
1554
- });
1555
- Object.defineProperty(MDCList.prototype, "typeaheadInProgress", {
1556
- /**
1557
- * @return Whether typeahead is currently matching a user-specified prefix.
1558
- */
1559
- get: function () {
1560
- return this.foundation.isTypeaheadInProgress();
1561
- },
1562
- enumerable: false,
1563
- configurable: true
1564
- });
1565
- Object.defineProperty(MDCList.prototype, "hasTypeahead", {
1566
- /**
1567
- * Sets whether typeahead functionality is enabled on the list.
1568
- * @param hasTypeahead Whether typeahead is enabled.
1569
- */
1570
- set: function (hasTypeahead) {
1571
- this.foundation.setHasTypeahead(hasTypeahead);
1572
- },
1573
- enumerable: false,
1574
- configurable: true
1575
- });
1576
- Object.defineProperty(MDCList.prototype, "singleSelection", {
1577
- set: function (isSingleSelectionList) {
1578
- this.foundation.setSingleSelection(isSingleSelectionList);
1579
- },
1580
- enumerable: false,
1581
- configurable: true
1582
- });
1583
- Object.defineProperty(MDCList.prototype, "disabledItemsFocusable", {
1584
- set: function (areDisabledItemsFocusable) {
1585
- this.foundation.setDisabledItemsFocusable(areDisabledItemsFocusable);
1586
- },
1587
- enumerable: false,
1588
- configurable: true
1589
- });
1590
- Object.defineProperty(MDCList.prototype, "selectedIndex", {
1591
- get: function () {
1592
- return this.foundation.getSelectedIndex();
1593
- },
1594
- set: function (index) {
1595
- this.foundation.setSelectedIndex(index);
1596
- },
1597
- enumerable: false,
1598
- configurable: true
1599
- });
1600
- MDCList.attachTo = function (root) {
1601
- return new MDCList(root);
1602
- };
1603
- MDCList.prototype.initialSyncWithDOM = function () {
1604
- this.isEvolutionEnabled =
1605
- evolutionAttribute in this.root.dataset;
1606
- if (this.isEvolutionEnabled) {
1607
- this.classNameMap = evolutionClassNameMap;
1608
- }
1609
- else if (component.matches(this.root, strings$4.DEPRECATED_SELECTOR)) {
1610
- this.classNameMap = deprecatedClassNameMap;
1611
- }
1612
- else {
1613
- this.classNameMap =
1614
- Object.values(cssClasses$3)
1615
- .reduce(function (obj, className) {
1616
- obj[className] = className;
1617
- return obj;
1618
- }, {});
1619
- }
1620
- this.handleClick = this.handleClickEvent.bind(this);
1621
- this.handleKeydown = this.handleKeydownEvent.bind(this);
1622
- this.focusInEventListener = this.handleFocusInEvent.bind(this);
1623
- this.focusOutEventListener = this.handleFocusOutEvent.bind(this);
1624
- this.listen('keydown', this.handleKeydown);
1625
- this.listen('click', this.handleClick);
1626
- this.listen('focusin', this.focusInEventListener);
1627
- this.listen('focusout', this.focusOutEventListener);
1628
- this.layout();
1629
- this.initializeListType();
1630
- this.ensureFocusable();
1631
- };
1632
- MDCList.prototype.destroy = function () {
1633
- this.unlisten('keydown', this.handleKeydown);
1634
- this.unlisten('click', this.handleClick);
1635
- this.unlisten('focusin', this.focusInEventListener);
1636
- this.unlisten('focusout', this.focusOutEventListener);
1637
- };
1638
- MDCList.prototype.layout = function () {
1639
- var direction = this.root.getAttribute(strings$4.ARIA_ORIENTATION);
1640
- this.vertical = direction !== strings$4.ARIA_ORIENTATION_HORIZONTAL;
1641
- var itemSelector = "." + this.classNameMap[cssClasses$3.LIST_ITEM_CLASS] + ":not([tabindex])";
1642
- var childSelector = strings$4.FOCUSABLE_CHILD_ELEMENTS;
1643
- // List items need to have at least tabindex=-1 to be focusable.
1644
- var itemEls = this.root.querySelectorAll(itemSelector);
1645
- if (itemEls.length) {
1646
- Array.prototype.forEach.call(itemEls, function (el) {
1647
- el.setAttribute('tabindex', '-1');
1648
- });
1649
- }
1650
- // Child button/a elements are not tabbable until the list item is focused.
1651
- var focusableChildEls = this.root.querySelectorAll(childSelector);
1652
- if (focusableChildEls.length) {
1653
- Array.prototype.forEach.call(focusableChildEls, function (el) {
1654
- el.setAttribute('tabindex', '-1');
1655
- });
1656
- }
1657
- if (this.isEvolutionEnabled) {
1658
- this.foundation.setUseSelectedAttribute(true);
1659
- }
1660
- this.foundation.layout();
1661
- };
1662
- /**
1663
- * Extracts the primary text from a list item.
1664
- * @param item The list item element.
1665
- * @return The primary text in the element.
1666
- */
1667
- MDCList.prototype.getPrimaryText = function (item) {
1668
- var _a;
1669
- var primaryText = item.querySelector("." + this.classNameMap[cssClasses$3.LIST_ITEM_PRIMARY_TEXT_CLASS]);
1670
- if (this.isEvolutionEnabled || primaryText) {
1671
- return (_a = primaryText === null || primaryText === void 0 ? void 0 : primaryText.textContent) !== null && _a !== void 0 ? _a : '';
1672
- }
1673
- var singleLineText = item.querySelector("." + this.classNameMap[cssClasses$3.LIST_ITEM_TEXT_CLASS]);
1674
- return (singleLineText && singleLineText.textContent) || '';
1675
- };
1676
- /**
1677
- * Initialize selectedIndex value based on pre-selected list items.
1678
- */
1679
- MDCList.prototype.initializeListType = function () {
1680
- var _this = this;
1681
- this.isInteractive =
1682
- component.matches(this.root, strings$4.ARIA_INTERACTIVE_ROLES_SELECTOR);
1683
- if (this.isEvolutionEnabled && this.isInteractive) {
1684
- var selection = Array.from(this.root.querySelectorAll(strings$4.SELECTED_ITEM_SELECTOR), function (listItem) { return _this.listElements.indexOf(listItem); });
1685
- if (component.matches(this.root, strings$4.ARIA_MULTI_SELECTABLE_SELECTOR)) {
1686
- this.selectedIndex = selection;
1687
- }
1688
- else if (selection.length > 0) {
1689
- this.selectedIndex = selection[0];
1690
- }
1691
- return;
1692
- }
1693
- var checkboxListItems = this.root.querySelectorAll(strings$4.ARIA_ROLE_CHECKBOX_SELECTOR);
1694
- var radioSelectedListItem = this.root.querySelector(strings$4.ARIA_CHECKED_RADIO_SELECTOR);
1695
- if (checkboxListItems.length) {
1696
- var preselectedItems = this.root.querySelectorAll(strings$4.ARIA_CHECKED_CHECKBOX_SELECTOR);
1697
- this.selectedIndex = Array.from(preselectedItems, function (listItem) { return _this.listElements.indexOf(listItem); });
1698
- }
1699
- else if (radioSelectedListItem) {
1700
- this.selectedIndex = this.listElements.indexOf(radioSelectedListItem);
1701
- }
1702
- };
1703
- /**
1704
- * Updates the list item at itemIndex to the desired isEnabled state.
1705
- * @param itemIndex Index of the list item
1706
- * @param isEnabled Sets the list item to enabled or disabled.
1707
- */
1708
- MDCList.prototype.setEnabled = function (itemIndex, isEnabled) {
1709
- this.foundation.setEnabled(itemIndex, isEnabled);
1710
- };
1711
- /**
1712
- * Given the next desired character from the user, adds it to the typeahead
1713
- * buffer. Then, attempts to find the next option matching the buffer. Wraps
1714
- * around if at the end of options.
1715
- *
1716
- * @param nextChar The next character to add to the prefix buffer.
1717
- * @param startingIndex The index from which to start matching. Defaults to
1718
- * the currently focused index.
1719
- * @return The index of the matched item.
1720
- */
1721
- MDCList.prototype.typeaheadMatchItem = function (nextChar, startingIndex) {
1722
- return this.foundation.typeaheadMatchItem(nextChar, startingIndex, /** skipFocus */ true);
1723
- };
1724
- MDCList.prototype.getDefaultFoundation = function () {
1725
- var _this = this;
1726
- // DO NOT INLINE this variable. For backward compatibility, foundations take
1727
- // a Partial<MDCFooAdapter>. To ensure we don't accidentally omit any
1728
- // methods, we need a separate, strongly typed adapter variable.
1729
- var adapter = {
1730
- addClassForElementIndex: function (index, className) {
1731
- var element = _this.listElements[index];
1732
- if (element) {
1733
- element.classList.add(_this.classNameMap[className]);
1734
- }
1735
- },
1736
- focusItemAtIndex: function (index) {
1737
- var element = _this.listElements[index];
1738
- if (element) {
1739
- element.focus();
1740
- }
1741
- },
1742
- getAttributeForElementIndex: function (index, attr) {
1743
- return _this.listElements[index].getAttribute(attr);
1744
- },
1745
- getFocusedElementIndex: function () {
1746
- return _this.listElements.indexOf(document.activeElement);
1747
- },
1748
- getListItemCount: function () { return _this.listElements.length; },
1749
- getPrimaryTextAtIndex: function (index) {
1750
- return _this.getPrimaryText(_this.listElements[index]);
1751
- },
1752
- hasCheckboxAtIndex: function (index) {
1753
- var listItem = _this.listElements[index];
1754
- return !!listItem.querySelector(strings$4.CHECKBOX_SELECTOR);
1755
- },
1756
- hasRadioAtIndex: function (index) {
1757
- var listItem = _this.listElements[index];
1758
- return !!listItem.querySelector(strings$4.RADIO_SELECTOR);
1759
- },
1760
- isCheckboxCheckedAtIndex: function (index) {
1761
- var listItem = _this.listElements[index];
1762
- var toggleEl = listItem.querySelector(strings$4.CHECKBOX_SELECTOR);
1763
- return toggleEl.checked;
1764
- },
1765
- isFocusInsideList: function () {
1766
- return _this.root !== document.activeElement &&
1767
- _this.root.contains(document.activeElement);
1768
- },
1769
- isRootFocused: function () { return document.activeElement === _this.root; },
1770
- listItemAtIndexHasClass: function (index, className) {
1771
- return _this.listElements[index].classList.contains(_this.classNameMap[className]);
1772
- },
1773
- notifyAction: function (index) {
1774
- _this.emit(strings$4.ACTION_EVENT, { index: index }, /** shouldBubble */ true);
1775
- },
1776
- notifySelectionChange: function (changedIndices) {
1777
- _this.emit(strings$4.SELECTION_CHANGE_EVENT, { changedIndices: changedIndices }, /** shouldBubble */ true);
1778
- },
1779
- removeClassForElementIndex: function (index, className) {
1780
- var element = _this.listElements[index];
1781
- if (element) {
1782
- element.classList.remove(_this.classNameMap[className]);
1783
- }
1784
- },
1785
- setAttributeForElementIndex: function (index, attr, value) {
1786
- var element = _this.listElements[index];
1787
- if (element) {
1788
- element.setAttribute(attr, value);
1789
- }
1790
- },
1791
- setCheckedCheckboxOrRadioAtIndex: function (index, isChecked) {
1792
- var listItem = _this.listElements[index];
1793
- var toggleEl = listItem.querySelector(strings$4.CHECKBOX_RADIO_SELECTOR);
1794
- toggleEl.checked = isChecked;
1795
- var event = document.createEvent('Event');
1796
- event.initEvent('change', true, true);
1797
- toggleEl.dispatchEvent(event);
1798
- },
1799
- setTabIndexForListItemChildren: function (listItemIndex, tabIndexValue) {
1800
- var element = _this.listElements[listItemIndex];
1801
- var selector = strings$4.CHILD_ELEMENTS_TO_TOGGLE_TABINDEX;
1802
- Array.prototype.forEach.call(element.querySelectorAll(selector), function (el) {
1803
- el.setAttribute('tabindex', tabIndexValue);
1804
- });
1805
- },
1806
- };
1807
- return new MDCListFoundation(adapter);
1808
- };
1809
- /**
1810
- * Ensures that at least one item is focusable if the list is interactive and
1811
- * doesn't specify a suitable tabindex.
1812
- */
1813
- MDCList.prototype.ensureFocusable = function () {
1814
- if (this.isEvolutionEnabled && this.isInteractive) {
1815
- if (!this.root.querySelector("." + this.classNameMap[cssClasses$3.LIST_ITEM_CLASS] + "[tabindex=\"0\"]")) {
1816
- var index = this.initialFocusIndex();
1817
- if (index !== -1) {
1818
- this.listElements[index].tabIndex = 0;
1819
- }
1820
- }
1821
- }
1822
- };
1823
- MDCList.prototype.initialFocusIndex = function () {
1824
- if (this.selectedIndex instanceof Array && this.selectedIndex.length > 0) {
1825
- return this.selectedIndex[0];
1826
- }
1827
- if (typeof this.selectedIndex === 'number' &&
1828
- this.selectedIndex !== numbers$2.UNSET_INDEX) {
1829
- return this.selectedIndex;
1830
- }
1831
- var el = this.root.querySelector("." + this.classNameMap[cssClasses$3.LIST_ITEM_CLASS] + ":not(." + this.classNameMap[cssClasses$3.LIST_ITEM_DISABLED_CLASS] + ")");
1832
- if (el === null) {
1833
- return -1;
1834
- }
1835
- return this.getListItemIndex(el);
1836
- };
1837
- /**
1838
- * Used to figure out which list item this event is targetting. Or returns -1
1839
- * if there is no list item
1840
- */
1841
- MDCList.prototype.getListItemIndex = function (el) {
1842
- var nearestParent = component.closest(el, "." + this.classNameMap[cssClasses$3.LIST_ITEM_CLASS] + ", ." + this.classNameMap[cssClasses$3.ROOT]);
1843
- // Get the index of the element if it is a list item.
1844
- if (nearestParent &&
1845
- component.matches(nearestParent, "." + this.classNameMap[cssClasses$3.LIST_ITEM_CLASS])) {
1846
- return this.listElements.indexOf(nearestParent);
1847
- }
1848
- return -1;
1849
- };
1850
- /**
1851
- * Used to figure out which element was clicked before sending the event to
1852
- * the foundation.
1853
- */
1854
- MDCList.prototype.handleFocusInEvent = function (evt) {
1855
- var index = this.getListItemIndex(evt.target);
1856
- this.foundation.handleFocusIn(index);
1857
- };
1858
- /**
1859
- * Used to figure out which element was clicked before sending the event to
1860
- * the foundation.
1861
- */
1862
- MDCList.prototype.handleFocusOutEvent = function (evt) {
1863
- var index = this.getListItemIndex(evt.target);
1864
- this.foundation.handleFocusOut(index);
1865
- };
1866
- /**
1867
- * Used to figure out which element was focused when keydown event occurred
1868
- * before sending the event to the foundation.
1869
- */
1870
- MDCList.prototype.handleKeydownEvent = function (evt) {
1871
- var index = this.getListItemIndex(evt.target);
1872
- var target = evt.target;
1873
- this.foundation.handleKeydown(evt, target.classList.contains(this.classNameMap[cssClasses$3.LIST_ITEM_CLASS]), index);
1874
- };
1875
- /**
1876
- * Used to figure out which element was clicked before sending the event to
1877
- * the foundation.
1878
- */
1879
- MDCList.prototype.handleClickEvent = function (evt) {
1880
- var index = this.getListItemIndex(evt.target);
1881
- var target = evt.target;
1882
- // Toggle the checkbox only if it's not the target of the event, or the
1883
- // checkbox will have 2 change events.
1884
- var toggleCheckbox = !component.matches(target, strings$4.CHECKBOX_RADIO_SELECTOR);
1885
- this.foundation.handleClick(index, toggleCheckbox, evt);
1886
- };
1887
- return MDCList;
1888
- }(component.MDCComponent));
1889
-
1890
- /**
1891
- * @license
1892
- * Copyright 2018 Google Inc.
1893
- *
1894
- * Permission is hereby granted, free of charge, to any person obtaining a copy
1895
- * of this software and associated documentation files (the "Software"), to deal
1896
- * in the Software without restriction, including without limitation the rights
1897
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
1898
- * copies of the Software, and to permit persons to whom the Software is
1899
- * furnished to do so, subject to the following conditions:
1900
- *
1901
- * The above copyright notice and this permission notice shall be included in
1902
- * all copies or substantial portions of the Software.
1903
- *
1904
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
1905
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
1906
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
1907
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
1908
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
1909
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
1910
- * THE SOFTWARE.
1911
- */
1912
- var MDCMenuSurfaceFoundation = /** @class */ (function (_super) {
1913
- component.__extends(MDCMenuSurfaceFoundation, _super);
1914
- function MDCMenuSurfaceFoundation(adapter) {
1915
- var _this = _super.call(this, component.__assign(component.__assign({}, MDCMenuSurfaceFoundation.defaultAdapter), adapter)) || this;
1916
- _this.isSurfaceOpen = false;
1917
- _this.isQuickOpen = false;
1918
- _this.isHoistedElement = false;
1919
- _this.isFixedPosition = false;
1920
- _this.isHorizontallyCenteredOnViewport = false;
1921
- _this.maxHeight = 0;
1922
- _this.openBottomBias = 0;
1923
- _this.openAnimationEndTimerId = 0;
1924
- _this.closeAnimationEndTimerId = 0;
1925
- _this.animationRequestId = 0;
1926
- _this.anchorCorner = Corner.TOP_START;
1927
- /**
1928
- * Corner of the menu surface to which menu surface is attached to anchor.
1929
- *
1930
- * Anchor corner --->+----------+
1931
- * | ANCHOR |
1932
- * +----------+
1933
- * Origin corner --->+--------------+
1934
- * | |
1935
- * | |
1936
- * | MENU SURFACE |
1937
- * | |
1938
- * | |
1939
- * +--------------+
1940
- */
1941
- _this.originCorner = Corner.TOP_START;
1942
- _this.anchorMargin = { top: 0, right: 0, bottom: 0, left: 0 };
1943
- _this.position = { x: 0, y: 0 };
1944
- return _this;
1945
- }
1946
- Object.defineProperty(MDCMenuSurfaceFoundation, "cssClasses", {
1947
- get: function () {
1948
- return cssClasses$4;
1949
- },
1950
- enumerable: false,
1951
- configurable: true
1952
- });
1953
- Object.defineProperty(MDCMenuSurfaceFoundation, "strings", {
1954
- get: function () {
1955
- return strings$5;
1956
- },
1957
- enumerable: false,
1958
- configurable: true
1959
- });
1960
- Object.defineProperty(MDCMenuSurfaceFoundation, "numbers", {
1961
- get: function () {
1962
- return numbers$3;
1963
- },
1964
- enumerable: false,
1965
- configurable: true
1966
- });
1967
- Object.defineProperty(MDCMenuSurfaceFoundation, "Corner", {
1968
- get: function () {
1969
- return Corner;
1970
- },
1971
- enumerable: false,
1972
- configurable: true
1973
- });
1974
- Object.defineProperty(MDCMenuSurfaceFoundation, "defaultAdapter", {
1975
- /**
1976
- * @see {@link MDCMenuSurfaceAdapter} for typing information on parameters and return types.
1977
- */
1978
- get: function () {
1979
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
1980
- return {
1981
- addClass: function () { return undefined; },
1982
- removeClass: function () { return undefined; },
1983
- hasClass: function () { return false; },
1984
- hasAnchor: function () { return false; },
1985
- isElementInContainer: function () { return false; },
1986
- isFocused: function () { return false; },
1987
- isRtl: function () { return false; },
1988
- getInnerDimensions: function () { return ({ height: 0, width: 0 }); },
1989
- getAnchorDimensions: function () { return null; },
1990
- getWindowDimensions: function () { return ({ height: 0, width: 0 }); },
1991
- getBodyDimensions: function () { return ({ height: 0, width: 0 }); },
1992
- getWindowScroll: function () { return ({ x: 0, y: 0 }); },
1993
- setPosition: function () { return undefined; },
1994
- setMaxHeight: function () { return undefined; },
1995
- setTransformOrigin: function () { return undefined; },
1996
- saveFocus: function () { return undefined; },
1997
- restoreFocus: function () { return undefined; },
1998
- notifyClose: function () { return undefined; },
1999
- notifyClosing: function () { return undefined; },
2000
- notifyOpen: function () { return undefined; },
2001
- notifyOpening: function () { return undefined; },
2002
- };
2003
- // tslint:enable:object-literal-sort-keys
2004
- },
2005
- enumerable: false,
2006
- configurable: true
2007
- });
2008
- MDCMenuSurfaceFoundation.prototype.init = function () {
2009
- var _a = MDCMenuSurfaceFoundation.cssClasses, ROOT = _a.ROOT, OPEN = _a.OPEN;
2010
- if (!this.adapter.hasClass(ROOT)) {
2011
- throw new Error(ROOT + " class required in root element.");
2012
- }
2013
- if (this.adapter.hasClass(OPEN)) {
2014
- this.isSurfaceOpen = true;
2015
- }
2016
- };
2017
- MDCMenuSurfaceFoundation.prototype.destroy = function () {
2018
- clearTimeout(this.openAnimationEndTimerId);
2019
- clearTimeout(this.closeAnimationEndTimerId);
2020
- // Cancel any currently running animations.
2021
- cancelAnimationFrame(this.animationRequestId);
2022
- };
2023
- /**
2024
- * @param corner Default anchor corner alignment of top-left menu surface
2025
- * corner.
2026
- */
2027
- MDCMenuSurfaceFoundation.prototype.setAnchorCorner = function (corner) {
2028
- this.anchorCorner = corner;
2029
- };
2030
- /**
2031
- * Flip menu corner horizontally.
2032
- */
2033
- MDCMenuSurfaceFoundation.prototype.flipCornerHorizontally = function () {
2034
- this.originCorner = this.originCorner ^ CornerBit.RIGHT;
2035
- };
2036
- /**
2037
- * @param margin Set of margin values from anchor.
2038
- */
2039
- MDCMenuSurfaceFoundation.prototype.setAnchorMargin = function (margin) {
2040
- this.anchorMargin.top = margin.top || 0;
2041
- this.anchorMargin.right = margin.right || 0;
2042
- this.anchorMargin.bottom = margin.bottom || 0;
2043
- this.anchorMargin.left = margin.left || 0;
2044
- };
2045
- /** Used to indicate if the menu-surface is hoisted to the body. */
2046
- MDCMenuSurfaceFoundation.prototype.setIsHoisted = function (isHoisted) {
2047
- this.isHoistedElement = isHoisted;
2048
- };
2049
- /**
2050
- * Used to set the menu-surface calculations based on a fixed position menu.
2051
- */
2052
- MDCMenuSurfaceFoundation.prototype.setFixedPosition = function (isFixedPosition) {
2053
- this.isFixedPosition = isFixedPosition;
2054
- };
2055
- /**
2056
- * @return Returns true if menu is in fixed (`position: fixed`) position.
2057
- */
2058
- MDCMenuSurfaceFoundation.prototype.isFixed = function () {
2059
- return this.isFixedPosition;
2060
- };
2061
- /** Sets the menu-surface position on the page. */
2062
- MDCMenuSurfaceFoundation.prototype.setAbsolutePosition = function (x, y) {
2063
- this.position.x = this.isFinite(x) ? x : 0;
2064
- this.position.y = this.isFinite(y) ? y : 0;
2065
- };
2066
- /** Sets whether menu-surface should be horizontally centered to viewport. */
2067
- MDCMenuSurfaceFoundation.prototype.setIsHorizontallyCenteredOnViewport = function (isCentered) {
2068
- this.isHorizontallyCenteredOnViewport = isCentered;
2069
- };
2070
- MDCMenuSurfaceFoundation.prototype.setQuickOpen = function (quickOpen) {
2071
- this.isQuickOpen = quickOpen;
2072
- };
2073
- /**
2074
- * Sets maximum menu-surface height on open.
2075
- * @param maxHeight The desired max-height. Set to 0 (default) to
2076
- * automatically calculate max height based on available viewport space.
2077
- */
2078
- MDCMenuSurfaceFoundation.prototype.setMaxHeight = function (maxHeight) {
2079
- this.maxHeight = maxHeight;
2080
- };
2081
- /**
2082
- * Set to a positive integer to influence the menu to preferentially open
2083
- * below the anchor instead of above.
2084
- * @param bias A value of `x` simulates an extra `x` pixels of available space
2085
- * below the menu during positioning calculations.
2086
- */
2087
- MDCMenuSurfaceFoundation.prototype.setOpenBottomBias = function (bias) {
2088
- this.openBottomBias = bias;
2089
- };
2090
- MDCMenuSurfaceFoundation.prototype.isOpen = function () {
2091
- return this.isSurfaceOpen;
2092
- };
2093
- /**
2094
- * Open the menu surface.
2095
- */
2096
- MDCMenuSurfaceFoundation.prototype.open = function () {
2097
- var _this = this;
2098
- if (this.isSurfaceOpen) {
2099
- return;
2100
- }
2101
- this.adapter.notifyOpening();
2102
- this.adapter.saveFocus();
2103
- if (this.isQuickOpen) {
2104
- this.isSurfaceOpen = true;
2105
- this.adapter.addClass(MDCMenuSurfaceFoundation.cssClasses.OPEN);
2106
- this.dimensions = this.adapter.getInnerDimensions();
2107
- this.autoposition();
2108
- this.adapter.notifyOpen();
2109
- }
2110
- else {
2111
- this.adapter.addClass(MDCMenuSurfaceFoundation.cssClasses.ANIMATING_OPEN);
2112
- this.animationRequestId = requestAnimationFrame(function () {
2113
- _this.dimensions = _this.adapter.getInnerDimensions();
2114
- _this.autoposition();
2115
- _this.adapter.addClass(MDCMenuSurfaceFoundation.cssClasses.OPEN);
2116
- _this.openAnimationEndTimerId = setTimeout(function () {
2117
- _this.openAnimationEndTimerId = 0;
2118
- _this.adapter.removeClass(MDCMenuSurfaceFoundation.cssClasses.ANIMATING_OPEN);
2119
- _this.adapter.notifyOpen();
2120
- }, numbers$3.TRANSITION_OPEN_DURATION);
2121
- });
2122
- this.isSurfaceOpen = true;
2123
- }
2124
- };
2125
- /**
2126
- * Closes the menu surface.
2127
- */
2128
- MDCMenuSurfaceFoundation.prototype.close = function (skipRestoreFocus) {
2129
- var _this = this;
2130
- if (skipRestoreFocus === void 0) { skipRestoreFocus = false; }
2131
- if (!this.isSurfaceOpen) {
2132
- return;
2133
- }
2134
- this.adapter.notifyClosing();
2135
- if (this.isQuickOpen) {
2136
- this.isSurfaceOpen = false;
2137
- if (!skipRestoreFocus) {
2138
- this.maybeRestoreFocus();
2139
- }
2140
- this.adapter.removeClass(MDCMenuSurfaceFoundation.cssClasses.OPEN);
2141
- this.adapter.removeClass(MDCMenuSurfaceFoundation.cssClasses.IS_OPEN_BELOW);
2142
- this.adapter.notifyClose();
2143
- return;
2144
- }
2145
- this.adapter.addClass(MDCMenuSurfaceFoundation.cssClasses.ANIMATING_CLOSED);
2146
- requestAnimationFrame(function () {
2147
- _this.adapter.removeClass(MDCMenuSurfaceFoundation.cssClasses.OPEN);
2148
- _this.adapter.removeClass(MDCMenuSurfaceFoundation.cssClasses.IS_OPEN_BELOW);
2149
- _this.closeAnimationEndTimerId = setTimeout(function () {
2150
- _this.closeAnimationEndTimerId = 0;
2151
- _this.adapter.removeClass(MDCMenuSurfaceFoundation.cssClasses.ANIMATING_CLOSED);
2152
- _this.adapter.notifyClose();
2153
- }, numbers$3.TRANSITION_CLOSE_DURATION);
2154
- });
2155
- this.isSurfaceOpen = false;
2156
- if (!skipRestoreFocus) {
2157
- this.maybeRestoreFocus();
2158
- }
2159
- };
2160
- /** Handle clicks and close if not within menu-surface element. */
2161
- MDCMenuSurfaceFoundation.prototype.handleBodyClick = function (evt) {
2162
- var el = evt.target;
2163
- if (this.adapter.isElementInContainer(el)) {
2164
- return;
2165
- }
2166
- this.close();
2167
- };
2168
- /** Handle keys that close the surface. */
2169
- MDCMenuSurfaceFoundation.prototype.handleKeydown = function (evt) {
2170
- var keyCode = evt.keyCode, key = evt.key;
2171
- var isEscape = key === 'Escape' || keyCode === 27;
2172
- if (isEscape) {
2173
- this.close();
2174
- }
2175
- };
2176
- MDCMenuSurfaceFoundation.prototype.autoposition = function () {
2177
- var _a;
2178
- // Compute measurements for autoposition methods reuse.
2179
- this.measurements = this.getAutoLayoutmeasurements();
2180
- var corner = this.getoriginCorner();
2181
- var maxMenuSurfaceHeight = this.getMenuSurfaceMaxHeight(corner);
2182
- var verticalAlignment = this.hasBit(corner, CornerBit.BOTTOM) ? 'bottom' : 'top';
2183
- var horizontalAlignment = this.hasBit(corner, CornerBit.RIGHT) ? 'right' : 'left';
2184
- var horizontalOffset = this.getHorizontalOriginOffset(corner);
2185
- var verticalOffset = this.getVerticalOriginOffset(corner);
2186
- var _b = this.measurements, anchorSize = _b.anchorSize, surfaceSize = _b.surfaceSize;
2187
- var position = (_a = {},
2188
- _a[horizontalAlignment] = horizontalOffset,
2189
- _a[verticalAlignment] = verticalOffset,
2190
- _a);
2191
- // Center align when anchor width is comparable or greater than menu
2192
- // surface, otherwise keep corner.
2193
- if (anchorSize.width / surfaceSize.width >
2194
- numbers$3.ANCHOR_TO_MENU_SURFACE_WIDTH_RATIO) {
2195
- horizontalAlignment = 'center';
2196
- }
2197
- // If the menu-surface has been hoisted to the body, it's no longer relative
2198
- // to the anchor element
2199
- if (this.isHoistedElement || this.isFixedPosition) {
2200
- this.adjustPositionForHoistedElement(position);
2201
- }
2202
- this.adapter.setTransformOrigin(horizontalAlignment + " " + verticalAlignment);
2203
- this.adapter.setPosition(position);
2204
- this.adapter.setMaxHeight(maxMenuSurfaceHeight ? maxMenuSurfaceHeight + 'px' : '');
2205
- // If it is opened from the top then add is-open-below class
2206
- if (!this.hasBit(corner, CornerBit.BOTTOM)) {
2207
- this.adapter.addClass(MDCMenuSurfaceFoundation.cssClasses.IS_OPEN_BELOW);
2208
- }
2209
- };
2210
- /**
2211
- * @return Measurements used to position menu surface popup.
2212
- */
2213
- MDCMenuSurfaceFoundation.prototype.getAutoLayoutmeasurements = function () {
2214
- var anchorRect = this.adapter.getAnchorDimensions();
2215
- var bodySize = this.adapter.getBodyDimensions();
2216
- var viewportSize = this.adapter.getWindowDimensions();
2217
- var windowScroll = this.adapter.getWindowScroll();
2218
- if (!anchorRect) {
2219
- // tslint:disable:object-literal-sort-keys Positional properties are more readable when they're grouped together
2220
- anchorRect = {
2221
- top: this.position.y,
2222
- right: this.position.x,
2223
- bottom: this.position.y,
2224
- left: this.position.x,
2225
- width: 0,
2226
- height: 0,
2227
- };
2228
- // tslint:enable:object-literal-sort-keys
2229
- }
2230
- return {
2231
- anchorSize: anchorRect,
2232
- bodySize: bodySize,
2233
- surfaceSize: this.dimensions,
2234
- viewportDistance: {
2235
- // tslint:disable:object-literal-sort-keys Positional properties are more readable when they're grouped together
2236
- top: anchorRect.top,
2237
- right: viewportSize.width - anchorRect.right,
2238
- bottom: viewportSize.height - anchorRect.bottom,
2239
- left: anchorRect.left,
2240
- // tslint:enable:object-literal-sort-keys
2241
- },
2242
- viewportSize: viewportSize,
2243
- windowScroll: windowScroll,
2244
- };
2245
- };
2246
- /**
2247
- * Computes the corner of the anchor from which to animate and position the
2248
- * menu surface.
2249
- *
2250
- * Only LEFT or RIGHT bit is used to position the menu surface ignoring RTL
2251
- * context. E.g., menu surface will be positioned from right side on TOP_END.
2252
- */
2253
- MDCMenuSurfaceFoundation.prototype.getoriginCorner = function () {
2254
- var corner = this.originCorner;
2255
- var _a = this.measurements, viewportDistance = _a.viewportDistance, anchorSize = _a.anchorSize, surfaceSize = _a.surfaceSize;
2256
- var MARGIN_TO_EDGE = MDCMenuSurfaceFoundation.numbers.MARGIN_TO_EDGE;
2257
- var isAnchoredToBottom = this.hasBit(this.anchorCorner, CornerBit.BOTTOM);
2258
- var availableTop;
2259
- var availableBottom;
2260
- if (isAnchoredToBottom) {
2261
- availableTop =
2262
- viewportDistance.top - MARGIN_TO_EDGE + this.anchorMargin.bottom;
2263
- availableBottom =
2264
- viewportDistance.bottom - MARGIN_TO_EDGE - this.anchorMargin.bottom;
2265
- }
2266
- else {
2267
- availableTop =
2268
- viewportDistance.top - MARGIN_TO_EDGE + this.anchorMargin.top;
2269
- availableBottom = viewportDistance.bottom - MARGIN_TO_EDGE +
2270
- anchorSize.height - this.anchorMargin.top;
2271
- }
2272
- var isAvailableBottom = availableBottom - surfaceSize.height > 0;
2273
- if (!isAvailableBottom &&
2274
- availableTop > availableBottom + this.openBottomBias) {
2275
- // Attach bottom side of surface to the anchor.
2276
- corner = this.setBit(corner, CornerBit.BOTTOM);
2277
- }
2278
- var isRtl = this.adapter.isRtl();
2279
- var isFlipRtl = this.hasBit(this.anchorCorner, CornerBit.FLIP_RTL);
2280
- var hasRightBit = this.hasBit(this.anchorCorner, CornerBit.RIGHT) ||
2281
- this.hasBit(corner, CornerBit.RIGHT);
2282
- // Whether surface attached to right side of anchor element.
2283
- var isAnchoredToRight = false;
2284
- // Anchored to start
2285
- if (isRtl && isFlipRtl) {
2286
- isAnchoredToRight = !hasRightBit;
2287
- }
2288
- else {
2289
- // Anchored to right
2290
- isAnchoredToRight = hasRightBit;
2291
- }
2292
- var availableLeft;
2293
- var availableRight;
2294
- if (isAnchoredToRight) {
2295
- availableLeft =
2296
- viewportDistance.left + anchorSize.width + this.anchorMargin.right;
2297
- availableRight = viewportDistance.right - this.anchorMargin.right;
2298
- }
2299
- else {
2300
- availableLeft = viewportDistance.left + this.anchorMargin.left;
2301
- availableRight =
2302
- viewportDistance.right + anchorSize.width - this.anchorMargin.left;
2303
- }
2304
- var isAvailableLeft = availableLeft - surfaceSize.width > 0;
2305
- var isAvailableRight = availableRight - surfaceSize.width > 0;
2306
- var isOriginCornerAlignedToEnd = this.hasBit(corner, CornerBit.FLIP_RTL) &&
2307
- this.hasBit(corner, CornerBit.RIGHT);
2308
- if (isAvailableRight && isOriginCornerAlignedToEnd && isRtl ||
2309
- !isAvailableLeft && isOriginCornerAlignedToEnd) {
2310
- // Attach left side of surface to the anchor.
2311
- corner = this.unsetBit(corner, CornerBit.RIGHT);
2312
- }
2313
- else if (isAvailableLeft && isAnchoredToRight && isRtl ||
2314
- (isAvailableLeft && !isAnchoredToRight && hasRightBit) ||
2315
- (!isAvailableRight && availableLeft >= availableRight)) {
2316
- // Attach right side of surface to the anchor.
2317
- corner = this.setBit(corner, CornerBit.RIGHT);
2318
- }
2319
- return corner;
2320
- };
2321
- /**
2322
- * @param corner Origin corner of the menu surface.
2323
- * @return Maximum height of the menu surface, based on available space. 0
2324
- * indicates should not be set.
2325
- */
2326
- MDCMenuSurfaceFoundation.prototype.getMenuSurfaceMaxHeight = function (corner) {
2327
- if (this.maxHeight > 0) {
2328
- return this.maxHeight;
2329
- }
2330
- var viewportDistance = this.measurements.viewportDistance;
2331
- var maxHeight = 0;
2332
- var isBottomAligned = this.hasBit(corner, CornerBit.BOTTOM);
2333
- var isBottomAnchored = this.hasBit(this.anchorCorner, CornerBit.BOTTOM);
2334
- var MARGIN_TO_EDGE = MDCMenuSurfaceFoundation.numbers.MARGIN_TO_EDGE;
2335
- // When maximum height is not specified, it is handled from CSS.
2336
- if (isBottomAligned) {
2337
- maxHeight = viewportDistance.top + this.anchorMargin.top - MARGIN_TO_EDGE;
2338
- if (!isBottomAnchored) {
2339
- maxHeight += this.measurements.anchorSize.height;
2340
- }
2341
- }
2342
- else {
2343
- maxHeight = viewportDistance.bottom - this.anchorMargin.bottom +
2344
- this.measurements.anchorSize.height - MARGIN_TO_EDGE;
2345
- if (isBottomAnchored) {
2346
- maxHeight -= this.measurements.anchorSize.height;
2347
- }
2348
- }
2349
- return maxHeight;
2350
- };
2351
- /**
2352
- * @param corner Origin corner of the menu surface.
2353
- * @return Horizontal offset of menu surface origin corner from corresponding
2354
- * anchor corner.
2355
- */
2356
- MDCMenuSurfaceFoundation.prototype.getHorizontalOriginOffset = function (corner) {
2357
- var anchorSize = this.measurements.anchorSize;
2358
- // isRightAligned corresponds to using the 'right' property on the surface.
2359
- var isRightAligned = this.hasBit(corner, CornerBit.RIGHT);
2360
- var avoidHorizontalOverlap = this.hasBit(this.anchorCorner, CornerBit.RIGHT);
2361
- if (isRightAligned) {
2362
- var rightOffset = avoidHorizontalOverlap ?
2363
- anchorSize.width - this.anchorMargin.left :
2364
- this.anchorMargin.right;
2365
- // For hoisted or fixed elements, adjust the offset by the difference
2366
- // between viewport width and body width so when we calculate the right
2367
- // value (`adjustPositionForHoistedElement`) based on the element
2368
- // position, the right property is correct.
2369
- if (this.isHoistedElement || this.isFixedPosition) {
2370
- return rightOffset -
2371
- (this.measurements.viewportSize.width -
2372
- this.measurements.bodySize.width);
2373
- }
2374
- return rightOffset;
2375
- }
2376
- return avoidHorizontalOverlap ? anchorSize.width - this.anchorMargin.right :
2377
- this.anchorMargin.left;
2378
- };
2379
- /**
2380
- * @param corner Origin corner of the menu surface.
2381
- * @return Vertical offset of menu surface origin corner from corresponding
2382
- * anchor corner.
2383
- */
2384
- MDCMenuSurfaceFoundation.prototype.getVerticalOriginOffset = function (corner) {
2385
- var anchorSize = this.measurements.anchorSize;
2386
- var isBottomAligned = this.hasBit(corner, CornerBit.BOTTOM);
2387
- var avoidVerticalOverlap = this.hasBit(this.anchorCorner, CornerBit.BOTTOM);
2388
- var y = 0;
2389
- if (isBottomAligned) {
2390
- y = avoidVerticalOverlap ? anchorSize.height - this.anchorMargin.top :
2391
- -this.anchorMargin.bottom;
2392
- }
2393
- else {
2394
- y = avoidVerticalOverlap ?
2395
- (anchorSize.height + this.anchorMargin.bottom) :
2396
- this.anchorMargin.top;
2397
- }
2398
- return y;
2399
- };
2400
- /**
2401
- * Calculates the offsets for positioning the menu-surface when the
2402
- * menu-surface has been hoisted to the body.
2403
- */
2404
- MDCMenuSurfaceFoundation.prototype.adjustPositionForHoistedElement = function (position) {
2405
- var e_1, _a;
2406
- var _b = this.measurements, windowScroll = _b.windowScroll, viewportDistance = _b.viewportDistance, surfaceSize = _b.surfaceSize, viewportSize = _b.viewportSize;
2407
- var props = Object.keys(position);
2408
- try {
2409
- for (var props_1 = component.__values(props), props_1_1 = props_1.next(); !props_1_1.done; props_1_1 = props_1.next()) {
2410
- var prop = props_1_1.value;
2411
- var value = position[prop] || 0;
2412
- if (this.isHorizontallyCenteredOnViewport &&
2413
- (prop === 'left' || prop === 'right')) {
2414
- position[prop] = (viewportSize.width - surfaceSize.width) / 2;
2415
- continue;
2416
- }
2417
- // Hoisted surfaces need to have the anchor elements location on the page
2418
- // added to the position properties for proper alignment on the body.
2419
- value += viewportDistance[prop];
2420
- // Surfaces that are absolutely positioned need to have additional
2421
- // calculations for scroll and bottom positioning.
2422
- if (!this.isFixedPosition) {
2423
- if (prop === 'top') {
2424
- value += windowScroll.y;
2425
- }
2426
- else if (prop === 'bottom') {
2427
- value -= windowScroll.y;
2428
- }
2429
- else if (prop === 'left') {
2430
- value += windowScroll.x;
2431
- }
2432
- else { // prop === 'right'
2433
- value -= windowScroll.x;
2434
- }
2435
- }
2436
- position[prop] = value;
2437
- }
2438
- }
2439
- catch (e_1_1) { e_1 = { error: e_1_1 }; }
2440
- finally {
2441
- try {
2442
- if (props_1_1 && !props_1_1.done && (_a = props_1.return)) _a.call(props_1);
2443
- }
2444
- finally { if (e_1) throw e_1.error; }
2445
- }
2446
- };
2447
- /**
2448
- * The last focused element when the menu surface was opened should regain
2449
- * focus, if the user is focused on or within the menu surface when it is
2450
- * closed.
2451
- */
2452
- MDCMenuSurfaceFoundation.prototype.maybeRestoreFocus = function () {
2453
- var _this = this;
2454
- var isRootFocused = this.adapter.isFocused();
2455
- var ownerDocument = this.adapter.getOwnerDocument ?
2456
- this.adapter.getOwnerDocument() :
2457
- document;
2458
- var childHasFocus = ownerDocument.activeElement &&
2459
- this.adapter.isElementInContainer(ownerDocument.activeElement);
2460
- if (isRootFocused || childHasFocus) {
2461
- // Wait before restoring focus when closing the menu surface. This is
2462
- // important because if a touch event triggered the menu close, and the
2463
- // subsequent mouse event occurs after focus is restored, then the
2464
- // restored focus would be lost.
2465
- setTimeout(function () {
2466
- _this.adapter.restoreFocus();
2467
- }, numbers$3.TOUCH_EVENT_WAIT_MS);
2468
- }
2469
- };
2470
- MDCMenuSurfaceFoundation.prototype.hasBit = function (corner, bit) {
2471
- return Boolean(corner & bit); // tslint:disable-line:no-bitwise
2472
- };
2473
- MDCMenuSurfaceFoundation.prototype.setBit = function (corner, bit) {
2474
- return corner | bit; // tslint:disable-line:no-bitwise
2475
- };
2476
- MDCMenuSurfaceFoundation.prototype.unsetBit = function (corner, bit) {
2477
- return corner ^ bit;
2478
- };
2479
- /**
2480
- * isFinite that doesn't force conversion to number type.
2481
- * Equivalent to Number.isFinite in ES2015, which is not supported in IE.
2482
- */
2483
- MDCMenuSurfaceFoundation.prototype.isFinite = function (num) {
2484
- return typeof num === 'number' && isFinite(num);
2485
- };
2486
- return MDCMenuSurfaceFoundation;
2487
- }(component.MDCFoundation));
2488
-
2489
- /**
2490
- * @license
2491
- * Copyright 2018 Google Inc.
2492
- *
2493
- * Permission is hereby granted, free of charge, to any person obtaining a copy
2494
- * of this software and associated documentation files (the "Software"), to deal
2495
- * in the Software without restriction, including without limitation the rights
2496
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
2497
- * copies of the Software, and to permit persons to whom the Software is
2498
- * furnished to do so, subject to the following conditions:
2499
- *
2500
- * The above copyright notice and this permission notice shall be included in
2501
- * all copies or substantial portions of the Software.
2502
- *
2503
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
2504
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
2505
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
2506
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
2507
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
2508
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
2509
- * THE SOFTWARE.
2510
- */
2511
- var MDCMenuSurface = /** @class */ (function (_super) {
2512
- component.__extends(MDCMenuSurface, _super);
2513
- function MDCMenuSurface() {
2514
- return _super !== null && _super.apply(this, arguments) || this;
2515
- }
2516
- MDCMenuSurface.attachTo = function (root) {
2517
- return new MDCMenuSurface(root);
2518
- };
2519
- MDCMenuSurface.prototype.initialSyncWithDOM = function () {
2520
- var _this = this;
2521
- var parentEl = this.root.parentElement;
2522
- this.anchorElement = parentEl && parentEl.classList.contains(cssClasses$4.ANCHOR) ? parentEl : null;
2523
- if (this.root.classList.contains(cssClasses$4.FIXED)) {
2524
- this.setFixedPosition(true);
2525
- }
2526
- this.handleKeydown = function (event) {
2527
- _this.foundation.handleKeydown(event);
2528
- };
2529
- this.handleBodyClick = function (event) {
2530
- _this.foundation.handleBodyClick(event);
2531
- };
2532
- // capture so that no race between handleBodyClick and quickOpen when
2533
- // menusurface opened on button click which registers this listener
2534
- this.registerBodyClickListener = function () {
2535
- document.body.addEventListener('click', _this.handleBodyClick, { capture: true });
2536
- };
2537
- this.deregisterBodyClickListener = function () {
2538
- document.body.removeEventListener('click', _this.handleBodyClick, { capture: true });
2539
- };
2540
- this.listen('keydown', this.handleKeydown);
2541
- this.listen(strings$5.OPENED_EVENT, this.registerBodyClickListener);
2542
- this.listen(strings$5.CLOSED_EVENT, this.deregisterBodyClickListener);
2543
- };
2544
- MDCMenuSurface.prototype.destroy = function () {
2545
- this.unlisten('keydown', this.handleKeydown);
2546
- this.unlisten(strings$5.OPENED_EVENT, this.registerBodyClickListener);
2547
- this.unlisten(strings$5.CLOSED_EVENT, this.deregisterBodyClickListener);
2548
- _super.prototype.destroy.call(this);
2549
- };
2550
- MDCMenuSurface.prototype.isOpen = function () {
2551
- return this.foundation.isOpen();
2552
- };
2553
- MDCMenuSurface.prototype.open = function () {
2554
- this.foundation.open();
2555
- };
2556
- MDCMenuSurface.prototype.close = function (skipRestoreFocus) {
2557
- if (skipRestoreFocus === void 0) { skipRestoreFocus = false; }
2558
- this.foundation.close(skipRestoreFocus);
2559
- };
2560
- Object.defineProperty(MDCMenuSurface.prototype, "quickOpen", {
2561
- set: function (quickOpen) {
2562
- this.foundation.setQuickOpen(quickOpen);
2563
- },
2564
- enumerable: false,
2565
- configurable: true
2566
- });
2567
- /** Sets the foundation to use page offsets for an positioning when the menu is hoisted to the body. */
2568
- MDCMenuSurface.prototype.setIsHoisted = function (isHoisted) {
2569
- this.foundation.setIsHoisted(isHoisted);
2570
- };
2571
- /** Sets the element that the menu-surface is anchored to. */
2572
- MDCMenuSurface.prototype.setMenuSurfaceAnchorElement = function (element) {
2573
- this.anchorElement = element;
2574
- };
2575
- /** Sets the menu-surface to position: fixed. */
2576
- MDCMenuSurface.prototype.setFixedPosition = function (isFixed) {
2577
- if (isFixed) {
2578
- this.root.classList.add(cssClasses$4.FIXED);
2579
- }
2580
- else {
2581
- this.root.classList.remove(cssClasses$4.FIXED);
2582
- }
2583
- this.foundation.setFixedPosition(isFixed);
2584
- };
2585
- /** Sets the absolute x/y position to position based on. Requires the menu to be hoisted. */
2586
- MDCMenuSurface.prototype.setAbsolutePosition = function (x, y) {
2587
- this.foundation.setAbsolutePosition(x, y);
2588
- this.setIsHoisted(true);
2589
- };
2590
- /**
2591
- * @param corner Default anchor corner alignment of top-left surface corner.
2592
- */
2593
- MDCMenuSurface.prototype.setAnchorCorner = function (corner) {
2594
- this.foundation.setAnchorCorner(corner);
2595
- };
2596
- MDCMenuSurface.prototype.setAnchorMargin = function (margin) {
2597
- this.foundation.setAnchorMargin(margin);
2598
- };
2599
- MDCMenuSurface.prototype.getDefaultFoundation = function () {
2600
- var _this = this;
2601
- // DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
2602
- // To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
2603
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
2604
- var adapter = {
2605
- addClass: function (className) { return _this.root.classList.add(className); },
2606
- removeClass: function (className) { return _this.root.classList.remove(className); },
2607
- hasClass: function (className) { return _this.root.classList.contains(className); },
2608
- hasAnchor: function () { return !!_this.anchorElement; },
2609
- notifyClose: function () {
2610
- return _this.emit(MDCMenuSurfaceFoundation.strings.CLOSED_EVENT, {});
2611
- },
2612
- notifyClosing: function () {
2613
- _this.emit(MDCMenuSurfaceFoundation.strings.CLOSING_EVENT, {});
2614
- },
2615
- notifyOpen: function () {
2616
- return _this.emit(MDCMenuSurfaceFoundation.strings.OPENED_EVENT, {});
2617
- },
2618
- notifyOpening: function () {
2619
- return _this.emit(MDCMenuSurfaceFoundation.strings.OPENING_EVENT, {});
2620
- },
2621
- isElementInContainer: function (el) { return _this.root.contains(el); },
2622
- isRtl: function () {
2623
- return getComputedStyle(_this.root).getPropertyValue('direction') === 'rtl';
2624
- },
2625
- setTransformOrigin: function (origin) {
2626
- var propertyName = component.getCorrectPropertyName(window, 'transform') + "-origin";
2627
- _this.root.style.setProperty(propertyName, origin);
2628
- },
2629
- isFocused: function () { return document.activeElement === _this.root; },
2630
- saveFocus: function () {
2631
- _this.previousFocus =
2632
- document.activeElement;
2633
- },
2634
- restoreFocus: function () {
2635
- if (_this.root.contains(document.activeElement)) {
2636
- if (_this.previousFocus && _this.previousFocus.focus) {
2637
- _this.previousFocus.focus();
2638
- }
2639
- }
2640
- },
2641
- getInnerDimensions: function () {
2642
- return {
2643
- width: _this.root.offsetWidth,
2644
- height: _this.root.offsetHeight
2645
- };
2646
- },
2647
- getAnchorDimensions: function () { return _this.anchorElement ?
2648
- _this.anchorElement.getBoundingClientRect() :
2649
- null; },
2650
- getWindowDimensions: function () {
2651
- return { width: window.innerWidth, height: window.innerHeight };
2652
- },
2653
- getBodyDimensions: function () {
2654
- return { width: document.body.clientWidth, height: document.body.clientHeight };
2655
- },
2656
- getWindowScroll: function () {
2657
- return { x: window.pageXOffset, y: window.pageYOffset };
2658
- },
2659
- setPosition: function (position) {
2660
- var rootHTML = _this.root;
2661
- rootHTML.style.left = 'left' in position ? position.left + "px" : '';
2662
- rootHTML.style.right = 'right' in position ? position.right + "px" : '';
2663
- rootHTML.style.top = 'top' in position ? position.top + "px" : '';
2664
- rootHTML.style.bottom =
2665
- 'bottom' in position ? position.bottom + "px" : '';
2666
- },
2667
- setMaxHeight: function (height) {
2668
- _this.root.style.maxHeight = height;
2669
- },
2670
- };
2671
- // tslint:enable:object-literal-sort-keys
2672
- return new MDCMenuSurfaceFoundation(adapter);
2673
- };
2674
- return MDCMenuSurface;
2675
- }(component.MDCComponent));
2676
-
2677
- /**
2678
- * @license
2679
- * Copyright 2018 Google Inc.
2680
- *
2681
- * Permission is hereby granted, free of charge, to any person obtaining a copy
2682
- * of this software and associated documentation files (the "Software"), to deal
2683
- * in the Software without restriction, including without limitation the rights
2684
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
2685
- * copies of the Software, and to permit persons to whom the Software is
2686
- * furnished to do so, subject to the following conditions:
2687
- *
2688
- * The above copyright notice and this permission notice shall be included in
2689
- * all copies or substantial portions of the Software.
2690
- *
2691
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
2692
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
2693
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
2694
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
2695
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
2696
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
2697
- * THE SOFTWARE.
2698
- */
2699
- var cssClasses$2 = {
2700
- MENU_SELECTED_LIST_ITEM: 'mdc-menu-item--selected',
2701
- MENU_SELECTION_GROUP: 'mdc-menu__selection-group',
2702
- ROOT: 'mdc-menu',
2703
- };
2704
- var strings$3 = {
2705
- ARIA_CHECKED_ATTR: 'aria-checked',
2706
- ARIA_DISABLED_ATTR: 'aria-disabled',
2707
- CHECKBOX_SELECTOR: 'input[type="checkbox"]',
2708
- LIST_SELECTOR: '.mdc-list,.mdc-deprecated-list',
2709
- SELECTED_EVENT: 'MDCMenu:selected',
2710
- SKIP_RESTORE_FOCUS: 'data-menu-item-skip-restore-focus',
2711
- };
2712
- var numbers$1 = {
2713
- FOCUS_ROOT_INDEX: -1,
2714
- };
2715
- var DefaultFocusState;
2716
- (function (DefaultFocusState) {
2717
- DefaultFocusState[DefaultFocusState["NONE"] = 0] = "NONE";
2718
- DefaultFocusState[DefaultFocusState["LIST_ROOT"] = 1] = "LIST_ROOT";
2719
- DefaultFocusState[DefaultFocusState["FIRST_ITEM"] = 2] = "FIRST_ITEM";
2720
- DefaultFocusState[DefaultFocusState["LAST_ITEM"] = 3] = "LAST_ITEM";
2721
- })(DefaultFocusState || (DefaultFocusState = {}));
2722
-
2723
- /**
2724
- * @license
2725
- * Copyright 2018 Google Inc.
2726
- *
2727
- * Permission is hereby granted, free of charge, to any person obtaining a copy
2728
- * of this software and associated documentation files (the "Software"), to deal
2729
- * in the Software without restriction, including without limitation the rights
2730
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
2731
- * copies of the Software, and to permit persons to whom the Software is
2732
- * furnished to do so, subject to the following conditions:
2733
- *
2734
- * The above copyright notice and this permission notice shall be included in
2735
- * all copies or substantial portions of the Software.
2736
- *
2737
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
2738
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
2739
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
2740
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
2741
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
2742
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
2743
- * THE SOFTWARE.
2744
- */
2745
- var MDCMenuFoundation = /** @class */ (function (_super) {
2746
- component.__extends(MDCMenuFoundation, _super);
2747
- function MDCMenuFoundation(adapter) {
2748
- var _this = _super.call(this, component.__assign(component.__assign({}, MDCMenuFoundation.defaultAdapter), adapter)) || this;
2749
- _this.closeAnimationEndTimerId = 0;
2750
- _this.defaultFocusState = DefaultFocusState.LIST_ROOT;
2751
- _this.selectedIndex = -1;
2752
- return _this;
2753
- }
2754
- Object.defineProperty(MDCMenuFoundation, "cssClasses", {
2755
- get: function () {
2756
- return cssClasses$2;
2757
- },
2758
- enumerable: false,
2759
- configurable: true
2760
- });
2761
- Object.defineProperty(MDCMenuFoundation, "strings", {
2762
- get: function () {
2763
- return strings$3;
2764
- },
2765
- enumerable: false,
2766
- configurable: true
2767
- });
2768
- Object.defineProperty(MDCMenuFoundation, "numbers", {
2769
- get: function () {
2770
- return numbers$1;
2771
- },
2772
- enumerable: false,
2773
- configurable: true
2774
- });
2775
- Object.defineProperty(MDCMenuFoundation, "defaultAdapter", {
2776
- /**
2777
- * @see {@link MDCMenuAdapter} for typing information on parameters and return types.
2778
- */
2779
- get: function () {
2780
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
2781
- return {
2782
- addClassToElementAtIndex: function () { return undefined; },
2783
- removeClassFromElementAtIndex: function () { return undefined; },
2784
- addAttributeToElementAtIndex: function () { return undefined; },
2785
- removeAttributeFromElementAtIndex: function () { return undefined; },
2786
- getAttributeFromElementAtIndex: function () { return null; },
2787
- elementContainsClass: function () { return false; },
2788
- closeSurface: function () { return undefined; },
2789
- getElementIndex: function () { return -1; },
2790
- notifySelected: function () { return undefined; },
2791
- getMenuItemCount: function () { return 0; },
2792
- focusItemAtIndex: function () { return undefined; },
2793
- focusListRoot: function () { return undefined; },
2794
- getSelectedSiblingOfItemAtIndex: function () { return -1; },
2795
- isSelectableItemAtIndex: function () { return false; },
2796
- };
2797
- // tslint:enable:object-literal-sort-keys
2798
- },
2799
- enumerable: false,
2800
- configurable: true
2801
- });
2802
- MDCMenuFoundation.prototype.destroy = function () {
2803
- if (this.closeAnimationEndTimerId) {
2804
- clearTimeout(this.closeAnimationEndTimerId);
2805
- }
2806
- this.adapter.closeSurface();
2807
- };
2808
- MDCMenuFoundation.prototype.handleKeydown = function (evt) {
2809
- var key = evt.key, keyCode = evt.keyCode;
2810
- var isTab = key === 'Tab' || keyCode === 9;
2811
- if (isTab) {
2812
- this.adapter.closeSurface(/** skipRestoreFocus */ true);
2813
- }
2814
- };
2815
- MDCMenuFoundation.prototype.handleItemAction = function (listItem) {
2816
- var _this = this;
2817
- var index = this.adapter.getElementIndex(listItem);
2818
- if (index < 0) {
2819
- return;
2820
- }
2821
- this.adapter.notifySelected({ index: index });
2822
- var skipRestoreFocus = this.adapter.getAttributeFromElementAtIndex(index, strings$3.SKIP_RESTORE_FOCUS) === 'true';
2823
- this.adapter.closeSurface(skipRestoreFocus);
2824
- // Wait for the menu to close before adding/removing classes that affect styles.
2825
- this.closeAnimationEndTimerId = setTimeout(function () {
2826
- // Recompute the index in case the menu contents have changed.
2827
- var recomputedIndex = _this.adapter.getElementIndex(listItem);
2828
- if (recomputedIndex >= 0 &&
2829
- _this.adapter.isSelectableItemAtIndex(recomputedIndex)) {
2830
- _this.setSelectedIndex(recomputedIndex);
2831
- }
2832
- }, MDCMenuSurfaceFoundation.numbers.TRANSITION_CLOSE_DURATION);
2833
- };
2834
- MDCMenuFoundation.prototype.handleMenuSurfaceOpened = function () {
2835
- switch (this.defaultFocusState) {
2836
- case DefaultFocusState.FIRST_ITEM:
2837
- this.adapter.focusItemAtIndex(0);
2838
- break;
2839
- case DefaultFocusState.LAST_ITEM:
2840
- this.adapter.focusItemAtIndex(this.adapter.getMenuItemCount() - 1);
2841
- break;
2842
- case DefaultFocusState.NONE:
2843
- // Do nothing.
2844
- break;
2845
- default:
2846
- this.adapter.focusListRoot();
2847
- break;
2848
- }
2849
- };
2850
- /**
2851
- * Sets default focus state where the menu should focus every time when menu
2852
- * is opened. Focuses the list root (`DefaultFocusState.LIST_ROOT`) element by
2853
- * default.
2854
- */
2855
- MDCMenuFoundation.prototype.setDefaultFocusState = function (focusState) {
2856
- this.defaultFocusState = focusState;
2857
- };
2858
- /** @return Index of the currently selected list item within the menu. */
2859
- MDCMenuFoundation.prototype.getSelectedIndex = function () {
2860
- return this.selectedIndex;
2861
- };
2862
- /**
2863
- * Selects the list item at `index` within the menu.
2864
- * @param index Index of list item within the menu.
2865
- */
2866
- MDCMenuFoundation.prototype.setSelectedIndex = function (index) {
2867
- this.validatedIndex(index);
2868
- if (!this.adapter.isSelectableItemAtIndex(index)) {
2869
- throw new Error('MDCMenuFoundation: No selection group at specified index.');
2870
- }
2871
- var prevSelectedIndex = this.adapter.getSelectedSiblingOfItemAtIndex(index);
2872
- if (prevSelectedIndex >= 0) {
2873
- this.adapter.removeAttributeFromElementAtIndex(prevSelectedIndex, strings$3.ARIA_CHECKED_ATTR);
2874
- this.adapter.removeClassFromElementAtIndex(prevSelectedIndex, cssClasses$2.MENU_SELECTED_LIST_ITEM);
2875
- }
2876
- this.adapter.addClassToElementAtIndex(index, cssClasses$2.MENU_SELECTED_LIST_ITEM);
2877
- this.adapter.addAttributeToElementAtIndex(index, strings$3.ARIA_CHECKED_ATTR, 'true');
2878
- this.selectedIndex = index;
2879
- };
2880
- /**
2881
- * Sets the enabled state to isEnabled for the menu item at the given index.
2882
- * @param index Index of the menu item
2883
- * @param isEnabled The desired enabled state of the menu item.
2884
- */
2885
- MDCMenuFoundation.prototype.setEnabled = function (index, isEnabled) {
2886
- this.validatedIndex(index);
2887
- if (isEnabled) {
2888
- this.adapter.removeClassFromElementAtIndex(index, cssClasses$3.LIST_ITEM_DISABLED_CLASS);
2889
- this.adapter.addAttributeToElementAtIndex(index, strings$3.ARIA_DISABLED_ATTR, 'false');
2890
- }
2891
- else {
2892
- this.adapter.addClassToElementAtIndex(index, cssClasses$3.LIST_ITEM_DISABLED_CLASS);
2893
- this.adapter.addAttributeToElementAtIndex(index, strings$3.ARIA_DISABLED_ATTR, 'true');
2894
- }
2895
- };
2896
- MDCMenuFoundation.prototype.validatedIndex = function (index) {
2897
- var menuSize = this.adapter.getMenuItemCount();
2898
- var isIndexInRange = index >= 0 && index < menuSize;
2899
- if (!isIndexInRange) {
2900
- throw new Error('MDCMenuFoundation: No list item at specified index.');
2901
- }
2902
- };
2903
- return MDCMenuFoundation;
2904
- }(component.MDCFoundation));
2905
-
2906
- /**
2907
- * @license
2908
- * Copyright 2018 Google Inc.
2909
- *
2910
- * Permission is hereby granted, free of charge, to any person obtaining a copy
2911
- * of this software and associated documentation files (the "Software"), to deal
2912
- * in the Software without restriction, including without limitation the rights
2913
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
2914
- * copies of the Software, and to permit persons to whom the Software is
2915
- * furnished to do so, subject to the following conditions:
2916
- *
2917
- * The above copyright notice and this permission notice shall be included in
2918
- * all copies or substantial portions of the Software.
2919
- *
2920
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
2921
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
2922
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
2923
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
2924
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
2925
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
2926
- * THE SOFTWARE.
2927
- */
2928
- var MDCMenu = /** @class */ (function (_super) {
2929
- component.__extends(MDCMenu, _super);
2930
- function MDCMenu() {
2931
- return _super !== null && _super.apply(this, arguments) || this;
2932
- }
2933
- MDCMenu.attachTo = function (root) {
2934
- return new MDCMenu(root);
2935
- };
2936
- MDCMenu.prototype.initialize = function (menuSurfaceFactory, listFactory) {
2937
- if (menuSurfaceFactory === void 0) { menuSurfaceFactory = function (el) { return new MDCMenuSurface(el); }; }
2938
- if (listFactory === void 0) { listFactory = function (el) { return new MDCList(el); }; }
2939
- this.menuSurfaceFactory = menuSurfaceFactory;
2940
- this.listFactory = listFactory;
2941
- };
2942
- MDCMenu.prototype.initialSyncWithDOM = function () {
2943
- var _this = this;
2944
- this.menuSurface = this.menuSurfaceFactory(this.root);
2945
- var list = this.root.querySelector(strings$3.LIST_SELECTOR);
2946
- if (list) {
2947
- this.list = this.listFactory(list);
2948
- this.list.wrapFocus = true;
2949
- }
2950
- else {
2951
- this.list = null;
2952
- }
2953
- this.handleKeydown = function (evt) {
2954
- _this.foundation.handleKeydown(evt);
2955
- };
2956
- this.handleItemAction = function (evt) {
2957
- _this.foundation.handleItemAction(_this.items[evt.detail.index]);
2958
- };
2959
- this.handleMenuSurfaceOpened = function () {
2960
- _this.foundation.handleMenuSurfaceOpened();
2961
- };
2962
- this.menuSurface.listen(MDCMenuSurfaceFoundation.strings.OPENED_EVENT, this.handleMenuSurfaceOpened);
2963
- this.listen('keydown', this.handleKeydown);
2964
- this.listen(MDCListFoundation.strings.ACTION_EVENT, this.handleItemAction);
2965
- };
2966
- MDCMenu.prototype.destroy = function () {
2967
- if (this.list) {
2968
- this.list.destroy();
2969
- }
2970
- this.menuSurface.destroy();
2971
- this.menuSurface.unlisten(MDCMenuSurfaceFoundation.strings.OPENED_EVENT, this.handleMenuSurfaceOpened);
2972
- this.unlisten('keydown', this.handleKeydown);
2973
- this.unlisten(MDCListFoundation.strings.ACTION_EVENT, this.handleItemAction);
2974
- _super.prototype.destroy.call(this);
2975
- };
2976
- Object.defineProperty(MDCMenu.prototype, "open", {
2977
- get: function () {
2978
- return this.menuSurface.isOpen();
2979
- },
2980
- set: function (value) {
2981
- if (value) {
2982
- this.menuSurface.open();
2983
- }
2984
- else {
2985
- this.menuSurface.close();
2986
- }
2987
- },
2988
- enumerable: false,
2989
- configurable: true
2990
- });
2991
- Object.defineProperty(MDCMenu.prototype, "wrapFocus", {
2992
- get: function () {
2993
- return this.list ? this.list.wrapFocus : false;
2994
- },
2995
- set: function (value) {
2996
- if (this.list) {
2997
- this.list.wrapFocus = value;
2998
- }
2999
- },
3000
- enumerable: false,
3001
- configurable: true
3002
- });
3003
- Object.defineProperty(MDCMenu.prototype, "hasTypeahead", {
3004
- /**
3005
- * Sets whether the menu has typeahead functionality.
3006
- * @param value Whether typeahead is enabled.
3007
- */
3008
- set: function (value) {
3009
- if (this.list) {
3010
- this.list.hasTypeahead = value;
3011
- }
3012
- },
3013
- enumerable: false,
3014
- configurable: true
3015
- });
3016
- Object.defineProperty(MDCMenu.prototype, "typeaheadInProgress", {
3017
- /**
3018
- * @return Whether typeahead logic is currently matching some user prefix.
3019
- */
3020
- get: function () {
3021
- return this.list ? this.list.typeaheadInProgress : false;
3022
- },
3023
- enumerable: false,
3024
- configurable: true
3025
- });
3026
- /**
3027
- * Given the next desired character from the user, adds it to the typeahead
3028
- * buffer. Then, attempts to find the next option matching the buffer. Wraps
3029
- * around if at the end of options.
3030
- *
3031
- * @param nextChar The next character to add to the prefix buffer.
3032
- * @param startingIndex The index from which to start matching. Only relevant
3033
- * when starting a new match sequence. To start a new match sequence,
3034
- * clear the buffer using `clearTypeaheadBuffer`, or wait for the buffer
3035
- * to clear after a set interval defined in list foundation. Defaults to
3036
- * the currently focused index.
3037
- * @return The index of the matched item, or -1 if no match.
3038
- */
3039
- MDCMenu.prototype.typeaheadMatchItem = function (nextChar, startingIndex) {
3040
- if (this.list) {
3041
- return this.list.typeaheadMatchItem(nextChar, startingIndex);
3042
- }
3043
- return -1;
3044
- };
3045
- /**
3046
- * Layout the underlying list element in the case of any dynamic updates
3047
- * to its structure.
3048
- */
3049
- MDCMenu.prototype.layout = function () {
3050
- if (this.list) {
3051
- this.list.layout();
3052
- }
3053
- };
3054
- Object.defineProperty(MDCMenu.prototype, "items", {
3055
- /**
3056
- * Return the items within the menu. Note that this only contains the set of elements within
3057
- * the items container that are proper list items, and not supplemental / presentational DOM
3058
- * elements.
3059
- */
3060
- get: function () {
3061
- return this.list ? this.list.listElements : [];
3062
- },
3063
- enumerable: false,
3064
- configurable: true
3065
- });
3066
- Object.defineProperty(MDCMenu.prototype, "singleSelection", {
3067
- /**
3068
- * Turns on/off the underlying list's single selection mode. Used mainly
3069
- * by select menu.
3070
- *
3071
- * @param singleSelection Whether to enable single selection mode.
3072
- */
3073
- set: function (singleSelection) {
3074
- if (this.list) {
3075
- this.list.singleSelection = singleSelection;
3076
- }
3077
- },
3078
- enumerable: false,
3079
- configurable: true
3080
- });
3081
- Object.defineProperty(MDCMenu.prototype, "selectedIndex", {
3082
- /**
3083
- * Retrieves the selected index. Only applicable to select menus.
3084
- * @return The selected index, which is a number for single selection and
3085
- * radio lists, and an array of numbers for checkbox lists.
3086
- */
3087
- get: function () {
3088
- return this.list ? this.list.selectedIndex : numbers$2.UNSET_INDEX;
3089
- },
3090
- /**
3091
- * Sets the selected index of the list. Only applicable to select menus.
3092
- * @param index The selected index, which is a number for single selection and
3093
- * radio lists, and an array of numbers for checkbox lists.
3094
- */
3095
- set: function (index) {
3096
- if (this.list) {
3097
- this.list.selectedIndex = index;
3098
- }
3099
- },
3100
- enumerable: false,
3101
- configurable: true
3102
- });
3103
- Object.defineProperty(MDCMenu.prototype, "quickOpen", {
3104
- set: function (quickOpen) {
3105
- this.menuSurface.quickOpen = quickOpen;
3106
- },
3107
- enumerable: false,
3108
- configurable: true
3109
- });
3110
- /**
3111
- * Sets default focus state where the menu should focus every time when menu
3112
- * is opened. Focuses the list root (`DefaultFocusState.LIST_ROOT`) element by
3113
- * default.
3114
- * @param focusState Default focus state.
3115
- */
3116
- MDCMenu.prototype.setDefaultFocusState = function (focusState) {
3117
- this.foundation.setDefaultFocusState(focusState);
3118
- };
3119
- /**
3120
- * @param corner Default anchor corner alignment of top-left menu corner.
3121
- */
3122
- MDCMenu.prototype.setAnchorCorner = function (corner) {
3123
- this.menuSurface.setAnchorCorner(corner);
3124
- };
3125
- MDCMenu.prototype.setAnchorMargin = function (margin) {
3126
- this.menuSurface.setAnchorMargin(margin);
3127
- };
3128
- /**
3129
- * Sets the list item as the selected row at the specified index.
3130
- * @param index Index of list item within menu.
3131
- */
3132
- MDCMenu.prototype.setSelectedIndex = function (index) {
3133
- this.foundation.setSelectedIndex(index);
3134
- };
3135
- /**
3136
- * Sets the enabled state to isEnabled for the menu item at the given index.
3137
- * @param index Index of the menu item
3138
- * @param isEnabled The desired enabled state of the menu item.
3139
- */
3140
- MDCMenu.prototype.setEnabled = function (index, isEnabled) {
3141
- this.foundation.setEnabled(index, isEnabled);
3142
- };
3143
- /**
3144
- * @return The item within the menu at the index specified.
3145
- */
3146
- MDCMenu.prototype.getOptionByIndex = function (index) {
3147
- var items = this.items;
3148
- if (index < items.length) {
3149
- return this.items[index];
3150
- }
3151
- else {
3152
- return null;
3153
- }
3154
- };
3155
- /**
3156
- * @param index A menu item's index.
3157
- * @return The primary text within the menu at the index specified.
3158
- */
3159
- MDCMenu.prototype.getPrimaryTextAtIndex = function (index) {
3160
- var item = this.getOptionByIndex(index);
3161
- if (item && this.list) {
3162
- return this.list.getPrimaryText(item) || '';
3163
- }
3164
- return '';
3165
- };
3166
- MDCMenu.prototype.setFixedPosition = function (isFixed) {
3167
- this.menuSurface.setFixedPosition(isFixed);
3168
- };
3169
- MDCMenu.prototype.setIsHoisted = function (isHoisted) {
3170
- this.menuSurface.setIsHoisted(isHoisted);
3171
- };
3172
- MDCMenu.prototype.setAbsolutePosition = function (x, y) {
3173
- this.menuSurface.setAbsolutePosition(x, y);
3174
- };
3175
- /**
3176
- * Sets the element that the menu-surface is anchored to.
3177
- */
3178
- MDCMenu.prototype.setAnchorElement = function (element) {
3179
- this.menuSurface.anchorElement = element;
3180
- };
3181
- MDCMenu.prototype.getDefaultFoundation = function () {
3182
- var _this = this;
3183
- // DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
3184
- // To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
3185
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
3186
- var adapter = {
3187
- addClassToElementAtIndex: function (index, className) {
3188
- var list = _this.items;
3189
- list[index].classList.add(className);
3190
- },
3191
- removeClassFromElementAtIndex: function (index, className) {
3192
- var list = _this.items;
3193
- list[index].classList.remove(className);
3194
- },
3195
- addAttributeToElementAtIndex: function (index, attr, value) {
3196
- var list = _this.items;
3197
- list[index].setAttribute(attr, value);
3198
- },
3199
- removeAttributeFromElementAtIndex: function (index, attr) {
3200
- var list = _this.items;
3201
- list[index].removeAttribute(attr);
3202
- },
3203
- getAttributeFromElementAtIndex: function (index, attr) {
3204
- var list = _this.items;
3205
- return list[index].getAttribute(attr);
3206
- },
3207
- elementContainsClass: function (element, className) {
3208
- return element.classList.contains(className);
3209
- },
3210
- closeSurface: function (skipRestoreFocus) {
3211
- _this.menuSurface.close(skipRestoreFocus);
3212
- },
3213
- getElementIndex: function (element) { return _this.items.indexOf(element); },
3214
- notifySelected: function (evtData) {
3215
- _this.emit(strings$3.SELECTED_EVENT, {
3216
- index: evtData.index,
3217
- item: _this.items[evtData.index],
3218
- });
3219
- },
3220
- getMenuItemCount: function () { return _this.items.length; },
3221
- focusItemAtIndex: function (index) {
3222
- _this.items[index].focus();
3223
- },
3224
- focusListRoot: function () {
3225
- _this.root.querySelector(strings$3.LIST_SELECTOR).focus();
3226
- },
3227
- isSelectableItemAtIndex: function (index) {
3228
- return !!component.closest(_this.items[index], "." + cssClasses$2.MENU_SELECTION_GROUP);
3229
- },
3230
- getSelectedSiblingOfItemAtIndex: function (index) {
3231
- var selectionGroupEl = component.closest(_this.items[index], "." + cssClasses$2.MENU_SELECTION_GROUP);
3232
- var selectedItemEl = selectionGroupEl.querySelector("." + cssClasses$2.MENU_SELECTED_LIST_ITEM);
3233
- return selectedItemEl ? _this.items.indexOf(selectedItemEl) : -1;
3234
- },
3235
- };
3236
- // tslint:enable:object-literal-sort-keys
3237
- return new MDCMenuFoundation(adapter);
3238
- };
3239
- return MDCMenu;
3240
- }(component.MDCComponent));
3241
-
3242
- /**
3243
- * @license
3244
- * Copyright 2016 Google Inc.
3245
- *
3246
- * Permission is hereby granted, free of charge, to any person obtaining a copy
3247
- * of this software and associated documentation files (the "Software"), to deal
3248
- * in the Software without restriction, including without limitation the rights
3249
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
3250
- * copies of the Software, and to permit persons to whom the Software is
3251
- * furnished to do so, subject to the following conditions:
3252
- *
3253
- * The above copyright notice and this permission notice shall be included in
3254
- * all copies or substantial portions of the Software.
3255
- *
3256
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
3257
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
3258
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
3259
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
3260
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
3261
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
3262
- * THE SOFTWARE.
3263
- */
3264
- var cssClasses$1 = {
3265
- ACTIVATED: 'mdc-select--activated',
3266
- DISABLED: 'mdc-select--disabled',
3267
- FOCUSED: 'mdc-select--focused',
3268
- INVALID: 'mdc-select--invalid',
3269
- MENU_INVALID: 'mdc-select__menu--invalid',
3270
- OUTLINED: 'mdc-select--outlined',
3271
- REQUIRED: 'mdc-select--required',
3272
- ROOT: 'mdc-select',
3273
- WITH_LEADING_ICON: 'mdc-select--with-leading-icon',
3274
- };
3275
- var strings$2 = {
3276
- ARIA_CONTROLS: 'aria-controls',
3277
- ARIA_DESCRIBEDBY: 'aria-describedby',
3278
- ARIA_SELECTED_ATTR: 'aria-selected',
3279
- CHANGE_EVENT: 'MDCSelect:change',
3280
- HIDDEN_INPUT_SELECTOR: 'input[type="hidden"]',
3281
- LABEL_SELECTOR: '.mdc-floating-label',
3282
- LEADING_ICON_SELECTOR: '.mdc-select__icon',
3283
- LINE_RIPPLE_SELECTOR: '.mdc-line-ripple',
3284
- MENU_SELECTOR: '.mdc-select__menu',
3285
- OUTLINE_SELECTOR: '.mdc-notched-outline',
3286
- SELECTED_TEXT_SELECTOR: '.mdc-select__selected-text',
3287
- SELECT_ANCHOR_SELECTOR: '.mdc-select__anchor',
3288
- VALUE_ATTR: 'data-value',
3289
- };
3290
- var numbers = {
3291
- LABEL_SCALE: 0.75,
3292
- UNSET_INDEX: -1,
3293
- CLICK_DEBOUNCE_TIMEOUT_MS: 330,
3294
- };
3295
-
3296
- /**
3297
- * @license
3298
- * Copyright 2016 Google Inc.
3299
- *
3300
- * Permission is hereby granted, free of charge, to any person obtaining a copy
3301
- * of this software and associated documentation files (the "Software"), to deal
3302
- * in the Software without restriction, including without limitation the rights
3303
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
3304
- * copies of the Software, and to permit persons to whom the Software is
3305
- * furnished to do so, subject to the following conditions:
3306
- *
3307
- * The above copyright notice and this permission notice shall be included in
3308
- * all copies or substantial portions of the Software.
3309
- *
3310
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
3311
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
3312
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
3313
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
3314
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
3315
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
3316
- * THE SOFTWARE.
3317
- */
3318
- var MDCSelectFoundation = /** @class */ (function (_super) {
3319
- component.__extends(MDCSelectFoundation, _super);
3320
- /* istanbul ignore next: optional argument is not a branch statement */
3321
- /**
3322
- * @param adapter
3323
- * @param foundationMap Map from subcomponent names to their subfoundations.
3324
- */
3325
- function MDCSelectFoundation(adapter, foundationMap) {
3326
- if (foundationMap === void 0) { foundationMap = {}; }
3327
- var _this = _super.call(this, component.__assign(component.__assign({}, MDCSelectFoundation.defaultAdapter), adapter)) || this;
3328
- // Disabled state
3329
- _this.disabled = false;
3330
- // isMenuOpen is used to track the state of the menu by listening to the
3331
- // MDCMenuSurface:closed event For reference, menu.open will return false if
3332
- // the menu is still closing, but isMenuOpen returns false only after the menu
3333
- // has closed
3334
- _this.isMenuOpen = false;
3335
- // By default, select is invalid if it is required but no value is selected.
3336
- _this.useDefaultValidation = true;
3337
- _this.customValidity = true;
3338
- _this.lastSelectedIndex = numbers.UNSET_INDEX;
3339
- _this.clickDebounceTimeout = 0;
3340
- _this.recentlyClicked = false;
3341
- _this.leadingIcon = foundationMap.leadingIcon;
3342
- _this.helperText = foundationMap.helperText;
3343
- return _this;
3344
- }
3345
- Object.defineProperty(MDCSelectFoundation, "cssClasses", {
3346
- get: function () {
3347
- return cssClasses$1;
3348
- },
3349
- enumerable: false,
3350
- configurable: true
3351
- });
3352
- Object.defineProperty(MDCSelectFoundation, "numbers", {
3353
- get: function () {
3354
- return numbers;
3355
- },
3356
- enumerable: false,
3357
- configurable: true
3358
- });
3359
- Object.defineProperty(MDCSelectFoundation, "strings", {
3360
- get: function () {
3361
- return strings$2;
3362
- },
3363
- enumerable: false,
3364
- configurable: true
3365
- });
3366
- Object.defineProperty(MDCSelectFoundation, "defaultAdapter", {
3367
- /**
3368
- * See {@link MDCSelectAdapter} for typing information on parameters and return types.
3369
- */
3370
- get: function () {
3371
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
3372
- return {
3373
- addClass: function () { return undefined; },
3374
- removeClass: function () { return undefined; },
3375
- hasClass: function () { return false; },
3376
- activateBottomLine: function () { return undefined; },
3377
- deactivateBottomLine: function () { return undefined; },
3378
- getSelectedIndex: function () { return -1; },
3379
- setSelectedIndex: function () { return undefined; },
3380
- hasLabel: function () { return false; },
3381
- floatLabel: function () { return undefined; },
3382
- getLabelWidth: function () { return 0; },
3383
- setLabelRequired: function () { return undefined; },
3384
- hasOutline: function () { return false; },
3385
- notchOutline: function () { return undefined; },
3386
- closeOutline: function () { return undefined; },
3387
- setRippleCenter: function () { return undefined; },
3388
- notifyChange: function () { return undefined; },
3389
- setSelectedText: function () { return undefined; },
3390
- isSelectAnchorFocused: function () { return false; },
3391
- getSelectAnchorAttr: function () { return ''; },
3392
- setSelectAnchorAttr: function () { return undefined; },
3393
- removeSelectAnchorAttr: function () { return undefined; },
3394
- addMenuClass: function () { return undefined; },
3395
- removeMenuClass: function () { return undefined; },
3396
- openMenu: function () { return undefined; },
3397
- closeMenu: function () { return undefined; },
3398
- getAnchorElement: function () { return null; },
3399
- setMenuAnchorElement: function () { return undefined; },
3400
- setMenuAnchorCorner: function () { return undefined; },
3401
- setMenuWrapFocus: function () { return undefined; },
3402
- focusMenuItemAtIndex: function () { return undefined; },
3403
- getMenuItemCount: function () { return 0; },
3404
- getMenuItemValues: function () { return []; },
3405
- getMenuItemTextAtIndex: function () { return ''; },
3406
- isTypeaheadInProgress: function () { return false; },
3407
- typeaheadMatchItem: function () { return -1; },
3408
- };
3409
- // tslint:enable:object-literal-sort-keys
3410
- },
3411
- enumerable: false,
3412
- configurable: true
3413
- });
3414
- /** Returns the index of the currently selected menu item, or -1 if none. */
3415
- MDCSelectFoundation.prototype.getSelectedIndex = function () {
3416
- return this.adapter.getSelectedIndex();
3417
- };
3418
- MDCSelectFoundation.prototype.setSelectedIndex = function (index, closeMenu, skipNotify) {
3419
- if (closeMenu === void 0) { closeMenu = false; }
3420
- if (skipNotify === void 0) { skipNotify = false; }
3421
- if (index >= this.adapter.getMenuItemCount()) {
3422
- return;
3423
- }
3424
- if (index === numbers.UNSET_INDEX) {
3425
- this.adapter.setSelectedText('');
3426
- }
3427
- else {
3428
- this.adapter.setSelectedText(this.adapter.getMenuItemTextAtIndex(index).trim());
3429
- }
3430
- this.adapter.setSelectedIndex(index);
3431
- if (closeMenu) {
3432
- this.adapter.closeMenu();
3433
- }
3434
- if (!skipNotify && this.lastSelectedIndex !== index) {
3435
- this.handleChange();
3436
- }
3437
- this.lastSelectedIndex = index;
3438
- };
3439
- MDCSelectFoundation.prototype.setValue = function (value, skipNotify) {
3440
- if (skipNotify === void 0) { skipNotify = false; }
3441
- var index = this.adapter.getMenuItemValues().indexOf(value);
3442
- this.setSelectedIndex(index, /** closeMenu */ false, skipNotify);
3443
- };
3444
- MDCSelectFoundation.prototype.getValue = function () {
3445
- var index = this.adapter.getSelectedIndex();
3446
- var menuItemValues = this.adapter.getMenuItemValues();
3447
- return index !== numbers.UNSET_INDEX ? menuItemValues[index] : '';
3448
- };
3449
- MDCSelectFoundation.prototype.getDisabled = function () {
3450
- return this.disabled;
3451
- };
3452
- MDCSelectFoundation.prototype.setDisabled = function (isDisabled) {
3453
- this.disabled = isDisabled;
3454
- if (this.disabled) {
3455
- this.adapter.addClass(cssClasses$1.DISABLED);
3456
- this.adapter.closeMenu();
3457
- }
3458
- else {
3459
- this.adapter.removeClass(cssClasses$1.DISABLED);
3460
- }
3461
- if (this.leadingIcon) {
3462
- this.leadingIcon.setDisabled(this.disabled);
3463
- }
3464
- if (this.disabled) {
3465
- // Prevent click events from focusing select. Simply pointer-events: none
3466
- // is not enough since screenreader clicks may bypass this.
3467
- this.adapter.removeSelectAnchorAttr('tabindex');
3468
- }
3469
- else {
3470
- this.adapter.setSelectAnchorAttr('tabindex', '0');
3471
- }
3472
- this.adapter.setSelectAnchorAttr('aria-disabled', this.disabled.toString());
3473
- };
3474
- /** Opens the menu. */
3475
- MDCSelectFoundation.prototype.openMenu = function () {
3476
- this.adapter.addClass(cssClasses$1.ACTIVATED);
3477
- this.adapter.openMenu();
3478
- this.isMenuOpen = true;
3479
- this.adapter.setSelectAnchorAttr('aria-expanded', 'true');
3480
- };
3481
- /**
3482
- * @param content Sets the content of the helper text.
3483
- */
3484
- MDCSelectFoundation.prototype.setHelperTextContent = function (content) {
3485
- if (this.helperText) {
3486
- this.helperText.setContent(content);
3487
- }
3488
- };
3489
- /**
3490
- * Re-calculates if the notched outline should be notched and if the label
3491
- * should float.
3492
- */
3493
- MDCSelectFoundation.prototype.layout = function () {
3494
- if (this.adapter.hasLabel()) {
3495
- var optionHasValue = this.getValue().length > 0;
3496
- var isFocused = this.adapter.hasClass(cssClasses$1.FOCUSED);
3497
- var shouldFloatAndNotch = optionHasValue || isFocused;
3498
- var isRequired = this.adapter.hasClass(cssClasses$1.REQUIRED);
3499
- this.notchOutline(shouldFloatAndNotch);
3500
- this.adapter.floatLabel(shouldFloatAndNotch);
3501
- this.adapter.setLabelRequired(isRequired);
3502
- }
3503
- };
3504
- /**
3505
- * Synchronizes the list of options with the state of the foundation. Call
3506
- * this whenever menu options are dynamically updated.
3507
- */
3508
- MDCSelectFoundation.prototype.layoutOptions = function () {
3509
- var menuItemValues = this.adapter.getMenuItemValues();
3510
- var selectedIndex = menuItemValues.indexOf(this.getValue());
3511
- this.setSelectedIndex(selectedIndex, /** closeMenu */ false, /** skipNotify */ true);
3512
- };
3513
- MDCSelectFoundation.prototype.handleMenuOpened = function () {
3514
- if (this.adapter.getMenuItemValues().length === 0) {
3515
- return;
3516
- }
3517
- // Menu should open to the last selected element, should open to first menu item otherwise.
3518
- var selectedIndex = this.getSelectedIndex();
3519
- var focusItemIndex = selectedIndex >= 0 ? selectedIndex : 0;
3520
- this.adapter.focusMenuItemAtIndex(focusItemIndex);
3521
- };
3522
- MDCSelectFoundation.prototype.handleMenuClosing = function () {
3523
- this.adapter.setSelectAnchorAttr('aria-expanded', 'false');
3524
- };
3525
- MDCSelectFoundation.prototype.handleMenuClosed = function () {
3526
- this.adapter.removeClass(cssClasses$1.ACTIVATED);
3527
- this.isMenuOpen = false;
3528
- // Unfocus the select if menu is closed without a selection
3529
- if (!this.adapter.isSelectAnchorFocused()) {
3530
- this.blur();
3531
- }
3532
- };
3533
- /**
3534
- * Handles value changes, via change event or programmatic updates.
3535
- */
3536
- MDCSelectFoundation.prototype.handleChange = function () {
3537
- this.layout();
3538
- this.adapter.notifyChange(this.getValue());
3539
- var isRequired = this.adapter.hasClass(cssClasses$1.REQUIRED);
3540
- if (isRequired && this.useDefaultValidation) {
3541
- this.setValid(this.isValid());
3542
- }
3543
- };
3544
- MDCSelectFoundation.prototype.handleMenuItemAction = function (index) {
3545
- this.setSelectedIndex(index, /** closeMenu */ true);
3546
- };
3547
- /**
3548
- * Handles focus events from select element.
3549
- */
3550
- MDCSelectFoundation.prototype.handleFocus = function () {
3551
- this.adapter.addClass(cssClasses$1.FOCUSED);
3552
- this.layout();
3553
- this.adapter.activateBottomLine();
3554
- };
3555
- /**
3556
- * Handles blur events from select element.
3557
- */
3558
- MDCSelectFoundation.prototype.handleBlur = function () {
3559
- if (this.isMenuOpen) {
3560
- return;
3561
- }
3562
- this.blur();
3563
- };
3564
- MDCSelectFoundation.prototype.handleClick = function (normalizedX) {
3565
- if (this.disabled || this.recentlyClicked) {
3566
- return;
3567
- }
3568
- this.setClickDebounceTimeout();
3569
- if (this.isMenuOpen) {
3570
- this.adapter.closeMenu();
3571
- return;
3572
- }
3573
- this.adapter.setRippleCenter(normalizedX);
3574
- this.openMenu();
3575
- };
3576
- /**
3577
- * Handles keydown events on select element. Depending on the type of
3578
- * character typed, does typeahead matching or opens menu.
3579
- */
3580
- MDCSelectFoundation.prototype.handleKeydown = function (event) {
3581
- if (this.isMenuOpen || !this.adapter.hasClass(cssClasses$1.FOCUSED)) {
3582
- return;
3583
- }
3584
- var isEnter = normalizeKey(event) === KEY.ENTER;
3585
- var isSpace = normalizeKey(event) === KEY.SPACEBAR;
3586
- var arrowUp = normalizeKey(event) === KEY.ARROW_UP;
3587
- var arrowDown = normalizeKey(event) === KEY.ARROW_DOWN;
3588
- var isModifier = event.ctrlKey || event.metaKey;
3589
- // Typeahead
3590
- if (!isModifier &&
3591
- (!isSpace && event.key && event.key.length === 1 ||
3592
- isSpace && this.adapter.isTypeaheadInProgress())) {
3593
- var key = isSpace ? ' ' : event.key;
3594
- var typeaheadNextIndex = this.adapter.typeaheadMatchItem(key, this.getSelectedIndex());
3595
- if (typeaheadNextIndex >= 0) {
3596
- this.setSelectedIndex(typeaheadNextIndex);
3597
- }
3598
- event.preventDefault();
3599
- return;
3600
- }
3601
- if (!isEnter && !isSpace && !arrowUp && !arrowDown) {
3602
- return;
3603
- }
3604
- this.openMenu();
3605
- event.preventDefault();
3606
- };
3607
- /**
3608
- * Opens/closes the notched outline.
3609
- */
3610
- MDCSelectFoundation.prototype.notchOutline = function (openNotch) {
3611
- if (!this.adapter.hasOutline()) {
3612
- return;
3613
- }
3614
- var isFocused = this.adapter.hasClass(cssClasses$1.FOCUSED);
3615
- if (openNotch) {
3616
- var labelScale = numbers.LABEL_SCALE;
3617
- var labelWidth = this.adapter.getLabelWidth() * labelScale;
3618
- this.adapter.notchOutline(labelWidth);
3619
- }
3620
- else if (!isFocused) {
3621
- this.adapter.closeOutline();
3622
- }
3623
- };
3624
- /**
3625
- * Sets the aria label of the leading icon.
3626
- */
3627
- MDCSelectFoundation.prototype.setLeadingIconAriaLabel = function (label) {
3628
- if (this.leadingIcon) {
3629
- this.leadingIcon.setAriaLabel(label);
3630
- }
3631
- };
3632
- /**
3633
- * Sets the text content of the leading icon.
3634
- */
3635
- MDCSelectFoundation.prototype.setLeadingIconContent = function (content) {
3636
- if (this.leadingIcon) {
3637
- this.leadingIcon.setContent(content);
3638
- }
3639
- };
3640
- MDCSelectFoundation.prototype.getUseDefaultValidation = function () {
3641
- return this.useDefaultValidation;
3642
- };
3643
- MDCSelectFoundation.prototype.setUseDefaultValidation = function (useDefaultValidation) {
3644
- this.useDefaultValidation = useDefaultValidation;
3645
- };
3646
- MDCSelectFoundation.prototype.setValid = function (isValid) {
3647
- if (!this.useDefaultValidation) {
3648
- this.customValidity = isValid;
3649
- }
3650
- this.adapter.setSelectAnchorAttr('aria-invalid', (!isValid).toString());
3651
- if (isValid) {
3652
- this.adapter.removeClass(cssClasses$1.INVALID);
3653
- this.adapter.removeMenuClass(cssClasses$1.MENU_INVALID);
3654
- }
3655
- else {
3656
- this.adapter.addClass(cssClasses$1.INVALID);
3657
- this.adapter.addMenuClass(cssClasses$1.MENU_INVALID);
3658
- }
3659
- this.syncHelperTextValidity(isValid);
3660
- };
3661
- MDCSelectFoundation.prototype.isValid = function () {
3662
- if (this.useDefaultValidation &&
3663
- this.adapter.hasClass(cssClasses$1.REQUIRED) &&
3664
- !this.adapter.hasClass(cssClasses$1.DISABLED)) {
3665
- // See notes for required attribute under https://www.w3.org/TR/html52/sec-forms.html#the-select-element
3666
- // TL;DR: Invalid if no index is selected, or if the first index is selected and has an empty value.
3667
- return this.getSelectedIndex() !== numbers.UNSET_INDEX &&
3668
- (this.getSelectedIndex() !== 0 || Boolean(this.getValue()));
3669
- }
3670
- return this.customValidity;
3671
- };
3672
- MDCSelectFoundation.prototype.setRequired = function (isRequired) {
3673
- if (isRequired) {
3674
- this.adapter.addClass(cssClasses$1.REQUIRED);
3675
- }
3676
- else {
3677
- this.adapter.removeClass(cssClasses$1.REQUIRED);
3678
- }
3679
- this.adapter.setSelectAnchorAttr('aria-required', isRequired.toString());
3680
- this.adapter.setLabelRequired(isRequired);
3681
- };
3682
- MDCSelectFoundation.prototype.getRequired = function () {
3683
- return this.adapter.getSelectAnchorAttr('aria-required') === 'true';
3684
- };
3685
- MDCSelectFoundation.prototype.init = function () {
3686
- var anchorEl = this.adapter.getAnchorElement();
3687
- if (anchorEl) {
3688
- this.adapter.setMenuAnchorElement(anchorEl);
3689
- this.adapter.setMenuAnchorCorner(Corner.BOTTOM_START);
3690
- }
3691
- this.adapter.setMenuWrapFocus(false);
3692
- this.setDisabled(this.adapter.hasClass(cssClasses$1.DISABLED));
3693
- this.syncHelperTextValidity(!this.adapter.hasClass(cssClasses$1.INVALID));
3694
- this.layout();
3695
- this.layoutOptions();
3696
- };
3697
- /**
3698
- * Unfocuses the select component.
3699
- */
3700
- MDCSelectFoundation.prototype.blur = function () {
3701
- this.adapter.removeClass(cssClasses$1.FOCUSED);
3702
- this.layout();
3703
- this.adapter.deactivateBottomLine();
3704
- var isRequired = this.adapter.hasClass(cssClasses$1.REQUIRED);
3705
- if (isRequired && this.useDefaultValidation) {
3706
- this.setValid(this.isValid());
3707
- }
3708
- };
3709
- MDCSelectFoundation.prototype.syncHelperTextValidity = function (isValid) {
3710
- if (!this.helperText) {
3711
- return;
3712
- }
3713
- this.helperText.setValidity(isValid);
3714
- var helperTextVisible = this.helperText.isVisible();
3715
- var helperTextId = this.helperText.getId();
3716
- if (helperTextVisible && helperTextId) {
3717
- this.adapter.setSelectAnchorAttr(strings$2.ARIA_DESCRIBEDBY, helperTextId);
3718
- }
3719
- else {
3720
- // Needed because screenreaders will read labels pointed to by
3721
- // `aria-describedby` even if they are `aria-hidden`.
3722
- this.adapter.removeSelectAnchorAttr(strings$2.ARIA_DESCRIBEDBY);
3723
- }
3724
- };
3725
- MDCSelectFoundation.prototype.setClickDebounceTimeout = function () {
3726
- var _this = this;
3727
- clearTimeout(this.clickDebounceTimeout);
3728
- this.clickDebounceTimeout = setTimeout(function () {
3729
- _this.recentlyClicked = false;
3730
- }, numbers.CLICK_DEBOUNCE_TIMEOUT_MS);
3731
- this.recentlyClicked = true;
3732
- };
3733
- return MDCSelectFoundation;
3734
- }(component.MDCFoundation));
3735
-
3736
- /**
3737
- * @license
3738
- * Copyright 2018 Google Inc.
3739
- *
3740
- * Permission is hereby granted, free of charge, to any person obtaining a copy
3741
- * of this software and associated documentation files (the "Software"), to deal
3742
- * in the Software without restriction, including without limitation the rights
3743
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
3744
- * copies of the Software, and to permit persons to whom the Software is
3745
- * furnished to do so, subject to the following conditions:
3746
- *
3747
- * The above copyright notice and this permission notice shall be included in
3748
- * all copies or substantial portions of the Software.
3749
- *
3750
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
3751
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
3752
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
3753
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
3754
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
3755
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
3756
- * THE SOFTWARE.
3757
- */
3758
- var strings$1 = {
3759
- ARIA_HIDDEN: 'aria-hidden',
3760
- ROLE: 'role',
3761
- };
3762
- var cssClasses = {
3763
- HELPER_TEXT_VALIDATION_MSG: 'mdc-select-helper-text--validation-msg',
3764
- HELPER_TEXT_VALIDATION_MSG_PERSISTENT: 'mdc-select-helper-text--validation-msg-persistent',
3765
- };
3766
-
3767
- /**
3768
- * @license
3769
- * Copyright 2018 Google Inc.
3770
- *
3771
- * Permission is hereby granted, free of charge, to any person obtaining a copy
3772
- * of this software and associated documentation files (the "Software"), to deal
3773
- * in the Software without restriction, including without limitation the rights
3774
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
3775
- * copies of the Software, and to permit persons to whom the Software is
3776
- * furnished to do so, subject to the following conditions:
3777
- *
3778
- * The above copyright notice and this permission notice shall be included in
3779
- * all copies or substantial portions of the Software.
3780
- *
3781
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
3782
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
3783
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
3784
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
3785
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
3786
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
3787
- * THE SOFTWARE.
3788
- */
3789
- var MDCSelectHelperTextFoundation = /** @class */ (function (_super) {
3790
- component.__extends(MDCSelectHelperTextFoundation, _super);
3791
- function MDCSelectHelperTextFoundation(adapter) {
3792
- return _super.call(this, component.__assign(component.__assign({}, MDCSelectHelperTextFoundation.defaultAdapter), adapter)) || this;
3793
- }
3794
- Object.defineProperty(MDCSelectHelperTextFoundation, "cssClasses", {
3795
- get: function () {
3796
- return cssClasses;
3797
- },
3798
- enumerable: false,
3799
- configurable: true
3800
- });
3801
- Object.defineProperty(MDCSelectHelperTextFoundation, "strings", {
3802
- get: function () {
3803
- return strings$1;
3804
- },
3805
- enumerable: false,
3806
- configurable: true
3807
- });
3808
- Object.defineProperty(MDCSelectHelperTextFoundation, "defaultAdapter", {
3809
- /**
3810
- * See {@link MDCSelectHelperTextAdapter} for typing information on parameters and return types.
3811
- */
3812
- get: function () {
3813
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
3814
- return {
3815
- addClass: function () { return undefined; },
3816
- removeClass: function () { return undefined; },
3817
- hasClass: function () { return false; },
3818
- setAttr: function () { return undefined; },
3819
- getAttr: function () { return null; },
3820
- removeAttr: function () { return undefined; },
3821
- setContent: function () { return undefined; },
3822
- };
3823
- // tslint:enable:object-literal-sort-keys
3824
- },
3825
- enumerable: false,
3826
- configurable: true
3827
- });
3828
- /**
3829
- * @return The ID of the helper text, or null if none is set.
3830
- */
3831
- MDCSelectHelperTextFoundation.prototype.getId = function () {
3832
- return this.adapter.getAttr('id');
3833
- };
3834
- /**
3835
- * @return Whether the helper text is currently visible.
3836
- */
3837
- MDCSelectHelperTextFoundation.prototype.isVisible = function () {
3838
- return this.adapter.getAttr(strings$1.ARIA_HIDDEN) !== 'true';
3839
- };
3840
- /**
3841
- * Sets the content of the helper text field.
3842
- */
3843
- MDCSelectHelperTextFoundation.prototype.setContent = function (content) {
3844
- this.adapter.setContent(content);
3845
- };
3846
- /**
3847
- * Sets the helper text to act as a validation message.
3848
- * By default, validation messages are hidden when the select is valid and
3849
- * visible when the select is invalid.
3850
- *
3851
- * @param isValidation True to make the helper text act as an error validation
3852
- * message.
3853
- */
3854
- MDCSelectHelperTextFoundation.prototype.setValidation = function (isValidation) {
3855
- if (isValidation) {
3856
- this.adapter.addClass(cssClasses.HELPER_TEXT_VALIDATION_MSG);
3857
- }
3858
- else {
3859
- this.adapter.removeClass(cssClasses.HELPER_TEXT_VALIDATION_MSG);
3860
- }
3861
- };
3862
- /**
3863
- * Sets the persistency of the validation helper text.
3864
- * This keeps the validation message visible even if the select is valid,
3865
- * though it will be displayed in the normal (grey) color.
3866
- */
3867
- MDCSelectHelperTextFoundation.prototype.setValidationMsgPersistent = function (isPersistent) {
3868
- if (isPersistent) {
3869
- this.adapter.addClass(cssClasses.HELPER_TEXT_VALIDATION_MSG_PERSISTENT);
3870
- }
3871
- else {
3872
- this.adapter.removeClass(cssClasses.HELPER_TEXT_VALIDATION_MSG_PERSISTENT);
3873
- }
3874
- };
3875
- /**
3876
- * @return Whether the helper text acts as a validation message.
3877
- * By default, validation messages are hidden when the select is valid and
3878
- * visible when the select is invalid.
3879
- */
3880
- MDCSelectHelperTextFoundation.prototype.getIsValidation = function () {
3881
- return this.adapter.hasClass(cssClasses.HELPER_TEXT_VALIDATION_MSG);
3882
- };
3883
- /**
3884
- * @return Whether the validation helper text persists even if the input is
3885
- * valid. If it is, it will be displayed in the normal (grey) color.
3886
- */
3887
- MDCSelectHelperTextFoundation.prototype.getIsValidationMsgPersistent = function () {
3888
- return this.adapter.hasClass(cssClasses.HELPER_TEXT_VALIDATION_MSG_PERSISTENT);
3889
- };
3890
- /**
3891
- * When acting as a validation message, shows/hides the helper text and
3892
- * triggers alerts as necessary based on the select's validity.
3893
- */
3894
- MDCSelectHelperTextFoundation.prototype.setValidity = function (selectIsValid) {
3895
- var isValidationMsg = this.adapter.hasClass(cssClasses.HELPER_TEXT_VALIDATION_MSG);
3896
- if (!isValidationMsg) {
3897
- // Non-validating helper-text is always displayed and does not participate
3898
- // in validation logic.
3899
- return;
3900
- }
3901
- var isPersistentValidationMsg = this.adapter.hasClass(cssClasses.HELPER_TEXT_VALIDATION_MSG_PERSISTENT);
3902
- // Validating helper text is displayed if select is invalid, unless it is
3903
- // set as persistent, in which case it always displays.
3904
- var msgShouldDisplay = !selectIsValid || isPersistentValidationMsg;
3905
- if (msgShouldDisplay) {
3906
- this.showToScreenReader();
3907
- // In addition to displaying, also trigger an alert if the select
3908
- // has become invalid.
3909
- if (!selectIsValid) {
3910
- this.adapter.setAttr(strings$1.ROLE, 'alert');
3911
- }
3912
- else {
3913
- this.adapter.removeAttr(strings$1.ROLE);
3914
- }
3915
- return;
3916
- }
3917
- // Hide everything.
3918
- this.adapter.removeAttr(strings$1.ROLE);
3919
- this.hide();
3920
- };
3921
- /**
3922
- * Makes the helper text visible to screen readers.
3923
- */
3924
- MDCSelectHelperTextFoundation.prototype.showToScreenReader = function () {
3925
- this.adapter.removeAttr(strings$1.ARIA_HIDDEN);
3926
- };
3927
- /**
3928
- * Hides the help text from screen readers.
3929
- */
3930
- MDCSelectHelperTextFoundation.prototype.hide = function () {
3931
- this.adapter.setAttr(strings$1.ARIA_HIDDEN, 'true');
3932
- };
3933
- return MDCSelectHelperTextFoundation;
3934
- }(component.MDCFoundation));
3935
-
3936
- /**
3937
- * @license
3938
- * Copyright 2018 Google Inc.
3939
- *
3940
- * Permission is hereby granted, free of charge, to any person obtaining a copy
3941
- * of this software and associated documentation files (the "Software"), to deal
3942
- * in the Software without restriction, including without limitation the rights
3943
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
3944
- * copies of the Software, and to permit persons to whom the Software is
3945
- * furnished to do so, subject to the following conditions:
3946
- *
3947
- * The above copyright notice and this permission notice shall be included in
3948
- * all copies or substantial portions of the Software.
3949
- *
3950
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
3951
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
3952
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
3953
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
3954
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
3955
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
3956
- * THE SOFTWARE.
3957
- */
3958
- var MDCSelectHelperText = /** @class */ (function (_super) {
3959
- component.__extends(MDCSelectHelperText, _super);
3960
- function MDCSelectHelperText() {
3961
- return _super !== null && _super.apply(this, arguments) || this;
3962
- }
3963
- MDCSelectHelperText.attachTo = function (root) {
3964
- return new MDCSelectHelperText(root);
3965
- };
3966
- Object.defineProperty(MDCSelectHelperText.prototype, "foundationForSelect", {
3967
- // Provided for access by MDCSelect component
3968
- get: function () {
3969
- return this.foundation;
3970
- },
3971
- enumerable: false,
3972
- configurable: true
3973
- });
3974
- MDCSelectHelperText.prototype.getDefaultFoundation = function () {
3975
- var _this = this;
3976
- // DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
3977
- // To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
3978
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
3979
- var adapter = {
3980
- addClass: function (className) { return _this.root.classList.add(className); },
3981
- removeClass: function (className) { return _this.root.classList.remove(className); },
3982
- hasClass: function (className) { return _this.root.classList.contains(className); },
3983
- getAttr: function (attr) { return _this.root.getAttribute(attr); },
3984
- setAttr: function (attr, value) { return _this.root.setAttribute(attr, value); },
3985
- removeAttr: function (attr) { return _this.root.removeAttribute(attr); },
3986
- setContent: function (content) {
3987
- _this.root.textContent = content;
3988
- },
3989
- };
3990
- // tslint:enable:object-literal-sort-keys
3991
- return new MDCSelectHelperTextFoundation(adapter);
3992
- };
3993
- return MDCSelectHelperText;
3994
- }(component.MDCComponent));
3995
-
3996
- /**
3997
- * @license
3998
- * Copyright 2018 Google Inc.
3999
- *
4000
- * Permission is hereby granted, free of charge, to any person obtaining a copy
4001
- * of this software and associated documentation files (the "Software"), to deal
4002
- * in the Software without restriction, including without limitation the rights
4003
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
4004
- * copies of the Software, and to permit persons to whom the Software is
4005
- * furnished to do so, subject to the following conditions:
4006
- *
4007
- * The above copyright notice and this permission notice shall be included in
4008
- * all copies or substantial portions of the Software.
4009
- *
4010
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
4011
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
4012
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
4013
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
4014
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
4015
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
4016
- * THE SOFTWARE.
4017
- */
4018
- var strings = {
4019
- ICON_EVENT: 'MDCSelect:icon',
4020
- ICON_ROLE: 'button',
4021
- };
4022
-
4023
- /**
4024
- * @license
4025
- * Copyright 2018 Google Inc.
4026
- *
4027
- * Permission is hereby granted, free of charge, to any person obtaining a copy
4028
- * of this software and associated documentation files (the "Software"), to deal
4029
- * in the Software without restriction, including without limitation the rights
4030
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
4031
- * copies of the Software, and to permit persons to whom the Software is
4032
- * furnished to do so, subject to the following conditions:
4033
- *
4034
- * The above copyright notice and this permission notice shall be included in
4035
- * all copies or substantial portions of the Software.
4036
- *
4037
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
4038
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
4039
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
4040
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
4041
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
4042
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
4043
- * THE SOFTWARE.
4044
- */
4045
- var INTERACTION_EVENTS = ['click', 'keydown'];
4046
- var MDCSelectIconFoundation = /** @class */ (function (_super) {
4047
- component.__extends(MDCSelectIconFoundation, _super);
4048
- function MDCSelectIconFoundation(adapter) {
4049
- var _this = _super.call(this, component.__assign(component.__assign({}, MDCSelectIconFoundation.defaultAdapter), adapter)) || this;
4050
- _this.savedTabIndex = null;
4051
- _this.interactionHandler = function (evt) {
4052
- _this.handleInteraction(evt);
4053
- };
4054
- return _this;
4055
- }
4056
- Object.defineProperty(MDCSelectIconFoundation, "strings", {
4057
- get: function () {
4058
- return strings;
4059
- },
4060
- enumerable: false,
4061
- configurable: true
4062
- });
4063
- Object.defineProperty(MDCSelectIconFoundation, "defaultAdapter", {
4064
- /**
4065
- * See {@link MDCSelectIconAdapter} for typing information on parameters and return types.
4066
- */
4067
- get: function () {
4068
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
4069
- return {
4070
- getAttr: function () { return null; },
4071
- setAttr: function () { return undefined; },
4072
- removeAttr: function () { return undefined; },
4073
- setContent: function () { return undefined; },
4074
- registerInteractionHandler: function () { return undefined; },
4075
- deregisterInteractionHandler: function () { return undefined; },
4076
- notifyIconAction: function () { return undefined; },
4077
- };
4078
- // tslint:enable:object-literal-sort-keys
4079
- },
4080
- enumerable: false,
4081
- configurable: true
4082
- });
4083
- MDCSelectIconFoundation.prototype.init = function () {
4084
- var e_1, _a;
4085
- this.savedTabIndex = this.adapter.getAttr('tabindex');
4086
- try {
4087
- for (var INTERACTION_EVENTS_1 = component.__values(INTERACTION_EVENTS), INTERACTION_EVENTS_1_1 = INTERACTION_EVENTS_1.next(); !INTERACTION_EVENTS_1_1.done; INTERACTION_EVENTS_1_1 = INTERACTION_EVENTS_1.next()) {
4088
- var evtType = INTERACTION_EVENTS_1_1.value;
4089
- this.adapter.registerInteractionHandler(evtType, this.interactionHandler);
4090
- }
4091
- }
4092
- catch (e_1_1) { e_1 = { error: e_1_1 }; }
4093
- finally {
4094
- try {
4095
- if (INTERACTION_EVENTS_1_1 && !INTERACTION_EVENTS_1_1.done && (_a = INTERACTION_EVENTS_1.return)) _a.call(INTERACTION_EVENTS_1);
4096
- }
4097
- finally { if (e_1) throw e_1.error; }
4098
- }
4099
- };
4100
- MDCSelectIconFoundation.prototype.destroy = function () {
4101
- var e_2, _a;
4102
- try {
4103
- for (var INTERACTION_EVENTS_2 = component.__values(INTERACTION_EVENTS), INTERACTION_EVENTS_2_1 = INTERACTION_EVENTS_2.next(); !INTERACTION_EVENTS_2_1.done; INTERACTION_EVENTS_2_1 = INTERACTION_EVENTS_2.next()) {
4104
- var evtType = INTERACTION_EVENTS_2_1.value;
4105
- this.adapter.deregisterInteractionHandler(evtType, this.interactionHandler);
4106
- }
4107
- }
4108
- catch (e_2_1) { e_2 = { error: e_2_1 }; }
4109
- finally {
4110
- try {
4111
- if (INTERACTION_EVENTS_2_1 && !INTERACTION_EVENTS_2_1.done && (_a = INTERACTION_EVENTS_2.return)) _a.call(INTERACTION_EVENTS_2);
4112
- }
4113
- finally { if (e_2) throw e_2.error; }
4114
- }
4115
- };
4116
- MDCSelectIconFoundation.prototype.setDisabled = function (disabled) {
4117
- if (!this.savedTabIndex) {
4118
- return;
4119
- }
4120
- if (disabled) {
4121
- this.adapter.setAttr('tabindex', '-1');
4122
- this.adapter.removeAttr('role');
4123
- }
4124
- else {
4125
- this.adapter.setAttr('tabindex', this.savedTabIndex);
4126
- this.adapter.setAttr('role', strings.ICON_ROLE);
4127
- }
4128
- };
4129
- MDCSelectIconFoundation.prototype.setAriaLabel = function (label) {
4130
- this.adapter.setAttr('aria-label', label);
4131
- };
4132
- MDCSelectIconFoundation.prototype.setContent = function (content) {
4133
- this.adapter.setContent(content);
4134
- };
4135
- MDCSelectIconFoundation.prototype.handleInteraction = function (evt) {
4136
- var isEnterKey = evt.key === 'Enter' || evt.keyCode === 13;
4137
- if (evt.type === 'click' || isEnterKey) {
4138
- this.adapter.notifyIconAction();
4139
- }
4140
- };
4141
- return MDCSelectIconFoundation;
4142
- }(component.MDCFoundation));
4143
-
4144
- /**
4145
- * @license
4146
- * Copyright 2018 Google Inc.
4147
- *
4148
- * Permission is hereby granted, free of charge, to any person obtaining a copy
4149
- * of this software and associated documentation files (the "Software"), to deal
4150
- * in the Software without restriction, including without limitation the rights
4151
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
4152
- * copies of the Software, and to permit persons to whom the Software is
4153
- * furnished to do so, subject to the following conditions:
4154
- *
4155
- * The above copyright notice and this permission notice shall be included in
4156
- * all copies or substantial portions of the Software.
4157
- *
4158
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
4159
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
4160
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
4161
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
4162
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
4163
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
4164
- * THE SOFTWARE.
4165
- */
4166
- var MDCSelectIcon = /** @class */ (function (_super) {
4167
- component.__extends(MDCSelectIcon, _super);
4168
- function MDCSelectIcon() {
4169
- return _super !== null && _super.apply(this, arguments) || this;
4170
- }
4171
- MDCSelectIcon.attachTo = function (root) {
4172
- return new MDCSelectIcon(root);
4173
- };
4174
- Object.defineProperty(MDCSelectIcon.prototype, "foundationForSelect", {
4175
- // Provided for access by MDCSelect component
4176
- get: function () {
4177
- return this.foundation;
4178
- },
4179
- enumerable: false,
4180
- configurable: true
4181
- });
4182
- MDCSelectIcon.prototype.getDefaultFoundation = function () {
4183
- var _this = this;
4184
- // DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
4185
- // To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
4186
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
4187
- var adapter = {
4188
- getAttr: function (attr) { return _this.root.getAttribute(attr); },
4189
- setAttr: function (attr, value) { return _this.root.setAttribute(attr, value); },
4190
- removeAttr: function (attr) { return _this.root.removeAttribute(attr); },
4191
- setContent: function (content) {
4192
- _this.root.textContent = content;
4193
- },
4194
- registerInteractionHandler: function (evtType, handler) {
4195
- return _this.listen(evtType, handler);
4196
- },
4197
- deregisterInteractionHandler: function (evtType, handler) {
4198
- return _this.unlisten(evtType, handler);
4199
- },
4200
- notifyIconAction: function () { return _this.emit(MDCSelectIconFoundation.strings.ICON_EVENT, {} /* evtData */, true /* shouldBubble */); },
4201
- };
4202
- // tslint:enable:object-literal-sort-keys
4203
- return new MDCSelectIconFoundation(adapter);
4204
- };
4205
- return MDCSelectIcon;
4206
- }(component.MDCComponent));
4207
-
4208
- /**
4209
- * @license
4210
- * Copyright 2016 Google Inc.
4211
- *
4212
- * Permission is hereby granted, free of charge, to any person obtaining a copy
4213
- * of this software and associated documentation files (the "Software"), to deal
4214
- * in the Software without restriction, including without limitation the rights
4215
- * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
4216
- * copies of the Software, and to permit persons to whom the Software is
4217
- * furnished to do so, subject to the following conditions:
4218
- *
4219
- * The above copyright notice and this permission notice shall be included in
4220
- * all copies or substantial portions of the Software.
4221
- *
4222
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
4223
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
4224
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
4225
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
4226
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
4227
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
4228
- * THE SOFTWARE.
4229
- */
4230
- var MDCSelect = /** @class */ (function (_super) {
4231
- component.__extends(MDCSelect, _super);
4232
- function MDCSelect() {
4233
- return _super !== null && _super.apply(this, arguments) || this;
4234
- }
4235
- MDCSelect.attachTo = function (root) {
4236
- return new MDCSelect(root);
4237
- };
4238
- MDCSelect.prototype.initialize = function (labelFactory, lineRippleFactory, outlineFactory, menuFactory, iconFactory, helperTextFactory) {
4239
- if (labelFactory === void 0) { labelFactory = function (el) { return new component.MDCFloatingLabel(el); }; }
4240
- if (lineRippleFactory === void 0) { lineRippleFactory = function (el) { return new component.MDCLineRipple(el); }; }
4241
- if (outlineFactory === void 0) { outlineFactory = function (el) { return new component.MDCNotchedOutline(el); }; }
4242
- if (menuFactory === void 0) { menuFactory = function (el) { return new MDCMenu(el); }; }
4243
- if (iconFactory === void 0) { iconFactory = function (el) { return new MDCSelectIcon(el); }; }
4244
- if (helperTextFactory === void 0) { helperTextFactory = function (el) { return new MDCSelectHelperText(el); }; }
4245
- this.selectAnchor =
4246
- this.root.querySelector(strings$2.SELECT_ANCHOR_SELECTOR);
4247
- this.selectedText =
4248
- this.root.querySelector(strings$2.SELECTED_TEXT_SELECTOR);
4249
- this.hiddenInput = this.root.querySelector(strings$2.HIDDEN_INPUT_SELECTOR);
4250
- if (!this.selectedText) {
4251
- throw new Error('MDCSelect: Missing required element: The following selector must be present: ' +
4252
- ("'" + strings$2.SELECTED_TEXT_SELECTOR + "'"));
4253
- }
4254
- if (this.selectAnchor.hasAttribute(strings$2.ARIA_CONTROLS)) {
4255
- var helperTextElement = document.getElementById(this.selectAnchor.getAttribute(strings$2.ARIA_CONTROLS));
4256
- if (helperTextElement) {
4257
- this.helperText = helperTextFactory(helperTextElement);
4258
- }
4259
- }
4260
- this.menuSetup(menuFactory);
4261
- var labelElement = this.root.querySelector(strings$2.LABEL_SELECTOR);
4262
- this.label = labelElement ? labelFactory(labelElement) : null;
4263
- var lineRippleElement = this.root.querySelector(strings$2.LINE_RIPPLE_SELECTOR);
4264
- this.lineRipple =
4265
- lineRippleElement ? lineRippleFactory(lineRippleElement) : null;
4266
- var outlineElement = this.root.querySelector(strings$2.OUTLINE_SELECTOR);
4267
- this.outline = outlineElement ? outlineFactory(outlineElement) : null;
4268
- var leadingIcon = this.root.querySelector(strings$2.LEADING_ICON_SELECTOR);
4269
- if (leadingIcon) {
4270
- this.leadingIcon = iconFactory(leadingIcon);
4271
- }
4272
- if (!this.root.classList.contains(cssClasses$1.OUTLINED)) {
4273
- this.ripple = this.createRipple();
4274
- }
4275
- };
4276
- /**
4277
- * Initializes the select's event listeners and internal state based
4278
- * on the environment's state.
4279
- */
4280
- MDCSelect.prototype.initialSyncWithDOM = function () {
4281
- var _this = this;
4282
- this.handleFocus = function () {
4283
- _this.foundation.handleFocus();
4284
- };
4285
- this.handleBlur = function () {
4286
- _this.foundation.handleBlur();
4287
- };
4288
- this.handleClick = function (evt) {
4289
- _this.selectAnchor.focus();
4290
- _this.foundation.handleClick(_this.getNormalizedXCoordinate(evt));
4291
- };
4292
- this.handleKeydown = function (evt) {
4293
- _this.foundation.handleKeydown(evt);
4294
- };
4295
- this.handleMenuItemAction = function (evt) {
4296
- _this.foundation.handleMenuItemAction(evt.detail.index);
4297
- };
4298
- this.handleMenuOpened = function () {
4299
- _this.foundation.handleMenuOpened();
4300
- };
4301
- this.handleMenuClosed = function () {
4302
- _this.foundation.handleMenuClosed();
4303
- };
4304
- this.handleMenuClosing = function () {
4305
- _this.foundation.handleMenuClosing();
4306
- };
4307
- this.selectAnchor.addEventListener('focus', this.handleFocus);
4308
- this.selectAnchor.addEventListener('blur', this.handleBlur);
4309
- this.selectAnchor.addEventListener('click', this.handleClick);
4310
- this.selectAnchor.addEventListener('keydown', this.handleKeydown);
4311
- this.menu.listen(strings$5.CLOSED_EVENT, this.handleMenuClosed);
4312
- this.menu.listen(strings$5.CLOSING_EVENT, this.handleMenuClosing);
4313
- this.menu.listen(strings$5.OPENED_EVENT, this.handleMenuOpened);
4314
- this.menu.listen(strings$3.SELECTED_EVENT, this.handleMenuItemAction);
4315
- if (this.hiddenInput) {
4316
- if (this.hiddenInput.value) {
4317
- // If the hidden input already has a value, use it to restore the
4318
- // select's value. This can happen e.g. if the user goes back or (in
4319
- // some browsers) refreshes the page.
4320
- this.foundation.setValue(this.hiddenInput.value, /** skipNotify */ true);
4321
- this.foundation.layout();
4322
- return;
4323
- }
4324
- this.hiddenInput.value = this.value;
4325
- }
4326
- };
4327
- MDCSelect.prototype.destroy = function () {
4328
- this.selectAnchor.removeEventListener('focus', this.handleFocus);
4329
- this.selectAnchor.removeEventListener('blur', this.handleBlur);
4330
- this.selectAnchor.removeEventListener('keydown', this.handleKeydown);
4331
- this.selectAnchor.removeEventListener('click', this.handleClick);
4332
- this.menu.unlisten(strings$5.CLOSED_EVENT, this.handleMenuClosed);
4333
- this.menu.unlisten(strings$5.OPENED_EVENT, this.handleMenuOpened);
4334
- this.menu.unlisten(strings$3.SELECTED_EVENT, this.handleMenuItemAction);
4335
- this.menu.destroy();
4336
- if (this.ripple) {
4337
- this.ripple.destroy();
4338
- }
4339
- if (this.outline) {
4340
- this.outline.destroy();
4341
- }
4342
- if (this.leadingIcon) {
4343
- this.leadingIcon.destroy();
4344
- }
4345
- if (this.helperText) {
4346
- this.helperText.destroy();
4347
- }
4348
- _super.prototype.destroy.call(this);
4349
- };
4350
- Object.defineProperty(MDCSelect.prototype, "value", {
4351
- get: function () {
4352
- return this.foundation.getValue();
4353
- },
4354
- set: function (value) {
4355
- this.foundation.setValue(value);
4356
- },
4357
- enumerable: false,
4358
- configurable: true
4359
- });
4360
- MDCSelect.prototype.setValue = function (value, skipNotify) {
4361
- if (skipNotify === void 0) { skipNotify = false; }
4362
- this.foundation.setValue(value, skipNotify);
4363
- };
4364
- Object.defineProperty(MDCSelect.prototype, "selectedIndex", {
4365
- get: function () {
4366
- return this.foundation.getSelectedIndex();
4367
- },
4368
- set: function (selectedIndex) {
4369
- this.foundation.setSelectedIndex(selectedIndex, /* closeMenu */ true);
4370
- },
4371
- enumerable: false,
4372
- configurable: true
4373
- });
4374
- MDCSelect.prototype.setSelectedIndex = function (selectedIndex, skipNotify) {
4375
- if (skipNotify === void 0) { skipNotify = false; }
4376
- this.foundation.setSelectedIndex(selectedIndex, /* closeMenu */ true, skipNotify);
4377
- };
4378
- Object.defineProperty(MDCSelect.prototype, "disabled", {
4379
- get: function () {
4380
- return this.foundation.getDisabled();
4381
- },
4382
- set: function (disabled) {
4383
- this.foundation.setDisabled(disabled);
4384
- if (this.hiddenInput) {
4385
- this.hiddenInput.disabled = disabled;
4386
- }
4387
- },
4388
- enumerable: false,
4389
- configurable: true
4390
- });
4391
- Object.defineProperty(MDCSelect.prototype, "leadingIconAriaLabel", {
4392
- set: function (label) {
4393
- this.foundation.setLeadingIconAriaLabel(label);
4394
- },
4395
- enumerable: false,
4396
- configurable: true
4397
- });
4398
- Object.defineProperty(MDCSelect.prototype, "leadingIconContent", {
4399
- /**
4400
- * Sets the text content of the leading icon.
4401
- */
4402
- set: function (content) {
4403
- this.foundation.setLeadingIconContent(content);
4404
- },
4405
- enumerable: false,
4406
- configurable: true
4407
- });
4408
- Object.defineProperty(MDCSelect.prototype, "helperTextContent", {
4409
- /**
4410
- * Sets the text content of the helper text.
4411
- */
4412
- set: function (content) {
4413
- this.foundation.setHelperTextContent(content);
4414
- },
4415
- enumerable: false,
4416
- configurable: true
4417
- });
4418
- Object.defineProperty(MDCSelect.prototype, "useDefaultValidation", {
4419
- /**
4420
- * Enables or disables the default validation scheme where a required select
4421
- * must be non-empty. Set to false for custom validation.
4422
- * @param useDefaultValidation Set this to false to ignore default
4423
- * validation scheme.
4424
- */
4425
- set: function (useDefaultValidation) {
4426
- this.foundation.setUseDefaultValidation(useDefaultValidation);
4427
- },
4428
- enumerable: false,
4429
- configurable: true
4430
- });
4431
- Object.defineProperty(MDCSelect.prototype, "valid", {
4432
- /**
4433
- * Checks if the select is in a valid state.
4434
- */
4435
- get: function () {
4436
- return this.foundation.isValid();
4437
- },
4438
- /**
4439
- * Sets the current invalid state of the select.
4440
- */
4441
- set: function (isValid) {
4442
- this.foundation.setValid(isValid);
4443
- },
4444
- enumerable: false,
4445
- configurable: true
4446
- });
4447
- Object.defineProperty(MDCSelect.prototype, "required", {
4448
- /**
4449
- * Returns whether the select is required.
4450
- */
4451
- get: function () {
4452
- return this.foundation.getRequired();
4453
- },
4454
- /**
4455
- * Sets the control to the required state.
4456
- */
4457
- set: function (isRequired) {
4458
- this.foundation.setRequired(isRequired);
4459
- },
4460
- enumerable: false,
4461
- configurable: true
4462
- });
4463
- /**
4464
- * Re-calculates if the notched outline should be notched and if the label
4465
- * should float.
4466
- */
4467
- MDCSelect.prototype.layout = function () {
4468
- this.foundation.layout();
4469
- };
4470
- /**
4471
- * Synchronizes the list of options with the state of the foundation. Call
4472
- * this whenever menu options are dynamically updated.
4473
- */
4474
- MDCSelect.prototype.layoutOptions = function () {
4475
- this.foundation.layoutOptions();
4476
- this.menu.layout();
4477
- // Update cached menuItemValues for adapter.
4478
- this.menuItemValues =
4479
- this.menu.items.map(function (el) { return el.getAttribute(strings$2.VALUE_ATTR) || ''; });
4480
- if (this.hiddenInput) {
4481
- this.hiddenInput.value = this.value;
4482
- }
4483
- };
4484
- MDCSelect.prototype.getDefaultFoundation = function () {
4485
- // DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
4486
- // To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
4487
- var adapter = component.__assign(component.__assign(component.__assign(component.__assign({}, this.getSelectAdapterMethods()), this.getCommonAdapterMethods()), this.getOutlineAdapterMethods()), this.getLabelAdapterMethods());
4488
- return new MDCSelectFoundation(adapter, this.getFoundationMap());
4489
- };
4490
- /**
4491
- * Handles setup for the menu.
4492
- */
4493
- MDCSelect.prototype.menuSetup = function (menuFactory) {
4494
- this.menuElement = this.root.querySelector(strings$2.MENU_SELECTOR);
4495
- this.menu = menuFactory(this.menuElement);
4496
- this.menu.hasTypeahead = true;
4497
- this.menu.singleSelection = true;
4498
- this.menuItemValues =
4499
- this.menu.items.map(function (el) { return el.getAttribute(strings$2.VALUE_ATTR) || ''; });
4500
- };
4501
- MDCSelect.prototype.createRipple = function () {
4502
- var _this = this;
4503
- // DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
4504
- // To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
4505
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
4506
- var adapter = component.__assign(component.__assign({}, component.MDCRipple.createAdapter({ root: this.selectAnchor })), { registerInteractionHandler: function (evtType, handler) {
4507
- _this.selectAnchor.addEventListener(evtType, handler);
4508
- }, deregisterInteractionHandler: function (evtType, handler) {
4509
- _this.selectAnchor.removeEventListener(evtType, handler);
4510
- } });
4511
- // tslint:enable:object-literal-sort-keys
4512
- return new component.MDCRipple(this.selectAnchor, new component.MDCRippleFoundation(adapter));
4513
- };
4514
- MDCSelect.prototype.getSelectAdapterMethods = function () {
4515
- var _this = this;
4516
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
4517
- return {
4518
- getMenuItemAttr: function (menuItem, attr) {
4519
- return menuItem.getAttribute(attr);
4520
- },
4521
- setSelectedText: function (text) {
4522
- _this.selectedText.textContent = text;
4523
- },
4524
- isSelectAnchorFocused: function () { return document.activeElement === _this.selectAnchor; },
4525
- getSelectAnchorAttr: function (attr) {
4526
- return _this.selectAnchor.getAttribute(attr);
4527
- },
4528
- setSelectAnchorAttr: function (attr, value) {
4529
- _this.selectAnchor.setAttribute(attr, value);
4530
- },
4531
- removeSelectAnchorAttr: function (attr) {
4532
- _this.selectAnchor.removeAttribute(attr);
4533
- },
4534
- addMenuClass: function (className) {
4535
- _this.menuElement.classList.add(className);
4536
- },
4537
- removeMenuClass: function (className) {
4538
- _this.menuElement.classList.remove(className);
4539
- },
4540
- openMenu: function () {
4541
- _this.menu.open = true;
4542
- },
4543
- closeMenu: function () {
4544
- _this.menu.open = false;
4545
- },
4546
- getAnchorElement: function () {
4547
- return _this.root.querySelector(strings$2.SELECT_ANCHOR_SELECTOR);
4548
- },
4549
- setMenuAnchorElement: function (anchorEl) {
4550
- _this.menu.setAnchorElement(anchorEl);
4551
- },
4552
- setMenuAnchorCorner: function (anchorCorner) {
4553
- _this.menu.setAnchorCorner(anchorCorner);
4554
- },
4555
- setMenuWrapFocus: function (wrapFocus) {
4556
- _this.menu.wrapFocus = wrapFocus;
4557
- },
4558
- getSelectedIndex: function () {
4559
- var index = _this.menu.selectedIndex;
4560
- return index instanceof Array ? index[0] : index;
4561
- },
4562
- setSelectedIndex: function (index) {
4563
- _this.menu.selectedIndex = index;
4564
- },
4565
- focusMenuItemAtIndex: function (index) {
4566
- _this.menu.items[index].focus();
4567
- },
4568
- getMenuItemCount: function () { return _this.menu.items.length; },
4569
- // Cache menu item values. layoutOptions() updates this cache.
4570
- getMenuItemValues: function () { return _this.menuItemValues; },
4571
- getMenuItemTextAtIndex: function (index) {
4572
- return _this.menu.getPrimaryTextAtIndex(index);
4573
- },
4574
- isTypeaheadInProgress: function () { return _this.menu.typeaheadInProgress; },
4575
- typeaheadMatchItem: function (nextChar, startingIndex) {
4576
- return _this.menu.typeaheadMatchItem(nextChar, startingIndex);
4577
- },
4578
- };
4579
- // tslint:enable:object-literal-sort-keys
4580
- };
4581
- MDCSelect.prototype.getCommonAdapterMethods = function () {
4582
- var _this = this;
4583
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
4584
- return {
4585
- addClass: function (className) {
4586
- _this.root.classList.add(className);
4587
- },
4588
- removeClass: function (className) {
4589
- _this.root.classList.remove(className);
4590
- },
4591
- hasClass: function (className) { return _this.root.classList.contains(className); },
4592
- setRippleCenter: function (normalizedX) {
4593
- _this.lineRipple && _this.lineRipple.setRippleCenter(normalizedX);
4594
- },
4595
- activateBottomLine: function () {
4596
- _this.lineRipple && _this.lineRipple.activate();
4597
- },
4598
- deactivateBottomLine: function () {
4599
- _this.lineRipple && _this.lineRipple.deactivate();
4600
- },
4601
- notifyChange: function (value) {
4602
- if (_this.hiddenInput) {
4603
- _this.hiddenInput.value = value;
4604
- }
4605
- var index = _this.selectedIndex;
4606
- _this.emit(strings$2.CHANGE_EVENT, { value: value, index: index }, true /* shouldBubble */);
4607
- },
4608
- };
4609
- // tslint:enable:object-literal-sort-keys
4610
- };
4611
- MDCSelect.prototype.getOutlineAdapterMethods = function () {
4612
- var _this = this;
4613
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
4614
- return {
4615
- hasOutline: function () { return Boolean(_this.outline); },
4616
- notchOutline: function (labelWidth) {
4617
- _this.outline && _this.outline.notch(labelWidth);
4618
- },
4619
- closeOutline: function () {
4620
- _this.outline && _this.outline.closeNotch();
4621
- },
4622
- };
4623
- // tslint:enable:object-literal-sort-keys
4624
- };
4625
- MDCSelect.prototype.getLabelAdapterMethods = function () {
4626
- var _this = this;
4627
- // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
4628
- return {
4629
- hasLabel: function () { return !!_this.label; },
4630
- floatLabel: function (shouldFloat) {
4631
- _this.label && _this.label.float(shouldFloat);
4632
- },
4633
- getLabelWidth: function () { return _this.label ? _this.label.getWidth() : 0; },
4634
- setLabelRequired: function (isRequired) {
4635
- _this.label && _this.label.setRequired(isRequired);
4636
- },
4637
- };
4638
- // tslint:enable:object-literal-sort-keys
4639
- };
4640
- /**
4641
- * Calculates where the line ripple should start based on the x coordinate within the component.
4642
- */
4643
- MDCSelect.prototype.getNormalizedXCoordinate = function (evt) {
4644
- var targetClientRect = evt.target.getBoundingClientRect();
4645
- var xCoordinate = this.isTouchEvent(evt) ? evt.touches[0].clientX : evt.clientX;
4646
- return xCoordinate - targetClientRect.left;
4647
- };
4648
- MDCSelect.prototype.isTouchEvent = function (evt) {
4649
- return Boolean(evt.touches);
4650
- };
4651
- /**
4652
- * Returns a map of all subcomponents to subfoundations.
4653
- */
4654
- MDCSelect.prototype.getFoundationMap = function () {
4655
- return {
4656
- helperText: this.helperText ? this.helperText.foundationForSelect :
4657
- undefined,
4658
- leadingIcon: this.leadingIcon ? this.leadingIcon.foundationForSelect :
4659
- undefined,
4660
- };
4661
- };
4662
- return MDCSelect;
4663
- }(component.MDCComponent));
4664
-
4665
- exports.MDCSelect = MDCSelect;