Skip to content

Commit 3f2c0d4

Browse files
crisbetocrisbeto
committed
refactor(multiple): move overrides tokens into a separate function
Moves the logic that generates the tokens for the `overrides` mixin into a separate function so it can be used for docs extraction.
1 parent 5153a5c commit 3f2c0d4

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

42 files changed

+376
-220
lines changed

‎src/material/autocomplete/_autocomplete-theme.scss

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -59,16 +59,20 @@
5959
}
6060
}
6161

62-
@mixin overrides($tokens: ()) {
63-
@include token-utils.batch-create-token-values(
64-
$tokens,
62+
/// Defines the tokens that will be available in the `overrides` mixin and for docs extraction.
63+
@function _define-overrides() {
64+
@return (
6565
(
6666
namespace: tokens-mat-autocomplete.$prefix,
6767
tokens: tokens-mat-autocomplete.get-token-slots(),
68-
)
68+
),
6969
);
7070
}
7171

72+
@mixin overrides($tokens: ()) {
73+
@include token-utils.batch-create-token-values($tokens, _define-overrides()...);
74+
}
75+
7276
@mixin theme($theme) {
7377
@include theming.private-check-duplicate-theme-styles($theme, 'mat-autocomplete') {
7478
@if inspection.get-theme-version($theme) == 1 {

‎src/material/badge/_badge-theme.scss

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -79,18 +79,22 @@
7979
}
8080
}
8181

82-
/// Outputs the CSS variable values for the given tokens.
83-
/// @param {Map} $tokens The token values to emit.
84-
@mixin overrides($tokens: ()) {
85-
@include token-utils.batch-create-token-values(
86-
$tokens,
82+
/// Defines the tokens that will be available in the `overrides` mixin and for docs extraction.
83+
@function _define-overrides() {
84+
@return (
8785
(
8886
namespace: tokens-mat-badge.$prefix,
8987
tokens: tokens-mat-badge.get-token-slots(),
90-
)
88+
),
9189
);
9290
}
9391

92+
/// Outputs the CSS variable values for the given tokens.
93+
/// @param {Map} $tokens The token values to emit.
94+
@mixin overrides($tokens: ()) {
95+
@include token-utils.batch-create-token-values($tokens, _define-overrides()...);
96+
}
97+
9498
/// Outputs all (base, color, typography, and density) theme styles for the mat-badge.
9599
/// @param {Map} $theme The theme to generate styles for.
96100
/// @param {ArgList} Additional optional arguments (only supported for M3 themes):

‎src/material/bottom-sheet/_bottom-sheet-theme.scss

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -53,16 +53,20 @@
5353
}
5454
}
5555

56-
@mixin overrides($tokens: ()) {
57-
@include token-utils.batch-create-token-values(
58-
$tokens,
56+
/// Defines the tokens that will be available in the `overrides` mixin and for docs extraction.
57+
@function _define-overrides() {
58+
@return (
5959
(
6060
namespace: tokens-mat-bottom-sheet.$prefix,
6161
tokens: tokens-mat-bottom-sheet.get-token-slots(),
62-
)
62+
),
6363
);
6464
}
6565

66+
@mixin overrides($tokens: ()) {
67+
@include token-utils.batch-create-token-values($tokens, _define-overrides()...);
68+
}
69+
6670
@mixin theme($theme) {
6771
@include theming.private-check-duplicate-theme-styles($theme, 'mat-bottom-sheet') {
6872
@if inspection.get-theme-version($theme) == 1 {

‎src/material/button-toggle/_button-toggle-theme.scss

Lines changed: 11 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -87,13 +87,12 @@
8787
}
8888
}
8989

90-
/// Outputs the CSS variable values for the given tokens.
91-
/// @param {Map} $tokens The token values to emit.
92-
@mixin overrides($tokens: ()) {
90+
/// Defines the tokens that will be available in the `overrides` mixin and for docs extraction.
91+
@function _define-overrides() {
9392
$legacy-tokens: tokens-mat-legacy-button-toggle.get-token-slots();
9493
$standard-tokens: tokens-mat-standard-button-toggle.get-token-slots();
95-
@include token-utils.batch-create-token-values(
96-
$tokens,
94+
95+
@return (
9796
(
9897
namespace: tokens-mat-legacy-button-toggle.$prefix,
9998
tokens: $legacy-tokens,
@@ -102,10 +101,16 @@
102101
(
103102
namespace: tokens-mat-standard-button-toggle.$prefix,
104103
tokens: $standard-tokens,
105-
)
104+
),
106105
);
107106
}
108107

108+
/// Outputs the CSS variable values for the given tokens.
109+
/// @param {Map} $tokens The token values to emit.
110+
@mixin overrides($tokens: ()) {
111+
@include token-utils.batch-create-token-values($tokens, _define-overrides()...);
112+
}
113+
109114
/// Outputs all (base, color, typography, and density) theme styles for the mat-button-toggle.
110115
/// @param {Map} $theme The theme to generate styles for.
111116
/// @param {ArgList} Additional optional arguments (only supported for M3 themes):

‎src/material/button/_button-theme.scss

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -361,9 +361,8 @@
361361
}
362362
}
363363

364-
/// Outputs the CSS variable values for the given tokens.
365-
/// @param {Map} $tokens The token values to emit.
366-
@mixin overrides($tokens: ()) {
364+
/// Defines the tokens that will be available in the `overrides` mixin and for docs extraction.
365+
@function _define-overrides() {
367366
$mdc-filled-button-tokens: tokens-mdc-filled-button.get-token-slots();
368367
$mat-filled-button-tokens: tokens-mat-filled-button.get-token-slots();
369368
$mdc-outlined-button-tokens: tokens-mdc-outlined-button.get-token-slots();
@@ -373,8 +372,7 @@
373372
$mdc-text-button-tokens: tokens-mdc-text-button.get-token-slots();
374373
$mat-text-button-tokens: tokens-mat-text-button.get-token-slots();
375374

376-
@include token-utils.batch-create-token-values(
377-
$tokens,
375+
@return (
378376
(
379377
namespace: tokens-mdc-filled-button.$prefix,
380378
tokens: $mdc-filled-button-tokens,
@@ -414,10 +412,16 @@
414412
namespace: tokens-mat-text-button.$prefix,
415413
tokens: $mat-text-button-tokens,
416414
prefix: 'text-',
417-
)
415+
),
418416
);
419417
}
420418

419+
/// Outputs the CSS variable values for the given tokens.
420+
/// @param {Map} $tokens The token values to emit.
421+
@mixin overrides($tokens: ()) {
422+
@include token-utils.batch-create-token-values($tokens, _define-overrides()...);
423+
}
424+
421425
/// Outputs all (base, color, typography, and density) theme styles for the mat-button.
422426
/// @param {Map} $theme The theme to generate styles for.
423427
/// @param {ArgList} Additional optional arguments (only supported for M3 themes):

‎src/material/button/_fab-theme.scss

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -158,11 +158,9 @@
158158
}
159159
}
160160

161-
/// Outputs the CSS variable values for the given tokens.
162-
/// @param {Map} $tokens The token values to emit.
163-
@mixin overrides($tokens: ()) {
164-
@include token-utils.batch-create-token-values(
165-
$tokens,
161+
/// Defines the tokens that will be available in the `overrides` mixin and for docs extraction.
162+
@function _define-overrides() {
163+
@return (
166164
(
167165
namespace: tokens-mdc-fab.$prefix,
168166
tokens: tokens-mdc-fab.get-token-slots(),
@@ -185,10 +183,16 @@
185183
namespace: tokens-mat-fab-small.$prefix,
186184
tokens: tokens-mat-fab-small.get-token-slots(),
187185
prefix: 'small-',
188-
)
186+
),
189187
);
190188
}
191189

190+
/// Outputs the CSS variable values for the given tokens.
191+
/// @param {Map} $tokens The token values to emit.
192+
@mixin overrides($tokens: ()) {
193+
@include token-utils.batch-create-token-values($tokens, _define-overrides()...);
194+
}
195+
192196
/// Outputs all (base, color, typography, and density) theme styles for the mat-checkbox.
193197
/// @param {Map} $theme The theme to generate styles for.
194198
/// @param {ArgList} Additional optional arguments (only supported for M3 themes):

‎src/material/button/_icon-button-theme.scss

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -121,20 +121,24 @@
121121
}
122122
}
123123

124-
@mixin overrides($tokens: ()) {
125-
@include token-utils.batch-create-token-values(
126-
$tokens,
124+
/// Defines the tokens that will be available in the `overrides` mixin and for docs extraction.
125+
@function _define-overrides() {
126+
@return (
127127
(
128128
namespace: tokens-mdc-icon-button.$prefix,
129129
tokens: tokens-mdc-icon-button.get-token-slots(),
130130
),
131131
(
132132
namespace: tokens-mat-icon-button.$prefix,
133133
tokens: tokens-mat-icon-button.get-token-slots(),
134-
)
134+
),
135135
);
136136
}
137137

138+
@mixin overrides($tokens: ()) {
139+
@include token-utils.batch-create-token-values($tokens, _define-overrides()...);
140+
}
141+
138142
/// Outputs all (base, color, typography, and density) theme styles for the mat-icon-button.
139143
/// @param {Map} $theme The theme to generate styles for.
140144
/// @param {ArgList} Additional optional arguments (only supported for M3 themes):

‎src/material/card/_card-theme.scss

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -93,9 +93,9 @@
9393
}
9494
}
9595

