@uxf/data-grid 11.78.0 → 11.80.0

package/data-grid-v2.js

@@ -32,7 +32,7 @@ function DataGridV2(props) {
                 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, 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: props.NoRowsFallback, actionCell: props.actionCell, actions: props.actions, bodyCells: (_c = props.bodyCells) !== null && _c !== void 0 ? _c : body_cell_1.BodyCells, data: (_e = (_d = props.data) === null || _d === void 0 ? void 0 : _d.result) !== null && _e !== void 0 ? _e : empty_array_1.EMPTY_ARRAY, error: props.error, headerRowHeight: props.headerRowHeight, isLoading: props.isLoading, isRowSelectable: props.isRowSelectable, keyExtractor: props.keyExtractor, reload: props.reload, rowAccent: props.rowAccent, rowClassName: props.rowClassName, rowHeight: props.rowHeight, schema: props.schema, state: props.state }),
+            react_1.default.createElement(table_v2_1.DataGridTableV2, { NoRowsFallback: props.NoRowsFallback, actionCell: props.actionCell, actions: props.actions, bodyCells: (_c = props.bodyCells) !== null && _c !== void 0 ? _c : body_cell_1.BodyCells, data: (_e = (_d = props.data) === null || _d === void 0 ? void 0 : _d.result) !== null && _e !== void 0 ? _e : empty_array_1.EMPTY_ARRAY, error: props.error, headerRowHeight: props.headerRowHeight, isLoading: props.isLoading, isRowSelectDisabled: props.isRowSelectDisabled, isRowsSelectable: props.isRowsSelectable, keyExtractor: props.keyExtractor, reload: props.reload, rowAccent: props.rowAccent, rowClassName: props.rowClassName, rowHeight: props.rowHeight, schema: props.schema, state: props.state }),
             react_1.default.createElement(footer_1.DataGridFooter, null,
                 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: (_g = (_f = props.data) === null || _f === void 0 ? void 0 : _f.count) !== null && _g !== void 0 ? _g : 0, state: props.state, totalCount: (_j = (_h = props.data) === null || _h === void 0 ? void 0 : _h.totalCount) !== null && _j !== void 0 ? _j : 0 }),

package/data-grid-v2.stories.js

@@ -94,6 +94,6 @@ function Default() {
     });
     return (react_1.default.createElement("div", { className: "p-10" },
         react_1.default.createElement(radio_group_1.RadioGroup, { label: "Chov\u00E1n\u00ED p\u0159ep\u00EDn\u00E1n\u00ED tab\u016F", name: "filterBehavior", onChange: (value) => setFilterBehavior(value), options: FILTER_BEHAVIOR_OPTIONS, value: filterBehavior, variant: "row" }),
-        react_1.default.createElement(data_grid_v2_1.DataGridV2, { actionCell: actionCell, actions: actions, changeTabFilterBehavior: filterBehavior !== null && filterBehavior !== void 0 ? filterBehavior : "filtersPerTab", data: data, error: error, getCsvDownloadUrl: () => ``, isLoading: isLoading, isRowSelectable: true, reload: reload, rowAccent: (row) => (row.id === 2 ? "success" : undefined), rowClassName: (row) => (row.id === 3 ? "some-custom-classname" : undefined), rowHeight: "auto", schema: schemaWithFrontendConfig, state: state }),
+        react_1.default.createElement(data_grid_v2_1.DataGridV2, { actionCell: actionCell, actions: actions, changeTabFilterBehavior: filterBehavior !== null && filterBehavior !== void 0 ? filterBehavior : "filtersPerTab", data: data, error: error, getCsvDownloadUrl: () => ``, isLoading: isLoading, isRowSelectDisabled: (row) => row.id === 6, isRowsSelectable: true, reload: reload, rowAccent: (row) => (row.id === 2 ? "success" : undefined), rowClassName: (row) => (row.id === 3 ? "some-custom-classname" : undefined), rowHeight: "auto", schema: schemaWithFrontendConfig, state: state }),
         react_1.default.createElement(json_renderer_1.JsonRenderer, { value: state })));
 }

