@hipay/hipay-material-ui 2.0.0-beta.54 → 2.0.0-beta.56

package/HiForm/HiUpload.js

@@ -0,0 +1,204 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.styles = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _withStyles = _interopRequireDefault(require("../styles/withStyles"));
+
+var _HiUploadInput = _interopRequireDefault(require("./HiUploadInput"));
+
+var _HiIcon = _interopRequireDefault(require("../HiIcon"));
+
+var styles = function styles(theme) {
+  return {
+    flexContainer: {
+      display: '  flex',
+      alignItems: 'center'
+    },
+    statusIcon: {
+      height: '80px',
+      width: '80px',
+      marginRight: '8px',
+      padding: '24px',
+      borderRadius: '2px',
+      backgroundColor: theme.palette.local.background2,
+      border: "1px solid ".concat(theme.palette.middle.main),
+      color: "".concat(theme.palette.middle.main, " !important"),
+      fontSize: '80px'
+    },
+    inputContainer: {
+      flex: '1'
+    },
+    empty: {
+      border: "1px solid ".concat(theme.palette.input.bottomLine),
+      color: "".concat(theme.palette.neutral.main, " !important")
+    },
+    complete: {
+      border: "1px solid ".concat(theme.palette.positive.main),
+      color: "".concat(theme.palette.positive.main, " !important"),
+      fontSize: '32px'
+    },
+    error: {
+      border: "1px solid ".concat(theme.palette.negative.main),
+      color: "".concat(theme.palette.negative.main, " !important")
+    }
+  };
+};
+
+exports.styles = styles;
+
+var HiUpload =
+/*#__PURE__*/
+function (_React$PureComponent) {
+  (0, _inherits2.default)(HiUpload, _React$PureComponent);
+
+  function HiUpload() {
+    (0, _classCallCheck2.default)(this, HiUpload);
+    return (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(HiUpload).apply(this, arguments));
+  }
+
+  (0, _createClass2.default)(HiUpload, [{
+    key: "render",
+    value: function render() {
+      var _classNames,
+          _this = this;
+
+      var _this$props = this.props,
+          inputs = _this$props.inputs,
+          classes = _this$props.classes,
+          values = _this$props.values,
+          others = (0, _objectWithoutProperties2.default)(_this$props, ["inputs", "classes", "values"]);
+      var complete = true;
+      var empty = true;
+      var error = false;
+
+      for (var i = 0, len = values.length; i < len; i += 1) {
+        var value = values[i];
+
+        if (value !== undefined) {
+          complete = value.value === null || value.error ? false : complete;
+          empty = value.value !== null && !value.error ? false : empty;
+          error = value.error || error;
+        } else {
+          complete = false;
+        }
+      }
+
+      var statusClass = (0, _classnames.default)(classes.statusIcon, (_classNames = {}, (0, _defineProperty2.default)(_classNames, classes.empty, empty), (0, _defineProperty2.default)(_classNames, classes.complete, complete), (0, _defineProperty2.default)(_classNames, classes.error, error), _classNames));
+      var icon;
+
+      if (error) {
+        icon = 'warning';
+      } else if (complete) {
+        icon = 'check_circle';
+      } else {
+        icon = 'file_upload';
+      }
+
+      return _react.default.createElement("div", {
+        className: classes.flexContainer
+      }, _react.default.createElement(_HiIcon.default, {
+        className: statusClass,
+        icon: icon,
+        size: 32
+      }), _react.default.createElement("div", {
+        className: classes.inputContainer
+      }, inputs.map(function (item, index) {
+        return _react.default.createElement(_HiUploadInput.default, (0, _extends2.default)({
+          maxSize: item.maxSize,
+          acceptedTypes: item.acceptedTypes,
+          placeholder: item.placeholder,
+          value: values[index] ? values[index].value : null,
+          error: values[index] ? values[index].error : null,
+          errorMessage: values[index] ? values[index].errorMessage : null,
+          onSeeFile: _this.handleSeeFile,
+          onDeleteFile: _this.props.onDeleteFile,
+          onChange: _this.props.onChange,
+          index: index,
+          key: item.id
+        }, others));
+      })));
+    }
+  }]);
+  return HiUpload;
+}(_react.default.PureComponent);
+
+HiUpload.propTypes = process.env.NODE_ENV !== "production" ? {
+  /**
+   * Useful to extend the style applied to components.
+   */
+  classes: _propTypes.default.object,
+
+  /**
+   * Classes CSS appliquées.
+   */
+  className: _propTypes.default.string,
+
+  /**
+   * Si "true", le texte d'aide s'affichera seulement au clic sur l'icône "Information"
+   */
+  helperIcon: _propTypes.default.bool,
+
+  /**
+   * Texte de l'aide
+   */
+  helperText: _propTypes.default.string,
+
+  /**
+   * Array containing each of the inputs the component has to show (represented by an object).
+   */
+  inputs: _propTypes.default.array.isRequired,
+
+  /**
+   * The method given to change the file.
+   */
+  onChange: _propTypes.default.func,
+
+  /**
+   * The method to delete a file.
+   */
+  onDeleteFile: _propTypes.default.func,
+
+  /**
+   * The method given to see the file.
+   */
+  onSeeFile: _propTypes.default.func,
+
+  /**
+   * Valeurs des inputs
+   */
+  values: _propTypes.default.array
+} : {};
+
+var _default = (0, _withStyles.default)(styles, {
+  hiComponent: true,
+  name: 'HmuiHiUpload'
+})(HiUpload);
+
+exports.default = _default;

