@material/web 1.0.0-pre.14 → 1.0.0-pre.16

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 (377) hide show
  1. package/README.md +24 -19
  2. package/all.d.ts +4 -8
  3. package/all.js +4 -8
  4. package/all.js.map +1 -1
  5. package/button/{_tonal-button.scss → _filled-tonal-button.scss} +1 -1
  6. package/button/{tonal-button.d.ts → filled-tonal-button.d.ts} +3 -3
  7. package/button/{tonal-button.js → filled-tonal-button.js} +9 -9
  8. package/button/filled-tonal-button.js.map +1 -0
  9. package/button/internal/_filled-button.scss +0 -1
  10. package/button/internal/{_tonal-button.scss → _filled-tonal-button.scss} +7 -7
  11. package/button/internal/_outlined-button.scss +6 -0
  12. package/button/internal/_shared.scss +19 -8
  13. package/button/internal/_touch-target.scss +5 -1
  14. package/button/internal/button.d.ts +19 -22
  15. package/button/internal/button.js +48 -79
  16. package/button/internal/button.js.map +1 -1
  17. package/button/internal/elevated-styles.css.js +1 -1
  18. package/button/internal/elevated-styles.css.js.map +1 -1
  19. package/button/internal/filled-styles.css.js +1 -1
  20. package/button/internal/filled-styles.css.js.map +1 -1
  21. package/button/internal/{tonal-button.d.ts → filled-tonal-button.d.ts} +2 -2
  22. package/button/internal/{tonal-button.js → filled-tonal-button.js} +3 -3
  23. package/button/internal/filled-tonal-button.js.map +1 -0
  24. package/button/internal/filled-tonal-styles.css.js +9 -0
  25. package/button/internal/filled-tonal-styles.css.js.map +1 -0
  26. package/button/internal/{tonal-styles.scss → filled-tonal-styles.scss} +2 -2
  27. package/button/internal/outlined-styles.css.js +1 -1
  28. package/button/internal/outlined-styles.css.js.map +1 -1
  29. package/button/internal/shared-elevation-styles.css.js +1 -1
  30. package/button/internal/shared-elevation-styles.css.js.map +1 -1
  31. package/button/internal/shared-styles.css.js +1 -1
  32. package/button/internal/shared-styles.css.js.map +1 -1
  33. package/button/internal/text-styles.css.js +1 -1
  34. package/button/internal/text-styles.css.js.map +1 -1
  35. package/checkbox/internal/_checkbox.scss +23 -78
  36. package/checkbox/internal/checkbox-styles.css.js +1 -1
  37. package/checkbox/internal/checkbox-styles.css.js.map +1 -1
  38. package/checkbox/internal/checkbox.d.ts +78 -7
  39. package/checkbox/internal/checkbox.js +136 -23
  40. package/checkbox/internal/checkbox.js.map +1 -1
  41. package/chips/assist-chip.js +1 -2
  42. package/chips/assist-chip.js.map +1 -1
  43. package/chips/filter-chip.js +1 -3
  44. package/chips/filter-chip.js.map +1 -1
  45. package/chips/input-chip.js +1 -5
  46. package/chips/input-chip.js.map +1 -1
  47. package/chips/internal/_assist-chip.scss +6 -0
  48. package/chips/internal/_elevated.scss +1 -1
  49. package/chips/internal/_filter-chip.scss +6 -0
  50. package/chips/internal/_input-chip.scss +32 -0
  51. package/chips/internal/_selectable.scss +17 -13
  52. package/chips/internal/_shared.scss +25 -10
  53. package/chips/internal/_suggestion-chip.scss +6 -0
  54. package/chips/internal/_trailing-icon.scss +24 -24
  55. package/chips/internal/assist-styles.css.js +1 -1
  56. package/chips/internal/assist-styles.css.js.map +1 -1
  57. package/chips/internal/chip-set.js +1 -3
  58. package/chips/internal/chip-set.js.map +1 -1
  59. package/chips/internal/chip.js +1 -3
  60. package/chips/internal/chip.js.map +1 -1
  61. package/chips/internal/elevated-styles.css.js +1 -1
  62. package/chips/internal/elevated-styles.css.js.map +1 -1
  63. package/chips/internal/filter-chip.d.ts +1 -0
  64. package/chips/internal/filter-chip.js +12 -6
  65. package/chips/internal/filter-chip.js.map +1 -1
  66. package/chips/internal/filter-styles.css.js +1 -1
  67. package/chips/internal/filter-styles.css.js.map +1 -1
  68. package/chips/internal/input-styles.css.js +1 -1
  69. package/chips/internal/input-styles.css.js.map +1 -1
  70. package/chips/internal/selectable-styles.css.js +1 -1
  71. package/chips/internal/selectable-styles.css.js.map +1 -1
  72. package/chips/internal/shared-styles.css.js +1 -1
  73. package/chips/internal/shared-styles.css.js.map +1 -1
  74. package/chips/internal/suggestion-styles.css.js +1 -1
  75. package/chips/internal/suggestion-styles.css.js.map +1 -1
  76. package/chips/internal/trailing-icon-styles.css.js +1 -1
  77. package/chips/internal/trailing-icon-styles.css.js.map +1 -1
  78. package/chips/suggestion-chip.js +1 -2
  79. package/chips/suggestion-chip.js.map +1 -1
  80. package/common.d.ts +2 -6
  81. package/common.js +2 -6
  82. package/common.js.map +1 -1
  83. package/dialog/harness.d.ts +1 -6
  84. package/dialog/harness.js +2 -43
  85. package/dialog/harness.js.map +1 -1
  86. package/dialog/internal/_dialog.scss +165 -281
  87. package/dialog/internal/animations.d.ts +47 -0
  88. package/dialog/internal/animations.js +117 -0
  89. package/dialog/internal/animations.js.map +1 -0
  90. package/dialog/internal/dialog-styles.css.js +1 -1
  91. package/dialog/internal/dialog-styles.css.js.map +1 -1
  92. package/dialog/internal/dialog.d.ts +76 -169
  93. package/dialog/internal/dialog.js +251 -475
  94. package/dialog/internal/dialog.js.map +1 -1
  95. package/elevation/internal/_elevation.scss +14 -7
  96. package/elevation/internal/elevation-styles.css.js +1 -1
  97. package/elevation/internal/elevation-styles.css.js.map +1 -1
  98. package/fab/branded-fab.d.ts +0 -1
  99. package/fab/internal/_fab.scss +15 -10
  100. package/fab/internal/_shared.scss +16 -1
  101. package/fab/internal/fab-styles.css.js +1 -1
  102. package/fab/internal/fab-styles.css.js.map +1 -1
  103. package/fab/internal/fab.d.ts +0 -1
  104. package/fab/internal/shared-styles.css.js +1 -1
  105. package/fab/internal/shared-styles.css.js.map +1 -1
  106. package/fab/internal/shared.d.ts +0 -13
  107. package/fab/internal/shared.js +5 -31
  108. package/fab/internal/shared.js.map +1 -1
  109. package/field/internal/filled-styles.css.js +1 -1
  110. package/field/internal/filled-styles.css.js.map +1 -1
  111. package/field/internal/outlined-styles.css.js +1 -1
  112. package/field/internal/outlined-styles.css.js.map +1 -1
  113. package/focus/internal/_focus-ring.scss +52 -48
  114. package/focus/internal/focus-ring-styles.css.js +1 -1
  115. package/focus/internal/focus-ring-styles.css.js.map +1 -1
  116. package/focus/internal/focus-ring.d.ts +2 -1
  117. package/focus/internal/focus-ring.js +10 -0
  118. package/focus/internal/focus-ring.js.map +1 -1
  119. package/icon/internal/_icon.scss +26 -20
  120. package/icon/internal/icon-styles.css.js +1 -1
  121. package/icon/internal/icon-styles.css.js.map +1 -1
  122. package/icon/internal/icon.d.ts +1 -0
  123. package/icon/internal/icon.js +9 -0
  124. package/icon/internal/icon.js.map +1 -1
  125. package/iconbutton/{_standard-icon-button.scss → _icon-button.scss} +1 -1
  126. package/iconbutton/{standard-icon-button.d.ts → icon-button.d.ts} +2 -2
  127. package/iconbutton/{standard-icon-button.js → icon-button.js} +7 -7
  128. package/iconbutton/icon-button.js.map +1 -0
  129. package/iconbutton/internal/_filled-icon-button.scss +8 -6
  130. package/iconbutton/internal/_filled-tonal-icon-button.scss +8 -6
  131. package/iconbutton/internal/{_standard-icon-button.scss → _icon-button.scss} +12 -8
  132. package/iconbutton/internal/_outlined-icon-button.scss +14 -14
  133. package/iconbutton/internal/_shared.scss +15 -9
  134. package/iconbutton/internal/filled-styles.css.js +1 -1
  135. package/iconbutton/internal/filled-styles.css.js.map +1 -1
  136. package/iconbutton/internal/filled-tonal-styles.css.js +1 -1
  137. package/iconbutton/internal/filled-tonal-styles.css.js.map +1 -1
  138. package/iconbutton/internal/icon-button.d.ts +25 -3
  139. package/iconbutton/internal/icon-button.js +45 -6
  140. package/iconbutton/internal/icon-button.js.map +1 -1
  141. package/iconbutton/internal/outlined-styles.css.js +1 -1
  142. package/iconbutton/internal/outlined-styles.css.js.map +1 -1
  143. package/iconbutton/internal/shared-styles.css.js +1 -1
  144. package/iconbutton/internal/shared-styles.css.js.map +1 -1
  145. package/iconbutton/internal/standard-styles.css.js +1 -1
  146. package/iconbutton/internal/standard-styles.css.js.map +1 -1
  147. package/iconbutton/internal/standard-styles.scss +2 -2
  148. package/internal/aria/delegate.d.ts +1 -1
  149. package/internal/aria/delegate.js +1 -1
  150. package/internal/aria/delegate.js.map +1 -1
  151. package/internal/controller/element-internals.d.ts +35 -0
  152. package/internal/controller/element-internals.js +24 -0
  153. package/internal/controller/element-internals.js.map +1 -0
  154. package/internal/controller/form-submitter.d.ts +72 -0
  155. package/internal/controller/form-submitter.js +71 -0
  156. package/internal/controller/form-submitter.js.map +1 -0
  157. package/labs/badge/internal/_badge.scss +11 -8
  158. package/labs/navigationbar/internal/_navigation-bar.scss +11 -9
  159. package/labs/navigationbar/internal/navigation-bar-styles.css.js +1 -1
  160. package/labs/navigationbar/internal/navigation-bar-styles.css.js.map +1 -1
  161. package/labs/navigationbar/internal/navigation-bar.js +1 -3
  162. package/labs/navigationbar/internal/navigation-bar.js.map +1 -1
  163. package/labs/navigationdrawer/internal/_navigation-drawer-modal.scss +11 -8
  164. package/labs/navigationdrawer/internal/_navigation-drawer.scss +11 -8
  165. package/labs/navigationdrawer/internal/navigation-drawer-modal-styles.css.js +1 -1
  166. package/labs/navigationdrawer/internal/navigation-drawer-modal-styles.css.js.map +1 -1
  167. package/labs/navigationdrawer/internal/navigation-drawer-modal.js +1 -3
  168. package/labs/navigationdrawer/internal/navigation-drawer-modal.js.map +1 -1
  169. package/labs/navigationdrawer/internal/navigation-drawer-styles.css.js +1 -1
  170. package/labs/navigationdrawer/internal/navigation-drawer-styles.css.js.map +1 -1
  171. package/labs/navigationdrawer/internal/navigation-drawer.js +1 -3
  172. package/labs/navigationdrawer/internal/navigation-drawer.js.map +1 -1
  173. package/labs/navigationtab/internal/_navigation-tab.scss +10 -10
  174. package/labs/navigationtab/internal/navigation-tab.js +1 -3
  175. package/labs/navigationtab/internal/navigation-tab.js.map +1 -1
  176. package/labs/segmentedbutton/internal/_outlined-segmented-button.scss +1 -3
  177. package/labs/segmentedbutton/internal/outlined-styles.css.js +1 -1
  178. package/labs/segmentedbutton/internal/outlined-styles.css.js.map +1 -1
  179. package/labs/segmentedbutton/internal/segmented-button.js +1 -3
  180. package/labs/segmentedbutton/internal/segmented-button.js.map +1 -1
  181. package/labs/segmentedbuttonset/internal/outlined-styles.css.js +1 -1
  182. package/labs/segmentedbuttonset/internal/outlined-styles.css.js.map +1 -1
  183. package/labs/segmentedbuttonset/internal/segmented-button-set.js +1 -3
  184. package/labs/segmentedbuttonset/internal/segmented-button-set.js.map +1 -1
  185. package/list/internal/_list.scss +6 -2
  186. package/list/internal/list-styles.css.js +1 -1
  187. package/list/internal/list-styles.css.js.map +1 -1
  188. package/list/internal/list.d.ts +2 -2
  189. package/list/internal/list.js +1 -3
  190. package/list/internal/list.js.map +1 -1
  191. package/list/internal/listitem/_list-item.scss +87 -131
  192. package/list/internal/listitem/forced-colors-styles.css.js +1 -1
  193. package/list/internal/listitem/forced-colors-styles.css.js.map +1 -1
  194. package/list/internal/listitem/forced-colors-styles.scss +6 -6
  195. package/list/internal/listitem/list-item-styles.css.js +1 -1
  196. package/list/internal/listitem/list-item-styles.css.js.map +1 -1
  197. package/list/internal/listitem/list-item.d.ts +15 -3
  198. package/list/internal/listitem/list-item.js +43 -10
  199. package/list/internal/listitem/list-item.js.map +1 -1
  200. package/menu/internal/_menu.scss +6 -3
  201. package/menu/internal/menu-styles.css.js +1 -1
  202. package/menu/internal/menu-styles.css.js.map +1 -1
  203. package/menu/internal/menu.js +9 -10
  204. package/menu/internal/menu.js.map +1 -1
  205. package/menu/internal/menuitem/_menu-item.scss +8 -5
  206. package/menu/internal/menuitem/forced-colors-styles.css.js +1 -1
  207. package/menu/internal/menuitem/forced-colors-styles.css.js.map +1 -1
  208. package/menu/internal/menuitem/forced-colors-styles.scss +1 -1
  209. package/menu/internal/menuitem/menu-item-styles.css.js +1 -1
  210. package/menu/internal/menuitem/menu-item-styles.css.js.map +1 -1
  211. package/menu/internal/menuitem/menu-item.d.ts +9 -0
  212. package/menu/internal/menuitem/menu-item.js +18 -4
  213. package/menu/internal/menuitem/menu-item.js.map +1 -1
  214. package/menu/internal/shared.d.ts +45 -38
  215. package/menu/internal/shared.js +29 -40
  216. package/menu/internal/shared.js.map +1 -1
  217. package/menu/internal/submenuitem/sub-menu-item.d.ts +22 -12
  218. package/menu/internal/submenuitem/sub-menu-item.js +39 -24
  219. package/menu/internal/submenuitem/sub-menu-item.js.map +1 -1
  220. package/menu/menu-item.d.ts +1 -1
  221. package/menu/menu-item.js +0 -1
  222. package/menu/menu-item.js.map +1 -1
  223. package/menu/menu.d.ts +1 -1
  224. package/menu/menu.js +0 -1
  225. package/menu/menu.js.map +1 -1
  226. package/menu/sub-menu-item.d.ts +1 -1
  227. package/menu/sub-menu-item.js +0 -1
  228. package/menu/sub-menu-item.js.map +1 -1
  229. package/package.json +1 -3
  230. package/progress/harness.js +2 -4
  231. package/progress/harness.js.map +1 -1
  232. package/progress/internal/_circular-progress.scss +4 -4
  233. package/progress/internal/_linear-progress.scss +93 -132
  234. package/progress/internal/circular-progress-styles.css.js +1 -1
  235. package/progress/internal/circular-progress-styles.css.js.map +1 -1
  236. package/progress/internal/circular-progress.js +1 -1
  237. package/progress/internal/circular-progress.js.map +1 -1
  238. package/progress/internal/linear-progress-styles.css.js +1 -1
  239. package/progress/internal/linear-progress-styles.css.js.map +1 -1
  240. package/progress/internal/linear-progress.d.ts +0 -11
  241. package/progress/internal/linear-progress.js +4 -48
  242. package/progress/internal/linear-progress.js.map +1 -1
  243. package/progress/internal/progress.js +1 -3
  244. package/progress/internal/progress.js.map +1 -1
  245. package/radio/internal/_radio.scss +38 -24
  246. package/radio/internal/forced-colors-styles.css.js +1 -1
  247. package/radio/internal/forced-colors-styles.css.js.map +1 -1
  248. package/radio/internal/forced-colors-styles.scss +4 -4
  249. package/radio/internal/radio-styles.css.js +1 -1
  250. package/radio/internal/radio-styles.css.js.map +1 -1
  251. package/radio/internal/radio.d.ts +1 -1
  252. package/radio/internal/radio.js +7 -6
  253. package/radio/internal/radio.js.map +1 -1
  254. package/ripple/internal/_ripple.scss +1 -1
  255. package/ripple/internal/ripple-styles.css.js +1 -1
  256. package/ripple/internal/ripple-styles.css.js.map +1 -1
  257. package/select/internal/_filled-select.scss +2 -3
  258. package/select/internal/_outlined-select.scss +2 -3
  259. package/select/internal/_shared.scss +30 -1
  260. package/select/internal/filled-select-styles.css.js +1 -1
  261. package/select/internal/filled-select-styles.css.js.map +1 -1
  262. package/select/internal/outlined-select-styles.css.js +1 -1
  263. package/select/internal/outlined-select-styles.css.js.map +1 -1
  264. package/select/internal/select.d.ts +0 -5
  265. package/select/internal/select.js +11 -16
  266. package/select/internal/select.js.map +1 -1
  267. package/select/internal/selectoption/select-option.d.ts +5 -6
  268. package/select/internal/selectoption/select-option.js +8 -9
  269. package/select/internal/selectoption/select-option.js.map +1 -1
  270. package/select/internal/shared-styles.css.js +1 -1
  271. package/select/internal/shared-styles.css.js.map +1 -1
  272. package/select/internal/shared.d.ts +5 -9
  273. package/select/internal/shared.js +13 -11
  274. package/select/internal/shared.js.map +1 -1
  275. package/slider/internal/_slider.scss +33 -28
  276. package/slider/internal/forced-colors-styles.css.js +1 -1
  277. package/slider/internal/forced-colors-styles.css.js.map +1 -1
  278. package/slider/internal/slider-styles.css.js +1 -1
  279. package/slider/internal/slider-styles.css.js.map +1 -1
  280. package/slider/internal/slider.d.ts +22 -8
  281. package/slider/internal/slider.js +114 -25
  282. package/slider/internal/slider.js.map +1 -1
  283. package/switch/internal/_handle.scss +12 -12
  284. package/switch/internal/_icon.scss +8 -8
  285. package/switch/internal/_switch.scss +9 -1
  286. package/switch/internal/_track.scss +10 -10
  287. package/switch/internal/forced-colors-styles.css.js +1 -1
  288. package/switch/internal/forced-colors-styles.css.js.map +1 -1
  289. package/switch/internal/forced-colors-styles.scss +12 -12
  290. package/switch/internal/switch-styles.css.js +1 -1
  291. package/switch/internal/switch-styles.css.js.map +1 -1
  292. package/switch/internal/switch.d.ts +1 -1
  293. package/switch/internal/switch.js +3 -5
  294. package/switch/internal/switch.js.map +1 -1
  295. package/tabs/internal/_tab.scss +77 -21
  296. package/tabs/internal/_tabs.scss +1 -0
  297. package/tabs/internal/tab-styles.css.js +1 -1
  298. package/tabs/internal/tab-styles.css.js.map +1 -1
  299. package/tabs/internal/tab.d.ts +3 -9
  300. package/tabs/internal/tab.js +4 -8
  301. package/tabs/internal/tab.js.map +1 -1
  302. package/tabs/internal/tabs.d.ts +1 -4
  303. package/tabs/internal/tabs.js +5 -10
  304. package/tabs/internal/tabs.js.map +1 -1
  305. package/textfield/harness.js +4 -0
  306. package/textfield/harness.js.map +1 -1
  307. package/textfield/internal/filled-styles.css.js +1 -1
  308. package/textfield/internal/filled-styles.css.js.map +1 -1
  309. package/textfield/internal/outlined-styles.css.js +1 -1
  310. package/textfield/internal/outlined-styles.css.js.map +1 -1
  311. package/textfield/internal/text-field.d.ts +11 -10
  312. package/textfield/internal/text-field.js +60 -35
  313. package/textfield/internal/text-field.js.map +1 -1
  314. package/tokens/_index.scss +1 -0
  315. package/tokens/_md-comp-checkbox.scss +16 -16
  316. package/tokens/_md-comp-dialog.scss +2 -1
  317. package/tokens/_md-comp-elevated-button.scss +14 -12
  318. package/tokens/_md-comp-filled-button.scss +14 -12
  319. package/tokens/_md-comp-filled-field.scss +2 -2
  320. package/tokens/_md-comp-filled-icon-button.scss +23 -8
  321. package/tokens/_md-comp-filled-select.scss +22 -1
  322. package/tokens/_md-comp-filled-text-field.scss +3 -1
  323. package/tokens/_md-comp-filled-tonal-button.scss +14 -12
  324. package/tokens/_md-comp-filled-tonal-icon-button.scss +23 -8
  325. package/tokens/_md-comp-icon-button.scss +24 -11
  326. package/tokens/_md-comp-icon.scss +32 -0
  327. package/tokens/_md-comp-list-item.scss +117 -103
  328. package/tokens/_md-comp-menu-item.scss +3 -3
  329. package/tokens/_md-comp-outlined-button.scss +14 -12
  330. package/tokens/_md-comp-outlined-field.scss +2 -1
  331. package/tokens/_md-comp-outlined-icon-button.scss +26 -12
  332. package/tokens/_md-comp-outlined-segmented-button.scss +2 -2
  333. package/tokens/_md-comp-outlined-select.scss +8 -0
  334. package/tokens/_md-comp-outlined-text-field.scss +3 -1
  335. package/tokens/_md-comp-radio-button.scss +20 -9
  336. package/tokens/_md-comp-switch.scss +66 -32
  337. package/tokens/_md-comp-text-button.scss +14 -12
  338. package/button/internal/tonal-button.js.map +0 -1
  339. package/button/internal/tonal-styles.css.js +0 -9
  340. package/button/internal/tonal-styles.css.js.map +0 -1
  341. package/button/tonal-button.js.map +0 -1
  342. package/chips/internal/assist-forced-colors-styles.css.d.ts +0 -1
  343. package/chips/internal/assist-forced-colors-styles.css.js +0 -9
  344. package/chips/internal/assist-forced-colors-styles.css.js.map +0 -1
  345. package/chips/internal/assist-forced-colors-styles.scss +0 -27
  346. package/chips/internal/filter-forced-colors-styles.css.d.ts +0 -1
  347. package/chips/internal/filter-forced-colors-styles.css.js +0 -9
  348. package/chips/internal/filter-forced-colors-styles.css.js.map +0 -1
  349. package/chips/internal/filter-forced-colors-styles.scss +0 -34
  350. package/chips/internal/input-forced-colors-styles.css.d.ts +0 -1
  351. package/chips/internal/input-forced-colors-styles.css.js +0 -9
  352. package/chips/internal/input-forced-colors-styles.css.js.map +0 -1
  353. package/chips/internal/input-forced-colors-styles.scss +0 -39
  354. package/chips/internal/suggestion-forced-colors-styles.css.d.ts +0 -1
  355. package/chips/internal/suggestion-forced-colors-styles.css.js +0 -9
  356. package/chips/internal/suggestion-forced-colors-styles.css.js.map +0 -1
  357. package/chips/internal/suggestion-forced-colors-styles.scss +0 -27
  358. package/dialog/internal/_tokens.scss +0 -66
  359. package/icon/internal/_md-comp-icon.scss +0 -18
  360. package/iconbutton/standard-icon-button.js.map +0 -1
  361. package/internal/sass/_theme.scss +0 -249
  362. package/list/internal/listitemlink/list-item-link-only.d.ts +0 -23
  363. package/list/internal/listitemlink/list-item-link-only.js +0 -36
  364. package/list/internal/listitemlink/list-item-link-only.js.map +0 -1
  365. package/list/internal/listitemlink/list-item-link.d.ts +0 -18
  366. package/list/internal/listitemlink/list-item-link.js +0 -42
  367. package/list/internal/listitemlink/list-item-link.js.map +0 -1
  368. package/list/list-item-link.d.ts +0 -53
  369. package/list/list-item-link.js +0 -57
  370. package/list/list-item-link.js.map +0 -1
  371. package/menu/internal/menuitemlink/menu-item-link.d.ts +0 -23
  372. package/menu/internal/menuitemlink/menu-item-link.js +0 -49
  373. package/menu/internal/menuitemlink/menu-item-link.js.map +0 -1
  374. package/menu/menu-item-link.d.ts +0 -33
  375. package/menu/menu-item-link.js +0 -38
  376. package/menu/menu-item-link.js.map +0 -1
  377. /package/button/internal/{tonal-styles.css.d.ts → filled-tonal-styles.css.d.ts} +0 -0
