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

package/build/cjs/transfer/use-filter.js

@@ -4,11 +4,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useFilter = void 0;
-
 var _react = require("react");
-
 const identity = value => value;
-
 const useFilter = _ref => {
   let {
     initialSearchTerm,
@@ -26,5 +23,4 @@ const useFilter = _ref => {
     setInternalFilter
   };
 };
-
 exports.useFilter = useFilter;

package/build/cjs/transfer/use-highlighted-options/create-toggle-highlighted-option.js

@@ -4,15 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.createToggleHighlightedOption = void 0;
-
 var _index = require("../../common/index.js");
-
 var _toggleAdd = require("./toggle-add.js");
-
 var _toggleRange = require("./toggle-range.js");
-
 var _toggleReplace = require("./toggle-replace.js");
-
 /**
  * @param {Object} args
  * @param {bool} args.disabled
@@ -39,13 +34,10 @@ const createToggleHighlightedOption = _ref => {
       option,
       mode
     } = _ref2;
-
     if (disabled) {
       return;
     }
-
     setHighlightedOptions([]);
-
     if (mode === _index.ADD_MODE) {
       setLastClicked(option.value);
       return (0, _toggleAdd.toggleAdd)({
@@ -55,7 +47,6 @@ const createToggleHighlightedOption = _ref => {
         setHighlightedOptions
       });
     }
-
     if (mode === _index.RANGE_MODE) {
       return (0, _toggleRange.toggleRange)({
         highlightedOptions,
@@ -65,9 +56,9 @@ const createToggleHighlightedOption = _ref => {
         lastClicked,
         maxSelections
       });
-    } // REPLACE_MODE
-
+    }
 
+    // REPLACE_MODE
     setLastClicked(option.value);
     return (0, _toggleReplace.toggleReplace)({
       option,
@@ -76,5 +67,4 @@ const createToggleHighlightedOption = _ref => {
     });
   };
 };
-
 exports.createToggleHighlightedOption = createToggleHighlightedOption;

package/build/cjs/transfer/use-highlighted-options/toggle-add.js

@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.toggleAdd = void 0;
-
 var _index = require("../../common/index.js");
-
 /**
  * @param {Object} args
  * @param {number} args.maxSelections
@@ -26,5 +24,4 @@ const toggleAdd = _ref => {
   const capped = afterToggled.slice(-1 * maxSelections);
   setHighlightedOptions(capped);
 };
-
 exports.toggleAdd = toggleAdd;

package/build/cjs/transfer/use-highlighted-options/toggle-range.js

@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.toggleRange = void 0;
-
 var _index = require("../../common/index.js");
-
 /**
  * @param {Object} args
  * @param {number} args.maxSelections
@@ -26,14 +24,12 @@ const toggleRange = _ref => {
     lastClicked,
     maxSelections
   } = _ref;
-
   if (highlightedOptions.length === 0) {
     setHighlightedOptions([option.value]);
   } else {
     let from, to;
     const clickedOptionIndex = (0, _index.findOptionIndex)(options, option);
     const lastClickedSourceOptionWithoutRangeModeIndex = lastClicked ? options.findIndex(curOption => curOption.value === lastClicked) : -1;
-
     if (lastClickedSourceOptionWithoutRangeModeIndex !== -1) {
       from = lastClickedSourceOptionWithoutRangeModeIndex;
       to = clickedOptionIndex;
@@ -44,11 +40,11 @@ const toggleRange = _ref => {
       const firstHighlightedInList = options.findIndex(option => highlightedOptions.find(highlightedOption => highlightedOption === option.value));
       from = firstHighlightedInList;
       to = clickedOptionIndex;
-    } // this is so we can also selected
+    }
+
+    // this is so we can also selected
     // a range of options above "from" option.
     // -> Just how slice works ;)
-
-
     const lower = Math.min(from, to);
     const higher = Math.max(from, to);
     const newHighlightedSourceOptions = options.slice(lower, higher + 1).filter(option => !option.disabled).slice(maxSelections * -1).map(_ref2 => {
@@ -60,5 +56,4 @@ const toggleRange = _ref => {
     setHighlightedOptions(newHighlightedSourceOptions);
   }
 };
-
 exports.toggleRange = toggleRange;

package/build/cjs/transfer/use-highlighted-options/toggle-replace.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.toggleReplace = void 0;
-
 /**
  * @param {Object} args
  * @param {string[]} args.highlightedOptions
@@ -18,12 +17,10 @@ const toggleReplace = _ref => {
     highlightedOptions,
     setHighlightedOptions
   } = _ref;
-
   if (highlightedOptions.length > 1) {
     setHighlightedOptions([option.value]);
   } else {
     const optionIndex = highlightedOptions.findIndex(highlightedOption => highlightedOption === option.value);
-
     if (optionIndex === -1) {
       setHighlightedOptions([option.value]);
     } else {
@@ -31,5 +28,4 @@ const toggleReplace = _ref => {
     }
   }
 };
-
 exports.toggleReplace = toggleReplace;

package/build/cjs/transfer/use-highlighted-options.js

@@ -4,11 +4,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useHighlightedOptions = void 0;
-
 var _react = require("react");
-
 var _createToggleHighlightedOption = require("./use-highlighted-options/create-toggle-highlighted-option.js");
-
 /**
  * @param {Object} args
  * @param {bool} args.disabled
@@ -22,7 +19,6 @@ const useHighlightedOptions = _ref => {
     maxSelections,
     options
   } = _ref;
-
   /**
    * These are important so the stored element can be used
    * as range-start when using shift multiple times consecutively
@@ -44,5 +40,4 @@ const useHighlightedOptions = _ref => {
     toggleHighlightedOption
   };
 };
-
 exports.useHighlightedOptions = useHighlightedOptions;

package/build/cjs/transfer-option.js

@@ -4,25 +4,15 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.TransferOption = void 0;
-
 var _style = _interopRequireDefault(require("styled-jsx/style"));
-
 var _uiConstants = require("@dhis2/ui-constants");
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _react = _interopRequireWildcard(require("react"));
-
-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 DOUBLE_CLICK_MAX_DELAY = 500;
-
 const TransferOption = _ref => {
   let {
     className,
@@ -41,7 +31,6 @@ const TransferOption = _ref => {
       if (disabled) {
         return;
       }
-
       if (doubleClickTimeout.current) {
         clearTimeout(doubleClickTimeout.current);
         doubleClickTimeout.current = null;
@@ -66,9 +55,8 @@ const TransferOption = _ref => {
   }, label, /*#__PURE__*/_react.default.createElement(_style.default, {
     id: "4216903932",
     dynamic: [_uiConstants.colors.grey900, _uiConstants.colors.grey200, _uiConstants.colors.teal700, _uiConstants.colors.white, _uiConstants.colors.grey600]
-  }, ["div.__jsx-style-dynamic-selector{font-size:14px;line-height:16px;padding:4px 8px;color:".concat(_uiConstants.colors.grey900, ";-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}"), "div.__jsx-style-dynamic-selector:hover{background:".concat(_uiConstants.colors.grey200, ";}"), "div.highlighted.__jsx-style-dynamic-selector{background:".concat(_uiConstants.colors.teal700, ";color:").concat(_uiConstants.colors.white, ";}"), "div.disabled.__jsx-style-dynamic-selector{color:".concat(_uiConstants.colors.grey600, ";cursor:not-allowed;}")]));
+  }, [`div.__jsx-style-dynamic-selector{font-size:14px;line-height:16px;padding:4px 8px;color:${_uiConstants.colors.grey900};-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}`, `div.__jsx-style-dynamic-selector:hover{background:${_uiConstants.colors.grey200};}`, `div.highlighted.__jsx-style-dynamic-selector{background:${_uiConstants.colors.teal700};color:${_uiConstants.colors.white};}`, `div.disabled.__jsx-style-dynamic-selector{color:${_uiConstants.colors.grey600};cursor:not-allowed;}`]));
 };
