pixelize-design-library 2.3.1-beta.11 → 2.3.1-beta.12

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.
@@ -78,30 +78,30 @@ var Button_1 = __importDefault(require("../Button/Button"));
78
78
  var lucide_react_1 = require("lucide-react");
79
79
  var MotionBox = (0, framer_motion_1.motion)(react_2.Box);
80
80
  function Table(_a) {
81
- var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13;
82
- var data = _a.data, columns = _a.columns, onSelection = _a.onSelection, isLoading = _a.isLoading, _14 = _a.isCheckbox, isCheckbox = _14 === void 0 ? false : _14, headerBgColor = _a.headerBgColor, freezedBgColor = _a.freezedBgColor, headerTextColor = _a.headerTextColor, freezedTextColor = _a.freezedTextColor, tableBorderColor = _a.tableBorderColor, _15 = _a.noBorders, noBorders = _15 === void 0 ? false : _15, _16 = _a.isPagination, isPagination = _16 === void 0 ? true : _16, onRowClick = _a.onRowClick, selections = _a.selections, _17 = _a.isActionFreeze, isActionFreeze = _17 === void 0 ? true : _17, _18 = _a.preferences, preferences = _18 === void 0 ? {
81
+ var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12;
82
+ var data = _a.data, columns = _a.columns, onSelection = _a.onSelection, isLoading = _a.isLoading, _13 = _a.isCheckbox, isCheckbox = _13 === void 0 ? false : _13, headerBgColor = _a.headerBgColor, freezedBgColor = _a.freezedBgColor, headerTextColor = _a.headerTextColor, freezedTextColor = _a.freezedTextColor, tableBorderColor = _a.tableBorderColor, _14 = _a.noBorders, noBorders = _14 === void 0 ? false : _14, _15 = _a.isPagination, isPagination = _15 === void 0 ? true : _15, onRowClick = _a.onRowClick, selections = _a.selections, _16 = _a.isActionFreeze, isActionFreeze = _16 === void 0 ? true : _16, _17 = _a.preferences, preferences = _17 === void 0 ? {
83
83
  url: "",
84
84
  token: "",
85
85
  key: "",
86
86
  name: "",
87
87
  page: "",
88
88
  orgId: "",
89
- } : _18, _19 = _a.paginationMode, paginationMode = _19 === void 0 ? "client" : _19, _20 = _a.infiniteScroll, infiniteScroll = _20 === void 0 ? false : _20, hasMore = _a.hasMore, _21 = _a.isLoadingMore, isLoadingMore = _21 === void 0 ? false : _21, _22 = _a.groupLoadMore, groupLoadMore = _22 === void 0 ? false : _22, _23 = _a.loadMoreText, loadMoreText = _23 === void 0 ? "Load more" : _23, _24 = _a.loadMorePosition, loadMorePosition = _24 === void 0 ? "top" : _24, loadMoreChunkSize = _a.loadMoreChunkSize, _25 = _a.noOfRowsPerPage, noOfRowsPerPage = _25 === void 0 ? 50 : _25, _26 = _a.totalRecords, totalRecords = _26 === void 0 ? 0 : _26, onPagination = _a.onPagination, _27 = _a.isTableSettings, isTableSettings = _27 === void 0 ? false : _27, headerActions = _a.headerActions, onGlobalSearch = _a.onGlobalSearch, onNoOfRowsPerPageChange = _a.onNoOfRowsPerPageChange, paginationSelectOptions = _a.paginationSelectOptions, tableMaxHeight = _a.tableMaxHeight, minVisibleRows = _a.minVisibleRows, maxVisibleRows = _a.maxVisibleRows, autoFitViewport = _a.autoFitViewport, tableSettings = _a.tableSettings, filterSidebar = _a.filterSidebar, loadingSkeletonRows = _a.loadingSkeletonRows, defaultVisibleColumns = _a.defaultVisibleColumns, _28 = _a.density, density = _28 === void 0 ? "normal" : _28, stripe = _a.stripe, groupColors = _a.groupColors, onAddItem = _a.onAddItem, emptyState = _a.emptyState;
89
+ } : _17, _18 = _a.paginationMode, paginationMode = _18 === void 0 ? "client" : _18, _19 = _a.infiniteScroll, infiniteScroll = _19 === void 0 ? false : _19, hasMore = _a.hasMore, _20 = _a.isLoadingMore, isLoadingMore = _20 === void 0 ? false : _20, _21 = _a.groupLoadMore, groupLoadMore = _21 === void 0 ? false : _21, _22 = _a.loadMoreText, loadMoreText = _22 === void 0 ? "Load more" : _22, _23 = _a.loadMorePosition, loadMorePosition = _23 === void 0 ? "top" : _23, loadMoreChunkSize = _a.loadMoreChunkSize, _24 = _a.noOfRowsPerPage, noOfRowsPerPage = _24 === void 0 ? 50 : _24, _25 = _a.totalRecords, totalRecords = _25 === void 0 ? 0 : _25, onPagination = _a.onPagination, _26 = _a.isTableSettings, isTableSettings = _26 === void 0 ? false : _26, headerActions = _a.headerActions, onGlobalSearch = _a.onGlobalSearch, onNoOfRowsPerPageChange = _a.onNoOfRowsPerPageChange, paginationSelectOptions = _a.paginationSelectOptions, tableMaxHeight = _a.tableMaxHeight, minVisibleRows = _a.minVisibleRows, maxVisibleRows = _a.maxVisibleRows, autoFitViewport = _a.autoFitViewport, tableSettings = _a.tableSettings, filterSidebar = _a.filterSidebar, loadingSkeletonRows = _a.loadingSkeletonRows, defaultVisibleColumns = _a.defaultVisibleColumns, _27 = _a.density, density = _27 === void 0 ? "normal" : _27, stripe = _a.stripe, groupColors = _a.groupColors, onAddItem = _a.onAddItem, emptyState = _a.emptyState;
90
90
  var theme = (0, useCustomTheme_1.useCustomTheme)();
91
- var _29 = (0, react_1.useState)({}), columnsSearch = _29[0], setColumnsSearch = _29[1];
91
+ var _28 = (0, react_1.useState)({}), columnsSearch = _28[0], setColumnsSearch = _28[1];
92
92
  var tableContainerRef = (0, react_1.useRef)(null);
93
- var _30 = (0, react_2.useDisclosure)(), isFilterModalOpen = _30.isOpen, onFilterModalOpen = _30.onOpen, onFilterModalClose = _30.onClose;
93
+ var _29 = (0, react_2.useDisclosure)(), isFilterModalOpen = _29.isOpen, onFilterModalOpen = _29.onOpen, onFilterModalClose = _29.onClose;
94
94
  var filterMode = (_b = filterSidebar === null || filterSidebar === void 0 ? void 0 : filterSidebar.filterMode) !== null && _b !== void 0 ? _b : "sidebar";
95
- var _31 = (0, react_1.useState)(500), viewportAvailableH = _31[0], setViewportAvailableH = _31[1];
95
+ var _30 = (0, react_1.useState)(500), viewportAvailableH = _30[0], setViewportAvailableH = _30[1];
96
96
  var isServerPagination = paginationMode === "server";
97
- var _32 = (0, usePreferences_1.useGetPreferences)({
97
+ var _31 = (0, usePreferences_1.useGetPreferences)({
98
98
  baseUrl: preferences.url,
99
99
  page: preferences.page,
100
100
  key: preferences.key,
101
101
  name: preferences.name,
102
102
  authToken: preferences.token,
103
103
  orgId: preferences.orgId,
104
- }), tablePreferencesData = _32.preferences, loading = _32.loading;
104
+ }), tablePreferencesData = _31.preferences, loading = _31.loading;
105
105
  var savePreferences = (0, usePreferences_1.useSavePreferences)({
106
106
  baseUrl: preferences.url,
107
107
  page: preferences.page,
@@ -119,7 +119,7 @@ function Table(_a) {
119
119
  }
120
120
  return {};
121
121
  }, [tablePreferencesData]);
122
- var _33 = (0, useTable_1.default)({
122
+ var _32 = (0, useTable_1.default)({
123
123
  tableBorderColor: tableBorderColor,
124
124
  data: data,
125
125
  isPagination: isPagination,
@@ -133,17 +133,17 @@ function Table(_a) {
133
133
  isServerPagination: isServerPagination,
134
134
  onNoOfRowsPerPageChange: onNoOfRowsPerPageChange,
135
135
  defaultVisibleColumns: defaultVisibleColumns,
136
- }), tableData = _33.tableData, isContent = _33.isContent, isLink = _33.isLink, headerRefs = _33.headerRefs, columnWidths = _33.columnWidths, handleSort = _33.handleSort, handleCheckbox = _33.handleCheckbox, filteredData = _33.filteredData, startRow = _33.startRow, endRow = _33.endRow, selection = _33.selection, columnsSort = _33.columnsSort, currentPage = _33.currentPage, pages = _33.pages, rowsPerPage = _33.rowsPerPage, handlePageSizeChange = _33.handlePageSizeChange, setCurrentPage = _33.setCurrentPage, columnsList = _33.columnsList, handleColumnPreferences = _33.handleColumnPreferences, isSelecting = _33.isSelecting, selectAllRowsRef = _33.selectAllRowsRef;
136
+ }), tableData = _32.tableData, isContent = _32.isContent, isLink = _32.isLink, headerRefs = _32.headerRefs, columnWidths = _32.columnWidths, handleSort = _32.handleSort, handleCheckbox = _32.handleCheckbox, filteredData = _32.filteredData, startRow = _32.startRow, endRow = _32.endRow, selection = _32.selection, columnsSort = _32.columnsSort, currentPage = _32.currentPage, pages = _32.pages, rowsPerPage = _32.rowsPerPage, handlePageSizeChange = _32.handlePageSizeChange, setCurrentPage = _32.setCurrentPage, columnsList = _32.columnsList, handleColumnPreferences = _32.handleColumnPreferences, isSelecting = _32.isSelecting, selectAllRowsRef = _32.selectAllRowsRef;
137
137
  // Density + grouping are managed here so the Table Settings tabs can change +
138
138
  // persist them (seeded from the prop / saved preferences when they load).
139
- var _34 = (0, react_1.useState)(density), densityState = _34[0], setDensityState = _34[1];
139
+ var _33 = (0, react_1.useState)(density), densityState = _33[0], setDensityState = _33[1];
140
140
  // Grouping is chosen by the user in Table Settings > Group and persisted to
141
141
  // preferences (`json.groupBy`); there is no `groupBy` prop.
142
- var _35 = (0, react_1.useState)(undefined), groupByState = _35[0], setGroupByState = _35[1];
142
+ var _34 = (0, react_1.useState)(undefined), groupByState = _34[0], setGroupByState = _34[1];
143
143
  // Grouped "Load more" accumulates pages here so loading more ADDS rows to the
144
144
  // groups (server pagination replaces `data` each fetch). Reset on fresh loads
145
145
  // (search / filter / sort / page-size). Only used in grouped + groupLoadMore mode.
146
- var _36 = (0, react_1.useState)([]), accumulatedRows = _36[0], setAccumulatedRows = _36[1];
146
+ var _35 = (0, react_1.useState)([]), accumulatedRows = _35[0], setAccumulatedRows = _35[1];
147
147
  var pendingLoadMoreRef = (0, react_1.useRef)(false);
148
148
  // Pages loaded so far (1 = the initial page). The next page is derived from this
149
149
  // counter — NOT from the deduped row count — so overlapping rows across pages
@@ -486,13 +486,13 @@ function Table(_a) {
486
486
  },
487
487
  } },
