@mailstep/design-system 0.6.2-beta.6 → 0.6.2-beta.8

package/ui/Blocks/CommonGrid/hooks/useColumnSizes.js

@@ -1,32 +1,37 @@
-import React from 'react';
-import sum from 'lodash/sum';
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+var sum_1 = __importDefault(require("lodash/sum"));
 var useColumnSizes = function (displayColumnsDefinitions, storeColumnsWidth, storeColumnsWidthVariant, setColumnWidth, columnLayout, minColumnWidth) {
     /**
      * decorate grid resize with layout and reset grid widths if layout changes
      */
     if (minColumnWidth === void 0) { minColumnWidth = 50; }
-    var handleSetColumnWidth = React.useCallback(function (columnWidth) { return setColumnWidth(columnWidth, columnLayout); }, [columnLayout, setColumnWidth]);
-    React.useEffect(function () {
+    var handleSetColumnWidth = react_1.default.useCallback(function (columnWidth) { return setColumnWidth(columnWidth, columnLayout); }, [columnLayout, setColumnWidth]);
+    react_1.default.useEffect(function () {
         if (storeColumnsWidthVariant != columnLayout)
             handleSetColumnWidth(null);
     }, [columnLayout, storeColumnsWidthVariant, handleSetColumnWidth]);
     /**
      * base width of each displayed column and of all displayed columns put together
      */
-    var displayColumnsWidth = React.useMemo(function () {
+    var displayColumnsWidth = react_1.default.useMemo(function () {
         var displayColumnsWidth = {};
         displayColumnsDefinitions.forEach(function (column) { return (displayColumnsWidth[column.name] = (storeColumnsWidth === null || storeColumnsWidth === void 0 ? void 0 : storeColumnsWidth[column.name]) || column.flexBasis); });
         return displayColumnsWidth;
     }, [displayColumnsDefinitions, storeColumnsWidth]);
-    var totalColumnsWidth = React.useMemo(function () {
-        return sum(Object.values(displayColumnsWidth));
+    var totalColumnsWidth = react_1.default.useMemo(function () {
+        return (0, sum_1.default)(Object.values(displayColumnsWidth));
     }, [displayColumnsWidth]);
     /**
      * handling of remaining space
      */
     // TODO optimize better
-    var gridBoxRef = React.useRef(null);
-    var testAdjustLastColumn = React.useCallback(function () {
+    var gridBoxRef = react_1.default.useRef(null);
+    var testAdjustLastColumn = react_1.default.useCallback(function () {
         var _a;
         var _b;
         var gridWidth = ((_b = gridBoxRef === null || gridBoxRef === void 0 ? void 0 : gridBoxRef.current) === null || _b === void 0 ? void 0 : _b.clientWidth) || null;
@@ -38,17 +43,17 @@ var useColumnSizes = function (displayColumnsDefinitions, storeColumnsWidth, sto
             }
         }
     }, [columnLayout, displayColumnsDefinitions, displayColumnsWidth, gridBoxRef, handleSetColumnWidth, totalColumnsWidth]);
-    React.useEffect(function () {
+    react_1.default.useEffect(function () {
         testAdjustLastColumn();
     }, [testAdjustLastColumn]);
-    React.useLayoutEffect(function () {
+    react_1.default.useLayoutEffect(function () {
         window.addEventListener('resize', testAdjustLastColumn);
         return function () { return window.removeEventListener('resize', testAdjustLastColumn); };
     }, [testAdjustLastColumn]);
     /**
      * resizing of columns
      */
-    var handleResizeDrag = React.useCallback(function (columnName, width) {
+    var handleResizeDrag = react_1.default.useCallback(function (columnName, width) {
         var _a, _b;
         var _c;
         var i = displayColumnsDefinitions.findIndex(function (_a) {
@@ -80,4 +85,4 @@ var useColumnSizes = function (displayColumnsDefinitions, storeColumnsWidth, sto
     }, [displayColumnsDefinitions, columnLayout, displayColumnsWidth, totalColumnsWidth, minColumnWidth, handleSetColumnWidth]);
     return { totalColumnsWidth: totalColumnsWidth, gridBoxRef: gridBoxRef, displayColumnsWidth: displayColumnsWidth, handleResizeDrag: handleResizeDrag };
 };
-export default useColumnSizes;
+exports.default = useColumnSizes;

package/ui/Blocks/CommonGrid/hooks/useEditReadAsColumn.js

@@ -1,3 +1,4 @@
+"use strict";
 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)) {
@@ -7,8 +8,12 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     }
     return to.concat(ar || Array.prototype.slice.call(from));
 };
-import { useCallback, useMemo } from 'react';
-import getReadEditButtonCell from '../components/ReadEditButtonCell/index.js';
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = require("react");
+var ReadEditButtonCell_1 = __importDefault(require("../components/ReadEditButtonCell"));
 /**
  * Because in new design we are displaying lot of the controlls differently, including read and edit buttons in grid,
  * easiest way to make all the definition changes is to just overwrite the here once, instead of modifying every single grid (33 instances atm).
@@ -16,7 +21,7 @@ import getReadEditButtonCell from '../components/ReadEditButtonCell/index.js';
  * */
 var useEditReadAsColumn = function (props) {
     var onRowAction = props.onRowAction, actionColumnDefinition = props.actionColumnDefinition, columnsDefinitions = props.columnsDefinitions, onRowEditClick = props.onRowEditClick, onRowReadClick = props.onRowReadClick;
-    var modifiedActionColumnDefinition = useMemo(function () {
+    var modifiedActionColumnDefinition = (0, react_1.useMemo)(function () {
         var _a;
         if ((actionColumnDefinition === null || actionColumnDefinition === void 0 ? void 0 : actionColumnDefinition.forceCheckboxes) || ((_a = actionColumnDefinition === null || actionColumnDefinition === void 0 ? void 0 : actionColumnDefinition.actionOptions) === null || _a === void 0 ? void 0 : _a.length)) {
             // note: this also removes actions, because we render action trigger outside the grid anyway
@@ -29,7 +34,7 @@ var useEditReadAsColumn = function (props) {
             return undefined;
         }
     }, [actionColumnDefinition]);
-    var modifiedOnRowAction = useCallback(function (id, field, value) {
+    var modifiedOnRowAction = (0, react_1.useCallback)(function (id, field, value) {
         if (field === 'row_edit' || field === 'row_read') {
             if (field === 'row_edit' && onRowEditClick)
                 onRowEditClick(id, value);
@@ -41,8 +46,8 @@ var useEditReadAsColumn = function (props) {
         }
     }, [onRowAction, onRowEditClick, onRowReadClick]);
     // TODO Entire logic of row edit / row read need to be completely refactored.
-    var CellComponent = useMemo(function () { return getReadEditButtonCell(actionColumnDefinition); }, [actionColumnDefinition]);
-    var modifiedColumnsDefinitions = useMemo(function () {
+    var CellComponent = (0, react_1.useMemo)(function () { return (0, ReadEditButtonCell_1.default)(actionColumnDefinition); }, [actionColumnDefinition]);
+    var modifiedColumnsDefinitions = (0, react_1.useMemo)(function () {
         if ((actionColumnDefinition === null || actionColumnDefinition === void 0 ? void 0 : actionColumnDefinition.canRowEdit) !== undefined || (actionColumnDefinition === null || actionColumnDefinition === void 0 ? void 0 : actionColumnDefinition.canRowRead) !== undefined) {
             return __spreadArray(__spreadArray([], columnsDefinitions, true), [
                 {
@@ -67,4 +72,4 @@ var useEditReadAsColumn = function (props) {
         onRowAction: modifiedOnRowAction,
     };
 };
-export default useEditReadAsColumn;
+exports.default = useEditReadAsColumn;

package/ui/Blocks/CommonGrid/hooks/useFloatingButton.js

@@ -1,6 +1,8 @@
-import { useMemo } from 'react';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = require("react");
 var useFloatingButton = function (hasPermission, onClick, options, onSelect) {
-    return useMemo(function () {
+    return (0, react_1.useMemo)(function () {
         if (!hasPermission)
             return;
         return {
@@ -10,4 +12,4 @@ var useFloatingButton = function (hasPermission, onClick, options, onSelect) {
         };
     }, [hasPermission, onClick, options, onSelect]);
 };
-export default useFloatingButton;
+exports.default = useFloatingButton;

package/ui/Blocks/CommonGrid/hooks/useGetGridHeight.js

@@ -1,11 +1,13 @@
-import { useEffect, useMemo, useRef, useState } from 'react';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = require("react");
 var useGetGridHeight = function () {
-    var _a = useState(window.innerHeight), windowHeight = _a[0], setWindowHeight = _a[1];
-    var _b = useState(0), topDistance = _b[0], setTopDistance = _b[1];
-    var _c = useState(0), bottomDistance = _c[0], setBottomDistance = _c[1];
-    var gridRef = useRef(null);
-    var paginationRef = useRef(null);
-    useEffect(function () {
+    var _a = (0, react_1.useState)(window.innerHeight), windowHeight = _a[0], setWindowHeight = _a[1];
+    var _b = (0, react_1.useState)(0), topDistance = _b[0], setTopDistance = _b[1];
+    var _c = (0, react_1.useState)(0), bottomDistance = _c[0], setBottomDistance = _c[1];
+    var gridRef = (0, react_1.useRef)(null);
+    var paginationRef = (0, react_1.useRef)(null);
+    (0, react_1.useEffect)(function () {
         var handleResize = function () {
             var _a, _b;
             setTopDistance(((_a = gridRef.current) === null || _a === void 0 ? void 0 : _a.offsetTop) || 0);
@@ -18,7 +20,7 @@ var useGetGridHeight = function () {
             window.removeEventListener('resize', handleResize);
         };
     }, []);
-    var gridHeight = useMemo(function () {
+    var gridHeight = (0, react_1.useMemo)(function () {
         var calculatedHeight = windowHeight - topDistance - bottomDistance;
         if (calculatedHeight !== windowHeight && calculatedHeight > 360) {
             return calculatedHeight - 25;
@@ -30,4 +32,4 @@ var useGetGridHeight = function () {
     }, [bottomDistance, topDistance, windowHeight]);
     return { gridHeight: gridHeight, gridRef: gridRef, paginationRef: paginationRef };
 };
-export default useGetGridHeight;
+exports.default = useGetGridHeight;

package/ui/Blocks/CommonGrid/hooks/useGridActionTrigger.js

@@ -1,25 +1,32 @@
-import { useMemo, useCallback } from 'react';
-import find from 'lodash/find';
-export var useGridActionTrigger = function (rowsData, uxState, actionOptions, onBatchAction) {
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useGridActionTrigger = void 0;
+var react_1 = require("react");
+var find_1 = __importDefault(require("lodash/find"));
+var useGridActionTrigger = function (rowsData, uxState, actionOptions, onBatchAction) {
     if (actionOptions === void 0) { actionOptions = []; }
-    var actionRows = useMemo(function () {
+    var actionRows = (0, react_1.useMemo)(function () {
         return (rowsData || []).filter(function (row) { var _a; return (_a = uxState.checkedRows) === null || _a === void 0 ? void 0 : _a[row.id]; });
     }, [uxState, rowsData]);
-    var enabledActions = useMemo(function () {
+    var enabledActions = (0, react_1.useMemo)(function () {
         var actionsOptions = actionOptions || [];
         return actionsOptions.filter(function (action) {
             if (action.isEnabled) {
                 return action.isEnabled(actionRows);
             }
             else {
-                return uxState.checkedRows && find(uxState.checkedRows, Boolean);
+                return uxState.checkedRows && (0, find_1.default)(uxState.checkedRows, Boolean);
             }
         });
     }, [uxState, actionRows, actionOptions]);
-    var handleBatchAction = useCallback(function (value) {
+    var handleBatchAction = (0, react_1.useCallback)(function (value) {
         var actionsOptions = actionOptions || [];
         var action = actionsOptions.find(function (option) { return option.value == value; });
         action && onBatchAction && onBatchAction(action, actionRows);
     }, [actionOptions, onBatchAction, actionRows]);
     return [enabledActions, handleBatchAction];
 };
+exports.useGridActionTrigger = useGridActionTrigger;

package/ui/Blocks/CommonGrid/hooks/useManageColumn.js

@@ -1,3 +1,4 @@
+"use strict";
 var __assign = (this && this.__assign) || function () {
     __assign = Object.assign || function(t) {
         for (var s, i = 1, n = arguments.length; i < n; i++) {
@@ -9,26 +10,27 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-import { useCallback, useMemo, useState } from 'react';
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = require("react");
 var useManageColumn = function (_a) {
     var columns = _a.columns, gridSelectors = _a.gridSelectors, gridActions = _a.gridActions, onClose = _a.onClose;
     var resetGrid = gridActions.resetGrid, setColumnConfig = gridActions.setColumnConfig;
     var columnConfig = gridSelectors.columnConfig;
-    var _b = useState(__assign({}, columnConfig)), columnsConfigOptions = _b[0], setColumnsConfigOptions = _b[1];
-    var columnsConfigValues = useMemo(function () {
+    var _b = (0, react_1.useState)(__assign({}, columnConfig)), columnsConfigOptions = _b[0], setColumnsConfigOptions = _b[1];
+    var columnsConfigValues = (0, react_1.useMemo)(function () {
         return columns === null || columns === void 0 ? void 0 : columns.filter(function (column) {
             var _a;
             var isHidden = (_a = columnConfig === null || columnConfig === void 0 ? void 0 : columnConfig[column.name]) === null || _a === void 0 ? void 0 : _a.isHidden;
             return (column === null || column === void 0 ? void 0 : column.alwaysOn) || typeof isHidden === 'boolean' ? !isHidden : !(column === null || column === void 0 ? void 0 : column.defaultHidden);
         }).map(function (column) { return column.name; });
     }, [columnConfig, columns]);
-    var onConfirmForm = useCallback(function () {
+    var onConfirmForm = (0, react_1.useCallback)(function () {
         (setColumnConfig === null || setColumnConfig === void 0 ? void 0 : setColumnConfig(columnsConfigOptions)) && (onClose === null || onClose === void 0 ? void 0 : onClose());
     }, [columnsConfigOptions, onClose, setColumnConfig]);
-    var resetColumnConfig = useCallback(function () {
+    var resetColumnConfig = (0, react_1.useCallback)(function () {
         (resetGrid === null || resetGrid === void 0 ? void 0 : resetGrid()) && (onClose === null || onClose === void 0 ? void 0 : onClose());
         setColumnsConfigOptions(columnConfig || {});
     }, [onClose, resetGrid]);
     return { columnsConfigValues: columnsConfigValues, setColumnsConfigOptions: setColumnsConfigOptions, onConfirmForm: onConfirmForm, resetColumnConfig: resetColumnConfig };
 };
-export default useManageColumn;
+exports.default = useManageColumn;

package/ui/Blocks/CommonGrid/hooks/useRowsKeyControls.js

@@ -1,6 +1,11 @@
-import React from 'react';
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
 var useRowsKeyControls = function (rowsData, uxState, onUxChange) {
-    return React.useCallback(function (e) {
+    return react_1.default.useCallback(function (e) {
         var _a, _b;
         var selectedRowId = uxState.selectedRow;
         if (!selectedRowId)
@@ -18,4 +23,4 @@ var useRowsKeyControls = function (rowsData, uxState, onUxChange) {
             onUxChange === null || onUxChange === void 0 ? void 0 : onUxChange('selectedRow', null);
     }, [uxState, rowsData, onUxChange]);
 };
-export default useRowsKeyControls;
+exports.default = useRowsKeyControls;

package/ui/Blocks/CommonGrid/hooks/useToggleAllCheckbox.js

@@ -1,7 +1,10 @@
-import { useMemo, useCallback } from 'react';
-export var useToggleAllCheckbox = function (rowsData, uxState, handleUxChange) {
-    var allChecked = useMemo(function () { return (rowsData || []).length >= 1 && rowsData.every(function (row) { var _a; return (_a = uxState.checkedRows) === null || _a === void 0 ? void 0 : _a[row.id]; }); }, [rowsData, uxState.checkedRows]);
-    var toggleAllHandler = useCallback(function () {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useToggleAllCheckbox = void 0;
+var react_1 = require("react");
+var useToggleAllCheckbox = function (rowsData, uxState, handleUxChange) {
+    var allChecked = (0, react_1.useMemo)(function () { return (rowsData || []).length >= 1 && rowsData.every(function (row) { var _a; return (_a = uxState.checkedRows) === null || _a === void 0 ? void 0 : _a[row.id]; }); }, [rowsData, uxState.checkedRows]);
+    var toggleAllHandler = (0, react_1.useCallback)(function () {
         var checkedRows = {};
         // if check all is not check, we check all
         if (!allChecked && rowsData) {
@@ -13,3 +16,4 @@ export var useToggleAllCheckbox = function (rowsData, uxState, handleUxChange) {
     }, [handleUxChange, rowsData, allChecked]);
     return [allChecked, toggleAllHandler];
 };
+exports.useToggleAllCheckbox = useToggleAllCheckbox;

package/ui/Blocks/CommonGrid/hooks/useUxReset.js

@@ -1,7 +1,12 @@
-import React from 'react';
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
 var useUxReset = function (rowsData, uxState, clearUxState) {
-    var _a = React.useState('|'), previous = _a[0], setPrevious = _a[1];
-    React.useEffect(function () {
+    var _a = react_1.default.useState('|'), previous = _a[0], setPrevious = _a[1];
+    react_1.default.useEffect(function () {
         var ids = (rowsData || []).map(function (row) { return row.id; }).join('|');
         // clear uxState if listed rows change and uxState is not clear already
         if (ids !== previous) {
@@ -12,4 +17,4 @@ var useUxReset = function (rowsData, uxState, clearUxState) {
         setPrevious(ids);
     }, [rowsData]); // eslint-disable-line react-hooks/exhaustive-deps
 };
-export default useUxReset;
+exports.default = useUxReset;

package/ui/Blocks/CommonGrid/index.js

@@ -1,10 +1,51 @@
-import CommonGrid from './CommonGridContainer.js';
-import withReduxActions from './HoC/withReduxActions.js';
-import reducer, { actionPrefix, createActions, createSelectors, createFullSelector, actionTypes } from './store/index.js';
-import useFloatingButton from './hooks/useFloatingButton.js';
-import * as Types from './types.js';
-export * from './StandardButtons.js';
-export * from './components/gridCells/index.js';
-import { useAddFilter } from './hooks/useAddFilter.js';
-export default CommonGrid;
-export { withReduxActions, reducer, actionPrefix, actionTypes, createActions, createSelectors, createFullSelector, Types, useFloatingButton, useAddFilter, };
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+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);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useAddFilter = exports.useFloatingButton = exports.Types = exports.createFullSelector = exports.createSelectors = exports.createActions = exports.actionTypes = exports.actionPrefix = exports.reducer = exports.withReduxActions = void 0;
+var CommonGridContainer_1 = __importDefault(require("./CommonGridContainer"));
+var withReduxActions_1 = __importDefault(require("./HoC/withReduxActions"));
+exports.withReduxActions = withReduxActions_1.default;
+var store_1 = __importStar(require("./store"));
+exports.reducer = store_1.default;
+Object.defineProperty(exports, "actionPrefix", { enumerable: true, get: function () { return store_1.actionPrefix; } });
+Object.defineProperty(exports, "createActions", { enumerable: true, get: function () { return store_1.createActions; } });
+Object.defineProperty(exports, "createSelectors", { enumerable: true, get: function () { return store_1.createSelectors; } });
+Object.defineProperty(exports, "createFullSelector", { enumerable: true, get: function () { return store_1.createFullSelector; } });
+Object.defineProperty(exports, "actionTypes", { enumerable: true, get: function () { return store_1.actionTypes; } });
+var useFloatingButton_1 = __importDefault(require("./hooks/useFloatingButton"));
+exports.useFloatingButton = useFloatingButton_1.default;
+var Types = __importStar(require("./types"));
+exports.Types = Types;
+__exportStar(require("./StandardButtons"), exports);
+__exportStar(require("./components/gridCells"), exports);
+var useAddFilter_1 = require("./hooks/useAddFilter");
+Object.defineProperty(exports, "useAddFilter", { enumerable: true, get: function () { return useAddFilter_1.useAddFilter; } });
+exports.default = CommonGridContainer_1.default;