@tap-payments/os-micro-frontend-shared 0.0.235-test.1 → 0.0.236-test.2

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/StatusChip/style.js

@@ -12,7 +12,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 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, padding, } = props;
+    const { textColor = theme.palette.text.primary, bgColor = '#EFF1F2', borderColor = '#EFF1F2', disabled = false, padding } = props;
     return {
         display: 'inline-flex',
         alignItems: 'center',

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

@@ -1,10 +1,8 @@
 import React from 'react';
 import type { ActionCellProps } from '../type';
-import { TableMode } from '../../../../types/index.js';
 type Props = Readonly<ActionCellProps> & {
     onJsonViewClick?: () => void;
-    tableMode?: TableMode;
 };
-declare function ActionCell({ flag, actions, flagTooltip, flagsCount, dropdownAction, onCloseDropdown, isDropdownShown, row, showJsonViewer, isTextShown, showIdButton, rowId, onJsonViewClick, tableMode, renderDropdown, ...props }: Props): import("react/jsx-runtime").JSX.Element;
+declare function ActionCell({ flag, actions, flagTooltip, flagsCount, dropdownAction, onCloseDropdown, isDropdownShown, row, showJsonViewer, isTextShown, showIdButton, rowId, onJsonViewClick, renderDropdown, ...props }: Props): import("react/jsx-runtime").JSX.Element;
 declare const _default: React.MemoExoticComponent<typeof ActionCell>;
 export default _default;

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

@@ -24,15 +24,14 @@ import { useActionCell } from './hooks/useActionCell';
 import { ActionCellContainer, ActionIcon, ActionsIconContainer } from './style';
 import { IDButton } from '../IDButton';
 import { BadgeWrapper, IdButtonContainer, TextLabel, TransparentButton } from '../style';
-import SheetViewIDButton from '../SheetViewIDButton/SheetViewIDButton';
 function ActionCell(_a) {
     var _b, _c;
-    var { flag, actions, flagTooltip, flagsCount, dropdownAction, onCloseDropdown, isDropdownShown = true, row, showJsonViewer = true, isTextShown, showIdButton = true, rowId, onJsonViewClick, tableMode, renderDropdown } = _a, props = __rest(_a, ["flag", "actions", "flagTooltip", "flagsCount", "dropdownAction", "onCloseDropdown", "isDropdownShown", "row", "showJsonViewer", "isTextShown", "showIdButton", "rowId", "onJsonViewClick", "tableMode", "renderDropdown"]);
+    var { flag, actions, flagTooltip, flagsCount, dropdownAction, onCloseDropdown, isDropdownShown = true, row, showJsonViewer = true, isTextShown, showIdButton = true, rowId, onJsonViewClick, renderDropdown } = _a, props = __rest(_a, ["flag", "actions", "flagTooltip", "flagsCount", "dropdownAction", "onCloseDropdown", "isDropdownShown", "row", "showJsonViewer", "isTextShown", "showIdButton", "rowId", "onJsonViewClick", "renderDropdown"]);
     const { t } = useTranslation();
     const { open, anchorEl, filteredActions, isAnyActionLoading, isAnyActionHasError, isAnyActionSuccessful, areThereAnyShownActions, handleClick, handleClose, setAnchorEl, } = useActionCell({ actions, isDropdownShown, onCloseDropdown, renderDropdown });
     return (_jsx(TableCell, Object.assign({}, props, { sx: {
             overflow: 'visible',
-        } }, { children: _jsxs(ActionCellContainer, Object.assign({ "data-testid": "ActionCell_ActionCellContainer", tableMode: tableMode }, { children: [flag && (_jsx(_Fragment, { children: isTextShown ? (_jsx(Tooltip, Object.assign({ title: flagTooltip }, { children: _jsx(TextLabel, Object.assign({ "data-testid": "ActionCell_FlagLabel", sx: {
+        } }, { children: _jsxs(ActionCellContainer, Object.assign({ "data-testid": "ActionCell_ActionCellContainer" }, { children: [flag && (_jsx(_Fragment, { children: isTextShown ? (_jsx(Tooltip, Object.assign({ title: flagTooltip }, { children: _jsx(TextLabel, Object.assign({ "data-testid": "ActionCell_FlagLabel", sx: {
                                 textAlign: 'left',
                                 justifyContent: 'flex-start',
                             } }, { children: flagTooltip })) }))) : (_jsx(Tooltip, Object.assign({ title: flagTooltip }, { children: _jsxs(BadgeWrapper, Object.assign({ "data-testid": "ActionCell_FlagBadge", sx: {
@@ -72,12 +71,12 @@ function ActionCell(_a) {
                                             },
                                             opacity: 1,
                                         },
-                                    } }, { children: _jsxs(StyledBadge, Object.assign({ compact: true, variant: colorToVariant[(_c = flags[flag]) === null || _c === void 0 ? void 0 : _c.color] || BadgeVariants.ORANGE, "data-testid": "ActionCell_StyledBadge" }, { children: [flagsCount, "x"] })) })))] })) }))) })), showIdButton ? (tableMode === 'sheet' ? (_jsx(SheetViewIDButton, { rowId: rowId || row.id })) : (_jsx(IDButton, { rowId: rowId || row.id }))) : null, _jsxs("div", Object.assign({ "data-testid": "ActionCell_IconsContainer", style: {
+                                    } }, { children: _jsxs(StyledBadge, Object.assign({ compact: true, variant: colorToVariant[(_c = flags[flag]) === null || _c === void 0 ? void 0 : _c.color] || BadgeVariants.ORANGE, "data-testid": "ActionCell_StyledBadge" }, { children: [flagsCount, "x"] })) })))] })) }))) })), showIdButton && _jsx(IDButton, { rowId: rowId || row.id }), _jsxs("div", Object.assign({ "data-testid": "ActionCell_IconsContainer", style: {
                         display: 'flex',
                         alignItems: 'center',
                         justifyContent: 'center',
                         gap: '5px',
-                    } }, { children: [showJsonViewer && (_jsx(_Fragment, { children: _jsx(TransparentButton, Object.assign({ onClick: onJsonViewClick, type: "button", "data-testid": "ActionCell_TransparentButton" }, { children: _jsx(Tooltip, Object.assign({ title: t('jsonViewer') }, { children: _jsx(IdButtonContainer, Object.assign({ tableMode: tableMode, "data-testid": "ActionCell_IdButtonContainer" }, { children: tableMode === 'sheet' ? (_jsx("span", Object.assign({ style: { fontSize: '11px', fontWeight: 400 } }, { children: "View API" }))) : (_jsx(motion.img, { src: jsonBlackIcon, alt: "icon" }, "id-icon")) })) })) })) })), _jsxs(ActionsIconContainer, Object.assign({ id: "styled-popover", selected: !!dropdownAction || open, "data-testid": "ActionCell_ActionsIconContainer", "data-is-active": areThereAnyShownActions, sx: Object.assign({}, (!areThereAnyShownActions && {
+                    } }, { children: [showJsonViewer && (_jsx(_Fragment, { children: _jsx(TransparentButton, Object.assign({ onClick: onJsonViewClick, type: "button", "data-testid": "ActionCell_TransparentButton" }, { children: _jsx(Tooltip, Object.assign({ title: t('jsonViewer') }, { children: _jsx(IdButtonContainer, Object.assign({ "data-testid": "ActionCell_IdButtonContainer" }, { children: _jsx(motion.img, { src: jsonBlackIcon, alt: "icon" }, "id-icon") })) })) })) })), _jsxs(ActionsIconContainer, Object.assign({ id: "styled-popover", selected: !!dropdownAction || open, "data-testid": "ActionCell_ActionsIconContainer", "data-is-active": areThereAnyShownActions, sx: Object.assign({}, (!areThereAnyShownActions && {
                                 pointerEvents: 'none',
                             })) }, { children: [_jsx(TransparentButton, Object.assign({ onClick: handleClick, "data-testid": "ActionCell_ActionsIconContainer_TransparentButton", "data-is-active": areThereAnyShownActions, sx: Object.assign({}, (!areThereAnyShownActions && {
                                         pointerEvents: 'none',

package/build/components/TableCells/CustomCells/ActionCell/ActionsColumn.js

@@ -12,20 +12,16 @@ var __rest = (this && this.__rest) || function (s, e) {
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { memo } from 'react';
 import { motion } from 'framer-motion';
-import { useTranslation } from 'react-i18next';
 import Tooltip from '../../../Tooltip';
 import { TableCell } from '../../../TableCells';
 import StyledBadge, { BadgeVariants } from '../../../CountBadge';
-import { jsonBlackIcon } from '../../../../constants/index.js';
 import { colorToVariant, flags } from './constant';
 import { ActionCellContainer, ActionIcon } from './style';
-import { IDButton } from '../IDButton';
-import { BadgeWrapper, IdButtonContainer, TextLabel, TransparentButton } from '../style';
-import SheetViewIDButton from '../SheetViewIDButton/SheetViewIDButton';
+import { BadgeWrapper, TextLabel } from '../style';
+import StatusChip from '../../../StatusChip';
 function ActionsColumn(_a) {
     var _b, _c;
     var { flag, flagTooltip, flagsCount, row, showJsonViewer = true, isTextShown, showIdButton = true, rowId, onJsonViewClick, tableMode } = _a, props = __rest(_a, ["flag", "flagTooltip", "flagsCount", "row", "showJsonViewer", "isTextShown", "showIdButton", "rowId", "onJsonViewClick", "tableMode"]);
-    const { t } = useTranslation();
     return (_jsx(TableCell, Object.assign({}, props, { sx: {
             overflow: 'visible',
         } }, { children: _jsxs(ActionCellContainer, Object.assign({ "data-testid": "ActionsColumn_ActionCellContainer", tableMode: tableMode }, { children: [flag && (_jsx(_Fragment, { children: isTextShown ? (_jsx(Tooltip, Object.assign({ title: flagTooltip }, { children: _jsx(TextLabel, Object.assign({ "data-testid": "ActionsColumn_FlagLabel", sx: {
@@ -68,11 +64,11 @@ function ActionsColumn(_a) {
                                             },
                                             opacity: 1,
                                         },
-                                    } }, { children: _jsxs(StyledBadge, Object.assign({ compact: true, variant: colorToVariant[(_c = flags[flag]) === null || _c === void 0 ? void 0 : _c.color] || BadgeVariants.ORANGE, "data-testid": "ActionsColumn_StyledBadge" }, { children: [flagsCount, "x"] })) })))] })) }))) })), showIdButton ? (tableMode === 'sheet' ? (_jsx(SheetViewIDButton, { rowId: rowId || row.id })) : (_jsx(IDButton, { rowId: rowId || row.id }))) : null, _jsx("div", Object.assign({ "data-testid": "ActionsColumn_IconsContainer", style: {
+                                    } }, { children: _jsxs(StyledBadge, Object.assign({ compact: true, variant: colorToVariant[(_c = flags[flag]) === null || _c === void 0 ? void 0 : _c.color] || BadgeVariants.ORANGE, "data-testid": "ActionsColumn_StyledBadge" }, { children: [flagsCount, "x"] })) })))] })) }))) })), showIdButton && _jsx(StatusChip, Object.assign({ minWidth: "213px" }, { children: rowId || row.id })), _jsx("div", Object.assign({ "data-testid": "ActionsColumn_IconsContainer", style: {
                         display: 'flex',
                         alignItems: 'center',
                         justifyContent: 'center',
                         gap: '5px',
-                    } }, { children: showJsonViewer && (_jsx(TransparentButton, Object.assign({ onClick: onJsonViewClick, type: "button", "data-testid": "ActionsColumn_TransparentButton" }, { children: _jsx(Tooltip, Object.assign({ title: t('jsonViewer') }, { children: _jsx(IdButtonContainer, Object.assign({ tableMode: tableMode, "data-testid": "ActionsColumn_IdButtonContainer" }, { children: tableMode === 'sheet' ? (_jsx("span", Object.assign({ style: { fontSize: '11px', fontWeight: 400 } }, { children: "View API" }))) : (_jsx(motion.img, { src: jsonBlackIcon, alt: "icon" }, "id-icon")) })) })) }))) }))] })) })));
+                    } }, { children: showJsonViewer && _jsx(StatusChip, Object.assign({ onClick: onJsonViewClick }, { children: "View API" })) }))] })) })));
 }
 export default memo(ActionsColumn);

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

