@reportportal/ui-kit 0.0.1-alpha.6 → 0.0.1-alpha.61

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (150) hide show
  1. package/LICENSE +201 -201
  2. package/README.md +255 -3
  3. package/dist/arrowUp-4a5caee7.js +6 -0
  4. package/dist/baseIconButton-251479f7.js +25 -0
  5. package/dist/baseIconButton.js +7 -0
  6. package/dist/bubblesLoader-a7e709d4.js +17 -0
  7. package/dist/bubblesLoader.js +1 -1
  8. package/dist/button-33c88abf.js +62 -0
  9. package/dist/button.js +1 -1
  10. package/dist/calendarArrow-3e1339ea.js +6 -0
  11. package/dist/checkbox-9a6c7ce1.js +73 -0
  12. package/dist/checkbox.js +1 -1
  13. package/dist/close-4b33d7c1.js +5 -0
  14. package/dist/common/hooks/useOnClickOutside.d.ts +1 -0
  15. package/dist/common/types.d.ts +3 -0
  16. package/dist/components/baseIconButton/baseIconButton.d.ts +9 -0
  17. package/dist/components/baseIconButton/index.d.ts +5 -0
  18. package/dist/components/bubblesLoader/bubblesLoader.d.ts +1 -0
  19. package/dist/components/bubblesLoader/index.d.ts +1 -0
  20. package/dist/components/button/button.d.ts +1 -1
  21. package/dist/components/button/index.d.ts +3 -2
  22. package/dist/components/checkbox/checkbox.d.ts +3 -0
  23. package/dist/components/checkbox/index.d.ts +1 -0
  24. package/dist/components/datePicker/datePicker.d.ts +25 -0
  25. package/dist/components/datePicker/header/datePickerHeader.d.ts +16 -0
  26. package/dist/components/datePicker/header/index.d.ts +4 -0
  27. package/dist/components/datePicker/index.d.ts +5 -0
  28. package/dist/components/datePicker/utils.d.ts +4 -0
  29. package/dist/components/dropdown/constants.d.ts +5 -0
  30. package/dist/components/dropdown/dropdown.d.ts +13 -5
  31. package/dist/components/dropdown/dropdownOption/dropdownOption.d.ts +1 -0
  32. package/dist/components/dropdown/dropdownOption/index.d.ts +1 -0
  33. package/dist/components/dropdown/index.d.ts +1 -0
  34. package/dist/components/dropdown/types.d.ts +3 -0
  35. package/dist/components/dropdown/utils.d.ts +2 -1
  36. package/dist/components/fieldLabel/fieldLabel.d.ts +7 -0
  37. package/dist/components/fieldLabel/index.d.ts +1 -0
  38. package/dist/components/fieldNumber/constants.d.ts +1 -0
  39. package/dist/components/fieldNumber/fieldNumber.d.ts +2 -1
  40. package/dist/components/fieldNumber/index.d.ts +1 -0
  41. package/dist/components/fieldText/fieldText.d.ts +13 -5
  42. package/dist/components/fieldText/index.d.ts +1 -0
  43. package/dist/components/fieldText/types.d.ts +5 -0
  44. package/dist/components/fieldTextFlex/fieldTextFlex.d.ts +16 -0
  45. package/dist/components/fieldTextFlex/index.d.ts +4 -0
  46. package/dist/components/icons/index.d.ts +37 -0
  47. package/dist/components/index.d.ts +11 -1
  48. package/dist/components/maxValueDisplay/index.d.ts +4 -0
  49. package/dist/components/maxValueDisplay/maxValueDisplay.d.ts +8 -0
  50. package/dist/components/maxValueDisplay/utils/index.d.ts +1 -0
  51. package/dist/components/maxValueDisplay/utils/isPositiveInteger.d.ts +1 -0
  52. package/dist/components/modal/modal.d.ts +7 -2
  53. package/dist/components/modal/modalContent/modalContent.d.ts +2 -0
  54. package/dist/components/modal/modalFooter/modalFooter.d.ts +1 -0
  55. package/dist/components/modal/modalHeader/modalHeader.d.ts +2 -1
  56. package/dist/components/pagination/index.d.ts +5 -0
  57. package/dist/components/pagination/itemsCounter/index.d.ts +1 -0
  58. package/dist/components/pagination/itemsCounter/itemCounter.d.ts +10 -0
  59. package/dist/components/pagination/pageControls/activePage/activePage.d.ts +13 -0
  60. package/dist/components/pagination/pageControls/activePage/index.d.ts +1 -0
  61. package/dist/components/pagination/pageControls/activePage/pageSelector/index.d.ts +1 -0
  62. package/dist/components/pagination/pageControls/activePage/pageSelector/pageSelector.d.ts +11 -0
  63. package/dist/components/pagination/pageControls/index.d.ts +1 -0
  64. package/dist/components/pagination/pageControls/pageControls.d.ts +17 -0
  65. package/dist/components/pagination/pageControls/pageNavigator/bar/bar.d.ts +12 -0
  66. package/dist/components/pagination/pageControls/pageNavigator/bar/index.d.ts +1 -0
  67. package/dist/components/pagination/pageControls/pageNavigator/index.d.ts +1 -0
  68. package/dist/components/pagination/pageControls/pageNavigator/pageNavigator.d.ts +12 -0
  69. package/dist/components/pagination/pageSizeControl/index.d.ts +1 -0
  70. package/dist/components/pagination/pageSizeControl/pageSizeControl.d.ts +11 -0
  71. package/dist/components/pagination/pageSizeControl/sizeSelector/index.d.ts +1 -0
  72. package/dist/components/pagination/pageSizeControl/sizeSelector/sizeSelector.d.ts +9 -0
  73. package/dist/components/pagination/pagination.d.ts +23 -0
  74. package/dist/components/pagination/types.d.ts +2 -0
  75. package/dist/components/popover/index.d.ts +1 -0
  76. package/dist/components/popover/popover.d.ts +19 -0
  77. package/dist/components/radio/index.d.ts +5 -0
  78. package/dist/components/radio/radio.d.ts +17 -0
  79. package/dist/components/radio/radioGroup.d.ts +9 -0
  80. package/dist/components/spinLoader/index.d.ts +4 -0
  81. package/dist/components/spinLoader/spinLoader.d.ts +8 -0
  82. package/dist/components/systemAlert/index.d.ts +1 -0
  83. package/dist/components/systemAlert/systemAlert.d.ts +4 -0
  84. package/dist/components/systemAlert/types.d.ts +16 -0
  85. package/dist/components/systemMessage/index.d.ts +1 -0
  86. package/dist/components/systemMessage/systemMessage.d.ts +1 -0
  87. package/dist/components/table/index.d.ts +4 -0
  88. package/dist/components/table/table.d.ts +4 -0
  89. package/dist/components/table/types.d.ts +54 -0
  90. package/dist/components/table/utils.d.ts +4 -0
  91. package/dist/components/themeProvider/index.d.ts +1 -0
  92. package/dist/components/themeProvider/themeProvider.d.ts +3 -1
  93. package/dist/components/toggle/index.d.ts +1 -0
  94. package/dist/components/toggle/toggle.d.ts +1 -0
  95. package/dist/components/tooltip/index.d.ts +1 -0
  96. package/dist/components/tooltip/tooltip.d.ts +23 -0
  97. package/dist/datePicker-a2b6acf5.js +201 -0
  98. package/dist/datePicker.js +28 -0
  99. package/dist/dropdown-0260bb66.js +5 -0
  100. package/dist/dropdown-29285346.js +278 -0
  101. package/dist/dropdown.js +6 -4
  102. package/dist/fieldLabel.js +13 -0
  103. package/dist/fieldNumber-d81e551e.js +125 -0
  104. package/dist/fieldNumber.js +3 -3
  105. package/dist/fieldText-1ab17a11.js +158 -0
  106. package/dist/fieldText.js +6 -2
  107. package/dist/fieldTextFlex-314741ad.js +78 -0
  108. package/dist/fieldTextFlex.js +9 -0
  109. package/dist/icons.js +49 -0
  110. package/dist/index.js +92 -23
  111. package/dist/maxValueDisplay-9be01a75.js +13 -0
  112. package/dist/maxValueDisplay.js +6 -0
  113. package/dist/modal.js +114 -96
  114. package/dist/openEye-7b9cf080.js +7 -0
  115. package/dist/pagination-7c6ebae2.js +345 -0
  116. package/dist/pagination.js +20 -0
  117. package/dist/plus-0929dda4.js +6 -0
  118. package/dist/popover.js +95 -0
  119. package/dist/prevPage-87faf576.js +6 -0
  120. package/dist/radio-bccc84f2.js +76 -0
  121. package/dist/{icon.js → radio.js} +4 -4
  122. package/dist/spinLoader-c4a53718.js +11 -0
  123. package/dist/spinLoader.js +7 -0
  124. package/dist/style.css +1 -1
  125. package/dist/success-dc1914aa.js +7 -0
  126. package/dist/systemAlert.js +63 -0
  127. package/dist/systemMessage-1ced6079.js +30 -0
  128. package/dist/systemMessage.js +1 -1
  129. package/dist/table-32fc8c70.js +144 -0
  130. package/dist/table.js +11 -0
  131. package/dist/themeProvider-46c2be7b.js +23 -0
  132. package/dist/themeProvider.js +4 -3
  133. package/dist/toggle-1a3aacb5.js +59 -0
  134. package/dist/toggle.js +1 -1
  135. package/dist/tooltip.js +101 -0
  136. package/package.json +53 -17
  137. package/dist/bubblesLoader-9bec3797.js +0 -17
  138. package/dist/button-d4944dbc.js +0 -64
  139. package/dist/checkbox-fdc44740.js +0 -68
  140. package/dist/clear-4963efcd.js +0 -5
  141. package/dist/components/icon/icon.d.ts +0 -11
  142. package/dist/components/icon/icons.d.ts +0 -21
  143. package/dist/components/icon/index.d.ts +0 -3
  144. package/dist/dropdown-45e7bc7d.js +0 -204
  145. package/dist/fieldNumber-8417cd65.js +0 -132
  146. package/dist/fieldText-c7085849.js +0 -99
  147. package/dist/icon-71262f5c.js +0 -26
  148. package/dist/systemMessage-62c3133d.js +0 -30
  149. package/dist/themeProvider-5800417e.js +0 -19
  150. package/dist/toggle-5b3d8333.js +0 -67
