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

package/old_components/HiSelect/HiDynamicSelectField.js

@@ -1,98 +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 _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 _HiDynamicSelect = _interopRequireDefault(require("./HiDynamicSelect"));
-
-// @inheritedComponent HiDynamicSelect
-
-/**
- * Champs input pour formulaire
- */
-var HiDynamicSelectField =
-/*#__PURE__*/
-function (_React$PureComponent) {
-  (0, _inherits2.default)(HiDynamicSelectField, _React$PureComponent);
-
-  function HiDynamicSelectField() {
-    (0, _classCallCheck2.default)(this, HiDynamicSelectField);
-    return (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(HiDynamicSelectField).apply(this, arguments));
-  }
-
-  (0, _createClass2.default)(HiDynamicSelectField, [{
-    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,
-          name = _this$props.name,
-          value = _this$props.value,
-          options = _this$props.options,
-          type = _this$props.type,
-          multiple = _this$props.multiple,
-          iconAll = _this$props.iconAll,
-          checkbox = _this$props.checkbox,
-          searchable = _this$props.searchable,
-          translations = _this$props.translations,
-          className = _this$props.className,
-          others = (0, _objectWithoutProperties2.default)(_this$props, ["label", "required", "disabled", "error", "errorText", "helperText", "helperIcon", "id", "name", "value", "options", "type", "multiple", "iconAll", "checkbox", "searchable", "translations", "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(_HiDynamicSelect.default, (0, _extends2.default)({
-        id: id,
-        name: name,
-        value: value,
-        options: options,
-        type: type,
-        multiple: multiple,
-        iconAll: iconAll,
-        checkbox: checkbox,
-        searchable: searchable,
-        translations: translations,
-        disabled: disabled,
-        error: error
-      }, others)));
-    }
-  }]);
-  return HiDynamicSelectField;
-}(_react.default.PureComponent);
-
-var _default = HiDynamicSelectField;
-exports.default = _default;

package/old_components/HiSelect/HiNestedSelect.js

