vinzcelavi · January 14, 2022 16:08 · Jan 14, 2022
diff --git a/Checkbox.stories.js b/Checkbox.stories.js
@@ -0,0 +1,45 @@
+import React, { createElement, useState } from 'react';
+import { storiesOf } from '@storybook/react';
+import Checkbox from './Checkbox';
+import Grid from '../Grid/Grid';
+import { StoryWrapper, Wrap } from '../Mixins';
+
+storiesOf('Forms/Checkbox', module).add('Default', () =>
+  createElement(() => {
+    const [isChecked, setIsChecked] = useState([0, 0, 0, 0]);
+
+    return (
+      <StoryWrapper>
+        <Wrap>
+          <h2>Checkbox</h2>
+          <Grid smCol="2" mdCol="2">
+            <Checkbox
+              name="checkbox01"
+              label="Checkbox 01"
+              onChange={() => setIsChecked([1, 0, 0, 0])}
+              checked={isChecked[0]}
+            />
+            <Checkbox
+              name="checkbox02"
+              label="Checkbox 02"
+              onChange={() => setIsChecked([0, 1, 0, 0])}
+              checked={isChecked[1]}
+            />
+            <Checkbox
+              name="checkbox03"
+              label="Checkbox 03"
+              onChange={() => setIsChecked([0, 0, 1, 0])}
+              checked={isChecked[2]}
+            />
+            <Checkbox
+              name="checkbox04"
+              label="Checkbox 04"
+              onChange={() => setIsChecked([0, 0, 0, 1])}
+              checked={isChecked[3]}
+            />
+          </Grid>
+        </Wrap>
+      </StoryWrapper>
+    );
+  }),
+);