@hipay/hipay-material-ui 2.3.0-rcstyleguide-beta2 → 2.3.0-rcstyleguide-beta4

package/es/old_components/HiSelect/HiSuggestSelect.js

@@ -0,0 +1,313 @@
+"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 _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 _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 _createClass2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/createClass"));
+
+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 _Grow = _interopRequireDefault(require("@material-ui/core/Grow"));
+
+var _Paper = _interopRequireDefault(require("@material-ui/core/Paper"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _HiSelectableList = _interopRequireDefault(require("../HiSelectableList"));
+
+var _HiInput = _interopRequireDefault(require("../HiForm/HiInput"));
+
+var _styles = require("@material-ui/core/styles");
+
+var _Popper = _interopRequireDefault(require("@material-ui/core/Popper"));
+
+var _helpers = require("../utils/helpers");
+
+var _keycode = _interopRequireDefault(require("keycode"));
+
+// @inheritedComponent HiInput
+var styles = function styles(theme) {
+  return {
+    root: {
+      backgroundColor: theme.palette.background2,
+      maxWidth: 500,
+      minWidth: 200,
+      width: '100%'
+    },
+    popper: {
+      width: '100% !important',
+      transform: 'none !important',
+      zIndex: '9 !important',
+      top: '100% !important',
+      textOverflow: 'ellipsis'
+    },
+    paper: {
+      borderRadius: '0px 2px',
+      maxHeight: 440,
+      transition: 'none'
+    },
+    alignRight: {
+      right: 0
+    }
+  };
+};
+
+exports.styles = styles;
+
+var HiSuggestSelect =
+/*#__PURE__*/
+function (_React$PureComponent) {
+  (0, _inherits2.default)(HiSuggestSelect, _React$PureComponent);
+  (0, _createClass2.default)(HiSuggestSelect, null, [{
+    key: "getDerivedStateFromProps",
+    value: function getDerivedStateFromProps(props, state) {
+      if (JSON.stringify(props.options) !== JSON.stringify(state.options)) {
+        return {
+          options: props.options,
+          suggestionFocusIndex: -1
+        };
+      }
+
+      return null;
+    }
+  }]);
+
+  function HiSuggestSelect(props) {
+    var _this;
+
+    (0, _classCallCheck2.default)(this, HiSuggestSelect);
+    _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(HiSuggestSelect).call(this, props));
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getInputElement", function (el) {
+      _this.textInput = el;
+
+      if (_this.props.inputRef) {
+        _this.props.inputRef(_this.textInput);
+      }
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleSelect", function (event, value) {
+      document.body.style.overflow = 'auto';
+
+      _this.props.onSelect(event, value);
+
+      var textInput = _this.textInput;
+
+      if (textInput) {
+        setTimeout(function () {
+          textInput.focus();
+          textInput.scrollLeft = textInput.scrollWidth;
+        }, 1);
+      }
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleKeyDown", function (event) {
+      var nextItem;
+      var key = (0, _keycode.default)(event);
+
+      if (key === 'down') {
+        event.preventDefault();
+        nextItem = (0, _helpers.getNextItemSelectable)(document.activeElement, 'down');
+      } else if (key === 'up') {
+        event.preventDefault();
+        nextItem = (0, _helpers.getNextItemSelectable)(document.activeElement, 'up');
+      } else if (key === 'tab') {
+        document.body.style.overflow = 'auto';
+      } else if (key === 'escape' || 'enter') {
+        event.preventDefault();
+
+        var item = _this.props.options.find(function (elem) {
+          return String(elem.id) === event.target.id;
+        });
+
+        _this.handleSelect(null, item);
+      }
+
+      if (nextItem) {
+        nextItem.focus();
+      }
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleKeyDownSearch", function (event) {
+      if (event.key === 'ArrowDown') {
+        event.preventDefault();
+
+        if (_this.state.suggestionFocusIndex < _this.props.options.length - 1) {
+          _this.setState(function (prevState) {
+            return {
+              suggestionFocusIndex: prevState.suggestionFocusIndex + 1
+            };
+          });
+        }
+      } else if (event.key === 'ArrowUp') {
+        event.preventDefault();
+
+        if (_this.state.suggestionFocusIndex >= 0) {
+          _this.setState(function (prevState) {
+            return {
+              suggestionFocusIndex: prevState.suggestionFocusIndex - 1
+            };
+          });
+        }
+      } else if (event.key === 'Enter' && _this.state.suggestionFocusIndex >= 0) {
+        event.preventDefault(); // Suggestion focused
+
+        _this.handleSelect(event, _this.state.options[_this.state.suggestionFocusIndex]);
+      } else if (event.key === 'Escape') {
+        _this.setState({
+          options: [],
+          suggestionFocusIndex: -1
+        });
+      }
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleFocus", function (event) {
+      _this.setState({
+        focused: true
+      });
+
+      if (_this.props.onFocusInput) {
+        _this.props.onFocusInput(event);
+      }
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleBlur", function (event) {
+      // Si on click sur un élément de HiInput, on garde le focus
+      // Par exemple sur l'icone reset
+      if (!event.relatedTarget || !_this.overlay || !_this.overlay.contains(event.relatedTarget)) {
+        _this.setState({
+          options: [],
+          focused: false,
+          suggestionFocusIndex: -1
+        });
+
+        if (_this.props.onBlurInput) {
+          _this.props.onBlurInput(event);
+        }
+      }
+    });
+    _this.state = {
+      focused: false,
+      options: props.options,
+      suggestionFocusIndex: -1
+    };
+    return _this;
+  }
+
+  (0, _createClass2.default)(HiSuggestSelect, [{
+    key: "render",
+    value: function render() {
+      var _this2 = this;
+
+      var _this$props = this.props,
+          classes = _this$props.classes,
+          id = _this$props.id,
+          loading = _this$props.loading,
+          showMinLength = _this$props.showMinLength,
+          showNoResults = _this$props.showNoResults,
+          onSearch = _this$props.onSearch,
+          translations = _this$props.translations,
+          align = _this$props.align,
+          inputClasses = _this$props.inputClasses,
+          otherProps = (0, _objectWithoutProperties2.default)(_this$props, ["classes", "id", "loading", "showMinLength", "showNoResults", "onSearch", "translations", "align", "inputClasses"]);
+      var _this$state = this.state,
+          focused = _this$state.focused,
+          options = _this$state.options,
+          suggestionFocusIndex = _this$state.suggestionFocusIndex;
+      var optionsShown = options; // If loading
+
+      if (loading) {
+        optionsShown = [{
+          id: '_loading',
+          type: 'loader',
+          disabled: true,
+          centered: true,
+          checkbox: false,
+          label: 'loading'
+        }];
+      } else if (options.length === 0 && (showNoResults || showMinLength)) {
+        // If no result match
+        optionsShown = [{
+          id: '_no_result',
+          type: 'text',
+          disabled: true,
+          centered: true,
+          checkbox: false,
+          label: showNoResults ? translations.no_result_match : translations.min_length
+        }];
+      }
+
+      var open = !!optionsShown.length && focused;
+      return _react.default.createElement("div", {
+        className: classes.root,
+        ref: function ref(el) {
+          _this2.overlay = el;
+        }
+      }, _react.default.createElement(_HiInput.default, (0, _extends2.default)({}, otherProps, {
+        inputId: id,
+        focused: focused,
+        inputRef: this.getInputElement,
+        onChange: onSearch,
+        onKeyDown: this.handleKeyDownSearch,
+        onBlur: this.handleBlur,
+        onFocus: this.handleFocus,
+        classes: inputClasses
+      })), open && _react.default.createElement(_Popper.default, {
+        disablePortal: true,
+        anchorEl: this.textInput,
+        placement: "bottom-start",
+        className: (0, _classnames.default)(classes.popper, (0, _defineProperty2.default)({}, classes.alignRight, align === 'right')),
+        open: true
+      }, _react.default.createElement(_Grow.default, {
+        in: open,
+        id: "menu-list",
+        style: {
+          transformOrigin: '0 0 0'
+        }
+      }, _react.default.createElement(_Paper.default, {
+        className: classes.paper
+      }, _react.default.createElement(_HiSelectableList.default, {
+        itemList: optionsShown,
+        selectedIdList: [],
+        hideCheckbox: true,
+        onSelect: this.handleSelect,
+        translations: translations,
+        onKeyDown: this.handleKeyDown,
+        suggestionFocusIndex: suggestionFocusIndex
+      })))));
+    }
+  }]);
+  return HiSuggestSelect;
+}(_react.default.PureComponent);
+
+(0, _defineProperty2.default)(HiSuggestSelect, "defaultProps", {
+  align: 'left',
+  showMinLength: false,
+  showNoResults: false,
+  translations: {
+    no_result_match: 'Aucun résultat correspondant',
+    min_length: 'Veuillez saisir 3 caractères minimum'
+  },
+  options: []
+});
+
+var _default = (0, _styles.withStyles)(styles, {
+  hiComponent: true,
+  name: 'HmuiHiSuggestSelect'
+})(HiSuggestSelect);
+
+exports.default = _default;

