Typography revamp

CONTRIBUTING.md

@@ -97,41 +97,6 @@ They should:
 5. implement `operator ==` and `hashCode`.
 
 
-Widget should not scale `TextStyle`S during initialization. `TextStyle`s should be scaled in a widget's build method instead.
-This avoids confusion about whether `TextStyle`s are automatically scaled inside widget styles.
-
-✅ Prefer this:
-```dart
-class FooStyle {
-  final TextStyle text;
-
-  FooStyle.inherit({FFont font, FColorScheme scheme}): text = const TextStyle(size: 1);
-}
-
-class Foo extends StatelessWidget {
-  final FooStyle style;
-
-  @overrride
-  Widget build(BuildContext context) => Text('Hi', style: style.text.withFont(context.theme.font));
-}
-```
-
-❌ Instead of:
-```dart
-class FooStyle {
-  final TextStyle text;
-
-  FooStyle.inherit({FFont font, FColorScheme scheme}): text = const TextStyle(size: 1).withFont(font);
-}
-
-class Foo extends StatelessWidget {
-  final FooStyle style;
-
-  @overrride
-  Widget build(BuildContext context) => Text('Hi', style: style.text);
-}
-```
-
 ## Expose `String` and `Widget` variants of the same parameter.
 
 Widgets typically contain string-based content such as titles and labels. These widgets should expose a `String` and

forui/example/lib/main.dart

