parent
8f1312f79f
commit
2427d05568
|
@ -66,6 +66,12 @@ const factory = (MenuItem) => {
|
|||
: this.props.position;
|
||||
this.setState({ position, width, height });
|
||||
});
|
||||
if (this.state.active) {
|
||||
events.addEventsToDocument({
|
||||
click: this.handleDocumentClick,
|
||||
touchstart: this.handleDocumentClick,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
componentWillReceiveProps(nextProps) {
|
||||
|
|
|
@ -56,6 +56,7 @@ const tooltipFactory = (options = {}) => {
|
|||
]),
|
||||
tooltipDelay: PropTypes.number,
|
||||
tooltipHideOnClick: PropTypes.bool,
|
||||
tooltipOnFocus: PropTypes.bool,
|
||||
tooltipPosition: PropTypes.oneOf(Object.keys(POSITION).map(key => POSITION[key])),
|
||||
tooltipShowOnClick: PropTypes.bool,
|
||||
};
|
||||
|
@ -215,6 +216,7 @@ const tooltipFactory = (options = {}) => {
|
|||
onMouseEnter, // eslint-disable-line no-unused-vars
|
||||
onMouseLeave, // eslint-disable-line no-unused-vars
|
||||
tooltip,
|
||||
tooltipOnFocus, // eslint-disable-line no-unused-vars
|
||||
tooltipDelay, // eslint-disable-line no-unused-vars
|
||||
tooltipHideOnClick, // eslint-disable-line no-unused-vars
|
||||
tooltipPosition, // eslint-disable-line no-unused-vars
|
||||
|
@ -231,10 +233,16 @@ const tooltipFactory = (options = {}) => {
|
|||
...other,
|
||||
className,
|
||||
onClick: this.handleClick,
|
||||
onMouseEnter: this.handleMouseEnter,
|
||||
onMouseLeave: this.handleMouseLeave,
|
||||
};
|
||||
|
||||
if (tooltipOnFocus) {
|
||||
childProps.onFocus = this.handleMouseEnter;
|
||||
childProps.onBlur = this.handleMouseLeave;
|
||||
} else {
|
||||
childProps.onMouseEnter = this.handleMouseEnter;
|
||||
childProps.onMouseLeave = this.handleMouseLeave;
|
||||
}
|
||||
|
||||
const shouldPass = typeof ComposedComponent !== 'string' && defaultPassthrough;
|
||||
const finalProps = shouldPass ? { ...childProps, theme } : childProps;
|
||||
|
||||
|
|
|
@ -1,10 +1,10 @@
|
|||
:root {
|
||||
--tooltip-background: color(rgb(97, 97, 97) a(90%));
|
||||
--tooltip-margin: calc(0.5 * var(--unit));
|
||||
--tooltip-border-radius: calc(0.2 * var(--unit));
|
||||
--tooltip-border-radius: calc(0.5 * var(--unit));
|
||||
--tooltip-color: var(--color-white);
|
||||
--tooltip-font-size: var(--unit);
|
||||
--tooltip-max-width: calc(17 * var(--unit));
|
||||
--tooltip-padding: calc(0.8 * var(--unit));
|
||||
--tooltip-font-size: calc(1.5 * var(--unit));
|
||||
--tooltip-max-width: calc(35 * var(--unit));
|
||||
--tooltip-padding: calc(1.2 * var(--unit));
|
||||
--tooltip-animation-duration: 200ms;
|
||||
}
|
||||
|
|
|
@ -7,7 +7,7 @@
|
|||
font-family: var(--preferred-font);
|
||||
font-size: var(--tooltip-font-size);
|
||||
font-weight: var(--font-weight-bold);
|
||||
line-height: var(--font-size-small);
|
||||
line-height: calc(1.1 * var(--tooltip-font-size));
|
||||
max-width: var(--tooltip-max-width);
|
||||
padding: var(--tooltip-margin);
|
||||
pointer-events: none;
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
"name": "react-toolbox",
|
||||
"description": "A set of React components implementing Google's Material Design specification with the power of CSS Modules.",
|
||||
"homepage": "http://www.react-toolbox.io",
|
||||
"version": "2.0.0-beta.18",
|
||||
"version": "2.0.0-beta.19",
|
||||
"main": "./lib",
|
||||
"module": "./components",
|
||||
"author": {
|
||||
|
|
Loading…
Reference in New Issue