@tap-payments/os-micro-frontend-shared 0.0.108 → 0.0.109-status-chip-v2

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

@@ -0,0 +1,3 @@
+import { MaskedTextProps } from './type';
+declare const MaskedText: ({ text, startLength, endLength }: MaskedTextProps) => import("react/jsx-runtime").JSX.Element;
+export default MaskedText;

package/build/components/MaskedText/MaskedText.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import StatusChip from '../StatusChip';
+import { Box, useTheme } from '@mui/material';
+import { passwordDotsIcon } from '../../constants/index.js';
+const MaskedText = ({ text, startLength = 8, endLength = 4 }) => {
+    const theme = useTheme();
+    const startText = text.slice(0, startLength);
+    const endText = text.slice(text.length - endLength);
+    return (_jsxs(Box, Object.assign({ sx: { display: 'flex', alignItems: 'center', gap: theme.spacing(0.5) } }, { children: [_jsx(StatusChip, Object.assign({ bgColor: "#EFF1F2", borderColor: "transparent", textColor: theme.palette.text.primary }, { children: startText })), _jsx("img", { src: passwordDotsIcon, alt: "passwordDots" }), _jsx(StatusChip, Object.assign({ bgColor: "#EFF1F2", borderColor: "transparent", textColor: theme.palette.text.primary }, { children: endText }))] })));
+};
+export default MaskedText;

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

@@ -0,0 +1,3 @@
+import MaskedText from './MaskedText';
+export type { MaskedTextProps } from './type';
+export default MaskedText;

package/build/components/MaskedText/index.js

@@ -0,0 +1,2 @@
+import MaskedText from './MaskedText';
+export default MaskedText;

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

@@ -0,0 +1,7 @@
+import { ReactNode } from 'react';
+export interface MaskedTextProps {
+    text: string;
+    startLength?: number;
+    endLength?: number;
+    separator?: ReactNode;
+}

package/build/components/MaskedText/type.js

@@ -0,0 +1 @@
+export {};

package/build/components/Menu/Menu.js

@@ -3,7 +3,6 @@ import { memo } from 'react';
 import Popper from '@mui/material/Popper';
 import { Dropdown } from './style';
 function Menu({ open, anchorEl, children, sx, placement, popperSx }) {
-    console.log('sx', sx, popperSx);
-    return (_jsx(Popper, Object.assign({ open: open, anchorEl: anchorEl, placement: placement || 'bottom-start', sx: Object.assign({}, sx) }, { children: _jsx(Dropdown, Object.assign({ sx: sx }, { children: children })) }), "menu"));
+    return (_jsx(Popper, Object.assign({ open: open, anchorEl: anchorEl, placement: placement || 'bottom-start', sx: popperSx }, { children: _jsx(Dropdown, Object.assign({ sx: sx }, { children: children })) }), "menu"));
 }
 export default memo(Menu);

package/build/components/SearchButton/styles.d.ts

@@ -554,9 +554,9 @@ export declare const Icon: import("@emotion/styled").StyledComponent<{
     onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLImageElement> | undefined;
     onTransitionEnd?: import("react").TransitionEventHandler<HTMLImageElement> | undefined;
     onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLImageElement> | undefined;
+    referrerPolicy?: import("react").HTMLAttributeReferrerPolicy | undefined;
     src?: string | undefined;
     alt?: string | undefined;
-    referrerPolicy?: import("react").HTMLAttributeReferrerPolicy | undefined;
     crossOrigin?: "" | "anonymous" | "use-credentials" | undefined;
     useMap?: string | undefined;
     loading?: "eager" | "lazy" | undefined;

package/build/components/StatusChip/StatusChip.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { ChipProps } from './type';
+declare const StatusChip: import("react").ForwardRefExoticComponent<Omit<ChipProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export default StatusChip;

package/build/components/StatusChip/StatusChip.js

@@ -0,0 +1,19 @@
+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 } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import { ChipStyled } from './style';
+const StatusChip = forwardRef((_a, ref) => {
+    var { children } = _a, props = __rest(_a, ["children"]);
+    return (_jsx(ChipStyled, Object.assign({ ref: ref }, props, { children: children })));
+});
+export default StatusChip;

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

@@ -0,0 +1,3 @@
+import StatusChip from './StatusChip';
+export type { ChipProps as StatusChipProps } from './type';
+export default StatusChip;

package/build/components/StatusChip/index.js