@@ -0,0 +1,144 @@
1
+ import { jsxs as n, jsx as l } from "react/jsx-runtime";
2
+ import { useState as S, useMemo as G } from "react";
3
+ import { c as J } from "./bind-06a7ff84.js";
4
+ import { a as f, S as K } from "./arrowUp-4a5caee7.js";
5
+ import { C as x } from "./checkbox-9a6c7ce1.js";
6
+ const O = "_table_kha9s_1", P = "_label_kha9s_87", Q = {
7
+ table: O,
8
+ "table-header": "_table-header_kha9s_9",
9
+ "table-row": "_table-row_kha9s_16",
10
+ "table-row-content": "_table-row-content_kha9s_21",
11
+ "size-small": "_size-small_kha9s_31",
12
+ "size-large": "_size-large_kha9s_34",
13
+ "table-body": "_table-body_kha9s_38",
14
+ "table-header-cell": "_table-header-cell_kha9s_45",
15
+ "table-cell": "_table-cell_kha9s_45",
16
+ "action-menu-cell": "_action-menu-cell_kha9s_50",
17
+ "checkbox-cell": "_checkbox-cell_kha9s_60",
18
+ "primary-cell": "_primary-cell_kha9s_71",
19
+ label: P,
20
+ "sortable-cell": "_sortable-cell_kha9s_91",
21
+ "align-right": "_align-right_kha9s_94",
22
+ "align-center": "_align-center_kha9s_100"
23
+ };
24
+ var k = /* @__PURE__ */ ((c) => (c.ASC = "asc", c.DESC = "desc", c))(k || {});
25
+ const V = (c) => c.map((t) => t.key), a = J.bind(Q), ee = ({
26
+ data: c,
27
+ primaryColumn: t,
28
+ fixedColumns: h,
29
+ renderRowActions: i,
30
+ className: z = "",
31
+ rowClassName: M = "",
32
+ headerClassName: m = "",
33
+ selectable: y = !1,
34
+ selectedRowIds: d = [],
35
+ sortingDirection: v = k.ASC,
36
+ sortingColumn: r = t,
37
+ sortableColumns: _ = V([t, ...h]),
38
+ onChangeSorting: u = () => {
39
+ },
40
+ onToggleRowSelection: A = () => {
41
+ },
42
+ onToggleAllRowsSelection: E = () => {
43
+ }
44
+ }) => {
45
+ const [C, p] = S(null), [L, N] = S(null), w = G(() => [{ ...t, primary: !0 }, ...h], [t, h]), j = (e) => {
46
+ _.includes(e) && u({ key: e, direction: v });
47
+ }, g = (e) => ({
48
+ width: e.width,
49
+ textAlign: e.align
50
+ }), H = (e) => {
51
+ p(e);
52
+ }, T = () => {
53
+ p(null);
54
+ }, $ = (e) => {
55
+ N(e);
56
+ }, D = () => {
57
+ N(null);
58
+ }, R = (e) => {
59
+ A(e);
60
+ }, U = () => {
61
+ E();
62
+ }, q = c.every((e) => d.includes(e.id)), o = c.some((e) => d.includes(e.id)), B = (e) => {
63
+ var s;
64
+ return `size-${((s = e.rowConfigs) == null ? void 0 : s.size) ?? "default"}`;
65
+ }, F = (e) => {
66
+ if (_.includes(e))
67
+ return (r == null ? void 0 : r.key) === e ? v === k.ASC ? /* @__PURE__ */ l(f, {}) : /* @__PURE__ */ l(K, {}) : /* @__PURE__ */ l(f, {});
68
+ };
69
+ return /* @__PURE__ */ n("div", { className: a("table", z), children: [
70
+ /* @__PURE__ */ n("div", { className: a("table-header", m), children: [
71
+ y && /* @__PURE__ */ l("div", { className: a("table-header-cell", "checkbox-cell"), children: o && /* @__PURE__ */ l(
72
+ x,
73
+ {
74
+ value: q,
75
+ partiallyChecked: o,
76
+ onChange: U,
77
+ className: a("checkbox-cell")
78
+ }
79
+ ) }),
80
+ w.map((e) => /* @__PURE__ */ l(
81
+ "button",
82
+ {
83
+ className: a("table-header-cell", {
84
+ [`align-${e.align}`]: "align" in e,
85
+ "primary-cell": "primary" in e && e.primary,
86
+ "sortable-cell": _.includes(e.key)
87
+ }),
88
+ style: g(e),
89
+ children: /* @__PURE__ */ n(
90
+ "div",
91
+ {
92
+ className: a("label"),
93
+ onClick: () => j(e.key),
94
+ onMouseEnter: () => H(e.key),
95
+ onMouseLeave: T,
96
+ children: [
97
+ /* @__PURE__ */ l("span", { children: e.header }),
98
+ (C === e.key || (r == null ? void 0 : r.key) === e.key) && F(e.key)
99
+ ]
100
+ }
101
+ )
102
+ },
103
+ e.key
104
+ )),
105
+ i && /* @__PURE__ */ l("div", { className: a("table-header-cell", "action-menu-cell") })
106
+ ] }),
107
+ /* @__PURE__ */ l("div", { className: a("table-body"), children: c.map((e, b) => /* @__PURE__ */ n(
108
+ "div",
109
+ {
110
+ className: a("table-row", B(e), M),
111
+ onMouseEnter: () => $(b),
112
+ onMouseLeave: D,
113
+ children: [
114
+ y && /* @__PURE__ */ l("div", { className: a("table-cell", "checkbox-cell"), children: (o || L === b) && /* @__PURE__ */ l(
115
+ x,
116
+ {
117
+ value: d.includes(e.id),
118
+ onChange: () => R(e.id),
119
+ className: a("checkbox-cell")
120
+ }
121
+ ) }),
122
+ /* @__PURE__ */ n("div", { className: a("table-row-content"), children: [
123
+ w.map((s) => /* @__PURE__ */ l(
124
+ "div",
125
+ {
126
+ className: a("table-cell", {
127
+ "primary-cell": "primary" in s && s.primary
128
+ }),
129
+ style: g(s),
130
+ children: e[s.key].component || e[s.key].content || e[s.key]
131
+ },
132
+ s.key
133
+ )),
134
+ i && /* @__PURE__ */ l("div", { className: a("table-cell", "action-menu-cell"), children: i(e.metaData) })
135
+ ] })
136
+ ]
137
+ },
138
+ e.id
139
+ )) })
140
+ ] });
141
+ };
142
+ export {
143
+ ee as T
144
+ };
package/dist/table.js ADDED
@@ -0,0 +1,11 @@
1
+ import { T as r } from "./table-32fc8c70.js";
2
+ import "react/jsx-runtime";
3
+ import "react";
4
+ import "./bind-06a7ff84.js";
5
+ import "./arrowUp-4a5caee7.js";
6
+ import "./checkbox-9a6c7ce1.js";
7
+ import "./keyCodes-f63c0e11.js";
8
+ export {
9
+ r as Table,
10
+ r as default
11
+ };
@@ -0,0 +1,23 @@
1
+ import { jsx as o } from "react/jsx-runtime";
2
+ import { c as h } from "./bind-06a7ff84.js";
3
+ const n = {
4
+ "theme-provider": "_theme-provider_xipmx_1"
5
+ }, c = h.bind(n), e = {
6
+ light: "rp-ui-kit-theme-light",
7
+ dark: "rp-ui-kit-theme-dark"
8
+ };
9
+ function p({
10
+ children: t,
11
+ theme: i = "light",
12
+ customThemes: r = {},
13
+ className: s
14
+ }) {
15
+ const m = {
16
+ ...e,
17
+ ...r
18
+ }[i] || e.light;
19
+ return /* @__PURE__ */ o("div", { className: c("theme-provider", s, m), children: t });
20
+ }
21
+ export {
22
+ p as T
23
+ };
@@ -1,6 +1,7 @@
1
- import { T as e } from "./themeProvider-5800417e.js";
1
+ import { T as o } from "./themeProvider-46c2be7b.js";
2
2
  import "react/jsx-runtime";
