@uxf/data-grid 11.74.0 → 11.74.2

package/filter-handler/datetime.js

@@ -0,0 +1,34 @@
+"use strict";
+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 datetime_picker_input_1 = require("@uxf/ui/datetime-picker-input");
+const dayjs_1 = __importDefault(require("dayjs"));
+const react_1 = __importDefault(require("react"));
+const filterHandler = {
+    Input(props) {
+        var _a, _b, _c, _d, _e, _f, _g, _h;
+        return (react_1.default.createElement("div", { className: "uxf-data-grid__filter uxf-data-grid__filter--datetime" },
+            react_1.default.createElement(datetime_picker_input_1.DatetimePickerInput, { 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: (value) => props.onChange({ ...props.value, from: value !== null && value !== void 0 ? value : undefined }), placeholder: (_b = props.filter.config) === null || _b === void 0 ? void 0 : _b.placeholder, value: (_d = (_c = props.value) === null || _c === void 0 ? void 0 : _c.from) !== null && _d !== void 0 ? _d : null }),
+            react_1.default.createElement(datetime_picker_input_1.DatetimePickerInput, { isClearable: true, label: `${props.filter.label} (do)`, minDate: (_e = props.value) === null || _e === void 0 ? void 0 : _e.from, name: `${props.filter.name}.to`, onChange: (value) => props.onChange({ ...props.value, to: value !== null && value !== void 0 ? value : undefined }), placeholder: (_f = props.filter.config) === null || _f === void 0 ? void 0 : _f.placeholder, value: (_h = (_g = props.value) === null || _g === void 0 ? void 0 : _g.to) !== null && _h !== void 0 ? _h : 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 LT") : null,
+            props.value.to ? "do " + (0, dayjs_1.default)(props.value.to).format("l LT") : 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/entity-multi-select.d.ts

@@ -0,0 +1,5 @@
+import { MultiComboboxProps } from "@uxf/ui/multi-combobox";
+import { FilterHandler } from "./types";
+type StateValue = MultiComboboxProps["value"];
+declare const filterHandler: FilterHandler<StateValue>;
+export default filterHandler;

package/filter-handler/entity-multi-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 is_empty_1 = require("@uxf/core/utils/is-empty");
+const is_nil_1 = require("@uxf/core/utils/is-nil");
+const chip_1 = require("@uxf/ui/chip");
+const multi_combobox_1 = require("@uxf/ui/multi-combobox");
+const react_1 = __importDefault(require("react"));
+const _api_1 = require("../_api");
+const filterHandler = {
+    Input(props) {
+        var _a;
+        return (react_1.default.createElement(multi_combobox_1.MultiCombobox, { label: props.filter.label, loadOptions: (term) => { var _a; return (0, _api_1.dataGridAutocomplete)((_a = props.filter.autocomplete) !== null && _a !== void 0 ? _a : "", term); }, name: props.filter.name, onChange: (value) => props.onChange(value), placeholder: (_a = props.filter.config) === null || _a === void 0 ? void 0 : _a.placeholder, value: props.value }));
+    },
+    ListItem(props) {
+        if ((0, is_nil_1.isNil)(props.value) || (0, is_empty_1.isEmpty)(props.value)) {
+            return null;
+        }
+        return (react_1.default.createElement(chip_1.Chip, { onClose: props.onClear },
+            props.filter.label,
+            ":\u00A0",
+            props.value.map((item) => item.label).join(", ")));
+    },
+};
+exports.default = filterHandler;

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

@@ -0,0 +1,5 @@
+import { ComboboxProps } from "@uxf/ui/combobox";
+import { FilterHandler } from "./types";
+type StateValue = ComboboxProps["value"];
+declare const filterHandler: FilterHandler<StateValue>;
+export default filterHandler;

package/filter-handler/entity-select.js

@@ -0,0 +1,23 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const chip_1 = require("@uxf/ui/chip");
+const combobox_1 = require("@uxf/ui/combobox");
+const react_1 = __importDefault(require("react"));
+const _api_1 = require("../_api");
+const filterHandler = {
+    Input(props) {
+        var _a;
+        return (react_1.default.createElement(combobox_1.Combobox, { isClearable: true, label: props.filter.label, loadOptions: (term) => { var _a; return (0, _api_1.dataGridAutocomplete)((_a = props.filter.autocomplete) !== null && _a !== void 0 ? _a : "", term); }, name: props.filter.name, onChange: (value) => props.onChange(value), placeholder: (_a = props.filter.config) === null || _a === void 0 ? void 0 : _a.placeholder, value: props.value }));
+    },
+    ListItem(props) {
+        var _a;
+        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.label));
+    },
+};
+exports.default = filterHandler;

package/filter-handler/index.d.ts

@@ -0,0 +1,4 @@
+import { FilterHandler } from "./types";
+export * from "./types";
+export type FilterHandlers = Partial<Record<string, FilterHandler<any>>>;
+export declare const defaultFilterHandlers: FilterHandlers;

package/filter-handler/index.js

@@ -0,0 +1,41 @@
+"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);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.defaultFilterHandlers = void 0;
+const checkbox_1 = __importDefault(require("./checkbox"));
+const date_1 = __importDefault(require("./date"));
+const datetime_1 = __importDefault(require("./datetime"));
+const entity_multi_select_1 = __importDefault(require("./entity-multi-select"));
+const entity_select_1 = __importDefault(require("./entity-select"));
+const interval_1 = __importDefault(require("./interval"));
+const multi_select_1 = __importDefault(require("./multi-select"));
+const select_1 = __importDefault(require("./select"));
+const string_1 = __importDefault(require("./string"));
+__exportStar(require("./types"), exports);
+exports.defaultFilterHandlers = {
+    date: date_1.default,
+    datetime: datetime_1.default,
+    entityMultiSelect: entity_multi_select_1.default,
+    entitySelect: entity_select_1.default,
+    checkbox: checkbox_1.default,
+    interval: interval_1.default,
+    multiSelect: multi_select_1.default,
+    select: select_1.default,
+    string: string_1.default,
+};

package/filter-handler/interval.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/interval.js

@@ -0,0 +1,47 @@
+"use strict";
+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_empty_1 = require("@uxf/core/utils/is-empty");
+const is_nil_1 = require("@uxf/core/utils/is-nil");
+const chip_1 = require("@uxf/ui/chip");
+const text_input_1 = require("@uxf/ui/text-input");
+const react_1 = __importDefault(require("react"));
+const filterHandler = {
+    Input(props) {
+        var _a, _b, _c, _d, _e, _f, _g, _h;
+        const onChangeFrom = (value) => {
+            var _a;
+            return (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)
+                : props.onChange({ ...props.value, from: value });
+        };
+        const onChangeTo = (value) => {
+            var _a;
+            return (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)
+                : props.onChange({ ...props.value, to: value });
+        };
+        return (react_1.default.createElement("div", { className: "uxf-data-grid__filter uxf-data-grid__filter--interval" },
+            react_1.default.createElement(text_input_1.TextInput, { label: `${props.filter.label} (od)`, max: (_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, type: "number", value: (_d = (_c = props.value) === null || _c === void 0 ? void 0 : _c.from) !== null && _d !== void 0 ? _d : "" }),
+            react_1.default.createElement(text_input_1.TextInput, { label: `${props.filter.label} (do)`, min: (_e = props.value) === null || _e === void 0 ? void 0 : _e.from, name: `${props.filter.name}.to`, onChange: onChangeTo, placeholder: (_f = props.filter.config) === null || _f === void 0 ? void 0 : _f.placeholder, type: "number", value: (_h = (_g = props.value) === null || _g === void 0 ? void 0 : _g.to) !== null && _h !== void 0 ? _h : "" })));
+    },
+    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_empty_1.isEmpty)(props.value.from)) &&
+            ((0, is_nil_1.isNil)((_b = props.value) === null || _b === void 0 ? void 0 : _b.to) || (0, is_empty_1.isEmpty)(props.value.to))) {
+            return null;
+        }
+        const interval = [
+            props.value.from ? "od " + props.value.from : null,
+            props.value.to ? "do " + props.value.to : null,
+        ];
+        return (react_1.default.createElement(chip_1.Chip, { onClose: props.onClear },
+            props.filter.label,
+            ": ",
+            (0, filter_nullish_1.filterNullish)(interval).join(" ")));
+    },
+};
+exports.default = filterHandler;

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

@@ -0,0 +1,5 @@
+import { MultiSelectProps } from "@uxf/ui/multi-select";
+import { FilterHandler } from "./types";
+type StateValue = MultiSelectProps["value"];
+declare const filterHandler: FilterHandler<StateValue>;
+export default filterHandler;

package/filter-handler/multi-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 empty_array_1 = require("@uxf/core/constants/empty-array");
+const is_empty_1 = require("@uxf/core/utils/is-empty");
+const chip_1 = require("@uxf/ui/chip");
+const multi_select_1 = require("@uxf/ui/multi-select");
+const react_1 = __importDefault(require("react"));
+const filterHandler = {
+    Input(props) {
+        var _a, _b;
+        const onChange = (value) => {
+            props.onChange(Array.isArray(value) && !(0, is_empty_1.isEmpty)(value) ? value : null);
+        };
+        return (react_1.default.createElement(multi_select_1.MultiSelect, { label: props.filter.label, name: props.filter.name, onChange: onChange, options: (_a = props.filter.options) !== null && _a !== void 0 ? _a : empty_array_1.EMPTY_ARRAY, placeholder: (_b = props.filter.config) === null || _b === void 0 ? void 0 : _b.placeholder, value: props.value }));
+    },
+    ListItem(props) {
+        var _a;
+        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(", ")));
+    },
+};
+exports.default = filterHandler;

