@dhis2-ui/transfer 8.1.11 → 8.2.2
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.
- package/build/cjs/__e2e__/add_remove-highlighted-options.stories.e2e.js +30 -21
- package/build/cjs/__e2e__/common/stateful-decorator.js +26 -19
- package/build/cjs/__e2e__/disabled-transfer-buttons.stories.e2e.js +70 -49
- package/build/cjs/__e2e__/disabled-transfer-options.stories.e2e.js +14 -11
- package/build/cjs/__e2e__/display-order.stories.e2e.js +29 -20
- package/build/cjs/__e2e__/filter-options-list.stories.e2e.js +97 -73
- package/build/cjs/__e2e__/highlight-range-of-options.stories.e2e.js +49 -34
- package/build/cjs/__e2e__/loading_lists.stories.e2e.js +1 -1
- package/build/cjs/__e2e__/notify_at_end_of_list.stories.e2e.js +61 -43
- package/build/cjs/__e2e__/reorder-with-buttons.stories.e2e.js +19 -13
- package/build/cjs/__e2e__/set_unset-highlighted-option.stories.e2e.js +30 -21
- package/build/cjs/__e2e__/transferring-items.stories.e2e.js +29 -20
- package/build/cjs/__tests__/helper/use-highlighted-option/toggle-add.test.js +6 -3
- package/build/cjs/__tests__/helper/use-highlighted-option/toggle-range.test.js +48 -24
- package/build/cjs/__tests__/transfer.test.js +18 -10
- package/build/cjs/actions.js +13 -10
- package/build/cjs/add-all.js +17 -14
- package/build/cjs/add-individual.js +16 -13
- package/build/cjs/common/get-mode-by-modifier-key.js +7 -6
- package/build/cjs/common/modes.js +1 -1
- package/build/cjs/container.js +15 -12
- package/build/cjs/end-intersection-detector.js +21 -15
- package/build/cjs/features/disabled-transfer-options/index.js +4 -2
- package/build/cjs/features/display-order/index.js +47 -26
- package/build/cjs/features/filter-options-list/index.js +6 -3
- package/build/cjs/features/highlight-range-of-options/index.js +10 -5
- package/build/cjs/features/loading_lists/index.js +2 -2
- package/build/cjs/features/notify_at_end_of_list/index.js +5 -3
- package/build/cjs/features/set_unset-highlighted-option/index.js +6 -3
- package/build/cjs/features/transferring-items/index.js +77 -42
- package/build/cjs/filter.js +26 -23
- package/build/cjs/icons.js +134 -116
- package/build/cjs/left-footer.js +13 -10
- package/build/cjs/left-header.js +13 -10
- package/build/cjs/left-side.js +19 -16
- package/build/cjs/options-container.js +17 -16
- package/build/cjs/picked-options.js +22 -19
- package/build/cjs/remove-all.js +16 -13
- package/build/cjs/remove-individual.js +16 -13
- package/build/cjs/reordering-actions.js +34 -31
- package/build/cjs/right-footer.js +13 -10
- package/build/cjs/right-header.js +13 -10
- package/build/cjs/right-side.js +19 -16
- package/build/cjs/source-options.js +22 -19
- package/build/cjs/transfer/add-all-selectable-source-options.js +13 -9
- package/build/cjs/transfer/add-individual-source-options.js +11 -9
- package/build/cjs/transfer/create-double-click-handlers.js +17 -13
- package/build/cjs/transfer/default-filter-callback.js +6 -3
- package/build/cjs/transfer/is-reorder-down-disabled.js +10 -6
- package/build/cjs/transfer/is-reorder-up-disabled.js +10 -6
- package/build/cjs/transfer/move-highlighted-picked-option-down.js +6 -5
- package/build/cjs/transfer/move-highlighted-picked-option-up.js +6 -5
- package/build/cjs/transfer/remove-all-picked-options.js +5 -4
- package/build/cjs/transfer/remove-individual-picked-options.js +10 -8
- package/build/cjs/transfer/use-filter.js +8 -7
- package/build/cjs/transfer/use-highlighted-options/create-toggle-highlighted-option.js +45 -40
- package/build/cjs/transfer/use-highlighted-options/toggle-add.js +7 -6
- package/build/cjs/transfer/use-highlighted-options/toggle-range.js +16 -11
- package/build/cjs/transfer/use-highlighted-options/toggle-replace.js +7 -5
- package/build/cjs/transfer/use-highlighted-options.js +7 -5
- package/build/cjs/transfer-option.js +12 -11
- package/build/cjs/transfer.js +86 -72
- package/build/cjs/transfer.stories.js +127 -131
- package/build/es/__e2e__/add_remove-highlighted-options.stories.e2e.js +29 -20
- package/build/es/__e2e__/common/stateful-decorator.js +26 -19
- package/build/es/__e2e__/disabled-transfer-buttons.stories.e2e.js +69 -48
- package/build/es/__e2e__/disabled-transfer-options.stories.e2e.js +13 -10
- package/build/es/__e2e__/display-order.stories.e2e.js +28 -19
- package/build/es/__e2e__/filter-options-list.stories.e2e.js +96 -72
- package/build/es/__e2e__/highlight-range-of-options.stories.e2e.js +48 -33
- package/build/es/__e2e__/notify_at_end_of_list.stories.e2e.js +60 -42
- package/build/es/__e2e__/reorder-with-buttons.stories.e2e.js +18 -12
- package/build/es/__e2e__/set_unset-highlighted-option.stories.e2e.js +29 -20
- package/build/es/__e2e__/transferring-items.stories.e2e.js +28 -19
- package/build/es/__tests__/helper/use-highlighted-option/toggle-add.test.js +6 -3
- package/build/es/__tests__/helper/use-highlighted-option/toggle-range.test.js +48 -24
- package/build/es/__tests__/transfer.test.js +18 -10
- package/build/es/actions.js +13 -10
- package/build/es/add-all.js +17 -14
- package/build/es/add-individual.js +16 -13
- package/build/es/common/get-mode-by-modifier-key.js +7 -6
- package/build/es/container.js +15 -12
- package/build/es/end-intersection-detector.js +21 -15
- package/build/es/features/disabled-transfer-options/index.js +4 -2
- package/build/es/features/display-order/index.js +47 -26
- package/build/es/features/filter-options-list/index.js +6 -3
- package/build/es/features/highlight-range-of-options/index.js +10 -5
- package/build/es/features/loading_lists/index.js +2 -2
- package/build/es/features/notify_at_end_of_list/index.js +5 -3
- package/build/es/features/set_unset-highlighted-option/index.js +6 -3
- package/build/es/features/transferring-items/index.js +77 -42
- package/build/es/filter.js +26 -23
- package/build/es/icons.js +133 -115
- package/build/es/left-footer.js +13 -10
- package/build/es/left-header.js +13 -10
- package/build/es/left-side.js +19 -16
- package/build/es/options-container.js +17 -16
- package/build/es/picked-options.js +22 -19
- package/build/es/remove-all.js +16 -13
- package/build/es/remove-individual.js +16 -13
- package/build/es/reordering-actions.js +34 -31
- package/build/es/right-footer.js +13 -10
- package/build/es/right-header.js +13 -10
- package/build/es/right-side.js +19 -16
- package/build/es/source-options.js +22 -19
- package/build/es/transfer/add-all-selectable-source-options.js +13 -9
- package/build/es/transfer/add-individual-source-options.js +11 -9
- package/build/es/transfer/create-double-click-handlers.js +17 -13
- package/build/es/transfer/default-filter-callback.js +6 -3
- package/build/es/transfer/is-reorder-down-disabled.js +10 -6
- package/build/es/transfer/is-reorder-up-disabled.js +10 -6
- package/build/es/transfer/move-highlighted-picked-option-down.js +6 -5
- package/build/es/transfer/move-highlighted-picked-option-up.js +6 -5
- package/build/es/transfer/remove-all-picked-options.js +5 -4
- package/build/es/transfer/remove-individual-picked-options.js +10 -8
- package/build/es/transfer/use-filter.js +8 -7
- package/build/es/transfer/use-highlighted-options/create-toggle-highlighted-option.js +45 -40
- package/build/es/transfer/use-highlighted-options/toggle-add.js +7 -6
- package/build/es/transfer/use-highlighted-options/toggle-range.js +16 -11
- package/build/es/transfer/use-highlighted-options/toggle-replace.js +7 -5
- package/build/es/transfer/use-highlighted-options.js +7 -5
- package/build/es/transfer-option.js +12 -11
- package/build/es/transfer.js +86 -72
- package/build/es/transfer.stories.js +126 -130
- package/package.json +7 -7
|
@@ -6,26 +6,35 @@ export default {
|
|
|
6
6
|
title: 'Transfer Display Order'
|
|
7
7
|
};
|
|
8
8
|
window.options = options;
|
|
9
|
-
export const NoSelection = (_, {
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
}
|
|
9
|
+
export const NoSelection = (_, _ref) => {
|
|
10
|
+
let {
|
|
11
|
+
selected,
|
|
12
|
+
onChange
|
|
13
|
+
} = _ref;
|
|
14
|
+
return /*#__PURE__*/React.createElement(Transfer, {
|
|
15
|
+
selected: selected,
|
|
16
|
+
onChange: onChange,
|
|
17
|
+
options: options
|
|
18
|
+
});
|
|
19
|
+
};
|
|
20
|
+
export const SomeSelected = (_, _ref2) => {
|
|
21
|
+
let {
|
|
22
|
+
selected,
|
|
23
|
+
onChange
|
|
24
|
+
} = _ref2;
|
|
25
|
+
return /*#__PURE__*/React.createElement(Transfer, {
|
|
26
|
+
selected: selected,
|
|
27
|
+
onChange: onChange,
|
|
28
|
+
options: options
|
|
29
|
+
});
|
|
30
|
+
};
|
|
25
31
|
SomeSelected.story = {
|
|
26
32
|
decorators: [statefulDecorator({
|
|
27
|
-
initialState: options.slice(0, 4).map(
|
|
28
|
-
|
|
29
|
-
|
|
33
|
+
initialState: options.slice(0, 4).map(_ref3 => {
|
|
34
|
+
let {
|
|
35
|
+
value
|
|
36
|
+
} = _ref3;
|
|
37
|
+
return value;
|
|
38
|
+
})
|
|
30
39
|
})]
|
|
31
40
|
};
|
|
@@ -6,83 +6,107 @@ export default {
|
|
|
6
6
|
title: 'Transfer filtering',
|
|
7
7
|
decorators: [statefulDecorator()]
|
|
8
8
|
};
|
|
9
|
-
export const EmptyResult = (_, {
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
})
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
}
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
}
|
|
9
|
+
export const EmptyResult = (_, _ref) => {
|
|
10
|
+
let {
|
|
11
|
+
selected,
|
|
12
|
+
onChange
|
|
13
|
+
} = _ref;
|
|
14
|
+
return /*#__PURE__*/React.createElement(Transfer, {
|
|
15
|
+
filterable: true,
|
|
16
|
+
initialSearchTerm: "Foobarbaz",
|
|
17
|
+
selected: selected,
|
|
18
|
+
onChange: onChange,
|
|
19
|
+
sourceEmptyPlaceholder: /*#__PURE__*/React.createElement("span", {
|
|
20
|
+
"data-test": "no-results"
|
|
21
|
+
}, "No results"),
|
|
22
|
+
options: options
|
|
23
|
+
});
|
|
24
|
+
};
|
|
25
|
+
export const SomeResults = (_, _ref2) => {
|
|
26
|
+
let {
|
|
27
|
+
selected,
|
|
28
|
+
onChange
|
|
29
|
+
} = _ref2;
|
|
30
|
+
return /*#__PURE__*/React.createElement(Transfer, {
|
|
31
|
+
selected: selected,
|
|
32
|
+
filterable: true,
|
|
33
|
+
initialSearchTerm: "ANC",
|
|
34
|
+
onChange: onChange,
|
|
35
|
+
options: options
|
|
36
|
+
});
|
|
37
|
+
};
|
|
38
|
+
export const UppercaseSearch = (_, _ref3) => {
|
|
39
|
+
let {
|
|
40
|
+
selected,
|
|
41
|
+
onChange
|
|
42
|
+
} = _ref3;
|
|
43
|
+
return /*#__PURE__*/React.createElement(Transfer, {
|
|
44
|
+
selected: selected,
|
|
45
|
+
filterable: true,
|
|
46
|
+
initialSearchTerm: "ANC",
|
|
47
|
+
onChange: onChange,
|
|
48
|
+
options: options
|
|
49
|
+
});
|
|
50
|
+
};
|
|
51
|
+
export const LowercaseSearch = (_, _ref4) => {
|
|
52
|
+
let {
|
|
53
|
+
selected,
|
|
54
|
+
onChange
|
|
55
|
+
} = _ref4;
|
|
56
|
+
return /*#__PURE__*/React.createElement(Transfer, {
|
|
57
|
+
filterable: true,
|
|
58
|
+
initialSearchTerm: "anc",
|
|
59
|
+
selected: selected,
|
|
60
|
+
onChange: onChange,
|
|
61
|
+
options: options
|
|
62
|
+
});
|
|
63
|
+
};
|
|
64
|
+
export const AncCustomFilter = (_, _ref5) => {
|
|
65
|
+
let {
|
|
66
|
+
selected,
|
|
67
|
+
onChange
|
|
68
|
+
} = _ref5;
|
|
69
|
+
return /*#__PURE__*/React.createElement(Transfer, {
|
|
70
|
+
filterable: true,
|
|
71
|
+
selected: selected,
|
|
72
|
+
onChange: onChange,
|
|
73
|
+
filterCallback: (options, filter) => options.filter(_ref6 => {
|
|
74
|
+
let {
|
|
75
|
+
label
|
|
76
|
+
} = _ref6;
|
|
77
|
+
return label.match("(^| )ANC .*".concat(filter));
|
|
78
|
+
}),
|
|
79
|
+
options: options
|
|
80
|
+
});
|
|
81
|
+
};
|
|
64
82
|
|
|
65
83
|
window.customFilterCallback = (options, filter) => {
|
|
66
|
-
return options.filter(
|
|
67
|
-
|
|
68
|
-
|
|
84
|
+
return options.filter(_ref7 => {
|
|
85
|
+
let {
|
|
86
|
+
label
|
|
87
|
+
} = _ref7;
|
|
88
|
+
return label.indexOf(filter) !== -1;
|
|
89
|
+
});
|
|
69
90
|
};
|
|
70
91
|
|
|
71
92
|
window.Cypress && window.Cypress.cy.spy(window, 'customFilterCallback');
|
|
72
|
-
export const ControlledFilter = (_, {
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
93
|
+
export const ControlledFilter = (_, _ref8) => {
|
|
94
|
+
let {
|
|
95
|
+
filter,
|
|
96
|
+
onChange,
|
|
97
|
+
onFilterChange,
|
|
98
|
+
selected
|
|
99
|
+
} = _ref8;
|
|
100
|
+
return /*#__PURE__*/React.createElement(Transfer, {
|
|
101
|
+
selected: selected,
|
|
102
|
+
onChange: onChange,
|
|
103
|
+
filterable: true,
|
|
104
|
+
filterCallback: window.customFilterCallback,
|
|
105
|
+
searchTerm: filter,
|
|
106
|
+
onFilterChange: onFilterChange,
|
|
107
|
+
options: options
|
|
108
|
+
});
|
|
109
|
+
};
|
|
86
110
|
ControlledFilter.story = {
|
|
87
111
|
decorators: [statefulDecorator()]
|
|
88
112
|
};
|
|
@@ -6,44 +6,59 @@ export default {
|
|
|
6
6
|
title: 'Transfer highlight range of options',
|
|
7
7
|
decorators: [statefulDecorator()]
|
|
8
8
|
};
|
|
9
|
-
export const HasOptions = (_, {
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
9
|
+
export const HasOptions = (_, _ref) => {
|
|
10
|
+
let {
|
|
11
|
+
onChange,
|
|
12
|
+
selected
|
|
13
|
+
} = _ref;
|
|
14
|
+
return /*#__PURE__*/React.createElement(Transfer, {
|
|
15
|
+
filterable: true,
|
|
16
|
+
selected: selected,
|
|
17
|
+
onChange: onChange,
|
|
18
|
+
options: options
|
|
19
|
+
});
|
|
20
|
+
};
|
|
21
|
+
export const HasSelected = (_, _ref2) => {
|
|
22
|
+
let {
|
|
23
|
+
onChange,
|
|
24
|
+
selected
|
|
25
|
+
} = _ref2;
|
|
26
|
+
return /*#__PURE__*/React.createElement(Transfer, {
|
|
27
|
+
filterable: true,
|
|
28
|
+
onChange: onChange,
|
|
29
|
+
selected: selected,
|
|
30
|
+
options: options
|
|
31
|
+
});
|
|
32
|
+
};
|
|
27
33
|
HasSelected.story = {
|
|
28
34
|
decorators: [statefulDecorator({
|
|
29
|
-
initialState: options.slice(0, 4).map(
|
|
30
|
-
|
|
31
|
-
|
|
35
|
+
initialState: options.slice(0, 4).map(_ref3 => {
|
|
36
|
+
let {
|
|
37
|
+
value
|
|
38
|
+
} = _ref3;
|
|
39
|
+
return value;
|
|
40
|
+
})
|
|
32
41
|
})]
|
|
33
42
|
};
|
|
34
|
-
export const AllSelected = (_, {
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
+
export const AllSelected = (_, _ref4) => {
|
|
44
|
+
let {
|
|
45
|
+
onChange,
|
|
46
|
+
selected
|
|
47
|
+
} = _ref4;
|
|
48
|
+
return /*#__PURE__*/React.createElement(Transfer, {
|
|
49
|
+
filterable: true,
|
|
50
|
+
onChange: onChange,
|
|
51
|
+
selected: selected,
|
|
52
|
+
options: options
|
|
53
|
+
});
|
|
54
|
+
};
|
|
43
55
|
AllSelected.story = {
|
|
44
56
|
decorators: [statefulDecorator({
|
|
45
|
-
initialState: options.map(
|
|
46
|
-
|
|
47
|
-
|
|
57
|
+
initialState: options.map(_ref5 => {
|
|
58
|
+
let {
|
|
59
|
+
value
|
|
60
|
+
} = _ref5;
|
|
61
|
+
return value;
|
|
62
|
+
})
|
|
48
63
|
})]
|
|
49
64
|
};
|
|
@@ -8,53 +8,71 @@ export default {
|
|
|
8
8
|
};
|
|
9
9
|
window.onEndReached = window.Cypress ? window.Cypress.cy.stub() : () => console.log('onEndReached');
|
|
10
10
|
window.onEndReachedPicked = window.Cypress ? window.Cypress.cy.stub() : () => console.log('onEndReachedPicked');
|
|
11
|
-
export const FullSourceList = (_, {
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
11
|
+
export const FullSourceList = (_, _ref) => {
|
|
12
|
+
let {
|
|
13
|
+
selected,
|
|
14
|
+
onChange
|
|
15
|
+
} = _ref;
|
|
16
|
+
return /*#__PURE__*/React.createElement(Transfer, {
|
|
17
|
+
options: options,
|
|
18
|
+
selected: selected,
|
|
19
|
+
onChange: onChange,
|
|
20
|
+
onEndReached: window.onEndReached
|
|
21
|
+
});
|
|
22
|
+
};
|
|
23
|
+
export const FullPickedList = (_, _ref2) => {
|
|
24
|
+
let {
|
|
25
|
+
selected,
|
|
26
|
+
onChange
|
|
27
|
+
} = _ref2;
|
|
28
|
+
return /*#__PURE__*/React.createElement(Transfer, {
|
|
29
|
+
options: options,
|
|
30
|
+
selected: selected,
|
|
31
|
+
onChange: onChange,
|
|
32
|
+
onEndReachedPicked: window.onEndReachedPicked
|
|
33
|
+
});
|
|
34
|
+
};
|
|
29
35
|
FullPickedList.story = {
|
|
30
36
|
decorators: [statefulDecorator({
|
|
31
|
-
initialState: options.map(
|
|
32
|
-
|
|
33
|
-
|
|
37
|
+
initialState: options.map(_ref3 => {
|
|
38
|
+
let {
|
|
39
|
+
value
|
|
40
|
+
} = _ref3;
|
|
41
|
+
return value;
|
|
42
|
+
})
|
|
34
43
|
})]
|
|
35
44
|
};
|
|
36
|
-
export const PartialSourceList = (_, {
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
45
|
+
export const PartialSourceList = (_, _ref4) => {
|
|
46
|
+
let {
|
|
47
|
+
selected,
|
|
48
|
+
onChange
|
|
49
|
+
} = _ref4;
|
|
50
|
+
return /*#__PURE__*/React.createElement(Transfer, {
|
|
51
|
+
options: options.slice(0, 4),
|
|
52
|
+
selected: selected,
|
|
53
|
+
onChange: onChange,
|
|
54
|
+
onEndReached: window.onEndReached
|
|
55
|
+
});
|
|
56
|
+
};
|
|
57
|
+
export const PartialPickedList = (_, _ref5) => {
|
|
58
|
+
let {
|
|
59
|
+
selected,
|
|
60
|
+
onChange
|
|
61
|
+
} = _ref5;
|
|
62
|
+
return /*#__PURE__*/React.createElement(Transfer, {
|
|
63
|
+
options: options,
|
|
64
|
+
selected: selected,
|
|
65
|
+
onChange: onChange,
|
|
66
|
+
onEndReachedPicked: window.onEndReachedPicked
|
|
67
|
+
});
|
|
68
|
+
};
|
|
54
69
|
PartialPickedList.story = {
|
|
55
70
|
decorators: [statefulDecorator({
|
|
56
|
-
initialState: options.slice(0, 4).map(
|
|
57
|
-
|
|
58
|
-
|
|
71
|
+
initialState: options.slice(0, 4).map(_ref6 => {
|
|
72
|
+
let {
|
|
73
|
+
value
|
|
74
|
+
} = _ref6;
|
|
75
|
+
return value;
|
|
76
|
+
})
|
|
59
77
|
})]
|
|
60
78
|
};
|
|
@@ -5,19 +5,25 @@ import { statefulDecorator } from './common/stateful-decorator.js';
|
|
|
5
5
|
export default {
|
|
6
6
|
title: 'Transfer Reorder Buttons'
|
|
7
7
|
};
|
|
8
|
-
export const HasSomeSelected = (_, {
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
8
|
+
export const HasSomeSelected = (_, _ref) => {
|
|
9
|
+
let {
|
|
10
|
+
selected,
|
|
11
|
+
onChange
|
|
12
|
+
} = _ref;
|
|
13
|
+
return /*#__PURE__*/React.createElement(Transfer, {
|
|
14
|
+
enableOrderChange: true,
|
|
15
|
+
selected: selected,
|
|
16
|
+
onChange: onChange,
|
|
17
|
+
options: options
|
|
18
|
+
});
|
|
19
|
+
};
|
|
17
20
|
HasSomeSelected.story = {
|
|
18
21
|
decorators: [statefulDecorator({
|
|
19
|
-
initialState: options.slice(0, 3).map(
|
|
20
|
-
|
|
21
|
-
|
|
22
|
+
initialState: options.slice(0, 3).map(_ref2 => {
|
|
23
|
+
let {
|
|
24
|
+
value
|
|
25
|
+
} = _ref2;
|
|
26
|
+
return value;
|
|
27
|
+
})
|
|
22
28
|
})]
|
|
23
29
|
};
|
|
@@ -6,27 +6,36 @@ export default {
|
|
|
6
6
|
title: 'Transfer set & unset higlighted options',
|
|
7
7
|
decorators: [statefulDecorator()]
|
|
8
8
|
};
|
|
9
|
-
export const HasOptions = (_, {
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
}
|
|
9
|
+
export const HasOptions = (_, _ref) => {
|
|
10
|
+
let {
|
|
11
|
+
onChange,
|
|
12
|
+
selected
|
|
13
|
+
} = _ref;
|
|
14
|
+
return /*#__PURE__*/React.createElement(Transfer, {
|
|
15
|
+
filterable: true,
|
|
16
|
+
selected: selected,
|
|
17
|
+
onChange: onChange,
|
|
18
|
+
options: options
|
|
19
|
+
});
|
|
20
|
+
};
|
|
21
|
+
export const HasSelected = (_, _ref2) => {
|
|
22
|
+
let {
|
|
23
|
+
onChange,
|
|
24
|
+
selected
|
|
25
|
+
} = _ref2;
|
|
26
|
+
return /*#__PURE__*/React.createElement(Transfer, {
|
|
27
|
+
onChange: onChange,
|
|
28
|
+
selected: selected,
|
|
29
|
+
options: options
|
|
30
|
+
});
|
|
31
|
+
};
|
|
26
32
|
HasSelected.story = {
|
|
27
33
|
decorators: [statefulDecorator({
|
|
28
|
-
initialState: options.slice(0, 4).map(
|
|
29
|
-
|
|
30
|
-
|
|
34
|
+
initialState: options.slice(0, 4).map(_ref3 => {
|
|
35
|
+
let {
|
|
36
|
+
value
|
|
37
|
+
} = _ref3;
|
|
38
|
+
return value;
|
|
39
|
+
})
|
|
31
40
|
})]
|
|
32
41
|
};
|
|
@@ -7,26 +7,35 @@ export default {
|
|
|
7
7
|
decorators: [statefulDecorator()]
|
|
8
8
|
};
|
|
9
9
|
window.options = options;
|
|
10
|
-
export const HasOptions = (_, {
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
}
|
|
10
|
+
export const HasOptions = (_, _ref) => {
|
|
11
|
+
let {
|
|
12
|
+
selected,
|
|
13
|
+
onChange
|
|
14
|
+
} = _ref;
|
|
15
|
+
return /*#__PURE__*/React.createElement(Transfer, {
|
|
16
|
+
selected: selected,
|
|
17
|
+
onChange: onChange,
|
|
18
|
+
options: options
|
|
19
|
+
});
|
|
20
|
+
};
|
|
21
|
+
export const SomeSelected = (_, _ref2) => {
|
|
22
|
+
let {
|
|
23
|
+
selected,
|
|
24
|
+
onChange
|
|
25
|
+
} = _ref2;
|
|
26
|
+
return /*#__PURE__*/React.createElement(Transfer, {
|
|
27
|
+
selected: selected,
|
|
28
|
+
onChange: onChange,
|
|
29
|
+
options: options
|
|
30
|
+
});
|
|
31
|
+
};
|
|
26
32
|
SomeSelected.story = {
|
|
27
33
|
decorators: [statefulDecorator({
|
|
28
|
-
initialState: options.slice(0, 4).map(
|
|
29
|
-
|
|
30
|
-
|
|
34
|
+
initialState: options.slice(0, 4).map(_ref3 => {
|
|
35
|
+
let {
|
|
36
|
+
value
|
|
37
|
+
} = _ref3;
|
|
38
|
+
return value;
|
|
39
|
+
})
|
|
31
40
|
})]
|
|
32
41
|
};
|
|
@@ -68,9 +68,12 @@ describe('Transfer - useHighlightedOptions - toggleAdd', () => {
|
|
|
68
68
|
label: 'Baz'
|
|
69
69
|
};
|
|
70
70
|
const highlightedOptions = [optionOne.value, optionTwo.value, optionThree.value];
|
|
71
|
-
const expected = [optionOne, optionThree].map(
|
|
72
|
-
|
|
73
|
-
|
|
71
|
+
const expected = [optionOne, optionThree].map(_ref => {
|
|
72
|
+
let {
|
|
73
|
+
value
|
|
74
|
+
} = _ref;
|
|
75
|
+
return value;
|
|
76
|
+
});
|
|
74
77
|
const option = optionTwo;
|
|
75
78
|
toggleAdd({
|
|
76
79
|
maxSelections,
|