@alphakits/ui 2.4.9 → 2.5.0
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,82 +1,79 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import
|
|
3
|
-
import { useRef as
|
|
4
|
-
import { getDataTestId as
|
|
5
|
-
import { useFocus as
|
|
6
|
-
import { Typography as
|
|
7
|
-
import { Pure as
|
|
1
|
+
import { jsxs as y, jsx as n } from "react/jsx-runtime";
|
|
2
|
+
import c from "classnames";
|
|
3
|
+
import { useRef as E, useCallback as T } from "react";
|
|
4
|
+
import { getDataTestId as N } from "../../__internal/utils/get-data-test-id.js";
|
|
5
|
+
import { useFocus as _ } from "../../hooks/useFocus/index.js";
|
|
6
|
+
import { Typography as f } from "../../typography/component.js";
|
|
7
|
+
import { Pure as A } from "../pure/component.js";
|
|
8
8
|
import r from "./index.module.css.js";
|
|
9
|
-
const
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
9
|
+
const p = (t, i) => T(
|
|
10
|
+
(o) => {
|
|
11
|
+
if (!i || !t) return;
|
|
12
|
+
const e = o.currentTarget, s = e.firstElementChild ?? e;
|
|
13
|
+
s.scrollWidth > s.clientWidth + 1 ? e.getAttribute("title") !== t && e.setAttribute("title", t) : e.hasAttribute("title") && e.removeAttribute("title");
|
|
14
|
+
},
|
|
15
|
+
[t, i]
|
|
16
|
+
), u = (t) => typeof t == "string" || typeof t == "number" ? String(t) : void 0, R = ({
|
|
17
|
+
className: t,
|
|
18
|
+
dataTestId: i,
|
|
19
|
+
title: o,
|
|
20
|
+
subtitle: e,
|
|
21
|
+
size: s = "m",
|
|
22
|
+
addon: a,
|
|
23
|
+
compactAddon: h,
|
|
24
|
+
singleLineTitle: l,
|
|
25
|
+
showTitleTooltipOnOverflow: g
|
|
19
26
|
}) => {
|
|
20
|
-
const
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
);
|
|
24
|
-
return E(() => {
|
|
25
|
-
if (!s || !i || !n) {
|
|
26
|
-
f(!1);
|
|
27
|
-
return;
|
|
28
|
-
}
|
|
29
|
-
const t = a.current;
|
|
30
|
-
if (!t) return;
|
|
31
|
-
const o = () => {
|
|
32
|
-
f(t.scrollWidth > t.clientWidth);
|
|
33
|
-
};
|
|
34
|
-
if (o(), typeof ResizeObserver < "u") {
|
|
35
|
-
const l = new ResizeObserver(o);
|
|
36
|
-
return l.observe(t), () => l.disconnect();
|
|
37
|
-
}
|
|
38
|
-
return window.addEventListener("resize", o), () => window.removeEventListener("resize", o);
|
|
39
|
-
}, [s, i, n]), /* @__PURE__ */ z(
|
|
40
|
-
S,
|
|
27
|
+
const m = E(null), [w] = _(m, "keyboard"), d = !!l && !!g, b = p(u(o), d), v = p(u(e), d);
|
|
28
|
+
return /* @__PURE__ */ y(
|
|
29
|
+
A,
|
|
41
30
|
{
|
|
42
|
-
slot:
|
|
43
|
-
compact:
|
|
44
|
-
className:
|
|
45
|
-
dataTestId:
|
|
31
|
+
slot: a,
|
|
32
|
+
compact: h,
|
|
33
|
+
className: c(r.component, { [r.focused]: w }, t),
|
|
34
|
+
dataTestId: N("cell-action", i, !0),
|
|
46
35
|
tabIndex: 0,
|
|
47
|
-
size:
|
|
48
|
-
ref:
|
|
36
|
+
size: s,
|
|
37
|
+
ref: m,
|
|
49
38
|
children: [
|
|
50
|
-
|
|
39
|
+
o && /* @__PURE__ */ n(
|
|
51
40
|
"div",
|
|
52
41
|
{
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
[r.single_line]: s
|
|
42
|
+
className: c(r.title_wrap, {
|
|
43
|
+
[r.single_line]: l
|
|
56
44
|
}),
|
|
57
|
-
|
|
58
|
-
children: /* @__PURE__ */
|
|
59
|
-
|
|
45
|
+
onMouseEnter: b,
|
|
46
|
+
children: /* @__PURE__ */ n(
|
|
47
|
+
f.Text,
|
|
60
48
|
{
|
|
61
49
|
view: "title",
|
|
62
50
|
color: "primary",
|
|
63
51
|
weight: "medium",
|
|
64
52
|
tag: "div",
|
|
65
53
|
className: r.title,
|
|
66
|
-
children:
|
|
54
|
+
children: o
|
|
67
55
|
}
|
|
68
56
|
)
|
|
69
57
|
}
|
|
70
58
|
),
|
|
71
|
-
|
|
72
|
-
|
|
59
|
+
e && /* @__PURE__ */ n(
|
|
60
|
+
"div",
|
|
73
61
|
{
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
62
|
+
className: c(r.subtitle_wrap, {
|
|
63
|
+
[r.subtitle_single_line]: l
|
|
64
|
+
}),
|
|
65
|
+
onMouseEnter: v,
|
|
66
|
+
children: /* @__PURE__ */ n(
|
|
67
|
+
f.Text,
|
|
68
|
+
{
|
|
69
|
+
weight: "medium",
|
|
70
|
+
view: "caps",
|
|
71
|
+
tag: "div",
|
|
72
|
+
className: r.subtitle,
|
|
73
|
+
color: "secondary",
|
|
74
|
+
children: e
|
|
75
|
+
}
|
|
76
|
+
)
|
|
80
77
|
}
|
|
81
78
|
)
|
|
82
79
|
]
|
|
@@ -84,5 +81,5 @@ const P = ({
|
|
|
84
81
|
);
|
|
85
82
|
};
|
|
86
83
|
export {
|
|
87
|
-
|
|
84
|
+
R as Base
|
|
88
85
|
};
|
package/dist/cell/base/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.component_BNjZ{outline:none}.component_BNjZ .superEllipse_FONr{--super-ellipse-success-icon-color: var(--color-graphic-thirdly)}.component_BNjZ .iconMixColors_Zfj6{color:var(--color-graphic-primary)}.iconMixColors_Zfj6,.superEllipse_FONr{--super-ellipse-transition: fill .15s ease-in-out;--super-ellipse-icon-transition: color .15s ease-in-out;transition:transform .15s ease-in-out}.title_wrap_10zd{display:flex;align-items:center}.title_wrap_10zd+.subtitle_OOoZ{margin-top:var(--gap-2xs)}.title_wrap_10zd{min-width:0}.title_VeYl{display:flex;align-items:center}.single_line_4wfi .title_VeYl{display:block;min-width:0;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.focused_ootM{outline:2px solid var(--focus-color);outline-offset:2px}
|
|
1
|
+
.component_BNjZ{outline:none}.component_BNjZ .superEllipse_FONr{--super-ellipse-success-icon-color: var(--color-graphic-thirdly)}.component_BNjZ .iconMixColors_Zfj6{color:var(--color-graphic-primary)}.iconMixColors_Zfj6,.superEllipse_FONr{--super-ellipse-transition: fill .15s ease-in-out;--super-ellipse-icon-transition: color .15s ease-in-out;transition:transform .15s ease-in-out}.title_wrap_10zd{display:flex;align-items:center}.title_wrap_10zd+.subtitle_OOoZ{margin-top:var(--gap-2xs)}.title_wrap_10zd{min-width:0}.title_VeYl{display:flex;align-items:center}.single_line_4wfi .title_VeYl{display:block;min-width:0;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.subtitle_wrap_xH8m{display:block;min-width:0}.subtitle_single_line_6DGn .subtitle_OOoZ{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.focused_ootM{outline:2px solid var(--focus-color);outline-offset:2px}
|
|
@@ -1,19 +1,23 @@
|
|
|
1
1
|
import * as __css from './index.css';
|
|
2
2
|
export const __cssModule = __css;
|
|
3
|
-
const t = "component_BNjZ", e = "title_wrap_10zd",
|
|
3
|
+
const t = "component_BNjZ", e = "title_wrap_10zd", l = "subtitle_OOoZ", s = "title_VeYl", i = "single_line_4wfi", n = "subtitle_wrap_xH8m", _ = "subtitle_single_line_6DGn", o = "focused_ootM", c = {
|
|
4
4
|
component: t,
|
|
5
5
|
title_wrap: e,
|
|
6
|
-
subtitle:
|
|
7
|
-
title:
|
|
8
|
-
single_line:
|
|
9
|
-
|
|
6
|
+
subtitle: l,
|
|
7
|
+
title: s,
|
|
8
|
+
single_line: i,
|
|
9
|
+
subtitle_wrap: n,
|
|
10
|
+
subtitle_single_line: _,
|
|
11
|
+
focused: o
|
|
10
12
|
};
|
|
11
13
|
export {
|
|
12
14
|
t as component,
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
15
|
+
c as default,
|
|
16
|
+
o as focused,
|
|
17
|
+
i as single_line,
|
|
18
|
+
l as subtitle,
|
|
19
|
+
_ as subtitle_single_line,
|
|
20
|
+
n as subtitle_wrap,
|
|
21
|
+
s as title,
|
|
18
22
|
e as title_wrap
|
|
19
23
|
};
|
|
@@ -1,59 +1,59 @@
|
|
|
1
|
-
import { jsx as
|
|
1
|
+
import { jsx as i } from "react/jsx-runtime";
|
|
2
2
|
import s from "classnames";
|
|
3
|
-
import { Cell as
|
|
3
|
+
import { Cell as p } from "../../../cell/component.js";
|
|
4
4
|
import e from "./index.module.css.js";
|
|
5
|
-
const
|
|
6
|
-
dataTestID:
|
|
7
|
-
className:
|
|
5
|
+
const u = ({
|
|
6
|
+
dataTestID: d,
|
|
7
|
+
className: a,
|
|
8
8
|
children: l,
|
|
9
9
|
title: o,
|
|
10
|
-
subtitle:
|
|
10
|
+
subtitle: n,
|
|
11
11
|
tableProps: h,
|
|
12
|
-
cellProps:
|
|
12
|
+
cellProps: c,
|
|
13
13
|
addon: f,
|
|
14
|
-
align:
|
|
15
|
-
compact:
|
|
14
|
+
align: t,
|
|
15
|
+
compact: r,
|
|
16
16
|
width: v,
|
|
17
17
|
tag: m = "td"
|
|
18
|
-
}) => /* @__PURE__ */
|
|
18
|
+
}) => /* @__PURE__ */ i(
|
|
19
19
|
m,
|
|
20
20
|
{
|
|
21
|
-
"data-test-id":
|
|
22
|
-
className: s(e.cell,
|
|
21
|
+
"data-test-id": d,
|
|
22
|
+
className: s(e.cell, a, {
|
|
23
23
|
[e.is_div]: m === "div",
|
|
24
|
-
[e.compact_cell]:
|
|
24
|
+
[e.compact_cell]: r
|
|
25
25
|
}),
|
|
26
26
|
style: { width: v },
|
|
27
27
|
...h,
|
|
28
|
-
children: l ? /* @__PURE__ */
|
|
28
|
+
children: l ? /* @__PURE__ */ i(
|
|
29
29
|
"div",
|
|
30
30
|
{
|
|
31
31
|
className: s(e.children, {
|
|
32
|
-
[e.center]:
|
|
33
|
-
[e.right]:
|
|
32
|
+
[e.center]: t === "center",
|
|
33
|
+
[e.right]: t === "right"
|
|
34
34
|
}),
|
|
35
35
|
children: l
|
|
36
36
|
}
|
|
37
|
-
) : /* @__PURE__ */
|
|
38
|
-
|
|
37
|
+
) : /* @__PURE__ */ i(
|
|
38
|
+
p.Base,
|
|
39
39
|
{
|
|
40
40
|
title: o === void 0 ? "-" : o,
|
|
41
|
-
subtitle:
|
|
42
|
-
size:
|
|
43
|
-
compactAddon:
|
|
44
|
-
singleLineTitle:
|
|
45
|
-
showTitleTooltipOnOverflow:
|
|
41
|
+
subtitle: n,
|
|
42
|
+
size: c?.size || (r ? "s" : "m"),
|
|
43
|
+
compactAddon: r,
|
|
44
|
+
singleLineTitle: !0,
|
|
45
|
+
showTitleTooltipOnOverflow: !0,
|
|
46
46
|
className: s({
|
|
47
|
-
[e.center]:
|
|
48
|
-
[e.right]:
|
|
49
|
-
[e.compact_content]:
|
|
47
|
+
[e.center]: t === "center",
|
|
48
|
+
[e.right]: t === "right",
|
|
49
|
+
[e.compact_content]: r
|
|
50
50
|
}),
|
|
51
51
|
addon: f,
|
|
52
|
-
...
|
|
52
|
+
...c
|
|
53
53
|
}
|
|
54
54
|
)
|
|
55
55
|
}
|
|
56
56
|
);
|
|
57
57
|
export {
|
|
58
|
-
|
|
58
|
+
u as TableCell
|
|
59
59
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
table tr:last-child .cell_SVZP{border-bottom:0!important}.cell_SVZP{padding:8px 16px;border-bottom:1px solid var(--color-border-secondary);position:relative;min-height:56px;box-sizing:border-box;vertical-align:middle}.compact_cell_zSJH{min-height:44px;padding:8px 12px}.right_30pJ{justify-content:flex-end}.children_X057{width:100%;display:flex;align-items:center}.compact_content_bjnq{gap:0 6px!important;min-height:40px!important}.is_div_XHlH{display:flex;align-items:center}.cell_SVZP.is_div_XHlH{padding-top:12px;padding-bottom:12px}.compact_cell_zSJH.is_div_XHlH{min-height:44px}
|
|
1
|
+
table tr:last-child .cell_SVZP{border-bottom:0!important}.cell_SVZP{padding:8px 16px;border-bottom:1px solid var(--color-border-secondary);position:relative;min-height:56px;box-sizing:border-box;vertical-align:middle;overflow:hidden}.compact_cell_zSJH{min-height:44px;padding:8px 12px}.right_30pJ{justify-content:flex-end}.children_X057{width:100%;display:flex;align-items:center}.compact_content_bjnq{gap:0 6px!important;min-height:40px!important}.is_div_XHlH{display:flex;align-items:center}.cell_SVZP.is_div_XHlH{padding-top:12px;padding-bottom:12px}.compact_cell_zSJH.is_div_XHlH{min-height:44px}
|