@dhis2-ui/transfer 10.16.3 → 10.16.5

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
@@ -8,96 +8,89 @@ import React from 'react';
8
8
  import { IconMoveDown, IconMoveToBottom, IconMoveToTop, IconMoveUp } from './icons.js';
9
9
  import i18n from './locales/index.js';
10
10
  const filterActiveTooltip = i18n.t('Reordering not allowed when filtering list');
11
- export const ReorderingActions = _ref => {
12
- let {
13
- dataTest,
14
- disabledDown,
15
- disabledUp,
16
- filterActive,
17
- onChangeUp,
18
- onChangeDown,
19
- onChangeToTop,
20
- onChangeToBottom
21
- } = _ref;
11
+ export const ReorderingActions = ({
12
+ dataTest,
13
+ disabledDown,
14
+ disabledUp,
15
+ filterActive,
16
+ onChangeUp,
17
+ onChangeDown,
18
+ onChangeToTop,
19
+ onChangeToBottom
20
+ }) => {
22
21
  const moveToTopLabel = i18n.t('Move selected items to top');
23
22
  const moveUpLabel = i18n.t('Move selected items up');
24
23
  const moveDownLabel = i18n.t('Move selected items down');
25
24
  const moveToBottomLabel = i18n.t('Move selected items to bottom');
26
- const renderButtons = function () {
27
- let tooltipHandlers = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
28
- return /*#__PURE__*/React.createElement("div", _extends({
29
- "data-test": dataTest
30
- }, tooltipHandlers, {
31
- className: _JSXStyle.dynamic([["3663884558", [spacers.dp4, spacers.dp8, spacers.dp8]]]) + " " + (tooltipHandlers && tooltipHandlers.className != null && tooltipHandlers.className || "")
32
- }), /*#__PURE__*/React.createElement(Button, {
33
- small: true,
34
- secondary: true,
35
- disabled: disabledUp,
36
- onClick: () => !disabledUp && onChangeToTop(),
37
- dataTest: `${dataTest}-buttonmovetotop`,
38
- "aria-label": moveToTopLabel,
39
- icon: /*#__PURE__*/React.createElement(IconMoveToTop, {
40
- dataTest: `${dataTest}-iconmovetotop`,
41
- disabled: disabledUp
42
- })
43
- }), /*#__PURE__*/React.createElement(Button, {
44
- small: true,
45
- secondary: true,
46
- disabled: disabledUp,
47
- onClick: () => !disabledUp && onChangeUp(),
48
- dataTest: `${dataTest}-buttonmoveup`,
49
- "aria-label": moveUpLabel,
50
- icon: /*#__PURE__*/React.createElement(IconMoveUp, {
51
- dataTest: `${dataTest}-iconmoveup`,
52
- disabled: disabledUp
53
- })
54
- }), /*#__PURE__*/React.createElement(Button, {
55
- small: true,
56
- secondary: true,
57
- disabled: disabledDown,
58
- onClick: () => !disabledDown && onChangeDown(),
59
- dataTest: `${dataTest}-buttonmovedown`,
60
- "aria-label": moveDownLabel,
61
- icon: /*#__PURE__*/React.createElement(IconMoveDown, {
62
- dataTest: `${dataTest}-iconmovedown`,
63
- disabled: disabledDown
64
- })
65
- }), /*#__PURE__*/React.createElement(Button, {
66
- small: true,
67
- secondary: true,
68
- disabled: disabledDown,
69
- onClick: () => !disabledDown && onChangeToBottom(),
70
- dataTest: `${dataTest}-buttonmovetobottom`,
71
- "aria-label": moveToBottomLabel,
72
- icon: /*#__PURE__*/React.createElement(IconMoveToBottom, {
73
- dataTest: `${dataTest}-iconmovetobottom`,
74
- disabled: disabledDown
75
- })
76
- }), /*#__PURE__*/React.createElement(_JSXStyle, {
77
- id: "3663884558",
78
- dynamic: [spacers.dp4, spacers.dp8, spacers.dp8]
79
- }, [`div.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end;margin-inline-start:auto;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;gap:${spacers.dp4};padding-top:${spacers.dp8};}`, `div.__jsx-style-dynamic-selector:last-child{padding-bottom:${spacers.dp8};}`]));
80
- };
25
+ const renderButtons = (tooltipHandlers = {}) => /*#__PURE__*/React.createElement("div", _extends({
26
+ "data-test": dataTest
27
+ }, tooltipHandlers, {
28
+ className: _JSXStyle.dynamic([["3663884558", [spacers.dp4, spacers.dp8, spacers.dp8]]]) + " " + (tooltipHandlers && tooltipHandlers.className != null && tooltipHandlers.className || "")
29
+ }), /*#__PURE__*/React.createElement(Button, {
30
+ small: true,
31
+ secondary: true,
32
+ disabled: disabledUp,
33
+ onClick: () => !disabledUp && onChangeToTop(),
34
+ dataTest: `${dataTest}-buttonmovetotop`,
35
+ "aria-label": moveToTopLabel,
36
+ icon: /*#__PURE__*/React.createElement(IconMoveToTop, {
37
+ dataTest: `${dataTest}-iconmovetotop`,
38
+ disabled: disabledUp
39
+ })
40
+ }), /*#__PURE__*/React.createElement(Button, {
41
+ small: true,
42
+ secondary: true,
43
+ disabled: disabledUp,
44
+ onClick: () => !disabledUp && onChangeUp(),
45
+ dataTest: `${dataTest}-buttonmoveup`,
46
+ "aria-label": moveUpLabel,
47
+ icon: /*#__PURE__*/React.createElement(IconMoveUp, {
48
+ dataTest: `${dataTest}-iconmoveup`,
49
+ disabled: disabledUp
50
+ })
51
+ }), /*#__PURE__*/React.createElement(Button, {
52
+ small: true,
53
+ secondary: true,
54
+ disabled: disabledDown,
55
+ onClick: () => !disabledDown && onChangeDown(),
56
+ dataTest: `${dataTest}-buttonmovedown`,
57
+ "aria-label": moveDownLabel,
58
+ icon: /*#__PURE__*/React.createElement(IconMoveDown, {
59
+ dataTest: `${dataTest}-iconmovedown`,
60
+ disabled: disabledDown
61
+ })
62
+ }), /*#__PURE__*/React.createElement(Button, {
63
+ small: true,
64
+ secondary: true,
65
+ disabled: disabledDown,
66
+ onClick: () => !disabledDown && onChangeToBottom(),
67
+ dataTest: `${dataTest}-buttonmovetobottom`,
68
+ "aria-label": moveToBottomLabel,
69
+ icon: /*#__PURE__*/React.createElement(IconMoveToBottom, {
70
+ dataTest: `${dataTest}-iconmovetobottom`,
71
+ disabled: disabledDown
72
+ })
73
+ }), /*#__PURE__*/React.createElement(_JSXStyle, {
74
+ id: "3663884558",
75
+ dynamic: [spacers.dp4, spacers.dp8, spacers.dp8]
76
+ }, [`div.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end;margin-inline-start:auto;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;gap:${spacers.dp4};padding-top:${spacers.dp8};}`, `div.__jsx-style-dynamic-selector:last-child{padding-bottom:${spacers.dp8};}`]));
81
77
  if (filterActive) {
82
78
  return /*#__PURE__*/React.createElement(Tooltip, {
83
79
  openDelay: 500,
84
80
  content: filterActiveTooltip
85
- }, _ref2 => {
86
- let {
87
- onMouseOver,
88
- onMouseOut,
89
- onFocus,
90
- onBlur,
91
- ref
92
- } = _ref2;
93
- return renderButtons({
94
- ref,
95
- onMouseOver,
96
- onMouseOut,
97
- onFocus,
98
- onBlur
99
- });
100
- });
81
+ }, ({
82
+ onMouseOver,
83
+ onMouseOut,
84
+ onFocus,
85
+ onBlur,
86
+ ref
87
+ }) => renderButtons({
88
+ ref,
89
+ onMouseOver,
90
+ onMouseOut,
91
+ onFocus,
92
+ onBlur
93
+ }));
101
94
  }
