@vkzstudio/muza-ui 1.0.32 → 1.0.34
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/components/ButtonArrow/ButtonArrow.d.ts +20 -0
- package/dist/components/ButtonArrow/ButtonArrow.d.ts.map +1 -0
- package/dist/components/ButtonArrow/ButtonArrow.js +63 -0
- package/dist/components/ButtonArrow/ButtonArrow.stories.d.ts +37 -0
- package/dist/components/ButtonArrow/ButtonArrow.stories.d.ts.map +1 -0
- package/dist/components/ButtonArrow/index.d.ts +2 -0
- package/dist/components/ButtonArrow/index.d.ts.map +1 -0
- package/dist/components/DataTable/DataTable.js +1 -1
- package/dist/components/ExpandableTable/ExpandableTable.d.ts +17 -1
- package/dist/components/ExpandableTable/ExpandableTable.d.ts.map +1 -1
- package/dist/components/ExpandableTable/ExpandableTable.js +276 -192
- package/dist/components/ExpandableTable/ExpandableTable.stories.d.ts +3 -1
- package/dist/components/ExpandableTable/ExpandableTable.stories.d.ts.map +1 -1
- package/dist/components/ExpandableTable/Table.d.ts +3 -7
- package/dist/components/ExpandableTable/Table.d.ts.map +1 -1
- package/dist/components/ExpandableTable/Table.js +52 -59
- package/dist/components/FileUpload/FileItem.d.ts +5 -2
- package/dist/components/FileUpload/FileItem.d.ts.map +1 -1
- package/dist/components/FileUpload/FileItem.js +91 -69
- package/dist/components/FileUpload/FileUpload.d.ts +12 -2
- package/dist/components/FileUpload/FileUpload.d.ts.map +1 -1
- package/dist/components/FileUpload/FileUpload.js +94 -91
- package/dist/components/FileUpload/FileUpload.stories.d.ts +1 -0
- package/dist/components/FileUpload/FileUpload.stories.d.ts.map +1 -1
- package/dist/components/Flex/Flex.d.ts +1 -1
- package/dist/components/Flex/Flex.d.ts.map +1 -1
- package/dist/components/Flex/Flex.js +47 -44
- package/dist/components/Input/Input.d.ts +2 -2
- package/dist/components/Input/Input.d.ts.map +1 -1
- package/dist/components/Input/Input.js +47 -46
- package/dist/components/Input/Input.stories.d.ts.map +1 -1
- package/dist/components/MultiSelect/MultiSelect.d.ts +1 -1
- package/dist/components/MultiSelect/MultiSelect.d.ts.map +1 -1
- package/dist/components/MultiSelect/MultiSelect.stories.d.ts.map +1 -1
- package/dist/components/Pagination/Pagination.d.ts +61 -0
- package/dist/components/Pagination/Pagination.d.ts.map +1 -0
- package/dist/components/Pagination/Pagination.js +213 -0
- package/dist/components/Pagination/Pagination.stories.d.ts +12 -0
- package/dist/components/Pagination/Pagination.stories.d.ts.map +1 -0
- package/dist/components/Pagination/index.d.ts +2 -0
- package/dist/components/Pagination/index.d.ts.map +1 -0
- package/dist/components/ReorderableTable/ReorderableTable.js +13 -13
- package/dist/components/Searchbar/Searchbar.d.ts +1 -1
- package/dist/components/Searchbar/Searchbar.d.ts.map +1 -1
- package/dist/components/Searchbar/Searchbar.stories.d.ts.map +1 -1
- package/dist/components/Select/Select.d.ts +1 -1
- package/dist/components/Select/Select.d.ts.map +1 -1
- package/dist/components/Select/Select.stories.d.ts.map +1 -1
- package/dist/components/Select/utils.d.ts +1 -1
- package/dist/components/Select/utils.d.ts.map +1 -1
- package/dist/components/Select/utils.js +5 -4
- package/dist/components/Typography/Typography.d.ts.map +1 -1
- package/dist/components/Typography/Typography.js +1 -2
- package/dist/components/index.d.ts +2 -0
- package/dist/components/index.d.ts.map +1 -1
- package/dist/index.js +223 -218
- package/dist/muza-ui.css +1 -1
- package/dist/styles/animations.css +0 -20
- package/dist/styles/token-colors.css +1 -0
- package/dist/styles/token-sizes.css +30 -6
- package/dist/translations/locales/cs.d.ts.map +1 -1
- package/dist/translations/locales/cs.js +10 -0
- package/dist/translations/locales/en.d.ts.map +1 -1
- package/dist/translations/locales/en.js +10 -0
- package/dist/translations/locales/sk.d.ts.map +1 -1
- package/dist/translations/locales/sk.js +10 -0
- package/dist/translations/types.d.ts +22 -0
- package/dist/translations/types.d.ts.map +1 -1
- package/dist/utils/cn.d.ts.map +1 -1
- package/dist/utils/cn.js +8 -1
- package/package.json +1 -1
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
import { jsxs as m, jsx as
|
|
2
|
-
import { useState as
|
|
3
|
-
import { cva as
|
|
4
|
-
import { useIsMinSm as
|
|
5
|
-
import { Table as
|
|
6
|
-
import { cn as
|
|
7
|
-
import { Typography as
|
|
8
|
-
import { AltArrowDownOutline as
|
|
9
|
-
import { Flex as
|
|
10
|
-
const F =
|
|
1
|
+
import { jsxs as m, jsx as s, Fragment as _ } from "react/jsx-runtime";
|
|
2
|
+
import { useState as L, useRef as O, useEffect as W, useCallback as q, useMemo as M, Fragment as J } from "react";
|
|
3
|
+
import { cva as Q } from "class-variance-authority";
|
|
4
|
+
import { useIsMinSm as U, useIsMinMd as X, useIsMinLg as Y } from "../../hooks/use-is-breakpoint.js";
|
|
5
|
+
import { Table as Z, TableHeader as D, TableRow as $, TableHead as S, TableRowGroup as R, TableCell as j } from "./Table.js";
|
|
6
|
+
import { cn as o } from "../../utils/cn.js";
|
|
7
|
+
import { Typography as g } from "../Typography/Typography.js";
|
|
8
|
+
import { AltArrowDownOutline as w } from "@solar-icons/react-perf";
|
|
9
|
+
import { Flex as z } from "../Flex/Flex.js";
|
|
10
|
+
const F = Q("", {
|
|
11
11
|
variants: {
|
|
12
12
|
responsive: {
|
|
13
13
|
xs: "",
|
|
@@ -22,30 +22,63 @@ const F = z("", {
|
|
|
22
22
|
lg: "lg:hidden"
|
|
23
23
|
}
|
|
24
24
|
}
|
|
25
|
-
}),
|
|
26
|
-
data:
|
|
25
|
+
}), I = (h, a, t, d) => !h || h === "xs" ? !0 : h === "sm" ? a : h === "md" ? t : h === "lg" ? d : !0, oe = ({
|
|
26
|
+
data: h,
|
|
27
27
|
columns: a,
|
|
28
|
-
expandableRowSections:
|
|
28
|
+
expandableRowSections: t,
|
|
29
|
+
classNames: d
|
|
29
30
|
}) => {
|
|
30
|
-
const [
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
31
|
+
const [b, A] = L(/* @__PURE__ */ new Set()), [B, N] = L(/* @__PURE__ */ new Set()), u = O(
|
|
32
|
+
/* @__PURE__ */ new Map()
|
|
33
|
+
);
|
|
34
|
+
W(() => {
|
|
35
|
+
const e = u.current;
|
|
36
|
+
return () => {
|
|
37
|
+
e.forEach((i) => clearTimeout(i)), e.clear();
|
|
38
|
+
};
|
|
39
|
+
}, []);
|
|
40
|
+
const K = q((e) => {
|
|
41
|
+
A((i) => {
|
|
42
|
+
const l = new Set(i);
|
|
43
|
+
if (l.has(e)) {
|
|
44
|
+
l.delete(e), N((c) => {
|
|
45
|
+
const r = new Set(c);
|
|
46
|
+
return r.add(e), r;
|
|
47
|
+
});
|
|
48
|
+
const n = u.current.get(e);
|
|
49
|
+
n && clearTimeout(n), u.current.set(
|
|
50
|
+
e,
|
|
51
|
+
setTimeout(() => {
|
|
52
|
+
N((c) => {
|
|
53
|
+
const r = new Set(c);
|
|
54
|
+
return r.delete(e), r;
|
|
55
|
+
}), u.current.delete(e);
|
|
56
|
+
}, 150)
|
|
57
|
+
);
|
|
58
|
+
} else {
|
|
59
|
+
l.add(e);
|
|
60
|
+
const n = u.current.get(e);
|
|
61
|
+
n && (clearTimeout(n), u.current.delete(e), N((c) => {
|
|
62
|
+
const r = new Set(c);
|
|
63
|
+
return r.delete(e), r;
|
|
64
|
+
}));
|
|
65
|
+
}
|
|
66
|
+
return l;
|
|
34
67
|
});
|
|
35
|
-
},
|
|
68
|
+
}, []), f = M(() => {
|
|
36
69
|
const e = a.filter((i) => i.responsive).map((i) => i.responsive);
|
|
37
70
|
return e.includes("lg") ? "lg" : e.includes("md") ? "md" : e.includes("sm") ? "sm" : e.includes("xs") ? "xs" : null;
|
|
38
|
-
}, [a]),
|
|
71
|
+
}, [a]), y = U(), k = X(), T = Y(), V = M(() => f ? f === "lg" ? T : f === "md" ? k : f === "sm" ? y : !1 : !1, [f, y, k, T]), { firstVisibleIndex: H, lastVisibleIndex: P } = M(() => {
|
|
39
72
|
let e = -1, i = -1;
|
|
40
|
-
return a.forEach((
|
|
41
|
-
|
|
73
|
+
return a.forEach((l, n) => {
|
|
74
|
+
I(l.responsive, y, k, T) && (e === -1 && (e = n), i = n);
|
|
42
75
|
}), { firstVisibleIndex: e, lastVisibleIndex: i };
|
|
43
|
-
}, [a,
|
|
44
|
-
return /* @__PURE__ */ m(
|
|
45
|
-
/* @__PURE__ */
|
|
46
|
-
|
|
76
|
+
}, [a, y, k, T]), C = !t && !!f && !V, x = !!t || C;
|
|
77
|
+
return /* @__PURE__ */ m(Z, { children: [
|
|
78
|
+
/* @__PURE__ */ s(D, { children: /* @__PURE__ */ s($, { className: "[&>th]:border-0 [&>th]:bg-transparent", children: a.map((e, i) => /* @__PURE__ */ s(
|
|
79
|
+
S,
|
|
47
80
|
{
|
|
48
|
-
className:
|
|
81
|
+
className: o(
|
|
49
82
|
e.className,
|
|
50
83
|
F({ responsive: e.responsive })
|
|
51
84
|
),
|
|
@@ -53,184 +86,235 @@ const F = z("", {
|
|
|
53
86
|
},
|
|
54
87
|
i
|
|
55
88
|
)) }) }),
|
|
56
|
-
|
|
57
|
-
var
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
expandablePosition: s && n.has(i) ? "top" : "none",
|
|
84
|
-
className: v(
|
|
85
|
-
r.className,
|
|
86
|
-
F({ responsive: r.responsive })
|
|
87
|
-
),
|
|
88
|
-
children: r.render ? r.render(e[r.dataKey], e) : /* @__PURE__ */ t(
|
|
89
|
-
h,
|
|
89
|
+
h.map((e, i) => {
|
|
90
|
+
var c;
|
|
91
|
+
const l = b.has(i) || C, n = B.has(i);
|
|
92
|
+
return /* @__PURE__ */ m(
|
|
93
|
+
R,
|
|
94
|
+
{
|
|
95
|
+
className: o({
|
|
96
|
+
"group hover:[&_td]:border-stroke-brand-hover": t
|
|
97
|
+
}),
|
|
98
|
+
children: [
|
|
99
|
+
/* @__PURE__ */ m(
|
|
100
|
+
$,
|
|
101
|
+
{
|
|
102
|
+
expandablePosition: t && (b.has(i) || n) || C ? "top" : "none",
|
|
103
|
+
className: o("focus-visible-default", {
|
|
104
|
+
"cursor-pointer": t
|
|
105
|
+
}),
|
|
106
|
+
onClick: t ? () => K(i) : void 0,
|
|
107
|
+
onKeyDown: t ? (r) => {
|
|
108
|
+
(r.key === "Enter" || r.key === " ") && (r.preventDefault(), K(i));
|
|
109
|
+
} : void 0,
|
|
110
|
+
tabIndex: t ? 0 : void 0,
|
|
111
|
+
role: t ? "button" : void 0,
|
|
112
|
+
"aria-expanded": t ? b.has(i) : void 0,
|
|
113
|
+
children: [
|
|
114
|
+
a.map((r, p) => /* @__PURE__ */ s(
|
|
115
|
+
j,
|
|
90
116
|
{
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
117
|
+
isFirst: p === H,
|
|
118
|
+
isLast: p === P && !t,
|
|
119
|
+
expandablePosition: (l || n) && x ? "top" : "none",
|
|
120
|
+
className: o(
|
|
121
|
+
r.className,
|
|
122
|
+
F({ responsive: r.responsive })
|
|
123
|
+
),
|
|
124
|
+
children: r.render ? r.render(e[r.dataKey], e) : /* @__PURE__ */ s(
|
|
125
|
+
g,
|
|
126
|
+
{
|
|
127
|
+
variant: "body",
|
|
128
|
+
size: "base",
|
|
129
|
+
weight: "medium",
|
|
130
|
+
component: "span",
|
|
131
|
+
children: e[r.dataKey]
|
|
132
|
+
}
|
|
133
|
+
)
|
|
134
|
+
},
|
|
135
|
+
p
|
|
136
|
+
)),
|
|
137
|
+
t && /* @__PURE__ */ s(
|
|
138
|
+
j,
|
|
110
139
|
{
|
|
111
|
-
className:
|
|
112
|
-
|
|
113
|
-
|
|
140
|
+
className: "w-[68px]",
|
|
141
|
+
isFirst: !1,
|
|
142
|
+
isLast: !0,
|
|
143
|
+
expandablePosition: b.has(i) || n ? "top" : "none",
|
|
144
|
+
children: /* @__PURE__ */ s(
|
|
145
|
+
w,
|
|
146
|
+
{
|
|
147
|
+
className: o(
|
|
148
|
+
"text-text-brand-def transition-transform duration-300",
|
|
149
|
+
{
|
|
150
|
+
"rotate-180": b.has(i)
|
|
151
|
+
}
|
|
152
|
+
)
|
|
153
|
+
}
|
|
154
|
+
)
|
|
114
155
|
}
|
|
115
156
|
)
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
(n.has(i) || c) && /* @__PURE__ */ t(
|
|
122
|
-
k,
|
|
123
|
-
{
|
|
124
|
-
hideBottomSpacing: s && !n.has(i) || !s && !c,
|
|
125
|
-
expandablePosition: "bottom",
|
|
126
|
-
children: /* @__PURE__ */ t(
|
|
127
|
-
E,
|
|
157
|
+
]
|
|
158
|
+
}
|
|
159
|
+
),
|
|
160
|
+
x && /* @__PURE__ */ s("tr", { "aria-hidden": !l, children: /* @__PURE__ */ s(
|
|
161
|
+
"td",
|
|
128
162
|
{
|
|
129
|
-
colSpan: a.length + 1,
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
B,
|
|
138
|
-
{
|
|
139
|
-
gap: "md",
|
|
140
|
-
direction: "column",
|
|
141
|
-
className: "col-span-full",
|
|
142
|
-
children: a.map((r, l) => /* @__PURE__ */ m(
|
|
143
|
-
B,
|
|
144
|
-
{
|
|
145
|
-
align: "center",
|
|
146
|
-
justify: "between",
|
|
147
|
-
direction: "row",
|
|
148
|
-
className: F({
|
|
149
|
-
reverse: r.responsive
|
|
150
|
-
}),
|
|
151
|
-
children: [
|
|
152
|
-
/* @__PURE__ */ t(h, { variant: "body", component: "span", children: r.title }),
|
|
153
|
-
r.render ? r.render(e[r.dataKey], e) : /* @__PURE__ */ t(
|
|
154
|
-
h,
|
|
155
|
-
{
|
|
156
|
-
variant: "body",
|
|
157
|
-
weight: "medium",
|
|
158
|
-
size: "base",
|
|
159
|
-
component: "span",
|
|
160
|
-
children: e[r.dataKey]
|
|
161
|
-
}
|
|
162
|
-
)
|
|
163
|
-
]
|
|
164
|
-
},
|
|
165
|
-
l
|
|
166
|
-
))
|
|
167
|
-
}
|
|
163
|
+
colSpan: a.length + (t ? 1 : 0),
|
|
164
|
+
className: "border-0 p-0",
|
|
165
|
+
children: /* @__PURE__ */ s(
|
|
166
|
+
"div",
|
|
167
|
+
{
|
|
168
|
+
className: o(
|
|
169
|
+
"grid transition-[grid-template-rows] duration-300 ease-in-out",
|
|
170
|
+
l ? "grid-rows-[1fr]" : "grid-rows-[0fr]"
|
|
168
171
|
),
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
return /* @__PURE__ */ m(M, { children: [
|
|
175
|
-
/* @__PURE__ */ m("div", { className: "col-span-full grid grid-cols-1 gap-y-xl md:col-span-2 md:grid-cols-subgrid", children: [
|
|
176
|
-
r.title && /* @__PURE__ */ t(
|
|
177
|
-
h,
|
|
178
|
-
{
|
|
179
|
-
variant: "body",
|
|
180
|
-
uppercase: !0,
|
|
181
|
-
size: "sm",
|
|
182
|
-
weight: "medium",
|
|
183
|
-
component: "p",
|
|
184
|
-
className: "text-text-brand-def md:col-span-2",
|
|
185
|
-
children: r.title
|
|
186
|
-
}
|
|
172
|
+
children: /* @__PURE__ */ s("div", { className: "min-h-0 overflow-hidden", children: /* @__PURE__ */ m(
|
|
173
|
+
"div",
|
|
174
|
+
{
|
|
175
|
+
className: o(
|
|
176
|
+
"rounded-b-xl border-x-1 border-b-1 border-stroke-base-secondary bg-surface-base-secondary transition-colors group-hover:border-stroke-brand-hover"
|
|
187
177
|
),
|
|
188
|
-
|
|
189
|
-
/* @__PURE__ */ t
|
|
190
|
-
|
|
191
|
-
{
|
|
192
|
-
component: "span",
|
|
193
|
-
variant: "body",
|
|
194
|
-
className: "mb-xs text-text-dark-primary-def md:mb-0",
|
|
195
|
-
children: f.title
|
|
196
|
-
},
|
|
197
|
-
`${y}-label`
|
|
198
|
-
),
|
|
199
|
-
f.render ? /* @__PURE__ */ t(
|
|
178
|
+
children: [
|
|
179
|
+
/* @__PURE__ */ s("div", { className: "mx-comp-table-p border-t-1 border-stroke-base-secondary" }),
|
|
180
|
+
/* @__PURE__ */ m(
|
|
200
181
|
"div",
|
|
201
182
|
{
|
|
202
|
-
className:
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
183
|
+
className: o(
|
|
184
|
+
"grid grid-cols-1 gap-2xl px-comp-table-p py-2xl md:grid-cols-[auto_1fr]",
|
|
185
|
+
d == null ? void 0 : d.expandedContentGrid
|
|
186
|
+
),
|
|
187
|
+
children: [
|
|
188
|
+
!V && /* @__PURE__ */ m(_, { children: [
|
|
189
|
+
/* @__PURE__ */ s(
|
|
190
|
+
z,
|
|
191
|
+
{
|
|
192
|
+
gap: "md",
|
|
193
|
+
direction: "column",
|
|
194
|
+
className: "col-span-full",
|
|
195
|
+
children: a.map((r, p) => /* @__PURE__ */ m(
|
|
196
|
+
z,
|
|
197
|
+
{
|
|
198
|
+
align: "center",
|
|
199
|
+
justify: "between",
|
|
200
|
+
direction: "row",
|
|
201
|
+
className: F({
|
|
202
|
+
reverse: r.responsive
|
|
203
|
+
}),
|
|
204
|
+
children: [
|
|
205
|
+
/* @__PURE__ */ s(g, { variant: "body", component: "span", children: r.title }),
|
|
206
|
+
r.render ? r.render(
|
|
207
|
+
e[r.dataKey],
|
|
208
|
+
e
|
|
209
|
+
) : /* @__PURE__ */ s(
|
|
210
|
+
g,
|
|
211
|
+
{
|
|
212
|
+
variant: "body",
|
|
213
|
+
weight: "medium",
|
|
214
|
+
size: "base",
|
|
215
|
+
component: "span",
|
|
216
|
+
children: e[r.dataKey]
|
|
217
|
+
}
|
|
218
|
+
)
|
|
219
|
+
]
|
|
220
|
+
},
|
|
221
|
+
p
|
|
222
|
+
))
|
|
223
|
+
}
|
|
224
|
+
),
|
|
225
|
+
t && /* @__PURE__ */ s("hr", { className: "col-span-full text-stroke-base-secondary md:col-span-2" })
|
|
226
|
+
] }),
|
|
227
|
+
(c = typeof t == "function" ? t(e) : t) == null ? void 0 : c.map((r, p) => {
|
|
228
|
+
if (!t) return null;
|
|
229
|
+
const G = typeof t == "function" ? t(e).length : t.length;
|
|
230
|
+
return /* @__PURE__ */ m(J, { children: [
|
|
231
|
+
/* @__PURE__ */ m(
|
|
232
|
+
"div",
|
|
233
|
+
{
|
|
234
|
+
className: o(
|
|
235
|
+
"col-span-full grid grid-cols-1 gap-y-xl md:col-span-2 md:grid-cols-subgrid",
|
|
236
|
+
d == null ? void 0 : d.sectionTitle
|
|
237
|
+
),
|
|
238
|
+
children: [
|
|
239
|
+
r.title && /* @__PURE__ */ s(
|
|
240
|
+
g,
|
|
241
|
+
{
|
|
242
|
+
variant: "body",
|
|
243
|
+
uppercase: !0,
|
|
244
|
+
size: "sm",
|
|
245
|
+
weight: "medium",
|
|
246
|
+
component: "p",
|
|
247
|
+
className: "text-text-brand-def md:col-span-2",
|
|
248
|
+
children: r.title
|
|
249
|
+
}
|
|
250
|
+
),
|
|
251
|
+
/* @__PURE__ */ s(
|
|
252
|
+
"div",
|
|
253
|
+
{
|
|
254
|
+
className: o(
|
|
255
|
+
"col-span-full grid grid-cols-1 gap-x-3xl md:col-span-2 md:grid-cols-subgrid md:gap-y-md",
|
|
256
|
+
d == null ? void 0 : d.cellsWrap
|
|
257
|
+
),
|
|
258
|
+
children: r.cells.flatMap(
|
|
259
|
+
(v, E) => [
|
|
260
|
+
/* @__PURE__ */ s(
|
|
261
|
+
g,
|
|
262
|
+
{
|
|
263
|
+
component: "span",
|
|
264
|
+
variant: "body",
|
|
265
|
+
className: "mb-xs text-text-dark-primary-def md:mb-0",
|
|
266
|
+
children: v.title
|
|
267
|
+
},
|
|
268
|
+
`${E}-label`
|
|
269
|
+
),
|
|
270
|
+
v.render ? /* @__PURE__ */ s(
|
|
271
|
+
"div",
|
|
272
|
+
{
|
|
273
|
+
className: "mb-md block last-of-type:mb-0 md:mb-0",
|
|
274
|
+
children: v.render(
|
|
275
|
+
e[v.dataKey],
|
|
276
|
+
e
|
|
277
|
+
)
|
|
278
|
+
},
|
|
279
|
+
`${E}-value`
|
|
280
|
+
) : /* @__PURE__ */ s(
|
|
281
|
+
g,
|
|
282
|
+
{
|
|
283
|
+
variant: "body",
|
|
284
|
+
weight: "medium",
|
|
285
|
+
component: "span",
|
|
286
|
+
className: "mb-md block last-of-type:mb-0 md:mb-0",
|
|
287
|
+
children: e[v.dataKey]
|
|
288
|
+
},
|
|
289
|
+
`${E}-value`
|
|
290
|
+
)
|
|
291
|
+
]
|
|
292
|
+
)
|
|
293
|
+
}
|
|
294
|
+
)
|
|
295
|
+
]
|
|
296
|
+
}
|
|
297
|
+
),
|
|
298
|
+
p < G - 1 && /* @__PURE__ */ s("hr", { className: "col-span-full text-stroke-base-secondary md:col-span-2" })
|
|
299
|
+
] }, p);
|
|
300
|
+
})
|
|
301
|
+
]
|
|
302
|
+
}
|
|
219
303
|
)
|
|
220
|
-
]
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
] })
|
|
304
|
+
]
|
|
305
|
+
}
|
|
306
|
+
) })
|
|
307
|
+
}
|
|
308
|
+
)
|
|
226
309
|
}
|
|
227
|
-
)
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
310
|
+
) })
|
|
311
|
+
]
|
|
312
|
+
},
|
|
313
|
+
i
|
|
314
|
+
);
|
|
315
|
+
})
|
|
232
316
|
] });
|
|
233
317
|
};
|
|
234
318
|
export {
|
|
235
|
-
|
|
319
|
+
oe as ExpandableTable
|
|
236
320
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { StoryObj } from '@storybook/react-vite';
|
|
2
2
|
declare const meta: {
|
|
3
3
|
title: string;
|
|
4
|
-
component: <T>({ data, columns, expandableRowSections, }: import('./ExpandableTable').ExpandableTableProps<T>) => import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
component: <T>({ data, columns, expandableRowSections, classNames, }: import('./ExpandableTable').ExpandableTableProps<T>) => import("react/jsx-runtime").JSX.Element;
|
|
5
5
|
parameters: {
|
|
6
6
|
layout: string;
|
|
7
7
|
docs: {
|
|
@@ -34,4 +34,6 @@ export declare const WithoutExpandable: Story;
|
|
|
34
34
|
export declare const WithLinksAndButtons: Story;
|
|
35
35
|
export declare const SingleRow: Story;
|
|
36
36
|
export declare const DynamicExpandableRowSections: Story;
|
|
37
|
+
export declare const IndependentColumns: Story;
|
|
38
|
+
export declare const LongLabels: Story;
|
|
37
39
|
//# sourceMappingURL=ExpandableTable.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ExpandableTable.stories.d.ts","sourceRoot":"","sources":["../../../src/components/ExpandableTable/ExpandableTable.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAM3D,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+B8B,CAAA;AAExC,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AA+MlC,eAAO,MAAM,MAAM,EAAE,KAsBpB,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAkB/B,CAAA;AAED,eAAO,MAAM,mBAAmB,EAAE,KAwJjC,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,KAuBvB,CAAA;AAED,eAAO,MAAM,4BAA4B,EAAE,KAyH1C,CAAA"}
|
|
1
|
+
{"version":3,"file":"ExpandableTable.stories.d.ts","sourceRoot":"","sources":["../../../src/components/ExpandableTable/ExpandableTable.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAM3D,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+B8B,CAAA;AAExC,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AA+MlC,eAAO,MAAM,MAAM,EAAE,KAsBpB,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAkB/B,CAAA;AAED,eAAO,MAAM,mBAAmB,EAAE,KAwJjC,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,KAuBvB,CAAA;AAED,eAAO,MAAM,4BAA4B,EAAE,KAyH1C,CAAA;AAED,eAAO,MAAM,kBAAkB,EAAE,KA0DhC,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAoExB,CAAA"}
|
|
@@ -1,14 +1,10 @@
|
|
|
1
1
|
import { VariantProps } from 'class-variance-authority';
|
|
2
2
|
declare const Table: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLTableElement> & import('react').RefAttributes<HTMLTableElement>>;
|
|
3
3
|
declare const TableHeader: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLTableSectionElement> & import('react').RefAttributes<HTMLTableSectionElement>>;
|
|
4
|
-
declare const
|
|
4
|
+
declare const TableRowGroup: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLTableSectionElement> & import('react').RefAttributes<HTMLTableSectionElement>>;
|
|
5
5
|
declare const TableRow: import('react').ForwardRefExoticComponent<import('react').HTMLAttributes<HTMLTableRowElement> & VariantProps<(props?: ({
|
|
6
6
|
expandablePosition?: "none" | "bottom" | "top" | null | undefined;
|
|
7
|
-
} & import('class-variance-authority/types').ClassProp) | undefined) => string> &
|
|
8
|
-
hideBottomSpacing?: boolean;
|
|
9
|
-
colNumber?: number;
|
|
10
|
-
isExpanded?: boolean;
|
|
11
|
-
} & import('react').RefAttributes<HTMLTableRowElement>>;
|
|
7
|
+
} & import('class-variance-authority/types').ClassProp) | undefined) => string> & import('react').RefAttributes<HTMLTableRowElement>>;
|
|
12
8
|
declare const TableHead: import('react').ForwardRefExoticComponent<import('react').ThHTMLAttributes<HTMLTableCellElement> & import('react').RefAttributes<HTMLTableCellElement>>;
|
|
13
9
|
declare const TableCell: import('react').ForwardRefExoticComponent<import('react').TdHTMLAttributes<HTMLTableCellElement> & VariantProps<(props?: ({
|
|
14
10
|
padding?: "default" | "none" | null | undefined;
|
|
@@ -17,5 +13,5 @@ declare const TableCell: import('react').ForwardRefExoticComponent<import('react
|
|
|
17
13
|
isFirst?: boolean;
|
|
18
14
|
isLast?: boolean;
|
|
19
15
|
} & import('react').RefAttributes<HTMLTableCellElement>>;
|
|
20
|
-
export { Table, TableHeader,
|
|
16
|
+
export { Table, TableHeader, TableRowGroup, TableHead, TableRow, TableCell };
|
|
21
17
|
//# sourceMappingURL=Table.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../../src/components/ExpandableTable/Table.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,YAAY,EAAO,MAAM,0BAA0B,CAAA;AAIjE,QAAA,MAAM,KAAK,+IAST,CAAA;AAGF,QAAA,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../../src/components/ExpandableTable/Table.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,YAAY,EAAO,MAAM,0BAA0B,CAAA;AAIjE,QAAA,MAAM,KAAK,+IAST,CAAA;AAGF,QAAA,MAAM,WAAW,6JASf,CAAA;AAGF,QAAA,MAAM,aAAa,6JASjB,CAAA;AAgBF,QAAA,MAAM,QAAQ;;qIAUZ,CAAA;AAGF,QAAA,MAAM,SAAS,yJAkBb,CAAA;AAwBF,QAAA,MAAM,SAAS;;;;cAIC,OAAO;aACR,OAAO;wDA8BrB,CAAA;AAGD,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,aAAa,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAA"}
|