@uxf/data-grid 11.35.0 → 11.37.0

package/types/data-grid-props.d.ts

@@ -5,7 +5,7 @@ import { DataGridTableProps } from "../table/types";
 import { DataGridToolbarCustomsProps } from "../toolbar-customs";
 import { DataGridControl } from "../use-data-grid-control";
 import { DataGridFetchingResult } from "../use-data-grid-fetching";
-import { BodyCellComponents } from "./components";
+import { BodyCellComponents, ChangeTabFilterBehavior } from "./components";
 import { CsvDownloadHandler, KeyExtractor } from "./core";
 import { BaseGridType, Schema } from "./schema";
 export type DataGridControlProps = DataGridControl;
@@ -15,8 +15,6 @@ export type DataGridBaseProps<GridType extends BaseGridType, Row> = {
     gridName?: string;
     keyExtractor?: KeyExtractor;
     onCsvDownload?: CsvDownloadHandler;
-    /** @deprecated will be remove, create custom data grid https://fe.uxf.dev/docs/data-grid/data-grid-custom-example */
-    noBorder?: boolean;
     rowHeight?: number | ((row: Row) => number);
     headerRowHeight?: number;
     rowClass?: (row: Row) => "success" | "warning" | "error" | "primary" | "secondary" | string | null | undefined;
@@ -29,5 +27,6 @@ export type DataGridBaseProps<GridType extends BaseGridType, Row> = {
     SelectedRowsToolbarActions?: SelectedRowsToolbarActionsComponent;
     isRowSelectable?: boolean;
     isDebug?: boolean;
+    changeTabFilterBehavior?: ChangeTabFilterBehavior;
 };
 export type DataGridProps<GridType extends BaseGridType, Row> = DataGridBaseProps<GridType, Row> & DataGridDataProps<Row> & DataGridControlProps;

package/types/index.d.ts

@@ -1,6 +1,6 @@
-export * from "./api";
-export * from "./components";
-export * from "./core";
-export * from "./data-grid-props";
-export * from "./schema";
-export * from "./state";
+export type * from "./api";
+export type * from "./components";
+export type * from "./core";
+export type * from "./data-grid-props";
+export type * from "./schema";
+export type * from "./state";

package/types/index.js

@@ -1,22 +1,2 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./api"), exports);
-__exportStar(require("./components"), exports);
-__exportStar(require("./core"), exports);
-__exportStar(require("./data-grid-props"), exports);
-__exportStar(require("./schema"), exports);
-__exportStar(require("./state"), exports);

package/types/schema.d.ts

@@ -1,9 +1,4 @@
 import { ReactElement } from "react";
-/** @deprecated use 'asc' or 'desc' */
-export declare enum DataGridSortDir {
-    Asc = "asc",
-    Desc = "desc"
-}
 export interface DataGridSort {
     name: string;
     dir: "asc" | "desc";

package/types/schema.js

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

package/use-data-grid-control/actions-factory.d.ts

@@ -1,4 +1,5 @@
 import { Dispatch } from "react";
+import type { ChangeTabFilterBehavior } from "../types";
 import { Tab } from "../types/schema";
 import { DataGridUserConfig } from "../types/state";
 export declare function createActions(dispatch: Dispatch<any>): {
@@ -10,7 +11,7 @@ export declare function createActions(dispatch: Dispatch<any>): {
     sort: (columnName: string, direction?: string | null) => void;
     sortClear: () => void;
     search: (search: string) => void;
-    changeTab: (tab: Tab) => void;
+    changeTab: (tab: Tab, filterBehavior: ChangeTabFilterBehavior) => void;
     setSelectedRows: (rows: any[]) => void;
     hideColumn: (name: string) => void;
     showColumn: (name: string) => void;

package/use-data-grid-control/actions-factory.js

@@ -11,7 +11,7 @@ function createActions(dispatch) {
         sort: (columnName, direction = null) => dispatch({ type: "SORT", columnName, direction }),
         sortClear: () => dispatch({ type: "SORT_CLEAR" }),
         search: (search) => dispatch({ type: "FULLTEXT", search }),
-        changeTab: (tab) => dispatch({ type: "CHANGE_TAB", tab }),
+        changeTab: (tab, filterBehavior) => dispatch({ type: "CHANGE_TAB", tab, filterBehavior }),
         setSelectedRows: (rows) => dispatch({ type: "SET_SELECTED_ROWS", rows }),
         hideColumn: (name) => dispatch({ type: "HIDE_COLUMN", name }),
         showColumn: (name) => dispatch({ type: "SHOW_COLUMN", name }),

package/use-data-grid-control/use-data-grid-control.d.ts

@@ -19,7 +19,7 @@ export declare function useDataGridControl<T extends BaseGridType>(config: UseDa
         sort: (columnName: string, direction?: string | null) => void;
         sortClear: () => void;
         search: (search: string) => void;
-        changeTab: (tab: import("../types/schema").Tab) => void;
+        changeTab: (tab: import("../types/schema").Tab, filterBehavior: import("..").ChangeTabFilterBehavior) => void;
         setSelectedRows: (rows: any[]) => void;
         hideColumn: (name: string) => void;
         showColumn: (name: string) => void;

package/data-grid-v2.d.ts

@@ -1,3 +0,0 @@
-import React from "react";
-import { BaseGridType, DataGridProps } from "./types";
-export declare function DataGridV2<GridType extends BaseGridType, R = any>(props: DataGridProps<GridType, R>): React.JSX.Element;

package/data-grid-v2.js

@@ -1,43 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DataGridV2 = DataGridV2;
-const empty_array_1 = require("@uxf/core/constants/empty-array");
-const react_1 = __importDefault(require("react"));
-const body_cell_1 = require("./body-cell");
-const filter_handler_1 = require("./filter-handler");
-const filter_list_1 = require("./filter-list");
-const footer_1 = require("./footer");
-const linear_progress_1 = require("./linear-progress");
-const pagination_1 = require("./pagination");
-const root_1 = require("./root");
-const row_counts_1 = require("./row-counts");
-const rows_per_page_select_1 = require("./rows-per-page-select");
-const selected_rows_toolbar_1 = require("./selected-rows-toolbar");
-const table_v2_1 = require("./table-v2");
-const no_rows_fallback_1 = require("./table/no-rows-fallback");
-const toolbar_1 = require("./toolbar");
-const toolbar_control_1 = require("./toolbar-control");
-const toolbar_customs_1 = require("./toolbar-customs");
-const toolbar_tabs_1 = require("./toolbar-tabs");
-const classes_1 = require("./utils/classes");
-const DefaultSelectedRowsToolbarActions = () => null;
-function DataGridV2(props) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(root_1.DataGridRoot, { className: props.className, noBorder: props.noBorder },
-            react_1.default.createElement(toolbar_1.DataGridToolbar, { noBorder: props.noBorder },
-                react_1.default.createElement(toolbar_tabs_1.DataGridToolbarTabs, { actions: props.actions, schema: props.schema, state: props.state }),
-                react_1.default.createElement(toolbar_control_1.DataGridToolbarControl, { actions: props.actions, filterHandlers: (_a = props.filterHandlers) !== null && _a !== void 0 ? _a : filter_handler_1.defaultFilterHandlers, onCsvDownload: props.onCsvDownload, schema: props.schema, state: props.state }),
-                react_1.default.createElement(toolbar_customs_1.DataGridToolbarCustoms, { buttons: props.customActions })),
-            react_1.default.createElement(linear_progress_1.DataGridLinearProgress, { isLoading: props.isLoading }),
-            react_1.default.createElement(filter_list_1.DataGridFilterList, { actions: props.actions, className: props.noBorder ? classes_1.NO_BORDER_CLASS : undefined, filterHandlers: (_b = props.filterHandlers) !== null && _b !== void 0 ? _b : filter_handler_1.defaultFilterHandlers, schema: props.schema, state: props.state }),
-            react_1.default.createElement(table_v2_1.DataGridTableV2, { NoRowsFallback: (_c = props.NoRowsFallback) !== null && _c !== void 0 ? _c : no_rows_fallback_1.NoRowsFallback, actionCell: props.actionCell, actions: props.actions, bodyCells: (_d = props.bodyCells) !== null && _d !== void 0 ? _d : body_cell_1.BodyCells, data: (_f = (_e = props.data) === null || _e === void 0 ? void 0 : _e.result) !== null && _f !== void 0 ? _f : empty_array_1.EMPTY_ARRAY, error: props.error, headerRowHeight: props.headerRowHeight, isLoading: props.isLoading, isRowSelectable: props.isRowSelectable, keyExtractor: props.keyExtractor, onReload: props.onReload, rowClass: props.rowClass, rowHeight: props.rowHeight, schema: props.schema, state: props.state }),
-            react_1.default.createElement(footer_1.DataGridFooter, { noBorder: props.noBorder },
-                react_1.default.createElement(rows_per_page_select_1.DataGridRowsPerPageSelect, { actions: props.actions, state: props.state }),
-                react_1.default.createElement(row_counts_1.DataGridRowCounts, { count: (_h = (_g = props.data) === null || _g === void 0 ? void 0 : _g.count) !== null && _h !== void 0 ? _h : 0, state: props.state, totalCount: (_k = (_j = props.data) === null || _j === void 0 ? void 0 : _j.totalCount) !== null && _k !== void 0 ? _k : 0 }),
-                react_1.default.createElement(pagination_1.DataGridPagination, { actions: props.actions, count: (_m = (_l = props.data) === null || _l === void 0 ? void 0 : _l.count) !== null && _m !== void 0 ? _m : 0, showFirstButton: true, showLastButton: true, size: "sm", state: props.state }))),
-        react_1.default.createElement(selected_rows_toolbar_1.DataGridSelectedRowsToolbar, { Actions: (_o = props.SelectedRowsToolbarActions) !== null && _o !== void 0 ? _o : DefaultSelectedRowsToolbarActions, actions: props.actions, state: props.state })));
-}

package/data-grid-v2.stories.d.ts

@@ -1,2 +0,0 @@
-import React from "react";
-export declare function Default(): React.JSX.Element;

package/data-grid-v2.stories.js

@@ -1,92 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Default = Default;
-const buildArray_1 = require("@uxf/core/utils/buildArray");
-const toggle_1 = require("@uxf/ui/toggle");
-const react_1 = __importStar(require("react"));
-const json_renderer_1 = require("./_story-utils/json-renderer");
-const loader_1 = require("./_story-utils/loader");
-const schema_1 = require("./_story-utils/schema");
-const data_grid_v2_1 = require("./data-grid-v2");
-const table_1 = require("./table");
-const use_data_grid_control_1 = require("./use-data-grid-control");
-const use_data_grid_fetching_1 = require("./use-data-grid-fetching");
-const merge_schema_with_config_1 = require("./utils/merge-schema-with-config");
-const actionCell = {
-    width: 100,
-    Component: () => {
-        const actionCellActions = (0, buildArray_1.buildArray)()
-            .add({
-            icon: "arrow-right",
-            isIconButton: true,
-            href: "https://www.uxf.cz",
-            target: "_blank",
-        })
-            .add({
-            icon: "file",
-            label: "Download",
-            onClick: console.log,
-        })
-            .add({
-            icon: "cloud",
-            label: "Reload",
-            onClick: console.log,
-        });
-        return react_1.default.createElement(table_1.ActionCell, { buttons: actionCellActions, visibleButtonsCount: 1 });
-    },
-};
-const schemaWithFrontendConfig = (0, merge_schema_with_config_1.mergeSchemaWithConfig)(schema_1.schema, {
-    perPage: 100,
-    columns: {
-        bool: { width: 80 },
-    },
-    filters: {
-        text: { placeholder: "Custom placeholder ..." },
-    },
-});
-function Default() {
-    const [noBorder, setNoBorder] = (0, react_1.useState)(false);
-    const { state, actions } = (0, use_data_grid_control_1.useDataGridControl)({
-        schema: schema_1.schema,
-        initialUserConfig: {
-            columns: {
-                id: { width: 100 },
-                text: { minWidth: 300 },
-                mail: { minWidth: 300 },
-                tel: { minWidth: 300 },
-            },
-        },
-    });
-    const { isLoading, error, data, onReload } = (0, use_data_grid_fetching_1.useDataGridFetching)({
-        loader: loader_1.loader,
-        schema: schema_1.schema,
-        state,
-    });
-    return (react_1.default.createElement("div", { className: "p-10" },
-        react_1.default.createElement(toggle_1.Toggle, { label: "No border", name: "noBorder", onChange: (value) => setNoBorder(Boolean(value)), value: noBorder }),
-        react_1.default.createElement(data_grid_v2_1.DataGridV2, { actionCell: actionCell, actions: actions, data: data, error: error, isLoading: isLoading, isRowSelectable: true, noBorder: noBorder, onCsvDownload: console.log, onReload: onReload, schema: schemaWithFrontendConfig, state: state }),
-        react_1.default.createElement(json_renderer_1.JsonRenderer, { value: state })));
-}

package/utils/classes.d.ts

@@ -1 +0,0 @@
-export declare const NO_BORDER_CLASS = "no-border";

package/utils/classes.js

@@ -1,4 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.NO_BORDER_CLASS = void 0;
-exports.NO_BORDER_CLASS = "no-border";