@tap-payments/os-micro-frontend-shared 0.1.87 → 0.1.88

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/StatusIcons/AuthorizationAutoIcons/CaptureAutoIcon.d.ts

@@ -1,3 +1,3 @@
 import { BalanceCellProps } from './type';
-declare function CaptureAutoIcon({ voidPercentage, capturePercentage, captureCount, autoType, captureAmount, voidAmount, currency, isTextShown, remainingAmount, isSheetViewShown, selectionProps, }: BalanceCellProps): import("react/jsx-runtime").JSX.Element;
+declare function CaptureAutoIcon({ voidPercentage, capturePercentage, captureCount, autoType, captureAmount, voidAmount, currency, isTextShown, remainingAmount, }: BalanceCellProps): import("react/jsx-runtime").JSX.Element;
 export default CaptureAutoIcon;

package/build/components/StatusIcons/AuthorizationAutoIcons/CaptureAutoIcon.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useMemo } from 'react';
+import { useCallback } from 'react';
 import { useTheme } from '@mui/material/styles';
 import { motion } from 'framer-motion';
 import { useTranslation } from 'react-i18next';
@@ -8,11 +8,10 @@ import { CaptureTextLabel } from '../../TableCells/CustomCells/style';
 import Tooltip from '../../Tooltip';
 import { capturedAuthorizeIcon, capturedIcon } from '../../../constants/index.js';
 import { formatAmount, formatAmountWithCurrency } from '../../../utils/index.js';
-import StatusChipWithCopy from '../../StatusChipWithCopy';
 import { autoIcons } from './constant';
 import { AutoIconWrapper, BalanceCellContainer, PartialIcon, PercentageContainer, PiePercentage, AutoIconImage, FullyCapturedWrapper } from './style';
 import { formatPercentage } from './utils';
-function CaptureAutoIcon({ voidPercentage, capturePercentage, captureCount, autoType, captureAmount, voidAmount, currency, isTextShown, remainingAmount, isSheetViewShown, selectionProps = {}, }) {
+function CaptureAutoIcon({ voidPercentage, capturePercentage, captureCount, autoType, captureAmount, voidAmount, currency, isTextShown, remainingAmount, }) {
     var _a, _b;
     const isFullyUsed = Number(capturePercentage) + Number(voidPercentage) === 100 || remainingAmount <= 0;
     const theme = useTheme();
@@ -55,15 +54,7 @@ function CaptureAutoIcon({ voidPercentage, capturePercentage, captureCount, auto
                         },
                     } }, { children: [_jsxs(PercentageContainer, Object.assign({ isCapture: true, percentage: capturePercentage }, { children: [capturePercentage, "% ", _jsx(PiePercentage, { isCapture: true, percentage: formatPercentage(capturePercentage) })] })), captureCount > 1 && (_jsxs(StyledBadge, Object.assign({ compact: true, variant: BadgeVariants.DARK }, { children: [captureCount, "x"] })))] }))] })) }))) : autoType === 'CAPTURED' && !isFullyUsed ? (_jsx(Tooltip, Object.assign({ title: generateAutoTooltip('Capture') }, { children: _jsx(AutoIconWrapper, { children: _jsx(AutoIconImage, { src: (_a = autoIcons.CAPTURED) === null || _a === void 0 ? void 0 : _a.icon, alt: "auto" }) }) }))) : (_jsx(Tooltip, Object.assign({ title: generateAutoTooltip('Capture') }, { children: _jsx(AutoIconWrapper, { children: _jsx(AutoIconImage, { src: (_b = autoIcons.CAPTURED) === null || _b === void 0 ? void 0 : _b.icon, alt: "auto" }) }) })));
     const captureStatus = capturePercentage === 100 ? (_jsx(Tooltip, Object.assign({ title: t('captured') }, { children: _jsx(FullyCapturedWrapper, { children: _jsx(AutoIconImage, { src: capturedIcon, alt: "captured" }) }) }))) : (autoCaptureStatus);
-    const captureContent = useMemo(() => {
-        if (isSheetViewShown && captureStatus) {
-            return (_jsx(StatusChipWithCopy, Object.assign({ chipIndex: 4, copyText: t('captured'), selectionProps: selectionProps }, { children: t('captured') })));
-        }
-        if (isTextShown && captureStatus) {
-            return _jsx(CaptureTextLabel, { children: t('captured') });
-        }
-        return captureStatus;
-    }, [isTextShown, captureStatus, isSheetViewShown, selectionProps]);
+    const captureContent = isTextShown && captureStatus ? _jsx(CaptureTextLabel, { children: t('captured') }) : captureStatus;
     return (captureContent && (_jsx("div", Object.assign({ style: {
             zIndex: 12,
         } }, { children: captureContent }))));

