@addev-be/ui 2.7.5 → 2.7.7

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

@@ -0,0 +1,436 @@
+"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));
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getCheckboxes = exports.colorColumn = exports.checkboxColumn = exports.percentageColumn = exports.moneyColumn = exports.numberColumn = exports.monthColumn = exports.dateColumn = exports.phoneColumn = exports.mailColumn = exports.textColumn = exports.getAdvancedRequestDto = exports.convertFiltersToConditions = exports.isColumnVisible = exports.getDateGroups = exports.groupDatesByYearAndMonth = exports.defaultValueParsers = exports.defaultFilterValues = exports.defaultFilterGetter = exports.applyFilter = exports.applyFilters = exports.filtersPredicates = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var numbers_1 = require("../../../helpers/numbers");
+var lodash_1 = __importDefault(require("lodash"));
+var moment_1 = __importDefault(require("moment"));
+/* eslint-disable @typescript-eslint/no-explicit-any */
+/* eslint-disable @typescript-eslint/no-unnecessary-type-constraint */
+var escapeRegExp = function (s) { return s.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); };
+var textContainsPredicate = function () {
+    var filterValues = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        filterValues[_i] = arguments[_i];
+    }
+    var regex = new RegExp("".concat(escapeRegExp(filterValues[0])), 'i');
+    return function (valueToVerify) { return regex.test(valueToVerify); };
+};
+var textNotContainsPredicate = function () {
+    var filterValues = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        filterValues[_i] = arguments[_i];
+    }
+    var regex = new RegExp("".concat(escapeRegExp(filterValues[0])), 'i');
+    return function (valueToVerify) { return !regex.test(valueToVerify); };
+};
+var textEqualsPredicate = function () {
+    var filterValues = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        filterValues[_i] = arguments[_i];
+    }
+    var regex = new RegExp("^".concat(escapeRegExp(filterValues[0]), "$"), 'i');
+    return function (valueToVerify) { return regex.test(valueToVerify); };
+};
+var textNotEqualsPredicate = function () {
+    var filterValues = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        filterValues[_i] = arguments[_i];
+    }
+    var regex = new RegExp("^".concat(escapeRegExp(filterValues[0]), "$"), 'i');
+    return function (valueToVerify) { return !regex.test(valueToVerify); };
+};
+var textStartsWithPredicate = function () {
+    var filterValues = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        filterValues[_i] = arguments[_i];
+    }
+    var regex = new RegExp("^".concat(escapeRegExp(filterValues[0])), 'i');
+    return function (valueToVerify) { return regex.test(valueToVerify); };
+};
+var textEndsWithPredicate = function () {
+    var filterValues = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        filterValues[_i] = arguments[_i];
+    }
+    var regex = new RegExp("".concat(escapeRegExp(filterValues[0]), "$"), 'i');
+    return function (valueToVerify) { return regex.test(valueToVerify); };
+};
+var textInArrayPredicate = function () {
+    var filterValues = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        filterValues[_i] = arguments[_i];
+    }
+    return function (valueToVerify) { return filterValues.includes(valueToVerify); };
+};
+var numberEqualsPredicate = function () {
+    var filterValues = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        filterValues[_i] = arguments[_i];
+    }
+    return function (valueToVerify) {
+        return valueToVerify === filterValues[0];
+    };
+};
+var numberNotEqualsPredicate = function () {
+    var filterValues = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        filterValues[_i] = arguments[_i];
+    }
+    return function (valueToVerify) {
+        return valueToVerify !== filterValues[0];
+    };
+};
+var numberLessThanPredicate = function () {
+    var filterValues = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        filterValues[_i] = arguments[_i];
+    }
+    return function (valueToVerify) {
+        return valueToVerify < filterValues[0];
+    };
+};
+var numberLessThanOrEqualPredicate = function () {
+    var filterValues = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        filterValues[_i] = arguments[_i];
+    }
+    return function (valueToVerify) {
+        return valueToVerify <= filterValues[0];
+    };
+};
+var numberGreaterThanPredicate = function () {
+    var filterValues = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        filterValues[_i] = arguments[_i];
+    }
+    return function (valueToVerify) {
+        return valueToVerify > filterValues[0];
+    };
+};
+var numberGreaterThanOrEqualPredicate = function () {
+    var filterValues = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        filterValues[_i] = arguments[_i];
+    }
+    return function (valueToVerify) {
+        return valueToVerify >= filterValues[0];
+    };
+};
+var numberInRangePredicate = function () {
+    var filterValues = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        filterValues[_i] = arguments[_i];
+    }
+    return function (valueToVerify) {
+        return valueToVerify >= filterValues[0] && valueToVerify <= filterValues[1];
+    };
+};
+var numberInArrayPredicate = function () {
+    var filterValues = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        filterValues[_i] = arguments[_i];
+    }
+    return function (valueToVerify) { return filterValues.includes(valueToVerify); };
+};
+exports.filtersPredicates = {
+    text: {
+        contains: textContainsPredicate,
+        notContains: textNotContainsPredicate,
+        equals: textEqualsPredicate,
+        notEquals: textNotEqualsPredicate,
+        startsWith: textStartsWithPredicate,
+        endsWith: textEndsWithPredicate,
+        inArray: textInArrayPredicate,
+    },
+    number: {
+        equals: numberEqualsPredicate,
+        notEquals: numberNotEqualsPredicate,
+        lessThan: numberLessThanPredicate,
+        lessThanOrEqual: numberLessThanOrEqualPredicate,
+        greaterThan: numberGreaterThanPredicate,
+        greaterThanOrEqual: numberGreaterThanOrEqualPredicate,
+        inRange: numberInRangePredicate,
+        inArray: numberInArrayPredicate,
+    },
+};
+var applyFilters = function (rows, filters) {
+    return filters.reduce(function (tempRows, filter) { return (0, exports.applyFilter)(tempRows, filter); }, rows);
+};
+exports.applyFilters = applyFilters;
+var applyFilter = function (rows, filter) {
+    var predicateBuilder = exports.filtersPredicates[filter.type][filter.operator];
+    if (typeof predicateBuilder !== 'function')
+        return rows;
+    var predicate = predicateBuilder.apply(void 0, filter.values);
+    return rows.filter(function (row) { return predicate(filter.getter(row)); });
+};
+exports.applyFilter = applyFilter;
+var defaultFilterGetter = function (row, columnKey) {
+    return row[columnKey];
+};
+exports.defaultFilterGetter = defaultFilterGetter;
+exports.defaultFilterValues = {
+    text: '',
+    number: 0,
+};
+exports.defaultValueParsers = {
+    text: function (value) { return value; },
+    number: function (value) { return parseFloat(value); },
+};
+var groupDatesByYearAndMonth = function (dates) {
+    return dates.reduce(function (acc, date) {
+        var year = (0, moment_1.default)(date).format('YYYY');
+        if (!acc[year]) {
+            acc[year] = {};
+        }
+        var yearAndMonth = (0, moment_1.default)(date).format("YYYY-MM");
+        if (!acc[year][yearAndMonth]) {
+            acc[year][yearAndMonth] = [];
+        }
+        acc[year][yearAndMonth].push(date);
+        return acc;
+    }, {});
+};
+exports.groupDatesByYearAndMonth = groupDatesByYearAndMonth;
+var getDateGroups = function (dates) {
+    var grouperDates = (0, exports.groupDatesByYearAndMonth)(dates);
+    return Object.entries(grouperDates).map(function (_a) {
+        var year = _a[0], months = _a[1];
+        return ({
+            name: year,
+            values: Object.values(months).flat(),
+            groups: Object.entries(months).map(function (_a) {
+                var month = _a[0], dates = _a[1];
+                return ({
+                    name: month,
+                    values: dates,
+                });
+            }),
+        });
+    });
+};
+exports.getDateGroups = getDateGroups;
+var isColumnVisible = function (obj) {
+    return (obj === null || obj === void 0 ? void 0 : obj.order) !== -1;
+};
+exports.isColumnVisible = isColumnVisible;
+var convertFiltersToConditions = function (filters) {
+    return Object.entries(filters).map(function (_a) {
+        var columnKey = _a[0], filter = _a[1];
+        var condition = {
+            field: {
+                fieldName: columnKey,
+            },
+            operator: filter.operator,
+            value: ['inArray', 'inRange'].includes(filter.operator)
+                ? filter.values
+                : lodash_1.default.castArray(filter.values)[0],
+        };
+        return condition;
+    });
+};
+exports.convertFiltersToConditions = convertFiltersToConditions;
+var getAdvancedRequestDto = function (type, columns, conditions, orderBy, start, length, getTotal) {
+    if (conditions === void 0) { conditions = []; }
+    if (orderBy === void 0) { orderBy = []; }
+    if (start === void 0) { start = 0; }
+    if (length === void 0) { length = 100; }
+    if (getTotal === void 0) { getTotal = false; }
+    return ({
+        fields: __spreadArray([
+            {
+                fieldName: 'Id',
+            },
+            {
+                fieldName: 'DbId',
+            }
+        ], Object.keys(columns).map(function (key) {
+            var _a, _b;
+            return columns[key].field
+                ? __assign(__assign({}, columns[key].field), { fieldName: (_b = (_a = columns[key].field) === null || _a === void 0 ? void 0 : _a.fieldName) !== null && _b !== void 0 ? _b : key, fieldAlias: key }) : {
+                fieldName: key,
+                fieldAlias: key,
+            };
+        }), true),
+        conditions: __spreadArray(__spreadArray([], conditions, true), [
+            {
+                field: {
+                    fieldName: 'DeletedAt',
+                },
+                operator: 'isNull',
+            },
+        ], false),
+        orderBy: orderBy,
+        type: type,
+        start: start,
+        length: length,
+        getTotal: getTotal,
+    });
+};
+exports.getAdvancedRequestDto = getAdvancedRequestDto;
+var textColumn = function (key, title, options) {
+    var _a;
+    return (_a = {},
+        _a[key] = __assign({ name: title, render: function (col, 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: {
+                type: 'text',
+                operator: 'contains',
+                values: [''],
+                getter: function (row) { var _a; return (_a = row[key]) !== null && _a !== void 0 ? _a : ''; },
+            } }, options),
+        _a);
+};
+exports.textColumn = textColumn;
+var mailColumn = function (key, title, options) {
+    var _a;
+    return (_a = {},
+        _a[key] = __assign({ name: title, render: function (col, row) {
+                var _a;
+                return ((0, jsx_runtime_1.jsx)("a", { className: "text-blue-500 hover:text-blue-700", 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: {
+                type: 'text',
+                operator: 'contains',
+                values: [''],
+                getter: function (row) { var _a; return (_a = row[key]) !== null && _a !== void 0 ? _a : ''; },
+            } }, options),
+        _a);
+};
+exports.mailColumn = mailColumn;
+var phoneColumn = function (key, title, options) {
+    var _a;
+    return (_a = {},
+        _a[key] = __assign({ name: title, render: function (col, row) {
+                var _a;
+                return ((0, jsx_runtime_1.jsx)("a", { className: "text-blue-500 hover:text-blue-700", 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: {
+                type: 'text',
+                operator: 'contains',
+                values: [''],
+                getter: function (row) { var _a; return (_a = row[key]) !== null && _a !== void 0 ? _a : ''; },
+            } }, options),
+        _a);
+};
+exports.phoneColumn = phoneColumn;
+var dateColumn = function (key, title, options) {
+    var _a;
+    return (_a = {},
+        _a[key] = __assign({ name: title, render: function (col, 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: {
+                type: 'text',
+                operator: 'contains',
+                values: [''],
+                getter: function (row) { var _a; return (_a = row[key]) !== null && _a !== void 0 ? _a : ''; },
+            } }, options),
+        _a);
+};
+exports.dateColumn = dateColumn;
+var monthColumn = function (key, title, options) {
+    var _a;
+    return (_a = {},
+        _a[key] = __assign({ name: title, render: function (col, 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: {
+                type: 'text',
+                operator: 'contains',
+                values: [''],
+                getter: function (row) { var _a; return (_a = row[key]) !== null && _a !== void 0 ? _a : ''; },
+            } }, options),
+        _a);
+};
+exports.monthColumn = monthColumn;
+var numberColumn = function (key, title, decimals, options) {
+    var _a;
+    if (decimals === void 0) { decimals = 2; }
+    return (_a = {},
+        _a[key] = __assign({ name: title, render: function (col, 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: {
+                type: 'number',
+                operator: 'equals',
+                values: [0],
+                getter: function (row) { var _a; return (_a = row[key]) !== null && _a !== void 0 ? _a : 0; },
+            } }, options),
+        _a);
+};
+exports.numberColumn = numberColumn;
+var moneyColumn = function (key, title, decimals, options) {
+    var _a;
+    if (decimals === void 0) { decimals = 2; }
+    return (_a = {},
+        _a[key] = __assign({ name: title, render: function (col, 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: {
+                type: 'number',
+                operator: 'equals',
+                values: [0],
+                getter: function (row) { var _a; return (_a = row[key]) !== null && _a !== void 0 ? _a : 0; },
+            } }, options),
+        _a);
+};
+exports.moneyColumn = moneyColumn;
+var percentageColumn = function (key, title, options) {
+    var _a;
+    return (_a = {},
+        _a[key] = __assign({ name: title, render: function (col, 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: {
+                type: 'number',
+                operator: 'equals',
+                values: [0],
+                getter: function (row) { var _a; return (_a = row[key]) !== null && _a !== void 0 ? _a : 0; },
+            } }, options),
+        _a);
+};
+exports.percentageColumn = percentageColumn;
+var checkboxColumn = function (key, title, options) {
+    var _a;
+    return (_a = {},
+        _a[key] = __assign({ name: title, render: function (col, 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: {
+                type: 'number',
+                operator: 'equals',
+                values: [0],
+                getter: function (row) { var _a; return (_a = row[key]) !== null && _a !== void 0 ? _a : 0; },
+            } }, options),
+        _a);
+};
+exports.checkboxColumn = checkboxColumn;
+var colorColumn = function (key, title, options) {
+    var _a;
+    return (_a = {},
+        _a[key] = __assign({ name: title, render: function (col, 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: {
+                type: 'text',
+                operator: 'contains',
+                values: [''],
+                getter: function (row) { var _a; return (_a = row[key]) !== null && _a !== void 0 ? _a : ''; },
+            } }, options),
+        _a);
+};
+exports.colorColumn = colorColumn;
+var getCheckboxes = function (values, formatter, groups, level) {
+    if (level === void 0) { level = 0; }
+    return __spreadArray(__spreadArray([], (groups !== null && groups !== void 0 ? groups : [])
+        .map(function (group) { var _a; return (0, exports.getCheckboxes)((_a = group.values) !== null && _a !== void 0 ? _a : [], formatter, group.groups, level + 1); })
+        .flat(), true), values.map(function (value) { return ({
+        displayValue: formatter(value),
+        values: [value],
+        level: level,
+    }); }), true);
+};
+exports.getCheckboxes = getCheckboxes;

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

@@ -9,6 +9,7 @@ type DataGridHeaderCellContainerProps = {
     $isResizing?: boolean;
     $headerColor?: ThemeColor;
     $hasFilterOpened?: boolean;
+    $textAlign?: 'left' | 'center' | 'right';
 };
 export declare const DataGridHeaderCellContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, DataGridHeaderCellContainerProps>> & string;
 export declare const DataGridHeaderTextContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

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

@@ -47,7 +47,14 @@ exports.DataGridResizeGrip = styled_components_1.default.div(templateObject_3 ||
     var _b = _a.$headerColor, $headerColor = _b === void 0 ? 'base' : _b;
     return (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    background-color: var(--color-", "-400);\n    &:hover,\n    &.active {\n      background-color: var(--color-", "-500);\n    }\n  "], ["\n    background-color: var(--color-", "-400);\n    &:hover,\n    &.active {\n      background-color: var(--color-", "-500);\n    }\n  "])), $headerColor, $headerColor);
 });
-exports.DataGridHeaderCellContainer = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  flex-wrap: nowrap;\n  font-weight: bold;\n  gap: var(--space-1);\n  height: 100%;\n  user-select: none;\n  line-height: 1.5rem;\n  padding: 0 var(--space-3);\n  position: relative;\n  box-sizing: border-box;\n\n  z-index: ", ";\n\n  ", "\n\n  button {\n    display: ", ";\n  }\n\n  &:hover {\n    ", " {\n      display: block;\n    }\n    button {\n      display: flex;\n    }\n  }\n\n  & > span {\n    display: inline-block;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    white-space: nowrap;\n    flex: 1;\n    font-weight: bold;\n  }\n"], ["\n  align-items: center;\n  display: flex;\n  flex-wrap: nowrap;\n  font-weight: bold;\n  gap: var(--space-1);\n  height: 100%;\n  user-select: none;\n  line-height: 1.5rem;\n  padding: 0 var(--space-3);\n  position: relative;\n  box-sizing: border-box;\n\n  z-index: ", ";\n\n  ", "\n\n  button {\n    display: ", ";\n  }\n\n  &:hover {\n    ", " {\n      display: block;\n    }\n    button {\n      display: flex;\n    }\n  }\n\n  & > span {\n    display: inline-block;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    white-space: nowrap;\n    flex: 1;\n    font-weight: bold;\n  }\n"])), function (_a) {
+exports.DataGridHeaderCellContainer = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  flex-wrap: nowrap;\n  font-weight: bold;\n  gap: var(--space-1);\n  height: 100%;\n  user-select: none;\n  line-height: 1.5rem;\n  padding: 0 var(--space-3);\n  position: relative;\n  box-sizing: border-box;\n  justify-content: ", ";\n\n  z-index: ", ";\n\n  ", "\n\n  button {\n    display: ", ";\n  }\n\n  &:hover {\n    ", " {\n      display: block;\n    }\n    button {\n      display: flex;\n    }\n  }\n\n  & > span {\n    display: inline-block;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    white-space: nowrap;\n    flex: 1;\n    font-weight: bold;\n  }\n"], ["\n  align-items: center;\n  display: flex;\n  flex-wrap: nowrap;\n  font-weight: bold;\n  gap: var(--space-1);\n  height: 100%;\n  user-select: none;\n  line-height: 1.5rem;\n  padding: 0 var(--space-3);\n  position: relative;\n  box-sizing: border-box;\n  justify-content: ", ";\n\n  z-index: ", ";\n\n  ", "\n\n  button {\n    display: ", ";\n  }\n\n  &:hover {\n    ", " {\n      display: block;\n    }\n    button {\n      display: flex;\n    }\n  }\n\n  & > span {\n    display: inline-block;\n    text-overflow: ellipsis;\n    overflow: hidden;\n    white-space: nowrap;\n    flex: 1;\n    font-weight: bold;\n  }\n"])), function (_a) {
+    var _b = _a.$textAlign, $textAlign = _b === void 0 ? 'left' : _b;
+    return $textAlign === 'left'
+        ? 'flex-start'
+        : $textAlign === 'center'
+            ? 'center'
+            : 'flex-end';
+}, function (_a) {
     var $isResizing = _a.$isResizing;
     return ($isResizing ? 1 : 0);
 }, function (_a) {
@@ -60,7 +67,7 @@ exports.DataGridHeaderCellContainer = styled_components_1.default.div(templateOb
 }, exports.DataGridResizeGrip);
 exports.DataGridHeaderCellContainer.displayName = 'DataGridHeaderCellContainer';
 exports.DataGridHeaderTextContainer = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  display: flex;\n  flex: 1;\n  line-height: 1rem;\n  align-items: center;\n  font-size: var(--text-md);\n  max-height: 100%;\n"], ["\n  display: flex;\n  flex: 1;\n  line-height: 1rem;\n  align-items: center;\n  font-size: var(--text-md);\n  max-height: 100%;\n"])));
-exports.dataGridCellCss = (0, styled_components_1.css)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  position: relative;\n  padding: 0 var(--space-3);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  user-select: ", ";\n  white-space: nowrap;\n  ", "\n  background-color: ", ";\n  text-align: ", ";\n"], ["\n  display: flex;\n  align-items: center;\n  position: relative;\n  padding: 0 var(--space-3);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  user-select: ", ";\n  white-space: nowrap;\n  ", "\n  background-color: ", ";\n  text-align: ", ";\n"])), function (_a) {
+exports.dataGridCellCss = (0, styled_components_1.css)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  position: relative;\n  padding: 0 var(--space-3);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  user-select: ", ";\n  white-space: nowrap;\n  ", "\n  background-color: ", ";\n  justify-content: ", ";\n"], ["\n  display: flex;\n  align-items: center;\n  position: relative;\n  padding: 0 var(--space-3);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  user-select: ", ";\n  white-space: nowrap;\n  ", "\n  background-color: ", ";\n  justify-content: ", ";\n"])), function (_a) {
     var $userSelect = _a.$userSelect;
     return ($userSelect ? 'text' : 'none');
 }, function (_a) {
@@ -71,7 +78,11 @@ exports.dataGridCellCss = (0, styled_components_1.css)(templateObject_9 || (temp
     return "var(--color-".concat($color, "-50)");
 }, function (_a) {
     var _b = _a.$textAlign, $textAlign = _b === void 0 ? 'left' : _b;
-    return $textAlign;
+    return $textAlign === 'left'
+        ? 'flex-start'
+        : $textAlign === 'center'
+            ? 'center'
+            : 'flex-end';
 });
 exports.DataGridCell = styled_components_1.default.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), exports.dataGridCellCss);
 exports.DataGridCell.displayName = 'DataGridCell';

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

@@ -0,0 +1,20 @@
+import { ColumnDTO, ConditionDTO } from '../../../../services/smartQueries';
+import { SmartQueryDataGridColumn, SmartQueryDataGridColumns } from '../types';
+export declare const smartTextColumn: <R extends Record<string, any>>(key: string, title: string, options?: Partial<SmartQueryDataGridColumn<R>>) => SmartQueryDataGridColumns<R>;
+/**
+ * Creates a column with a composed value from multiple fields,
+ * and filtered by a text filter on the first field
+ */
+export declare const smartComposedColumn: <R extends Record<string, any>>(key: string, title: string, fields: string[], options?: Partial<SmartQueryDataGridColumn<R>>) => SmartQueryDataGridColumns<R>;
+export declare const smartMailColumn: <R extends Record<string, any>>(key: string, title: string, options?: Partial<SmartQueryDataGridColumn<R>>) => SmartQueryDataGridColumns<R>;
+export declare const smartPhoneColumn: <R extends Record<string, any>>(key: string, title: string, options?: Partial<SmartQueryDataGridColumn<R>>) => SmartQueryDataGridColumns<R>;
+export declare const smartDateColumn: <R extends Record<string, any>>(key: string, title: string, options?: Partial<SmartQueryDataGridColumn<R>>) => SmartQueryDataGridColumns<R>;
+export declare const smartDateTimeColumn: <R extends Record<string, any>>(key: string, title: string, options?: Partial<SmartQueryDataGridColumn<R>>) => SmartQueryDataGridColumns<R>;
+export declare const smartMonthColumn: <R extends Record<string, any>>(key: string, title: string, options?: Partial<SmartQueryDataGridColumn<R>>) => SmartQueryDataGridColumns<R>;
+export declare const smartNumberColumn: <R extends Record<string, any>>(key: string, title: string, decimals?: number, options?: Partial<SmartQueryDataGridColumn<R>>) => SmartQueryDataGridColumns<R>;
+export declare const smartMoneyColumn: <R extends Record<string, any>>(key: string, title: string, decimals?: number, options?: Partial<SmartQueryDataGridColumn<R>>) => SmartQueryDataGridColumns<R>;
+export declare const smartPercentageColumn: <R extends Record<string, any>>(key: string, title: string, decimals?: number, options?: Partial<SmartQueryDataGridColumn<R>>) => SmartQueryDataGridColumns<R>;
+export declare const smartCheckboxColumn: <R extends Record<string, any>>(key: string, title: string, options?: Partial<SmartQueryDataGridColumn<R>>) => SmartQueryDataGridColumns<R>;
+export declare const smartColorColumn: <R extends Record<string, any>>(key: string, title: string, options?: Partial<SmartQueryDataGridColumn<R>>) => SmartQueryDataGridColumns<R>;
+export declare const getColumnsConditions: (columns: ColumnDTO[]) => ConditionDTO[];
+export declare const getFooterColumn: (column: ColumnDTO) => ColumnDTO;