Complete text component

src/components/Text/index.tsx

@@ -1,7 +1,28 @@
 import { Wrapper } from './styles';
 
-const Text = () => {
-  return <Wrapper></Wrapper>;
+type TextProps = {
+  children?: React.ReactNode | JSX.Element | string;
+  className?: string;
+  variant?: 'display' | 'headline' | 'title' | 'subheader' | 'body' | 'caption';
+  color?: 'client' | 'productOwner' | 'developer' | 'admin' | string;
+  align?: 'inherit' | 'left' | 'center' | 'right' | 'justify';
+  display?: 'initial' | 'block' | 'inline';
+  gutterBottom?: boolean;
+  lineThrough?: boolean;
+  weight?: 'initial' | 'normal' | 'bold' | number;
+};
+
+const Text = ({
+  children,
+  variant = 'body',
+  className,
+  ...props
+}: TextProps) => {
+  return (
+    <Wrapper className={`${variant} ${className}`} {...props}>
+      {children}
+    </Wrapper>
+  );
 };
 
 export default Text;