@tap-payments/os-micro-frontend-shared 0.0.36 → 0.0.39

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

@@ -15,7 +15,7 @@ export declare const Charge: import("@emotion/styled").StyledComponent<import("@
 export declare const DropDownChargeGapColumn: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const StyledAmount: import("@emotion/styled").StyledComponent<Pick<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & {
     ref?: ((instance: HTMLInputElement | null) => void) | import("react").RefObject<HTMLInputElement> | null | undefined;
-}, "width" | "height" | "hidden" | "type" | "style" | "color" | "content" | "translate" | "children" | "ref" | "form" | "slot" | "title" | "pattern" | "key" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "enterKeyHint" | "lang" | "nonce" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "exportparts" | "part" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "list" | "value" | "src" | "alt" | "size" | "multiple" | "accept" | "autoComplete" | "capture" | "checked" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "max" | "min" | "minLength" | "name" | "readOnly" | "required"> & {
+}, "width" | "height" | "hidden" | "type" | "style" | "color" | "content" | "translate" | "children" | "ref" | "form" | "slot" | "title" | "pattern" | "key" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "enterKeyHint" | "lang" | "nonce" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "exportparts" | "part" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "list" | "value" | "name" | "src" | "alt" | "size" | "multiple" | "accept" | "autoComplete" | "capture" | "checked" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "max" | "min" | "minLength" | "readOnly" | "required"> & {
     allowDecimals?: boolean | undefined;
     allowNegativeValue?: boolean | undefined;
     id?: string | undefined;

package/build/components/OTPInput/OTPInput.d.ts

@@ -5,6 +5,6 @@ interface OTPInputProps extends Omit<OtpInputProps, 'numInputs' | 'onChange'> {
     onChange?: (otp: string) => void;
     onSubmitOtp?: (otp: string) => void;
 }
-declare function OTPInput({ numInputs, separateAfter, isInputSecure, isInputNum, onSubmitOtp, onChange, ...props }: OTPInputProps): import("react/jsx-runtime").JSX.Element;
+declare function OTPInput({ numInputs, separateAfter, isInputSecure, isInputNum, onSubmitOtp, onChange, inputProps, ...props }: OTPInputProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof OTPInput>;
 export default _default;

package/build/components/OTPInput/OTPInput.js

@@ -12,10 +12,10 @@ var __rest = (this && this.__rest) || function (s, e) {
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useState, memo } from 'react';
 import Box from '@mui/material/Box';
-import Input from 'react18-input-otp';
+import OtpInput from 'react18-input-otp';
 import { inputFocusStyle, inputStyle, inputErrorStyle, Separator } from './style';
 function OTPInput(_a) {
-    var { numInputs = 6, separateAfter = 3, isInputSecure = true, isInputNum = true, onSubmitOtp, onChange } = _a, props = __rest(_a, ["numInputs", "separateAfter", "isInputSecure", "isInputNum", "onSubmitOtp", "onChange"]);
+    var { numInputs = 6, separateAfter = 3, isInputSecure = true, isInputNum = true, onSubmitOtp, onChange, inputProps } = _a, props = __rest(_a, ["numInputs", "separateAfter", "isInputSecure", "isInputNum", "onSubmitOtp", "onChange", "inputProps"]);
     const [otp, setOtp] = useState('');
     const handleChange = (enteredOtp) => {
         setOtp(enteredOtp);
@@ -28,6 +28,9 @@ function OTPInput(_a) {
             '::selection': {
                 background: 'transparent',
             },
-        } }, { children: _jsx(Input, Object.assign({ inputStyle: Object.assign(Object.assign({}, inputStyle), props.inputProps), focusStyle: inputFocusStyle, errorStyle: inputErrorStyle, value: otp, separator: _jsx(Separator, { children: "-" }), isInputNum: isInputNum, isInputSecure: isInputSecure, numInputs: numInputs, separateAfter: separateAfter, shouldAutoFocus: true, onChange: handleChange }, props)) })));
+        } }, { children: _jsx(OtpInput, Object.assign({ inputStyle: Object.assign(Object.assign({}, inputStyle), inputProps), focusStyle: inputFocusStyle, errorStyle: inputErrorStyle, containerStyle: {
+                gap: '7px',
+                justifyContent: 'space-between',
+            }, value: otp, separator: _jsx(Separator, { children: "-" }), isInputNum: isInputNum, isInputSecure: isInputSecure, numInputs: numInputs, separateAfter: separateAfter, shouldAutoFocus: true, onChange: handleChange, autoComplete: "new-password", "aria-autocomplete": "none", inputProps: Object.assign({ autoComplete: 'new-password', 'aria-autocomplete': 'none', pattern: '[0-9]*' }, inputProps) }, props)) })));
 }
 export default memo(OTPInput);

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

