@cfx-dev/ui-components 5.0.25 → 5.0.26

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 (18) hide show
  1. package/dist/{BurgerMenu.module-DA0ojIYf.js → BurgerMenu.module-Dy-zFg88.js} +4 -3
  2. package/dist/assets/css/BurgerMenu.css +1 -1
  3. package/dist/assets/css/Button.css +1 -1
  4. package/dist/assets/general/global.css +1 -1
  5. package/dist/components/BurgerMenu/BurgerMenu.d.ts +4 -2
  6. package/dist/components/BurgerMenu/BurgerMenu.js +55 -54
  7. package/dist/components/BurgerMenu/BurgerMenuButton.js +1 -1
  8. package/dist/components/BurgerMenu/BurgerMenuShowcase.js +26 -23
  9. package/dist/components/Button/Button.d.ts +2 -1
  10. package/dist/components/Button/Button.js +71 -65
  11. package/dist/components/Button/ButtonShowcase.js +46 -22
  12. package/dist/components/Logos/fivem/WhiteLogo.js +9 -9
  13. package/dist/components/Logos/redm/WhiteLogo.js +8 -30
  14. package/dist/components/Shroud/Shroud.js +3 -3
  15. package/dist/components/Table/TableCell.js +35 -33
  16. package/dist/styles-scss/tokens.scss +1 -1
  17. package/dist/utils/hooks/usePopoverController.js +25 -22
  18. package/package.json +1 -1
package/dist/components/Button/ButtonShowcase.js CHANGED
@@ -1,14 +1,14 @@
1
- import { jsxs as t, jsx as e } from "react/jsx-runtime";
2
- import c from "react";
3
- import r from "../Flex/Flex.js";
1
+ import { jsxs as r, jsx as e } from "react/jsx-runtime";
2
+ import d from "react";
3
+ import t from "../Flex/Flex.js";
4
4
  import { Text as n } from "../Text/Text.js";
5
5
  import "../../utils/ui/ui.js";
6
6
  import i from "./Button.js";
7
- import { ButtonBar as d } from "./ButtonBar.js";
7
+ import { ButtonBar as c } from "./ButtonBar.js";
8
8
  import { LinkButton as l } from "./LinkButton.js";
