@decisiv/ui-components 2.0.1-alpha.213 → 2.0.1-alpha.215

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DropdownList/index.tsx"],"names":[],"mappings":";AAgBA,OAAO,EACL,QAAQ,IAAI,YAAY,EACxB,MAAM,IAAI,UAAU,EAErB,MAAM,+BAA+B,CAAC;AAEvC,OAAO,KAAK,EAAE,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAIlD,OAAO,EACL,YAAY,IAAI,oBAAoB,EACpC,gBAAgB,EAChB,MAAM,IAAI,kBAAkB,EAC5B,KAAK,IAAI,iBAAiB,GAC3B,CAAC;AAEF,oBAAY,KAAK,GAAG,gBAAgB,EAAE,CAAC;AACvC,oBAAY,QAAQ,GAAG,YAAY,CAAC;AACpC,oBAAY,MAAM,GAAG,UAAU,CAAC;AAEhC,iBAAS,YAAY,CAAC,KAAK,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CA+L/C;kBA/LQ,YAAY;;;;;;;;AAuNrB,eAAe,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DropdownList/index.tsx"],"names":[],"mappings":";AAgBA,OAAO,EACL,QAAQ,IAAI,YAAY,EACxB,MAAM,IAAI,UAAU,EAErB,MAAM,+BAA+B,CAAC;AAEvC,OAAO,KAAK,EAAE,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAIlD,OAAO,EACL,YAAY,IAAI,oBAAoB,EACpC,gBAAgB,EAChB,MAAM,IAAI,kBAAkB,EAC5B,KAAK,IAAI,iBAAiB,GAC3B,CAAC;AAEF,oBAAY,KAAK,GAAG,gBAAgB,EAAE,CAAC;AACvC,oBAAY,QAAQ,GAAG,YAAY,CAAC;AACpC,oBAAY,MAAM,GAAG,UAAU,CAAC;AAEhC,iBAAS,YAAY,CAAC,KAAK,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,CA0M/C;kBA1MQ,YAAY;;;;;;;;AAkOrB,eAAe,YAAY,CAAC"}

package/lib/components/DropdownList/index.js

@@ -95,7 +95,8 @@ function DropdownList(props) {
       maxHeight = props.maxHeight,
       maxWidth = props.maxWidth,
       minWidth = props.minWidth,
-      rest = _objectWithoutProperties(props, ["actions", "borderRadius", "containerSelector", "defaultSelectedIds", "defaultVisible", "defaultFooter", "focusOnShowing", "listRef", "onChange", "onHide", "onShow", "placement", "selectedIds", "showArrow", "target", "visible", "zIndex", "PanelComponent", "maxHeight", "maxWidth", "minWidth"]); // Use a ref callback to get more control over re-rendering when a ref is stored.
+      multiple = props.multiple,
+      rest = _objectWithoutProperties(props, ["actions", "borderRadius", "containerSelector", "defaultSelectedIds", "defaultVisible", "defaultFooter", "focusOnShowing", "listRef", "onChange", "onHide", "onShow", "placement", "selectedIds", "showArrow", "target", "visible", "zIndex", "PanelComponent", "maxHeight", "maxWidth", "minWidth", "multiple"]); // Use a ref callback to get more control over re-rendering when a ref is stored.
   // Specifically, the scroll to selected item on first render of dropdown requires this.
 
 
@@ -159,7 +160,12 @@ function DropdownList(props) {
   var handleOnChange = (0, _react.useCallback)(function (selection) {
     onChange && onChange(Array.isArray(selection) ? selection : [selection]);
     defaultFooter && setSelected(selection) && setSaved(selection);
-  }, [onChange, setSelected, setSaved, defaultFooter]);
+
+    if (!multiple) {
+      setShowing(false);
+      popRef && popRef.current && popRef.current.hide() && popRef.current.targetNode && popRef.current.targetNode.focus();
+    }
+  }, [onChange, setSelected, setSaved, defaultFooter, setShowing]);
   var handleOnApply = (0, _react.useCallback)(function () {
     setSaved(selected);
     popRef && popRef.current && popRef.current.hide();
@@ -227,7 +233,8 @@ function DropdownList(props) {
     onKeyDown: onKeyDown,
     maxHeight: maxHeight,
     maxWidth: maxWidth,
-    minWidth: minWidth
+    minWidth: minWidth,
+    multiple: multiple
   }, rest)))));
 }
 

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

