diff --git a/notes/flutter_web/lib/assets.g.dart b/notes/flutter_web/lib/assets.g.dart
index a486bad8..d379ff0e 100644
--- a/notes/flutter_web/lib/assets.g.dart
+++ b/notes/flutter_web/lib/assets.g.dart
@@ -99,21 +99,23 @@ mixin AssetsMixin {
   final Asset lib_routes_notes_Improve_app_event_listener_lifeycle_page_dart = Asset('lib/routes/notes/Improve_app/event&listener&lifeycle/page.dart');
   final Asset lib_routes_notes_Improve_app_i18n_page_dart = Asset('lib/routes/notes/Improve_app/i18n/page.dart');
   final Asset lib_routes_notes_pure_dart_exception_page_dart = Asset('lib/routes/notes/pure_dart/exception/page.dart');
+  final Asset lib_routes_notes_cheatsheets_widgets__examples_Form_ButtonStyleButton_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Form_ButtonStyleButton.dart');
   final Asset lib_routes_notes_cheatsheets_widgets__examples_Navigation_BottomAppBar_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Navigation_BottomAppBar.dart');
   final Asset lib_routes_notes_cheatsheets_widgets__examples_Navigation_Menu_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Navigation_Menu.dart');
-  final Asset lib_routes_notes_cheatsheets_widgets__examples_Input_FloatingActionButton_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Input_FloatingActionButton.dart');
   final Asset lib_routes_notes_cheatsheets_widgets__examples_Navigation_TabBar_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Navigation_TabBar.dart');
   final Asset lib_routes_notes_cheatsheets_widgets__examples_Navigation_NavigationDrawer_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Navigation_NavigationDrawer.dart');
   final Asset lib_routes_notes_cheatsheets_widgets__examples_Spacer_Placeholder_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Spacer_Placeholder.dart');
-  final Asset lib_routes_notes_cheatsheets_widgets__examples_Input_SearchAnchor_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Input_SearchAnchor.dart');
+  final Asset lib_routes_notes_cheatsheets_widgets__examples_Form_Checkbox_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Form_Checkbox.dart');
   final Asset lib_routes_notes_cheatsheets_widgets__examples_Navigation_SliverAppBar_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Navigation_SliverAppBar.dart');
-  final Asset lib_routes_notes_cheatsheets_widgets__examples_Input_IconButton_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Input_IconButton.dart');
   final Asset lib_routes_notes_cheatsheets_widgets__examples_LayoutCore_ContainerCell_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/LayoutCore_ContainerCell.dart');
   final Asset lib_routes_notes_cheatsheets_widgets__examples_Navigation_AppBar_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Navigation_AppBar.dart');
-  final Asset lib_routes_notes_cheatsheets_widgets__examples_Input_ButtonStyleButton_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Input_ButtonStyleButton.dart');
+  final Asset lib_routes_notes_cheatsheets_widgets__examples_Form_SearchAnchor_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Form_SearchAnchor.dart');
+  final Asset lib_routes_notes_cheatsheets_widgets__examples_Form_FloatingActionButton_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Form_FloatingActionButton.dart');
   final Asset lib_routes_notes_cheatsheets_widgets__examples_Navigation_NavigationBar_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Navigation_NavigationBar.dart');
   final Asset lib_routes_notes_cheatsheets_widgets__examples_Spacer_Spacer_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Spacer_Spacer.dart');
   final Asset lib_routes_notes_cheatsheets_widgets__examples_Navigation_NavigationRail_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Navigation_NavigationRail.dart');
+  final Asset lib_routes_notes_cheatsheets_widgets__examples_Form_SegmentButton_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Form_SegmentButton.dart');
+  final Asset lib_routes_notes_cheatsheets_widgets__examples_Form_IconButton_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Form_IconButton.dart');
   final Asset lib_routes_notes_cheatsheets_widgets__examples_Spacer_Divider_dart = Asset('lib/routes/notes/cheatsheets/widgets/_examples/Spacer_Divider.dart');
 }
 
