framework7io/framework7 · error · Error

`tertiaryDim` color is undefined prior to 2025 spec.

Error message

`tertiaryDim` color is undefined prior to 2025 spec.

What it means

tertiaryDim, like the other *Dim roles, is defined only in the 2025 spec. Accessing it on a scheme built for an earlier spec yields undefined from colors.tertiaryDim() and the getter throws, rather than returning an invalid ARGB.

Solutions

  1. Construct the scheme with specVersion 2025.
  2. Guard with a specVersion check and fall back to tertiary for legacy schemes.
  3. Update the whole color pipeline consistently to the 2025 spec instead of mixing versions.

Example fix

// before
const c = scheme.tertiaryDim; // throws on 2021 scheme
// after
const scheme = new DynamicScheme({ ..., specVersion: SpecVersion.SPEC_2025 });
const c = scheme.tertiaryDim;
Defensive patterns

Strategy: type-guard

Validate before calling

if (String(scheme.specVersion).includes('2025')) {
  use(scheme.tertiaryDim);
} else {
  use(scheme.tertiary);
}

Type guard

function supports2025Roles(scheme) {
  return scheme && scheme.specVersion === '2025';
}

Try / catch

try {
  argb = scheme.tertiaryDim;
} catch (err) {
  if (err.message.includes('`tertiaryDim` color is undefined')) {
    argb = scheme.tertiary;
  } else throw err;
}

Prevention

When it happens

Trigger: Reading scheme.tertiaryDim on a DynamicScheme whose specVersion is not 2025.

Common situations: Mixing old scheme constructors with new role getters; theme-extraction code upgraded to reference 2025 roles while scheme creation still defaults to the 2021 spec.

Related errors


AI-assisted analysis of framework7io/framework7@6557591266 (2026-09-02). Data as JSON: /api/errors/93a8b54d5dcd6a63. Report an issue: GitHub.

Appendix: source

Thrown at src/core/shared/material-color-utils.js:2326

  }
  get secondaryFixed() {
    return this.getArgb(this.colors.secondaryFixed());
  }
  get secondaryFixedDim() {
    return this.getArgb(this.colors.secondaryFixedDim());
  }
  get onSecondaryFixed() {
    return this.getArgb(this.colors.onSecondaryFixed());
  }
  get onSecondaryFixedVariant() {
    return this.getArgb(this.colors.onSecondaryFixedVariant());
  }
  get tertiary() {
    return this.getArgb(this.colors.tertiary());
  }
  get tertiaryDim() {
    const tertiaryDim = this.colors.tertiaryDim();
    if (void 0 === tertiaryDim) throw new Error("`tertiaryDim` color is undefined prior to 2025 spec.");
    return this.getArgb(tertiaryDim);
  }
  get onTertiary() {
    return this.getArgb(this.colors.onTertiary());
  }
  get tertiaryContainer() {
    return this.getArgb(this.colors.tertiaryContainer());
  }
  get onTertiaryContainer() {
    return this.getArgb(this.colors.onTertiaryContainer());
  }
  get tertiaryFixed() {
    return this.getArgb(this.colors.tertiaryFixed());
  }
  get tertiaryFixedDim() {
    return this.getArgb(this.colors.tertiaryFixedDim());
  }
  get onTertiaryFixed() {

View on GitHub (pinned to 6557591266)