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

package/build/components/FileInputPreview/FileInputPreview.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { FileInputPreviewProps } from './type';
+declare function FileInputPreview({ options, error, files, label, disabled, hideUpload, preventDuplicates, onChangeFiles, onRemoveFile, renderBrandLogo, renderOpenFileInNewTab, }: Readonly<FileInputPreviewProps>): import("react/jsx-runtime").JSX.Element;
+declare const _default: import("react").MemoExoticComponent<typeof FileInputPreview>;
+export default _default;

package/build/components/FileInputPreview/FileInputPreview.js

@@ -0,0 +1,51 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo, useMemo, useState } from 'react';
+import { useDropzone } from 'react-dropzone';
+import { useTranslation } from 'react-i18next';
+import { pdfIcon } from '../../constants/index.js';
+import { readableFileSize } from '../../utils/index.js';
+import { FilePreview, FileUploader } from '../index.js';
+import { Wrapper, Title } from './style';
+import { isDuplicateFile } from './utils';
+function FileInputPreview({ options, error, files, label, disabled, hideUpload = false, preventDuplicates, onChangeFiles, onRemoveFile, renderBrandLogo, renderOpenFileInNewTab, }) {
+    const { t } = useTranslation();
+    const [duplicateError, setDuplicateError] = useState(null);
+    const { getRootProps, getInputProps, open, isDragReject, fileRejections } = useDropzone(options);
+    const maxFileSize = readableFileSize((options === null || options === void 0 ? void 0 : options.maxSize) || 0, 0).toUpperCase();
+    const errorMessage = useMemo(() => {
+        const rejectedTypeFiles = fileRejections.length && fileRejections[0].errors.some((file) => file.code === 'file-invalid-type');
+        const rejectedFileSize = fileRejections.length && fileRejections[0].errors.some((file) => file.code === 'file-too-large');
+        if (isDragReject || rejectedTypeFiles)
+            return t('invalidFileType');
+        if (rejectedFileSize)
+            return `File is larger than ${maxFileSize}`;
+        if (duplicateError)
+            return duplicateError;
+        return error;
+    }, [isDragReject, error, fileRejections, duplicateError, t, maxFileSize]);
+    const getFilePreview = (file) => {
+        return file.type.includes('image') ? URL.createObjectURL(file) : file.name.includes('.pdf') ? pdfIcon : file.name;
+    };
+    const processFiles = (newFilesList) => {
+        setDuplicateError(null);
+        if (!preventDuplicates) {
+            return newFilesList.map((file) => ({ file, id: file.name }));
+        }
+        const { duplicates, uniqueFiles } = newFilesList.reduce((acc, file) => {
+            if (isDuplicateFile(file, files)) {
+                acc.duplicates.push(file.name);
+            }
+            else {
+                acc.uniqueFiles.push({ file, id: file.name });
+            }
+            return acc;
+        }, { duplicates: [], uniqueFiles: [] });
+        if (duplicates.length > 0) {
+            const fileText = duplicates.length === 1 ? 'file' : 'files';
+            setDuplicateError(`Duplicate ${fileText} detected: ${duplicates.join(', ')}`);
+        }
+        return uniqueFiles;
+    };
+    return (_jsxs(Wrapper, { children: [_jsx(Title, { children: label }), _jsx(FilePreview, { files: files, onRemoveFile: onRemoveFile, disabled: disabled, getFilePreview: getFilePreview, renderBrandLogo: renderBrandLogo, renderOpenFileInNewTab: renderOpenFileInNewTab }), !disabled && !hideUpload && (_jsx(FileUploader, { getRootProps: getRootProps, getInputProps: getInputProps, open: open, onChangeFiles: onChangeFiles, processFiles: processFiles, disabled: disabled, errorMessage: errorMessage, maxFileSize: maxFileSize, preventDuplicates: preventDuplicates }))] }));
+}
+export default memo(FileInputPreview);

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

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

