@reportportal/ui-kit 0.0.1-alpha.74 → 0.0.1-alpha.76

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.
@@ -42,6 +42,7 @@ export { default as PriorityLowIcon } from './svg/priorityLow.svg';
42
42
  export { default as PriorityMediumIcon } from './svg/priorityMedium.svg';
43
43
  export { default as PriorityUnspecifiedIcon } from './svg/priorityUnspecified.svg';
44
44
  export { default as RerunIcon } from './svg/rerun.svg';
45
+ export { default as RefreshIcon } from './svg/refresh.svg';
45
46
  export { default as SearchIcon } from './svg/search.svg';
46
47
  export { default as SortIcon } from './svg/sort.svg';
47
48
  export { default as StatusSuccessIcon } from './svg/statusSuccess.svg';
@@ -4,7 +4,7 @@ import { c as R } from "./bind-06a7ff84.js";
4
4
  import { useMemo as P, useRef as B } from "react";
5
5
  import { F as D } from "./fieldText-450abb26.js";
6
6
  import { a as E, S as j } from "./calendarArrow-3e1339ea.js";
7
- import { D as T } from "./dropdown-1cd6958d.js";
7
+ import { D as T } from "./dropdown-9427f821.js";
8
8
  import { registerLocale as G } from "react-datepicker";
