@decisiv/ui-components 2.0.1-alpha.195 → 2.0.1-alpha.196

package/lib/components/JumpTo/JumpToMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"JumpToMenu.d.ts","sourceRoot":"","sources":["../../../src/components/JumpTo/JumpToMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyD,MAAM,OAAO,CAAC;AAc9E,OAAO,EAAc,WAAW,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAkI7D,QAAA,MAAM,iBAAiB,+EAAyB,CAAC;AAKjD,eAAe,iBAAiB,CAAC"}
+{"version":3,"file":"JumpToMenu.d.ts","sourceRoot":"","sources":["../../../src/components/JumpTo/JumpToMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAON,MAAM,OAAO,CAAC;AAcf,OAAO,EAAc,WAAW,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AA4J7D,QAAA,MAAM,iBAAiB,+EAAyB,CAAC;AAKjD,eAAe,iBAAiB,CAAC"}

package/lib/components/JumpTo/JumpToMenu.js

@@ -75,7 +75,8 @@ function JumpToMenu(props, forwardedRef) {
     hide: function hide() {},
     isVisible: false,
     show: function show() {},
-    toggle: function toggle() {}
+    toggle: function toggle() {},
+    contentNode: null
   }),
       _useState4 = _slicedToArray(_useState3, 2),
       popover = _useState4[0],
@@ -113,6 +114,7 @@ function JumpToMenu(props, forwardedRef) {
         selector = _ref2.selector;
     itemSelected.current = true;
     popover.hide();
+    setIsPopoverVisible(false);
     selector && (0, _utils.jumpToSelector)(selector, globalOffset, itemOffset);
   };
 
@@ -124,10 +126,27 @@ function JumpToMenu(props, forwardedRef) {
   }, []);
   var handleMouseEnter = (0, _react.useCallback)(function () {
     setIsPopoverVisible(true);
-  }, [openOnMouseHover, popover]);
+
+    if (popover && popover.contentNode) {
+      (0, _focusWithoutScrolling.default)(popover.contentNode);
+    }
+  }, [openOnMouseHover, popover, popover && popover.contentNode]);
   var handleMouseLeave = (0, _react.useCallback)(function () {
     setIsPopoverVisible(false);
   }, [openOnMouseHover, popover]);
