@tap-payments/os-micro-frontend-shared 0.1.122-test.7 → 0.1.123-test.1

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/InputBase/PhoneInputBase/CountriesList/CountriesList.js

@@ -5,6 +5,7 @@ import Skeleton from '@mui/material/Skeleton';
 import CustomBackdrop from '../../../CustomBackdrop';
 import { downArrowIcon, searchIcon } from '../../../../constants/index.js';
 import { CountryStyled, CountriesWrapper, CountriesListStyled, InputStyled, CountryButton, Required } from './style';
+import { ClickAwayListener } from '@mui/material';
 function CountriesList({ isLoading, countries, value: countryValue, onCountryChange, required, disabled }) {
     const [selectedCountry, setSelectedCountry] = useState();
     const [anchorEl, setAnchorEl] = useState(null);
@@ -50,15 +51,15 @@ function CountriesList({ isLoading, countries, value: countryValue, onCountryCha
                     border: 'none',
                     height: 34,
                     paddingInlineStart: '8px',
-                } }, { children: isLoading ? (_jsx(Skeleton, { variant: "rectangular", width: 56.5, height: 20, sx: { borderRadius: '4px' } })) : (_jsxs(_Fragment, { children: [selectedCountry && (_jsxs(_Fragment, { children: [_jsx("img", { src: selectedCountry.logo, alt: "c", className: "logo" }), _jsx("span", { children: `+${selectedCountry === null || selectedCountry === void 0 ? void 0 : selectedCountry.idd_prefix}` })] })), required && _jsx(Required, Object.assign({ component: "span" }, { children: "*" })), _jsx(Box, { component: "img", src: downArrowIcon, alt: "d", className: "arrow", sx: Object.assign({}, (open && { transform: 'rotate(180deg)' })) })] })) })), open && _jsx(CustomBackdrop, { onClick: closeDropdown }), open && (_jsxs(CountriesWrapper, Object.assign({ id: "CountriesList_CountriesWrapper", open: open, anchorEl: anchorEl, "data-testid": "CountriesList_CountriesWrapper", placement: "bottom-start" }, { children: [_jsx(InputStyled, { endAdornment: _jsx("img", { src: searchIcon, alt: "arrow" }), onChange: handleSearch, hideArrows: true, "data-testid": "CountriesList_InputStyled", value: searchValue }), _jsx(CountriesListStyled, Object.assign({ "data-testid": "CountriesList_CountriesListStyled" }, { children: filteredCountries.map((country) => {
-                            const isSelected = (selectedCountry === null || selectedCountry === void 0 ? void 0 : selectedCountry.countryId) === country.countryId;
-                            return (_jsxs(CountryStyled, Object.assign({ onClick: () => {
-                                    handleOnCountryChange(country);
-                                }, sx: {
-                                    backgroundColor: isSelected ? '#F9F9F9' : 'transparent',
-                                    color: isSelected ? '#000' : '#8D8D94',
-                                } }, { children: [_jsx("img", { src: country.logo, alt: "c", className: "logo" }), _jsx("span", { children: `+${country.idd_prefix}` })] }), `country-code-${country.countryId}`));
-                        }) }))] })))] })));
+                } }, { children: isLoading ? (_jsx(Skeleton, { variant: "rectangular", width: 56.5, height: 20, sx: { borderRadius: '4px' } })) : (_jsxs(_Fragment, { children: [selectedCountry && (_jsxs(_Fragment, { children: [_jsx("img", { src: selectedCountry.logo, alt: "c", className: "logo" }), _jsx("span", { children: `+${selectedCountry === null || selectedCountry === void 0 ? void 0 : selectedCountry.idd_prefix}` })] })), required && _jsx(Required, Object.assign({ component: "span" }, { children: "*" })), _jsx(Box, { component: "img", src: downArrowIcon, alt: "d", className: "arrow", sx: Object.assign({}, (open && { transform: 'rotate(180deg)' })) })] })) })), open && _jsx(CustomBackdrop, { onClick: closeDropdown }), open && (_jsx(ClickAwayListener, Object.assign({ onClickAway: closeDropdown }, { children: _jsxs(CountriesWrapper, Object.assign({ id: "CountriesList_CountriesWrapper", open: open, anchorEl: anchorEl, "data-testid": "CountriesList_CountriesWrapper", placement: "bottom-start" }, { children: [_jsx(InputStyled, { endAdornment: _jsx("img", { src: searchIcon, alt: "arrow" }), onChange: handleSearch, hideArrows: true, "data-testid": "CountriesList_InputStyled", value: searchValue }), _jsx(CountriesListStyled, Object.assign({ "data-testid": "CountriesList_CountriesListStyled" }, { children: filteredCountries.map((country) => {
+                                const isSelected = (selectedCountry === null || selectedCountry === void 0 ? void 0 : selectedCountry.countryId) === country.countryId;
+                                return (_jsxs(CountryStyled, Object.assign({ onClick: () => {
+                                        handleOnCountryChange(country);
+                                    }, sx: {
+                                        backgroundColor: isSelected ? '#F9F9F9' : 'transparent',
+                                        color: isSelected ? '#000' : '#8D8D94',
+                                    } }, { children: [_jsx("img", { src: country.logo, alt: "c", className: "logo" }), _jsx("span", { children: `+${country.idd_prefix}` })] }), `country-code-${country.countryId}`));
+                            }) }))] })) })))] })));
 }
 CountriesList.displayName = 'CountriesList';
 export default memo(CountriesList);

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

