@epam/uui 4.10.0-rc.1 → 4.10.0-rc.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/index.js +443 -338
- package/index.js.map +1 -1
- package/package.json +6 -7
- package/stats.html +1 -1
package/index.js
CHANGED
|
@@ -1,328 +1,352 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var uuiComponents = require('@epam/uui-components');
|
|
4
|
+
var uuiCore = require('@epam/uui-core');
|
|
5
|
+
var React = require('react');
|
|
6
|
+
var FocusLock = require('react-focus-lock');
|
|
7
|
+
var cx = require('classnames');
|
|
8
|
+
|
|
9
|
+
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
10
|
+
|
|
11
|
+
function _interopNamespace(e) {
|
|
12
|
+
if (e && e.__esModule) return e;
|
|
13
|
+
var n = Object.create(null);
|
|
14
|
+
if (e) {
|
|
15
|
+
Object.keys(e).forEach(function (k) {
|
|
16
|
+
if (k !== 'default') {
|
|
17
|
+
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
18
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
19
|
+
enumerable: true,
|
|
20
|
+
get: function () { return e[k]; }
|
|
21
|
+
});
|
|
22
|
+
}
|
|
23
|
+
});
|
|
24
|
+
}
|
|
25
|
+
n.default = e;
|
|
26
|
+
return Object.freeze(n);
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
30
|
+
var FocusLock__default = /*#__PURE__*/_interopDefault(FocusLock);
|
|
31
|
+
var cx__default = /*#__PURE__*/_interopDefault(cx);
|
|
8
32
|
|
|
9
33
|
var _path$y;
|
|
10
34
|
function _extends$A() { _extends$A = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$A.apply(this, arguments); }
|
|
11
35
|
var SvgBtnCross12 = function SvgBtnCross12(props, ref) {
|
|
12
|
-
return /*#__PURE__*/
|
|
36
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$A({
|
|
13
37
|
xmlns: "http://www.w3.org/2000/svg",
|
|
14
38
|
width: 12,
|
|
15
39
|
height: 12,
|
|
16
40
|
viewBox: "0 0 12 12",
|
|
17
41
|
ref: ref
|
|
18
|
-
}, props), _path$y || (_path$y = /*#__PURE__*/
|
|
42
|
+
}, props), _path$y || (_path$y = /*#__PURE__*/React__namespace.createElement("path", {
|
|
19
43
|
fillRule: "evenodd",
|
|
20
44
|
d: "M9.5 3.205 8.795 2.5 6 5.295 3.205 2.5l-.705.705L5.295 6 2.5 8.795l.705.705L6 6.705 8.795 9.5l.705-.705L6.705 6z"
|
|
21
45
|
})));
|
|
22
46
|
};
|
|
23
|
-
var ForwardRef$A = /*#__PURE__*/forwardRef(SvgBtnCross12);
|
|
47
|
+
var ForwardRef$A = /*#__PURE__*/React.forwardRef(SvgBtnCross12);
|
|
24
48
|
|
|
25
49
|
var _path$x;
|
|
26
50
|
function _extends$z() { _extends$z = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$z.apply(this, arguments); }
|
|
27
51
|
var SvgBtnCross18 = function SvgBtnCross18(props, ref) {
|
|
28
|
-
return /*#__PURE__*/
|
|
52
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$z({
|
|
29
53
|
xmlns: "http://www.w3.org/2000/svg",
|
|
30
54
|
width: 18,
|
|
31
55
|
height: 18,
|
|
32
56
|
viewBox: "0 0 18 18",
|
|
33
57
|
ref: ref
|
|
34
|
-
}, props), _path$x || (_path$x = /*#__PURE__*/
|
|
58
|
+
}, props), _path$x || (_path$x = /*#__PURE__*/React__namespace.createElement("path", {
|
|
35
59
|
fillRule: "evenodd",
|
|
36
60
|
d: "M14.25 4.808 13.193 3.75 9 7.942 4.808 3.75 3.75 4.808 7.942 9 3.75 13.193l1.058 1.057L9 10.057l4.193 4.193 1.057-1.057L10.057 9z"
|
|
37
61
|
})));
|
|
38
62
|
};
|
|
39
|
-
var ForwardRef$z = /*#__PURE__*/forwardRef(SvgBtnCross18);
|
|
63
|
+
var ForwardRef$z = /*#__PURE__*/React.forwardRef(SvgBtnCross18);
|
|
40
64
|
|
|
41
65
|
var _path$w;
|
|
42
66
|
function _extends$y() { _extends$y = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$y.apply(this, arguments); }
|
|
43
67
|
var SvgBtnCross24 = function SvgBtnCross24(props, ref) {
|
|
44
|
-
return /*#__PURE__*/
|
|
68
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$y({
|
|
45
69
|
xmlns: "http://www.w3.org/2000/svg",
|
|
46
70
|
width: 24,
|
|
47
71
|
height: 24,
|
|
48
72
|
viewBox: "0 0 24 24",
|
|
49
73
|
ref: ref
|
|
50
|
-
}, props), _path$w || (_path$w = /*#__PURE__*/
|
|
74
|
+
}, props), _path$w || (_path$w = /*#__PURE__*/React__namespace.createElement("path", {
|
|
51
75
|
fillRule: "evenodd",
|
|
52
76
|
d: "M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
|
|
53
77
|
})));
|
|
54
78
|
};
|
|
55
|
-
var ForwardRef$y = /*#__PURE__*/forwardRef(SvgBtnCross24);
|
|
79
|
+
var ForwardRef$y = /*#__PURE__*/React.forwardRef(SvgBtnCross24);
|
|
56
80
|
|
|
57
81
|
var _path$v;
|
|
58
82
|
function _extends$x() { _extends$x = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$x.apply(this, arguments); }
|
|
59
83
|
var SvgFoldingArrow12 = function SvgFoldingArrow12(props, ref) {
|
|
60
|
-
return /*#__PURE__*/
|
|
84
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$x({
|
|
61
85
|
xmlns: "http://www.w3.org/2000/svg",
|
|
62
86
|
width: 12,
|
|
63
87
|
height: 12,
|
|
64
88
|
viewBox: "0 0 12 12",
|
|
65
89
|
ref: ref
|
|
66
|
-
}, props), _path$v || (_path$v = /*#__PURE__*/
|
|
90
|
+
}, props), _path$v || (_path$v = /*#__PURE__*/React__namespace.createElement("path", {
|
|
67
91
|
fillRule: "evenodd",
|
|
68
92
|
d: "M8.295 4.295 6 6.585l-2.295-2.29L3 5l3 3 3-3z"
|
|
69
93
|
})));
|
|
70
94
|
};
|
|
71
|
-
var ForwardRef$x = /*#__PURE__*/forwardRef(SvgFoldingArrow12);
|
|
95
|
+
var ForwardRef$x = /*#__PURE__*/React.forwardRef(SvgFoldingArrow12);
|
|
72
96
|
|
|
73
97
|
var _path$u;
|
|
74
98
|
function _extends$w() { _extends$w = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$w.apply(this, arguments); }
|
|
75
99
|
var SvgFoldingArrow18 = function SvgFoldingArrow18(props, ref) {
|
|
76
|
-
return /*#__PURE__*/
|
|
100
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$w({
|
|
77
101
|
xmlns: "http://www.w3.org/2000/svg",
|
|
78
102
|
width: 18,
|
|
79
103
|
height: 18,
|
|
80
104
|
viewBox: "0 0 18 18",
|
|
81
105
|
ref: ref
|
|
82
|
-
}, props), _path$u || (_path$u = /*#__PURE__*/
|
|
106
|
+
}, props), _path$u || (_path$u = /*#__PURE__*/React__namespace.createElement("path", {
|
|
83
107
|
fillRule: "evenodd",
|
|
84
108
|
d: "M12.443 6.442 9 9.877 5.558 6.442 4.5 7.5 9 12l4.5-4.5z"
|
|
85
109
|
})));
|
|
86
110
|
};
|
|
87
|
-
var ForwardRef$w = /*#__PURE__*/forwardRef(SvgFoldingArrow18);
|
|
111
|
+
var ForwardRef$w = /*#__PURE__*/React.forwardRef(SvgFoldingArrow18);
|
|
88
112
|
|
|
89
113
|
var _path$t;
|
|
90
114
|
function _extends$v() { _extends$v = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$v.apply(this, arguments); }
|
|
91
115
|
var SvgFoldingArrow24 = function SvgFoldingArrow24(props, ref) {
|
|
92
|
-
return /*#__PURE__*/
|
|
116
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$v({
|
|
93
117
|
xmlns: "http://www.w3.org/2000/svg",
|
|
94
118
|
width: 24,
|
|
95
119
|
height: 24,
|
|
96
120
|
viewBox: "0 0 24 24",
|
|
97
121
|
ref: ref
|
|
98
|
-
}, props), _path$t || (_path$t = /*#__PURE__*/
|
|
122
|
+
}, props), _path$t || (_path$t = /*#__PURE__*/React__namespace.createElement("path", {
|
|
99
123
|
fillRule: "evenodd",
|
|
100
124
|
d: "M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z"
|
|
101
125
|
})));
|
|
102
126
|
};
|
|
103
|
-
var ForwardRef$v = /*#__PURE__*/forwardRef(SvgFoldingArrow24);
|
|
127
|
+
var ForwardRef$v = /*#__PURE__*/React.forwardRef(SvgFoldingArrow24);
|
|
104
128
|
|
|
105
129
|
var _path$s;
|
|
106
130
|
function _extends$u() { _extends$u = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$u.apply(this, arguments); }
|
|
107
131
|
var SvgAccept12 = function SvgAccept12(props, ref) {
|
|
108
|
-
return /*#__PURE__*/
|
|
132
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$u({
|
|
109
133
|
xmlns: "http://www.w3.org/2000/svg",
|
|
110
134
|
width: 12,
|
|
111
135
|
height: 12,
|
|
112
136
|
viewBox: "0 0 12 12",
|
|
113
137
|
ref: ref
|
|
114
|
-
}, props), _path$s || (_path$s = /*#__PURE__*/
|
|
138
|
+
}, props), _path$s || (_path$s = /*#__PURE__*/React__namespace.createElement("path", {
|
|
115
139
|
fillRule: "evenodd",
|
|
116
140
|
d: "M4.846 6.8 9.462 2 11 3.6 4.846 10l-.77-.8L1 6l1.538-1.6 2.308 2.4z"
|
|
117
141
|
})));
|
|
118
142
|
};
|
|
119
|
-
var ForwardRef$u = /*#__PURE__*/forwardRef(SvgAccept12);
|
|
143
|
+
var ForwardRef$u = /*#__PURE__*/React.forwardRef(SvgAccept12);
|
|
120
144
|
|
|
121
145
|
var _path$r;
|
|
122
146
|
function _extends$t() { _extends$t = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$t.apply(this, arguments); }
|
|
123
147
|
var SvgAccept18 = function SvgAccept18(props, ref) {
|
|
124
|
-
return /*#__PURE__*/
|
|
148
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$t({
|
|
125
149
|
xmlns: "http://www.w3.org/2000/svg",
|
|
126
150
|
width: 18,
|
|
127
151
|
height: 18,
|
|
128
152
|
viewBox: "0 0 18 18",
|
|
129
153
|
ref: ref
|
|
130
|
-
}, props), _path$r || (_path$r = /*#__PURE__*/
|
|
154
|
+
}, props), _path$r || (_path$r = /*#__PURE__*/React__namespace.createElement("path", {
|
|
131
155
|
fillRule: "evenodd",
|
|
132
156
|
d: "M7.136 11.91 4.034 8.776 3 9.821 7.136 14 16 5.045 14.966 4z"
|
|
133
157
|
})));
|
|
134
158
|
};
|
|
135
|
-
var ForwardRef$t = /*#__PURE__*/forwardRef(SvgAccept18);
|
|
159
|
+
var ForwardRef$t = /*#__PURE__*/React.forwardRef(SvgAccept18);
|
|
136
160
|
|
|
137
161
|
var _path$q;
|
|
138
162
|
function _extends$s() { _extends$s = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$s.apply(this, arguments); }
|
|
139
163
|
var SvgAccept24 = function SvgAccept24(props, ref) {
|
|
140
|
-
return /*#__PURE__*/
|
|
164
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$s({
|
|
141
165
|
xmlns: "http://www.w3.org/2000/svg",
|
|
142
166
|
width: 24,
|
|
143
167
|
height: 24,
|
|
144
168
|
viewBox: "0 0 24 24",
|
|
145
169
|
ref: ref
|
|
146
|
-
}, props), _path$q || (_path$q = /*#__PURE__*/
|
|
170
|
+
}, props), _path$q || (_path$q = /*#__PURE__*/React__namespace.createElement("path", {
|
|
147
171
|
fillRule: "evenodd",
|
|
148
172
|
d: "m9.727 16.075-4.295-4.388L4 13.149 9.727 19 22 6.463 20.568 5z"
|
|
149
173
|
})));
|
|
150
174
|
};
|
|
151
|
-
var ForwardRef$s = /*#__PURE__*/forwardRef(SvgAccept24);
|
|
175
|
+
var ForwardRef$s = /*#__PURE__*/React.forwardRef(SvgAccept24);
|
|
152
176
|
|
|
153
177
|
var _path$p;
|
|
154
178
|
function _extends$r() { _extends$r = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$r.apply(this, arguments); }
|
|
155
179
|
var SvgSearch12 = function SvgSearch12(props, ref) {
|
|
156
|
-
return /*#__PURE__*/
|
|
180
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$r({
|
|
157
181
|
xmlns: "http://www.w3.org/2000/svg",
|
|
158
182
|
width: 12,
|
|
159
183
|
height: 12,
|
|
160
184
|
viewBox: "0 0 12 12",
|
|
161
185
|
ref: ref
|
|
162
|
-
}, props), _path$p || (_path$p = /*#__PURE__*/
|
|
186
|
+
}, props), _path$p || (_path$p = /*#__PURE__*/React__namespace.createElement("path", {
|
|
163
187
|
fillRule: "evenodd",
|
|
164
188
|
d: "M9.016 8.309 10.707 10l-.707.707-1.691-1.691a4.5 4.5 0 1 1 .707-.707zM5.5 9a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7z"
|
|
165
189
|
})));
|
|
166
190
|
};
|
|
167
|
-
var ForwardRef$r = /*#__PURE__*/forwardRef(SvgSearch12);
|
|
191
|
+
var ForwardRef$r = /*#__PURE__*/React.forwardRef(SvgSearch12);
|
|
168
192
|
|
|
169
193
|
var _path$o;
|
|
170
194
|
function _extends$q() { _extends$q = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$q.apply(this, arguments); }
|
|
171
195
|
var SvgSearch18 = function SvgSearch18(props, ref) {
|
|
172
|
-
return /*#__PURE__*/
|
|
196
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$q({
|
|
173
197
|
xmlns: "http://www.w3.org/2000/svg",
|
|
174
198
|
width: 18,
|
|
175
199
|
height: 18,
|
|
176
200
|
viewBox: "0 0 18 18",
|
|
177
201
|
ref: ref
|
|
178
|
-
}, props), _path$o || (_path$o = /*#__PURE__*/
|
|
202
|
+
}, props), _path$o || (_path$o = /*#__PURE__*/React__namespace.createElement("path", {
|
|
179
203
|
fillRule: "evenodd",
|
|
180
204
|
d: "M13.749 12.335 16.414 15 15 16.414l-2.665-2.665a6.5 6.5 0 1 1 1.414-1.414zM8.5 13a4.5 4.5 0 1 0 0-9 4.5 4.5 0 0 0 0 9z"
|
|
181
205
|
})));
|
|
182
206
|
};
|
|
183
|
-
var ForwardRef$q = /*#__PURE__*/forwardRef(SvgSearch18);
|
|
207
|
+
var ForwardRef$q = /*#__PURE__*/React.forwardRef(SvgSearch18);
|
|
184
208
|
|
|
185
209
|
var _path$n;
|
|
186
210
|
function _extends$p() { _extends$p = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$p.apply(this, arguments); }
|
|
187
211
|
var SvgSearch24 = function SvgSearch24(props, ref) {
|
|
188
|
-
return /*#__PURE__*/
|
|
212
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$p({
|
|
189
213
|
xmlns: "http://www.w3.org/2000/svg",
|
|
190
214
|
width: 24,
|
|
191
215
|
height: 24,
|
|
192
216
|
viewBox: "0 0 24 24",
|
|
193
217
|
ref: ref
|
|
194
|
-
}, props), _path$n || (_path$n = /*#__PURE__*/
|
|
218
|
+
}, props), _path$n || (_path$n = /*#__PURE__*/React__namespace.createElement("path", {
|
|
195
219
|
fillRule: "evenodd",
|
|
196
220
|
d: "M17.32 15.906 21.414 20 20 21.414l-4.094-4.094a8 8 0 1 1 1.414-1.414zM11 17a6 6 0 1 0 0-12 6 6 0 0 0 0 12z"
|
|
197
221
|
})));
|
|
198
222
|
};
|
|
199
|
-
var ForwardRef$p = /*#__PURE__*/forwardRef(SvgSearch24);
|
|
223
|
+
var ForwardRef$p = /*#__PURE__*/React.forwardRef(SvgSearch24);
|
|
200
224
|
|
|
201
225
|
var _path$m;
|
|
202
226
|
function _extends$o() { _extends$o = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$o.apply(this, arguments); }
|
|
203
227
|
var SvgCalendar12 = function SvgCalendar12(props, ref) {
|
|
204
|
-
return /*#__PURE__*/
|
|
228
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$o({
|
|
205
229
|
xmlns: "http://www.w3.org/2000/svg",
|
|
206
230
|
width: 12,
|
|
207
231
|
height: 12,
|
|
208
232
|
viewBox: "0 0 12 12",
|
|
209
233
|
ref: ref
|
|
210
|
-
}, props), _path$m || (_path$m = /*#__PURE__*/
|
|
234
|
+
}, props), _path$m || (_path$m = /*#__PURE__*/React__namespace.createElement("path", {
|
|
211
235
|
fillRule: "evenodd",
|
|
212
236
|
d: "M10 2H9V1H8v1H4V1H3v1H2c-.55 0-1 .45-1 1v7c0 .55.45 1 1 1h8c.55 0 1-.45 1-1V3c0-.55-.45-1-1-1zm0 8H2V4h8v6z"
|
|
213
237
|
})));
|
|
214
238
|
};
|
|
215
|
-
var ForwardRef$o = /*#__PURE__*/forwardRef(SvgCalendar12);
|
|
239
|
+
var ForwardRef$o = /*#__PURE__*/React.forwardRef(SvgCalendar12);
|
|
216
240
|
|
|
217
241
|
var _path$l;
|
|
218
242
|
function _extends$n() { _extends$n = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$n.apply(this, arguments); }
|
|
219
243
|
var SvgCalendar18 = function SvgCalendar18(props, ref) {
|
|
220
|
-
return /*#__PURE__*/
|
|
244
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$n({
|
|
221
245
|
xmlns: "http://www.w3.org/2000/svg",
|
|
222
246
|
width: 18,
|
|
223
247
|
height: 18,
|
|
224
248
|
viewBox: "0 0 18 18",
|
|
225
249
|
ref: ref
|
|
226
|
-
}, props), _path$l || (_path$l = /*#__PURE__*/
|
|
250
|
+
}, props), _path$l || (_path$l = /*#__PURE__*/React__namespace.createElement("path", {
|
|
227
251
|
fillRule: "evenodd",
|
|
228
252
|
d: "M14 3V1h-2v2H6V1H4v2C3 3 2 4 2 5v10c0 1 1 2 2 2h10c1 0 2-1 2-2V5c0-1-1-2-2-2zm0 12-10 .048V7h10v8z"
|
|
229
253
|
})));
|
|
230
254
|
};
|
|
231
|
-
var ForwardRef$n = /*#__PURE__*/forwardRef(SvgCalendar18);
|
|
255
|
+
var ForwardRef$n = /*#__PURE__*/React.forwardRef(SvgCalendar18);
|
|
232
256
|
|
|
233
257
|
var _path$k;
|
|
234
258
|
function _extends$m() { _extends$m = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$m.apply(this, arguments); }
|
|
235
259
|
var SvgCalendar24 = function SvgCalendar24(props, ref) {
|
|
236
|
-
return /*#__PURE__*/
|
|
260
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$m({
|
|
237
261
|
xmlns: "http://www.w3.org/2000/svg",
|
|
238
262
|
width: 24,
|
|
239
263
|
height: 24,
|
|
240
264
|
viewBox: "0 0 24 24",
|
|
241
265
|
ref: ref
|
|
242
|
-
}, props), _path$k || (_path$k = /*#__PURE__*/
|
|
266
|
+
}, props), _path$k || (_path$k = /*#__PURE__*/React__namespace.createElement("path", {
|
|
243
267
|
fillRule: "evenodd",
|
|
244
268
|
d: "M20 3h-1V1h-2v2H7V1H5v2H4c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 18H4V8h16v13z"
|
|
245
269
|
})));
|
|
246
270
|
};
|
|
247
|
-
var ForwardRef$m = /*#__PURE__*/forwardRef(SvgCalendar24);
|
|
271
|
+
var ForwardRef$m = /*#__PURE__*/React.forwardRef(SvgCalendar24);
|
|
248
272
|
|
|
249
273
|
var _path$j;
|
|
250
274
|
function _extends$l() { _extends$l = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$l.apply(this, arguments); }
|
|
251
275
|
var SvgInfo12 = function SvgInfo12(props, ref) {
|
|
252
|
-
return /*#__PURE__*/
|
|
276
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$l({
|
|
253
277
|
width: 12,
|
|
254
278
|
height: 12,
|
|
255
279
|
viewBox: "0 0 12 12",
|
|
256
280
|
xmlns: "http://www.w3.org/2000/svg",
|
|
257
281
|
ref: ref
|
|
258
|
-
}, props), _path$j || (_path$j = /*#__PURE__*/
|
|
282
|
+
}, props), _path$j || (_path$j = /*#__PURE__*/React__namespace.createElement("path", {
|
|
259
283
|
d: "M6 1C3.24 1 1 3.24 1 6s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zm1 8H5V5h2zm0-5c-.471.471-1.529.471-2 0s-.471-1.529 0-2 1.529-.471 2 0 .471 1.529 0 2z",
|
|
260
284
|
fillRule: "evenodd"
|
|
261
285
|
})));
|
|
262
286
|
};
|
|
263
|
-
var ForwardRef$l = /*#__PURE__*/forwardRef(SvgInfo12);
|
|
287
|
+
var ForwardRef$l = /*#__PURE__*/React.forwardRef(SvgInfo12);
|
|
264
288
|
|
|
265
289
|
var _path$i;
|
|
266
290
|
function _extends$k() { _extends$k = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$k.apply(this, arguments); }
|
|
267
291
|
var SvgInfo18 = function SvgInfo18(props, ref) {
|
|
268
|
-
return /*#__PURE__*/
|
|
292
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$k({
|
|
269
293
|
xmlns: "http://www.w3.org/2000/svg",
|
|
270
294
|
width: 18,
|
|
271
295
|
height: 18,
|
|
272
296
|
viewBox: "0 0 18 18",
|
|
273
297
|
ref: ref
|
|
274
|
-
}, props), _path$i || (_path$i = /*#__PURE__*/
|
|
298
|
+
}, props), _path$i || (_path$i = /*#__PURE__*/React__namespace.createElement("path", {
|
|
275
299
|
fillRule: "evenodd",
|
|
276
300
|
d: "M8 13h2V8H8v5zM9 1C4.584 1 1 4.584 1 9s3.584 8 8 8 8-3.584 8-8-3.584-8-8-8zm0 15c-3.859 0-7-3.141-7-7s3.141-7 7-7 7 3.141 7 7-3.141 7-7 7zM8 7h2V5H8v2z"
|
|
277
301
|
})));
|
|
278
302
|
};
|
|
279
|
-
var ForwardRef$k = /*#__PURE__*/forwardRef(SvgInfo18);
|
|
303
|
+
var ForwardRef$k = /*#__PURE__*/React.forwardRef(SvgInfo18);
|
|
280
304
|
|
|
281
305
|
var _path$h;
|
|
282
306
|
function _extends$j() { _extends$j = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$j.apply(this, arguments); }
|
|
283
307
|
var SvgInfo24 = function SvgInfo24(props, ref) {
|
|
284
|
-
return /*#__PURE__*/
|
|
308
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$j({
|
|
285
309
|
xmlns: "http://www.w3.org/2000/svg",
|
|
286
310
|
width: 24,
|
|
287
311
|
height: 24,
|
|
288
312
|
viewBox: "0 0 24 24",
|
|
289
313
|
ref: ref
|
|
290
|
-
}, props), _path$h || (_path$h = /*#__PURE__*/
|
|
314
|
+
}, props), _path$h || (_path$h = /*#__PURE__*/React__namespace.createElement("path", {
|
|
291
315
|
fillRule: "evenodd",
|
|
292
316
|
d: "M11 17h2v-6h-2v6zm1-15C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zM11 9h2V7h-2v2z"
|
|
293
317
|
})));
|
|
294
318
|
};
|
|
295
|
-
var ForwardRef$j = /*#__PURE__*/forwardRef(SvgInfo24);
|
|
319
|
+
var ForwardRef$j = /*#__PURE__*/React.forwardRef(SvgInfo24);
|
|
296
320
|
|
|
297
321
|
var _path$g;
|
|
298
322
|
function _extends$i() { _extends$i = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$i.apply(this, arguments); }
|
|
299
323
|
var SvgHelpFill10 = function SvgHelpFill10(props, ref) {
|
|
300
|
-
return /*#__PURE__*/
|
|
324
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$i({
|
|
301
325
|
width: 10,
|
|
302
326
|
height: 10,
|
|
303
327
|
viewBox: "0 0 10 10",
|
|
304
328
|
xmlns: "http://www.w3.org/2000/svg",
|
|
305
329
|
ref: ref
|
|
306
|
-
}, props), _path$g || (_path$g = /*#__PURE__*/
|
|
330
|
+
}, props), _path$g || (_path$g = /*#__PURE__*/React__namespace.createElement("path", {
|
|
307
331
|
d: "M5 0C2.24 0 0 2.24 0 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5Zm.5 7.5h-1v-3h1v3Zm0-4h-1v-1h1v1Z"
|
|
308
332
|
})));
|
|
309
333
|
};
|
|
310
|
-
var ForwardRef$i = /*#__PURE__*/forwardRef(SvgHelpFill10);
|
|
334
|
+
var ForwardRef$i = /*#__PURE__*/React.forwardRef(SvgHelpFill10);
|
|
311
335
|
|
|
312
336
|
var _path$f;
|
|
313
337
|
function _extends$h() { _extends$h = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$h.apply(this, arguments); }
|
|
314
338
|
var SvgHelpFill16 = function SvgHelpFill16(props, ref) {
|
|
315
|
-
return /*#__PURE__*/
|
|
339
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$h({
|
|
316
340
|
width: 16,
|
|
317
341
|
height: 16,
|
|
318
342
|
viewBox: "0 0 16 16",
|
|
319
343
|
xmlns: "http://www.w3.org/2000/svg",
|
|
320
344
|
ref: ref
|
|
321
|
-
}, props), _path$f || (_path$f = /*#__PURE__*/
|
|
345
|
+
}, props), _path$f || (_path$f = /*#__PURE__*/React__namespace.createElement("path", {
|
|
322
346
|
d: "M7 12h2V7H7v5ZM8 0C3.584 0 0 3.584 0 8s3.584 8 8 8 8-3.584 8-8-3.584-8-8-8Zm0 15c-3.859 0-7-3.141-7-7s3.141-7 7-7 7 3.141 7 7-3.141 7-7 7ZM7 6h2V4H7v2Z"
|
|
323
347
|
})));
|
|
324
348
|
};
|
|
325
|
-
var ForwardRef$h = /*#__PURE__*/forwardRef(SvgHelpFill16);
|
|
349
|
+
var ForwardRef$h = /*#__PURE__*/React.forwardRef(SvgHelpFill16);
|
|
326
350
|
|
|
327
351
|
const systemIcons = {
|
|
328
352
|
'18': {
|
|
@@ -412,7 +436,7 @@ function applyButtonMods(mods) {
|
|
|
412
436
|
buttonCss[`mode-${mods.mode || 'solid'}`],
|
|
413
437
|
];
|
|
414
438
|
}
|
|
415
|
-
const Button = withMods(Button
|
|
439
|
+
const Button = uuiCore.withMods(uuiComponents.Button, applyButtonMods, (props) => ({
|
|
416
440
|
dropdownIcon: systemIcons[props.size || defaultSize$7].foldingArrow,
|
|
417
441
|
clearIcon: systemIcons[props.size || defaultSize$7].clear,
|
|
418
442
|
}));
|
|
@@ -426,7 +450,7 @@ function applyIconButtonMods(mods) {
|
|
|
426
450
|
css$B.root,
|
|
427
451
|
];
|
|
428
452
|
}
|
|
429
|
-
const IconButton = withMods(IconButton
|
|
453
|
+
const IconButton = uuiCore.withMods(uuiComponents.IconButton, applyIconButtonMods);
|
|
430
454
|
|
|
431
455
|
function getIconClass(props) {
|
|
432
456
|
let classList = {
|
|
@@ -459,7 +483,7 @@ function applyLinkButtonMods(mods) {
|
|
|
459
483
|
...getIconClass(mods),
|
|
460
484
|
];
|
|
461
485
|
}
|
|
462
|
-
const LinkButton = withMods(Button
|
|
486
|
+
const LinkButton = uuiCore.withMods(uuiComponents.Button, applyLinkButtonMods, (props) => ({
|
|
463
487
|
dropdownIcon: systemIcons[props.size || defaultSize$6].foldingArrow,
|
|
464
488
|
clearIcon: systemIcons[props.size || defaultSize$6].clear,
|
|
465
489
|
}));
|
|
@@ -475,7 +499,7 @@ function applyTabButtonMods(mods) {
|
|
|
475
499
|
...getIconClass(mods),
|
|
476
500
|
];
|
|
477
501
|
}
|
|
478
|
-
const TabButton = withMods(Button
|
|
502
|
+
const TabButton = uuiCore.withMods(uuiComponents.Button, applyTabButtonMods, props => (Object.assign(Object.assign({ dropdownIcon: systemIcons['36'].foldingArrow, clearIcon: systemIcons['36'].clear, countPosition: 'right' }, props), { rawProps: Object.assign({ role: 'tab' }, props.rawProps) })));
|
|
479
503
|
|
|
480
504
|
var css$y = {"root":"VerticalTabButton_root__LInYW"};
|
|
481
505
|
|
|
@@ -484,73 +508,73 @@ function applyVerticalTabButtonMods() {
|
|
|
484
508
|
css$y.root,
|
|
485
509
|
];
|
|
486
510
|
}
|
|
487
|
-
const VerticalTabButton = withMods(TabButton, applyVerticalTabButtonMods);
|
|
511
|
+
const VerticalTabButton = uuiCore.withMods(TabButton, applyVerticalTabButtonMods);
|
|
488
512
|
|
|
489
513
|
var css$x = {"root":"Checkbox_root__-oMf6","size-18":"Checkbox_size-18__BzbEk","size-12":"Checkbox_size-12__ASr3R","size18":"Checkbox_size-18__BzbEk","size12":"Checkbox_size-12__ASr3R"};
|
|
490
514
|
|
|
491
515
|
var _path$e;
|
|
492
516
|
function _extends$g() { _extends$g = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$g.apply(this, arguments); }
|
|
493
517
|
var SvgCheck12 = function SvgCheck12(props, ref) {
|
|
494
|
-
return /*#__PURE__*/
|
|
518
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$g({
|
|
495
519
|
width: 12,
|
|
496
520
|
height: 12,
|
|
497
521
|
viewBox: "0 0 12 12",
|
|
498
522
|
xmlns: "http://www.w3.org/2000/svg",
|
|
499
523
|
ref: ref
|
|
500
|
-
}, props), _path$e || (_path$e = /*#__PURE__*/
|
|
524
|
+
}, props), _path$e || (_path$e = /*#__PURE__*/React__namespace.createElement("path", {
|
|
501
525
|
fillRule: "evenodd",
|
|
502
526
|
d: "M9.491 3.449 10.51 4.55 5.663 9.024 2.487 6.047l1.026-1.094L5.67 6.975z"
|
|
503
527
|
})));
|
|
504
528
|
};
|
|
505
|
-
var ForwardRef$g = /*#__PURE__*/forwardRef(SvgCheck12);
|
|
529
|
+
var ForwardRef$g = /*#__PURE__*/React.forwardRef(SvgCheck12);
|
|
506
530
|
|
|
507
531
|
var _path$d;
|
|
508
532
|
function _extends$f() { _extends$f = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$f.apply(this, arguments); }
|
|
509
533
|
var SvgCheck18 = function SvgCheck18(props, ref) {
|
|
510
|
-
return /*#__PURE__*/
|
|
534
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$f({
|
|
511
535
|
width: 18,
|
|
512
536
|
height: 18,
|
|
513
537
|
viewBox: "0 0 18 18",
|
|
514
538
|
xmlns: "http://www.w3.org/2000/svg",
|
|
515
539
|
ref: ref
|
|
516
|
-
}, props), _path$d || (_path$d = /*#__PURE__*/
|
|
540
|
+
}, props), _path$d || (_path$d = /*#__PURE__*/React__namespace.createElement("path", {
|
|
517
541
|
fillRule: "evenodd",
|
|
518
542
|
d: "m14.247 4.341 1.506 1.318-7.704 8.804-4.756-4.756 1.414-1.414 3.244 3.243z"
|
|
519
543
|
})));
|
|
520
544
|
};
|
|
521
|
-
var ForwardRef$f = /*#__PURE__*/forwardRef(SvgCheck18);
|
|
545
|
+
var ForwardRef$f = /*#__PURE__*/React.forwardRef(SvgCheck18);
|
|
522
546
|
|
|
523
547
|
var _path$c;
|
|
524
548
|
function _extends$e() { _extends$e = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$e.apply(this, arguments); }
|
|
525
549
|
var SvgPartlySelect12 = function SvgPartlySelect12(props, ref) {
|
|
526
|
-
return /*#__PURE__*/
|
|
550
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$e({
|
|
527
551
|
width: 12,
|
|
528
552
|
height: 12,
|
|
529
553
|
viewBox: "0 0 12 12",
|
|
530
554
|
xmlns: "http://www.w3.org/2000/svg",
|
|
531
555
|
ref: ref
|
|
532
|
-
}, props), _path$c || (_path$c = /*#__PURE__*/
|
|
556
|
+
}, props), _path$c || (_path$c = /*#__PURE__*/React__namespace.createElement("path", {
|
|
533
557
|
fillRule: "evenodd",
|
|
534
558
|
d: "M9 5v2H3V5z"
|
|
535
559
|
})));
|
|
536
560
|
};
|
|
537
|
-
var ForwardRef$e = /*#__PURE__*/forwardRef(SvgPartlySelect12);
|
|
561
|
+
var ForwardRef$e = /*#__PURE__*/React.forwardRef(SvgPartlySelect12);
|
|
538
562
|
|
|
539
563
|
var _path$b;
|
|
540
564
|
function _extends$d() { _extends$d = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$d.apply(this, arguments); }
|
|
541
565
|
var SvgPartlySelect18 = function SvgPartlySelect18(props, ref) {
|
|
542
|
-
return /*#__PURE__*/
|
|
566
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$d({
|
|
543
567
|
width: 18,
|
|
544
568
|
height: 18,
|
|
545
569
|
viewBox: "0 0 18 18",
|
|
546
570
|
xmlns: "http://www.w3.org/2000/svg",
|
|
547
571
|
ref: ref
|
|
548
|
-
}, props), _path$b || (_path$b = /*#__PURE__*/
|
|
572
|
+
}, props), _path$b || (_path$b = /*#__PURE__*/React__namespace.createElement("path", {
|
|
549
573
|
fillRule: "evenodd",
|
|
550
574
|
d: "M14 8v2H4V8z"
|
|
551
575
|
})));
|
|
552
576
|
};
|
|
553
|
-
var ForwardRef$d = /*#__PURE__*/forwardRef(SvgPartlySelect18);
|
|
577
|
+
var ForwardRef$d = /*#__PURE__*/React.forwardRef(SvgPartlySelect18);
|
|
554
578
|
|
|
555
579
|
function applyCheckboxMods(mods) {
|
|
556
580
|
return [
|
|
@@ -559,7 +583,7 @@ function applyCheckboxMods(mods) {
|
|
|
559
583
|
css$x['size-' + (mods.size || '18')],
|
|
560
584
|
];
|
|
561
585
|
}
|
|
562
|
-
const Checkbox = withMods(Checkbox
|
|
586
|
+
const Checkbox = uuiCore.withMods(uuiComponents.Checkbox, applyCheckboxMods, (props) => ({
|
|
563
587
|
icon: (props.size === '12') ? ForwardRef$g : ForwardRef$f,
|
|
564
588
|
indeterminateIcon: (props.size === '12') ? ForwardRef$e : ForwardRef$d,
|
|
565
589
|
}));
|
|
@@ -569,19 +593,19 @@ var css$w = {"root":"RadioInput_root__wxJgt","size-18":"RadioInput_size-18__csI3
|
|
|
569
593
|
var _circle;
|
|
570
594
|
function _extends$c() { _extends$c = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$c.apply(this, arguments); }
|
|
571
595
|
var SvgRadioPoint = function SvgRadioPoint(props, ref) {
|
|
572
|
-
return /*#__PURE__*/
|
|
596
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$c({
|
|
573
597
|
width: 18,
|
|
574
598
|
height: 18,
|
|
575
599
|
viewBox: "0 0 18 18",
|
|
576
600
|
xmlns: "http://www.w3.org/2000/svg",
|
|
577
601
|
ref: ref
|
|
578
|
-
}, props), _circle || (_circle = /*#__PURE__*/
|
|
602
|
+
}, props), _circle || (_circle = /*#__PURE__*/React__namespace.createElement("circle", {
|
|
579
603
|
cx: 9,
|
|
580
604
|
cy: 9,
|
|
581
605
|
r: 6
|
|
582
606
|
})));
|
|
583
607
|
};
|
|
584
|
-
var ForwardRef$c = /*#__PURE__*/forwardRef(SvgRadioPoint);
|
|
608
|
+
var ForwardRef$c = /*#__PURE__*/React.forwardRef(SvgRadioPoint);
|
|
585
609
|
|
|
586
610
|
function applyRadioInputMods(mods) {
|
|
587
611
|
return [
|
|
@@ -590,7 +614,7 @@ function applyRadioInputMods(mods) {
|
|
|
590
614
|
css$w['size-' + (mods.size || '18')],
|
|
591
615
|
];
|
|
592
616
|
}
|
|
593
|
-
const RadioInput = withMods(RadioInput
|
|
617
|
+
const RadioInput = uuiCore.withMods(uuiComponents.RadioInput, applyRadioInputMods, () => ({ icon: ForwardRef$c }));
|
|
594
618
|
|
|
595
619
|
var css$v = {"root":"Switch_root__q-6Iy","size-12":"Switch_size-12__7-pqh","size-18":"Switch_size-18__l3E-E","size-24":"Switch_size-24__DmaSh","size12":"Switch_size-12__7-pqh","size18":"Switch_size-18__l3E-E","size24":"Switch_size-24__DmaSh"};
|
|
596
620
|
|
|
@@ -601,7 +625,7 @@ function applySwitchMods(mods) {
|
|
|
601
625
|
css$v['size-' + (mods.size || '18')],
|
|
602
626
|
];
|
|
603
627
|
}
|
|
604
|
-
const Switch = withMods(Switch
|
|
628
|
+
const Switch = uuiCore.withMods(uuiComponents.Switch, applySwitchMods);
|
|
605
629
|
|
|
606
630
|
const allButtonModes = ['solid', 'outline', 'ghost', 'none'];
|
|
607
631
|
const allSizes = ['24', '30', '36', '42', '48'];
|
|
@@ -609,16 +633,16 @@ const allRowSizes = [null, '24', '30', '36', '42', '48'];
|
|
|
609
633
|
const allEpamSemanticColors = ['accent', 'primary', 'secondary', 'negative'];
|
|
610
634
|
const allTextSizes = ['18', '24', '30', '36', '48'];
|
|
611
635
|
const allFontStyles = ['regular', 'semibold', 'italic', 'primary', 'promo'];
|
|
612
|
-
|
|
636
|
+
exports.EditMode = void 0;
|
|
613
637
|
(function (EditMode) {
|
|
614
638
|
EditMode["FORM"] = "form";
|
|
615
639
|
EditMode["CELL"] = "cell";
|
|
616
|
-
})(EditMode || (EditMode = {}));
|
|
640
|
+
})(exports.EditMode || (exports.EditMode = {}));
|
|
617
641
|
|
|
618
642
|
var css$u = {"root":"TextInput_root__UKzkT","mode-form":"TextInput_mode-form__JsK1y","mode-cell":"TextInput_mode-cell__H2C-f","size-24":"TextInput_size-24__buGZm","size-30":"TextInput_size-30__G0e43","size-36":"TextInput_size-36__bOehk","size-42":"TextInput_size-42__5Gdbv","size-48":"TextInput_size-48__Eb1Xy","modeForm":"TextInput_mode-form__JsK1y","modeCell":"TextInput_mode-cell__H2C-f","size24":"TextInput_size-24__buGZm","size30":"TextInput_size-30__G0e43","size36":"TextInput_size-36__bOehk","size42":"TextInput_size-42__5Gdbv","size48":"TextInput_size-48__Eb1Xy"};
|
|
619
643
|
|
|
620
644
|
const defaultSize$5 = '36';
|
|
621
|
-
const defaultMode$1 = EditMode.FORM;
|
|
645
|
+
const defaultMode$1 = exports.EditMode.FORM;
|
|
622
646
|
function applyTextInputMods(mods) {
|
|
623
647
|
return [
|
|
624
648
|
'text-input-vars',
|
|
@@ -627,17 +651,17 @@ function applyTextInputMods(mods) {
|
|
|
627
651
|
css$u['mode-' + (mods.mode || defaultMode$1)],
|
|
628
652
|
];
|
|
629
653
|
}
|
|
630
|
-
const TextInput = withMods(TextInput
|
|
654
|
+
const TextInput = uuiCore.withMods(uuiComponents.TextInput, applyTextInputMods, (props) => ({
|
|
631
655
|
acceptIcon: systemIcons[props.size || defaultSize$5].accept,
|
|
632
656
|
cancelIcon: systemIcons[props.size || defaultSize$5].clear,
|
|
633
657
|
dropdownIcon: systemIcons[props.size || defaultSize$5].foldingArrow,
|
|
634
658
|
}));
|
|
635
|
-
class SearchInput extends
|
|
659
|
+
class SearchInput extends React__namespace.default.Component {
|
|
636
660
|
render() {
|
|
637
661
|
// analytics events are sending in IEditableDebouncer, so we need to avoid sending events in TextInput
|
|
638
662
|
const textInputProps = Object.assign({}, this.props);
|
|
639
663
|
delete textInputProps.getValueChangeAnalyticsEvent;
|
|
640
|
-
return
|
|
664
|
+
return React__namespace.default.createElement(uuiCore.IEditableDebouncer, Object.assign({}, this.props, { render: (iEditable => React__namespace.default.createElement(TextInput, Object.assign({ icon: systemIcons[this.props.size || defaultSize$5].search, onCancel: !!this.props.value ? (() => iEditable.onValueChange('')) : undefined, type: "search", inputMode: "search" }, textInputProps, iEditable))) }));
|
|
641
665
|
}
|
|
642
666
|
}
|
|
643
667
|
|
|
@@ -651,21 +675,21 @@ function applyAccordionMods(mods) {
|
|
|
651
675
|
mods.padding && css$t['padding-' + mods.padding],
|
|
652
676
|
];
|
|
653
677
|
}
|
|
654
|
-
const Accordion = withMods(Accordion
|
|
678
|
+
const Accordion = uuiCore.withMods(uuiComponents.Accordion, applyAccordionMods, (mods) => ({
|
|
655
679
|
dropdownIcon: mods.dropdownIcon !== null && systemIcons[mods.mode === 'block' ? '60' : '30'].foldingArrow,
|
|
656
680
|
}));
|
|
657
681
|
|
|
658
682
|
var css$s = {"root":"ControlGroup_root__wOZ9-"};
|
|
659
683
|
|
|
660
|
-
const ControlGroup = withMods(ControlGroup
|
|
684
|
+
const ControlGroup = uuiCore.withMods(uuiComponents.ControlGroup, () => [css$s.root]);
|
|
661
685
|
|
|
662
686
|
var css$r = {"root":"FlexRow_root__8pevZ","top-shadow":"FlexRow_top-shadow__yLJfa","size-24":"FlexRow_size-24__UC-Ra","size-30":"FlexRow_size-30__KKsZ5","size-36":"FlexRow_size-36__oVCZp","size-42":"FlexRow_size-42__n5Pxh","size-48":"FlexRow_size-48__N-bVM","padding-6":"FlexRow_padding-6__TyXUB","padding-12":"FlexRow_padding-12__NiZVt","padding-18":"FlexRow_padding-18__f-DJ9","padding-24":"FlexRow_padding-24__aVQje","margin-24":"FlexRow_margin-24__W8cmr","margin-12":"FlexRow_margin-12__Tt04l","vPadding-12":"FlexRow_vPadding-12__f3sn6","vPadding-18":"FlexRow_vPadding-18__7Ljl4","vPadding-24":"FlexRow_vPadding-24__nJLBC","vPadding-36":"FlexRow_vPadding-36__7E6EY","vPadding-48":"FlexRow_vPadding-48__zzaPF","spacing-6":"FlexRow_spacing-6__l7a8O","spacing-12":"FlexRow_spacing-12__8ToPe","spacing-18":"FlexRow_spacing-18__QdC3L","border-bottom":"FlexRow_border-bottom__5L1Xk","topShadow":"FlexRow_top-shadow__yLJfa","size24":"FlexRow_size-24__UC-Ra","size30":"FlexRow_size-30__KKsZ5","size36":"FlexRow_size-36__oVCZp","size42":"FlexRow_size-42__n5Pxh","size48":"FlexRow_size-48__N-bVM","padding6":"FlexRow_padding-6__TyXUB","padding12":"FlexRow_padding-12__NiZVt","padding18":"FlexRow_padding-18__f-DJ9","padding24":"FlexRow_padding-24__aVQje","margin24":"FlexRow_margin-24__W8cmr","margin12":"FlexRow_margin-12__Tt04l","vPadding12":"FlexRow_vPadding-12__f3sn6","vPadding18":"FlexRow_vPadding-18__7Ljl4","vPadding24":"FlexRow_vPadding-24__nJLBC","vPadding36":"FlexRow_vPadding-36__7E6EY","vPadding48":"FlexRow_vPadding-48__zzaPF","spacing6":"FlexRow_spacing-6__l7a8O","spacing12":"FlexRow_spacing-12__8ToPe","spacing18":"FlexRow_spacing-18__QdC3L","borderBottom":"FlexRow_border-bottom__5L1Xk"};
|
|
663
687
|
|
|
664
|
-
const FlexCell = withMods(FlexCell
|
|
688
|
+
const FlexCell = uuiCore.withMods(uuiComponents.FlexCell, props => [
|
|
665
689
|
css$r.flexCell,
|
|
666
690
|
]);
|
|
667
691
|
|
|
668
|
-
const FlexRow = withMods(FlexRow
|
|
692
|
+
const FlexRow = uuiCore.withMods(uuiComponents.FlexRow, props => {
|
|
669
693
|
return [
|
|
670
694
|
css$r.root,
|
|
671
695
|
props.size !== null && css$r['size-' + (props.size || '36')],
|
|
@@ -678,11 +702,11 @@ const FlexRow = withMods(FlexRow$1, props => {
|
|
|
678
702
|
];
|
|
679
703
|
});
|
|
680
704
|
|
|
681
|
-
const FlexSpacer = FlexSpacer
|
|
705
|
+
const FlexSpacer = uuiComponents.FlexSpacer;
|
|
682
706
|
|
|
683
707
|
var css$q = {"root":"Panel_root__Ue9u5","background":"Panel_background__thbKB","margin-24":"Panel_margin-24__EZfwq","padding-12":"Panel_padding-12__zmnQV","padding-24":"Panel_padding-24__mOtka","shadow":"Panel_shadow__lMI9N","margin24":"Panel_margin-24__EZfwq","padding12":"Panel_padding-12__zmnQV","padding24":"Panel_padding-24__mOtka"};
|
|
684
708
|
|
|
685
|
-
const Panel = withMods(VPanel, props => [
|
|
709
|
+
const Panel = uuiCore.withMods(uuiComponents.VPanel, props => [
|
|
686
710
|
'panel-vars',
|
|
687
711
|
css$q.root,
|
|
688
712
|
props.shadow && css$q.shadow,
|
|
@@ -698,11 +722,11 @@ function applyIconContainerMods(mods) {
|
|
|
698
722
|
css$p.root,
|
|
699
723
|
];
|
|
700
724
|
}
|
|
701
|
-
const IconContainer = withMods(IconContainer
|
|
725
|
+
const IconContainer = uuiCore.withMods(uuiComponents.IconContainer, applyIconContainerMods, () => ({ tabIndex: 0 }));
|
|
702
726
|
|
|
703
|
-
class Dropdown extends
|
|
727
|
+
class Dropdown extends React__namespace.Component {
|
|
704
728
|
render() {
|
|
705
|
-
return (
|
|
729
|
+
return (React__namespace.createElement(uuiComponents.Dropdown, Object.assign({}, this.props)));
|
|
706
730
|
}
|
|
707
731
|
}
|
|
708
732
|
|
|
@@ -714,7 +738,7 @@ function applyDropdownContainerMods(mods) {
|
|
|
714
738
|
css$o.root,
|
|
715
739
|
];
|
|
716
740
|
}
|
|
717
|
-
const DropdownContainer = withMods(DropdownContainer
|
|
741
|
+
const DropdownContainer = uuiCore.withMods(uuiComponents.DropdownContainer, applyDropdownContainerMods);
|
|
718
742
|
|
|
719
743
|
var css$n = {"menuRoot":"DropdownMenu_menuRoot__gRW4S","bodyRoot":"DropdownMenu_bodyRoot__hAgqI","submenuRootItem":"DropdownMenu_submenuRootItem__52Bxy","iconAfter":"DropdownMenu_iconAfter__Hbijr","iconCheck":"DropdownMenu_iconCheck__TtmI6","splitterRoot":"DropdownMenu_splitterRoot__mJGU2","splitter":"DropdownMenu_splitter__7AuFo","headerRoot":"DropdownMenu_headerRoot__iEVUM","itemRoot":"DropdownMenu_itemRoot__mBMPU","icon":"DropdownMenu_icon__YE2-L","link":"DropdownMenu_link__pgNjs"};
|
|
720
744
|
|
|
@@ -728,10 +752,10 @@ const DropdownControlKeys = {
|
|
|
728
752
|
DOWN_ARROW: 'ArrowDown',
|
|
729
753
|
};
|
|
730
754
|
const DropdownMenuContainer = (props) => {
|
|
731
|
-
const menuRef = useRef(null);
|
|
732
|
-
const [currentlyFocused, setFocused] = useState(-1);
|
|
733
|
-
const menuItems = menuRef.current ? Array.from(menuRef.current.querySelectorAll(`[role="menuitem"]:not(.${uuiMod.disabled})`)) : [];
|
|
734
|
-
useEffect(() => {
|
|
755
|
+
const menuRef = React.useRef(null);
|
|
756
|
+
const [currentlyFocused, setFocused] = React.useState(-1);
|
|
757
|
+
const menuItems = menuRef.current ? Array.from(menuRef.current.querySelectorAll(`[role="menuitem"]:not(.${uuiCore.uuiMod.disabled})`)) : [];
|
|
758
|
+
React.useEffect(() => {
|
|
735
759
|
var _a;
|
|
736
760
|
(_a = menuRef.current) === null || _a === void 0 ? void 0 : _a.focus();
|
|
737
761
|
}, [menuRef.current]);
|
|
@@ -754,12 +778,12 @@ const DropdownMenuContainer = (props) => {
|
|
|
754
778
|
props.onClose();
|
|
755
779
|
}
|
|
756
780
|
};
|
|
757
|
-
return (
|
|
758
|
-
|
|
781
|
+
return (React__namespace.default.createElement(FocusLock__default.default, { as: "menu", className: css$n.menuRoot, returnFocus: true, autoFocus: false, ref: menuRef, lockProps: { onKeyDown: handleArrowKeys, tabIndex: -1 } },
|
|
782
|
+
React__namespace.default.createElement(uuiComponents.DropdownContainer, Object.assign({}, props, { rawProps: { tabIndex: -1 } }))));
|
|
759
783
|
};
|
|
760
|
-
const DropdownMenuBody = withMods(DropdownMenuContainer, () => [css$n.bodyRoot], ({ style }) => ({ style }));
|
|
784
|
+
const DropdownMenuBody = uuiCore.withMods(DropdownMenuContainer, () => [css$n.bodyRoot], ({ style }) => ({ style }));
|
|
761
785
|
const DropdownMenuButton = (props) => {
|
|
762
|
-
const context = useContext(UuiContext);
|
|
786
|
+
const context = React.useContext(uuiCore.UuiContext);
|
|
763
787
|
const { icon, iconPosition, caption, isDisabled, isSelected, link, href, onClick, toggleDropdownOpening, isDropdown, target } = props;
|
|
764
788
|
const handleClick = (event) => {
|
|
765
789
|
if (isDisabled || !onClick)
|
|
@@ -778,32 +802,32 @@ const DropdownMenuButton = (props) => {
|
|
|
778
802
|
const getMenuButtonContent = () => {
|
|
779
803
|
const isIconBefore = Boolean(icon && iconPosition !== "right");
|
|
780
804
|
const isIconAfter = Boolean(icon && iconPosition === "right");
|
|
781
|
-
const iconElement =
|
|
782
|
-
return
|
|
805
|
+
const iconElement = React__namespace.default.createElement(uuiComponents.IconContainer, { icon: icon, cx: uuiCore.cx(css$n.icon, iconPosition === "right" ? css$n.iconAfter : css$n.iconBefore) });
|
|
806
|
+
return React__namespace.default.createElement(React__namespace.default.Fragment, null,
|
|
783
807
|
isIconBefore && iconElement,
|
|
784
|
-
|
|
785
|
-
isIconAfter &&
|
|
786
|
-
|
|
808
|
+
React__namespace.default.createElement(uuiComponents.Text, { cx: css$n.caption }, caption),
|
|
809
|
+
isIconAfter && React__namespace.default.createElement(React__namespace.default.Fragment, null,
|
|
810
|
+
React__namespace.default.createElement(uuiComponents.FlexSpacer, null),
|
|
787
811
|
iconElement));
|
|
788
812
|
};
|
|
789
813
|
const isAnchor = Boolean(link || href);
|
|
790
|
-
const itemClassNames = cx(props.cx, css$n.itemRoot, isDisabled && uuiMod.disabled, isSelected && uuiMod.selected);
|
|
791
|
-
return isAnchor ? (
|
|
814
|
+
const itemClassNames = uuiCore.cx(props.cx, css$n.itemRoot, isDisabled && uuiCore.uuiMod.disabled, isSelected && uuiCore.uuiMod.selected);
|
|
815
|
+
return isAnchor ? (React__namespace.default.createElement(uuiComponents.Anchor, { cx: uuiCore.cx(css$n.link, itemClassNames), link: link, href: href, rawProps: { role: 'menuitem', tabIndex: isDisabled ? -1 : 0 }, onClick: handleClick, isDisabled: isDisabled, target: target }, getMenuButtonContent())) : (React__namespace.default.createElement(uuiComponents.FlexRow, { rawProps: {
|
|
792
816
|
tabIndex: isDisabled ? -1 : 0,
|
|
793
817
|
role: 'menuitem',
|
|
794
818
|
onKeyDown: isDisabled ? null : handleOpenDropdown,
|
|
795
819
|
}, cx: itemClassNames, onClick: handleClick }, getMenuButtonContent()));
|
|
796
820
|
};
|
|
797
821
|
DropdownMenuButton.displayName = 'DropdownMenuButton';
|
|
798
|
-
const DropdownMenuSplitter = (props) => (
|
|
799
|
-
|
|
800
|
-
const DropdownMenuHeader = (props) => (
|
|
801
|
-
|
|
822
|
+
const DropdownMenuSplitter = (props) => (React__namespace.default.createElement("div", { className: uuiCore.cx(props.cx, css$n.splitterRoot) },
|
|
823
|
+
React__namespace.default.createElement("hr", { className: css$n.splitter })));
|
|
824
|
+
const DropdownMenuHeader = (props) => (React__namespace.default.createElement("div", { className: uuiCore.cx(props.cx, css$n.headerRoot) },
|
|
825
|
+
React__namespace.default.createElement("span", { className: css$n.header }, props.caption)));
|
|
802
826
|
const DropdownSubMenu = (props) => {
|
|
803
|
-
return (
|
|
827
|
+
return (React__namespace.default.createElement(uuiComponents.Dropdown, { openOnHover: props.openOnHover || true, closeOnMouseLeave: "boundary", placement: "right-start", renderBody: (props) => (React__namespace.default.createElement(DropdownMenuBody, Object.assign({ closeOnKey: DropdownControlKeys.LEFT_ARROW }, props))), renderTarget: ({ toggleDropdownOpening }) => (React__namespace.default.createElement(DropdownMenuButton, Object.assign({ cx: uuiCore.cx(css$n.submenuRootItem), icon: icons.foldingArrow, iconPosition: "right", isDropdown: true, toggleDropdownOpening: toggleDropdownOpening }, props))) }));
|
|
804
828
|
};
|
|
805
829
|
const DropdownMenuSwitchButton = (props) => {
|
|
806
|
-
const context = useContext(UuiContext);
|
|
830
|
+
const context = React.useContext(uuiCore.UuiContext);
|
|
807
831
|
const { icon, caption, isDisabled, isSelected, onValueChange, } = props;
|
|
808
832
|
const onHandleValueChange = (value) => {
|
|
809
833
|
if (isDisabled || !onValueChange)
|
|
@@ -816,11 +840,11 @@ const DropdownMenuSwitchButton = (props) => {
|
|
|
816
840
|
onHandleValueChange(!isSelected);
|
|
817
841
|
}
|
|
818
842
|
};
|
|
819
|
-
return (
|
|
820
|
-
icon &&
|
|
821
|
-
|
|
822
|
-
|
|
823
|
-
|
|
843
|
+
return (React__namespace.default.createElement(uuiComponents.FlexRow, { cx: uuiCore.cx(props.cx, css$n.itemRoot, isDisabled && uuiCore.uuiMod.disabled), onClick: () => onHandleValueChange(!isSelected), rawProps: { role: 'menuitem', onKeyDown: handleKeySelect, tabIndex: isDisabled ? -1 : 0 } },
|
|
844
|
+
icon && React__namespace.default.createElement(uuiComponents.IconContainer, { icon: icon, cx: css$n.iconBefore }),
|
|
845
|
+
React__namespace.default.createElement(uuiComponents.Text, { cx: css$n.caption }, caption),
|
|
846
|
+
React__namespace.default.createElement(uuiComponents.FlexSpacer, null),
|
|
847
|
+
React__namespace.default.createElement(Switch, { value: isSelected, tabIndex: -1, onValueChange: onHandleValueChange })));
|
|
824
848
|
};
|
|
825
849
|
|
|
826
850
|
var css$m = {"root":"Text_root__iUAW9"};
|
|
@@ -868,13 +892,13 @@ function applyTextMods(mods) {
|
|
|
868
892
|
css$m.root,
|
|
869
893
|
].concat(textClasses);
|
|
870
894
|
}
|
|
871
|
-
const Text = withMods(Text
|
|
895
|
+
const Text = uuiCore.withMods(uuiComponents.Text, applyTextMods);
|
|
872
896
|
|
|
873
897
|
var css$k = {"container":"TextPlaceholder_container__Jn60D","loading-word":"TextPlaceholder_loading-word__22WpS","animated-loading":"TextPlaceholder_animated-loading__ao75r","skeleton_loading":"TextPlaceholder_skeleton_loading__NzV8h","loadingWord":"TextPlaceholder_loading-word__22WpS","animatedLoading":"TextPlaceholder_animated-loading__ao75r","skeletonLoading":"TextPlaceholder_skeleton_loading__NzV8h"};
|
|
874
898
|
|
|
875
899
|
const TextPlaceholder = (props) => {
|
|
876
900
|
const pattern = `0`;
|
|
877
|
-
const text =
|
|
901
|
+
const text = React__namespace.useMemo(() => {
|
|
878
902
|
const words = [];
|
|
879
903
|
for (let i = 0; i < (props.wordsCount || 1); i++) {
|
|
880
904
|
let lengthWord = Math.floor(Math.random() * 10 + 8);
|
|
@@ -882,7 +906,7 @@ const TextPlaceholder = (props) => {
|
|
|
882
906
|
}
|
|
883
907
|
return words;
|
|
884
908
|
}, [props.wordsCount]);
|
|
885
|
-
return (
|
|
909
|
+
return (React__namespace.createElement("div", { "aria-busy": true, className: css$k.container }, text.map((it, index) => (React__namespace.createElement("span", { key: index, className: cx__default.default([
|
|
886
910
|
'text-placeholder-vars',
|
|
887
911
|
css$k.loadingWord,
|
|
888
912
|
!props.isNotAnimated && css$k.animatedLoading,
|
|
@@ -892,46 +916,46 @@ const TextPlaceholder = (props) => {
|
|
|
892
916
|
var _path$a;
|
|
893
917
|
function _extends$b() { _extends$b = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$b.apply(this, arguments); }
|
|
894
918
|
var SvgNavigationClose24$1 = function SvgNavigationClose24(props, ref) {
|
|
895
|
-
return /*#__PURE__*/
|
|
919
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$b({
|
|
896
920
|
xmlns: "http://www.w3.org/2000/svg",
|
|
897
921
|
width: 24,
|
|
898
922
|
height: 24,
|
|
899
923
|
viewBox: "0 0 24 24",
|
|
900
924
|
ref: ref
|
|
901
|
-
}, props), _path$a || (_path$a = /*#__PURE__*/
|
|
925
|
+
}, props), _path$a || (_path$a = /*#__PURE__*/React__namespace.createElement("path", {
|
|
902
926
|
fillRule: "evenodd",
|
|
903
927
|
d: "M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
|
|
904
928
|
})));
|
|
905
929
|
};
|
|
906
|
-
var ForwardRef$b = /*#__PURE__*/forwardRef(SvgNavigationClose24$1);
|
|
930
|
+
var ForwardRef$b = /*#__PURE__*/React.forwardRef(SvgNavigationClose24$1);
|
|
907
931
|
|
|
908
932
|
var css$j = {"modal-blocker":"Modals_modal-blocker__nCAZ7","animateModalBlocker":"Modals_animateModalBlocker__S-4dL","blocker-overlay":"Modals_blocker-overlay__1uHVd","modal":"Modals_modal__m41wI","modal-footer":"Modals_modal-footer__gg-90","border-top":"Modals_border-top__cfzhv","modal-header":"Modals_modal-header__8aswP","modalBlocker":"Modals_modal-blocker__nCAZ7","blockerOverlay":"Modals_blocker-overlay__1uHVd","modalFooter":"Modals_modal-footer__gg-90","borderTop":"Modals_border-top__cfzhv","modalHeader":"Modals_modal-header__8aswP"};
|
|
909
933
|
|
|
910
|
-
const ModalBlocker = withMods(ModalBlocker
|
|
934
|
+
const ModalBlocker = uuiCore.withMods(uuiComponents.ModalBlocker, mods => [
|
|
911
935
|
'modals-vars',
|
|
912
936
|
css$j.modalBlocker,
|
|
913
937
|
mods.overlay && css$j['blocker-overlay'],
|
|
914
938
|
]);
|
|
915
|
-
const ModalWindow = withMods(ModalWindow
|
|
939
|
+
const ModalWindow = uuiCore.withMods(uuiComponents.ModalWindow, () => ['modals-vars', css$j.modal], props => ({ rawProps: {
|
|
916
940
|
style: {
|
|
917
941
|
width: `${props.width || 480}px`,
|
|
918
942
|
height: props.height ? `${props.height}px` : '',
|
|
919
943
|
},
|
|
920
944
|
},
|
|
921
945
|
}));
|
|
922
|
-
class ModalHeader extends
|
|
946
|
+
class ModalHeader extends React__namespace.Component {
|
|
923
947
|
render() {
|
|
924
|
-
return (
|
|
925
|
-
this.props.title &&
|
|
948
|
+
return (React__namespace.createElement(FlexRow, { padding: this.props.padding || '24', vPadding: '12', borderBottom: true, cx: ['modals-vars', css$j.modalHeader, this.props.cx], spacing: '12', rawProps: this.props.rawProps },
|
|
949
|
+
this.props.title && React__namespace.createElement(Text, { size: '48', fontSize: '18', font: 'semibold' }, this.props.title),
|
|
926
950
|
this.props.children,
|
|
927
|
-
this.props.onClose &&
|
|
928
|
-
this.props.onClose &&
|
|
929
|
-
|
|
951
|
+
this.props.onClose && React__namespace.createElement(FlexSpacer, null),
|
|
952
|
+
this.props.onClose && React__namespace.createElement(FlexCell, { shrink: 0, width: 'auto' },
|
|
953
|
+
React__namespace.createElement(IconButton, { icon: ForwardRef$b, onClick: this.props.onClose }))));
|
|
930
954
|
}
|
|
931
955
|
}
|
|
932
|
-
class ModalFooter extends
|
|
956
|
+
class ModalFooter extends React__namespace.Component {
|
|
933
957
|
render() {
|
|
934
|
-
return (
|
|
958
|
+
return (React__namespace.createElement(FlexRow, { spacing: this.props.spacing || '12', cx: ['modals-vars', css$j.modalFooter, this.props.borderTop && css$j.borderTop, this.props.cx], padding: this.props.padding || '24', vPadding: this.props.vPadding || '24', rawProps: this.props.rawProps }, this.props.children));
|
|
935
959
|
}
|
|
936
960
|
}
|
|
937
961
|
|
|
@@ -989,86 +1013,86 @@ const i18n = {
|
|
|
989
1013
|
var _path$9;
|
|
990
1014
|
function _extends$a() { _extends$a = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$a.apply(this, arguments); }
|
|
991
1015
|
var SvgNotificationCheckCircleFill24 = function SvgNotificationCheckCircleFill24(props, ref) {
|
|
992
|
-
return /*#__PURE__*/
|
|
1016
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$a({
|
|
993
1017
|
xmlns: "http://www.w3.org/2000/svg",
|
|
994
1018
|
width: 24,
|
|
995
1019
|
height: 24,
|
|
996
1020
|
viewBox: "0 0 24 24",
|
|
997
1021
|
ref: ref
|
|
998
|
-
}, props), _path$9 || (_path$9 = /*#__PURE__*/
|
|
1022
|
+
}, props), _path$9 || (_path$9 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
999
1023
|
fillRule: "evenodd",
|
|
1000
1024
|
d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"
|
|
1001
1025
|
})));
|
|
1002
1026
|
};
|
|
1003
|
-
var ForwardRef$a = /*#__PURE__*/forwardRef(SvgNotificationCheckCircleFill24);
|
|
1027
|
+
var ForwardRef$a = /*#__PURE__*/React.forwardRef(SvgNotificationCheckCircleFill24);
|
|
1004
1028
|
|
|
1005
1029
|
var _path$8;
|
|
1006
1030
|
function _extends$9() { _extends$9 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$9.apply(this, arguments); }
|
|
1007
1031
|
var SvgNotificationWarningFill24 = function SvgNotificationWarningFill24(props, ref) {
|
|
1008
|
-
return /*#__PURE__*/
|
|
1032
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$9({
|
|
1009
1033
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1010
1034
|
width: 24,
|
|
1011
1035
|
height: 24,
|
|
1012
1036
|
viewBox: "0 0 24 24",
|
|
1013
1037
|
ref: ref
|
|
1014
|
-
}, props), _path$8 || (_path$8 = /*#__PURE__*/
|
|
1038
|
+
}, props), _path$8 || (_path$8 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1015
1039
|
fillRule: "evenodd",
|
|
1016
1040
|
d: "M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z"
|
|
1017
1041
|
})));
|
|
1018
1042
|
};
|
|
1019
|
-
var ForwardRef$9 = /*#__PURE__*/forwardRef(SvgNotificationWarningFill24);
|
|
1043
|
+
var ForwardRef$9 = /*#__PURE__*/React.forwardRef(SvgNotificationWarningFill24);
|
|
1020
1044
|
|
|
1021
1045
|
var _path$7;
|
|
1022
1046
|
function _extends$8() { _extends$8 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$8.apply(this, arguments); }
|
|
1023
1047
|
var SvgNotificationErrorFill24 = function SvgNotificationErrorFill24(props, ref) {
|
|
1024
|
-
return /*#__PURE__*/
|
|
1048
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$8({
|
|
1025
1049
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1026
1050
|
width: 24,
|
|
1027
1051
|
height: 24,
|
|
1028
1052
|
viewBox: "0 0 24 24",
|
|
1029
1053
|
ref: ref
|
|
1030
|
-
}, props), _path$7 || (_path$7 = /*#__PURE__*/
|
|
1054
|
+
}, props), _path$7 || (_path$7 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1031
1055
|
fillRule: "evenodd",
|
|
1032
1056
|
d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z"
|
|
1033
1057
|
})));
|
|
1034
1058
|
};
|
|
1035
|
-
var ForwardRef$8 = /*#__PURE__*/forwardRef(SvgNotificationErrorFill24);
|
|
1059
|
+
var ForwardRef$8 = /*#__PURE__*/React.forwardRef(SvgNotificationErrorFill24);
|
|
1036
1060
|
|
|
1037
1061
|
var _path$6;
|
|
1038
1062
|
function _extends$7() { _extends$7 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$7.apply(this, arguments); }
|
|
1039
1063
|
var SvgNotificationHelpFill24 = function SvgNotificationHelpFill24(props, ref) {
|
|
1040
|
-
return /*#__PURE__*/
|
|
1064
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$7({
|
|
1041
1065
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1042
1066
|
width: 24,
|
|
1043
1067
|
height: 24,
|
|
1044
1068
|
viewBox: "0 0 24 24",
|
|
1045
1069
|
ref: ref
|
|
1046
|
-
}, props), _path$6 || (_path$6 = /*#__PURE__*/
|
|
1070
|
+
}, props), _path$6 || (_path$6 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1047
1071
|
fillRule: "evenodd",
|
|
1048
1072
|
d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 17h-2v-2h2v2zm2.07-7.75-.9.92C13.45 12.9 13 13.5 13 15h-2v-.5c0-1.1.45-2.1 1.17-2.83l1.24-1.26c.37-.36.59-.86.59-1.41 0-1.1-.9-2-2-2s-2 .9-2 2H8c0-2.21 1.79-4 4-4s4 1.79 4 4c0 .88-.36 1.68-.93 2.25z"
|
|
1049
1073
|
})));
|
|
1050
1074
|
};
|
|
1051
|
-
var ForwardRef$7 = /*#__PURE__*/forwardRef(SvgNotificationHelpFill24);
|
|
1075
|
+
var ForwardRef$7 = /*#__PURE__*/React.forwardRef(SvgNotificationHelpFill24);
|
|
1052
1076
|
|
|
1053
1077
|
var _path$5;
|
|
1054
1078
|
function _extends$6() { _extends$6 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$6.apply(this, arguments); }
|
|
1055
1079
|
var SvgCross = function SvgCross(props, ref) {
|
|
1056
|
-
return /*#__PURE__*/
|
|
1080
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$6({
|
|
1057
1081
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1058
1082
|
width: 24,
|
|
1059
1083
|
height: 24,
|
|
1060
1084
|
viewBox: "0 0 24 24",
|
|
1061
1085
|
ref: ref
|
|
1062
|
-
}, props), _path$5 || (_path$5 = /*#__PURE__*/
|
|
1086
|
+
}, props), _path$5 || (_path$5 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1063
1087
|
fillRule: "evenodd",
|
|
1064
1088
|
d: "M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
|
|
1065
1089
|
})));
|
|
1066
1090
|
};
|
|
1067
|
-
var ForwardRef$6 = /*#__PURE__*/forwardRef(SvgCross);
|
|
1091
|
+
var ForwardRef$6 = /*#__PURE__*/React.forwardRef(SvgCross);
|
|
1068
1092
|
|
|
1069
1093
|
var css$i = {"root":"NotificationCard_root__HP4NM","icon-wrapper":"NotificationCard_icon-wrapper__FZUAl","notification-wrapper":"NotificationCard_notification-wrapper__L-YsE","action-wrapper":"NotificationCard_action-wrapper__MahuR","action-link":"NotificationCard_action-link__DXfp7","close-icon":"NotificationCard_close-icon__p0MvI","main-path":"NotificationCard_main-path__yWH2j","content":"NotificationCard_content__O4mCt","clear-button":"NotificationCard_clear-button__-RzMj","close-wrapper":"NotificationCard_close-wrapper__BVl8x","iconWrapper":"NotificationCard_icon-wrapper__FZUAl","notificationWrapper":"NotificationCard_notification-wrapper__L-YsE","actionWrapper":"NotificationCard_action-wrapper__MahuR","actionLink":"NotificationCard_action-link__DXfp7","closeIcon":"NotificationCard_close-icon__p0MvI","mainPath":"NotificationCard_main-path__yWH2j","clearButton":"NotificationCard_clear-button__-RzMj","closeWrapper":"NotificationCard_close-wrapper__BVl8x"};
|
|
1070
1094
|
|
|
1071
|
-
class NotificationCard extends
|
|
1095
|
+
class NotificationCard extends React__namespace.default.Component {
|
|
1072
1096
|
constructor() {
|
|
1073
1097
|
super(...arguments);
|
|
1074
1098
|
this.notificationCardNode = null;
|
|
@@ -1084,30 +1108,30 @@ class NotificationCard extends React__default.Component {
|
|
|
1084
1108
|
(_b = this.notificationCardNode) === null || _b === void 0 ? void 0 : _b.removeEventListener('mouseleave', this.props.refreshTimer);
|
|
1085
1109
|
}
|
|
1086
1110
|
render() {
|
|
1087
|
-
return (
|
|
1088
|
-
|
|
1089
|
-
this.props.icon &&
|
|
1090
|
-
|
|
1091
|
-
|
|
1111
|
+
return (React__namespace.default.createElement("div", { role: 'alert', className: cx__default.default(css$i.notificationWrapper, 'notification-card-vars', `notification-card-color-${this.props.color}`, css$i.root, this.props.cx), ref: (el) => this.notificationCardNode = el },
|
|
1112
|
+
React__namespace.default.createElement("div", { className: css$i.mainPath },
|
|
1113
|
+
this.props.icon && React__namespace.default.createElement("div", { className: css$i.iconWrapper },
|
|
1114
|
+
React__namespace.default.createElement(uuiComponents.IconContainer, { icon: this.props.icon, cx: css$i.actionIcon })),
|
|
1115
|
+
React__namespace.default.createElement("div", { className: css$i.content },
|
|
1092
1116
|
this.props.children,
|
|
1093
|
-
this.props.actions &&
|
|
1094
|
-
return
|
|
1117
|
+
this.props.actions && React__namespace.default.createElement("div", { className: css$i.actionWrapper }, this.props.actions.map((action) => {
|
|
1118
|
+
return React__namespace.default.createElement(LinkButton, { caption: action.name, onClick: action.action, key: action.name, cx: css$i.actionLink, size: '36' });
|
|
1095
1119
|
}))),
|
|
1096
|
-
this.props.onClose &&
|
|
1097
|
-
|
|
1120
|
+
this.props.onClose && React__namespace.default.createElement("div", { className: css$i.closeWrapper },
|
|
1121
|
+
React__namespace.default.createElement(IconButton, { icon: ForwardRef$6, color: 'default', onClick: this.props.onClose, cx: css$i.closeIcon })))));
|
|
1098
1122
|
}
|
|
1099
1123
|
}
|
|
1100
|
-
const WarningNotification = (props) =>
|
|
1101
|
-
const SuccessNotification = (props) =>
|
|
1102
|
-
const HintNotification = (props) =>
|
|
1103
|
-
const ErrorNotification = (props) =>
|
|
1104
|
-
class ClearNotification extends
|
|
1124
|
+
const WarningNotification = (props) => React__namespace.default.createElement(NotificationCard, Object.assign({ icon: ForwardRef$9, color: 'warning' }, props, { cx: cx__default.default(props.cx) }));
|
|
1125
|
+
const SuccessNotification = (props) => React__namespace.default.createElement(NotificationCard, Object.assign({ icon: ForwardRef$a, color: 'success' }, props, { cx: cx__default.default(props.cx) }));
|
|
1126
|
+
const HintNotification = (props) => React__namespace.default.createElement(NotificationCard, Object.assign({ icon: ForwardRef$7, color: 'info' }, props, { cx: cx__default.default(props.cx) }));
|
|
1127
|
+
const ErrorNotification = (props) => React__namespace.default.createElement(NotificationCard, Object.assign({ icon: ForwardRef$8, color: 'error' }, props, { cx: cx__default.default(props.cx) }));
|
|
1128
|
+
class ClearNotification extends React__namespace.default.Component {
|
|
1105
1129
|
render() {
|
|
1106
|
-
return
|
|
1107
|
-
|
|
1130
|
+
return React__namespace.default.createElement("div", { className: cx__default.default(css$i.notificationWrapper, css$i.clearButton) },
|
|
1131
|
+
React__namespace.default.createElement(LinkButton, { caption: i18n.notificationCard.closeAllNotificationsButton, onClick: () => this.context.uuiNotifications.clearAll() }));
|
|
1108
1132
|
}
|
|
1109
1133
|
}
|
|
1110
|
-
ClearNotification.contextType = UuiContext;
|
|
1134
|
+
ClearNotification.contextType = uuiCore.UuiContext;
|
|
1111
1135
|
|
|
1112
1136
|
var css$h = {"root":"Tooltip_root__zZwnu"};
|
|
1113
1137
|
|
|
@@ -1117,7 +1141,7 @@ function applyTooltipMods(mods) {
|
|
|
1117
1141
|
css$h.root,
|
|
1118
1142
|
];
|
|
1119
1143
|
}
|
|
1120
|
-
const Tooltip = withMods(Tooltip
|
|
1144
|
+
const Tooltip = uuiCore.withMods(uuiComponents.Tooltip, applyTooltipMods);
|
|
1121
1145
|
|
|
1122
1146
|
var css$g = {"root":"LabeledInput_root__xDC2q","size-24":"LabeledInput_size-24__0LWBQ","size-30":"LabeledInput_size-30__KDnLe","size-36":"LabeledInput_size-36__4qHf7","size-42":"LabeledInput_size-42__zo6a7","size-48":"LabeledInput_size-48__3NqJt","size24":"LabeledInput_size-24__0LWBQ","size30":"LabeledInput_size-30__KDnLe","size36":"LabeledInput_size-36__4qHf7","size42":"LabeledInput_size-42__zo6a7","size48":"LabeledInput_size-48__3NqJt"};
|
|
1123
1147
|
|
|
@@ -1129,54 +1153,54 @@ function applyLabeledInputMods(mods) {
|
|
|
1129
1153
|
css$g['size-' + (mods.size || defaultSize$4)],
|
|
1130
1154
|
];
|
|
1131
1155
|
}
|
|
1132
|
-
const LabeledInput = withMods(LabeledInput
|
|
1156
|
+
const LabeledInput = uuiCore.withMods(uuiComponents.LabeledInput, applyLabeledInputMods, (props) => ({
|
|
1133
1157
|
Tooltip,
|
|
1134
1158
|
infoIcon: systemIcons[props.size || defaultSize$4].help,
|
|
1135
1159
|
}));
|
|
1136
1160
|
|
|
1137
1161
|
var css$f = {"root":"RadioGroup_root__uLWIn"};
|
|
1138
1162
|
|
|
1139
|
-
const RadioGroup = withMods(RadioGroup
|
|
1163
|
+
const RadioGroup = uuiCore.withMods(uuiComponents.RadioGroup, () => [css$f.root], () => ({ RadioInput }));
|
|
1140
1164
|
|
|
1141
1165
|
function applyScrollBarsMods() {
|
|
1142
1166
|
return [
|
|
1143
1167
|
'scroll-bars-vars',
|
|
1144
1168
|
];
|
|
1145
1169
|
}
|
|
1146
|
-
const ScrollBars = withMods(ScrollBars
|
|
1170
|
+
const ScrollBars = uuiCore.withMods(uuiComponents.ScrollBars, applyScrollBarsMods);
|
|
1147
1171
|
|
|
1148
1172
|
function applyVirtualListMods() {
|
|
1149
1173
|
return [
|
|
1150
1174
|
'scroll-bars-vars',
|
|
1151
1175
|
];
|
|
1152
1176
|
}
|
|
1153
|
-
const VirtualList = withMods(VirtualList
|
|
1177
|
+
const VirtualList = uuiCore.withMods(uuiComponents.VirtualList, applyVirtualListMods);
|
|
1154
1178
|
|
|
1155
1179
|
var css$e = {"body":"DataPickerBody_body__9Atow","modal":"DataPickerBody_modal__zvOE2","search":"DataPickerBody_search__mqXFa","checkbox":"DataPickerBody_checkbox__EFs7y","search-wrapper":"DataPickerBody_search-wrapper__UeG2b","search-size-24":"DataPickerBody_search-size-24__WfozU","search-size-30":"DataPickerBody_search-size-30__cziAV","search-size-36":"DataPickerBody_search-size-36__gx2sy","search-size-42":"DataPickerBody_search-size-42__Q-zy9","no-found-size-24":"DataPickerBody_no-found-size-24__4RC9-","no-found-size-30":"DataPickerBody_no-found-size-30__M8eYW","no-found-size-36":"DataPickerBody_no-found-size-36__jr82u","no-found-size-42":"DataPickerBody_no-found-size-42__9WVA5","searchWrapper":"DataPickerBody_search-wrapper__UeG2b","searchSize24":"DataPickerBody_search-size-24__WfozU","searchSize30":"DataPickerBody_search-size-30__cziAV","searchSize36":"DataPickerBody_search-size-36__gx2sy","searchSize42":"DataPickerBody_search-size-42__Q-zy9","noFoundSize24":"DataPickerBody_no-found-size-24__4RC9-","noFoundSize30":"DataPickerBody_no-found-size-30__M8eYW","noFoundSize36":"DataPickerBody_no-found-size-36__jr82u","noFoundSize42":"DataPickerBody_no-found-size-42__9WVA5"};
|
|
1156
1180
|
|
|
1157
|
-
class DataPickerBody extends PickerBodyBase {
|
|
1181
|
+
class DataPickerBody extends uuiComponents.PickerBodyBase {
|
|
1158
1182
|
constructor() {
|
|
1159
1183
|
super(...arguments);
|
|
1160
|
-
this.lens = Lens.onEditableComponent(this);
|
|
1184
|
+
this.lens = uuiCore.Lens.onEditableComponent(this);
|
|
1161
1185
|
this.searchLens = this.lens.prop('search');
|
|
1162
1186
|
}
|
|
1163
1187
|
renderNoFound() {
|
|
1164
1188
|
if (this.props.renderNotFound) {
|
|
1165
1189
|
return this.props.renderNotFound();
|
|
1166
1190
|
}
|
|
1167
|
-
return
|
|
1168
|
-
|
|
1191
|
+
return React__namespace.default.createElement(uuiComponents.FlexCell, { cx: css$e[`no-found-size-${this.props.searchSize || 36}`], grow: 1, textAlign: 'center' },
|
|
1192
|
+
React__namespace.default.createElement(Text, { size: this.props.searchSize || '36' }, i18n.dataPickerBody.noRecordsMessage));
|
|
1169
1193
|
}
|
|
1170
1194
|
render() {
|
|
1171
1195
|
this.props.value;
|
|
1172
|
-
const searchSize = isMobile() ? '48' : (this.props.searchSize || '36');
|
|
1173
|
-
const searchClass = cx(css$e.searchWrapper, css$e[`search-size-${searchSize}`]);
|
|
1174
|
-
return
|
|
1175
|
-
this.showSearch() && (
|
|
1176
|
-
|
|
1177
|
-
|
|
1178
|
-
|
|
1179
|
-
?
|
|
1196
|
+
const searchSize = uuiCore.isMobile() ? '48' : (this.props.searchSize || '36');
|
|
1197
|
+
const searchClass = uuiCore.cx(css$e.searchWrapper, css$e[`search-size-${searchSize}`]);
|
|
1198
|
+
return React__namespace.default.createElement(React__namespace.default.Fragment, null,
|
|
1199
|
+
this.showSearch() && (React__namespace.default.createElement("div", { key: 'search', className: searchClass },
|
|
1200
|
+
React__namespace.default.createElement(uuiComponents.FlexCell, { grow: 1 },
|
|
1201
|
+
React__namespace.default.createElement(SearchInput, Object.assign({ cx: css$e.search, placeholder: i18n.dataPickerBody.searchPlaceholder }, this.searchLens.toProps(), { onKeyDown: this.searchKeyDown, size: searchSize }))))),
|
|
1202
|
+
React__namespace.default.createElement(FlexRow, { key: 'body', cx: uuiCore.cx(css$e.body, css$e[this.props.editMode]), rawProps: { style: { maxHeight: this.props.maxHeight } } }, this.props.rowsCount > 0
|
|
1203
|
+
? React__namespace.default.createElement(VirtualList, Object.assign({}, this.lens.toProps(), { rows: this.props.rows, role: "listbox", rawProps: this.props.rawProps, rowsCount: this.props.rowsCount }))
|
|
1180
1204
|
: this.renderNoFound()));
|
|
1181
1205
|
}
|
|
1182
1206
|
}
|
|
@@ -1191,66 +1215,66 @@ const switchSizes = {
|
|
|
1191
1215
|
};
|
|
1192
1216
|
const DataPickerFooterImpl = (props) => {
|
|
1193
1217
|
const { clearSelection, view, showSelected } = props;
|
|
1194
|
-
const size = isMobile() ? '48' : (props.size || '36');
|
|
1218
|
+
const size = uuiCore.isMobile() ? '48' : (props.size || '36');
|
|
1195
1219
|
const switchSize = switchSizes[size];
|
|
1196
1220
|
const hasSelection = view.getSelectedRows().length > 0;
|
|
1197
1221
|
const handleKeyDown = (e) => {
|
|
1198
1222
|
if (!e.shiftKey && e.key === 'Tab')
|
|
1199
1223
|
e.preventDefault();
|
|
1200
1224
|
};
|
|
1201
|
-
return (
|
|
1202
|
-
!props.hideShowOnlySelected &&
|
|
1203
|
-
|
|
1204
|
-
view.selectAll && (
|
|
1205
|
-
|
|
1225
|
+
return (React__namespace.default.createElement(FlexRow, { padding: '12', cx: cx__default.default(css$d.footerWrapper) },
|
|
1226
|
+
!props.hideShowOnlySelected && React__namespace.default.createElement(Switch, { size: switchSize, value: showSelected.value, isDisabled: !hasSelection, onValueChange: showSelected.onValueChange, label: i18n.pickerInput.showOnlySelectedLabel }),
|
|
1227
|
+
React__namespace.default.createElement(FlexSpacer, null),
|
|
1228
|
+
view.selectAll && (React__namespace.default.createElement(FlexCell, { width: 'auto', alignSelf: 'center' },
|
|
1229
|
+
React__namespace.default.createElement(LinkButton, { size: size, caption: hasSelection
|
|
1206
1230
|
? i18n.pickerInput.clearSelectionButton
|
|
1207
1231
|
: i18n.pickerInput.selectAllButton, onClick: hasSelection
|
|
1208
1232
|
? clearSelection
|
|
1209
1233
|
: () => view.selectAll.onValueChange(true), rawProps: { onKeyDown: handleKeyDown } })))));
|
|
1210
1234
|
};
|
|
1211
|
-
const DataPickerFooter =
|
|
1235
|
+
const DataPickerFooter = React__namespace.default.memo(DataPickerFooterImpl);
|
|
1212
1236
|
|
|
1213
1237
|
var css$c = {"header":"DataPickerHeader_header__UDMhr","close":"DataPickerHeader_close__30pW6"};
|
|
1214
1238
|
|
|
1215
1239
|
var _path$4;
|
|
1216
1240
|
function _extends$5() { _extends$5 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$5.apply(this, arguments); }
|
|
1217
1241
|
var SvgNavigationClose24 = function SvgNavigationClose24(props, ref) {
|
|
1218
|
-
return /*#__PURE__*/
|
|
1242
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$5({
|
|
1219
1243
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1220
1244
|
width: 24,
|
|
1221
1245
|
height: 24,
|
|
1222
1246
|
viewBox: "0 0 24 24",
|
|
1223
1247
|
ref: ref
|
|
1224
|
-
}, props), _path$4 || (_path$4 = /*#__PURE__*/
|
|
1248
|
+
}, props), _path$4 || (_path$4 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1225
1249
|
fillRule: "evenodd",
|
|
1226
1250
|
d: "M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z",
|
|
1227
1251
|
clipRule: "evenodd"
|
|
1228
1252
|
})));
|
|
1229
1253
|
};
|
|
1230
|
-
var ForwardRef$5 = /*#__PURE__*/forwardRef(SvgNavigationClose24);
|
|
1254
|
+
var ForwardRef$5 = /*#__PURE__*/React.forwardRef(SvgNavigationClose24);
|
|
1231
1255
|
|
|
1232
1256
|
const DataPickerHeaderImpl = props => {
|
|
1233
1257
|
const title = props.title ? props.title.charAt(0).toUpperCase() + props.title.slice(1) : '';
|
|
1234
|
-
return (
|
|
1235
|
-
|
|
1236
|
-
|
|
1258
|
+
return (React__namespace.default.createElement(FlexRow, { alignItems: 'center', borderBottom: true, size: "48", cx: css$c.header },
|
|
1259
|
+
React__namespace.default.createElement(Text, { font: 'semibold' }, title),
|
|
1260
|
+
React__namespace.default.createElement(IconButton, { icon: ForwardRef$5, onClick: () => { var _a; return (_a = props.close) === null || _a === void 0 ? void 0 : _a.call(props); }, cx: css$c.close })));
|
|
1237
1261
|
};
|
|
1238
|
-
const DataPickerHeader =
|
|
1262
|
+
const DataPickerHeader = React__namespace.default.memo(DataPickerHeaderImpl);
|
|
1239
1263
|
|
|
1240
1264
|
var _defs, _use;
|
|
1241
1265
|
function _extends$4() { _extends$4 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$4.apply(this, arguments); }
|
|
1242
1266
|
var SvgTreeFoldingArrow = function SvgTreeFoldingArrow(props, ref) {
|
|
1243
|
-
return /*#__PURE__*/
|
|
1267
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$4({
|
|
1244
1268
|
width: 18,
|
|
1245
1269
|
height: 18,
|
|
1246
1270
|
viewBox: "0 0 18 18",
|
|
1247
1271
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1248
1272
|
xmlnsXlink: "http://www.w3.org/1999/xlink",
|
|
1249
1273
|
ref: ref
|
|
1250
|
-
}, props), _defs || (_defs = /*#__PURE__*/
|
|
1274
|
+
}, props), _defs || (_defs = /*#__PURE__*/React__namespace.createElement("defs", null, /*#__PURE__*/React__namespace.createElement("path", {
|
|
1251
1275
|
id: "a",
|
|
1252
1276
|
d: "M6.056 6.998a.997.997 0 0 1-.769-.29L.293 1.712a1 1 0 0 1 0-1.414L.299.293a1 1 0 0 1 1.414 0L6 4.58 10.288.293c.39-.39 1.023-.39 1.42.006a1 1 0 0 1 0 1.414L6.712 6.707a.993.993 0 0 1-.657.291z"
|
|
1253
|
-
}))), _use || (_use = /*#__PURE__*/
|
|
1277
|
+
}))), _use || (_use = /*#__PURE__*/React__namespace.createElement("use", {
|
|
1254
1278
|
width: "100%",
|
|
1255
1279
|
height: "100%",
|
|
1256
1280
|
xlinkHref: "#a",
|
|
@@ -1258,11 +1282,11 @@ var SvgTreeFoldingArrow = function SvgTreeFoldingArrow(props, ref) {
|
|
|
1258
1282
|
fillRule: "evenodd"
|
|
1259
1283
|
})));
|
|
1260
1284
|
};
|
|
1261
|
-
var ForwardRef$4 = /*#__PURE__*/forwardRef(SvgTreeFoldingArrow);
|
|
1285
|
+
var ForwardRef$4 = /*#__PURE__*/React.forwardRef(SvgTreeFoldingArrow);
|
|
1262
1286
|
|
|
1263
1287
|
var css$b = {"cell":"DataTableCell_cell__VgHTT","wrapper":"DataTableCell_wrapper__6hBNx","align-widgets-top":"DataTableCell_align-widgets-top__7LNVl","size-24":"DataTableCell_size-24__g6m7O","folding-arrow":"DataTableCell_folding-arrow__6iI4s","size-30":"DataTableCell_size-30__hpjkm","size-36":"DataTableCell_size-36__8qiBq","size-42":"DataTableCell_size-42__jJMhr","size-48":"DataTableCell_size-48__XXrAx","size-60":"DataTableCell_size-60__0XLPh","align-widgets-center":"DataTableCell_align-widgets-center__VXHNb","padding-12":"DataTableCell_padding-12__xvGe5","padding-24":"DataTableCell_padding-24__r322g","padding-left-12":"DataTableCell_padding-left-12__g6QSx","padding-left-24":"DataTableCell_padding-left-24__vm-bI","padding-right-24":"DataTableCell_padding-right-24__CjNWh","drag-handle":"DataTableCell_drag-handle__Ge7UM","checkbox":"DataTableCell_checkbox__sY2kh","indent":"DataTableCell_indent__lcZWO","folding-arrow-12":"DataTableCell_folding-arrow-12__mVKaH","folding-arrow-18":"DataTableCell_folding-arrow-18__hiEIW","alignWidgetsTop":"DataTableCell_align-widgets-top__7LNVl","size24":"DataTableCell_size-24__g6m7O","foldingArrow":"DataTableCell_folding-arrow__6iI4s","size30":"DataTableCell_size-30__hpjkm","size36":"DataTableCell_size-36__8qiBq","size42":"DataTableCell_size-42__jJMhr","size48":"DataTableCell_size-48__XXrAx","size60":"DataTableCell_size-60__0XLPh","alignWidgetsCenter":"DataTableCell_align-widgets-center__VXHNb","padding12":"DataTableCell_padding-12__xvGe5","padding24":"DataTableCell_padding-24__r322g","paddingLeft12":"DataTableCell_padding-left-12__g6QSx","paddingLeft24":"DataTableCell_padding-left-24__vm-bI","paddingRight24":"DataTableCell_padding-right-24__CjNWh","dragHandle":"DataTableCell_drag-handle__Ge7UM","foldingArrow12":"DataTableCell_folding-arrow-12__mVKaH","foldingArrow18":"DataTableCell_folding-arrow-18__hiEIW"};
|
|
1264
1288
|
|
|
1265
|
-
class DataTableCell extends
|
|
1289
|
+
class DataTableCell extends React__namespace.Component {
|
|
1266
1290
|
constructor() {
|
|
1267
1291
|
var _a, _b, _c;
|
|
1268
1292
|
super(...arguments);
|
|
@@ -1273,54 +1297,54 @@ class DataTableCell extends React.Component {
|
|
|
1273
1297
|
const row = this.props.rowProps;
|
|
1274
1298
|
const additionalItemSize = +this.props.size < 30 ? '12' : '18';
|
|
1275
1299
|
const cellContent = row.isLoading
|
|
1276
|
-
?
|
|
1277
|
-
|
|
1300
|
+
? React__namespace.createElement(Text, { size: this.props.size != '60' ? this.props.size : '48' },
|
|
1301
|
+
React__namespace.createElement(TextPlaceholder, null))
|
|
1278
1302
|
: this.props.column.render(this.props.rowProps.value, this.props.rowProps);
|
|
1279
|
-
return (
|
|
1280
|
-
this.props.isFirstColumn && this.isDraggable() &&
|
|
1281
|
-
this.props.isFirstColumn && ((_a = row === null || row === void 0 ? void 0 : row.checkbox) === null || _a === void 0 ? void 0 : _a.isVisible) &&
|
|
1282
|
-
this.props.isFirstColumn && row.indent > 0 && (
|
|
1283
|
-
|
|
1303
|
+
return (React__namespace.createElement(React__namespace.Fragment, null,
|
|
1304
|
+
this.props.isFirstColumn && this.isDraggable() && React__namespace.createElement(uuiComponents.DragHandle, { cx: css$b.dragHandle }),
|
|
1305
|
+
this.props.isFirstColumn && ((_a = row === null || row === void 0 ? void 0 : row.checkbox) === null || _a === void 0 ? void 0 : _a.isVisible) && React__namespace.createElement(Checkbox, { key: 'cb', cx: css$b.checkbox, tabIndex: this.props.tabIndex, size: additionalItemSize, value: row.isChecked, indeterminate: !row.isChecked && row.isChildrenChecked, onValueChange: () => row.onCheck(row), isDisabled: row.checkbox.isDisabled, isInvalid: row.checkbox.isInvalid }),
|
|
1306
|
+
this.props.isFirstColumn && row.indent > 0 && (React__namespace.createElement("div", { key: 'fold', className: css$b.indent, style: { marginLeft: (row.indent - 1) * 24 } }, row.isFoldable &&
|
|
1307
|
+
React__namespace.createElement(uuiComponents.IconContainer, { key: 'icon', icon: ForwardRef$4, cx: [css$b.foldingArrow, css$b[`folding-arrow-${additionalItemSize}`], uuiCore.uuiMarkers.clickable], rotate: row.isFolded ? '90ccw' : '0', onClick: () => row.onFold(row) }))),
|
|
1284
1308
|
cellContent));
|
|
1285
1309
|
};
|
|
1286
1310
|
}
|
|
1287
1311
|
render() {
|
|
1288
|
-
return (
|
|
1312
|
+
return (React__namespace.createElement(FlexCell, Object.assign({}, this.props.column, { rawProps: { role: 'cell' }, cx: uuiCore.cx(css$b.cell, this.props.isFirstColumn && this.hasDepsWidgets && css$b.wrapper, css$b['size-' + (this.props.size || '36')], css$b[`padding-${this.props.padding || '12'}`], this.props.isFirstColumn && css$b[`padding-left-${this.props.padding || '24'}`], this.props.isLastColumn && css$b['padding-right-24'], this.props.column.cx, css$b[`align-widgets-${this.props.alignActions || 'top'}`]) }), this.getContent()));
|
|
1289
1313
|
}
|
|
1290
1314
|
}
|
|
1291
1315
|
|
|
1292
1316
|
var _path$3;
|
|
1293
1317
|
function _extends$3() { _extends$3 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$3.apply(this, arguments); }
|
|
1294
1318
|
var SvgNavigationMoreVert12 = function SvgNavigationMoreVert12(props, ref) {
|
|
1295
|
-
return /*#__PURE__*/
|
|
1319
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$3({
|
|
1296
1320
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1297
1321
|
width: 12,
|
|
1298
1322
|
height: 12,
|
|
1299
1323
|
viewBox: "0 0 12 12",
|
|
1300
1324
|
ref: ref
|
|
1301
|
-
}, props), _path$3 || (_path$3 = /*#__PURE__*/
|
|
1325
|
+
}, props), _path$3 || (_path$3 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1302
1326
|
fillRule: "evenodd",
|
|
1303
1327
|
d: "M6 4c.55 0 1-.45 1-1s-.45-1-1-1-1 .45-1 1 .45 1 1 1zm0 1c-.55 0-1 .45-1 1s.45 1 1 1 1-.45 1-1-.45-1-1-1zm0 3c-.55 0-1 .45-1 1s.45 1 1 1 1-.45 1-1-.45-1-1-1z",
|
|
1304
1328
|
clipRule: "evenodd"
|
|
1305
1329
|
})));
|
|
1306
1330
|
};
|
|
1307
|
-
var ForwardRef$3 = /*#__PURE__*/forwardRef(SvgNavigationMoreVert12);
|
|
1331
|
+
var ForwardRef$3 = /*#__PURE__*/React.forwardRef(SvgNavigationMoreVert12);
|
|
1308
1332
|
|
|
1309
1333
|
var css$a = {"container":"Preset_container__HvhQn","target":"Preset_target__D4gqY","panel":"Preset_panel__-ioWh","divider":"Preset_divider__-GhDA","input":"Preset_input__-YNCn","notification":"Preset_notification__jRpMr"};
|
|
1310
1334
|
|
|
1311
1335
|
const Preset = ({ preset, isActive, hasChanged, choosePreset, duplicatePreset, deletePreset, updatePreset, }) => {
|
|
1312
|
-
const [isRenaming, setIsRenaming] = useState(false);
|
|
1313
|
-
const [renamingValue, setRenamingValue] = useState("");
|
|
1314
|
-
const handleChoose = useCallback(() => choosePreset(preset), [preset, choosePreset]);
|
|
1315
|
-
const handleUpdate = useCallback(() => updatePreset(preset), [preset, updatePreset]);
|
|
1316
|
-
const acceptRenaming = useCallback(() => {
|
|
1336
|
+
const [isRenaming, setIsRenaming] = React.useState(false);
|
|
1337
|
+
const [renamingValue, setRenamingValue] = React.useState("");
|
|
1338
|
+
const handleChoose = React.useCallback(() => choosePreset(preset), [preset, choosePreset]);
|
|
1339
|
+
const handleUpdate = React.useCallback(() => updatePreset(preset), [preset, updatePreset]);
|
|
1340
|
+
const acceptRenaming = React.useCallback(() => {
|
|
1317
1341
|
if (renamingValue) {
|
|
1318
1342
|
const newPreset = Object.assign(Object.assign({}, preset), { name: renamingValue });
|
|
1319
1343
|
updatePreset(newPreset);
|
|
1320
1344
|
}
|
|
1321
1345
|
setIsRenaming(false);
|
|
1322
1346
|
}, [renamingValue, updatePreset]);
|
|
1323
|
-
const renderBody = useCallback((props) => {
|
|
1347
|
+
const renderBody = React.useCallback((props) => {
|
|
1324
1348
|
const handleDuplicate = () => {
|
|
1325
1349
|
duplicatePreset(preset);
|
|
1326
1350
|
props.onClose();
|
|
@@ -1342,93 +1366,93 @@ const Preset = ({ preset, isActive, hasChanged, choosePreset, duplicatePreset, d
|
|
|
1342
1366
|
choosePreset(preset);
|
|
1343
1367
|
props.onClose();
|
|
1344
1368
|
};
|
|
1345
|
-
return (
|
|
1346
|
-
|
|
1347
|
-
|
|
1348
|
-
|
|
1349
|
-
|
|
1350
|
-
|
|
1351
|
-
|
|
1369
|
+
return (React__namespace.default.createElement(DropdownMenuBody, Object.assign({}, props),
|
|
1370
|
+
React__namespace.default.createElement(DropdownMenuButton, { caption: 'Duplicate', onClick: handleDuplicate }),
|
|
1371
|
+
React__namespace.default.createElement(DropdownMenuButton, { caption: 'Rename', onClick: startRenaming }),
|
|
1372
|
+
React__namespace.default.createElement(DropdownMenuButton, { caption: 'Update', onClick: update, isDisabled: !hasChanged }),
|
|
1373
|
+
React__namespace.default.createElement(DropdownMenuButton, { caption: 'Delete', onClick: handleDelete }),
|
|
1374
|
+
React__namespace.default.createElement(DropdownMenuSplitter, null),
|
|
1375
|
+
React__namespace.default.createElement(DropdownMenuButton, { caption: 'Discard all changes', onClick: choose, isDisabled: !hasChanged })));
|
|
1352
1376
|
}, [preset, duplicatePreset, deletePreset, isActive, choosePreset, hasChanged]);
|
|
1353
|
-
const renderTarget = useCallback((props) => {
|
|
1354
|
-
return (
|
|
1377
|
+
const renderTarget = React.useCallback((props) => {
|
|
1378
|
+
return (React__namespace.default.createElement(Button, Object.assign({}, props, { icon: ForwardRef$3, size: '24', isDropdown: false, mode: isActive ? 'solid' : 'outline', cx: [css$a.target, hasChanged && css$a.notification] })));
|
|
1355
1379
|
}, [preset, isActive, hasChanged]);
|
|
1356
|
-
return (
|
|
1357
|
-
? (
|
|
1358
|
-
: (
|
|
1359
|
-
|
|
1360
|
-
!preset.isReadonly && (
|
|
1380
|
+
return (React__namespace.default.createElement(React__namespace.default.Fragment, null, isRenaming
|
|
1381
|
+
? (React__namespace.default.createElement(TextInput, { value: renamingValue, onValueChange: setRenamingValue, size: '24', onAccept: acceptRenaming, onBlur: acceptRenaming, cx: css$a.input, autoFocus: true }))
|
|
1382
|
+
: (React__namespace.default.createElement(ControlGroup, { cx: css$a.container },
|
|
1383
|
+
React__namespace.default.createElement(Button, { key: preset.id, size: '24', caption: preset.name, mode: isActive ? 'solid' : 'outline', onClick: isActive ? null : handleChoose }),
|
|
1384
|
+
!preset.isReadonly && (React__namespace.default.createElement(Dropdown, { renderBody: renderBody, renderTarget: renderTarget, placement: 'bottom-end' }))))));
|
|
1361
1385
|
};
|
|
1362
1386
|
|
|
1363
1387
|
var css$9 = {"row":"Presets_row__Sgwiy"};
|
|
1364
1388
|
|
|
1365
1389
|
const PresetsImpl = ({ tableState, presets, createNewPreset, activePresetId, hasPresetChanged, choosePreset, duplicatePreset, deletePreset, updatePreset }) => {
|
|
1366
1390
|
const newPresetTitle = "New preset";
|
|
1367
|
-
const saveNewPreset = useCallback(() => {
|
|
1391
|
+
const saveNewPreset = React.useCallback(() => {
|
|
1368
1392
|
createNewPreset(newPresetTitle);
|
|
1369
1393
|
}, [createNewPreset, newPresetTitle]);
|
|
1370
1394
|
const activePreset = presets.find(p => p.id === activePresetId);
|
|
1371
|
-
const hasActivePresetChanged = useMemo(() => {
|
|
1395
|
+
const hasActivePresetChanged = React.useMemo(() => {
|
|
1372
1396
|
return hasPresetChanged(activePreset);
|
|
1373
1397
|
}, [activePreset, tableState.filter]);
|
|
1374
|
-
return (
|
|
1375
|
-
presets.map(preset => (
|
|
1376
|
-
hasActivePresetChanged && (
|
|
1398
|
+
return (React__namespace.default.createElement(FlexRow, { spacing: "6", size: "48", padding: "18", cx: css$9.row },
|
|
1399
|
+
presets.map(preset => (React__namespace.default.createElement(Preset, { preset: preset, isActive: preset.id === activePresetId, hasChanged: preset.id === activePresetId && hasActivePresetChanged, choosePreset: choosePreset, duplicatePreset: duplicatePreset, deletePreset: deletePreset, updatePreset: updatePreset, key: preset.id }))),
|
|
1400
|
+
hasActivePresetChanged && (React__namespace.default.createElement(Button, { caption: `Save as ${newPresetTitle}`, onClick: saveNewPreset, color: 'accent', mode: 'solid', size: '24' }))));
|
|
1377
1401
|
};
|
|
1378
|
-
const Presets =
|
|
1402
|
+
const Presets = React__namespace.default.memo(PresetsImpl);
|
|
1379
1403
|
|
|
1380
1404
|
var _path$2;
|
|
1381
1405
|
function _extends$2() { _extends$2 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$2.apply(this, arguments); }
|
|
1382
1406
|
var SvgNotificationDone24 = function SvgNotificationDone24(props, ref) {
|
|
1383
|
-
return /*#__PURE__*/
|
|
1407
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$2({
|
|
1384
1408
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1385
1409
|
width: 24,
|
|
1386
1410
|
height: 24,
|
|
1387
1411
|
viewBox: "0 0 24 24",
|
|
1388
1412
|
ref: ref
|
|
1389
|
-
}, props), _path$2 || (_path$2 = /*#__PURE__*/
|
|
1413
|
+
}, props), _path$2 || (_path$2 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1390
1414
|
fillRule: "evenodd",
|
|
1391
1415
|
d: "m9.727 16.075-4.295-4.388L4 13.149 9.727 19 22 6.463 20.568 5 9.728 16.075z",
|
|
1392
1416
|
clipRule: "evenodd"
|
|
1393
1417
|
})));
|
|
1394
1418
|
};
|
|
1395
|
-
var ForwardRef$2 = /*#__PURE__*/forwardRef(SvgNotificationDone24);
|
|
1419
|
+
var ForwardRef$2 = /*#__PURE__*/React.forwardRef(SvgNotificationDone24);
|
|
1396
1420
|
|
|
1397
1421
|
var _path$1;
|
|
1398
1422
|
function _extends$1() { _extends$1 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1.apply(this, arguments); }
|
|
1399
1423
|
var SvgNotificationDone18 = function SvgNotificationDone18(props, ref) {
|
|
1400
|
-
return /*#__PURE__*/
|
|
1424
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
|
|
1401
1425
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1402
1426
|
width: 18,
|
|
1403
1427
|
height: 18,
|
|
1404
1428
|
viewBox: "0 0 18 18",
|
|
1405
1429
|
ref: ref
|
|
1406
|
-
}, props), _path$1 || (_path$1 = /*#__PURE__*/
|
|
1430
|
+
}, props), _path$1 || (_path$1 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1407
1431
|
fillRule: "evenodd",
|
|
1408
1432
|
d: "M7.136 11.91 4.034 8.776 3 9.821 7.136 14 16 5.045 14.966 4l-7.83 7.91z",
|
|
1409
1433
|
clipRule: "evenodd"
|
|
1410
1434
|
})));
|
|
1411
1435
|
};
|
|
1412
|
-
var ForwardRef$1 = /*#__PURE__*/forwardRef(SvgNotificationDone18);
|
|
1436
|
+
var ForwardRef$1 = /*#__PURE__*/React.forwardRef(SvgNotificationDone18);
|
|
1413
1437
|
|
|
1414
1438
|
var _path;
|
|
1415
1439
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
1416
1440
|
var SvgNotificationDone12 = function SvgNotificationDone12(props, ref) {
|
|
1417
|
-
return /*#__PURE__*/
|
|
1441
|
+
return /*#__PURE__*/React__namespace.createElement("svg", _extends({
|
|
1418
1442
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1419
1443
|
width: 12,
|
|
1420
1444
|
height: 12,
|
|
1421
1445
|
viewBox: "0 0 12 12",
|
|
1422
1446
|
ref: ref
|
|
1423
|
-
}, props), _path || (_path = /*#__PURE__*/
|
|
1447
|
+
}, props), _path || (_path = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1424
1448
|
d: "M11 3.6 9.462 2 4.846 6.8 2.538 4.4 1 6l3.846 4L11 3.6z"
|
|
1425
1449
|
})));
|
|
1426
1450
|
};
|
|
1427
|
-
var ForwardRef = /*#__PURE__*/forwardRef(SvgNotificationDone12);
|
|
1451
|
+
var ForwardRef = /*#__PURE__*/React.forwardRef(SvgNotificationDone12);
|
|
1428
1452
|
|
|
1429
1453
|
var css$8 = {"render-item":"DataPickerRow_render-item__YsRTQ","icon-wrapper":"DataPickerRow_icon-wrapper__Pwg6e","picker-row":"DataPickerRow_picker-row__yZk93","renderItem":"DataPickerRow_render-item__YsRTQ","iconWrapper":"DataPickerRow_icon-wrapper__Pwg6e","pickerRow":"DataPickerRow_picker-row__yZk93"};
|
|
1430
1454
|
|
|
1431
|
-
class DataPickerRow extends
|
|
1455
|
+
class DataPickerRow extends React__namespace.Component {
|
|
1432
1456
|
constructor() {
|
|
1433
1457
|
super(...arguments);
|
|
1434
1458
|
this.getIcon = (size) => {
|
|
@@ -1444,30 +1468,30 @@ class DataPickerRow extends React.Component {
|
|
|
1444
1468
|
key: 'name',
|
|
1445
1469
|
grow: 1,
|
|
1446
1470
|
width: 0,
|
|
1447
|
-
render: (item, rowProps) =>
|
|
1471
|
+
render: (item, rowProps) => React__namespace.createElement("div", { key: rowProps.id, className: css$8.renderItem },
|
|
1448
1472
|
this.props.renderItem(item, rowProps),
|
|
1449
|
-
|
|
1450
|
-
(rowProps.isChildrenSelected || rowProps.isSelected) &&
|
|
1451
|
-
|
|
1473
|
+
React__namespace.createElement(FlexSpacer, null),
|
|
1474
|
+
(rowProps.isChildrenSelected || rowProps.isSelected) && React__namespace.createElement("div", { className: css$8.iconWrapper },
|
|
1475
|
+
React__namespace.createElement(IconContainer, { icon: this.getIcon(this.props.size), color: rowProps.isChildrenSelected ? 'default' : 'info' }))),
|
|
1452
1476
|
};
|
|
1453
1477
|
this.renderContent = () => {
|
|
1454
|
-
return
|
|
1478
|
+
return React__namespace.createElement(DataTableCell, { key: 'name', size: this.props.size || '36', padding: this.props.padding || '24', isFirstColumn: true, isLastColumn: false, tabIndex: -1, column: this.column, rowProps: this.props, alignActions: this.props.alignActions || 'top' });
|
|
1455
1479
|
};
|
|
1456
1480
|
}
|
|
1457
1481
|
render() {
|
|
1458
|
-
return
|
|
1482
|
+
return React__namespace.createElement(uuiComponents.DataPickerRow, Object.assign({}, this.props, { cx: [css$8.pickerRow, this.props.cx], renderContent: this.renderContent }));
|
|
1459
1483
|
}
|
|
1460
1484
|
}
|
|
1461
1485
|
|
|
1462
1486
|
var css$7 = {"done":"MobileDropdownWrapper_done__kE5Pe"};
|
|
1463
1487
|
|
|
1464
1488
|
const MobileDropdownWrapper = props => {
|
|
1465
|
-
const isVisible = isMobile();
|
|
1466
|
-
useAppMobileHeight();
|
|
1467
|
-
return (
|
|
1468
|
-
isVisible &&
|
|
1489
|
+
const isVisible = uuiCore.isMobile();
|
|
1490
|
+
uuiCore.useAppMobileHeight();
|
|
1491
|
+
return (React__namespace.default.createElement(React__namespace.default.Fragment, null,
|
|
1492
|
+
isVisible && React__namespace.default.createElement(DataPickerHeader, { title: props.title, close: props.close }),
|
|
1469
1493
|
props.children,
|
|
1470
|
-
isVisible && (
|
|
1494
|
+
isVisible && (React__namespace.default.createElement(LinkButton, { caption: 'DONE', onClick: () => { var _a; return (_a = props.close) === null || _a === void 0 ? void 0 : _a.call(props); }, cx: css$7.done, size: '48' }))));
|
|
1471
1495
|
};
|
|
1472
1496
|
|
|
1473
1497
|
/******************************************************************************
|
|
@@ -1499,59 +1523,59 @@ function __rest(s, e) {
|
|
|
1499
1523
|
|
|
1500
1524
|
var css$6 = {"sub-header-wrapper":"PickerModal_sub-header-wrapper__ArWps","switch":"PickerModal_switch__l1-Vd","subHeaderWrapper":"PickerModal_sub-header-wrapper__ArWps","$switch$":"PickerModal_switch__l1-Vd"};
|
|
1501
1525
|
|
|
1502
|
-
class PickerModalImpl extends PickerModalBase {
|
|
1526
|
+
class PickerModalImpl extends uuiComponents.PickerModalBase {
|
|
1503
1527
|
renderRow(rowProps) {
|
|
1504
|
-
return this.props.renderRow ? this.props.renderRow(rowProps) : (
|
|
1528
|
+
return this.props.renderRow ? this.props.renderRow(rowProps) : (React__namespace.createElement(DataPickerRow, Object.assign({}, rowProps, { key: rowProps.rowKey, borderBottom: 'none', padding: '24', size: '36', renderItem: (i) => React__namespace.createElement(Text, { size: '36' }, rowProps.isLoading ? React__namespace.createElement(TextPlaceholder, { wordsCount: 2 }) : this.getName(i)) })));
|
|
1505
1529
|
}
|
|
1506
1530
|
renderFooter(selectedDataRows) {
|
|
1507
1531
|
const hasSelection = selectedDataRows.length > 0;
|
|
1508
1532
|
const view = this.getView();
|
|
1509
|
-
return
|
|
1510
|
-
view.selectAll &&
|
|
1511
|
-
|
|
1512
|
-
|
|
1513
|
-
|
|
1533
|
+
return React__namespace.createElement(React__namespace.Fragment, null,
|
|
1534
|
+
view.selectAll && React__namespace.createElement(LinkButton, { caption: hasSelection ? i18n.pickerModal.clearAllButton : i18n.pickerModal.selectAllButton, onClick: hasSelection ? () => this.clearSelection() : () => view.selectAll.onValueChange(true) }),
|
|
1535
|
+
React__namespace.createElement(FlexSpacer, null),
|
|
1536
|
+
React__namespace.createElement(Button, { mode: 'outline', color: 'secondary', caption: i18n.pickerModal.cancelButton, onClick: () => this.props.abort() }),
|
|
1537
|
+
React__namespace.createElement(Button, { color: 'accent', caption: i18n.pickerModal.selectButton, onClick: () => this.props.success(null) }));
|
|
1514
1538
|
}
|
|
1515
1539
|
render() {
|
|
1516
1540
|
const view = this.getView();
|
|
1517
1541
|
const dataRows = this.getRows();
|
|
1518
1542
|
const selectedDataRows = view.getSelectedRows();
|
|
1519
1543
|
const rows = dataRows.map(props => this.renderRow(props));
|
|
1520
|
-
return (
|
|
1521
|
-
|
|
1522
|
-
|
|
1523
|
-
|
|
1524
|
-
|
|
1525
|
-
|
|
1544
|
+
return (React__namespace.createElement(ModalBlocker, Object.assign({}, this.props),
|
|
1545
|
+
React__namespace.createElement(ModalWindow, { width: 600, height: 700 },
|
|
1546
|
+
React__namespace.createElement(ModalHeader, { borderBottom: true, title: this.props.caption || i18n.pickerModal.headerTitle, onClose: () => this.props.abort() }),
|
|
1547
|
+
React__namespace.createElement(FlexCell, { cx: css$6.subHeaderWrapper },
|
|
1548
|
+
React__namespace.createElement(FlexRow, { vPadding: '24' },
|
|
1549
|
+
React__namespace.createElement(SearchInput, Object.assign({}, this.lens.prop('dataSourceState').prop('search').toProps(), { onKeyDown: (e) => uuiComponents.handleDataSourceKeyboard({
|
|
1526
1550
|
value: this.getDataSourceState(),
|
|
1527
1551
|
onValueChange: this.handleDataSourceValueChange,
|
|
1528
1552
|
listView: view,
|
|
1529
1553
|
rows: dataRows,
|
|
1530
1554
|
editMode: 'modal',
|
|
1531
1555
|
}, e), autoFocus: true, placeholder: i18n.pickerModal.searchPlaceholder }))),
|
|
1532
|
-
!this.isSingleSelect() &&
|
|
1533
|
-
this.props.renderFilter &&
|
|
1534
|
-
|
|
1556
|
+
!this.isSingleSelect() && React__namespace.createElement(Switch, Object.assign({ cx: css$6.switch, size: '18' }, this.stateLens.prop('showSelected').toProps(), { isDisabled: selectedDataRows.length < 1, label: 'Show only selected' })),
|
|
1557
|
+
this.props.renderFilter && React__namespace.createElement(FlexCell, { grow: 2 }, this.props.renderFilter(this.lens.prop('dataSourceState').prop('filter').toProps()))),
|
|
1558
|
+
React__namespace.createElement(DataPickerBody, Object.assign({}, this.getListProps(), { value: this.getDataSourceState(), onValueChange: this.handleDataSourceValueChange, search: this.lens.prop('dataSourceState').prop('search').toProps(), showSearch: false, rows: rows, renderNotFound: this.props.renderNotFound && (() => this.props.renderNotFound({
|
|
1535
1559
|
search: this.state.dataSourceState.search,
|
|
1536
1560
|
onClose: () => this.props.success(selectedDataRows),
|
|
1537
1561
|
})), editMode: 'modal' })),
|
|
1538
|
-
|
|
1562
|
+
React__namespace.createElement(ModalFooter, { borderTop: true, padding: '24', vPadding: '24' }, this.props.renderFooter
|
|
1539
1563
|
? this.props.renderFooter(this.getFooterProps())
|
|
1540
1564
|
: this.renderFooter(selectedDataRows)))));
|
|
1541
1565
|
}
|
|
1542
1566
|
}
|
|
1543
|
-
class PickerModal extends
|
|
1567
|
+
class PickerModal extends React__namespace.Component {
|
|
1544
1568
|
constructor() {
|
|
1545
1569
|
super(...arguments);
|
|
1546
1570
|
this.state = { selection: this.props.initialValue };
|
|
1547
|
-
this.lens = Lens.onState(this);
|
|
1571
|
+
this.lens = uuiCore.Lens.onState(this);
|
|
1548
1572
|
}
|
|
1549
1573
|
render() {
|
|
1550
|
-
return
|
|
1574
|
+
return React__namespace.createElement(PickerModalImpl, Object.assign({}, this.props, this.lens.prop('selection').toProps(), { success: () => this.props.success(this.state.selection) }));
|
|
1551
1575
|
}
|
|
1552
1576
|
}
|
|
1553
1577
|
|
|
1554
|
-
const Avatar = withMods(Avatar
|
|
1578
|
+
const Avatar = uuiCore.withMods(uuiComponents.Avatar, () => []);
|
|
1555
1579
|
|
|
1556
1580
|
var css$5 = {"root":"Badge_root__wIzSP","size-18":"Badge_size-18__-VlZJ","fill-transparent":"Badge_fill-transparent__za27N","size-24":"Badge_size-24__WZsqd","size-30":"Badge_size-30__oGbuk","size-36":"Badge_size-36__MMdK5","size-42":"Badge_size-42__MOPTB","size-48":"Badge_size-48__FEYnJ","fill-solid":"Badge_fill-solid__ptnEO","size18":"Badge_size-18__-VlZJ","fillTransparent":"Badge_fill-transparent__za27N","size24":"Badge_size-24__WZsqd","size30":"Badge_size-30__oGbuk","size36":"Badge_size-36__MMdK5","size42":"Badge_size-42__MOPTB","size48":"Badge_size-48__FEYnJ","fillSolid":"Badge_fill-solid__ptnEO"};
|
|
1557
1581
|
|
|
@@ -1573,7 +1597,7 @@ function applyBadgeMods(mods) {
|
|
|
1573
1597
|
css$5.root,
|
|
1574
1598
|
];
|
|
1575
1599
|
}
|
|
1576
|
-
const Badge = withMods(Button
|
|
1600
|
+
const Badge = uuiCore.withMods(uuiComponents.Button, applyBadgeMods, (props) => ({
|
|
1577
1601
|
dropdownIcon: systemIcons[props.size && mapSize$1[props.size] || defaultSize$3].foldingArrow,
|
|
1578
1602
|
clearIcon: systemIcons[props.size && mapSize$1[props.size] || defaultSize$3].clear,
|
|
1579
1603
|
countPosition: 'left',
|
|
@@ -1598,7 +1622,7 @@ function applyTagMods(mods) {
|
|
|
1598
1622
|
css$4.root,
|
|
1599
1623
|
];
|
|
1600
1624
|
}
|
|
1601
|
-
const Tag = withMods(Button
|
|
1625
|
+
const Tag = uuiCore.withMods(uuiComponents.Button, applyTagMods, (props) => ({
|
|
1602
1626
|
dropdownIcon: systemIcons[mapSize[props.size] || defaultSize$2].foldingArrow,
|
|
1603
1627
|
clearIcon: systemIcons[mapSize[props.size] || defaultSize$2].clear,
|
|
1604
1628
|
}));
|
|
@@ -1606,7 +1630,7 @@ const Tag = withMods(Button$1, applyTagMods, (props) => ({
|
|
|
1606
1630
|
var css$3 = {"root":"PickerToggler_root__G7gEl","mode-form":"PickerToggler_mode-form__OlTHW","mode-cell":"PickerToggler_mode-cell__hBg0t","size-24":"PickerToggler_size-24__MUg2U","size-30":"PickerToggler_size-30__K0XU-","size-36":"PickerToggler_size-36__NqG3q","size-42":"PickerToggler_size-42__xm0IS","size-48":"PickerToggler_size-48__DGIi9","modeForm":"PickerToggler_mode-form__OlTHW","modeCell":"PickerToggler_mode-cell__hBg0t","size24":"PickerToggler_size-24__MUg2U","size30":"PickerToggler_size-30__K0XU-","size36":"PickerToggler_size-36__NqG3q","size42":"PickerToggler_size-42__xm0IS","size48":"PickerToggler_size-48__DGIi9"};
|
|
1607
1631
|
|
|
1608
1632
|
const defaultSize$1 = '36';
|
|
1609
|
-
const defaultMode = EditMode.FORM;
|
|
1633
|
+
const defaultMode = exports.EditMode.FORM;
|
|
1610
1634
|
function applyPickerTogglerMods(mods) {
|
|
1611
1635
|
return [
|
|
1612
1636
|
'picker-toggler-vars',
|
|
@@ -1634,7 +1658,7 @@ function PickerTogglerComponent(props, ref) {
|
|
|
1634
1658
|
var _a;
|
|
1635
1659
|
const maxItems = (props.maxItems || props.maxItems === 0) ? props.maxItems : 100;
|
|
1636
1660
|
if (row.isLoading) {
|
|
1637
|
-
return
|
|
1661
|
+
return React__namespace.createElement(TextPlaceholder, null);
|
|
1638
1662
|
}
|
|
1639
1663
|
else if (!props.getName || ((_a = props.selection) === null || _a === void 0 ? void 0 : _a.length) > maxItems) {
|
|
1640
1664
|
return row.value;
|
|
@@ -1645,19 +1669,19 @@ function PickerTogglerComponent(props, ref) {
|
|
|
1645
1669
|
};
|
|
1646
1670
|
const renderItem = (row) => {
|
|
1647
1671
|
var _a;
|
|
1648
|
-
return (
|
|
1672
|
+
return (React__namespace.createElement(Tag, { key: row.id, caption: getCaption(row), tabIndex: -1, size: props.size ? getPickerTogglerButtonSize(props.size) : '30', onClear: e => {
|
|
1649
1673
|
row.onCheck && row.onCheck(row);
|
|
1650
1674
|
e.stopPropagation();
|
|
1651
1675
|
}, isDisabled: props.isDisabled || props.isReadonly || ((_a = row === null || row === void 0 ? void 0 : row.checkbox) === null || _a === void 0 ? void 0 : _a.isDisabled) }));
|
|
1652
1676
|
};
|
|
1653
|
-
return (
|
|
1677
|
+
return (React__namespace.createElement(uuiComponents.PickerToggler, Object.assign({}, props, { ref: ref, cx: [applyPickerTogglerMods(props), props.cx], renderItem: !!props.renderItem ? props.renderItem : renderItem, getName: (item) => props.getName ? props.getName(item) : item, cancelIcon: systemIcons[props.size || defaultSize$1].clear, dropdownIcon: systemIcons[props.size || defaultSize$1].foldingArrow })));
|
|
1654
1678
|
}
|
|
1655
|
-
const PickerToggler =
|
|
1679
|
+
const PickerToggler = React__namespace.forwardRef(PickerTogglerComponent);
|
|
1656
1680
|
|
|
1657
1681
|
var css$2 = {"root":"PickerItem_root__m-i2g","multiline-vertical-padding-24":"PickerItem_multiline-vertical-padding-24__ivzzQ","multiline-vertical-padding-30":"PickerItem_multiline-vertical-padding-30__tBEW-","multiline-vertical-padding-36":"PickerItem_multiline-vertical-padding-36__NpueM","multiline-vertical-padding-42":"PickerItem_multiline-vertical-padding-42__UjLpR","multiline-vertical-padding-48":"PickerItem_multiline-vertical-padding-48__65Jdv","multilineVerticalPadding24":"PickerItem_multiline-vertical-padding-24__ivzzQ","multilineVerticalPadding30":"PickerItem_multiline-vertical-padding-30__tBEW-","multilineVerticalPadding36":"PickerItem_multiline-vertical-padding-36__NpueM","multilineVerticalPadding42":"PickerItem_multiline-vertical-padding-42__UjLpR","multilineVerticalPadding48":"PickerItem_multiline-vertical-padding-48__65Jdv"};
|
|
1658
1682
|
|
|
1659
1683
|
const defaultSize = '36';
|
|
1660
|
-
class PickerItem extends
|
|
1684
|
+
class PickerItem extends React__namespace.Component {
|
|
1661
1685
|
constructor() {
|
|
1662
1686
|
super(...arguments);
|
|
1663
1687
|
this.getAvatarSize = (size, isMultiline) => {
|
|
@@ -1668,12 +1692,12 @@ class PickerItem extends React.Component {
|
|
|
1668
1692
|
const { size, avatarUrl, title, subtitle, isLoading, isDisabled } = this.props;
|
|
1669
1693
|
const itemSize = size && size !== 'none' ? size : defaultSize;
|
|
1670
1694
|
const isMultiline = !!(title && subtitle);
|
|
1671
|
-
return (
|
|
1672
|
-
|
|
1673
|
-
avatarUrl &&
|
|
1674
|
-
|
|
1675
|
-
title &&
|
|
1676
|
-
subtitle &&
|
|
1695
|
+
return (React__namespace.createElement(FlexCell, { width: 'auto', cx: css$2.root },
|
|
1696
|
+
React__namespace.createElement(FlexRow, { size: itemSize, cx: isMultiline && css$2[`multiline-vertical-padding-${itemSize}`], spacing: '12' },
|
|
1697
|
+
avatarUrl && React__namespace.createElement(Avatar, { isLoading: isLoading, img: avatarUrl, size: this.getAvatarSize(itemSize, isMultiline).toString() }),
|
|
1698
|
+
React__namespace.createElement(FlexCell, { width: 'auto' },
|
|
1699
|
+
title && React__namespace.createElement(Text, { size: itemSize, cx: css$2.text, color: isDisabled ? 'disabled' : 'primary' }, isLoading ? React__namespace.createElement(TextPlaceholder, { wordsCount: 2 }) : title),
|
|
1700
|
+
subtitle && React__namespace.createElement(Text, { size: itemSize, color: 'disabled', cx: css$2.text }, isLoading ? React__namespace.createElement(TextPlaceholder, { wordsCount: 2 }) : subtitle)))));
|
|
1677
1701
|
}
|
|
1678
1702
|
}
|
|
1679
1703
|
|
|
@@ -1681,24 +1705,24 @@ var css$1 = {"panel":"PickerInput_panel__0GHsI","footer-wrapper":"PickerInput_fo
|
|
|
1681
1705
|
|
|
1682
1706
|
const pickerHeight = 300;
|
|
1683
1707
|
const pickerWidth = 360;
|
|
1684
|
-
class PickerInput extends PickerInputBase {
|
|
1708
|
+
class PickerInput extends uuiComponents.PickerInputBase {
|
|
1685
1709
|
constructor() {
|
|
1686
1710
|
super(...arguments);
|
|
1687
1711
|
this.renderItem = (item, rowProps) => {
|
|
1688
|
-
return
|
|
1712
|
+
return React__namespace.default.createElement(PickerItem, Object.assign({ title: this.getName(item), size: this.getRowSize() }, rowProps));
|
|
1689
1713
|
};
|
|
1690
1714
|
this.renderRow = (rowProps) => {
|
|
1691
|
-
return this.props.renderRow ? this.props.renderRow(rowProps) : (
|
|
1715
|
+
return this.props.renderRow ? this.props.renderRow(rowProps) : (React__namespace.default.createElement(DataPickerRow, Object.assign({}, rowProps, { key: rowProps.rowKey, borderBottom: 'none', size: this.getRowSize(), rawProps: { 'aria-selected': rowProps.isSelectable && rowProps.isSelected, role: 'option' }, padding: this.props.editMode === 'modal' ? '24' : '12', renderItem: this.renderItem })));
|
|
1692
1716
|
};
|
|
1693
1717
|
}
|
|
1694
1718
|
toggleModalOpening(opened) {
|
|
1695
1719
|
const _a = this.props, restProps = __rest(_a, ["renderFooter"]);
|
|
1696
|
-
this.context.uuiModals.show(props =>
|
|
1720
|
+
this.context.uuiModals.show(props => React__namespace.default.createElement(PickerModal, Object.assign({}, restProps, props, { caption: this.getPlaceholder(), initialValue: this.props.value, renderRow: this.renderRow, selectionMode: this.props.selectionMode, valueType: this.props.valueType })))
|
|
1697
1721
|
.then(newSelection => this.handleSelectionValueChange(newSelection))
|
|
1698
1722
|
.catch(() => null);
|
|
1699
1723
|
}
|
|
1700
1724
|
getRowSize() {
|
|
1701
|
-
return isMobile()
|
|
1725
|
+
return uuiCore.isMobile()
|
|
1702
1726
|
? '48'
|
|
1703
1727
|
: this.props.editMode === 'modal'
|
|
1704
1728
|
? '36'
|
|
@@ -1707,68 +1731,68 @@ class PickerInput extends PickerInputBase {
|
|
|
1707
1731
|
getTogglerMods() {
|
|
1708
1732
|
return {
|
|
1709
1733
|
size: this.props.size,
|
|
1710
|
-
mode: this.props.mode ? this.props.mode : EditMode.FORM,
|
|
1734
|
+
mode: this.props.mode ? this.props.mode : exports.EditMode.FORM,
|
|
1711
1735
|
};
|
|
1712
1736
|
}
|
|
1713
1737
|
renderFooter() {
|
|
1714
1738
|
const footerProps = this.getFooterProps();
|
|
1715
1739
|
return this.props.renderFooter
|
|
1716
1740
|
? this.props.renderFooter(footerProps)
|
|
1717
|
-
:
|
|
1741
|
+
: React__namespace.default.createElement(DataPickerFooter, Object.assign({}, footerProps, { size: this.props.size }));
|
|
1718
1742
|
}
|
|
1719
1743
|
renderTarget(targetProps) {
|
|
1720
|
-
const renderTarget = this.props.renderToggler || (props =>
|
|
1721
|
-
return (
|
|
1744
|
+
const renderTarget = this.props.renderToggler || (props => React__namespace.default.createElement(PickerToggler, Object.assign({}, props)));
|
|
1745
|
+
return (React__namespace.default.createElement(uuiCore.IEditableDebouncer, { value: targetProps.value, onValueChange: this.handleTogglerSearchChange, render: editableProps => renderTarget(Object.assign(Object.assign(Object.assign({}, this.getTogglerMods()), targetProps), editableProps)) }));
|
|
1722
1746
|
}
|
|
1723
1747
|
renderBody(props, rows) {
|
|
1724
1748
|
const renderedDataRows = rows.map((props) => this.renderRow(props));
|
|
1725
|
-
const maxHeight = isMobile() ? document.documentElement.clientHeight : (this.props.dropdownHeight || pickerHeight);
|
|
1726
|
-
const minBodyWidth = isMobile() ? document.documentElement.clientWidth : (this.props.minBodyWidth || pickerWidth);
|
|
1727
|
-
return (
|
|
1728
|
-
|
|
1729
|
-
|
|
1749
|
+
const maxHeight = uuiCore.isMobile() ? document.documentElement.clientHeight : (this.props.dropdownHeight || pickerHeight);
|
|
1750
|
+
const minBodyWidth = uuiCore.isMobile() ? document.documentElement.clientWidth : (this.props.minBodyWidth || pickerWidth);
|
|
1751
|
+
return (React__namespace.default.createElement(Panel, { shadow: true, style: { width: props.togglerWidth > minBodyWidth ? props.togglerWidth : minBodyWidth }, rawProps: { tabIndex: -1 }, cx: [css$1.panel, uuiCore.uuiMarkers.lockFocus], background: true },
|
|
1752
|
+
React__namespace.default.createElement(MobileDropdownWrapper, { title: this.props.entityName, close: () => this.toggleBodyOpening(false) },
|
|
1753
|
+
React__namespace.default.createElement(DataPickerBody, Object.assign({}, props, { rows: renderedDataRows, maxHeight: maxHeight, searchSize: this.props.size, editMode: 'dropdown' })),
|
|
1730
1754
|
!this.isSingleSelect() && this.renderFooter())));
|
|
1731
1755
|
}
|
|
1732
1756
|
}
|
|
1733
1757
|
|
|
1734
1758
|
var css = {"row":"PickerListItem_row__1Uzrn"};
|
|
1735
1759
|
|
|
1736
|
-
class PickerListItem extends
|
|
1760
|
+
class PickerListItem extends React__namespace.default.Component {
|
|
1737
1761
|
render() {
|
|
1738
1762
|
let label;
|
|
1739
1763
|
if (this.props.isLoading) {
|
|
1740
|
-
label =
|
|
1764
|
+
label = React__namespace.default.createElement(TextPlaceholder, { wordsCount: 2 });
|
|
1741
1765
|
}
|
|
1742
1766
|
else {
|
|
1743
1767
|
label = this.props.getName(this.props.value);
|
|
1744
1768
|
}
|
|
1745
1769
|
let component;
|
|
1746
1770
|
if (this.props.checkbox) {
|
|
1747
|
-
component =
|
|
1771
|
+
component = React__namespace.default.createElement(Checkbox, Object.assign({}, this.props.checkbox, { isDisabled: this.props.isLoading || this.props.checkbox.isDisabled, label: label, value: this.props.isChecked, onValueChange: () => this.props.onCheck(this.props) }));
|
|
1748
1772
|
}
|
|
1749
1773
|
else {
|
|
1750
|
-
component =
|
|
1774
|
+
component = React__namespace.default.createElement(RadioInput, { label: label, value: this.props.isSelected, isDisabled: this.props.isLoading || !this.props.isSelectable, onValueChange: () => this.props.onSelect(this.props) });
|
|
1751
1775
|
}
|
|
1752
|
-
return
|
|
1776
|
+
return React__namespace.default.createElement("div", { className: css.row }, component);
|
|
1753
1777
|
}
|
|
1754
1778
|
}
|
|
1755
1779
|
|
|
1756
|
-
class PickerList extends PickerListBase {
|
|
1780
|
+
class PickerList extends uuiComponents.PickerListBase {
|
|
1757
1781
|
constructor() {
|
|
1758
1782
|
super(...arguments);
|
|
1759
1783
|
this.sessionStartTime = (new Date()).getTime();
|
|
1760
1784
|
this.renderRow = (row) => {
|
|
1761
|
-
return
|
|
1785
|
+
return React__namespace.default.createElement(PickerListItem, Object.assign({ getName: item => this.getName(item) }, row, { key: row.rowKey }));
|
|
1762
1786
|
};
|
|
1763
1787
|
this.handleShowPicker = () => {
|
|
1764
1788
|
this.context.uuiModals
|
|
1765
|
-
.show(props => (
|
|
1789
|
+
.show(props => (React__namespace.default.createElement(PickerModal, Object.assign({}, props, this.props, { caption: this.props.placeholder || `Please select ${this.getEntityName() ? this.getEntityName() : ""}`, initialValue: this.props.value, selectionMode: this.props.selectionMode, valueType: this.props.valueType }))))
|
|
1766
1790
|
.then((value) => {
|
|
1767
1791
|
this.appendLastSelected([...this.getSelectedIdsArray(value)]);
|
|
1768
1792
|
this.props.onValueChange(value);
|
|
1769
1793
|
});
|
|
1770
1794
|
};
|
|
1771
|
-
this.defaultRenderToggler = (props) => (
|
|
1795
|
+
this.defaultRenderToggler = (props) => (React__namespace.default.createElement(LinkButton, Object.assign({ caption: 'Show all' }, props)));
|
|
1772
1796
|
}
|
|
1773
1797
|
render() {
|
|
1774
1798
|
const view = this.getView();
|
|
@@ -1778,10 +1802,10 @@ class PickerList extends PickerListBase {
|
|
|
1778
1802
|
const showPicker = viewProps.totalCount == null || viewProps.totalCount > this.getMaxDefaultItems();
|
|
1779
1803
|
const renderToggler = this.props.renderModalToggler || this.defaultRenderToggler;
|
|
1780
1804
|
const renderRow = this.props.renderRow || this.renderRow;
|
|
1781
|
-
return (
|
|
1805
|
+
return (React__namespace.default.createElement("div", null,
|
|
1782
1806
|
!rows.length && (this.props.noOptionsMessage ?
|
|
1783
1807
|
this.props.noOptionsMessage :
|
|
1784
|
-
|
|
1808
|
+
React__namespace.default.createElement(Text, { color: 'secondary', size: this.props.size }, "No options available")),
|
|
1785
1809
|
rows.map(row => renderRow(row)),
|
|
1786
1810
|
showPicker && renderToggler({
|
|
1787
1811
|
onClick: this.handleShowPicker,
|
|
@@ -1789,7 +1813,88 @@ class PickerList extends PickerListBase {
|
|
|
1789
1813
|
}, selectedRows)));
|
|
1790
1814
|
}
|
|
1791
1815
|
}
|
|
1792
|
-
PickerList.contextType = UuiContext;
|
|
1793
|
-
|
|
1794
|
-
|
|
1816
|
+
PickerList.contextType = uuiCore.UuiContext;
|
|
1817
|
+
|
|
1818
|
+
exports.Accordion = Accordion;
|
|
1819
|
+
exports.Avatar = Avatar;
|
|
1820
|
+
exports.Badge = Badge;
|
|
1821
|
+
exports.Button = Button;
|
|
1822
|
+
exports.Checkbox = Checkbox;
|
|
1823
|
+
exports.ClearNotification = ClearNotification;
|
|
1824
|
+
exports.ControlGroup = ControlGroup;
|
|
1825
|
+
exports.DataPickerBody = DataPickerBody;
|
|
1826
|
+
exports.DataPickerFooter = DataPickerFooter;
|
|
1827
|
+
exports.DataPickerHeader = DataPickerHeader;
|
|
1828
|
+
exports.DataPickerRow = DataPickerRow;
|
|
1829
|
+
exports.DataTableCell = DataTableCell;
|
|
1830
|
+
exports.Dropdown = Dropdown;
|
|
1831
|
+
exports.DropdownContainer = DropdownContainer;
|
|
1832
|
+
exports.DropdownControlKeys = DropdownControlKeys;
|
|
1833
|
+
exports.DropdownMenuBody = DropdownMenuBody;
|
|
1834
|
+
exports.DropdownMenuButton = DropdownMenuButton;
|
|
1835
|
+
exports.DropdownMenuHeader = DropdownMenuHeader;
|
|
1836
|
+
exports.DropdownMenuSplitter = DropdownMenuSplitter;
|
|
1837
|
+
exports.DropdownMenuSwitchButton = DropdownMenuSwitchButton;
|
|
1838
|
+
exports.DropdownSubMenu = DropdownSubMenu;
|
|
1839
|
+
exports.ErrorNotification = ErrorNotification;
|
|
1840
|
+
exports.FlexCell = FlexCell;
|
|
1841
|
+
exports.FlexRow = FlexRow;
|
|
1842
|
+
exports.FlexSpacer = FlexSpacer;
|
|
1843
|
+
exports.HintNotification = HintNotification;
|
|
1844
|
+
exports.IconButton = IconButton;
|
|
1845
|
+
exports.IconContainer = IconContainer;
|
|
1846
|
+
exports.LabeledInput = LabeledInput;
|
|
1847
|
+
exports.LinkButton = LinkButton;
|
|
1848
|
+
exports.MobileDropdownWrapper = MobileDropdownWrapper;
|
|
1849
|
+
exports.ModalBlocker = ModalBlocker;
|
|
1850
|
+
exports.ModalFooter = ModalFooter;
|
|
1851
|
+
exports.ModalHeader = ModalHeader;
|
|
1852
|
+
exports.ModalWindow = ModalWindow;
|
|
1853
|
+
exports.NotificationCard = NotificationCard;
|
|
1854
|
+
exports.Panel = Panel;
|
|
1855
|
+
exports.PickerInput = PickerInput;
|
|
1856
|
+
exports.PickerItem = PickerItem;
|
|
1857
|
+
exports.PickerList = PickerList;
|
|
1858
|
+
exports.PickerListItem = PickerListItem;
|
|
1859
|
+
exports.PickerModal = PickerModal;
|
|
1860
|
+
exports.PickerModalImpl = PickerModalImpl;
|
|
1861
|
+
exports.PickerToggler = PickerToggler;
|
|
1862
|
+
exports.Preset = Preset;
|
|
1863
|
+
exports.Presets = Presets;
|
|
1864
|
+
exports.RadioGroup = RadioGroup;
|
|
1865
|
+
exports.RadioInput = RadioInput;
|
|
1866
|
+
exports.ScrollBars = ScrollBars;
|
|
1867
|
+
exports.SearchInput = SearchInput;
|
|
1868
|
+
exports.SuccessNotification = SuccessNotification;
|
|
1869
|
+
exports.Switch = Switch;
|
|
1870
|
+
exports.TabButton = TabButton;
|
|
1871
|
+
exports.Tag = Tag;
|
|
1872
|
+
exports.Text = Text;
|
|
1873
|
+
exports.TextInput = TextInput;
|
|
1874
|
+
exports.TextPlaceholder = TextPlaceholder;
|
|
1875
|
+
exports.Tooltip = Tooltip;
|
|
1876
|
+
exports.VerticalTabButton = VerticalTabButton;
|
|
1877
|
+
exports.VirtualList = VirtualList;
|
|
1878
|
+
exports.WarningNotification = WarningNotification;
|
|
1879
|
+
exports.allButtonColors = allButtonColors;
|
|
1880
|
+
exports.allButtonModes = allButtonModes;
|
|
1881
|
+
exports.allEpamSemanticColors = allEpamSemanticColors;
|
|
1882
|
+
exports.allFontStyles = allFontStyles;
|
|
1883
|
+
exports.allIconColors = allIconColors;
|
|
1884
|
+
exports.allRowSizes = allRowSizes;
|
|
1885
|
+
exports.allSizes = allSizes;
|
|
1886
|
+
exports.allTextSizes = allTextSizes;
|
|
1887
|
+
exports.applyBadgeMods = applyBadgeMods;
|
|
1888
|
+
exports.applyButtonMods = applyButtonMods;
|
|
1889
|
+
exports.applyCheckboxMods = applyCheckboxMods;
|
|
1890
|
+
exports.applyIconContainerMods = applyIconContainerMods;
|
|
1891
|
+
exports.applySwitchMods = applySwitchMods;
|
|
1892
|
+
exports.applyTagMods = applyTagMods;
|
|
1893
|
+
exports.applyTextInputMods = applyTextInputMods;
|
|
1894
|
+
Object.keys(uuiCore).forEach(function (k) {
|
|
1895
|
+
if (k !== 'default' && !exports.hasOwnProperty(k)) Object.defineProperty(exports, k, {
|
|
1896
|
+
enumerable: true,
|
|
1897
|
+
get: function () { return uuiCore[k]; }
|
|
1898
|
+
});
|
|
1899
|
+
});
|
|
1795
1900
|
//# sourceMappingURL=index.js.map
|