Add TextField

CONTRIBUTING.md

@@ -138,4 +138,17 @@ class Foo extends StatelessWidget {
 * Avoid [double negatives](https://en.wikipedia.org/wiki/Double_negative) when naming things, i.e. a boolean field should
   be named `enabled` instead of `disabled`.
 
+* Avoid past tense when naming callbacks, prefer present tense instead.
+
+  ✅ Prefer this:
+  ```dart
+  final VoidCallback onPress;
+  ```
+
+  ❌ Instead of:
+  ```dart
+  final VoidCallback onPressed;
+  ```
+
+
 * Prefix all publicly exported widgets and styles with `F`, i.e. `FScaffold`.

forui/example/lib/main.dart

@@ -32,55 +32,5 @@ class ExampleWidget extends StatelessWidget {
   const ExampleWidget({super.key});
 
   @override
-  Widget build(BuildContext context) {
-    final font = context.theme.font;
-
-    return ListView(
-      children: [
-        FHeader(
-          title: 'Notification - A very long message',
-          actions: [
-            FHeaderAction(
-              icon: FAssets.icons.alarmClock,
-              onPress: null,
-            ),
-            FHeaderAction(
-              icon: FAssets.icons.plus,
-              onPress: () {},
-            ),
-          ],
-        ),
-        const SizedBox(height: 40),
-        FCard(
-          title: 'Notification',
-          subtitle: 'You have 3 unread messages.',
-          child: const Text(
-            'Material default font size of 14. (text-sm)',
-            style: TextStyle(fontSize: 14),
-          ),
-        ),
-        const SizedBox(height: 10),
-        Container(
-          alignment: Alignment.centerLeft,
-          child: FBadge(label: 'New'),
-        ),
-        Text(
-          'text-xs',
-          style: TextStyle(fontSize: font.xs).withFont(font),
-        ),
-        Text(
-          'text-sm',
-          style: TextStyle(fontSize: font.sm).withFont(font),
-        ),
-        Text(
-          'text-base',
-          style: TextStyle(fontSize: font.base).withFont(font),
-        ),
-        Text(
-          'text-lg',
-          style: TextStyle(fontSize: font.lg).withFont(font),
-        ),
-      ],
-    );
-  }
+  Widget build(BuildContext context) => ListView();
 }

forui/example/pubspec.lock

@@ -214,6 +214,11 @@ packages:
     description: flutter
     source: sdk
     version: "0.0.0"
+  flutter_localizations:
+    dependency: transitive
+    description: flutter
+    source: sdk
+    version: "0.0.0"
   flutter_svg:
     dependency: transitive
     description:
@@ -297,6 +302,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "4.0.2"
+  intl:
+    dependency: transitive
+    description:
+      name: intl
+      sha256: d6f56758b7d3014a48af9701c085700aac781a92a87a62b1333b46d8879661cf
+      url: "https://pub.dev"
+    source: hosted
+    version: "0.19.0"
   io:
     dependency: transitive
     description:

forui/lib/forui.dart

@@ -25,3 +25,4 @@ export 'src/widgets/header/header.dart';
 export 'src/widgets/box.dart';
 export 'src/widgets/separator.dart';
 export 'src/widgets/switch.dart';
+export 'src/widgets/text_field/text_field.dart';

forui/lib/src/theme/color_scheme.dart

@@ -8,6 +8,9 @@ import 'package:forui/forui.dart';
 /// See the pre-defined themes' color schemes in [FThemes].
 final class FColorScheme with Diagnosticable {
 
+  /// The system brightness.
+  final Brightness brightness;
+
   /// The background color.
   final Color background;
 
@@ -43,6 +46,7 @@ final class FColorScheme with Diagnosticable {
 
   /// Creates a [FColorScheme].
   const FColorScheme({
+    required this.brightness,
     required this.background,
     required this.foreground,
     required this.primary,
@@ -58,6 +62,7 @@ final class FColorScheme with Diagnosticable {
 
   /// Creates a copy of this [FColorScheme] with the given properties replaced.
   FColorScheme copyWith({
+    Brightness? brightness,
     Color? background,
     Color? foreground,
     Color? primary,
@@ -71,6 +76,7 @@ final class FColorScheme with Diagnosticable {
     Color? border,
   }) =>
       FColorScheme(
+        brightness: brightness ?? this.brightness,
         background: background ?? this.background,
         foreground: foreground ?? this.foreground,
         primary: primary ?? this.primary,
@@ -88,6 +94,7 @@ final class FColorScheme with Diagnosticable {
   void debugFillProperties(DiagnosticPropertiesBuilder properties) {
     super.debugFillProperties(properties);
     properties
+      ..add(EnumProperty('brightness', brightness))
       ..add(ColorProperty('background', background))
       ..add(ColorProperty('foreground', foreground))
       ..add(ColorProperty('primary', primary))
@@ -103,6 +110,7 @@ final class FColorScheme with Diagnosticable {
 
   @override
   bool operator ==(Object other) => identical(this, other) || other is FColorScheme &&
+    brightness == other.brightness &&
     background == other.background &&
     foreground == other.foreground &&
     primary == other.primary &&
@@ -117,6 +125,7 @@ final class FColorScheme with Diagnosticable {
 
   @override
   int get hashCode =>
+    brightness.hashCode ^
     background.hashCode ^
     foreground.hashCode ^
     primary.hashCode ^

forui/lib/src/theme/theme_data.dart

@@ -34,6 +34,9 @@ class FThemeData with Diagnosticable {
   /// The switch style.
   final FSwitchStyle switchStyle;
 
+  /// The text field style.
+  final FTextFieldStyle textFieldStyle;
+
   /// Creates a [FThemeData].
   FThemeData({
     required this.colorScheme,
@@ -46,6 +49,7 @@ class FThemeData with Diagnosticable {
     required this.boxStyle,
     required this.separatorStyles,
     required this.switchStyle,
+    required this.textFieldStyle,
   });
 
   /// Creates a [FThemeData] that inherits the given properties.
@@ -63,7 +67,8 @@ class FThemeData with Diagnosticable {
         headerStyle = FHeaderStyle.inherit(colorScheme: colorScheme, font: font),
         boxStyle = FBoxStyle.inherit(colorScheme: colorScheme),
         separatorStyles = FSeparatorStyles.inherit(colorScheme: colorScheme, style: style),
-        switchStyle = FSwitchStyle.inherit(colorScheme: colorScheme);
+        switchStyle = FSwitchStyle.inherit(colorScheme: colorScheme),
+        textFieldStyle = FTextFieldStyle.inherit(colorScheme: colorScheme, font: font, style: style);
 
   /// Creates a copy of this [FThemeData] with the given properties replaced.
   FThemeData copyWith({
@@ -77,6 +82,7 @@ class FThemeData with Diagnosticable {
     FBoxStyle? boxStyle,
     FSeparatorStyles? separatorStyles,
     FSwitchStyle? switchStyle,
+    FTextFieldStyle? textFieldStyle,
   }) =>
       FThemeData(
         colorScheme: colorScheme ?? this.colorScheme,
@@ -89,22 +95,24 @@ class FThemeData with Diagnosticable {
         boxStyle: boxStyle ?? this.boxStyle,
         separatorStyles: separatorStyles ?? this.separatorStyles,
         switchStyle: switchStyle ?? this.switchStyle,
+        textFieldStyle: textFieldStyle ?? this.textFieldStyle,
       );
 
   @override
   void debugFillProperties(DiagnosticPropertiesBuilder properties) {
     super.debugFillProperties(properties);
     properties
-      ..add(DiagnosticsProperty<FColorScheme>('colorScheme', colorScheme, level: DiagnosticLevel.debug))
-      ..add(DiagnosticsProperty<FFont>('font', font, level: DiagnosticLevel.debug))
-      ..add(DiagnosticsProperty<FStyle>('style', style, level: DiagnosticLevel.debug))
-      ..add(DiagnosticsProperty<FBadgeStyles>('badgeStyles', badgeStyles, level: DiagnosticLevel.debug))
-      ..add(DiagnosticsProperty<FButtonStyles>('buttonStyles', buttonStyles, level: DiagnosticLevel.debug))
-      ..add(DiagnosticsProperty<FCardStyle>('cardStyle', cardStyle, level: DiagnosticLevel.debug))
-      ..add(DiagnosticsProperty<FHeaderStyle>('headerStyle', headerStyle, level: DiagnosticLevel.debug))
-      ..add(DiagnosticsProperty<FBoxStyle>('boxStyle', boxStyle, level: DiagnosticLevel.debug))
-      ..add(DiagnosticsProperty<FSeparatorStyles>('separatorStyles', separatorStyles, level: DiagnosticLevel.debug))
-      ..add(DiagnosticsProperty<FSwitchStyle>('switchStyle', switchStyle));
+      ..add(DiagnosticsProperty('colorScheme', colorScheme, level: DiagnosticLevel.debug))
+      ..add(DiagnosticsProperty('font', font, level: DiagnosticLevel.debug))
+      ..add(DiagnosticsProperty('style', style, level: DiagnosticLevel.debug))
+      ..add(DiagnosticsProperty('badgeStyles', badgeStyles, level: DiagnosticLevel.debug))
+      ..add(DiagnosticsProperty('buttonStyles', buttonStyles, level: DiagnosticLevel.debug))
+      ..add(DiagnosticsProperty('cardStyle', cardStyle, level: DiagnosticLevel.debug))
+      ..add(DiagnosticsProperty('headerStyle', headerStyle, level: DiagnosticLevel.debug))
+      ..add(DiagnosticsProperty('boxStyle', boxStyle, level: DiagnosticLevel.debug))
+      ..add(DiagnosticsProperty('separatorStyles', separatorStyles, level: DiagnosticLevel.debug))
+      ..add(DiagnosticsProperty('switchStyle', switchStyle, level: DiagnosticLevel.debug))
+      ..add(DiagnosticsProperty('textFieldStyle', textFieldStyle, level: DiagnosticLevel.debug));
   }
 
   @override
@@ -121,7 +129,8 @@ class FThemeData with Diagnosticable {
           headerStyle == other.headerStyle &&
           boxStyle == other.boxStyle &&
           separatorStyles == other.separatorStyles &&
-          switchStyle == other.switchStyle;
+          switchStyle == other.switchStyle &&
+          textFieldStyle == other.textFieldStyle;
 
   @override
   int get hashCode =>
@@ -134,5 +143,6 @@ class FThemeData with Diagnosticable {
       headerStyle.hashCode ^
       boxStyle.hashCode ^
       separatorStyles.hashCode ^
-      switchStyle.hashCode;
+      switchStyle.hashCode ^
+      textFieldStyle.hashCode;
 }

forui/lib/src/theme/themes.dart

@@ -1,15 +1,16 @@
+import 'package:flutter/foundation.dart';
 import 'package:flutter/widgets.dart';
 
 import 'package:forui/forui.dart';
 
 /// The Forui themes.
 extension FThemes on Never {
-
   /// The light and dark variants of the [Zinc](https://ui.shadcn.com/themes) theme.
   static final zinc = (
     light: FThemeData.inherit(
       font: FFont(),
       colorScheme: const FColorScheme(
+        brightness: Brightness.light,
         background: Color(0xFFFFFFFF),
         foreground: Color(0xFF09090B),
         primary: Color(0xFF18181B),
@@ -27,6 +28,7 @@ extension FThemes on Never {
     dark: FThemeData.inherit(
       font: FFont(),
       colorScheme: const FColorScheme(
+        brightness: Brightness.dark,
         background: Color(0xFF09090B),
         foreground: Color(0xFFFAFAFA),
         primary: Color(0xFFFAFAFA),

forui/lib/src/widgets/card/card.dart

@@ -9,7 +9,7 @@ part 'card_content.dart';
 
 /// A card widget.
 final class FCard extends StatelessWidget {
-  /// The style.
+  /// The style. Defaults to [FThemeData.cardStyle].
   final FCardStyle? style;
 
   /// The child.