488
488
  react_1.default.createElement(react_3.Thead, { position: "sticky", top: 0, zIndex: 4, bg: (_2 = (_1 = (_0 = theme.colors.table) === null || _0 === void 0 ? void 0 : _0.hover) === null || _1 === void 0 ? void 0 : _1[200]) !== null && _2 !== void 0 ? _2 : (_3 = theme.colors.secondary) === null || _3 === void 0 ? void 0 : _3[50] },
489
- react_1.default.createElement(TableHeader_1.default, { columns: columnsList, isCheckbox: isCheckbox, headerBgColor: headerBgColor !== null && headerBgColor !== void 0 ? headerBgColor : theme.colors.backgroundColor.muted, headerTextColor: headerTextColor !== null && headerTextColor !== void 0 ? headerTextColor : (_4 = theme.colors) === null || _4 === void 0 ? void 0 : _4.gray[600], freezedBgColor: freezedBgColor !== null && freezedBgColor !== void 0 ? freezedBgColor : theme.colors.backgroundColor.secondary, freezedTextColor: freezedTextColor !== null && freezedTextColor !== void 0 ? freezedTextColor : (_5 = theme.colors) === null || _5 === void 0 ? void 0 : _5.gray[600], handleSort: handleSort, headerRefs: headerRefs, columnWidths: columnWidths, columnsSort: columnsSort, noBorders: noBorders, handleCheckbox: handleCheckbox, isLoading: isTableLoading, checked: headerChecked, isContent: isContent, isLink: isLink, isActionFreeze: isActionFreeze, setColumnsSearch: setColumnsSearch, columnsSearch: columnsSearch, isSelecting: isSelecting })),
489
+ react_1.default.createElement(TableHeader_1.default, { columns: columnsList, isCheckbox: isCheckbox, headerBgColor: headerBgColor !== null && headerBgColor !== void 0 ? headerBgColor : theme.colors.backgroundColor.muted, freezedBgColor: freezedBgColor !== null && freezedBgColor !== void 0 ? freezedBgColor : theme.colors.backgroundColor.secondary, freezedTextColor: freezedTextColor !== null && freezedTextColor !== void 0 ? freezedTextColor : (_4 = theme.colors) === null || _4 === void 0 ? void 0 : _4.gray[600], handleSort: handleSort, headerRefs: headerRefs, columnWidths: columnWidths, columnsSort: columnsSort, noBorders: noBorders, handleCheckbox: handleCheckbox, isLoading: isTableLoading, checked: headerChecked, isContent: isContent, isLink: isLink, isActionFreeze: isActionFreeze, setColumnsSearch: setColumnsSearch, columnsSearch: columnsSearch, isSelecting: isSelecting })),
490
490
  react_1.default.createElement(react_3.Tbody, null,
491
- react_1.default.createElement(TableBody_1.default, { data: isGrouped ? groupedSource : _filteredData, groups: renderGroups, onAddItem: onAddItem, columns: columnsList, startRow: isGrouped ? 0 : startRow, endRow: endRow, scrollContainerRef: tableContainerRef, isCheckbox: isCheckbox, columnWidths: columnWidths, noBorders: noBorders, freezedBgColor: freezedBgColor !== null && freezedBgColor !== void 0 ? freezedBgColor : theme.colors.backgroundColor.secondary, freezedTextColor: freezedTextColor !== null && freezedTextColor !== void 0 ? freezedTextColor : (_6 = theme.colors) === null || _6 === void 0 ? void 0 : _6.gray[600], handleCheckbox: handleCheckbox, selections: selection, isLoading: isTableLoading, loadingSkeletonRows: loadingSkeletonRows, onRowClick: onRowClick, isContent: isContent, isLink: isLink, isActionFreeze: isActionFreeze, density: densityState, stripe: stripe, emptyState: emptyState }))),
491
+ react_1.default.createElement(TableBody_1.default, { data: isGrouped ? groupedSource : _filteredData, groups: renderGroups, onAddItem: onAddItem, columns: columnsList, startRow: isGrouped ? 0 : startRow, endRow: endRow, scrollContainerRef: tableContainerRef, isCheckbox: isCheckbox, columnWidths: columnWidths, noBorders: noBorders, freezedBgColor: freezedBgColor !== null && freezedBgColor !== void 0 ? freezedBgColor : theme.colors.backgroundColor.secondary, freezedTextColor: freezedTextColor !== null && freezedTextColor !== void 0 ? freezedTextColor : (_5 = theme.colors) === null || _5 === void 0 ? void 0 : _5.gray[600], handleCheckbox: handleCheckbox, selections: selection, isLoading: isTableLoading, loadingSkeletonRows: loadingSkeletonRows, onRowClick: onRowClick, isContent: isContent, isLink: isLink, isActionFreeze: isActionFreeze, density: densityState, stripe: stripe, emptyState: emptyState }))),
492
492
  canInfinite && isLoadingMore && (react_1.default.createElement(react_2.Flex, { justify: "center", align: "center", py: 3, gap: 2 },
493
- react_1.default.createElement(react_2.Spinner, { size: "sm", color: (_8 = (_7 = theme.colors) === null || _7 === void 0 ? void 0 : _7.primary) === null || _8 === void 0 ? void 0 : _8[500] }),
494
- react_1.default.createElement(react_2.Box, { fontSize: "0.75rem", color: (_10 = (_9 = theme.colors) === null || _9 === void 0 ? void 0 : _9.text) === null || _10 === void 0 ? void 0 : _10[500] }, "Loading more\u2026")))),
495
- groupLoadMoreActive && loadMorePosition === "bottom" && (groupLoadMoreCaption || canGroupLoadMore) && (react_1.default.createElement(react_2.Flex, { justify: "center", align: "center", gap: 3, py: 3, borderTop: "0.063rem solid ".concat((_11 = theme.colors.border) === null || _11 === void 0 ? void 0 : _11[500]) },
496
- groupLoadMoreCaption && (react_1.default.createElement(react_2.Box, { fontSize: "0.75rem", color: (_13 = (_12 = theme.colors) === null || _12 === void 0 ? void 0 : _12.text) === null || _13 === void 0 ? void 0 : _13[500] }, groupLoadMoreCaption)),
493
+ react_1.default.createElement(react_2.Spinner, { size: "sm", color: (_7 = (_6 = theme.colors) === null || _6 === void 0 ? void 0 : _6.primary) === null || _7 === void 0 ? void 0 : _7[500] }),
494
+ react_1.default.createElement(react_2.Box, { fontSize: "0.75rem", color: (_9 = (_8 = theme.colors) === null || _8 === void 0 ? void 0 : _8.text) === null || _9 === void 0 ? void 0 : _9[500] }, "Loading more\u2026")))),
495
+ groupLoadMoreActive && loadMorePosition === "bottom" && (groupLoadMoreCaption || canGroupLoadMore) && (react_1.default.createElement(react_2.Flex, { justify: "center", align: "center", gap: 3, py: 3, borderTop: "0.063rem solid ".concat((_10 = theme.colors.border) === null || _10 === void 0 ? void 0 : _10[500]) },
496
+ groupLoadMoreCaption && (react_1.default.createElement(react_2.Box, { fontSize: "0.75rem", color: (_12 = (_11 = theme.colors) === null || _11 === void 0 ? void 0 : _11.text) === null || _12 === void 0 ? void 0 : _12[500] }, groupLoadMoreCaption)),
497
497
  canGroupLoadMore && (react_1.default.createElement(Button_1.default, { size: "xs", variant: "outline", colorScheme: "gray", isLoading: isLoadingMore, loadingText: loadMoreText, onClick: handleGroupLoadMore, label: loadMoreText }))))))));
