@commercetools-uikit/tooltip 12.2.2 → 12.2.9
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 +3 -3
- package/dist/commercetools-uikit-tooltip.cjs.dev.js +68 -57
- package/dist/commercetools-uikit-tooltip.cjs.prod.js +51 -41
- package/dist/commercetools-uikit-tooltip.esm.js +41 -29
- package/dist/declarations/src/export-types.d.ts +2 -2
- package/dist/declarations/src/index.d.ts +3 -3
- package/dist/declarations/src/tooltip.d.ts +28 -28
- package/dist/declarations/src/tooltip.styles.d.ts +15 -15
- package/dist/declarations/src/version.d.ts +2 -2
- package/package.json +7 -11
package/README.md
CHANGED
|
@@ -30,7 +30,7 @@ npm --save install react
|
|
|
30
30
|
## Usage
|
|
31
31
|
|
|
32
32
|
```jsx
|
|
33
|
-
import
|
|
33
|
+
import { forwardRef } from 'react';
|
|
34
34
|
import PropTypes from 'prop-types';
|
|
35
35
|
import ReactDOM from 'react-dom';
|
|
36
36
|
import styled from '@emotion/styled';
|
|
@@ -73,7 +73,7 @@ const ExampleWithDisabledElements = () => (
|
|
|
73
73
|
* If you want to customize this behaviour, then you can pass in a custom element.
|
|
74
74
|
* Be sure to use `React.forwardRef`, as we need the to pass the ref to the wrapper.
|
|
75
75
|
*/
|
|
76
|
-
const Wrapper =
|
|
76
|
+
const Wrapper = forwardRef((props, ref) => (
|
|
77
77
|
<div ref={ref} style={{ display: 'block' }} {...props}>
|
|
78
78
|
{props.children}
|
|
79
79
|
</div>
|
|
@@ -182,7 +182,7 @@ export {
|
|
|
182
182
|
|
|
183
183
|
| Props | Type | Required | Default | Description |
|
|
184
184
|
| ---------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | :------: | --------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
185
|
-
| `children` | `
|
|
185
|
+
| `children` | `ReactElement` | ✅ | | |
|
|
186
186
|
| `closeAfter` | `number` | | `0` | Delay (in milliseconds) between the end of the user interaction, and the closing of the tooltip. |
|
|
187
187
|
| `styles` | `Record` | | | Custom css-in-js object styles for the tooltip body. |
|
|
188
188
|
| `off` | `boolean` | | `false` | Determines if the tooltip should not appear. |
|
|
@@ -2,8 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var react = require('@emotion/react');
|
|
6
|
-
var _extends = require('@babel/runtime-corejs3/helpers/extends');
|
|
5
|
+
var react$1 = require('@emotion/react');
|
|
7
6
|
var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
|
|
8
7
|
var _slicedToArray = require('@babel/runtime-corejs3/helpers/slicedToArray');
|
|
9
8
|
var _pt = require('prop-types');
|
|
@@ -16,7 +15,7 @@ var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/in
|
|
|
16
15
|
var _Object$getOwnPropertyDescriptors = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors');
|
|
17
16
|
var _Object$defineProperties = require('@babel/runtime-corejs3/core-js-stable/object/define-properties');
|
|
18
17
|
var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/object/define-property');
|
|
19
|
-
var
|
|
18
|
+
var react = require('react');
|
|
20
19
|
var reactIs = require('react-is');
|
|
21
20
|
var isNil = require('lodash/isNil');
|
|
22
21
|
var usePopper = require('use-popper');
|
|
@@ -24,6 +23,7 @@ var hooks = require('@commercetools-uikit/hooks');
|
|
|
24
23
|
var utils = require('@commercetools-uikit/utils');
|
|
25
24
|
var _styled = require('@emotion/styled/base');
|
|
26
25
|
var designSystem = require('@commercetools-uikit/design-system');
|
|
26
|
+
var jsxRuntime = require('@emotion/react/jsx-runtime');
|
|
27
27
|
|
|
28
28
|
function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
|
|
29
29
|
|
|
@@ -37,14 +37,13 @@ var _forEachInstanceProperty__default = /*#__PURE__*/_interopDefault(_forEachIns
|
|
|
37
37
|
var _Object$getOwnPropertyDescriptors__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertyDescriptors);
|
|
38
38
|
var _Object$defineProperties__default = /*#__PURE__*/_interopDefault(_Object$defineProperties);
|
|
39
39
|
var _Object$defineProperty__default = /*#__PURE__*/_interopDefault(_Object$defineProperty);
|
|
40
|
-
var React__default = /*#__PURE__*/_interopDefault(React);
|
|
41
40
|
var isNil__default = /*#__PURE__*/_interopDefault(isNil);
|
|
42
41
|
var usePopper__default = /*#__PURE__*/_interopDefault(usePopper);
|
|
43
42
|
var _styled__default = /*#__PURE__*/_interopDefault(_styled);
|
|
44
43
|
|
|
45
|
-
function ownKeys$1(object, enumerableOnly) { var keys = _Object$keys__default[
|
|
44
|
+
function ownKeys$1(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); if (enumerableOnly) { symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
46
45
|
|
|
47
|
-
function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty__default[
|
|
46
|
+
function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty__default["default"](_context = ownKeys$1(Object(source), true)).call(_context, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default["default"]) { _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)); } else { var _context2; _forEachInstanceProperty__default["default"](_context2 = ownKeys$1(Object(source))).call(_context2, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } } return target; }
|
|
48
47
|
|
|
49
48
|
function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
|
|
50
49
|
|
|
@@ -66,12 +65,12 @@ var getOffsetMargin = function getOffsetMargin(_ref) {
|
|
|
66
65
|
}
|
|
67
66
|
};
|
|
68
67
|
|
|
69
|
-
var Body = _styled__default[
|
|
68
|
+
var Body = _styled__default["default"]("div", process.env.NODE_ENV === "production" ? {
|
|
70
69
|
target: "e14le4p1"
|
|
71
70
|
} : {
|
|
72
71
|
target: "e14le4p1",
|
|
73
72
|
label: "Body"
|
|
74
|
-
})("font-family:inherit;border-radius:", designSystem.customProperties.borderRadius6, ";padding:", designSystem.customProperties.spacingXs, " ", designSystem.customProperties.spacingS, ";border:'none';box-shadow:", designSystem.customProperties.shadow15, ";font-size:0.857rem;opacity:0.95;color:", designSystem.customProperties.colorSurface, ";background-color:", designSystem.customProperties.colorAccent, ";"); // here we use object styles so we can spread these
|
|
73
|
+
})("font-family:inherit;border-radius:", designSystem.customProperties.borderRadius6, ";padding:", designSystem.customProperties.spacingXs, " ", designSystem.customProperties.spacingS, ";border:'none';box-shadow:", designSystem.customProperties.shadow15, ";font-size:0.857rem;opacity:0.95;color:", designSystem.customProperties.colorSurface, ";background-color:", designSystem.customProperties.colorAccent, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRvb2x0aXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQW1COEIiLCJmaWxlIjoidG9vbHRpcC5zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDU1NQcm9wZXJ0aWVzIH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgY3VzdG9tUHJvcGVydGllcyBhcyB2YXJzIH0gZnJvbSAnQGNvbW1lcmNldG9vbHMtdWlraXQvZGVzaWduLXN5c3RlbSc7XG5pbXBvcnQgdHlwZSB7IFRUb29sdGlwUHJvcHMgfSBmcm9tICcuL3Rvb2x0aXAnO1xuXG5jb25zdCBnZXRPZmZzZXRNYXJnaW4gPSAoeyBwbGFjZW1lbnQgfTogeyBwbGFjZW1lbnQ6IHN0cmluZyB9KSA9PiB7XG4gIGNvbnN0IHBvc2l0aW9uID0gKHBsYWNlbWVudCAmJiBwbGFjZW1lbnQuc3BsaXQoJy0nKVswXSkgfHwgJyc7XG4gIHN3aXRjaCAocG9zaXRpb24pIHtcbiAgICBjYXNlICdsZWZ0JzpcbiAgICBjYXNlICdyaWdodCc6XG4gICAgICByZXR1cm4gYDAgJHt2YXJzLnNwYWNpbmdYc31gO1xuICAgIGNhc2UgJ3RvcCc6XG4gICAgY2FzZSAnYm90dG9tJzpcbiAgICAgIHJldHVybiBgJHt2YXJzLnNwYWNpbmdYc30gMGA7XG4gICAgZGVmYXVsdDpcbiAgICAgIHJldHVybiAnJztcbiAgfVxufTtcblxuZXhwb3J0IGNvbnN0IEJvZHkgPSBzdHlsZWQuZGl2YFxuICBmb250LWZhbWlseTogaW5oZXJpdDtcbiAgYm9yZGVyLXJhZGl1czogJHt2YXJzLmJvcmRlclJhZGl1czZ9O1xuICBwYWRkaW5nOiAke3ZhcnMuc3BhY2luZ1hzfSAke3ZhcnMuc3BhY2luZ1N9O1xuICBib3JkZXI6ICdub25lJztcbiAgYm94LXNoYWRvdzogJHt2YXJzLnNoYWRvdzE1fTtcbiAgZm9udC1zaXplOiAwLjg1N3JlbTtcbiAgb3BhY2l0eTogMC45NTtcbiAgY29sb3I6ICR7dmFycy5jb2xvclN1cmZhY2V9O1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke3ZhcnMuY29sb3JBY2NlbnR9O1xuYDtcblxuLy8gaGVyZSB3ZSB1c2Ugb2JqZWN0IHN0eWxlcyBzbyB3ZSBjYW4gc3ByZWFkIHRoZXNlXG4vLyB3aXRoIHRoZSBzdHlsZXMgd2UgZ2V0IGZyb20gcmVhY3QtcG9wcGVyIDpEXG4vLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgaW1wb3J0L3ByZWZlci1kZWZhdWx0LWV4cG9ydFxuZXhwb3J0IGNvbnN0IGdldEJvZHlTdHlsZXMgPSAoe1xuICBjb25zdHJhaW50LFxuICBwbGFjZW1lbnQsXG4gIGN1c3RvbVN0eWxlcyxcbn06IHtcbiAgY29uc3RyYWludDogVFRvb2x0aXBQcm9wc1snaG9yaXpvbnRhbENvbnN0cmFpbnQnXTtcbiAgcGxhY2VtZW50OiBzdHJpbmc7XG4gIGN1c3RvbVN0eWxlcz86IENTU1Byb3BlcnRpZXM7XG59KTogQ1NTUHJvcGVydGllcyA9PiB7XG4gIHJldHVybiB7XG4gICAgZm9udEZhbWlseTogJ2luaGVyaXQnLFxuICAgIG1hcmdpbjogYCR7Z2V0T2Zmc2V0TWFyZ2luKHsgcGxhY2VtZW50IH0pfSAhaW1wb3J0YW50YCxcbiAgICBtYXhXaWR0aDogKHZhcnMgYXMgUmVjb3JkPHN0cmluZywgc3RyaW5nPilbYGNvbnN0cmFpbnQke2NvbnN0cmFpbnR9YF0sXG4gICAgLy8gc28gaG92ZXJpbmcgb3ZlciB0aGUgdG9vbHRpcCB3aGVuIHRoZSB0b29sdGlwIG92ZXJsYXBzIHRoZSBjb21wb25lbnRcbiAgICBwb2ludGVyRXZlbnRzOiAnbm9uZScsXG4gICAgd2lkdGg6IGNvbnN0cmFpbnQgPT09ICdhdXRvJyA/ICdhdXRvJyA6IHVuZGVmaW5lZCxcbiAgICB6SW5kZXg6IDEsXG4gICAgLi4uY3VzdG9tU3R5bGVzLFxuICB9O1xufTtcblxuZXhwb3J0IGNvbnN0IFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7XG4gIGN1cnNvcjogbm90LWFsbG93ZWQ7XG4gID4gOmRpc2FibGVkIHtcbiAgICBwb2ludGVyLWV2ZW50czogbm9uZTtcbiAgfVxuYDtcbiJdfQ== */")); // here we use object styles so we can spread these
|
|
75
74
|
// with the styles we get from react-popper :D
|
|
76
75
|
// eslint-disable-next-line import/prefer-default-export
|
|
77
76
|
|
|
@@ -91,7 +90,7 @@ var getBodyStyles = function getBodyStyles(_ref2) {
|
|
|
91
90
|
zIndex: 1
|
|
92
91
|
}, customStyles);
|
|
93
92
|
};
|
|
94
|
-
var Wrapper = _styled__default[
|
|
93
|
+
var Wrapper = _styled__default["default"]("div", process.env.NODE_ENV === "production" ? {
|
|
95
94
|
target: "e14le4p0"
|
|
96
95
|
} : {
|
|
97
96
|
target: "e14le4p0",
|
|
@@ -102,16 +101,19 @@ var Wrapper = _styled__default['default']("div", process.env.NODE_ENV === "produ
|
|
|
102
101
|
} : {
|
|
103
102
|
name: "18fwu9s",
|
|
104
103
|
styles: "display:inline-block;cursor:not-allowed;>:disabled{pointer-events:none;}",
|
|
104
|
+
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRvb2x0aXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXVEaUMiLCJmaWxlIjoidG9vbHRpcC5zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDU1NQcm9wZXJ0aWVzIH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgY3VzdG9tUHJvcGVydGllcyBhcyB2YXJzIH0gZnJvbSAnQGNvbW1lcmNldG9vbHMtdWlraXQvZGVzaWduLXN5c3RlbSc7XG5pbXBvcnQgdHlwZSB7IFRUb29sdGlwUHJvcHMgfSBmcm9tICcuL3Rvb2x0aXAnO1xuXG5jb25zdCBnZXRPZmZzZXRNYXJnaW4gPSAoeyBwbGFjZW1lbnQgfTogeyBwbGFjZW1lbnQ6IHN0cmluZyB9KSA9PiB7XG4gIGNvbnN0IHBvc2l0aW9uID0gKHBsYWNlbWVudCAmJiBwbGFjZW1lbnQuc3BsaXQoJy0nKVswXSkgfHwgJyc7XG4gIHN3aXRjaCAocG9zaXRpb24pIHtcbiAgICBjYXNlICdsZWZ0JzpcbiAgICBjYXNlICdyaWdodCc6XG4gICAgICByZXR1cm4gYDAgJHt2YXJzLnNwYWNpbmdYc31gO1xuICAgIGNhc2UgJ3RvcCc6XG4gICAgY2FzZSAnYm90dG9tJzpcbiAgICAgIHJldHVybiBgJHt2YXJzLnNwYWNpbmdYc30gMGA7XG4gICAgZGVmYXVsdDpcbiAgICAgIHJldHVybiAnJztcbiAgfVxufTtcblxuZXhwb3J0IGNvbnN0IEJvZHkgPSBzdHlsZWQuZGl2YFxuICBmb250LWZhbWlseTogaW5oZXJpdDtcbiAgYm9yZGVyLXJhZGl1czogJHt2YXJzLmJvcmRlclJhZGl1czZ9O1xuICBwYWRkaW5nOiAke3ZhcnMuc3BhY2luZ1hzfSAke3ZhcnMuc3BhY2luZ1N9O1xuICBib3JkZXI6ICdub25lJztcbiAgYm94LXNoYWRvdzogJHt2YXJzLnNoYWRvdzE1fTtcbiAgZm9udC1zaXplOiAwLjg1N3JlbTtcbiAgb3BhY2l0eTogMC45NTtcbiAgY29sb3I6ICR7dmFycy5jb2xvclN1cmZhY2V9O1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke3ZhcnMuY29sb3JBY2NlbnR9O1xuYDtcblxuLy8gaGVyZSB3ZSB1c2Ugb2JqZWN0IHN0eWxlcyBzbyB3ZSBjYW4gc3ByZWFkIHRoZXNlXG4vLyB3aXRoIHRoZSBzdHlsZXMgd2UgZ2V0IGZyb20gcmVhY3QtcG9wcGVyIDpEXG4vLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgaW1wb3J0L3ByZWZlci1kZWZhdWx0LWV4cG9ydFxuZXhwb3J0IGNvbnN0IGdldEJvZHlTdHlsZXMgPSAoe1xuICBjb25zdHJhaW50LFxuICBwbGFjZW1lbnQsXG4gIGN1c3RvbVN0eWxlcyxcbn06IHtcbiAgY29uc3RyYWludDogVFRvb2x0aXBQcm9wc1snaG9yaXpvbnRhbENvbnN0cmFpbnQnXTtcbiAgcGxhY2VtZW50OiBzdHJpbmc7XG4gIGN1c3RvbVN0eWxlcz86IENTU1Byb3BlcnRpZXM7XG59KTogQ1NTUHJvcGVydGllcyA9PiB7XG4gIHJldHVybiB7XG4gICAgZm9udEZhbWlseTogJ2luaGVyaXQnLFxuICAgIG1hcmdpbjogYCR7Z2V0T2Zmc2V0TWFyZ2luKHsgcGxhY2VtZW50IH0pfSAhaW1wb3J0YW50YCxcbiAgICBtYXhXaWR0aDogKHZhcnMgYXMgUmVjb3JkPHN0cmluZywgc3RyaW5nPilbYGNvbnN0cmFpbnQke2NvbnN0cmFpbnR9YF0sXG4gICAgLy8gc28gaG92ZXJpbmcgb3ZlciB0aGUgdG9vbHRpcCB3aGVuIHRoZSB0b29sdGlwIG92ZXJsYXBzIHRoZSBjb21wb25lbnRcbiAgICBwb2ludGVyRXZlbnRzOiAnbm9uZScsXG4gICAgd2lkdGg6IGNvbnN0cmFpbnQgPT09ICdhdXRvJyA/ICdhdXRvJyA6IHVuZGVmaW5lZCxcbiAgICB6SW5kZXg6IDEsXG4gICAgLi4uY3VzdG9tU3R5bGVzLFxuICB9O1xufTtcblxuZXhwb3J0IGNvbnN0IFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7XG4gIGN1cnNvcjogbm90LWFsbG93ZWQ7XG4gID4gOmRpc2FibGVkIHtcbiAgICBwb2ludGVyLWV2ZW50czogbm9uZTtcbiAgfVxuYDtcbiJdfQ== */",
|
|
105
105
|
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
106
106
|
});
|
|
107
107
|
|
|
108
|
-
function ownKeys(object, enumerableOnly) { var keys = _Object$keys__default[
|
|
108
|
+
function ownKeys(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); if (enumerableOnly) { symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
109
109
|
|
|
110
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty__default[
|
|
110
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty__default["default"](_context = ownKeys(Object(source), true)).call(_context, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default["default"]) { _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)); } else { var _context2; _forEachInstanceProperty__default["default"](_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } } return target; }
|
|
111
111
|
var sequentialId = utils.createSequentialId('tooltip-');
|
|
112
112
|
|
|
113
113
|
var TooltipWrapper = function TooltipWrapper(props) {
|
|
114
|
-
return
|
|
114
|
+
return jsxRuntime.jsx(jsxRuntime.Fragment, {
|
|
115
|
+
children: props.children
|
|
116
|
+
});
|
|
115
117
|
};
|
|
116
118
|
|
|
117
119
|
TooltipWrapper.displayName = 'TooltipWrapperComponent';
|
|
@@ -125,8 +127,8 @@ var tooltipDefaultProps = {
|
|
|
125
127
|
var Tooltip = function Tooltip(props) {
|
|
126
128
|
var _props$components, _props$components2, _props$components3, _props$components4, _props$components5, _props$components6, _props$styles;
|
|
127
129
|
|
|
128
|
-
var leaveTimer =
|
|
129
|
-
var childrenRef =
|
|
130
|
+
var leaveTimer = react.useRef();
|
|
131
|
+
var childrenRef = react.useRef();
|
|
130
132
|
|
|
131
133
|
if ((_props$components = props.components) !== null && _props$components !== void 0 && _props$components.BodyComponent) {
|
|
132
134
|
process.env.NODE_ENV !== "production" ? utils.warning(reactIs.isValidElementType(props.components.BodyComponent), "ui-kit/Tooltip: the prop 'components.BodyComponent' is not a valid React element.") : void 0;
|
|
@@ -140,7 +142,7 @@ var Tooltip = function Tooltip(props) {
|
|
|
140
142
|
process.env.NODE_ENV !== "production" ? utils.warning(reactIs.isValidElementType(props.components.WrapperComponent), "ui-kit/Tooltip: the prop 'components.WrapperComponent' is not a valid React element.") : void 0;
|
|
141
143
|
}
|
|
142
144
|
|
|
143
|
-
|
|
145
|
+
react.useEffect(function () {
|
|
144
146
|
return function () {
|
|
145
147
|
if (leaveTimer.current) {
|
|
146
148
|
clearTimeout(leaveTimer.current);
|
|
@@ -148,7 +150,7 @@ var Tooltip = function Tooltip(props) {
|
|
|
148
150
|
};
|
|
149
151
|
}, []);
|
|
150
152
|
|
|
151
|
-
var _usePopper = usePopper__default[
|
|
153
|
+
var _usePopper = usePopper__default["default"]({
|
|
152
154
|
placement: props.placement,
|
|
153
155
|
modifiers: props.modifiers
|
|
154
156
|
}),
|
|
@@ -160,17 +162,17 @@ var Tooltip = function Tooltip(props) {
|
|
|
160
162
|
isOpen = _useToggleState2[0],
|
|
161
163
|
toggle = _useToggleState2[1];
|
|
162
164
|
|
|
163
|
-
var closeTooltip =
|
|
165
|
+
var closeTooltip = react.useCallback(function () {
|
|
164
166
|
toggle(false);
|
|
165
167
|
}, [toggle]);
|
|
166
|
-
var openTooltip =
|
|
168
|
+
var openTooltip = react.useCallback(function () {
|
|
167
169
|
toggle(true);
|
|
168
170
|
}, [toggle]);
|
|
169
|
-
var isControlled = !isNil__default[
|
|
171
|
+
var isControlled = !isNil__default["default"](props.isOpen);
|
|
170
172
|
var tooltipIsOpen = isControlled ? props.isOpen : isOpen;
|
|
171
173
|
var id = hooks.useFieldId(props.id, sequentialId);
|
|
172
174
|
var onClose = props.onClose;
|
|
173
|
-
var handleClose =
|
|
175
|
+
var handleClose = react.useCallback(function (event) {
|
|
174
176
|
if (!isControlled) {
|
|
175
177
|
closeTooltip();
|
|
176
178
|
}
|
|
@@ -183,7 +185,7 @@ var Tooltip = function Tooltip(props) {
|
|
|
183
185
|
onFocus = _props$children$props.onFocus,
|
|
184
186
|
onMouseOver = _props$children$props.onMouseOver;
|
|
185
187
|
var onOpen = props.onOpen;
|
|
186
|
-
var handleEnter =
|
|
188
|
+
var handleEnter = react.useCallback(function (event) {
|
|
187
189
|
// Remove the title ahead of time.
|
|
188
190
|
// We don't want to wait for the next render commit.
|
|
189
191
|
// We would risk displaying two tooltips at the same time (native + this one).
|
|
@@ -217,7 +219,7 @@ var Tooltip = function Tooltip(props) {
|
|
|
217
219
|
onBlur = _props$children$props2.onBlur,
|
|
218
220
|
onMouseLeave = _props$children$props2.onMouseLeave;
|
|
219
221
|
var closeAfter = props.closeAfter;
|
|
220
|
-
var handleLeave =
|
|
222
|
+
var handleLeave = react.useCallback(function (event) {
|
|
221
223
|
if (leaveTimer.current) {
|
|
222
224
|
clearTimeout(leaveTimer.current);
|
|
223
225
|
}
|
|
@@ -231,19 +233,19 @@ var Tooltip = function Tooltip(props) {
|
|
|
231
233
|
}
|
|
232
234
|
|
|
233
235
|
if (closeAfter) {
|
|
234
|
-
leaveTimer.current = _setTimeout__default[
|
|
236
|
+
leaveTimer.current = _setTimeout__default["default"](function () {
|
|
235
237
|
handleClose(event);
|
|
236
238
|
}, closeAfter);
|
|
237
239
|
} else {
|
|
238
240
|
handleClose(event);
|
|
239
241
|
}
|
|
240
242
|
}, [closeAfter, onBlur, onMouseLeave, handleClose]);
|
|
241
|
-
|
|
243
|
+
react.useEffect(function () {
|
|
242
244
|
// if tooltip was open, and then component
|
|
243
245
|
// updated to be off, we should close the tooltip
|
|
244
246
|
if (isOpen && props.off) {
|
|
245
247
|
if (closeAfter) {
|
|
246
|
-
leaveTimer.current = _setTimeout__default[
|
|
248
|
+
leaveTimer.current = _setTimeout__default["default"](function () {
|
|
247
249
|
handleClose();
|
|
248
250
|
}, closeAfter);
|
|
249
251
|
} else {
|
|
@@ -273,46 +275,55 @@ var Tooltip = function Tooltip(props) {
|
|
|
273
275
|
var WrapperComponent = ((_props$components4 = props.components) === null || _props$components4 === void 0 ? void 0 : _props$components4.WrapperComponent) || Wrapper;
|
|
274
276
|
var BodyComponent = ((_props$components5 = props.components) === null || _props$components5 === void 0 ? void 0 : _props$components5.BodyComponent) || Body;
|
|
275
277
|
var TooltipWrapperComponent = ((_props$components6 = props.components) === null || _props$components6 === void 0 ? void 0 : _props$components6.TooltipWrapperComponent) || TooltipWrapper;
|
|
276
|
-
return
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
278
|
+
return jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
279
|
+
children: [jsxRuntime.jsx(WrapperComponent, _objectSpread(_objectSpread({}, eventListeners), {}, {
|
|
280
|
+
// @ts-expect-error: yes, ref can be undefined
|
|
281
|
+
ref: reference.ref,
|
|
282
|
+
children: /*#__PURE__*/react.cloneElement(props.children, _objectSpread(_objectSpread({}, childrenProps), tooltipProps))
|
|
283
|
+
})), tooltipIsOpen && jsxRuntime.jsx(TooltipWrapperComponent, {
|
|
284
|
+
children: jsxRuntime.jsx("div", {
|
|
285
|
+
// ref accepts `LegacyRef`, which is a union of `RefObject` and `string`
|
|
286
|
+
// propper.ref returns `RefObject`
|
|
287
|
+
ref: popper.ref,
|
|
288
|
+
css: /*#__PURE__*/react$1.css(_objectSpread(_objectSpread({}, popper.styles), getBodyStyles({
|
|
289
|
+
constraint: props.horizontalConstraint,
|
|
290
|
+
placement: popper.placement,
|
|
291
|
+
customStyles: (_props$styles = props.styles) === null || _props$styles === void 0 ? void 0 : _props$styles.body
|
|
292
|
+
})), process.env.NODE_ENV === "production" ? "" : ";label:Tooltip;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRvb2x0aXAudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWtVWSIsImZpbGUiOiJ0b29sdGlwLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8vIGluc3BpcmVkIGZyb20gaHR0cHM6Ly9naXRodWIuY29tL211aS1vcmcvbWF0ZXJpYWwtdWkvYmxvYi85ZWNjOGRiOGFiYmZiODI5MTExZDNiNWMwNjc4MjY3ODI3OTg0MDI0L3BhY2thZ2VzL21hdGVyaWFsLXVpL3NyYy9Ub29sdGlwL1Rvb2x0aXAuanNcbmltcG9ydCB7IE1vZGlmaWVycyB9IGZyb20gJ3BvcHBlci5qcyc7XG5pbXBvcnQge1xuICBDb21wb25lbnRUeXBlLFxuICBGb2N1c0V2ZW50LFxuICBDaGFuZ2VFdmVudCxcbiAgTGVnYWN5UmVmLFxuICBDU1NQcm9wZXJ0aWVzLFxuICBSZWFjdEVsZW1lbnQsXG4gIHVzZVJlZixcbiAgdXNlRWZmZWN0LFxuICB1c2VDYWxsYmFjayxcbiAgY2xvbmVFbGVtZW50LFxufSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgeyBpc1ZhbGlkRWxlbWVudFR5cGUgfSBmcm9tICdyZWFjdC1pcyc7XG5pbXBvcnQgaXNOaWwgZnJvbSAnbG9kYXNoL2lzTmlsJztcbmltcG9ydCB1c2VQb3BwZXIgZnJvbSAndXNlLXBvcHBlcic7XG5pbXBvcnQgeyB1c2VGaWVsZElkLCB1c2VUb2dnbGVTdGF0ZSB9IGZyb20gJ0Bjb21tZXJjZXRvb2xzLXVpa2l0L2hvb2tzJztcbmltcG9ydCB7IGNyZWF0ZVNlcXVlbnRpYWxJZCwgd2FybmluZyB9IGZyb20gJ0Bjb21tZXJjZXRvb2xzLXVpa2l0L3V0aWxzJztcbmltcG9ydCB7IFdyYXBwZXIsIEJvZHksIGdldEJvZHlTdHlsZXMgfSBmcm9tICcuL3Rvb2x0aXAuc3R5bGVzJztcblxuY29uc3Qgc2VxdWVudGlhbElkID0gY3JlYXRlU2VxdWVudGlhbElkKCd0b29sdGlwLScpO1xuXG50eXBlIFRDb21wb25lbnRzID0ge1xuICAvKipcbiAgICogVGhlIGNvbXBvbmVudCByZW5kZXJlZCBhcyB0aGUgdG9vbHRpcCBib2R5LlxuICAgKi9cbiAgQm9keUNvbXBvbmVudD86IENvbXBvbmVudFR5cGU7XG4gIC8qKlxuICAgKiBXaGVyZSB0aGUgdG9vbHRpcCBzaG91bGQgYmUgcmVuZGVyZWQuIFRoaXMgY2FuIGJlIHVzZWZ1bCB0byByZW5kZXIgdGhlIHRvb2x0aXAgaW50byBhbm90aGVyIHBhcnQgb2YgdGhlIGRvY3VtZW50LCB1c2luZyBSZWFjdCBwb3J0YWwuXG4gICAqL1xuICBUb29sdGlwV3JhcHBlckNvbXBvbmVudD86IENvbXBvbmVudFR5cGU7XG4gIC8qKlxuICAgKiBBIGN1c3RvbSBjb21wb25lbnQgd3JhcHBlciBmb3IgdGhlIHRvb2x0aXAuXG4gICAqL1xuICBXcmFwcGVyQ29tcG9uZW50PzogQ29tcG9uZW50VHlwZTtcbn07XG5cbmV4cG9ydCB0eXBlIFRUb29sdGlwUHJvcHMgPSB7XG4gIGNoaWxkcmVuOiBSZWFjdEVsZW1lbnQ7XG5cbiAgLyoqXG4gICAqIERlbGF5IChpbiBtaWxsaXNlY29uZHMpIGJldHdlZW4gdGhlIGVuZCBvZiB0aGUgdXNlciBpbnRlcmFjdGlvbiwgYW5kIHRoZSBjbG9zaW5nIG9mIHRoZSB0b29sdGlwLlxuICAgKi9cbiAgY2xvc2VBZnRlcjogbnVtYmVyO1xuICAvKipcbiAgICogQ3VzdG9tIGNzcy1pbi1qcyBvYmplY3Qgc3R5bGVzIGZvciB0aGUgdG9vbHRpcCBib2R5LlxuICAgKi9cbiAgc3R5bGVzPzogUmVjb3JkPHN0cmluZywgQ1NTUHJvcGVydGllcz47XG4gIC8qKlxuICAgKiBEZXRlcm1pbmVzIGlmIHRoZSB0b29sdGlwIHNob3VsZCBub3QgYXBwZWFyLlxuICAgKi9cbiAgb2ZmOiBib29sZWFuO1xuICAvKipcbiAgICogQW4gaWRlbnRpZmllciBmb3IgdGhlIHRvb2x0aXAsIHVzZWQgZm9yIGBhcmlhLWRlc2NyaWJlZGJ5YC5cbiAgICovXG4gIGlkPzogc3RyaW5nO1xuICAvKipcbiAgICogQSBjYWxsYmFjayBmdW5jdGlvbiwgY2FsbGVkIHdoZW4gdGhlIHRvb2x0aXAgaXMgY2xvc2luZy5cbiAgICovXG4gIG9uQ2xvc2U/OiAoZT86IENoYW5nZUV2ZW50IHwgRm9jdXNFdmVudCkgPT4gdm9pZDtcbiAgLyoqXG4gICAqIEEgY2FsbGJhY2sgZnVuY3Rpb24sIGNhbGxlZCB3aGVuIHRoZSB0b29sdGlwIGlzIG9wZW5pbmcuXG4gICAqL1xuICBvbk9wZW4/OiAoZT86IENoYW5nZUV2ZW50IHwgRm9jdXNFdmVudCkgPT4gdm9pZDtcbiAgaXNPcGVuPzogYm9vbGVhbjtcbiAgLyoqXG4gICAqIEhvdyB0aGUgdG9vbHRpcCBpcyBwb3NpdGlvbmVkIHJlbGF0aXZlIHRvIHRoZSBjaGlsZCBlbGVtZW50LlxuICAgKi9cbiAgcGxhY2VtZW50PzpcbiAgICB8ICd0b3AnXG4gICAgfCAndG9wLXN0YXJ0J1xuICAgIHwgJ3RvcC1lbmQnXG4gICAgfCAncmlnaHQnXG4gICAgfCAncmlnaHQtc3RhcnQnXG4gICAgfCAncmlnaHQtZW5kJ1xuICAgIHwgJ2JvdHRvbSdcbiAgICB8ICdib3R0b20tc3RhcnQnXG4gICAgfCAnYm90dG9tLWVuZCdcbiAgICB8ICdsZWZ0J1xuICAgIHwgJ2xlZnQtc3RhcnQnXG4gICAgfCAnbGVmdC1lbmQnO1xuICAvKipcbiAgICogVGhlIG1lc3NhZ2UgdG8gc2hvdyBpbiB0aGUgdG9vbHRpcC5cbiAgICovXG4gIHRpdGxlOiBzdHJpbmc7XG4gIC8qKlxuICAgKiBQcm92aWRlcyBhIHdheSB0byBmaW5lLXR1bmUgYW4gYXBwZWFyYW5jZSBvZiB1bmRlcmx5aW5nIFBvcHBlciB0b29sdGlwIGVsZW1lbnQuIEZvciBtb3JlIGluZm9ybWF0aW9uLCBwbGVhc2UgY2hlY2sgW1BvcHBlci5qcyBkb2N1bWVudGF0aW9uXShodHRwczovL3BvcHBlci5qcy5vcmcvcG9wcGVyLWRvY3VtZW50YXRpb24uaHRtbCNtb2RpZmllcnMpLlxuICAgKi9cbiAgbW9kaWZpZXJzPzogTW9kaWZpZXJzO1xuICAvKipcbiAgICogQ3VzdG9taXplIHRoZSBhcHBlYXJhbmNlIG9mIGNlcnRhaW4gZWxlbWVudHMgb2YgdGhlIHRvb2x0aXAuXG4gICAqL1xuICBjb21wb25lbnRzPzogVENvbXBvbmVudHM7XG4gIC8qKlxuICAgKiBIb3Jpem9udGFsIHNpemUgbGltaXQgb2YgdGhlIHRvb2x0aXAuXG4gICAqL1xuICBob3Jpem9udGFsQ29uc3RyYWludD86XG4gICAgfCAxXG4gICAgfCAyXG4gICAgfCAzXG4gICAgfCA0XG4gICAgfCA1XG4gICAgfCA2XG4gICAgfCA3XG4gICAgfCA4XG4gICAgfCA5XG4gICAgfCAxMFxuICAgIHwgMTFcbiAgICB8IDEyXG4gICAgfCAxM1xuICAgIHwgMTRcbiAgICB8IDE1XG4gICAgfCAxNlxuICAgIHwgJ3NjYWxlJ1xuICAgIHwgJ2F1dG8nO1xufTtcblxuY29uc3QgVG9vbHRpcFdyYXBwZXIgPSAocHJvcHM6IFBpY2s8VFRvb2x0aXBQcm9wcywgJ2NoaWxkcmVuJz4pID0+IChcbiAgPD57cHJvcHMuY2hpbGRyZW59PC8+XG4pO1xuVG9vbHRpcFdyYXBwZXIuZGlzcGxheU5hbWUgPSAnVG9vbHRpcFdyYXBwZXJDb21wb25lbnQnO1xuXG5jb25zdCB0b29sdGlwRGVmYXVsdFByb3BzOiBQaWNrPFxuICBUVG9vbHRpcFByb3BzLFxuICAnY2xvc2VBZnRlcicgfCAnaG9yaXpvbnRhbENvbnN0cmFpbnQnIHwgJ29mZicgfCAncGxhY2VtZW50J1xuPiA9IHtcbiAgY2xvc2VBZnRlcjogMCxcbiAgaG9yaXpvbnRhbENvbnN0cmFpbnQ6ICdzY2FsZScsXG4gIG9mZjogZmFsc2UsXG4gIHBsYWNlbWVudDogJ3RvcCcsXG59O1xuXG5jb25zdCBUb29sdGlwID0gKHByb3BzOiBUVG9vbHRpcFByb3BzKSA9PiB7XG4gIGNvbnN0IGxlYXZlVGltZXIgPSB1c2VSZWY8UmV0dXJuVHlwZTx0eXBlb2Ygc2V0VGltZW91dD4+KCk7XG4gIGNvbnN0IGNoaWxkcmVuUmVmID0gdXNlUmVmPFJldHVyblR5cGU8dHlwZW9mIHNldFRpbWVvdXQ+PigpO1xuICBpZiAocHJvcHMuY29tcG9uZW50cz8uQm9keUNvbXBvbmVudCkge1xuICAgIHdhcm5pbmcoXG4gICAgICBpc1ZhbGlkRWxlbWVudFR5cGUocHJvcHMuY29tcG9uZW50cy5Cb2R5Q29tcG9uZW50KSxcbiAgICAgIGB1aS1raXQvVG9vbHRpcDogdGhlIHByb3AgJ2NvbXBvbmVudHMuQm9keUNvbXBvbmVudCcgaXMgbm90IGEgdmFsaWQgUmVhY3QgZWxlbWVudC5gXG4gICAgKTtcbiAgfVxuICBpZiAocHJvcHMuY29tcG9uZW50cz8uVG9vbHRpcFdyYXBwZXJDb21wb25lbnQpIHtcbiAgICB3YXJuaW5nKFxuICAgICAgaXNWYWxpZEVsZW1lbnRUeXBlKHByb3BzLmNvbXBvbmVudHMuVG9vbHRpcFdyYXBwZXJDb21wb25lbnQpLFxuICAgICAgYHVpLWtpdC9Ub29sdGlwOiB0aGUgcHJvcCAnY29tcG9uZW50cy5Ub29sdGlwV3JhcHBlckNvbXBvbmVudCcgaXMgbm90IGEgdmFsaWQgUmVhY3QgZWxlbWVudC5gXG4gICAgKTtcbiAgfVxuICBpZiAocHJvcHMuY29tcG9uZW50cz8uV3JhcHBlckNvbXBvbmVudCkge1xuICAgIHdhcm5pbmcoXG4gICAgICBpc1ZhbGlkRWxlbWVudFR5cGUocHJvcHMuY29tcG9uZW50cy5XcmFwcGVyQ29tcG9uZW50KSxcbiAgICAgIGB1aS1raXQvVG9vbHRpcDogdGhlIHByb3AgJ2NvbXBvbmVudHMuV3JhcHBlckNvbXBvbmVudCcgaXMgbm90IGEgdmFsaWQgUmVhY3QgZWxlbWVudC5gXG4gICAgKTtcbiAgfVxuXG4gIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgcmV0dXJuICgpID0+IHtcbiAgICAgIGlmIChsZWF2ZVRpbWVyLmN1cnJlbnQpIHtcbiAgICAgICAgY2xlYXJUaW1lb3V0KGxlYXZlVGltZXIuY3VycmVudCk7XG4gICAgICB9XG4gICAgfTtcbiAgfSwgW10pO1xuXG4gIGNvbnN0IHsgcmVmZXJlbmNlLCBwb3BwZXIgfSA9IHVzZVBvcHBlcih7XG4gICAgcGxhY2VtZW50OiBwcm9wcy5wbGFjZW1lbnQsXG4gICAgbW9kaWZpZXJzOiBwcm9wcy5tb2RpZmllcnMsXG4gIH0pO1xuICBjb25zdCBbaXNPcGVuLCB0b2dnbGVdID0gdXNlVG9nZ2xlU3RhdGUoZmFsc2UpO1xuICBjb25zdCBjbG9zZVRvb2x0aXAgPSB1c2VDYWxsYmFjaygoKSA9PiB7XG4gICAgdG9nZ2xlKGZhbHNlKTtcbiAgfSwgW3RvZ2dsZV0pO1xuICBjb25zdCBvcGVuVG9vbHRpcCA9IHVzZUNhbGxiYWNrKCgpID0+IHtcbiAgICB0b2dnbGUodHJ1ZSk7XG4gIH0sIFt0b2dnbGVdKTtcblxuICBjb25zdCBpc0NvbnRyb2xsZWQgPSAhaXNOaWwocHJvcHMuaXNPcGVuKTtcbiAgY29uc3QgdG9vbHRpcElzT3BlbiA9IGlzQ29udHJvbGxlZCA/IHByb3BzLmlzT3BlbiA6IGlzT3BlbjtcbiAgY29uc3QgaWQgPSB1c2VGaWVsZElkKHByb3BzLmlkLCBzZXF1ZW50aWFsSWQpO1xuXG4gIGNvbnN0IHsgb25DbG9zZSB9ID0gcHJvcHM7XG4gIGNvbnN0IGhhbmRsZUNsb3NlID0gdXNlQ2FsbGJhY2soXG4gICAgKGV2ZW50PzogQ2hhbmdlRXZlbnQgfCBGb2N1c0V2ZW50KSA9PiB7XG4gICAgICBpZiAoIWlzQ29udHJvbGxlZCkge1xuICAgICAgICBjbG9zZVRvb2x0aXAoKTtcbiAgICAgIH1cbiAgICAgIGlmIChvbkNsb3NlKSB7XG4gICAgICAgIG9uQ2xvc2UoZXZlbnQpO1xuICAgICAgfVxuICAgIH0sXG4gICAgW2lzQ29udHJvbGxlZCwgY2xvc2VUb29sdGlwLCBvbkNsb3NlXVxuICApO1xuXG4gIGNvbnN0IHsgb25Gb2N1cywgb25Nb3VzZU92ZXIgfSA9IHByb3BzLmNoaWxkcmVuLnByb3BzO1xuICBjb25zdCB7IG9uT3BlbiB9ID0gcHJvcHM7XG4gIGNvbnN0IGhhbmRsZUVudGVyID0gdXNlQ2FsbGJhY2soXG4gICAgKGV2ZW50PzogQ2hhbmdlRXZlbnQgfCBGb2N1c0V2ZW50KSA9PiB7XG4gICAgICAvLyBSZW1vdmUgdGhlIHRpdGxlIGFoZWFkIG9mIHRpbWUuXG4gICAgICAvLyBXZSBkb24ndCB3YW50IHRvIHdhaXQgZm9yIHRoZSBuZXh0IHJlbmRlciBjb21taXQuXG4gICAgICAvLyBXZSB3b3VsZCByaXNrIGRpc3BsYXlpbmcgdHdvIHRvb2x0aXBzIGF0IHRoZSBzYW1lIHRpbWUgKG5hdGl2ZSArIHRoaXMgb25lKS5cbiAgICAgIGlmIChjaGlsZHJlblJlZiAmJiB0eXBlb2YgY2hpbGRyZW5SZWYgPT09ICdmdW5jdGlvbicpIHtcbiAgICAgICAgLy8gQHRzLWlnbm9yZVxuICAgICAgICBjaGlsZHJlblJlZi5zZXRBdHRyaWJ1dGUoJ3RpdGxlJywgJycpO1xuICAgICAgfVxuXG4gICAgICBpZiAoZXZlbnQpIHtcbiAgICAgICAgaWYgKGV2ZW50LnR5cGUgPT09ICdtb3VzZW92ZXInICYmIG9uTW91c2VPdmVyKSB7XG4gICAgICAgICAgb25Nb3VzZU92ZXIoZXZlbnQpO1xuICAgICAgICB9XG5cbiAgICAgICAgaWYgKGV2ZW50LnR5cGUgPT09ICdmb2N1cycgJiYgb25Gb2N1cykge1xuICAgICAgICAgIG9uRm9jdXMoZXZlbnQpO1xuICAgICAgICB9XG5cbiAgICAgICAgaWYgKCFpc09wZW4gJiYgIWlzQ29udHJvbGxlZCkge1xuICAgICAgICAgIG9wZW5Ub29sdGlwKCk7XG4gICAgICAgIH1cblxuICAgICAgICBpZiAob25PcGVuKSB7XG4gICAgICAgICAgb25PcGVuKGV2ZW50KTtcbiAgICAgICAgfVxuXG4gICAgICAgIGV2ZW50LnByZXZlbnREZWZhdWx0KCk7XG4gICAgICAgIGV2ZW50LnN0b3BQcm9wYWdhdGlvbigpO1xuICAgICAgfVxuICAgIH0sXG4gICAgW29uRm9jdXMsIG9uT3Blbiwgb25Nb3VzZU92ZXIsIGlzQ29udHJvbGxlZCwgaXNPcGVuLCBvcGVuVG9vbHRpcF1cbiAgKTtcblxuICBjb25zdCB7IG9uQmx1ciwgb25Nb3VzZUxlYXZlIH0gPSBwcm9wcy5jaGlsZHJlbi5wcm9wcztcbiAgY29uc3QgeyBjbG9zZUFmdGVyIH0gPSBwcm9wcztcblxuICBjb25zdCBoYW5kbGVMZWF2ZSA9IHVzZUNhbGxiYWNrKFxuICAgIChldmVudCkgPT4ge1xuICAgICAgaWYgKGxlYXZlVGltZXIuY3VycmVudCkge1xuICAgICAgICBjbGVhclRpbWVvdXQobGVhdmVUaW1lci5jdXJyZW50KTtcbiAgICAgIH1cblxuICAgICAgaWYgKGV2ZW50LnR5cGUgPT09ICdtb3VzZWxlYXZlJyAmJiBvbk1vdXNlTGVhdmUpIHtcbiAgICAgICAgb25Nb3VzZUxlYXZlKGV2ZW50KTtcbiAgICAgIH1cblxuICAgICAgaWYgKGV2ZW50LnR5cGUgPT09ICdibHVyJyAmJiBvbkJsdXIpIHtcbiAgICAgICAgb25CbHVyKGV2ZW50KTtcbiAgICAgIH1cblxuICAgICAgaWYgKGNsb3NlQWZ0ZXIpIHtcbiAgICAgICAgbGVhdmVUaW1lci5jdXJyZW50ID0gc2V0VGltZW91dCgoKSA9PiB7XG4gICAgICAgICAgaGFuZGxlQ2xvc2UoZXZlbnQpO1xuICAgICAgICB9LCBjbG9zZUFmdGVyKTtcbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIGhhbmRsZUNsb3NlKGV2ZW50KTtcbiAgICAgIH1cbiAgICB9LFxuICAgIFtjbG9zZUFmdGVyLCBvbkJsdXIsIG9uTW91c2VMZWF2ZSwgaGFuZGxlQ2xvc2VdXG4gICk7XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICAvLyBpZiB0b29sdGlwIHdhcyBvcGVuLCBhbmQgdGhlbiBjb21wb25lbnRcbiAgICAvLyB1cGRhdGVkIHRvIGJlIG9mZiwgd2Ugc2hvdWxkIGNsb3NlIHRoZSB0b29sdGlwXG4gICAgaWYgKGlzT3BlbiAmJiBwcm9wcy5vZmYpIHtcbiAgICAgIGlmIChjbG9zZUFmdGVyKSB7XG4gICAgICAgIGxlYXZlVGltZXIuY3VycmVudCA9IHNldFRpbWVvdXQoKCkgPT4ge1xuICAgICAgICAgIGhhbmRsZUNsb3NlKCk7XG4gICAgICAgIH0sIGNsb3NlQWZ0ZXIpO1xuICAgICAgfSBlbHNlIHtcbiAgICAgICAgaGFuZGxlQ2xvc2UoKTtcbiAgICAgIH1cbiAgICB9XG4gIH0sIFtwcm9wcy5vZmYsIGNsb3NlQWZ0ZXIsIGhhbmRsZUNsb3NlLCB0b2dnbGUsIGlzT3Blbl0pO1xuXG4gIGNvbnN0IGNoaWxkcmVuUHJvcHMgPSB7XG4gICAgLy8gZG9uJ3QgcGFzcyBldmVudCBsaXN0ZW5lcnMgdG8gY2hpbGRyZW5cbiAgICBvbkZvY3VzOiBudWxsLFxuICAgIG9uTW91c2VPdmVyOiBudWxsLFxuICAgIG9uTW91c2VMZWF2ZTogbnVsbCxcbiAgICBvbkJsdXI6IG51bGwsXG4gIH07XG5cbiAgY29uc3QgdG9vbHRpcFByb3BzID0gIXByb3BzLm9mZlxuICAgID8ge1xuICAgICAgICAnYXJpYS1kZXNjcmliZWRieSc6IHRvb2x0aXBJc09wZW4gPyBpZCA6IG51bGwsXG4gICAgICAgIC8vIGZvciBzZW8gYW5kIGFjY2Vzc2liaWxpdHksIHdlIGFkZCB0aGUgdG9vbHRpcCdzIHRpdGxlXG4gICAgICAgIC8vIGFzIGEgbmF0aXZlIHRpdGxlIHdoZW4gdGhlIHRpdGxlIGlzIGhpZGRlblxuICAgICAgICB0aXRsZTpcbiAgICAgICAgICAhdG9vbHRpcElzT3BlbiAmJiB0eXBlb2YgcHJvcHMudGl0bGUgPT09ICdzdHJpbmcnXG4gICAgICAgICAgICA/IHByb3BzLnRpdGxlXG4gICAgICAgICAgICA6IG51bGwsXG4gICAgICB9XG4gICAgOiB7fTtcblxuICBjb25zdCBldmVudExpc3RlbmVycyA9ICFwcm9wcy5vZmZcbiAgICA/IHtcbiAgICAgICAgb25Nb3VzZU92ZXI6IGhhbmRsZUVudGVyLFxuICAgICAgICBvbk1vdXNlTGVhdmU6IGhhbmRsZUxlYXZlLFxuICAgICAgICBvbkZvY3VzOiBoYW5kbGVFbnRlcixcbiAgICAgICAgb25CbHVyOiBoYW5kbGVMZWF2ZSxcbiAgICAgIH1cbiAgICA6IHt9O1xuXG4gIGNvbnN0IFdyYXBwZXJDb21wb25lbnQgPSBwcm9wcy5jb21wb25lbnRzPy5XcmFwcGVyQ29tcG9uZW50IHx8IFdyYXBwZXI7XG4gIGNvbnN0IEJvZHlDb21wb25lbnQgPSBwcm9wcy5jb21wb25lbnRzPy5Cb2R5Q29tcG9uZW50IHx8IEJvZHk7XG4gIGNvbnN0IFRvb2x0aXBXcmFwcGVyQ29tcG9uZW50ID1cbiAgICBwcm9wcy5jb21wb25lbnRzPy5Ub29sdGlwV3JhcHBlckNvbXBvbmVudCB8fCBUb29sdGlwV3JhcHBlcjtcblxuICByZXR1cm4gKFxuICAgIDw+XG4gICAgICA8V3JhcHBlckNvbXBvbmVudFxuICAgICAgICB7Li4uZXZlbnRMaXN0ZW5lcnN9XG4gICAgICAgIC8vIEB0cy1leHBlY3QtZXJyb3I6IHllcywgcmVmIGNhbiBiZSB1bmRlZmluZWRcbiAgICAgICAgcmVmPXtyZWZlcmVuY2UucmVmfVxuICAgICAgPlxuICAgICAgICB7Y2xvbmVFbGVtZW50KHByb3BzLmNoaWxkcmVuLCB7XG4gICAgICAgICAgLi4uY2hpbGRyZW5Qcm9wcyxcbiAgICAgICAgICAuLi50b29sdGlwUHJvcHMsXG4gICAgICAgIH0pfVxuICAgICAgPC9XcmFwcGVyQ29tcG9uZW50PlxuICAgICAge3Rvb2x0aXBJc09wZW4gJiYgKFxuICAgICAgICA8VG9vbHRpcFdyYXBwZXJDb21wb25lbnQ+XG4gICAgICAgICAgPGRpdlxuICAgICAgICAgICAgLy8gcmVmIGFjY2VwdHMgYExlZ2FjeVJlZmAsIHdoaWNoIGlzIGEgdW5pb24gb2YgYFJlZk9iamVjdGAgYW5kIGBzdHJpbmdgXG4gICAgICAgICAgICAvLyBwcm9wcGVyLnJlZiByZXR1cm5zIGBSZWZPYmplY3RgXG4gICAgICAgICAgICByZWY9e3BvcHBlci5yZWYgYXMgTGVnYWN5UmVmPEhUTUxEaXZFbGVtZW50Pn1cbiAgICAgICAgICAgIGNzcz17e1xuICAgICAgICAgICAgICAuLi5wb3BwZXIuc3R5bGVzLFxuICAgICAgICAgICAgICAuLi5nZXRCb2R5U3R5bGVzKHtcbiAgICAgICAgICAgICAgICBjb25zdHJhaW50OiBwcm9wcy5ob3Jpem9udGFsQ29uc3RyYWludCxcbiAgICAgICAgICAgICAgICBwbGFjZW1lbnQ6IHBvcHBlci5wbGFjZW1lbnQsXG4gICAgICAgICAgICAgICAgY3VzdG9tU3R5bGVzOiBwcm9wcy5zdHlsZXM/LmJvZHksXG4gICAgICAgICAgICAgIH0pLFxuICAgICAgICAgICAgfX1cbiAgICAgICAgICAgIGRhdGEtcGxhY2VtZW50PXtwb3BwZXIucGxhY2VtZW50fVxuICAgICAgICAgID5cbiAgICAgICAgICAgIDxCb2R5Q29tcG9uZW50Pntwcm9wcy50aXRsZX08L0JvZHlDb21wb25lbnQ+XG4gICAgICAgICAgPC9kaXY+XG4gICAgICAgIDwvVG9vbHRpcFdyYXBwZXJDb21wb25lbnQ+XG4gICAgICApfVxuICAgIDwvPlxuICApO1xufTtcblxuVG9vbHRpcC5kaXNwbGF5TmFtZSA9ICdUb29sVGlwJztcblRvb2x0aXAuZGVmYXVsdFByb3BzID0gdG9vbHRpcERlZmF1bHRQcm9wcztcblxuZXhwb3J0IGRlZmF1bHQgVG9vbHRpcDtcbiJdfQ== */"),
|
|
293
|
+
"data-placement": popper.placement,
|
|
294
|
+
children: jsxRuntime.jsx(BodyComponent, {
|
|
295
|
+
children: props.title
|
|
296
|
+
})
|
|
297
|
+
})
|
|
298
|
+
})]
|
|
299
|
+
});
|
|
289
300
|
};
|
|
290
301
|
|
|
291
302
|
Tooltip.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
292
|
-
children: _pt__default[
|
|
293
|
-
closeAfter: _pt__default[
|
|
294
|
-
styles: _pt__default[
|
|
295
|
-
off: _pt__default[
|
|
296
|
-
id: _pt__default[
|
|
297
|
-
onClose: _pt__default[
|
|
298
|
-
onOpen: _pt__default[
|
|
299
|
-
isOpen: _pt__default[
|
|
300
|
-
placement: _pt__default[
|
|
301
|
-
title: _pt__default[
|
|
302
|
-
modifiers: _pt__default[
|
|
303
|
-
components: _pt__default[
|
|
304
|
-
BodyComponent: _pt__default[
|
|
305
|
-
TooltipWrapperComponent: _pt__default[
|
|
306
|
-
WrapperComponent: _pt__default[
|
|
303
|
+
children: _pt__default["default"].element.isRequired,
|
|
304
|
+
closeAfter: _pt__default["default"].number.isRequired,
|
|
305
|
+
styles: _pt__default["default"].objectOf(_pt__default["default"].any),
|
|
306
|
+
off: _pt__default["default"].bool.isRequired,
|
|
307
|
+
id: _pt__default["default"].string,
|
|
308
|
+
onClose: _pt__default["default"].func,
|
|
309
|
+
onOpen: _pt__default["default"].func,
|
|
310
|
+
isOpen: _pt__default["default"].bool,
|
|
311
|
+
placement: _pt__default["default"].oneOf(['top', 'top-start', 'top-end', 'right', 'right-start', 'right-end', 'bottom', 'bottom-start', 'bottom-end', 'left', 'left-start', 'left-end']),
|
|
312
|
+
title: _pt__default["default"].string.isRequired,
|
|
313
|
+
modifiers: _pt__default["default"].any,
|
|
314
|
+
components: _pt__default["default"].shape({
|
|
315
|
+
BodyComponent: _pt__default["default"].elementType,
|
|
316
|
+
TooltipWrapperComponent: _pt__default["default"].elementType,
|
|
317
|
+
WrapperComponent: _pt__default["default"].elementType
|
|
307
318
|
}),
|
|
308
|
-
horizontalConstraint: _pt__default[
|
|
319
|
+
horizontalConstraint: _pt__default["default"].oneOf([1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 'scale', 'auto'])
|
|
309
320
|
} : {};
|
|
310
321
|
Tooltip.displayName = 'ToolTip';
|
|
311
322
|
Tooltip.defaultProps = tooltipDefaultProps;
|
|
312
323
|
var Tooltip$1 = Tooltip;
|
|
313
324
|
|
|
314
|
-
// NOTE: This string will be replaced
|
|
315
|
-
var version =
|
|
325
|
+
// NOTE: This string will be replaced on build time with the package version.
|
|
326
|
+
var version = "12.2.9";
|
|
316
327
|
|
|
317
|
-
exports[
|
|
328
|
+
exports["default"] = Tooltip$1;
|
|
318
329
|
exports.version = version;
|
|
@@ -2,8 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var react = require('@emotion/react');
|
|
6
|
-
var _extends = require('@babel/runtime-corejs3/helpers/extends');
|
|
5
|
+
var react$1 = require('@emotion/react');
|
|
7
6
|
var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
|
|
8
7
|
var _slicedToArray = require('@babel/runtime-corejs3/helpers/slicedToArray');
|
|
9
8
|
require('prop-types');
|
|
@@ -16,7 +15,7 @@ var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/in
|
|
|
16
15
|
var _Object$getOwnPropertyDescriptors = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors');
|
|
17
16
|
var _Object$defineProperties = require('@babel/runtime-corejs3/core-js-stable/object/define-properties');
|
|
18
17
|
var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/object/define-property');
|
|
19
|
-
var
|
|
18
|
+
var react = require('react');
|
|
20
19
|
require('react-is');
|
|
21
20
|
var isNil = require('lodash/isNil');
|
|
22
21
|
var usePopper = require('use-popper');
|
|
@@ -24,6 +23,7 @@ var hooks = require('@commercetools-uikit/hooks');
|
|
|
24
23
|
var utils = require('@commercetools-uikit/utils');
|
|
25
24
|
var _styled = require('@emotion/styled/base');
|
|
26
25
|
var designSystem = require('@commercetools-uikit/design-system');
|
|
26
|
+
var jsxRuntime = require('@emotion/react/jsx-runtime');
|
|
27
27
|
|
|
28
28
|
function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
|
|
29
29
|
|
|
@@ -36,14 +36,13 @@ var _forEachInstanceProperty__default = /*#__PURE__*/_interopDefault(_forEachIns
|
|
|
36
36
|
var _Object$getOwnPropertyDescriptors__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertyDescriptors);
|
|
37
37
|
var _Object$defineProperties__default = /*#__PURE__*/_interopDefault(_Object$defineProperties);
|
|
38
38
|
var _Object$defineProperty__default = /*#__PURE__*/_interopDefault(_Object$defineProperty);
|
|
39
|
-
var React__default = /*#__PURE__*/_interopDefault(React);
|
|
40
39
|
var isNil__default = /*#__PURE__*/_interopDefault(isNil);
|
|
41
40
|
var usePopper__default = /*#__PURE__*/_interopDefault(usePopper);
|
|
42
41
|
var _styled__default = /*#__PURE__*/_interopDefault(_styled);
|
|
43
42
|
|
|
44
|
-
function ownKeys$1(object, enumerableOnly) { var keys = _Object$keys__default[
|
|
43
|
+
function ownKeys$1(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); if (enumerableOnly) { symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
45
44
|
|
|
46
|
-
function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty__default[
|
|
45
|
+
function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty__default["default"](_context = ownKeys$1(Object(source), true)).call(_context, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default["default"]) { _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)); } else { var _context2; _forEachInstanceProperty__default["default"](_context2 = ownKeys$1(Object(source))).call(_context2, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } } return target; }
|
|
47
46
|
|
|
48
47
|
var getOffsetMargin = function getOffsetMargin(_ref) {
|
|
49
48
|
var placement = _ref.placement;
|
|
@@ -63,9 +62,9 @@ var getOffsetMargin = function getOffsetMargin(_ref) {
|
|
|
63
62
|
}
|
|
64
63
|
};
|
|
65
64
|
|
|
66
|
-
var Body = _styled__default[
|
|
65
|
+
var Body = _styled__default["default"]("div", {
|
|
67
66
|
target: "e14le4p1"
|
|
68
|
-
} )("font-family:inherit;border-radius:", designSystem.customProperties.borderRadius6, ";padding:", designSystem.customProperties.spacingXs, " ", designSystem.customProperties.spacingS, ";border:'none';box-shadow:", designSystem.customProperties.shadow15, ";font-size:0.857rem;opacity:0.95;color:", designSystem.customProperties.colorSurface, ";background-color:", designSystem.customProperties.colorAccent, ";"); // here we use object styles so we can spread these
|
|
67
|
+
} )("font-family:inherit;border-radius:", designSystem.customProperties.borderRadius6, ";padding:", designSystem.customProperties.spacingXs, " ", designSystem.customProperties.spacingS, ";border:'none';box-shadow:", designSystem.customProperties.shadow15, ";font-size:0.857rem;opacity:0.95;color:", designSystem.customProperties.colorSurface, ";background-color:", designSystem.customProperties.colorAccent, ";" + ("" )); // here we use object styles so we can spread these
|
|
69
68
|
// with the styles we get from react-popper :D
|
|
70
69
|
// eslint-disable-next-line import/prefer-default-export
|
|
71
70
|
|
|
@@ -85,20 +84,22 @@ var getBodyStyles = function getBodyStyles(_ref2) {
|
|
|
85
84
|
zIndex: 1
|
|
86
85
|
}, customStyles);
|
|
87
86
|
};
|
|
88
|
-
var Wrapper = _styled__default[
|
|
87
|
+
var Wrapper = _styled__default["default"]("div", {
|
|
89
88
|
target: "e14le4p0"
|
|
90
89
|
} )({
|
|
91
90
|
name: "18fwu9s",
|
|
92
91
|
styles: "display:inline-block;cursor:not-allowed;>:disabled{pointer-events:none;}"
|
|
93
92
|
} );
|
|
94
93
|
|
|
95
|
-
function ownKeys(object, enumerableOnly) { var keys = _Object$keys__default[
|
|
94
|
+
function ownKeys(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); if (enumerableOnly) { symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
96
95
|
|
|
97
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty__default[
|
|
96
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty__default["default"](_context = ownKeys(Object(source), true)).call(_context, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default["default"]) { _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)); } else { var _context2; _forEachInstanceProperty__default["default"](_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } } return target; }
|
|
98
97
|
var sequentialId = utils.createSequentialId('tooltip-');
|
|
99
98
|
|
|
100
99
|
var TooltipWrapper = function TooltipWrapper(props) {
|
|
101
|
-
return
|
|
100
|
+
return jsxRuntime.jsx(jsxRuntime.Fragment, {
|
|
101
|
+
children: props.children
|
|
102
|
+
});
|
|
102
103
|
};
|
|
103
104
|
|
|
104
105
|
TooltipWrapper.displayName = 'TooltipWrapperComponent';
|
|
@@ -112,8 +113,8 @@ var tooltipDefaultProps = {
|
|
|
112
113
|
var Tooltip = function Tooltip(props) {
|
|
113
114
|
var _props$components, _props$components2, _props$components3, _props$components4, _props$components5, _props$components6, _props$styles;
|
|
114
115
|
|
|
115
|
-
var leaveTimer =
|
|
116
|
-
var childrenRef =
|
|
116
|
+
var leaveTimer = react.useRef();
|
|
117
|
+
var childrenRef = react.useRef();
|
|
117
118
|
|
|
118
119
|
if ((_props$components = props.components) !== null && _props$components !== void 0 && _props$components.BodyComponent) ;
|
|
119
120
|
|
|
@@ -121,7 +122,7 @@ var Tooltip = function Tooltip(props) {
|
|
|
121
122
|
|
|
122
123
|
if ((_props$components3 = props.components) !== null && _props$components3 !== void 0 && _props$components3.WrapperComponent) ;
|
|
123
124
|
|
|
124
|
-
|
|
125
|
+
react.useEffect(function () {
|
|
125
126
|
return function () {
|
|
126
127
|
if (leaveTimer.current) {
|
|
127
128
|
clearTimeout(leaveTimer.current);
|
|
@@ -129,7 +130,7 @@ var Tooltip = function Tooltip(props) {
|
|
|
129
130
|
};
|
|
130
131
|
}, []);
|
|
131
132
|
|
|
132
|
-
var _usePopper = usePopper__default[
|
|
133
|
+
var _usePopper = usePopper__default["default"]({
|
|
133
134
|
placement: props.placement,
|
|
134
135
|
modifiers: props.modifiers
|
|
135
136
|
}),
|
|
@@ -141,17 +142,17 @@ var Tooltip = function Tooltip(props) {
|
|
|
141
142
|
isOpen = _useToggleState2[0],
|
|
142
143
|
toggle = _useToggleState2[1];
|
|
143
144
|
|
|
144
|
-
var closeTooltip =
|
|
145
|
+
var closeTooltip = react.useCallback(function () {
|
|
145
146
|
toggle(false);
|
|
146
147
|
}, [toggle]);
|
|
147
|
-
var openTooltip =
|
|
148
|
+
var openTooltip = react.useCallback(function () {
|
|
148
149
|
toggle(true);
|
|
149
150
|
}, [toggle]);
|
|
150
|
-
var isControlled = !isNil__default[
|
|
151
|
+
var isControlled = !isNil__default["default"](props.isOpen);
|
|
151
152
|
var tooltipIsOpen = isControlled ? props.isOpen : isOpen;
|
|
152
153
|
var id = hooks.useFieldId(props.id, sequentialId);
|
|
153
154
|
var onClose = props.onClose;
|
|
154
|
-
var handleClose =
|
|
155
|
+
var handleClose = react.useCallback(function (event) {
|
|
155
156
|
if (!isControlled) {
|
|
156
157
|
closeTooltip();
|
|
157
158
|
}
|
|
@@ -164,7 +165,7 @@ var Tooltip = function Tooltip(props) {
|
|
|
164
165
|
onFocus = _props$children$props.onFocus,
|
|
165
166
|
onMouseOver = _props$children$props.onMouseOver;
|
|
166
167
|
var onOpen = props.onOpen;
|
|
167
|
-
var handleEnter =
|
|
168
|
+
var handleEnter = react.useCallback(function (event) {
|
|
168
169
|
// Remove the title ahead of time.
|
|
169
170
|
// We don't want to wait for the next render commit.
|
|
170
171
|
// We would risk displaying two tooltips at the same time (native + this one).
|
|
@@ -198,7 +199,7 @@ var Tooltip = function Tooltip(props) {
|
|
|
198
199
|
onBlur = _props$children$props2.onBlur,
|
|
199
200
|
onMouseLeave = _props$children$props2.onMouseLeave;
|
|
200
201
|
var closeAfter = props.closeAfter;
|
|
201
|
-
var handleLeave =
|
|
202
|
+
var handleLeave = react.useCallback(function (event) {
|
|
202
203
|
if (leaveTimer.current) {
|
|
203
204
|
clearTimeout(leaveTimer.current);
|
|
204
205
|
}
|
|
@@ -212,19 +213,19 @@ var Tooltip = function Tooltip(props) {
|
|
|
212
213
|
}
|
|
213
214
|
|
|
214
215
|
if (closeAfter) {
|
|
215
|
-
leaveTimer.current = _setTimeout__default[
|
|
216
|
+
leaveTimer.current = _setTimeout__default["default"](function () {
|
|
216
217
|
handleClose(event);
|
|
217
218
|
}, closeAfter);
|
|
218
219
|
} else {
|
|
219
220
|
handleClose(event);
|
|
220
221
|
}
|
|
221
222
|
}, [closeAfter, onBlur, onMouseLeave, handleClose]);
|
|
222
|
-
|
|
223
|
+
react.useEffect(function () {
|
|
223
224
|
// if tooltip was open, and then component
|
|
224
225
|
// updated to be off, we should close the tooltip
|
|
225
226
|
if (isOpen && props.off) {
|
|
226
227
|
if (closeAfter) {
|
|
227
|
-
leaveTimer.current = _setTimeout__default[
|
|
228
|
+
leaveTimer.current = _setTimeout__default["default"](function () {
|
|
228
229
|
handleClose();
|
|
229
230
|
}, closeAfter);
|
|
230
231
|
} else {
|
|
@@ -254,19 +255,28 @@ var Tooltip = function Tooltip(props) {
|
|
|
254
255
|
var WrapperComponent = ((_props$components4 = props.components) === null || _props$components4 === void 0 ? void 0 : _props$components4.WrapperComponent) || Wrapper;
|
|
255
256
|
var BodyComponent = ((_props$components5 = props.components) === null || _props$components5 === void 0 ? void 0 : _props$components5.BodyComponent) || Body;
|
|
256
257
|
var TooltipWrapperComponent = ((_props$components6 = props.components) === null || _props$components6 === void 0 ? void 0 : _props$components6.TooltipWrapperComponent) || TooltipWrapper;
|
|
257
|
-
return
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
258
|
+
return jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
259
|
+
children: [jsxRuntime.jsx(WrapperComponent, _objectSpread(_objectSpread({}, eventListeners), {}, {
|
|
260
|
+
// @ts-expect-error: yes, ref can be undefined
|
|
261
|
+
ref: reference.ref,
|
|
262
|
+
children: /*#__PURE__*/react.cloneElement(props.children, _objectSpread(_objectSpread({}, childrenProps), tooltipProps))
|
|
263
|
+
})), tooltipIsOpen && jsxRuntime.jsx(TooltipWrapperComponent, {
|
|
264
|
+
children: jsxRuntime.jsx("div", {
|
|
265
|
+
// ref accepts `LegacyRef`, which is a union of `RefObject` and `string`
|
|
266
|
+
// propper.ref returns `RefObject`
|
|
267
|
+
ref: popper.ref,
|
|
268
|
+
css: /*#__PURE__*/react$1.css(_objectSpread(_objectSpread({}, popper.styles), getBodyStyles({
|
|
269
|
+
constraint: props.horizontalConstraint,
|
|
270
|
+
placement: popper.placement,
|
|
271
|
+
customStyles: (_props$styles = props.styles) === null || _props$styles === void 0 ? void 0 : _props$styles.body
|
|
272
|
+
})), "" , "" ),
|
|
273
|
+
"data-placement": popper.placement,
|
|
274
|
+
children: jsxRuntime.jsx(BodyComponent, {
|
|
275
|
+
children: props.title
|
|
276
|
+
})
|
|
277
|
+
})
|
|
278
|
+
})]
|
|
279
|
+
});
|
|
270
280
|
};
|
|
271
281
|
|
|
272
282
|
Tooltip.propTypes = {};
|
|
@@ -274,8 +284,8 @@ Tooltip.displayName = 'ToolTip';
|
|
|
274
284
|
Tooltip.defaultProps = tooltipDefaultProps;
|
|
275
285
|
var Tooltip$1 = Tooltip;
|
|
276
286
|
|
|
277
|
-
// NOTE: This string will be replaced
|
|
278
|
-
var version =
|
|
287
|
+
// NOTE: This string will be replaced on build time with the package version.
|
|
288
|
+
var version = "12.2.9";
|
|
279
289
|
|
|
280
|
-
exports[
|
|
290
|
+
exports["default"] = Tooltip$1;
|
|
281
291
|
exports.version = version;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import _extends from '@babel/runtime-corejs3/helpers/esm/extends';
|
|
1
|
+
import { css } from '@emotion/react';
|
|
3
2
|
import _defineProperty from '@babel/runtime-corejs3/helpers/esm/defineProperty';
|
|
4
3
|
import _slicedToArray from '@babel/runtime-corejs3/helpers/esm/slicedToArray';
|
|
5
4
|
import _pt from 'prop-types';
|
|
@@ -12,7 +11,7 @@ import _forEachInstanceProperty from '@babel/runtime-corejs3/core-js-stable/inst
|
|
|
12
11
|
import _Object$getOwnPropertyDescriptors from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors';
|
|
13
12
|
import _Object$defineProperties from '@babel/runtime-corejs3/core-js-stable/object/define-properties';
|
|
14
13
|
import _Object$defineProperty from '@babel/runtime-corejs3/core-js-stable/object/define-property';
|
|
15
|
-
import
|
|
14
|
+
import { useRef, useEffect, useCallback, cloneElement } from 'react';
|
|
16
15
|
import { isValidElementType } from 'react-is';
|
|
17
16
|
import isNil from 'lodash/isNil';
|
|
18
17
|
import usePopper from 'use-popper';
|
|
@@ -20,6 +19,7 @@ import { useToggleState, useFieldId } from '@commercetools-uikit/hooks';
|
|
|
20
19
|
import { createSequentialId, warning } from '@commercetools-uikit/utils';
|
|
21
20
|
import _styled from '@emotion/styled/base';
|
|
22
21
|
import { customProperties } from '@commercetools-uikit/design-system';
|
|
22
|
+
import { jsxs, Fragment, jsx } from '@emotion/react/jsx-runtime';
|
|
23
23
|
|
|
24
24
|
function ownKeys$1(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); if (enumerableOnly) { symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
25
25
|
|
|
@@ -50,7 +50,7 @@ var Body = _styled("div", process.env.NODE_ENV === "production" ? {
|
|
|
50
50
|
} : {
|
|
51
51
|
target: "e14le4p1",
|
|
52
52
|
label: "Body"
|
|
53
|
-
})("font-family:inherit;border-radius:", customProperties.borderRadius6, ";padding:", customProperties.spacingXs, " ", customProperties.spacingS, ";border:'none';box-shadow:", customProperties.shadow15, ";font-size:0.857rem;opacity:0.95;color:", customProperties.colorSurface, ";background-color:", customProperties.colorAccent, ";"); // here we use object styles so we can spread these
|
|
53
|
+
})("font-family:inherit;border-radius:", customProperties.borderRadius6, ";padding:", customProperties.spacingXs, " ", customProperties.spacingS, ";border:'none';box-shadow:", customProperties.shadow15, ";font-size:0.857rem;opacity:0.95;color:", customProperties.colorSurface, ";background-color:", customProperties.colorAccent, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRvb2x0aXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQW1COEIiLCJmaWxlIjoidG9vbHRpcC5zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDU1NQcm9wZXJ0aWVzIH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgY3VzdG9tUHJvcGVydGllcyBhcyB2YXJzIH0gZnJvbSAnQGNvbW1lcmNldG9vbHMtdWlraXQvZGVzaWduLXN5c3RlbSc7XG5pbXBvcnQgdHlwZSB7IFRUb29sdGlwUHJvcHMgfSBmcm9tICcuL3Rvb2x0aXAnO1xuXG5jb25zdCBnZXRPZmZzZXRNYXJnaW4gPSAoeyBwbGFjZW1lbnQgfTogeyBwbGFjZW1lbnQ6IHN0cmluZyB9KSA9PiB7XG4gIGNvbnN0IHBvc2l0aW9uID0gKHBsYWNlbWVudCAmJiBwbGFjZW1lbnQuc3BsaXQoJy0nKVswXSkgfHwgJyc7XG4gIHN3aXRjaCAocG9zaXRpb24pIHtcbiAgICBjYXNlICdsZWZ0JzpcbiAgICBjYXNlICdyaWdodCc6XG4gICAgICByZXR1cm4gYDAgJHt2YXJzLnNwYWNpbmdYc31gO1xuICAgIGNhc2UgJ3RvcCc6XG4gICAgY2FzZSAnYm90dG9tJzpcbiAgICAgIHJldHVybiBgJHt2YXJzLnNwYWNpbmdYc30gMGA7XG4gICAgZGVmYXVsdDpcbiAgICAgIHJldHVybiAnJztcbiAgfVxufTtcblxuZXhwb3J0IGNvbnN0IEJvZHkgPSBzdHlsZWQuZGl2YFxuICBmb250LWZhbWlseTogaW5oZXJpdDtcbiAgYm9yZGVyLXJhZGl1czogJHt2YXJzLmJvcmRlclJhZGl1czZ9O1xuICBwYWRkaW5nOiAke3ZhcnMuc3BhY2luZ1hzfSAke3ZhcnMuc3BhY2luZ1N9O1xuICBib3JkZXI6ICdub25lJztcbiAgYm94LXNoYWRvdzogJHt2YXJzLnNoYWRvdzE1fTtcbiAgZm9udC1zaXplOiAwLjg1N3JlbTtcbiAgb3BhY2l0eTogMC45NTtcbiAgY29sb3I6ICR7dmFycy5jb2xvclN1cmZhY2V9O1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke3ZhcnMuY29sb3JBY2NlbnR9O1xuYDtcblxuLy8gaGVyZSB3ZSB1c2Ugb2JqZWN0IHN0eWxlcyBzbyB3ZSBjYW4gc3ByZWFkIHRoZXNlXG4vLyB3aXRoIHRoZSBzdHlsZXMgd2UgZ2V0IGZyb20gcmVhY3QtcG9wcGVyIDpEXG4vLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgaW1wb3J0L3ByZWZlci1kZWZhdWx0LWV4cG9ydFxuZXhwb3J0IGNvbnN0IGdldEJvZHlTdHlsZXMgPSAoe1xuICBjb25zdHJhaW50LFxuICBwbGFjZW1lbnQsXG4gIGN1c3RvbVN0eWxlcyxcbn06IHtcbiAgY29uc3RyYWludDogVFRvb2x0aXBQcm9wc1snaG9yaXpvbnRhbENvbnN0cmFpbnQnXTtcbiAgcGxhY2VtZW50OiBzdHJpbmc7XG4gIGN1c3RvbVN0eWxlcz86IENTU1Byb3BlcnRpZXM7XG59KTogQ1NTUHJvcGVydGllcyA9PiB7XG4gIHJldHVybiB7XG4gICAgZm9udEZhbWlseTogJ2luaGVyaXQnLFxuICAgIG1hcmdpbjogYCR7Z2V0T2Zmc2V0TWFyZ2luKHsgcGxhY2VtZW50IH0pfSAhaW1wb3J0YW50YCxcbiAgICBtYXhXaWR0aDogKHZhcnMgYXMgUmVjb3JkPHN0cmluZywgc3RyaW5nPilbYGNvbnN0cmFpbnQke2NvbnN0cmFpbnR9YF0sXG4gICAgLy8gc28gaG92ZXJpbmcgb3ZlciB0aGUgdG9vbHRpcCB3aGVuIHRoZSB0b29sdGlwIG92ZXJsYXBzIHRoZSBjb21wb25lbnRcbiAgICBwb2ludGVyRXZlbnRzOiAnbm9uZScsXG4gICAgd2lkdGg6IGNvbnN0cmFpbnQgPT09ICdhdXRvJyA/ICdhdXRvJyA6IHVuZGVmaW5lZCxcbiAgICB6SW5kZXg6IDEsXG4gICAgLi4uY3VzdG9tU3R5bGVzLFxuICB9O1xufTtcblxuZXhwb3J0IGNvbnN0IFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7XG4gIGN1cnNvcjogbm90LWFsbG93ZWQ7XG4gID4gOmRpc2FibGVkIHtcbiAgICBwb2ludGVyLWV2ZW50czogbm9uZTtcbiAgfVxuYDtcbiJdfQ== */")); // here we use object styles so we can spread these
|
|
54
54
|
// with the styles we get from react-popper :D
|
|
55
55
|
// eslint-disable-next-line import/prefer-default-export
|
|
56
56
|
|
|
@@ -81,6 +81,7 @@ var Wrapper = _styled("div", process.env.NODE_ENV === "production" ? {
|
|
|
81
81
|
} : {
|
|
82
82
|
name: "18fwu9s",
|
|
83
83
|
styles: "display:inline-block;cursor:not-allowed;>:disabled{pointer-events:none;}",
|
|
84
|
+
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRvb2x0aXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXVEaUMiLCJmaWxlIjoidG9vbHRpcC5zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDU1NQcm9wZXJ0aWVzIH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgY3VzdG9tUHJvcGVydGllcyBhcyB2YXJzIH0gZnJvbSAnQGNvbW1lcmNldG9vbHMtdWlraXQvZGVzaWduLXN5c3RlbSc7XG5pbXBvcnQgdHlwZSB7IFRUb29sdGlwUHJvcHMgfSBmcm9tICcuL3Rvb2x0aXAnO1xuXG5jb25zdCBnZXRPZmZzZXRNYXJnaW4gPSAoeyBwbGFjZW1lbnQgfTogeyBwbGFjZW1lbnQ6IHN0cmluZyB9KSA9PiB7XG4gIGNvbnN0IHBvc2l0aW9uID0gKHBsYWNlbWVudCAmJiBwbGFjZW1lbnQuc3BsaXQoJy0nKVswXSkgfHwgJyc7XG4gIHN3aXRjaCAocG9zaXRpb24pIHtcbiAgICBjYXNlICdsZWZ0JzpcbiAgICBjYXNlICdyaWdodCc6XG4gICAgICByZXR1cm4gYDAgJHt2YXJzLnNwYWNpbmdYc31gO1xuICAgIGNhc2UgJ3RvcCc6XG4gICAgY2FzZSAnYm90dG9tJzpcbiAgICAgIHJldHVybiBgJHt2YXJzLnNwYWNpbmdYc30gMGA7XG4gICAgZGVmYXVsdDpcbiAgICAgIHJldHVybiAnJztcbiAgfVxufTtcblxuZXhwb3J0IGNvbnN0IEJvZHkgPSBzdHlsZWQuZGl2YFxuICBmb250LWZhbWlseTogaW5oZXJpdDtcbiAgYm9yZGVyLXJhZGl1czogJHt2YXJzLmJvcmRlclJhZGl1czZ9O1xuICBwYWRkaW5nOiAke3ZhcnMuc3BhY2luZ1hzfSAke3ZhcnMuc3BhY2luZ1N9O1xuICBib3JkZXI6ICdub25lJztcbiAgYm94LXNoYWRvdzogJHt2YXJzLnNoYWRvdzE1fTtcbiAgZm9udC1zaXplOiAwLjg1N3JlbTtcbiAgb3BhY2l0eTogMC45NTtcbiAgY29sb3I6ICR7dmFycy5jb2xvclN1cmZhY2V9O1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAke3ZhcnMuY29sb3JBY2NlbnR9O1xuYDtcblxuLy8gaGVyZSB3ZSB1c2Ugb2JqZWN0IHN0eWxlcyBzbyB3ZSBjYW4gc3ByZWFkIHRoZXNlXG4vLyB3aXRoIHRoZSBzdHlsZXMgd2UgZ2V0IGZyb20gcmVhY3QtcG9wcGVyIDpEXG4vLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgaW1wb3J0L3ByZWZlci1kZWZhdWx0LWV4cG9ydFxuZXhwb3J0IGNvbnN0IGdldEJvZHlTdHlsZXMgPSAoe1xuICBjb25zdHJhaW50LFxuICBwbGFjZW1lbnQsXG4gIGN1c3RvbVN0eWxlcyxcbn06IHtcbiAgY29uc3RyYWludDogVFRvb2x0aXBQcm9wc1snaG9yaXpvbnRhbENvbnN0cmFpbnQnXTtcbiAgcGxhY2VtZW50OiBzdHJpbmc7XG4gIGN1c3RvbVN0eWxlcz86IENTU1Byb3BlcnRpZXM7XG59KTogQ1NTUHJvcGVydGllcyA9PiB7XG4gIHJldHVybiB7XG4gICAgZm9udEZhbWlseTogJ2luaGVyaXQnLFxuICAgIG1hcmdpbjogYCR7Z2V0T2Zmc2V0TWFyZ2luKHsgcGxhY2VtZW50IH0pfSAhaW1wb3J0YW50YCxcbiAgICBtYXhXaWR0aDogKHZhcnMgYXMgUmVjb3JkPHN0cmluZywgc3RyaW5nPilbYGNvbnN0cmFpbnQke2NvbnN0cmFpbnR9YF0sXG4gICAgLy8gc28gaG92ZXJpbmcgb3ZlciB0aGUgdG9vbHRpcCB3aGVuIHRoZSB0b29sdGlwIG92ZXJsYXBzIHRoZSBjb21wb25lbnRcbiAgICBwb2ludGVyRXZlbnRzOiAnbm9uZScsXG4gICAgd2lkdGg6IGNvbnN0cmFpbnQgPT09ICdhdXRvJyA/ICdhdXRvJyA6IHVuZGVmaW5lZCxcbiAgICB6SW5kZXg6IDEsXG4gICAgLi4uY3VzdG9tU3R5bGVzLFxuICB9O1xufTtcblxuZXhwb3J0IGNvbnN0IFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7XG4gIGN1cnNvcjogbm90LWFsbG93ZWQ7XG4gID4gOmRpc2FibGVkIHtcbiAgICBwb2ludGVyLWV2ZW50czogbm9uZTtcbiAgfVxuYDtcbiJdfQ== */",
|
|
84
85
|
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
85
86
|
});
|
|
86
87
|
|
|
@@ -90,7 +91,9 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
|
|
|
90
91
|
var sequentialId = createSequentialId('tooltip-');
|
|
91
92
|
|
|
92
93
|
var TooltipWrapper = function TooltipWrapper(props) {
|
|
93
|
-
return jsx(
|
|
94
|
+
return jsx(Fragment, {
|
|
95
|
+
children: props.children
|
|
96
|
+
});
|
|
94
97
|
};
|
|
95
98
|
|
|
96
99
|
TooltipWrapper.displayName = 'TooltipWrapperComponent';
|
|
@@ -104,8 +107,8 @@ var tooltipDefaultProps = {
|
|
|
104
107
|
var Tooltip = function Tooltip(props) {
|
|
105
108
|
var _props$components, _props$components2, _props$components3, _props$components4, _props$components5, _props$components6, _props$styles;
|
|
106
109
|
|
|
107
|
-
var leaveTimer =
|
|
108
|
-
var childrenRef =
|
|
110
|
+
var leaveTimer = useRef();
|
|
111
|
+
var childrenRef = useRef();
|
|
109
112
|
|
|
110
113
|
if ((_props$components = props.components) !== null && _props$components !== void 0 && _props$components.BodyComponent) {
|
|
111
114
|
process.env.NODE_ENV !== "production" ? warning(isValidElementType(props.components.BodyComponent), "ui-kit/Tooltip: the prop 'components.BodyComponent' is not a valid React element.") : void 0;
|
|
@@ -119,7 +122,7 @@ var Tooltip = function Tooltip(props) {
|
|
|
119
122
|
process.env.NODE_ENV !== "production" ? warning(isValidElementType(props.components.WrapperComponent), "ui-kit/Tooltip: the prop 'components.WrapperComponent' is not a valid React element.") : void 0;
|
|
120
123
|
}
|
|
121
124
|
|
|
122
|
-
|
|
125
|
+
useEffect(function () {
|
|
123
126
|
return function () {
|
|
124
127
|
if (leaveTimer.current) {
|
|
125
128
|
clearTimeout(leaveTimer.current);
|
|
@@ -139,17 +142,17 @@ var Tooltip = function Tooltip(props) {
|
|
|
139
142
|
isOpen = _useToggleState2[0],
|
|
140
143
|
toggle = _useToggleState2[1];
|
|
141
144
|
|
|
142
|
-
var closeTooltip =
|
|
145
|
+
var closeTooltip = useCallback(function () {
|
|
143
146
|
toggle(false);
|
|
144
147
|
}, [toggle]);
|
|
145
|
-
var openTooltip =
|
|
148
|
+
var openTooltip = useCallback(function () {
|
|
146
149
|
toggle(true);
|
|
147
150
|
}, [toggle]);
|
|
148
151
|
var isControlled = !isNil(props.isOpen);
|
|
149
152
|
var tooltipIsOpen = isControlled ? props.isOpen : isOpen;
|
|
150
153
|
var id = useFieldId(props.id, sequentialId);
|
|
151
154
|
var onClose = props.onClose;
|
|
152
|
-
var handleClose =
|
|
155
|
+
var handleClose = useCallback(function (event) {
|
|
153
156
|
if (!isControlled) {
|
|
154
157
|
closeTooltip();
|
|
155
158
|
}
|
|
@@ -162,7 +165,7 @@ var Tooltip = function Tooltip(props) {
|
|
|
162
165
|
onFocus = _props$children$props.onFocus,
|
|
163
166
|
onMouseOver = _props$children$props.onMouseOver;
|
|
164
167
|
var onOpen = props.onOpen;
|
|
165
|
-
var handleEnter =
|
|
168
|
+
var handleEnter = useCallback(function (event) {
|
|
166
169
|
// Remove the title ahead of time.
|
|
167
170
|
// We don't want to wait for the next render commit.
|
|
168
171
|
// We would risk displaying two tooltips at the same time (native + this one).
|
|
@@ -196,7 +199,7 @@ var Tooltip = function Tooltip(props) {
|
|
|
196
199
|
onBlur = _props$children$props2.onBlur,
|
|
197
200
|
onMouseLeave = _props$children$props2.onMouseLeave;
|
|
198
201
|
var closeAfter = props.closeAfter;
|
|
199
|
-
var handleLeave =
|
|
202
|
+
var handleLeave = useCallback(function (event) {
|
|
200
203
|
if (leaveTimer.current) {
|
|
201
204
|
clearTimeout(leaveTimer.current);
|
|
202
205
|
}
|
|
@@ -217,7 +220,7 @@ var Tooltip = function Tooltip(props) {
|
|
|
217
220
|
handleClose(event);
|
|
218
221
|
}
|
|
219
222
|
}, [closeAfter, onBlur, onMouseLeave, handleClose]);
|
|
220
|
-
|
|
223
|
+
useEffect(function () {
|
|
221
224
|
// if tooltip was open, and then component
|
|
222
225
|
// updated to be off, we should close the tooltip
|
|
223
226
|
if (isOpen && props.off) {
|
|
@@ -252,19 +255,28 @@ var Tooltip = function Tooltip(props) {
|
|
|
252
255
|
var WrapperComponent = ((_props$components4 = props.components) === null || _props$components4 === void 0 ? void 0 : _props$components4.WrapperComponent) || Wrapper;
|
|
253
256
|
var BodyComponent = ((_props$components5 = props.components) === null || _props$components5 === void 0 ? void 0 : _props$components5.BodyComponent) || Body;
|
|
254
257
|
var TooltipWrapperComponent = ((_props$components6 = props.components) === null || _props$components6 === void 0 ? void 0 : _props$components6.TooltipWrapperComponent) || TooltipWrapper;
|
|
255
|
-
return
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
258
|
+
return jsxs(Fragment, {
|
|
259
|
+
children: [jsx(WrapperComponent, _objectSpread(_objectSpread({}, eventListeners), {}, {
|
|
260
|
+
// @ts-expect-error: yes, ref can be undefined
|
|
261
|
+
ref: reference.ref,
|
|
262
|
+
children: /*#__PURE__*/cloneElement(props.children, _objectSpread(_objectSpread({}, childrenProps), tooltipProps))
|
|
263
|
+
})), tooltipIsOpen && jsx(TooltipWrapperComponent, {
|
|
264
|
+
children: jsx("div", {
|
|
265
|
+
// ref accepts `LegacyRef`, which is a union of `RefObject` and `string`
|
|
266
|
+
// propper.ref returns `RefObject`
|
|
267
|
+
ref: popper.ref,
|
|
268
|
+
css: /*#__PURE__*/css(_objectSpread(_objectSpread({}, popper.styles), getBodyStyles({
|
|
269
|
+
constraint: props.horizontalConstraint,
|
|
270
|
+
placement: popper.placement,
|
|
271
|
+
customStyles: (_props$styles = props.styles) === null || _props$styles === void 0 ? void 0 : _props$styles.body
|
|
272
|
+
})), process.env.NODE_ENV === "production" ? "" : ";label:Tooltip;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRvb2x0aXAudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWtVWSIsImZpbGUiOiJ0b29sdGlwLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8vIGluc3BpcmVkIGZyb20gaHR0cHM6Ly9naXRodWIuY29tL211aS1vcmcvbWF0ZXJpYWwtdWkvYmxvYi85ZWNjOGRiOGFiYmZiODI5MTExZDNiNWMwNjc4MjY3ODI3OTg0MDI0L3BhY2thZ2VzL21hdGVyaWFsLXVpL3NyYy9Ub29sdGlwL1Rvb2x0aXAuanNcbmltcG9ydCB7IE1vZGlmaWVycyB9IGZyb20gJ3BvcHBlci5qcyc7XG5pbXBvcnQge1xuICBDb21wb25lbnRUeXBlLFxuICBGb2N1c0V2ZW50LFxuICBDaGFuZ2VFdmVudCxcbiAgTGVnYWN5UmVmLFxuICBDU1NQcm9wZXJ0aWVzLFxuICBSZWFjdEVsZW1lbnQsXG4gIHVzZVJlZixcbiAgdXNlRWZmZWN0LFxuICB1c2VDYWxsYmFjayxcbiAgY2xvbmVFbGVtZW50LFxufSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgeyBpc1ZhbGlkRWxlbWVudFR5cGUgfSBmcm9tICdyZWFjdC1pcyc7XG5pbXBvcnQgaXNOaWwgZnJvbSAnbG9kYXNoL2lzTmlsJztcbmltcG9ydCB1c2VQb3BwZXIgZnJvbSAndXNlLXBvcHBlcic7XG5pbXBvcnQgeyB1c2VGaWVsZElkLCB1c2VUb2dnbGVTdGF0ZSB9IGZyb20gJ0Bjb21tZXJjZXRvb2xzLXVpa2l0L2hvb2tzJztcbmltcG9ydCB7IGNyZWF0ZVNlcXVlbnRpYWxJZCwgd2FybmluZyB9IGZyb20gJ0Bjb21tZXJjZXRvb2xzLXVpa2l0L3V0aWxzJztcbmltcG9ydCB7IFdyYXBwZXIsIEJvZHksIGdldEJvZHlTdHlsZXMgfSBmcm9tICcuL3Rvb2x0aXAuc3R5bGVzJztcblxuY29uc3Qgc2VxdWVudGlhbElkID0gY3JlYXRlU2VxdWVudGlhbElkKCd0b29sdGlwLScpO1xuXG50eXBlIFRDb21wb25lbnRzID0ge1xuICAvKipcbiAgICogVGhlIGNvbXBvbmVudCByZW5kZXJlZCBhcyB0aGUgdG9vbHRpcCBib2R5LlxuICAgKi9cbiAgQm9keUNvbXBvbmVudD86IENvbXBvbmVudFR5cGU7XG4gIC8qKlxuICAgKiBXaGVyZSB0aGUgdG9vbHRpcCBzaG91bGQgYmUgcmVuZGVyZWQuIFRoaXMgY2FuIGJlIHVzZWZ1bCB0byByZW5kZXIgdGhlIHRvb2x0aXAgaW50byBhbm90aGVyIHBhcnQgb2YgdGhlIGRvY3VtZW50LCB1c2luZyBSZWFjdCBwb3J0YWwuXG4gICAqL1xuICBUb29sdGlwV3JhcHBlckNvbXBvbmVudD86IENvbXBvbmVudFR5cGU7XG4gIC8qKlxuICAgKiBBIGN1c3RvbSBjb21wb25lbnQgd3JhcHBlciBmb3IgdGhlIHRvb2x0aXAuXG4gICAqL1xuICBXcmFwcGVyQ29tcG9uZW50PzogQ29tcG9uZW50VHlwZTtcbn07XG5cbmV4cG9ydCB0eXBlIFRUb29sdGlwUHJvcHMgPSB7XG4gIGNoaWxkcmVuOiBSZWFjdEVsZW1lbnQ7XG5cbiAgLyoqXG4gICAqIERlbGF5IChpbiBtaWxsaXNlY29uZHMpIGJldHdlZW4gdGhlIGVuZCBvZiB0aGUgdXNlciBpbnRlcmFjdGlvbiwgYW5kIHRoZSBjbG9zaW5nIG9mIHRoZSB0b29sdGlwLlxuICAgKi9cbiAgY2xvc2VBZnRlcjogbnVtYmVyO1xuICAvKipcbiAgICogQ3VzdG9tIGNzcy1pbi1qcyBvYmplY3Qgc3R5bGVzIGZvciB0aGUgdG9vbHRpcCBib2R5LlxuICAgKi9cbiAgc3R5bGVzPzogUmVjb3JkPHN0cmluZywgQ1NTUHJvcGVydGllcz47XG4gIC8qKlxuICAgKiBEZXRlcm1pbmVzIGlmIHRoZSB0b29sdGlwIHNob3VsZCBub3QgYXBwZWFyLlxuICAgKi9cbiAgb2ZmOiBib29sZWFuO1xuICAvKipcbiAgICogQW4gaWRlbnRpZmllciBmb3IgdGhlIHRvb2x0aXAsIHVzZWQgZm9yIGBhcmlhLWRlc2NyaWJlZGJ5YC5cbiAgICovXG4gIGlkPzogc3RyaW5nO1xuICAvKipcbiAgICogQSBjYWxsYmFjayBmdW5jdGlvbiwgY2FsbGVkIHdoZW4gdGhlIHRvb2x0aXAgaXMgY2xvc2luZy5cbiAgICovXG4gIG9uQ2xvc2U/OiAoZT86IENoYW5nZUV2ZW50IHwgRm9jdXNFdmVudCkgPT4gdm9pZDtcbiAgLyoqXG4gICAqIEEgY2FsbGJhY2sgZnVuY3Rpb24sIGNhbGxlZCB3aGVuIHRoZSB0b29sdGlwIGlzIG9wZW5pbmcuXG4gICAqL1xuICBvbk9wZW4/OiAoZT86IENoYW5nZUV2ZW50IHwgRm9jdXNFdmVudCkgPT4gdm9pZDtcbiAgaXNPcGVuPzogYm9vbGVhbjtcbiAgLyoqXG4gICAqIEhvdyB0aGUgdG9vbHRpcCBpcyBwb3NpdGlvbmVkIHJlbGF0aXZlIHRvIHRoZSBjaGlsZCBlbGVtZW50LlxuICAgKi9cbiAgcGxhY2VtZW50PzpcbiAgICB8ICd0b3AnXG4gICAgfCAndG9wLXN0YXJ0J1xuICAgIHwgJ3RvcC1lbmQnXG4gICAgfCAncmlnaHQnXG4gICAgfCAncmlnaHQtc3RhcnQnXG4gICAgfCAncmlnaHQtZW5kJ1xuICAgIHwgJ2JvdHRvbSdcbiAgICB8ICdib3R0b20tc3RhcnQnXG4gICAgfCAnYm90dG9tLWVuZCdcbiAgICB8ICdsZWZ0J1xuICAgIHwgJ2xlZnQtc3RhcnQnXG4gICAgfCAnbGVmdC1lbmQnO1xuICAvKipcbiAgICogVGhlIG1lc3NhZ2UgdG8gc2hvdyBpbiB0aGUgdG9vbHRpcC5cbiAgICovXG4gIHRpdGxlOiBzdHJpbmc7XG4gIC8qKlxuICAgKiBQcm92aWRlcyBhIHdheSB0byBmaW5lLXR1bmUgYW4gYXBwZWFyYW5jZSBvZiB1bmRlcmx5aW5nIFBvcHBlciB0b29sdGlwIGVsZW1lbnQuIEZvciBtb3JlIGluZm9ybWF0aW9uLCBwbGVhc2UgY2hlY2sgW1BvcHBlci5qcyBkb2N1bWVudGF0aW9uXShodHRwczovL3BvcHBlci5qcy5vcmcvcG9wcGVyLWRvY3VtZW50YXRpb24uaHRtbCNtb2RpZmllcnMpLlxuICAgKi9cbiAgbW9kaWZpZXJzPzogTW9kaWZpZXJzO1xuICAvKipcbiAgICogQ3VzdG9taXplIHRoZSBhcHBlYXJhbmNlIG9mIGNlcnRhaW4gZWxlbWVudHMgb2YgdGhlIHRvb2x0aXAuXG4gICAqL1xuICBjb21wb25lbnRzPzogVENvbXBvbmVudHM7XG4gIC8qKlxuICAgKiBIb3Jpem9udGFsIHNpemUgbGltaXQgb2YgdGhlIHRvb2x0aXAuXG4gICAqL1xuICBob3Jpem9udGFsQ29uc3RyYWludD86XG4gICAgfCAxXG4gICAgfCAyXG4gICAgfCAzXG4gICAgfCA0XG4gICAgfCA1XG4gICAgfCA2XG4gICAgfCA3XG4gICAgfCA4XG4gICAgfCA5XG4gICAgfCAxMFxuICAgIHwgMTFcbiAgICB8IDEyXG4gICAgfCAxM1xuICAgIHwgMTRcbiAgICB8IDE1XG4gICAgfCAxNlxuICAgIHwgJ3NjYWxlJ1xuICAgIHwgJ2F1dG8nO1xufTtcblxuY29uc3QgVG9vbHRpcFdyYXBwZXIgPSAocHJvcHM6IFBpY2s8VFRvb2x0aXBQcm9wcywgJ2NoaWxkcmVuJz4pID0+IChcbiAgPD57cHJvcHMuY2hpbGRyZW59PC8+XG4pO1xuVG9vbHRpcFdyYXBwZXIuZGlzcGxheU5hbWUgPSAnVG9vbHRpcFdyYXBwZXJDb21wb25lbnQnO1xuXG5jb25zdCB0b29sdGlwRGVmYXVsdFByb3BzOiBQaWNrPFxuICBUVG9vbHRpcFByb3BzLFxuICAnY2xvc2VBZnRlcicgfCAnaG9yaXpvbnRhbENvbnN0cmFpbnQnIHwgJ29mZicgfCAncGxhY2VtZW50J1xuPiA9IHtcbiAgY2xvc2VBZnRlcjogMCxcbiAgaG9yaXpvbnRhbENvbnN0cmFpbnQ6ICdzY2FsZScsXG4gIG9mZjogZmFsc2UsXG4gIHBsYWNlbWVudDogJ3RvcCcsXG59O1xuXG5jb25zdCBUb29sdGlwID0gKHByb3BzOiBUVG9vbHRpcFByb3BzKSA9PiB7XG4gIGNvbnN0IGxlYXZlVGltZXIgPSB1c2VSZWY8UmV0dXJuVHlwZTx0eXBlb2Ygc2V0VGltZW91dD4+KCk7XG4gIGNvbnN0IGNoaWxkcmVuUmVmID0gdXNlUmVmPFJldHVyblR5cGU8dHlwZW9mIHNldFRpbWVvdXQ+PigpO1xuICBpZiAocHJvcHMuY29tcG9uZW50cz8uQm9keUNvbXBvbmVudCkge1xuICAgIHdhcm5pbmcoXG4gICAgICBpc1ZhbGlkRWxlbWVudFR5cGUocHJvcHMuY29tcG9uZW50cy5Cb2R5Q29tcG9uZW50KSxcbiAgICAgIGB1aS1raXQvVG9vbHRpcDogdGhlIHByb3AgJ2NvbXBvbmVudHMuQm9keUNvbXBvbmVudCcgaXMgbm90IGEgdmFsaWQgUmVhY3QgZWxlbWVudC5gXG4gICAgKTtcbiAgfVxuICBpZiAocHJvcHMuY29tcG9uZW50cz8uVG9vbHRpcFdyYXBwZXJDb21wb25lbnQpIHtcbiAgICB3YXJuaW5nKFxuICAgICAgaXNWYWxpZEVsZW1lbnRUeXBlKHByb3BzLmNvbXBvbmVudHMuVG9vbHRpcFdyYXBwZXJDb21wb25lbnQpLFxuICAgICAgYHVpLWtpdC9Ub29sdGlwOiB0aGUgcHJvcCAnY29tcG9uZW50cy5Ub29sdGlwV3JhcHBlckNvbXBvbmVudCcgaXMgbm90IGEgdmFsaWQgUmVhY3QgZWxlbWVudC5gXG4gICAgKTtcbiAgfVxuICBpZiAocHJvcHMuY29tcG9uZW50cz8uV3JhcHBlckNvbXBvbmVudCkge1xuICAgIHdhcm5pbmcoXG4gICAgICBpc1ZhbGlkRWxlbWVudFR5cGUocHJvcHMuY29tcG9uZW50cy5XcmFwcGVyQ29tcG9uZW50KSxcbiAgICAgIGB1aS1raXQvVG9vbHRpcDogdGhlIHByb3AgJ2NvbXBvbmVudHMuV3JhcHBlckNvbXBvbmVudCcgaXMgbm90IGEgdmFsaWQgUmVhY3QgZWxlbWVudC5gXG4gICAgKTtcbiAgfVxuXG4gIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgcmV0dXJuICgpID0+IHtcbiAgICAgIGlmIChsZWF2ZVRpbWVyLmN1cnJlbnQpIHtcbiAgICAgICAgY2xlYXJUaW1lb3V0KGxlYXZlVGltZXIuY3VycmVudCk7XG4gICAgICB9XG4gICAgfTtcbiAgfSwgW10pO1xuXG4gIGNvbnN0IHsgcmVmZXJlbmNlLCBwb3BwZXIgfSA9IHVzZVBvcHBlcih7XG4gICAgcGxhY2VtZW50OiBwcm9wcy5wbGFjZW1lbnQsXG4gICAgbW9kaWZpZXJzOiBwcm9wcy5tb2RpZmllcnMsXG4gIH0pO1xuICBjb25zdCBbaXNPcGVuLCB0b2dnbGVdID0gdXNlVG9nZ2xlU3RhdGUoZmFsc2UpO1xuICBjb25zdCBjbG9zZVRvb2x0aXAgPSB1c2VDYWxsYmFjaygoKSA9PiB7XG4gICAgdG9nZ2xlKGZhbHNlKTtcbiAgfSwgW3RvZ2dsZV0pO1xuICBjb25zdCBvcGVuVG9vbHRpcCA9IHVzZUNhbGxiYWNrKCgpID0+IHtcbiAgICB0b2dnbGUodHJ1ZSk7XG4gIH0sIFt0b2dnbGVdKTtcblxuICBjb25zdCBpc0NvbnRyb2xsZWQgPSAhaXNOaWwocHJvcHMuaXNPcGVuKTtcbiAgY29uc3QgdG9vbHRpcElzT3BlbiA9IGlzQ29udHJvbGxlZCA/IHByb3BzLmlzT3BlbiA6IGlzT3BlbjtcbiAgY29uc3QgaWQgPSB1c2VGaWVsZElkKHByb3BzLmlkLCBzZXF1ZW50aWFsSWQpO1xuXG4gIGNvbnN0IHsgb25DbG9zZSB9ID0gcHJvcHM7XG4gIGNvbnN0IGhhbmRsZUNsb3NlID0gdXNlQ2FsbGJhY2soXG4gICAgKGV2ZW50PzogQ2hhbmdlRXZlbnQgfCBGb2N1c0V2ZW50KSA9PiB7XG4gICAgICBpZiAoIWlzQ29udHJvbGxlZCkge1xuICAgICAgICBjbG9zZVRvb2x0aXAoKTtcbiAgICAgIH1cbiAgICAgIGlmIChvbkNsb3NlKSB7XG4gICAgICAgIG9uQ2xvc2UoZXZlbnQpO1xuICAgICAgfVxuICAgIH0sXG4gICAgW2lzQ29udHJvbGxlZCwgY2xvc2VUb29sdGlwLCBvbkNsb3NlXVxuICApO1xuXG4gIGNvbnN0IHsgb25Gb2N1cywgb25Nb3VzZU92ZXIgfSA9IHByb3BzLmNoaWxkcmVuLnByb3BzO1xuICBjb25zdCB7IG9uT3BlbiB9ID0gcHJvcHM7XG4gIGNvbnN0IGhhbmRsZUVudGVyID0gdXNlQ2FsbGJhY2soXG4gICAgKGV2ZW50PzogQ2hhbmdlRXZlbnQgfCBGb2N1c0V2ZW50KSA9PiB7XG4gICAgICAvLyBSZW1vdmUgdGhlIHRpdGxlIGFoZWFkIG9mIHRpbWUuXG4gICAgICAvLyBXZSBkb24ndCB3YW50IHRvIHdhaXQgZm9yIHRoZSBuZXh0IHJlbmRlciBjb21taXQuXG4gICAgICAvLyBXZSB3b3VsZCByaXNrIGRpc3BsYXlpbmcgdHdvIHRvb2x0aXBzIGF0IHRoZSBzYW1lIHRpbWUgKG5hdGl2ZSArIHRoaXMgb25lKS5cbiAgICAgIGlmIChjaGlsZHJlblJlZiAmJiB0eXBlb2YgY2hpbGRyZW5SZWYgPT09ICdmdW5jdGlvbicpIHtcbiAgICAgICAgLy8gQHRzLWlnbm9yZVxuICAgICAgICBjaGlsZHJlblJlZi5zZXRBdHRyaWJ1dGUoJ3RpdGxlJywgJycpO1xuICAgICAgfVxuXG4gICAgICBpZiAoZXZlbnQpIHtcbiAgICAgICAgaWYgKGV2ZW50LnR5cGUgPT09ICdtb3VzZW92ZXInICYmIG9uTW91c2VPdmVyKSB7XG4gICAgICAgICAgb25Nb3VzZU92ZXIoZXZlbnQpO1xuICAgICAgICB9XG5cbiAgICAgICAgaWYgKGV2ZW50LnR5cGUgPT09ICdmb2N1cycgJiYgb25Gb2N1cykge1xuICAgICAgICAgIG9uRm9jdXMoZXZlbnQpO1xuICAgICAgICB9XG5cbiAgICAgICAgaWYgKCFpc09wZW4gJiYgIWlzQ29udHJvbGxlZCkge1xuICAgICAgICAgIG9wZW5Ub29sdGlwKCk7XG4gICAgICAgIH1cblxuICAgICAgICBpZiAob25PcGVuKSB7XG4gICAgICAgICAgb25PcGVuKGV2ZW50KTtcbiAgICAgICAgfVxuXG4gICAgICAgIGV2ZW50LnByZXZlbnREZWZhdWx0KCk7XG4gICAgICAgIGV2ZW50LnN0b3BQcm9wYWdhdGlvbigpO1xuICAgICAgfVxuICAgIH0sXG4gICAgW29uRm9jdXMsIG9uT3Blbiwgb25Nb3VzZU92ZXIsIGlzQ29udHJvbGxlZCwgaXNPcGVuLCBvcGVuVG9vbHRpcF1cbiAgKTtcblxuICBjb25zdCB7IG9uQmx1ciwgb25Nb3VzZUxlYXZlIH0gPSBwcm9wcy5jaGlsZHJlbi5wcm9wcztcbiAgY29uc3QgeyBjbG9zZUFmdGVyIH0gPSBwcm9wcztcblxuICBjb25zdCBoYW5kbGVMZWF2ZSA9IHVzZUNhbGxiYWNrKFxuICAgIChldmVudCkgPT4ge1xuICAgICAgaWYgKGxlYXZlVGltZXIuY3VycmVudCkge1xuICAgICAgICBjbGVhclRpbWVvdXQobGVhdmVUaW1lci5jdXJyZW50KTtcbiAgICAgIH1cblxuICAgICAgaWYgKGV2ZW50LnR5cGUgPT09ICdtb3VzZWxlYXZlJyAmJiBvbk1vdXNlTGVhdmUpIHtcbiAgICAgICAgb25Nb3VzZUxlYXZlKGV2ZW50KTtcbiAgICAgIH1cblxuICAgICAgaWYgKGV2ZW50LnR5cGUgPT09ICdibHVyJyAmJiBvbkJsdXIpIHtcbiAgICAgICAgb25CbHVyKGV2ZW50KTtcbiAgICAgIH1cblxuICAgICAgaWYgKGNsb3NlQWZ0ZXIpIHtcbiAgICAgICAgbGVhdmVUaW1lci5jdXJyZW50ID0gc2V0VGltZW91dCgoKSA9PiB7XG4gICAgICAgICAgaGFuZGxlQ2xvc2UoZXZlbnQpO1xuICAgICAgICB9LCBjbG9zZUFmdGVyKTtcbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIGhhbmRsZUNsb3NlKGV2ZW50KTtcbiAgICAgIH1cbiAgICB9LFxuICAgIFtjbG9zZUFmdGVyLCBvbkJsdXIsIG9uTW91c2VMZWF2ZSwgaGFuZGxlQ2xvc2VdXG4gICk7XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICAvLyBpZiB0b29sdGlwIHdhcyBvcGVuLCBhbmQgdGhlbiBjb21wb25lbnRcbiAgICAvLyB1cGRhdGVkIHRvIGJlIG9mZiwgd2Ugc2hvdWxkIGNsb3NlIHRoZSB0b29sdGlwXG4gICAgaWYgKGlzT3BlbiAmJiBwcm9wcy5vZmYpIHtcbiAgICAgIGlmIChjbG9zZUFmdGVyKSB7XG4gICAgICAgIGxlYXZlVGltZXIuY3VycmVudCA9IHNldFRpbWVvdXQoKCkgPT4ge1xuICAgICAgICAgIGhhbmRsZUNsb3NlKCk7XG4gICAgICAgIH0sIGNsb3NlQWZ0ZXIpO1xuICAgICAgfSBlbHNlIHtcbiAgICAgICAgaGFuZGxlQ2xvc2UoKTtcbiAgICAgIH1cbiAgICB9XG4gIH0sIFtwcm9wcy5vZmYsIGNsb3NlQWZ0ZXIsIGhhbmRsZUNsb3NlLCB0b2dnbGUsIGlzT3Blbl0pO1xuXG4gIGNvbnN0IGNoaWxkcmVuUHJvcHMgPSB7XG4gICAgLy8gZG9uJ3QgcGFzcyBldmVudCBsaXN0ZW5lcnMgdG8gY2hpbGRyZW5cbiAgICBvbkZvY3VzOiBudWxsLFxuICAgIG9uTW91c2VPdmVyOiBudWxsLFxuICAgIG9uTW91c2VMZWF2ZTogbnVsbCxcbiAgICBvbkJsdXI6IG51bGwsXG4gIH07XG5cbiAgY29uc3QgdG9vbHRpcFByb3BzID0gIXByb3BzLm9mZlxuICAgID8ge1xuICAgICAgICAnYXJpYS1kZXNjcmliZWRieSc6IHRvb2x0aXBJc09wZW4gPyBpZCA6IG51bGwsXG4gICAgICAgIC8vIGZvciBzZW8gYW5kIGFjY2Vzc2liaWxpdHksIHdlIGFkZCB0aGUgdG9vbHRpcCdzIHRpdGxlXG4gICAgICAgIC8vIGFzIGEgbmF0aXZlIHRpdGxlIHdoZW4gdGhlIHRpdGxlIGlzIGhpZGRlblxuICAgICAgICB0aXRsZTpcbiAgICAgICAgICAhdG9vbHRpcElzT3BlbiAmJiB0eXBlb2YgcHJvcHMudGl0bGUgPT09ICdzdHJpbmcnXG4gICAgICAgICAgICA/IHByb3BzLnRpdGxlXG4gICAgICAgICAgICA6IG51bGwsXG4gICAgICB9XG4gICAgOiB7fTtcblxuICBjb25zdCBldmVudExpc3RlbmVycyA9ICFwcm9wcy5vZmZcbiAgICA/IHtcbiAgICAgICAgb25Nb3VzZU92ZXI6IGhhbmRsZUVudGVyLFxuICAgICAgICBvbk1vdXNlTGVhdmU6IGhhbmRsZUxlYXZlLFxuICAgICAgICBvbkZvY3VzOiBoYW5kbGVFbnRlcixcbiAgICAgICAgb25CbHVyOiBoYW5kbGVMZWF2ZSxcbiAgICAgIH1cbiAgICA6IHt9O1xuXG4gIGNvbnN0IFdyYXBwZXJDb21wb25lbnQgPSBwcm9wcy5jb21wb25lbnRzPy5XcmFwcGVyQ29tcG9uZW50IHx8IFdyYXBwZXI7XG4gIGNvbnN0IEJvZHlDb21wb25lbnQgPSBwcm9wcy5jb21wb25lbnRzPy5Cb2R5Q29tcG9uZW50IHx8IEJvZHk7XG4gIGNvbnN0IFRvb2x0aXBXcmFwcGVyQ29tcG9uZW50ID1cbiAgICBwcm9wcy5jb21wb25lbnRzPy5Ub29sdGlwV3JhcHBlckNvbXBvbmVudCB8fCBUb29sdGlwV3JhcHBlcjtcblxuICByZXR1cm4gKFxuICAgIDw+XG4gICAgICA8V3JhcHBlckNvbXBvbmVudFxuICAgICAgICB7Li4uZXZlbnRMaXN0ZW5lcnN9XG4gICAgICAgIC8vIEB0cy1leHBlY3QtZXJyb3I6IHllcywgcmVmIGNhbiBiZSB1bmRlZmluZWRcbiAgICAgICAgcmVmPXtyZWZlcmVuY2UucmVmfVxuICAgICAgPlxuICAgICAgICB7Y2xvbmVFbGVtZW50KHByb3BzLmNoaWxkcmVuLCB7XG4gICAgICAgICAgLi4uY2hpbGRyZW5Qcm9wcyxcbiAgICAgICAgICAuLi50b29sdGlwUHJvcHMsXG4gICAgICAgIH0pfVxuICAgICAgPC9XcmFwcGVyQ29tcG9uZW50PlxuICAgICAge3Rvb2x0aXBJc09wZW4gJiYgKFxuICAgICAgICA8VG9vbHRpcFdyYXBwZXJDb21wb25lbnQ+XG4gICAgICAgICAgPGRpdlxuICAgICAgICAgICAgLy8gcmVmIGFjY2VwdHMgYExlZ2FjeVJlZmAsIHdoaWNoIGlzIGEgdW5pb24gb2YgYFJlZk9iamVjdGAgYW5kIGBzdHJpbmdgXG4gICAgICAgICAgICAvLyBwcm9wcGVyLnJlZiByZXR1cm5zIGBSZWZPYmplY3RgXG4gICAgICAgICAgICByZWY9e3BvcHBlci5yZWYgYXMgTGVnYWN5UmVmPEhUTUxEaXZFbGVtZW50Pn1cbiAgICAgICAgICAgIGNzcz17e1xuICAgICAgICAgICAgICAuLi5wb3BwZXIuc3R5bGVzLFxuICAgICAgICAgICAgICAuLi5nZXRCb2R5U3R5bGVzKHtcbiAgICAgICAgICAgICAgICBjb25zdHJhaW50OiBwcm9wcy5ob3Jpem9udGFsQ29uc3RyYWludCxcbiAgICAgICAgICAgICAgICBwbGFjZW1lbnQ6IHBvcHBlci5wbGFjZW1lbnQsXG4gICAgICAgICAgICAgICAgY3VzdG9tU3R5bGVzOiBwcm9wcy5zdHlsZXM/LmJvZHksXG4gICAgICAgICAgICAgIH0pLFxuICAgICAgICAgICAgfX1cbiAgICAgICAgICAgIGRhdGEtcGxhY2VtZW50PXtwb3BwZXIucGxhY2VtZW50fVxuICAgICAgICAgID5cbiAgICAgICAgICAgIDxCb2R5Q29tcG9uZW50Pntwcm9wcy50aXRsZX08L0JvZHlDb21wb25lbnQ+XG4gICAgICAgICAgPC9kaXY+XG4gICAgICAgIDwvVG9vbHRpcFdyYXBwZXJDb21wb25lbnQ+XG4gICAgICApfVxuICAgIDwvPlxuICApO1xufTtcblxuVG9vbHRpcC5kaXNwbGF5TmFtZSA9ICdUb29sVGlwJztcblRvb2x0aXAuZGVmYXVsdFByb3BzID0gdG9vbHRpcERlZmF1bHRQcm9wcztcblxuZXhwb3J0IGRlZmF1bHQgVG9vbHRpcDtcbiJdfQ== */"),
|
|
273
|
+
"data-placement": popper.placement,
|
|
274
|
+
children: jsx(BodyComponent, {
|
|
275
|
+
children: props.title
|
|
276
|
+
})
|
|
277
|
+
})
|
|
278
|
+
})]
|
|
279
|
+
});
|
|
268
280
|
};
|
|
269
281
|
|
|
270
282
|
Tooltip.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
@@ -290,7 +302,7 @@ Tooltip.displayName = 'ToolTip';
|
|
|
290
302
|
Tooltip.defaultProps = tooltipDefaultProps;
|
|
291
303
|
var Tooltip$1 = Tooltip;
|
|
292
304
|
|
|
293
|
-
// NOTE: This string will be replaced
|
|
294
|
-
var version =
|
|
305
|
+
// NOTE: This string will be replaced on build time with the package version.
|
|
306
|
+
var version = "12.2.9";
|
|
295
307
|
|
|
296
308
|
export { Tooltip$1 as default, version };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import type { TTooltipProps as TooltipProps } from './tooltip';
|
|
2
|
-
export declare type TTooltipProps = TooltipProps;
|
|
1
|
+
import type { TTooltipProps as TooltipProps } from './tooltip';
|
|
2
|
+
export declare type TTooltipProps = TooltipProps;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export { default } from './tooltip';
|
|
2
|
-
export { default as version } from './version';
|
|
3
|
-
export * from './export-types';
|
|
1
|
+
export { default } from './tooltip';
|
|
2
|
+
export { default as version } from './version';
|
|
3
|
+
export * from './export-types';
|
|
@@ -1,28 +1,28 @@
|
|
|
1
|
-
import { Modifiers } from 'popper.js';
|
|
2
|
-
import
|
|
3
|
-
declare type TComponents = {
|
|
4
|
-
BodyComponent?: ComponentType;
|
|
5
|
-
TooltipWrapperComponent?: ComponentType;
|
|
6
|
-
WrapperComponent?: ComponentType;
|
|
7
|
-
};
|
|
8
|
-
export declare type TTooltipProps = {
|
|
9
|
-
children:
|
|
10
|
-
closeAfter: number;
|
|
11
|
-
styles?: Record<string, CSSProperties>;
|
|
12
|
-
off: boolean;
|
|
13
|
-
id?: string;
|
|
14
|
-
onClose?: (e?: ChangeEvent | FocusEvent) => void;
|
|
15
|
-
onOpen?: (e?: ChangeEvent | FocusEvent) => void;
|
|
16
|
-
isOpen?: boolean;
|
|
17
|
-
placement?: 'top' | 'top-start' | 'top-end' | 'right' | 'right-start' | 'right-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end';
|
|
18
|
-
title: string;
|
|
19
|
-
modifiers?: Modifiers;
|
|
20
|
-
components?: TComponents;
|
|
21
|
-
horizontalConstraint?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 'scale' | 'auto';
|
|
22
|
-
};
|
|
23
|
-
declare const Tooltip: {
|
|
24
|
-
(props: TTooltipProps): JSX.Element;
|
|
25
|
-
displayName: string;
|
|
26
|
-
defaultProps: Pick<TTooltipProps, "off" | "horizontalConstraint" | "closeAfter" | "placement">;
|
|
27
|
-
};
|
|
28
|
-
export default Tooltip;
|
|
1
|
+
import { Modifiers } from 'popper.js';
|
|
2
|
+
import { ComponentType, FocusEvent, ChangeEvent, CSSProperties, ReactElement } from 'react';
|
|
3
|
+
declare type TComponents = {
|
|
4
|
+
BodyComponent?: ComponentType;
|
|
5
|
+
TooltipWrapperComponent?: ComponentType;
|
|
6
|
+
WrapperComponent?: ComponentType;
|
|
7
|
+
};
|
|
8
|
+
export declare type TTooltipProps = {
|
|
9
|
+
children: ReactElement;
|
|
10
|
+
closeAfter: number;
|
|
11
|
+
styles?: Record<string, CSSProperties>;
|
|
12
|
+
off: boolean;
|
|
13
|
+
id?: string;
|
|
14
|
+
onClose?: (e?: ChangeEvent | FocusEvent) => void;
|
|
15
|
+
onOpen?: (e?: ChangeEvent | FocusEvent) => void;
|
|
16
|
+
isOpen?: boolean;
|
|
17
|
+
placement?: 'top' | 'top-start' | 'top-end' | 'right' | 'right-start' | 'right-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end';
|
|
18
|
+
title: string;
|
|
19
|
+
modifiers?: Modifiers;
|
|
20
|
+
components?: TComponents;
|
|
21
|
+
horizontalConstraint?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 'scale' | 'auto';
|
|
22
|
+
};
|
|
23
|
+
declare const Tooltip: {
|
|
24
|
+
(props: TTooltipProps): import("@emotion/react/jsx-runtime").JSX.Element;
|
|
25
|
+
displayName: string;
|
|
26
|
+
defaultProps: Pick<TTooltipProps, "off" | "horizontalConstraint" | "closeAfter" | "placement">;
|
|
27
|
+
};
|
|
28
|
+
export default Tooltip;
|
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import { CSSProperties } from 'react';
|
|
2
|
-
import type { TTooltipProps } from './tooltip';
|
|
3
|
-
export declare const Body: import("@emotion/styled").StyledComponent<{
|
|
4
|
-
theme?: import("@emotion/react").Theme | undefined;
|
|
5
|
-
as?: import("react").ElementType<any> | undefined;
|
|
6
|
-
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
7
|
-
export declare const getBodyStyles: ({ constraint, placement, customStyles, }: {
|
|
8
|
-
constraint: TTooltipProps['horizontalConstraint'];
|
|
9
|
-
placement: string;
|
|
10
|
-
customStyles?: CSSProperties | undefined;
|
|
11
|
-
}) => CSSProperties;
|
|
12
|
-
export declare const Wrapper: import("@emotion/styled").StyledComponent<{
|
|
13
|
-
theme?: import("@emotion/react").Theme | undefined;
|
|
14
|
-
as?: import("react").ElementType<any> | undefined;
|
|
15
|
-
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
1
|
+
import { CSSProperties } from 'react';
|
|
2
|
+
import type { TTooltipProps } from './tooltip';
|
|
3
|
+
export declare const Body: import("@emotion/styled").StyledComponent<{
|
|
4
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
5
|
+
as?: import("react").ElementType<any> | undefined;
|
|
6
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
7
|
+
export declare const getBodyStyles: ({ constraint, placement, customStyles, }: {
|
|
8
|
+
constraint: TTooltipProps['horizontalConstraint'];
|
|
9
|
+
placement: string;
|
|
10
|
+
customStyles?: CSSProperties | undefined;
|
|
11
|
+
}) => CSSProperties;
|
|
12
|
+
export declare const Wrapper: import("@emotion/styled").StyledComponent<{
|
|
13
|
+
theme?: import("@emotion/react").Theme | undefined;
|
|
14
|
+
as?: import("react").ElementType<any> | undefined;
|
|
15
|
+
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
declare const _default: "
|
|
2
|
-
export default _default;
|
|
1
|
+
declare const _default: "__@UI_KIT_PACKAGE/VERSION_OF_RELEASE__";
|
|
2
|
+
export default _default;
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@commercetools-uikit/tooltip",
|
|
3
3
|
"description": "Tooltips display informative text when users hover over or focus on an element.",
|
|
4
|
-
"version": "12.2.
|
|
4
|
+
"version": "12.2.9",
|
|
5
5
|
"bugs": "https://github.com/commercetools/ui-kit/issues",
|
|
6
6
|
"repository": {
|
|
7
7
|
"type": "git",
|
|
@@ -11,7 +11,6 @@
|
|
|
11
11
|
"homepage": "https://uikit.commercetools.com",
|
|
12
12
|
"keywords": ["javascript", "design system", "react", "uikit"],
|
|
13
13
|
"license": "MIT",
|
|
14
|
-
"private": false,
|
|
15
14
|
"publishConfig": {
|
|
16
15
|
"access": "public"
|
|
17
16
|
},
|
|
@@ -19,16 +18,13 @@
|
|
|
19
18
|
"main": "dist/commercetools-uikit-tooltip.cjs.js",
|
|
20
19
|
"module": "dist/commercetools-uikit-tooltip.esm.js",
|
|
21
20
|
"files": ["dist"],
|
|
22
|
-
"scripts": {
|
|
23
|
-
"prepare": "../../../scripts/version.js replace"
|
|
24
|
-
},
|
|
25
21
|
"dependencies": {
|
|
26
|
-
"@babel/runtime": "7.
|
|
27
|
-
"@babel/runtime-corejs3": "7.
|
|
28
|
-
"@commercetools-uikit/constraints": "12.2.
|
|
29
|
-
"@commercetools-uikit/design-system": "12.2.
|
|
30
|
-
"@commercetools-uikit/hooks": "12.2.
|
|
31
|
-
"@commercetools-uikit/utils": "12.2.
|
|
22
|
+
"@babel/runtime": "7.16.5",
|
|
23
|
+
"@babel/runtime-corejs3": "7.16.5",
|
|
24
|
+
"@commercetools-uikit/constraints": "12.2.9",
|
|
25
|
+
"@commercetools-uikit/design-system": "12.2.9",
|
|
26
|
+
"@commercetools-uikit/hooks": "12.2.9",
|
|
27
|
+
"@commercetools-uikit/utils": "12.2.9",
|
|
32
28
|
"@emotion/react": "^11.4.0",
|
|
33
29
|
"@emotion/styled": "^11.3.0",
|
|
34
30
|
"lodash": "4.17.21",
|