@uxf/data-grid 11.11.0 → 11.11.3

package/body-cell/body-cell-boolean.js

@@ -12,6 +12,6 @@ const BodyCellBoolean = (props) => {
     }
     // TODO @vejvis: implement onChange
     return (react_1.default.createElement("div", { className: "uxf-data-grid__body-cell--boolean" },
-        react_1.default.createElement(checkbox_1.Checkbox, { value: props.value, onChange: () => void null, isDisabled: true })));
+        react_1.default.createElement(checkbox_1.Checkbox, { value: props.value, name: props.column.name, onChange: () => void null, isDisabled: true })));
 };
 exports.BodyCellBoolean = BodyCellBoolean;

package/data-grid.stories.js

@@ -54,7 +54,7 @@ function Default() {
         state,
     });
     return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(toggle_1.Toggle, { label: "No border", value: noBorder, onChange: (value) => setNoBorder(!!value) }),
+        react_1.default.createElement(toggle_1.Toggle, { label: "No border", value: noBorder, onChange: (value) => setNoBorder(!!value), name: "noBorder" }),
         react_1.default.createElement(data_grid_1.DataGrid, { onReload: onReload, state: state, actions: actions, data: data, isLoading: isLoading, error: error, schema: schema_1.schema, onCsvDownload: console.log, noBorder: noBorder, isRowSelectable: true, actionCell: {
                 width: 100,
                 Component: () => {

package/filter-handler/bool-filter.js

@@ -11,7 +11,7 @@ const BoolFilterHandler = {
             { id: "", label: "Nerozhoduje" },
             { id: 1, label: "Ano" },
             { id: 0, label: "Ne" },
-        ], label: props.filter.label, value: props.value.value, onChange: (value) => props.onFilter({ ...props.value, value }), isClearable: true })),
+        ], label: props.filter.label, value: props.value.value, onChange: (value) => props.onFilter({ ...props.value, value }), isClearable: true, name: props.filter.name })),
     listItem: (props) => (react_1.default.createElement(chip_1.Chip, { onClose: props.onClear },
         props.filter.label,
         ":\u00A0",

package/filter-handler/boolean-filter.js

@@ -7,7 +7,7 @@ const checkbox_input_1 = require("@uxf/ui/checkbox-input");
 const chip_1 = require("@uxf/ui/chip");
 const react_1 = __importDefault(require("react"));
 const BooleanFilterHandler = {
-    input: (props) => (react_1.default.createElement(checkbox_input_1.CheckboxInput, { label: props.filter.label, value: props.value.value, onChange: (value) => props.onFilter({ ...props.value, value: value === true ? value : undefined }) })),
+    input: (props) => (react_1.default.createElement(checkbox_input_1.CheckboxInput, { label: props.filter.label, value: props.value.value, onChange: (value) => props.onFilter({ ...props.value, value: value === true ? value : undefined }), name: props.filter.name })),
     listItem: (props) => (react_1.default.createElement(chip_1.Chip, { onClose: props.onClear },
         props.filter.label,
         ":\u00A0",

package/filter-handler/date.js

@@ -19,8 +19,8 @@ const date = {
             react_1.default.createElement(date_picker_input_1.DatePickerInput, { value: initializedValue.value.from, onChange: (changedValue) => props.onFilter({
                     ...initializedValue,
                     value: { ...initializedValue.value, from: changedValue },
-                }), label: `${props.filter.label} (od)` }),
-            react_1.default.createElement(date_picker_input_1.DatePickerInput, { value: initializedValue.value.to, onChange: (changedValue) => props.onFilter({ ...initializedValue, value: { ...initializedValue.value, to: changedValue } }), label: `${props.filter.label} (do)` })));
+                }), label: `${props.filter.label} (od)`, name: props.filter.name }),
+            react_1.default.createElement(date_picker_input_1.DatePickerInput, { value: initializedValue.value.to, onChange: (changedValue) => props.onFilter({ ...initializedValue, value: { ...initializedValue.value, to: changedValue } }), label: `${props.filter.label} (do)`, name: props.filter.name })));
     },
     listItem: function (props) {
         if ((0, is_nil_1.isNil)(props.value.value)) {

package/filter-handler/interval-filter.js

@@ -23,7 +23,7 @@ const IntervalFilterHandler = {
                                 from: val ? parseInt(val, 10) : null,
                             },
                         });