498
498
  }
@@ -123,7 +123,7 @@ export type ColumnSortingProps = {
123
123
  column: string | number;
124
124
  direction: "asc" | "desc" | "none";
125
125
  };
126
- export type TableHeaderPageProps = Pick<TableProps, "columns" | "isCheckbox" | "headerBgColor" | "headerTextColor" | "freezedBgColor" | "freezedTextColor" | "noBorders" | "isLoading" | "isActionFreeze"> & {
126
+ export type TableHeaderPageProps = Pick<TableProps, "columns" | "isCheckbox" | "headerBgColor" | "freezedBgColor" | "freezedTextColor" | "noBorders" | "isLoading" | "isActionFreeze"> & {
127
127
  handleSort: (label: string | number, type: "asc" | "desc" | "none") => void;
128
128
  activeHeader?: string | null;
129
129
  isPopoverOpen?: boolean;
@@ -172,7 +172,7 @@ export type TableFiltersProps = {
172
172
  columnsSearch: string;
173
173
  onClose: () => void;
174
174
  };
175
- export type ColumnHeaderProps = Pick<TableProps, "isCheckbox" | "headerBgColor" | "headerTextColor" | "freezedBgColor" | "freezedTextColor" | "noBorders"> & Pick<TableHeaderPageProps, "handleSort" | "columnsSort"> & {
175
+ export type ColumnHeaderProps = Pick<TableProps, "isCheckbox" | "headerBgColor" | "freezedBgColor" | "noBorders"> & Pick<TableHeaderPageProps, "handleSort" | "columnsSort"> & {
176
176
  header: TableHeaderProps;
177
177
  index: number;
178
178
  columnWidths: number[];
@@ -1,4 +1,4 @@
1
1
  import React from "react";
2
2
  import { TableHeaderPageProps } from "../TableProps";
3
- declare const _default: React.MemoExoticComponent<({ columns, isCheckbox, handleSort, headerRefs, columnWidths, columnsSort, headerBgColor, headerTextColor, freezedBgColor, freezedTextColor, noBorders, handleCheckbox, checked, isLoading, isContent, isLink, isActionFreeze, setColumnsSearch, columnsSearch, isSelecting, }: TableHeaderPageProps) => React.JSX.Element>;
3
+ declare const _default: React.MemoExoticComponent<({ columns, isCheckbox, handleSort, headerRefs, columnWidths, columnsSort, headerBgColor, freezedBgColor, freezedTextColor, noBorders, handleCheckbox, checked, isLoading, isContent, isLink, isActionFreeze, setColumnsSearch, columnsSearch, isSelecting, }: TableHeaderPageProps) => React.JSX.Element>;
4
4
  export default _default;
@@ -55,12 +55,12 @@ var TableFilters_1 = __importDefault(require("../filters/TableFilters"));
55
55
  var lucide_react_1 = require("lucide-react");
56
56
  var Checkbox_1 = __importDefault(require("../../Checkbox/Checkbox"));
57
57
  var TableHeader = function (_a) {
58
- var columns = _a.columns, isCheckbox = _a.isCheckbox, handleSort = _a.handleSort, headerRefs = _a.headerRefs, columnWidths = _a.columnWidths, columnsSort = _a.columnsSort, headerBgColor = _a.headerBgColor, headerTextColor = _a.headerTextColor, freezedBgColor = _a.freezedBgColor, freezedTextColor = _a.freezedTextColor, noBorders = _a.noBorders, handleCheckbox = _a.handleCheckbox, checked = _a.checked, isLoading = _a.isLoading, isContent = _a.isContent, isLink = _a.isLink, isActionFreeze = _a.isActionFreeze, setColumnsSearch = _a.setColumnsSearch, columnsSearch = _a.columnsSearch, isSelecting = _a.isSelecting;
58
+ var columns = _a.columns, isCheckbox = _a.isCheckbox, handleSort = _a.handleSort, headerRefs = _a.headerRefs, columnWidths = _a.columnWidths, columnsSort = _a.columnsSort, headerBgColor = _a.headerBgColor, freezedBgColor = _a.freezedBgColor, freezedTextColor = _a.freezedTextColor, noBorders = _a.noBorders, handleCheckbox = _a.handleCheckbox, checked = _a.checked, isLoading = _a.isLoading, isContent = _a.isContent, isLink = _a.isLink, isActionFreeze = _a.isActionFreeze, setColumnsSearch = _a.setColumnsSearch, columnsSearch = _a.columnsSearch, isSelecting = _a.isSelecting;
59
59
  var theme = (0, useCustomTheme_1.useCustomTheme)();
60
60
  var _b = (0, react_2.useState)(null), openFilterId = _b[0], setOpenFilterId = _b[1];
61
61
  var RenderCheckbox = (0, react_2.useCallback)(function () {
62
- var _a, _b, _c, _d, _e;
63
- return (react_2.default.createElement(react_1.Th, { w: 6, fontSize: 14, fontWeight: 600, color: freezedTextColor, textTransform: "capitalize", backgroundColor: (_b = (_a = theme.colors) === null || _a === void 0 ? void 0 : _a.secondary) === null || _b === void 0 ? void 0 : _b[50], position: "sticky", className: "columns sticky-columns", left: "0px", zIndex: 9, borderBottom: noBorders ? "none" : "0.063rem solid ".concat((_c = theme.colors) === null || _c === void 0 ? void 0 : _c.gray[300]) }, isSelecting ? (react_2.default.createElement(react_1.Spinner, { size: "sm", color: (_e = (_d = theme.colors) === null || _d === void 0 ? void 0 : _d.primary) === null || _e === void 0 ? void 0 : _e[500] })) : (react_2.default.createElement(Checkbox_1.default, { "aria-label": "Select all rows", variant: "outline", onChange: function () { return handleCheckbox(0); }, isChecked: isLoading ? false : checked === true, isIndeterminate: checked === "indeterminate" }))));
62
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j;
63
+ return (react_2.default.createElement(react_1.Th, { w: 6, fontSize: 14, fontWeight: 600, color: freezedTextColor, textTransform: "capitalize", backgroundColor: (_d = (_c = (_b = (_a = theme.colors) === null || _a === void 0 ? void 0 : _a.table) === null || _b === void 0 ? void 0 : _b.hover) === null || _c === void 0 ? void 0 : _c[200]) !== null && _d !== void 0 ? _d : (_f = (_e = theme.colors) === null || _e === void 0 ? void 0 : _e.secondary) === null || _f === void 0 ? void 0 : _f[50], position: "sticky", className: "columns sticky-columns", left: "0px", zIndex: 9, borderBottom: noBorders ? "none" : "0.063rem solid ".concat((_g = theme.colors) === null || _g === void 0 ? void 0 : _g.gray[300]) }, isSelecting ? (react_2.default.createElement(react_1.Spinner, { size: "sm", color: (_j = (_h = theme.colors) === null || _h === void 0 ? void 0 : _h.primary) === null || _j === void 0 ? void 0 : _j[500] })) : (react_2.default.createElement(Checkbox_1.default, { "aria-label": "Select all rows", variant: "outline", onChange: function () { return handleCheckbox(0); }, isChecked: isLoading ? false : checked === true, isIndeterminate: checked === "indeterminate" }))));
64
64
  }, [
65
65
  checked,
66
66
  freezedTextColor,
@@ -75,8 +75,8 @@ var TableHeader = function (_a) {
75
75
  return (react_2.default.createElement(react_1.Th, { w: 6, minW: "35px", p: 0, backgroundColor: (_b = (_a = theme.colors) === null || _a === void 0 ? void 0 : _a.secondary) === null || _b === void 0 ? void 0 : _b[50], borderBottom: noBorders ? "none" : "0.063rem solid ".concat((_c = theme.colors) === null || _c === void 0 ? void 0 : _c.gray[300]), position: "sticky", className: "columns sticky-columns", left: "0px", zIndex: 1 }));
76
76
  }, [noBorders, theme.colors]);
77
77
  var RenderView = (0, react_2.useCallback)(function () {
78
- var _a, _b, _c;
79
- return (react_2.default.createElement(react_1.Th, { w: 2, p: 0, minW: "2.065rem", backgroundColor: (_b = (_a = theme.colors) === null || _a === void 0 ? void 0 : _a.secondary) === null || _b === void 0 ? void 0 : _b[50], borderBottom: noBorders ? "none" : "0.063rem solid ".concat((_c = theme.colors) === null || _c === void 0 ? void 0 : _c.gray[300]), position: isActionFreeze ? "sticky" : "relative", className: "columns sticky-columns", right: "0px", zIndex: 1 }));
78
+ var _a, _b, _c, _d, _e, _f, _g;
79
+ return (react_2.default.createElement(react_1.Th, { w: 2, p: 0, minW: "2.065rem", backgroundColor: (_d = (_c = (_b = (_a = theme.colors) === null || _a === void 0 ? void 0 : _a.table) === null || _b === void 0 ? void 0 : _b.hover) === null || _c === void 0 ? void 0 : _c[200]) !== null && _d !== void 0 ? _d : (_f = (_e = theme.colors) === null || _e === void 0 ? void 0 : _e.secondary) === null || _f === void 0 ? void 0 : _f[50], borderBottom: noBorders ? "none" : "0.063rem solid ".concat((_g = theme.colors) === null || _g === void 0 ? void 0 : _g.gray[300]), position: isActionFreeze ? "sticky" : "relative", className: "columns sticky-columns", right: "0px", zIndex: 1 }));
80
80
  }, [noBorders, theme.colors, isActionFreeze]);
81
81
  return (react_2.default.createElement(react_1.Tr, { pr: 0 },
82
82
  isContent && react_2.default.createElement(RenderConent, null),
@@ -84,7 +84,7 @@ var TableHeader = function (_a) {
84
84
  columns.map(function (header, index) {
85
85
  if (header === null || header === void 0 ? void 0 : header.isHidden)
86
86
  return null;
87
- return (react_2.default.createElement(ColumnHeader, { header: header, index: index, key: header.label, columnWidths: columnWidths, handleSort: handleSort, isCheckbox: isCheckbox, headerBgColor: headerBgColor, headerTextColor: headerTextColor, freezedBgColor: freezedBgColor, freezedTextColor: freezedTextColor, noBorders: noBorders, columnsSort: columnsSort, headerRefs: headerRefs, columnsSearch: columnsSearch, setColumnsSearch: setColumnsSearch, openFilterId: openFilterId, setOpenFilterId: setOpenFilterId }));
87
+ return (react_2.default.createElement(ColumnHeader, { header: header, index: index, key: header.label, columnWidths: columnWidths, handleSort: handleSort, isCheckbox: isCheckbox, headerBgColor: headerBgColor, freezedBgColor: freezedBgColor, noBorders: noBorders, columnsSort: columnsSort, headerRefs: headerRefs, columnsSearch: columnsSearch, setColumnsSearch: setColumnsSearch, openFilterId: openFilterId, setOpenFilterId: setOpenFilterId }));
88
88
  }),
89
89
  isLink && react_2.default.createElement(RenderView, null)));
90
90
  };
@@ -100,7 +100,7 @@ var SortingIcon = (0, react_2.memo)(function (_a) {
100
100
  });
101
101
  var ColumnHeader = (0, react_2.memo)(function (_a) {
102
102
  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
103
- var header = _a.header, index = _a.index, columnWidths = _a.columnWidths, isCheckbox = _a.isCheckbox, headerTextColor = _a.headerTextColor, freezedTextColor = _a.freezedTextColor, noBorders = _a.noBorders, columnsSort = _a.columnsSort, headerRefs = _a.headerRefs, columnsSearch = _a.columnsSearch, setColumnsSearch = _a.setColumnsSearch, handleSort = _a.handleSort, openFilterId = _a.openFilterId, setOpenFilterId = _a.setOpenFilterId;
103
+ var header = _a.header, index = _a.index, columnWidths = _a.columnWidths, isCheckbox = _a.isCheckbox, noBorders = _a.noBorders, columnsSort = _a.columnsSort, headerRefs = _a.headerRefs, columnsSearch = _a.columnsSearch, setColumnsSearch = _a.setColumnsSearch, handleSort = _a.handleSort, openFilterId = _a.openFilterId, setOpenFilterId = _a.setOpenFilterId;
104
104
  var _v = (0, react_2.useState)(false), isHovered = _v[0], setIsHovered = _v[1];
105
105
  var theme = (0, useCustomTheme_1.useCustomTheme)();
106
106
  var isFrozen = header.isFreeze;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pixelize-design-library",
3
- "version": "2.3.1-beta.11",
3
+ "version": "2.3.1-beta.12",
4
4
  "private": false,
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",