@dhis2-ui/transfer 9.3.0 → 9.4.0-alpha.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.
Files changed (11) hide show
  1. package/build/cjs/end-intersection-detector.js +3 -3
  2. package/build/cjs/icons.js +18 -10
  3. package/build/cjs/options-container.js +6 -6
  4. package/build/cjs/reordering-actions.js +3 -3
  5. package/build/cjs/transfer.stories.js +11 -1
  6. package/build/es/end-intersection-detector.js +3 -3
  7. package/build/es/icons.js +18 -10
  8. package/build/es/options-container.js +6 -6
  9. package/build/es/reordering-actions.js +3 -3
  10. package/build/es/transfer.stories.js +7 -0
  11. package/package.json +7 -7
package/build/cjs/end-intersection-detector.js CHANGED
@@ -23,7 +23,7 @@ const EndIntersectionDetector = _ref => {
23
23
  } = _ref;
24
24
  return /*#__PURE__*/_react.default.createElement("div", {
25
25
  "data-test": dataTest,
26
- className: "jsx-4200578429"
26
+ className: "jsx-2799340139"
27
27
  }, /*#__PURE__*/_react.default.createElement(_intersectionDetector.IntersectionDetector, {
28
28
  rootRef: rootRef,
29
29
  onChange: _ref2 => {
@@ -33,8 +33,8 @@ const EndIntersectionDetector = _ref => {
33
33
  return isIntersecting && onEndReached();
34
34
  }
35
35
  }), /*#__PURE__*/_react.default.createElement(_style.default, {
36
- id: "4200578429"
37
- }, ["div.jsx-4200578429{width:100%;height:50px;position:absolute;z-index:-1;bottom:0;left:0;}"]));
36
+ id: "2799340139"
37
+ }, ["div.jsx-2799340139{width:100%;height:50px;position:absolute;z-index:-1;bottom:0;inset-inline-start:0;}"]));
38
38
  };
39
39
 
40
40
  exports.EndIntersectionDetector = EndIntersectionDetector;
package/build/cjs/icons.js CHANGED
@@ -15,15 +15,17 @@ var _react = _interopRequireDefault(require("react"));
15
15
 
16
16
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
17
17
 
18
- const centerButtonStyles = ["svg.jsx-114231192{min-width:20px;}"];
19
- centerButtonStyles.__hash = "114231192";
18
+ const centerButtonStyles = ["svg.jsx-2392683210{min-width:20px;}", "div.centerButton.jsx-2392683210:dir(rtl){-webkit-transform:rotate(180deg) translateX(4px);-ms-transform:rotate(180deg) translateX(4px);transform:rotate(180deg) translateX(4px);}"];
19
+ centerButtonStyles.__hash = "2392683210";
20
20
 
21
21
  const IconAddAll = _ref => {
22
22
  let {
23
23
  dataTest,
24
24
  disabled
25
25
  } = _ref;
26
- return /*#__PURE__*/_react.default.createElement("svg", {
26
+ return /*#__PURE__*/_react.default.createElement("div", {
27
+ className: "jsx-".concat(centerButtonStyles.__hash) + " " + "centerButton"
28
+ }, /*#__PURE__*/_react.default.createElement("svg", {
27
29
  xmlns: "http://www.w3.org/2000/svg",
28
30
  width: "16",
29
31
  height: "16",
@@ -42,7 +44,7 @@ const IconAddAll = _ref => {
42
44
  fillRule: "nonzero",
43
45
  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",
44
46
  className: "jsx-".concat(centerButtonStyles.__hash)
45
- })), /*#__PURE__*/_react.default.createElement(_style.default, {
47
+ }))), /*#__PURE__*/_react.default.createElement(_style.default, {
46
48
  id: centerButtonStyles.__hash
47
49
  }, centerButtonStyles));
48
50
  };
@@ -58,7 +60,9 @@ const IconAddIndividual = _ref2 => {
58
60
  dataTest,
59
61
  disabled
60
62
  } = _ref2;