96-
@mixin overrides($tokens: ()) {
97-
@include token-utils.batch-create-token-values(
98-
$tokens,
96+
/// Defines the tokens that will be available in the `overrides` mixin and for docs extraction.
97+
@function _define-overrides() {
98+
@return (
9999
(
100100
namespace: tokens-mat-card.$prefix,
101101
tokens: tokens-mat-card.get-token-slots(),
@@ -109,10 +109,14 @@
109109
namespace: tokens-mdc-outlined-card.$prefix,
110110
tokens: tokens-mdc-outlined-card.get-token-slots(),
111111
prefix: 'outlined-',
112-
)
112+
),
113113
);
114114
}
115115

116+
@mixin overrides($tokens: ()) {
117+
@include token-utils.batch-create-token-values($tokens, _define-overrides()...);
118+
}
119+
116120
@mixin theme($theme) {
117121
@include theming.private-check-duplicate-theme-styles($theme, 'mat-card') {
118122
@if inspection.get-theme-version($theme) == 1 {

‎src/material/checkbox/_checkbox-theme.scss

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -105,22 +105,26 @@
105105
}
106106
}
107107

108-
/// Outputs the CSS variable values for the given tokens.
109-
/// @param {Map} $tokens The token values to emit.
110-
@mixin overrides($tokens: ()) {
111-
@include token-utils.batch-create-token-values(
112-
$tokens,
108+
/// Defines the tokens that will be available in the `overrides` mixin and for docs extraction.
109+
@function _define-overrides() {
110+
@return (
113111
(
114112
namespace: tokens-mat-checkbox.$prefix,
115113
tokens: tokens-mat-checkbox.get-token-slots(),
116114
),
117115
(
118116
namespace: tokens-mdc-checkbox.$prefix,
119117
tokens: tokens-mdc-checkbox.get-token-slots(),
120-
)
118+
),
121119
);
122120
}
123121

122+
/// Outputs the CSS variable values for the given tokens.
123+
/// @param {Map} $tokens The token values to emit.
124+
@mixin overrides($tokens: ()) {
125+
@include token-utils.batch-create-token-values($tokens, _define-overrides()...);
126+
}
127+
124128
/// Outputs all (base, color, typography, and density) theme styles for the mat-checkbox.
125129
/// @param {Map} $theme The theme to generate styles for.
126130
/// @param {ArgList} Additional optional arguments (only supported for M3 themes):

‎src/material/chips/_chips-theme.scss

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -123,22 +123,26 @@
123123
}
124124
}
125125

126-
/// Outputs the CSS variable values for the given tokens.
127-
/// @param {Map} $tokens The token values to emit.
128-
@mixin overrides($tokens: ()) {
129-
@include token-utils.batch-create-token-values(
130-
$tokens,
126+
/// Defines the tokens that will be available in the `overrides` mixin and for docs extraction.
127+
@function _define-overrides() {
128+
@return (
131129
(
132130
namespace: tokens-mdc-chip.$prefix,
133131
tokens: tokens-mdc-chip.get-token-slots(),
134132
),
135133
(
136134
namespace: tokens-mat-chip.$prefix,
137135
tokens: tokens-mat-chip.get-token-slots(),
138-
)
136+
),
139137
);
140138
}
141139

140+
/// Outputs the CSS variable values for the given tokens.
141+
/// @param {Map} $tokens The token values to emit.
142+
@mixin overrides($tokens: ()) {
143+
@include token-utils.batch-create-token-values($tokens, _define-overrides()...);
144+
}
145+
142146
/// Outputs all (base, color, typography, and density) theme styles for the mat-chips.
143147
/// @param {Map} $theme The theme to generate styles for.
144148
/// @param {ArgList} Additional optional arguments (only supported for M3 themes):

‎src/material/core/_core-theme.scss

Lines changed: 2 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -71,12 +71,7 @@
7171
}
7272
}
7373

