udp-react-enterprise-component-library 25.18.1-beta.3 → 25.18.1-beta.31

package/dist/FileUpload-A-ztAzbg.js

@@ -1,241 +0,0 @@
-import { t as FluentButton } from "./FluentButton-3xMbN_Vs.js";
-import React, { Fragment, useEffect, useRef, useState } from "react";
-import { Card, CardContent, Divider, Typography, makeStyles } from "@material-ui/core";
-
-//#region src/utilities/uploader/FileProfile.jsx
-const useStyles$2 = makeStyles((theme) => ({
-	root: {
-		display: "flex",
-		flexDirection: "row"
-	},
-	prefix: { fontWeight: 600 },
-	title: { flex: 1 },
-	detail: { marginLeft: theme.spacing(2) }
-}));
-const FileProfile = (props) => {
-	const classes = useStyles$2();
-	const { children, fileName, fileType, size, lastModifiedDate } = props;
-	return /* @__PURE__ */ React.createElement(Fragment, null, /* @__PURE__ */ React.createElement("div", { className: classes.root }, /* @__PURE__ */ React.createElement(Typography, {
-		variant: "body1",
-		className: classes.title
-	}, /* @__PURE__ */ React.createElement("strong", null, fileName)), /* @__PURE__ */ React.createElement(Typography, {
-		variant: "caption",
-		className: classes.detail
-	}, /* @__PURE__ */ React.createElement("span", { className: classes.prefix }, "Type:"), " ", fileType), /* @__PURE__ */ React.createElement(Typography, {
-		variant: "caption",
-		className: classes.detail
-	}, /* @__PURE__ */ React.createElement("span", { className: classes.prefix }, "Size:"), " ", size)), children, /* @__PURE__ */ React.createElement(Typography, { variant: "caption" }, /* @__PURE__ */ React.createElement("span", { className: classes.prefix }, "Last Modified:"), " ", lastModifiedDate));
-};
-var FileProfile_default = FileProfile;
-
-//#endregion
-//#region src/utilities/uploader/ImagePreview.jsx
-const useStyles$1 = makeStyles((theme) => ({
-	root: {
-		display: "flex",
-		justifyContent: "center"
-	},
-	image: { maxWidth: 465 }
-}));
-const ImagePreview = (props) => {
-	const { image } = props;
-	const classes = useStyles$1();
-	return /* @__PURE__ */ React.createElement("div", { className: classes.root }, /* @__PURE__ */ React.createElement("img", {
-		className: classes.image,
-		src: image,
-		alt: "upload preview"
-	}));
-};
-var ImagePreview_default = ImagePreview;
-
-//#endregion
-//#region src/utilities/uploader/FileType.jsx
-const FileType = (props) => {
-	let type = "";
-	const { fileType, image, fileName, size, lastModifiedDate } = props;
-	switch (fileType) {
-		case "pdf":
-			type = /* @__PURE__ */ React.createElement(FileProfile_default, {
-				fileType,
-				fileName,
-				size,
-				lastModifiedDate
-			});
-			break;
-		case "doc":
-			type = /* @__PURE__ */ React.createElement(FileProfile_default, {
-				fileType,
-				fileName,
-				size,
-				lastModifiedDate
-			});
-			break;
-		case "png":
-			type = /* @__PURE__ */ React.createElement(FileProfile_default, {
-				fileType,
-				fileName,
-				size,
-				lastModifiedDate
-			}, /* @__PURE__ */ React.createElement(ImagePreview_default, { image }));
-			break;
-		case "jpg":
-			type = /* @__PURE__ */ React.createElement(FileProfile_default, {
-				fileType,
-				fileName,
-				size,
-				lastModifiedDate
-			}, /* @__PURE__ */ React.createElement(ImagePreview_default, { image }));
-			break;
-		case "jpeg":
-			type = /* @__PURE__ */ React.createElement(FileProfile_default, {
-				fileType,
-				fileName,
-				size,
-				lastModifiedDate
-			}, /* @__PURE__ */ React.createElement(ImagePreview_default, { image }));
-			break;
-		default:
-	}
-	return type;
-};
-
-//#endregion
-//#region src/utilities/uploader/FileUpload.jsx
-const useStyles = makeStyles((theme) => ({
-	avatarImage: {
-		width: 200,
-		height: 200,
-		borderRadius: 100,
-		border: "3px solid",
-		borderColor: theme.palette.primary.main,
-		marginTop: -3,
-		marginLeft: -3
-	},
-	image: {
-		width: 300,
-		height: "100%",
-		border: "2px solid",
-		borderColor: theme.palette.primary.main,
-		marginTop: -3,
-		marginLeft: -3
-	},
-	instruction: {
-		display: "flex",
-		alignContent: "center",
-		justifyContent: "center"
-	},
-	icon: {
-		display: "flex",
-		justifyContent: "center"
-	},
-	avatarIcon: {
-		display: "flex",
-		justifyContent: "center",
-		marginTop: "35%"
-	},
-	previewCard: { maxWidth: 500 },
-	action: {
-		marginTop: theme.spacing(1),
-		marginBottom: theme.spacing(1),
-		display: "flex",
-		flexDirection: "row"
-	},
-	divider: { marginTop: theme.spacing(1) },
-	initialInstruction: {
-		marginLeft: theme.spacing(2),
-		marginTop: theme.spacing(.5)
-	}
-}));
-const FileUpload = (props) => {
-	const [file, setFile] = useState();
-	const [previewUrl, setPreviewUrl] = useState();
-	const [isValid, setIsValid] = useState(false);
-	const [fileType, setFileType] = useState();
-	const [fileName, setFileName] = useState();
-	const [fileSize, setFileSize] = useState();
-	const [fileDate, setFileDate] = useState();
-	const { id, onInput, accept, errorText } = props;
-	const classes = useStyles();
-	const filePickerRef = useRef();
-	useEffect(() => {
-		if (!file) return;
-		const fileReader = new window.FileReader();
-		fileReader.onload = () => {
-			setPreviewUrl(fileReader.result);
-		};
-		fileReader.readAsDataURL(file);
-	}, [file]);
-	const pickedHandler = (event) => {
-		const pickedFile = event.target.files[0];
-		let fileIsValid = isValid;
-		setFileName(event.target.files[0].name);
-		setFileSize(event.target.files[0].size);
-		setFileDate(event.target.files[0].lastModifiedDate.toString());
-		const str = event.target.files[0].name.split(".")[1];
-		setFileType(str);
-		if (event.target.files && event.target.files.length === 1) {
-			const pickedFile$1 = event.target.files[0];
-			setFile(pickedFile$1);
-			setIsValid(true);
-		} else {
-			setIsValid(false);
-			fileIsValid = false;
-		}
-		onInput(id, pickedFile, fileIsValid);
-	};
-	const pickFileHandler = () => {
-		filePickerRef.current.click();
-		if (file && file !== previewUrl) reset();
-	};
-	const formatBytes = (bytes, decimals = 2) => {
-		if (bytes === 0) return "0 Bytes";
-		const k = 1024;
-		const dm = decimals < 0 ? 0 : decimals;
-		const sizes = [
-			"Bytes",
-			"KB",
-			"MB",
-			"GB",
-			"TB",
-			"PB",
-			"EB",
-			"ZB",
-			"YB"
-		];
-		const i = Math.floor(Math.log(bytes) / Math.log(k));
-		return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + " " + sizes[i];
-	};
-	const reset = () => {
-		const fileReader = new window.FileReader();
-		fileReader.onload = () => {
-			setPreviewUrl(fileReader.result);
-		};
-		fileReader.readAsDataURL(file);
-	};
-	return /* @__PURE__ */ React.createElement(Card, {
-		className: classes.previewCard,
-		variant: "outlined"
-	}, /* @__PURE__ */ React.createElement(CardContent, null, /* @__PURE__ */ React.createElement("div", { className: classes.formControl }, /* @__PURE__ */ React.createElement("input", {
-		id,
-		ref: filePickerRef,
-		style: { display: "none" },
-		type: "file",
-		accept,
-		onChange: pickedHandler
-	}), /* @__PURE__ */ React.createElement("div", { className: classes.imageUpload }, !previewUrl && /* @__PURE__ */ React.createElement("div", { className: classes.action }, /* @__PURE__ */ React.createElement("div", { className: classes.action }, /* @__PURE__ */ React.createElement(FluentButton, {
-		type: "button",
-		variant: "contained",
-		color: "secondary",
-		onClick: pickFileHandler
-	}, "Select File"), /* @__PURE__ */ React.createElement("div", { className: classes.initialInstruction }, /* @__PURE__ */ React.createElement(Typography, { variant: "caption" }, "Click 'Select File' to upload a file from your computer")))), previewUrl && /* @__PURE__ */ React.createElement(Fragment, null, /* @__PURE__ */ React.createElement("div", { className: classes.imagePreview }, /* @__PURE__ */ React.createElement(FileType, {
-		fileType,
-		image: previewUrl,
-		fileName,
-		size: formatBytes(fileSize),
-		lastModifiedDate: fileDate
-	})), /* @__PURE__ */ React.createElement("div", { className: classes.divider }, /* @__PURE__ */ React.createElement(Divider, null)))), !isValid && /* @__PURE__ */ React.createElement(Typography, null, errorText, " "))));
-};
-
-//#endregion
-export { FileType as n, FileUpload as t };
-//# sourceMappingURL=FileUpload-A-ztAzbg.js.map