package/HiForm/HiUploadField.js

@@ -0,0 +1,182 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.styles = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _withStyles = _interopRequireDefault(require("../styles/withStyles"));
+
+var _HiFormControl = _interopRequireDefault(require("./HiFormControl"));
+
+var _HiUpload = _interopRequireDefault(require("./HiUpload"));
+
+var styles = function styles(theme) {
+  return {
+    flexContainer: {
+      display: '  flex',
+      alignItems: 'center'
+    },
+    statusIcon: {
+      height: '80px',
+      width: '80px',
+      marginRight: '8px',
+      padding: '24px',
+      borderRadius: '2px',
+      backgroundColor: theme.palette.local.background2,
+      border: "1px solid ".concat(theme.palette.middle.main),
+      color: "".concat(theme.palette.middle.main, " !important"),
+      fontSize: '80px'
+    },
+    inputContainer: {
+      flex: '1'
+    },
+    empty: {
+      border: "1px solid ".concat(theme.palette.input.bottomLine),
+      color: "".concat(theme.palette.neutral.main, " !important")
+    },
+    complete: {
+      border: "1px solid ".concat(theme.palette.positive.main),
+      color: "".concat(theme.palette.positive.main, " !important"),
+      fontSize: '32px'
+    },
+    error: {
+      border: "1px solid ".concat(theme.palette.negative.main),
+      color: "".concat(theme.palette.negative.main, " !important")
+    }
+  };
+};
+
+exports.styles = styles;
+
+var HiUploadField =
+/*#__PURE__*/
+function (_React$PureComponent) {
+  (0, _inherits2.default)(HiUploadField, _React$PureComponent);
+
+  function HiUploadField() {
+    (0, _classCallCheck2.default)(this, HiUploadField);
+    return (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(HiUploadField).apply(this, arguments));
+  }
+
+  (0, _createClass2.default)(HiUploadField, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+          className = _this$props.className,
+          label = _this$props.label,
+          helperIcon = _this$props.helperIcon,
+          helperText = _this$props.helperText,
+          values = _this$props.values,
+          others = (0, _objectWithoutProperties2.default)(_this$props, ["className", "label", "helperIcon", "helperText", "values"]);
+      var empty = true;
+      var error = false;
+      var errorText = '';
+
+      for (var i = 0, len = values.length; i < len; i += 1) {
+        var value = values[i];
+
+        if (value !== undefined) {
+          empty = value.value !== null && !value.error ? false : empty;
+          error = value.error || error;
+          errorText = errorText || value.errorMessage;
+        }
+      }
+
+      return _react.default.createElement(_HiFormControl.default, {
+        label: label,
+        className: className,
+        errorText: errorText,
+        error: error,
+        helperIcon: helperIcon,
+        helperText: helperText
+      }, _react.default.createElement(_HiUpload.default, (0, _extends2.default)({
+        values: values
+      }, others)));
+    }
+  }]);
+  return HiUploadField;
+}(_react.default.PureComponent);
+
+HiUploadField.defaultProps = {
+  helperText: '',
+  helperIcon: false
+};
+HiUploadField.propTypes = process.env.NODE_ENV !== "production" ? {
+  /**
+   * Useful to extend the style applied to components.
+   */
+  classes: _propTypes.default.object,
+
+  /**
+   * Classes CSS appliquées.
+   */
+  className: _propTypes.default.string,
+
+  /**
+   * Si "true", le texte d'aide s'affichera seulement au clic sur l'icône "Information"
+   */
+  helperIcon: _propTypes.default.bool,
+
+  /**
+   * Texte de l'aide
+   */
+  helperText: _propTypes.default.string,
+
+  /**
+   * Array containing each of the inputs the component has to show (represented by an object).
+   */
+  inputs: _propTypes.default.array.isRequired,
+
+  /**
+   * The label of the global input.
+   */
+  label: _propTypes.default.string,
+
+  /**
+   * The method given to change the file.
+   */
+  onChange: _propTypes.default.func,
+
+  /**
+   * The method to delete a file.
+   */
+  onDeleteFile: _propTypes.default.func,
+
+  /**
+   * The method given to see the file.
+   */
+  onSeeFile: _propTypes.default.func,
+
+  /**
+   * Valeurs des inputs
+   */
+  values: _propTypes.default.array
+} : {};
+
+var _default = (0, _withStyles.default)(styles, {
+  hiComponent: true,
+  name: 'HmuiHiUploadField'
+})(HiUploadField);
+
+exports.default = _default;