@wordpress/components/build-module/form-file-upload/index.js

UI components for WordPress.

import _extends from "@babel/runtime/helpers/esm/extends";
import { createElement } from "@wordpress/element";

/**
 * WordPress dependencies
 */
import { useRef } from '@wordpress/element';
/**
 * Internal dependencies
 */

import Button from '../button';

/**
 * FormFileUpload is a component that allows users to select files from their local device.
 *
 * ```jsx
 * import { FormFileUpload } from '@wordpress/components';
 *
 * const MyFormFileUpload = () => (
 *   <FormFileUpload
 *     accept="image/*"
 *     onChange={ ( event ) => console.log( event.currentTarget.files ) }
 *   >
 *     Upload
 *   </FormFileUpload>
 * );
 * ```
 */
export function FormFileUpload(_ref) {
  let {
    accept,
    children,
    multiple = false,
    onChange,
    onClick,
    render,
    ...props
  } = _ref;
  const ref = useRef(null);

  const openFileDialog = () => {
    var _ref$current;

    (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.click();
  };

  const ui = render ? render({
    openFileDialog
  }) : createElement(Button, _extends({
    onClick: openFileDialog
  }, props), children);
  return createElement("div", {
    className: "components-form-file-upload"
  }, ui, createElement("input", {
    type: "file",
    ref: ref,
    multiple: multiple,
    style: {
      display: 'none'
    },
    accept: accept,
    onChange: onChange,
    onClick: onClick,
    "data-testid": "form-file-upload-input"
  }));
}
export default FormFileUpload;
//# sourceMappingURL=index.js.map