UploadButton example

This example demonstrates the use of the UploadButton.

    import React from 'react';
import { render } from 'react-dom';
import { message } from 'antd';
import  {SimpleButton, UploadButton } from '@terrestris/react-geo';

/**
 * The onChange handler of the input fields.
 *
 * @param {event} e The change event of the input field.
 */
const onChange = (e) => {
  message.info('You uploaded ' + e.target.files[0].name);
};

render(
  <div>
    <div className="example-block">
      <label>UploadButton:<br />
        <UploadButton onChange={onChange} icon="upload" />
      </label>
    </div>

    <div className="example-block">
      <label>UploadButton with a texted SimpleButton as child:<br />
        <UploadButton onChange={onChange}>
          <SimpleButton>Upload</SimpleButton>
        </UploadButton>
      </label>
    </div>

    <div className="example-block">
      <UploadButton onChange={onChange}>
        <span style={{fontWeight: 'bold'}}>Click me to upload!</span>
      </UploadButton>
    </div>
  </div>,
  document.getElementById('exampleContainer')
);