package/filter-handler/select.d.ts

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

package/filter-handler/select.js

@@ -0,0 +1,22 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const empty_array_1 = require("@uxf/core/constants/empty-array");
+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, _b;
+        return (react_1.default.createElement(select_1.Select, { isClearable: true, label: props.filter.label, name: props.filter.name, onChange: (value) => props.onChange(value), options: (_a = props.filter.options) !== null && _a !== void 0 ? _a : empty_array_1.EMPTY_ARRAY, placeholder: (_b = props.filter.config) === null || _b === void 0 ? void 0 : _b.placeholder, value: props.value }));
+    },
+    ListItem(props) {
+        var _a, _b, _c;
+        return (react_1.default.createElement(chip_1.Chip, { onClose: props.onClear },
+            props.filter.label,
+            ":\u00A0", (_c = (_b = (_a = props.filter.options) === null || _a === void 0 ? void 0 : _a.find((v) => v.id === props.value)) === null || _b === void 0 ? void 0 : _b.label) !== null && _c !== void 0 ? _c : ""));
+    },
+};
+exports.default = filterHandler;

package/filter-handler/string.d.ts

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

package/filter-handler/string.js

@@ -0,0 +1,26 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const is_empty_1 = require("@uxf/core/utils/is-empty");
+const is_nil_1 = require("@uxf/core/utils/is-nil");
+const chip_1 = require("@uxf/ui/chip");
+const text_input_1 = require("@uxf/ui/text-input");
+const react_1 = __importDefault(require("react"));
+const filterHandler = {
+    Input(props) {
+        var _a, _b;
+        return (react_1.default.createElement(text_input_1.TextInput, { label: props.filter.label, name: props.filter.name, onChange: (value) => props.onChange(value), placeholder: (_a = props.filter.config) === null || _a === void 0 ? void 0 : _a.placeholder, value: (_b = props.value) !== null && _b !== void 0 ? _b : "" }));
+    },
+    ListItem(props) {
+        if ((0, is_nil_1.isNil)(props.value) || (0, is_empty_1.isEmpty)(props.value)) {
+            return null;
+        }
+        return (react_1.default.createElement(chip_1.Chip, { onClose: props.onClear },
+            props.filter.label,
+            ": ",
+            props.value));
+    },
+};
+exports.default = filterHandler;

