@reportportal/ui-kit 0.0.1-alpha.246 → 0.0.1-alpha.248

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.
@@ -0,0 +1,24 @@
1
+ import { useState as d, useCallback as r, useEffect as k } from "react";
2
+ const n = (e) => {
3
+ var i, o, s;
4
+ return ((i = e == null ? void 0 : e.getModifierState) == null ? void 0 : i.call(e, "CapsLock")) ?? ((s = (o = e == null ? void 0 : e.nativeEvent) == null ? void 0 : o.getModifierState) == null ? void 0 : s.call(o, "CapsLock")) ?? !1;
5
+ }, u = () => {
6
+ const [e, i] = d(!1), o = r((s) => {
7
+ i(n(s));
8
+ }, []);
9
+ return k(() => {
10
+ const s = (t) => {
11
+ i(n(t));
12
+ }, a = (t) => {
13
+ t.key === "CapsLock" && i(n(t));
14
+ }, c = () => {
15
+ document.visibilityState === "visible" && i(!1);
16
+ };
17
+ return window.addEventListener("keydown", s), window.addEventListener("keyup", a), document.addEventListener("visibilitychange", c), () => {
18
+ window.removeEventListener("keydown", s), window.removeEventListener("keyup", a), document.removeEventListener("visibilitychange", c);
19
+ };
20
+ }, []), { capsLockOn: e, syncFromMouseEvent: o };
21
+ };
22
+ export {
23
+ u
24
+ };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@reportportal/ui-kit",
3
- "version": "0.0.1-alpha.246",
3
+ "version": "0.0.1-alpha.248",
4
4
  "description": "The UI-kit library for ReportPortal Design System.",
5
5
  "type": "module",
