@hipay/hipay-material-ui 2.3.0-rcstyleguide-beta5 → 2.3.1-rc1

package/old_components/HiForm/HiSearchField.js

@@ -1,157 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _extends2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/extends"));
-
-var _objectWithoutProperties2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/objectWithoutProperties"));
-
-var _classCallCheck2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/classCallCheck"));
-
-var _createClass2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/createClass"));
-
-var _possibleConstructorReturn2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/possibleConstructorReturn"));
-
-var _getPrototypeOf2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/getPrototypeOf"));
-
-var _assertThisInitialized2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/assertThisInitialized"));
-
-var _inherits2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/inherits"));
-
-var _defineProperty2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/defineProperty"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _HiInput = _interopRequireDefault(require("./HiInput"));
-
-/**
- * Construit une barre de recherche avec icône Search (Magnify),
- * permet de filtrer une liste d'éléments en spécifiant le nom de la/les propriétés sur lesquelles filtrer,
- * retour la liste d'élément filtré.
- * Un bouton reset s'affiche à la saisie permettant de réinitialiser l'input.
- */
-var HiSearchField =
-/*#__PURE__*/
-function (_React$Component) {
-  (0, _inherits2.default)(HiSearchField, _React$Component);
-
-  function HiSearchField(props) {
-    var _this;
-
-    (0, _classCallCheck2.default)(this, HiSearchField);
-    _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(HiSearchField).call(this, props));
-    _this.state = {
-      inputValue: ''
-    };
-    _this.filterOnProperties = _this.filterOnProperties.bind((0, _assertThisInitialized2.default)(_this));
-    _this.handleChange = _this.handleChange.bind((0, _assertThisInitialized2.default)(_this));
-    _this.handleReset = _this.handleReset.bind((0, _assertThisInitialized2.default)(_this));
-    return _this;
-  }
-
-  (0, _createClass2.default)(HiSearchField, [{
-    key: "filterOnProperties",
-    value: function filterOnProperties(item, search) {
-      if (!this.props.filterPropertyList || this.props.filterPropertyList.length < 1) {
-        // If no properties specify, search on item
-        return item.toString().toLowerCase().search(search.toLowerCase()) !== -1;
-      }
-
-      var searchSucceed = false;
-      this.props.filterPropertyList.forEach(function (filter) {
-        var itemProperty = null;
-
-        if (filter.indexOf('.') > 0) {
-          itemProperty = item[filter.split('.')[0]][filter.split('.')[1]];
-        } else {
-          itemProperty = item[filter];
-        }
-
-        if (itemProperty.toString().toLowerCase().search(search.toLowerCase()) !== -1) {
-          searchSucceed = true;
-        }
-      });
-      return searchSucceed;
-    }
-  }, {
-    key: "handleChange",
-    value: function handleChange(event, inputValue) {
-      var _this2 = this;
-
-      var searchedValue;
-
-      if (typeof inputValue !== 'undefined' && typeof event.target.value === 'undefined') {
-        searchedValue = inputValue;
-      } else {
-        searchedValue = event.target.value;
-      }
-
-      this.setState({
-        inputValue: searchedValue
-      });
-
-      if (this.props.onSearch === undefined) {
-        var currentParent = null;
-        var filteredList = [];
-        this.props.itemList.forEach(function (item) {
-          var add = _this2.filterOnProperties(item, searchedValue);
-
-          if (item.hasChildren === true && add === false) {
-            currentParent = item;
-          }
-
-          if (add === true) {
-            if (currentParent !== null && item.parentId === currentParent.id) {
-              filteredList.push(currentParent);
-              currentParent = null;
-            }
-
-            filteredList.push(item);
-          }
-        });
-        this.props.onFilteredList(filteredList);
-      } else {
-        this.props.onSearch(event, searchedValue);
-      }
-    }
-  }, {
-    key: "handleReset",
-    value: function handleReset() {
-      this.setState({
-        inputValue: ''
-      });
-
-      if (typeof this.props.onSearch === 'undefined') {
-        this.props.onFilteredList(this.props.itemList);
-      } else {
-        this.props.onSearch(undefined, '');
-      }
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this$props = this.props,
-          placeholder = _this$props.placeholder,
-          others = (0, _objectWithoutProperties2.default)(_this$props, ["placeholder"]);
-      return _react.default.createElement(_HiInput.default, (0, _extends2.default)({
-        placeholder: placeholder,
-        onReset: this.handleReset,
-        onChange: this.handleChange,
-        value: this.state.inputValue,
-        startAdornment: 'search'
-      }, others));
-    }
-  }]);
-  return HiSearchField;
-}(_react.default.Component);
-
-(0, _defineProperty2.default)(HiSearchField, "defaultProps", {
-  placeholder: 'Search'
-});
-var _default = HiSearchField;
-exports.default = _default;

