@tap-payments/os-micro-frontend-shared 0.0.129 → 0.0.131

package/LICENSE

@@ -1,21 +1,21 @@
-MIT License
-
-Copyright (c) 2025 Tap Payments
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+MIT License
+
+Copyright (c) 2025 Tap Payments
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,12 +1,12 @@
-# os-micro-frontend-shared
-
-## Publishing Workflow
-
-1. Update version in package.json
-2. Commit changes
-3. Create and push a tag:
-
-```bash
-npm version patch  # or minor, major
-git push origin main --tags
-```
+# os-micro-frontend-shared
+
+## Publishing Workflow
+
+1. Update version in package.json
+2. Commit changes
+3. Create and push a tag:
+
+```bash
+npm version patch  # or minor, major
+git push origin main --tags
+```

package/build/components/DeviceIcon/DeviceIcon.d.ts

@@ -1,12 +1,10 @@
 /// <reference types="react" />
 import { BoxProps } from '@mui/material/Box';
 import { DEVICE_ICON } from './constants';
-import { TableMode } from '../../types/index.js';
 interface DeviceIconProps extends BoxProps {
     type?: keyof typeof DEVICE_ICON;
     isTextShown?: boolean;
-    tableMode?: TableMode;
 }
-declare function DeviceIcon({ type, isTextShown, tableMode, ...props }: DeviceIconProps): import("react/jsx-runtime").JSX.Element;
+declare function DeviceIcon({ type, isTextShown, ...props }: DeviceIconProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof DeviceIcon>;
 export default _default;

package/build/components/DeviceIcon/DeviceIcon.js

@@ -9,7 +9,7 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { memo } from 'react';
 import Box from '@mui/material/Box';
 import capitalize from 'lodash/capitalize';
@@ -21,9 +21,9 @@ import Tooltip from '../Tooltip';
 import { DEVICE_ICON } from './constants';
 import { isDeviceIconShown } from './utils';
 function DeviceIcon(_a) {
-    var { type, isTextShown, tableMode } = _a, props = __rest(_a, ["type", "isTextShown", "tableMode"]);
+    var { type, isTextShown } = _a, props = __rest(_a, ["type", "isTextShown"]);
     const { t } = useTranslation();
     const icon = isDeviceIconShown(type) ? DEVICE_ICON[type] : null;
-    return (_jsx(Tooltip, Object.assign({ title: icon ? capitalizeFirstLetter((type !== null && type !== void 0 ? type : '').toLowerCase()) : t('unKnown') }, { children: isTextShown ? (_jsxs(TextLabel, Object.assign({ tableMode: tableMode }, { children: [" ", type ? capitalize(type) : 'Unknown'] }))) : (_jsx(Box, Object.assign({}, props, { component: "img", src: type ? icon || defaultDeviceIcon : defaultDeviceIcon, alt: type }))) })));
+    return (_jsx(Tooltip, Object.assign({ title: icon ? capitalizeFirstLetter((type !== null && type !== void 0 ? type : '').toLowerCase()) : t('unKnown') }, { children: isTextShown ? (_jsx(TextLabel, { children: type ? capitalize(type) : 'Unknown' })) : (_jsx(Box, Object.assign({}, props, { component: "img", src: type ? icon || defaultDeviceIcon : defaultDeviceIcon, alt: type }))) })));
 }
 export default memo(DeviceIcon);

package/build/components/DeviceIcon/style.d.ts

@@ -1,7 +1,4 @@
 /// <reference types="react" />
-import { TableMode } from '../../types/index.js';
 export declare const TextLabel: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
-    tableMode?: TableMode | undefined;
-}, {}, {}>;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;

package/build/components/DeviceIcon/style.js

@@ -1,8 +1,6 @@
 import Box from '@mui/material/Box';
 import { styled } from '@mui/material/styles';
