@addev-be/ui 1.2.1 → 2.1.0

package/dist/components/data/DataGrid/hooks/useRefreshModal.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.useRefreshModal = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
 var react_1 = require("react");
-var forms_1 = require("../../../forms");
+var Button_1 = require("../../../forms/Button");
 var Modal_1 = require("../../../layout/Modal");
 var Icons_1 = require("../../../../Icons");
 var useRefreshModal = function (onConfirm) {
@@ -15,7 +15,7 @@ var useRefreshModal = function (onConfirm) {
         setIsVisible(false);
     }, []);
     var modal = (0, react_1.useMemo)(function () {
-        return isVisible ? ((0, jsx_runtime_1.jsxs)(Modal_1.Modal, { "$width": 400, children: [(0, jsx_runtime_1.jsx)(Modal_1.Modal.Header, { children: "Rafraichir" }), (0, jsx_runtime_1.jsxs)(Modal_1.Modal.ContentWithIcon, { children: [(0, jsx_runtime_1.jsx)(Icons_1.TriangleExclamationIcon, { fill: "var(--color-danger-600)" }), (0, jsx_runtime_1.jsx)("div", { children: "Attention : vous avez des modifications en cours. Si vous rafra\u00EEchissez la liste, ces modifications seront perdues !" })] }), (0, jsx_runtime_1.jsxs)(Modal_1.Modal.Footer, { children: [(0, jsx_runtime_1.jsx)(forms_1.Button, { onClick: closeModal, children: "Annuler" }), (0, jsx_runtime_1.jsx)(forms_1.Button, { "$color": "danger", style: { marginLeft: 'auto' }, onClick: function () {
+        return isVisible ? ((0, jsx_runtime_1.jsxs)(Modal_1.Modal, { "$width": 400, children: [(0, jsx_runtime_1.jsx)(Modal_1.Modal.Header, { children: "Rafraichir" }), (0, jsx_runtime_1.jsxs)(Modal_1.Modal.ContentWithIcon, { children: [(0, jsx_runtime_1.jsx)(Icons_1.TriangleExclamationIcon, { fill: "var(--color-danger-600)" }), (0, jsx_runtime_1.jsx)("div", { children: "Attention : vous avez des modifications en cours. Si vous rafra\u00EEchissez la liste, ces modifications seront perdues !" })] }), (0, jsx_runtime_1.jsxs)(Modal_1.Modal.Footer, { children: [(0, jsx_runtime_1.jsx)(Button_1.Button, { onClick: closeModal, children: "Annuler" }), (0, jsx_runtime_1.jsx)(Button_1.Button, { "$color": "danger", style: { marginLeft: 'auto' }, onClick: function () {
                                 closeModal();
                                 onConfirm();
                             }, children: "Rafra\u00EEchir" })] })] })) : null;

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

@@ -1,46 +1,5 @@
-import { ForwardedRef } from 'react';
 import { DataGridContextProps, DataGridProps, DataGridRefProps } from './types';
-export declare const DataGridInner: <R>({ contextOverride, ...props }: DataGridProps<R> & {
+export declare const DataGrid: <R>({ contextOverride, ...props }: DataGridProps<R> & {
     contextOverride?: Partial<DataGridContextProps<R>>;
-}, ref: ForwardedRef<DataGridRefProps<R>>) => import("react/jsx-runtime").JSX.Element;
-export declare const DataGrid: <R>(props: {
-    name?: string;
-    className?: string;
-    rows: R[];
-    setRows?: import("react").Dispatch<import("react").SetStateAction<R[]>> | undefined;
-    columns: import("./types").DataGridColumns<R>;
-    rowKey: string;
-    selectable?: boolean;
-    userSelect?: boolean;
-    editable?: boolean;
-    onRowDoubleClick?: ((row: R, e: import("react").MouseEvent) => void) | undefined;
-    onSelectionChange?: (keys: string[]) => void;
-    onSelectedRowsChanged?: ((rows: R[]) => void) | undefined;
-    getAllIds?: () => Promise<string[]>;
-    onFiltersChanged?: (filters: import("./types").DataGridFilters) => void;
-    onSortsChanged?: (sorts: Record<string, import("./types").DataGridSort>) => void;
-    onVisibleRowsChange?: (startIndex: number, length: number) => void;
-    onCellEdited?: ((row: R, columnKey: string, value: any) => void) | undefined;
-    rowClassNameGetter?: ((row: R | null) => {
-        className?: string;
-        style?: import("react").CSSProperties;
-    }) | undefined;
-    headerRowHeight?: number;
-    rowHeight?: number;
-    filter?: boolean;
-    sort?: boolean;
-    initialSorts?: Record<string, import("./types").DataGridSort>;
-    initialFooters?: Record<string, string>;
-    onFootersChanged?: (footers: Record<string, string>) => void;
-    filterValuesLoader?: (columnKey: string) => Promise<(string | number | null)[]>;
-    loadCopyRows?: (() => Promise<R[]>) | undefined;
-    refresh?: () => void;
-    headerColor?: import("../../..").ThemeColor;
-    fixedColumnsCount?: number;
-    onRowEdited?: ((row: R, columnKey: keyof R, value: any) => void) | undefined;
-    onSaveClicked?: ((addedRows: import("./types").DataGridEditedRows<R>, editedRows: import("./types").DataGridEditedRows<R>) => Promise<string[]>) | undefined;
-    onAddClicked?: (() => Promise<R>) | undefined;
-    headerContent?: import("react").ReactNode;
-} & import("../../../helpers/styled/space").MarginProps & import("../../../helpers/styled/space").PaddingProps & {
-    contextOverride?: Partial<DataGridContextProps<R>>;
-} & import("react").RefAttributes<DataGridRefProps<R>>) => import("react").JSX.Element | null;
+    ref: React.Ref<DataGridRefProps<R>>;
+}) => import("react/jsx-runtime").JSX.Element;

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

@@ -64,7 +64,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     return to.concat(ar || Array.prototype.slice.call(from));
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.DataGrid = exports.DataGridInner = void 0;
+exports.DataGrid = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
 var styles = __importStar(require("./styles"));
 var react_1 = require("react");
@@ -76,14 +76,14 @@ var DataGridToolbar_1 = require("./DataGridToolbar");
 var VirtualScroller_1 = require("../VirtualScroller");
 var space_1 = require("../../../helpers/styled/space");
 var hooks_1 = require("./hooks");
-var DataGridInner = function (_a, ref) {
+var DataGrid = function (_a) {
     var contextOverride = _a.contextOverride, props = __rest(_a, ["contextOverride"]);
     var scrollableRef = (0, react_1.useRef)(null);
     var className = props.className;
     var spaceProps = (0, space_1.extractSpaceProps)(props);
     var _b = (0, hooks_1.useDataGrid)(props, contextOverride), contextProps = _b[0], DataGridContext = _b[1];
     var columns = contextProps.columns, selectable = contextProps.selectable, _c = contextProps.rowHeight, rowHeight = _c === void 0 ? constants_1.DEFAULT_ROW_HEIGHT : _c, _d = contextProps.headerRowHeight, headerRowHeight = _d === void 0 ? 40 : _d, gridTemplateColumns = contextProps.gridTemplateColumns, sortedRows = contextProps.sortedRows, onVisibleRowsChange = contextProps.onVisibleRowsChange, refresh = contextProps.refresh, setSelectedKeys = contextProps.setSelectedKeys, addRows = contextProps.addRows, fixedColumnsCount = contextProps.fixedColumnsCount, resizingColumnKey = contextProps.resizingColumnKey, moveResizing = contextProps.moveResizing, endResizing = contextProps.endResizing, footerFunctions = contextProps.footerFunctions;
-    (0, react_1.useImperativeHandle)(ref, function () { return ({
+    (0, react_1.useImperativeHandle)(props.ref, function () { return ({
         refresh: refresh !== null && refresh !== void 0 ? refresh : (function () { }),
         setSelectedKeys: setSelectedKeys,
         addRows: addRows,
@@ -96,5 +96,4 @@ var DataGridInner = function (_a, ref) {
     var rowTemplate = DataGridRowTemplate_1.DataGridRowTemplate;
     return ((0, jsx_runtime_1.jsx)(DataGridContext.Provider, { value: contextProps, children: (0, jsx_runtime_1.jsxs)(styles.DataGridWrapper, __assign({}, spaceProps, { children: [(0, jsx_runtime_1.jsx)(DataGridToolbar_1.DataGridToolbar, { context: DataGridContext }), (0, jsx_runtime_1.jsxs)(styles.DataGridContainer, { ref: scrollableRef, "$headerRowHeight": headerRowHeight, "$rowHeight": rowHeight, "$rowsCount": contextProps.sortedRows.length, "$withFooter": hasFooter, className: className, "$fixedColumnWidths": fixedColumnWidths, children: [resizingColumnKey && ((0, jsx_runtime_1.jsx)(styles.ResizeBackdrop, { onMouseMove: moveResizing, onMouseUp: endResizing })), (0, jsx_runtime_1.jsx)(DataGridHeader_1.DataGridHeader, { context: DataGridContext }), (0, jsx_runtime_1.jsx)(VirtualScroller_1.VirtualScroller, { integrated: true, gridTemplateColumns: gridTemplateColumns, items: sortedRows, itemTemplate: rowTemplate, itemProps: itemProps, rowHeightInPx: rowHeight, onRangeChanged: onVisibleRowsChange }), hasFooter && (0, jsx_runtime_1.jsx)(DataGridFooter_1.DataGridFooter, { context: DataGridContext })] })] })) }));
 };
-exports.DataGridInner = DataGridInner;
-exports.DataGrid = (0, react_1.forwardRef)(exports.DataGridInner);
+exports.DataGrid = DataGrid;

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

@@ -31,26 +31,14 @@ type DataGridHeaderOrFooterRowProps = {
     $headerColor?: ThemeColor;
     $gridTemplateColumns: string;
 };
-export declare const DataGridHeaderRow: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, DataGridHeaderOrFooterRowProps>, never>> & string;
-export declare const DataGridFooterRow: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, DataGridHeaderOrFooterRowProps>, never>> & string;
+export declare const DataGridHeaderRow: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, DataGridHeaderOrFooterRowProps>, never>> & string;
+export declare const DataGridFooterRow: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, DataGridHeaderOrFooterRowProps>, never>> & string;
 type DataGridRowProps = {
     $edited?: boolean;
 };
 export declare const DataGridRow: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, DataGridRowProps>> & string;
-export declare const LoadingCell: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof DataGridCellFCProps> & DataGridCellFCProps, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}, never>> & string;
-export declare const SelectionCell: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof DataGridCellFCProps> & DataGridCellFCProps, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}, never>> & string;
-export declare const HeaderSelectionCell: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof DataGridHeaderCellContainerProps> & DataGridHeaderCellContainerProps, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}, never>> & string;
-export declare const ResizeBackdrop: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, never>, never>> & string;
+export declare const LoadingCell: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof DataGridCellFCProps> & DataGridCellFCProps, never>> & string;
+export declare const SelectionCell: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof DataGridCellFCProps> & DataGridCellFCProps, never>> & string;
+export declare const HeaderSelectionCell: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof DataGridHeaderCellContainerProps> & DataGridHeaderCellContainerProps, never>> & string;
+export declare const ResizeBackdrop: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, never>, never>> & string;
 export {};

package/dist/components/data/SqlRequestDataGrid/SqlRequestForeignListEditableCell.d.ts

@@ -1,2 +1,3 @@
+import { ForwardedRef } from 'react';
 import { SqlRequestForeignListProps } from '../SqlRequestForeignList/types';
-export declare const SqlRequestForeignListEditableCell: <R extends Record<string, any>>(props: SqlRequestForeignListProps<R> & import("react").RefAttributes<HTMLDivElement>) => import("react").JSX.Element | null;
+export declare const SqlRequestForeignListEditableCell: <R extends Record<string, any>>(props: SqlRequestForeignListProps<R>, ref: ForwardedRef<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/data/SqlRequestDataGrid/SqlRequestForeignListEditableCell.js

@@ -13,7 +13,6 @@ var __assign = (this && this.__assign) || function () {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SqlRequestForeignListEditableCell = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
-var react_1 = require("react");
 var SqlRequestForeignList_1 = require("../SqlRequestForeignList");
-var SqlRequestForeignListEditableCellInner = function (props, ref) { return (0, jsx_runtime_1.jsx)(SqlRequestForeignList_1.SqlRequestForeignList, __assign({}, props, { ref: ref })); };
-exports.SqlRequestForeignListEditableCell = (0, react_1.forwardRef)(SqlRequestForeignListEditableCellInner);
+var SqlRequestForeignListEditableCell = function (props, ref) { return (0, jsx_runtime_1.jsx)(SqlRequestForeignList_1.SqlRequestForeignList, __assign({}, props, { ref: ref })); };
+exports.SqlRequestForeignListEditableCell = SqlRequestForeignListEditableCell;

package/dist/components/data/SqlRequestDataGrid/helpers/columns.d.ts

@@ -1,5 +1,5 @@
 import { SqlRequestDataGridCheckboxColumn, SqlRequestDataGridDateColumn, SqlRequestDataGridForeignListColumn, SqlRequestDataGridNumberColumn, SqlRequestDataGridTextColumn } from '../types';
-import { DeepPartial } from '../../../../typings';
+import { DeepPartial } from '../../../../types';
 import { SqlRequestForeignListItemFC } from '../../SqlRequestForeignList/types';
 export declare const sqlTextColumn: <R extends Record<string, any>>(key: string, title: React.ReactNode, options?: DeepPartial<SqlRequestDataGridTextColumn<R>>) => SqlRequestDataGridTextColumn<R>;
 export declare const sqlMailColumn: <R extends Record<string, any>>(key: string, title: string, options?: DeepPartial<SqlRequestDataGridTextColumn<R>>) => SqlRequestDataGridTextColumn<R>;

package/dist/components/data/SqlRequestDataGrid/helpers/columns.js

@@ -10,17 +10,26 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+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;
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.sqlForeignListColumn = exports.sqlColorColumn = exports.sqlImageColumn = exports.sqlCheckboxColumn = exports.sqlPercentageColumn = exports.sqlMoneyColumn = exports.sqlNumberColumn = exports.sqlMonthColumn = exports.sqlDateTimeColumn = exports.sqlDateColumn = exports.sqlPhoneColumn = exports.sqlMailColumn = exports.sqlTextColumn = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
-/* eslint-disable react/display-name */
 /* eslint-disable @typescript-eslint/no-explicit-any */
-var react_1 = require("react");
 var styles_1 = require("../styles");
 var helpers_1 = require("../../DataGrid/helpers");
+var rows_1 = require("./rows");
 var dates_1 = require("../../../../helpers/dates");
 var numbers_1 = require("../../../../helpers/numbers");
-var lodash_1 = require("lodash");
 var CheckboxEditableCell_1 = require("../../DataGrid/DataGridEditableCell/CheckboxEditableCell");
 var constants_1 = require("../../DataGrid/constants");
 var DateEditableCell_1 = require("../../DataGrid/DataGridEditableCell/DateEditableCell");
@@ -28,6 +37,8 @@ var NumberEditableCell_1 = require("../../DataGrid/DataGridEditableCell/NumberEd
 var SqlRequestForeignList_1 = require("../../SqlRequestForeignList");
 var typography_1 = require("../../../../helpers/styled/typography");
 var TextEditableCell_1 = require("../../DataGrid/DataGridEditableCell/TextEditableCell");
+var lodash_1 = require("lodash");
+var react_1 = require("react");
 var sqlTextColumn = function (key, title, options) {
     return (0, lodash_1.merge)({
         key: key,
@@ -142,7 +153,10 @@ var sqlNumberColumn = function (key, title, decimals, options) {
             max: null,
             min: null,
         },
-        editComponent: (0, react_1.forwardRef)(function (props, ref) { return ((0, jsx_runtime_1.jsx)(NumberEditableCell_1.NumberEditableCell, __assign({ ref: ref, decimals: column.decimals, currency: column.currency, prefix: column.prefix, suffix: column.suffix }, props))); }),
+        editComponent: function (_a) {
+            var ref = _a.ref, otherProps = __rest(_a, ["ref"]);
+            return ((0, jsx_runtime_1.jsx)(NumberEditableCell_1.NumberEditableCell, __assign({ ref: ref, decimals: column.decimals, currency: column.currency, prefix: column.prefix, suffix: column.suffix }, otherProps)));
+        },
     };
     return (0, lodash_1.merge)(column, options);
 };
@@ -178,7 +192,10 @@ var sqlMoneyColumn = function (key, title, decimals, currency, options) {
             max: null,
             min: null,
         },
-        editComponent: (0, react_1.forwardRef)(function (props, ref) { return ((0, jsx_runtime_1.jsx)(NumberEditableCell_1.NumberEditableCell, __assign({ ref: ref, decimals: column.decimals, currency: column.currency }, props))); }),
+        editComponent: function (_a) {
+            var ref = _a.ref, otherProps = __rest(_a, ["ref"]);
+            return ((0, jsx_runtime_1.jsx)(NumberEditableCell_1.NumberEditableCell, __assign({ ref: ref, decimals: column.decimals, currency: column.currency }, otherProps)));
+        },
     };
     return (0, lodash_1.merge)(column, options);
 };
@@ -197,7 +214,10 @@ var sqlPercentageColumn = function (key, title, decimals, options) {
         getter: function (row) { var _a; return (_a = row[key]) !== null && _a !== void 0 ? _a : ''; },
         sortGetter: function (row) { var _a; return (_a = row[key]) !== null && _a !== void 0 ? _a : 0; },
         filter: __assign(__assign({}, (0, helpers_1.numberFilter)(key)), { getter: function (value) { var _a; return (_a = value[key]) !== null && _a !== void 0 ? _a : 0; }, renderer: function (value) { var _a; return (_a = (0, numbers_1.formatPercentage)(value, decimals)) !== null && _a !== void 0 ? _a : ''; } }),
-        editComponent: (0, react_1.forwardRef)(function (props, ref) { return ((0, jsx_runtime_1.jsx)(NumberEditableCell_1.NumberEditableCell, __assign({ ref: ref, decimals: column.decimals, currency: column.currency }, props))); }),
+        editComponent: function (_a) {
+            var ref = _a.ref, otherProps = __rest(_a, ["ref"]);
+            return ((0, jsx_runtime_1.jsx)(NumberEditableCell_1.NumberEditableCell, __assign({ ref: ref, decimals: column.decimals, currency: column.currency }, otherProps)));
+        },
     };
     return (0, lodash_1.merge)(column, options);
 };
@@ -250,16 +270,6 @@ var sqlColorColumn = function (key, title, options) {
     }, options);
 };
 exports.sqlColorColumn = sqlColorColumn;
-var convertRowToItem = function (row, columnMapping) { return (0, lodash_1.mapKeys)(row, function (_, key) { return columnMapping[key]; }); };
-var convertItemToPartialRow = function (key, row, item, columnMapping) {
-    var partialRow = { Id: key };
-    Object.entries(columnMapping).forEach(function (_a) {
-        var _b;
-        var key = _a[0], value = _a[1];
-        partialRow[key] = ((_b = item === null || item === void 0 ? void 0 : item[value]) !== null && _b !== void 0 ? _b : null);
-    });
-    return partialRow;
-};
 var sqlForeignListColumn = function (key, columnMapping, title, requestName, ItemTemplate, options) {
     var column = {
         key: key,
@@ -267,20 +277,21 @@ var sqlForeignListColumn = function (key, columnMapping, title, requestName, Ite
         type: 'foreignList',
         getter: function (row) { var _a; return (_a = row[key]) !== null && _a !== void 0 ? _a : ''; },
         sortGetter: function (row) { var _a; return (_a = row[key]) !== null && _a !== void 0 ? _a : ''; },
-        render: function (value, row) { return ((0, jsx_runtime_1.jsx)(ItemTemplate, { item: convertRowToItem(row, columnMapping), index: 0 })); },
+        render: function (value, row) { return ((0, jsx_runtime_1.jsx)(ItemTemplate, { item: (0, rows_1.convertRowToItem)(row, columnMapping), index: 0 })); },
         filter: __assign(__assign({}, (0, helpers_1.textFilter)(key)), { getter: function (value) { var _a; return (_a = value[key]) !== null && _a !== void 0 ? _a : ''; }, renderer: function (value) { return value; } }),
         footer: function (rows) { return "".concat(rows[0][key], " \u00E9l\u00E9ments"); },
         requestName: requestName,
         idColumn: 'Id',
         itemTemplate: ItemTemplate,
         columns: Object.values(columnMapping),
-        editComponent: (0, react_1.forwardRef)(function (_a, ref) {
-            var row = _a.row, onChange = _a.onChange, onClose = _a.onClose, context = _a.context;
+        editComponent: function (_a) {
+            var row = _a.row, onChange = _a.onChange, onClose = _a.onClose, context = _a.context, ref = _a.ref;
+            // eslint-disable-next-line react-hooks/rules-of-hooks
             var _b = (0, react_1.useContext)(context).rowHeight, rowHeight = _b === void 0 ? constants_1.DEFAULT_ROW_HEIGHT : _b;
-            return ((0, jsx_runtime_1.jsx)(SqlRequestForeignList_1.SqlRequestForeignList, { initialValue: convertRowToItem(row, columnMapping), maxRows: 10, rowHeight: rowHeight - 2, onItemChanged: onChange, onBlur: function () { return onClose(true); }, ref: ref, requestName: column.requestName, idColumn: column.idColumn, columns: column.columns, itemTemplate: column.itemTemplate, valueTemplate: column.valueTemplate }));
-        }),
+            return ((0, jsx_runtime_1.jsx)(SqlRequestForeignList_1.SqlRequestForeignList, { initialValue: (0, rows_1.convertRowToItem)(row, columnMapping), maxRows: 10, rowHeight: rowHeight - 2, onItemChanged: onChange, onBlur: function () { return onClose(true); }, ref: ref, requestName: column.requestName, idColumn: column.idColumn, columns: column.columns, itemTemplate: column.itemTemplate, valueTemplate: column.valueTemplate }));
+        },
         itemToPartialRow: function (key, row, value) {
-            return convertItemToPartialRow(key, row, value, columnMapping);
+            return (0, rows_1.convertItemToPartialRow)(key, row, value, columnMapping);
         },
     };
     return (0, lodash_1.merge)(column, options);

package/dist/components/data/SqlRequestDataGrid/helpers/rows.d.ts

@@ -0,0 +1,2 @@
+export declare const convertRowToItem: <R extends Record<string, any>, T>(row: R, columnMapping: Record<string, keyof R>) => T;
+export declare const convertItemToPartialRow: <R extends Record<string, any>, T extends Record<string, any>>(key: string, row: R, item: T | null, columnMapping: Record<keyof R, keyof T>) => Partial<R>;

package/dist/components/data/SqlRequestDataGrid/helpers/rows.js

@@ -0,0 +1,17 @@
+"use strict";
+/* eslint-disable @typescript-eslint/no-explicit-any */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.convertItemToPartialRow = exports.convertRowToItem = void 0;
+var lodash_1 = require("lodash");
+var convertRowToItem = function (row, columnMapping) { return (0, lodash_1.mapKeys)(row, function (_, key) { return columnMapping[key]; }); };
+exports.convertRowToItem = convertRowToItem;
+var convertItemToPartialRow = function (key, row, item, columnMapping) {
+    var partialRow = { Id: key };
+    Object.entries(columnMapping).forEach(function (_a) {
+        var _b;
+        var key = _a[0], value = _a[1];
+        partialRow[key] = ((_b = item === null || item === void 0 ? void 0 : item[value]) !== null && _b !== void 0 ? _b : null);
+    });
+    return partialRow;
+};
+exports.convertItemToPartialRow = convertItemToPartialRow;

package/dist/components/data/SqlRequestDataGrid/index.d.ts

@@ -1,13 +1,6 @@
-import { ConditionDTO, OrderByDTO, SqlRequestRow } from '../../../services/sqlRequests';
 import { DataGridRefProps } from '../DataGrid/types';
-import { ForwardedRef } from 'react';
+import { Ref } from 'react';
 import { SqlRequestDataGridProps } from './types';
-export declare const SqlRequestDataGridInner: <R>({ onSelectionChange: onSelectionChangeFromProps, rowKey, ...props }: SqlRequestDataGridProps<R>, ref: ForwardedRef<DataGridRefProps<R>>) => import("react/jsx-runtime").JSX.Element;
-export declare const SqlRequestDataGrid: <R>(props: Omit<import("../DataGrid/types").DataGridProps<R>, "rows" | "columns"> & {
-    columns: import("./types").SqlRequestDataGridColumns<R>;
-    hiddenColumns?: string[];
-    type: string;
-    orderBy?: OrderByDTO[];
-    conditions?: ConditionDTO[];
-    parser?: ((row: SqlRequestRow<R>) => R) | undefined;
-} & import("react").RefAttributes<DataGridRefProps<R>>) => import("react").JSX.Element | null;
+export declare const SqlRequestDataGrid: <R>({ onSelectionChange: onSelectionChangeFromProps, rowKey, ref, ...props }: SqlRequestDataGridProps<R> & {
+    ref?: Ref<DataGridRefProps<R>>;
+}) => import("react/jsx-runtime").JSX.Element;

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

@@ -64,7 +64,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     return to.concat(ar || Array.prototype.slice.call(from));
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.SqlRequestDataGrid = exports.SqlRequestDataGridInner = void 0;
+exports.SqlRequestDataGrid = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
 var sqlRequests_1 = require("../../../services/sqlRequests");
 var react_1 = require("react");
@@ -72,9 +72,9 @@ var lodash_1 = __importStar(require("lodash"));
 var DataGrid_1 = require("../DataGrid");
 var helpers_1 = require("./helpers");
 var helpers_2 = require("../DataGrid/helpers");
-var SqlRequestDataGridInner = function (_a, ref) {
+var SqlRequestDataGrid = function (_a) {
     var _b, _c;
-    var onSelectionChangeFromProps = _a.onSelectionChange, rowKey = _a.rowKey, props = __rest(_a, ["onSelectionChange", "rowKey"]);
+    var onSelectionChangeFromProps = _a.onSelectionChange, rowKey = _a.rowKey, ref = _a.ref, props = __rest(_a, ["onSelectionChange", "rowKey", "ref"]);
     var currentRows = (0, react_1.useRef)([]);
     var _d = (0, react_1.useState)([]), rows = _d[0], setRows = _d[1];
     var setRowsRef = (0, react_1.useCallback)(function (value) {
@@ -340,5 +340,4 @@ var SqlRequestDataGridInner = function (_a, ref) {
     }, [refresh]);
     return ((0, jsx_runtime_1.jsx)(DataGrid_1.DataGrid, __assign({ ref: gridRef, onVisibleRowsChange: onVisibleRowsChanged, filter: false, sort: false, onFiltersChanged: onFiltersChanged, onSortsChanged: onSortsChanged, filterValuesLoader: loadFilterValues, rows: rows, loadCopyRows: loadCopyRows, refresh: refresh, onSelectionChange: onSelectionChange, getAllIds: loadAllIds, contextOverride: contextOverride, rowKey: rowKey }, props)));
 };
-exports.SqlRequestDataGridInner = SqlRequestDataGridInner;
-exports.SqlRequestDataGrid = (0, react_1.forwardRef)(exports.SqlRequestDataGridInner);
+exports.SqlRequestDataGrid = SqlRequestDataGrid;

package/dist/components/data/SqlRequestForeignList/index.d.ts

@@ -1,4 +1,5 @@
-import { ForwardedRef } from 'react';
+import { Ref } from 'react';
 import { SqlRequestForeignListProps } from './types';
-export declare const SqlRequestForeignListInner: <T extends Record<string, any>>({ requestName, idColumn, columns, initialValue, onItemChanged, onIdChanged, onClosed, onBlur, itemTemplate, valueTemplate, rowHeight, maxRows, orderBy, conditions, }: SqlRequestForeignListProps<T>, ref: ForwardedRef<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-export declare const SqlRequestForeignList: <T extends Record<string, any>>(props: SqlRequestForeignListProps<T> & import("react").RefAttributes<HTMLDivElement>) => import("react").JSX.Element | null;
+export declare const SqlRequestForeignList: <T extends Record<string, any>>({ requestName, idColumn, columns, initialValue, onItemChanged, onIdChanged, onClosed, onBlur, itemTemplate, valueTemplate, rowHeight, maxRows, orderBy, conditions, ref, }: SqlRequestForeignListProps<T> & {
+    ref?: Ref<HTMLDivElement>;
+}) => import("react/jsx-runtime").JSX.Element;

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

@@ -9,14 +9,14 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     return to.concat(ar || Array.prototype.slice.call(from));
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.SqlRequestForeignList = exports.SqlRequestForeignListInner = void 0;
+exports.SqlRequestForeignList = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
 /* eslint-disable @typescript-eslint/no-explicit-any */
-var services_1 = require("../../../services");
+var sqlRequests_1 = require("../../../services/sqlRequests");
 var react_1 = require("react");
 var styles_1 = require("./styles");
 var Icons_1 = require("../../../Icons");
-var layout_1 = require("../../layout");
+var Dropdown_1 = require("../../layout/Dropdown");
 var VirtualScroller_1 = require("../VirtualScroller");
 var lodash_1 = require("lodash");
 var components_1 = require("../../../helpers/components");
@@ -40,8 +40,8 @@ var createItemTemplate = function (ItemTemplate, rowHeight) {
         return ((0, jsx_runtime_1.jsx)(styles_1.SqlRequestForeignListItem, { "$rowHeight": rowHeight, onClick: function (e) { return onClick(e, item, onItemClick); }, children: (0, jsx_runtime_1.jsx)(ItemTemplate, { item: item, index: index }) }));
     }, 'SqlRequestForeignListCreateItemTemplate');
 };
-var SqlRequestForeignListInner = function (_a, ref) {
-    var requestName = _a.requestName, idColumn = _a.idColumn, _b = _a.columns, columns = _b === void 0 ? [] : _b, _c = _a.initialValue, initialValue = _c === void 0 ? null : _c, onItemChanged = _a.onItemChanged, onIdChanged = _a.onIdChanged, onClosed = _a.onClosed, onBlur = _a.onBlur, itemTemplate = _a.itemTemplate, valueTemplate = _a.valueTemplate, _d = _a.rowHeight, rowHeight = _d === void 0 ? DEFAULT_ROW_HEIGHT : _d, _e = _a.maxRows, maxRows = _e === void 0 ? 10 : _e, _f = _a.orderBy, orderBy = _f === void 0 ? [] : _f, _g = _a.conditions, conditions = _g === void 0 ? [] : _g;
+var SqlRequestForeignList = function (_a) {
+    var requestName = _a.requestName, idColumn = _a.idColumn, _b = _a.columns, columns = _b === void 0 ? [] : _b, _c = _a.initialValue, initialValue = _c === void 0 ? null : _c, onItemChanged = _a.onItemChanged, onIdChanged = _a.onIdChanged, onClosed = _a.onClosed, onBlur = _a.onBlur, itemTemplate = _a.itemTemplate, valueTemplate = _a.valueTemplate, _d = _a.rowHeight, rowHeight = _d === void 0 ? DEFAULT_ROW_HEIGHT : _d, _e = _a.maxRows, maxRows = _e === void 0 ? 10 : _e, _f = _a.orderBy, orderBy = _f === void 0 ? [] : _f, _g = _a.conditions, conditions = _g === void 0 ? [] : _g, ref = _a.ref;
     var _h = (0, react_1.useState)(false), opened = _h[0], setOpened = _h[1];
     var _j = (0, react_1.useState)(null), rect = _j[0], setRect = _j[1];
     var currentRows = (0, react_1.useRef)([]);
@@ -54,7 +54,7 @@ var SqlRequestForeignListInner = function (_a, ref) {
     var internalRef = (0, react_1.useRef)(null);
     // Forward the ref while linking it to our internal ref
     (0, react_1.useImperativeHandle)(ref, function () { return internalRef.current; }, []);
-    var sqlRequest = (0, services_1.useSqlRequestHandler)(requestName)[0];
+    var sqlRequest = (0, sqlRequests_1.useSqlRequestHandler)(requestName)[0];
     var open = (0, react_1.useCallback)(function () {
         if (internalRef.current) {
             var parentRect = internalRef.current.getBoundingClientRect();
@@ -122,11 +122,10 @@ var SqlRequestForeignListInner = function (_a, ref) {
     }, [length, start]);
     var ItemTemplate = (0, react_1.useMemo)(function () { return createItemTemplate(itemTemplate, rowHeight); }, [itemTemplate, rowHeight]);
     var ValueTemplate = (0, react_1.useMemo)(function () { return CreateValueTemplate(valueTemplate !== null && valueTemplate !== void 0 ? valueTemplate : itemTemplate, rowHeight); }, [itemTemplate, rowHeight, valueTemplate]);
-    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)(styles_1.SqlRequestForeignListInput, { tabIndex: 0, ref: internalRef, onClick: open, onBlur: onBlur, children: [(0, jsx_runtime_1.jsx)(ValueTemplate, { item: selectedItem, index: 0 }), (0, jsx_runtime_1.jsx)(Icons_1.ChevronDownIcon, {}), opened && rect && ((0, jsx_runtime_1.jsx)(layout_1.Dropdown, { "$height": [Math.min(maxRows, rows.length) * rowHeight, 300], "$width": rect.width, "$sourceRect": rect, onClose: close, usePortal: false, children: (0, jsx_runtime_1.jsx)(VirtualScroller_1.VirtualScroller, { gridTemplateColumns: '1fr', items: rows, itemTemplate: ItemTemplate, rowHeightInPx: rowHeight, itemProps: function (item, index) { return ({
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)(styles_1.SqlRequestForeignListInput, { tabIndex: 0, ref: internalRef, onClick: open, onBlur: onBlur, children: [(0, jsx_runtime_1.jsx)(ValueTemplate, { item: selectedItem, index: 0 }), (0, jsx_runtime_1.jsx)(Icons_1.ChevronDownIcon, {}), opened && rect && ((0, jsx_runtime_1.jsx)(Dropdown_1.Dropdown, { "$height": [Math.min(maxRows, rows.length) * rowHeight, 300], "$width": rect.width, "$sourceRect": rect, onClose: close, usePortal: false, children: (0, jsx_runtime_1.jsx)(VirtualScroller_1.VirtualScroller, { gridTemplateColumns: '1fr', items: rows, itemTemplate: ItemTemplate, rowHeightInPx: rowHeight, itemProps: function (item, index) { return ({
                             item: item,
                             onClick: onClick,
                             index: index,
                         }); }, onRangeChanged: onVisibleRowsChanged }) }))] }) }));
 };
-exports.SqlRequestForeignListInner = SqlRequestForeignListInner;
-exports.SqlRequestForeignList = (0, react_1.forwardRef)(exports.SqlRequestForeignListInner);
+exports.SqlRequestForeignList = SqlRequestForeignList;

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

@@ -1,4 +1,4 @@
-import { ConditionDTO, OrderByDTO } from '../../../services';
+import { ConditionDTO, OrderByDTO } from '../../../services/sqlRequests';
 import { VirtualScrollerTemplateFC } from '../VirtualScroller/types';
 export type SqlRequestForeignListProps<T> = {
     requestName: string;

package/dist/components/data/SqlRequestGrid/filters/FiltersSidebar.js

@@ -39,7 +39,7 @@ var styles = __importStar(require("./styles"));
 var Icons_1 = require("../../../../Icons");
 var react_1 = require("react");
 var DataGridFilterMenu_1 = require("../../DataGrid/DataGridFilterMenu");
-var forms_1 = require("../../../forms");
+var IconButton_1 = require("../../../forms/IconButton");
 var FiltersSidebar = function (_a) {
     var props = _a.props, context = _a.context, onClose = _a.onClose, onClearFilters = _a.onClearFilters;
     var _b = (0, react_1.useState)(null), columnKey = _b[0], setColumnKey = _b[1];
@@ -55,6 +55,6 @@ var FiltersSidebar = function (_a) {
     var onFilterClick = (0, react_1.useCallback)(function (columnKey) {
         setColumnKey(columnKey);
     }, []);
-    return ((0, jsx_runtime_1.jsx)(styles.Backdrop, { onClick: onClose, children: (0, jsx_runtime_1.jsx)(styles.FiltersSidebarContainer, { onClick: stopPropagation, children: visible ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(styles.FiltersSidebarHeader, { children: [(0, jsx_runtime_1.jsx)(forms_1.IconButton, { rounded: true, bordered: false, icon: Icons_1.AngleLeftIcon, color: "neutral", onClick: function () { return onFilterClick(null); } }), (0, jsx_runtime_1.jsx)("h3", { children: column.name }), (0, jsx_runtime_1.jsx)(forms_1.IconButton, { rounded: true, bordered: false, icon: Icons_1.XMarkIcon, color: "neutral", onClick: onClose })] }), (0, jsx_runtime_1.jsx)(DataGridFilterMenu_1.DataGridFilterMenu, { contextMenu: false, column: column, context: context, showTotalButton: false })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(styles.FiltersSidebarHeader, { children: [(0, jsx_runtime_1.jsx)("h3", { children: "Filtres" }), (0, jsx_runtime_1.jsx)(forms_1.IconButton, { rounded: true, bordered: false, icon: Icons_1.FilterSlashIcon, color: "danger", onClick: onClearFilters }), (0, jsx_runtime_1.jsx)(forms_1.IconButton, { rounded: true, bordered: false, icon: Icons_1.XMarkIcon, color: "neutral", onClick: onClose })] }), props.fields.map(function (field) { return ((0, jsx_runtime_1.jsxs)(styles.FiltersSidebarFilter, { onClick: function () { return onFilterClick(field.key); }, children: [field.name, (0, jsx_runtime_1.jsx)(Icons_1.AngleRightIcon, {})] }, field.key)); })] })) }) }));
+    return ((0, jsx_runtime_1.jsx)(styles.Backdrop, { onClick: onClose, children: (0, jsx_runtime_1.jsx)(styles.FiltersSidebarContainer, { onClick: stopPropagation, children: visible ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(styles.FiltersSidebarHeader, { children: [(0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { rounded: true, bordered: false, icon: Icons_1.AngleLeftIcon, color: "neutral", onClick: function () { return onFilterClick(null); } }), (0, jsx_runtime_1.jsx)("h3", { children: column.name }), (0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { rounded: true, bordered: false, icon: Icons_1.XMarkIcon, color: "neutral", onClick: onClose })] }), (0, jsx_runtime_1.jsx)(DataGridFilterMenu_1.DataGridFilterMenu, { contextMenu: false, column: column, context: context, showTotalButton: false })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(styles.FiltersSidebarHeader, { children: [(0, jsx_runtime_1.jsx)("h3", { children: "Filtres" }), (0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { rounded: true, bordered: false, icon: Icons_1.FilterSlashIcon, color: "danger", onClick: onClearFilters }), (0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { rounded: true, bordered: false, icon: Icons_1.XMarkIcon, color: "neutral", onClick: onClose })] }), props.fields.map(function (field) { return ((0, jsx_runtime_1.jsxs)(styles.FiltersSidebarFilter, { onClick: function () { return onFilterClick(field.key); }, children: [field.name, (0, jsx_runtime_1.jsx)(Icons_1.AngleRightIcon, {})] }, field.key)); })] })) }) }));
 };
 exports.FiltersSidebar = FiltersSidebar;

package/dist/components/data/SqlRequestGrid/index.d.ts

@@ -1,4 +1,5 @@
-import { ForwardedRef } from 'react';
+import { Ref } from 'react';
 import { SqlRequestGridProps, SqlRequestGridRefProps } from './types';
-export declare const SqlRequestGridInner: <R, P extends object = {}>(allProps: SqlRequestGridProps<R, P>, ref: ForwardedRef<SqlRequestGridRefProps>) => import("react/jsx-runtime").JSX.Element;
-export declare const SqlRequestGrid: <R, P extends object = {}>(props: SqlRequestGridProps<R, P> & import("react").RefAttributes<SqlRequestGridRefProps>) => import("react").JSX.Element | null;
+export declare const SqlRequestGrid: <R, P extends object = {}>({ ref, ...allProps }: SqlRequestGridProps<R, P> & {
+    ref: Ref<SqlRequestGridRefProps>;
+}) => import("react/jsx-runtime").JSX.Element;

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

@@ -53,7 +53,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     return to.concat(ar || Array.prototype.slice.call(from));
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.SqlRequestGrid = exports.SqlRequestGridInner = void 0;
+exports.SqlRequestGrid = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
 var styles = __importStar(require("./styles"));
 var sqlRequests_1 = require("../../../services/sqlRequests");
@@ -61,22 +61,23 @@ var react_1 = require("react");
 var lodash_1 = require("lodash");
 var Icons_1 = require("../../../Icons");
 var FiltersSidebar_1 = require("./filters/FiltersSidebar");
-var forms_1 = require("../../forms");
+var IconButton_1 = require("../../forms/IconButton");
 var VirtualScroller_1 = require("../VirtualScroller");
 var helpers_1 = require("./helpers");
 var helpers_2 = require("../DataGrid/helpers");
 var hooks_1 = require("../DataGrid/hooks");
-var SqlRequestGridInner = function (allProps, ref) {
-    var _a;
-    var _b = allProps.rowHeight, rowHeight = _b === void 0 ? styles.DEFAULT_ROW_HEIGHT : _b, itemsPerRow = allProps.itemsPerRow, itemTemplate = allProps.itemTemplate, itemProps = allProps.itemProps, gap = allProps.gap, props = __rest(allProps, ["rowHeight", "itemsPerRow", "itemTemplate", "itemProps", "gap"]);
+var SqlRequestGrid = function (_a) {
+    var _b;
+    var ref = _a.ref, allProps = __rest(_a, ["ref"]);
+    var _c = allProps.rowHeight, rowHeight = _c === void 0 ? styles.DEFAULT_ROW_HEIGHT : _c, itemsPerRow = allProps.itemsPerRow, itemTemplate = allProps.itemTemplate, itemProps = allProps.itemProps, gap = allProps.gap, props = __rest(allProps, ["rowHeight", "itemsPerRow", "itemTemplate", "itemProps", "gap"]);
     var currentRows = (0, react_1.useRef)([]);
-    var _c = (0, react_1.useState)([]), rows = _c[0], setRows = _c[1];
-    var _d = (0, react_1.useState)(0), start = _d[0], setStart = _d[1];
-    var _e = (0, react_1.useState)(-1), length = _e[0], setLength = _e[1];
-    var _f = (0, react_1.useState)(-1), count = _f[0], setCount = _f[1];
+    var _d = (0, react_1.useState)([]), rows = _d[0], setRows = _d[1];
+    var _e = (0, react_1.useState)(0), start = _e[0], setStart = _e[1];
+    var _f = (0, react_1.useState)(-1), length = _f[0], setLength = _f[1];
+    var _g = (0, react_1.useState)(-1), count = _g[0], setCount = _g[1];
     var sqlRequest = (0, sqlRequests_1.useSqlRequestHandler)(props.type)[0];
-    var _g = (0, react_1.useState)({}), conditions = _g[0], setConditions = _g[1];
-    var _h = (0, react_1.useState)(Object.entries((_a = props.initialSorts) !== null && _a !== void 0 ? _a : {}).map(function (_a) {
+    var _h = (0, react_1.useState)({}), conditions = _h[0], setConditions = _h[1];
+    var _j = (0, react_1.useState)(Object.entries((_b = props.initialSorts) !== null && _b !== void 0 ? _b : {}).map(function (_a) {
         var _b, _c, _d;
         var columnKey = _a[0], direction = _a[1];
         var field = props.fields.find(function (field) { return field.key === columnKey; });
@@ -85,8 +86,8 @@ var SqlRequestGridInner = function (allProps, ref) {
             type: (_d = field === null || field === void 0 ? void 0 : field.type) !== null && _d !== void 0 ? _d : 'text',
             direction: direction.toUpperCase(),
         };
-    })), orderBy = _h[0], setOrderBy = _h[1];
-    var _j = (0, react_1.useMemo)(function () {
+    })), orderBy = _j[0], setOrderBy = _j[1];
+    var _k = (0, react_1.useMemo)(function () {
         var _a, _b;
         return [
             __spreadArray(__spreadArray([], props.fields
@@ -97,7 +98,7 @@ var SqlRequestGridInner = function (allProps, ref) {
                 .filter(helpers_2.isColumnVisible)
                 .map(function (field) { return field.key; }), true), ((_b = props.additionalFields) !== null && _b !== void 0 ? _b : []), true),
         ];
-    }, [props.fields, props.additionalFields]), columnsKeys = _j[0], visibleColumnsKeys = _j[1];
+    }, [props.fields, props.additionalFields]), columnsKeys = _k[0], visibleColumnsKeys = _k[1];
     var columnTypes = (0, react_1.useMemo)(function () {
         return visibleColumnsKeys.map(function (key) { var _a, _b; return String((_b = (_a = props.fields.find(function (field) { return field.key === key; })) === null || _a === void 0 ? void 0 : _a.type) !== null && _b !== void 0 ? _b : 'text'); });
     }, [visibleColumnsKeys, props.fields]);
@@ -212,7 +213,7 @@ var SqlRequestGridInner = function (allProps, ref) {
     (0, react_1.useImperativeHandle)(ref, function () { return ({
         refresh: refresh,
     }); }, [refresh]);
-    var _k = (0, hooks_1.useDataGrid)({
+    var _l = (0, hooks_1.useDataGrid)({
         columns: props.fields,
         rows: rows,
         onFiltersChanged: onFiltersChanged,
@@ -224,8 +225,8 @@ var SqlRequestGridInner = function (allProps, ref) {
         rowKey: '',
         filter: false,
         sort: false,
-    }), contextProps = _k[0], DataGridContext = _k[1];
-    var _l = (0, react_1.useState)(false), sidebarVisible = _l[0], setSidebarVisible = _l[1];
+    }), contextProps = _l[0], DataGridContext = _l[1];
+    var _m = (0, react_1.useState)(false), sidebarVisible = _m[0], setSidebarVisible = _m[1];
     var onSidebarClose = (0, react_1.useCallback)(function () {
         setSidebarVisible(false);
     }, []);
@@ -233,12 +234,11 @@ var SqlRequestGridInner = function (allProps, ref) {
         onFiltersChanged({});
         setSidebarVisible(false);
     }, [onFiltersChanged]);
-    return ((0, jsx_runtime_1.jsx)(DataGridContext.Provider, { value: contextProps, children: (0, jsx_runtime_1.jsxs)(styles.SqlRequestGridContainer, { children: [sidebarVisible ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(FiltersSidebar_1.FiltersSidebar, { props: allProps, context: DataGridContext, onClose: onSidebarClose, onClearFilters: onClearFilters }) })) : ((0, jsx_runtime_1.jsx)(forms_1.IconButton, { size: "large", onClick: function () { return setSidebarVisible(true); }, icon: Icons_1.FilterFullIcon, color: "primary", rounded: true, style: {
+    return ((0, jsx_runtime_1.jsx)(DataGridContext.Provider, { value: contextProps, children: (0, jsx_runtime_1.jsxs)(styles.SqlRequestGridContainer, { children: [sidebarVisible ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(FiltersSidebar_1.FiltersSidebar, { props: allProps, context: DataGridContext, onClose: onSidebarClose, onClearFilters: onClearFilters }) })) : ((0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { size: "large", onClick: function () { return setSidebarVisible(true); }, icon: Icons_1.FilterFullIcon, color: "primary", rounded: true, style: {
                         position: 'absolute',
                         bottom: 'var(--space-2)',
                         right: 'var(--space-2)',
                         zIndex: 1,
                     } })), (0, jsx_runtime_1.jsx)(VirtualScroller_1.VirtualScroller, { gridTemplateColumns: "repeat(".concat(itemsPerRow, ", 1fr)"), items: rows, itemTemplate: itemTemplate, itemsPerRow: itemsPerRow, itemProps: itemProps, rowHeightInPx: rowHeight, onRangeChanged: onVisibleRowsChanged, gap: gap })] }) }));
 };
-exports.SqlRequestGridInner = SqlRequestGridInner;
-exports.SqlRequestGrid = (0, react_1.forwardRef)(exports.SqlRequestGridInner);
+exports.SqlRequestGrid = SqlRequestGrid;

package/dist/components/data/SqlRequestGrid/styles.d.ts

@@ -1,4 +1,2 @@
 export declare const DEFAULT_ROW_HEIGHT = 200;
-export declare const SqlRequestGridContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}>, never>, never>> & string;
+export declare const SqlRequestGridContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, never>, never>> & string;