foundation: update token docs

dartdoc_options.yaml

@@ -0,0 +1,22 @@
+dartdoc:
+  ignore:
+    - ambiguous-doc-reference
+    - unresolved-doc-reference
+  errors:
+    #- unresolved-doc-reference
+  warnings:
+    - tool-error
+  categories:
+    Flume:
+      markdown: doc/flume.md
+      name: Flume
+    Foundation:
+      markdown: doc/foundation.md
+      name: Foundation
+    Components:
+      markdown: doc/components.md
+      name: Components
+  categoryOrder: [Flume, Foundation, Components]
+  examplePathPrefix: example/
+  showUndocumentedCategories: true
+  favicon: assets/docs/favicon.ico

doc/components.md

@@ -0,0 +1 @@
+# Components

doc/flume.md

@@ -0,0 +1,14 @@
+# Flume
+
+Implementation of Gameflow's Flume design system.
+
+Contains libraries for both the design tokens as well as Flutter implementations of all UI components.
+
+## Getting started
+
+```dart
+FlumeApp(
+    theme: Flume.fallback(),
+    child: YourApp(),
+),
+```

doc/foundation.md

@@ -0,0 +1,12 @@
+# Foundation
+
+The Foundation library consists of all Flume's design tokens put together;
+
+- Breakpoints
+- Colors
+- Motion
+- Palette
+- Shadows
+- Shapes
+- Spacing
+- Typography

lib/flume.dart

@@ -1,3 +1,4 @@
+/// The Flume design system implemented in Dart/Flutter.
 library flume;
 
 export 'package:flume/src/foundation.dart';

lib/src/components/icons.dart

@@ -15,6 +15,7 @@ class _FlumeIconData extends IconData {
 }
 
 /// {@category Components}
