npm - @corva/ui - Versions diffs - 3.75.0-9 → 3.75.0-rc.0 - Mend

@corva/ui 3.75.0-9 → 3.75.0-rc.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1470) hide show

package/components/Attachment/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../../../src/components/Attachment/index.js"],"sourcesContent":["import { useCallback, useState } from 'react';\nimport PropTypes from 'prop-types';\nimport ReactPlayer from 'react-player';\nimport classNames from 'classnames';\nimport { withStyles } from '@material-ui/core/styles';\nimport { Typography } from '@material-ui/core';\nimport ImageIcon from '@material-ui/icons/Image';\nimport FullSizeIcon from '@material-ui/icons/Fullscreen';\nimport grey from '@material-ui/core/colors/grey';\n\nimport { NewDocumentViewer } from '../NewDocumentViewer';\nimport { UnavailableFileIcon } from '../NewDocumentViewer/icons/UnavailableFileIcon';\nimport { ImageViewer } from '../../componentsV2/ImageViewer';\n\nimport styles from './styles.css';\n\nimport FileTypeIcon from '~components/FileTypeIcon';\nimport IconButton from '~components/IconButton';\nimport { isNativeDetected } from '~/utils/mobileDetect';\nimport { getIsImage, getIsVideo } from '~/utils/fileExtension';\nimport { getIsPreviewUnavailable } from '~/utils/filePreview';\nimport { DownloadIcon } from '~/icons';\nimport { useSignedURL } from '~/effects';\nimport utils from '~utils/main';\n\nconst PAGE_NAME = 'Attachment';\n\nconst grey200 = grey[200];\nconst grey400 = grey[400];\n\nconst SIZES = {\n small: { label: 'small', value: 135 },\n medium: { label: 'medium', value: 300 },\n};\n\nconst style = {\n fileImage: (imageIsLoaded, size) => ({\n maxWidth: '100%',\n borderRadius: 4,\n overflow: 'hidden',\n // NOTE: Makes one-line comment with image fits into comments container. Equals to\n // imagePlaceholder height\n maxHeight: size === SIZES.small.label ? SIZES.small.value : SIZES.medium.value,\n display: imageIsLoaded ? 'initial' : 'none',\n cursor: 'pointer',\n }),\n fileDownloadWrapper: {\n padding: '10px 10px 10px 5px',\n border: `1px solid #616161`,\n borderRadius: 3,\n maxWidth: 500, // NOTE: Corresponds to react-player max width\n width: '75%',\n },\n imagePlaceholder: {\n position: 'relative',\n backgroundColor: grey200,\n borderRadius: 3,\n marginTop: 10,\n height: 135,\n width: 135,\n },\n};\n\nconst muiStyles = theme => ({\n imageIconRoot: {\n position: 'absolute',\n top: '50%',\n left: '50%',\n transform: 'translate(-50%, -50%)',\n },\n dialog: {\n width: '95%',\n height: '95%',\n maxWidth: '100%',\n position: 'relative',\n },\n nativeDialog: {\n width: '100%',\n height: '100%',\n maxWidth: '100%',\n maxHeight: '100%',\n margin: 0,\n },\n dialogRoot: {\n // NOTE: Make background color similar to lightbox\n backgroundColor: 'rgba(0, 0, 0, 0.85)',\n },\n fileName: {\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n fontWeight: 400,\n },\n downloadIcon: {\n color: theme.palette.primary.text3,\n },\n disabledPreview: {\n backgroundColor: theme.palette.primary.text9,\n },\n unavailableFileIcon: {\n marginRight: 12,\n minWidth: 32,\n },\n titleContainer: {\n display: 'flex',\n flexDirection: 'column',\n width: '100%',\n },\n caption: {\n fontSize: 12,\n fontWeight: 400,\n width: 'fit-content',\n },\n unavailableFileName: {\n fontSize: 12,\n fontWeight: 400,\n },\n});\n\n/* eslint-disable react/prop-types /\nconst ImageAttachment = props => {\n const downloadLink = useSignedURL(props.attachmentFileName) \|\| props.attachmentUrl;\n\n return (\n <>\n <div onClick={props.openLightbox} className={styles.cAttachmentImg}>\n <img\n data-testid={`${PAGE_NAME}_image`}\n src={downloadLink}\n style={style.fileImage(!!props.imageDimensions, props.size)}\n alt=\"Attachment\"\n onLoad={props.onImageLoaded}\n />\n <div data-testid={`${PAGE_NAME}_button`} className={styles.cAttachmentImgPreviwBtn}>\n <FullSizeIcon />\n </div>\n </div>\n\n {!props.imageDimensions && (\n <div style={style.imagePlaceholder}>\n <ImageIcon\n data-testid={`${PAGE_NAME}_placeholder`}\n className={props.classes.imageIconRoot}\n htmlColor={grey400}\n fontSize=\"large\"\n />\n </div>\n )}\n\n {props.lightboxIsOpen && (\n <ImageViewer\n src={downloadLink}\n onClose={props.handleLightboxClose}\n onOpen={props.handleLightboxOpen}\n width={props.imageDimensions?.width}\n height={props.imageDimensions?.height}\n />\n )}\n </>\n );\n};\n\nconst FileAttachment = props => {\n const fileName = utils.getFileNameWithExtensionFromPath(props.displayName \|\| props.attachmentUrl);\n\n const previewUrl = useSignedURL(props.attachmentFileName, 'inline');\n const downloadUrl = useSignedURL(props.attachmentFileName, 'attachment');\n\n const isPreviewUnavailable = getIsPreviewUnavailable(fileName);\n\n const handleFilePreviewOpen = () => {\n if (isPreviewUnavailable) return;\n props.openPreview();\n };\n\n return (\n <div className={styles.cAttachmentFileWrapper}>\n <div\n className={classNames(\n styles.cAttachmentFileDownloadWrapper,\n isPreviewUnavailable && props.classes.disabledPreview\n )}\n style={style.fileDownloadWrapper}\n onClick={handleFilePreviewOpen}\n >\n {isPreviewUnavailable ? (\n <UnavailableFileIcon className={props.classes.unavailableFileIcon} />\n ) : (\n <FileTypeIcon\n fileName={props.displayName \|\| props.attachmentUrl}\n className={styles.cAttachmentFileDownloadWrapperFileIcon}\n size={props.small ? 25 : 50}\n />\n )}\n <div className={props.classes.titleContainer}>\n {isPreviewUnavailable && <div className={props.classes.caption}>Preview unavailable</div>}\n <div\n data-testid={`${PAGE_NAME}_name`}\n className={classNames(\n styles.cAttachmentFileDownloadWrapperFileName,\n isPreviewUnavailable && props.classes.fileName\n )}\n >\n <Typography variant=\"subtitle2\" noWrap className={props.classes.unavailableFileName}>\n {fileName}\n </Typography>\n </div>\n </div>\n <NewDocumentViewer\n fileUrl={previewUrl}\n classes={{\n root: props.classes.dialogRoot,\n paper: isNativeDetected ? props.classes.nativeDialog : props.classes.dialog,\n }}\n fileName={fileName}\n fileSize={props.attachmentSize}\n onClose={props.closePreview}\n open={props.previewIsOpen}\n />\n </div>\n <a\n download={props.displayName}\n href={downloadUrl}\n className={styles.cAttachmentFileDownloadWrapperForm}\n >\n <IconButton\n data-testid={`${PAGE_NAME}_downloadButton`}\n className={props.classes.downloadIcon}\n type=\"submit\"\n >\n <DownloadIcon size={24} className={props.classes.downloadIcon} />\n </IconButton>\n </a>\n </div>\n );\n};\n\n/ eslint-enable react/prop-types */\n\nfunction Attachment(rawProps) {\n const {\n displayName = null,\n fileName: attachmentFileName = null,\n attachmentSize = undefined,\n size = SIZES.medium.label,\n small = false,\n ...otherProps\n } = rawProps;\n const props = {\n ...otherProps,\n displayName,\n fileName: attachmentFileName,\n attachmentSize,\n size,\n small,\n };\n\n const [imageDimensions, setImageDimensions] = useState(undefined);\n const [isLightboxOpen, setIsLightboxOpen] = useState(false);\n const [isPreviewOpen, setIsPreviewOpen] = useState(false);\n\n const fileName = props.displayName \|\| props.attachmentUrl \|\| props.fileName;\n const isImage = getIsImage(fileName);\n const isVideo = getIsVideo(fileName);\n\n // Don't fetch download link if attachmentUrl is provided\n const downloadLink = useSignedURL(!props.attachmentUrl && props.fileName);\n const attachmentUrl = props.attachmentUrl \|\| downloadLink;\n const preventIOSScroll = useCallback(e => e.preventDefault(), []);\n\n // NOTE: iOS WebView has a bug when background content of React Modal is scrollable\n // Source: https://github.com/reactjs/react-modal/issues/369\n const handleLightboxOpen = useCallback(() => {\n if (isNativeDetected) {\n // document.documentElement.style.overflowY = 'hidden';\n document.documentElement.addEventListener('touchmove', preventIOSScroll, {\n passive: false,\n });\n }\n }, [preventIOSScroll]);\n\n const handleLightboxClose = useCallback(() => {\n if (isNativeDetected) {\n // document.documentElement.style.overflowY = 'visible';\n document.documentElement.removeEventListener('touchmove', preventIOSScroll);\n }\n setIsLightboxOpen(false);\n }, [preventIOSScroll]);\n\n const openLightbox = useCallback(() => setIsLightboxOpen(true), []);\n const onImageLoaded = useCallback(e => {\n const { naturalWidth, naturalHeight } = e.currentTarget;\n setImageDimensions({ width: naturalWidth, height: naturalHeight });\n }, []);\n const openPreview = useCallback(() => setIsPreviewOpen(true), []);\n const closePreview = useCallback(e => {\n e.stopPropagation();\n setIsPreviewOpen(false);\n }, []);\n\n if (isImage)\n return (\n <div className={styles.cAttachment}>\n <ImageAttachment\n size={props.size}\n openLightbox={openLightbox}\n attachmentFileName={props.fileName}\n attachmentUrl={props.attachmentUrl}\n onImageLoaded={onImageLoaded}\n imageDimensions={imageDimensions}\n lightboxIsOpen={isLightboxOpen}\n handleLightboxOpen={handleLightboxOpen}\n handleLightboxClose={handleLightboxClose}\n classes={props.classes}\n />\n </div>\n );\n\n if (isVideo && ReactPlayer.canPlay(attachmentUrl))\n return (\n <div className={styles.cAttachment}>\n <ReactPlayer\n data-testid={`${PAGE_NAME}_player`}\n className={styles.cAttachmentReactPlayer}\n url={attachmentUrl}\n config={{ file: { attributes: { preload: 'metadata' } } }}\n controls\n height={props.size === SIZES.small.label ? SIZES.small.value : SIZES.medium.value}\n width={null}\n />\n </div>\n );\n\n return (\n <div className={styles.cAttachment}>\n <FileAttachment\n attachmentUrl={attachmentUrl}\n attachmentFileName={props.fileName}\n attachmentSize={props.attachmentSize}\n displayName={props.displayName}\n openPreview={openPreview}\n closePreview={closePreview}\n previewIsOpen={isPreviewOpen}\n classes={props.classes}\n small={props.small}\n />\n </div>\n );\n}\n\nAttachment.propTypes = {\n attachmentUrl: PropTypes.string.isRequired,\n attachmentSize: PropTypes.number,\n displayName: PropTypes.string,\n fileName: PropTypes.string,\n size: PropTypes.oneOf([SIZES.small.label, SIZES.medium.label]),\n classes: PropTypes.shape({}).isRequired,\n small: PropTypes.bool,\n};\n\nexport default withStyles(muiStyles)(Attachment);\n"],"names":["grey200","grey","grey400","SIZES","label","value","style","fileImage","imageIsLoaded","size","maxWidth","borderRadius","overflow","maxHeight","display","cursor","fileDownloadWrapper","padding","border","width","imagePlaceholder","position","backgroundColor","marginTop","height","ImageAttachment","props","_props$imageDimension","_props$imageDimension2","downloadLink","useSignedURL","attachmentFileName","attachmentUrl","_jsxs","_Fragment","children","onClick","openLightbox","className","styles","cAttachmentImg","_jsx","concat","src","imageDimensions","alt","onLoad","onImageLoaded","cAttachmentImgPreviwBtn","FullSizeIcon","ImageIcon","classes","imageIconRoot","htmlColor","fontSize","lightboxIsOpen","ImageViewer","onClose","handleLightboxClose","onOpen","handleLightboxOpen","FileAttachment","fileName","utils","getFileNameWithExtensionFromPath","displayName","previewUrl","downloadUrl","isPreviewUnavailable","getIsPreviewUnavailable","cAttachmentFileWrapper","classNames","cAttachmentFileDownloadWrapper","disabledPreview","openPreview","UnavailableFileIcon","unavailableFileIcon","FileTypeIcon","cAttachmentFileDownloadWrapperFileIcon","small","titleContainer","caption","cAttachmentFileDownloadWrapperFileName","Typography","variant","noWrap","unavailableFileName","NewDocumentViewer","fileUrl","root","dialogRoot","paper","isNativeDetected","nativeDialog","dialog","fileSize","attachmentSize","closePreview","open","previewIsOpen","download","href","cAttachmentFileDownloadWrapperForm","IconButton","downloadIcon","type","DownloadIcon","Attachment","rawProps","_rawProps$displayName","_rawProps$fileName","_rawProps$attachmentS","undefined","_rawProps$size","_rawProps$small","_excluded","useState","_useState2","_slicedToArray","_useState","setImageDimensions","_useState4","_useState3","isLightboxOpen","setIsLightboxOpen","_useState6","_useState5","isPreviewOpen","setIsPreviewOpen","isImage","getIsImage","isVideo","getIsVideo","preventIOSScroll","useCallback","e","preventDefault","document","documentElement","addEventListener","passive","removeEventListener","currentTarget","naturalWidth","naturalHeight","stopPropagation","cAttachment","ReactPlayer","canPlay","cAttachmentReactPlayer","url","config","file","attributes","preload","controls","propTypes","PropTypes","string","isRequired","number","oneOf","shape","bool","Attachment$1","withStyles","theme","top","left","transform","margin","whiteSpace","textOverflow","fontWeight","color","palette","primary","text3","text9","marginRight","minWidth","flexDirection"],"mappings":"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"}
1	+ {"version":3,"file":"index.js","sources":["../../../src/components/Attachment/index.js"],"sourcesContent":["import { useCallback, useState } from 'react';\nimport PropTypes from 'prop-types';\nimport ReactPlayer from 'react-player';\nimport classNames from 'classnames';\nimport { withStyles } from '@material-ui/core/styles';\nimport { Typography } from '@material-ui/core';\nimport ImageIcon from '@material-ui/icons/Image';\nimport FullSizeIcon from '@material-ui/icons/Fullscreen';\nimport grey from '@material-ui/core/colors/grey';\n\nimport { NewDocumentViewer } from '../NewDocumentViewer';\nimport { UnavailableFileIcon } from '../NewDocumentViewer/icons/UnavailableFileIcon';\nimport { ImageViewer } from '../../componentsV2/ImageViewer';\n\nimport styles from './styles.css';\n\nimport FileTypeIcon from '~components/FileTypeIcon';\nimport IconButton from '~components/IconButton';\nimport { isNativeDetected } from '~/utils/mobileDetect';\nimport { getIsImage, getIsVideo } from '~/utils/fileExtension';\nimport { getIsPreviewUnavailable } from '~/utils/filePreview';\nimport { DownloadIcon } from '~/icons';\nimport { useSignedURL } from '~/effects';\nimport utils from '~utils/main';\n\nconst PAGE_NAME = 'Attachment';\n\nconst grey200 = grey[200];\nconst grey400 = grey[400];\n\nconst SIZES = {\n small: { label: 'small', value: 135 },\n medium: { label: 'medium', value: 300 },\n};\n\nconst style = {\n fileImage: (imageIsLoaded, size) => ({\n maxWidth: '100%',\n borderRadius: 4,\n overflow: 'hidden',\n // NOTE: Makes one-line comment with image fits into comments container. Equals to\n // imagePlaceholder height\n maxHeight: size === SIZES.small.label ? SIZES.small.value : SIZES.medium.value,\n display: imageIsLoaded ? 'initial' : 'none',\n cursor: 'pointer',\n }),\n fileDownloadWrapper: {\n padding: '10px 10px 10px 5px',\n border: `1px solid #616161`,\n borderRadius: 3,\n maxWidth: 500, // NOTE: Corresponds to react-player max width\n width: '75%',\n },\n imagePlaceholder: {\n position: 'relative',\n backgroundColor: grey200,\n borderRadius: 3,\n marginTop: 10,\n height: 135,\n width: 135,\n },\n};\n\nconst muiStyles = theme => ({\n imageIconRoot: {\n position: 'absolute',\n top: '50%',\n left: '50%',\n transform: 'translate(-50%, -50%)',\n },\n dialog: {\n width: '95%',\n height: '95%',\n maxWidth: '100%',\n position: 'relative',\n },\n nativeDialog: {\n width: '100%',\n height: '100%',\n maxWidth: '100%',\n maxHeight: '100%',\n margin: 0,\n },\n dialogRoot: {\n // NOTE: Make background color similar to lightbox\n backgroundColor: 'rgba(0, 0, 0, 0.85)',\n },\n fileName: {\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n textOverflow: 'ellipsis',\n fontWeight: 400,\n },\n downloadIcon: {\n color: theme.palette.primary.text3,\n },\n disabledPreview: {\n backgroundColor: theme.palette.primary.text9,\n },\n unavailableFileIcon: {\n marginRight: 12,\n minWidth: 32,\n },\n titleContainer: {\n display: 'flex',\n flexDirection: 'column',\n width: '100%',\n },\n caption: {\n fontSize: 12,\n fontWeight: 400,\n width: 'fit-content',\n },\n unavailableFileName: {\n fontSize: 12,\n fontWeight: 400,\n },\n});\n\n/* eslint-disable react/prop-types /\nconst ImageAttachment = props => {\n const downloadLink = useSignedURL(props.attachmentFileName) \|\| props.attachmentUrl;\n\n return (\n <>\n <div onClick={props.openLightbox} className={styles.cAttachmentImg}>\n <img\n data-testid={`${PAGE_NAME}_image`}\n src={downloadLink}\n style={style.fileImage(!!props.imageDimensions, props.size)}\n alt=\"Attachment\"\n onLoad={props.onImageLoaded}\n />\n <div data-testid={`${PAGE_NAME}_button`} className={styles.cAttachmentImgPreviwBtn}>\n <FullSizeIcon />\n </div>\n </div>\n\n {!props.imageDimensions && (\n <div style={style.imagePlaceholder}>\n <ImageIcon\n data-testid={`${PAGE_NAME}_placeholder`}\n className={props.classes.imageIconRoot}\n htmlColor={grey400}\n fontSize=\"large\"\n />\n </div>\n )}\n\n {props.lightboxIsOpen && (\n <ImageViewer\n src={downloadLink}\n onClose={props.handleLightboxClose}\n onOpen={props.handleLightboxOpen}\n width={props.imageDimensions?.width}\n height={props.imageDimensions?.height}\n />\n )}\n </>\n );\n};\n\nconst FileAttachment = props => {\n const fileName = utils.getFileNameWithExtensionFromPath(props.displayName \|\| props.attachmentUrl);\n\n const previewUrl = useSignedURL(props.attachmentFileName, 'inline');\n const downloadUrl = useSignedURL(props.attachmentFileName, 'attachment');\n\n const isPreviewUnavailable = getIsPreviewUnavailable(fileName);\n\n const handleFilePreviewOpen = () => {\n if (isPreviewUnavailable) return;\n props.openPreview();\n };\n\n return (\n <div className={styles.cAttachmentFileWrapper}>\n <div\n className={classNames(\n styles.cAttachmentFileDownloadWrapper,\n isPreviewUnavailable && props.classes.disabledPreview\n )}\n style={style.fileDownloadWrapper}\n onClick={handleFilePreviewOpen}\n >\n {isPreviewUnavailable ? (\n <UnavailableFileIcon className={props.classes.unavailableFileIcon} />\n ) : (\n <FileTypeIcon\n fileName={props.displayName \|\| props.attachmentUrl}\n className={styles.cAttachmentFileDownloadWrapperFileIcon}\n size={props.small ? 25 : 50}\n />\n )}\n <div className={props.classes.titleContainer}>\n {isPreviewUnavailable && <div className={props.classes.caption}>Preview unavailable</div>}\n <div\n data-testid={`${PAGE_NAME}_name`}\n className={classNames(\n styles.cAttachmentFileDownloadWrapperFileName,\n isPreviewUnavailable && props.classes.fileName\n )}\n >\n <Typography variant=\"subtitle2\" noWrap className={props.classes.unavailableFileName}>\n {fileName}\n </Typography>\n </div>\n </div>\n <NewDocumentViewer\n fileUrl={previewUrl}\n classes={{\n root: props.classes.dialogRoot,\n paper: isNativeDetected ? props.classes.nativeDialog : props.classes.dialog,\n }}\n fileName={fileName}\n fileSize={props.attachmentSize}\n onClose={props.closePreview}\n open={props.previewIsOpen}\n />\n </div>\n <a\n download={props.displayName}\n href={downloadUrl}\n className={styles.cAttachmentFileDownloadWrapperForm}\n >\n <IconButton\n data-testid={`${PAGE_NAME}_downloadButton`}\n className={props.classes.downloadIcon}\n type=\"submit\"\n >\n <DownloadIcon size={24} className={props.classes.downloadIcon} />\n </IconButton>\n </a>\n </div>\n );\n};\n\n/ eslint-enable react/prop-types */\n\nfunction Attachment(rawProps) {\n const {\n displayName = null,\n fileName: attachmentFileName = null,\n attachmentSize = undefined,\n size = SIZES.medium.label,\n small = false,\n ...otherProps\n } = rawProps;\n const props = {\n ...otherProps,\n displayName,\n fileName: attachmentFileName,\n attachmentSize,\n size,\n small,\n };\n\n const [imageDimensions, setImageDimensions] = useState(undefined);\n const [isLightboxOpen, setIsLightboxOpen] = useState(false);\n const [isPreviewOpen, setIsPreviewOpen] = useState(false);\n\n const fileName = props.displayName \|\| props.attachmentUrl \|\| props.fileName;\n const isImage = getIsImage(fileName);\n const isVideo = getIsVideo(fileName);\n\n // Don't fetch download link if attachmentUrl is provided\n const downloadLink = useSignedURL(!props.attachmentUrl && props.fileName);\n const attachmentUrl = props.attachmentUrl \|\| downloadLink;\n const preventIOSScroll = useCallback(e => e.preventDefault(), []);\n\n // NOTE: iOS WebView has a bug when background content of React Modal is scrollable\n // Source: https://github.com/reactjs/react-modal/issues/369\n const handleLightboxOpen = useCallback(() => {\n if (isNativeDetected) {\n // document.documentElement.style.overflowY = 'hidden';\n document.documentElement.addEventListener('touchmove', preventIOSScroll, {\n passive: false,\n });\n }\n }, [preventIOSScroll]);\n\n const handleLightboxClose = useCallback(() => {\n if (isNativeDetected) {\n // document.documentElement.style.overflowY = 'visible';\n document.documentElement.removeEventListener('touchmove', preventIOSScroll);\n }\n setIsLightboxOpen(false);\n }, [preventIOSScroll]);\n\n const openLightbox = useCallback(() => setIsLightboxOpen(true), []);\n const onImageLoaded = useCallback(e => {\n const { naturalWidth, naturalHeight } = e.currentTarget;\n setImageDimensions({ width: naturalWidth, height: naturalHeight });\n }, []);\n const openPreview = useCallback(() => setIsPreviewOpen(true), []);\n const closePreview = useCallback(e => {\n e.stopPropagation();\n setIsPreviewOpen(false);\n }, []);\n\n if (isImage)\n return (\n <div className={styles.cAttachment}>\n <ImageAttachment\n size={props.size}\n openLightbox={openLightbox}\n attachmentFileName={props.fileName}\n attachmentUrl={props.attachmentUrl}\n onImageLoaded={onImageLoaded}\n imageDimensions={imageDimensions}\n lightboxIsOpen={isLightboxOpen}\n handleLightboxOpen={handleLightboxOpen}\n handleLightboxClose={handleLightboxClose}\n classes={props.classes}\n />\n </div>\n );\n\n if (isVideo && ReactPlayer.canPlay(attachmentUrl))\n return (\n <div className={styles.cAttachment}>\n <ReactPlayer\n data-testid={`${PAGE_NAME}_player`}\n className={styles.cAttachmentReactPlayer}\n url={attachmentUrl}\n config={{ file: { attributes: { preload: 'metadata' } } }}\n controls\n height={props.size === SIZES.small.label ? SIZES.small.value : SIZES.medium.value}\n width={null}\n />\n </div>\n );\n\n return (\n <div className={styles.cAttachment}>\n <FileAttachment\n attachmentUrl={attachmentUrl}\n attachmentFileName={props.fileName}\n attachmentSize={props.attachmentSize}\n displayName={props.displayName}\n openPreview={openPreview}\n closePreview={closePreview}\n previewIsOpen={isPreviewOpen}\n classes={props.classes}\n small={props.small}\n />\n </div>\n );\n}\n\nAttachment.propTypes = {\n attachmentUrl: PropTypes.string.isRequired,\n attachmentSize: PropTypes.number,\n displayName: PropTypes.string,\n fileName: PropTypes.string,\n size: PropTypes.oneOf([SIZES.small.label, SIZES.medium.label]),\n classes: PropTypes.shape({}).isRequired,\n small: PropTypes.bool,\n};\n\nexport default withStyles(muiStyles)(Attachment);\n"],"names":["grey200","grey","grey400","SIZES","label","value","style","fileImage","imageIsLoaded","size","maxWidth","borderRadius","overflow","maxHeight","display","cursor","fileDownloadWrapper","padding","border","width","imagePlaceholder","position","backgroundColor","marginTop","height","ImageAttachment","props","_props$imageDimension","_props$imageDimension2","downloadLink","useSignedURL","attachmentFileName","attachmentUrl","_jsxs","_Fragment","children","onClick","openLightbox","className","styles","cAttachmentImg","_jsx","concat","src","imageDimensions","alt","onLoad","onImageLoaded","cAttachmentImgPreviwBtn","FullSizeIcon","ImageIcon","classes","imageIconRoot","htmlColor","fontSize","lightboxIsOpen","ImageViewer","onClose","handleLightboxClose","onOpen","handleLightboxOpen","FileAttachment","fileName","utils","getFileNameWithExtensionFromPath","displayName","previewUrl","downloadUrl","isPreviewUnavailable","getIsPreviewUnavailable","cAttachmentFileWrapper","classNames","cAttachmentFileDownloadWrapper","disabledPreview","openPreview","UnavailableFileIcon","unavailableFileIcon","FileTypeIcon","cAttachmentFileDownloadWrapperFileIcon","small","titleContainer","caption","cAttachmentFileDownloadWrapperFileName","Typography","variant","noWrap","unavailableFileName","NewDocumentViewer","fileUrl","root","dialogRoot","paper","isNativeDetected","nativeDialog","dialog","fileSize","attachmentSize","closePreview","open","previewIsOpen","download","href","cAttachmentFileDownloadWrapperForm","IconButton","downloadIcon","type","DownloadIcon","Attachment","rawProps","_rawProps$displayName","_rawProps$fileName","_rawProps$attachmentS","undefined","_rawProps$size","_rawProps$small","_excluded","useState","_useState2","_slicedToArray","_useState","setImageDimensions","_useState4","_useState3","isLightboxOpen","setIsLightboxOpen","_useState6","_useState5","isPreviewOpen","setIsPreviewOpen","isImage","getIsImage","isVideo","getIsVideo","preventIOSScroll","useCallback","e","preventDefault","document","documentElement","addEventListener","passive","removeEventListener","currentTarget","naturalWidth","naturalHeight","stopPropagation","cAttachment","ReactPlayer","canPlay","cAttachmentReactPlayer","url","config","file","attributes","preload","controls","propTypes","PropTypes","string","isRequired","number","oneOf","shape","bool","Attachment$1","withStyles","theme","top","left","transform","margin","whiteSpace","textOverflow","fontWeight","color","palette","primary","text3","text9","marginRight","minWidth","flexDirection"],"mappings":"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"}

package/components/AttachmentLightbox/AttachmentLightbox.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{useCallback as o,useEffect as s}from"react";import{Modal as c}from"../../componentsV2/Modal/Modal.js";import{ButtonIcon as i}from"../../componentsV2/ButtonIcon/ButtonIcon.js";import{AttachmentRow as n}from"../AttachmentPreview/AttachmentRow.js";import{AttachmentPreviewPane as t}from"./AttachmentPreviewPane.js";import m from"./AttachmentLightbox.scss.js";import{LeftIcon as r,RightIcon as e}from"../../icons/iconParkIcons.js";import"../../icons/customIcons/icons/AddMessage.js";import"../../icons/customIcons/icons/DragOne.js";import"../../icons/customIcons/icons/Attention.js";import"../../icons/customIcons/icons/Collapse.js";import"../../icons/customIcons/icons/Dashboard.js";import"../../icons/customIcons/icons/Expand.js";import"../../icons/customIcons/icons/FolderClosed.js";import"../../icons/customIcons/icons/FolderClosedFilled.js";import"../../icons/customIcons/icons/FolderOpened.js";import"../../icons/customIcons/icons/GreaterOrEqual.js";import"../../icons/customIcons/icons/LessOrEqual.js";import"../../icons/customIcons/icons/Search.js";import"../../icons/customIcons/icons/SearchOne.js";import"../../icons/customIcons/icons/Wellhub.js";import"../../icons/customIcons/icons/MultiRuler.js";import"../../icons/customIcons/icons/Checkbox.js";import"../../icons/customIcons/icons/CheckboxChecked.js";import"../../icons/customIcons/icons/CheckboxIndeterminate.js";import"../../icons/customIcons/icons/Radio.js";import"../../icons/customIcons/icons/RadioChecked.js";import"../../icons/customIcons/icons/SimulFrac.js";import"../../icons/customIcons/icons/ZipperFrac.js";import"../../icons/customIcons/icons/CautionFilled.js";import"../../icons/customIcons/icons/MoreApp.js";import"../../icons/customIcons/icons/Pad.js";import"../../icons/customIcons/icons/DrilloutUnit.js";import"../../icons/customIcons/icons/FracFleet.js";import"../../icons/customIcons/icons/Global.js";import"../../icons/customIcons/icons/Program.js";import"../../icons/customIcons/icons/Rig.js";import"../../icons/customIcons/icons/Well.js";import"../../icons/customIcons/icons/Gap.js";import"../../icons/customIcons/icons/Pin.js";import"../../icons/customIcons/icons/CloseOneFilled.js";import"../../icons/customIcons/icons/AttentionFilled.js";import"../../icons/customIcons/icons/CheckOneFilled.js";import"../../icons/customIcons/icons/Archive.js";import"../../icons/customIcons/icons/ArchiveCancel.js";import"../../icons/customIcons/icons/Unarchive.js";import"../../icons/customIcons/icons/Archived.js";import"../../icons/customIcons/icons/InterventionUnit.js";import"../../icons/customIcons/icons/CloudDelete.js";import"../../icons/customIcons/icons/Lasso.js";import"../../icons/customIcons/icons/Radius.js";import"../../icons/customIcons/icons/ErrorOps.js";import"../../icons/customIcons/icons/DataTypeOps.js";import"../../icons/customIcons/icons/FalsePositiveOps.js";import"../../icons/customIcons/icons/CalibrationOps.js";import"../../icons/customIcons/icons/CriticalOps.js";import"../../icons/customIcons/icons/Company.js";import"../../icons/customIcons/icons/ArchiveOne.js";import"../../icons/customIcons/icons/ParseBotFusion.js";import"../../icons/customIcons/icons/Connect.js";import"../../icons/customIcons/icons/PuzzleOne.js";import"../../icons/customIcons/icons/Feed.js";import"../../icons/customIcons/icons/Prompt.js";import"../../icons/customIcons/icons/Companies.js";import"../../icons/customIcons/icons/ClipboardAi.js";import"../../icons/customIcons/icons/Key.js";import"../../icons/customIcons/icons/AtSignCrossed.js";import"../../icons/customIcons/icons/MappingManual.js";import"../../icons/customIcons/icons/Mapping.js";import"../../icons/customIcons/icons/Metrics.js";import"../../icons/customIcons/icons/Drops.js";import"../../icons/customIcons/icons/ClipboardSearch.js";import"../../icons/customIcons/icons/Template.js";import"../../icons/customIcons/icons/ClipboardMetrics.js";import"../../icons/customIcons/icons/ClipboardBuilder.js";import"../../icons/customIcons/icons/UnitConversion.js";import"../../icons/customIcons/icons/NPT.js";import"../../icons/customIcons/icons/GuidedFrac.js";import{jsxs as p,jsx as u}from"react/jsx-runtime";var a=function(a){var I=a.items,l=a.activeId,j=a.onActiveIdChange,d=a.onClose,h=a.onShare,v=a.title,C=void 0===v?"Files":v,f=a.testId,b=I.findIndex((function(o){return o.id===l})),g=-1===b?void 0:I[b],A=o((function(o){var s=I[b+o];s&&j(s.id)}),[I,b,j]);s((function(){if(g){var o=function(o){if(!o.defaultPrevented){var s=o.target;"function"==typeof(null==s?void 0:s.closest)&&s.closest('video, audio, input, textarea, [role="menu"]')||("ArrowLeft"===o.key&&A(-1),"ArrowRight"===o.key&&A(1))}};return document.addEventListener("keydown",o),function(){return document.removeEventListener("keydown",o)}}}),[g,A]);var F=I.length>1?p("div",{className:m.strip,children:[u(i,{size:"large",ariaLabel:"Previous attachment",disabled:b<=0,onClick:function(){return A(-1)},testId:"attachment-lightbox-prev",children:u(r,{})}),u(n,{items:I,selectedId:null!=l?l:void 0,hideActions:!0,onItemClick:function(o){return j(o.id)},className:m.stripRow,testId:"attachment-lightbox-strip"}),u(i,{size:"large",ariaLabel:"Next attachment",disabled:-1===b||b>=I.length-1,onClick:function(){return A(1)},testId:"attachment-lightbox-next",children:u(e,{})})]}):void 0;return u(c,{open:!!g,size:"fullscreen",title:C,onClose:d,actions:F,testId:f,children:!!g&&u(t,{item:g,onShare:h})})};export{a as AttachmentLightbox};
+import{useCallback as o,useEffect as s}from"react";import{Modal as c}from"../../componentsV2/Modal/Modal.js";import{ButtonIcon as n}from"../../componentsV2/ButtonIcon/ButtonIcon.js";import{AttachmentRow as i}from"../AttachmentPreview/AttachmentRow.js";import{AttachmentPreviewPane as t}from"./AttachmentPreviewPane.js";import m from"./AttachmentLightbox.scss.js";import{LeftIcon as r,RightIcon as e}from"../../icons/iconParkIcons.js";import"../../icons/customIcons/icons/AddMessage.js";import"../../icons/customIcons/icons/DragOne.js";import"../../icons/customIcons/icons/Attention.js";import"../../icons/customIcons/icons/Collapse.js";import"../../icons/customIcons/icons/Dashboard.js";import"../../icons/customIcons/icons/Expand.js";import"../../icons/customIcons/icons/FolderClosed.js";import"../../icons/customIcons/icons/FolderClosedFilled.js";import"../../icons/customIcons/icons/FolderOpened.js";import"../../icons/customIcons/icons/GreaterOrEqual.js";import"../../icons/customIcons/icons/LessOrEqual.js";import"../../icons/customIcons/icons/Search.js";import"../../icons/customIcons/icons/SearchOne.js";import"../../icons/customIcons/icons/Wellhub.js";import"../../icons/customIcons/icons/MultiRuler.js";import"../../icons/customIcons/icons/Checkbox.js";import"../../icons/customIcons/icons/CheckboxChecked.js";import"../../icons/customIcons/icons/CheckboxIndeterminate.js";import"../../icons/customIcons/icons/Radio.js";import"../../icons/customIcons/icons/RadioChecked.js";import"../../icons/customIcons/icons/SimulFrac.js";import"../../icons/customIcons/icons/ZipperFrac.js";import"../../icons/customIcons/icons/CautionFilled.js";import"../../icons/customIcons/icons/InfoRounded.js";import"../../icons/customIcons/icons/FlameFilled.js";import"../../icons/customIcons/icons/MoreApp.js";import"../../icons/customIcons/icons/Pad.js";import"../../icons/customIcons/icons/DrilloutUnit.js";import"../../icons/customIcons/icons/FracFleet.js";import"../../icons/customIcons/icons/Global.js";import"../../icons/customIcons/icons/Program.js";import"../../icons/customIcons/icons/Rig.js";import"../../icons/customIcons/icons/Well.js";import"../../icons/customIcons/icons/Gap.js";import"../../icons/customIcons/icons/Pin.js";import"../../icons/customIcons/icons/PinOne.js";import"../../icons/customIcons/icons/PinOneCrossed.js";import"../../icons/customIcons/icons/CloseOneFilled.js";import"../../icons/customIcons/icons/AttentionFilled.js";import"../../icons/customIcons/icons/CheckOneFilled.js";import"../../icons/customIcons/icons/Archive.js";import"../../icons/customIcons/icons/ArchiveCancel.js";import"../../icons/customIcons/icons/Unarchive.js";import"../../icons/customIcons/icons/Archived.js";import"../../icons/customIcons/icons/InterventionUnit.js";import"../../icons/customIcons/icons/CloudDelete.js";import"../../icons/customIcons/icons/Lasso.js";import"../../icons/customIcons/icons/Radius.js";import"../../icons/customIcons/icons/ErrorOps.js";import"../../icons/customIcons/icons/DataTypeOps.js";import"../../icons/customIcons/icons/FalsePositiveOps.js";import"../../icons/customIcons/icons/CalibrationOps.js";import"../../icons/customIcons/icons/CriticalOps.js";import"../../icons/customIcons/icons/Company.js";import"../../icons/customIcons/icons/ArchiveOne.js";import"../../icons/customIcons/icons/ParseBotFusion.js";import"../../icons/customIcons/icons/Connect.js";import"../../icons/customIcons/icons/PuzzleOne.js";import"../../icons/customIcons/icons/Feed.js";import"../../icons/customIcons/icons/Prompt.js";import"../../icons/customIcons/icons/Companies.js";import"../../icons/customIcons/icons/ClipboardAi.js";import"../../icons/customIcons/icons/Key.js";import"../../icons/customIcons/icons/AtSignCrossed.js";import"../../icons/customIcons/icons/MappingManual.js";import"../../icons/customIcons/icons/Mapping.js";import"../../icons/customIcons/icons/Metrics.js";import"../../icons/customIcons/icons/Drops.js";import"../../icons/customIcons/icons/ClipboardSearch.js";import"../../icons/customIcons/icons/Template.js";import"../../icons/customIcons/icons/ClipboardMetrics.js";import"../../icons/customIcons/icons/ClipboardBuilder.js";import"../../icons/customIcons/icons/UnitConversion.js";import"../../icons/customIcons/icons/NPT.js";import"../../icons/customIcons/icons/GuidedFrac.js";import{jsxs as u,jsx as p}from"react/jsx-runtime";var a=function(a){var I=a.items,l=a.activeId,j=a.onActiveIdChange,d=a.onClose,h=a.onShare,v=a.title,C=void 0===v?"Files":v,f=a.testId,b=I.findIndex((function(o){return o.id===l})),F=-1===b?void 0:I[b],g=o((function(o){var s=I[b+o];s&&j(s.id)}),[I,b,j]);s((function(){if(F){var o=function(o){if(!o.defaultPrevented){var s=o.target;"function"==typeof(null==s?void 0:s.closest)&&s.closest('video, audio, input, textarea, [role="menu"]')||("ArrowLeft"===o.key&&g(-1),"ArrowRight"===o.key&&g(1))}};return document.addEventListener("keydown",o),function(){return document.removeEventListener("keydown",o)}}}),[F,g]);var A=I.length>1?u("div",{className:m.strip,children:[p(n,{size:"large",ariaLabel:"Previous attachment",disabled:b<=0,onClick:function(){return g(-1)},testId:"attachment-lightbox-prev",children:p(r,{})}),p(i,{items:I,selectedId:null!=l?l:void 0,hideActions:!0,onItemClick:function(o){return j(o.id)},className:m.stripRow,testId:"attachment-lightbox-strip"}),p(n,{size:"large",ariaLabel:"Next attachment",disabled:-1===b||b>=I.length-1,onClick:function(){return g(1)},testId:"attachment-lightbox-next",children:p(e,{})})]}):void 0;return p(c,{open:!!F,size:"fullscreen",title:C,onClose:d,actions:A,testId:f,children:!!F&&p(t,{item:F,onShare:h})})};export{a as AttachmentLightbox};
 //# sourceMappingURL=AttachmentLightbox.js.map

package/components/AttachmentLightbox/AttachmentLightbox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AttachmentLightbox.js","sources":["../../../src/components/AttachmentLightbox/AttachmentLightbox.tsx"],"sourcesContent":["import { ReactNode, useCallback, useEffect } from 'react';\n\nimport { Modal } from '../../componentsV2/Modal';\nimport { ButtonIcon } from '../../componentsV2/ButtonIcon';\nimport { AttachmentRow } from '../AttachmentPreview/AttachmentRow';\nimport type { AttachmentPreviewItem } from '../AttachmentPreview/AttachmentPreview.types';\n\nimport { AttachmentPreviewPane } from './AttachmentPreviewPane';\n\nimport styles from './AttachmentLightbox.scss';\n\nimport { LeftIcon, RightIcon } from '~/icons';\n\nexport type AttachmentLightboxProps = {\n items: AttachmentPreviewItem[];\n /** `null` keeps the lightbox closed. /\n activeId: AttachmentPreviewItem['id'] \| null;\n onActiveIdChange: (id: AttachmentPreviewItem['id']) => void;\n onClose: () => void;\n /* Adds \"Share file\" to the overflow menu. */\n onShare?: (item: AttachmentPreviewItem) => void;\n title?: ReactNode;\n testId?: string;\n};\n\nexport const AttachmentLightbox = ({\n items,\n activeId,\n onActiveIdChange,\n onClose,\n onShare,\n title = 'Files',\n testId,\n}: AttachmentLightboxProps) => {\n const activeIndex = items.findIndex(item => item.id === activeId);\n const active = activeIndex === -1 ? undefined : items[activeIndex];\n\n const step = useCallback(\n (delta: number) => {\n const next = items[activeIndex + delta];\n\n if (next) onActiveIdChange(next.id);\n },\n [items, activeIndex, onActiveIdChange]\n );\n\n useEffect(() => {\n if (!active) return undefined;\n\n const handleKeyDown = (event: KeyboardEvent) => {\n // A focused <video> seeks with the arrows; only steer when nothing nearer claims the key.\n if (event.defaultPrevented) return;\n\n // With nothing focused the target is the document, which has no `closest`.\n const target = event.target as Element \| null;\n\n if (\n typeof target?.closest === 'function' &&\n target.closest('video, audio, input, textarea, [role=\"menu\"]')\n ) {\n return;\n }\n\n if (event.key === 'ArrowLeft') step(-1);\n if (event.key === 'ArrowRight') step(1);\n };\n\n document.addEventListener('keydown', handleKeyDown);\n\n return () => document.removeEventListener('keydown', handleKeyDown);\n }, [active, step]);\n\n const strip =\n items.length > 1 ? (\n <div className={styles.strip}>\n <ButtonIcon\n size=\"large\"\n ariaLabel=\"Previous attachment\"\n disabled={activeIndex <= 0}\n onClick={() => step(-1)}\n testId=\"attachment-lightbox-prev\"\n >\n <LeftIcon />\n </ButtonIcon>\n\n <AttachmentRow\n items={items}\n selectedId={activeId ?? undefined}\n hideActions\n onItemClick={item => onActiveIdChange(item.id)}\n className={styles.stripRow}\n testId=\"attachment-lightbox-strip\"\n />\n\n <ButtonIcon\n size=\"large\"\n ariaLabel=\"Next attachment\"\n disabled={activeIndex === -1 \|\| activeIndex >= items.length - 1}\n onClick={() => step(1)}\n testId=\"attachment-lightbox-next\"\n >\n <RightIcon />\n </ButtonIcon>\n </div>\n ) : undefined;\n\n return (\n <Modal\n open={!!active}\n size=\"fullscreen\"\n title={title}\n onClose={onClose}\n actions={strip}\n testId={testId}\n >\n {!!active && <AttachmentPreviewPane item={active} onShare={onShare} />}\n </Modal>\n );\n};\n"],"names":["AttachmentLightbox","_ref","items","activeId","onActiveIdChange","onClose","onShare","_ref$title","title","testId","activeIndex","findIndex","item","id","active","undefined","step","useCallback","delta","next","useEffect","handleKeyDown","event","defaultPrevented","target","closest","key","document","addEventListener","removeEventListener","strip","length","_jsxs","className","styles","children","_jsx","ButtonIcon","size","ariaLabel","disabled","onClick","LeftIcon","AttachmentRow","selectedId","hideActions","onItemClick","stripRow","RightIcon","Modal","open","actions","AttachmentPreviewPane"],"mappings":"~~qjIAyBaA~~,IAAAA,EAAqB,SAQHC,GAAA,IAP7BC,IAAAA,MACAC,IAAAA,SACAC,IAAAA,iBACAC,IAAAA,QACAC,IAAAA,QAAOC,EAAAN,EACPO,MAAAA,aAAQ,QAAOD,EACfE,IAAAA,OAEMC,EAAcR,EAAMS,WAAU,SAAAC,GAAI,OAAIA,EAAKC,KAAOV,KAClDW,GAA0B,IAAjBJ,OAAqBK,EAAYb,EAAMQ,GAEhDM,EAAOC,GACX,SAACC,GACC,IAAMC,EAAOjB,EAAMQ,EAAcQ,GAE7BC,GAAMf,EAAiBe,EAAKN,GACjC,GACD,CAACX,EAAOQ,EAAaN,IAGvBgB,GAAU,WACR,GAAKN,EAAL,CAEA,IAAMO,EAAgB,SAACC,GAErB,IAAIA,EAAMC,iBAAV,CAGA,IAAMC,EAASF,EAAME,OAGQ,mBAApBA,aAAM,EAANA,EAAQC,UACfD,EAAOC,QAAQ,kDAKC,cAAdH,EAAMI,KAAqBV,GAAM,GACnB,eAAdM,EAAMI,KAAsBV,EAAK,GAbT,GAkB9B,OAFAW,SAASC,iBAAiB,UAAWP,GAE9B,WAAA,OAAMM,SAASE,oBAAoB,UAAWR,EAAc,CAtBtC,CAuB/B,GAAG,CAACP,EAAQE,IAEZ,IAAMc,EACJ5B,EAAM6B,OAAS,EACbC,EAAA,MAAA,CAAKC,UAAWC,EAAOJ,MAAMK,SAAA,CAC3BC,EAACC,EAAU,CACTC,KAAK,QACLC,UAAU,sBACVC,SAAU9B,GAAe,EACzB+B,QAAS,WAAA,OAAMzB,GAAM,EAAG,EACxBP,OAAO,2BAA0B0B,SAEjCC,EAACM,EAAQ,MAGXN,EAACO,EAAa,CACZzC,MAAOA,EACP0C,WAAYzC,QAAAA,OAAYY,EACxB8B,aAAW,EACXC,YAAa,SAAAlC,GAAI,OAAIR,EAAiBQ,EAAKC,GAAI,EAC/CoB,UAAWC,EAAOa,SAClBtC,OAAO,8BAGT2B,EAACC,EAAU,CACTC,KAAK,QACLC,UAAU,kBACVC,UAA2B,IAAjB9B,GAAsBA,GAAeR,EAAM6B,OAAS,EAC9DU,QAAS,WAAA,OAAMzB,EAAK,EAAG,EACvBP,OAAO,2BAA0B0B,SAEjCC,EAACY,EAAS,cAGZjC,EAEN,OACEqB,EAACa,EAAK,CACJC,OAAQpC,EACRwB,KAAK,aACL9B,MAAOA,EACPH,QAASA,EACT8C,QAASrB,EACTrB,OAAQA,EAAO0B,WAEZrB,GAAUsB,EAACgB,EAAqB,CAACxC,KAAME,EAAQR,QAASA,KAGjE"}
1	+ {"version":3,"file":"AttachmentLightbox.js","sources":["../../../src/components/AttachmentLightbox/AttachmentLightbox.tsx"],"sourcesContent":["import { ReactNode, useCallback, useEffect } from 'react';\n\nimport { Modal } from '../../componentsV2/Modal';\nimport { ButtonIcon } from '../../componentsV2/ButtonIcon';\nimport { AttachmentRow } from '../AttachmentPreview/AttachmentRow';\nimport type { AttachmentPreviewItem } from '../AttachmentPreview/AttachmentPreview.types';\n\nimport { AttachmentPreviewPane } from './AttachmentPreviewPane';\n\nimport styles from './AttachmentLightbox.scss';\n\nimport { LeftIcon, RightIcon } from '~/icons';\n\nexport type AttachmentLightboxProps = {\n items: AttachmentPreviewItem[];\n /** `null` keeps the lightbox closed. /\n activeId: AttachmentPreviewItem['id'] \| null;\n onActiveIdChange: (id: AttachmentPreviewItem['id']) => void;\n onClose: () => void;\n /* Adds \"Share file\" to the overflow menu. */\n onShare?: (item: AttachmentPreviewItem) => void;\n title?: ReactNode;\n testId?: string;\n};\n\nexport const AttachmentLightbox = ({\n items,\n activeId,\n onActiveIdChange,\n onClose,\n onShare,\n title = 'Files',\n testId,\n}: AttachmentLightboxProps) => {\n const activeIndex = items.findIndex(item => item.id === activeId);\n const active = activeIndex === -1 ? undefined : items[activeIndex];\n\n const step = useCallback(\n (delta: number) => {\n const next = items[activeIndex + delta];\n\n if (next) onActiveIdChange(next.id);\n },\n [items, activeIndex, onActiveIdChange]\n );\n\n useEffect(() => {\n if (!active) return undefined;\n\n const handleKeyDown = (event: KeyboardEvent) => {\n // A focused <video> seeks with the arrows; only steer when nothing nearer claims the key.\n if (event.defaultPrevented) return;\n\n // With nothing focused the target is the document, which has no `closest`.\n const target = event.target as Element \| null;\n\n if (\n typeof target?.closest === 'function' &&\n target.closest('video, audio, input, textarea, [role=\"menu\"]')\n ) {\n return;\n }\n\n if (event.key === 'ArrowLeft') step(-1);\n if (event.key === 'ArrowRight') step(1);\n };\n\n document.addEventListener('keydown', handleKeyDown);\n\n return () => document.removeEventListener('keydown', handleKeyDown);\n }, [active, step]);\n\n const strip =\n items.length > 1 ? (\n <div className={styles.strip}>\n <ButtonIcon\n size=\"large\"\n ariaLabel=\"Previous attachment\"\n disabled={activeIndex <= 0}\n onClick={() => step(-1)}\n testId=\"attachment-lightbox-prev\"\n >\n <LeftIcon />\n </ButtonIcon>\n\n <AttachmentRow\n items={items}\n selectedId={activeId ?? undefined}\n hideActions\n onItemClick={item => onActiveIdChange(item.id)}\n className={styles.stripRow}\n testId=\"attachment-lightbox-strip\"\n />\n\n <ButtonIcon\n size=\"large\"\n ariaLabel=\"Next attachment\"\n disabled={activeIndex === -1 \|\| activeIndex >= items.length - 1}\n onClick={() => step(1)}\n testId=\"attachment-lightbox-next\"\n >\n <RightIcon />\n </ButtonIcon>\n </div>\n ) : undefined;\n\n return (\n <Modal\n open={!!active}\n size=\"fullscreen\"\n title={title}\n onClose={onClose}\n actions={strip}\n testId={testId}\n >\n {!!active && <AttachmentPreviewPane item={active} onShare={onShare} />}\n </Modal>\n );\n};\n"],"names":["AttachmentLightbox","_ref","items","activeId","onActiveIdChange","onClose","onShare","_ref$title","title","testId","activeIndex","findIndex","item","id","active","undefined","step","useCallback","delta","next","useEffect","handleKeyDown","event","defaultPrevented","target","closest","key","document","addEventListener","removeEventListener","strip","length","_jsxs","className","styles","children","_jsx","ButtonIcon","size","ariaLabel","disabled","onClick","LeftIcon","AttachmentRow","selectedId","hideActions","onItemClick","stripRow","RightIcon","Modal","open","actions","AttachmentPreviewPane"],"mappings":"swIAyBaA,IAAAA,EAAqB,SAQHC,GAAA,IAP7BC,IAAAA,MACAC,IAAAA,SACAC,IAAAA,iBACAC,IAAAA,QACAC,IAAAA,QAAOC,EAAAN,EACPO,MAAAA,aAAQ,QAAOD,EACfE,IAAAA,OAEMC,EAAcR,EAAMS,WAAU,SAAAC,GAAI,OAAIA,EAAKC,KAAOV,KAClDW,GAA0B,IAAjBJ,OAAqBK,EAAYb,EAAMQ,GAEhDM,EAAOC,GACX,SAACC,GACC,IAAMC,EAAOjB,EAAMQ,EAAcQ,GAE7BC,GAAMf,EAAiBe,EAAKN,GACjC,GACD,CAACX,EAAOQ,EAAaN,IAGvBgB,GAAU,WACR,GAAKN,EAAL,CAEA,IAAMO,EAAgB,SAACC,GAErB,IAAIA,EAAMC,iBAAV,CAGA,IAAMC,EAASF,EAAME,OAGQ,mBAApBA,aAAM,EAANA,EAAQC,UACfD,EAAOC,QAAQ,kDAKC,cAAdH,EAAMI,KAAqBV,GAAM,GACnB,eAAdM,EAAMI,KAAsBV,EAAK,GAbT,GAkB9B,OAFAW,SAASC,iBAAiB,UAAWP,GAE9B,WAAA,OAAMM,SAASE,oBAAoB,UAAWR,EAAc,CAtBtC,CAuB/B,GAAG,CAACP,EAAQE,IAEZ,IAAMc,EACJ5B,EAAM6B,OAAS,EACbC,EAAA,MAAA,CAAKC,UAAWC,EAAOJ,MAAMK,SAAA,CAC3BC,EAACC,EAAU,CACTC,KAAK,QACLC,UAAU,sBACVC,SAAU9B,GAAe,EACzB+B,QAAS,WAAA,OAAMzB,GAAM,EAAG,EACxBP,OAAO,2BAA0B0B,SAEjCC,EAACM,EAAQ,MAGXN,EAACO,EAAa,CACZzC,MAAOA,EACP0C,WAAYzC,QAAAA,OAAYY,EACxB8B,aAAW,EACXC,YAAa,SAAAlC,GAAI,OAAIR,EAAiBQ,EAAKC,GAAI,EAC/CoB,UAAWC,EAAOa,SAClBtC,OAAO,8BAGT2B,EAACC,EAAU,CACTC,KAAK,QACLC,UAAU,kBACVC,UAA2B,IAAjB9B,GAAsBA,GAAeR,EAAM6B,OAAS,EAC9DU,QAAS,WAAA,OAAMzB,EAAK,EAAG,EACvBP,OAAO,2BAA0B0B,SAEjCC,EAACY,EAAS,cAGZjC,EAEN,OACEqB,EAACa,EAAK,CACJC,OAAQpC,EACRwB,KAAK,aACL9B,MAAOA,EACPH,QAASA,EACT8C,QAASrB,EACTrB,OAAQA,EAAO0B,WAEZrB,GAAUsB,EAACgB,EAAqB,CAACxC,KAAME,EAAQR,QAASA,KAGjE"}

package/components/AttachmentLightbox/AttachmentPreviewPane.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import o from"@babel/runtime/helpers/defineProperty";import{useRef as s}from"react";import c from"classnames";import{ButtonIcon as i}from"../../componentsV2/ButtonIcon/ButtonIcon.js";import{Tooltip as n}from"../../componentsV2/Tooltip/Tooltip.js";import{AttachmentActionsMenu as t}from"../AttachmentPreview/AttachmentActionsMenu.js";import{AttachmentImage as e}from"../AttachmentPreview/AttachmentImage.js";import{AttachmentDownloadLink as m}from"../AttachmentPreview/AttachmentDownloadLink.js";import{AttachmentDocument as r}from"./AttachmentDocument.js";import{useZoomPan as a}from"./useZoomPan.js";import p from"./AttachmentLightbox.scss.js";import{PlusIcon as l,MinusIcon as u}from"../../icons/iconParkIcons.js";import"../../icons/customIcons/icons/AddMessage.js";import"../../icons/customIcons/icons/DragOne.js";import"../../icons/customIcons/icons/Attention.js";import"../../icons/customIcons/icons/Collapse.js";import"../../icons/customIcons/icons/Dashboard.js";import"../../icons/customIcons/icons/Expand.js";import"../../icons/customIcons/icons/FolderClosed.js";import"../../icons/customIcons/icons/FolderClosedFilled.js";import"../../icons/customIcons/icons/FolderOpened.js";import"../../icons/customIcons/icons/GreaterOrEqual.js";import"../../icons/customIcons/icons/LessOrEqual.js";import"../../icons/customIcons/icons/Search.js";import"../../icons/customIcons/icons/SearchOne.js";import"../../icons/customIcons/icons/Wellhub.js";import"../../icons/customIcons/icons/MultiRuler.js";import"../../icons/customIcons/icons/Checkbox.js";import"../../icons/customIcons/icons/CheckboxChecked.js";import"../../icons/customIcons/icons/CheckboxIndeterminate.js";import"../../icons/customIcons/icons/Radio.js";import"../../icons/customIcons/icons/RadioChecked.js";import"../../icons/customIcons/icons/SimulFrac.js";import"../../icons/customIcons/icons/ZipperFrac.js";import"../../icons/customIcons/icons/CautionFilled.js";import"../../icons/customIcons/icons/MoreApp.js";import"../../icons/customIcons/icons/Pad.js";import"../../icons/customIcons/icons/DrilloutUnit.js";import"../../icons/customIcons/icons/FracFleet.js";import"../../icons/customIcons/icons/Global.js";import"../../icons/customIcons/icons/Program.js";import"../../icons/customIcons/icons/Rig.js";import"../../icons/customIcons/icons/Well.js";import"../../icons/customIcons/icons/Gap.js";import"../../icons/customIcons/icons/Pin.js";import"../../icons/customIcons/icons/CloseOneFilled.js";import"../../icons/customIcons/icons/AttentionFilled.js";import"../../icons/customIcons/icons/CheckOneFilled.js";import"../../icons/customIcons/icons/Archive.js";import"../../icons/customIcons/icons/ArchiveCancel.js";import"../../icons/customIcons/icons/Unarchive.js";import"../../icons/customIcons/icons/Archived.js";import"../../icons/customIcons/icons/InterventionUnit.js";import"../../icons/customIcons/icons/CloudDelete.js";import"../../icons/customIcons/icons/Lasso.js";import"../../icons/customIcons/icons/Radius.js";import"../../icons/customIcons/icons/ErrorOps.js";import"../../icons/customIcons/icons/DataTypeOps.js";import"../../icons/customIcons/icons/FalsePositiveOps.js";import"../../icons/customIcons/icons/CalibrationOps.js";import"../../icons/customIcons/icons/CriticalOps.js";import"../../icons/customIcons/icons/Company.js";import"../../icons/customIcons/icons/ArchiveOne.js";import"../../icons/customIcons/icons/ParseBotFusion.js";import"../../icons/customIcons/icons/Connect.js";import"../../icons/customIcons/icons/PuzzleOne.js";import"../../icons/customIcons/icons/Feed.js";import"../../icons/customIcons/icons/Prompt.js";import"../../icons/customIcons/icons/Companies.js";import"../../icons/customIcons/icons/ClipboardAi.js";import"../../icons/customIcons/icons/Key.js";import"../../icons/customIcons/icons/AtSignCrossed.js";import"../../icons/customIcons/icons/MappingManual.js";import"../../icons/customIcons/icons/Mapping.js";import"../../icons/customIcons/icons/Metrics.js";import"../../icons/customIcons/icons/Drops.js";import"../../icons/customIcons/icons/ClipboardSearch.js";import"../../icons/customIcons/icons/Template.js";import"../../icons/customIcons/icons/ClipboardMetrics.js";import"../../icons/customIcons/icons/ClipboardBuilder.js";import"../../icons/customIcons/icons/UnitConversion.js";import"../../icons/customIcons/icons/NPT.js";import"../../icons/customIcons/icons/GuidedFrac.js";import{formatFileSize as j}from"../../utils/formatFileSize.js";import d from"../../utils/main.js";import{jsxs as I,jsx as h}from"react/jsx-runtime";function f(o,s){var c=Object.keys(o);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(o);s&&(i=i.filter((function(s){return Object.getOwnPropertyDescriptor(o,s).enumerable}))),c.push.apply(c,i)}return c}function v(s){for(var c=1;c<arguments.length;c++){var i=null!=arguments[c]?arguments[c]:{};c%2?f(Object(i),!0).forEach((function(c){o(s,c,i[c])})):Object.getOwnPropertyDescriptors?Object.defineProperties(s,Object.getOwnPropertyDescriptors(i)):f(Object(i)).forEach((function(o){Object.defineProperty(s,o,Object.getOwnPropertyDescriptor(i,o))}))}return s}var b=function(o){var f,b=o.item,O=o.onShare,P=s(null),g=null!==(f=b.kind)&&void 0!==f?f:"file",C="image"===g||"video"===g,y=a({canZoom:C,canPan:"image"===g,resetKey:b.id}),w=y.viewportRef,A=y.zoom,F=y.zoomIn,N=y.zoomOut,z=y.canZoomIn,k=y.canZoomOut,D=y.isPannable,Z=y.isPanning,M=y.panHandlers,S=d.getFileNameWithExtensionFromPath(b.name),x=b.hideDownload?void 0:b.downloadUrl||b.src;return I("div",{className:p.pane,"data-testid":"attachment-preview-pane",children:[I("div",{className:p.paneHeader,children:[I("div",{className:p.paneName,children:[h("div",{className:p.paneFileName,title:S,children:S}),void 0!==b.size&&h("div",{className:p.paneFileSize,children:j(b.size)})]}),I("div",{className:p.paneActions,children:[!!x&&h(m,{url:x,fileName:S,className:p.paneActionLink,testId:"attachment-preview-download"}),h(t,{item:b,onShare:O,imageRef:P})]})]}),h("div",v(v({className:c(p.paneViewport,D&&p.paneViewportPannable,Z&&p.paneViewportPanning),ref:w},M),{},{children:I("div",{className:p.paneZoomBox,style:{"--attachment-zoom":A},"data-testid":"attachment-preview-zoom-box",children:["image"===g&&h(e,{ref:P,src:b.src,alt:S,className:p.paneMedia,draggable:!1}),"video"===g&&h("video",{src:b.src,className:p.paneMedia,controls:!0,autoPlay:!0,playsInline:!0}),"file"===g&&h(r,{item:b},b.id)]})})),C&&I("div",{className:p.paneZoomControls,children:[h(n,{title:"Zoom in",placement:"left",children:h("span",{className:p.paneZoomButton,children:h(i,{size:"small",type:"tertiaryBg",ariaLabel:"Zoom in",disabled:!z,onClick:F,testId:"attachment-preview-zoom-in",children:h(l,{})})})}),h(n,{title:"Zoom out",placement:"left",children:h("span",{className:p.paneZoomButton,children:h(i,{size:"small",type:"tertiaryBg",ariaLabel:"Zoom out",disabled:!k,onClick:N,testId:"attachment-preview-zoom-out",children:h(u,{})})})})]})]})};export{b as AttachmentPreviewPane};
+import o from"@babel/runtime/helpers/defineProperty";import{useRef as s}from"react";import c from"classnames";import{ButtonIcon as i}from"../../componentsV2/ButtonIcon/ButtonIcon.js";import{Tooltip as n}from"../../componentsV2/Tooltip/Tooltip.js";import{AttachmentActionsMenu as t}from"../AttachmentPreview/AttachmentActionsMenu.js";import{AttachmentImage as e}from"../AttachmentPreview/AttachmentImage.js";import{AttachmentDownloadLink as m}from"../AttachmentPreview/AttachmentDownloadLink.js";import{AttachmentDocument as r}from"./AttachmentDocument.js";import{useZoomPan as a}from"./useZoomPan.js";import p from"./AttachmentLightbox.scss.js";import{PlusIcon as l,MinusIcon as u}from"../../icons/iconParkIcons.js";import"../../icons/customIcons/icons/AddMessage.js";import"../../icons/customIcons/icons/DragOne.js";import"../../icons/customIcons/icons/Attention.js";import"../../icons/customIcons/icons/Collapse.js";import"../../icons/customIcons/icons/Dashboard.js";import"../../icons/customIcons/icons/Expand.js";import"../../icons/customIcons/icons/FolderClosed.js";import"../../icons/customIcons/icons/FolderClosedFilled.js";import"../../icons/customIcons/icons/FolderOpened.js";import"../../icons/customIcons/icons/GreaterOrEqual.js";import"../../icons/customIcons/icons/LessOrEqual.js";import"../../icons/customIcons/icons/Search.js";import"../../icons/customIcons/icons/SearchOne.js";import"../../icons/customIcons/icons/Wellhub.js";import"../../icons/customIcons/icons/MultiRuler.js";import"../../icons/customIcons/icons/Checkbox.js";import"../../icons/customIcons/icons/CheckboxChecked.js";import"../../icons/customIcons/icons/CheckboxIndeterminate.js";import"../../icons/customIcons/icons/Radio.js";import"../../icons/customIcons/icons/RadioChecked.js";import"../../icons/customIcons/icons/SimulFrac.js";import"../../icons/customIcons/icons/ZipperFrac.js";import"../../icons/customIcons/icons/CautionFilled.js";import"../../icons/customIcons/icons/InfoRounded.js";import"../../icons/customIcons/icons/FlameFilled.js";import"../../icons/customIcons/icons/MoreApp.js";import"../../icons/customIcons/icons/Pad.js";import"../../icons/customIcons/icons/DrilloutUnit.js";import"../../icons/customIcons/icons/FracFleet.js";import"../../icons/customIcons/icons/Global.js";import"../../icons/customIcons/icons/Program.js";import"../../icons/customIcons/icons/Rig.js";import"../../icons/customIcons/icons/Well.js";import"../../icons/customIcons/icons/Gap.js";import"../../icons/customIcons/icons/Pin.js";import"../../icons/customIcons/icons/PinOne.js";import"../../icons/customIcons/icons/PinOneCrossed.js";import"../../icons/customIcons/icons/CloseOneFilled.js";import"../../icons/customIcons/icons/AttentionFilled.js";import"../../icons/customIcons/icons/CheckOneFilled.js";import"../../icons/customIcons/icons/Archive.js";import"../../icons/customIcons/icons/ArchiveCancel.js";import"../../icons/customIcons/icons/Unarchive.js";import"../../icons/customIcons/icons/Archived.js";import"../../icons/customIcons/icons/InterventionUnit.js";import"../../icons/customIcons/icons/CloudDelete.js";import"../../icons/customIcons/icons/Lasso.js";import"../../icons/customIcons/icons/Radius.js";import"../../icons/customIcons/icons/ErrorOps.js";import"../../icons/customIcons/icons/DataTypeOps.js";import"../../icons/customIcons/icons/FalsePositiveOps.js";import"../../icons/customIcons/icons/CalibrationOps.js";import"../../icons/customIcons/icons/CriticalOps.js";import"../../icons/customIcons/icons/Company.js";import"../../icons/customIcons/icons/ArchiveOne.js";import"../../icons/customIcons/icons/ParseBotFusion.js";import"../../icons/customIcons/icons/Connect.js";import"../../icons/customIcons/icons/PuzzleOne.js";import"../../icons/customIcons/icons/Feed.js";import"../../icons/customIcons/icons/Prompt.js";import"../../icons/customIcons/icons/Companies.js";import"../../icons/customIcons/icons/ClipboardAi.js";import"../../icons/customIcons/icons/Key.js";import"../../icons/customIcons/icons/AtSignCrossed.js";import"../../icons/customIcons/icons/MappingManual.js";import"../../icons/customIcons/icons/Mapping.js";import"../../icons/customIcons/icons/Metrics.js";import"../../icons/customIcons/icons/Drops.js";import"../../icons/customIcons/icons/ClipboardSearch.js";import"../../icons/customIcons/icons/Template.js";import"../../icons/customIcons/icons/ClipboardMetrics.js";import"../../icons/customIcons/icons/ClipboardBuilder.js";import"../../icons/customIcons/icons/UnitConversion.js";import"../../icons/customIcons/icons/NPT.js";import"../../icons/customIcons/icons/GuidedFrac.js";import{formatFileSize as j}from"../../utils/formatFileSize.js";import d from"../../utils/main.js";import{jsxs as I,jsx as h}from"react/jsx-runtime";function f(o,s){var c=Object.keys(o);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(o);s&&(i=i.filter((function(s){return Object.getOwnPropertyDescriptor(o,s).enumerable}))),c.push.apply(c,i)}return c}function v(s){for(var c=1;c<arguments.length;c++){var i=null!=arguments[c]?arguments[c]:{};c%2?f(Object(i),!0).forEach((function(c){o(s,c,i[c])})):Object.getOwnPropertyDescriptors?Object.defineProperties(s,Object.getOwnPropertyDescriptors(i)):f(Object(i)).forEach((function(o){Object.defineProperty(s,o,Object.getOwnPropertyDescriptor(i,o))}))}return s}var b=function(o){var f,b=o.item,O=o.onShare,P=s(null),C=null!==(f=b.kind)&&void 0!==f?f:"file",g="image"===C||"video"===C,y=a({canZoom:g,canPan:"image"===C,resetKey:b.id}),F=y.viewportRef,w=y.zoom,A=y.zoomIn,N=y.zoomOut,z=y.canZoomIn,k=y.canZoomOut,D=y.isPannable,Z=y.isPanning,M=y.panHandlers,S=d.getFileNameWithExtensionFromPath(b.name),x=b.hideDownload?void 0:b.downloadUrl||b.src;return I("div",{className:p.pane,"data-testid":"attachment-preview-pane",children:[I("div",{className:p.paneHeader,children:[I("div",{className:p.paneName,children:[h("div",{className:p.paneFileName,title:S,children:S}),void 0!==b.size&&h("div",{className:p.paneFileSize,children:j(b.size)})]}),I("div",{className:p.paneActions,children:[!!x&&h(m,{url:x,fileName:S,className:p.paneActionLink,testId:"attachment-preview-download"}),h(t,{item:b,onShare:O,imageRef:P})]})]}),h("div",v(v({className:c(p.paneViewport,D&&p.paneViewportPannable,Z&&p.paneViewportPanning),ref:F},M),{},{children:I("div",{className:p.paneZoomBox,style:{"--attachment-zoom":w},"data-testid":"attachment-preview-zoom-box",children:["image"===C&&h(e,{ref:P,src:b.src,alt:S,className:p.paneMedia,draggable:!1}),"video"===C&&h("video",{src:b.src,className:p.paneMedia,controls:!0,autoPlay:!0,playsInline:!0}),"file"===C&&h(r,{item:b},b.id)]})})),g&&I("div",{className:p.paneZoomControls,children:[h(n,{title:"Zoom in",placement:"left",children:h("span",{className:p.paneZoomButton,children:h(i,{size:"small",type:"tertiaryBg",ariaLabel:"Zoom in",disabled:!z,onClick:A,testId:"attachment-preview-zoom-in",children:h(l,{})})})}),h(n,{title:"Zoom out",placement:"left",children:h("span",{className:p.paneZoomButton,children:h(i,{size:"small",type:"tertiaryBg",ariaLabel:"Zoom out",disabled:!k,onClick:N,testId:"attachment-preview-zoom-out",children:h(u,{})})})})]})]})};export{b as AttachmentPreviewPane};
 //# sourceMappingURL=AttachmentPreviewPane.js.map

package/components/AttachmentLightbox/AttachmentPreviewPane.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AttachmentPreviewPane.js","sources":["../../../src/components/AttachmentLightbox/AttachmentPreviewPane.tsx"],"sourcesContent":["import { CSSProperties, useRef } from 'react';\nimport classNames from 'classnames';\n\nimport { ButtonIcon } from '../../componentsV2/ButtonIcon';\nimport { Tooltip } from '../../componentsV2/Tooltip';\nimport { AttachmentActionsMenu } from '../AttachmentPreview/AttachmentActionsMenu';\nimport { AttachmentImage } from '../AttachmentPreview/AttachmentImage';\nimport { AttachmentDownloadLink } from '../AttachmentPreview/AttachmentDownloadLink';\nimport type { AttachmentPreviewItem } from '../AttachmentPreview/AttachmentPreview.types';\n\nimport { AttachmentDocument } from './AttachmentDocument';\nimport { useZoomPan } from './useZoomPan';\n\nimport styles from './AttachmentLightbox.scss';\n\nimport { MinusIcon, PlusIcon } from '~/icons';\nimport { formatFileSize } from '~/utils/formatFileSize';\nimport utils from '~/utils/main';\n\nexport type AttachmentPreviewPaneProps = {\n item: AttachmentPreviewItem;\n /** Adds \"Share file\" to the overflow menu. /\n onShare?: (item: AttachmentPreviewItem) => void;\n};\n\n/* Zoom is media-only — document viewers scroll and zoom on their own. /\nexport const AttachmentPreviewPane = ({ item, onShare }: AttachmentPreviewPaneProps) => {\n const imageRef = useRef<HTMLImageElement>(null);\n const kind = item.kind ?? 'file';\n const isMedia = kind === 'image' \|\| kind === 'video';\n\n const {\n viewportRef,\n zoom,\n zoomIn,\n zoomOut,\n canZoomIn,\n canZoomOut,\n isPannable,\n isPanning,\n panHandlers,\n // Panning a zoomed <video> would swallow its own controls, so only images get the drag.\n } = useZoomPan({ canZoom: isMedia, canPan: kind === 'image', resetKey: item.id });\n\n const fileName = utils.getFileNameWithExtensionFromPath(item.name);\n const downloadUrl = item.hideDownload ? undefined : item.downloadUrl \|\| item.src;\n\n return (\n <div className={styles.pane} data-testid=\"attachment-preview-pane\">\n <div className={styles.paneHeader}>\n <div className={styles.paneName}>\n <div className={styles.paneFileName} title={fileName}>\n {fileName}\n </div>\n {item.size !== undefined && (\n <div className={styles.paneFileSize}>{formatFileSize(item.size)}</div>\n )}\n </div>\n\n <div className={styles.paneActions}>\n {!!downloadUrl && (\n <AttachmentDownloadLink\n url={downloadUrl}\n fileName={fileName}\n className={styles.paneActionLink}\n testId=\"attachment-preview-download\"\n />\n )}\n\n <AttachmentActionsMenu item={item} onShare={onShare} imageRef={imageRef} />\n </div>\n </div>\n\n <div\n className={classNames(\n styles.paneViewport,\n isPannable && styles.paneViewportPannable,\n isPanning && styles.paneViewportPanning\n )}\n ref={viewportRef}\n {...panHandlers}\n >\n <div\n className={styles.paneZoomBox}\n style={{ '--attachment-zoom': zoom } as CSSProperties}\n data-testid=\"attachment-preview-zoom-box\"\n >\n {kind === 'image' && (\n <AttachmentImage\n ref={imageRef}\n src={item.src}\n alt={fileName}\n className={styles.paneMedia}\n draggable={false}\n />\n )}\n\n {kind === 'video' && (\n // eslint-disable-next-line jsx-a11y/media-has-caption\n <video src={item.src} className={styles.paneMedia} controls autoPlay playsInline />\n )}\n\n {/ Keyed: a kept-alive instance would pair the previous file's data with the new\n renderer for one render. /}\n {kind === 'file' && <AttachmentDocument key={item.id} item={item} />}\n </div>\n </div>\n\n {isMedia && (\n <div className={styles.paneZoomControls}>\n {/ A disabled button fires no events, so the tooltip listens on a wrapper instead. */}\n <Tooltip title=\"Zoom in\" placement=\"left\">\n <span className={styles.paneZoomButton}>\n <ButtonIcon\n size=\"small\"\n type=\"tertiaryBg\"\n ariaLabel=\"Zoom in\"\n disabled={!canZoomIn}\n onClick={zoomIn}\n testId=\"attachment-preview-zoom-in\"\n >\n <PlusIcon />\n </ButtonIcon>\n </span>\n </Tooltip>\n\n <Tooltip title=\"Zoom out\" placement=\"left\">\n <span className={styles.paneZoomButton}>\n <ButtonIcon\n size=\"small\"\n type=\"tertiaryBg\"\n ariaLabel=\"Zoom out\"\n disabled={!canZoomOut}\n onClick={zoomOut}\n testId=\"attachment-preview-zoom-out\"\n >\n <MinusIcon />\n </ButtonIcon>\n </span>\n </Tooltip>\n </div>\n )}\n </div>\n );\n};\n"],"names":["AttachmentPreviewPane","_ref","_item$kind","item","onShare","imageRef","useRef","kind","isMedia","_useZoomPan","useZoomPan","canZoom","canPan","resetKey","id","viewportRef","zoom","zoomIn","zoomOut","canZoomIn","canZoomOut","isPannable","isPanning","panHandlers","fileName","utils","getFileNameWithExtensionFromPath","name","downloadUrl","hideDownload","undefined","src","_jsxs","className","styles","pane","children","paneHeader","paneName","_jsx","paneFileName","title","size","paneFileSize","formatFileSize","paneActions","AttachmentDownloadLink","url","paneActionLink","testId","AttachmentActionsMenu","_objectSpread","classNames","paneViewport","paneViewportPannable","paneViewportPanning","ref","paneZoomBox","style","AttachmentImage","alt","paneMedia","draggable","controls","autoPlay","playsInline","AttachmentDocument","paneZoomControls","Tooltip","placement","paneZoomButton","ButtonIcon","type","ariaLabel","disabled","onClick","PlusIcon","MinusIcon"],"mappings":"~~g/JA0BaA~~,IAAAA,EAAwB,SAAmDC,GAAA,IAAAC,EAAhDC,IAAAA,KAAMC,IAAAA,QACtCC,EAAWC,EAAyB,MACpCC,UAAOJ,EAAAA,EAAKI,oBAAQ,OACpBC,EAAmB,UAATD,GAA6B,UAATA,EAEpCE,EAWIC,EAAW,CAAEC,QAASH,EAASI,OAAiB,UAATL,EAAkBM,SAAUV,EAAKW,KAV1EC,IAAAA,YACAC,IAAAA,KACAC,IAAAA,OACAC,IAAAA,QACAC,IAAAA,UACAC,IAAAA,WACAC,IAAAA,WACAC,IAAAA,UACAC,IAAAA,YAIIC,EAAWC,EAAMC,iCAAiCvB,EAAKwB,MACvDC,EAAczB,EAAK0B,kBAAeC,EAAY3B,EAAKyB,aAAezB,EAAK4B,IAE7E,OACEC,EAAA,MAAA,CAAKC,UAAWC,EAAOC,KAAM,cAAY,0BAAyBC,SAChE,CAAAJ,EAAA,MAAA,CAAKC,UAAWC,EAAOG,WAAWD,SAChC,CAAAJ,EAAA,MAAA,CAAKC,UAAWC,EAAOI,SAASF,SAC9B,CAAAG,EAAA,MAAA,CAAKN,UAAWC,EAAOM,aAAcC,MAAOjB,EAASY,SAClDZ,SAEYM,IAAd3B,EAAKuC,MACJH,EAAA,MAAA,CAAKN,UAAWC,EAAOS,aAAaP,SAAEQ,EAAezC,EAAKuC,WAI9DV,EAAA,MAAA,CAAKC,UAAWC,EAAOW,YAAYT,SAAA,GAC9BR,GACDW,EAACO,EAAsB,CACrBC,IAAKnB,EACLJ,SAAUA,EACVS,UAAWC,EAAOc,eAClBC,OAAO,gCAIXV,EAACW,EAAqB,CAAC/C,KAAMA,EAAMC,QAASA,EAASC,SAAUA,UAInEkC,EAAA,MAAAY,EAAAA,EAAA,CACElB,UAAWmB,EACTlB,EAAOmB,aACPhC,GAAca,EAAOoB,qBACrBhC,GAAaY,EAAOqB,qBAEtBC,IAAKzC,GACDQ,GAAW,GAAA,CAAAa,SAEfJ,EAAA,MAAA,CACEC,UAAWC,EAAOuB,YAClBC,MAAO,CAAE,oBAAqB1C,GAC9B,cAAY,8BAA6BoB,SAAA,CAE/B,UAAT7B,GACCgC,EAACoB,EAAe,CACdH,IAAKnD,EACL0B,IAAK5B,EAAK4B,IACV6B,IAAKpC,EACLS,UAAWC,EAAO2B,UAClBC,WAAW,IAIL,UAATvD,GAECgC,EAAA,QAAA,CAAOR,IAAK5B,EAAK4B,IAAKE,UAAWC,EAAO2B,UAAWE,UAAQ,EAACC,UAAQ,EAACC,aAAW,IAKxE,SAAT1D,GAAmBgC,EAAC2B,EAAkB,CAAe/D,KAAMA,GAAfA,EAAKW,UAIrDN,GACCwB,EAAA,MAAA,CAAKC,UAAWC,EAAOiC,iBAAiB/B,SAAA,CAEtCG,EAAC6B,EAAO,CAAC3B,MAAM,UAAU4B,UAAU,OAAMjC,SACvCG,EAAA,OAAA,CAAMN,UAAWC,EAAOoC,eAAelC,SACrCG,EAACgC,EAAU,CACT7B,KAAK,QACL8B,KAAK,aACLC,UAAU,UACVC,UAAWvD,EACXwD,QAAS1D,EACTgC,OAAO,6BAA4Bb,SAEnCG,EAACqC,EAAQ,UAKfrC,EAAC6B,EAAO,CAAC3B,MAAM,WAAW4B,UAAU,OAAMjC,SACxCG,EAAA,OAAA,CAAMN,UAAWC,EAAOoC,eAAelC,SACrCG,EAACgC,EAAU,CACT7B,KAAK,QACL8B,KAAK,aACLC,UAAU,WACVC,UAAWtD,EACXuD,QAASzD,EACT+B,OAAO,8BAA6Bb,SAEpCG,EAACsC,EAAS,eAQ1B"}
1	+ {"version":3,"file":"AttachmentPreviewPane.js","sources":["../../../src/components/AttachmentLightbox/AttachmentPreviewPane.tsx"],"sourcesContent":["import { CSSProperties, useRef } from 'react';\nimport classNames from 'classnames';\n\nimport { ButtonIcon } from '../../componentsV2/ButtonIcon';\nimport { Tooltip } from '../../componentsV2/Tooltip';\nimport { AttachmentActionsMenu } from '../AttachmentPreview/AttachmentActionsMenu';\nimport { AttachmentImage } from '../AttachmentPreview/AttachmentImage';\nimport { AttachmentDownloadLink } from '../AttachmentPreview/AttachmentDownloadLink';\nimport type { AttachmentPreviewItem } from '../AttachmentPreview/AttachmentPreview.types';\n\nimport { AttachmentDocument } from './AttachmentDocument';\nimport { useZoomPan } from './useZoomPan';\n\nimport styles from './AttachmentLightbox.scss';\n\nimport { MinusIcon, PlusIcon } from '~/icons';\nimport { formatFileSize } from '~/utils/formatFileSize';\nimport utils from '~/utils/main';\n\nexport type AttachmentPreviewPaneProps = {\n item: AttachmentPreviewItem;\n /** Adds \"Share file\" to the overflow menu. /\n onShare?: (item: AttachmentPreviewItem) => void;\n};\n\n/* Zoom is media-only — document viewers scroll and zoom on their own. /\nexport const AttachmentPreviewPane = ({ item, onShare }: AttachmentPreviewPaneProps) => {\n const imageRef = useRef<HTMLImageElement>(null);\n const kind = item.kind ?? 'file';\n const isMedia = kind === 'image' \|\| kind === 'video';\n\n const {\n viewportRef,\n zoom,\n zoomIn,\n zoomOut,\n canZoomIn,\n canZoomOut,\n isPannable,\n isPanning,\n panHandlers,\n // Panning a zoomed <video> would swallow its own controls, so only images get the drag.\n } = useZoomPan({ canZoom: isMedia, canPan: kind === 'image', resetKey: item.id });\n\n const fileName = utils.getFileNameWithExtensionFromPath(item.name);\n const downloadUrl = item.hideDownload ? undefined : item.downloadUrl \|\| item.src;\n\n return (\n <div className={styles.pane} data-testid=\"attachment-preview-pane\">\n <div className={styles.paneHeader}>\n <div className={styles.paneName}>\n <div className={styles.paneFileName} title={fileName}>\n {fileName}\n </div>\n {item.size !== undefined && (\n <div className={styles.paneFileSize}>{formatFileSize(item.size)}</div>\n )}\n </div>\n\n <div className={styles.paneActions}>\n {!!downloadUrl && (\n <AttachmentDownloadLink\n url={downloadUrl}\n fileName={fileName}\n className={styles.paneActionLink}\n testId=\"attachment-preview-download\"\n />\n )}\n\n <AttachmentActionsMenu item={item} onShare={onShare} imageRef={imageRef} />\n </div>\n </div>\n\n <div\n className={classNames(\n styles.paneViewport,\n isPannable && styles.paneViewportPannable,\n isPanning && styles.paneViewportPanning\n )}\n ref={viewportRef}\n {...panHandlers}\n >\n <div\n className={styles.paneZoomBox}\n style={{ '--attachment-zoom': zoom } as CSSProperties}\n data-testid=\"attachment-preview-zoom-box\"\n >\n {kind === 'image' && (\n <AttachmentImage\n ref={imageRef}\n src={item.src}\n alt={fileName}\n className={styles.paneMedia}\n draggable={false}\n />\n )}\n\n {kind === 'video' && (\n // eslint-disable-next-line jsx-a11y/media-has-caption\n <video src={item.src} className={styles.paneMedia} controls autoPlay playsInline />\n )}\n\n {/ Keyed: a kept-alive instance would pair the previous file's data with the new\n renderer for one render. /}\n {kind === 'file' && <AttachmentDocument key={item.id} item={item} />}\n </div>\n </div>\n\n {isMedia && (\n <div className={styles.paneZoomControls}>\n {/ A disabled button fires no events, so the tooltip listens on a wrapper instead. */}\n <Tooltip title=\"Zoom in\" placement=\"left\">\n <span className={styles.paneZoomButton}>\n <ButtonIcon\n size=\"small\"\n type=\"tertiaryBg\"\n ariaLabel=\"Zoom in\"\n disabled={!canZoomIn}\n onClick={zoomIn}\n testId=\"attachment-preview-zoom-in\"\n >\n <PlusIcon />\n </ButtonIcon>\n </span>\n </Tooltip>\n\n <Tooltip title=\"Zoom out\" placement=\"left\">\n <span className={styles.paneZoomButton}>\n <ButtonIcon\n size=\"small\"\n type=\"tertiaryBg\"\n ariaLabel=\"Zoom out\"\n disabled={!canZoomOut}\n onClick={zoomOut}\n testId=\"attachment-preview-zoom-out\"\n >\n <MinusIcon />\n </ButtonIcon>\n </span>\n </Tooltip>\n </div>\n )}\n </div>\n );\n};\n"],"names":["AttachmentPreviewPane","_ref","_item$kind","item","onShare","imageRef","useRef","kind","isMedia","_useZoomPan","useZoomPan","canZoom","canPan","resetKey","id","viewportRef","zoom","zoomIn","zoomOut","canZoomIn","canZoomOut","isPannable","isPanning","panHandlers","fileName","utils","getFileNameWithExtensionFromPath","name","downloadUrl","hideDownload","undefined","src","_jsxs","className","styles","pane","children","paneHeader","paneName","_jsx","paneFileName","title","size","paneFileSize","formatFileSize","paneActions","AttachmentDownloadLink","url","paneActionLink","testId","AttachmentActionsMenu","_objectSpread","classNames","paneViewport","paneViewportPannable","paneViewportPanning","ref","paneZoomBox","style","AttachmentImage","alt","paneMedia","draggable","controls","autoPlay","playsInline","AttachmentDocument","paneZoomControls","Tooltip","placement","paneZoomButton","ButtonIcon","type","ariaLabel","disabled","onClick","PlusIcon","MinusIcon"],"mappings":"isKA0BaA,IAAAA,EAAwB,SAAmDC,GAAA,IAAAC,EAAhDC,IAAAA,KAAMC,IAAAA,QACtCC,EAAWC,EAAyB,MACpCC,UAAOJ,EAAAA,EAAKI,oBAAQ,OACpBC,EAAmB,UAATD,GAA6B,UAATA,EAEpCE,EAWIC,EAAW,CAAEC,QAASH,EAASI,OAAiB,UAATL,EAAkBM,SAAUV,EAAKW,KAV1EC,IAAAA,YACAC,IAAAA,KACAC,IAAAA,OACAC,IAAAA,QACAC,IAAAA,UACAC,IAAAA,WACAC,IAAAA,WACAC,IAAAA,UACAC,IAAAA,YAIIC,EAAWC,EAAMC,iCAAiCvB,EAAKwB,MACvDC,EAAczB,EAAK0B,kBAAeC,EAAY3B,EAAKyB,aAAezB,EAAK4B,IAE7E,OACEC,EAAA,MAAA,CAAKC,UAAWC,EAAOC,KAAM,cAAY,0BAAyBC,SAChE,CAAAJ,EAAA,MAAA,CAAKC,UAAWC,EAAOG,WAAWD,SAChC,CAAAJ,EAAA,MAAA,CAAKC,UAAWC,EAAOI,SAASF,SAC9B,CAAAG,EAAA,MAAA,CAAKN,UAAWC,EAAOM,aAAcC,MAAOjB,EAASY,SAClDZ,SAEYM,IAAd3B,EAAKuC,MACJH,EAAA,MAAA,CAAKN,UAAWC,EAAOS,aAAaP,SAAEQ,EAAezC,EAAKuC,WAI9DV,EAAA,MAAA,CAAKC,UAAWC,EAAOW,YAAYT,SAAA,GAC9BR,GACDW,EAACO,EAAsB,CACrBC,IAAKnB,EACLJ,SAAUA,EACVS,UAAWC,EAAOc,eAClBC,OAAO,gCAIXV,EAACW,EAAqB,CAAC/C,KAAMA,EAAMC,QAASA,EAASC,SAAUA,UAInEkC,EAAA,MAAAY,EAAAA,EAAA,CACElB,UAAWmB,EACTlB,EAAOmB,aACPhC,GAAca,EAAOoB,qBACrBhC,GAAaY,EAAOqB,qBAEtBC,IAAKzC,GACDQ,GAAW,GAAA,CAAAa,SAEfJ,EAAA,MAAA,CACEC,UAAWC,EAAOuB,YAClBC,MAAO,CAAE,oBAAqB1C,GAC9B,cAAY,8BAA6BoB,SAAA,CAE/B,UAAT7B,GACCgC,EAACoB,EAAe,CACdH,IAAKnD,EACL0B,IAAK5B,EAAK4B,IACV6B,IAAKpC,EACLS,UAAWC,EAAO2B,UAClBC,WAAW,IAIL,UAATvD,GAECgC,EAAA,QAAA,CAAOR,IAAK5B,EAAK4B,IAAKE,UAAWC,EAAO2B,UAAWE,UAAQ,EAACC,UAAQ,EAACC,aAAW,IAKxE,SAAT1D,GAAmBgC,EAAC2B,EAAkB,CAAe/D,KAAMA,GAAfA,EAAKW,UAIrDN,GACCwB,EAAA,MAAA,CAAKC,UAAWC,EAAOiC,iBAAiB/B,SAAA,CAEtCG,EAAC6B,EAAO,CAAC3B,MAAM,UAAU4B,UAAU,OAAMjC,SACvCG,EAAA,OAAA,CAAMN,UAAWC,EAAOoC,eAAelC,SACrCG,EAACgC,EAAU,CACT7B,KAAK,QACL8B,KAAK,aACLC,UAAU,UACVC,UAAWvD,EACXwD,QAAS1D,EACTgC,OAAO,6BAA4Bb,SAEnCG,EAACqC,EAAQ,UAKfrC,EAAC6B,EAAO,CAAC3B,MAAM,WAAW4B,UAAU,OAAMjC,SACxCG,EAAA,OAAA,CAAMN,UAAWC,EAAOoC,eAAelC,SACrCG,EAACgC,EAAU,CACT7B,KAAK,QACL8B,KAAK,aACLC,UAAU,WACVC,UAAWtD,EACXuD,QAASzD,EACT+B,OAAO,8BAA6Bb,SAEpCG,EAACsC,EAAS,eAQ1B"}

package/components/AttachmentPreview/AttachmentActionsMenu.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import o from"@babel/runtime/helpers/slicedToArray";import{useState as s,useEffect as c}from"react";import{ButtonIcon as i}from"../../componentsV2/ButtonIcon/ButtonIcon.js";import{Tooltip as n}from"../../componentsV2/Tooltip/Tooltip.js";import{Menu as t}from"../../componentsV2/Menu/Menu.js";import{getCanCopyImages as m,copyImageToClipboard as r}from"../AttachmentLightbox/copyImageToClipboard.js";import{MoreOneIcon as e,ShareTwoIcon as p,LinkOneIcon as u,PictureIcon as l}from"../../icons/iconParkIcons.js";import"../../icons/customIcons/icons/AddMessage.js";import"../../icons/customIcons/icons/DragOne.js";import"../../icons/customIcons/icons/Attention.js";import"../../icons/customIcons/icons/Collapse.js";import"../../icons/customIcons/icons/Dashboard.js";import"../../icons/customIcons/icons/Expand.js";import"../../icons/customIcons/icons/FolderClosed.js";import"../../icons/customIcons/icons/FolderClosedFilled.js";import"../../icons/customIcons/icons/FolderOpened.js";import"../../icons/customIcons/icons/GreaterOrEqual.js";import"../../icons/customIcons/icons/LessOrEqual.js";import"../../icons/customIcons/icons/Search.js";import"../../icons/customIcons/icons/SearchOne.js";import"../../icons/customIcons/icons/Wellhub.js";import"../../icons/customIcons/icons/MultiRuler.js";import"../../icons/customIcons/icons/Checkbox.js";import"../../icons/customIcons/icons/CheckboxChecked.js";import"../../icons/customIcons/icons/CheckboxIndeterminate.js";import"../../icons/customIcons/icons/Radio.js";import"../../icons/customIcons/icons/RadioChecked.js";import"../../icons/customIcons/icons/SimulFrac.js";import"../../icons/customIcons/icons/ZipperFrac.js";import"../../icons/customIcons/icons/CautionFilled.js";import"../../icons/customIcons/icons/MoreApp.js";import"../../icons/customIcons/icons/Pad.js";import"../../icons/customIcons/icons/DrilloutUnit.js";import"../../icons/customIcons/icons/FracFleet.js";import"../../icons/customIcons/icons/Global.js";import"../../icons/customIcons/icons/Program.js";import"../../icons/customIcons/icons/Rig.js";import"../../icons/customIcons/icons/Well.js";import"../../icons/customIcons/icons/Gap.js";import"../../icons/customIcons/icons/Pin.js";import"../../icons/customIcons/icons/CloseOneFilled.js";import"../../icons/customIcons/icons/AttentionFilled.js";import"../../icons/customIcons/icons/CheckOneFilled.js";import"../../icons/customIcons/icons/Archive.js";import"../../icons/customIcons/icons/ArchiveCancel.js";import"../../icons/customIcons/icons/Unarchive.js";import"../../icons/customIcons/icons/Archived.js";import"../../icons/customIcons/icons/InterventionUnit.js";import"../../icons/customIcons/icons/CloudDelete.js";import"../../icons/customIcons/icons/Lasso.js";import"../../icons/customIcons/icons/Radius.js";import"../../icons/customIcons/icons/ErrorOps.js";import"../../icons/customIcons/icons/DataTypeOps.js";import"../../icons/customIcons/icons/FalsePositiveOps.js";import"../../icons/customIcons/icons/CalibrationOps.js";import"../../icons/customIcons/icons/CriticalOps.js";import"../../icons/customIcons/icons/Company.js";import"../../icons/customIcons/icons/ArchiveOne.js";import"../../icons/customIcons/icons/ParseBotFusion.js";import"../../icons/customIcons/icons/Connect.js";import"../../icons/customIcons/icons/PuzzleOne.js";import"../../icons/customIcons/icons/Feed.js";import"../../icons/customIcons/icons/Prompt.js";import"../../icons/customIcons/icons/Companies.js";import"../../icons/customIcons/icons/ClipboardAi.js";import"../../icons/customIcons/icons/Key.js";import"../../icons/customIcons/icons/AtSignCrossed.js";import"../../icons/customIcons/icons/MappingManual.js";import"../../icons/customIcons/icons/Mapping.js";import"../../icons/customIcons/icons/Metrics.js";import"../../icons/customIcons/icons/Drops.js";import"../../icons/customIcons/icons/ClipboardSearch.js";import"../../icons/customIcons/icons/Template.js";import"../../icons/customIcons/icons/ClipboardMetrics.js";import"../../icons/customIcons/icons/ClipboardBuilder.js";import"../../icons/customIcons/icons/UnitConversion.js";import"../../icons/customIcons/icons/NPT.js";import"../../icons/customIcons/icons/GuidedFrac.js";import{showSuccessNotification as a,showErrorNotification as I}from"../../utils/notificationToasts.js";import j from"../../utils/main.js";import{jsxs as d,Fragment as C,jsx as h}from"react/jsx-runtime";var f=function(f){var b,g=f.item,v=f.onShare,F=f.size,k=void 0===F?"small":F,O=f.testIdPrefix,y=void 0===O?"attachment-preview":O,A=f.tooltip,M=void 0===A?"More":A,P=f.imageRef,x=f.className,T=s(null),S=o(T,2),D=S[0],R=S[1];c((function(){R(null)}),[g.id]);var B=g.src||g.downloadUrl,E="image"===(null!==(b=g.kind)&&void 0!==b?b:"file")&&!!g.src&&m(),L=function(o){return function(s){s.stopPropagation(),o(),R(null)}};return d(C,{children:[h(n,{title:M,children:h(i,{size:k,type:"tertiaryBg",ariaLabel:"More actions",isActive:!!D,className:x,onClick:function(o){o.stopPropagation(),R(o.currentTarget)},testId:"".concat(y,"-more"),children:h(e,{})})}),!!D&&d(t,{open:!0,anchorEl:D,placement:"bottom-end",onClose:function(){return R(null)},children:[!!v&&h(t.Item,{prefix:h(p,{}),onClick:L((function(){return v(g)})),testId:"".concat(y,"-share"),children:"Share file"}),h(t.Item,{prefix:h(u,{}),disabled:!B,onClick:L((function(){B&&(j.copyToClipboard(B),a("Link copied to clipboard"))})),testId:"".concat(y,"-copy-link"),children:"Copy link"}),E&&h(t.Item,{prefix:h(l,{}),onClick:L((function(){r(g.src,null==P?void 0:P.current).then((function(o){o?a("Image copied to clipboard"):I("Could not copy the image")}))})),testId:"".concat(y,"-copy-image"),children:"Copy image"})]})]})};export{f as AttachmentActionsMenu};
+import o from"@babel/runtime/helpers/slicedToArray";import{useState as s,useEffect as c}from"react";import{ButtonIcon as i}from"../../componentsV2/ButtonIcon/ButtonIcon.js";import{Tooltip as n}from"../../componentsV2/Tooltip/Tooltip.js";import{Menu as t}from"../../componentsV2/Menu/Menu.js";import{getCanCopyImages as m,copyImageToClipboard as r}from"../AttachmentLightbox/copyImageToClipboard.js";import{MoreOneIcon as e,ShareTwoIcon as p,LinkOneIcon as u,PictureIcon as l}from"../../icons/iconParkIcons.js";import"../../icons/customIcons/icons/AddMessage.js";import"../../icons/customIcons/icons/DragOne.js";import"../../icons/customIcons/icons/Attention.js";import"../../icons/customIcons/icons/Collapse.js";import"../../icons/customIcons/icons/Dashboard.js";import"../../icons/customIcons/icons/Expand.js";import"../../icons/customIcons/icons/FolderClosed.js";import"../../icons/customIcons/icons/FolderClosedFilled.js";import"../../icons/customIcons/icons/FolderOpened.js";import"../../icons/customIcons/icons/GreaterOrEqual.js";import"../../icons/customIcons/icons/LessOrEqual.js";import"../../icons/customIcons/icons/Search.js";import"../../icons/customIcons/icons/SearchOne.js";import"../../icons/customIcons/icons/Wellhub.js";import"../../icons/customIcons/icons/MultiRuler.js";import"../../icons/customIcons/icons/Checkbox.js";import"../../icons/customIcons/icons/CheckboxChecked.js";import"../../icons/customIcons/icons/CheckboxIndeterminate.js";import"../../icons/customIcons/icons/Radio.js";import"../../icons/customIcons/icons/RadioChecked.js";import"../../icons/customIcons/icons/SimulFrac.js";import"../../icons/customIcons/icons/ZipperFrac.js";import"../../icons/customIcons/icons/CautionFilled.js";import"../../icons/customIcons/icons/InfoRounded.js";import"../../icons/customIcons/icons/FlameFilled.js";import"../../icons/customIcons/icons/MoreApp.js";import"../../icons/customIcons/icons/Pad.js";import"../../icons/customIcons/icons/DrilloutUnit.js";import"../../icons/customIcons/icons/FracFleet.js";import"../../icons/customIcons/icons/Global.js";import"../../icons/customIcons/icons/Program.js";import"../../icons/customIcons/icons/Rig.js";import"../../icons/customIcons/icons/Well.js";import"../../icons/customIcons/icons/Gap.js";import"../../icons/customIcons/icons/Pin.js";import"../../icons/customIcons/icons/PinOne.js";import"../../icons/customIcons/icons/PinOneCrossed.js";import"../../icons/customIcons/icons/CloseOneFilled.js";import"../../icons/customIcons/icons/AttentionFilled.js";import"../../icons/customIcons/icons/CheckOneFilled.js";import"../../icons/customIcons/icons/Archive.js";import"../../icons/customIcons/icons/ArchiveCancel.js";import"../../icons/customIcons/icons/Unarchive.js";import"../../icons/customIcons/icons/Archived.js";import"../../icons/customIcons/icons/InterventionUnit.js";import"../../icons/customIcons/icons/CloudDelete.js";import"../../icons/customIcons/icons/Lasso.js";import"../../icons/customIcons/icons/Radius.js";import"../../icons/customIcons/icons/ErrorOps.js";import"../../icons/customIcons/icons/DataTypeOps.js";import"../../icons/customIcons/icons/FalsePositiveOps.js";import"../../icons/customIcons/icons/CalibrationOps.js";import"../../icons/customIcons/icons/CriticalOps.js";import"../../icons/customIcons/icons/Company.js";import"../../icons/customIcons/icons/ArchiveOne.js";import"../../icons/customIcons/icons/ParseBotFusion.js";import"../../icons/customIcons/icons/Connect.js";import"../../icons/customIcons/icons/PuzzleOne.js";import"../../icons/customIcons/icons/Feed.js";import"../../icons/customIcons/icons/Prompt.js";import"../../icons/customIcons/icons/Companies.js";import"../../icons/customIcons/icons/ClipboardAi.js";import"../../icons/customIcons/icons/Key.js";import"../../icons/customIcons/icons/AtSignCrossed.js";import"../../icons/customIcons/icons/MappingManual.js";import"../../icons/customIcons/icons/Mapping.js";import"../../icons/customIcons/icons/Metrics.js";import"../../icons/customIcons/icons/Drops.js";import"../../icons/customIcons/icons/ClipboardSearch.js";import"../../icons/customIcons/icons/Template.js";import"../../icons/customIcons/icons/ClipboardMetrics.js";import"../../icons/customIcons/icons/ClipboardBuilder.js";import"../../icons/customIcons/icons/UnitConversion.js";import"../../icons/customIcons/icons/NPT.js";import"../../icons/customIcons/icons/GuidedFrac.js";import{showSuccessNotification as a,showErrorNotification as I}from"../../utils/notificationToasts.js";import j from"../../utils/main.js";import{jsxs as d,Fragment as C,jsx as h}from"react/jsx-runtime";var f=function(f){var b,g=f.item,v=f.onShare,F=f.size,O=void 0===F?"small":F,k=f.testIdPrefix,P=void 0===k?"attachment-preview":k,y=f.tooltip,A=void 0===y?"More":y,M=f.imageRef,x=f.className,T=s(null),R=o(T,2),S=R[0],D=R[1];c((function(){D(null)}),[g.id]);var B=g.src||g.downloadUrl,E="image"===(null!==(b=g.kind)&&void 0!==b?b:"file")&&!!g.src&&m(),L=function(o){return function(s){s.stopPropagation(),o(),D(null)}};return d(C,{children:[h(n,{title:A,children:h(i,{size:O,type:"tertiaryBg",ariaLabel:"More actions",isActive:!!S,className:x,onClick:function(o){o.stopPropagation(),D(o.currentTarget)},testId:"".concat(P,"-more"),children:h(e,{})})}),!!S&&d(t,{open:!0,anchorEl:S,placement:"bottom-end",onClose:function(){return D(null)},children:[!!v&&h(t.Item,{prefix:h(p,{}),onClick:L((function(){return v(g)})),testId:"".concat(P,"-share"),children:"Share file"}),h(t.Item,{prefix:h(u,{}),disabled:!B,onClick:L((function(){B&&(j.copyToClipboard(B),a("Link copied to clipboard"))})),testId:"".concat(P,"-copy-link"),children:"Copy link"}),E&&h(t.Item,{prefix:h(l,{}),onClick:L((function(){r(g.src,null==M?void 0:M.current).then((function(o){o?a("Image copied to clipboard"):I("Could not copy the image")}))})),testId:"".concat(P,"-copy-image"),children:"Copy image"})]})]})};export{f as AttachmentActionsMenu};
 //# sourceMappingURL=AttachmentActionsMenu.js.map

package/components/AttachmentPreview/AttachmentActionsMenu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AttachmentActionsMenu.js","sources":["../../../src/components/AttachmentPreview/AttachmentActionsMenu.tsx"],"sourcesContent":["import { MouseEvent, RefObject, useEffect, useState } from 'react';\n\nimport { ButtonIcon } from '../../componentsV2/ButtonIcon';\nimport { Tooltip } from '../../componentsV2/Tooltip';\nimport { Menu } from '../../componentsV2/Menu';\nimport { copyImageToClipboard, getCanCopyImages } from '../AttachmentLightbox/copyImageToClipboard';\n\nimport { AttachmentPreviewItem } from './AttachmentPreview.types';\n\nimport { LinkOneIcon, MoreOneIcon, PictureIcon, ShareTwoIcon } from '~/icons';\nimport { showErrorNotification, showSuccessNotification } from '~/utils/notificationToasts';\nimport utils from '~/utils/main';\n\nexport type AttachmentActionsMenuProps = {\n item: AttachmentPreviewItem;\n /** Adds \"Share file\" to the menu. /\n onShare?: (item: AttachmentPreviewItem) => void;\n /* `xs` sits on a tile, `small` in the preview modal's header. /\n size?: 'xs' \| 'small';\n /* Test ids read `<prefix>-more`, `<prefix>-share`, and so on. /\n testIdPrefix?: string;\n tooltip?: string;\n imageRef?: RefObject<HTMLImageElement>;\n className?: string;\n};\n\nexport const AttachmentActionsMenu = ({\n item,\n onShare,\n size = 'small',\n testIdPrefix = 'attachment-preview',\n tooltip = 'More',\n imageRef,\n className,\n}: AttachmentActionsMenuProps) => {\n const [menuAnchor, setMenuAnchor] = useState<HTMLElement \| null>(null);\n\n useEffect(() => {\n setMenuAnchor(null);\n }, [item.id]);\n\n const shareableUrl = item.src \|\| item.downloadUrl;\n const canCopyImage = (item.kind ?? 'file') === 'image' && !!item.src && getCanCopyImages();\n\n const copyImage = () => {\n copyImageToClipboard(item.src as string, imageRef?.current).then(copied => {\n if (copied) showSuccessNotification('Image copied to clipboard');\n else showErrorNotification('Could not copy the image');\n });\n };\n\n // A portalled menu still bubbles its clicks up the React tree, where the tile would take\n // them as its own and open the preview over whatever the action just started.\n const runAndClose = (action: () => void) => (event: MouseEvent) => {\n event.stopPropagation();\n action();\n setMenuAnchor(null);\n };\n\n return (\n <>\n <Tooltip title={tooltip}>\n <ButtonIcon\n size={size}\n type=\"tertiaryBg\"\n ariaLabel=\"More actions\"\n isActive={!!menuAnchor}\n className={className}\n onClick={event => {\n event.stopPropagation();\n setMenuAnchor(event.currentTarget);\n }}\n testId={`${testIdPrefix}-more`}\n >\n <MoreOneIcon />\n </ButtonIcon>\n </Tooltip>\n\n {!!menuAnchor && (\n <Menu open anchorEl={menuAnchor} placement=\"bottom-end\" onClose={() => setMenuAnchor(null)}>\n {!!onShare && (\n <Menu.Item\n prefix={<ShareTwoIcon />}\n onClick={runAndClose(() => onShare(item))}\n testId={`${testIdPrefix}-share`}\n >\n Share file\n </Menu.Item>\n )}\n\n <Menu.Item\n prefix={<LinkOneIcon />}\n disabled={!shareableUrl}\n onClick={runAndClose(() => {\n if (!shareableUrl) return;\n utils.copyToClipboard(shareableUrl);\n showSuccessNotification('Link copied to clipboard');\n })}\n testId={`${testIdPrefix}-copy-link`}\n >\n Copy link\n </Menu.Item>\n\n {/ Only images: no browser lets a page put a video or a document on the clipboard. */}\n {canCopyImage && (\n <Menu.Item\n prefix={<PictureIcon />}\n onClick={runAndClose(copyImage)}\n testId={`${testIdPrefix}-copy-image`}\n >\n Copy image\n </Menu.Item>\n )}\n </Menu>\n )}\n </>\n );\n};\n"],"names":["AttachmentActionsMenu","_ref","_item$kind","item","onShare","_ref$size","size","_ref$testIdPrefix","testIdPrefix","_ref$tooltip","tooltip","imageRef","className","useState","_useState2","_slicedToArray","_useState","menuAnchor","setMenuAnchor","useEffect","id","shareableUrl","src","downloadUrl","canCopyImage","kind","getCanCopyImages","runAndClose","action","event","stopPropagation","_jsxs","_Fragment","children","_jsx","Tooltip","title","ButtonIcon","type","ariaLabel","isActive","onClick","currentTarget","testId","concat","MoreOneIcon","Menu","open","anchorEl","placement","onClose","Item","prefix","ShareTwoIcon","LinkOneIcon","disabled","utils","copyToClipboard","showSuccessNotification","PictureIcon","copyImageToClipboard","current","then","copied","showErrorNotification"],"mappings":"~~yxIA0BaA~~,IAAAA,EAAwB,SAQHC,GAAA,IAAAC,EAPhCC,IAAAA,KACAC,IAAAA,QAAOC,EAAAJ,EACPK,KAAAA,aAAO,QAAOD,EAAAE,EAAAN,EACdO,aAAAA,aAAe,qBAAoBD,EAAAE,EAAAR,EACnCS,QAAAA,aAAU,OAAMD,EAChBE,IAAAA,SACAC,IAAAA,UAEoCC,EAAAA,EAA6B,MAAKC,EAAAC,EAAAC,EAAA,GAA/DC,EAAUH,EAAA,GAAEI,EAAaJ,EAAA,GAEhCK,GAAU,WACRD,EAAc,KAChB,GAAG,CAACf,EAAKiB,KAET,IAAMC,EAAelB,EAAKmB,KAAOnB,EAAKoB,YAChCC,EAAyC,mBAA1BtB,EAACC,EAAKsB,oBAAQ,WAAyBtB,EAAKmB,KAAOI,IAWlEC,EAAc,SAACC,GAAkB,OAAK,SAACC,GAC3CA,EAAMC,kBACNF,IACAV,EAAc,MACf,EAED,OACEa,EAAAC,EAAA,CAAAC,SAAA,CACEC,EAACC,EAAO,CAACC,MAAO1B,EAAQuB,SACtBC,EAACG,EAAU,CACT/B,KAAMA,EACNgC,KAAK,aACLC,UAAU,eACVC,WAAYvB,EACZL,UAAWA,EACX6B,QAAS,SAAAZ,GACPA,EAAMC,kBACNZ,EAAcW,EAAMa,cACpB,EACFC,OAAM,GAAAC,OAAKpC,EAAoB,SAAAyB,SAE/BC,EAACW,EAAW,UAIb5B,GACDc,EAACe,EAAI,CAACC,MAAI,EAACC,SAAU/B,EAAYgC,UAAU,aAAaC,QAAS,WAAA,OAAMhC,EAAc,KAAM,EAAAe,SAAA,GACtF7B,GACD8B,EAACY,EAAKK,KAAI,CACRC,OAAQlB,EAACmB,EAAgB,IACzBZ,QAASd,GAAY,WAAA,OAAMvB,EAAQD,MACnCwC,OAAM,GAAAC,OAAKpC,EAAqB,UAAAyB,SAAA,eAMpCC,EAACY,EAAKK,KAAI,CACRC,OAAQlB,EAACoB,EAAe,IACxBC,UAAWlC,EACXoB,QAASd,GAAY,WACdN,IACLmC,EAAMC,gBAAgBpC,GACtBqC,EAAwB,4BAC1B,IACAf,OAAM,GAAAC,OAAKpC,EAAyB,cAAAyB,SAAA,cAMrCT,GACCU,EAACY,EAAKK,KAAI,CACRC,OAAQlB,EAACyB,EAAe,IACxBlB,QAASd,GA/DH,WAChBiC,EAAqBzD,EAAKmB,IAAeX,aAAQ,EAARA,EAAUkD,SAASC,MAAK,SAAAC,GAC3DA,EAAQL,EAAwB,6BAC/BM,EAAsB,2BAC7B,OA4DUrB,OAAM,GAAAC,OAAKpC,EAA0B,eAAAyB,SAAA,oBASnD"}
1	+ {"version":3,"file":"AttachmentActionsMenu.js","sources":["../../../src/components/AttachmentPreview/AttachmentActionsMenu.tsx"],"sourcesContent":["import { MouseEvent, RefObject, useEffect, useState } from 'react';\n\nimport { ButtonIcon } from '../../componentsV2/ButtonIcon';\nimport { Tooltip } from '../../componentsV2/Tooltip';\nimport { Menu } from '../../componentsV2/Menu';\nimport { copyImageToClipboard, getCanCopyImages } from '../AttachmentLightbox/copyImageToClipboard';\n\nimport { AttachmentPreviewItem } from './AttachmentPreview.types';\n\nimport { LinkOneIcon, MoreOneIcon, PictureIcon, ShareTwoIcon } from '~/icons';\nimport { showErrorNotification, showSuccessNotification } from '~/utils/notificationToasts';\nimport utils from '~/utils/main';\n\nexport type AttachmentActionsMenuProps = {\n item: AttachmentPreviewItem;\n /** Adds \"Share file\" to the menu. /\n onShare?: (item: AttachmentPreviewItem) => void;\n /* `xs` sits on a tile, `small` in the preview modal's header. /\n size?: 'xs' \| 'small';\n /* Test ids read `<prefix>-more`, `<prefix>-share`, and so on. /\n testIdPrefix?: string;\n tooltip?: string;\n imageRef?: RefObject<HTMLImageElement>;\n className?: string;\n};\n\nexport const AttachmentActionsMenu = ({\n item,\n onShare,\n size = 'small',\n testIdPrefix = 'attachment-preview',\n tooltip = 'More',\n imageRef,\n className,\n}: AttachmentActionsMenuProps) => {\n const [menuAnchor, setMenuAnchor] = useState<HTMLElement \| null>(null);\n\n useEffect(() => {\n setMenuAnchor(null);\n }, [item.id]);\n\n const shareableUrl = item.src \|\| item.downloadUrl;\n const canCopyImage = (item.kind ?? 'file') === 'image' && !!item.src && getCanCopyImages();\n\n const copyImage = () => {\n copyImageToClipboard(item.src as string, imageRef?.current).then(copied => {\n if (copied) showSuccessNotification('Image copied to clipboard');\n else showErrorNotification('Could not copy the image');\n });\n };\n\n // A portalled menu still bubbles its clicks up the React tree, where the tile would take\n // them as its own and open the preview over whatever the action just started.\n const runAndClose = (action: () => void) => (event: MouseEvent) => {\n event.stopPropagation();\n action();\n setMenuAnchor(null);\n };\n\n return (\n <>\n <Tooltip title={tooltip}>\n <ButtonIcon\n size={size}\n type=\"tertiaryBg\"\n ariaLabel=\"More actions\"\n isActive={!!menuAnchor}\n className={className}\n onClick={event => {\n event.stopPropagation();\n setMenuAnchor(event.currentTarget);\n }}\n testId={`${testIdPrefix}-more`}\n >\n <MoreOneIcon />\n </ButtonIcon>\n </Tooltip>\n\n {!!menuAnchor && (\n <Menu open anchorEl={menuAnchor} placement=\"bottom-end\" onClose={() => setMenuAnchor(null)}>\n {!!onShare && (\n <Menu.Item\n prefix={<ShareTwoIcon />}\n onClick={runAndClose(() => onShare(item))}\n testId={`${testIdPrefix}-share`}\n >\n Share file\n </Menu.Item>\n )}\n\n <Menu.Item\n prefix={<LinkOneIcon />}\n disabled={!shareableUrl}\n onClick={runAndClose(() => {\n if (!shareableUrl) return;\n utils.copyToClipboard(shareableUrl);\n showSuccessNotification('Link copied to clipboard');\n })}\n testId={`${testIdPrefix}-copy-link`}\n >\n Copy link\n </Menu.Item>\n\n {/ Only images: no browser lets a page put a video or a document on the clipboard. */}\n {canCopyImage && (\n <Menu.Item\n prefix={<PictureIcon />}\n onClick={runAndClose(copyImage)}\n testId={`${testIdPrefix}-copy-image`}\n >\n Copy image\n </Menu.Item>\n )}\n </Menu>\n )}\n </>\n );\n};\n"],"names":["AttachmentActionsMenu","_ref","_item$kind","item","onShare","_ref$size","size","_ref$testIdPrefix","testIdPrefix","_ref$tooltip","tooltip","imageRef","className","useState","_useState2","_slicedToArray","_useState","menuAnchor","setMenuAnchor","useEffect","id","shareableUrl","src","downloadUrl","canCopyImage","kind","getCanCopyImages","runAndClose","action","event","stopPropagation","_jsxs","_Fragment","children","_jsx","Tooltip","title","ButtonIcon","type","ariaLabel","isActive","onClick","currentTarget","testId","concat","MoreOneIcon","Menu","open","anchorEl","placement","onClose","Item","prefix","ShareTwoIcon","LinkOneIcon","disabled","utils","copyToClipboard","showSuccessNotification","PictureIcon","copyImageToClipboard","current","then","copied","showErrorNotification"],"mappings":"0+IA0BaA,IAAAA,EAAwB,SAQHC,GAAA,IAAAC,EAPhCC,IAAAA,KACAC,IAAAA,QAAOC,EAAAJ,EACPK,KAAAA,aAAO,QAAOD,EAAAE,EAAAN,EACdO,aAAAA,aAAe,qBAAoBD,EAAAE,EAAAR,EACnCS,QAAAA,aAAU,OAAMD,EAChBE,IAAAA,SACAC,IAAAA,UAEoCC,EAAAA,EAA6B,MAAKC,EAAAC,EAAAC,EAAA,GAA/DC,EAAUH,EAAA,GAAEI,EAAaJ,EAAA,GAEhCK,GAAU,WACRD,EAAc,KAChB,GAAG,CAACf,EAAKiB,KAET,IAAMC,EAAelB,EAAKmB,KAAOnB,EAAKoB,YAChCC,EAAyC,mBAA1BtB,EAACC,EAAKsB,oBAAQ,WAAyBtB,EAAKmB,KAAOI,IAWlEC,EAAc,SAACC,GAAkB,OAAK,SAACC,GAC3CA,EAAMC,kBACNF,IACAV,EAAc,MACf,EAED,OACEa,EAAAC,EAAA,CAAAC,SAAA,CACEC,EAACC,EAAO,CAACC,MAAO1B,EAAQuB,SACtBC,EAACG,EAAU,CACT/B,KAAMA,EACNgC,KAAK,aACLC,UAAU,eACVC,WAAYvB,EACZL,UAAWA,EACX6B,QAAS,SAAAZ,GACPA,EAAMC,kBACNZ,EAAcW,EAAMa,cACpB,EACFC,OAAM,GAAAC,OAAKpC,EAAoB,SAAAyB,SAE/BC,EAACW,EAAW,UAIb5B,GACDc,EAACe,EAAI,CAACC,MAAI,EAACC,SAAU/B,EAAYgC,UAAU,aAAaC,QAAS,WAAA,OAAMhC,EAAc,KAAM,EAAAe,SAAA,GACtF7B,GACD8B,EAACY,EAAKK,KAAI,CACRC,OAAQlB,EAACmB,EAAgB,IACzBZ,QAASd,GAAY,WAAA,OAAMvB,EAAQD,MACnCwC,OAAM,GAAAC,OAAKpC,EAAqB,UAAAyB,SAAA,eAMpCC,EAACY,EAAKK,KAAI,CACRC,OAAQlB,EAACoB,EAAe,IACxBC,UAAWlC,EACXoB,QAASd,GAAY,WACdN,IACLmC,EAAMC,gBAAgBpC,GACtBqC,EAAwB,4BAC1B,IACAf,OAAM,GAAAC,OAAKpC,EAAyB,cAAAyB,SAAA,cAMrCT,GACCU,EAACY,EAAKK,KAAI,CACRC,OAAQlB,EAACyB,EAAe,IACxBlB,QAASd,GA/DH,WAChBiC,EAAqBzD,EAAKmB,IAAeX,aAAQ,EAARA,EAAUkD,SAASC,MAAK,SAAAC,GAC3DA,EAAQL,EAAwB,6BAC/BM,EAAsB,2BAC7B,OA4DUrB,OAAM,GAAAC,OAAKpC,EAA0B,eAAAyB,SAAA,oBASnD"}

