nillud-data-table 1.5.3 → 1.5.4
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/index.js +84 -71
- package/dist/styles.css +6 -3
- package/dist/styles.css.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -18,8 +18,18 @@ var SortUp = () => {
|
|
|
18
18
|
};
|
|
19
19
|
var SortUp_default = SortUp;
|
|
20
20
|
|
|
21
|
+
// components/data-table/img/CloseIcon.tsx
|
|
22
|
+
import { jsx as jsx3 } from "react/jsx-runtime";
|
|
23
|
+
var CloseIcon = ({
|
|
24
|
+
size = 16,
|
|
25
|
+
fill = "currentColor"
|
|
26
|
+
}) => {
|
|
27
|
+
return /* @__PURE__ */ jsx3("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, fill, className: "bi bi-x-circle-fill", viewBox: `0 0 ${size} ${size}`, children: /* @__PURE__ */ jsx3("path", { d: "M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0M5.354 4.646a.5.5 0 1 0-.708.708L7.293 8l-2.647 2.646a.5.5 0 0 0 .708.708L8 8.707l2.646 2.647a.5.5 0 0 0 .708-.708L8.707 8l2.647-2.646a.5.5 0 0 0-.708-.708L8 7.293z" }) });
|
|
28
|
+
};
|
|
29
|
+
var CloseIcon_default = CloseIcon;
|
|
30
|
+
|
|
21
31
|
// components/data-table/Column.tsx
|
|
22
|
-
import { Fragment, jsx as
|
|
32
|
+
import { Fragment, jsx as jsx4, jsxs } from "react/jsx-runtime";
|
|
23
33
|
var Column = ({
|
|
24
34
|
column,
|
|
25
35
|
getSortField,
|
|
@@ -39,12 +49,12 @@ var Column = ({
|
|
|
39
49
|
const nextType = currentSort === "asc" ? "desc" : "asc";
|
|
40
50
|
getSortField({ col: column.field, type: nextType });
|
|
41
51
|
};
|
|
42
|
-
const onFilterChange = (
|
|
43
|
-
getFilters({ ...filters, [column.field]:
|
|
52
|
+
const onFilterChange = (value) => {
|
|
53
|
+
getFilters({ ...filters, [column.field]: value });
|
|
44
54
|
};
|
|
45
55
|
const renderSelectable = () => {
|
|
46
56
|
const allSelected = displayData.length > 0 && displayData.every((row) => selectedRows.has(getRowId(row)));
|
|
47
|
-
return /* @__PURE__ */
|
|
57
|
+
return /* @__PURE__ */ jsx4("div", { className: "ndt-column ndt-checkbox-column", children: /* @__PURE__ */ jsx4(
|
|
48
58
|
"input",
|
|
49
59
|
{
|
|
50
60
|
type: "checkbox",
|
|
@@ -57,39 +67,42 @@ var Column = ({
|
|
|
57
67
|
if (column.headerFormatter) {
|
|
58
68
|
return column.headerFormatter(column.title);
|
|
59
69
|
}
|
|
60
|
-
return /* @__PURE__ */
|
|
70
|
+
return /* @__PURE__ */ jsx4("span", { children: column.title });
|
|
61
71
|
};
|
|
62
72
|
const renderColumnSort = () => {
|
|
63
73
|
if (typeof column.autoinc === "undefined" && (typeof column.sortable === "undefined" || column.sortable)) {
|
|
64
|
-
return /* @__PURE__ */
|
|
74
|
+
return /* @__PURE__ */ jsx4("div", { className: "ndt-sorter", onClick: toggleSort, children: currentSort === "asc" ? /* @__PURE__ */ jsx4(SortDown_default, {}) : currentSort === "desc" ? /* @__PURE__ */ jsx4(SortUp_default, {}) : /* @__PURE__ */ jsx4(SortDown_default, {}) });
|
|
65
75
|
}
|
|
66
|
-
return /* @__PURE__ */
|
|
76
|
+
return /* @__PURE__ */ jsx4(Fragment, {});
|
|
67
77
|
};
|
|
68
|
-
return /* @__PURE__ */
|
|
78
|
+
return /* @__PURE__ */ jsx4(Fragment, { children: column.selectable ? renderSelectable() : /* @__PURE__ */ jsxs("div", { className: "ndt-column", children: [
|
|
69
79
|
/* @__PURE__ */ jsxs("div", { className: "ndt-column-head", children: [
|
|
70
80
|
renderColumnHead(),
|
|
71
81
|
renderColumnSort()
|
|
72
82
|
] }),
|
|
73
|
-
/* @__PURE__ */
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
83
|
+
/* @__PURE__ */ jsx4("div", { className: "ndt-column-footer", children: typeof column.autoinc === "undefined" && (typeof column.filterable === "undefined" || column.filterable) && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
84
|
+
/* @__PURE__ */ jsx4(
|
|
85
|
+
"input",
|
|
86
|
+
{
|
|
87
|
+
type: "text",
|
|
88
|
+
value: (_a = filters[column.field]) != null ? _a : "",
|
|
89
|
+
onChange: (e) => onFilterChange(e.target.value),
|
|
90
|
+
placeholder: column.filterPlaceholder || ""
|
|
91
|
+
}
|
|
92
|
+
),
|
|
93
|
+
typeof filters[column.field] !== "undefined" && filters[column.field] !== "" && /* @__PURE__ */ jsx4("span", { onClick: () => onFilterChange(""), children: /* @__PURE__ */ jsx4(CloseIcon_default, { size: 16, fill: "#707695" }) })
|
|
94
|
+
] }) })
|
|
82
95
|
] }) });
|
|
83
96
|
};
|
|
84
97
|
var Column_default = Column;
|
|
85
98
|
|
|
86
99
|
// components/data-table/TableHeader.tsx
|
|
87
100
|
import { memo } from "react";
|
|
88
|
-
import { Fragment as Fragment2, jsx as
|
|
101
|
+
import { Fragment as Fragment2, jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
89
102
|
var Header = ({ columns, getSortField, sortBy, getFilters, filters, widths, headerGroup, selectedRows, toggleAllSelection, displayData }) => {
|
|
90
|
-
const renderHeaderGroup = () => headerGroup && /* @__PURE__ */
|
|
103
|
+
const renderHeaderGroup = () => headerGroup && /* @__PURE__ */ jsx5("div", { className: "ndt-table-columns", style: { gridTemplateColumns: widths || "auto" }, children: headerGroup.map((col, id) => /* @__PURE__ */ jsx5("div", { className: "ndt-column", style: { gridColumn: `span ${col.cols || 1}` }, children: /* @__PURE__ */ jsx5("div", { className: "ndt-column-head", children: /* @__PURE__ */ jsx5("span", { title: col.title, children: col.title }) }) }, `header-group-${id}`)) });
|
|
91
104
|
const getRowId = (row) => row.id;
|
|
92
|
-
const renderColumns = () => columns && columns.length > 0 ? columns.map((column, id) => /* @__PURE__ */
|
|
105
|
+
const renderColumns = () => columns && columns.length > 0 ? columns.map((column, id) => /* @__PURE__ */ jsx5(
|
|
93
106
|
Column_default,
|
|
94
107
|
{
|
|
95
108
|
column,
|
|
@@ -103,10 +116,10 @@ var Header = ({ columns, getSortField, sortBy, getFilters, filters, widths, head
|
|
|
103
116
|
getRowId
|
|
104
117
|
},
|
|
105
118
|
`column-${id}`
|
|
106
|
-
)) : /* @__PURE__ */
|
|
119
|
+
)) : /* @__PURE__ */ jsx5("div", { className: "ndt-data-error", children: "\u041E\u0448\u0438\u0431\u043A\u0430: columns is undefined" });
|
|
107
120
|
return /* @__PURE__ */ jsxs2(Fragment2, { children: [
|
|
108
121
|
renderHeaderGroup(),
|
|
109
|
-
/* @__PURE__ */
|
|
122
|
+
/* @__PURE__ */ jsx5("div", { className: "ndt-table-columns", style: { gridTemplateColumns: widths || "auto" }, children: renderColumns() })
|
|
110
123
|
] });
|
|
111
124
|
};
|
|
112
125
|
var TableHeader_default = memo(Header);
|
|
@@ -116,7 +129,7 @@ import React, { memo as memo4, useMemo as useMemo3 } from "react";
|
|
|
116
129
|
|
|
117
130
|
// components/data-table/Cell.tsx
|
|
118
131
|
import { memo as memo2, useMemo as useMemo2 } from "react";
|
|
119
|
-
import { jsx as
|
|
132
|
+
import { jsx as jsx6 } from "react/jsx-runtime";
|
|
120
133
|
var Cell = ({
|
|
121
134
|
row,
|
|
122
135
|
column,
|
|
@@ -147,7 +160,7 @@ var Cell = ({
|
|
|
147
160
|
"center": { justifyContent: "center" },
|
|
148
161
|
"right": { justifyContent: "flex-end" }
|
|
149
162
|
};
|
|
150
|
-
const CellWithData = ({ children }) => /* @__PURE__ */
|
|
163
|
+
const CellWithData = ({ children }) => /* @__PURE__ */ jsx6(
|
|
151
164
|
"div",
|
|
152
165
|
{
|
|
153
166
|
className: "ndt-cell",
|
|
@@ -161,7 +174,7 @@ var Cell = ({
|
|
|
161
174
|
children
|
|
162
175
|
}
|
|
163
176
|
);
|
|
164
|
-
const EditableCell = () => /* @__PURE__ */
|
|
177
|
+
const EditableCell = () => /* @__PURE__ */ jsx6(
|
|
165
178
|
"input",
|
|
166
179
|
{
|
|
167
180
|
className: "ndt-cell ndt-cell-editable",
|
|
@@ -171,19 +184,19 @@ var Cell = ({
|
|
|
171
184
|
}
|
|
172
185
|
}
|
|
173
186
|
);
|
|
174
|
-
const SelectableCell = () => /* @__PURE__ */
|
|
187
|
+
const SelectableCell = () => /* @__PURE__ */ jsx6("div", { className: "ndt-cell ndt-checkbox-cell", onClick: onRowSelect, children: /* @__PURE__ */ jsx6("input", { type: "checkbox", checked: !!isRowSelected, onChange: () => {
|
|
175
188
|
} }) });
|
|
176
|
-
if (isAutoinc) return /* @__PURE__ */
|
|
177
|
-
if (isFormatted) return /* @__PURE__ */
|
|
178
|
-
if (isEditable) return /* @__PURE__ */
|
|
179
|
-
if (isColumnSelectable) return /* @__PURE__ */
|
|
180
|
-
return /* @__PURE__ */
|
|
189
|
+
if (isAutoinc) return /* @__PURE__ */ jsx6(CellWithData, { children: displayId + 1 });
|
|
190
|
+
if (isFormatted) return /* @__PURE__ */ jsx6(CellWithData, { children: formattedContent });
|
|
191
|
+
if (isEditable) return /* @__PURE__ */ jsx6(EditableCell, {});
|
|
192
|
+
if (isColumnSelectable) return /* @__PURE__ */ jsx6(SelectableCell, {});
|
|
193
|
+
return /* @__PURE__ */ jsx6(CellWithData, { children: stringValue });
|
|
181
194
|
};
|
|
182
195
|
var Cell_default = memo2(Cell);
|
|
183
196
|
|
|
184
197
|
// components/data-table/Row.tsx
|
|
185
198
|
import { memo as memo3 } from "react";
|
|
186
|
-
import { jsx as
|
|
199
|
+
import { jsx as jsx7 } from "react/jsx-runtime";
|
|
187
200
|
var Row = ({
|
|
188
201
|
rowId,
|
|
189
202
|
displayId,
|
|
@@ -195,12 +208,12 @@ var Row = ({
|
|
|
195
208
|
onRowSelect
|
|
196
209
|
}) => {
|
|
197
210
|
const isSelectable = columns.find((element) => element.selectable);
|
|
198
|
-
return /* @__PURE__ */
|
|
211
|
+
return /* @__PURE__ */ jsx7(
|
|
199
212
|
"div",
|
|
200
213
|
{
|
|
201
214
|
className: `ndt-table-row ${isSelectable && "ndt-table-row-selectable"} ${isRowSelected && "ndt-table-row-selected"}`,
|
|
202
215
|
style: { gridTemplateColumns: widths },
|
|
203
|
-
children: columns.map((column, id) => /* @__PURE__ */
|
|
216
|
+
children: columns.map((column, id) => /* @__PURE__ */ jsx7(
|
|
204
217
|
Cell_default,
|
|
205
218
|
{
|
|
206
219
|
row,
|
|
@@ -232,7 +245,7 @@ var groupDataBy = (data, key) => {
|
|
|
232
245
|
};
|
|
233
246
|
|
|
234
247
|
// components/data-table/TableBody.tsx
|
|
235
|
-
import { jsx as
|
|
248
|
+
import { jsx as jsx8, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
236
249
|
var TableBody = ({
|
|
237
250
|
columns,
|
|
238
251
|
tableData,
|
|
@@ -251,7 +264,7 @@ var TableBody = ({
|
|
|
251
264
|
}) => {
|
|
252
265
|
const grouped = useMemo3(() => groupBy ? groupDataBy(tableData, groupBy) : [], [tableData, groupBy]);
|
|
253
266
|
if (!tableData || tableData.length === 0) {
|
|
254
|
-
return /* @__PURE__ */
|
|
267
|
+
return /* @__PURE__ */ jsx8("div", { className: `ndt-table-body${scrollable ? " ndt-table-body-scrollable" : ""}`, style: scrollable ? { height: scrollHeight } : {}, children: /* @__PURE__ */ jsx8("div", { className: "ndt-table-row", style: { height: "100%" }, children: /* @__PURE__ */ jsx8("div", { className: "ndt-row-item", style: { margin: "auto", padding: 20, fontWeight: "bold" }, children: "\u0414\u0430\u043D\u043D\u044B\u0445 \u043D\u0435\u0442" }) }) });
|
|
255
268
|
}
|
|
256
269
|
const renderGroupedRows = () => {
|
|
257
270
|
let currentIndex = 0;
|
|
@@ -262,7 +275,7 @@ var TableBody = ({
|
|
|
262
275
|
className: "ndt-group-header",
|
|
263
276
|
onClick: () => toggleGroup == null ? void 0 : toggleGroup(group.key),
|
|
264
277
|
children: [
|
|
265
|
-
/* @__PURE__ */
|
|
278
|
+
/* @__PURE__ */ jsx8("span", { style: { marginRight: 8 }, children: collapsedGroups[group.key] ? "\u25B6" : "\u25BC" }),
|
|
266
279
|
group.key,
|
|
267
280
|
" (",
|
|
268
281
|
group.items.length,
|
|
@@ -276,7 +289,7 @@ var TableBody = ({
|
|
|
276
289
|
if (globalIndex === void 0) return null;
|
|
277
290
|
const localIndex = currentIndex++;
|
|
278
291
|
const displayIndex = paginationSize === 0 ? localIndex : paginationPage * paginationSize + localIndex;
|
|
279
|
-
return /* @__PURE__ */
|
|
292
|
+
return /* @__PURE__ */ jsx8(
|
|
280
293
|
Row_default,
|
|
281
294
|
{
|
|
282
295
|
rowId: element.id,
|
|
@@ -304,7 +317,7 @@ var TableBody = ({
|
|
|
304
317
|
if (globalIndex === void 0) return null;
|
|
305
318
|
const localIndex = currentIndex++;
|
|
306
319
|
const displayIndex = paginationSize === 0 ? localIndex : paginationPage * paginationSize + localIndex;
|
|
307
|
-
return /* @__PURE__ */
|
|
320
|
+
return /* @__PURE__ */ jsx8(
|
|
308
321
|
Row_default,
|
|
309
322
|
{
|
|
310
323
|
rowId: element.id,
|
|
@@ -320,40 +333,40 @@ var TableBody = ({
|
|
|
320
333
|
);
|
|
321
334
|
});
|
|
322
335
|
};
|
|
323
|
-
return /* @__PURE__ */
|
|
336
|
+
return /* @__PURE__ */ jsx8("div", { className: `ndt-table-body${scrollable ? " ndt-table-body-scrollable" : ""}`, style: scrollable ? { height: scrollHeight } : {}, children: groupBy ? renderGroupedRows() : renderFlatRows() });
|
|
324
337
|
};
|
|
325
338
|
var TableBody_default = memo4(TableBody);
|
|
326
339
|
|
|
327
340
|
// components/data-table/img/NextIcon.tsx
|
|
328
|
-
import { jsx as
|
|
341
|
+
import { jsx as jsx9 } from "react/jsx-runtime";
|
|
329
342
|
var NextIcon = () => {
|
|
330
|
-
return /* @__PURE__ */
|
|
343
|
+
return /* @__PURE__ */ jsx9("svg", { width: "41", height: "65", viewBox: "0 0 41 65", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx9("path", { d: "M0.674316 57.2669L25.3872 32.5L0.674316 7.73312L8.28244 0.125L40.6574 32.5L8.28244 64.875L0.674316 57.2669Z", fill: "#666666" }) });
|
|
331
344
|
};
|
|
332
345
|
var NextIcon_default = NextIcon;
|
|
333
346
|
|
|
334
347
|
// components/data-table/img/LastIcon.tsx
|
|
335
|
-
import { jsx as
|
|
348
|
+
import { jsx as jsx10 } from "react/jsx-runtime";
|
|
336
349
|
var LastIcon = () => {
|
|
337
|
-
return /* @__PURE__ */
|
|
350
|
+
return /* @__PURE__ */ jsx10("svg", { width: "68", height: "65", viewBox: "0 0 68 65", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx10("path", { d: "M0.185059 7.73312L24.9519 32.5L0.185059 57.2669L7.79318 64.875L40.1682 32.5L7.79318 0.125L0.185059 7.73312ZM56.3557 0.125H67.1474V64.875H56.3557V0.125Z", fill: "#666666" }) });
|
|
338
351
|
};
|
|
339
352
|
var LastIcon_default = LastIcon;
|
|
340
353
|
|
|
341
354
|
// components/data-table/img/PrevIcon.tsx
|
|
342
|
-
import { jsx as
|
|
355
|
+
import { jsx as jsx11 } from "react/jsx-runtime";
|
|
343
356
|
var PrevIcon = () => {
|
|
344
|
-
return /* @__PURE__ */
|
|
357
|
+
return /* @__PURE__ */ jsx11("svg", { width: "41", height: "65", viewBox: "0 0 41 65", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx11("path", { d: "M40.6574 57.2669L15.9445 32.5L40.6574 7.73312L33.0493 0.125L0.674316 32.5L33.0493 64.875L40.6574 57.2669Z", fill: "#666666" }) });
|
|
345
358
|
};
|
|
346
359
|
var PrevIcon_default = PrevIcon;
|
|
347
360
|
|
|
348
361
|
// components/data-table/img/FirstIcon.tsx
|
|
349
|
-
import { jsx as
|
|
362
|
+
import { jsx as jsx12 } from "react/jsx-runtime";
|
|
350
363
|
var FirstIcon = () => {
|
|
351
|
-
return /* @__PURE__ */
|
|
364
|
+
return /* @__PURE__ */ jsx12("svg", { width: "68", height: "65", viewBox: "0 0 68 65", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx12("path", { d: "M67.1474 57.2669L42.3805 32.5L67.1474 7.73312L59.5392 0.125L27.1642 32.5L59.5392 64.875L67.1474 57.2669ZM0.185059 0.125H10.9767V64.875H0.185059V0.125Z", fill: "#666666" }) });
|
|
352
365
|
};
|
|
353
366
|
var FirstIcon_default = FirstIcon;
|
|
354
367
|
|
|
355
368
|
// components/data-table/TableFooter.tsx
|
|
356
|
-
import { jsx as
|
|
369
|
+
import { jsx as jsx13, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
357
370
|
var TableFooter = ({
|
|
358
371
|
tableData,
|
|
359
372
|
paginationCounts,
|
|
@@ -374,7 +387,7 @@ var TableFooter = ({
|
|
|
374
387
|
}
|
|
375
388
|
};
|
|
376
389
|
const renderPageNumbers = () => {
|
|
377
|
-
if (totalPages <= 1) return /* @__PURE__ */
|
|
390
|
+
if (totalPages <= 1) return /* @__PURE__ */ jsx13(
|
|
378
391
|
"button",
|
|
379
392
|
{
|
|
380
393
|
className: "btn-active",
|
|
@@ -393,15 +406,15 @@ var TableFooter = ({
|
|
|
393
406
|
}
|
|
394
407
|
if (start > 0) {
|
|
395
408
|
pages.push(
|
|
396
|
-
/* @__PURE__ */
|
|
409
|
+
/* @__PURE__ */ jsx13("button", { onClick: () => handlePageChange(0), children: "1" }, "page-0")
|
|
397
410
|
);
|
|
398
411
|
if (start > 1) {
|
|
399
|
-
pages.push(/* @__PURE__ */
|
|
412
|
+
pages.push(/* @__PURE__ */ jsx13("span", { children: "..." }, "ellipsis-start"));
|
|
400
413
|
}
|
|
401
414
|
}
|
|
402
415
|
for (let i = start; i <= end; i++) {
|
|
403
416
|
pages.push(
|
|
404
|
-
/* @__PURE__ */
|
|
417
|
+
/* @__PURE__ */ jsx13(
|
|
405
418
|
"button",
|
|
406
419
|
{
|
|
407
420
|
className: i === paginationPage ? "btn-active" : "",
|
|
@@ -415,10 +428,10 @@ var TableFooter = ({
|
|
|
415
428
|
}
|
|
416
429
|
if (end < totalPages - 1) {
|
|
417
430
|
if (end < totalPages - 2) {
|
|
418
|
-
pages.push(/* @__PURE__ */
|
|
431
|
+
pages.push(/* @__PURE__ */ jsx13("span", { children: "..." }, "ellipsis-end"));
|
|
419
432
|
}
|
|
420
433
|
pages.push(
|
|
421
|
-
/* @__PURE__ */
|
|
434
|
+
/* @__PURE__ */ jsx13("button", { onClick: () => handlePageChange(totalPages - 1), children: totalPages }, `page-${totalPages - 1}`)
|
|
422
435
|
);
|
|
423
436
|
}
|
|
424
437
|
return pages;
|
|
@@ -441,45 +454,45 @@ var TableFooter = ({
|
|
|
441
454
|
] }),
|
|
442
455
|
paginationCounts && /* @__PURE__ */ jsxs4("div", { className: "ndt-footer-pagination", children: [
|
|
443
456
|
/* @__PURE__ */ jsxs4("div", { className: "ndt-pagination-counts", children: [
|
|
444
|
-
/* @__PURE__ */
|
|
445
|
-
/* @__PURE__ */
|
|
457
|
+
/* @__PURE__ */ jsx13("span", { children: "\u041F\u043E\u043A\u0430\u0437\u044B\u0432\u0430\u0442\u044C \u0441\u0442\u0440\u043E\u043A: " }),
|
|
458
|
+
/* @__PURE__ */ jsx13("select", { value: paginationSize, onChange: handleCountChange, children: paginationCounts.map((count) => /* @__PURE__ */ jsx13("option", { value: count, children: count === 0 ? "\u0412\u0441\u0435" : count }, `count-${count}`)) })
|
|
446
459
|
] }),
|
|
447
460
|
/* @__PURE__ */ jsxs4("div", { className: "ndt-pagination-buttons", children: [
|
|
448
|
-
/* @__PURE__ */
|
|
461
|
+
/* @__PURE__ */ jsx13(
|
|
449
462
|
"button",
|
|
450
463
|
{
|
|
451
464
|
disabled: paginationPage === 0,
|
|
452
465
|
onClick: () => handlePageChange(0),
|
|
453
466
|
"aria-label": "\u041F\u0435\u0440\u0432\u0430\u044F \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0430",
|
|
454
|
-
children: /* @__PURE__ */
|
|
467
|
+
children: /* @__PURE__ */ jsx13(FirstIcon_default, {})
|
|
455
468
|
}
|
|
456
469
|
),
|
|
457
|
-
/* @__PURE__ */
|
|
470
|
+
/* @__PURE__ */ jsx13(
|
|
458
471
|
"button",
|
|
459
472
|
{
|
|
460
473
|
disabled: paginationPage === 0,
|
|
461
474
|
onClick: () => handlePageChange(paginationPage - 1),
|
|
462
475
|
"aria-label": "\u041F\u0440\u0435\u0434\u044B\u0434\u0443\u0449\u0430\u044F \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0430",
|
|
463
|
-
children: /* @__PURE__ */
|
|
476
|
+
children: /* @__PURE__ */ jsx13(PrevIcon_default, {})
|
|
464
477
|
}
|
|
465
478
|
),
|
|
466
|
-
/* @__PURE__ */
|
|
467
|
-
/* @__PURE__ */
|
|
479
|
+
/* @__PURE__ */ jsx13("div", { className: "ndt-buttons-num", children: renderPageNumbers() }),
|
|
480
|
+
/* @__PURE__ */ jsx13(
|
|
468
481
|
"button",
|
|
469
482
|
{
|
|
470
483
|
disabled: paginationPage >= totalPages - 1,
|
|
471
484
|
onClick: () => handlePageChange(paginationPage + 1),
|
|
472
485
|
"aria-label": "\u0421\u043B\u0435\u0434\u0443\u044E\u0449\u0430\u044F \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0430",
|
|
473
|
-
children: /* @__PURE__ */
|
|
486
|
+
children: /* @__PURE__ */ jsx13(NextIcon_default, {})
|
|
474
487
|
}
|
|
475
488
|
),
|
|
476
|
-
/* @__PURE__ */
|
|
489
|
+
/* @__PURE__ */ jsx13(
|
|
477
490
|
"button",
|
|
478
491
|
{
|
|
479
492
|
disabled: paginationPage >= totalPages - 1,
|
|
480
493
|
onClick: () => handlePageChange(totalPages - 1),
|
|
481
494
|
"aria-label": "\u041F\u043E\u0441\u043B\u0435\u0434\u043D\u044F\u044F \u0441\u0442\u0440\u0430\u043D\u0438\u0446\u0430",
|
|
482
|
-
children: /* @__PURE__ */
|
|
495
|
+
children: /* @__PURE__ */ jsx13(LastIcon_default, {})
|
|
483
496
|
}
|
|
484
497
|
)
|
|
485
498
|
] })
|
|
@@ -543,7 +556,7 @@ function useDebouncedEffect(callback, deps, delay) {
|
|
|
543
556
|
|
|
544
557
|
// components/data-table/DataTable.tsx
|
|
545
558
|
import { v4 as uuidv4 } from "uuid";
|
|
546
|
-
import { jsx as
|
|
559
|
+
import { jsx as jsx14, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
547
560
|
var DataTable = forwardRef(({
|
|
548
561
|
tableData,
|
|
549
562
|
columns,
|
|
@@ -668,8 +681,8 @@ var DataTable = forwardRef(({
|
|
|
668
681
|
getCurrentData: () => displayData,
|
|
669
682
|
getSelectedData: () => processedData.filter((row) => typeof row.id !== "undefined" && selectedRows.has(row.id))
|
|
670
683
|
}), [processedData, displayData, selectedRows]);
|
|
671
|
-
return /* @__PURE__ */
|
|
672
|
-
/* @__PURE__ */
|
|
684
|
+
return /* @__PURE__ */ jsx14("div", { className: "ndt-table-container", children: /* @__PURE__ */ jsxs5("div", { className: "ndt-table", children: [
|
|
685
|
+
/* @__PURE__ */ jsx14(
|
|
673
686
|
TableHeader_default,
|
|
674
687
|
{
|
|
675
688
|
columns,
|
|
@@ -684,7 +697,7 @@ var DataTable = forwardRef(({
|
|
|
684
697
|
displayData: processedData
|
|
685
698
|
}
|
|
686
699
|
),
|
|
687
|
-
loading ? loadingElement !== null ? loadingElement : /* @__PURE__ */
|
|
700
|
+
loading ? loadingElement !== null ? loadingElement : /* @__PURE__ */ jsx14("span", { style: { marginLeft: 10, fontWeight: "bold" }, children: "\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430 \u0434\u0430\u043D\u043D\u044B\u0445..." }) : /* @__PURE__ */ jsx14(
|
|
688
701
|
TableBody_default,
|
|
689
702
|
{
|
|
690
703
|
tableData: displayData,
|
|
@@ -703,7 +716,7 @@ var DataTable = forwardRef(({
|
|
|
703
716
|
paginationPage
|
|
704
717
|
}
|
|
705
718
|
),
|
|
706
|
-
isFooter && /* @__PURE__ */
|
|
719
|
+
isFooter && /* @__PURE__ */ jsx14(
|
|
707
720
|
TableFooter_default,
|
|
708
721
|
{
|
|
709
722
|
paginationCounts,
|
package/dist/styles.css
CHANGED
|
@@ -58,15 +58,18 @@
|
|
|
58
58
|
border: 1px solid #d9d9d9;
|
|
59
59
|
border-radius: 5px;
|
|
60
60
|
font-size: 14px;
|
|
61
|
-
padding: 4px
|
|
61
|
+
padding: 4px 20px 4px 6px;
|
|
62
62
|
height: 43px;
|
|
63
63
|
}
|
|
64
64
|
.ndt-table-container .ndt-table .ndt-table-columns .ndt-column .ndt-column-footer span {
|
|
65
65
|
position: absolute;
|
|
66
|
+
display: flex;
|
|
66
67
|
top: 0;
|
|
67
68
|
right: 0;
|
|
68
|
-
margin-top:
|
|
69
|
-
margin-right:
|
|
69
|
+
margin-top: 13.5px;
|
|
70
|
+
margin-right: 6px;
|
|
71
|
+
width: 12px;
|
|
72
|
+
height: 12px;
|
|
70
73
|
}
|
|
71
74
|
.ndt-table-container .ndt-table .ndt-table-body {
|
|
72
75
|
z-index: 1000;
|
package/dist/styles.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sourceRoot":"","sources":["../components/data-table/styles/data-table.scss"],"names":[],"mappings":";AACI;EACI;EACA;;AAEA;AAAA;EAEI;;AAGJ;AAAA;EAEI;;AAGJ;EACI;;AAEA;EACI;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAKZ;EACI;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAMhB;EACI;;AAEA;EACI;EACA;EACA;;AAGA;EACI;AACA;;AAGJ;EACI;AACA;EACA;AACA;;AAGJ;EACI;AACA;EACA;AACA;;AAGJ;EACI;AACA;;AAKJ;EACI;;AAGJ;EACI;;AAGJ;EAEI;;AAGJ;EACI;;AAEA;EAEI;;AAIR;EAEI;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAEA;EAGI;EACA;EACA;;AAIR;EACI;;AAMhB;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAGJ;EACI;;AAGI;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAIR;EACI;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAGJ;EAGI;;AAGJ;EACI;EACA;;AAIR;EACI;EACA;;AAEA;EACI;;AAEA;EACI;EACA;EACA;;;AAUhC;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAEA;EAGI;EACA;EACA;;AAIR;EACI;;AAEA;EAGI;EACA;EACA;;;AAKZ;EACI;EACA;EACA;EACA;EACA;;AAIA;EACI","file":"styles.css"}
|
|
1
|
+
{"version":3,"sourceRoot":"","sources":["../components/data-table/styles/data-table.scss"],"names":[],"mappings":";AACI;EACI;EACA;;AAEA;AAAA;EAEI;;AAGJ;AAAA;EAEI;;AAGJ;EACI;;AAEA;EACI;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAKZ;EACI;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAMhB;EACI;;AAEA;EACI;EACA;EACA;;AAGA;EACI;AACA;;AAGJ;EACI;AACA;EACA;AACA;;AAGJ;EACI;AACA;EACA;AACA;;AAGJ;EACI;AACA;;AAKJ;EACI;;AAGJ;EACI;;AAGJ;EAEI;;AAGJ;EACI;;AAEA;EAEI;;AAIR;EAEI;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAEA;EAGI;EACA;EACA;;AAIR;EACI;;AAMhB;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAGJ;EACI;;AAGI;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAIR;EACI;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAGJ;EAGI;;AAGJ;EACI;EACA;;AAIR;EACI;EACA;;AAEA;EACI;;AAEA;EACI;EACA;EACA;;;AAUhC;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAEA;EAGI;EACA;EACA;;AAIR;EACI;;AAEA;EAGI;EACA;EACA;;;AAKZ;EACI;EACA;EACA;EACA;EACA;;AAIA;EACI","file":"styles.css"}
|