Add global WIDGETBOOK-INDEX.md and refactor use case method names for consistency across components

This commit is contained in:
Emily Pauli 2025-10-25 23:29:49 +02:00
commit f135a6a5f7
10 changed files with 49 additions and 19 deletions

View file

@ -0,0 +1,23 @@
# Widgetbook — Global Index
This document lists all packages integrated into the Widgetbook along with links to their perpackage indices. Each perpackage INDEX contains the list of components and use cases available for that package.
Packages
- [app_bar_m3e](lib/app_bar_m3e/INDEX-app_bar_m3e.md)
- [button_group_m3e](lib/button_group_m3e/INDEX-button_group_m3e.md)
- [button_m3e](lib/button_m3e/INDEX-button_m3e.md)
- [fab_m3e](lib/fab_m3e/INDEX-fab_m3e.md)
- [icon_button_m3e](lib/icon_button_m3e/INDEX-icon_button_m3e.md)
- [loading_indicator_m3e](lib/loading_indicator_m3e/INDEX-loading_indicator_m3e.md)
- [m3e_design](lib/m3e_design/INDEX-m3e_design.md)
- [navigation_bar_m3e](lib/navigation_bar_m3e/INDEX-navigation_bar_m3e.md)
- [navigation_rail_m3e](lib/navigation_rail_m3e/INDEX-navigation_rail_m3e.md)
- [progress_indicator_m3e](lib/progress_indicator_m3e/INDEX-progress_indicator_m3e.md)
- [slider_m3e](lib/slider_m3e/INDEX-slider_m3e.md)
- [split_button_m3e](lib/split_button_m3e/INDEX-split_button_m3e.md)
- [toolbar_m3e](lib/toolbar_m3e/INDEX-toolbar_m3e.md)
Notes
- Theme switching and text scale are enabled in the Widgetbook app (see lib/main.dart).
- All default variants use the build[Component]DefaultUseCase(BuildContext) naming.
- If you notice a missing or broken link, please open an issue or fix in the corresponding package directory.

View file

@ -5,9 +5,9 @@
# IDEs (https://dart.dev/tools#ides-and-editors). The analyzer can also be
# invoked from the command line by running `flutter analyze`.
# The following line activates a set of recommended lints for Flutter apps,
# packages, and plugins designed to encourage good coding practices.
include: package:flutter_lints/flutter.yaml
# The following line activates a set of recommended lints.
# In this workspace, defer to the repo root analysis options to keep consistency.
include: ../analysis_options.yaml
linter:
# The lint rules applied to this project can be customized in the

View file