diff --git a/notes/flutter_web/lib/routes/notes/cheatsheets/widgets/_examples/Form_Checkbox.dart b/notes/flutter_web/lib/routes/notes/cheatsheets/widgets/_examples/Form_Checkbox.dart
new file mode 100644
index 00000000..246a786a
--- /dev/null
+++ b/notes/flutter_web/lib/routes/notes/cheatsheets/widgets/_examples/Form_Checkbox.dart
@@ -0,0 +1,45 @@
+import 'package:flutter/material.dart';
+import 'package:you_flutter/state.dart';
+
+main() {
+  runApp(const MaterialApp(home: Scaffold(body: Form_Checkbox())));
+}
+
+// ignore: camel_case_types
+class Form_Checkbox extends StatefulWidget {
+  const Form_Checkbox({super.key});
+
+  @override
+  State<StatefulWidget> createState() {
+    return _State();
+  }
+}
+
+class _State extends State<Form_Checkbox> {
+  final Value<bool?> checkbox1 = (null as bool?).signal();
+  final Value<bool> checkbox2 = false.signal();
+
+  @override
+  Widget build(BuildContext context) {
+    return Watch(
+      builder: (context) {
+        return Column(
+          children: <Widget>[
+            Row(
+              children: [
+                const Text('tristate: true'),
+                Checkbox(tristate: true, checkColor: Colors.white, value: checkbox1.value, onChanged: (value) => checkbox1.value = value),
+              ],
+            ),
+            Row(
+              children: [
+                const Text('tristate: false'),
+                Checkbox(tristate: false, checkColor: Colors.white, value: checkbox2.value, onChanged: (value) => checkbox2.value = value!),
+              ],
+            ),
+          ],
+        );
+      },
+    );
+  }
+}
diff --git a/notes/flutter_web/lib/routes/notes/cheatsheets/widgets/_examples/Form_SegmentButton.dart b/notes/flutter_web/lib/routes/notes/cheatsheets/widgets/_examples/Form_SegmentButton.dart
new file mode 100644
index 00000000..2272bef6
--- /dev/null
+++ b/notes/flutter_web/lib/routes/notes/cheatsheets/widgets/_examples/Form_SegmentButton.dart
@@ -0,0 +1,61 @@
+import 'package:flutter/material.dart';
+import 'package:you_flutter/state.dart';
+
+main() {
+  runApp(const MaterialApp(home: Scaffold(body: Form_SegmentButton())));
+}
+
+// ignore: camel_case_types
+class Form_SegmentButton extends StatefulWidget {
+  const Form_SegmentButton({super.key});
+
+  @override
+  State<StatefulWidget> createState() {
+    return _State();
+  }
+}
+
+class _State extends State<Form_SegmentButton> {
+  final Value<ThemeMode> themeMode = ThemeMode.system.signal();
+  final Set<TargetPlatform> targetPlatforms = <TargetPlatform>{TargetPlatform.macOS, TargetPlatform.linux}.signal();
+
+  @override
+  Widget build(BuildContext context) {
+    return Watch(builder: (context) {
+      return Column(
+        mainAxisAlignment: MainAxisAlignment.spaceBetween,
+        children: [
+          SegmentedButton<ThemeMode>(
+            multiSelectionEnabled: false,
+            segments: const <ButtonSegment<ThemeMode>>[
+              ButtonSegment<ThemeMode>(value: ThemeMode.light, label: Text('Light'), icon: Icon(Icons.sunny)),
+              ButtonSegment<ThemeMode>(value: ThemeMode.system, label: Text('System'), icon: Icon(Icons.brightness_auto)),
+              ButtonSegment<ThemeMode>(value: ThemeMode.dark, label: Text('Dark'), icon: Icon(Icons.dark_mode)),
+            ],
+            selected: <ThemeMode>{themeMode.value},
+            onSelectionChanged: (newSelection) {
+              themeMode.value = newSelection.first;
+            },
+          ),
+          const SizedBox(height: 10),
+          SegmentedButton<TargetPlatform>(
+            segments: const <ButtonSegment<TargetPlatform>>[
+              ButtonSegment<TargetPlatform>(value: TargetPlatform.android, label: Text('android')),
+              ButtonSegment<TargetPlatform>(value: TargetPlatform.fuchsia, label: Text('fuchsia')),
+              ButtonSegment<TargetPlatform>(value: TargetPlatform.iOS, label: Text('iOS')),
+              ButtonSegment<TargetPlatform>(value: TargetPlatform.linux, label: Text('linux')),
+              ButtonSegment<TargetPlatform>(value: TargetPlatform.macOS, label: Text('macOS')),
+              ButtonSegment<TargetPlatform>(value: TargetPlatform.windows, label: Text('windows')),
+            ],
+            selected: targetPlatforms,
+            onSelectionChanged: (newSelection) {
+              targetPlatforms.clear();
+              targetPlatforms.addAll(newSelection);
+            },
+            multiSelectionEnabled: true,
+          ),
+        ],
+      );
+    });
+  }
+}
diff --git a/notes/flutter_web/lib/routes/notes/cheatsheets/widgets/page.dart b/notes/flutter_web/lib/routes/notes/cheatsheets/widgets/page.dart
index 2cc965cf..cd442f12 100644
--- a/notes/flutter_web/lib/routes/notes/cheatsheets/widgets/page.dart
+++ b/notes/flutter_web/lib/routes/notes/cheatsheets/widgets/page.dart
@@ -2,9 +2,11 @@ import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:flutter_web/app.dart';
 import 'package:flutter_web/routes/notes/cheatsheets/widgets/_examples/Form_ButtonStyleButton.dart';
