@tap-payments/os-micro-frontend-shared 0.1.321 → 0.1.322

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

@@ -1,3 +1,3 @@
 import { ChipProps } from './type';
-declare const StatusChip: ({ children, unknownText, copyText, expandDirection, chipStyles, containerStyles, ...props }: ChipProps) => import("react/jsx-runtime").JSX.Element;
+declare const StatusChip: ({ children, unknownText, copyText, expandDirection, chipStyles, containerStyles, fullWidth, ...props }: ChipProps) => import("react/jsx-runtime").JSX.Element;
 export default StatusChip;

package/build/components/StatusChip/StatusChip.js

@@ -18,7 +18,7 @@ import { copyIcon, greenCheckIcon } from '../../constants/index.js';
 import { ChipStyled, Wrapper, CopyWrapper } from './style';
 import { emptyStatusChipColors } from '../../constants/index.js';
 const StatusChip = (_a) => {
-    var { children, unknownText, copyText, expandDirection = 'right', chipStyles, containerStyles } = _a, props = __rest(_a, ["children", "unknownText", "copyText", "expandDirection", "chipStyles", "containerStyles"]);
+    var { children, unknownText, copyText, expandDirection = 'right', chipStyles, containerStyles, fullWidth = false } = _a, props = __rest(_a, ["children", "unknownText", "copyText", "expandDirection", "chipStyles", "containerStyles", "fullWidth"]);
     const [showCopy, setShowCopy] = useState(false);
     const { t } = useTranslation();
     const isSelected = props.isSelected;
@@ -39,9 +39,9 @@ const StatusChip = (_a) => {
         }
     };
     const isCopyActive = isSelected && copyText;