@@ -1 +1 @@
1
- {"version":3,"file":"shared.js","sourceRoot":"","sources":["shared.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {ListItem} from '../../list/internal/listitem/list-item.js';\n\n/**\n * Interface specific to menu item and not list item.\n */\ninterface MenuItemSelf {\n /**\n * The visible headline text of the item.\n */\n headline: string;\n /**\n * Whether or not the item is the currently active item of interest (focuses\n * upon activation).\n */\n active: boolean;\n /**\n * Whether or not the item is in the selected visual state.\n */\n selected?: boolean;\n /**\n * If it is a sub-menu-item, a method that can close the submenu.\n */\n close?: () => void;\n /**\n * Focuses the item.\n */\n focus: () => void;\n}\n\n/**\n * The interface of every menu item interactive with a menu. All menu items\n * should implement this interface to be compatible with md-menu. Additionally\n * they should have both the `md-menu-item` and `md-list-item` attributes set.\n */\nexport type MenuItem = MenuItemSelf&ListItem;\n\n/**\n * The reason the `close-menu` event was dispatched.\n */\nexport interface Reason {\n kind: string;\n}\n\n/**\n * The click selection reason for the `close-menu` event. The menu was closed\n * because an item was selected via user click.\n */\nexport interface ClickReason extends Reason {\n kind: typeof CLOSE_REASON.CLICK_SELECTION;\n}\n\n/**\n * The keydown reason for the `close-menu` event. The menu was closed\n * because a specific key was pressed. The default closing keys for\n * `md-menu-item` are, Space, Enter or Escape.\n */\nexport interface KeydownReason extends Reason {\n kind: typeof CLOSE_REASON.KEYDOWN;\n key: string;\n}\n\n/**\n * The default menu closing reasons for the material md-menu package.\n */\nexport type DefaultReasons = ClickReason|KeydownReason;\n\n/**\n * The event that closes any parent menus. It is recommended to subclass and\n * dispatch this event rather than creating your own `close-menu` event.\n */\nexport class CloseMenuEvent<T extends Reason = DefaultReasons> extends Event {\n readonly itemPath: MenuItem[];\n constructor(public initiator: MenuItem, readonly reason: T) {\n super('close-menu', {bubbles: true, composed: true});\n this.itemPath = [initiator];\n }\n}\n\n/**\n * The event that signals to the menu that it should stay open on the focusout\n * event.\n */\nexport class StayOpenOnFocusoutEvent extends Event {\n constructor() {\n super('stay-open-on-focusout', {bubbles: true, composed: true});\n }\n}\n\n/**\n * The event that signals to the menu that it should close open on the focusout\n * event.\n */\nexport class CloseOnFocusoutEvent extends Event {\n constructor() {\n super('close-on-focusout', {bubbles: true, composed: true});\n }\n}\n\n/**\n * The default close menu event used by md-menu. To create your own `close-menu`\n * event, you should subclass the `CloseMenuEvent` instead.\n */\n// tslint:disable-next-line\nexport const DefaultCloseMenuEvent = CloseMenuEvent<DefaultReasons>;\n\n/**\n * The event that requests the parent md-menu to deactivate all other items.\n */\nexport class DeactivateItemsEvent extends Event {\n constructor() {\n super('deactivate-items', {bubbles: true, composed: true});\n }\n}\n\n/**\n * Requests the typeahead functionality of containing menu be deactivated.\n */\nexport class DeactivateTypeaheadEvent extends Event {\n constructor() {\n super('deactivate-typeahead', {bubbles: true, composed: true});\n }\n}\n\n/**\n * Requests the typeahead functionality of containing menu be activated.\n */\nexport class ActivateTypeaheadEvent extends Event {\n constructor() {\n super('activate-typeahead', {bubbles: true, composed: true});\n }\n}\n\n/**\n * Keys that are used to navigate menus.\n */\nexport const NAVIGABLE_KEY = {\n UP: 'ArrowUp',\n DOWN: 'ArrowDown',\n RIGHT: 'ArrowRight',\n LEFT: 'ArrowLeft',\n} as const;\n\n/**\n * Keys that are used for selection in menus.\n */\nexport const SELECTION_KEY = {\n SPACE: 'Space',\n ENTER: 'Enter',\n} as const;\n\n/**\n * Default close `Reason` kind values.\n */\nexport const CLOSE_REASON = {\n CLICK_SELECTION: 'CLICK_SELECTION',\n KEYDOWN: 'KEYDOWN',\n} as const;\n\n/**\n * Keys that can close menus.\n */\nexport const KEYDOWN_CLOSE_KEYS = {\n ESCAPE: 'Escape',\n SPACE: SELECTION_KEY.SPACE,\n ENTER: SELECTION_KEY.ENTER,\n} as const;\n\ntype Values<T> = T[keyof T];\n\n/**\n * Determines whether the given key code is a key code that should close the\n * menu.\n *\n * @param code The KeyboardEvent code to check.\n * @return Whether or not the key code is in the predetermined list to close the\n * menu.\n */\nexport function isClosableKey(code: string):\n code is Values<typeof KEYDOWN_CLOSE_KEYS> {\n return Object.values(KEYDOWN_CLOSE_KEYS).some(value => (value === code));\n}\n\n/**\n * Determines whether the given key code is a key code that should select a menu\n * item.\n *\n * @param code They KeyboardEvent code to check.\n * @return Whether or not the key code is in the predetermined list to select a\n * menu item.\n */\nexport function isSelectableKey(code: string):\n code is Values<typeof SELECTION_KEY> {\n return Object.values(SELECTION_KEY).some(value => (value === code));\n}\n\n/**\n * Determines whether a target element is contained inside another element's\n * composed tree.\n *\n * @param target The potential contained element.\n * @param container The potential containing element of the target.\n * @returns Whether the target element is contained inside the container's\n * composed subtree\n */\nexport function isElementInSubtree(\n target: EventTarget, container: EventTarget) {\n // Dispatch a composed, bubbling event to check its path to see if the\n // newly-focused element is contained in container's subtree\n const focusEv = new Event('md-contains', {bubbles: true, composed: true});\n let composedPath: EventTarget[] = [];\n const listener = (ev: Event) => {\n composedPath = ev.composedPath();\n };\n\n container.addEventListener('md-contains', listener);\n target.dispatchEvent(focusEv);\n container.removeEventListener('md-contains', listener);\n\n const isContained = composedPath.length > 0;\n return isContained;\n}\n"]}
1
+ {"version":3,"file":"shared.js","sourceRoot":"","sources":["shared.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {ListItem} from '../../list/internal/listitem/list-item.js';\n\n/**\n * Interface specific to menu item and not list item.\n */\ninterface MenuItemSelf {\n /**\n * The visible headline text of the item.\n */\n headline: string;\n /**\n * Whether or not the item is the currently active item of interest (focuses\n * upon activation).\n */\n active: boolean;\n /**\n * Whether or not the item is in the selected visual state.\n */\n selected?: boolean;\n /**\n * If it is a sub-menu-item, a method that can close the submenu.\n */\n close?: () => void;\n /**\n * Focuses the item.\n */\n focus: () => void;\n}\n\n/**\n * The interface of every menu item interactive with a menu. All menu items\n * should implement this interface to be compatible with md-menu. Additionally\n * they should have both the `md-menu-item` and `md-list-item` attributes set.\n */\nexport type MenuItem = MenuItemSelf&ListItem;\n\n/**\n * The reason the `close-menu` event was dispatched.\n */\nexport interface Reason {\n kind: string;\n}\n\n/**\n * The click selection reason for the `close-menu` event. The menu was closed\n * because an item was selected via user click.\n */\nexport interface ClickReason extends Reason {\n kind: typeof CLOSE_REASON.CLICK_SELECTION;\n}\n\n/**\n * The keydown reason for the `close-menu` event. The menu was closed\n * because a specific key was pressed. The default closing keys for\n * `md-menu-item` are, Space, Enter or Escape.\n */\nexport interface KeydownReason extends Reason {\n kind: typeof CLOSE_REASON.KEYDOWN;\n key: string;\n}\n\n/**\n * The default menu closing reasons for the material md-menu package.\n */\nexport type DefaultReasons = ClickReason|KeydownReason;\n\n/**\n * Creates an event that closes any parent menus.\n */\nexport function createCloseMenuEvent<T extends Reason = DefaultReasons>(\n initiator: MenuItem, reason: T) {\n return new CustomEvent<\n {initiator: MenuItem, itemPath: MenuItem[], reason: T}>('close-menu', {\n bubbles: true,\n composed: true,\n detail: {initiator, reason, itemPath: [initiator]}\n });\n}\n\n/**\n * Creates an event that signals to the menu that it should stay open on the\n * focusout event.\n */\nexport function createStayOpenOnFocusoutEvent() {\n return new Event('stay-open-on-focusout', {bubbles: true, composed: true});\n}\n\n/**\n * Creates an event that signals to the menu that it should close open on the\n * focusout event.\n */\nexport function createCloseOnFocusoutEvent() {\n return new Event('close-on-focusout', {bubbles: true, composed: true});\n}\n\n/**\n * Creates a default close menu event used by md-menu.\n */\nexport const createDefaultCloseMenuEvent = createCloseMenuEvent<DefaultReasons>;\n\n/**\n * The type of the default close menu event used by md-menu.\n */\n// tslint:disable-next-line\nexport type CloseMenuEvent<T extends Reason = DefaultReasons> =\n ReturnType<typeof createCloseMenuEvent<T>>;\n\n/**\n * Creates an event that requests the parent md-menu to deactivate all other\n * items.\n */\nexport function createDeactivateItemsEvent() {\n return new Event('deactivate-items', {bubbles: true, composed: true});\n}\n\n/**\n * The type of the event that requests the parent md-menu to deactivate all\n * other items.\n */\nexport type DeactivateItemsEvent =\n ReturnType<typeof createDeactivateItemsEvent>;\n\n\n/**\n * Creates an event that requests the typeahead functionality of containing menu\n * be deactivated.\n */\nexport function createDeactivateTypeaheadEvent() {\n return new Event('deactivate-typeahead', {bubbles: true, composed: true});\n}\n\n/**\n * The type of the event that requests the typeahead functionality of containing\n * menu be deactivated.\n */\nexport type DeactivateTypeaheadEvent =\n ReturnType<typeof createDeactivateTypeaheadEvent>;\n\n/**\n * Creates an event that requests the typeahead functionality of containing menu\n * be activated.\n */\nexport function createActivateTypeaheadEvent() {\n return new Event('activate-typeahead', {bubbles: true, composed: true});\n}\n\n/**\n * The type of the event that requests the typeahead functionality of containing\n * menu be activated.\n */\nexport type ActivateTypeaheadEvent =\n ReturnType<typeof createActivateTypeaheadEvent>;\n\n/**\n * Keys that are used to navigate menus.\n */\nexport const NAVIGABLE_KEY = {\n UP: 'ArrowUp',\n DOWN: 'ArrowDown',\n RIGHT: 'ArrowRight',\n LEFT: 'ArrowLeft',\n} as const;\n\n/**\n * Keys that are used for selection in menus.\n */\nexport const SELECTION_KEY = {\n SPACE: 'Space',\n ENTER: 'Enter',\n} as const;\n\n/**\n * Default close `Reason` kind values.\n */\nexport const CLOSE_REASON = {\n CLICK_SELECTION: 'CLICK_SELECTION',\n KEYDOWN: 'KEYDOWN',\n} as const;\n\n/**\n * Keys that can close menus.\n */\nexport const KEYDOWN_CLOSE_KEYS = {\n ESCAPE: 'Escape',\n SPACE: SELECTION_KEY.SPACE,\n ENTER: SELECTION_KEY.ENTER,\n} as const;\n\ntype Values<T> = T[keyof T];\n\n/**\n * Determines whether the given key code is a key code that should close the\n * menu.\n *\n * @param code The KeyboardEvent code to check.\n * @return Whether or not the key code is in the predetermined list to close the\n * menu.\n */\nexport function isClosableKey(code: string):\n code is Values<typeof KEYDOWN_CLOSE_KEYS> {\n return Object.values(KEYDOWN_CLOSE_KEYS).some(value => (value === code));\n}\n\n/**\n * Determines whether the given key code is a key code that should select a menu\n * item.\n *\n * @param code They KeyboardEvent code to check.\n * @return Whether or not the key code is in the predetermined list to select a\n * menu item.\n */\nexport function isSelectableKey(code: string):\n code is Values<typeof SELECTION_KEY> {\n return Object.values(SELECTION_KEY).some(value => (value === code));\n}\n\n/**\n * Determines whether a target element is contained inside another element's\n * composed tree.\n *\n * @param target The potential contained element.\n * @param container The potential containing element of the target.\n * @returns Whether the target element is contained inside the container's\n * composed subtree\n */\nexport function isElementInSubtree(\n target: EventTarget, container: EventTarget) {\n // Dispatch a composed, bubbling event to check its path to see if the\n // newly-focused element is contained in container's subtree\n const focusEv = new Event('md-contains', {bubbles: true, composed: true});\n let composedPath: EventTarget[] = [];\n const listener = (ev: Event) => {\n composedPath = ev.composedPath();\n };\n\n container.addEventListener('md-contains', listener);\n target.dispatchEvent(focusEv);\n container.removeEventListener('md-contains', listener);\n\n const isContained = composedPath.length > 0;\n return isContained;\n}\n"]}
@@ -6,18 +6,17 @@
6
6
  import { Corner } from '../menu.js';