package/data-grid.js

@@ -33,7 +33,7 @@ function DataGrid(props) {
                 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, filterHandlers: (_b = props.filterHandlers) !== null && _b !== void 0 ? _b : filter_handler_1.defaultFilterHandlers, schema: props.schema, state: props.state }),
-            react_1.default.createElement(table_1.DataGridTable, { 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, reload: props.reload, rowClass: props.rowAccent, rowHeight: props.rowHeight === "auto" ? undefined : props.rowHeight, schema: props.schema, state: props.state }),
+            react_1.default.createElement(table_1.DataGridTable, { 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.isRowsSelectable, keyExtractor: props.keyExtractor, reload: props.reload, rowClass: props.rowAccent, rowHeight: props.rowHeight === "auto" ? undefined : props.rowHeight, schema: props.schema, state: props.state }),
             react_1.default.createElement(footer_1.DataGridFooter, null,
                 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 }),

package/data-grid.stories.js

@@ -101,6 +101,6 @@ function Default() {
     });
     return (react_1.default.createElement("div", { className: "p-10" },
         react_1.default.createElement(radio_group_1.RadioGroup, { label: "Chov\u00E1n\u00ED p\u0159ep\u00EDn\u00E1n\u00ED tab\u016F", name: "filterBehavior", onChange: (value) => setFilterBehavior(value), options: FILTER_BEHAVIOR_OPTIONS, value: filterBehavior, variant: "row" }),
-        react_1.default.createElement(data_grid_1.DataGrid, { actionCell: actionCell, actions: actions, changeTabFilterBehavior: filterBehavior !== null && filterBehavior !== void 0 ? filterBehavior : "filtersPerTab", data: data, error: error, getCsvDownloadUrl: () => "", isLoading: isLoading, isRowSelectable: true, reload: reload, schema: schemaWithFrontendConfig, state: state }),
+        react_1.default.createElement(data_grid_1.DataGrid, { actionCell: actionCell, actions: actions, changeTabFilterBehavior: filterBehavior !== null && filterBehavior !== void 0 ? filterBehavior : "filtersPerTab", data: data, error: error, getCsvDownloadUrl: () => "", isLoading: isLoading, isRowsSelectable: true, reload: reload, schema: schemaWithFrontendConfig, state: state }),
         react_1.default.createElement(json_renderer_1.JsonRenderer, { value: state })));
 }

package/filter-handler/multi-select.js

@@ -18,10 +18,11 @@ const filterHandler = {
     },
     ListItem(props) {
         var _a;
+        const selectedOptions = (_a = props.filter.options) === null || _a === void 0 ? void 0 : _a.filter((o) => { var _a; return (_a = props.value) === null || _a === void 0 ? void 0 : _a.includes(o.id); });
         return (react_1.default.createElement(chip_1.Chip, { onClose: props.onClear },
             props.filter.label,
-            ":\u00A0", (_a = props.value) === null || _a === void 0 ? void 0 :
-            _a.map((item) => item.label).join(", ")));
+            ":\u00A0", selectedOptions === null || selectedOptions === void 0 ? void 0 :
+            selectedOptions.map((item) => item.label).join(", ")));
     },
 };
 exports.default = filterHandler;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@uxf/data-grid",
-    "version": "11.78.0",
+    "version": "11.80.0",
     "description": "UXF DataGrid",
     "homepage": "https://gitlab.com/uxf-npm/data-grid#readme",
     "main": "index.js",
