@decisiv/ui-components 2.0.1-alpha.8 → 2.0.1-alpha.97

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

@@ -1 +1 @@
-{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/Pagination.tsx"],"names":[],"mappings":";AACA,OAAO,SAAS,MAAM,YAAY,CAAC;AAUnC,OAAO,EAAuB,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAGjE,UAAU,sBAAsB;IAC9B,OAAO,EAAE,iBAAiB,CAAC;IAC3B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1D,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,eAAgB,SAAQ,sBAAsB;IAC7D,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,iBAAwB,UAAU,CAAC,KAAK,EAAE,eAAe,GAAG,GAAG,CAAC,OAAO,CA6EtE;kBA7EuB,UAAU;;;;;;;;;;;;eAAV,UAAU"}
+{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/Pagination.tsx"],"names":[],"mappings":";AACA,OAAO,SAAS,MAAM,YAAY,CAAC;AAUnC,OAAO,EAAuB,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAGjE,UAAU,sBAAsB;IAC9B,OAAO,EAAE,iBAAiB,CAAC;IAC3B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1D,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,eAAgB,SAAQ,sBAAsB;IAC7D,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,iBAAwB,UAAU,CAAC,KAAK,EAAE,eAAe,GAAG,GAAG,CAAC,OAAO,GAAG,IAAI,CA+E7E;kBA/EuB,UAAU;;;;;;;;;;;;eAAV,UAAU"}

package/lib/components/Pagination/Pagination.js

@@ -49,6 +49,7 @@ function Pagination(props) {
       currentPage = _useState2[0],
       setCurrentPage = _useState2[1];
 
+  if (totalPages <= 1) return null;
   var activePageIsControlled = typeof activePage !== 'undefined';
 
   if (activePageIsControlled && activePage !== currentPage) {

package/lib/components/Pagination/Pagination.test.js

@@ -245,4 +245,13 @@ describe('Pagination', function () {
       expect(onPageChange).toHaveBeenCalledWith(props.activePage + 1, props.activePage);
     });
   });
+  it("doesn't display when there is only 1 page", function () {
+    var _renderPagination17 = renderPagination(_objectSpread({}, defaultProps, {
+      totalPages: 1,
+      defaultActivePage: 1
+    })),
+        container = _renderPagination17.container;
+
+    expect(container).toBeEmpty();
+  });
 });

package/lib/components/Pagination/types.js

@@ -1 +1,5 @@
-"use strict";
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

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

@@ -1,6 +1,6 @@
 import { RefObject } from 'react';
 import { PopoverProps, Side, TargetType, VisibilityActions } from './types';
