@angular/material 18.1.1 → 18.1.3

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 (508) hide show
  1. package/button/_button-base.scss +5 -11
  2. package/checkbox/_checkbox-common.scss +9 -11
  3. package/chips/index.d.ts +3 -8
  4. package/core/_core.scss +15 -18
  5. package/core/m2/_typography.scss +129 -2
  6. package/core/ripple/_ripple.scss +1 -1
  7. package/core/style/_elevation.scss +116 -27
  8. package/core/theming/_definition.scss +2 -0
  9. package/core/tokens/_m3-tokens.scss +17 -15
  10. package/core/tokens/_token-definition.scss +266 -0
  11. package/core/tokens/_token-utils.scss +7 -202
  12. package/core/tokens/m2/mat/_app.scss +4 -4
  13. package/core/tokens/m2/mat/_autocomplete.scss +4 -4
  14. package/core/tokens/m2/mat/_badge.scss +4 -4
  15. package/core/tokens/m2/mat/_bottom-sheet.scss +4 -4
  16. package/core/tokens/m2/mat/_card.scss +4 -4
  17. package/core/tokens/m2/mat/_checkbox.scss +4 -4
  18. package/core/tokens/m2/mat/_chip.scss +4 -4
  19. package/core/tokens/m2/mat/_datepicker.scss +4 -4
  20. package/core/tokens/m2/mat/_dialog.scss +4 -4
  21. package/core/tokens/m2/mat/_divider.scss +4 -4
  22. package/core/tokens/m2/mat/_expansion.scss +4 -4
  23. package/core/tokens/m2/mat/_fab-small.scss +7 -7
  24. package/core/tokens/m2/mat/_fab.scss +7 -7
  25. package/core/tokens/m2/mat/_filled-button.scss +7 -7
  26. package/core/tokens/m2/mat/_form-field.scss +4 -6
  27. package/core/tokens/m2/mat/_full-pseudo-checkbox.scss +4 -4
  28. package/core/tokens/m2/mat/_grid-list.scss +4 -4
  29. package/core/tokens/m2/mat/_icon-button.scss +4 -4
  30. package/core/tokens/m2/mat/_icon.scss +4 -4
  31. package/core/tokens/m2/mat/_legacy-button-toggle.scss +4 -4
  32. package/core/tokens/m2/mat/_list.scss +4 -4
  33. package/core/tokens/m2/mat/_menu.scss +4 -4
  34. package/core/tokens/m2/mat/_minimal-pseudo-checkbox.scss +4 -4
  35. package/core/tokens/m2/mat/_optgroup.scss +4 -4
  36. package/core/tokens/m2/mat/_option.scss +4 -4
  37. package/core/tokens/m2/mat/_outlined-button.scss +4 -4
  38. package/core/tokens/m2/mat/_paginator.scss +4 -4
  39. package/core/tokens/m2/mat/_protected-button.scss +7 -7
  40. package/core/tokens/m2/mat/_radio.scss +4 -4
  41. package/core/tokens/m2/mat/_ripple.scss +4 -4
  42. package/core/tokens/m2/mat/_select.scss +7 -7
  43. package/core/tokens/m2/mat/_sidenav.scss +4 -4
  44. package/core/tokens/m2/mat/_slider.scss +4 -4
  45. package/core/tokens/m2/mat/_snack-bar.scss +4 -4
  46. package/core/tokens/m2/mat/_sort.scss +4 -4
  47. package/core/tokens/m2/mat/_standard-button-toggle.scss +4 -4
  48. package/core/tokens/m2/mat/_stepper.scss +4 -4
  49. package/core/tokens/m2/mat/_switch.scss +4 -4
  50. package/core/tokens/m2/mat/_tab-header-with-background.scss +4 -4
  51. package/core/tokens/m2/mat/_tab-header.scss +4 -4
  52. package/core/tokens/m2/mat/_table.scss +4 -4
  53. package/core/tokens/m2/mat/_text-button.scss +4 -4
  54. package/core/tokens/m2/mat/_toolbar.scss +4 -4
  55. package/core/tokens/m2/mat/_tree.scss +4 -4
  56. package/core/tokens/m2/mdc/_checkbox.scss +6 -7
  57. package/core/tokens/m2/mdc/_chip.scss +4 -4
  58. package/core/tokens/m2/mdc/_circular-progress.scss +4 -4
  59. package/core/tokens/m2/mdc/_dialog.scss +5 -5
  60. package/core/tokens/m2/mdc/_elevated-card.scss +4 -4
  61. package/core/tokens/m2/mdc/_extended-fab.scss +4 -4
  62. package/core/tokens/m2/mdc/_fab-small.scss +4 -4
  63. package/core/tokens/m2/mdc/_fab.scss +4 -4
  64. package/core/tokens/m2/mdc/_filled-button.scss +6 -7
  65. package/core/tokens/m2/mdc/_filled-text-field.scss +7 -7
  66. package/core/tokens/m2/mdc/_icon-button.scss +4 -4
  67. package/core/tokens/m2/mdc/_linear-progress.scss +4 -4
  68. package/core/tokens/m2/mdc/_list.scss +4 -4
  69. package/core/tokens/m2/mdc/_outlined-button.scss +5 -5
  70. package/core/tokens/m2/mdc/_outlined-card.scss +4 -4
  71. package/core/tokens/m2/mdc/_outlined-text-field.scss +7 -7
  72. package/core/tokens/m2/mdc/_plain-tooltip.scss +4 -4
  73. package/core/tokens/m2/mdc/_protected-button.scss +6 -7
  74. package/core/tokens/m2/mdc/_radio.scss +4 -4
  75. package/core/tokens/m2/mdc/_secondary-navigation-tab.scss +4 -4
  76. package/core/tokens/m2/mdc/_slider.scss +4 -4
  77. package/core/tokens/m2/mdc/_snack-bar.scss +4 -4
  78. package/core/tokens/m2/mdc/_switch.scss +4 -4
  79. package/core/tokens/m2/mdc/_tab-indicator.scss +4 -4
  80. package/core/tokens/m2/mdc/_text-button.scss +4 -4
  81. package/core/tokens/m3/definitions/_index.scss +94 -0
  82. package/core/tokens/m3/definitions/_md-comp-checkbox.scss +120 -0
  83. package/core/tokens/m3/definitions/_md-comp-circular-progress-indicator.scss +27 -0
  84. package/core/tokens/m3/definitions/_md-comp-data-table.scss +90 -0
  85. package/core/tokens/m3/definitions/_md-comp-dialog.scss +123 -0
  86. package/core/tokens/m3/definitions/_md-comp-elevated-button.scss +87 -0
  87. package/core/tokens/m3/definitions/_md-comp-elevated-card.scss +53 -0
  88. package/core/tokens/m3/definitions/_md-comp-extended-fab-primary.scss +90 -0
  89. package/core/tokens/m3/definitions/_md-comp-extended-fab-secondary.scss +91 -0
  90. package/core/tokens/m3/definitions/_md-comp-extended-fab-tertiary.scss +91 -0
  91. package/core/tokens/m3/definitions/_md-comp-fab-primary-small.scss +59 -0
  92. package/core/tokens/m3/definitions/_md-comp-fab-primary.scss +59 -0
  93. package/core/tokens/m3/definitions/_md-comp-fab-secondary-small.scss +60 -0
  94. package/core/tokens/m3/definitions/_md-comp-fab-secondary.scss +60 -0
  95. package/core/tokens/m3/definitions/_md-comp-fab-tertiary-small.scss +60 -0
  96. package/core/tokens/m3/definitions/_md-comp-fab-tertiary.scss +60 -0
  97. package/core/tokens/m3/definitions/_md-comp-filled-button.scss +85 -0
  98. package/core/tokens/m3/definitions/_md-comp-filled-card.scss +52 -0
  99. package/core/tokens/m3/definitions/_md-comp-filled-icon-button.scss +73 -0
  100. package/core/tokens/m3/definitions/_md-comp-filled-text-field.scss +189 -0
  101. package/core/tokens/m3/definitions/_md-comp-icon-button.scss +64 -0
  102. package/core/tokens/m3/definitions/_md-comp-linear-progress-indicator.scss +29 -0
  103. package/core/tokens/m3/definitions/_md-comp-list.scss +252 -0
  104. package/core/tokens/m3/definitions/_md-comp-outlined-button.scss +80 -0
  105. package/core/tokens/m3/definitions/_md-comp-outlined-card.scss +59 -0
  106. package/core/tokens/m3/definitions/_md-comp-outlined-icon-button.scss +73 -0
  107. package/core/tokens/m3/definitions/_md-comp-outlined-text-field.scss +171 -0
  108. package/core/tokens/m3/definitions/_md-comp-plain-tooltip.scss +51 -0
  109. package/core/tokens/m3/definitions/_md-comp-radio-button.scss +62 -0
  110. package/core/tokens/m3/definitions/_md-comp-secondary-navigation-tab.scss +80 -0
  111. package/core/tokens/m3/definitions/_md-comp-slider.scss +110 -0
  112. package/core/tokens/m3/definitions/_md-comp-snackbar.scss +125 -0
  113. package/core/tokens/m3/definitions/_md-comp-switch.scss +130 -0
  114. package/core/tokens/m3/definitions/_md-comp-text-button.scss +73 -0
  115. package/core/tokens/m3/definitions/_md-ref-palette.scss +100 -0
  116. package/core/tokens/m3/definitions/_md-ref-typeface.scss +14 -0
  117. package/core/tokens/m3/definitions/_md-sys-color.scss +126 -0
  118. package/core/tokens/m3/definitions/_md-sys-elevation.scss +15 -0
  119. package/core/tokens/m3/definitions/_md-sys-motion.scss +46 -0
  120. package/core/tokens/m3/definitions/_md-sys-shape.scss +24 -0
  121. package/core/tokens/m3/definitions/_md-sys-state.scss +13 -0
  122. package/core/tokens/m3/definitions/_md-sys-typescale.scss +308 -0
  123. package/core/tokens/m3/definitions/unused/_md-comp-assist-chip.scss +105 -0
  124. package/core/tokens/m3/definitions/unused/_md-comp-badge.scss +54 -0
  125. package/core/tokens/m3/definitions/unused/_md-comp-banner.scss +71 -0
  126. package/core/tokens/m3/definitions/unused/_md-comp-bottom-app-bar.scss +29 -0
  127. package/core/tokens/m3/definitions/unused/_md-comp-carousel-item.scss +59 -0
  128. package/core/tokens/m3/definitions/unused/_md-comp-date-input-modal.scss +87 -0
  129. package/core/tokens/m3/definitions/unused/_md-comp-date-picker-docked.scss +248 -0
  130. package/core/tokens/m3/definitions/unused/_md-comp-date-picker-modal.scss +313 -0
  131. package/core/tokens/m3/definitions/unused/_md-comp-divider.scss +19 -0
  132. package/core/tokens/m3/definitions/unused/_md-comp-extended-fab-branded.scss +82 -0
  133. package/core/tokens/m3/definitions/unused/_md-comp-extended-fab-surface.scss +86 -0
  134. package/core/tokens/m3/definitions/unused/_md-comp-fab-branded-large.scss +54 -0
  135. package/core/tokens/m3/definitions/unused/_md-comp-fab-branded.scss +54 -0
  136. package/core/tokens/m3/definitions/unused/_md-comp-fab-primary-large.scss +59 -0
  137. package/core/tokens/m3/definitions/unused/_md-comp-fab-secondary-large.scss +60 -0
  138. package/core/tokens/m3/definitions/unused/_md-comp-fab-surface-large.scss +58 -0
  139. package/core/tokens/m3/definitions/unused/_md-comp-fab-surface-small.scss +58 -0
  140. package/core/tokens/m3/definitions/unused/_md-comp-fab-surface.scss +58 -0
  141. package/core/tokens/m3/definitions/unused/_md-comp-fab-tertiary-large.scss +60 -0
  142. package/core/tokens/m3/definitions/unused/_md-comp-filled-autocomplete.scss +269 -0
  143. package/core/tokens/m3/definitions/unused/_md-comp-filled-menu-button.scss +94 -0
  144. package/core/tokens/m3/definitions/unused/_md-comp-filled-select.scss +274 -0
  145. package/core/tokens/m3/definitions/unused/_md-comp-filled-tonal-button.scss +95 -0
  146. package/core/tokens/m3/definitions/unused/_md-comp-filled-tonal-icon-button.scss +80 -0
  147. package/core/tokens/m3/definitions/unused/_md-comp-filter-chip.scss +205 -0
  148. package/core/tokens/m3/definitions/unused/_md-comp-full-screen-dialog.scss +109 -0
  149. package/core/tokens/m3/definitions/unused/_md-comp-input-chip.scss +180 -0
  150. package/core/tokens/m3/definitions/unused/_md-comp-menu.scss +31 -0
  151. package/core/tokens/m3/definitions/unused/_md-comp-navigation-bar.scss +110 -0
  152. package/core/tokens/m3/definitions/unused/_md-comp-navigation-drawer.scss +162 -0
  153. package/core/tokens/m3/definitions/unused/_md-comp-navigation-rail.scss +127 -0
  154. package/core/tokens/m3/definitions/unused/_md-comp-outlined-autocomplete.scss +259 -0
  155. package/core/tokens/m3/definitions/unused/_md-comp-outlined-menu-button.scss +90 -0
  156. package/core/tokens/m3/definitions/unused/_md-comp-outlined-segmented-button.scss +108 -0
  157. package/core/tokens/m3/definitions/unused/_md-comp-outlined-select.scss +264 -0
  158. package/core/tokens/m3/definitions/unused/_md-comp-primary-navigation-tab.scss +117 -0
  159. package/core/tokens/m3/definitions/unused/_md-comp-rich-tooltip.scss +121 -0
  160. package/core/tokens/m3/definitions/unused/_md-comp-scrim.scss +19 -0
  161. package/core/tokens/m3/definitions/unused/_md-comp-search-bar.scss +97 -0
  162. package/core/tokens/m3/definitions/unused/_md-comp-search-view.scss +91 -0
  163. package/core/tokens/m3/definitions/unused/_md-comp-sheet-bottom.scss +39 -0
  164. package/core/tokens/m3/definitions/unused/_md-comp-sheet-floating.scss +28 -0
  165. package/core/tokens/m3/definitions/unused/_md-comp-sheet-side.scss +87 -0
  166. package/core/tokens/m3/definitions/unused/_md-comp-standard-menu-button.scss +94 -0
  167. package/core/tokens/m3/definitions/unused/_md-comp-suggestion-chip.scss +121 -0
  168. package/core/tokens/m3/definitions/unused/_md-comp-time-input.scss +222 -0
  169. package/core/tokens/m3/definitions/unused/_md-comp-time-picker.scss +268 -0
  170. package/core/tokens/m3/definitions/unused/_md-comp-top-app-bar-large.scss +59 -0
  171. package/core/tokens/m3/definitions/unused/_md-comp-top-app-bar-medium.scss +59 -0
  172. package/core/tokens/m3/definitions/unused/_md-comp-top-app-bar-small-centered.scss +62 -0
  173. package/core/tokens/m3/definitions/unused/_md-comp-top-app-bar-small.scss +60 -0
  174. package/core/tokens/m3/mat/_app.scss +2 -2
  175. package/core/tokens/m3/mat/_autocomplete.scss +3 -4
  176. package/core/tokens/m3/mat/_badge.scss +18 -18
  177. package/core/tokens/m3/mat/_bottom-sheet.scss +4 -4
  178. package/core/tokens/m3/mat/_card.scss +4 -4
  179. package/core/tokens/m3/mat/_checkbox.scss +2 -2
  180. package/core/tokens/m3/mat/_chip.scss +5 -5
  181. package/core/tokens/m3/mat/_datepicker.scss +7 -7
  182. package/core/tokens/m3/mat/_dialog.scss +12 -11
  183. package/core/tokens/m3/mat/_divider.scss +3 -3
  184. package/core/tokens/m3/mat/_expansion.scss +7 -7
  185. package/core/tokens/m3/mat/_fab-small.scss +2 -2
  186. package/core/tokens/m3/mat/_fab.scss +2 -2
  187. package/core/tokens/m3/mat/_filled-button.scss +5 -5
  188. package/core/tokens/m3/mat/_form-field.scss +5 -5
  189. package/core/tokens/m3/mat/_full-pseudo-checkbox.scss +2 -2
  190. package/core/tokens/m3/mat/_grid-list.scss +2 -2
  191. package/core/tokens/m3/mat/_icon-button.scss +2 -2
  192. package/core/tokens/m3/mat/_icon.scss +3 -3
  193. package/core/tokens/m3/mat/_list.scss +2 -2
  194. package/core/tokens/m3/mat/_menu.scss +12 -12
  195. package/core/tokens/m3/mat/_minimal-pseudo-checkbox.scss +2 -2
  196. package/core/tokens/m3/mat/_optgroup.scss +3 -3
  197. package/core/tokens/m3/mat/_option.scss +2 -2
  198. package/core/tokens/m3/mat/_outlined-button.scss +5 -5
  199. package/core/tokens/m3/mat/_paginator.scss +3 -3
  200. package/core/tokens/m3/mat/_protected-button.scss +5 -5
  201. package/core/tokens/m3/mat/_radio.scss +2 -2
  202. package/core/tokens/m3/mat/_ripple.scss +2 -2
  203. package/core/tokens/m3/mat/_select.scss +4 -4
  204. package/core/tokens/m3/mat/_sidenav.scss +6 -5
  205. package/core/tokens/m3/mat/_slider.scss +12 -10
  206. package/core/tokens/m3/mat/_snack-bar.scss +2 -2
  207. package/core/tokens/m3/mat/_sort.scss +2 -2
  208. package/core/tokens/m3/mat/_standard-button-toggle.scss +6 -5
  209. package/core/tokens/m3/mat/_stepper.scss +3 -3
  210. package/core/tokens/m3/mat/_switch.scss +27 -22
  211. package/core/tokens/m3/mat/_tab-header.scss +4 -4
  212. package/core/tokens/m3/mat/_table.scss +7 -6
  213. package/core/tokens/m3/mat/_text-button.scss +6 -6
  214. package/core/tokens/m3/mat/_toolbar.scss +3 -3
  215. package/core/tokens/m3/mat/_tree.scss +2 -2
  216. package/core/tokens/m3/mdc/_checkbox.scss +10 -8
  217. package/core/tokens/m3/mdc/_chip.scss +12 -11
  218. package/core/tokens/m3/mdc/_circular-progress.scss +5 -4
  219. package/core/tokens/m3/mdc/_dialog.scss +4 -4
  220. package/core/tokens/m3/mdc/_elevated-card.scss +3 -3
  221. package/core/tokens/m3/mdc/_extended-fab.scss +9 -5
  222. package/core/tokens/m3/mdc/_fab-small.scss +8 -5
  223. package/core/tokens/m3/mdc/_fab.scss +6 -5
  224. package/core/tokens/m3/mdc/_filled-button.scss +6 -6
  225. package/core/tokens/m3/mdc/_filled-text-field.scss +7 -6
  226. package/core/tokens/m3/mdc/_icon-button.scss +10 -8
  227. package/core/tokens/m3/mdc/_linear-progress.scss +5 -4
  228. package/core/tokens/m3/mdc/_list.scss +3 -3
  229. package/core/tokens/m3/mdc/_outlined-button.scss +7 -6
  230. package/core/tokens/m3/mdc/_outlined-card.scss +3 -3
  231. package/core/tokens/m3/mdc/_outlined-text-field.scss +7 -6
  232. package/core/tokens/m3/mdc/_plain-tooltip.scss +3 -3
  233. package/core/tokens/m3/mdc/_protected-button.scss +6 -6
  234. package/core/tokens/m3/mdc/_radio.scss +4 -3
  235. package/core/tokens/m3/mdc/_secondary-navigation-tab.scss +4 -3
  236. package/core/tokens/m3/mdc/_slider.scss +4 -3
  237. package/core/tokens/m3/mdc/_snack-bar.scss +3 -3
  238. package/core/tokens/m3/mdc/_switch.scss +4 -3
  239. package/core/tokens/m3/mdc/_tab-indicator.scss +5 -4
  240. package/core/tokens/m3/mdc/_text-button.scss +6 -6
  241. package/esm2022/autocomplete/animations.mjs +1 -2
  242. package/esm2022/autocomplete/autocomplete-origin.mjs +4 -4
  243. package/esm2022/autocomplete/autocomplete-trigger.mjs +4 -4
  244. package/esm2022/autocomplete/autocomplete.mjs +4 -4
  245. package/esm2022/autocomplete/module.mjs +5 -5
  246. package/esm2022/badge/badge-module.mjs +5 -5
  247. package/esm2022/badge/badge.mjs +7 -7
  248. package/esm2022/bottom-sheet/bottom-sheet-container.mjs +4 -4
  249. package/esm2022/bottom-sheet/bottom-sheet-module.mjs +5 -5
  250. package/esm2022/bottom-sheet/bottom-sheet.mjs +4 -4
  251. package/esm2022/button/button-base.mjs +7 -7
  252. package/esm2022/button/button.mjs +7 -7
  253. package/esm2022/button/fab.mjs +13 -13
  254. package/esm2022/button/icon-button.mjs +7 -7
  255. package/esm2022/button/module.mjs +5 -5
  256. package/esm2022/button-toggle/button-toggle-module.mjs +5 -5
  257. package/esm2022/button-toggle/button-toggle.mjs +8 -8
  258. package/esm2022/card/card.mjs +43 -43
  259. package/esm2022/card/module.mjs +5 -5
  260. package/esm2022/checkbox/checkbox-required-validator.mjs +4 -4
  261. package/esm2022/checkbox/checkbox.mjs +4 -4
  262. package/esm2022/checkbox/module.mjs +9 -9
  263. package/esm2022/chips/chip-action.mjs +4 -4
  264. package/esm2022/chips/chip-edit-input.mjs +4 -4
  265. package/esm2022/chips/chip-grid.mjs +4 -4
  266. package/esm2022/chips/chip-icons.mjs +10 -10
  267. package/esm2022/chips/chip-input.mjs +4 -4
  268. package/esm2022/chips/chip-listbox.mjs +4 -4
  269. package/esm2022/chips/chip-option.mjs +6 -6
  270. package/esm2022/chips/chip-row.mjs +7 -7
  271. package/esm2022/chips/chip-set.mjs +4 -4
  272. package/esm2022/chips/chip.mjs +6 -27
  273. package/esm2022/chips/module.mjs +5 -5
  274. package/esm2022/core/common-behaviors/common-module.mjs +5 -5
  275. package/esm2022/core/datetime/index.mjs +9 -9
  276. package/esm2022/core/datetime/native-date-adapter.mjs +4 -4
  277. package/esm2022/core/error/error-options.mjs +7 -7
  278. package/esm2022/core/internal-form-field/internal-form-field.mjs +4 -4
  279. package/esm2022/core/line/line.mjs +8 -8
  280. package/esm2022/core/option/index.mjs +5 -5
  281. package/esm2022/core/option/optgroup.mjs +4 -4
  282. package/esm2022/core/option/option.mjs +4 -4
  283. package/esm2022/core/private/ripple-loader.mjs +4 -4
  284. package/esm2022/core/ripple/index.mjs +5 -5
  285. package/esm2022/core/ripple/ripple.mjs +4 -4
  286. package/esm2022/core/selection/pseudo-checkbox/pseudo-checkbox-module.mjs +5 -5
  287. package/esm2022/core/selection/pseudo-checkbox/pseudo-checkbox.mjs +4 -4
  288. package/esm2022/core/version.mjs +1 -1
  289. package/esm2022/datepicker/calendar-body.mjs +4 -4
  290. package/esm2022/datepicker/calendar.mjs +7 -7
  291. package/esm2022/datepicker/date-range-input-parts.mjs +10 -10
  292. package/esm2022/datepicker/date-range-input.mjs +4 -4
  293. package/esm2022/datepicker/date-range-picker.mjs +4 -4
  294. package/esm2022/datepicker/date-range-selection-strategy.mjs +4 -4
  295. package/esm2022/datepicker/date-selection-model.mjs +10 -10
  296. package/esm2022/datepicker/datepicker-actions.mjs +10 -10
  297. package/esm2022/datepicker/datepicker-base.mjs +7 -7
  298. package/esm2022/datepicker/datepicker-input-base.mjs +4 -4
  299. package/esm2022/datepicker/datepicker-input.mjs +4 -4
  300. package/esm2022/datepicker/datepicker-intl.mjs +4 -4
  301. package/esm2022/datepicker/datepicker-module.mjs +5 -5
  302. package/esm2022/datepicker/datepicker-toggle.mjs +7 -7
  303. package/esm2022/datepicker/datepicker.mjs +4 -4
  304. package/esm2022/datepicker/month-view.mjs +4 -4
  305. package/esm2022/datepicker/multi-year-view.mjs +4 -4
  306. package/esm2022/datepicker/year-view.mjs +4 -4
  307. package/esm2022/dialog/dialog-container.mjs +5 -8
  308. package/esm2022/dialog/dialog-content-directives.mjs +16 -16
  309. package/esm2022/dialog/dialog.mjs +4 -4
  310. package/esm2022/dialog/module.mjs +5 -5
  311. package/esm2022/divider/divider-module.mjs +5 -5
  312. package/esm2022/divider/divider.mjs +4 -4
  313. package/esm2022/expansion/accordion.mjs +4 -4
  314. package/esm2022/expansion/expansion-module.mjs +5 -5
  315. package/esm2022/expansion/expansion-panel-content.mjs +4 -4
  316. package/esm2022/expansion/expansion-panel-header.mjs +10 -10
  317. package/esm2022/expansion/expansion-panel.mjs +7 -7
  318. package/esm2022/form-field/directives/error.mjs +4 -4
  319. package/esm2022/form-field/directives/floating-label.mjs +4 -4
  320. package/esm2022/form-field/directives/hint.mjs +4 -4
  321. package/esm2022/form-field/directives/label.mjs +4 -4
  322. package/esm2022/form-field/directives/line-ripple.mjs +4 -4
  323. package/esm2022/form-field/directives/notched-outline.mjs +4 -4
  324. package/esm2022/form-field/directives/prefix.mjs +4 -4
  325. package/esm2022/form-field/directives/suffix.mjs +4 -4
  326. package/esm2022/form-field/form-field-control.mjs +4 -4
  327. package/esm2022/form-field/form-field.mjs +7 -4
  328. package/esm2022/form-field/module.mjs +5 -5
  329. package/esm2022/grid-list/grid-list-module.mjs +5 -5
  330. package/esm2022/grid-list/grid-list.mjs +4 -4
  331. package/esm2022/grid-list/grid-tile.mjs +16 -16
  332. package/esm2022/icon/icon-module.mjs +5 -5
  333. package/esm2022/icon/icon-registry.mjs +4 -4
  334. package/esm2022/icon/icon.mjs +4 -4
  335. package/esm2022/icon/testing/fake-icon-registry.mjs +8 -8
  336. package/esm2022/input/input.mjs +39 -6
  337. package/esm2022/input/module.mjs +5 -5
  338. package/esm2022/list/action-list.mjs +4 -4
  339. package/esm2022/list/list-base.mjs +7 -7
  340. package/esm2022/list/list-item-sections.mjs +19 -19
  341. package/esm2022/list/list-module.mjs +5 -5
  342. package/esm2022/list/list-option.mjs +4 -4
  343. package/esm2022/list/list.mjs +7 -7
  344. package/esm2022/list/nav-list.mjs +4 -4
  345. package/esm2022/list/selection-list.mjs +4 -4
  346. package/esm2022/list/subheader.mjs +4 -4
  347. package/esm2022/list/testing/selection-list-harness.mjs +2 -2
  348. package/esm2022/menu/menu-content.mjs +4 -4
  349. package/esm2022/menu/menu-item.mjs +4 -4
  350. package/esm2022/menu/menu-trigger.mjs +4 -4
  351. package/esm2022/menu/menu.mjs +4 -4
  352. package/esm2022/menu/module.mjs +5 -5
  353. package/esm2022/paginator/module.mjs +5 -5
  354. package/esm2022/paginator/paginator-intl.mjs +4 -4
  355. package/esm2022/paginator/paginator.mjs +4 -4
  356. package/esm2022/progress-bar/module.mjs +5 -5
  357. package/esm2022/progress-bar/progress-bar.mjs +4 -4
  358. package/esm2022/progress-spinner/module.mjs +5 -5
  359. package/esm2022/progress-spinner/progress-spinner.mjs +4 -4
  360. package/esm2022/radio/module.mjs +5 -5
  361. package/esm2022/radio/radio.mjs +7 -7
  362. package/esm2022/select/module.mjs +5 -5
  363. package/esm2022/select/select.mjs +7 -7
  364. package/esm2022/sidenav/drawer.mjs +10 -10
  365. package/esm2022/sidenav/sidenav-module.mjs +5 -5
  366. package/esm2022/sidenav/sidenav.mjs +10 -10
  367. package/esm2022/slide-toggle/module.mjs +9 -9
  368. package/esm2022/slide-toggle/slide-toggle-required-validator.mjs +4 -4
  369. package/esm2022/slide-toggle/slide-toggle.mjs +6 -6
  370. package/esm2022/slider/module.mjs +5 -5
  371. package/esm2022/slider/slider-input.mjs +7 -7
  372. package/esm2022/slider/slider-thumb.mjs +4 -4
  373. package/esm2022/slider/slider.mjs +4 -4
  374. package/esm2022/snack-bar/module.mjs +5 -5
  375. package/esm2022/snack-bar/simple-snack-bar.mjs +4 -4
  376. package/esm2022/snack-bar/snack-bar-container.mjs +4 -4
  377. package/esm2022/snack-bar/snack-bar-content.mjs +10 -10
  378. package/esm2022/snack-bar/snack-bar.mjs +4 -4
  379. package/esm2022/sort/sort-header-intl.mjs +4 -4
  380. package/esm2022/sort/sort-header.mjs +4 -4
  381. package/esm2022/sort/sort-module.mjs +5 -5
  382. package/esm2022/sort/sort.mjs +4 -4
  383. package/esm2022/stepper/step-content.mjs +4 -4
  384. package/esm2022/stepper/step-header.mjs +4 -4
  385. package/esm2022/stepper/step-label.mjs +4 -4
  386. package/esm2022/stepper/stepper-button.mjs +7 -7
  387. package/esm2022/stepper/stepper-icon.mjs +4 -4
  388. package/esm2022/stepper/stepper-intl.mjs +4 -4
  389. package/esm2022/stepper/stepper-module.mjs +5 -5
  390. package/esm2022/stepper/stepper.mjs +7 -7
  391. package/esm2022/table/cell.mjs +22 -22
  392. package/esm2022/table/module.mjs +5 -5
  393. package/esm2022/table/row.mjs +22 -22
  394. package/esm2022/table/table.mjs +7 -7
  395. package/esm2022/table/text-column.mjs +4 -4
  396. package/esm2022/tabs/ink-bar.mjs +4 -4
  397. package/esm2022/tabs/module.mjs +5 -5
  398. package/esm2022/tabs/paginated-tab-header.mjs +4 -4
  399. package/esm2022/tabs/tab-body.mjs +7 -7
  400. package/esm2022/tabs/tab-content.mjs +4 -4
  401. package/esm2022/tabs/tab-group.mjs +4 -4
  402. package/esm2022/tabs/tab-header.mjs +4 -4
  403. package/esm2022/tabs/tab-label-wrapper.mjs +4 -4
  404. package/esm2022/tabs/tab-label.mjs +4 -4
  405. package/esm2022/tabs/tab-nav-bar/tab-nav-bar.mjs +10 -10
  406. package/esm2022/tabs/tab.mjs +4 -4
  407. package/esm2022/tabs/testing/tab-harness.mjs +2 -2
  408. package/esm2022/toolbar/toolbar-module.mjs +5 -5
  409. package/esm2022/toolbar/toolbar.mjs +7 -7
  410. package/esm2022/tooltip/module.mjs +5 -5
  411. package/esm2022/tooltip/tooltip.mjs +7 -7
  412. package/esm2022/tree/node.mjs +10 -10
  413. package/esm2022/tree/outlet.mjs +4 -4
  414. package/esm2022/tree/padding.mjs +4 -4
  415. package/esm2022/tree/toggle.mjs +4 -4
  416. package/esm2022/tree/tree-module.mjs +5 -5
  417. package/esm2022/tree/tree.mjs +4 -4
  418. package/fesm2022/autocomplete.mjs +13 -14
  419. package/fesm2022/autocomplete.mjs.map +1 -1
  420. package/fesm2022/badge.mjs +10 -10
  421. package/fesm2022/badge.mjs.map +1 -1
  422. package/fesm2022/bottom-sheet.mjs +10 -10
  423. package/fesm2022/bottom-sheet.mjs.map +1 -1
  424. package/fesm2022/button-toggle.mjs +11 -11
  425. package/fesm2022/button-toggle.mjs.map +1 -1
  426. package/fesm2022/button.mjs +34 -34
  427. package/fesm2022/button.mjs.map +1 -1
  428. package/fesm2022/card.mjs +46 -46
  429. package/fesm2022/card.mjs.map +1 -1
  430. package/fesm2022/checkbox.mjs +14 -14
  431. package/fesm2022/checkbox.mjs.map +1 -1
  432. package/fesm2022/chips.mjs +47 -68
  433. package/fesm2022/chips.mjs.map +1 -1
  434. package/fesm2022/core.mjs +59 -59
  435. package/fesm2022/core.mjs.map +1 -1
  436. package/fesm2022/datepicker.mjs +82 -82
  437. package/fesm2022/datepicker.mjs.map +1 -1
  438. package/fesm2022/dialog.mjs +26 -29
  439. package/fesm2022/dialog.mjs.map +1 -1
  440. package/fesm2022/divider.mjs +7 -7
  441. package/fesm2022/divider.mjs.map +1 -1
  442. package/fesm2022/expansion.mjs +25 -25
  443. package/fesm2022/expansion.mjs.map +1 -1
  444. package/fesm2022/form-field.mjs +37 -34
  445. package/fesm2022/form-field.mjs.map +1 -1
  446. package/fesm2022/grid-list.mjs +22 -22
  447. package/fesm2022/grid-list.mjs.map +1 -1
  448. package/fesm2022/icon/testing.mjs +7 -7
  449. package/fesm2022/icon/testing.mjs.map +1 -1
  450. package/fesm2022/icon.mjs +10 -10
  451. package/fesm2022/icon.mjs.map +1 -1
  452. package/fesm2022/input.mjs +42 -9
  453. package/fesm2022/input.mjs.map +1 -1
  454. package/fesm2022/list/testing.mjs +1 -1
  455. package/fesm2022/list/testing.mjs.map +1 -1
  456. package/fesm2022/list.mjs +49 -49
  457. package/fesm2022/list.mjs.map +1 -1
  458. package/fesm2022/menu.mjs +16 -16
  459. package/fesm2022/menu.mjs.map +1 -1
  460. package/fesm2022/paginator.mjs +10 -10
  461. package/fesm2022/paginator.mjs.map +1 -1
  462. package/fesm2022/progress-bar.mjs +7 -7
  463. package/fesm2022/progress-bar.mjs.map +1 -1
  464. package/fesm2022/progress-spinner.mjs +7 -7
  465. package/fesm2022/progress-spinner.mjs.map +1 -1
  466. package/fesm2022/radio.mjs +10 -10
  467. package/fesm2022/radio.mjs.map +1 -1
  468. package/fesm2022/select.mjs +10 -10
  469. package/fesm2022/select.mjs.map +1 -1
  470. package/fesm2022/sidenav.mjs +22 -22
  471. package/fesm2022/sidenav.mjs.map +1 -1
  472. package/fesm2022/slide-toggle.mjs +16 -16
  473. package/fesm2022/slide-toggle.mjs.map +1 -1
  474. package/fesm2022/slider.mjs +16 -16
  475. package/fesm2022/slider.mjs.map +1 -1
  476. package/fesm2022/snack-bar.mjs +22 -22
  477. package/fesm2022/snack-bar.mjs.map +1 -1
  478. package/fesm2022/sort.mjs +13 -13
  479. package/fesm2022/sort.mjs.map +1 -1
  480. package/fesm2022/stepper.mjs +31 -31
  481. package/fesm2022/stepper.mjs.map +1 -1
  482. package/fesm2022/table.mjs +55 -55
  483. package/fesm2022/table.mjs.map +1 -1
  484. package/fesm2022/tabs/testing.mjs +1 -1
  485. package/fesm2022/tabs/testing.mjs.map +1 -1
  486. package/fesm2022/tabs.mjs +43 -43
  487. package/fesm2022/tabs.mjs.map +1 -1
  488. package/fesm2022/toolbar.mjs +10 -10
  489. package/fesm2022/toolbar.mjs.map +1 -1
  490. package/fesm2022/tooltip.mjs +10 -10
  491. package/fesm2022/tooltip.mjs.map +1 -1
  492. package/fesm2022/tree.mjs +25 -25
  493. package/fesm2022/tree.mjs.map +1 -1
  494. package/form-field/_form-field-focus-overlay.scss +1 -1
  495. package/form-field/_mdc-text-field-density-overrides.scss +4 -4
  496. package/form-field/_mdc-text-field-structure.scss +6 -6
  497. package/input/index.d.ts +13 -1
  498. package/list/testing/index.d.ts +1 -1
  499. package/package.json +3 -51
  500. package/prebuilt-themes/azure-blue.css +1 -1
  501. package/prebuilt-themes/cyan-orange.css +1 -1
  502. package/prebuilt-themes/magenta-violet.css +1 -1
  503. package/prebuilt-themes/rose-red.css +1 -1
  504. package/radio/_radio-common.scss +5 -5
  505. package/schematics/ng-add/index.js +1 -1
  506. package/schematics/ng-add/index.mjs +1 -1
  507. package/tabs/testing/index.d.ts +1 -1
  508. package/core/mdc-helpers/_mdc-helpers.scss +0 -60