+import 'package:flutter_web/routes/notes/cheatsheets/widgets/_examples/Form_Checkbox.dart';
 import 'package:flutter_web/routes/notes/cheatsheets/widgets/_examples/Form_FloatingActionButton.dart';
 import 'package:flutter_web/routes/notes/cheatsheets/widgets/_examples/Form_IconButton.dart';
 import 'package:flutter_web/routes/notes/cheatsheets/widgets/_examples/Form_SearchAnchor.dart';
+import 'package:flutter_web/routes/notes/cheatsheets/widgets/_examples/Form_SegmentButton.dart';
 import 'package:flutter_web/routes/notes/cheatsheets/widgets/_examples/LayoutCore_ContainerCell.dart';
 import 'package:flutter_web/routes/notes/cheatsheets/widgets/_examples/Navigation_AppBar.dart';
 import 'package:flutter_web/routes/notes/cheatsheets/widgets/_examples/Navigation_BottomAppBar.dart';
@@ -53,8 +55,8 @@ void build(BuildContext context, Cell print) {
         FlutterExample(title: "FloatingActionButton", source: assets.lib_routes_notes_cheatsheets_widgets__examples_Form_FloatingActionButton_dart, child: const Form_FloatingActionButton()),
         FlutterExample(title: "IconButton", source: assets.lib_routes_notes_cheatsheets_widgets__examples_Form_IconButton_dart, child: const Form_IconButton()),
         FlutterExample(title: "SearchAnchor", source: assets.lib_routes_notes_cheatsheets_widgets__examples_Form_SearchAnchor_dart, child: const Form_SearchAnchor()),
-        FlutterExample(title: "segmentButton", child: buttonAndInput.segmentButtonCell()),
-        FlutterExample(title: "Checkbox", child: buttonAndInput.checkbox()),
+        FlutterExample(title: "SegmentButton", source: assets.lib_routes_notes_cheatsheets_widgets__examples_Form_SegmentButton_dart, child: const Form_SegmentButton()),
+        FlutterExample(title: "Checkbox", source: assets.lib_routes_notes_cheatsheets_widgets__examples_Form_Checkbox_dart, child: const Form_Checkbox()),
         FlutterExample(title: "CheckboxListTile", child: buttonAndInput.checkboxListTile()),
         FlutterExample(title: "Chip", child: buttonAndInput.chip()),
         FlutterExample(title: "ActionChip", child: buttonAndInput.actionChip()),
@@ -91,47 +93,6 @@ void build(BuildContext context, Cell print) {
 }
 
 class ButtonAndInput {
-  Widget segmentButtonCell() {
-    Value<ThemeMode> themeMode = ThemeMode.system.signal();
-    Set<TargetPlatform> targetPlatforms = <TargetPlatform>{TargetPlatform.macOS, TargetPlatform.linux}.signal();
-
-    return Watch(builder: (context) {
-      return Column(
-        mainAxisAlignment: MainAxisAlignment.spaceBetween,
-        children: [
-          SegmentedButton<ThemeMode>(
-            multiSelectionEnabled: false,
-            segments: const <ButtonSegment<ThemeMode>>[
-              ButtonSegment<ThemeMode>(value: ThemeMode.light, label: Text('Light'), icon: Icon(Icons.sunny)),
-              ButtonSegment<ThemeMode>(value: ThemeMode.system, label: Text('System'), icon: Icon(Icons.brightness_auto)),
-              ButtonSegment<ThemeMode>(value: ThemeMode.dark, label: Text('Dark'), icon: Icon(Icons.dark_mode)),
-            ],
-            selected: <ThemeMode>{themeMode.value},
-            onSelectionChanged: (newSelection) {
-              themeMode.value = newSelection.first;
-            },
-          ),
-          const SizedBox(height: 10),
-          SegmentedButton<TargetPlatform>(
-            segments: const <ButtonSegment<TargetPlatform>>[
-              ButtonSegment<TargetPlatform>(value: TargetPlatform.android, label: Text('android')),
-              ButtonSegment<TargetPlatform>(value: TargetPlatform.fuchsia, label: Text('fuchsia')),
-              ButtonSegment<TargetPlatform>(value: TargetPlatform.iOS, label: Text('iOS')),
-              ButtonSegment<TargetPlatform>(value: TargetPlatform.linux, label: Text('linux')),
-              ButtonSegment<TargetPlatform>(value: TargetPlatform.macOS, label: Text('macOS')),
-              ButtonSegment<TargetPlatform>(value: TargetPlatform.windows, label: Text('windows')),
-            ],
-            selected: targetPlatforms,
-            onSelectionChanged: (newSelection) {
-              targetPlatforms.clear();
-              targetPlatforms.addAll(newSelection);
-            },
-            multiSelectionEnabled: true,
-          ),
-        ],
-      );
-    });
-  }
 
   Widget checkboxListTile() {
     final Value<bool?> checkboxListTile1 = (null as bool?).signal();
@@ -148,31 +109,6 @@ class ButtonAndInput {
     );
   }
 
-  Widget checkbox() {
-    final Value<bool?> checkbox1 = (null as bool?).signal();
-    final Value<bool> checkbox2 = false.signal();
-    return Watch(
-      builder: (context) {
-        return Column(
-          children: <Widget>[
-            Row(
-              children: [
-                const Text('tristate: true'),
-                Checkbox(tristate: true, checkColor: Colors.white, value: checkbox1.value, onChanged: (value) => checkbox1.value = value),
-              ],
-            ),
-            Row(
-              children: [
-                const Text('tristate: false'),
-                Checkbox(tristate: false, checkColor: Colors.white, value: checkbox2.value, onChanged: (value) => checkbox2.value = value!),
-              ],
-            ),
-          ],
-        );
-      },
-    );
-  }
-
   Widget chip() {
     final Set<TargetPlatform> targets = Set.of(TargetPlatform.values).signal();