@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
@@ -30,18 +30,20 @@ $supported-tokens: (
30
30
  'pressed-state-layer-color',
31
31
  'pressed-state-layer-opacity',
32
32
  'selected-container-color',
33
+ 'toggle-focus-icon-color',
34
+ 'toggle-hover-icon-color',
35
+ 'toggle-hover-state-layer-color',
36
+ 'toggle-icon-color',
37
+ 'toggle-pressed-icon-color',
38
+ 'toggle-pressed-state-layer-color',
33
39
  'toggle-selected-focus-icon-color',
34
40
  'toggle-selected-hover-icon-color',
35
41
  'toggle-selected-hover-state-layer-color',
36
42
  'toggle-selected-icon-color',
37
43
  'toggle-selected-pressed-icon-color',
38
44
  'toggle-selected-pressed-state-layer-color',
39
- 'toggle-unselected-focus-icon-color',
40
- 'toggle-unselected-hover-icon-color',
41
- 'toggle-unselected-hover-state-layer-color',
42
- 'toggle-unselected-icon-color',
43
- 'toggle-unselected-pressed-icon-color',
44
- 'toggle-unselected-pressed-state-layer-color',
45
+ // Note: filled icon buttons have three container colors,
46
+ // "container-color" for regular, then selected/unselected for toggle.
45
47
  'unselected-container-color',
46
48
  // go/keep-sorted end
47
49
  );
@@ -50,8 +52,8 @@ $unsupported-tokens: (
50
52
  // go/keep-sorted start
51
53
  'focus-state-layer-color',
52
54
  'focus-state-layer-opacity',
55
+ 'toggle-focus-state-layer-color',
53
56
  'toggle-selected-focus-state-layer-color',
54
- 'toggle-unselected-focus-state-layer-color',
55
57
  // go/keep-sorted end
56
58
  );
57
59
 