61
- return /*#__PURE__*/_react.default.createElement("svg", {
63
+ return /*#__PURE__*/_react.default.createElement("div", {
64
+ className: "jsx-".concat(centerButtonStyles.__hash) + " " + "centerButton"
65
+ }, /*#__PURE__*/_react.default.createElement("svg", {
62
66
  fill: disabled ? _uiConstants.theme.disabled : '#404B5A',
63
67
  xmlns: "http://www.w3.org/2000/svg",
64
68
  width: "16",
@@ -69,7 +73,7 @@ const IconAddIndividual = _ref2 => {
69
73
  }, /*#__PURE__*/_react.default.createElement("polygon", {
70
74
  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",
71
75
  className: "jsx-".concat(centerButtonStyles.__hash)
72
- }), /*#__PURE__*/_react.default.createElement(_style.default, {
76
+ })), /*#__PURE__*/_react.default.createElement(_style.default, {
73
77
  id: centerButtonStyles.__hash
74
78
  }, centerButtonStyles));
75
79
  };
@@ -85,7 +89,9 @@ const IconRemoveAll = _ref3 => {
85
89
  dataTest,
86
90
  disabled
87
91
  } = _ref3;
88
- return /*#__PURE__*/_react.default.createElement("svg", {
92
+ return /*#__PURE__*/_react.default.createElement("div", {
93
+ className: "jsx-".concat(centerButtonStyles.__hash) + " " + "centerButton"
94
+ }, /*#__PURE__*/_react.default.createElement("svg", {
89
95
  fill: disabled ? _uiConstants.theme.disabled : '#404B5A',
90
96
  width: "16px",
91
97
  height: "16px",
@@ -106,7 +112,7 @@ const IconRemoveAll = _ref3 => {
106
112
  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",
107
113
  transform: "matrix(-1 0 0 1 7.06 0)",
108
114
  className: "jsx-".concat(centerButtonStyles.__hash)
109
- })), /*#__PURE__*/_react.default.createElement(_style.default, {
115
+ }))), /*#__PURE__*/_react.default.createElement(_style.default, {
110
116
  id: centerButtonStyles.__hash
111
117
  }, centerButtonStyles));
112
118
  };
@@ -122,7 +128,9 @@ const IconRemoveIndividual = _ref4 => {
122
128
  dataTest,
123
129
  disabled
124
130
  } = _ref4;
125
- return /*#__PURE__*/_react.default.createElement("svg", {
131
+ return /*#__PURE__*/_react.default.createElement("div", {
132
+ className: "jsx-".concat(centerButtonStyles.__hash) + " " + "centerButton"
133
+ }, /*#__PURE__*/_react.default.createElement("svg", {
126
134
  fill: disabled ? _uiConstants.theme.disabled : '#404B5A',
127
135
  xmlns: "http://www.w3.org/2000/svg",
128
136
  width: "16",
@@ -134,7 +142,7 @@ const IconRemoveIndividual = _ref4 => {
134
142
  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",
135
143
  transform: "matrix(-1 0 0 1 16 0)",
136
144
  className: "jsx-".concat(centerButtonStyles.__hash)
137
- }), /*#__PURE__*/_react.default.createElement(_style.default, {
145
+ })), /*#__PURE__*/_react.default.createElement(_style.default, {
138
146
  id: centerButtonStyles.__hash
139
147
  }, centerButtonStyles));
140
148
  };
package/build/cjs/options-container.js CHANGED
@@ -43,16 +43,16 @@ const OptionsContainer = _ref => {
43
43
  const wrapperRef = (0, _react.useRef)(null);
44
44
  const resizeCounter = (0, _useResizeCounter.useResizeCounter)(wrapperRef.current);
45
45
  return /*#__PURE__*/_react.default.createElement("div", {
46
- className: _style.default.dynamic([["889751462", [_uiConstants.spacers.dp4]]]) + " " + "optionsContainer"
46
+ className: _style.default.dynamic([["3254058061", [_uiConstants.spacers.dp4]]]) + " " + "optionsContainer"
47
47
  }, loading && /*#__PURE__*/_react.default.createElement("div", {
48
- className: _style.default.dynamic([["889751462", [_uiConstants.spacers.dp4]]]) + " " + "loading"
48
+ className: _style.default.dynamic([["3254058061", [_uiConstants.spacers.dp4]]]) + " " + "loading"
49
49
  }, /*#__PURE__*/_react.default.createElement(_loader.CircularLoader, null)), /*#__PURE__*/_react.default.createElement("div", {
50
50
  "data-test": dataTest,
51
51
  ref: optionsRef,
52
- className: _style.default.dynamic([["889751462", [_uiConstants.spacers.dp4]]]) + " " + "container"
52
+ className: _style.default.dynamic([["3254058061", [_uiConstants.spacers.dp4]]]) + " " + "container"
53
53
  }, /*#__PURE__*/_react.default.createElement("div", {
54
54
  ref: wrapperRef,
55
- className: _style.default.dynamic([["889751462", [_uiConstants.spacers.dp4]]]) + " " + "content-container"
55
+ className: _style.default.dynamic([["3254058061", [_uiConstants.spacers.dp4]]]) + " " + "content-container"
56
56
  }, !options.length && emptyComponent, options.map(option => {
57
57
  const highlighted = !!highlightedOptions.find(highlightedSourceOption => highlightedSourceOption === option.value);
58
58
  return /*#__PURE__*/_react.default.createElement(_react.Fragment, {
@@ -68,9 +68,9 @@ const OptionsContainer = _ref => {
68
68
  rootRef: optionsRef,
69
69
  onEndReached: onEndReached
70
70
  }))), /*#__PURE__*/_react.default.createElement(_style.default, {
71
- id: "889751462",
71
+ id: "3254058061",
72
72
  dynamic: [_uiConstants.spacers.dp4]
73
- }, [".optionsContainer.__jsx-style-dynamic-selector{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;padding:".concat(_uiConstants.spacers.dp4, " 0;position:relative;overflow:hidden;}"), ".container.__jsx-style-dynamic-selector{overflow-y:auto;height:100%;}", ".loading.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;height:100%;width:100%;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;position:absolute;z-index:2;top:0;left:0;}", ".content-container.__jsx-style-dynamic-selector{z-index:1;position:relative;}", ".loading.__jsx-style-dynamic-selector+.container.__jsx-style-dynamic-selector .content-container.__jsx-style-dynamic-selector{-webkit-filter:blur(2px);filter:blur(2px);}"]));
73
+ }, [".optionsContainer.__jsx-style-dynamic-selector{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;padding:".concat(_uiConstants.spacers.dp4, " 0;position:relative;overflow:hidden;}"), ".container.__jsx-style-dynamic-selector{overflow-y:auto;height:100%;}", ".loading.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;height:100%;width:100%;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;position:absolute;z-index:2;top:0;inset-inline-start:0;}", ".content-container.__jsx-style-dynamic-selector{z-index:1;position:relative;}", ".loading.__jsx-style-dynamic-selector+.container.__jsx-style-dynamic-selector .content-container.__jsx-style-dynamic-selector{-webkit-filter:blur(2px);filter:blur(2px);}"]));
74
74
  };
75
75
 
76
76
  exports.OptionsContainer = OptionsContainer;
package/build/cjs/reordering-actions.js CHANGED
@@ -29,7 +29,7 @@ const ReorderingActions = _ref => {
29
29
  } = _ref;
30
30
  return /*#__PURE__*/_react.default.createElement("div", {
31
31
  "data-test": dataTest,
32
- className: _style.default.dynamic([["1295471940", [_uiConstants.spacers.dp8, _uiConstants.spacers.dp8, _uiConstants.spacers.dp8]]])
32
+ className: _style.default.dynamic([["874845231", [_uiConstants.spacers.dp8, _uiConstants.spacers.dp8, _uiConstants.spacers.dp8]]])
33
33
  }, /*#__PURE__*/_react.default.createElement(_button.Button, {
34
34
  small: true,
35
35
  disabled: disabledDown,
@@ -49,9 +49,9 @@ const ReorderingActions = _ref => {
49
49
  disabled: disabledUp
50
50
  })
51
51
  }), /*#__PURE__*/_react.default.createElement(_style.default, {
52
- id: "1295471940",
52
+ id: "874845231",
53
53
  dynamic: [_uiConstants.spacers.dp8, _uiConstants.spacers.dp8, _uiConstants.spacers.dp8]
54
- }, ["div.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row-reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;padding-top:".concat(_uiConstants.spacers.dp8, ";}"), "div.__jsx-style-dynamic-selector:last-child{padding-bottom:".concat(_uiConstants.spacers.dp8, ";}"), "div.__jsx-style-dynamic-selector>button:first-child{margin-left:".concat(_uiConstants.spacers.dp8, ";}")]));
54
+ }, ["div.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row-reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;padding-top:".concat(_uiConstants.spacers.dp8, ";}"), "div.__jsx-style-dynamic-selector:last-child{padding-bottom:".concat(_uiConstants.spacers.dp8, ";}"), "div.__jsx-style-dynamic-selector>button:first-child{margin-inline-start:".concat(_uiConstants.spacers.dp8, ";}")]));
55
55
  };