@@ -42,7 +42,6 @@ export * from './ApplicationStatusCell';
 export * from './SegmentsCell';
 export * from './MarketPlaceCell';
 export * from './IndividualsCell';
-export * from './SheetViewIDButton';
 export * from './BrandsCell';
 export * from './SalesChannelCell';
 export * from './type';

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

@@ -42,7 +42,6 @@ export * from './ApplicationStatusCell';
 export * from './SegmentsCell';
 export * from './MarketPlaceCell';
 export * from './IndividualsCell';
-export * from './SheetViewIDButton';
 export * from './BrandsCell';
 export * from './SalesChannelCell';
 export * from './type';

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

@@ -1,5 +1,4 @@
 /// <reference types="react" />
-import { TableMode } from '../../../types/index.js';
 export declare const GeographyBox: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
     variant?: "Local" | "Global" | "Regional" | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
@@ -272,9 +271,7 @@ export declare const StarBadgeWrapper: import("@emotion/styled").StyledComponent
     isShown?: boolean | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const CountBadge: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
-export declare const IdButtonContainer: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
-    tableMode?: TableMode | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const IdButtonContainer: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const AvatarStyled: import("@emotion/styled").StyledComponent<import("@mui/material").AvatarOwnProps & import("@mui/material").AvatarSlotsAndSlotProps & 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;
 }, "className" | "style" | "classes" | "children" | "sx" | "src" | "alt" | "variant" | "slots" | "slotProps" | "sizes" | "srcSet" | "imgProps"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

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