@@ -0,0 +1,2 @@
+import StatusChip from './StatusChip';
+export default StatusChip;

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

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+export declare const ChipStyled: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").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").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
+    textColor?: string | undefined;
+    bgColor?: string | undefined;
+    borderColor?: string | undefined;
+    disabled?: boolean | undefined;
+} & import("@mui/material/OverridableComponent").CommonProps & 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/material/OverridableComponent").CommonProps | keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & {
+    children?: import("react").ReactNode;
+}, {}, {}>;

package/build/components/StatusChip/style.js

@@ -0,0 +1,32 @@
+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 { Box, styled } from '@mui/material';
+export const ChipStyled = styled(Box)((_a) => {
+    var { theme } = _a, props = __rest(_a, ["theme"]);
+    const { textColor = theme.palette.text.primary, bgColor = theme.palette.background.paper, borderColor = theme.palette.divider, disabled = false, } = props;
+    return {
+        display: 'inline-flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+        height: '18px',
+        padding: `${theme.spacing(0.25)} ${theme.spacing(1.5)}`,
+        borderRadius: '30px',
+        border: `1px solid ${borderColor}`,
+        backgroundColor: bgColor,
+        color: textColor,
+        cursor: disabled ? 'not-allowed' : 'pointer',
+        opacity: disabled ? 0.5 : 1,
+        whiteSpace: 'nowrap',
+        fontSize: '11px',
+        minWidth: '67px',
+    };
+});

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

@@ -0,0 +1,8 @@
+import { BoxProps } from '@mui/material';
+import { PropsWithChildren } from 'react';
+export type ChipProps = PropsWithChildren<{
+    textColor?: string;
+    bgColor?: string;
+    borderColor?: string;
+    disabled?: boolean;
+} & BoxProps>;

package/build/components/StatusChip/type.js

@@ -0,0 +1 @@
+export {};

package/build/components/StatusChipRowExample/StatusChipRowExample.d.ts

@@ -0,0 +1,12 @@
+export interface ChipInfo {
+    label: string;
+    textColor: string;
+    bgColor: string;
+    borderColor: string;
+    disabled?: boolean;
+}
+export interface StatusChipRowExampleProps {
+    chips: ChipInfo[];
+}
+declare const StatusChipRowExample: ({ chips }: StatusChipRowExampleProps) => import("react/jsx-runtime").JSX.Element;
+export default StatusChipRowExample;

package/build/components/StatusChipRowExample/StatusChipRowExample.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import StatusChip from '../StatusChip';
+import { Box, useTheme } from '@mui/material';
+const StatusChipRowExample = ({ chips }) => {
+    const theme = useTheme();
+    return (_jsx(Box, Object.assign({ sx: {
+            display: 'flex',
+            gap: theme.spacing(1),
+            padding: theme.spacing(1),
+            borderBottom: `1px solid ${theme.palette.divider}`,
+            alignItems: 'center',
+            flexWrap: 'wrap',
+        } }, { children: chips.map((chip, index) => (_jsx(StatusChip, Object.assign({ textColor: chip.textColor, bgColor: chip.bgColor, borderColor: chip.borderColor, disabled: chip.disabled }, { children: chip.label }), index))) })));
+};
+export default StatusChipRowExample;

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

@@ -0,0 +1,3 @@
+import StatusChipRowExample from './StatusChipRowExample';
+export type { StatusChipRowExampleProps, ChipInfo } from './StatusChipRowExample';
+export default StatusChipRowExample;

package/build/components/StatusChipRowExample/index.js

@@ -0,0 +1,2 @@
+import StatusChipRowExample from './StatusChipRowExample';
+export default StatusChipRowExample;

package/build/components/TableCells/CustomCells/ActionCell/style.d.ts

