Completely updated React, fixed #11, (hopefully)
This commit is contained in:
28
goTorrentWebUI/node_modules/material-ui/Tooltip/Tooltip.d.ts
generated
vendored
28
goTorrentWebUI/node_modules/material-ui/Tooltip/Tooltip.d.ts
generated
vendored
@@ -1,21 +1,19 @@
|
||||
import * as React from 'react';
|
||||
import { IPopperProps } from 'react-popper';
|
||||
import { StandardProps } from '..';
|
||||
|
||||
export interface TooltipProps extends StandardProps<
|
||||
React.HTMLAttributes<HTMLDivElement>,
|
||||
TooltipClassKey,
|
||||
'title'
|
||||
> {
|
||||
export interface TooltipProps
|
||||
extends StandardProps<React.HTMLAttributes<HTMLDivElement>, TooltipClassKey, 'title'> {
|
||||
children: React.ReactElement<any>;
|
||||
disableTriggerFocus?: boolean;
|
||||
disableTriggerHover?: boolean;
|
||||
disableTriggerTouch?: boolean;
|
||||
id?: string;
|
||||
onRequestClose?: (event: React.ChangeEvent<{}>) => void;
|
||||
onRequestOpen?: (event: React.ChangeEvent<{}>) => void;
|
||||
open?: boolean;
|
||||
title: React.ReactNode;
|
||||
enterDelay?: number;
|
||||
id?: string;
|
||||
leaveDelay?: number;
|
||||
onClose?: (event: React.ChangeEvent<{}>) => void;
|
||||
onOpen?: (event: React.ChangeEvent<{}>) => void;
|
||||
open?: boolean;
|
||||
placement?:
|
||||
| 'bottom-end'
|
||||
| 'bottom-start'
|
||||
@@ -29,7 +27,8 @@ export interface TooltipProps extends StandardProps<
|
||||
| 'top-end'
|
||||
| 'top-start'
|
||||
| 'top';
|
||||
PopperProps?: object;
|
||||
PopperProps?: Partial<PopperProps>;
|
||||
title: React.ReactNode;
|
||||
}
|
||||
|
||||
export type TooltipClassKey =
|
||||
@@ -41,8 +40,11 @@ export type TooltipClassKey =
|
||||
| 'tooltipRight'
|
||||
| 'tooltipTop'
|
||||
| 'tooltipBottom'
|
||||
| 'tooltipOpen'
|
||||
;
|
||||
| 'tooltipOpen';
|
||||
|
||||
interface PopperProps extends IPopperProps {
|
||||
PopperClassName: string;
|
||||
}
|
||||
|
||||
declare const Tooltip: React.ComponentType<TooltipProps>;
|
||||
|
||||
|
454
goTorrentWebUI/node_modules/material-ui/Tooltip/Tooltip.js
generated
vendored
454
goTorrentWebUI/node_modules/material-ui/Tooltip/Tooltip.js
generated
vendored
@@ -13,10 +13,6 @@ var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProp
|
||||
|
||||
var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
|
||||
|
||||
var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
|
||||
|
||||
var _defineProperty3 = _interopRequireDefault(_defineProperty2);
|
||||
|
||||
var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
|
||||
|
||||
var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
|
||||
@@ -37,10 +33,18 @@ var _inherits2 = require('babel-runtime/helpers/inherits');
|
||||
|
||||
var _inherits3 = _interopRequireDefault(_inherits2);
|
||||
|
||||
var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
|
||||
|
||||
var _defineProperty3 = _interopRequireDefault(_defineProperty2);
|
||||
|
||||
var _react = require('react');
|
||||
|
||||
var _react2 = _interopRequireDefault(_react);
|
||||
|
||||
var _propTypes = require('prop-types');
|
||||
|
||||
var _propTypes2 = _interopRequireDefault(_propTypes);
|
||||
|
||||
var _reactDom = require('react-dom');
|
||||
|
||||
var _reactEventListener = require('react-event-listener');
|
||||
@@ -63,42 +67,21 @@ var _reactPopper = require('react-popper');
|
||||
|
||||
var _helpers = require('../utils/helpers');
|
||||
|
||||
var _RefHolder = require('../internal/RefHolder');
|
||||
|
||||
var _RefHolder2 = _interopRequireDefault(_RefHolder);
|
||||
|
||||
var _common = require('../colors/common');
|
||||
|
||||
var _common2 = _interopRequireDefault(_common);
|
||||
|
||||
var _grey = require('../colors/grey');
|
||||
|
||||
var _grey2 = _interopRequireDefault(_grey);
|
||||
|
||||
var _withStyles = require('../styles/withStyles');
|
||||
|
||||
var _withStyles2 = _interopRequireDefault(_withStyles);
|
||||
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
|
||||
var babelPluginFlowReactPropTypes_proptype_Node = require('react').babelPluginFlowReactPropTypes_proptype_Node || require('prop-types').any; /* eslint-disable react/no-multi-comp, no-underscore-dangle */
|
||||
|
||||
|
||||
var babelPluginFlowReactPropTypes_proptype_Element = require('react').babelPluginFlowReactPropTypes_proptype_Element || require('prop-types').any;
|
||||
|
||||
// Use a class component so we can get a reference.
|
||||
var TargetChildren = function (_React$Component) {
|
||||
(0, _inherits3.default)(TargetChildren, _React$Component);
|
||||
|
||||
function TargetChildren() {
|
||||
(0, _classCallCheck3.default)(this, TargetChildren);
|
||||
return (0, _possibleConstructorReturn3.default)(this, (TargetChildren.__proto__ || (0, _getPrototypeOf2.default)(TargetChildren)).apply(this, arguments));
|
||||
}
|
||||
|
||||
(0, _createClass3.default)(TargetChildren, [{
|
||||
key: 'render',
|
||||
value: function render() {
|
||||
return this.props.element;
|
||||
}
|
||||
}]);
|
||||
return TargetChildren;
|
||||
}(_react2.default.Component);
|
||||
/* eslint-disable react/no-multi-comp, no-underscore-dangle */
|
||||
|
||||
var styles = exports.styles = function styles(theme) {
|
||||
return {
|
||||
@@ -113,24 +96,23 @@ var styles = exports.styles = function styles(theme) {
|
||||
pointerEvents: 'none'
|
||||
},
|
||||
tooltip: (0, _defineProperty3.default)({
|
||||
background: _grey2.default[700],
|
||||
backgroundColor: theme.palette.grey[700],
|
||||
borderRadius: 2,
|
||||
color: _common2.default.fullWhite,
|
||||
color: _common2.default.white,
|
||||
fontFamily: theme.typography.fontFamily,
|
||||
fontSize: theme.typography.pxToRem(14),
|
||||
minHeight: theme.spacing.unit * 4,
|
||||
lineHeight: '32px',
|
||||
opacity: 0,
|
||||
padding: '0 ' + theme.spacing.unit + 'px',
|
||||
transform: 'scale(0)',
|
||||
transition: theme.transitions.create(['opacity', 'transform'], {
|
||||
duration: theme.transitions.duration.shortest
|
||||
})
|
||||
}),
|
||||
minHeight: 0,
|
||||
padding: theme.spacing.unit,
|
||||
fontSize: theme.typography.pxToRem(14),
|
||||
lineHeight: theme.typography.round(16 / 14) + 'em'
|
||||
}, theme.breakpoints.up('sm'), {
|
||||
minHeight: 22,
|
||||
lineHeight: '22px',
|
||||
padding: '0 ' + theme.spacing.unit + 'px',
|
||||
fontSize: theme.typography.pxToRem(10)
|
||||
padding: theme.spacing.unit / 2 + 'px ' + theme.spacing.unit + 'px',
|
||||
fontSize: theme.typography.pxToRem(10),
|
||||
lineHeight: theme.typography.round(14 / 10) + 'em'
|
||||
}),
|
||||
tooltipLeft: (0, _defineProperty3.default)({
|
||||
transformOrigin: 'right center',
|
||||
@@ -163,8 +145,6 @@ var styles = exports.styles = function styles(theme) {
|
||||
};
|
||||
};
|
||||
|
||||
var babelPluginFlowReactPropTypes_proptype_Placement = require('prop-types').oneOf(['bottom-end', 'bottom-start', 'bottom', 'left-end', 'left-start', 'left', 'right-end', 'right-start', 'right', 'top-end', 'top-start', 'top']);
|
||||
|
||||
function flipPlacement(placement) {
|
||||
switch (placement) {
|
||||
case 'bottom-end':
|
||||
@@ -180,100 +160,13 @@ function flipPlacement(placement) {
|
||||
}
|
||||
}
|
||||
|
||||
var babelPluginFlowReactPropTypes_proptype_Props = {
|
||||
/**
|
||||
* Tooltip reference component.
|
||||
*/
|
||||
children: typeof babelPluginFlowReactPropTypes_proptype_Element === 'function' ? babelPluginFlowReactPropTypes_proptype_Element.isRequired ? babelPluginFlowReactPropTypes_proptype_Element.isRequired : babelPluginFlowReactPropTypes_proptype_Element : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_Element).isRequired,
|
||||
|
||||
/**
|
||||
* Useful to extend the style applied to components.
|
||||
*/
|
||||
classes: require('prop-types').object,
|
||||
|
||||
/**
|
||||
* @ignore
|
||||
*/
|
||||
className: require('prop-types').string,
|
||||
|
||||
/**
|
||||
* Do not respond to focus events.
|
||||
*/
|
||||
disableTriggerFocus: require('prop-types').bool,
|
||||
|
||||
/**
|
||||
* Do not respond to hover events.
|
||||
*/
|
||||
disableTriggerHover: require('prop-types').bool,
|
||||
|
||||
/**
|
||||
* Do not respond to long press touch events.
|
||||
*/
|
||||
disableTriggerTouch: require('prop-types').bool,
|
||||
|
||||
/**
|
||||
* The relationship between the tooltip and the wrapper componnet is not clear from the DOM.
|
||||
* By providind this property, we can use aria-describedby to solve the accessibility issue.
|
||||
*/
|
||||
id: require('prop-types').string,
|
||||
|
||||
/**
|
||||
* Callback fired when the tooltip requests to be closed.
|
||||
*
|
||||
* @param {object} event The event source of the callback
|
||||
*/
|
||||
onRequestClose: require('prop-types').func,
|
||||
|
||||
/**
|
||||
* Callback fired when the tooltip requests to be open.
|
||||
*
|
||||
* @param {object} event The event source of the callback
|
||||
*/
|
||||
onRequestOpen: require('prop-types').func,
|
||||
|
||||
/**
|
||||
* If `true`, the tooltip is shown.
|
||||
*/
|
||||
open: require('prop-types').bool,
|
||||
|
||||
/**
|
||||
* Tooltip title.
|
||||
*/
|
||||
title: typeof babelPluginFlowReactPropTypes_proptype_Node === 'function' ? babelPluginFlowReactPropTypes_proptype_Node.isRequired ? babelPluginFlowReactPropTypes_proptype_Node.isRequired : babelPluginFlowReactPropTypes_proptype_Node : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_Node).isRequired,
|
||||
|
||||
/**
|
||||
* The number of milliseconds to wait before showing the tooltip.
|
||||
*/
|
||||
enterDelay: require('prop-types').number,
|
||||
|
||||
/**
|
||||
* The number of milliseconds to wait before hidding the tooltip.
|
||||
*/
|
||||
leaveDelay: require('prop-types').number,
|
||||
|
||||
/**
|
||||
* Tooltip placement
|
||||
*/
|
||||
placement: require('prop-types').oneOf(['bottom-end', 'bottom-start', 'bottom', 'left-end', 'left-start', 'left', 'right-end', 'right-start', 'right', 'top-end', 'top-start', 'top']),
|
||||
|
||||
/**
|
||||
* Properties applied to the `Popper` element.
|
||||
*/
|
||||
PopperProps: require('prop-types').object,
|
||||
|
||||
/**
|
||||
* @ignore
|
||||
*/
|
||||
theme: require('prop-types').object
|
||||
};
|
||||
|
||||
var Tooltip = function (_React$Component2) {
|
||||
(0, _inherits3.default)(Tooltip, _React$Component2);
|
||||
var Tooltip = function (_React$Component) {
|
||||
(0, _inherits3.default)(Tooltip, _React$Component);
|
||||
|
||||
function Tooltip() {
|
||||
var _ref;
|
||||
|
||||
var _temp, _this2, _ret;
|
||||
var _temp, _this, _ret;
|
||||
|
||||
(0, _classCallCheck3.default)(this, Tooltip);
|
||||
|
||||
@@ -281,113 +174,105 @@ var Tooltip = function (_React$Component2) {
|
||||
args[_key] = arguments[_key];
|
||||
}
|
||||
|
||||
return _ret = (_temp = (_this2 = (0, _possibleConstructorReturn3.default)(this, (_ref = Tooltip.__proto__ || (0, _getPrototypeOf2.default)(Tooltip)).call.apply(_ref, [this].concat(args))), _this2), _this2.state = {}, _this2.enterTimer = null, _this2.leaveTimer = null, _this2.touchTimer = null, _this2.isControlled = null, _this2.popper = null, _this2.children = null, _this2.ignoreNonTouchEvents = false, _this2.handleResize = (0, _debounce2.default)(function () {
|
||||
if (_this2.popper) {
|
||||
_this2.popper._popper.scheduleUpdate();
|
||||
return _ret = (_temp = (_this = (0, _possibleConstructorReturn3.default)(this, (_ref = Tooltip.__proto__ || (0, _getPrototypeOf2.default)(Tooltip)).call.apply(_ref, [this].concat(args))), _this), _this.state = {}, _this.enterTimer = null, _this.leaveTimer = null, _this.touchTimer = null, _this.isControlled = null, _this.popper = null, _this.children = null, _this.ignoreNonTouchEvents = false, _this.handleResize = (0, _debounce2.default)(function () {
|
||||
if (_this.popper) {
|
||||
_this.popper._popper.scheduleUpdate();
|
||||
}
|
||||
}, 166), _this2.handleRequestOpen = function (event) {
|
||||
var children = _this2.props.children;
|
||||
}, 166), _this.handleRequestOpen = function (event) {
|
||||
var children = _this.props.children;
|
||||
|
||||
if (typeof children !== 'string') {
|
||||
var childrenProps = _react.Children.only(children).props;
|
||||
var childrenProps = children.props;
|
||||
|
||||
if (event.type === 'focus' && childrenProps.onFocus) {
|
||||
childrenProps.onFocus(event);
|
||||
}
|
||||
|
||||
if (event.type === 'mouseover' && childrenProps.onMouseOver) {
|
||||
childrenProps.onMouseOver(event);
|
||||
}
|
||||
if (event.type === 'focus' && childrenProps.onFocus) {
|
||||
childrenProps.onFocus(event);
|
||||
}
|
||||
|
||||
if (_this2.ignoreNonTouchEvents && event.type !== 'touchstart') {
|
||||
if (event.type === 'mouseover' && childrenProps.onMouseOver) {
|
||||
childrenProps.onMouseOver(event);
|
||||
}
|
||||
|
||||
if (_this.ignoreNonTouchEvents && event.type !== 'touchstart') {
|
||||
return;
|
||||
}
|
||||
|
||||
clearTimeout(_this2.leaveTimer);
|
||||
if (_this2.props.enterDelay > 0) {
|
||||
_this2.leaveTimer = setTimeout(function () {
|
||||
_this2.requestOpen(event);
|
||||
}, _this2.props.enterDelay);
|
||||
clearTimeout(_this.leaveTimer);
|
||||
if (_this.props.enterDelay > 0) {
|
||||
_this.leaveTimer = setTimeout(function () {
|
||||
_this.requestOpen(event);
|
||||
}, _this.props.enterDelay);
|
||||
} else {
|
||||
_this2.requestOpen(event);
|
||||
_this.requestOpen(event);
|
||||
}
|
||||
}, _this2.requestOpen = function (event) {
|
||||
if (!_this2.isControlled) {
|
||||
_this2.setState({ open: true });
|
||||
}, _this.requestOpen = function (event) {
|
||||
if (!_this.isControlled) {
|
||||
_this.setState({ open: true });
|
||||
}
|
||||
|
||||
if (_this2.props.onRequestOpen) {
|
||||
_this2.props.onRequestOpen(event, true);
|
||||
if (_this.props.onOpen) {
|
||||
_this.props.onOpen(event, true);
|
||||
}
|
||||
}, _this2.handleRequestClose = function (event) {
|
||||
var children = _this2.props.children;
|
||||
}, _this.handleClose = function (event) {
|
||||
var children = _this.props.children;
|
||||
|
||||
if (typeof children !== 'string') {
|
||||
var childrenProps = _react.Children.only(children).props;
|
||||
var childrenProps = children.props;
|
||||
|
||||
if (event.type === 'blur' && childrenProps.onBlur) {
|
||||
childrenProps.onBlur(event);
|
||||
}
|
||||
|
||||
if (event.type === 'mouseleave' && childrenProps.onMouseLeave) {
|
||||
childrenProps.onMouseLeave(event);
|
||||
}
|
||||
if (event.type === 'blur' && childrenProps.onBlur) {
|
||||
childrenProps.onBlur(event);
|
||||
}
|
||||
|
||||
clearTimeout(_this2.leaveTimer);
|
||||
if (_this2.props.leaveDelay) {
|
||||
_this2.leaveTimer = setTimeout(function () {
|
||||
_this2.requestClose(event);
|
||||
}, _this2.props.leaveDelay);
|
||||
if (event.type === 'mouseleave' && childrenProps.onMouseLeave) {
|
||||
childrenProps.onMouseLeave(event);
|
||||
}
|
||||
|
||||
clearTimeout(_this.leaveTimer);
|
||||
if (_this.props.leaveDelay) {
|
||||
_this.leaveTimer = setTimeout(function () {
|
||||
_this.requestClose(event);
|
||||
}, _this.props.leaveDelay);
|
||||
} else {
|
||||
_this2.requestClose(event);
|
||||
_this.requestClose(event);
|
||||
}
|
||||
}, _this2.requestClose = function (event) {
|
||||
_this2.ignoreNonTouchEvents = false;
|
||||
}, _this.requestClose = function (event) {
|
||||
_this.ignoreNonTouchEvents = false;
|
||||
|
||||
if (!_this2.isControlled) {
|
||||
_this2.setState({ open: false });
|
||||
if (!_this.isControlled) {
|
||||
_this.setState({ open: false });
|
||||
}
|
||||
|
||||
if (_this2.props.onRequestClose) {
|
||||
_this2.props.onRequestClose(event, false);
|
||||
if (_this.props.onClose) {
|
||||
_this.props.onClose(event, false);
|
||||
}
|
||||
}, _this2.handleTouchStart = function (event) {
|
||||
_this2.ignoreNonTouchEvents = true;
|
||||
var children = _this2.props.children;
|
||||
}, _this.handleTouchStart = function (event) {
|
||||
_this.ignoreNonTouchEvents = true;
|
||||
var children = _this.props.children;
|
||||
|
||||
if (typeof children !== 'string') {
|
||||
var childrenProps = _react.Children.only(children).props;
|
||||
var childrenProps = children.props;
|
||||
|
||||
if (childrenProps.onTouchStart) {
|
||||
childrenProps.onTouchStart(event);
|
||||
}
|
||||
if (childrenProps.onTouchStart) {
|
||||
childrenProps.onTouchStart(event);
|
||||
}
|
||||
|
||||
clearTimeout(_this2.touchTimer);
|
||||
clearTimeout(_this.touchTimer);
|
||||
event.persist();
|
||||
_this2.touchTimer = setTimeout(function () {
|
||||
_this2.handleRequestOpen(event);
|
||||
_this.touchTimer = setTimeout(function () {
|
||||
_this.handleRequestOpen(event);
|
||||
}, 1e3);
|
||||
}, _this2.handleTouchEnd = function (event) {
|
||||
var children = _this2.props.children;
|
||||
}, _this.handleTouchEnd = function (event) {
|
||||
var children = _this.props.children;
|
||||
|
||||
if (typeof children !== 'string') {
|
||||
var childrenProps = _react.Children.only(children).props;
|
||||
var childrenProps = children.props;
|
||||
|
||||
if (childrenProps.onTouchEnd) {
|
||||
childrenProps.onTouchEnd(event);
|
||||
}
|
||||
if (childrenProps.onTouchEnd) {
|
||||
childrenProps.onTouchEnd(event);
|
||||
}
|
||||
|
||||
clearTimeout(_this2.touchTimer);
|
||||
clearTimeout(_this2.leaveTimer);
|
||||
clearTimeout(_this.touchTimer);
|
||||
clearTimeout(_this.leaveTimer);
|
||||
event.persist();
|
||||
_this2.leaveTimer = setTimeout(function () {
|
||||
_this2.requestClose(event);
|
||||
}, 1500 + _this2.props.leaveDelay);
|
||||
}, _temp), (0, _possibleConstructorReturn3.default)(_this2, _ret);
|
||||
_this.leaveTimer = setTimeout(function () {
|
||||
_this.requestClose(event);
|
||||
}, 1500 + _this.props.leaveDelay);
|
||||
}, _temp), (0, _possibleConstructorReturn3.default)(_this, _ret);
|
||||
}
|
||||
|
||||
(0, _createClass3.default)(Tooltip, [{
|
||||
@@ -396,7 +281,7 @@ var Tooltip = function (_React$Component2) {
|
||||
var props = this.props;
|
||||
|
||||
|
||||
this.isControlled = props.open !== undefined;
|
||||
this.isControlled = props.open != null;
|
||||
|
||||
if (!this.isControlled) {
|
||||
// not controlled, use internal state
|
||||
@@ -408,9 +293,7 @@ var Tooltip = function (_React$Component2) {
|
||||
}, {
|
||||
key: 'componentDidMount',
|
||||
value: function componentDidMount() {
|
||||
process.env.NODE_ENV !== "production" ? (0, _warning2.default)(!this.children || !this.children.disabled ||
|
||||
// $FlowFixMe
|
||||
!this.children.tagName.toLowerCase() === 'button', ['Material-UI: you are providing a disabled button children to the Tooltip component.', 'A disabled element do not fire events.', 'But the Tooltip needs to listen to the children element events to display the title.', '', 'Place a `div` over top of the element.'].join('\n')) : void 0;
|
||||
process.env.NODE_ENV !== "production" ? (0, _warning2.default)(!this.children || !this.children.disabled || !this.children.tagName.toLowerCase() === 'button', ['Material-UI: you are providing a disabled button children to the Tooltip component.', 'A disabled element do not fire events.', 'But the Tooltip needs to listen to the children element events to display the title.', '', 'Place a `div` over top of the element.'].join('\n')) : void 0;
|
||||
}
|
||||
}, {
|
||||
key: 'componentWillUnmount',
|
||||
@@ -422,7 +305,7 @@ var Tooltip = function (_React$Component2) {
|
||||
}, {
|
||||
key: 'render',
|
||||
value: function render() {
|
||||
var _this3 = this;
|
||||
var _this2 = this;
|
||||
|
||||
var _props = this.props,
|
||||
childrenProp = _props.children,
|
||||
@@ -434,23 +317,27 @@ var Tooltip = function (_React$Component2) {
|
||||
enterDelay = _props.enterDelay,
|
||||
id = _props.id,
|
||||
leaveDelay = _props.leaveDelay,
|
||||
onClose = _props.onClose,
|
||||
onOpen = _props.onOpen,
|
||||
openProp = _props.open,
|
||||
onRequestClose = _props.onRequestClose,
|
||||
onRequestOpen = _props.onRequestOpen,
|
||||
theme = _props.theme,
|
||||
title = _props.title,
|
||||
rawPlacement = _props.placement,
|
||||
_props$PopperProps = _props.PopperProps;
|
||||
_props$PopperProps = _props$PopperProps === undefined ? {} : _props$PopperProps;
|
||||
var PopperClassName = _props$PopperProps.PopperClassName,
|
||||
PopperOther = (0, _objectWithoutProperties3.default)(_props$PopperProps, ['PopperClassName']),
|
||||
other = (0, _objectWithoutProperties3.default)(_props, ['children', 'classes', 'className', 'disableTriggerFocus', 'disableTriggerHover', 'disableTriggerTouch', 'enterDelay', 'id', 'leaveDelay', 'open', 'onRequestClose', 'onRequestOpen', 'theme', 'title', 'placement', 'PopperProps']);
|
||||
theme = _props.theme,
|
||||
title = _props.title,
|
||||
other = (0, _objectWithoutProperties3.default)(_props, ['children', 'classes', 'className', 'disableTriggerFocus', 'disableTriggerHover', 'disableTriggerTouch', 'enterDelay', 'id', 'leaveDelay', 'onClose', 'onOpen', 'open', 'placement', 'PopperProps', 'theme', 'title']);
|
||||
|
||||
|
||||
var placement = theme.direction === 'rtl' ? flipPlacement(rawPlacement) : rawPlacement;
|
||||
var open = this.isControlled ? openProp : this.state.open;
|
||||
var childrenProps = {};
|
||||
|
||||
if (title === '') {
|
||||
open = false;
|
||||
}
|
||||
|
||||
childrenProps['aria-describedby'] = id;
|
||||
|
||||
if (!disableTriggerTouch) {
|
||||
@@ -460,17 +347,15 @@ var Tooltip = function (_React$Component2) {
|
||||
|
||||
if (!disableTriggerHover) {
|
||||
childrenProps.onMouseOver = this.handleRequestOpen;
|
||||
childrenProps.onMouseLeave = this.handleRequestClose;
|
||||
childrenProps.onMouseLeave = this.handleClose;
|
||||
}
|
||||
|
||||
if (!disableTriggerFocus) {
|
||||
childrenProps.onFocus = this.handleRequestOpen;
|
||||
childrenProps.onBlur = this.handleRequestClose;
|
||||
childrenProps.onBlur = this.handleClose;
|
||||
}
|
||||
|
||||
if (typeof childrenProp !== 'string' && childrenProp.props) {
|
||||
process.env.NODE_ENV !== "production" ? (0, _warning2.default)(!childrenProp.props.title, ['Material-UI: you have been providing a `title` property to the child of <Tooltip />.', 'Remove this title property `' + childrenProp.props.title + '` or the Tooltip component.'].join('\n')) : void 0;
|
||||
}
|
||||
process.env.NODE_ENV !== "production" ? (0, _warning2.default)(!childrenProp.props.title, ['Material-UI: you have been providing a `title` property to the child of <Tooltip />.', 'Remove this title property `' + childrenProp.props.title + '` or the Tooltip component.'].join('\n')) : void 0;
|
||||
|
||||
return _react2.default.createElement(
|
||||
_reactEventListener2.default,
|
||||
@@ -483,13 +368,16 @@ var Tooltip = function (_React$Component2) {
|
||||
null,
|
||||
function (_ref2) {
|
||||
var targetProps = _ref2.targetProps;
|
||||
return _react2.default.createElement(TargetChildren, {
|
||||
element: typeof childrenProp !== 'string' ? _react2.default.cloneElement(childrenProp, childrenProps) : childrenProp,
|
||||
ref: function ref(node) {
|
||||
_this3.children = (0, _reactDom.findDOMNode)(node);
|
||||
targetProps.ref(_this3.children);
|
||||
}
|
||||
});
|
||||
return _react2.default.createElement(
|
||||
_RefHolder2.default,
|
||||
{
|
||||
ref: function ref(node) {
|
||||
_this2.children = (0, _reactDom.findDOMNode)(node);
|
||||
targetProps.ref(_this2.children);
|
||||
}
|
||||
},
|
||||
_react2.default.cloneElement(childrenProp, childrenProps)
|
||||
);
|
||||
}
|
||||
),
|
||||
_react2.default.createElement(
|
||||
@@ -500,19 +388,34 @@ var Tooltip = function (_React$Component2) {
|
||||
className: (0, _classnames2.default)(classes.popper, (0, _defineProperty3.default)({}, classes.popperClose, !open), PopperClassName)
|
||||
}, PopperOther, {
|
||||
ref: function ref(node) {
|
||||
_this3.popper = node;
|
||||
_this2.popper = node;
|
||||
}
|
||||
}),
|
||||
_react2.default.createElement(
|
||||
'div',
|
||||
{
|
||||
id: id,
|
||||
role: 'tooltip',
|
||||
'aria-hidden': !open,
|
||||
className: (0, _classnames2.default)(classes.tooltip, (0, _defineProperty3.default)({}, classes.tooltipOpen, open), classes['tooltip' + (0, _helpers.capitalizeFirstLetter)(placement.split('-')[0])])
|
||||
},
|
||||
title
|
||||
)
|
||||
function (_ref3) {
|
||||
var popperProps = _ref3.popperProps,
|
||||
restProps = _ref3.restProps;
|
||||
|
||||
var actualPlacement = popperProps['data-placement'] || placement;
|
||||
return _react2.default.createElement(
|
||||
'div',
|
||||
(0, _extends3.default)({}, popperProps, restProps, {
|
||||
style: (0, _extends3.default)({}, popperProps.style, {
|
||||
top: popperProps.style.top || 0,
|
||||
left: popperProps.style.left || 0
|
||||
}, restProps.style)
|
||||
}),
|
||||
_react2.default.createElement(
|
||||
'div',
|
||||
{
|
||||
id: id,
|
||||
role: 'tooltip',
|
||||
'aria-hidden': !open,
|
||||
className: (0, _classnames2.default)(classes.tooltip, (0, _defineProperty3.default)({}, classes.tooltipOpen, open), classes['tooltip' + (0, _helpers.capitalize)(actualPlacement.split('-')[0])])
|
||||
},
|
||||
title
|
||||
)
|
||||
);
|
||||
}
|
||||
)
|
||||
)
|
||||
);
|
||||
@@ -521,6 +424,78 @@ var Tooltip = function (_React$Component2) {
|
||||
return Tooltip;
|
||||
}(_react2.default.Component);
|
||||
|
||||
Tooltip.propTypes = process.env.NODE_ENV !== "production" ? {
|
||||
/**
|
||||
* Tooltip reference element.
|
||||
*/
|
||||
children: _propTypes2.default.element.isRequired,
|
||||
/**
|
||||
* Useful to extend the style applied to components.
|
||||
*/
|
||||
classes: _propTypes2.default.object.isRequired,
|
||||
/**
|
||||
* @ignore
|
||||
*/
|
||||
className: _propTypes2.default.string,
|
||||
/**
|
||||
* Do not respond to focus events.
|
||||
*/
|
||||
disableTriggerFocus: _propTypes2.default.bool,
|
||||
/**
|
||||
* Do not respond to hover events.
|
||||
*/
|
||||
disableTriggerHover: _propTypes2.default.bool,
|
||||
/**
|
||||
* Do not respond to long press touch events.
|
||||
*/
|
||||
disableTriggerTouch: _propTypes2.default.bool,
|
||||
/**
|
||||
* The number of milliseconds to wait before showing the tooltip.
|
||||
*/
|
||||
enterDelay: _propTypes2.default.number,
|
||||
/**
|
||||
* The relationship between the tooltip and the wrapper component is not clear from the DOM.
|
||||
* By providing this property, we can use aria-describedby to solve the accessibility issue.
|
||||
*/
|
||||
id: _propTypes2.default.string,
|
||||
/**
|
||||
* The number of milliseconds to wait before hidding the tooltip.
|
||||
*/
|
||||
leaveDelay: _propTypes2.default.number,
|
||||
/**
|
||||
* Callback fired when the tooltip requests to be closed.
|
||||
*
|
||||
* @param {object} event The event source of the callback
|
||||
*/
|
||||
onClose: _propTypes2.default.func,
|
||||
/**
|
||||
* Callback fired when the tooltip requests to be open.
|
||||
*
|
||||
* @param {object} event The event source of the callback
|
||||
*/
|
||||
onOpen: _propTypes2.default.func,
|
||||
/**
|
||||
* If `true`, the tooltip is shown.
|
||||
*/
|
||||
open: _propTypes2.default.bool,
|
||||
/**
|
||||
* Tooltip placement
|
||||
*/
|
||||
placement: _propTypes2.default.oneOf(['bottom-end', 'bottom-start', 'bottom', 'left-end', 'left-start', 'left', 'right-end', 'right-start', 'right', 'top-end', 'top-start', 'top']),
|
||||
/**
|
||||
* Properties applied to the `Popper` element.
|
||||
*/
|
||||
PopperProps: _propTypes2.default.object,
|
||||
/**
|
||||
* @ignore
|
||||
*/
|
||||
theme: _propTypes2.default.object.isRequired,
|
||||
/**
|
||||
* Tooltip title. Zero-length titles string are never displayed.
|
||||
*/
|
||||
title: _propTypes2.default.node.isRequired
|
||||
} : {};
|
||||
|
||||
Tooltip.defaultProps = {
|
||||
disableTriggerFocus: false,
|
||||
disableTriggerHover: false,
|
||||
@@ -529,4 +504,5 @@ Tooltip.defaultProps = {
|
||||
leaveDelay: 0,
|
||||
placement: 'bottom'
|
||||
};
|
||||
|
||||
exports.default = (0, _withStyles2.default)(styles, { name: 'MuiTooltip', withTheme: true })(Tooltip);
|
385
goTorrentWebUI/node_modules/material-ui/Tooltip/Tooltip.js.flow
generated
vendored
385
goTorrentWebUI/node_modules/material-ui/Tooltip/Tooltip.js.flow
generated
vendored
@@ -1,27 +1,19 @@
|
||||
/* eslint-disable react/no-multi-comp, no-underscore-dangle */
|
||||
// @flow
|
||||
|
||||
import React, { Children } from 'react';
|
||||
import type { Element, Node } from 'react';
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { findDOMNode } from 'react-dom';
|
||||
import EventListener from 'react-event-listener';
|
||||
import debounce from 'lodash/debounce';
|
||||
import warning from 'warning';
|
||||
import classNames from 'classnames';
|
||||
import { Manager, Target, Popper } from 'react-popper';
|
||||
import { capitalizeFirstLetter } from '../utils/helpers';
|
||||
import { capitalize } from '../utils/helpers';
|
||||
import RefHolder from '../internal/RefHolder';
|
||||
import common from '../colors/common';
|
||||
import grey from '../colors/grey';
|
||||
import withStyles from '../styles/withStyles';
|
||||
|
||||
// Use a class component so we can get a reference.
|
||||
class TargetChildren extends React.Component<{ element: Element<any> }> {
|
||||
render() {
|
||||
return this.props.element;
|
||||
}
|
||||
}
|
||||
|
||||
export const styles = (theme: Object) => ({
|
||||
export const styles = theme => ({
|
||||
root: {
|
||||
display: 'inline',
|
||||
flexDirection: 'inherit', // Makes the wrapper more transparent.
|
||||
@@ -33,24 +25,23 @@ export const styles = (theme: Object) => ({
|
||||
pointerEvents: 'none',
|
||||
},
|
||||
tooltip: {
|
||||
background: grey[700],
|
||||
backgroundColor: theme.palette.grey[700],
|
||||
borderRadius: 2,
|
||||
color: common.fullWhite,
|
||||
color: common.white,
|
||||
fontFamily: theme.typography.fontFamily,
|
||||
fontSize: theme.typography.pxToRem(14),
|
||||
minHeight: theme.spacing.unit * 4,
|
||||
lineHeight: '32px',
|
||||
opacity: 0,
|
||||
padding: `0 ${theme.spacing.unit}px`,
|
||||
transform: 'scale(0)',
|
||||
transition: theme.transitions.create(['opacity', 'transform'], {
|
||||
duration: theme.transitions.duration.shortest,
|
||||
}),
|
||||
minHeight: 0,
|
||||
padding: theme.spacing.unit,
|
||||
fontSize: theme.typography.pxToRem(14),
|
||||
lineHeight: `${theme.typography.round(16 / 14)}em`,
|
||||
[theme.breakpoints.up('sm')]: {
|
||||
minHeight: 22,
|
||||
lineHeight: '22px',
|
||||
padding: `0 ${theme.spacing.unit}px`,
|
||||
padding: `${theme.spacing.unit / 2}px ${theme.spacing.unit}px`,
|
||||
fontSize: theme.typography.pxToRem(10),
|
||||
lineHeight: `${theme.typography.round(14 / 10)}em`,
|
||||
},
|
||||
},
|
||||
tooltipLeft: {
|
||||
@@ -87,21 +78,7 @@ export const styles = (theme: Object) => ({
|
||||
},
|
||||
});
|
||||
|
||||
export type Placement =
|
||||
| 'bottom-end'
|
||||
| 'bottom-start'
|
||||
| 'bottom'
|
||||
| 'left-end'
|
||||
| 'left-start'
|
||||
| 'left'
|
||||
| 'right-end'
|
||||
| 'right-start'
|
||||
| 'right'
|
||||
| 'top-end'
|
||||
| 'top-start'
|
||||
| 'top';
|
||||
|
||||
function flipPlacement(placement: Placement): Placement {
|
||||
function flipPlacement(placement) {
|
||||
switch (placement) {
|
||||
case 'bottom-end':
|
||||
return 'bottom-start';
|
||||
@@ -116,109 +93,13 @@ function flipPlacement(placement: Placement): Placement {
|
||||
}
|
||||
}
|
||||
|
||||
type ProvidedProps = {
|
||||
classes: Object,
|
||||
disableTriggerFocus: boolean,
|
||||
disableTriggerHover: boolean,
|
||||
disableTriggerTouch: boolean,
|
||||
enterDelay: number,
|
||||
leaveDelay: number,
|
||||
placement: Placement,
|
||||
theme: Object,
|
||||
};
|
||||
|
||||
export type Props = {
|
||||
/**
|
||||
* Tooltip reference component.
|
||||
*/
|
||||
children: Element<any>,
|
||||
/**
|
||||
* Useful to extend the style applied to components.
|
||||
*/
|
||||
classes?: Object,
|
||||
/**
|
||||
* @ignore
|
||||
*/
|
||||
className?: string,
|
||||
/**
|
||||
* Do not respond to focus events.
|
||||
*/
|
||||
disableTriggerFocus?: boolean,
|
||||
/**
|
||||
* Do not respond to hover events.
|
||||
*/
|
||||
disableTriggerHover?: boolean,
|
||||
/**
|
||||
* Do not respond to long press touch events.
|
||||
*/
|
||||
disableTriggerTouch?: boolean,
|
||||
/**
|
||||
* The relationship between the tooltip and the wrapper componnet is not clear from the DOM.
|
||||
* By providind this property, we can use aria-describedby to solve the accessibility issue.
|
||||
*/
|
||||
id?: string,
|
||||
/**
|
||||
* Callback fired when the tooltip requests to be closed.
|
||||
*
|
||||
* @param {object} event The event source of the callback
|
||||
*/
|
||||
onRequestClose?: Function,
|
||||
/**
|
||||
* Callback fired when the tooltip requests to be open.
|
||||
*
|
||||
* @param {object} event The event source of the callback
|
||||
*/
|
||||
onRequestOpen?: Function,
|
||||
/**
|
||||
* If `true`, the tooltip is shown.
|
||||
*/
|
||||
open?: boolean,
|
||||
/**
|
||||
* Tooltip title.
|
||||
*/
|
||||
title: Node,
|
||||
/**
|
||||
* The number of milliseconds to wait before showing the tooltip.
|
||||
*/
|
||||
enterDelay?: number,
|
||||
/**
|
||||
* The number of milliseconds to wait before hidding the tooltip.
|
||||
*/
|
||||
leaveDelay?: number,
|
||||
/**
|
||||
* Tooltip placement
|
||||
*/
|
||||
placement?: Placement,
|
||||
/**
|
||||
* Properties applied to the `Popper` element.
|
||||
*/
|
||||
PopperProps?: Object,
|
||||
/**
|
||||
* @ignore
|
||||
*/
|
||||
theme?: Object,
|
||||
};
|
||||
|
||||
type State = {
|
||||
open?: boolean,
|
||||
};
|
||||
|
||||
class Tooltip extends React.Component<ProvidedProps & Props, State> {
|
||||
static defaultProps = {
|
||||
disableTriggerFocus: false,
|
||||
disableTriggerHover: false,
|
||||
disableTriggerTouch: false,
|
||||
enterDelay: 0,
|
||||
leaveDelay: 0,
|
||||
placement: 'bottom',
|
||||
};
|
||||
|
||||
class Tooltip extends React.Component {
|
||||
state = {};
|
||||
|
||||
componentWillMount() {
|
||||
const { props } = this;
|
||||
|
||||
this.isControlled = props.open !== undefined;
|
||||
this.isControlled = props.open != null;
|
||||
|
||||
if (!this.isControlled) {
|
||||
// not controlled, use internal state
|
||||
@@ -232,7 +113,6 @@ class Tooltip extends React.Component<ProvidedProps & Props, State> {
|
||||
warning(
|
||||
!this.children ||
|
||||
!this.children.disabled ||
|
||||
// $FlowFixMe
|
||||
!this.children.tagName.toLowerCase() === 'button',
|
||||
[
|
||||
'Material-UI: you are providing a disabled button children to the Tooltip component.',
|
||||
@@ -266,16 +146,14 @@ class Tooltip extends React.Component<ProvidedProps & Props, State> {
|
||||
|
||||
handleRequestOpen = event => {
|
||||
const { children } = this.props;
|
||||
if (typeof children !== 'string') {
|
||||
const childrenProps = Children.only(children).props;
|
||||
const childrenProps = children.props;
|
||||
|
||||
if (event.type === 'focus' && childrenProps.onFocus) {
|
||||
childrenProps.onFocus(event);
|
||||
}
|
||||
if (event.type === 'focus' && childrenProps.onFocus) {
|
||||
childrenProps.onFocus(event);
|
||||
}
|
||||
|
||||
if (event.type === 'mouseover' && childrenProps.onMouseOver) {
|
||||
childrenProps.onMouseOver(event);
|
||||
}
|
||||
if (event.type === 'mouseover' && childrenProps.onMouseOver) {
|
||||
childrenProps.onMouseOver(event);
|
||||
}
|
||||
|
||||
if (this.ignoreNonTouchEvents && event.type !== 'touchstart') {
|
||||
@@ -297,23 +175,21 @@ class Tooltip extends React.Component<ProvidedProps & Props, State> {
|
||||
this.setState({ open: true });
|
||||
}
|
||||
|
||||
if (this.props.onRequestOpen) {
|
||||
this.props.onRequestOpen(event, true);
|
||||
if (this.props.onOpen) {
|
||||
this.props.onOpen(event, true);
|
||||
}
|
||||
};
|
||||
|
||||
handleRequestClose = event => {
|
||||
handleClose = event => {
|
||||
const { children } = this.props;
|
||||
if (typeof children !== 'string') {
|
||||
const childrenProps = Children.only(children).props;
|
||||
const childrenProps = children.props;
|
||||
|
||||
if (event.type === 'blur' && childrenProps.onBlur) {
|
||||
childrenProps.onBlur(event);
|
||||
}
|
||||
if (event.type === 'blur' && childrenProps.onBlur) {
|
||||
childrenProps.onBlur(event);
|
||||
}
|
||||
|
||||
if (event.type === 'mouseleave' && childrenProps.onMouseLeave) {
|
||||
childrenProps.onMouseLeave(event);
|
||||
}
|
||||
if (event.type === 'mouseleave' && childrenProps.onMouseLeave) {
|
||||
childrenProps.onMouseLeave(event);
|
||||
}
|
||||
|
||||
clearTimeout(this.leaveTimer);
|
||||
@@ -333,20 +209,18 @@ class Tooltip extends React.Component<ProvidedProps & Props, State> {
|
||||
this.setState({ open: false });
|
||||
}
|
||||
|
||||
if (this.props.onRequestClose) {
|
||||
this.props.onRequestClose(event, false);
|
||||
if (this.props.onClose) {
|
||||
this.props.onClose(event, false);
|
||||
}
|
||||
};
|
||||
|
||||
handleTouchStart = event => {
|
||||
this.ignoreNonTouchEvents = true;
|
||||
const { children } = this.props;
|
||||
if (typeof children !== 'string') {
|
||||
const childrenProps = Children.only(children).props;
|
||||
const childrenProps = children.props;
|
||||
|
||||
if (childrenProps.onTouchStart) {
|
||||
childrenProps.onTouchStart(event);
|
||||
}
|
||||
if (childrenProps.onTouchStart) {
|
||||
childrenProps.onTouchStart(event);
|
||||
}
|
||||
|
||||
clearTimeout(this.touchTimer);
|
||||
@@ -358,12 +232,10 @@ class Tooltip extends React.Component<ProvidedProps & Props, State> {
|
||||
|
||||
handleTouchEnd = event => {
|
||||
const { children } = this.props;
|
||||
if (typeof children !== 'string') {
|
||||
const childrenProps = Children.only(children).props;
|
||||
const childrenProps = children.props;
|
||||
|
||||
if (childrenProps.onTouchEnd) {
|
||||
childrenProps.onTouchEnd(event);
|
||||
}
|
||||
if (childrenProps.onTouchEnd) {
|
||||
childrenProps.onTouchEnd(event);
|
||||
}
|
||||
|
||||
clearTimeout(this.touchTimer);
|
||||
@@ -385,20 +257,24 @@ class Tooltip extends React.Component<ProvidedProps & Props, State> {
|
||||
enterDelay,
|
||||
id,
|
||||
leaveDelay,
|
||||
onClose,
|
||||
onOpen,
|
||||
open: openProp,
|
||||
onRequestClose,
|
||||
onRequestOpen,
|
||||
theme,
|
||||
title,
|
||||
placement: rawPlacement,
|
||||
PopperProps: { PopperClassName, ...PopperOther } = {},
|
||||
theme,
|
||||
title,
|
||||
...other
|
||||
} = this.props;
|
||||
|
||||
const placement = theme.direction === 'rtl' ? flipPlacement(rawPlacement) : rawPlacement;
|
||||
const open = this.isControlled ? openProp : this.state.open;
|
||||
let open = this.isControlled ? openProp : this.state.open;
|
||||
const childrenProps = {};
|
||||
|
||||
if (title === '') {
|
||||
open = false;
|
||||
}
|
||||
|
||||
childrenProps['aria-describedby'] = id;
|
||||
|
||||
if (!disableTriggerTouch) {
|
||||
@@ -408,40 +284,35 @@ class Tooltip extends React.Component<ProvidedProps & Props, State> {
|
||||
|
||||
if (!disableTriggerHover) {
|
||||
childrenProps.onMouseOver = this.handleRequestOpen;
|
||||
childrenProps.onMouseLeave = this.handleRequestClose;
|
||||
childrenProps.onMouseLeave = this.handleClose;
|
||||
}
|
||||
|
||||
if (!disableTriggerFocus) {
|
||||
childrenProps.onFocus = this.handleRequestOpen;
|
||||
childrenProps.onBlur = this.handleRequestClose;
|
||||
childrenProps.onBlur = this.handleClose;
|
||||
}
|
||||
|
||||
if (typeof childrenProp !== 'string' && childrenProp.props) {
|
||||
warning(
|
||||
!childrenProp.props.title,
|
||||
[
|
||||
'Material-UI: you have been providing a `title` property to the child of <Tooltip />.',
|
||||
`Remove this title property \`${childrenProp.props.title}\` or the Tooltip component.`,
|
||||
].join('\n'),
|
||||
);
|
||||
}
|
||||
warning(
|
||||
!childrenProp.props.title,
|
||||
[
|
||||
'Material-UI: you have been providing a `title` property to the child of <Tooltip />.',
|
||||
`Remove this title property \`${childrenProp.props.title}\` or the Tooltip component.`,
|
||||
].join('\n'),
|
||||
);
|
||||
|
||||
return (
|
||||
<EventListener target="window" onResize={this.handleResize}>
|
||||
<Manager className={classNames(classes.root, className)} {...other}>
|
||||
<Target>
|
||||
{({ targetProps }) => (
|
||||
<TargetChildren
|
||||
element={
|
||||
typeof childrenProp !== 'string'
|
||||
? React.cloneElement(childrenProp, childrenProps)
|
||||
: childrenProp
|
||||
}
|
||||
<RefHolder
|
||||
ref={node => {
|
||||
this.children = findDOMNode(node);
|
||||
targetProps.ref(this.children);
|
||||
}}
|
||||
/>
|
||||
>
|
||||
{React.cloneElement(childrenProp, childrenProps)}
|
||||
</RefHolder>
|
||||
)}
|
||||
</Target>
|
||||
<Popper
|
||||
@@ -457,18 +328,34 @@ class Tooltip extends React.Component<ProvidedProps & Props, State> {
|
||||
this.popper = node;
|
||||
}}
|
||||
>
|
||||
<div
|
||||
id={id}
|
||||
role="tooltip"
|
||||
aria-hidden={!open}
|
||||
className={classNames(
|
||||
classes.tooltip,
|
||||
{ [classes.tooltipOpen]: open },
|
||||
classes[`tooltip${capitalizeFirstLetter(placement.split('-')[0])}`],
|
||||
)}
|
||||
>
|
||||
{title}
|
||||
</div>
|
||||
{({ popperProps, restProps }) => {
|
||||
const actualPlacement = popperProps['data-placement'] || placement;
|
||||
return (
|
||||
<div
|
||||
{...popperProps}
|
||||
{...restProps}
|
||||
style={{
|
||||
...popperProps.style,
|
||||
top: popperProps.style.top || 0,
|
||||
left: popperProps.style.left || 0,
|
||||
...restProps.style,
|
||||
}}
|
||||
>
|
||||
<div
|
||||
id={id}
|
||||
role="tooltip"
|
||||
aria-hidden={!open}
|
||||
className={classNames(
|
||||
classes.tooltip,
|
||||
{ [classes.tooltipOpen]: open },
|
||||
classes[`tooltip${capitalize(actualPlacement.split('-')[0])}`],
|
||||
)}
|
||||
>
|
||||
{title}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}}
|
||||
</Popper>
|
||||
</Manager>
|
||||
</EventListener>
|
||||
@@ -476,4 +363,98 @@ class Tooltip extends React.Component<ProvidedProps & Props, State> {
|
||||
}
|
||||
}
|
||||
|
||||
Tooltip.propTypes = {
|
||||
/**
|
||||
* Tooltip reference element.
|
||||
*/
|
||||
children: PropTypes.element.isRequired,
|
||||
/**
|
||||
* Useful to extend the style applied to components.
|
||||
*/
|
||||
classes: PropTypes.object.isRequired,
|
||||
/**
|
||||
* @ignore
|
||||
*/
|
||||
className: PropTypes.string,
|
||||
/**
|
||||
* Do not respond to focus events.
|
||||
*/
|
||||
disableTriggerFocus: PropTypes.bool,
|
||||
/**
|
||||
* Do not respond to hover events.
|
||||
*/
|
||||
disableTriggerHover: PropTypes.bool,
|
||||
/**
|
||||
* Do not respond to long press touch events.
|
||||
*/
|
||||
disableTriggerTouch: PropTypes.bool,
|
||||
/**
|
||||
* The number of milliseconds to wait before showing the tooltip.
|
||||
*/
|
||||
enterDelay: PropTypes.number,
|
||||
/**
|
||||
* The relationship between the tooltip and the wrapper component is not clear from the DOM.
|
||||
* By providing this property, we can use aria-describedby to solve the accessibility issue.
|
||||
*/
|
||||
id: PropTypes.string,
|
||||
/**
|
||||
* The number of milliseconds to wait before hidding the tooltip.
|
||||
*/
|
||||
leaveDelay: PropTypes.number,
|
||||
/**
|
||||
* Callback fired when the tooltip requests to be closed.
|
||||
*
|
||||
* @param {object} event The event source of the callback
|
||||
*/
|
||||
onClose: PropTypes.func,
|
||||
/**
|
||||
* Callback fired when the tooltip requests to be open.
|
||||
*
|
||||
* @param {object} event The event source of the callback
|
||||
*/
|
||||
onOpen: PropTypes.func,
|
||||
/**
|
||||
* If `true`, the tooltip is shown.
|
||||
*/
|
||||
open: PropTypes.bool,
|
||||
/**
|
||||
* Tooltip placement
|
||||
*/
|
||||
placement: PropTypes.oneOf([
|
||||
'bottom-end',
|
||||
'bottom-start',
|
||||
'bottom',
|
||||
'left-end',
|
||||
'left-start',
|
||||
'left',
|
||||
'right-end',
|
||||
'right-start',
|
||||
'right',
|
||||
'top-end',
|
||||
'top-start',
|
||||
'top',
|
||||
]),
|
||||
/**
|
||||
* Properties applied to the `Popper` element.
|
||||
*/
|
||||
PopperProps: PropTypes.object,
|
||||
/**
|
||||
* @ignore
|
||||
*/
|
||||
theme: PropTypes.object.isRequired,
|
||||
/**
|
||||
* Tooltip title. Zero-length titles string are never displayed.
|
||||
*/
|
||||
title: PropTypes.node.isRequired,
|
||||
};
|
||||
|
||||
Tooltip.defaultProps = {
|
||||
disableTriggerFocus: false,
|
||||
disableTriggerHover: false,
|
||||
disableTriggerTouch: false,
|
||||
enterDelay: 0,
|
||||
leaveDelay: 0,
|
||||
placement: 'bottom',
|
||||
};
|
||||
|
||||
export default withStyles(styles, { name: 'MuiTooltip', withTheme: true })(Tooltip);
|
||||
|
2
goTorrentWebUI/node_modules/material-ui/Tooltip/index.js.flow
generated
vendored
2
goTorrentWebUI/node_modules/material-ui/Tooltip/index.js.flow
generated
vendored
@@ -1,3 +1 @@
|
||||
// @flow
|
||||
|
||||
export { default } from './Tooltip';
|
||||
|
Reference in New Issue
Block a user