+/// {@subCategory Icons}
 /// Icons defined by Flume.
 @immutable
 class FlumeIcon {

lib/src/foundation.dart

@@ -1,6 +1,7 @@
+/// Contains all design tokens.
 library foundation;
 
-export 'package:flume/src/foundation/border_radius.dart';
+export 'package:flume/src/foundation/shapes.dart';
 export 'package:flume/src/foundation/breakpoints.dart';
 export 'package:flume/src/foundation/colors.dart';
 export 'package:flume/src/foundation/motion.dart';

lib/src/foundation/breakpoints.dart

@@ -1,4 +1,5 @@
 /// {@category Foundation}
+/// {@subCategory Breakpoints}
 /// Breakpoints defined by Flume.
 class Breakpoints {
   const Breakpoints({
@@ -11,6 +12,7 @@ class Breakpoints {
   });
 
   /// {@category Foundation}
+  /// {@subCategory Breakpoints}
   /// Default breakpoints defined by Flume.
   factory Breakpoints.fallback() => const Breakpoints(
         xs: 464,

lib/src/foundation/colors.dart

@@ -3,6 +3,7 @@ import 'package:flutter/foundation.dart';
 import 'package:flutter/painting.dart';
 
 /// {@category Foundation}
+/// {@subCategory Colors}
 /// Color scheme defined by Flume.
 class Colors {
   const Colors({
@@ -89,6 +90,7 @@ class Colors {
   });
 
   /// {@category Foundation}
+  /// {@subCategory Colors}
   /// Default color scheme.
   factory Colors.fallback() => const Colors(
         brightness: Brightness.dark,

lib/src/foundation/motion.dart

@@ -1,4 +1,5 @@
 /// {@category Foundation}
+/// {@subCategory Motion}
 /// Motion durations defined by Flume.
 class Motion {
   const Motion({
@@ -9,6 +10,7 @@ class Motion {
   });
 
   /// {@category Foundation}
+  /// {@subCategory Motion}
   /// Default motion durations defined by Flume.
   factory Motion.fallback() => const Motion(
         enabled: true,
@@ -18,6 +20,7 @@ class Motion {
       );
 
   /// {@category Foundation}
+  /// {@subCategory Motion}
   /// Returns a disabled motion instance.
   /// Used for devices with reduced motion.
   factory Motion.disabled() => const Motion(

lib/src/foundation/palette.dart

@@ -1,6 +1,7 @@
 import 'package:flutter/painting.dart';
 
 /// {@category Foundation}
+/// {@subCategory Colors}
 /// All colors defined by Flume.
 class FlumePalette {
   // Theme

lib/src/foundation/shadows.dart

@@ -1,6 +1,7 @@
 import 'package:flutter/painting.dart';
 
 /// {@category Foundation}
+/// {@subCategory Shadows}
 /// Shadows defined by Flume.
 class Shadows {
   const Shadows({
@@ -13,6 +14,7 @@ class Shadows {
   });
 
   /// {@category Foundation}
+  /// {@subCategory Shadows}
   /// Default shadows defined by Flume.
   factory Shadows.fallback() => const Shadows(
         xs: BoxShadow(

lib/src/foundation/border_radius.dart → lib/src/foundation/shapes.dart

@@ -1,16 +1,18 @@
 /// {@category Foundation}
-/// Border radii defined by Flume.
-class BorderRadius {
-  const BorderRadius({
+/// {@subCategory Shapes}
+/// Shapes and borders defined by Flume.
+class Shapes {
+  const Shapes({
     required double xs,
     required double sm,
     required double md,
     required double lg,
   });
 
   /// {@category Foundation}
-  /// Default border radii defined by Flume.
-  factory BorderRadius.fallback() => const BorderRadius(
+  /// {@subCategory Shapes}
+  /// Default shapes defined by Flume.
+  factory Shapes.fallback() => const Shapes(
         xs: 2,
         sm: 4,
         md: 6,

lib/src/foundation/spacing.dart

@@ -1,6 +1,7 @@
 import 'package:flutter/rendering.dart';
 
 /// {@category Foundation}
+/// {@subCategory Spacing}
 /// Spacing defined by Flume.
 class Spacing {
   final double xxxs;
@@ -24,6 +25,7 @@ class Spacing {
   });
 
   /// {@category Foundation}
+  /// {@subCategory Spacing}
   /// Default spacing defined by Flume.
   factory Spacing.fallback() => const Spacing(
         xxxs: 2,
@@ -37,12 +39,12 @@ class Spacing {
       );
 
   /// {@category Foundation}
+  /// {@subCategory Spacing}
   /// EdgeInsets with the same spacing on all sides.
   EdgeInsetsData insets() => EdgeInsetsData(this);
 }
 
-/// {@category Foundation}
-/// Utility class for using Flume spacing with Flutter's EdgeInsets.
+/// Utility class for using Flume spacing with Flutter's [EdgeInsets].
 class EdgeInsetsData {
   final Spacing _spacing;
 

lib/src/foundation/theme.dart

@@ -1,4 +1,4 @@
-import 'package:flume/src/foundation/border_radius.dart';
+import 'package:flume/src/foundation/shapes.dart';
 import 'package:flume/src/foundation/breakpoints.dart';
 import 'package:flume/src/foundation/colors.dart';
 import 'package:flume/src/foundation/motion.dart';
@@ -7,11 +7,12 @@ import 'package:flume/src/foundation/spacing.dart';
 import 'package:flume/src/foundation/typography.dart';
 
 /// {@category Foundation}
+/// {@subCategory Theme}
 /// A theme instance containing all Flume design tokens.
 class Theme {
   const Theme({
     required this.breakpoints,
-    required this.borderRadius,
+    required this.shapes,
     required this.colors,
     required this.motion,
     required this.shadows,
@@ -20,38 +21,46 @@ class Theme {
   });
 
   /// {@category Foundation}
+  /// {@subCategory Breakpoints}
   /// Breakpoints defined by Flume.
   final Breakpoints breakpoints;
 
   /// {@category Foundation}
+  /// {@subCategory Shapes}
   /// Border radii defined by Flume.
-  final BorderRadius borderRadius;
+  final Shapes shapes;
 
   /// {@category Foundation}
+  /// {@subCategory Colors}
   /// Color scheme defined by Flume.
   final Colors colors;
 
   /// {@category Foundation}
+  /// {@subCategory Motion}
   /// Motion durations defined by Flume.
   final Motion motion;
 
   /// {@category Foundation}
+  /// {@subCategory Shadows}
   /// Shadows defined by Flume.
   final Shadows shadows;
 
   /// {@category Foundation}
+  /// {@subCategory Spacing}
   /// Spacing defined by Flume.
   final Spacing spacing;
 
   /// {@category Foundation}
+  /// {@subCategory Typography}
   /// Typography defined by Flume.
   final Typography typography;
 
   /// {@category Foundation}
+  /// {@subCategory Theme}
   /// Default theme defined by Flume.
   factory Theme.fallback() => Theme(
         breakpoints: Breakpoints.fallback(),
-        borderRadius: BorderRadius.fallback(),
+        shapes: Shapes.fallback(),
         colors: Colors.fallback(),
         motion: Motion.fallback(),
         shadows: Shadows.fallback(),

lib/src/foundation/typography.dart

@@ -1,6 +1,5 @@
 import 'package:flutter/painting.dart';
 
-/// {@category Foundation}
 /// Baseline typography data.
 class TypographyData {
   const TypographyData({
@@ -12,6 +11,7 @@ class TypographyData {
 }
 
 /// {@category Foundation}
+/// {@subCategory Typography}
 /// Typography defined by Flume.
 class Typography {
   const Typography({
@@ -31,6 +31,7 @@ class Typography {
   });
 
   /// {@category Foundation}
+  /// {@subCategory Typography}
   /// Default typography defined by Flume.
   factory Typography.fallback() => const Typography(
         header1: TypographyData(