@mskcc/carbon-react/es/components/FileUploader/Filename.js

Carbon react components for the MSKCC DSM

/**
 * MSKCC 2021, 2024
 */

import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
import { CheckmarkFilled, WarningFilled, Close } from '@carbon/icons-react';
import PropTypes from 'prop-types';
import React__default from 'react';
import Loading from '../Loading/Loading.js';
import { usePrefix } from '../../internal/usePrefix.js';

var _Close;
function Filename(_ref) {
  let {
    iconDescription,
    status,
    invalid,
    name,
    ['aria-describedby']: ariaDescribedBy,
    ...rest
  } = _ref;
  const prefix = usePrefix();
  switch (status) {
    case 'uploading':
      return /*#__PURE__*/React__default.createElement(Loading, {
        description: iconDescription,
        small: true,
        withOverlay: false
      });
    case 'edit':
      return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, invalid && /*#__PURE__*/React__default.createElement(WarningFilled, {
        className: `${prefix}--file-invalid`
      }), /*#__PURE__*/React__default.createElement("button", _extends({
        "aria-label": `${iconDescription} - ${name}`,
        className: `${prefix}--file-close`,
        type: "button"
      }, rest, {
        tabIndex: rest.tabIndex !== undefined ? parseInt(rest.tabIndex, 10) : undefined,
        "aria-describedby": invalid ? ariaDescribedBy : undefined
      }), _Close || (_Close = /*#__PURE__*/React__default.createElement(Close, null))));
    case 'complete':
      return /*#__PURE__*/React__default.createElement(CheckmarkFilled, _extends({
        "aria-label": iconDescription,
        className: `${prefix}--file-complete`
      }, rest, {
        tabIndex: null
      }), iconDescription && /*#__PURE__*/React__default.createElement("title", null, iconDescription));
    default:
      return null;
  }
}
Filename.propTypes = {
  /**
   * Specify an id that describes the error to be read by screen readers when the filename is invalid
   */
  ['aria-describedby']: PropTypes.string,
  /**
   * Provide a description of the SVG icon to denote file upload status
   */
  iconDescription: PropTypes.string,
  /**
   * Specify if the file is invalid
   */
  invalid: PropTypes.bool,
  /**
   * Name of the uploaded file
   */
  name: PropTypes.string,
  /**
   * Status of the file upload
   */
  status: PropTypes.oneOf(['edit', 'complete', 'uploading']),
  /**
   * Provide a custom tabIndex value for the `<Filename>`
   */
  tabIndex: PropTypes.oneOfType([PropTypes.number, PropTypes.string])
};
Filename.defaultProps = {
  iconDescription: 'Uploading file',
  status: 'uploading',
  tabIndex: '0'
};

export { Filename as default };