package/build/components/FileInputPreview/index.js

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

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

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+export declare const Wrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+export declare const Title: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
+    ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
+}, "width" | "minHeight" | "height" | "bottom" | "left" | "right" | "top" | "border" | "boxShadow" | "fontWeight" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "boxSizing" | "color" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "justifyContent" | "justifyItems" | "justifySelf" | "letterSpacing" | "lineHeight" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minWidth" | "order" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "visibility" | "whiteSpace" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "marginBlock" | "marginInline" | "overflow" | "padding" | "paddingBlock" | "paddingInline" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "p" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint" | "classes" | "align" | "className" | "style" | "children" | "gutterBottom" | "noWrap" | "paragraph" | "sx" | "variant" | "variantMapping"> & {
+    component?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+} & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;

package/build/components/FileInputPreview/style.js

@@ -0,0 +1,20 @@
+import Box from '@mui/material/Box';
+import { styled } from '@mui/material/styles';
+import { Text } from '../index.js';
+export const Wrapper = styled(Box)(({ theme }) => ({
+    display: 'flex',
+    flexDirection: 'column',
+    justifyContent: 'center',
+    gap: '8px',
+    padding: '8px',
+    borderRadius: '4px',
+    border: `1px solid ${theme.palette.divider}`,
+    background: theme.palette.common.white,
+}));
+export const Title = styled(Text)(({ theme }) => ({
+    color: theme.palette.grey[700],
+    fontSize: '10px',
+    fontWeight: 500,
+    marginBottom: '8px',
+    margin: 0,
+}));

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

@@ -0,0 +1,21 @@
+/// <reference types="react" />
+import { DropzoneProps } from 'react-dropzone';
+import { FileType } from '../../types/index.js';
+import { SxProps } from '@mui/material/styles';
+export interface FileInputPreviewProps {
+    accept?: string;
+    options?: DropzoneProps;
+    error?: string;
+    files: FileType[];
+    label?: string | null;
+    disabled?: boolean;
+    hideUpload?: boolean;
+    preventDuplicates?: boolean;
+    sx?: SxProps;
+    hideTitle?: boolean;
+    hidePreview?: boolean;
+    onChangeFiles: (files: FileType[]) => void;
+    onRemoveFile?: (file: FileType) => void;
+    renderBrandLogo: (fileId: string) => React.ReactNode;
+    renderOpenFileInNewTab: (fileId: string) => React.ReactNode;
+}

package/build/components/FileInputPreview/type.js

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

package/build/components/FileInputPreview/utils.d.ts

@@ -0,0 +1,3 @@
+import { FileType } from '../../types/index.js';
+export declare const areFilesEqual: (file1: File, file2: File) => boolean;
+export declare const isDuplicateFile: (newFile: File, existingFiles: FileType[]) => boolean;

package/build/components/FileInputPreview/utils.js

@@ -0,0 +1,14 @@
+import { isFile } from '../../utils/index.js';
+export const areFilesEqual = (file1, file2) => {
+    return file1.name === file2.name && file1.size === file2.size;
+};
+export const isDuplicateFile = (newFile, existingFiles) => {
+    if (!(existingFiles === null || existingFiles === void 0 ? void 0 : existingFiles.length))
+        return false;
+    return existingFiles.some((existingFile) => {
+        if (!isFile(existingFile)) {
+            return existingFile.name === newFile.name;
+        }
+        return areFilesEqual(existingFile.file, newFile);
+    });
+};

package/build/components/FilePreview/FilePreview.d.ts

@@ -0,0 +1,3 @@
+import { FilePreviewProps } from './type';
+declare const FilePreview: ({ files, disabled, sx, onRemoveFile, getFilePreview, renderBrandLogo, renderOpenFileInNewTab }: Readonly<FilePreviewProps>) => import("react/jsx-runtime").JSX.Element;
+export default FilePreview;