+  var handleMouseEnterButton = (0, _react.useCallback)(function () {
+    if (openOnMouseHover) {
+      buttonRef && buttonRef.current && (0, _focusWithoutScrolling.default)(buttonRef.current);
+      setIsPopoverVisible(true);
+
+      if (popover && popover.contentNode) {
+        (0, _focusWithoutScrolling.default)(popover.contentNode);
+      }
+    }
+  }, [openOnMouseHover, buttonRef, popover && popover.contentNode]);
+  (0, _react.useEffect)(function () {
+    if (!debouncedVisible) itemSelected.current = false;
+  }, [debouncedVisible, itemSelected.current]);
   return _react.default.createElement(_react.default.Fragment, null, _react.default.createElement(_Button.default, _extends({
     icon: popover.isVisible ? _ChevronUp.default : _ChevronDown.default,
     iconPosition: "right",
@@ -137,7 +156,7 @@ function JumpToMenu(props, forwardedRef) {
     size: "small",
     text: translate(label, 'jumpTo.menuLabel'),
     variant: "ghost",
-    onMouseEnter: handleMouseEnter,
+    onMouseEnter: handleMouseEnterButton,
     onMouseLeave: handleMouseLeave
   }, popover.ariaAttributes)), _react.default.createElement(_Popover.default, {
     contentRole: "menu",
@@ -148,7 +167,7 @@ function JumpToMenu(props, forwardedRef) {
     zIndex: zIndex,
     onShow: onShow,
     onHide: onHide,
-    visible: openOnMouseHover ? debouncedVisible : undefined,
+    visible: openOnMouseHover ? debouncedVisible && !itemSelected.current : undefined,
     onMouseEnter: handleMouseEnter,
     onMouseLeave: handleMouseLeave
   }, _react.default.createElement(_Menu.default, _extends({

package/lib/components/JumpTo/index.test.js

@@ -124,4 +124,88 @@ describe('JumpTo', function () {
       expect(container.children[0].childElementCount).toEqual(0);
     });
   });
+  describe('with openOnMouseHover', function () {
+    it('renders list on hover', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
+      var label, items, _renderJumpTo4, baseElement, getByText;
+
+      return regeneratorRuntime.wrap(function _callee2$(_context2) {
+        while (1) {
+          switch (_context2.prev = _context2.next) {
+            case 0:
+              label = 'TEST LABEL';
+              items = [{
+                label: 'First Item',
+                selector: '#item-1'
+              }, {
+                label: 'Second Item',
+                selector: '#item-2'
+              }];
+              _renderJumpTo4 = renderJumpTo({
+                label: label,
+                items: items,
+                openOnMouseHover: true,
+                variant: 'menu'
+              }), baseElement = _renderJumpTo4.baseElement, getByText = _renderJumpTo4.getByText;
+              (0, _react2.act)(function () {
+                _react2.fireEvent.mouseEnter(getByText(label));
+              });
+              _context2.next = 6;
+              return (0, _react2.waitForElement)(function () {
+                return getByText(items[0].label);
+              });
+
+            case 6:
+              expect(baseElement).toMatchSnapshot();
+
+            case 7:
+            case "end":
+              return _context2.stop();
+          }
+        }
+      }, _callee2);
+    })));
+    it('closes popover after selecting an item', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3() {
+      var label, items, _renderJumpTo5, baseElement, getByText, queryByText;
+
+      return regeneratorRuntime.wrap(function _callee3$(_context3) {
+        while (1) {
+          switch (_context3.prev = _context3.next) {
+            case 0:
+              label = 'TEST LABEL';
+              items = [{
+                label: 'First Item',
+                selector: '#item-1'
+              }, {
+                label: 'Second Item',
+                selector: '#item-2'
+              }];
+              _renderJumpTo5 = renderJumpTo({
+                label: label,
+                items: items,
+                openOnMouseHover: true,
+                variant: 'menu'
+              }), baseElement = _renderJumpTo5.baseElement, getByText = _renderJumpTo5.getByText, queryByText = _renderJumpTo5.queryByText;
+              (0, _react2.act)(function () {
+                _react2.fireEvent.mouseEnter(getByText(label));
+              });
+              _context3.next = 6;
+              return (0, _react2.waitForElement)(function () {
+                return getByText(items[0].label);
+              });
+
+            case 6:
+              (0, _react2.act)(function () {
+                _react2.fireEvent.click(getByText(items[0].label));
+              });
+              expect(queryByText(items[0].label)).toBeNull();
+              expect(baseElement).toMatchSnapshot();
+
+            case 9:
+            case "end":
+              return _context3.stop();
+          }
+        }
+      }, _callee3);
+    })));
+  });
 });

