@cfx-dev/ui-components 2.1.21 → 2.1.23

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.
@@ -1,104 +1,107 @@
1
1
  import { jsx as P } from "react/jsx-runtime";
2
- import m from "react";
3
- import { useContextualStyle as j } from "../../Style/Style.js";
4
- import { ui as d } from "../../ui.js";
2
+ import c from "react";
3
+ import { useContextualStyle as W } from "../../Style/Style.js";
4
+ import { ui as a } from "../../ui.js";
5
5
  import { clsx as H } from "../../../utils/clsx.js";
6
- import '../../../assets/Box.css';const W = "_root_1bvck_1", z = "_grow_1bvck_13", o = {
7
- root: W,
8
- "full-width": "_full-width_1bvck_1",
9
- "full-height": "_full-height_1bvck_4",
10
- "no-overflow": "_no-overflow_1bvck_7",
11
- "no-shrink": "_no-shrink_1bvck_10",
12
- grow: z,
13
- "no-grow": "_no-grow_1bvck_16"
6
+ import '../../../assets/Box.css';const z = "_root_1rhjm_1", D = "_grow_1rhjm_16", t = {
7
+ root: z,
8
+ "full-width": "_full-width_1rhjm_1",
9
+ "fit-content-width": "_fit-content-width_1rhjm_4",
10
+ "full-height": "_full-height_1rhjm_7",
11
+ "no-overflow": "_no-overflow_1rhjm_10",
12
+ "no-shrink": "_no-shrink_1rhjm_13",
13
+ grow: D,
14
+ "no-grow": "_no-grow_1rhjm_19"
14
15
  };
15
- function b(r) {
16
- return typeof r == "string" ? r : d.q(r);
16
+ function y(r) {
17
+ return typeof r == "string" ? r : a.q(r);
17
18
  }
18
- const J = m.forwardRef(function(x, y) {
19
+ const K = c.forwardRef(function(S, M) {
19
20
  const {
20
- noOverflow: S = !1,
21
- noShrink: M = !1,
21
+ noOverflow: k = !1,
22
+ noShrink: v = !1,
22
23
  grow: e = void 0,
23
- width: g,
24
- height: a,
24
+ width: d,
25
+ height: g,
25
26
  children: A,
26
- className: N,
27
- fullWidth: R,
28
- fullHeight: q,
27
+ className: C,
28
+ fullWidth: N,
29
+ fullHeight: R,
30
+ fitContentWidth: b,
29
31
  style: p,
30
32
  // --- MPProps
31
- m: l,
32
- mt: s,
33
- mr: n,
34
- mb: f,
35
- ml: i,
36
- p: c,
37
- pt: h,
38
- pr: u,
39
- pb: _,
40
- pl: w
41
- } = x, k = j(), B = H(o.root, N, {
42
- [o["full-width"]]: R,
43
- [o["full-height"]]: q,
44
- [o["no-overflow"]]: S,
45
- [o["no-shrink"]]: M,
46
- [o["no-grow"]]: e === !1,
47
- [o.grow]: e === !0
48
- }), C = m.useMemo(() => d.getAllMPAttrs({
49
- m: l,
50
- mt: s,
51
- mr: n,
52
- mb: f,
53
- ml: i,
54
- p: c,
55
- pt: h,
56
- pr: u,
57
- pb: _,
58
- pl: w
33
+ m: n,
34
+ mt: i,
35
+ mr: l,
36
+ mb: s,
37
+ ml: f,
38
+ p: h,
39
+ pt: m,
40
+ pr: _,
41
+ pb: w,
42
+ pl: u
43
+ } = S, j = W(), q = H(t.root, C, {
44
+ [t["full-width"]]: N,
45
+ [t["full-height"]]: R,
46
+ [t["fit-content-width"]]: b,
47
+ [t["no-overflow"]]: k,
48
+ [t["no-shrink"]]: v,
49
+ [t["no-grow"]]: e === !1,
50
+ [t.grow]: e === !0
51
+ }), B = c.useMemo(() => a.getAllMPAttrs({
52
+ m: n,
53
+ mt: i,
54
+ mr: l,
55
+ mb: s,
56
+ ml: f,
57
+ p: h,
58
+ pt: m,
59
+ pr: _,
60
+ pb: w,
61
+ pl: u
59
62
  }), [
63
+ n,
64
+ i,
60
65
  l,
61
66
  s,
62
- n,
63
67
  f,
64
- i,
65
- c,
66
68
  h,
67
- u,
69
+ m,
68
70
  _,
69
- w
70
- ]), v = m.useMemo(() => d.getAllMPStyles({
71
- m: l,
72
- mt: s,
73
- mr: n,
74
- mb: f,
75
- ml: i,
76
- p: c,
77
- pt: h,
78
- pr: u,
79
- pb: _,
80
- pl: w
71
+ w,
72
+ u
73
+ ]), x = c.useMemo(() => a.getAllMPStyles({
74
+ m: n,
75
+ mt: i,
76
+ mr: l,
77
+ mb: s,
78
+ ml: f,
79
+ p: h,
80
+ pt: m,
81
+ pr: _,
82
+ pb: w,
83
+ pl: u
81
84
  }), [
85
+ n,
86
+ i,
82
87
  l,
83
88
  s,
84
- n,
85
89
  f,
86
- i,
87
- c,
88
90
  h,
89
- u,
91
+ m,
90
92
  _,
91
- w
92
- ]), O = m.useMemo(() => {
93
- const t = {
94
- ...v,
95
- ...k,
93
+ w,
94
+ u
95
+ ]), O = c.useMemo(() => {
96
+ const o = {
97
+ ...x,
98
+ ...j,
96
99
  ...p || {}
97
100
  };
98
- return g && (t.width = b(g)), a && (t.height = b(a)), !t.width && e === !0 && (t.width = "1px"), t;
99
- }, [e, a, v, p, g, k]);
100
- return /* @__PURE__ */ P("div", { ...C, ref: y, className: B, style: O, children: A });
101
+ return d && (o.width = y(d)), g && (o.height = y(g)), !o.width && e === !0 && (o.width = "1px"), o;
102
+ }, [e, g, x, p, d, j]);
103
+ return /* @__PURE__ */ P("div", { ...B, ref: M, className: q, style: O, children: A });
101
104
  });
102
105
  export {
103
- J as Box
106
+ K as Box
104
107
  };
@@ -1,70 +1,23 @@
1
- import { jsxs as t, jsx as L } from "react/jsx-runtime";
2
- import C from "react";
3
- function i() {
4
- return /* @__PURE__ */ t(
5
- "svg",
6
- {
7
- viewBox: "0 0 390 82",
8
- fill: "none",
9
- xmlns: "http://www.w3.org/2000/svg",
10
- children: [
11
- /* @__PURE__ */ L(
12
- "path",
13
- {
14
- fill: "white",
15
- d: "M113 0H117V81H113V0Z"
16
- }
17
- ),
18
- /* @__PURE__ */ L(
19
- "path",
20
- {
21
- fill: "white",
22
- d: "M9.30157 12L31.082 12.0516C35.6343 12.0172 39.0333 12.7374 41.2775 14.2109C44.0202 16.0172 45.3893 19.1234 45.3893 23.5308C45.3893 30.7877 41.9904 34.8996 35.1924 35.8651V35.967C38.19 36.7059 39.7055 39.1636 39.7389 43.34C39.7389 45.4792 39.6577 48.2195 39.4969 51.5595C39.4969 53.8006 39.975 55.7389 40.9342 57.3745H28.9986C28.4408 56.7762 28.1626 55.5581 28.1626 53.7174C28.3915 50.6413 28.5045 48.1191 28.5045 46.1492C28.5045 42.1707 26.5732 40.1808 22.7121 40.1808H14.9897L11.6212 56.274H0L9.30157 12ZM19.1551 21.2267L16.9239 31.9096H26.1849C31.3616 31.9096 33.9652 29.8867 34 25.8407C34 22.7647 31.905 21.2267 27.7149 21.2267H19.1551Z"
23
- }
24
- ),
25
- /* @__PURE__ */ L(
26
- "path",
27
- {
28
- fill: "white",
29
- d: "M53.4565 57.4247L51.134 42.5337L42.5163 57.3228L28.9015 57.2812L37.3178 66.2539L30.0968 82L45.5342 72.7217L57.0178 81.6442L54.8937 66.8551L68.1579 57.4247H53.4565ZM54.1505 76.6829L45.6835 70.1133L34.9432 76.5294L39.891 65.8465L33.9073 59.4806H43.7536L49.9387 48.8063L51.6266 59.5825H61.3715L52.5626 65.7963L54.1505 76.6829Z"
30
- }
31
- ),
32
- /* @__PURE__ */ t("g", { clipPath: "url(#clip0_1099_177)", children: [
33
- /* @__PURE__ */ L(
34
- "path",
35
- {
36
- fill: "white",
37
- d: "M227.499 9H215.02L216.054 21.8535H204.645L205.679 9H193.306L163 73H200.491L201.721 57.7933H218.96L220.19 73H257.788L227.481 9H227.499ZM202.594 47.2039L204.217 27.2017H216.5L218.122 47.2039H202.594Z"
38
- }
39
- ),
40
- /* @__PURE__ */ L(
41
- "path",
42
- {
43
- fill: "white",
44
- d: "M300.77 69C293.5 69 287.548 66.4685 282.93 61.4056C278.312 56.3256 276.002 49.5351 276.002 41C276.002 32.4649 278.312 25.6744 282.93 20.5944C287.548 15.5315 293.483 13 300.77 13C306.397 13 311.272 14.5394 315.411 17.584C319.55 20.6286 322.27 25.2639 323.57 31.4386H317.173C316.01 27.0257 313.991 23.81 311.084 21.8088C308.176 19.8076 304.738 18.7984 300.77 18.7984C295.296 18.7984 290.918 20.7654 287.599 24.6995C284.281 28.6335 282.639 34.0727 282.639 41C282.639 47.9273 284.298 53.3494 287.599 57.3005C290.918 61.2346 295.296 63.2016 300.77 63.2016C304.892 63.2016 308.552 61.9359 311.751 59.4044C314.966 56.8729 316.899 53.1784 317.549 48.3036H323.878C323.228 54.923 320.696 60.0373 316.283 63.6121C311.87 67.204 306.705 69 300.787 69H300.77Z"
45
- }
46
- ),
47
- /* @__PURE__ */ L(
48
- "path",
49
- {
50
- fill: "white",
51
- d: "M346.37 19.3286C342.915 19.3286 341.17 21.1588 341.17 24.8192V28.9585H349.449V34.2266H341.17V67.7856H335.15V34.2266H328.753V28.9585H335.15V24.9731C335.15 17.7037 338.759 14.0605 345.994 14.0605C347.345 14.0605 348.628 14.1118 349.825 14.2144V19.3286H346.37Z"
52
- }
53
- ),
54
- /* @__PURE__ */ L(
55
- "path",
56
- {
57
- fill: "white",
58
- d: "M388.67 28.9585L374.593 47.9273L389.422 67.8027H382.341L380.237 64.8607C377.021 60.2938 373.994 56.0861 371.137 52.2205C366.93 57.8992 363.834 62.124 361.884 64.9462L359.849 67.8027H352.853L367.682 47.9273L353.605 28.9585H360.687L363.697 33.0977C366.656 37.1173 369.17 40.6237 371.223 43.6341C373.789 40.025 376.286 36.5015 378.749 33.0977L381.691 28.9585H388.687H388.67Z"
59
- }
60
- )
61
- ] }),
62
- /* @__PURE__ */ L("defs", { children: /* @__PURE__ */ L("clipPath", { id: "clip0_1099_177", children: /* @__PURE__ */ L("rect", { width: "224.003", height: "74", fill: "white", transform: "translate(165 4)" }) }) })
63
- ]
64
- }
65
- );
1
+ import { jsxs as t, jsx as C } from "react/jsx-runtime";
2
+ import i from "react";
3
+ function H() {
4
+ return /* @__PURE__ */ t("svg", { width: "503", height: "83", viewBox: "0 0 503 83", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
5
+ /* @__PURE__ */ C("path", { d: "M116 0H120V81H116V0Z", fill: "white" }),
6
+ /* @__PURE__ */ C("path", { d: "M12.3016 12L34.082 12.0516C38.6343 12.0172 42.0333 12.7374 44.2775 14.2109C47.0202 16.0172 48.3893 19.1234 48.3893 23.5308C48.3893 30.7877 44.9904 34.8996 38.1924 35.8651V35.967C41.19 36.7059 42.7055 39.1636 42.7389 43.34C42.7389 45.4792 42.6577 48.2195 42.4969 51.5595C42.4969 53.8006 42.975 55.7389 43.9342 57.3745H31.9986C31.4408 56.7762 31.1626 55.5581 31.1626 53.7174C31.3915 50.6413 31.5045 48.1191 31.5045 46.1492C31.5045 42.1707 29.5732 40.1808 25.7121 40.1808H17.9897L14.6212 56.274H3L12.3016 12ZM22.1551 21.2267L19.9239 31.9096H29.1849C34.3616 31.9096 36.9652 29.8867 37 25.8407C37 22.7647 34.905 21.2267 30.7149 21.2267H22.1551Z", fill: "white" }),
7
+ /* @__PURE__ */ C("path", { d: "M56.4565 57.4247L54.134 42.5337L45.5163 57.3228L31.9015 57.2812L40.3178 66.2539L33.0968 82L48.5342 72.7217L60.0178 81.6442L57.8937 66.8551L71.1579 57.4247H56.4565ZM57.1505 76.6829L48.6835 70.1133L37.9432 76.5294L42.891 65.8465L36.9073 59.4806H46.7536L52.9387 48.8063L54.6266 59.5825H64.3715L55.5626 65.7963L57.1505 76.6829Z", fill: "white" }),
8
+ /* @__PURE__ */ t("g", { clipPath: "url(#clip0_223_2228)", children: [
9
+ /* @__PURE__ */ C("path", { d: "M230.499 9H218.02L219.054 21.8535H207.645L208.679 9H196.306L166 73H203.491L204.721 57.7933H221.96L223.19 73H260.788L230.481 9H230.499ZM205.594 47.2039L207.217 27.2017H219.5L221.122 47.2039H205.594Z", fill: "white" }),
10
+ /* @__PURE__ */ C("path", { d: "M303.77 69C296.5 69 290.548 66.4685 285.93 61.4056C281.312 56.3256 279.002 49.5351 279.002 41C279.002 32.4649 281.312 25.6744 285.93 20.5944C290.548 15.5315 296.483 13 303.77 13C309.397 13 314.272 14.5394 318.411 17.584C322.55 20.6286 325.27 25.2639 326.57 31.4386H320.173C319.01 27.0257 316.991 23.81 314.084 21.8088C311.176 19.8076 307.738 18.7984 303.77 18.7984C298.296 18.7984 293.918 20.7654 290.599 24.6995C287.281 28.6335 285.639 34.0727 285.639 41C285.639 47.9273 287.298 53.3494 290.599 57.3005C293.918 61.2346 298.296 63.2016 303.77 63.2016C307.892 63.2016 311.552 61.9359 314.751 59.4044C317.966 56.8729 319.899 53.1784 320.549 48.3036H326.878C326.228 54.923 323.696 60.0373 319.283 63.6121C314.87 67.204 309.705 69 303.787 69H303.77Z", fill: "white" }),
11
+ /* @__PURE__ */ C("path", { d: "M349.37 19.3286C345.915 19.3286 344.17 21.1588 344.17 24.8192V28.9585H352.449V34.2266H344.17V67.7856H338.15V34.2266H331.753V28.9585H338.15V24.9731C338.15 17.7037 341.759 14.0605 348.994 14.0605C350.345 14.0605 351.628 14.1118 352.825 14.2144V19.3286H349.37Z", fill: "white" }),
12
+ /* @__PURE__ */ C("path", { d: "M391.67 28.9585L377.593 47.9273L392.422 67.8027H385.341L383.237 64.8607C380.021 60.2938 376.994 56.0861 374.137 52.2205C369.93 57.8992 366.834 62.124 364.884 64.9462L362.849 67.8027H355.853L370.682 47.9273L356.605 28.9585H363.687L366.697 33.0977C369.656 37.1173 372.17 40.6237 374.223 43.6341C376.789 40.025 379.286 36.5015 381.749 33.0977L384.691 28.9585H391.687H391.67Z", fill: "white" }),
13
+ /* @__PURE__ */ C("path", { d: "M405.285 67.7856H397.69V60.2596H405.285V67.7856Z", fill: "white" }),
14
+ /* @__PURE__ */ C("path", { d: "M432.908 28.3598C433.712 28.3598 434.396 28.3769 434.944 28.4282V34.2266H433.439C429.47 34.2266 426.357 35.2016 424.1 37.1686C421.842 39.1185 420.713 41.9578 420.713 45.6695V67.8027H414.692V28.9585H420.405V35.8002C423.056 30.84 427.23 28.3427 432.891 28.3427L432.908 28.3598Z", fill: "white" }),
15
+ /* @__PURE__ */ C("path", { d: "M456.016 68.6921C450.646 68.6921 446.301 66.8619 442.966 63.2016C439.63 59.5412 437.954 54.598 437.954 48.372C437.954 42.146 439.596 37.3396 442.88 33.628C446.164 29.9163 450.492 28.0519 455.863 28.0519C461.233 28.0519 465.8 29.9847 468.965 33.8503C472.129 37.7159 473.702 42.5565 473.702 48.372V50.4759H444.197C444.505 54.7349 445.685 57.9334 447.772 60.0373C449.859 62.1411 452.647 63.2016 456.17 63.2016C461.541 63.2016 464.979 60.7899 466.484 55.9835H472.728C471.718 59.7978 469.803 62.8766 466.963 65.2028C464.124 67.529 460.481 68.7092 456.016 68.7092V68.6921ZM444.351 45.0538H467.237C466.929 41.7013 465.8 38.9304 463.816 36.7752C461.832 34.62 459.181 33.5425 455.88 33.5425C452.767 33.5425 450.201 34.5174 448.166 36.4844C446.13 38.4343 444.864 41.3079 444.368 45.0709L444.351 45.0538Z", fill: "white" })
16
+ ] }),
17
+ /* @__PURE__ */ C("defs", { children: /* @__PURE__ */ C("clipPath", { id: "clip0_223_2228", children: /* @__PURE__ */ C("rect", { width: "335.003", height: "74", fill: "white", transform: "translate(168 4)" }) }) })
18
+ ] });
66
19
  }
67
- const e = C.memo(i);
20
+ const h = i.memo(H);
68
21
  export {
69
- e as default
22
+ h as default
70
23
  };
@@ -1,44 +1,56 @@
1
1
  import { jsx as t, jsxs as C } from "react/jsx-runtime";
2
- import c, { useState as w } from "react";
3
- import I from "../Checkbox/Checkbox.js";
4
- import T from "../IconButton/IconButton.js";
5
- import { Text as $ } from "../Text/Text.js";
2
+ import l, { useState as k } from "react";
3
+ import v from "../Checkbox/Checkbox.js";
4
+ import y from "../IconButton/IconButton.js";
5
+ import { Text as I } from "../Text/Text.js";
6
6
  import { clsx as p } from "../../utils/clsx.js";
7
- import '../../assets/Table.css';const j = "_tableIcon_xresd_1", z = "_iconButton_xresd_1", A = "_root_xresd_21", E = "_radio_xresd_38", O = "_radioContent_xresd_41", S = "_pointer_xresd_48", F = "_selectedRow_xresd_51", H = "_headerContent_xresd_61", V = "_hidden_xresd_80", n = {
8
- tableIcon: j,
9
- iconButton: z,
10
- root: A,
11
- radio: E,
12
- radioContent: O,
13
- pointer: S,
14
- selectedRow: F,
7
+ import '../../assets/Table.css';const $ = "_tableIcon_jm0lw_1", S = "_iconButton_jm0lw_1", z = "_root_jm0lw_21", A = "_radio_jm0lw_38", E = "_radioContent_jm0lw_42", O = "_pointer_jm0lw_49", g = "_selectedRow_jm0lw_52", F = "_headerText_jm0lw_56", H = "_headerContent_jm0lw_65", V = "_hidden_jm0lw_84", o = {
8
+ tableIcon: $,
9
+ iconButton: S,
10
+ root: z,
11
+ radio: A,
12
+ radioContent: E,
13
+ pointer: O,
14
+ selectedRow: g,
15
+ headerText: F,
15
16
  headerContent: H,
16
17
  hidden: V
17
18
  };
18
19
  function q(r) {
19
20
  const {
20
21
  className: e,
21
- color: o = "inherit"
22
- } = r, i = p(n.tableIcon, n.iconButton, e);
23
- return /* @__PURE__ */ t(T, { ...r, className: i, color: o });
22
+ color: n = "inherit"
23
+ } = r, i = p(o.tableIcon, o.iconButton, e);
24
+ return /* @__PURE__ */ t(y, { ...r, className: i, color: n });
24
25
  }
25
26
  function D(r) {
26
27
  const {
27
28
  item: e,
28
- onSortClick: o
29
- } = r, i = c.useCallback(() => {
30
- o && o(e.sortKey || e.text);
31
- }, [e.sortKey, e.text, o]), l = p(n.headerContent, {
32
- [n.sortable]: e.sortable,
33
- [n.empty]: !e.text
29
+ onSortClick: n
30
+ } = r, i = l.useCallback(() => {
31
+ n && n(e.sortKey || e.text);
32
+ }, [e.sortKey, e.text, n]), s = p(o.headerContent, {
33
+ [o.sortable]: e.sortable,
34
+ [o.empty]: !e.text
34
35
  });
35
36
  return /* @__PURE__ */ t(
36
37
  "th",
37
38
  {
38
- className: e.sortable ? n.pointer : void 0,
39
+ className: e.sortable ? o.pointer : void 0,
39
40
  onClick: e.sortable ? i : void 0,
40
- children: /* @__PURE__ */ C("div", { className: l, children: [
41
- /* @__PURE__ */ t($, { color: "secondary", weight: "bold", uppercase: !0, size: "xxsmall", children: e.text }),
41
+ children: /* @__PURE__ */ C("div", { className: s, children: [
42
+ /* @__PURE__ */ t(
43
+ I,
44
+ {
45
+ className: o.headerText,
46
+ color: "secondary",
47
+ letterSpacing: "large",
48
+ weight: "bold",
49
+ uppercase: !0,
50
+ size: "xxsmall",
51
+ children: e.text
52
+ }
53
+ ),
42
54
  !!e.sortable && /* @__PURE__ */ t(
43
55
  q,
44
56
  {
@@ -53,40 +65,40 @@ function D(r) {
53
65
  function G(r) {
54
66
  const {
55
67
  index: e,
56
- includeRadio: o = !1,
68
+ includeRadio: n = !1,
57
69
  loading: i,
58
- selectedRow: l,
59
- item: k,
70
+ selectedRow: s,
71
+ item: x,
60
72
  dataContainer: _,
61
73
  onSelectChange: d
62
- } = r, u = c.useCallback((a) => {
74
+ } = r, u = l.useCallback((a) => {
63
75
  d(
64
76
  a ? e : null
65
77
  );
66
- }, [d, e]), b = c.useCallback(() => {
78
+ }, [d, e]), b = l.useCallback(() => {
67
79
  d(e);
68
80
  }, [d, e]), f = p({
69
- [n.selectedRow]: l === e,
70
- [n.pointer]: o
81
+ [o.selectedRow]: s === e,
82
+ [o.pointer]: n
71
83
  });
72
84
  return /* @__PURE__ */ C(
73
85
  "tr",
74
86
  {
75
87
  className: f,
76
- onClick: o ? b : void 0,
88
+ onClick: n ? b : void 0,
77
89
  children: [
78
- o && /* @__PURE__ */ t("td", { className: p(n.radio, { [n.hidden]: i }), children: /* @__PURE__ */ t("div", { className: n.radioContent, children: /* @__PURE__ */ t(
79
- I,
90
+ n && /* @__PURE__ */ t("td", { className: p(o.radio, { [o.hidden]: i }), children: /* @__PURE__ */ t("div", { className: o.radioContent, children: /* @__PURE__ */ t(
91
+ v,
80
92
  {
81
93
  size: "small",
82
94
  onCheckedChange: u,
83
95
  "aria-label": `${e}`,
84
- checked: l === e
96
+ checked: s === e
85
97
  }
86
98
  ) }) }),
87
- k.map((a, x) => {
99
+ x.map((a, w) => {
88
100
  let h;
89
- return c.isValidElement(a) ? h = a : _ ? h = c.createElement(_, { item: a }) : h = String(a), /* @__PURE__ */ t("td", { children: h }, `item-${x}`);
101
+ return l.isValidElement(a) ? h = a : _ ? h = l.createElement(_, { item: a }) : h = String(a), /* @__PURE__ */ t("td", { children: h }, `item-${w}`);
90
102
  })
91
103
  ]
92
104
  },
@@ -96,53 +108,53 @@ function G(r) {
96
108
  function U({
97
109
  headers: r = [],
98
110
  data: e = [],
99
- includeRadio: o = !1,
111
+ includeRadio: n = !1,
100
112
  loading: i = !1,
101
- onSelectChange: l,
102
- dataContainer: k,
113
+ onSelectChange: s,
114
+ dataContainer: x,
103
115
  selectedRow: _ = null,
104
116
  sortBy: d,
105
117
  sortOrder: u = "asc",
106
118
  onSortChange: b
107
119
  }) {
108
- const [f, a] = w(_), [x, h] = w(d), [N, R] = w(u), v = c.useCallback((s) => {
109
- const B = x === s && N === "asc" ? "desc" : "asc";
110
- h(s), R(B), b == null || b(s, B);
111
- }, [b, x, N]), y = c.useCallback(
112
- (s) => {
113
- const m = s === f ? null : s;
114
- a(m), l == null || l(m);
120
+ const [f, a] = k(_), [w, h] = k(d), [j, N] = k(u), T = l.useCallback((c) => {
121
+ const R = w === c && j === "asc" ? "desc" : "asc";
122
+ h(c), N(R), b == null || b(c, R);
123
+ }, [b, w, j]), B = l.useCallback(
124
+ (c) => {
125
+ const m = c === f ? null : c;
126
+ a(m), s == null || s(m);
115
127
  },
116
- [l, f]
128
+ [s, f]
117
129
  );
118
- return c.useEffect(() => {
130
+ return l.useEffect(() => {
119
131
  a(_);
120
- }, [_]), c.useEffect(() => {
132
+ }, [_]), l.useEffect(() => {
121
133
  h(d);
122
- }, [d]), c.useEffect(() => {
123
- R(u);
124
- }, [u]), /* @__PURE__ */ t("div", { className: n.root, children: /* @__PURE__ */ C("table", { children: [
134
+ }, [d]), l.useEffect(() => {
135
+ N(u);
136
+ }, [u]), /* @__PURE__ */ t("div", { className: o.root, children: /* @__PURE__ */ C("table", { children: [
125
137
  /* @__PURE__ */ t("thead", { children: /* @__PURE__ */ C("tr", { children: [
126
- o && /* @__PURE__ */ t("th", { "aria-label": "Select Row" }),
127
- r.map((s, m) => /* @__PURE__ */ t(
138
+ n && /* @__PURE__ */ t("th", { "aria-label": "Select Row" }),
139
+ r.map((c, m) => /* @__PURE__ */ t(
128
140
  D,
129
141
  {
130
- item: s,
131
- onSortClick: v
142
+ item: c,
143
+ onSortClick: T
132
144
  },
133
145
  `header-${m}`
134
146
  ))
135
147
  ] }) }),
136
- /* @__PURE__ */ t("tbody", { children: e.map((s, m) => /* @__PURE__ */ t(
148
+ /* @__PURE__ */ t("tbody", { children: e.map((c, m) => /* @__PURE__ */ t(
137
149
  G,
138
150
  {
139
151
  index: m,
140
- item: s,
141
- includeRadio: o,
152
+ item: c,
153
+ includeRadio: n,
142
154
  loading: i,
143
155
  selectedRow: f,
144
- onSelectChange: y,
145
- dataContainer: k
156
+ onSelectChange: B,
157
+ dataContainer: x
146
158
  },
147
159
  `row-${m}`
148
160
  )) })
@@ -7,7 +7,7 @@ import { Scrollable as c } from "../Layout/Scrollable/Scrollable.js";
7
7
  import "../Layout/Scrollable/VirtualScrollable.js";
8
8
  import { Text as r } from "../Text/Text.js";
9
9
  import { Table as o } from "./Table.js";
10
- const i = [
10
+ const n = [
11
11
  [
12
12
  "Cell 1",
13
13
  "Cell 2",
@@ -27,7 +27,7 @@ const i = [
27
27
  ["Cell 7", "Cell 8", "Cell 9", new Date(2023, 2, 1).toLocaleDateString(), /* @__PURE__ */ e(l, { children: "Badge" }, "3")],
28
28
  ["Cell 4", "Cell 5", "Cell 6", new Date(2023, 1, 1).toLocaleDateString(), /* @__PURE__ */ e(l, { children: "Badge" }, "2")],
29
29
  ["Cell 7", "Cell 8", "Cell 9", new Date(2023, 2, 1).toLocaleDateString(), /* @__PURE__ */ e(l, { children: "Badge" }, "3")]
30
- ], n = [
30
+ ], i = [
31
31
  { text: "Header 1" },
32
32
  { text: "Header 2" },
33
33
  { text: "Header 3" },
@@ -38,7 +38,7 @@ function C() {
38
38
  return /* @__PURE__ */ t(a, { gap: "large", vertical: !0, children: [
39
39
  /* @__PURE__ */ t(a, { gap: "normal", vertical: !0, children: [
40
40
  /* @__PURE__ */ e(r, { children: "Table" }),
41
- /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(o, { includeRadio: !0, headers: n, data: i }) })
41
+ /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(o, { headers: i, data: n }) })
42
42
  ] }),
43
43
  /* @__PURE__ */ t(a, { fullWidth: !0, vertical: !0, children: [
44
44
  /* @__PURE__ */ e(r, { children: "Table with scroll" }),
@@ -49,13 +49,13 @@ function C() {
49
49
  height: "400px",
50
50
  overflow: "hidden"
51
51
  },
52
- children: /* @__PURE__ */ e(c, { children: /* @__PURE__ */ e(o, { includeRadio: !0, headers: n, data: i }) })
52
+ children: /* @__PURE__ */ e(c, { children: /* @__PURE__ */ e(o, { includeRadio: !0, headers: i, data: n }) })
53
53
  }
54
54
  )
55
55
  ] })
56
56
  ] });
57
57
  }
58
- const B = d.memo(C);
58
+ const L = d.memo(C);
59
59
  export {
60
- B as default
60
+ L as default
61
61
  };
@@ -262,7 +262,7 @@ $control-heights: (
262
262
  @include ui.define-color-token('button-linked-text', ui.color('tertiary'));
263
263
  @include ui.define-color-token('button-linked-border', transparent);
264
264
  @include ui.define-color-token('button-linked-background', transparent);
265
- @include ui.define-color-token('button-linked-hover-text', ui.color('red'));
265
+ @include ui.define-color-token('button-linked-hover-text', ui.color('accent'));
266
266
  @include ui.define-color-token('button-linked-hover-border', transparent);
267
267
  @include ui.define-color-token('button-linked-hover-background', #24293B);
268
268
  @include ui.define-color-token('button-linked-active-text', ui.color('red'));
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@cfx-dev/ui-components",
3
3
  "private": false,
4
- "version": "2.1.21",
4
+ "version": "2.1.23",
5
5
  "type": "module",
6
6
  "license": "MIT",
7
7
  "main": "dist/main.js",