@uxf/data-grid 11.74.0 → 11.74.2

package/data-grid-custom-example.stories.js

@@ -0,0 +1,58 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataGrid = DataGrid;
+const empty_array_1 = require("@uxf/core/constants/empty-array");
+const react_1 = __importDefault(require("react"));
+const loader_1 = require("./_story-utils/loader");
+const schema_1 = require("./_story-utils/schema");
+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 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 use_data_grid_control_1 = require("./use-data-grid-control");
+const use_data_grid_fetching_1 = require("./use-data-grid-fetching");
+function DataGrid() {
+    var _a, _b, _c, _d;
+    /** implement me - can be given by props */
+    const schema = schema_1.schema;
+    const filterHandlers = filter_handler_1.defaultFilterHandlers;
+    const bodyCells = body_cell_1.BodyCells;
+    const actionCell = undefined;
+    const toolbarCustomButtons = [];
+    /** END implement me */
+    const control = (0, use_data_grid_control_1.useDataGridControl)({ schema });
+    const { isLoading, error, data, reload } = (0, use_data_grid_fetching_1.useDataGridFetching)({
+        loader: loader_1.loader,
+        schema,
+        state: control.state,
+        isWithTabCounts: true,
+    });
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(root_1.DataGridRoot, null,
+            react_1.default.createElement(toolbar_1.DataGridToolbar, null,
+                react_1.default.createElement(toolbar_tabs_1.DataGridToolbarTabs, { ...control, schema: schema, tabCounts: data === null || data === void 0 ? void 0 : data.tabCounts }),
+                react_1.default.createElement(toolbar_control_1.DataGridToolbarControl, { ...control, filterHandlers: filterHandlers, schema: schema }),
+                react_1.default.createElement(toolbar_customs_1.DataGridToolbarCustoms, { buttons: toolbarCustomButtons })),
+            react_1.default.createElement(linear_progress_1.DataGridLinearProgress, { isLoading: isLoading }),
+            react_1.default.createElement(filter_list_1.DataGridFilterList, { ...control, filterHandlers: filterHandlers, schema: schema }),
+            react_1.default.createElement(table_v2_1.DataGridTableV2, { ...control, actionCell: actionCell, bodyCells: bodyCells, data: (_a = data === null || data === void 0 ? void 0 : data.result) !== null && _a !== void 0 ? _a : empty_array_1.EMPTY_ARRAY, error: error, isLoading: isLoading, reload: reload, schema: schema }),
+            react_1.default.createElement(footer_1.DataGridFooter, null,
+                react_1.default.createElement(rows_per_page_select_1.DataGridRowsPerPageSelect, { ...control }),
+                react_1.default.createElement(row_counts_1.DataGridRowCounts, { ...control, count: (_b = data === null || data === void 0 ? void 0 : data.count) !== null && _b !== void 0 ? _b : 0, totalCount: (_c = data === null || data === void 0 ? void 0 : data.totalCount) !== null && _c !== void 0 ? _c : 0 }),
+                react_1.default.createElement(pagination_1.DataGridPagination, { ...control, count: (_d = data === null || data === void 0 ? void 0 : data.count) !== null && _d !== void 0 ? _d : 0 }))),
+        react_1.default.createElement(selected_rows_toolbar_1.DataGridSelectedRowsToolbar, { ...control, reload: reload })));
+}

package/data-grid-v2.d.ts

@@ -0,0 +1,3 @@
+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

