mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-23 09:52:26 +01:00
Rewrite Tooltip component as ES6
This commit is contained in:
parent
7c3b69e1e4
commit
db241e6b91
@ -3,7 +3,7 @@ import PropTypes from 'prop-types'
|
||||
import copyToClipboard from 'copy-to-clipboard'
|
||||
import { addressSlicer } from '../../util'
|
||||
|
||||
const Tooltip = require('../tooltip-v2.js')
|
||||
const Tooltip = require('../tooltip-v2.js').default
|
||||
|
||||
class SelectedAccount extends Component {
|
||||
state = {
|
||||
|
@ -1,33 +1,58 @@
|
||||
const Component = require('react').Component
|
||||
const h = require('react-hyperscript')
|
||||
const inherits = require('util').inherits
|
||||
const ReactTippy = require('react-tippy').Tooltip
|
||||
import PropTypes from 'prop-types'
|
||||
import React, {PureComponent} from 'react'
|
||||
import {Tooltip as ReactTippy} from 'react-tippy'
|
||||
|
||||
module.exports = Tooltip
|
||||
export default class Tooltip extends PureComponent {
|
||||
static defaultProps = {
|
||||
arrow: true,
|
||||
children: null,
|
||||
containerClassName: '',
|
||||
hideOnClick: false,
|
||||
onHidden: null,
|
||||
position: 'left',
|
||||
size: 'small',
|
||||
title: null,
|
||||
trigger: 'mouseenter',
|
||||
wrapperClassName: '',
|
||||
}
|
||||
|
||||
inherits(Tooltip, Component)
|
||||
function Tooltip () {
|
||||
Component.call(this)
|
||||
}
|
||||
|
||||
Tooltip.prototype.render = function () {
|
||||
const props = this.props
|
||||
const { position, title, children, wrapperClassName, containerClassName, onHidden } = props
|
||||
|
||||
return h('div', {
|
||||
className: wrapperClassName,
|
||||
}, [
|
||||
|
||||
h(ReactTippy, {
|
||||
title,
|
||||
position: position || 'left',
|
||||
trigger: 'mouseenter',
|
||||
hideOnClick: false,
|
||||
size: 'small',
|
||||
arrow: true,
|
||||
className: containerClassName,
|
||||
onHidden,
|
||||
}, children),
|
||||
|
||||
])
|
||||
static propTypes = {
|
||||
arrow: PropTypes.bool,
|
||||
children: PropTypes.node,
|
||||
containerClassName: PropTypes.string,
|
||||
onHidden: PropTypes.func,
|
||||
position: PropTypes.oneOf([
|
||||
'top',
|
||||
'right',
|
||||
'bottom',
|
||||
'left',
|
||||
]),
|
||||
size: PropTypes.oneOf([
|
||||
'small', 'regular', 'big',
|
||||
]),
|
||||
title: PropTypes.string,
|
||||
trigger: PropTypes.any,
|
||||
wrapperClassName: PropTypes.string,
|
||||
}
|
||||
|
||||
render () {
|
||||
const {arrow, children, containerClassName, position, size, title, trigger, onHidden, wrapperClassName } = this.props
|
||||
|
||||
return (
|
||||
<div className={wrapperClassName}>
|
||||
<ReactTippy
|
||||
className={containerClassName}
|
||||
title={title}
|
||||
position={position}
|
||||
trigger={trigger}
|
||||
hideOnClick={false}
|
||||
size={size}
|
||||
arrow={arrow}
|
||||
onHidden={onHidden}
|
||||
>
|
||||
{children}
|
||||
</ReactTippy>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
@ -9,7 +9,7 @@ const classnames = require('classnames')
|
||||
const { checksumAddress } = require('../util')
|
||||
const Identicon = require('./identicon')
|
||||
// const AccountDropdowns = require('./dropdowns/index.js').AccountDropdowns
|
||||
const Tooltip = require('./tooltip-v2.js')
|
||||
const Tooltip = require('./tooltip-v2.js').default
|
||||
const copyToClipboard = require('copy-to-clipboard')
|
||||
const actions = require('../actions')
|
||||
const BalanceComponent = require('./balance-component')
|
||||
|
Loading…
Reference in New Issue
Block a user