-export const TextLabel = styled(Box, {
-    shouldForwardProp: (prop) => prop !== 'tableMode',
-})(({ theme, tableMode }) => ({
+export const TextLabel = styled(Box)(({ theme }) => ({
     fontSize: '11px',
     display: 'flex',
     alignItems: 'center',
@@ -14,5 +12,4 @@ export const TextLabel = styled(Box, {
     borderRadius: '24px',
     border: `1px solid ${theme.palette.divider}`,
     color: theme.palette.text.primary,
-    height: tableMode === 'sheet' ? '18px' : '24px',
 }));

package/build/components/StatusButton/StatusButton.js

@@ -35,20 +35,14 @@ function StatusButton(_a) {
     const dropdownIcon = hasDropdown ? _jsx(ChevronIcon, { isActive: variant === 'active' }) : null;
     return (_jsxs(_Fragment, { children: [_jsx(Button, Object.assign({ "data-testid": "StatusButton" }, props, { ref: buttonRef, onClick: (e) => {
                     var _a, _b;
+                    if (hasDropdown) {
+                        setAnchorEl(e.currentTarget);
+                    }
                     (_a = props === null || props === void 0 ? void 0 : props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
                     onButtonBodyClick === null || onButtonBodyClick === void 0 ? void 0 : onButtonBodyClick(lastActiveStatus || ((_b = dropdownOptions === null || dropdownOptions === void 0 ? void 0 : dropdownOptions[0]) === null || _b === void 0 ? void 0 : _b.status) || 'all');
                 }, sx: Object.assign({}, (hasDropdown && {
                     paddingInlineEnd: '27px',
-                })) }, { children: _jsxs(LabelWrapper, { children: [_jsxs(Label, Object.assign({ variant: variant }, { children: [statusIcon, lastActiveStatus ? t(lastActiveStatus) : label, statusBadge] })), dropdownIcon && (_jsx(ChevronContainer, Object.assign({ onClick: (e) => {
-                                if (showDropdownIcon) {
-                                    return;
-                                }
-                                e.stopPropagation();
-                                e.preventDefault();
-                                if (hasDropdown) {
-                                    setAnchorEl(buttonRef.current);
-                                }
-                            } }, { children: dropdownIcon })))] }) })), open && !showDropdownIcon && (_jsx(StyledDropdown, { open: open, onClose: handleClose, anchorEl: anchorEl, menuItems: (_c = (dropdownOptions || [])) === null || _c === void 0 ? void 0 : _c.map((item) => (Object.assign(Object.assign({}, item), { onClick: (e) => {
+                })) }, { children: _jsxs(LabelWrapper, { children: [_jsxs(Label, Object.assign({ variant: variant }, { children: [statusIcon, lastActiveStatus ? t(lastActiveStatus) : label, statusBadge] })), dropdownIcon && _jsx(ChevronContainer, { children: dropdownIcon })] }) })), open && !showDropdownIcon && (_jsx(StyledDropdown, { open: open, onClose: handleClose, anchorEl: anchorEl, menuItems: (_c = (dropdownOptions || [])) === null || _c === void 0 ? void 0 : _c.map((item) => (Object.assign(Object.assign({}, item), { onClick: (e) => {
                         var _a;
                         (_a = item === null || item === void 0 ? void 0 : item.onClick) === null || _a === void 0 ? void 0 : _a.call(item, e);
                         setLastActiveStatus(item.status);

package/build/components/StatusIcons/AuthorizedIcon/AuthorizedIcon.d.ts

@@ -1,11 +1,9 @@
 /// <reference types="react" />
 import { type AuthorizedStatusType } from '../../TableCells';
-import { TableMode } from '../../../types/index.js';
 type AuthorizedIconProps = {
     iconStyles?: React.CSSProperties;
     authorizedStatus?: AuthorizedStatusType;
     isTextShown?: boolean;
-    tableMode?: TableMode;
 };
-export declare const AuthorizedIcon: ({ authorizedStatus, isTextShown, iconStyles, tableMode }: AuthorizedIconProps) => import("react/jsx-runtime").JSX.Element;
+export declare const AuthorizedIcon: ({ authorizedStatus, isTextShown, iconStyles }: AuthorizedIconProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/build/components/StatusIcons/AuthorizedIcon/AuthorizedIcon.js

@@ -6,10 +6,10 @@ import Tooltip from '../../Tooltip';
 import { authorizedStatusIcons } from '../../TableCells/CustomCells/StatusCell/constant';
 import Icon from '../../Icon';
 import { TextLabel } from '../../TableCells/CustomCells/style';
-export const AuthorizedIcon = ({ authorizedStatus, isTextShown, iconStyles, tableMode }) => {
+export const AuthorizedIcon = ({ authorizedStatus, isTextShown, iconStyles }) => {
     const { t } = useTranslation();
     const theme = useTheme();
-    return (_jsx(Tooltip, Object.assign({ title: t(camelCase(authorizedStatus)) }, { children: isTextShown ? (_jsx(TextLabel, Object.assign({ "data-testid": "StatusCell_AuthorizedStatusLabel", sx: Object.assign({ color: theme.palette.info.dark }, (tableMode === 'sheet' && {
-                height: '18px',
-            })) }, { children: t(camelCase(authorizedStatus)) }))) : (_jsx(Icon, { src: authorizedStatusIcons[authorizedStatus], alt: "authorized-icon", "data-testid": "StatusCell_AuthorizedStatusIcon", sx: iconStyles })) })));
+    return (_jsx(Tooltip, Object.assign({ title: t(camelCase(authorizedStatus)) }, { children: isTextShown ? (_jsx(TextLabel, Object.assign({ "data-testid": "StatusCell_AuthorizedStatusLabel", sx: {
+                color: theme.palette.info.dark,
+            } }, { children: t(camelCase(authorizedStatus)) }))) : (_jsx(Icon, { src: authorizedStatusIcons[authorizedStatus], alt: "authorized-icon", "data-testid": "StatusCell_AuthorizedStatusIcon", sx: iconStyles })) })));
 };

package/build/components/StatusIcons/DeviceIcon/DeviceIcon.d.ts

@@ -1,10 +1,8 @@
-import { TableMode } from '../../../types/index.js';
 interface DeviceIconChipProps {
     geographyVariant?: 'G' | 'L' | 'R';
     isTextShown?: boolean;
     deviceCountry?: string;
     deviceType?: 'DESKTOP' | 'PHONE' | 'TABLET';
-    tableMode?: TableMode;
 }
-export declare const DeviceIconChip: ({ geographyVariant, isTextShown, deviceCountry, deviceType, tableMode }: DeviceIconChipProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DeviceIconChip: ({ geographyVariant, isTextShown, deviceCountry, deviceType }: DeviceIconChipProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/build/components/StatusIcons/DeviceIcon/DeviceIcon.js

@@ -2,6 +2,6 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Box } from '@mui/material';
 import DeviceIcon from '../../DeviceIcon';
 import { GeographyIcon } from '../GeographyIcon/GeographyIcon';
-export const DeviceIconChip = ({ geographyVariant, isTextShown, deviceCountry, deviceType, tableMode }) => {
-    return (_jsxs(Box, Object.assign({ sx: Object.assign({ display: 'flex', gap: '8px', alignItems: 'center' }, (tableMode === 'sheet' && { height: '18px' })) }, { children: [_jsx(GeographyIcon, { geographyVariant: geographyVariant, isTextShown: isTextShown, countryCode: deviceCountry }), _jsx(DeviceIcon, { type: deviceType, isTextShown: isTextShown, tableMode: tableMode })] })));
+export const DeviceIconChip = ({ geographyVariant, isTextShown, deviceCountry, deviceType }) => {
+    return (_jsxs(Box, Object.assign({ sx: { display: 'flex', gap: '8px', alignItems: 'center' } }, { children: [_jsx(GeographyIcon, { geographyVariant: geographyVariant, isTextShown: isTextShown, countryCode: deviceCountry }), _jsx(DeviceIcon, { type: deviceType, isTextShown: isTextShown })] })));
 };

package/build/components/StatusIcons/IssuerIcon/IssuerIcon.d.ts

@@ -1,2 +1,2 @@
 import { IssuerIconProps } from './type';
-export default function IssuerIcon({ countryCode, isTextShown, cardNumber, bankName, tableMode }: IssuerIconProps): import("react/jsx-runtime").JSX.Element;
+export default function IssuerIcon({ countryCode, isTextShown, cardNumber, bankName }: IssuerIconProps): import("react/jsx-runtime").JSX.Element;

package/build/components/StatusIcons/IssuerIcon/IssuerIcon.js

@@ -2,8 +2,8 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { GeographyIcon } from '../GeographyIcon/GeographyIcon';
 import { IssuerIconContainer, CardNumber } from './style';
 import Tooltip from '../../Tooltip';
-export default function IssuerIcon({ countryCode, isTextShown, cardNumber, bankName, tableMode }) {
+export default function IssuerIcon({ countryCode, isTextShown, cardNumber, bankName }) {
     const firstFourDigits = cardNumber === null || cardNumber === void 0 ? void 0 : cardNumber.slice(0, 4);
     const lastFourDigits = cardNumber === null || cardNumber === void 0 ? void 0 : cardNumber.slice(-4);
-    return (_jsxs(IssuerIconContainer, Object.assign({ tableMode: tableMode }, { children: [countryCode && _jsx(GeographyIcon, { countryCode: countryCode, isTextShown: isTextShown }), _jsx(Tooltip, Object.assign({ title: bankName }, { children: _jsx(CardNumber, { children: `${firstFourDigits || ''} ${lastFourDigits || ''}` }) }))] })));
+    return (_jsxs(IssuerIconContainer, { children: [countryCode && _jsx(GeographyIcon, { countryCode: countryCode, isTextShown: isTextShown }), _jsx(Tooltip, Object.assign({ title: bankName }, { children: _jsx(CardNumber, { children: `${firstFourDigits || ''} ${lastFourDigits || ''}` }) }))] }));
 }

package/build/components/StatusIcons/IssuerIcon/style.d.ts

@@ -1,8 +1,5 @@
 /// <reference types="react" />
-import { TableMode } from '../../../types/index.js';
 export declare const IssuerIconContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
-    tableMode?: TableMode | undefined;
-}, {}, {}>;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
 export declare const CardNumber: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;

package/build/components/StatusIcons/IssuerIcon/style.js

@@ -1,8 +1,9 @@
 import { Box } from '@mui/material';
 import { styled } from '@mui/material/styles';
-export const IssuerIconContainer = styled(Box, {
-    shouldForwardProp: (prop) => prop !== 'tableMode',
-})(({ theme, tableMode }) => (Object.assign(Object.assign({ display: 'flex', gap: theme.spacing(0.5) }, (tableMode === 'sheet' && { height: '18px' })), { alignItems: 'center' })));
+export const IssuerIconContainer = styled(Box)(({ theme }) => ({
+    display: 'flex',
+    gap: theme.spacing(0.5),
+}));
 export const CardNumber = styled('span')(({ theme }) => ({
     fontSize: '10px',
     fontWeight: 500,

package/build/components/StatusIcons/IssuerIcon/type.d.ts

@@ -1,8 +1,6 @@
-import { TableMode } from '../../../types/index.js';
 export type IssuerIconProps = {
     countryCode?: string;
     isTextShown?: boolean;
     cardNumber?: string;
     bankName?: string;
-    tableMode?: TableMode;
 };

package/build/components/TableCells/CustomCells/ActionCell/ActionCell.d.ts

@@ -1,10 +1,8 @@
 import React from 'react';
 import type { ActionCellProps } from '../type';
-import { TableMode } from '../../../../types/index.js';
 type Props = Readonly<ActionCellProps> & {
     onJsonViewClick?: () => void;
-    tableMode?: TableMode;
 };
-declare function ActionCell({ flag, actions, flagTooltip, flagsCount, dropdownAction, onCloseDropdown, isDropdownShown, row, showJsonViewer, isTextShown, showIdButton, rowId, onJsonViewClick, tableMode, ...props }: Props): import("react/jsx-runtime").JSX.Element;
+declare function ActionCell({ flag, actions, flagTooltip, flagsCount, dropdownAction, onCloseDropdown, isDropdownShown, row, showJsonViewer, isTextShown, showIdButton, rowId, onJsonViewClick, ...props }: Props): import("react/jsx-runtime").JSX.Element;
 declare const _default: React.MemoExoticComponent<typeof ActionCell>;
 export default _default;

package/build/components/TableCells/CustomCells/ActionCell/ActionCell.js

@@ -24,15 +24,14 @@ import { useActionCell } from './hooks/useActionCell';
 import { ActionCellContainer, ActionIcon, ActionsIconContainer } from './style';
 import { IDButton } from '../IDButton';
 import { BadgeWrapper, IdButtonContainer, TextLabel, TransparentButton } from '../style';
-import SheetViewIDButton from '../SheetViewIDButton/SheetViewIDButton';
 function ActionCell(_a) {
     var _b, _c;
-    var { flag, actions, flagTooltip, flagsCount, dropdownAction, onCloseDropdown, isDropdownShown = true, row, showJsonViewer = true, isTextShown, showIdButton = true, rowId, onJsonViewClick, tableMode } = _a, props = __rest(_a, ["flag", "actions", "flagTooltip", "flagsCount", "dropdownAction", "onCloseDropdown", "isDropdownShown", "row", "showJsonViewer", "isTextShown", "showIdButton", "rowId", "onJsonViewClick", "tableMode"]);
+    var { flag, actions, flagTooltip, flagsCount, dropdownAction, onCloseDropdown, isDropdownShown = true, row, showJsonViewer = true, isTextShown, showIdButton = true, rowId, onJsonViewClick } = _a, props = __rest(_a, ["flag", "actions", "flagTooltip", "flagsCount", "dropdownAction", "onCloseDropdown", "isDropdownShown", "row", "showJsonViewer", "isTextShown", "showIdButton", "rowId", "onJsonViewClick"]);
     const { t } = useTranslation();
     const { open, anchorEl, filteredActions, isAnyActionLoading, isAnyActionHasError, isAnyActionSuccessful, areThereAnyShownActions, handleClick, handleClose, } = useActionCell({ actions, isDropdownShown, onCloseDropdown });
     return (_jsx(TableCell, Object.assign({}, props, { sx: {
             overflow: 'visible',
-        } }, { children: _jsxs(ActionCellContainer, Object.assign({ "data-testid": "ActionCell_ActionCellContainer", tableMode: tableMode }, { children: [flag && (_jsx(_Fragment, { children: isTextShown ? (_jsx(Tooltip, Object.assign({ title: flagTooltip }, { children: _jsx(TextLabel, Object.assign({ "data-testid": "ActionCell_FlagLabel", sx: {
+        } }, { children: _jsxs(ActionCellContainer, Object.assign({ "data-testid": "ActionCell_ActionCellContainer" }, { children: [flag && (_jsx(_Fragment, { children: isTextShown ? (_jsx(Tooltip, Object.assign({ title: flagTooltip }, { children: _jsx(TextLabel, Object.assign({ "data-testid": "ActionCell_FlagLabel", sx: {
                                 textAlign: 'left',
                                 justifyContent: 'flex-start',
                             } }, { children: flagTooltip })) }))) : (_jsx(Tooltip, Object.assign({ title: flagTooltip }, { children: _jsxs(BadgeWrapper, Object.assign({ "data-testid": "ActionCell_FlagBadge", sx: {
@@ -72,12 +71,12 @@ function ActionCell(_a) {
                                             },
                                             opacity: 1,
                                         },
-                                    } }, { children: _jsxs(StyledBadge, Object.assign({ compact: true, variant: colorToVariant[(_c = flags[flag]) === null || _c === void 0 ? void 0 : _c.color] || BadgeVariants.ORANGE, "data-testid": "ActionCell_StyledBadge" }, { children: [flagsCount, "x"] })) })))] })) }))) })), showIdButton ? (tableMode === 'sheet' ? (_jsx(SheetViewIDButton, { rowId: rowId || row.id })) : (_jsx(IDButton, { rowId: rowId || row.id }))) : null, _jsxs("div", Object.assign({ "data-testid": "ActionCell_IconsContainer", style: {
+                                    } }, { children: _jsxs(StyledBadge, Object.assign({ compact: true, variant: colorToVariant[(_c = flags[flag]) === null || _c === void 0 ? void 0 : _c.color] || BadgeVariants.ORANGE, "data-testid": "ActionCell_StyledBadge" }, { children: [flagsCount, "x"] })) })))] })) }))) })), showIdButton && _jsx(IDButton, { rowId: rowId || row.id }), _jsxs("div", Object.assign({ "data-testid": "ActionCell_IconsContainer", style: {
                         display: 'flex',
                         alignItems: 'center',
                         justifyContent: 'center',
                         gap: '5px',
-                    } }, { children: [showJsonViewer && (_jsx(_Fragment, { children: _jsx(TransparentButton, Object.assign({ onClick: onJsonViewClick, type: "button", "data-testid": "ActionCell_TransparentButton" }, { children: _jsx(Tooltip, Object.assign({ title: t('jsonViewer') }, { children: _jsx(IdButtonContainer, Object.assign({ tableMode: tableMode, "data-testid": "ActionCell_IdButtonContainer" }, { children: tableMode === 'sheet' ? (_jsx("span", Object.assign({ style: { fontSize: '11px', fontWeight: 400 } }, { children: "View API" }))) : (_jsx(motion.img, { src: jsonBlackIcon, alt: "icon" }, "id-icon")) })) })) })) })), _jsxs(ActionsIconContainer, Object.assign({ id: "styled-popover", selected: !!dropdownAction || open, "data-testid": "ActionCell_ActionsIconContainer", "data-is-active": areThereAnyShownActions, sx: Object.assign({}, (!areThereAnyShownActions && {
+                    } }, { children: [showJsonViewer && (_jsx(_Fragment, { children: _jsx(TransparentButton, Object.assign({ onClick: onJsonViewClick, type: "button", "data-testid": "ActionCell_TransparentButton" }, { children: _jsx(Tooltip, Object.assign({ title: t('jsonViewer') }, { children: _jsx(IdButtonContainer, Object.assign({ "data-testid": "ActionCell_IdButtonContainer" }, { children: _jsx(motion.img, { src: jsonBlackIcon, alt: "icon" }, "id-icon") })) })) })) })), _jsxs(ActionsIconContainer, Object.assign({ id: "styled-popover", selected: !!dropdownAction || open, "data-testid": "ActionCell_ActionsIconContainer", "data-is-active": areThereAnyShownActions, sx: Object.assign({}, (!areThereAnyShownActions && {
                                 pointerEvents: 'none',
                             })) }, { children: [_jsx(TransparentButton, Object.assign({ onClick: handleClick, "data-testid": "ActionCell_ActionsIconContainer_TransparentButton", "data-is-active": areThereAnyShownActions, sx: Object.assign({}, (!areThereAnyShownActions && {
                                         pointerEvents: 'none',

package/build/components/TableCells/CustomCells/ActionCell/style.d.ts

@@ -1,8 +1,5 @@
 /// <reference types="react" />
-import { TableMode } from '../../../../types/index.js';
-export declare const ActionCellContainer: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
-    tableMode?: TableMode | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
+export declare const ActionCellContainer: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
 export declare const ActionsIconContainer: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
     selected: boolean;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;

package/build/components/TableCells/CustomCells/ActionCell/style.js

@@ -1,14 +1,12 @@
 import { styled } from '@mui/material/styles';
 import { motion } from 'framer-motion';
-export const ActionCellContainer = styled('section', {
-    shouldForwardProp: (props) => props !== 'tableMode',
-})(({ theme, tableMode }) => ({
+export const ActionCellContainer = styled('section')(({ theme }) => ({
     display: 'flex',
     alignItems: 'center',
     justifyContent: 'flex-end',
     textAlign: 'center',
     borderRadius: '50%',
-    gap: tableMode === 'sheet' ? '4px' : theme.spacing(1),
+    gap: theme.spacing(1),
     overflow: 'visible',
 }));
 export const ActionsIconContainer = styled('span')(({ selected }) => (Object.assign(Object.assign({ overflow: 'visible', borderRadius: '50%', display: 'flex', justifyContent: 'center', alignItems: 'center', '&:hover': {

package/build/components/TableCells/CustomCells/DestinationCell/DestinationCell.d.ts

@@ -1,3 +1,3 @@
 import { DestinationCellProps } from '../type';
-declare function DestinationCell({ destinationsCount, destinationsTooltip, isTextShown, destination, destinationsAmount, hidden, iconDirection, tableMode, ...props }: DestinationCellProps): import("react/jsx-runtime").JSX.Element | null;
+declare function DestinationCell({ destinationsCount, destinationsTooltip, isTextShown, destination, destinationsAmount, hidden, iconDirection, ...props }: DestinationCellProps): import("react/jsx-runtime").JSX.Element | null;
 export default DestinationCell;

package/build/components/TableCells/CustomCells/DestinationCell/DestinationCell.js

@@ -19,7 +19,7 @@ import { TextLabel } from '../style';
 import { CurrencyIcon } from '../../../index.js';
 function DestinationCell(_a) {
     var _b, _c, _d, _e, _f;
-    var { destinationsCount, destinationsTooltip, isTextShown, destination, destinationsAmount, hidden, iconDirection, tableMode } = _a, props = __rest(_a, ["destinationsCount", "destinationsTooltip", "isTextShown", "destination", "destinationsAmount", "hidden", "iconDirection", "tableMode"]);
+    var { destinationsCount, destinationsTooltip, isTextShown, destination, destinationsAmount, hidden, iconDirection } = _a, props = __rest(_a, ["destinationsCount", "destinationsTooltip", "isTextShown", "destination", "destinationsAmount", "hidden", "iconDirection"]);
     if (!destinationsCount || hidden) {
         return null;
     }
@@ -29,11 +29,10 @@ function DestinationCell(_a) {
     const textView = (_jsx(TextLabel, Object.assign({ sx: {
             textAlign: 'left',
             justifyContent: 'flex-start',
-            height: tableMode === 'sheet' ? '18px' : 'auto',
         } }, { children: destinationsCount > 1 ? (_jsxs("div", { children: ["Destination ", (_c = destinations === null || destinations === void 0 ? void 0 : destinations[0]) === null || _c === void 0 ? void 0 : _c.id, " - ", _jsx(CurrencyIcon, { currency: (_d = destinations === null || destinations === void 0 ? void 0 : destinations[0]) === null || _d === void 0 ? void 0 : _d.currency }), ' ', firstDestinationFormattedAmount.integerAmount, ".", firstDestinationFormattedAmount.decimalAmount, " +", destinationsCount - 1] })) : (_jsxs("div", { children: ["Destination ", (_e = destinations === null || destinations === void 0 ? void 0 : destinations[0]) === null || _e === void 0 ? void 0 : _e.id, " - ", _jsx(CurrencyIcon, { currency: (_f = destinations === null || destinations === void 0 ? void 0 : destinations[0]) === null || _f === void 0 ? void 0 : _f.currency }), " ", formattedAmount.integerAmount, ".", formattedAmount.decimalAmount] })) })));
     return (_jsx(TableCell, Object.assign({ sx: {
             width: 'fit-content',
             overflow: 'visible',
-        } }, props, { children: _jsx(Tooltip, Object.assign({ title: destinationsTooltip }, { children: !isTextShown ? (_jsxs(StyledDestinationCell, Object.assign({ tableMode: tableMode }, { children: [_jsx(StyledDestinationIcon, { src: destinationSolidIcon, pointLeft: iconDirection === 'left' }), destinationsCount > 1 && (_jsx(DestinationCellContainer, Object.assign({ destinationsCount: 1 }, { children: _jsx(DestinationCount, { children: destinationsCount }) })))] }))) : (textView) })) })));
+        } }, props, { children: _jsx(Tooltip, Object.assign({ title: destinationsTooltip }, { children: !isTextShown ? (_jsxs(StyledDestinationCell, { children: [_jsx(StyledDestinationIcon, { src: destinationSolidIcon, pointLeft: iconDirection === 'left' }), destinationsCount > 1 && (_jsx(DestinationCellContainer, Object.assign({ destinationsCount: 1 }, { children: _jsx(DestinationCount, { children: destinationsCount }) })))] })) : (textView) })) })));
 }
 export default DestinationCell;

package/build/components/TableCells/CustomCells/DestinationCell/styled.d.ts

@@ -1,12 +1,9 @@
 /// <reference types="react" />
-import { TableMode } from '../../../../types/index.js';
 export declare const DestinationCellContainer: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
     destinationsCount: number;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const DestinationCount: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
-export declare const StyledDestinationCell: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
-    tableMode?: TableMode | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const StyledDestinationCell: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const StyledDestinationImage: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
     order: number;
 }, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;

package/build/components/TableCells/CustomCells/DestinationCell/styled.js

@@ -19,9 +19,7 @@ export const DestinationCount = styled('span')(({ theme }) => ({
     justifyContent: 'center',
     backgroundColor: `${theme.palette.info.dark}1A`,
 }));
-export const StyledDestinationCell = styled('span', {
-    shouldForwardProp: (prop) => prop !== 'tableMode',
-})(({ theme, tableMode }) => ({
+export const StyledDestinationCell = styled('span')(({ theme }) => ({
     display: 'flex',
     alignItems: 'center',
     justifyContent: 'flex-start',
@@ -30,7 +28,7 @@ export const StyledDestinationCell = styled('span', {
     border: `1px solid ${theme.palette.divider}`,
     paddingInline: theme.spacing(1),
     borderRadius: '56px',
-    height: tableMode === 'sheet' ? '18px' : '24px',
+    height: '24px',
 }));
 export const StyledDestinationImage = styled('img')(({ theme, order }) => ({
     borderRadius: '50%',

package/build/components/TableCells/CustomCells/ReceiptCell/ReceiptCell.d.ts

@@ -1,5 +1,4 @@
-export declare const ReceiptCell: ({ receiptId, isTextShown, tableMode, }: {
+export declare const ReceiptCell: ({ receiptId, isTextShown }: {
     receiptId: string;
     isTextShown?: boolean | undefined;
-    tableMode?: "text" | "sheet" | "default" | undefined;
 }) => import("react/jsx-runtime").JSX.Element;

package/build/components/TableCells/CustomCells/ReceiptCell/ReceiptCell.js

@@ -4,10 +4,7 @@ import { TextTableCell } from '..';
 import { TextLabel } from '../style';
 import Tooltip from '../../../Tooltip';
 import { receiptBillIcon } from '../../../../constants/index.js';
-export const ReceiptCell = ({ receiptId, isTextShown, tableMode, }) => {
-    if (tableMode === 'sheet') {
-        return (_jsx(TextTableCell, { children: _jsx("span", { children: receiptId }) }));
-    }
+export const ReceiptCell = ({ receiptId, isTextShown }) => {
     return isTextShown ? (_jsx(TextTableCell, { children: _jsx("span", { children: receiptId }) })) : (_jsx(TableCell, Object.assign({ component: "div" }, { children: _jsx(Tooltip, Object.assign({ title: `Receipt - ${receiptId}` }, { children: _jsx(TextLabel, Object.assign({ sx: {
                     padding: '3px 8px',
                     maxWidth: '50px',

package/build/components/TableCells/CustomCells/ReferenceCell/ReferenceCell.d.ts

@@ -1,3 +1,3 @@
 import type { ReferenceCellProps } from './type';
-declare function ReferenceCell({ isTextShown, tableMode, ...props }: ReferenceCellProps): import("react/jsx-runtime").JSX.Element;
+declare function ReferenceCell({ isTextShown, ...props }: ReferenceCellProps): import("react/jsx-runtime").JSX.Element;
 export default ReferenceCell;

package/build/components/TableCells/CustomCells/ReferenceCell/ReferenceCell.js

@@ -16,11 +16,10 @@ import startCase from 'lodash/startCase';
 import Tooltip from '../../../Tooltip';
 import { ImageWrapper } from '../../../index.js';
 import { TableCell } from '../../../TableCells';
-import StatusChip from '../../../StatusChip';
 import { referenceIcons } from './constant';
 import { ReferenceTextLabel, ReferenceTextWrapper, ReferenceSourcesContainer, StyledSourceCell, StyledSourceImage, referenceSourceAnimation, } from './style';
 function ReferenceCell(_a) {
-    var { isTextShown, tableMode } = _a, props = __rest(_a, ["isTextShown", "tableMode"]);
+    var { isTextShown } = _a, props = __rest(_a, ["isTextShown"]);
     const [isTooltipOpen, setIsTooltipOpen] = useState(false);
     const theme = useTheme();
     const references = useMemo(() => Object.keys(referenceIcons).filter((key) => !!props[key]), [props]);
@@ -35,9 +34,6 @@ function ReferenceCell(_a) {
                 } }, { children: isTextShown ? (_jsx(ReferenceTextWrapper, { children: _jsx(ReferenceTextLabel, { children: startCase(reference) }) })) : (_jsx(StyledSourceImage, { src: referenceIcons[reference], alt: reference, sx: Object.assign({}, (reference === 'order' && { width: '11.82px' })) })) })) }), `${reference}-${index}`));
     }), [props, references, isTextShown, theme]);
     const referenceSourcesCount = (ReferenceSources === null || ReferenceSources === void 0 ? void 0 : ReferenceSources.length) || 0;
-    if (tableMode === 'sheet') {
-        return (_jsx(TableCell, Object.assign({}, props, { children: _jsx(StyledSourceCell, { children: references.map((reference) => (_jsx(StatusChip, { children: `${startCase(reference)}: ${props[reference]}` }, reference))) }) })));
-    }
     return (_jsx(TableCell, Object.assign({}, props, { children: _jsx(StyledSourceCell, { children: referenceSourcesCount > 0 ? (_jsx(ReferenceSourcesContainer, Object.assign({ layout: true, className: "reference-sources-container", whileHover: "animate", animate: isTooltipOpen ? 'animate' : 'start', sourcesCount: referenceSourcesCount, variants: { animate: { width: referenceSourcesCount * (6 + 32) } }, style: {
                     zIndex: 29,
                 } }, { children: ReferenceSources }))) : null }) })));

package/build/components/TableCells/CustomCells/ReferenceCell/type.d.ts

@@ -2,12 +2,9 @@ import { TableCellProps } from '@mui/material/TableCell';
 import { referenceIcons } from './constant';
 export type ReferenceType = keyof typeof referenceIcons;
 export interface ReferenceCellProps extends TableCellProps {
-    order?: string;
-    merchant?: string;
-    customer?: string;
-    acquirer?: string;
     generic?: string;
+    acquirer?: string;
+    order?: string;
     payment?: string;
     isTextShown?: boolean;
-    tableMode?: 'default' | 'text' | 'sheet';
 }

package/build/components/TableCells/CustomCells/SourceMergedCell/SourceMergedCell.d.ts

@@ -1,3 +1,3 @@
 import { SourceMergedCellProps } from './type';
-declare function SourceMergedCell({ icons, isTextShown, centerIconKey, collapsedViewIcon, isReversed, tableMode, ...props }: Readonly<SourceMergedCellProps>): import("react/jsx-runtime").JSX.Element;
+declare function SourceMergedCell({ icons, isTextShown, centerIconKey, collapsedViewIcon, isReversed, ...props }: Readonly<SourceMergedCellProps>): import("react/jsx-runtime").JSX.Element;
 export default SourceMergedCell;

package/build/components/TableCells/CustomCells/SourceMergedCell/SourceMergedCell.js

@@ -16,16 +16,13 @@ import { StatusContainer, StatusWrapper, StatusIcon } from './style';
 import { getIconXTranslation } from './utils';
 import CollapsedViewIcon from './CollapsedViewIcon';
 function SourceMergedCell(_a) {
-    var { icons, isTextShown, centerIconKey, collapsedViewIcon, isReversed = false, tableMode } = _a, props = __rest(_a, ["icons", "isTextShown", "centerIconKey", "collapsedViewIcon", "isReversed", "tableMode"]);
+    var { icons, isTextShown, centerIconKey, collapsedViewIcon, isReversed = false } = _a, props = __rest(_a, ["icons", "isTextShown", "centerIconKey", "collapsedViewIcon", "isReversed"]);
     const iconsList = useMemo(() => icons.filter((icon) => Boolean(icon.icon)), [icons]);
     const [isHovering, setIsHovering] = useState(false);
     const centerIconIndex = Math.max(centerIconKey ? iconsList.findIndex((icon) => icon.key === centerIconKey) : 0, 0);
     const iconRefs = useRef([]);
     const [iconMeasurements, setIconMeasurements] = useState(new Map());
-    const isSheetMode = tableMode === 'sheet';
     useEffect(() => {
-        if (isSheetMode)
-            return;
         setTimeout(() => {
             const tableMode = isTextShown ? 'text' : 'default';
             const newMeasurements = new Map();
@@ -38,32 +35,9 @@ function SourceMergedCell(_a) {
             });
             setIconMeasurements(new Map([...iconMeasurements, ...newMeasurements]));
         }, 50);
-    }, [iconsList, isTextShown, isHovering, isSheetMode]);
+    }, [iconsList, isTextShown, isHovering]);
     const hasPreviousIcon = (isReversed && iconsList.length > 1) || centerIconIndex > 0;
     const hasNextIcon = !isReversed && centerIconIndex < iconsList.length - 1;
-    if (isSheetMode) {
-        return (_jsx(TableCell, Object.assign({}, props, { "data-testid": "StatusCell", sx: {
-                position: 'relative',
-                overflow: 'visible',
-                zIndex: 101,
-            } }, { children: _jsx("div", Object.assign({ style: {
-                    display: 'flex',
-                    alignItems: 'center',
-                    gap: '4px',
-                    height: '18px',
-                } }, { children: iconsList === null || iconsList === void 0 ? void 0 : iconsList.map((icon, index) => (_jsx("div", Object.assign({ "data-testid": `StatusWrapper-${icon.key}`, style: {
-                        display: 'flex',
-                        alignItems: 'center',
-                        opacity: 1,
-                        border: '1px solid #F2F2F2',
-                        borderRadius: '24px',
-                        padding: '0px 8px',
-                    } }, { children: _jsx("div", Object.assign({ style: {
-                            display: 'flex',
-                            alignItems: 'center',
-                            opacity: 1,
-                        } }, { children: icon.icon })) }), `StatusWrapper-${icon.key}-${index}`))) })) })));
-    }
     return (_jsx(TableCell, Object.assign({}, props, { "data-testid": "StatusCell", sx: {
             position: 'relative',
             overflow: 'visible',

package/build/components/TableCells/CustomCells/SourceMergedCell/type.d.ts

@@ -1,6 +1,6 @@
 import type React from 'react';
 import type { TableCellProps } from '@mui/material/TableCell';
-import { SourceMergedCellIcons, TableMode } from '../../../../types/index.js';
+import { SourceMergedCellIcons } from '../../../../types/index.js';
 import type { SxProps } from '@mui/material';
 export interface SourceMergedCellProps extends TableCellProps {
     icons: {
@@ -15,5 +15,4 @@ export interface SourceMergedCellProps extends TableCellProps {
     };
     isReversed?: boolean;
     sx?: SxProps;
-    tableMode?: TableMode;
 }

package/build/components/TableCells/CustomCells/StatusCell/StatusCell.d.ts

@@ -1,5 +1,5 @@
 import type { StatusCellProps } from './type';
-declare function StatusCell({ statuses, isTextShown, centerIconKey, xGap, tableMode, ...props }: Readonly<StatusCellProps & {
+declare function StatusCell({ statuses, isTextShown, centerIconKey, xGap, ...props }: Readonly<StatusCellProps & {
     isChargesService?: boolean;
     isAuthorizationsService?: boolean;
 }>): import("react/jsx-runtime").JSX.Element;

package/build/components/TableCells/CustomCells/StatusCell/StatusCell.js

@@ -11,16 +11,12 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import { TableCell } from '../../../TableCells';
-import StatusChip from '../../../StatusChip';
 import { StatusIcon, StatusContainer, StatusWrapper } from './style';
 import { getStatusesFilteredObject } from './utils';
 function StatusCell(_a) {
-    var { statuses, isTextShown, centerIconKey, xGap, tableMode } = _a, props = __rest(_a, ["statuses", "isTextShown", "centerIconKey", "xGap", "tableMode"]);
-    const statusesFilteredObject = statuses ? getStatusesFilteredObject(statuses) : {};
+    var { statuses, isTextShown, centerIconKey, xGap } = _a, props = __rest(_a, ["statuses", "isTextShown", "centerIconKey", "xGap"]);
+    const statusesFilteredObject = getStatusesFilteredObject(statuses);
     const statusesList = Object.values(statusesFilteredObject).filter(Boolean);
-    if (tableMode === 'sheet') {
-        return (_jsx(TableCell, Object.assign({}, props, { children: _jsx(StatusContainer, { children: statusesList.map((status, index) => (_jsx(StatusChip, Object.assign({ borderColor: "transparent", padding: '0px' }, { children: status }), index))) }) })));
-    }
     const xGapValue = isTextShown ? xGap || 120 : 40;
     const centerIconIndex = centerIconKey ? Object.entries(statusesFilteredObject).findIndex(([key]) => key === centerIconKey) : 0;
     return (_jsx(TableCell, Object.assign({}, props, { "data-testid": "StatusCell", sx: {