@mailstep/design-system 0.8.25 → 0.8.26-beta.1

package/ui/Blocks/CommonGrid/components/ColumnTitle/ColumnTitle.js

@@ -1,58 +0,0 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState, useCallback, useRef, useEffect } from 'react';
-import Icon from '../../../../Elements/Icon/Icon';
-import styled, { x, css } from '@xstyled/styled-components';
-// ArrowWrap and WarningWrap need to have the same size to solve resizing issues
-var WRAPPER_WIDTH = 35;
-var Wrap = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: 100%;\n  font-size: 0.8rem;\n"], ["\n  width: 100%;\n  font-size: 0.8rem;\n"])));
-var Title = styled.h4(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  margin: unset;\n  align-self: center;\n  flex-shrink: 1;\n"], ["\n  margin: unset;\n  align-self: center;\n  flex-shrink: 1;\n"])));
-var arrowStyles = css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  flex-direction: row;\n  & > * {\n    cursor: pointer;\n  }\n"], ["\n  flex-direction: row;\n  & > * {\n    cursor: pointer;\n  }\n"])));
-var InlineArrowWrap = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: ", ";\n  position: static;\n  font-size: 1rem;\n  ", "\n  margin-left: 6px;\n"], ["\n  display: ", ";\n  position: static;\n  font-size: 1rem;\n  ", "\n  margin-left: 6px;\n"])), function (_a) {
-    var $isPopup = _a.$isPopup;
-    return ($isPopup ? 'none' : 'flex');
-}, arrowStyles);
-var PopupArrowWrap = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: flex;\n  position: absolute;\n  top: 0;\n  left: -24px;\n  background-color: lightGray2;\n  font-size: 0.8rem;\n  border-radius: 0.4rem;\n  padding: 0 4px;\n  ", "\n  width: ", "px;\n  box-shadow: tooltipShadow;\n  z-index: 1;\n"], ["\n  display: flex;\n  position: absolute;\n  top: 0;\n  left: -24px;\n  background-color: lightGray2;\n  font-size: 0.8rem;\n  border-radius: 0.4rem;\n  padding: 0 4px;\n  ", "\n  width: ", "px;\n  box-shadow: tooltipShadow;\n  z-index: 1;\n"])), arrowStyles, WRAPPER_WIDTH);
-var OverflowWrap = styled.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  display: none;\n  position: relative;\n  overflow: visible;\n  &:hover {\n    display: block;\n  }\n"], ["\n  display: none;\n  position: relative;\n  overflow: visible;\n  &:hover {\n    display: block;\n  }\n"])));
-var WarningWrap = styled.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  position: relative;\n  display: ", ";\n  font-size: 0.7rem;\n  margin-right: 6px;\n  align-self: center;\n  &:hover + ", " {\n    display: flex;\n  }\n"], ["\n  position: relative;\n  display: ", ";\n  font-size: 0.7rem;\n  margin-right: 6px;\n  align-self: center;\n  &:hover + ", " {\n    display: flex;\n  }\n"])), function (_a) {
-    var $isPopup = _a.$isPopup;
-    return ($isPopup ? 'block' : 'none');
-}, OverflowWrap);
-var Content = styled.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  justify-content: ", ";\n  display: flex;\n"], ["\n  justify-content: ", ";\n  display: flex;\n"])), function (_a) {
-    var $isPopup = _a.$isPopup;
-    return ($isPopup ? 'space-between' : 'unset');
-});
-var ColumnTitle = function (_a) {
-    var title = _a.title, isSortable = _a.isSortable, onSetSort = _a.onSetSort, sortValue = _a.sortValue;
-    var _b = useState(false), isOverflowing = _b[0], setIsOverflowing = _b[1];
-    var onSetAsc = useCallback(function () { return onSetSort === null || onSetSort === void 0 ? void 0 : onSetSort('asc'); }, [onSetSort]);
-    var onSetDesc = useCallback(function () { return onSetSort === null || onSetSort === void 0 ? void 0 : onSetSort('desc'); }, [onSetSort]);
-    var onSetNull = useCallback(function () { return onSetSort === null || onSetSort === void 0 ? void 0 : onSetSort(null); }, [onSetSort]);
-    var isAsc = sortValue === 'asc';
-    var isDesc = sortValue === 'desc';
-    var wrapRef = useRef(null);
-    var contentRef = useRef(null);
-    useEffect(function () {
-        var wrapRefCopy = wrapRef.current;
-        var contentRefCopy = contentRef.current;
-        if (!wrapRefCopy || !contentRefCopy)
-            return;
-        var resizeObserver = new ResizeObserver(function () {
-            var wrapWidth = wrapRefCopy.offsetWidth;
-            var contentWidth = contentRefCopy.offsetWidth + 42; // width of sorting buttons
-            setIsOverflowing(wrapWidth <= contentWidth);
-        });
-        resizeObserver.observe(wrapRefCopy === null || wrapRefCopy === void 0 ? void 0 : wrapRefCopy.parentNode);
-        return function () {
-            resizeObserver.unobserve(wrapRefCopy === null || wrapRefCopy === void 0 ? void 0 : wrapRefCopy.parentNode);
-        };
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [wrapRef === null || wrapRef === void 0 ? void 0 : wrapRef.current]);
-    var Arrows = (_jsxs(_Fragment, { children: [_jsx(x.div, { onClick: isAsc ? onSetNull : onSetAsc, children: _jsx(Icon, { icon: "chevronUp", fill: isAsc ? 'blue2' : 'lightGray3' }) }), _jsx(x.div, { onClick: isDesc ? onSetNull : onSetDesc, children: _jsx(Icon, { icon: "chevronDown", fill: isDesc ? 'blue2' : 'lightGray3' }) })] }));
-    return (_jsx(Wrap, { ref: wrapRef, children: _jsxs(Content, { "$isPopup": isOverflowing, children: [_jsx("div", { children: _jsx(Title, { ref: contentRef, children: title }) }), isSortable && (_jsxs(_Fragment, { children: [_jsx(WarningWrap, { "$isPopup": isOverflowing, children: _jsx(Icon, { icon: "warningDual", fill: "black", secondaryColor: "yellow2" }) }), _jsx(OverflowWrap, { "$isPopup": isOverflowing, children: _jsx(PopupArrowWrap, { "$isPopup": isOverflowing, children: Arrows }) }), _jsx(InlineArrowWrap, { "$isPopup": isOverflowing, children: Arrows })] }))] }) }));
-};
-export default ColumnTitle;
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8;

package/ui/Blocks/CommonGrid/components/ColumnTitle/index.js

@@ -1,2 +0,0 @@
-import ColumnTitle from './ColumnTitle';
-export default ColumnTitle;

package/ui/Blocks/CommonGrid/components/ColumnTitle.js

@@ -1,29 +0,0 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from 'react';
-import { SortingUp, SortingDown } from './icons/Sorting';
-import styled from '@xstyled/styled-components';
-var Title = styled.span(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  & + * {\n    margin-left: 1em;\n  }\n"], ["\n  & + * {\n    margin-left: 1em;\n  }\n"])));
-var ColumnTitle = function (_a) {
-    var title = _a.title, isSortable = _a.isSortable, onSetSort = _a.onSetSort, sortValue = _a.sortValue;
-    var _b = React.useState(0), mouseDownTimestamp = _b[0], setMouseDownTimestamp = _b[1];
-    var handleMouseDown = React.useCallback(function () {
-        setMouseDownTimestamp(Date.now());
-    }, []);
-    var handleMouseUp = React.useCallback(function () {
-        var now = Date.now();
-        var duration = now - mouseDownTimestamp;
-        if (duration < 200) {
-            var newValue = sortValue ? (sortValue === 'asc' ? 'desc' : null) : 'asc';
-            if (onSetSort)
-                onSetSort(newValue);
-        }
-        setMouseDownTimestamp(0);
-    }, [mouseDownTimestamp, onSetSort, sortValue]);
-    return (_jsxs("div", { onMouseDown: isSortable ? handleMouseDown : undefined, onMouseUp: isSortable ? handleMouseUp : undefined, className: isSortable ? 'sortable' : '', children: [_jsx(Title, { children: title }), isSortable && sortValue === 'asc' && _jsx(SortingUp, { width: "16" }), isSortable && sortValue === 'desc' && _jsx(SortingDown, { width: "16" })] }));
-};
-export default React.memo(ColumnTitle);
-var templateObject_1;

package/ui/Blocks/CommonGrid/components/ControlButtons/ControlButtons.js

@@ -1,54 +0,0 @@
-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);
-};
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useMemo } from 'react';
-import Button from '../../../../Elements/Button/Button';
-import { Filter } from '../../../../Elements/Icon/icons/Filter';
-import { Settings2 } from '../../../../Elements/Icon/icons/Settings2';
-import { Sort } from '../../../../Elements/Icon/icons/Sort';
-import Tag from '../../../../Elements/Tag/Tag';
-import { palettes } from '../../../../Elements/Tag/palettes';
-import { H6 } from '../../../../Elements/Typography';
-import useQuickFilter from '../../hooks/useQuickFilter';
-import { ExtraControlButtonPosition } from '../../types';
-import { isFilterActive } from '../../utils';
-import ExtraControlButtons from '../ExtraControlButtons';
-import QuickFilter from '../QuickFilter';
-import { i18n } from '@lingui/core';
-import { Trans } from '@lingui/react';
-import { useColor, x } from '@xstyled/styled-components';
-import { ControlButtonsContainer, Left, Right, StyledColumnButton } from './styles';
-var ControlButtons = function (_a) {
-    var _b, _c;
-    var extraControlButtons = _a.extraControlButtons, gridActions = _a.gridActions, gridSelectors = _a.gridSelectors, _d = _a.quickFilter, quickFilter = _d === void 0 ? '' : _d, columns = _a.columns, filters = _a.filters, hideControlButtons = _a.hideControlButtons, displayManageColumnButton = _a.displayManageColumnButton, openManageColumnForm = _a.openManageColumnForm, setDisplayManageColumnButton = _a.setDisplayManageColumnButton, onOpenPresetsModal = _a.onOpenPresetsModal, gridName = _a.gridName, selectedPresetName = _a.selectedPresetName, withPresets = _a.withPresets, withManageColumnButton = _a.withManageColumnButton, onOpenMobileFilters = _a.onOpenMobileFilters, onOpenMobileSorting = _a.onOpenMobileSorting, isSortTerminated = _a.isSortTerminated;
-    var _e = useQuickFilter({
-        gridActions: gridActions,
-        gridSelectors: gridSelectors,
-        quickFilter: quickFilter,
-        columns: columns,
-        filters: filters
-    }), searchedValue = _e.searchedValue, translatedValue = _e.translatedValue, onChangeInputValue = _e.onChangeInputValue, onClear = _e.onClear, onClearSettings = _e.onClearSettings, onDisplayInput = _e.onDisplayInput, displayInput = _e.displayInput, isMobileInputView = _e.isMobileInputView, isMobile = _e.isMobile, filter = _e.filter;
-    useEffect(function () {
-        setDisplayManageColumnButton(!isMobileInputView && !!withManageColumnButton);
-    }, [isMobileInputView, withManageColumnButton, setDisplayManageColumnButton]);
-    var red = useColor('red1');
-    var filtersCount = useMemo(function () { return (filter ? Object.values(filter).filter(function (item) { return isFilterActive(item.value); }).length : 0); }, [filter]);
-    var hasFilterableColumns = !!(columns === null || columns === void 0 ? void 0 : columns.some(function (col) { return col.filtering; }));
-    var hasSortableColumns = !!(columns === null || columns === void 0 ? void 0 : columns.some(function (col) { return col.sorting; }));
-    var sortCount = (_c = (_b = gridSelectors.sorting) === null || _b === void 0 ? void 0 : _b.length) !== null && _c !== void 0 ? _c : 0;
-    return (_jsxs(ControlButtonsContainer, { children: [_jsxs(Left, { children: [!hideControlButtons && (_jsxs(_Fragment, { children: [quickFilter && !isMobile && (_jsx(QuickFilter, { searchedValue: searchedValue, placeholderText: i18n._({
-                                    id: 'controlButtons.searchPlaceholder',
-                                    message: "Search ".concat(translatedValue, " ..."),
-                                    values: { translatedValue: translatedValue }
-                                }), onChange: onChangeInputValue, onClear: onClear, onClick: onDisplayInput, displayInput: displayInput, isMobileInputView: isMobileInputView })), _jsx(ExtraControlButtons, { extraControlButtons: extraControlButtons, targetPosition: ExtraControlButtonPosition.TopLeft }), _jsx(x.div, { children: !!filtersCount && !isMobile && (_jsx(Button, { type: "button", onClick: onClearSettings, variant: "default", appearance: "secondary", "data-cy": "resetFiltersBtn", children: _jsx(Trans, { id: "dataGrid.buttonClearSettings", message: "Reset" }) })) })] })), isMobile && hasFilterableColumns && (_jsxs(Button, { type: "button", appearance: filtersCount ? 'primary' : 'tertiary', onClick: onOpenMobileFilters, "data-cy": "mobileFilterBtn", children: [_jsx(Filter, { fill: filtersCount ? 'white' : red }), _jsxs(H6, { variant: "semiBold", mt: 0, mb: 0, ml: "6px", children: [_jsx(Trans, { id: "dataGrid.filter", message: "Filter" }), " ", filtersCount > 0 && "(".concat(filtersCount, ")")] })] })), isMobile && hasSortableColumns && (_jsx(x.div, { ml: "10px", children: _jsxs(Button, { type: "button", appearance: sortCount ? 'primary' : 'tertiary', onClick: onOpenMobileSorting, disabled: isSortTerminated, "data-cy": "mobileSortBtn", children: [_jsx(Sort, { stroke: sortCount ? 'white' : red }), _jsxs(H6, { variant: "semiBold", mt: 0, mb: 0, ml: "6px", children: [_jsx(Trans, { id: "dataGrid.sort", message: "Sort" }), " ", sortCount > 0 && "(".concat(sortCount, ")")] })] }) })), withPresets && gridName && !isMobile && (_jsxs(_Fragment, { children: [_jsx(x.div, { mx: "12px", children: _jsx(Button, { onClick: onOpenPresetsModal, type: "button", variant: "default", appearance: "tertiary", children: _jsx(Trans, { id: "dataGrid.presets.title", message: "Presets" }) }) }), selectedPresetName && (_jsx(Tag, __assign({ size: "medium" }, palettes.redWhite, { children: _jsx(H6, { mt: 0, mb: 0, variant: "semiBold", children: selectedPresetName }) })))] }))] }), _jsxs(Right, { children: [_jsx(ExtraControlButtons, { extraControlButtons: extraControlButtons, targetPosition: ExtraControlButtonPosition.TopRight, isMobile: isMobile }), displayManageColumnButton && !isMobile && (_jsx(StyledColumnButton, { type: "button", variant: "ghost", appearance: "primary", iconLeft: _jsx(Settings2, {}), onClick: openManageColumnForm, children: _jsx(H6, { variant: "semiBold", mt: 0, mb: 0, children: _jsx(Trans, { id: "manageColumn.title", message: "Manage column" }) }) }))] })] }));
-};
-export default ControlButtons;

