asma-ui-core 3.103.0 → 3.103.1
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.
- package/dist/asma-ui-core.css +1 -1
- package/dist/components/data-display/badge/StyledBadge.js +30 -34
- package/dist/components/data-display/virtualized-list/VirtualizedList.js +16 -15
- package/dist/components/feedback/dialog/StyledDialog.js +71 -62
- package/dist/components/feedback/dialog/StyledDialogTitle.js +25 -14
- package/dist/components/feedback/dialog/dialogTitleContext.js +5 -0
- package/dist/components/miscellaneous/StyledFormControlLabel.js +14 -14
- package/dist/components/navigation/link/StyledLink.js +25 -18
- package/dist/components/navigation/link/StyledLink.module.js +6 -5
- package/dist/src/components/feedback/dialog/StyledDialog.d.ts +2 -0
- package/dist/src/components/feedback/dialog/StyledDialogTitle.d.ts +4 -1
- package/dist/src/components/feedback/dialog/dialogTitleContext.d.ts +15 -0
- package/dist/src/components/navigation/link/StyledLink.d.ts +3 -2
- package/dist/src/table/components/columns/dndHandleColumn.d.ts +2 -1
- package/dist/src/table/components/columns/expandColumn.d.ts +1 -1
- package/dist/src/table/components/columns/showTextColumn.d.ts +1 -1
- package/dist/table/components/columns/dndHandleColumn.js +20 -18
- package/dist/table/components/columns/expandColumn.js +15 -15
- package/dist/table/components/columns/showTextColumn.js +20 -19
- package/dist/table/helpers/injectColumns.js +8 -8
- package/package.json +1 -1
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { resolveSx as
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import { jsx as
|
|
5
|
-
var
|
|
1
|
+
import { resolveSx as u } from "../../../helpers/sx.js";
|
|
2
|
+
import b from "clsx";
|
|
3
|
+
import "react";
|
|
4
|
+
import { jsx as x, jsxs as I } from "react/jsx-runtime";
|
|
5
|
+
var v = {
|
|
6
6
|
primary: {
|
|
7
7
|
backgroundColor: "var(--colors-badge-background)",
|
|
8
8
|
color: "var(--colors-badge-label)"
|
|
@@ -31,55 +31,51 @@ var w = {
|
|
|
31
31
|
backgroundColor: "var(--colors-warning-700)",
|
|
32
32
|
color: "#fff"
|
|
33
33
|
}
|
|
34
|
-
},
|
|
34
|
+
}, L = {
|
|
35
35
|
"top-right": "top-0 right-0 translate-x-1/2 -translate-y-1/2 origin-[100%_0%]",
|
|
36
36
|
"top-left": "top-0 left-0 -translate-x-1/2 -translate-y-1/2 origin-[0%_0%]",
|
|
37
37
|
"bottom-right": "bottom-0 right-0 translate-x-1/2 translate-y-1/2 origin-[100%_100%]",
|
|
38
38
|
"bottom-left": "bottom-0 left-0 -translate-x-1/2 translate-y-1/2 origin-[0%_100%]"
|
|
39
|
-
},
|
|
40
|
-
const
|
|
41
|
-
Z(() => {
|
|
42
|
-
l !== b.current && (b.current = l, n.current && (n.current.textContent = d ?? ""));
|
|
43
|
-
}, [l, d]);
|
|
44
|
-
const x = e && typeof e == "object" && !Array.isArray(e) ? e : {}, R = g(x[S]), B = g(Object.fromEntries(Object.entries(x).filter(([T]) => T !== S))), r = j === "dot", s = r && A !== "notification", t = p === void 0, v = !!C || !r && (o === 0 || o === void 0 || o === null), D = r ? null : typeof o == "number" && o > 99 ? "99+" : o, E = typeof o == "number" && o > 0 && o < 10, N = f?.vertical ?? "top", $ = f?.horizontal ?? "right", z = i === "primary" && !s ? {
|
|
39
|
+
}, g = "& .MuiBadge-badge", K = ({ color: i = "primary", dataTest: y, size: n = "medium", badgeContent: o, max: T, showZero: Z, variant: h = "standard", purpose: _ = "notification", statusMessage: w, invisible: S, anchorOrigin: c, children: d, className: p, sx: a, overlap: G, classes: H, slots: M, slotProps: m, component: W, tabIndex: X, "aria-label": e, ...k }) => {
|
|
40
|
+
const j = typeof o == "number" ? o : void 0, f = a && typeof a == "object" && !Array.isArray(a) ? a : {}, A = u(f[g]), O = u(Object.fromEntries(Object.entries(f).filter(([z]) => z !== g))), r = h === "dot", l = r && _ !== "notification", t = d === void 0, s = !!S || !r && (o === 0 || o === void 0 || o === null), B = r ? null : typeof o == "number" && o > 99 ? "99+" : o, C = typeof o == "number" && o > 0 && o < 10, D = c?.vertical ?? "top", N = c?.horizontal ?? "right", E = i === "primary" && !l ? {
|
|
45
41
|
borderColor: r ? "var(--colors-badge-border-dot)" : "var(--colors-badge-border-count)",
|
|
46
42
|
borderStyle: "solid",
|
|
47
43
|
borderWidth: r ? "var(--border-badge-dot)" : "var(--border-badge-count)"
|
|
48
|
-
} : {},
|
|
44
|
+
} : {}, R = t && !s && e ? {
|
|
49
45
|
role: "img",
|
|
50
|
-
"aria-label":
|
|
51
|
-
} : {},
|
|
52
|
-
return /* @__PURE__ */
|
|
53
|
-
className: t ?
|
|
54
|
-
"data-testid":
|
|
55
|
-
style:
|
|
56
|
-
|
|
57
|
-
...
|
|
58
|
-
...
|
|
46
|
+
"aria-label": e
|
|
47
|
+
} : {}, $ = !t && e ? { "aria-label": e } : {};
|
|
48
|
+
return /* @__PURE__ */ I("span", {
|
|
49
|
+
className: t ? b("inline-flex shrink-0 align-middle", p) : "relative inline-flex shrink-0 align-middle",
|
|
50
|
+
"data-testid": y,
|
|
51
|
+
style: O,
|
|
52
|
+
...$,
|
|
53
|
+
...R,
|
|
54
|
+
...k,
|
|
59
55
|
children: [
|
|
60
|
-
|
|
61
|
-
!
|
|
56
|
+
d,
|
|
57
|
+
!s && /* @__PURE__ */ x("span", {
|
|
62
58
|
"aria-hidden": "true",
|
|
63
|
-
className:
|
|
59
|
+
className: b("box-border flex items-center justify-center whitespace-nowrap font-roboto font-semibold", !t && "absolute z-[1]", !t && L[`${D}-${N}`], l ? "h-[8px] w-[8px] min-w-[8px] rounded-full p-0" : r ? "h-[12px] w-[12px] min-w-[12px] rounded-full p-0" : n === "small" ? "h-[16px] w-max min-w-[16px] rounded-[20px] px-[4px] text-[0.75rem]" : "h-[20px] min-w-[20px] rounded-[20px] px-[6px] text-sm leading-5", !r && n === "medium" && C && "w-[20px]", !t && p, m?.badge?.className),
|
|
64
60
|
style: {
|
|
65
|
-
...
|
|
66
|
-
...
|
|
67
|
-
...
|
|
68
|
-
...
|
|
61
|
+
...v[i] ?? v.default,
|
|
62
|
+
...l ? { backgroundColor: "var(--colors-gama-500)" } : {},
|
|
63
|
+
...E,
|
|
64
|
+
...A,
|
|
69
65
|
...m?.badge?.style
|
|
70
66
|
},
|
|
71
|
-
children:
|
|
67
|
+
children: B
|
|
72
68
|
}),
|
|
73
|
-
/* @__PURE__ */
|
|
74
|
-
ref: n,
|
|
69
|
+
/* @__PURE__ */ x("span", {
|
|
75
70
|
"aria-atomic": "true",
|
|
76
71
|
"aria-live": "polite",
|
|
77
72
|
className: "sr-only",
|
|
78
|
-
role: "status"
|
|
73
|
+
role: "status",
|
|
74
|
+
children: s || j === void 0 ? "" : w ?? ""
|
|
79
75
|
})
|
|
80
76
|
]
|
|
81
77
|
});
|
|
82
78
|
};
|
|
83
79
|
export {
|
|
84
|
-
|
|
80
|
+
K as StyledBadge
|
|
85
81
|
};
|
|
@@ -1,29 +1,30 @@
|
|
|
1
1
|
import { useRef as m } from "react";
|
|
2
|
-
import { Fragment as
|
|
3
|
-
import { useVirtualizer as
|
|
4
|
-
function v({ className:
|
|
5
|
-
const
|
|
2
|
+
import { Fragment as x, jsx as t } from "react/jsx-runtime";
|
|
3
|
+
import { useVirtualizer as g } from "@tanstack/react-virtual";
|
|
4
|
+
function v({ className: s, dataTest: o, emptyState: i, estimatedItemHeight: d = 48, getItemKey: u, items: r, overscan: c = 8, renderItem: f }) {
|
|
5
|
+
const a = m(null), n = g({
|
|
6
6
|
count: r.length,
|
|
7
7
|
estimateSize: () => d,
|
|
8
|
-
getScrollElement: () =>
|
|
8
|
+
getScrollElement: () => a.current,
|
|
9
9
|
overscan: c
|
|
10
10
|
});
|
|
11
|
-
return r.length === 0 ? i === void 0 ? null : /* @__PURE__ */ t(
|
|
12
|
-
className:
|
|
11
|
+
return r.length === 0 ? i === void 0 ? null : /* @__PURE__ */ t(x, { children: i }) : /* @__PURE__ */ t("div", {
|
|
12
|
+
className: s,
|
|
13
13
|
"data-testid": o,
|
|
14
|
-
ref:
|
|
14
|
+
ref: a,
|
|
15
|
+
tabIndex: 0,
|
|
15
16
|
children: /* @__PURE__ */ t("div", {
|
|
16
17
|
className: "relative w-full",
|
|
17
|
-
style: { height:
|
|
18
|
-
children:
|
|
19
|
-
const
|
|
20
|
-
return
|
|
18
|
+
style: { height: n.getTotalSize() },
|
|
19
|
+
children: n.getVirtualItems().map((e) => {
|
|
20
|
+
const l = r[e.index];
|
|
21
|
+
return l === void 0 ? null : /* @__PURE__ */ t("div", {
|
|
21
22
|
className: "absolute left-0 top-0 w-full",
|
|
22
23
|
"data-index": e.index,
|
|
23
|
-
ref:
|
|
24
|
+
ref: n.measureElement,
|
|
24
25
|
style: { transform: `translateY(${e.start}px)` },
|
|
25
|
-
children: f(
|
|
26
|
-
}, u(
|
|
26
|
+
children: f(l, e.index)
|
|
27
|
+
}, u(l, e.index));
|
|
27
28
|
})
|
|
28
29
|
})
|
|
29
30
|
});
|
|
@@ -1,117 +1,123 @@
|
|
|
1
1
|
import { cn as h } from "../../../helpers/cn.js";
|
|
2
|
-
import { resolveSx as
|
|
3
|
-
import { CloseIcon as
|
|
4
|
-
import { registerOpenModalDialog as
|
|
5
|
-
import { StyledButton as
|
|
6
|
-
import { useMobileMediaQuery as
|
|
7
|
-
import
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
10
|
-
|
|
2
|
+
import { resolveSx as D } from "../../../helpers/sx.js";
|
|
3
|
+
import { CloseIcon as J } from "../../icons/close-icon/CloseIcon.js";
|
|
4
|
+
import { registerOpenModalDialog as U } from "../../../hooks/useTopLayer.hook.js";
|
|
5
|
+
import { StyledButton as V } from "../../inputs/button/StyledButton.js";
|
|
6
|
+
import { useMobileMediaQuery as Y } from "../../../hooks/useMediaQuery.hook.js";
|
|
7
|
+
import Z from "./StyledDialog.module.js";
|
|
8
|
+
import { StyledDialogTitleContext as ee } from "./dialogTitleContext.js";
|
|
9
|
+
import { useEffect as w, useId as te, useLayoutEffect as le, useMemo as ne, useRef as s, useState as re } from "react";
|
|
10
|
+
import { jsx as n, jsxs as r } from "react/jsx-runtime";
|
|
11
|
+
var oe = {
|
|
11
12
|
xs: 444,
|
|
12
13
|
sm: 600,
|
|
13
14
|
md: 900,
|
|
14
15
|
lg: 1200,
|
|
15
16
|
xl: 1536
|
|
16
|
-
},
|
|
17
|
-
const
|
|
17
|
+
}, he = ({ open: t, onClose: c, children: I, dataTest: y, maxWidth: v = "sm", fullWidth: H, fullScreen: M, scroll: _ = "paper", disableEscapeKeyDown: j, className: O, style: R, sx: W, classes: b, PaperProps: z, slotProps: o, onCloseText: g, showCloseIcon: k = !0, dialogLabel: m, dialogTitle: i, ariaLabel: L, dialogHeaderNode: P }) => {
|
|
18
|
+
const d = te(), [q, A] = re(), B = ne(() => ({
|
|
19
|
+
titleId: d,
|
|
20
|
+
setTitleId: A
|
|
21
|
+
}), [d]), E = i ? d : q, F = Y(), u = s(null), f = s(null), x = s(!1), C = s(t), a = M ?? F;
|
|
18
22
|
w(() => {
|
|
19
|
-
|
|
20
|
-
}, [t, o]),
|
|
23
|
+
C.current && !t && o?.transition?.onExited?.(), C.current = t;
|
|
24
|
+
}, [t, o]), le(() => {
|
|
21
25
|
const e = u.current;
|
|
22
26
|
if (!e || !t) return;
|
|
23
27
|
e.open || (f.current = document.activeElement instanceof HTMLElement ? document.activeElement : null, e.showModal(), e.focus({ preventScroll: !0 }), requestAnimationFrame(() => e.open && e.focus({ preventScroll: !0 })));
|
|
24
|
-
const
|
|
28
|
+
const l = U(e);
|
|
25
29
|
return () => {
|
|
26
|
-
|
|
30
|
+
l(), f.current?.isConnected && f.current.focus({ preventScroll: !0 });
|
|
27
31
|
};
|
|
28
32
|
}, [t]), w(() => {
|
|
29
33
|
if (!t) return;
|
|
30
|
-
const e = document.body.style.overflow,
|
|
34
|
+
const e = document.body.style.overflow, l = document.documentElement.style.overflow;
|
|
31
35
|
return document.body.style.overflow = "hidden", document.documentElement.style.overflow = "hidden", () => {
|
|
32
|
-
document.body.style.overflow = e, document.documentElement.style.overflow =
|
|
36
|
+
document.body.style.overflow = e, document.documentElement.style.overflow = l;
|
|
33
37
|
};
|
|
34
38
|
}, [t]);
|
|
35
|
-
const
|
|
36
|
-
...
|
|
39
|
+
const p = {
|
|
40
|
+
...z,
|
|
37
41
|
...o?.paper
|
|
38
|
-
},
|
|
39
|
-
|
|
40
|
-
|
|
42
|
+
}, N = v === !1 ? void 0 : oe[v], { className: K, style: T, onClick: X, ...G } = o?.backdrop ?? {}, Q = (e) => {
|
|
43
|
+
x.current || (x.current = !0, window.setTimeout(() => {
|
|
44
|
+
x.current = !1;
|
|
41
45
|
}, 0), c?.(e, "escapeKeyDown"));
|
|
42
|
-
},
|
|
46
|
+
}, $ = (e) => {
|
|
43
47
|
e.preventDefault();
|
|
44
48
|
};
|
|
45
49
|
return w(() => {
|
|
46
|
-
if (!t ||
|
|
47
|
-
const e = (
|
|
48
|
-
if (
|
|
49
|
-
const
|
|
50
|
-
|
|
50
|
+
if (!t || j) return;
|
|
51
|
+
const e = (l) => {
|
|
52
|
+
if (l.key !== "Escape" || l.defaultPrevented) return;
|
|
53
|
+
const S = document.activeElement;
|
|
54
|
+
S instanceof Element && S.closest("dialog[open]") !== u.current || Q(l);
|
|
51
55
|
};
|
|
52
56
|
return window.addEventListener("keydown", e), () => window.removeEventListener("keydown", e);
|
|
53
|
-
}), t ? /* @__PURE__ */
|
|
57
|
+
}), t ? /* @__PURE__ */ r("dialog", {
|
|
54
58
|
ref: u,
|
|
55
59
|
tabIndex: -1,
|
|
56
|
-
"data-testid":
|
|
57
|
-
"aria-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
+
"data-testid": y,
|
|
61
|
+
"aria-labelledby": E,
|
|
62
|
+
"aria-label": E ? void 0 : L,
|
|
63
|
+
onCancel: $,
|
|
64
|
+
className: h(Z.StyledDialog, "fixed inset-0 m-0 h-full max-h-none w-full max-w-none items-center justify-center overflow-hidden border-0 bg-transparent p-0 outline-none open:flex", _ === "body" && "overflow-y-auto", O, b?.root),
|
|
60
65
|
style: {
|
|
61
66
|
zIndex: 999,
|
|
62
|
-
...
|
|
63
|
-
...
|
|
67
|
+
...D(W),
|
|
68
|
+
...R
|
|
64
69
|
},
|
|
65
|
-
children: [/* @__PURE__ */
|
|
66
|
-
...
|
|
67
|
-
className: h("absolute inset-0 bg-[#626e7eb2]",
|
|
68
|
-
style:
|
|
70
|
+
children: [/* @__PURE__ */ n("div", {
|
|
71
|
+
...G,
|
|
72
|
+
className: h("absolute inset-0 bg-[#626e7eb2]", K),
|
|
73
|
+
style: T,
|
|
69
74
|
onClick: (e) => {
|
|
70
|
-
|
|
75
|
+
X?.(e), e.defaultPrevented || c?.(e, "backdropClick");
|
|
71
76
|
}
|
|
72
|
-
}), /* @__PURE__ */
|
|
73
|
-
className: h("relative z-[1] flex flex-col overflow-hidden rounded-lg border-0 bg-white p-0 text-delta-800 shadow-[0px_4px_40px_0px_#22213366]",
|
|
77
|
+
}), /* @__PURE__ */ r("div", {
|
|
78
|
+
className: h("relative z-[1] flex flex-col overflow-hidden rounded-lg border-0 bg-white p-0 text-delta-800 shadow-[0px_4px_40px_0px_#22213366]", a && "rounded-none", p.className, b?.paper),
|
|
74
79
|
style: {
|
|
75
80
|
minWidth: 0,
|
|
76
81
|
minHeight: 0,
|
|
77
|
-
...!
|
|
78
|
-
...
|
|
82
|
+
...!a && N ? { maxWidth: N } : {},
|
|
83
|
+
...a ? {
|
|
79
84
|
width: "100%",
|
|
80
85
|
maxWidth: "100%",
|
|
81
86
|
height: "100%",
|
|
82
87
|
maxHeight: "100%"
|
|
83
88
|
} : {
|
|
84
|
-
width:
|
|
89
|
+
width: H ? "calc(100% - 64px)" : "auto",
|
|
85
90
|
maxHeight: "100%"
|
|
86
91
|
},
|
|
87
|
-
...
|
|
88
|
-
...
|
|
89
|
-
...
|
|
92
|
+
...D(p.sx),
|
|
93
|
+
...p.style,
|
|
94
|
+
...a ? {
|
|
90
95
|
width: "100%",
|
|
91
96
|
maxWidth: "100%",
|
|
92
97
|
height: "100%",
|
|
93
98
|
maxHeight: "100%"
|
|
94
99
|
} : { maxHeight: "calc(100% - 64px)" }
|
|
95
100
|
},
|
|
96
|
-
children: [(!!
|
|
101
|
+
children: [(!!m || !!i || k) && /* @__PURE__ */ r("div", {
|
|
97
102
|
className: "box-border flex w-full min-w-0 max-w-full justify-between px-4 pt-4",
|
|
98
|
-
children: [/* @__PURE__ */
|
|
103
|
+
children: [/* @__PURE__ */ r("div", {
|
|
99
104
|
className: "flex min-w-0 flex-1 flex-col justify-start gap-0.5",
|
|
100
|
-
children: [
|
|
105
|
+
children: [m && /* @__PURE__ */ n("div", {
|
|
101
106
|
className: "flex h-8 items-center text-sm font-normal leading-5 text-delta-600",
|
|
102
|
-
children: s
|
|
103
|
-
}), m && /* @__PURE__ */ r("div", {
|
|
104
|
-
className: "flex text-2xl font-semibold leading-8 text-delta-800",
|
|
105
107
|
children: m
|
|
108
|
+
}), i && /* @__PURE__ */ n("div", {
|
|
109
|
+
id: d,
|
|
110
|
+
className: "flex text-2xl font-semibold leading-8 text-delta-800",
|
|
111
|
+
children: i
|
|
106
112
|
})]
|
|
107
|
-
}),
|
|
113
|
+
}), k && /* @__PURE__ */ r("div", {
|
|
108
114
|
className: "flex min-w-0 max-w-full shrink-0 justify-end gap-2",
|
|
109
|
-
children: [
|
|
110
|
-
dataTest: `close-button-${
|
|
111
|
-
"aria-label":
|
|
115
|
+
children: [P, /* @__PURE__ */ n(V, {
|
|
116
|
+
dataTest: `close-button-${y}`,
|
|
117
|
+
"aria-label": g ? void 0 : "Close",
|
|
112
118
|
variant: "textGray",
|
|
113
119
|
size: "small",
|
|
114
|
-
endIcon: /* @__PURE__ */
|
|
120
|
+
endIcon: /* @__PURE__ */ n(J, {
|
|
115
121
|
width: 20,
|
|
116
122
|
height: 20
|
|
117
123
|
}),
|
|
@@ -122,13 +128,16 @@ var U = {
|
|
|
122
128
|
paddingRight: "6px",
|
|
123
129
|
paddingLeft: "6px"
|
|
124
130
|
},
|
|
125
|
-
children:
|
|
131
|
+
children: g
|
|
126
132
|
})]
|
|
127
133
|
})]
|
|
128
|
-
}),
|
|
134
|
+
}), /* @__PURE__ */ n(ee.Provider, {
|
|
135
|
+
value: B,
|
|
136
|
+
children: I
|
|
137
|
+
})]
|
|
129
138
|
})]
|
|
130
139
|
}) : null;
|
|
131
140
|
};
|
|
132
141
|
export {
|
|
133
|
-
|
|
142
|
+
he as StyledDialog
|
|
134
143
|
};
|
|
@@ -1,20 +1,31 @@
|
|
|
1
|
-
import { resolveSx as
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
1
|
+
import { resolveSx as n } from "../../../helpers/sx.js";
|
|
2
|
+
import { StyledDialogTitleContext as x } from "./dialogTitleContext.js";
|
|
3
|
+
import f from "clsx";
|
|
4
|
+
import { useContext as p, useLayoutEffect as u } from "react";
|
|
5
|
+
import { jsx as c } from "react/jsx-runtime";
|
|
6
|
+
var v = ({ children: e, className: s, sx: i, style: r, id: d, classes: g, ...a }) => {
|
|
7
|
+
const t = p(x), l = !!e, o = d ?? t?.titleId;
|
|
8
|
+
if (u(() => {
|
|
9
|
+
if (!(!l || !t))
|
|
10
|
+
return t.setTitleId(o), () => t.setTitleId(void 0);
|
|
11
|
+
}, [
|
|
12
|
+
l,
|
|
13
|
+
t,
|
|
14
|
+
o
|
|
15
|
+
]), !e) return null;
|
|
16
|
+
const m = {
|
|
17
|
+
...n(i),
|
|
18
|
+
...r
|
|
9
19
|
};
|
|
10
|
-
return /* @__PURE__ */
|
|
20
|
+
return /* @__PURE__ */ c("h2", {
|
|
11
21
|
"data-testid": "styled-dialog-title",
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
22
|
+
id: o,
|
|
23
|
+
className: f("mx-3 p-4 text-[20px] font-semibold leading-[20px]", s),
|
|
24
|
+
style: m,
|
|
25
|
+
...a,
|
|
26
|
+
children: e
|
|
16
27
|
});
|
|
17
28
|
};
|
|
18
29
|
export {
|
|
19
|
-
|
|
30
|
+
v as StyledDialogTitle
|
|
20
31
|
};
|
|
@@ -1,34 +1,34 @@
|
|
|
1
1
|
import { cn as o } from "../../helpers/cn.js";
|
|
2
|
-
import { resolveSx as
|
|
3
|
-
import { cloneElement as
|
|
4
|
-
import { jsx as
|
|
2
|
+
import { resolveSx as g } from "../../helpers/sx.js";
|
|
3
|
+
import { cloneElement as y, isValidElement as s, useId as C } from "react";
|
|
4
|
+
import { jsx as L, jsxs as A } from "react/jsx-runtime";
|
|
5
5
|
var E = {
|
|
6
6
|
end: "flex-row",
|
|
7
7
|
start: "flex-row-reverse",
|
|
8
8
|
top: "flex-col-reverse",
|
|
9
9
|
bottom: "flex-col"
|
|
10
|
-
},
|
|
11
|
-
const e =
|
|
10
|
+
}, w = ({ control: l, label: a, checked: i, disabled: d, name: m, value: c, labelPlacement: f = "end", className: x, sx: p, onChange: b }) => {
|
|
11
|
+
const e = s(l) ? l.props : {}, t = d ?? e.disabled ?? !1, n = C(), u = e["aria-label"] != null || e["aria-labelledby"] != null, h = typeof a == "string" ? a.trim().length > 0 : a != null, r = s(l) && h && !u, v = s(l) ? y(l, {
|
|
12
12
|
checked: e.checked ?? i,
|
|
13
|
-
onChange: e.onChange ??
|
|
14
|
-
disabled:
|
|
13
|
+
onChange: e.onChange ?? b,
|
|
14
|
+
disabled: t,
|
|
15
15
|
name: e.name ?? m,
|
|
16
16
|
value: e.value ?? c,
|
|
17
|
-
...
|
|
17
|
+
...r ? { "aria-labelledby": n } : {}
|
|
18
18
|
}) : l;
|
|
19
19
|
return /* @__PURE__ */ A("label", {
|
|
20
|
-
className: o("m-0 inline-flex items-center gap-2 align-middle text-delta-800",
|
|
20
|
+
className: o("m-0 inline-flex items-center gap-2 align-middle text-delta-800", t ? "cursor-default" : "cursor-pointer", E[f], x),
|
|
21
21
|
style: {
|
|
22
22
|
fontFamily: "Roboto, Helvetica, Arial, sans-serif",
|
|
23
|
-
...
|
|
23
|
+
...g(p)
|
|
24
24
|
},
|
|
25
|
-
children: [v, a != null && /* @__PURE__ */
|
|
26
|
-
id:
|
|
27
|
-
className: o("text-sm leading-5 tracking-[0.00938em]",
|
|
25
|
+
children: [v, a != null && /* @__PURE__ */ L("span", {
|
|
26
|
+
id: r ? n : void 0,
|
|
27
|
+
className: o("text-sm leading-5 tracking-[0.00938em]", t && "text-delta-300"),
|
|
28
28
|
children: a
|
|
29
29
|
})]
|
|
30
30
|
});
|
|
31
31
|
};
|
|
32
32
|
export {
|
|
33
|
-
|
|
33
|
+
w as StyledFormControlLabel
|
|
34
34
|
};
|
|
@@ -1,33 +1,40 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
1
|
+
import l from "./StyledLink.module.js";
|
|
2
|
+
import s from "clsx";
|
|
3
3
|
import "react";
|
|
4
4
|
import { jsxs as i } from "react/jsx-runtime";
|
|
5
|
-
var
|
|
6
|
-
let
|
|
7
|
-
switch (
|
|
5
|
+
var g = ({ href: d, disabled: n, size: u = "large", dataTest: m, reflink: y, className: t, content: a, contentNode: r, onClick: c, ...k }) => {
|
|
6
|
+
let e = l["styled-link-large"];
|
|
7
|
+
switch (u) {
|
|
8
8
|
case "large":
|
|
9
|
-
|
|
9
|
+
e = l["styled-link-large"];
|
|
10
10
|
break;
|
|
11
11
|
case "small":
|
|
12
|
-
|
|
12
|
+
e = l["styled-link-small"];
|
|
13
13
|
break;
|
|
14
14
|
case "xs":
|
|
15
|
-
|
|
15
|
+
e = l["styled-link-xs"];
|
|
16
16
|
break;
|
|
17
17
|
}
|
|
18
|
-
return
|
|
19
|
-
className:
|
|
20
|
-
children: [
|
|
21
|
-
}) : /* @__PURE__ */ i("a", {
|
|
22
|
-
...
|
|
23
|
-
"data-testid":
|
|
18
|
+
return n ? /* @__PURE__ */ i("span", {
|
|
19
|
+
className: s(l["styled-link"], l["styled-link-disabled"], e, t),
|
|
20
|
+
children: [a, r]
|
|
21
|
+
}) : d ? /* @__PURE__ */ i("a", {
|
|
22
|
+
...k,
|
|
23
|
+
"data-testid": m,
|
|
24
24
|
ref: y,
|
|
25
25
|
href: d,
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
26
|
+
className: s(l["styled-link"], "asma-touch-ready", e, t),
|
|
27
|
+
children: [a, r]
|
|
28
|
+
}) : /* @__PURE__ */ i("button", {
|
|
29
|
+
...k,
|
|
30
|
+
"data-testid": m,
|
|
31
|
+
ref: y,
|
|
32
|
+
type: "button",
|
|
33
|
+
onClick: c,
|
|
34
|
+
className: s(l["styled-link"], l["styled-link-button"], "asma-touch-ready", e, t),
|
|
35
|
+
children: [a, r]
|
|
29
36
|
});
|
|
30
37
|
};
|
|
31
38
|
export {
|
|
32
|
-
|
|
39
|
+
g as StyledLink
|
|
33
40
|
};
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
var l = {
|
|
2
|
-
"styled-link": "_styled-
|
|
3
|
-
"styled-link-disabled": "_styled-link-
|
|
4
|
-
"styled-link-
|
|
5
|
-
"styled-link-
|
|
6
|
-
"styled-link-
|
|
2
|
+
"styled-link": "_styled-link_1au3b_1",
|
|
3
|
+
"styled-link-disabled": "_styled-link-disabled_1au3b_14",
|
|
4
|
+
"styled-link-button": "_styled-link-button_1au3b_30",
|
|
5
|
+
"styled-link-xs": "_styled-link-xs_1au3b_35",
|
|
6
|
+
"styled-link-small": "_styled-link-small_1au3b_40",
|
|
7
|
+
"styled-link-large": "_styled-link-large_1au3b_45"
|
|
7
8
|
};
|
|
8
9
|
export {
|
|
9
10
|
l as default
|
|
@@ -55,6 +55,8 @@ export interface IStyledDialogProps {
|
|
|
55
55
|
dialogLabel?: ReactNode;
|
|
56
56
|
/** @figmaProp header Title (Page title 24 SemiBold, delta-800) */
|
|
57
57
|
dialogTitle?: ReactNode;
|
|
58
|
+
/** Accessible name when the dialog has no visible title. */
|
|
59
|
+
ariaLabel?: string;
|
|
58
60
|
dialogHeaderNode?: ReactNode;
|
|
59
61
|
}
|
|
60
62
|
/**
|
|
@@ -5,6 +5,9 @@ interface DialogTitleProps extends HTMLAttributes<HTMLHeadingElement> {
|
|
|
5
5
|
}
|
|
6
6
|
/**
|
|
7
7
|
* MUI-free dialog title: a semantic `<h2>` with the previous SCSS metrics as Tailwind. TASK-101.
|
|
8
|
+
*
|
|
9
|
+
* Adopts the id its enclosing `StyledDialog` offers, so the dialog is named by this visible title
|
|
10
|
+
* rather than by its test hook (WCAG 4.1.2). An explicit `id` from the caller always wins.
|
|
8
11
|
*/
|
|
9
|
-
export declare const StyledDialogTitle: ({ children, className, sx, style, classes: _classes, ...rest }: DialogTitleProps) => JSX.Element | null;
|
|
12
|
+
export declare const StyledDialogTitle: ({ children, className, sx, style, id, classes: _classes, ...rest }: DialogTitleProps) => JSX.Element | null;
|
|
10
13
|
export {};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Lets a `<StyledDialogTitle>` child name the dialog that contains it.
|
|
3
|
+
*
|
|
4
|
+
* `StyledDialog` can point `aria-labelledby` at its own `dialogTitle` prop directly, but a large
|
|
5
|
+
* share of consumers render the title as a child instead (e.g. advoca's privacy-consent modal).
|
|
6
|
+
* Without this, those dialogs fall back to having no accessible name at all — WCAG 4.1.2 requires
|
|
7
|
+
* the dialog to be named by its visible title, not by a test hook.
|
|
8
|
+
*/
|
|
9
|
+
export interface StyledDialogTitleContextValue {
|
|
10
|
+
/** `id` the title adopts so the dialog can reference it. */
|
|
11
|
+
titleId: string;
|
|
12
|
+
/** Registers the title's actual id, including an explicit caller-supplied id. */
|
|
13
|
+
setTitleId: (titleId: string | undefined) => void;
|
|
14
|
+
}
|
|
15
|
+
export declare const StyledDialogTitleContext: import('react').Context<StyledDialogTitleContextValue | null>;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { default as React, AnchorHTMLAttributes, ReactNode } from 'react';
|
|
1
|
+
import { default as React, AnchorHTMLAttributes, MouseEvent, ReactNode } from 'react';
|
|
2
2
|
/**
|
|
3
3
|
* @figmaNode wXrXt5uKNNzV2DnQCgyYZH#14472-14569 (Design-System · "Link")
|
|
4
4
|
*
|
|
@@ -6,7 +6,8 @@ import { default as React, AnchorHTMLAttributes, ReactNode } from 'react';
|
|
|
6
6
|
* Disabled = delta-300; Focused/Pressed adds a 1px gama-400 rounded indicator (radius 4, px4/py2).
|
|
7
7
|
* State is derived at runtime from `:hover`/`:focus`/`disabled`, not a prop.
|
|
8
8
|
*/
|
|
9
|
-
export type StyledLinkProps = AnchorHTMLAttributes<HTMLAnchorElement> & {
|
|
9
|
+
export type StyledLinkProps = Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'onClick'> & {
|
|
10
|
+
onClick?: (event: MouseEvent<HTMLAnchorElement | HTMLButtonElement>) => void;
|
|
10
11
|
/** @figmaProp State = true→"Disabled" (renders a non-interactive <span>, delta-300) */
|
|
11
12
|
disabled?: boolean;
|
|
12
13
|
/** @figmaProp Size = small→"Base" (14/20) | large→"Medium" (16/24); xs (12/20) = none (no DS size) */
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import { Arguments } from '@dnd-kit/sortable/dist/hooks/useSortable';
|
|
2
2
|
import { FC } from 'react';
|
|
3
3
|
import { ColumnDef } from '../../types';
|
|
4
|
-
export declare function generateDndHandleColumn<TData>(custom_props?: ColumnDef<TData, unknown>, rowHeight?: number): ColumnDef<TData, unknown>;
|
|
4
|
+
export declare function generateDndHandleColumn<TData>(custom_props?: ColumnDef<TData, unknown>, rowHeight?: number, locale?: 'en' | 'no'): ColumnDef<TData, unknown>;
|
|
5
5
|
export declare const RowDragHandleCell: FC<Partial<Omit<Arguments, 'id'>> & {
|
|
6
|
+
ariaLabel?: string;
|
|
6
7
|
rowId: string;
|
|
7
8
|
rowHeight?: number;
|
|
8
9
|
}>;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { ColumnDef } from '../../types';
|
|
2
|
-
export declare function generateExpandColumn<TData>(isFixed: boolean, rowHeight?: number): ColumnDef<TData, unknown>;
|
|
2
|
+
export declare function generateExpandColumn<TData>(isFixed: boolean, rowHeight?: number, locale?: 'en' | 'no'): ColumnDef<TData, unknown>;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { ColumnDef } from '../../types';
|
|
2
|
-
export declare function generateShowFullTextColumn<TData>(isFixed: boolean, rowHeight?: number): ColumnDef<TData, unknown>;
|
|
2
|
+
export declare function generateShowFullTextColumn<TData>(isFixed: boolean, rowHeight?: number, locale?: 'en' | 'no'): ColumnDef<TData, unknown>;
|