@@ -7,7 +7,6 @@ export declare const inputStyle: {
     border: string;
     caretColor: string;
     outline: string;
-    margin: string;
     userSelect: string;
     color: string;
 };

package/build/components/OTPInput/style.js

@@ -7,7 +7,6 @@ export const inputStyle = {
     border: `1px solid #f2f2f2`,
     caretColor: 'transparent',
     outline: 'none',
-    margin: '0 4px',
     userSelect: 'none !important',
     color: '#20232B',
 };

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

@@ -269,6 +269,7 @@ export declare const StyledInput: import("@emotion/styled").StyledComponent<{
     placeholder?: string | undefined;
     list?: string | undefined;
     value?: string | number | readonly string[] | undefined;
+    name?: string | undefined;
     src?: string | undefined;
     alt?: string | undefined;
     size?: number | undefined;
@@ -286,7 +287,6 @@ export declare const StyledInput: import("@emotion/styled").StyledComponent<{
     maxLength?: number | undefined;
     min?: string | number | undefined;
     minLength?: number | undefined;
-    name?: string | undefined;
     readOnly?: boolean | undefined;
     required?: boolean | undefined;
     step?: string | number | undefined;

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

@@ -11,7 +11,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import Tooltip from '../../../Tooltip';
-import { reversedIcon } from '../../../../constants/index.js';
+import { destinationSolidIcon } from '../../../../constants/index.js';
 import { formatAmount } from '../../../../utils/index.js';
 import { DestinationCellContainer, DestinationCount, StyledDestinationCell, StyledDestinationIcon } from './styled';
 import TableCell from '../../TableCell';
@@ -33,6 +33,6 @@ function DestinationCell(_a) {
     return (_jsx(TableCell, Object.assign({ sx: {
             width: 'fit-content',
             overflow: 'visible',
-        } }, props, { children: _jsx(Tooltip, Object.assign({ title: destinationsTooltip }, { children: !isTextShown ? (_jsxs(StyledDestinationCell, { children: [_jsx(StyledDestinationIcon, { src: reversedIcon, pointLeft: iconDirection === 'left' }), destinationsCount > 1 && (_jsx(DestinationCellContainer, Object.assign({ destinationsCount: 1 }, { children: _jsx(DestinationCount, { children: destinationsCount }) })))] })) : (textView) })) })));
+        } }, props, { children: _jsx(Tooltip, Object.assign({ title: destinationsTooltip }, { children: !isTextShown ? (_jsxs(StyledDestinationCell, { children: [_jsx(StyledDestinationIcon, { src: destinationSolidIcon, pointLeft: iconDirection === 'left' }), destinationsCount > 1 && (_jsx(DestinationCellContainer, Object.assign({ destinationsCount: 1 }, { children: _jsx(DestinationCount, { children: destinationsCount }) })))] })) : (textView) })) })));
 }
 export default DestinationCell;

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