package/lib/components/Popover/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Popover/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAUN,MAAM,OAAO,CAAC;AAWf,OAAc,EAAE,WAAW,EAAE,WAAW,IAAI,eAAe,EAAE,MAAM,SAAS,CAAC;AAE7E,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACzC,OAAO,EACL,UAAU,IAAI,cAAc,EAC5B,WAAW,IAAI,eAAe,EAE9B,SAAS,IAAI,aAAa,EAC1B,YAAY,IAAI,SAAS,EACzB,MAAM,IAAI,aAAa,EACvB,cAAc,IAAI,kBAAkB,EACpC,mBAAmB,IAAI,uBAAuB,EAE/C,MAAM,SAAS,CAAC;AAGjB,oBAAY,UAAU,GAAG,cAAc,CAAC;AACxC,oBAAY,WAAW,GAAG,eAAe,CAAC;AAC1C,oBAAY,WAAW,GAAG,eAAe,CAAC;AAC1C,oBAAY,SAAS,GAAG,aAAa,CAAC;AACtC,oBAAY,YAAY,GAAG,SAAS,CAAC;AACrC,oBAAY,MAAM,GAAG,aAAa,CAAC;AACnC,oBAAY,cAAc,GAAG,kBAAkB,CAAC;AAChD,oBAAY,mBAAmB,GAAG,uBAAuB,CAAC;AAE1D,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,CAAC;AA+PnC,QAAA,MAAM,cAAc,mFAAsB,CAAC;AAkD3C,eAAe,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Popover/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAUN,MAAM,OAAO,CAAC;AAWf,OAAc,EAAE,WAAW,EAAE,WAAW,IAAI,eAAe,EAAE,MAAM,SAAS,CAAC;AAE7E,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACzC,OAAO,EACL,UAAU,IAAI,cAAc,EAC5B,WAAW,IAAI,eAAe,EAE9B,SAAS,IAAI,aAAa,EAC1B,YAAY,IAAI,SAAS,EACzB,MAAM,IAAI,aAAa,EACvB,cAAc,IAAI,kBAAkB,EACpC,mBAAmB,IAAI,uBAAuB,EAE/C,MAAM,SAAS,CAAC;AAGjB,oBAAY,UAAU,GAAG,cAAc,CAAC;AACxC,oBAAY,WAAW,GAAG,eAAe,CAAC;AAC1C,oBAAY,WAAW,GAAG,eAAe,CAAC;AAC1C,oBAAY,SAAS,GAAG,aAAa,CAAC;AACtC,oBAAY,YAAY,GAAG,SAAS,CAAC;AACrC,oBAAY,MAAM,GAAG,aAAa,CAAC;AACnC,oBAAY,cAAc,GAAG,kBAAkB,CAAC;AAChD,oBAAY,mBAAmB,GAAG,uBAAuB,CAAC;AAE1D,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,CAAC;AAyQnC,QAAA,MAAM,cAAc,mFAAsB,CAAC;AAkD3C,eAAe,cAAc,CAAC"}

package/lib/components/Popover/index.js

@@ -199,9 +199,10 @@ var Popover = function Popover(props, instanceRef) {
       isVisible: isVisible,
       show: show,
       toggle: toggle,
-      targetNode: targetNode
+      targetNode: targetNode,
+      contentNode: contentRef.current
     });
-  }, [instanceRef, ariaAttributes, hide, isVisible, show, toggle, targetNode]); // React to changes to the `visible` prop if we are a controlled component
+  }, [instanceRef, ariaAttributes, hide, isVisible, show, toggle, targetNode, contentRef && contentRef.current]); // React to changes to the `visible` prop if we are a controlled component
 
   (0, _react.useEffect)(function () {
     return setIsVisible(visible !== undefined ? visible : isVisible);

package/lib/components/Popover/types.d.ts

@@ -18,6 +18,7 @@ export interface InstanceRef {
     toggle: VisibilityAction;
     isVisible: boolean;
     targetNode?: HTMLElement | null;
+    contentNode?: HTMLDivElement | null;
 }
 export interface TargetRendererProps {
     ref: RefHandler;

package/lib/components/Popover/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Popover/types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Popover/types.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@decisiv/ui-components",
-  "version": "2.0.1-alpha.195+94c2fc9",
+  "version": "2.0.1-alpha.196+9518bb9",
   "description": "Decisiv's design system React components",
   "author": "Decisiv UI Development Team",
   "license": "MIT",
@@ -71,5 +71,5 @@
     "access": "public"
   },
   "private": false,
-  "gitHead": "94c2fc9d29248d1fa4253badcf49e68c317fba00"
+  "gitHead": "9518bb958af5cb4a795b7feddcaf1695d75ac8ba"
 }