package/ui/Blocks/CommonGrid/components/ControlButtons/index.js

@@ -1,2 +0,0 @@
-import ControlButtons from './ControlButtons';
-export default ControlButtons;

package/ui/Blocks/CommonGrid/components/ControlButtons/styles.js

@@ -1,12 +0,0 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-import { Button } from '../../../../Elements/Button';
-import styled from '@xstyled/styled-components';
-import { th } from '@xstyled/system';
-export var ControlButtonsContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  position: sticky;\n  justify-content: space-between;\n  flex: 1;\n  left: 20px;\n"], ["\n  display: flex;\n  position: sticky;\n  justify-content: space-between;\n  flex: 1;\n  left: 20px;\n"])));
-export var Left = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  margin-right: 10px;\n"], ["\n  display: flex;\n  margin-right: 10px;\n"])));
-export var Right = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n"], ["\n  display: flex;\n"])));
-export var StyledColumnButton = styled(Button)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  position: sticky;\n  right: 20px;\n  z-index: 3;\n  margin-left: 8px;\n\n  > span > svg {\n    stroke: ", ";\n    width: 18px;\n    height: 18px;\n  }\n  > span > H6 {\n    display: none;\n  }\n  @media (min-width: 1024px) {\n    > span > H6 {\n      display: flex;\n      margin-left: 5px;\n    }\n  }\n"], ["\n  position: sticky;\n  right: 20px;\n  z-index: 3;\n  margin-left: 8px;\n\n  > span > svg {\n    stroke: ", ";\n    width: 18px;\n    height: 18px;\n  }\n  > span > H6 {\n    display: none;\n  }\n  @media (min-width: 1024px) {\n    > span > H6 {\n      display: flex;\n      margin-left: 5px;\n    }\n  }\n"])), th('colors.blue2'));
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4;

