@tap-payments/os-micro-frontend-shared 0.0.259 → 0.0.260-test.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -19,12 +19,12 @@ import { ChevronContainer, Label, LabelWrapper, StyledStatusIcon, StyledDropdown
19
19
  import { statusButtonIcons } from './constant';
20
20
  const StatusButton = memo((props) => {
21
21
  var _a;
22
- const { variant = 'inActive', badgeCount, icon, label, dropdownOptions, onButtonBodyClick, defaultSelectedStatus } = props, restProps = __rest(props, ["variant", "badgeCount", "icon", "label", "dropdownOptions", "onButtonBodyClick", "defaultSelectedStatus"]);
22
+ const { variant = 'inActive', badgeCount, icon, label, dropdownOptions, onButtonBodyClick } = props, restProps = __rest(props, ["variant", "badgeCount", "icon", "label", "dropdownOptions", "onButtonBodyClick"]);
23
23
  const [buttonClicks, setButtonClicks] = useState(0);
24
24
  const { t } = useTranslation();
25
25
  const buttonRef = useRef(null);
26
26
  const [anchorEl, setAnchorEl] = useState(null);
27
- const [selectedStatus, setSelectedStatus] = useState(defaultSelectedStatus !== null && defaultSelectedStatus !== void 0 ? defaultSelectedStatus : (_a = dropdownOptions === null || dropdownOptions === void 0 ? void 0 : dropdownOptions[0]) === null || _a === void 0 ? void 0 : _a.status);
27
+ const [selectedStatus, setSelectedStatus] = useState((_a = dropdownOptions === null || dropdownOptions === void 0 ? void 0 : dropdownOptions[0]) === null || _a === void 0 ? void 0 : _a.status);
28
28
  const hasDropdown = useMemo(() => Boolean(dropdownOptions === null || dropdownOptions === void 0 ? void 0 : dropdownOptions.length), [dropdownOptions]);
29
29
  const isDropdownOpen = Boolean(anchorEl) && buttonClicks > 1;
30
30
  const isActiveVariant = variant === 'active';
@@ -66,8 +66,9 @@ const StatusButton = memo((props) => {
66
66
  }, [handleDropdownClose]);
67
67
  const menuItems = useMemo(() => (dropdownOptions === null || dropdownOptions === void 0 ? void 0 : dropdownOptions.map((item) => (Object.assign(Object.assign({}, item), { onClick: handleMenuItemClick(item) })))) || [], [dropdownOptions, handleMenuItemClick]);
68
68
  const ButtonComponent = statusButtonVariants[variant];
69
+ const displayLabel = selectedStatus ? t(selectedStatus) : label;
69
70
  return (_jsxs(_Fragment, { children: [_jsx(ButtonComponent, Object.assign({ "data-testid": "StatusButton" }, restProps, { ref: buttonRef, onClick: handleButtonClick, sx: Object.assign({}, (hasDropdown && {
70
71
  paddingInlineEnd: '27px',
71
- })) }, { children: _jsxs(LabelWrapper, { children: [_jsxs(Label, Object.assign({ variant: variant }, { children: [statusIcon, selectedStatus ? t(selectedStatus) : label, statusBadge] })), dropdownIcon && _jsx(ChevronContainer, { children: dropdownIcon })] }) })), isDropdownOpen && hasDropdown && (_jsx(StyledDropdown, { open: isDropdownOpen, onClose: handleDropdownClose, anchorEl: anchorEl, menuItems: menuItems }))] }));
72
+ })) }, { children: _jsxs(LabelWrapper, { children: [_jsxs(Label, Object.assign({ variant: variant }, { children: [statusIcon, displayLabel, statusBadge] })), dropdownIcon && _jsx(ChevronContainer, { children: dropdownIcon })] }) })), isDropdownOpen && hasDropdown && (_jsx(StyledDropdown, { open: isDropdownOpen, onClose: handleDropdownClose, anchorEl: anchorEl, menuItems: menuItems }))] }));
72
73
  });
73
74
  export default StatusButton;
@@ -13,7 +13,6 @@ export interface StatusButtonProps extends Omit<ButtonProps, 'variant' | 'childr
13
13
  showDropdownIcon?: boolean;
14
14
  totalCount?: number;
15
15
  onButtonBodyClick?: (status: TableHeaderStatus) => void;