package/build/components/FilePreview/FilePreview.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import Box from '@mui/material/Box';
+import { closeXIcon } from '../../constants/index.js';
+import { isFile } from '../../utils/index.js';
+import { FileItem, FileWrapper, Content, Upload, TextWrapper, FileIconWrapper, CloseIconWrapper } from './style';
+const FilePreview = ({ files, disabled, sx, onRemoveFile, getFilePreview, renderBrandLogo, renderOpenFileInNewTab }) => {
+    return (_jsx(_Fragment, { children: files === null || files === void 0 ? void 0 : files.map((f, index) => {
+            const filePreview = isFile(f) ? getFilePreview(f.file) : null;
+            const isPdf = isFile(f) && f.file.type.includes('application/pdf');
+            const file = isFile(f) ? f.file : f;
+            return (_jsx(FileItem, Object.assign({ sx: sx }, { children: _jsxs(FileWrapper, Object.assign({ "data-slot": "file-wrapper" }, { children: [_jsxs(Content, Object.assign({ "data-slot": "file-Content" }, { children: [_jsx(FileIconWrapper, Object.assign({ "data-slot": "file-icon-wrapper" }, { children: isFile(f) && filePreview ? (_jsx(Box, { component: "img", src: filePreview, width: 24, height: 24, sx: { borderRadius: '50%', objectFit: isPdf ? 'none' : 'cover' }, onError: (e) => {
+                                            e.currentTarget.src = file.name; // Fallback or alternative logic
+                                        } })) : (renderBrandLogo === null || renderBrandLogo === void 0 ? void 0 : renderBrandLogo(file.id)) })), _jsxs(TextWrapper, Object.assign({ "data-slot": "text-wrapper" }, { children: [_jsx(Upload, Object.assign({ "data-slot": "filename" }, { children: file.name })), !isFile(f) && !filePreview && (renderOpenFileInNewTab === null || renderOpenFileInNewTab === void 0 ? void 0 : renderOpenFileInNewTab(file.id))] }))] })), !disabled && (_jsx(CloseIconWrapper, Object.assign({ "data-slot": "close-icon-wrapper", onClick: () => {
+                                onRemoveFile === null || onRemoveFile === void 0 ? void 0 : onRemoveFile(f);
+                            } }, { children: _jsx(Box, { component: "img", src: closeXIcon, width: 10, height: 10 }) })))] })) }), index));
+        }) }));
+};
+export default FilePreview;

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

@@ -0,0 +1,3 @@
+export { default as FilePreview } from './FilePreview';
+export * from './type';
+export * from './style';

package/build/components/FilePreview/index.js

@@ -0,0 +1,3 @@
+export { default as FilePreview } from './FilePreview';
+export * from './type';
+export * from './style';

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

@@ -0,0 +1,20 @@
+/// <reference types="react" />
+export declare const FileItem: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+export declare const FileWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+export declare const Content: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+export declare const Upload: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const TextWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+export declare const FileIconWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+export declare const CloseIconWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;

package/build/components/FilePreview/style.js

@@ -0,0 +1,55 @@
+import Box from '@mui/material/Box';
+import { styled } from '@mui/material/styles';
+export const FileItem = styled(Box)(({ theme }) => ({
+    width: '100%',
+    borderRadius: '4px',
+    padding: '4px 8px',
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'flex-start',
+    background: theme.palette.grey[400],
+    gap: '8px',
+}));
+export const FileWrapper = styled(Box)(() => ({
+    width: '100%',
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+    gap: '8px',
+}));
+export const Content = styled(Box)(({ theme }) => ({
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'flex-start',
+    color: theme.palette.text.primary,
+    cursor: 'pointer',
+    gap: '8px',
+}));
+export const Upload = styled('span')(({ theme }) => ({
+    fontWeight: 500,
+    color: theme.palette.text.primary,
+    cursor: 'pointer',
+    fontSize: '8px',
+}));
+export const TextWrapper = styled(Box)(({ theme }) => ({
+    display: 'flex',
+    flexDirection: 'column',
+    alignItems: 'flex-start',
+    justifyContent: 'center',
+    gap: '4px',
+    color: theme.palette.text.primary,
+}));
+export const FileIconWrapper = styled(Box)(({ theme }) => ({
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    background: theme.palette.common.white,
+    borderRadius: '4px',
+    border: `1px solid ${theme.palette.divider}`,
+}));
+export const CloseIconWrapper = styled(Box)(() => ({
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    cursor: 'pointer',
+}));

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

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import { SxProps, Theme } from '@mui/material/styles';
+import type { FileType } from '../../types/index.js';
+export interface FilePreviewProps {
+    files: FileType[] | undefined;
+    disabled?: boolean;
+    sx?: SxProps<Theme>;
+    onRemoveFile?: (file: FileType) => void;
+    getFilePreview: (file: File) => string;
+    renderBrandLogo: (fileId: string) => React.ReactNode;
+    renderOpenFileInNewTab: (fileId: string) => React.ReactNode;
+}

