feat(tooltip): migrate TableTooltip component to TypeScript

plouc · Nov 15, 2020 · 0a54e62 · 0a54e62
1 parent 1416e8c
commit 0a54e62
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 28 deletions.
diff --git a/packages/tooltip/src/BasicTooltip.tsx b/packages/tooltip/src/BasicTooltip.tsx
@@ -9,6 +9,9 @@ interface BasicTooltipProps {
     format?: DataFormatter
     color?: string
     enableChip?: boolean
+    /**
+     * @deprecated This should be replaced by custom tooltip components.
+     */
     renderContent?: () => JSX.Element
 }
 
@@ -42,18 +45,3 @@ export const BasicTooltip = memo<BasicTooltipProps>(
         return <div style={theme.tooltip.container}>{content}</div>
     }
 )
-
-/*
-BasicTooltip.displayName = 'BasicTooltip'
-BasicTooltip.propTypes = {
-    id: PropTypes.node.isRequired,
-    value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-    enableChip: PropTypes.bool.isRequired,
-    color: PropTypes.string,
-    format: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),
-    renderContent: PropTypes.func,
-}
-BasicTooltip.defaultProps = {
-    enableChip: false,
-}
-*/
diff --git a/packages/tooltip/src/TableTooltip.js → packages/tooltip/src/TableTooltip.tsx b/packages/tooltip/src/TableTooltip.js → packages/tooltip/src/TableTooltip.tsx
@@ -1,12 +1,19 @@
-import React, { memo } from 'react'
+import React, { memo, ReactNode } from 'react'
+// @ts-ignore
 import { useTheme } from '@nivo/core'
 
 const tableStyle = {
     width: '100%',
     borderCollapse: 'collapse',
 }
 
-export const TableTooltip = memo(({ title, rows, renderContent }) => {
+interface TableTooltipProps {
+    title?: ReactNode
+    renderContent?: () => JSX.Element
+    rows?: ReactNode[][]
+}
+
+export const TableTooltip = memo(({ title, rows = [], renderContent }: TableTooltipProps) => {
     const theme = useTheme()
 
     if (!rows.length) return null
@@ -37,14 +44,3 @@ export const TableTooltip = memo(({ title, rows, renderContent }) => {
 
     return <div style={theme.tooltip.container}>{content}</div>
 })
-/*
-TableTooltip.propTypes = {
-    title: PropTypes.node,
-    rows: PropTypes.arrayOf(PropTypes.arrayOf(PropTypes.node)).isRequired,
-    renderContent: PropTypes.func,
-}
-
-TableTooltip.displayName = 'TableTooltip'
-
-export default TableTooltip
-*/