@addev-be/ui 2.4.2 → 2.4.4

package/dist/components/data/AdvancedRequestDataGrid/index.js

@@ -0,0 +1,215 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+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 __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AdvancedRequestDataGrid = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var advancedRequests_1 = require("../../../services/advancedRequests");
+var lodash_1 = __importStar(require("lodash"));
+var helpers_1 = require("./helpers");
+var react_1 = require("react");
+var DataGrid_1 = require("../DataGrid");
+var AdvancedRequestDataGrid = function (_a) {
+    var onSelectionChangeFromProps = _a.onSelectionChange, idField = _a.idField, props = __rest(_a, ["onSelectionChange", "idField"]);
+    var currentRows = (0, react_1.useRef)([]);
+    var _b = (0, react_1.useState)([]), rows = _b[0], setRows = _b[1];
+    var _c = (0, react_1.useState)(0), start = _c[0], setStart = _c[1];
+    var _d = (0, react_1.useState)(-1), length = _d[0], setLength = _d[1];
+    var _e = (0, react_1.useState)(-1), total = _e[0], setTotal = _e[1];
+    var advancedRequest = (0, advancedRequests_1.useAdvancedRequestHandler)();
+    var idAdvancedRequest = (0, advancedRequests_1.useAdvancedRequestHandler)();
+    var _f = (0, react_1.useState)({}), conditions = _f[0], setConditions = _f[1];
+    var _g = (0, react_1.useState)([]), orderBy = _g[0], setOrderBy = _g[1];
+    var refresh = (0, react_1.useCallback)(function () {
+        setRows([]);
+        setStart(0);
+        setLength(-1);
+        setTotal(-1);
+    }, []);
+    var onFiltersChanged = (0, react_1.useCallback)(function (filters) {
+        var newConditions = (0, helpers_1.convertFiltersToConditions)(filters, props.columns);
+        setTotal(-1);
+        setConditions(newConditions);
+    }, [props.columns]);
+    var onSortsChanged = (0, react_1.useCallback)(function (sorts) {
+        refresh();
+        setOrderBy(Object.entries(sorts).map(function (_a) {
+            var columnKey = _a[0], direction = _a[1];
+            return ({
+                field: (0, helpers_1.getColumnSortField)(props.columns, columnKey),
+                direction: direction.toUpperCase(),
+            });
+        }));
+    }, [props.columns, refresh]);
+    var loadRows = (0, react_1.useRef)((0, lodash_1.debounce)(function (columns, conditions, orderBy, start, length, idField, getTotal) {
+        if (getTotal === void 0) { getTotal = false; }
+        advancedRequest((0, helpers_1.getAdvancedRequestDto)({
+            type: props.type,
+            columns: columns,
+            conditions: conditions,
+            orderBy: orderBy,
+            start: start,
+            length: length,
+            getTotal: getTotal,
+            idField: idField,
+        })).then(function (response) {
+            var _a;
+            var _b;
+            if (getTotal) {
+                currentRows.current = Array(response.count).fill(null);
+                if (getTotal)
+                    setTotal((_b = response.count) !== null && _b !== void 0 ? _b : 0);
+            }
+            var parsedRows = (0, helpers_1.parseJsonObjectFields)(response.data, columns, props.parser);
+            (_a = currentRows.current).splice.apply(_a, __spreadArray([start, length], parsedRows, false));
+            setRows(__spreadArray([], currentRows.current, true));
+        });
+    }, 100));
+    var loadFilterValues = (0, react_1.useCallback)(function (columnKey) {
+        var _a, _b, _c, _d, _e, _f, _g;
+        return advancedRequest({
+            fields: [
+                (_a = props.columns[columnKey].field) !== null && _a !== void 0 ? _a : {
+                    fieldName: columnKey,
+                },
+            ],
+            conditions: __spreadArray(__spreadArray([], ((_b = props.conditions) !== null && _b !== void 0 ? _b : []), true), Object.values(lodash_1.default.pickBy(conditions, function (_, key) { return key !== columnKey; })), true).filter(function (condition) { return condition.field !== columnKey; }),
+            orderBy: [
+                {
+                    field: (_g = (_e = (_c = props.columns[columnKey].filterField) !== null && _c !== void 0 ? _c : (_d = props.columns[columnKey].field) === null || _d === void 0 ? void 0 : _d.fieldAlias) !== null && _e !== void 0 ? _e : (_f = props.columns[columnKey].field) === null || _f === void 0 ? void 0 : _f.fieldName) !== null && _g !== void 0 ? _g : columnKey,
+                    direction: 'ASC',
+                },
+            ],
+            type: props.type,
+            getTotal: false,
+            unique: true,
+        }).then(function (response) {
+            return response.data.map(function (row) { var _a, _b, _c; return (_c = (_b = (_a = props.columns[columnKey].filter) === null || _a === void 0 ? void 0 : _a.getter) === null || _b === void 0 ? void 0 : _b.call(_a, row)) !== null && _c !== void 0 ? _c : null; });
+        });
+    }, [advancedRequest, conditions, props.columns, props.conditions, props.type]);
+    (0, react_1.useEffect)(function () {
+        var _a, _b;
+        return loadRows.current(props.columns, __spreadArray(__spreadArray([], ((_a = props.conditions) !== null && _a !== void 0 ? _a : []), true), ((_b = Object.values(conditions)) !== null && _b !== void 0 ? _b : []), true), orderBy, start, length, idField, total < 0);
+    }, [
+        props.columns,
+        conditions,
+        orderBy,
+        start,
+        length,
+        total,
+        props.conditions,
+        idField,
+    ]);
+    var loadCopyRows = (0, react_1.useCallback)(function () {
+        var _a, _b;
+        return advancedRequest((0, helpers_1.getAdvancedRequestDto)({
+            type: props.type,
+            columns: props.columns,
+            conditions: __spreadArray(__spreadArray([], ((_a = props.conditions) !== null && _a !== void 0 ? _a : []), true), ((_b = Object.values(conditions)) !== null && _b !== void 0 ? _b : []), true),
+            orderBy: orderBy,
+            start: 0,
+            length: total,
+            idField: idField,
+        })).then(function (response) {
+            return (0, helpers_1.parseJsonObjectFields)(response.data, props.columns, props.parser);
+        });
+    }, [
+        advancedRequest,
+        conditions,
+        idField,
+        orderBy,
+        props.columns,
+        props.conditions,
+        props.parser,
+        props.type,
+        total,
+    ]);
+    var loadAllIds = (0, react_1.useCallback)(function () {
+        var _a, _b;
+        return idAdvancedRequest((0, helpers_1.getAdvancedRequestDto)({
+            type: props.type,
+            columns: {
+                Id: {
+                    name: 'Id',
+                    field: idField !== null && idField !== void 0 ? idField : { fieldName: 'Id' },
+                },
+            },
+            conditions: __spreadArray(__spreadArray([], ((_a = props.conditions) !== null && _a !== void 0 ? _a : []), true), ((_b = Object.values(conditions)) !== null && _b !== void 0 ? _b : []), true),
+            orderBy: orderBy,
+            start: 0,
+            length: total,
+            idField: null,
+        })).then(function (response) { return response.data.map(function (row) { return row['Id']; }); });
+    }, [
+        conditions,
+        idAdvancedRequest,
+        idField,
+        orderBy,
+        props.conditions,
+        props.type,
+        total,
+    ]);
+    var onVisibleRowsChanged = (0, react_1.useCallback)(function (newStart, newLength) {
+        if (newStart !== start || newLength !== length) {
+            setStart(newStart);
+            setLength(newLength);
+        }
+    }, [length, start]);
+    var onSelectionChange = (0, react_1.useCallback)(function (selectedKeys) {
+        onSelectionChangeFromProps === null || onSelectionChangeFromProps === void 0 ? void 0 : onSelectionChangeFromProps(selectedKeys);
+    }, [onSelectionChangeFromProps]);
+    return ((0, jsx_runtime_1.jsx)(DataGrid_1.DataGrid, __assign({ onVisibleRowsChange: onVisibleRowsChanged, filter: false, sort: false, onFiltersChanged: onFiltersChanged, onSortsChanged: onSortsChanged, filterValuesLoader: loadFilterValues, rows: rows, loadCopyRows: loadCopyRows, refresh: refresh, onSelectionChange: onSelectionChange, getAllIds: loadAllIds }, props)));
+};
+exports.AdvancedRequestDataGrid = AdvancedRequestDataGrid;