package/filter-handler/types.d.ts

@@ -0,0 +1,7 @@
+import { FunctionComponent } from "react";
+import { FilterProps } from "../types/components";
+export type FilterComponent<StateValue> = FunctionComponent<FilterProps<StateValue>>;
+export interface FilterHandler<StateValue> {
+    Input: FilterComponent<StateValue>;
+    ListItem: FilterComponent<StateValue>;
+}

package/filter-handler/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/filter-list/filter-list.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import { FilterHandlers } from "../filter-handler";
+import { Schema } from "../types";
+import { DataGridControl } from "../use-data-grid-control";
+export interface DataGridFilterListProps extends DataGridControl {
+    filterHandlers: FilterHandlers;
+    className?: string;
+    schema: Schema<any>;
+}
+export declare function DataGridFilterList(props: DataGridFilterListProps): React.JSX.Element | null;

package/filter-list/filter-list.js

@@ -0,0 +1,31 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataGridFilterList = DataGridFilterList;
+const cx_1 = require("@uxf/core/utils/cx");
+const is_empty_1 = require("@uxf/core/utils/is-empty");
+const is_nil_1 = require("@uxf/core/utils/is-nil");
+const react_1 = __importDefault(require("react"));
+const create_filter_component_props_1 = require("../utils/create-filter-component-props");
+function DataGridFilterList(props) {
+    const renderedFilters = props.state.request.f
+        .map((filterRequest) => {
+        const filter = props.schema.filters.find((f) => f.name === filterRequest.name);
+        if ((0, is_nil_1.isNil)(filter)) {
+            return null;
+        }
+        const filterHandler = props.filterHandlers[filter.type];
+        const FilterListItem = filterHandler === null || filterHandler === void 0 ? void 0 : filterHandler.ListItem;
+        if (!FilterListItem) {
+            return null;
+        }
+        return (react_1.default.createElement(FilterListItem, { key: filterRequest.name, ...(0, create_filter_component_props_1.createFilterComponentProps)(props.schema.name, filter, props.state, props.actions) }));
+    })
+        .filter(Boolean);
+    if ((0, is_empty_1.isEmpty)(renderedFilters)) {
+        return null;
+    }
+    return react_1.default.createElement("div", { className: (0, cx_1.cx)("uxf-data-grid__filter-list", props.className) }, renderedFilters);
+}

