@tap-payments/os-micro-frontend-shared 0.1.215 → 0.1.217

package/build/components/InputBase/SelectBase/SelectBase.js

@@ -32,7 +32,7 @@ function SelectBase(_a, ref) {
                             (options === null || options === void 0 ? void 0 : options.map((option, idx) => {
                                 var _a;
                                 const isSelected = isOptionEqualToValue ? isOptionEqualToValue(option, value) : (option === null || option === void 0 ? void 0 : option.id) === (value === null || value === void 0 ? void 0 : value.id);
-                                return (_jsx(MenuItem, Object.assign({ value: (_a = (getOptionValue ? getOptionValue(option) : option === null || option === void 0 ? void 0 : option.id)) !== null && _a !== void 0 ? _a : '', onClick: () => {
+                                return (_jsx(MenuItem, Object.assign({ disabled: !!option.disabled, value: (_a = (getOptionValue ? getOptionValue(option) : option === null || option === void 0 ? void 0 : option.id)) !== null && _a !== void 0 ? _a : '', onClick: () => {
                                         handleChange(option);
                                     }, sx: {
                                         fontSize: '12px',

package/build/components/VirtualTables/SheetViewVirtualTable/features/resize/hooks/useColumnResize.js

@@ -36,6 +36,8 @@ export const useColumnResize = ({ columns, onColumnResize, handleColumnClick, wi
     const isResizingRef = useRef(false);
     const initialCursorYRef = useRef(0);
     const clampedXRef = useRef(0);
+    const startXRef = useRef(0);
+    const startWidthRef = useRef(0);
     const mouseMoveRef = useRef();
     const mouseUpRef = useRef();
     useEffect(() => {
@@ -64,7 +66,7 @@ export const useColumnResize = ({ columns, onColumnResize, handleColumnClick, wi
         return createResizeEndHandler(windowId, serviceCode, onColumnResize, setResizeState, cleanupEventListeners, isResizingRef, clampedXRef)(columnId, currentWidth, startX);
     }, [windowId, serviceCode, onColumnResize, cleanupEventListeners]);
     const createMouseMoveHandlerCallback = useCallback((columnIndex, columnPinned) => {
-        return createMouseMoveHandler(setResizeState, setCursorPosition, initialCursorYRef, tableContainerRef, columnIndex, columnPinned, clampedXRef);
+        return createMouseMoveHandler(setResizeState, setCursorPosition, initialCursorYRef, tableContainerRef, columnIndex, columnPinned, clampedXRef, startXRef, startWidthRef);
     }, [tableContainerRef]);
     const startResize = useCallback((e, columnId) => {
         e.preventDefault();
@@ -89,6 +91,8 @@ export const useColumnResize = ({ columns, onColumnResize, handleColumnClick, wi
             setResizeState((prev) => (Object.assign(Object.assign({}, prev), { isResizing: true, resizingColumn: columnId, startX, startWidth: currentWidth, resizeIndicatorX: startX, resizingColumnIndex: columnIndex, resizingColumnPinned: columnPinned })));
             initialCursorYRef.current = iconY;
             clampedXRef.current = startX;
+            startXRef.current = startX;
+            startWidthRef.current = currentWidth;
             setCursorPosition({ x: startX, y: iconY });
             isResizingRef.current = true;
             // Create and store event handlers

package/build/components/VirtualTables/SheetViewVirtualTable/features/resize/styles.js

@@ -9,7 +9,7 @@ export const StyledResizeIcon = styled('div', {
     width: 20,
     height: '100%',
     backgroundColor: 'transparent',
-    zIndex: 100000,
+    zIndex: 100001,
     display: 'flex',
     alignItems: 'center',
     justifyContent: 'center',

package/build/components/VirtualTables/SheetViewVirtualTable/features/resize/utils/resize.d.ts

@@ -13,6 +13,6 @@ export declare const createMouseUpHandler: (columnId: string, currentWidth: numb
 export declare const createMouseMoveHandler: (setResizeState: React.Dispatch<React.SetStateAction<ColumnResizeState>>, setCursorPosition: React.Dispatch<React.SetStateAction<{
     x: number;
     y: number;
-}>>, initialCursorYRef: React.MutableRefObject<number>, tableContainerRef?: React.RefObject<HTMLDivElement>, resizingColumnIndex?: number, resizingColumnPinned?: 'start' | 'end', clampedXRef?: React.MutableRefObject<number>) => (mouseEvent: MouseEvent) => void;
+}>>, initialCursorYRef: React.MutableRefObject<number>, tableContainerRef?: React.RefObject<HTMLDivElement>, resizingColumnIndex?: number, resizingColumnPinned?: 'start' | 'end', clampedXRef?: React.MutableRefObject<number>, startXRef?: React.MutableRefObject<number>, startWidthRef?: React.MutableRefObject<number>) => (mouseEvent: MouseEvent) => void;
 export declare const getColumnWidthFromState: (columnWidths: Record<string, number>, columnId: string) => number;
 export declare const createResizeEndHandler: (windowId: string | undefined, serviceCode: string | undefined, onColumnResize: ((columnId: string, width: number) => void) | undefined, setResizeState: React.Dispatch<React.SetStateAction<ColumnResizeState>>, cleanupFn: () => void, isResizingRef: React.MutableRefObject<boolean>, clampedXRef: React.MutableRefObject<number>) => (columnId: string, currentWidth: number, startX: number) => (event: MouseEvent) => void;

package/build/components/VirtualTables/SheetViewVirtualTable/features/resize/utils/resize.js

@@ -66,7 +66,7 @@ export const createMouseUpHandler = (columnId, currentWidth, startX, windowId, s
         }
     };
 };
-export const createMouseMoveHandler = (setResizeState, setCursorPosition, initialCursorYRef, tableContainerRef, resizingColumnIndex, resizingColumnPinned, clampedXRef) => {
+export const createMouseMoveHandler = (setResizeState, setCursorPosition, initialCursorYRef, tableContainerRef, resizingColumnIndex, resizingColumnPinned, clampedXRef, startXRef, startWidthRef) => {
     return (mouseEvent) => {
         try {
             let clampedX = mouseEvent.clientX;
@@ -85,9 +85,22 @@ export const createMouseMoveHandler = (setResizeState, setCursorPosition, initia
             if (clampedXRef) {
                 clampedXRef.current = clampedX;
             }
-            setResizeState((prev) => (Object.assign(Object.assign({}, prev), { resizeIndicatorX: clampedX })));
+            // Calculate the indicator position capped at minimum column width
+            let indicatorX = clampedX;
+            if (startXRef && startWidthRef) {
+                // Calculate the minimum position: start position minus how much we can shrink
+                // The left edge of the column is at (startX - startWidth)
+                // The minimum right edge position is at (leftEdge + MIN_WIDTH)
+                const minPositionX = startXRef.current - startWidthRef.current + COLUMN_WIDTH_CONSTRAINTS.MIN_WIDTH;
+                // Cap the indicator at the minimum position when dragging left past minimum
+                // This ensures smooth behavior: indicator only moves when cursor is to the right of minimum position
+                if (clampedX < minPositionX) {
+                    indicatorX = minPositionX;
+                }
+            }
+            setResizeState((prev) => (Object.assign(Object.assign({}, prev), { resizeIndicatorX: indicatorX })));
             setCursorPosition({
-                x: clampedX,
+                x: indicatorX,
                 y: initialCursorYRef.current,
             });
         }

package/build/constants/assets.d.ts

@@ -554,3 +554,4 @@ export declare const exclamationOutlinedOrangeCircle: string;
 export declare const activeGreenIcon: string;
 export declare const inActiveGreyIcon: string;
 export declare const terminalLinkVideo: string;
+export declare const bluePlusIcon: string;

package/build/constants/assets.js

@@ -562,3 +562,4 @@ export const exclamationOutlinedOrangeCircle = `${lightUrl}/exclamationOutlinedO
 export const activeGreenIcon = `${lightUrl}/activeGreenIcon.svg`;
 export const inActiveGreyIcon = `${lightUrl}/inActiveGreyIcon.svg`;
 export const terminalLinkVideo = `${videosUrl}/terminal_link.mp4`;
+export const bluePlusIcon = `${lightUrl}/bluePlusIcon.svg`;

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.215",
+  "version": "0.1.217",
   "testVersion": 11,
   "type": "module",
   "main": "build/index.js",