@dhis2-ui/select 8.2.0 → 8.2.1

package/build/es/select/empty.js

@@ -3,17 +3,20 @@ import { colors, spacers, theme } from '@dhis2/ui-constants';
 import PropTypes from 'prop-types';
 import React from 'react';
 
-const Empty = ({
-  message,
-  className,
-  dataTest
-}) => /*#__PURE__*/React.createElement("div", {
-  "data-test": dataTest,
-  className: _JSXStyle.dynamic([["849993029", [colors.grey700, theme.fonts, spacers.dp8, spacers.dp24]]]) + " " + (className || "")
-}, message, /*#__PURE__*/React.createElement(_JSXStyle, {
-  id: "849993029",
-  dynamic: [colors.grey700, theme.fonts, spacers.dp8, spacers.dp24]
-}, [`div.__jsx-style-dynamic-selector{color:${colors.grey700};font-family:${theme.fonts};font-size:13px;line-height:16px;padding:${spacers.dp8} ${spacers.dp24};text-align:center;}`]));
+const Empty = _ref => {
+  let {
+    message,
+    className,
+    dataTest
+  } = _ref;
+  return /*#__PURE__*/React.createElement("div", {
+    "data-test": dataTest,
+    className: _JSXStyle.dynamic([["849993029", [colors.grey700, theme.fonts, spacers.dp8, spacers.dp24]]]) + " " + (className || "")
+  }, message, /*#__PURE__*/React.createElement(_JSXStyle, {
+    id: "849993029",
+    dynamic: [colors.grey700, theme.fonts, spacers.dp8, spacers.dp24]
+  }, ["div.__jsx-style-dynamic-selector{color:".concat(colors.grey700, ";font-family:").concat(theme.fonts, ";font-size:13px;line-height:16px;padding:").concat(spacers.dp8, " ").concat(spacers.dp24, ";text-align:center;}")]));
+};
 
 Empty.propTypes = {
   dataTest: PropTypes.string.isRequired,

package/build/es/select/filter-input.js

@@ -4,27 +4,30 @@ import { spacers, colors } from '@dhis2/ui-constants';
 import PropTypes from 'prop-types';
 import React from 'react';
 
-const FilterInput = ({
-  value,
-  onChange,
-  placeholder,
-  className,
-  dataTest
-}) => /*#__PURE__*/React.createElement("div", {
-  className: _JSXStyle.dynamic([["1544004171", [colors.white, spacers.dp8, spacers.dp8, spacers.dp4, spacers.dp8]]]) + " " + (className || "")
-}, /*#__PURE__*/React.createElement(Input, {
-  dense: true,
-  dataTest: dataTest,
-  value: value,
-  onChange: onChange,
-  type: "text",
-  name: "filter",
-  placeholder: placeholder,
-  initialFocus: true
-}), /*#__PURE__*/React.createElement(_JSXStyle, {
-  id: "1544004171",
-  dynamic: [colors.white, spacers.dp8, spacers.dp8, spacers.dp4, spacers.dp8]
-}, [`div.__jsx-style-dynamic-selector{position:-webkit-sticky;position:sticky;top:0;background:${colors.white};padding:${spacers.dp8} ${spacers.dp8} ${spacers.dp4} ${spacers.dp8};z-index:1;}`]));
+const FilterInput = _ref => {
+  let {
+    value,
+    onChange,
+    placeholder,
+    className,
+    dataTest
+  } = _ref;
+  return /*#__PURE__*/React.createElement("div", {
+    className: _JSXStyle.dynamic([["1544004171", [colors.white, spacers.dp8, spacers.dp8, spacers.dp4, spacers.dp8]]]) + " " + (className || "")
+  }, /*#__PURE__*/React.createElement(Input, {
+    dense: true,
+    dataTest: dataTest,
+    value: value,
+    onChange: onChange,
+    type: "text",
+    name: "filter",
+    placeholder: placeholder,
+    initialFocus: true
+  }), /*#__PURE__*/React.createElement(_JSXStyle, {
+    id: "1544004171",
+    dynamic: [colors.white, spacers.dp8, spacers.dp8, spacers.dp4, spacers.dp8]
+  }, ["div.__jsx-style-dynamic-selector{position:-webkit-sticky;position:sticky;top:0;background:".concat(colors.white, ";padding:").concat(spacers.dp8, " ").concat(spacers.dp8, " ").concat(spacers.dp4, " ").concat(spacers.dp8, ";z-index:1;}")]));
+};
 
 FilterInput.propTypes = {
   dataTest: PropTypes.string.isRequired,

package/build/es/select/filterable-menu.js

@@ -8,16 +8,17 @@ import { FilterInput } from './filter-input.js';
 import { NoMatch } from './no-match.js';
 import { filterIgnored, checkIfValidOption } from './option-helpers.js';
 export class FilterableMenu extends Component {
-  constructor(...args) {
-    super(...args);
+  constructor() {
+    super(...arguments);
 
     _defineProperty(this, "state", {
       filter: ''
     });
 
-    _defineProperty(this, "onFilterChange", ({
-      value
-    }) => {
+    _defineProperty(this, "onFilterChange", _ref => {
+      let {
+        value
+      } = _ref;
       this.setState({
         filter: value
       });
@@ -52,7 +53,7 @@ export class FilterableMenu extends Component {
 
     if (React.Children.count(renderedOptions) === 0 || !filter) {
       return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FilterInput, {
-        dataTest: `${dataTest}-filterinput`,
+        dataTest: "".concat(dataTest, "-filterinput"),
         placeholder: placeholder,
         value: filter,
         onChange: this.onFilterChange
@@ -77,7 +78,7 @@ export class FilterableMenu extends Component {
     });
     const hasMatch = React.Children.count(filtered) > 0;
     return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(FilterInput, {
-      dataTest: `${dataTest}-filterinput`,
+      dataTest: "".concat(dataTest, "-filterinput"),
       placeholder: placeholder,
       value: filter,
       onChange: this.onFilterChange

package/build/es/select/input-clear-button.js

@@ -2,19 +2,22 @@ import { Button } from '@dhis2-ui/button';
 import PropTypes from 'prop-types';
 import React from 'react';
 
-const InputClearButton = ({
-  onClear,
-  clearText,
-  className,
-  dataTest
-}) => /*#__PURE__*/React.createElement(Button, {
-  small: true,
-  secondary: true,
-  dataTest: dataTest,
-  onClick: onClear,
-  type: "button",
-  className: className
-}, clearText);
+const InputClearButton = _ref => {
+  let {
+    onClear,
+    clearText,
+    className,
+    dataTest
+  } = _ref;
+  return /*#__PURE__*/React.createElement(Button, {
+    small: true,
+    secondary: true,
+    dataTest: dataTest,
+    onClick: onClear,
+    type: "button",
+    className: className
+  }, clearText);
+};
 
 InputClearButton.propTypes = {
   clearText: PropTypes.string.isRequired,

package/build/es/select/input-placeholder.js

@@ -3,11 +3,13 @@ import { colors } from '@dhis2/ui-constants';
 import PropTypes from 'prop-types';
 import React from 'react';
 
-const InputPlaceholder = ({
-  placeholder,
-  className,
-  dataTest
-}) => {
+const InputPlaceholder = _ref => {
+  let {
+    placeholder,
+    className,
+    dataTest
+  } = _ref;
+
   if (!placeholder) {
     return null;
   }
@@ -18,7 +20,7 @@ const InputPlaceholder = ({
   }, placeholder, /*#__PURE__*/React.createElement(_JSXStyle, {
     id: "1027033961",
     dynamic: [colors.grey600]
-  }, [`div.__jsx-style-dynamic-selector{color:${colors.grey600};-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}`]));
+  }, ["div.__jsx-style-dynamic-selector{color:".concat(colors.grey600, ";-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}")]));
 };
 
 InputPlaceholder.propTypes = {

package/build/es/select/input-prefix.js

@@ -3,11 +3,13 @@ import { colors, spacers } from '@dhis2/ui-constants';
 import PropTypes from 'prop-types';
 import React from 'react';
 
-const InputPrefix = ({
-  prefix,
-  className,
-  dataTest
-}) => {
+const InputPrefix = _ref => {
+  let {
+    prefix,
+    className,
+    dataTest
+  } = _ref;
+
   if (!prefix) {
     return null;
   }
@@ -18,7 +20,7 @@ const InputPrefix = ({
   }, prefix, /*#__PURE__*/React.createElement(_JSXStyle, {
     id: "153011991",
     dynamic: [colors.grey600, spacers.dp4]
-  }, [`div.__jsx-style-dynamic-selector{color:${colors.grey600};padding-right:${spacers.dp4};font-size:14px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}`]));
+  }, ["div.__jsx-style-dynamic-selector{color:".concat(colors.grey600, ";padding-right:").concat(spacers.dp4, ";font-size:14px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}")]));
 };
 
 InputPrefix.propTypes = {

package/build/es/select/input-wrapper.js

@@ -5,19 +5,20 @@ import cx from 'classnames';
 import PropTypes from 'prop-types';
 import React from 'react';
 
-const InputWrapper = ({
-  dataTest,
-  onToggle,
-  children,
-  tabIndex,
-  error,
-  warning,
-  valid,
-  disabled,
-  dense,
-  className,
-  inputRef
-}) => {
+const InputWrapper = _ref => {
+  let {
+    dataTest,
+    onToggle,
+    children,
+    tabIndex,
+    error,
+    warning,
+    valid,
+    disabled,
+    dense,
+    className,
+    inputRef
+  } = _ref;
   const classNames = cx(className, 'root', {
     error,
     warning,
@@ -38,7 +39,7 @@ const InputWrapper = ({
   }, /*#__PURE__*/React.createElement(IconChevronDown16, null)), /*#__PURE__*/React.createElement(_JSXStyle, {
     id: "248041060",
     dynamic: [colors.grey500, theme.focus, theme.focus, theme.valid, theme.warning, theme.error, colors.grey100, colors.grey500, theme.disabled]
-  }, [`.root.__jsx-style-dynamic-selector{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:white;border-radius:3px;border:1px solid ${colors.grey500};box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;min-height:40px;padding:6px 12px;box-shadow:inset 0 1px 2px 0 rgba(48,54,60,0.1);}`, `.root.__jsx-style-dynamic-selector:not(.disabled):focus,.root.__jsx-style-dynamic-selector:not(.disabled):active{outline:none;box-shadow:inset 0 0 0 2px ${theme.focus};border-color:${theme.focus};}`, `.root.valid.__jsx-style-dynamic-selector{border-color:${theme.valid};}`, `.root.warning.__jsx-style-dynamic-selector{border-color:${theme.warning};}`, `.root.error.__jsx-style-dynamic-selector{border-color:${theme.error};}`, `.root.disabled.__jsx-style-dynamic-selector{background-color:${colors.grey100};border-color:${colors.grey500};color:${theme.disabled};cursor:not-allowed;}`, ".root.dense.__jsx-style-dynamic-selector{padding:4px 8px;min-height:32px;}", ".root-children.__jsx-style-dynamic-selector{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".root-right.__jsx-style-dynamic-selector{margin:4px 0px 0px 8px;}"]));
+  }, [".root.__jsx-style-dynamic-selector{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:white;border-radius:3px;border:1px solid ".concat(colors.grey500, ";box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;min-height:40px;padding:6px 12px;box-shadow:inset 0 1px 2px 0 rgba(48,54,60,0.1);}"), ".root.__jsx-style-dynamic-selector:not(.disabled):focus,.root.__jsx-style-dynamic-selector:not(.disabled):active{outline:none;box-shadow:inset 0 0 0 2px ".concat(theme.focus, ";border-color:").concat(theme.focus, ";}"), ".root.valid.__jsx-style-dynamic-selector{border-color:".concat(theme.valid, ";}"), ".root.warning.__jsx-style-dynamic-selector{border-color:".concat(theme.warning, ";}"), ".root.error.__jsx-style-dynamic-selector{border-color:".concat(theme.error, ";}"), ".root.disabled.__jsx-style-dynamic-selector{background-color:".concat(colors.grey100, ";border-color:").concat(colors.grey500, ";color:").concat(theme.disabled, ";cursor:not-allowed;}"), ".root.dense.__jsx-style-dynamic-selector{padding:4px 8px;min-height:32px;}", ".root-children.__jsx-style-dynamic-selector{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".root-right.__jsx-style-dynamic-selector{margin:4px 0px 0px 8px;}"]));
 };
 
 InputWrapper.defaultProps = {

package/build/es/select/loading.js

@@ -4,21 +4,24 @@ import { colors, spacers, theme } from '@dhis2/ui-constants';
 import cx from 'classnames';
 import PropTypes from 'prop-types';
 import React from 'react';
-export const Loading = ({
-  message,
-  className,
-  dataTest
-}) => /*#__PURE__*/React.createElement("div", {
-  "data-test": dataTest,
-  className: _JSXStyle.dynamic([["1068210086", [spacers.dp16, colors.grey700, theme.fonts, spacers.dp8, spacers.dp24]]]) + " " + (cx(className, 'container') || "")
-}, /*#__PURE__*/React.createElement("div", {
-  className: _JSXStyle.dynamic([["1068210086", [spacers.dp16, colors.grey700, theme.fonts, spacers.dp8, spacers.dp24]]])
-}, /*#__PURE__*/React.createElement(CircularLoader, {
-  small: true
-})), message, /*#__PURE__*/React.createElement(_JSXStyle, {
-  id: "1068210086",
-  dynamic: [spacers.dp16, colors.grey700, theme.fonts, spacers.dp8, spacers.dp24]
-}, [`.container.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:${spacers.dp16};-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;color:${colors.grey700};font-family:${theme.fonts};font-size:13px;padding:${spacers.dp8} ${spacers.dp24};}`]));
+export const Loading = _ref => {
+  let {
+    message,
+    className,
+    dataTest
+  } = _ref;
+  return /*#__PURE__*/React.createElement("div", {
+    "data-test": dataTest,
+    className: _JSXStyle.dynamic([["1068210086", [spacers.dp16, colors.grey700, theme.fonts, spacers.dp8, spacers.dp24]]]) + " " + (cx(className, 'container') || "")
+  }, /*#__PURE__*/React.createElement("div", {
+    className: _JSXStyle.dynamic([["1068210086", [spacers.dp16, colors.grey700, theme.fonts, spacers.dp8, spacers.dp24]]])
+  }, /*#__PURE__*/React.createElement(CircularLoader, {
+    small: true
+  })), message, /*#__PURE__*/React.createElement(_JSXStyle, {
+    id: "1068210086",
+    dynamic: [spacers.dp16, colors.grey700, theme.fonts, spacers.dp8, spacers.dp24]
+  }, [".container.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:".concat(spacers.dp16, ";-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;color:").concat(colors.grey700, ";font-family:").concat(theme.fonts, ";font-size:13px;padding:").concat(spacers.dp8, " ").concat(spacers.dp24, ";}")]));
+};
 Loading.propTypes = {
   dataTest: PropTypes.string.isRequired,
   className: PropTypes.string,

package/build/es/select/menu-wrapper.js

@@ -5,14 +5,15 @@ import { colors, elevations } from '@dhis2/ui-constants';
 import PropTypes from 'prop-types';
 import React from 'react';
 
-const MenuWrapper = ({
-  children,
-  dataTest,
-  maxHeight,
-  menuWidth,
-  onClick,
-  selectRef
-}) => {
+const MenuWrapper = _ref => {
+  let {
+    children,
+    dataTest,
+    maxHeight,
+    menuWidth,
+    onClick,
+    selectRef
+  } = _ref;
   return /*#__PURE__*/React.createElement(Layer, {
     onClick: onClick,
     transparent: true
@@ -21,12 +22,12 @@ const MenuWrapper = ({
     placement: "bottom-start",
     observeReferenceResize: true
   }, /*#__PURE__*/React.createElement("div", {
-    "data-test": `${dataTest}-menuwrapper`,
+    "data-test": "".concat(dataTest, "-menuwrapper"),
     className: _JSXStyle.dynamic([["1363246346", [menuWidth, maxHeight, colors.white, colors.grey200, elevations.e300]]])
   }, children, /*#__PURE__*/React.createElement(_JSXStyle, {
     id: "1363246346",
     dynamic: [menuWidth, maxHeight, colors.white, colors.grey200, elevations.e300]
-  }, [`div.__jsx-style-dynamic-selector{width:${menuWidth};height:auto;max-height:${maxHeight};overflow:auto;background:${colors.white};border:1px solid ${colors.grey200};border-radius:3px;box-shadow:${elevations.e300};}`]))));
+  }, ["div.__jsx-style-dynamic-selector{width:".concat(menuWidth, ";height:auto;max-height:").concat(maxHeight, ";overflow:auto;background:").concat(colors.white, ";border:1px solid ").concat(colors.grey200, ";border-radius:3px;box-shadow:").concat(elevations.e300, ";}")]))));
 };
 
 MenuWrapper.defaultProps = {

package/build/es/select/no-match.js

@@ -3,15 +3,18 @@ import { colors, spacers, theme } from '@dhis2/ui-constants';
 import PropTypes from 'prop-types';
 import React from 'react';
 
-const NoMatch = ({
-  message,
-  className
-}) => /*#__PURE__*/React.createElement("div", {
-  className: _JSXStyle.dynamic([["849993029", [colors.grey700, theme.fonts, spacers.dp8, spacers.dp24]]]) + " " + (className || "")
-}, message, /*#__PURE__*/React.createElement(_JSXStyle, {
-  id: "849993029",
-  dynamic: [colors.grey700, theme.fonts, spacers.dp8, spacers.dp24]
-}, [`div.__jsx-style-dynamic-selector{color:${colors.grey700};font-family:${theme.fonts};font-size:13px;line-height:16px;padding:${spacers.dp8} ${spacers.dp24};text-align:center;}`]));
+const NoMatch = _ref => {
+  let {
+    message,
+    className
+  } = _ref;
+  return /*#__PURE__*/React.createElement("div", {
+    className: _JSXStyle.dynamic([["849993029", [colors.grey700, theme.fonts, spacers.dp8, spacers.dp24]]]) + " " + (className || "")
+  }, message, /*#__PURE__*/React.createElement(_JSXStyle, {
+    id: "849993029",
+    dynamic: [colors.grey700, theme.fonts, spacers.dp8, spacers.dp24]
+  }, ["div.__jsx-style-dynamic-selector{color:".concat(colors.grey700, ";font-family:").concat(theme.fonts, ";font-size:13px;line-height:16px;padding:").concat(spacers.dp8, " ").concat(spacers.dp24, ";text-align:center;}")]));
+};
 
 NoMatch.propTypes = {
   message: PropTypes.string.isRequired,

package/build/es/select/select.js

@@ -12,8 +12,8 @@ const SPACE_KEY = 32;
 const UP_KEY = 38;
 const DOWN_KEY = 40;
 export class Select extends Component {
-  constructor(...args) {
-    super(...args);
+  constructor() {
+    super(...arguments);
 
     _defineProperty(this, "state", {
       open: false,
@@ -154,8 +154,8 @@ export class Select extends Component {
       menuWidth
     } = this.state;
 
-    if (offsetWidth && `${offsetWidth}px` !== menuWidth) {
-      return `${offsetWidth}px`;
+    if (offsetWidth && "".concat(offsetWidth, "px") !== menuWidth) {
+      return "".concat(offsetWidth, "px");
     }
 
     return menuWidth;
@@ -212,13 +212,13 @@ export class Select extends Component {
       valid: valid,
       disabled: disabled,
       dense: dense,
-      dataTest: `${dataTest}-input`
+      dataTest: "".concat(dataTest, "-input")
     }, input), open && /*#__PURE__*/React.createElement(MenuWrapper, {
       onClick: this.onOutsideClick,
       maxHeight: maxHeight,
       selectRef: this.selectRef,
       menuWidth: menuWidth,
-      dataTest: `${dataTest}-menu`
+      dataTest: "".concat(dataTest, "-menu")
     }, menu));
   }
 

package/build/es/single-select/features/menu_width_matches_input/index.js

@@ -24,7 +24,8 @@ When('the SingleSelect menu is open', () => {
 Then('the SingleSelect input is left aligned with the menu', () => {
   const selectDataTest = '[data-test="dhis2-uicore-singleselect"]';
   const menuDataTest = '[data-test="dhis2-uicore-select-menu-menuwrapper"]';
-  cy.getAll(selectDataTest, menuDataTest).should(([inputs, menus]) => {
+  cy.getAll(selectDataTest, menuDataTest).should(_ref => {
+    let [inputs, menus] = _ref;
     expect(inputs.length).to.equal(1);
     expect(menus.length).to.equal(1);
     const $input = inputs[0];
@@ -37,7 +38,8 @@ Then('the SingleSelect input is left aligned with the menu', () => {
 When('the SingleSelect input and menu have the same width', () => {
   const inputSelector = '[data-test="dhis2-uicore-select"]';
   const menuSelector = '[data-test="dhis2-uicore-select-menu-menuwrapper"]';
-  cy.getAll(inputSelector, menuSelector).should(([$input, $menu]) => {
+  cy.getAll(inputSelector, menuSelector).should(_ref2 => {
+    let [$input, $menu] = _ref2;
     const inputWidth = Math.round($input.outerWidth());
     const menuWidth = Math.round($menu.outerWidth());
     expect(inputWidth).to.equal(menuWidth);

package/build/es/single-select/features/position/index.js

@@ -21,7 +21,8 @@ When('the window is scrolled down', () => {
 Then('the top of the menu is aligned with the bottom of the input', () => {
   const selectDataTest = '[data-test="dhis2-uicore-singleselect"]';
   const menuDataTest = '[data-test="dhis2-uicore-select-menu-menuwrapper"]';
-  cy.getAll(selectDataTest, menuDataTest).should(([selects, menus]) => {
+  cy.getAll(selectDataTest, menuDataTest).should(_ref => {
+    let [selects, menus] = _ref;
     expect(selects.length).to.equal(1);
     expect(menus.length).to.equal(1);
     const $select = selects[0];
@@ -34,7 +35,8 @@ Then('the top of the menu is aligned with the bottom of the input', () => {
 Then('the bottom of the menu is aligned with the top of the input', () => {
   const selectDataTest = '[data-test="dhis2-uicore-singleselect"]';
   const menuDataTest = '[data-test="dhis2-uicore-select-menu-menuwrapper"]';
-  cy.getAll(selectDataTest, menuDataTest).should(([selects, menus]) => {
+  cy.getAll(selectDataTest, menuDataTest).should(_ref2 => {
+    let [selects, menus] = _ref2;
     expect(selects.length).to.equal(1);
     expect(menus.length).to.equal(1);
     const $select = selects[0];
@@ -47,7 +49,8 @@ Then('the bottom of the menu is aligned with the top of the input', () => {
 Then('it is rendered on top of the SingleSelect', () => {
   const selectDataTest = '[data-test="dhis2-uicore-singleselect"]';
   const menuDataTest = '[data-test="dhis2-uicore-select-menu-menuwrapper"]';
-  cy.getAll(selectDataTest, menuDataTest).should(([selects, menus]) => {
+  cy.getAll(selectDataTest, menuDataTest).should(_ref3 => {
+    let [selects, menus] = _ref3;
     expect(selects.length).to.equal(1);
     expect(menus.length).to.equal(1);
     const $select = selects[0];
@@ -61,7 +64,8 @@ Then('it is rendered on top of the SingleSelect', () => {
 Then('the left of the SingleSelect is aligned with the left of the anchor', () => {
   const selectDataTest = '[data-test="dhis2-uicore-singleselect"]';
   const menuDataTest = '[data-test="dhis2-uicore-select-menu-menuwrapper"]';
-  cy.getAll(selectDataTest, menuDataTest).should(([selects, menus]) => {
+  cy.getAll(selectDataTest, menuDataTest).should(_ref4 => {
+    let [selects, menus] = _ref4;
     expect(selects.length).to.equal(1);
     expect(menus.length).to.equal(1);
     const $select = selects[0];

package/build/es/single-select/filterable-menu.js

@@ -2,28 +2,31 @@ import PropTypes from 'prop-types';
 import React from 'react';
 import { FilterableMenu as CommonFilterableMenu } from '../select/index.js';
 import { Menu } from './menu.js';
-export const FilterableMenu = ({
-  dataTest,
-  options,
-  onChange,
-  selected,
-  empty,
-  handleClose,
-  handleFocusInput,
-  placeholder,
-  noMatchText
-}) => /*#__PURE__*/React.createElement(CommonFilterableMenu, {
-  dataTest: dataTest,
-  options: options,
-  onChange: onChange,
-  selected: selected,
-  empty: empty,
-  handleClose: handleClose,
-  handleFocusInput: handleFocusInput,
-  placeholder: placeholder,
-  noMatchText: noMatchText,
-  Menu: Menu
-});
+export const FilterableMenu = _ref => {
+  let {
+    dataTest,
+    options,
+    onChange,
+    selected,
+    empty,
+    handleClose,
+    handleFocusInput,
+    placeholder,
+    noMatchText
+  } = _ref;
+  return /*#__PURE__*/React.createElement(CommonFilterableMenu, {
+    dataTest: dataTest,
+    options: options,
+    onChange: onChange,
+    selected: selected,
+    empty: empty,
+    handleClose: handleClose,
+    handleFocusInput: handleFocusInput,
+    placeholder: placeholder,
+    noMatchText: noMatchText,
+    Menu: Menu
+  });
+};
 FilterableMenu.propTypes = {
   dataTest: PropTypes.string.isRequired,
   noMatchText: PropTypes.string.isRequired,

package/build/es/single-select/input.js

@@ -7,19 +7,20 @@ import React from 'react';
 import { InputClearButton, InputPlaceholder, InputPrefix } from '../select/index.js';
 import { Selection } from './selection.js';
 
-const Input = ({
-  selected,
-  onChange,
-  clearable,
-  clearText,
-  placeholder,
-  dataTest,
-  prefix,
-  options,
-  className,
-  disabled,
-  inputMaxHeight
-}) => {
+const Input = _ref => {
+  let {
+    selected,
+    onChange,
+    clearable,
+    clearText,
+    placeholder,
+    dataTest,
+    prefix,
+    options,
+    className,
+    disabled,
+    inputMaxHeight
+  } = _ref;
   const hasSelection = selected && typeof selected === 'string';
 
   const onClear = (_, e) => {
@@ -34,10 +35,10 @@ const Input = ({
     className: _JSXStyle.dynamic([["1360178250", [colors.grey900]], ["1331770409", [inputMaxHeight]]]) + " " + (cx('root', className) || "")
   }, /*#__PURE__*/React.createElement(InputPrefix, {
     prefix: prefix,
-    dataTest: `${dataTest}-prefix`
+    dataTest: "".concat(dataTest, "-prefix")
   }), !hasSelection && !prefix && /*#__PURE__*/React.createElement(InputPlaceholder, {
     placeholder: placeholder,
-    dataTest: `${dataTest}-placeholder`
+    dataTest: "".concat(dataTest, "-placeholder")
   }), hasSelection && /*#__PURE__*/React.createElement("div", {
     className: _JSXStyle.dynamic([["1360178250", [colors.grey900]], ["1331770409", [inputMaxHeight]]]) + " " + "root-input"
   }, /*#__PURE__*/React.createElement(Selection, {
@@ -48,14 +49,14 @@ const Input = ({
   }, /*#__PURE__*/React.createElement(InputClearButton, {
     onClear: onClear,
     clearText: clearText,
-    dataTest: `${dataTest}-clear`
+    dataTest: "".concat(dataTest, "-clear")
   })), /*#__PURE__*/React.createElement(_JSXStyle, {
     id: "1360178250",
     dynamic: [colors.grey900]
-  }, [`.root.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:${colors.grey900};font-size:14px;line-height:16px;}`, ".root-input.__jsx-style-dynamic-selector{overflow-y:auto;-webkit-flex:1;-ms-flex:1;flex:1;}", ".root-right.__jsx-style-dynamic-selector{margin-left:auto;margin-right:10px;}"]), /*#__PURE__*/React.createElement(_JSXStyle, {
+  }, [".root.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:".concat(colors.grey900, ";font-size:14px;line-height:16px;}"), ".root-input.__jsx-style-dynamic-selector{overflow-y:auto;-webkit-flex:1;-ms-flex:1;flex:1;}", ".root-right.__jsx-style-dynamic-selector{margin-left:auto;margin-right:10px;}"]), /*#__PURE__*/React.createElement(_JSXStyle, {
     id: "1331770409",
     dynamic: [inputMaxHeight]
-  }, [`.root-input.__jsx-style-dynamic-selector{max-height:${inputMaxHeight};}`]));
+  }, [".root-input.__jsx-style-dynamic-selector{max-height:".concat(inputMaxHeight, ";}")]));
 };
 
 Input.defaultProps = {

package/build/es/single-select/menu.js

@@ -7,15 +7,16 @@ const onIgnoredClick = (_, e) => {
   e.preventDefault();
 };
 
-const Menu = ({
-  options,
-  onChange,
-  selected,
-  empty,
-  handleFocusInput,
-  handleClose,
-  dataTest
-}) => {
+const Menu = _ref => {
+  let {
+    options,
+    onChange,
+    selected,
+    empty,
+    handleFocusInput,
+    handleClose,
+    dataTest
+  } = _ref;
   const renderedOptions = filterIgnored(options);
 
   if (React.Children.count(renderedOptions) === 0) {
@@ -23,7 +24,7 @@ const Menu = ({
     if (typeof empty === 'string') {
       return /*#__PURE__*/React.createElement(Empty, {
         message: empty,
-        dataTest: `${dataTest}-empty`
+        dataTest: "".concat(dataTest, "-empty")
       });
     } // Otherwise just render the supplied markup