@atlaskit/tooltip 18.2.2 → 18.3.0

package/dist/cjs/Tooltip.js

@@ -32,7 +32,7 @@ var tooltipZIndex = _constants.layers.tooltip();
 var analyticsAttributes = {
   componentName: 'tooltip',
   packageName: "@atlaskit/tooltip",
-  packageVersion: "18.2.2"
+  packageVersion: "18.3.0"
 };
 
 // Inverts motion direction
@@ -46,7 +46,7 @@ var invertedDirection = {
 /**
  * Converts a Popper placement to it's general direction.
  *
- * @param position - Popper Placement value, e.g. 'top-start'
+ * @param placement - Popper Placement value, e.g. 'top-start'
  * @returns Popper Direction, e.g. 'top'
  */
 var getDirectionFromPlacement = function getDirectionFromPlacement(placement) {
@@ -78,7 +78,9 @@ function Tooltip(_ref) {
     hideTooltipOnMouseDown = _ref$hideTooltipOnMou === void 0 ? false : _ref$hideTooltipOnMou,
     analyticsContext = _ref.analyticsContext,
     _ref$strategy = _ref.strategy,
-    strategy = _ref$strategy === void 0 ? 'fixed' : _ref$strategy;
+    strategy = _ref$strategy === void 0 ? 'fixed' : _ref$strategy,
+    _ref$ignoreTooltipPoi = _ref.ignoreTooltipPointerEvents,
+    ignoreTooltipPointerEvents = _ref$ignoreTooltipPoi === void 0 ? false : _ref$ignoreTooltipPoi;
   var tooltipPosition = position === 'mouse' ? mousePosition : position;
   var onShowHandler = (0, _analyticsNext.usePlatformLeafSyntheticEventHandler)(_objectSpread({
     fn: onShow,
@@ -460,7 +462,9 @@ function Tooltip(_ref) {
          * and hide tooltips, including in VR snapshots
          **/,
         className: "Tooltip ".concat(className),
-        style: style,
+        style: _objectSpread(_objectSpread({}, style), ignoreTooltipPointerEvents && {
+          pointerEvents: 'none'
+        }),
         truncate: truncate,
         placement: tooltipPosition,
         testId: getReferenceElement() ? testId : testId && "".concat(testId, "--unresolved"),

package/dist/es2019/Tooltip.js

@@ -18,7 +18,7 @@ const tooltipZIndex = layers.tooltip();
 const analyticsAttributes = {
   componentName: 'tooltip',
   packageName: "@atlaskit/tooltip",
-  packageVersion: "18.2.2"
+  packageVersion: "18.3.0"
 };
 
 // Inverts motion direction
@@ -32,7 +32,7 @@ const invertedDirection = {
 /**
  * Converts a Popper placement to it's general direction.
  *
- * @param position - Popper Placement value, e.g. 'top-start'
+ * @param placement - Popper Placement value, e.g. 'top-start'
  * @returns Popper Direction, e.g. 'top'
  */
 const getDirectionFromPlacement = placement => placement.split('-')[0];
@@ -51,7 +51,8 @@ function Tooltip({
   hideTooltipOnClick = false,
   hideTooltipOnMouseDown = false,
   analyticsContext,
-  strategy = 'fixed'
+  strategy = 'fixed',
+  ignoreTooltipPointerEvents = false
 }) {
   const tooltipPosition = position === 'mouse' ? mousePosition : position;
   const onShowHandler = usePlatformLeafSyntheticEventHandler({
@@ -438,7 +439,12 @@ function Tooltip({
        * and hide tooltips, including in VR snapshots
        **/,
       className: `Tooltip ${className}`,
-      style: style,
+      style: {
+        ...style,
+        ...(ignoreTooltipPointerEvents && {
+          pointerEvents: 'none'
+        })
+      },
       truncate: truncate,
       placement: tooltipPosition,
       testId: getReferenceElement() ? testId : testId && `${testId}--unresolved`,

package/dist/esm/Tooltip.js

@@ -22,7 +22,7 @@ var tooltipZIndex = layers.tooltip();
 var analyticsAttributes = {
   componentName: 'tooltip',
   packageName: "@atlaskit/tooltip",
-  packageVersion: "18.2.2"
+  packageVersion: "18.3.0"
 };
 
 // Inverts motion direction
@@ -36,7 +36,7 @@ var invertedDirection = {
 /**
  * Converts a Popper placement to it's general direction.
  *
- * @param position - Popper Placement value, e.g. 'top-start'
+ * @param placement - Popper Placement value, e.g. 'top-start'
  * @returns Popper Direction, e.g. 'top'
  */
 var getDirectionFromPlacement = function getDirectionFromPlacement(placement) {
@@ -68,7 +68,9 @@ function Tooltip(_ref) {
     hideTooltipOnMouseDown = _ref$hideTooltipOnMou === void 0 ? false : _ref$hideTooltipOnMou,
     analyticsContext = _ref.analyticsContext,
     _ref$strategy = _ref.strategy,
-    strategy = _ref$strategy === void 0 ? 'fixed' : _ref$strategy;
+    strategy = _ref$strategy === void 0 ? 'fixed' : _ref$strategy,
+    _ref$ignoreTooltipPoi = _ref.ignoreTooltipPointerEvents,
+    ignoreTooltipPointerEvents = _ref$ignoreTooltipPoi === void 0 ? false : _ref$ignoreTooltipPoi;
   var tooltipPosition = position === 'mouse' ? mousePosition : position;
   var onShowHandler = usePlatformLeafSyntheticEventHandler(_objectSpread({
     fn: onShow,
@@ -450,7 +452,9 @@ function Tooltip(_ref) {
          * and hide tooltips, including in VR snapshots
          **/,
         className: "Tooltip ".concat(className),
-        style: style,
+        style: _objectSpread(_objectSpread({}, style), ignoreTooltipPointerEvents && {
+          pointerEvents: 'none'
+        }),
         truncate: truncate,
         placement: tooltipPosition,
         testId: getReferenceElement() ? testId : testId && "".concat(testId, "--unresolved"),

package/dist/types/Tooltip.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { TooltipProps } from './types';
-declare function Tooltip({ children, position, mousePosition, content, truncate, component: Container, tag: TargetContainer, testId, delay, onShow, onHide, hideTooltipOnClick, hideTooltipOnMouseDown, analyticsContext, strategy, }: TooltipProps): JSX.Element;
+import { type TooltipProps } from './types';
+declare function Tooltip({ children, position, mousePosition, content, truncate, component: Container, tag: TargetContainer, testId, delay, onShow, onHide, hideTooltipOnClick, hideTooltipOnMouseDown, analyticsContext, strategy, ignoreTooltipPointerEvents, }: TooltipProps): JSX.Element;
 declare namespace Tooltip {
     var displayName: string;
 }

package/dist/types/types.d.ts

@@ -34,6 +34,10 @@ export interface TooltipProps {
      * Time in milliseconds to wait before showing and hiding the tooltip. Defaults to 300.
      */
     delay?: number;
+    /**
+     * Adds `pointer-events: none` to the tooltip itself. Setting this to true will also prevent the tooltip from persisting when hovered.
+     */
+    ignoreTooltipPointerEvents?: boolean;
     /**
      * Hide the tooltip when the click event is triggered. Use this when the tooltip should be hidden if `onClick` react synthetic event
      * is triggered, which happens after `onMouseDown` event.
@@ -62,7 +66,7 @@ export interface TooltipProps {
      */
     onHide?: (analyticsEvent: UIAnalyticsEvent) => void;
     /**
-     * Where the tooltip should appear relative to its' target.
+     * Where the tooltip should appear relative to its target.
      * If set to `"mouse"`, the tooltip will display next to the mouse pointer instead.
      * Make sure to utilize the `mousePosition` if you want to customize where the tooltip will show in relation to the mouse.
      */

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

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { TooltipProps } from './types';
-declare function Tooltip({ children, position, mousePosition, content, truncate, component: Container, tag: TargetContainer, testId, delay, onShow, onHide, hideTooltipOnClick, hideTooltipOnMouseDown, analyticsContext, strategy, }: TooltipProps): JSX.Element;
+import { type TooltipProps } from './types';
+declare function Tooltip({ children, position, mousePosition, content, truncate, component: Container, tag: TargetContainer, testId, delay, onShow, onHide, hideTooltipOnClick, hideTooltipOnMouseDown, analyticsContext, strategy, ignoreTooltipPointerEvents, }: TooltipProps): JSX.Element;
 declare namespace Tooltip {
     var displayName: string;
 }

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

@@ -34,6 +34,10 @@ export interface TooltipProps {
      * Time in milliseconds to wait before showing and hiding the tooltip. Defaults to 300.
      */
     delay?: number;
+    /**
+     * Adds `pointer-events: none` to the tooltip itself. Setting this to true will also prevent the tooltip from persisting when hovered.
+     */
+    ignoreTooltipPointerEvents?: boolean;
     /**
      * Hide the tooltip when the click event is triggered. Use this when the tooltip should be hidden if `onClick` react synthetic event
      * is triggered, which happens after `onMouseDown` event.
@@ -62,7 +66,7 @@ export interface TooltipProps {
      */
     onHide?: (analyticsEvent: UIAnalyticsEvent) => void;
     /**
-     * Where the tooltip should appear relative to its' target.
+     * Where the tooltip should appear relative to its target.
      * If set to `"mouse"`, the tooltip will display next to the mouse pointer instead.
      * Make sure to utilize the `mousePosition` if you want to customize where the tooltip will show in relation to the mouse.
      */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/tooltip",
-  "version": "18.2.2",
+  "version": "18.3.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/"
@@ -48,7 +48,7 @@
     "@atlaskit/popper": "^5.5.0",
     "@atlaskit/portal": "^4.4.0",
     "@atlaskit/theme": "^12.7.0",
-    "@atlaskit/tokens": "^1.43.0",
+    "@atlaskit/tokens": "^1.44.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1",
     "bind-event-listener": "^3.0.0",