feat: flex typing

packages/system/src/flex.test.js → packages/system/src/flex/flex.test.js

@@ -15,7 +15,7 @@ import {
   order,
   flexes,
   gap,
-} from './flex';
+} from '.';
 
 const spacings = [0, 4, 8, 12];
 

packages/system/src/flex.js → packages/system/src/flex/index.js

@@ -1,6 +1,6 @@
-import { compose, generator, getSpacing } from './theme';
+import { compose, generator, getSpacing } from '../theme';
 
-import { toPx } from './unit';
+import { toPx } from '../unit';
 
 const flexDirection = props =>
   generator({

packages/system/src/flex/types.ts

@@ -0,0 +1,20 @@
+import tokens from '@gympass/yoga-tokens';
+
+type GapValues = typeof tokens.spacing | string | number;
+
+export type Flex = {
+  flexDirection?: string;
+  alignItems?: string;
+  alignContent?: string;
+  alignSelf?: string;
+  justifyContent?: string;
+  justifySelf?: string;
+  flex?: string | number;
+  flexBasis?: string;
+  flexFlow?: string;
+  flexGrow?: string | number;
+  flexShrink?: string;
+  flexWrap?: string;
+  order?: string | number;
+  gap?: GapValues;
+};