@tap-payments/os-micro-frontend-shared 0.1.147 → 0.1.148-test.1

package/build/components/AppServices/AppServices.js

@@ -19,6 +19,7 @@ function AppServices({ isMaximized, serviceCode, dimensions, appCode, services,
     const { i18n } = useTranslation();
     const servicesList = useMemo(() => {
         var _a;
+        console.log('servicesList', APP_CODES.account.code, appCode);
         if (appCode === APP_CODES.account.code) {
             return (_a = services.filter((service) => service.code === APP_CODES.account.services.account.code)) !== null && _a !== void 0 ? _a : [];
         }

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

@@ -4,4 +4,5 @@ export declare const statusIcons: {
     closed: string;
     expired: string;
     ready: string;
+    registered: string;
 };

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

@@ -5,4 +5,5 @@ export const statusIcons = {
     closed: closedLeadStatusIcon,
     expired: expiredLeadStatusIcon,
     ready: readyLeadStatusIcon,
+    registered: completedLeadStatusIcon,
 };

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

@@ -19,21 +19,25 @@ import { TableCell } from '../../../TableCells';
 import { segmentsIcons } from './constant';
 import { ReferenceTextLabel, ReferenceTextWrapper, ReferenceSourcesContainer, StyledSourceCell, referenceSourceAnimation } from './style';
 import IconWithBadge from '../../../IconWithBadge';
+import { getSegmentTooltip } from './utils';
 function SegmentsCell(_a) {
     var { isTextShown, segments } = _a, props = __rest(_a, ["isTextShown", "segments"]);
     const [isTooltipOpen, setIsTooltipOpen] = useState(false);
     const theme = useTheme();
     const ReferenceSources = useMemo(() => segments === null || segments === void 0 ? void 0 : segments.filter((segment) => !!segment.name).map((segment, index) => {
-        const prefixKey = ['technology', 'institution'].includes(segment.type) ? 'Payment' : '';
-        const sourceTooltip = segment.tooltip || `${prefixKey} ${startCase(segment.type)} - ${segment.name}`;
+        var _a, _b;
+        const isPlatformSegment = (_b = (_a = segment.type) === null || _a === void 0 ? void 0 : _a.toLowerCase) === null || _b === void 0 ? void 0 : _b.call(_a).includes('platform');
+        const sourceTooltip = segment.tooltip || getSegmentTooltip(segment);
+        const segmentType = segment.type;
+        const icon = isPlatformSegment ? segmentsIcons.platform : segmentsIcons[segmentType];
         return (_jsx(Tooltip, Object.assign({ onOpen: () => {
                 setIsTooltipOpen(true);
             }, 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',
-                } }, { children: isTextShown ? (_jsx(ReferenceTextWrapper, { children: _jsx(ReferenceTextLabel, { children: startCase(segment.name) }) })) : (_jsx(IconWithBadge, { mainIcon: segment.icon || segmentsIcons[segment.type], mainIconSize: 16, containerSize: 16, sx: Object.assign({}, (segment.icon ? { borderRadius: '40px' } : { borderRadius: '0px' })), onError: (e) => {
-                        e.currentTarget.src = segmentsIcons[segment.type];
+                } }, { children: isTextShown ? (_jsx(ReferenceTextWrapper, { children: _jsx(ReferenceTextLabel, { children: startCase(segment.name) }) })) : (_jsx(IconWithBadge, { mainIcon: segment.icon || icon, mainIconSize: 16, containerSize: 16, sx: Object.assign({}, (segment.icon ? { borderRadius: '40px' } : { borderRadius: '0px' })), onError: (e) => {
+                        e.currentTarget.src = segmentsIcons[segmentType];
                         e.currentTarget.style.borderRadius = '0px';
                     }, borderColor: "transparent" })) })) }), `${segment.name}-${index}`));
     }), [segments, isTextShown, theme]);

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

@@ -4,7 +4,7 @@ export type SegmentsType = keyof typeof segmentsIcons;
 export interface SegmentInfo {
     name?: string;
     icon?: string;
-    type: SegmentsType;
+    type: string;
     tooltip?: string;
 }
 export interface SegmentsCellProps extends TableCellProps {

package/build/components/TableCells/CustomCells/SegmentsCell/utils.d.ts

@@ -0,0 +1,2 @@
+import { SegmentInfo } from './type';
+export declare const getSegmentTooltip: (segment: SegmentInfo) => string;

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

@@ -0,0 +1,14 @@
+import { capitalizeString } from '../../../../utils/index.js';
+export const getSegmentTooltip = (segment) => {
+    let prefixKey = '';
+    switch (segment.type) {
+        case 'technology':
+        case 'institution':
+            prefixKey = 'Payment';
+            break;
+        default:
+            prefixKey = '';
+            break;
+    }
+    return `${prefixKey} ${capitalizeString(segment.type)} - ${segment.name}`;
+};

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

@@ -35,7 +35,6 @@ export * from './TokenStatusCell';
 export * from './BrandCell';
 export * from './MetadataCell';
 export * from './PayoutReportCell';
-export * from './SourceMergedCell';
 export * from './ReceiptCell';
 export * from './EntityCell';
 export * from './ApplicationStatusCell';

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

@@ -35,7 +35,6 @@ export * from './TokenStatusCell';
 export * from './BrandCell';
 export * from './MetadataCell';
 export * from './PayoutReportCell';
-export * from './SourceMergedCell';
 export * from './ReceiptCell';
 export * from './EntityCell';
 export * from './ApplicationStatusCell';

package/build/types/index.d.ts

@@ -18,7 +18,6 @@ export * from './cell';
 export * from './currency';
 export * from './segment';
 export * from './authentication';
-export * from './source';
 export * from './analytics';
 export * from './refund';
 export * from './destination';

package/build/types/index.js

@@ -18,7 +18,6 @@ export * from './cell';
 export * from './currency';
 export * from './segment';
 export * from './authentication';
-export * from './source';
 export * from './analytics';
 export * from './refund';
 export * from './destination';

package/build/utils/string.d.ts

@@ -15,3 +15,4 @@ export declare const maskValue: (value: string) => string;
  * @returns The transformed string with proper case formatting
  */
 export declare const transformStringToProperCase: (text: string, separator?: string | RegExp, replacement?: string) => string;
+export declare const capitalizeString: (text?: string) => string;

package/build/utils/string.js

@@ -1,4 +1,4 @@
-import startCase from 'lodash/startCase';
+import { capitalize, startCase } from 'lodash';
 export const removePrefixFromString = (str, prefix) => {
     if (!prefix) {
         return str;
@@ -67,3 +67,6 @@ export const transformStringToProperCase = (text, separator = /_/g, replacement
     // Apply proper case formatting
     return startCase(updatedText);
 };
+export const capitalizeString = (text) => {
+    return capitalize(startCase(text));
+};

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.147",
-  "testVersion": 0,
+  "version": "0.1.148-test.1",
+  "testVersion": 1,
   "type": "module",
   "main": "build/index.js",
   "module": "build/index.js",
@@ -163,4 +163,4 @@
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
   }
-}
+}

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

@@ -1,11 +0,0 @@
-import type { SxProps } from '@mui/material';
-import { SourceMergedCellProps } from './type';
-export interface CollapsedViewIconProps {
-    hasPreviousIcon: boolean;
-    hasNextIcon: boolean;
-    isTextShown?: boolean;
-    collapsedViewIcon: SourceMergedCellProps['icons'][number];
-    sx?: SxProps;
-}
-declare const CollapsedViewIcon: ({ hasPreviousIcon, hasNextIcon, isTextShown, collapsedViewIcon, ...props }: Readonly<CollapsedViewIconProps>) => import("react/jsx-runtime").JSX.Element;
-export default CollapsedViewIcon;

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

@@ -1,51 +0,0 @@
-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, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { collapsedViewIconVariants, StatusIcon, StatusWrapper } from './style';
-const CollapsedViewIcon = (_a) => {
-    var { hasPreviousIcon, hasNextIcon, isTextShown, collapsedViewIcon } = _a, props = __rest(_a, ["hasPreviousIcon", "hasNextIcon", "isTextShown", "collapsedViewIcon"]);
-    return (_jsxs(_Fragment, { children: [hasPreviousIcon && (_jsx(StatusWrapper, Object.assign({ variants: {
-                    initial: {
-                        x: -5,
-                        zIndex: 95,
-                        opacity: 1,
-                    },
-                    hover: {
-                        x: -5,
-                        zIndex: 95,
-                        opacity: 0,
-                    },
-                }, transition: collapsedViewIconVariants }, props, { children: _jsx(StatusIcon, Object.assign({ isTextShown: isTextShown }, props, { children: collapsedViewIcon.icon })) }))), _jsx(StatusWrapper, Object.assign({ variants: {
-                    initial: {
-                        x: 0,
-                        zIndex: 100,
-                        opacity: 1,
-                    },
-                    hover: {
-                        x: 0,
-                        zIndex: 100,
-                        opacity: 0,
-                    },
-                }, transition: collapsedViewIconVariants }, props, { children: _jsx(StatusIcon, Object.assign({ isTextShown: isTextShown }, props, { children: collapsedViewIcon.icon })) })), hasNextIcon && (_jsx(StatusWrapper, Object.assign({ variants: {
-                    initial: {
-                        x: 5,
-                        zIndex: 95,
-                        opacity: 1,
-                    },
-                    hover: {
-                        x: 5,
-                        zIndex: 95,
-                        opacity: 0,
-                    },
-                }, transition: collapsedViewIconVariants }, props, { children: _jsx(StatusIcon, Object.assign({ isTextShown: isTextShown }, props, { children: collapsedViewIcon.icon })) })))] }));
-};
-export default CollapsedViewIcon;

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

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

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

@@ -1,105 +0,0 @@
-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, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useRef, useEffect, useState, useMemo } from 'react';
-import { TableCell } from '../../../TableCells';
-import { StatusContainer, StatusWrapper, StatusIcon, SheetModeContainer, SheetModeStatusWrapper, SheetModeIconContainer } from './style';
-import { getIconXTranslation } from './utils';
-import CollapsedViewIcon from './CollapsedViewIcon';
-function SourceMergedCell(_a) {
-    var { icons, isTextShown, centerIconKey, collapsedViewIcon, isReversed = false, tableMode } = _a, props = __rest(_a, ["icons", "isTextShown", "centerIconKey", "collapsedViewIcon", "isReversed", "tableMode"]);
-    const iconsList = useMemo(() => icons.filter((icon) => Boolean(icon.icon)), [icons]);
-    const [isHovering, setIsHovering] = useState(false);
-    const centerIconIndex = Math.max(centerIconKey ? iconsList.findIndex((icon) => icon.key === centerIconKey) : 0, 0);
-    // Create refs for each icon to measure their actual widths
-    const iconRefs = useRef([]);
-    const [iconMeasurements, setIconMeasurements] = useState(new Map());
-    // For sheet mode, always show all icons inline
-    const isSheetMode = tableMode === 'sheet';
-    // Measure icons after render and on table mode change
-    useEffect(() => {
-        if (isSheetMode)
-            return; // Skip measurements for sheet mode as we don't need hover animations
-        setTimeout(() => {
-            const tableMode = isTextShown ? 'text' : 'default';
-            const newMeasurements = new Map();
-            iconRefs.current.forEach((ref, index) => {
-                if (ref) {
-                    const width = ref.getBoundingClientRect().width;
-                    // Get existing measurements or create new
-                    const existingMeasurement = iconMeasurements.get(index) || { default: 0, text: 0 };
-                    // Update only the current table mode's measurement
-                    newMeasurements.set(index, Object.assign(Object.assign({}, existingMeasurement), { [tableMode]: width }));
-                }
-            });
-            setIconMeasurements(new Map([...iconMeasurements, ...newMeasurements]));
-        }, 50);
-    }, [iconsList, isTextShown, isHovering, isSheetMode]);
-    const hasPreviousIcon = (isReversed && iconsList.length > 1) || centerIconIndex > 0;
-    const hasNextIcon = !isReversed && centerIconIndex < iconsList.length - 1;
-    if (isSheetMode) {
-        return (_jsx(TableCell, Object.assign({}, props, { "data-testid": "StatusCell", sx: {
-                position: 'relative',
-                overflow: 'visible',
-                zIndex: 101,
-            } }, { children: _jsx(SheetModeContainer, { children: iconsList === null || iconsList === void 0 ? void 0 : iconsList.map((icon, index) => (_jsx(SheetModeStatusWrapper, Object.assign({ "data-testid": `StatusWrapper-${icon.key}` }, { children: _jsx(SheetModeIconContainer, { children: icon.icon }) }), `StatusWrapper-${icon.key}-${index}`))) }) })));
-    }
-    return (_jsx(TableCell, Object.assign({}, props, { "data-testid": "StatusCell", sx: {
-            position: 'relative',
-            overflow: 'visible',
-            zIndex: 101,
-        } }, { children: _jsx(StatusContainer, Object.assign({ animate: isHovering ? 'hover' : 'initial', onMouseEnter: () => setIsHovering(true), onMouseLeave: () => setIsHovering(false), initial: "initial", sx: {
-                minHeight: '20px',
-                maxWidth: '55px',
-            }, isReversed: isReversed }, { children: _jsxs(_Fragment, { children: [collapsedViewIcon && (_jsx(CollapsedViewIcon, { hasPreviousIcon: hasPreviousIcon, hasNextIcon: hasNextIcon, isTextShown: isTextShown, collapsedViewIcon: collapsedViewIcon, sx: props.sx }, 'collapsedViewIcon')), iconsList === null || iconsList === void 0 ? void 0 : iconsList.map((icon, index) => {
-                        if (!icon)
-                            return;
-                        const tableMode = isTextShown ? 'text' : 'default';
-                        // To keep x position of each icon while hovering consistent
-                        const xHoverPosition = getIconXTranslation({
-                            iconsList: iconsList.map((iconObj, i) => {
-                                const measurements = iconMeasurements.get(i);
-                                return Object.assign(Object.assign({}, iconObj), { width: {
-                                        default: (measurements === null || measurements === void 0 ? void 0 : measurements.default) || 0,
-                                        text: (measurements === null || measurements === void 0 ? void 0 : measurements.text) || 0,
-                                    } });
-                            }),
-                            tableMode: tableMode,
-                            centerIndex: centerIconIndex,
-                            iconIndex: index,
-                        });
-                        return (_jsx(StatusWrapper, Object.assign({ ref: (el) => (iconRefs.current[index] = el), "data-testid": `StatusWrapper-${icon.key}`, variants: {
-                                initial: {
-                                    x: 0,
-                                    opacity: 0,
-                                },
-                                hover: {
-                                    x: isReversed ? -xHoverPosition : xHoverPosition,
-                                    zIndex: 100 - Math.abs(centerIconIndex - index),
-                                    opacity: 1,
-                                },
-                            }, transition: {
-                                default: { duration: 0.3, ease: 'easeInOut' },
-                                opacity: { duration: 0.0, ease: 'linear' },
-                            } }, { children: _jsx(StatusIcon, Object.assign({ isTextShown: isTextShown, variants: {
-                                    initial: {
-                                        opacity: 0,
-                                    },
-                                    hover: {
-                                        opacity: 1,
-                                    },
-                                }, transition: {
-                                    opacity: { duration: 0.0, ease: 'linear' },
-                                } }, { children: icon.icon })) }), `StatusWrapper-${icon.key}-${index}`));
-                    })] }) })) })));
-}
-export default SourceMergedCell;

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

@@ -1,3 +0,0 @@
-export { default as SourceMergedCell } from './SourceMergedCell';
-export { default as CollapsedViewIcon } from './CollapsedViewIcon';
-export * from './type';

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

@@ -1,3 +0,0 @@
-export { default as SourceMergedCell } from './SourceMergedCell';
-export { default as CollapsedViewIcon } from './CollapsedViewIcon';
-export * from './type';