@angular/material 18.1.1 → 18.1.2

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 (142) hide show
  1. package/button/_button-base.scss +0 -6
  2. package/core/_core.scss +15 -18
  3. package/core/m2/_typography.scss +129 -2
  4. package/core/style/_elevation.scss +116 -27
  5. package/core/tokens/_m3-tokens.scss +13 -13
  6. package/core/tokens/_token-utils.scss +65 -2
  7. package/core/tokens/m2/mat/_fab-small.scss +1 -2
  8. package/core/tokens/m2/mat/_fab.scss +1 -2
  9. package/core/tokens/m2/mat/_filled-button.scss +1 -2
  10. package/core/tokens/m2/mat/_form-field.scss +0 -2
  11. package/core/tokens/m2/mat/_protected-button.scss +1 -2
  12. package/core/tokens/m2/mdc/_checkbox.scss +1 -2
  13. package/core/tokens/m2/mdc/_filled-button.scss +1 -2
  14. package/core/tokens/m2/mdc/_protected-button.scss +1 -2
  15. package/core/tokens/m3/definitions/_index.scss +94 -0
  16. package/core/tokens/m3/definitions/_md-comp-checkbox.scss +120 -0
  17. package/core/tokens/m3/definitions/_md-comp-circular-progress-indicator.scss +27 -0
  18. package/core/tokens/m3/definitions/_md-comp-data-table.scss +90 -0
  19. package/core/tokens/m3/definitions/_md-comp-dialog.scss +123 -0
  20. package/core/tokens/m3/definitions/_md-comp-elevated-button.scss +87 -0
  21. package/core/tokens/m3/definitions/_md-comp-elevated-card.scss +53 -0
  22. package/core/tokens/m3/definitions/_md-comp-extended-fab-primary.scss +90 -0
  23. package/core/tokens/m3/definitions/_md-comp-extended-fab-secondary.scss +91 -0
  24. package/core/tokens/m3/definitions/_md-comp-extended-fab-tertiary.scss +91 -0
  25. package/core/tokens/m3/definitions/_md-comp-fab-primary-small.scss +59 -0
  26. package/core/tokens/m3/definitions/_md-comp-fab-primary.scss +59 -0
  27. package/core/tokens/m3/definitions/_md-comp-fab-secondary-small.scss +60 -0
  28. package/core/tokens/m3/definitions/_md-comp-fab-secondary.scss +60 -0
  29. package/core/tokens/m3/definitions/_md-comp-fab-tertiary-small.scss +60 -0
  30. package/core/tokens/m3/definitions/_md-comp-fab-tertiary.scss +60 -0
  31. package/core/tokens/m3/definitions/_md-comp-filled-button.scss +85 -0
  32. package/core/tokens/m3/definitions/_md-comp-filled-card.scss +52 -0
  33. package/core/tokens/m3/definitions/_md-comp-filled-icon-button.scss +73 -0
  34. package/core/tokens/m3/definitions/_md-comp-filled-text-field.scss +189 -0
  35. package/core/tokens/m3/definitions/_md-comp-icon-button.scss +64 -0
  36. package/core/tokens/m3/definitions/_md-comp-linear-progress-indicator.scss +29 -0
  37. package/core/tokens/m3/definitions/_md-comp-list.scss +252 -0
  38. package/core/tokens/m3/definitions/_md-comp-outlined-button.scss +80 -0
  39. package/core/tokens/m3/definitions/_md-comp-outlined-card.scss +59 -0
  40. package/core/tokens/m3/definitions/_md-comp-outlined-icon-button.scss +73 -0
  41. package/core/tokens/m3/definitions/_md-comp-outlined-text-field.scss +171 -0
  42. package/core/tokens/m3/definitions/_md-comp-plain-tooltip.scss +51 -0
  43. package/core/tokens/m3/definitions/_md-comp-radio-button.scss +62 -0
  44. package/core/tokens/m3/definitions/_md-comp-secondary-navigation-tab.scss +80 -0
  45. package/core/tokens/m3/definitions/_md-comp-slider.scss +110 -0
  46. package/core/tokens/m3/definitions/_md-comp-snackbar.scss +125 -0
  47. package/core/tokens/m3/definitions/_md-comp-switch.scss +130 -0
  48. package/core/tokens/m3/definitions/_md-comp-text-button.scss +73 -0
  49. package/core/tokens/m3/definitions/_md-ref-palette.scss +100 -0
  50. package/core/tokens/m3/definitions/_md-ref-typeface.scss +14 -0
  51. package/core/tokens/m3/definitions/_md-sys-color.scss +126 -0
  52. package/core/tokens/m3/definitions/_md-sys-elevation.scss +15 -0
  53. package/core/tokens/m3/definitions/_md-sys-motion.scss +46 -0
  54. package/core/tokens/m3/definitions/_md-sys-shape.scss +24 -0
  55. package/core/tokens/m3/definitions/_md-sys-state.scss +13 -0
  56. package/core/tokens/m3/definitions/_md-sys-typescale.scss +308 -0
  57. package/core/tokens/m3/definitions/unused/_md-comp-assist-chip.scss +105 -0
  58. package/core/tokens/m3/definitions/unused/_md-comp-badge.scss +54 -0
  59. package/core/tokens/m3/definitions/unused/_md-comp-banner.scss +71 -0
  60. package/core/tokens/m3/definitions/unused/_md-comp-bottom-app-bar.scss +29 -0
  61. package/core/tokens/m3/definitions/unused/_md-comp-carousel-item.scss +59 -0
  62. package/core/tokens/m3/definitions/unused/_md-comp-date-input-modal.scss +87 -0
  63. package/core/tokens/m3/definitions/unused/_md-comp-date-picker-docked.scss +248 -0
  64. package/core/tokens/m3/definitions/unused/_md-comp-date-picker-modal.scss +313 -0
  65. package/core/tokens/m3/definitions/unused/_md-comp-divider.scss +19 -0
  66. package/core/tokens/m3/definitions/unused/_md-comp-extended-fab-branded.scss +82 -0
  67. package/core/tokens/m3/definitions/unused/_md-comp-extended-fab-surface.scss +86 -0
  68. package/core/tokens/m3/definitions/unused/_md-comp-fab-branded-large.scss +54 -0
  69. package/core/tokens/m3/definitions/unused/_md-comp-fab-branded.scss +54 -0
  70. package/core/tokens/m3/definitions/unused/_md-comp-fab-primary-large.scss +59 -0
  71. package/core/tokens/m3/definitions/unused/_md-comp-fab-secondary-large.scss +60 -0
  72. package/core/tokens/m3/definitions/unused/_md-comp-fab-surface-large.scss +58 -0
  73. package/core/tokens/m3/definitions/unused/_md-comp-fab-surface-small.scss +58 -0
  74. package/core/tokens/m3/definitions/unused/_md-comp-fab-surface.scss +58 -0
  75. package/core/tokens/m3/definitions/unused/_md-comp-fab-tertiary-large.scss +60 -0
  76. package/core/tokens/m3/definitions/unused/_md-comp-filled-autocomplete.scss +269 -0
  77. package/core/tokens/m3/definitions/unused/_md-comp-filled-menu-button.scss +94 -0
  78. package/core/tokens/m3/definitions/unused/_md-comp-filled-select.scss +274 -0
  79. package/core/tokens/m3/definitions/unused/_md-comp-filled-tonal-button.scss +95 -0
  80. package/core/tokens/m3/definitions/unused/_md-comp-filled-tonal-icon-button.scss +80 -0
  81. package/core/tokens/m3/definitions/unused/_md-comp-filter-chip.scss +205 -0
  82. package/core/tokens/m3/definitions/unused/_md-comp-full-screen-dialog.scss +109 -0
  83. package/core/tokens/m3/definitions/unused/_md-comp-input-chip.scss +180 -0
  84. package/core/tokens/m3/definitions/unused/_md-comp-menu.scss +31 -0
  85. package/core/tokens/m3/definitions/unused/_md-comp-navigation-bar.scss +110 -0
  86. package/core/tokens/m3/definitions/unused/_md-comp-navigation-drawer.scss +162 -0
  87. package/core/tokens/m3/definitions/unused/_md-comp-navigation-rail.scss +127 -0
  88. package/core/tokens/m3/definitions/unused/_md-comp-outlined-autocomplete.scss +259 -0
  89. package/core/tokens/m3/definitions/unused/_md-comp-outlined-menu-button.scss +90 -0
  90. package/core/tokens/m3/definitions/unused/_md-comp-outlined-segmented-button.scss +108 -0
  91. package/core/tokens/m3/definitions/unused/_md-comp-outlined-select.scss +264 -0
  92. package/core/tokens/m3/definitions/unused/_md-comp-primary-navigation-tab.scss +117 -0
  93. package/core/tokens/m3/definitions/unused/_md-comp-rich-tooltip.scss +121 -0
  94. package/core/tokens/m3/definitions/unused/_md-comp-scrim.scss +19 -0
  95. package/core/tokens/m3/definitions/unused/_md-comp-search-bar.scss +97 -0
  96. package/core/tokens/m3/definitions/unused/_md-comp-search-view.scss +91 -0
  97. package/core/tokens/m3/definitions/unused/_md-comp-sheet-bottom.scss +39 -0
  98. package/core/tokens/m3/definitions/unused/_md-comp-sheet-floating.scss +28 -0
  99. package/core/tokens/m3/definitions/unused/_md-comp-sheet-side.scss +87 -0
  100. package/core/tokens/m3/definitions/unused/_md-comp-standard-menu-button.scss +94 -0
  101. package/core/tokens/m3/definitions/unused/_md-comp-suggestion-chip.scss +121 -0
  102. package/core/tokens/m3/definitions/unused/_md-comp-time-input.scss +222 -0
  103. package/core/tokens/m3/definitions/unused/_md-comp-time-picker.scss +268 -0
  104. package/core/tokens/m3/definitions/unused/_md-comp-top-app-bar-large.scss +59 -0
  105. package/core/tokens/m3/definitions/unused/_md-comp-top-app-bar-medium.scss +59 -0
  106. package/core/tokens/m3/definitions/unused/_md-comp-top-app-bar-small-centered.scss +62 -0
  107. package/core/tokens/m3/definitions/unused/_md-comp-top-app-bar-small.scss +60 -0
  108. package/esm2022/autocomplete/animations.mjs +1 -2
  109. package/esm2022/core/version.mjs +1 -1
  110. package/esm2022/dialog/dialog-container.mjs +1 -4
  111. package/esm2022/form-field/form-field.mjs +4 -1
  112. package/esm2022/input/input.mjs +36 -3
  113. package/esm2022/list/testing/selection-list-harness.mjs +2 -2
  114. package/esm2022/tabs/testing/tab-harness.mjs +2 -2
  115. package/fesm2022/autocomplete.mjs +0 -1
  116. package/fesm2022/autocomplete.mjs.map +1 -1
  117. package/fesm2022/core.mjs +1 -1
  118. package/fesm2022/core.mjs.map +1 -1
  119. package/fesm2022/dialog.mjs +0 -3
  120. package/fesm2022/dialog.mjs.map +1 -1
  121. package/fesm2022/form-field.mjs +3 -0
  122. package/fesm2022/form-field.mjs.map +1 -1
  123. package/fesm2022/input.mjs +35 -2
  124. package/fesm2022/input.mjs.map +1 -1
  125. package/fesm2022/list/testing.mjs +1 -1
  126. package/fesm2022/list/testing.mjs.map +1 -1
  127. package/fesm2022/tabs/testing.mjs +1 -1
  128. package/fesm2022/tabs/testing.mjs.map +1 -1
  129. package/form-field/_form-field-focus-overlay.scss +1 -1
  130. package/input/index.d.ts +13 -1
  131. package/list/testing/index.d.ts +1 -1
  132. package/package.json +3 -51
  133. package/prebuilt-themes/azure-blue.css +1 -1
  134. package/prebuilt-themes/cyan-orange.css +1 -1
  135. package/prebuilt-themes/magenta-violet.css +1 -1
  136. package/prebuilt-themes/rose-red.css +1 -1
  137. package/schematics/ng-add/index.js +1 -1
  138. package/schematics/ng-add/index.mjs +1 -1
  139. package/schematics/ng-generate/m3-theme/index_bundled.js +2 -2
  140. package/schematics/ng-update/index_bundled.js +31 -31
  141. package/tabs/testing/index.d.ts +1 -1
  142. package/core/mdc-helpers/_mdc-helpers.scss +0 -60