@@ -63,12 +63,15 @@ export const CountBadge = styled('span')(({ theme }) => ({
     fontSize: '9.782px',
     fontWeight: 600,
 }));
-export const IdButtonContainer = styled('div', {
-    shouldForwardProp: (props) => props !== 'tableMode',
-})(({ tableMode }) => (Object.assign({ display: 'flex', width: '24px', height: tableMode === 'sheet' ? '18px' : '24px', alignItems: 'center', justifyContent: 'center', borderRadius: '64px;', border: '1px solid #F2F2F2;' }, (tableMode === 'sheet' && {
-    width: '100%',
-    padding: '5px 8px',
-}))));
+export const IdButtonContainer = styled('div')(({ theme }) => ({
+    display: 'flex',
+    width: '24px',
+    height: '24px',
+    alignItems: 'center',
+    justifyContent: 'center',
+    borderRadius: '64px;',
+    border: '1px solid #F2F2F2;',
+}));
 export const AvatarStyled = styled(Avatar)(({ theme }) => ({
     width: 24,
     height: 24,

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@tap-payments/os-micro-frontend-shared",
   "description": "Shared components and utilities for Tap Payments micro frontends",
-  "version": "0.0.235-test.1",
-  "testVersion": 1,
+  "version": "0.0.236-test.2",
+  "testVersion": 2,
   "type": "module",
   "main": "build/index.js",
   "module": "build/index.js",

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

@@ -1,7 +0,0 @@
-/// <reference types="react" />
-interface SheetViewIDButtonI {
-    rowId?: string;
-}
-declare function SheetViewIDButton({ rowId }: SheetViewIDButtonI): import("react/jsx-runtime").JSX.Element;
-declare const _default: import("react").MemoExoticComponent<typeof SheetViewIDButton>;
-export default _default;

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

@@ -1,35 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { memo, useState } from 'react';
-import Box from '@mui/material/Box';
-import { useTranslation } from 'react-i18next';
-import Tooltip from '../../../Tooltip';
-import { greenCheckIcon } from '../../../../constants/index.js';
-import { copyText } from '../../../../utils/index.js';
-import { RowId, Button } from './style';
-function SheetViewIDButton({ rowId }) {
-    const [showCopy, setShowCopy] = useState(false);
-    const { t } = useTranslation();
-    const handleCopyRowId = () => {
-        if (rowId && !showCopy) {
-            setShowCopy(true);
-            copyText(rowId);
-            const timer = setTimeout(() => {
-                setShowCopy(false);
-            }, 2000);
-            return () => {
-                clearTimeout(timer);
-            };
-        }
-    };
-    return (_jsx(Tooltip, Object.assign({ title: t('copy') }, { children: _jsxs(Button, Object.assign({ sx: { minWidth: '213px' }, onClick: handleCopyRowId }, { children: [_jsx(RowId, Object.assign({ style: { visibility: showCopy ? 'hidden' : 'visible' } }, { children: rowId })), showCopy && (_jsx(Box, Object.assign({ sx: {
-                        position: 'absolute',
-                        top: 0,
-                        left: 0,
-                        right: 0,
-                        bottom: 0,
-                        display: 'flex',
-                        alignItems: 'center',
-                        justifyContent: 'center',
-                    } }, { children: _jsx(Box, { component: "img", src: greenCheckIcon, alt: "copied", sx: { width: 14, height: 14 } }) })))] })) })));
-}
-export default memo(SheetViewIDButton);

package/build/components/TableCells/CustomCells/SheetViewIDButton/index.d.ts

@@ -1 +0,0 @@
-export { default } from './SheetViewIDButton';

package/build/components/TableCells/CustomCells/SheetViewIDButton/index.js

@@ -1 +0,0 @@
-export { default } from './SheetViewIDButton';

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

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-export declare const Button: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const RowId: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/build/components/TableCells/CustomCells/SheetViewIDButton/style.js

@@ -1,22 +0,0 @@
-import { styled } from '@mui/material/styles';
-export const Button = styled('div')(({ theme }) => ({
-    position: 'relative',
-    display: 'flex',
-    alignItems: 'center',
-    gap: theme.spacing(1),
-    cursor: 'pointer',
-    justifyContent: 'center',
-    paddingInline: '8px',
-    borderRadius: '24px',
-    border: `1px solid ${theme.palette.divider}`,
-}));
-export const RowId = styled('div')(({ theme }) => ({
-    fontSize: '11px',
-    height: '18px',
-    display: 'flex',
-    alignItems: 'center',
-    fontWeight: 400,
-    whiteSpace: 'nowrap',
-    overflow: 'hidden',
-    textOverflow: 'ellipsis',
-}));