-                    } }),
+                    }, name: props.filter.name }),
                 react_1.default.createElement("div", { className: "uxf-data-grid__filter-gap" }, "\u2013"),
                 react_1.default.createElement(text_input_1.TextInput, { label: `${props.filter.label} do:`, value: props.value.value ? props.value.value.to : "", onChange: (val) => {
                         return props.onFilter({
@@ -33,7 +33,7 @@ const IntervalFilterHandler = {
                                 to: val ? parseInt(val, 10) : null,
                             },
                         });
-                    } }))));
+                    }, name: props.filter.name }))));
     },
     listItem: (props) => {
         if (!props.value.value) {

package/filter-handler/multi-select.js

@@ -15,7 +15,7 @@ const multiSelect = {
                     ...props.value,
                     value: (0, is_nil_1.isNil)(value) || value.length === 0 ? null : value.map((item) => item.id),
                 });
-            } }));
+            }, name: props.filter.name }));
     },
     listItem: (props) => {
         return (react_1.default.createElement(chip_1.Chip, { onClose: props.onClear },

package/filter-handler/select-filter.js

@@ -9,7 +9,7 @@ const react_1 = __importDefault(require("react"));
 const SelectFilterHandler = {
     input: (props) => {
         var _a;
-        return (react_1.default.createElement(select_1.Select, { options: (_a = props.filter.options) !== null && _a !== void 0 ? _a : [], label: props.filter.label, value: props.value.value, onChange: (value) => props.onFilter({ ...props.value, value }), isClearable: true }));
+        return (react_1.default.createElement(select_1.Select, { options: (_a = props.filter.options) !== null && _a !== void 0 ? _a : [], label: props.filter.label, value: props.value.value, onChange: (value) => props.onFilter({ ...props.value, value }), isClearable: true, name: props.filter.name }));
     },
     listItem: (props) => {
         var _a, _b, _c;

package/filter-handler/text-filter.js

@@ -9,7 +9,7 @@ const react_1 = __importDefault(require("react"));
 const TextFilterHandler = {
     input: (props) => {
         var _a;
-        return (react_1.default.createElement(text_input_1.TextInput, { label: props.filter.label, value: (_a = props.value.value) !== null && _a !== void 0 ? _a : "", onChange: (value) => props.onFilter({ ...props.value, value }) }));
+        return (react_1.default.createElement(text_input_1.TextInput, { label: props.filter.label, value: (_a = props.value.value) !== null && _a !== void 0 ? _a : "", onChange: (value) => props.onFilter({ ...props.value, value }), name: props.filter.name }));
     },
     listItem: (props) => {
         if (!props.value.value) {

package/fulltext-input/fulltext-input.js

@@ -8,6 +8,6 @@ const icon_1 = require("@uxf/ui/icon");
 const text_input_1 = require("@uxf/ui/text-input");
 const react_1 = __importDefault(require("react"));
 function FulltextInput(props) {
-    return (react_1.default.createElement(text_input_1.TextInput, { value: props.state.request.search, onChange: props.actions.search, placeholder: "Pi\u0161te pro hled\u00E1n\u00ED", className: "uxf-data-grid__plugin-fulltext", size: "small", leftElement: react_1.default.createElement(icon_1.Icon, { name: "search", size: 16 }), label: "Vyhled\u00E1v\u00E1n\u00ED", hiddenLabel: true }));
+    return (react_1.default.createElement(text_input_1.TextInput, { value: props.state.request.search, onChange: props.actions.search, placeholder: "Pi\u0161te pro hled\u00E1n\u00ED", className: "uxf-data-grid__plugin-fulltext", size: "small", leftElement: react_1.default.createElement(icon_1.Icon, { name: "search", size: 16 }), label: "Vyhled\u00E1v\u00E1n\u00ED", hiddenLabel: true, name: "fulltext" }));
 }
 exports.FulltextInput = FulltextInput;

package/hidden-columns/hidden-columns.js

@@ -9,7 +9,7 @@ const react_1 = __importDefault(require("react"));
 function HiddenColumns(props) {
     return (react_1.default.createElement("div", { className: "uxf-data-grid__toolbar-control-columns" }, props.schema.columns.map((column) => {
         var _a, _b;
-        return (react_1.default.createElement(toggle_1.Toggle, { key: column.name, label: typeof column.label === "string" ? column.label : "", value: !((_b = (_a = props.state.userConfig.columns) === null || _a === void 0 ? void 0 : _a[column.name]) === null || _b === void 0 ? void 0 : _b.isHidden), onChange: (value) => value ? props.actions.showColumn(column.name) : props.actions.hideColumn(column.name) }));
+        return (react_1.default.createElement(toggle_1.Toggle, { key: column.name, label: typeof column.label === "string" ? column.label : "", value: !((_b = (_a = props.state.userConfig.columns) === null || _a === void 0 ? void 0 : _a[column.name]) === null || _b === void 0 ? void 0 : _b.isHidden), onChange: (value) => value ? props.actions.showColumn(column.name) : props.actions.hideColumn(column.name), name: column.name }));
     })));
 }
 exports.HiddenColumns = HiddenColumns;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uxf/data-grid",
-  "version": "11.11.0",
+  "version": "11.11.3",
   "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.11.0",
+    "@uxf/ui": "11.11.3",
     "dayjs": "1.11.10",
     "fast-glob": "3.3.2",
     "qs": "6.11.2",
@@ -43,7 +43,7 @@
     "react-dom": ">=18.2.0"
   },
   "devDependencies": {
-    "@types/react": "18.2.57",
+    "@types/react": "18.2.63",
     "@types/react-dom": "18.2.19",
     "react": "18.2.0",
     "react-dom": "18.2.0"

package/rows-per-page-select/rows-per-page-select.js

@@ -15,6 +15,6 @@ const PER_PAGE_OPTIONS = [
 function RowsPerPageSelect(props) {
     return (react_1.default.createElement("div", { className: "uxf-data-grid__rows-per-page" },
         react_1.default.createElement("label", { htmlFor: "uxf-data-grid--select-per-page" }, "Po\u010Det \u0159\u00E1dk\u016F"),
-        react_1.default.createElement(select_1.Select, { id: "uxf-data-grid--select-per-page", value: props.state.request.perPage, onChange: (value) => props.actions.changePerPage(value !== null && value !== void 0 ? value : 10), options: PER_PAGE_OPTIONS, size: "small", label: "Po\u010Det \u0159\u00E1dk\u016F", hiddenLabel: true })));
+        react_1.default.createElement(select_1.Select, { id: "uxf-data-grid--select-per-page", value: props.state.request.perPage, onChange: (value) => props.actions.changePerPage(value !== null && value !== void 0 ? value : 10), options: PER_PAGE_OPTIONS, size: "small", label: "Po\u010Det \u0159\u00E1dk\u016F", hiddenLabel: true, name: "rows-per-page" })));
 }
 exports.RowsPerPageSelect = RowsPerPageSelect;

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

@@ -1,11 +1,31 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
+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.SelectRowCheckbox = void 0;
 const checkbox_1 = require("@uxf/ui/checkbox");
-const react_1 = __importDefault(require("react"));
+const react_1 = __importStar(require("react"));
 function SelectRowCheckbox(props) {
     var _a;
     const handleChange = (value, e) => {
@@ -14,7 +34,8 @@ function SelectRowCheckbox(props) {
             props.onChange(value, shiftKey);
         }
     };
+    const id = (0, react_1.useId)();
     return (react_1.default.createElement("div", { className: "uxf-data-grid__select-row-checkbox-wrapper" },
-        react_1.default.createElement(checkbox_1.Checkbox, { ...props, value: (_a = props.checked) !== null && _a !== void 0 ? _a : false, onChange: handleChange })));
+        react_1.default.createElement(checkbox_1.Checkbox, { ...props, value: (_a = props.checked) !== null && _a !== void 0 ? _a : false, onChange: handleChange, name: id })));
 }
 exports.SelectRowCheckbox = SelectRowCheckbox;