@@ -1,445 +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 = exports.filterValue = 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 _objectSpread2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/objectSpread2"));
-
-var _toConsumableArray2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/toConsumableArray"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _HiSelect = _interopRequireDefault(require("./HiSelect"));
-
-var _HiIcon = _interopRequireDefault(require("../HiIcon"));
-
-var _styles = require("@material-ui/core/styles");
-
-var _helpers = require("../utils/helpers");
-
-// @inheritedComponent HiSelect
-
-/**
- * Return array of final item id in nested list (via props chlidren)
- * @param itemList
- * @param finalItemIdList
- * @returns {*[]}
- */
-function getRecursiveFinalItemIdList(itemList) {
-  var finalItemIdList = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
-  return [].concat((0, _toConsumableArray2.default)(finalItemIdList), (0, _toConsumableArray2.default)(itemList.reduce(function (memo, item) {
-    if (item.children) {
-      return getRecursiveFinalItemIdList(item.children, memo);
-    }
-
-    return [].concat((0, _toConsumableArray2.default)(memo), [item.id]);
-  }, [])));
-}
-/**
- * Find item by id in nested list (via props children)
- * @param itemList
- * @param searchId
- * @returns {boolean}
- */
-
-
-function findFinalItemRecursively(itemList, searchId) {
-  var foundItem = false;
-  itemList.some(function (item) {
-    if (item.id === searchId) {
-      foundItem = item;
-    } else if (item.children && !foundItem) {
-      foundItem = findFinalItemRecursively(item.children, searchId);
-    }
-
-    return foundItem !== false;
-  });
-  return foundItem;
-}
-
-var filterValue = function filterValue(item, searchValue) {
-  return searchValue === '' || (0, _helpers.foldAccents)(item.label.toString().toLowerCase()).search((0, _helpers.foldAccents)(searchValue.toLowerCase())) !== -1;
-};
-/**
- * Build item list by settings item props relative to the nested parent/child situation
- * Reduce the item list to build specified items (displayed, pinned, disabled, selected, indeterminate)
- * Parent item is selected if each children item is include in selectedItemIdList (s stay to true)
- * Parent item is indeterminate if it is not selected & not unselected (s goes false & u goes false)
- *
- * @param itemList - initial list of item
- * @param selectedItemIdList - global list of selected id
- * @param searchValue - search value on which filter item
- * @param visibleParent - visibility of the list parent item (default false)
- * @param pinnedParent - parent will be displayed as pinned items
- * @param disabledParent - parent will not be selectable
- * @param nbChildrenAsInfo - Show children number as info
- * @param translations - Translations
- * @returns {*}
- */
-
-
-exports.filterValue = filterValue;
-
-function buildFilteredItemList(itemList) {
-  var selectedItemIdList = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
-  var searchValue = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '';
-  var visibleParent = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
-  var pinnedParent = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false;
-  var disabledParent = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : false;
-  var nbChildrenAsInfo = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
-  var translations = arguments.length > 7 ? arguments[7] : undefined;
-  var filterFunc = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : filterValue;
-  return itemList.reduce(function (_ref, item) {
-    var memoItemList = _ref.l,
-        memoSelected = _ref.s,
-        memoUnselected = _ref.u,
-        memoVisible = _ref.v;
-    var itemVisible = filterFunc(item, searchValue); // Parent item
-
-    if (item.children) {
-      var _buildFilteredItemLis = buildFilteredItemList(item.children, selectedItemIdList, searchValue, itemVisible, pinnedParent, disabledParent, nbChildrenAsInfo, translations, filterFunc),
-          customizedChildren = _buildFilteredItemLis.l,
-          selected = _buildFilteredItemLis.s,
-          unselected = _buildFilteredItemLis.u,
-          visible = _buildFilteredItemLis.v;
-
-      if (nbChildrenAsInfo) {
-        item.info = translations.n_children.replace('%s', item.children.length);
-      }
-
-      return {
-        l: [].concat((0, _toConsumableArray2.default)(memoItemList), [(0, _objectSpread2.default)({}, item, {}, disabledParent && {
-          disabled: true,
-          hideCheckbox: true // don't display checkbox on disabled parent
-
-        }, {
-          pinned: pinnedParent,
-          children: customizedChildren,
-          selected: selected,
-          indeterminate: !selected && !unselected,
-          displayed: itemVisible || visible
-        })]),
-        s: memoSelected && selected,
-        u: memoUnselected && unselected,
-        v: memoVisible || itemVisible || visible
-      };
-    }
-
-    var itemSelected = selectedItemIdList.includes(item.id);
-    return {
-      l: [].concat((0, _toConsumableArray2.default)(memoItemList), [(0, _objectSpread2.default)({
-        displayed: itemVisible || visibleParent
-      }, item)]),
-      s: itemSelected && memoSelected,
-      u: !itemSelected && memoUnselected,
-      v: itemVisible || visibleParent || memoVisible
-    };
-  }, {
-    l: [],
-    s: true,
-    u: true,
-    v: visibleParent
-  });
-}
-
-var styles = function styles(theme) {
-  return {
-    root: {
-      backgroundColor: theme.palette.background2,
-      maxWidth: 500,
-      width: '100%',
-      position: 'relative'
-    },
-    popper: {
-      // width: '100%',
-      zIndex: 1200
-    },
-    paper: {
-      borderRadius: '0px 2px',
-      maxHeight: 480,
-      transition: 'none !important'
-    },
-    labelImg: {
-      height: 18,
-      width: 'auto',
-      margin: '0 4px',
-      verticalAlign: 'middle'
-    },
-    selectIconLabel: (0, _objectSpread2.default)({
-      whiteSpace: 'nowrap',
-      overflow: 'hidden',
-      textOverflow: 'ellipsis',
-      paddingRight: 16
-    }, theme.typography.b1, {
-      display: 'inline-flex',
-      width: '100%'
-    }),
-    selectImgLabel: (0, _objectSpread2.default)({
-      whiteSpace: 'nowrap',
-      overflow: 'hidden',
-      textOverflow: 'ellipsis',
-      paddingRight: 16
-    }, theme.typography.b1, {
-      display: 'inline-flex',
-      width: '100%'
-    })
-  };
-};
-/**
- * HiNestedSelect hérite du composant HiSelect
- *
- * Sa fonction buildSelectProps construit la liste des options selon le comportement d'un object nested
- * (association parent/child via la prop children). Le composant accepte des props spécifique à cet utilisation,
- * comme disableParent ou pinnedParent. Uniquement les ids des enfants finaux (n'ayant pas d'enfants) sont considérés.
- * Comportement:
- * - si un parent est sélectionné, on ajoute tous ses enfants dans la liste des éléments sélectionné (mais pas le parent)
- * - si tous les enfants sont sélectionnés, le parent est affiché "selected".
- * - si une partie des enfants sont sélectionné, le parent est affiché "indeterminate".
- * - si aucun enfant n'est sélectionné, le parent est affiché "unselected".
- */
-
-
-exports.styles = styles;
-
-var HiNestedSelect =
-/*#__PURE__*/
-function (_React$PureComponent) {
-  (0, _inherits2.default)(HiNestedSelect, _React$PureComponent);
-
-  function HiNestedSelect(props) {
-    var _this;
-
-    (0, _classCallCheck2.default)(this, HiNestedSelect);
-    _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(HiNestedSelect).call(this, props));
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleSelect", function (event, item) {
-      var _this$props = _this.props,
-          hasAll = _this$props.hasAll,
-          multiple = _this$props.multiple,
-          onChange = _this$props.onChange,
-          options = _this$props.options,
-          value = _this$props.value;
-
-      if (!multiple) {
-        // single value
-        onChange(event, item.id, item);
-      } else if (hasAll && item.id === '_all') {
-        // ALL
-        var selectableItemIdList = getRecursiveFinalItemIdList(options);
-
-        if (value.length === selectableItemIdList.length) {
-          // unselect _all options
-          onChange(event, [], item);
-        } else {
-          // select _all options
-          onChange(event, selectableItemIdList, item);
-        }
-      } else if (item.children) {
-        // PARENT
-        var parentSelectableItemIdList = getRecursiveFinalItemIdList(item.children); // deselect parent if every selectable child id is includes in value.
-
-        if (parentSelectableItemIdList.every(function (pid) {
-          return value.includes(pid);
-        })) {
-          onChange(event, value.filter(function (vid) {
-            return !parentSelectableItemIdList.includes(vid);
-          }), item);
-        } else {
-          // select parent > add each selectable child without duplicates.
-          onChange(event, [].concat((0, _toConsumableArray2.default)(value.filter(function (vid) {
-            return !parentSelectableItemIdList.includes(vid);
-          })), (0, _toConsumableArray2.default)(parentSelectableItemIdList)), item);
-        }
-      } else if (value.includes(item.id)) {
-        // unselect item
-        onChange(event, value.filter(function (id) {
-          return id !== item.id;
-        }), item);
-      } else {
-        onChange(event, [].concat((0, _toConsumableArray2.default)(value), [item.id]), item);
-      }
-    });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "buildSelectProps", function (options) {
-      var value = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
-      var search = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '';
-      var loading = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
-      var _this$props2 = _this.props,
-          classes = _this$props2.classes,
-          disabledParent = _this$props2.disabledParent,
-          hasAll = _this$props2.hasAll,
-          iconAll = _this$props2.iconAll,
-          multiple = _this$props2.multiple,
-          nbChildrenAsInfo = _this$props2.nbChildrenAsInfo,
-          pinnedParent = _this$props2.pinnedParent,
-          translations = _this$props2.translations,
-          filterFunc = _this$props2.filterFunc; // build item list
-
-      var _buildFilteredItemLis2 = buildFilteredItemList(options, value, search, false, pinnedParent, disabledParent || !multiple, nbChildrenAsInfo, translations, filterFunc),
-          filteredItemList = _buildFilteredItemLis2.l,
-          allSelected = _buildFilteredItemLis2.s,
-          allUnselected = _buildFilteredItemLis2.u,
-          visible = _buildFilteredItemLis2.v;
-
-      var itemList = !visible ? (0, _toConsumableArray2.default)(loading ? [{
-        id: '_loading',
-        type: 'loader',
-        disabled: true,
-        centered: true,
-        hideCheckbox: true,
-        label: 'loading'
-      }] : [{
-        id: '_no_result',
-        type: 'text',
-        disabled: true,
-        centered: true,
-        hideCheckbox: true,
-        label: translations.no_result_match
-      }]) : [].concat((0, _toConsumableArray2.default)(loading ? [{
-        id: '_loading',
-        type: 'loader',
-        disabled: true,
-        centered: true,
-        hideCheckbox: true,
-        label: 'loading'
-      }] : []), (0, _toConsumableArray2.default)(hasAll ? [{
-        id: '_all',
-        iconAll: iconAll,
-        label: translations.all,
-        selected: allSelected,
-        indeterminate: !allSelected && !allUnselected,
-        displayed: search === ''
-      }] : []), (0, _toConsumableArray2.default)(filteredItemList)); // build input value
-
-      var inputValue = '';
-
-      if (allSelected) {
-        inputValue = translations.all;
-      } else if (value.length > 1) {
-        inputValue = translations.n_items_selected.replace('%s', value.length);
-      } else if (value.length === 1) {
-        var selectedItem = findFinalItemRecursively(options, value[0]);
-
-        if (selectedItem === false) {
-          inputValue = translations.one_item_selected;
-        } else if (selectedItem.type === 'icon') {
-          inputValue = _react.default.createElement("span", {
-            className: classes.selectIconLabel
-          }, _react.default.createElement(_HiIcon.default, {
-            className: classes.labelIcon,
-            icon: selectedItem.icon
-          }), selectedItem.label);
-        } else if (selectedItem.type === 'image') {
-          inputValue = _react.default.createElement("span", {
-            className: classes.selectImgLabel
-          }, _react.default.createElement("img", {
-            className: classes.labelImg,
-            src: selectedItem.img,
-            alt: selectedItem.label
-          }), selectedItem.label);
-        } else {
-          inputValue = selectedItem.label;
-        }
-      }
-
-      return {
-        itemList: itemList,
-        inputValue: inputValue
-      };
-    });
-    _this.handleSelect = _this.handleSelect.bind((0, _assertThisInitialized2.default)(_this));
-    return _this;
-  }
-  /**
-   * Call onChange with the updated value
-   *
-   * - handle single value
-   * - handle multiple value
-   * - handle '_all' id
-   *
-   * @param event
-   * @param item
-   */
-
-
-  (0, _createClass2.default)(HiNestedSelect, [{
-    key: "render",
-    value: function render() {
-      var _this$props3 = this.props,
-          hasAll = _this$props3.hasAll,
-          hiSelectableListProps = _this$props3.hiSelectableListProps,
-          multiple = _this$props3.multiple,
-          options = _this$props3.options,
-          searchable = _this$props3.searchable,
-          translations = _this$props3.translations,
-          value = _this$props3.value,
-          other = (0, _objectWithoutProperties2.default)(_this$props3, ["hasAll", "hiSelectableListProps", "multiple", "options", "searchable", "translations", "value"]);
-
-      if (multiple) {
-        if (!Array.isArray(value)) {
-          throw new Error('HiPay Material-UI: the `value` property must be an array ' + 'when using the `HiSelect` component with `multiple`.');
-        }
-      }
-
-      return _react.default.createElement(_HiSelect.default, (0, _extends2.default)({
-        buildSelectProps: this.buildSelectProps,
-        hasAll: hasAll,
-        hiSelectableListProps: (0, _objectSpread2.default)({
-          onSelect: this.handleSelect
-        }, hiSelectableListProps),
-        multiple: multiple,
-        options: options,
-        searchable: searchable,
-        translations: translations,
-        value: value
-      }, other));
-    }
-  }]);
-  return HiNestedSelect;
-}(_react.default.PureComponent);
-
-(0, _defineProperty2.default)(HiNestedSelect, "defaultProps", {
-  disabledParent: false,
-  displayAsChip: false,
-  hasAll: false,
-  multiple: false,
-  pinnedParent: false,
-  searchable: false,
-  translations: {
-    all: 'All',
-    no_result_match: 'No result match',
-    search: 'Search',
-    n_items_selected: '%s items selected',
-    one_item_selected: '%s item selected',
-    n_children: '%s',
-    one_child: '%s item'
-  },
-  filterFunc: filterValue
-});
-
-var _default = (0, _styles.withStyles)(styles, {
-  hiComponent: true,
-  name: 'HmuiHiNestedSelect'
-})(HiNestedSelect);
-
-exports.default = _default;