package/ui/Blocks/CommonGrid/components/DataCell.js

@@ -1,52 +0,0 @@
-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);
-};
-import { jsx as _jsx } from "react/jsx-runtime";
-import React from 'react';
-import { getCellSizeProps, getGroupClassNames, getStickyCollClassNames } from '../utils';
-import get from 'lodash/fp/get';
-import { TextCell } from './Table';
-var DataCell = function (_a) {
-    var column = _a.column, group = _a.group, rowData = _a.rowData, onRowAction = _a.onRowAction, displayColumnWidth = _a.displayColumnWidth, rowIndex = _a.rowIndex;
-    var Wrapper = column.fixedSize ? 'div' : TextCell;
-    var wrapperBaseProps = column.fixedSize
-        ? { style: __assign(__assign({}, getCellSizeProps(column, displayColumnWidth)), { alignSelf: 'center' }) }
-        : getCellSizeProps(column, displayColumnWidth);
-    var cellClassName = "cell".concat(getStickyCollClassNames(!!column.sticky, column.stickTo), " ").concat(getGroupClassNames(group));
-    if (column.cellComponent) {
-        return (_jsx(Wrapper, __assign({ className: cellClassName }, wrapperBaseProps, { children: _jsx(column.cellComponent, { rowData: rowData, onRowAction: onRowAction, column: column, rowIndex: rowIndex }) })));
-    }
-    else {
-        return (_jsx(Wrapper, __assign({ className: cellClassName }, wrapperBaseProps, { children: column.formatRowValue ? column.formatRowValue(rowData) : get(column.name, rowData) })));
-    }
-};
-var MemoDataCell = React.memo(DataCell, function (prevProps, newProps) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
-    if (prevProps.rowData !== newProps.rowData ||
-        prevProps.displayColumnWidth !== newProps.displayColumnWidth ||
-        ((_a = prevProps.column) === null || _a === void 0 ? void 0 : _a.fixedSize) != ((_b = newProps.column) === null || _b === void 0 ? void 0 : _b.fixedSize) ||
-        ((_c = prevProps.column) === null || _c === void 0 ? void 0 : _c.flexGrow) != ((_d = newProps.column) === null || _d === void 0 ? void 0 : _d.flexGrow) ||
-        ((_e = prevProps.column) === null || _e === void 0 ? void 0 : _e.flexShrink) != ((_f = newProps.column) === null || _f === void 0 ? void 0 : _f.flexShrink) ||
-        ((_g = prevProps.group) === null || _g === void 0 ? void 0 : _g.start) != ((_h = newProps.group) === null || _h === void 0 ? void 0 : _h.start) ||
-        ((_j = prevProps.group) === null || _j === void 0 ? void 0 : _j.end) != ((_k = newProps.group) === null || _k === void 0 ? void 0 : _k.end)) {
-        return false;
-    }
-    if ((((_l = prevProps.column) === null || _l === void 0 ? void 0 : _l.formatRowValue) || ((_m = newProps.column) === null || _m === void 0 ? void 0 : _m.formatRowValue)) &&
-        ((_o = prevProps.column) === null || _o === void 0 ? void 0 : _o.formatRowValue) !== ((_p = newProps.column) === null || _p === void 0 ? void 0 : _p.formatRowValue)) {
-        return false;
-    }
-    if ((((_q = prevProps.column) === null || _q === void 0 ? void 0 : _q.cellComponent) || ((_r = newProps.column) === null || _r === void 0 ? void 0 : _r.cellComponent)) &&
-        (((_s = prevProps.column) === null || _s === void 0 ? void 0 : _s.cellComponent) !== ((_t = newProps.column) === null || _t === void 0 ? void 0 : _t.cellComponent) || prevProps.onRowAction !== newProps.onRowAction)) {
-        return false;
-    }
-    return true;
-});
-export default MemoDataCell;