@@ -31,9 +31,9 @@
         "typecheck": "tsc --noEmit --skipLibCheck"
     },
     "dependencies": {
-        "@uxf/core": "11.78.0",
-        "@uxf/core-react": "11.78.0",
-        "@uxf/ui": "11.78.0",
+        "@uxf/core": "11.80.0",
+        "@uxf/core-react": "11.80.0",
+        "@uxf/ui": "11.80.0",
         "dayjs": "1.11.13",
         "deepmerge": "4.3.1",
         "fast-glob": "3.3.2",

package/table-v2/components/header-select-all-rows-checkbox.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
 import { KeyExtractor } from "../../types";
 import { DataGridTableProps } from "../types";
-interface SelectRowCheckboxProps extends Pick<DataGridTableProps<any>, "state" | "data" | "actions"> {
+interface SelectRowCheckboxProps extends Pick<DataGridTableProps<any>, "state" | "data" | "actions" | "isRowSelectDisabled"> {
     keyExtractor: KeyExtractor;
 }
 export declare function HeaderSelectAllRowsCheckbox(props: SelectRowCheckboxProps): React.JSX.Element;

package/table-v2/components/header-select-all-rows-checkbox.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.HeaderSelectAllRowsCheckbox = HeaderSelectAllRowsCheckbox;
 const translations_1 = require("@uxf/core-react/translations");
 const empty_array_1 = require("@uxf/core/constants/empty-array");
+const is_nil_1 = require("@uxf/core/utils/is-nil");
 const is_not_empty_1 = require("@uxf/core/utils/is-not-empty");
 const checkbox_input_1 = require("@uxf/ui/checkbox-input");
 const react_1 = __importDefault(require("react"));
@@ -17,8 +18,10 @@ function HeaderSelectAllRowsCheckbox(props) {
         props.data.every((row) => selectedRows.find((selectedRow) => props.keyExtractor(row) === props.keyExtractor(selectedRow)));
     const isIndeterminate = !isAllRowsSelected && (0, is_not_empty_1.isNotEmpty)(selectedRows);
     const selectAllRowsHandler = () => {
-        props.actions.setSelectedRows(isAllRowsSelected ? [] : props.data);
+        props.actions.setSelectedRows(isAllRowsSelected || isIndeterminate
+            ? []
+            : props.data.filter((row) => (0, is_nil_1.isNil)(props.isRowSelectDisabled) || !props.isRowSelectDisabled(row)));
     };
     return (react_1.default.createElement("div", { className: "uxf-dg-table__cell uxf-dg-table__cell--header uxf-dg-table__select-all-rows-cell" },
-        react_1.default.createElement(checkbox_input_1.CheckboxInput, { hiddenLabel: true, indeterminate: isIndeterminate, label: t("uxf-data-grid-checkboxes:select-all"), name: "select-all-rows", onChange: selectAllRowsHandler, value: isAllRowsSelected })));
+        react_1.default.createElement(checkbox_input_1.CheckboxInput, { hiddenLabel: true, indeterminate: isIndeterminate, label: t("uxf-data-grid-checkboxes:select-all"), name: "select-all-rows", onChange: selectAllRowsHandler, value: isAllRowsSelected || isIndeterminate })));
 }

package/table-v2/components/select-row-checkbox.d.ts

@@ -1,5 +1,6 @@
 import React from "react";
 interface SelectRowCheckboxProps {
+    isRowSelectDisabled: boolean;
     isRowSelected: boolean;
     onSelectRowChange: () => void;
 }

package/table-v2/components/select-row-checkbox.js

@@ -10,5 +10,5 @@ const react_1 = __importDefault(require("react"));
 function SelectRowCheckbox(props) {
     const t = (0, translations_1.useUxfTranslation)();
     return (react_1.default.createElement("div", { className: "uxf-dg-table__cell uxf-dg-table__select-row-cell" },
-        react_1.default.createElement(checkbox_input_1.CheckboxInput, { className: "*:mt-0", hiddenLabel: true, label: t("uxf-data-grid-checkboxes:select"), name: "select-row", onChange: props.onSelectRowChange, value: props.isRowSelected })));
+        react_1.default.createElement(checkbox_input_1.CheckboxInput, { className: "*:mt-0", hiddenLabel: true, isDisabled: props.isRowSelectDisabled, label: t("uxf-data-grid-checkboxes:select"), name: "select-row", onChange: props.onSelectRowChange, value: props.isRowSelected })));
 }