package/build/components/FilePreview/type.js

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

package/build/components/FilterDropdown/components/BrandItem/BrandItem.d.ts

@@ -5,7 +5,7 @@ interface BrandItemProps extends Pick<MerchantItemProps, 'atLeastOneMerchantSele
     brand: BrandProps;
     isDisabled?: boolean;
     showSearchInput?: boolean;
-    renderBrandLogo: (logo: string) => React.ReactNode;
+    renderBrandLogo: (fileId: string) => React.ReactNode;
     onChangeMerchant?: (value: string[]) => void;
 }
 export default function BrandItem({ brand, merchantsIds, isDisabled, atLeastOneMerchantSelected, showSearchInput, renderBrandLogo, onChangeMerchant, }: Readonly<BrandItemProps>): import("react/jsx-runtime").JSX.Element;

package/build/components/FilterDropdown/components/MerchantItem/MerchantItem.d.ts

@@ -8,6 +8,6 @@ export interface MerchantItemProps {
     showSearchInput?: boolean;
     hideCheckbox?: boolean;
     onFilterChange?: (value: string[]) => void;
-    renderBrandLogo: (logo: string) => React.ReactNode;
+    renderBrandLogo: (fileId: string) => React.ReactNode;
 }
 export default function MerchantItem({ brands, isLoading, onFilterChange, merchantsIds, atLeastOneMerchantSelected, showSearchInput, hideCheckbox, renderBrandLogo, }: Readonly<MerchantItemProps>): import("react/jsx-runtime").JSX.Element;

package/build/components/OpenFileInNewTab/OpenFileInNewTab.d.ts

@@ -0,0 +1,7 @@
+export type OpenFileInNewTabProps = {
+    data?: Blob;
+    isLoading?: boolean;
+    isError?: boolean;
+};
+export declare const OpenFileInNewTab: ({ data, isLoading, isError }: Readonly<OpenFileInNewTabProps>) => import("react/jsx-runtime").JSX.Element | null;
+export default OpenFileInNewTab;

package/build/components/OpenFileInNewTab/OpenFileInNewTab.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useMemo } from 'react';
+import { ViewFile } from './style';
+const windowUrl = window.URL || window.webkitURL;
+export const OpenFileInNewTab = ({ data, isLoading, isError }) => {
+    const blobUrl = useMemo(() => {
+        if (!data)
+            return '';
+        return windowUrl.createObjectURL(data);
+    }, [data]);
+    useEffect(() => {
+        return () => {
+            if (blobUrl)
+                windowUrl.revokeObjectURL(blobUrl);
+        };
+    }, [blobUrl]);
+    const handleOpenFile = () => {
+        if (blobUrl) {
+            window.open(blobUrl, '_blank');
+        }
+    };
+    if (isLoading || isError)
+        return null;
+    return _jsx(ViewFile, Object.assign({ onClick: handleOpenFile }, { children: "View" }));
+};
+export default OpenFileInNewTab;

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

@@ -0,0 +1 @@
+export { default as OpenFileInNewTab, OpenFileInNewTabProps } from './OpenFileInNewTab';

package/build/components/OpenFileInNewTab/index.js

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

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

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

package/build/components/OpenFileInNewTab/style.js

@@ -0,0 +1,8 @@
+import { styled } from '@mui/material';
+export const ViewFile = styled('span')(({ theme }) => ({
+    fontWeight: 500,
+    color: theme.palette.info.dark,
+    cursor: 'pointer',
+    fontSize: '9px',
+    textDecoration: 'underline',
+}));

package/build/components/index.d.ts

@@ -128,4 +128,6 @@ export * from './VAT';
 export * from './Discount';
 export * from './MerchantLogo';
 export * from './FilterDropdown';
-export * from './MerchantCurrencyDropdown';
+export * from './OpenFileInNewTab';
+export * from './FilePreview';
+export * from './FileInputPreview';

package/build/components/index.js

@@ -128,4 +128,6 @@ export * from './VAT';
 export * from './Discount';
 export * from './MerchantLogo';
 export * from './FilterDropdown';