7
7
  import { MenuItemEl } from '../menuitem/menu-item.js';
8
8
  /**
9
- * @fires deactivate-items {DeactivateItemsEvent} Requests the parent menu to
10
- * deselect other items when a submenu opens
11
- * @fires deactivate-typeahead {DeactivateItemsEvent} Requests the parent menu
12
- * to deactivate the typeahead functionality when a submenu opens
13
- * @fires activate-typeahead {DeactivateItemsEvent} Requests the parent menu to
14
- * activate the typeahead functionality when a submenu closes
15
- * @fires stay-open-on-focusout {StayOpenOnFocusoutEvent} Requests the parent
16
- * menu to stay open when focusout event is fired or has a `null`
17
- * `relatedTarget` when submenu is opened.
18
- * @fires close-on-focusout {CloseOnFocusoutEvent} Requests the parent
19
- * menu to close when focusout event is fired or has a `null`
20
- * `relatedTarget` When submenu is closed.
9
+ * @fires deactivate-items Requests the parent menu to deselect other items when
10
+ * a submenu opens
11
+ * @fires deactivate-typeahead Requests the parent menu to deactivate the
12
+ * typeahead functionality when a submenu opens
13
+ * @fires activate-typeahead Requests the parent menu to activate the typeahead
14
+ * functionality when a submenu closes
15
+ * @fires stay-open-on-focusout Requests the parent menu to stay open when
16
+ * focusout event is fired or has a `null` `relatedTarget` when submenu is
17
+ * opened.
18
+ * @fires close-on-focusout Requests the parent menu to close when focusout
19
+ * event is fired or has a `null` `relatedTarget` When submenu is closed.
21
20
  */