@@ -53,16 +53,16 @@ class _ExampleWidgetState extends State<ExampleWidget> {
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [
           FButton(
-            design: FButtonVariant.destructive,
+            style: FButtonStyle.destructive,
             label: 'Delete?',
             onPress: () => showAdaptiveDialog(
               context: context,
               builder: (context) => FDialog(
-                alignment: FDialogAlignment.horizontal,
+                direction: Axis.horizontal,
                 title: 'Are you absolutely sure?',
                 body: 'This action cannot be undone. This will permanently delete your account and remove your data from our servers.',
                 actions: [
-                  FButton(design: FButtonVariant.outline, label: 'Cancel', onPress: () {
+                  FButton(style: FButtonStyle.outline, label: 'Cancel', onPress: () {
                     Navigator.of(context).pop();
                   }),
                   FButton(label: 'Continue', onPress: () {}),

forui/lib/forui.dart

@@ -17,9 +17,9 @@ export 'src/theme/typography.dart';
 export 'src/theme/themes.dart';
 
 // Widgets
-export 'src/widgets/badge/badge.dart' hide FBadgeContent;
+export 'src/widgets/badge/badge.dart' hide FBadgeContent, Variant;
 export 'src/foundation/tappable.dart' hide FTappable;
-export 'src/widgets/button/button.dart' hide FButtonContent;
+export 'src/widgets/button/button.dart' hide FButtonContent, Variant;
 export 'src/widgets/card/card.dart' hide FCardContent;
 export 'src/widgets/dialog/dialog.dart' hide FDialogContent, FHorizontalDialogContent, FVerticalDialogContent;
 export 'src/widgets/header/header.dart';

forui/lib/src/theme/color_scheme.dart

@@ -111,7 +111,7 @@ final class FColorScheme with Diagnosticable {
     required this.border,
   });
 
-  /// Creates a copy of this [FColorScheme] with the given properties replaced.
+  /// Returns a copy of this [FColorScheme] with the given properties replaced.
   ///
   /// ```dart
   /// final scheme = FColorScheme(

forui/lib/src/theme/style.dart

@@ -25,7 +25,7 @@ final class FStyle with Diagnosticable {
     this.borderWidth = 1,
   });
 
-  /// Creates a copy of this [FStyle] with the given properties replaced.
+  /// Returns a copy of this [FStyle] with the given properties replaced.
   ///
   /// ```dart
   /// final style = FStyle(

forui/lib/src/theme/theme.dart

@@ -75,7 +75,8 @@ class FTheme extends StatelessWidget {
   ///    );
   ///  }
   /// ```
-  @useResult static FThemeData of(BuildContext context) {
+  @useResult
+  static FThemeData of(BuildContext context) {
     final theme = context.dependOnInheritedWidgetOfExactType<_InheritedTheme>();
     return theme?.data ?? FThemes.zinc.light;
   }
@@ -99,25 +100,25 @@ class FTheme extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) => _InheritedTheme(
-    data: data,
-    child: Directionality(
-      textDirection: textDirection ?? Directionality.of(context),
-      child: DefaultTextStyle(
-        style: data.typography.toTextStyle(
-          fontSize: data.typography.base,
-          color: data.colorScheme.foreground,
+        data: data,
+        child: Directionality(
+          textDirection: textDirection ?? Directionality.of(context),
+          child: DefaultTextStyle(
+            style: data.typography.base.copyWith(
+              fontFamily: data.typography.defaultFontFamily,
+              color: data.colorScheme.foreground,
+            ),
+            child: child,
+          ),
         ),
-        child: child,
-      ),
-    ),
-  );
+      );
 
   @override
   void debugFillProperties(DiagnosticPropertiesBuilder properties) {
     super.debugFillProperties(properties);
     properties
-      ..add(DiagnosticsProperty<FThemeData>('data', data, showName: false))
-      ..add(EnumProperty<TextDirection?>('textDirection', textDirection));
+      ..add(DiagnosticsProperty('data', data, showName: false))
+      ..add(EnumProperty('textDirection', textDirection));
   }
 }
 
@@ -132,13 +133,12 @@ class _InheritedTheme extends InheritedWidget {
   @override
   void debugFillProperties(DiagnosticPropertiesBuilder properties) {
     super.debugFillProperties(properties);
-    properties.add(DiagnosticsProperty<FThemeData>('data', data));
+    properties.add(DiagnosticsProperty('data', data));
   }
 }
 
 /// Provides functions for accessing the current [FThemeData].
 extension ThemeBuildContext on BuildContext {
-
   /// Returns the current [FThemeData], or [FThemes.zinc.light] if there is no ancestor [FTheme].
   ///
   /// ## Troubleshooting:
@@ -180,5 +180,4 @@ extension ThemeBuildContext on BuildContext {
   ///  }
   /// ```
   FThemeData get theme => FTheme.of(this);
-
 }

forui/lib/src/theme/theme_data.dart

@@ -70,24 +70,33 @@ final class FThemeData with Diagnosticable {
   });
 
   /// Creates a [FThemeData] that configures the widget styles using the given properties.
-  FThemeData.inherit({
-    required this.colorScheme,
-    this.typography = const FTypography(),
-    this.style = const FStyle(),
-  })  : badgeStyles = FBadgeStyles.inherit(colorScheme: colorScheme, typography: typography, style: style),
-        buttonStyles = FButtonStyles.inherit(
-          colorScheme: colorScheme,
-          typography: typography,
-          style: style,
-        ),
-        cardStyle = FCardStyle.inherit(colorScheme: colorScheme, typography: typography, style: style),
-        dialogStyle = FDialogStyle.inherit(style: style, colorScheme: colorScheme, typography: typography),
-        headerStyle = FHeaderStyle.inherit(colorScheme: colorScheme, typography: typography),
-        textFieldStyle = FTextFieldStyle.inherit(colorScheme: colorScheme, typography: typography, style: style),
-        separatorStyles = FSeparatorStyles.inherit(colorScheme: colorScheme, style: style),
-        switchStyle = FSwitchStyle.inherit(colorScheme: colorScheme);
-
-  /// Creates a copy of this [FThemeData] with the given properties replaced.
+  factory FThemeData.inherit({
+    required FColorScheme colorScheme,
+    FStyle style = const FStyle(),
+    FTypography? typography,
+  }) {
+    typography ??= FTypography.inherit(colorScheme: colorScheme);
+
+    return FThemeData(
+      colorScheme: colorScheme,
+      typography: typography,
+      style: style,
+      badgeStyles: FBadgeStyles.inherit(colorScheme: colorScheme, typography: typography, style: style),
+      buttonStyles: FButtonStyles.inherit(
+        colorScheme: colorScheme,
+        typography: typography,
+        style: style,
+      ),
+      cardStyle: FCardStyle.inherit(colorScheme: colorScheme, typography: typography, style: style),
+      dialogStyle: FDialogStyle.inherit(style: style, colorScheme: colorScheme, typography: typography),
+      headerStyle: FHeaderStyle.inherit(colorScheme: colorScheme, typography: typography),
+      textFieldStyle: FTextFieldStyle.inherit(colorScheme: colorScheme, typography: typography, style: style),
+      separatorStyles: FSeparatorStyles.inherit(colorScheme: colorScheme, style: style),
+      switchStyle: FSwitchStyle.inherit(colorScheme: colorScheme),
+    );
+  }
+
+  /// Returns a copy of this [FThemeData] with the given properties replaced.
   ///
   /// ```dart
   /// final foo = FTypography();
@@ -103,7 +112,8 @@ final class FThemeData with Diagnosticable {
   /// print(theme.colorScheme == copy.colorScheme); // true
   /// print(copy.typography); // bar
   /// ```
-  @useResult FThemeData copyWith({
+  @useResult
+  FThemeData copyWith({
     FColorScheme? colorScheme,
     FTypography? typography,
     FStyle? style,