-export * from './MerchantCurrencyDropdown';
+export * from './OpenFileInNewTab';
+export * from './FilePreview';
+export * from './FileInputPreview';

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.1.254-test.1",
-  "testVersion": 1,
+  "version": "0.1.254-test.2",
+  "testVersion": 2,
   "type": "module",
   "main": "build/index.js",
   "module": "build/index.js",

package/build/components/MerchantCurrencyDropdown/MerchantCurrencyDropdown.d.ts

@@ -1,12 +0,0 @@
-/// <reference types="react" />
-import { Currency } from '../../types/index.js';
-interface MerchantCurrencyDropdownProps {
-    merchantCurrencies: Currency[];
-    selectedCurrency?: Currency;
-    isLoading?: boolean;
-    isDisabled?: boolean;
-    onChangeCurrency?: (currency: Currency) => void;
-}
-declare function MerchantCurrencyDropdown({ merchantCurrencies, isLoading, onChangeCurrency, isDisabled, selectedCurrency, }: Readonly<MerchantCurrencyDropdownProps>): import("react/jsx-runtime").JSX.Element;
-declare const _default: import("react").MemoExoticComponent<typeof MerchantCurrencyDropdown>;
-export default _default;

package/build/components/MerchantCurrencyDropdown/MerchantCurrencyDropdown.js

@@ -1,38 +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 Popper from '@mui/material/Popper';
-import { downArrowIcon3 } from '../../constants/index.js';
-import { Text, Loader, CustomBackdrop } from '../index.js';
-import { CurrencyDropdownContainer, BrandsDropdown, CurrencyBox } from './style';
-import CurrencyItem from './SelectedCurrency';
-function MerchantCurrencyDropdown({ merchantCurrencies, isLoading, onChangeCurrency, isDisabled, selectedCurrency, }) {
-    var _a, _b, _c, _d, _e;
-    const [anchorEl, setAnchorEl] = useState(null);
-    const open = Boolean(anchorEl);
-    const onOpenDropdown = (event) => {
-        if (!open)
-            setAnchorEl(event.currentTarget);
-    };
-    const onCloseDropdown = () => {
-        if (open)
-            setAnchorEl(null);
-    };
-    const selectCurrency = (currency) => {
-        onChangeCurrency === null || onChangeCurrency === void 0 ? void 0 : onChangeCurrency(currency);
-        onCloseDropdown();
-    };
-    if (isLoading || !merchantCurrencies) {
-        return (_jsxs(CurrencyDropdownContainer, Object.assign({ sx: { pointerEvents: 'none' } }, { children: [_jsx(Text, Object.assign({ sx: { fontSize: '11px' } }, { children: "Select" })), isLoading ? _jsx(Loader, {}) : _jsx(Box, { component: "img", src: downArrowIcon3, alt: "c", sx: { marginTop: '2px' } })] })));
-    }
-    if (merchantCurrencies.length === 0) {
-        return (_jsxs(CurrencyDropdownContainer, Object.assign({ sx: { pointerEvents: 'none', opacity: 0.5 } }, { children: [_jsx(Text, Object.assign({ sx: { fontSize: '11px' } }, { children: "Select" })), _jsx(Box, Object.assign({ sx: { width: 25, textAlign: 'center' } }, { children: _jsx(Box, { component: "img", src: downArrowIcon3, alt: "c", sx: { marginTop: '2px' } }) }))] })));
-    }
-    if (merchantCurrencies.length === 1) {
-        return (_jsx(CurrencyDropdownContainer, Object.assign({ sx: { border: 'none', pointerEvents: 'none' } }, { children: _jsx(CurrencyItem, { selectedCurrencyCode: (_c = (_b = (_a = merchantCurrencies === null || merchantCurrencies === void 0 ? void 0 : merchantCurrencies[0]) === null || _a === void 0 ? void 0 : _a.code) === null || _b === void 0 ? void 0 : _b.english) !== null && _c !== void 0 ? _c : '' }) })));
-    }
-    return (_jsxs(CurrencyDropdownContainer, Object.assign({ onClick: onOpenDropdown, sx: Object.assign({}, (isDisabled && { pointerEvents: 'none', opacity: 0.7 })) }, { children: [_jsx(CurrencyItem, { selectedCurrencyCode: (_e = (_d = selectedCurrency === null || selectedCurrency === void 0 ? void 0 : selectedCurrency.code) === null || _d === void 0 ? void 0 : _d.english) !== null && _e !== void 0 ? _e : '' }), _jsx(Box, { component: "img", src: downArrowIcon3, alt: "c", sx: Object.assign({ marginTop: '2px' }, (open && { transform: 'rotate(180deg)' })) }), open && _jsx(CustomBackdrop, { onClick: onCloseDropdown }), _jsx(Popper, Object.assign({ open: open, anchorEl: anchorEl, placement: "bottom-start" }, { children: _jsx(BrandsDropdown, { children: merchantCurrencies.map((currency, index) => (_jsx(CurrencyBox, Object.assign({ className: "currency", onClick: () => {
-                            selectCurrency(currency);
-                        } }, { children: _jsx(CurrencyItem, { selectedCurrencyCode: currency.code.english }) }), `${currency.symbol}-${index}`))) }) }))] })));
-}
-export default memo(MerchantCurrencyDropdown);