3
+ import "./bind-06a7ff84.js";
3
4
  export {
4
- e as ThemeProvider,
5
- e as default
5
+ o as ThemeProvider,
6
+ o as default
6
7
  };
@@ -0,0 +1,59 @@
1
+ import { jsxs as g, jsx as s } from "react/jsx-runtime";
2
+ import { c as h } from "./bind-06a7ff84.js";
3
+ import { useRef as k, useId as x } from "react";
4
+ import { K as _ } from "./keyCodes-f63c0e11.js";
5
+ const y = "_toggle_1bvir_1", E = "_slider_1bvir_27", v = "_round_1bvir_47", D = "_input_1bvir_51", K = "_disabled_1bvir_92", N = {
6
+ toggle: y,
7
+ "children-container": "_children-container_1bvir_14",
8
+ slider: E,
9
+ round: v,
10
+ input: D,
11
+ disabled: K
12
+ }, e = h.bind(N), j = ({
13
+ children: t,
14
+ value: c,
15
+ onChange: u,
16
+ className: b,
17
+ disabled: n = !1,
18
+ title: p,
19
+ ...m
20
+ }) => {
21
+ const r = k(null), i = x(), f = (o) => {
22
+ var a, d;
23
+ const { keyCode: l } = o;
24
+ if (l === _.SPACE_KEY_CODE) {
25
+ o.preventDefault(), (a = r.current) == null || a.click();
26
+ return;
27
+ }
28
+ l === _.ENTER_KEY_CODE && (o.preventDefault(), (d = r.current) == null || d.click());
29
+ };
30
+ return /* @__PURE__ */ g("label", { id: i, title: p, className: e("toggle", b, { disabled: n }), children: [
31
+ /* @__PURE__ */ s(
32
+ "input",
33
+ {
34
+ ref: r,
35
+ tabIndex: n ? -1 : 0,
36
+ onChange: u,
37
+ checked: c,
38
+ disabled: n,
39
+ onKeyDown: f,
40
+ className: e("input"),
41
+ type: "checkbox",
42
+ ...m
43
+ }
44
+ ),
45
+ /* @__PURE__ */ s(
46
+ "div",
47
+ {
48
+ "aria-labelledby": i,
49
+ role: "checkbox",
50
+ "aria-checked": c,
51
+ className: e("slider", "round")
52
+ }
53
+ ),
54
+ t && /* @__PURE__ */ s("span", { className: e("children-container"), children: t })
55
+ ] });
56
+ };
57
+ export {
58
+ j as T
59
+ };
package/dist/toggle.js CHANGED
@@ -1,4 +1,4 @@
1
- import { T as r } from "./toggle-5b3d8333.js";
1
+ import { T as r } from "./toggle-1a3aacb5.js";
2
2
  import "react/jsx-runtime";