-export declare const getPlacementParts: (placement?: "left" | "right" | "auto" | "bottom" | "top" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end" | "auto-start" | "auto-end") => [Side, ("end" | "start" | undefined)?];
+export declare const getPlacementParts: (placement?: "auto" | "bottom" | "left" | "right" | "top" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end" | "auto-start" | "auto-end") => [Side, ("end" | "start" | undefined)?];
 interface UseTargetProps extends PopoverProps {
     actions: VisibilityActions;
     internalNodeRef: RefObject<HTMLElement>;

package/lib/components/Select/Target.js

@@ -48,7 +48,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 var TargetContainer = _styledComponents.default.div.withConfig({
   displayName: "Target__TargetContainer",
   componentId: "sc-1t0verh-0"
-})(["align-items:center;display:flex;justify-content:space-between;position:relative;top:-4px;width:100%;"]);
+})(["align-items:center;display:flex;justify-content:space-between;position:relative;top:-2px;width:100%;"]);
 
 var TargetButton = (0, _styledComponents.default)(_BaseButton.default).withConfig({
   displayName: "Target__TargetButton",

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Select/index.tsx"],"names":[],"mappings":"AAGA,OAAc,EAEZ,sBAAsB,EAMvB,MAAM,OAAO,CAAC;AAkBf,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAuOjD,QAAA,MAAM,aAAa,EAAE,sBAAsB,CACzC,SAAS,EACT,WAAW,CACS,CAAC;AAUvB,eAAe,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Select/index.tsx"],"names":[],"mappings":"AAGA,OAAc,EAEZ,sBAAsB,EAMvB,MAAM,OAAO,CAAC;AAoBf,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAyPjD,QAAA,MAAM,aAAa,EAAE,sBAAsB,CACzC,SAAS,EACT,WAAW,CACS,CAAC;AAgCvB,eAAe,aAAa,CAAC"}

package/lib/components/Select/index.js

@@ -27,8 +27,12 @@ var _useClickOutside = _interopRequireDefault(require("../../utils/useClickOutsi
 
 var _useUniqueId = _interopRequireDefault(require("../../utils/useUniqueId"));
 
+var _useUpdateEffect = _interopRequireDefault(require("../../utils/useUpdateEffect"));
+
 var _DropdownList = _interopRequireDefault(require("../DropdownList"));
 
+var _Button = require("../Button");
+
 var _Target = _interopRequireDefault(require("./Target"));
 
 var _propTypes2 = require("./propTypes");
@@ -66,7 +70,8 @@ function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d =
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 function Select(props, ref) {
-  var clearButtonLabel = props.clearButtonLabel,
+  var actions = props.actions,
+      clearButtonLabel = props.clearButtonLabel,
       defaultValue = props.defaultValue,
       id = props.id,
       inputContainerRef = props.inputContainerRef,
@@ -74,8 +79,11 @@ function Select(props, ref) {
       name = props.name,
       onChange = props.onChange,
       onClick = props.onClick,
+      onHide = props.onHide,
       onKeyDown = props.onKeyDown,
+      onShow = props.onShow,
       options = props.options,
+      renderOptionLabel = props.renderOptionLabel,
       propValue = props.value,
       zIndex = props.zIndex;
   var fallbackSelectRef = (0, _react.useRef)(null);
@@ -199,6 +207,19 @@ function Select(props, ref) {
   }, [isPopoverVisible]);
   (0, _useClickOutside.default)([listRef], handleClickOutsideList);
   var inputContainerRefs = (0, _compact.default)([inputContainerRef, popoverTargetRef]);
+  /**
+   * Triggers onShow/onHide callbacks representing wether the Popover is open or not.
+   */
+
+  (0, _useUpdateEffect.default)(function () {
+    if (isPopoverVisible) {
+      onShow && onShow();
+    }
+
+    if (!isPopoverVisible) {
+      onHide && onHide();
+    }
+  }, [isPopoverVisible, onHide, onShow]);
   return _react.default.createElement(_react.default.Fragment, null, _react.default.createElement(_InputField.default, _extends({}, props, {
     "aria-live": "assertive",
     cursor: "default",
@@ -235,6 +256,7 @@ function Select(props, ref) {
       ref: targetRef,
       type: "button"
     }, value), _react.default.createElement(_DropdownList.default, {
+      actions: actions,
       "aria-labelledby": ariaLabelledBy,
       borderRadius: "0",
       id: dropdownListId,
@@ -246,6 +268,7 @@ function Select(props, ref) {
       onChange: handleChangeValue,
       onHide: toggleIsPopoverVisible,
       onShow: toggleIsPopoverVisible,
+      renderOptionLabel: renderOptionLabel,
       selectedIds: selectedValue,
       showArrow: false,
       target: popoverTargetRef,
@@ -258,9 +281,22 @@ function Select(props, ref) {
 var SelectWithRef = (0, _react.forwardRef)(Select);
 SelectWithRef.displayName = 'Select';
 SelectWithRef.propTypes = _objectSpread({}, _schema.default.propTypes, {
+  actions: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.shape((0, _Button.makeButtonSchemaPropTypes)({
+    id: _propTypes.default.string.isRequired
+  }))), _propTypes.default.shape({
+    left: _propTypes.default.arrayOf(_propTypes.default.shape((0, _Button.makeButtonSchemaPropTypes)({
+      id: _propTypes.default.string.isRequired
+    }))),
+    right: _propTypes.default.arrayOf(_propTypes.default.shape((0, _Button.makeButtonSchemaPropTypes)({
+      id: _propTypes.default.string.isRequired
+    })))
+  })]),
   defaultValue: _propTypes2.valueValidator,
   icon: _propTypes.default.elementType,
   value: _propTypes2.valueValidator
 });
+SelectWithRef.defaultProps = {
+  actions: undefined
+};
 var _default = SelectWithRef;
 exports.default = _default;

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

@@ -111,16 +111,53 @@ describe('Select', function () {
       expect(getByText(defaultProps.label)).toBeTruthy();
       expect((0, _react2.queryByText)(baseElement, opt0.label)).toBeTruthy();
     });
+    it('triggers onShow callback', function () {
+      var onShow = jest.fn();
+
+      var _render2 = render(_react.default.createElement(_.default, _extends({}, defaultProps, {
+        onShow: onShow
+      }))),
+          queryByText = _render2.queryByText;
+
+      expect(onShow).not.toHaveBeenCalled();
+      var label = queryByText(defaultProps.label);
+
+      _react2.fireEvent.click(label);
+
+      expect(onShow).toHaveBeenCalled();
+    });
+    it('triggers onHide callback', function () {
+      var onHide = jest.fn();
+
+      var _render3 = render(_react.default.createElement(_.default, _extends({}, defaultProps, {
+        onHide: onHide
+      }))),
+          queryByText = _render3.queryByText;
+
+      expect(onHide).not.toHaveBeenCalled();
+      var label = queryByText(defaultProps.label);
+
+      _react2.fireEvent.click(label);
+
+      _react2.fireEvent.keyDown(label, {
+        key: 'Escape',
+        code: 'Escape',
+        keyCode: 27,
+        charCode: 27
+      });
+
+      expect(onHide).toHaveBeenCalled();
+    });
   });
   describe('clicking an option', function () {
     it('calls the onchange handler with the new value', function () {
       var onChange = jest.fn();
 
-      var _render2 = render(_react.default.createElement(_.default, _extends({}, defaultProps, {
+      var _render4 = render(_react.default.createElement(_.default, _extends({}, defaultProps, {
         onChange: onChange
       }))),
-          baseElement = _render2.baseElement,
-          getByText = _render2.getByText;
+          baseElement = _render4.baseElement,
+          getByText = _render4.getByText;
 
       _react2.fireEvent.click(getByText(defaultProps.label));
 
@@ -129,9 +166,9 @@ describe('Select', function () {
       expect(onChange).toHaveBeenCalledWith(cat0Opt0.id);
     });
     it('automatically updates the option label inside the input field', function () {
-      var _render3 = render(_react.default.createElement(_.default, defaultProps)),
-          baseElement = _render3.baseElement,
-          getByText = _render3.getByText;
+      var _render5 = render(_react.default.createElement(_.default, defaultProps)),
+          baseElement = _render5.baseElement,
+          getByText = _render5.getByText;
 
       _react2.fireEvent.click(getByText(defaultProps.label));
 
@@ -143,10 +180,10 @@ describe('Select', function () {
   });
   describe('with a default value', function () {
     it('displays the option label matching the defaultValue inside the input field', function () {
-      var _render4 = render(_react.default.createElement(_.default, _extends({}, defaultProps, {
+      var _render6 = render(_react.default.createElement(_.default, _extends({}, defaultProps, {
         defaultValue: cat0Opt0.id
       }))),
-          getByText = _render4.getByText;
+          getByText = _render6.getByText;
 
       expect(getByText(cat0Opt0.label)).toBeTruthy();
     });
@@ -154,12 +191,12 @@ describe('Select', function () {
       it('calls the onchange handler with the new value', function () {
         var onChange = jest.fn();
 
-        var _render5 = render(_react.default.createElement(_.default, _extends({}, defaultProps, {
+        var _render7 = render(_react.default.createElement(_.default, _extends({}, defaultProps, {
           onChange: onChange,
           defaultValue: opt1.id
         }))),
-            baseElement = _render5.baseElement,
-            getByText = _render5.getByText;
+            baseElement = _render7.baseElement,
+            getByText = _render7.getByText;
 
         _react2.fireEvent.click(getByText(defaultProps.label));
 
@@ -168,11 +205,11 @@ describe('Select', function () {
         expect(onChange).toHaveBeenCalledWith(cat0Opt0.id);
       });
       it('automatically updates the option label inside the input field', function () {
-        var _render6 = render(_react.default.createElement(_.default, _extends({}, defaultProps, {
+        var _render8 = render(_react.default.createElement(_.default, _extends({}, defaultProps, {
           defaultValue: opt1.id
         }))),
-            baseElement = _render6.baseElement,
-            getByText = _render6.getByText;
+            baseElement = _render8.baseElement,
+            getByText = _render8.getByText;
 
         _react2.fireEvent.click(getByText(defaultProps.label));
 
@@ -183,12 +220,34 @@ describe('Select', function () {
       });
     });
   });
+  describe('when label hidden', function () {
+    it('does not display the label element', function () {
+      var _render9 = render(_react.default.createElement(_.default, _extends({}, defaultProps, {
+        defaultvalue: opt1.id,
+        hideLabel: true
+      }))),
+          getByText = _render9.getByText;
+
+      expect(getByText(defaultProps.label, {
+        selector: 'span'
+      })).not.toBeVisible();
+    });
+    it('does display the input related to the label', function () {
+      var _render10 = render(_react.default.createElement(_.default, _extends({}, defaultProps, {
+        defaultValue: opt1.id,
+        hideLabel: true
+      }))),
+          getByLabelText = _render10.getByLabelText;
+
+      expect(getByLabelText(defaultProps.label)).toBeVisible();
+    });
+  });
   describe('when component is controlled', function () {
     it('displays the option label matching the value inside the input field', function () {
-      var _render7 = render(_react.default.createElement(_.default, _extends({}, defaultProps, {
+      var _render11 = render(_react.default.createElement(_.default, _extends({}, defaultProps, {
         value: cat0Opt0.id
       }))),
-          getByText = _render7.getByText;
+          getByText = _render11.getByText;
 
       expect(getByText(cat0Opt0.label)).toBeTruthy();
     });
@@ -196,12 +255,12 @@ describe('Select', function () {
       it('calls the onchange handler with the new value', function () {
         var onChange = jest.fn();
 
-        var _render8 = render(_react.default.createElement(_.default, _extends({}, defaultProps, {
+        var _render12 = render(_react.default.createElement(_.default, _extends({}, defaultProps, {
           onChange: onChange,
           value: opt1.id
         }))),
-            baseElement = _render8.baseElement,
-            getByText = _render8.getByText;
+            baseElement = _render12.baseElement,
+            getByText = _render12.getByText;
 
         _react2.fireEvent.click(getByText(defaultProps.label));
 
@@ -210,12 +269,12 @@ describe('Select', function () {
         expect(onChange).toHaveBeenCalledWith(cat0Opt0.id);
       });
       it('does NOT automatically update the option label inside the input field', function () {
-        var _render9 = render(_react.default.createElement(_.default, _extends({}, defaultProps, {
+        var _render13 = render(_react.default.createElement(_.default, _extends({}, defaultProps, {
           value: opt1.id
         }))),
-            baseElement = _render9.baseElement,
-            getByText = _render9.getByText,
-            queryByText = _render9.queryByText;
+            baseElement = _render13.baseElement,
+            getByText = _render13.getByText,
+            queryByText = _render13.queryByText;
 
         _react2.fireEvent.click(getByText(defaultProps.label));
 

package/lib/components/Select/schema.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"schema.d.ts","sourceRoot":"","sources":["../../../src/components/Select/schema.ts"],"names":[],"mappings":"AAOA,QAAA,MAAM,MAAM,KAAsC,CAAC;AA4CnD,eAAe,MAAM,CAAC"}
+{"version":3,"file":"schema.d.ts","sourceRoot":"","sources":["../../../src/components/Select/schema.ts"],"names":[],"mappings":"AAOA,QAAA,MAAM,MAAM,KAAsC,CAAC;AA8DnD,eAAe,MAAM,CAAC"}

package/lib/components/Select/schema.js

@@ -25,7 +25,13 @@ var schema = (0, _reactDesc.describe)({
 schema.propTypes = _objectSpread({}, (0, _omit.default)(_InputField.schema.makePropTypes(), ['children', 'maxLength', 'onChange', 'showCharacterCount']), {
   clearButtonLabel: _reactDesc.PropTypes.string.description("A hidden label value for the clear button. The select component's label is available within the string for clarity.").defaultValue('Clear {label} value'),
   defaultValue: _reactDesc.PropTypes.string.description('The ID of the option that should be selected by default.'),
+  actions: _reactDesc.PropTypes.oneOfType([_reactDesc.PropTypes.arrayOf(_reactDesc.PropTypes.object), _reactDesc.PropTypes.shape({
+    left: _reactDesc.PropTypes.arrayOf(_reactDesc.PropTypes.object),
+    right: _reactDesc.PropTypes.arrayOf(_reactDesc.PropTypes.object)
+  })]).description('A collection of objects, each containing a subset of props valid for a Button component. Check the notes on the OptionsList.'),
   onChange: _reactDesc.PropTypes.func.description(''),
+  onHide: _reactDesc.PropTypes.func.description('A callback which is triggered when the popover is closed'),
+  onShow: _reactDesc.PropTypes.func.description('A callback which is triggered when the popover is opened'),
   options: _reactDesc.PropTypes.arrayOf(_reactDesc.PropTypes.shape({
     decoration: _reactDesc.PropTypes.shape({
       type: _reactDesc.PropTypes.oneOf(['Avatar', 'Badge'])
@@ -35,6 +41,7 @@ schema.propTypes = _objectSpread({}, (0, _omit.default)(_InputField.schema.makeP
     label: _reactDesc.PropTypes.string.description('The label text for an option in the dropdown list.'),
     value: _reactDesc.PropTypes.string.description('The value for an option in the dropdown list.')
   })).description('The array of data for the options that will be rendered').isRequired,
+  renderOptionLabel: _reactDesc.PropTypes.func.description('Function to customize render of option labels, called with the item value'),
   value: _reactDesc.PropTypes.string.description('The ID of the option that is selected. If provided, controlling the Select must be handled externally. Overrides `defaultValue`.'),
   zIndex: _reactDesc.PropTypes.number.description('Sets the z-index style property of the options list')
 });

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

@@ -1,9 +1,10 @@
 import { ButtonHTMLAttributes, FocusEventHandler, KeyboardEventHandler, MouseEventHandler } from 'react';
 import { BaseInputFieldProps, InputComponentProps } from '../../atoms/InputField';
+import { OptionsListProps } from '../../atoms/OptionsList/types';
 import { Items } from '../DropdownList';
 import { PopoverProps } from '../Popover/types';
 export declare type SelectRef = HTMLButtonElement;
-interface BaseSelectProps extends ButtonHTMLAttributes<SelectRef>, Omit<BaseInputFieldProps, 'children' | 'maxLength' | 'onChange' | 'showCharacterCount' | 'value'> {
+interface BaseSelectProps extends ButtonHTMLAttributes<SelectRef>, Omit<BaseInputFieldProps, 'children' | 'maxLength' | 'onChange' | 'showCharacterCount' | 'value'>, Pick<OptionsListProps, 'actions' | 'renderOptionLabel'> {
     onBlur?: FocusEventHandler;
     onClick?: MouseEventHandler;
     onFocus?: FocusEventHandler;
@@ -14,6 +15,8 @@ export declare type SelectProps = BaseSelectProps & {
     defaultValue?: string;
     name: string;
     onChange?: (value: string) => void;
+    onHide?: () => void;
+    onShow?: () => void;
     options: Items;
     value?: string;
     zIndex?: PopoverProps['zIndex'];

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Select/types.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,oBAAoB,EACpB,iBAAiB,EACjB,oBAAoB,EACpB,iBAAiB,EAClB,MAAM,OAAO,CAAC;AAEf,OAAO,EACL,mBAAmB,EACnB,mBAAmB,EACpB,MAAM,wBAAwB,CAAC;AAEhC,OAAO,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AACxC,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAEhD,oBAAY,SAAS,GAAG,iBAAiB,CAAC;AAE1C,UAAU,eACR,SAAQ,oBAAoB,CAAC,SAAS,CAAC,EACrC,IAAI,CACF,mBAAmB,EACnB,UAAU,GAAG,WAAW,GAAG,UAAU,GAAG,oBAAoB,GAAG,OAAO,CACvE;IACH,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,SAAS,CAAC,EAAE,oBAAoB,CAAC;CAClC;AAED,oBAAY,WAAW,GAAG,eAAe,GAAG;IAC1C,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,OAAO,EAAE,KAAK,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,YAAY,CAAC,QAAQ,CAAC,CAAC;CACjC,CAAC;AAEF,MAAM,WAAW,WACf,SAAQ,oBAAoB,CAAC,SAAS,CAAC,EACrC,IAAI,CACF,mBAAmB,EACnB,UAAU,GAAG,IAAI,GAAG,QAAQ,GAAG,SAAS,GAAG,UAAU,GAAG,KAAK,GAAG,OAAO,CACxE;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,eAAe,EAAE,MAAM,CAAC;IACxB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,MAAM,EAAE,mBAAmB,CAAC,QAAQ,CAAC,CAAC;IACtC,OAAO,CAAC,EAAE,CAAC,WAAW,CAAC,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC3C,OAAO,EAAE,mBAAmB,CAAC,SAAS,CAAC,CAAC;CACzC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Select/types.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,oBAAoB,EACpB,iBAAiB,EACjB,oBAAoB,EACpB,iBAAiB,EAClB,MAAM,OAAO,CAAC;AAEf,OAAO,EACL,mBAAmB,EACnB,mBAAmB,EACpB,MAAM,wBAAwB,CAAC;AAEhC,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AACjE,OAAO,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AACxC,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAEhD,oBAAY,SAAS,GAAG,iBAAiB,CAAC;AAE1C,UAAU,eACR,SAAQ,oBAAoB,CAAC,SAAS,CAAC,EACrC,IAAI,CACF,mBAAmB,EACnB,UAAU,GAAG,WAAW,GAAG,UAAU,GAAG,oBAAoB,GAAG,OAAO,CACvE,EACD,IAAI,CAAC,gBAAgB,EAAE,SAAS,GAAG,mBAAmB,CAAC;IACzD,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,SAAS,CAAC,EAAE,oBAAoB,CAAC;CAClC;AAED,oBAAY,WAAW,GAAG,eAAe,GAAG;IAC1C,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,EAAE,KAAK,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,YAAY,CAAC,QAAQ,CAAC,CAAC;CACjC,CAAC;AAEF,MAAM,WAAW,WACf,SAAQ,oBAAoB,CAAC,SAAS,CAAC,EACrC,IAAI,CACF,mBAAmB,EACnB,UAAU,GAAG,IAAI,GAAG,QAAQ,GAAG,SAAS,GAAG,UAAU,GAAG,KAAK,GAAG,OAAO,CACxE;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,eAAe,EAAE,MAAM,CAAC;IACxB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,MAAM,EAAE,mBAAmB,CAAC,QAAQ,CAAC,CAAC;IACtC,OAAO,CAAC,EAAE,CAAC,WAAW,CAAC,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC3C,OAAO,EAAE,mBAAmB,CAAC,SAAS,CAAC,CAAC;CACzC"}

package/lib/components/Select/types.js

@@ -1 +1,5 @@
-"use strict";
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/lib/components/SelectDate/Target.js

@@ -48,7 +48,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 var TargetContainer = _styledComponents.default.div.withConfig({
   displayName: "Target__TargetContainer",
   componentId: "ks9oxf-0"
-})(["align-items:center;display:flex;justify-content:space-between;position:relative;top:-4px;width:100%;"]);
+})(["align-items:center;display:flex;justify-content:space-between;position:relative;top:-2px;width:100%;"]);
 
 var TargetButton = (0, _styledComponents.default)(_BaseButton.default).withConfig({
   displayName: "Target__TargetButton",

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/SelectDate/index.tsx"],"names":[],"mappings":"AAIA,OAAc,EAEZ,sBAAsB,EAMvB,MAAM,OAAO,CAAC;AAqBf,OAAO,EAAE,gBAAgB,EAAE,cAAc,EAAQ,MAAM,SAAS,CAAC;AAIjE,OAAO,EACL,SAAS,EACT,oBAAoB,GACrB,MAAM,gCAAgC,CAAC;AAmPxC,QAAA,MAAM,iBAAiB,EAAE,sBAAsB,CAC7C,cAAc,EACd,gBAAgB,CACQ,CAAC;AAK3B,eAAe,iBAAiB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/SelectDate/index.tsx"],"names":[],"mappings":"AAMA,OAAc,EAEZ,sBAAsB,EAMvB,MAAM,OAAO,CAAC;AAsBf,OAAO,EAAE,gBAAgB,EAAE,cAAc,EAAQ,MAAM,SAAS,CAAC;AAIjE,OAAO,EACL,SAAS,EACT,oBAAoB,GACrB,MAAM,gCAAgC,CAAC;AAiQxC,QAAA,MAAM,iBAAiB,EAAE,sBAAsB,CAC7C,cAAc,EACd,gBAAgB,CACQ,CAAC;AAQ3B,eAAe,iBAAiB,CAAC"}

package/lib/components/SelectDate/index.js

@@ -25,6 +25,8 @@ var _isDate = _interopRequireDefault(require("lodash/isDate"));
 
 var _omit = _interopRequireDefault(require("lodash/omit"));
 
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
 var _react = _interopRequireWildcard(require("react"));
 
 var _breakpointObserver = require("@decisiv/breakpoint-observer");
@@ -41,6 +43,8 @@ var _useTranslations = _interopRequireDefault(require("../../utils/useTranslatio
 
 var _useUniqueId = _interopRequireDefault(require("../../utils/useUniqueId"));
 
+var _useUpdateEffect = _interopRequireDefault(require("../../utils/useUpdateEffect"));
+
 var _Calendar = _interopRequireWildcard(require("../../atoms/Calendar"));
 
 var _InputField = _interopRequireDefault(require("../../atoms/InputField"));
@@ -63,6 +67,12 @@ function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj;
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { keys.push.apply(keys, Object.getOwnPropertySymbols(object)); } if (enumerableOnly) keys = keys.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
@@ -90,6 +100,8 @@ function SelectDate(props, ref) {
       onChange = props.onChange,
       onClick = props.onClick,
       onKeyDown = props.onKeyDown,
+      onShow = props.onShow,
+      onHide = props.onHide,
       propValue = props.value,
       disabledDateRules = props.disabledDateRules,
       zIndex = props.zIndex;
@@ -214,6 +226,19 @@ function SelectDate(props, ref) {
   }, [isPopoverVisible]);
   (0, _useClickOutside.default)([popoverContentRef], handleClickOutsidePopover);
   var inputContainerRefs = (0, _compact.default)([inputContainerRef, popoverTargetRef]);
+  /**
+   * Triggers onShow/onHide callbacks representing wether the Popover is open or not.
+   */
+
+  (0, _useUpdateEffect.default)(function () {
+    if (isPopoverVisible) {
+      onShow && onShow();
+    }
+
+    if (!isPopoverVisible) {
+      onHide && onHide();
+    }
+  }, [isPopoverVisible, onShow, onHide]);
   return _react.default.createElement(_InputField.default, _extends({}, (0, _omit.default)(props, ['onChange']), {
     "aria-live": "assertive",
     cursor: "default",
@@ -281,7 +306,9 @@ function SelectDate(props, ref) {
 }
 
 var SelectDateWithRef = (0, _react.forwardRef)(SelectDate);
-SelectDateWithRef.propTypes = _schema.default.propTypes;
+SelectDateWithRef.propTypes = _objectSpread({}, _schema.default.propTypes, {
+  icon: _propTypes.default.elementType
+});
 SelectDateWithRef.displayName = 'SelectDate';
 var _default = SelectDateWithRef;
 exports.default = _default;