@uxf/data-grid 11.4.0 → 11.6.0

package/_store/reducer.js

@@ -4,23 +4,20 @@ exports.debugReducer = exports.reducer = exports.getInitialState = void 0;
 const is_nil_1 = require("@uxf/core/utils/is-nil");
 const utils_1 = require("../utils");
 function getInitialState(schema, init, initialUserConfig) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
     const initialState = (0, is_nil_1.isNil)(init) ? {} : typeof init === "string" ? (_a = (0, utils_1.decodeFilter)(init)) !== null && _a !== void 0 ? _a : {} : init;
-    const tabName = (_e = (_b = initialState.tab) !== null && _b !== void 0 ? _b : (_d = (_c = schema.tabs) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.name) !== null && _e !== void 0 ? _e : null;
-    const tabSort = tabName !== null ? (_g = (_f = schema.tabs) === null || _f === void 0 ? void 0 : _f.find((t) => t.name === tabName)) === null || _g === void 0 ? void 0 : _g.s : null;
+    const initialTabName = (_e = (_b = initialState.tab) !== null && _b !== void 0 ? _b : (_d = (_c = schema.tabs) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.name) !== null && _e !== void 0 ? _e : null;
+    const initialTabSort = initialTabName !== null ? (_g = (_f = schema.tabs) === null || _f === void 0 ? void 0 : _f.find((t) => t.name === initialTabName)) === null || _g === void 0 ? void 0 : _g.s : null;
     return {
         request: {
             f: (_h = initialState.f) !== null && _h !== void 0 ? _h : [],
-            s: (_k = (_j = initialState.s) !== null && _j !== void 0 ? _j : tabSort) !== null && _k !== void 0 ? _k : schema.s,
+            s: (_k = (_j = initialState.s) !== null && _j !== void 0 ? _j : initialTabSort) !== null && _k !== void 0 ? _k : schema.s,
             page: (_l = initialState.page) !== null && _l !== void 0 ? _l : 0,
             perPage: (_o = (_m = initialState.perPage) !== null && _m !== void 0 ? _m : initialUserConfig === null || initialUserConfig === void 0 ? void 0 : initialUserConfig.perPage) !== null && _o !== void 0 ? _o : schema.perPage,
-            tab: tabName,
+            tab: initialTabName,
             search: (_p = initialState.search) !== null && _p !== void 0 ? _p : "",
         },
-        userConfig: {
-            columns: (_q = initialUserConfig === null || initialUserConfig === void 0 ? void 0 : initialUserConfig.columns) !== null && _q !== void 0 ? _q : {},
-            perPage: (_r = initialUserConfig === null || initialUserConfig === void 0 ? void 0 : initialUserConfig.perPage) !== null && _r !== void 0 ? _r : schema.perPage,
-        },
+        userConfig: initialUserConfig !== null && initialUserConfig !== void 0 ? initialUserConfig : {},
         tabRequests: {},
     };
 }

package/_story-utils/loader.js

@@ -13,12 +13,8 @@ const loader = async (_, request) => {
         if (!s) {
             return 1;
         }
-        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-        // @ts-ignore
-        const first = a[sort];
-        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-        // @ts-ignore
-        const second = b[sort];
+        const first = a[s.name];
+        const second = b[s.name];
         if (typeof first === "number") {
             return s.dir === "asc" ? first - second : second - first;
         }

package/_story-utils/schema.js

@@ -1,10 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.schema = void 0;
-const types_1 = require("../types");
 exports.schema = {
     columns: [
-        { name: "id", type: "number", label: "Id", sort: true },
+        { name: "id", type: "number", label: "Id", sort: true, config: { width: 50 } },
         { name: "text", type: "string", label: "Text", sort: true },
         { name: "bool", type: "boolean", label: "Boolean" },
         { name: "mail", type: "email", label: "E-mail" },
@@ -58,17 +57,10 @@ exports.schema = {
         {
             name: "only-odd-ids",
             label: "Only odd ids blablabla",
-            s: {
-                name: "id",
-                dir: types_1.DataGridSortDir.Desc,
-            },
+            s: { name: "id", dir: "desc" },
         },
-        // { name: "only-odd-ids", label: "Only odd ids" },
     ],
-    s: {
-        name: "id",
-        dir: types_1.DataGridSortDir.Asc,
-    },
+    s: { name: "id", dir: "asc" },
     perPage: 10,
     fullText: true,
 };

package/data-grid.stories.js

@@ -40,7 +40,7 @@ function Default() {
         schema: schema_1.schema,
         initialUserConfig: {
             columns: {
-                id: { minWidth: 50 },
+                id: { width: 100 },
                 text: { minWidth: 300 },
                 mail: { minWidth: 300 },
                 tel: { minWidth: 300 },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uxf/data-grid",
-  "version": "11.4.0",
+  "version": "11.6.0",
   "description": "UXF DataGrid",
   "homepage": "https://gitlab.com/uxf-npm/data-grid#readme",
   "main": "index.js",
@@ -31,7 +31,7 @@
     "typecheck": "tsc --noEmit --skipLibCheck"
   },
   "dependencies": {
-    "@uxf/ui": "11.4.0",
+    "@uxf/ui": "11.6.0",
     "dayjs": "1.11.10",
     "fast-glob": "^3.3.2",
     "qs": "6.11.2",

package/table/hooks/use-react-data-grid-columns.js

@@ -29,16 +29,17 @@ const react_1 = __importStar(require("react"));
 const react_data_grid_1 = require("react-data-grid");
 function useReactDataGridColumns(props, state) {
     const { onReload, schema, isRowSelectable, bodyCells, actionCell } = props;
-    const columnsConfig = state.userConfig.columns;
+    const userConfigColumns = state.userConfig.columns;
     return (0, react_1.useMemo)(() => {
-        var _a, _b, _c, _d, _e, _f, _g;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
         const columns = [];
         if (isRowSelectable) {
             columns.push(react_data_grid_1.SelectColumn);
         }
         for (const schemaColumn of schema.columns) {
+            const isHidden = (_b = (_a = userConfigColumns === null || userConfigColumns === void 0 ? void 0 : userConfigColumns[schemaColumn.name]) === null || _a === void 0 ? void 0 : _a.isHidden) !== null && _b !== void 0 ? _b : (_c = schemaColumn.config) === null || _c === void 0 ? void 0 : _c.isHidden;
             // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-            if ((_a = columnsConfig === null || columnsConfig === void 0 ? void 0 : columnsConfig[schemaColumn.name]) === null || _a === void 0 ? void 0 : _a.isHidden) {
+            if (isHidden) {
                 continue;
             }
             columns.push({
@@ -47,9 +48,8 @@ function useReactDataGridColumns(props, state) {
                 headerCellClass: (0, cx_1.cx)("uxf-data-grid__cell", "uxf-data-grid__cell--header", `uxf-data-grid__cell--type-${schemaColumn.type}`, `uxf-data-grid__cell--name-${schemaColumn.name}`),
                 resizable: true,
                 sortable: schemaColumn.sort,
-                width: (_d = (_c = (_b = state.userConfig.columns) === null || _b === void 0 ? void 0 : _b[schemaColumn.name]) === null || _c === void 0 ? void 0 : _c.width) !== null && _d !== void 0 ? _d : schemaColumn.width,
-                minWidth: (_g = (_f = (_e = state.userConfig.columns) === null || _e === void 0 ? void 0 : _e[schemaColumn.name]) === null || _f === void 0 ? void 0 : _f.minWidth) !== null && _g !== void 0 ? _g : schemaColumn.minWidth,
-                maxWidth: schemaColumn.maxWidth,
+                width: (_f = (_e = (_d = state.userConfig.columns) === null || _d === void 0 ? void 0 : _d[schemaColumn.name]) === null || _e === void 0 ? void 0 : _e.width) !== null && _f !== void 0 ? _f : (_g = schemaColumn.config) === null || _g === void 0 ? void 0 : _g.width,
+                minWidth: (_k = (_j = (_h = state.userConfig.columns) === null || _h === void 0 ? void 0 : _h[schemaColumn.name]) === null || _j === void 0 ? void 0 : _j.minWidth) !== null && _k !== void 0 ? _k : (_l = schemaColumn.config) === null || _l === void 0 ? void 0 : _l.minWidth,
                 cellClass: (0, cx_1.cx)("uxf-data-grid__cell", `uxf-data-grid__cell--type-${schemaColumn.type}`, `uxf-data-grid__cell--name-${schemaColumn.name}`),
                 renderCell: (p) => {
                     var _a;
@@ -79,6 +79,6 @@ function useReactDataGridColumns(props, state) {
             });
         }
         return columns;
-    }, [columnsConfig, actionCell, schema.columns, bodyCells, isRowSelectable, onReload, state.userConfig.columns]);
+    }, [userConfigColumns, actionCell, schema.columns, bodyCells, isRowSelectable, onReload, state.userConfig.columns]);
 }
 exports.useReactDataGridColumns = useReactDataGridColumns;

package/types/core.d.ts

@@ -1,7 +1,6 @@
 import { Request, Response, ResultItem } from "./api";
 import { BaseGridType } from "./schema";
 export type KeyExtractor = (row: ResultItem) => number;
-export type ChangeHiddenColumnsHandler = (hiddenColumns: string[]) => void;
 export type CsvDownloadHandler = (request: Request) => void;
 export type Loader = (gridName: string | undefined, request: Request, encodedRequest: string) => Promise<Response>;
 export type CallbackRef = {

package/types/schema.d.ts

@@ -1,11 +1,12 @@
 import { ReactElement } from "react";
+/** @deprecated use 'asc' or 'desc' */
 export declare enum DataGridSortDir {
     Asc = "asc",
     Desc = "desc"
 }
 export interface DataGridSort {
     name: string;
-    dir: DataGridSortDir;
+    dir: "asc" | "desc";
 }
 export interface Tab {
     name: string;
@@ -22,12 +23,12 @@ export type Column<Name, Type> = {
     label: string | ReactElement;
     type: Type;
     sort?: boolean;
-    hint?: string;
-    print?: boolean;
-    width?: number | string;
+    config?: ColumnConfig;
+};
+export type ColumnConfig = {
+    isHidden?: boolean;
+    width?: number;
     minWidth?: number;
-    maxWidth?: number;
-    frozen?: boolean;
 };
 export type Columns<C extends BaseGridType["columns"]> = {
     [K in keyof C]: Column<K, C[K]>;
@@ -46,6 +47,7 @@ export type Filters<F extends BaseGridType["filters"]> = {
     [K in keyof F]: Filter<K, F[K]>;
 }[keyof F];
 export interface Schema<GritType extends BaseGridType> {
+    name?: string;
     columns: Columns<GritType["columns"]>[];
     filters: Filters<GritType["filters"]>[];
     tabs?: Tab[];

package/types/schema.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DataGridSortDir = void 0;
+/** @deprecated use 'asc' or 'desc' */
 var DataGridSortDir;
 (function (DataGridSortDir) {
     DataGridSortDir["Asc"] = "asc";