@dhis2-ui/transfer 8.2.0 → 8.2.1

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 (125) hide show
  1. package/build/cjs/__e2e__/add_remove-highlighted-options.stories.e2e.js +30 -21
  2. package/build/cjs/__e2e__/common/stateful-decorator.js +26 -19
  3. package/build/cjs/__e2e__/disabled-transfer-buttons.stories.e2e.js +70 -49
  4. package/build/cjs/__e2e__/disabled-transfer-options.stories.e2e.js +14 -11
  5. package/build/cjs/__e2e__/display-order.stories.e2e.js +29 -20
  6. package/build/cjs/__e2e__/filter-options-list.stories.e2e.js +97 -73
  7. package/build/cjs/__e2e__/highlight-range-of-options.stories.e2e.js +49 -34
  8. package/build/cjs/__e2e__/loading_lists.stories.e2e.js +1 -1
  9. package/build/cjs/__e2e__/notify_at_end_of_list.stories.e2e.js +61 -43
  10. package/build/cjs/__e2e__/reorder-with-buttons.stories.e2e.js +19 -13
  11. package/build/cjs/__e2e__/set_unset-highlighted-option.stories.e2e.js +30 -21
  12. package/build/cjs/__e2e__/transferring-items.stories.e2e.js +29 -20
  13. package/build/cjs/__tests__/helper/use-highlighted-option/toggle-add.test.js +6 -3
  14. package/build/cjs/__tests__/helper/use-highlighted-option/toggle-range.test.js +48 -24
  15. package/build/cjs/__tests__/transfer.test.js +18 -10
  16. package/build/cjs/actions.js +13 -10
  17. package/build/cjs/add-all.js +17 -14
  18. package/build/cjs/add-individual.js +16 -13
  19. package/build/cjs/common/get-mode-by-modifier-key.js +7 -6
  20. package/build/cjs/common/modes.js +1 -1
  21. package/build/cjs/container.js +15 -12
  22. package/build/cjs/end-intersection-detector.js +21 -15
  23. package/build/cjs/features/disabled-transfer-options/index.js +4 -2
  24. package/build/cjs/features/display-order/index.js +47 -26
  25. package/build/cjs/features/filter-options-list/index.js +6 -3
  26. package/build/cjs/features/highlight-range-of-options/index.js +10 -5
  27. package/build/cjs/features/loading_lists/index.js +2 -2
  28. package/build/cjs/features/notify_at_end_of_list/index.js +5 -3
  29. package/build/cjs/features/set_unset-highlighted-option/index.js +6 -3
  30. package/build/cjs/features/transferring-items/index.js +77 -42
  31. package/build/cjs/filter.js +26 -23
  32. package/build/cjs/icons.js +134 -116
  33. package/build/cjs/left-footer.js +13 -10
  34. package/build/cjs/left-header.js +13 -10
  35. package/build/cjs/left-side.js +19 -16
  36. package/build/cjs/options-container.js +17 -16
  37. package/build/cjs/picked-options.js +22 -19
  38. package/build/cjs/remove-all.js +16 -13
  39. package/build/cjs/remove-individual.js +16 -13
  40. package/build/cjs/reordering-actions.js +34 -31
  41. package/build/cjs/right-footer.js +13 -10
  42. package/build/cjs/right-header.js +13 -10
  43. package/build/cjs/right-side.js +19 -16
  44. package/build/cjs/source-options.js +22 -19
  45. package/build/cjs/transfer/add-all-selectable-source-options.js +13 -9
  46. package/build/cjs/transfer/add-individual-source-options.js +11 -9
  47. package/build/cjs/transfer/create-double-click-handlers.js +17 -13
  48. package/build/cjs/transfer/default-filter-callback.js +6 -3
  49. package/build/cjs/transfer/is-reorder-down-disabled.js +10 -6
  50. package/build/cjs/transfer/is-reorder-up-disabled.js +10 -6
  51. package/build/cjs/transfer/move-highlighted-picked-option-down.js +6 -5
  52. package/build/cjs/transfer/move-highlighted-picked-option-up.js +6 -5
  53. package/build/cjs/transfer/remove-all-picked-options.js +5 -4
  54. package/build/cjs/transfer/remove-individual-picked-options.js +10 -8
  55. package/build/cjs/transfer/use-filter.js +8 -7
  56. package/build/cjs/transfer/use-highlighted-options/create-toggle-highlighted-option.js +45 -40
  57. package/build/cjs/transfer/use-highlighted-options/toggle-add.js +7 -6
  58. package/build/cjs/transfer/use-highlighted-options/toggle-range.js +16 -11
  59. package/build/cjs/transfer/use-highlighted-options/toggle-replace.js +7 -5
  60. package/build/cjs/transfer/use-highlighted-options.js +7 -5
  61. package/build/cjs/transfer-option.js +12 -11
  62. package/build/cjs/transfer.js +86 -72
  63. package/build/cjs/transfer.stories.js +127 -131
  64. package/build/es/__e2e__/add_remove-highlighted-options.stories.e2e.js +29 -20
  65. package/build/es/__e2e__/common/stateful-decorator.js +26 -19
  66. package/build/es/__e2e__/disabled-transfer-buttons.stories.e2e.js +69 -48
  67. package/build/es/__e2e__/disabled-transfer-options.stories.e2e.js +13 -10
  68. package/build/es/__e2e__/display-order.stories.e2e.js +28 -19
  69. package/build/es/__e2e__/filter-options-list.stories.e2e.js +96 -72
  70. package/build/es/__e2e__/highlight-range-of-options.stories.e2e.js +48 -33
  71. package/build/es/__e2e__/notify_at_end_of_list.stories.e2e.js +60 -42
  72. package/build/es/__e2e__/reorder-with-buttons.stories.e2e.js +18 -12
  73. package/build/es/__e2e__/set_unset-highlighted-option.stories.e2e.js +29 -20
  74. package/build/es/__e2e__/transferring-items.stories.e2e.js +28 -19
  75. package/build/es/__tests__/helper/use-highlighted-option/toggle-add.test.js +6 -3
  76. package/build/es/__tests__/helper/use-highlighted-option/toggle-range.test.js +48 -24
  77. package/build/es/__tests__/transfer.test.js +18 -10
  78. package/build/es/actions.js +13 -10
  79. package/build/es/add-all.js +17 -14
  80. package/build/es/add-individual.js +16 -13
  81. package/build/es/common/get-mode-by-modifier-key.js +7 -6
  82. package/build/es/container.js +15 -12
  83. package/build/es/end-intersection-detector.js +21 -15
  84. package/build/es/features/disabled-transfer-options/index.js +4 -2
  85. package/build/es/features/display-order/index.js +47 -26
  86. package/build/es/features/filter-options-list/index.js +6 -3
  87. package/build/es/features/highlight-range-of-options/index.js +10 -5
  88. package/build/es/features/loading_lists/index.js +2 -2
  89. package/build/es/features/notify_at_end_of_list/index.js +5 -3
  90. package/build/es/features/set_unset-highlighted-option/index.js +6 -3
  91. package/build/es/features/transferring-items/index.js +77 -42
  92. package/build/es/filter.js +26 -23
  93. package/build/es/icons.js +133 -115
  94. package/build/es/left-footer.js +13 -10
  95. package/build/es/left-header.js +13 -10
  96. package/build/es/left-side.js +19 -16
  97. package/build/es/options-container.js +17 -16
  98. package/build/es/picked-options.js +22 -19
  99. package/build/es/remove-all.js +16 -13
  100. package/build/es/remove-individual.js +16 -13
  101. package/build/es/reordering-actions.js +34 -31
  102. package/build/es/right-footer.js +13 -10
  103. package/build/es/right-header.js +13 -10
  104. package/build/es/right-side.js +19 -16
  105. package/build/es/source-options.js +22 -19
  106. package/build/es/transfer/add-all-selectable-source-options.js +13 -9
  107. package/build/es/transfer/add-individual-source-options.js +11 -9
  108. package/build/es/transfer/create-double-click-handlers.js +17 -13
  109. package/build/es/transfer/default-filter-callback.js +6 -3
  110. package/build/es/transfer/is-reorder-down-disabled.js +10 -6
  111. package/build/es/transfer/is-reorder-up-disabled.js +10 -6
  112. package/build/es/transfer/move-highlighted-picked-option-down.js +6 -5
  113. package/build/es/transfer/move-highlighted-picked-option-up.js +6 -5
  114. package/build/es/transfer/remove-all-picked-options.js +5 -4
  115. package/build/es/transfer/remove-individual-picked-options.js +10 -8
  116. package/build/es/transfer/use-filter.js +8 -7
  117. package/build/es/transfer/use-highlighted-options/create-toggle-highlighted-option.js +45 -40
  118. package/build/es/transfer/use-highlighted-options/toggle-add.js +7 -6
  119. package/build/es/transfer/use-highlighted-options/toggle-range.js +16 -11
  120. package/build/es/transfer/use-highlighted-options/toggle-replace.js +7 -5
  121. package/build/es/transfer/use-highlighted-options.js +7 -5
  122. package/build/es/transfer-option.js +12 -11
  123. package/build/es/transfer.js +86 -72
  124. package/build/es/transfer.stories.js +126 -130
  125. package/package.json +7 -7
