@tap-payments/os-micro-frontend-shared 0.0.296-test.1 → 0.0.296-test.1-test.2

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/ChargeStatusIcon/ChargeStatusIcon.d.ts

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

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

@@ -5,23 +5,17 @@ import { useTranslation } from 'react-i18next';
 import Tooltip from '../../Tooltip';
 import { unCapturedStatuses } from '../../../constants/index.js';
 import { AcquirerContainerAnimationVariants, ErrorCodeLabel, ErrorCodeLabelAnimationVariants, ErrorCodeVariants, ErrorCodeWrapper, GateWayIcon, GatewayIconWrapper, GatewayIconWrapperAnimationTransition, GatewaysContainer, GatewaysContainerAnimationVariants, StatusTextLabel, UnCapturedBadge, UnCapturedContainer, errorCodeLabelAnimation, TextViewWrapper, } from './style';
-import { capturedStatusesStyles, unCapturedStatusesStyles, statusIcons, chargeSheetViewChipStyles, } from '../../TableCells/CustomCells/StatusCell/constant';
+import { capturedStatusesStyles, unCapturedStatusesStyles, statusIcons } from '../../TableCells/CustomCells/StatusCell/constant';
 import { StatusIcon, StatusIconWrapper, TextLabel } from '../../TableCells/CustomCells/style';
