@instructure/ui-breadcrumb 8.47.1 → 8.47.2-snapshot-2

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [8.47.2-snapshot-2](https://github.com/instructure/instructure-ui/compare/v8.47.1...v8.47.2-snapshot-2) (2023-11-09)
+
+
+### Features
+
+* **ui-breadcrumb,ui-link:** add onMouseEnter prop ([a52f836](https://github.com/instructure/instructure-ui/commit/a52f836b48bfbd99763e9f5381675e8eabaa22c5))
+
+
+
+
+
 ## [8.47.1](https://github.com/instructure/instructure-ui/compare/v8.47.0...v8.47.1) (2023-11-06)
 
 **Note:** Version bump only for package @instructure/ui-breadcrumb

package/es/Breadcrumb/BreadcrumbLink/__new-tests__/BreadcrumbLink.test.js

@@ -57,6 +57,16 @@ describe('<BreadcrumbLink />', () => {
     fireEvent.click(button);
     expect(onClick).toHaveBeenCalledTimes(1);
   });
+  it('should respond to mouseEnter event when provided with onMouseEnter prop', () => {
+    const onMouseEnter = jest.fn();
+    render( /*#__PURE__*/React.createElement(BreadcrumbLink, {
+      onMouseEnter: onMouseEnter,
+      href: TEST_LINK
+    }, TEST_TEXT_01));
+    const link = screen.getByRole('link');
+    fireEvent.mouseEnter(link);
+    expect(onMouseEnter).toHaveBeenCalledTimes(1);
+  });
   it('should allow to prop to pass through', () => {
     const _render = render(_BreadcrumbLink2 || (_BreadcrumbLink2 = /*#__PURE__*/React.createElement(BreadcrumbLink, {
         to: TEST_TO

package/es/Breadcrumb/BreadcrumbLink/index.js

@@ -49,13 +49,15 @@ let BreadcrumbLink = (_dec = testable(), _dec(_class = (_class2 = class Breadcru
       href = _this$props.href,
       renderIcon = _this$props.renderIcon,
       iconPlacement = _this$props.iconPlacement,
-      onClick = _this$props.onClick;
+      onClick = _this$props.onClick,
+      onMouseEnter = _this$props.onMouseEnter;
     const props = omitProps(this.props, BreadcrumbLink.allowedProps);
     return /*#__PURE__*/React.createElement(Link, Object.assign({}, props, {
       href: href,
       renderIcon: renderIcon,
       iconPlacement: iconPlacement,
       onClick: onClick,
+      onMouseEnter: onMouseEnter,
       isWithinText: false,
       elementRef: this.handleRef
     }), /*#__PURE__*/React.createElement(TruncateText, null, children));

package/es/Breadcrumb/BreadcrumbLink/props.js

@@ -27,9 +27,10 @@ const propTypes = {
   children: PropTypes.node.isRequired,
   href: PropTypes.string,
   onClick: PropTypes.func,
+  onMouseEnter: PropTypes.func,
   size: PropTypes.oneOf(['small', 'medium', 'large']),
   renderIcon: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
   iconPlacement: PropTypes.oneOf(['start', 'end'])
 };
-const allowedProps = ['children', 'href', 'iconPlacement', 'onClick', 'renderIcon', 'size'];
+const allowedProps = ['children', 'href', 'iconPlacement', 'onClick', 'onMouseEnter', 'renderIcon', 'size'];
 export { propTypes, allowedProps };

package/lib/Breadcrumb/BreadcrumbLink/__new-tests__/BreadcrumbLink.test.js

@@ -59,6 +59,16 @@ describe('<BreadcrumbLink />', () => {
     _react2.fireEvent.click(button);
     expect(onClick).toHaveBeenCalledTimes(1);
   });
+  it('should respond to mouseEnter event when provided with onMouseEnter prop', () => {
+    const onMouseEnter = jest.fn();
+    (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_index.BreadcrumbLink, {
+      onMouseEnter: onMouseEnter,
+      href: TEST_LINK
+    }, TEST_TEXT_01));
+    const link = _react2.screen.getByRole('link');
+    _react2.fireEvent.mouseEnter(link);
+    expect(onMouseEnter).toHaveBeenCalledTimes(1);
+  });
   it('should allow to prop to pass through', () => {
     const _render = (0, _react2.render)(_BreadcrumbLink2 || (_BreadcrumbLink2 = /*#__PURE__*/_react.default.createElement(_index.BreadcrumbLink, {
         to: TEST_TO

package/lib/Breadcrumb/BreadcrumbLink/index.js

@@ -55,13 +55,15 @@ let BreadcrumbLink = exports.BreadcrumbLink = (_dec = (0, _testable.testable)(),
       href = _this$props.href,
       renderIcon = _this$props.renderIcon,
       iconPlacement = _this$props.iconPlacement,
-      onClick = _this$props.onClick;
+      onClick = _this$props.onClick,
+      onMouseEnter = _this$props.onMouseEnter;
     const props = (0, _omitProps.omitProps)(this.props, BreadcrumbLink.allowedProps);
     return /*#__PURE__*/_react.default.createElement(_Link.Link, Object.assign({}, props, {
       href: href,
       renderIcon: renderIcon,
       iconPlacement: iconPlacement,
       onClick: onClick,
+      onMouseEnter: onMouseEnter,
       isWithinText: false,
       elementRef: this.handleRef
     }), /*#__PURE__*/_react.default.createElement(_TruncateText.TruncateText, null, children));

package/lib/Breadcrumb/BreadcrumbLink/props.js

@@ -34,8 +34,9 @@ const propTypes = exports.propTypes = {
   children: _propTypes.default.node.isRequired,
   href: _propTypes.default.string,
   onClick: _propTypes.default.func,
+  onMouseEnter: _propTypes.default.func,
   size: _propTypes.default.oneOf(['small', 'medium', 'large']),
   renderIcon: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func]),
   iconPlacement: _propTypes.default.oneOf(['start', 'end'])
 };
-const allowedProps = exports.allowedProps = ['children', 'href', 'iconPlacement', 'onClick', 'renderIcon', 'size'];
+const allowedProps = exports.allowedProps = ['children', 'href', 'iconPlacement', 'onClick', 'onMouseEnter', 'renderIcon', 'size'];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-breadcrumb",
-  "version": "8.47.1",
+  "version": "8.47.2-snapshot-2",
   "description": "A breadcrumb component",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -23,25 +23,25 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@instructure/ui-axe-check": "8.47.1",
-    "@instructure/ui-babel-preset": "8.47.1",
-    "@instructure/ui-scripts": "8.47.1",
-    "@instructure/ui-themes": "8.47.1",
+    "@instructure/ui-axe-check": "8.47.2-snapshot-2",
+    "@instructure/ui-babel-preset": "8.47.2-snapshot-2",
+    "@instructure/ui-scripts": "8.47.2-snapshot-2",
+    "@instructure/ui-themes": "8.47.2-snapshot-2",
     "@testing-library/jest-dom": "^6.1.4",
     "@testing-library/react": "^14.0.0"
   },
   "dependencies": {
     "@babel/runtime": "^7.23.2",
-    "@instructure/emotion": "8.47.1",
-    "@instructure/shared-types": "8.47.1",
-    "@instructure/ui-icons": "8.47.1",
-    "@instructure/ui-link": "8.47.1",
-    "@instructure/ui-prop-types": "8.47.1",
-    "@instructure/ui-react-utils": "8.47.1",
-    "@instructure/ui-testable": "8.47.1",
-    "@instructure/ui-truncate-text": "8.47.1",
-    "@instructure/ui-utils": "8.47.1",
-    "@instructure/ui-view": "8.47.1",
+    "@instructure/emotion": "8.47.2-snapshot-2",
+    "@instructure/shared-types": "8.47.2-snapshot-2",
+    "@instructure/ui-icons": "8.47.2-snapshot-2",
+    "@instructure/ui-link": "8.47.2-snapshot-2",
+    "@instructure/ui-prop-types": "8.47.2-snapshot-2",
+    "@instructure/ui-react-utils": "8.47.2-snapshot-2",
+    "@instructure/ui-testable": "8.47.2-snapshot-2",
+    "@instructure/ui-truncate-text": "8.47.2-snapshot-2",
+    "@instructure/ui-utils": "8.47.2-snapshot-2",
+    "@instructure/ui-view": "8.47.2-snapshot-2",
     "prop-types": "^15.8.1"
   },
   "peerDependencies": {

package/src/Breadcrumb/BreadcrumbLink/__new-tests__/BreadcrumbLink.test.tsx

@@ -63,6 +63,20 @@ describe('<BreadcrumbLink />', () => {
     expect(onClick).toHaveBeenCalledTimes(1)
   })
 
+  it('should respond to mouseEnter event when provided with onMouseEnter prop', () => {
+    const onMouseEnter = jest.fn()
+
+    render(
+      <BreadcrumbLink onMouseEnter={onMouseEnter} href={TEST_LINK}>
+        {TEST_TEXT_01}
+      </BreadcrumbLink>
+    )
+    const link = screen.getByRole('link')
+    fireEvent.mouseEnter(link)
+
+    expect(onMouseEnter).toHaveBeenCalledTimes(1)
+  })
+
   it('should allow to prop to pass through', () => {
     const { container } = render(
       <BreadcrumbLink to={TEST_TO}>{TEST_TEXT_01}</BreadcrumbLink>

package/src/Breadcrumb/BreadcrumbLink/index.tsx

@@ -54,7 +54,8 @@ class BreadcrumbLink extends Component<BreadcrumbLinkProps> {
   }
 
   render() {
-    const { children, href, renderIcon, iconPlacement, onClick } = this.props
+    const { children, href, renderIcon, iconPlacement, onClick, onMouseEnter } =
+      this.props
 
     const props = omitProps(this.props, BreadcrumbLink.allowedProps)
 
@@ -65,6 +66,7 @@ class BreadcrumbLink extends Component<BreadcrumbLinkProps> {
         renderIcon={renderIcon}
         iconPlacement={iconPlacement}
         onClick={onClick}
+        onMouseEnter={onMouseEnter}
         isWithinText={false}
         elementRef={this.handleRef}
       >

package/src/Breadcrumb/BreadcrumbLink/props.ts

@@ -47,6 +47,10 @@ type BreadcrumbLinkOwnProps = {
    * If the Breadcrumb.Link has an onClick prop (and no href), it will render as a button
    */
   onClick?: (event: React.MouseEvent<ViewOwnProps, MouseEvent>) => void
+  /**
+   * Fires when the Link is hovered
+   */
+  onMouseEnter?: (event: React.MouseEvent<ViewOwnProps, MouseEvent>) => void
   /**
    * Sets the font-size of the breadcrumb text
    */
@@ -82,6 +86,7 @@ const propTypes: PropValidators<PropKeys> = {
   children: PropTypes.node.isRequired,
   href: PropTypes.string,
   onClick: PropTypes.func,
+  onMouseEnter: PropTypes.func,
   size: PropTypes.oneOf(['small', 'medium', 'large']),
   renderIcon: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
   iconPlacement: PropTypes.oneOf(['start', 'end'])
@@ -92,6 +97,7 @@ const allowedProps: AllowedPropKeys = [
   'href',
   'iconPlacement',
   'onClick',
+  'onMouseEnter',
   'renderIcon',
   'size'
 ]