@appbuckets/react-ui/esm/Dropzone/atoms/DropzoneHint.js

Just Another React UI Framework

import { __assign } from 'tslib';
import * as React from 'react';
import EmptyContent from '../../EmptyContent/EmptyContent.js';
import { useDropzone } from '../Dropzone.context.js';

/* --------
 * Component Definition
 * -------- */
var DropzoneHint = function (props) {
  /** Get the Context */
  var dropzone = useDropzone();
  if (dropzone.files.length) {
    return null;
  }
  // @ts-ignore
  var icon = dropzone.state.isDragActive
    ? dropzone.props.iconOnDragging
    : dropzone.props.iconOnIdle;
  return React.createElement(
    EmptyContent,
    __assign({}, props, {
      className: 'dropzone-hint',
      icon: icon,
      header: dropzone.props.hintTitle,
      content: dropzone.isDisabled
        ? dropzone.props.hintWhileDisabled
        : dropzone.state.isDragActive
        ? dropzone.props.hintWhileDragging
        : dropzone.props.hintOnIdle,
    })
  );
};
DropzoneHint.displayName = 'DropzoneHint';

export { DropzoneHint as default };