22
21
  export declare class SubMenuItem extends MenuItemEl {
23
22
  /**
@@ -40,6 +39,7 @@ export declare class SubMenuItem extends MenuItemEl {
40
39
  * Sets the item in the selected visual state when a submenu is opened.
41
40
  */
42
41
  selected: boolean;
42
+ protected submenuHover: boolean;
43
43
  private readonly menus;
44
44
  protected keepOpenOnClick: boolean;
45
45
  private previousOpenTimeout;
@@ -54,6 +54,14 @@ export declare class SubMenuItem extends MenuItemEl {
54
54
  */
55
55
  protected onPointerleave: () => void;
56
56
  protected onClick(): void;
57
+ protected getRenderClasses(): {
58
+ 'submenu-hover': boolean;
59
+ 'has-focus-ring': boolean;
60
+ 'with-one-line': boolean;
61
+ 'with-two-line': boolean;
62
+ 'with-three-line': boolean;
63
+ disabled: boolean;
64
+ };
57
65
  /**
58
66
  * On item keydown handles opening the submenu.
59
67
  */
@@ -96,4 +104,6 @@ export declare class SubMenuItem extends MenuItemEl {
96
104
  * @return Whether or not the key code should close the submenu.
97
105
  */
98
106
  private isSubmenuCloseKey;
107
+ private onSubmenuPointerEnter;
108
+ private onSubmenuPointerLeave;
99
109
  }
@@ -5,26 +5,25 @@
5
5
  */
6
6
  import { __decorate } from "tslib";
7
7
  import { html } from 'lit';
8
- import { property, queryAssignedElements } from 'lit/decorators.js';
8
+ import { property, queryAssignedElements, state } from 'lit/decorators.js';
9
9
  import { List } from '../../../list/internal/list.js';
10
10
  import { MenuItemEl } from '../menuitem/menu-item.js';
11
- import { ActivateTypeaheadEvent, CLOSE_REASON, CloseOnFocusoutEvent, DeactivateItemsEvent, DeactivateTypeaheadEvent, KEYDOWN_CLOSE_KEYS, NAVIGABLE_KEY, SELECTION_KEY, StayOpenOnFocusoutEvent } from '../shared.js';
11
+ import { CLOSE_REASON, createActivateTypeaheadEvent, createCloseOnFocusoutEvent, createDeactivateItemsEvent, createDeactivateTypeaheadEvent, createStayOpenOnFocusoutEvent, KEYDOWN_CLOSE_KEYS, NAVIGABLE_KEY, SELECTION_KEY } from '../shared.js';
12
12
  function stopPropagation(event) {
13
13
  event.stopPropagation();
14
14
  }
15
15
  /**
16
- * @fires deactivate-items {DeactivateItemsEvent} Requests the parent menu to
17
- * deselect other items when a submenu opens
18
- * @fires deactivate-typeahead {DeactivateItemsEvent} Requests the parent menu
19
- * to deactivate the typeahead functionality when a submenu opens
20
- * @fires activate-typeahead {DeactivateItemsEvent} Requests the parent menu to
21
- * activate the typeahead functionality when a submenu closes
22
- * @fires stay-open-on-focusout {StayOpenOnFocusoutEvent} Requests the parent
23
- * menu to stay open when focusout event is fired or has a `null`
24
- * `relatedTarget` when submenu is opened.
25
- * @fires close-on-focusout {CloseOnFocusoutEvent} Requests the parent
26
- * menu to close when focusout event is fired or has a `null`
27
- * `relatedTarget` When submenu is closed.
16
+ * @fires deactivate-items Requests the parent menu to deselect other items when
17
+ * a submenu opens
18
+ * @fires deactivate-typeahead Requests the parent menu to deactivate the
19
+ * typeahead functionality when a submenu opens
20
+ * @fires activate-typeahead Requests the parent menu to activate the typeahead
21
+ * functionality when a submenu closes
22
+ * @fires stay-open-on-focusout Requests the parent menu to stay open when
23
+ * focusout event is fired or has a `null` `relatedTarget` when submenu is
24
+ * opened.
25
+ * @fires close-on-focusout Requests the parent menu to close when focusout
26
+ * event is fired or has a `null` `relatedTarget` When submenu is closed.
28
27
  */
29
28
  export class SubMenuItem extends MenuItemEl {
30
29
  constructor() {
@@ -49,6 +48,7 @@ export class SubMenuItem extends MenuItemEl {
49
48
  * Sets the item in the selected visual state when a submenu is opened.
50
49
  */
51
50
  this.selected = false;
51
+ this.submenuHover = false;
52
52
  this.keepOpenOnClick = true;
53
53
  this.previousOpenTimeout = 0;
54
54
  this.previousCloseTimeout = 0;
@@ -95,6 +95,9 @@ export class SubMenuItem extends MenuItemEl {
95
95
  onClick() {
96
96
  this.show();
97
97
  }
98
+ getRenderClasses() {
99
+ return { ...super.getRenderClasses(), 'submenu-hover': this.submenuHover };
100
+ }
98
101
  /**
99
102
  * On item keydown handles opening the submenu.
100
103
  */
@@ -132,6 +135,8 @@ export class SubMenuItem extends MenuItemEl {
132
135
  renderSubMenu() {
133
136
  return html `<span class="submenu"><slot
134
137
  name="submenu"
138
+ @pointerenter=${this.onSubmenuPointerEnter}
139
+ @pointerleave=${this.onSubmenuPointerLeave}
135
140
  @pointerdown=${stopPropagation}
136
141
  @click=${stopPropagation}
137
142
  @keydown=${this.onSubMenuKeydown}
@@ -139,14 +144,15 @@ export class SubMenuItem extends MenuItemEl {
139
144
  ></slot></span>`;
140
145
  }
141
146
  onCloseSubmenu(event) {
142
- event.itemPath.push(this);
147
+ const { itemPath, reason } = event.detail;
148
+ itemPath.push(this);
143
149
  // Restore focusout behavior
144
- this.dispatchEvent(new CloseOnFocusoutEvent());
145
- this.dispatchEvent(new ActivateTypeaheadEvent());
150
+ this.dispatchEvent(createCloseOnFocusoutEvent());
151
+ this.dispatchEvent(createActivateTypeaheadEvent());
146
152
  // Escape should only close one menu not all of the menus unlike space or
147
153
  // click selection which should close all menus.
148
- if (event.reason.kind === CLOSE_REASON.KEYDOWN &&
149
- event.reason.key === KEYDOWN_CLOSE_KEYS.ESCAPE) {
154
+ if (reason.kind === CLOSE_REASON.KEYDOWN &&
155
+ reason.key === KEYDOWN_CLOSE_KEYS.ESCAPE) {
150
156
  event.stopPropagation();
151
157
  this.active = true;
152
158
  this.selected = false;
@@ -200,12 +206,12 @@ export class SubMenuItem extends MenuItemEl {
200
206
  // has a submenuitem hovered which opens a third submenut. Then if you hover
201
207
  // on yet another middle menu-item (not submenuitem) then focusout Event's
202
208
  // relatedTarget will be `null` thus, causing all the menus to close
203
- this.dispatchEvent(new StayOpenOnFocusoutEvent());
209
+ this.dispatchEvent(createStayOpenOnFocusoutEvent());
204
210
  menu.show();
205
211
  // Deactivate other items. This can be the case if the user has tabbed
206
212
  // around the menu and then mouses over an md-sub-menu.
207
- this.dispatchEvent(new DeactivateItemsEvent());
208
- this.dispatchEvent(new DeactivateTypeaheadEvent());
213
+ this.dispatchEvent(createDeactivateItemsEvent());
214
+ this.dispatchEvent(createDeactivateTypeaheadEvent());
209
215
  this.selected = true;
210
216
  // This is the case of mouse hovering when already opened via keyboard or
211
217
  // vice versa
@@ -225,11 +231,11 @@ export class SubMenuItem extends MenuItemEl {
225
231
  const menu = this.submenuEl;
226
232
  if (!menu || !menu.open)
227
233
  return;
228
- this.dispatchEvent(new ActivateTypeaheadEvent());
234
+ this.dispatchEvent(createActivateTypeaheadEvent());
229
235
  menu.quick = true;
230
236
  menu.close();
231
237
  // Restore focusout behavior.
232
- this.dispatchEvent(new CloseOnFocusoutEvent());
238
+ this.dispatchEvent(createCloseOnFocusoutEvent());
233
239
  this.active = false;
234
240
  this.selected = false;
235
241
  menu.addEventListener('closed', onClosed, { once: true });
@@ -271,6 +277,12 @@ export class SubMenuItem extends MenuItemEl {
271
277
  return false;
272
278
  }
273
279
  }
280
+ onSubmenuPointerEnter() {
281
+ this.submenuHover = true;
282
+ }
283
+ onSubmenuPointerLeave() {
284
+ this.submenuHover = false;
285
+ }
274
286
  }
275
287
  __decorate([
276
288
  property({ attribute: 'anchor-corner' })
@@ -287,6 +299,9 @@ __decorate([
287
299
  __decorate([
288
300
  property({ type: Boolean, reflect: true })
289
301
  ], SubMenuItem.prototype, "selected", void 0);
302
+ __decorate([
303
+ state()
304
+ ], SubMenuItem.prototype, "submenuHover", void 0);
290
305
  __decorate([
291
306
  queryAssignedElements({ slot: 'submenu', flatten: true })
292
307
  ], SubMenuItem.prototype, "menus", void 0);
@@ -1 +1 @@
1
- {"version":3,"file":"sub-menu-item.js","sourceRoot":"","sources":["sub-menu-item.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {html} from 'lit';\nimport {property, queryAssignedElements} from 'lit/decorators.js';\n\nimport {List} from '../../../list/internal/list.js';\nimport {Corner, Menu} from '../menu.js';\nimport {MenuItemEl} from '../menuitem/menu-item.js';\nimport {ActivateTypeaheadEvent, CLOSE_REASON, CloseMenuEvent, CloseOnFocusoutEvent, DeactivateItemsEvent, DeactivateTypeaheadEvent, KEYDOWN_CLOSE_KEYS, NAVIGABLE_KEY, SELECTION_KEY, StayOpenOnFocusoutEvent} from '../shared.js';\n\nfunction stopPropagation(event: Event) {\n event.stopPropagation();\n}\n\n/**\n * @fires deactivate-items {DeactivateItemsEvent} Requests the parent menu to\n * deselect other items when a submenu opens\n * @fires deactivate-typeahead {DeactivateItemsEvent} Requests the parent menu\n * to deactivate the typeahead functionality when a submenu opens\n * @fires activate-typeahead {DeactivateItemsEvent} Requests the parent menu to\n * activate the typeahead functionality when a submenu closes\n * @fires stay-open-on-focusout {StayOpenOnFocusoutEvent} Requests the parent\n * menu to stay open when focusout event is fired or has a `null`\n * `relatedTarget` when submenu is opened.\n * @fires close-on-focusout {CloseOnFocusoutEvent} Requests the parent\n * menu to close when focusout event is fired or has a `null`\n * `relatedTarget` When submenu is closed.\n */\nexport class SubMenuItem extends MenuItemEl {\n /**\n * The anchorCorner to set on the submenu.\n */\n @property({attribute: 'anchor-corner'}) anchorCorner: Corner = 'START_END';\n /**\n * The menuCorner to set on the submenu.\n */\n @property({attribute: 'menu-corner'}) menuCorner: Corner = 'START_START';\n /**\n * The delay between pointerenter and submenu opening.\n */\n @property({type: Number, attribute: 'hover-open-delay'}) hoverOpenDelay = 400;\n /**\n * The delay between ponterleave and the submenu closing.\n */\n @property({type: Number, attribute: 'hover-close-delay'})\n hoverCloseDelay = 400;\n /**\n * Sets the item in the selected visual state when a submenu is opened.\n */\n @property({type: Boolean, reflect: true}) selected = false;\n\n @queryAssignedElements({slot: 'submenu', flatten: true})\n private readonly menus!: Menu[];\n\n protected override keepOpenOnClick = true;\n private previousOpenTimeout = 0;\n private previousCloseTimeout = 0;\n\n private get submenuEl(): Menu|undefined {\n return this.menus[0];\n }\n\n /**\n * Starts the default 400ms countdown to open the submenu.\n */\n protected override onPointerenter = () => {\n clearTimeout(this.previousOpenTimeout);\n clearTimeout(this.previousCloseTimeout);\n if (this.submenuEl?.open) return;\n\n // Open synchronously if delay is 0. (screenshot tests infra\n // would never resolve otherwise)\n if (!this.hoverOpenDelay) {\n this.show();\n } else {\n this.previousOpenTimeout = setTimeout(() => {\n this.show();\n }, this.hoverOpenDelay);\n }\n };\n\n /**\n * Starts the default 400ms countdown to close the submenu.\n */\n protected override onPointerleave = () => {\n clearTimeout(this.previousCloseTimeout);\n clearTimeout(this.previousOpenTimeout);\n\n // Close synchronously if delay is 0. (screenshot tests infra\n // would never resolve otherwise)\n if (!this.hoverCloseDelay) {\n this.close();\n } else {\n this.previousCloseTimeout = setTimeout(() => {\n this.close();\n }, this.hoverCloseDelay);\n }\n };\n\n protected override onClick() {\n this.show();\n }\n\n /**\n * On item keydown handles opening the submenu.\n */\n protected override onKeydown(event: KeyboardEvent) {\n const shouldOpenSubmenu = this.isSubmenuOpenKey(event.code);\n\n if (event.code === SELECTION_KEY.SPACE) {\n // prevent space from scrolling. Only open the submenu.\n event.preventDefault();\n }\n\n if (!shouldOpenSubmenu) {\n super.onKeydown(event);\n return;\n }\n\n const submenu = this.submenuEl;\n if (!submenu) return;\n\n const submenuItems = submenu.items;\n const firstActivatableItem = List.getFirstActivatableItem(submenuItems);\n\n if (firstActivatableItem) {\n this.show(() => {\n firstActivatableItem.active = true;\n });\n\n return;\n }\n }\n\n /**\n * Render the submenu at the end\n */\n protected override renderEnd() {\n return html`${super.renderEnd()}${this.renderSubMenu()}`;\n }\n\n /**\n * Renders the slot for the submenu.\n */\n private renderSubMenu() {\n return html`<span class=\"submenu\"><slot\n name=\"submenu\"\n @pointerdown=${stopPropagation}\n @click=${stopPropagation}\n @keydown=${this.onSubMenuKeydown}\n @close-menu=${this.onCloseSubmenu}\n ></slot></span>`;\n }\n\n private onCloseSubmenu(event: CloseMenuEvent) {\n event.itemPath.push(this);\n // Restore focusout behavior\n this.dispatchEvent(new CloseOnFocusoutEvent());\n this.dispatchEvent(new ActivateTypeaheadEvent());\n // Escape should only close one menu not all of the menus unlike space or\n // click selection which should close all menus.\n if (event.reason.kind === CLOSE_REASON.KEYDOWN &&\n event.reason.key === KEYDOWN_CLOSE_KEYS.ESCAPE) {\n event.stopPropagation();\n this.active = true;\n this.selected = false;\n // It might already be active so manually focus\n this.listItemRoot?.focus();\n return;\n }\n\n this.active = false;\n this.selected = false;\n }\n\n private async onSubMenuKeydown(event: KeyboardEvent) {\n // Stop propagation so that we don't accidentally close every parent menu.\n // Additionally, we want to isolate things like the typeahead keydowns\n // from bubbling up to the parent menu and confounding things.\n event.stopPropagation();\n const shouldClose = this.isSubmenuCloseKey(event.code);\n\n if (!shouldClose) return;\n\n this.close(() => {\n List.deactivateActiveItem(this.submenuEl!.items);\n this.listItemRoot?.focus();\n this.active = true;\n });\n }\n\n /**\n * Shows the submenu.\n *\n * @param onOpened A function to call after the menu is opened.\n */\n show(onOpened = () => {}) {\n const menu = this.submenuEl;\n if (!menu) return;\n\n menu.quick = true;\n // Submenus are in overflow when not fixed. Can remove once we have native\n // popup support\n menu.hasOverflow = true;\n menu.anchorCorner = this.anchorCorner;\n menu.menuCorner = this.menuCorner;\n menu.anchor = this;\n // We manually set focus with `active` on keyboard navigation. And we\n // want to focus the root on hover, so the user can pick up navigation with\n // keyboard after hover.\n menu.defaultFocus = 'LIST_ROOT';\n menu.skipRestoreFocus = true;\n menu.stayOpenOnOutsideClick = true;\n menu.stayOpenOnFocusout = true;\n\n // Menu could already be opened because of mouse interaction\n const menuAlreadyOpen = menu.open;\n // We want the parent to stay open in the case such that a middle submenu\n // has a submenuitem hovered which opens a third submenut. Then if you hover\n // on yet another middle menu-item (not submenuitem) then focusout Event's\n // relatedTarget will be `null` thus, causing all the menus to close\n this.dispatchEvent(new StayOpenOnFocusoutEvent());\n menu.show();\n\n // Deactivate other items. This can be the case if the user has tabbed\n // around the menu and then mouses over an md-sub-menu.\n this.dispatchEvent(new DeactivateItemsEvent());\n this.dispatchEvent(new DeactivateTypeaheadEvent());\n this.selected = true;\n\n // This is the case of mouse hovering when already opened via keyboard or\n // vice versa\n if (menuAlreadyOpen) {\n onOpened();\n } else {\n menu.addEventListener('opened', onOpened, {once: true});\n }\n }\n\n /**\n * Closes the submenu.\n *\n * @param onClosed A function to call after the menu is closed.\n */\n close(onClosed = () => {}) {\n const menu = this.submenuEl;\n if (!menu || !menu.open) return;\n\n this.dispatchEvent(new ActivateTypeaheadEvent());\n menu.quick = true;\n menu.close();\n // Restore focusout behavior.\n this.dispatchEvent(new CloseOnFocusoutEvent());\n this.active = false;\n this.selected = false;\n menu.addEventListener('closed', onClosed, {once: true});\n }\n\n /**\n * Determines whether the given KeyboardEvent code is one that should open\n * the submenu. This is RTL-aware. By default, left, right, space, or enter.\n *\n * @param code The native KeyboardEvent code.\n * @return Whether or not the key code should open the submenu.\n */\n private isSubmenuOpenKey(code: string) {\n const isRtl = getComputedStyle(this).direction === 'rtl';\n const arrowEnterKey = isRtl ? NAVIGABLE_KEY.LEFT : NAVIGABLE_KEY.RIGHT;\n switch (code) {\n case arrowEnterKey:\n case SELECTION_KEY.SPACE:\n case SELECTION_KEY.ENTER:\n return true;\n default:\n return false;\n }\n }\n\n /**\n * Determines whether the given KeyboardEvent code is one that should close\n * the submenu. This is RTL-aware. By default right, left, or escape.\n *\n * @param code The native KeyboardEvent code.\n * @return Whether or not the key code should close the submenu.\n */\n private isSubmenuCloseKey(code: string) {\n const isRtl = getComputedStyle(this).direction === 'rtl';\n const arrowEnterKey = isRtl ? NAVIGABLE_KEY.RIGHT : NAVIGABLE_KEY.LEFT;\n switch (code) {\n case arrowEnterKey:\n case KEYDOWN_CLOSE_KEYS.ESCAPE:\n return true;\n default:\n return false;\n }\n }\n}\n"]}
1
+ {"version":3,"file":"sub-menu-item.js","sourceRoot":"","sources":["sub-menu-item.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {html} from 'lit';\nimport {property, queryAssignedElements, state} from 'lit/decorators.js';\n\nimport {List} from '../../../list/internal/list.js';\nimport {Corner, Menu} from '../menu.js';\nimport {MenuItemEl} from '../menuitem/menu-item.js';\nimport {CLOSE_REASON, CloseMenuEvent, createActivateTypeaheadEvent, createCloseOnFocusoutEvent, createDeactivateItemsEvent, createDeactivateTypeaheadEvent, createStayOpenOnFocusoutEvent, KEYDOWN_CLOSE_KEYS, NAVIGABLE_KEY, SELECTION_KEY} from '../shared.js';\n\nfunction stopPropagation(event: Event) {\n event.stopPropagation();\n}\n\n/**\n * @fires deactivate-items Requests the parent menu to deselect other items when\n * a submenu opens\n * @fires deactivate-typeahead Requests the parent menu to deactivate the\n * typeahead functionality when a submenu opens\n * @fires activate-typeahead Requests the parent menu to activate the typeahead\n * functionality when a submenu closes\n * @fires stay-open-on-focusout Requests the parent menu to stay open when\n * focusout event is fired or has a `null` `relatedTarget` when submenu is\n * opened.\n * @fires close-on-focusout Requests the parent menu to close when focusout\n * event is fired or has a `null` `relatedTarget` When submenu is closed.\n */\nexport class SubMenuItem extends MenuItemEl {\n /**\n * The anchorCorner to set on the submenu.\n */\n @property({attribute: 'anchor-corner'}) anchorCorner: Corner = 'START_END';\n /**\n * The menuCorner to set on the submenu.\n */\n @property({attribute: 'menu-corner'}) menuCorner: Corner = 'START_START';\n /**\n * The delay between pointerenter and submenu opening.\n */\n @property({type: Number, attribute: 'hover-open-delay'}) hoverOpenDelay = 400;\n /**\n * The delay between ponterleave and the submenu closing.\n */\n @property({type: Number, attribute: 'hover-close-delay'})\n hoverCloseDelay = 400;\n /**\n * Sets the item in the selected visual state when a submenu is opened.\n */\n @property({type: Boolean, reflect: true}) selected = false;\n\n @state() protected submenuHover = false;\n\n @queryAssignedElements({slot: 'submenu', flatten: true})\n private readonly menus!: Menu[];\n\n protected override keepOpenOnClick = true;\n private previousOpenTimeout = 0;\n private previousCloseTimeout = 0;\n\n private get submenuEl(): Menu|undefined {\n return this.menus[0];\n }\n\n /**\n * Starts the default 400ms countdown to open the submenu.\n */\n protected override onPointerenter = () => {\n clearTimeout(this.previousOpenTimeout);\n clearTimeout(this.previousCloseTimeout);\n if (this.submenuEl?.open) return;\n\n // Open synchronously if delay is 0. (screenshot tests infra\n // would never resolve otherwise)\n if (!this.hoverOpenDelay) {\n this.show();\n } else {\n this.previousOpenTimeout = setTimeout(() => {\n this.show();\n }, this.hoverOpenDelay);\n }\n };\n\n /**\n * Starts the default 400ms countdown to close the submenu.\n */\n protected override onPointerleave = () => {\n clearTimeout(this.previousCloseTimeout);\n clearTimeout(this.previousOpenTimeout);\n\n // Close synchronously if delay is 0. (screenshot tests infra\n // would never resolve otherwise)\n if (!this.hoverCloseDelay) {\n this.close();\n } else {\n this.previousCloseTimeout = setTimeout(() => {\n this.close();\n }, this.hoverCloseDelay);\n }\n };\n\n protected override onClick() {\n this.show();\n }\n\n protected override getRenderClasses() {\n return {...super.getRenderClasses(), 'submenu-hover': this.submenuHover};\n }\n\n /**\n * On item keydown handles opening the submenu.\n */\n protected override onKeydown(event: KeyboardEvent) {\n const shouldOpenSubmenu = this.isSubmenuOpenKey(event.code);\n\n if (event.code === SELECTION_KEY.SPACE) {\n // prevent space from scrolling. Only open the submenu.\n event.preventDefault();\n }\n\n if (!shouldOpenSubmenu) {\n super.onKeydown(event);\n return;\n }\n\n const submenu = this.submenuEl;\n if (!submenu) return;\n\n const submenuItems = submenu.items;\n const firstActivatableItem = List.getFirstActivatableItem(submenuItems);\n\n if (firstActivatableItem) {\n this.show(() => {\n firstActivatableItem.active = true;\n });\n\n return;\n }\n }\n\n /**\n * Render the submenu at the end\n */\n protected override renderEnd() {\n return html`${super.renderEnd()}${this.renderSubMenu()}`;\n }\n\n /**\n * Renders the slot for the submenu.\n */\n private renderSubMenu() {\n return html`<span class=\"submenu\"><slot\n name=\"submenu\"\n @pointerenter=${this.onSubmenuPointerEnter}\n @pointerleave=${this.onSubmenuPointerLeave}\n @pointerdown=${stopPropagation}\n @click=${stopPropagation}\n @keydown=${this.onSubMenuKeydown}\n @close-menu=${this.onCloseSubmenu}\n ></slot></span>`;\n }\n\n private onCloseSubmenu(event: CloseMenuEvent) {\n const {itemPath, reason} = event.detail;\n itemPath.push(this);\n // Restore focusout behavior\n this.dispatchEvent(createCloseOnFocusoutEvent());\n this.dispatchEvent(createActivateTypeaheadEvent());\n // Escape should only close one menu not all of the menus unlike space or\n // click selection which should close all menus.\n if (reason.kind === CLOSE_REASON.KEYDOWN &&\n reason.key === KEYDOWN_CLOSE_KEYS.ESCAPE) {\n event.stopPropagation();\n this.active = true;\n this.selected = false;\n // It might already be active so manually focus\n this.listItemRoot?.focus();\n return;\n }\n\n this.active = false;\n this.selected = false;\n }\n\n private async onSubMenuKeydown(event: KeyboardEvent) {\n // Stop propagation so that we don't accidentally close every parent menu.\n // Additionally, we want to isolate things like the typeahead keydowns\n // from bubbling up to the parent menu and confounding things.\n event.stopPropagation();\n const shouldClose = this.isSubmenuCloseKey(event.code);\n\n if (!shouldClose) return;\n\n this.close(() => {\n List.deactivateActiveItem(this.submenuEl!.items);\n this.listItemRoot?.focus();\n this.active = true;\n });\n }\n\n /**\n * Shows the submenu.\n *\n * @param onOpened A function to call after the menu is opened.\n */\n show(onOpened = () => {}) {\n const menu = this.submenuEl;\n if (!menu) return;\n\n menu.quick = true;\n // Submenus are in overflow when not fixed. Can remove once we have native\n // popup support\n menu.hasOverflow = true;\n menu.anchorCorner = this.anchorCorner;\n menu.menuCorner = this.menuCorner;\n menu.anchor = this;\n // We manually set focus with `active` on keyboard navigation. And we\n // want to focus the root on hover, so the user can pick up navigation with\n // keyboard after hover.\n menu.defaultFocus = 'LIST_ROOT';\n menu.skipRestoreFocus = true;\n menu.stayOpenOnOutsideClick = true;\n menu.stayOpenOnFocusout = true;\n\n // Menu could already be opened because of mouse interaction\n const menuAlreadyOpen = menu.open;\n // We want the parent to stay open in the case such that a middle submenu\n // has a submenuitem hovered which opens a third submenut. Then if you hover\n // on yet another middle menu-item (not submenuitem) then focusout Event's\n // relatedTarget will be `null` thus, causing all the menus to close\n this.dispatchEvent(createStayOpenOnFocusoutEvent());\n menu.show();\n\n // Deactivate other items. This can be the case if the user has tabbed\n // around the menu and then mouses over an md-sub-menu.\n this.dispatchEvent(createDeactivateItemsEvent());\n this.dispatchEvent(createDeactivateTypeaheadEvent());\n this.selected = true;\n\n // This is the case of mouse hovering when already opened via keyboard or\n // vice versa\n if (menuAlreadyOpen) {\n onOpened();\n } else {\n menu.addEventListener('opened', onOpened, {once: true});\n }\n }\n\n /**\n * Closes the submenu.\n *\n * @param onClosed A function to call after the menu is closed.\n */\n close(onClosed = () => {}) {\n const menu = this.submenuEl;\n if (!menu || !menu.open) return;\n\n this.dispatchEvent(createActivateTypeaheadEvent());\n menu.quick = true;\n menu.close();\n // Restore focusout behavior.\n this.dispatchEvent(createCloseOnFocusoutEvent());\n this.active = false;\n this.selected = false;\n menu.addEventListener('closed', onClosed, {once: true});\n }\n\n /**\n * Determines whether the given KeyboardEvent code is one that should open\n * the submenu. This is RTL-aware. By default, left, right, space, or enter.\n *\n * @param code The native KeyboardEvent code.\n * @return Whether or not the key code should open the submenu.\n */\n private isSubmenuOpenKey(code: string) {\n const isRtl = getComputedStyle(this).direction === 'rtl';\n const arrowEnterKey = isRtl ? NAVIGABLE_KEY.LEFT : NAVIGABLE_KEY.RIGHT;\n switch (code) {\n case arrowEnterKey:\n case SELECTION_KEY.SPACE:\n case SELECTION_KEY.ENTER:\n return true;\n default:\n return false;\n }\n }\n\n /**\n * Determines whether the given KeyboardEvent code is one that should close\n * the submenu. This is RTL-aware. By default right, left, or escape.\n *\n * @param code The native KeyboardEvent code.\n * @return Whether or not the key code should close the submenu.\n */\n private isSubmenuCloseKey(code: string) {\n const isRtl = getComputedStyle(this).direction === 'rtl';\n const arrowEnterKey = isRtl ? NAVIGABLE_KEY.RIGHT : NAVIGABLE_KEY.LEFT;\n switch (code) {\n case arrowEnterKey:\n case KEYDOWN_CLOSE_KEYS.ESCAPE:\n return true;\n default:\n return false;\n }\n }\n\n private onSubmenuPointerEnter() {\n this.submenuHover = true;\n }\n\n private onSubmenuPointerLeave() {\n this.submenuHover = false;\n }\n}\n"]}
@@ -5,7 +5,7 @@
5
5
  */
6
6
  import { MenuItemEl } from './internal/menuitem/menu-item.js';
7
7
  export { ListItem } from '../list/internal/listitem/list-item.js';
8
- export { CloseMenuEvent, DeactivateItemsEvent, MenuItem } from './internal/shared.js';
8
+ export { CloseMenuEvent, MenuItem } from './internal/shared.js';
9
9
  declare global {
10
10
  interface HTMLElementTagNameMap {
11
11
  'md-menu-item': MdMenuItem;
package/menu/menu-item.js CHANGED
@@ -10,7 +10,6 @@ import { styles as listItemStyles } from '../list/internal/listitem/list-item-st
10
10
  import { styles as forcedColorsStyles } from './internal/menuitem/forced-colors-styles.css.js';
11
11
  import { MenuItemEl } from './internal/menuitem/menu-item.js';
12
12
  import { styles } from './internal/menuitem/menu-item-styles.css.js';
13
- export { CloseMenuEvent, DeactivateItemsEvent } from './internal/shared.js';
14
13
  /**
15
14
  * @summary Menus display a list of choices on a temporary surface.
16
15
  *
@@ -1 +1 @@
1
- {"version":3,"file":"menu-item.js","sourceRoot":"","sources":["menu-item.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,MAAM,IAAI,0BAA0B,EAAC,MAAM,uDAAuD,CAAC;AAC3G,OAAO,EAAC,MAAM,IAAI,cAAc,EAAC,MAAM,mDAAmD,CAAC;AAE3F,OAAO,EAAC,MAAM,IAAI,kBAAkB,EAAC,MAAM,iDAAiD,CAAC;AAC7F,OAAO,EAAC,UAAU,EAAC,MAAM,kCAAkC,CAAC;AAC5D,OAAO,EAAC,MAAM,EAAC,MAAM,6CAA6C,CAAC;AAGnE,OAAO,EAAC,cAAc,EAAE,oBAAoB,EAAW,MAAM,sBAAsB,CAAC;AAQpF;;;;;;;;;;;;;;GAcG;AAEI,IAAM,UAAU,GAAhB,MAAM,UAAW,SAAQ,UAAU;;AACxB,iBAAM,GAClB,CAAC,cAAc,EAAE,MAAM,EAAE,0BAA0B,EAAE,kBAAkB,CAAC,CAAC;AAFlE,UAAU;IADtB,aAAa,CAAC,cAAc,CAAC;GACjB,UAAU,CAGtB;SAHY,UAAU","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {customElement} from 'lit/decorators.js';\n\nimport {styles as listItemForcedColorsStyles} from '../list/internal/listitem/forced-colors-styles.css.js';\nimport {styles as listItemStyles} from '../list/internal/listitem/list-item-styles.css.js';\n\nimport {styles as forcedColorsStyles} from './internal/menuitem/forced-colors-styles.css.js';\nimport {MenuItemEl} from './internal/menuitem/menu-item.js';\nimport {styles} from './internal/menuitem/menu-item-styles.css.js';\n\nexport {ListItem} from '../list/internal/listitem/list-item.js';\nexport {CloseMenuEvent, DeactivateItemsEvent, MenuItem} from './internal/shared.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-menu-item': MdMenuItem;\n }\n}\n\n/**\n * @summary Menus display a list of choices on a temporary surface.\n *\n * @description\n * Menu items are the selectable choices within the menu. Menu items must\n * implement the `MenuItem` interface and also have the `md-menu-item`\n * attribute. Additionally menu items are list items so they must also have the\n * `md-list-item` attribute.\n *\n * Menu items can control a menu by selectively firing the `close-menu` and\n * `deselect-items` events.\n *\n * @final\n * @suppress {visibility}\n */\n@customElement('md-menu-item')\nexport class MdMenuItem extends MenuItemEl {\n static override styles =\n [listItemStyles, styles, listItemForcedColorsStyles, forcedColorsStyles];\n}\n"]}
1
+ {"version":3,"file":"menu-item.js","sourceRoot":"","sources":["menu-item.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,MAAM,IAAI,0BAA0B,EAAC,MAAM,uDAAuD,CAAC;AAC3G,OAAO,EAAC,MAAM,IAAI,cAAc,EAAC,MAAM,mDAAmD,CAAC;AAE3F,OAAO,EAAC,MAAM,IAAI,kBAAkB,EAAC,MAAM,iDAAiD,CAAC;AAC7F,OAAO,EAAC,UAAU,EAAC,MAAM,kCAAkC,CAAC;AAC5D,OAAO,EAAC,MAAM,EAAC,MAAM,6CAA6C,CAAC;AAWnE;;;;;;;;;;;;;;GAcG;AAEI,IAAM,UAAU,GAAhB,MAAM,UAAW,SAAQ,UAAU;;AACxB,iBAAM,GAClB,CAAC,cAAc,EAAE,MAAM,EAAE,0BAA0B,EAAE,kBAAkB,CAAC,CAAC;AAFlE,UAAU;IADtB,aAAa,CAAC,cAAc,CAAC;GACjB,UAAU,CAGtB;SAHY,UAAU","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {customElement} from 'lit/decorators.js';\n\nimport {styles as listItemForcedColorsStyles} from '../list/internal/listitem/forced-colors-styles.css.js';\nimport {styles as listItemStyles} from '../list/internal/listitem/list-item-styles.css.js';\n\nimport {styles as forcedColorsStyles} from './internal/menuitem/forced-colors-styles.css.js';\nimport {MenuItemEl} from './internal/menuitem/menu-item.js';\nimport {styles} from './internal/menuitem/menu-item-styles.css.js';\n\nexport {ListItem} from '../list/internal/listitem/list-item.js';\nexport {CloseMenuEvent, MenuItem} from './internal/shared.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-menu-item': MdMenuItem;\n }\n}\n\n/**\n * @summary Menus display a list of choices on a temporary surface.\n *\n * @description\n * Menu items are the selectable choices within the menu. Menu items must\n * implement the `MenuItem` interface and also have the `md-menu-item`\n * attribute. Additionally menu items are list items so they must also have the\n * `md-list-item` attribute.\n *\n * Menu items can control a menu by selectively firing the `close-menu` and\n * `deselect-items` events.\n *\n * @final\n * @suppress {visibility}\n */\n@customElement('md-menu-item')\nexport class MdMenuItem extends MenuItemEl {\n static override styles =\n [listItemStyles, styles, listItemForcedColorsStyles, forcedColorsStyles];\n}\n"]}
package/menu/menu.d.ts CHANGED
@@ -6,7 +6,7 @@
6
6
  import { Menu } from './internal/menu.js';
7
7
  export { ListItem } from '../list/internal/listitem/list-item.js';
8
8
  export { Corner, DefaultFocusState } from './internal/menu.js';
9
- export { CloseMenuEvent, DeactivateItemsEvent, MenuItem } from './internal/shared.js';
9
+ export { CloseMenuEvent, MenuItem } from './internal/shared.js';
10
10
  declare global {
11
11
  interface HTMLElementTagNameMap {
12
12
  'md-menu': MdMenu;
package/menu/menu.js CHANGED
@@ -8,7 +8,6 @@ import { customElement } from 'lit/decorators.js';
8
8
  import { styles as forcedColors } from './internal/forced-colors-styles.css.js';
9
9
  import { Menu } from './internal/menu.js';
10
10
  import { styles } from './internal/menu-styles.css.js';
11
- export { CloseMenuEvent, DeactivateItemsEvent } from './internal/shared.js';
12
11
  /**
13
12
  * @summary Menus display a list of choices on a temporary surface.
14
13
  *
package/menu/menu.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"menu.js","sourceRoot":"","sources":["menu.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,wCAAwC,CAAC;AAC9E,OAAO,EAAC,IAAI,EAAC,MAAM,oBAAoB,CAAC;AACxC,OAAO,EAAC,MAAM,EAAC,MAAM,+BAA+B,CAAC;AAIrD,OAAO,EAAC,cAAc,EAAE,oBAAoB,EAAW,MAAM,sBAAsB,CAAC;AAQpF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyCG;AAEI,IAAM,MAAM,GAAZ,MAAM,MAAO,SAAQ,IAAI;;AACd,aAAM,GAAG,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC;AADrC,MAAM;IADlB,aAAa,CAAC,SAAS,CAAC;GACZ,MAAM,CAElB;SAFY,MAAM","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {customElement} from 'lit/decorators.js';\n\nimport {styles as forcedColors} from './internal/forced-colors-styles.css.js';\nimport {Menu} from './internal/menu.js';\nimport {styles} from './internal/menu-styles.css.js';\n\nexport {ListItem} from '../list/internal/listitem/list-item.js';\nexport {Corner, DefaultFocusState} from './internal/menu.js';\nexport {CloseMenuEvent, DeactivateItemsEvent, MenuItem} from './internal/shared.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-menu': MdMenu;\n }\n}\n\n/**\n * @summary Menus display a list of choices on a temporary surface.\n *\n * @description\n * Menus appear when users interact with a button, action, or other control.\n *\n * They can be opened from a variety of elements, most commonly icon buttons,\n * buttons, and text fields.\n *\n * md-menu listens for the `close-menu` and `deselect-items` events.\n *\n * - `close-menu` closes the menu when dispatched from a child element.\n * - `deselect-items` deselects all of its immediate menu-item children.\n *\n * @example\n * ```html\n * <div style=\"position:relative;\">\n * <button\n * class=\"anchor\"\n * ${ref(anchorRef)}\n * @click=${() => this.menuRef.value.show()}>\n * Click to open menu\n * </button>\n * <!--\n * `has-overflow` is required when using a submenu which overflows the\n * menu's contents\n * -->\n * <md-menu has-overflow ${ref(menuRef)} ${(el) => el.anchor =\n * anchorRef.value}> <md-menu-item header=\"This is a header\"></md-menu-item>\n * <md-sub-menu-item header=\"this is a submenu item\">\n * <md-menu slot=\"submenu\">\n * <md-menu-item\n * header=\"This is an item inside a submenu\"></md-menu-item>\n * </md-menu>\n * </md-sub-menu-item>\n * </md-menu>\n * </div>\n * ```\n *\n * @final\n * @suppress {visibility}\n */\n@customElement('md-menu')\nexport class MdMenu extends Menu {\n static override styles = [styles, forcedColors];\n}\n"]}
1
+ {"version":3,"file":"menu.js","sourceRoot":"","sources":["menu.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,MAAM,IAAI,YAAY,EAAC,MAAM,wCAAwC,CAAC;AAC9E,OAAO,EAAC,IAAI,EAAC,MAAM,oBAAoB,CAAC;AACxC,OAAO,EAAC,MAAM,EAAC,MAAM,+BAA+B,CAAC;AAYrD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyCG;AAEI,IAAM,MAAM,GAAZ,MAAM,MAAO,SAAQ,IAAI;;AACd,aAAM,GAAG,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC;AADrC,MAAM;IADlB,aAAa,CAAC,SAAS,CAAC;GACZ,MAAM,CAElB;SAFY,MAAM","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {customElement} from 'lit/decorators.js';\n\nimport {styles as forcedColors} from './internal/forced-colors-styles.css.js';\nimport {Menu} from './internal/menu.js';\nimport {styles} from './internal/menu-styles.css.js';\n\nexport {ListItem} from '../list/internal/listitem/list-item.js';\nexport {Corner, DefaultFocusState} from './internal/menu.js';\nexport {CloseMenuEvent, MenuItem} from './internal/shared.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-menu': MdMenu;\n }\n}\n\n/**\n * @summary Menus display a list of choices on a temporary surface.\n *\n * @description\n * Menus appear when users interact with a button, action, or other control.\n *\n * They can be opened from a variety of elements, most commonly icon buttons,\n * buttons, and text fields.\n *\n * md-menu listens for the `close-menu` and `deselect-items` events.\n *\n * - `close-menu` closes the menu when dispatched from a child element.\n * - `deselect-items` deselects all of its immediate menu-item children.\n *\n * @example\n * ```html\n * <div style=\"position:relative;\">\n * <button\n * class=\"anchor\"\n * ${ref(anchorRef)}\n * @click=${() => this.menuRef.value.show()}>\n * Click to open menu\n * </button>\n * <!--\n * `has-overflow` is required when using a submenu which overflows the\n * menu's contents\n * -->\n * <md-menu has-overflow ${ref(menuRef)} ${(el) => el.anchor =\n * anchorRef.value}> <md-menu-item header=\"This is a header\"></md-menu-item>\n * <md-sub-menu-item header=\"this is a submenu item\">\n * <md-menu slot=\"submenu\">\n * <md-menu-item\n * header=\"This is an item inside a submenu\"></md-menu-item>\n * </md-menu>\n * </md-sub-menu-item>\n * </md-menu>\n * </div>\n * ```\n *\n * @final\n * @suppress {visibility}\n */\n@customElement('md-menu')\nexport class MdMenu extends Menu {\n static override styles = [styles, forcedColors];\n}\n"]}
@@ -5,7 +5,7 @@
5
5
  */
6
6
  import { SubMenuItem } from './internal/submenuitem/sub-menu-item.js';
7
7
  export { ListItem } from '../list/internal/listitem/list-item.js';
8
- export { CloseMenuEvent, DeactivateItemsEvent, MenuItem } from './internal/shared.js';
8
+ export { CloseMenuEvent, MenuItem } from './internal/shared.js';
9
9
  declare global {
10
10
  interface HTMLElementTagNameMap {
11
11
  'md-sub-menu-item': MdSubMenuItem;
@@ -10,7 +10,6 @@ import { styles as listItemStyles } from '../list/internal/listitem/list-item-st
10
10
  import { styles as forcedColorsStyles } from './internal/menuitem/forced-colors-styles.css.js';
11
11
  import { styles } from './internal/menuitem/menu-item-styles.css.js';
12
12
  import { SubMenuItem } from './internal/submenuitem/sub-menu-item.js';
13
- export { CloseMenuEvent, DeactivateItemsEvent } from './internal/shared.js';
14
13
  /**
15
14
  * @summary Menus display a list of choices on a temporary surface.
16
15
  *
@@ -1 +1 @@
1
- {"version":3,"file":"sub-menu-item.js","sourceRoot":"","sources":["sub-menu-item.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,MAAM,IAAI,0BAA0B,EAAC,MAAM,uDAAuD,CAAC;AAC3G,OAAO,EAAC,MAAM,IAAI,cAAc,EAAC,MAAM,mDAAmD,CAAC;AAE3F,OAAO,EAAC,MAAM,IAAI,kBAAkB,EAAC,MAAM,iDAAiD,CAAC;AAC7F,OAAO,EAAC,MAAM,EAAC,MAAM,6CAA6C,CAAC;AACnE,OAAO,EAAC,WAAW,EAAC,MAAM,yCAAyC,CAAC;AAGpE,OAAO,EAAC,cAAc,EAAE,oBAAoB,EAAW,MAAM,sBAAsB,CAAC;AAQpF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2CG;AAEI,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,WAAW;;AAC5B,oBAAM,GAClB,CAAC,cAAc,EAAE,MAAM,EAAE,0BAA0B,EAAE,kBAAkB,CAAC,CAAC;AAFlE,aAAa;IADzB,aAAa,CAAC,kBAAkB,CAAC;GACrB,aAAa,CAGzB;SAHY,aAAa","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {customElement} from 'lit/decorators.js';\n\nimport {styles as listItemForcedColorsStyles} from '../list/internal/listitem/forced-colors-styles.css.js';\nimport {styles as listItemStyles} from '../list/internal/listitem/list-item-styles.css.js';\n\nimport {styles as forcedColorsStyles} from './internal/menuitem/forced-colors-styles.css.js';\nimport {styles} from './internal/menuitem/menu-item-styles.css.js';\nimport {SubMenuItem} from './internal/submenuitem/sub-menu-item.js';\n\nexport {ListItem} from '../list/internal/listitem/list-item.js';\nexport {CloseMenuEvent, DeactivateItemsEvent, MenuItem} from './internal/shared.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-sub-menu-item': MdSubMenuItem;\n }\n}\n\n/**\n * @summary Menus display a list of choices on a temporary surface.\n *\n * @description\n * Menu items are the selectable choices within the menu. Menu items must\n * implement the `MenuItem` interface and also have the `md-menu-item`\n * attribute. Additionally menu items are list items so they must also have the\n * `md-list-item` attribute.\n *\n * Menu items can control a menu by selectively firing the `close-menu` and\n * `deselect-items` events.\n *\n * This menu item will open a sub-menu that is slotted in the `submenu` slot.\n * Additionally, the containing menu must either have `has-overflow` or `fixed`\n * set to `true` in order to display the containing menu properly.\n *\n * @example\n * ```html\n * <div style=\"position:relative;\">\n * <button\n * class=\"anchor\"\n * ${ref(anchorRef)}\n * @click=${() => this.menuRef.value.show()}>\n * Click to open menu\n * </button>\n * <!--\n * `has-overflow` is required when using a submenu which overflows the\n * menu's contents\n * -->\n * <md-menu has-overflow ${ref(menuRef)} ${(el) => el.anchor =\n * anchorRef.value}> <md-menu-item header=\"This is a header\"></md-menu-item>\n * <md-sub-menu-item header=\"this is a submenu item\">\n * <md-menu slot=\"submenu\">\n * <md-menu-item\n * header=\"This is an item inside a submenu\"></md-menu-item>\n * </md-menu>\n * </md-sub-menu>\n * </md-menu>\n * </div>\n * ```\n *\n * @final\n * @suppress {visibility}\n */\n@customElement('md-sub-menu-item')\nexport class MdSubMenuItem extends SubMenuItem {\n static override styles =\n [listItemStyles, styles, listItemForcedColorsStyles, forcedColorsStyles];\n}\n"]}
1
+ {"version":3,"file":"sub-menu-item.js","sourceRoot":"","sources":["sub-menu-item.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;AAEH,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAC,MAAM,IAAI,0BAA0B,EAAC,MAAM,uDAAuD,CAAC;AAC3G,OAAO,EAAC,MAAM,IAAI,cAAc,EAAC,MAAM,mDAAmD,CAAC;AAE3F,OAAO,EAAC,MAAM,IAAI,kBAAkB,EAAC,MAAM,iDAAiD,CAAC;AAC7F,OAAO,EAAC,MAAM,EAAC,MAAM,6CAA6C,CAAC;AACnE,OAAO,EAAC,WAAW,EAAC,MAAM,yCAAyC,CAAC;AAWpE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2CG;AAEI,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,WAAW;;AAC5B,oBAAM,GAClB,CAAC,cAAc,EAAE,MAAM,EAAE,0BAA0B,EAAE,kBAAkB,CAAC,CAAC;AAFlE,aAAa;IADzB,aAAa,CAAC,kBAAkB,CAAC;GACrB,aAAa,CAGzB;SAHY,aAAa","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {customElement} from 'lit/decorators.js';\n\nimport {styles as listItemForcedColorsStyles} from '../list/internal/listitem/forced-colors-styles.css.js';\nimport {styles as listItemStyles} from '../list/internal/listitem/list-item-styles.css.js';\n\nimport {styles as forcedColorsStyles} from './internal/menuitem/forced-colors-styles.css.js';\nimport {styles} from './internal/menuitem/menu-item-styles.css.js';\nimport {SubMenuItem} from './internal/submenuitem/sub-menu-item.js';\n\nexport {ListItem} from '../list/internal/listitem/list-item.js';\nexport {CloseMenuEvent, MenuItem} from './internal/shared.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'md-sub-menu-item': MdSubMenuItem;\n }\n}\n\n/**\n * @summary Menus display a list of choices on a temporary surface.\n *\n * @description\n * Menu items are the selectable choices within the menu. Menu items must\n * implement the `MenuItem` interface and also have the `md-menu-item`\n * attribute. Additionally menu items are list items so they must also have the\n * `md-list-item` attribute.\n *\n * Menu items can control a menu by selectively firing the `close-menu` and\n * `deselect-items` events.\n *\n * This menu item will open a sub-menu that is slotted in the `submenu` slot.\n * Additionally, the containing menu must either have `has-overflow` or `fixed`\n * set to `true` in order to display the containing menu properly.\n *\n * @example\n * ```html\n * <div style=\"position:relative;\">\n * <button\n * class=\"anchor\"\n * ${ref(anchorRef)}\n * @click=${() => this.menuRef.value.show()}>\n * Click to open menu\n * </button>\n * <!--\n * `has-overflow` is required when using a submenu which overflows the\n * menu's contents\n * -->\n * <md-menu has-overflow ${ref(menuRef)} ${(el) => el.anchor =\n * anchorRef.value}> <md-menu-item header=\"This is a header\"></md-menu-item>\n * <md-sub-menu-item header=\"this is a submenu item\">\n * <md-menu slot=\"submenu\">\n * <md-menu-item\n * header=\"This is an item inside a submenu\"></md-menu-item>\n * </md-menu>\n * </md-sub-menu>\n * </md-menu>\n * </div>\n * ```\n *\n * @final\n * @suppress {visibility}\n */\n@customElement('md-sub-menu-item')\nexport class MdSubMenuItem extends SubMenuItem {\n static override styles =\n [listItemStyles, styles, listItemForcedColorsStyles, forcedColorsStyles];\n}\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@material/web",
3
- "version": "1.0.0-pre.14",
3
+ "version": "1.0.0-pre.16",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -37,12 +37,10 @@
37
37
  "!catalog"
38
38
  ],
39
39
  "workspaces": [
40
- ".",
41
40
  "catalog"
42
41
  ],
43
42
  "dependencies": {
44
43
  "lit": "^2.7.4",
45
- "safevalues": "^0.4.3",
46
44
  "tslib": "^2.4.0"
47
45
  },
48
46
  "devDependencies": {
@@ -10,9 +10,7 @@ import { Harness } from '../testing/harness.js';
10
10
  export class LinearProgressHarness extends Harness {
11
11
  async getInteractiveElement() {
12
12
  await this.element.updateComplete;
13
- // Test access to protected property
14
- // tslint:disable-next-line:no-dict-access-on-struct-type
15
- return this.element['rootEl'];
13
+ return this.element.querySelector('.progress');
16
14
  }
17
15
  }
18
16
  /**
@@ -21,7 +19,7 @@ export class LinearProgressHarness extends Harness {
21
19
  export class CircularProgressHarness extends Harness {
22
20
  async getInteractiveElement() {
23
21
  await this.element.updateComplete;
24
- return this.element.querySelector('.circularProgresss');
22
+ return this.element.querySelector('.progress');
25
23
  }
26
24
  }
27
25
  //# sourceMappingURL=harness.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"harness.js","sourceRoot":"","sources":["harness.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAC,OAAO,EAAC,MAAM,uBAAuB,CAAC;AAK9C;;GAEG;AACH,MAAM,OAAO,qBAAsB,SAAQ,OAAuB;IACvD,KAAK,CAAC,qBAAqB;QAClC,MAAM,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC;QAClC,oCAAoC;QACpC,yDAAyD;QACzD,OAAO,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;IAChC,CAAC;CACF;AAED;;GAEG;AACH,MAAM,OAAO,uBAAwB,SAAQ,OAAyB;IAC3D,KAAK,CAAC,qBAAqB;QAClC,MAAM,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC;QAClC,OAAO,IAAI,CAAC,OAAO,CAAC,aAAa,CAAc,oBAAoB,CAAE,CAAC;IACxE,CAAC;CACF","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {Harness} from '../testing/harness.js';\n\nimport {CircularProgress} from './internal/circular-progress.js';\nimport {LinearProgress} from './internal/linear-progress.js';\n\n/**\n * Test harness for linear-progress.\n */\nexport class LinearProgressHarness extends Harness<LinearProgress> {\n override async getInteractiveElement() {\n await this.element.updateComplete;\n // Test access to protected property\n // tslint:disable-next-line:no-dict-access-on-struct-type\n return this.element['rootEl'];\n }\n}\n\n/**\n * Test harness for circular-progress.\n */\nexport class CircularProgressHarness extends Harness<CircularProgress> {\n override async getInteractiveElement() {\n await this.element.updateComplete;\n return this.element.querySelector<HTMLElement>('.circularProgresss')!;\n }\n}\n"]}
1
+ {"version":3,"file":"harness.js","sourceRoot":"","sources":["harness.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAC,OAAO,EAAC,MAAM,uBAAuB,CAAC;AAK9C;;GAEG;AACH,MAAM,OAAO,qBAAsB,SAAQ,OAAuB;IACvD,KAAK,CAAC,qBAAqB;QAClC,MAAM,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC;QAClC,OAAO,IAAI,CAAC,OAAO,CAAC,aAAa,CAAc,WAAW,CAAE,CAAC;IAC/D,CAAC;CACF;AAED;;GAEG;AACH,MAAM,OAAO,uBAAwB,SAAQ,OAAyB;IAC3D,KAAK,CAAC,qBAAqB;QAClC,MAAM,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC;QAClC,OAAO,IAAI,CAAC,OAAO,CAAC,aAAa,CAAc,WAAW,CAAE,CAAC;IAC/D,CAAC;CACF","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {Harness} from '../testing/harness.js';\n\nimport {CircularProgress} from './internal/circular-progress.js';\nimport {LinearProgress} from './internal/linear-progress.js';\n\n/**\n * Test harness for linear-progress.\n */\nexport class LinearProgressHarness extends Harness<LinearProgress> {\n override async getInteractiveElement() {\n await this.element.updateComplete;\n return this.element.querySelector<HTMLElement>('.progress')!;\n }\n}\n\n/**\n * Test harness for circular-progress.\n */\nexport class CircularProgressHarness extends Harness<CircularProgress> {\n override async getInteractiveElement() {\n await this.element.updateComplete;\n return this.element.querySelector<HTMLElement>('.progress')!;\n }\n}\n"]}
@@ -80,7 +80,7 @@
80
80
  .circle,
81
81
  svg,
82
82
  .track,
83
- .progress {
83
+ .active-track {
84
84
  position: absolute;
85
85
  inset: 0;
86
86
  }
@@ -100,7 +100,7 @@
100
100
  fill: transparent;
101
101
  }
102
102
 
103
- .progress {
103
+ .active-track {
104
104
  // note, these value come from the m2 version but match current gm3 values.
105
105
  transition: stroke-dashoffset 500ms cubic-bezier(0, 0, 0.2, 1);
106
106
  stroke: var(--_active-indicator-color);
@@ -162,8 +162,8 @@
162
162
  animation-delay: calc(-0.5 * $arc-duration), 0ms;
163
163
  }
164
164
 
165
- @media screen and (forced-colors: active) {
166
- .progress {
165
+ @media (forced-colors: active) {
166
+ .active-track {
167
167
  stroke: CanvasText;
168
168
  }
169
169