@mailstep/design-system 0.8.31-beta.4 → 0.8.31

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

@@ -1,16 +1,42 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
+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") : th("colors.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")
 };
-import styled, { system, th } from '@xstyled/styled-components';
-export var Row = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  ", ";\n  display: flex;\n  min-height: 32px;\n  border-bottom: 1px solid rgb(228, 231, 235);\n  cursor: ", ";\n"], ["\n  ", ";\n  display: flex;\n  min-height: 32px;\n  border-bottom: 1px solid rgb(228, 231, 235);\n  cursor: ", ";\n"])), system, function (props) { return (props.hasRowClick ? 'pointer' : 'auto'); });
-export var Cell = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  ", ";\n  display: flex;\n  overflow: hidden;\n  align-items: center;\n  justify-content: ", ";\n  transition: ", ";\n  transform: ", ";\n"], ["\n  ", ";\n  display: flex;\n  overflow: hidden;\n  align-items: center;\n  justify-content: ", ";\n  transition: ", ";\n  transform: ", ";\n"])), system, function (props) { return props.align; }, function (props) { return props.transition; }, function (props) { return props.transform; });
-export var StyledDataRow = styled(Row)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (props) { return (props.isEven ? th('colors.bgLightGray') : th('colors.white')); });
-export var TextCell = styled(Cell)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  text-overflow: ellipsis;\n  white-space: nowrap;\n"], ["\n  text-overflow: ellipsis;\n  white-space: nowrap;\n"])));
-export var MessageCell = styled(Cell)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  width: 100vw;\n  position: sticky;\n  left: 0;\n  justify-content: center;\n"], ["\n  width: 100vw;\n  position: sticky;\n  left: 0;\n  justify-content: center;\n"])));
-var variantColors = {
-    error: th('colors.red1'),
-    info: th('colors.gray1')
-};
-export var MessageCellBody = styled(Cell)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  padding: 2px 10px;\n  border-radius: 4px;\n  color: ", ";\n"], ["\n  padding: 2px 10px;\n  border-radius: 4px;\n  color: ", ";\n"])), function (props) { return variantColors[props.variant]; });
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
+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.d.ts

@@ -1,6 +1,5 @@
-import { FC } from 'react';
-import { GridActionsType, GridSelectorsType } from '../../types';
-
+import { type FC } from 'react';
+import { type GridActionsType, type GridSelectorsType } from '../../types';
 type Props = {
     gridActions: GridActionsType;
     gridSelectors: GridSelectorsType;

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

@@ -1,42 +1,66 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
+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 styled$1, { x } from "@xstyled/styled-components";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Trans } from "@lingui/react";
+//#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;
     }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useMemo } from 'react';