package/old_components/HiForm/HiSlider.js

@@ -1,281 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.styles = void 0;
-
-var _classCallCheck2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/classCallCheck"));
-
-var _createClass2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/createClass"));
-
-var _possibleConstructorReturn2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/possibleConstructorReturn"));
-
-var _getPrototypeOf2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/getPrototypeOf"));
-
-var _assertThisInitialized2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/assertThisInitialized"));
-
-var _inherits2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/inherits"));
-
-var _defineProperty2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/defineProperty"));
-
-var _objectSpread2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/objectSpread2"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _styles = require("@material-ui/core/styles");
-
-var _HiFormControl = _interopRequireDefault(require("./HiFormControl"));
-
-var _HiIcon = _interopRequireDefault(require("../HiIcon/HiIcon"));
-
-var _classnames = _interopRequireDefault(require("classnames"));
-
-var styles = function styles(theme) {
-  return {
-    barContainer: {
-      width: '100%',
-      position: 'relative',
-      margin: '0 7px'
-    },
-    barHidden: {
-      width: '100%',
-      opacity: 0,
-      position: 'absolute',
-      top: '7px',
-      zIndex: '2',
-      cursor: 'pointer'
-    },
-    mainContainer: (0, _objectSpread2.default)({}, theme.typography.body1, {
-      display: 'flex',
-      flexWrap: 'nowrap',
-      alignItems: 'center'
-    }),
-    topContainer: {
-      display: 'flex',
-      flexWrap: 'nowrap',
-      height: '18px'
-    },
-    bottomContainer: {
-      display: 'flex',
-      flexWrap: 'nowrap',
-      height: '18px'
-    },
-    barValue: {
-      display: 'flex',
-      width: '100%',
-      height: '4px',
-      borderRadius: '2px',
-      backgroundColor: theme.palette.primary.main,
-      position: 'absolute',
-      zIndex: '2'
-    },
-    arrow: {
-      position: 'absolute',
-      zIndex: '1',
-      transform: 'rotate(-90deg) translate(0%,-50%)',
-      transition: 'transform 300ms cubic-bezier(0.4, 0, 0.2, 1)',
-      transitionProperty: 'transform color',
-      fontSize: 20,
-      cursor: 'pointer'
-    },
-    leftLabel: {
-      color: theme.palette.primary.main,
-      left: '0px',
-      position: 'absolute',
-      fontSize: '11px',
-      alignSelf: 'flex-end'
-    },
-    rightLabel: {
-      color: '#737373',
-      right: '0px',
-      position: 'absolute',
-      fontSize: '11px',
-      alignSelf: 'flex-end'
-    },
-    textValue: {
-      position: 'absolute',
-      zIndex: '2'
-    },
-    trackAfter: {
-      backgroundColor: 'gray',
-      opacity: 0.24
-    },
-    focused: {
-      fontSize: 24,
-      color: theme.palette.primary.dark
-    }
-  };
-};
-/**
- * HiSlider component
- */
-
-
-exports.styles = styles;
-
-var HiSlider =
-/*#__PURE__*/
-function (_React$Component) {
-  (0, _inherits2.default)(HiSlider, _React$Component);
-
-  function HiSlider(props) {
-    var _this;
-
-    (0, _classCallCheck2.default)(this, HiSlider);
-    _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(HiSlider).call(this, props));
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleChange", function (event) {
-      _this.props.onChange(parseFloat(event.target.value));
-
-      _this.textValueWidth = _this.textValue.offsetWidth;
-    });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleFocus", function (isFocused) {
-      return function () {
-        _this.setState({
-          focused: isFocused
-        });
-      };
-    });
-    _this.state = {
-      focused: false
-    };
-    return _this;
-  }
-  /**
-   * Measures several components once they are mounted.
-   * If the value and a label (left or right) are hovered,
-   * we hide this label.
-   */
-
-
-  (0, _createClass2.default)(HiSlider, [{
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      this.leftLabelWidth = this.leftLabel.offsetWidth;
-      this.rightLabelWidth = this.rightLabel.offsetWidth;
-      this.textValueWidth = this.textValue.offsetWidth;
-      this.barContainerWidth = this.barContainer.offsetWidth;
-
-      var _this$getHovering = this.getHovering(),
-          hoveringLeft = _this$getHovering.hoveringLeft,
-          hoveringRight = _this$getHovering.hoveringRight;
-
-      if (hoveringLeft || hoveringRight) {
-        this.forceUpdate();
-      }
-    }
-    /**
-     * Calculates if the labels are hovered.
-     */
-
-  }, {
-    key: "getHovering",
-    value: function getHovering() {
-      var ratio = (this.props.value - this.props.min) / (this.props.max - this.props.min);
-      var hoveringLeft = this.leftLabelWidth - (ratio * this.barContainerWidth - ratio * this.textValueWidth) > 0;
-      var hoveringRight = this.barContainerWidth - ratio * this.barContainerWidth - this.rightLabelWidth - (1 - ratio) * this.textValueWidth < 0;
-      return {
-        hoveringLeft: hoveringLeft,
-        hoveringRight: hoveringRight
-      };
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this2 = this;
-
-      var _this$props = this.props,
-          classes = _this$props.classes,
-          className = _this$props.className,
-          min = _this$props.min,
-          max = _this$props.max,
-          leftLabel = _this$props.leftLabel,
-          rightLabel = _this$props.rightLabel,
-          step = _this$props.step,
-          suffix = _this$props.suffix,
-          id = _this$props.id,
-          label = _this$props.label,
-          value = _this$props.value,
-          theme = _this$props.theme;
-      var focused = this.state.focused;
-      var ratio = (value - min) / (max - min);
-      var percentage = ratio * 100;
-
-      var _this$getHovering2 = this.getHovering(),
-          hoveringLeft = _this$getHovering2.hoveringLeft,
-          hoveringRight = _this$getHovering2.hoveringRight;
-
-      var barColor = focused ? theme.palette.primary.dark : theme.palette.primary.main;
-      return (// HiFormControl pour l'affichage du label
-        _react.default.createElement(_HiFormControl.default, {
-          id: id,
-          label: label,
-          className: className,
-          onFocus: this.handleFocus(true),
-          onBlur: this.handleFocus(false)
-        }, _react.default.createElement("div", {
-          className: classes.mainContainer
-        }, _react.default.createElement("div", null, min, suffix), _react.default.createElement("div", {
-          className: classes.barContainer,
-          ref: function ref(div) {
-            _this2.barContainer = div;
-          }
-        }, _react.default.createElement("div", {
-          className: classes.topContainer
-        }, !hoveringLeft && _react.default.createElement("div", {
-          className: classes.leftLabel,
-          ref: function ref(div) {
-            _this2.leftLabel = div;
-          }
-        }, leftLabel), _react.default.createElement("div", {
-          className: classes.textValue,
-          style: {
-            left: "".concat(percentage, "%"),
-            transform: "translate(-".concat(percentage, "%)")
-          },
-          ref: function ref(div) {
-            _this2.textValue = div;
-          }
-        }, value, suffix), !hoveringRight && _react.default.createElement("div", {
-          className: classes.rightLabel,
-          ref: function ref(div) {
-            _this2.rightLabel = div;
-          }
-        }, rightLabel)), _react.default.createElement("div", {
-          className: classes.barValue,
-          style: {
-            background: "linear-gradient(to right, ".concat(barColor, ", ").concat(barColor, " ").concat(percentage, "%, #E0E0E0 ").concat(percentage, "%, #E0E0E0)")
-          }
-        }), _react.default.createElement("input", {
-          type: 'range',
-          min: min,
-          max: max,
-          value: value,
-          onChange: this.handleChange,
-          className: classes.barHidden,
-          step: step
-        }), _react.default.createElement("div", {
-          className: classes.bottomContainer
-        }, _react.default.createElement(_HiIcon.default, {
-          className: (0, _classnames.default)(classes.arrow, (0, _defineProperty2.default)({}, classes.focused, focused)),
-          icon: 'play_arrow',
-          style: {
-            left: "".concat(percentage, "%"),
-            color: barColor
-          }
-        }))), _react.default.createElement("div", null, max, suffix)))
-      );
-    }
-  }]);
-  return HiSlider;
-}(_react.default.Component);
-
-var _default = (0, _styles.withStyles)(styles, {
-  hiComponent: true,
-  name: 'HiSlider',
-  withTheme: true
-})(HiSlider);
-
-exports.default = _default;