@ -132,7 +132,7 @@ Clip _knobClipBehavior(BuildContext context, {Clip initial = Clip.none}) =>
);
@UseCase(name: 'default', type: ButtonGroupM3E)
Widget buildButtonGroupM3EUseCase(BuildContext context) {
Widget buildButtonGroupM3EDefaultUseCase(BuildContext context) {
final ButtonGroupM3EType type = _knobType(context);
final ButtonGroupM3EShape shape = _knobShape(context);
final ButtonGroupM3ESize size = _knobSize(context);

View file

@ -118,7 +118,7 @@ Widget _buildDemo(
}
@UseCase(name: 'default', type: ButtonM3E)
Widget buildButtonM3EUseCase(BuildContext context) {
Widget buildButtonM3EDefaultUseCase(BuildContext context) {
// Default uses filled style; other params adjustable with knobs
return _buildDemo(context, style: ButtonM3EStyle.filled);
}

View file

@ -78,7 +78,7 @@ Widget _buildFab(
}
@widgetbook.UseCase(name: 'default', type: FabM3E)
Widget buildFabM3EUseCase(BuildContext context) {
Widget buildFabM3EDefaultUseCase(BuildContext context) {
return _buildFab(context, kind: FabM3EKind.primary);
}

View file

@ -12,7 +12,7 @@ import 'package:widgetbook_annotation/widgetbook_annotation.dart';
// - Complex objects get meaningful defaults with TODOs.
@UseCase(name: 'default', type: IconButtonM3E)
Widget buildIconButtonM3EUseCase(BuildContext context) {
Widget buildIconButtonM3EDefaultUseCase(BuildContext context) {
final bool isToggle = context.knobs.boolean(
label: 'is toggle (provides selected state)',
initialValue: true,

View file

@ -1,5 +1,3 @@
import 'package:flutter/material.dart';
import 'package:loading_indicator_m3e/loading_indicator_m3e.dart';
import 'package:material_new_shapes/material_new_shapes.dart';
@ -23,9 +21,17 @@ List<RoundedPolygon> _polygonSet(String id) {
case 'cookie→oval':
return [MaterialShapes.cookie9Sided, MaterialShapes.oval];
case 'softBurst→pill→sunny':
return [MaterialShapes.softBurst, MaterialShapes.pill, MaterialShapes.sunny];
return [
MaterialShapes.softBurst,
MaterialShapes.pill,
MaterialShapes.sunny
];
case 'triangle→square→pentagon':
return [MaterialShapes.triangle, MaterialShapes.square, MaterialShapes.pentagon];
return [
MaterialShapes.triangle,
MaterialShapes.square,
MaterialShapes.pentagon
];
default:
return [
MaterialShapes.softBurst,
@ -120,7 +126,9 @@ Widget buildExpressiveLoadingIndicatorColorAndSemanticsUseCase(
);
}
@UseCase(name: 'edge: invalid polygons (debug assert)', type: ExpressiveLoadingIndicator)
@UseCase(
name: 'edge: invalid polygons (debug assert)',
type: ExpressiveLoadingIndicator)
Widget buildExpressiveLoadingIndicatorInvalidPolygonsUseCase(
BuildContext context) {
final enableInvalid = context.knobs.boolean(

View file

@ -53,7 +53,7 @@ List<RoundedPolygon> _polygonSet(String id) {
}
@UseCase(name: 'default', type: LoadingIndicatorM3E)
Widget buildLoadingIndicatorM3EUseCase(BuildContext context) {
Widget buildLoadingIndicatorM3EDefaultUseCase(BuildContext context) {
// Keep defaults: tokens-based sizing and colors, subtle container.
return const Center(
child: LoadingIndicatorM3E(),

View file

@ -1,12 +1,12 @@
import 'package:flutter/material.dart';
import 'package:navigation_rail_m3e/navigation_rail_m3e.dart';
import 'package:widgetbook/widgetbook.dart';
import 'package:widgetbook_annotation/widgetbook_annotation.dart' as widgetbook;
import 'package:navigation_rail_m3e/navigation_rail_m3e.dart';
// Note: RailBadgeM3E shows nothing when count is null; dot when 0; count otherwise.
@widgetbook.UseCase(name: 'default', type: RailBadgeM3E)
Widget buildRailBadgeM3EUseCase(BuildContext context) {
Widget buildRailBadgeM3EDefaultUseCase(BuildContext context) {
final count = context.knobs.intOrNull.slider(
label: 'count',
initialValue: 7,

View file

@ -1,9 +1,7 @@
import 'package:flutter/material.dart';
import 'package:toolbar_m3e/toolbar_m3e.dart';
import 'package:widgetbook/widgetbook.dart';
import 'package:widgetbook_annotation/widgetbook_annotation.dart';
import 'package:toolbar_m3e/toolbar_m3e.dart';
@UseCase(name: 'default', type: ToolbarIconButtonM3E)
Widget buildToolbarIconButtonM3EDefaultUseCase(BuildContext context) {
@ -51,7 +49,8 @@ Widget buildToolbarIconButtonM3EDestructiveUseCase(BuildContext context) {
}
@UseCase(name: 'custom_color_and_size', type: ToolbarIconButtonM3E)
Widget buildToolbarIconButtonM3ECustomStyleUseCase(BuildContext context) {
Widget buildToolbarIconButtonM3ECustomColorAndSizeUseCase(
BuildContext context) {
final color = context.knobs.color(label: 'color', initialValue: Colors.teal);
final iconSize = context.knobs.double.slider(
label: 'iconSize',