-import StatusChip from '../../StatusChip';
-export function ChargeStatusIcon({ chargeStatus, gatewayTooltip, acquirerTooltip, chargeTooltip, errorCode, isTextShown, gatewayCode, acquirerCode, unCapturedStyles, iconStyles, iconWrapperStyles, gatewayIconWrapperStyles, gatewayContainerStyles, gateWayIconStyles, tableMode, showBadge = true, }) {
+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 sheetViewStatusStyle = chargeStatus ? chargeSheetViewChipStyles[chargeStatus] : {};
     const theme = useTheme();
     const { t } = useTranslation();
     const chargeTooltipTitle = chargeTooltip && (_jsx(_Fragment, { children: _jsx("div", { children: chargeTooltip }) }));
     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 (tableMode === 'sheet') {
-        const { background, color, border } = sheetViewStatusStyle;
-        return _jsx(StatusChip, Object.assign({ sx: { background, color, border } }, { children: t(camelCase(chargeStatus)) }));
-    }
     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/StatusIcons/PayoutIcon/PayoutIcon.d.ts

@@ -1,12 +1,10 @@
 /// <reference types="react" />
 import { PayoutStatusType } from '../../TableCells';
-import { TableMode } from '../../../types/index.js';
 type PayoutIconProps = {
     iconStyles?: React.CSSProperties;
     payoutStatus?: PayoutStatusType;
     payoutTooltip?: React.ReactNode;
     isTextShown?: boolean;
-    tableMode?: TableMode;
 };
-export declare const PayoutIcon: ({ payoutStatus, tableMode, isTextShown, payoutTooltip, iconStyles }: PayoutIconProps) => import("react/jsx-runtime").JSX.Element;
+export declare const PayoutIcon: ({ payoutStatus, isTextShown, payoutTooltip, iconStyles }: PayoutIconProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/build/components/StatusIcons/PayoutIcon/PayoutIcon.js

@@ -4,15 +4,9 @@ import { useTranslation } from 'react-i18next';
 import Tooltip from '../../Tooltip';
 import { StatusIcon } from '../../TableCells/CustomCells/style';
 import { StatusTextLabel } from '../../TableCells/CustomCells/InvoiceStatusCell/style';
-import { payoutStatusIcons, payoutStatusStyles } from '../../TableCells/CustomCells/StatusCell/constant';
-import { StatusChip } from '../../index.js';
-export const PayoutIcon = ({ payoutStatus = 'PENDING', tableMode, isTextShown, payoutTooltip, iconStyles }) => {
+import { payoutStatusIcons } from '../../TableCells/CustomCells/StatusCell/constant';
+export const PayoutIcon = ({ payoutStatus = 'PENDING', isTextShown, payoutTooltip, iconStyles }) => {
     const { t } = useTranslation();
-    const payoutStatusStyle = payoutStatusStyles[payoutStatus];
-    if (tableMode === 'sheet') {
-        const chipText = payoutStatus === 'PENDING' ? t('scheduledPayout') : t(camelCase(payoutStatus));
-        return _jsx(StatusChip, Object.assign({ sx: Object.assign({}, payoutStatusStyle) }, { children: chipText }));
-    }
     const title = payoutTooltip ? payoutTooltip : t(camelCase(payoutStatus));
     return (_jsx(Tooltip, Object.assign({ title: title }, { children: isTextShown ? (_jsx(StatusTextLabel, Object.assign({ "data-testid": "StatusCell_PayoutStatusLabel" }, { children: t(camelCase(payoutStatus)) }))) : (_jsx(StatusIcon, { src: payoutStatusIcons[payoutStatus], alt: "settled-icon", "data-testid": "StatusCell_PayoutStatusIcon", style: iconStyles })) })));
 };

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

@@ -1,13 +1,11 @@
 /// <reference types="react" />
 import { type RefundStatusType } from '../../TableCells';
-import { TableMode } from '../../../types/index.js';
 type RefundIconProps = {
     iconStyles?: React.CSSProperties;
     refundStatus?: RefundStatusType;
     refundTooltip?: React.ReactNode;
     refundCount?: number;
     isTextShown?: boolean;
-    tableMode?: TableMode;
 };
-declare const RefundIcon: ({ isTextShown, refundStatus, refundTooltip, refundCount, iconStyles, tableMode }: RefundIconProps) => import("react/jsx-runtime").JSX.Element;
+declare const RefundIcon: ({ isTextShown, refundStatus, refundTooltip, refundCount, iconStyles }: RefundIconProps) => import("react/jsx-runtime").JSX.Element;
 export default RefundIcon;

package/build/components/StatusIcons/RefundIcon/RefundIcon.js

@@ -8,8 +8,7 @@ import { MultiRefundContainer, MultiRefundIcon, RefundsCountBadge } from '../../
 import { StatusIcon } from '../../TableCells/CustomCells/style';
 import { StatusTextLabel } from '../../TableCells/CustomCells/InvoiceStatusCell/style';
 import { refundStatusIcons, refundStyles } from '../../TableCells/CustomCells/StatusCell/constant';
-import StatusChip from '../../StatusChip';
-const RefundIcon = ({ isTextShown, refundStatus = 'PENDING', refundTooltip = '', refundCount, iconStyles, tableMode }) => {
+const RefundIcon = ({ isTextShown, refundStatus = 'PENDING', refundTooltip = '', refundCount, iconStyles }) => {
     const { t } = useTranslation();
     const theme = useTheme();
     const refundCountBadge = (_jsxs(RefundsCountBadge, Object.assign({ "data-testid": "StatusCell_RefundsCountBadge", initial: { width: 0, opacity: 0, padding: '0px' }, transition: {
@@ -33,10 +32,6 @@ const RefundIcon = ({ isTextShown, refundStatus = 'PENDING', refundTooltip = '',
             },
         } }, { children: [refundCount, "x"] })));
     const refundCountShown = (refundCount || 0) > 1;
-    if (tableMode === 'sheet') {
-        const { color, backgroundColor } = refundStyles[refundStatus];
-        return (_jsx(StatusChip, Object.assign({ textColor: color, bgColor: backgroundColor }, { children: t(camelCase(refundStatus)) })));
-    }
     return (_jsx(_Fragment, { children: isTextShown ? (_jsx(Tooltip, Object.assign({ title: _jsx("div", { children: _jsx("div", { children: refundTooltip }) }) }, { children: _jsx(StatusTextLabel, Object.assign({ "data-testid": "StatusCell_RefundStatusLabel", sx: {
                     color: refundStyles[refundStatus].color,
                     backgroundColor: refundStyles[refundStatus].backgroundColor,

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

@@ -3,10 +3,9 @@ export const BrandsWrapper = styled('div')(({ theme }) => ({
     display: 'flex',
     alignItems: 'center',
     gap: theme.spacing(1),
-    border: '1 solid #F2F2F2',
     borderRadius: '44px',
-    padding: '4px 8px',
     lineHeight: '120%',
+    cursor: 'pointer',
 }));
 export const BrandName = styled('div')(({ theme }) => ({
     fontSize: '14px',

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

@@ -9,7 +9,7 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
 import Tooltip from '../../../Tooltip';
 import { destinationSolidIcon } from '../../../../constants/index.js';
 import { formatAmount } from '../../../../utils/index.js';
@@ -25,19 +25,12 @@ function DestinationCell(_a) {
     const firstDestinationFormattedAmount = formatAmount(((_b = destinations === null || destinations === void 0 ? void 0 : destinations[0]) === null || _b === void 0 ? void 0 : _b.amount) || 0);
     const isSheetView = tableMode === 'sheet';
     if (isSheetView) {
-        const sheetViewChips = destinations === null || destinations === void 0 ? void 0 : destinations.reduce((acc, dest) => {
+        const sheetViewChips = destinations === null || destinations === void 0 ? void 0 : destinations.map((dest) => {
             const formattedDestAmount = formatAmount((dest === null || dest === void 0 ? void 0 : dest.amount) || 0);
-            return [
-                ...acc,
-                {
-                    key: 'id',
-                    content: dest === null || dest === void 0 ? void 0 : dest.id,
-                },
-                {
-                    key: 'amount',
-                    content: (_jsxs(_Fragment, { children: [_jsx(CurrencyIcon, { currency: dest === null || dest === void 0 ? void 0 : dest.currency }), _jsxs("span", { children: [formattedDestAmount.integerAmount, ".", formattedDestAmount.decimalAmount] })] })),
-                },
-            ];
+            return {
+                key: 'destination',
+                content: (_jsxs(_Fragment, { children: [_jsxs("div", { children: [dest === null || dest === void 0 ? void 0 : dest.id, " |"] }), _jsx(CurrencyIcon, { currency: dest === null || dest === void 0 ? void 0 : dest.currency }), _jsxs("span", { children: [formattedDestAmount.integerAmount, ".", formattedDestAmount.decimalAmount] })] })),
+            };
         }, []);
         return (_jsx(TableCell, Object.assign({ sx: {
                 width: 'fit-content',

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

@@ -32,7 +32,7 @@ function SegmentsCell(_a) {
             }, onClose: () => {
                 setIsTooltipOpen(false);
             }, title: sourceTooltip }, { children: _jsx(ImageWrapper, Object.assign({ order: index, variants: referenceSourceAnimation(index, theme.shadows[4], isTextShown ? 83 : 0), sx: {
-                    width: isTextShown ? '79px' : '36px',
+                    width: isTextShown ? '79px' : '24px',
                 } }, { children: isTextShown ? (_jsx(ReferenceTextWrapper, { children: _jsx(ReferenceTextLabel, { children: startCase(segment) }) })) : (_jsx(StyledSourceImage, { src: (segmentData === null || segmentData === void 0 ? void 0 : segmentData.icon) || segmentsIcons[segment], alt: segment, sx: Object.assign(Object.assign({}, (segment === 'order' && { width: '11.82px' })), ((segmentData === null || segmentData === void 0 ? void 0 : segmentData.icon) && { borderRadius: '40px' })), onError: (e) => {
                         e.currentTarget.src = segmentsIcons[segment];
                         e.currentTarget.style.borderRadius = '0px';

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

@@ -38,23 +38,6 @@ export declare const payoutStatusIcons: {
     SETTLED: string;
     PENDING: string;
 };
-export declare const payoutStatusStyles: {
-    PAID_OUT: {
-        color: string;
-        background: string;
-        border: string;
-    };
-    SETTLED: {
-        color: string;
-        background: string;
-        border: string;
-    };
-    PENDING: {
-        color: string;
-        background: string;
-        border: string;
-    };
-};
 export declare const authorizedStatusIcons: {
     AUTHORIZED: string;
 };
@@ -62,20 +45,3 @@ export declare const capturedStatusesStyles: Record<(typeof unCapturedStatuses)[
     color: string;
     background: string;
 }>;
-export declare const chargeSheetViewChipStyles: {
-    ABANDONED: {
-        color: string;
-        background: string;
-        border: string;
-    };
-    CANCELLED: {
-        color: string;
-        background: string;
-        border: string;
-    };
-    INITIATED: {
-        color: string;
-        background: string;
-        border: string;
-    };
-};

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

@@ -82,23 +82,6 @@ export const payoutStatusIcons = {
     SETTLED: settledIcon,
     PENDING: settlementInitiatedIcon,
 };
-export const payoutStatusStyles = {
-    PAID_OUT: {
-        color: '#2ACE00',
-        background: '#2ACE001A',
-        border: 'none',
-    },
-    SETTLED: {
-        color: '#2ACE00',
-        background: 'transparent',
-        border: '1px solid #2ACE0066',
-    },
-    PENDING: {
-        color: '#FF7A00',
-        background: '#FF7A000D',
-        border: 'none',
-    },
-};
 export const authorizedStatusIcons = {
     AUTHORIZED: authorizedIcon,
 };
@@ -108,16 +91,3 @@ export const capturedStatusesStyles = {
         background: '#1F88D00D',
     },
 };
-export const chargeSheetViewChipStyles = Object.assign(Object.assign(Object.assign({}, unCapturedStatusesStyles), capturedStatusesStyles), { ABANDONED: {
-        color: '#FFD600',
-        background: 'white',
-        border: '1px solid #FFD60080',
-    }, CANCELLED: {
-        color: '#EDC806',
-        background: '#FFD6001A',
-        border: 'none',
-    }, INITIATED: {
-        color: '#8D8D94',
-        background: 'white',
-        border: '1px solid #8D8D941A',
-    } });

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

@@ -12,7 +12,7 @@ export declare const chargeTableCellWidth: {
     readonly id: {
         readonly default: "225px";
         readonly text: "225px";
-        readonly sheet: "215px";
+        readonly sheet: "235px";
     };
     readonly product: {
         readonly default: "85px";
@@ -37,7 +37,7 @@ export declare const chargeTableCellWidth: {
     readonly customer: {
         readonly default: "180px";
         readonly text: "180px";
-        readonly sheet: "115px";
+        readonly sheet: "145px";
     };
     readonly source: {
         readonly default: "114px";
@@ -62,7 +62,7 @@ export declare const chargeTableCellWidth: {
     readonly destinations: {
         readonly default: "70px";
         readonly text: "240px";
-        readonly sheet: "380px";
+        readonly sheet: "340px";
     };
     readonly topup: {
         readonly default: "20px";
@@ -97,17 +97,17 @@ export declare const chargeTableCellWidth: {
     readonly receipt: {
         readonly default: "85px";
         readonly text: "150px";
-        readonly sheet: "135px";
+        readonly sheet: "155px";
     };
     readonly fees: {
         readonly default: "150px";
         readonly text: "150px";
-        readonly sheet: "150px";
+        readonly sheet: "170px";
     };
     readonly metadata: {
         readonly default: "180px";
         readonly text: "180px";
-        readonly sheet: "245px";
+        readonly sheet: "265px";
     };
     readonly settlement: {
         readonly default: "200px";
@@ -137,12 +137,12 @@ export declare const chargeTableCellWidth: {
     readonly auth_code: {
         readonly default: "80px";
         readonly text: "80px";
-        readonly sheet: "80px";
+        readonly sheet: "100px";
     };
     readonly rrn: {
         readonly default: "100px";
         readonly text: "100px";
-        readonly sheet: "83px";
+        readonly sheet: "105px";
     };
     readonly device: {
         readonly default: "70px";
@@ -182,21 +182,21 @@ export declare const chargeTableCellWidth: {
     readonly acquirer_ref: {
         readonly default: "125px";
         readonly text: "125px";
-        readonly sheet: "125px";
+        readonly sheet: "145px";
     };
     readonly order_ref: {
         readonly default: "200px";
         readonly text: "200px";
-        readonly sheet: "200px";
+        readonly sheet: "220px";
     };
     readonly payment_ref: {
         readonly default: "150px";
         readonly text: "150px";
-        readonly sheet: "150px";
+        readonly sheet: "170px";
     };
     readonly generic_ref: {
         readonly default: "125px";
         readonly text: "125px";
-        readonly sheet: "125px";
+        readonly sheet: "145px";
     };
 };

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

@@ -12,7 +12,7 @@ export const chargeTableCellWidth = {
     id: {
         default: '225px',
         text: '225px',
-        sheet: '215px',
+        sheet: '235px',
     },
     product: {
         default: '85px',
@@ -37,7 +37,7 @@ export const chargeTableCellWidth = {
     customer: {
         default: '180px',
         text: '180px',
-        sheet: '115px',
+        sheet: '145px',
     },
     source: {
         default: '114px',
@@ -62,7 +62,7 @@ export const chargeTableCellWidth = {
     destinations: {
         default: '70px',
         text: '240px',
-        sheet: '380px',
+        sheet: '340px',
     },
     topup: {
         default: '20px',
@@ -97,17 +97,17 @@ export const chargeTableCellWidth = {
     receipt: {
         default: '85px',
         text: '150px',
-        sheet: '135px',
+        sheet: '155px',
     },
     fees: {
         default: '150px',
         text: '150px',
-        sheet: '150px',
+        sheet: '170px',
     },
     metadata: {
         default: '180px',
         text: '180px',
-        sheet: '245px',
+        sheet: '265px',
     },
     settlement: {
         default: '200px',
@@ -137,12 +137,12 @@ export const chargeTableCellWidth = {
     auth_code: {
         default: '80px',
         text: '80px',
-        sheet: '80px',
+        sheet: '100px',
     },
     rrn: {
         default: '100px',
         text: '100px',
-        sheet: '83px',
+        sheet: '105px',
     },
     device: {
         default: '70px',
@@ -182,21 +182,21 @@ export const chargeTableCellWidth = {
     acquirer_ref: {
         default: '125px',
         text: '125px',
-        sheet: '125px',
+        sheet: '145px',
     },
     order_ref: {
         default: '200px',
         text: '200px',
-        sheet: '200px',
+        sheet: '220px',
     },
     payment_ref: {
         default: '150px',
         text: '150px',
-        sheet: '150px',
+        sheet: '170px',
     },
     generic_ref: {
         default: '125px',
         text: '125px',
-        sheet: '125px',
+        sheet: '145px',
     },
 };

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.0.296-test.1",
-  "testVersion": 1,
+  "version": "0.0.296-test.1-test.2",
+  "testVersion": 2,
   "type": "module",
   "main": "build/index.js",
   "module": "build/index.js",