@dhis2-ui/transfer 10.16.3 → 10.16.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (128) hide show
  1. package/build/cjs/__e2e__/add_remove-highlighted-options.e2e.stories.js +20 -29
  2. package/build/cjs/__e2e__/common/stateful-decorator.js +20 -28
  3. package/build/cjs/__e2e__/disabled-transfer-buttons.e2e.stories.js +49 -70
  4. package/build/cjs/__e2e__/disabled-transfer-options.e2e.stories.js +11 -14
  5. package/build/cjs/__e2e__/display-order.e2e.stories.js +19 -28
  6. package/build/cjs/__e2e__/filter-options-list.e2e.stories.js +72 -96
  7. package/build/cjs/__e2e__/highlight-range-of-options.e2e.stories.js +33 -48
  8. package/build/cjs/__e2e__/notify_at_end_of_list.e2e.stories.js +47 -67
  9. package/build/cjs/__e2e__/reorder-with-buttons.e2e.stories.js +15 -24
  10. package/build/cjs/__e2e__/set_unset-highlighted-option.e2e.stories.js +20 -29
  11. package/build/cjs/__e2e__/transferring-items.e2e.stories.js +19 -28
  12. package/build/cjs/__tests__/helper/use-highlighted-option/toggle-add.test.js +3 -6
  13. package/build/cjs/__tests__/helper/use-highlighted-option/toggle-range.test.js +24 -48
  14. package/build/cjs/__tests__/transfer.test.js +10 -18
  15. package/build/cjs/actions.js +10 -13
  16. package/build/cjs/add-all.js +14 -17
  17. package/build/cjs/add-individual.js +13 -16
  18. package/build/cjs/common/get-mode-by-modifier-key.js +6 -7
  19. package/build/cjs/container.js +12 -15
  20. package/build/cjs/end-intersection-detector.js +15 -21
  21. package/build/cjs/features/disabled-transfer-options/index.js +2 -4
  22. package/build/cjs/features/display-order/index.js +26 -47
  23. package/build/cjs/features/filter-options-list/index.js +3 -6
  24. package/build/cjs/features/highlight-range-of-options/index.js +5 -10
  25. package/build/cjs/features/notify_at_end_of_list/index.js +2 -4
  26. package/build/cjs/features/set_unset-highlighted-option/index.js +3 -6
  27. package/build/cjs/features/transferring-items/index.js +41 -75
  28. package/build/cjs/filter.js +24 -27
  29. package/build/cjs/icons.js +147 -171
  30. package/build/cjs/left-footer.js +10 -13
  31. package/build/cjs/left-header.js +10 -13
  32. package/build/cjs/left-side.js +16 -19
  33. package/build/cjs/locales/index.js +6 -1
  34. package/build/cjs/options-container.js +15 -17
  35. package/build/cjs/remove-all.js +13 -16
  36. package/build/cjs/remove-individual.js +13 -16
  37. package/build/cjs/reordering-actions.js +75 -82
  38. package/build/cjs/right-footer.js +10 -13
  39. package/build/cjs/right-header.js +10 -13
  40. package/build/cjs/right-side.js +16 -19
  41. package/build/cjs/transfer/add-all-selectable-source-options.js +9 -13
  42. package/build/cjs/transfer/add-individual-source-options.js +9 -10
  43. package/build/cjs/transfer/create-double-click-handlers.js +13 -16
  44. package/build/cjs/transfer/default-filter-callback.js +3 -6
  45. package/build/cjs/transfer/get-highlighted-picked-indices.js +4 -5
  46. package/build/cjs/transfer/is-reorder-down-disabled.js +5 -6
  47. package/build/cjs/transfer/is-reorder-up-disabled.js +5 -6
  48. package/build/cjs/transfer/move-highlighted-picked-option-down.js +5 -6
  49. package/build/cjs/transfer/move-highlighted-picked-option-to-bottom.js +5 -6
  50. package/build/cjs/transfer/move-highlighted-picked-option-to-top.js +5 -6
  51. package/build/cjs/transfer/move-highlighted-picked-option-up.js +5 -6
  52. package/build/cjs/transfer/remove-all-picked-options.js +4 -5
  53. package/build/cjs/transfer/remove-individual-picked-options.js +8 -9
  54. package/build/cjs/transfer/use-filter.js +7 -8
  55. package/build/cjs/transfer/use-highlighted-options/create-toggle-highlighted-option.js +39 -43
  56. package/build/cjs/transfer/use-highlighted-options/toggle-add.js +6 -7
  57. package/build/cjs/transfer/use-highlighted-options/toggle-range.js +11 -15
  58. package/build/cjs/transfer/use-highlighted-options/toggle-replace.js +5 -6
  59. package/build/cjs/transfer/use-highlighted-options.js +5 -6
  60. package/build/cjs/transfer/use-options-key-monitor.js +6 -7
  61. package/build/cjs/transfer-option.js +11 -13
  62. package/build/cjs/transfer.js +65 -85
  63. package/build/cjs/transfer.prod.stories.js +99 -146
  64. package/build/es/__e2e__/add_remove-highlighted-options.e2e.stories.js +20 -29
  65. package/build/es/__e2e__/common/stateful-decorator.js +19 -26
  66. package/build/es/__e2e__/disabled-transfer-buttons.e2e.stories.js +49 -70
  67. package/build/es/__e2e__/disabled-transfer-options.e2e.stories.js +11 -14
  68. package/build/es/__e2e__/display-order.e2e.stories.js +19 -28
  69. package/build/es/__e2e__/filter-options-list.e2e.stories.js +72 -96
  70. package/build/es/__e2e__/highlight-range-of-options.e2e.stories.js +33 -48
  71. package/build/es/__e2e__/notify_at_end_of_list.e2e.stories.js +46 -65
  72. package/build/es/__e2e__/reorder-with-buttons.e2e.stories.js +15 -24
  73. package/build/es/__e2e__/set_unset-highlighted-option.e2e.stories.js +20 -29
  74. package/build/es/__e2e__/transferring-items.e2e.stories.js +19 -28
  75. package/build/es/__tests__/helper/use-highlighted-option/toggle-add.test.js +3 -6
  76. package/build/es/__tests__/helper/use-highlighted-option/toggle-range.test.js +24 -48
  77. package/build/es/__tests__/transfer.test.js +10 -18
  78. package/build/es/actions.js +10 -13
  79. package/build/es/add-all.js +14 -17
  80. package/build/es/add-individual.js +13 -16
  81. package/build/es/common/get-mode-by-modifier-key.js +6 -7
  82. package/build/es/container.js +12 -15
  83. package/build/es/end-intersection-detector.js +15 -21
  84. package/build/es/features/disabled-transfer-options/index.js +2 -4
  85. package/build/es/features/display-order/index.js +26 -47
  86. package/build/es/features/filter-options-list/index.js +3 -6
  87. package/build/es/features/highlight-range-of-options/index.js +5 -10
  88. package/build/es/features/notify_at_end_of_list/index.js +2 -4
  89. package/build/es/features/set_unset-highlighted-option/index.js +3 -6
  90. package/build/es/features/transferring-items/index.js +41 -75
  91. package/build/es/filter.js +24 -27
  92. package/build/es/icons.js +147 -171
  93. package/build/es/left-footer.js +10 -13
  94. package/build/es/left-header.js +10 -13
  95. package/build/es/left-side.js +16 -19
  96. package/build/es/locales/index.js +6 -1
  97. package/build/es/options-container.js +14 -15
  98. package/build/es/remove-all.js +13 -16
  99. package/build/es/remove-individual.js +13 -16
  100. package/build/es/reordering-actions.js +75 -82
  101. package/build/es/right-footer.js +10 -13
  102. package/build/es/right-header.js +10 -13
  103. package/build/es/right-side.js +16 -19
  104. package/build/es/transfer/add-all-selectable-source-options.js +9 -13
  105. package/build/es/transfer/add-individual-source-options.js +9 -10
  106. package/build/es/transfer/create-double-click-handlers.js +13 -16
  107. package/build/es/transfer/default-filter-callback.js +3 -6
  108. package/build/es/transfer/get-highlighted-picked-indices.js +4 -5
  109. package/build/es/transfer/is-reorder-down-disabled.js +5 -6
  110. package/build/es/transfer/is-reorder-up-disabled.js +5 -6
  111. package/build/es/transfer/move-highlighted-picked-option-down.js +5 -6
  112. package/build/es/transfer/move-highlighted-picked-option-to-bottom.js +5 -6
  113. package/build/es/transfer/move-highlighted-picked-option-to-top.js +5 -6
  114. package/build/es/transfer/move-highlighted-picked-option-up.js +5 -6
  115. package/build/es/transfer/remove-all-picked-options.js +4 -5
  116. package/build/es/transfer/remove-individual-picked-options.js +8 -9
  117. package/build/es/transfer/use-filter.js +7 -8
  118. package/build/es/transfer/use-highlighted-options/create-toggle-highlighted-option.js +39 -43
  119. package/build/es/transfer/use-highlighted-options/toggle-add.js +6 -7
  120. package/build/es/transfer/use-highlighted-options/toggle-range.js +11 -15
  121. package/build/es/transfer/use-highlighted-options/toggle-replace.js +5 -6
  122. package/build/es/transfer/use-highlighted-options.js +5 -6
  123. package/build/es/transfer/use-options-key-monitor.js +6 -7
  124. package/build/es/transfer-option.js +10 -11
  125. package/build/es/transfer.js +64 -83
  126. package/build/es/transfer.prod.stories.js +98 -144
  127. package/package.json +8 -8
  128. package/src/locales/index.js +6 -1
