@addev-be/ui 0.2.2 → 0.2.5

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

@@ -35,33 +35,31 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.DataGrid = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
 var styles = __importStar(require("./styles"));
-var react_1 = require("react");
 var DataGridCell_1 = require("./DataGridCell");
 var DataGridFooter_1 = require("./DataGridFooter");
 var DataGridHeader_1 = require("./DataGridHeader");
 var VirtualScroller_1 = require("./VirtualScroller");
+var react_1 = require("react");
 var hooks_1 = require("./hooks");
 /* eslint-disable @typescript-eslint/no-explicit-any */
 /* eslint-disable @typescript-eslint/no-unnecessary-type-constraint */
 var DataGrid = function (props) {
     var className = props.className, 
     // onRowDoubleClick,
-    onSelectionChange = props.onSelectionChange, onVisibleRowsChange = props.onVisibleRowsChange, rowKey = props.rowKey;
+    onVisibleRowsChange = props.onVisibleRowsChange;
     var _a = (0, hooks_1.useDataGrid)(props), contextProps = _a[0], DataGridContext = _a[1];
-    var selectedRows = contextProps.selectedRows, setSelectedRows = contextProps.setSelectedRows, columns = contextProps.columns, visibleColumns = contextProps.visibleColumns, _b = contextProps.rowHeight, rowHeight = _b === void 0 ? 32 : _b, _c = contextProps.headerRowHeight, headerRowHeight = _c === void 0 ? 40 : _c, scrollableRef = contextProps.scrollableRef, onScroll = contextProps.onScroll;
+    var selectedKeys = contextProps.selectedKeys, setSelectedKeys = contextProps.setSelectedKeys, columns = contextProps.columns, visibleColumns = contextProps.visibleColumns, _b = contextProps.rowHeight, rowHeight = _b === void 0 ? 32 : _b, _c = contextProps.headerRowHeight, headerRowHeight = _c === void 0 ? 40 : _c, scrollableRef = contextProps.scrollableRef, onScroll = contextProps.onScroll, rowKeyGetter = contextProps.rowKeyGetter;
     var hasFooter = Object.values(columns).some(function (col) { return col.footer; });
     var setRowSelection = (0, react_1.useCallback)(function (row, selected) {
+        var key = rowKeyGetter(row);
         if (selected) {
-            if (!selectedRows.includes(row))
-                setSelectedRows(__spreadArray(__spreadArray([], selectedRows, true), [row], false));
+            if (!selectedKeys.includes(key))
+                setSelectedKeys(__spreadArray(__spreadArray([], selectedKeys, true), [key], false));
         }
         else {
-            setSelectedRows(selectedRows.filter(function (p) { return p !== row; }));
+            setSelectedKeys(selectedKeys.filter(function (p) { return p !== key; }));
         }
-    }, [selectedRows, setSelectedRows]);
-    (0, react_1.useEffect)(function () {
-        onSelectionChange === null || onSelectionChange === void 0 ? void 0 : onSelectionChange(selectedRows);
-    }, [onSelectionChange, selectedRows]);
+    }, [rowKeyGetter, selectedKeys, setSelectedKeys]);
     var rowTemplate = (0, react_1.useCallback)(function (row, rowIndex) {
         var _a, _b;
         var _c = (_b = (_a = props.rowClassNameGetter) === null || _a === void 0 ? void 0 : _a.call(props, row)) !== null && _b !== void 0 ? _b : {
@@ -71,18 +69,16 @@ var DataGrid = function (props) {
         if (!row) {
             return ((0, jsx_runtime_1.jsxs)(styles.DataGridRow, { children: [!!props.selectable && ((0, jsx_runtime_1.jsx)(styles.LoadingCell, { className: "animate-pulse", children: (0, jsx_runtime_1.jsx)("div", {}) })), visibleColumns.map(function (_, index) { return ((0, jsx_runtime_1.jsx)(styles.LoadingCell, { className: "animate-pulse", children: (0, jsx_runtime_1.jsx)("div", {}) }, "loading-".concat(rowIndex, "-").concat(index))); })] }, "loading-row-".concat(rowIndex)));
         }
-        var key = String(typeof rowKey === 'function' ? rowKey(row) : row[rowKey]);
-        return ((0, jsx_runtime_1.jsxs)(styles.DataGridRow, { children: [!!props.selectable && ((0, jsx_runtime_1.jsx)(styles.SelectionCell, { children: (0, jsx_runtime_1.jsx)("input", { type: "checkbox", 
-                        // className="h-4 w-4 rounded border-gray-300 text-green-600 focus:ring-green-600"
-                        value: key, checked: selectedRows.includes(row), onChange: function (e) { return setRowSelection(row, e.target.checked); } }) }, "__select_checkbox__")), visibleColumns.map(function (_a, index) {
+        var key = rowKeyGetter(row);
+        return ((0, jsx_runtime_1.jsxs)(styles.DataGridRow, { children: [!!props.selectable && ((0, jsx_runtime_1.jsx)(styles.SelectionCell, { children: (0, jsx_runtime_1.jsx)("input", { type: "checkbox", value: key, checked: selectedKeys.includes(key), onChange: function (e) { return setRowSelection(row, e.target.checked); } }) }, "__select_checkbox__")), visibleColumns.map(function (_a, index) {
                     var key = _a[0], col = _a[1];
                     return ((0, jsx_runtime_1.jsx)(DataGridCell_1.DataGridCell, { className: className, style: style, row: row, rowIndex: rowIndex, column: col, columnIndex: index, context: DataGridContext, columnKey: key }, "loading-".concat(rowIndex, "-").concat(index)));
                 })] }, key));
     }, [
         DataGridContext,
         props,
-        rowKey,
-        selectedRows,
+        rowKeyGetter,
+        selectedKeys,
         setRowSelection,
         visibleColumns,
     ]);

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

@@ -43,7 +43,9 @@ export declare const DataGridRow: import("styled-components/dist/types").IStyled
 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>, never>, "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<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, 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>, never>, "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;

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

@@ -93,7 +93,7 @@ exports.DataGridHeaderRow = styled_components_1.default.div.attrs(function (_a)
             gridTemplateColumns: $gridTemplateColumns,
         },
     });
-})(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n  display: grid;\n  grid-template-rows: ", ";\n  z-index: 10;\n  position: sticky;\n  top: ", "px;\n\n  ", "\n"], ["\n  display: grid;\n  grid-template-rows: ", ";\n  z-index: 10;\n  position: sticky;\n  top: ", "px;\n\n  ", "\n"])), function (_a) {
+})(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n  display: grid;\n  grid-template-rows: ", ";\n  z-index: 10;\n  position: sticky;\n  top: ", "px;\n  align-items: center;\n\n  ", "\n"], ["\n  display: grid;\n  grid-template-rows: ", ";\n  z-index: 10;\n  position: sticky;\n  top: ", "px;\n  align-items: center;\n\n  ", "\n"])), function (_a) {
     var _b = _a.$headerRowHeight, $headerRowHeight = _b === void 0 ? exports.DEFAULT_HEADER_ROW_HEIGHT : _b;
     return "".concat($headerRowHeight, "px");
 }, exports.TOOLBAR_HEIGHT, function (_a) {
@@ -104,9 +104,9 @@ exports.DataGridHeaderRow = styled_components_1.default.div.attrs(function (_a)
 exports.DataGridHeaderRow.displayName = 'DataGridHeaderRow';
 exports.DataGridRow = styled_components_1.default.div(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n  display: contents;\n"], ["\n  display: contents;\n"])));
 exports.DataGridRow.displayName = 'DataGridRow';
-exports.LoadingCell = (0, styled_components_1.default)(exports.DataGridCell)(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n  padding: var(--space-2);\n"], ["\n  padding: var(--space-2);\n"])));
+exports.LoadingCell = (0, styled_components_1.default)(exports.DataGridCell)(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n  padding: var(--space-2);\n  box-sizing: border-box;\n\n  &.animate-pulse > div {\n    background-color: var(--color-neutral-200);\n    border-radius: var(--rounded-full);\n    width: 100%;\n    height: 100%;\n  }\n"], ["\n  padding: var(--space-2);\n  box-sizing: border-box;\n\n  &.animate-pulse > div {\n    background-color: var(--color-neutral-200);\n    border-radius: var(--rounded-full);\n    width: 100%;\n    height: 100%;\n  }\n"])));
 exports.LoadingCell.displayName = 'LoadingCell';
-exports.SelectionCell = styled_components_1.default.div(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n  /* inline-flex items-center justify-center w-12 select-none text-center whitespace-nowrap */\n  & > input[type='checkbox'] {\n    height: 1rem;\n    width: 1rem;\n    border-radius: 0.25rem;\n    border: 1px solid var(--color-neutral-300);\n    color: var(--color-sky-600);\n  }\n"], ["\n  /* inline-flex items-center justify-center w-12 select-none text-center whitespace-nowrap */\n  & > input[type='checkbox'] {\n    height: 1rem;\n    width: 1rem;\n    border-radius: 0.25rem;\n    border: 1px solid var(--color-neutral-300);\n    color: var(--color-sky-600);\n  }\n"])));
+exports.SelectionCell = (0, styled_components_1.default)(exports.DataGridCell)(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n  /* inline-flex items-center justify-center w-12 select-none text-center whitespace-nowrap */\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: var(--space-6);\n  padding: 0 var(--space-1);\n\n  & > input[type='checkbox'] {\n    height: var(--space-6);\n    width: var(--space-6);\n    border-radius: var(--rounded-sm);\n    border: 1px solid var(--color-neutral-300);\n    color: var(--color-sky-600);\n  }\n"], ["\n  /* inline-flex items-center justify-center w-12 select-none text-center whitespace-nowrap */\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: var(--space-6);\n  padding: 0 var(--space-1);\n\n  & > input[type='checkbox'] {\n    height: var(--space-6);\n    width: var(--space-6);\n    border-radius: var(--rounded-sm);\n    border: 1px solid var(--color-neutral-300);\n    color: var(--color-sky-600);\n  }\n"])));
 exports.SelectionCell.displayName = 'SelectionCell';
 exports.ResizeBackdrop = styled_components_1.default.div.attrs({
     className: 'ResizeBackdrop',

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

@@ -1,32 +1,31 @@
 import * as t from 'io-ts';
 import { CSSProperties, Context, Dispatch, MouseEvent, ReactNode, SetStateAction } from 'react';
-import { FieldDTO } from '../../../services/advancedRequests';
 import { SettingsContextProps } from '../../../providers/SettingsProvider';
 import { ThemeColor } from '../../../providers/ThemeProvider/types';
-export type DataGridColumn<R, T extends DataGridFilterType | undefined = DataGridFilterType> = {
+export type MysqlJsonObject = Record<string, string | number | null>;
+export type DataGridColumn<R> = {
     bodyClassName?: string;
     className?: string;
     editable?: boolean;
     excelFormatter?: (value: any) => string;
     excelValue?: (value: any) => string;
-    field?: FieldDTO;
-    filter?: T extends undefined ? never : AnyDataGridFilter<R>;
+    filter?: DataGridFilter;
     footer?: (allRows: R[], filteredRows: R[], selectedRows: R[]) => ReactNode;
     footerClassName?: string;
-    getter?: (row: R) => string | number;
+    getter?: (row: R) => string | number | MysqlJsonObject;
     headerClassName?: string;
     name: string;
     order?: number;
     propertyName?: keyof R;
-    render?: (column: DataGridColumn<R, T>, row: R) => ReactNode | string;
+    render?: (row: R, column: DataGridColumn<R>) => ReactNode | string;
     resizable?: boolean;
     sortGetter?: (row: R) => string | number;
     type?: 'text' | 'number' | 'date';
     width?: number;
     settingsContext?: Context<SettingsContextProps>;
 };
-export type DataGridColumns<R> = Record<string, DataGridColumn<R, DataGridFilterType | undefined>>;
-export type DataGridFilters<R> = Record<string, DataGridFilter<R, DataGridFilterType>>;
+export type DataGridColumns<R> = Record<string, DataGridColumn<R>>;
+export type DataGridFilters = Record<string, DataGridFilter<DataGridFilterType>>;
 export type DataGridProps<R> = {
     name?: string;
     className?: string;
@@ -36,8 +35,9 @@ export type DataGridProps<R> = {
     selectable?: boolean;
     editable?: boolean;
     onRowDoubleClick?: (row: R, e: MouseEvent) => void;
-    onSelectionChange?: (selectedRows: R[]) => void;
-    onFiltersChanged?: (filters: DataGridFilters<R>) => void;
+    onSelectionChange?: (keys: string[]) => void;
+    getAllIds?: () => Promise<string[]>;
+    onFiltersChanged?: (filters: DataGridFilters) => void;
     onSortsChanged?: (sorts: Record<string, DataGridSort>) => void;
     onVisibleRowsChange?: (startIndex: number, length: number) => void;
     onCellEdited?: (row: R, columnKey: string, value: any) => void;
@@ -49,7 +49,7 @@ export type DataGridProps<R> = {
     rowHeight?: number;
     filter?: boolean;
     sort?: boolean;
-    filterValuesLoader?: (columnKey: string) => Promise<(string | number | null)[]>;
+    filterValuesLoader?: (columnKey: string) => Promise<(string | number | null | MysqlJsonObject)[]>;
     loadCopyRows?: () => Promise<R[]>;
     refresh?: () => void;
     headerColor?: ThemeColor;
@@ -59,11 +59,12 @@ export type DataGridContextProps<R> = DataGridProps<R> & {
     setEditingCell: Dispatch<SetStateAction<[number, number]>>;
     sortedRows: R[];
     selectedRows: R[];
-    setSelectedRows: (selection: R[]) => void;
+    selectedKeys: string[];
+    setSelectedKeys: (selection: string[]) => void;
     sorts?: Record<string, DataGridSort>;
     setSorts: (sorts: Record<string, DataGridSort>) => void;
-    filters?: DataGridFilters<R>;
-    setFilters: Dispatch<SetStateAction<DataGridFilters<R>>>;
+    filters?: DataGridFilters;
+    setFilters: Dispatch<SetStateAction<DataGridFilters>>;
     visibleColumns: DataGridColumnKeyValuePair<R>[];
     copyTable: (includeHeaders?: boolean, includeFooters?: boolean) => Promise<void>;
     setColumnWidth: (key: string, width: number) => void;
@@ -75,6 +76,8 @@ export type DataGridContextProps<R> = DataGridProps<R> & {
     onScroll: (e: React.UIEvent<HTMLDivElement>) => void;
     index: number;
     length: number;
+    rowKeyGetter: (row: R) => string;
+    gridTemplateColumns: string;
 };
 export type DataGridContext<R> = Context<DataGridContextProps<R>>;
 export declare const dataGridSettingCodec: t.PartialC<{
@@ -94,7 +97,7 @@ export type DataGridSettings = t.TypeOf<typeof dataGridSettingsCodec>;
 export type DataGridSettingsByName = t.TypeOf<typeof dataGridSettingsByNameCodec>;
 export type DataGridSettingsTuple = [string, DataGridSetting];
 export type DataGridSettingsArray = DataGridSettingsTuple[];
-export type DataGridColumnKeyValuePair<R> = [string, DataGridColumn<R, any>];
+export type DataGridColumnKeyValuePair<R> = [string, DataGridColumn<R>];
 export type DataGridCellProps<R> = {
     row: R;
     rowIndex: number;
@@ -114,42 +117,27 @@ export type DataGridHeaderCellProps<R> = {
     isFilterOpen?: boolean;
 };
 export type DataGridSort = 'asc' | 'desc';
-export type DataGridFilterType = 'text' | 'number';
-export type DataGridFilterDataType<T extends DataGridFilterType> = T extends 'text' ? string : number;
 export type DataGridFilterPredicate<T> = (valueToVerify: T) => boolean;
-export type DataGridFilterPredicateBuilder<T> = (row: any, ...filterValues: T[]) => DataGridFilterPredicate<T>;
-export type DataGridFilterGetter<R, T extends DataGridFilterType> = (row: R) => DataGridFilterDataType<T> | null;
-export type DataGridFilterFormatter = (value: string | number | null) => string | null;
+export type DataGridFilterPredicateBuilder<T> = (...filterValues: T[]) => DataGridFilterPredicate<T>;
+export type DataGridFilterOperators<K extends string, T> = {
+    [key in K]: DataGridFilterPredicateBuilder<T>;
+};
 export type DataGridFilterPredicates = {
-    text: {
-        contains: DataGridFilterPredicateBuilder<string>;
-        notContains: DataGridFilterPredicateBuilder<string>;
-        equals: DataGridFilterPredicateBuilder<string>;
-        notEquals: DataGridFilterPredicateBuilder<string>;
-        startsWith: DataGridFilterPredicateBuilder<string>;
-        endsWith: DataGridFilterPredicateBuilder<string>;
-        inArray: DataGridFilterPredicateBuilder<string>;
-    };
-    number: {
-        equals: DataGridFilterPredicateBuilder<number>;
-        notEquals: DataGridFilterPredicateBuilder<number>;
-        lessThan: DataGridFilterPredicateBuilder<number>;
-        lessThanOrEqual: DataGridFilterPredicateBuilder<number>;
-        greaterThan: DataGridFilterPredicateBuilder<number>;
-        greaterThanOrEqual: DataGridFilterPredicateBuilder<number>;
-        inRange: DataGridFilterPredicateBuilder<number>;
-        inArray: DataGridFilterPredicateBuilder<number>;
-    };
+    text: DataGridFilterOperators<'contains' | 'notContains' | 'equals' | 'notEquals' | 'startsWith' | 'endsWith' | 'inArray', string>;
+    number: DataGridFilterOperators<'equals' | 'notEquals' | 'lessThan' | 'lessThanOrEqual' | 'greaterThan' | 'greaterThanOrEqual' | 'inRange' | 'inArray', number>;
 };
-export type DataGridFilterOperator<T extends DataGridFilterType> = keyof DataGridFilterPredicates[T];
-export type DataGridFilter<R, T extends DataGridFilterType = DataGridFilterType> = {
+export type DataGridFilterType = keyof DataGridFilterPredicates;
+export type DataGridFilterDataType<T extends DataGridFilterType> = DataGridFilterPredicates[T] extends DataGridFilterOperators<string, infer U> ? U : never;
+export type DataGridFilterGetter<T extends DataGridFilterType> = (value: any) => DataGridFilterDataType<T> | null;
+export type DataGridFilterFormatter = (value: any) => string | null;
+export type DataGridFilterOperator<T extends DataGridFilterType> = DataGridFilterPredicates[T] extends DataGridFilterOperators<infer K, any> ? K : never;
+export type DataGridFilter<T extends string = DataGridFilterType> = T extends DataGridFilterType ? {
     type: T;
-    operator: keyof DataGridFilterPredicates[T];
-    getter: DataGridFilterGetter<R, T>;
+    operator: DataGridFilterOperator<T>;
+    getter: DataGridFilterGetter<T>;
     formatter?: DataGridFilterFormatter;
     values: (DataGridFilterDataType<T> | null)[];
-};
-export type AnyDataGridFilter<R> = DataGridFilter<R, 'text'> | DataGridFilter<R, 'number'>;
+} : never;
 export type DataGridFilterGroup<R> = {
     name: string;
     values?: R[];

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

@@ -0,0 +1,16 @@
+import { SqlRequestDataGridColumn, SqlRequestDataGridColumns } from '../types';
+export declare const sqlTextColumn: <R extends Record<string, any>>(key: string, title: string, options?: Partial<SqlRequestDataGridColumn<R>>) => SqlRequestDataGridColumns<R>;
+/**
+ * Creates a column with a composed value from multiple fields,
+ * and filtered by a text filter on the first field
+ */
+export declare const sqlComposedColumn: <R extends Record<string, any>>(key: string, title: string, fields: string[], options?: Partial<SqlRequestDataGridColumn<R>>) => SqlRequestDataGridColumns<R>;
+export declare const sqlMailColumn: <R extends Record<string, any>>(key: string, title: string, options?: Partial<SqlRequestDataGridColumn<R>>) => SqlRequestDataGridColumns<R>;
+export declare const sqlPhoneColumn: <R extends Record<string, any>>(key: string, title: string, options?: Partial<SqlRequestDataGridColumn<R>>) => SqlRequestDataGridColumns<R>;
+export declare const sqlDateColumn: <R extends Record<string, any>>(key: string, title: string, options?: Partial<SqlRequestDataGridColumn<R>>) => SqlRequestDataGridColumns<R>;
+export declare const sqlMonthColumn: <R extends Record<string, any>>(key: string, title: string, options?: Partial<SqlRequestDataGridColumn<R>>) => SqlRequestDataGridColumns<R>;
+export declare const sqlNumberColumn: <R extends Record<string, any>>(key: string, title: string, decimals?: number, options?: Partial<SqlRequestDataGridColumn<R>>) => SqlRequestDataGridColumns<R>;
+export declare const sqlMoneyColumn: <R extends Record<string, any>>(key: string, title: string, decimals?: number, options?: Partial<SqlRequestDataGridColumn<R>>) => SqlRequestDataGridColumns<R>;
+export declare const sqlPercentageColumn: <R extends Record<string, any>>(key: string, title: string, options?: Partial<SqlRequestDataGridColumn<R>>) => SqlRequestDataGridColumns<R>;
+export declare const sqlCheckboxColumn: <R extends Record<string, any>>(key: string, title: string, options?: Partial<SqlRequestDataGridColumn<R>>) => SqlRequestDataGridColumns<R>;
+export declare const sqlColorColumn: <R extends Record<string, any>>(key: string, title: string, options?: Partial<SqlRequestDataGridColumn<R>>) => SqlRequestDataGridColumns<R>;

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

@@ -0,0 +1,114 @@
+"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 __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.sqlColorColumn = exports.sqlCheckboxColumn = exports.sqlPercentageColumn = exports.sqlMoneyColumn = exports.sqlNumberColumn = exports.sqlMonthColumn = exports.sqlDateColumn = exports.sqlPhoneColumn = exports.sqlMailColumn = exports.sqlComposedColumn = exports.sqlTextColumn = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var numbers_1 = require("../../../../helpers/numbers");
+var helpers_1 = require("../../DataGrid/helpers");
+var moment_1 = __importDefault(require("moment"));
+var sqlTextColumn = function (key, title, options) {
+    var _a;
+    return (_a = {},
+        _a[key] = __assign({ name: title, render: function (row) { var _a; return (_a = row[key]) !== null && _a !== void 0 ? _a : ''; }, 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 : ''; }, filter: __assign(__assign({}, (0, helpers_1.textFilter)(key)), { getter: function (value) { var _a; return (_a = value[key]) !== null && _a !== void 0 ? _a : ''; } }) }, options),
+        _a);
+};
+exports.sqlTextColumn = sqlTextColumn;
+/**
+ * Creates a column with a composed value from multiple fields,
+ * and filtered by a text filter on the first field
+ */
+var sqlComposedColumn = function (key, title, fields, options) {
+    var _a;
+    return (_a = {},
+        _a[key] = __assign({ field: {
+                fieldAlias: key,
+                operator: 'jsonObject',
+                operands: fields.flatMap(function (field) { return [
+                    { constantValue: field },
+                    { fieldName: field },
+                ]; }),
+            }, name: title, render: function (row) { var _a; return (_a = row[key]) !== null && _a !== void 0 ? _a : ''; }, 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 : ''; }, filter: __assign(__assign({}, (0, helpers_1.textFilter)(fields[0])), { getter: function (value) { var _a; return (_a = value[fields[0]]) !== null && _a !== void 0 ? _a : 0; } }), filterField: fields[0], sortField: fields[0] }, options),
+        _a);
+};
+exports.sqlComposedColumn = sqlComposedColumn;
+var sqlMailColumn = function (key, title, options) {
+    var _a;
+    return (_a = {},
+        _a[key] = __assign({ name: title, render: function (row) { var _a; return (0, jsx_runtime_1.jsx)("a", { href: "mailto:".concat(row[key]), children: (_a = row[key]) !== null && _a !== void 0 ? _a : '' }); }, 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 : ''; }, filter: __assign(__assign({}, (0, helpers_1.textFilter)(key)), { getter: function (value) { var _a; return (_a = value[key]) !== null && _a !== void 0 ? _a : ''; } }) }, options),
+        _a);
+};
+exports.sqlMailColumn = sqlMailColumn;
+var sqlPhoneColumn = function (key, title, options) {
+    var _a;
+    return (_a = {},
+        _a[key] = __assign({ name: title, render: function (row) { var _a; return (0, jsx_runtime_1.jsx)("a", { href: "tel:".concat(row[key]), children: (_a = row[key]) !== null && _a !== void 0 ? _a : '' }); }, 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 : ''; }, filter: __assign(__assign({}, (0, helpers_1.textFilter)(key)), { getter: function (value) { var _a; return (_a = value[key]) !== null && _a !== void 0 ? _a : ''; } }) }, options),
+        _a);
+};
+exports.sqlPhoneColumn = sqlPhoneColumn;
+var sqlDateColumn = function (key, title, options) {
+    var _a;
+    return (_a = {},
+        _a[key] = __assign({ name: title, render: function (row) { var _a; return (_a = (0, moment_1.default)(row[key]).format('DD/MM/YYYY')) !== null && _a !== void 0 ? _a : ''; }, 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 : ''; }, filter: __assign(__assign({}, (0, helpers_1.textFilter)(key)), { getter: function (value) { var _a; return (_a = value[key]) !== null && _a !== void 0 ? _a : ''; } }) }, options),
+        _a);
+};
+exports.sqlDateColumn = sqlDateColumn;
+var sqlMonthColumn = function (key, title, options) {
+    var _a;
+    return (_a = {},
+        _a[key] = __assign({ name: title, render: function (row) { return (row[key] ? "".concat(row[key], " mois ") : ''); }, 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 : ''; }, filter: __assign(__assign({}, (0, helpers_1.textFilter)(key)), { getter: function (value) { var _a; return (_a = value[key]) !== null && _a !== void 0 ? _a : ''; } }) }, options),
+        _a);
+};
+exports.sqlMonthColumn = sqlMonthColumn;
+var sqlNumberColumn = function (key, title, decimals, options) {
+    var _a;
+    if (decimals === void 0) { decimals = 2; }
+    return (_a = {},
+        _a[key] = __assign({ name: title, render: function (row) { var _a; return (_a = (0, numbers_1.formatNumber)(row[key], decimals)) !== null && _a !== void 0 ? _a : ''; }, excelFormatter: function () { return '#'; }, 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 : ''; }, filter: __assign(__assign({}, (0, helpers_1.numberFilter)(key)), { getter: function (value) { var _a; return (_a = value[key]) !== null && _a !== void 0 ? _a : 0; } }) }, options),
+        _a);
+};
+exports.sqlNumberColumn = sqlNumberColumn;
+var sqlMoneyColumn = function (key, title, decimals, options) {
+    var _a;
+    if (decimals === void 0) { decimals = 2; }
+    return (_a = {},
+        _a[key] = __assign({ name: title, render: function (row) { var _a; return (_a = (0, numbers_1.formatMoney)(row[key], decimals)) !== null && _a !== void 0 ? _a : ''; }, excelFormatter: function () { return '#0.00'; }, 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 : ''; }, filter: __assign(__assign({}, (0, helpers_1.numberFilter)(key)), { getter: function (value) { var _a; return (_a = value[key]) !== null && _a !== void 0 ? _a : 0; } }) }, options),
+        _a);
+};
+exports.sqlMoneyColumn = sqlMoneyColumn;
+var sqlPercentageColumn = function (key, title, options) {
+    var _a;
+    return (_a = {},
+        _a[key] = __assign({ name: title, render: function (row) { var _a; return (_a = (0, numbers_1.formatPercentage)(row[key])) !== null && _a !== void 0 ? _a : ''; }, excelFormatter: function () { return '#0.00'; }, 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 : ''; }, filter: __assign(__assign({}, (0, helpers_1.numberFilter)(key)), { getter: function (value) { var _a; return (_a = value[key]) !== null && _a !== void 0 ? _a : 0; } }) }, options),
+        _a);
+};
+exports.sqlPercentageColumn = sqlPercentageColumn;
+var sqlCheckboxColumn = function (key, title, options) {
+    var _a;
+    return (_a = {},
+        _a[key] = __assign({ name: title, render: function (row) { return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("input", { type: "checkbox", checked: row[key] }), (0, jsx_runtime_1.jsx)("span", { children: row[key] ? ' Oui' : ' Non' })] })); }, 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 : ''; }, filter: __assign(__assign({}, (0, helpers_1.numberFilter)(key)), { getter: function (value) { var _a; return (_a = value[key]) !== null && _a !== void 0 ? _a : 0; } }) }, options),
+        _a);
+};
+exports.sqlCheckboxColumn = sqlCheckboxColumn;
+var sqlColorColumn = function (key, title, options) {
+    var _a;
+    return (_a = {},
+        _a[key] = __assign({ name: title, render: function (row) {
+                var _a;
+                return ((0, jsx_runtime_1.jsx)("div", { style: { backgroundColor: row[key] }, children: (_a = row[key]) !== null && _a !== void 0 ? _a : '' }));
+            }, 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 : ''; }, filter: __assign(__assign({}, (0, helpers_1.textFilter)(key)), { getter: function (value) { var _a; return (_a = value[key]) !== null && _a !== void 0 ? _a : ''; } }) }, options),
+        _a);
+};
+exports.sqlColorColumn = sqlColorColumn;

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

@@ -0,0 +1,2 @@
+export * from './sqlRequests';
+export * from './columns';

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

@@ -0,0 +1,18 @@
+"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("./sqlRequests"), exports);
+__exportStar(require("./columns"), exports);

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

@@ -0,0 +1,3 @@
+import { ConditionDTO } from '../../../../services/sqlRequests';
+import { SqlRequestDataGridFilters } from '../types';
+export declare const convertSqlFiltersToConditions: (filters: SqlRequestDataGridFilters) => Record<string, ConditionDTO>;

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

@@ -0,0 +1,18 @@
+"use strict";
+/* eslint-disable @typescript-eslint/no-explicit-any */
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.convertSqlFiltersToConditions = void 0;
+var lodash_1 = __importDefault(require("lodash"));
+var convertSqlFiltersToConditions = function (filters) {
+    return lodash_1.default.mapValues(filters, function (filter, columnKey) { return ({
+        field: columnKey,
+        operator: filter.operator,
+        value: ['inArray', 'inRange'].includes(filter.operator)
+            ? filter.values
+            : lodash_1.default.castArray(filter.values)[0],
+    }); });
+};
+exports.convertSqlFiltersToConditions = convertSqlFiltersToConditions;

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

@@ -0,0 +1,2 @@
+import { SqlRequestDataGridProps } from './types';
+export declare const SqlRequestDataGrid: <R>({ onSelectionChange: onSelectionChangeFromProps, ...props }: SqlRequestDataGridProps<R>) => import("react/jsx-runtime").JSX.Element;