56
56
 
57
57
  exports.ReorderingActions = ReorderingActions;
package/build/cjs/transfer.stories.js CHANGED
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.default = exports.SourceEmptyPlaceholder = exports.SingleSelection = exports.Reordering = exports.PickedEmptyComponent = exports.OptionsFooter = exports.Multiple = exports.LoadingSource = exports.LoadingPicked = exports.InfiniteLoading = exports.IndividualCustomOption = exports.IncreasedOptionsHeight = exports.Header = exports.FilteredPlaceholder = exports.FilteredPicked = exports.Filtered = exports.DifferentWidths = exports.CustomListOptions = exports.CustomFilteringWithoutFilterInput = exports.CustomFilteringWithFilterInput = exports.CustomButtonText = void 0;
6
+ exports.default = exports.SourceEmptyPlaceholder = exports.SingleSelection = exports.Reordering = exports.RTL = exports.PickedEmptyComponent = exports.OptionsFooter = exports.Multiple = exports.LoadingSource = exports.LoadingPicked = exports.InfiniteLoading = exports.IndividualCustomOption = exports.IncreasedOptionsHeight = exports.Header = exports.FilteredPlaceholder = exports.FilteredPicked = exports.Filtered = exports.DifferentWidths = exports.CustomListOptions = exports.CustomFilteringWithoutFilterInput = exports.CustomFilteringWithFilterInput = exports.CustomButtonText = void 0;
7
7
 
