@tap-payments/os-micro-frontend-shared 0.0.176 → 0.0.180

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/Button/StyledButton/StyledButton.d.ts

@@ -4,7 +4,6 @@ export interface StyledButtonProps extends BoxProps {
     title?: string;
     isActive?: boolean;
     isDisabled?: boolean;
-    hasImageFilter?: boolean;
 }
 declare function StyledButton({ children, title, ...props }: StyledButtonProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof StyledButton>;

package/build/components/Button/StyledButton/style.d.ts

@@ -2,4 +2,4 @@
 import { StyledButtonProps } from './StyledButton';
 export declare const Button: 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> & Pick<StyledButtonProps, "isDisabled" | "isActive" | "hasImageFilter">, {}, {}>;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & Pick<StyledButtonProps, "isDisabled" | "isActive">, {}, {}>;

package/build/components/Button/StyledButton/style.js

@@ -1,13 +1,11 @@
 import Box from '@mui/material/Box';
 import { styled } from '@mui/material/styles';
-export const Button = styled(Box)(({ isActive, isDisabled, hasImageFilter = true, theme }) => (Object.assign(Object.assign(Object.assign({ minWidth: 32, height: 32, width: 'fit-content', borderRadius: '4px', padding: '9px 8px', display: 'flex', alignItems: 'center', justifyContent: 'center', border: `1px solid ${theme.palette.divider}`, cursor: 'pointer' }, (isActive && {
+export const Button = styled(Box)(({ isActive, isDisabled, theme }) => (Object.assign(Object.assign(Object.assign({ minWidth: 32, height: 32, width: 'fit-content', borderRadius: '4px', padding: '9px 8px', display: 'flex', alignItems: 'center', justifyContent: 'center', border: `1px solid ${theme.palette.divider}`, cursor: 'pointer' }, (isActive && {
     boxShadow: theme.shadows[7],
     borderColor: theme.palette.info.dark,
 })), (isDisabled && {
     opacity: 0.5,
     pointerEvents: 'none',
-})), (hasImageFilter && {
-    img: {
+})), { img: {
         filter: 'brightness(0) invert(0)',
-    },
-}))));
+    } })));

package/build/components/MultiSelectStatusButton/MultiSelectStatusButton.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { memo, useState, useRef, useEffect } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Typography, Checkbox } from '@mui/material';
-import { ChevronIcon } from '../TableHeader_V2/components/StatusButtons/ChevronIcon';
+import { ChevronIcon } from '../StatusButton/ChevronIcon';
 import StyledBadge, { BadgeVariants } from '../CountBadge';
 import CountryFlag from '../CountryFlag';
 import { formatNumber } from '../../utils/index.js';

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

@@ -1,6 +1,6 @@
 import type React from 'react';
 import { type Theme } from '@mui/material';
-export { statusButtonVariants, ChevronContainer, Label, LabelWrapper, StyledDropdown, } from '../TableHeader_V2/components/StatusButtons/style';
+export { statusButtonVariants, ChevronContainer, Label, LabelWrapper, StyledDropdown } from '../StatusButton/style';
 export declare const StyledStatusButton: import("@emotion/styled").StyledComponent<import("@mui/material").ButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
     ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
 }, "disabled" | "className" | "style" | "classes" | "color" | "children" | "sx" | "tabIndex" | "size" | "variant" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "href" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "startIcon"> & import("@mui/system").MUIStyledCommonProps<Theme> & {

package/build/components/MultiSelectStatusButton/style.js

@@ -1,6 +1,6 @@
 import { Box, Button } from '@mui/material';
 import { styled } from '@mui/material/styles';
-export { statusButtonVariants, ChevronContainer, Label, LabelWrapper, StyledDropdown, } from '../TableHeader_V2/components/StatusButtons/style';
+export { statusButtonVariants, ChevronContainer, Label, LabelWrapper, StyledDropdown } from '../StatusButton/style';
 const baseButtonStyle = (theme) => (Object.assign(Object.assign({}, theme.typography.subtitle1), { borderRadius: '50px', borderWidth: '1px', borderStyle: 'solid', minWidth: '135.11px', height: '32px', display: 'flex', justifyContent: 'center', alignItems: 'center', gap: '8px', textTransform: 'none', transition: 'background-color 0.5s ease, color 0.3s ease', paddingInline: theme.spacing(2) }));
 export const StyledStatusButton = styled(Button, {
     shouldForwardProp: (prop) => prop !== 'buttonVariant',

package/build/components/StatusBar/StatusBar.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
-import { AvailableStatus } from '../TableHeader_V2';
 import { CurrencyOption } from '../MultiSelectStatusButton';
 import { TableHeaderStatus } from '../../types/index.js';
+import { AvailableStatus } from './type';
 interface StatusBarProps {
     status?: TableHeaderStatus;
     availableStatuses?: AvailableStatus[];

package/build/components/StatusBar/StatusBar.js

@@ -2,8 +2,8 @@ import { createElement as _createElement } from "react";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { memo, useCallback, useState, useEffect } from 'react';
 import { useTranslation } from 'react-i18next';
-import { StatusButton } from '../TableHeader_V2';
 import MultiSelectStatusButton from '../MultiSelectStatusButton';
+import StatusButton from '../StatusButton';
 function StatusBar({ isFilteredIdsShown, onStatusChange, availableStatuses, status, onMultiSelectChange, currencyOptions, selectedCurrencies = [], enableMultiSelectCurrency = false, }) {
     const { t } = useTranslation();
     const [multiSelectValues, setMultiSelectValues] = useState(selectedCurrencies);

package/build/components/StatusBar/type.d.ts

@@ -0,0 +1,5 @@
+import { StatusButtonProps } from '../StatusButton';
+import { TableHeaderStatus } from '../../types/index.js';
+export type AvailableStatus<T = undefined> = StatusButtonProps & {
+    status: T | TableHeaderStatus | (TableHeaderStatus | T)[];
+};

package/build/components/StatusButton/ChevronIcon.d.ts

@@ -1,2 +1,2 @@
-import type { ChevronIconProps } from './type';
-export declare function ChevronIcon({ isActive }: ChevronIconProps): import("react/jsx-runtime").JSX.Element;
+import { ChevronIconProps } from './type';
+export declare function ChevronIcon({ isActive, disableHover }: ChevronIconProps): import("react/jsx-runtime").JSX.Element;

package/build/components/StatusButton/ChevronIcon.js

@@ -1,11 +1,13 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from 'react';
 import { useTheme } from '@mui/material';
-export function ChevronIcon({ isActive }) {
+export function ChevronIcon({ isActive, disableHover }) {
     const [isHovered, setIsHovered] = useState(false);
     const theme = useTheme();
     const handleMouseEnter = () => {
-        setIsHovered(true);
+        if (!disableHover) {
+            setIsHovered(true);
+        }
     };
     const handleMouseLeave = () => {
         setIsHovered(false);

package/build/components/StatusButton/StatusButton.d.ts

@@ -1,5 +1,4 @@
 /// <reference types="react" />
-import type { StatusButtonProps } from './type';
-declare function StatusButton({ variant, badgeCount, icon, label, dropdownOptions, onButtonBodyClick, showDropdownIcon, ...props }: StatusButtonProps): import("react/jsx-runtime").JSX.Element;
-declare const _default: import("react").MemoExoticComponent<typeof StatusButton>;
-export default _default;
+import { type StatusButtonProps } from './type';
+declare const StatusButton: import("react").MemoExoticComponent<(props: StatusButtonProps) => import("react/jsx-runtime").JSX.Element>;
+export default StatusButton;

package/build/components/StatusButton/StatusButton.js

@@ -10,49 +10,65 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { memo, useRef, useState } from 'react';
+import { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import StyledBadge, { BadgeVariants } from '../CountBadge';
 import { convertToNumber, formatNumber } from '../../utils/index.js';
 import { ChevronIcon } from './ChevronIcon';
-import { ChevronContainer, Label, LabelWrapper, StatusIcon, StyledDropdown, statusButtonVariants } from './style';
+import { ChevronContainer, Label, LabelWrapper, StyledStatusIcon, StyledDropdown, statusButtonVariants } from './style';
 import { statusButtonIcons } from './constant';
-function StatusButton(_a) {
-    var _b, _c;
-    var { variant = 'inActive', badgeCount, icon, label, dropdownOptions, onButtonBodyClick, showDropdownIcon } = _a, props = __rest(_a, ["variant", "badgeCount", "icon", "label", "dropdownOptions", "onButtonBodyClick", "showDropdownIcon"]);
-    const [anchorEl, setAnchorEl] = useState(null);
-    const buttonRef = useRef(null);
-    const [lastActiveStatus, setLastActiveStatus] = useState((_b = dropdownOptions === null || dropdownOptions === void 0 ? void 0 : dropdownOptions[0]) === null || _b === void 0 ? void 0 : _b.status);
+const StatusButton = memo((props) => {
+    var _a;
+    const { variant = 'inActive', badgeCount, icon, label, dropdownOptions, onButtonBodyClick } = props, restProps = __rest(props, ["variant", "badgeCount", "icon", "label", "dropdownOptions", "onButtonBodyClick"]);
+    const [buttonClicks, setButtonClicks] = useState(0);
     const { t } = useTranslation();
-    const open = Boolean(anchorEl);
-    const handleClose = () => {
+    const buttonRef = useRef(null);
+    const [anchorEl, setAnchorEl] = useState(null);
+    const [selectedStatus, setSelectedStatus] = useState((_a = dropdownOptions === null || dropdownOptions === void 0 ? void 0 : dropdownOptions[0]) === null || _a === void 0 ? void 0 : _a.status);
+    const hasDropdown = useMemo(() => Boolean(dropdownOptions === null || dropdownOptions === void 0 ? void 0 : dropdownOptions.length), [dropdownOptions]);
+    const isDropdownOpen = Boolean(anchorEl) && buttonClicks > 1;
+    const isActiveVariant = variant === 'active';
+    const badgeVariant = useMemo(() => (isActiveVariant ? BadgeVariants.ACTIVE : BadgeVariants.INACTIVE), [isActiveVariant]);
+    const statusIcon = useMemo(() => (icon ? _jsx(StyledStatusIcon, { icon: icon, variant: variant, src: statusButtonIcons[icon], alt: `${icon}-icon` }) : null), [icon, variant]);
+    const statusBadge = useMemo(() => {
+        if (!badgeCount || Number.isNaN(convertToNumber(badgeCount)))
+            return null;
+        return _jsx(StyledBadge, Object.assign({ variant: badgeVariant }, { children: formatNumber(Number(badgeCount)) }));
+    }, [badgeCount, badgeVariant]);
+    const dropdownIcon = useMemo(() => (hasDropdown ? _jsx(ChevronIcon, { isActive: isActiveVariant }) : null), [hasDropdown, isActiveVariant]);
+    useEffect(() => {
+        if (!isActiveVariant) {
+            setButtonClicks(0);
+            setAnchorEl(null);
+        }
+    }, [isActiveVariant]);
+    const handleDropdownClose = useCallback(() => {
         setAnchorEl(null);
-    };
-    const Button = statusButtonVariants[variant];
-    const hasDropdown = (dropdownOptions && dropdownOptions.length > 0) || showDropdownIcon;
-    const statusIcon = icon ? _jsx(StatusIcon, { icon: icon, variant: variant, src: statusButtonIcons[icon], alt: `${icon}-icon` }) : null;
-    const statusBadge = badgeCount && !Number.isNaN(convertToNumber(badgeCount)) ? (_jsx(StyledBadge, Object.assign({ variant: variant === 'active' ? BadgeVariants.ACTIVE : BadgeVariants.INACTIVE }, { children: formatNumber(Number(badgeCount)) }))) : null;
-    const dropdownIcon = hasDropdown ? _jsx(ChevronIcon, { isActive: variant === 'active' }) : null;
-    return (_jsxs(_Fragment, { children: [_jsx(Button, Object.assign({ "data-testid": "StatusButton" }, props, { ref: buttonRef, onClick: (e) => {
-                    var _a, _b;
-                    (_a = props === null || props === void 0 ? void 0 : props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
-                    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');
-                }, sx: Object.assign({}, (hasDropdown && {
+    }, []);
+    const handleDropdownToggle = useCallback(() => {
+        if (!hasDropdown)
+            return;
+        setAnchorEl(isDropdownOpen ? null : buttonRef.current);
+    }, [hasDropdown, isDropdownOpen]);
+    const handleButtonClick = useCallback((e) => {
+        var _a, _b;
+        e.stopPropagation();
+        (_a = props === null || props === void 0 ? void 0 : props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
+        onButtonBodyClick === null || onButtonBodyClick === void 0 ? void 0 : onButtonBodyClick(selectedStatus || ((_b = dropdownOptions === null || dropdownOptions === void 0 ? void 0 : dropdownOptions[0]) === null || _b === void 0 ? void 0 : _b.status) || 'all');
+        handleDropdownToggle();
+        setButtonClicks((prev) => prev + 1);
+    }, [props, onButtonBodyClick, selectedStatus, dropdownOptions, handleDropdownToggle]);
+    const handleMenuItemClick = useCallback((item) => (e) => {
+        var _a;
+        (_a = item === null || item === void 0 ? void 0 : item.onClick) === null || _a === void 0 ? void 0 : _a.call(item, e);
+        setSelectedStatus(item.status);
+        handleDropdownClose();
+    }, [handleDropdownClose]);
+    const menuItems = useMemo(() => (dropdownOptions === null || dropdownOptions === void 0 ? void 0 : dropdownOptions.map((item) => (Object.assign(Object.assign({}, item), { onClick: handleMenuItemClick(item) })))) || [], [dropdownOptions, handleMenuItemClick]);
+    const ButtonComponent = statusButtonVariants[variant];
+    const displayLabel = selectedStatus ? t(selectedStatus) : label;
+    return (_jsxs(_Fragment, { children: [_jsx(ButtonComponent, Object.assign({ "data-testid": "StatusButton" }, restProps, { ref: buttonRef, onClick: handleButtonClick, sx: Object.assign({}, (hasDropdown && {
                     paddingInlineEnd: '27px',
-                })) }, { children: _jsxs(LabelWrapper, Object.assign({ onClick: (e) => {
-                        if (showDropdownIcon) {
-                            return;
-                        }
-                        e.stopPropagation();
-                        e.preventDefault();
-                        if (hasDropdown) {
-                            setAnchorEl(buttonRef.current);
-                        }
-                    } }, { 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) => {
-                        var _a;
-                        (_a = item === null || item === void 0 ? void 0 : item.onClick) === null || _a === void 0 ? void 0 : _a.call(item, e);
-                        setLastActiveStatus(item.status);
-                        handleClose();
-                    } }))) }))] }));
-}
-export default memo(StatusButton);
+                })) }, { 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 }))] }));
+});
+export default StatusButton;

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

@@ -33,3 +33,7 @@ export declare const Label: import("@emotion/styled").StyledComponent<import("@m
 export declare const LabelWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<Theme> & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
 }, keyof import("@mui/system").BoxOwnProps<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const StyledStatusIcon: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<Theme> & {
+    variant: StatusButtonVariant;
+    icon?: "initiated" | "captured" | "unCaptured" | "inProgress" | "abandoned" | "cancelled" | "reversed" | "authorized" | "paidOut" | "unauthenticated" | "authenticated" | "scheduled" | "unSettled" | "search" | "reports" | "chevronDown" | "unAuthorized" | "openFlag" | "closedFlag" | undefined;
+}, React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;

package/build/components/StatusButton/style.js

@@ -72,3 +72,10 @@ export const LabelWrapper = styled(Box)(() => ({
     justifyContent: 'center',
     width: '100%',
 }));
+export const StyledStatusIcon = styled('img')(({ theme, variant, icon }) => {
+    var _a;
+    return (Object.assign(Object.assign({ fill: variant === 'active' ? theme.palette.common.white : theme.palette.text.primary, color: variant === 'active' ? theme.palette.common.white : theme.palette.text.primary }, (!(((_a = ['openFlag', 'closedFlag']) === null || _a === void 0 ? void 0 : _a.includes(icon !== null && icon !== void 0 ? icon : '')) && variant === 'inActive') &&
+        icon !== 'captured' && {
+        filter: variant === 'active' ? 'brightness(0) invert(1)' : 'brightness(0) invert(0)',
+    })), { maxWidth: '14px', maxHeight: '14px' }));
+});

package/build/components/StatusButton/type.d.ts

@@ -19,5 +19,6 @@ export interface StatusButtonProps extends Omit<ButtonProps, 'variant' | 'childr
 }
 export interface ChevronIconProps {
     isActive?: boolean;
+    disableHover?: boolean;
 }
 export type StatusButtonIcon = keyof typeof statusButtonIcons;

package/build/components/{TableHeader_V2 → TableHeader}/index.d.ts

@@ -2,4 +2,3 @@ export { default as TableHeader } from './TableHeader';
 export * from './style';
 export * from './type';
 export { FiltersRow } from './FiltersRow';
-export * from './components';

package/build/components/{TableHeader_V2 → TableHeader}/index.js

@@ -2,4 +2,3 @@ export { default as TableHeader } from './TableHeader';
 export * from './style';
 export * from './type';
 export { FiltersRow } from './FiltersRow';
-export * from './components';

package/build/components/{TableHeader_V2 → TableHeader}/type.d.ts

@@ -1,6 +1,6 @@
 import React, { PropsWithChildren, ReactNode } from 'react';
 import type { CalenderMode, TableHeaderStatus, ColumnViewProps } from '../../types/index.js';
-import type { StatusButtonProps } from '../StatusButton/type';
+import { AvailableStatus } from '../StatusBar/type';
 declare const viewsOptions: {
     default: {};
     developer: {};
@@ -9,9 +9,6 @@ declare const viewsOptions: {
     custom: {};
 };
 export type View = keyof typeof viewsOptions;
-export type AvailableStatus<T = undefined> = StatusButtonProps & {
-    status: T | TableHeaderStatus | (TableHeaderStatus | T)[];
-};
 export interface TableHeaderProps {
     availableStatuses?: AvailableStatus[];
     status?: TableHeaderStatus;

package/build/components/{TableHeader_V2/components/TableView → TableView}/CustomViews.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { TableHeaderProps } from '../../type';
+import type { TableHeaderProps } from '../TableHeader/type';
 interface CustomViewsProps {
     open: boolean;
     onSelect: (e: React.MouseEvent<HTMLDivElement>) => void;

package/build/components/{TableHeader_V2/components/TableView → TableView}/CustomViews.js

@@ -6,9 +6,9 @@ import { Reorder } from 'framer-motion';
 import Box from '@mui/material/Box';
 import Menu from '@mui/material/Menu';
 import { useTheme } from '@mui/material/styles';
-import { downArrowIcon } from '../../../../constants/index.js';
+import { downArrowIcon } from '../../constants/index.js';
 import { ButtonStyled, ListStyled, DropdownStyled } from './style';
-import { NestedMenuItem as MenuItem } from '../../../NestedDropdown';
+import { NestedMenuItem as MenuItem } from '../NestedDropdown';
 function CustomViews({ open, onSelect, setTableViews: setColumns, tableViews, anchorEl, onClose }) {
     const columns = tableViews || [];
     const { t } = useTranslation();

package/build/components/{TableHeader_V2/components/TableView → TableView}/DefaultViews.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { ViewOption } from '../../type';
+import type { ViewOption } from '../TableHeader/type';
 interface DefaultViewsProps {
     open: boolean;
     selectedViewInfo: ViewOption;

package/build/components/{TableHeader_V2/components/TableView → TableView}/DefaultViews.js

@@ -2,9 +2,9 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 import Popper from '@mui/material/Popper';
 import { useTranslation } from 'react-i18next';
-import { downArrowIcon, checkIcon } from '../../../../constants/index.js';
+import { downArrowIcon, checkIcon } from '../../constants/index.js';
 import { ButtonStyled, ListStyled, DropdownStyled, MenuItem, Space, SpaceAfter } from './style';
-import { dummyViewList } from '../../data';
+import { dummyViewList } from './data';
 function DefaultViews({ open, selectedViewInfo, setSelectedViewInfo, onSelect, setViews, anchorEl }) {
     const { t } = useTranslation();
     return (_jsxs(DropdownStyled, Object.assign({ "data-testid": "TableView_DefaultViews" }, { children: [_jsxs(ButtonStyled, Object.assign({ onClick: (e) => {

package/build/components/{TableHeader_V2/components/TableView → TableView}/TableView.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import type { TableHeaderProps } from '../../type';
+import type { TableHeaderProps } from '../TableHeader/type';
 interface TableViewProps {
     onViewChange?: TableHeaderProps['onViewChange'];
     setIsViewVisible: (visible: boolean) => void;

package/build/components/{TableHeader_V2/components/TableView → TableView}/TableView.js

@@ -2,9 +2,9 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { memo, useState } from 'react';
 import { ClickAwayListener } from '@mui/material';
 import { useTranslation } from 'react-i18next';
-import { closeXIcon, viewIcon } from '../../../../constants/index.js';
-import { StyledButton } from '../../../Button';
-import Icon from '../../../Icon';
+import { closeXIcon, viewIcon } from '../../constants/index.js';
+import { StyledButton } from '../Button';
+import Icon from '../Icon';
 import CustomViews from './CustomViews';
 import DefaultViews from './DefaultViews';
 import { ButtonStyled, ViewWrapper } from './style';

package/build/components/index.d.ts

@@ -90,6 +90,6 @@ export { default as Error } from './Error';
 export { default as StatusBar } from './StatusBar';
 export { default as MultiSelectStatusButton, type CurrencyOption, type MultiSelectStatusButtonProps } from './MultiSelectStatusButton';
 export * from './Chip';
-export * from './TableHeader_V2';
+export * from './TableHeader';
 export { default as RangeCalender } from './RangeCalender';
 export { default as AppServices } from './AppServices';

package/build/components/index.js

@@ -90,6 +90,6 @@ export { default as Error } from './Error';
 export { default as StatusBar } from './StatusBar';
 export { default as MultiSelectStatusButton } from './MultiSelectStatusButton';
 export * from './Chip';
-export * from './TableHeader_V2';
+export * from './TableHeader';
 export { default as RangeCalender } from './RangeCalender';
 export { default as AppServices } from './AppServices';

package/build/constants/assets.d.ts

@@ -316,7 +316,6 @@ export declare const intentInitiatedStatusIcon: string;
 export declare const intentCancelledStatusIcon: string;
 export declare const intentTransactedStatusIcon: string;
 export declare const longWordsIcon: string;
-export declare const sheetViewIcon: string;
 export declare const abandonedNoBGIcon: string;
 export declare const paidOutTableIcon: string;
 export declare const reversePayoutTableIcon: string;

package/build/constants/assets.js

@@ -317,7 +317,6 @@ export const intentInitiatedStatusIcon = `${appBaseUrl}/intentInitiatedStatus.sv
 export const intentCancelledStatusIcon = `${appBaseUrl}/intentCancelledStatus.svg`;
 export const intentTransactedStatusIcon = `${appBaseUrl}/intentTransactedStatus.svg`;
 export const longWordsIcon = `${appBaseUrl}/longWordsIcon.svg`;
-export const sheetViewIcon = `${lightUrl}/sheetView.svg`;
 export const abandonedNoBGIcon = `${lightUrl}/abandonedNoBG.svg`;
 export const paidOutTableIcon = `${lightUrl}/status/table/paidOut.svg`;
 export const reversePayoutTableIcon = `${lightUrl}/status/table/reversePayout.svg`;

package/package.json

@@ -1,132 +1,132 @@
-{
-  "name": "@tap-payments/os-micro-frontend-shared",
-  "description": "Shared components and utilities for Tap Payments micro frontends",
-  "version": "0.0.176",
-  "type": "module",
-  "main": "build/index.js",
-  "module": "build/index.js",
-  "types": "build/index.d.ts",
-  "exports": {
-    ".": {
-      "types": "./build/index.d.ts",
-      "import": "./build/index.js",
-      "require": "./build/index.js"
-    },
-    "./constants": {
-      "types": "./build/constants/index.d.ts",
-      "import": "./build/constants/index.js",
-      "require": "./build/constants/index.js"
-    },
-    "./components": {
-      "types": "./build/components/index.d.ts",
-      "import": "./build/components/index.js",
-      "require": "./build/components/index.js"
-    },
-    "./components/*": {
-      "types": "./build/components/*/index.d.ts",
-      "import": "./build/components/*/index.js",
-      "require": "./build/components/*/index.js"
-    },
-    "./hooks": {
-      "types": "./build/hooks/index.d.ts",
-      "import": "./build/hooks/index.js",
-      "require": "./build/hooks/index.js"
-    },
-    "./utils": {
-      "types": "./build/utils/index.d.ts",
-      "import": "./build/utils/index.js",
-      "require": "./build/utils/index.js"
-    },
-    "./theme": {
-      "types": "./build/theme/index.d.ts",
-      "import": "./build/theme/index.js",
-      "require": "./build/theme/index.js"
-    },
-    "./types": {
-      "types": "./build/types/index.d.ts",
-      "import": "./build/types/index.js",
-      "require": "./build/types/index.js"
-    }
-  },
-  "license": "MIT",
-  "author": {
-    "name": "Ahmed Sharkawy",
-    "email": "a.elsharkawy@tap.company"
-  },
-  "files": [
-    "build",
-    "readme.md"
-  ],
-  "scripts": {
-    "ts:build": "rm -rf build && tsc -p tsconfig.npm.json && tsc-alias -p tsconfig.npm.json",
-    "push": "npm version patch --no-git-tag-version && npm run ts:build && npm publish --access public",
-    "dev": "vite",
-    "build": "tsc -b && vite build ",
-    "prettier": "prettier --list-different \"src/**/*.{md,mdx,ts,js,tsx,jsx,json}\"",
-    "prettier:fix": "prettier --write \"src/**/*.{ts,tsx,js,jsx,json,md,css,json}\"",
-    "lint": "eslint . --color",
-    "lint:fix": "eslint src --fix --color",
-    "preview": "vite preview",
-    "prepare": "husky"
-  },
-  "dependencies": {
-    "@emotion/react": "^11.11.0",
-    "@emotion/styled": "^11.11.0",
-    "@hookform/resolvers": "^3.3.1",
-    "@mui/material": "^5.12.3",
-    "@uiw/react-json-view": "^2.0.0-alpha.16",
-    "axios": "^1.4.0",
-    "dayjs": "^1.11.8",
-    "framer-motion": "10.11.0",
-    "i18next": "^22.4.15",
-    "memoize-one": "^6.0.0",
-    "re-resizable": "^6.9.9",
-    "react": "^18.2.0",
-    "react-currency-input-field": "^3.6.11",
-    "react-dom": "^18.2.0",
-    "react-draggable": "^4.4.6",
-    "react-dropzone": "^14.2.3",
-    "react-hook-form": "^7.45.4",
-    "react-hot-toast": "^2.4.1",
-    "react-i18next": "^12.2.2",
-    "react-multi-date-picker": "^4.1.2",
-    "react-router-dom": "^6.14.2",
-    "react-virtualized-auto-sizer": "^1.0.20",
-    "react-window": "^1.8.9",
-    "react-window-infinite-loader": "^1.0.9",
-    "react18-input-otp": "^1.1.4",
-    "recharts": "^2.15.1"
-  },
-  "devDependencies": {
-    "@eslint/js": "^9.17.0",
-    "@testing-library/jest-dom": "^5.16.5",
-    "@types/lodash": "^4.17.15",
-    "@types/react": "^18.2.6",
-    "@types/react-dom": "^18.3.5",
-    "@types/react-virtualized-auto-sizer": "^1.0.8",
-    "@types/react-window": "^1.8.5",
-    "@types/react-window-infinite-loader": "^1.0.6",
-    "@vitejs/plugin-react": "^4.3.4",
-    "eslint": "^9.17.0",
-    "eslint-plugin-react-hooks": "^5.0.0",
-    "eslint-plugin-react-refresh": "^0.4.16",
-    "globals": "^15.14.0",
-    "husky": "^8.0.3",
-    "lint-staged": "^13.2.2",
-    "prettier": "^2.8.8",
-    "tsc-alias": "^1.8.16",
-    "typescript": "5.0.2",
-    "typescript-eslint": "^8.18.2",
-    "vite": "6.0.5",
-    "vite-tsconfig-paths": "^4.2.0"
-  },
-  "lint-staged": {
-    "src/**/*.{ts,tsx,json,js,jsx}": [
-      "yarn run prettier:fix",
-      "yarn run lint"
-    ]
-  },
-  "publishConfig": {
-    "registry": "https://registry.npmjs.org/"
-  }
-}
+{
+  "name": "@tap-payments/os-micro-frontend-shared",
+  "description": "Shared components and utilities for Tap Payments micro frontends",
+  "version": "0.0.180",
+  "type": "module",
+  "main": "build/index.js",
+  "module": "build/index.js",
+  "types": "build/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./build/index.d.ts",
+      "import": "./build/index.js",
+      "require": "./build/index.js"
+    },
+    "./constants": {
+      "types": "./build/constants/index.d.ts",
+      "import": "./build/constants/index.js",
+      "require": "./build/constants/index.js"
+    },
+    "./components": {
+      "types": "./build/components/index.d.ts",
+      "import": "./build/components/index.js",
+      "require": "./build/components/index.js"
+    },
+    "./components/*": {
+      "types": "./build/components/*/index.d.ts",
+      "import": "./build/components/*/index.js",
+      "require": "./build/components/*/index.js"
+    },
+    "./hooks": {
+      "types": "./build/hooks/index.d.ts",
+      "import": "./build/hooks/index.js",
+      "require": "./build/hooks/index.js"
+    },
+    "./utils": {
+      "types": "./build/utils/index.d.ts",
+      "import": "./build/utils/index.js",
+      "require": "./build/utils/index.js"
+    },
+    "./theme": {
+      "types": "./build/theme/index.d.ts",
+      "import": "./build/theme/index.js",
+      "require": "./build/theme/index.js"
+    },
+    "./types": {
+      "types": "./build/types/index.d.ts",
+      "import": "./build/types/index.js",
+      "require": "./build/types/index.js"
+    }
+  },
+  "license": "MIT",
+  "author": {
+    "name": "Ahmed Sharkawy",
+    "email": "a.elsharkawy@tap.company"
+  },
+  "files": [
+    "build",
+    "readme.md"
+  ],
+  "scripts": {
+    "ts:build": "rm -rf build && tsc -p tsconfig.npm.json && tsc-alias -p tsconfig.npm.json",
+    "push": "npm version patch --no-git-tag-version && npm run ts:build && npm publish --access public",
+    "dev": "vite",
+    "build": "tsc -b && vite build ",
+    "prettier": "prettier --list-different \"src/**/*.{md,mdx,ts,js,tsx,jsx,json}\"",
+    "prettier:fix": "prettier --write \"src/**/*.{ts,tsx,js,jsx,json,md,css,json}\"",
+    "lint": "eslint . --color",
+    "lint:fix": "eslint src --fix --color",
+    "preview": "vite preview",
+    "prepare": "husky"
+  },
+  "dependencies": {
+    "@emotion/react": "^11.11.0",
+    "@emotion/styled": "^11.11.0",
+    "@hookform/resolvers": "^3.3.1",
+    "@mui/material": "^5.12.3",
+    "@uiw/react-json-view": "^2.0.0-alpha.16",
+    "axios": "^1.4.0",
+    "dayjs": "^1.11.8",
+    "framer-motion": "10.11.0",
+    "i18next": "^22.4.15",
+    "memoize-one": "^6.0.0",
+    "re-resizable": "^6.9.9",
+    "react": "^18.2.0",
+    "react-currency-input-field": "^3.6.11",
+    "react-dom": "^18.2.0",
+    "react-draggable": "^4.4.6",
+    "react-dropzone": "^14.2.3",
+    "react-hook-form": "^7.45.4",
+    "react-hot-toast": "^2.4.1",
+    "react-i18next": "^12.2.2",
+    "react-multi-date-picker": "^4.1.2",
+    "react-router-dom": "^6.14.2",
+    "react-virtualized-auto-sizer": "^1.0.20",
+    "react-window": "^1.8.9",
+    "react-window-infinite-loader": "^1.0.9",
+    "react18-input-otp": "^1.1.4",
+    "recharts": "^2.15.1"
+  },
+  "devDependencies": {
+    "@eslint/js": "^9.17.0",
+    "@testing-library/jest-dom": "^5.16.5",
+    "@types/lodash": "^4.17.15",
+    "@types/react": "^18.2.6",
+    "@types/react-dom": "^18.3.5",
+    "@types/react-virtualized-auto-sizer": "^1.0.8",
+    "@types/react-window": "^1.8.5",
+    "@types/react-window-infinite-loader": "^1.0.6",
+    "@vitejs/plugin-react": "^4.3.4",
+    "eslint": "^9.17.0",
+    "eslint-plugin-react-hooks": "^5.0.0",
+    "eslint-plugin-react-refresh": "^0.4.16",
+    "globals": "^15.14.0",
+    "husky": "^8.0.3",
+    "lint-staged": "^13.2.2",
+    "prettier": "^2.8.8",
+    "tsc-alias": "^1.8.16",
+    "typescript": "5.0.2",
+    "typescript-eslint": "^8.18.2",
+    "vite": "6.0.5",
+    "vite-tsconfig-paths": "^4.2.0"
+  },
+  "lint-staged": {
+    "src/**/*.{ts,tsx,json,js,jsx}": [
+      "yarn run prettier:fix",
+      "yarn run lint"
+    ]
+  },
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/"
+  }
+}

package/build/components/TableHeader_V2/components/StatusButtons/ChevronIcon.d.ts

@@ -1,2 +0,0 @@
-import { ChevronIconProps } from './type';
-export declare function ChevronIcon({ isActive, disableHover }: ChevronIconProps): import("react/jsx-runtime").JSX.Element;

package/build/components/TableHeader_V2/components/StatusButtons/ChevronIcon.js

@@ -1,18 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from 'react';
-import { useTheme } from '@mui/material';
-export function ChevronIcon({ isActive, disableHover }) {
-    const [isHovered, setIsHovered] = useState(false);
-    const theme = useTheme();
-    const handleMouseEnter = () => {
-        if (!disableHover) {
-            setIsHovered(true);
-        }
-    };
-    const handleMouseLeave = () => {
-        setIsHovered(false);
-    };
-    const iconColor = isActive ? theme.palette.common.white : theme.palette.grey[700];
-    const backgroundColor = isHovered ? theme.palette.common.black : 'transparent';
-    return (_jsx("svg", Object.assign({ width: "27", height: "30", viewBox: "0 0 27 32", xmlns: "http://www.w3.org/2000/svg" }, { children: _jsxs("g", Object.assign({ id: "Group 140343" }, { children: [_jsx("path", { id: "Active", d: "M0 0H11C19.8366 0 27 7.16344 27 16C27 24.8366 19.8366 32 11 32H0V0Z", fill: backgroundColor, fillOpacity: "0.1", onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave }), _jsx("path", { id: "Union", fillRule: "evenodd", clipRule: "evenodd", d: "M15.6941 15.0078C15.6494 15.0193 15.6083 15.043 15.5758 15.0769L12.5026 18.1501L12.5025 18.1501L15.5756 15.0769C15.6082 15.043 15.6493 15.0193 15.6941 15.0078ZM12.5619 18.7465C12.5426 18.7512 12.5227 18.7536 12.5026 18.7536C12.4363 18.7536 12.3727 18.7273 12.3258 18.6804L9.07581 15.4304C9.04012 15.3957 9.01559 15.3512 9.00535 15.3025C8.99511 15.2538 8.99963 15.2032 9.01833 15.1571C9.03703 15.111 9.06907 15.0715 9.11033 15.0437C9.13446 15.0275 9.16112 15.0156 9.18904 15.0086C9.16105 15.0156 9.13433 15.0275 9.11013 15.0438C9.06887 15.0716 9.03684 15.111 9.01814 15.1571C8.99944 15.2032 8.99492 15.2539 9.00516 15.3026C9.0154 15.3513 9.03993 15.3958 9.07562 15.4305L12.3256 18.6805C12.3725 18.7273 12.4361 18.7537 12.5024 18.7537C12.5226 18.7537 12.5426 18.7512 12.5619 18.7465ZM16.1965 15.342C16.1781 15.4301 16.1338 15.5105 16.0693 15.5731L12.8205 18.8219C12.7361 18.9063 12.6217 18.9537 12.5024 18.9537C12.3831 18.9537 12.2686 18.9062 12.1842 18.8219L8.93507 15.5728C8.87148 15.5105 8.82775 15.4308 8.80944 15.3437C8.79101 15.2561 8.79914 15.165 8.8328 15.082C8.86646 14.999 8.92412 14.9279 8.99839 14.8779C9.07266 14.8279 9.16022 14.8011 9.24978 14.8011C9.30998 14.8011 9.36958 14.8132 9.42503 14.8366C9.47997 14.8599 9.52973 14.8938 9.57144 14.9364L12.5024 17.8673L15.433 14.9368C15.5151 14.852 15.6273 14.803 15.7454 14.8002C15.836 14.798 15.9252 14.8233 16.0013 14.8728C16.0773 14.9222 16.1367 14.9935 16.1715 15.0772C16.2063 15.1609 16.2151 15.2533 16.1965 15.342Z", fill: iconColor })] })) })));
-}

package/build/components/TableHeader_V2/components/StatusButtons/StatusButton.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-import { type StatusButtonProps } from './type';
-export declare const StatusButton: import("react").MemoExoticComponent<(props: StatusButtonProps) => import("react/jsx-runtime").JSX.Element>;

package/build/components/TableHeader_V2/components/StatusButtons/StatusButton.js

@@ -1,54 +0,0 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { memo, useRef, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import StyledBadge, { BadgeVariants } from '../../../CountBadge';
-import { convertToNumber, formatNumber } from '../../../../utils/index.js';
-import { ChevronIcon } from './ChevronIcon';
-import { ChevronContainer, Label, LabelWrapper, StyledStatusIcon, StyledDropdown, statusButtonVariants } from './style';
-import { statusButtonIcons } from './constant';
-export const StatusButton = memo((props) => {
-    var _a, _b;
-    const { variant = 'inActive', badgeCount, icon, label, dropdownOptions, onButtonBodyClick } = props, restProps = __rest(props, ["variant", "badgeCount", "icon", "label", "dropdownOptions", "onButtonBodyClick"]);
-    const [anchorEl, setAnchorEl] = useState(null);
-    const buttonRef = useRef(null);
-    const [lastActiveStatus, setLastActiveStatus] = useState((_a = dropdownOptions === null || dropdownOptions === void 0 ? void 0 : dropdownOptions[0]) === null || _a === void 0 ? void 0 : _a.status);
-    const { t } = useTranslation();
-    const open = Boolean(anchorEl);
-    const handleClose = () => {
-        setAnchorEl(null);
-    };
-    const Button = statusButtonVariants[variant];
-    const hasDropdown = dropdownOptions && dropdownOptions.length > 0;
-    const statusIcon = icon ? _jsx(StyledStatusIcon, { icon: icon, variant: variant, src: statusButtonIcons[icon], alt: `${icon}-icon` }) : null;
-    const statusBadge = badgeCount && !Number.isNaN(convertToNumber(badgeCount)) ? (_jsx(StyledBadge, Object.assign({ variant: variant === 'active' ? BadgeVariants.ACTIVE : BadgeVariants.INACTIVE }, { children: formatNumber(Number(badgeCount)) }))) : null;
-    const dropdownIcon = hasDropdown ? _jsx(ChevronIcon, { isActive: variant === 'active' }) : null;
-    return (_jsxs(_Fragment, { children: [_jsx(Button, Object.assign({ "data-testid": "StatusButton" }, restProps, { ref: buttonRef, onClick: (e) => {
-                    var _a, _b;
-                    (_a = props === null || props === void 0 ? void 0 : props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
-                    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');
-                }, sx: Object.assign({}, (hasDropdown && {
-                    paddingInlineEnd: '27px',
-                })) }, { children: _jsxs(LabelWrapper, Object.assign({ onClick: (e) => {
-                        e.stopPropagation();
-                        e.preventDefault();
-                        if (hasDropdown) {
-                            setAnchorEl(buttonRef.current);
-                        }
-                    } }, { 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) => {
-                        var _a;
-                        (_a = item === null || item === void 0 ? void 0 : item.onClick) === null || _a === void 0 ? void 0 : _a.call(item, e);
-                        setLastActiveStatus(item.status);
-                        handleClose();
-                    } }))) }))] }));
-});

package/build/components/TableHeader_V2/components/StatusButtons/StatusButtons.d.ts

@@ -1,11 +0,0 @@
-/// <reference types="react" />
-import { AvailableStatus } from '../../type';
-import { TableHeaderStatus } from '../../../../types/index.js';
-export type StatusButtonsProps = {
-    availableStatuses: AvailableStatus[];
-    status: TableHeaderStatus;
-    onStatusChange?: (status: TableHeaderStatus) => void;
-    isFilteredIdsShown?: boolean;
-};
-declare const _default: import("react").MemoExoticComponent<(props: StatusButtonsProps) => import("react/jsx-runtime").JSX.Element>;
-export default _default;

package/build/components/TableHeader_V2/components/StatusButtons/StatusButtons.js

@@ -1,38 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
-import { createElement as _createElement } from "react";
-import { memo, useMemo } from 'react';
-import { useTranslation } from 'react-i18next';
-import { StatusButton } from './StatusButton';
-const StatusButtonItem = memo((props) => {
-    var _a;
-    const { availableStatus, getButtonStatus, onStatusChange, status } = props;
-    const { t } = useTranslation();
-    if (!Array.isArray(availableStatus.status)) {
-        return (_createElement(StatusButton, Object.assign({}, availableStatus, { key: `status-button-array-${availableStatus.status}`, variant: getButtonStatus(availableStatus.status), onClick: () => {
-                if (!Array.isArray(availableStatus.status)) {
-                    onStatusChange === null || onStatusChange === void 0 ? void 0 : onStatusChange(availableStatus.status);
-                }
-            } })));
-    }
-    const isCurrentStatusDropdown = (_a = availableStatus.status) === null || _a === void 0 ? void 0 : _a.includes(status || '');
-    const variant = isCurrentStatusDropdown ? 'active' : 'inActive';
-    const statusLabel = isCurrentStatusDropdown ? status : availableStatus.status[0];
-    return (_jsx("div", { children: _jsx(StatusButton, Object.assign({}, availableStatus, { label: t(statusLabel || ''), variant: variant, onButtonBodyClick: (buttonStatus) => {
-                onStatusChange === null || onStatusChange === void 0 ? void 0 : onStatusChange(buttonStatus);
-            }, dropdownOptions: availableStatus.status.map((stat) => ({
-                label: t(stat || ''),
-                onClick: () => {
-                    onStatusChange === null || onStatusChange === void 0 ? void 0 : onStatusChange(stat);
-                },
-                status: stat,
-            })) })) }));
-});
-const StatusButtons = (props) => {
-    const { availableStatuses, status, onStatusChange, isFilteredIdsShown } = props;
-    const getButtonStatus = useMemo(() => (buttonStatus) => buttonStatus === status && !isFilteredIdsShown ? 'active' : 'inActive', [status, isFilteredIdsShown]);
-    return (_jsx(_Fragment, { children: availableStatuses === null || availableStatuses === void 0 ? void 0 : availableStatuses.map((availableStatus) => {
-            var _a;
-            return (_jsx(StatusButtonItem, { availableStatus: availableStatus, getButtonStatus: getButtonStatus, onStatusChange: onStatusChange, status: status }, Array.isArray(availableStatus.status) ? (_a = availableStatus === null || availableStatus === void 0 ? void 0 : availableStatus.status) === null || _a === void 0 ? void 0 : _a[0] : `status-button-array-${availableStatus.status}`));
-        }) }));
-};
-export default memo(StatusButtons);

package/build/components/TableHeader_V2/components/StatusButtons/constant.d.ts

@@ -1,21 +0,0 @@
-export declare const statusButtonIcons: {
-    inProgress: string;
-    initiated: string;
-    abandoned: string;
-    cancelled: string;
-    reversed: string;
-    reports: string;
-    search: string;
-    chevronDown: string;
-    unAuthorized: string;
-    unSettled: string;
-    unCaptured: string;
-    captured: string;
-    authorized: string;
-    openFlag: string;
-    closedFlag: string;
-    unauthenticated: string;
-    authenticated: string;
-    paidOut: string;
-    scheduled: string;
-};

package/build/components/TableHeader_V2/components/StatusButtons/constant.js

@@ -1,22 +0,0 @@
-import { initiatedIcon, abandonedIcon, cancelledIcon, reportsIcon, searchIcon, chevronDownIcon, unAuthorizedIcon, settlementInitiatedIcon, unCapturedIcon, capturedIcon, authorizedIcon, openFlagIcon, closedFlagIcon, reverseActionIcon, authenticatedIcon, unauthenticatedIcon, paidOutFilterIcon, scheduledFilterIcon, } from '../../../../constants/index.js';
-export const statusButtonIcons = {
-    inProgress: initiatedIcon,
-    initiated: initiatedIcon,
-    abandoned: abandonedIcon,
-    cancelled: cancelledIcon,
-    reversed: reverseActionIcon,
-    reports: reportsIcon,
-    search: searchIcon,
-    chevronDown: chevronDownIcon,
-    unAuthorized: unAuthorizedIcon,
-    unSettled: settlementInitiatedIcon,
-    unCaptured: unCapturedIcon,
-    captured: capturedIcon,
-    authorized: authorizedIcon,
-    openFlag: openFlagIcon,
-    closedFlag: closedFlagIcon,
-    unauthenticated: unauthenticatedIcon,
-    authenticated: authenticatedIcon,
-    paidOut: paidOutFilterIcon,
-    scheduled: scheduledFilterIcon,
-};

package/build/components/TableHeader_V2/components/StatusButtons/index.d.ts

@@ -1,3 +0,0 @@
-export { default as StatusButtons } from './StatusButtons';
-export * from './StatusButton';
-export * from './style';

package/build/components/TableHeader_V2/components/StatusButtons/index.js

@@ -1,3 +0,0 @@
-export { default as StatusButtons } from './StatusButtons';
-export * from './StatusButton';
-export * from './style';

package/build/components/TableHeader_V2/components/StatusButtons/style.d.ts

@@ -1,35 +0,0 @@
-import type React from 'react';
-import { type Theme } from '@mui/material';
-export declare const statusButtonVariants: {
-    active: import("@emotion/styled").StyledComponent<import("@mui/material").ButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
-        ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
-    }, "disabled" | "className" | "style" | "classes" | "color" | "children" | "sx" | "tabIndex" | "size" | "variant" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "href" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "startIcon"> & import("@mui/system").MUIStyledCommonProps<Theme> & {
-        icon?: string | undefined;
-    }, {}, {}>;
-    inActive: import("@emotion/styled").StyledComponent<import("@mui/material").ButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
-        ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
-    }, "disabled" | "className" | "style" | "classes" | "color" | "children" | "sx" | "tabIndex" | "size" | "variant" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "href" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "startIcon"> & import("@mui/system").MUIStyledCommonProps<Theme> & {
-        icon?: string | undefined;
-    }, {}, {}>;
-};
-export type StatusButtonVariant = keyof typeof statusButtonVariants;
-export declare const CountBadge: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<Theme> & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
-}, keyof import("@mui/system").BoxOwnProps<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme> & {
-    variant: StatusButtonVariant;
-}, {}, {}>;
-export declare const StyledStatusIcon: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<Theme> & {
-    variant: StatusButtonVariant;
-    icon?: "initiated" | "captured" | "unCaptured" | "inProgress" | "abandoned" | "cancelled" | "reversed" | "authorized" | "paidOut" | "unauthenticated" | "authenticated" | "scheduled" | "unSettled" | "search" | "reports" | "chevronDown" | "unAuthorized" | "openFlag" | "closedFlag" | undefined;
-}, React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
-export declare const StyledFilterName: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<Theme>, React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, {}>;
-export declare const StyledDropdown: import("@emotion/styled").StyledComponent<import("../../..").IProps & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
-export declare const ChevronContainer: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<Theme>, React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
-export declare const Label: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<Theme> & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
-}, keyof import("@mui/system").BoxOwnProps<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme> & {
-    variant: StatusButtonVariant;
-}, {}, {}>;
-export declare const LabelWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<Theme> & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
-}, keyof import("@mui/system").BoxOwnProps<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;

package/build/components/TableHeader_V2/components/StatusButtons/style.js

@@ -1,75 +0,0 @@
-import { styled, Button, Box, alpha } from '@mui/material';
-import Dropdown from '../../../DropdownMenu/DropdownMenu';
-const baseButtonStyle = (theme) => (Object.assign(Object.assign({}, theme.typography.subtitle1), { borderRadius: '50px', borderWidth: '1px', borderStyle: 'solid', minWidth: '135.11px', height: '32px', display: 'flex', justifyContent: 'center', alignItems: 'center', gap: '8px', textTransform: 'none', transition: 'none', paddingInline: theme.spacing(2) }));
-const ActiveButton = styled(Button)(({ theme }) => (Object.assign(Object.assign({}, baseButtonStyle(theme)), { background: theme.palette.background.gradient.shadedBlue, color: theme.palette.common.white, '&:hover': {
-        background: theme.palette.background.gradient.shadedBlue,
-        opacity: 0.8,
-    } })));
-const InActiveButton = styled(Button)(({ theme }) => (Object.assign(Object.assign({}, baseButtonStyle(theme)), { backgroundColor: theme.palette.common.white, borderColor: theme.palette.grey[100], color: theme.palette.text.primary, '&:hover': {
-        backgroundColor: theme.palette.common.white,
-        opacity: 0.7,
-    } })));
-export const statusButtonVariants = {
-    active: ActiveButton,
-    inActive: InActiveButton,
-};
-export const CountBadge = styled(Box)(({ theme, variant }) => ({
-    borderRadius: '50px',
-    backgroundColor: variant === 'active' ? alpha(theme.palette.text.primary, 0.1) : theme.palette.grey[100],
-    display: 'flex',
-    justifyContent: 'center',
-    alignItems: 'center',
-    paddingInline: theme.spacing(0.5),
-    paddingBlock: theme.spacing(0.25),
-    color: variant === 'active' ? theme.palette.common.white : theme.palette.text.primary,
-    fontSize: '8px',
-    fontWeight: 700,
-    lineHeight: '10px',
-}));
-export const StyledStatusIcon = styled('img')(({ theme, variant, icon }) => {
-    var _a;
-    return (Object.assign(Object.assign({ fill: variant === 'active' ? theme.palette.common.white : theme.palette.text.primary, color: variant === 'active' ? theme.palette.common.white : theme.palette.text.primary }, (!(((_a = ['openFlag', 'closedFlag']) === null || _a === void 0 ? void 0 : _a.includes(icon !== null && icon !== void 0 ? icon : '')) && variant === 'inActive') &&
-        icon !== 'captured' && {
-        filter: variant === 'active' ? 'brightness(0) invert(1)' : 'brightness(0) invert(0)',
-    })), { maxWidth: '14px', maxHeight: '14px' }));
-});
-export const StyledFilterName = styled('p')(({ theme }) => ({
-    fontSize: '0.6875rem',
-    color: theme.palette.background.default,
-    fontStyle: 'normal',
-    margin: 'auto',
-    textTransform: 'capitalize',
-}));
-export const StyledDropdown = styled(Dropdown)(({ theme }) => ({
-    backgroundColor: 'white',
-    boxShadow: theme.shadows[21],
-    borderRadius: '0.25rem',
-    '& .MuiPaper-root': {
-        borderRadius: '0.25rem',
-        width: '12.5rem',
-    },
-}));
-export const ChevronContainer = styled('span')(() => ({
-    width: '27px',
-    height: '100%',
-    maxHeight: '100%',
-    position: 'absolute',
-    top: '0',
-    right: '0',
-    bottom: '0',
-    overflow: 'hidden',
-    transition: 'opacity 1s ease',
-}));
-export const Label = styled(Box)(({ variant }) => ({
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'flex-start',
-    gap: '0.5rem',
-    fontWeight: variant === 'active' ? 700 : 400,
-}));
-export const LabelWrapper = styled(Box)(() => ({
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-    width: '100%',
-}));

package/build/components/TableHeader_V2/components/StatusButtons/type.d.ts

@@ -1,25 +0,0 @@
-import { ReactNode } from 'react';
-import { type ButtonProps } from '@mui/material';
-import { TableHeaderStatus } from '../../../../types/index.js';
-import { type StatusButtonVariant } from './style';
-import { statusButtonIcons } from './constant';
-import { MenuItemI } from '../../../DropdownMenu';
-export interface StatusButtonProps extends Omit<ButtonProps, 'variant' | 'children'> {
-    variant?: StatusButtonVariant;
-    badgeCount?: number | string;
-    hasDropdown?: boolean;
-    icon?: StatusButtonIcon;
-    label?: ReactNode | null;
-    totalCount?: number;
-    onButtonBodyClick?: (status: TableHeaderStatus) => void;
-    dropdownOptions?: Array<MenuItemI & {
-        status: TableHeaderStatus;
-    }>;
-    render?: (status: TableHeaderStatus) => ReactNode;
-    onMultiSelectChange?: (status: TableHeaderStatus[]) => void;
-}
-export interface ChevronIconProps {
-    isActive?: boolean;
-    disableHover?: boolean;
-}
-export type StatusButtonIcon = keyof typeof statusButtonIcons;

package/build/components/TableHeader_V2/components/index.d.ts

@@ -1,2 +0,0 @@
-export * from './StatusButtons';
-export * from './TableView';

package/build/components/TableHeader_V2/components/index.js

@@ -1,2 +0,0 @@
-export * from './StatusButtons';
-export * from './TableView';