@atlaskit/tooltip 17.5.2 → 17.5.5

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 (16) hide show
  1. package/CHANGELOG.md +21 -0
  2. package/dist/cjs/Tooltip.js +3 -3
  3. package/dist/cjs/TooltipContainer.js +28 -7
  4. package/dist/cjs/TooltipPrimitive.js +14 -5
  5. package/dist/cjs/index.js +4 -4
  6. package/dist/cjs/version.json +1 -1
  7. package/dist/es2019/Tooltip.js +1 -1
  8. package/dist/es2019/TooltipContainer.js +27 -22
  9. package/dist/es2019/TooltipPrimitive.js +10 -6
  10. package/dist/es2019/version.json +1 -1
  11. package/dist/esm/Tooltip.js +3 -3
  12. package/dist/esm/TooltipContainer.js +27 -7
  13. package/dist/esm/TooltipPrimitive.js +14 -5
  14. package/dist/esm/version.json +1 -1
  15. package/dist/types/Tooltip.d.ts +1 -0
  16. package/package.json +9 -10
package/CHANGELOG.md CHANGED
@@ -1,5 +1,26 @@
1
1
  # @atlaskit/tooltip
2
2
 
3
+ ## 17.5.5
4
+
5
+ ### Patch Changes
6
+
7
+ - [`d0eed99c3e3`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d0eed99c3e3) - ED-14264 Moved styles to emotion css
8
+ - [`6007e4f9a97`](https://bitbucket.org/atlassian/atlassian-frontend/commits/6007e4f9a97) - Internal styling has been refactored in preparation for @compiled/react
9
+ - Updated dependencies
10
+
11
+ ## 17.5.4
12
+
13
+ ### Patch Changes
14
+
15
+ - [`19d72473dfb`](https://bitbucket.org/atlassian/atlassian-frontend/commits/19d72473dfb) - The no-unsafe-design-token-usage eslint rule now respects the new token naming conventions when auto-fixing by correctly formatting token ids.
16
+ - Updated dependencies
17
+
18
+ ## 17.5.3
19
+
20
+ ### Patch Changes
21
+
22
+ - Updated dependencies
23
+
3
24
  ## 17.5.2
4
25
 
5
26
  ### Patch Changes
package/dist/cjs/Tooltip.js CHANGED
@@ -45,16 +45,16 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
45
45
 
46
46
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
47
47
 
48
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
48
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
49
49
 
50
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
50
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
51
51
 
52
52
  var tooltipZIndex = _constants.layers.tooltip();
53
53
 
54
54
  var analyticsAttributes = {
55
55
  componentName: 'tooltip',
56
56
  packageName: "@atlaskit/tooltip",
57
- packageVersion: "17.5.2"
57
+ packageVersion: "17.5.5"
58
58
  };
59
59
 
60
60
  function noop() {}
package/dist/cjs/TooltipContainer.js CHANGED
@@ -7,8 +7,6 @@ Object.defineProperty(exports, "__esModule", {
7
7
  });
8
8
  exports.default = void 0;
9
9
 
10
- var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
11
-
12
10
  var _react = require("react");
13
11
 
14
12
  var _core = require("@emotion/core");
@@ -21,10 +19,33 @@ var _constants = require("@atlaskit/theme/constants");
21
19
 
22
20
  var _TooltipPrimitive = _interopRequireDefault(require("./TooltipPrimitive"));
23
21
 
24
- var _templateObject, _templateObject2, _templateObject3;
25
-
26
- var baseCss = (0, _core.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n border-radius: ", "px;\n box-sizing: border-box;\n font-size: 12px;\n left: 0;\n line-height: 1.3;\n max-width: 240px;\n padding: 2px 6px;\n top: 0;\n word-wrap: break-word;\n overflow-wrap: break-word;\n"])), (0, _constants.borderRadius)());
27
- var truncateCss = (0, _core.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n max-width: 420px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n"])));
22
+ /** @jsx jsx */
23
+ var baseStyles = (0, _core.css)({
24
+ boxSizing: 'border-box',
25
+ maxWidth: '240px',
26
+ padding: '2px 6px',
27
+ top: 0,
28
+ left: 0,
29
+ borderRadius: "".concat((0, _constants.borderRadius)(), "px"),
30
+ fontSize: '12px',
31
+ lineHeight: 1.3,
32
+ overflowWrap: 'break-word',
33
+ wordWrap: 'break-word'
34
+ });
35
+ var truncateStyles = (0, _core.css)({
36
+ maxWidth: '420px',
37
+ overflow: 'hidden',
38
+ textOverflow: 'ellipsis',
39
+ whiteSpace: 'nowrap'
40
+ });
41
+ var lightStyles = (0, _core.css)({
42
+ backgroundColor: "var(--ds-background-neutral-bold, ".concat(_colors.N800, ")"),
43
+ color: "var(--ds-text-inverse, ".concat(_colors.N0, ")")
44
+ });
45
+ var darkStyles = (0, _core.css)({
46
+ backgroundColor: "var(--ds-background-neutral-bold, ".concat(_colors.DN0, ")"),
47
+ color: "var(--ds-text-inverse, ".concat(_colors.DN600, ")")
48
+ });
28
49
  var TooltipContainer = /*#__PURE__*/(0, _react.forwardRef)(function TooltipContainer(_ref, ref) {
29
50
  var style = _ref.style,
30
51
  className = _ref.className,
@@ -47,7 +68,7 @@ var TooltipContainer = /*#__PURE__*/(0, _react.forwardRef)(function TooltipConta
47
68
  id: id,
48
69
  onMouseOut: onMouseOut,
49
70
  onMouseOver: onMouseOver,
50
- css: [baseCss, truncate ? truncateCss : null, (0, _core.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n background-color: ", ";\n color: ", ";\n "])), mode === 'light' ? "var(--ds-background-boldNeutral-resting, ".concat(_colors.N800, ")") : "var(--ds-background-boldNeutral-resting, ".concat(_colors.DN0, ")"), mode === 'light' ? "var(--ds-text-onBold, ".concat(_colors.N0, ")") : "var(--ds-text-onBold, ".concat(_colors.DN600, ")"))]
71
+ css: [baseStyles, truncate ? truncateStyles : null, mode === 'light' ? lightStyles : darkStyles]
51
72
  }, children)
52
73
  );
53
74
  });
package/dist/cjs/TooltipPrimitive.js CHANGED
@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
7
7
  });
8
8
  exports.default = void 0;
9
9
 
10
- var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
10
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
11
11
 
12
12
  var _react = require("react");
13
13
 
@@ -15,9 +15,15 @@ var _core = require("@emotion/core");
15
15
 
16
16
  var _constants = require("@atlaskit/theme/constants");
17
17
 
18
- var _templateObject;
18
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
19
19
 
20
- var primitiveCss = (0, _core.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n z-index: ", ";\n cursor: default;\n"])), _constants.layers.tooltip());
20
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
21
+
22
+ var VAR_PRIMITIVE_ZINDEX = 'tooltipPrimitiveZindex';
23
+ var primitiveStyles = (0, _core.css)({
24
+ zindex: "var(".concat(VAR_PRIMITIVE_ZINDEX, ")"),
25
+ cursor: "default"
26
+ });
21
27
  var TooltipPrimitive = /*#__PURE__*/(0, _react.forwardRef)(function TooltipPrimitive(_ref, ref) {
22
28
  var style = _ref.style,
23
29
  className = _ref.className,
@@ -27,15 +33,18 @@ var TooltipPrimitive = /*#__PURE__*/(0, _react.forwardRef)(function TooltipPrimi
27
33
  onMouseOut = _ref.onMouseOut,
28
34
  onMouseOver = _ref.onMouseOver,
29
35
  id = _ref.id;
36
+
37
+ var styleWithZIndex = _objectSpread(_objectSpread({}, style), {}, (0, _defineProperty2.default)({}, VAR_PRIMITIVE_ZINDEX, _constants.layers.tooltip()));
38
+
30
39
  return (// eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
31
40
  (0, _core.jsx)("div", {
32
41
  role: "tooltip",
33
42
  ref: ref,
34
- style: style,
43
+ style: styleWithZIndex,
35
44
  className: className,
36
45
  onMouseOut: onMouseOut,
37
46
  onMouseOver: onMouseOver,
38
- css: primitiveCss,
47
+ css: primitiveStyles,
39
48
  "data-placement": placement,
40
49
  "data-testid": testId,
41
50
  id: id
package/dist/cjs/index.js CHANGED
@@ -5,16 +5,16 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
- Object.defineProperty(exports, "default", {
8
+ Object.defineProperty(exports, "TooltipPrimitive", {
9
9
  enumerable: true,
10
10
  get: function get() {
11
- return _Tooltip.default;
11
+ return _TooltipPrimitive.default;
12
12
  }
13
13
  });
14
- Object.defineProperty(exports, "TooltipPrimitive", {
14
+ Object.defineProperty(exports, "default", {
15
15
  enumerable: true,
16
16
  get: function get() {
17
- return _TooltipPrimitive.default;
17
+ return _Tooltip.default;
18
18
  }
19
19
  });
20
20
 
package/dist/cjs/version.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/tooltip",
3
- "version": "17.5.2",
3
+ "version": "17.5.5",
4
4
  "sideEffects": false
5
5
  }
package/dist/es2019/Tooltip.js CHANGED
@@ -18,7 +18,7 @@ const tooltipZIndex = layers.tooltip();
18
18
  const analyticsAttributes = {
19
19
  componentName: 'tooltip',
20
20
  packageName: "@atlaskit/tooltip",
21
- packageVersion: "17.5.2"
21
+ packageVersion: "17.5.5"
22
22
  };
23
23
 
24
24
  function noop() {}
package/dist/es2019/TooltipContainer.js CHANGED
@@ -5,24 +5,32 @@ import { DN0, DN600, N0, N800 } from '@atlaskit/theme/colors';
5
5
  import GlobalTheme from '@atlaskit/theme/components';
6
6
  import { borderRadius } from '@atlaskit/theme/constants';
7
7
  import TooltipPrimitive from './TooltipPrimitive';
8
- const baseCss = css`
9
- border-radius: ${borderRadius()}px;
10
- box-sizing: border-box;
11
- font-size: 12px;
12
- left: 0;
13
- line-height: 1.3;
14
- max-width: 240px;
15
- padding: 2px 6px;
16
- top: 0;
17
- word-wrap: break-word;
18
- overflow-wrap: break-word;
19
- `;
20
- const truncateCss = css`
21
- max-width: 420px;
22
- overflow: hidden;
23
- text-overflow: ellipsis;
24
- white-space: nowrap;
25
- `;
8
+ const baseStyles = css({
9
+ boxSizing: 'border-box',
10
+ maxWidth: '240px',
11
+ padding: '2px 6px',
12
+ top: 0,
13
+ left: 0,
14
+ borderRadius: `${borderRadius()}px`,
15
+ fontSize: '12px',
16
+ lineHeight: 1.3,
17
+ overflowWrap: 'break-word',
18
+ wordWrap: 'break-word'
19
+ });
20
+ const truncateStyles = css({
21
+ maxWidth: '420px',
22
+ overflow: 'hidden',
23
+ textOverflow: 'ellipsis',
24
+ whiteSpace: 'nowrap'
25
+ });
26
+ const lightStyles = css({
27
+ backgroundColor: `var(--ds-background-neutral-bold, ${N800})`,
28
+ color: `var(--ds-text-inverse, ${N0})`
29
+ });
30
+ const darkStyles = css({
31
+ backgroundColor: `var(--ds-background-neutral-bold, ${DN0})`,
32
+ color: `var(--ds-text-inverse, ${DN600})`
33
+ });
26
34
  const TooltipContainer = /*#__PURE__*/forwardRef(function TooltipContainer({
27
35
  style,
28
36
  className,
@@ -46,10 +54,7 @@ const TooltipContainer = /*#__PURE__*/forwardRef(function TooltipContainer({
46
54
  id: id,
47
55
  onMouseOut: onMouseOut,
48
56
  onMouseOver: onMouseOver,
49
- css: [baseCss, truncate ? truncateCss : null, css`
50
- background-color: ${mode === 'light' ? `var(--ds-background-boldNeutral-resting, ${N800})` : `var(--ds-background-boldNeutral-resting, ${DN0})`};
51
- color: ${mode === 'light' ? `var(--ds-text-onBold, ${N0})` : `var(--ds-text-onBold, ${DN600})`};
52
- `]
57
+ css: [baseStyles, truncate ? truncateStyles : null, mode === 'light' ? lightStyles : darkStyles]
53
58
  }, children));
54
59
  });
55
60
  TooltipContainer.displayName = 'TooltipContainer';
package/dist/es2019/TooltipPrimitive.js CHANGED
@@ -2,10 +2,11 @@
2
2
  import { forwardRef } from 'react';
3
3
  import { css, jsx } from '@emotion/core';
4
4
  import { layers } from '@atlaskit/theme/constants';
5
- const primitiveCss = css`
6
- z-index: ${layers.tooltip()};
7
- cursor: default;
8
- `;
5
+ const VAR_PRIMITIVE_ZINDEX = 'tooltipPrimitiveZindex';
6
+ const primitiveStyles = css({
7
+ zindex: `var(${VAR_PRIMITIVE_ZINDEX})`,
8
+ cursor: `default`
9
+ });
9
10
  const TooltipPrimitive = /*#__PURE__*/forwardRef(function TooltipPrimitive({
10
11
  style,
11
12
  className,
@@ -16,15 +17,18 @@ const TooltipPrimitive = /*#__PURE__*/forwardRef(function TooltipPrimitive({
16
17
  onMouseOver,
17
18
  id
18
19
  }, ref) {
20
+ const styleWithZIndex = { ...style,
21
+ [VAR_PRIMITIVE_ZINDEX]: layers.tooltip()
22
+ };
19
23
  return (// eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
20
24
  jsx("div", {
21
25
  role: "tooltip",
22
26
  ref: ref,
23
- style: style,
27
+ style: styleWithZIndex,
24
28
  className: className,
25
29
  onMouseOut: onMouseOut,
26
30
  onMouseOver: onMouseOver,
27
- css: primitiveCss,
31
+ css: primitiveStyles,
28
32
  "data-placement": placement,
29
33
  "data-testid": testId,
30
34
  id: id
package/dist/es2019/version.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/tooltip",
3
- "version": "17.5.2",
3
+ "version": "17.5.5",
4
4
  "sideEffects": false
5
5
  }
package/dist/esm/Tooltip.js CHANGED
@@ -2,9 +2,9 @@ import _extends from "@babel/runtime/helpers/extends";
2
2
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
3
3
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
4
4
 
5
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
5
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
6
6
 
7
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
7
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
8
8
 
9
9
  /** @jsx jsx */
10
10
  import React, { useCallback, useEffect, useRef, useState } from 'react';
@@ -24,7 +24,7 @@ var tooltipZIndex = layers.tooltip();
24
24
  var analyticsAttributes = {
25
25
  componentName: 'tooltip',
26
26
  packageName: "@atlaskit/tooltip",
27
- packageVersion: "17.5.2"
27
+ packageVersion: "17.5.5"
28
28
  };
29
29
 
30
30
  function noop() {}
package/dist/esm/TooltipContainer.js CHANGED
@@ -1,7 +1,3 @@
1
- import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
2
-
3
- var _templateObject, _templateObject2, _templateObject3;
4
-
5
1
  /** @jsx jsx */
6
2
  import { forwardRef } from 'react';
7
3
  import { css, jsx } from '@emotion/core';
@@ -9,8 +5,32 @@ import { DN0, DN600, N0, N800 } from '@atlaskit/theme/colors';
9
5
  import GlobalTheme from '@atlaskit/theme/components';
10
6
  import { borderRadius } from '@atlaskit/theme/constants';
11
7
  import TooltipPrimitive from './TooltipPrimitive';
12
- var baseCss = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n border-radius: ", "px;\n box-sizing: border-box;\n font-size: 12px;\n left: 0;\n line-height: 1.3;\n max-width: 240px;\n padding: 2px 6px;\n top: 0;\n word-wrap: break-word;\n overflow-wrap: break-word;\n"])), borderRadius());
13
- var truncateCss = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n max-width: 420px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n"])));
8
+ var baseStyles = css({
9
+ boxSizing: 'border-box',
10
+ maxWidth: '240px',
11
+ padding: '2px 6px',
12
+ top: 0,
13
+ left: 0,
14
+ borderRadius: "".concat(borderRadius(), "px"),
15
+ fontSize: '12px',
16
+ lineHeight: 1.3,
17
+ overflowWrap: 'break-word',
18
+ wordWrap: 'break-word'
19
+ });
20
+ var truncateStyles = css({
21
+ maxWidth: '420px',
22
+ overflow: 'hidden',
23
+ textOverflow: 'ellipsis',
24
+ whiteSpace: 'nowrap'
25
+ });
26
+ var lightStyles = css({
27
+ backgroundColor: "var(--ds-background-neutral-bold, ".concat(N800, ")"),
28
+ color: "var(--ds-text-inverse, ".concat(N0, ")")
29
+ });
30
+ var darkStyles = css({
31
+ backgroundColor: "var(--ds-background-neutral-bold, ".concat(DN0, ")"),
32
+ color: "var(--ds-text-inverse, ".concat(DN600, ")")
33
+ });
14
34
  var TooltipContainer = /*#__PURE__*/forwardRef(function TooltipContainer(_ref, ref) {
15
35
  var style = _ref.style,
16
36
  className = _ref.className,
@@ -33,7 +53,7 @@ var TooltipContainer = /*#__PURE__*/forwardRef(function TooltipContainer(_ref, r
33
53
  id: id,
34
54
  onMouseOut: onMouseOut,
35
55
  onMouseOver: onMouseOver,
36
- css: [baseCss, truncate ? truncateCss : null, css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n background-color: ", ";\n color: ", ";\n "])), mode === 'light' ? "var(--ds-background-boldNeutral-resting, ".concat(N800, ")") : "var(--ds-background-boldNeutral-resting, ".concat(DN0, ")"), mode === 'light' ? "var(--ds-text-onBold, ".concat(N0, ")") : "var(--ds-text-onBold, ".concat(DN600, ")"))]
56
+ css: [baseStyles, truncate ? truncateStyles : null, mode === 'light' ? lightStyles : darkStyles]
37
57
  }, children)
38
58
  );
39
59
  });
package/dist/esm/TooltipPrimitive.js CHANGED
@@ -1,12 +1,18 @@
1
- import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
1
+ import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
2
 
3
- var _templateObject;
3
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
4
+
5
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
4
6
 
5
7
  /** @jsx jsx */
6
8
  import { forwardRef } from 'react';
7
9
  import { css, jsx } from '@emotion/core';
8
10
  import { layers } from '@atlaskit/theme/constants';
9
- var primitiveCss = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n z-index: ", ";\n cursor: default;\n"])), layers.tooltip());
11
+ var VAR_PRIMITIVE_ZINDEX = 'tooltipPrimitiveZindex';
12
+ var primitiveStyles = css({
13
+ zindex: "var(".concat(VAR_PRIMITIVE_ZINDEX, ")"),
14
+ cursor: "default"
15
+ });
10
16
  var TooltipPrimitive = /*#__PURE__*/forwardRef(function TooltipPrimitive(_ref, ref) {
11
17
  var style = _ref.style,
12
18
  className = _ref.className,
@@ -16,15 +22,18 @@ var TooltipPrimitive = /*#__PURE__*/forwardRef(function TooltipPrimitive(_ref, r
16
22
  onMouseOut = _ref.onMouseOut,
17
23
  onMouseOver = _ref.onMouseOver,
18
24
  id = _ref.id;
25
+
26
+ var styleWithZIndex = _objectSpread(_objectSpread({}, style), {}, _defineProperty({}, VAR_PRIMITIVE_ZINDEX, layers.tooltip()));
27
+
19
28
  return (// eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
20
29
  jsx("div", {
21
30
  role: "tooltip",
22
31
  ref: ref,
23
- style: style,
32
+ style: styleWithZIndex,
24
33
  className: className,
25
34
  onMouseOut: onMouseOut,
26
35
  onMouseOver: onMouseOver,
27
- css: primitiveCss,
36
+ css: primitiveStyles,
28
37
  "data-placement": placement,
29
38
  "data-testid": testId,
30
39
  id: id
package/dist/esm/version.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/tooltip",
3
- "version": "17.5.2",
3
+ "version": "17.5.5",
4
4
  "sideEffects": false
5
5
  }
package/dist/types/Tooltip.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  /** @jsx jsx */
2
+ /// <reference types="react" />
2
3
  import { TooltipProps } from './types';
3
4
  declare function Tooltip({ children, position, mousePosition, content, truncate, component: Container, tag: TargetContainer, testId, delay, onShow, onHide, hideTooltipOnClick, hideTooltipOnMouseDown, analyticsContext, strategy, }: TooltipProps): JSX.Element;
4
5
  declare namespace Tooltip {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/tooltip",
3
- "version": "17.5.2",
3
+ "version": "17.5.5",
4
4
  "description": "A tooltip is a floating, non-actionable label used to explain a user interface element or feature.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -17,7 +17,6 @@
17
17
  "atlassian": {
18
18
  "team": "Design System Team",
19
19
  "deprecatedAutoEntryPoints": true,
20
- "inPublicMirror": true,
21
20
  "releaseModel": "scheduled",
22
21
  "website": {
23
22
  "name": "Tooltip"
@@ -25,12 +24,12 @@
25
24
  },
26
25
  "dependencies": {
27
26
  "@atlaskit/analytics-next": "^8.2.0",
28
- "@atlaskit/ds-lib": "^1.3.0",
27
+ "@atlaskit/ds-lib": "^1.4.0",
29
28
  "@atlaskit/motion": "^1.0.0",
30
29
  "@atlaskit/popper": "^5.0.0",
31
30
  "@atlaskit/portal": "^4.1.0",
32
- "@atlaskit/theme": "^12.0.0",
33
- "@atlaskit/tokens": "^0.4.0",
31
+ "@atlaskit/theme": "^12.1.0",
32
+ "@atlaskit/tokens": "^0.7.0",
34
33
  "@babel/runtime": "^7.0.0",
35
34
  "@emotion/core": "^10.0.9",
36
35
  "bind-event-listener": "^1.0.2",
@@ -41,10 +40,9 @@
41
40
  "react-dom": "^16.8.0"
42
41
  },
43
42
  "devDependencies": {
44
- "@atlaskit/build-utils": "*",
45
- "@atlaskit/button": "^16.1.0",
43
+ "@atlaskit/button": "^16.2.0",
46
44
  "@atlaskit/docs": "*",
47
- "@atlaskit/icon": "^21.9.0",
45
+ "@atlaskit/icon": "^21.10.0",
48
46
  "@atlaskit/section-message": "^6.1.0",
49
47
  "@atlaskit/ssr": "*",
50
48
  "@atlaskit/visual-regression": "*",
@@ -75,10 +73,11 @@
75
73
  "theming": "tokens",
76
74
  "deprecation": "no-deprecated-imports",
77
75
  "styling": [
78
- "emotion"
76
+ "emotion",
77
+ "static"
79
78
  ]
80
79
  }
81
80
  },
82
81
  "homepage": "https://atlassian.design/components/tooltip/",
83
82
  "prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.1"
84
- }
83
+ }