6
6
  "scripts": {
@@ -1,185 +0,0 @@
1
- import { jsx as t, jsxs as s, Fragment as F } from "react/jsx-runtime";
2
- import { forwardRef as Y, useRef as Z, useId as q, useState as b } from "react";
3
- import { c as tt } from "./bind-06a7ff84.js";
4
- import { S as nt } from "./clear-53660571.js";
5
- import { b as ot, a as et, S as ct } from "./capslockIcon-b100b9d6.js";
6
- import { B as st } from "./baseIconButton-251479f7.js";
7
- import { S as at } from "./spinLoader-c4a53718.js";
8
- import { M as rt } from "./maxValueDisplay-9be01a75.js";
9
- import { FieldLabel as it } from "./fieldLabel.js";
10
- import "react-dnd";
11
- import "react-dnd-html5-backend";
12
- import { u as lt } from "./useCapsLock-ac8ea6e0.js";
13
- import { Tooltip as pt } from "./tooltip.js";
14
- const _t = "_collapsed_1vr19_11", dt = "_field_1vr19_23", mt = "_placeholder_1vr19_48", ut = "_disabled_1vr19_51", ft = "_error_1vr19_54", ht = "_touched_1vr19_54", vt = "_input_1vr19_73", wt = "_icon_1vr19_1", xt = "_text_1vr19_207", Nt = {
15
- "icon-container": "_icon-container_1vr19_1",
16
- "icon-container-additional": "_icon-container-additional_1vr19_1",
17
- "icon-container-end": "_icon-container-end_1vr19_1",
18
- "icon-container-start": "_icon-container-start_1vr19_1",
19
- collapsed: _t,
20
- field: dt,
21
- "default-width": "_default-width_1vr19_35",
22
- placeholder: mt,
23
- disabled: ut,
24
- error: ft,
25
- touched: ht,
26
- "max-length-display": "_max-length-display_1vr19_61",
27
- "input-container": "_input-container_1vr19_73",
28
- "type-password": "_type-password_1vr19_77",
29
- input: vt,
30
- "with-caps-lock": "_with-caps-lock_1vr19_81",
31
- "caps-lock-tooltip-wrapper": "_caps-lock-tooltip-wrapper_1vr19_84",
32
- "caps-lock-tooltip-content": "_caps-lock-tooltip-content_1vr19_96",
33
- "caps-lock-icon": "_caps-lock-icon_1vr19_107",
34
- "eye-icon": "_eye-icon_1vr19_117",
35
- icon: wt,
36
- "start-icon": "_start-icon_1vr19_163",
37
- "clear-icon": "_clear-icon_1vr19_164",
38
- "additional-content": "_additional-content_1vr19_200",
39
- text: xt,
40
- "error-text": "_error-text_1vr19_227",
41
- "help-text": "_help-text_1vr19_231"
42
- }, n = tt.bind(Nt), Pt = Y(
43
- ({
44
- value: e = "",
45
- className: B,
46
- classNameHelpText: D,
47
- error: r,
48
- placeholder: m,
49
- disabled: c = !1,
50
- onChange: V,
51
- touched: u = !1,
52
- title: E,
53
- label: i,
54
- helpText: l,
55
- defaultWidth: I = !0,
56
- startIcon: f,
57
- endIcon: h,
58
- clearable: L = !1,
59
- onClear: v,
60
- isRequired: w = !1,
61
- hasDoubleMessage: P = !1,
62
- type: a = "text",
63
- displayError: R = !0,
64
- collapsible: j = !1,
65
- loading: H = !1,
66
- maxLengthDisplay: M,
67
- capsLockMessage: x,
68
- onFocus: O = () => {
69
- },
70
- onBlur: T = () => {
71
- },
72
- ...$
73
- }, z) => {
74
- const A = Z(null), p = z || A, N = q(), [_, k] = b(!1), [y, G] = b(!1), { capsLockOn: J } = lt(), g = !!x && _ && J && e.length >= 1 && !c, K = (o) => {
75
- k(!0), O(o);
76
- }, Q = (o) => {
77
- k(!1), T(o);
78
- }, U = () => {
79
- var o;
80
- v && (v(e), (o = p.current) == null || o.focus());
81
- }, C = R && r && u, S = /* @__PURE__ */ t("span", { className: n("text", "help-text", D), children: l }), W = () => a !== "password" ? a : y ? "text" : "password", X = () => {
82
- G((o) => !o);
83
- };
84
- return /* @__PURE__ */ s(F, { children: [
85
- i && /* @__PURE__ */ t(it, { isRequired: w, htmlFor: N, children: i }),
86
- /* @__PURE__ */ s(
87
- "div",
88
- {
89
- className: n("field", B, {
90
- error: r,
91
- touched: u,
92
- disabled: c,
93
- "default-width": I,
94
- collapsed: j && !_ && !e
95
- }),
96
- title: E,
97
- children: [
98
- H ? /* @__PURE__ */ t(at, {}) : f && /* @__PURE__ */ t(
99
- "span",
100
- {
101
- className: n("icon-container-start"),
102
- onClick: () => {
103
- var d;
104
- (d = p.current) == null || d.focus();
105
- },
106
- children: /* @__PURE__ */ t("span", { className: n("icon", { "start-icon": !_ }), children: f })
107
- }
108
- ),
109
- /* @__PURE__ */ s(
110
- "span",
111
- {
112
- className: n("input-container", `type-${a}`, { "with-caps-lock": g }),
113
- children: [
114
- /* @__PURE__ */ t(
115
- "input",
116
- {
117
- ref: p,
118
- type: W(),
119
- className: n("input"),
120
- value: e,
121
- disabled: c,
122
- id: N,
123
- onChange: V,
124
- onFocus: K,
125
- onBlur: Q,
126
- ...$
127
- }
128
- ),
129
- g && /* @__PURE__ */ t(
130
- pt,
131
- {
132
- content: x,
133
- wrapperClassName: n("caps-lock-tooltip-wrapper"),
134
- contentClassName: n("caps-lock-tooltip-content"),
135
- children: /* @__PURE__ */ t("span", { className: n("caps-lock-icon"), children: /* @__PURE__ */ t(ot, {}) })
136
- }
137
- ),
138
- a === "password" && e && /* @__PURE__ */ t(
139
- st,
140
- {
141
- className: n("eye-icon"),
142
- onClick: X,
143
- onPointerDown: (o) => o.preventDefault(),
144
- children: y ? /* @__PURE__ */ t(et, {}) : /* @__PURE__ */ t(ct, {})
145
- }
146
- ),
147
- m && !e && /* @__PURE__ */ s("span", { className: n("placeholder"), children: [
148
- m,
149
- w && !i && /* @__PURE__ */ t("span", { className: n("asterisk") })
150
- ] })
151
- ]
152
- }
153
- ),
154
- /* @__PURE__ */ t(
155
- rt,
156
- {
157
- className: n("max-length-display"),
158
- value: e.length,
159
- maxValue: M
160
- }
161
- ),
162
- L && e.length > 0 && /* @__PURE__ */ t("span", { className: n("icon-container-end"), children: /* @__PURE__ */ t(
163
- "button",
164
- {
165
- type: "button",
166
- className: n("clear-icon", { disabled: c }),
167
- onClick: U,
168
- onMouseDown: (o) => o.preventDefault(),
169
- children: /* @__PURE__ */ t(nt, {})
170
- }
171
- ) }),
172
- h && /* @__PURE__ */ t("span", { className: n("icon-container-end"), children: /* @__PURE__ */ t("span", { className: n("icon"), children: h }) })
173
- ]
174
- }
175
- ),
176
- (C || l) && /* @__PURE__ */ t("div", { className: n("additional-content", { disabled: c }), children: C ? /* @__PURE__ */ s(F, { children: [
177
- /* @__PURE__ */ t("span", { className: n("text", "error-text"), children: r }),
178
- P && S
179
- ] }) : l && S })
180
- ] });
181
- }
182
- );
183
- export {
184
- Pt as F
185
- };
@@ -1,20 +0,0 @@
1
- import { useState as c, useEffect as d } from "react";
2
- const L = () => {
3
- const [a, t] = c(!1);
4
- return d(() => {
5
- const i = (e) => {
6
- var o;
7
- t(((o = e.getModifierState) == null ? void 0 : o.call(e, "CapsLock")) ?? !1);
8
- }, n = (e) => {
9
- e.key === "CapsLock" && i(e);
10
- }, s = () => {
11
- document.visibilityState === "visible" && t(!1);
12
- };
13
- return window.addEventListener("keydown", i), window.addEventListener("keyup", n), document.addEventListener("visibilitychange", s), () => {
14
- window.removeEventListener("keydown", i), window.removeEventListener("keyup", n), document.removeEventListener("visibilitychange", s);
15
- };
16
- }, []), { capsLockOn: a };
17
- };
18
- export {
19
- L as u
20
- };