@nexusui/components
Version:
These are custom components specially-developed for NexusUI applications. They will make your life easier by giving you out-of-the-box implementations for various high-level UI elements that you can drop directly into your application.
2 lines (1 loc) • 1.43 kB
JavaScript
import{jsxs as t,jsx as e}from"react/jsx-runtime";import i from"@mui/material/Typography";import r from"@mui/material/ListItem";import o from"@mui/material/ListItemIcon";import a from"@mui/material/ListItemText";import m from"@mui/material/Box";import s from"@mui/material/Stack";import n from"@mui/material/Tooltip";import l from"clsx";import c from"./FileItem.styles.js";import{UploadStatus as d}from"../models/index.js";import{getFileSize as p}from"../util/functions/index.js";import{FileStatus as u}from"../FileStatus/FileStatus.container.js";const f="NexusFileItem",h=({icon:h,name:x,size:y,hideSize:I,status:g=d.Succeeded,errorMessage:S,progress:F=0,actions:j,onRetry:z=()=>{},secondaryAction:A,sx:N,...T})=>{const $=p(y),v=g===d.Uploading,L=g===d.Succeeded,M=t(s,{direction:"row",alignItems:"center",children:[!I&&L&&e(i,{className:l(`${f}-fileSize`,"FileItem-fileSize"),variant:"caption",children:$}),e(m,{className:l(`${f}-status`,"FileItem-status"),children:e(u,{actions:j,progress:F,status:g,onRetry:z,errorMessage:S})})]});return t(r,{"data-testid":`${f}-root`,className:`${f}-root`,sx:[j&&!v?c.fileItem:{},c.listItem,...Array.isArray(N)?N:[N]],secondaryAction:A||M,...T,children:[e(o,{sx:{minWidth:32},children:h}),e(a,{disableTypography:!0,children:e(n,{title:e("div",{translate:"no",children:x}),children:e(i,{component:"p",variant:"caption",noWrap:!0,translate:"no",children:x})})})]})};export{h as default};