@@ -10,19 +10,23 @@ export const DestinationCellContainer = styled('span')(({ theme, destinationsCou
 }));
 export const DestinationCount = styled('span')(({ theme }) => ({
     fontSize: theme.typography.pxToRem(12),
-    fontWeight: 500,
-    color: theme.palette.common.black,
-    backgroundColor: theme.palette.common.white,
+    color: theme.palette.info.dark,
+    fontWeight: 700,
     paddingInline: theme.spacing(1),
     borderRadius: theme.spacing(1),
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    backgroundColor: `${theme.palette.info.dark}1A`,
 }));
 export const StyledDestinationCell = styled('span')(({ theme }) => ({
     display: 'flex',
     alignItems: 'center',
     justifyContent: 'flex-start',
     gap: theme.spacing(1),
-    backgroundColor: `${theme.palette.info.dark}1A`,
-    paddingInline: theme.spacing(0.71875),
+    backgroundColor: theme.palette.common.white,
+    border: `1px solid ${theme.palette.divider}`,
+    paddingInline: theme.spacing(1),
     borderRadius: '56px',
     height: '24px',
 }));

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

@@ -15,7 +15,7 @@ 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';
 export const StatusButton = memo((props) => {
     var _a, _b;
@@ -30,7 +30,7 @@ export const StatusButton = memo((props) => {
     };
     const Button = statusButtonVariants[variant];
     const hasDropdown = dropdownOptions && dropdownOptions.length > 0;
-    const statusIcon = icon ? _jsx(StatusIcon, { icon: icon, variant: variant, src: statusButtonIcons[icon], alt: `${icon}-icon` }) : null;
+    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) => {

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

@@ -18,7 +18,7 @@ export declare const CountBadge: import("@emotion/styled").StyledComponent<impor
 }, keyof import("@mui/system").BoxOwnProps<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme> & {
     variant: StatusButtonVariant;
 }, {}, {}>;
-export declare const StatusIcon: import("@emotion/styled").StyledComponent<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" | "view" | "reports" | "chevronDown" | "unAuthorized" | "openFlag" | "closedFlag" | "textView" | "trashBin" | undefined;
 }, React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;

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

@@ -26,7 +26,7 @@ export const CountBadge = styled(Box)(({ theme, variant }) => ({
     fontWeight: 700,
     lineHeight: '10px',
 }));
-export const StatusIcon = styled('img')(({ theme, variant, icon }) => {
+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' && {

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

@@ -1,5 +1,4 @@
-import TableHeader from './TableHeader';
-export default TableHeader;
+export { default as TableHeader } from './TableHeader';
 export * from './style';
 export { FiltersRow } from './FiltersRow';
 export * from './components';

package/build/components/TableHeader_V2/index.js

@@ -1,5 +1,4 @@
-import TableHeader from './TableHeader';
-export default TableHeader;
+export { default as TableHeader } from './TableHeader';
 export * from './style';
 export { FiltersRow } from './FiltersRow';
 export * from './components';

package/build/components/VirtualTable/components/ColumnFilter/Inputs/Inputs.js

@@ -4,79 +4,30 @@ import Box from '@mui/material/Box';
 import Collapse from '@mui/material/Collapse';
 import lodashValues from 'lodash/values';
 import { useTranslation } from 'react-i18next';
-import { PhoneInputBase } from '../../../../InputBase';
 import { grayCloseIcon, searchIcon } from '../../../../../constants/index.js';
 import { Wrapper, Text, InputStyled, InputsWrapper, ClearButton, ClearWrapper } from './style';
 import { CancelButton, Footer, OkayButton } from '../style';
 function Inputs({ onCloseDropdown, filter: { options = [], onConfirm, data, isOnlyOneFilter } }) {
     const [values, setValues] = useState({});
     useEffect(() => {
-        setValues((options || []).reduce((acc, { apiKey, type }) => {
-            var _a;
-            const optionData = data === null || data === void 0 ? void 0 : data[apiKey];
-            if (type === 'phone') {
-                const phoneData = optionData;
-                return Object.assign(Object.assign({}, acc), { [apiKey]: (_a = phoneData === null || phoneData === void 0 ? void 0 : phoneData.phone) !== null && _a !== void 0 ? _a : '', [`${apiKey}_country`]: phoneData === null || phoneData === void 0 ? void 0 : phoneData.country });
-            }
-            return Object.assign(Object.assign({}, acc), { [apiKey]: optionData !== null && optionData !== void 0 ? optionData : '' });
-        }, {}));
+        setValues((options || []).reduce((acc, { apiKey }) => { var _a; return (Object.assign(Object.assign({}, acc), { [apiKey]: (_a = data === null || data === void 0 ? void 0 : data[apiKey]) !== null && _a !== void 0 ? _a : '' })); }, {}));
     }, []);
     const { t } = useTranslation();
     const onClickOkay = () => {
-        const transformedValues = options.reduce((acc, { apiKey, type }) => {
-            if (type === 'phone') {
-                const phoneValue = values[apiKey];
-                const countryValue = values[`${apiKey}_country`];
-                if (phoneValue || countryValue) {
-                    acc[apiKey] = {
-                        phone: phoneValue || '',
-                        country: countryValue,
-                    };
-                }
-            }
-            else {
-                const value = values[apiKey];
-                if (value !== undefined && value !== '') {
-                    acc[apiKey] = value;
-                }
-            }
-            return acc;
-        }, {});
-        onConfirm === null || onConfirm === void 0 ? void 0 : onConfirm(transformedValues);
+        onConfirm === null || onConfirm === void 0 ? void 0 : onConfirm(values);
         onCloseDropdown();
     };
     const onClickCancel = () => {
         onCloseDropdown();
     };
     const onClickClear = () => {
-        setValues(options.reduce((acc, { apiKey, type }) => {
-            if (type === 'phone') {
-                return Object.assign(Object.assign({}, acc), { [apiKey]: '', [`${apiKey}_country`]: undefined });
-            }
-            return Object.assign(Object.assign({}, acc), { [apiKey]: '' });
-        }, {}));
+        setValues(options.reduce((acc, { apiKey }) => (Object.assign(Object.assign({}, acc), { [apiKey]: '' })), {}));
     };
-    const isInputHasValue = (key, type) => {
-        if (type === 'phone') {
-            return values[key] !== undefined && typeof values[key] === 'string' && values[key].length > 0 && values[`${key}_country`] !== undefined;
-        }
-        return values[key] !== undefined && typeof values[key] === 'string' && values[key].length > 0;
-    };
-    const getInputValue = (key, type) => {
-        if (type === 'phone') {
-            return values[key] !== undefined && typeof values[key] === 'string' && values[key].length ? values[key] : '';
-        }
-        return values[key] !== undefined && typeof values[key] === 'string' && values[key].length ? values[key] : '';
-    };
-    const onClickResetInput = (key, type) => {
-        if (isInputHasValue(key, type)) {
-            if (type === 'phone') {
-                setValues(Object.assign(Object.assign({}, values), { [key]: '', [`${key}_country`]: undefined }));
-            }
-            else {
-                setValues(Object.assign(Object.assign({}, values), { [key]: '' }));
-            }
-        }
+    const isInputHasValue = (key) => values[key] !== undefined && values[key].length > 0;
+    const getInputValue = (key) => (values[key] !== undefined && values[key].length ? values[key] : '');
+    const onClickResetInput = (key) => {
+        if (isInputHasValue(key))
+            setValues(Object.assign(Object.assign({}, values), { [key]: '' }));
     };
     const showClearButton = useMemo(() => lodashValues(values).some((x) => Boolean(x)), [values]);
     const getFilterByApiKey = useCallback((apiKey) => {
@@ -87,29 +38,14 @@ function Inputs({ onCloseDropdown, filter: { options = [], onConfirm, data, isOn
         const isAnyInputWithValue = Object.entries(values).some(([inputKey, val]) => { var _a; return Boolean(val) && (((_a = getFilterByApiKey(inputKey)) === null || _a === void 0 ? void 0 : _a.filterGroup) !== filterGroup || !filterGroup); });
         return isOnlyOneFilter && !inputWithValue && isAnyInputWithValue;
     }, [options, values, isOnlyOneFilter]);
-    return (_jsxs(Wrapper, Object.assign({ component: "article", "data-testid": "ColumnFilterInputs" }, { children: [_jsx(Text, Object.assign({ component: "header", "data-testid": "ColumnFilterInputs_title" }, { children: t('filterBy') })), _jsx(InputsWrapper, Object.assign({ "data-testid": "ColumnFilterInputs_inputs", component: "main" }, { children: options.map(({ placeholder, apiKey, isDisabled, filterGroup, customInput, type, countries, isCountriesLoading }) => {
-                    if (customInput) {
-                        return customInput({
-                            key: apiKey,
-                            value: values[apiKey],
-                            setValue: (value) => {
-                                setValues(Object.assign(Object.assign({}, values), { [apiKey]: value }));
-                            },
-                            isDisabled: isInputDisabled(apiKey, filterGroup),
-                            getInputValue: (keyToGet) => getInputValue(keyToGet, type),
-                            isInputHasValue: () => isInputHasValue(apiKey, type),
-                            onClickReset: () => {
-                                onClickResetInput(apiKey, type);
-                            },
-                        });
-                    }
-                    if (type === 'phone') {
-                        return (_jsx(PhoneInputBase, { "data-testid": `ColumnFilterInputs_PhoneInput_${apiKey}`, phoneValue: getInputValue(apiKey, 'phone'), onPhoneChange: (val) => setValues(Object.assign(Object.assign({}, values), { [apiKey]: val, [`${apiKey}_country`]: values[`${apiKey}_country`] })), countryValue: values[`${apiKey}_country`], onCountryChange: (country) => setValues(Object.assign(Object.assign({}, values), { [`${apiKey}_country`]: country, [apiKey]: values[apiKey] })), countries: countries || [], isCountriesLoading: isCountriesLoading || false, hasError: false, disabled: isDisabled || isInputDisabled(apiKey, filterGroup), placeholder: placeholder }, apiKey));
+    return (_jsxs(Wrapper, Object.assign({ component: "article", "data-testid": "ColumnFilterInputs" }, { children: [_jsx(Text, Object.assign({ component: "header", "data-testid": "ColumnFilterInputs_title" }, { children: t('filterBy') })), _jsx(InputsWrapper, Object.assign({ "data-testid": "ColumnFilterInputs_inputs", component: "main" }, { children: options.map(({ placeholder, apiKey, isDisabled, filterGroup, render }) => {
+                    if (render) {
+                        return render();
                     }
                     return (_jsx(InputStyled, { className: "input", "data-testid": "ColumnFilterInputs_InputStyled", name: apiKey, placeholder: placeholder, onChange: (e) => {
                             setValues(Object.assign(Object.assign({}, values), { [apiKey]: e.target.value }));
-                        }, disabled: isDisabled || isInputDisabled(apiKey, filterGroup), value: getInputValue(apiKey, type), inputProps: { autoComplete: 'off', 'data-testid': 'ColumnFilterInputs_input' }, endAdornment: _jsx(Box, { component: "img", "data-testid": "ColumnFilterInputs_icon", "data-icon": isInputHasValue(apiKey, type) ? 'close' : 'search', src: isInputHasValue(apiKey, type) ? grayCloseIcon : searchIcon, alt: "search", className: "icon", sx: { cursor: isInputHasValue(apiKey, type) ? 'pointer' : 'default' }, onClick: () => {
-                                onClickResetInput(apiKey, type);
+                        }, disabled: isDisabled || isInputDisabled(apiKey, filterGroup), value: getInputValue(apiKey), inputProps: { autoComplete: 'off', 'data-testid': 'ColumnFilterInputs_input' }, endAdornment: _jsx(Box, { component: "img", "data-testid": "ColumnFilterInputs_icon", "data-icon": isInputHasValue(apiKey) ? 'close' : 'search', src: isInputHasValue(apiKey) ? grayCloseIcon : searchIcon, alt: "search", className: "icon", sx: { cursor: isInputHasValue(apiKey) ? 'pointer' : 'default' }, onClick: () => {
+                                onClickResetInput(apiKey);
                             } }) }, apiKey));
                 }) })), _jsx(Collapse, Object.assign({ in: showClearButton, component: "section", "data-testid": "ColumnFilterInputs_Collapse" }, { children: _jsx(ClearWrapper, Object.assign({ "data-testid": "ColumnFilterInputs_ClearWrapper" }, { children: _jsx(ClearButton, Object.assign({ type: "button", onClick: onClickClear, "data-testid": "ColumnFilterInputs_ClearButton" }, { children: t('clear') })) })) })), _jsxs(Footer, Object.assign({ component: "footer", "data-testid": "ColumnFilterInputs_footer" }, { children: [_jsx(CancelButton, Object.assign({ type: "button", onClick: onClickCancel, "data-testid": "ColumnFilterInputs_CancelButton" }, { children: t('cancel') })), _jsx(OkayButton, Object.assign({ type: "button", onClick: onClickOkay, "data-testid": "ColumnFilterInputs_OkayButton" }, { children: t('okay') }))] }))] })));
 }

package/build/components/index.d.ts

@@ -84,3 +84,5 @@ export { default as OTPInput } from './OTPInput';
 export { default as FlagDetails } from './FlagDetails';
 export { default as TapLoader } from './Loaders';
 export { default as Error } from './Error';
+export * from './Chip';
+export * from './TableHeader_V2';

package/build/components/index.js

@@ -84,3 +84,5 @@ export { default as OTPInput } from './OTPInput';
 export { default as FlagDetails } from './FlagDetails';
 export { default as TapLoader } from './Loaders';
 export { default as Error } from './Error';
+export * from './Chip';
+export * from './TableHeader_V2';

package/build/constants/assets.d.ts

@@ -6,6 +6,7 @@ export declare const abandonedIcon: string;
 export declare const abandonedYellowIcon: string;
 export declare const chevronDownIcon: string;
 export declare const reversedIcon: string;
+export declare const destinationSolidIcon: string;
 export declare const searchIcon: string;
 export declare const unAuthorizedIcon: string;
 export declare const viewIcon: string;
@@ -425,6 +426,7 @@ export declare const fileDownloadGreyIcon: string;
 export declare const metaIcon: string;
 export declare const darkFilterIcon: string;
 export declare const homeIcon: string;
+export declare const lockIcon: string;
 export declare const autoCapturedIcon: string;
 export declare const autoVoidIcon: string;
 export declare const cancelledIcon: string;

package/build/constants/assets.js

@@ -7,6 +7,7 @@ export const abandonedIcon = `${lightUrl}/abandoned.svg`;
 export const abandonedYellowIcon = `${lightUrl}/abandonedYellow.svg`;
 export const chevronDownIcon = `${lightUrl}/chevron-down.svg`;
 export const reversedIcon = `${lightUrl}/reversed.svg`;
+export const destinationSolidIcon = `${lightUrl}/destinationSolid.svg`;
 export const searchIcon = `${lightUrl}/search.svg`;
 export const unAuthorizedIcon = `${lightUrl}/unauthorized.svg`;
 export const viewIcon = `${lightUrl}/view.svg`;
@@ -429,6 +430,7 @@ export const fileDownloadGreyIcon = `${lightUrl}/other/fileDownloadGrey.svg`;
 export const metaIcon = `${lightUrl}/meta.svg`;
 export const darkFilterIcon = `${lightUrl}/darkFilterIcon.svg`;
 export const homeIcon = `${lightUrl}/home.svg`;
+export const lockIcon = `${lightUrl}/lockIcon.svg`;
 export const autoCapturedIcon = `${lightUrl}/status-v2/autoCapturedNoBG.svg`;
 export const autoVoidIcon = `${lightUrl}/status-v2/autoVoidNoBG.svg`;
 export const cancelledIcon = `${lightUrl}/status-v2/cancelledNoBG.svg`;

package/build/types/table.d.ts

@@ -67,18 +67,7 @@ export interface IColumnFilterOption {
     options?: IColumnFilterOption[];
     isDisabled?: boolean;
     filterGroup?: string;
-    customInput?: (props: {
-        key: string;
-        value: unknown;
-        setValue: (value: unknown) => void;
-        isDisabled?: boolean;
-        getInputValue: (key: string, type?: string) => string;
-        isInputHasValue: (key: string, type?: string) => boolean;
-        onClickReset: (key: string, type?: string) => void;
-    }) => React.ReactNode;
-    type?: 'text' | 'phone';
-    countries?: Country[];
-    isCountriesLoading?: boolean;
+    render?: () => React.ReactNode;
 }
 export type IColumnListFilterOption = Omit<IColumnFilterOption, 'apiKey' | 'options'> & {
     value: string;

package/build/utils/encrypt.d.ts

@@ -0,0 +1 @@
+export declare function encryptDataWithPublicKey(publicKeyPem: string, data: string): Promise<string>;

package/build/utils/encrypt.js

@@ -0,0 +1,44 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+function encryptWithPublicKey(publicKeyPem, text) {
+    return __awaiter(this, void 0, void 0, function* () {
+        function importPublicKey(pem) {
+            return __awaiter(this, void 0, void 0, function* () {
+                const pemHeader = '-----BEGIN PUBLIC KEY-----';
+                const pemFooter = '-----END PUBLIC KEY-----';
+                const pemContents = pem.replace(pemHeader, '').replace(pemFooter, '').trim();
+                const binaryDerString = atob(pemContents);
+                const binaryDer = Uint8Array.from(binaryDerString, (c) => c.charCodeAt(0));
+                return yield window.crypto.subtle.importKey('spki', binaryDer.buffer, {
+                    name: 'RSA-OAEP',
+                    hash: 'SHA-1',
+                }, true, ['encrypt']);
+            });
+        }
+        const encoder = new TextEncoder();
+        const key = yield importPublicKey(publicKeyPem);
+        const encryptedBuffer = yield window.crypto.subtle.encrypt({
+            name: 'RSA-OAEP',
+        }, key, encoder.encode(text));
+        const bytes = new Uint8Array(encryptedBuffer);
+        let binary = '';
+        for (let i = 0; i < bytes.byteLength; i++) {
+            binary += String.fromCharCode(bytes[i]);
+        }
+        return btoa(binary);
+    });
+}
+export function encryptDataWithPublicKey(publicKeyPem, data) {
+    return __awaiter(this, void 0, void 0, function* () {
+        if (typeof data !== 'string')
+            throw new Error('data should be from type string');
+        return yield encryptWithPublicKey(publicKeyPem, data);
+    });
+}

package/build/utils/freshdesk.d.ts

@@ -4,3 +4,4 @@ export declare const setFreshDeskProperties: ({ individualDetails, activeSegment
     activeSegment: Segment | null;
     language: string;
 }) => void;
+export declare const openFreshDeskChat: () => void;

package/build/utils/freshdesk.js

@@ -45,3 +45,10 @@ export const setFreshDeskProperties = ({ individualDetails, activeSegment, langu
         cf_segment: segmentId,
     });
 };
+export const openFreshDeskChat = () => {
+    const fcWidgetObj = window.fcWidget;
+    if (!fcWidgetObj) {
+        return;
+    }
+    fcWidgetObj.open();
+};

package/build/utils/index.d.ts

@@ -38,3 +38,4 @@ export * from './geography';
 export * from './billing';
 export * from './toggleOptions';
 export * from './flag';
+export * from './encrypt';

package/build/utils/index.js

@@ -38,3 +38,4 @@ export * from './geography';
 export * from './billing';
 export * from './toggleOptions';
 export * from './flag';
+export * from './encrypt';

package/package.json

@@ -1,130 +1,130 @@
-{
-  "name": "@tap-payments/os-micro-frontend-shared",
-  "description": "Shared components and utilities for Tap Payments micro frontends",
-  "version": "0.0.36",
-  "type": "module",
-  "main": "build/index.js",
-  "module": "build/index.js",
-  "types": "build/index.d.ts",
-  "exports": {
-    ".": {
-      "import": "./build/index.js",
-      "require": "./build/index.js",
-      "types": "./build/index.d.ts"
-    },
-    "./constants": {
-      "import": "./build/constants/index.js",
-      "require": "./build/constants/index.js",
-      "types": "./build/constants/index.d.ts"
-    },
-    "./components": {
-      "import": "./build/components/index.js",
-      "require": "./build/components/index.js",
-      "types": "./build/components/index.d.ts"
-    },
-    "./components/*": {
-      "import": "./build/components/*/index.js",
-      "require": "./build/components/*/index.js",
-      "types": "./build/components/*/index.d.ts"
-    },
-    "./hooks": {
-      "import": "./build/hooks/index.js",
-      "require": "./build/hooks/index.js",
-      "types": "./build/hooks/index.d.ts"
-    },
-    "./utils": {
-      "import": "./build/utils/index.js",
-      "require": "./build/utils/index.js",
-      "types": "./build/utils/index.d.ts"
-    },
-    "./theme": {
-      "import": "./build/theme/index.js",
-      "require": "./build/theme/index.js",
-      "types": "./build/theme/index.d.ts"
-    },
-    "./types": {
-      "import": "./build/types/index.js",
-      "require": "./build/types/index.js",
-      "types": "./build/types/index.d.ts"
-    }
-  },
-  "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-plugin-svgr": "^4.3.0",
-    "vite-tsconfig-paths": "^4.2.0"
-  },
-  "lint-staged": {
-    "src/**/*.{ts,tsx,json,js,jsx}": [
-      "yarn run prettier:fix",
-      "yarn run lint"
-    ]
-  }
-}
+{
+  "name": "@tap-payments/os-micro-frontend-shared",
+  "description": "Shared components and utilities for Tap Payments micro frontends",
+  "version": "0.0.39",
+  "type": "module",
+  "main": "build/index.js",
+  "module": "build/index.js",
+  "types": "build/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./build/index.js",
+      "require": "./build/index.js",
+      "types": "./build/index.d.ts"
+    },
+    "./constants": {
+      "import": "./build/constants/index.js",
+      "require": "./build/constants/index.js",
+      "types": "./build/constants/index.d.ts"
+    },
+    "./components": {
+      "import": "./build/components/index.js",
+      "require": "./build/components/index.js",
+      "types": "./build/components/index.d.ts"
+    },
+    "./components/*": {
+      "import": "./build/components/*/index.js",
+      "require": "./build/components/*/index.js",
+      "types": "./build/components/*/index.d.ts"
+    },
+    "./hooks": {
+      "import": "./build/hooks/index.js",
+      "require": "./build/hooks/index.js",
+      "types": "./build/hooks/index.d.ts"
+    },
+    "./utils": {
+      "import": "./build/utils/index.js",
+      "require": "./build/utils/index.js",
+      "types": "./build/utils/index.d.ts"
+    },
+    "./theme": {
+      "import": "./build/theme/index.js",
+      "require": "./build/theme/index.js",
+      "types": "./build/theme/index.d.ts"
+    },
+    "./types": {
+      "import": "./build/types/index.js",
+      "require": "./build/types/index.js",
+      "types": "./build/types/index.d.ts"
+    }
+  },
+  "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-plugin-svgr": "^4.3.0",
+    "vite-tsconfig-paths": "^4.2.0"
+  },
+  "lint-staged": {
+    "src/**/*.{ts,tsx,json,js,jsx}": [
+      "yarn run prettier:fix",
+      "yarn run lint"
+    ]
+  }
+}