@@ -19,52 +19,48 @@ var _toggleReplace = require("./toggle-replace.js");
19
19
  * @param {string} args.lastClicked
20
20
  * @returns {void}
21
21
  */
22
- const createToggleHighlightedOption = _ref => {
23
- let {
24
- disabled,
25
- highlightedOptions,
26
- setHighlightedOptions,
27
- maxSelections,
28
- setLastClicked,
29
- options,
30
- lastClicked
31
- } = _ref;
32
- return _ref2 => {
33
- let {
34
- option,
35
- mode
36
- } = _ref2;
37
- if (disabled) {
38
- return;
39
- }
40
- setHighlightedOptions([]);
41
- if (mode === _index.ADD_MODE) {
42
- setLastClicked(option.value);
43
- return (0, _toggleAdd.toggleAdd)({
44
- highlightedOptions,
45
- maxSelections,
46
- option,
47
- setHighlightedOptions
48
- });
49
- }
50
- if (mode === _index.RANGE_MODE) {
51
- return (0, _toggleRange.toggleRange)({
52
- highlightedOptions,
53
- options,
54
- option,
55
- setHighlightedOptions,
56
- lastClicked,
57
- maxSelections
58
- });
59
- }
60
-
61
- // REPLACE_MODE
22
+ const createToggleHighlightedOption = ({
23
+ disabled,
24
+ highlightedOptions,
25
+ setHighlightedOptions,
26
+ maxSelections,
27
+ setLastClicked,
28
+ options,
29
+ lastClicked
30
+ }) => ({
31
+ option,
32
+ mode
33
+ }) => {
34
+ if (disabled) {
35
+ return;
36
+ }
37
+ setHighlightedOptions([]);
38
+ if (mode === _index.ADD_MODE) {
62
39
  setLastClicked(option.value);
63
- return (0, _toggleReplace.toggleReplace)({
64
- option,
40
+ return (0, _toggleAdd.toggleAdd)({
65
41
  highlightedOptions,
42
+ maxSelections,
43
+ option,
66
44
  setHighlightedOptions
67
45
  });
68
- };
46
+ }
47
+ if (mode === _index.RANGE_MODE) {
48
+ return (0, _toggleRange.toggleRange)({
49
+ highlightedOptions,
50
+ options,
51
+ option,
52
+ setHighlightedOptions,
53
+ lastClicked,
54
+ maxSelections
55
+ });
56
+ }
57
+
58
+ // REPLACE_MODE
59
+ setLastClicked(option.value);
60
+ return (0, _toggleReplace.toggleReplace)({
61
+ option,
62
+ highlightedOptions,
63
+ setHighlightedOptions
64
+ });
69
65
  };
70
66
  exports.createToggleHighlightedOption = createToggleHighlightedOption;
@@ -13,13 +13,12 @@ var _index = require("../../common/index.js");
13
13
  * @param {Function} args.setHighlightedOption
14
14
  * @returns {void}
15
15
  */
16
- const toggleAdd = _ref => {
17
- let {
18
- highlightedOptions,
19
- maxSelections,
20
- option,
21
- setHighlightedOptions
22
- } = _ref;
16
+ const toggleAdd = ({
17
+ highlightedOptions,
18
+ maxSelections,
19
+ option,
20
+ setHighlightedOptions
21
+ }) => {
23
22
  const afterToggled = (0, _index.toggleValue)(highlightedOptions, option.value);
24
23
  const capped = afterToggled.slice(-1 * maxSelections);
25
24
  setHighlightedOptions(capped);
@@ -15,15 +15,14 @@ var _index = require("../../common/index.js");
15
15
  * @param {Function} args.setHighlightedOption
16
16
  * @returns {void}
17
17
  */
18
- const toggleRange = _ref => {
19
- let {
20
- highlightedOptions,
21
- options,
22
- option,
23
- setHighlightedOptions,
24
- lastClicked,
25
- maxSelections
26
- } = _ref;
18
+ const toggleRange = ({
19
+ highlightedOptions,
20
+ options,
21
+ option,
22
+ setHighlightedOptions,
23
+ lastClicked,
24
+ maxSelections
25
+ }) => {
27
26
  if (highlightedOptions.length === 0) {
28
27
  setHighlightedOptions([option.value]);
29
28
  } else {
@@ -47,12 +46,9 @@ const toggleRange = _ref => {
47
46
  // -> Just how slice works ;)
48
47
  const lower = Math.min(from, to);
49
48
  const higher = Math.max(from, to);
50
- const newHighlightedSourceOptions = options.slice(lower, higher + 1).filter(option => !option.disabled).slice(maxSelections * -1).map(_ref2 => {
51
- let {
52
- value
53
- } = _ref2;
54
- return value;
55
- });
49
+ const newHighlightedSourceOptions = options.slice(lower, higher + 1).filter(option => !option.disabled).slice(maxSelections * -1).map(({
50
+ value
51
+ }) => value);
56
52
  setHighlightedOptions(newHighlightedSourceOptions);
57
53
  }
58
54
  };
@@ -11,12 +11,11 @@ exports.toggleReplace = void 0;
11
11
  * @param {Function} args.setHighlightedOption
12
12
  * @returns {void}
13
13
  */
14
- const toggleReplace = _ref => {
15
- let {
16
- option,
17
- highlightedOptions,
18
- setHighlightedOptions
19
- } = _ref;
14
+ const toggleReplace = ({
15
+ option,
16
+ highlightedOptions,
17
+ setHighlightedOptions
18
+ }) => {
20
19
  if (highlightedOptions.length > 1) {
21
20
  setHighlightedOptions([option.value]);
22
21
  } else {
@@ -13,12 +13,11 @@ var _createToggleHighlightedOption = require("./use-highlighted-options/create-t
13
13
  * @param {Object[]} args.options
14
14
  * @returns {Object} highlighted options & helpers
15
15
  */
16
- const useHighlightedOptions = _ref => {
17
- let {
18
- disabled,
19
- maxSelections,
20
- options
21
- } = _ref;
16
+ const useHighlightedOptions = ({
17
+ disabled,
18
+ maxSelections,
19
+ options
20
+ }) => {
22
21
  /**
23
22
  * These are important so the stored element can be used
24
23
  * as range-start when using shift multiple times consecutively
@@ -14,13 +14,12 @@ const isEndIntersectionDetectorWithinScrollBox = (scrollBoxRef, listRef) => {
14
14
  const listRect = listRef.current.getBoundingClientRect();
15
15
  return listRect.bottom - scrollBoxRect.bottom < _endIntersectionDetector.INTERSECTION_DETECTOR_HEIGHT;
16
16
  };
17
- const useOptionsKeyMonitor = _ref => {
18
- let {
19
- scrollBoxRef,
20
- listRef,
21
- allOptionsKey,
22
- onEndReached
23
- } = _ref;
17
+ const useOptionsKeyMonitor = ({
18
+ scrollBoxRef,
19
+ listRef,
20
+ allOptionsKey,
21
+ onEndReached
22
+ }) => {
24
23
  /* Store in ref so this works even if a consumer does not pass a stable
25
24
  * function reference */
26
25
  const onEndReachedRef = (0, _react.useRef)(onEndReached);
@@ -9,21 +9,19 @@ var _uiConstants = require("@dhis2/ui-constants");
9
9
  var _classnames = _interopRequireDefault(require("classnames"));
10
10
  var _propTypes = _interopRequireDefault(require("prop-types"));
11
11
  var _react = _interopRequireWildcard(require("react"));
12
- 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); }
13
- 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; }
12
+ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
14
13
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
15
14
  const DOUBLE_CLICK_MAX_DELAY = 500;
16
- const TransferOption = _ref => {
17
- let {
18
- className,
19
- disabled,
20
- dataTest = 'dhis2-uicore-transferoption',
21
- highlighted,
22
- onClick,
23
- onDoubleClick,
24
- label,
25
- value
26
- } = _ref;
15
+ const TransferOption = ({
16
+ className,
17
+ disabled,
18
+ dataTest = 'dhis2-uicore-transferoption',
19
+ highlighted,
20
+ onClick,
21
+ onDoubleClick,
22
+ label,
23
+ value
24
+ }) => {
27
25
  const doubleClickTimeout = (0, _react.useRef)(null);
28
26
  return /*#__PURE__*/_react.default.createElement("div", {
29
27
  "data-test": dataTest,
@@ -23,58 +23,56 @@ var _rightHeader = require("./right-header.js");
23
23
  var _rightSide = require("./right-side.js");
24
24
  var _index = require("./transfer/index.js");
25
25
  var _transferOption = require("./transfer-option.js");
26
- 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); }
27
- 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; }
26
+ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
28
27
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
29
28
  const identity = value => value;
30
29
  const defaultSelected = [];
31
30
  const defaultSelectedOptionsLookup = {};
32
- const Transfer = _ref => {
33
- let {
34
- options,
35
- onChange,
36
- addAllText,
37
- addIndividualText,
38
- className,
39
- dataTest = 'dhis2-uicore-transfer',
40
- disabled,
41
- enableOrderChange,
42
- filterCallback = _index.defaultFilterCallback,
43
- filterCallbackPicked = _index.defaultFilterCallback,
44
- filterLabel,
45
- filterLabelPicked,
46
- filterPlaceholder,
47
- filterPlaceholderPicked,
48
- filterable,
49
- filterablePicked,
50
- height = '240px',
51
- hideFilterInput,
52
- hideFilterInputPicked,
53
- initialSearchTerm = '',
54
- initialSearchTermPicked = '',
55
- selectedOptionsLookup = defaultSelectedOptionsLookup,
56
- leftFooter,
57
- leftHeader,
58
- loadingPicked,
59
- loading,
60
- maxSelections = Infinity,
61
- optionsWidth = '320px',
62
- removeAllText,
63
- removeIndividualText,
64
- renderOption = defaultRenderOption,
65
- rightFooter,
66
- rightHeader,
67
- searchTerm,
68
- searchTermPicked,
69
- selected = defaultSelected,
70
- selectedEmptyComponent,
71
- selectedWidth = '320px',
72
- sourceEmptyPlaceholder,
73
- onFilterChange,
74
- onFilterChangePicked,
75
- onEndReached,
76
- onEndReachedPicked
77
- } = _ref;
31
+ const Transfer = ({
32
+ options,
33
+ onChange,
34
+ addAllText,
35
+ addIndividualText,
36
+ className,
37
+ dataTest = 'dhis2-uicore-transfer',
38
+ disabled,
39
+ enableOrderChange,
40
+ filterCallback = _index.defaultFilterCallback,
41
+ filterCallbackPicked = _index.defaultFilterCallback,
42
+ filterLabel,
43
+ filterLabelPicked,
44
+ filterPlaceholder,
45
+ filterPlaceholderPicked,
46
+ filterable,
47
+ filterablePicked,
48
+ height = '240px',
49
+ hideFilterInput,
50
+ hideFilterInputPicked,
51
+ initialSearchTerm = '',
52
+ initialSearchTermPicked = '',
53
+ selectedOptionsLookup = defaultSelectedOptionsLookup,
54
+ leftFooter,
55
+ leftHeader,
56
+ loadingPicked,
57
+ loading,
58
+ maxSelections = Infinity,
59
+ optionsWidth = '320px',
60
+ removeAllText,
61
+ removeIndividualText,
62
+ renderOption = defaultRenderOption,
63
+ rightFooter,
64
+ rightHeader,
65
+ searchTerm,
66
+ searchTermPicked,
67
+ selected = defaultSelected,
68
+ selectedEmptyComponent,
69
+ selectedWidth = '320px',
70
+ sourceEmptyPlaceholder,
71
+ onFilterChange,
72
+ onFilterChangePicked,
73
+ onEndReached,
74
+ onEndReachedPicked
75
+ }) => {
78
76
  /* Source options search value:
79
77
  * Depending on whether the onFilterChange callback has been provided
80
78
  * either the internal or external search value is used */
@@ -95,12 +93,9 @@ const Transfer = _ref => {
95
93
  * Extract the not-selected options.
96
94
  * Filters options if filterable is true.
97
95
  */
98
- const sourceOptions = actualFilterCallback(options.filter(_ref2 => {
99
- let {
100
- value
101
- } = _ref2;
102
- return !selected.includes(value);
103
- }), actualFilter);
96
+ const sourceOptions = actualFilterCallback(options.filter(({
97
+ value
98
+ }) => !selected.includes(value)), actualFilter);
104
99
 
105
100
  /*
106
101
  * Picked options highlighting:
@@ -190,7 +185,7 @@ const Transfer = _ref => {
190
185
  }
191
186
  reorderScrollTargetRef.current = null;
192
187
  const element = document.querySelector(`[data-test="${dataTest}-pickedoptions"] [data-value="${CSS.escape(target)}"]`);
193
- element === null || element === void 0 ? void 0 : element.scrollIntoView({
188
+ element === null || element === void 0 || element.scrollIntoView({
194
189
  block: 'nearest'
195
190
  });
196
191
  }, [selected, dataTest]);
@@ -198,27 +193,18 @@ const Transfer = _ref => {
198
193
  /**
199
194
  * Disabled button states
200
195
  */
201
- const isAddAllDisabled = disabled || sourceOptions.filter(_ref3 => {
202
- let {
203
- disabled
204
- } = _ref3;
205
- return !disabled;
206
- }).length === 0;
196
+ const isAddAllDisabled = disabled || sourceOptions.filter(({
197
+ disabled
198
+ }) => !disabled).length === 0;
207
199
  const isAddIndividualDisabled = disabled || !highlightedSourceOptions.length;
208
200
  const isRemoveAllDisabled = disabled || !selected.length;
209
201
  const isRemoveIndividualDisabled = disabled || !highlightedPickedOptions.length;
210
- const allOptionsKey = (0, _react.useMemo)(() => options.map(_ref4 => {
211
- let {
212
- value
213
- } = _ref4;
214
- return value;
215
- }).join('|'), [options]);
216
- const pickedOptionsKey = (0, _react.useMemo)(() => pickedOptions.map(_ref5 => {
217
- let {
218
- value
219
- } = _ref5;
220
- return value;
221
- }).join('|'), [pickedOptions]);
202
+ const allOptionsKey = (0, _react.useMemo)(() => options.map(({
203
+ value
204
+ }) => value).join('|'), [options]);
205
+ const pickedOptionsKey = (0, _react.useMemo)(() => pickedOptions.map(({
206
+ value
207
+ }) => value).join('|'), [pickedOptions]);
222
208
  return /*#__PURE__*/_react.default.createElement(_container.Container, {
223
209
  dataTest: dataTest,
224
210
  className: className,
@@ -233,12 +219,9 @@ const Transfer = _ref => {
233
219
  placeholder: filterPlaceholder,
234
220
  dataTest: `${dataTest}-filter`,
235
221
  filter: actualFilter,
236
- onChange: onFilterChange ? onFilterChange : _ref6 => {
237
- let {
238
- value
239
- } = _ref6;
240
- return setInternalFilter(value);
241
- }
222
+ onChange: onFilterChange ? onFilterChange : ({
223
+ value
224
+ }) => setInternalFilter(value)
242
225
  })), /*#__PURE__*/_react.default.createElement(_optionsContainer.OptionsContainer, {
243
226
  allOptionsKey: allOptionsKey,
244
227
  dataTest: `${dataTest}-sourceoptions`,
@@ -308,12 +291,9 @@ const Transfer = _ref => {
308
291
  placeholder: filterPlaceholderPicked,
309
292
  dataTest: `${dataTest}-filter`,
310
293
  filter: actualFilterPicked,
311
- onChange: onFilterChangePicked ? onFilterChangePicked : _ref7 => {
312
- let {
313
- value
314
- } = _ref7;
315
- return setInternalFilterPicked(value);
316
- }
294
+ onChange: onFilterChangePicked ? onFilterChangePicked : ({
295
+ value
296
+ }) => setInternalFilterPicked(value)
317
297
  })), /*#__PURE__*/_react.default.createElement(_optionsContainer.OptionsContainer, {
318
298
  selected: true,
319
299
  allOptionsKey: pickedOptionsKey,