-import Select from '../../../../Elements/Select/Select';
-import { Paragraph4 } from '../../../../Elements/Typography/Typography';
-import { rowsPerPageOptions } from '../../utils/constants';
-import { Trans } from '@lingui/react';
-import styled, { x } from '@xstyled/styled-components';
-var Wrapper = styled.span(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\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"], ["\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"])));
-var StyledSelect = styled(x.div)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  margin-right: 15px;\n  @media (min-width: 1024px) {\n    margin-right: 8px;\n  }\n"], ["\n  margin-right: 15px;\n  @media (min-width: 1024px) {\n    margin-right: 8px;\n  }\n"])));
-var TablePagination = function (_a) {
-    var gridActions = _a.gridActions, gridSelectors = _a.gridSelectors, autoRowsPerPage = _a.autoRowsPerPage, customPaginationHandler = _a.customPaginationHandler;
-    var setRowsPerPage = gridActions.setRowsPerPage;
-    var page = gridSelectors.page;
-    var rowsPerPage = gridSelectors.rowsPerPage || 10;
-    var options = useMemo(function () {
-        return autoRowsPerPage
-            ? __spreadArray(__spreadArray([], rowsPerPageOptions, true), [{ value: autoRowsPerPage, label: "auto (".concat(autoRowsPerPage, ")") }], false) : 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 (_jsxs(Wrapper, { children: [_jsx(StyledSelect, { minWidth: "110px", children: _jsx(Select, { name: "rowsPerPage", menuPlacement: "top", style: "gridFilter", placeholder: "".concat(rowsPerPage), options: options, value: rowsPerPage, isDarkPlaceholderText: true, onChange: onSetRowsPerPage }) }), _jsx(Paragraph4, { variant: "normal", mr: "20px", children: _jsx(Trans, { id: "dataGrid.resultsPerPage", message: "Results per page" }) })] }));
+  }
+`;
+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"
+		})
+	})] });
 };
-export default TablePagination;
-var templateObject_1, templateObject_2;
+//#endregion
+export { TablePagination as default };

package/ui/Blocks/CommonGrid/components/TablePagination/index.d.ts

@@ -1,3 +1,2 @@
-import { default as TablePagination } from './TablePagination';
-
+import TablePagination from './TablePagination';
 export default TablePagination;

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

@@ -1,2 +1,5 @@
-import TablePagination from './TablePagination';
-export default 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.d.ts

@@ -1,6 +1,5 @@
-import { default as React } from 'react';
-import { DataCellProps } from '../../types';
-
+import React from 'react';
+import { type DataCellProps } from '../../types';
 type Props = DataCellProps<{}>;
 export declare const BoolIconCell: React.NamedExoticComponent<Props>;
 export {};

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

@@ -1,18 +1,19 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
+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 styled$1 from "@xstyled/styled-components";
+import { jsx } from "react/jsx-runtime";
+import get from "lodash/fp/get";
+//#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, {}) });
 };
-import { jsx as _jsx } from "react/jsx-runtime";
-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_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  justify-content: center;\n  width: 100%;\n"], ["\n  display: flex;\n  justify-content: center;\n  width: 100%;\n"])));
-var BoolIcon = function (_a) {
-    var rowData = _a.rowData, column = _a.column;
-    var value = get(column.name, rowData);
-    var icon = value ? _jsx(ToastSuccess, {}) : _jsx(ToastError, {});
-    return _jsx(Center, { children: icon });
-};
-export var BoolIconCell = React.memo(BoolIcon);
-var templateObject_1;
+const BoolIconCell = React.memo(BoolIcon);
+//#endregion
+export { BoolIconCell };

package/ui/Blocks/CommonGrid/components/gridCells/ButtonInCell.d.ts

@@ -1,6 +1,5 @@
-import { FC } from 'react';
-import { DataCellProps } from '../../types';
-
+import { type FC } from 'react';
+import { type DataCellProps } from '../../types';
 type Props = DataCellProps<{}>;
 export declare const ButtonInCell: FC<Props>;
 export {};

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

@@ -1,16 +1,13 @@
-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 Button from '../../../../Elements/Button/Button';
-export var ButtonInCell = function (props) {
-    return _jsx(Button, __assign({}, props, { appearance: "primary", variant: "link" }));
+import Button from "../../../../Elements/Button/Button.js";
+import "react";
+import { jsx } from "react/jsx-runtime";
+//#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.d.ts

@@ -1,6 +1,5 @@
-import { FC } from 'react';
-import { DataCellProps } from '../../types';
-
+import { type FC } from 'react';
+import { type DataCellProps } from '../../types';
 type Props = DataCellProps<{}>;
 export declare const DateCell: FC<Props>;
 export {};

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

@@ -1,8 +1,11 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { DateTime } from 'luxon';
-import get from 'lodash/fp/get';
-export var DateCell = function (_a) {
-    var rowData = _a.rowData, column = _a.column;
-    var value = get(column.name, rowData);
-    return value ? _jsx("span", { children: DateTime.fromISO(value).toFormat('dd. MM. yyyy') }) : null;
+import "react";
+import { jsx } from "react/jsx-runtime";
+import { DateTime } from "luxon";
+import get from "lodash/fp/get";
+//#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.d.ts

@@ -1,6 +1,5 @@
-import { FC } from 'react';
-import { DataCellProps } from '../../types';
-
+import { type FC } from 'react';
+import { type DataCellProps } from '../../types';
 type Props = DataCellProps<{}>;
 export declare const DateTimeCell: FC<Props>;
 export {};

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

@@ -1,13 +1,13 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { DateTime } from 'luxon';
-import get from 'lodash/fp/get';
-var defaultProps = {
-    dateTimeFormat: 'dd. MM. yyyy HH:mm'
-};
-export var DateTimeCell = function (_a) {
-    var _b;
-    var rowData = _a.rowData, column = _a.column;
-    var value = get(column.name, rowData);
-    var dateTimeFormat = ((_b = column === null || column === void 0 ? void 0 : column.passProps) !== null && _b !== void 0 ? _b : defaultProps).dateTimeFormat;
-    return value ? _jsx("span", { children: DateTime.fromISO(value).toFormat(dateTimeFormat) }) : null;
+import "react";
+import { jsx } from "react/jsx-runtime";
+import { DateTime } from "luxon";
+import get from "lodash/fp/get";
+//#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.d.ts

@@ -1,6 +1,5 @@
-import { FC } from 'react';
-import { FlagAppearanceType } from '../../../../Elements/HighlightBox/HighlightBox';
-
+import type { FC } from 'react';
+import type { FlagAppearanceType } from '../../../../Elements/HighlightBox/HighlightBox';
 type Props = {
     value: string;
     appearanceMap: Record<string, FlagAppearanceType>;

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

@@ -1,33 +1,30 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
+import HighlightBox_default from "../../../../Elements/HighlightBox/index.js";
+import { useMemo } from "react";
+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
+		})
+	});
 };
-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 HighlightBox from '../../../../Elements/HighlightBox';
-import styled from '@xstyled/styled-components';
-var Center = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  justify-content: flex-start;\n  width: 100%;\n"], ["\n  display: flex;\n  justify-content: flex-start;\n  width: 100%;\n"])));
-export var EnumInCell = function (_a) {
-    var value = _a.value, enumObj = _a.enumObj, appearanceMap = _a.appearanceMap, size = _a.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 (_jsx(Center, { "data-propagation": "true", children: _jsx(HighlightBox, __assign({}, coloringProp, { size: size, prefix: "grid", children: finalLabel })) }));
-};
-var templateObject_1;
+//#endregion
+export { EnumInCell };

package/ui/Blocks/CommonGrid/components/gridCells/HoverBubble.d.ts

@@ -1,6 +1,5 @@
-import { FC } from 'react';
-import { DataCellProps } from '../../types';
-
+import type { FC } from 'react';
+import { type DataCellProps } from '../../types';
 type Props = DataCellProps<{}>;
 export declare const HoverBubble: FC<Props>;
 export {};

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

@@ -1,18 +1,52 @@
-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 styled from '@xstyled/styled-components';
-import get from 'lodash/fp/get';
-var Wrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  text-align: center;\n  overflow: hidden;\n  text-overflow: ellipsis;\n\n  :hover {\n    cursor: pointer;\n    .tooltip {\n      display: block;\n    }\n  }\n"], ["\n  text-align: center;\n  overflow: hidden;\n  text-overflow: ellipsis;\n\n  :hover {\n    cursor: pointer;\n    .tooltip {\n      display: block;\n    }\n  }\n"])));
-var Tooltip = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  align-content: center;\n  justify-content: center;\n  margin-bottom: 2;\n\n  div {\n    display: none;\n    position: absolute;\n    background-color: white;\n    color: gray;\n    border-color: gray;\n    border: 1px solid;\n    border-radius: md;\n    padding: 2 3;\n    margin: 1;\n    z-index: 1;\n    box-shadow: tooltipBoxShadow;\n    transform: translateY(-100%);\n\n    max-width: 400px;\n    line-break: anywhere;\n    white-space: initial;\n  }\n"], ["\n  display: flex;\n  align-content: center;\n  justify-content: center;\n  margin-bottom: 2;\n\n  div {\n    display: none;\n    position: absolute;\n    background-color: white;\n    color: gray;\n    border-color: gray;\n    border: 1px solid;\n    border-radius: md;\n    padding: 2 3;\n    margin: 1;\n    z-index: 1;\n    box-shadow: tooltipBoxShadow;\n    transform: translateY(-100%);\n\n    max-width: 400px;\n    line-break: anywhere;\n    white-space: initial;\n  }\n"])));
-export var HoverBubble = function (_a) {
-    var rowData = _a.rowData, column = _a.column;
-    var value = get(column.name, rowData);
-    if (value) {
-        return (_jsxs(Wrapper, { children: [_jsx(Tooltip, { children: _jsx("div", { className: "tooltip", children: value }) }), value] }));
+import "react";
+import styled$1 from "@xstyled/styled-components";
+import { jsx, jsxs } from "react/jsx-runtime";
+import get from "lodash/fp/get";
+//#region packages/ui/Blocks/CommonGrid/components/gridCells/HoverBubble.tsx
+const Wrapper = styled$1.div`
+  text-align: center;
+  overflow: hidden;
+  text-overflow: ellipsis;
+
+  :hover {
+    cursor: pointer;
+    .tooltip {
+      display: block;
     }
-    return null;
+  }
+`;
+const Tooltip = styled$1.div`
+  display: flex;
+  align-content: center;
+  justify-content: center;
+  margin-bottom: 2;
+
+  div {
+    display: none;
+    position: absolute;
+    background-color: white;
+    color: gray;
+    border-color: gray;
+    border: 1px solid;
+    border-radius: md;
+    padding: 2 3;
+    margin: 1;
+    z-index: 1;
+    box-shadow: tooltipBoxShadow;
+    transform: translateY(-100%);
+
+    max-width: 400px;
+    line-break: anywhere;
+    white-space: initial;
+  }
+`;
+const HoverBubble = ({ rowData, column }) => {
+	const value = get(column.name, rowData);
+	if (value) return /* @__PURE__ */ jsxs(Wrapper, { children: [/* @__PURE__ */ jsx(Tooltip, { children: /* @__PURE__ */ jsx("div", {
+		className: "tooltip",
+		children: value
+	}) }), value] });
+	return null;
 };
-var templateObject_1, templateObject_2;
+//#endregion
+export { HoverBubble };

package/ui/Blocks/CommonGrid/components/gridCells/IconButtonInCell.d.ts

@@ -1,5 +1,4 @@
-import { default as React, FC } from 'react';
-
+import React, { type FC } from 'react';
 type Props = {
     icon?: string;
     isLoading?: boolean;

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

@@ -1,9 +1,34 @@
-import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
-import { Link as ReactLink } from 'react-router-dom';
-import Icon from '../../../../Elements/Icon/Icon';
-import Spinner from '../../../../Elements/Spinner/Spinner';
-import { x } from '@xstyled/styled-components';
-export var IconButtonInCell = function (_a) {
-    var icon = _a.icon, isLoading = _a.isLoading, onClick = _a.onClick, linkTo = _a.linkTo;
-    return (_jsx(_Fragment, { children: isLoading ? (_jsx(Spinner, { variant: "sm" })) : linkTo ? (_jsx(ReactLink, { to: linkTo, "data-cy": "".concat(icon !== null && icon !== void 0 ? icon : '', "IconBtn"), children: _jsx(Icon, { icon: icon || 'warning', size: "16px", fill: "blue2" }) })) : (_jsx(x.span, { onClick: onClick, "data-cy": "".concat(icon !== null && icon !== void 0 ? icon : '', "IconBtn"), cursor: "pointer", h: "100%", w: "100%", display: "flex", alignItems: "center", justifyContent: "center", children: _jsx(Icon, { icon: icon || 'warning', size: "16px", fill: "blue2" }) })) }));
+import Icon from "../../../../Elements/Icon/Icon.js";
+import { Spinner } from "../../../../Elements/Spinner/Spinner.js";
+import "react";
+import { x } from "@xstyled/styled-components";
+import { Fragment, jsx } from "react/jsx-runtime";
+import { Link } from "react-router-dom";
+//#region packages/ui/Blocks/CommonGrid/components/gridCells/IconButtonInCell.tsx
+const IconButtonInCell = ({ icon, isLoading, onClick, linkTo }) => {
+	return /* @__PURE__ */ jsx(Fragment, { children: isLoading ? /* @__PURE__ */ jsx(Spinner, { variant: "sm" }) : linkTo ? /* @__PURE__ */ jsx(Link, {
+		to: linkTo,
+		"data-cy": `${icon ?? ""}IconBtn`,
+		children: /* @__PURE__ */ jsx(Icon, {
+			icon: icon || "warning",
+			size: "16px",
+			fill: "blue2"
+		})
+	}) : /* @__PURE__ */ jsx(x.span, {
+		onClick,
+		"data-cy": `${icon ?? ""}IconBtn`,
+		cursor: "pointer",
+		h: "100%",
+		w: "100%",
+		display: "flex",
+		alignItems: "center",
+		justifyContent: "center",
+		children: /* @__PURE__ */ jsx(Icon, {
+			icon: icon || "warning",
+			size: "16px",
+			fill: "blue2"
+		})
+	}) });
 };
+//#endregion
+export { IconButtonInCell };

package/ui/Blocks/CommonGrid/components/gridCells/ImageCell.d.ts

@@ -1,6 +1,5 @@
-import { FC } from 'react';
-import { DataCellProps } from '../../types';
-
+import { type FC } from 'react';
+import { type DataCellProps } from '../../types';
 type Props = DataCellProps<{}> & {
     onClick?: () => void;
 };

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

@@ -1,23 +1,31 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
+import Image from "../../../../Elements/Image/Image.js";
+import "react";
+import styled$1 from "@xstyled/styled-components";
+import { jsx } from "react/jsx-runtime";
+import get from "lodash/fp/get";
+//#region packages/ui/Blocks/CommonGrid/components/gridCells/ImageCell.tsx
+const ImageWrapper = styled$1.div`
+  ${({ onClick }) => onClick ? "cursor: pointer;" : ""}
+  height: 100%;
+  width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+`;
+const StyledImage = styled$1(Image)`
+  max-width: 100%;
+  height: 30px;
+  border: 1x solid;
+  border-radius: md;
+  border-color: lightGray3;
+`;
+const ImageCell = ({ rowData, column, onClick }) => {
+	const value = get(column.name, rowData);
+	if (value?.[0]?.urlSmall) return /* @__PURE__ */ jsx(ImageWrapper, {
+		onClick,
+		children: /* @__PURE__ */ jsx(StyledImage, { src: value[0].urlSmall })
+	});
+	return null;
 };
-import { jsx as _jsx } from "react/jsx-runtime";
-import Image from '../../../../Elements/Image/Image';
-import styled from '@xstyled/styled-components';
-import get from 'lodash/fp/get';
-var ImageWrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  ", "\n  height: 100%;\n  width: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n"], ["\n  ", "\n  height: 100%;\n  width: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n"])), function (_a) {
-    var onClick = _a.onClick;
-    return (onClick ? 'cursor: pointer;' : '');
-});
-var StyledImage = styled(Image)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  max-width: 100%;\n  height: 30px;\n  border: 1x solid;\n  border-radius: md;\n  border-color: lightGray3;\n"], ["\n  max-width: 100%;\n  height: 30px;\n  border: 1x solid;\n  border-radius: md;\n  border-color: lightGray3;\n"])));
-export var ImageCell = function (_a) {
-    var _b;
-    var rowData = _a.rowData, column = _a.column, onClick = _a.onClick;
-    var value = get(column.name, rowData);
-    if ((_b = value === null || value === void 0 ? void 0 : value[0]) === null || _b === void 0 ? void 0 : _b.urlSmall) {
-        return (_jsx(ImageWrapper, { onClick: onClick, children: _jsx(StyledImage, { src: value[0].urlSmall }) }));
-    }
-    return null;
-};
-var templateObject_1, templateObject_2;
+//#endregion
+export { ImageCell };