Linting fixes

conceptadev · Jul 7, 2024 · 2f523b4 · 2f523b4
1 parent 70e90dd
commit 2f523b4
Show file tree

Hide file tree

Showing 16 changed files with 154 additions and 111 deletions.
diff --git a/examples/themed_button/lib/styles/orbit.dart b/examples/themed_button/lib/styles/orbit.dart
@@ -2,36 +2,40 @@ import 'package:flutter/material.dart';
 import 'package:mix/mix.dart';
 import 'package:themed_button/styles/tokens.dart';
 
+final _color = ColorTokens();
+final _radius = RadiusTokens();
+final _space = SpaceTokens();
+final _textStyle = TextStyleTokens();
 final orbitTheme = MixThemeData(
   colors: {
-    $token.color.primary: const Color(0xff00A58E),
-    $token.color.primaryHover: const Color(0xFF009580),
-    $token.color.onPrimary: Colors.white,
+    _color.primary: const Color(0xff00A58E),
+    _color.primaryHover: const Color(0xFF009580),
+    _color.onPrimary: Colors.white,
   },
   radii: {
-    $token.radius.small: const Radius.circular(4),
-    $token.radius.normal: const Radius.circular(6),
-    $token.radius.large: const Radius.circular(12),
-    $token.radius.full: const Radius.circular(9999),
+    _radius.small: const Radius.circular(4),
+    _radius.normal: const Radius.circular(6),
+    _radius.large: const Radius.circular(12),
+    _radius.full: const Radius.circular(9999),
   },
   spaces: {
-    $token.space.xxxsmall: 4,
-    $token.space.xxsmall: 8,
-    $token.space.xsmall: 12,
-    $token.space.small: 16,
-    $token.space.medium: 24,
-    $token.space.large: 32,
+    _space.xxxsmall: 4,
+    _space.xxsmall: 8,
+    _space.xsmall: 12,
+    _space.small: 16,
+    _space.medium: 24,
+    _space.large: 32,
   },
   textStyles: {
-    $token.textStyle.small: const TextStyle(
+    _textStyle.small: const TextStyle(
       fontSize: 12,
       fontWeight: FontWeight.normal,
     ),
-    $token.textStyle.normal: const TextStyle(
+    _textStyle.normal: const TextStyle(
       fontSize: 14,
       fontWeight: FontWeight.normal,
     ),
-    $token.textStyle.large: const TextStyle(
+    _textStyle.large: const TextStyle(
       fontSize: 16,
       fontWeight: FontWeight.normal,
     )

diff --git a/examples/themed_button/lib/styles/schadcn.dart b/examples/themed_button/lib/styles/schadcn.dart
@@ -1,12 +1,13 @@
 import 'package:flutter/material.dart';
-import 'package:mix/mix.dart';
 import 'package:themed_button/styles/orbit.dart';
 import 'package:themed_button/styles/tokens.dart';
 
+final _color = ColorTokens();
+
 final shadcnTheme = orbitTheme.copyWith(
   colors: {
-    $token.color.primary: Colors.black,
-    $token.color.primaryHover: const Color.fromARGB(255, 66, 66, 66),
-    $token.color.onPrimary: Colors.white,
+    _color.primary: Colors.black,
+    _color.primaryHover: const Color.fromARGB(255, 66, 66, 66),
+    _color.onPrimary: Colors.white,
   },
 );
diff --git a/examples/themed_button/lib/styles/tokens.dart b/examples/themed_button/lib/styles/tokens.dart
@@ -1,32 +1,34 @@
 import 'package:mix/mix.dart';
 
-extension ColorExt on ColorTokenUtil {
-  ColorToken get primary => const ColorToken('primary');
-  ColorToken get primaryHover => const ColorToken('primary.hover');
-  ColorToken get onPrimary => const ColorToken('on.primary');
-  // ColorToken get secondary => const ColorToken('secondary');
-  // ColorToken get onSecondary => const ColorToken('on.secondary');
-  // ColorToken get outline => const ColorToken('outline');
+class ColorTokens {
+  final ColorToken primary = const ColorToken('primary');
+  final ColorToken primaryHover = const ColorToken('primary.hover');
+  final ColorToken onPrimary = const ColorToken('on.primary');
+  // final ColorToken secondary = const ColorToken('secondary');
+  // final ColorToken onSecondary = const ColorToken('on.secondary');
+  // final ColorToken outline = const ColorToken('outline');
 }
 
-extension RadiusExt on RadiusTokenUtil {
-  RadiusToken get small => const RadiusToken('radius.small');
-  RadiusToken get normal => const RadiusToken('radius.normal');
-  RadiusToken get large => const RadiusToken('radius.large');
-  RadiusToken get full => const RadiusToken('radius.full');
+class RadiusTokens {
+  final RadiusToken small = const RadiusToken('radius.small');
+  final RadiusToken normal = const RadiusToken('radius.normal');
+  final RadiusToken large = const RadiusToken('radius.large');
+  final RadiusToken full = const RadiusToken('radius.full');
 }
 
-extension SpacingExt on SpaceTokenUtil {
-  SpaceToken get xxxsmall => const SpaceToken('space.xxxsmall');
-  SpaceToken get xxsmall => const SpaceToken('space.xxsmall');
-  SpaceToken get xsmall => const SpaceToken('space.xsmall');
-  SpaceToken get small => const SpaceToken('space.small');
-  SpaceToken get medium => const SpaceToken('space.medium');
+class SpaceTokens {
+  final SpaceToken xxxsmall = const SpaceToken('space.xxxsmall');
+  final SpaceToken xxsmall = const SpaceToken('space.xxsmall');
+  final SpaceToken xsmall = const SpaceToken('space.xsmall');
+  final SpaceToken small = const SpaceToken('space.small');
+  final SpaceToken medium = const SpaceToken('space.medium');
+  final SpaceToken large = const SpaceToken('space.large');
 }
 
-extension TextStyleExt on TextStyleTokenUtil {
-  TextStyleToken get small => const TextStyleToken('textstyle.small');
-  TextStyleToken get normal => const TextStyleToken('textstyle.normall');
-  TextStyleToken get large => const TextStyleToken('textstyle.large');
-  TextStyleToken get extraLarge => const TextStyleToken('textstyle.extraLarge');
+class TextStyleTokens {
+  final TextStyleToken small = const TextStyleToken('textstyle.small');
+  final TextStyleToken normal = const TextStyleToken('textstyle.normall');
+  final TextStyleToken large = const TextStyleToken('textstyle.large');
+  final TextStyleToken extraLarge =
+      const TextStyleToken('textstyle.extraLarge');
 }
diff --git a/examples/todo_list/lib/pages/add_task_page.dart b/examples/todo_list/lib/pages/add_task_page.dart
@@ -1,11 +1,13 @@
 import 'package:flutter/material.dart';
-import 'package:mix/mix.dart';
 import 'package:todo_list/model/task.dart';
 import 'package:todo_list/pages/controller/task_controller.dart';
 import 'package:todo_list/style/design_tokens.dart';
 
 import '../style/components/button.dart';
 
+const _colors = ColorTokens();
+const _textStyles = TextStyleTokens();
+
 class AddTaskPage extends StatefulWidget {
   const AddTaskPage({super.key, required this.controller});
 
@@ -22,12 +24,12 @@ class _AddTaskPageState extends State<AddTaskPage> {
   Widget build(BuildContext context) {
     return Material(
       child: Scaffold(
-        backgroundColor: $token.color.surface.resolve(context),
+        backgroundColor: _colors.surface.resolve(context),
         appBar: AppBar(
-          backgroundColor: $token.color.surface.resolve(context),
+          backgroundColor: _colors.surface.resolve(context),
           title: Text(
             'Create Task',
-            style: $token.textStyle.heading2.resolve(context),
+            style: _textStyles.heading2.resolve(context),
           ),
         ),
         body: Padding(

diff --git a/examples/todo_list/lib/pages/todo_list_page.dart b/examples/todo_list/lib/pages/todo_list_page.dart
@@ -6,6 +6,9 @@ import 'package:todo_list/style/components/icon_button.dart';
 import 'package:todo_list/style/components/list_tile.dart';
 import 'package:todo_list/style/design_tokens.dart';
 
+const _colors = ColorTokens();
+const _textStyles = TextStyleTokens();
+
 class TodoListPage extends StatefulWidget {
   const TodoListPage({super.key});
 
@@ -19,13 +22,13 @@ class _TodoListPageState extends State<TodoListPage> {
   @override
   Widget build(BuildContext context) {
     return Scaffold(
-      backgroundColor: $token.color.surface.resolve(context),
+      backgroundColor: _colors.surface.resolve(context),
       appBar: AppBar(
-        backgroundColor: $token.color.surface.resolve(context),
+        backgroundColor: _colors.surface.resolve(context),
         title: StyledText(
           'To Do List',
           style: Style(
-            $text.style.ref($token.textStyle.heading2),
+            $text.style.ref(_textStyles.heading2),
           ),
         ),
       ),
@@ -39,7 +42,7 @@ class _TodoListPageState extends State<TodoListPage> {
               if (index == 0) {
                 return Text(
                   'Today',
-                  style: $token.textStyle.heading1.resolve(context),
+                  style: _textStyles.heading1.resolve(context),
                 );
               }
               final item = value[index - 1];

diff --git a/examples/todo_list/lib/style/components/button.dart b/examples/todo_list/lib/style/components/button.dart
@@ -4,6 +4,9 @@ import 'package:todo_list/style/design_tokens.dart';
 
 import '../patterns/scale_effect.dart';
 
+const _colors = ColorTokens();
+const _textStyles = TextStyleTokens();
+
 class TodoButton extends StatelessWidget {
   final String text;
   final VoidCallback? onPressed;
@@ -19,7 +22,7 @@ class TodoButton extends StatelessWidget {
     return PressableBox(
       onPress: onPressed,
       style: Style(
-        $box.color.ref($token.color.primary),
+        $box.color.ref(_colors.primary),
         $box.height(50),
         $box.borderRadius(6),
         scaleEffect(),
@@ -29,8 +32,8 @@ class TodoButton extends StatelessWidget {
       child: StyledText(
         text,
         style: Style(
-          $text.style.color.ref($token.color.surface),
-          $text.style.ref($token.textStyle.heading3),
+          $text.style.color.ref(_colors.surface),
+          $text.style.ref(_textStyles.heading3),
           $text.style.bold(),
           $with.scale(1),
           $with.align(alignment: Alignment.center),

diff --git a/examples/todo_list/lib/style/components/checkbox.dart b/examples/todo_list/lib/style/components/checkbox.dart
@@ -4,6 +4,8 @@ import 'package:todo_list/style/design_tokens.dart';
 import 'package:todo_list/style/patterns/outline.dart';
 import 'package:todo_list/style/patterns/scale_effect.dart';
 
+const _colors = ColorTokens();
+
 class _CheckboxVariant {
   static const checked = Variant("checked");
   static const unchecked = Variant("unchecked");
@@ -26,13 +28,13 @@ class TodoCheckbox extends StatelessWidget {
       style: Style(
         $box.height(20),
         $box.width(20),
-        $box.color.ref($token.color.surface),
+        $box.color.ref(_colors.surface),
         $box.borderRadius(3),
         scaleEffect(),
         outlinePattern(),
         _CheckboxVariant.checked(
-          $box.color.ref($token.color.primary),
-          $box.border.color.ref($token.color.primary),
+          $box.color.ref(_colors.primary),
+          $box.border.color.ref(_colors.primary),
         ),
       )
           .applyVariant(
@@ -45,7 +47,7 @@ class TodoCheckbox extends StatelessWidget {
         Icons.check,
         style: Style(
           $icon.weight(16),
-          $icon.color.ref($token.color.surface),
+          $icon.color.ref(_colors.surface),
           $with.opacity(0),
           $with.padding.top(5),
           _CheckboxVariant.checked(

diff --git a/examples/todo_list/lib/style/components/icon_button.dart b/examples/todo_list/lib/style/components/icon_button.dart
@@ -5,6 +5,8 @@ import 'package:todo_list/style/design_tokens.dart';
 import '../patterns/outline.dart';
 import '../patterns/scale_effect.dart';
 
+const _colors = ColorTokens();
+
 class TodoIconButton extends StatelessWidget {
   final IconData icon;
   final VoidCallback? onPressed;
@@ -20,16 +22,16 @@ class TodoIconButton extends StatelessWidget {
     return PressableBox(
       onPress: onPressed,
       style: Style(
-        $box.color.ref($token.color.surface),
+        $box.color.ref(_colors.surface),
         $box.height(50),
         $box.width(50),
         $box.borderRadius(4),
         scaleEffect(),
-        $icon.color.ref($token.color.primary),
+        $icon.color.ref(_colors.primary),
         $icon.weight(20),
         outlinePattern(),
         $on.press(
-          $box.color.ref($token.color.surfaceContainer),
+          $box.color.ref(_colors.surfaceContainer),
         ),
       ).animate(
         duration: const Duration(milliseconds: 150),

diff --git a/examples/todo_list/lib/style/components/list_tile.dart b/examples/todo_list/lib/style/components/list_tile.dart
@@ -4,6 +4,9 @@ import 'package:todo_list/style/components/checkbox.dart';
 import 'package:todo_list/style/design_tokens.dart';
 import 'package:todo_list/style/patterns/scale_effect.dart';
 
+const _colors = ColorTokens();
+const _textStyles = TextStyleTokens();
+
 class CheckboxTileVariant {
   static const checked = Variant("checked");
   static const unchecked = Variant("unchecked");
@@ -38,11 +41,11 @@ class TodoCheckboxListTile extends StatelessWidget {
           StyledText(
             text,
             style: Style(
-              $text.style.ref($token.textStyle.heading3),
-              $text.style.color.ref($token.color.onSurface),
+              $text.style.ref(_textStyles.heading3),
+              $text.style.color.ref(_colors.onSurface),
               CheckboxTileVariant.checked(
                 $text.style.decoration.lineThrough(),
-                $text.style.color.ref($token.color.onSurfaceVariant),
+                $text.style.color.ref(_colors.onSurfaceVariant),
               ),
             )
                 .applyVariant(

diff --git a/examples/todo_list/lib/style/design_tokens.dart b/examples/todo_list/lib/style/design_tokens.dart
@@ -2,49 +2,53 @@ import 'package:flutter/material.dart';
 import 'package:google_fonts/google_fonts.dart';
 import 'package:mix/mix.dart';
 
+const _color = ColorTokens();
+const _textStyle = TextStyleTokens();
 final lightTheme = MixThemeData(
   colors: {
-    $token.color.surface: Colors.white,
-    $token.color.onSurface: const Color(0xFF141217),
-    $token.color.onSurfaceVariant: const Color.fromARGB(255, 74, 70, 81),
-    $token.color.surfaceContainer: const Color(0xFFE0DBE5),
-    $token.color.outline: const Color(0xFFE0DBE5),
-    $token.color.primary: const Color(0xFF7326E0),
-    $token.color.onPrimary: Colors.white,
+    _color.surface: Colors.white,
+    _color.onSurface: const Color(0xFF141217),
+    _color.onSurfaceVariant: const Color.fromARGB(255, 74, 70, 81),
+    _color.surfaceContainer: const Color(0xFFE0DBE5),
+    _color.outline: const Color(0xFFE0DBE5),
+    _color.primary: const Color(0xFF7326E0),
+    _color.onPrimary: Colors.white,
   },
   textStyles: {
-    $token.textStyle.heading1: GoogleFonts.manrope(
+    _textStyle.heading1: GoogleFonts.manrope(
       fontSize: 28,
       fontWeight: FontWeight.bold,
     ),
-    $token.textStyle.heading2: GoogleFonts.manrope(
+    _textStyle.heading2: GoogleFonts.manrope(
       fontSize: 23,
       fontWeight: FontWeight.bold,
     ),
-    $token.textStyle.heading3: GoogleFonts.manrope(
+    _textStyle.heading3: GoogleFonts.manrope(
       fontSize: 16,
       fontWeight: FontWeight.w500,
     ),
-    $token.textStyle.body: GoogleFonts.manrope(
+    _textStyle.body: GoogleFonts.manrope(
       fontSize: 14,
       fontWeight: FontWeight.w200,
     ),
   },
 );
 
-extension ColorExt on ColorTokenUtil {
-  ColorToken get surface => const ColorToken('surface');
-  ColorToken get onSurface => const ColorToken('on.surface');
-  ColorToken get surfaceContainer => const ColorToken('surface.container');
-  ColorToken get onSurfaceVariant => const ColorToken('on.surface.variant');
-  ColorToken get primary => const ColorToken('primary');
-  ColorToken get onPrimary => const ColorToken('on.primary');
-  ColorToken get outline => const ColorToken('outline');
+class ColorTokens {
+  const ColorTokens();
+  final surface = const ColorToken('surface');
+  final onSurface = const ColorToken('on.surface');
+  final surfaceContainer = const ColorToken('surface.container');
+  final onSurfaceVariant = const ColorToken('on.surface.variant');
+  final primary = const ColorToken('primary');
+  final onPrimary = const ColorToken('on.primary');
+  final outline = const ColorToken('outline');
 }
 
-extension TextStyleExt on TextStyleTokenUtil {
-  TextStyleToken get heading1 => const TextStyleToken('heading1');
-  TextStyleToken get heading2 => const TextStyleToken('heading2');
-  TextStyleToken get heading3 => const TextStyleToken('heading3');
-  TextStyleToken get body => const TextStyleToken('body');
+class TextStyleTokens {
+  const TextStyleTokens();
+  final heading1 = const TextStyleToken('heading1');
+  final heading2 = const TextStyleToken('heading2');
+  final heading3 = const TextStyleToken('heading3');
+  final body = const TextStyleToken('body');
 }