package/ui/Blocks/CommonGrid/components/DataRow.js

@@ -1,52 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import React from 'react';
-import { rowClassSymbol } from '../types';
-import MemoDataCell from './DataCell';
-import { StyledDataRow } from './Table';
-import { useTimeMeasurement } from './utils';
-var DataRow = function (_a) {
-    var _b;
-    var columns = _a.columns, rowData = _a.rowData, rowIndex = _a.rowIndex, uxState = _a.uxState, allowRowSelect = _a.allowRowSelect, allowRowSelectOnAction = _a.allowRowSelectOnAction, onUxChange = _a.onUxChange, onRowClick = _a.onRowClick, onRowAction = _a.onRowAction, displayColumnsWidth = _a.displayColumnsWidth, groups = _a.groups, isEven = _a.isEven;
-    var isChecked = !!((_b = uxState.checkedRows) === null || _b === void 0 ? void 0 : _b[rowData.id]);
-    var handleRowAction = React.useCallback(function (id, field, value, rowData) {
-        onRowAction === null || onRowAction === void 0 ? void 0 : onRowAction(id, field, value, rowData);
-        if (allowRowSelectOnAction) {
-            onUxChange === null || onUxChange === void 0 ? void 0 : onUxChange('selectedRow', id);
-        }
-    }, [onRowAction, allowRowSelectOnAction, onUxChange]);
-    var handleRowClick = React.useCallback(function (e) {
-        var _a, _b;
-        // test whether I should trigger event or not (because of possible button/link/input/etc in cell)
-        var classes = Object.values(e.target.classList);
-        // find children of parent that has propagation attribute
-        var parent = e.target.closest('.cell');
-        var canPropagation = ((_a = e.target.dataset) === null || _a === void 0 ? void 0 : _a.propagation) === 'true';
-        var child = e.target;
-        while (child && child !== parent && !canPropagation) {
-            child = child.parentElement;
-            canPropagation = ((_b = child === null || child === void 0 ? void 0 : child.dataset) === null || _b === void 0 ? void 0 : _b.propagation) === 'true';
-        }
-        if (!classes.includes('dataRow') && !classes.includes('cell') && !canPropagation)
-            return;
-        if (onUxChange && allowRowSelect)
-            onUxChange('selectedRow', rowData.id);
-        if (onRowClick)
-            onRowClick(rowData.id, rowData);
-    }, 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [onRowClick, onUxChange, rowData]);
-    var _c = useTimeMeasurement({ handleRowClick: handleRowClick }), handleMouseDown = _c.handleMouseDown, handleMouseUp = _c.handleMouseUp;
-    var rowClassName = React.useMemo(function () {
-        var classes = ['dataRow'];
-        if (isChecked)
-            classes.push('checked');
-        if (uxState.selectedRow === rowData.id && (allowRowSelect || allowRowSelectOnAction))
-            classes.push('selected');
-        if (rowData[rowClassSymbol])
-            classes.push(rowData[rowClassSymbol] || '');
-        return classes.join(' ');
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [isChecked, uxState, rowData]);
-    return (_jsx(StyledDataRow, { className: rowClassName, hasRowClick: !!onRowClick, onMouseDown: handleMouseDown, onMouseUp: handleMouseUp, isEven: !!isEven, children: columns.map(function (column, key) { return (_jsx(MemoDataCell, { column: column, rowData: rowData, rowIndex: rowIndex, onRowAction: handleRowAction, displayColumnWidth: displayColumnsWidth[column.name], group: groups === null || groups === void 0 ? void 0 : groups[key] }, column.name)); }) }));
-};
-export default DataRow;

package/ui/Blocks/CommonGrid/components/DropdownButton/DropdownButton.js

@@ -1,34 +0,0 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { useCallback, useState } from 'react';
-import Button from '../../../../Elements/Button/Button';
-import DropdownMenu from '../../../../Elements/DropdownMenu';
-import { ArrowDown, ArrowUp } from '../../../../Elements/Icon';
-import { useClickOutside } from '../../../Modal/hooks/useClickOutside';
-import styled from '@xstyled/styled-components';
-import { th } from '@xstyled/system';
-var ButtonWrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n  width: fit-content;\n"], ["\n  position: relative;\n  width: fit-content;\n"])));
-var StyledDropdownMenu = styled(DropdownMenu)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: absolute;\n  top: calc(100% + 4px);\n  right: 0;\n  width: max-content;\n  z-index: 2;\n"], ["\n  position: absolute;\n  top: calc(100% + 4px);\n  right: 0;\n  width: max-content;\n  z-index: 2;\n"])));
-var StyledButton = styled(Button)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  padding-right: 0;\n"], ["\n  padding-right: 0;\n"])));
-var StyledIcon = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  width: 20px;\n  height: 20px;\n  margin: 9px;\n  & > svg {\n    stroke: ", ";\n  }\n"], ["\n  width: 20px;\n  height: 20px;\n  margin: 9px;\n  & > svg {\n    stroke: ", ";\n  }\n"])), function (_a) {
-    var appearance = _a.appearance;
-    return appearance === 'secondary' ? th.color('blue2') : appearance === 'tertiary' ? th.color('red1') : 'white';
-});
-var Separator = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  height: 38px;\n  width: 1px;\n  background-color: white;\n  margin-left: 18px;\n"], ["\n  height: 38px;\n  width: 1px;\n  background-color: white;\n  margin-left: 18px;\n"])));
-var DropdownButton = function (_a) {
-    var label = _a.label, items = _a.items, appearance = _a.appearance;
-    var _b = useState(false), showDropdownMenu = _b[0], setShowDropdownMenu = _b[1];
-    var onClose = useCallback(function () {
-        setShowDropdownMenu(false);
-    }, []);
-    var handleClick = React.useCallback(function () {
-        setShowDropdownMenu(function (prev) { return !prev; });
-    }, []);
-    var ref = useClickOutside({ onClose: onClose });
-    return (_jsxs(ButtonWrapper, { ref: ref, children: [_jsxs(StyledButton, { onClick: handleClick, appearance: appearance, children: [label, _jsx(Separator, {}), _jsx(StyledIcon, { appearance: appearance, children: showDropdownMenu ? _jsx(ArrowUp, {}) : _jsx(ArrowDown, {}) })] }), _jsx(StyledDropdownMenu, { showMenu: showDropdownMenu, items: items })] }));
-};
-export default DropdownButton;
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;