package/dist/components/data/AdvancedRequestDataGrid/types.d.ts

@@ -0,0 +1,21 @@
+import { AdvancedRequestRow, ConditionDTO, FieldDTO, OrderByDTO } from '../../../services/advancedRequests';
+import { DataGridColumn, DataGridFilter, DataGridFilterType, DataGridProps } from '../DataGrid/types';
+export type AdvancedRequestDataGridFilter<T extends DataGridFilterType = DataGridFilterType> = DataGridFilter<T> & {
+    field?: FieldDTO;
+};
+export type AdvancedRequestDataGridFilters = Record<string, AdvancedRequestDataGridFilter>;
+export type AdvancedRequestDataGridColumn<R> = DataGridColumn<R> & {
+    filter?: AdvancedRequestDataGridFilter;
+    field?: FieldDTO;
+    filterField?: string;
+    sortField?: string;
+};
+export type AdvancedRequestDataGridColumns<R> = AdvancedRequestDataGridColumn<R>[];
+export type AdvancedRequestDataGridProps<R> = Omit<DataGridProps<R>, 'rows' | 'columns'> & {
+    columns: AdvancedRequestDataGridColumns<R>;
+    type: string;
+    orderBy?: OrderByDTO[];
+    conditions?: ConditionDTO[];
+    idField?: FieldDTO | null;
+    parser?: (row: AdvancedRequestRow<R>) => R;
+};

