pixelize-design-library 2.1.56 → 2.1.57

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.
@@ -1,6 +1,4 @@
1
1
  "use strict";
2
- // import React, { useState, useEffect } from "react";
3
- // import { TimePickerProps } from "./DatePickerProps";
4
2
  var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
5
3
  if (k2 === undefined) k2 = k;
6
4
  var desc = Object.getOwnPropertyDescriptor(m, k);
@@ -25,121 +23,6 @@ var __importStar = (this && this.__importStar) || function (mod) {
25
23
  return result;
26
24
  };
27
25
  Object.defineProperty(exports, "__esModule", { value: true });
28
- // const TimePicker: React.FC<TimePickerProps> = ({
29
- // date,
30
- // onChange,
31
- // dateFormat,
32
- // }) => {
33
- // // console.log(date, "dateindatepicker");
34
- // const is12HourFormat = /(hh|h).*a/i.test(dateFormat);
35
- // const [hour, setHour] = useState(date.getHours());
36
- // const [minute, setMinute] = useState(date.getMinutes());
37
- // const [ampm, setAmpm] = useState(
38
- // is12HourFormat ? (date.getHours() >= 12 ? "PM" : "AM") : ""
39
- // );
40
- // useEffect(() => {
41
- // const newHour = date.getHours();
42
- // setHour(newHour);
43
- // setMinute(date.getMinutes());
44
- // if (is12HourFormat) {
45
- // setAmpm(newHour >= 12 ? "PM" : "AM");
46
- // }
47
- // }, [date, is12HourFormat]);
48
- // const convertTo24Hour = (hr: number, meridiem: string) => {
49
- // if (meridiem === "AM") return hr === 12 ? 0 : hr;
50
- // return hr === 12 ? 12 : hr + 12;
51
- // };
52
- // const updateTime = (hrInput: number, min: number, meridiem?: string) => {
53
- // const newHour = is12HourFormat
54
- // ? convertTo24Hour(hrInput, meridiem || ampm)
55
- // : hrInput;
56
- // const safeHour = Math.max(0, Math.min(23, newHour));
57
- // const safeMinutes = Math.max(0, Math.min(59, min));
58
- // const newDate = new Date(
59
- // date.getFullYear(),
60
- // date.getMonth(),
61
- // date.getDate(),
62
- // safeHour,
63
- // safeMinutes,
64
- // 0,
65
- // 0
66
- // );
67
- // onChange(newDate);
68
- // };
69
- // const handleHourChange = (e: React.ChangeEvent<HTMLInputElement>) => {
70
- // let hr = parseInt(e.target.value || "1", 10);
71
- // if (is12HourFormat) {
72
- // hr = Math.max(1, Math.min(12, hr));
73
- // setHour(hr);
74
- // updateTime(hr, minute, ampm);
75
- // } else {
76
- // hr = Math.max(0, Math.min(23, hr));
77
- // setHour(hr);
78
- // updateTime(hr, minute);
79
- // }
80
- // };
81
- // const handleMinuteChange = (e: React.ChangeEvent<HTMLInputElement>) => {
82
- // let min = parseInt(e.target.value || "0", 10);
83
- // // clamp between 0-59
84
- // min = Math.max(0, Math.min(59, min));
85
- // setMinute(min);
86
- // updateTime(hour, min, ampm);
87
- // };
88
- // const handleAmpmToggle = () => {
89
- // const newMeridiem = ampm === "AM" ? "PM" : "AM";
90
- // const displayHr = hour % 12 === 0 ? 12 : hour % 12;
91
- // // const newHr = convertTo24Hour(displayHr, newMeridiem);
92
- // setAmpm(newMeridiem);
93
- // setHour(displayHr);
94
- // updateTime(displayHr, minute, newMeridiem);
95
- // };
96
- // const displayHour = is12HourFormat ? (hour % 12 === 0 ? 12 : hour % 12) : hour;
97
- // return (
98
- // <div
99
- // style={{
100
- // display: "flex",
101
- // alignItems: "center",
102
- // gap: "0.5rem",
103
- // fontSize: "1.25rem",
104
- // marginTop: "1rem",
105
- // }}
106
- // >
107
- // <input
108
- // type="number"
109
- // value={displayHour}
110
- // onChange={handleHourChange}
111
- // min={is12HourFormat ? 1 : 0}
112
- // max={is12HourFormat ? 12 : 23}
113
- // style={{ width: "3rem", textAlign: "center" }}
114
- // />
115
- // :
116
- // <input
117
- // type="number"
118
- // value={minute.toString().padStart(2, "0")}
119
- // onChange={handleMinuteChange}
120
- // min={0}
121
- // max={59}
122
- // style={{ width: "3rem", textAlign: "center" }}
123
- // />
124
- // {is12HourFormat && (
125
- // <button
126
- // type="button"
127
- // onClick={handleAmpmToggle}
128
- // style={{
129
- // fontWeight: "bold",
130
- // padding: "0.25rem 0.5rem",
131
- // border: "none",
132
- // background: "transparent",
133
- // cursor: "pointer",
134
- // }}
135
- // >
136
- // {ampm}
137
- // </button>
138
- // )}
139
- // </div>
140
- // );
141
- // };
142
- // export default TimePicker;
143
26
  var react_1 = __importStar(require("react"));
