@tap-payments/os-micro-frontend-shared 0.1.329 → 0.1.330

package/build/components/PaymentSourceFilter/PaymentIcon.d.ts

@@ -0,0 +1,5 @@
+interface PaymentIconProps {
+    type: string;
+}
+export declare function PaymentIcon({ type }: PaymentIconProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/build/components/PaymentSourceFilter/PaymentIcon.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import Box from '@mui/material/Box';
+import { getPaymentMethodsIcon } from '../../constants/index.js';
+import { PaymentChip } from './style';
+export function PaymentIcon({ type }) {
+    return (_jsx(PaymentChip, { children: _jsx(Box, { component: "img", src: getPaymentMethodsIcon(type), sx: { width: 18, height: 12, objectFit: 'contain' }, onError: (e) => {
+                e.currentTarget.src = getPaymentMethodsIcon('card');
+            } }) }));
+}

package/build/components/PaymentSourceFilter/PaymentMethod.js

@@ -14,6 +14,7 @@ import { useState, useCallback, useMemo } from 'react';
 import { Menu } from '../index.js';
 import { rightArrow } from '../../constants/index.js';
 import { MenuItemStyled } from './style';
+import { PaymentIcon } from './PaymentIcon';
 export default function PaymentMethod({ icon, name, options = [], filters, setFilters }) {
     var _a;
     const [anchorEl, setAnchorEl] = useState(null);
@@ -50,5 +51,5 @@ export default function PaymentMethod({ icon, name, options = [], filters, setFi
             setFilters(Object.assign(Object.assign({}, filters), { payment_methods: [...(paymentMethods !== null && paymentMethods !== void 0 ? paymentMethods : []), selectedPaymentMethod] }));
         }
     };
-    return (_jsxs(MenuItemStyled, Object.assign({ isSelected: isSelected, isIndeterminate: isIndeterminate, onMouseEnter: onOpen, onMouseLeave: onClose, onClick: onClick }, { children: [_jsx("img", { src: icon, alt: name }), _jsx("span", Object.assign({ className: "label" }, { children: name })), _jsx("img", { src: rightArrow, alt: "arrow", style: { height: 12 } }), _jsx(Menu, Object.assign({ open: Boolean(anchorEl), anchorEl: anchorEl, placement: "right-end" }, { children: options === null || options === void 0 ? void 0 : options.map((option) => (_jsx(MenuItemStyled, Object.assign({ isSelected: isSelectedPaymentMethod(option.type), onClick: (e) => onClickPaymentMethod(e, option.type) }, { children: _jsx("img", { src: option.icon, alt: option === null || option === void 0 ? void 0 : option.name, style: { height: 24, width: 36, objectFit: 'contain' } }) }), option.type))) }))] })));
+    return (_jsxs(MenuItemStyled, Object.assign({ isSelected: isSelected, isIndeterminate: isIndeterminate, onMouseEnter: onOpen, onMouseLeave: onClose, onClick: onClick }, { children: [_jsx("img", { src: icon, alt: name }), _jsx("span", Object.assign({ className: "label" }, { children: name })), _jsx("img", { src: rightArrow, alt: "arrow", style: { height: 12 } }), _jsx(Menu, Object.assign({ open: Boolean(anchorEl), anchorEl: anchorEl, placement: "right-end" }, { children: options === null || options === void 0 ? void 0 : options.map((option) => (_jsx(MenuItemStyled, Object.assign({ isSelected: isSelectedPaymentMethod(option.type), onClick: (e) => onClickPaymentMethod(e, option.type) }, { children: _jsx(PaymentIcon, { type: option.type }) }), option.type))) }))] })));
 }

package/build/components/PaymentSourceFilter/PaymentSchemes.js

@@ -14,6 +14,7 @@ import { useCallback, useMemo, useState } from 'react';
 import { Menu } from '../index.js';
 import { rightArrow } from '../../constants/index.js';
 import { MenuItemStyled } from './style';
+import { PaymentIcon } from './PaymentIcon';
 export default function PaymentSchemes({ paymentSchemesSource, filters, setFilters }) {
     var _a, _b, _c, _d;
     const [anchorEl, setAnchorEl] = useState(null);
@@ -49,5 +50,5 @@ export default function PaymentSchemes({ paymentSchemesSource, filters, setFilte
             setFilters(Object.assign(Object.assign({}, filters), { payment_scheme: [...((_b = filters === null || filters === void 0 ? void 0 : filters.payment_scheme) !== null && _b !== void 0 ? _b : []), selectedPaymentScheme] }));
         }
     };
-    return (_jsxs(MenuItemStyled, Object.assign({ isSelected: isSelected, isIndeterminate: isIndeterminate, onMouseEnter: onOpen, onMouseLeave: onClose, onClick: onClick, sx: Object.assign({}, (isDisabled && { opacity: 0.5, pointerEvents: 'none' })) }, { children: [_jsx("span", Object.assign({ className: "label" }, { children: paymentSchemesSource === null || paymentSchemesSource === void 0 ? void 0 : paymentSchemesSource.name })), _jsx("img", { src: rightArrow, alt: "arrow", style: { height: 12 } }), _jsx(Menu, Object.assign({ open: Boolean(anchorEl), anchorEl: anchorEl, placement: "right-start" }, { children: (_d = paymentSchemesSource === null || paymentSchemesSource === void 0 ? void 0 : paymentSchemesSource.options) === null || _d === void 0 ? void 0 : _d.map((scheme) => (_jsx(MenuItemStyled, Object.assign({ isSelected: isSelectedPaymentScheme(scheme.type), onClick: (e) => onClickPaymentScheme(e, scheme.type) }, { children: _jsx("img", { src: scheme.icon, alt: scheme === null || scheme === void 0 ? void 0 : scheme.name, style: { height: 24 } }) }), scheme.type))) }))] })));
+    return (_jsxs(MenuItemStyled, Object.assign({ isSelected: isSelected, isIndeterminate: isIndeterminate, onMouseEnter: onOpen, onMouseLeave: onClose, onClick: onClick, sx: Object.assign({}, (isDisabled && { opacity: 0.5, pointerEvents: 'none' })) }, { children: [_jsx("span", Object.assign({ className: "label" }, { children: paymentSchemesSource === null || paymentSchemesSource === void 0 ? void 0 : paymentSchemesSource.name })), _jsx("img", { src: rightArrow, alt: "arrow", style: { height: 12 } }), _jsx(Menu, Object.assign({ open: Boolean(anchorEl), anchorEl: anchorEl, placement: "right-start" }, { children: (_d = paymentSchemesSource === null || paymentSchemesSource === void 0 ? void 0 : paymentSchemesSource.options) === null || _d === void 0 ? void 0 : _d.map((scheme) => (_jsx(MenuItemStyled, Object.assign({ isSelected: isSelectedPaymentScheme(scheme.type), onClick: (e) => onClickPaymentScheme(e, scheme.type) }, { children: _jsx(PaymentIcon, { type: scheme.type }) }), scheme.type))) }))] })));
 }

package/build/components/PaymentSourceFilter/style.d.ts

@@ -1 +1,5 @@
+/// <reference types="react" />
 export declare const MenuItemStyled: import("@emotion/styled").StyledComponent<import("../MenuItem/MenuItem").MenuItemProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+export declare const PaymentChip: 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>, {}, {}>;

package/build/components/PaymentSourceFilter/style.js

@@ -1,4 +1,5 @@
 import { styled } from '@mui/material/styles';
+import Box from '@mui/material/Box';
 import { MenuItem } from '../index.js';
 export const MenuItemStyled = styled(MenuItem)(({ theme }) => ({
     height: 40,
@@ -10,3 +11,12 @@ export const MenuItemStyled = styled(MenuItem)(({ theme }) => ({
         flexGrow: 1,
     },
 }));
+export const PaymentChip = styled(Box)(({ theme }) => ({
+    width: 36,
+    height: 24,
+    border: `1px solid ${theme.palette.divider}`,
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    borderRadius: '12px',
+}));

package/build/types/segment.d.ts

@@ -8,8 +8,14 @@ export declare enum SEGMENT_CODE {
     BUSINESS = "BUSINESS",
     PLATFORM = "PLATFORM",
     DEVELOPMENT = "DEVELOPMENT",
+    PSP = "PSP",
     PAYMENT_TECHNOLOGY = "PAYMENT_TECHNOLOGY",
     PAYMENT_FACILITATOR = "PAYMENT_FACILITATOR",
     PAYMENT_ACQUIRER = "PAYMENT_ACQUIRER",
-    PAYMENT_GATEWAY = "PAYMENT_GATEWAY"
+    PAYMENT_GATEWAY = "PAYMENT_GATEWAY",
+    BILLING_PLATFORM = "BILLING_PLATFORM",
+    COMMERCE_PLATFORM = "COMMERCE_PLATFORM",
+    DEVELOPMENT_HOUSE = "DEVELOPMENT_HOUSE",
+    PAYMENT_GATEWAY_PROVIDER = "PAYMENT_GATEWAY_PROVIDER",
+    RETAIL_PLATFORM = "RETAIL_PLATFORM"
 }

package/build/types/segment.js

@@ -3,8 +3,14 @@ export var SEGMENT_CODE;
     SEGMENT_CODE["BUSINESS"] = "BUSINESS";
     SEGMENT_CODE["PLATFORM"] = "PLATFORM";
     SEGMENT_CODE["DEVELOPMENT"] = "DEVELOPMENT";
+    SEGMENT_CODE["PSP"] = "PSP";
     SEGMENT_CODE["PAYMENT_TECHNOLOGY"] = "PAYMENT_TECHNOLOGY";
     SEGMENT_CODE["PAYMENT_FACILITATOR"] = "PAYMENT_FACILITATOR";
     SEGMENT_CODE["PAYMENT_ACQUIRER"] = "PAYMENT_ACQUIRER";
     SEGMENT_CODE["PAYMENT_GATEWAY"] = "PAYMENT_GATEWAY";
+    SEGMENT_CODE["BILLING_PLATFORM"] = "BILLING_PLATFORM";
+    SEGMENT_CODE["COMMERCE_PLATFORM"] = "COMMERCE_PLATFORM";
+    SEGMENT_CODE["DEVELOPMENT_HOUSE"] = "DEVELOPMENT_HOUSE";
+    SEGMENT_CODE["PAYMENT_GATEWAY_PROVIDER"] = "PAYMENT_GATEWAY_PROVIDER";
+    SEGMENT_CODE["RETAIL_PLATFORM"] = "RETAIL_PLATFORM";
 })(SEGMENT_CODE || (SEGMENT_CODE = {}));

package/build/utils/merchantSource.d.ts

@@ -16,7 +16,6 @@ export declare function transformPaymentMethodsData(data?: PaymentMethod[]): {
         options: {
             name: string | undefined;
             type: string;
-            icon: string;
         }[];
     }[] | undefined;
 };