16
- defaultSelectedStatus?: TableHeaderStatus;
17
16
  dropdownOptions?: Array<MenuItemI & {
18
17
  status: TableHeaderStatus;
19
18
  }>;
@@ -25,14 +25,15 @@ function SegmentsCell(_a) {
25
25
  const segments = useMemo(() => Object.keys(segmentsIcons).filter((key) => !!props[key]), [props]);
26
26
  const ReferenceSources = useMemo(() => segments.map((segment, index) => {
27
27
  const prefixKey = ['technology', 'institution'].includes(segment) ? 'Payment' : '';
28
- const sourceTooltip = `${prefixKey} ${startCase(segment)} - ${props[segment]}`;
28
+ const segmentData = props[segment];
29
+ const sourceTooltip = `${prefixKey} ${startCase(segment)} - ${segmentData === null || segmentData === void 0 ? void 0 : segmentData.name}`;
29
30
  return (_jsx(Tooltip, Object.assign({ onOpen: () => {
30
31
  setIsTooltipOpen(true);
31
32
  }, onClose: () => {
32
33
  setIsTooltipOpen(false);
33
34
  }, title: sourceTooltip }, { children: _jsx(ImageWrapper, Object.assign({ order: index, variants: referenceSourceAnimation(index, theme.shadows[4], isTextShown ? 83 : 0), sx: {
34
35
  width: isTextShown ? '79px' : '24px',
35
- } }, { children: isTextShown ? (_jsx(ReferenceTextWrapper, { children: _jsx(ReferenceTextLabel, { children: startCase(segment) }) })) : (_jsx(StyledSourceImage, { src: segmentsIcons[segment], alt: segment, sx: Object.assign({}, (segment === 'order' && { width: '11.82px' })) })) })) }), `${segment}-${index}`));
36
+ } }, { children: isTextShown ? (_jsx(ReferenceTextWrapper, { children: _jsx(ReferenceTextLabel, { children: startCase(segment) }) })) : (_jsx(StyledSourceImage, { src: (segmentData === null || segmentData === void 0 ? void 0 : segmentData.icon) || segmentsIcons[segment], alt: segment, sx: Object.assign({}, (segment === 'order' && { width: '11.82px' })) })) })) }), `${segment}-${index}`));
36
37
  }), [props, segments, isTextShown, theme]);
37
38
  const referenceSourcesCount = (ReferenceSources === null || ReferenceSources === void 0 ? void 0 : ReferenceSources.length) || 0;
38
39
  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: {
@@ -1,11 +1,15 @@
1
1
  import { TableCellProps } from '@mui/material/TableCell';
2
2
  import { segmentsIcons } from './constant';
3
3
  export type SegmentsType = keyof typeof segmentsIcons;
4
+ export interface SegmentInfo {
5
+ name?: string;
6
+ icon?: string;
7
+ }
4
8
  export interface SegmentsCellProps extends TableCellProps {
5
- technology?: string;
6
- institution?: string;
7
- payment?: string;
8
- developmentHouse?: string;
9
- platform?: string;
9
+ technology?: SegmentInfo;
10
+ institution?: SegmentInfo;
11
+ payment?: SegmentInfo;
12
+ developmentHouse?: SegmentInfo;
13
+ platform?: SegmentInfo;
10
14
  isTextShown?: boolean;
11
15
  }
@@ -68,6 +68,7 @@ export interface BusinessMerchant {
68
68
  platforms: Array<{
69
69
  id: string;
70
70
  brand: {
71
+ logo?: string;
71
72
  name: Array<{
72
73
  lang: string;
73
74
  text: string;
package/package.json CHANGED
@@ -1,8 +1,8 @@
1
1
  {
2
2
  "name": "@tap-payments/os-micro-frontend-shared",
3
3
  "description": "Shared components and utilities for Tap Payments micro frontends",
4
- "version": "0.0.259",
5
- "testVersion": 2,
4
+ "version": "0.0.260-test.5",
5
+ "testVersion": 5,
6
6
  "type": "module",
7
7
  "main": "build/index.js",
8
8
  "module": "build/index.js",
@@ -131,4 +131,4 @@
131
131
  "publishConfig": {
132
132
  "registry": "https://registry.npmjs.org/"
133
133
  }
134
- }
134
+ }