package/ui/Blocks/CommonGrid/components/DropdownButton/index.js

@@ -1,2 +0,0 @@
-import DropdownButton from './DropdownButton';
-export default DropdownButton;

package/ui/Blocks/CommonGrid/components/ExtraControlButtons/ExtraControlButtons.js

@@ -1,67 +0,0 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-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);
-};
-import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
-import Button from '../../../../Elements/Button/Button';
-import DropdownSelect from '../../../../Elements/DropdownSelect';
-import ButtonMore from '../ButtonMore/ButtonMore';
-import styled, { x } from '@xstyled/styled-components';
-export var Row = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  & > * {\n    margin-right: 12px;\n  }\n  z-index: 2;\n"], ["\n  display: flex;\n  & > * {\n    margin-right: 12px;\n  }\n  z-index: 2;\n"])));
-var ControlButton = function (_a) {
-    var hide = _a.hide, node = _a.node, label = _a.label, appearance = _a.appearance, variant = _a.variant, disabled = _a.disabled, onClick = _a.onClick, onSelect = _a.onSelect, options = _a.options, hideChevron = _a.hideChevron, iconLeft = _a.iconLeft, buttonProps = _a.buttonProps;
-    if (hide) {
-        return null;
-    }
-    if (node)
-        return _jsx(_Fragment, { children: node });
-    if (options) {
-        return (_jsx(DropdownSelect, { label: label || '', appearance: appearance || 'secondary', variant: variant || 'default', options: options, showChevron: !hideChevron, onSelect: onSelect, disabled: disabled }));
-    }
-    else {
-        return (_jsx(Button, __assign({ type: "button", onClick: onClick, disabled: disabled, variant: variant || 'default', appearance: appearance || 'primary', iconLeft: iconLeft }, buttonProps, { children: label })));
-    }
-};
-var ExtraControlButtons = function (_a) {
-    var extraControlButtons = _a.extraControlButtons, isMobile = _a.isMobile, targetPosition = _a.targetPosition;
-    var buttons = targetPosition
-        ? (extraControlButtons || []).filter(function (_a) {
-            var position = _a.position, hide = _a.hide;
-            return position === targetPosition && !hide;
-        })
-        : extraControlButtons !== null && extraControlButtons !== void 0 ? extraControlButtons : [];
-    if (isMobile && (buttons === null || buttons === void 0 ? void 0 : buttons.length) > 0) {
-        var items = buttons.flatMap(function (_a) {
-            var onSelect = _a.onSelect, onClick = _a.onClick, options = _a.options, label = _a.label;
-            if (options && onSelect) {
-                return options.map(function (option) { return ({
-                    title: typeof label === 'string' && !option.label.startsWith(String(label)) ? "".concat(label, ": ").concat(option.label) : option.label,
-                    onClick: function () {
-                        onSelect(option.value);
-                    }
-                }); });
-            }
-            if (label && onClick) {
-                return [{ title: label, onClick: onClick }];
-            }
-            return [];
-        });
-        if (items.length === 0)
-            return null;
-        return _jsx(ButtonMore, { items: items });
-    }
-    return (_jsx(Row, { children: buttons === null || buttons === void 0 ? void 0 : buttons.map(function (button, idx) { return (_jsx(x.div, { children: _jsx(ControlButton, __assign({}, button)) }, idx)); }) }));
-};
-export default ExtraControlButtons;
-var templateObject_1;