144
27
  var react_2 = require("@chakra-ui/react");
145
28
  var TimePicker = function (_a) {
@@ -1,3 +1,3 @@
1
1
  import React from "react";
2
2
  import { TableProps } from "./TableProps";
3
- export default function Table({ data, columns, onSelection, isLoading, isCheckbox, headerBgColor, freezedBgColor, headerTextColor, freezedTextColor, tableBorderColor, noBorders, isPagination, onRowClick, selections, isActionFreeze, preferencesUrl, preferencesKey, preferencesName, preferencesPage, authToken, paginationMode, noOfRowsPerPage, totalRecords, onPagination, isTableSettings, headerActions, }: TableProps): React.JSX.Element;
3
+ export default function Table({ data, columns, onSelection, isLoading, isCheckbox, headerBgColor, freezedBgColor, headerTextColor, freezedTextColor, tableBorderColor, noBorders, isPagination, onRowClick, selections, isActionFreeze, preferencesUrl, preferencesKey, preferencesName, preferencesPage, authToken, paginationMode, noOfRowsPerPage, totalRecords, onPagination, isTableSettings, headerActions, onGlobalSearch, }: TableProps): React.JSX.Element;
@@ -42,7 +42,7 @@ var Divider_1 = __importDefault(require("../Divider/Divider"));
42
42
  var TableSearch_1 = __importDefault(require("./Components/TableSearch"));
43
43
  function Table(_a) {
44
44
  var _b, _c, _d, _e, _f, _g;
45
- var data = _a.data, columns = _a.columns, onSelection = _a.onSelection, isLoading = _a.isLoading, _h = _a.isCheckbox, isCheckbox = _h === void 0 ? false : _h, headerBgColor = _a.headerBgColor, freezedBgColor = _a.freezedBgColor, headerTextColor = _a.headerTextColor, freezedTextColor = _a.freezedTextColor, tableBorderColor = _a.tableBorderColor, _j = _a.noBorders, noBorders = _j === void 0 ? false : _j, _k = _a.isPagination, isPagination = _k === void 0 ? true : _k, onRowClick = _a.onRowClick, selections = _a.selections, _l = _a.isActionFreeze, isActionFreeze = _l === void 0 ? true : _l, _m = _a.preferencesUrl, preferencesUrl = _m === void 0 ? "" : _m, _o = _a.preferencesKey, preferencesKey = _o === void 0 ? "" : _o, _p = _a.preferencesName, preferencesName = _p === void 0 ? "" : _p, _q = _a.preferencesPage, preferencesPage = _q === void 0 ? "" : _q, _r = _a.authToken, authToken = _r === void 0 ? "" : _r, _s = _a.paginationMode, paginationMode = _s === void 0 ? "client" : _s, _t = _a.noOfRowsPerPage, noOfRowsPerPage = _t === void 0 ? 50 : _t, _u = _a.totalRecords, totalRecords = _u === void 0 ? 0 : _u, onPagination = _a.onPagination, _v = _a.isTableSettings, isTableSettings = _v === void 0 ? false : _v, headerActions = _a.headerActions;
45
+ var data = _a.data, columns = _a.columns, onSelection = _a.onSelection, isLoading = _a.isLoading, _h = _a.isCheckbox, isCheckbox = _h === void 0 ? false : _h, headerBgColor = _a.headerBgColor, freezedBgColor = _a.freezedBgColor, headerTextColor = _a.headerTextColor, freezedTextColor = _a.freezedTextColor, tableBorderColor = _a.tableBorderColor, _j = _a.noBorders, noBorders = _j === void 0 ? false : _j, _k = _a.isPagination, isPagination = _k === void 0 ? true : _k, onRowClick = _a.onRowClick, selections = _a.selections, _l = _a.isActionFreeze, isActionFreeze = _l === void 0 ? true : _l, _m = _a.preferencesUrl, preferencesUrl = _m === void 0 ? "" : _m, _o = _a.preferencesKey, preferencesKey = _o === void 0 ? "" : _o, _p = _a.preferencesName, preferencesName = _p === void 0 ? "" : _p, _q = _a.preferencesPage, preferencesPage = _q === void 0 ? "" : _q, _r = _a.authToken, authToken = _r === void 0 ? "" : _r, _s = _a.paginationMode, paginationMode = _s === void 0 ? "client" : _s, _t = _a.noOfRowsPerPage, noOfRowsPerPage = _t === void 0 ? 50 : _t, _u = _a.totalRecords, totalRecords = _u === void 0 ? 0 : _u, onPagination = _a.onPagination, _v = _a.isTableSettings, isTableSettings = _v === void 0 ? false : _v, headerActions = _a.headerActions, onGlobalSearch = _a.onGlobalSearch;
46
46
  var theme = (0, useCustomTheme_1.useCustomTheme)();
47
47
  var _w = (0, react_1.useState)({}), columnsSearch = _w[0], setColumnsSearch = _w[1];
48
48
  var isServerPagination = paginationMode === "server";
@@ -81,7 +81,7 @@ function Table(_a) {
81
81
  noOfRowsPerPage: noOfRowsPerPage,
82
82
  totalRecords: totalRecords,
83
83
  isServerPagination: isServerPagination,
84
- }), tableData = _y.tableData, isContent = _y.isContent, isLink = _y.isLink, headerRefs = _y.headerRefs, columnWidths = _y.columnWidths, handleSort = _y.handleSort, handleCheckbox = _y.handleCheckbox, filteredData = _y.filteredData, startRow = _y.startRow, endRow = _y.endRow, selection = _y.selection, columnsSort = _y.columnsSort, currentPage = _y.currentPage, pages = _y.pages, rowsPerPage = _y.rowsPerPage, handlePageSizeChange = _y.handlePageSizeChange, setCurrentPage = _y.setCurrentPage, columnsList = _y.columnsList, handleColumnPreferences = _y.handleColumnPreferences, handleGlobalSearch = _y.handleGlobalSearch;
84
+ }), tableData = _y.tableData, isContent = _y.isContent, isLink = _y.isLink, headerRefs = _y.headerRefs, columnWidths = _y.columnWidths, handleSort = _y.handleSort, handleCheckbox = _y.handleCheckbox, filteredData = _y.filteredData, startRow = _y.startRow, endRow = _y.endRow, selection = _y.selection, columnsSort = _y.columnsSort, currentPage = _y.currentPage, pages = _y.pages, rowsPerPage = _y.rowsPerPage, handlePageSizeChange = _y.handlePageSizeChange, setCurrentPage = _y.setCurrentPage, columnsList = _y.columnsList, handleColumnPreferences = _y.handleColumnPreferences;
85
85
  var _filteredData = (0, react_1.useMemo)(function () {
86
86
  return (0, table_1.searchAndSortData)(filteredData, columnsSearch);
87
87
  }, [columnsSearch, filteredData]);
