refactor: use storybook and atomic design (#16)

BREAKING CHANGE: rewrite most of the Typescript types, so the content format (the meta in particular) needs to be updated.

1 files changed, 29 insertions, 0 deletions

diff --git a/src/components/atoms/layout/column.stories.tsx b/src/components/atoms/layout/column.stories.tsx
new file mode 100644
index 0000000..a03c462
--- /dev/null
+++ b/src/components/atoms/layout/column.stories.tsx
@@ -0,0 +1,29 @@
+import { ComponentMeta, ComponentStory } from '@storybook/react';
+import ColumnComponent from './column';
+
+export default {
+  title: 'Atoms/Layout/Column',
+  component: ColumnComponent,
+  argTypes: {
+    children: {
+      description: 'The column body.',
+      type: {
+        name: 'array',
+        required: true,
+        value: {},
+      },
+    },
+  },
+} as ComponentMeta<typeof ColumnComponent>;
+
+const Template: ComponentStory<typeof ColumnComponent> = (args) => (
+  <ColumnComponent {...args} />
+);
+
+const body =
+  'Non praesentium voluptas quisquam ex est. Distinctio accusamus facilis libero in aut. Et veritatis quo impedit fugit amet sit accusantium. Ut est rerum asperiores sint libero eveniet. Molestias placeat recusandae suscipit eligendi sunt hic.';
+
+export const Column = Template.bind({});
+Column.args = {
+  children: body,
+};