-    return (_jsxs(motion.div, Object.assign({ style: Object.assign({ position: 'relative' }, containerStyles), animate: { zIndex: isSelected ? 3 : 0 } }, { children: [_jsx(ChipStyled, Object.assign({}, props, { sx: { visibility: 'hidden', pointerEvents: 'none' } }, { children: _jsx(Wrapper, { children: children }) })), _jsx(motion.div, Object.assign({ style: { position: 'absolute', top: 0, zIndex: isSelected ? 3 : 0 }, animate: {
+    return (_jsxs(motion.div, Object.assign({ style: Object.assign(Object.assign({ position: 'relative' }, containerStyles), { width: fullWidth ? '100%' : 'auto' }), animate: { zIndex: isSelected ? 3 : 0 } }, { children: [_jsx(ChipStyled, Object.assign({}, props, { sx: { visibility: 'hidden', pointerEvents: 'none', width: fullWidth ? '100%' : 'auto' } }, { children: _jsx(Wrapper, { children: children }) })), _jsx(motion.div, Object.assign({ style: { position: 'absolute', top: 0, zIndex: isSelected ? 3 : 0, width: fullWidth ? '100%' : 'auto' }, animate: {
                     left: isCopyActive && expandDirection === 'left' ? -12 : 0,
-                }, transition: { delay: isSelected ? 0 : 0.3, duration: 0.2 } }, { children: _jsx(ChipStyled, Object.assign({}, props, { isSelected: isSelected }, chipStyles, { children: _jsxs(motion.div, Object.assign({ layout: "size", style: { display: 'flex', gap: '4px' }, animate: {
+                }, transition: { delay: isSelected ? 0 : 0.3, duration: 0.2 } }, { children: _jsx(ChipStyled, Object.assign({}, props, { isSelected: isSelected, sx: { width: fullWidth ? '100%' : 'auto' } }, chipStyles, { children: _jsxs(motion.div, Object.assign({ layout: "size", style: { display: 'flex', gap: '4px', maxWidth: fullWidth ? '100%' : 'auto' }, animate: {
                             paddingRight: isCopyActive ? 12 : 0,
                         }, transition: { delay: isSelected ? 0 : 0.3, duration: 0.2 } }, { children: [_jsx(Wrapper, Object.assign({ "data-is-arabic": typeof children === 'string' && isArabic(children) }, { children: children })), _jsx(AnimatePresence, { children: isCopyActive && (_jsx(CopyWrapper, { children: _jsx(motion.img, { initial: { opacity: 0, x: -5 }, animate: { opacity: 1, x: 0 }, exit: { opacity: 0, x: -2 }, transition: { duration: 0.1 }, onClick: handleCopy, src: showCopy ? greenCheckIcon : copyIcon, style: {
                                             height: 12,

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

@@ -16,6 +16,7 @@ export declare const ChipStyled: import("@emotion/styled").StyledComponent<impor
     chipStyles?: object | undefined;
     disableAnimation?: boolean | undefined;
     containerStyles?: object | undefined;
+    fullWidth?: 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/styles").Theme>> & {

package/build/components/StatusChip/style.js

@@ -17,11 +17,13 @@ export const ChipStyled = styled(Box, {
     }));
 });
 export const Wrapper = styled(Box)(() => ({
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'center',
     gap: '4px',
     textAlign: 'center',
+    overflow: 'hidden',
+    textOverflow: 'ellipsis',
+    whiteSpace: 'nowrap',
+    minWidth: 0,
+    flex: 1,
 }));
 export const CopyWrapper = styled(Box)(() => ({
     position: 'absolute',

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

@@ -15,4 +15,5 @@ export type ChipProps = PropsWithChildren<{
     chipStyles?: object;
     disableAnimation?: boolean;
     containerStyles?: object;
+    fullWidth?: boolean;
 } & BoxProps>;

package/build/components/StatusChipWithCopy/StatusChipWithCopy.d.ts

@@ -6,6 +6,7 @@ export interface StatusChipWithCopyProps extends StatusChipProps {
     chipIndex: number;
     selectionProps: SelectionProps;
     chipStyles?: object;
+    fullWidth?: boolean;
 }
 declare function StatusChipWithCopy({ children, copyText, chipIndex, selectionProps: { onClick, rowIndex, colIndex, selectedId }, ...rest }: StatusChipWithCopyProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof StatusChipWithCopy>;

package/build/components/TableCells/CustomCells/DestinationCell/DestinationCellSheet.js

@@ -9,7 +9,7 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 import Box from '@mui/material/Box';
 import { formatAmount } from '../../../../utils/index.js';
 import { CurrencySymbol, StatusGroupChips } from '../../../index.js';
@@ -20,7 +20,7 @@ function DestinationCellSheet(_a) {
         const formattedDestAmount = formatAmount((dest === null || dest === void 0 ? void 0 : dest.amount) || 0);
         return {
             key: `destination-${(dest === null || dest === void 0 ? void 0 : dest.id) || index}`,
-            content: (_jsxs(_Fragment, { children: [_jsxs("div", { children: [dest === null || dest === void 0 ? void 0 : dest.id, " |"] }), _jsx(CurrencySymbol, { currency: dest === null || dest === void 0 ? void 0 : dest.currency }), _jsxs("span", { children: [formattedDestAmount.integerAmount, ".", formattedDestAmount.decimalAmount] })] })),
+            content: (_jsxs(Box, Object.assign({ sx: { display: 'flex', alignItems: 'center', gap: '4px' } }, { children: [_jsxs("div", { children: [dest === null || dest === void 0 ? void 0 : dest.id, " |"] }), _jsx(CurrencySymbol, { currency: dest === null || dest === void 0 ? void 0 : dest.currency }), _jsxs("span", { children: [formattedDestAmount.integerAmount, ".", formattedDestAmount.decimalAmount] })] }))),
             chipIndex: index,
             selectionProps: selectionProps !== null && selectionProps !== void 0 ? selectionProps : {},
             copyText: `${formattedDestAmount.integerAmount}.${formattedDestAmount.decimalAmount}`,

package/build/components/VirtualTables/components/TableRow.js

@@ -71,7 +71,7 @@ function TableRow({ row, columns, index, rowProps, isSheetView, selectedCell = n
                     })
                     : {};
                 const isIndexColumn = column.pinned === 'start' && effectiveFirst;
-                return (_jsx(StyledCell, Object.assign({ component: "div", "data-testid": "TableRow_TableCell", "data-column-id": column.id, "data-column-width": column.width, "data-column-width-used": column.width, "data-column-align": column.align, "data-column-order": column.order, "data-column-header": typeof column.header === 'string' ? column.header : 'component', "data-column-sortable": !!column.sortable, "data-column-filterable": !!column.filter, isFirst: effectiveFirst, isLast: effectiveLast, onClick: handleCellClick(colIndex, column.pinned), sx: Object.assign(Object.assign(Object.assign({ width: column.width, minWidth: column.width, textAlign: column.align, justifyContent: isIndexColumn ? 'center' : column.align === 'right' ? 'flex-end' : 'flex-start', cursor: onCellClick ? 'pointer' : 'default' }, selectionStyles), rowSelectionBorderStyles), column.cellStyle), isSheetView: isSheetView, isSelected: isCellSelected }, { children: isSheetView ? (_jsx(Box, Object.assign({ sx: { position: 'relative', zIndex: 1 } }, { children: renderCell(column, index, colIndex) }))) : (_jsx(_Fragment, { children: renderCell(column, index, colIndex) })) }), `${column.id}-${colIndex}`));
+                return (_jsx(StyledCell, Object.assign({ component: "div", "data-testid": "TableRow_TableCell", "data-column-id": column.id, "data-column-width": column.width, "data-column-width-used": column.width, "data-column-align": column.align, "data-column-order": column.order, "data-column-header": typeof column.header === 'string' ? column.header : 'component', "data-column-sortable": !!column.sortable, "data-column-filterable": !!column.filter, isFirst: effectiveFirst, isLast: effectiveLast, onClick: handleCellClick(colIndex, column.pinned), sx: Object.assign(Object.assign(Object.assign({ width: column.width, minWidth: column.width, textAlign: column.align, justifyContent: isIndexColumn ? 'center' : column.align === 'right' ? 'flex-end' : 'flex-start', cursor: onCellClick ? 'pointer' : 'default' }, selectionStyles), rowSelectionBorderStyles), column.cellStyle), isSheetView: isSheetView, isSelected: isCellSelected }, { children: isSheetView ? (_jsx(Box, Object.assign({ sx: { position: 'relative', zIndex: 1, width: '100%' } }, { children: renderCell(column, index, colIndex) }))) : (_jsx(_Fragment, { children: renderCell(column, index, colIndex) })) }), `${column.id}-${colIndex}`));
             }) }));
     }, [
         columns,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tap-payments/os-micro-frontend-shared",
   "description": "Shared components and utilities for Tap Payments micro frontends",
-  "version": "0.1.321",
+  "version": "0.1.322",
   "testVersion": 0,
   "type": "module",
   "main": "build/index.js",