package/dist/components/data/AdvancedRequestDataGrid/types.js

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

package/dist/components/data/DataGrid/AdvancedRequestDataGrid.d.ts

@@ -0,0 +1,10 @@
+import { AdvancedRequestRow, ConditionDTO, OrderByDTO } from '../../../services/advancedRequests';
+import { DataGridProps } from './types';
+export type AdvancedRequestDataGridProps<R> = Omit<DataGridProps<R>, 'rows'> & {
+    type: string;
+    orderBy?: OrderByDTO[];
+    conditions?: ConditionDTO[];
+    addIdColumn?: boolean;
+    parser?: (row: AdvancedRequestRow<R>) => R;
+};
+export declare const AdvancedRequestDataGrid: <R>(props: AdvancedRequestDataGridProps<R>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/data/DataGrid/AdvancedRequestDataGrid.js

@@ -0,0 +1,173 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AdvancedRequestDataGrid = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var advancedRequests_1 = require("../../../services/advancedRequests");
+var helpers_1 = require("./helpers");
+var react_1 = require("react");
+var _1 = require(".");
+var lodash_1 = require("lodash");
+var getColumnField = function (columns, columnKey) {
+    var _a, _b;
+    return columns[columnKey].field
+        ? {
+            fieldName: (_b = (_a = columns[columnKey].field) === null || _a === void 0 ? void 0 : _a.fieldName) !== null && _b !== void 0 ? _b : columnKey,
+            fieldAlias: columnKey,
+        }
+        : {
+            fieldName: columnKey,
+            fieldAlias: columnKey,
+        };
+};
+var getFirstColumnField = function (columns) {
+    return getColumnField(columns, Object.keys(columns)[0]);
+};
+var AdvancedRequestDataGrid = function (props) {
+    var _a;
+    var currentRows = (0, react_1.useRef)([]);
+    var _b = (0, react_1.useState)([]), rows = _b[0], setRows = _b[1];
+    var _c = (0, react_1.useState)(0), start = _c[0], setStart = _c[1];
+    var _d = (0, react_1.useState)(50), length = _d[0], setLength = _d[1];
+    var _e = (0, react_1.useState)(-1), total = _e[0], setTotal = _e[1];
+    var advancedRequest = (0, advancedRequests_1.useAdvancedRequestHandler)();
+    var _f = (0, react_1.useState)([]), conditions = _f[0], setConditions = _f[1];
+    var _g = (0, react_1.useState)((_a = props.orderBy) !== null && _a !== void 0 ? _a : [
+        {
+            field: getFirstColumnField(props.columns),
+            direction: 'ASC',
+        },
+    ]), orderBy = _g[0], setOrderBy = _g[1];
+    var refresh = (0, react_1.useCallback)(function () {
+        setRows([]);
+        setStart(0);
+        setLength(50);
+        setTotal(-1);
+    }, []);
+    var onFiltersChanged = (0, react_1.useCallback)(function (filters) {
+        console.log('filters changed', filters);
+        var newConditions = (0, helpers_1.convertFiltersToConditions)(filters);
+        console.log('new conditions:', newConditions);
+        setTotal(-1);
+        setConditions(newConditions);
+    }, []);
+    var onSortsChanged = (0, react_1.useCallback)(function (sorts) {
+        console.log('sorts changed', sorts);
+        refresh();
+        setOrderBy(Object.entries(sorts).map(function (_a) {
+            var columnKey = _a[0], direction = _a[1];
+            return ({
+                field: getColumnField(props.columns, columnKey),
+                direction: direction.toUpperCase(),
+            });
+        }));
+    }, [props.columns, refresh]);
+    var loadRows = (0, react_1.useRef)((0, lodash_1.debounce)(function (columns, conditions, orderBy, start, length, getTotal) {
+        if (getTotal === void 0) { getTotal = false; }
+        advancedRequest((0, helpers_1.getAdvancedRequestDto)({
+            type: props.type,
+            columns: columns,
+            conditions: conditions,
+            orderBy: orderBy,
+            start: start,
+            length: length,
+            getTotal: getTotal,
+        })).then(function (response) {
+            var _a;
+            var _b, _c;
+            if (getTotal) {
+                currentRows.current = Array(response.total).fill(null);
+                if (getTotal)
+                    setTotal((_b = response.total) !== null && _b !== void 0 ? _b : 0);
+            }
+            var parsedRows = response.data.map((_c = props.parser) !== null && _c !== void 0 ? _c : (function (row) { return row; }));
+            (_a = currentRows.current).splice.apply(_a, __spreadArray([start, length], parsedRows, false));
+            setRows(__spreadArray([], currentRows.current, true));
+        });
+    }, 100));
+    var loadFilterValues = (0, react_1.useCallback)(function (columnKey) {
+        var _a;
+        return advancedRequest({
+            fields: [
+                {
+                    fieldName: columnKey,
+                },
+            ],
+            conditions: __spreadArray(__spreadArray(__spreadArray([], ((_a = props.conditions) !== null && _a !== void 0 ? _a : []), true), conditions, true), [
+                {
+                    field: {
+                        fieldName: 'DeletedAt',
+                    },
+                    operator: 'isNull',
+                },
+            ], false).filter(function (condition) {
+                var _a;
+                return ((_a = condition.field.fieldAlias) !== null && _a !== void 0 ? _a : condition.field.fieldName) !==
+                    columnKey;
+            }),
+            orderBy: [
+                {
+                    field: { fieldName: columnKey },
+                    direction: 'ASC',
+                },
+            ],
+            type: props.type,
+            getTotal: false,
+            unique: true,
+        }).then(function (response) {
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            return response.data.map(function (row) { return row[columnKey]; });
+        });
+    }, [advancedRequest, conditions, props.conditions, props.type]);
+    (0, react_1.useEffect)(function () {
+        var _a;
+        return loadRows.current(props.columns, __spreadArray(__spreadArray([], ((_a = props.conditions) !== null && _a !== void 0 ? _a : []), true), (conditions !== null && conditions !== void 0 ? conditions : []), true), orderBy, start, length, total < 0);
+    }, [props.columns, conditions, orderBy, start, length, total, props.conditions]);
+    var loadCopyRows = (0, react_1.useCallback)(function () {
+        var _a;
+        return advancedRequest((0, helpers_1.getAdvancedRequestDto)({
+            type: props.type,
+            columns: props.columns,
+            conditions: __spreadArray(__spreadArray([], ((_a = props.conditions) !== null && _a !== void 0 ? _a : []), true), (conditions !== null && conditions !== void 0 ? conditions : []), true),
+            orderBy: orderBy,
+            start: 0,
+            length: total,
+        })).then(function (response) { var _a; return response.data.map((_a = props.parser) !== null && _a !== void 0 ? _a : (function (row) { return row; })); });
+    }, [
+        advancedRequest,
+        conditions,
+        orderBy,
+        props.columns,
+        props.conditions,
+        props.parser,
+        props.type,
+        total,
+    ]);
+    var onVisibleRowsChanged = (0, react_1.useCallback)(function (newStart, newLength) {
+        if (newStart !== start || newLength !== length) {
+            setStart(newStart);
+            setLength(newLength);
+        }
+    }, [length, start]);
+    return ((0, jsx_runtime_1.jsx)(_1.DataGrid, __assign({ onVisibleRowsChange: onVisibleRowsChanged, filter: false, sort: false, onFiltersChanged: onFiltersChanged, onSortsChanged: onSortsChanged, filterValuesLoader: loadFilterValues, rows: rows, loadCopyRows: loadCopyRows, refresh: refresh }, props)));
+};
+exports.AdvancedRequestDataGrid = AdvancedRequestDataGrid;

package/dist/components/data/DataGrid/DataGridEditableCell.d.ts

@@ -0,0 +1,2 @@
+import { DataGridCellProps } from './types';
+export declare const DataGridEditableCell: <R>({ row, columnKey, column, context, }: DataGridCellProps<R>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/data/DataGrid/DataGridEditableCell.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataGridEditableCell = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+/* eslint-disable @typescript-eslint/no-explicit-any */
+/* eslint-disable @typescript-eslint/no-unnecessary-type-constraint */
+var react_1 = require("react");
+var hooks_1 = require("./hooks");
+var DataGridEditableCell = function (_a) {
+    var row = _a.row, columnKey = _a.columnKey, column = _a.column, context = _a.context;
+    var _b = (0, hooks_1.useDataGridContext)(context), onCellEdited = _b.onCellEdited, setEditingCell = _b.setEditingCell;
+    var _c = (0, react_1.useState)(column.getter
+        ? column.getter(row)
+        : column.propertyName
+            ? String(row[column.propertyName])
+            : ''), value = _c[0], setValue = _c[1];
+    var onClose = (0, react_1.useCallback)(function () {
+        onCellEdited === null || onCellEdited === void 0 ? void 0 : onCellEdited(row, columnKey, value);
+        setEditingCell([-1, -1]);
+    }, [columnKey, onCellEdited, row, setEditingCell, value]);
+    return ((0, jsx_runtime_1.jsxs)("td", { children: [(0, jsx_runtime_1.jsx)("input", { type: "text", 
+                // className="relative  z-10 block text-normal w-full border-0 py-1.5 text-gray-900 ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-sky-600 sm:text-sm sm:leading-6"
+                value: String(value), onChange: function (e) { return setValue(e.target.value); } }), (0, jsx_runtime_1.jsx)("div", { 
+                // className="fixed inset-0 bg-black bg-opacity-10"
+                onClick: onClose })] }, columnKey));
+};
+exports.DataGridEditableCell = DataGridEditableCell;

package/dist/components/data/DataGrid/FilterValuesScroller.d.ts

@@ -0,0 +1,13 @@
+import { DataGridFilterFormatter, DataGridFilterGroup, DataGridFilterRenderer, DataGridFilterValue } from './types';
+type FilterValuesScrollerProps = {
+    values: DataGridFilterValue[];
+    rowHeight?: number;
+    formatter: DataGridFilterFormatter;
+    renderer: DataGridFilterRenderer;
+    onRangeChange?: (startIndex: number, length: number) => void;
+    onToggle?: (values: DataGridFilterValue[]) => void;
+    selectedValues?: DataGridFilterValue[];
+    groups?: DataGridFilterGroup[];
+};
+export declare const FilterValuesScroller: ({ values, rowHeight, onRangeChange, onToggle, formatter, renderer, selectedValues, groups, }: FilterValuesScrollerProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/data/DataGrid/FilterValuesScroller.js

@@ -0,0 +1,73 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+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.FilterValuesScroller = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+/* eslint-disable @typescript-eslint/no-explicit-any */
+var styles = __importStar(require("./styles"));
+var lodash_1 = require("lodash");
+var helpers_1 = require("./helpers");
+var react_1 = require("react");
+var hooks_1 = require("../../../hooks");
+var CheckboxTemplate = function (_a) {
+    var selectedValues = _a.selectedValues, value = _a.value, index = _a.index, className = _a.className, style = _a.style, onToggle = _a.onToggle;
+    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, lodash_1.join)([
+            // 'absolute left-0 right-0 flex flex-row cursor-pointer hover:bg-gray-50',
+            className,
+        ], ' '), style: __assign(__assign({}, style), { paddingLeft: "".concat(value.level, "rem") }), title: value.title, onClick: function () { return onToggle === null || onToggle === void 0 ? void 0 : onToggle([value.value]); }, children: [(0, jsx_runtime_1.jsx)("input", { type: "checkbox", checked: selectedValues.includes(value.value), readOnly: true }), (0, jsx_runtime_1.jsx)("span", { children: value.displayValue || '(Vides)' })] }, index));
+};
+var FilterValuesScroller = function (_a) {
+    var values = _a.values, _b = _a.rowHeight, rowHeight = _b === void 0 ? styles.DEFAULT_FILTER_ROW_HEIGHT : _b, onRangeChange = _a.onRangeChange, onToggle = _a.onToggle, _c = _a.formatter, formatter = _c === void 0 ? helpers_1.defaultRendererAndFormatter : _c, _d = _a.renderer, renderer = _d === void 0 ? helpers_1.defaultRendererAndFormatter : _d, _e = _a.selectedValues, selectedValues = _e === void 0 ? [] : _e, groups = _a.groups;
+    var scrollableRef = (0, react_1.useRef)(null);
+    var height = (0, hooks_1.useElementSize)(scrollableRef.current).height;
+    var tolerance = 20;
+    var _f = (0, react_1.useState)(0), scrollTop = _f[0], setScrollTop = _f[1];
+    var index = Math.floor(scrollTop / rowHeight);
+    var length = Math.ceil(height / rowHeight);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    var onScroll = (0, react_1.useCallback)((0, lodash_1.debounce)(function (e) {
+        var target = e.target;
+        setScrollTop(function () { return target.scrollTop; });
+    }, 50), []);
+    var checkboxes = (0, react_1.useMemo)(function () { return (0, helpers_1.getCheckboxes)(values, renderer, formatter, groups); }, [values, groups, renderer, formatter]);
+    var visibleCheckboxes = checkboxes.slice(Math.max(0, index - tolerance), index + length + 1 + tolerance);
+    var firstCheckboxTop = Math.max(0, index - tolerance) * rowHeight;
+    (0, react_1.useEffect)(function () {
+        onRangeChange === null || onRangeChange === void 0 ? void 0 : onRangeChange(index, length);
+    }, [index, length, onRangeChange]);
+    return ((0, jsx_runtime_1.jsx)(styles.FilterValuesScrollerContainer, { ref: scrollableRef, onScroll: onScroll, "$rowHeight": rowHeight, children: (0, jsx_runtime_1.jsx)("div", { style: { height: "".concat(values.length * rowHeight, "px") }, children: visibleCheckboxes.map(function (value, index) { return ((0, jsx_runtime_1.jsx)(CheckboxTemplate, { className: "checkbox", style: { top: firstCheckboxTop + index * rowHeight + 'px' }, selectedValues: selectedValues, value: value, index: index, onToggle: onToggle }, index)); }) }) }));
+};
+exports.FilterValuesScroller = FilterValuesScroller;