package/build/components/StatusIcons/AuthorizationAutoIcons/VoidAutoIcon.d.ts

@@ -1,3 +1,3 @@
 import { BalanceCellProps } from './type';
-declare function VoidAutoIcon({ voidPercentage, capturePercentage, voidCount, autoType, captureAmount, voidAmount, currency, isTextShown, isSheetViewShown, selectionProps, remainingAmount, }: BalanceCellProps): import("react/jsx-runtime").JSX.Element | null;
+declare function VoidAutoIcon({ voidPercentage, capturePercentage, voidCount, autoType, captureAmount, voidAmount, currency, isTextShown, remainingAmount, }: BalanceCellProps): import("react/jsx-runtime").JSX.Element | null;
 export default VoidAutoIcon;

package/build/components/StatusIcons/AuthorizationAutoIcons/VoidAutoIcon.js

@@ -1,18 +1,17 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useMemo } from 'react';
+import { useCallback } from 'react';
 import { useTheme } from '@mui/material/styles';
 import { motion } from 'framer-motion';
 import { useTranslation } from 'react-i18next';
 import StyledBadge, { BadgeVariants } from '../../CountBadge';
 import { VoidTextLabel } from '../../TableCells/CustomCells/style';
-import StatusChipWithCopy from '../../StatusChipWithCopy';
 import Tooltip from '../../Tooltip';
 import { voidedIcon } from '../../../constants/index.js';
 import { formatAmount, formatAmountWithCurrency } from '../../../utils/index.js';
 import { autoIcons } from './constant';
 import { AutoIconWrapper, BalanceCellContainer, PercentageContainer, PiePercentage, AutoIconImage } from './style';
 import { formatPercentage } from './utils';
-function VoidAutoIcon({ voidPercentage, capturePercentage, voidCount, autoType, captureAmount, voidAmount, currency, isTextShown, isSheetViewShown, selectionProps = {}, remainingAmount, }) {
+function VoidAutoIcon({ voidPercentage, capturePercentage, voidCount, autoType, captureAmount, voidAmount, currency, isTextShown, remainingAmount, }) {
     var _a;
     const isFullyUsed = Number(capturePercentage) + Number(voidPercentage) === 100 || remainingAmount <= 0;
     const theme = useTheme();
@@ -60,15 +59,7 @@ function VoidAutoIcon({ voidPercentage, capturePercentage, voidCount, autoType,
                         },
                     } }, { children: _jsxs(StyledBadge, Object.assign({ compact: true, variant: BadgeVariants.NEUTRAL }, { children: [voidCount, "x"] })) })))] })) }))) : autoType === 'VOID' && !isFullyUsed ? (_jsx(Tooltip, Object.assign({ title: generateAutoTooltip('Void') }, { children: _jsx(AutoIconWrapper, { children: _jsx(AutoIconImage, { src: (_a = autoIcons.VOID) === null || _a === void 0 ? void 0 : _a.icon, alt: "auto" }) }) }))) : null;
     const voidStatus = voidPercentage === 100 ? (_jsx(Tooltip, Object.assign({ title: t('void') }, { children: _jsx(AutoIconWrapper, { children: _jsx(AutoIconImage, { src: voidedIcon, alt: "void" }) }) }))) : (autoVoidStatus);
-    const voidContent = useMemo(() => {
-        if (isSheetViewShown && voidStatus) {
-            return (_jsx(StatusChipWithCopy, Object.assign({ chipIndex: 5, copyText: t('void'), selectionProps: selectionProps }, { children: t('void') })));
-        }
-        if (isTextShown && voidStatus) {
-            return _jsx(VoidTextLabel, { children: t('void') });
-        }
-        return voidStatus;
-    }, [isTextShown, voidStatus, isSheetViewShown, selectionProps]);
-    return voidContent ? _jsx("div", Object.assign({ style: Object.assign({}, (!isSheetViewShown && { zIndex: 11 })) }, { children: voidContent })) : null;
+    const voidContent = isTextShown && voidStatus ? _jsx(VoidTextLabel, { children: t('void') }) : voidStatus;
+    return voidContent ? _jsx("div", Object.assign({ style: { zIndex: 11 } }, { children: voidContent })) : null;
 }
 export default VoidAutoIcon;

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

