Checkbox (#9)

* checkbox

* remove comment

* widgetbook

* widgetbook

example/lib/home.dart

@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:go_router/go_router.dart';
 import 'package:zeta_example/pages/color_example.dart';
+import 'package:zeta_example/pages/checkbox_example.dart';
 import 'package:zeta_example/pages/grid_example.dart';
 import 'package:zeta_example/pages/spacing_example.dart';
 import 'package:zeta_example/pages/typography_example.dart';
@@ -19,6 +20,8 @@ final List<Component> components = [
   Component(SpacingExample.name, (context) => const SpacingExample()),
   Component(TypographyExample.name, (context) => const TypographyExample()),
   Component(ColorExample.name, (context) => const ColorExample()),
+  Component(CheckBoxExample.name, (context) => const CheckBoxExample()),
+
 ];
 
 class Home extends StatefulWidget {

example/lib/pages/checkbox_example.dart

@@ -0,0 +1,79 @@
+import 'package:flutter/material.dart';
+import 'package:zeta_flutter/zeta_flutter.dart';
+
+import '../widgets.dart';
+
+class CheckBoxExample extends StatefulWidget {
+  static const String name = 'Checkbox';
+
+  const CheckBoxExample({Key? key}) : super(key: key);
+
+  @override
+  State<CheckBoxExample> createState() => _CheckBoxExampleState();
+}
+
+class _CheckBoxExampleState extends State<CheckBoxExample> {
+  bool? isChecked = true;
+  bool isEnabled = true;
+
+  @override
+  Widget build(BuildContext context) {
+    return ExampleScaffold(
+      name: 'Checkbox',
+      child: Center(
+        child: Column(
+          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
+          children: [
+            Row(
+              crossAxisAlignment: CrossAxisAlignment.center,
+              mainAxisAlignment: MainAxisAlignment.spaceAround,
+              children: [
+                ZetaCheckbox(
+                    value: isChecked,
+                    isEnabled: isEnabled,
+                    onChanged: (value) => setState(() => isChecked = value)),
+                ElevatedButton(
+                  child: const Text('Disable'),
+                  onPressed: () => setState(() => isEnabled = !isEnabled),
+                )
+              ],
+            ),
+            Row(children: [const Text('Sharp Checkbox Enabled')]),
+            getCheckBoxRow(isEnabled: true),
+            Row(children: [const Text('Sharp Checkbox Disabled')]),
+            getCheckBoxRow(isEnabled: false),
+            Row(children: [const Text('Rounded Checkbox Enabled')]),
+            getCheckBoxRow(isEnabled: true, isSharp: false),
+            Row(children: [const Text('Rounded Checkbox Disabled')]),
+            getCheckBoxRow(isEnabled: false, isSharp: false),
+          ],
+        ),
+      ),
+    );
+  }
+}
+
+Row getCheckBoxRow({required bool isEnabled, bool isSharp = true}) {
+  return Row(
+      crossAxisAlignment: CrossAxisAlignment.center,
+      mainAxisAlignment: MainAxisAlignment.spaceAround,
+      children: [
+        ZetaCheckbox(
+            value: true,
+            isEnabled: isEnabled,
+            label: 'Selected',
+            borderType: isSharp ? BorderType.sharp : BorderType.rounded,
+            onChanged: (value) => {}),
+        ZetaCheckbox(
+            value: false,
+            isEnabled: isEnabled,
+            label: 'Indeterminate',
+            borderType: isSharp ? BorderType.sharp : BorderType.rounded,
+            onChanged: (value) => {}),
+        ZetaCheckbox(
+            value: null,
+            borderType: isSharp ? BorderType.sharp : BorderType.rounded,
+            isEnabled: isEnabled,
+            onChanged: (value) => {}),
+      ]);
+}

example/test/checkbox_test.dart

@@ -0,0 +1,73 @@
+import 'package:flutter_test/flutter_test.dart';
+import 'package:zeta_flutter/zeta_flutter.dart';
+import 'package:flutter/material.dart';
+
+void main() {
+  group('ZetaCheckbox Tests', () {
+    testWidgets('Initializes with correct parameters',
+        (WidgetTester tester) async {
+      await tester.pumpWidget(
+        TestWidgetCB(
+            widget: ZetaCheckbox(
+          value: true,
+          onChanged: (value) {},
+          borderType: BorderType.rounded,
+          label: 'Test Checkbox',
+          checkboxSize: Size(30, 30),
+        )),
+      );
+
+      final checkboxFinder = find.byType(ZetaCheckbox);
+      final ZetaCheckbox checkbox = tester.firstWidget(checkboxFinder);
+
+      expect(checkbox.value, true);
+      expect(checkbox.borderType, BorderType.rounded);
+      expect(checkbox.label, 'Test Checkbox');
+      expect(checkbox.checkboxSize, Size(30, 30));
+    });
+
+    testWidgets('ZetaCheckbox changes state on tap', (WidgetTester tester) async {
+      bool? checkboxValue = true;
+
+      await tester.pumpWidget(
+        TestWidgetCB(
+            widget: ZetaCheckbox(
+          value: checkboxValue,
+          onChanged: (value) {
+            checkboxValue = value;
+          },
+        )),
+      );
+
+      await tester.tap(find.byType(ZetaCheckbox));
+      await tester.pump();
+
+      expect(checkboxValue, false);
+    });
+  });
+}
+
+class TestWidgetCB extends StatelessWidget {
+  final Widget widget;
+
+  const TestWidgetCB({Key? key, required this.widget});
+
+  @override
+  Widget build(BuildContext context) {
+    return ZetaProvider(
+      builder: (context, theme, __) {
+        return Builder(builder: (context) {
+          return MaterialApp(
+            theme: ThemeData(
+              fontFamily: theme.fontFamily,
+              textTheme: ZetaText.textTheme,
+            ),
+            home: Scaffold(
+              body: widget,
+            ),
+          );
+        });
+      },
+    );
+  }
+}

example/widgetbook/components/checkbox_widgetbook.dart

@@ -0,0 +1,38 @@
+import 'package:flutter/material.dart';
+import 'package:widgetbook/widgetbook.dart';
+import 'package:zeta_example/pages/checkbox_example.dart';
+
+WidgetbookComponent checkboxWidgetBook() {
+  return WidgetbookComponent(
+    name: 'Checkbox',
+    useCases: [
+      WidgetbookUseCase(
+        name: 'Checkbox (sharp)',
+        builder: (context) => SingleChildScrollView(
+          child: Padding(
+            padding: EdgeInsets.only(top: 10),
+            child: getCheckBoxRow(isEnabled: true),
+          ),
+        ),
+      ),
+      WidgetbookUseCase(
+        name: 'Checkbox (rounded)',
+        builder: (context) => SingleChildScrollView(
+          child: Padding(
+            padding: EdgeInsets.only(top: 10),
+            child: getCheckBoxRow(isEnabled: true, isSharp: false),
+          ),
+        ),
+      ),
+      WidgetbookUseCase(
+        name: 'Checkbox disabled (rounded)',
+        builder: (context) => SingleChildScrollView(
+          child: Padding(
+            padding: EdgeInsets.only(top: 10),
+            child: getCheckBoxRow(isEnabled: false, isSharp: false),
+          ),
+        ),
+      ),
+    ],
+  );
+}

example/widgetbook/widgetbook.dart

@@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
 import 'package:widgetbook/widgetbook.dart';
 import 'package:zeta_flutter/zeta_flutter.dart';
 
+import 'components/checkbox_widgetbook.dart';
 import 'components/color_widgetbook.dart';
 import 'components/grid_widgetbook.dart';
 import 'components/spacing_widgetbook.dart';
@@ -24,6 +25,7 @@ class HotReload extends StatelessWidget {
                 spacingWidgetbook(),
                 textWidgetBook(),
                 colorWidgetBook(),
+                checkboxWidgetBook()
               ],
             ),
           ],