@@ -0,0 +1,41 @@
+"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 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 DefaultSelectedRowsToolbarActions = () => null;
+function DataGridV2(props) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(root_1.DataGridRoot, { className: props.className },
+            react_1.default.createElement(toolbar_1.DataGridToolbar, null,
+                react_1.default.createElement(toolbar_tabs_1.DataGridToolbarTabs, { actions: props.actions, changeTabFilterBehavior: props.changeTabFilterBehavior, 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, getCsvDownloadUrl: props.getCsvDownloadUrl, 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, 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(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 }),
+                react_1.default.createElement(pagination_1.DataGridPagination, { actions: props.actions, count: (_l = (_k = props.data) === null || _k === void 0 ? void 0 : _k.count) !== null && _l !== void 0 ? _l : 0, showFirstButton: true, showLastButton: true, size: "sm", state: props.state }))),
+        react_1.default.createElement(selected_rows_toolbar_1.DataGridSelectedRowsToolbar, { Actions: (_m = props.SelectedRowsToolbarActions) !== null && _m !== void 0 ? _m : DefaultSelectedRowsToolbarActions, actions: props.actions, reload: props.reload, state: props.state })));
+}

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

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

package/data-grid-v2.stories.js

@@ -0,0 +1,99 @@
+"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 build_array_1 = require("@uxf/core/utils/build-array");
+const radio_group_1 = require("@uxf/ui/radio-group");
+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 action_cell_1 = require("./table-v2/components/action-cell");
+const use_data_grid_control_1 = require("./use-data-grid-control");
+const use_data_grid_fetching_1 = require("./use-data-grid-fetching");
+const local_storage_1 = require("./user-config-storage-adapters/local-storage");
+const merge_schema_with_config_1 = require("./utils/merge-schema-with-config");
+const actionCell = {
+    width: 92,
+    Component: () => {
+        const actionCellActions = (0, build_array_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(action_cell_1.ActionCell, { buttons: actionCellActions, visibleButtonsCount: 1 });
+    },
+};
+const schemaWithFrontendConfig = (0, merge_schema_with_config_1.mergeSchemaWithConfig)(schema_1.schema, {
+    perPage: 100,
+    columns: {
+        text: { width: 200 },
+        tel: { minWidth: 160, width: 400 },
+        mail: { minWidth: 200 },
+        bool: { width: 120 },
+        chips: { minWidth: 200 },
+        toMany: { minWidth: 200 },
+        money: { width: "2fr" },
+    },
+    filters: {
+        text: { placeholder: "Custom placeholder ..." },
+    },
+});
+const FILTER_BEHAVIOR_OPTIONS = [
+    { id: "filtersPerTab", label: "filterPerTab" },
+    { id: "sharedFiltersAndSearch", label: "sharedFiltersAndSearch" },
+    { id: "sharedFiltersAndSearchAndSort", label: "sharedFiltersAndSearchAndSort" },
+];
+function Default() {
+    const [filterBehavior, setFilterBehavior] = (0, react_1.useState)("filtersPerTab");
+    const { middleware, useUserConfig } = (0, local_storage_1.useUserConfigLocalStorageAdapter)(schema_1.schema);
+    const { state, actions } = (0, use_data_grid_control_1.useDataGridControl)({
+        schema: schema_1.schema,
+        middleware,
+    });
+    useUserConfig(actions);
+    const { isLoading, error, data, reload } = (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(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(json_renderer_1.JsonRenderer, { value: state })));
+}

package/data-grid.d.ts

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

package/data-grid.js

@@ -0,0 +1,42 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataGrid = DataGrid;
+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_1 = require("./table");
+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 DefaultSelectedRowsToolbarActions = () => null;
+function DataGrid(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 },
+            react_1.default.createElement(toolbar_1.DataGridToolbar, null,
+                react_1.default.createElement(toolbar_tabs_1.DataGridToolbarTabs, { actions: props.actions, changeTabFilterBehavior: props.changeTabFilterBehavior, 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, getCsvDownloadUrl: props.getCsvDownloadUrl, 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, 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(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 }),
+                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, reload: props.reload, state: props.state })));
+}

package/data-grid.stories.d.ts

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

package/data-grid.stories.js