package/dist/components/data/DataGrid/VirtualScroller.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react';
+import { DataGridContext } from './types';
+type VirtualScrollerProps<R> = {
+    showAllRows?: boolean;
+    rowTemplate: (row: R, index: number) => ReactNode;
+    hasFooter?: boolean;
+    context: DataGridContext<R>;
+    onRangeChange?: (startIndex: number, length: number) => void;
+};
+export declare const VirtualScroller: <R>(props: VirtualScrollerProps<R>) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/data/DataGrid/VirtualScroller.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 __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.VirtualScroller = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var styles = __importStar(require("./styles"));
+var react_1 = require("react");
+var VirtualScroller = function (props) {
+    var _a = (0, react_1.useContext)(props.context), _b = _a.rowHeight, rowHeight = _b === void 0 ? styles.DEFAULT_ROW_HEIGHT : _b, 
+    // headerRowHeight = styles.DEFAULT_HEADER_ROW_HEIGHT,
+    sortedRows = _a.sortedRows, index = _a.index, visibleRows = _a.visibleRows, gridTemplateColumns = _a.gridTemplateColumns;
+    var rowTemplate = props.rowTemplate;
+    var totalHeight = sortedRows.length * rowHeight;
+    var topPadding = Math.max(0, index - styles.VIRTUAL_SCROLL_TOLERANCE) * rowHeight;
+    // const headerAndFooterHeight =
+    //   2 * headerRowHeight + (hasFooter ? rowHeight : 0) + 2;
+    return ((0, jsx_runtime_1.jsx)(styles.VirtualScrollerContainer, { "$height": totalHeight, children: (0, jsx_runtime_1.jsx)(styles.VirtualScrollerRowsContainer, { "$gridTemplateColumns": gridTemplateColumns, "$topPadding": topPadding, "$rowHeight": rowHeight, children: visibleRows.map(rowTemplate) }) }));
+};
+exports.VirtualScroller = VirtualScroller;

package/dist/components/data/DataGrid/helpers/advancedRequests.d.ts

@@ -0,0 +1,12 @@
+import { AdvancedRequestDTO, ConditionDTO, OrderByDTO } from '../../../../services/advancedRequests';
+import { DataGridColumns } from '../types';
+export declare const getAdvancedRequestDto: <R>({ type, columns, conditions, orderBy, start, length, getTotal, addIdColumn, }: {
+    type: string;
+    columns: DataGridColumns<R>;
+    conditions?: ConditionDTO[];
+    orderBy?: OrderByDTO[];
+    start?: number;
+    length?: number;
+    getTotal?: boolean;
+    addIdColumn?: boolean;
+}) => AdvancedRequestDTO;