feat: add attribute to fontVariantion (#371)

.github/workflows/add_label.yml

@@ -27,30 +27,44 @@ jobs:
             const rawFiles = execSync(`git diff --name-only HEAD HEAD~${commits}`).toString()
             const files = rawFiles.split('\n').filter(Boolean)
 
+            console.log('##### Modified Files #####')
+            console.log(files)
+            console.log('##########################')
+
             // verify packages
             const packagesFiles = files.filter(file => file.startsWith('packages/') && !file.includes('mix_lint_test'))
             const packages = packagesFiles.map(file => file.split('/')[1])
             const labels = Array.from(new Set(packages))
 
+            console.log('##### PackagesLabels #####')
+            console.log(labels)
+            console.log('##########################')
+            
             // verify documentation 
             const wasDocModified = files.filter(file => file.startsWith('website/')).length > 0
             if (wasDocModified) {
               labels.push('documentation')
+              
+              console.log('documentation label was added')
             }
 
             // verify examples
             const wasExampleModified = files.filter(file => file.startsWith('examples/')).length > 0
             if (wasExampleModified) {
               labels.push('examples')
+              console.log('examples label was added')
             }
 
             // verify repo
             const wasRepoModified = files.filter(file => !file.startsWith('website/') && !file.startsWith('packages/') && !file.startsWith('examples/')).length > 0
             if (wasRepoModified) {
               labels.push('repo')
+              console.log('rep label was added')
             }
 
+            console.log('##### Added Labels #####')
             console.log(labels)
+            console.log('##########################')
 
             github.rest.issues.addLabels({
               issue_number: context.issue.number,

packages/mix/lib/src/attributes/text_style/text_style_dto.dart

@@ -1,6 +1,5 @@
 // ignore_for_file: prefer_relative_imports,avoid-importing-entrypoint-exports
 
-
 import 'package:flutter/widgets.dart';
 import 'package:mix/mix.dart';
 import 'package:mix_annotations/mix_annotations.dart';
@@ -21,6 +20,7 @@ final class TextStyleDataRef extends TextStyleData {
 
   @override
   TextStyle resolve(MixData mix) => mix.tokens.textStyleRef(ref);
+
   @override
   get props => [ref];
 }
@@ -38,6 +38,7 @@ base class TextStyleData extends Dto<TextStyle> with _$TextStyleData {
   final ColorDto? backgroundColor;
   final List<ShadowDto>? shadows;
   final List<FontFeature>? fontFeatures;
+  final List<FontVariation>? fontVariations;
   final TextDecoration? decoration;
   final ColorDto? decorationColor;
   final TextDecorationStyle? decorationStyle;
@@ -60,6 +61,7 @@ base class TextStyleData extends Dto<TextStyle> with _$TextStyleData {
     this.decorationThickness,
     this.fontFamily,
     this.fontFamilyFallback,
+    this.fontVariations,
     this.fontFeatures,
     this.fontSize,
     this.fontStyle,
@@ -101,6 +103,7 @@ final class TextStyleDto extends Dto<TextStyle> with _$TextStyleDto {
     TextDecoration? decoration,
     ColorDto? decorationColor,
     TextDecorationStyle? decorationStyle,
+    List<FontVariation>? fontVariations,
     Locale? locale,
     double? height,
     Paint? foreground,
@@ -121,6 +124,7 @@ final class TextStyleDto extends Dto<TextStyle> with _$TextStyleDto {
         decorationThickness: decorationThickness,
         fontFamily: fontFamily,
         fontFamilyFallback: fontFamilyFallback,
+        fontVariations: fontVariations,
         fontFeatures: fontFeatures,
         fontSize: fontSize,
         fontStyle: fontStyle,
@@ -176,6 +180,7 @@ extension TextStyleExt on TextStyle {
         decorationThickness: decorationThickness,
         fontFamily: fontFamily,
         fontFamilyFallback: fontFamilyFallback,
+        fontVariations: fontVariations,
         fontFeatures: fontFeatures,
         fontSize: fontSize,
         fontStyle: fontStyle,

packages/mix/lib/src/attributes/text_style/text_style_util.dart

@@ -1,4 +1,3 @@
-
 import 'package:flutter/widgets.dart';
 
 import '../../core/attribute.dart';
@@ -44,6 +43,10 @@ final class TextStyleUtility<T extends Attribute>
 
   T letterSpacing(double v) => only(letterSpacing: v);
 
+  T fontVariations(List<FontVariation> v) => only(fontVariations: v);
+
+  T fontVariation(FontVariation v) => only(fontVariations: [v]);
+
   T shadows(List<Shadow> v) => only(shadows: v.map((e) => e.toDto()).toList());
 
   T italic() => fontStyle.italic();
@@ -77,6 +80,7 @@ final class TextStyleUtility<T extends Attribute>
     List<Shadow>? shadows,
     Color? color,
     Color? backgroundColor,
+    List<FontVariation>? fontVariations,
     List<FontFeature>? fontFeatures,
     TextDecoration? decoration,
     TextDecorationStyle? decorationStyle,
@@ -101,6 +105,7 @@ final class TextStyleUtility<T extends Attribute>
       decorationColor: decorationColor?.toDto(),
       decorationStyle: decorationStyle,
       textBaseline: textBaseline,
+      fontVariations: fontVariations,
       shadows: shadows?.map((e) => e.toDto()).toList(),
       fontFeatures: fontFeatures,
       foreground: foreground,
@@ -127,6 +132,7 @@ final class TextStyleUtility<T extends Attribute>
     ColorDto? decorationColor,
     TextDecorationStyle? decorationStyle,
     TextBaseline? textBaseline,
+    List<FontVariation>? fontVariations,
     List<ShadowDto>? shadows,
     List<FontFeature>? fontFeatures,
     Paint? foreground,
@@ -153,6 +159,7 @@ final class TextStyleUtility<T extends Attribute>
       decoration: decoration,
       decorationColor: decorationColor,
       decorationStyle: decorationStyle,
+      fontVariations: fontVariations,
       locale: locale,
       height: height,
       foreground: foreground,

packages/mix/lib/src/core/helpers.dart

@@ -1,6 +1,7 @@
 import 'dart:math' as math;
 import 'dart:ui' as ui;
 
+import 'package:flutter/material.dart';
 import 'package:flutter/rendering.dart' as r;
 import 'package:flutter/widgets.dart' as w;
 
@@ -26,8 +27,14 @@ class MixHelpers {
 }
 
 w.TextStyle? _lerpTextStyle(w.TextStyle? a, w.TextStyle? b, double t) {
-  return w.TextStyle.lerp(a, b, t)
-      ?.copyWith(shadows: w.Shadow.lerpList(a?.shadows, b?.shadows, t));
+  return w.TextStyle.lerp(a, b, t)?.copyWith(
+    shadows: w.Shadow.lerpList(a?.shadows, b?.shadows, t),
+    fontVariations: lerpFontVariations(
+      a?.fontVariations,
+      b?.fontVariations,
+      t,
+    ),
+  );
 }
 
 List<T>? _mergeDtoList<T>(List<T>? a, List<T>? b) {

packages/mix/lib/src/specs/text/text_spec.dart

@@ -54,10 +54,7 @@ final class TextSpec extends Spec<TextSpec> with _$TextSpec {
     this.softWrap,
     this.directive,
     super.animated,
-  }) : assert(
-          textScaler == null || textScaleFactor == null,
-          'textScaleFactor is deprecated and cannot be specified when textScaler is specified.',
-        );
+  });
 
   Widget call(String text, {String? semanticLabel, Locale? locale}) {
     return isAnimated

packages/mix/lib/src/theme/tokens/text_style_token.dart

@@ -1,4 +1,3 @@
-
 import 'package:flutter/widgets.dart';
 
 import '../mix/mix_theme.dart';

packages/mix/test/helpers/testing_utils.dart

@@ -84,14 +84,14 @@ Widget createDirectionality(TextDirection direction) {
   );
 }
 
-Widget createWithMixTheme(MixThemeData theme) {
+Widget createWithMixTheme(MixThemeData theme, {Widget? child}) {
   return MixTheme(
     data: theme,
     child: MaterialApp(
       home: Scaffold(
         body: Builder(
           builder: (BuildContext context) {
-            return Container();
+            return child ?? Container();
           },
         ),
       ),

packages/mix/test/src/attributes/text_style/text_style_dto_test.dart

@@ -7,7 +7,8 @@ import '../../../helpers/testing_utils.dart';
 void main() {
   group('TextStyleDto', () {
     test('from constructor sets all values correctly', () {
-      final attr = TextStyleDto(color: Colors.red.toDto());
+      final attr =
+          TextStyleDto(color: Colors.red.toDto(), fontVariations: const []);
       final result = attr.resolve(EmptyMixData);
       expect(result.color, Colors.red);
     });
@@ -19,6 +20,9 @@ void main() {
         fontStyle: FontStyle.italic,
         letterSpacing: 1.0,
         wordSpacing: 2.0,
+        fontVariations: const [
+          FontVariation('wght', 900),
+        ],
         textBaseline: TextBaseline.ideographic,
         decoration: TextDecoration.underline,
         decorationColor: Colors.blue.toDto(),
@@ -34,6 +38,9 @@ void main() {
         fontStyle: FontStyle.normal,
         letterSpacing: 2.0,
         wordSpacing: 3.0,
+        fontVariations: const [
+          FontVariation('wght', 400),
+        ],
         textBaseline: TextBaseline.alphabetic,
         decoration: TextDecoration.lineThrough,
         decorationColor: Colors.red.toDto(),
@@ -51,6 +58,7 @@ void main() {
       expect(merged.decorationStyle, TextDecorationStyle.dotted);
       expect(merged.fontWeight, FontWeight.w100);
       expect(merged.fontStyle, FontStyle.normal);
+      expect(merged.fontVariations, [const FontVariation('wght', 400)]);
       expect(merged.letterSpacing, 2.0);
       expect(merged.wordSpacing, 3.0);
       expect(merged.height, 3.0);
@@ -65,6 +73,9 @@ void main() {
         fontStyle: FontStyle.italic,
         letterSpacing: 1.0,
         wordSpacing: 2.0,
+        fontVariations: const [
+          FontVariation('wght', 900),
+        ],
         textBaseline: TextBaseline.ideographic,
         decoration: TextDecoration.underline,
         decorationColor: Colors.blue.toDto(),
@@ -80,6 +91,7 @@ void main() {
       expect(textStyle.decorationStyle, TextDecorationStyle.dashed);
       expect(textStyle.fontWeight, FontWeight.bold);
       expect(textStyle.fontStyle, FontStyle.italic);
+      expect(textStyle.fontVariations, [const FontVariation('wght', 900)]);
       expect(textStyle.letterSpacing, 1.0);
       expect(textStyle.wordSpacing, 2.0);
       expect(textStyle.height, 2.0);
@@ -89,13 +101,17 @@ void main() {
       return const Placeholder();
     });
     test('Equality holds when all attributes are the same', () {
-      final attr1 = TextStyleDto(color: Colors.red.toDto());
-      final attr2 = TextStyleDto(color: Colors.red.toDto());
+      final attr1 =
+          TextStyleDto(color: Colors.red.toDto(), fontVariations: const []);
+      final attr2 =
+          TextStyleDto(color: Colors.red.toDto(), fontVariations: const []);
       expect(attr1, attr2);
     });
     test('Equality fails when attributes are different', () {
-      final attr1 = TextStyleDto(color: Colors.red.toDto());
-      final attr2 = TextStyleDto(color: Colors.blue.toDto());
+      final attr1 =
+          TextStyleDto(color: Colors.red.toDto(), fontVariations: const []);
+      final attr2 =
+          TextStyleDto(color: Colors.blue.toDto(), fontVariations: const []);
       expect(attr1, isNot(attr2));
     });
   });

packages/mix/test/src/attributes/text_style/text_style_util_test.dart

@@ -1,6 +1,3 @@
-// Import necessary packages
-
-
 import 'package:flutter/material.dart';
 import 'package:flutter_test/flutter_test.dart';
 import 'package:mix/mix.dart';
@@ -37,6 +34,9 @@ void main() {
         ],
         textBaseline: TextBaseline.ideographic,
         wordSpacing: 2.0,
+        fontVariations: const [
+          FontVariation('wght', 900),
+        ],
       );
 
       final attrWithPaint = textStyle(
@@ -67,6 +67,7 @@ void main() {
       expect(resolvedValue.decoration, TextDecoration.underline);
       expect(resolvedValue.decorationColor, Colors.green);
       expect(resolvedValue.decorationStyle, TextDecorationStyle.dashed);
+      expect(resolvedValue.fontVariations, [const FontVariation('wght', 900)]);
 
       expect(resolvedValue.debugLabel, 'debugLabel');
       expect(resolvedValue.locale, const Locale('en', 'US'));
@@ -213,5 +214,17 @@ void main() {
 
       expect(resolvedValue.background, purplePaint);
     });
+
+    test('fontVariations() creates TextStyleDto correctly', () {
+      final attribute = textStyle(
+        fontVariations: const [
+          FontVariation('wght', 900),
+        ],
+      );
+
+      final resolvedValue = attribute.value.resolve(EmptyMixData);
+
+      expect(resolvedValue.fontVariations, [const FontVariation('wght', 900)]);
+    });
   });
 }