@@ -0,0 +1,106 @@
+"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 build_array_1 = require("@uxf/core/utils/build-array");
+const radio_group_1 = require("@uxf/ui/radio-group");
+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_1 = require("./data-grid");
+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, build_array_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 ..." },
+    },
+});
+const FILTER_BEHAVIOR_OPTIONS = [
+    { id: "filtersPerTab", label: "filterPerTab" },
+    { id: "sharedFiltersAndSearch", label: "sharedFiltersAndSearch" },
+    { id: "sharedFiltersAndSearchAndSort", label: "sharedFiltersAndSearchAndSort" },
+];
+function Default() {
+    const [filterBehavior, setFilterBehavior] = (0, react_1.useState)("filtersPerTab");
+    const { state, actions } = (0, use_data_grid_control_1.useDataGridControl)({
+        schema: schema_1.schema,
+        initialUserConfig: {
+            columns: {
+                id: { width: 60 },
+                link: { width: 200 },
+                day: { width: 150 },
+                dayAndTime: { width: 200 },
+                text: { minWidth: 150 },
+                mail: { minWidth: 150 },
+                tel: { minWidth: 150 },
+                uuid: { minWidth: 300 },
+                chip: { minWidth: 100 },
+                chips: { minWidth: 200 },
+                money: { minWidth: 100 },
+                toOne: { minWidth: 150 },
+                toMany: { minWidth: 200 },
+            },
+        },
+    });
+    const { isLoading, error, data, reload } = (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(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(json_renderer_1.JsonRenderer, { value: state })));
+}

package/export-button/export-button.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+import { CsvDownloadGetUrl, Schema } from "../types";
+import { DataGridControl } from "../use-data-grid-control";
+export interface DataGridExportButtonProps extends DataGridControl {
+    getCsvDownloadUrl: CsvDownloadGetUrl;
+    schema: Schema<any>;
+}
+export declare function DataGridExportButton(props: DataGridExportButtonProps): React.JSX.Element;

package/export-button/export-button.js

@@ -0,0 +1,18 @@
+"use strict";
+"use client";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataGridExportButton = DataGridExportButton;
+const translations_1 = require("@uxf/core-react/translations");
+const download_file_1 = require("@uxf/core/utils/download-file");
+const button_1 = require("@uxf/ui/button");
+const icon_1 = require("@uxf/ui/icon");
+const react_1 = __importDefault(require("react"));
+const utils_1 = require("../utils");
+function DataGridExportButton(props) {
+    const t = (0, translations_1.useUxfTranslation)();
+    return (react_1.default.createElement(button_1.Button, { className: "uxf-data-grid__plugin-button", isIconButton: true, onClick: () => (0, download_file_1.downloadFile)(props.getCsvDownloadUrl((0, utils_1.createRequest)(props.state.request)), "export.csv"), size: "sm", title: t("uxf-data-grid-export-button:download-csv"), variant: "secondary" },
+        react_1.default.createElement(icon_1.Icon, { name: "file-arrow-down" })));
+}

package/export-button/export-button.stories.d.ts

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

package/export-button/export-button.stories.js

@@ -0,0 +1,17 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Default = Default;
+const react_1 = __importDefault(require("react"));
+const json_renderer_1 = require("../_story-utils/json-renderer");
+const schema_1 = require("../_story-utils/schema");
+const use_data_grid_control_1 = require("../use-data-grid-control");
+const export_button_1 = require("./export-button");
+function Default() {
+    const { state, actions } = (0, use_data_grid_control_1.useDataGridControl)({ schema: schema_1.schema });
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(export_button_1.DataGridExportButton, { actions: actions, getCsvDownloadUrl: () => "", schema: schema_1.schema, state: state }),
+        react_1.default.createElement(json_renderer_1.JsonRenderer, { value: state })));
+}

package/export-button/index.d.ts

@@ -0,0 +1 @@
+export * from "./export-button";

package/export-button/index.js

@@ -0,0 +1,17 @@
+"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("./export-button"), exports);

package/filter-handler/boolean-select.d.ts