-
 exports.TransferOption = TransferOption;
 TransferOption.defaultProps = {
   dataTest: 'dhis2-uicore-transferoption'

package/build/cjs/transfer.js

@@ -4,49 +4,27 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Transfer = void 0;
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _actions = require("./actions.js");
-
 var _addAll = require("./add-all.js");
-
 var _addIndividual = require("./add-individual.js");
-
 var _container = require("./container.js");
-
 var _filter = require("./filter.js");
-
 var _leftFooter = require("./left-footer.js");
-
 var _leftHeader = require("./left-header.js");
-
 var _leftSide = require("./left-side.js");
-
 var _optionsContainer = require("./options-container.js");
-
 var _removeAll = require("./remove-all.js");
-
 var _removeIndividual = require("./remove-individual.js");
-
 var _reorderingActions = require("./reordering-actions.js");
-
 var _rightFooter = require("./right-footer.js");
-
 var _rightHeader = require("./right-header.js");
-
 var _rightSide = require("./right-side.js");
-
-var _transferOption = require("./transfer-option.js");
-
 var _index = require("./transfer/index.js");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
+var _transferOption = require("./transfer-option.js");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const identity = value => value;
-
 const Transfer = _ref => {
   let {
     options,
@@ -92,7 +70,6 @@ const Transfer = _ref => {
     onEndReached,
     onEndReachedPicked
   } = _ref;
-
   /* Source options search value:
    * Depending on whether the onFilterChange callback has been provided
    * either the internal or external search value is used */
@@ -107,23 +84,23 @@ const Transfer = _ref => {
     filterable,
     filterCallback
   });
+
   /*
    * Actual source options:
    * Extract the not-selected options.
    * Filters options if filterable is true.
    */
-
   const sourceOptions = actualFilterCallback(options.filter(_ref2 => {
     let {
       value
     } = _ref2;
     return !selected.includes(value);
   }), actualFilter);
+
   /*
    * Picked options highlighting:
    * These are all the highlighted options on the options side.
    */
-
   const {
     highlightedOptions: highlightedSourceOptions,
     setHighlightedOptions: setHighlightedSourceOptions,
@@ -133,10 +110,10 @@ const Transfer = _ref => {
     disabled,
     maxSelections
   });
+
   /* Picked options search value:
    * Depending on whether the onFilterChangePicked callback has been provided
    * either the internal or external search value is used */
-
   const {
     filterValue: actualFilterPicked,
     filter: actualFilterPickedCallback,
@@ -148,25 +125,26 @@ const Transfer = _ref => {
     externalSearchTerm: searchTermPicked,
     filterCallback: filterCallbackPicked
   });
+
   /*
    * Actual picked options:
    * Extract the selected options. Can't use `options.filter`
    * because we need to keep the order of `selected`
    */
+  let pickedOptions = [];
 
-  let pickedOptions = []; // Only map if selected is an array
-
+  // Only map if selected is an array
   if (Array.isArray(selected)) {
-    pickedOptions = actualFilterPickedCallback(selected.map(value => options.find(option => value === option.value)) // filter -> in case a selected value has been provided
+    pickedOptions = actualFilterPickedCallback(selected.map(value => options.find(option => value === option.value))
+    // filter -> in case a selected value has been provided
     // that does not exist as option
     .filter(identity), actualFilterPicked);
   }
+
   /*
    * Source options highlighting:
    * These are all the highlighted options on the selected side.
    */
-
-
   const {
     highlightedOptions: highlightedPickedOptions,
     setHighlightedOptions: setHighlightedPickedOptions,
@@ -176,11 +154,11 @@ const Transfer = _ref => {
     disabled,
     maxSelections
   });
+
   /*
    * Source & Picked options:
    * These are the double click handlers for (de-)selection
    */
-
   const {
     selectSingleOption,
     deselectSingleOption
@@ -191,10 +169,10 @@ const Transfer = _ref => {
     onChange,
     maxSelections
   });
+
   /**
    * Disabled button states
    */
-
   const isAddAllDisabled = disabled || sourceOptions.filter(_ref3 => {
     let {
       disabled
@@ -209,14 +187,14 @@ const Transfer = _ref => {
     className: className,
     height: height
   }, /*#__PURE__*/_react.default.createElement(_leftSide.LeftSide, {
-    dataTest: "".concat(dataTest, "-leftside"),
+    dataTest: `${dataTest}-leftside`,
     width: optionsWidth
   }, (leftHeader || filterable) && /*#__PURE__*/_react.default.createElement(_leftHeader.LeftHeader, {
-    dataTest: "".concat(dataTest, "-leftheader")
+    dataTest: `${dataTest}-leftheader`
   }, leftHeader, filterable && !hideFilterInput && /*#__PURE__*/_react.default.createElement(_filter.Filter, {
     label: filterLabel,
     placeholder: filterPlaceholder,
-    dataTest: "".concat(dataTest, "-filter"),
+    dataTest: `${dataTest}-filter`,
     filter: actualFilter,
     onChange: onFilterChange ? onFilterChange : _ref4 => {
       let {
@@ -225,7 +203,7 @@ const Transfer = _ref => {
       return setInternalFilter(value);
     }
   })), /*#__PURE__*/_react.default.createElement(_optionsContainer.OptionsContainer, {
-    dataTest: "".concat(dataTest, "-sourceoptions"),
+    dataTest: `${dataTest}-sourceoptions`,
     emptyComponent: sourceEmptyPlaceholder,
     getOptionClickHandlers: _index.getOptionClickHandlers,
     highlightedOptions: highlightedSourceOptions,
@@ -236,12 +214,12 @@ const Transfer = _ref => {
     toggleHighlightedOption: toggleHighlightedSourceOption,
     onEndReached: onEndReached
   }), leftFooter && /*#__PURE__*/_react.default.createElement(_leftFooter.LeftFooter, {
-    dataTest: "".concat(dataTest, "-leftfooter")
+    dataTest: `${dataTest}-leftfooter`
   }, leftFooter)), /*#__PURE__*/_react.default.createElement(_actions.Actions, {
-    dataTest: "".concat(dataTest, "-actions")
+    dataTest: `${dataTest}-actions`
   }, maxSelections === Infinity && /*#__PURE__*/_react.default.createElement(_addAll.AddAll, {
     label: addAllText,
-    dataTest: "".concat(dataTest, "-actions-addall"),
+    dataTest: `${dataTest}-actions-addall`,
     disabled: isAddAllDisabled,
     onClick: () => (0, _index.addAllSelectableSourceOptions)({
       sourceOptions,
@@ -251,7 +229,7 @@ const Transfer = _ref => {
     })
   }), /*#__PURE__*/_react.default.createElement(_addIndividual.AddIndividual, {
     label: addIndividualText,
-    dataTest: "".concat(dataTest, "-actions-addindividual"),
+    dataTest: `${dataTest}-actions-addindividual`,
     disabled: isAddIndividualDisabled,
     onClick: () => (0, _index.addIndividualSourceOptions)({
       filterable,
@@ -264,7 +242,7 @@ const Transfer = _ref => {
     })
   }), maxSelections === Infinity && /*#__PURE__*/_react.default.createElement(_removeAll.RemoveAll, {
     label: removeAllText,
-    dataTest: "".concat(dataTest, "-actions-removeall"),
+    dataTest: `${dataTest}-actions-removeall`,
     disabled: isRemoveAllDisabled,
     onClick: () => (0, _index.removeAllPickedOptions)({
       setHighlightedPickedOptions,
@@ -272,7 +250,7 @@ const Transfer = _ref => {
     })
   }), /*#__PURE__*/_react.default.createElement(_removeIndividual.RemoveIndividual, {
     label: removeIndividualText,
-    dataTest: "".concat(dataTest, "-actions-removeindividual"),
+    dataTest: `${dataTest}-actions-removeindividual`,
     disabled: isRemoveIndividualDisabled,
     onClick: () => (0, _index.removeIndividualPickedOptions)({
       filterablePicked,
@@ -283,14 +261,14 @@ const Transfer = _ref => {
       setHighlightedPickedOptions
     })
   })), /*#__PURE__*/_react.default.createElement(_rightSide.RightSide, {
-    dataTest: "".concat(dataTest, "-rightside"),
+    dataTest: `${dataTest}-rightside`,
     width: selectedWidth
   }, (rightHeader || filterablePicked) && /*#__PURE__*/_react.default.createElement(_rightHeader.RightHeader, {
-    dataTest: "".concat(dataTest, "-rightheader")
+    dataTest: `${dataTest}-rightheader`
   }, rightHeader, filterablePicked && !hideFilterInputPicked && /*#__PURE__*/_react.default.createElement(_filter.Filter, {
     label: filterLabelPicked,
     placeholder: filterPlaceholderPicked,
-    dataTest: "".concat(dataTest, "-filter"),
+    dataTest: `${dataTest}-filter`,
     filter: actualFilterPicked,
     onChange: onFilterChangePicked ? onFilterChangePicked : _ref5 => {
       let {
@@ -300,7 +278,7 @@ const Transfer = _ref => {
     }
   })), /*#__PURE__*/_react.default.createElement(_optionsContainer.OptionsContainer, {
     selected: true,
-    dataTest: "".concat(dataTest, "-pickedoptions"),
+    dataTest: `${dataTest}-pickedoptions`,
     emptyComponent: selectedEmptyComponent,
     getOptionClickHandlers: _index.getOptionClickHandlers,
     highlightedOptions: highlightedPickedOptions,
@@ -311,9 +289,9 @@ const Transfer = _ref => {
     toggleHighlightedOption: toggleHighlightedPickedOption,
     onEndReached: onEndReachedPicked
   }), (rightFooter || enableOrderChange) && /*#__PURE__*/_react.default.createElement(_rightFooter.RightFooter, {
-    dataTest: "".concat(dataTest, "-rightfooter")
+    dataTest: `${dataTest}-rightfooter`
   }, enableOrderChange && /*#__PURE__*/_react.default.createElement(_reorderingActions.ReorderingActions, {
-    dataTest: "".concat(dataTest, "-reorderingactions"),
+    dataTest: `${dataTest}-reorderingactions`,
     disabledDown: (0, _index.isReorderDownDisabled)({
       highlightedPickedOptions,
       selected
@@ -336,11 +314,8 @@ const Transfer = _ref => {
     }
   }), rightFooter)));
 };
-
 exports.Transfer = Transfer;
-
 const defaultRenderOption = option => /*#__PURE__*/_react.default.createElement(_transferOption.TransferOption, option);
-
 Transfer.defaultProps = {
   dataTest: 'dhis2-uicore-transfer',
   height: '240px',