3
3
  import "./bind-06a7ff84.js";
4
4
  import "react";
@@ -0,0 +1,101 @@
1
+ import { jsxs as m, Fragment as D, jsx as o } from "react/jsx-runtime";
2
+ import { useState as H, useRef as d } from "react";
3
+ import { createPortal as R } from "react-dom";
4
+ import { c as G } from "./bind-06a7ff84.js";
5
+ import { useFloating as P, offset as j, flip as k, arrow as z, autoUpdate as $, FloatingArrow as C } from "@floating-ui/react";
6
+ const U = {
7
+ "tooltip-wrapper": "_tooltip-wrapper_18ppz_16",
8
+ "tooltip-content": "_tooltip-content_18ppz_23"
9
+ }, n = G.bind(U), Y = 300, Z = 100, q = 16, f = 8, B = ["top", "right", "bottom", "left"], tt = ({
10
+ content: u,
11
+ wrapperClassName: h,
12
+ tooltipClassName: w,
13
+ contentClassName: x,
14
+ dynamicWidth: T,
15
+ width: _,
16
+ minWidth: g = 120,
17
+ safeZone: E = 4,
18
+ zIndex: A = 9,
19
+ placement: N = "bottom",
20
+ arrowColor: b = "rgba(34, 34, 34, 0.91)",
21
+ dataAutomationId: I,
22
+ mainAxis: S = !0,
23
+ children: W,
24
+ portalRoot: s,
25
+ isFloating: y = !0
26
+ }) => {
27
+ const [i, l] = H(!1), r = d(null), t = d(), { refs: c, floatingStyles: F, context: L } = P({
28
+ open: i,
29
+ placement: N,
30
+ middleware: [
31
+ j({
32
+ mainAxis: E + f
33
+ }),
34
+ y && k({
35
+ mainAxis: S,
36
+ fallbackAxisSideDirection: "start",
37
+ fallbackPlacements: B
38
+ }),
39
+ z({
40
+ element: r
41
+ })
42
+ ],
43
+ whileElementsMounted: $
44
+ }), e = T ? null : { width: `${_}px` }, M = document.documentElement.clientWidth, O = e || M - Z, a = () => {
45
+ t.current && clearTimeout(t.current), l(!1);
46
+ }, v = () => {
47
+ t.current = setTimeout(() => l(!0), Y);
48
+ }, p = () => /* @__PURE__ */ m(
49
+ "div",
50
+ {
51
+ ref: c.setFloating,
52
+ style: {
53
+ ...F,
54
+ ...e,
55
+ minWidth: g,
56
+ zIndex: A
57
+ },
58
+ "data-automation-id": I,
59
+ className: n(w),
60
+ children: [
61
+ /* @__PURE__ */ o(
62
+ C,
63
+ {
64
+ ref: r,
65
+ context: L,
66
+ width: q,
67
+ height: f,
68
+ fill: b
69
+ }
70
+ ),
71
+ /* @__PURE__ */ o(
72
+ "div",
73
+ {
74
+ className: n("tooltip-content", x),
75
+ style: {
76
+ maxWidth: `${O}px`
77
+ },
78
+ children: u
79
+ }
80
+ )
81
+ ]
82
+ }
83
+ );
84
+ return /* @__PURE__ */ m(D, { children: [
85
+ /* @__PURE__ */ o(
86
+ "div",
87
+ {
88
+ ref: c.setReference,
89
+ className: n("tooltip-wrapper", h),
90
+ onMouseDown: a,
91
+ onMouseEnter: v,
92
+ onMouseLeave: a,
93
+ children: W
94
+ }
95
+ ),
96
+ i && (s ? R(p(), s) : p())
97
+ ] });
98
+ };
99
+ export {
100
+ tt as Tooltip
101
+ };
package/package.json CHANGED
@@ -1,13 +1,18 @@
1
1
  {
2
2
  "name": "@reportportal/ui-kit",
3
- "version": "0.0.1-alpha.6",
3
+ "version": "0.0.1-alpha.61",
4
+ "description": "The UI-kit library for ReportPortal Design System.",
4
5
  "type": "module",
5
6
  "scripts": {
6
- "dev": "storybook dev -p 6006",
7
+ "start": "storybook dev -p 6006",
7
8
  "build": "tsc && vite build",
8
9
  "build:storybook": "storybook build",
9
10
  "lint": "eslint \"src/**/*.{js,jsx,ts,tsx}\"",
10
11
  "format": "npm run lint -- --fix",
12
+ "test": "vitest",
13
+ "test:coverage": "vitest run --coverage",
14
+ "test:ci": "vitest run",
15
+ "test:ui": "vitest --ui",
11
16
  "prepare": "husky install"
12
17
  },
13
18
  "files": [
@@ -21,28 +26,36 @@
21
26
  "react-dom": "17.x-18.x"
22
27
  },
23
28
  "dependencies": {
24
- "@popperjs/core": "^2.11.8",
29
+ "@floating-ui/react": "^0.26.16",
30
+ "@floating-ui/react-dom": "^2.0.1",
25
31
  "classnames": "^2.3.2",
26
32
  "downshift": "^6.1.12",
27
33
  "framer-motion": "^10.15.2",
28
34
  "rc-scrollbars": "^1.1.6",
29
- "react-popper": "^2.3.0"
35
+ "react-datepicker": "^7.6.0"
30
36
  },
31
37
  "devDependencies": {
32
- "@storybook/addon-essentials": "^7.2.0",
33
- "@storybook/addon-interactions": "^7.2.0",
34
- "@storybook/addon-links": "^7.2.0",
35
- "@storybook/addon-onboarding": "^1.0.8",
36
- "@storybook/blocks": "^7.2.0",
37
- "@storybook/react": "^7.2.0",
38
- "@storybook/react-vite": "^7.2.0",
39
- "@storybook/testing-library": "^0.2.0",
38
+ "@storybook/addon-essentials": "^8.6.14",
39
+ "@storybook/addon-interactions": "^8.6.14",
40
+ "@storybook/addon-links": "^8.6.14",
41
+ "@storybook/addon-onboarding": "^8.6.14",
42
+ "@storybook/blocks": "^8.6.14",
43
+ "@storybook/react": "^8.6.14",
44
+ "@storybook/react-vite": "^8.6.14",
45
+ "@storybook/testing-library": "^0.2.2",
46
+ "@testing-library/jest-dom": "^6.6.3",
47
+ "@testing-library/react": "^16.1.0",
48
+ "@testing-library/user-event": "^14.5.2",
40
49
  "@types/node": "^20.4.5",
41
- "@types/react": "^18.2.20",
50
+ "@types/react": "^18.3.3",
51
+ "@types/react-datepicker": "^6.2.0",
42
52
  "@types/react-dom": "^18.2.7",
43
53
  "@typescript-eslint/eslint-plugin": "^5.62.0",
44
54
  "@typescript-eslint/parser": "^5.62.0",
45
55
  "@vitejs/plugin-react": "^4.0.3",
56
+ "@vitest/coverage-v8": "^2.1.8",
57
+ "@vitest/ui": "^2.1.8",
58
+ "date-fns": "^3.6.0",
46
59
  "eslint": "^8.46.0",
47
60
  "eslint-config-airbnb-typescript": "^15.0.0",
48
61
  "eslint-config-prettier": "^8.10.0",
@@ -52,18 +65,41 @@
52
65
  "eslint-plugin-react": "^7.33.1",
53
66
  "eslint-plugin-react-hooks": "^4.6.0",
54
67
  "eslint-plugin-react-refresh": "^0.4.3",
55
- "eslint-plugin-storybook": "^0.6.13",
68
+ "eslint-plugin-storybook": "^0.8.0",
56
69
  "husky": "^8.0.3",
70
+ "jsdom": "^25.0.1",
57
71
  "lint-staged": "^13.2.3",
58
72
  "prettier": "^3.0.1",
59
73
  "react": "18.2.0",
60
74
  "react-dom": "18.2.0",
61
75
  "sass": "^1.64.1",
62
- "storybook": "^7.2.2",
76
+ "storybook": "^8.6.14",
63
77
  "typescript": "^5.0.2",
64
- "vite": "^4.4.5",
78
+ "vite": "^4.5.14",
65
79
  "vite-plugin-dts": "^3.4.0",
66
80
  "vite-plugin-svgr": "^3.2.0",
67
- "vite-tsconfig-paths": "^4.2.0"
81
+ "vite-tsconfig-paths": "^4.2.0",
82
+ "vitest": "^2.1.8"
83
+ },
84
+ "repository": {
85
+ "type": "git",
86
+ "url": "git+https://github.com/reportportal/ui-kit.git"
87
+ },
88
+ "author": "ReportPortal.io",
89
+ "license": "Apache-2.0",
90
+ "bugs": {
91
+ "url": "https://github.com/reportportal/ui-kit/issues"
92
+ },
93
+ "homepage": "https://github.com/reportportal/ui-kit#readme",
94
+ "keywords": [
95
+ "react",
96
+ "react-components",
97
+ "design-systems",
98
+ "ui-kit",
99
+ "reportportal",
100
+ "epam"
101
+ ],
102
+ "engines": {
103
+ "node": ">=16.x"
68
104
  }
69
105
  }
