@tap-payments/os-micro-frontend-shared 0.1.39 → 0.1.40-9.hotfix.1

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

@@ -1,29 +1,31 @@
 import { styled } from '@mui/material';
-export const BrandsWrapper = styled('div')(({ theme }) => ({
+import Box from '@mui/material/Box';
+export const BrandsWrapper = styled('div', { shouldForwardProp: (props) => !['hasClick'].includes(props) })(({ theme, hasClick }) => ({
     display: 'flex',
     alignItems: 'center',
     gap: theme.spacing(1),
     border: '1px solid #F2F2F2',
     borderRadius: '44px',
-    padding: '4px 8px',
-    lineHeight: '120%',
+    padding: '3.5px 5px',
+    height: '24px',
+    cursor: hasClick ? 'pointer' : 'default',
 }));
-export const BrandName = styled('div')(({ theme }) => ({
-    fontSize: '14px',
-    fontWeight: 400,
-    color: theme.palette.text.primary,
+export const BrandsWrapperContent = styled(Box)(() => ({
+    display: 'flex',
+    alignItems: 'center',
+    gap: '4px',
+    overflow: 'hidden',
+    width: '100%',
 }));
+export const Label = styled('p', { shouldForwardProp: (props) => !['brandName'].includes(props) })(({ theme, brandName }) => (Object.assign({ fontSize: '14px', fontWeight: 400, color: theme.palette.text.primary, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap', width: '74px', margin: '0' }, (!brandName && {
+    color: '#B1B1B1',
+    width: '84px',
+}))));
 export const VerificationIcon = styled('img')(() => ({
-    width: '8px',
-    height: '8px',
-}));
-export const Label = styled('p')(({ theme }) => ({
-    fontSize: '14px',
-    fontWeight: 400,
-    color: theme.palette.text.primary,
-    overflow: 'hidden',
-    textOverflow: 'ellipsis',
-    whiteSpace: 'nowrap',
-    maxWidth: '100%',
-    margin: '0',
+    width: '10.5px',
+    height: '10.5px',
 }));
+export const VerificationContainer = styled('div')({
+    marginLeft: 'auto',
+    width: 'auto',
+});

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

@@ -1,7 +1,8 @@
 import { TableCellProps } from '@mui/material';
+import type { ReactNode } from 'react';
 export type BrandsCellProps = TableCellProps & {
+    brandLogo: ReactNode;
     brand: {
-        logo: string;
         name: string;
         id: string;
     };

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

@@ -3,11 +3,10 @@ export declare const StyledSourceCell: import("@emotion/styled").StyledComponent
 export declare const StyledSourceImage: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
 export declare const PaymentSourcesContainer: import("@emotion/styled").StyledComponent<{
     hidden?: boolean | undefined;
-    id?: string | undefined;
-    slot?: string | undefined;
-    title?: string | undefined;
     color?: string | undefined;
-    className?: string | undefined;
+    content?: string | undefined;
+    translate?: "yes" | "no" | undefined;
+    id?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
     suppressContentEditableWarning?: boolean | undefined;
@@ -15,20 +14,21 @@ export declare const PaymentSourcesContainer: import("@emotion/styled").StyledCo
     accessKey?: string | undefined;
     autoCapitalize?: (string & {}) | "none" | "off" | "on" | "sentences" | "words" | "characters" | undefined;
     autoFocus?: boolean | undefined;
+    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
     draggable?: (boolean | "false" | "true") | undefined;
-    enterKeyHint?: "search" | "done" | "next" | "enter" | "go" | "previous" | "send" | undefined;
+    enterKeyHint?: "search" | "enter" | "done" | "go" | "next" | "previous" | "send" | undefined;
     lang?: string | undefined;
     nonce?: string | undefined;
+    slot?: string | undefined;
     spellCheck?: (boolean | "false" | "true") | undefined;
     tabIndex?: number | undefined;
-    translate?: "yes" | "no" | undefined;
+    title?: string | undefined;
     radioGroup?: string | undefined;
     role?: import("react").AriaRole | undefined;
     about?: string | undefined;
-    content?: string | undefined;
     datatype?: string | undefined;
     inlist?: any;
     prefix?: string | undefined;
@@ -48,7 +48,7 @@ export declare const PaymentSourcesContainer: import("@emotion/styled").StyledCo
     results?: number | undefined;
     security?: string | undefined;
     unselectable?: "off" | "on" | undefined;
-    inputMode?: "none" | "email" | "search" | "numeric" | "url" | "text" | "tel" | "decimal" | undefined;
+    inputMode?: "none" | "text" | "email" | "search" | "numeric" | "url" | "tel" | "decimal" | undefined;
     is?: string | undefined;
     exportparts?: string | undefined;
     part?: string | undefined;
@@ -64,7 +64,7 @@ export declare const PaymentSourcesContainer: import("@emotion/styled").StyledCo
     "aria-colindextext"?: string | undefined;
     "aria-colspan"?: number | undefined;
     "aria-controls"?: string | undefined;
-    "aria-current"?: boolean | "date" | "false" | "true" | "time" | "page" | "step" | "location" | undefined;
+    "aria-current"?: boolean | "page" | "date" | "false" | "true" | "time" | "step" | "location" | undefined;
     "aria-describedby"?: string | undefined;
     "aria-description"?: string | undefined;
     "aria-details"?: string | undefined;
@@ -74,7 +74,7 @@ export declare const PaymentSourcesContainer: import("@emotion/styled").StyledCo
     "aria-expanded"?: (boolean | "false" | "true") | undefined;
     "aria-flowto"?: string | undefined;
     "aria-grabbed"?: (boolean | "false" | "true") | undefined;
-    "aria-haspopup"?: boolean | "false" | "true" | "dialog" | "menu" | "grid" | "listbox" | "tree" | undefined;
+    "aria-haspopup"?: boolean | "grid" | "false" | "true" | "dialog" | "listbox" | "menu" | "tree" | undefined;
     "aria-hidden"?: (boolean | "false" | "true") | undefined;
     "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
     "aria-keyshortcuts"?: string | undefined;

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

@@ -1,11 +1,10 @@
 /// <reference types="react" />
 export declare const DueDateCellContainer: import("@emotion/styled").StyledComponent<{
     hidden?: boolean | undefined;
-    id?: string | undefined;
-    slot?: string | undefined;
-    title?: string | undefined;
     color?: string | undefined;
-    className?: string | undefined;
+    content?: string | undefined;
+    translate?: "yes" | "no" | undefined;
+    id?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
     suppressContentEditableWarning?: boolean | undefined;
@@ -13,20 +12,21 @@ export declare const DueDateCellContainer: import("@emotion/styled").StyledCompo
     accessKey?: string | undefined;
     autoCapitalize?: (string & {}) | "none" | "off" | "on" | "sentences" | "words" | "characters" | undefined;
     autoFocus?: boolean | undefined;
+    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
     draggable?: (boolean | "false" | "true") | undefined;
-    enterKeyHint?: "search" | "done" | "next" | "enter" | "go" | "previous" | "send" | undefined;
+    enterKeyHint?: "search" | "enter" | "done" | "go" | "next" | "previous" | "send" | undefined;
     lang?: string | undefined;
     nonce?: string | undefined;
+    slot?: string | undefined;
     spellCheck?: (boolean | "false" | "true") | undefined;
     tabIndex?: number | undefined;
-    translate?: "yes" | "no" | undefined;
+    title?: string | undefined;
     radioGroup?: string | undefined;
     role?: import("react").AriaRole | undefined;
     about?: string | undefined;
-    content?: string | undefined;
     datatype?: string | undefined;
     inlist?: any;
     prefix?: string | undefined;
@@ -46,7 +46,7 @@ export declare const DueDateCellContainer: import("@emotion/styled").StyledCompo
     results?: number | undefined;
     security?: string | undefined;
     unselectable?: "off" | "on" | undefined;
-    inputMode?: "none" | "email" | "search" | "numeric" | "url" | "text" | "tel" | "decimal" | undefined;
+    inputMode?: "none" | "text" | "email" | "search" | "numeric" | "url" | "tel" | "decimal" | undefined;
     is?: string | undefined;
     exportparts?: string | undefined;
     part?: string | undefined;
@@ -62,7 +62,7 @@ export declare const DueDateCellContainer: import("@emotion/styled").StyledCompo
     "aria-colindextext"?: string | undefined;
     "aria-colspan"?: number | undefined;
     "aria-controls"?: string | undefined;
-    "aria-current"?: boolean | "date" | "false" | "true" | "time" | "page" | "step" | "location" | undefined;
+    "aria-current"?: boolean | "page" | "date" | "false" | "true" | "time" | "step" | "location" | undefined;
     "aria-describedby"?: string | undefined;
     "aria-description"?: string | undefined;
     "aria-details"?: string | undefined;
@@ -72,7 +72,7 @@ export declare const DueDateCellContainer: import("@emotion/styled").StyledCompo
     "aria-expanded"?: (boolean | "false" | "true") | undefined;
     "aria-flowto"?: string | undefined;
     "aria-grabbed"?: (boolean | "false" | "true") | undefined;
-    "aria-haspopup"?: boolean | "false" | "true" | "dialog" | "menu" | "grid" | "listbox" | "tree" | undefined;
+    "aria-haspopup"?: boolean | "grid" | "false" | "true" | "dialog" | "listbox" | "menu" | "tree" | undefined;
     "aria-hidden"?: (boolean | "false" | "true") | undefined;
     "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
     "aria-keyshortcuts"?: string | undefined;

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

@@ -1,7 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { getCurrenciesIcon } from '../../../../constants/index.js';
-import { Currency, FlagContainer, Wrapper } from './style';
-import { FlagIcon } from '../style';
+import CountryFlag from '../../../CountryFlag';
+import { Currency, Wrapper } from './style';
 export function CurrencyCell({ currency }) {
-    return (_jsxs(Wrapper, { children: [_jsx(FlagContainer, { children: _jsx(FlagIcon, { src: getCurrenciesIcon(currency), alt: currency }) }), _jsx(Currency, { children: currency })] }));
+    return (_jsxs(Wrapper, { children: [_jsx(CountryFlag, { currencyCode: currency }), _jsx(Currency, { children: currency })] }));
 }

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

@@ -5,5 +5,3 @@ export declare const Wrapper: import("@emotion/styled").StyledComponent<import("
 export declare const Currency: 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>, {}, {}>;
-export declare const FlagContainer: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
-export declare const FlagIcon: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;

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

@@ -10,13 +10,3 @@ export const Currency = styled(Box)(({ theme }) => ({
     color: theme.palette.text.primary,
     lineHeight: '16.8px',
 }));
-export const FlagContainer = styled('span')(() => ({
-    display: 'flex',
-    width: '17px',
-    height: '12px',
-    flexShrink: 0,
-}));
-export const FlagIcon = styled('img')({
-    width: '100%',
-    height: '100%',
-});

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

@@ -1,3 +1,3 @@
-import type { CustomerCellProps } from '../type';
-declare function CustomerCell({ customerInitiated, children, isTimezoneIconShown, hasCustomerIcon, customerIcon, customerName, hideCustomerInitiatedIcon, hideTimezoneIcon, phone, email, id, tableMode, ...props }: Readonly<CustomerCellProps>): import("react/jsx-runtime").JSX.Element;
+import type { CustomerCellProps } from './type';
+declare function CustomerCell({ customerInitiated, children, isTimezoneIconShown, hasCustomerIcon, customerIcon, customerName, hideCustomerInitiatedIcon, hideTimezoneIcon, phone, email, id, ...props }: Readonly<CustomerCellProps>): import("react/jsx-runtime").JSX.Element;
 export default CustomerCell;

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

@@ -15,12 +15,12 @@ import { useTranslation } from 'react-i18next';
 import Tooltip from '../../../Tooltip';
 import { merchantInitiatedIcon, timezoneIcon } from '../../../../constants/index.js';
 import { getRandomGradientColor, isArabic } from '../../../../utils/index.js';
-import { StyledCustomerCell, StyledCustomerIcon, StyledCustomerIconContainer, StyledCustomerName } from './style';
 import { TableCell } from '../../../TableCells';
+import { StyledCustomerCell, StyledCustomerIcon, StyledCustomerIconContainer, StyledCustomerName } from './style';
 import { AvatarStyled, StarBadgeWrapper } from '../style';
 function CustomerCell(_a) {
     var _b;
-    var { customerInitiated, children, isTimezoneIconShown, hasCustomerIcon, customerIcon, customerName, hideCustomerInitiatedIcon, hideTimezoneIcon, phone, email, id, tableMode } = _a, props = __rest(_a, ["customerInitiated", "children", "isTimezoneIconShown", "hasCustomerIcon", "customerIcon", "customerName", "hideCustomerInitiatedIcon", "hideTimezoneIcon", "phone", "email", "id", "tableMode"]);
+    var { customerInitiated, children, isTimezoneIconShown, hasCustomerIcon, customerIcon, customerName, hideCustomerInitiatedIcon, hideTimezoneIcon, phone, email, id } = _a, props = __rest(_a, ["customerInitiated", "children", "isTimezoneIconShown", "hasCustomerIcon", "customerIcon", "customerName", "hideCustomerInitiatedIcon", "hideTimezoneIcon", "phone", "email", "id"]);
     const { t } = useTranslation();
     const customerInitiatedTooltip = customerInitiated === false ? t('merchantInitiated') : '';
     const isArabicCustomerName = isArabic(customerName);
@@ -38,9 +38,6 @@ function CustomerCell(_a) {
             return null;
         return (_jsx("div", Object.assign({ "data-testid": "CustomerCell_customerTooltip" }, { children: tooltipOptions.map(({ name, value }) => value && (_jsx("div", Object.assign({ "data-testid": `CustomerCell_customerTooltip_${name}` }, { children: name === 'Name' ? value : `${name}: ${value}` }), value))) })));
     }, [tooltipOptions]);
-    if (tableMode === 'sheet') {
-        return (_jsx(StyledCustomerName, Object.assign({ tableMode: tableMode, "data-testid": "CustomerCell_StyledCustomerName", "data-is-arabic": isArabicCustomerName }, { children: children })));
-    }
     return (_jsx(TableCell, Object.assign({}, props, { "data-testid": "CustomerCell_TableCell" }, { children: _jsxs(StyledCustomerCell, Object.assign({ "data-testid": "CustomerCell_StyledCustomerCell" }, { children: [customerShownIcon, _jsx(Tooltip, Object.assign({ title: customerTooltip }, { children: _jsx(StyledCustomerName, Object.assign({ "data-testid": "CustomerCell_StyledCustomerName", "data-is-arabic": isArabicCustomerName }, { children: children })) })), !hideTimezoneIcon && (_jsx(StyledCustomerIconContainer, Object.assign({ "data-testid": "CustomerCell_StyledCustomerIconContainer" }, { children: isTimezoneIconShown && _jsx(StyledCustomerIcon, { src: timezoneIcon, "data-testid": "CustomerCell_StyledCustomerIcon" }) }))), !hideCustomerInitiatedIcon && (_jsx(Tooltip, Object.assign({ title: customerInitiatedTooltip }, { children: _jsx(StarBadgeWrapper, Object.assign({ "data-testid": "CustomerCell_StarBadgeWrapper", className: "geography-box", isShown: !!customerInitiatedTooltip }, { children: customerInitiatedTooltip && (_jsx("img", { "data-testid": "CustomerCell_merchantInitiatedIcon", src: merchantInitiatedIcon, alt: "merchant", style: {
                                 width: '16px',
                                 height: '16px',

package/build/components/TableCells/CustomCells/CustomerCell/CustomerCellSheet.d.ts

@@ -0,0 +1,3 @@
+import type { CustomerCellSheetProps } from './type';
+declare function CustomerCellSheet({ children, customerName }: CustomerCellSheetProps): import("react/jsx-runtime").JSX.Element;
+export default CustomerCellSheet;

package/build/components/TableCells/CustomCells/CustomerCell/CustomerCellSheet.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { isArabic } from '../../../../utils/index.js';
+import { StyledCustomerName } from './style';
+function CustomerCellSheet({ children, customerName }) {
+    const isArabicCustomerName = isArabic(customerName);
+    return (_jsx(StyledCustomerName, Object.assign({ tableMode: "sheet", "data-testid": "CustomerCell_StyledCustomerName", "data-is-arabic": isArabicCustomerName }, { children: children })));
+}
+export default CustomerCellSheet;

package/build/components/TableCells/CustomCells/CustomerCell/index.d.ts

@@ -1,2 +1,3 @@
 export { default as CustomerCell } from './CustomerCell';
+export { default as CustomerCellSheet } from './CustomerCellSheet';
 export * from './type';

package/build/components/TableCells/CustomCells/CustomerCell/index.js

@@ -1,2 +1,3 @@
 export { default as CustomerCell } from './CustomerCell';
+export { default as CustomerCellSheet } from './CustomerCellSheet';
 export * from './type';

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

@@ -1,4 +1,19 @@
+import type { TableCellProps } from '@mui/material';
 export type TooltipOption = {
     name: string;
     value?: string;
 };
+export interface CustomerCellProps extends TableCellProps {
+    customerInitiated?: boolean;
+    flagIcon?: string;
+    isTimezoneIconShown?: boolean;
+    hasCustomerIcon?: boolean;
+    customerIcon?: string;
+    customerName: string;
+    hideCustomerInitiatedIcon?: boolean;
+    hideTimezoneIcon?: boolean;
+    email?: string;
+    phone?: string;
+    id?: string;
+}
+export type CustomerCellSheetProps = Pick<CustomerCellProps, 'customerName' | 'children'>;

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

@@ -1,3 +1,9 @@
-import { DateCellProps } from '../type';
-declare function DateCell({ value, format: dateFormat, flagIcon, hasFlag, tableMode, ...props }: DateCellProps): import("react/jsx-runtime").JSX.Element;
-export default DateCell;
+import { DateCellBaseProps } from '../../../index.js';
+interface DateCellProps extends DateCellBaseProps {
+    currentTimezone?: string;
+    timezoneOffset?: number;
+    defaultTimezoneOffset?: number;
+    hideTimezoneIcon?: boolean;
+}
+export default function DateCell({ value, currentTimezone, timezoneOffset, defaultTimezoneOffset, hideTimezoneIcon, ...props }: DateCellProps): import("react/jsx-runtime").JSX.Element;
+export {};

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

@@ -10,20 +10,17 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useMemo } from 'react';
-import { TableCell } from '../../../TableCells';
-import Tooltip from '../../../Tooltip';
-import CountryFlag from '../../../CountryFlag';
-import { formatCellDate, getCountryName } from '../../../../utils/index.js';
-import { DateCellContainer } from './style';
-import { GeographyBox } from '../style';
-import { Box } from '@mui/material';
-function DateCell(_a) {
-    var { value, format: dateFormat, flagIcon, hasFlag, tableMode } = _a, props = __rest(_a, ["value", "format", "flagIcon", "hasFlag", "tableMode"]);
-    const icon = flagIcon && (_jsx(Tooltip, Object.assign({ title: getCountryName(flagIcon || '') }, { children: _jsx(CountryFlag, { code: flagIcon }) })));
-    const renderedValue = useMemo(() => formatCellDate(value, dateFormat), [value]);
-    return (_jsx(TableCell, Object.assign({}, props, { children: _jsxs(DateCellContainer, { children: [hasFlag && (_jsx(GeographyBox, Object.assign({ sx: {
-                        visibility: 'visible',
-                    }, className: "geography-box" }, { children: icon }))), _jsx(Box, Object.assign({ sx: Object.assign({}, (tableMode === 'sheet' && { fontSize: '11px' })) }, { children: renderedValue }))] }) })));
+import Box from '@mui/material/Box';
+import { Tooltip } from '../../../index.js';
+import DateViewer from './DateViewer';
+import { greyTimezoneIcon, TIMEZONES } from '../../../../constants/index.js';
+import { changeDateTimezone, formatCellDate } from '../../../../utils/index.js';
+export default function DateCell(_a) {
+    var { value, currentTimezone = TIMEZONES.UTC, timezoneOffset = 0, defaultTimezoneOffset = 0, hideTimezoneIcon = false } = _a, props = __rest(_a, ["value", "currentTimezone", "timezoneOffset", "defaultTimezoneOffset", "hideTimezoneIcon"]);
+    const formatDate = (targetTimezone) => changeDateTimezone(value, { currentTimezone, targetTimezone });
+    const formattedDate = formatDate(timezoneOffset);
+    const formattedDefaultDate = formatDate(defaultTimezoneOffset);
+    const renderDefaultDate = formatCellDate(formattedDefaultDate);
+    const showTimezoneIcon = !hideTimezoneIcon && defaultTimezoneOffset !== timezoneOffset;
+    return (_jsxs(Box, Object.assign({ sx: { display: 'flex', gap: '8px' } }, { children: [_jsx(DateViewer, Object.assign({ value: formattedDate }, props)), showTimezoneIcon && (_jsx(Tooltip, Object.assign({ title: renderDefaultDate }, { children: _jsx("img", { src: greyTimezoneIcon, width: 14, alt: "timezone" }) })))] })));
 }
-export default DateCell;

package/build/components/TableCells/CustomCells/DateCell/DateViewer.d.ts

@@ -0,0 +1,3 @@
+import { DateCellBaseProps } from '../type';
+declare function DateViewer({ value, format: dateFormat, flagIcon, hasFlag, tableMode, ...props }: DateCellBaseProps): import("react/jsx-runtime").JSX.Element;
+export default DateViewer;

package/build/components/TableCells/CustomCells/DateCell/DateViewer.js

@@ -0,0 +1,29 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import { TableCell } from '../../../TableCells';
+import Tooltip from '../../../Tooltip';
+import CountryFlag from '../../../CountryFlag';
+import { formatCellDate, getCountryNameByISO } from '../../../../utils/index.js';
+import { DateCellContainer } from './style';
+import { GeographyBox } from '../style';
+import { Box } from '@mui/material';
+function DateViewer(_a) {
+    var { value, format: dateFormat, flagIcon, hasFlag, tableMode } = _a, props = __rest(_a, ["value", "format", "flagIcon", "hasFlag", "tableMode"]);
+    const icon = flagIcon && (_jsx(Tooltip, Object.assign({ title: getCountryNameByISO(flagIcon || '') }, { children: _jsx(CountryFlag, { countryCode: flagIcon }) })));
+    const renderedValue = useMemo(() => formatCellDate(value, dateFormat), [value]);
+    return (_jsx(TableCell, Object.assign({}, props, { children: _jsxs(DateCellContainer, { children: [hasFlag && (_jsx(GeographyBox, Object.assign({ sx: {
+                        visibility: 'visible',
+                    }, className: "geography-box" }, { children: icon }))), _jsx(Box, Object.assign({ sx: Object.assign({}, (tableMode === 'sheet' && { fontSize: '11px' })) }, { children: renderedValue }))] }) })));
+}
+export default DateViewer;

package/build/components/TableCells/CustomCells/DateCell/index.d.ts

@@ -1 +1,2 @@
+export { default as DateViewer } from './DateViewer';
 export { default as DateCell } from './DateCell';

package/build/components/TableCells/CustomCells/DateCell/index.js

@@ -1 +1,2 @@
+export { default as DateViewer } from './DateViewer';
 export { default as DateCell } from './DateCell';

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, selectionProps, ...props }: DestinationCellProps): import("react/jsx-runtime").JSX.Element | null;
+import { DestinationCellProps } from './type';
+declare function DestinationCell({ destinationsCount, destinationsTooltip, destination, destinationsAmount, hidden, iconDirection, ...props }: DestinationCellProps): import("react/jsx-runtime").JSX.Element | null;
 export default DestinationCell;

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

@@ -9,42 +9,19 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import Box from '@mui/material/Box';
 import Tooltip from '../../../Tooltip';
 import { destinationSolidIcon } from '../../../../constants/index.js';
-import { formatAmount } from '../../../../utils/index.js';
 import { DestinationCellContainer, DestinationCount, StyledDestinationCell, StyledDestinationIcon } from './styled';
-import { TextLabel } from '../style';
-import { CurrencyIcon, StatusGroupChips } from '../../../index.js';
+const tableMode = 'default';
 function DestinationCell(_a) {
-    var _b, _c, _d, _e, _f;
-    var { destinationsCount, destinationsTooltip, isTextShown, destination, destinationsAmount, hidden, iconDirection, tableMode, selectionProps } = _a, props = __rest(_a, ["destinationsCount", "destinationsTooltip", "isTextShown", "destination", "destinationsAmount", "hidden", "iconDirection", "tableMode", "selectionProps"]);
-    const destinations = (destination === null || destination === void 0 ? void 0 : destination.destination) || [];
-    const formattedAmount = formatAmount(destinationsAmount || 0);
-    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.map((dest, index) => {
-            const formattedDestAmount = formatAmount((dest === null || dest === void 0 ? void 0 : dest.amount) || 0);
-            return {
-                key: `destination-${(dest === null || dest === void 0 ? void 0 : dest.id) || index}`,
-                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] })] })),
-                chipIndex: index,
-                selectionProps,
-                copyText: `${formattedDestAmount.integerAmount}.${formattedDestAmount.decimalAmount}`,
-            };
-        }, [selectionProps]);
-        return (_jsx(Box, Object.assign({}, props, { children: _jsx(StatusGroupChips, { chips: sheetViewChips }) })));
-    }
-    if (!destinationsCount || hidden) {
+    var { destinationsCount, destinationsTooltip, destination, destinationsAmount, hidden, iconDirection } = _a, props = __rest(_a, ["destinationsCount", "destinationsTooltip", "destination", "destinationsAmount", "hidden", "iconDirection"]);
+    if (!destinationsCount || hidden)
         return null;
-    }
-    const textView = (_jsx(TextLabel, Object.assign({ sx: {
-            textAlign: 'left',
-            justifyContent: 'flex-start',
-            height: '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(Box, Object.assign({}, 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) })) })));
+    return (_jsx(Box, Object.assign({ sx: {
+            width: 'fit-content',
+            overflow: 'visible',
+        } }, props, { children: _jsx(Tooltip, Object.assign({ title: destinationsTooltip }, { children: _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 }) })))] })) })) })));
 }
 export default DestinationCell;

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

@@ -0,0 +1,3 @@
+import { DestinationCellSheetProps } from './type';
+declare function DestinationCellSheet({ destinationsCount, destinationsTooltip, destination, destinationsAmount, hidden, iconDirection, selectionProps, ...props }: DestinationCellSheetProps): import("react/jsx-runtime").JSX.Element;
+export default DestinationCellSheet;

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

@@ -0,0 +1,31 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import Box from '@mui/material/Box';
+import { formatAmount } from '../../../../utils/index.js';
+import { CurrencySymbol, StatusGroupChips } from '../../../index.js';
+function DestinationCellSheet(_a) {
+    var { destinationsCount, destinationsTooltip, destination, destinationsAmount, hidden, iconDirection, selectionProps } = _a, props = __rest(_a, ["destinationsCount", "destinationsTooltip", "destination", "destinationsAmount", "hidden", "iconDirection", "selectionProps"]);
+    const destinations = (destination === null || destination === void 0 ? void 0 : destination.destination) || [];
+    const sheetViewChips = destinations === null || destinations === void 0 ? void 0 : destinations.map((dest, index) => {
+        const formattedDestAmount = formatAmount((dest === null || dest === void 0 ? void 0 : dest.amount) || 0);
+        return {
+            key: `destination-${(dest === null || dest === void 0 ? void 0 : dest.id) || index}`,
+            content: (_jsxs(Box, Object.assign({ sx: { display: 'flex', alignItems: 'center', gap: '4px' } }, { children: [_jsxs("div", { children: [dest === null || dest === void 0 ? void 0 : dest.id, " |"] }), _jsx(CurrencySymbol, { currency: dest === null || dest === void 0 ? void 0 : dest.currency }), _jsxs("span", { children: [formattedDestAmount.integerAmount, ".", formattedDestAmount.decimalAmount] })] }))),
+            chipIndex: index,
+            selectionProps: selectionProps !== null && selectionProps !== void 0 ? selectionProps : {},
+            copyText: `${formattedDestAmount.integerAmount}.${formattedDestAmount.decimalAmount}`,
+        };
+    }, [selectionProps]);
+    return (_jsx(Box, Object.assign({}, props, { children: _jsx(StatusGroupChips, { chips: sheetViewChips }) })));
+}
+export default DestinationCellSheet;

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

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

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

@@ -0,0 +1,35 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Box from '@mui/material/Box';
+import Tooltip from '../../../Tooltip';
+import { formatAmount } from '../../../../utils/index.js';
+import { CurrencySymbol } from '../../../index.js';
+import { TextLabel } from '../style';
+function DestinationCell(_a) {
+    var _b, _c, _d, _e, _f;
+    var { destinationsCount, destinationsTooltip, destination, destinationsAmount, hidden, iconDirection } = _a, props = __rest(_a, ["destinationsCount", "destinationsTooltip", "destination", "destinationsAmount", "hidden", "iconDirection"]);
+    const destinations = (destination === null || destination === void 0 ? void 0 : destination.destination) || [];
+    const formattedAmount = formatAmount(destinationsAmount || 0);
+    const firstDestinationFormattedAmount = formatAmount(((_b = destinations === null || destinations === void 0 ? void 0 : destinations[0]) === null || _b === void 0 ? void 0 : _b.amount) || 0);
+    if (!destinationsCount || hidden)
+        return null;
+    return (_jsx(Box, Object.assign({ sx: {
+            width: 'fit-content',
+            overflow: 'visible',
+        } }, props, { children: _jsx(Tooltip, Object.assign({ title: destinationsTooltip }, { children: _jsx(TextLabel, Object.assign({ sx: {
+                    textAlign: 'left',
+                    justifyContent: 'flex-start',
+                    height: '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(CurrencySymbol, { 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(CurrencySymbol, { currency: (_f = destinations === null || destinations === void 0 ? void 0 : destinations[0]) === null || _f === void 0 ? void 0 : _f.currency }), " ", formattedAmount.integerAmount, ".", formattedAmount.decimalAmount] })) })) })) })));
+}
+export default DestinationCell;

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

@@ -1,2 +1,4 @@
 export { default as DestinationCell } from './DestinationCell';
-export { generateDestinationTooltip } from './utils';
+export { default as DestinationCellSheet } from './DestinationCellSheet';
+export { default as DestinationCellText } from './DestinationCellText';
+export * from './utils';

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

@@ -1,2 +1,4 @@
 export { default as DestinationCell } from './DestinationCell';
-export { generateDestinationTooltip } from './utils';
+export { default as DestinationCellSheet } from './DestinationCellSheet';
+export { default as DestinationCellText } from './DestinationCellText';
+export * from './utils';

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

@@ -0,0 +1,34 @@
+/// <reference types="react" />
+import { TableCellProps } from '@mui/material';
+import { SelectionProps } from '../../../../types/index.js';
+export interface DestinationCellProps extends TableCellProps {
+    destinationsCount?: number;
+    flagIcon?: string;
+    destinationsTooltip?: React.ReactNode;
+    destinationsAmount?: number;
+    destination?: {
+        reverse_destinations?: boolean;
+        amount: number;
+        currency: string;
+        count: number;
+        destination: Array<{
+            id: string;
+            amount: number;
+            currency: string;
+            transfer?: {
+                id: string;
+                amount: number;
+                currency: string;
+            };
+            reverse_transfer?: {
+                id: string;
+                amount: number;
+                currency: string;
+            };
+        }>;
+    };
+    iconDirection?: 'left' | 'right';
+}
+export interface DestinationCellSheetProps extends DestinationCellProps {
+    selectionProps?: SelectionProps;
+}

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

@@ -0,0 +1 @@
+export {};