@@ -0,0 +1,162 @@
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
+ 'active-indicator-color':
29
+ map.get($deps, 'md-sys-color', 'secondary-container'),
30
+ 'active-indicator-height': if($exclude-hardcoded-values, null, 56px),
31
+ 'active-indicator-shape': map.get($deps, 'md-sys-shape', 'corner-full'),
32
+ 'active-indicator-width': if($exclude-hardcoded-values, null, 336px),
33
+ 'active-focus-icon-color':
34
+ map.get($deps, 'md-sys-color', 'on-secondary-container'),
35
+ 'active-focus-label-text-color':
36
+ map.get($deps, 'md-sys-color', 'on-secondary-container'),
37
+ 'active-focus-state-layer-color':
38
+ map.get($deps, 'md-sys-color', 'on-secondary-container'),
39
+ 'active-hover-icon-color':
40
+ map.get($deps, 'md-sys-color', 'on-secondary-container'),
41
+ 'active-hover-label-text-color':
42
+ map.get($deps, 'md-sys-color', 'on-secondary-container'),
43
+ 'active-hover-state-layer-color':
44
+ map.get($deps, 'md-sys-color', 'on-secondary-container'),
45
+ 'active-icon-color':
46
+ map.get($deps, 'md-sys-color', 'on-secondary-container'),
47
+ 'active-label-text-color':
48
+ map.get($deps, 'md-sys-color', 'on-secondary-container'),
49
+ 'active-label-text-weight':
50
+ map.get($deps, 'md-sys-typescale', 'label-large-weight-prominent'),
51
+ 'active-pressed-icon-color':
52
+ map.get($deps, 'md-sys-color', 'on-secondary-container'),
53
+ 'active-pressed-label-text-color':
54
+ map.get($deps, 'md-sys-color', 'on-secondary-container'),
55
+ 'active-pressed-state-layer-color':
56
+ map.get($deps, 'md-sys-color', 'on-secondary-container'),
57
+ 'bottom-container-shape': map.get($deps, 'md-sys-shape', 'corner-large-top'),
58
+ 'container-color': map.get($deps, 'md-sys-color', 'surface'),
59
+ 'container-height': if($exclude-hardcoded-values, null, 100%),
60
+ 'container-shape': map.get($deps, 'md-sys-shape', 'corner-large-end'),
61
+ 'container-surface-tint-layer-color':
62
+ map.get($deps, 'md-sys-color', 'surface-tint'),
63
+ 'container-width': if($exclude-hardcoded-values, null, 360px),
64
+ 'focus-state-layer-opacity':
65
+ map.get($deps, 'md-sys-state', 'focus-state-layer-opacity'),
66
+ 'headline-color': map.get($deps, 'md-sys-color', 'on-surface-variant'),
67
+ 'headline-font': map.get($deps, 'md-sys-typescale', 'title-small-font'),
68
+ 'headline-line-height':
69
+ map.get($deps, 'md-sys-typescale', 'title-small-line-height'),
70
+ 'headline-size': map.get($deps, 'md-sys-typescale', 'title-small-size'),
71
+ 'headline-tracking':
72
+ map.get($deps, 'md-sys-typescale', 'title-small-tracking'),
73
+ // Warning: risk of reduced fidelity from using this composite typography token.
74
+ // Tokens md.comp.navigation-drawer.headline.tracking cannot be represented in the "font"
75
+ // property shorthand. Consider using the discrete properties instead.
76
+ 'headline-type':
77
+ if(
78
+ $exclude-hardcoded-values,
79
+ null,
80
+ map.get($deps, 'md-sys-typescale', 'title-small-weight')
81
+ map.get($deps, 'md-sys-typescale', 'title-small-size') #{'/'} map.get(
82
+ $deps,
83
+ 'md-sys-typescale',
84
+ 'title-small-line-height'
85
+ ) map.get($deps, 'md-sys-typescale', 'title-small-font')
86
+ ),
87
+ 'headline-weight': map.get($deps, 'md-sys-typescale', 'title-small-weight'),
88
+ 'hover-state-layer-opacity':
89
+ map.get($deps, 'md-sys-state', 'hover-state-layer-opacity'),
90
+ 'icon-size': if($exclude-hardcoded-values, null, 24px),
91
+ 'inactive-focus-icon-color': map.get($deps, 'md-sys-color', 'on-surface'),
92
+ 'inactive-focus-label-text-color':
93
+ map.get($deps, 'md-sys-color', 'on-surface'),
94
+ 'inactive-focus-state-layer-color':
95
+ map.get($deps, 'md-sys-color', 'on-surface'),
96
+ 'inactive-hover-icon-color': map.get($deps, 'md-sys-color', 'on-surface'),
97
+ 'inactive-hover-label-text-color':
98
+ map.get($deps, 'md-sys-color', 'on-surface'),
99
+ 'inactive-hover-state-layer-color':
100
+ map.get($deps, 'md-sys-color', 'on-surface'),
101
+ 'inactive-icon-color': map.get($deps, 'md-sys-color', 'on-surface-variant'),
102
+ 'inactive-label-text-color':
103
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
104
+ 'inactive-pressed-icon-color': map.get($deps, 'md-sys-color', 'on-surface'),
105
+ 'inactive-pressed-label-text-color':
106
+ map.get($deps, 'md-sys-color', 'on-surface'),
107
+ 'inactive-pressed-state-layer-color':
108
+ map.get($deps, 'md-sys-color', 'on-secondary-container'),
109
+ 'label-text-font': map.get($deps, 'md-sys-typescale', 'label-large-font'),
110
+ 'label-text-line-height':
111
+ map.get($deps, 'md-sys-typescale', 'label-large-line-height'),
112
+ 'label-text-size': map.get($deps, 'md-sys-typescale', 'label-large-size'),
113
+ 'label-text-tracking':
114
+ map.get($deps, 'md-sys-typescale', 'label-large-tracking'),
115
+ // Warning: risk of reduced fidelity from using this composite typography token.
116
+ // Tokens md.comp.navigation-drawer.label-text.tracking cannot be represented in the "font"
117
+ // property shorthand. Consider using the discrete properties instead.
118
+ 'label-text-type':
119
+ if(
120
+ $exclude-hardcoded-values,
121
+ null,
122
+ map.get($deps, 'md-sys-typescale', 'label-large-weight')
123
+ map.get($deps, 'md-sys-typescale', 'label-large-size') #{'/'} map.get(
124
+ $deps,
125
+ 'md-sys-typescale',
126
+ 'label-large-line-height'
127
+ ) map.get($deps, 'md-sys-typescale', 'label-large-font')
128
+ ),
129
+ 'label-text-weight':
130
+ map.get($deps, 'md-sys-typescale', 'label-large-weight'),
131
+ 'large-badge-label-color':
132
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
133
+ 'large-badge-label-font':
134
+ map.get($deps, 'md-sys-typescale', 'label-large-font'),
135
+ 'large-badge-label-line-height':
136
+ map.get($deps, 'md-sys-typescale', 'label-large-line-height'),
137
+ 'large-badge-label-size':
138
+ map.get($deps, 'md-sys-typescale', 'label-large-size'),
139
+ 'large-badge-label-tracking':
140
+ map.get($deps, 'md-sys-typescale', 'label-large-tracking'),
141
+ // Warning: risk of reduced fidelity from using this composite typography token.
142
+ // Tokens md.comp.navigation-drawer.large-badge-label.tracking cannot be represented in the
143
+ // "font" property shorthand. Consider using the discrete properties instead.
144
+ 'large-badge-label-type':
145
+ if(
146
+ $exclude-hardcoded-values,
147
+ null,
148
+ map.get($deps, 'md-sys-typescale', 'label-large-weight')
149
+ map.get($deps, 'md-sys-typescale', 'label-large-size') #{'/'} map.get(
150
+ $deps,
151
+ 'md-sys-typescale',
152
+ 'label-large-line-height'
153
+ ) map.get($deps, 'md-sys-typescale', 'label-large-font')
154
+ ),
155
+ 'large-badge-label-weight':
156
+ map.get($deps, 'md-sys-typescale', 'label-large-weight'),
157
+ 'modal-container-elevation': map.get($deps, 'md-sys-elevation', 'level1'),
158
+ 'pressed-state-layer-opacity':
159
+ map.get($deps, 'md-sys-state', 'pressed-state-layer-opacity'),
160
+ 'standard-container-elevation': map.get($deps, 'md-sys-elevation', 'level0')
161
+ );
162
+ }
@@ -0,0 +1,127 @@
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
+ 'active-indicator-color':
29
+ map.get($deps, 'md-sys-color', 'secondary-container'),
30
+ 'active-indicator-height': if($exclude-hardcoded-values, null, 32px),
31
+ 'active-indicator-shape': map.get($deps, 'md-sys-shape', 'corner-full'),
32
+ 'active-indicator-width': if($exclude-hardcoded-values, null, 56px),
33
+ 'active-focus-icon-color':
34
+ map.get($deps, 'md-sys-color', 'on-secondary-container'),
35
+ 'active-focus-label-text-color':
36
+ map.get($deps, 'md-sys-color', 'on-surface'),
37
+ 'active-focus-state-layer-color':
38
+ map.get($deps, 'md-sys-color', 'on-surface'),
39
+ 'active-hover-icon-color':
40
+ map.get($deps, 'md-sys-color', 'on-secondary-container'),
41
+ 'active-hover-label-text-color':
42
+ map.get($deps, 'md-sys-color', 'on-surface'),
43
+ 'active-hover-state-layer-color':
44
+ map.get($deps, 'md-sys-color', 'on-surface'),
45
+ 'active-icon-color':
46
+ map.get($deps, 'md-sys-color', 'on-secondary-container'),
47
+ 'active-label-text-color': map.get($deps, 'md-sys-color', 'on-surface'),
48
+ 'active-label-text-weight':
49
+ map.get($deps, 'md-sys-typescale', 'label-medium-weight-prominent'),
50
+ 'active-pressed-icon-color':
51
+ map.get($deps, 'md-sys-color', 'on-secondary-container'),
52
+ 'active-pressed-label-text-color':
53
+ map.get($deps, 'md-sys-color', 'on-surface'),
54
+ 'active-pressed-state-layer-color':
55
+ map.get($deps, 'md-sys-color', 'on-surface'),
56
+ 'container-color': map.get($deps, 'md-sys-color', 'surface'),
57
+ 'container-elevation': map.get($deps, 'md-sys-elevation', 'level0'),
58
+ 'container-shape': map.get($deps, 'md-sys-shape', 'corner-none'),
59
+ 'container-width': if($exclude-hardcoded-values, null, 80px),
60
+ 'focus-state-layer-opacity':
61
+ map.get($deps, 'md-sys-state', 'focus-state-layer-opacity'),
62
+ 'hover-state-layer-opacity':
63
+ map.get($deps, 'md-sys-state', 'hover-state-layer-opacity'),
64
+ 'icon-size': if($exclude-hardcoded-values, null, 24px),
65
+ 'inactive-focus-icon-color': map.get($deps, 'md-sys-color', 'on-surface'),
66
+ 'inactive-focus-label-text-color':
67
+ map.get($deps, 'md-sys-color', 'on-surface'),
68
+ 'inactive-focus-state-layer-color':
69
+ map.get($deps, 'md-sys-color', 'on-surface'),
70
+ 'inactive-hover-icon-color': map.get($deps, 'md-sys-color', 'on-surface'),
71
+ 'inactive-hover-label-text-color':
72
+ map.get($deps, 'md-sys-color', 'on-surface'),
73
+ 'inactive-hover-state-layer-color':
74
+ map.get($deps, 'md-sys-color', 'on-surface'),
75
+ 'inactive-icon-color': map.get($deps, 'md-sys-color', 'on-surface-variant'),
76
+ 'inactive-label-text-color':
77
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
78
+ 'inactive-pressed-icon-color': map.get($deps, 'md-sys-color', 'on-surface'),
79
+ 'inactive-pressed-label-text-color':
80
+ map.get($deps, 'md-sys-color', 'on-surface'),
81
+ 'inactive-pressed-state-layer-color':
82
+ map.get($deps, 'md-sys-color', 'on-surface'),
83
+ 'label-text-font': map.get($deps, 'md-sys-typescale', 'label-medium-font'),
84
+ 'label-text-line-height':
85
+ map.get($deps, 'md-sys-typescale', 'label-medium-line-height'),
86
+ 'label-text-size': map.get($deps, 'md-sys-typescale', 'label-medium-size'),
87
+ 'label-text-tracking':
88
+ map.get($deps, 'md-sys-typescale', 'label-medium-tracking'),
89
+ // Warning: risk of reduced fidelity from using this composite typography token.
90
+ // Tokens md.comp.navigation-rail.label-text.tracking cannot be represented in the "font"
91
+ // property shorthand. Consider using the discrete properties instead.
92
+ 'label-text-type':
93
+ if(
94
+ $exclude-hardcoded-values,
95
+ null,
96
+ map.get($deps, 'md-sys-typescale', 'label-medium-weight')
97
+ map.get($deps, 'md-sys-typescale', 'label-medium-size') #{'/'} map.get(
98
+ $deps,
99
+ 'md-sys-typescale',
100
+ 'label-medium-line-height'
101
+ ) map.get($deps, 'md-sys-typescale', 'label-medium-font')
102
+ ),
103
+ 'label-text-weight':
104
+ map.get($deps, 'md-sys-typescale', 'label-medium-weight'),
105
+ 'menu-focus-icon-color': map.get($deps, 'md-sys-color', 'on-surface'),
106
+ 'menu-focus-state-layer-color': map.get($deps, 'md-sys-color', 'on-surface'),
107
+ 'menu-focus-state-layer-opacity':
108
+ map.get($deps, 'md-sys-state', 'focus-state-layer-opacity'),
109
+ 'menu-hover-icon-color': map.get($deps, 'md-sys-color', 'on-surface'),
110
+ 'menu-hover-state-layer-color': map.get($deps, 'md-sys-color', 'on-surface'),
111
+ 'menu-hover-state-layer-opacity':
112
+ map.get($deps, 'md-sys-state', 'hover-state-layer-opacity'),
113
+ 'menu-icon-color': map.get($deps, 'md-sys-color', 'on-surface-variant'),
114
+ 'menu-icon-size': if($exclude-hardcoded-values, null, 24px),
115
+ 'menu-pressed-icon-color': map.get($deps, 'md-sys-color', 'on-surface'),
116
+ 'menu-pressed-state-layer-color':
117
+ map.get($deps, 'md-sys-color', 'on-surface'),
118
+ 'menu-pressed-state-layer-opacity':
119
+ map.get($deps, 'md-sys-state', 'pressed-state-layer-opacity'),
120
+ 'no-label-active-indicator-height':
121
+ if($exclude-hardcoded-values, null, 56px),
122
+ 'no-label-active-indicator-shape':
123
+ map.get($deps, 'md-sys-shape', 'corner-full'),
124
+ 'pressed-state-layer-opacity':
125
+ map.get($deps, 'md-sys-state', 'pressed-state-layer-opacity')
126
+ );
127
+ }
@@ -0,0 +1,259 @@
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
+ 'menu-cascading-menu-indicator-icon-color':
29
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
30
+ 'menu-cascading-menu-indicator-icon-size':
31
+ if($exclude-hardcoded-values, null, 24px),
32
+ 'menu-container-color': map.get($deps, 'md-sys-color', 'surface'),
33
+ 'menu-container-elevation': map.get($deps, 'md-sys-elevation', 'level2'),
34
+ 'menu-container-shadow-color': map.get($deps, 'md-sys-color', 'shadow'),
35
+ 'menu-container-shape': map.get($deps, 'md-sys-shape', 'corner-extra-small'),
36
+ 'menu-container-surface-tint-layer-color':
37
+ map.get($deps, 'md-sys-color', 'surface-tint'),
38
+ 'menu-divider-color': map.get($deps, 'md-sys-color', 'surface-variant'),
39
+ 'menu-divider-height': if($exclude-hardcoded-values, null, 1px),
40
+ 'menu-list-item-container-height': if($exclude-hardcoded-values, null, 48px),
41
+ 'menu-list-item-label-text-color':
42
+ map.get($deps, 'md-sys-color', 'on-surface'),
43
+ 'menu-list-item-label-text-font':
44
+ map.get($deps, 'md-sys-typescale', 'label-large-font'),
45
+ 'menu-list-item-label-text-line-height':
46
+ map.get($deps, 'md-sys-typescale', 'label-large-line-height'),
47
+ 'menu-list-item-label-text-size':
48
+ map.get($deps, 'md-sys-typescale', 'label-large-size'),
49
+ 'menu-list-item-label-text-tracking':
50
+ map.get($deps, 'md-sys-typescale', 'label-large-tracking'),
51
+ // Warning: risk of reduced fidelity from using this composite typography token.
52
+ // Tokens md.comp.outlined-autocomplete.menu.list-item.label-text.tracking cannot be
53
+ // represented in the "font" property shorthand. Consider using the discrete properties instead.
54
+ 'menu-list-item-label-text-type':
55
+ if(
56
+ $exclude-hardcoded-values,
57
+ null,
58
+ map.get($deps, 'md-sys-typescale', 'label-large-weight')
59
+ map.get($deps, 'md-sys-typescale', 'label-large-size') #{'/'} map.get(
60
+ $deps,
61
+ 'md-sys-typescale',
62
+ 'label-large-line-height'
63
+ ) map.get($deps, 'md-sys-typescale', 'label-large-font')
64
+ ),
65
+ 'menu-list-item-label-text-weight':
66
+ map.get($deps, 'md-sys-typescale', 'label-large-weight'),
67
+ 'menu-list-item-selected-container-color':
68
+ map.get($deps, 'md-sys-color', 'surface-variant'),
69
+ 'text-field-caret-color': map.get($deps, 'md-sys-color', 'primary'),
70
+ 'text-field-container-color':
71
+ map.get($deps, 'md-sys-color', 'surface-variant'),
72
+ 'text-field-container-shape':
73
+ map.get($deps, 'md-sys-shape', 'corner-extra-small'),
74
+ 'text-field-disabled-input-text-color':
75
+ map.get($deps, 'md-sys-color', 'on-surface'),
76
+ 'text-field-disabled-input-text-opacity':
77
+ if($exclude-hardcoded-values, null, 0.38),
78
+ 'text-field-disabled-label-text-color':
79
+ map.get($deps, 'md-sys-color', 'on-surface'),
80
+ 'text-field-disabled-label-text-opacity':
81
+ if($exclude-hardcoded-values, null, 0.38),
82
+ 'text-field-disabled-leading-icon-color':
83
+ map.get($deps, 'md-sys-color', 'on-surface'),
84
+ 'text-field-disabled-leading-icon-opacity':
85
+ if($exclude-hardcoded-values, null, 0.38),
86
+ 'text-field-disabled-outline-color':
87
+ map.get($deps, 'md-sys-color', 'on-surface'),
88
+ 'text-field-disabled-outline-opacity':
89
+ if($exclude-hardcoded-values, null, 0.12),
90
+ 'text-field-disabled-outline-width':
91
+ if($exclude-hardcoded-values, null, 1px),
92
+ 'text-field-disabled-supporting-text-color':
93
+ map.get($deps, 'md-sys-color', 'on-surface'),
94
+ 'text-field-disabled-supporting-text-opacity':
95
+ if($exclude-hardcoded-values, null, 0.38),
96
+ 'text-field-disabled-trailing-icon-color':
97
+ map.get($deps, 'md-sys-color', 'on-surface'),
98
+ 'text-field-disabled-trailing-icon-opacity':
99
+ if($exclude-hardcoded-values, null, 0.38),
100
+ 'text-field-error-focus-caret-color':
101
+ map.get($deps, 'md-sys-color', 'error'),
102
+ 'text-field-error-focus-input-text-color':
103
+ map.get($deps, 'md-sys-color', 'on-surface'),
104
+ 'text-field-error-focus-label-text-color':
105
+ map.get($deps, 'md-sys-color', 'error'),
106
+ 'text-field-error-focus-leading-icon-color':
107
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
108
+ 'text-field-error-focus-outline-color':
109
+ map.get($deps, 'md-sys-color', 'error'),
110
+ 'text-field-error-focus-supporting-text-color':
111
+ map.get($deps, 'md-sys-color', 'error'),
112
+ 'text-field-error-focus-trailing-icon-color':
113
+ map.get($deps, 'md-sys-color', 'error'),
114
+ 'text-field-error-hover-input-text-color':
115
+ map.get($deps, 'md-sys-color', 'on-surface'),
116
+ 'text-field-error-hover-label-text-color':
117
+ map.get($deps, 'md-sys-color', 'on-error-container'),
118
+ 'text-field-error-hover-leading-icon-color':
119
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
120
+ 'text-field-error-hover-outline-color':
121
+ map.get($deps, 'md-sys-color', 'on-error-container'),
122
+ 'text-field-error-hover-state-layer-color':
123
+ map.get($deps, 'md-sys-color', 'on-surface'),
124
+ 'text-field-error-hover-state-layer-opacity':
125
+ map.get($deps, 'md-sys-state', 'hover-state-layer-opacity'),
126
+ 'text-field-error-hover-supporting-text-color':
127
+ map.get($deps, 'md-sys-color', 'error'),
128
+ 'text-field-error-hover-trailing-icon-color':
129
+ map.get($deps, 'md-sys-color', 'on-error-container'),
130
+ 'text-field-error-input-text-color':
131
+ map.get($deps, 'md-sys-color', 'on-surface'),
132
+ 'text-field-error-label-text-color': map.get($deps, 'md-sys-color', 'error'),
133
+ 'text-field-error-leading-icon-color':
134
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
135
+ 'text-field-error-outline-color': map.get($deps, 'md-sys-color', 'error'),
136
+ 'text-field-error-supporting-text-color':
137
+ map.get($deps, 'md-sys-color', 'error'),
138
+ 'text-field-error-trailing-icon-color':
139
+ map.get($deps, 'md-sys-color', 'error'),
140
+ 'text-field-focus-input-text-color':
141
+ map.get($deps, 'md-sys-color', 'on-surface'),
142
+ 'text-field-focus-label-text-color':
143
+ map.get($deps, 'md-sys-color', 'primary'),
144
+ 'text-field-focus-leading-icon-color':
145
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
146
+ 'text-field-focus-outline-color': map.get($deps, 'md-sys-color', 'primary'),
147
+ 'text-field-focus-outline-width': if($exclude-hardcoded-values, null, 2px),
148
+ 'text-field-focus-supporting-text-color':
149
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
150
+ 'text-field-focus-trailing-icon-color':
151
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
152
+ 'text-field-hover-input-text-color':
153
+ map.get($deps, 'md-sys-color', 'on-surface'),
154
+ 'text-field-hover-label-text-color':
155
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
156
+ 'text-field-hover-leading-icon-color':
157
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
158
+ 'text-field-hover-outline-color':
159
+ map.get($deps, 'md-sys-color', 'on-surface'),
160
+ 'text-field-hover-outline-width': if($exclude-hardcoded-values, null, 1px),
161
+ 'text-field-hover-state-layer-color':
162
+ map.get($deps, 'md-sys-color', 'on-surface'),
163
+ 'text-field-hover-state-layer-opacity':
164
+ map.get($deps, 'md-sys-state', 'hover-state-layer-opacity'),
165
+ 'text-field-hover-supporting-text-color':
166
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
167
+ 'text-field-hover-trailing-icon-color':
168
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
169
+ 'text-field-input-text-color': map.get($deps, 'md-sys-color', 'on-surface'),
170
+ 'text-field-input-text-font':
171
+ map.get($deps, 'md-sys-typescale', 'body-large-font'),
172
+ 'text-field-input-text-line-height':
173
+ map.get($deps, 'md-sys-typescale', 'body-large-line-height'),
174
+ 'text-field-input-text-size':
175
+ map.get($deps, 'md-sys-typescale', 'body-large-size'),
176
+ 'text-field-input-text-tracking':
177
+ map.get($deps, 'md-sys-typescale', 'body-large-tracking'),
178
+ // Warning: risk of reduced fidelity from using this composite typography token.
179
+ // Tokens md.comp.outlined-autocomplete.text-field.input-text.tracking cannot be represented
180
+ // in the "font" property shorthand. Consider using the discrete properties instead.
181
+ 'text-field-input-text-type':
182
+ if(
183
+ $exclude-hardcoded-values,
184
+ null,
185
+ map.get($deps, 'md-sys-typescale', 'body-large-weight')
186
+ map.get($deps, 'md-sys-typescale', 'body-large-size') #{'/'} map.get(
187
+ $deps,
188
+ 'md-sys-typescale',
189
+ 'body-large-line-height'
190
+ ) map.get($deps, 'md-sys-typescale', 'body-large-font')
191
+ ),
192
+ 'text-field-input-text-weight':
193
+ map.get($deps, 'md-sys-typescale', 'body-large-weight'),
194
+ 'text-field-label-text-color':
195
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
196
+ 'text-field-label-text-font':
197
+ map.get($deps, 'md-sys-typescale', 'body-large-font'),
198
+ 'text-field-label-text-line-height':
199
+ map.get($deps, 'md-sys-typescale', 'body-large-line-height'),
200
+ 'text-field-label-text-populated-line-height':
201
+ map.get($deps, 'md-sys-typescale', 'body-small-line-height'),
202
+ 'text-field-label-text-populated-size':
203
+ map.get($deps, 'md-sys-typescale', 'body-small-size'),
204
+ 'text-field-label-text-size':
205
+ map.get($deps, 'md-sys-typescale', 'body-large-size'),
206
+ 'text-field-label-text-tracking':
207
+ map.get($deps, 'md-sys-typescale', 'body-large-tracking'),
208
+ // Warning: risk of reduced fidelity from using this composite typography token.
209
+ // Tokens md.comp.outlined-autocomplete.text-field.label-text.tracking cannot be represented
210
+ // in the "font" property shorthand. Consider using the discrete properties instead.
211
+ 'text-field-label-text-type':
212
+ if(
213
+ $exclude-hardcoded-values,
214
+ null,
215
+ map.get($deps, 'md-sys-typescale', 'body-large-weight')
216
+ map.get($deps, 'md-sys-typescale', 'body-large-size') #{'/'} map.get(
217
+ $deps,
218
+ 'md-sys-typescale',
219
+ 'body-large-line-height'
220
+ ) map.get($deps, 'md-sys-typescale', 'body-large-font')
221
+ ),
222
+ 'text-field-label-text-weight':
223
+ map.get($deps, 'md-sys-typescale', 'body-large-weight'),
224
+ 'text-field-leading-icon-color':
225
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
226
+ 'text-field-leading-icon-size': if($exclude-hardcoded-values, null, 24px),
227
+ 'text-field-outline-color': map.get($deps, 'md-sys-color', 'outline'),
228
+ 'text-field-outline-width': if($exclude-hardcoded-values, null, 1px),
229
+ 'text-field-supporting-text-color':
230
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
231
+ 'text-field-supporting-text-font':
232
+ map.get($deps, 'md-sys-typescale', 'body-small-font'),
233
+ 'text-field-supporting-text-line-height':
234
+ map.get($deps, 'md-sys-typescale', 'body-small-line-height'),
235
+ 'text-field-supporting-text-size':
236
+ map.get($deps, 'md-sys-typescale', 'body-small-size'),
237
+ 'text-field-supporting-text-tracking':
238
+ map.get($deps, 'md-sys-typescale', 'body-small-tracking'),
239
+ // Warning: risk of reduced fidelity from using this composite typography token.
240
+ // Tokens md.comp.outlined-autocomplete.text-field.supporting-text.tracking cannot be
241
+ // represented in the "font" property shorthand. Consider using the discrete properties instead.
242
+ 'text-field-supporting-text-type':
243
+ if(
244
+ $exclude-hardcoded-values,
245
+ null,
246
+ map.get($deps, 'md-sys-typescale', 'body-small-weight')
247
+ map.get($deps, 'md-sys-typescale', 'body-small-size') #{'/'} map.get(
248
+ $deps,
249
+ 'md-sys-typescale',
250
+ 'body-small-line-height'
251
+ ) map.get($deps, 'md-sys-typescale', 'body-small-font')
252
+ ),
253
+ 'text-field-supporting-text-weight':
254
+ map.get($deps, 'md-sys-typescale', 'body-small-weight'),
255
+ 'text-field-trailing-icon-color':
256
+ map.get($deps, 'md-sys-color', 'on-surface-variant'),
257
+ 'text-field-trailing-icon-size': if($exclude-hardcoded-values, null, 24px)
258
+ );
259
+ }
@@ -0,0 +1,90 @@
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-shape';
11
+
12
+ @use './md-sys-state';
13
+
14
+ @use './md-sys-typescale';
15
+
16
+ $_default: (
17
+ 'md-sys-color': md-sys-color.values-light(),
18
+ 'md-sys-shape': md-sys-shape.values(),
19
+ 'md-sys-state': md-sys-state.values(),
20
+ 'md-sys-typescale': md-sys-typescale.values(),
21
+ );
22
+
23
+ @function values($deps: $_default, $exclude-hardcoded-values: false) {
24
+ @return (
25
+ 'container-height': if($exclude-hardcoded-values, null, 40px),
26
+ 'disabled-container-opacity': if($exclude-hardcoded-values, null, 0.12),
27
+ 'disabled-label-text-color': map.get($deps, 'md-sys-color', 'on-surface'),
28
+ 'disabled-label-text-opacity': if($exclude-hardcoded-values, null, 0.38),
29
+ 'disabled-outline-color': map.get($deps, 'md-sys-color', 'on-surface'),
30
+ 'disabled-trailing-icon-color': map.get($deps, 'md-sys-color', 'on-surface'),
31
+ 'disabled-trailing-icon-opacity': if($exclude-hardcoded-values, null, 0.38),
32
+ 'focus-label-text-color': map.get($deps, 'md-sys-color', 'primary'),
33
+ 'focus-outline-color': map.get($deps, 'md-sys-color', 'primary'),
34
+ 'focus-state-layer-color': map.get($deps, 'md-sys-color', 'primary'),
35
+ 'focus-state-layer-opacity':
36
+ map.get($deps, 'md-sys-state', 'focus-state-layer-opacity'),
37
+ 'focus-trailing-icon-color': map.get($deps, 'md-sys-color', 'primary'),
38
+ 'hover-label-text-color': map.get($deps, 'md-sys-color', 'primary'),
39
+ 'hover-outline-color': map.get($deps, 'md-sys-color', 'outline'),
40
+ 'hover-state-layer-color': map.get($deps, 'md-sys-color', 'primary'),
41
+ 'hover-state-layer-opacity':
42
+ map.get($deps, 'md-sys-state', 'hover-state-layer-opacity'),
43
+ 'hover-trailing-icon-color': map.get($deps, 'md-sys-color', 'primary'),
44
+ 'label-text-color': map.get($deps, 'md-sys-color', 'primary'),
45
+ 'label-text-font': map.get($deps, 'md-sys-typescale', 'label-large-font'),
46
+ 'label-text-line-height':
47
+ map.get($deps, 'md-sys-typescale', 'label-large-line-height'),
48
+ 'label-text-size': map.get($deps, 'md-sys-typescale', 'label-large-size'),
49
+ 'label-text-tracking':
50
+ map.get($deps, 'md-sys-typescale', 'label-large-tracking'),
51
+ // Warning: risk of reduced fidelity from using this composite typography token.
52
+ // Tokens md.comp.outlined-menu-button.label-text.tracking cannot be represented in the "font"
53
+ // property shorthand. Consider using the discrete properties instead.
54
+ 'label-text-type':
55
+ if(
56
+ $exclude-hardcoded-values,
57
+ null,
58
+ map.get($deps, 'md-sys-typescale', 'label-large-weight')
59
+ map.get($deps, 'md-sys-typescale', 'label-large-size') #{'/'} map.get(
60
+ $deps,
61
+ 'md-sys-typescale',
62
+ 'label-large-line-height'
63
+ ) map.get($deps, 'md-sys-typescale', 'label-large-font')
64
+ ),
65
+ 'label-text-weight':
66
+ map.get($deps, 'md-sys-typescale', 'label-large-weight'),
67
+ 'outline-color': map.get($deps, 'md-sys-color', 'outline'),
68
+ 'outline-width': if($exclude-hardcoded-values, null, 1px),
69
+ 'pressed-label-text-color': map.get($deps, 'md-sys-color', 'primary'),
70
+ 'pressed-outline-color': map.get($deps, 'md-sys-color', 'outline'),
71
+ 'pressed-state-layer-color': map.get($deps, 'md-sys-color', 'primary'),
72
+ 'pressed-state-layer-opacity':
73
+ map.get($deps, 'md-sys-state', 'pressed-state-layer-opacity'),
74
+ 'pressed-trailing-icon-color': map.get($deps, 'md-sys-color', 'primary'),
75
+ 'shape': map.get($deps, 'md-sys-shape', 'corner-full'),
76
+ 'trailing-icon-color': map.get($deps, 'md-sys-color', 'primary'),
77
+ 'trailing-icon-size': if($exclude-hardcoded-values, null, 18px),
78
+ 'with-icon-disabled-icon-color':
79
+ map.get($deps, 'md-sys-color', 'on-surface'),
80
+ 'with-icon-disabled-icon-opacity': if($exclude-hardcoded-values, null, 0.38),
81
+ 'with-icon-focus-leading-icon-color':
82
+ map.get($deps, 'md-sys-color', 'primary'),
83
+ 'with-icon-hover-leading-icon-color':
84
+ map.get($deps, 'md-sys-color', 'primary'),
85
+ 'with-icon-leading-icon-color': map.get($deps, 'md-sys-color', 'primary'),
86
+ 'with-icon-leading-icon-size': if($exclude-hardcoded-values, null, 18px),
87
+ 'with-icon-pressed-leading-icon-color':
88
+ map.get($deps, 'md-sys-color', 'primary')
89
+ );
90
+ }