@hitachivantara/uikit-react-core 2.23.2

package/dist/Dropdown/Dropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dropdown.js","names":["DEFAULT_LABELS","select","selectAll","cancelLabel","applyLabel","multiSelectionAction","multiSelectionConjunction","DEFAULT_STATE","selectionLabel","anchorEl","values","HvDropdown","props","ref","React","createRef","expanded","state","isOpen","event","disabled","isKeypress","KeyboardCodes","Enter","Esc","ArrowDown","anchor","currentTarget","parentElement","setState","selection","commitChanges","toggle","notifyChanges","multiSelect","onChange","labels","selected","getSelected","getSelectionLabel","handleToggle","id","classes","setId","label","title","selectionLabelId","showSearch","notifyChangesOnFirstRender","selectDefault","disablePortal","hasTooltips","singleSelectionToggle","popperProps","className","others","color","undefined","headerId","clsx","header","headerDisabled","evt","pointerEvents","truncate","selectionDisabled","arrow","placement","rootList","list","handleSelection","renderLabel","el","node","root","rootDisabled","rootOpen","renderHeader","renderList","Component","propTypes","PropTypes","string","shape","icon","isRequired","arrayOf","bool","func","deprecatedPropType","oneOf","defaultProps","withStyles","styles","name","withLabels","withId"],"sources":["../../src/Dropdown/Dropdown.js"],"sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport { withStyles } from \"@material-ui/core\";\nimport deprecatedPropType from \"@material-ui/core/utils/deprecatedPropType\";\nimport { DropUpXS as ArrowUp, DropDownXS as ArrowDown } from \"@hitachivantara/uikit-react-icons\";\nimport { setId, isKeypress, KeyboardCodes } from \"../utils\";\nimport HvTypography from \"../Typography\";\nimport withLabels from \"../withLabels\";\nimport withId from \"../withId\";\nimport List from \"./List\";\nimport { getSelected, getSelectionLabel } from \"./utils\";\nimport styles from \"./styles\";\n\nconst DEFAULT_LABELS = {\n  select: \"Select...\",\n  selectAll: \"All\",\n  cancelLabel: \"Cancel\",\n  applyLabel: \"Apply\",\n  multiSelectionAction: \"Selected\",\n  multiSelectionConjunction: \"of\",\n};\n\nconst DEFAULT_STATE = {\n  selectionLabel: null,\n  anchorEl: null,\n  values: [],\n};\n\n/**\n * A drop-down list is a graphical control element, similar to a list box, that allows the user to choose one value from a list.\n */\nclass HvDropdown extends React.Component {\n  constructor(props) {\n    super(props);\n\n    this.ref = React.createRef();\n\n    const { expanded } = props;\n\n    this.state = {\n      isOpen: expanded,\n      ...DEFAULT_STATE,\n    };\n  }\n\n  static getDerivedStateFromProps(props, state) {\n    if (props.values !== state.values) {\n      return {\n        isOpen: props.expanded,\n        selectionLabel: getSelectionLabel(props.values, props.labels, props.multiSelect),\n        anchorEl: null,\n        values: props.values,\n      };\n    }\n\n    return null;\n  }\n\n  /**\n   *  Opens and closes the dropdown.\n   *\n   * @param {Object} event - the event produced by the click action.\n   * @returns {undefined}\n   * @memberof Dropdown\n   */\n  handleToggle(event) {\n    const { disabled } = this.props;\n    const { isOpen } = this.state;\n    // we are checking specifically for false because if \"iskeypress\" returns true or undefined it should continue\n    if (\n      disabled ||\n      (isKeypress(event, KeyboardCodes.Enter) === false &&\n        isKeypress(event, KeyboardCodes.Esc) === false &&\n        isKeypress(event, KeyboardCodes.ArrowDown) === false) ||\n      (isKeypress(event, KeyboardCodes.Esc) && !isOpen) ||\n      (isKeypress(event, KeyboardCodes.ArrowDown) && isOpen)\n    )\n      return;\n\n    const anchor = event ? event.currentTarget.parentElement : null;\n    this.setState({\n      isOpen: !isOpen,\n      anchorEl: anchor,\n    });\n  }\n\n  /**\n   * Applies the selected values to the state\n   *\n   * @param {Array} selection - An array containing the selected values.\n   * @param {Boolean} commitChanges - If `true` the selection if finally committed the dropdown header text should reflect the new selection\n   * @param {Boolean} toggle -If `true` the dropdown should toggle it's current state\n   * @param {Boolean} notifyChanges -If `true` the dropdown will call onChange.\n   * @param {Event} event - mouseUp event.\n   * @memberof Dropdown\n   */\n  handleSelection(selection, commitChanges, toggle, notifyChanges = true, event) {\n    const { multiSelect, onChange, labels } = this.props;\n    const selected = getSelected(selection);\n\n    if (commitChanges) {\n      const selectionLabel = getSelectionLabel(selection, labels, multiSelect);\n      this.setState({ selectionLabel });\n    }\n    if (toggle) this.handleToggle(event);\n    if (notifyChanges) onChange(multiSelect ? selected : selected[0]);\n  }\n\n  renderLabel() {\n    const { id, classes, labels } = this.props;\n    return (\n      <label id={setId(id, \"label\")} className={classes.label} htmlFor={setId(id, \"header\")}>\n        {labels.title}\n      </label>\n    );\n  }\n\n  renderHeader(selectionLabelId) {\n    const {\n      classes,\n      disabled,\n      values,\n      id,\n      labels,\n      multiSelect,\n      showSearch,\n      expanded,\n      onChange,\n      notifyChangesOnFirstRender,\n      selectDefault,\n      disablePortal,\n      hasTooltips,\n      singleSelectionToggle,\n      // TODO: convert component to functional so we don't to destructure here\n      popperProps,\n      className,\n      ...others\n    } = this.props;\n\n    const { isOpen, selectionLabel } = this.state;\n\n    const color = disabled ? \"atmo7\" : undefined;\n\n    const headerId = setId(id, \"header\");\n\n    return (\n      <div\n        id={headerId}\n        aria-labelledby={selectionLabelId}\n        className={clsx(classes.header, {\n          [classes.headerDisabled]: disabled,\n        })}\n        onKeyDown={(evt) => this.handleToggle(evt)}\n        // Used instead of onClick because of OutsideClickHandler used in the List\n        onMouseUp={(evt) => this.handleToggle(evt)}\n        role=\"textbox\"\n        ref={this.ref}\n        tabIndex={0}\n        style={disabled ? { pointerEvents: \"none\" } : undefined}\n        {...others}\n      >\n        <HvTypography\n          id={selectionLabelId}\n          variant=\"normalText\"\n          className={clsx(classes.selection, classes.truncate, {\n            [classes.selectionDisabled]: disabled,\n          })}\n        >\n          {selectionLabel}\n        </HvTypography>\n        {isOpen ? (\n          <ArrowUp iconSize=\"XS\" className={classes.arrow} />\n        ) : (\n          <ArrowDown iconSize=\"XS\" className={classes.arrow} color={color} />\n        )}\n      </div>\n    );\n  }\n\n  renderList() {\n    const {\n      id,\n      multiSelect,\n      showSearch,\n      selectDefault,\n      notifyChangesOnFirstRender,\n      disablePortal,\n      hasTooltips,\n      labels,\n      singleSelectionToggle,\n      classes,\n      placement,\n      // TODO: convert component to functional so we don't to destructure here\n      popperProps,\n    } = this.props;\n    const { isOpen, values, anchorEl } = this.state;\n\n    return (\n      <List\n        id={setId(id, \"values\")}\n        classes={{\n          rootList: classes.rootList,\n          list: classes.list,\n        }}\n        values={values}\n        multiSelect={multiSelect}\n        showSearch={showSearch}\n        onChange={(selected, commitChanges, toggle, notifyChanges, evt) =>\n          this.handleSelection(selected, commitChanges, toggle, notifyChanges, evt)\n        }\n        labels={labels}\n        selectDefault={selectDefault}\n        notifyChangesOnFirstRender={notifyChangesOnFirstRender}\n        hasTooltips={hasTooltips}\n        disablePortal={disablePortal}\n        isOpen={isOpen}\n        anchorEl={anchorEl}\n        singleSelectionToggle={singleSelectionToggle}\n        aria-labelledby={labels.title ? setId(id, \"label\") : undefined}\n        placement={placement}\n        popperProps={popperProps}\n        headerRef={this.ref}\n      />\n    );\n  }\n\n  render() {\n    const { id, classes, className, labels, disabled } = this.props;\n    const { isOpen } = this.state;\n    const selectionLabelId = setId(id, \"selectionLabel\");\n\n    return (\n      <>\n        {/* TODO: remove label? use composition */}\n        {labels.title ? this.renderLabel() : null}\n        <div\n          id={id}\n          role=\"combobox\"\n          aria-expanded={isOpen}\n          aria-owns={isOpen ? setId(id, \"values\") : undefined}\n          aria-controls={isOpen ? setId(id, \"values\") : undefined}\n          aria-labelledby={selectionLabelId}\n          aria-describedby={labels.title ? setId(id, \"label\") : undefined}\n          ref={(el) => {\n            this.node = el;\n          }}\n          className={clsx(classes.root, className, {\n            [classes.rootDisabled]: disabled,\n            [classes.rootOpen]: isOpen,\n          })}\n        >\n          {this.renderHeader(selectionLabelId)}\n          {this.renderList()}\n        </div>\n      </>\n    );\n  }\n}\n\nHvDropdown.propTypes = {\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * Id to be applied to the root node.\n   */\n  id: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the component styles applied.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the component root class.\n     */\n    root: PropTypes.string,\n    /**\n     * Styles applied to the component when is open.\n     */\n    rootOpen: PropTypes.string,\n    /**\n     * Styles applied to the component when is disable.\n     */\n    rootDisabled: PropTypes.string,\n    /**\n     * Styles applied to the label.\n     */\n    label: PropTypes.string,\n    /**\n     * Styles applied to the header.\n     */\n    header: PropTypes.string,\n    /**\n     * Styles applied to the selection\n     */\n    selection: PropTypes.string,\n    /**\n     * Styles applied to the arrow\n     */\n    arrow: PropTypes.string,\n    /**\n     * Styles applied when the header is disable.\n     */\n    headerDisabled: PropTypes.string,\n    /**\n     * Styles applied to the icon.\n     */\n    icon: PropTypes.string,\n    /**\n     * Styles applied for truncating the list elements.\n     */\n    truncate: PropTypes.string,\n    /**\n     * Styles applied when the selection is disabled.\n     */\n    selectionDisabled: PropTypes.string,\n    /**\n     * Styles applied when the selection is disabled.\n     */\n    list: PropTypes.string,\n    /**\n     * Styles applied when the selection is disabled.\n     */\n    rootList: PropTypes.string,\n  }).isRequired,\n  /**\n   * The list to be rendered by the dropdown.\n   */\n  // needed to disable eslint because:\n  // https://github.com/yannickcr/eslint-plugin-react/issues/1751\n  // https://github.com/yannickcr/eslint-plugin-react/issues/2028\n  // eslint-disable-next-line react/no-unused-prop-types\n  values: PropTypes.arrayOf(\n    PropTypes.shape({\n      id: PropTypes.string,\n      label: PropTypes.string.isRequired,\n      selected: PropTypes.bool,\n    })\n  ),\n  /**\n   * If ´true´ the dropdown is multiselect, if ´false´ the dropdown is single select.\n   */\n  multiSelect: PropTypes.bool,\n  /**\n   * If ´true´ the dropdown is rendered with a search bar, if ´false´ there won't be a search bar.\n   */\n  showSearch: PropTypes.bool,\n  /**\n   * If ´true´ the dropdown is disabled unable to be interacted, if ´false´ it is enabled.\n   */\n  disabled: PropTypes.bool,\n  /**\n   * If ´true´ the dropdown starts opened if ´false´ it starts closed.\n   */\n  // needed to disable eslint because:\n  // https://github.com/yannickcr/eslint-plugin-react/issues/1751\n  // https://github.com/yannickcr/eslint-plugin-react/issues/2028\n  // eslint-disable-next-line react/no-unused-prop-types\n  expanded: PropTypes.bool,\n  /**\n   * A function to be executed whenever a item is selected in the dropdown, the function receives the selected item(s).\n   */\n  onChange: PropTypes.func,\n  /**\n   * If 'true' the dropdown will notify on the first render.\n   */\n  notifyChangesOnFirstRender: PropTypes.bool,\n  /**\n   * An object containing all the labels for the dropdown.\n   */\n  labels: PropTypes.shape({\n    /**\n     * Title for the dropdown.\n     */\n    title: PropTypes.string,\n    /**\n     * The placeholder value of the dropdown, when no value is selected.\n     */\n    select: PropTypes.string,\n    /**\n     * Label used for the All checkbox action.\n     */\n    selectAll: PropTypes.string,\n    /**\n     * Cancel button label.\n     */\n    cancelLabel: PropTypes.string,\n    /**\n     * Apply button label.\n     */\n    applyLabel: PropTypes.string,\n    /**\n     * The label used preceding the multiselection count.\n     */\n    multiSelectionAction: PropTypes.string,\n    /**\n     * The label used in the middle of the multiselection count.\n     */\n    multiSelectionConjunction: PropTypes.string,\n  }),\n  /**\n   * If ´true´ and none element selected,\n   * single select has default (first) label selected.\n   *\n   * @deprecated\n   */\n  selectDefault: deprecatedPropType(\n    PropTypes.bool,\n    \"instead pass the default as a preselected value\"\n  ),\n  /**\n   * If ´true´ the dropdown will show tooltips when user mouseenter text in list\n   */\n  hasTooltips: PropTypes.bool,\n  /**\n   * Disable the portal behavior.\n   * The children stay within it's parent DOM hierarchy.\n   */\n  disablePortal: PropTypes.bool,\n  /**\n   * If ´true´, selection can be toggled when single selection.\n   */\n  singleSelectionToggle: PropTypes.bool,\n  /**\n   * Placement of the dropdown.\n   */\n  placement: PropTypes.oneOf([\"left\", \"right\"]),\n  /**\n   * An object containing props to be wired to the popper component.\n   */\n  popperProps: PropTypes.shape(),\n};\n\nHvDropdown.defaultProps = {\n  className: \"\",\n  id: undefined,\n  values: null,\n  multiSelect: false,\n  showSearch: false,\n  disabled: false,\n  expanded: false,\n  onChange() {},\n  notifyChangesOnFirstRender: false,\n  labels: {},\n  selectDefault: true,\n  disablePortal: false,\n  hasTooltips: false,\n  singleSelectionToggle: true,\n  placement: undefined,\n  popperProps: {},\n};\n\nexport default withStyles(styles, { name: \"HvDropdown\" })(\n  withLabels(DEFAULT_LABELS)(withId(HvDropdown))\n);\n"],"mappings":"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"}