package/filter-list/filter-list.stories.d.ts

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

package/filter-list/filter-list.stories.js

@@ -0,0 +1,18 @@
+"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 filter_handler_1 = require("../filter-handler");
+const use_data_grid_control_1 = require("../use-data-grid-control");
+const filter_list_1 = require("./filter-list");
+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(filter_list_1.DataGridFilterList, { actions: actions, filterHandlers: filter_handler_1.defaultFilterHandlers, schema: schema_1.schema, state: state }),
+        react_1.default.createElement(json_renderer_1.JsonRenderer, { value: state })));
+}

package/filter-list/index.d.ts

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

package/filter-list/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("./filter-list"), exports);

package/filters/filters.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { FilterHandlers } from "../filter-handler";
+import { Schema } from "../types";
+import { DataGridControl } from "../use-data-grid-control";
+export interface DataGridFiltersProps extends DataGridControl {
+    schema: Schema<any>;
+    filterHandlers: FilterHandlers;
+}
+export declare function DataGridFilters(props: DataGridFiltersProps): React.JSX.Element;

package/filters/filters.js

@@ -0,0 +1,21 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataGridFilters = DataGridFilters;
+const react_1 = __importDefault(require("react"));
+const create_filter_component_props_1 = require("../utils/create-filter-component-props");
+function DataGridFilters(props) {
+    return (react_1.default.createElement("div", { className: "uxf-data-grid__filters" }, props.schema.filters.map((filter) => {
+        const filterHandler = props.filterHandlers[filter.type];
+        const FilterInput = filterHandler === null || filterHandler === void 0 ? void 0 : filterHandler.Input;
+        // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+        if (!FilterInput) {
+            // eslint-disable-next-line no-console
+            console.warn(`Unknown filter "${filter.type}".`);
+            return null;
+        }
+        return (react_1.default.createElement(FilterInput, { key: filter.name, ...(0, create_filter_component_props_1.createFilterComponentProps)(props.schema.name, filter, props.state, props.actions) }));
+    })));
+}

