@rio-cloud/rio-uikit 0.16.1-beta.21 → 0.16.1-beta.22

package/components/dropdown/ButtonDropdown.js

@@ -18,71 +18,60 @@ import menuItemsPropTypes from './menuItemsPropTypes';
 import DropdownToggleButton from './DropdownToggleButton';
 import SplitCaretButton from './SplitCaretButton';
 import Caret from './Caret';
-
 var getPlacement = function getPlacement(pullRight, dropup) {
   if (pullRight && dropup) {
     return 'top-end';
   }
-
   if (!pullRight && dropup) {
     return 'top-start';
   }
-
   if (pullRight && !dropup) {
     return 'bottom-end';
   }
-
   return 'bottom-start';
 };
-
 var ButtonDropdown = function ButtonDropdown(props) {
   var id = props.id,
-      items = props.items,
-      bsSize = props.bsSize,
-      bsStyle = props.bsStyle,
-      disabled = props.disabled,
-      iconOnly = props.iconOnly,
-      title = props.title,
-      splitButton = props.splitButton,
-      customDropdown = props.customDropdown,
-      toggleClassName = props.toggleClassName,
-      dropdownClassName = props.dropdownClassName,
-      className = props.className,
-      open = props.open,
-      dropup = props.dropup,
-      pullRight = props.pullRight,
-      noCaret = props.noCaret,
-      onOpen = props.onOpen,
-      onClose = props.onClose,
-      onLabelButtonClick = props.onLabelButtonClick,
-      usePortal = props.usePortal,
-      popperConfig = props.popperConfig,
-      remainingProps = _objectWithoutProperties(props, _excluded);
-
+    items = props.items,
+    bsSize = props.bsSize,
+    bsStyle = props.bsStyle,
+    disabled = props.disabled,
+    iconOnly = props.iconOnly,
+    title = props.title,
+    splitButton = props.splitButton,
+    customDropdown = props.customDropdown,
+    toggleClassName = props.toggleClassName,
+    dropdownClassName = props.dropdownClassName,
+    className = props.className,
+    open = props.open,
+    dropup = props.dropup,
+    pullRight = props.pullRight,
+    noCaret = props.noCaret,
+    onOpen = props.onOpen,
+    onClose = props.onClose,
+    onLabelButtonClick = props.onLabelButtonClick,
+    usePortal = props.usePortal,
+    popperConfig = props.popperConfig,
+    remainingProps = _objectWithoutProperties(props, _excluded);
   var _useState = useState(open),
-      _useState2 = _slicedToArray(_useState, 2),
-      internalOpen = _useState2[0],
-      setInternalOpen = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    internalOpen = _useState2[0],
+    setInternalOpen = _useState2[1];
   var _React$useState = React.useState(null),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      refDropdownToggle = _React$useState2[0],
-      setRefDropdownToggle = _React$useState2[1];
-
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    refDropdownToggle = _React$useState2[0],
+    setRefDropdownToggle = _React$useState2[1];
   var _React$useState3 = React.useState(null),
-      _React$useState4 = _slicedToArray(_React$useState3, 2),
-      refDropdownMenu = _React$useState4[0],
-      setRefDropdownMenu = _React$useState4[1];
-
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    refDropdownMenu = _React$useState4[0],
+    setRefDropdownMenu = _React$useState4[1];
   var defaultPopperConfig = {
     placement: getPlacement(pullRight, dropup),
     modifiers: []
   };
-
   var _usePopper = usePopper(refDropdownToggle, refDropdownMenu, popperConfig || defaultPopperConfig),
-      styles = _usePopper.styles,
-      attributes = _usePopper.attributes;
-
+    styles = _usePopper.styles,
+    attributes = _usePopper.attributes;
   var wrapperRef = useClickOutside(function () {
     return closeMenu();
   });
@@ -95,38 +84,30 @@ var ButtonDropdown = function ButtonDropdown(props) {
       setInternalOpen(open);
     }
   }, [isUncontrolled, open]);
-
   var toggleOpen = function toggleOpen(event) {
     var isOpen = isUncontrolled ? internalOpen : open;
-
     if (isOpen) {
       closeMenu();
     } else {
       openMenu(event);
     }
   };