package/dist/FileUpload-A-ztAzbg.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"FileUpload-A-ztAzbg.js","names":["useStyles","useStyles","FileProfile","ImagePreview","pickedFile"],"sources":["../src/utilities/uploader/FileProfile.jsx","../src/utilities/uploader/ImagePreview.jsx","../src/utilities/uploader/FileType.jsx","../src/utilities/uploader/FileUpload.jsx"],"sourcesContent":["import React, { Fragment } from 'react'\nimport { Typography, makeStyles } from '@material-ui/core'\n\nconst useStyles = makeStyles((theme) => ({\n  root: {\n    display: 'flex',\n    flexDirection: 'row'\n  },\n  prefix: {\n    fontWeight: 600\n  },\n  title: {\n    flex: 1\n  },\n  detail: {\n    marginLeft: theme.spacing(2)\n  }\n}))\n\nconst FileProfile = (props) => {\n  const classes = useStyles()\n  const { children, fileName, fileType, size, lastModifiedDate } = props\n  return (\n    <Fragment>\n      <div className={classes.root}>\n        <Typography variant='body1' className={classes.title}>\n          <strong>{fileName}</strong>\n        </Typography>\n        <Typography variant='caption' className={classes.detail}>\n          <span className={classes.prefix}>Type:</span> {fileType}\n        </Typography>\n        <Typography variant='caption' className={classes.detail}>\n          <span className={classes.prefix}>Size:</span> {size}\n        </Typography>\n      </div>\n      {children}\n      <Typography variant='caption'>\n        <span className={classes.prefix}>Last Modified:</span>{' '}\n        {lastModifiedDate}\n      </Typography>\n    </Fragment>\n  )\n}\nexport default FileProfile\n","import React from 'react';\nimport { makeStyles } from '@material-ui/core';\n\nconst useStyles = makeStyles(theme => ({\n  root: {\n    display: 'flex',\n    justifyContent: 'center',\n  },\n  image: {\n    maxWidth: 465,\n  },\n}));\n\nconst ImagePreview = props => {\n  const { image } = props;\n  const classes = useStyles();\n\n  return (\n    <div className={classes.root}>\n      <img className={classes.image} src={image} alt=\"upload preview\" />\n    </div>\n  );\n};\nexport default ImagePreview;\n","import React from 'react';\nimport FileProfile from './FileProfile';\nimport ImagePreview from './ImagePreview';\n\nexport const FileType = props => {\n  let type = '';\n  const { fileType, image, fileName, size, lastModifiedDate } = props;\n\n  switch (fileType) {\n    case 'pdf':\n      type = (\n        <FileProfile\n          fileType={fileType}\n          fileName={fileName}\n          size={size}\n          lastModifiedDate={lastModifiedDate}\n        />\n      );\n      break;\n    case 'doc':\n      type = (\n        <FileProfile\n          fileType={fileType}\n          fileName={fileName}\n          size={size}\n          lastModifiedDate={lastModifiedDate}\n        />\n      );\n      break;\n    case 'png':\n      type = (\n        <FileProfile\n          fileType={fileType}\n          fileName={fileName}\n          size={size}\n          lastModifiedDate={lastModifiedDate}\n        >\n          <ImagePreview image={image} />\n        </FileProfile>\n      );\n      break;\n    case 'jpg':\n      type = (\n        <FileProfile\n          fileType={fileType}\n          fileName={fileName}\n          size={size}\n          lastModifiedDate={lastModifiedDate}\n        >\n          <ImagePreview image={image} />\n        </FileProfile>\n      );\n      break;\n    case 'jpeg':\n      type = (\n        <FileProfile\n          fileType={fileType}\n          fileName={fileName}\n          size={size}\n          lastModifiedDate={lastModifiedDate}\n        >\n          <ImagePreview image={image} />\n        </FileProfile>\n      );\n      break;\n\n    default:\n  }\n\n  return type;\n};\n","import React, { useRef, useState, useEffect, Fragment } from 'react'\nimport {\n  makeStyles,\n  Typography,\n  Card,\n  CardContent,\n  Divider\n} from '@material-ui/core'\nimport { FileType } from './FileType'\nimport { FluentButton } from '../../UI/inputs/buttons/FluentButton'\n\nconst useStyles = makeStyles((theme) => ({\n  avatarImage: {\n    width: 200,\n    height: 200,\n    borderRadius: 100,\n    border: '3px solid',\n    borderColor: theme.palette.primary.main,\n    marginTop: -3,\n    marginLeft: -3\n  },\n  image: {\n    width: 300,\n    height: '100%',\n    border: '2px solid',\n    borderColor: theme.palette.primary.main,\n    marginTop: -3,\n    marginLeft: -3\n  },\n  instruction: {\n    display: 'flex',\n    alignContent: 'center',\n    justifyContent: 'center'\n  },\n  icon: {\n    display: 'flex',\n    justifyContent: 'center'\n  },\n  avatarIcon: {\n    display: 'flex',\n    justifyContent: 'center',\n    marginTop: '35%'\n  },\n  previewCard: {\n    maxWidth: 500\n  },\n  action: {\n    marginTop: theme.spacing(1),\n    marginBottom: theme.spacing(1),\n    display: 'flex',\n    flexDirection: 'row'\n  },\n  divider: {\n    marginTop: theme.spacing(1)\n  },\n  initialInstruction: {\n    marginLeft: theme.spacing(2),\n    marginTop: theme.spacing(0.5)\n  }\n}))\n\nexport const FileUpload = (props) => {\n  const [file, setFile] = useState()\n  const [previewUrl, setPreviewUrl] = useState()\n  const [isValid, setIsValid] = useState(false)\n  const [fileType, setFileType] = useState()\n  const [fileName, setFileName] = useState()\n  const [fileSize, setFileSize] = useState()\n  const [fileDate, setFileDate] = useState()\n  const { id, onInput, accept, errorText } = props\n  const classes = useStyles()\n\n  const filePickerRef = useRef()\n  useEffect(() => {\n    if (!file) {\n      return\n    }\n    const fileReader = new window.FileReader()\n    fileReader.onload = () => {\n      setPreviewUrl(fileReader.result)\n    }\n    fileReader.readAsDataURL(file)\n  }, [file])\n\n  const pickedHandler = (event) => {\n    const pickedFile = event.target.files[0]\n    let fileIsValid = isValid\n    // console.log('ETF', event.target.files[0].name);\n    setFileName(event.target.files[0].name)\n    setFileSize(event.target.files[0].size)\n    setFileDate(event.target.files[0].lastModifiedDate.toString())\n    const str = event.target.files[0].name.split('.')[1]\n    // console.log('STR', str);\n    setFileType(str)\n    if (event.target.files && event.target.files.length === 1) {\n      const pickedFile = event.target.files[0]\n      setFile(pickedFile)\n      setIsValid(true)\n    } else {\n      setIsValid(false)\n      fileIsValid = false\n    }\n    onInput(id, pickedFile, fileIsValid)\n  }\n\n  const pickFileHandler = () => {\n    filePickerRef.current.click()\n    if (file && file !== previewUrl) {\n      reset()\n    }\n  }\n\n  const formatBytes = (bytes, decimals = 2) => {\n    if (bytes === 0) return '0 Bytes'\n\n    const k = 1024\n    const dm = decimals < 0 ? 0 : decimals\n    const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB']\n\n    const i = Math.floor(Math.log(bytes) / Math.log(k))\n\n    return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i]\n  }\n\n  const reset = () => {\n    const fileReader = new window.FileReader()\n    fileReader.onload = () => {\n      setPreviewUrl(fileReader.result)\n    }\n    fileReader.readAsDataURL(file)\n  }\n\n  return (\n    <Card className={classes.previewCard} variant='outlined'>\n      <CardContent>\n        <div className={classes.formControl}>\n          <input\n            id={id}\n            ref={filePickerRef}\n            style={{ display: 'none' }}\n            type='file'\n            accept={accept}\n            onChange={pickedHandler}\n          />\n\n          <div className={classes.imageUpload}>\n            {!previewUrl && (\n              <div className={classes.action}>\n                <div className={classes.action}>\n                  <FluentButton\n                    type='button'\n                    variant='contained'\n                    color='secondary'\n                    onClick={pickFileHandler}\n                  >\n                    Select File\n                  </FluentButton>\n\n                  <div className={classes.initialInstruction}>\n                    <Typography variant='caption'>\n                      Click 'Select File' to upload a file from your computer\n                    </Typography>\n                  </div>\n                </div>\n              </div>\n            )}\n\n            {previewUrl && (\n              <Fragment>\n                <div className={classes.imagePreview}>\n                  {/* {console.log('PREVIEW URL:', previewUrl)} */}\n                  <FileType\n                    fileType={fileType}\n                    image={previewUrl}\n                    fileName={fileName}\n                    size={formatBytes(fileSize)}\n                    lastModifiedDate={fileDate}\n                  />\n                </div>\n                <div className={classes.divider}>\n                  <Divider />\n                </div>\n              </Fragment>\n            )}\n          </div>\n          {!isValid && <Typography>{errorText} </Typography>}\n        </div>\n      </CardContent>\n    </Card>\n  )\n}\n"],"mappings":"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"}

