Update DevTools extensions readme (#7659)

packages/devtools_app/lib/src/screens/inspector/inspector_tree_controller.dart

@@ -39,13 +39,13 @@ class _InspectorTreeRowWidget extends StatefulWidget {
   /// Constructs a [_InspectorTreeRowWidget] that presents a line in the
   /// Inspector tree.
   const _InspectorTreeRowWidget({
-    required Key key,
+    required super.key,
     required this.row,
     required this.inspectorTreeState,
     this.error,
     required this.scrollControllerX,
     required this.viewportWidth,
-  }) : super(key: key);
+  });
 
   final _InspectorTreeState inspectorTreeState;
 

packages/devtools_app/lib/src/shared/charts/README.md

@@ -39,7 +39,7 @@ In all cases, the above 4 traces share the same X-Axis time scale.  However, the
 First, create a StatefulWidget to contain the chart e.g.,
 ```
 class MyChart extends StatefulWidget {
-  MyChart({Key key}) : super(key: key);
+  MyChart({super.key});
 
   final controller = ChartController();
 

packages/devtools_app/lib/src/shared/console/widgets/display_provider.dart

@@ -114,7 +114,7 @@ class _DisplayProviderState extends State<DisplayProvider> {
               ),
               if (isHovered && widget.onCopy != null)
                 DevToolsButton(
-                  icon: Icons.copy,
+                  icon: Icons.copy_outlined,
                   outlined: false,
                   onPressed: () => widget.onCopy!.call(widget.variable),
                 ),

packages/devtools_app_shared/lib/src/ui/common.dart

@@ -15,7 +15,7 @@ import 'theme/theme.dart';
 /// This is typically used as a title for a logical area of the screen.
 class AreaPaneHeader extends StatelessWidget implements PreferredSizeWidget {
   const AreaPaneHeader({
-    Key? key,
+    super.key,
     required this.title,
     this.maxLines = 1,
     this.actions = const [],
@@ -28,7 +28,7 @@ class AreaPaneHeader extends StatelessWidget implements PreferredSizeWidget {
     this.includeBottomBorder = true,
     this.includeLeftBorder = false,
     this.includeRightBorder = false,
-  }) : super(key: key);
+  });
 
   final Widget title;
   final int maxLines;
@@ -213,13 +213,13 @@ final class RoundedOutlinedBorder extends StatelessWidget {
 /// [showTop], [showBottom], [showLeft] or [showRight] to false.
 final class OutlineDecoration extends StatelessWidget {
   const OutlineDecoration({
-    Key? key,
+    super.key,
     this.child,
     this.showTop = true,
     this.showBottom = true,
     this.showLeft = true,
     this.showRight = true,
-  }) : super(key: key);
+  });
 
   factory OutlineDecoration.onlyBottom({required Widget? child}) =>
       OutlineDecoration(
@@ -286,9 +286,9 @@ BorderSide defaultBorderSide(ThemeData theme) {
 /// Convenience [Divider] with [Padding] that provides a good divider in forms.
 final class PaddedDivider extends StatelessWidget {
   const PaddedDivider({
-    Key? key,
+    super.key,
     this.padding = const EdgeInsets.only(bottom: 10.0),
-  }) : super(key: key);
+  });
 
   const PaddedDivider.thin({super.key})
       : padding = const EdgeInsets.only(bottom: 4.0);
@@ -317,7 +317,7 @@ final class PaddedDivider extends StatelessWidget {
 ///    omitted.
 class DevToolsButton extends StatelessWidget {
   const DevToolsButton({
-    Key? key,
+    super.key,
     required this.onPressed,
     this.icon,
     this.label,
@@ -327,11 +327,10 @@ class DevToolsButton extends StatelessWidget {
     this.elevated = false,
     this.outlined = true,
     this.tooltipPadding,
-  })  : assert(
+  }) : assert(
           label != null || icon != null,
           'Either icon or label must be specified.',
-        ),
-        super(key: key);
+        );
 
   factory DevToolsButton.iconOnly({
     required IconData icon,
@@ -467,7 +466,7 @@ class DevToolsButton extends StatelessWidget {
 /// common delay before the tooltip is shown.
 final class DevToolsTooltip extends StatelessWidget {
   const DevToolsTooltip({
-    Key? key,
+    super.key,
     this.message,
     this.richMessage,
     required this.child,
@@ -477,8 +476,7 @@ final class DevToolsTooltip extends StatelessWidget {
     this.padding = const EdgeInsets.all(defaultSpacing),
     this.decoration,
     this.textStyle,
-  })  : assert((message == null) != (richMessage == null)),
-        super(key: key);
+  }) : assert((message == null) != (richMessage == null));
 
   final String? message;
   final InlineSpan? richMessage;
@@ -515,14 +513,14 @@ final class DevToolsTooltip extends StatelessWidget {
 
 final class DevToolsToggleButtonGroup extends StatelessWidget {
   const DevToolsToggleButtonGroup({
-    Key? key,
+    super.key,
     required this.children,
     required this.selectedStates,
     required this.onPressed,
     this.fillColor,
     this.selectedColor,
     this.borderColor,
-  }) : super(key: key);
+  });
 
   final List<Widget> children;
 
@@ -561,15 +559,15 @@ final class DevToolsToggleButtonGroup extends StatelessWidget {
 
 final class DevToolsToggleButton extends StatelessWidget {
   const DevToolsToggleButton({
-    Key? key,
+    super.key,
     required this.onPressed,
     required this.isSelected,
     required this.message,
     required this.icon,
     this.outlined = true,
     this.label,
     this.shape,
-  }) : super(key: key);
+  });
 
   final String message;
 
@@ -722,12 +720,12 @@ final class ButtonGroupItemData {
 
 final class DevToolsFilterButton extends StatelessWidget {
   const DevToolsFilterButton({
-    Key? key,
+    super.key,
     required this.onPressed,
     required this.isFilterActive,
     this.message = 'Filter',
     this.outlined = true,
-  }) : super(key: key);
+  });
 
   final VoidCallback onPressed;
   final bool isFilterActive;

packages/devtools_app_shared/lib/src/ui/flex_split_column.dart

@@ -23,7 +23,7 @@ import 'split_pane.dart';
 /// adjusting the sizes of the children.
 final class FlexSplitColumn extends StatelessWidget {
   FlexSplitColumn({
-    Key? key,
+    super.key,
     required this.totalHeight,
     required this.headers,
     required List<Widget> children,
@@ -39,8 +39,7 @@ final class FlexSplitColumn extends StatelessWidget {
           headers,
           totalHeight,
         ),
-        _minSizes = modifyMinSizesToIncludeFirstHeader(minSizes, headers),
-        super(key: key);
+        _minSizes = modifyMinSizesToIncludeFirstHeader(minSizes, headers);
 
   /// The headers that will be laid out above each corresponding child in
   /// [children].

packages/devtools_app_shared/lib/src/ui/split_pane.dart

@@ -23,16 +23,15 @@ import '../utils/utils.dart';
 final class SplitPane extends StatefulWidget {
   /// Builds a split oriented along [axis].
   SplitPane({
-    Key? key,
+    super.key,
     required this.axis,
     required this.children,
     required this.initialFractions,
     this.minSizes,
     this.splitters,
   })  : assert(children.length >= 2),
         assert(initialFractions.length >= 2),
-        assert(children.length == initialFractions.length),
-        super(key: key) {
+        assert(children.length == initialFractions.length) {
     _verifyFractionsSumTo1(initialFractions);
     if (minSizes != null) {
       assert(minSizes!.length == children.length);