8
8
  var _select = require("@dhis2-ui/select");
9
9
 
@@ -549,4 +549,14 @@ LoadingPicked.args = {
549
549
  } = _ref14;
550
550
  return value;
551
551
  })
552
+ };
553
+
554
+ const RTL = args => /*#__PURE__*/_react.default.createElement("div", {
555
+ dir: "rtl"
556
+ }, /*#__PURE__*/_react.default.createElement(Multiple, args));
557
+
558
+ exports.RTL = RTL;
559
+ RTL.args = {
560
+ options: options.slice(0, 3),
561
+ enableOrderChange: true
552
562
  };
package/build/es/end-intersection-detector.js CHANGED
@@ -10,7 +10,7 @@ export const EndIntersectionDetector = _ref => {
10
10
  } = _ref;
11
11
  return /*#__PURE__*/React.createElement("div", {
12
12
  "data-test": dataTest,
13
- className: "jsx-4200578429"
13
+ className: "jsx-2799340139"
14
14
  }, /*#__PURE__*/React.createElement(IntersectionDetector, {
15
15
  rootRef: rootRef,
16
16
  onChange: _ref2 => {
@@ -20,8 +20,8 @@ export const EndIntersectionDetector = _ref => {
20
20
  return isIntersecting && onEndReached();
21
21
  }
22
22
  }), /*#__PURE__*/React.createElement(_JSXStyle, {
23
- id: "4200578429"
24
- }, ["div.jsx-4200578429{width:100%;height:50px;position:absolute;z-index:-1;bottom:0;left:0;}"]));
23
+ id: "2799340139"
24
+ }, ["div.jsx-2799340139{width:100%;height:50px;position:absolute;z-index:-1;bottom:0;inset-inline-start:0;}"]));
25
25
  };