package/old_components/HiForm/HiTextField.js

@@ -1,170 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _extends2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/extends"));
-
-var _classCallCheck2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/classCallCheck"));
-
-var _createClass2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/createClass"));
-
-var _possibleConstructorReturn2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/possibleConstructorReturn"));
-
-var _getPrototypeOf2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/getPrototypeOf"));
-
-var _assertThisInitialized2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/assertThisInitialized"));
-
-var _inherits2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/inherits"));
-
-var _defineProperty2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/defineProperty"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _HiFormControl = _interopRequireDefault(require("./HiFormControl"));
-
-var _HiInput = _interopRequireDefault(require("./HiInput"));
-
-// @inheritedComponent TextField
-
-/**
- * Champs input pour formulaire
- */
-var HiTextField =
-/*#__PURE__*/
-function (_React$PureComponent) {
-  (0, _inherits2.default)(HiTextField, _React$PureComponent);
-
-  function HiTextField(props) {
-    var _this;
-
-    (0, _classCallCheck2.default)(this, HiTextField);
-    _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(HiTextField).call(this, props));
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "focus", function () {
-      _this.input.focus();
-    });
-    _this.state = {
-      nbChars: props.value ? props.value.length : 0
-    };
-    _this.handleBlur = _this.handleBlur.bind((0, _assertThisInitialized2.default)(_this));
-    _this.handleChange = _this.handleChange.bind((0, _assertThisInitialized2.default)(_this));
-    _this.handleFocus = _this.handleFocus.bind((0, _assertThisInitialized2.default)(_this));
-    return _this;
-  }
-
-  (0, _createClass2.default)(HiTextField, [{
-    key: "handleBlur",
-    value: function handleBlur(event) {
-      if (this.props.onBlur) {
-        this.props.onBlur(event);
-      }
-    }
-  }, {
-    key: "handleChange",
-    value: function handleChange(event) {
-      var value = event.target.value;
-
-      if (value.length <= this.props.maxLength) {
-        if (this.props.onChange) {
-          this.props.onChange(event);
-        }
-
-        if (this.props.multiline === true) {
-          this.setState({
-            nbChars: value.length
-          });
-        }
-      }
-    }
-  }, {
-    key: "handleFocus",
-    value: function handleFocus(event) {
-      if (this.props.onFocus) {
-        this.props.onFocus(event);
-      }
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this2 = this;
-
-      var _this$props = this.props,
-          className = _this$props.className,
-          disabled = _this$props.disabled,
-          error = _this$props.error,
-          errorText = _this$props.errorText,
-          id = _this$props.id,
-          label = _this$props.label,
-          helperText = _this$props.helperText,
-          helperIcon = _this$props.helperIcon,
-          fullWidth = _this$props.fullWidth,
-          required = _this$props.required,
-          type = _this$props.type,
-          multiline = _this$props.multiline,
-          placeholder = _this$props.placeholder,
-          value = _this$props.value,
-          HiInputProps = _this$props.HiInputProps,
-          HiInputLabelProps = _this$props.HiInputLabelProps,
-          name = _this$props.name,
-          rows = _this$props.rows,
-          maxLength = _this$props.maxLength;
-      var nbChars = this.state.nbChars;
-      return _react.default.createElement(_HiFormControl.default, {
-        label: label,
-        required: required,
-        disabled: disabled,
-        className: className,
-        error: error,
-        id: id,
-        errorText: errorText,
-        helperText: helperText,
-        helperIcon: helperIcon,
-        multiline: multiline,
-        maxLength: maxLength,
-        nbChars: nbChars,
-        InputLabelProps: HiInputLabelProps
-      }, _react.default.createElement(_HiInput.default, (0, _extends2.default)({
-        inputId: id,
-        name: name,
-        type: type,
-        placeholder: placeholder,
-        value: value,
-        disabled: disabled,
-        error: error,
-        multiline: multiline,
-        fullWidth: fullWidth,
-        onBlur: this.handleBlur,
-        onChange: this.handleChange,
-        onReset: this.props.onReset,
-        onFocus: this.handleFocus,
-        onRightIconClick: this.props.onRightIconClick,
-        onLeftIconClick: this.props.onLeftIconClick,
-        rows: rows,
-        inputRef: function inputRef(input) {
-          _this2.input = input;
-        }
-      }, HiInputProps)));
-    }
-  }]);
-  return HiTextField;
-}(_react.default.PureComponent);
-
-(0, _defineProperty2.default)(HiTextField, "defaultProps", {
-  name: '',
-  type: 'text',
-  fullWidth: true,
-  required: true,
-  disabled: false,
-  error: false,
-  errorText: '',
-  helperText: '',
-  helperIcon: false,
-  multiline: false,
-  maxLength: 280
-});
-var _default = HiTextField;
-exports.default = _default;