package/dist/Dropdown/List/List.js

@@ -0,0 +1,597 @@
+"use strict";
+
+require("core-js/modules/es.object.keys.js");
+
+require("core-js/modules/es.symbol.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+require("core-js/modules/es.object.get-own-property-descriptors.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.array.filter.js");
+
+require("core-js/modules/es.array.map.js");
+
+require("core-js/modules/es.array.find.js");
+
+require("core-js/modules/es.array.concat.js");
+
+require("core-js/modules/web.dom-collections.for-each.js");
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _cloneDeep = _interopRequireDefault(require("lodash/cloneDeep"));
+
+var _isNil = _interopRequireDefault(require("lodash/isNil"));
+
+var _clsx = _interopRequireDefault(require("clsx"));
+
+var _core = require("@material-ui/core");
+
+var _reactOutsideClickHandler = _interopRequireDefault(require("react-outside-click-handler"));
+
+var _utils = require("../../utils");
+
+var _List = _interopRequireDefault(require("../../List"));
+
+var _SearchBox = _interopRequireDefault(require("../../SearchBox"));
+
+var _Actions = _interopRequireDefault(require("../Actions"));
+
+var _CheckBox = _interopRequireDefault(require("../../Selectors/CheckBox"));
+
+var _utils2 = require("../utils");
+
+var _styles = _interopRequireDefault(require("./styles"));
+
+var _focusableElementFinder = require("../../utils/focusableElementFinder");
+
+var _excluded = ["id", "classes", "values", "multiSelect", "showSearch", "onChange", "labels", "selectDefault", "notifyChangesOnFirstRender", "hasTooltips", "disablePortal", "isOpen", "anchorEl", "singleSelectionToggle", "placement", "popperProps", "headerRef"];
+
+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 = symbols.filter(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 source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+var List = function List(_ref) {
+  var id = _ref.id,
+      classes = _ref.classes,
+      _ref$values = _ref.values,
+      values = _ref$values === void 0 ? [] : _ref$values,
+      _ref$multiSelect = _ref.multiSelect,
+      multiSelect = _ref$multiSelect === void 0 ? false : _ref$multiSelect,
+      _ref$showSearch = _ref.showSearch,
+      showSearch = _ref$showSearch === void 0 ? false : _ref$showSearch,
+      onChange = _ref.onChange,
+      labels = _ref.labels,
+      _ref$selectDefault = _ref.selectDefault,
+      selectDefault = _ref$selectDefault === void 0 ? true : _ref$selectDefault,
+      _ref$notifyChangesOnF = _ref.notifyChangesOnFirstRender,
+      notifyChangesOnFirstRender = _ref$notifyChangesOnF === void 0 ? false : _ref$notifyChangesOnF,
+      _ref$hasTooltips = _ref.hasTooltips,
+      hasTooltips = _ref$hasTooltips === void 0 ? false : _ref$hasTooltips,
+      _ref$disablePortal = _ref.disablePortal,
+      disablePortal = _ref$disablePortal === void 0 ? true : _ref$disablePortal,
+      _ref$isOpen = _ref.isOpen,
+      isOpen = _ref$isOpen === void 0 ? false : _ref$isOpen,
+      _ref$anchorEl = _ref.anchorEl,
+      anchorEl = _ref$anchorEl === void 0 ? null : _ref$anchorEl,
+      singleSelectionToggle = _ref.singleSelectionToggle,
+      placement = _ref.placement,
+      popperProps = _ref.popperProps,
+      headerRef = _ref.headerRef,
+      others = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+
+  var _useState = (0, _react.useState)(),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      searchStr = _useState2[0],
+      setSearchStr = _useState2[1];
+
+  var _useState3 = (0, _react.useState)((0, _cloneDeep.default)(values)),
+      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+      list = _useState4[0],
+      setList = _useState4[1];
+
+  var _useState5 = (0, _react.useState)((0, _cloneDeep.default)(values)),
+      _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+      prevList = _useState6[0],
+      setPrevList = _useState6[1];
+
+  var _useState7 = (0, _react.useState)(false),
+      _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
+      positionUp = _useState8[0],
+      setPositionUp = _useState8[1];
+
+  var _useState9 = (0, _react.useState)(false),
+      _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
+      created = _useState10[0],
+      setCreated = _useState10[1];
+
+  var _useState11 = (0, _react.useState)(false),
+      _useState12 = (0, _slicedToArray2.default)(_useState11, 2),
+      allSelected = _useState12[0],
+      setAllSelected = _useState12[1];
+
+  var _useState13 = (0, _react.useState)(false),
+      _useState14 = (0, _slicedToArray2.default)(_useState13, 2),
+      anySelected = _useState14[0],
+      setAnySelected = _useState14[1];
+
+  var _useState15 = (0, _react.useState)(labels.selectAll),
+      _useState16 = (0, _slicedToArray2.default)(_useState15, 2),
+      selectionLabel = _useState16[0],
+      setSelectionLabel = _useState16[1];
+
+  var theme = (0, _core.useTheme)();
+  var newLabels = {
+    selectAll: labels.selectAll,
+    selectionConjunction: labels.multiSelectionConjunction
+  };
+  var applyFocusRef = (0, _react.useCallback)(function (node) {
+    var dropdownHeader = headerRef === null || headerRef === void 0 ? void 0 : headerRef.current;
+
+    if (node) {
+      var focusableList = (0, _focusableElementFinder.getFocusableList)(node);
+
+      if (focusableList.length === 0) {
+        return;
+      } // apply implicitly to first element
+
+
+      focusableList[0].focus({
+        preventScroll: true
+      });
+    } else if (dropdownHeader) {
+      dropdownHeader.focus({
+        preventScroll: true
+      });
+    }
+  }, []);
+  /**
+   * After the first render, call onChange if notifyChangesOnFirstRender.
+   */
+
+  (0, _react.useEffect)(function () {
+    setList(values);
+    setPrevList(values);
+
+    if (notifyChangesOnFirstRender) {
+      onChange === null || onChange === void 0 ? void 0 : onChange(values, false, false, true);
+    }
+
+    if (list) {
+      // eslint-disable-next-line no-use-before-define
+      updateSelectionLabel(values);
+    }
+  }, [values]);
+  /**
+   * Sets the filtered values to the state.
+   *
+   * @param {String} str - The value that is being looked.
+   */
+
+  var handleSearch = function handleSearch(str) {
+    var results = list ? list.filter(function (value) {
+      var valNormalized = value.label.toLowerCase();
+      var strNormalized = str.toLowerCase();
+      return valNormalized.indexOf(strNormalized) >= 0;
+    }) : null;
+
+    if (!(0, _isNil.default)(results)) {
+      var newList = list.map(function (elem) {
+        var newElem = _objectSpread({}, elem);
+
+        var isResult = results.find(function (result) {
+          return result.label === elem.label;
+        });
+        newElem.isHidden = !isResult;
+        return newElem;
+      });
+      setList(newList);
+      setSearchStr(str);
+    }
+
+    return str;
+  };
+  /**
+   * Create search element.
+   *
+   * @returns {*}
+   */
+
+
+  var renderSearch = function renderSearch() {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: classes.searchContainer
+    }, /*#__PURE__*/_react.default.createElement(_SearchBox.default, {
+      id: (0, _utils.setId)(id, "search"),
+      value: searchStr,
+      values: values,
+      onChange: function onChange(event, str) {
+        return handleSearch(str);
+      }
+    }));
+  };
+  /**
+   * Update the selectionLabel.
+   *
+   * @param selection
+   */
+
+
+  var updateSelectionLabel = function updateSelectionLabel(selection) {
+    var selectAll = labels.selectAll,
+        multiSelectionConjunction = labels.multiSelectionConjunction;
+    var selected = (0, _utils2.getSelected)(selection);
+    setSelectionLabel(!selected.length ? selectAll : "".concat(selected.length, " ").concat(multiSelectionConjunction, " ").concat(list.length));
+  };
+  /**
+   * Centralized point to call the prop onChange, altering the selection label.
+   * @param selection
+   * @param commitChanges
+   * @param toggle
+   * @param notifyChanges
+   * @param event
+   */
+
+
+  var sendOnChange = function sendOnChange(selection, commitChanges, toggle, notifyChanges, event) {
+    onChange === null || onChange === void 0 ? void 0 : onChange(selection, commitChanges, toggle, notifyChanges, event);
+    updateSelectionLabel(selection);
+  };
+  /**
+   * Update states associated with select all.
+   */
+
+
+  var updateSelectAll = function updateSelectAll(selection) {
+    if (!selection) return;
+    var selected = (0, _utils2.getSelected)(selection);
+    var hasSelection = selected.length > 0;
+    var allSelect = selected.length === list.length;
+    var anySelect = selected.length > 0;
+    setAnySelected(hasSelection && anySelect);
+    setAllSelected(hasSelection && allSelect);
+  };
+  /**
+   * Select all the values inside the dropdown.
+   *
+   * @memberof List
+   */
+
+
+  var handleSelectAll = function handleSelectAll() {
+    var newList = list.map(function (elem) {
+      return _objectSpread(_objectSpread({}, elem), {}, {
+        selected: !anySelected
+      });
+    });
+    setList(newList);
+    updateSelectAll(newList);
+    sendOnChange(newList, false, false, false);
+  };
+
+  var renderSelectAll = function renderSelectAll() {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: classes.selectAllContainer
+    }, /*#__PURE__*/_react.default.createElement(_CheckBox.default, {
+      id: (0, _utils.setId)(id, "select-all"),
+      label: selectionLabel,
+      onChange: function onChange() {
+        return handleSelectAll();
+      },
+      classes: {
+        container: classes.selection
+      },
+      className: classes.selectAll,
+      indeterminate: anySelected && !allSelected,
+      checked: allSelected
+    }));
+  };
+  /**
+   * Set hidden to false.
+   *
+   * @returns {*}
+   */
+
+
+  var cleanHidden = function cleanHidden(lst) {
+    return lst.forEach(function (item) {
+      // eslint-disable-next-line no-param-reassign
+      item.isHidden = false;
+    });
+  };
+  /**
+   * When selecting the state list is updated with the corresponding selection.
+   *
+   * @param selected - elements selected.
+   */
+
+
+  var onSelection = function onSelection(selected) {
+    updateSelectAll(selected);
+
+    if (multiSelect) {
+      setList((0, _cloneDeep.default)(selected));
+      sendOnChange(selected, false, false, false);
+    } else {
+      cleanHidden(selected);
+      setPrevList((0, _cloneDeep.default)(selected));
+      setList((0, _cloneDeep.default)(selected));
+      setSearchStr("");
+      sendOnChange(selected, true, true, true);
+    }
+  };
+  /**
+   * Cancel the selection in case of no commit reverting the state to it's previous iteration.
+   * If the handler is called by the onClickAway it is evaluated if the click was done in the header
+   * to prevent the double toggle.
+   */
+
+
+  var handleCancel = function handleCancel(event) {
+    setList((0, _cloneDeep.default)(prevList));
+    setSearchStr("");
+    updateSelectAll(prevList);
+    (event === null || event === void 0 ? void 0 : event.target) === (headerRef === null || headerRef === void 0 ? void 0 : headerRef.current) ? sendOnChange(prevList, false, false, false, event) : sendOnChange(prevList, false, true, false, event);
+  };
+  /**
+   * Commits the temporary selection to the state.
+   */
+
+
+  var handleApply = function handleApply() {
+    cleanHidden(list);
+    setPrevList(list);
+    setList(list);
+    setSearchStr("");
+    sendOnChange(list, true, true, true);
+  };
+  /**
+   * If the ESCAPE key is pressed the cancel handler must be called.
+   *
+   * @param evt
+   */
+
+
+  var handleKeyDown = function handleKeyDown(evt) {
+    if ((0, _utils.isKeypress)(evt, _utils.KeyboardCodes.Esc)) {
+      handleCancel(evt);
+    }
+  };
+  /**
+   * Render action buttons.
+   */
+
+
+  var renderActions = function renderActions() {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: classes.actions
+    }, /*#__PURE__*/_react.default.createElement(_Actions.default, {
+      id: (0, _utils.setId)(id, "actions"),
+      onCancel: function onCancel() {
+        return handleCancel();
+      },
+      onApply: function onApply() {
+        return handleApply();
+      },
+      labels: labels,
+      cancelLabel: labels.cancelLabel,
+      applyLabel: labels.applyLabel
+    }));
+  };
+  /**
+   * When the list is rendered, it should determine its position.
+   *
+   * @param data
+   */
+
+
+  var handleListFlip = function handleListFlip(data) {
+    var position = data.flipped;
+
+    if (positionUp !== position) {
+      setPositionUp(position);
+    }
+  };
+
+  var handleListCreate = function handleListCreate(data) {
+    var position = data.flipped;
+
+    if (!created) {
+      setPositionUp(position);
+      setCreated(true);
+      updateSelectAll(prevList);
+    }
+  };
+
+  var showList = !(0, _isNil.default)(values);
+
+  var renderInnerList = function renderInnerList() {
+    return /*#__PURE__*/_react.default.createElement("div", null, !positionUp && /*#__PURE__*/_react.default.createElement("div", {
+      className: (0, _clsx.default)(classes.inputExtensionOpen, placement === "left" && classes.inputExtensionLeftPosition)
+    }), /*#__PURE__*/_react.default.createElement("div", {
+      className: (0, _clsx.default)(classes.list, classes.listClosed, isOpen && (positionUp ? classes.listOpenUp : classes.listOpenDown)),
+      onKeyDown: handleKeyDown
+    }, !positionUp && /*#__PURE__*/_react.default.createElement("div", {
+      className: classes.listBorderDown
+    }), /*#__PURE__*/_react.default.createElement("div", {
+      className: (0, _clsx.default)(classes.rootList, positionUp && showList && classes.marginTop)
+    }, showSearch && renderSearch(), showList && multiSelect && renderSelectAll(), /*#__PURE__*/_react.default.createElement("div", {
+      className: classes.listContainer
+    }, showList && /*#__PURE__*/_react.default.createElement(_List.default, (0, _extends2.default)({
+      id: (0, _utils.setId)(id, "list"),
+      values: list,
+      multiSelect: multiSelect,
+      useSelector: multiSelect,
+      showSelectAll: false,
+      onChange: onSelection,
+      labels: newLabels,
+      selectDefault: selectDefault,
+      hasTooltips: hasTooltips,
+      selectable: true,
+      condensed: true,
+      singleSelectionToggle: singleSelectionToggle
+    }, others)))), showList && multiSelect ? renderActions() : null), positionUp && /*#__PURE__*/_react.default.createElement("div", {
+      className: (0, _clsx.default)(classes.inputExtensionOpen, classes.inputExtensionOpenShadow, {
+        "right": classes.inputExtensionFloatRight,
+        "left": classes.inputExtensionFloatLeft
+      }[placement])
+    }));
+  };
+
+  var bottom = placement && "bottom-".concat(placement === "right" ? "start" : "end");
+  return /*#__PURE__*/_react.default.createElement(_core.Popper, (0, _extends2.default)({
+    id: id,
+    disablePortal: disablePortal,
+    open: isOpen,
+    anchorEl: anchorEl,
+    placement: bottom,
+    popperOptions: {
+      onUpdate: function onUpdate(data) {
+        return handleListFlip(data);
+      },
+      onCreate: function onCreate(data) {
+        return handleListCreate(data);
+      }
+    },
+    style: {
+      zIndex: theme.zIndex.tooltip
+    },
+    ref: applyFocusRef
+  }, popperProps), /*#__PURE__*/_react.default.createElement(_reactOutsideClickHandler.default, {
+    onOutsideClick: function onOutsideClick(e) {
+      return handleCancel(e);
+    }
+  }, renderInnerList()));
+};
+
+process.env.NODE_ENV !== "production" ? List.propTypes = {
+  /**
+   * Id to be applied to the root node.
+   */
+  id: _propTypes.default.string.isRequired,
+
+  /**
+   * A Jss Object used to override or extend the component styles.
+   */
+  classes: _propTypes.default.instanceOf(Object).isRequired,
+
+  /**
+   * The list to be rendered.
+   */
+  values: _propTypes.default.instanceOf(Array),
+
+  /**
+   * If true renders a multi select list.
+   */
+  multiSelect: _propTypes.default.bool,
+
+  /**
+   * If true renders the search component.
+   */
+  showSearch: _propTypes.default.bool,
+
+  /**
+   * A function to be executed whenever a item is selected in the list.
+   */
+  onChange: _propTypes.default.func,
+
+  /**
+   * An object containing all the labels for the dropdown.
+   */
+  labels: _propTypes.default.instanceOf(Object).isRequired,
+
+  /**
+   * If ´true´ and none element selected,
+   * single select has default (first) label selected.
+   */
+  selectDefault: _propTypes.default.bool,
+
+  /**
+   * If 'true' the dropdown will notify on the first render.
+   */
+  notifyChangesOnFirstRender: _propTypes.default.bool,
+
+  /**
+   * If ´true´ the dropdown will show tooltips when user mouseenter text in list
+   */
+  hasTooltips: _propTypes.default.bool,
+
+  /**
+   * Disable the portal behavior. The children stay within it's parent DOM hierarchy.
+   */
+  disablePortal: _propTypes.default.bool,
+
+  /**
+   * If 'true' list is open.
+   */
+  isOpen: _propTypes.default.bool,
+
+  /**
+   * This is the DOM element, or a function that returns the DOM element,
+   * that may be used to set the position of the popover.
+   * The return value will passed as the reference object of the Popper
+   * instance.
+   */
+  anchorEl: _propTypes.default.oneOfType([_propTypes.default.object, _propTypes.default.func]),
+
+  /**
+   * If ´true´, selection can be toggled when single selection.
+   */
+  singleSelectionToggle: _propTypes.default.bool.isRequired,
+
+  /**
+   * Placement of the dropdown.
+   */
+  placement: _propTypes.default.oneOf(["left", "right"]),
+
+  /**
+   * An object containing props to be wired to the popper component.
+   */
+  popperProps: _propTypes.default.shape(),
+
+  /**
+   * A reference to the dropdown header used for refocusing the element.
+   */
+  headerRef: _propTypes.default.instanceOf(Object)
+} : void 0;
+
+var _default = (0, _core.withStyles)(_styles.default, {
+  name: "HvDropdownList"
+})(List);
+
+exports.default = _default;
+//# sourceMappingURL=List.js.map