@@ -0,0 +1,222 @@
1
+ //
2
+ // Design system display name: Material 3
3
+ // Design system version: v0.161
4
+ //
5
+
6
+ @use 'sass:map';
7
+
8
+ @use './md-sys-color';
9
+
10
+ @use './md-sys-elevation';
11
+
12
+ @use './md-sys-shape';
13
+
14
+ @use './md-sys-state';
15
+
16
+ @use './md-sys-typescale';
17
+
18
+ $_default: (
19
+ 'md-sys-color': md-sys-color.values-light(),
20
+ 'md-sys-elevation': md-sys-elevation.values(),
21
+ 'md-sys-shape': md-sys-shape.values(),
22
+ 'md-sys-state': md-sys-state.values(),
23
+ 'md-sys-typescale': md-sys-typescale.values(),
24
+ );
25
+
26
+ @function values($deps: $_default, $exclude-hardcoded-values: false) {
27
+ @return (
28
+ 'container-color': map.get($deps, 'md-sys-color', 'surface'),
29
+ 'container-elevation': map.get($deps, 'md-sys-elevation', 'level3'),
30
+ 'container-shape': map.get($deps, 'md-sys-shape', 'corner-extra-large'),
31
+ 'headline-color': map.get($deps, 'md-sys-color', 'on-surface-variant'),
32
+ 'headline-font': map.get($deps, 'md-sys-typescale', 'label-medium-font'),
33
+ 'headline-line-height':
34
+ map.get($deps, 'md-sys-typescale', 'label-medium-line-height'),
35
+ 'headline-size': map.get($deps, 'md-sys-typescale', 'label-medium-size'),
36
+ 'headline-tracking':
37
+ map.get($deps, 'md-sys-typescale', 'label-medium-tracking'),
38
+ // Warning: risk of reduced fidelity from using this composite typography token.
39
+ // Tokens md.comp.time-input.headline.tracking cannot be represented in the "font" property
40
+ // shorthand. Consider using the discrete properties instead.
41
+ 'headline-type':
42
+ if(
43
+ $exclude-hardcoded-values,
44
+ null,
45
+ map.get($deps, 'md-sys-typescale', 'label-medium-weight')
46
+ map.get($deps, 'md-sys-typescale', 'label-medium-size') #{'/'} map.get(
47
+ $deps,
48
+ 'md-sys-typescale',
49
+ 'label-medium-line-height'
50
+ ) map.get($deps, 'md-sys-typescale', 'label-medium-font')
51
+ ),
52
+ 'headline-weight': map.get($deps, 'md-sys-typescale', 'label-medium-weight'),
53
+ 'period-selector-container-height':
54
+ if($exclude-hardcoded-values, null, 72px),
55
+ 'period-selector-container-shape':
56
+ map.get($deps, 'md-sys-shape', 'corner-small'),
57
+ 'period-selector-container-width': if($exclude-hardcoded-values, null, 52px),
58
+ 'period-selector-focus-state-layer-opacity':
59
+ map.get($deps, 'md-sys-state', 'focus-state-layer-opacity'),
60
+ 'period-selector-hover-state-layer-opacity':
61
+ map.get($deps, 'md-sys-state', 'hover-state-layer-opacity'),
62
+ 'period-selector-label-text-font':
63
+ map.get($deps, 'md-sys-typescale', 'title-medium-font'),
64
+ 'period-selector-label-text-line-height':
65
+ map.get($deps, 'md-sys-typescale', 'title-medium-line-height'),
66
+ 'period-selector-label-text-size':
67
+ map.get($deps, 'md-sys-typescale', 'title-medium-size'),
68
+ 'period-selector-label-text-tracking':
69
+ map.get($deps, 'md-sys-typescale', 'title-medium-tracking'),
70
+ // Warning: risk of reduced fidelity from using this composite typography token.
71
+ // Tokens md.comp.time-input.period-selector.label-text.tracking cannot be represented in
72
+ // the "font" property shorthand. Consider using the discrete properties instead.
73
+ 'period-selector-label-text-type':
74
+ if(
75
+ $exclude-hardcoded-values,
76
+ null,
77
+ map.get($deps, 'md-sys-typescale', 'title-medium-weight')
78
+ map.get($deps, 'md-sys-typescale', 'title-medium-size') #{'/'} map.get(
79
+ $deps,
80
+ 'md-sys-typescale',
81
+ 'title-medium-line-height'
82
+ ) map.get($deps, 'md-sys-typescale', 'title-medium-font')
83
+ ),
84
+ 'period-selector-label-text-weight':
85
+ map.get($deps, 'md-sys-typescale', 'title-medium-weight'),
86
+ 'period-selector-outline-color': map.get($deps, 'md-sys-color', 'outline'),
87
+ 'period-selector-outline-width': if($exclude-hardcoded-values, null, 1px),
88
+ 'period-selector-pressed-state-layer-opacity':
89
+ map.get($deps, 'md-sys-state', 'pressed-state-layer-opacity'),
90
+ 'period-selector-selected-container-color':
91
+ map.get($deps, 'md-sys-color', 'tertiary-container'),
92
+ 'period-selector-selected-focus-label-text-color':
93
+ map.get($deps, 'md-sys-color', 'on-tertiary-container'),
94
+ 'period-selector-selected-focus-state-layer-color':
95
+ map.get($deps, 'md-sys-color', 'on-tertiary-container'),
96
+ 'period-selector-selected-hover-label-text-color':
97
+ map.get($deps, 'md-sys-color', 'on-tertiary-container'),
98
+ 'period-selector-selected-hover-state-layer-color':
99
+ map.get($deps, 'md-sys-color', 'on-tertiary-container'),
100
+ 'period-selector-selected-label-text-color':
101
+ map.get($deps, 'md-sys-color', 'on-tertiary-container'),
102
+ 'period-selector-selected-pressed-label-text-color':
103
+ map.get($deps, 'md-sys-color', 'on-tertiary-container'),
104
+ 'period-selector-selected-pressed-state-layer-color':
105
+ map.get($deps, 'md-sys-color', 'on-tertiary-container'),
106
+ 'period-selector-unselected-focus-label-text-color':
107
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
108
+ 'period-selector-unselected-focus-state-layer-color':
109
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
110
+ 'period-selector-unselected-hover-label-text-color':
111
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
112
+ 'period-selector-unselected-hover-state-layer-color':
113
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
114
+ 'period-selector-unselected-label-text-color':
115
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
116
+ 'period-selector-unselected-pressed-label-text-color':
117
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
118
+ 'period-selector-unselected-pressed-state-layer-color':
119
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
120
+ 'surface-tint-layer-color': map.get($deps, 'md-sys-color', 'surface-tint'),
121
+ 'time-input-field-container-color':
122
+ map.get($deps, 'md-sys-color', 'surface-variant'),
123
+ 'time-input-field-container-height':
124
+ if($exclude-hardcoded-values, null, 72px),
125
+ 'time-input-field-container-shape':
126
+ map.get($deps, 'md-sys-shape', 'corner-small'),
127
+ 'time-input-field-container-width':
128
+ if($exclude-hardcoded-values, null, 96px),
129
+ 'time-input-field-focus-container-color':
130
+ map.get($deps, 'md-sys-color', 'primary-container'),
131
+ 'time-input-field-focus-label-text-color':
132
+ map.get($deps, 'md-sys-color', 'on-primary-container'),
133
+ 'time-input-field-focus-outline-color':
134
+ map.get($deps, 'md-sys-color', 'primary'),
135
+ 'time-input-field-focus-outline-width':
136
+ if($exclude-hardcoded-values, null, 2px),
137
+ 'time-input-field-hover-label-text-color':
138
+ map.get($deps, 'md-sys-color', 'on-surface'),
139
+ 'time-input-field-hover-state-layer-color':
140
+ map.get($deps, 'md-sys-color', 'on-surface'),
141
+ 'time-input-field-hover-state-layer-opacity':
142
+ map.get($deps, 'md-sys-state', 'hover-state-layer-opacity'),
143
+ 'time-input-field-label-text-color':
144
+ map.get($deps, 'md-sys-color', 'on-surface'),
145
+ 'time-input-field-label-text-font':
146
+ map.get($deps, 'md-sys-typescale', 'display-medium-font'),
147
+ 'time-input-field-label-text-line-height':
148
+ map.get($deps, 'md-sys-typescale', 'display-medium-line-height'),
149
+ 'time-input-field-label-text-size':
150
+ map.get($deps, 'md-sys-typescale', 'display-medium-size'),
151
+ 'time-input-field-label-text-tracking':
152
+ map.get($deps, 'md-sys-typescale', 'display-medium-tracking'),
153
+ // Warning: risk of reduced fidelity from using this composite typography token.
154
+ // Tokens md.comp.time-input.time-input-field.label-text.tracking cannot be represented
155
+ // in the "font" property shorthand. Consider using the discrete properties instead.
156
+ 'time-input-field-label-text-type':
157
+ if(
158
+ $exclude-hardcoded-values,
159
+ null,
160
+ map.get($deps, 'md-sys-typescale', 'display-medium-weight')
161
+ map.get($deps, 'md-sys-typescale', 'display-medium-size') #{'/'} map.get(
162
+ $deps,
163
+ 'md-sys-typescale',
164
+ 'display-medium-line-height'
165
+ ) map.get($deps, 'md-sys-typescale', 'display-medium-font')
166
+ ),
167
+ 'time-input-field-label-text-weight':
168
+ map.get($deps, 'md-sys-typescale', 'display-medium-weight'),
169
+ 'time-input-field-separator-color':
170
+ map.get($deps, 'md-sys-color', 'on-surface'),
171
+ 'time-input-field-separator-font':
172
+ map.get($deps, 'md-sys-typescale', 'display-large-font'),
173
+ 'time-input-field-separator-line-height':
174
+ map.get($deps, 'md-sys-typescale', 'display-large-line-height'),
175
+ 'time-input-field-separator-size':
176
+ map.get($deps, 'md-sys-typescale', 'display-large-size'),
177
+ 'time-input-field-separator-tracking':
178
+ map.get($deps, 'md-sys-typescale', 'display-large-tracking'),
179
+ // Warning: risk of reduced fidelity from using this composite typography token.
180
+ // Tokens md.comp.time-input.time-input-field.separator.tracking cannot be represented
181
+ // in the "font" property shorthand. Consider using the discrete properties instead.
182
+ 'time-input-field-separator-type':
183
+ if(
184
+ $exclude-hardcoded-values,
185
+ null,
186
+ map.get($deps, 'md-sys-typescale', 'display-large-weight')
187
+ map.get($deps, 'md-sys-typescale', 'display-large-size') #{'/'} map.get(
188
+ $deps,
189
+ 'md-sys-typescale',
190
+ 'display-large-line-height'
191
+ ) map.get($deps, 'md-sys-typescale', 'display-large-font')
192
+ ),
193
+ 'time-input-field-separator-weight':
194
+ map.get($deps, 'md-sys-typescale', 'display-large-weight'),
195
+ 'time-input-field-supporting-text-color':
196
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
197
+ 'time-input-field-supporting-text-font':
198
+ map.get($deps, 'md-sys-typescale', 'body-small-font'),
199
+ 'time-input-field-supporting-text-line-height':
200
+ map.get($deps, 'md-sys-typescale', 'body-small-line-height'),
201
+ 'time-input-field-supporting-text-size':
202
+ map.get($deps, 'md-sys-typescale', 'body-small-size'),
203
+ 'time-input-field-supporting-text-tracking':
204
+ map.get($deps, 'md-sys-typescale', 'body-small-tracking'),
205
+ // Warning: risk of reduced fidelity from using this composite typography token.
206
+ // Tokens md.comp.time-input.time-input-field.supporting-text.tracking cannot be represented
207
+ // in the "font" property shorthand. Consider using the discrete properties instead.
208
+ 'time-input-field-supporting-text-type':
209
+ if(
210
+ $exclude-hardcoded-values,
211
+ null,
212
+ map.get($deps, 'md-sys-typescale', 'body-small-weight')
213
+ map.get($deps, 'md-sys-typescale', 'body-small-size') #{'/'} map.get(
214
+ $deps,
215
+ 'md-sys-typescale',
216
+ 'body-small-line-height'
217
+ ) map.get($deps, 'md-sys-typescale', 'body-small-font')
218
+ ),
219
+ 'time-input-field-supporting-text-weight':
220
+ map.get($deps, 'md-sys-typescale', 'body-small-weight')
221
+ );
222
+ }
@@ -0,0 +1,268 @@
1
+ //
2
+ // Design system display name: Material 3
3
+ // Design system version: v0.161
4
+ //
5
+
6
+ @use 'sass:map';
7
+
8
+ @use './md-sys-color';
9
+
10
+ @use './md-sys-elevation';
11
+
12
+ @use './md-sys-shape';
13
+
14
+ @use './md-sys-state';
15
+
16
+ @use './md-sys-typescale';
17
+
18
+ $_default: (
19
+ 'md-sys-color': md-sys-color.values-light(),
20
+ 'md-sys-elevation': md-sys-elevation.values(),
21
+ 'md-sys-shape': md-sys-shape.values(),
22
+ 'md-sys-state': md-sys-state.values(),
23
+ 'md-sys-typescale': md-sys-typescale.values(),
24
+ );
25
+
26
+ @function values($deps: $_default, $exclude-hardcoded-values: false) {
27
+ @return (
28
+ 'clock-dial-color': map.get($deps, 'md-sys-color', 'surface-variant'),
29
+ 'clock-dial-container-size': if($exclude-hardcoded-values, null, 256px),
30
+ 'clock-dial-label-text-font':
31
+ map.get($deps, 'md-sys-typescale', 'body-large-font'),
32
+ 'clock-dial-label-text-line-height':
33
+ map.get($deps, 'md-sys-typescale', 'body-large-line-height'),
34
+ 'clock-dial-label-text-size':
35
+ map.get($deps, 'md-sys-typescale', 'body-large-size'),
36
+ 'clock-dial-label-text-tracking':
37
+ map.get($deps, 'md-sys-typescale', 'body-large-tracking'),
38
+ // Warning: risk of reduced fidelity from using this composite typography token.
39
+ // Tokens md.comp.time-picker.clock-dial.label-text.tracking cannot be represented in the
40
+ // "font" property shorthand. Consider using the discrete properties instead.
41
+ 'clock-dial-label-text-type':
42
+ if(
43
+ $exclude-hardcoded-values,
44
+ null,
45
+ map.get($deps, 'md-sys-typescale', 'body-large-weight')
46
+ map.get($deps, 'md-sys-typescale', 'body-large-size') #{'/'} map.get(
47
+ $deps,
48
+ 'md-sys-typescale',
49
+ 'body-large-line-height'
50
+ ) map.get($deps, 'md-sys-typescale', 'body-large-font')
51
+ ),
52
+ 'clock-dial-label-text-weight':
53
+ map.get($deps, 'md-sys-typescale', 'body-large-weight'),
54
+ 'clock-dial-selected-label-text-color':
55
+ map.get($deps, 'md-sys-color', 'on-primary'),
56
+ 'clock-dial-selector-center-container-color':
57
+ map.get($deps, 'md-sys-color', 'primary'),
58
+ 'clock-dial-selector-center-container-shape':
59
+ map.get($deps, 'md-sys-shape', 'corner-full'),
60
+ 'clock-dial-selector-center-container-size':
61
+ if($exclude-hardcoded-values, null, 8px),
62
+ 'clock-dial-selector-handle-container-color':
63
+ map.get($deps, 'md-sys-color', 'primary'),
64
+ 'clock-dial-selector-handle-container-shape':
65
+ map.get($deps, 'md-sys-shape', 'corner-full'),
66
+ 'clock-dial-selector-handle-container-size':
67
+ if($exclude-hardcoded-values, null, 48px),
68
+ 'clock-dial-selector-track-container-color':
69
+ map.get($deps, 'md-sys-color', 'primary'),
70
+ 'clock-dial-selector-track-container-width':
71
+ if($exclude-hardcoded-values, null, 2px),
72
+ 'clock-dial-shape': map.get($deps, 'md-sys-shape', 'corner-full'),
73
+ 'clock-dial-unselected-label-text-color':
74
+ map.get($deps, 'md-sys-color', 'on-surface'),
75
+ 'container-color': map.get($deps, 'md-sys-color', 'surface'),
76
+ 'container-elevation': map.get($deps, 'md-sys-elevation', 'level3'),
77
+ 'container-shape': map.get($deps, 'md-sys-shape', 'corner-extra-large'),
78
+ 'headline-color': map.get($deps, 'md-sys-color', 'on-surface-variant'),
79
+ 'headline-font': map.get($deps, 'md-sys-typescale', 'label-medium-font'),
80
+ 'headline-line-height':
81
+ map.get($deps, 'md-sys-typescale', 'label-medium-line-height'),
82
+ 'headline-size': map.get($deps, 'md-sys-typescale', 'label-medium-size'),
83
+ 'headline-tracking':
84
+ map.get($deps, 'md-sys-typescale', 'label-medium-tracking'),
85
+ // Warning: risk of reduced fidelity from using this composite typography token.
86
+ // Tokens md.comp.time-picker.headline.tracking cannot be represented in the "font" property
87
+ // shorthand. Consider using the discrete properties instead.
88
+ 'headline-type':
89
+ if(
90
+ $exclude-hardcoded-values,
91
+ null,
92
+ map.get($deps, 'md-sys-typescale', 'label-medium-weight')
93
+ map.get($deps, 'md-sys-typescale', 'label-medium-size') #{'/'} map.get(
94
+ $deps,
95
+ 'md-sys-typescale',
96
+ 'label-medium-line-height'
97
+ ) map.get($deps, 'md-sys-typescale', 'label-medium-font')
98
+ ),
99
+ 'headline-weight': map.get($deps, 'md-sys-typescale', 'label-medium-weight'),
100
+ 'period-selector-container-shape':
101
+ map.get($deps, 'md-sys-shape', 'corner-small'),
102
+ 'period-selector-focus-state-layer-opacity':
103
+ map.get($deps, 'md-sys-state', 'focus-state-layer-opacity'),
104
+ 'period-selector-horizontal-container-height':
105
+ if($exclude-hardcoded-values, null, 38px),
106
+ 'period-selector-horizontal-container-width':
107
+ if($exclude-hardcoded-values, null, 216px),
108
+ 'period-selector-hover-state-layer-opacity':
109
+ map.get($deps, 'md-sys-state', 'hover-state-layer-opacity'),
110
+ 'period-selector-label-text-font':
111
+ map.get($deps, 'md-sys-typescale', 'title-medium-font'),
112
+ 'period-selector-label-text-line-height':
113
+ map.get($deps, 'md-sys-typescale', 'title-medium-line-height'),
114
+ 'period-selector-label-text-size':
115
+ map.get($deps, 'md-sys-typescale', 'title-medium-size'),
116
+ 'period-selector-label-text-tracking':
117
+ map.get($deps, 'md-sys-typescale', 'title-medium-tracking'),
118
+ // Warning: risk of reduced fidelity from using this composite typography token.
119
+ // Tokens md.comp.time-picker.period-selector.label-text.tracking cannot be represented in
120
+ // the "font" property shorthand. Consider using the discrete properties instead.
121
+ 'period-selector-label-text-type':
122
+ if(
123
+ $exclude-hardcoded-values,
124
+ null,
125
+ map.get($deps, 'md-sys-typescale', 'title-medium-weight')
126
+ map.get($deps, 'md-sys-typescale', 'title-medium-size') #{'/'} map.get(
127
+ $deps,
128
+ 'md-sys-typescale',
129
+ 'title-medium-line-height'
130
+ ) map.get($deps, 'md-sys-typescale', 'title-medium-font')
131
+ ),
132
+ 'period-selector-label-text-weight':
133
+ map.get($deps, 'md-sys-typescale', 'title-medium-weight'),
134
+ 'period-selector-outline-color': map.get($deps, 'md-sys-color', 'outline'),
135
+ 'period-selector-outline-width': if($exclude-hardcoded-values, null, 1px),
136
+ 'period-selector-pressed-state-layer-opacity':
137
+ map.get($deps, 'md-sys-state', 'pressed-state-layer-opacity'),
138
+ 'period-selector-selected-container-color':
139
+ map.get($deps, 'md-sys-color', 'tertiary-container'),
140
+ 'period-selector-selected-focus-label-text-color':
141
+ map.get($deps, 'md-sys-color', 'on-tertiary-container'),
142
+ 'period-selector-selected-focus-state-layer-color':
143
+ map.get($deps, 'md-sys-color', 'on-tertiary-container'),
144
+ 'period-selector-selected-hover-label-text-color':
145
+ map.get($deps, 'md-sys-color', 'on-tertiary-container'),
146
+ 'period-selector-selected-hover-state-layer-color':
147
+ map.get($deps, 'md-sys-color', 'on-tertiary-container'),
148
+ 'period-selector-selected-label-text-color':
149
+ map.get($deps, 'md-sys-color', 'on-tertiary-container'),
150
+ 'period-selector-selected-pressed-label-text-color':
151
+ map.get($deps, 'md-sys-color', 'on-tertiary-container'),
152
+ 'period-selector-selected-pressed-state-layer-color':
153
+ map.get($deps, 'md-sys-color', 'on-tertiary-container'),
154
+ 'period-selector-unselected-focus-label-text-color':
155
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
156
+ 'period-selector-unselected-focus-state-layer-color':
157
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
158
+ 'period-selector-unselected-hover-label-text-color':
159
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
160
+ 'period-selector-unselected-hover-state-layer-color':
161
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
162
+ 'period-selector-unselected-label-text-color':
163
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
164
+ 'period-selector-unselected-pressed-label-text-color':
165
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
166
+ 'period-selector-unselected-pressed-state-layer-color':
167
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
168
+ 'period-selector-vertical-container-height':
169
+ if($exclude-hardcoded-values, null, 80px),
170
+ 'period-selector-vertical-container-width':
171
+ if($exclude-hardcoded-values, null, 52px),
172
+ 'surface-tint-layer-color': map.get($deps, 'md-sys-color', 'surface-tint'),
173
+ 'time-selector-24h-vertical-container-width':
174
+ if($exclude-hardcoded-values, null, 114px),
175
+ 'time-selector-container-height': if($exclude-hardcoded-values, null, 80px),
176
+ 'time-selector-container-shape':
177
+ map.get($deps, 'md-sys-shape', 'corner-small'),
178
+ 'time-selector-container-width': if($exclude-hardcoded-values, null, 96px),
179
+ 'time-selector-focus-state-layer-opacity':
180
+ map.get($deps, 'md-sys-state', 'focus-state-layer-opacity'),
181
+ 'time-selector-hover-state-layer-opacity':
182
+ map.get($deps, 'md-sys-state', 'hover-state-layer-opacity'),
183
+ 'time-selector-label-text-font':
184
+ map.get($deps, 'md-sys-typescale', 'display-large-font'),
185
+ 'time-selector-label-text-line-height':
186
+ map.get($deps, 'md-sys-typescale', 'display-large-line-height'),
187
+ 'time-selector-label-text-size':
188
+ map.get($deps, 'md-sys-typescale', 'display-large-size'),
189
+ 'time-selector-label-text-tracking':
190
+ map.get($deps, 'md-sys-typescale', 'display-large-tracking'),
191
+ // Warning: risk of reduced fidelity from using this composite typography token.
192
+ // Tokens md.comp.time-picker.time-selector.label-text.tracking cannot be represented in
193
+ // the "font" property shorthand. Consider using the discrete properties instead.
194
+ 'time-selector-label-text-type':
195
+ if(
196
+ $exclude-hardcoded-values,
197
+ null,
198
+ map.get($deps, 'md-sys-typescale', 'display-large-weight')
199
+ map.get($deps, 'md-sys-typescale', 'display-large-size') #{'/'} map.get(
200
+ $deps,
201
+ 'md-sys-typescale',
202
+ 'display-large-line-height'
203
+ ) map.get($deps, 'md-sys-typescale', 'display-large-font')
204
+ ),
205
+ 'time-selector-label-text-weight':
206
+ map.get($deps, 'md-sys-typescale', 'display-large-weight'),
207
+ 'time-selector-pressed-state-layer-opacity':
208
+ map.get($deps, 'md-sys-state', 'pressed-state-layer-opacity'),
209
+ 'time-selector-selected-container-color':
210
+ map.get($deps, 'md-sys-color', 'primary-container'),
211
+ 'time-selector-selected-focus-label-text-color':
212
+ map.get($deps, 'md-sys-color', 'on-primary-container'),
213
+ 'time-selector-selected-focus-state-layer-color':
214
+ map.get($deps, 'md-sys-color', 'on-primary-container'),
215
+ 'time-selector-selected-hover-label-text-color':
216
+ map.get($deps, 'md-sys-color', 'on-primary-container'),
217
+ 'time-selector-selected-hover-state-layer-color':
218
+ map.get($deps, 'md-sys-color', 'on-primary-container'),
219
+ 'time-selector-selected-label-text-color':
220
+ map.get($deps, 'md-sys-color', 'on-primary-container'),
221
+ 'time-selector-selected-pressed-label-text-color':
222
+ map.get($deps, 'md-sys-color', 'on-primary-container'),
223
+ 'time-selector-selected-pressed-state-layer-color':
224
+ map.get($deps, 'md-sys-color', 'on-primary-container'),
225
+ 'time-selector-separator-color':
226
+ map.get($deps, 'md-sys-color', 'on-surface'),
227
+ 'time-selector-separator-font':
228
+ map.get($deps, 'md-sys-typescale', 'display-large-font'),
229
+ 'time-selector-separator-line-height':
230
+ map.get($deps, 'md-sys-typescale', 'display-large-line-height'),
231
+ 'time-selector-separator-size':
232
+ map.get($deps, 'md-sys-typescale', 'display-large-size'),
233
+ 'time-selector-separator-tracking':
234
+ map.get($deps, 'md-sys-typescale', 'display-large-tracking'),
235
+ // Warning: risk of reduced fidelity from using this composite typography token.
236
+ // Tokens md.comp.time-picker.time-selector.separator.tracking cannot be represented in the
237
+ // "font" property shorthand. Consider using the discrete properties instead.
238
+ 'time-selector-separator-type':
239
+ if(
240
+ $exclude-hardcoded-values,
241
+ null,
242
+ map.get($deps, 'md-sys-typescale', 'display-large-weight')
243
+ map.get($deps, 'md-sys-typescale', 'display-large-size') #{'/'} map.get(
244
+ $deps,
245
+ 'md-sys-typescale',
246
+ 'display-large-line-height'
247
+ ) map.get($deps, 'md-sys-typescale', 'display-large-font')
248
+ ),
249
+ 'time-selector-separator-weight':
250
+ map.get($deps, 'md-sys-typescale', 'display-large-weight'),
251
+ 'time-selector-unselected-container-color':
252
+ map.get($deps, 'md-sys-color', 'surface-variant'),
253
+ 'time-selector-unselected-focus-label-text-color':
254
+ map.get($deps, 'md-sys-color', 'on-surface'),
255
+ 'time-selector-unselected-focus-state-layer-color':
256
+ map.get($deps, 'md-sys-color', 'on-surface'),
257
+ 'time-selector-unselected-hover-label-text-color':
258
+ map.get($deps, 'md-sys-color', 'on-surface'),
259
+ 'time-selector-unselected-hover-state-layer-color':
260
+ map.get($deps, 'md-sys-color', 'on-surface'),
261
+ 'time-selector-unselected-label-text-color':
262
+ map.get($deps, 'md-sys-color', 'on-surface'),
263
+ 'time-selector-unselected-pressed-label-text-color':
264
+ map.get($deps, 'md-sys-color', 'on-surface'),
265
+ 'time-selector-unselected-pressed-state-layer-color':
266
+ map.get($deps, 'md-sys-color', 'on-surface')
267
+ );
268
+ }
@@ -0,0 +1,59 @@
1
+ //
2
+ // Design system display name: Material 3
3
+ // Design system version: v0.161
4
+ //
5
+
6
+ @use 'sass:map';
7
+
8
+ @use './md-sys-color';
9
+
10
+ @use './md-sys-elevation';
11
+
12
+ @use './md-sys-shape';
13
+
14
+ @use './md-sys-typescale';
15
+
16
+ $_default: (
17
+ 'md-sys-color': md-sys-color.values-light(),
18
+ 'md-sys-elevation': md-sys-elevation.values(),
19
+ 'md-sys-shape': md-sys-shape.values(),
20
+ 'md-sys-typescale': md-sys-typescale.values(),
21
+ );
22
+
23
+ @function values($deps: $_default, $exclude-hardcoded-values: false) {
24
+ @return (
25
+ 'container-color': map.get($deps, 'md-sys-color', 'surface'),
26
+ 'container-elevation': map.get($deps, 'md-sys-elevation', 'level0'),
27
+ 'container-height': if($exclude-hardcoded-values, null, 152px),
28
+ 'container-shape': map.get($deps, 'md-sys-shape', 'corner-none'),
29
+ 'container-surface-tint-layer-color':
30
+ map.get($deps, 'md-sys-color', 'surface-tint'),
31
+ 'headline-color': map.get($deps, 'md-sys-color', 'on-surface'),
32
+ 'headline-font': map.get($deps, 'md-sys-typescale', 'headline-medium-font'),
33
+ 'headline-line-height':
34
+ map.get($deps, 'md-sys-typescale', 'headline-medium-line-height'),
35
+ 'headline-size': map.get($deps, 'md-sys-typescale', 'headline-medium-size'),
36
+ 'headline-tracking':
37
+ map.get($deps, 'md-sys-typescale', 'headline-medium-tracking'),
38
+ // Warning: risk of reduced fidelity from using this composite typography token.
39
+ // Tokens md.comp.top-app-bar.large.headline.tracking cannot be represented in the "font"
40
+ // property shorthand. Consider using the discrete properties instead.
41
+ 'headline-type':
42
+ if(
43
+ $exclude-hardcoded-values,
44
+ null,
45
+ map.get($deps, 'md-sys-typescale', 'headline-medium-weight')
46
+ map.get($deps, 'md-sys-typescale', 'headline-medium-size') #{'/'} map.get(
47
+ $deps,
48
+ 'md-sys-typescale',
49
+ 'headline-medium-line-height'
50
+ ) map.get($deps, 'md-sys-typescale', 'headline-medium-font')
51
+ ),
52
+ 'headline-weight':
53
+ map.get($deps, 'md-sys-typescale', 'headline-medium-weight'),
54
+ 'leading-icon-color': map.get($deps, 'md-sys-color', 'on-surface'),
55
+ 'leading-icon-size': if($exclude-hardcoded-values, null, 24px),
56
+ 'trailing-icon-color': map.get($deps, 'md-sys-color', 'on-surface-variant'),
57
+ 'trailing-icon-size': if($exclude-hardcoded-values, null, 24px)
58
+ );
59
+ }
@@ -0,0 +1,59 @@
1
+ //
2
+ // Design system display name: Material 3
3
+ // Design system version: v0.161
4
+ //
5
+
6
+ @use 'sass:map';
7
+
8
+ @use './md-sys-color';
9
+
10
+ @use './md-sys-elevation';
11
+
12
+ @use './md-sys-shape';
13
+
14
+ @use './md-sys-typescale';
15
+
16
+ $_default: (
17
+ 'md-sys-color': md-sys-color.values-light(),
18
+ 'md-sys-elevation': md-sys-elevation.values(),
19
+ 'md-sys-shape': md-sys-shape.values(),
20
+ 'md-sys-typescale': md-sys-typescale.values(),
21
+ );
22
+
23
+ @function values($deps: $_default, $exclude-hardcoded-values: false) {
24
+ @return (
25
+ 'container-color': map.get($deps, 'md-sys-color', 'surface'),
26
+ 'container-elevation': map.get($deps, 'md-sys-elevation', 'level0'),
27
+ 'container-height': if($exclude-hardcoded-values, null, 112px),
28
+ 'container-shape': map.get($deps, 'md-sys-shape', 'corner-none'),
29
+ 'container-surface-tint-layer-color':
30
+ map.get($deps, 'md-sys-color', 'surface-tint'),
31
+ 'headline-color': map.get($deps, 'md-sys-color', 'on-surface'),
32
+ 'headline-font': map.get($deps, 'md-sys-typescale', 'headline-small-font'),
33
+ 'headline-line-height':
34
+ map.get($deps, 'md-sys-typescale', 'headline-small-line-height'),
35
+ 'headline-size': map.get($deps, 'md-sys-typescale', 'headline-small-size'),
36
+ 'headline-tracking':
37
+ map.get($deps, 'md-sys-typescale', 'headline-small-tracking'),
38
+ // Warning: risk of reduced fidelity from using this composite typography token.
39
+ // Tokens md.comp.top-app-bar.medium.headline.tracking cannot be represented in the "font"
40
+ // property shorthand. Consider using the discrete properties instead.
41
+ 'headline-type':
42
+ if(
43
+ $exclude-hardcoded-values,
44
+ null,
45
+ map.get($deps, 'md-sys-typescale', 'headline-small-weight')
46
+ map.get($deps, 'md-sys-typescale', 'headline-small-size') #{'/'} map.get(
47
+ $deps,
48
+ 'md-sys-typescale',
49
+ 'headline-small-line-height'
50
+ ) map.get($deps, 'md-sys-typescale', 'headline-small-font')
51
+ ),
52
+ 'headline-weight':
53
+ map.get($deps, 'md-sys-typescale', 'headline-small-weight'),
54
+ 'leading-icon-color': map.get($deps, 'md-sys-color', 'on-surface'),
55
+ 'leading-icon-size': if($exclude-hardcoded-values, null, 24px),
56
+ 'trailing-icon-color': map.get($deps, 'md-sys-color', 'on-surface-variant'),
57
+ 'trailing-icon-size': if($exclude-hardcoded-values, null, 24px)
58
+ );
59
+ }