9
9
  function h() {
10
- return /* @__PURE__ */ t(r, { gap: "large", vertical: !0, children: [
11
- /* @__PURE__ */ t(r, { gap: "medium", vertical: !0, children: [
10
+ return /* @__PURE__ */ r(t, { gap: "large", vertical: !0, children: [
11
+ /* @__PURE__ */ r(t, { gap: "medium", vertical: !0, children: [
12
12
  /* @__PURE__ */ e(n, { children: "Default Icon Right" }),
13
13
  /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(
14
14
  i,
@@ -19,7 +19,7 @@ function h() {
19
19
  }
20
20
  ) })
21
21
  ] }),
22
- /* @__PURE__ */ t(r, { gap: "medium", vertical: !0, children: [
22
+ /* @__PURE__ */ r(t, { gap: "medium", vertical: !0, children: [
23
23
  /* @__PURE__ */ e(n, { children: "Default Icon Left" }),
24
24
  /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(
25
25
  i,
@@ -30,7 +30,7 @@ function h() {
30
30
  }
31
31
  ) })
32
32
  ] }),
33
- /* @__PURE__ */ t(r, { gap: "medium", vertical: !0, children: [
33
+ /* @__PURE__ */ r(t, { gap: "medium", vertical: !0, children: [
34
34
  /* @__PURE__ */ e(n, { children: "Primary" }),
35
35
  /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(
36
36
  i,
@@ -41,7 +41,31 @@ function h() {
41
41
  }
42
42
  ) })
43
43
  ] }),
44
- /* @__PURE__ */ t(r, { gap: "medium", vertical: !0, children: [
44
+ /* @__PURE__ */ r(t, { gap: "medium", vertical: !0, children: [
45
+ /* @__PURE__ */ e(n, { children: "Primary With Border Shredded" }),
46
+ /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(
47
+ i,
48
+ {
49
+ text: "Sign In",
50
+ theme: "primary",
51
+ icon: "Users",
52
+ borderShredded: !0
53
+ }
54
+ ) })
55
+ ] }),
56
+ /* @__PURE__ */ r(t, { gap: "medium", vertical: !0, children: [
57
+ /* @__PURE__ */ e(n, { children: "Secondary With Border Shredded" }),
58
+ /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(
59
+ i,
60
+ {
61
+ text: "Sign In",
62
+ theme: "secondary",
63
+ icon: "Users",
64
+ borderShredded: !0
65
+ }
66
+ ) })
67
+ ] }),
68
+ /* @__PURE__ */ r(t, { gap: "medium", vertical: !0, children: [
45
69
  /* @__PURE__ */ e(n, { children: "Secondary" }),
46
70
  /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(
47
71
  i,
@@ -52,7 +76,7 @@ function h() {
52
76
  }
53
77
  ) })
54
78
  ] }),
55
- /* @__PURE__ */ t(r, { gap: "medium", vertical: !0, children: [
79
+ /* @__PURE__ */ r(t, { gap: "medium", vertical: !0, children: [
56
80
  /* @__PURE__ */ e(n, { children: "Tertiary (Default)" }),
57
81
  /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(
58
82
  i,
@@ -63,7 +87,7 @@ function h() {
63
87
  }
64
88
  ) })
65
89
  ] }),
66
- /* @__PURE__ */ t(r, { gap: "medium", vertical: !0, children: [
90
+ /* @__PURE__ */ r(t, { gap: "medium", vertical: !0, children: [
67
91
  /* @__PURE__ */ e(n, { children: "On Light" }),
68
92
  /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(
69
93
  i,
@@ -74,7 +98,7 @@ function h() {
74
98
  }
75
99
  ) })
76
100
  ] }),
77
- /* @__PURE__ */ t(r, { gap: "medium", vertical: !0, children: [
101
+ /* @__PURE__ */ r(t, { gap: "medium", vertical: !0, children: [
78
102
  /* @__PURE__ */ e(n, { children: "Quick Link" }),
79
103
  /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(
80
104
  i,
@@ -85,7 +109,7 @@ function h() {
85
109
  }
86
110
  ) })
87
111
  ] }),
88
- /* @__PURE__ */ t(r, { gap: "medium", vertical: !0, children: [
112
+ /* @__PURE__ */ r(t, { gap: "medium", vertical: !0, children: [
89
113
  /* @__PURE__ */ e(n, { children: "No Icon" }),
90
114
  /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(
91
115
  i,
@@ -95,7 +119,7 @@ function h() {
95
119
  }
96
120
  ) })
97
121
  ] }),
98
- /* @__PURE__ */ t(r, { gap: "medium", vertical: !0, children: [
122
+ /* @__PURE__ */ r(t, { gap: "medium", vertical: !0, children: [
99
123
  /* @__PURE__ */ e(n, { children: "Disabled" }),
100
124
  /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(
101
125
  i,
@@ -107,7 +131,7 @@ function h() {
107
131
  }
108
132
  ) })
109
133
  ] }),
110
- /* @__PURE__ */ t(r, { gap: "medium", vertical: !0, children: [
134
+ /* @__PURE__ */ r(t, { gap: "medium", vertical: !0, children: [
111
135
  /* @__PURE__ */ e(n, { children: "Full Width" }),
112
136
  /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(
113
137
  i,
@@ -119,9 +143,9 @@ function h() {
119
143
  }
120
144
  ) })
121
145
  ] }),
122
- /* @__PURE__ */ t(r, { gap: "medium", vertical: !0, children: [
146
+ /* @__PURE__ */ r(t, { gap: "medium", vertical: !0, children: [
123
147
  /* @__PURE__ */ e(n, { children: "Linked" }),
124
- /* @__PURE__ */ t(r, { p: 4, style: { backgroundColor: "var(--color-modal-background)" }, children: [
148
+ /* @__PURE__ */ r(t, { p: 4, style: { backgroundColor: "var(--color-modal-background)" }, children: [
125
149
  /* @__PURE__ */ e(
126
150
  i,
127
151
  {
@@ -141,7 +165,7 @@ function h() {
141
165
  )
142
166
  ] })
143
167
  ] }),
144
- /* @__PURE__ */ t(r, { gap: "medium", vertical: !0, children: [
168
+ /* @__PURE__ */ r(t, { gap: "medium", vertical: !0, children: [
145
169
  /* @__PURE__ */ e(n, { children: "LinkButton - look like button but its anchor" }),
146
170
  /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(
147
171
  l,
@@ -153,16 +177,16 @@ function h() {
153
177
  }
154
178
  ) })
155
179
  ] }),
156
- /* @__PURE__ */ t(r, { gap: "medium", vertical: !0, children: [
180
+ /* @__PURE__ */ r(t, { gap: "medium", vertical: !0, children: [
157
181
  /* @__PURE__ */ e(n, { children: "Button Bar" }),
158
- /* @__PURE__ */ e("div", { children: /* @__PURE__ */ t(d, { children: [
182
+ /* @__PURE__ */ e("div", { children: /* @__PURE__ */ r(c, { children: [
159
183
  /* @__PURE__ */ e(i, { text: "Sign In", theme: "primary", icon: "Users" }),
160
184
  /* @__PURE__ */ e(i, { text: "Register", theme: "secondary", icon: "Users" }),
161
185
  /* @__PURE__ */ e(i, { text: "Sign Out", theme: "on-light", icon: "Users" }),
162
186
  /* @__PURE__ */ e(i, { text: "Create Account", theme: "tertiary", icon: "Users" })
163
187
  ] }) })
164
188
  ] }),
165
- /* @__PURE__ */ t(r, { gap: "medium", vertical: !0, children: [
189
+ /* @__PURE__ */ r(t, { gap: "medium", vertical: !0, children: [
166
190
  /* @__PURE__ */ e(n, { children: "Long text" }),
167
191
  /* @__PURE__ */ e("div", { style: { maxWidth: "300px" }, children: /* @__PURE__ */ e(
168
192
  i,
@@ -175,7 +199,7 @@ function h() {
175
199
  ] })
176
200
  ] });
177
201
  }
178
- const x = c.memo(h);
202
+ const x = d.memo(h);
179
203
  export {
180
204
  x as default
181
205
  };
package/dist/components/Logos/fivem/WhiteLogo.js CHANGED
@@ -1,24 +1,24 @@
1
- import { jsx as L } from "react/jsx-runtime";
2
- import t from "react";
3
- function e(o) {
4
- return /* @__PURE__ */ L(
1
+ import { jsx as o } from "react/jsx-runtime";
2
+ import e from "react";
3
+ function L(t) {
4
+ return /* @__PURE__ */ o(
5
5
  "svg",
6
6
  {
7
- viewBox: "0 0 30 30",
7
+ viewBox: "0 0 51 60",
8
8
  fill: "none",
9
9
  xmlns: "http://www.w3.org/2000/svg",
10
- ...o,
11
- children: /* @__PURE__ */ L(
10
+ ...t,
11
+ children: /* @__PURE__ */ o(
12
12
  "path",
13
13
  {
14
- d: "M9.919 15.243L11.299 11.106L11.308 11.082L11.506 10.488L12.853 6.441C12.94 6.177 13.186 6 13.465 6H16.297L16.702 7.221L17.011 8.151L14.656 10.506V10.494L14.644 10.518L9.916 15.246L9.919 15.243ZM8.221 20.334L7 24H10.636L13.201 15.354L8.221 20.334ZM17.86 10.698L15.433 13.125L18.646 24H22.285L17.86 10.698Z",
14
+ d: "M10.9844 27.123L19.5344 1.473C19.8284 0.591 20.6504 0 21.5774 0H31.0154L32.8124 5.403L10.9844 27.123ZM35.6954 14.07L27.6494 22.107L38.8424 60H50.9744L35.6954 14.07ZM5.17339 44.553L0.0253906 60H12.1484L21.6134 28.137L5.17339 44.556V44.553Z",
15
15
  fill: "#F1F1E4"
16
16
  }
17
17
  )
18
18
  }
19
19
  );
20
20
  }
21
- const r = t.memo(e);
21
+ const r = e.memo(L);
22
22
  export {
23
23
  r as default
24
24
  };
package/dist/components/Logos/redm/WhiteLogo.js CHANGED
@@ -1,40 +1,18 @@
1
- import { jsxs as o, jsx as L } from "react/jsx-runtime";
2
- import l from "react";
3
- function e(t) {
4
- return /* @__PURE__ */ o(
1
+ import { jsx as L } from "react/jsx-runtime";
2
+ import t from "react";
3
+ function e(o) {
4
+ return /* @__PURE__ */ L(
5
5
  "svg",
6
6
  {
7
- viewBox: "0 0 30 30",
7
+ viewBox: "0 0 34 60",
8
8
  fill: "none",
9
9
  xmlns: "http://www.w3.org/2000/svg",
10
- ...t,
11
- children: [
12
- /* @__PURE__ */ L(
13
- "path",
14
- {
15
- d: "M18.3867 17.7033L18.1967 17.6833L18.5167 16.06L18.7533 14.8667L18.7767 14.7533L18.7833 14.7267L18.6267 14.7033L18.4667 14.68L18.1333 14.63L17.9 14.5967L15.67 14.2667L15.6433 14.3967L15.53 14.9333L15.5167 15L15.4533 15.3L15.4367 15.3867L15.0467 17.57H12.9667L13.0833 15.9833L13.1467 15.1367V15.0867L13.1533 15.0367L13.1733 14.7733L13.18 14.6933L13.4 11.6767V9.46L13.4167 9.04L13.43 8.71667L13.4433 8.47L13.4633 7.99L13.48 7.62333L13.49 7.37333L13.55 5.16L11.2433 5.08667L10.2933 5.05333L10.3033 5.29333L10.2767 5.75333V8.13333L10.2567 8.41L10.2233 8.77667V12.29L10.1367 12.48L10.1433 12.6567L10.0933 13.4533L10.06 13.9933L10 14.2633V14.7533L10.0067 14.9933V24.9967H20.3033V24.35L20.7633 17.5933L19.0867 17.7033H18.3867ZM12.8467 22L13.01 21.19V20.62L12.8467 20.24H17.8733L17.82 21.0233L17.8733 22H12.8467Z",
16
- fill: "#F1F1E4"
17
- }
18
- ),
19
- /* @__PURE__ */ L(
20
- "path",
21
- {
22
- d: "M10.25 5.81L10.2767 5.78333L10.25 5.75667V5.81Z",
23
- fill: "#F1F1E4"
24
- }
25
- ),
26
- /* @__PURE__ */ L(
27
- "path",
28
- {
29
- d: "M18.2 5L17.8733 5.94L17.78 6.22L17.4567 7.16L17.3633 7.43667L17.24 7.79L16.9567 8.62333L16.5767 9.94333L16.3733 10.9033L18.0167 11.15L19.62 11.3867L19.98 9.97L20.6233 6.69333L20.69 6.36L20.74 6.09333L20.84 5.59L20.96 5H18.2Z",
30
- fill: "#F1F1E4"
31
- }
32
- )
33
- ]
10
+ ...o,
11
+ children: /* @__PURE__ */ L("path", { d: "M20.376 13.719L21.195 10.869L22.047 8.367L22.413 7.311L22.698 6.477L23.247 4.881L23.664 3.663L23.946 2.817L24.921 0H33.27L33.063 0.621L32.838 1.77L32.661 3.072L32.388 4.08L32.187 5.085L31.377 9.225L20.37 13.722L20.376 13.719ZM27.585 38.112L32.616 37.785L31.233 58.056V59.997H0.345L0 44.391L0.129 36.225L0.114 33.516L0.324 30.567L0.507 26.991L0.609 25.371L0.762 22.986L0.741 22.458L0.861 18.399L0.996 15.201V12.099V11.346L1.026 11.01L1.098 10.236L1.158 9.402V2.268L1.239 0.885L1.209 0.165L4.014 0.255L5.862 0.315L10.935 0.48L10.752 7.119L10.731 7.872L10.677 8.97L10.62 10.413L10.581 11.157L10.539 12.123L10.488 13.383V20.031L10.095 25.374L9.822 29.079L9.804 29.316L9.747 30.111L9.735 30.264L9.723 30.411L9.537 32.952L9.186 37.71H15.426L16.278 32.952L16.599 31.161L16.647 30.897L16.839 29.997L16.881 29.796L17.223 28.188L17.307 27.795L18.141 23.856L29.112 19.425L26.655 29.187L26.64 29.262L26.574 29.601L25.869 33.18L24.909 38.052L25.479 38.112H27.582H27.585ZM23.946 51.003L23.784 48.075L23.946 45.726H8.862L9.054 47.604V49.311L8.862 51H23.946V51.003Z", fill: "#EBEBEB" })
34
12
  }
35
13
  );
36
14
  }
37
- const r = l.memo(e);
15
+ const r = t.memo(e);
38
16
  export {
39
17
  r as default
40
18
  };
package/dist/components/Shroud/Shroud.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { jsx as t, jsxs as _ } from "react/jsx-runtime";
2
- import i from "react";
2
+ import s from "react";
3
3
  import { TITLE_OUTLET_ID as h } from "../Title/Title.js";
4
4
  import "../../utils/hooks/useGlobalKeyboardEvent.js";
5
5
  import "../../utils/hooks/useKeyboardClose.js";
@@ -14,7 +14,7 @@ function R(c) {
14
14
  const {
15
15
  forRef: r,
16
16
  ref: n
17
- } = c, [u, f] = i.useState({}), d = b(h, "before"), s = i.useCallback(() => {
17
+ } = c, [u, f] = s.useState({}), d = b(h, "before"), i = s.useCallback(() => {
18
18
  if (!r.current)
19
19
  return;
20
20
  const o = r.current.getBoundingClientRect(), m = {
@@ -34,7 +34,7 @@ function R(c) {
34
34
  )
35
35
  );
36
36
  }, [r]);
37
- return i.useEffect(s, []), p(s), /* @__PURE__ */ t(d, { children: /* @__PURE__ */ _("div", { ref: n, className: e.root, style: u, children: [
37
+ return s.useEffect(i, [i]), p(i), /* @__PURE__ */ t(d, { children: /* @__PURE__ */ _("div", { ref: n, className: e.root, style: u, children: [
38
38
  /* @__PURE__ */ t("div", { className: e.tile, "data-top": !0 }),
39
39
  /* @__PURE__ */ t("div", { className: e.tile, "data-left": !0 }),
40
40
  /* @__PURE__ */ t("div", { className: e.tile, "data-right": !0 }),
package/dist/components/Table/TableCell.js CHANGED
@@ -1,55 +1,57 @@
1
- import { jsx as a } from "react/jsx-runtime";
1
+ import { jsx as n } from "react/jsx-runtime";
2
2
  import "../Box/Box.js";
3
- import { stringPropFormater as c } from "../RSC/Box/Box.js";
4
- import h from "../Flex/Flex.js";
5
- import { clsx as y } from "../../utils/clsx.js";
6
- import { ui as t } from "../../utils/ui/ui.js";
3
+ import { stringPropFormater as x } from "../RSC/Box/Box.js";
4
+ import y from "../Flex/Flex.js";
5
+ import { clsx as C } from "../../utils/clsx.js";
6
+ import { ui as e } from "../../utils/ui/ui.js";
7
7
  import { s } from "../../Table.module-CMz5ENmI.js";
8
- function w(p) {
8
+ function N(m) {
9
9
  const {
10
- onClick: l,
11
- className: m,
12
- children: d,
13
- ref: f,
14
- width: o,
15
- display: r,
16
- as: i = "td",
17
- ...e
18
- } = p, n = i === "th";
19
- return typeof e.px > "u" && (e.px = 4), typeof e.py > "u" && (e.py = i === "th" ? void 0 : 1.5), /* @__PURE__ */ a(
20
- i,
10
+ onClick: o,
11
+ className: p,
12
+ children: c,
13
+ ref: d,
14
+ width: r,
15
+ display: i,
16
+ as: a = "td",
17
+ ...t
18
+ } = m, l = a === "th", f = t.px ?? 4, h = t.py ?? (l ? void 0 : 1.5);
19
+ return /* @__PURE__ */ n(
20
+ a,
21
21
  {
22
- ref: f,
22
+ ref: d,
23
23
  tabIndex: -1,
24
- role: n ? "columnheader" : "cell",
25
- onClick: l,
26
- className: y(
24
+ role: l ? "columnheader" : "cell",
25
+ onClick: o,
26
+ className: C(
27
27
  s.tableCell,
28
- m,
29
- t.getResponsiveClassnames("width", o),
30
- t.getResponsiveClassnames("display", r),
28
+ p,
29
+ e.getResponsiveClassnames("width", r),
30
+ e.getResponsiveClassnames("display", i),
31
31
  {
32
- [s.header]: n,
33
- [s.interactive]: !!l
32
+ [s.header]: l,
33
+ [s.interactive]: !!o
34
34
  }
35
35
  ),
36
36
  style: {
37
- ...t.getResponsiveStyles("width", o),
38
- ...t.getResponsiveStyles("display", r, c)
37
+ ...e.getResponsiveStyles("width", r),
38
+ ...e.getResponsiveStyles("display", i, x)
39
39
  },
40
- children: /* @__PURE__ */ a(
41
- h,
40
+ children: /* @__PURE__ */ n(
41
+ y,
42
42
  {
43
43
  height: "100%",
44
44
  alignItems: "center",
45
45
  className: s.tableCellContent,
46
- ...e,
47
- children: d
46
+ ...t,
47
+ px: f,
48
+ py: h,
49
+ children: c
48
50
  }
49
51
  )
50
52
  }
51
53
  );
52
54
  }
53
55
  export {
54
- w as default
56
+ N as default
55
57
  };
package/dist/styles-scss/tokens.scss CHANGED
@@ -235,7 +235,7 @@
235
235
  @include ui.define-color-token('button-focus-outline', ui.color('primary', $alpha: 0.5));
236
236
  @include ui.define-color-token('button-text', ui.color('primary'));
237
237
  @include ui.define-color-token('button-border', transparent);
238
- @include ui.define-color-token('button-background', ui.color('primary', $alpha: 0.15));
238
+ @include ui.define-color-token('button-background', transparent);
239
239
  @include ui.define-color-token('button-hover-border', ui.color('primary', $alpha: 0.05));
240
240
  @include ui.define-color-token('button-hover-background', ui.color('primary', $alpha: 0.1));
241
241
  @include ui.define-color-token('button-active-border', ui.color('primary', $alpha: 0.15));
package/dist/utils/hooks/usePopoverController.js CHANGED
@@ -1,35 +1,38 @@
1
1
  import e from "react";
2
- import { fastRandomId as b } from "../random.js";
2
+ import { fastRandomId as h } from "../random.js";
3
3
  let n = null;
4
- const h = 80, k = 350;
5
- function T() {
6
- const [d, l] = e.useState(!1), i = e.useRef(!1), s = e.useRef(null), u = e.useRef(null), c = e.useRef(!1), o = e.useRef(b()), f = e.useCallback((t) => {
7
- const R = t ? h : k;
8
- u.current !== null && clearTimeout(u.current), u.current = setTimeout(() => {
9
- u.current = null, !(!t && c.current) && (l(t), i.current = t, t && (n == null ? void 0 : n.id) !== o.current && (n == null || n.update(!1)), t && (n = {
10
- id: o.current,
11
- update: l
12
- }), !t && (n == null ? void 0 : n.id) === o.current && (n = null));
13
- }, R);
4
+ const k = 80, w = 350;
5
+ function m(u) {
6
+ n && u && n.id === u.id || (n = u);
7
+ }
8
+ function C() {
9
+ const [u, f] = e.useState(!1), l = e.useRef(!1), o = e.useRef(null), c = e.useRef(null), s = e.useRef(!1), i = e.useRef(h()), d = e.useCallback((t) => {
10
+ const b = t ? k : w;
11
+ c.current !== null && clearTimeout(c.current), c.current = setTimeout(() => {
12
+ c.current = null, !(!t && s.current) && (f(t), l.current = t, t && (n == null ? void 0 : n.id) !== i.current && (n == null || n.update(!1)), t && m({
13
+ id: i.current,
14
+ update: f
15
+ }), !t && (n == null ? void 0 : n.id) === i.current && m(null));
16
+ }, b);
14
17
  }, []), r = e.useCallback((t) => {
15
- !t && c.current || f(t);
16
- }, [f]), p = e.useCallback(() => {
18
+ !t && s.current || d(t);
19
+ }, [d]), p = e.useCallback(() => {
17
20
  r(!0);
18
- }, [r]), m = e.useCallback(() => {
19
- r(!1);
20
21
  }, [r]), v = e.useCallback(() => {
21
- c.current = !0;
22
+ r(!1);
23
+ }, [r]), R = e.useCallback(() => {
24
+ s.current = !0;
22
25
  }, []), a = e.useCallback((t) => {
23
- c.current = !1, s.current && (s.current.contains(t.target) || i.current && r(!1));
26
+ s.current = !1, o.current && (o.current.contains(t.target) || l.current && r(!1));
24
27
  }, [r]);
25
28
  return e.useEffect(() => (window.addEventListener("mouseup", a), () => window.removeEventListener("mouseup", a)), [a]), {
26
- active: d,
27
- wrapperRef: s,
29
+ active: u,
30
+ wrapperRef: o,
28
31
  handleMouseEnter: p,
29
- handleMouseLeave: m,
30
- handleMouseDown: v
32
+ handleMouseLeave: v,
33
+ handleMouseDown: R
31
34
  };
32
35
  }
33
36
  export {
34
- T as usePopoverController
37
+ C as usePopoverController
35
38
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cfx-dev/ui-components",
3
- "version": "5.0.25",
3
+ "version": "5.0.26",
4
4
  "type": "module",
5
5
  "license": "MIT",
6
6
  "main": "dist/main.js",