26
26
  EndIntersectionDetector.propTypes = {
27
27
  rootRef: PropTypes.shape({
package/build/es/icons.js CHANGED
@@ -2,14 +2,16 @@ import _JSXStyle from "styled-jsx/style";
2
2
  import { theme } from '@dhis2/ui-constants';
3
3
  import PropTypes from 'prop-types';
4
4
  import React from 'react';
5
- const centerButtonStyles = ["svg.jsx-114231192{min-width:20px;}"];
6
- centerButtonStyles.__hash = "114231192";
5
+ const centerButtonStyles = ["svg.jsx-2392683210{min-width:20px;}", "div.centerButton.jsx-2392683210:dir(rtl){-webkit-transform:rotate(180deg) translateX(4px);-ms-transform:rotate(180deg) translateX(4px);transform:rotate(180deg) translateX(4px);}"];
6
+ centerButtonStyles.__hash = "2392683210";
7
7
  export const IconAddAll = _ref => {
8
8
  let {
9
9
  dataTest,
10
10
  disabled
11
11
  } = _ref;
12
- return /*#__PURE__*/React.createElement("svg", {
12
+ return /*#__PURE__*/React.createElement("div", {
13
+ className: "jsx-".concat(centerButtonStyles.__hash) + " " + "centerButton"
14
+ }, /*#__PURE__*/React.createElement("svg", {
13
15
  xmlns: "http://www.w3.org/2000/svg",
14
16
  width: "16",
15
17
  height: "16",
@@ -28,7 +30,7 @@ export const IconAddAll = _ref => {
28
30
  fillRule: "nonzero",
29
31
  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
32
  className: "jsx-".concat(centerButtonStyles.__hash)
31
- })), /*#__PURE__*/React.createElement(_JSXStyle, {
33
+ }))), /*#__PURE__*/React.createElement(_JSXStyle, {
32
34
  id: centerButtonStyles.__hash
33
35
  }, centerButtonStyles));
34
36
  };
@@ -41,7 +43,9 @@ export const IconAddIndividual = _ref2 => {
41
43
  dataTest,
42
44
  disabled
43
45
  } = _ref2;
44
- return /*#__PURE__*/React.createElement("svg", {
46
+ return /*#__PURE__*/React.createElement("div", {
47
+ className: "jsx-".concat(centerButtonStyles.__hash) + " " + "centerButton"
48
+ }, /*#__PURE__*/React.createElement("svg", {
45
49
  fill: disabled ? theme.disabled : '#404B5A',
46
50
  xmlns: "http://www.w3.org/2000/svg",
47
51
  width: "16",
@@ -52,7 +56,7 @@ export const IconAddIndividual = _ref2 => {
52
56
  }, /*#__PURE__*/React.createElement("polygon", {
53
57
  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
58
  className: "jsx-".concat(centerButtonStyles.__hash)
55
- }), /*#__PURE__*/React.createElement(_JSXStyle, {
59
+ })), /*#__PURE__*/React.createElement(_JSXStyle, {
56
60
  id: centerButtonStyles.__hash
57
61
  }, centerButtonStyles));
58
62
  };
@@ -65,7 +69,9 @@ export const IconRemoveAll = _ref3 => {
65
69
  dataTest,
66
70
  disabled
67
71
  } = _ref3;
68
- return /*#__PURE__*/React.createElement("svg", {
72
+ return /*#__PURE__*/React.createElement("div", {
73
+ className: "jsx-".concat(centerButtonStyles.__hash) + " " + "centerButton"
74
+ }, /*#__PURE__*/React.createElement("svg", {
69
75
  fill: disabled ? theme.disabled : '#404B5A',
70
76
  width: "16px",
71
77
  height: "16px",
@@ -86,7 +92,7 @@ export const IconRemoveAll = _ref3 => {
86
92
  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
93
  transform: "matrix(-1 0 0 1 7.06 0)",
88
94
  className: "jsx-".concat(centerButtonStyles.__hash)
89
- })), /*#__PURE__*/React.createElement(_JSXStyle, {
95
+ }))), /*#__PURE__*/React.createElement(_JSXStyle, {
90
96
  id: centerButtonStyles.__hash
91
97
  }, centerButtonStyles));
92
98
  };
@@ -99,7 +105,9 @@ export const IconRemoveIndividual = _ref4 => {
99
105
  dataTest,
100
106
  disabled
101
107
  } = _ref4;
102
- return /*#__PURE__*/React.createElement("svg", {
108
+ return /*#__PURE__*/React.createElement("div", {
109
+ className: "jsx-".concat(centerButtonStyles.__hash) + " " + "centerButton"
110
+ }, /*#__PURE__*/React.createElement("svg", {
103
111
  fill: disabled ? theme.disabled : '#404B5A',
104
112
  xmlns: "http://www.w3.org/2000/svg",
105
113
  width: "16",
@@ -111,7 +119,7 @@ export const IconRemoveIndividual = _ref4 => {
111
119
  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
120
  transform: "matrix(-1 0 0 1 16 0)",
113
121
  className: "jsx-".concat(centerButtonStyles.__hash)
114
- }), /*#__PURE__*/React.createElement(_JSXStyle, {
122
+ })), /*#__PURE__*/React.createElement(_JSXStyle, {
115
123
  id: centerButtonStyles.__hash
116
124
  }, centerButtonStyles));
117
125
  };
package/build/es/options-container.js CHANGED
@@ -23,16 +23,16 @@ export const OptionsContainer = _ref => {
23
23
  const wrapperRef = useRef(null);
24
24
  const resizeCounter = useResizeCounter(wrapperRef.current);
25
25
  return /*#__PURE__*/React.createElement("div", {
26
- className: _JSXStyle.dynamic([["889751462", [spacers.dp4]]]) + " " + "optionsContainer"
26
+ className: _JSXStyle.dynamic([["3254058061", [spacers.dp4]]]) + " " + "optionsContainer"
27
27
  }, loading && /*#__PURE__*/React.createElement("div", {
28
- className: _JSXStyle.dynamic([["889751462", [spacers.dp4]]]) + " " + "loading"
28
+ className: _JSXStyle.dynamic([["3254058061", [spacers.dp4]]]) + " " + "loading"
29
29
  }, /*#__PURE__*/React.createElement(CircularLoader, null)), /*#__PURE__*/React.createElement("div", {
30
30
  "data-test": dataTest,
31
31
  ref: optionsRef,
32
- className: _JSXStyle.dynamic([["889751462", [spacers.dp4]]]) + " " + "container"
32
+ className: _JSXStyle.dynamic([["3254058061", [spacers.dp4]]]) + " " + "container"
33
33
  }, /*#__PURE__*/React.createElement("div", {
34
34
  ref: wrapperRef,
35
- className: _JSXStyle.dynamic([["889751462", [spacers.dp4]]]) + " " + "content-container"
35
+ className: _JSXStyle.dynamic([["3254058061", [spacers.dp4]]]) + " " + "content-container"
36
36
  }, !options.length && emptyComponent, options.map(option => {
37
37
  const highlighted = !!highlightedOptions.find(highlightedSourceOption => highlightedSourceOption === option.value);
38
38
  return /*#__PURE__*/React.createElement(Fragment, {
@@ -48,9 +48,9 @@ export const OptionsContainer = _ref => {
48
48
  rootRef: optionsRef,
49
49
  onEndReached: onEndReached
50
50
  }))), /*#__PURE__*/React.createElement(_JSXStyle, {
51
- id: "889751462",
51
+ id: "3254058061",
52
52
  dynamic: [spacers.dp4]
53
- }, [".optionsContainer.__jsx-style-dynamic-selector{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;padding:".concat(spacers.dp4, " 0;position:relative;overflow:hidden;}"), ".container.__jsx-style-dynamic-selector{overflow-y:auto;height:100%;}", ".loading.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;height:100%;width:100%;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;position:absolute;z-index:2;top:0;left:0;}", ".content-container.__jsx-style-dynamic-selector{z-index:1;position:relative;}", ".loading.__jsx-style-dynamic-selector+.container.__jsx-style-dynamic-selector .content-container.__jsx-style-dynamic-selector{-webkit-filter:blur(2px);filter:blur(2px);}"]));
53
+ }, [".optionsContainer.__jsx-style-dynamic-selector{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;padding:".concat(spacers.dp4, " 0;position:relative;overflow:hidden;}"), ".container.__jsx-style-dynamic-selector{overflow-y:auto;height:100%;}", ".loading.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;height:100%;width:100%;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;position:absolute;z-index:2;top:0;inset-inline-start:0;}", ".content-container.__jsx-style-dynamic-selector{z-index:1;position:relative;}", ".loading.__jsx-style-dynamic-selector+.container.__jsx-style-dynamic-selector .content-container.__jsx-style-dynamic-selector{-webkit-filter:blur(2px);filter:blur(2px);}"]));
54
54
  };
55
55
  OptionsContainer.defaultProps = {
56
56
  selected: false
package/build/es/reordering-actions.js CHANGED
@@ -14,7 +14,7 @@ export const ReorderingActions = _ref => {
14
14
  } = _ref;
15
15
  return /*#__PURE__*/React.createElement("div", {
16
16
  "data-test": dataTest,
17
- className: _JSXStyle.dynamic([["1295471940", [spacers.dp8, spacers.dp8, spacers.dp8]]])
17
+ className: _JSXStyle.dynamic([["874845231", [spacers.dp8, spacers.dp8, spacers.dp8]]])
18
18
  }, /*#__PURE__*/React.createElement(Button, {
19
19
  small: true,
20
20
  disabled: disabledDown,
@@ -34,9 +34,9 @@ export const ReorderingActions = _ref => {
34
34
  disabled: disabledUp
35
35
  })
36
36
  }), /*#__PURE__*/React.createElement(_JSXStyle, {
37
- id: "1295471940",
37
+ id: "874845231",
38
38
  dynamic: [spacers.dp8, spacers.dp8, spacers.dp8]
39
- }, ["div.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row-reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;padding-top:".concat(spacers.dp8, ";}"), "div.__jsx-style-dynamic-selector:last-child{padding-bottom:".concat(spacers.dp8, ";}"), "div.__jsx-style-dynamic-selector>button:first-child{margin-left:".concat(spacers.dp8, ";}")]));
39
+ }, ["div.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row-reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;padding-top:".concat(spacers.dp8, ";}"), "div.__jsx-style-dynamic-selector:last-child{padding-bottom:".concat(spacers.dp8, ";}"), "div.__jsx-style-dynamic-selector>button:first-child{margin-inline-start:".concat(spacers.dp8, ";}")]));
40
40
  };
41
41
  ReorderingActions.propTypes = {
42
42
  dataTest: PropTypes.string.isRequired,
package/build/es/transfer.stories.js CHANGED
@@ -505,4 +505,11 @@ LoadingPicked.args = {
505
505
  } = _ref14;
506
506
  return value;
507
507
  })