9
9
  const pe = (r, s) => {
10
10
  G(r, s);
@@ -1,5 +1,5 @@
1
- import { D as t } from "./datePicker-1d15d256.js";
2
- import { r as v } from "./datePicker-1d15d256.js";
1
+ import { D as t } from "./datePicker-0f8c9302.js";
2
+ import { r as v } from "./datePicker-0f8c9302.js";
3
3
  import "react/jsx-runtime";
4
4
  import "react-datepicker/dist/es/index.js";
5
5
  import "./bind-06a7ff84.js";
@@ -11,7 +11,7 @@ import "./spinLoader-c4a53718.js";
11
11
  import "./maxValueDisplay-9be01a75.js";
12
12
  import "./fieldLabel.js";
13
13
  import "./calendarArrow-3e1339ea.js";
14
- import "./dropdown-1cd6958d.js";
14
+ import "./dropdown-9427f821.js";
15
15
  import "@floating-ui/react-dom";
16
16
  import "downshift";
17
17
  import "rc-scrollbars";
@@ -0,0 +1,282 @@
1
+ import { jsxs as u, jsx as d, Fragment as U } from "react/jsx-runtime";
2
+ import { forwardRef as _e, useState as q, useRef as he } from "react";
3
+ import { c as J } from "./bind-06a7ff84.js";
4
+ import { useFloating as fe, offset as ue, flip as ge } from "@floating-ui/react-dom";
5
+ import { useSelect as P } from "downshift";
6
+ import { Scrollbars as pe } from "rc-scrollbars";
7
+ import { u as me } from "./useOnClickOutside-c332f7d3.js";
8
+ import { K as p } from "./keyCodes-f63c0e11.js";
9
+ import { B as ye } from "./baseIconButton-251479f7.js";
10
+ import { S as be } from "./dropdown-0260bb66.js";
11
+ import { FieldLabel as Ce } from "./fieldLabel.js";
12
+ import { C as Oe } from "./checkbox-aa91985d.js";
13
+ const ke = "_disabled_1etj7_12", Ne = "_hidden_1etj7_16", De = "_hover_1etj7_22", Ee = "_selected_1etj7_34", we = {
14
+ "dropdown-option": "_dropdown-option_1etj7_1",
15
+ disabled: ke,
16
+ hidden: Ne,
17
+ hover: De,
18
+ selected: Ee,
19
+ "multi-select": "_multi-select_1etj7_34",
20
+ "single-option": "_single-option_1etj7_39",
21
+ "sub-option": "_sub-option_1etj7_46"
22
+ }, z = J.bind(we), G = _e(
23
+ (n, t) => {
24
+ const {
25
+ option: { value: r, disabled: i, hidden: v, label: m, title: c, groupRef: a },
26
+ selected: b,
27
+ onChange: y,
28
+ render: C,
29
+ highlightHovered: O,
30
+ onMouseEnter: K,
31
+ multiSelect: h,
32
+ isPartiallyChecked: k = !1
33
+ } = n, A = (N) => {
34
+ (N.target instanceof HTMLDivElement || N.target instanceof HTMLInputElement) && (y == null || y(r));
35
+ };
36
+ return /* @__PURE__ */ u(
37
+ "div",
38
+ {
39
+ className: z("dropdown-option", {
40
+ selected: b,
41
+ disabled: i,
42
+ hidden: v,
43
+ hover: O,
44
+ "multi-select": h
45
+ }),
46
+ title: c,
47
+ onClick: A,
48
+ ref: t,
49
+ onMouseEnter: K,
50
+ children: [
51
+ h && /* @__PURE__ */ d(Oe, { value: !!b, partiallyChecked: k }),
52
+ /* @__PURE__ */ d("div", { className: z("single-option", { "sub-option": !!a }), children: C ? C(n) : m })
53
+ ]
54
+ }
55
+ );
56
+ }
57
+ ), ve = [
58
+ p.ENTER_KEY_CODE,
59
+ p.SPACE_KEY_CODE,
60
+ p.ARROW_DOWN_KEY_CODE
61
+ ], Ke = [p.ESCAPE_KEY_CODE, p.TAB_KEY_CODE];
62
+ var g = /* @__PURE__ */ ((n) => (n.ON_KEY_DOWN = "onKeyDown", n.ON_CLICK = "onClick", n))(g || {});
63
+ const Ae = (n, t) => {
64
+ const r = Array.isArray(t) ? t : [t];
65
+ return n.findIndex(({ value: i }) => r.includes(i));
66
+ }, xe = (n, t) => (n % t + t) % t, Y = (n, t = 0, r = 1) => {
67
+ if (!n[t].disabled)
68
+ return t;
69
+ const i = n.length;
70
+ return Y(
71
+ n,
72
+ xe(t + r, i),
73
+ r
74
+ );
75
+ }, Ie = (n, t) => Y(n, t), Pe = (n, t) => Y(n, t, -1), Ye = "_container_5enku_1", je = "_icon_5enku_7", Re = "_arrow_5enku_13", Te = "_dropdown_5enku_19", He = "_disabled_5enku_36", Me = "_value_5enku_43", We = "_error_5enku_46", Le = "_touched_5enku_46", Se = "_opened_5enku_50", Ve = "_placeholder_5enku_83", $e = "_ghost_5enku_118", Ue = "_divider_5enku_139", qe = {
76
+ container: Ye,
77
+ icon: je,
78
+ arrow: Re,
79
+ dropdown: Te,
80
+ "transparent-background": "_transparent-background_5enku_33",
81
+ disabled: He,
82
+ value: Me,
83
+ error: We,
84
+ touched: Le,
85
+ opened: Se,
86
+ placeholder: Ve,
87
+ "mobile-disabled": "_mobile-disabled_5enku_87",
88
+ "select-list": "_select-list_5enku_92",
89
+ "limited-width": "_limited-width_5enku_109",
90
+ "options-container": "_options-container_5enku_113",
91
+ ghost: $e,
92
+ divider: Ue
93
+ }, o = J.bind(qe), dt = ({
94
+ multiSelect: n = !1,
95
+ value: t = n ? [] : "",
96
+ options: r = [],
97
+ disabled: i = !1,
98
+ error: v,
99
+ onChange: m,
100
+ onFocus: c,
101
+ onBlur: a,
102
+ mobileDisabled: b,
103
+ title: y,
104
+ touched: C = !1,
105
+ icon: O,
106
+ variant: K,
107
+ placeholder: h = "",
108
+ label: k = "",
109
+ renderOption: A,
110
+ transparentBackground: N = !1,
111
+ className: Q,
112
+ toggleButtonClassName: X,
113
+ isListWidthLimited: Z = !1,
114
+ optionAll: j = { value: "all", label: "All" },
115
+ isOptionAllVisible: R = !1,
116
+ onSelectAll: F = () => {
117
+ },
118
+ formatDisplayedValue: T,
119
+ notScrollable: B = !1,
120
+ footer: H
121
+ }) => {
122
+ const [_, f] = q(!1), M = he(null), [ee, D] = q(null), x = n && Array.isArray(t) ? r.filter((e) => t.includes(e.value)) : null, { refs: W, floatingStyles: te } = fe({
123
+ placement: "bottom-start",
124
+ middleware: [
125
+ ue(5),
126
+ ge({
127
+ fallbackPlacements: ["bottom-start", "top-start", "bottom", "top"]
128
+ })
129
+ ]
130
+ }), ne = () => {
131
+ if (R && Array.isArray(t)) {
132
+ const e = r.map((s) => s.value);
133
+ m(t.length === r.length ? [] : e), F();
134
+ }
135
+ };
136
+ me(M, () => {
137
+ _ && (f(!1), a == null || a());
138
+ });
139
+ const L = (e) => {
140
+ if (!e.disabled) {
141
+ if (n) {
142
+ const s = Array.isArray(t) ? [...t] : [], l = s.indexOf(e.value);
143
+ l === -1 ? s.push(e.value) : s.splice(l, 1), m(s);
144
+ } else
145
+ m(e.value);
146
+ f((s) => n || !s);
147
+ }
148
+ }, re = () => r.find(({ value: e }) => e === t), S = Ae(r, t), {
149
+ getToggleButtonProps: se,
150
+ getLabelProps: ae,
151
+ getMenuProps: de,
152
+ getItemProps: le,
153
+ setHighlightedIndex: E,
154
+ highlightedIndex: V,
155
+ selectedItem: w
156
+ } = P({
157
+ items: r,
158
+ itemToString: (e) => (e != null && e.label ? String(e.label) : h) || "",
159
+ selectedItem: re(),
160
+ isOpen: _,
161
+ circularNavigation: !0,
162
+ defaultHighlightedIndex: S,
163
+ onHighlightedIndexChange: (e) => {
164
+ switch (e.type) {
165
+ case P.stateChangeTypes.MenuKeyDownArrowUp:
166
+ return D(g.ON_KEY_DOWN), E(Pe(r, e.highlightedIndex)), e;
167
+ case P.stateChangeTypes.MenuKeyDownArrowDown:
168
+ return D(g.ON_KEY_DOWN), E(Ie(r, e.highlightedIndex)), e;
169
+ default:
170
+ return e;
171
+ }
172
+ }
173
+ }), ie = () => {
174
+ i || (f((e) => !e), _ ? a == null || a() : c == null || c(), D(g.ON_CLICK));
175
+ }, I = (() => {
176
+ if (n && Array.isArray(t) && r.length === t.length)
177
+ return j.label;
178
+ const e = r.reduce((s, l) => ((Array.isArray(t) && t.includes(l.value) || l.value === t) && s.push(l.label), s), []);
179
+ if (e.length > 0)
180
+ return e.join(", ");
181
+ if (!t && t !== !1 && t !== 0 || Array.isArray(t) && !t.length)
182
+ return h;
183
+ })(), oe = (e) => {
184
+ const { keyCode: s } = e;
185
+ ve.includes(s) && !_ && (e.preventDefault(), E(S), f(!0), c == null || c(), D(g.ON_KEY_DOWN));
186
+ }, ce = (e) => {
187
+ const { keyCode: s } = e;
188
+ if (s === p.ENTER_KEY_CODE) {
189
+ const l = r[V];
190
+ L(l), n || (f(!1), a == null || a());
191
+ return;
192
+ }
193
+ Ke.includes(s) && (e.stopPropagation(), f(!1), a == null || a());
194
+ }, $ = () => /* @__PURE__ */ u("div", { className: o("options-container"), children: [
195
+ n && R && Array.isArray(t) && /* @__PURE__ */ u(U, { children: [
196
+ /* @__PURE__ */ d(
197
+ G,
198
+ {
199
+ option: j,
200
+ selected: t.length === r.length,
201
+ onChange: ne,
202
+ multiSelect: n,
203
+ isPartiallyChecked: !!t.length
204
+ }
205
+ ),
206
+ /* @__PURE__ */ d("div", { className: o("divider") }),
207
+ " "
208
+ ] }),
209
+ r.map((e, s) => /* @__PURE__ */ d(
210
+ G,
211
+ {
212
+ ...le({
213
+ item: e,
214
+ index: s
215
+ }),
216
+ multiSelect: n,
217
+ selected: n ? x == null ? void 0 : x.some((l) => l.value === e.value) : e.value === ((w == null ? void 0 : w.value) ?? w),
218
+ option: { title: e.label, ...e },
219
+ highlightHovered: V === s && ee !== g.ON_CLICK,
220
+ render: A,
221
+ onChange: e.disabled ? null : () => L(e),
222
+ onMouseEnter: () => E(s)
223
+ },
224
+ e.value
225
+ )),
226
+ H && /* @__PURE__ */ u(U, { children: [
227
+ /* @__PURE__ */ d("div", { className: o("divider") }),
228
+ H
229
+ ] })
230
+ ] });
231
+ return /* @__PURE__ */ u("div", { ref: M, className: o("container", Q), title: y, children: [
232
+ k && /* @__PURE__ */ d(Ce, { ...ae(), children: k }),
233
+ /* @__PURE__ */ u(
234
+ "button",
235
+ {
236
+ disabled: i,
237
+ ...se({
238
+ className: o("dropdown", K, X, {
239
+ "transparent-background": N,
240
+ opened: _,
241
+ disabled: i,
242
+ error: v,
243
+ touched: C,
244
+ "mobile-disabled": b
245
+ }),
246
+ onClick: ie,
247
+ onKeyDown: oe,
248
+ ref: W.setReference
249
+ }),
250
+ type: "button",
251
+ children: [
252
+ O && /* @__PURE__ */ d("span", { className: o("icon"), children: O }),
253
+ /* @__PURE__ */ d(
254
+ "span",
255
+ {
256
+ className: o("value", {
257
+ placeholder: I === h
258
+ }),
259
+ children: T ? T(I) : I
260
+ }
261
+ ),
262
+ /* @__PURE__ */ d(ye, { className: o("arrow"), tabIndex: -1, children: /* @__PURE__ */ d(be, {}) })
263
+ ]
264
+ }
265
+ ),
266
+ _ && /* @__PURE__ */ d(
267
+ "div",
268
+ {
269
+ style: te,
270
+ className: o("select-list", { opened: _, "limited-width": Z }),
271
+ ...de({
272
+ onKeyDown: ce,
273
+ ref: W.setFloating
274
+ }),
275
+ children: B ? $() : /* @__PURE__ */ d(pe, { autoHeight: !0, autoHeightMax: 216, hideTracksWhenNotNeeded: !0, children: $() })
276
+ }
277
+ )
278
+ ] });
279
+ };
280
+ export {
281
+ dt as D
282
+ };
package/dist/dropdown.js CHANGED
@@ -1,4 +1,4 @@
1
- import { D as r } from "./dropdown-1cd6958d.js";
1
+ import { D as r } from "./dropdown-9427f821.js";
2
2
  import "react/jsx-runtime";
3
3
  import "react";
4
4
  import "./bind-06a7ff84.js";