package/components/AttachmentPreview/AttachmentDownloadLink.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{ButtonIcon as o}from"../../componentsV2/ButtonIcon/ButtonIcon.js";import{Tooltip as s}from"../../componentsV2/Tooltip/Tooltip.js";import{saveAttachment as c}from"../AttachmentLightbox/downloadAttachment.js";import{DownloadIcon as i}from"../../icons/iconParkIcons.js";import"../../icons/customIcons/icons/AddMessage.js";import"../../icons/customIcons/icons/DragOne.js";import"../../icons/customIcons/icons/Attention.js";import"../../icons/customIcons/icons/Collapse.js";import"../../icons/customIcons/icons/Dashboard.js";import"../../icons/customIcons/icons/Expand.js";import"../../icons/customIcons/icons/FolderClosed.js";import"../../icons/customIcons/icons/FolderClosedFilled.js";import"../../icons/customIcons/icons/FolderOpened.js";import"../../icons/customIcons/icons/GreaterOrEqual.js";import"../../icons/customIcons/icons/LessOrEqual.js";import"../../icons/customIcons/icons/Search.js";import"../../icons/customIcons/icons/SearchOne.js";import"../../icons/customIcons/icons/Wellhub.js";import"../../icons/customIcons/icons/MultiRuler.js";import"../../icons/customIcons/icons/Checkbox.js";import"../../icons/customIcons/icons/CheckboxChecked.js";import"../../icons/customIcons/icons/CheckboxIndeterminate.js";import"../../icons/customIcons/icons/Radio.js";import"../../icons/customIcons/icons/RadioChecked.js";import"../../icons/customIcons/icons/SimulFrac.js";import"../../icons/customIcons/icons/ZipperFrac.js";import"../../icons/customIcons/icons/CautionFilled.js";import"../../icons/customIcons/icons/MoreApp.js";import"../../icons/customIcons/icons/Pad.js";import"../../icons/customIcons/icons/DrilloutUnit.js";import"../../icons/customIcons/icons/FracFleet.js";import"../../icons/customIcons/icons/Global.js";import"../../icons/customIcons/icons/Program.js";import"../../icons/customIcons/icons/Rig.js";import"../../icons/customIcons/icons/Well.js";import"../../icons/customIcons/icons/Gap.js";import"../../icons/customIcons/icons/Pin.js";import"../../icons/customIcons/icons/CloseOneFilled.js";import"../../icons/customIcons/icons/AttentionFilled.js";import"../../icons/customIcons/icons/CheckOneFilled.js";import"../../icons/customIcons/icons/Archive.js";import"../../icons/customIcons/icons/ArchiveCancel.js";import"../../icons/customIcons/icons/Unarchive.js";import"../../icons/customIcons/icons/Archived.js";import"../../icons/customIcons/icons/InterventionUnit.js";import"../../icons/customIcons/icons/CloudDelete.js";import"../../icons/customIcons/icons/Lasso.js";import"../../icons/customIcons/icons/Radius.js";import"../../icons/customIcons/icons/ErrorOps.js";import"../../icons/customIcons/icons/DataTypeOps.js";import"../../icons/customIcons/icons/FalsePositiveOps.js";import"../../icons/customIcons/icons/CalibrationOps.js";import"../../icons/customIcons/icons/CriticalOps.js";import"../../icons/customIcons/icons/Company.js";import"../../icons/customIcons/icons/ArchiveOne.js";import"../../icons/customIcons/icons/ParseBotFusion.js";import"../../icons/customIcons/icons/Connect.js";import"../../icons/customIcons/icons/PuzzleOne.js";import"../../icons/customIcons/icons/Feed.js";import"../../icons/customIcons/icons/Prompt.js";import"../../icons/customIcons/icons/Companies.js";import"../../icons/customIcons/icons/ClipboardAi.js";import"../../icons/customIcons/icons/Key.js";import"../../icons/customIcons/icons/AtSignCrossed.js";import"../../icons/customIcons/icons/MappingManual.js";import"../../icons/customIcons/icons/Mapping.js";import"../../icons/customIcons/icons/Metrics.js";import"../../icons/customIcons/icons/Drops.js";import"../../icons/customIcons/icons/ClipboardSearch.js";import"../../icons/customIcons/icons/Template.js";import"../../icons/customIcons/icons/ClipboardMetrics.js";import"../../icons/customIcons/icons/ClipboardBuilder.js";import"../../icons/customIcons/icons/UnitConversion.js";import"../../icons/customIcons/icons/NPT.js";import"../../icons/customIcons/icons/GuidedFrac.js";import{jsx as n}from"react/jsx-runtime";var t=function(t){var m=t.url,r=t.fileName,e=t.size,p=void 0===e?"small":e,u=t.className,a=t.testId;return n(s,{title:"Download",children:n("a",{href:m,download:r,target:"_blank",rel:"noopener noreferrer",className:u,"data-testid":void 0===a?"attachment-download":a,onClick:function(o){o.preventDefault(),o.stopPropagation(),c(m,r)},children:n(o,{size:p,type:"tertiaryBg",ariaLabel:"Download",children:n(i,{size:"xs"===p?"small":void 0})})})})};export{t as AttachmentDownloadLink};
+import{ButtonIcon as o}from"../../componentsV2/ButtonIcon/ButtonIcon.js";import{Tooltip as s}from"../../componentsV2/Tooltip/Tooltip.js";import{saveAttachment as c}from"../AttachmentLightbox/downloadAttachment.js";import{DownloadIcon as i}from"../../icons/iconParkIcons.js";import"../../icons/customIcons/icons/AddMessage.js";import"../../icons/customIcons/icons/DragOne.js";import"../../icons/customIcons/icons/Attention.js";import"../../icons/customIcons/icons/Collapse.js";import"../../icons/customIcons/icons/Dashboard.js";import"../../icons/customIcons/icons/Expand.js";import"../../icons/customIcons/icons/FolderClosed.js";import"../../icons/customIcons/icons/FolderClosedFilled.js";import"../../icons/customIcons/icons/FolderOpened.js";import"../../icons/customIcons/icons/GreaterOrEqual.js";import"../../icons/customIcons/icons/LessOrEqual.js";import"../../icons/customIcons/icons/Search.js";import"../../icons/customIcons/icons/SearchOne.js";import"../../icons/customIcons/icons/Wellhub.js";import"../../icons/customIcons/icons/MultiRuler.js";import"../../icons/customIcons/icons/Checkbox.js";import"../../icons/customIcons/icons/CheckboxChecked.js";import"../../icons/customIcons/icons/CheckboxIndeterminate.js";import"../../icons/customIcons/icons/Radio.js";import"../../icons/customIcons/icons/RadioChecked.js";import"../../icons/customIcons/icons/SimulFrac.js";import"../../icons/customIcons/icons/ZipperFrac.js";import"../../icons/customIcons/icons/CautionFilled.js";import"../../icons/customIcons/icons/InfoRounded.js";import"../../icons/customIcons/icons/FlameFilled.js";import"../../icons/customIcons/icons/MoreApp.js";import"../../icons/customIcons/icons/Pad.js";import"../../icons/customIcons/icons/DrilloutUnit.js";import"../../icons/customIcons/icons/FracFleet.js";import"../../icons/customIcons/icons/Global.js";import"../../icons/customIcons/icons/Program.js";import"../../icons/customIcons/icons/Rig.js";import"../../icons/customIcons/icons/Well.js";import"../../icons/customIcons/icons/Gap.js";import"../../icons/customIcons/icons/Pin.js";import"../../icons/customIcons/icons/PinOne.js";import"../../icons/customIcons/icons/PinOneCrossed.js";import"../../icons/customIcons/icons/CloseOneFilled.js";import"../../icons/customIcons/icons/AttentionFilled.js";import"../../icons/customIcons/icons/CheckOneFilled.js";import"../../icons/customIcons/icons/Archive.js";import"../../icons/customIcons/icons/ArchiveCancel.js";import"../../icons/customIcons/icons/Unarchive.js";import"../../icons/customIcons/icons/Archived.js";import"../../icons/customIcons/icons/InterventionUnit.js";import"../../icons/customIcons/icons/CloudDelete.js";import"../../icons/customIcons/icons/Lasso.js";import"../../icons/customIcons/icons/Radius.js";import"../../icons/customIcons/icons/ErrorOps.js";import"../../icons/customIcons/icons/DataTypeOps.js";import"../../icons/customIcons/icons/FalsePositiveOps.js";import"../../icons/customIcons/icons/CalibrationOps.js";import"../../icons/customIcons/icons/CriticalOps.js";import"../../icons/customIcons/icons/Company.js";import"../../icons/customIcons/icons/ArchiveOne.js";import"../../icons/customIcons/icons/ParseBotFusion.js";import"../../icons/customIcons/icons/Connect.js";import"../../icons/customIcons/icons/PuzzleOne.js";import"../../icons/customIcons/icons/Feed.js";import"../../icons/customIcons/icons/Prompt.js";import"../../icons/customIcons/icons/Companies.js";import"../../icons/customIcons/icons/ClipboardAi.js";import"../../icons/customIcons/icons/Key.js";import"../../icons/customIcons/icons/AtSignCrossed.js";import"../../icons/customIcons/icons/MappingManual.js";import"../../icons/customIcons/icons/Mapping.js";import"../../icons/customIcons/icons/Metrics.js";import"../../icons/customIcons/icons/Drops.js";import"../../icons/customIcons/icons/ClipboardSearch.js";import"../../icons/customIcons/icons/Template.js";import"../../icons/customIcons/icons/ClipboardMetrics.js";import"../../icons/customIcons/icons/ClipboardBuilder.js";import"../../icons/customIcons/icons/UnitConversion.js";import"../../icons/customIcons/icons/NPT.js";import"../../icons/customIcons/icons/GuidedFrac.js";import{jsx as n}from"react/jsx-runtime";var t=function(t){var m=t.url,r=t.fileName,e=t.size,p=void 0===e?"small":e,u=t.className,I=t.testId;return n(s,{title:"Download",children:n("a",{href:m,download:r,target:"_blank",rel:"noopener noreferrer",className:u,"data-testid":void 0===I?"attachment-download":I,onClick:function(o){o.preventDefault(),o.stopPropagation(),c(m,r)},children:n(o,{size:p,type:"tertiaryBg",ariaLabel:"Download",children:n(i,{size:"xs"===p?"small":void 0})})})})};export{t as AttachmentDownloadLink};
 //# sourceMappingURL=AttachmentDownloadLink.js.map

