aio-table 9.2.0 → 9.3.0
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/index.d.ts +6 -6
- package/index.js +11 -8
- package/package.json +2 -3
package/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ReactNode } from "react";
|
|
2
|
-
import
|
|
2
|
+
import * as UT from 'aio-utils';
|
|
3
3
|
import "./index.css";
|
|
4
4
|
type I_rowOption<T, R> = (p: I_rowDetail<T>) => R;
|
|
5
5
|
type I_cellOption<T, R> = ((p: I_cellDetail<T>) => R) | string;
|
|
@@ -14,11 +14,11 @@ type I_cellDetail<T> = I_rowDetail<T> & {
|
|
|
14
14
|
change: (newRow: T) => void;
|
|
15
15
|
isDate: boolean;
|
|
16
16
|
};
|
|
17
|
-
export type I_table_paging = I_paging;
|
|
18
|
-
export type I_table_sort<T> = I_sort<T>;
|
|
19
|
-
export type I_table_filter = I_filter;
|
|
20
|
-
export type I_table_filter_item = I_filter_item;
|
|
21
|
-
export type I_table_filter_saved_item = I_filter_saved_item;
|
|
17
|
+
export type I_table_paging = UT.I_paging;
|
|
18
|
+
export type I_table_sort<T> = UT.I_sort<T>;
|
|
19
|
+
export type I_table_filter = UT.I_filter;
|
|
20
|
+
export type I_table_filter_item = UT.I_filter_item;
|
|
21
|
+
export type I_table_filter_saved_item = UT.I_filter_saved_item;
|
|
22
22
|
export type I_table_column<T> = {
|
|
23
23
|
title?: any;
|
|
24
24
|
sort?: true | I_table_sort<T>;
|
package/index.js
CHANGED
|
@@ -13,7 +13,6 @@ import AIOInput from "aio-input";
|
|
|
13
13
|
import * as UT from 'aio-utils';
|
|
14
14
|
import usePopup from "aio-popup";
|
|
15
15
|
import AIODate from "aio-date";
|
|
16
|
-
import { Filterbar, usePaging, useSort } from "aio-component-utils";
|
|
17
16
|
import "./index.css";
|
|
18
17
|
const Context = createContext({});
|
|
19
18
|
const Provider = (p) => _jsx(Context.Provider, { value: p.value, children: p.children });
|
|
@@ -33,7 +32,7 @@ const AIOTable = (props) => {
|
|
|
33
32
|
const getRowsIndexDic = () => rowsIndexDicRef.current;
|
|
34
33
|
const propsRef = useRef(props);
|
|
35
34
|
propsRef.current = props;
|
|
36
|
-
const pagingHook = usePaging({ rows: props.value, paging: props.paging, onChange: props.onChangePaging });
|
|
35
|
+
const pagingHook = UT.usePaging({ rows: props.value, paging: props.paging, onChange: props.onChangePaging });
|
|
37
36
|
const tableHook = useTable(() => propsRef.current, () => props.paging);
|
|
38
37
|
const getIconRef = useRef(new UT.GetSvg());
|
|
39
38
|
const getIcon = getIconRef.current.getIcon;
|
|
@@ -72,7 +71,7 @@ const AIOTable = (props) => {
|
|
|
72
71
|
}
|
|
73
72
|
return sorts;
|
|
74
73
|
};
|
|
75
|
-
const sortHook = useSort({
|
|
74
|
+
const sortHook = UT.useSort({
|
|
76
75
|
sorts: [],
|
|
77
76
|
rows: propsRef.current.value,
|
|
78
77
|
onChangeRows: props.onChange,
|
|
@@ -233,6 +232,7 @@ const AIOTable = (props) => {
|
|
|
233
232
|
}
|
|
234
233
|
}
|
|
235
234
|
const changeCell = (cellDetail, cellNewValue) => {
|
|
235
|
+
if (cellNewValue) { }
|
|
236
236
|
if (!props.onChange) {
|
|
237
237
|
return;
|
|
238
238
|
}
|
|
@@ -253,7 +253,7 @@ const AIOTable = (props) => {
|
|
|
253
253
|
getRowsIndexDic, add, remove, search, exportToExcel, DragColumns, getIcon, popup,
|
|
254
254
|
};
|
|
255
255
|
return (_jsxs(Provider, { value: context, children: [_jsxs("div", Object.assign({}, attrs, { children: [_jsx(TableToolbar, {}), !!props.filter &&
|
|
256
|
-
_jsx(Filterbar, { columns: filterColumns, filter: props.filter, fa: props.fa, columnOption: { text: (column) => column.title, id: (column) => column.filterId, type: (column) => column.type || 'text' } }), _jsxs("div", { className: 'aio-table-unit aio-table-scroll', style: { gap: gap[1] }, children: [_jsx(TableHeader, {}), _jsx(TableRows, {})] }), pagingHook.render()] })), popup.render()] }));
|
|
256
|
+
_jsx(UT.Filterbar, { columns: filterColumns, filter: props.filter, fa: props.fa, columnOption: { text: (column) => column.title, id: (column) => column.filterId, type: (column) => column.type || 'text' } }), _jsxs("div", { className: 'aio-table-unit aio-table-scroll', style: { gap: gap[1] }, children: [_jsx(TableHeader, {}), _jsx(TableRows, {})] }), pagingHook.render()] })), popup.render()] }));
|
|
257
257
|
};
|
|
258
258
|
export default AIOTable;
|
|
259
259
|
const TableRows = () => {
|
|
@@ -307,7 +307,8 @@ const TableToolbar = () => {
|
|
|
307
307
|
}
|
|
308
308
|
return typeof addText === 'function' ? addText(value) : addText;
|
|
309
309
|
}
|
|
310
|
-
return (_jsxs("div", Object.assign({}, toolbarAttrs, { children: [toolbar && _jsx("div", { className: 'aio-table-toolbar-content', children: typeof toolbar === 'function' ? toolbar() : toolbar }),
|
|
310
|
+
return (_jsxs("div", Object.assign({}, toolbarAttrs, { children: [toolbar && _jsx("div", { className: 'aio-table-toolbar-content', children: typeof toolbar === 'function' ? toolbar() : toolbar }), !!onSearch &&
|
|
311
|
+
_jsx("div", { className: 'aio-table-search', children: _jsx(AIOInput, { type: 'text', onChange: (value) => search(value), after: getIcon('mdiMagnify', 0.7) }) }), sortHook.renderSortButton(), !!excelColumns.length && _jsx("div", { className: 'aio-table-toolbar-button', onClick: () => exportToExcel(), children: getIcon('mdiFileExcel', 0.8) }), !!onAdd && _jsx("div", { className: 'aio-table-toolbar-button', onClick: () => add(), children: getAddText() })] })));
|
|
311
312
|
};
|
|
312
313
|
const TableHeader = () => {
|
|
313
314
|
let { rootProps, columns } = useProvider();
|
|
@@ -318,7 +319,7 @@ const TableHeader = () => {
|
|
|
318
319
|
return _jsxs("div", Object.assign({}, headerAttrs, { children: [Titles, RemoveTitle] }));
|
|
319
320
|
};
|
|
320
321
|
const TableTitle = (p) => {
|
|
321
|
-
const { column,
|
|
322
|
+
const { column, colIndex } = p;
|
|
322
323
|
let { tableHook, DragColumns } = useProvider();
|
|
323
324
|
const attrs = Object.assign(Object.assign(Object.assign({}, tableHook.getTitleAttrs(column)), DragColumns.getDragAttrs(colIndex)), DragColumns.getDropAttrs(colIndex));
|
|
324
325
|
return _jsx("div", Object.assign({}, attrs, { children: attrs.title }));
|
|
@@ -330,9 +331,10 @@ const TableRow = (props) => {
|
|
|
330
331
|
let { remove, rootProps, columns, tableHook, getIcon, isDate } = useProvider();
|
|
331
332
|
const isOdd = rowIndex % 2 === 0;
|
|
332
333
|
function getCells() {
|
|
333
|
-
return columns.map((column
|
|
334
|
+
return columns.map((column) => {
|
|
334
335
|
const key = rowId + ' ' + column._id;
|
|
335
336
|
const cellDetail = Object.assign(Object.assign({}, rowDetail), { column, change: (cellNewValue) => {
|
|
337
|
+
if (cellNewValue) { }
|
|
336
338
|
if (!rootProps.onChange) {
|
|
337
339
|
return;
|
|
338
340
|
}
|
|
@@ -352,7 +354,7 @@ const TableRow = (props) => {
|
|
|
352
354
|
};
|
|
353
355
|
const TableCell = (props) => {
|
|
354
356
|
const { cellDetail, cellValue, isOdd } = props;
|
|
355
|
-
const { row, column
|
|
357
|
+
const { row, column } = cellDetail;
|
|
356
358
|
const { tableHook, getTimeText, rootProps } = useProvider();
|
|
357
359
|
const { template, before, after, subtext } = column;
|
|
358
360
|
const rowId = row._id;
|
|
@@ -389,6 +391,7 @@ const useTable = (getProps, getPaging) => {
|
|
|
389
391
|
let type = typeof cellValue;
|
|
390
392
|
if (type === 'string') {
|
|
391
393
|
const { row } = cellDetail;
|
|
394
|
+
if (row) { }
|
|
392
395
|
let result = cellValue;
|
|
393
396
|
if (getValue[cellValue]) {
|
|
394
397
|
result = getValue[cellValue](cellDetail);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "aio-table",
|
|
3
|
-
"version": "9.
|
|
3
|
+
"version": "9.3.0",
|
|
4
4
|
"description": "all in one table. tree mode , simple mode , tree mode, gantt mode , groupby mode, freeze mode.",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"types": "index.d.ts",
|
|
@@ -19,8 +19,7 @@
|
|
|
19
19
|
"homepage": "https://github.com/mohammadFeiz/aio-table#readme",
|
|
20
20
|
"dependencies": {
|
|
21
21
|
"aio-input": "latest",
|
|
22
|
-
"aio-utils": "latest"
|
|
23
|
-
"aio-component-utils":"latest"
|
|
22
|
+
"aio-utils": "latest"
|
|
24
23
|
},
|
|
25
24
|
"devDependencies": {
|
|
26
25
|
"react-scripts": "latest"
|