feat(tooltip): convert to TypeScript and export types

This also adds utils to help identify React events for TypeScript.

Author: WesSouza

src/Tooltip/Tooltip.js

@@ -3,7 +3,7 @@ name: Tooltip
 menu: Components
 ---
 
-import Tooltip from './Tooltip';
+import { Tooltip } from './Tooltip';
 import { Button } from '../Button/Button';
 
 # Tooltip

src/Tooltip/Tooltip.mdx

@@ -1,9 +1,10 @@
-import React from 'react';
 import { fireEvent, render, waitFor } from '@testing-library/react';
 
-import Tooltip from './Tooltip';
+import { Tooltip, TooltipProps } from './Tooltip';
 
-const getProps = (props = {}) => ({
+const getProps = (
+  props: Partial<TooltipProps> = {}
+): Omit<TooltipProps, 'children'> => ({
   className: props.className,
   disableFocusListener: props.disableFocusListener,
   disableMouseListener: props.disableMouseListener,
@@ -19,7 +20,7 @@ const getProps = (props = {}) => ({
   text: 'I am the tooltip'
 });
 
-const renderTooltip = props => (
+const renderTooltip = (props: Omit<TooltipProps, 'children'>) => (
   <Tooltip {...props}>
     <div>Kid</div>
   </Tooltip>

src/Tooltip/Tooltip.spec.js renamed to src/Tooltip/Tooltip.spec.tsx

@@ -1,8 +1,7 @@
-import React from 'react';
+import { ComponentMeta } from '@storybook/react';
+import { Button, Tooltip } from 'react95';
 import styled from 'styled-components';
 
-import { Tooltip, Button } from 'react95';
-
 const Wrapper = styled.div`
   padding: 5rem;
   background: ${({ theme }) => theme.desktopBackground};
@@ -12,7 +11,7 @@ export default {
   title: 'Tooltip',
   component: Tooltip,
   decorators: [story => <Wrapper>{story()}</Wrapper>]
-};
+} as ComponentMeta<typeof Tooltip>;
 
 export function Default() {
   return (