package/dist/FileViewer-Cqrlt60_.js

@@ -1,385 +0,0 @@
-import { t as Typography$1 } from "./Typography-BMsa1JYd.js";
-import { S as getIconFromName } from "./TreeUtilities-BnHT4nq0.js";
-import { n as SideSheet } from "./SideSheet-DVvhEo7C.js";
-import { t as AmbientCard } from "./AmbientCard-blAjLcmr.js";
-import { t as IconButtonWithTooltip } from "./IconButtonWithToolTip-BL60Lfj0.js";
-import { t as AmbientAlert } from "./AmbientAlert-Dt_6PYSs.js";
-import { t as PDFViewer } from "./PDFViewer-DmkWeyJ0.js";
-import React, { useCallback, useMemo, useState } from "react";
-import { Dialog, makeStyles } from "@material-ui/core";
-import { useTranslation } from "react-i18next";
-
-//#region src/UI/fileViewer/utils/fileTypes.js
-const imageExtension = [
-	"png",
-	"jpeg",
-	"jpg",
-	"jpe",
-	"jif",
-	"jfif",
-	"jfi",
-	"gif",
-	"raw",
-	"svg",
-	"ttif",
-	"tif",
-	"webp",
-	"arw",
-	"sr2",
-	"nrw",
-	"k25",
-	"bmp",
-	"dib",
-	"heif",
-	"heic",
-	"ind",
-	"indd",
-	"indt",
-	"jp2",
-	"j2k",
-	"jpf",
-	"jpm",
-	"mj2",
-	"svgz",
-	"ai",
-	"eps"
-];
-
-//#endregion
-//#region src/UI/fileViewer/utils/fileUtils.js
-const handleDownloadFile = (fileUrl, fileName) => {
-	const a = document.createElement("a");
-	a.style.display = "none";
-	a.href = fileUrl;
-	a.download = fileName;
-	document.body.appendChild(a);
-	a.click();
-	window.URL.revokeObjectURL(fileUrl);
-};
-const validateFilesImageType = (files = [], fileExtensionField) => {
-	let type = "image";
-	files.forEach((file) => {
-		if (!imageExtension.includes(file?.[fileExtensionField])) {
-			type = "invalid";
-			return;
-		}
-	});
-	return type;
-};
-
-//#endregion
-//#region src/UI/fileViewer/imageSlider/ImageFooter.jsx
-const useStyles$2 = makeStyles((theme) => ({
-	secondaryText: { color: theme.palette.text.secondary },
-	description: {
-		margin: theme.spacing(2),
-		display: "flex",
-		flexDirection: "column",
-		gap: theme.spacing(1)
-	},
-	pageAction: {
-		display: "flex",
-		justifyContent: "space-between",
-		gap: theme.spacing(1),
-		alignItems: "center"
-	}
-}));
-const ImageFooter = (props) => {
-	const { images, currentImageObj, hidePrimaryText, hideSecondaryText, handleViewImage, currentImageIndex } = props;
-	const classes = useStyles$2();
-	const { t } = useTranslation();
-	const showItem = useMemo(() => {
-		const showPrimaryText = !hidePrimaryText && currentImageObj?.primaryText;
-		const showSecondaryText = !hideSecondaryText && currentImageObj?.secondaryText;
-		const showPageAction = images?.length > 1;
-		return {
-			footer: showPageAction || showPrimaryText || showSecondaryText,
-			primaryText: showPrimaryText,
-			secondaryText: showSecondaryText,
-			pageAction: showPageAction
-		};
-	}, [
-		currentImageObj,
-		hidePrimaryText,
-		hideSecondaryText,
-		images
-	]);
-	return /* @__PURE__ */ React.createElement(React.Fragment, null, showItem?.footer && /* @__PURE__ */ React.createElement("div", { className: classes.description }, showItem?.primaryText && /* @__PURE__ */ React.createElement(Typography$1, { variant: "h6" }, currentImageObj?.primaryText), showItem?.secondaryText && /* @__PURE__ */ React.createElement(Typography$1, {
-		variant: "subtitle1",
-		className: classes.secondaryText
-	}, currentImageObj?.secondaryText), showItem?.pageAction && /* @__PURE__ */ React.createElement("div", { className: classes.pageAction }, /* @__PURE__ */ React.createElement(IconButtonWithTooltip, {
-		icon: getIconFromName("ChevronLeft"),
-		title: t("Previous"),
-		disabled: currentImageIndex == 0,
-		onClick: () => {
-			handleViewImage(true);
-		},
-		id: "udpRecord-ImageSlider-PreviousBtn",
-		udprecordid: "udpRecord-ImageSlider-PreviousBtn"
-	}), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(Typography$1, null, currentImageIndex + 1, " ", t("of"), " ", images?.length ?? 0)), /* @__PURE__ */ React.createElement(IconButtonWithTooltip, {
-		icon: getIconFromName("ChevronRight"),
-		title: t("Next"),
-		disabled: currentImageIndex === images?.length - 1,
-		onClick: () => {
-			handleViewImage();
-		},
-		id: "udpRecord-ImageSlider-NextBtn",
-		udprecordid: "udpRecord-ImageSlider-NextBtn"
-	}))));
-};
-
-//#endregion
-//#region src/UI/fileViewer/imageSlider/Image.jsx
-const useStyles$1 = makeStyles((theme) => ({
-	imageWrapper: {
-		flex: "1 1 auto",
-		overflow: "hidden",
-		position: "relative",
-		margin: theme.spacing(2)
-	},
-	image: {
-		objectFit: "contain",
-		width: "100%",
-		height: "100%",
-		position: "absolute",
-		top: 0,
-		left: 0
-	},
-	cardContent: {
-		display: "flex",
-		flexDirection: "column",
-		overflow: "hidden",
-		height: "100%",
-		background: theme.palette.background.paper
-	}
-}));
-const Image = (props) => {
-	const { imageObj, hidePrimaryText, hideSecondaryText } = props;
-	const classes = useStyles$1();
-	return /* @__PURE__ */ React.createElement("div", { className: classes.cardContent }, /* @__PURE__ */ React.createElement("div", { className: classes.imageWrapper }, /* @__PURE__ */ React.createElement("img", {
-		src: imageObj?.filePath,
-		loading: "lazy",
-		alt: `${imageObj?.fileName}`,
-		className: classes.image
-	})), /* @__PURE__ */ React.createElement(ImageFooter, {
-		currentImageObj: imageObj,
-		hidePrimaryText,
-		hideSecondaryText
-	}));
-};
-
-//#endregion
-//#region src/UI/fileViewer/imageSlider/ImageViewerSideSheet.jsx
-const ImageViewerSideSheet = (props) => {
-	const { title, width, imageObj, open, onClose, hideDownload, hidePrimaryText, hideSecondaryText } = props;
-	const { t } = useTranslation();
-	const handleDownloadImage = useCallback(() => {
-		handleDownloadFile(imageObj?.filePath, imageObj?.fileName);
-	}, [imageObj]);
-	return /* @__PURE__ */ React.createElement(SideSheet, {
-		title: title ?? t("Image Viewer"),
-		buttonLabel: hideDownload ? null : t("Download"),
-		width: width ?? "90vw",
-		onSubmit: handleDownloadImage,
-		open,
-		onClose,
-		contentHeight: "100%"
-	}, /* @__PURE__ */ React.createElement(Image, {
-		imageObj,
-		hidePrimaryText,
-		hideSecondaryText
-	}));
-};
-
-//#endregion
-//#region src/UI/fileViewer/imageSlider/ImageSlider.jsx
-const useStyles = makeStyles((theme) => ({
-	root: { backgroundColor: theme.palette.background.paper },
-	imagesWrapper: {
-		display: "flex",
-		width: "100%",
-		height: "100%",
-		overflow: "hidden",
-		alignItems: "center"
-	},
-	imageSection: {
-		width: "100%",
-		height: "100%"
-	},
-	image: {
-		objectFit: "contain",
-		display: "block",
-		flexShrink: 0,
-		flexGrow: 0,
-		transition: "translate 300ms ease-in-out"
-	},
-	openSideSheetIcon: {
-		display: "block",
-		position: "absolute",
-		top: (props) => props?.title ? 64 : 8,
-		right: 8,
-		zIndex: 3,
-		backgroundColor: theme.palette.background.paper
-	},
-	dialogContent: {
-		overflow: "hidden",
-		width: "100vw",
-		height: "100vh",
-		display: "flex",
-		flexDirection: "column"
-	},
-	closeDialog: { margin: theme.spacing(1) },
-	dialogImageSection: {
-		flex: 2,
-		height: "100%"
-	}
-}));
-const defaultFieldMapping$1 = {
-	filePath: "filePath",
-	fileName: "fileName",
-	primaryText: "primaryText",
-	secondaryText: "secondaryText"
-};
-const ImageSlider = (props) => {
-	const { title, images, fieldMapping = defaultFieldMapping$1, sideSheetTitle, sideSheetWidth, hideDownload, hidePrimaryText, hideSecondaryText, hidePrimaryTextInExpandMode, hideSecondaryTextInExpandMode, expandInSideSheet = true } = props;
-	const classes = useStyles(props);
-	const { t } = useTranslation();
-	const [currentImageIndex, setCurrentImageIndex] = useState(0);
-	const [openSideSheet, setOpenSideSheet] = useState(false);
-	const handleViewImage = useCallback((previous = false) => {
-		if (previous) setCurrentImageIndex((prev) => prev - 1);
-		else setCurrentImageIndex((prev) => prev + 1);
-	}, []);
-	const handleExpandImage = useCallback(() => {
-		setOpenSideSheet(true);
-	}, []);
-	const currentImageObj = useMemo(() => {
-		const imgObj = images?.[currentImageIndex];
-		if (!imgObj) return {};
-		return {
-			filePath: imgObj[fieldMapping?.filePath],
-			fileName: imgObj[fieldMapping?.fileName],
-			primaryText: imgObj[fieldMapping?.primaryText],
-			secondaryText: imgObj[fieldMapping?.secondaryText]
-		};
-	}, [
-		currentImageIndex,
-		fieldMapping,
-		images
-	]);
-	return /* @__PURE__ */ React.createElement(AmbientCard, {
-		fullWidth: true,
-		title,
-		removePadding: true,
-		lastChildBottomPadding: "0px",
-		removeTopLayoutUnit: true
-	}, /* @__PURE__ */ React.createElement("div", { className: classes.imagesWrapper }, images?.map((image) => /* @__PURE__ */ React.createElement("img", {
-		src: image?.[fieldMapping?.filePath],
-		alt: `${image?.[fieldMapping?.fileName]}`,
-		loading: "lazy",
-		width: "100%",
-		height: "auto",
-		className: classes.image,
-		style: { translate: `${-100 * currentImageIndex}%` }
-	}))), /* @__PURE__ */ React.createElement(IconButtonWithTooltip, {
-		icon: getIconFromName("MiniExpand"),
-		title: t("Expand Image"),
-		onClick: handleExpandImage,
-		id: "udpRecord-ImageSlider-ExpandBtn",
-		udprecordid: "udpRecord-ImageSlider-ExpandBtn",
-		className: classes.openSideSheetIcon
-	}), /* @__PURE__ */ React.createElement(ImageFooter, {
-		images,
-		currentImageObj,
-		hidePrimaryText,
-		hideSecondaryText,
-		handleViewImage,
-		currentImageIndex
-	}), expandInSideSheet ? /* @__PURE__ */ React.createElement(ImageViewerSideSheet, {
-		title: sideSheetTitle,
-		open: openSideSheet,
-		onClose: () => {
-			setOpenSideSheet(false);
-		},
-		imageObj: currentImageObj,
-		width: sideSheetWidth,
-		hideDownload,
-		hidePrimaryText: hidePrimaryTextInExpandMode,
-		hideSecondaryText: hideSecondaryTextInExpandMode
-	}) : /* @__PURE__ */ React.createElement(Dialog, {
-		onClose: () => {
-			setOpenSideSheet(false);
-		},
-		open: openSideSheet,
-		fullScreen: true
-	}, /* @__PURE__ */ React.createElement("div", { className: classes.dialogContent }, /* @__PURE__ */ React.createElement("div", { className: classes.closeDialog }, /* @__PURE__ */ React.createElement(IconButtonWithTooltip, {
-		icon: getIconFromName("Cancel"),
-		title: t("Close"),
-		onClick: () => {
-			setOpenSideSheet(false);
-		},
-		id: "udpRecord-ImageSlider-PreviousBtn",
-		udprecordid: "udpRecord-ImageSlider-PreviousBtn"
-	})), /* @__PURE__ */ React.createElement("div", { className: classes.dialogImageSection }, /* @__PURE__ */ React.createElement(Image, {
-		imageObj: currentImageObj,
-		hidePrimaryText: hidePrimaryTextInExpandMode,
-		hideSecondaryText: hideSecondaryTextInExpandMode
-	})))));
-};
-
-//#endregion
-//#region src/UI/fileViewer/FileViewer.jsx
-const defaultFieldMapping = {
-	filePath: "filePath",
-	blobFile: "blobFile",
-	fileName: "fileName",
-	fileExtension: "fileExtension",
-	primaryText: "primaryText",
-	secondaryText: "secondaryText"
-};
-const FileViewer = (props) => {
-	const { data, fieldMapping = defaultFieldMapping, acceptedFileExtensions,...otherProps } = props;
-	const { t } = useTranslation();
-	const filteredData = useMemo(() => {
-		if (!acceptedFileExtensions || acceptedFileExtensions?.length === 0) return data;
-		if (data instanceof Array && data?.length > 0) return data?.filter((item) => acceptedFileExtensions?.includes(item?.[fieldMapping?.fileExtension]));
-		else return acceptedFileExtensions?.includes(data?.[fieldMapping?.fileExtension]) ? data : null;
-	}, [
-		acceptedFileExtensions,
-		data,
-		fieldMapping
-	]);
-	const fileType = useMemo(() => {
-		if (filteredData instanceof Array) return validateFilesImageType(filteredData, fieldMapping?.fileExtension);
-		return filteredData?.[fieldMapping?.fileExtension];
-	}, [fieldMapping, filteredData]);
-	const viewer = useMemo(() => {
-		switch (fileType) {
-			case "pdf": return /* @__PURE__ */ React.createElement(PDFViewer, {
-				fileUrl: filteredData?.[fieldMapping?.filePath],
-				blobPDF: filteredData?.[fieldMapping?.blobFile],
-				...otherProps
-			});
-			case "image": return /* @__PURE__ */ React.createElement(ImageSlider, {
-				images: filteredData,
-				fieldMapping,
-				...otherProps
-			});
-			default: return /* @__PURE__ */ React.createElement(AmbientAlert, {
-				alertMessage: t("Unable to view file"),
-				showAlert: true,
-				alertSeverity: "error"
-			});
-		}
-	}, [
-		fileType,
-		data,
-		fieldMapping,
-		otherProps
-	]);
-	return /* @__PURE__ */ React.createElement(React.Fragment, null, viewer);
-};
-
-//#endregion
-export { FileViewer as t };
-//# sourceMappingURL=FileViewer-Cqrlt60_.js.map