package/es/old_components/HiSelect/HiSuggestSelectField.js

@@ -0,0 +1,87 @@
+"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 _inherits2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/inherits"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _HiFormControl = _interopRequireDefault(require("../HiForm/HiFormControl"));
+
+var _HiSuggestSelect = _interopRequireDefault(require("./HiSuggestSelect"));
+
+// @inheritedComponent HiSuggestSelect
+
+/**
+ * Champs input autosuggest pour formulaire avec label
+ */
+var HiSuggestSelectField =
+/*#__PURE__*/
+function (_React$PureComponent) {
+  (0, _inherits2.default)(HiSuggestSelectField, _React$PureComponent);
+
+  function HiSuggestSelectField() {
+    (0, _classCallCheck2.default)(this, HiSuggestSelectField);
+    return (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(HiSuggestSelectField).apply(this, arguments));
+  }
+
+  (0, _createClass2.default)(HiSuggestSelectField, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+          label = _this$props.label,
+          required = _this$props.required,
+          disabled = _this$props.disabled,
+          error = _this$props.error,
+          errorText = _this$props.errorText,
+          helperText = _this$props.helperText,
+          helperIcon = _this$props.helperIcon,
+          id = _this$props.id,
+          className = _this$props.className,
+          others = (0, _objectWithoutProperties2.default)(_this$props, ["label", "required", "disabled", "error", "errorText", "helperText", "helperIcon", "id", "className"]);
+      return _react.default.createElement(_HiFormControl.default, {
+        id: id,
+        label: label,
+        required: required,
+        disabled: disabled,
+        error: error,
+        errorText: errorText,
+        helperText: helperText,
+        helperIcon: helperIcon,
+        className: className
+      }, _react.default.createElement(_HiSuggestSelect.default, (0, _extends2.default)({
+        id: id,
+        translations: {
+          all: 'Tous les pays',
+          no_result_match: 'Aucun résultat correspondant',
+          search: 'Recherche',
+          n_items_selected: '%s pays sélectionnés',
+          one_item_selected: '%s pays sélectionné'
+        },
+        disabled: disabled,
+        error: error
+      }, others)));
+    }
+  }]);
+  return HiSuggestSelectField;
+}(_react.default.PureComponent);
+
+var _default = HiSuggestSelectField;
+exports.default = _default;