102
95
  return renderButtons();
103
96
  };
@@ -2,19 +2,16 @@ import _JSXStyle from "styled-jsx/style";
2
2
  import { colors, spacers } from '@dhis2/ui-constants';
3
3
  import PropTypes from 'prop-types';
4
4
  import React from 'react';
5
- export const RightFooter = _ref => {
6
- let {
7
- children,
8
- dataTest
9
- } = _ref;
10
- return /*#__PURE__*/React.createElement("div", {
11
- "data-test": dataTest,
12
- className: _JSXStyle.dynamic([["1797409102", [colors.grey400, spacers.dp8]]])
13
- }, children, /*#__PURE__*/React.createElement(_JSXStyle, {
14
- id: "1797409102",
15
- dynamic: [colors.grey400, spacers.dp8]
16
- }, [`div.__jsx-style-dynamic-selector{-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;border-top:1px solid ${colors.grey400};padding:0 ${spacers.dp8};}`]));
17
- };
5
+ export const RightFooter = ({
6
+ children,
7
+ dataTest
8
+ }) => /*#__PURE__*/React.createElement("div", {
9
+ "data-test": dataTest,
10
+ className: _JSXStyle.dynamic([["1797409102", [colors.grey400, spacers.dp8]]])
11
+ }, children, /*#__PURE__*/React.createElement(_JSXStyle, {
12
+ id: "1797409102",
13
+ dynamic: [colors.grey400, spacers.dp8]
14
+ }, [`div.__jsx-style-dynamic-selector{-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;border-top:1px solid ${colors.grey400};padding:0 ${spacers.dp8};}`]));
18
15
  RightFooter.propTypes = {
19
16
  children: PropTypes.node,
20
17
  dataTest: PropTypes.string
@@ -2,19 +2,16 @@ import _JSXStyle from "styled-jsx/style";
2
2
  import { colors, spacers } from '@dhis2/ui-constants';
3
3
  import PropTypes from 'prop-types';
4
4
  import React from 'react';
5
- export const RightHeader = _ref => {
6
- let {
7
- children,
8
- dataTest
9
- } = _ref;
10
- return /*#__PURE__*/React.createElement("div", {
11
- "data-test": dataTest,
12
- className: _JSXStyle.dynamic([["4225731772", [colors.grey400, spacers.dp8]]])
13
- }, children, /*#__PURE__*/React.createElement(_JSXStyle, {
14
- id: "4225731772",
15
- dynamic: [colors.grey400, spacers.dp8]
16
- }, [`div.__jsx-style-dynamic-selector{border-bottom:1px solid ${colors.grey400};-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;padding:0 ${spacers.dp8};}`]));
17
- };
5
+ export const RightHeader = ({
6
+ children,
7
+ dataTest
8
+ }) => /*#__PURE__*/React.createElement("div", {
9
+ "data-test": dataTest,
10
+ className: _JSXStyle.dynamic([["4225731772", [colors.grey400, spacers.dp8]]])
11
+ }, children, /*#__PURE__*/React.createElement(_JSXStyle, {
12
+ id: "4225731772",
13
+ dynamic: [colors.grey400, spacers.dp8]
14
+ }, [`div.__jsx-style-dynamic-selector{border-bottom:1px solid ${colors.grey400};-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;padding:0 ${spacers.dp8};}`]));
18
15
  RightHeader.propTypes = {
19
16
  children: PropTypes.node,
20
17
  dataTest: PropTypes.string
@@ -2,25 +2,22 @@ import _JSXStyle from "styled-jsx/style";
2
2
  import { colors } from '@dhis2/ui-constants';
3
3
  import PropTypes from 'prop-types';
4
4
  import React from 'react';
5
- export const RightSide = _ref => {
6
- let {
7
- children,
8
- dataTest,
9
- width
10
- } = _ref;
11
- return /*#__PURE__*/React.createElement("div", {
12
- "data-test": dataTest,
13
- className: _JSXStyle.dynamic([["2265398144", [colors.white, colors.grey400, width]]])
14
- }, children,
15
- /**
16
- * Flex basis 0px to make sure right and left side
17
- * always have the same width
18
- */
19
- '', /*#__PURE__*/React.createElement(_JSXStyle, {
20
- id: "2265398144",
21
- dynamic: [colors.white, colors.grey400, width]
22
- }, [`div.__jsx-style-dynamic-selector{background-color:${colors.white};border:1px solid ${colors.grey400};border-radius:3px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;max-width:100%;width:${width};}`]));
23
- };
5
+ export const RightSide = ({
6
+ children,
7
+ dataTest,
8
+ width
9
+ }) => /*#__PURE__*/React.createElement("div", {
10
+ "data-test": dataTest,
11
+ className: _JSXStyle.dynamic([["2265398144", [colors.white, colors.grey400, width]]])
12
+ }, children,
13
+ /**
14
+ * Flex basis 0px to make sure right and left side
15
+ * always have the same width
16
+ */
17
+ '', /*#__PURE__*/React.createElement(_JSXStyle, {
18
+ id: "2265398144",
19
+ dynamic: [colors.white, colors.grey400, width]
20
+ }, [`div.__jsx-style-dynamic-selector{background-color:${colors.white};border:1px solid ${colors.grey400};border-radius:3px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;max-width:100%;width:${width};}`]));
24
21
  RightSide.propTypes = {
25
22
  width: PropTypes.string.isRequired,
26
23
  children: PropTypes.node,
@@ -6,19 +6,15 @@
6
6
  * @param {Function} arg.setHighlightedSourceOptions
7
7
  * @returns {void}
8
8
  */
9
- export const addAllSelectableSourceOptions = _ref => {
10
- let {
11
- sourceOptions,
12
- onChange,
13
- selected,
14
- setHighlightedSourceOptions
15
- } = _ref;
16
- const enabledSourceOptions = sourceOptions.filter(_ref2 => {
17
- let {
18
- disabled
19
- } = _ref2;
20
- return !disabled;
21
- });
9
+ export const addAllSelectableSourceOptions = ({
10
+ sourceOptions,
11
+ onChange,
12
+ selected,
13
+ setHighlightedSourceOptions
14
+ }) => {
15
+ const enabledSourceOptions = sourceOptions.filter(({
16
+ disabled
17
+ }) => !disabled);
22
18
  const newSelected = enabledSourceOptions.reduce((accumulatedSelected, enabledSourceOption) => [...accumulatedSelected, enabledSourceOption.value], selected);
23
19
  setHighlightedSourceOptions([]);
24
20
 
@@ -8,16 +8,15 @@
8
8
  * @param {Function} args.setHighlightedSourceOptions
9
9
  * @returns void
10
10
  */
11
- export const addIndividualSourceOptions = _ref => {
12
- let {
13
- filterable,
14
- sourceOptions,
15
- highlightedSourceOptions,
16
- maxSelections,
17
- onChange,
18
- selected,
19
- setHighlightedSourceOptions
20
- } = _ref;
11
+ export const addIndividualSourceOptions = ({
12
+ filterable,
13
+ sourceOptions,
14
+ highlightedSourceOptions,
15
+ maxSelections,
16
+ onChange,
17
+ selected,
18
+ setHighlightedSourceOptions
19
+ }) => {
21
20
  /**
22
21
  * Creates a subset of the highlighted options to reflect a changed
23
22
  * filter value in case previously highlighted options are now
@@ -7,28 +7,25 @@
7
7
  * @param {Function} args.setHighlightedPickedOptions
8
8
  * @returns void
9
9
  */
10
- export const createDoubleClickHandlers = _ref => {
11
- let {
12
- maxSelections,
13
- onChange,
14
- selected,
15
- setHighlightedPickedOptions,
16
- setHighlightedSourceOptions
17
- } = _ref;
18
- const selectSingleOption = _ref2 => {
19
- let {
20
- value
21
- } = _ref2;
10
+ export const createDoubleClickHandlers = ({
11
+ maxSelections,
12
+ onChange,
13
+ selected,
14
+ setHighlightedPickedOptions,
15
+ setHighlightedSourceOptions
16
+ }) => {
17
+ const selectSingleOption = ({
18
+ value
19
+ }) => {
22
20
  const newSelected = selected.includes(value) ? selected : [...selected, value];
23
21
  setHighlightedSourceOptions([]);
24
22
  onChange({
25
23
  selected: newSelected.slice(-1 * maxSelections)
26
24
  });
27
25
  };
28
- const deselectSingleOption = _ref3 => {
29
- let {
30
- value
31
- } = _ref3;
26
+ const deselectSingleOption = ({
27
+ value
28
+ }) => {
32
29
  const newSelected = selected.filter(curSelected => curSelected !== value);
33
30
  setHighlightedPickedOptions([]);
34
31
  onChange({
@@ -9,12 +9,9 @@ export const defaultFilterCallback = (options, filter) => {
9
9
  }
10
10
  try {
11
11
  const regex = new RegExp(filter, 'i');
12
- return options.filter(_ref => {
13
- let {
14
- label
15
- } = _ref;
16
- return label.match(regex);
17
- });
12
+ return options.filter(({
13
+ label
14
+ }) => label.match(regex));
18
15
  } catch {
19
16
  console.warn('Invalid regex filter:', filter);
20
17
  return options;
@@ -11,11 +11,10 @@
11
11
  * @param {string[]} args.highlightedPickedOptions
12
12
  * @returns {number[]}
13
13
  */
14
- export const getHighlightedPickedIndices = _ref => {
15
- let {
16
- selected,
17
- highlightedPickedOptions
18
- } = _ref;
14
+ export const getHighlightedPickedIndices = ({
15
+ selected,
16
+ highlightedPickedOptions
17
+ }) => {
19
18
  const highlightedSet = new Set(highlightedPickedOptions);
20
19
  const indices = [];
21
20
  selected.forEach((value, index) => {
@@ -7,12 +7,11 @@ import { getHighlightedPickedIndices } from './get-highlighted-picked-indices.js
7
7
  * @param {boolean} [args.filterActivePicked] reorder is disabled while a filter is applied to the picked side
8
8
  * @returns {bool}
9
9
  */
10
- export const isReorderDownDisabled = _ref => {
11
- let {
12
- highlightedPickedOptions,
13
- selected,
14
- filterActivePicked = false
15
- } = _ref;
10
+ export const isReorderDownDisabled = ({
11
+ highlightedPickedOptions,
12
+ selected,
13
+ filterActivePicked = false
14
+ }) => {
16
15
  if (filterActivePicked) {
17
16
  return true;
18
17
  }
@@ -7,12 +7,11 @@ import { getHighlightedPickedIndices } from './get-highlighted-picked-indices.js
7
7
  * @param {boolean} [args.filterActivePicked] reorder is disabled while a filter is applied to the picked side
8
8
  * @returns {bool}
9
9
  */
10
- export const isReorderUpDisabled = _ref => {
11
- let {
12
- highlightedPickedOptions,
13
- selected,
14
- filterActivePicked = false
15
- } = _ref;
10
+ export const isReorderUpDisabled = ({
11
+ highlightedPickedOptions,
12
+ selected,
13
+ filterActivePicked = false
14
+ }) => {
16
15
  if (filterActivePicked) {
17
16
  return true;
18
17
  }
@@ -12,12 +12,11 @@ import { getHighlightedPickedIndices } from './get-highlighted-picked-indices.js
12
12
  * @param {Function} args.onChange
13
13
  * @returns {void}
14
14
  */
15
- export const moveHighlightedPickedOptionDown = _ref => {
16
- let {
17
- selected,
18
- highlightedPickedOptions,
19
- onChange
20
- } = _ref;
15
+ export const moveHighlightedPickedOptionDown = ({
16
+ selected,
17
+ highlightedPickedOptions,
18
+ onChange
19
+ }) => {
21
20
  const indices = getHighlightedPickedIndices({
22
21
  selected,
23
22
  highlightedPickedOptions
@@ -11,12 +11,11 @@ import { getHighlightedPickedIndices } from './get-highlighted-picked-indices.js
11
11
  * @param {Function} args.onChange
12
12
  * @returns {void}
13
13
  */
14
- export const moveHighlightedPickedOptionToBottom = _ref => {
15
- let {
16
- selected,
17
- highlightedPickedOptions,
18
- onChange
19
- } = _ref;
14
+ export const moveHighlightedPickedOptionToBottom = ({
15
+ selected,
16
+ highlightedPickedOptions,
17
+ onChange
18
+ }) => {
20
19
  const indices = getHighlightedPickedIndices({
21
20
  selected,
22
21
  highlightedPickedOptions
@@ -11,12 +11,11 @@ import { getHighlightedPickedIndices } from './get-highlighted-picked-indices.js
11
11
  * @param {Function} args.onChange
12
12
  * @returns {void}
13
13
  */
14
- export const moveHighlightedPickedOptionToTop = _ref => {
15
- let {
16
- selected,
17
- highlightedPickedOptions,
18
- onChange
19
- } = _ref;
14
+ export const moveHighlightedPickedOptionToTop = ({
15
+ selected,
16
+ highlightedPickedOptions,
17
+ onChange
18
+ }) => {
20
19
  const indices = getHighlightedPickedIndices({
21
20
  selected,
22
21
  highlightedPickedOptions
@@ -12,12 +12,11 @@ import { getHighlightedPickedIndices } from './get-highlighted-picked-indices.js
12
12
  * @param {Function} args.onChange
13
13
  * @returns {void}
14
14
  */
15
- export const moveHighlightedPickedOptionUp = _ref => {
16
- let {
17
- selected,
18
- highlightedPickedOptions,
19
- onChange
20
- } = _ref;
15
+ export const moveHighlightedPickedOptionUp = ({
16
+ selected,
17
+ highlightedPickedOptions,
18
+ onChange
19
+ }) => {
21
20
  const indices = getHighlightedPickedIndices({
22
21
  selected,
23
22
  highlightedPickedOptions
@@ -4,11 +4,10 @@
4
4
  * @param {Function} args.onChange
5
5
  * @returns {void}
6
6
  */
7
- export const removeAllPickedOptions = _ref => {
8
- let {
9
- setHighlightedPickedOptions,
10
- onChange
11
- } = _ref;
7
+ export const removeAllPickedOptions = ({
8
+ setHighlightedPickedOptions,
9
+ onChange
10
+ }) => {
12
11
  setHighlightedPickedOptions([]);
13
12
  onChange({
14
13
  selected: []
@@ -6,15 +6,14 @@
6
6
  * @param {Function} args.onChange
7
7
  * @returns {void}
8
8
  */
9
- export const removeIndividualPickedOptions = _ref => {
10
- let {
11
- filterablePicked,
12
- pickedOptions,
13
- highlightedPickedOptions,
14
- onChange,
15
- selected,
16
- setHighlightedPickedOptions
17
- } = _ref;
9
+ export const removeIndividualPickedOptions = ({
10
+ filterablePicked,
11
+ pickedOptions,
12
+ highlightedPickedOptions,
13
+ onChange,
14
+ selected,
15
+ setHighlightedPickedOptions
16
+ }) => {
18
17
  /**
19
18
  * Creates a subset of the highlighted options to reflect a changed
20
19
  * filter value in case previously highlighted options are now
@@ -1,13 +1,12 @@
1
1
  import { useState } from 'react';
2
2
  const identity = value => value;
3
- export const useFilter = _ref => {
4
- let {
5
- initialSearchTerm,
6
- onFilterChange,
7
- externalSearchTerm,
8
- filterable,
9
- filterCallback
10
- } = _ref;
3
+ export const useFilter = ({
4
+ initialSearchTerm,
5
+ onFilterChange,
6
+ externalSearchTerm,
7
+ filterable,
8
+ filterCallback
9
+ }) => {
11
10
  const [internalFilter, setInternalFilter] = useState(initialSearchTerm);
12
11
  const filterValue = onFilterChange ? externalSearchTerm : internalFilter;
13
12
  const filter = filterable ? filterCallback : identity;