@@ -39,7 +39,8 @@ Then('the previously highlighted item should no longer be highlighted', () => {
39
39
  cy.get('@initiallyHighlighted').should('have.not.class', 'highlighted');
40
40
  });
41
41
  Then('the option is visible', () => {
42
- cy.all(() => cy.get('@hiddenHighlighted'), () => cy.get('{transfer-sourceoptions} {transferoption}')).should(([hiddenHighlighted, $options]) => {
42
+ cy.all(() => cy.get('@hiddenHighlighted'), () => cy.get('{transfer-sourceoptions} {transferoption}')).should(_ref => {
43
+ let [hiddenHighlighted, $options] = _ref;
43
44
  const $hiddenHighlighted = $options.filter((index, optionEl) => {
44
45
  const option = extractOptionFromElement(optionEl);
45
46
  return option.label === hiddenHighlighted.label && option.value === hiddenHighlighted.value;
@@ -48,7 +49,8 @@ Then('the option is visible', () => {
48
49
  });
49
50
  });
50
51
  Then('the option is highlighted', () => {
51
- cy.all(() => cy.get('@hiddenHighlighted'), () => cy.get('{transfer-sourceoptions} {transferoption}')).should(([hiddenHighlighted, $options]) => {
52
+ cy.all(() => cy.get('@hiddenHighlighted'), () => cy.get('{transfer-sourceoptions} {transferoption}')).should(_ref2 => {
53
+ let [hiddenHighlighted, $options] = _ref2;
52
54
  const $hiddenHighlighted = $options.filter((index, optionEl) => {
53
55
  const option = extractOptionFromElement(optionEl);
54
56
  return option.label === hiddenHighlighted.label && option.value === hiddenHighlighted.value;
@@ -57,7 +59,8 @@ Then('the option is highlighted', () => {
57
59
  });
58
60
  });
59
61
  Then('the option is not highlighted', () => {
60
- cy.all(() => cy.get('@hiddenHighlighted'), () => cy.get('{transfer-sourceoptions} {transferoption}')).should(([hiddenHighlighted, $options]) => {
62
+ cy.all(() => cy.get('@hiddenHighlighted'), () => cy.get('{transfer-sourceoptions} {transferoption}')).should(_ref3 => {
63
+ let [hiddenHighlighted, $options] = _ref3;
61
64
  const $hiddenHighlighted = $options.filter((index, optionEl) => {
62
65
  const option = extractOptionFromElement(optionEl);
63
66
  return option.label === hiddenHighlighted.label && option.value === hiddenHighlighted.value;
@@ -40,69 +40,90 @@ When('the user double clicks an item in the selected list', () => {
40
40
  cy.get('{transfer-pickedoptions} {transferoption}').first().dblclick().then(extractOptionFromElement).as('doubleClickedPlainOption');
41
41
  });
42
42
  Then('the highlighted items should be removed from the options list', () => {
43
- cy.all(() => cy.get('@itemsToBeSelected'), () => cy.get('{transfer-sourceoptions} {transferoption}')).should(([itemsToBeSelected, $selectableSourceOptions]) => {
43
+ cy.all(() => cy.get('@itemsToBeSelected'), () => cy.get('{transfer-sourceoptions} {transferoption}')).should(_ref => {
44
+ let [itemsToBeSelected, $selectableSourceOptions] = _ref;
44
45
  const selectableSourceOptions = $selectableSourceOptions.toArray().map(extractOptionFromElement);
45
46
  const itemsStillSelectable = itemsToBeSelected.every(itemToBeSelected => {
46
- const result = selectableSourceOptions.find(({
47
- label,
48
- value
49
- }) => label === itemToBeSelected.label && value === itemToBeSelected.value);
47
+ const result = selectableSourceOptions.find(_ref2 => {
48
+ let {
49
+ label,
50
+ value
51
+ } = _ref2;
52
+ return label === itemToBeSelected.label && value === itemToBeSelected.value;
53
+ });
50
54
  return result;
51
55
  });
52
56
  expect(itemsStillSelectable).to.equal(false);
53
57
  });
54
58
  });
55
59
  Then('the highlighted items should be visible in the selected list', () => {
56
- cy.all(() => cy.get('@itemsToBeSelected'), () => cy.get('{transfer-pickedoptions} {transferoption}')).should(([itemsToBeSelected, $selectedOptions]) => {
60
+ cy.all(() => cy.get('@itemsToBeSelected'), () => cy.get('{transfer-pickedoptions} {transferoption}')).should(_ref3 => {
61
+ let [itemsToBeSelected, $selectedOptions] = _ref3;
57
62
  const selectedOptions = $selectedOptions.toArray().map(extractOptionFromElement);
58
- const itemsSelected = itemsToBeSelected.every(itemToBeSelected => selectedOptions.find(({
59
- label,
60
- value
61
- }) => label === itemToBeSelected.label && value === itemToBeSelected.value));
63
+ const itemsSelected = itemsToBeSelected.every(itemToBeSelected => selectedOptions.find(_ref4 => {
64
+ let {
65
+ label,
66
+ value
67
+ } = _ref4;
68
+ return label === itemToBeSelected.label && value === itemToBeSelected.value;
69
+ }));
62
70
  expect(itemsSelected).to.equal(true);
63
71
  });
64
72
  });
65
73
  Then('the highlighted items should be appended to the selected list in the order they were highlighted', () => {
66
- cy.all(() => cy.get('@itemsToBeSelected'), () => cy.get('{transfer-pickedoptions} {transferoption}')).should(([itemsToBeSelected, $selectedOptions]) => {
74
+ cy.all(() => cy.get('@itemsToBeSelected'), () => cy.get('{transfer-pickedoptions} {transferoption}')).should(_ref5 => {
75
+ let [itemsToBeSelected, $selectedOptions] = _ref5;
67
76
  const lastNSelectedOptions = $selectedOptions.toArray().map(extractOptionFromElement).slice(itemsToBeSelected.length * -1);
68
77
  expect(itemsToBeSelected).to.eql(lastNSelectedOptions);
69
78
  });
70
79
  });
71
80
  Then('the highlighted items should be removed from the selected list', () => {
72
- cy.all(() => cy.get('@itemsToBeDeselected'), () => cy.get('{transfer-pickedoptions} {transferoption}')).should(([itemsToBeDeselected, $selectedOptions]) => {
81
+ cy.all(() => cy.get('@itemsToBeDeselected'), () => cy.get('{transfer-pickedoptions} {transferoption}')).should(_ref6 => {
82
+ let [itemsToBeDeselected, $selectedOptions] = _ref6;
73
83
  const selectedOptions = $selectedOptions.toArray().map(extractOptionFromElement);
74
84
  const itemsStillSelected = itemsToBeDeselected.every(itemToBeSelected => {
75
- const result = selectedOptions.find(({
76
- label,
77
- value
78
- }) => label === itemToBeSelected.label && value === itemToBeSelected.value);
85
+ const result = selectedOptions.find(_ref7 => {
86
+ let {
87
+ label,
88
+ value
89
+ } = _ref7;
90
+ return label === itemToBeSelected.label && value === itemToBeSelected.value;
91
+ });
79
92
  return result;
80
93
  });
81
94
  expect(itemsStillSelected).to.equal(false);
82
95
  });
83
96
  });
84
97
  Then('the highlighted items should be visible in the options list', () => {
85
- cy.all(() => cy.get('@itemsToBeDeselected'), () => cy.get('{transfer-sourceoptions} {transferoption}')).should(([itemsToBeDeselected, $selectedOptions]) => {
98
+ cy.all(() => cy.get('@itemsToBeDeselected'), () => cy.get('{transfer-sourceoptions} {transferoption}')).should(_ref8 => {
99
+ let [itemsToBeDeselected, $selectedOptions] = _ref8;
86
100
  const selectedOptions = $selectedOptions.toArray().map(extractOptionFromElement);
87
101
  const itemsSelectable = itemsToBeDeselected.every(itemToBeSelected => {
88
- const result = selectedOptions.find(({
89
- label,
90
- value
91
- }) => label === itemToBeSelected.label && value === itemToBeSelected.value);
102
+ const result = selectedOptions.find(_ref9 => {
103
+ let {
104
+ label,
105
+ value
106
+ } = _ref9;
107
+ return label === itemToBeSelected.label && value === itemToBeSelected.value;
108
+ });
92
109
  return result;
93
110
  });
94
111
  expect(itemsSelectable).to.equal(true);
95
112
  });
96
113
  });
97
114
  Then('the highlighted items should be in the original options list ordering', () => {
98
- cy.all(() => cy.window(), () => cy.get('{transfer-sourceoptions} {transferoption}'), () => cy.get('{transfer-pickedoptions} {transferoption}')).should(([win, $selectableSourceOptions, $selectedOptions]) => {
115
+ cy.all(() => cy.window(), () => cy.get('{transfer-sourceoptions} {transferoption}'), () => cy.get('{transfer-pickedoptions} {transferoption}')).should(_ref10 => {
116
+ let [win, $selectableSourceOptions, $selectedOptions] = _ref10;
99
117
  const selectedOptions = $selectedOptions.toArray().map(extractOptionFromElement);
100
118
  const selectableSourceOptions = $selectableSourceOptions.toArray().map(extractOptionFromElement);
101
119
  const allOptionsWithoutSelected = win.options.filter(option => {
102
- return !selectedOptions.find(({
103
- label,
104
- value
105
- }) => option.label === label && option.value === value);
120
+ return !selectedOptions.find(_ref11 => {
121
+ let {
122
+ label,
123
+ value
124
+ } = _ref11;
125
+ return option.label === label && option.value === value;
126
+ });
106
127
  });
107
128
  expect(allOptionsWithoutSelected).to.eql(selectableSourceOptions);
108
129
  });
@@ -111,19 +132,24 @@ Then('all items should be removed from the options list', () => {
111
132
  cy.get('{transfer-sourceoptions} {transferoption}').should('not.exist');
112
133
  });
113
134
  Then('all items removed from options list should be visible in the selected list', () => {
114
- cy.all(() => cy.get('@itemsToBeSelected'), () => cy.get('{transfer-pickedoptions} {transferoption}')).should(([itemsToBeSelected, $selectedOptions]) => {
135
+ cy.all(() => cy.get('@itemsToBeSelected'), () => cy.get('{transfer-pickedoptions} {transferoption}')).should(_ref12 => {
136
+ let [itemsToBeSelected, $selectedOptions] = _ref12;
115
137
  const selectedOptions = $selectedOptions.toArray().map(extractOptionFromElement);
116
138
  const allSelected = itemsToBeSelected.every(option => {
117
- return selectedOptions.find(({
118
- label,
119
- value
120
- }) => option.label === label && option.value === value);
139
+ return selectedOptions.find(_ref13 => {
140
+ let {
141
+ label,
142
+ value
143
+ } = _ref13;
144
+ return option.label === label && option.value === value;
145
+ });
121
146
  });
122
147
  expect(allSelected).to.equal(true);
123
148
  });
124
149
  });
125
150
  Then('the transferred items should be appended to the selected list in the order they were displayed in the options list', () => {
126
- cy.all(() => cy.get('@itemsToBeSelected'), () => cy.get('{transfer-pickedoptions} {transferoption}')).should(([itemsToBeSelected, $selectedOptions]) => {
151
+ cy.all(() => cy.get('@itemsToBeSelected'), () => cy.get('{transfer-pickedoptions} {transferoption}')).should(_ref14 => {
152
+ let [itemsToBeSelected, $selectedOptions] = _ref14;
127
153
  const selectedOptions = $selectedOptions.toArray().map(extractOptionFromElement);
128
154
  const previouslySelectedSubset = selectedOptions.slice(-1 * itemsToBeSelected.length);
129
155
  expect(itemsToBeSelected).to.eql(previouslySelectedSubset);
@@ -133,19 +159,24 @@ Then('all items should be removed from the selected list', () => {
133
159
  cy.get('{transfer-pickedoptions} {transferoption}').should('not.exist');
134
160
  });
135
161
  Then('all items removed from selected list should be visible in the options list', () => {
136
- cy.all(() => cy.get('@itemsToBeDeselected'), () => cy.get('{transfer-sourceoptions} {transferoption}')).should(([itemsToBeDeselected, $selectableSourceOptions]) => {
162
+ cy.all(() => cy.get('@itemsToBeDeselected'), () => cy.get('{transfer-sourceoptions} {transferoption}')).should(_ref15 => {
163
+ let [itemsToBeDeselected, $selectableSourceOptions] = _ref15;
137
164
  const selectableSourceOptions = $selectableSourceOptions.toArray().map(extractOptionFromElement);
138
165
  const allSelectable = itemsToBeDeselected.every(option => {
139
- return selectableSourceOptions.find(({
140
- label,
141
- value
142
- }) => option.label === label && option.value === value);
166
+ return selectableSourceOptions.find(_ref16 => {
167
+ let {
168
+ label,
169
+ value
170
+ } = _ref16;
171
+ return option.label === label && option.value === value;
172
+ });
143
173
  });
144
174
  expect(allSelectable).to.equal(true);
145
175
  });
146
176
  });
147
177
  Then('the transferred items should be appended to the selected list in the order they were displayed in the options list', () => {
148
- cy.all(() => cy.get('@itemsToBeSelected'), () => cy.get('{transfer-pickedoptions} {transferoption}')).should(([itemsToBeSelected, $selectedOptions]) => {
178
+ cy.all(() => cy.get('@itemsToBeSelected'), () => cy.get('{transfer-pickedoptions} {transferoption}')).should(_ref17 => {
179
+ let [itemsToBeSelected, $selectedOptions] = _ref17;
149
180
  const selectedOptions = $selectedOptions.toArray().map(extractOptionFromElement);
150
181
  const previouslySelectedSubset = selectedOptions.slice(-1 * itemsToBeSelected.length);
151
182
  expect(itemsToBeSelected).to.eql(previouslySelectedSubset);
@@ -154,7 +185,8 @@ Then('the transferred items should be appended to the selected list in the order
154
185
  Then('the options list items should be ordered in the original order', () => {
155
186
  cy.all(() => cy.window(), () => cy.get('{transfer-sourceoptions} {transferoption}'), () => cy.get('{transfer-pickedoptions}').then($pickedOptions => {
156
187
  return $pickedOptions.find(parseSelectorWithDataTest('{transferoption}'));
157
- })).should(([win, $selectableSourceOptions, $pickedOptions]) => {
188
+ })).should(_ref18 => {
189
+ let [win, $selectableSourceOptions, $pickedOptions] = _ref18;
158
190
  const pickedPlainOptions = $pickedOptions.toArray().map(extractOptionFromElement);
159
191
  const originalOrderWithoutSelected = win.options.filter(originalOption => {
160
192
  return !pickedPlainOptions.find(pickedPlainOption => pickedPlainOption.value === originalOption.value && pickedPlainOption.label === originalOption.label);
@@ -164,21 +196,24 @@ Then('the options list items should be ordered in the original order', () => {
164
196
  });
165
197
  });
166
198
  Then('the item should be removed from its options list', () => {
167
- cy.all(() => cy.get('@doubleClickedPlainOption'), () => cy.get('{transfer-sourceoptions} {transferoption}')).should(([doubleClickedPlainOption, $sourceOptions]) => {
199
+ cy.all(() => cy.get('@doubleClickedPlainOption'), () => cy.get('{transfer-sourceoptions} {transferoption}')).should(_ref19 => {
200
+ let [doubleClickedPlainOption, $sourceOptions] = _ref19;
168
201
  const sourcePlainOptions = $sourceOptions.toArray().map(extractOptionFromElement);
169
202
  const found = sourcePlainOptions.find(sourcePlainOption => sourcePlainOption.value === doubleClickedPlainOption.value && sourcePlainOption.label === doubleClickedPlainOption.label);
170
203
  expect(found).to.not.equal(true);
171
204
  });
172
205
  });
173
206
  Then('the item should be visible at the bottom of the selected list', () => {
174
- cy.all(() => cy.get('@doubleClickedPlainOption'), () => cy.get('{transfer-pickedoptions} {transferoption}')).should(([doubleClickedPlainOption, $pickedOptions]) => {
207
+ cy.all(() => cy.get('@doubleClickedPlainOption'), () => cy.get('{transfer-pickedoptions} {transferoption}')).should(_ref20 => {
208
+ let [doubleClickedPlainOption, $pickedOptions] = _ref20;
175
209
  const lastSourcePlainOption = $pickedOptions.last().toArray().map(extractOptionFromElement).pop();
176
210
  const doubleClickedOptionIsLast = lastSourcePlainOption.value === doubleClickedPlainOption.value && lastSourcePlainOption.label === doubleClickedPlainOption.label;
177
211
  expect(doubleClickedOptionIsLast).to.equal(true);
178
212
  });
179
213
  });
180
214
  Then('the item should be removed from the selected list', () => {
181
- cy.all(() => cy.get('@doubleClickedPlainOption'), () => cy.get('{transfer-pickedoptions} {transferoption}')).should(([doubleClickedPlainOption, $pickedOptions]) => {
215
+ cy.all(() => cy.get('@doubleClickedPlainOption'), () => cy.get('{transfer-pickedoptions} {transferoption}')).should(_ref21 => {
216
+ let [doubleClickedPlainOption, $pickedOptions] = _ref21;
182
217
  const pickedPlainOptions = $pickedOptions.toArray().map(extractOptionFromElement);
183
218
  const found = pickedPlainOptions.find(sourcePlainOption => sourcePlainOption.value === doubleClickedPlainOption.value && sourcePlainOption.label === doubleClickedPlainOption.label);
184
219
  expect(found).to.not.equal(true);
@@ -4,29 +4,32 @@ import { Input } from '@dhis2-ui/input';
4
4
  import { spacers } from '@dhis2/ui-constants';
5
5
  import PropTypes from 'prop-types';
6
6
  import React from 'react';
7
- export const Filter = ({
8
- dataTest,
9
- filter,
10
- onChange,
11
- label,
12
- placeholder
13
- }) => /*#__PURE__*/React.createElement("div", {
14
- "data-test": dataTest,
15
- className: _JSXStyle.dynamic([["3679907342", [spacers.dp8, spacers.dp8]]])
16
- }, /*#__PURE__*/React.createElement(Field, {
17
- label: label,
18
- name: dataTest,
19
- dataTest: `${dataTest}-field`
20
- }, /*#__PURE__*/React.createElement(Input, {
21
- dataTest: `${dataTest}-input`,
22
- type: "search",
23
- placeholder: placeholder,
24
- value: filter,
25
- onChange: onChange
26
- })), /*#__PURE__*/React.createElement(_JSXStyle, {
27
- id: "3679907342",
28
- dynamic: [spacers.dp8, spacers.dp8]
29
- }, [`div.__jsx-style-dynamic-selector{padding-bottom:${spacers.dp8};}`, `div.__jsx-style-dynamic-selector:first-child{padding-top:${spacers.dp8};}`]));
7
+ export const Filter = _ref => {
8
+ let {
9
+ dataTest,
10
+ filter,
11
+ onChange,
12
+ label,
13
+ placeholder
14
+ } = _ref;
15
+ return /*#__PURE__*/React.createElement("div", {
16
+ "data-test": dataTest,
17
+ className: _JSXStyle.dynamic([["3679907342", [spacers.dp8, spacers.dp8]]])
18
+ }, /*#__PURE__*/React.createElement(Field, {
19
+ label: label,
20
+ name: dataTest,
21
+ dataTest: "".concat(dataTest, "-field")
22
+ }, /*#__PURE__*/React.createElement(Input, {
23
+ dataTest: "".concat(dataTest, "-input"),
24
+ type: "search",
25
+ placeholder: placeholder,
26
+ value: filter,
27
+ onChange: onChange
28
+ })), /*#__PURE__*/React.createElement(_JSXStyle, {
29
+ id: "3679907342",
30
+ dynamic: [spacers.dp8, spacers.dp8]
31
+ }, ["div.__jsx-style-dynamic-selector{padding-bottom:".concat(spacers.dp8, ";}"), "div.__jsx-style-dynamic-selector:first-child{padding-top:".concat(spacers.dp8, ";}")]));
32
+ };
30
33
  Filter.propTypes = {
31
34
  dataTest: PropTypes.string.isRequired,
32
35
  filter: PropTypes.string.isRequired,
package/build/es/icons.js CHANGED
@@ -4,141 +4,159 @@ import PropTypes from 'prop-types';
4
4
  import React from 'react';
5
5
  const centerButtonStyles = ["svg.jsx-114231192{min-width:20px;}"];
6
6
  centerButtonStyles.__hash = "114231192";
7
- export const IconAddAll = ({
8
- dataTest,
9
- disabled
10
- }) => /*#__PURE__*/React.createElement("svg", {
11
- xmlns: "http://www.w3.org/2000/svg",
12
- width: "16",
13
- height: "16",
14
- viewBox: "0 0 16 16",
15
- "data-test": dataTest,
16
- fill: disabled ? theme.disabled : '#404B5A',
17
- className: `jsx-${centerButtonStyles.__hash}`
18
- }, /*#__PURE__*/React.createElement("g", {
19
- fillRule: "evenodd",
20
- className: `jsx-${centerButtonStyles.__hash}`
21
- }, /*#__PURE__*/React.createElement("polygon", {
22
- fillRule: "nonzero",
23
- 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",
24
- className: `jsx-${centerButtonStyles.__hash}`
25
- }), /*#__PURE__*/React.createElement("polygon", {
26
- fillRule: "nonzero",
27
- 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",
28
- className: `jsx-${centerButtonStyles.__hash}`
29
- })), /*#__PURE__*/React.createElement(_JSXStyle, {
30
- id: centerButtonStyles.__hash
31
- }, centerButtonStyles));
7
+ export const IconAddAll = _ref => {
8
+ let {
9
+ dataTest,
10
+ disabled
11
+ } = _ref;
12
+ return /*#__PURE__*/React.createElement("svg", {
13
+ xmlns: "http://www.w3.org/2000/svg",
14
+ width: "16",
15
+ height: "16",
16
+ viewBox: "0 0 16 16",
17
+ "data-test": dataTest,
18
+ fill: disabled ? theme.disabled : '#404B5A',
19
+ className: "jsx-".concat(centerButtonStyles.__hash)
20
+ }, /*#__PURE__*/React.createElement("g", {
21
+ fillRule: "evenodd",
22
+ className: "jsx-".concat(centerButtonStyles.__hash)
23
+ }, /*#__PURE__*/React.createElement("polygon", {
24
+ fillRule: "nonzero",
25
+ 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",
26
+ className: "jsx-".concat(centerButtonStyles.__hash)
27
+ }), /*#__PURE__*/React.createElement("polygon", {
28
+ fillRule: "nonzero",
29
+ 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",
30
+ className: "jsx-".concat(centerButtonStyles.__hash)
31
+ })), /*#__PURE__*/React.createElement(_JSXStyle, {
32
+ id: centerButtonStyles.__hash
33
+ }, centerButtonStyles));
34
+ };
32
35
  IconAddAll.propTypes = {
33
36
  dataTest: PropTypes.string.isRequired,
34
37
  disabled: PropTypes.bool
35
38
  };
36
- export const IconAddIndividual = ({
37
- dataTest,
38
- disabled
39
- }) => /*#__PURE__*/React.createElement("svg", {
40
- fill: disabled ? theme.disabled : '#404B5A',
41
- xmlns: "http://www.w3.org/2000/svg",
42
- width: "16",
43
- height: "16",
44
- viewBox: "0 0 16 16",
45
- "data-test": dataTest,
46
- className: `jsx-${centerButtonStyles.__hash}`
47
- }, /*#__PURE__*/React.createElement("polygon", {
48
- 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",
49
- className: `jsx-${centerButtonStyles.__hash}`
50
- }), /*#__PURE__*/React.createElement(_JSXStyle, {
51
- id: centerButtonStyles.__hash
52
- }, centerButtonStyles));
39
+ export const IconAddIndividual = _ref2 => {
40
+ let {
41
+ dataTest,
42
+ disabled
43
+ } = _ref2;
44
+ return /*#__PURE__*/React.createElement("svg", {
45
+ fill: disabled ? theme.disabled : '#404B5A',
46
+ xmlns: "http://www.w3.org/2000/svg",
47
+ width: "16",
48
+ height: "16",
49
+ viewBox: "0 0 16 16",
50
+ "data-test": dataTest,
51
+ className: "jsx-".concat(centerButtonStyles.__hash)
52
+ }, /*#__PURE__*/React.createElement("polygon", {
53
+ 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",
54
+ className: "jsx-".concat(centerButtonStyles.__hash)
55
+ }), /*#__PURE__*/React.createElement(_JSXStyle, {
56
+ id: centerButtonStyles.__hash
57
+ }, centerButtonStyles));
58
+ };
53
59
  IconAddIndividual.propTypes = {
54
60
  dataTest: PropTypes.string.isRequired,
55
61
  disabled: PropTypes.bool
56
62
  };
57
- export const IconRemoveAll = ({
58
- dataTest,
59
- disabled
60
- }) => /*#__PURE__*/React.createElement("svg", {
61
- fill: disabled ? theme.disabled : '#404B5A',
62
- width: "16px",
63
- height: "16px",
64
- viewBox: "0 0 16 16",
65
- "data-test": dataTest,
66
- xmlns: "http://www.w3.org/2000/svg",
67
- className: `jsx-${centerButtonStyles.__hash}`
68
- }, /*#__PURE__*/React.createElement("g", {
69
- fillRule: "evenodd",
70
- className: `jsx-${centerButtonStyles.__hash}`
71
- }, /*#__PURE__*/React.createElement("polygon", {
72
- fillRule: "nonzero",
73
- 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",
74
- transform: "matrix(-1 0 0 1 20 0)",
75
- className: `jsx-${centerButtonStyles.__hash}`
76
- }), /*#__PURE__*/React.createElement("polygon", {
77
- fillRule: "nonzero",
78
- 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",
79
- transform: "matrix(-1 0 0 1 7.06 0)",
80
- className: `jsx-${centerButtonStyles.__hash}`
81
- })), /*#__PURE__*/React.createElement(_JSXStyle, {
82
- id: centerButtonStyles.__hash
83
- }, centerButtonStyles));
63
+ export const IconRemoveAll = _ref3 => {
64
+ let {
65
+ dataTest,
66
+ disabled
67
+ } = _ref3;
68
+ return /*#__PURE__*/React.createElement("svg", {
69
+ fill: disabled ? theme.disabled : '#404B5A',
70
+ width: "16px",
71
+ height: "16px",
72
+ viewBox: "0 0 16 16",
73
+ "data-test": dataTest,
74
+ xmlns: "http://www.w3.org/2000/svg",
75
+ className: "jsx-".concat(centerButtonStyles.__hash)
76
+ }, /*#__PURE__*/React.createElement("g", {
77
+ fillRule: "evenodd",
78
+ className: "jsx-".concat(centerButtonStyles.__hash)
79
+ }, /*#__PURE__*/React.createElement("polygon", {
80
+ fillRule: "nonzero",
81
+ 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",
82
+ transform: "matrix(-1 0 0 1 20 0)",
83
+ className: "jsx-".concat(centerButtonStyles.__hash)
84
+ }), /*#__PURE__*/React.createElement("polygon", {
85
+ fillRule: "nonzero",
86
+ 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",
87
+ transform: "matrix(-1 0 0 1 7.06 0)",
88
+ className: "jsx-".concat(centerButtonStyles.__hash)
89
+ })), /*#__PURE__*/React.createElement(_JSXStyle, {
90
+ id: centerButtonStyles.__hash
91
+ }, centerButtonStyles));
92
+ };
84
93
  IconRemoveAll.propTypes = {
85
94
  dataTest: PropTypes.string.isRequired,
86
95
  disabled: PropTypes.bool
87
96
  };
88
- export const IconRemoveIndividual = ({
89
- dataTest,
90
- disabled
91
- }) => /*#__PURE__*/React.createElement("svg", {
92
- fill: disabled ? theme.disabled : '#404B5A',
93
- xmlns: "http://www.w3.org/2000/svg",
94
- width: "16",
95
- height: "16",
96
- viewBox: "0 0 16 16",
97
- "data-test": dataTest,
98
- className: `jsx-${centerButtonStyles.__hash}`
99
- }, /*#__PURE__*/React.createElement("polygon", {
100
- 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",
101
- transform: "matrix(-1 0 0 1 16 0)",
102
- className: `jsx-${centerButtonStyles.__hash}`
103
- }), /*#__PURE__*/React.createElement(_JSXStyle, {
104
- id: centerButtonStyles.__hash
105
- }, centerButtonStyles));
97
+ export const IconRemoveIndividual = _ref4 => {
98
+ let {
99
+ dataTest,
100
+ disabled
101
+ } = _ref4;
102
+ return /*#__PURE__*/React.createElement("svg", {
103
+ fill: disabled ? theme.disabled : '#404B5A',
104
+ xmlns: "http://www.w3.org/2000/svg",
105
+ width: "16",
106
+ height: "16",
107
+ viewBox: "0 0 16 16",
108
+ "data-test": dataTest,
109
+ className: "jsx-".concat(centerButtonStyles.__hash)
110
+ }, /*#__PURE__*/React.createElement("polygon", {
111
+ 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",
112
+ transform: "matrix(-1 0 0 1 16 0)",
113
+ className: "jsx-".concat(centerButtonStyles.__hash)
114
+ }), /*#__PURE__*/React.createElement(_JSXStyle, {
115
+ id: centerButtonStyles.__hash
116
+ }, centerButtonStyles));
117
+ };
106
118
  IconRemoveIndividual.propTypes = {
107
119
  dataTest: PropTypes.string.isRequired,
108
120
  disabled: PropTypes.bool
109
121
  };
110
- export const IconMoveDown = ({
111
- dataTest,
112
- disabled
113
- }) => /*#__PURE__*/React.createElement("svg", {
114
- fill: disabled ? theme.disabled : '#404B5A',
115
- xmlns: "http://www.w3.org/2000/svg",
116
- width: "16",
117
- height: "16",
118
- viewBox: "0 0 16 16",
119
- "data-test": dataTest
120
- }, /*#__PURE__*/React.createElement("polygon", {
121
- 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",
122
- transform: "matrix(0 1 1 0 0 0)"
123
- }));
122
+ export const IconMoveDown = _ref5 => {
123
+ let {
124
+ dataTest,
125
+ disabled
126
+ } = _ref5;
127
+ return /*#__PURE__*/React.createElement("svg", {
128
+ fill: disabled ? theme.disabled : '#404B5A',
129
+ xmlns: "http://www.w3.org/2000/svg",
130
+ width: "16",
131
+ height: "16",
132
+ viewBox: "0 0 16 16",
133
+ "data-test": dataTest
134
+ }, /*#__PURE__*/React.createElement("polygon", {
135
+ 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",
136
+ transform: "matrix(0 1 1 0 0 0)"
137
+ }));
138
+ };
124
139
  IconMoveDown.propTypes = {
125
140
  dataTest: PropTypes.string.isRequired,
126
141
  disabled: PropTypes.bool
127
142
  };
128
- export const IconMoveUp = ({
129
- dataTest,
130
- disabled
131
- }) => /*#__PURE__*/React.createElement("svg", {
132
- fill: disabled ? theme.disabled : '#404B5A',
133
- xmlns: "http://www.w3.org/2000/svg",
134
- width: "16",
135
- height: "16",
136
- viewBox: "0 0 16 16",
137
- "data-test": dataTest
138
- }, /*#__PURE__*/React.createElement("polygon", {
139
- 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",
140
- transform: "rotate(-90 8 8)"
141
- }));
143
+ export const IconMoveUp = _ref6 => {
144
+ let {
145
+ dataTest,
146
+ disabled
147
+ } = _ref6;
148
+ return /*#__PURE__*/React.createElement("svg", {
149
+ fill: disabled ? theme.disabled : '#404B5A',
150
+ xmlns: "http://www.w3.org/2000/svg",
151
+ width: "16",
152
+ height: "16",
153
+ viewBox: "0 0 16 16",
154
+ "data-test": dataTest
155
+ }, /*#__PURE__*/React.createElement("polygon", {
156
+ 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",
157
+ transform: "rotate(-90 8 8)"
158
+ }));
159
+ };
142
160
  IconMoveUp.propTypes = {
143
161
  dataTest: PropTypes.string.isRequired,
144
162
  disabled: PropTypes.bool
@@ -3,16 +3,19 @@ import { spacers } from '@dhis2/ui-constants';
3
3
  import PropTypes from 'prop-types';
4
4
  import React from 'react';
5
5
  import { borderColor } from './common/index.js';
6
- export const LeftFooter = ({
7
- children,
8
- dataTest
9
- }) => /*#__PURE__*/React.createElement("div", {
10
- "data-test": dataTest,
11
- className: _JSXStyle.dynamic([["3629116366", [borderColor, spacers.dp8]]])
12
- }, children, /*#__PURE__*/React.createElement(_JSXStyle, {
13
- id: "3629116366",
14
- dynamic: [borderColor, spacers.dp8]
15
- }, [`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 ${spacers.dp8};}`]));
6
+ export const LeftFooter = _ref => {
7
+ let {
8
+ children,
9
+ dataTest
10
+ } = _ref;
11
+ return /*#__PURE__*/React.createElement("div", {
12
+ "data-test": dataTest,
13
+ className: _JSXStyle.dynamic([["3629116366", [borderColor, spacers.dp8]]])
14
+ }, children, /*#__PURE__*/React.createElement(_JSXStyle, {
15
+ id: "3629116366",
16
+ dynamic: [borderColor, spacers.dp8]
17
+ }, ["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(spacers.dp8, ";}")]));
18
+ };
16
19
  LeftFooter.propTypes = {
17
20
  children: PropTypes.node,
18
21
  dataTest: PropTypes.string