package/filters/filters.stories.d.ts

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

package/filters/filters.stories.js

@@ -0,0 +1,18 @@
+"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 filter_handler_1 = require("../filter-handler");
+const use_data_grid_control_1 = require("../use-data-grid-control");
+const filters_1 = require("./filters");
+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(filters_1.DataGridFilters, { actions: actions, filterHandlers: filter_handler_1.defaultFilterHandlers, schema: schema_1.schema, state: state }),
+        react_1.default.createElement(json_renderer_1.JsonRenderer, { value: state })));
+}

package/filters/index.d.ts

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

package/filters/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("./filters"), exports);

package/filters-button/filters-button.d.ts

@@ -0,0 +1,10 @@
+import React, { ReactNode } from "react";
+import { FilterHandlers } from "../filter-handler";
+import { Schema } from "../types";
+import { DataGridControl } from "../use-data-grid-control";
+export interface DataGridFiltersButtonProps extends DataGridControl {
+    drawerTitle?: ReactNode;
+    filterHandlers: FilterHandlers;
+    schema: Schema<any>;
+}
+export declare function DataGridFiltersButton(props: DataGridFiltersButtonProps): React.JSX.Element | null;

package/filters-button/filters-button.js

@@ -0,0 +1,47 @@
+"use strict";
+"use client";
+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.DataGridFiltersButton = DataGridFiltersButton;
+const translations_1 = require("@uxf/core-react/translations");
+const icon_button_1 = require("@uxf/ui/icon-button");
+const modal_1 = require("@uxf/ui/modal/modal");
+const react_1 = __importStar(require("react"));
+const drawer_1 = require("../_components/drawer");
+const filters_1 = require("../filters");
+function DataGridFiltersButton(props) {
+    var _a;
+    const t = (0, translations_1.useUxfTranslation)();
+    const [isOpen, setIsOpen] = (0, react_1.useState)(false);
+    if (props.schema.filters.length === 0) {
+        return null;
+    }
+    const closeHandler = () => setIsOpen(false);
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(icon_button_1.IconButton, { className: "uxf-data-grid__plugin-button", iconName: "filter", label: t("uxf-data-grid-filters-button:filters-label"), onClick: () => setIsOpen(true), size: "sm", title: t("uxf-data-grid-filters-button:filter-title"), variant: "secondary" }),
+        react_1.default.createElement(modal_1.Modal, { className: "uxf-dg-modal", close: closeHandler, isOpen: isOpen, variant: "drawer-right" },
+            react_1.default.createElement(drawer_1.Drawer, { onClose: closeHandler, title: (_a = props.drawerTitle) !== null && _a !== void 0 ? _a : t("uxf-data-grid-filters-button:filtering-title") },
+                react_1.default.createElement(filters_1.DataGridFilters, { actions: props.actions, filterHandlers: props.filterHandlers, schema: props.schema, state: props.state })))));
+}

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

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

package/filters-button/filters-button.stories.js

@@ -0,0 +1,18 @@
+"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 filter_handler_1 = require("../filter-handler");
+const use_data_grid_control_1 = require("../use-data-grid-control");
+const filters_button_1 = require("./filters-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(filters_button_1.DataGridFiltersButton, { actions: actions, filterHandlers: filter_handler_1.defaultFilterHandlers, schema: schema_1.schema, state: state }),
+        react_1.default.createElement(json_renderer_1.JsonRenderer, { value: state })));
+}

package/filters-button/index.d.ts

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

package/filters-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("./filters-button"), exports);

package/footer/footer.d.ts

@@ -0,0 +1,5 @@
+import React, { ReactNode } from "react";
+export interface DataGridFooterProps {
+    children: ReactNode;
+}
+export declare function DataGridFooter(props: DataGridFooterProps): React.JSX.Element;

package/footer/footer.js

@@ -0,0 +1,10 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataGridFooter = DataGridFooter;
+const react_1 = __importDefault(require("react"));
+function DataGridFooter(props) {
+    return react_1.default.createElement("div", { className: "uxf-data-grid__footer" }, props.children);
+}

package/footer/index.d.ts

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