@universal-material/web 3.5.9 → 3.6.0

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 (13) hide show
  1. package/css/universal-material.css +128 -595
  2. package/css/universal-material.min.css +128 -595
  3. package/custom-elements.json +7980 -7980
  4. package/package.json +1 -1
  5. package/scss/_css-vars.scss +5 -1
  6. package/scss/_reboot.scss +3 -4
  7. package/scss/mixins/_text-bg.scss +2 -12
  8. package/scss/table/_table.scss +3 -3
  9. package/scss/utilities/_divider.scss +1 -1
  10. package/theme/theme-builder.d.ts.map +1 -1
  11. package/theme/theme-builder.js +1 -2
  12. package/theme/theme-builder.js.map +1 -1
  13. package/vscode.html-custom-data.json +295 -295
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@universal-material/web",
3
- "version": "3.5.9",
3
+ "version": "3.6.0",
4
4
  "description": "Material web components",
5
5
  "type": "module",
6
6
  "keywords": [
package/scss/_css-vars.scss CHANGED
@@ -20,13 +20,17 @@
20
20
 
21
21
  --u-font-family: #{variables.$font-family};
22
22
  --u-font-monospace: #{variables.$font-mono};
23
- --u-current-text-color: var(--u-color-on-body);
24
23
  --u-text-opacity: var(--u-high-emphasis-opacity);
25
24
  --u-layout-margin: var(--u-layout-margin-default);
26
25
  --u-layout-gutter: var(--u-layout-gutter-default);
27
26
  --u-layout-margin-default: var(--u-spacing-medium);
28
27
  --u-layout-gutter-default: var(--u-spacing-medium);
29
28
 
29
+
30
+ --u-color-high-emphasis: #{functions.get-color-transparency-mix(currentColor, var(--u-high-emphasis-opacity))} !important;
31
+ --u-color-low-emphasis: #{functions.get-color-transparency-mix(currentColor, var(--u-low-emphasis-opacity))} !important;
32
+ --u-color-lower-emphasis: #{functions.get-color-transparency-mix(currentColor, var(--u-lower-emphasis-opacity))} !important;
33
+
30
34
  @each $name, $value in variables.$font-weights {
31
35
  --u-font-weight-#{$name}: #{$value};
32
36
  }
package/scss/_reboot.scss CHANGED
@@ -51,7 +51,7 @@
51
51
  body {
52
52
  --u-current-bg-color: var(--u-color-body);
53
53
  background-color: var(--u-current-bg-color);
54
- color: #{functions.get-color-transparency-mix(var(--u-current-text-color), var(--u-text-opacity))};
54
+ color: var(--u-color-on-body);
55
55
  margin: 0; // 1
56
56
  @include mixins.typo-prop(body-l, font-size);
57
57
  @include mixins.typo-prop(body-l, font-weight);
@@ -220,8 +220,7 @@
220
220
  }
221
221
 
222
222
  a {
223
- --u-current-text-color: var(--u-color-primary);
224
- color: #{functions.get-color-transparency-mix(var(--u-current-text-color), var(--u-text-opacity))};
223
+ color: #{functions.get-color-transparency-mix(var(--u-link-color, --u-color-primary), var(--u-text-opacity))};
225
224
  text-decoration: none;
226
225
 
227
226
  @media (hover: hover) {
@@ -295,7 +294,7 @@
295
294
  caption {
296
295
  padding-top: 0.5rem;
297
296
  padding-bottom: 0.5rem;
298
- color: #{functions.get-color-transparency-mix(var(--u-current-text-color), var(--u-low-emphasis-opacity))};
297
+ color: #{functions.get-color-transparency-mix(currentColor, var(--u-low-emphasis-opacity))};
299
298
  text-align: left;
300
299
  }
301
300
 
package/scss/mixins/_text-bg.scss CHANGED
@@ -3,21 +3,11 @@
3
3
  @use "../functions";
4
4
 
5
5
  @mixin current-color-vars-important($current-color-var-name) {
6
- --u-current-text-color: var(#{$current-color-var-name}) !important;
7
-
8
- --u-color-high-emphasis: #{functions.get-color-transparency-mix(var(--u-current-text-color), var(--u-high-emphasis-opacity))} !important;
9
- --u-color-low-emphasis: #{functions.get-color-transparency-mix(var(--u-current-text-color), var(--u-low-emphasis-opacity))} !important;
10
- --u-color-lower-emphasis: #{functions.get-color-transparency-mix(var(--u-current-text-color), var(--u-lower-emphasis-opacity))} !important;
11
- color: var(--u-color-high-emphasis) !important;
6
+ color: var(#{$current-color-var-name}) !important;
12
7
  }
13
8
 
14
9
  @mixin current-color-vars($current-color-var-name) {
15
- --u-current-text-color: var(#{$current-color-var-name});
16
-
17
- --u-color-high-emphasis: #{functions.get-color-transparency-mix(var(--u-current-text-color), var(--u-high-emphasis-opacity))};
18
- --u-color-low-emphasis: #{functions.get-color-transparency-mix(var(--u-current-text-color), var(--u-low-emphasis-opacity))};
19
- --u-color-lower-emphasis: #{functions.get-color-transparency-mix(var(--u-current-text-color), var(--u-lower-emphasis-opacity))};
20
- color: var(--u-color-high-emphasis);
10
+ color: var(#{$current-color-var-name});
21
11
  }
22
12
 
23
13
  @mixin bg-variant-important($color-name) {
package/scss/table/_table.scss CHANGED
@@ -17,7 +17,7 @@
17
17
  > tr {
18
18
  @at-root .u-table:has(> thead) > tbody > tr,
19
19
  &:not(:first-child) {
20
- border-top: 1px solid #{functions.get-color-transparency-mix(var(--u-current-text-color), var(--u-table-divider-opacity, 20%))};
20
+ border-top: 1px solid #{functions.get-color-transparency-mix(currentColor, var(--u-table-divider-opacity, 20%))};
21
21
  }
22
22
 
23
23
  > td {
@@ -32,7 +32,7 @@
32
32
  padding: var(--u-th-padding, var(--u-table-cell-padding));
33
33
  font-size: var(--u-th-font-size, .8125rem);
34
34
  font-weight: var(--u-th-font-weight, var(--u-table-cell-font-weight));
35
- color: #{functions.get-color-transparency-mix(var(--u-current-text-color), var(--u-text-opacity))};
35
+ color: #{functions.get-color-transparency-mix(currentColor, var(--u-text-opacity))};
36
36
  text-align: start;
37
37
  }
38
38
  }
@@ -42,7 +42,7 @@
42
42
  > tbody > tr,
43
43
  > tr {
44
44
  &:hover {
45
- background-color: #{functions.get-color-transparency-mix(var(--u-current-text-color), var(--u-table-hover-opacity))};
45
+ background-color: #{functions.get-color-transparency-mix(currentColor, var(--u-table-hover-opacity))};
46
46
  }
47
47
  }
48
48
  }
package/scss/utilities/_divider.scss CHANGED
@@ -4,7 +4,7 @@
4
4
  .u-divider-no-margin {
5
5
  display: block;
6
6
  height: var(--u-divider-thickness, 1px);
7
- background-color: var(--u-divider-color, var(--u-current-text-color));
7
+ background-color: var(--u-divider-color, currentColor);
8
8
  opacity: var(--u-divider-opacity, .4);
9
9
  }
10
10
 
package/theme/theme-builder.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"theme-builder.d.ts","sourceRoot":"","sources":["../../src/theme/theme-builder.ts"],"names":[],"mappings":"AAAA,OAAO,EAA4B,YAAY,EAAE,MAAM,oCAAoC,CAAC;AAK5F,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAM9C,qBAAa,YAAY;;IACvB,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,MAAM,EAAE,UAAU,EAAE,CAAM;IAE1B,OAAO,CAAC,OAAO,CAAS;IAGxB,OAAO;IAOP,MAAM,CAAC,MAAM,CAAC,eAAe,EAAE,MAAM,GAAG,YAAY;IAIpD,MAAM,CAAC,aAAa,CAAC,eAAe,EAAE,MAAM,GAAG,YAAY;IAO3D,eAAe,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,YAAY;IAOxD,mBAAmB,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,YAAY,GAAG,YAAY;IAatE,cAAc,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,IAAI,GAAE,MAAW,GAAG,YAAY;IAS1E,WAAW,CAAC,QAAQ,EAAE,MAAM,GAAG,YAAY;IAK3C,OAAO,CAAC,2BAA2B;IAQnC,OAAO,CAAC,iBAAiB;IAUzB,OAAO,CAAC,kBAAkB;IAkB1B,OAAO,CAAC,mBAAmB;IAe3B,OAAO,CAAC,0BAA0B;IAQlC,iBAAiB,CAAC,KAAK,EAAE,UAAU,GAAG,MAAM;IAQ5C,OAAO,CAAC,kBAAkB;IAa1B,OAAO,CAAC,SAAS;IAMjB,OAAO,CAAC,YAAY;IAoBpB,KAAK,IAAI,MAAM;CAehB"}
1
+ {"version":3,"file":"theme-builder.d.ts","sourceRoot":"","sources":["../../src/theme/theme-builder.ts"],"names":[],"mappings":"AAAA,OAAO,EAA4B,YAAY,EAAE,MAAM,oCAAoC,CAAC;AAK5F,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAM9C,qBAAa,YAAY;;IACvB,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,MAAM,EAAE,UAAU,EAAE,CAAM;IAE1B,OAAO,CAAC,OAAO,CAAS;IAGxB,OAAO;IAOP,MAAM,CAAC,MAAM,CAAC,eAAe,EAAE,MAAM,GAAG,YAAY;IAIpD,MAAM,CAAC,aAAa,CAAC,eAAe,EAAE,MAAM,GAAG,YAAY;IAO3D,eAAe,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,YAAY;IAOxD,mBAAmB,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,YAAY,GAAG,YAAY;IAatE,cAAc,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,IAAI,GAAE,MAAW,GAAG,YAAY;IAS1E,WAAW,CAAC,QAAQ,EAAE,MAAM,GAAG,YAAY;IAK3C,OAAO,CAAC,2BAA2B;IAQnC,OAAO,CAAC,iBAAiB;IAUzB,OAAO,CAAC,kBAAkB;IAkB1B,OAAO,CAAC,mBAAmB;IAc3B,OAAO,CAAC,0BAA0B;IAQlC,iBAAiB,CAAC,KAAK,EAAE,UAAU,GAAG,MAAM;IAQ5C,OAAO,CAAC,kBAAkB;IAa1B,OAAO,CAAC,SAAS;IAMjB,OAAO,CAAC,YAAY;IAoBpB,KAAK,IAAI,MAAM;CAehB"}
package/theme/theme-builder.js CHANGED
@@ -83,8 +83,7 @@ export class ThemeBuilder {
83
83
  .add('--u-color-body', 'var(--u-color-surface)')
84
84
  .add('--u-color-inverse-body', 'var(--u-color-inverse-surface)')
85
85
  .add('--u-color-on-body', 'var(--u-color-on-surface)')
86
- .add('--u-color-on-inverse-body', 'var(--u-color-on-inverse-surface)')
87
- .add('--u-current-text-color', 'var(--u-color-on-body)');
86
+ .add('--u-color-on-inverse-body', 'var(--u-color-on-inverse-surface)');
88
87
  return builder.build();
89
88
  }
90
89
  getNeutralVariantVariables() {
package/theme/theme-builder.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"theme-builder.js","sourceRoot":"","sources":["../../src/theme/theme-builder.ts"],"names":[],"mappings":"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","sourcesContent":["import { argbFromHex, CorePalette, TonalPalette } from '@material/material-color-utilities';\n\nimport { Color } from './color.js';\nimport { CssVarBuilder } from './css-var-builder.js';\nimport { neutralColors, neutralVariantColors } from './neutral-colors.js';\nimport { ThemeColor } from './theme-color.js';\n\nconst getCss = (selector: string, content: string): string =>\n `${selector} {\n${content}}`;\n\nexport class ThemeBuilder {\n cssClass: string | null;\n colors: ThemeColor[] = [];\n\n private partial = false;\n readonly #corePalette: CorePalette;\n\n private constructor(primaryColorHex: string) {\n this.cssClass = null;\n\n this.#corePalette = CorePalette.of(argbFromHex(primaryColorHex));\n this.addColorFromPalette('primary', this.#corePalette.a1);\n }\n\n static create(primaryColorHex: string): ThemeBuilder {\n return new ThemeBuilder(primaryColorHex);\n }\n\n static createPartial(primaryColorHex: string): ThemeBuilder {\n const themeBuilder = new ThemeBuilder(primaryColorHex);\n themeBuilder.partial = true;\n\n return themeBuilder;\n }\n\n addColorFromHex(name: string, hex: string): ThemeBuilder {\n const palette = TonalPalette.fromInt(argbFromHex(hex));\n\n this.addColorFromPalette(name, palette);\n return this;\n }\n\n addColorFromPalette(name: string, palette: TonalPalette): ThemeBuilder {\n this.colors.push({ name, lightTone: 40, darkTone: 80, tonalPalette: palette });\n this.colors.push({ name: `on-${name}`, lightTone: 100, darkTone: 20, tonalPalette: palette });\n this.colors.push({ name: `${name}-container`, lightTone: 90, darkTone: 30, tonalPalette: palette });\n this.colors.push({ name: `on-${name}-container`, lightTone: 10, darkTone: 90, tonalPalette: palette });\n\n this.colors.push({ name: `${name}-fixed`, fixedTone: 90, tonalPalette: palette });\n this.colors.push({ name: `${name}-fixed-dim`, fixedTone: 80, tonalPalette: palette });\n this.colors.push({ name: `on-${name}-fixed`, fixedTone: 10, tonalPalette: palette });\n this.colors.push({ name: `on-${name}-fixed-variant`, fixedTone: 30, tonalPalette: palette });\n return this;\n }\n\n addStaticColor(name: string, hex: string, tone: number = 80): ThemeBuilder {\n const palette = TonalPalette.fromInt(argbFromHex(hex));\n this.colors.push({ name, fixedTone: tone, tonalPalette: palette });\n this.colors.push({ name: `on-${name}`, fixedTone: 15, tonalPalette: palette });\n this.colors.push({ name: `${name}-container`, fixedTone: 90, tonalPalette: palette });\n this.colors.push({ name: `on-${name}-container`, fixedTone: 15, tonalPalette: palette });\n return this;\n }\n\n setCssClass(cssClass: string): ThemeBuilder {\n this.cssClass = cssClass;\n return this;\n }\n\n private ensureCssClassStartsWithDot(): void {\n if (!this.cssClass || this.cssClass.startsWith('.')) {\n return;\n }\n\n this.cssClass = `.${this.cssClass}`;\n }\n\n private ensureThemeColors(): void {\n if (!this.colors.find(c => c.name === 'secondary')) {\n this.addColorFromPalette('secondary', this.#corePalette.a2);\n }\n\n if (!this.colors.find(c => c.name === 'tertiary')) {\n this.addColorFromPalette('tertiary', this.#corePalette.a3);\n }\n }\n\n private ensureStatusColors(): void {\n if (!this.colors.find(c => c.name === 'success')) {\n this.addStaticColor('success', '#198754', 60);\n }\n\n if (!this.colors.find(c => c.name === 'info')) {\n this.addStaticColor('info', '#0dcaf0');\n }\n\n if (!this.colors.find(c => c.name === 'warning')) {\n this.addStaticColor('warning', '#ffc107');\n }\n\n if (!this.colors.find(c => c.name === 'error')) {\n this.addColorFromHex('error', '#b3261e');\n }\n }\n\n private getNeutralVariables(): string {\n const builder = CssVarBuilder.create();\n\n this.addColors(builder, neutralColors, this.#corePalette.n1);\n\n builder\n .add('--u-color-body', 'var(--u-color-surface)')\n .add('--u-color-inverse-body', 'var(--u-color-inverse-surface)')\n .add('--u-color-on-body', 'var(--u-color-on-surface)')\n .add('--u-color-on-inverse-body', 'var(--u-color-on-inverse-surface)')\n .add('--u-current-text-color', 'var(--u-color-on-body)');\n\n return builder.build();\n }\n\n private getNeutralVariantVariables(): string {\n const builder = CssVarBuilder.create();\n\n this.addColors(builder, neutralVariantColors, this.#corePalette.n2);\n\n return builder.build();\n }\n\n getColorVariables(color: ThemeColor): string {\n const builder = CssVarBuilder.create();\n\n this.addToneColor(builder, color, color.tonalPalette);\n\n return builder.build();\n }\n\n private getColorsVariables(): string {\n let variables = '';\n\n for (const color of this.colors) {\n variables += this.getColorVariables(color);\n }\n\n variables += this.getNeutralVariables();\n variables += this.getNeutralVariantVariables();\n\n return variables;\n }\n\n private addColors(builder: CssVarBuilder, colors: Color[], palette: TonalPalette): void {\n for (const color of colors) {\n this.addToneColor(builder, color, palette);\n }\n }\n\n private addToneColor(builder: CssVarBuilder, color: Color, palette: TonalPalette): void {\n if (color.fixedTone !== undefined) {\n builder.addFromArgb(color.name, palette.tone(color.fixedTone));\n return;\n }\n\n const inverseName = `inverse-${color.name}`.replace('inverse-on', 'on-inverse');\n\n builder\n .addLightAndDarkFromArgb(color.name, palette.tone(color.lightTone!), palette.tone(color.darkTone!))\n .addLightAndDarkFromArgb(inverseName, palette.tone(color.darkTone!), palette.tone(color.lightTone!));\n\n if (color.name === 'surface' || color.name === 'on-surface') {\n const prefix = color.name.startsWith('on-') ? 'on-' : '';\n\n builder.addFromArgb(`${prefix}light-surface`, palette.tone(color.lightTone!));\n builder.addFromArgb(`${prefix}dark-surface`, palette.tone(color.darkTone!));\n }\n }\n\n build(): string {\n this.ensureCssClassStartsWithDot();\n\n const selector = this.cssClass ?? ':root';\n\n this.ensureThemeColors();\n\n if (!this.partial) {\n this.ensureStatusColors();\n }\n\n const variables = `${getCss(selector, this.getColorsVariables())}\n`;\n return variables;\n }\n}\n"]}
1
+ {"version":3,"file":"theme-builder.js","sourceRoot":"","sources":["../../src/theme/theme-builder.ts"],"names":[],"mappings":"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","sourcesContent":["import { argbFromHex, CorePalette, TonalPalette } from '@material/material-color-utilities';\n\nimport { Color } from './color.js';\nimport { CssVarBuilder } from './css-var-builder.js';\nimport { neutralColors, neutralVariantColors } from './neutral-colors.js';\nimport { ThemeColor } from './theme-color.js';\n\nconst getCss = (selector: string, content: string): string =>\n `${selector} {\n${content}}`;\n\nexport class ThemeBuilder {\n cssClass: string | null;\n colors: ThemeColor[] = [];\n\n private partial = false;\n readonly #corePalette: CorePalette;\n\n private constructor(primaryColorHex: string) {\n this.cssClass = null;\n\n this.#corePalette = CorePalette.of(argbFromHex(primaryColorHex));\n this.addColorFromPalette('primary', this.#corePalette.a1);\n }\n\n static create(primaryColorHex: string): ThemeBuilder {\n return new ThemeBuilder(primaryColorHex);\n }\n\n static createPartial(primaryColorHex: string): ThemeBuilder {\n const themeBuilder = new ThemeBuilder(primaryColorHex);\n themeBuilder.partial = true;\n\n return themeBuilder;\n }\n\n addColorFromHex(name: string, hex: string): ThemeBuilder {\n const palette = TonalPalette.fromInt(argbFromHex(hex));\n\n this.addColorFromPalette(name, palette);\n return this;\n }\n\n addColorFromPalette(name: string, palette: TonalPalette): ThemeBuilder {\n this.colors.push({ name, lightTone: 40, darkTone: 80, tonalPalette: palette });\n this.colors.push({ name: `on-${name}`, lightTone: 100, darkTone: 20, tonalPalette: palette });\n this.colors.push({ name: `${name}-container`, lightTone: 90, darkTone: 30, tonalPalette: palette });\n this.colors.push({ name: `on-${name}-container`, lightTone: 10, darkTone: 90, tonalPalette: palette });\n\n this.colors.push({ name: `${name}-fixed`, fixedTone: 90, tonalPalette: palette });\n this.colors.push({ name: `${name}-fixed-dim`, fixedTone: 80, tonalPalette: palette });\n this.colors.push({ name: `on-${name}-fixed`, fixedTone: 10, tonalPalette: palette });\n this.colors.push({ name: `on-${name}-fixed-variant`, fixedTone: 30, tonalPalette: palette });\n return this;\n }\n\n addStaticColor(name: string, hex: string, tone: number = 80): ThemeBuilder {\n const palette = TonalPalette.fromInt(argbFromHex(hex));\n this.colors.push({ name, fixedTone: tone, tonalPalette: palette });\n this.colors.push({ name: `on-${name}`, fixedTone: 15, tonalPalette: palette });\n this.colors.push({ name: `${name}-container`, fixedTone: 90, tonalPalette: palette });\n this.colors.push({ name: `on-${name}-container`, fixedTone: 15, tonalPalette: palette });\n return this;\n }\n\n setCssClass(cssClass: string): ThemeBuilder {\n this.cssClass = cssClass;\n return this;\n }\n\n private ensureCssClassStartsWithDot(): void {\n if (!this.cssClass || this.cssClass.startsWith('.')) {\n return;\n }\n\n this.cssClass = `.${this.cssClass}`;\n }\n\n private ensureThemeColors(): void {\n if (!this.colors.find(c => c.name === 'secondary')) {\n this.addColorFromPalette('secondary', this.#corePalette.a2);\n }\n\n if (!this.colors.find(c => c.name === 'tertiary')) {\n this.addColorFromPalette('tertiary', this.#corePalette.a3);\n }\n }\n\n private ensureStatusColors(): void {\n if (!this.colors.find(c => c.name === 'success')) {\n this.addStaticColor('success', '#198754', 60);\n }\n\n if (!this.colors.find(c => c.name === 'info')) {\n this.addStaticColor('info', '#0dcaf0');\n }\n\n if (!this.colors.find(c => c.name === 'warning')) {\n this.addStaticColor('warning', '#ffc107');\n }\n\n if (!this.colors.find(c => c.name === 'error')) {\n this.addColorFromHex('error', '#b3261e');\n }\n }\n\n private getNeutralVariables(): string {\n const builder = CssVarBuilder.create();\n\n this.addColors(builder, neutralColors, this.#corePalette.n1);\n\n builder\n .add('--u-color-body', 'var(--u-color-surface)')\n .add('--u-color-inverse-body', 'var(--u-color-inverse-surface)')\n .add('--u-color-on-body', 'var(--u-color-on-surface)')\n .add('--u-color-on-inverse-body', 'var(--u-color-on-inverse-surface)');\n\n return builder.build();\n }\n\n private getNeutralVariantVariables(): string {\n const builder = CssVarBuilder.create();\n\n this.addColors(builder, neutralVariantColors, this.#corePalette.n2);\n\n return builder.build();\n }\n\n getColorVariables(color: ThemeColor): string {\n const builder = CssVarBuilder.create();\n\n this.addToneColor(builder, color, color.tonalPalette);\n\n return builder.build();\n }\n\n private getColorsVariables(): string {\n let variables = '';\n\n for (const color of this.colors) {\n variables += this.getColorVariables(color);\n }\n\n variables += this.getNeutralVariables();\n variables += this.getNeutralVariantVariables();\n\n return variables;\n }\n\n private addColors(builder: CssVarBuilder, colors: Color[], palette: TonalPalette): void {\n for (const color of colors) {\n this.addToneColor(builder, color, palette);\n }\n }\n\n private addToneColor(builder: CssVarBuilder, color: Color, palette: TonalPalette): void {\n if (color.fixedTone !== undefined) {\n builder.addFromArgb(color.name, palette.tone(color.fixedTone));\n return;\n }\n\n const inverseName = `inverse-${color.name}`.replace('inverse-on', 'on-inverse');\n\n builder\n .addLightAndDarkFromArgb(color.name, palette.tone(color.lightTone!), palette.tone(color.darkTone!))\n .addLightAndDarkFromArgb(inverseName, palette.tone(color.darkTone!), palette.tone(color.lightTone!));\n\n if (color.name === 'surface' || color.name === 'on-surface') {\n const prefix = color.name.startsWith('on-') ? 'on-' : '';\n\n builder.addFromArgb(`${prefix}light-surface`, palette.tone(color.lightTone!));\n builder.addFromArgb(`${prefix}dark-surface`, palette.tone(color.darkTone!));\n }\n }\n\n build(): string {\n this.ensureCssClassStartsWithDot();\n\n const selector = this.cssClass ?? ':root';\n\n this.ensureThemeColors();\n\n if (!this.partial) {\n this.ensureStatusColors();\n }\n\n const variables = `${getCss(selector, this.getColorsVariables())}\n`;\n return variables;\n }\n}\n"]}