react-tooltip 4.4.5 → 4.5.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +34 -33
- package/dist/index.es.js +12 -7
- package/dist/index.es.js.map +1 -1
- package/dist/index.js +12 -7
- package/dist/index.js.map +1 -1
- package/dist/react-tooltip.d.ts +2 -0
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -2418,7 +2418,7 @@ function generateStyle(uuid, colors) {
|
|
|
2418
2418
|
var arrowColor = colors.arrow;
|
|
2419
2419
|
var arrowRadius = radius.arrow;
|
|
2420
2420
|
var tooltipRadius = radius.tooltip;
|
|
2421
|
-
return "\n \t.".concat(uuid, " {\n\t color: ").concat(textColor, ";\n\t background: ").concat(backgroundColor, ";\n\t border: 1px solid ").concat(borderColor, ";\n\t border-radius: ").concat(tooltipRadius, "px;\n\t padding: ").concat(padding, ";\n \t}\n\n \t.").concat(uuid, ".place-top {\n margin-top: -10px;\n }\n .").concat(uuid, ".place-top::before {\n content: \"\";\n background-color: inherit;\n position: absolute;\n z-index:
|
|
2421
|
+
return "\n \t.".concat(uuid, " {\n\t color: ").concat(textColor, ";\n\t background: ").concat(backgroundColor, ";\n\t border: 1px solid ").concat(borderColor, ";\n\t border-radius: ").concat(tooltipRadius, "px;\n\t padding: ").concat(padding, ";\n \t}\n\n \t.").concat(uuid, ".place-top {\n margin-top: -10px;\n }\n .").concat(uuid, ".place-top::before {\n content: \"\";\n background-color: inherit;\n position: absolute;\n z-index: 2;\n width: 20px;\n height: 12px;\n }\n .").concat(uuid, ".place-top::after {\n content: \"\";\n position: absolute;\n width: 10px;\n height: 10px;\n border-top-right-radius: ").concat(arrowRadius, "px;\n border: 1px solid ").concat(borderColor, ";\n background-color: ").concat(arrowColor, ";\n z-index: -2;\n bottom: -6px;\n left: 50%;\n margin-left: -6px;\n transform: rotate(135deg);\n }\n\n .").concat(uuid, ".place-bottom {\n margin-top: 10px;\n }\n .").concat(uuid, ".place-bottom::before {\n content: \"\";\n background-color: inherit;\n position: absolute;\n z-index: -1;\n width: 18px;\n height: 10px;\n }\n .").concat(uuid, ".place-bottom::after {\n content: \"\";\n position: absolute;\n width: 10px;\n height: 10px;\n border-top-right-radius: ").concat(arrowRadius, "px;\n border: 1px solid ").concat(borderColor, ";\n background-color: ").concat(arrowColor, ";\n z-index: -2;\n top: -6px;\n left: 50%;\n margin-left: -6px;\n transform: rotate(45deg);\n }\n\n .").concat(uuid, ".place-left {\n margin-left: -10px;\n }\n .").concat(uuid, ".place-left::before {\n content: \"\";\n background-color: inherit;\n position: absolute;\n z-index: -1;\n width: 10px;\n height: 18px;\n }\n .").concat(uuid, ".place-left::after {\n content: \"\";\n position: absolute;\n width: 10px;\n height: 10px;\n border-top-right-radius: ").concat(arrowRadius, "px;\n border: 1px solid ").concat(borderColor, ";\n background-color: ").concat(arrowColor, ";\n z-index: -2;\n right: -6px;\n top: 50%;\n margin-top: -6px;\n transform: rotate(45deg);\n }\n\n .").concat(uuid, ".place-right {\n margin-left: 10px;\n }\n .").concat(uuid, ".place-right::before {\n content: \"\";\n background-color: inherit;\n position: absolute;\n z-index: -1;\n width: 10px;\n height: 18px;\n }\n .").concat(uuid, ".place-right::after {\n content: \"\";\n position: absolute;\n width: 10px;\n height: 10px;\n border-top-right-radius: ").concat(arrowRadius, "px;\n border: 1px solid ").concat(borderColor, ";\n background-color: ").concat(arrowColor, ";\n z-index: -2;\n left: -6px;\n top: 50%;\n margin-top: -6px;\n transform: rotate(-135deg);\n }\n ");
|
|
2422
2422
|
}
|
|
2423
2423
|
function getPopupColors(customColors, type, hasBorder) {
|
|
2424
2424
|
var textColor = customColors.text;
|
|
@@ -2515,11 +2515,15 @@ var ReactTooltip = staticMethods(_class = windowListener(_class = customEvent(_c
|
|
|
2515
2515
|
value: function componentDidMount() {
|
|
2516
2516
|
var _this$props = this.props;
|
|
2517
2517
|
_this$props.insecure;
|
|
2518
|
-
var resizeHide = _this$props.resizeHide
|
|
2518
|
+
var resizeHide = _this$props.resizeHide,
|
|
2519
|
+
disableInternalStyle = _this$props.disableInternalStyle;
|
|
2519
2520
|
this.mount = true;
|
|
2520
2521
|
this.bindListener(); // Bind listener for tooltip
|
|
2521
2522
|
this.bindWindowEvents(resizeHide); // Bind global event for static method
|
|
2522
|
-
|
|
2523
|
+
|
|
2524
|
+
if (!disableInternalStyle) {
|
|
2525
|
+
this.injectStyles(); // Inject styles for each DOM root having tooltip.
|
|
2526
|
+
}
|
|
2523
2527
|
}
|
|
2524
2528
|
}, {
|
|
2525
2529
|
key: "componentWillUnmount",
|
|
@@ -3072,7 +3076,7 @@ var ReactTooltip = staticMethods(_class = windowListener(_class = customEvent(_c
|
|
|
3072
3076
|
uuid = _this$state3.uuid;
|
|
3073
3077
|
var content = this.getTooltipContent();
|
|
3074
3078
|
var isEmptyTip = this.isEmptyTip(content);
|
|
3075
|
-
var style = generateTooltipStyle(this.state.uuid, this.state.customColors, this.state.type, this.state.border, this.state.padding, this.state.customRadius);
|
|
3079
|
+
var style = this.props.disableInternalStyle ? '' : generateTooltipStyle(this.state.uuid, this.state.customColors, this.state.type, this.state.border, this.state.padding, this.state.customRadius);
|
|
3076
3080
|
var tooltipClass = '__react_component_tooltip' + " ".concat(this.state.uuid) + (this.state.show && !disable && !isEmptyTip ? ' show' : '') + (this.state.border ? ' ' + this.state.borderClass : '') + " place-".concat(this.state.place) + // top, bottom, left, right
|
|
3077
3081
|
" type-".concat(this.hasCustomColors() ? 'custom' : this.state.type) + (
|
|
3078
3082
|
// dark, success, warning, error, info, light, custom
|
|
@@ -3083,7 +3087,7 @@ var ReactTooltip = staticMethods(_class = windowListener(_class = customEvent(_c
|
|
|
3083
3087
|
}
|
|
3084
3088
|
var wrapperClassName = [tooltipClass, extraClass].filter(Boolean).join(' ');
|
|
3085
3089
|
if (html) {
|
|
3086
|
-
var htmlContent = "".concat(content
|
|
3090
|
+
var htmlContent = "".concat(content).concat(style ? "\n<style aria-hidden=\"true\">".concat(style, "</style>") : '');
|
|
3087
3091
|
return /*#__PURE__*/React__default["default"].createElement(Wrapper, _extends({
|
|
3088
3092
|
className: "".concat(wrapperClassName),
|
|
3089
3093
|
id: this.props.id || uuid,
|
|
@@ -3105,7 +3109,7 @@ var ReactTooltip = staticMethods(_class = windowListener(_class = customEvent(_c
|
|
|
3105
3109
|
return _this9.tooltipRef = _ref2;
|
|
3106
3110
|
},
|
|
3107
3111
|
"data-id": "tooltip"
|
|
3108
|
-
}), /*#__PURE__*/React__default["default"].createElement("style", {
|
|
3112
|
+
}), style && /*#__PURE__*/React__default["default"].createElement("style", {
|
|
3109
3113
|
dangerouslySetInnerHTML: {
|
|
3110
3114
|
__html: style
|
|
3111
3115
|
},
|
|
@@ -3156,7 +3160,8 @@ var ReactTooltip = staticMethods(_class = windowListener(_class = customEvent(_c
|
|
|
3156
3160
|
bodyMode: PropTypes__default["default"].bool,
|
|
3157
3161
|
possibleCustomEvents: PropTypes__default["default"].string,
|
|
3158
3162
|
possibleCustomEventsOff: PropTypes__default["default"].string,
|
|
3159
|
-
clickable: PropTypes__default["default"].bool
|
|
3163
|
+
clickable: PropTypes__default["default"].bool,
|
|
3164
|
+
disableInternalStyle: PropTypes__default["default"].bool
|
|
3160
3165
|
};
|
|
3161
3166
|
}
|
|
3162
3167
|
}, {
|