aio-table 11.0.1 → 11.1.0

package/index.js

@@ -34,6 +34,9 @@ const AIOTable = (props) => {
     propsRef.current = props;
     const pagingHook = UT.usePaging({ rows: props.value, paging: props.paging, onChange: props.onChangePaging });
     const getColumnOption = (key, cellDetails) => {
+        if (key === 'id') {
+            return cellDetails.column.id;
+        }
         const columnValue = cellDetails.column[key];
         if (columnValue !== undefined) {
             const { getValue = {} } = props;
@@ -62,7 +65,7 @@ const AIOTable = (props) => {
         if (props.onChangeColumns) {
             props.onChangeColumns(newColumns);
         }
-    }, 'aio-table-title', 'aio-table-unit');
+    }, 'aio-table-title');
     const getGetValue = (sort, column) => {
         if (sort.getValue) {
             return sort.getValue;
@@ -134,9 +137,6 @@ const AIOTable = (props) => {
             }
             return column;
         });
-        if (props.onChangeColumns) {
-            props.onChangeColumns(updatedColumns);
-        }
         setSearchColumns(searchColumns);
         setExcelColumns(excelColumns);
         setFilterColumns(filterColumns);
@@ -309,7 +309,7 @@ const TableRows = () => {
 };
 const TableToolbar = () => {
     let { add, exportToExcel, search, rootProps, excelColumns, toggleColumns, getIcon, sortHook, getColumnOption, tableHook } = useProvider();
-    let { toolbarAttrs, toolbar, onAdd, onSearch, value, onChangeColumns, columns } = rootProps;
+    let { toolbarAttrs, toolbar, onAdd, onSearch, value, onChangeColumns, columns = [] } = rootProps;
     const columnsRef = useRef(columns);
     columnsRef.current = columns;
     toolbarAttrs = UT.AddToAttrs(toolbarAttrs, { className: 'aio-table-toolbar' });
@@ -329,8 +329,8 @@ const TableToolbar = () => {
         return getColumnOption(key, tableHook.getCellDetail({ column }));
     };
     return (_jsxs("div", Object.assign({}, toolbarAttrs, { children: [toolbar && _jsx("div", { className: 'aio-table-toolbar-content', children: typeof toolbar === 'function' ? toolbar() : toolbar }), !!onSearch &&
-                _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) }), !!toggleColumns.length &&
-                _jsx("div", { className: 'aio-table-toolbar-button', children: _jsx(AISelect, { text: getIcon('mdiEye', 0.8), hideTags: true, options: toggleColumns, caret: false, option: {
+                _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 aio-table-excel-button', onClick: () => exportToExcel(), children: getIcon('mdiFileExcel', 0.8) }), !!toggleColumns.length &&
+                _jsx("div", { className: 'aio-table-toolbar-button aio-table-toggle-button', children: _jsx(AISelect, { text: getIcon('mdiEye', 0.8), hideTags: true, options: toggleColumns.map((o) => (Object.assign(Object.assign({}, o), { show: true }))), caret: false, option: {
                             text: (column) => getColumnOptionWrapper(column.id, 'title'),
                             checked: (column) => getColumnOptionWrapper(column.id, 'show'),
                             onClick: (column) => {
@@ -341,7 +341,7 @@ const TableToolbar = () => {
                                 onChangeColumns(columns.map((o) => column.id === o.id ? Object.assign(Object.assign({}, o), { show: !getColumnOptionWrapper(o.id, 'show') }) : o));
                             },
                             close: () => false
-                        } }) }), !!onAdd && _jsx("div", { className: 'aio-table-toolbar-button', onClick: () => add(), children: getAddText() })] })));
+                        } }) }), !!onAdd && _jsx("div", { className: 'aio-table-toolbar-button aio-table-add-button', onClick: () => add(), children: getAddText() })] })));
 };
 const TableHeader = () => {
     let { rootProps, getColumnOption, tableHook } = useProvider();
@@ -412,13 +412,16 @@ const TableCell = (props) => {
             return columnOption.template(cellDetail);
         }
         const pattern = getColumnOption('pattern', cellDetail);
-        if (pattern) {
-            if (type === 'date') {
-                return new AIODate().getDateByPattern(cellValue, pattern);
-            }
-            else {
-                return pattern.replace('{value}', cellValue);
+        if (pattern && cellValue) {
+            try {
+                if (type === 'date') {
+                    return new AIODate().getDateByPattern(cellValue, pattern);
+                }
+                else {
+                    return pattern.replace('{value}', cellValue);
+                }
             }
+            catch (_a) { }
         }
     };
     const templateValue = getTemplateValue();
@@ -439,7 +442,7 @@ const useTable = (getProps, getPaging, getColumnOption) => {
         else if (onChange) {
             onChange(newRows);
         }
-    }, 'aio-table-row', 'aio-table-rows');
+    }, 'aio-table-row');
     const getCellValue = (cellDetail, cellValue, def) => {
         const { getValue = {} } = getProps();
         const paging = getPaging();

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "aio-table",
-    "version": "11.0.1",
+    "version": "11.1.0",
     "description": "all in one table. tree mode , simple mode , tree mode, gantt mode , groupby mode, freeze mode.",
     "main": "index.js",
     "types": "index.d.ts",