@@ -65,7 +67,20 @@ $_default: (
65
67
  $tokens: values.validate(
66
68
  md-comp-filled-icon-button.values($deps, $exclude-hardcoded-values),
67
69
  $supported-tokens: $supported-tokens,
68
- $unsupported-tokens: $unsupported-tokens
70
+ $unsupported-tokens: $unsupported-tokens,
71
+ $renamed-tokens: (
72
+ // TODO(b/292244480): remove default unselected prefix
73
+ 'toggle-unselected-focus-icon-color': 'toggle-focus-icon-color',
74
+ 'toggle-unselected-hover-icon-color': 'toggle-hover-icon-color',
75
+ 'toggle-unselected-hover-state-layer-color':
76
+ 'toggle-hover-state-layer-color',
77
+ 'toggle-unselected-icon-color': 'toggle-icon-color',
78
+ 'toggle-unselected-pressed-icon-color': 'toggle-pressed-icon-color',
79
+ 'toggle-unselected-pressed-state-layer-color':
80
+ 'toggle-pressed-state-layer-color',
81
+ 'toggle-unselected-focus-state-layer-color':
82
+ 'toggle-focus-state-layer-color'
83
+ )
69
84
  );
70
85
 
71
86
  @return $tokens;
@@ -137,9 +137,30 @@ $_default: (
137
137
  'md-sys-typescale': md-sys-typescale.values(),
138
138
  );
139
139
 
140
+ @function _get-override-tokens($exclude-hardcoded-values) {
141
+ // Values pulled from b/198759625 spreadsheet
142
+ @return (
143
+ // go/keep-sorted start
144
+ // TODO(b/259455114): remove when focus tokens update to 3px
145
+ 'text-field-focus-active-indicator-height':
146
+ if($exclude-hardcoded-values, null, 3px),
147
+ // TODO(b/292242500): remove once we upgrade tokens
148
+ 'text-field-leading-icon-size': if($exclude-hardcoded-values, null, 24px),
149
+ // go/keep-sorted end
150
+ );
151
+ }
152
+
140
153
  @function values($deps: $_default, $exclude-hardcoded-values: false) {
154
+ $original-tokens: md-comp-filled-select.values(
155
+ $deps,
156
+ $exclude-hardcoded-values
157
+ );
158
+ $original-tokens: map.merge(
159
+ $original-tokens,
160
+ _get-override-tokens($exclude-hardcoded-values)
161
+ );
141
162
  $tokens: values.validate(
142
- md-comp-filled-select.values($deps, $exclude-hardcoded-values),
163
+ $original-tokens,
143
164
  $supported-tokens: $supported-tokens,
144
165
  $unsupported-tokens: $unsupported-tokens
145
166
  );
@@ -126,13 +126,15 @@ $_default: (
126
126
  $unsupported-tokens: $unsupported-tokens
127
127
  );
128
128
 
129
- // TODO(b/271876162): remove when tokens compiler emits typescale tokens
130
129
  $tokens: map.merge(
131
130
  $tokens,
132
131
  (
132
+ // TODO(b/271876162): remove when tokens compiler emits typescale tokens
133
133
  'input-text-type': map.get($deps, 'md-sys-typescale', 'body-large'),
134
134
  'label-text-type': map.get($deps, 'md-sys-typescale', 'body-large'),
135
135
  'supporting-text-type': map.get($deps, 'md-sys-typescale', 'body-small'),
136
+ // TODO(b/259455114): remove when focus tokens update to 3px
137
+ 'focus-active-indicator-height': if($exclude-hardcoded-values, null, 3px)
136
138
  )
137
139
  );
138
140
 
@@ -42,17 +42,17 @@ $supported-tokens: (
42
42
  'icon-size',
43
43
  'label-text-color',
44
44
  'label-text-type',
45
+ 'leading-space',
45
46
  'pressed-container-elevation',
46
47
  'pressed-icon-color',
47
48
  'pressed-label-text-color',
48
49
  'pressed-state-layer-color',
49
50
  'pressed-state-layer-opacity',
50
- 'spacing-leading',
51
- 'spacing-trailing',
52
- 'with-icon-spacing-leading',
53
- 'with-icon-spacing-trailing',
54
- 'with-trailing-icon-spacing-leading',
55
- 'with-trailing-icon-spacing-trailing',
51
+ 'trailing-space',
52
+ 'with-leading-icon-leading-space',
53
+ 'with-leading-icon-trailing-space',
54
+ 'with-trailing-icon-leading-space',
55
+ 'with-trailing-icon-trailing-space',
56
56
  // go/keep-sorted end
57
57
  );
58
58
 
@@ -84,13 +84,15 @@ $_default: (
84
84
  $new-tokens: (
85
85
  // TODO(b/198759625): Remove once spacing tokens are formally added
86
86
  // go/keep-sorted start
87
- 'spacing-leading': if($exclude-hardcoded-values, null, 24px),
88
- 'spacing-trailing': if($exclude-hardcoded-values, null, 24px),
89
- 'with-icon-spacing-leading': if($exclude-hardcoded-values, null, 16px),
90
- 'with-icon-spacing-trailing': if($exclude-hardcoded-values, null, 24px),
91
- 'with-trailing-icon-spacing-leading':
87
+ 'leading-space': if($exclude-hardcoded-values, null, 24px),
88
+ 'trailing-space': if($exclude-hardcoded-values, null, 24px),
89
+ 'with-leading-icon-leading-space':
90
+ if($exclude-hardcoded-values, null, 16px),
91
+ 'with-leading-icon-trailing-space':
92
+ if($exclude-hardcoded-values, null, 24px),
93
+ 'with-trailing-icon-leading-space':
92
94
  if($exclude-hardcoded-values, null, 24px),
93
- 'with-trailing-icon-spacing-trailing':
95
+ 'with-trailing-icon-trailing-space':
94
96
  if($exclude-hardcoded-values, null, 16px),
95
97
  // go/keep-sorted end
96
98
  ),
@@ -30,18 +30,20 @@ $supported-tokens: (
30
30
  'pressed-state-layer-color',
31
31
  'pressed-state-layer-opacity',
32
32
  'selected-container-color',
33
+ 'toggle-focus-icon-color',
34
+ 'toggle-hover-icon-color',
35
+ 'toggle-hover-state-layer-color',
36
+ 'toggle-icon-color',
37
+ 'toggle-pressed-icon-color',
38
+ 'toggle-pressed-state-layer-color',
33
39
  'toggle-selected-focus-icon-color',
34
40
  'toggle-selected-hover-icon-color',
35
41
  'toggle-selected-hover-state-layer-color',
36
42
  'toggle-selected-icon-color',
37
43
  'toggle-selected-pressed-icon-color',
38
44
  'toggle-selected-pressed-state-layer-color',
39
- 'toggle-unselected-focus-icon-color',
40
- 'toggle-unselected-hover-icon-color',
41
- 'toggle-unselected-hover-state-layer-color',
42
- 'toggle-unselected-icon-color',
43
- 'toggle-unselected-pressed-icon-color',
44
- 'toggle-unselected-pressed-state-layer-color',
45
+ // Note: filled icon buttons have three container colors,
46
+ // "container-color" for regular, then selected/unselected for toggle.
45
47
  'unselected-container-color',
46
48
  // go/keep-sorted end
47
49
  );
@@ -50,8 +52,8 @@ $unsupported-tokens: (
50
52
  // go/keep-sorted start
51
53
  'focus-state-layer-color',
52
54
  'focus-state-layer-opacity',
55
+ 'toggle-focus-state-layer-color',
53
56
  'toggle-selected-focus-state-layer-color',
54
- 'toggle-unselected-focus-state-layer-color',
55
57
  // go/keep-sorted end
56
58
  );
57
59
 
@@ -65,7 +67,20 @@ $_default: (
65
67
  $tokens: values.validate(
66
68
  md-comp-filled-tonal-icon-button.values($deps, $exclude-hardcoded-values),
67
69
  $supported-tokens: $supported-tokens,
68
- $unsupported-tokens: $unsupported-tokens
70
+ $unsupported-tokens: $unsupported-tokens,
71
+ $renamed-tokens: (
72
+ // TODO(b/292244480): remove default unselected prefix
73
+ 'toggle-unselected-focus-icon-color': 'toggle-focus-icon-color',
74
+ 'toggle-unselected-hover-icon-color': 'toggle-hover-icon-color',
75
+ 'toggle-unselected-hover-state-layer-color':
76
+ 'toggle-hover-state-layer-color',
77
+ 'toggle-unselected-icon-color': 'toggle-icon-color',
78
+ 'toggle-unselected-pressed-icon-color': 'toggle-pressed-icon-color',
79
+ 'toggle-unselected-pressed-state-layer-color':
80
+ 'toggle-pressed-state-layer-color',
81
+ 'toggle-unselected-focus-state-layer-color':
82
+ 'toggle-focus-state-layer-color'
83
+ )
69
84
  );
70
85
 
71
86
  @return $tokens;
@@ -15,7 +15,15 @@ $supported-tokens: (
15
15
  // go/keep-sorted start
16
16
  'disabled-icon-color',
17
17
  'disabled-icon-opacity',
18
+ 'focus-icon-color',
19
+ 'hover-icon-color',
20
+ 'hover-state-layer-color',
21
+ 'hover-state-layer-opacity',
22
+ 'icon-color',
18
23
  'icon-size',
24
+ 'pressed-icon-color',
25
+ 'pressed-state-layer-color',
26
+ 'pressed-state-layer-opacity',
19
27
  'selected-focus-icon-color',
20
28
  'selected-hover-icon-color',
21
29
  'selected-hover-state-layer-color',
@@ -26,23 +34,15 @@ $supported-tokens: (
26
34
  'selected-pressed-state-layer-opacity',
27
35
  'state-layer-shape',
28
36
  'state-layer-size',
29
- 'unselected-focus-icon-color',
30
- 'unselected-hover-icon-color',
31
- 'unselected-hover-state-layer-color',
32
- 'unselected-hover-state-layer-opacity',
33
- 'unselected-icon-color',
34
- 'unselected-pressed-icon-color',
35
- 'unselected-pressed-state-layer-color',
36
- 'unselected-pressed-state-layer-opacity',
37
37
  // go/keep-sorted end
38
38
  );
39
39
 
40
40
  $unsupported-tokens: (
41
41
  // go/keep-sorted start
42
+ 'focus-state-layer-color',
43
+ 'focus-state-layer-opacity',
42
44
  'selected-focus-state-layer-color',
43
45
  'selected-focus-state-layer-opacity',
44
- 'unselected-focus-state-layer-color',
45
- 'unselected-focus-state-layer-opacity',
46
46
  // go/keep-sorted end
47
47
  );
48
48
 
@@ -56,7 +56,20 @@ $_default: (
56
56
  $tokens: values.validate(
57
57
  md-comp-icon-button.values($deps, $exclude-hardcoded-values),
58
58
  $supported-tokens: $supported-tokens,
59
- $unsupported-tokens: $unsupported-tokens
59
+ $unsupported-tokens: $unsupported-tokens,
60
+ $renamed-tokens: (
61
+ // TODO(b/292244480): remove default unselected prefix
62
+ 'unselected-focus-icon-color': 'focus-icon-color',
63
+ 'unselected-hover-icon-color': 'hover-icon-color',
64
+ 'unselected-hover-state-layer-color': 'hover-state-layer-color',
65
+ 'unselected-hover-state-layer-opacity': 'hover-state-layer-opacity',
66
+ 'unselected-icon-color': 'icon-color',
67
+ 'unselected-pressed-icon-color': 'pressed-icon-color',
68
+ 'unselected-pressed-state-layer-color': 'pressed-state-layer-color',
69
+ 'unselected-pressed-state-layer-opacity': 'pressed-state-layer-opacity',
70
+ 'unselected-focus-state-layer-color': 'focus-state-layer-color',
71
+ 'unselected-focus-state-layer-opacity': 'focus-state-layer-opacity'
72
+ )
60
73
  );
61
74
 
62
75
  @return $tokens;
@@ -0,0 +1,32 @@
1
+ //
2
+ // Copyright 2023 Google LLC
3
+ // SPDX-License-Identifier: Apache-2.0
4
+ //
5
+
6
+ // go/keep-sorted start
7
+ @use './values';
8
+ // go/keep-sorted end
9
+
10
+ $supported-tokens: (
11
+ // go/keep-sorted start
12
+ 'font',
13
+ // go/keep-sorted end
14
+ );
15
+
16
+ @function _get-new-tokens($exclude-hardcoded-values) {
17
+ @return (
18
+ // go/keep-sorted start
19
+ font: if($exclude-hardcoded-values, null, 'Material Symbols Outlined'),
20
+ // go/keep-sorted end
21
+ );
22
+ }
23
+
24
+ @function values($exclude-hardcoded-values: false) {
25
+ $tokens: values.validate(
26
+ (),
27
+ $supported-tokens: $supported-tokens,
28
+ $new-tokens: _get-new-tokens($exclude-hardcoded-values)
29
+ );
30
+
31
+ @return $tokens;
32
+ }
@@ -4,7 +4,9 @@
4
4
  //
5
5
 
6
6
  // go/keep-sorted start
7
+ @use 'sass:list';
7
8
  @use 'sass:map';
9
+ @use 'sass:string';
8
10
  // go/keep-sorted end
9
11
  // go/keep-sorted start
10
12
  @use './md-sys-color';
@@ -18,102 +20,102 @@
18
20
 
19
21
  $supported-tokens: (
20
22
  // go/keep-sorted start
21
- 'list-item-container-color',
22
- 'list-item-container-shape',
23
- 'list-item-disabled-label-text-color',
24
- 'list-item-disabled-label-text-opacity',
25
- 'list-item-disabled-leading-icon-color',
26
- 'list-item-disabled-leading-icon-opacity',
27
- 'list-item-disabled-trailing-icon-color',
28
- 'list-item-disabled-trailing-icon-opacity',
29
- 'list-item-focus-label-text-color',
30
- 'list-item-focus-leading-icon-icon-color',
31
- 'list-item-focus-trailing-icon-icon-color',
32
- 'list-item-hover-label-text-color',
33
- 'list-item-hover-leading-icon-icon-color',
34
- 'list-item-hover-state-layer-color',
35
- 'list-item-hover-state-layer-opacity',
36
- 'list-item-hover-trailing-icon-icon-color',
37
- 'list-item-label-text-color',
38
- 'list-item-label-text-line-height',
39
- 'list-item-label-text-type',
40
- 'list-item-large-leading-video-height',
41
- 'list-item-leading-avatar-color',
42
- 'list-item-leading-avatar-label-color',
43
- 'list-item-leading-avatar-label-type',
44
- 'list-item-leading-avatar-shape',
45
- 'list-item-leading-avatar-size',
46
- 'list-item-leading-element-leading-space',
47
- 'list-item-leading-icon-color',
48
- 'list-item-leading-icon-size',
49
- 'list-item-leading-image-height',
50
- 'list-item-leading-image-shape',
51
- 'list-item-leading-image-width',
52
- 'list-item-leading-space',
53
- 'list-item-leading-video-leading-space',
54
- 'list-item-leading-video-shape',
55
- 'list-item-leading-video-width',
56
- 'list-item-one-line-container-height',
57
- 'list-item-pressed-label-text-color',
58
- 'list-item-pressed-leading-icon-icon-color',
59
- 'list-item-pressed-state-layer-color',
60
- 'list-item-pressed-state-layer-opacity',
61
- 'list-item-pressed-trailing-icon-icon-color',
62
- 'list-item-small-leading-video-height',
63
- 'list-item-supporting-text-color',
64
- 'list-item-supporting-text-type',
65
- 'list-item-three-line-container-height',
66
- 'list-item-trailing-element-headline-trailing-element-space',
67
- 'list-item-trailing-icon-color',
68
- 'list-item-trailing-icon-size',
69
- 'list-item-trailing-space',
70
- 'list-item-trailing-supporting-text-color',
71
- 'list-item-trailing-supporting-text-line-height',
72
- 'list-item-trailing-supporting-text-type',
73
- 'list-item-two-line-container-height',
23
+ 'container-color',
24
+ 'container-shape',
25
+ 'disabled-label-text-color',
26
+ 'disabled-label-text-opacity',
27
+ 'disabled-leading-icon-color',
28
+ 'disabled-leading-icon-opacity',
29
+ 'disabled-trailing-icon-color',
30
+ 'disabled-trailing-icon-opacity',
31
+ 'focus-label-text-color',
32
+ 'focus-leading-icon-icon-color',
33
+ 'focus-trailing-icon-icon-color',
34
+ 'hover-label-text-color',
35
+ 'hover-leading-icon-icon-color',
36
+ 'hover-state-layer-color',
37
+ 'hover-state-layer-opacity',
38
+ 'hover-trailing-icon-icon-color',
39
+ 'label-text-color',
40
+ 'label-text-line-height',
41
+ 'label-text-type',
42
+ 'large-leading-video-height',
43
+ 'leading-avatar-color',
44
+ 'leading-avatar-label-color',
45
+ 'leading-avatar-label-type',
46
+ 'leading-avatar-shape',
47
+ 'leading-avatar-size',
48
+ 'leading-element-leading-space',
49
+ 'leading-icon-color',
50
+ 'leading-icon-size',
51
+ 'leading-image-height',
52
+ 'leading-image-shape',
53
+ 'leading-image-width',
54
+ 'leading-space',
55
+ 'leading-video-leading-space',
56
+ 'leading-video-shape',
57
+ 'leading-video-width',
58
+ 'one-line-container-height',
59
+ 'pressed-label-text-color',
60
+ 'pressed-leading-icon-icon-color',
61
+ 'pressed-state-layer-color',
62
+ 'pressed-state-layer-opacity',
63
+ 'pressed-trailing-icon-icon-color',
64
+ 'small-leading-video-height',
65
+ 'supporting-text-color',
66
+ 'supporting-text-type',
67
+ 'three-line-container-height',
68
+ 'trailing-element-headline-trailing-element-space',
69
+ 'trailing-icon-color',
70
+ 'trailing-icon-size',
71
+ 'trailing-space',
72
+ 'trailing-supporting-text-color',
73
+ 'trailing-supporting-text-line-height',
74
+ 'trailing-supporting-text-type',
75
+ 'two-line-container-height',
74
76
  // go/keep-sorted end
75
77
  );
76
78
 
77
79
  $unsupported-tokens: (
78
80
  // go/keep-sorted start
79
- 'list-item-container-elevation',
80
- 'list-item-disabled-state-layer-color',
81
- 'list-item-disabled-state-layer-opacity',
82
- 'list-item-dragged-container-elevation',
83
- 'list-item-dragged-label-text-color',
84
- 'list-item-dragged-leading-icon-icon-color',
85
- 'list-item-dragged-state-layer-color',
86
- 'list-item-dragged-state-layer-opacity',
87
- 'list-item-dragged-trailing-icon-icon-color',
88
- 'list-item-focus-state-layer-color',
89
- 'list-item-focus-state-layer-opacity',
90
- 'list-item-label-text-font',
91
- 'list-item-label-text-size',
92
- 'list-item-label-text-tracking',
93
- 'list-item-label-text-weight',
94
- 'list-item-leading-avatar-label-font',
95
- 'list-item-leading-avatar-label-line-height',
96
- 'list-item-leading-avatar-label-size',
97
- 'list-item-leading-avatar-label-tracking',
98
- 'list-item-leading-avatar-label-weight',
99
- 'list-item-overline-color',
100
- 'list-item-overline-font',
101
- 'list-item-overline-line-height',
102
- 'list-item-overline-size',
103
- 'list-item-overline-tracking',
104
- 'list-item-overline-type',
105
- 'list-item-overline-weight',
106
- 'list-item-selected-trailing-icon-color',
107
- 'list-item-supporting-text-font',
108
- 'list-item-supporting-text-line-height',
109
- 'list-item-supporting-text-size',
110
- 'list-item-supporting-text-tracking',
111
- 'list-item-supporting-text-weight',
112
- 'list-item-trailing-supporting-text-font',
113
- 'list-item-trailing-supporting-text-size',
114
- 'list-item-trailing-supporting-text-tracking',
115
- 'list-item-trailing-supporting-text-weight',
116
- 'list-item-unselected-trailing-icon-color',
81
+ 'container-elevation',
82
+ 'disabled-state-layer-color',
83
+ 'disabled-state-layer-opacity',
84
+ 'dragged-container-elevation',
85
+ 'dragged-label-text-color',
86
+ 'dragged-leading-icon-icon-color',
87
+ 'dragged-state-layer-color',
88
+ 'dragged-state-layer-opacity',
89
+ 'dragged-trailing-icon-icon-color',
90
+ 'focus-state-layer-color',
91
+ 'focus-state-layer-opacity',
92
+ 'label-text-font',
93
+ 'label-text-size',
94
+ 'label-text-tracking',
95
+ 'label-text-weight',
96
+ 'leading-avatar-label-font',
97
+ 'leading-avatar-label-line-height',
98
+ 'leading-avatar-label-size',
99
+ 'leading-avatar-label-tracking',
100
+ 'leading-avatar-label-weight',
101
+ 'overline-color',
102
+ 'overline-font',
103
+ 'overline-line-height',
104
+ 'overline-size',
105
+ 'overline-tracking',
106
+ 'overline-type',
107
+ 'overline-weight',
108
+ 'selected-trailing-icon-color',
109
+ 'supporting-text-font',
110
+ 'supporting-text-line-height',
111
+ 'supporting-text-size',
112
+ 'supporting-text-tracking',
113
+ 'supporting-text-weight',
114
+ 'trailing-supporting-text-font',
115
+ 'trailing-supporting-text-size',
116
+ 'trailing-supporting-text-tracking',
117
+ 'trailing-supporting-text-weight',
118
+ 'unselected-trailing-icon-color',
117
119
  // go/keep-sorted end
118
120
  );
119
121
 
@@ -133,29 +135,41 @@ $_default: (
133
135
  $original-tokens,
134
136
  $supported-tokens: $supported-tokens,
135
137
  $unsupported-tokens: $unsupported-tokens,
136
- $new-tokens: _get-new-tokens($deps, $exclude-hardcoded-values)
138
+ $new-tokens: _get-new-tokens($deps, $exclude-hardcoded-values),
139
+ $renamed-tokens: _get-renamed-tokens($original-tokens)
137
140
  );
138
141
 
139
142
  @return $tokens;
140
143
  }
141
144
 
145
+ // remove list-item prefix from tokens
146
+ @function _get-renamed-tokens($tokens) {
147
+ $keys: map.keys($tokens);
148
+ $renamed-tokens: ();
149
+
150
+ @each $key in $keys {
151
+ $renamed-key: string.slice($key, string.length('list-item-') + 1);
152
+ $renamed-tokens: map.set($renamed-tokens, $key, $renamed-key);
153
+ }
154
+
155
+ @return $renamed-tokens;
156
+ }
157
+
142
158
  @function _get-new-tokens($deps, $exclude-hardcoded-values) {
143
159
  // Values pulled from b/198759625 spreadsheet
144
160
  @return (
145
161
  // go/keep-sorted start
146
- 'list-item-leading-element-leading-space':
147
- if($exclude-hardcoded-values, null, 16px),
148
- 'list-item-leading-space': if($exclude-hardcoded-values, null, 16px),
149
- 'list-item-leading-video-leading-space':
150
- if($exclude-hardcoded-values, null, 0px),
162
+ 'leading-element-leading-space': if($exclude-hardcoded-values, null, 16px),
163
+ 'leading-space': if($exclude-hardcoded-values, null, 16px),
164
+ 'leading-video-leading-space': if($exclude-hardcoded-values, null, 0px),
151
165
  // Commented out until the comments in the spreadsheet linked above are
152
166
  // resolved regarding vertical alignment.
153
- // 'list-item-leading-item-top-space': if($exclude-hardcoded-values, null, 8px),
154
- // 'list-item-leading-video-top-space': if($exclude-hardcoded-values, null, 0px),
155
- // 'list-item-leading-item-bottom-space': if($exclude-hardcoded-values, null, 8px),
156
- // 'list-item-leading-video-bottom-space': if($exclude-hardcoded-values, null, 0px),
157
- 'list-item-trailing-element-headline-trailing-element-space': 16px,
158
- 'list-item-trailing-space': if($exclude-hardcoded-values, null, 24px),
167
+ // 'leading-item-top-space': if($exclude-hardcoded-values, null, 8px),
168
+ // 'leading-video-top-space': if($exclude-hardcoded-values, null, 0px),
169
+ // 'leading-item-bottom-space': if($exclude-hardcoded-values, null, 8px),
170
+ // 'leading-video-bottom-space': if($exclude-hardcoded-values, null, 0px),
171
+ 'trailing-element-headline-trailing-element-space': 16px,
172
+ 'trailing-space': if($exclude-hardcoded-values, null, 24px),
159
173
  // go/keep-sorted end
160
174
  );
161
175
  }
@@ -18,8 +18,8 @@
18
18
 
19
19
  $supported-tokens: (
20
20
  // go/keep-sorted start
21
- 'list-item-container-color',
22
- 'list-item-selected-container-color',
21
+ 'container-color',
22
+ 'selected-container-color',
23
23
  // go/keep-sorted end
24
24
  );
25
25
 
@@ -43,7 +43,7 @@ $_default: (
43
43
  $supported-tokens: $supported-tokens,
44
44
  $unsupported-tokens: $unsupported-tokens,
45
45
  $renamed-tokens: (
46
- 'container-color': 'list-item-container-color',
46
+ 'list-item-selected-container-color': 'selected-container-color',
47
47
  )
48
48
  );
49
49
 
@@ -35,6 +35,7 @@ $supported-tokens: (
35
35
  'icon-size',
36
36
  'label-text-color',
37
37
  'label-text-type',
38
+ 'leading-space',
38
39
  'outline-color',
39
40
  'outline-width',
40
41
  'pressed-icon-color',
@@ -42,12 +43,11 @@ $supported-tokens: (
42
43
  'pressed-outline-color',
43
44
  'pressed-state-layer-color',
44
45
  'pressed-state-layer-opacity',
45
- 'spacing-leading',
46
- 'spacing-trailing',
47
- 'with-icon-spacing-leading',
48
- 'with-icon-spacing-trailing',
49
- 'with-trailing-icon-spacing-leading',
50
- 'with-trailing-icon-spacing-trailing',
46
+ 'trailing-space',
47
+ 'with-leading-icon-leading-space',
48
+ 'with-leading-icon-trailing-space',
49
+ 'with-trailing-icon-leading-space',
50
+ 'with-trailing-icon-trailing-space',
51
51
  // go/keep-sorted end
52
52
  );
53
53
 
@@ -80,13 +80,15 @@ $_default: (
80
80
  $new-tokens: (
81
81
  // TODO(b/198759625): Remove once spacing tokens are formally added
82
82
  // go/keep-sorted start
83
- 'spacing-leading': if($exclude-hardcoded-values, null, 24px),
84
- 'spacing-trailing': if($exclude-hardcoded-values, null, 24px),
85
- 'with-icon-spacing-leading': if($exclude-hardcoded-values, null, 16px),
86
- 'with-icon-spacing-trailing': if($exclude-hardcoded-values, null, 24px),
87
- 'with-trailing-icon-spacing-leading':
83
+ 'leading-space': if($exclude-hardcoded-values, null, 24px),
84
+ 'trailing-space': if($exclude-hardcoded-values, null, 24px),
85
+ 'with-leading-icon-leading-space':
86
+ if($exclude-hardcoded-values, null, 16px),
87
+ 'with-leading-icon-trailing-space':
88
+ if($exclude-hardcoded-values, null, 24px),
89
+ 'with-trailing-icon-leading-space':
88
90
  if($exclude-hardcoded-values, null, 24px),
89
- 'with-trailing-icon-spacing-trailing':
91
+ 'with-trailing-icon-trailing-space':
90
92
  if($exclude-hardcoded-values, null, 16px),
91
93
  // go/keep-sorted end
92
94
  ),
@@ -166,7 +166,8 @@ $_default: (
166
166
  'focus-leading-content-color':
167
167
  map.get($text-field, 'focus-leading-icon-color'),
168
168
  'focus-outline-color': map.get($text-field, 'focus-outline-color'),
169
- 'focus-outline-width': map.get($text-field, 'focus-outline-width'),
169
+ // TODO(b/259455114): remove when focus tokens update to 3px
170
+ 'focus-outline-width': if($exclude-hardcoded-values, null, 3px),
170
171
  'focus-supporting-text-color':
171
172
  map.get($text-field, 'focus-supporting-text-color'),
172
173
  'focus-trailing-content-color':