74-
// This theme is a special case where not all of the imported tokens are supported in `overrides`.
75-
// To aid the docs token extraction, we have to pull the `overrides` token config out into a
76-
// separate function.
77-
// !!!Important!!! renaming or removal of this function requires the `extract-tokens.ts` script to
78-
// be updated as well.
79-
@function _get-supported-overrides-tokens() {
74+
@function _define-overrides() {
8075
$app-tokens: tokens-mat-app.get-token-slots();
8176
$ripple-tokens: tokens-mat-ripple.get-token-slots();
8277
$option-tokens: tokens-mat-option.get-token-slots();
@@ -101,7 +96,7 @@
10196
}
10297

10398
@mixin overrides($tokens: ()) {
104-
@include token-utils.batch-create-token-values($tokens, _get-supported-overrides-tokens()...);
99+
@include token-utils.batch-create-token-values($tokens, _define-overrides()...);
105100
}
106101

107102
// Mixin that renders all of the core styles that depend on the theme.

‎src/material/core/option/_optgroup-theme.scss

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -47,16 +47,20 @@
4747
}
4848
}
4949

50-
@mixin overrides($tokens: ()) {
51-
@include token-utils.batch-create-token-values(
52-
$tokens,
50+
/// Defines the tokens that will be available in the `overrides` mixin and for docs extraction.
51+
@function _define-overrides() {
52+
@return (
5353
(
5454
namespace: tokens-mat-optgroup.$prefix,
5555
tokens: tokens-mat-optgroup.get-token-slots(),
56-
)
56+
),
5757
);
5858
}
5959

60+
@mixin overrides($tokens: ()) {
61+
@include token-utils.batch-create-token-values($tokens, _define-overrides()...);
62+
}
63+
6064
@mixin theme($theme) {
6165
@include theming.private-check-duplicate-theme-styles($theme, 'mat-optgroup') {
6266
@if inspection.get-theme-version($theme) == 1 {

‎src/material/core/option/_option-theme.scss

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -72,18 +72,22 @@
7272
}
7373
}
7474

75-
/// Outputs the CSS variable values for the given tokens.
76-
/// @param {Map} $tokens The token values to emit.
77-
@mixin overrides($tokens: ()) {
78-
@include token-utils.batch-create-token-values(
79-
$tokens,
75+
/// Defines the tokens that will be available in the `overrides` mixin and for docs extraction.
76+
@function _define-overrides() {
77+
@return (
8078
(
8179
namespace: tokens-mat-option.$prefix,
8280
tokens: tokens-mat-option.get-token-slots(),
83-
)
81+
),
8482
);
8583
}
8684

85+
/// Outputs the CSS variable values for the given tokens.
86+
/// @param {Map} $tokens The token values to emit.
87+
@mixin overrides($tokens: ()) {
88+
@include token-utils.batch-create-token-values($tokens, _define-overrides()...);
89+
}
90+
8791
/// Outputs all (base, color, typography, and density) theme styles for the mat-option.
8892
/// @param {Map} $theme The theme to generate styles for.
8993
/// @param {ArgList} Additional optional arguments (only supported for M3 themes):

0 commit comments

Comments
 (0)