@@ -1,5 +1,4 @@
 import { TableCellProps } from '@mui/material';
-import { SelectionProps } from '../../../types/index.js';
 export interface BalanceCellProps extends TableCellProps {
     autoType?: 'VOID' | 'CAPTURED';
     capturePercentage: number;
@@ -12,6 +11,4 @@ export interface BalanceCellProps extends TableCellProps {
     voidCount: number;
     isTextShown?: boolean;
     remainingAmount: number;
-    isSheetViewShown?: boolean;
-    selectionProps?: SelectionProps;
 }

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

@@ -1,7 +1,6 @@
 import { CSSProperties } from 'react';
-import { SelectionProps } from '../../../types/index.js';
 import { type ChargeStatus } from '../../TableCells';
-export declare function ChargeStatusIcon({ chargeStatus, gatewayTooltip, acquirerTooltip, chargeTooltip, errorCode, isTextShown, gatewayCode, acquirerCode, unCapturedStyles, iconStyles, iconWrapperStyles, gatewayIconWrapperStyles, gatewayContainerStyles, gateWayIconStyles, showBadge, isSheetViewShown, selectionProps, }: Readonly<{
+export declare function ChargeStatusIcon({ chargeStatus, gatewayTooltip, acquirerTooltip, chargeTooltip, errorCode, isTextShown, gatewayCode, acquirerCode, unCapturedStyles, iconStyles, iconWrapperStyles, gatewayIconWrapperStyles, gatewayContainerStyles, gateWayIconStyles, showBadge, }: Readonly<{
     chargeStatus?: ChargeStatus;
     gatewayTooltip?: string;
     showAuthorizedStatus?: boolean;
@@ -18,6 +17,4 @@ export declare function ChargeStatusIcon({ chargeStatus, gatewayTooltip, acquire
     gatewayContainerStyles?: CSSProperties;
     gateWayIconStyles?: CSSProperties;
     showBadge?: boolean;
-    isSheetViewShown?: boolean;
-    selectionProps?: SelectionProps;
 }>): import("react/jsx-runtime").JSX.Element;

package/build/components/StatusIcons/ChargeStatusIcon/ChargeStatusIcon.js

@@ -4,11 +4,10 @@ import camelCase from 'lodash/camelCase';
 import { useTranslation } from 'react-i18next';
 import Tooltip from '../../Tooltip';
 import { unCapturedStatuses } from '../../../constants/index.js';
-import StatusChipWithCopy from '../../StatusChipWithCopy';
+import { AcquirerContainerAnimationVariants, ErrorCodeLabel, ErrorCodeLabelAnimationVariants, ErrorCodeVariants, ErrorCodeWrapper, GateWayIcon, GatewayIconWrapper, GatewayIconWrapperAnimationTransition, GatewaysContainer, GatewaysContainerAnimationVariants, StatusTextLabel, UnCapturedBadge, UnCapturedContainer, errorCodeLabelAnimation, TextViewWrapper, } from './style';
 import { capturedStatusesStyles, unCapturedStatusesStyles, statusIcons } from '../../TableCells/CustomCells/StatusCell/constant';
 import { StatusIcon, StatusIconWrapper, TextLabel } from '../../TableCells/CustomCells/style';
-import { AcquirerContainerAnimationVariants, ErrorCodeLabel, ErrorCodeLabelAnimationVariants, ErrorCodeVariants, ErrorCodeWrapper, GateWayIcon, GatewayIconWrapper, GatewayIconWrapperAnimationTransition, GatewaysContainer, GatewaysContainerAnimationVariants, StatusTextLabel, UnCapturedBadge, UnCapturedContainer, errorCodeLabelAnimation, TextViewWrapper, } from './style';
-export function ChargeStatusIcon({ chargeStatus, gatewayTooltip, acquirerTooltip, chargeTooltip, errorCode, isTextShown, gatewayCode, acquirerCode, unCapturedStyles, iconStyles, iconWrapperStyles, gatewayIconWrapperStyles, gatewayContainerStyles, gateWayIconStyles, showBadge = true, isSheetViewShown = false, selectionProps = {}, }) {
+export function ChargeStatusIcon({ chargeStatus, gatewayTooltip, acquirerTooltip, chargeTooltip, errorCode, isTextShown, gatewayCode, acquirerCode, unCapturedStyles, iconStyles, iconWrapperStyles, gatewayIconWrapperStyles, gatewayContainerStyles, gateWayIconStyles, showBadge = true, }) {
     const unCapturedStatusStyle = chargeStatus ? unCapturedStatusesStyles[chargeStatus] : null;
     const captureStatusStyle = chargeStatus ? capturedStatusesStyles[chargeStatus] : null;
     const theme = useTheme();
@@ -17,9 +16,6 @@ export function ChargeStatusIcon({ chargeStatus, gatewayTooltip, acquirerTooltip
     const acquirerTooltipTitle = acquirerTooltip && (_jsxs(_Fragment, { children: [_jsx("div", { children: "Acquirer" }), _jsx("div", { children: acquirerTooltip })] }));
     const gatewayTooltipTitle = gatewayTooltip && (_jsxs(_Fragment, { children: [_jsx("div", { children: "Gateway" }), _jsx("div", { children: gatewayTooltip })] }));
     const chargeIcon = chargeStatus && statusIcons[chargeStatus] && (_jsx("div", Object.assign({ "data-testid": "ChargeStatusIcon_ChargeIcon", style: Object.assign({ display: 'flex', alignItems: 'center', justifyContent: 'center', width: '16px', height: '16px', borderRadius: unCapturedStatusStyle ? '50%' : '' }, iconWrapperStyles) }, { children: _jsx(StatusIcon, { src: statusIcons[chargeStatus], alt: "charge-icon", "data-testid": "ChargeStatusIcon_StatusIcon", style: Object.assign({ borderRadius: unCapturedStatusStyle ? '50%' : '', width: '16px', height: '16px' }, iconStyles) }) })));
-    if (isSheetViewShown) {
-        return (_jsxs(TextViewWrapper, { children: [_jsxs(StatusChipWithCopy, Object.assign({ copyText: t(camelCase(chargeStatus)), chipIndex: 0, selectionProps: selectionProps }, { children: [t(camelCase(chargeStatus)), " ", errorCode] })), unCapturedStatusStyle && (_jsxs(_Fragment, { children: [gatewayCode && (_jsxs(StatusChipWithCopy, Object.assign({ copyText: "Gateway", chipIndex: 1, selectionProps: selectionProps }, { children: ["Gateway ", gatewayCode] }))), acquirerCode && (_jsxs(StatusChipWithCopy, Object.assign({ copyText: "Acquirer", chipIndex: 2, selectionProps: selectionProps }, { children: ["Acquirer ", acquirerCode] })))] }))] }));
-    }
     if (isTextShown) {
         return (_jsxs(TextViewWrapper, { children: [_jsx(Tooltip, Object.assign({ title: chargeTooltipTitle }, { children: _jsxs(StatusTextLabel, Object.assign({ "data-testid": "ChargeStatusIcon_isTextShown", "data-status": camelCase(chargeStatus), sx: {
                             background: (unCapturedStatusStyle === null || unCapturedStatusStyle === void 0 ? void 0 : unCapturedStatusStyle.background) || (captureStatusStyle === null || captureStatusStyle === void 0 ? void 0 : captureStatusStyle.background) || 'transparent',

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

@@ -1,3 +1,3 @@
 import { AmountCellProps } from '../type';
-declare function AmountCell({ conversionType, amount, currency, tooltipLabel, amountTooltipLabel, isTextShown, tableMode, selectionProps, chipIndex, ...props }: AmountCellProps): import("react/jsx-runtime").JSX.Element;
+declare function AmountCell({ conversionType, amount, currency, tooltipLabel, amountTooltipLabel, isTextShown, tableMode, ...props }: AmountCellProps): import("react/jsx-runtime").JSX.Element;
 export default AmountCell;

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

@@ -10,29 +10,17 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useMemo } from 'react';
 import { TableCell } from '../../../TableCells';
 import Tooltip from '../../../Tooltip';
-import { CurrencyIcon, StatusChipWithCopy } from '../../../index.js';
+import { CurrencyIcon } from '../../../index.js';
 import { getCurrenciesIcon } from '../../../../constants/index.js';
 import { formatAmountWithCurrency } from '../../../../utils/index.js';
 import { AmountCellContainer, ConversionBadge, CurrencySpan, DecimalSpan, FlagContainer } from './style';
 import { FlagIcon } from '../style';
 function AmountCell(_a) {
-    var { conversionType, amount, currency, tooltipLabel, amountTooltipLabel, isTextShown, tableMode, selectionProps = {}, chipIndex = 0 } = _a, props = __rest(_a, ["conversionType", "amount", "currency", "tooltipLabel", "amountTooltipLabel", "isTextShown", "tableMode", "selectionProps", "chipIndex"]);
+    var { conversionType, amount, currency, tooltipLabel, amountTooltipLabel, isTextShown, tableMode } = _a, props = __rest(_a, ["conversionType", "amount", "currency", "tooltipLabel", "amountTooltipLabel", "isTextShown", "tableMode"]);
     const icon = currency && _jsx(FlagIcon, { src: getCurrenciesIcon(currency), alt: "customer icon" });
     const { integerAmount, decimalAmount } = formatAmountWithCurrency(amount, currency);
-    const conversionTypeLabel = useMemo(() => {
-        if (!conversionType)
-            return _jsx(_Fragment, {});
-        return (_jsx(ConversionBadge, Object.assign({ tableMode: tableMode, className: "conversion-type" }, { children: conversionType })));
-    }, [conversionType, tableMode]);
-    const currencyInfo = useMemo(() => {
-        return (_jsx(CurrencySpan, Object.assign({ tableMode: tableMode }, { children: amount !== undefined ? (_jsxs(_Fragment, { children: [_jsx("span", { children: _jsx(CurrencyIcon, { currency: currency, fontSize: 10 }) }), ' ', integerAmount, decimalAmount && (_jsxs(_Fragment, { children: [".", _jsx(DecimalSpan, { children: decimalAmount })] }))] })) : (_jsx("span", { children: "-" })) })));
-    }, [amount, tableMode, currency, integerAmount, decimalAmount]);
-    if (tableMode === 'sheet') {
-        return (_jsxs(StatusChipWithCopy, Object.assign({ chipIndex: chipIndex, copyText: amount ? `${integerAmount}.${decimalAmount}` : '-', selectionProps: selectionProps }, { children: [conversionTypeLabel, currencyInfo] })));
-    }
-    return (_jsx(TableCell, Object.assign({}, props, { children: _jsxs(AmountCellContainer, { children: [_jsx(Tooltip, Object.assign({ title: tooltipLabel || '' }, { children: conversionTypeLabel })), _jsx(Tooltip, Object.assign({ title: _jsx(CurrencyIcon, { currency: currency }) }, { children: isTextShown ? _jsx("span", {}) : _jsx(FlagContainer, { children: icon }) })), _jsx(Tooltip, Object.assign({ title: amountTooltipLabel }, { children: currencyInfo }))] }) })));
+    return (_jsx(TableCell, Object.assign({}, props, { children: _jsxs(AmountCellContainer, { children: [_jsx(Tooltip, Object.assign({ title: tooltipLabel || '' }, { children: conversionType && (_jsx(ConversionBadge, Object.assign({ tableMode: tableMode, className: "conversion-type" }, { children: conversionType }))) })), _jsx(Tooltip, Object.assign({ title: _jsx(CurrencyIcon, { currency: currency }) }, { children: isTextShown ? _jsx("span", {}) : _jsx(FlagContainer, { children: icon }) })), _jsx(Tooltip, Object.assign({ title: amountTooltipLabel }, { children: _jsx(CurrencySpan, Object.assign({ tableMode: tableMode }, { children: amount !== undefined ? (_jsxs(_Fragment, { children: [_jsx("span", { children: _jsx(CurrencyIcon, { currency: currency, fontSize: 10 }) }), ' ', integerAmount, decimalAmount && (_jsxs(_Fragment, { children: [".", _jsx(DecimalSpan, { children: decimalAmount })] }))] })) : (_jsx("span", { children: "-" })) })) }))] }) })));
 }
 export default AmountCell;

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

@@ -1,3 +1,3 @@
 import { BalanceCellProps } from './type';
-declare function BalanceCell({ percentage, days, remainingAmount, currency, isTextShown, isSheetViewShown, selectionProps, ...props }: BalanceCellProps): import("react/jsx-runtime").JSX.Element | null;
+declare function BalanceCell({ percentage, days, remainingAmount, currency, isTextShown, ...props }: BalanceCellProps): import("react/jsx-runtime").JSX.Element;
 export default BalanceCell;

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

@@ -15,25 +15,19 @@ import { useTheme } from '@mui/material/styles';
 import { motion } from 'framer-motion';
 import Tooltip from '../../../Tooltip';
 import { TableCell } from '../../../TableCells';
-import { CurrencyIcon, StatusChipWithCopy } from '../../../index.js';
+import { CurrencyIcon } from '../../../index.js';
 import { formatAmountWithCurrency } from '../../../../utils/index.js';
 import { BalanceCellContainer, PercentageContainer } from './style';
 import { formatPercentage } from './utils';
 import { TextLabel, PiePercentage } from '../style';
 function BalanceCell(_a) {
-    var { percentage, days, remainingAmount, currency, isTextShown, isSheetViewShown, selectionProps = {} } = _a, props = __rest(_a, ["percentage", "days", "remainingAmount", "currency", "isTextShown", "isSheetViewShown", "selectionProps"]);
+    var { percentage, days, remainingAmount, currency, isTextShown } = _a, props = __rest(_a, ["percentage", "days", "remainingAmount", "currency", "isTextShown"]);
     const theme = useTheme();
-    const currencyIcon = _jsx(CurrencyIcon, { currency: currency });
-    const { integerAmount, decimalAmount } = formatAmountWithCurrency(remainingAmount, currency);
-    const amount = `${integerAmount}.${decimalAmount}`;
     const generatedTooltip = useMemo(() => {
-        return (_jsxs(_Fragment, { children: ["Remaining Authorized Balance - ", currencyIcon, " ", amount] }));
+        const { integerAmount, decimalAmount } = formatAmountWithCurrency(remainingAmount, currency);
+        const currencyIcon = _jsx(CurrencyIcon, { currency: currency });
+        return (_jsxs(_Fragment, { children: ["Remaining Authorized Balance - ", currencyIcon, " ", integerAmount, ".", decimalAmount] }));
     }, [remainingAmount, currency]);
-    if (isSheetViewShown) {
-        if (percentage === 0)
-            return null;
-        return (_jsxs(StatusChipWithCopy, Object.assign({ chipIndex: 0, copyText: `${integerAmount}.${decimalAmount}`, selectionProps: selectionProps }, { children: [percentage, "% | Remaining balance - ", currencyIcon, " ", amount] })));
-    }
     return (_jsx(TableCell, Object.assign({}, props, { children: _jsx("div", Object.assign({ style: {
                 display: 'flex',
                 alignItems: 'center',

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

@@ -1,11 +1,8 @@
 import { TableCellProps } from '@mui/material';
-import { SelectionProps } from '../../../../types/index.js';
 export interface BalanceCellProps extends TableCellProps {
     percentage: number;
     days?: number;
     remainingAmount?: number;
     currency?: string;
     isTextShown?: boolean;
-    isSheetViewShown?: boolean;
-    selectionProps?: SelectionProps;
 }

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

@@ -11,6 +11,7 @@ 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) {
@@ -18,7 +19,7 @@ function StatusCell(_a) {
     const statusesFilteredObject = statuses ? getStatusesFilteredObject(statuses) : {};
     const statusesList = Object.values(statusesFilteredObject).filter(Boolean);
     if (tableMode === 'sheet') {
-        return (_jsx(TableCell, Object.assign({}, props, { children: _jsx(StatusContainer, Object.assign({ sx: { paddingRight: '30px' } }, { children: statusesList.map((status) => status) })) })));
+        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;

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

@@ -61,8 +61,6 @@ export interface AmountCellProps extends TableCellProps {
     amountTooltipLabel?: React.ReactNode;
     isTextShown?: boolean;
     tableMode?: TableMode;
-    selectionProps?: SelectionProps;
-    chipIndex?: number;
 }
 export interface DestinationCellProps extends TableCellProps {
     destinationsCount?: number;

package/build/constants/table/cell/authorizationTableCellWidth.d.ts

@@ -7,7 +7,7 @@ export declare const authorizationTableCellWidth: {
     readonly id: {
         readonly default: "225px";
         readonly text: "225px";
-        readonly sheet: "250x";
+        readonly sheet: "225px";
     };
     readonly auto: {
         readonly default: "70px";
@@ -17,7 +17,7 @@ export declare const authorizationTableCellWidth: {
     readonly balance: {
         readonly default: "60px";
         readonly text: "60px";
-        readonly sheet: "250px";
+        readonly sheet: "60px";
     };
     readonly product: {
         readonly default: "85px";
@@ -57,7 +57,7 @@ export declare const authorizationTableCellWidth: {
     readonly payment_agreement: {
         readonly default: "50px";
         readonly text: "150px";
-        readonly sheet: "170px";
+        readonly sheet: "150px";
     };
     readonly amount: {
         readonly default: "170px";
@@ -77,12 +77,12 @@ export declare const authorizationTableCellWidth: {
     readonly status: {
         readonly default: "77px";
         readonly text: "100px";
-        readonly sheet: "300px";
+        readonly sheet: "100px";
     };
     readonly merchant: {
         readonly default: "110px";
         readonly text: "150px";
-        readonly sheet: "215px";
+        readonly sheet: "150px";
     };
     readonly charge: {
         readonly default: "150px";
@@ -112,7 +112,7 @@ export declare const authorizationTableCellWidth: {
     readonly metadata: {
         readonly default: "185px";
         readonly text: "185px";
-        readonly sheet: "250px";
+        readonly sheet: "185px";
     };
     readonly settlement: {
         readonly default: "200px";
@@ -152,66 +152,16 @@ export declare const authorizationTableCellWidth: {
     readonly device: {
         readonly default: "60px";
         readonly text: "190px";
-        readonly sheet: "235px";
+        readonly sheet: "190px";
     };
     readonly card_no: {
         readonly default: "120px";
         readonly text: "120px";
-        readonly sheet: "140px";
+        readonly sheet: "120px";
     };
     readonly brand: {
         readonly default: "116px";
         readonly text: "116px";
         readonly sheet: "116px";
     };
-    readonly payment_initiated: {
-        readonly default: "150px";
-        readonly text: "150px";
-        readonly sheet: "150px";
-    };
-    readonly payment_issuers: {
-        readonly default: "150px";
-        readonly text: "150px";
-        readonly sheet: "350px";
-    };
-    readonly card_number: {
-        readonly default: "120px";
-        readonly text: "120px";
-        readonly sheet: "155px";
-    };
-    readonly payment_type: {
-        readonly default: "150px";
-        readonly text: "150px";
-        readonly sheet: "120px";
-    };
-    readonly payment_method: {
-        readonly default: "150px";
-        readonly text: "150px";
-        readonly sheet: "145px";
-    };
-    readonly payment_scheme: {
-        readonly default: "150px";
-        readonly text: "150px";
-        readonly sheet: "145px";
-    };
-    readonly auth_status: {
-        readonly default: "150px";
-        readonly text: "150px";
-        readonly sheet: "165px";
-    };
-    readonly auth_type: {
-        readonly default: "150px";
-        readonly text: "150px";
-        readonly sheet: "155px";
-    };
-    readonly eci: {
-        readonly default: "150px";
-        readonly text: "150px";
-        readonly sheet: "100px";
-    };
-    readonly acquirer_response: {
-        readonly default: "70px";
-        readonly text: "70px";
-        readonly sheet: "225px";
-    };
 };

package/build/constants/table/cell/authorizationTableCellWidth.js

@@ -7,7 +7,7 @@ export const authorizationTableCellWidth = {
     id: {
         default: '225px',
         text: '225px',
-        sheet: '250x',
+        sheet: '225px',
     },
     auto: {
         default: '70px',
@@ -17,7 +17,7 @@ export const authorizationTableCellWidth = {
     balance: {
         default: '60px',
         text: '60px',
-        sheet: '250px',
+        sheet: '60px',
     },
     product: {
         default: '85px',
@@ -57,7 +57,7 @@ export const authorizationTableCellWidth = {
     payment_agreement: {
         default: '50px',
         text: '150px',
-        sheet: '170px',
+        sheet: '150px',
     },
     amount: {
         default: '170px',
@@ -77,12 +77,12 @@ export const authorizationTableCellWidth = {
     status: {
         default: '77px',
         text: '100px',
-        sheet: '300px',
+        sheet: '100px',
     },
     merchant: {
         default: '110px',
         text: '150px',
-        sheet: '215px',
+        sheet: '150px',
     },
     charge: {
         default: '150px',
@@ -112,7 +112,7 @@ export const authorizationTableCellWidth = {
     metadata: {
         default: '185px',
         text: '185px',
-        sheet: '250px',
+        sheet: '185px',
     },
     settlement: {
         default: '200px',
@@ -152,66 +152,16 @@ export const authorizationTableCellWidth = {
     device: {
         default: '60px',
         text: '190px',
-        sheet: '235px',
+        sheet: '190px',
     },
     card_no: {
         default: '120px',
         text: '120px',
-        sheet: '140px',
+        sheet: '120px',
     },
     brand: {
         default: '116px',
         text: '116px',
         sheet: '116px',
     },
-    payment_initiated: {
-        default: '150px',
-        text: '150px',
-        sheet: '150px',
-    },
-    payment_issuers: {
-        default: '150px',
-        text: '150px',
-        sheet: '350px',
-    },
-    card_number: {
-        default: '120px',
-        text: '120px',
-        sheet: '155px',
-    },
-    payment_type: {
-        default: '150px',
-        text: '150px',
-        sheet: '120px',
-    },
-    payment_method: {
-        default: '150px',
-        text: '150px',
-        sheet: '145px',
-    },
-    payment_scheme: {
-        default: '150px',
-        text: '150px',
-        sheet: '145px',
-    },
-    auth_status: {
-        default: '150px',
-        text: '150px',
-        sheet: '165px',
-    },
-    auth_type: {
-        default: '150px',
-        text: '150px',
-        sheet: '155px',
-    },
-    eci: {
-        default: '150px',
-        text: '150px',
-        sheet: '100px',
-    },
-    acquirer_response: {
-        default: '70px',
-        text: '70px',
-        sheet: '225px',
-    },
 };

package/build/constants/table/cell/refundTableCellWidth.d.ts

@@ -94,6 +94,16 @@ export declare const refundTableCellWidth: {
         readonly text: "195px";
         readonly sheet: "180px";
     };
+    readonly payouts: {
+        readonly default: "195px";
+        readonly text: "195px";
+        readonly sheet: "300px";
+    };
+    readonly reason: {
+        readonly default: "170px";
+        readonly text: "240px";
+        readonly sheet: "160px";
+    };
     readonly destinations: {
         readonly default: "70px";
         readonly text: "240px";
@@ -182,7 +192,7 @@ export declare const refundTableCellWidth: {
     readonly charge_meta: {
         readonly default: "100px";
         readonly text: "100px";
-        readonly sheet: "100px";
+        readonly sheet: "250px";
     };
     readonly brand: {
         readonly default: "116px";

package/build/constants/table/cell/refundTableCellWidth.js

@@ -94,6 +94,16 @@ export const refundTableCellWidth = {
         text: '195px',
         sheet: '180px',
     },
+    payouts: {
+        default: '195px',
+        text: '195px',
+        sheet: '300px',
+    },
+    reason: {
+        default: '170px',
+        text: '240px',
+        sheet: '160px',
+    },
     destinations: {
         default: '70px',
         text: '240px',
@@ -182,7 +192,7 @@ export const refundTableCellWidth = {
     charge_meta: {
         default: '100px',
         text: '100px',
-        sheet: '100px',
+        sheet: '250px',
     },
     brand: {
         default: '116px',

package/build/constants/table/cell/terminalsTableCellWidth.d.ts

@@ -30,9 +30,9 @@ export declare const terminalsTableCellWidth: {
         readonly sheet: "80px";
     };
     readonly features: {
-        readonly default: "100px";
-        readonly text: "100px";
-        readonly sheet: "100px";
+        readonly default: "80px";
+        readonly text: "80px";
+        readonly sheet: "80px";
     };
     readonly acceptance: {
         readonly default: "80px";

package/build/constants/table/cell/terminalsTableCellWidth.js

@@ -30,9 +30,9 @@ export const terminalsTableCellWidth = {
         sheet: '80px',
     },
     features: {
-        default: '100px',
-        text: '100px',
-        sheet: '100px',
+        default: '80px',
+        text: '80px',
+        sheet: '80px',
     },
     acceptance: {
         default: '80px',

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@tap-payments/os-micro-frontend-shared",
   "description": "Shared components and utilities for Tap Payments micro frontends",
-  "version": "0.1.87",
-  "testVersion": 1,
+  "version": "0.1.88",
+  "testVersion": 2,
   "type": "module",
   "main": "build/index.js",
   "module": "build/index.js",
@@ -136,4 +136,4 @@
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
   }
-}
+}