package/ui/Blocks/CommonGrid/components/ExtraControlButtons/index.js

@@ -1,2 +0,0 @@
-import ExtraControlButtons from './ExtraControlButtons';
-export default ExtraControlButtons;

package/ui/Blocks/CommonGrid/components/FilterDropdown.js

@@ -1,36 +0,0 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-import { jsx as _jsx } from "react/jsx-runtime";
-import React from 'react';
-import styled from '@xstyled/styled-components';
-var OverlayWrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: absolute;\n  z-index: 1;\n  visibility: hidden;\n"], ["\n  position: absolute;\n  z-index: 1;\n  visibility: hidden;\n"])));
-var OverlayComponent = function (_a) {
-    var children = _a.children;
-    var overlayRef = React.useRef(null);
-    React.useEffect(function () {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
-        var Overlay = overlayRef.current;
-        if (!Overlay)
-            return;
-        var FilterCell = Overlay.closest('.cell');
-        var GridWrapper = FilterCell === null || FilterCell === void 0 ? void 0 : FilterCell.closest('.gridWrapper');
-        // position of left edge of filter cell
-        var relativeLeftOffset = ((_a = FilterCell === null || FilterCell === void 0 ? void 0 : FilterCell.offsetLeft) !== null && _a !== void 0 ? _a : 0) - ((_c = (_b = FilterCell === null || FilterCell === void 0 ? void 0 : FilterCell.parentElement) === null || _b === void 0 ? void 0 : _b.offsetLeft) !== null && _c !== void 0 ? _c : 0); // parent element = row
-        // space available to the right edge of visible part of grid
-        var spaceTotal = ((_d = GridWrapper === null || GridWrapper === void 0 ? void 0 : GridWrapper.clientWidth) !== null && _d !== void 0 ? _d : 0) + ((_e = GridWrapper === null || GridWrapper === void 0 ? void 0 : GridWrapper.scrollLeft) !== null && _e !== void 0 ? _e : 0) - relativeLeftOffset;
-        // difference between availible space and width
-        var spaceLeft = spaceTotal - ((_f = Overlay.clientWidth) !== null && _f !== void 0 ? _f : 0);
-        // left position
-        var left = spaceLeft > 0 ? (_g = FilterCell === null || FilterCell === void 0 ? void 0 : FilterCell.offsetLeft) !== null && _g !== void 0 ? _g : 0 : ((_h = FilterCell === null || FilterCell === void 0 ? void 0 : FilterCell.offsetLeft) !== null && _h !== void 0 ? _h : 0) + spaceLeft;
-        // top calculation
-        var topOffset = ((_j = FilterCell === null || FilterCell === void 0 ? void 0 : FilterCell.offsetTop) !== null && _j !== void 0 ? _j : 0) + ((_k = FilterCell === null || FilterCell === void 0 ? void 0 : FilterCell.clientHeight) !== null && _k !== void 0 ? _k : 0);
-        Overlay.style.left = "".concat(left, "px");
-        Overlay.style.top = "".concat(topOffset, "px");
-        Overlay.style.visibility = "initial";
-    });
-    return (_jsx(OverlayWrapper, { ref: overlayRef, className: "filterOverlay", children: children }));
-};
-export default OverlayComponent;
-var templateObject_1;

package/ui/Blocks/CommonGrid/components/FilterRow.js

