fix(types): fix types and props for Column

fix types to use Record and add styles props for Column component
fix stories for Column with styles

resolves #39

Signed-off-by: Niloy Sikdar <niloysikdar30@gmail.com>

src/components/Column/Column.stories.tsx

@@ -22,4 +22,10 @@ export const Default = Template.bind({});
 Default.args = {
   children: <p style={{ margin: '0', fontSize: '30px' }}>Hello World</p>,
   align: 'center',
+  styles: {
+    column: {
+      backgroundColor: 'red',
+      color: 'white',
+    },
+  },
 };

src/components/Column/Column.tsx

@@ -1,20 +1,27 @@
 import { CSSProperties, ReactNode } from 'react';
+import { makeStyles } from '../../utils/makeStyles';
 
 export interface ColumnProps {
   children?: ReactNode;
   className?: string;
-  style?: CSSProperties;
+  styles?: Record<'column', CSSProperties>;
   align?: 'left' | 'center' | 'right';
 }
 
+const useStyles = makeStyles({
+  column: {},
+});
+
 export const Column = ({
   children,
   className,
-  style,
+  styles,
   align = 'left',
 }: ColumnProps): JSX.Element => {
+  const style = useStyles({ classes: styles });
+
   return (
-    <td className={className} style={style} align={align}>
+    <td className={className} style={style.column} align={align}>
       {children}
     </td>
   );