@@ -269,9 +269,9 @@ export declare const ActionIcon: import("@emotion/styled").StyledComponent<{
     onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLImageElement> | undefined;
     onTransitionEnd?: import("react").TransitionEventHandler<HTMLImageElement> | undefined;
     onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLImageElement> | undefined;
+    referrerPolicy?: import("react").HTMLAttributeReferrerPolicy | undefined;
     src?: string | undefined;
     alt?: string | undefined;
-    referrerPolicy?: import("react").HTMLAttributeReferrerPolicy | undefined;
     crossOrigin?: "" | "anonymous" | "use-credentials" | undefined;
     useMap?: string | undefined;
     loading?: "eager" | "lazy" | undefined;

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

@@ -1,4 +1,5 @@
-export declare const ReceiptCell: ({ receiptId, isTextShown }: {
+export declare const ReceiptCell: ({ receiptId, isTextShown, tableMode, }: {
     receiptId: string;
     isTextShown?: boolean | undefined;
+    tableMode?: "text" | "default" | "sheet" | undefined;
 }) => import("react/jsx-runtime").JSX.Element;

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

@@ -4,7 +4,10 @@ import { TextTableCell } from '..';
 import { TextLabel } from '../style';
 import Tooltip from '../../../Tooltip';
 import { receiptBillIcon } from '../../../../constants/index.js';
-export const ReceiptCell = ({ receiptId, isTextShown }) => {
+export const ReceiptCell = ({ receiptId, isTextShown, tableMode, }) => {
+    if (tableMode === 'sheet') {
+        return (_jsx(TextTableCell, { children: _jsx("span", { children: receiptId }) }));
+    }
     return isTextShown ? (_jsx(TextTableCell, { children: _jsx("span", { children: receiptId }) })) : (_jsx(TableCell, Object.assign({ component: "div" }, { children: _jsx(Tooltip, Object.assign({ title: `Receipt - ${receiptId}` }, { children: _jsx(TextLabel, Object.assign({ sx: {
                     padding: '3px 8px',
                     maxWidth: '50px',

package/build/components/TableCells/CustomCells/SourceMergedCell/style.d.ts

@@ -273,9 +273,9 @@ export declare const MultiRefundIcon: import("@emotion/styled").StyledComponent<
     onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLImageElement> | undefined;
     onTransitionEnd?: import("react").TransitionEventHandler<HTMLImageElement> | undefined;
     onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLImageElement> | undefined;
+    referrerPolicy?: import("react").HTMLAttributeReferrerPolicy | undefined;
     src?: string | undefined;
     alt?: string | undefined;
-    referrerPolicy?: import("react").HTMLAttributeReferrerPolicy | undefined;
     crossOrigin?: "" | "anonymous" | "use-credentials" | undefined;
     useMap?: string | undefined;
     loading?: "eager" | "lazy" | undefined;

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

@@ -1,5 +1,5 @@
 import type { StatusCellProps } from './type';
-declare function StatusCell({ statuses, isTextShown, centerIconKey, xGap, ...props }: Readonly<StatusCellProps & {
+declare function StatusCell({ statuses, isTextShown, centerIconKey, xGap, tableMode, ...props }: Readonly<StatusCellProps & {
     isChargesService?: boolean;
     isAuthorizationsService?: boolean;
 }>): import("react/jsx-runtime").JSX.Element;

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

@@ -11,12 +11,16 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import { TableCell } from '../../../TableCells';
+import StatusChip from '../../../StatusChip';
 import { StatusIcon, StatusContainer, StatusWrapper } from './style';
 import { getStatusesFilteredObject } from './utils';
 function StatusCell(_a) {
-    var { statuses, isTextShown, centerIconKey, xGap } = _a, props = __rest(_a, ["statuses", "isTextShown", "centerIconKey", "xGap"]);
-    const statusesFilteredObject = getStatusesFilteredObject(statuses);
+    var { statuses, isTextShown, centerIconKey, xGap, tableMode } = _a, props = __rest(_a, ["statuses", "isTextShown", "centerIconKey", "xGap", "tableMode"]);
+    const statusesFilteredObject = statuses ? getStatusesFilteredObject(statuses) : {};
     const statusesList = Object.values(statusesFilteredObject).filter(Boolean);
+    if (tableMode === 'sheet') {
+        return (_jsx(TableCell, Object.assign({}, props, { children: _jsx(StatusContainer, { children: statusesList.map((status, index) => (_jsx(StatusChip, { children: status }, index))) }) })));
+    }
     const xGapValue = isTextShown ? xGap || 120 : 40;
     const centerIconIndex = centerIconKey ? Object.entries(statusesFilteredObject).findIndex(([key]) => key === centerIconKey) : 0;
     return (_jsx(TableCell, Object.assign({}, props, { "data-testid": "StatusCell", sx: {

package/build/components/TableCells/CustomCells/StatusCell/style.d.ts

@@ -262,9 +262,9 @@ export declare const MultiRefundIcon: import("@emotion/styled").StyledComponent<
     onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLImageElement> | undefined;
     onTransitionEnd?: import("react").TransitionEventHandler<HTMLImageElement> | undefined;
     onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLImageElement> | undefined;
+    referrerPolicy?: import("react").HTMLAttributeReferrerPolicy | undefined;
     src?: string | undefined;
     alt?: string | undefined;
-    referrerPolicy?: import("react").HTMLAttributeReferrerPolicy | undefined;
     crossOrigin?: "" | "anonymous" | "use-credentials" | undefined;
     useMap?: string | undefined;
     loading?: "eager" | "lazy" | undefined;

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

@@ -9,4 +9,5 @@ export interface StatusCellProps extends TableCellProps {
     isTextShown?: boolean;
     centerIconKey?: string;
     xGap?: number;
+    tableMode?: 'default' | 'text' | 'sheet';
 }

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

@@ -306,9 +306,9 @@ export declare const ActionIcon: import("@emotion/styled").StyledComponent<{
     onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLImageElement> | undefined;
     onTransitionEnd?: import("react").TransitionEventHandler<HTMLImageElement> | undefined;
     onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLImageElement> | undefined;
+    referrerPolicy?: import("react").HTMLAttributeReferrerPolicy | undefined;
     src?: string | undefined;
     alt?: string | undefined;
-    referrerPolicy?: import("react").HTMLAttributeReferrerPolicy | undefined;
     crossOrigin?: "" | "anonymous" | "use-credentials" | undefined;
     useMap?: string | undefined;
     loading?: "eager" | "lazy" | undefined;

package/build/components/index.d.ts

@@ -16,6 +16,7 @@ export { default as SheetViewVirtualTable } from './VirtualTable/SheetView/Sheet
 export { default as Widget, ListItem, WidgetHeader, WidgetList } from './Widget';
 export { default as TapLogo } from './TapLogo';
 export { default as StatusButton, ChevronIcon, type ChevronIconProps, type StatusButtonIcon, type StatusButtonProps } from './StatusButton';
+export { default as StatusChip } from './StatusChip';
 export { default as SimpleDialog, type SimpleDialogProps } from './SimpleDialog';
 export { default as SearchButton } from './SearchButton';
 export { default as Loaders } from './Loaders';
@@ -43,6 +44,7 @@ export { default as ResizableHeightInput } from './ResizableHeightInput';
 export { default as MainContainer } from './MainContainer';
 export { default as Menu } from './Menu';
 export { default as MenuItem } from './MenuItem';
+export { default as MaskedText } from './MaskedText';
 export { default as MultiSelectDropdownButton, type ButtonWithDropdownProps } from './MultiSelectDropdownButton';
 export { default as MultiSelectWithSearch, type MultiSelectWithSearchProps, ChildMenuItem, ParentMenuItem } from './MultiSelectWithSearch';
 export { default as NestedDropdown, type DropdownProps, type Selected, type Placement, Dropdown, NestedMenuItem } from './NestedDropdown';

package/build/components/index.js

@@ -16,6 +16,7 @@ export { default as SheetViewVirtualTable } from './VirtualTable/SheetView/Sheet
 export { default as Widget, ListItem, WidgetHeader, WidgetList } from './Widget';
 export { default as TapLogo } from './TapLogo';
 export { default as StatusButton, ChevronIcon } from './StatusButton';
+export { default as StatusChip } from './StatusChip';
 export { default as SimpleDialog } from './SimpleDialog';
 export { default as SearchButton } from './SearchButton';
 export { default as Loaders } from './Loaders';
@@ -43,6 +44,7 @@ export { default as ResizableHeightInput } from './ResizableHeightInput';
 export { default as MainContainer } from './MainContainer';
 export { default as Menu } from './Menu';
 export { default as MenuItem } from './MenuItem';
+export { default as MaskedText } from './MaskedText';
 export { default as MultiSelectDropdownButton } from './MultiSelectDropdownButton';
 export { default as MultiSelectWithSearch, ChildMenuItem, ParentMenuItem } from './MultiSelectWithSearch';
 export { default as NestedDropdown, Dropdown, NestedMenuItem } from './NestedDropdown';

package/build/constants/assets.d.ts

@@ -232,6 +232,7 @@ export declare const leadTitleIcon: string;
 export declare const orderAppIcon: string;
 export declare const orderWindowIcon: string;
 export declare const dottedLine: string;
+export declare const passwordDotsIcon: string;
 export declare const dollarSignIcon: string;
 export declare const reloadIcon: string;
 export declare const deletedStatusIcon: string;

package/build/constants/assets.js

@@ -233,6 +233,7 @@ export const leadTitleIcon = `${lightUrl}/window/leadTitleIcon.svg`;
 export const orderAppIcon = `${appBaseUrl}/OrderApp.svg`;
 export const orderWindowIcon = `${appBaseUrl}/OrderTitleIcon.svg`;
 export const dottedLine = `${lightUrl}/dottedLine.svg`;
+export const passwordDotsIcon = `${lightUrl}/passwordDots.svg`;
 export const dollarSignIcon = `${lightUrl}/dollarSign.svg`;
 export const reloadIcon = `${lightUrl}/reload.svg`;
 export const deletedStatusIcon = `${appBaseUrl}/deletedStatus1.svg`;

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

@@ -12,7 +12,7 @@ export declare const chargeTableCellWidth: {
     readonly id: {
         readonly default: "225px";
         readonly text: "225px";
-        readonly sheet: "225px";
+        readonly sheet: "205px";
     };
     readonly product: {
         readonly default: "85px";
@@ -37,7 +37,7 @@ export declare const chargeTableCellWidth: {
     readonly customer: {
         readonly default: "180px";
         readonly text: "180px";
-        readonly sheet: "180px";
+        readonly sheet: "115px";
     };
     readonly source: {
         readonly default: "114px";
@@ -57,7 +57,7 @@ export declare const chargeTableCellWidth: {
     readonly amount: {
         readonly default: "170px";
         readonly text: "195px";
-        readonly sheet: "195px";
+        readonly sheet: "93px";
     };
     readonly destinations: {
         readonly default: "70px";
@@ -72,12 +72,12 @@ export declare const chargeTableCellWidth: {
     readonly status: {
         readonly default: "70px";
         readonly text: "300px";
-        readonly sheet: "300px";
+        readonly sheet: "163px";
     };
     readonly merchant: {
         readonly default: "100px";
         readonly text: "150px";
-        readonly sheet: "150px";
+        readonly sheet: "115px";
     };
     readonly charge: {
         readonly default: "150px";
@@ -97,7 +97,7 @@ export declare const chargeTableCellWidth: {
     readonly receipt: {
         readonly default: "85px";
         readonly text: "150px";
-        readonly sheet: "150px";
+        readonly sheet: "124px";
     };
     readonly fees: {
         readonly default: "150px";
@@ -107,7 +107,7 @@ export declare const chargeTableCellWidth: {
     readonly metadata: {
         readonly default: "180px";
         readonly text: "180px";
-        readonly sheet: "180px";
+        readonly sheet: "215px";
     };
     readonly settlement: {
         readonly default: "200px";
@@ -142,7 +142,7 @@ export declare const chargeTableCellWidth: {
     readonly rrn: {
         readonly default: "100px";
         readonly text: "100px";
-        readonly sheet: "100px";
+        readonly sheet: "83px";
     };
     readonly device: {
         readonly default: "70px";

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

@@ -12,7 +12,7 @@ export const chargeTableCellWidth = {
     id: {
         default: '225px',
         text: '225px',
-        sheet: '225px',
+        sheet: '205px',
     },
     product: {
         default: '85px',
@@ -37,7 +37,7 @@ export const chargeTableCellWidth = {
     customer: {
         default: '180px',
         text: '180px',
-        sheet: '180px',
+        sheet: '115px',
     },
     source: {
         default: '114px',
@@ -57,7 +57,7 @@ export const chargeTableCellWidth = {
     amount: {
         default: '170px',
         text: '195px',
-        sheet: '195px',
+        sheet: '93px',
     },
     destinations: {
         default: '70px',
@@ -72,12 +72,12 @@ export const chargeTableCellWidth = {
     status: {
         default: '70px',
         text: '300px',
-        sheet: '300px',
+        sheet: '163px',
     },
     merchant: {
         default: '100px',
         text: '150px',
-        sheet: '150px',
+        sheet: '115px',
     },
     charge: {
         default: '150px',
@@ -97,7 +97,7 @@ export const chargeTableCellWidth = {
     receipt: {
         default: '85px',
         text: '150px',
-        sheet: '150px',
+        sheet: '124px',
     },
     fees: {
         default: '150px',
@@ -107,7 +107,7 @@ export const chargeTableCellWidth = {
     metadata: {
         default: '180px',
         text: '180px',
-        sheet: '180px',
+        sheet: '215px',
     },
     settlement: {
         default: '200px',
@@ -142,7 +142,7 @@ export const chargeTableCellWidth = {
     rrn: {
         default: '100px',
         text: '100px',
-        sheet: '100px',
+        sheet: '83px',
     },
     device: {
         default: '70px',

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.108",
-  "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.109-status-chip-v2",
+  "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/"
+  }
+}