elseware-ui 2.15.2 → 2.15.3
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.
|
@@ -9,9 +9,6 @@ export interface AdvancedTableProps<T> {
|
|
|
9
9
|
isSuccess?: boolean;
|
|
10
10
|
isError?: boolean;
|
|
11
11
|
error?: unknown;
|
|
12
|
-
onPageChange?: (page: number) => void;
|
|
13
|
-
onLimitChange?: (limit: number | "All") => void;
|
|
14
|
-
totalRecords?: number;
|
|
15
12
|
}
|
|
16
|
-
declare function AdvancedTable<T extends Record<string, any>>({ title, columns, data, defaultPageSize, pageSizeOptions, isLoading, isSuccess, isError, error,
|
|
13
|
+
declare function AdvancedTable<T extends Record<string, any>>({ title, columns, data, defaultPageSize, pageSizeOptions, isLoading, isSuccess, isError, error, }: AdvancedTableProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
17
14
|
export default AdvancedTable;
|
|
@@ -11,9 +11,6 @@ type AdvancedTableContentProps<T> = {
|
|
|
11
11
|
data: T[];
|
|
12
12
|
defaultPageSize?: number;
|
|
13
13
|
pageSizeOptions?: (number | "All")[];
|
|
14
|
-
totalRecords?: number;
|
|
15
|
-
onPageChange?: (page: number) => void;
|
|
16
|
-
onLimitChange?: (limit: number | "All") => void;
|
|
17
14
|
};
|
|
18
|
-
export declare function AdvancedTableContent<T extends Record<string, any>>({ title, columns, data, defaultPageSize, pageSizeOptions,
|
|
15
|
+
export declare function AdvancedTableContent<T extends Record<string, any>>({ title, columns, data, defaultPageSize, pageSizeOptions, }: AdvancedTableContentProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
19
16
|
export {};
|
package/build/index.es.js
CHANGED
|
@@ -7853,7 +7853,7 @@ function AsyncComponentWrapper(_a) {
|
|
|
7853
7853
|
}
|
|
7854
7854
|
|
|
7855
7855
|
function AdvancedTableContent(_a) {
|
|
7856
|
-
var title = _a.title, columns = _a.columns, data = _a.data, _b = _a.defaultPageSize, defaultPageSize = _b === void 0 ? 5 : _b, _c = _a.pageSizeOptions, pageSizeOptions = _c === void 0 ? [5, 10, 100, "All"] : _c
|
|
7856
|
+
var title = _a.title, columns = _a.columns, data = _a.data, _b = _a.defaultPageSize, defaultPageSize = _b === void 0 ? 5 : _b, _c = _a.pageSizeOptions, pageSizeOptions = _c === void 0 ? [5, 10, 100, "All"] : _c;
|
|
7857
7857
|
var _d = useState(""), searchQuery = _d[0], setSearchQuery = _d[1];
|
|
7858
7858
|
var _e = useState(null), sortKey = _e[0], setSortKey = _e[1];
|
|
7859
7859
|
var _f = useState("asc"), sortOrder = _f[0], setSortOrder = _f[1];
|
|
@@ -7883,23 +7883,18 @@ function AdvancedTableContent(_a) {
|
|
|
7883
7883
|
return 0;
|
|
7884
7884
|
});
|
|
7885
7885
|
}, [filteredData, sortKey, sortOrder]);
|
|
7886
|
-
//
|
|
7887
|
-
var
|
|
7888
|
-
var
|
|
7889
|
-
var localPaginatedData = rowsPerPage === "All"
|
|
7886
|
+
// Pagination
|
|
7887
|
+
var totalPages = rowsPerPage === "All" ? 1 : Math.ceil(sortedData.length / rowsPerPage);
|
|
7888
|
+
var paginatedData = rowsPerPage === "All"
|
|
7890
7889
|
? sortedData
|
|
7891
7890
|
: sortedData.slice(currentPage * rowsPerPage, currentPage * rowsPerPage + rowsPerPage);
|
|
7892
|
-
var finalData = totalRecords ? data : localPaginatedData;
|
|
7893
|
-
// EVENTS
|
|
7894
7891
|
var handlePageChange = function (page) {
|
|
7895
7892
|
setCurrentPage(page);
|
|
7896
|
-
onPageChange && onPageChange(page);
|
|
7897
7893
|
};
|
|
7898
7894
|
var handlePageSizeChange = function (e) {
|
|
7899
7895
|
var value = e.target.value === "All" ? "All" : parseInt(e.target.value);
|
|
7900
7896
|
setRowsPerPage(value);
|
|
7901
7897
|
setCurrentPage(0);
|
|
7902
|
-
onLimitChange && onLimitChange(value);
|
|
7903
7898
|
};
|
|
7904
7899
|
var toggleSort = function (key) {
|
|
7905
7900
|
if (sortKey === key) {
|
|
@@ -7914,12 +7909,12 @@ function AdvancedTableContent(_a) {
|
|
|
7914
7909
|
"px-4 py-3 font-semibold text-gray-700 dark:text-gray-300": true,
|
|
7915
7910
|
"cursor-pointer select-none hover:bg-gray-200 dark:hover:bg-gray-700": col.sortable,
|
|
7916
7911
|
"bg-gray-300 dark:bg-gray-600": sortKey === col.key,
|
|
7917
|
-
}) }, { children: jsxs("div", __assign$1({ className: "flex items-center gap-1" }, { children: [col.header, col.sortable && sortKey === col.key && (jsx("span", __assign$1({ className: "text-xs" }, { children: sortOrder === "asc" ? "▲" : "▼" })))] })) }), i)); }) }) })), jsxs("tbody", __assign$1({ className: "divide-y divide-gray-200 dark:divide-gray-700" }, { children: [
|
|
7912
|
+
}) }, { children: jsxs("div", __assign$1({ className: "flex items-center gap-1" }, { children: [col.header, col.sortable && sortKey === col.key && (jsx("span", __assign$1({ className: "text-xs" }, { children: sortOrder === "asc" ? "▲" : "▼" })))] })) }), i)); }) }) })), jsxs("tbody", __assign$1({ className: "divide-y divide-gray-200 dark:divide-gray-700" }, { children: [paginatedData.map(function (row, rowIndex) { return (jsx("tr", __assign$1({ className: "hover:bg-gray-50 dark:hover:bg-gray-900 odd:eui-bg-sm even:eui-bg-md" }, { children: columns.map(function (col, colIndex) { return (jsx("td", __assign$1({ className: "px-4 py-1 text-gray-800 dark:text-gray-400" }, { children: col.render(row[col.key], row) }), colIndex)); }) }), rowIndex)); }), paginatedData.length === 0 && (jsx("tr", { children: jsx("td", __assign$1({ colSpan: columns.length, className: "px-4 py-4 text-center text-gray-500" }, { children: "No matching data found." })) }))] }))] })) })), jsxs("div", __assign$1({ className: "flex items-center justify-between mt-4" }, { children: [jsx("select", __assign$1({ value: rowsPerPage, onChange: handlePageSizeChange, className: "px-3 py-2 text-sm border border-gray-300 rounded-md dark:bg-gray-900 dark:text-gray-400 dark:border-gray-600" }, { children: pageSizeOptions.map(function (opt, idx) { return (jsxs("option", __assign$1({ value: opt }, { children: ["Show ", opt] }), idx)); }) })), rowsPerPage !== "All" && totalPages > 1 && (jsxs("div", __assign$1({ className: "flex justify-between items-center" }, { children: [jsx("button", __assign$1({ className: "px-3 py-1 rounded-full text-sm bg-gray-200 dark:bg-gray-700 disabled:opacity-40", disabled: currentPage === 0, onClick: function () { return handlePageChange(currentPage - 1); } }, { children: "<" })), jsxs("span", __assign$1({ className: "px-5 text-sm text-gray-700 dark:text-gray-400" }, { children: ["Page ", currentPage + 1, " of ", totalPages] })), jsx("button", __assign$1({ className: "px-3 py-1 rounded-full text-sm bg-gray-200 dark:bg-gray-700 disabled:opacity-40", disabled: currentPage === totalPages - 1, onClick: function () { return handlePageChange(currentPage + 1); } }, { children: ">" }))] })))] }))] })));
|
|
7918
7913
|
}
|
|
7919
7914
|
|
|
7920
7915
|
function AdvancedTable(_a) {
|
|
7921
|
-
var title = _a.title, columns = _a.columns, data = _a.data, _b = _a.defaultPageSize, defaultPageSize = _b === void 0 ? 5 : _b, _c = _a.pageSizeOptions, pageSizeOptions = _c === void 0 ? [5, 10, 100, "All"] : _c, isLoading = _a.isLoading, _d = _a.isSuccess, isSuccess = _d === void 0 ? true : _d, isError = _a.isError, error = _a.error
|
|
7922
|
-
return (jsx("div", { children: jsx(AsyncComponentWrapper, __assign$1({ isLoading: isLoading, isSuccess: isSuccess, isError: isError, error: error }, { children: jsx(AdvancedTableContent, { title: title, columns: columns, data: data, defaultPageSize: defaultPageSize, pageSizeOptions: pageSizeOptions
|
|
7916
|
+
var title = _a.title, columns = _a.columns, data = _a.data, _b = _a.defaultPageSize, defaultPageSize = _b === void 0 ? 5 : _b, _c = _a.pageSizeOptions, pageSizeOptions = _c === void 0 ? [5, 10, 100, "All"] : _c, isLoading = _a.isLoading, _d = _a.isSuccess, isSuccess = _d === void 0 ? true : _d, isError = _a.isError, error = _a.error;
|
|
7917
|
+
return (jsx("div", { children: jsx(AsyncComponentWrapper, __assign$1({ isLoading: isLoading, isSuccess: isSuccess, isError: isError, error: error }, { children: jsx(AdvancedTableContent, { title: title, columns: columns, data: data, defaultPageSize: defaultPageSize, pageSizeOptions: pageSizeOptions }) })) }));
|
|
7923
7918
|
}
|
|
7924
7919
|
|
|
7925
7920
|
var shapes$3 = {
|
package/build/index.js
CHANGED
|
@@ -7880,7 +7880,7 @@ function AsyncComponentWrapper(_a) {
|
|
|
7880
7880
|
}
|
|
7881
7881
|
|
|
7882
7882
|
function AdvancedTableContent(_a) {
|
|
7883
|
-
var title = _a.title, columns = _a.columns, data = _a.data, _b = _a.defaultPageSize, defaultPageSize = _b === void 0 ? 5 : _b, _c = _a.pageSizeOptions, pageSizeOptions = _c === void 0 ? [5, 10, 100, "All"] : _c
|
|
7883
|
+
var title = _a.title, columns = _a.columns, data = _a.data, _b = _a.defaultPageSize, defaultPageSize = _b === void 0 ? 5 : _b, _c = _a.pageSizeOptions, pageSizeOptions = _c === void 0 ? [5, 10, 100, "All"] : _c;
|
|
7884
7884
|
var _d = React.useState(""), searchQuery = _d[0], setSearchQuery = _d[1];
|
|
7885
7885
|
var _e = React.useState(null), sortKey = _e[0], setSortKey = _e[1];
|
|
7886
7886
|
var _f = React.useState("asc"), sortOrder = _f[0], setSortOrder = _f[1];
|
|
@@ -7910,23 +7910,18 @@ function AdvancedTableContent(_a) {
|
|
|
7910
7910
|
return 0;
|
|
7911
7911
|
});
|
|
7912
7912
|
}, [filteredData, sortKey, sortOrder]);
|
|
7913
|
-
//
|
|
7914
|
-
var
|
|
7915
|
-
var
|
|
7916
|
-
var localPaginatedData = rowsPerPage === "All"
|
|
7913
|
+
// Pagination
|
|
7914
|
+
var totalPages = rowsPerPage === "All" ? 1 : Math.ceil(sortedData.length / rowsPerPage);
|
|
7915
|
+
var paginatedData = rowsPerPage === "All"
|
|
7917
7916
|
? sortedData
|
|
7918
7917
|
: sortedData.slice(currentPage * rowsPerPage, currentPage * rowsPerPage + rowsPerPage);
|
|
7919
|
-
var finalData = totalRecords ? data : localPaginatedData;
|
|
7920
|
-
// EVENTS
|
|
7921
7918
|
var handlePageChange = function (page) {
|
|
7922
7919
|
setCurrentPage(page);
|
|
7923
|
-
onPageChange && onPageChange(page);
|
|
7924
7920
|
};
|
|
7925
7921
|
var handlePageSizeChange = function (e) {
|
|
7926
7922
|
var value = e.target.value === "All" ? "All" : parseInt(e.target.value);
|
|
7927
7923
|
setRowsPerPage(value);
|
|
7928
7924
|
setCurrentPage(0);
|
|
7929
|
-
onLimitChange && onLimitChange(value);
|
|
7930
7925
|
};
|
|
7931
7926
|
var toggleSort = function (key) {
|
|
7932
7927
|
if (sortKey === key) {
|
|
@@ -7941,12 +7936,12 @@ function AdvancedTableContent(_a) {
|
|
|
7941
7936
|
"px-4 py-3 font-semibold text-gray-700 dark:text-gray-300": true,
|
|
7942
7937
|
"cursor-pointer select-none hover:bg-gray-200 dark:hover:bg-gray-700": col.sortable,
|
|
7943
7938
|
"bg-gray-300 dark:bg-gray-600": sortKey === col.key,
|
|
7944
|
-
}) }, { children: jsxRuntime.jsxs("div", __assign$1({ className: "flex items-center gap-1" }, { children: [col.header, col.sortable && sortKey === col.key && (jsxRuntime.jsx("span", __assign$1({ className: "text-xs" }, { children: sortOrder === "asc" ? "▲" : "▼" })))] })) }), i)); }) }) })), jsxRuntime.jsxs("tbody", __assign$1({ className: "divide-y divide-gray-200 dark:divide-gray-700" }, { children: [
|
|
7939
|
+
}) }, { children: jsxRuntime.jsxs("div", __assign$1({ className: "flex items-center gap-1" }, { children: [col.header, col.sortable && sortKey === col.key && (jsxRuntime.jsx("span", __assign$1({ className: "text-xs" }, { children: sortOrder === "asc" ? "▲" : "▼" })))] })) }), i)); }) }) })), jsxRuntime.jsxs("tbody", __assign$1({ className: "divide-y divide-gray-200 dark:divide-gray-700" }, { children: [paginatedData.map(function (row, rowIndex) { return (jsxRuntime.jsx("tr", __assign$1({ className: "hover:bg-gray-50 dark:hover:bg-gray-900 odd:eui-bg-sm even:eui-bg-md" }, { children: columns.map(function (col, colIndex) { return (jsxRuntime.jsx("td", __assign$1({ className: "px-4 py-1 text-gray-800 dark:text-gray-400" }, { children: col.render(row[col.key], row) }), colIndex)); }) }), rowIndex)); }), paginatedData.length === 0 && (jsxRuntime.jsx("tr", { children: jsxRuntime.jsx("td", __assign$1({ colSpan: columns.length, className: "px-4 py-4 text-center text-gray-500" }, { children: "No matching data found." })) }))] }))] })) })), jsxRuntime.jsxs("div", __assign$1({ className: "flex items-center justify-between mt-4" }, { children: [jsxRuntime.jsx("select", __assign$1({ value: rowsPerPage, onChange: handlePageSizeChange, className: "px-3 py-2 text-sm border border-gray-300 rounded-md dark:bg-gray-900 dark:text-gray-400 dark:border-gray-600" }, { children: pageSizeOptions.map(function (opt, idx) { return (jsxRuntime.jsxs("option", __assign$1({ value: opt }, { children: ["Show ", opt] }), idx)); }) })), rowsPerPage !== "All" && totalPages > 1 && (jsxRuntime.jsxs("div", __assign$1({ className: "flex justify-between items-center" }, { children: [jsxRuntime.jsx("button", __assign$1({ className: "px-3 py-1 rounded-full text-sm bg-gray-200 dark:bg-gray-700 disabled:opacity-40", disabled: currentPage === 0, onClick: function () { return handlePageChange(currentPage - 1); } }, { children: "<" })), jsxRuntime.jsxs("span", __assign$1({ className: "px-5 text-sm text-gray-700 dark:text-gray-400" }, { children: ["Page ", currentPage + 1, " of ", totalPages] })), jsxRuntime.jsx("button", __assign$1({ className: "px-3 py-1 rounded-full text-sm bg-gray-200 dark:bg-gray-700 disabled:opacity-40", disabled: currentPage === totalPages - 1, onClick: function () { return handlePageChange(currentPage + 1); } }, { children: ">" }))] })))] }))] })));
|
|
7945
7940
|
}
|
|
7946
7941
|
|
|
7947
7942
|
function AdvancedTable(_a) {
|
|
7948
|
-
var title = _a.title, columns = _a.columns, data = _a.data, _b = _a.defaultPageSize, defaultPageSize = _b === void 0 ? 5 : _b, _c = _a.pageSizeOptions, pageSizeOptions = _c === void 0 ? [5, 10, 100, "All"] : _c, isLoading = _a.isLoading, _d = _a.isSuccess, isSuccess = _d === void 0 ? true : _d, isError = _a.isError, error = _a.error
|
|
7949
|
-
return (jsxRuntime.jsx("div", { children: jsxRuntime.jsx(AsyncComponentWrapper, __assign$1({ isLoading: isLoading, isSuccess: isSuccess, isError: isError, error: error }, { children: jsxRuntime.jsx(AdvancedTableContent, { title: title, columns: columns, data: data, defaultPageSize: defaultPageSize, pageSizeOptions: pageSizeOptions
|
|
7943
|
+
var title = _a.title, columns = _a.columns, data = _a.data, _b = _a.defaultPageSize, defaultPageSize = _b === void 0 ? 5 : _b, _c = _a.pageSizeOptions, pageSizeOptions = _c === void 0 ? [5, 10, 100, "All"] : _c, isLoading = _a.isLoading, _d = _a.isSuccess, isSuccess = _d === void 0 ? true : _d, isError = _a.isError, error = _a.error;
|
|
7944
|
+
return (jsxRuntime.jsx("div", { children: jsxRuntime.jsx(AsyncComponentWrapper, __assign$1({ isLoading: isLoading, isSuccess: isSuccess, isError: isError, error: error }, { children: jsxRuntime.jsx(AdvancedTableContent, { title: title, columns: columns, data: data, defaultPageSize: defaultPageSize, pageSizeOptions: pageSizeOptions }) })) }));
|
|
7950
7945
|
}
|
|
7951
7946
|
|
|
7952
7947
|
var shapes$3 = {
|