@@ -26,7 +25,6 @@ export declare function transformPaymentSchemesData(data?: Source[]): {
     options: {
         name: string | undefined;
         type: string;
-        icon: string;
     }[];
 };
 export {};

package/build/utils/merchantSource.js

@@ -1,20 +1,19 @@
 import capitalize from 'lodash/capitalize';
-import { lightUrl, PAYMENT_TYPES_ICONS } from '../constants/index.js';
+import { PAYMENT_TYPES_ICONS } from '../constants/index.js';
 import { getNameText } from './language';
 export function transformPaymentMethodsData(data) {
     return {
         name: 'Payment Methods',
         type: 'payment_methods',
         options: data === null || data === void 0 ? void 0 : data.map((category) => {
-            var _a;
+            var _a, _b;
             return {
                 name: capitalize(getNameText(category === null || category === void 0 ? void 0 : category.name)),
                 type: category === null || category === void 0 ? void 0 : category.code,
-                icon: PAYMENT_TYPES_ICONS[category.code],
-                options: (_a = category.payment_methods) === null || _a === void 0 ? void 0 : _a.map((method) => ({
+                icon: (_a = PAYMENT_TYPES_ICONS[category.code]) !== null && _a !== void 0 ? _a : PAYMENT_TYPES_ICONS.CARD,
+                options: (_b = category.payment_methods) === null || _b === void 0 ? void 0 : _b.map((method) => ({
                     name: getNameText(method.name),
                     type: method.code,
-                    icon: `${lightUrl}/payment-method/${method.code}.svg`,
                 })),
             };
         }),
@@ -30,7 +29,6 @@ export function transformPaymentSchemesData(data = []) {
             return {
                 name: getNameText(scheme === null || scheme === void 0 ? void 0 : scheme.name),
                 type: scheme === null || scheme === void 0 ? void 0 : scheme.code,
-                icon: `${lightUrl}/payment-method/${scheme.code}.svg`,
             };
         }),
     };

package/build/utils/segment.d.ts

@@ -1,2 +1,66 @@
 import { Segment, SegmentData } from '../types/index.js';
 export declare const getSegmentData: (segments: Segment[], activeSegmentId: string, activeSegments: Segment[]) => SegmentData;
+export declare const getBusinessSegmentConfig: (merchantsIds: string[]) => {
+    business?: undefined;
+} | {
+    business: {
+        merchant: string[];
+    };
+};
+export declare const getNonBusinessSegmentConfig: ({ segmentCode, segmentId, segmentTypeCode, }: {
+    segmentCode: string;
+    segmentTypeCode: string;
+    segmentId: string;
+}) => {
+    payment_provider: {
+        technology: {
+            orchestrator: string[];
+            gateway?: undefined;
+        };
+        institution?: undefined;
+    };
+    platform?: undefined;
+    development_agency?: undefined;
+} | {
+    payment_provider: {
+        technology: {
+            gateway: string[];
+            orchestrator?: undefined;
+        };
+        institution?: undefined;
+    };
+    platform?: undefined;
+    development_agency?: undefined;
+} | {
+    payment_provider: {
+        institution: {
+            facilitator: string[];
+            acquirer?: undefined;
+        };
+        technology?: undefined;
+    };
+    platform?: undefined;
+    development_agency?: undefined;
+} | {
+    payment_provider: {
+        institution: {
+            acquirer: string[];
+            facilitator?: undefined;
+        };
+        technology?: undefined;
+    };
+    platform?: undefined;
+    development_agency?: undefined;
+} | {
+    platform: string[];
+    payment_provider?: undefined;
+    development_agency?: undefined;
+} | {
+    development_agency: string[];
+    payment_provider?: undefined;
+    platform?: undefined;
+} | {
+    payment_provider?: undefined;
+    platform?: undefined;
+    development_agency?: undefined;
+};

package/build/utils/segment.js

@@ -1,7 +1,7 @@
+import { SEGMENT_CODE } from '../types/index.js';
 import { getDefaultEntityCountry } from './entity';
 export const getSegmentData = (segments, activeSegmentId, activeSegments) => {
     var _a, _b, _c;
-    // debugger
     const newSegment = (_a = segments.find((segment) => segment.id === activeSegmentId)) !== null && _a !== void 0 ? _a : {};
     const activeSegment = (_b = activeSegments.find((segment) => segment.id === activeSegmentId)) !== null && _b !== void 0 ? _b : {};
     const defaultCountry = activeSegment.countries.length === 1
@@ -11,3 +11,54 @@ export const getSegmentData = (segments, activeSegmentId, activeSegments) => {
     return Object.assign(Object.assign({}, newSegment), { defaultCountry,
         defaultEntity });
 };
+export const getBusinessSegmentConfig = (merchantsIds) => {
+    if (!merchantsIds || !(merchantsIds === null || merchantsIds === void 0 ? void 0 : merchantsIds.length))
+        return {};
+    return { business: { merchant: merchantsIds } };
+};
+export const getNonBusinessSegmentConfig = ({ segmentCode, segmentId, segmentTypeCode, }) => {
+    const code = SEGMENT_CODE.PSP === segmentTypeCode ? segmentCode : segmentTypeCode;
+    if (code === SEGMENT_CODE.PAYMENT_TECHNOLOGY) {
+        return {
+            payment_provider: {
+                technology: {
+                    orchestrator: [segmentId],
+                },
+            },
+        };
+    }
+    if (code === SEGMENT_CODE.PAYMENT_GATEWAY || code === SEGMENT_CODE.PAYMENT_GATEWAY_PROVIDER) {
+        return {
+            payment_provider: {
+                technology: {
+                    gateway: [segmentId],
+                },
+            },
+        };
+    }
+    if (code === SEGMENT_CODE.PAYMENT_FACILITATOR) {
+        return {
+            payment_provider: {
+                institution: {
+                    facilitator: [segmentId],
+                },
+            },
+        };
+    }
+    if (code === SEGMENT_CODE.PAYMENT_ACQUIRER) {
+        return {
+            payment_provider: {
+                institution: {
+                    acquirer: [segmentId],
+                },
+            },
+        };
+    }
+    if (code === SEGMENT_CODE.PLATFORM) {
+        return { platform: [segmentId] };
+    }
+    if (code === SEGMENT_CODE.DEVELOPMENT) {
+        return { development_agency: [segmentId] };
+    }
+    return {};
+};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tap-payments/os-micro-frontend-shared",
   "description": "Shared components and utilities for Tap Payments micro frontends",
-  "version": "0.1.329",
+  "version": "0.1.330",
   "testVersion": 0,
   "type": "module",
   "main": "build/index.js",