@@ -1,12 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { getFilterName } from '../utils';
-import get from 'lodash/fp/get';
-import throttle from 'lodash/throttle';
-import ColumnFilterCell from './ColumnFilterCell';
-import { Row } from './Table';
-var FilterRow = function (_a) {
-    var columns = _a.columns, groups = _a.groups, actionColumn = _a.actionColumn, onChange = _a.onChange, _b = _a.filterValues, filterValues = _b === void 0 ? {} : _b, displayColumnsWidth = _a.displayColumnsWidth, filters = _a.filters, comparators = _a.comparators, handleUxChange = _a.handleUxChange, onAsyncLoadFilterOptions = _a.onAsyncLoadFilterOptions, rowsData = _a.rowsData, uxState = _a.uxState;
-    var handleOnChange = throttle(onChange, 500);
-    return (_jsx(Row, { className: "filterRow", children: columns.map(function (column, index) { return (_jsx(ColumnFilterCell, { column: column, actionColumn: actionColumn, rowsData: rowsData, uxState: uxState, handleUxChange: handleUxChange, onChange: handleOnChange, value: get([getFilterName(column), 'value'], filterValues), others: get([getFilterName(column), 'others'], filterValues), displayColumnWidth: displayColumnsWidth[column.name], filters: filters, comparators: comparators, group: groups === null || groups === void 0 ? void 0 : groups[index], onAsyncLoadFilterOptions: onAsyncLoadFilterOptions }, index)); }) }));
-};
-export default FilterRow;

package/ui/Blocks/CommonGrid/components/Filters/ActionsFilter/ActionsFilter.js

@@ -1,14 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import Checkbox from '../../../../../Forms/Checkbox';
-import { useToggleAllCheckbox } from '../../../hooks/useToggleAllCheckbox';
-import { x } from '@xstyled/styled-components';
-var ActionsFilter = function (_a) {
-    var _b, _c;
-    var actionColumn = _a.actionColumn, rowsData = _a.rowsData, uxState = _a.uxState, handleUxChange = _a.handleUxChange;
-    var _d = useToggleAllCheckbox(rowsData, uxState, handleUxChange), allChecked = _d[0], toggleCheckbox = _d[1];
-    var displayRowNumberLabel = actionColumn === null || actionColumn === void 0 ? void 0 : actionColumn.addRowNumbers;
-    var rowsNumberLabel = (_b = actionColumn === null || actionColumn === void 0 ? void 0 : actionColumn.addRowNumbersLabel) !== null && _b !== void 0 ? _b : '#';
-    var displayCheckbox = ((_c = actionColumn === null || actionColumn === void 0 ? void 0 : actionColumn.actionOptions) === null || _c === void 0 ? void 0 : _c.length) || (actionColumn === null || actionColumn === void 0 ? void 0 : actionColumn.forceCheckboxes);
-    return (_jsxs(x.div, { display: "flex", alignItems: "center", justifyContent: "space-between", gap: "16px", pl: "4px", children: [displayCheckbox && (_jsx(x.div, { w: "100%", children: _jsx(Checkbox, { checked: allChecked, onChange: toggleCheckbox, label: "" }, "check-all") })), displayRowNumberLabel && (_jsx(x.div, { w: "100%", pr: "12px", display: "flex", justifyContent: "center", children: rowsNumberLabel }))] }));
-};
-export default ActionsFilter;

package/ui/Blocks/CommonGrid/components/Filters/ActionsFilter/index.js

@@ -1,2 +0,0 @@
-import ActionsFilter from './ActionsFilter';
-export default ActionsFilter;

package/ui/Blocks/CommonGrid/components/Filters/BooleanSelect/BooleanSelect.js

@@ -1,25 +0,0 @@
-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);
-};
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useMemo } from 'react';
-import GridSelect from '../GridSelect';
-import { i18n } from '@lingui/core';
-var getFlagOptions = function () { return [
-    { value: '', label: i18n._({ id: 'dataGrid.columnActive.filterOptions.all', message: 'All' }) },
-    { value: '1', label: i18n._({ id: 'dataGrid.columnActive.filterOptions.yes', message: 'Yes' }) },
-    { value: '0', label: i18n._({ id: 'dataGrid.columnActive.filterOptions.no', message: 'No' }) }
-]; };
-var SelectFilter = function (props) {
-    var options = useMemo(function () { return getFlagOptions(); }, []);
-    return _jsx(GridSelect, __assign({ options: options }, props, { isClearable: false }));
-};
-export default SelectFilter;

package/ui/Blocks/CommonGrid/components/Filters/BooleanSelect/index.js

@@ -1,2 +0,0 @@
-import BooleanSelect from './BooleanSelect';
-export default BooleanSelect;

package/ui/Blocks/CommonGrid/components/Filters/DatePickerRange/DatePickerRange.js

