@trap_stevo/legendarybuilderproreact-ui/dist/HUDComponents/HUDFilePreview.js

The legendary UI & utility API that makes your application a legendary application. ~ Created by Steven Compton

import _defineProperty from "@babel/runtime/helpers/defineProperty";
import _extends from "@babel/runtime/helpers/extends";
import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
import _regeneratorRuntime from "@babel/runtime/regenerator";
import * as React from "react";
import { useState, useEffect } from "react";
import { motion, AnimatePresence } from "framer-motion";
import { ConvertFileSizeToDisplay, ConvertPathsToArchiveTree, DownloadFileFromURL, ExtractZipContents } from "../HUDManagers/HUDUniversalHUDUtilityManager.js";
import { DetermineFileType } from "../HUDManagers/HUDUniversalDataUtilitiesManager.js";
import HUDArchiveTree from "./HUDArchiveTree.js";
import HUDTyper from "./HUDTyper.js";
import HUDIcon from "./HUDIcon.js";
var style = {
  container: {
    position: "relative",
    display: "flex",
    flexDirection: "column",
    overflow: "hidden",
    border: "1px solid rgba(0, 0, 0, 0.05)",
    borderRadius: "1rem",
    boxShadow: "0 12px 24px rgba(0, 0, 0, 0.06)",
    background: "#ffffff",
    width: "100%",
    padding: "0.169rem",
    paddingBottom: "0.169rem",
    paddingTop: "4.69rem",
    marginBottom: "1.5rem",
    marginTop: "1.5rem"
  },
  header: {
    position: "absolute",
    display: "flex",
    justifyContent: "space-between",
    alignItems: "center",
    borderBottom: "1px solid rgba(0, 0, 0, 0.05)",
    background: "#f9f9f9",
    minWidth: 0,
    zIndex: 269,
    padding: "16px 24px",
    right: 0,
    left: 0,
    top: 0
  },
  headerLeft: {
    display: "flex",
    flexBasis: "1%",
    flexShrink: 1,
    flexGrow: 1,
    alignItems: "center",
    minWidth: 0,
    gap: "12px"
  },
  fileInfo: {
    display: "flex",
    flexDirection: "column",
    flexShrink: 1,
    flexGrow: 1,
    maxWidth: "100%",
    minWidth: 0
  },
  fileName: {
    overflow: "hidden",
    textOverflow: "ellipsis",
    whiteSpace: "nowrap",
    lineHeight: "1.4",
    fontWeight: "600",
    fontSize: "15.5px",
    maxWidth: "100%",
    minWidth: 0
  },
  fileSize: {
    fontSize: "13px",
    color: "#888888",
    marginTop: "2px"
  },
  actions: {
    display: "flex",
    flexShrink: 0,
    flexGrow: 0,
    alignItems: "center",
    gap: "12px"
  },
  iconButton: {
    display: "flex",
    justifyContent: "center",
    alignItems: "center",
    cursor: "pointer",
    border: "none",
    borderRadius: "8px",
    background: "transparent",
    padding: "6px"
  },
  iconCopied: {
    fontSize: "12px",
    color: "#00b3ff",
    marginLeft: "4px"
  },
  download: {
    cursor: "pointer",
    display: "flex",
    justifyContent: "center",
    alignItems: "center",
    border: "1px solid rgba(0, 179, 255, 0.269)",
    borderRadius: "12px",
    boxShadow: "0 4px 12px rgba(0, 179, 255, 0.169)",
    background: "#e8f9ff",
    padding: "10px 14px"
  },
  preview: {
    display: "flex",
    alignItems: "center",
    border: "none",
    borderRadius: "0rem 0rem 1rem 1rem",
    background: "#fdfdfd",
    height: "637px",
    width: "100%"
  },
  loading: {
    textAlign: "center",
    fontStyle: "italic",
    color: "#999",
    padding: "2rem"
  },
  text: {
    wrapper: {
      display: "flex",
      flexDirection: "column",
      justifyContent: "center",
      alignItems: "center",
      boxSizing: "border-box",
      height: "100%",
      padding: "20px"
    },
    content: {
      display: "flex",
      flexDirection: "column",
      textAlign: "center",
      fontFamily: "Arial, sans-serif",
      fontSize: "1.1rem",
      color: "#333"
    }
  },
  unsupported: {
    textAlign: "center",
    fontStyle: "italic",
    color: "rgba(255, 69, 69, 0.869)",
    width: "calc(100%)",
    marginBottom: "1.69rem",
    marginTop: "1.69rem"
  },
  footer: {
    position: "absolute",
    display: "flex",
    justifyContent: "center",
    alignItems: "center",
    borderTop: "1px solid rgba(0, 0, 0, 0.0569)",
    background: "#fafafa",
    width: "100%",
    zIndex: 269,
    padding: "12px 20px",
    bottom: 0,
    right: 0,
    left: 0
  }
};
function HUDFilePreview(_ref) {
  var _ref$applicationDocum = _ref.applicationDocumentPreviewAnimationTransitionConfigurationSettings,
    applicationDocumentPreviewAnimationTransitionConfigurationSettings = _ref$applicationDocum === void 0 ? {} : _ref$applicationDocum,
    _ref$applicationDocum2 = _ref.applicationDocumentPreviewInitialAnimationConfigurationSettings,
    applicationDocumentPreviewInitialAnimationConfigurationSettings = _ref$applicationDocum2 === void 0 ? {} : _ref$applicationDocum2,
    _ref$copyFilePreviewU = _ref.copyFilePreviewURLButtonAnimationVariantsConfigurationSettings,
    copyFilePreviewURLButtonAnimationVariantsConfigurationSettings = _ref$copyFilePreviewU === void 0 ? {} : _ref$copyFilePreviewU,
    _ref$filePreviewDelet = _ref.filePreviewDeleteButtonAnimationVariantsConfigurationSettings,
    filePreviewDeleteButtonAnimationVariantsConfigurationSettings = _ref$filePreviewDelet === void 0 ? {} : _ref$filePreviewDelet,
    _ref$applicationDocum3 = _ref.applicationDocumentPreviewAnimationConfigurationSettings,
    applicationDocumentPreviewAnimationConfigurationSettings = _ref$applicationDocum3 === void 0 ? {} : _ref$applicationDocum3,
    _ref$filePreviewActio = _ref.filePreviewActionAnimationVariantsConfigurationSettings,
    filePreviewActionAnimationVariantsConfigurationSettings = _ref$filePreviewActio === void 0 ? {} : _ref$filePreviewActio,
    _ref$documentPreviewA = _ref.documentPreviewAnimationTransitionConfigurationSettings,
    documentPreviewAnimationTransitionConfigurationSettings = _ref$documentPreviewA === void 0 ? {} : _ref$documentPreviewA,
    _ref$archivePreviewAn = _ref.archivePreviewAnimationTransitionConfigurationSettings,
    archivePreviewAnimationTransitionConfigurationSettings = _ref$archivePreviewAn === void 0 ? {} : _ref$archivePreviewAn,
    _ref$downloadButtonAn = _ref.downloadButtonAnimationVariantsConfigurationSettings,
    downloadButtonAnimationVariantsConfigurationSettings = _ref$downloadButtonAn === void 0 ? {} : _ref$downloadButtonAn,
    _ref$imagePreviewAnim = _ref.imagePreviewAnimationTransitionConfigurationSettings,
    imagePreviewAnimationTransitionConfigurationSettings = _ref$imagePreviewAnim === void 0 ? {} : _ref$imagePreviewAnim,
    _ref$videoPreviewAnim = _ref.videoPreviewAnimationTransitionConfigurationSettings,
    videoPreviewAnimationTransitionConfigurationSettings = _ref$videoPreviewAnim === void 0 ? {} : _ref$videoPreviewAnim,
    _ref$audioPreviewAnim = _ref.audioPreviewAnimationTransitionConfigurationSettings,
    audioPreviewAnimationTransitionConfigurationSettings = _ref$audioPreviewAnim === void 0 ? {} : _ref$audioPreviewAnim,
    _ref$documentPreviewI = _ref.documentPreviewInitialAnimationConfigurationSettings,
    documentPreviewInitialAnimationConfigurationSettings = _ref$documentPreviewI === void 0 ? {} : _ref$documentPreviewI,
    _ref$archivePreviewIn = _ref.archivePreviewInitialAnimationConfigurationSettings,
    archivePreviewInitialAnimationConfigurationSettings = _ref$archivePreviewIn === void 0 ? {} : _ref$archivePreviewIn,
    _ref$textPreviewAnima = _ref.textPreviewAnimationTransitionConfigurationSettings,
    textPreviewAnimationTransitionConfigurationSettings = _ref$textPreviewAnima === void 0 ? {} : _ref$textPreviewAnima,
    _ref$copyFilePreviewU2 = _ref.copyFilePreviewURLButtonHoverConfigurationSettings,
    copyFilePreviewURLButtonHoverConfigurationSettings = _ref$copyFilePreviewU2 === void 0 ? {} : _ref$copyFilePreviewU2,
    _ref$copyFilePreviewU3 = _ref.copyFilePreviewURLButtonTextConfigurationSettings,
    copyFilePreviewURLButtonTextConfigurationSettings = _ref$copyFilePreviewU3 === void 0 ? {} : _ref$copyFilePreviewU3,
    _ref$filePreviewDelet2 = _ref.filePreviewDeleteButtonHoverConfigurationSettings,
    filePreviewDeleteButtonHoverConfigurationSettings = _ref$filePreviewDelet2 === void 0 ? {} : _ref$filePreviewDelet2,
    _ref$imagePreviewInit = _ref.imagePreviewInitialAnimationConfigurationSettings,
    imagePreviewInitialAnimationConfigurationSettings = _ref$imagePreviewInit === void 0 ? {} : _ref$imagePreviewInit,
    _ref$videoPreviewInit = _ref.videoPreviewInitialAnimationConfigurationSettings,
    videoPreviewInitialAnimationConfigurationSettings = _ref$videoPreviewInit === void 0 ? {} : _ref$videoPreviewInit,
    _ref$audioPreviewInit = _ref.audioPreviewInitialAnimationConfigurationSettings,
    audioPreviewInitialAnimationConfigurationSettings = _ref$audioPreviewInit === void 0 ? {} : _ref$audioPreviewInit,
    _ref$textPreviewIniti = _ref.textPreviewInitialAnimationConfigurationSettings,
    textPreviewInitialAnimationConfigurationSettings = _ref$textPreviewIniti === void 0 ? {} : _ref$textPreviewIniti,
    _ref$copyFilePreviewU4 = _ref.copyFilePreviewURLButtonTapConfigurationSettings,
    copyFilePreviewURLButtonTapConfigurationSettings = _ref$copyFilePreviewU4 === void 0 ? {} : _ref$copyFilePreviewU4,
    _ref$unsupportedFileP = _ref.unsupportedFilePreviewLabelConfigurationSettings,
    unsupportedFilePreviewLabelConfigurationSettings = _ref$unsupportedFileP === void 0 ? {} : _ref$unsupportedFileP,
    _ref$applicationDocum4 = _ref.applicationDocumentPreviewConfigurationSettings,
    applicationDocumentPreviewConfigurationSettings = _ref$applicationDocum4 === void 0 ? {} : _ref$applicationDocum4,
    _ref$filePreviewDelet3 = _ref.filePreviewDeleteButtonTapConfigurationSettings,
    filePreviewDeleteButtonTapConfigurationSettings = _ref$filePreviewDelet3 === void 0 ? {} : _ref$filePreviewDelet3,
    _ref$headerAnimationT = _ref.headerAnimationTransitionConfigurationSettings,
    headerAnimationTransitionConfigurationSettings = _ref$headerAnimationT === void 0 ? {} : _ref$headerAnimationT,
    _ref$footerConfigurat = _ref.footerConfigurationAnimationTransitionSettings,
    footerConfigurationAnimationTransitionSettings = _ref$footerConfigurat === void 0 ? {} : _ref$footerConfigurat,
    _ref$copyFilePreviewU5 = _ref.copyFilePreviewURLButtonConfigurationSettings,
    copyFilePreviewURLButtonConfigurationSettings = _ref$copyFilePreviewU5 === void 0 ? {} : _ref$copyFilePreviewU5,
    _ref$documentPreviewA2 = _ref.documentPreviewAnimationConfigurationSettings,
    documentPreviewAnimationConfigurationSettings = _ref$documentPreviewA2 === void 0 ? {} : _ref$documentPreviewA2,
    _ref$filePreviewDelet4 = _ref.filePreviewDeleteButtonConfigurationSettings,
    filePreviewDeleteButtonConfigurationSettings = _ref$filePreviewDelet4 === void 0 ? {} : _ref$filePreviewDelet4,
    _ref$archivePreviewAn2 = _ref.archivePreviewAnimationConfigurationSettings,
    archivePreviewAnimationConfigurationSettings = _ref$archivePreviewAn2 === void 0 ? {} : _ref$archivePreviewAn2,
    _ref$headerInitialAni = _ref.headerInitialAnimationConfigurationSettings,
    headerInitialAnimationConfigurationSettings = _ref$headerInitialAni === void 0 ? {} : _ref$headerInitialAni,
    _ref$footerConfigurat2 = _ref.footerConfigurationInitialAnimationSettings,
    footerConfigurationInitialAnimationSettings = _ref$footerConfigurat2 === void 0 ? {} : _ref$footerConfigurat2,
    _ref$imagePreviewAnim2 = _ref.imagePreviewAnimationConfigurationSettings,
    imagePreviewAnimationConfigurationSettings = _ref$imagePreviewAnim2 === void 0 ? {} : _ref$imagePreviewAnim2,
    _ref$videoPreviewAnim2 = _ref.videoPreviewAnimationConfigurationSettings,
    videoPreviewAnimationConfigurationSettings = _ref$videoPreviewAnim2 === void 0 ? {} : _ref$videoPreviewAnim2,
    _ref$audioPreviewAnim2 = _ref.audioPreviewAnimationConfigurationSettings,
    audioPreviewAnimationConfigurationSettings = _ref$audioPreviewAnim2 === void 0 ? {} : _ref$audioPreviewAnim2,
    _ref$textPreviewAnima2 = _ref.textPreviewAnimationConfigurationSettings,
    textPreviewAnimationConfigurationSettings = _ref$textPreviewAnima2 === void 0 ? {} : _ref$textPreviewAnima2,
    _ref$downloadButtonHo = _ref.downloadButtonHoverConfigurationSettings,
    downloadButtonHoverConfigurationSettings = _ref$downloadButtonHo === void 0 ? {} : _ref$downloadButtonHo,
    _ref$downloadButtonTa = _ref.downloadButtonTapConfigurationSettings,
    downloadButtonTapConfigurationSettings = _ref$downloadButtonTa === void 0 ? {} : _ref$downloadButtonTa,
    _ref$filePreviewActio2 = _ref.filePreviewActionConfigurationSettings,
    filePreviewActionConfigurationSettings = _ref$filePreviewActio2 === void 0 ? {} : _ref$filePreviewActio2,
    _ref$previewContainer = _ref.previewContainerConfigurationSettings,
    previewContainerConfigurationSettings = _ref$previewContainer === void 0 ? {} : _ref$previewContainer,
    _ref$headerAnimationC = _ref.headerAnimationConfigurationSettings,
    headerAnimationConfigurationSettings = _ref$headerAnimationC === void 0 ? {} : _ref$headerAnimationC,
    _ref$footerConfigurat3 = _ref.footerConfigurationAnimationSettings,
    footerConfigurationAnimationSettings = _ref$footerConfigurat3 === void 0 ? {} : _ref$footerConfigurat3,
    _ref$documentPreviewC = _ref.documentPreviewConfigurationSettings,
    documentPreviewConfigurationSettings = _ref$documentPreviewC === void 0 ? {} : _ref$documentPreviewC,
    _ref$downloadButtonCo = _ref.downloadButtonConfigurationSettings,
    downloadButtonConfigurationSettings = _ref$downloadButtonCo === void 0 ? {} : _ref$downloadButtonCo,
    _ref$archivePreviewCo = _ref.archivePreviewConfigurationSettings,
    archivePreviewConfigurationSettings = _ref$archivePreviewCo === void 0 ? {} : _ref$archivePreviewCo,
    _ref$imagePreviewConf = _ref.imagePreviewConfigurationSettings,
    imagePreviewConfigurationSettings = _ref$imagePreviewConf === void 0 ? {} : _ref$imagePreviewConf,
    _ref$videoPreviewConf = _ref.videoPreviewConfigurationSettings,
    videoPreviewConfigurationSettings = _ref$videoPreviewConf === void 0 ? {} : _ref$videoPreviewConf,
    _ref$audioPreviewConf = _ref.audioPreviewConfigurationSettings,
    audioPreviewConfigurationSettings = _ref$audioPreviewConf === void 0 ? {} : _ref$audioPreviewConf,
    _ref$textPreviewConfi = _ref.textPreviewConfigurationSettings,
    textPreviewConfigurationSettings = _ref$textPreviewConfi === void 0 ? {} : _ref$textPreviewConfi,
    _ref$headerLeftConfig = _ref.headerLeftConfigurationSettings,
    headerLeftConfigurationSettings = _ref$headerLeftConfig === void 0 ? {} : _ref$headerLeftConfig,
    _ref$imageViewConfigu = _ref.imageViewConfigurationSettings,
    imageViewConfigurationSettings = _ref$imageViewConfigu === void 0 ? {} : _ref$imageViewConfigu,
    _ref$fileInfoConfigur = _ref.fileInfoConfigurationSettings,
    fileInfoConfigurationSettings = _ref$fileInfoConfigur === void 0 ? {} : _ref$fileInfoConfigur,
    _ref$fileNameConfigur = _ref.fileNameConfigurationSettings,
    fileNameConfigurationSettings = _ref$fileNameConfigur === void 0 ? {} : _ref$fileNameConfigur,
    _ref$fileSizeConfigur = _ref.fileSizeConfigurationSettings,
    fileSizeConfigurationSettings = _ref$fileSizeConfigur === void 0 ? {} : _ref$fileSizeConfigur,
    _ref$headerConfigurat = _ref.headerConfigurationSettings,
    headerConfigurationSettings = _ref$headerConfigurat === void 0 ? {} : _ref$headerConfigurat,
    _ref$footerConfigurat4 = _ref.footerConfigurationSettings,
    footerConfigurationSettings = _ref$footerConfigurat4 === void 0 ? {} : _ref$footerConfigurat4,
    _ref$copyFilePreviewU6 = _ref.copyFilePreviewURLButtonIconConfigurations,
    copyFilePreviewURLButtonIconConfigurations = _ref$copyFilePreviewU6 === void 0 ? {} : _ref$copyFilePreviewU6,
    _ref$copyFilePreviewU7 = _ref.copyFilePreviewURLButtonTextConfigurations,
    copyFilePreviewURLButtonTextConfigurations = _ref$copyFilePreviewU7 === void 0 ? {} : _ref$copyFilePreviewU7,
    _ref$filePreviewDelet5 = _ref.filePreviewDeleteButtonIconConfigurations,
    filePreviewDeleteButtonIconConfigurations = _ref$filePreviewDelet5 === void 0 ? {} : _ref$filePreviewDelet5,
    _ref$unsupportedFileP2 = _ref.unsupportedFilePreviewLabelConfigurations,
    unsupportedFilePreviewLabelConfigurations = _ref$unsupportedFileP2 === void 0 ? {} : _ref$unsupportedFileP2,
    _ref$applicationDocum5 = _ref.applicationDocumentPreviewConfigurations,
    applicationDocumentPreviewConfigurations = _ref$applicationDocum5 === void 0 ? {} : _ref$applicationDocum5,
    _ref$copyFilePreviewU8 = _ref.copyFilePreviewURLButtonConfigurations,
    copyFilePreviewURLButtonConfigurations = _ref$copyFilePreviewU8 === void 0 ? {} : _ref$copyFilePreviewU8,
    _ref$filePreviewDelet6 = _ref.filePreviewDeleteButtonConfigurations,
    filePreviewDeleteButtonConfigurations = _ref$filePreviewDelet6 === void 0 ? {} : _ref$filePreviewDelet6,
    _ref$downloadButtonIc = _ref.downloadButtonIconConfigurations,
    downloadButtonIconConfigurations = _ref$downloadButtonIc === void 0 ? {} : _ref$downloadButtonIc,
    _ref$filePreviewActio3 = _ref.filePreviewActionConfigurations,
    filePreviewActionConfigurations = _ref$filePreviewActio3 === void 0 ? {} : _ref$filePreviewActio3,
    _ref$previewContainer2 = _ref.previewContainerConfigurations,
    previewContainerConfigurations = _ref$previewContainer2 === void 0 ? {} : _ref$previewContainer2,
    _ref$documentPreviewC2 = _ref.documentPreviewConfigurations,
    documentPreviewConfigurations = _ref$documentPreviewC2 === void 0 ? {} : _ref$documentPreviewC2,
    _ref$unknownFileIconC = _ref.unknownFileIconConfigurations,
    unknownFileIconConfigurations = _ref$unknownFileIconC === void 0 ? {} : _ref$unknownFileIconC,
    _ref$downloadButtonCo2 = _ref.downloadButtonConfigurations,
    downloadButtonConfigurations = _ref$downloadButtonCo2 === void 0 ? {} : _ref$downloadButtonCo2,
    _ref$archivePreviewCo2 = _ref.archivePreviewConfigurations,
    archivePreviewConfigurations = _ref$archivePreviewCo2 === void 0 ? {} : _ref$archivePreviewCo2,
    _ref$textFileIconConf = _ref.textFileIconConfigurations,
    textFileIconConfigurations = _ref$textFileIconConf === void 0 ? {} : _ref$textFileIconConf,
    _ref$imagePreviewConf2 = _ref.imagePreviewConfigurations,
    imagePreviewConfigurations = _ref$imagePreviewConf2 === void 0 ? {} : _ref$imagePreviewConf2,
    _ref$audioPreviewConf2 = _ref.audioPreviewConfigurations,
    audioPreviewConfigurations = _ref$audioPreviewConf2 === void 0 ? {} : _ref$audioPreviewConf2,
    _ref$videoPreviewConf2 = _ref.videoPreviewConfigurations,
    videoPreviewConfigurations = _ref$videoPreviewConf2 === void 0 ? {} : _ref$videoPreviewConf2,
    _ref$documentIconConf = _ref.documentIconConfigurations,
    documentIconConfigurations = _ref$documentIconConf === void 0 ? {} : _ref$documentIconConf,
    _ref$archiveViewConfi = _ref.archiveViewConfigurations,
    archiveViewConfigurations = _ref$archiveViewConfi === void 0 ? {} : _ref$archiveViewConfi,
    _ref$archiveIconConfi = _ref.archiveIconConfigurations,
    archiveIconConfigurations = _ref$archiveIconConfi === void 0 ? {} : _ref$archiveIconConfi,
    _ref$textPreviewConfi2 = _ref.textPreviewConfigurations,
    textPreviewConfigurations = _ref$textPreviewConfi2 === void 0 ? {} : _ref$textPreviewConfi2,
    _ref$binaryIconConfig = _ref.binaryIconConfigurations,
    binaryIconConfigurations = _ref$binaryIconConfig === void 0 ? {} : _ref$binaryIconConfig,
    _ref$headerLeftConfig2 = _ref.headerLeftConfigurations,
    headerLeftConfigurations = _ref$headerLeftConfig2 === void 0 ? {} : _ref$headerLeftConfig2,
    _ref$imageViewConfigu2 = _ref.imageViewConfigurations,
    imageViewConfigurations = _ref$imageViewConfigu2 === void 0 ? {} : _ref$imageViewConfigu2,
    _ref$audioIconConfigu = _ref.audioIconConfigurations,
    audioIconConfigurations = _ref$audioIconConfigu === void 0 ? {} : _ref$audioIconConfigu,
    _ref$videoIconConfigu = _ref.videoIconConfigurations,
    videoIconConfigurations = _ref$videoIconConfigu === void 0 ? {} : _ref$videoIconConfigu,
    _ref$imageIconConfigu = _ref.imageIconConfigurations,
    imageIconConfigurations = _ref$imageIconConfigu === void 0 ? {} : _ref$imageIconConfigu,
    _ref$codeIconConfigur = _ref.codeIconConfigurations,
    codeIconConfigurations = _ref$codeIconConfigur === void 0 ? {} : _ref$codeIconConfigur,
    _ref$fileInfoConfigur2 = _ref.fileInfoConfigurations,
    fileInfoConfigurations = _ref$fileInfoConfigur2 === void 0 ? {} : _ref$fileInfoConfigur2,
    _ref$fileNameConfigur2 = _ref.fileNameConfigurations,
    fileNameConfigurations = _ref$fileNameConfigur2 === void 0 ? {} : _ref$fileNameConfigur2,
    _ref$fileSizeConfigur2 = _ref.fileSizeConfigurations,
    fileSizeConfigurations = _ref$fileSizeConfigur2 === void 0 ? {} : _ref$fileSizeConfigur2,
    _ref$headerConfigurat2 = _ref.headerConfigurations,
    headerConfigurations = _ref$headerConfigurat2 === void 0 ? {} : _ref$headerConfigurat2,
    _ref$footerConfigurat5 = _ref.footerConfigurations,
    footerConfigurations = _ref$footerConfigurat5 === void 0 ? {} : _ref$footerConfigurat5,
    handleDownload = _ref.handleDownload,
    onDelete = _ref.onDelete,
    _ref$rightHeaderActio = _ref.rightHeaderActionContent,
    rightHeaderActionContent = _ref$rightHeaderActio === void 0 ? null : _ref$rightHeaderActio,
    _ref$leftHeaderAction = _ref.leftHeaderActionContent,
    leftHeaderActionContent = _ref$leftHeaderAction === void 0 ? null : _ref$leftHeaderAction,
    _ref$headerActionCont = _ref.headerActionContent,
    headerActionContent = _ref$headerActionCont === void 0 ? null : _ref$headerActionCont,
    _ref$rightHeaderConte = _ref.rightHeaderContent,
    rightHeaderContent = _ref$rightHeaderConte === void 0 ? null : _ref$rightHeaderConte,
    _ref$leftHeaderConten = _ref.leftHeaderContent,
    leftHeaderContent = _ref$leftHeaderConten === void 0 ? null : _ref$leftHeaderConten,
    _ref$loadingContent = _ref.loadingContent,
    loadingContent = _ref$loadingContent === void 0 ? null : _ref$loadingContent,
    _ref$headerContent = _ref.headerContent,
    headerContent = _ref$headerContent === void 0 ? null : _ref$headerContent,
    _ref$footerContent = _ref.footerContent,
    footerContent = _ref$footerContent === void 0 ? null : _ref$footerContent,
    _ref$copyFilePreviewU9 = _ref.copyFilePreviewURLButtonText,
    copyFilePreviewURLButtonText = _ref$copyFilePreviewU9 === void 0 ? "Copied!" : _ref$copyFilePreviewU9,
    _ref$forceFileDownloa = _ref.forceFileDownloads,
    forceFileDownloads = _ref$forceFileDownloa === void 0 ? false : _ref$forceFileDownloa,
    _ref$showDownloadButt = _ref.showDownloadButton,
    showDownloadButton = _ref$showDownloadButt === void 0 ? true : _ref$showDownloadButt,
    _ref$showFileName = _ref.showFileName,
    showFileName = _ref$showFileName === void 0 ? true : _ref$showFileName,
    _ref$showFileSize = _ref.showFileSize,
    showFileSize = _ref$showFileSize === void 0 ? true : _ref$showFileSize,
    _ref$showActions = _ref.showActions,
    showActions = _ref$showActions === void 0 ? true : _ref$showActions,
    _ref$showFooter = _ref.showFooter,
    showFooter = _ref$showFooter === void 0 ? false : _ref$showFooter,
    file = _ref.file;
  var _useState = useState(""),
    _useState2 = _slicedToArray(_useState, 2),
    textFileContent = _useState2[0],
    setTextFileContent = _useState2[1];
  var _useState3 = useState(null),
    _useState4 = _slicedToArray(_useState3, 2),
    previewUrl = _useState4[0],
    setPreviewUrl = _useState4[1];
  var _useState5 = useState(""),
    _useState6 = _slicedToArray(_useState5, 2),
    contentType = _useState6[0],
    setContentType = _useState6[1];
  var _useState7 = useState(null),
    _useState8 = _slicedToArray(_useState7, 2),
    archiveList = _useState8[0],
    setArchiveList = _useState8[1];
  var _useState9 = useState(false),
    _useState10 = _slicedToArray(_useState9, 2),
    downloading = _useState10[0],
    setDownloading = _useState10[1];
  var _useState11 = useState(true),
    _useState12 = _slicedToArray(_useState11, 2),
    loading = _useState12[0],
    setLoading = _useState12[1];
  var _useState13 = useState(""),
    _useState14 = _slicedToArray(_useState13, 2),
    fileName = _useState14[0],
    setFileName = _useState14[1];
  var _useState15 = useState(""),
    _useState16 = _slicedToArray(_useState15, 2),
    fileSize = _useState16[0],
    setFileSize = _useState16[1];
  var _useState17 = useState(false),
    _useState18 = _slicedToArray(_useState17, 2),
    copied = _useState18[0],
    setCopied = _useState18[1];
  var fetchFileMetadata = function fetchFileMetadata(url) {
    fetch(url, {
      method: "HEAD"
    }).then(function (response) {
      var size = response.headers.get("content-length");
      if (size && !fileSize) {
        setFileSize(ConvertFileSizeToDisplay(Number(size)));
      }
    })["catch"](function () {
      setFileSize("Unknown Size");
    });
  };
  var handleDefaultDownload = /*#__PURE__*/function () {
    var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
      return _regeneratorRuntime.wrap(function _callee$(_context) {
        while (1) switch (_context.prev = _context.next) {
          case 0:
            _context.prev = 0;
            setDownloading(true);
            _context.next = 4;
            return DownloadFileFromURL(previewUrl, fileName, forceFileDownloads);
          case 4:
            _context.next = 8;
            break;
          case 6:
            _context.prev = 6;
            _context.t0 = _context["catch"](0);
          case 8:
            _context.prev = 8;
            setDownloading(false);
            return _context.finish(8);
          case 11:
          case "end":
            return _context.stop();
        }
      }, _callee, null, [[0, 6, 8, 11]]);
    }));
    return function handleDefaultDownload() {
      return _ref2.apply(this, arguments);
    };
  }();
  var handleCopyLink = function handleCopyLink() {
    navigator.clipboard.writeText(previewUrl);
    setCopied(true);
    setTimeout(function () {
      return setCopied(false);
    }, 1500);
  };
  var getFileIcon = function getFileIcon() {
    switch (contentType) {
      case "image":
        return /*#__PURE__*/React.createElement(HUDIcon, _extends({
          name: "image"
        }, imageIconConfigurations));
      case "video":
        return /*#__PURE__*/React.createElement(HUDIcon, _extends({
          name: "video"
        }, videoIconConfigurations));
      case "audio":
        return /*#__PURE__*/React.createElement(HUDIcon, _extends({
          name: "audio"
        }, audioIconConfigurations));
      case "text":
        return /*#__PURE__*/React.createElement(HUDIcon, _extends({
          name: "file-alt"
        }, textFileIconConfigurations));
      case "code":
        return /*#__PURE__*/React.createElement(HUDIcon, _extends({
          name: "code"
        }, codeIconConfigurations));
      case "document":
        return /*#__PURE__*/React.createElement(HUDIcon, _extends({
          name: "file"
        }, documentIconConfigurations));
      case "archive":
        return /*#__PURE__*/React.createElement(HUDIcon, _extends({
          name: "file-archive"
        }, archiveIconConfigurations));
      case "binary":
        return /*#__PURE__*/React.createElement(HUDIcon, _extends({
          name: "microchip"
        }, binaryIconConfigurations));
      default:
        return /*#__PURE__*/React.createElement(HUDIcon, _extends({
          name: "question"
        }, unknownFileIconConfigurations));
    }
  };
  var renderPreview = function renderPreview() {
    var lowerName = fileName.toLowerCase();
    if (contentType === "document") {
      if (lowerName.endsWith(".pdf")) {
        return /*#__PURE__*/React.createElement(motion.iframe, _extends({
          initial: _objectSpread({
            opacity: 0
          }, documentPreviewInitialAnimationConfigurationSettings),
          animate: _objectSpread({
            opacity: 1
          }, documentPreviewAnimationConfigurationSettings),
          transition: _objectSpread({
            duration: 0.469
          }, documentPreviewAnimationTransitionConfigurationSettings),
          style: _objectSpread({
            border: "none",
            borderRadius: "0rem 0rem 1rem 1rem",
            minWidth: "69rem",
            height: "637px",
            width: "calc(100%)"
          }, documentPreviewConfigurationSettings),
          src: previewUrl
        }, documentPreviewConfigurations));
      }
      if (/\.(docx?|pptx?|xlsx?)$/.test(lowerName)) {
        var encodedUrl = encodeURIComponent(previewUrl);
        var viewerUrl = "https://view.officeapps.live.com/op/view.aspx?src=".concat(encodedUrl);
        return /*#__PURE__*/React.createElement(motion.iframe, _extends({
          initial: _objectSpread({
            opacity: 0
          }, applicationDocumentPreviewInitialAnimationConfigurationSettings),
          animate: _objectSpread({
            opacity: 1
          }, applicationDocumentPreviewAnimationConfigurationSettings),
          transition: _objectSpread({
            duration: 0.469
          }, applicationDocumentPreviewAnimationTransitionConfigurationSettings),
          style: _objectSpread({
            border: "none",
            borderRadius: "0rem 0rem 1rem 1rem",
            minWidth: "69rem",
            height: "637px",
            width: "calc(100%)"
          }, applicationDocumentPreviewConfigurationSettings),
          src: viewerUrl
        }, applicationDocumentPreviewConfigurations));
      }
    }
    if (contentType === "archive") {
      var archiveContents = archiveList ? ConvertPathsToArchiveTree(archiveList) : [];
      return /*#__PURE__*/React.createElement(motion.div, _extends({
        initial: _objectSpread({
          opacity: 0
        }, archivePreviewInitialAnimationConfigurationSettings),
        animate: _objectSpread({
          opacity: 1
        }, archivePreviewAnimationConfigurationSettings),
        transition: _objectSpread({
          duration: 0.469
        }, archivePreviewAnimationTransitionConfigurationSettings),
        style: _objectSpread({
          display: "flex",
          justifyContent: "center",
          minWidth: "69rem",
          width: "calc(100%)"
        }, archivePreviewConfigurationSettings)
      }, archivePreviewConfigurations), archiveContents.length > 0 ? /*#__PURE__*/React.createElement(HUDArchiveTree, _extends({}, archiveViewConfigurations, {
        tree: archiveContents
      })) : /*#__PURE__*/React.createElement(motion.div, _extends({
        initial: _objectSpread({
          opacity: 0
        }, archivePreviewInitialAnimationConfigurationSettings),
        animate: _objectSpread({
          opacity: 1
        }, archivePreviewAnimationConfigurationSettings),
        transition: _objectSpread({
          duration: 0.469
        }, archivePreviewAnimationTransitionConfigurationSettings),
        style: _objectSpread({
          fontFamily: "monospace",
          padding: "20px"
        }, archivePreviewConfigurationSettings)
      }, archivePreviewConfigurations), /*#__PURE__*/React.createElement(HUDTyper, {
        speed: 3.69
      }, "Unable to load content")));
    }
    if (contentType === "image") {
      return /*#__PURE__*/React.createElement(motion.div, _extends({
        initial: _objectSpread({
          opacity: 0
        }, imagePreviewInitialAnimationConfigurationSettings),
        animate: _objectSpread({
          opacity: 1
        }, imagePreviewAnimationConfigurationSettings),
        transition: _objectSpread({
          duration: 0.469
        }, imagePreviewAnimationTransitionConfigurationSettings),
        style: _objectSpread({
          display: "flex",
          justifyContent: "center",
          minWidth: "69rem",
          width: "calc(100%)"
        }, imagePreviewConfigurationSettings)
      }, imagePreviewConfigurations), /*#__PURE__*/React.createElement(HUDIcon, _extends({
        iconConfigurationSettings: _objectSpread({
          display: "flex",
          borderRadius: "0rem 0rem 1rem 1rem",
          height: "37.69rem"
        }, imageViewConfigurationSettings),
        svg: previewUrl
      }, imageViewConfigurations)));
    }
    if (contentType === "video") {
      return /*#__PURE__*/React.createElement(motion.video, _extends({
        initial: _objectSpread({
          opacity: 0
        }, videoPreviewInitialAnimationConfigurationSettings),
        animate: _objectSpread({
          opacity: 1
        }, videoPreviewAnimationConfigurationSettings),
        transition: _objectSpread({
          duration: 0.569
        }, videoPreviewAnimationTransitionConfigurationSettings),
        style: _objectSpread({
          borderRadius: "0rem 0rem 1rem 1rem",
          minWidth: "69rem",
          height: "637px",
          width: "calc(100%)"
        }, videoPreviewConfigurationSettings),
        src: previewUrl,
        controls: true
      }, videoPreviewConfigurations));
    }
    if (contentType === "audio") {
      return /*#__PURE__*/React.createElement(motion.audio, _extends({
        initial: _objectSpread({
          opacity: 0
        }, audioPreviewInitialAnimationConfigurationSettings),
        animate: _objectSpread({
          opacity: 1
        }, audioPreviewAnimationConfigurationSettings),
        transition: _objectSpread({
          duration: 0.569
        }, audioPreviewAnimationTransitionConfigurationSettings),
        style: _objectSpread({
          borderRadius: "0rem 0rem 1rem 1rem",
          minWidth: "69rem",
          width: "calc(100%)",
          padding: "16px"
        }, audioPreviewConfigurationSettings),
        src: previewUrl,
        controls: true
      }, audioPreviewConfigurations));
    }
    if (contentType === "text" || contentType === "code") {
      return /*#__PURE__*/React.createElement(motion.div, _extends({
        initial: _objectSpread({
          opacity: 0
        }, textPreviewInitialAnimationConfigurationSettings),
        animate: _objectSpread({
          opacity: 1
        }, textPreviewAnimationConfigurationSettings),
        transition: _objectSpread({
          duration: 0.469
        }, textPreviewAnimationTransitionConfigurationSettings),
        style: _objectSpread({
          fontFamily: "monospace",
          borderRadius: "0rem 0rem 1rem 1rem",
          minWidth: "69rem",
          padding: "20px"
        }, textPreviewConfigurationSettings)
      }, textPreviewConfigurations), /*#__PURE__*/React.createElement(HUDTyper, {
        speed: 3.69
      }, textFileContent));
    }
    return /*#__PURE__*/React.createElement("div", _extends({
      style: _objectSpread(_objectSpread({
        borderRadius: "0rem 0rem 1rem 1rem",
        minWidth: "69rem"
      }, style.unsupported), unsupportedFilePreviewLabelConfigurationSettings)
    }, unsupportedFilePreviewLabelConfigurations), "Unsupported file type");
  };
  useEffect(function () {
    var inferredType = "";
    if (typeof file === "string") {
      setPreviewUrl(file);
      setFileName(file.split("/").pop());
      inferredType = DetermineFileType({
        name: file,
        contentType: ""
      });
      fetchFileMetadata(file);
    } else if (file instanceof File) {
      setPreviewUrl(URL.createObjectURL(file));
      setFileName(file.name);
      inferredType = DetermineFileType({
        name: file.name,
        contentType: file.type
      });
      setFileSize(ConvertFileSizeToDisplay(file.size));
    } else if (file.url) {
      setPreviewUrl(file.url);
      setFileName(file.name || file.url.split("/").pop());
      inferredType = DetermineFileType({
        name: file.name || file.url,
        contentType: file.contentType || ""
      });
      if (file.size) {
        setFileSize(ConvertFileSizeToDisplay(file.size));
      } else {
        fetchFileMetadata(file.url);
      }
    }
    setContentType(inferredType);
    setLoading(false);
    if (inferredType === "text" || inferredType === "code") {
      if (file instanceof File) {
        file.text().then(setTextFileContent)["catch"](function () {
          return setTextFileContent("Unable to load content.");
        });
      } else if (typeof file === "string") {
        fetch(file).then(function (res) {
          return res.ok ? res.text() : Promise.reject();
        }).then(setTextFileContent)["catch"](function () {
          return setTextFileContent("Unable to load content.");
        });
      } else if (file.url) {
        fetch(file.url).then(function (res) {
          return res.ok ? res.text() : Promise.reject();
        }).then(setTextFileContent)["catch"](function () {
          return setTextFileContent("Unable to load content.");
        });
      }
    }
    if (inferredType === "archive") {
      ExtractZipContents(file.url).then(function (filePaths) {
        if (!filePaths) {
          return;
        }
        setArchiveList(filePaths);
      });
    }
  }, [file]);
  return /*#__PURE__*/React.createElement("div", _extends({
    style: _objectSpread(_objectSpread({}, style.container), previewContainerConfigurationSettings)
  }, previewContainerConfigurations), loading ? /*#__PURE__*/React.createElement(React.Fragment, null, loadingContent ? loadingContent : /*#__PURE__*/React.createElement("div", {
    style: style.loading
  }, "Loading...")) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(motion.div, _extends({
    initial: _objectSpread({
      opacity: 0,
      y: -20
    }, headerInitialAnimationConfigurationSettings),
    animate: _objectSpread({
      opacity: 1,
      y: 0
    }, headerAnimationConfigurationSettings),
    transition: _objectSpread({
      duration: 0.369
    }, headerAnimationTransitionConfigurationSettings),
    style: _objectSpread(_objectSpread({}, style.header), headerConfigurationSettings)
  }, headerConfigurations), leftHeaderContent, /*#__PURE__*/React.createElement("div", _extends({
    style: _objectSpread(_objectSpread({}, style.headerLeft), headerLeftConfigurationSettings)
  }, headerLeftConfigurations), getFileIcon(), /*#__PURE__*/React.createElement("div", _extends({
    style: _objectSpread(_objectSpread({}, style.fileInfo), fileInfoConfigurationSettings)
  }, fileInfoConfigurations), showFileName && /*#__PURE__*/React.createElement("div", _extends({
    style: _objectSpread(_objectSpread({}, style.fileName), fileNameConfigurationSettings),
    title: fileName
  }, fileNameConfigurations), fileName), showFileSize && fileSize && /*#__PURE__*/React.createElement("div", _extends({
    style: _objectSpread(_objectSpread({}, style.fileSize), fileSizeConfigurationSettings)
  }, fileSizeConfigurations), fileSize))), headerContent, /*#__PURE__*/React.createElement(motion.div, _extends({
    initial: "hidden",
    animate: "visible",
    variants: _objectSpread({
      visible: {
        transition: {
          staggerChildren: 0.1
        }
      },
      hidden: {}
    }, filePreviewActionAnimationVariantsConfigurationSettings),
    style: _objectSpread(_objectSpread({}, style.actions), filePreviewActionConfigurationSettings)
  }, filePreviewActionConfigurations), leftHeaderActionContent, showActions && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(motion.button, _extends({
    variants: _objectSpread({
      hidden: {
        opacity: 0,
        y: -6
      },
      visible: {
        opacity: 1,
        y: 0
      }
    }, copyFilePreviewURLButtonAnimationVariantsConfigurationSettings),
    whileHover: _objectSpread({
      scale: 1.1
    }, copyFilePreviewURLButtonHoverConfigurationSettings),
    whileTap: _objectSpread({
      scale: 0.95
    }, copyFilePreviewURLButtonTapConfigurationSettings),
    style: _objectSpread(_objectSpread({
      gap: "1.69px"
    }, style.iconButton), copyFilePreviewURLButtonConfigurationSettings),
    onClick: handleCopyLink
  }, copyFilePreviewURLButtonConfigurations), /*#__PURE__*/React.createElement(HUDIcon, _extends({
    name: copied ? "check" : "link"
  }, copyFilePreviewURLButtonIconConfigurations)), copied && /*#__PURE__*/React.createElement("span", _extends({
    style: _objectSpread(_objectSpread({}, style.iconCopied), copyFilePreviewURLButtonTextConfigurationSettings)
  }, copyFilePreviewURLButtonTextConfigurations), copyFilePreviewURLButtonText)), onDelete && /*#__PURE__*/React.createElement(motion.button, _extends({
    variants: _objectSpread({
      hidden: {
        opacity: 0,
        y: -6
      },
      visible: {
        opacity: 1,
        y: 0
      }
    }, filePreviewDeleteButtonAnimationVariantsConfigurationSettings),
    whileHover: _objectSpread({
      scale: 1.1
    }, filePreviewDeleteButtonHoverConfigurationSettings),
    whileTap: _objectSpread({
      scale: 0.95
    }, filePreviewDeleteButtonTapConfigurationSettings),
    style: _objectSpread(_objectSpread({}, style.iconButton), filePreviewDeleteButtonConfigurationSettings),
    onClick: function onClick(e) {
      onDelete(e, file);
    }
  }, filePreviewDeleteButtonConfigurations), /*#__PURE__*/React.createElement(HUDIcon, _extends({
    name: "trash"
  }, filePreviewDeleteButtonIconConfigurations)))), headerActionContent, showDownloadButton && /*#__PURE__*/React.createElement(motion.button, _extends({
    variants: _objectSpread({
      hidden: {
        opacity: 0,
        y: -6
      },
      visible: {
        opacity: 1,
        y: 0
      }
    }, downloadButtonAnimationVariantsConfigurationSettings),
    whileHover: _objectSpread({
      scale: 1.069,
      boxShadow: "0 0 12px rgba(0, 179, 255, 0.369)"
    }, downloadButtonHoverConfigurationSettings),
    whileTap: _objectSpread({
      scale: 0.95
    }, downloadButtonTapConfigurationSettings),
    style: _objectSpread(_objectSpread({}, style.download), downloadButtonConfigurationSettings),
    onClick: function onClick(e) {
      e.preventDefault();
      if (handleDownload) {
        handleDownload(file, setDownloading);
      } else {
        handleDefaultDownload();
      }
    }
  }, downloadButtonConfigurations), /*#__PURE__*/React.createElement(HUDIcon, _extends({
    name: "download"
  }, downloadButtonIconConfigurations))), rightHeaderActionContent), rightHeaderContent), renderPreview(), showFooter && footerContent && /*#__PURE__*/React.createElement(motion.div, _extends({
    initial: _objectSpread({
      opacity: 0,
      y: 20
    }, footerConfigurationInitialAnimationSettings),
    animate: _objectSpread({
      opacity: 1,
      y: 0
    }, footerConfigurationAnimationSettings),
    transition: _objectSpread({
      duration: 0.3
    }, footerConfigurationAnimationTransitionSettings),
    style: _objectSpread(_objectSpread({}, style.footer), footerConfigurationSettings)
  }, footerConfigurations), footerContent)));
}
;
export default HUDFilePreview;