@mailstep/design-system 0.8.26-beta.7 → 0.8.27-beta.0

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

@@ -1,96 +1,42 @@
-function _tagged_template_literal(strings, raw) {
-    if (!raw) {
-        raw = strings.slice(0);
-    }
-    return Object.freeze(Object.defineProperties(strings, {
-        raw: {
-            value: Object.freeze(raw)
-        }
-    }));
-}
-function _templateObject() {
-    var data = _tagged_template_literal([
-        "\n  ",
-        ";\n  display: flex;\n  min-height: 32px;\n  border-bottom: 1px solid rgb(228, 231, 235);\n  cursor: ",
-        ";\n"
-    ]);
-    _templateObject = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject1() {
-    var data = _tagged_template_literal([
-        "\n  ",
-        ";\n  display: flex;\n  overflow: hidden;\n  align-items: center;\n  justify-content: ",
-        ";\n  transition: ",
-        ";\n  transform: ",
-        ";\n"
-    ]);
-    _templateObject1 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject2() {
-    var data = _tagged_template_literal([
-        "\n  background-color: ",
-        ";\n"
-    ]);
-    _templateObject2 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject3() {
-    var data = _tagged_template_literal([
-        "\n  text-overflow: ellipsis;\n  white-space: nowrap;\n"
-    ]);
-    _templateObject3 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject4() {
-    var data = _tagged_template_literal([
-        "\n  width: 100vw;\n  position: sticky;\n  left: 0;\n  justify-content: center;\n"
-    ]);
-    _templateObject4 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject5() {
-    var data = _tagged_template_literal([
-        "\n  padding: 2px 10px;\n  border-radius: 4px;\n  color: ",
-        ";\n"
-    ]);
-    _templateObject5 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-import styled, { system, th } from "@xstyled/styled-components";
-var Row = styled.div(_templateObject(), system, function(props) {
-    return props.hasRowClick ? "pointer" : "auto";
-});
-var Cell = styled.div(_templateObject1(), system, function(props) {
-    return props.align;
-}, function(props) {
-    return props.transition;
-}, function(props) {
-    return props.transform;
-});
-var StyledDataRow = styled(Row)(_templateObject2(), function(props) {
-    return props.isEven ? th("colors.bgLightGray") : "white";
-});
-var TextCell = styled(Cell)(_templateObject3());
-var MessageCell = styled(Cell)(_templateObject4());
-var variantColors = {
-    error: th("colors.red1"),
-    info: th("colors.gray1")
+import styled$1, { system, th } from "@xstyled/styled-components";
+//#region packages/ui/Blocks/CommonGrid/components/Table.tsx
+const Row = styled$1.div`
+  ${system};
+  display: flex;
+  min-height: 32px;
+  border-bottom: 1px solid rgb(228, 231, 235);
+  cursor: ${(props) => props.hasRowClick ? "pointer" : "auto"};
+`;
+const Cell = styled$1.div`
+  ${system};
+  display: flex;
+  overflow: hidden;
+  align-items: center;
+  justify-content: ${(props) => props.align};
+  transition: ${(props) => props.transition};
+  transform: ${(props) => props.transform};
+`;
+const StyledDataRow = styled$1(Row)`
+  background-color: ${(props) => props.isEven ? th("colors.bgLightGray") : "white"};
+`;
+const TextCell = styled$1(Cell)`
+  text-overflow: ellipsis;
+  white-space: nowrap;
+`;
+const MessageCell = styled$1(Cell)`
+  width: 100vw;
+  position: sticky;
+  left: 0;
+  justify-content: center;
+`;
+const variantColors = {
+	error: th("colors.red1"),
+	info: th("colors.gray1")
 };
-var MessageCellBody = styled(Cell)(_templateObject5(), function(props) {
-    return variantColors[props.variant];
-});
+const MessageCellBody = styled$1(Cell)`
+  padding: 2px 10px;
+  border-radius: 4px;
+  color: ${(props) => variantColors[props.variant]};
+`;
+//#endregion
 export { Cell, MessageCell, MessageCellBody, Row, StyledDataRow, TextCell };

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

@@ -1,116 +1,66 @@
-function _array_like_to_array(arr, len) {
-    if (len == null || len > arr.length) len = arr.length;
-    for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
-    return arr2;
-}
-function _array_without_holes(arr) {
-    if (Array.isArray(arr)) return _array_like_to_array(arr);
-}
-function _iterable_to_array(iter) {
-    if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
-}
-function _non_iterable_spread() {
-    throw new TypeError("Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-}
-function _tagged_template_literal(strings, raw) {
-    if (!raw) {
-        raw = strings.slice(0);
-    }
-    return Object.freeze(Object.defineProperties(strings, {
-        raw: {
-            value: Object.freeze(raw)
-        }
-    }));
-}
-function _to_consumable_array(arr) {
-    return _array_without_holes(arr) || _iterable_to_array(arr) || _unsupported_iterable_to_array(arr) || _non_iterable_spread();
-}
-function _unsupported_iterable_to_array(o, minLen) {
-    if (!o) return;
-    if (typeof o === "string") return _array_like_to_array(o, minLen);
-    var n = Object.prototype.toString.call(o).slice(8, -1);
-    if (n === "Object" && o.constructor) n = o.constructor.name;
-    if (n === "Map" || n === "Set") return Array.from(n);
-    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
-}
-function _templateObject() {
-    var data = _tagged_template_literal([
-        "\n  display: flex;\n  align-items: center;\n  & > :nth-child(2) {\n    display: none;\n    @media (min-width: 1024px) {\n      display: block;\n    }\n  }\n"
-    ]);
-    _templateObject = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-function _templateObject1() {
-    var data = _tagged_template_literal([
-        "\n  margin-right: 15px;\n  @media (min-width: 1024px) {\n    margin-right: 8px;\n  }\n"
-    ]);
-    _templateObject1 = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-import { jsx, jsxs } from "react/jsx-runtime";
+import { Paragraph4 } from "../../../../Elements/Typography/Typography.js";
+import Select from "../../../../Elements/Select/Select.js";
+import { rowsPerPageOptions } from "../../utils/constants.js";
 import { useCallback, useMemo } from "react";
-import Select from "../../../../Elements/Select/Select";
-import { Paragraph4 } from "../../../../Elements/Typography/Typography";
-import { rowsPerPageOptions } from "../../utils/constants";
+import styled$1, { x } from "@xstyled/styled-components";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { Trans } from "@lingui/react";
-import styled, { x } from "@xstyled/styled-components";
-var Wrapper = styled.span(_templateObject());
-var StyledSelect = styled(x.div)(_templateObject1());
-var TablePagination = function TablePagination(param) {
-    var gridActions = param.gridActions, gridSelectors = param.gridSelectors, autoRowsPerPage = param.autoRowsPerPage, customPaginationHandler = param.customPaginationHandler;
-    var setRowsPerPage = gridActions.setRowsPerPage;
-    var page = gridSelectors.page;
-    var rowsPerPage = gridSelectors.rowsPerPage || 10;
-    var options = useMemo(function() {
-        return autoRowsPerPage ? _to_consumable_array(rowsPerPageOptions).concat([
-            {
-                value: autoRowsPerPage,
-                label: "auto (".concat(autoRowsPerPage, ")")
-            }
-        ]) : rowsPerPageOptions;
-    }, [
-        autoRowsPerPage
-    ]);
-    var onSetRowsPerPage = useCallback(function(option) {
-        if (option && "value" in option) {
-            var value = Number(option.value);
-            setRowsPerPage === null || setRowsPerPage === void 0 ? void 0 : setRowsPerPage(value);
-            customPaginationHandler === null || customPaginationHandler === void 0 ? void 0 : customPaginationHandler(page !== null && page !== void 0 ? page : 1, value);
-        }
-    }, [
-        setRowsPerPage,
-        page,
-        customPaginationHandler
-    ]);
-    return /* @__PURE__ */ jsxs(Wrapper, {
-        children: [
-            /* @__PURE__ */ jsx(StyledSelect, {
-                minWidth: "110px",
-                children: /* @__PURE__ */ jsx(Select, {
-                    name: "rowsPerPage",
-                    menuPlacement: "top",
-                    style: "gridFilter",
-                    placeholder: "".concat(rowsPerPage),
-                    options: options,
-                    value: rowsPerPage,
-                    isDarkPlaceholderText: true,
-                    onChange: onSetRowsPerPage
-                })
-            }),
-            /* @__PURE__ */ jsx(Paragraph4, {
-                variant: "normal",
-                mr: "20px",
-                children: /* @__PURE__ */ jsx(Trans, {
-                    id: "dataGrid.resultsPerPage",
-                    message: "Results per page"
-                })
-            })
-        ]
-    });
+//#region packages/ui/Blocks/CommonGrid/components/TablePagination/TablePagination.tsx
+const Wrapper = styled$1.span`
+  display: flex;
+  align-items: center;
+  & > :nth-child(2) {
+    display: none;
+    @media (min-width: 1024px) {
+      display: block;
+    }
+  }
+`;
+const StyledSelect = styled$1(x.div)`
+  margin-right: 15px;
+  @media (min-width: 1024px) {
+    margin-right: 8px;
+  }
+`;
+const TablePagination = ({ gridActions, gridSelectors, autoRowsPerPage, customPaginationHandler }) => {
+	const { setRowsPerPage } = gridActions;
+	const { page } = gridSelectors;
+	const rowsPerPage = gridSelectors.rowsPerPage || 10;
+	const options = useMemo(() => autoRowsPerPage ? [...rowsPerPageOptions, {
+		value: autoRowsPerPage,
+		label: `auto (${autoRowsPerPage})`
+	}] : rowsPerPageOptions, [autoRowsPerPage]);
+	const onSetRowsPerPage = useCallback((option) => {
+		if (option && "value" in option) {
+			const value = Number(option.value);
+			setRowsPerPage?.(value);
+			customPaginationHandler?.(page ?? 1, value);
+		}
+	}, [
+		setRowsPerPage,
+		page,
+		customPaginationHandler
+	]);
+	return /* @__PURE__ */ jsxs(Wrapper, { children: [/* @__PURE__ */ jsx(StyledSelect, {
+		minWidth: "110px",
+		children: /* @__PURE__ */ jsx(Select, {
+			name: "rowsPerPage",
+			menuPlacement: "top",
+			style: "gridFilter",
+			placeholder: `${rowsPerPage}`,
+			options,
+			value: rowsPerPage,
+			isDarkPlaceholderText: true,
+			onChange: onSetRowsPerPage
+		})
+	}), /* @__PURE__ */ jsx(Paragraph4, {
+		variant: "normal",
+		mr: "20px",
+		children: /* @__PURE__ */ jsx(Trans, {
+			id: "dataGrid.resultsPerPage",
+			message: "Results per page"
+		})
+	})] });
 };
-var TablePagination_default = TablePagination;
-export { TablePagination_default as default };
+//#endregion
+export { TablePagination as default };

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

@@ -1,3 +1,5 @@
-import TablePagination from "./TablePagination";
+import TablePagination from "./TablePagination.js";
+//#region packages/ui/Blocks/CommonGrid/components/TablePagination/index.tsx
 var TablePagination_default = TablePagination;
+//#endregion
 export { TablePagination_default as default };

package/ui/Blocks/CommonGrid/components/gridCells/BoolIcon.js

@@ -1,35 +1,19 @@
-function _tagged_template_literal(strings, raw) {
-    if (!raw) {
-        raw = strings.slice(0);
-    }
-    return Object.freeze(Object.defineProperties(strings, {
-        raw: {
-            value: Object.freeze(raw)
-        }
-    }));
-}
-function _templateObject() {
-    var data = _tagged_template_literal([
-        "\n  display: flex;\n  justify-content: center;\n  width: 100%;\n"
-    ]);
-    _templateObject = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-import { jsx } from "react/jsx-runtime";
+import { ToastSuccess } from "../../../../Elements/Icon/icons/ToastSuccess.js";
+import { ToastError } from "../../../../Elements/Icon/icons/ToastError.js";
+import "../../../../Elements/Icon/index.js";
 import React from "react";
-import { ToastError, ToastSuccess } from "../../../../Elements/Icon";
-import styled from "@xstyled/styled-components";
-import get from "lodash/fp/get";
-var Center = styled.div(_templateObject());
-var BoolIcon = function BoolIcon(param) {
-    var rowData = param.rowData, column = param.column;
-    var value = get(column.name, rowData);
-    var icon = value ? /* @__PURE__ */ jsx(ToastSuccess, {}) : /* @__PURE__ */ jsx(ToastError, {});
-    return /* @__PURE__ */ jsx(Center, {
-        children: icon
-    });
+import styled$1 from "@xstyled/styled-components";
+import { jsx } from "react/jsx-runtime";
+import get from "lodash/fp/get.js";
+//#region packages/ui/Blocks/CommonGrid/components/gridCells/BoolIcon.tsx
+const Center = styled$1.div`
+  display: flex;
+  justify-content: center;
+  width: 100%;
+`;
+const BoolIcon = ({ rowData, column }) => {
+	return /* @__PURE__ */ jsx(Center, { children: get(column.name, rowData) ? /* @__PURE__ */ jsx(ToastSuccess, {}) : /* @__PURE__ */ jsx(ToastError, {}) });
 };
-var BoolIconCell = React.memo(BoolIcon);
+const BoolIconCell = React.memo(BoolIcon);
+//#endregion
 export { BoolIconCell };

package/ui/Blocks/CommonGrid/components/gridCells/ButtonInCell.js

@@ -1,61 +1,13 @@
-function _define_property(obj, key, value) {
-    if (key in obj) {
-        Object.defineProperty(obj, key, {
-            value: value,
-            enumerable: true,
-            configurable: true,
-            writable: true
-        });
-    } else {
-        obj[key] = value;
-    }
-    return obj;
-}
-function _object_spread(target) {
-    for(var i = 1; i < arguments.length; i++){
-        var source = arguments[i] != null ? arguments[i] : {};
-        var ownKeys = Object.keys(source);
-        if (typeof Object.getOwnPropertySymbols === "function") {
-            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
-                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
-            }));
-        }
-        ownKeys.forEach(function(key) {
-            _define_property(target, key, source[key]);
-        });
-    }
-    return target;
-}
-function ownKeys(object, enumerableOnly) {
-    var keys = Object.keys(object);
-    if (Object.getOwnPropertySymbols) {
-        var symbols = Object.getOwnPropertySymbols(object);
-        if (enumerableOnly) {
-            symbols = symbols.filter(function(sym) {
-                return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-            });
-        }
-        keys.push.apply(keys, symbols);
-    }
-    return keys;
-}
-function _object_spread_props(target, source) {
-    source = source != null ? source : {};
-    if (Object.getOwnPropertyDescriptors) {
-        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
-    } else {
-        ownKeys(Object(source)).forEach(function(key) {
-            Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
-        });
-    }
-    return target;
-}
+import Button from "../../../../Elements/Button/Button.js";
+import "react";
 import { jsx } from "react/jsx-runtime";
-import Button from "../../../../Elements/Button/Button";
-var ButtonInCell = function ButtonInCell(props) {
-    return /* @__PURE__ */ jsx(Button, _object_spread_props(_object_spread({}, props), {
-        appearance: "primary",
-        variant: "link"
-    }));
+//#region packages/ui/Blocks/CommonGrid/components/gridCells/ButtonInCell.tsx
+const ButtonInCell = (props) => {
+	return /* @__PURE__ */ jsx(Button, {
+		...props,
+		appearance: "primary",
+		variant: "link"
+	});
 };
+//#endregion
 export { ButtonInCell };

package/ui/Blocks/CommonGrid/components/gridCells/Date.js

@@ -1,11 +1,11 @@
+import "react";
 import { jsx } from "react/jsx-runtime";
 import { DateTime } from "luxon";
-import get from "lodash/fp/get";
-var DateCell = function DateCell(param) {
-    var rowData = param.rowData, column = param.column;
-    var value = get(column.name, rowData);
-    return value ? /* @__PURE__ */ jsx("span", {
-        children: DateTime.fromISO(value).toFormat("dd. MM. yyyy")
-    }) : null;
+import get from "lodash/fp/get.js";
+//#region packages/ui/Blocks/CommonGrid/components/gridCells/Date.tsx
+const DateCell = ({ rowData, column }) => {
+	const value = get(column.name, rowData);
+	return value ? /* @__PURE__ */ jsx("span", { children: DateTime.fromISO(value).toFormat("dd. MM. yyyy") }) : null;
 };
+//#endregion
 export { DateCell };

package/ui/Blocks/CommonGrid/components/gridCells/DateTime.js

@@ -1,16 +1,13 @@
+import "react";
 import { jsx } from "react/jsx-runtime";
 import { DateTime } from "luxon";
-import get from "lodash/fp/get";
-var defaultProps = {
-    dateTimeFormat: "dd. MM. yyyy HH:mm"
-};
-var DateTimeCell = function DateTimeCell(param) {
-    var rowData = param.rowData, column = param.column;
-    var _ref;
-    var value = get(column.name, rowData);
-    var dateTimeFormat = ((_ref = column === null || column === void 0 ? void 0 : column.passProps) !== null && _ref !== void 0 ? _ref : defaultProps).dateTimeFormat;
-    return value ? /* @__PURE__ */ jsx("span", {
-        children: DateTime.fromISO(value).toFormat(dateTimeFormat)
-    }) : null;
+import get from "lodash/fp/get.js";
+//#region packages/ui/Blocks/CommonGrid/components/gridCells/DateTime.tsx
+const defaultProps = { dateTimeFormat: "dd. MM. yyyy HH:mm" };
+const DateTimeCell = ({ rowData, column }) => {
+	const value = get(column.name, rowData);
+	const { dateTimeFormat } = column?.passProps ?? defaultProps;
+	return value ? /* @__PURE__ */ jsx("span", { children: DateTime.fromISO(value).toFormat(dateTimeFormat) }) : null;
 };
+//#endregion
 export { DateTimeCell };

package/ui/Blocks/CommonGrid/components/gridCells/EnumInCell.js

@@ -1,103 +1,30 @@
-function _define_property(obj, key, value) {
-    if (key in obj) {
-        Object.defineProperty(obj, key, {
-            value: value,
-            enumerable: true,
-            configurable: true,
-            writable: true
-        });
-    } else {
-        obj[key] = value;
-    }
-    return obj;
-}
-function _object_spread(target) {
-    for(var i = 1; i < arguments.length; i++){
-        var source = arguments[i] != null ? arguments[i] : {};
-        var ownKeys = Object.keys(source);
-        if (typeof Object.getOwnPropertySymbols === "function") {
-            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
-                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
-            }));
-        }
-        ownKeys.forEach(function(key) {
-            _define_property(target, key, source[key]);
-        });
-    }
-    return target;
-}
-function ownKeys(object, enumerableOnly) {
-    var keys = Object.keys(object);
-    if (Object.getOwnPropertySymbols) {
-        var symbols = Object.getOwnPropertySymbols(object);
-        if (enumerableOnly) {
-            symbols = symbols.filter(function(sym) {
-                return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-            });
-        }
-        keys.push.apply(keys, symbols);
-    }
-    return keys;
-}
-function _object_spread_props(target, source) {
-    source = source != null ? source : {};
-    if (Object.getOwnPropertyDescriptors) {
-        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
-    } else {
-        ownKeys(Object(source)).forEach(function(key) {
-            Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
-        });
-    }
-    return target;
-}
-function _tagged_template_literal(strings, raw) {
-    if (!raw) {
-        raw = strings.slice(0);
-    }
-    return Object.freeze(Object.defineProperties(strings, {
-        raw: {
-            value: Object.freeze(raw)
-        }
-    }));
-}
-function _templateObject() {
-    var data = _tagged_template_literal([
-        "\n  display: flex;\n  justify-content: flex-start;\n  width: 100%;\n"
-    ]);
-    _templateObject = function _templateObject() {
-        return data;
-    };
-    return data;
-}
-import { jsx } from "react/jsx-runtime";
+import HighlightBox_default from "../../../../Elements/HighlightBox/index.js";
 import { useMemo } from "react";
-import HighlightBox from "../../../../Elements/HighlightBox";
-import styled from "@xstyled/styled-components";
-var Center = styled.div(_templateObject());
-var EnumInCell = function EnumInCell(param) {
-    var value = param.value, enumObj = param.enumObj, appearanceMap = param.appearanceMap, size = param.size;
-    var finalLabel = useMemo(function() {
-        return enumObj[value] ? enumObj[value]() : value;
-    }, [
-        enumObj,
-        value
-    ]);
-    var coloringProp = useMemo(function() {
-        return {
-            appearance: appearanceMap[value]
-        };
-    }, [
-        appearanceMap,
-        value
-    ]);
-    if (!finalLabel) return null;
-    return /* @__PURE__ */ jsx(Center, {
-        "data-propagation": "true",
-        children: /* @__PURE__ */ jsx(HighlightBox, _object_spread_props(_object_spread({}, coloringProp), {
-            size: size,
-            prefix: "grid",
-            children: finalLabel
-        }))
-    });
+import styled$1 from "@xstyled/styled-components";
+import { jsx } from "react/jsx-runtime";
+//#region packages/ui/Blocks/CommonGrid/components/gridCells/EnumInCell.tsx
+const Center = styled$1.div`
+  display: flex;
+  justify-content: flex-start;
+  width: 100%;
+`;
+const EnumInCell = ({ value, enumObj, appearanceMap, size }) => {
+	const finalLabel = useMemo(() => {
+		return enumObj[value] ? enumObj[value]() : value;
+	}, [enumObj, value]);
+	const coloringProp = useMemo(() => {
+		return { appearance: appearanceMap[value] };
+	}, [appearanceMap, value]);
+	if (!finalLabel) return null;
+	return /* @__PURE__ */ jsx(Center, {
+		"data-propagation": "true",
+		children: /* @__PURE__ */ jsx(HighlightBox_default, {
+			...coloringProp,
+			size,
+			prefix: "grid",
+			children: finalLabel
+		})
+	});
 };
+//#endregion
 export { EnumInCell };