ehscan-react-table 0.0.25 → 0.0.27
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/elements/Table.d.ts +1 -0
- package/dist/elements/Table.js +14 -3
- package/package.json +1 -1
package/dist/elements/Table.d.ts
CHANGED
package/dist/elements/Table.js
CHANGED
|
@@ -8,7 +8,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
|
|
|
8
8
|
});
|
|
9
9
|
};
|
|
10
10
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
11
|
-
import { useEffect, useState, useRef } from "react";
|
|
11
|
+
import React, { useEffect, useState, useRef } from "react";
|
|
12
12
|
import TableCellSelectHeadCol from "./TableCellSelectHeadCol";
|
|
13
13
|
import { debounce } from "./Debounce";
|
|
14
14
|
import styles from './table.module.css';
|
|
@@ -35,7 +35,6 @@ export const Table = ({ columns, rows, sortOrder, setSortOrder, cellComponents,
|
|
|
35
35
|
console.log(colRefs.current['duedate'].getBoundingClientRect());
|
|
36
36
|
}
|
|
37
37
|
if (headerRef.current) {
|
|
38
|
-
console.log(headerRef.current.getBoundingClientRect());
|
|
39
38
|
const { bottom } = headerRef.current.getBoundingClientRect();
|
|
40
39
|
setWrapperBottom(bottom - 20);
|
|
41
40
|
}
|
|
@@ -101,6 +100,18 @@ export const Table = ({ columns, rows, sortOrder, setSortOrder, cellComponents,
|
|
|
101
100
|
return (_jsx(_Fragment, { children: _jsxs("div", { className: "sort-col", onClick: () => setSortOrder({ tag, dir: sortOrder.dir === 'desc' ? 'asc' : 'desc' }), children: [sortOrder.tag === tag && _jsx(SortButton, {}), openCol === tag && sortOrder.tag !== tag && _jsx(EmptySort, {})] }) }));
|
|
102
101
|
};
|
|
103
102
|
const colRefs = useRef({});
|
|
103
|
+
const HeadColMainLit = {
|
|
104
|
+
def: (tag) => tag !== null && tag !== void 0 ? tag : "",
|
|
105
|
+
duedate: () => React.createElement("svg", {
|
|
106
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
107
|
+
width: 24,
|
|
108
|
+
height: 24,
|
|
109
|
+
fill: "black",
|
|
110
|
+
viewBox: "0 0 24 24",
|
|
111
|
+
}, React.createElement("path", {
|
|
112
|
+
d: "M19.778 3.5H4.222C2.995 3.5 2 4.543 2 5.77v14.008C2 21.005 2.995 22 4.222 22h15.556A2.222 2.222 0 0 0 22 19.778V5.77c0-1.227-.995-2.27-2.222-2.27ZM7 5V2m10 3V2m5 7H2m5.5 4h-1m1 3h-1m1 3h-1m11-6h-1m1 3h-1m1 3h-1m-4-6h-1m1 3h-1m1 3h-1",
|
|
113
|
+
})),
|
|
114
|
+
};
|
|
104
115
|
const HeadColMain = ({ col }) => {
|
|
105
116
|
const { tag, search, title, width } = col;
|
|
106
117
|
const shouldMeasure = ['duedate'].includes(tag);
|
|
@@ -108,7 +119,7 @@ export const Table = ({ columns, rows, sortOrder, setSortOrder, cellComponents,
|
|
|
108
119
|
const thWidth = width !== undefined ? `${width}px` : "30px";
|
|
109
120
|
return (_jsx("th", { ref: shouldMeasure ? (el) => { colRefs.current[tag] = el; } : undefined, style: { "--custom-width": thWidth }, children: _jsxs("div", { className: styles.headcolcell, children: [_jsx(HeadColSort, { tag: tag }), _jsx("div", { className: styles.headcolcellmain, children: search
|
|
110
121
|
? _jsx(HeadSearchBar, { content: colTitle, tag: tag })
|
|
111
|
-
: _jsx("div", { onClick: () => setOpenCol(tag), children: colTitle }) })] }) }));
|
|
122
|
+
: _jsx("div", { onClick: () => setOpenCol(tag), children: HeadColMainLit[colTitle] ? HeadColMainLit[colTitle](colTitle) : colTitle }) })] }) }));
|
|
112
123
|
};
|
|
113
124
|
const HeadCols = () => {
|
|
114
125
|
return (_jsxs(_Fragment, { children: [columns.map((col, i) => {
|