package/components/AttachmentPreview/AttachmentDownloadLink.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AttachmentDownloadLink.js","sources":["../../../src/components/AttachmentPreview/AttachmentDownloadLink.tsx"],"sourcesContent":["import { MouseEvent } from 'react';\n\nimport { ButtonIcon } from '../../componentsV2/ButtonIcon';\nimport { Tooltip } from '../../componentsV2/Tooltip';\nimport { saveAttachment } from '../AttachmentLightbox/downloadAttachment';\n\nimport { DownloadIcon } from '~/icons';\n\nexport type AttachmentDownloadLinkProps = {\n url: string;\n fileName: string;\n /** `xs` sits on a tile, `small` in the preview modal's header. /\n size?: 'xs' \| 'small';\n className?: string;\n testId?: string;\n};\n\n/* Keeps the link semantics but fetches the bytes, since `download` is ignored cross-origin. */\nexport const AttachmentDownloadLink = ({\n url,\n fileName,\n size = 'small',\n className,\n testId = 'attachment-download',\n}: AttachmentDownloadLinkProps) => {\n const handleClick = (event: MouseEvent) => {\n event.preventDefault();\n event.stopPropagation();\n saveAttachment(url, fileName);\n };\n\n return (\n <Tooltip title=\"Download\">\n <a\n href={url}\n download={fileName}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className={className}\n data-testid={testId}\n onClick={handleClick}\n >\n <ButtonIcon size={size} type=\"tertiaryBg\" ariaLabel=\"Download\">\n <DownloadIcon size={size === 'xs' ? 'small' : undefined} />\n </ButtonIcon>\n </a>\n </Tooltip>\n );\n};\n"],"names":["AttachmentDownloadLink","_ref","url","fileName","_ref$size","size","className","_ref$testId","testId","_jsx","Tooltip","title","children","href","download","target","rel","onClick","event","preventDefault","stopPropagation","saveAttachment","ButtonIcon","type","ariaLabel","DownloadIcon","undefined"],"mappings":"~~24HAkBaA~~,IAAAA,EAAyB,SAMHC,GAAA,IALjCC,IAAAA,IACAC,IAAAA,SAAQC,EAAAH,EACRI,KAAAA,aAAO,QAAOD,EACdE,IAAAA,UAASC,EAAAN,EACTO,OAQA,OACEC,EAACC,EAAO,CAACC,MAAM,WAAUC,SACvBH,EAAA,IAAA,CACEI,KAAMX,EACNY,SAAUX,EACVY,OAAO,SACPC,IAAI,sBACJV,UAAWA,EACX,yBAhBG,sBAAqBC,EAiBxBU,QAfc,SAACC,GACnBA,EAAMC,iBACND,EAAME,kBACNC,EAAenB,EAAKC,IAYKS,SAErBH,EAACa,EAAU,CAACjB,KAAMA,EAAMkB,KAAK,aAAaC,UAAU,WAAUZ,SAC5DH,EAACgB,EAAY,CAACpB,KAAe,OAATA,EAAgB,aAAUqB,SAKxD"}
1	+ {"version":3,"file":"AttachmentDownloadLink.js","sources":["../../../src/components/AttachmentPreview/AttachmentDownloadLink.tsx"],"sourcesContent":["import { MouseEvent } from 'react';\n\nimport { ButtonIcon } from '../../componentsV2/ButtonIcon';\nimport { Tooltip } from '../../componentsV2/Tooltip';\nimport { saveAttachment } from '../AttachmentLightbox/downloadAttachment';\n\nimport { DownloadIcon } from '~/icons';\n\nexport type AttachmentDownloadLinkProps = {\n url: string;\n fileName: string;\n /** `xs` sits on a tile, `small` in the preview modal's header. /\n size?: 'xs' \| 'small';\n className?: string;\n testId?: string;\n};\n\n/* Keeps the link semantics but fetches the bytes, since `download` is ignored cross-origin. */\nexport const AttachmentDownloadLink = ({\n url,\n fileName,\n size = 'small',\n className,\n testId = 'attachment-download',\n}: AttachmentDownloadLinkProps) => {\n const handleClick = (event: MouseEvent) => {\n event.preventDefault();\n event.stopPropagation();\n saveAttachment(url, fileName);\n };\n\n return (\n <Tooltip title=\"Download\">\n <a\n href={url}\n download={fileName}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className={className}\n data-testid={testId}\n onClick={handleClick}\n >\n <ButtonIcon size={size} type=\"tertiaryBg\" ariaLabel=\"Download\">\n <DownloadIcon size={size === 'xs' ? 'small' : undefined} />\n </ButtonIcon>\n </a>\n </Tooltip>\n );\n};\n"],"names":["AttachmentDownloadLink","_ref","url","fileName","_ref$size","size","className","_ref$testId","testId","_jsx","Tooltip","title","children","href","download","target","rel","onClick","event","preventDefault","stopPropagation","saveAttachment","ButtonIcon","type","ariaLabel","DownloadIcon","undefined"],"mappings":"4lIAkBaA,IAAAA,EAAyB,SAMHC,GAAA,IALjCC,IAAAA,IACAC,IAAAA,SAAQC,EAAAH,EACRI,KAAAA,aAAO,QAAOD,EACdE,IAAAA,UAASC,EAAAN,EACTO,OAQA,OACEC,EAACC,EAAO,CAACC,MAAM,WAAUC,SACvBH,EAAA,IAAA,CACEI,KAAMX,EACNY,SAAUX,EACVY,OAAO,SACPC,IAAI,sBACJV,UAAWA,EACX,yBAhBG,sBAAqBC,EAiBxBU,QAfc,SAACC,GACnBA,EAAMC,iBACND,EAAME,kBACNC,EAAenB,EAAKC,IAYKS,SAErBH,EAACa,EAAU,CAACjB,KAAMA,EAAMkB,KAAK,aAAaC,UAAU,WAAUZ,SAC5DH,EAACgB,EAAY,CAACpB,KAAe,OAATA,EAAgB,aAAUqB,SAKxD"}

package/components/AttachmentPreview/AttachmentTile.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import o from"@babel/runtime/helpers/defineProperty";import{useRef as s}from"react";import i from"classnames";import{FileIcon as n}from"../../componentsV2/FileIcon/FileIcon.js";import{ButtonIcon as c}from"../../componentsV2/ButtonIcon/ButtonIcon.js";import{Tooltip as t}from"../../componentsV2/Tooltip/Tooltip.js";import{LoaderCircular as e}from"../../componentsV2/LoaderCircular/LoaderCircular.js";import{PlayOneIcon as r,UndoIcon as m,CloseSmallIcon as a}from"../../icons/iconParkIcons.js";import"../../icons/customIcons/icons/AddMessage.js";import"../../icons/customIcons/icons/DragOne.js";import"../../icons/customIcons/icons/Attention.js";import"../../icons/customIcons/icons/Collapse.js";import"../../icons/customIcons/icons/Dashboard.js";import"../../icons/customIcons/icons/Expand.js";import"../../icons/customIcons/icons/FolderClosed.js";import"../../icons/customIcons/icons/FolderClosedFilled.js";import"../../icons/customIcons/icons/FolderOpened.js";import"../../icons/customIcons/icons/GreaterOrEqual.js";import"../../icons/customIcons/icons/LessOrEqual.js";import"../../icons/customIcons/icons/Search.js";import"../../icons/customIcons/icons/SearchOne.js";import"../../icons/customIcons/icons/Wellhub.js";import"../../icons/customIcons/icons/MultiRuler.js";import"../../icons/customIcons/icons/Checkbox.js";import"../../icons/customIcons/icons/CheckboxChecked.js";import"../../icons/customIcons/icons/CheckboxIndeterminate.js";import"../../icons/customIcons/icons/Radio.js";import"../../icons/customIcons/icons/RadioChecked.js";import"../../icons/customIcons/icons/SimulFrac.js";import"../../icons/customIcons/icons/ZipperFrac.js";import"../../icons/customIcons/icons/CautionFilled.js";import"../../icons/customIcons/icons/MoreApp.js";import"../../icons/customIcons/icons/Pad.js";import"../../icons/customIcons/icons/DrilloutUnit.js";import"../../icons/customIcons/icons/FracFleet.js";import"../../icons/customIcons/icons/Global.js";import"../../icons/customIcons/icons/Program.js";import"../../icons/customIcons/icons/Rig.js";import"../../icons/customIcons/icons/Well.js";import"../../icons/customIcons/icons/Gap.js";import"../../icons/customIcons/icons/Pin.js";import"../../icons/customIcons/icons/CloseOneFilled.js";import"../../icons/customIcons/icons/AttentionFilled.js";import"../../icons/customIcons/icons/CheckOneFilled.js";import"../../icons/customIcons/icons/Archive.js";import"../../icons/customIcons/icons/ArchiveCancel.js";import"../../icons/customIcons/icons/Unarchive.js";import"../../icons/customIcons/icons/Archived.js";import"../../icons/customIcons/icons/InterventionUnit.js";import"../../icons/customIcons/icons/CloudDelete.js";import"../../icons/customIcons/icons/Lasso.js";import"../../icons/customIcons/icons/Radius.js";import"../../icons/customIcons/icons/ErrorOps.js";import"../../icons/customIcons/icons/DataTypeOps.js";import"../../icons/customIcons/icons/FalsePositiveOps.js";import"../../icons/customIcons/icons/CalibrationOps.js";import"../../icons/customIcons/icons/CriticalOps.js";import"../../icons/customIcons/icons/Company.js";import"../../icons/customIcons/icons/ArchiveOne.js";import"../../icons/customIcons/icons/ParseBotFusion.js";import"../../icons/customIcons/icons/Connect.js";import"../../icons/customIcons/icons/PuzzleOne.js";import"../../icons/customIcons/icons/Feed.js";import"../../icons/customIcons/icons/Prompt.js";import"../../icons/customIcons/icons/Companies.js";import"../../icons/customIcons/icons/ClipboardAi.js";import"../../icons/customIcons/icons/Key.js";import"../../icons/customIcons/icons/AtSignCrossed.js";import"../../icons/customIcons/icons/MappingManual.js";import"../../icons/customIcons/icons/Mapping.js";import"../../icons/customIcons/icons/Metrics.js";import"../../icons/customIcons/icons/Drops.js";import"../../icons/customIcons/icons/ClipboardSearch.js";import"../../icons/customIcons/icons/Template.js";import"../../icons/customIcons/icons/ClipboardMetrics.js";import"../../icons/customIcons/icons/ClipboardBuilder.js";import"../../icons/customIcons/icons/UnitConversion.js";import"../../icons/customIcons/icons/NPT.js";import"../../icons/customIcons/icons/GuidedFrac.js";import{AttachmentActionsMenu as l}from"./AttachmentActionsMenu.js";import{AttachmentImage as p}from"./AttachmentImage.js";import{AttachmentDownloadLink as u}from"./AttachmentDownloadLink.js";import d from"./AttachmentPreview.scss.js";import j from"../../utils/main.js";import{jsxs as I,jsx as h,Fragment as f}from"react/jsx-runtime";function v(o,s){var i=Object.keys(o);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(o);s&&(n=n.filter((function(s){return Object.getOwnPropertyDescriptor(o,s).enumerable}))),i.push.apply(i,n)}return i}function b(s){for(var i=1;i<arguments.length;i++){var n=null!=arguments[i]?arguments[i]:{};i%2?v(Object(n),!0).forEach((function(i){o(s,i,n[i])})):Object.getOwnPropertyDescriptors?Object.defineProperties(s,Object.getOwnPropertyDescriptors(n)):v(Object(n)).forEach((function(o){Object.defineProperty(s,o,Object.getOwnPropertyDescriptor(n,o))}))}return s}var C=function(o){var s,i=o.split(".");return i.length>1?(null!==(s=i.pop())&&void 0!==s?s:"").toUpperCase():""},g=function(o){var s=o.item,i=o.onShare,n=o.imageRef,c=j.getFileNameWithExtensionFromPath(s.name),t=s.hideDownload?void 0:s.downloadUrl||s.src;return I("div",{className:d.tileActions,"data-testid":"attachment-tile-actions",children:[!!t&&h(u,{url:t,fileName:c,size:"xs",className:d.tileActionLink}),h(l,{item:s,onShare:i,size:"xs",testIdPrefix:"attachment-tile",tooltip:"More actions",imageRef:n})]})},y=function(o){return function(s){s.stopPropagation(),o()}},O=function(o){var s=o.item,n=o.onRemove,r=o.onRetry;return I(f,{children:[s.isUploading&&I(f,{children:[h("div",{className:d.uploadingOverlay}),h("div",{className:d.uploadingSpinner,children:h(e,{size:"xs",className:d.loader})})]}),!!s.error&&I(f,{children:[h("div",{className:d.errorOverlay}),r&&h(t,{title:"Retry upload",children:h("div",{className:d.retryButton,children:h(c,{size:"xs",type:"tertiaryBg",onClick:y((function(){return r(s.id)})),testId:"attachment-retry",children:h(m,{size:"small"})})})})]}),n&&!s.isUploading&&h(t,{title:"Remove",children:h("div",{className:i(d.removeButton,!!s.error&&d.removeButtonVisible),children:h(c,{size:"xs",type:"tertiaryBg",onClick:y((function(){return n(s.id)})),testId:"attachment-remove",children:h(a,{size:"small"})})})})]})},N=function(o){var c,e,m=o.item,a=o.onRemove,l=o.onRetry,u=o.onItemClick,v=o.isSelected,y=o.hideActions,N=o.onShare,P=s(null),F=null!==(c=m.kind)&&void 0!==c?c:"file",k=h(O,{item:m,onRemove:a,onRetry:l}),A=j.getFileNameWithExtensionFromPath(m.name),R=!m.isUploading&&!m.error,x=!!u&&R,D=!y&&!a&&R;if("image"===F||"video"===F)return I("div",{className:i(d.thumbnail,x&&d.clickable,v&&d.selected,!!m.error&&d.thumbnailError),onClick:x?function(){return null==u?void 0:u(m)}:void 0,children:[h("div",{className:d.thumbnailInner,children:"image"===F?h(p,{ref:P,src:m.src,alt:A,className:d.thumbnailImage}):h("video",{src:(e=m.src,e&&!e.includes("#t=")?"".concat(e,"#t=0.1"):e),className:d.thumbnailImage,preload:"metadata",playsInline:!0,muted:!0})}),"video"===F&&h("div",{className:d.videoOverlay,children:h(r,{theme:"filled",className:d.playIcon})}),D&&h(g,{item:m,onShare:N,imageRef:P}),k]});var S,w=I(f,{children:[I("div",{className:d.fileCardContent,children:[h(n,{name:A}),I("div",{className:d.fileInfo,children:[h(t,{title:A,children:h("div",{className:d.fileName,children:(S=A,S.replace(/\.[^/.]+$/,""))})}),h("div",{className:d.fileType,children:C(A)})]})]}),D&&h(g,{item:m,onShare:N}),k]}),E=x?{role:"button",tabIndex:0,onClick:function(){return null==u?void 0:u(m)},onKeyDown:function(o){o.target===o.currentTarget&&("Enter"!==o.key&&" "!==o.key||(o.preventDefault(),null==u||u(m)))}}:{};return h("div",b(b({className:i(d.fileCard,x&&d.fileCardLink,v&&d.selected,!!m.error&&d.thumbnailError)},E),{},{children:w}))};export{N as AttachmentTile};
+import o from"@babel/runtime/helpers/defineProperty";import{useRef as s}from"react";import i from"classnames";import{FileIcon as n}from"../../componentsV2/FileIcon/FileIcon.js";import{ButtonIcon as c}from"../../componentsV2/ButtonIcon/ButtonIcon.js";import{Tooltip as t}from"../../componentsV2/Tooltip/Tooltip.js";import{LoaderCircular as e}from"../../componentsV2/LoaderCircular/LoaderCircular.js";import{PlayOneIcon as r,UndoIcon as m,CloseSmallIcon as a}from"../../icons/iconParkIcons.js";import"../../icons/customIcons/icons/AddMessage.js";import"../../icons/customIcons/icons/DragOne.js";import"../../icons/customIcons/icons/Attention.js";import"../../icons/customIcons/icons/Collapse.js";import"../../icons/customIcons/icons/Dashboard.js";import"../../icons/customIcons/icons/Expand.js";import"../../icons/customIcons/icons/FolderClosed.js";import"../../icons/customIcons/icons/FolderClosedFilled.js";import"../../icons/customIcons/icons/FolderOpened.js";import"../../icons/customIcons/icons/GreaterOrEqual.js";import"../../icons/customIcons/icons/LessOrEqual.js";import"../../icons/customIcons/icons/Search.js";import"../../icons/customIcons/icons/SearchOne.js";import"../../icons/customIcons/icons/Wellhub.js";import"../../icons/customIcons/icons/MultiRuler.js";import"../../icons/customIcons/icons/Checkbox.js";import"../../icons/customIcons/icons/CheckboxChecked.js";import"../../icons/customIcons/icons/CheckboxIndeterminate.js";import"../../icons/customIcons/icons/Radio.js";import"../../icons/customIcons/icons/RadioChecked.js";import"../../icons/customIcons/icons/SimulFrac.js";import"../../icons/customIcons/icons/ZipperFrac.js";import"../../icons/customIcons/icons/CautionFilled.js";import"../../icons/customIcons/icons/InfoRounded.js";import"../../icons/customIcons/icons/FlameFilled.js";import"../../icons/customIcons/icons/MoreApp.js";import"../../icons/customIcons/icons/Pad.js";import"../../icons/customIcons/icons/DrilloutUnit.js";import"../../icons/customIcons/icons/FracFleet.js";import"../../icons/customIcons/icons/Global.js";import"../../icons/customIcons/icons/Program.js";import"../../icons/customIcons/icons/Rig.js";import"../../icons/customIcons/icons/Well.js";import"../../icons/customIcons/icons/Gap.js";import"../../icons/customIcons/icons/Pin.js";import"../../icons/customIcons/icons/PinOne.js";import"../../icons/customIcons/icons/PinOneCrossed.js";import"../../icons/customIcons/icons/CloseOneFilled.js";import"../../icons/customIcons/icons/AttentionFilled.js";import"../../icons/customIcons/icons/CheckOneFilled.js";import"../../icons/customIcons/icons/Archive.js";import"../../icons/customIcons/icons/ArchiveCancel.js";import"../../icons/customIcons/icons/Unarchive.js";import"../../icons/customIcons/icons/Archived.js";import"../../icons/customIcons/icons/InterventionUnit.js";import"../../icons/customIcons/icons/CloudDelete.js";import"../../icons/customIcons/icons/Lasso.js";import"../../icons/customIcons/icons/Radius.js";import"../../icons/customIcons/icons/ErrorOps.js";import"../../icons/customIcons/icons/DataTypeOps.js";import"../../icons/customIcons/icons/FalsePositiveOps.js";import"../../icons/customIcons/icons/CalibrationOps.js";import"../../icons/customIcons/icons/CriticalOps.js";import"../../icons/customIcons/icons/Company.js";import"../../icons/customIcons/icons/ArchiveOne.js";import"../../icons/customIcons/icons/ParseBotFusion.js";import"../../icons/customIcons/icons/Connect.js";import"../../icons/customIcons/icons/PuzzleOne.js";import"../../icons/customIcons/icons/Feed.js";import"../../icons/customIcons/icons/Prompt.js";import"../../icons/customIcons/icons/Companies.js";import"../../icons/customIcons/icons/ClipboardAi.js";import"../../icons/customIcons/icons/Key.js";import"../../icons/customIcons/icons/AtSignCrossed.js";import"../../icons/customIcons/icons/MappingManual.js";import"../../icons/customIcons/icons/Mapping.js";import"../../icons/customIcons/icons/Metrics.js";import"../../icons/customIcons/icons/Drops.js";import"../../icons/customIcons/icons/ClipboardSearch.js";import"../../icons/customIcons/icons/Template.js";import"../../icons/customIcons/icons/ClipboardMetrics.js";import"../../icons/customIcons/icons/ClipboardBuilder.js";import"../../icons/customIcons/icons/UnitConversion.js";import"../../icons/customIcons/icons/NPT.js";import"../../icons/customIcons/icons/GuidedFrac.js";import{AttachmentActionsMenu as l}from"./AttachmentActionsMenu.js";import{AttachmentImage as p}from"./AttachmentImage.js";import{AttachmentDownloadLink as u}from"./AttachmentDownloadLink.js";import d from"./AttachmentPreview.scss.js";import j from"../../utils/main.js";import{jsxs as I,jsx as h,Fragment as f}from"react/jsx-runtime";function v(o,s){var i=Object.keys(o);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(o);s&&(n=n.filter((function(s){return Object.getOwnPropertyDescriptor(o,s).enumerable}))),i.push.apply(i,n)}return i}function b(s){for(var i=1;i<arguments.length;i++){var n=null!=arguments[i]?arguments[i]:{};i%2?v(Object(n),!0).forEach((function(i){o(s,i,n[i])})):Object.getOwnPropertyDescriptors?Object.defineProperties(s,Object.getOwnPropertyDescriptors(n)):v(Object(n)).forEach((function(o){Object.defineProperty(s,o,Object.getOwnPropertyDescriptor(n,o))}))}return s}var C=function(o){var s,i=o.split(".");return i.length>1?(null!==(s=i.pop())&&void 0!==s?s:"").toUpperCase():""},O=function(o){var s=o.item,i=o.onShare,n=o.imageRef,c=j.getFileNameWithExtensionFromPath(s.name),t=s.hideDownload?void 0:s.downloadUrl||s.src;return I("div",{className:d.tileActions,"data-testid":"attachment-tile-actions",children:[!!t&&h(u,{url:t,fileName:c,size:"xs",className:d.tileActionLink}),h(l,{item:s,onShare:i,size:"xs",testIdPrefix:"attachment-tile",tooltip:"More actions",imageRef:n})]})},g=function(o){return function(s){s.stopPropagation(),o()}},y=function(o){var s=o.item,n=o.onRemove,r=o.onRetry;return I(f,{children:[s.isUploading&&I(f,{children:[h("div",{className:d.uploadingOverlay}),h("div",{className:d.uploadingSpinner,children:h(e,{size:"xs",className:d.loader})})]}),!!s.error&&I(f,{children:[h("div",{className:d.errorOverlay}),r&&h(t,{title:"Retry upload",children:h("div",{className:d.retryButton,children:h(c,{size:"xs",type:"tertiaryBg",onClick:g((function(){return r(s.id)})),testId:"attachment-retry",children:h(m,{size:"small"})})})})]}),n&&!s.isUploading&&h(t,{title:"Remove",children:h("div",{className:i(d.removeButton,!!s.error&&d.removeButtonVisible),children:h(c,{size:"xs",type:"tertiaryBg",onClick:g((function(){return n(s.id)})),testId:"attachment-remove",children:h(a,{size:"small"})})})})]})},P=function(o){var c,e,m=o.item,a=o.onRemove,l=o.onRetry,u=o.onItemClick,v=o.isSelected,g=o.hideActions,P=o.onShare,F=s(null),N=null!==(c=m.kind)&&void 0!==c?c:"file",k=h(y,{item:m,onRemove:a,onRetry:l}),A=j.getFileNameWithExtensionFromPath(m.name),R=!m.isUploading&&!m.error,x=!!u&&R,D=!g&&!a&&R;if("image"===N||"video"===N)return I("div",{className:i(d.thumbnail,x&&d.clickable,v&&d.selected,!!m.error&&d.thumbnailError),onClick:x?function(){return null==u?void 0:u(m)}:void 0,children:[h("div",{className:d.thumbnailInner,children:"image"===N?h(p,{ref:F,src:m.src,alt:A,className:d.thumbnailImage}):h("video",{src:(e=m.src,e&&!e.includes("#t=")?"".concat(e,"#t=0.1"):e),className:d.thumbnailImage,preload:"metadata",playsInline:!0,muted:!0})}),"video"===N&&h("div",{className:d.videoOverlay,children:h(r,{theme:"filled",className:d.playIcon})}),D&&h(O,{item:m,onShare:P,imageRef:F}),k]});var S,w=I(f,{children:[I("div",{className:d.fileCardContent,children:[h(n,{name:A}),I("div",{className:d.fileInfo,children:[h(t,{title:A,children:h("div",{className:d.fileName,children:(S=A,S.replace(/\.[^/.]+$/,""))})}),h("div",{className:d.fileType,children:C(A)})]})]}),D&&h(O,{item:m,onShare:P}),k]}),E=x?{role:"button",tabIndex:0,onClick:function(){return null==u?void 0:u(m)},onKeyDown:function(o){o.target===o.currentTarget&&("Enter"!==o.key&&" "!==o.key||(o.preventDefault(),null==u||u(m)))}}:{};return h("div",b(b({className:i(d.fileCard,x&&d.fileCardLink,v&&d.selected,!!m.error&&d.thumbnailError)},E),{},{children:w}))};export{P as AttachmentTile};
 //# sourceMappingURL=AttachmentTile.js.map