@@ -1,2 +1,2 @@
 import { MarketPlaceCellProps } from './type';
-export default function MarketPlaceCell({ marketPlaceIcon, marketPlaceName, isTextShown, ...props }: MarketPlaceCellProps): import("react/jsx-runtime").JSX.Element;
+export default function MarketPlaceCell({ marketPlaceIcon, marketPlaceName, ...props }: MarketPlaceCellProps): import("react/jsx-runtime").JSX.Element;

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

@@ -14,10 +14,12 @@ import Tooltip from '../../../Tooltip';
 import TableCell from '../../TableCell';
 import { Box } from '@mui/material';
 import { marketPlaceBlueIcon } from '../../../../constants/index.js';
-import { TextLabel } from '../style';
 export default function MarketPlaceCell(_a) {
-    var { marketPlaceIcon, marketPlaceName, isTextShown } = _a, props = __rest(_a, ["marketPlaceIcon", "marketPlaceName", "isTextShown"]);
-    return (_jsx(TableCell, Object.assign({}, props, { children: _jsx(Tooltip, Object.assign({ title: marketPlaceName }, { children: _jsx(Box, Object.assign({ sx: { display: 'flex', alignItems: 'center', gap: 1 } }, { children: isTextShown ? (_jsx(TextLabel, { children: marketPlaceName })) : (_jsx(Box, Object.assign({ sx: {
+    var { marketPlaceIcon, marketPlaceName } = _a, props = __rest(_a, ["marketPlaceIcon", "marketPlaceName"]);
+    const logo = marketPlaceIcon !== null && marketPlaceIcon !== void 0 ? marketPlaceIcon : (_jsx("img", { src: marketPlaceBlueIcon, alt: "marketplace", style: { maxWidth: '18px', maxHeight: '18px', objectFit: 'cover' }, onError: (e) => {
+            e.currentTarget.src = marketPlaceBlueIcon;
+        } }));
+    return (_jsx(TableCell, Object.assign({}, props, { children: _jsx(Box, Object.assign({ sx: { display: 'flex', alignItems: 'center', gap: 1 } }, { children: _jsx(Tooltip, Object.assign({ title: marketPlaceName }, { children: _jsx(Box, Object.assign({ sx: {
                         width: '24px',
                         height: '24px',
                         border: '1px solid #F2F2F2',
@@ -25,5 +27,5 @@ export default function MarketPlaceCell(_a) {
                         display: 'flex',
                         alignItems: 'center',
                         justifyContent: 'center',
-                    } }, { children: _jsx("img", { src: marketPlaceIcon || marketPlaceBlueIcon, alt: "marketplace", style: { maxWidth: '18px', maxHeight: '18px', objectFit: 'cover' } }) }))) })) })) })));
+                    } }, { children: logo })) })) })) })));
 }

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

@@ -2,5 +2,4 @@ import { TableCellProps } from '@mui/material';
 export type MarketPlaceCellProps = TableCellProps & {
     marketPlaceIcon?: string;
     marketPlaceName?: string;
-    isTextShown?: boolean;
 };

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

@@ -1,3 +1,3 @@
 import type { SegmentsCellProps } from './type';
-declare function SegmentsCell({ isTextShown, ...props }: SegmentsCellProps): import("react/jsx-runtime").JSX.Element;
+declare function SegmentsCell({ isTextShown, segments, ...props }: SegmentsCellProps): import("react/jsx-runtime").JSX.Element;
 export default SegmentsCell;

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

@@ -20,25 +20,23 @@ import { segmentsIcons } from './constant';
 import { ReferenceTextLabel, ReferenceTextWrapper, ReferenceSourcesContainer, StyledSourceCell, referenceSourceAnimation } from './style';
 import IconWithBadge from '../../../IconWithBadge';
 function SegmentsCell(_a) {
-    var { isTextShown } = _a, props = __rest(_a, ["isTextShown"]);
+    var { isTextShown, segments } = _a, props = __rest(_a, ["isTextShown", "segments"]);
     const [isTooltipOpen, setIsTooltipOpen] = useState(false);
     const theme = useTheme();
-    const segments = useMemo(() => Object.keys(segmentsIcons).filter((key) => { var _a; return !!((_a = props[key]) === null || _a === void 0 ? void 0 : _a.name); }), [props]);
     const ReferenceSources = useMemo(() => segments.map((segment, index) => {
-        const prefixKey = ['technology', 'institution'].includes(segment) ? 'Payment' : '';
-        const segmentData = props[segment];
-        const sourceTooltip = `${prefixKey} ${startCase(segment)} - ${segmentData === null || segmentData === void 0 ? void 0 : segmentData.name}`;
+        const prefixKey = ['technology', 'institution'].includes(segment.type) ? 'Payment' : '';
+        const sourceTooltip = segment.tooltip || `${prefixKey} ${startCase(segment.type)} - ${segment.name}`;
         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) }) })) : (_jsx(IconWithBadge, { mainIcon: (segmentData === null || segmentData === void 0 ? void 0 : segmentData.icon) || segmentsIcons[segment], mainIconSize: segment === 'order' ? 11.82 : 16, containerSize: segment === 'order' ? 11.82 : 16, sx: Object.assign({}, ((segmentData === null || segmentData === void 0 ? void 0 : segmentData.icon) ? { borderRadius: '40px' } : { borderRadius: '0px' })), onError: (e) => {
-                        e.currentTarget.src = segmentsIcons[segment];
+                } }, { 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];
                         e.currentTarget.style.borderRadius = '0px';
-                    }, borderColor: "transparent" })) })) }), `${segment}-${index}`));
-    }), [props, segments, isTextShown, theme]);
+                    }, borderColor: "transparent" })) })) }), `${segment.name}-${index}`));
+    }), [segments, isTextShown, theme]);
     const referenceSourcesCount = (ReferenceSources === null || ReferenceSources === void 0 ? void 0 : ReferenceSources.length) || 0;
     return (_jsx(TableCell, Object.assign({}, props, { children: _jsx(StyledSourceCell, { children: referenceSourcesCount > 0 ? (_jsx(ReferenceSourcesContainer, Object.assign({ layout: true, className: "reference-sources-container", whileHover: "animate", animate: isTooltipOpen ? 'animate' : 'start', sourcesCount: referenceSourcesCount, variants: { animate: { width: referenceSourcesCount * (6 + 32) } }, style: {
                     zIndex: 29,

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

@@ -4,12 +4,10 @@ export type SegmentsType = keyof typeof segmentsIcons;
 export interface SegmentInfo {
     name?: string;
     icon?: string;
+    type: SegmentsType;
+    tooltip?: string;
 }
 export interface SegmentsCellProps extends TableCellProps {
-    technology?: SegmentInfo;
-    institution?: SegmentInfo;
-    payment?: SegmentInfo;
-    developmentHouse?: SegmentInfo;
-    platform?: SegmentInfo;
     isTextShown?: boolean;
+    segments: SegmentInfo[];
 }

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

@@ -224,4 +224,14 @@ export declare const refundTableCellWidth: {
         readonly text: "116px";
         readonly sheet: "116px";
     };
+    readonly issuer_response: {
+        readonly default: "70px";
+        readonly text: "70px";
+        readonly sheet: "270px";
+    };
+    readonly acquirer_response: {
+        readonly default: "70px";
+        readonly text: "70px";
+        readonly sheet: "225px";
+    };
 };

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

@@ -224,4 +224,14 @@ export const refundTableCellWidth = {
         text: '116px',
         sheet: '116px',
     },
+    issuer_response: {
+        default: '70px',
+        text: '70px',
+        sheet: '270px',
+    },
+    acquirer_response: {
+        default: '70px',
+        text: '70px',
+        sheet: '225px',
+    },
 };

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