lecom-ui 5.4.21 → 5.4.22
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.
|
@@ -101,8 +101,6 @@ function DataTable({
|
|
|
101
101
|
currentElem.style.position = "sticky";
|
|
102
102
|
currentElem.style.left = `${beforeElemWidth + beforeElemLeft}px`;
|
|
103
103
|
currentElem.style.boxShadow = boxShadow;
|
|
104
|
-
currentElem.style.zIndex = currentElemIsTh ? "20" : "5";
|
|
105
|
-
currentElem.style.backgroundColor = "white";
|
|
106
104
|
if (lastColumnFixed) {
|
|
107
105
|
currentElem.setAttribute("data-separator-fixed", "true");
|
|
108
106
|
}
|
|
@@ -135,33 +135,27 @@ function buildColumns({
|
|
|
135
135
|
onCheckedCellChange: externalColumn.onCheckedCellChange
|
|
136
136
|
});
|
|
137
137
|
}
|
|
138
|
-
|
|
139
|
-
if (externalColumn.render) {
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
});
|
|
148
|
-
}
|
|
149
|
-
return externalColumn.render;
|
|
138
|
+
if (externalColumn.render) {
|
|
139
|
+
if (typeof externalColumn.render === "function") {
|
|
140
|
+
const expandToggle = expandedContent ? createExpandToggle(row) : void 0;
|
|
141
|
+
return externalColumn.render({
|
|
142
|
+
value: row.getValue(externalColumn.key),
|
|
143
|
+
row,
|
|
144
|
+
toggleExpanded: expandToggle?.toggleExpanded,
|
|
145
|
+
isExpanded: expandToggle?.isExpanded
|
|
146
|
+
});
|
|
150
147
|
}
|
|
151
|
-
return
|
|
152
|
-
Typography,
|
|
153
|
-
{
|
|
154
|
-
variant: size === "small" ? "body-medium-400" : "body-large-400",
|
|
155
|
-
textColor: "text-grey-800",
|
|
156
|
-
title: row.getValue(externalColumn.key)
|
|
157
|
-
},
|
|
158
|
-
row.getValue(externalColumn.key)
|
|
159
|
-
);
|
|
160
|
-
})();
|
|
161
|
-
if (externalColumn.truncate) {
|
|
162
|
-
return /* @__PURE__ */ React.createElement("div", { className: "block truncate" }, content);
|
|
148
|
+
return externalColumn.render;
|
|
163
149
|
}
|
|
164
|
-
return
|
|
150
|
+
return /* @__PURE__ */ React.createElement(
|
|
151
|
+
Typography,
|
|
152
|
+
{
|
|
153
|
+
variant: size === "small" ? "body-medium-400" : "body-large-400",
|
|
154
|
+
textColor: "text-grey-800",
|
|
155
|
+
title: row.getValue(externalColumn.key)
|
|
156
|
+
},
|
|
157
|
+
row.getValue(externalColumn.key)
|
|
158
|
+
);
|
|
165
159
|
},
|
|
166
160
|
enableExpanding: externalColumn.enableExpand && !!expandedContent,
|
|
167
161
|
meta: {
|
|
@@ -13,15 +13,26 @@ function Table({
|
|
|
13
13
|
onIsSelected,
|
|
14
14
|
expandedContent
|
|
15
15
|
}) {
|
|
16
|
-
const styleColumn = React.useCallback((meta) => {
|
|
16
|
+
const styleColumn = React.useCallback((meta, elem) => {
|
|
17
|
+
if (elem === "td" && meta.truncate) {
|
|
18
|
+
return {
|
|
19
|
+
width: meta.width,
|
|
20
|
+
maxWidth: meta.maxWidth ?? "0",
|
|
21
|
+
minWidth: meta.minWidth ?? "0",
|
|
22
|
+
overflow: "hidden",
|
|
23
|
+
textOverflow: "ellipsis",
|
|
24
|
+
whiteSpace: "nowrap",
|
|
25
|
+
textAlign: meta.align || "left"
|
|
26
|
+
};
|
|
27
|
+
}
|
|
17
28
|
return {
|
|
18
|
-
width: meta
|
|
19
|
-
maxWidth: meta
|
|
20
|
-
minWidth: meta
|
|
21
|
-
textAlign: meta
|
|
29
|
+
width: meta.width,
|
|
30
|
+
maxWidth: meta.maxWidth ?? void 0,
|
|
31
|
+
minWidth: meta.minWidth ?? void 0,
|
|
32
|
+
textAlign: meta.align || "left"
|
|
22
33
|
};
|
|
23
34
|
}, []);
|
|
24
|
-
const getFixed = React.useCallback((meta) => meta
|
|
35
|
+
const getFixed = React.useCallback((meta) => meta.fixed, []);
|
|
25
36
|
if (isLoading) {
|
|
26
37
|
if (skeleton) {
|
|
27
38
|
return skeleton;
|
|
@@ -35,58 +46,50 @@ function Table({
|
|
|
35
46
|
}
|
|
36
47
|
)));
|
|
37
48
|
}
|
|
38
|
-
return /* @__PURE__ */ React.createElement("table", { id: "data-table", className: "w-full" }, /* @__PURE__ */ React.createElement("thead", { className: "sticky top-0 z-10 bg-white" }, table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ React.createElement("tr", { key: headerGroup.id }, headerGroup.headers.map((header) =>
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
header.getContext()
|
|
61
|
-
))
|
|
62
|
-
);
|
|
63
|
-
})))), /* @__PURE__ */ React.createElement("tbody", { className: "[&_tr:last-child]:border-0 [&_tr:last-child_td]:shadow-none" }, table.getRowModel().rows?.length ? table.getRowModel().rows.map((row) => /* @__PURE__ */ React.createElement(React.Fragment, { key: row.id }, /* @__PURE__ */ React.createElement(
|
|
49
|
+
return /* @__PURE__ */ React.createElement("table", { id: "data-table", className: "w-full" }, /* @__PURE__ */ React.createElement("thead", { className: "sticky top-0 z-10 bg-white" }, table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ React.createElement("tr", { key: headerGroup.id }, headerGroup.headers.map((header) => /* @__PURE__ */ React.createElement(
|
|
50
|
+
"th",
|
|
51
|
+
{
|
|
52
|
+
key: header.id,
|
|
53
|
+
className: cn(
|
|
54
|
+
"h-12 px-4 [&:has([role=checkbox])]:pr-0 shadow-[0_-1.5px_0px_0px_#c9c9c9_inset] text-left",
|
|
55
|
+
size === "small" && "h-10",
|
|
56
|
+
header.column.getIsSorted() && "bg-grey-50 font-medium",
|
|
57
|
+
header.column.columnDef.meta?.headerClassName
|
|
58
|
+
),
|
|
59
|
+
"data-header": header.id,
|
|
60
|
+
"data-fixed": getFixed(header.column.columnDef.meta),
|
|
61
|
+
style: {
|
|
62
|
+
...styleColumn(header.column.columnDef.meta, "th"),
|
|
63
|
+
...header.column.columnDef.meta?.headerStyle
|
|
64
|
+
}
|
|
65
|
+
},
|
|
66
|
+
header.isPlaceholder ? null : flexRender(
|
|
67
|
+
header.column.columnDef.header,
|
|
68
|
+
header.getContext()
|
|
69
|
+
)
|
|
70
|
+
))))), /* @__PURE__ */ React.createElement("tbody", { className: "[&_tr:last-child]:border-0 [&_tr:last-child_td]:shadow-none" }, table.getRowModel().rows?.length ? table.getRowModel().rows.map((row) => /* @__PURE__ */ React.createElement(React.Fragment, { key: row.id }, /* @__PURE__ */ React.createElement(
|
|
64
71
|
"tr",
|
|
65
72
|
{
|
|
66
73
|
"data-state": onIsSelected?.(row) ? "selected" : "",
|
|
67
74
|
className: "[&_td]:hover:!bg-grey-100 [&_td]:data-[state=selected]:bg-grey-100"
|
|
68
75
|
},
|
|
69
|
-
row.getVisibleCells().map((cell) =>
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
"
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
cell.getContext()
|
|
87
|
-
))
|
|
88
|
-
);
|
|
89
|
-
})
|
|
76
|
+
row.getVisibleCells().map((cell) => /* @__PURE__ */ React.createElement(
|
|
77
|
+
"td",
|
|
78
|
+
{
|
|
79
|
+
key: cell.id,
|
|
80
|
+
className: cn(
|
|
81
|
+
"p-4 py-0 h-10 [&:has([role=checkbox])]:pr-0 transition-colors shadow-[0_-0.5px_0px_0px_#c9c9c9_inset] text-left",
|
|
82
|
+
cell.column.columnDef.meta?.cellClassName
|
|
83
|
+
),
|
|
84
|
+
"data-column": cell.column.id,
|
|
85
|
+
"data-fixed": getFixed(cell.column.columnDef.meta),
|
|
86
|
+
style: styleColumn(
|
|
87
|
+
cell.column.columnDef.meta,
|
|
88
|
+
"td"
|
|
89
|
+
)
|
|
90
|
+
},
|
|
91
|
+
flexRender(cell.column.columnDef.cell, cell.getContext())
|
|
92
|
+
))
|
|
90
93
|
), row.getIsExpanded() && expandedContent && /* @__PURE__ */ React.createElement("tr", null, /* @__PURE__ */ React.createElement("td", { colSpan: columns.length, className: "p-0" }, expandedContent(row))))) : /* @__PURE__ */ React.createElement("tr", { className: "border-b-[0.5px] [&_td]:hover:bg-grey-100 [&_td]:data-[state=selected]:bg-grey-100" }, /* @__PURE__ */ React.createElement(
|
|
91
94
|
"td",
|
|
92
95
|
{
|
package/dist/index.d.ts
CHANGED
|
@@ -785,9 +785,9 @@ interface HeaderProps extends React$1.HTMLAttributes<HTMLElement>, VariantProps<
|
|
|
785
785
|
}
|
|
786
786
|
|
|
787
787
|
declare const inputVariants: (props?: ({
|
|
788
|
-
variant?: "
|
|
789
|
-
size?: "
|
|
790
|
-
radius?: "
|
|
788
|
+
variant?: "filled" | "default" | "borderless" | null | undefined;
|
|
789
|
+
size?: "small" | "large" | "default" | null | undefined;
|
|
790
|
+
radius?: "small" | "large" | "default" | "full" | null | undefined;
|
|
791
791
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
792
792
|
interface InputProps extends Omit<React$1.InputHTMLAttributes<HTMLInputElement>, 'size' | 'sufix' | 'prefix'>, VariantProps<typeof inputVariants> {
|
|
793
793
|
sufix?: React$1.ReactNode;
|
|
@@ -992,7 +992,7 @@ declare const RadioGroup: React$1.ForwardRefExoticComponent<Omit<RadioGroupPrimi
|
|
|
992
992
|
declare const RadioGroupItem: React$1.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupItemProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
|
|
993
993
|
|
|
994
994
|
declare const ResizablePanelGroup: ({ className, ...props }: React$1.ComponentProps<typeof ResizablePrimitive.PanelGroup>) => React$1.JSX.Element;
|
|
995
|
-
declare const ResizablePanel: React$1.ForwardRefExoticComponent<Omit<React$1.HTMLAttributes<
|
|
995
|
+
declare const ResizablePanel: React$1.ForwardRefExoticComponent<Omit<React$1.HTMLAttributes<HTMLButtonElement | HTMLElement | HTMLDivElement | HTMLOListElement | HTMLLIElement | HTMLAnchorElement | HTMLSpanElement | HTMLHeadingElement | HTMLParagraphElement | HTMLLabelElement | HTMLInputElement | HTMLUListElement | HTMLObjectElement | HTMLAreaElement | HTMLAudioElement | HTMLBaseElement | HTMLQuoteElement | HTMLBodyElement | HTMLBRElement | HTMLCanvasElement | HTMLTableCaptionElement | HTMLTableColElement | HTMLDataElement | HTMLDataListElement | HTMLModElement | HTMLDetailsElement | HTMLDialogElement | HTMLDListElement | HTMLEmbedElement | HTMLFieldSetElement | HTMLFormElement | HTMLHeadElement | HTMLHRElement | HTMLHtmlElement | HTMLIFrameElement | HTMLImageElement | HTMLLegendElement | HTMLLinkElement | HTMLMapElement | HTMLMenuElement | HTMLMetaElement | HTMLMeterElement | HTMLOptGroupElement | HTMLOptionElement | HTMLOutputElement | HTMLPictureElement | HTMLPreElement | HTMLProgressElement | HTMLScriptElement | HTMLSelectElement | HTMLSlotElement | HTMLSourceElement | HTMLStyleElement | HTMLTableElement | HTMLTableSectionElement | HTMLTableCellElement | HTMLTemplateElement | HTMLTextAreaElement | HTMLTimeElement | HTMLTitleElement | HTMLTableRowElement | HTMLTrackElement | HTMLVideoElement>, "id" | "onResize"> & {
|
|
996
996
|
className?: string;
|
|
997
997
|
collapsedSize?: number | undefined;
|
|
998
998
|
collapsible?: boolean | undefined;
|
|
@@ -1158,9 +1158,9 @@ declare const TabsTrigger: React$1.ForwardRefExoticComponent<Omit<TabsPrimitive.
|
|
|
1158
1158
|
declare const TabsContent: React$1.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsContentProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
|
|
1159
1159
|
|
|
1160
1160
|
declare const textareaVariants: (props?: ({
|
|
1161
|
-
variant?: "
|
|
1162
|
-
size?: "
|
|
1163
|
-
radius?: "
|
|
1161
|
+
variant?: "filled" | "default" | "borderless" | null | undefined;
|
|
1162
|
+
size?: "small" | "large" | "default" | null | undefined;
|
|
1163
|
+
radius?: "small" | "large" | "default" | "full" | null | undefined;
|
|
1164
1164
|
resize?: "default" | "both" | "horizontal" | "vertical" | "vertical-limited" | null | undefined;
|
|
1165
1165
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
1166
1166
|
interface TextareaProps extends React$1.ComponentProps<'textarea'>, VariantProps<typeof textareaVariants> {
|
|
@@ -1344,7 +1344,7 @@ interface DateInputProps extends Omit<React$1.InputHTMLAttributes<HTMLInputEleme
|
|
|
1344
1344
|
declare const DateInput: React$1.ForwardRefExoticComponent<DateInputProps & React$1.RefAttributes<HTMLInputElement>>;
|
|
1345
1345
|
|
|
1346
1346
|
declare const badgeVariants: (props?: ({
|
|
1347
|
-
variant?: "
|
|
1347
|
+
variant?: "destructive" | "default" | "outline" | "secondary" | null | undefined;
|
|
1348
1348
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
1349
1349
|
interface BadgeProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
|
|
1350
1350
|
}
|