508
+ };
509
+ export const RTL = args => /*#__PURE__*/React.createElement("div", {
510
+ dir: "rtl"
511
+ }, /*#__PURE__*/React.createElement(Multiple, args));
512
+ RTL.args = {
513
+ options: options.slice(0, 3),
514
+ enableOrderChange: true
508
515
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dhis2-ui/transfer",
3
- "version": "9.3.0",
3
+ "version": "9.4.0-alpha.2",
4
4
  "description": "UI Transfer",
5
5
  "repository": {
6
6
  "type": "git",
@@ -33,12 +33,12 @@
33
33
  },
34
34
  "dependencies": {
35
35
  "@dhis2/prop-types": "^3.1.2",
36
- "@dhis2-ui/button": "9.3.0",
37
- "@dhis2-ui/field": "9.3.0",
38
- "@dhis2-ui/input": "9.3.0",
39
- "@dhis2-ui/intersection-detector": "9.3.0",
40
- "@dhis2-ui/loader": "9.3.0",
41
- "@dhis2/ui-constants": "9.3.0",
36
+ "@dhis2-ui/button": "9.4.0-alpha.2",
37
+ "@dhis2-ui/field": "9.4.0-alpha.2",
38
+ "@dhis2-ui/input": "9.4.0-alpha.2",
39
+ "@dhis2-ui/intersection-detector": "9.4.0-alpha.2",
40
+ "@dhis2-ui/loader": "9.4.0-alpha.2",
41
+ "@dhis2/ui-constants": "9.4.0-alpha.2",
42
42
  "classnames": "^2.3.1",
43
43
  "prop-types": "^15.7.2"
44
44
  },