@@ -0,0 +1,4 @@
+import { FilterHandler } from "./types";
+type StateValue = 1 | 0 | null;
+declare const filterHandler: FilterHandler<StateValue>;
+export default filterHandler;

package/filter-handler/boolean-select.js

@@ -0,0 +1,27 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const translations_1 = require("@uxf/core-react/translations");
+const chip_1 = require("@uxf/ui/chip");
+const select_1 = require("@uxf/ui/select");
+const react_1 = __importDefault(require("react"));
+const filterHandler = {
+    Input(props) {
+        var _a;
+        const t = (0, translations_1.useUxfTranslation)();
+        return (react_1.default.createElement(select_1.Select, { isClearable: true, label: props.filter.label, name: props.filter.name, onChange: (value) => props.onChange(value), options: [
+                { id: 1, label: t("uxf-data-grid-boolean-filter:yes") },
+                { id: 0, label: t("uxf-data-grid-boolean-filter:no") },
+            ], placeholder: (_a = props.filter.config) === null || _a === void 0 ? void 0 : _a.placeholder, value: props.value }));
+    },
+    ListItem(props) {
+        const t = (0, translations_1.useUxfTranslation)();
+        return (react_1.default.createElement(chip_1.Chip, { onClose: props.onClear },
+            props.filter.label,
+            ":\u00A0",
+            props.value ? t("uxf-data-grid-boolean-filter:yes") : t("uxf-data-grid-boolean-filter:no")));
+    },
+};
+exports.default = filterHandler;

package/filter-handler/checkbox.d.ts

@@ -0,0 +1,4 @@
+import { FilterHandler } from "./types";
+type StateValue = boolean | undefined;
+declare const filterHandler: FilterHandler<StateValue>;
+export default filterHandler;

package/filter-handler/checkbox.js

@@ -0,0 +1,19 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const checkbox_input_1 = require("@uxf/ui/checkbox-input");
+const chip_1 = require("@uxf/ui/chip");
+const react_1 = __importDefault(require("react"));
+const filterHandler = {
+    Input(props) {
+        var _a;
+        return (react_1.default.createElement(checkbox_input_1.CheckboxInput, { label: props.filter.label, name: props.filter.name, onChange: (value) => props.onChange(value ? value : undefined), value: (_a = props.value) !== null && _a !== void 0 ? _a : false }));
+    },
+    ListItem: (props) => (react_1.default.createElement(chip_1.Chip, { onClose: props.onClear },
+        props.filter.label,
+        ":\u00A0",
+        props.value ? "Ano" : "Ne")),
+};
+exports.default = filterHandler;

package/filter-handler/date.d.ts

@@ -0,0 +1,7 @@
+import { FilterHandler } from "./types";
+type StateValue = {
+    from?: string;
+    to?: string;
+} | undefined;
+declare const filterHandler: FilterHandler<StateValue>;
+export default filterHandler;

package/filter-handler/date.js