package/build/components/MerchantCurrencyDropdown/SelectedCurrency.d.ts

@@ -1,5 +0,0 @@
-interface SelectedCurrencyProps {
-    selectedCurrencyCode: string;
-}
-export default function SelectedCurrency({ selectedCurrencyCode }: Readonly<SelectedCurrencyProps>): import("react/jsx-runtime").JSX.Element;
-export {};

package/build/components/MerchantCurrencyDropdown/SelectedCurrency.js

@@ -1,6 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { CountryFlag } from '../index.js';
-import { Label } from './style';
-export default function SelectedCurrency({ selectedCurrencyCode }) {
-    return (_jsxs(Label, Object.assign({ sx: { padding: 0 } }, { children: [_jsx(CountryFlag, { currencyCode: selectedCurrencyCode }), _jsxs("span", { children: [" ", selectedCurrencyCode] })] })));
-}

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

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

package/build/components/MerchantCurrencyDropdown/index.js

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

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

@@ -1,13 +0,0 @@
-/// <reference types="react" />
-export declare const CurrencyDropdownContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
-export declare const BrandsDropdown: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
-export declare const CurrencyBox: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
-export declare const Label: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;

package/build/components/MerchantCurrencyDropdown/style.js

@@ -1,64 +0,0 @@
-import Box from '@mui/material/Box';
-import { styled } from '@mui/material/styles';
-export const CurrencyDropdownContainer = styled(Box)(({ theme }) => ({
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-    gap: '4px',
-    cursor: 'pointer',
-    padding: '8px',
-    border: `1px solid ${theme.palette.divider}`,
-    background: theme.palette.common.white,
-    borderRadius: '4px',
-    fontSize: '14px',
-    fontWeight: 500,
-    '.logo': { width: 17 },
-    color: theme.palette.text.primary,
-    height: 32,
-}));
-export const BrandsDropdown = styled(Box)(({ theme }) => ({
-    width: 109,
-    boxShadow: theme.shadows[9],
-    backgroundColor: theme.palette.common.white,
-    borderRadius: '4px',
-    fontSize: '14px',
-    fontWeight: 500,
-    color: theme.palette.text.primary,
-    maxHeight: 210,
-    overflow: 'auto',
-    marginTop: '8px',
-    '.currecy+.currency': {
-        marginTop: '4px',
-    },
-}));
-export const CurrencyBox = styled(Box)(({ theme }) => ({
-    display: 'flex',
-    alignItems: 'center',
-    paddingInlineStart: theme.spacing(1),
-    paddingInlineEnd: theme.spacing(2),
-    paddingTop: theme.spacing(1),
-    paddingBottom: theme.spacing(1),
-    gap: '4px',
-    cursor: 'pointer',
-    height: 42,
-    '.logo': {
-        width: 20,
-        borderRadius: '2px',
-        border: `1px solid ${theme.palette.divider}`,
-    },
-    '&:hover': {
-        boxShadow: theme.shadows[4],
-    },
-}));
-export const Label = styled(Box)(({ theme }) => ({
-    fontSize: '14px',
-    fontWeight: 500,
-    color: theme.palette.text.primary,
-    textTransform: 'uppercase',
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-    gap: '4px',
-    padding: '8px',
-    img: { width: 17, borderRadius: '4px' },
-}));