@tap-payments/os-micro-frontend-shared 0.0.134 → 0.0.136

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.
Files changed (3) hide show
  1. package/build/components/StatusButton/StatusButton.js +12 -5
  2. package/build/components/TableHeader_V2/components/StatusButtons/StatusButton.js +10 -6
  3. package/package.json +1 -1
package/build/components/StatusButton/StatusButton.js CHANGED
@@ -10,7 +10,7 @@ var __rest = (this && this.__rest) || function (s, e) {
10
10
  return t;
11
11
  };
12
12
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
13
- import { memo, useState } from 'react';
13
+ import { memo, useRef, useState } from 'react';
14
14
  import { useTranslation } from 'react-i18next';
15
15
  import StyledBadge, { BadgeVariants } from '../CountBadge';
16
16
  import { convertToNumber, formatNumber } from '../../utils/index.js';
@@ -21,6 +21,7 @@ function StatusButton(_a) {
21
21
  var _b, _c;
22
22
  var { variant = 'inActive', badgeCount, icon, label, dropdownOptions, onButtonBodyClick, showDropdownIcon } = _a, props = __rest(_a, ["variant", "badgeCount", "icon", "label", "dropdownOptions", "onButtonBodyClick", "showDropdownIcon"]);
23
23
  const [anchorEl, setAnchorEl] = useState(null);
24
+ const buttonRef = useRef(null);
24
25
  const [lastActiveStatus, setLastActiveStatus] = useState((_b = dropdownOptions === null || dropdownOptions === void 0 ? void 0 : dropdownOptions[0]) === null || _b === void 0 ? void 0 : _b.status);
25
26
  const { t } = useTranslation();
26
27
  const open = Boolean(anchorEl);
@@ -34,14 +35,20 @@ function StatusButton(_a) {
34
35
  const dropdownIcon = hasDropdown ? _jsx(ChevronIcon, { isActive: variant === 'active' }) : null;
35
36
  return (_jsxs(_Fragment, { children: [_jsx(Button, Object.assign({ "data-testid": "StatusButton" }, props, { onClick: (e) => {
36
37
  var _a, _b;
37
- if (hasDropdown) {
38
- setAnchorEl(e.currentTarget);
39
- }
40
38
  (_a = props === null || props === void 0 ? void 0 : props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
41
39
  onButtonBodyClick === null || onButtonBodyClick === void 0 ? void 0 : onButtonBodyClick(lastActiveStatus || ((_b = dropdownOptions === null || dropdownOptions === void 0 ? void 0 : dropdownOptions[0]) === null || _b === void 0 ? void 0 : _b.status) || 'all');
42
40
  }, sx: Object.assign({}, (hasDropdown && {
43
41
  paddingInlineEnd: '27px',
44
- })) }, { children: _jsxs(LabelWrapper, { children: [_jsxs(Label, Object.assign({ variant: variant }, { children: [statusIcon, lastActiveStatus ? t(lastActiveStatus) : label, statusBadge] })), dropdownIcon && _jsx(ChevronContainer, { children: dropdownIcon })] }) })), open && !showDropdownIcon && (_jsx(StyledDropdown, { open: open, onClose: handleClose, anchorEl: anchorEl, menuItems: (_c = (dropdownOptions || [])) === null || _c === void 0 ? void 0 : _c.map((item) => (Object.assign(Object.assign({}, item), { onClick: (e) => {
42
+ })) }, { children: _jsxs(LabelWrapper, Object.assign({ onClick: (e) => {
43
+ if (showDropdownIcon) {
44
+ return;
45
+ }
46
+ e.stopPropagation();
47
+ e.preventDefault();
48
+ if (hasDropdown) {
49
+ setAnchorEl(buttonRef.current);
50
+ }
51
+ } }, { children: [_jsxs(Label, Object.assign({ variant: variant }, { children: [statusIcon, lastActiveStatus ? t(lastActiveStatus) : label, statusBadge] })), dropdownIcon && _jsx(ChevronContainer, { children: dropdownIcon })] })) })), open && !showDropdownIcon && (_jsx(StyledDropdown, { open: open, onClose: handleClose, anchorEl: anchorEl, menuItems: (_c = (dropdownOptions || [])) === null || _c === void 0 ? void 0 : _c.map((item) => (Object.assign(Object.assign({}, item), { onClick: (e) => {
45
52
  var _a;
46
53
  (_a = item === null || item === void 0 ? void 0 : item.onClick) === null || _a === void 0 ? void 0 : _a.call(item, e);
47
54
  setLastActiveStatus(item.status);
package/build/components/TableHeader_V2/components/StatusButtons/StatusButton.js CHANGED
@@ -10,7 +10,7 @@ var __rest = (this && this.__rest) || function (s, e) {
10
10
  return t;
11
11
  };
12
12
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
13
- import { memo, useState } from 'react';
13
+ import { memo, useRef, useState } from 'react';
14
14
  import { useTranslation } from 'react-i18next';
15
15
  import StyledBadge, { BadgeVariants } from '../../../CountBadge';
16
16
  import { convertToNumber, formatNumber } from '../../../../utils/index.js';
@@ -21,6 +21,7 @@ export const StatusButton = memo((props) => {
21
21
  var _a, _b;
22
22
  const { variant = 'inActive', badgeCount, icon, label, dropdownOptions, onButtonBodyClick } = props, restProps = __rest(props, ["variant", "badgeCount", "icon", "label", "dropdownOptions", "onButtonBodyClick"]);
23
23
  const [anchorEl, setAnchorEl] = useState(null);
24
+ const buttonRef = useRef(null);
24
25
  const [lastActiveStatus, setLastActiveStatus] = useState((_a = dropdownOptions === null || dropdownOptions === void 0 ? void 0 : dropdownOptions[0]) === null || _a === void 0 ? void 0 : _a.status);
25
26
  const { t } = useTranslation();
26
27
  const open = Boolean(anchorEl);
@@ -32,16 +33,19 @@ export const StatusButton = memo((props) => {
32
33
  const statusIcon = icon ? _jsx(StyledStatusIcon, { icon: icon, variant: variant, src: statusButtonIcons[icon], alt: `${icon}-icon` }) : null;
33
34
  const statusBadge = badgeCount && !Number.isNaN(convertToNumber(badgeCount)) ? (_jsx(StyledBadge, Object.assign({ variant: variant === 'active' ? BadgeVariants.ACTIVE : BadgeVariants.INACTIVE }, { children: formatNumber(Number(badgeCount)) }))) : null;
34
35
  const dropdownIcon = hasDropdown ? _jsx(ChevronIcon, { isActive: variant === 'active' }) : null;
35
- return (_jsxs(_Fragment, { children: [_jsx(Button, Object.assign({ "data-testid": "StatusButton" }, restProps, { onClick: (e) => {
36
+ return (_jsxs(_Fragment, { children: [_jsx(Button, Object.assign({ "data-testid": "StatusButton" }, restProps, { ref: buttonRef, onClick: (e) => {
36
37
  var _a, _b;
37
- if (hasDropdown) {
38
- setAnchorEl(e.currentTarget);
39
- }
40
38
  (_a = props === null || props === void 0 ? void 0 : props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
41
39
  onButtonBodyClick === null || onButtonBodyClick === void 0 ? void 0 : onButtonBodyClick(lastActiveStatus || ((_b = dropdownOptions === null || dropdownOptions === void 0 ? void 0 : dropdownOptions[0]) === null || _b === void 0 ? void 0 : _b.status) || 'all');
42
40
  }, sx: Object.assign({}, (hasDropdown && {
43
41
  paddingInlineEnd: '27px',
44
- })) }, { children: _jsxs(LabelWrapper, { children: [_jsxs(Label, Object.assign({ variant: variant }, { children: [statusIcon, lastActiveStatus ? t(lastActiveStatus) : label, statusBadge] })), dropdownIcon && _jsx(ChevronContainer, { children: dropdownIcon })] }) })), open && (_jsx(StyledDropdown, { open: open, onClose: handleClose, anchorEl: anchorEl, menuItems: (_b = (dropdownOptions || [])) === null || _b === void 0 ? void 0 : _b.map((item) => (Object.assign(Object.assign({}, item), { onClick: (e) => {
42
+ })) }, { children: _jsxs(LabelWrapper, Object.assign({ onClick: (e) => {
43
+ e.stopPropagation();
44
+ e.preventDefault();
45
+ if (hasDropdown) {
46
+ setAnchorEl(buttonRef.current);
47
+ }
48
+ } }, { children: [_jsxs(Label, Object.assign({ variant: variant }, { children: [statusIcon, lastActiveStatus ? t(lastActiveStatus) : label, statusBadge] })), dropdownIcon && _jsx(ChevronContainer, { children: dropdownIcon })] })) })), open && (_jsx(StyledDropdown, { open: open, onClose: handleClose, anchorEl: anchorEl, menuItems: (_b = (dropdownOptions || [])) === null || _b === void 0 ? void 0 : _b.map((item) => (Object.assign(Object.assign({}, item), { onClick: (e) => {
45
49
  var _a;
46
50
  (_a = item === null || item === void 0 ? void 0 : item.onClick) === null || _a === void 0 ? void 0 : _a.call(item, e);
47
51
  setLastActiveStatus(item.status);
package/package.json CHANGED
@@ -1,7 +1,7 @@
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.134",
4
+ "version": "0.0.136",
5
5
  "type": "module",
6
6
  "main": "build/index.js",
7
7
  "module": "build/index.js",