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

package/build/components/RightLeftExpandingCenterChip/RightLeftExpandingCenterChip.js

@@ -20,6 +20,7 @@ function RightLeftExpandingCenterChip(_a) {
     return (_jsx(Box, Object.assign({}, props, { "data-testid": "RightLeftExpandingCenterChipBox", sx: tableCellSx }, { children: _jsx(CenterShiftWrapper, Object.assign({ "data-testid": "CenterShiftWrapper", initial: false, style: { x: shiftX } }, { children: _jsxs(CenterIconWrapper, Object.assign({ "data-testid": "CenterIconWrapper", ref: centerWrapRef, onMouseLeave: handleMouseLeave }, { children: [_jsxs(PeekContainer, Object.assign({ "data-testid": "PeekContainer" }, { children: [_jsx(AnimatePresence, Object.assign({ initial: false }, { children: leftIcons.length > 0 && (_jsx(LeftPeekChip, { "data-testid": "LeftPeekChip", initial: { opacity: 0, scale: 0.95, x: -4 }, animate: isHovering ? { opacity: 0, scale: 0.9, x: -6 } : { opacity: 1, scale: 1, x: -5 }, exit: { opacity: 0, scale: 0.95, x: -4 }, transition: { duration: 0.18, ease: 'easeOut' } }, "left-peek")) })), _jsx(CenterChip, Object.assign({ "data-testid": "CenterChip", ref: centerChipRef, onMouseEnter: handleMouseEnter, style: {
                                     borderRadius: expandableCenter && isHovering ? '12px 0 0 12px' : '12px',
                                     borderRight: expandableCenter && isHovering ? 'none' : undefined,
+                                    paddingInlineEnd: '2px',
                                 } }, { children: _jsx(CenterContent, Object.assign({ "data-testid": "CenterContent", ref: centerContentRef }, { children: centerIcon })) })), _jsx(AnimatePresence, Object.assign({ initial: false }, { children: expandableCenter && (_jsx(ExpandableContainer, Object.assign({ "data-testid": "ExpandableContainer", style: {
                                         width: expandedMV,
                                         position: 'absolute',
@@ -29,7 +30,6 @@ function RightLeftExpandingCenterChip(_a) {
                                         zIndex: 1,
                                         opacity: isHovering ? 1 : 0,
                                         pointerEvents: isHovering ? 'auto' : 'none',
-                                        paddingRight: '2px',
                                     }, initial: false, transition: { duration: 0.2, ease: 'easeOut' } }, { children: _jsx(ExpandableInner, Object.assign({ "data-testid": "ExpandableInner", ref: expandableInnerRef }, { children: expandableCenter })) }))) })), _jsx(AnimatePresence, Object.assign({ initial: false }, { children: rightIcons.length > 0 && (_jsx(RightPeekChip, { "data-testid": "RightPeekChip", initial: { opacity: 0, scale: 0.95, x: 4 }, animate: isHovering ? { opacity: 0, scale: 0.9, x: 6 } : { opacity: 1, scale: 1, x: 5 }, exit: { opacity: 0, scale: 0.95, x: 4 }, transition: { duration: 0.18, ease: 'easeOut' } }, "right-peek")) }))] })), isHovering && leftIcons.length > 0 && (_jsx(HoverBridge, { "data-testid": "LeftHoverBridge", side: "left", style: { width: leftHoverWidth, right: `calc(100% - ${anchors.left}px)`, zIndex: expandedZIndex, pointerEvents: 'auto' } })), isHovering && rightIcons.length > 0 && (_jsx(HoverBridge, { "data-testid": "RightHoverBridge", side: "right", style: { width: rightHoverWidth, left: `${anchors.right}px`, zIndex: expandedZIndex, pointerEvents: 'auto' } })), _jsx(AnimatePresence, Object.assign({ initial: false }, { children: leftIcons.length > 0 && (_jsx(ExpandedSection, Object.assign({ "data-testid": "LeftExpandedSection", side: "left", style: {
                                 right: `calc(100% - ${anchors.left}px)`,
                                 top: '50%',

package/build/components/RightLeftExpandingCenterChip/style.js

@@ -29,6 +29,7 @@ export const LeftExpandIcon = styled(motion.span)(({ theme }) => ({
     fontSize: '10px',
     lineHeight: 1,
     color: theme.palette.text.secondary,
+    fontWeight: 'bold',
     userSelect: 'none',
 }));
 export const RightExpandIcon = styled(motion.span)(({ theme }) => ({
@@ -43,6 +44,7 @@ export const RightExpandIcon = styled(motion.span)(({ theme }) => ({
     fontSize: '10px',
     lineHeight: 1,
     color: theme.palette.text.secondary,
+    fontWeight: 'bold',
     userSelect: 'none',
 }));
 export const ExpandedSection = styled(motion.div)(({ side }) => (Object.assign(Object.assign(Object.assign({ position: 'absolute', display: 'flex', alignItems: 'center' }, (side === 'left' ? { right: '100%', flexDirection: 'row-reverse', transformOrigin: 'right center' } : {})), (side === 'right' ? { left: '100%', flexDirection: 'row', transformOrigin: 'left center' } : {})), { top: '50%', transform: 'translateY(-50%)', gap: 0, pointerEvents: 'auto', overflow: 'visible' })));

package/build/components/StatusIcons/SourceIcons/SourceIcons.js

@@ -16,13 +16,16 @@ export function SourceIcons({ payment, card, isTextShown, firstIcon }) {
         const method = payment === null || payment === void 0 ? void 0 : payment.method;
         const scheme = payment === null || payment === void 0 ? void 0 : payment.scheme;
         if (((_a = getPaymentMethodKey(method)) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === ((_b = getPaymentMethodKey(scheme)) === null || _b === void 0 ? void 0 : _b.toLowerCase())) {
-            initialSources.push(...[getPaymentMethodKey(type), getPaymentMethodKey(method)]);
+            initialSources.push(...[getPaymentMethodKey(method), getPaymentMethodKey(type)]);
         }
         else {
-            initialSources.push(...[getPaymentMethodKey(type), getPaymentMethodKey(method), getPaymentMethodKey(scheme)]);
+            initialSources.push(...[getPaymentMethodKey(method), getPaymentMethodKey(type), getPaymentMethodKey(scheme)]);
         }
         return initialSources;
     }, [payment]);
+    const firstIconSource = useMemo(() => {
+        return _jsx(SourceIcon, { source: firstIcon, isTextShown: isTextShown, title: t(camelCase(firstIcon)) }, firstIcon);
+    }, [firstIcon, isTextShown, t]);
     const paymentSources = useMemo(() => {
         var _a, _b;
         return (_b = (_a = sources()) === null || _a === void 0 ? void 0 : _a.filter((s) => !!s && s !== firstIcon)) === null || _b === void 0 ? void 0 : _b.map((source, index, sourcesList) => {
@@ -31,5 +34,5 @@ export function SourceIcons({ payment, card, isTextShown, firstIcon }) {
             return (_jsx(SourceIcon, { source: source, isTextShown: isTextShown, title: index === 0 && source === 'Wallet' ? walletTooltip : sourceTooltip }, `${source}-${index}`));
         });
     }, [sources, payment, card, isTextShown, t, firstIcon]);
-    return (_jsxs(Box, Object.assign({ display: "flex", alignItems: "center", gap: 0.5 }, { children: [paymentSources, (card === null || card === void 0 ? void 0 : card.last_four) && _jsxs(CardNumber, { children: ["\u00B7\u00B7\u00B7 ", card === null || card === void 0 ? void 0 : card.last_four] })] })));
+    return (_jsxs(Box, Object.assign({ display: "flex", alignItems: "center", gap: 0.5 }, { children: [firstIcon && firstIconSource, paymentSources, (card === null || card === void 0 ? void 0 : card.last_four) && _jsxs(CardNumber, { children: ["\u00B7\u00B7\u00B7 ", card === null || card === void 0 ? void 0 : card.last_four] })] })));
 }

package/build/utils/columns.d.ts

@@ -9,8 +9,8 @@ export declare function filterShownColumns<T>(columns: Array<IColumnProps<T & {
 export declare function isParameterSelected(columns: ColumnViewProps[], columnId: string, parameter: string): boolean;
 export declare function mapDataToViews(columnData?: ColumnsView[], language?: string): ColumnViewProps[];
 export declare function mapViewsToData(columns: ColumnViewProps[]): ColumnsView[];
-export declare const updateColumnSelection: ({ columnsViewData, columnName, selected, }: {
+export declare const updateColumnSelection: ({ columnsViewData, columnsName, selected, }: {
     columnsViewData: ColumnsView[];
-    columnName: string;
+    columnsName: string[];
     selected: boolean;
 }) => ColumnsView[];

package/build/utils/columns.js

@@ -65,11 +65,10 @@ export function mapViewsToData(columns) {
         };
     });
 }
-export const updateColumnSelection = ({ columnsViewData, columnName, selected, }) => {
+export const updateColumnSelection = ({ columnsViewData, columnsName, selected, }) => {
     return columnsViewData.map((column) => {
-        var _a, _b;
-        const columnText = (_b = (_a = column.name[0]) === null || _a === void 0 ? void 0 : _a.text) === null || _b === void 0 ? void 0 : _b.toLowerCase();
-        if (columnText === columnName.toLowerCase()) {
+        var _a;
+        if (columnsName.includes((_a = column.name[0]) === null || _a === void 0 ? void 0 : _a.text)) {
             return Object.assign(Object.assign({}, column), { selected });
         }
         return column;

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