@@ -1,111 +0,0 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-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 __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;
-};
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import React, { useState, useCallback, useMemo } from 'react';
-import { DateTime } from 'luxon';
-import DatePicker from '../../../../../Elements/DatePicker';
-import Input from '../../../../../Forms/Input';
-import { useClickOutside } from '../../../../Modal/hooks/useClickOutside';
-import { getCleanValues } from './utils/getCleanValues';
-import { pickerRangeToString } from './utils/pickerRangeToString';
-import { i18n } from '@lingui/core';
-import styled, { css } from '@xstyled/styled-components';
-var RangeWrapper = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: ", ";\n  flex-direction: ", ";\n  margin-right: ", ";\n\n  ", "\n"], ["\n  display: ", ";\n  flex-direction: ", ";\n  margin-right: ", ";\n\n  ", "\n"])), function (_a) {
-    var $compact = _a.$compact;
-    return ($compact ? 'flex' : 'inline-flex');
-}, function (_a) {
-    var $compact = _a.$compact;
-    return ($compact ? 'column' : 'row');
-}, function (_a) {
-    var $compact = _a.$compact;
-    return ($compact ? '0' : '20px');
-}, function (_a) {
-    var $compact = _a.$compact;
-    return $compact && css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      .rdtPicker {\n        min-width: unset;\n        width: 100%;\n        box-sizing: border-box;\n        padding: 0.5rem 0.5rem;\n      }\n      .rdtPicker .rdtDays {\n        min-width: unset;\n      }\n      .rdtPicker td {\n        padding: 0 0.2rem;\n      }\n    "], ["\n      .rdtPicker {\n        min-width: unset;\n        width: 100%;\n        box-sizing: border-box;\n        padding: 0.5rem 0.5rem;\n      }\n      .rdtPicker .rdtDays {\n        min-width: unset;\n      }\n      .rdtPicker td {\n        padding: 0 0.2rem;\n      }\n    "])));
-});
-var OverlayComponentDefault = function (_a) {
-    var children = _a.children;
-    return _jsx("div", { children: children });
-};
-var DatePickerRange = function (props) {
-    var _a, _b, _c;
-    var onChange = props.onChange, error = props.error, label = props.label, value = props.value, others = props.others, filterTime = props.filterTime, initialView = props.initialView, compact = props.compact, _d = props.OverlayComponent, OverlayComponent = _d === void 0 ? OverlayComponentDefault : _d, rest = __rest(props, ["onChange", "error", "label", "value", "others", "filterTime", "initialView", "compact", "OverlayComponent"]);
-    var _e = useState((_a = value === null || value === void 0 ? void 0 : value[0]) !== null && _a !== void 0 ? _a : undefined), startRangeValue = _e[0], setStartRangeValue = _e[1];
-    var _f = useState((_b = value === null || value === void 0 ? void 0 : value[1]) !== null && _b !== void 0 ? _b : undefined), endRangeValue = _f[0], setEndRangeValue = _f[1];
-    var timeFormat = filterTime ? 'HH:mm' : false;
-    var cleanValue = React.useMemo(function () { return getCleanValues(value); }, [value]);
-    var initialViewDate = useMemo(function () {
-        if (cleanValue[0] && cleanValue[1]) {
-            return cleanValue;
-        }
-        var firstDate = new Date();
-        firstDate.setHours(0, 0, 0, 0);
-        var secondDate = new Date();
-        secondDate.setHours(23, 59, 59, 0);
-        if (initialView === 'future') {
-            secondDate.setMonth(secondDate.getMonth() + 1);
-        }
-        else {
-            firstDate.setMonth(firstDate.getMonth());
-        }
-        return [cleanValue[0] || firstDate, cleanValue[1] || secondDate];
-    }, [cleanValue, initialView]);
-    var _g = useState(false), isOpen = _g[0], setOpen = _g[1];
-    var setDateFrom = useCallback(function (v) {
-        setStartRangeValue(v);
-        onChange([v, cleanValue[1]], others);
-    }, [onChange, others, cleanValue]);
-    var setDateTo = useCallback(function (v) {
-        setEndRangeValue(v);
-        onChange([cleanValue[0], v], others);
-    }, [onChange, others, cleanValue]);
-    var handleOthersChangeFrom = useCallback(function (othersFrom) {
-        onChange(cleanValue, [othersFrom, others === null || others === void 0 ? void 0 : others[1]]);
-    }, [onChange, cleanValue, others]);
-    var handleOthersChangeTo = useCallback(function (othersTo) {
-        onChange(cleanValue, [others === null || others === void 0 ? void 0 : others[0], othersTo]);
-    }, [onChange, cleanValue, others]);
-    var openPicker = useCallback(function () {
-        setOpen(true);
-    }, [setOpen]);
-    var clear = useCallback(function () {
-        onChange([], []);
-        setStartRangeValue(undefined);
-        setEndRangeValue(undefined);
-    }, [onChange]);
-    var isValidDateFrom = useCallback(function (current) { return !cleanValue[1] || DateTime.fromJSDate(cleanValue[1]) >= DateTime.fromJSDate(current); }, [cleanValue]);
-    var isValidDateTo = useCallback(function (current) { return !cleanValue[0] || DateTime.fromJSDate(current) >= DateTime.fromJSDate(cleanValue[0]); }, [cleanValue]);
-    var onClose = useCallback(function () {
-        setOpen(false);
-    }, []);
-    // Check if the second value is not selected and the first value is the same as the initial value
-    var secondDatePickerValue = cleanValue[1] === null ? cleanValue[0] : cleanValue[1];
-    var ref = useClickOutside({ onClose: onClose });
-    return (_jsxs("div", { ref: ref, children: [_jsx(Input, { name: props.name, type: "text", icon: "calendar", value: pickerRangeToString(cleanValue, others), label: props.label, onFocus: openPicker, iconOnClick: openPicker, onClear: clear, error: error, readOnly: true }), _jsx(OverlayComponent, { children: _jsx(_Fragment, { children: isOpen && (_jsxs(RangeWrapper, { "$compact": compact, className: "ignore-element-for-closing-hook", children: [_jsx(DatePicker, __assign({}, rest, { timeFormat: timeFormat, value: (_c = cleanValue[0]) !== null && _c !== void 0 ? _c : '', initialViewDate: initialViewDate[0], secondValue: endRangeValue, onChange: setDateFrom, others: others === null || others === void 0 ? void 0 : others[0], onChangeOthers: handleOthersChangeFrom, icon: false, label: isOpen && i18n._({ id: 'dataGrid.filterCell.from', message: 'From' }), isValidDate: isValidDateFrom, input: false, spaceAround: !compact, open: true })), _jsx(DatePicker, __assign({}, rest, { timeFormat: timeFormat, value: secondDatePickerValue, initialViewDate: initialViewDate[1], secondValue: startRangeValue, onChange: setDateTo, others: others === null || others === void 0 ? void 0 : others[1], onChangeOthers: handleOthersChangeTo, icon: false, label: isOpen && i18n._({ id: 'dataGrid.filterCell.to', message: 'To' }), isValidDate: isValidDateTo, input: false, spaceAround: !compact, open: true, isSecondDatePicker: true }))] })) }) })] }));
-};
-export default DatePickerRange;
-var templateObject_1, templateObject_2;

package/ui/Blocks/CommonGrid/components/Filters/DatePickerRange/index.js

@@ -1,2 +0,0 @@
-import DatePickerRange from './DatePickerRange';
-export default DatePickerRange;