package/es/old_components/HiSelect/index.js

@@ -0,0 +1,85 @@
+"use strict";
+
+var _interopRequireWildcard = require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/interopRequireWildcard");
+
+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
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _HiSelect.default;
+  }
+});
+Object.defineProperty(exports, "HiNestedSelect", {
+  enumerable: true,
+  get: function get() {
+    return _HiNestedSelect.default;
+  }
+});
+Object.defineProperty(exports, "HiSelectField", {
+  enumerable: true,
+  get: function get() {
+    return _HiSelectField.default;
+  }
+});
+Object.defineProperty(exports, "HiSelectInput", {
+  enumerable: true,
+  get: function get() {
+    return _HiSelectInput.default;
+  }
+});
+Object.defineProperty(exports, "HiSelectContent", {
+  enumerable: true,
+  get: function get() {
+    return _HiSelectContent.default;
+  }
+});
+Object.defineProperty(exports, "HiNestedSelectContent", {
+  enumerable: true,
+  get: function get() {
+    return _HiNestedSelectContent.default;
+  }
+});
+Object.defineProperty(exports, "findFinalItemRecursively", {
+  enumerable: true,
+  get: function get() {
+    return _HiNestedSelectContent.findFinalItemRecursively;
+  }
+});
+Object.defineProperty(exports, "getRecursiveFinalItemIdList", {
+  enumerable: true,
+  get: function get() {
+    return _HiNestedSelectContent.getRecursiveFinalItemIdList;
+  }
+});
+Object.defineProperty(exports, "HiSuggestSelect", {
+  enumerable: true,
+  get: function get() {
+    return _HiSuggestSelect.default;
+  }
+});
+Object.defineProperty(exports, "HiSuggestSelectField", {
+  enumerable: true,
+  get: function get() {
+    return _HiSuggestSelectField.default;
+  }
+});
+
+var _HiSelect = _interopRequireDefault(require("./HiSelect"));
+
+var _HiNestedSelect = _interopRequireDefault(require("./HiNestedSelect"));
+
+var _HiSelectField = _interopRequireDefault(require("./HiSelectField"));
+
+var _HiSelectInput = _interopRequireDefault(require("./HiSelectInput"));
+
+var _HiSelectContent = _interopRequireDefault(require("./HiSelectContent"));
+
+var _HiNestedSelectContent = _interopRequireWildcard(require("./HiNestedSelectContent"));
+
+var _HiSuggestSelect = _interopRequireDefault(require("./HiSuggestSelect"));
+
+var _HiSuggestSelectField = _interopRequireDefault(require("./HiSuggestSelectField"));