adding icon names

example/widgetbook/pages/assets/icon_widgetbook.dart

@@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
 import 'package:widgetbook/widgetbook.dart';
 import 'package:zeta_flutter/zeta_flutter.dart';
 
@@ -12,17 +13,46 @@ WidgetbookComponent iconWidgetbook() {
       WidgetbookUseCase(
         name: 'All Icons',
         builder: (context) {
-          List<IconData> icons = (context.knobs.boolean(label: 'Rounded', initialValue: true)
-              ? [...iconsRounded]
-              : [...iconsSharp])
-            ..sort((a, b) => a.codePoint < b.codePoint ? 1 : 0);
+          Map<String, IconData> icons =
+              (context.knobs.boolean(label: 'Rounded', initialValue: true)) ? iconsRounded : iconsSharp;
+
           return WidgetbookTestWidget(
             removeBody: true,
             widget: SingleChildScrollView(
-              child: Wrap(
-                spacing: ZetaSpacing.b,
-                runSpacing: ZetaSpacing.b,
-                children: icons.map((e) => Icon(e, size: ZetaSpacing.x10)).toList(),
+              child: Center(
+                child: Column(
+                  children: [
+                    Text('Tap icon to copy name to clipboard', style: ZetaTextStyles.titleMedium)
+                        .paddingAll(ZetaSpacing.l),
+                    Wrap(
+                      spacing: ZetaSpacing.l,
+                      runSpacing: ZetaSpacing.l,
+                      children: icons.entries.map(
+                        (e) {
+                          final nameArr = e.key.split('_')..removeLast();
+                          return Container(
+                            width: 100,
+                            height: 100,
+                            child: InkWell(
+                              borderRadius: ZetaRadius.rounded,
+                              hoverColor: Zeta.of(context).colors.surfaceHovered,
+                              onTap: () async {
+                                await Clipboard.setData(ClipboardData(text: 'ZetaIcons.' + e.key));
+                              },
+                              child: Column(
+                                mainAxisAlignment: MainAxisAlignment.center,
+                                children: [
+                                  Icon(e.value, size: 40),
+                                  Text(nameArr.join(' '), textAlign: TextAlign.center)
+                                ],
+                              ),
+                            ),
+                          );
+                        },
+                      ).toList(),
+                    ),
+                  ],
+                ),
               ),
             ),
           );

example/widgetbook/pages/theme/radius_widgetbook.dart

@@ -0,0 +1,75 @@
+import 'package:flutter/material.dart';
+import 'package:widgetbook/widgetbook.dart';
+
+import 'package:zeta_flutter/zeta_flutter.dart';
+
+WidgetbookComponent radiusWidgetbook() {
+  return WidgetbookComponent(
+    name: 'Radius',
+    useCases: [
+      WidgetbookUseCase(
+        name: 'Radius',
+        builder: (context) => SingleChildScrollView(
+          child: Row(
+            mainAxisAlignment: MainAxisAlignment.center,
+            crossAxisAlignment: CrossAxisAlignment.center,
+            children: [
+              Column(
+                children: radii.entries
+                    .map((obj) => _RadiiDemo(obj))
+                    .divide(const SizedBox.square(dimension: ZetaSpacing.l))
+                    .toList(),
+              ).paddingTop(ZetaSpacing.l),
+            ],
+          ),
+        ),
+      ),
+    ],
+  );
+}
+
+Map<String, BorderRadius> radii = {
+  'none': ZetaRadius.none,
+  'minimal': ZetaRadius.minimal,
+  'rounded': ZetaRadius.rounded,
+  'wide': ZetaRadius.wide,
+  'full': ZetaRadius.full,
+};
+
+class _RadiiDemo extends StatelessWidget {
+  final MapEntry<String, BorderRadius> obj;
+  const _RadiiDemo(this.obj);
+
+  @override
+  Widget build(BuildContext context) {
+    final colors = Zeta.of(context).colors;
+
+    return Container(
+      width: 250,
+      height: 250,
+      decoration: BoxDecoration(
+        borderRadius: obj.value,
+        color: Zeta.of(context).colors.blue.shade30,
+        border: Border.all(color: colors.blue.shade80, width: 3),
+      ),
+      child: Center(
+        child: Container(
+          decoration: BoxDecoration(
+            borderRadius: obj.value,
+            color: Zeta.of(context).colors.surfacePrimary,
+            border: Border.all(color: colors.blue.shade50, width: 3),
+          ),
+          padding: EdgeInsets.all(ZetaSpacing.b),
+          child: Text(
+            'ZetaRadius.' + obj.key,
+            style: ZetaTextStyles.titleMedium.apply(
+              color: Zeta.of(context).colors.textDefault,
+              fontStyle: FontStyle.normal,
+              decoration: TextDecoration.none,
+            ),
+          ),
+        ),
+      ),
+    );
+  }
+}

example/widgetbook/pages/theme/spacing_widgetbook.dart

@@ -15,7 +15,7 @@ WidgetbookComponent spacingWidgetBook() {
             children: [
               Column(
                 crossAxisAlignment: CrossAxisAlignment.start,
-                children: namedSpacings.entries.map((obj) => _SizeObject(obj)).toList(),
+                children: namedSpacings.entries.map((obj) => _SpacingDemo(obj)).toList(),
               )
             ],
           ),
@@ -28,7 +28,7 @@ WidgetbookComponent spacingWidgetBook() {
             children: [
               Column(
                 crossAxisAlignment: CrossAxisAlignment.start,
-                children: valueSpacings.entries.map((obj) => _SizeObject(obj)).toList(),
+                children: valueSpacings.entries.map((obj) => _SpacingDemo(obj)).toList(),
               )
             ],
           ),
@@ -70,10 +70,10 @@ Map<String, double> valueSpacings = {
   'x24': ZetaSpacing.x24,
 };
 
-class _SizeObject extends StatelessWidget {
+class _SpacingDemo extends StatelessWidget {
   final MapEntry<String, double> size;
 
-  const _SizeObject(this.size);
+  const _SpacingDemo(this.size);
 
   @override
   Widget build(BuildContext context) {

example/widgetbook/widgetbook.dart

@@ -13,6 +13,7 @@ import 'pages/theme/color_widgetbook.dart';
 import 'pages/components/banner_widgetbook.dart';
 import 'pages/components/chip_widgetbook.dart';
 import 'pages/components/password_input_widgetbook.dart';
+import 'pages/theme/radius_widgetbook.dart';
 import 'pages/theme/spacing_widgetbook.dart';
 import 'pages/theme/typography_widgetbook.dart';
 import 'utils/zebra.dart';
@@ -43,7 +44,7 @@ class HotReload extends StatelessWidget {
         WidgetbookCategory(
           name: 'Theme',
           isInitiallyExpanded: false,
-          children: [textWidgetBook(), colorWidgetBook(), spacingWidgetBook()]
+          children: [textWidgetBook(), colorWidgetBook(), spacingWidgetBook(), radiusWidgetbook()]
             ..sort((a, b) => a.name.compareTo(b.name)),
         ),
         WidgetbookCategory(
@@ -72,7 +73,6 @@ class HotReload extends StatelessWidget {
           ],
           themeBuilder: (context, theme, child) {
             _Theme _theme = theme;
-            // Wrap use cases with the custom theme's InheritedWidget
             return ZetaProvider(
               initialContrast: _theme.isAAA ? ZetaContrast.aaa : ZetaContrast.aa,
               initialThemeMode: _theme.isDark ? ThemeMode.dark : ThemeMode.light,