package/table-v2/table-v2.js

@@ -28,7 +28,7 @@ function DataGridTableV2(props) {
     const visibleColumns = props.schema.columns
         .filter((column) => !column.hidden)
         .filter((column) => { var _a, _b, _c, _d; return !((_c = (_b = (_a = props.state.userConfig.columns) === null || _a === void 0 ? void 0 : _a[column.name]) === null || _b === void 0 ? void 0 : _b.isHidden) !== null && _c !== void 0 ? _c : (_d = column.config) === null || _d === void 0 ? void 0 : _d.isHidden); });
-    const selectedRowColumnWidth = props.isRowSelectable ? SELECT_ROWS_CELL_WIDTH : null;
+    const selectedRowColumnWidth = props.isRowsSelectable ? SELECT_ROWS_CELL_WIDTH : null;
     const { tableRef, columnRefs, onResizeStart } = (0, use_resizable_columns_1.useResizableColumns)(visibleColumns, props.actionCell, props.actions, selectedRowColumnWidth);
     const gridTemplateRows = (0, get_grid_template_rows_1.getGridTemplateRows)(props.data, (_b = props.headerRowHeight) !== null && _b !== void 0 ? _b : 36, (_c = props.rowHeight) !== null && _c !== void 0 ? _c : 44);
     const gridTemplateBasicColumns = visibleColumns
@@ -62,8 +62,8 @@ function DataGridTableV2(props) {
     return (react_1.default.createElement(components_1.Table, { gridTemplateColumns: gridTemplateColumns, gridTemplateRows: gridTemplateRows, ref: tableRef },
         react_1.default.createElement(components_1.Table.Header, null,
             react_1.default.createElement(components_1.Table.Row, null,
-                react_1.default.createElement(show_1.Show, { when: Boolean(props.isRowSelectable) },
-                    react_1.default.createElement(header_select_all_rows_checkbox_1.HeaderSelectAllRowsCheckbox, { actions: props.actions, data: props.data, keyExtractor: keyExtractor, state: props.state })),
+                react_1.default.createElement(show_1.Show, { when: Boolean(props.isRowsSelectable) },
+                    react_1.default.createElement(header_select_all_rows_checkbox_1.HeaderSelectAllRowsCheckbox, { actions: props.actions, data: props.data, isRowSelectDisabled: props.isRowSelectDisabled, keyExtractor: keyExtractor, state: props.state })),
                 visibleColumns.map((column, index) => {
                     var _a;
                     return (react_1.default.createElement(components_1.Table.HeaderCell, { column: column, key: column.name, onClick: column.sort ? () => props.actions.sort(column.name) : undefined, onResizeStart: () => onResizeStart(index), ref: (el) => {
@@ -75,8 +75,8 @@ function DataGridTableV2(props) {
         react_1.default.createElement(components_1.Table.Body, null, (0, is_empty_1.isEmpty)(props.data) ? (react_1.default.createElement(NoRowsFallback, { error: props.error, isLoading: Boolean(props.isLoading) })) : (props.data.map((row) => {
             var _a, _b;
             return (react_1.default.createElement(components_1.Table.Row, { className: `${(0, is_not_nil_1.isNotNil)(props.rowAccent) ? "uxf-dg-table__row--" + props.rowAccent(row) : ""} ${(_b = (_a = props.rowClassName) === null || _a === void 0 ? void 0 : _a.call(props, row)) !== null && _b !== void 0 ? _b : ""}`, key: keyExtractor(row) },
-                react_1.default.createElement(show_1.Show, { when: Boolean(props.isRowSelectable) },
-                    react_1.default.createElement(select_row_checkbox_1.SelectRowCheckbox, { isRowSelected: selectedRows.find((r) => keyExtractor(r) === keyExtractor(row)), onSelectRowChange: selectRowHandler(keyExtractor(row)) })),
+                react_1.default.createElement(show_1.Show, { when: Boolean(props.isRowsSelectable) },
+                    react_1.default.createElement(select_row_checkbox_1.SelectRowCheckbox, { isRowSelectDisabled: props.isRowSelectDisabled ? props.isRowSelectDisabled(row) : false, isRowSelected: selectedRows.find((r) => keyExtractor(r) === keyExtractor(row)), onSelectRowChange: selectRowHandler(keyExtractor(row)) })),
                 visibleColumns.map((column) => {
                     var _a, _b, _c, _d;
                     const BodyCell = 

package/table-v2/table-v2.stories.js

@@ -18,6 +18,6 @@ function Default() {
     const reload = () => new Promise(() => null);
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement(hidden_columns_button_1.DataGridHiddenColumnsButton, { actions: actions, schema: schema_1.schema, state: state }),
-        react_1.default.createElement(table_v2_1.DataGridTableV2, { actionCell: { width: 150, Component: () => react_1.default.createElement(action_cell_1.ActionCell, null, "Action cell") }, actions: actions, bodyCells: body_cell_1.BodyCells, data: data_1.data, error: undefined, isLoading: true, isRowSelectable: true, reload: reload, rowAccent: (row) => (row.id === 2 ? "success" : undefined), rowClassName: (row) => (row.id === 3 ? "some-custom-classname" : undefined), schema: schema_1.schema, state: state }),
+        react_1.default.createElement(table_v2_1.DataGridTableV2, { actionCell: { width: 150, Component: () => react_1.default.createElement(action_cell_1.ActionCell, null, "Action cell") }, actions: actions, bodyCells: body_cell_1.BodyCells, data: data_1.data, error: undefined, isLoading: true, isRowsSelectable: true, reload: reload, rowAccent: (row) => (row.id === 2 ? "success" : undefined), rowClassName: (row) => (row.id === 3 ? "some-custom-classname" : undefined), schema: schema_1.schema, state: state }),
         react_1.default.createElement(json_renderer_1.JsonRenderer, { value: state })));
 }

package/table-v2/types.d.ts

@@ -19,5 +19,6 @@ export interface DataGridTableProps<Row> extends DataGridControl {
         Component: ActionCellComponent<Row>;
     };
     NoRowsFallback?: NoRowsFallbackComponent;
-    isRowSelectable?: boolean;
+    isRowSelectDisabled?: (row: Row) => boolean;
+    isRowsSelectable?: boolean;
 }

package/translations.d.ts

@@ -0,0 +1,14 @@
+import type { TranslationsPaths } from "@uxf/core-react/translations/types";
+import dataGridTranslations from "@uxf/data-grid/translations/translations";
+import uiTranslations from "@uxf/ui/translations/translations";
+
+type dataGridTypes = typeof dataGridTranslations;
+type uiTypes = typeof uiTranslations;
+
+type TranslationsKeys = TranslationsPaths<dataGridTypes & uiTypes>;
+
+type TypeSafeTranslate = (key: TranslationsKeys, options?: Record<string, any>) => string;
+
+declare module "@uxf/core-react/translations" {
+    export function useUxfTranslation(): TypeSafeTranslate;
+}

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

@@ -27,7 +27,8 @@ export type DataGridBaseProps<GridType extends BaseGridType, Row> = {
     filterHandlers?: FilterHandlers;
     NoRowsFallback?: NoRowsFallbackComponent;
     SelectedRowsToolbarActions?: SelectedRowsToolbarActionsComponent;
-    isRowSelectable?: boolean;
+    isRowsSelectable?: boolean;
+    isRowSelectDisabled?: (row: Row) => boolean;
     isDebug?: boolean;
     changeTabFilterBehavior?: ChangeTabFilterBehavior;
 };