feat(component): add Tooltip

Closes #11

- Fixes `tabindex` prop storybook typo

src/components/Tooltip/Tooltip.stories.js

@@ -0,0 +1,61 @@
+import { withKnobs, select, text } from '@storybook/addon-knobs';
+import Component from './Tooltip.Story.svelte';
+
+export default { title: 'Tooltip', decorators: [withKnobs] };
+
+const directions = {
+  'Top (top)': 'top',
+  'Right (right)': 'right',
+  'Bottom (bottom)': 'bottom',
+  'Left (left)': 'left'
+};
+
+export const Default = () => ({
+  Component,
+  props: {
+    direction: select('Tooltip direction (direction)', directions, 'bottom'),
+    triggerText: text('Trigger text (triggerText)', 'Tooltip label'),
+    tabindex: text('Tab index (tabindex in <Tooltip>)', '0')
+  }
+});
+
+export const NoIcon = () => ({
+  Component,
+  props: {
+    story: 'no icon',
+    showIcon: false,
+    direction: select('Tooltip direction (direction)', directions, 'bottom'),
+    triggerText: text('Trigger text (triggerText)', 'Tooltip label'),
+    tabindex: text('Tab index (tabindex in <Tooltip>)', '0')
+  }
+});
+
+export const CustomIcon = () => ({
+  Component,
+  props: {
+    story: 'custom icon',
+    showIcon: true,
+    direction: select('Tooltip direction (direction)', directions, 'bottom'),
+    triggerText: text('Trigger text (triggerText)', 'Tooltip label'),
+    tabindex: text('Tab index (tabindex in <Tooltip>)', '0')
+  }
+});
+
+export const CustomIconOnly = () => ({
+  Component,
+  props: {
+    story: 'custom icon only',
+    showIcon: true,
+    direction: select('Tooltip direction (direction)', directions, 'bottom'),
+    iconDescription: 'Helpful Information',
+    tabindex: text('Tab index (tabindex in <Tooltip>)', '0')
+  }
+});
+
+export const UncontrolledTooltip = () => ({
+  Component,
+  props: {
+    story: 'uncontrolled',
+    direction: select('Tooltip direction (direction)', directions, 'bottom')
+  }
+});