-
   var openMenu = function openMenu(event) {
     if (isUncontrolled) {
       setInternalOpen(true);
     }
-
     onOpen(event);
   };
-
   var closeMenu = function closeMenu() {
     if (isUncontrolled) {
       setInternalOpen(false);
     }
-
     onClose();
   };
-
   var handleSplitLabelButtonClick = function handleSplitLabelButtonClick() {
     closeMenu();
     onLabelButtonClick();
   };
-
   var handleDropdownButtonClick = splitButton ? handleSplitLabelButtonClick : toggleOpen;
   var isOpen = isUncontrolled ? internalOpen : open;
   var wrapperClasses = classNames('dropdown', 'btn-group', isOpen && 'open', className);
@@ -157,7 +138,6 @@ var ButtonDropdown = function ButtonDropdown(props) {
     onClick: toggleOpen
   }), isOpen && usePortal && /*#__PURE__*/ReactDOM.createPortal(dropdownMenu, dropdownRoot), isOpen && !usePortal && dropdownMenu);
 };
-
 ButtonDropdown.defaultProps = {
   id: Math.random().toString(36).substr(2, 16),
   items: [],

package/components/dropdown/Caret.js

@@ -1,9 +1,7 @@
 import React from 'react';
-
 var Caret = function Caret() {
   return /*#__PURE__*/React.createElement("span", {
     className: "caret"
   });
 };
-
 export default Caret;

package/components/dropdown/DropdownSubmenu.js

@@ -7,14 +7,12 @@ import classNames from 'classnames';
 import getMenuItems from '../menuItems/getMenuItems';
 import menuItemsPropTypes from './menuItemsPropTypes';
 import MenuItems from '../menuItems/MenuItems';
-
 var DropdownSubmenu = function DropdownSubmenu(props) {
   var title = props.title,
-      items = props.items,
-      disabled = props.disabled,
-      className = props.className,
-      remainingProps = _objectWithoutProperties(props, _excluded);
-
+    items = props.items,
+    disabled = props.disabled,
+    className = props.className,
+    remainingProps = _objectWithoutProperties(props, _excluded);
   var classes = classNames('dropdown-submenu', disabled && 'disabled', className && className);
   return /*#__PURE__*/React.createElement("li", _extends({}, remainingProps, {
     className: classes
@@ -26,7 +24,6 @@ var DropdownSubmenu = function DropdownSubmenu(props) {
     className: "rioglyph rioglyph-menu-right"
   })), /*#__PURE__*/React.createElement(MenuItems, null, getMenuItems(items)));
 };
-
 DropdownSubmenu.defaultProps = {
   title: '',
   items: [],

package/components/dropdown/DropdownToggleButton.js

@@ -4,22 +4,19 @@ var _excluded = ["id", "bsSize", "bsStyle", "disabled", "iconOnly", "splitButton
 import React from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
-
 var getSizeClassName = function getSizeClassName(bsSize) {
   return bsSize === 'xs' && 'btn-xs' || bsSize === 'sm' && 'btn-sm' || bsSize === 'lg' && 'btn-lg';
 };
-
 var DropdownToggleButton = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var id = props.id,
-      bsSize = props.bsSize,
-      bsStyle = props.bsStyle,
-      disabled = props.disabled,
-      iconOnly = props.iconOnly,
-      splitButton = props.splitButton,
-      className = props.className,
-      children = props.children,
-      remainingProps = _objectWithoutProperties(props, _excluded);
-
+    bsSize = props.bsSize,
+    bsStyle = props.bsStyle,
+    disabled = props.disabled,
+    iconOnly = props.iconOnly,
+    splitButton = props.splitButton,
+    className = props.className,
+    children = props.children,
+    remainingProps = _objectWithoutProperties(props, _excluded);
   var labelButtonClasses = classNames(!splitButton && 'dropdown-toggle', 'btn', "btn-".concat(bsStyle), getSizeClassName(bsSize), iconOnly && 'btn-icon-only', disabled && 'disabled', className && !splitButton && className);
   return /*#__PURE__*/React.createElement("button", _extends({}, remainingProps, {
     id: splitButton ? "button-".concat(id) : id,

package/components/dropdown/SimpleButtonDropdown.js

@@ -1,11 +1,9 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
 import ButtonDropdown from './ButtonDropdown';
-
 var SimpleButtonDropdown = function SimpleButtonDropdown(props) {
   return /*#__PURE__*/React.createElement(ButtonDropdown, _extends({}, props, {
     noCaret: true
   }));
 };
-
 export default SimpleButtonDropdown;

package/components/dropdown/SingleButtonDropdown.js

@@ -1,8 +1,6 @@
 import React from 'react';
 import ButtonDropdown from './ButtonDropdown';
-
 var SingleButtonDropdown = function SingleButtonDropdown(props) {
   return /*#__PURE__*/React.createElement(ButtonDropdown, props);
 };
-
 export default SingleButtonDropdown;

package/components/dropdown/SplitButtonDropdown.js

@@ -1,11 +1,9 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
 import ButtonDropdown from './ButtonDropdown';
-
 var SplitButtonDropdown = function SplitButtonDropdown(props) {
   return /*#__PURE__*/React.createElement(ButtonDropdown, _extends({}, props, {
     splitButton: true
   }));
 };
-
 export default SplitButtonDropdown;

package/components/dropdown/SplitCaretButton.js

@@ -7,10 +7,9 @@ import classNames from 'classnames';
 import Caret from './Caret';
 var SplitCaretButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var disabled = _ref.disabled,
-      bsStyle = _ref.bsStyle,
-      className = _ref.className,
-      remainingProps = _objectWithoutProperties(_ref, _excluded);
-
+    bsStyle = _ref.bsStyle,
+    className = _ref.className,
+    remainingProps = _objectWithoutProperties(_ref, _excluded);
   var splitCaretButtonClasses = classNames('dropdown-toggle', 'btn', "btn-".concat(bsStyle), disabled && 'disabled', className);
   return /*#__PURE__*/React.createElement("button", _extends({}, remainingProps, {
     role: "button",

package/components/expander/ExpanderList.js

@@ -3,39 +3,31 @@ import _createClass from "@babel/runtime/helpers/createClass";
 import _inherits from "@babel/runtime/helpers/inherits";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import isEqual from 'lodash/fp/isEqual';
 import Collapse from '../collapse/Collapse';
 import classname from 'classnames';
-
+var getRandomString = function getRandomString() {
+  return (Math.random() + 1).toString(36).toUpperCase().substring(2);
+};
 var ExpanderList = /*#__PURE__*/function (_Component) {
   _inherits(ExpanderList, _Component);
-
   var _super = _createSuper(ExpanderList);
-
-  /* istanbul ignore next */
   function ExpanderList() {
     var _this;
-
     _classCallCheck(this, ExpanderList);
-
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-
     _this = _super.call.apply(_super, [this].concat(args));
     _this.state = {
       items: _this.parseItems(_this.props.items)
     };
     return _this;
   }
-
   _createClass(ExpanderList, [{
     key: "parseItems",
     value: function parseItems(items) {
@@ -43,35 +35,33 @@ var ExpanderList = /*#__PURE__*/function (_Component) {
         // Generate a unique id (if not present) instead of using the index for the key as it will create
         // side effects when removing items from the list and re-render the ExpanderList.
         if (!item.id) {
-          item.id = "".concat(index, "-").concat(Math.random());
+          item.id = getRandomString();
         }
-
         return item;
       });
-    } // eslint-disable-next-line camelcase
+    }
 
+    // eslint-disable-next-line camelcase
   }, {
     key: "UNSAFE_componentWillReceiveProps",
     value: function UNSAFE_componentWillReceiveProps(nextProps) {
       var _this2 = this;
-
       // Map the internal open state to the new props in order to preserve opened items
       var mappedNextProps = nextProps.items.map(function (item) {
         if (item.open === undefined || item.open === null) {
           var matchingItem = _this2.state.items.find(function (oldItem) {
             return oldItem.id === item.id;
           });
-
           if (matchingItem) {
             item.open = matchingItem.open;
           }
         }
-
         return item;
-      }); // Only update the list when the amount of items is different or items inside have changed.
+      });
+
+      // Only update the list when the amount of items is different or items inside have changed.
       // Note: When using the generated internal "id" the check is always true, as the id is regenerated for new
       // items, means it will always update the state and hence re-render.
-
       if (!isEqual(mappedNextProps, this.state.items)) {
         this.setState({
           items: this.parseItems(mappedNextProps)
@@ -94,7 +84,6 @@ var ExpanderList = /*#__PURE__*/function (_Component) {
     key: "getHeaderElement",
     value: function getHeaderElement(item) {
       var _this3 = this;
-
       var headerClassNames = classname('expander-list-header', item.headerClassName && item.headerClassName);
       var iconClassNames = item.body && classname('expander-icon', 'rioglyph', 'rioglyph-chevron-down');
       return /*#__PURE__*/React.createElement("div", {
@@ -116,7 +105,6 @@ var ExpanderList = /*#__PURE__*/function (_Component) {
       if (!item.body) {
         return;
       }
-
       var bodyClassNames = classname('expander-list-body', item.bodyClassName && item.bodyClassName);
       return /*#__PURE__*/React.createElement(Collapse, {
         "in": isOpen,
@@ -128,33 +116,25 @@ var ExpanderList = /*#__PURE__*/function (_Component) {
         className: bodyClassNames
       }, item.body)));
     }
-  }, {
-    key: "getListItem",
-    value: function getListItem(item) {
-      var isOpen = item.open;
-      var itemClassNames = classname('list-group-item', item.className && "".concat(item.className), item.body && 'expandable', isOpen && 'open');
-      return /*#__PURE__*/React.createElement("li", {
-        className: itemClassNames,
-        key: item.id
-      }, this.getHeaderElement(item), this.getBodyElement(item, isOpen, this.props.mountOnEnter, this.props.unmountOnExit));
-    }
   }, {
     key: "render",
     value: function render() {
       var _this4 = this;
-
       var listClassNames = classname('expander-list list-group', this.props.className);
       return /*#__PURE__*/React.createElement("ul", {
         className: listClassNames
       }, this.state.items.map(function (item) {
-        return _this4.getListItem(item);
+        var isOpen = item.open;
+        var itemClassNames = classname('list-group-item', item.className && "".concat(item.className), item.body && 'expandable', isOpen && 'open');
+        return /*#__PURE__*/React.createElement("li", {
+          className: itemClassNames,
+          key: item.id
+        }, _this4.getHeaderElement(item), _this4.getBodyElement(item, isOpen, _this4.props.mountOnEnter, _this4.props.unmountOnExit));
       }));
     }
   }]);
-
   return ExpanderList;
 }(Component);
-
 export { ExpanderList as default };
 ExpanderList.defaultProps = {
   items: [],

package/components/expander/ExpanderPanel.js

@@ -6,44 +6,40 @@ import React, { useEffect, useState } from 'react';
 import PropTypes from 'prop-types';
 import Collapse from '../collapse/Collapse';
 import classname from 'classnames';
-
 var ExpanderPanel = function ExpanderPanel(props) {
   var bsStyle = props.bsStyle,
-      className = props.className,
-      iconLeft = props.iconLeft,
-      title = props.title,
-      headerClassName = props.headerClassName,
-      titleClassName = props.titleClassName,
-      bodyClassName = props.bodyClassName,
-      mountOnEnter = props.mountOnEnter,
-      unmountOnExit = props.unmountOnExit,
-      onEnter = props.onEnter,
-      onEntering = props.onEntering,
-      onEntered = props.onEntered,
-      onExit = props.onExit,
-      onExiting = props.onExiting,
-      onExited = props.onExited,
-      children = props.children,
-      onToggle = props.onToggle,
-      open = props.open,
-      remainingProps = _objectWithoutProperties(props, _excluded);
-
+    className = props.className,
+    iconLeft = props.iconLeft,
+    title = props.title,
+    headerClassName = props.headerClassName,
+    titleClassName = props.titleClassName,
+    bodyClassName = props.bodyClassName,
+    mountOnEnter = props.mountOnEnter,
+    unmountOnExit = props.unmountOnExit,
+    onEnter = props.onEnter,
+    onEntering = props.onEntering,
+    onEntered = props.onEntered,
+    onExit = props.onExit,
+    onExiting = props.onExiting,
+    onExited = props.onExited,
+    children = props.children,
+    onToggle = props.onToggle,
+    open = props.open,
+    remainingProps = _objectWithoutProperties(props, _excluded);
   var _useState = useState(open),
-      _useState2 = _slicedToArray(_useState, 2),
-      isOpen = _useState2[0],
-      setIsOpen = _useState2[1]; // Update internal state from external prop change
-
+    _useState2 = _slicedToArray(_useState, 2),
+    isOpen = _useState2[0],
+    setIsOpen = _useState2[1];
 
+  // Update internal state from external prop change
   useEffect(function () {
     setIsOpen(open);
   }, [open]);
-
   var handleToggle = function handleToggle() {
     var newState = !isOpen;
     setIsOpen(newState);
     onToggle(newState);
   };
-
   var wrapperClassNames = classname('expander-panel panel', "panel-".concat(bsStyle), className);
   var iconClassNames = classname('expander-icon', 'rioglyph', 'rioglyph-chevron-down');
   var headerClassNames = classname('panel-heading', isOpen && 'open', iconLeft && 'icon-left', headerClassName && headerClassName);
@@ -75,7 +71,6 @@ var ExpanderPanel = function ExpanderPanel(props) {
     className: bodyClassNames
   }, isRenderCallback ? children(isOpen) : children))));
 };
-
 ExpanderPanel.defaultProps = {
   mountOnEnter: true,
   unmountOnExit: true,

package/components/fade/Fade.js

@@ -148,49 +148,45 @@ var pageTransitionVariants = {
     };
   }
 };
-
 var getPageDirection = function getPageDirection(animationStyle) {
   switch (animationStyle) {
     case Fade.PAGE_BACK:
       return -1;
-
     default:
       return 1;
   }
 };
-
 var Fade = function Fade(props) {
   var oldIn = props["in"],
-      timeout = props.timeout,
-      appear = props.appear,
-      exitBeforeEnter = props.exitBeforeEnter,
-      onExitComplete = props.onExitComplete,
-      animationStyle = props.animationStyle,
-      animatePresenceProps = props.animatePresenceProps,
-      motionProps = props.motionProps,
-      children = props.children;
+    timeout = props.timeout,
+    appear = props.appear,
+    exitBeforeEnter = props.exitBeforeEnter,
+    onExitComplete = props.onExitComplete,
+    animationStyle = props.animationStyle,
+    animatePresenceProps = props.animatePresenceProps,
+    motionProps = props.motionProps,
+    children = props.children;
   logDeprecatedWarnings(warningProps, props, 'Fade');
   var duration = props.duration || timeout;
-
   if (duration > 10) {
     duration = duration / 100;
   }
-
   var show = props.show || oldIn;
   var initial = props.initial || appear;
-  var motionDivKey = 'fade'; // If there are multiple children that are conditionally rendered like
+  var motionDivKey = 'fade';
+
+  // If there are multiple children that are conditionally rendered like
   // in case of a tabbed content - get the current visible child key
   // to update the motion.div key to animate different children
-
   if (isArray(children)) {
     var currentChild = head(children.filter(function (child) {
       return Boolean(child);
     }));
     motionDivKey = "fade-".concat(currentChild.key);
-  } // In case the animation is a page transition, use custom variants and add a custom pageDirection variable
-  // to animate in the right direction
-
+  }
 
+  // In case the animation is a page transition, use custom variants and add a custom pageDirection variable
+  // to animate in the right direction
   var isPageTransition = animationStyle === Fade.PAGE || animationStyle === Fade.PAGE_BACK;
   var pageDirection = getPageDirection(animationStyle);
   var custom = isPageTransition ? pageDirection : null;
@@ -211,7 +207,6 @@ var Fade = function Fade(props) {
     custom: custom
   }, animationProps, pageTransitionProps, motionProps), children));
 };
-
 Fade.FADE = 'fade';
 Fade.FROM_LEFT = 'fromLeft';
 Fade.FROM_RIGHT = 'fromRight';

package/components/filepicker/FilePicker.js

@@ -6,18 +6,16 @@ import PropTypes from 'prop-types';
 import Dropzone, { useDropzone } from 'react-dropzone';
 import Button from '../button/Button';
 import classNames from 'classnames';
-
 var FilePicker = function FilePicker(props) {
   var label = props.label,
-      accept = props.accept,
-      multiple = props.multiple,
-      maxSize = props.maxSize,
-      displayMode = props.displayMode,
-      onPick = props.onPick,
-      className = props.className,
-      children = props.children,
-      remainigProps = _objectWithoutProperties(props, _excluded);
-
+    accept = props.accept,
+    multiple = props.multiple,
+    maxSize = props.maxSize,
+    displayMode = props.displayMode,
+    onPick = props.onPick,
+    className = props.className,
+    children = props.children,
+    remainigProps = _objectWithoutProperties(props, _excluded);
   var dropzoneRef = useRef();
   var isButton = displayMode === 'button';
   var isDropzone = displayMode === 'dropzone';
@@ -32,11 +30,9 @@ var FilePicker = function FilePicker(props) {
     }) : acceptedFiles;
     onPick(files, rejectedFiles);
   }, [onPick, accept]);
-
   var onOpenClick = function onOpenClick() {
     return dropzoneRef.current.open();
   };
-
   return /*#__PURE__*/React.createElement("div", {
     className: "FilePicker"
   }, showButton && /*#__PURE__*/React.createElement(Button, {
@@ -50,14 +46,13 @@ var FilePicker = function FilePicker(props) {
     ref: dropzoneRef
   }), function (_ref) {
     var getRootProps = _ref.getRootProps,
-        getInputProps = _ref.getInputProps,
-        isDragActive = _ref.isDragActive;
+      getInputProps = _ref.getInputProps,
+      isDragActive = _ref.isDragActive;
     return /*#__PURE__*/React.createElement("div", getRootProps(), /*#__PURE__*/React.createElement("input", getInputProps()), showDropzone && children && children({
       isDragActive: isDragActive
     }));
   }));
 };
-
 FilePicker.DISPLAY_MODE_BUTTON = 'button';
 FilePicker.DISPLAY_MODE_DROPZONE = 'dropzone';
 FilePicker.DISPLAY_MODE_FULL = 'full';
@@ -70,27 +65,13 @@ FilePicker.defaultProps = {
   className: ''
 };
 FilePicker.propTypes = {
-  displayMode: PropTypes.string
-  /* Display mode: 'dropzone' / 'button' / 'full' */
-  ,
-  multiple: PropTypes.bool
-  /* Allow multiple file selections or not */
-  ,
-  label: PropTypes.oneOfType([PropTypes.string, PropTypes.node])
-  /* Text to display on Button */
-  ,
-  accept: PropTypes.string
-  /* List of accepted Mime Types */
-  ,
-  maxSize: PropTypes.number
-  /* Maximum File Size */
-  ,
-  onPick: PropTypes.func
-  /* Pick callback */
-  ,
-  className: PropTypes.string
-  /* Custom className for the displayed component (dropzone/button) */
-  ,
+  displayMode: PropTypes.string /* Display mode: 'dropzone' / 'button' / 'full' */,
+  multiple: PropTypes.bool /* Allow multiple file selections or not */,
+  label: PropTypes.oneOfType([PropTypes.string, PropTypes.node]) /* Text to display on Button */,
+  accept: PropTypes.string /* List of accepted Mime Types */,
+  maxSize: PropTypes.number /* Maximum File Size */,
+  onPick: PropTypes.func /* Pick callback */,
+  className: PropTypes.string /* Custom className for the displayed component (dropzone/button) */,
   children: PropTypes.any
 };
 export default FilePicker;