@@ -1,17 +0,0 @@
1
- import { jsx as s } from "react/jsx-runtime";
2
- import { c as r } from "./bind-06a7ff84.js";
3
- const a = "_bubble_1wrm9_1", c = "_bubbles_1wrm9_1", _ = {
4
- "bubbles-loader": "_bubbles-loader_1wrm9_1",
5
- "color-topaz": "_color-topaz_1wrm9_4",
6
- bubble: a,
7
- bubbles: c
8
- }, l = r.bind(_), t = 7, i = ({
9
- color: b = "topaz",
10
- className: o
11
- }) => /* @__PURE__ */ s("div", { className: l("bubbles-loader", o, { [`color-${b}`]: b }), children: Array(t).fill(void 0).map((m, e) => (
12
- // eslint-disable-next-line react/no-array-index-key
13
- /* @__PURE__ */ s("div", { className: l("bubble") }, e)
14
- )) });
15
- export {
16
- i as B
17
- };
@@ -1,64 +0,0 @@
1
- import { jsxs as h, jsx as l } from "react/jsx-runtime";
2
- import { forwardRef as x } from "react";
3
- import { c as f } from "./bind-06a7ff84.js";
4
- const g = "_button_wutm5_1", y = "_primary_wutm5_19", N = "_disabled_wutm5_24", B = "_ghost_wutm5_36", $ = "_danger_wutm5_51", j = "_text_wutm5_67", I = "_icon_wutm5_113", R = {
5
- button: g,
6
- primary: y,
7
- disabled: N,
8
- ghost: B,
9
- danger: $,
10
- text: j,
11
- "width-wide-content": "_width-wide-content_wutm5_103",
12
- "width-parent": "_width-parent_wutm5_108",
13
- icon: I,
14
- "icon-start": "_icon-start_wutm5_119",
15
- "icon-end": "_icon-end_wutm5_123"
16
- }, c = f.bind(R), A = x(
17
- ({
18
- variant: t = "primary",
19
- icon: e,
20
- iconPlace: n = "start",
21
- adjustWidthOn: o = "content",
22
- type: i = "button",
23
- children: r,
24
- disabled: s = !1,
25
- onClick: a,
26
- title: m,
27
- className: d,
28
- dataAutomationId: u,
29
- ...w
30
- }, b) => {
31
- const p = c("button", t, d, {
32
- disabled: s,
33
- [`width-${o}`]: o
34
- }), _ = t === "text" && e;
35
- return /* @__PURE__ */ h(
36
- "button",
37
- {
38
- ref: b,
39
- type: i,
40
- disabled: s,
41
- className: p,
42
- onClick: a,
43
- title: m,
44
- "data-automation-id": u,
45
- ...w,
46
- children: [
47
- _ && /* @__PURE__ */ l(
48
- "i",
49
- {
50
- className: c("icon", {
51
- [`icon-${n}`]: n
52
- }),
53
- children: _
54
- }
55
- ),
56
- r
57
- ]
58
- }
59
- );
60
- }
61
- );
62
- export {
63
- A as B
64
- };
@@ -1,68 +0,0 @@
1
- import { jsxs as u, jsx as r } from "react/jsx-runtime";
2
- import { c as x } from "./bind-06a7ff84.js";
3
- import { useRef as d } from "react";
4
- import { K as p } from "./keyCodes-f63c0e11.js";
5
- const m = "_checkbox_1ggpr_1", f = "_disabled_1ggpr_12", g = "_input_1ggpr_17", y = "_control_1ggpr_24", C = "_children_1ggpr_78", E = {
6
- checkbox: m,
7
- disabled: f,
8
- input: g,
9
- control: y,
10
- children: C
11
- }, e = x.bind(E), j = ({
12
- children: t,
13
- disabled: c = !1,
14
- onChange: _,
15
- className: b,
16
- value: s,
17
- ...h
18
- }) => {
19
- const o = d(null), k = (n) => {
20
- var a, i;
21
- const { keyCode: l } = n;
22
- if (l === p.SPACE_KEY_CODE) {
23
- n.preventDefault(), (a = o.current) == null || a.click();
24
- return;
25
- }
26
- l === p.ENTER_KEY_CODE && (n.preventDefault(), (i = o.current) == null || i.click());
27
- };
28
- return /* @__PURE__ */ u(
29
- "label",
30
- {
31
- id: "rp-ui-kit-checkbox-label",
32
- className: e("checkbox", b, {
33
- disabled: c
34
- }),
35
- children: [
36
- /* @__PURE__ */ r(
37
- "input",
38
- {
39
- ref: o,
40
- tabIndex: 0,
41
- type: "checkbox",
42
- onKeyDown: k,
43
- className: e("input"),
44
- disabled: c,
45
- onChange: _,
46
- checked: s,
47
- ...h
48
- }
49
- ),
50
- /* @__PURE__ */ r(
51
- "span",
52
- {
53
- "aria-labelledby": "rp-ui-kit-checkbox-label",
54
- role: "checkbox",
55
- "aria-checked": s,
56
- className: e("control", {
57
- disabled: c
58
- })
59
- }
60
- ),
61
- t && /* @__PURE__ */ r("span", { className: e("children", { disabled: c }), children: t })
62
- ]
63
- }
64
- );
65
- };
66
- export {
67
- j as C
68
- };
@@ -1,5 +0,0 @@
1
- import * as e from "react";
2
- const l = (t) => /* @__PURE__ */ e.createElement("svg", { width: 17, height: 17, viewBox: "0 0 17 17", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ e.createElement("rect", { width: 16.2089, height: 16.1568, rx: 8.07842, fill: "#A2AAB5" }), /* @__PURE__ */ e.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M5.14768 5.14645C4.95077 5.34171 4.95077 5.65829 5.14768 5.85355L7.49578 8.18198L5.35655 10.3033C5.15963 10.4986 5.15963 10.8151 5.35655 11.0104C5.55346 11.2057 5.87271 11.2057 6.06962 11.0104L8.20886 8.88909L10.1392 10.8033C10.3361 10.9986 10.6554 10.9986 10.8523 10.8033C11.0492 10.608 11.0492 10.2915 10.8523 10.0962L8.92193 8.18198L11.0612 6.06065C11.2581 5.86539 11.2581 5.54881 11.0612 5.35355C10.8643 5.15828 10.545 5.15828 10.3481 5.35355L8.20886 7.47487L5.86076 5.14645C5.66385 4.95118 5.34459 4.95118 5.14768 5.14645Z", fill: "white" }));
3
- export {
4
- l as S
5
- };
@@ -1,11 +0,0 @@
1
- import { FC, MouseEventHandler } from 'react';
2
- import { icons } from './icons';
3
- type IconName = keyof typeof icons;
4
- interface IconProps {
5
- icon: IconName;
6
- className?: string;
7
- disabled?: boolean;
8
- onClick?: MouseEventHandler<HTMLSpanElement>;
9
- }
10
- export declare const Icon: FC<IconProps>;
11
- export {};
@@ -1,21 +0,0 @@
1
- /// <reference types="react" />
2
- export declare const icons: {
3
- clear: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
4
- title?: string | undefined;
5
- }>;
6
- close: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
7
- title?: string | undefined;
8
- }>;
9
- dropdown: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
10
- title?: string | undefined;
11
- }>;
12
- delete: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
13
- title?: string | undefined;
14
- }>;
15
- plus: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
16
- title?: string | undefined;
17
- }>;
18
- minus: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
19
- title?: string | undefined;
20
- }>;
21
- };
@@ -1,3 +0,0 @@
1
- import { Icon } from './icon';
2
- export { Icon };
3
- export default Icon;