@@ -0,0 +1,96 @@
+"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;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const filter_nullish_1 = require("@uxf/core/utils/filter-nullish");
+const is_nil_1 = require("@uxf/core/utils/is-nil");
+const chip_1 = require("@uxf/ui/chip");
+const date_picker_input_1 = require("@uxf/ui/date-picker-input");
+const dayjs_1 = __importDefault(require("dayjs"));
+const react_1 = __importStar(require("react"));
+const filterHandler = {
+    Input(props) {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+        const [date, setDate] = (0, react_1.useState)();
+        const onChangeFrom = (value) => {
+            var _a, _b;
+            if ((0, is_nil_1.isNil)(value) && (0, is_nil_1.isNil)((_a = props.value) === null || _a === void 0 ? void 0 : _a.to)) {
+                props.onChange(undefined);
+                setDate(null);
+            }
+            else {
+                if ((0, dayjs_1.default)(value, date_picker_input_1.OUTPUT_DATE_FORMAT, true).isValid()) {
+                    props.onChange({ ...props.value, from: value !== null && value !== void 0 ? value : undefined });
+                    setDate(null);
+                }
+                else {
+                    setDate({ from: value, to: ((_b = props.value) === null || _b === void 0 ? void 0 : _b.to) || null });
+                    if ((0, is_nil_1.isNil)(value)) {
+                        props.onChange({ ...props.value, from: undefined });
+                    }
+                }
+            }
+        };
+        const onChangeTo = (value) => {
+            var _a, _b;
+            if ((0, is_nil_1.isNil)(value) && (0, is_nil_1.isNil)((_a = props.value) === null || _a === void 0 ? void 0 : _a.from)) {
+                props.onChange(undefined);
+                setDate(null);
+            }
+            else {
+                if ((0, dayjs_1.default)(value, date_picker_input_1.OUTPUT_DATE_FORMAT, true).isValid()) {
+                    props.onChange({ ...props.value, to: value !== null && value !== void 0 ? value : undefined });
+                    setDate(null);
+                }
+                else {
+                    setDate({ from: ((_b = props.value) === null || _b === void 0 ? void 0 : _b.from) || null, to: value });
+                    if ((0, is_nil_1.isNil)(value)) {
+                        props.onChange({ ...props.value, to: undefined });
+                    }
+                }
+            }
+        };
+        return (react_1.default.createElement("div", { className: "uxf-data-grid__filter uxf-data-grid__filter--date" },
+            react_1.default.createElement(date_picker_input_1.DatePickerInput, { isClearable: true, label: `${props.filter.label} (od)`, maxDate: (_a = props.value) === null || _a === void 0 ? void 0 : _a.to, name: `${props.filter.name}.from`, onChange: onChangeFrom, placeholder: (_b = props.filter.config) === null || _b === void 0 ? void 0 : _b.placeholder, value: (_e = (_c = date === null || date === void 0 ? void 0 : date.from) !== null && _c !== void 0 ? _c : (_d = props.value) === null || _d === void 0 ? void 0 : _d.from) !== null && _e !== void 0 ? _e : null }),
+            react_1.default.createElement(date_picker_input_1.DatePickerInput, { isClearable: true, label: `${props.filter.label} (do)`, minDate: (_f = props.value) === null || _f === void 0 ? void 0 : _f.from, name: `${props.filter.name}.to`, onChange: onChangeTo, placeholder: (_g = props.filter.config) === null || _g === void 0 ? void 0 : _g.placeholder, value: (_k = (_h = date === null || date === void 0 ? void 0 : date.to) !== null && _h !== void 0 ? _h : (_j = props.value) === null || _j === void 0 ? void 0 : _j.to) !== null && _k !== void 0 ? _k : null })));
+    },
+    ListItem: function (props) {
+        var _a, _b;
+        if ((0, is_nil_1.isNil)((_a = props.value) === null || _a === void 0 ? void 0 : _a.from) && (0, is_nil_1.isNil)((_b = props.value) === null || _b === void 0 ? void 0 : _b.to)) {
+            return null;
+        }
+        const formatDate = [
+            props.value.from ? "od " + (0, dayjs_1.default)(props.value.from).format("l") : null,
+            props.value.to ? "do " + (0, dayjs_1.default)(props.value.to).format("l") : null,
+        ];
+        return (react_1.default.createElement(chip_1.Chip, { onClose: props.onClear },
+            props.filter.label,
+            ": ",
+            (0, filter_nullish_1.filterNullish)(formatDate).join(" ")));
+    },
+};
+exports.default = filterHandler;

package/filter-handler/datetime.d.ts

@@ -0,0 +1,7 @@
+import { FilterHandler } from "./types";
+type StateValue = {
+    from?: string;
+    to?: string;
+} | undefined;
+declare const filterHandler: FilterHandler<StateValue>;
+export default filterHandler;