@pingux/astro 2.111.0-alpha.3 → 2.111.0-alpha.4

package/lib/cjs/components/IconButton/IconButton.js

@@ -27,7 +27,7 @@ var _hooks = require("../../hooks");
 var _pendoID = require("../../utils/devUtils/constants/pendoID");
 var _TooltipTrigger = _interopRequireWildcard(require("../TooltipTrigger"));
 var _react2 = require("@emotion/react");
-var _excluded = ["children", "className", "title", "variant", "onBlur", "onFocus", "onHoverChange", "onHoverEnd", "onHoverStart", "onKeyDown", "onKeyUp", "onPress", "onPressEnd", "onPressStart", "onPressChange", "onPressUp", "isDisabled"];
+var _excluded = ["children", "className", "tooltipTriggerProps", "title", "variant", "onBlur", "onFocus", "onHoverChange", "onHoverEnd", "onHoverStart", "onKeyDown", "onKeyUp", "onPress", "onPressEnd", "onPressStart", "onPressChange", "onPressUp", "isDisabled"];
 function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 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; }
 function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -36,6 +36,7 @@ var displayName = 'IconButton';
 var IconButton = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var children = props.children,
     className = props.className,
+    tooltipTriggerProps = props.tooltipTriggerProps,
     title = props.title,
     variant = props.variant,
     onBlur = props.onBlur,
@@ -112,9 +113,9 @@ var IconButton = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     onPointerOver: hoverProps.onPointerEnter
   }, children));
   if (title) {
-    return (0, _react2.jsx)(_TooltipTrigger["default"], {
+    return (0, _react2.jsx)(_TooltipTrigger["default"], (0, _extends2["default"])({
       isDisabled: !title
-    }, button, title && (0, _react2.jsx)(_TooltipTrigger.Tooltip, null, title));
+    }, tooltipTriggerProps), button, title && (0, _react2.jsx)(_TooltipTrigger.Tooltip, null, title));
   }
   return button;
 });

package/lib/cjs/components/IconButton/IconButton.test.js

@@ -105,6 +105,18 @@ test('tooltip is shown on focus when the prop is passed and not show by default'
   _userEvent["default"].tab();
   expect(_testWrapper.screen.queryByRole('tooltip')).toBeInTheDocument();
 });
+test('tooltipTrigger applies nested props correctly', function () {
+  getComponent({
+    title: 'Test Tooltip',
+    tooltipTriggerProps: {
+      direction: 'right'
+    }
+  });
+  expect(_testWrapper.screen.queryByRole('tooltip')).not.toBeInTheDocument();
+  _userEvent["default"].tab();
+  expect(_testWrapper.screen.queryByRole('tooltip')).toBeInTheDocument();
+  expect(_testWrapper.screen.queryByTestId('popover-container')).toHaveClass('is-right');
+});
 test('tooltip is shown on hover when the prop is passed and not show by default', function () {
   getComponent({
     title: 'Test Tooltip'

package/lib/cjs/types/iconButton.d.ts

@@ -2,6 +2,7 @@ import { IconButtonProps as ThemeUIIconButtonProps } from 'theme-ui';
 import { TestingAttributes } from './shared/test';
 import { IconTypeExtended } from './icon';
 import { HoverProps, IconSize, PressProps } from './shared';
+import { TooltipTriggerProps } from './tooltipTrigger';
 export interface IconButtonProps extends ThemeUIIconButtonProps, TestingAttributes, PressProps, HoverProps {
     /** The styling variation of the element. */
     variant?: string | undefined;
@@ -19,4 +20,5 @@ export interface IconButtonProps extends ThemeUIIconButtonProps, TestingAttribut
     size?: IconSize;
     isRow?: boolean;
     'aria-controls'?: string | undefined;
+    tooltipTriggerProps?: TooltipTriggerProps;
 }

package/lib/components/IconButton/IconButton.js

@@ -9,7 +9,7 @@ import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object
 import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
 import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
-var _excluded = ["children", "className", "title", "variant", "onBlur", "onFocus", "onHoverChange", "onHoverEnd", "onHoverStart", "onKeyDown", "onKeyUp", "onPress", "onPressEnd", "onPressStart", "onPressChange", "onPressUp", "isDisabled"];
+var _excluded = ["children", "className", "tooltipTriggerProps", "title", "variant", "onBlur", "onFocus", "onHoverChange", "onHoverEnd", "onHoverStart", "onKeyDown", "onKeyUp", "onPress", "onPressEnd", "onPressStart", "onPressChange", "onPressUp", "isDisabled"];
 function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
 import React, { forwardRef, useContext, useImperativeHandle, useRef } from 'react';
@@ -25,6 +25,7 @@ var displayName = 'IconButton';
 var IconButton = /*#__PURE__*/forwardRef(function (props, ref) {
   var children = props.children,
     className = props.className,
+    tooltipTriggerProps = props.tooltipTriggerProps,
     title = props.title,
     variant = props.variant,
     onBlur = props.onBlur,
@@ -101,9 +102,9 @@ var IconButton = /*#__PURE__*/forwardRef(function (props, ref) {
     onPointerOver: hoverProps.onPointerEnter
   }, children));
   if (title) {
-    return ___EmotionJSX(TooltipTrigger, {
+    return ___EmotionJSX(TooltipTrigger, _extends({
       isDisabled: !title
-    }, button, title && ___EmotionJSX(Tooltip, null, title));
+    }, tooltipTriggerProps), button, title && ___EmotionJSX(Tooltip, null, title));
   }
   return button;
 });

package/lib/components/IconButton/IconButton.test.js

@@ -102,6 +102,18 @@ test('tooltip is shown on focus when the prop is passed and not show by default'
   userEvent.tab();
   expect(screen.queryByRole('tooltip')).toBeInTheDocument();
 });
+test('tooltipTrigger applies nested props correctly', function () {
+  getComponent({
+    title: 'Test Tooltip',
+    tooltipTriggerProps: {
+      direction: 'right'
+    }
+  });
+  expect(screen.queryByRole('tooltip')).not.toBeInTheDocument();
+  userEvent.tab();
+  expect(screen.queryByRole('tooltip')).toBeInTheDocument();
+  expect(screen.queryByTestId('popover-container')).toHaveClass('is-right');
+});
 test('tooltip is shown on hover when the prop is passed and not show by default', function () {
   getComponent({
     title: 'Test Tooltip'

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pingux/astro",
-  "version": "2.111.0-alpha.3",
+  "version": "2.111.0-alpha.4",
   "description": "React component library for Ping Identity's design system",
   "repository": {
     "type": "git",