@@ -199,7 +199,7 @@ describe('DropdownList', function () {
         expect(onChange).toHaveBeenCalledWith([item0Id]);
         expect(baseElement).toMatchSnapshot();
       });
-      it('does not automatically hide the options', function () {
+      it('automatically hide the options', function () {
         var _render7 = render(_react.default.createElement(_.default, defaultProps)),
             baseElement = _render7.baseElement,
             getByText = _render7.getByText;
@@ -208,38 +208,19 @@ describe('DropdownList', function () {
 
         _react2.fireEvent.click((0, _react2.getByText)(baseElement, item0Label));
 
-        expect((0, _react2.queryByText)(baseElement, item0Label)).toBeTruthy();
-      });
-      it('does not allow multiple selections', function () {
-        var onChange = jest.fn();
-
-        var _render8 = render(_react.default.createElement(_.default, _extends({}, defaultProps, {
-          onChange: onChange
-        }))),
-            baseElement = _render8.baseElement,
-            getByText = _render8.getByText;
-
-        _react2.fireEvent.click(getByText(targetButtonText));
-
-        _react2.fireEvent.click((0, _react2.getByText)(baseElement, item0Label));
-
-        expect(onChange).toHaveBeenCalledWith([item0Id]);
-
-        _react2.fireEvent.click((0, _react2.getByText)(baseElement, item2Label));
-
-        expect(onChange).toHaveBeenCalledWith([item2Id]);
+        expect((0, _react2.queryByText)(baseElement, item0Label)).toBeFalsy();
       });
     });
     describe('multiple options', function () {
       it('calls the onChange prop with the selection ids', function () {
         var onChange = jest.fn();
 
-        var _render9 = render(_react.default.createElement(_.default, _extends({}, defaultProps, {
+        var _render8 = render(_react.default.createElement(_.default, _extends({}, defaultProps, {
           onChange: onChange,
           multiple: true
         }))),
-            baseElement = _render9.baseElement,
-            getByText = _render9.getByText;
+            baseElement = _render8.baseElement,
+            getByText = _render8.getByText;
 
         _react2.fireEvent.click(getByText(targetButtonText));
 
@@ -251,11 +232,11 @@ describe('DropdownList', function () {
         expect(baseElement).toMatchSnapshot();
       });
       it('does not automatically hide the options', function () {
-        var _render10 = render(_react.default.createElement(_.default, _extends({}, defaultProps, {
+        var _render9 = render(_react.default.createElement(_.default, _extends({}, defaultProps, {
           multiple: true
         }))),
-            baseElement = _render10.baseElement,
-            getByText = _render10.getByText;
+            baseElement = _render9.baseElement,
+            getByText = _render9.getByText;
 
         _react2.fireEvent.click(getByText(targetButtonText));
 

package/lib/components/Modal/components.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/components.tsx"],"names":[],"mappings":";AAcA,eAAO,MAAM,OAAO;;SASnB,CAAC;AAEF,eAAO,MAAM,IAAI;;;;SAgDhB,CAAC;AAEF,eAAO,MAAM,UAAU;;;SA4BtB,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mBAAoD,CAAC;AAExE,eAAO,MAAM,oBAAoB,oEAIhC,CAAC;AAEF,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;SAKnB,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;SAoBlB,CAAC;AAEF,eAAO,MAAM,aAAa,sGAkBzB,CAAC"}
+{"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/components.tsx"],"names":[],"mappings":";AAcA,eAAO,MAAM,OAAO;;SASnB,CAAC;AAEF,eAAO,MAAM,IAAI;;;;SAuBhB,CAAC;AAEF,eAAO,MAAM,UAAU;;;SA4BtB,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mBAAoD,CAAC;AAExE,eAAO,MAAM,oBAAoB,oEAIhC,CAAC;AAEF,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;SAKnB,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;SAmBlB,CAAC;AAEF,eAAO,MAAM,aAAa,sGAkBzB,CAAC"}

package/lib/components/Modal/components.js

@@ -35,7 +35,7 @@ exports.Overlay = Overlay;
 var Body = _styledComponents.default.div.withConfig({
   displayName: "components__Body",
   componentId: "zcog99-1"
-})(["background:", ";border-radius:2px;box-shadow:0 1px 4px ", ";margin:40px auto;max-height:calc(100% - 80px);max-width:650px;overflow:hidden;padding-bottom:75px;position:relative;width:100%;", ";", ";", ""], (0, _toColorString.default)(_designTokens.color.base.snowWhite), (0, _toColorString.default)(_designTokens.color.shadow.light.default), (0, _styleModifiers.when)('hasFooter', false, (0, _styledComponents.css)(["padding-bottom:0;"])), (0, _styleModifiers.when)('size', _breakpointObserver.sizes.XS, (0, _styledComponents.css)(["border-radius:0;bottom:0;left:0;margin:0;max-height:100%;overflow:hidden;position:fixed;right:0;top:0;padding-bottom:0;"])), (0, _styleModifiers.when)('widthSize', 'large', (0, _styledComponents.css)(["max-width:", ";"], (0, _rem.default)(_designTokens.spacing.base * 90))));
+})(["background:", ";border-radius:2px;box-shadow:0 1px 4px ", ";margin:40px auto;max-height:calc(100% - 80px);max-width:650px;overflow:hidden;display:flex;flex-direction:column;width:100%;", ""], (0, _toColorString.default)(_designTokens.color.base.snowWhite), (0, _toColorString.default)(_designTokens.color.shadow.light.default), (0, _styleModifiers.when)('widthSize', 'large', (0, _styledComponents.css)(["max-width:", ";"], (0, _rem.default)(_designTokens.spacing.base * 90))));
 
 exports.Body = Body;
 
@@ -67,7 +67,7 @@ exports.Content = Content;
 var Footer = (0, _styledComponents.default)(_Flex.default).withConfig({
   displayName: "components__Footer",
   componentId: "zcog99-6"
-})(["background-color:", ";border-radius:0 0 2px 2px;border-top:1px solid ", ";bottom:0;left:0;position:absolute;right:0;", ";"], (0, _toColorString.default)(_designTokens.color.base.fullMoon), (0, _toColorString.default)(_designTokens.color.opacity.charcoal15), (0, _styleModifiers.when)('size', _breakpointObserver.sizes.XS, (0, _styledComponents.css)(["border-radius:0;background-color:", ";flex-direction:column;"], (0, _toColorString.default)(_designTokens.color.base.fullMoon))));
+})(["background-color:", ";border-radius:0 0 2px 2px;border-top:1px solid ", ";display:flex;align-self:flex-end;width:100%;", ";"], (0, _toColorString.default)(_designTokens.color.base.fullMoon), (0, _toColorString.default)(_designTokens.color.opacity.charcoal15), (0, _styleModifiers.when)('size', _breakpointObserver.sizes.XS, (0, _styledComponents.css)(["border-radius:0;background-color:", ";flex-direction:column;"], (0, _toColorString.default)(_designTokens.color.base.fullMoon))));
 exports.Footer = Footer;
 var ActionWrapper = (0, _styledComponents.default)(_Flex.default).withConfig({
   displayName: "components__ActionWrapper",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@decisiv/ui-components",
-  "version": "2.0.1-alpha.213+efaad97",
+  "version": "2.0.1-alpha.215+313fe27",
   "description": "Decisiv's design system React components",
   "author": "Decisiv UI Development Team",
   "license": "MIT",
@@ -71,5 +71,5 @@
     "access": "public"
   },
   "private": false,
-  "gitHead": "efaad97908f3df65c4b151668dd96147235f946f"
+  "gitHead": "313fe27fcdbeb91cfd4973c19a2b99e9a3cfbcfb"
 }