generateTypeScaleComponents function

Map<String, Map<String, Map<String, String>>> generateTypeScaleComponents(
  1. AstryxTypeScaleConfig config
)

Builds the component style overrides that pair with a type scale.

The result is keyed component name to selector to CSS property map, matching the shape defineTheme merges into its component styles. The type scale configuration does not affect the output — the rules are all var() references, so they hold for any scale — but it is taken as a parameter to mirror upstream's signature and leave room for scale-dependent rules.

Implementation

Map<String, Map<String, Map<String, String>>> generateTypeScaleComponents(
  AstryxTypeScaleConfig config,
) {
  final headingRules = <String, Map<String, String>>{};
  for (final level in const <int>[1, 2, 3, 4, 5, 6]) {
    headingRules['level:$level'] = <String, String>{
      'fontFamily': 'var(--font-family-heading)',
      'fontSize': 'var(--text-heading-$level-size)',
      'fontWeight': 'var(--text-heading-$level-weight)',
      'lineHeight': 'var(--text-heading-$level-leading)',
    };
  }

  final textRules = <String, Map<String, String>>{};
  for (final type in astryxTextSteps.keys) {
    textRules['type:$type'] = <String, String>{
      'fontFamily': _textFontFamilies[type]!,
      'fontSize': 'var(--text-$type-size)',
      'lineHeight': 'var(--text-$type-leading)',
    };
  }

  return <String, Map<String, Map<String, String>>>{
    'heading': headingRules,
    'text': textRules,
  };
}