Chore/doc improvements (#164)

* Update doc compoennts

* Update comments and dartdoc options

* Added flex, and text widget documentation

* Update docs

* Theming wip

* Revert some changes on flex

* Update docs

* Update conflicts

* ran formatting

* Updates

* Renamed widget state utilities

* Update test

dartdoc_options.yaml

@@ -1,8 +1,4 @@
 dartdoc:
   showStats: true
-  categories:
-      "Widgets":
-        name: Widgets
-      "Second Category":
-        name: Great
-      categoryOrder: ["Widgets", "Second Category"]
+  nodoc: ['lib/src/deprecations.dart']
+

demo/lib/app_shell.dart

@@ -29,7 +29,7 @@ class AppShell extends HookConsumerWidget {
     final darkMode = ref.watch(darkModeProvider);
 
     return MixTheme(
-      data: MixThemeData.withMaterialTokens(),
+      data: MixThemeData.withMaterial(),
       child: AdaptiveNavigationScaffold(
         appBar: AppBar(
           title: const Text('Mix Gallery'),

demo/lib/components/box.dart

@@ -9,7 +9,7 @@ import 'package:widgetbook_annotation/widgetbook_annotation.dart' as widgetbook;
 Widget boxDecorationContainer(BuildContext context) {
   final boxStyle = Style(
     backgroundColor.red(),
-    onPress(
+    onPressed(
       backgroundColor.blue(),
     ),
     opacity(0.5),

demo/lib/docs/variants/catalog/pressable.dart

@@ -11,7 +11,7 @@ class VariantsCatalogPressable extends StatelessWidget {
         'Hover',
         Style(
           onHover(
-            box.border(color: $colors.primary(), width: 2),
+            box.border(color: $md.colorScheme.primary(), width: 2),
             box.padding(4.0),
           ),
         ),
@@ -21,8 +21,8 @@ class VariantsCatalogPressable extends StatelessWidget {
       buildBlock(
         'Focus',
         Style(
-          onFocus(
-            box.border(color: $colors.primary(), width: 2),
+          onFocused(
+            box.border(color: $md.colorScheme.primary(), width: 2),
             box.padding(4.0),
           ),
         ),
@@ -32,9 +32,9 @@ class VariantsCatalogPressable extends StatelessWidget {
       buildBlock(
         'Press',
         Style(
-          onPress(
+          onPressed(
             box.border(
-              color: $colors.primary(),
+              color: $md.colorScheme.primary(),
               width: 2,
             ),
             box.padding(4.0),

demo/lib/docs/variants/default.dart

@@ -7,11 +7,11 @@ class VariantsDefaultExample extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final style = Style(
-      box.color($colors.secondary()),
-      text.style.color.of($colors.onSecondary),
+      box.color($md.colorScheme.secondary()),
+      text.style.color.of($md.colorScheme.onSecondary),
       onHover(
-        box.color.of($colors.primary),
-        text.style(color: $colors.onPrimary()),
+        box.color.of($md.colorScheme.primary),
+        text.style(color: $md.colorScheme.onPrimary()),
       ),
     );
 

demo/lib/views/basic_example.dart

@@ -24,13 +24,13 @@ class BasicExample extends HookWidget {
       box.borderRadius(10),
       box.shapeDecoration.color.white(),
       text.style.color.white(),
-      onPress(
+      onPressed(
         box.color(Colors.black),
       ),
       onHover(
         opacity(0.5),
       ),
-      onLongPress(
+      onLongPressed(
         box.color(Colors.green),
       ),
     );
@@ -79,10 +79,10 @@ class BasicExample extends HookWidget {
             style: onSurfaceMix.merge(
               Style(
                 onLight(
-                  text.style.color.of($colors.error),
+                  text.style.color.of($md.colorScheme.error),
                 ),
                 onDark(
-                  text.style.color.of($colors.primary),
+                  text.style.color.of($md.colorScheme.primary),
                 ),
               ),
             ),
@@ -117,7 +117,7 @@ class BasicExample extends HookWidget {
                 style: onSurfaceMix.merge(
                   Style(
                     icon.size(70),
-                    icon.color.of($colors.secondary),
+                    icon.color.of($md.colorScheme.secondary),
                   ),
                 ),
               ),

demo/lib/views/button_example.dart

@@ -23,7 +23,7 @@ class ButtonSizeVariants {
 
 Style get _baseStyle => Style(
       box.borderRadius(4),
-      onPress(
+      onPressed(
         scale(0.95),
       ),
       flex.mainAxisAlignment.center(),
@@ -32,7 +32,7 @@ Style get _baseStyle => Style(
         decoration: TextDecoration.none,
         fontWeight: FontWeight.w600,
       ),
-      text.style.of($textStyles.bodySmall),
+      text.style.of($md.textTheme.bodySmall),
       flex.mainAxisSize.min(),
       ButtonSizeVariants.small(
         box.padding.horizontal(10),
@@ -143,11 +143,11 @@ Style get _style => Style(
         color: const Color(0xFFFF004C),
       ),
       box.color(const Color(0x0F07E2FF)),
-      icon.color.of($colors.onBackground),
+      icon.color.of($md.colorScheme.onBackground),
       onDisabled(
-        box.color.of($colors.background),
-        text.style.color.of($colors.onBackground),
-        icon.color.of($colors.onBackground),
+        box.color.of($md.colorScheme.background),
+        text.style.color.of($md.colorScheme.onBackground),
+        icon.color.of($md.colorScheme.onBackground),
       ),
     );
 

demo/lib/views/example.dart

@@ -65,14 +65,14 @@ class CustomMixWidget extends StatelessWidget {
       box.margin.vertical(10),
       box.elevation(10),
       box.borderRadius(10),
-      box.color($colors.primary()),
-      text.style.of($textStyles.bodyMedium),
-      text.style(color: $colors.onPrimary()),
+      box.color($md.colorScheme.primary()),
+      text.style.of($md.textTheme.bodyMedium),
+      text.style(color: $md.colorScheme.onPrimary()),
       onHover(
         box.elevation(2),
         box.padding(20),
-        box.color.of($colors.secondary),
-        text.style.color.of($colors.onSecondary),
+        box.color.of($md.colorScheme.secondary),
+        text.style.color.of($md.colorScheme.onSecondary),
       ),
     );
 

demo/lib/views/layout_example.dart

@@ -8,9 +8,9 @@ Style get mix => Style(
       box.width(300),
       box.borderRadius(10),
       box.elevation(2),
-      box.color.of($colors.surface),
+      box.color.of($md.colorScheme.surface),
       box.alignment.center(),
-      text.style.color.of($colors.onSurface),
+      text.style.color.of($md.colorScheme.onSurface),
     );
 
 class LayoutExample extends StatelessWidget {

demo/lib/views/typography_example.dart

@@ -4,13 +4,13 @@ import 'package:mix/mix.dart';
 import '../styles.dart';
 
 Style get button => Style(
-      text.style.of($textStyles.bodyMedium),
+      text.style.of($md.textTheme.bodyMedium),
       box.padding.top(10),
       text.style.bold(),
       text.style(fontSize: 6.0),
-      box.color.of($colors.primary),
+      box.color.of($md.colorScheme.primary),
       onHover(
-        box.color.of($colors.secondary),
+        box.color.of($md.colorScheme.secondary),
       ),
       box.padding(8, 15),
     );
@@ -38,22 +38,22 @@ class TypographyExample extends StatelessWidget {
             style: headingMix.merge(
               Style(
                 text.style(
-                  color: $colors.surface(),
+                  color: $md.colorScheme.surface(),
                   fontWeight: FontWeight.bold,
                   fontStyle: FontStyle.italic,
                   letterSpacing: 2,
                   wordSpacing: 2,
                   height: 1.5,
                   shadows: [
                     Shadow(
-                      color: $colors.secondary(),
+                      color: $md.colorScheme.secondary(),
                       offset: const Offset(2, 2),
                       blurRadius: 2,
                     ),
                   ],
                 ),
                 onDark(
-                  text.style.color.of($colors.surface),
+                  text.style.color.of($md.colorScheme.surface),
                 ),
               ),
             ),

demo/lib/views/variants.dart

@@ -19,20 +19,20 @@ class VariantsExample extends HookWidget {
     );
 
     final style = Style(
-      box.color($colors.primary()),
-      text.style(color: $colors.onPrimary()),
+      box.color($md.colorScheme.primary()),
+      text.style(color: $md.colorScheme.onPrimary()),
       onHover(
-        box.color($colors.secondary()),
-        text.style(color: $colors.onPrimary()),
+        box.color($md.colorScheme.secondary()),
+        text.style(color: $md.colorScheme.onPrimary()),
       ),
     ).merge(baseStyle);
 
     final onDarkStyle = Style(
-      box.color($colors.primary()),
-      text.style(color: $colors.onPrimary()),
+      box.color($md.colorScheme.primary()),
+      text.style(color: $md.colorScheme.onPrimary()),
       onDark(
         box.color(Colors.red),
-        text.style(color: $colors.onPrimary()),
+        text.style(color: $md.colorScheme.onPrimary()),
       ),
     ).merge(baseStyle);
 

demo/lib/widgetbook.dart

@@ -36,7 +36,7 @@ class WidgetbookApp extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return MixTheme(
-      data: MixThemeData.withMaterialTokens(),
+      data: MixThemeData.withMaterial(),
       child: Widgetbook.material(
         directories: directories,
         addons: [materialTheme],