package/components/AttachmentPreview/AttachmentTile.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AttachmentTile.js","sources":["../../../src/components/AttachmentPreview/AttachmentTile.tsx"],"sourcesContent":["import { KeyboardEvent, MouseEvent, RefObject, useRef } from 'react';\nimport classNames from 'classnames';\n\nimport { FileIcon } from '../../componentsV2/FileIcon';\nimport { ButtonIcon } from '../../componentsV2/ButtonIcon';\nimport { Tooltip } from '../../componentsV2/Tooltip';\nimport { LoaderCircular } from '../../componentsV2/LoaderCircular';\nimport { PlayOneIcon, CloseSmallIcon, UndoIcon } from '../../icons';\n\nimport { AttachmentActionsMenu } from './AttachmentActionsMenu';\nimport { AttachmentImage } from './AttachmentImage';\nimport { AttachmentDownloadLink } from './AttachmentDownloadLink';\nimport { AttachmentPreviewItem, AttachmentPreviewProps } from './AttachmentPreview.types';\n\nimport styles from './AttachmentPreview.scss';\n\nimport utils from '~/utils/main';\n\nconst getExtension = (name: string) => {\n const parts = name.split('.');\n return parts.length > 1 ? (parts.pop() ?? '').toUpperCase() : '';\n};\n\nconst dropExtension = (name: string) => name.replace(/\\.[^/.]+$/, '');\n\n// A bare <video> paints nothing until a frame is decoded; the media fragment forces one.\nconst withFirstFrame = (src?: string) => (src && !src.includes('#t=') ? `${src}#t=0.1` : src);\n\nexport type AttachmentTileProps = {\n item: AttachmentPreviewItem;\n onRemove?: AttachmentPreviewProps['onRemove'];\n onRetry?: AttachmentPreviewProps['onRetry'];\n onItemClick?: AttachmentPreviewProps['onItemClick'];\n isSelected?: boolean;\n hideActions?: boolean;\n /** Adds \"Share file\" to the tile's hover menu. */\n onShare?: (item: AttachmentPreviewItem) => void;\n};\n\nconst TileActions = ({\n item,\n onShare,\n imageRef,\n}: Pick<AttachmentTileProps, 'item' \| 'onShare'> & {\n imageRef?: RefObject<HTMLImageElement>;\n}) => {\n const fileName = utils.getFileNameWithExtensionFromPath(item.name);\n const downloadUrl = item.hideDownload ? undefined : item.downloadUrl \|\| item.src;\n\n return (\n <div className={styles.tileActions} data-testid=\"attachment-tile-actions\">\n {!!downloadUrl && (\n <AttachmentDownloadLink\n url={downloadUrl}\n fileName={fileName}\n size=\"xs\"\n className={styles.tileActionLink}\n />\n )}\n\n <AttachmentActionsMenu\n item={item}\n onShare={onShare}\n size=\"xs\"\n testIdPrefix=\"attachment-tile\"\n tooltip=\"More actions\"\n imageRef={imageRef}\n />\n </div>\n );\n};\n\nconst stopAndRun = (action: () => void) => (event: MouseEvent) => {\n event.stopPropagation();\n action();\n};\n\nconst TileOverlays = ({ item, onRemove, onRetry }: Omit<AttachmentTileProps, 'onItemClick'>) => (\n <>\n {item.isUploading && (\n <>\n <div className={styles.uploadingOverlay} />\n <div className={styles.uploadingSpinner}>\n <LoaderCircular size=\"xs\" className={styles.loader} />\n </div>\n </>\n )}\n\n {!!item.error && (\n <>\n <div className={styles.errorOverlay} />\n {onRetry && (\n <Tooltip title=\"Retry upload\">\n <div className={styles.retryButton}>\n <ButtonIcon\n size=\"xs\"\n type=\"tertiaryBg\"\n onClick={stopAndRun(() => onRetry(item.id))}\n testId=\"attachment-retry\"\n >\n <UndoIcon size=\"small\" />\n </ButtonIcon>\n </div>\n </Tooltip>\n )}\n </>\n )}\n\n {onRemove && !item.isUploading && (\n <Tooltip title=\"Remove\">\n <div\n className={classNames(styles.removeButton, !!item.error && styles.removeButtonVisible)}\n >\n <ButtonIcon\n size=\"xs\"\n type=\"tertiaryBg\"\n onClick={stopAndRun(() => onRemove(item.id))}\n testId=\"attachment-remove\"\n >\n <CloseSmallIcon size=\"small\" />\n </ButtonIcon>\n </div>\n </Tooltip>\n )}\n </>\n);\n\nexport const AttachmentTile = ({\n item,\n onRemove,\n onRetry,\n onItemClick,\n isSelected,\n hideActions,\n onShare,\n}: AttachmentTileProps) => {\n const imageRef = useRef<HTMLImageElement>(null);\n const kind = item.kind ?? 'file';\n const overlays = <TileOverlays item={item} onRemove={onRemove} onRetry={onRetry} />;\n const fileName = utils.getFileNameWithExtensionFromPath(item.name);\n const isReady = !item.isUploading && !item.error;\n const clickable = !!onItemClick && isReady;\n // A tile being composed shows Remove in the same corner, and has nothing to link to.\n const showActions = !hideActions && !onRemove && isReady;\n\n if (kind === 'image' \|\| kind === 'video') {\n return (\n // eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events\n <div\n className={classNames(\n styles.thumbnail,\n clickable && styles.clickable,\n isSelected && styles.selected,\n !!item.error && styles.thumbnailError\n )}\n onClick={clickable ? () => onItemClick?.(item) : undefined}\n >\n <div className={styles.thumbnailInner}>\n {kind === 'image' ? (\n <AttachmentImage\n ref={imageRef}\n src={item.src}\n alt={fileName}\n className={styles.thumbnailImage}\n />\n ) : (\n <video\n src={withFirstFrame(item.src)}\n className={styles.thumbnailImage}\n preload=\"metadata\"\n playsInline\n muted\n />\n )}\n </div>\n {kind === 'video' && (\n <div className={styles.videoOverlay}>\n <PlayOneIcon theme=\"filled\" className={styles.playIcon} />\n </div>\n )}\n {showActions && <TileActions item={item} onShare={onShare} imageRef={imageRef} />}\n {overlays}\n </div>\n );\n }\n\n const fileCardContent = (\n <>\n <div className={styles.fileCardContent}>\n <FileIcon name={fileName} />\n <div className={styles.fileInfo}>\n <Tooltip title={fileName}>\n <div className={styles.fileName}>{dropExtension(fileName)}</div>\n </Tooltip>\n <div className={styles.fileType}>{getExtension(fileName)}</div>\n </div>\n </div>\n {showActions && <TileActions item={item} onShare={onShare} />}\n {overlays}\n </>\n );\n\n const cardInteraction = clickable\n ? {\n role: 'button',\n tabIndex: 0,\n onClick: () => onItemClick?.(item),\n onKeyDown: (event: KeyboardEvent) => {\n // Keys bubbling from the nested download link must reach it, not open the preview.\n if (event.target !== event.currentTarget) return;\n if (event.key !== 'Enter' && event.key !== ' ') return;\n\n // Space would otherwise scroll the surrounding feed.\n event.preventDefault();\n onItemClick?.(item);\n },\n }\n : {};\n\n return (\n <div\n className={classNames(\n styles.fileCard,\n clickable && styles.fileCardLink,\n isSelected && styles.selected,\n !!item.error && styles.thumbnailError\n )}\n {...cardInteraction}\n >\n {fileCardContent}\n </div>\n );\n};\n"],"names":["getExtension","name","_parts$pop","parts","split","length","pop","toUpperCase","TileActions","_ref","item","onShare","imageRef","fileName","utils","getFileNameWithExtensionFromPath","downloadUrl","hideDownload","undefined","src","_jsxs","className","styles","tileActions","children","_jsx","AttachmentDownloadLink","url","size","tileActionLink","AttachmentActionsMenu","testIdPrefix","tooltip","stopAndRun","action","event","stopPropagation","TileOverlays","_ref2","onRemove","onRetry","_Fragment","isUploading","uploadingOverlay","uploadingSpinner","LoaderCircular","loader","error","errorOverlay","Tooltip","title","retryButton","ButtonIcon","type","onClick","id","testId","UndoIcon","classNames","removeButton","removeButtonVisible","CloseSmallIcon","AttachmentTile","_ref3","_item$kind","onItemClick","isSelected","hideActions","useRef","kind","overlays","isReady","clickable","showActions","thumbnail","selected","thumbnailError","thumbnailInner","AttachmentImage","ref","alt","thumbnailImage","includes","concat","preload","playsInline","muted","videoOverlay","PlayOneIcon","theme","playIcon","fileCardContent","FileIcon","fileInfo","replace","fileType","cardInteraction","role","tabIndex","onKeyDown","target","currentTarget","key","preventDefault","_objectSpread","fileCard","fileCardLink"],"mappings":"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"}
1	+ {"version":3,"file":"AttachmentTile.js","sources":["../../../src/components/AttachmentPreview/AttachmentTile.tsx"],"sourcesContent":["import { KeyboardEvent, MouseEvent, RefObject, useRef } from 'react';\nimport classNames from 'classnames';\n\nimport { FileIcon } from '../../componentsV2/FileIcon';\nimport { ButtonIcon } from '../../componentsV2/ButtonIcon';\nimport { Tooltip } from '../../componentsV2/Tooltip';\nimport { LoaderCircular } from '../../componentsV2/LoaderCircular';\nimport { PlayOneIcon, CloseSmallIcon, UndoIcon } from '../../icons';\n\nimport { AttachmentActionsMenu } from './AttachmentActionsMenu';\nimport { AttachmentImage } from './AttachmentImage';\nimport { AttachmentDownloadLink } from './AttachmentDownloadLink';\nimport { AttachmentPreviewItem, AttachmentPreviewProps } from './AttachmentPreview.types';\n\nimport styles from './AttachmentPreview.scss';\n\nimport utils from '~/utils/main';\n\nconst getExtension = (name: string) => {\n const parts = name.split('.');\n return parts.length > 1 ? (parts.pop() ?? '').toUpperCase() : '';\n};\n\nconst dropExtension = (name: string) => name.replace(/\\.[^/.]+$/, '');\n\n// A bare <video> paints nothing until a frame is decoded; the media fragment forces one.\nconst withFirstFrame = (src?: string) => (src && !src.includes('#t=') ? `${src}#t=0.1` : src);\n\nexport type AttachmentTileProps = {\n item: AttachmentPreviewItem;\n onRemove?: AttachmentPreviewProps['onRemove'];\n onRetry?: AttachmentPreviewProps['onRetry'];\n onItemClick?: AttachmentPreviewProps['onItemClick'];\n isSelected?: boolean;\n hideActions?: boolean;\n /** Adds \"Share file\" to the tile's hover menu. */\n onShare?: (item: AttachmentPreviewItem) => void;\n};\n\nconst TileActions = ({\n item,\n onShare,\n imageRef,\n}: Pick<AttachmentTileProps, 'item' \| 'onShare'> & {\n imageRef?: RefObject<HTMLImageElement>;\n}) => {\n const fileName = utils.getFileNameWithExtensionFromPath(item.name);\n const downloadUrl = item.hideDownload ? undefined : item.downloadUrl \|\| item.src;\n\n return (\n <div className={styles.tileActions} data-testid=\"attachment-tile-actions\">\n {!!downloadUrl && (\n <AttachmentDownloadLink\n url={downloadUrl}\n fileName={fileName}\n size=\"xs\"\n className={styles.tileActionLink}\n />\n )}\n\n <AttachmentActionsMenu\n item={item}\n onShare={onShare}\n size=\"xs\"\n testIdPrefix=\"attachment-tile\"\n tooltip=\"More actions\"\n imageRef={imageRef}\n />\n </div>\n );\n};\n\nconst stopAndRun = (action: () => void) => (event: MouseEvent) => {\n event.stopPropagation();\n action();\n};\n\nconst TileOverlays = ({ item, onRemove, onRetry }: Omit<AttachmentTileProps, 'onItemClick'>) => (\n <>\n {item.isUploading && (\n <>\n <div className={styles.uploadingOverlay} />\n <div className={styles.uploadingSpinner}>\n <LoaderCircular size=\"xs\" className={styles.loader} />\n </div>\n </>\n )}\n\n {!!item.error && (\n <>\n <div className={styles.errorOverlay} />\n {onRetry && (\n <Tooltip title=\"Retry upload\">\n <div className={styles.retryButton}>\n <ButtonIcon\n size=\"xs\"\n type=\"tertiaryBg\"\n onClick={stopAndRun(() => onRetry(item.id))}\n testId=\"attachment-retry\"\n >\n <UndoIcon size=\"small\" />\n </ButtonIcon>\n </div>\n </Tooltip>\n )}\n </>\n )}\n\n {onRemove && !item.isUploading && (\n <Tooltip title=\"Remove\">\n <div\n className={classNames(styles.removeButton, !!item.error && styles.removeButtonVisible)}\n >\n <ButtonIcon\n size=\"xs\"\n type=\"tertiaryBg\"\n onClick={stopAndRun(() => onRemove(item.id))}\n testId=\"attachment-remove\"\n >\n <CloseSmallIcon size=\"small\" />\n </ButtonIcon>\n </div>\n </Tooltip>\n )}\n </>\n);\n\nexport const AttachmentTile = ({\n item,\n onRemove,\n onRetry,\n onItemClick,\n isSelected,\n hideActions,\n onShare,\n}: AttachmentTileProps) => {\n const imageRef = useRef<HTMLImageElement>(null);\n const kind = item.kind ?? 'file';\n const overlays = <TileOverlays item={item} onRemove={onRemove} onRetry={onRetry} />;\n const fileName = utils.getFileNameWithExtensionFromPath(item.name);\n const isReady = !item.isUploading && !item.error;\n const clickable = !!onItemClick && isReady;\n // A tile being composed shows Remove in the same corner, and has nothing to link to.\n const showActions = !hideActions && !onRemove && isReady;\n\n if (kind === 'image' \|\| kind === 'video') {\n return (\n // eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events\n <div\n className={classNames(\n styles.thumbnail,\n clickable && styles.clickable,\n isSelected && styles.selected,\n !!item.error && styles.thumbnailError\n )}\n onClick={clickable ? () => onItemClick?.(item) : undefined}\n >\n <div className={styles.thumbnailInner}>\n {kind === 'image' ? (\n <AttachmentImage\n ref={imageRef}\n src={item.src}\n alt={fileName}\n className={styles.thumbnailImage}\n />\n ) : (\n <video\n src={withFirstFrame(item.src)}\n className={styles.thumbnailImage}\n preload=\"metadata\"\n playsInline\n muted\n />\n )}\n </div>\n {kind === 'video' && (\n <div className={styles.videoOverlay}>\n <PlayOneIcon theme=\"filled\" className={styles.playIcon} />\n </div>\n )}\n {showActions && <TileActions item={item} onShare={onShare} imageRef={imageRef} />}\n {overlays}\n </div>\n );\n }\n\n const fileCardContent = (\n <>\n <div className={styles.fileCardContent}>\n <FileIcon name={fileName} />\n <div className={styles.fileInfo}>\n <Tooltip title={fileName}>\n <div className={styles.fileName}>{dropExtension(fileName)}</div>\n </Tooltip>\n <div className={styles.fileType}>{getExtension(fileName)}</div>\n </div>\n </div>\n {showActions && <TileActions item={item} onShare={onShare} />}\n {overlays}\n </>\n );\n\n const cardInteraction = clickable\n ? {\n role: 'button',\n tabIndex: 0,\n onClick: () => onItemClick?.(item),\n onKeyDown: (event: KeyboardEvent) => {\n // Keys bubbling from the nested download link must reach it, not open the preview.\n if (event.target !== event.currentTarget) return;\n if (event.key !== 'Enter' && event.key !== ' ') return;\n\n // Space would otherwise scroll the surrounding feed.\n event.preventDefault();\n onItemClick?.(item);\n },\n }\n : {};\n\n return (\n <div\n className={classNames(\n styles.fileCard,\n clickable && styles.fileCardLink,\n isSelected && styles.selected,\n !!item.error && styles.thumbnailError\n )}\n {...cardInteraction}\n >\n {fileCardContent}\n </div>\n );\n};\n"],"names":["getExtension","name","_parts$pop","parts","split","length","pop","toUpperCase","TileActions","_ref","item","onShare","imageRef","fileName","utils","getFileNameWithExtensionFromPath","downloadUrl","hideDownload","undefined","src","_jsxs","className","styles","tileActions","children","_jsx","AttachmentDownloadLink","url","size","tileActionLink","AttachmentActionsMenu","testIdPrefix","tooltip","stopAndRun","action","event","stopPropagation","TileOverlays","_ref2","onRemove","onRetry","_Fragment","isUploading","uploadingOverlay","uploadingSpinner","LoaderCircular","loader","error","errorOverlay","Tooltip","title","retryButton","ButtonIcon","type","onClick","id","testId","UndoIcon","classNames","removeButton","removeButtonVisible","CloseSmallIcon","AttachmentTile","_ref3","_item$kind","onItemClick","isSelected","hideActions","useRef","kind","overlays","isReady","clickable","showActions","thumbnail","selected","thumbnailError","thumbnailInner","AttachmentImage","ref","alt","thumbnailImage","includes","concat","preload","playsInline","muted","videoOverlay","PlayOneIcon","theme","playIcon","fileCardContent","FileIcon","fileInfo","replace","fileType","cardInteraction","role","tabIndex","onKeyDown","target","currentTarget","key","preventDefault","_objectSpread","fileCard","fileCardLink"],"mappings":"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"}