@atlaskit/tooltip 20.0.6 → 20.2.0

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @atlaskit/tooltip
 
+## 20.2.0
+
+### Minor Changes
+
+- [#161767](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/161767)
+  [`de4f10b4e30ab`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/de4f10b4e30ab) -
+  Replaces usage of `@emotion/react` with `@compiled/react` in `TooltipPrimitive`, removing the last
+  usage of `@emotion/react` in this package.
+
+## 20.1.0
+
+### Minor Changes
+
+- [#161235](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/161235)
+  [`cfa80fa55b0d6`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/cfa80fa55b0d6) -
+  The `truncate` prop has been marked as deprecated, as it is inaccessible. It will be be removed in
+  a future release.
+
 ## 20.0.6
 
 ### Patch Changes

package/dist/cjs/tooltip-primitive.compiled.css

@@ -0,0 +1,2 @@
+._11jnf8tm{zindex:var(--_7y8q8x)}
+._80om73ad{cursor:default}

package/dist/cjs/tooltip-primitive.js

@@ -1,24 +1,24 @@
+/* tooltip-primitive.tsx generated by @compiled/babel-plugin v0.36.1 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+require("./tooltip-primitive.compiled.css");
+var _react = _interopRequireWildcard(require("react"));
+var React = _react;
+var _runtime = require("@compiled/react/runtime");
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = require("react");
-var _react2 = require("@emotion/react");
 var _constants = require("@atlaskit/theme/constants");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } /**
- * @jsxRuntime classic
- * @jsx jsx
- */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var VAR_PRIMITIVE_ZINDEX = 'tooltipPrimitiveZindex';
-var primitiveStyles = (0, _react2.css)({
-  zindex: "var(".concat(VAR_PRIMITIVE_ZINDEX, ")"),
-  cursor: "default"
-});
+var primitiveStyles = null;
 
 /**
  * The lower level component for rendering a tooltip.
@@ -33,26 +33,28 @@ var TooltipPrimitive = /*#__PURE__*/(0, _react.forwardRef)(function TooltipPrimi
     onMouseOver = _ref.onMouseOver,
     id = _ref.id;
   var styleWithZIndex = _objectSpread(_objectSpread({}, style), {}, (0, _defineProperty2.default)({}, VAR_PRIMITIVE_ZINDEX, _constants.layers.tooltip()));
-  return (0, _react2.jsx)("div", {
+  return /*#__PURE__*/React.createElement("div", {
     ref: ref
     // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
     ,
     style: styleWithZIndex,
     "data-testid": testId ? "".concat(testId, "--wrapper") : undefined
-  }, (0, _react2.jsx)("div", {
+  }, /*#__PURE__*/React.createElement("div", {
     role: "tooltip"
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     ,
-    className: className
+    className: (0, _runtime.ax)(["_11jnf8tm _80om73ad", className])
     // Because the tooltip should not be focusable, there is no reason to have key events.
     /* eslint-disable-next-line jsx-a11y/mouse-events-have-key-events */,
     onMouseOut: onMouseOut
     /* eslint-disable-next-line jsx-a11y/mouse-events-have-key-events */,
     onMouseOver: onMouseOver,
-    css: primitiveStyles,
     "data-placement": placement,
     "data-testid": testId,
-    id: id
+    id: id,
+    style: {
+      "--_7y8q8x": (0, _runtime.ix)("var(".concat(VAR_PRIMITIVE_ZINDEX, ")"))
+    }
   }, children));
 });
 TooltipPrimitive.displayName = 'TooltipPrimitive';

package/dist/cjs/tooltip.js

@@ -34,7 +34,7 @@ var tooltipZIndex = _constants.layers.tooltip();
 var analyticsAttributes = {
   componentName: 'tooltip',
   packageName: "@atlaskit/tooltip",
-  packageVersion: "20.0.6"
+  packageVersion: "20.2.0"
 };
 
 // Inverts motion direction

package/dist/es2019/tooltip-primitive.compiled.css

@@ -0,0 +1,2 @@
+._11jnani6{zindex:var(tooltipPrimitiveZindex)}
+._80om73ad{cursor:default}

package/dist/es2019/tooltip-primitive.js

@@ -1,17 +1,11 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
+/* tooltip-primitive.tsx generated by @compiled/babel-plugin v0.36.1 */
+import "./tooltip-primitive.compiled.css";
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
 import { forwardRef } from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, jsx } from '@emotion/react';
 import { layers } from '@atlaskit/theme/constants';
 const VAR_PRIMITIVE_ZINDEX = 'tooltipPrimitiveZindex';
-const primitiveStyles = css({
-  zindex: `var(${VAR_PRIMITIVE_ZINDEX})`,
-  cursor: `default`
-});
+const primitiveStyles = null;
 
 /**
  * The lower level component for rendering a tooltip.
@@ -30,23 +24,22 @@ const TooltipPrimitive = /*#__PURE__*/forwardRef(function TooltipPrimitive({
     ...style,
     [VAR_PRIMITIVE_ZINDEX]: layers.tooltip()
   };
-  return jsx("div", {
+  return /*#__PURE__*/React.createElement("div", {
     ref: ref
     // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
     ,
     style: styleWithZIndex,
     "data-testid": testId ? `${testId}--wrapper` : undefined
-  }, jsx("div", {
+  }, /*#__PURE__*/React.createElement("div", {
     role: "tooltip"
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     ,
-    className: className
+    className: ax(["_11jnani6 _80om73ad", className])
     // Because the tooltip should not be focusable, there is no reason to have key events.
     /* eslint-disable-next-line jsx-a11y/mouse-events-have-key-events */,
     onMouseOut: onMouseOut
     /* eslint-disable-next-line jsx-a11y/mouse-events-have-key-events */,
     onMouseOver: onMouseOver,
-    css: primitiveStyles,
     "data-placement": placement,
     "data-testid": testId,
     id: id

package/dist/es2019/tooltip.js

@@ -20,7 +20,7 @@ const tooltipZIndex = layers.tooltip();
 const analyticsAttributes = {
   componentName: 'tooltip',
   packageName: "@atlaskit/tooltip",
-  packageVersion: "20.0.6"
+  packageVersion: "20.2.0"
 };
 
 // Inverts motion direction

package/dist/esm/tooltip-primitive.compiled.css

@@ -0,0 +1,2 @@
+._11jnf8tm{zindex:var(--_7y8q8x)}
+._80om73ad{cursor:default}

package/dist/esm/tooltip-primitive.js

@@ -1,20 +1,14 @@
+/* tooltip-primitive.tsx generated by @compiled/babel-plugin v0.36.1 */
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import "./tooltip-primitive.compiled.css";
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
 import { forwardRef } from 'react';
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-import { css, jsx } from '@emotion/react';
 import { layers } from '@atlaskit/theme/constants';
 var VAR_PRIMITIVE_ZINDEX = 'tooltipPrimitiveZindex';
-var primitiveStyles = css({
-  zindex: "var(".concat(VAR_PRIMITIVE_ZINDEX, ")"),
-  cursor: "default"
-});
+var primitiveStyles = null;
 
 /**
  * The lower level component for rendering a tooltip.
@@ -29,26 +23,28 @@ var TooltipPrimitive = /*#__PURE__*/forwardRef(function TooltipPrimitive(_ref, r
     onMouseOver = _ref.onMouseOver,
     id = _ref.id;
   var styleWithZIndex = _objectSpread(_objectSpread({}, style), {}, _defineProperty({}, VAR_PRIMITIVE_ZINDEX, layers.tooltip()));
-  return jsx("div", {
+  return /*#__PURE__*/React.createElement("div", {
     ref: ref
     // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
     ,
     style: styleWithZIndex,
     "data-testid": testId ? "".concat(testId, "--wrapper") : undefined
-  }, jsx("div", {
+  }, /*#__PURE__*/React.createElement("div", {
     role: "tooltip"
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     ,
-    className: className
+    className: ax(["_11jnf8tm _80om73ad", className])
     // Because the tooltip should not be focusable, there is no reason to have key events.
     /* eslint-disable-next-line jsx-a11y/mouse-events-have-key-events */,
     onMouseOut: onMouseOut
     /* eslint-disable-next-line jsx-a11y/mouse-events-have-key-events */,
     onMouseOver: onMouseOver,
-    css: primitiveStyles,
     "data-placement": placement,
     "data-testid": testId,
-    id: id
+    id: id,
+    style: {
+      "--_7y8q8x": ix("var(".concat(VAR_PRIMITIVE_ZINDEX, ")"))
+    }
   }, children));
 });
 TooltipPrimitive.displayName = 'TooltipPrimitive';

package/dist/esm/tooltip.js

@@ -24,7 +24,7 @@ var tooltipZIndex = layers.tooltip();
 var analyticsAttributes = {
   componentName: 'tooltip',
   packageName: "@atlaskit/tooltip",
-  packageVersion: "20.0.6"
+  packageVersion: "20.2.0"
 };
 
 // Inverts motion direction

package/dist/types/types.d.ts

@@ -104,7 +104,11 @@ export interface TooltipProps {
         ref: React.Ref<HTMLElement>;
     }> | React.ForwardRefExoticComponent<React.PropsWithoutRef<React.AllHTMLAttributes<HTMLElement>> & React.RefAttributes<HTMLElement>>;
     /**
-     * Use this to show only one line of text, and truncate the text when it's too long. We no longer support truncating text in the tooltip as it's inaccessible, and this will be removed in a future release.
+     * Use this to show only one line of text, and truncate the text when it's too long.
+     *
+     * We no longer support truncating text in the tooltip as it's inaccessible, and this prop will be removed in a future release.
+     *
+     * @deprecated
      */
     truncate?: boolean;
     /**

package/dist/types-ts4.5/types.d.ts

@@ -104,7 +104,11 @@ export interface TooltipProps {
         ref: React.Ref<HTMLElement>;
     }> | React.ForwardRefExoticComponent<React.PropsWithoutRef<React.AllHTMLAttributes<HTMLElement>> & React.RefAttributes<HTMLElement>>;
     /**
-     * Use this to show only one line of text, and truncate the text when it's too long. We no longer support truncating text in the tooltip as it's inaccessible, and this will be removed in a future release.
+     * Use this to show only one line of text, and truncate the text when it's too long.
+     *
+     * We no longer support truncating text in the tooltip as it's inaccessible, and this prop will be removed in a future release.
+     *
+     * @deprecated
      */
     truncate?: boolean;
     /**

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/tooltip",
-	"version": "20.0.6",
+	"version": "20.2.0",
 	"description": "A tooltip is a floating, non-actionable label used to explain a user interface element or feature.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -49,10 +49,9 @@
 		"@atlaskit/popper": "^7.0.0",
 		"@atlaskit/portal": "^5.1.0",
 		"@atlaskit/theme": "^18.0.0",
-		"@atlaskit/tokens": "^4.8.0",
+		"@atlaskit/tokens": "^4.9.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^0.18.3",
-		"@emotion/react": "^11.7.1",
 		"bind-event-listener": "^3.0.0"
 	},
 	"peerDependencies": {
@@ -63,12 +62,12 @@
 		"@af/accessibility-testing": "workspace:^",
 		"@af/integration-testing": "workspace:^",
 		"@af/visual-regression": "workspace:^",
-		"@atlaskit/button": "^23.0.0",
+		"@atlaskit/button": "^23.2.0",
 		"@atlaskit/css": "^0.10.0",
 		"@atlaskit/docs": "^10.0.0",
-		"@atlaskit/icon": "^25.6.0",
-		"@atlaskit/link": "^3.1.0",
-		"@atlaskit/primitives": "^14.4.0",
+		"@atlaskit/icon": "^26.4.0",
+		"@atlaskit/link": "^3.2.0",
+		"@atlaskit/primitives": "^14.8.0",
 		"@atlaskit/section-message": "^8.2.0",
 		"@atlassian/ssr-tests": "^0.2.0",
 		"@testing-library/react": "^13.4.0",
@@ -107,6 +106,10 @@
 		},
 		"platform-tooltip-focus-visible": {
 			"type": "boolean"
+		},
+		"platform-component-visual-refresh": {
+			"type": "boolean",
+			"referenceOnly": true
 		}
 	}
 }