feat: making new and removing old tooltip component

onebeyond · Aug 6, 2021 · 73a1450 · 73a1450
1 parent f463ac9
commit 73a1450
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 23 deletions.
diff --git a/src/Common/Icon/FBtooltip.js b/src/Common/Icon/FBtooltip.js
diff --git a/src/Common/Icon/Icon.js b/src/Common/Icon/Icon.js
@@ -1,16 +1,21 @@
-import QuestionIcon from './Icons/QuestionIcon'
 /** @jsx jsx */
 /** @jsxRuntime classic */
+import QuestionIcon from './Icons/QuestionIcon'
 import { jsx } from 'theme-ui'
+import style from './icon.module.css'
 
 const Icon = (props) => {
  const { name, ...iconProperties } = props.icon
+ const { config, textStyle } = props.tooltip
 
  return (
- <div data-event='click focus' data-tip='custom show'>
+ <div className={style.tooltip}>
  {{
  'question-circle': <QuestionIcon {...iconProperties} />
  }[name] || <p>Icon Not found</p>}
+ <div className={style.top} style={{ ...config }}>
+ <p sx={{ ...textStyle }}>{props.tooltip.text}</p>
+ </div>
  </div>
  )
 }

diff --git a/src/Questions/Input/index.js b/src/Questions/Input/index.js
@@ -2,7 +2,6 @@ import ErrorMessage from '../../Fields/Error'
 import Input from '../../Fields/Input'
 import Label from '../../Fields/Label'
 import Icon from '../../Common/Icon/Icon'
-import FBtooltip from '../../Common/Icon/FBtooltip'
 
 /** @jsx jsx */
 /** @jsxRuntime classic */
@@ -35,10 +34,11 @@ const QuestionInput = ({ question, useForm, component }) => {
 
  {question.icon && (
  <div>
- <Icon icon={question.icon} sx={{ variant: 'forms.icon' }} />
- {question.tooltip && question.tooltip.text && (
- <FBtooltip tooltip={question.tooltip} />
- )}
+ <Icon
+ icon={question.icon}
+ tooltip={question.tooltip}
+ sx={{ variant: 'forms.icon' }}
+ />
  </div>
  )}
  </div>