@@ -93,7 +93,7 @@ function Table(_a) {
93
93
  var tablePaginationText = "".concat(startRow + 1, " - ").concat(endRow > tableData.length ? tableData.length : endRow, " of ").concat(isServerPagination ? totalRecords : tableData.length);
94
94
  return (react_1.default.createElement(react_2.Box, { bg: (_c = (_b = theme.colors) === null || _b === void 0 ? void 0 : _b.background) === null || _c === void 0 ? void 0 : _c[50], border: "0.063rem solid ".concat((_d = theme.colors.border) === null || _d === void 0 ? void 0 : _d[500]), borderRadius: 3 },
95
95
  react_1.default.createElement(react_2.Box, { display: "flex", alignItems: "center", justifyContent: "space-between", px: 3, py: 0, height: 45, gap: 2 },
96
- react_1.default.createElement(TableSearch_1.default, { onSearch: handleGlobalSearch }),
96
+ react_1.default.createElement(TableSearch_1.default, { onSearch: onGlobalSearch }),
97
97
  isTableSettings && (react_1.default.createElement(react_1.default.Fragment, null,
98
98
  react_1.default.createElement(Divider_1.default, null),
99
99
  react_1.default.createElement(TableSettings_1.default, { columns: columnsList, onSave: function (cols) { return handleColumnPreferences(cols); } }))),
@@ -30,6 +30,7 @@ export type TableProps = {
30
30
  onPagination?: (page: number, noOfRecords: number) => void;
31
31
  isTableSettings?: boolean;
32
32
  headerActions?: HeaderActionsProps;
33
+ onGlobalSearch?: (searchVal: string) => void;
33
34
  };
34
35
  export type HeaderActionsProps = {
35
36
  isDelete?: {
@@ -139,6 +139,6 @@ var column = [
139
139
  ];
140
140
  var TableExample = function () {
141
141
  return (react_1.default.createElement("div", null,
142
- react_1.default.createElement(Table_1.default, { columns: column, data: tableData, isCheckbox: true, isVisiblity: false, isLoading: false, noBorders: false, onSelection: function (checked) { return console.log(checked); }, onRowClick: function (row, header) { return console.log(row, header); }, isPagination: false, isTableSettings: true })));
142
+ react_1.default.createElement(Table_1.default, { columns: column, data: tableData, isCheckbox: true, isVisiblity: false, isLoading: false, noBorders: false, onSelection: function (checked) { return console.log(checked); }, onRowClick: function (row, header) { return console.log(row, header); }, isPagination: false, isTableSettings: true, onGlobalSearch: function (value) { return console.log(value, "searched"); } })));
143
143
  };
144
144
  exports.TableExample = TableExample;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pixelize-design-library",
3
- "version": "2.1.56",
3
+ "version": "2.1.57",
4
4
  "private": false,
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",