feat: Add Link component (#13)

src/components/Link/index.stories.tsx

@@ -0,0 +1,27 @@
+import React from "react";
+import Link from "./index";
+
+export default {
+  title: "Link",
+  component: Link,
+  argTypes: {
+    fontSize: {
+      name: "fontSize",
+      table: {
+        type: { summary: "string", detail: "Fontsize in px or em" },
+        defaultValue: { summary: "16px" },
+      },
+      control: {
+        type: null,
+      },
+    },
+  },
+};
+
+export const Default: React.FC = () => {
+  return (
+    <div>
+      <Link href="/">Default</Link>
+    </div>
+  );
+};

src/components/Link/index.tsx

@@ -0,0 +1,16 @@
+import styled from "styled-components";
+import Text from "../Text";
+
+export interface Props {
+  fontSize?: string;
+  href: string;
+}
+
+const Link = styled(Text).attrs({ as: "a", bold: true })<Props>`
+  color: ${({ theme }) => theme.colors.iris};
+  &:hover {
+    text-decoration: underline;
+  }
+`;
+
+export default Link;

src/index.ts

@@ -3,6 +3,8 @@ export { default as Button } from "./components/Button";
 export { default as ButtonMenu } from "./components/ButtonMenu";
 export { default as ButtonMenuItem } from "./components/ButtonMenu/ButtonMenuItem";
 export { default as Card } from "./components/Card";
+export { default as Text } from "./components/Text";
+export { default as Link } from "./components/Link";
 export { default as ResetCSS } from "./ResetCSS";
 
 export * from "./theme";