@commercetools-uikit/tooltip 19.11.0 → 19.12.0

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.
Files changed (4) hide show
  1. package/dist/commercetools-uikit-tooltip.cjs.dev.js +34 -23
  2. package/dist/commercetools-uikit-tooltip.cjs.prod.js +31 -20
  3. package/dist/commercetools-uikit-tooltip.esm.js +34 -23
  4. package/package.json +5 -5
package/dist/commercetools-uikit-tooltip.cjs.dev.js CHANGED
@@ -21,7 +21,6 @@ var usePopper = require('use-popper');
21
21
  var react = require('@emotion/react');
22
22
  var hooks = require('@commercetools-uikit/hooks');
23
23
  var utils = require('@commercetools-uikit/utils');
24
- var _taggedTemplateLiteral = require('@babel/runtime-corejs3/helpers/taggedTemplateLiteral');
25
24
  var _styled = require('@emotion/styled/base');
26
25
  var designSystem = require('@commercetools-uikit/design-system');
27
26
  var jsxRuntime = require('@emotion/react/jsx-runtime');
@@ -42,21 +41,34 @@ 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
- var _templateObject, _templateObject2;
46
44
  function ownKeys$1(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
47
45
  function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$1(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$1(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
48
46
  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)."; }
49
- const growIn = react.keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n from {\n transform: scale(0);\n }\n to {\n transform: scale(1);\n }\n"])));
50
- const growOut = react.keyframes(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n from {\n transform: scale(1);\n }\n to {\n transform: scale(0);\n }\n"])));
47
+ const growIn = react.keyframes`
48
+ from {
49
+ transform: scale(0);
50
+ }
51
+ to {
52
+ transform: scale(1);
53
+ }
54
+ `;
55
+ const growOut = react.keyframes`
56
+ from {
57
+ transform: scale(1);
58
+ }
59
+ to {
60
+ transform: scale(0);
61
+ }
62
+ `;
51
63
  const getAnimation = state => {
52
64
  switch (state) {
53
65
  case 'opened':
54
66
  return {
55
- animation: "".concat(growIn, " 80ms")
67
+ animation: `${growIn} 80ms`
56
68
  };
57
69
  case 'exiting':
58
70
  return {
59
- animation: "".concat(growOut, " 80ms")
71
+ animation: `${growOut} 80ms`
60
72
  };
61
73
  default:
62
74
  return {};
@@ -68,10 +80,10 @@ const getOffsetMargin = _ref => {
68
80
  switch (position) {
69
81
  case 'left':
70
82
  case 'right':
71
- return "0 ".concat(designSystem.designTokens.spacing10);
83
+ return `0 ${designSystem.designTokens.spacing10}`;
72
84
  case 'top':
73
85
  case 'bottom':
74
- return "".concat(designSystem.designTokens.spacing10, " 0");
86
+ return `${designSystem.designTokens.spacing10} 0`;
75
87
  default:
76
88
  return '';
77
89
  }
@@ -90,12 +102,12 @@ const getBodyStyles = _ref2 => {
90
102
  let constraint = _ref2.constraint,
91
103
  placement = _ref2.placement,
92
104
  customStyles = _ref2.customStyles;
93
- const constraintTokenName = "constraint".concat(constraint);
105
+ const constraintTokenName = `constraint${constraint}`;
94
106
  return _objectSpread$1({
95
107
  fontFamily: 'inherit',
96
- margin: "".concat(getOffsetMargin({
108
+ margin: `${getOffsetMargin({
97
109
  placement
98
- }), " !important"),
110
+ })} !important`,
99
111
  maxWidth: constraintTokenName in designSystem.designTokens ? designSystem.designTokens[constraintTokenName] : 'auto',
100
112
  // so hovering over the tooltip when the tooltip overlaps the component
101
113
  pointerEvents: 'none',
@@ -134,17 +146,16 @@ const tooltipDefaultProps = {
134
146
  placement: 'top'
135
147
  };
136
148
  const Tooltip = props => {
137
- var _props$components, _props$components2, _props$components3, _props$components4, _props$components5, _props$components6, _props$styles;
138
149
  const enterTimer = react$1.useRef();
139
150
  const leaveTimer = react$1.useRef();
140
- if ((_props$components = props.components) !== null && _props$components !== void 0 && _props$components.BodyComponent) {
141
- 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;
151
+ if (props.components?.BodyComponent) {
152
+ 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;
142
153
  }
143
- if ((_props$components2 = props.components) !== null && _props$components2 !== void 0 && _props$components2.TooltipWrapperComponent) {
144
- process.env.NODE_ENV !== "production" ? utils.warning(reactIs.isValidElementType(props.components.TooltipWrapperComponent), "ui-kit/Tooltip: the prop 'components.TooltipWrapperComponent' is not a valid React element.") : void 0;
154
+ if (props.components?.TooltipWrapperComponent) {
155
+ process.env.NODE_ENV !== "production" ? utils.warning(reactIs.isValidElementType(props.components.TooltipWrapperComponent), `ui-kit/Tooltip: the prop 'components.TooltipWrapperComponent' is not a valid React element.`) : void 0;
145
156
  }
146
- if ((_props$components3 = props.components) !== null && _props$components3 !== void 0 && _props$components3.WrapperComponent) {
147
- 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;
157
+ if (props.components?.WrapperComponent) {
158
+ 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;
148
159
  }
149
160
  react$1.useEffect(() => {
150
161
  return () => {
@@ -220,7 +231,7 @@ const Tooltip = props => {
220
231
  }
221
232
  if (closeAfter && state === 'opened') {
222
233
  leaveTimer.current = _setTimeout__default["default"](() => {
223
- const tooltipElement = popperInstance === null || popperInstance === void 0 ? void 0 : popperInstance.popper.querySelector('[data-testid="tooltip-message-wrapper"]');
234
+ const tooltipElement = popperInstance?.popper.querySelector('[data-testid="tooltip-message-wrapper"]');
224
235
  if (tooltipElement) {
225
236
  tooltipElement.addEventListener('animationend', () => handleClose());
226
237
  } else {
@@ -264,9 +275,9 @@ const Tooltip = props => {
264
275
  onFocus: handleEnter,
265
276
  onBlur: handleLeave
266
277
  } : {};
267
- const WrapperComponent = ((_props$components4 = props.components) === null || _props$components4 === void 0 ? void 0 : _props$components4.WrapperComponent) || Wrapper;
268
- const BodyComponent = ((_props$components5 = props.components) === null || _props$components5 === void 0 ? void 0 : _props$components5.BodyComponent) || Body;
269
- const TooltipWrapperComponent = ((_props$components6 = props.components) === null || _props$components6 === void 0 ? void 0 : _props$components6.TooltipWrapperComponent) || TooltipWrapper;
278
+ const WrapperComponent = props.components?.WrapperComponent || Wrapper;
279
+ const BodyComponent = props.components?.BodyComponent || Body;
280
+ const TooltipWrapperComponent = props.components?.TooltipWrapperComponent || TooltipWrapper;
270
281
  return jsxRuntime.jsxs(jsxRuntime.Fragment, {
271
282
  children: [jsxRuntime.jsx(WrapperComponent, _objectSpread(_objectSpread({}, eventListeners), {}, {
272
283
  // @ts-expect-error: yes, ref can be undefined
@@ -280,7 +291,7 @@ const Tooltip = props => {
280
291
  css: /*#__PURE__*/react.css(_objectSpread(_objectSpread({}, popper.styles), getBodyStyles({
281
292
  constraint: props.horizontalConstraint,
282
293
  placement: popper.placement,
283
- customStyles: (_props$styles = props.styles) === null || _props$styles === void 0 ? void 0 : _props$styles.body
294
+ customStyles: props.styles?.body
284
295
  })), process.env.NODE_ENV === "production" ? "" : ";label:Tooltip;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRvb2x0aXAudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXdWaUIiLCJmaWxlIjoidG9vbHRpcC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvLyBpbnNwaXJlZCBmcm9tIGh0dHBzOi8vZ2l0aHViLmNvbS9tdWktb3JnL21hdGVyaWFsLXVpL2Jsb2IvOWVjYzhkYjhhYmJmYjgyOTExMWQzYjVjMDY3ODI2NzgyNzk4NDAyNC9wYWNrYWdlcy9tYXRlcmlhbC11aS9zcmMvVG9vbHRpcC9Ub29sdGlwLmpzXG5pbXBvcnQgeyBNb2RpZmllcnMgfSBmcm9tICdwb3BwZXIuanMnO1xuaW1wb3J0IHtcbiAgQ29tcG9uZW50VHlwZSxcbiAgRm9jdXNFdmVudCxcbiAgQ2hhbmdlRXZlbnQsXG4gIExlZ2FjeVJlZixcbiAgQ1NTUHJvcGVydGllcyxcbiAgUmVhY3RFbGVtZW50LFxuICB1c2VSZWYsXG4gIHVzZUVmZmVjdCxcbiAgdXNlQ2FsbGJhY2ssXG4gIGNsb25lRWxlbWVudCxcbiAgdXNlU3RhdGUsXG59IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IGlzVmFsaWRFbGVtZW50VHlwZSB9IGZyb20gJ3JlYWN0LWlzJztcbmltcG9ydCBpc05pbCBmcm9tICdsb2Rhc2gvaXNOaWwnO1xuaW1wb3J0IHVzZVBvcHBlciBmcm9tICd1c2UtcG9wcGVyJztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCB7IHVzZUZpZWxkSWQgfSBmcm9tICdAY29tbWVyY2V0b29scy11aWtpdC9ob29rcyc7XG5pbXBvcnQgeyBjcmVhdGVTZXF1ZW50aWFsSWQsIHdhcm5pbmcgfSBmcm9tICdAY29tbWVyY2V0b29scy11aWtpdC91dGlscyc7XG5pbXBvcnQge1xuICBXcmFwcGVyLFxuICBCb2R5LFxuICBnZXRCb2R5U3R5bGVzLFxuICBnZXRUb29sdGlwU3R5bGVzLFxufSBmcm9tICcuL3Rvb2x0aXAuc3R5bGVzJztcblxuY29uc3Qgc2VxdWVudGlhbElkID0gY3JlYXRlU2VxdWVudGlhbElkKCd0b29sdGlwLScpO1xuXG5leHBvcnQgdHlwZSBUQ29tcG9uZW50cyA9IHtcbiAgLyoqXG4gICAqIFRoZSBjb21wb25lbnQgcmVuZGVyZWQgYXMgdGhlIHRvb2x0aXAgYm9keS5cbiAgICovXG4gIEJvZHlDb21wb25lbnQ/OiBDb21wb25lbnRUeXBlO1xuICAvKipcbiAgICogV2hlcmUgdGhlIHRvb2x0aXAgc2hvdWxkIGJlIHJlbmRlcmVkLiBUaGlzIGNhbiBiZSB1c2VmdWwgdG8gcmVuZGVyIHRoZSB0b29sdGlwIGludG8gYW5vdGhlciBwYXJ0IG9mIHRoZSBkb2N1bWVudCwgdXNpbmcgUmVhY3QgcG9ydGFsLlxuICAgKi9cbiAgVG9vbHRpcFdyYXBwZXJDb21wb25lbnQ/OiBDb21wb25lbnRUeXBlO1xuICAvKipcbiAgICogQSBjdXN0b20gY29tcG9uZW50IHdyYXBwZXIgZm9yIHRoZSB0b29sdGlwLlxuICAgKi9cbiAgV3JhcHBlckNvbXBvbmVudD86IENvbXBvbmVudFR5cGU7XG59O1xuXG5leHBvcnQgdHlwZSBUVG9vbHRpcFByb3BzID0ge1xuICBjaGlsZHJlbjogUmVhY3RFbGVtZW50O1xuXG4gIC8qKlxuICAgKiBEZWxheSAoaW4gbWlsbGlzZWNvbmRzKSBiZXR3ZWVuIHRoZSBzdGFydCBvZiB0aGUgdXNlciBpbnRlcmFjdGlvbiwgYW5kIHNob3dpbmcgdGhlIHRvb2x0aXAuXG4gICAqL1xuICBzaG93QWZ0ZXI/OiBudW1iZXI7XG4gIC8qKlxuICAgKiBEZWxheSAoaW4gbWlsbGlzZWNvbmRzKSBiZXR3ZWVuIHRoZSBlbmQgb2YgdGhlIHVzZXIgaW50ZXJhY3Rpb24sIGFuZCB0aGUgY2xvc2luZyBvZiB0aGUgdG9vbHRpcC5cbiAgICovXG4gIGNsb3NlQWZ0ZXI/OiBudW1iZXI7XG4gIC8qKlxuICAgKiBDdXN0b20gY3NzLWluLWpzIG9iamVjdCBzdHlsZXMgZm9yIHRoZSB0b29sdGlwIGJvZHkuXG4gICAqL1xuICBzdHlsZXM/OiBSZWNvcmQ8c3RyaW5nLCBDU1NQcm9wZXJ0aWVzPjtcbiAgLyoqXG4gICAqIERldGVybWluZXMgaWYgdGhlIHRvb2x0aXAgc2hvdWxkIG5vdCBhcHBlYXIuXG4gICAqL1xuICBvZmY6IGJvb2xlYW47XG4gIC8qKlxuICAgKiBBbiBpZGVudGlmaWVyIGZvciB0aGUgdG9vbHRpcCwgdXNlZCBmb3IgYGFyaWEtZGVzY3JpYmVkYnlgLlxuICAgKi9cbiAgaWQ/OiBzdHJpbmc7XG4gIC8qKlxuICAgKiBBIGNhbGxiYWNrIGZ1bmN0aW9uLCBjYWxsZWQgd2hlbiB0aGUgdG9vbHRpcCBpcyBjbG9zaW5nLlxuICAgKi9cbiAgb25DbG9zZT86IChlPzogQ2hhbmdlRXZlbnQgfCBGb2N1c0V2ZW50KSA9PiB2b2lkO1xuICAvKipcbiAgICogQSBjYWxsYmFjayBmdW5jdGlvbiwgY2FsbGVkIHdoZW4gdGhlIHRvb2x0aXAgaXMgb3BlbmluZy5cbiAgICovXG4gIG9uT3Blbj86IChlPzogQ2hhbmdlRXZlbnQgfCBGb2N1c0V2ZW50KSA9PiB2b2lkO1xuICBpc09wZW4/OiBib29sZWFuO1xuICAvKipcbiAgICogSG93IHRoZSB0b29sdGlwIGlzIHBvc2l0aW9uZWQgcmVsYXRpdmUgdG8gdGhlIGNoaWxkIGVsZW1lbnQuXG4gICAqL1xuICBwbGFjZW1lbnQ/OlxuICAgIHwgJ3RvcCdcbiAgICB8ICd0b3Atc3RhcnQnXG4gICAgfCAndG9wLWVuZCdcbiAgICB8ICdyaWdodCdcbiAgICB8ICdyaWdodC1zdGFydCdcbiAgICB8ICdyaWdodC1lbmQnXG4gICAgfCAnYm90dG9tJ1xuICAgIHwgJ2JvdHRvbS1zdGFydCdcbiAgICB8ICdib3R0b20tZW5kJ1xuICAgIHwgJ2xlZnQnXG4gICAgfCAnbGVmdC1zdGFydCdcbiAgICB8ICdsZWZ0LWVuZCc7XG4gIC8qKlxuICAgKiBUaGUgbWVzc2FnZSB0byBzaG93IGluIHRoZSB0b29sdGlwLlxuICAgKi9cbiAgdGl0bGU6IHN0cmluZztcbiAgLyoqXG4gICAqIFByb3ZpZGVzIGEgd2F5IHRvIGZpbmUtdHVuZSBhbiBhcHBlYXJhbmNlIG9mIHVuZGVybHlpbmcgUG9wcGVyIHRvb2x0aXAgZWxlbWVudC4gRm9yIG1vcmUgaW5mb3JtYXRpb24sIHBsZWFzZSBjaGVjayBbUG9wcGVyLmpzIGRvY3VtZW50YXRpb25dKGh0dHBzOi8vcG9wcGVyLmpzLm9yZy9wb3BwZXItZG9jdW1lbnRhdGlvbi5odG1sI21vZGlmaWVycykuXG4gICAqL1xuICBtb2RpZmllcnM/OiBNb2RpZmllcnM7XG4gIC8qKlxuICAgKiBDdXN0b21pemUgdGhlIGFwcGVhcmFuY2Ugb2YgY2VydGFpbiBlbGVtZW50cyBvZiB0aGUgdG9vbHRpcC5cbiAgICovXG4gIGNvbXBvbmVudHM/OiBUQ29tcG9uZW50cztcbiAgLyoqXG4gICAqIEhvcml6b250YWwgc2l6ZSBsaW1pdCBvZiB0aGUgdG9vbHRpcC5cbiAgICovXG4gIGhvcml6b250YWxDb25zdHJhaW50PzpcbiAgICB8IDFcbiAgICB8IDJcbiAgICB8IDNcbiAgICB8IDRcbiAgICB8IDVcbiAgICB8IDZcbiAgICB8IDdcbiAgICB8IDhcbiAgICB8IDlcbiAgICB8IDEwXG4gICAgfCAxMVxuICAgIHwgMTJcbiAgICB8IDEzXG4gICAgfCAxNFxuICAgIHwgMTVcbiAgICB8IDE2XG4gICAgfCAnc2NhbGUnXG4gICAgfCAnYXV0byc7XG59O1xuXG5leHBvcnQgdHlwZSBUVG9vbHRpcFN0YXRlID0gJ2Nsb3NlZCcgfCAnZW50ZXJpbmcnIHwgJ29wZW5lZCcgfCAnZXhpdGluZyc7XG5cbmNvbnN0IFRvb2x0aXBXcmFwcGVyID0gKHByb3BzOiBQaWNrPFRUb29sdGlwUHJvcHMsICdjaGlsZHJlbic+KSA9PiAoXG4gIDw+e3Byb3BzLmNoaWxkcmVufTwvPlxuKTtcblRvb2x0aXBXcmFwcGVyLmRpc3BsYXlOYW1lID0gJ1Rvb2x0aXBXcmFwcGVyQ29tcG9uZW50JztcblxuY29uc3QgdG9vbHRpcERlZmF1bHRQcm9wczogUGljazxcbiAgVFRvb2x0aXBQcm9wcyxcbiAgJ3Nob3dBZnRlcicgfCAnY2xvc2VBZnRlcicgfCAnaG9yaXpvbnRhbENvbnN0cmFpbnQnIHwgJ29mZicgfCAncGxhY2VtZW50J1xuPiA9IHtcbiAgc2hvd0FmdGVyOiAzMDAsXG4gIGNsb3NlQWZ0ZXI6IDIwMCxcbiAgaG9yaXpvbnRhbENvbnN0cmFpbnQ6ICdzY2FsZScsXG4gIG9mZjogZmFsc2UsXG4gIHBsYWNlbWVudDogJ3RvcCcsXG59O1xuXG5jb25zdCBUb29sdGlwID0gKHByb3BzOiBUVG9vbHRpcFByb3BzKSA9PiB7XG4gIGNvbnN0IGVudGVyVGltZXIgPSB1c2VSZWY8UmV0dXJuVHlwZTx0eXBlb2Ygc2V0VGltZW91dD4+KCk7XG4gIGNvbnN0IGxlYXZlVGltZXIgPSB1c2VSZWY8UmV0dXJuVHlwZTx0eXBlb2Ygc2V0VGltZW91dD4+KCk7XG5cbiAgaWYgKHByb3BzLmNvbXBvbmVudHM/LkJvZHlDb21wb25lbnQpIHtcbiAgICB3YXJuaW5nKFxuICAgICAgaXNWYWxpZEVsZW1lbnRUeXBlKHByb3BzLmNvbXBvbmVudHMuQm9keUNvbXBvbmVudCksXG4gICAgICBgdWkta2l0L1Rvb2x0aXA6IHRoZSBwcm9wICdjb21wb25lbnRzLkJvZHlDb21wb25lbnQnIGlzIG5vdCBhIHZhbGlkIFJlYWN0IGVsZW1lbnQuYFxuICAgICk7XG4gIH1cbiAgaWYgKHByb3BzLmNvbXBvbmVudHM/LlRvb2x0aXBXcmFwcGVyQ29tcG9uZW50KSB7XG4gICAgd2FybmluZyhcbiAgICAgIGlzVmFsaWRFbGVtZW50VHlwZShwcm9wcy5jb21wb25lbnRzLlRvb2x0aXBXcmFwcGVyQ29tcG9uZW50KSxcbiAgICAgIGB1aS1raXQvVG9vbHRpcDogdGhlIHByb3AgJ2NvbXBvbmVudHMuVG9vbHRpcFdyYXBwZXJDb21wb25lbnQnIGlzIG5vdCBhIHZhbGlkIFJlYWN0IGVsZW1lbnQuYFxuICAgICk7XG4gIH1cbiAgaWYgKHByb3BzLmNvbXBvbmVudHM/LldyYXBwZXJDb21wb25lbnQpIHtcbiAgICB3YXJuaW5nKFxuICAgICAgaXNWYWxpZEVsZW1lbnRUeXBlKHByb3BzLmNvbXBvbmVudHMuV3JhcHBlckNvbXBvbmVudCksXG4gICAgICBgdWkta2l0L1Rvb2x0aXA6IHRoZSBwcm9wICdjb21wb25lbnRzLldyYXBwZXJDb21wb25lbnQnIGlzIG5vdCBhIHZhbGlkIFJlYWN0IGVsZW1lbnQuYFxuICAgICk7XG4gIH1cblxuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIHJldHVybiAoKSA9PiB7XG4gICAgICBpZiAoZW50ZXJUaW1lci5jdXJyZW50KSB7XG4gICAgICAgIGNsZWFyVGltZW91dChlbnRlclRpbWVyLmN1cnJlbnQpO1xuICAgICAgfVxuICAgICAgaWYgKGxlYXZlVGltZXIuY3VycmVudCkge1xuICAgICAgICBjbGVhclRpbWVvdXQobGVhdmVUaW1lci5jdXJyZW50KTtcbiAgICAgIH1cbiAgICB9O1xuICB9LCBbXSk7XG5cbiAgY29uc3QgeyByZWZlcmVuY2UsIHBvcHBlciwgcG9wcGVySW5zdGFuY2UgfSA9IHVzZVBvcHBlcih7XG4gICAgcGxhY2VtZW50OiBwcm9wcy5wbGFjZW1lbnQsXG4gICAgbW9kaWZpZXJzOiBwcm9wcy5tb2RpZmllcnMsXG4gIH0pO1xuICBjb25zdCBbc3RhdGUsIHNldFN0YXRlXSA9IHVzZVN0YXRlPFRUb29sdGlwU3RhdGU+KCdjbG9zZWQnKTtcblxuICBjb25zdCBpc0NvbnRyb2xsZWQgPSAhaXNOaWwocHJvcHMuaXNPcGVuKTtcbiAgY29uc3QgdG9vbHRpcElzT3BlbiA9IGlzQ29udHJvbGxlZFxuICAgID8gcHJvcHMuaXNPcGVuXG4gICAgOiBzdGF0ZSA9PT0gJ29wZW5lZCcgfHwgc3RhdGUgPT09ICdleGl0aW5nJztcbiAgY29uc3QgaWQgPSB1c2VGaWVsZElkKHByb3BzLmlkLCBzZXF1ZW50aWFsSWQpO1xuXG4gIGNvbnN0IHsgb25DbG9zZSB9ID0gcHJvcHM7XG4gIGNvbnN0IGhhbmRsZUNsb3NlID0gdXNlQ2FsbGJhY2soXG4gICAgKGV2ZW50PzogQ2hhbmdlRXZlbnQgfCBGb2N1c0V2ZW50KSA9PiB7XG4gICAgICBpZiAoIWlzQ29udHJvbGxlZCkge1xuICAgICAgICBzZXRTdGF0ZSgnY2xvc2VkJyk7XG4gICAgICB9XG4gICAgICBpZiAob25DbG9zZSkge1xuICAgICAgICBvbkNsb3NlKGV2ZW50KTtcbiAgICAgIH1cbiAgICB9LFxuICAgIFtpc0NvbnRyb2xsZWQsIG9uQ2xvc2VdXG4gICk7XG5cbiAgY29uc3QgeyBvbkZvY3VzLCBvbk1vdXNlT3ZlciB9ID0gcHJvcHMuY2hpbGRyZW4ucHJvcHM7XG4gIGNvbnN0IHsgc2hvd0FmdGVyLCBvbk9wZW4gfSA9IHByb3BzO1xuICBjb25zdCBoYW5kbGVFbnRlciA9IHVzZUNhbGxiYWNrKFxuICAgIChldmVudD86IENoYW5nZUV2ZW50IHwgRm9jdXNFdmVudCkgPT4ge1xuICAgICAgaWYgKGV2ZW50KSB7XG4gICAgICAgIGlmIChldmVudC50eXBlID09PSAnbW91c2VvdmVyJyAmJiBvbk1vdXNlT3Zlcikge1xuICAgICAgICAgIG9uTW91c2VPdmVyKGV2ZW50KTtcbiAgICAgICAgfVxuXG4gICAgICAgIGlmIChldmVudC50eXBlID09PSAnZm9jdXMnICYmIG9uRm9jdXMpIHtcbiAgICAgICAgICBvbkZvY3VzKGV2ZW50KTtcbiAgICAgICAgfVxuXG4gICAgICAgIGlmIChzdGF0ZSAhPT0gJ29wZW5lZCcgJiYgIWlzQ29udHJvbGxlZCkge1xuICAgICAgICAgIHNldFN0YXRlKCdlbnRlcmluZycpO1xuICAgICAgICAgIGVudGVyVGltZXIuY3VycmVudCA9IHNldFRpbWVvdXQoKCkgPT4ge1xuICAgICAgICAgICAgc2V0U3RhdGUoJ29wZW5lZCcpO1xuXG4gICAgICAgICAgICBpZiAob25PcGVuKSB7XG4gICAgICAgICAgICAgIG9uT3BlbihldmVudCk7XG4gICAgICAgICAgICB9XG4gICAgICAgICAgfSwgc2hvd0FmdGVyKTtcbiAgICAgICAgfVxuXG4gICAgICAgIGV2ZW50LnByZXZlbnREZWZhdWx0KCk7XG4gICAgICAgIGV2ZW50LnN0b3BQcm9wYWdhdGlvbigpO1xuICAgICAgfVxuICAgIH0sXG4gICAgW29uRm9jdXMsIG9uT3Blbiwgb25Nb3VzZU92ZXIsIGlzQ29udHJvbGxlZCwgc3RhdGUsIHNob3dBZnRlcl1cbiAgKTtcblxuICBjb25zdCB7IG9uQmx1ciwgb25Nb3VzZUxlYXZlIH0gPSBwcm9wcy5jaGlsZHJlbi5wcm9wcztcbiAgY29uc3QgeyBjbG9zZUFmdGVyIH0gPSBwcm9wcztcblxuICBjb25zdCBoYW5kbGVMZWF2ZSA9IHVzZUNhbGxiYWNrKFxuICAgIChldmVudCkgPT4ge1xuICAgICAgY2xlYXJUaW1lb3V0KGVudGVyVGltZXIuY3VycmVudCk7XG4gICAgICBjbGVhclRpbWVvdXQobGVhdmVUaW1lci5jdXJyZW50KTtcblxuICAgICAgaWYgKGV2ZW50LnR5cGUgPT09ICdtb3VzZWxlYXZlJyAmJiBvbk1vdXNlTGVhdmUpIHtcbiAgICAgICAgb25Nb3VzZUxlYXZlKGV2ZW50KTtcbiAgICAgIH1cblxuICAgICAgaWYgKGV2ZW50LnR5cGUgPT09ICdibHVyJyAmJiBvbkJsdXIpIHtcbiAgICAgICAgb25CbHVyKGV2ZW50KTtcbiAgICAgIH1cblxuICAgICAgaWYgKGNsb3NlQWZ0ZXIgJiYgc3RhdGUgPT09ICdvcGVuZWQnKSB7XG4gICAgICAgIGxlYXZlVGltZXIuY3VycmVudCA9IHNldFRpbWVvdXQoKCkgPT4ge1xuICAgICAgICAgIGNvbnN0IHRvb2x0aXBFbGVtZW50ID0gcG9wcGVySW5zdGFuY2U/LnBvcHBlci5xdWVyeVNlbGVjdG9yKFxuICAgICAgICAgICAgJ1tkYXRhLXRlc3RpZD1cInRvb2x0aXAtbWVzc2FnZS13cmFwcGVyXCJdJ1xuICAgICAgICAgICkgYXMgSFRNTEVsZW1lbnQ7XG5cbiAgICAgICAgICBpZiAodG9vbHRpcEVsZW1lbnQpIHtcbiAgICAgICAgICAgIHRvb2x0aXBFbGVtZW50LmFkZEV2ZW50TGlzdGVuZXIoJ2FuaW1hdGlvbmVuZCcsICgpID0+XG4gICAgICAgICAgICAgIGhhbmRsZUNsb3NlKClcbiAgICAgICAgICAgICk7XG4gICAgICAgICAgfSBlbHNlIHtcbiAgICAgICAgICAgIGhhbmRsZUNsb3NlKCk7XG4gICAgICAgICAgfVxuXG4gICAgICAgICAgc2V0U3RhdGUoJ2V4aXRpbmcnKTtcbiAgICAgICAgfSwgY2xvc2VBZnRlcik7XG4gICAgICB9IGVsc2Uge1xuICAgICAgICBoYW5kbGVDbG9zZShldmVudCk7XG4gICAgICB9XG4gICAgfSxcbiAgICBbY2xvc2VBZnRlciwgb25CbHVyLCBvbk1vdXNlTGVhdmUsIGhhbmRsZUNsb3NlLCBzdGF0ZSwgcG9wcGVySW5zdGFuY2VdXG4gICk7XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICAvLyBpZiB0b29sdGlwIHdhcyBvcGVuLCBhbmQgdGhlbiBjb21wb25lbnRcbiAgICAvLyB1cGRhdGVkIHRvIGJlIG9mZiwgd2Ugc2hvdWxkIGNsb3NlIHRoZSB0b29sdGlwXG4gICAgaWYgKHN0YXRlID09PSAnb3BlbmVkJyAmJiBwcm9wcy5vZmYpIHtcbiAgICAgIGlmIChjbG9zZUFmdGVyKSB7XG4gICAgICAgIGxlYXZlVGltZXIuY3VycmVudCA9IHNldFRpbWVvdXQoKCkgPT4ge1xuICAgICAgICAgIGhhbmRsZUNsb3NlKCk7XG4gICAgICAgIH0sIGNsb3NlQWZ0ZXIpO1xuICAgICAgfSBlbHNlIHtcbiAgICAgICAgaGFuZGxlQ2xvc2UoKTtcbiAgICAgIH1cbiAgICB9XG4gIH0sIFtwcm9wcy5vZmYsIGNsb3NlQWZ0ZXIsIGhhbmRsZUNsb3NlLCBzdGF0ZV0pO1xuXG4gIGNvbnN0IGNoaWxkcmVuUHJvcHMgPSB7XG4gICAgLy8gZG9uJ3QgcGFzcyBldmVudCBsaXN0ZW5lcnMgdG8gY2hpbGRyZW5cbiAgICBvbkZvY3VzOiBudWxsLFxuICAgIG9uTW91c2VPdmVyOiBudWxsLFxuICAgIG9uTW91c2VMZWF2ZTogbnVsbCxcbiAgICBvbkJsdXI6IG51bGwsXG4gIH07XG5cbiAgY29uc3QgdG9vbHRpcFByb3BzID0gIXByb3BzLm9mZlxuICAgID8ge1xuICAgICAgICAnYXJpYS1kZXNjcmliZWRieSc6IHRvb2x0aXBJc09wZW4gPyBpZCA6IG51bGwsXG4gICAgICAgIC8vIGZvciBzZW8gYW5kIGFjY2Vzc2liaWxpdHksIHdlIGFkZCB0aGUgdG9vbHRpcCdzIHRpdGxlXG4gICAgICAgIC8vIGFzIGEgbmF0aXZlIHRpdGxlIHdoZW4gdGhlIHRpdGxlIGlzIGhpZGRlblxuICAgICAgICB0aXRsZTpcbiAgICAgICAgICAhdG9vbHRpcElzT3BlbiAmJlxuICAgICAgICAgIHN0YXRlICE9PSAnZW50ZXJpbmcnICYmXG4gICAgICAgICAgdHlwZW9mIHByb3BzLnRpdGxlID09PSAnc3RyaW5nJ1xuICAgICAgICAgICAgPyBwcm9wcy50aXRsZVxuICAgICAgICAgICAgOiBudWxsLFxuICAgICAgfVxuICAgIDoge307XG5cbiAgY29uc3QgZXZlbnRMaXN0ZW5lcnMgPSAhcHJvcHMub2ZmXG4gICAgPyB7XG4gICAgICAgIG9uTW91c2VFbnRlcjogaGFuZGxlRW50ZXIsXG4gICAgICAgIG9uTW91c2VMZWF2ZTogaGFuZGxlTGVhdmUsXG4gICAgICAgIG9uRm9jdXM6IGhhbmRsZUVudGVyLFxuICAgICAgICBvbkJsdXI6IGhhbmRsZUxlYXZlLFxuICAgICAgfVxuICAgIDoge307XG5cbiAgY29uc3QgV3JhcHBlckNvbXBvbmVudCA9IHByb3BzLmNvbXBvbmVudHM/LldyYXBwZXJDb21wb25lbnQgfHwgV3JhcHBlcjtcbiAgY29uc3QgQm9keUNvbXBvbmVudCA9IHByb3BzLmNvbXBvbmVudHM/LkJvZHlDb21wb25lbnQgfHwgQm9keTtcbiAgY29uc3QgVG9vbHRpcFdyYXBwZXJDb21wb25lbnQgPVxuICAgIHByb3BzLmNvbXBvbmVudHM/LlRvb2x0aXBXcmFwcGVyQ29tcG9uZW50IHx8IFRvb2x0aXBXcmFwcGVyO1xuXG4gIHJldHVybiAoXG4gICAgPD5cbiAgICAgIDxXcmFwcGVyQ29tcG9uZW50XG4gICAgICAgIHsuLi5ldmVudExpc3RlbmVyc31cbiAgICAgICAgLy8gQHRzLWV4cGVjdC1lcnJvcjogeWVzLCByZWYgY2FuIGJlIHVuZGVmaW5lZFxuICAgICAgICByZWY9e3JlZmVyZW5jZS5yZWZ9XG4gICAgICA+XG4gICAgICAgIHtjbG9uZUVsZW1lbnQocHJvcHMuY2hpbGRyZW4sIHtcbiAgICAgICAgICAuLi5jaGlsZHJlblByb3BzLFxuICAgICAgICAgIC4uLnRvb2x0aXBQcm9wcyxcbiAgICAgICAgfSl9XG4gICAgICA8L1dyYXBwZXJDb21wb25lbnQ+XG4gICAgICB7dG9vbHRpcElzT3BlbiAmJiAoXG4gICAgICAgIDxUb29sdGlwV3JhcHBlckNvbXBvbmVudD5cbiAgICAgICAgICA8ZGl2XG4gICAgICAgICAgICAvLyByZWYgYWNjZXB0cyBgTGVnYWN5UmVmYCwgd2hpY2ggaXMgYSB1bmlvbiBvZiBgUmVmT2JqZWN0YCBhbmQgYHN0cmluZ2BcbiAgICAgICAgICAgIC8vIHByb3BwZXIucmVmIHJldHVybnMgYFJlZk9iamVjdGBcbiAgICAgICAgICAgIHJlZj17cG9wcGVyLnJlZiBhcyBMZWdhY3lSZWY8SFRNTERpdkVsZW1lbnQ+fVxuICAgICAgICAgICAgY3NzPXtjc3Moe1xuICAgICAgICAgICAgICAuLi5wb3BwZXIuc3R5bGVzLFxuICAgICAgICAgICAgICAuLi5nZXRCb2R5U3R5bGVzKHtcbiAgICAgICAgICAgICAgICBjb25zdHJhaW50OiBwcm9wcy5ob3Jpem9udGFsQ29uc3RyYWludCxcbiAgICAgICAgICAgICAgICBwbGFjZW1lbnQ6IHBvcHBlci5wbGFjZW1lbnQsXG4gICAgICAgICAgICAgICAgY3VzdG9tU3R5bGVzOiBwcm9wcy5zdHlsZXM/LmJvZHksXG4gICAgICAgICAgICAgIH0pLFxuICAgICAgICAgICAgfSl9XG4gICAgICAgICAgICBkYXRhLXBsYWNlbWVudD17cG9wcGVyLnBsYWNlbWVudH1cbiAgICAgICAgICA+XG4gICAgICAgICAgICA8ZGl2XG4gICAgICAgICAgICAgIGNzcz17Y3NzKHtcbiAgICAgICAgICAgICAgICAuLi5nZXRUb29sdGlwU3R5bGVzKHN0YXRlKSxcbiAgICAgICAgICAgICAgfSl9XG4gICAgICAgICAgICAgIGRhdGEtdGVzdGlkPVwidG9vbHRpcC1tZXNzYWdlLXdyYXBwZXJcIlxuICAgICAgICAgICAgPlxuICAgICAgICAgICAgICA8Qm9keUNvbXBvbmVudD57cHJvcHMudGl0bGV9PC9Cb2R5Q29tcG9uZW50PlxuICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgPC9kaXY+XG4gICAgICAgIDwvVG9vbHRpcFdyYXBwZXJDb21wb25lbnQ+XG4gICAgICApfVxuICAgIDwvPlxuICApO1xufTtcblxuVG9vbHRpcC5kaXNwbGF5TmFtZSA9ICdUb29sVGlwJztcblRvb2x0aXAuZGVmYXVsdFByb3BzID0gdG9vbHRpcERlZmF1bHRQcm9wcztcblxuZXhwb3J0IGRlZmF1bHQgVG9vbHRpcDtcbiJdfQ== */"),
285
296
  "data-placement": popper.placement,
286
297
  children: jsxRuntime.jsx("div", {
package/dist/commercetools-uikit-tooltip.cjs.prod.js CHANGED
@@ -21,7 +21,6 @@ var usePopper = require('use-popper');
21
21
  var react = require('@emotion/react');
22
22
  var hooks = require('@commercetools-uikit/hooks');
23
23
  var utils = require('@commercetools-uikit/utils');
24
- var _taggedTemplateLiteral = require('@babel/runtime-corejs3/helpers/taggedTemplateLiteral');
25
24
  var _styled = require('@emotion/styled/base');
26
25
  var designSystem = require('@commercetools-uikit/design-system');
27
26
  var jsxRuntime = require('@emotion/react/jsx-runtime');
@@ -41,20 +40,33 @@ 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
- var _templateObject, _templateObject2;
45
43
  function ownKeys$1(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
46
44
  function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$1(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$1(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
47
- const growIn = react.keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n from {\n transform: scale(0);\n }\n to {\n transform: scale(1);\n }\n"])));
48
- const growOut = react.keyframes(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n from {\n transform: scale(1);\n }\n to {\n transform: scale(0);\n }\n"])));
45
+ const growIn = react.keyframes`
46
+ from {
47
+ transform: scale(0);
48
+ }
49
+ to {
50
+ transform: scale(1);
51
+ }
52
+ `;
53
+ const growOut = react.keyframes`
54
+ from {
55
+ transform: scale(1);
56
+ }
57
+ to {
58
+ transform: scale(0);
59
+ }
60
+ `;
49
61
  const getAnimation = state => {
50
62
  switch (state) {
51
63
  case 'opened':
52
64
  return {
53
- animation: "".concat(growIn, " 80ms")
65
+ animation: `${growIn} 80ms`
54
66
  };
55
67
  case 'exiting':
56
68
  return {
57
- animation: "".concat(growOut, " 80ms")
69
+ animation: `${growOut} 80ms`
58
70
  };
59
71
  default:
60
72
  return {};
@@ -66,10 +78,10 @@ const getOffsetMargin = _ref => {
66
78
  switch (position) {
67
79
  case 'left':
68
80
  case 'right':
69
- return "0 ".concat(designSystem.designTokens.spacing10);
81
+ return `0 ${designSystem.designTokens.spacing10}`;
70
82
  case 'top':
71
83
  case 'bottom':
72
- return "".concat(designSystem.designTokens.spacing10, " 0");
84
+ return `${designSystem.designTokens.spacing10} 0`;
73
85
  default:
74
86
  return '';
75
87
  }
@@ -85,12 +97,12 @@ const getBodyStyles = _ref2 => {
85
97
  let constraint = _ref2.constraint,
86
98
  placement = _ref2.placement,
87
99
  customStyles = _ref2.customStyles;
88
- const constraintTokenName = "constraint".concat(constraint);
100
+ const constraintTokenName = `constraint${constraint}`;
89
101
  return _objectSpread$1({
90
102
  fontFamily: 'inherit',
91
- margin: "".concat(getOffsetMargin({
103
+ margin: `${getOffsetMargin({
92
104
  placement
93
- }), " !important"),
105
+ })} !important`,
94
106
  maxWidth: constraintTokenName in designSystem.designTokens ? designSystem.designTokens[constraintTokenName] : 'auto',
95
107
  // so hovering over the tooltip when the tooltip overlaps the component
96
108
  pointerEvents: 'none',
@@ -121,12 +133,11 @@ const tooltipDefaultProps = {
121
133
  placement: 'top'
122
134
  };
123
135
  const Tooltip = props => {
124
- var _props$components, _props$components2, _props$components3, _props$components4, _props$components5, _props$components6, _props$styles;
125
136
  const enterTimer = react$1.useRef();
126
137
  const leaveTimer = react$1.useRef();
127
- if ((_props$components = props.components) !== null && _props$components !== void 0 && _props$components.BodyComponent) ;
128
- if ((_props$components2 = props.components) !== null && _props$components2 !== void 0 && _props$components2.TooltipWrapperComponent) ;
129
- if ((_props$components3 = props.components) !== null && _props$components3 !== void 0 && _props$components3.WrapperComponent) ;
138
+ if (props.components?.BodyComponent) ;
139
+ if (props.components?.TooltipWrapperComponent) ;
140
+ if (props.components?.WrapperComponent) ;
130
141
  react$1.useEffect(() => {
131
142
  return () => {
132
143
  if (enterTimer.current) {
@@ -201,7 +212,7 @@ const Tooltip = props => {
201
212
  }
202
213
  if (closeAfter && state === 'opened') {
203
214
  leaveTimer.current = _setTimeout__default["default"](() => {
204
- const tooltipElement = popperInstance === null || popperInstance === void 0 ? void 0 : popperInstance.popper.querySelector('[data-testid="tooltip-message-wrapper"]');
215
+ const tooltipElement = popperInstance?.popper.querySelector('[data-testid="tooltip-message-wrapper"]');
205
216
  if (tooltipElement) {
206
217
  tooltipElement.addEventListener('animationend', () => handleClose());
207
218
  } else {
@@ -245,9 +256,9 @@ const Tooltip = props => {
245
256
  onFocus: handleEnter,
246
257
  onBlur: handleLeave
247
258
  } : {};
248
- const WrapperComponent = ((_props$components4 = props.components) === null || _props$components4 === void 0 ? void 0 : _props$components4.WrapperComponent) || Wrapper;
249
- const BodyComponent = ((_props$components5 = props.components) === null || _props$components5 === void 0 ? void 0 : _props$components5.BodyComponent) || Body;
250
- const TooltipWrapperComponent = ((_props$components6 = props.components) === null || _props$components6 === void 0 ? void 0 : _props$components6.TooltipWrapperComponent) || TooltipWrapper;
259
+ const WrapperComponent = props.components?.WrapperComponent || Wrapper;
260
+ const BodyComponent = props.components?.BodyComponent || Body;
261
+ const TooltipWrapperComponent = props.components?.TooltipWrapperComponent || TooltipWrapper;
251
262
  return jsxRuntime.jsxs(jsxRuntime.Fragment, {
252
263
  children: [jsxRuntime.jsx(WrapperComponent, _objectSpread(_objectSpread({}, eventListeners), {}, {
253
264
  // @ts-expect-error: yes, ref can be undefined
@@ -261,7 +272,7 @@ const Tooltip = props => {
261
272
  css: /*#__PURE__*/react.css(_objectSpread(_objectSpread({}, popper.styles), getBodyStyles({
262
273
  constraint: props.horizontalConstraint,
263
274
  placement: popper.placement,
264
- customStyles: (_props$styles = props.styles) === null || _props$styles === void 0 ? void 0 : _props$styles.body
275
+ customStyles: props.styles?.body
265
276
  })), "" , "" ),
266
277
  "data-placement": popper.placement,
267
278
  children: jsxRuntime.jsx("div", {
package/dist/commercetools-uikit-tooltip.esm.js CHANGED
@@ -17,26 +17,38 @@ import usePopper from 'use-popper';
17
17
  import { keyframes, css } from '@emotion/react';
18
18
  import { useFieldId } from '@commercetools-uikit/hooks';
19
19
  import { createSequentialId, warning } from '@commercetools-uikit/utils';
20
- import _taggedTemplateLiteral from '@babel/runtime-corejs3/helpers/esm/taggedTemplateLiteral';
21
20
  import _styled from '@emotion/styled/base';
22
21
  import { designTokens } from '@commercetools-uikit/design-system';
23
22
  import { jsxs, Fragment, jsx } from '@emotion/react/jsx-runtime';
24
23
 
25
- var _templateObject, _templateObject2;
26
24
  function ownKeys$1(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
27
25
  function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys$1(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys$1(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
28
26
  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)."; }
29
- const growIn = keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n from {\n transform: scale(0);\n }\n to {\n transform: scale(1);\n }\n"])));
30
- const growOut = keyframes(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n from {\n transform: scale(1);\n }\n to {\n transform: scale(0);\n }\n"])));
27
+ const growIn = keyframes`
28
+ from {
29
+ transform: scale(0);
30
+ }
31
+ to {
32
+ transform: scale(1);
33
+ }
34
+ `;
35
+ const growOut = keyframes`
36
+ from {
37
+ transform: scale(1);
38
+ }
39
+ to {
40
+ transform: scale(0);
41
+ }
42
+ `;
31
43
  const getAnimation = state => {
32
44
  switch (state) {
33
45
  case 'opened':
34
46
  return {
35
- animation: "".concat(growIn, " 80ms")
47
+ animation: `${growIn} 80ms`
36
48
  };
37
49
  case 'exiting':
38
50
  return {
39
- animation: "".concat(growOut, " 80ms")
51
+ animation: `${growOut} 80ms`
40
52
  };
41
53
  default:
42
54
  return {};
@@ -48,10 +60,10 @@ const getOffsetMargin = _ref => {
48
60
  switch (position) {
49
61
  case 'left':
50
62
  case 'right':
51
- return "0 ".concat(designTokens.spacing10);
63
+ return `0 ${designTokens.spacing10}`;
52
64
  case 'top':
53
65
  case 'bottom':
54
- return "".concat(designTokens.spacing10, " 0");
66
+ return `${designTokens.spacing10} 0`;
55
67
  default:
56
68
  return '';
57
69
  }
@@ -70,12 +82,12 @@ const getBodyStyles = _ref2 => {
70
82
  let constraint = _ref2.constraint,
71
83
  placement = _ref2.placement,
72
84
  customStyles = _ref2.customStyles;
73
- const constraintTokenName = "constraint".concat(constraint);
85
+ const constraintTokenName = `constraint${constraint}`;
74
86
  return _objectSpread$1({
75
87
  fontFamily: 'inherit',
76
- margin: "".concat(getOffsetMargin({
88
+ margin: `${getOffsetMargin({
77
89
  placement
78
- }), " !important"),
90
+ })} !important`,
79
91
  maxWidth: constraintTokenName in designTokens ? designTokens[constraintTokenName] : 'auto',
80
92
  // so hovering over the tooltip when the tooltip overlaps the component
81
93
  pointerEvents: 'none',
@@ -114,17 +126,16 @@ const tooltipDefaultProps = {
114
126
  placement: 'top'
115
127
  };
116
128
  const Tooltip = props => {
117
- var _props$components, _props$components2, _props$components3, _props$components4, _props$components5, _props$components6, _props$styles;
118
129
  const enterTimer = useRef();
119
130
  const leaveTimer = useRef();
120
- if ((_props$components = props.components) !== null && _props$components !== void 0 && _props$components.BodyComponent) {
121
- 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;
131
+ if (props.components?.BodyComponent) {
132
+ 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;
122
133
  }
123
- if ((_props$components2 = props.components) !== null && _props$components2 !== void 0 && _props$components2.TooltipWrapperComponent) {
124
- process.env.NODE_ENV !== "production" ? warning(isValidElementType(props.components.TooltipWrapperComponent), "ui-kit/Tooltip: the prop 'components.TooltipWrapperComponent' is not a valid React element.") : void 0;
134
+ if (props.components?.TooltipWrapperComponent) {
135
+ process.env.NODE_ENV !== "production" ? warning(isValidElementType(props.components.TooltipWrapperComponent), `ui-kit/Tooltip: the prop 'components.TooltipWrapperComponent' is not a valid React element.`) : void 0;
125
136
  }
126
- if ((_props$components3 = props.components) !== null && _props$components3 !== void 0 && _props$components3.WrapperComponent) {
127
- 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;
137
+ if (props.components?.WrapperComponent) {
138
+ 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;
128
139
  }
129
140
  useEffect(() => {
130
141
  return () => {
@@ -200,7 +211,7 @@ const Tooltip = props => {
200
211
  }
201
212
  if (closeAfter && state === 'opened') {
202
213
  leaveTimer.current = _setTimeout(() => {
203
- const tooltipElement = popperInstance === null || popperInstance === void 0 ? void 0 : popperInstance.popper.querySelector('[data-testid="tooltip-message-wrapper"]');
214
+ const tooltipElement = popperInstance?.popper.querySelector('[data-testid="tooltip-message-wrapper"]');
204
215
  if (tooltipElement) {
205
216
  tooltipElement.addEventListener('animationend', () => handleClose());
206
217
  } else {
@@ -244,9 +255,9 @@ const Tooltip = props => {
244
255
  onFocus: handleEnter,
245
256
  onBlur: handleLeave
246
257
  } : {};
247
- const WrapperComponent = ((_props$components4 = props.components) === null || _props$components4 === void 0 ? void 0 : _props$components4.WrapperComponent) || Wrapper;
248
- const BodyComponent = ((_props$components5 = props.components) === null || _props$components5 === void 0 ? void 0 : _props$components5.BodyComponent) || Body;
249
- const TooltipWrapperComponent = ((_props$components6 = props.components) === null || _props$components6 === void 0 ? void 0 : _props$components6.TooltipWrapperComponent) || TooltipWrapper;
258
+ const WrapperComponent = props.components?.WrapperComponent || Wrapper;
259
+ const BodyComponent = props.components?.BodyComponent || Body;
260
+ const TooltipWrapperComponent = props.components?.TooltipWrapperComponent || TooltipWrapper;
250
261
  return jsxs(Fragment, {
251
262
  children: [jsx(WrapperComponent, _objectSpread(_objectSpread({}, eventListeners), {}, {
252
263
  // @ts-expect-error: yes, ref can be undefined
@@ -260,7 +271,7 @@ const Tooltip = props => {
260
271
  css: /*#__PURE__*/css(_objectSpread(_objectSpread({}, popper.styles), getBodyStyles({
261
272
  constraint: props.horizontalConstraint,
262
273
  placement: popper.placement,
263
- customStyles: (_props$styles = props.styles) === null || _props$styles === void 0 ? void 0 : _props$styles.body
274
+ customStyles: props.styles?.body
264
275
  })), process.env.NODE_ENV === "production" ? "" : ";label:Tooltip;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInRvb2x0aXAudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXdWaUIiLCJmaWxlIjoidG9vbHRpcC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvLyBpbnNwaXJlZCBmcm9tIGh0dHBzOi8vZ2l0aHViLmNvbS9tdWktb3JnL21hdGVyaWFsLXVpL2Jsb2IvOWVjYzhkYjhhYmJmYjgyOTExMWQzYjVjMDY3ODI2NzgyNzk4NDAyNC9wYWNrYWdlcy9tYXRlcmlhbC11aS9zcmMvVG9vbHRpcC9Ub29sdGlwLmpzXG5pbXBvcnQgeyBNb2RpZmllcnMgfSBmcm9tICdwb3BwZXIuanMnO1xuaW1wb3J0IHtcbiAgQ29tcG9uZW50VHlwZSxcbiAgRm9jdXNFdmVudCxcbiAgQ2hhbmdlRXZlbnQsXG4gIExlZ2FjeVJlZixcbiAgQ1NTUHJvcGVydGllcyxcbiAgUmVhY3RFbGVtZW50LFxuICB1c2VSZWYsXG4gIHVzZUVmZmVjdCxcbiAgdXNlQ2FsbGJhY2ssXG4gIGNsb25lRWxlbWVudCxcbiAgdXNlU3RhdGUsXG59IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IGlzVmFsaWRFbGVtZW50VHlwZSB9IGZyb20gJ3JlYWN0LWlzJztcbmltcG9ydCBpc05pbCBmcm9tICdsb2Rhc2gvaXNOaWwnO1xuaW1wb3J0IHVzZVBvcHBlciBmcm9tICd1c2UtcG9wcGVyJztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCB7IHVzZUZpZWxkSWQgfSBmcm9tICdAY29tbWVyY2V0b29scy11aWtpdC9ob29rcyc7XG5pbXBvcnQgeyBjcmVhdGVTZXF1ZW50aWFsSWQsIHdhcm5pbmcgfSBmcm9tICdAY29tbWVyY2V0b29scy11aWtpdC91dGlscyc7XG5pbXBvcnQge1xuICBXcmFwcGVyLFxuICBCb2R5LFxuICBnZXRCb2R5U3R5bGVzLFxuICBnZXRUb29sdGlwU3R5bGVzLFxufSBmcm9tICcuL3Rvb2x0aXAuc3R5bGVzJztcblxuY29uc3Qgc2VxdWVudGlhbElkID0gY3JlYXRlU2VxdWVudGlhbElkKCd0b29sdGlwLScpO1xuXG5leHBvcnQgdHlwZSBUQ29tcG9uZW50cyA9IHtcbiAgLyoqXG4gICAqIFRoZSBjb21wb25lbnQgcmVuZGVyZWQgYXMgdGhlIHRvb2x0aXAgYm9keS5cbiAgICovXG4gIEJvZHlDb21wb25lbnQ/OiBDb21wb25lbnRUeXBlO1xuICAvKipcbiAgICogV2hlcmUgdGhlIHRvb2x0aXAgc2hvdWxkIGJlIHJlbmRlcmVkLiBUaGlzIGNhbiBiZSB1c2VmdWwgdG8gcmVuZGVyIHRoZSB0b29sdGlwIGludG8gYW5vdGhlciBwYXJ0IG9mIHRoZSBkb2N1bWVudCwgdXNpbmcgUmVhY3QgcG9ydGFsLlxuICAgKi9cbiAgVG9vbHRpcFdyYXBwZXJDb21wb25lbnQ/OiBDb21wb25lbnRUeXBlO1xuICAvKipcbiAgICogQSBjdXN0b20gY29tcG9uZW50IHdyYXBwZXIgZm9yIHRoZSB0b29sdGlwLlxuICAgKi9cbiAgV3JhcHBlckNvbXBvbmVudD86IENvbXBvbmVudFR5cGU7XG59O1xuXG5leHBvcnQgdHlwZSBUVG9vbHRpcFByb3BzID0ge1xuICBjaGlsZHJlbjogUmVhY3RFbGVtZW50O1xuXG4gIC8qKlxuICAgKiBEZWxheSAoaW4gbWlsbGlzZWNvbmRzKSBiZXR3ZWVuIHRoZSBzdGFydCBvZiB0aGUgdXNlciBpbnRlcmFjdGlvbiwgYW5kIHNob3dpbmcgdGhlIHRvb2x0aXAuXG4gICAqL1xuICBzaG93QWZ0ZXI/OiBudW1iZXI7XG4gIC8qKlxuICAgKiBEZWxheSAoaW4gbWlsbGlzZWNvbmRzKSBiZXR3ZWVuIHRoZSBlbmQgb2YgdGhlIHVzZXIgaW50ZXJhY3Rpb24sIGFuZCB0aGUgY2xvc2luZyBvZiB0aGUgdG9vbHRpcC5cbiAgICovXG4gIGNsb3NlQWZ0ZXI/OiBudW1iZXI7XG4gIC8qKlxuICAgKiBDdXN0b20gY3NzLWluLWpzIG9iamVjdCBzdHlsZXMgZm9yIHRoZSB0b29sdGlwIGJvZHkuXG4gICAqL1xuICBzdHlsZXM/OiBSZWNvcmQ8c3RyaW5nLCBDU1NQcm9wZXJ0aWVzPjtcbiAgLyoqXG4gICAqIERldGVybWluZXMgaWYgdGhlIHRvb2x0aXAgc2hvdWxkIG5vdCBhcHBlYXIuXG4gICAqL1xuICBvZmY6IGJvb2xlYW47XG4gIC8qKlxuICAgKiBBbiBpZGVudGlmaWVyIGZvciB0aGUgdG9vbHRpcCwgdXNlZCBmb3IgYGFyaWEtZGVzY3JpYmVkYnlgLlxuICAgKi9cbiAgaWQ/OiBzdHJpbmc7XG4gIC8qKlxuICAgKiBBIGNhbGxiYWNrIGZ1bmN0aW9uLCBjYWxsZWQgd2hlbiB0aGUgdG9vbHRpcCBpcyBjbG9zaW5nLlxuICAgKi9cbiAgb25DbG9zZT86IChlPzogQ2hhbmdlRXZlbnQgfCBGb2N1c0V2ZW50KSA9PiB2b2lkO1xuICAvKipcbiAgICogQSBjYWxsYmFjayBmdW5jdGlvbiwgY2FsbGVkIHdoZW4gdGhlIHRvb2x0aXAgaXMgb3BlbmluZy5cbiAgICovXG4gIG9uT3Blbj86IChlPzogQ2hhbmdlRXZlbnQgfCBGb2N1c0V2ZW50KSA9PiB2b2lkO1xuICBpc09wZW4/OiBib29sZWFuO1xuICAvKipcbiAgICogSG93IHRoZSB0b29sdGlwIGlzIHBvc2l0aW9uZWQgcmVsYXRpdmUgdG8gdGhlIGNoaWxkIGVsZW1lbnQuXG4gICAqL1xuICBwbGFjZW1lbnQ/OlxuICAgIHwgJ3RvcCdcbiAgICB8ICd0b3Atc3RhcnQnXG4gICAgfCAndG9wLWVuZCdcbiAgICB8ICdyaWdodCdcbiAgICB8ICdyaWdodC1zdGFydCdcbiAgICB8ICdyaWdodC1lbmQnXG4gICAgfCAnYm90dG9tJ1xuICAgIHwgJ2JvdHRvbS1zdGFydCdcbiAgICB8ICdib3R0b20tZW5kJ1xuICAgIHwgJ2xlZnQnXG4gICAgfCAnbGVmdC1zdGFydCdcbiAgICB8ICdsZWZ0LWVuZCc7XG4gIC8qKlxuICAgKiBUaGUgbWVzc2FnZSB0byBzaG93IGluIHRoZSB0b29sdGlwLlxuICAgKi9cbiAgdGl0bGU6IHN0cmluZztcbiAgLyoqXG4gICAqIFByb3ZpZGVzIGEgd2F5IHRvIGZpbmUtdHVuZSBhbiBhcHBlYXJhbmNlIG9mIHVuZGVybHlpbmcgUG9wcGVyIHRvb2x0aXAgZWxlbWVudC4gRm9yIG1vcmUgaW5mb3JtYXRpb24sIHBsZWFzZSBjaGVjayBbUG9wcGVyLmpzIGRvY3VtZW50YXRpb25dKGh0dHBzOi8vcG9wcGVyLmpzLm9yZy9wb3BwZXItZG9jdW1lbnRhdGlvbi5odG1sI21vZGlmaWVycykuXG4gICAqL1xuICBtb2RpZmllcnM/OiBNb2RpZmllcnM7XG4gIC8qKlxuICAgKiBDdXN0b21pemUgdGhlIGFwcGVhcmFuY2Ugb2YgY2VydGFpbiBlbGVtZW50cyBvZiB0aGUgdG9vbHRpcC5cbiAgICovXG4gIGNvbXBvbmVudHM/OiBUQ29tcG9uZW50cztcbiAgLyoqXG4gICAqIEhvcml6b250YWwgc2l6ZSBsaW1pdCBvZiB0aGUgdG9vbHRpcC5cbiAgICovXG4gIGhvcml6b250YWxDb25zdHJhaW50PzpcbiAgICB8IDFcbiAgICB8IDJcbiAgICB8IDNcbiAgICB8IDRcbiAgICB8IDVcbiAgICB8IDZcbiAgICB8IDdcbiAgICB8IDhcbiAgICB8IDlcbiAgICB8IDEwXG4gICAgfCAxMVxuICAgIHwgMTJcbiAgICB8IDEzXG4gICAgfCAxNFxuICAgIHwgMTVcbiAgICB8IDE2XG4gICAgfCAnc2NhbGUnXG4gICAgfCAnYXV0byc7XG59O1xuXG5leHBvcnQgdHlwZSBUVG9vbHRpcFN0YXRlID0gJ2Nsb3NlZCcgfCAnZW50ZXJpbmcnIHwgJ29wZW5lZCcgfCAnZXhpdGluZyc7XG5cbmNvbnN0IFRvb2x0aXBXcmFwcGVyID0gKHByb3BzOiBQaWNrPFRUb29sdGlwUHJvcHMsICdjaGlsZHJlbic+KSA9PiAoXG4gIDw+e3Byb3BzLmNoaWxkcmVufTwvPlxuKTtcblRvb2x0aXBXcmFwcGVyLmRpc3BsYXlOYW1lID0gJ1Rvb2x0aXBXcmFwcGVyQ29tcG9uZW50JztcblxuY29uc3QgdG9vbHRpcERlZmF1bHRQcm9wczogUGljazxcbiAgVFRvb2x0aXBQcm9wcyxcbiAgJ3Nob3dBZnRlcicgfCAnY2xvc2VBZnRlcicgfCAnaG9yaXpvbnRhbENvbnN0cmFpbnQnIHwgJ29mZicgfCAncGxhY2VtZW50J1xuPiA9IHtcbiAgc2hvd0FmdGVyOiAzMDAsXG4gIGNsb3NlQWZ0ZXI6IDIwMCxcbiAgaG9yaXpvbnRhbENvbnN0cmFpbnQ6ICdzY2FsZScsXG4gIG9mZjogZmFsc2UsXG4gIHBsYWNlbWVudDogJ3RvcCcsXG59O1xuXG5jb25zdCBUb29sdGlwID0gKHByb3BzOiBUVG9vbHRpcFByb3BzKSA9PiB7XG4gIGNvbnN0IGVudGVyVGltZXIgPSB1c2VSZWY8UmV0dXJuVHlwZTx0eXBlb2Ygc2V0VGltZW91dD4+KCk7XG4gIGNvbnN0IGxlYXZlVGltZXIgPSB1c2VSZWY8UmV0dXJuVHlwZTx0eXBlb2Ygc2V0VGltZW91dD4+KCk7XG5cbiAgaWYgKHByb3BzLmNvbXBvbmVudHM/LkJvZHlDb21wb25lbnQpIHtcbiAgICB3YXJuaW5nKFxuICAgICAgaXNWYWxpZEVsZW1lbnRUeXBlKHByb3BzLmNvbXBvbmVudHMuQm9keUNvbXBvbmVudCksXG4gICAgICBgdWkta2l0L1Rvb2x0aXA6IHRoZSBwcm9wICdjb21wb25lbnRzLkJvZHlDb21wb25lbnQnIGlzIG5vdCBhIHZhbGlkIFJlYWN0IGVsZW1lbnQuYFxuICAgICk7XG4gIH1cbiAgaWYgKHByb3BzLmNvbXBvbmVudHM/LlRvb2x0aXBXcmFwcGVyQ29tcG9uZW50KSB7XG4gICAgd2FybmluZyhcbiAgICAgIGlzVmFsaWRFbGVtZW50VHlwZShwcm9wcy5jb21wb25lbnRzLlRvb2x0aXBXcmFwcGVyQ29tcG9uZW50KSxcbiAgICAgIGB1aS1raXQvVG9vbHRpcDogdGhlIHByb3AgJ2NvbXBvbmVudHMuVG9vbHRpcFdyYXBwZXJDb21wb25lbnQnIGlzIG5vdCBhIHZhbGlkIFJlYWN0IGVsZW1lbnQuYFxuICAgICk7XG4gIH1cbiAgaWYgKHByb3BzLmNvbXBvbmVudHM/LldyYXBwZXJDb21wb25lbnQpIHtcbiAgICB3YXJuaW5nKFxuICAgICAgaXNWYWxpZEVsZW1lbnRUeXBlKHByb3BzLmNvbXBvbmVudHMuV3JhcHBlckNvbXBvbmVudCksXG4gICAgICBgdWkta2l0L1Rvb2x0aXA6IHRoZSBwcm9wICdjb21wb25lbnRzLldyYXBwZXJDb21wb25lbnQnIGlzIG5vdCBhIHZhbGlkIFJlYWN0IGVsZW1lbnQuYFxuICAgICk7XG4gIH1cblxuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIHJldHVybiAoKSA9PiB7XG4gICAgICBpZiAoZW50ZXJUaW1lci5jdXJyZW50KSB7XG4gICAgICAgIGNsZWFyVGltZW91dChlbnRlclRpbWVyLmN1cnJlbnQpO1xuICAgICAgfVxuICAgICAgaWYgKGxlYXZlVGltZXIuY3VycmVudCkge1xuICAgICAgICBjbGVhclRpbWVvdXQobGVhdmVUaW1lci5jdXJyZW50KTtcbiAgICAgIH1cbiAgICB9O1xuICB9LCBbXSk7XG5cbiAgY29uc3QgeyByZWZlcmVuY2UsIHBvcHBlciwgcG9wcGVySW5zdGFuY2UgfSA9IHVzZVBvcHBlcih7XG4gICAgcGxhY2VtZW50OiBwcm9wcy5wbGFjZW1lbnQsXG4gICAgbW9kaWZpZXJzOiBwcm9wcy5tb2RpZmllcnMsXG4gIH0pO1xuICBjb25zdCBbc3RhdGUsIHNldFN0YXRlXSA9IHVzZVN0YXRlPFRUb29sdGlwU3RhdGU+KCdjbG9zZWQnKTtcblxuICBjb25zdCBpc0NvbnRyb2xsZWQgPSAhaXNOaWwocHJvcHMuaXNPcGVuKTtcbiAgY29uc3QgdG9vbHRpcElzT3BlbiA9IGlzQ29udHJvbGxlZFxuICAgID8gcHJvcHMuaXNPcGVuXG4gICAgOiBzdGF0ZSA9PT0gJ29wZW5lZCcgfHwgc3RhdGUgPT09ICdleGl0aW5nJztcbiAgY29uc3QgaWQgPSB1c2VGaWVsZElkKHByb3BzLmlkLCBzZXF1ZW50aWFsSWQpO1xuXG4gIGNvbnN0IHsgb25DbG9zZSB9ID0gcHJvcHM7XG4gIGNvbnN0IGhhbmRsZUNsb3NlID0gdXNlQ2FsbGJhY2soXG4gICAgKGV2ZW50PzogQ2hhbmdlRXZlbnQgfCBGb2N1c0V2ZW50KSA9PiB7XG4gICAgICBpZiAoIWlzQ29udHJvbGxlZCkge1xuICAgICAgICBzZXRTdGF0ZSgnY2xvc2VkJyk7XG4gICAgICB9XG4gICAgICBpZiAob25DbG9zZSkge1xuICAgICAgICBvbkNsb3NlKGV2ZW50KTtcbiAgICAgIH1cbiAgICB9LFxuICAgIFtpc0NvbnRyb2xsZWQsIG9uQ2xvc2VdXG4gICk7XG5cbiAgY29uc3QgeyBvbkZvY3VzLCBvbk1vdXNlT3ZlciB9ID0gcHJvcHMuY2hpbGRyZW4ucHJvcHM7XG4gIGNvbnN0IHsgc2hvd0FmdGVyLCBvbk9wZW4gfSA9IHByb3BzO1xuICBjb25zdCBoYW5kbGVFbnRlciA9IHVzZUNhbGxiYWNrKFxuICAgIChldmVudD86IENoYW5nZUV2ZW50IHwgRm9jdXNFdmVudCkgPT4ge1xuICAgICAgaWYgKGV2ZW50KSB7XG4gICAgICAgIGlmIChldmVudC50eXBlID09PSAnbW91c2VvdmVyJyAmJiBvbk1vdXNlT3Zlcikge1xuICAgICAgICAgIG9uTW91c2VPdmVyKGV2ZW50KTtcbiAgICAgICAgfVxuXG4gICAgICAgIGlmIChldmVudC50eXBlID09PSAnZm9jdXMnICYmIG9uRm9jdXMpIHtcbiAgICAgICAgICBvbkZvY3VzKGV2ZW50KTtcbiAgICAgICAgfVxuXG4gICAgICAgIGlmIChzdGF0ZSAhPT0gJ29wZW5lZCcgJiYgIWlzQ29udHJvbGxlZCkge1xuICAgICAgICAgIHNldFN0YXRlKCdlbnRlcmluZycpO1xuICAgICAgICAgIGVudGVyVGltZXIuY3VycmVudCA9IHNldFRpbWVvdXQoKCkgPT4ge1xuICAgICAgICAgICAgc2V0U3RhdGUoJ29wZW5lZCcpO1xuXG4gICAgICAgICAgICBpZiAob25PcGVuKSB7XG4gICAgICAgICAgICAgIG9uT3BlbihldmVudCk7XG4gICAgICAgICAgICB9XG4gICAgICAgICAgfSwgc2hvd0FmdGVyKTtcbiAgICAgICAgfVxuXG4gICAgICAgIGV2ZW50LnByZXZlbnREZWZhdWx0KCk7XG4gICAgICAgIGV2ZW50LnN0b3BQcm9wYWdhdGlvbigpO1xuICAgICAgfVxuICAgIH0sXG4gICAgW29uRm9jdXMsIG9uT3Blbiwgb25Nb3VzZU92ZXIsIGlzQ29udHJvbGxlZCwgc3RhdGUsIHNob3dBZnRlcl1cbiAgKTtcblxuICBjb25zdCB7IG9uQmx1ciwgb25Nb3VzZUxlYXZlIH0gPSBwcm9wcy5jaGlsZHJlbi5wcm9wcztcbiAgY29uc3QgeyBjbG9zZUFmdGVyIH0gPSBwcm9wcztcblxuICBjb25zdCBoYW5kbGVMZWF2ZSA9IHVzZUNhbGxiYWNrKFxuICAgIChldmVudCkgPT4ge1xuICAgICAgY2xlYXJUaW1lb3V0KGVudGVyVGltZXIuY3VycmVudCk7XG4gICAgICBjbGVhclRpbWVvdXQobGVhdmVUaW1lci5jdXJyZW50KTtcblxuICAgICAgaWYgKGV2ZW50LnR5cGUgPT09ICdtb3VzZWxlYXZlJyAmJiBvbk1vdXNlTGVhdmUpIHtcbiAgICAgICAgb25Nb3VzZUxlYXZlKGV2ZW50KTtcbiAgICAgIH1cblxuICAgICAgaWYgKGV2ZW50LnR5cGUgPT09ICdibHVyJyAmJiBvbkJsdXIpIHtcbiAgICAgICAgb25CbHVyKGV2ZW50KTtcbiAgICAgIH1cblxuICAgICAgaWYgKGNsb3NlQWZ0ZXIgJiYgc3RhdGUgPT09ICdvcGVuZWQnKSB7XG4gICAgICAgIGxlYXZlVGltZXIuY3VycmVudCA9IHNldFRpbWVvdXQoKCkgPT4ge1xuICAgICAgICAgIGNvbnN0IHRvb2x0aXBFbGVtZW50ID0gcG9wcGVySW5zdGFuY2U/LnBvcHBlci5xdWVyeVNlbGVjdG9yKFxuICAgICAgICAgICAgJ1tkYXRhLXRlc3RpZD1cInRvb2x0aXAtbWVzc2FnZS13cmFwcGVyXCJdJ1xuICAgICAgICAgICkgYXMgSFRNTEVsZW1lbnQ7XG5cbiAgICAgICAgICBpZiAodG9vbHRpcEVsZW1lbnQpIHtcbiAgICAgICAgICAgIHRvb2x0aXBFbGVtZW50LmFkZEV2ZW50TGlzdGVuZXIoJ2FuaW1hdGlvbmVuZCcsICgpID0+XG4gICAgICAgICAgICAgIGhhbmRsZUNsb3NlKClcbiAgICAgICAgICAgICk7XG4gICAgICAgICAgfSBlbHNlIHtcbiAgICAgICAgICAgIGhhbmRsZUNsb3NlKCk7XG4gICAgICAgICAgfVxuXG4gICAgICAgICAgc2V0U3RhdGUoJ2V4aXRpbmcnKTtcbiAgICAgICAgfSwgY2xvc2VBZnRlcik7XG4gICAgICB9IGVsc2Uge1xuICAgICAgICBoYW5kbGVDbG9zZShldmVudCk7XG4gICAgICB9XG4gICAgfSxcbiAgICBbY2xvc2VBZnRlciwgb25CbHVyLCBvbk1vdXNlTGVhdmUsIGhhbmRsZUNsb3NlLCBzdGF0ZSwgcG9wcGVySW5zdGFuY2VdXG4gICk7XG5cbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICAvLyBpZiB0b29sdGlwIHdhcyBvcGVuLCBhbmQgdGhlbiBjb21wb25lbnRcbiAgICAvLyB1cGRhdGVkIHRvIGJlIG9mZiwgd2Ugc2hvdWxkIGNsb3NlIHRoZSB0b29sdGlwXG4gICAgaWYgKHN0YXRlID09PSAnb3BlbmVkJyAmJiBwcm9wcy5vZmYpIHtcbiAgICAgIGlmIChjbG9zZUFmdGVyKSB7XG4gICAgICAgIGxlYXZlVGltZXIuY3VycmVudCA9IHNldFRpbWVvdXQoKCkgPT4ge1xuICAgICAgICAgIGhhbmRsZUNsb3NlKCk7XG4gICAgICAgIH0sIGNsb3NlQWZ0ZXIpO1xuICAgICAgfSBlbHNlIHtcbiAgICAgICAgaGFuZGxlQ2xvc2UoKTtcbiAgICAgIH1cbiAgICB9XG4gIH0sIFtwcm9wcy5vZmYsIGNsb3NlQWZ0ZXIsIGhhbmRsZUNsb3NlLCBzdGF0ZV0pO1xuXG4gIGNvbnN0IGNoaWxkcmVuUHJvcHMgPSB7XG4gICAgLy8gZG9uJ3QgcGFzcyBldmVudCBsaXN0ZW5lcnMgdG8gY2hpbGRyZW5cbiAgICBvbkZvY3VzOiBudWxsLFxuICAgIG9uTW91c2VPdmVyOiBudWxsLFxuICAgIG9uTW91c2VMZWF2ZTogbnVsbCxcbiAgICBvbkJsdXI6IG51bGwsXG4gIH07XG5cbiAgY29uc3QgdG9vbHRpcFByb3BzID0gIXByb3BzLm9mZlxuICAgID8ge1xuICAgICAgICAnYXJpYS1kZXNjcmliZWRieSc6IHRvb2x0aXBJc09wZW4gPyBpZCA6IG51bGwsXG4gICAgICAgIC8vIGZvciBzZW8gYW5kIGFjY2Vzc2liaWxpdHksIHdlIGFkZCB0aGUgdG9vbHRpcCdzIHRpdGxlXG4gICAgICAgIC8vIGFzIGEgbmF0aXZlIHRpdGxlIHdoZW4gdGhlIHRpdGxlIGlzIGhpZGRlblxuICAgICAgICB0aXRsZTpcbiAgICAgICAgICAhdG9vbHRpcElzT3BlbiAmJlxuICAgICAgICAgIHN0YXRlICE9PSAnZW50ZXJpbmcnICYmXG4gICAgICAgICAgdHlwZW9mIHByb3BzLnRpdGxlID09PSAnc3RyaW5nJ1xuICAgICAgICAgICAgPyBwcm9wcy50aXRsZVxuICAgICAgICAgICAgOiBudWxsLFxuICAgICAgfVxuICAgIDoge307XG5cbiAgY29uc3QgZXZlbnRMaXN0ZW5lcnMgPSAhcHJvcHMub2ZmXG4gICAgPyB7XG4gICAgICAgIG9uTW91c2VFbnRlcjogaGFuZGxlRW50ZXIsXG4gICAgICAgIG9uTW91c2VMZWF2ZTogaGFuZGxlTGVhdmUsXG4gICAgICAgIG9uRm9jdXM6IGhhbmRsZUVudGVyLFxuICAgICAgICBvbkJsdXI6IGhhbmRsZUxlYXZlLFxuICAgICAgfVxuICAgIDoge307XG5cbiAgY29uc3QgV3JhcHBlckNvbXBvbmVudCA9IHByb3BzLmNvbXBvbmVudHM/LldyYXBwZXJDb21wb25lbnQgfHwgV3JhcHBlcjtcbiAgY29uc3QgQm9keUNvbXBvbmVudCA9IHByb3BzLmNvbXBvbmVudHM/LkJvZHlDb21wb25lbnQgfHwgQm9keTtcbiAgY29uc3QgVG9vbHRpcFdyYXBwZXJDb21wb25lbnQgPVxuICAgIHByb3BzLmNvbXBvbmVudHM/LlRvb2x0aXBXcmFwcGVyQ29tcG9uZW50IHx8IFRvb2x0aXBXcmFwcGVyO1xuXG4gIHJldHVybiAoXG4gICAgPD5cbiAgICAgIDxXcmFwcGVyQ29tcG9uZW50XG4gICAgICAgIHsuLi5ldmVudExpc3RlbmVyc31cbiAgICAgICAgLy8gQHRzLWV4cGVjdC1lcnJvcjogeWVzLCByZWYgY2FuIGJlIHVuZGVmaW5lZFxuICAgICAgICByZWY9e3JlZmVyZW5jZS5yZWZ9XG4gICAgICA+XG4gICAgICAgIHtjbG9uZUVsZW1lbnQocHJvcHMuY2hpbGRyZW4sIHtcbiAgICAgICAgICAuLi5jaGlsZHJlblByb3BzLFxuICAgICAgICAgIC4uLnRvb2x0aXBQcm9wcyxcbiAgICAgICAgfSl9XG4gICAgICA8L1dyYXBwZXJDb21wb25lbnQ+XG4gICAgICB7dG9vbHRpcElzT3BlbiAmJiAoXG4gICAgICAgIDxUb29sdGlwV3JhcHBlckNvbXBvbmVudD5cbiAgICAgICAgICA8ZGl2XG4gICAgICAgICAgICAvLyByZWYgYWNjZXB0cyBgTGVnYWN5UmVmYCwgd2hpY2ggaXMgYSB1bmlvbiBvZiBgUmVmT2JqZWN0YCBhbmQgYHN0cmluZ2BcbiAgICAgICAgICAgIC8vIHByb3BwZXIucmVmIHJldHVybnMgYFJlZk9iamVjdGBcbiAgICAgICAgICAgIHJlZj17cG9wcGVyLnJlZiBhcyBMZWdhY3lSZWY8SFRNTERpdkVsZW1lbnQ+fVxuICAgICAgICAgICAgY3NzPXtjc3Moe1xuICAgICAgICAgICAgICAuLi5wb3BwZXIuc3R5bGVzLFxuICAgICAgICAgICAgICAuLi5nZXRCb2R5U3R5bGVzKHtcbiAgICAgICAgICAgICAgICBjb25zdHJhaW50OiBwcm9wcy5ob3Jpem9udGFsQ29uc3RyYWludCxcbiAgICAgICAgICAgICAgICBwbGFjZW1lbnQ6IHBvcHBlci5wbGFjZW1lbnQsXG4gICAgICAgICAgICAgICAgY3VzdG9tU3R5bGVzOiBwcm9wcy5zdHlsZXM/LmJvZHksXG4gICAgICAgICAgICAgIH0pLFxuICAgICAgICAgICAgfSl9XG4gICAgICAgICAgICBkYXRhLXBsYWNlbWVudD17cG9wcGVyLnBsYWNlbWVudH1cbiAgICAgICAgICA+XG4gICAgICAgICAgICA8ZGl2XG4gICAgICAgICAgICAgIGNzcz17Y3NzKHtcbiAgICAgICAgICAgICAgICAuLi5nZXRUb29sdGlwU3R5bGVzKHN0YXRlKSxcbiAgICAgICAgICAgICAgfSl9XG4gICAgICAgICAgICAgIGRhdGEtdGVzdGlkPVwidG9vbHRpcC1tZXNzYWdlLXdyYXBwZXJcIlxuICAgICAgICAgICAgPlxuICAgICAgICAgICAgICA8Qm9keUNvbXBvbmVudD57cHJvcHMudGl0bGV9PC9Cb2R5Q29tcG9uZW50PlxuICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgPC9kaXY+XG4gICAgICAgIDwvVG9vbHRpcFdyYXBwZXJDb21wb25lbnQ+XG4gICAgICApfVxuICAgIDwvPlxuICApO1xufTtcblxuVG9vbHRpcC5kaXNwbGF5TmFtZSA9ICdUb29sVGlwJztcblRvb2x0aXAuZGVmYXVsdFByb3BzID0gdG9vbHRpcERlZmF1bHRQcm9wcztcblxuZXhwb3J0IGRlZmF1bHQgVG9vbHRpcDtcbiJdfQ== */"),
265
276
  "data-placement": popper.placement,
266
277
  children: jsx("div", {
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": "19.11.0",
4
+ "version": "19.12.0",
5
5
  "bugs": "https://github.com/commercetools/ui-kit/issues",
6
6
  "repository": {
7
7
  "type": "git",
@@ -21,10 +21,10 @@
21
21
  "dependencies": {
22
22
  "@babel/runtime": "^7.20.13",
23
23
  "@babel/runtime-corejs3": "^7.20.13",
24
- "@commercetools-uikit/constraints": "19.11.0",
25
- "@commercetools-uikit/design-system": "19.11.0",
26
- "@commercetools-uikit/hooks": "19.11.0",
27
- "@commercetools-uikit/utils": "19.11.0",
24
+ "@commercetools-uikit/constraints": "19.12.0",
25
+ "@commercetools-uikit/design-system": "19.12.0",
26
+ "@commercetools-uikit/hooks": "19.12.0",
27
+ "@commercetools-uikit/utils": "19.12.0",
28
28
  "@emotion/react": "^11.10.5",
29
29
  "@emotion/styled": "^11.10.5",
30
30
  "lodash": "4.17.21",