@dhis2-ui/transfer 9.11.0 → 9.11.1-beta.2

package/build/cjs/features/filter-options-list/index.js

@@ -1,12 +1,12 @@
 "use strict";
 
 var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
-
 var _index = require("../common/index.js");
-
-(0, _cypressCucumberPreprocessor.Given)('filtering is enabled', () => {// no op
+(0, _cypressCucumberPreprocessor.Given)('filtering is enabled', () => {
+  // no op
 });
-(0, _cypressCucumberPreprocessor.Given)('the options list is being filtered', () => {// no op
+(0, _cypressCucumberPreprocessor.Given)('the options list is being filtered', () => {
+  // no op
 });
 (0, _cypressCucumberPreprocessor.Given)('the result is not empty', () => {
   cy.visitStory('Transfer filtering', 'Some Results');
@@ -14,7 +14,8 @@ var _index = require("../common/index.js");
 (0, _cypressCucumberPreprocessor.Given)('the result is empty', () => {
   cy.visitStory('Transfer filtering', 'Empty Result');
 });
-(0, _cypressCucumberPreprocessor.Given)('a no-result message has been provided', () => {// no op
+(0, _cypressCucumberPreprocessor.Given)('a no-result message has been provided', () => {
+  // no op
 });
 (0, _cypressCucumberPreprocessor.Given)('the options are being search with a {string} search term', firstCase => {
   if (firstCase === 'uppercase') {
@@ -22,7 +23,6 @@ var _index = require("../common/index.js");
   } else if (firstCase === 'lowercase') {
     cy.visitStory('Transfer filtering', 'Lowercase Search');
   }
-
   cy.get('{transfer-filter} input').then($input => $input.val()).as('firstCaseTerm');
 });
 (0, _cypressCucumberPreprocessor.Given)('some options are listed', () => {
@@ -38,13 +38,11 @@ var _index = require("../common/index.js");
   cy.all(() => cy.get('@firstCaseTerm'), () => cy.get('{transfer-filter} input')).then(_ref => {
     let [firstCaseTerm, $filterInput] = _ref;
     let secondCaseTerm;
-
     if (secondCase === 'uppercase') {
       secondCaseTerm = firstCaseTerm.toUpperCase();
     } else if (secondCase === 'lowercase') {
       secondCaseTerm = firstCaseTerm.toLowerCase();
     }
-
     cy.wrap($filterInput).clear().type(secondCaseTerm);
   });
 });

package/build/cjs/features/highlight-range-of-options/index.js

@@ -1,9 +1,7 @@
 "use strict";
 
 var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
-
 var _index2 = require("../common/index.js");
-
 (0, _cypressCucumberPreprocessor.Given)('the option list has one or more items', () => {
   cy.visitStory('Transfer highlight range of options', 'Has Options');
   cy.get('{transfer-sourceoptions}').as('list').find('{transferoption}').should('have.length.of.at.least', 1);
@@ -53,9 +51,14 @@ var _index2 = require("../common/index.js");
   cy.get('@secondBelowInitiallyHighlighted').clickWith('shift');
 });
 (0, _cypressCucumberPreprocessor.When)('the user highlightes the second options following the last highlighted option', () => {
-  cy.get('@initiallyHighlightedMultiple') // last highlighted option
-  .last() // next sibling
-  .next().as('firstBelowLastHighlighted') // second next sibling
+  cy.get('@initiallyHighlightedMultiple')
+  // last highlighted option
+  .last()
+
+  // next sibling
+  .next().as('firstBelowLastHighlighted')
+
+  // second next sibling
   .next().as('secondBelowLastHighlighted').clickWith('shift');
 });
 (0, _cypressCucumberPreprocessor.When)('the user {string} clicks a highlighted option', modifierKey => {

package/build/cjs/features/loading_lists/index.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
-
 (0, _cypressCucumberPreprocessor.Given)('the source list is loading', () => {
   cy.visitStory('Transfer Loading Lists', 'Loading Source');
   cy.wrap('source').as('listType');
@@ -21,12 +20,12 @@ var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preproces
 (0, _cypressCucumberPreprocessor.Then)('the loading indicator should be shown', () => {
   cy.get('@listType').then(listType => {
     const listSelector = listType === 'source' ? '{transfer-leftside}' : '{transfer-rightside}';
-    cy.get("".concat(listSelector, " .loading")).should('exist');
+    cy.get(`${listSelector} .loading`).should('exist');
   });
 });
 (0, _cypressCucumberPreprocessor.Then)('the loading indicator should not be shown', () => {
   cy.get('@listType').then(listType => {
     const listSelector = listType === 'source' ? '{transfer-leftside}' : '{transfer-rightside}';
-    cy.get("".concat(listSelector, " .loading")).should('not.exist');
+    cy.get(`${listSelector} .loading`).should('not.exist');
   });
 });

package/build/cjs/features/notify_at_end_of_list/index.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
-
 (0, _cypressCucumberPreprocessor.Given)('the Transfer has enough items to fill the source list completely', () => {
   cy.visitStory('Transfer End Of List', 'Full Source List');
   cy.wrap('source').as('listType');
@@ -21,7 +20,7 @@ var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preproces
 (0, _cypressCucumberPreprocessor.When)('the user scroll to the end of the list', () => {
   cy.get('@listType').then(listType => {
     const listSelector = listType === 'source' ? 'transfer-sourceoptions' : 'transfer-pickedoptions';
-    cy.get("{".concat(listSelector, "-endintersectiondetector}")).scrollIntoView();
+    cy.get(`{${listSelector}-endintersectiondetector}`).scrollIntoView();
   });
 });
 (0, _cypressCucumberPreprocessor.Then)('the callback for reaching the end should not be called', () => {

package/build/cjs/features/reorder-with-buttons/index.js

@@ -1,8 +1,8 @@
 "use strict";
 
 var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
-
-(0, _cypressCucumberPreprocessor.Given)('reordering of items is enabled', () => {// no op
+(0, _cypressCucumberPreprocessor.Given)('reordering of items is enabled', () => {
+  // no op
 });
 (0, _cypressCucumberPreprocessor.Given)('the selected list has three items', () => {
   cy.visitStory('Transfer Reorder Buttons', 'Has Some Selected');
@@ -38,7 +38,7 @@ var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preproces
 });
 (0, _cypressCucumberPreprocessor.Then)('the highlighted item should be moved to the {int}. place', next => {
   const index = next - 1;
-  cy.get('@previousValue').then(previousValue => cy.get("[data-value=\"".concat(previousValue, "\"]"))).invoke('index').should('equal', index);
+  cy.get('@previousValue').then(previousValue => cy.get(`[data-value="${previousValue}"]`)).invoke('index').should('equal', index);
 });
 (0, _cypressCucumberPreprocessor.Then)("the 'move up' and 'move down' buttons should be disabled", () => {
   cy.get('{transfer-reorderingactions-buttonmoveup}').should('have.attr', 'disabled');

package/build/cjs/features/set_unset-highlighted-option/index.js

@@ -1,9 +1,7 @@
 "use strict";
 
 var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
-
 var _index = require("../common/index.js");
-
 (0, _cypressCucumberPreprocessor.Given)('the option list has one or more items', () => {
   cy.visitStory('Transfer set & unset higlighted options', 'Has Options');
   cy.get('{transfer-sourceoptions}').as('list');

package/build/cjs/features/transferring-items/index.js

@@ -1,11 +1,8 @@
 "use strict";
 
 var _cypressCucumberPreprocessor = require("@badeball/cypress-cucumber-preprocessor");
-
 var _parseSelectorWithDataTest = require("../../../../../cypress/support/common/parseSelectorWithDataTest.js");
-
 var _index = require("../common/index.js");
-
 (0, _cypressCucumberPreprocessor.Given)('some options are selectable', () => {
   cy.visitStory('Transfer Transferring Items', 'Has Options');
 });
@@ -13,15 +10,18 @@ var _index = require("../common/index.js");
   cy.visitStory('Transfer Transferring Items', 'Some Selected');
 });
 (0, _cypressCucumberPreprocessor.Given)('one or more items in the options list are highlighted', () => {
-  cy.get('{transfer-sourceoptions} {transferoption}').filter(index => index < 3) // shuffle order so we can check they're added in the right order
+  cy.get('{transfer-sourceoptions} {transferoption}').filter(index => index < 3)
+  // shuffle order so we can check they're added in the right order
   .then($options => cy.wrap([$options[2], $options[0], $options[1]])).each($option => cy.wrap($option).clickWith('ctrl')).then($options => $options.toArray().map(_index.extractOptionFromElement)).as('itemsToBeSelected');
 });
 (0, _cypressCucumberPreprocessor.Given)('some items in the options list are highlighted', () => {
-  cy.get('{transfer-sourceoptions} {transferoption}').filter(index => index < 3) // shuffle order so we can check they're added in the right order
+  cy.get('{transfer-sourceoptions} {transferoption}').filter(index => index < 3)
+  // shuffle order so we can check they're added in the right order
   .then($options => cy.wrap([$options[2], $options[0], $options[1]])).each($option => cy.wrap($option).clickWith('ctrl')).then($options => $options.toArray().map(_index.extractOptionFromElement)).as('itemsToBeSelected');
 });
 (0, _cypressCucumberPreprocessor.Given)('some items in the selected list are highlighted', () => {
-  cy.get('{transfer-pickedoptions} {transferoption}').filter(index => index < 3) // shuffle order so we can check they're added in the right order
+  cy.get('{transfer-pickedoptions} {transferoption}').filter(index => index < 3)
+  // shuffle order so we can check they're added in the right order
   .then($options => cy.wrap([$options[2], $options[0], $options[1]])).each($option => cy.wrap($option).clickWith('ctrl')).then($options => $options.toArray().map(_index.extractOptionFromElement)).as('itemsToBeDeselected');
 });
 (0, _cypressCucumberPreprocessor.When)("the user clicks the 'move to selected list' button", () => {

package/build/cjs/filter.js

@@ -4,21 +4,13 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Filter = void 0;
-
 var _style = _interopRequireDefault(require("styled-jsx/style"));
-
+var _uiConstants = require("@dhis2/ui-constants");
 var _field = require("@dhis2-ui/field");
-
 var _input = require("@dhis2-ui/input");
-
-var _uiConstants = require("@dhis2/ui-constants");
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _react = _interopRequireDefault(require("react"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const Filter = _ref => {
   let {
     dataTest,
@@ -33,9 +25,9 @@ const Filter = _ref => {
   }, /*#__PURE__*/_react.default.createElement(_field.Field, {
     label: label,
     name: dataTest,
-    dataTest: "".concat(dataTest, "-field")
+    dataTest: `${dataTest}-field`
   }, /*#__PURE__*/_react.default.createElement(_input.Input, {
-    dataTest: "".concat(dataTest, "-input"),
+    dataTest: `${dataTest}-input`,
     type: "search",
     placeholder: placeholder,
     value: filter,
@@ -43,9 +35,8 @@ const Filter = _ref => {
   })), /*#__PURE__*/_react.default.createElement(_style.default, {
     id: "3679907342",
     dynamic: [_uiConstants.spacers.dp8, _uiConstants.spacers.dp8]
-  }, ["div.__jsx-style-dynamic-selector{padding-bottom:".concat(_uiConstants.spacers.dp8, ";}"), "div.__jsx-style-dynamic-selector:first-child{padding-top:".concat(_uiConstants.spacers.dp8, ";}")]));
+  }, [`div.__jsx-style-dynamic-selector{padding-bottom:${_uiConstants.spacers.dp8};}`, `div.__jsx-style-dynamic-selector:first-child{padding-top:${_uiConstants.spacers.dp8};}`]));
 };
-
 exports.Filter = Filter;
 Filter.propTypes = {
   dataTest: _propTypes.default.string.isRequired,

package/build/cjs/icons.js

@@ -4,27 +4,20 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.IconRemoveIndividual = exports.IconRemoveAll = exports.IconMoveUp = exports.IconMoveDown = exports.IconAddIndividual = exports.IconAddAll = void 0;
-
 var _style = _interopRequireDefault(require("styled-jsx/style"));
-
 var _uiConstants = require("@dhis2/ui-constants");
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _react = _interopRequireDefault(require("react"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const centerButtonStyles = ["svg.jsx-2392683210{min-width:20px;}", "div.centerButton.jsx-2392683210:dir(rtl){-webkit-transform:rotate(180deg) translateX(4px);-ms-transform:rotate(180deg) translateX(4px);transform:rotate(180deg) translateX(4px);}"];
 centerButtonStyles.__hash = "2392683210";
-
 const IconAddAll = _ref => {
   let {
     dataTest,
     disabled
   } = _ref;
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: "jsx-".concat(centerButtonStyles.__hash) + " " + "centerButton"
+    className: `jsx-${centerButtonStyles.__hash}` + " " + "centerButton"
   }, /*#__PURE__*/_react.default.createElement("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "16",
@@ -32,36 +25,34 @@ const IconAddAll = _ref => {
     viewBox: "0 0 16 16",
     "data-test": dataTest,
     fill: disabled ? _uiConstants.theme.disabled : '#404B5A',
-    className: "jsx-".concat(centerButtonStyles.__hash)
+    className: `jsx-${centerButtonStyles.__hash}`
   }, /*#__PURE__*/_react.default.createElement("g", {
     fillRule: "evenodd",
-    className: "jsx-".concat(centerButtonStyles.__hash)
+    className: `jsx-${centerButtonStyles.__hash}`
   }, /*#__PURE__*/_react.default.createElement("polygon", {
     fillRule: "nonzero",
     points: "6 2 4.94 3.06 9.13 7.25 0 7.25 0 8.75 9.13 8.75 4.94 12.94 6 14 12 8",
-    className: "jsx-".concat(centerButtonStyles.__hash)
+    className: `jsx-${centerButtonStyles.__hash}`
   }), /*#__PURE__*/_react.default.createElement("polygon", {
     fillRule: "nonzero",
     points: "10 2 8.94 3.06 13.13 7.25 13.9 8 13.13 8.75 8.94 12.94 10 14 16 8",
-    className: "jsx-".concat(centerButtonStyles.__hash)
+    className: `jsx-${centerButtonStyles.__hash}`
   }))), /*#__PURE__*/_react.default.createElement(_style.default, {
     id: centerButtonStyles.__hash
   }, centerButtonStyles));
 };
-
 exports.IconAddAll = IconAddAll;
 IconAddAll.propTypes = {
   dataTest: _propTypes.default.string.isRequired,
   disabled: _propTypes.default.bool
 };
-
 const IconAddIndividual = _ref2 => {
   let {
     dataTest,
     disabled
   } = _ref2;
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: "jsx-".concat(centerButtonStyles.__hash) + " " + "centerButton"
+    className: `jsx-${centerButtonStyles.__hash}` + " " + "centerButton"
   }, /*#__PURE__*/_react.default.createElement("svg", {
     fill: disabled ? _uiConstants.theme.disabled : '#404B5A',
     xmlns: "http://www.w3.org/2000/svg",
@@ -69,28 +60,26 @@ const IconAddIndividual = _ref2 => {
     height: "16",
     viewBox: "0 0 16 16",
     "data-test": dataTest,
-    className: "jsx-".concat(centerButtonStyles.__hash)
+    className: `jsx-${centerButtonStyles.__hash}`
   }, /*#__PURE__*/_react.default.createElement("polygon", {
     points: "8 2 6.94 3.06 11.13 7.25 2 7.25 2 8.75 11.13 8.75 6.94 12.94 8 14 14 8",
-    className: "jsx-".concat(centerButtonStyles.__hash)
+    className: `jsx-${centerButtonStyles.__hash}`
   })), /*#__PURE__*/_react.default.createElement(_style.default, {
     id: centerButtonStyles.__hash
   }, centerButtonStyles));
 };
-
 exports.IconAddIndividual = IconAddIndividual;
 IconAddIndividual.propTypes = {
   dataTest: _propTypes.default.string.isRequired,
   disabled: _propTypes.default.bool
 };
-
 const IconRemoveAll = _ref3 => {
   let {
     dataTest,
     disabled
   } = _ref3;
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: "jsx-".concat(centerButtonStyles.__hash) + " " + "centerButton"
+    className: `jsx-${centerButtonStyles.__hash}` + " " + "centerButton"
   }, /*#__PURE__*/_react.default.createElement("svg", {
     fill: disabled ? _uiConstants.theme.disabled : '#404B5A',
     width: "16px",
@@ -98,38 +87,36 @@ const IconRemoveAll = _ref3 => {
     viewBox: "0 0 16 16",
     "data-test": dataTest,
     xmlns: "http://www.w3.org/2000/svg",
-    className: "jsx-".concat(centerButtonStyles.__hash)
+    className: `jsx-${centerButtonStyles.__hash}`
   }, /*#__PURE__*/_react.default.createElement("g", {
     fillRule: "evenodd",
-    className: "jsx-".concat(centerButtonStyles.__hash)
+    className: `jsx-${centerButtonStyles.__hash}`
   }, /*#__PURE__*/_react.default.createElement("polygon", {
     fillRule: "nonzero",
     points: "10 2 8.94 3.06 13.13 7.25 4 7.25 4 8.75 13.13 8.75 8.94 12.94 10 14 16 8",
     transform: "matrix(-1 0 0 1 20 0)",
-    className: "jsx-".concat(centerButtonStyles.__hash)
+    className: `jsx-${centerButtonStyles.__hash}`
   }), /*#__PURE__*/_react.default.createElement("polygon", {
     fillRule: "nonzero",
     points: "1.06 2 0 3.06 4.19 7.25 4.96 8 4.19 8.75 0 12.94 1.06 14 7.06 8",
     transform: "matrix(-1 0 0 1 7.06 0)",
-    className: "jsx-".concat(centerButtonStyles.__hash)
+    className: `jsx-${centerButtonStyles.__hash}`
   }))), /*#__PURE__*/_react.default.createElement(_style.default, {
     id: centerButtonStyles.__hash
   }, centerButtonStyles));
 };
-
 exports.IconRemoveAll = IconRemoveAll;
 IconRemoveAll.propTypes = {
   dataTest: _propTypes.default.string.isRequired,
   disabled: _propTypes.default.bool
 };
-
 const IconRemoveIndividual = _ref4 => {
   let {
     dataTest,
     disabled
   } = _ref4;
   return /*#__PURE__*/_react.default.createElement("div", {
-    className: "jsx-".concat(centerButtonStyles.__hash) + " " + "centerButton"
+    className: `jsx-${centerButtonStyles.__hash}` + " " + "centerButton"
   }, /*#__PURE__*/_react.default.createElement("svg", {
     fill: disabled ? _uiConstants.theme.disabled : '#404B5A',
     xmlns: "http://www.w3.org/2000/svg",
@@ -137,22 +124,20 @@ const IconRemoveIndividual = _ref4 => {
     height: "16",
     viewBox: "0 0 16 16",
     "data-test": dataTest,
-    className: "jsx-".concat(centerButtonStyles.__hash)
+    className: `jsx-${centerButtonStyles.__hash}`
   }, /*#__PURE__*/_react.default.createElement("polygon", {
     points: "8 2 6.94 3.06 11.13 7.25 2 7.25 2 8.75 11.13 8.75 6.94 12.94 8 14 14 8",
     transform: "matrix(-1 0 0 1 16 0)",
-    className: "jsx-".concat(centerButtonStyles.__hash)
+    className: `jsx-${centerButtonStyles.__hash}`
   })), /*#__PURE__*/_react.default.createElement(_style.default, {
     id: centerButtonStyles.__hash
   }, centerButtonStyles));
 };
-
 exports.IconRemoveIndividual = IconRemoveIndividual;
 IconRemoveIndividual.propTypes = {
   dataTest: _propTypes.default.string.isRequired,
   disabled: _propTypes.default.bool
 };
-
 const IconMoveDown = _ref5 => {
   let {
     dataTest,
@@ -170,13 +155,11 @@ const IconMoveDown = _ref5 => {
     transform: "matrix(0 1 1 0 0 0)"
   }));
 };
-
 exports.IconMoveDown = IconMoveDown;
 IconMoveDown.propTypes = {
   dataTest: _propTypes.default.string.isRequired,
   disabled: _propTypes.default.bool
 };
-
 const IconMoveUp = _ref6 => {
   let {
     dataTest,
@@ -194,7 +177,6 @@ const IconMoveUp = _ref6 => {
     transform: "rotate(-90 8 8)"
   }));
 };
-
 exports.IconMoveUp = IconMoveUp;
 IconMoveUp.propTypes = {
   dataTest: _propTypes.default.string.isRequired,

package/build/cjs/index.js

@@ -15,7 +15,5 @@ Object.defineProperty(exports, "TransferOption", {
     return _transferOption.TransferOption;
   }
 });
-
 var _transfer = require("./transfer.js");
-
 var _transferOption = require("./transfer-option.js");

package/build/cjs/left-footer.js

@@ -4,19 +4,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.LeftFooter = void 0;
-
 var _style = _interopRequireDefault(require("styled-jsx/style"));
-
 var _uiConstants = require("@dhis2/ui-constants");
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _index = require("./common/index.js");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const LeftFooter = _ref => {
   let {
     children,
@@ -28,9 +21,8 @@ const LeftFooter = _ref => {
   }, children, /*#__PURE__*/_react.default.createElement(_style.default, {
     id: "3629116366",
     dynamic: [_index.borderColor, _uiConstants.spacers.dp8]
-  }, ["div.__jsx-style-dynamic-selector{-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;border-top:1px solid ".concat(borderColor, ";padding:0 ").concat(_uiConstants.spacers.dp8, ";}")]));
+  }, [`div.__jsx-style-dynamic-selector{-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;border-top:1px solid ${borderColor};padding:0 ${_uiConstants.spacers.dp8};}`]));
 };
-
 exports.LeftFooter = LeftFooter;
 LeftFooter.propTypes = {
   children: _propTypes.default.node,

package/build/cjs/left-header.js

@@ -4,19 +4,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.LeftHeader = void 0;
-
 var _style = _interopRequireDefault(require("styled-jsx/style"));
-
 var _uiConstants = require("@dhis2/ui-constants");
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _index = require("./common/index.js");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const LeftHeader = _ref => {
   let {
     children,
@@ -28,9 +21,8 @@ const LeftHeader = _ref => {
   }, children, /*#__PURE__*/_react.default.createElement(_style.default, {
     id: "2175954399",
     dynamic: [_index.borderColor, _uiConstants.spacers.dp8]
-  }, ["div.__jsx-style-dynamic-selector{border-bottom:1px solid ".concat(borderColor, ";-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;padding:0 ").concat(_uiConstants.spacers.dp8, ";}")]));
+  }, [`div.__jsx-style-dynamic-selector{border-bottom:1px solid ${borderColor};-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;padding:0 ${_uiConstants.spacers.dp8};}`]));
 };
-
 exports.LeftHeader = LeftHeader;
 LeftHeader.propTypes = {
   children: _propTypes.default.node,

package/build/cjs/left-side.js

@@ -4,17 +4,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.LeftSide = void 0;
-
 var _style = _interopRequireDefault(require("styled-jsx/style"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _index = require("./common/index.js");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const LeftSide = _ref => {
   let {
     children,
@@ -32,9 +26,8 @@ const LeftSide = _ref => {
   '', /*#__PURE__*/_react.default.createElement(_style.default, {
     id: "4143353612",
     dynamic: [_index.backgroundColor, _index.borderRadius, _index.borderColor, width]
-  }, ["div.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;background-color:".concat(backgroundColor, ";border-radius:").concat(borderRadius, ";border:1px solid ").concat(borderColor, ";min-height:240px;max-width:100%;width:").concat(width, ";}")]));
+  }, [`div.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;background-color:${backgroundColor};border-radius:${borderRadius};border:1px solid ${borderColor};min-height:240px;max-width:100%;width:${width};}`]));
 };
-
 exports.LeftSide = LeftSide;
 LeftSide.propTypes = {
   width: _propTypes.default.string.isRequired,

package/build/cjs/options-container.js

@@ -4,27 +4,16 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.OptionsContainer = void 0;
-
 var _style = _interopRequireDefault(require("styled-jsx/style"));
-
-var _loader = require("@dhis2-ui/loader");
-
 var _uiConstants = require("@dhis2/ui-constants");
-
+var _loader = require("@dhis2-ui/loader");
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _endIntersectionDetector = require("./end-intersection-detector.js");
-
 var _useResizeCounter = require("./use-resize-counter.js");
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (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 _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const OptionsContainer = _ref => {
   let {
     dataTest,
@@ -57,22 +46,22 @@ const OptionsContainer = _ref => {
     const highlighted = !!highlightedOptions.find(highlightedSourceOption => highlightedSourceOption === option.value);
     return /*#__PURE__*/_react.default.createElement(_react.Fragment, {
       key: option.value
-    }, renderOption({ ...option,
+    }, renderOption({
+      ...option,
       ...getOptionClickHandlers(option, selectionHandler, toggleHighlightedOption),
       highlighted,
       selected
     }));
   }), onEndReached && /*#__PURE__*/_react.default.createElement(_endIntersectionDetector.EndIntersectionDetector, {
-    dataTest: "".concat(dataTest, "-endintersectiondetector"),
-    key: "key-".concat(resizeCounter),
+    dataTest: `${dataTest}-endintersectiondetector`,
+    key: `key-${resizeCounter}`,
     rootRef: optionsRef,
     onEndReached: onEndReached
   }))), /*#__PURE__*/_react.default.createElement(_style.default, {
     id: "3254058061",
     dynamic: [_uiConstants.spacers.dp4]
-  }, [".optionsContainer.__jsx-style-dynamic-selector{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;padding:".concat(_uiConstants.spacers.dp4, " 0;position:relative;overflow:hidden;}"), ".container.__jsx-style-dynamic-selector{overflow-y:auto;height:100%;}", ".loading.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;height:100%;width:100%;-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;position:absolute;z-index:2;top:0;inset-inline-start:0;}", ".content-container.__jsx-style-dynamic-selector{z-index:1;position:relative;}", ".loading.__jsx-style-dynamic-selector+.container.__jsx-style-dynamic-selector .content-container.__jsx-style-dynamic-selector{-webkit-filter:blur(2px);filter:blur(2px);}"]));
+  }, [`.optionsContainer.__jsx-style-dynamic-selector{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;padding:${_uiConstants.spacers.dp4} 0;position:relative;overflow:hidden;}`, ".container.__jsx-style-dynamic-selector{overflow-y:auto;height:100%;}", ".loading.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;height:100%;width:100%;-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;position:absolute;z-index:2;top:0;inset-inline-start:0;}", ".content-container.__jsx-style-dynamic-selector{z-index:1;position:relative;}", ".loading.__jsx-style-dynamic-selector+.container.__jsx-style-dynamic-selector .content-container.__jsx-style-dynamic-selector{-webkit-filter:blur(2px);filter:blur(2px);}"]));
 };
-
 exports.OptionsContainer = OptionsContainer;
 OptionsContainer.defaultProps = {
   selected: false

package/build/cjs/picked-options.js

@@ -4,19 +4,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.PickedOptions = void 0;
-
 var _style = _interopRequireDefault(require("styled-jsx/style"));
-
 var _uiConstants = require("@dhis2/ui-constants");
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _endIntersectionDetector = require("./end-intersection-detector.js");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const PickedOptions = _ref => {
   let {
     children,
@@ -37,9 +30,8 @@ const PickedOptions = _ref => {
   })), /*#__PURE__*/_react.default.createElement(_style.default, {
     id: "392419471",
     dynamic: [_uiConstants.spacers.dp4]
-  }, [".container.__jsx-style-dynamic-selector{padding:".concat(_uiConstants.spacers.dp4, " 0;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;overflow-y:auto;}"), ".content-container.__jsx-style-dynamic-selector{position:relative;}"]));
+  }, [`.container.__jsx-style-dynamic-selector{padding:${_uiConstants.spacers.dp4} 0;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;overflow-y:auto;}`, ".content-container.__jsx-style-dynamic-selector{position:relative;}"]));
 };
-
 exports.PickedOptions = PickedOptions;
 PickedOptions.propTypes = {
   children: _propTypes.default.node.isRequired,